/* task_item */
.task_item { position: relative; margin: calc(2vmax + 30px) auto; padding: 3%; width: min(100%, 750px); border-radius: 2.5em; }
.task_item:before { position: absolute; margin: -15px; background-clip: padding-box, border-box; background-origin: padding-box, border-box; background-image: linear-gradient(to bottom, #b37c4a 0%,#d4aa7b 100%), linear-gradient(to bottom, #7a4c21 0%,#cc9865 36%,#ecddbe 69%,#825836 100%); border: 4px solid transparent; border-radius: inherit; display: block; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; content: ""; }
.task_item:after { position: absolute; background: linear-gradient(to bottom, #fff, #f7f0e7 100%); border-radius: 2em; display: block; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; content: ""; }
.task_item [class*="item_"] { position: relative; z-index: 3; }
.task_item .item_top [class*="top_"] { padding: .2em 1em; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
.task_item .item_top h3 { width: 1%; flex: 1 1 auto; font-size: 1.6em; color: #8d110c; }
.task_item .item_top button { margin-left: 1em; width: 119px; aspect-ratio: 119/39; background: url(img/icon_black.webp) no-repeat 50% / cover; text-align: center; font-size: 1em; font-weight: bold; letter-spacing: .3em; text-indent: .3em; color: #fff; }
.task_item .item_top button.btn_red { background-image: url(img/icon_red.webp); }
.task_item .item_top button.btn_gray { background-image: url(img/icon_gray.webp); letter-spacing: 0; text-indent: 0; color: #000; }
.task_item .item_top article { width: 1%; flex: 1 1 auto; }
.task_item .item_top a[data-action="open_body"] { margin-left: 1em; padding: .3em; width: 100px; border: 1px #8e0f0f solid; border-radius: 1.3em; display: inline-flex; justify-content: center; align-items: center; font-size: .75em; letter-spacing: .2em; text-indent: .2em; color: #8e0f0f; }
.task_item .item_top a[data-action="open_body"]:after { margin-left: .3em; width: .8em; height: .5em; background: #8e0f0f; clip-path: polygon(50% 100%, 0 0, 100% 0); content: ""; }
.task_item .item_top .border_b { margin-bottom: .8em; border-bottom: 1px #e1d5c0 solid; }
.task_item .item_top .info_box { align-items: flex-start; }
.task_item .item_body { margin-top: 1em; padding: 1em 1.5em; background: #fff; border-radius: 1.5em; display: none; -webkit-transition: none; transition: none; }
.task_item .item_body [class*="body_"]:not(:last-child) { margin-bottom: 1em; }
.task_item .item_body .tab { margin-bottom: .5em; padding: .2em .5em .4em; background: #af6f1c; border-radius: .6em; display: inline-block; line-height: 1; color: #fff; }
.task_item .item_body article { margin-left: .5em; }
.task_item .item_body ol { margin-left: 1.8em; list-style: decimal; }

.onetime .task_item:before { background-image: linear-gradient(to bottom, #9a140e 0%,#710008 100%), linear-gradient(to bottom, #5e000e 0%,#94001b 36%,#bc5c6e 69%,#4a0510 100%); }

#bonus_list table { width: min(100%, 494px); }