@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@600;900&family=Noto+Sans+JP:wght@100..900&family=Zen+Kaku+Gothic+Antique:wght@700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Anonymous+Pro:ital,wght@0,400;0,700;1,400;1,700&display=swap");
@font-face { font-family: "cinecaption"; src: url("/themes/zutomayo-card/_assets/fonts/cinecaption226.ttf") format("truetype"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "Alexandria"; src: url("../fonts/Alexandria.ttf") format("truetype"); font-weight: bold; font-style: normal; font-display: swap; }
.col_bk { color: #000000; }

.col_bk2 { color: #222222; }

.col_bk3 { color: #282828; }

.col_wh { color: #ffffff; }

.col_rd { color: #E10000; }

.col_Bg { color: #F5F5F5; }

.col_gy { color: #DCDDDD; }

.col_gy2 { color: #454545; }

.col_gy3 { color: #D9D9D9; }

.col_gy4 { color: #D4D4D4; }

.col_gy5 { color: #F2F2F2; }

.col_gy6 { color: #E9E9E9; }

.col_gn { color: #36AE37; }

.col_gn2 { color: #2F8E3A; }

.col_pp { color: #422881; }

.col_ye { color: #F0E400; }

.col_or { color: #FF7300; }

.wysiwyg, .ztc-wysiwyg { max-width: 1240px; margin: 0 auto; padding: 41px 45px; }
.wysiwyg *, .ztc-wysiwyg * { font-feature-settings: "palt"; letter-spacing: 0.04rem; word-break: normal; }
@media screen and (max-width: 768px) { .wysiwyg, .ztc-wysiwyg { padding: 20px 20px; } }
.wysiwyg h1, .ztc-wysiwyg h1 { margin-top: 36px; font-family: "Noto Sans JP", sans-serif; font-weight: 800; font-style: normal; font-size: 24px; line-height: 36px; color: #282828; }
@media screen and (max-width: 768px) { .wysiwyg h1, .ztc-wysiwyg h1 { font-size: 20px; line-height: 34px; margin-top: 10px; } }
.wysiwyg h2, .ztc-wysiwyg h2 { margin-top: 30px; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; line-height: 32px; color: #282828; }
@media screen and (max-width: 768px) { .wysiwyg h2, .ztc-wysiwyg h2 { font-size: 18px; line-height: 30px; } }
.wysiwyg h3, .ztc-wysiwyg h3 { background-color: #422881; color: #ffffff; font-size: 18px; padding: 12px 20px; margin-top: 30px; font-family: "Zen Kaku Gothic Antique", sans-serif; font-weight: 700; font-style: normal; line-height: 26px; }
@media screen and (max-width: 768px) { .wysiwyg h3, .ztc-wysiwyg h3 { font-size: 16px; padding: 8px 12px; line-height: 25px; } }
.wysiwyg h4, .ztc-wysiwyg h4 { font-family: "Zen Kaku Gothic Antique", sans-serif; font-weight: 700; font-style: normal; font-size: 18px; line-height: 26px; color: #282828; margin-top: 36px; border-bottom: 1px solid #282828; padding-bottom: 12px; }
@media screen and (max-width: 768px) { .wysiwyg h4, .ztc-wysiwyg h4 { font-size: 16px; } }
.wysiwyg .errata-reason h4, .wysiwyg .errata-exchange h4, .wysiwyg .errata-usage h4, .ztc-wysiwyg .errata-reason h4, .ztc-wysiwyg .errata-exchange h4, .ztc-wysiwyg .errata-usage h4 { border-bottom: unset; padding-bottom: unset; }
.wysiwyg h5, .ztc-wysiwyg h5 { font-family: "Zen Kaku Gothic Antique", sans-serif; font-weight: 700; font-style: normal; font-size: 14px; line-height: 26px; color: #ffffff; background-color: #000000; margin-top: 35px; padding: 6px 10px; font-weight: 500; margin: 20px 0 5px; letter-spacing: 1px; }
@media screen and (max-width: 768px) { .wysiwyg h5, .ztc-wysiwyg h5 { padding: 8px 12px; line-height: 22px; } }
.wysiwyg p, .ztc-wysiwyg p { font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-style: normal; font-size: 14px; line-height: 24px; margin-top: 12px; }
.wysiwyg .en-head, .ztc-wysiwyg .en-head { font-family: "Cinzel", serif; font-weight: 900; font-style: normal; color: #422881; font-size: 60px; display: inline-block; margin-bottom: 10px; margin-top: 20px; }
@media screen and (max-width: 768px) { .wysiwyg .en-head, .ztc-wysiwyg .en-head { font-size: 10vw; line-height: 1; } }
.wysiwyg .en-head span, .ztc-wysiwyg .en-head span { background-color: #000000; color: #ffffff; font-size: 14px; font-weight: 500; display: inline-block; margin-left: 12px; padding: 7px 10px; letter-spacing: 2px; line-height: 1; position: relative; bottom: 7px; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; }
@media screen and (max-width: 768px) { .wysiwyg .en-head span, .ztc-wysiwyg .en-head span { font-size: 12px; margin-left: 0; bottom: 3vw; padding: 5px 7px; } }
.wysiwyg a.btn, .ztc-wysiwyg a.btn { display: flex; align-items: center; justify-content: center; min-width: 169px; width: fit-content; padding: 10px 30px; min-height: 38px; height: fit-content; border-radius: 60px; font-size: 15px; text-decoration: none; font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-style: normal; transition: background-color .3s ease; margin: 20px auto 0; line-height: 1.5; }
.wysiwyg a.btn:hover, .ztc-wysiwyg a.btn:hover { cursor: pointer; }
.wysiwyg a.btn.purple, .ztc-wysiwyg a.btn.purple { background: #422881; color: #ffffff; }
.wysiwyg a.btn.purple:hover, .ztc-wysiwyg a.btn.purple:hover { background-color: #36AE37; }
.wysiwyg a.btn.black, .ztc-wysiwyg a.btn.black { background: #000000; color: #ffffff; }
.wysiwyg a.btn.black:hover, .ztc-wysiwyg a.btn.black:hover { background-color: #36AE37; }
.wysiwyg a.btn.white, .ztc-wysiwyg a.btn.white { background: #ffffff; color: #000000; border: 1px solid #000000; }
.wysiwyg a.btn.white:hover, .ztc-wysiwyg a.btn.white:hover { background-color: #F2F2F2; }
.wysiwyg a.btn.orange, .ztc-wysiwyg a.btn.orange { background: #FF7300; color: #ffffff; }
.wysiwyg a.btn.orange:hover, .ztc-wysiwyg a.btn.orange:hover { background-color: rgba(255, 115, 0, 0.5); }
.wysiwyg a.btn.noevent, .ztc-wysiwyg a.btn.noevent { filter: grayscale(100%); pointer-events: none; cursor: default; opacity: 0.4; }
.wysiwyg a.btn.special, .ztc-wysiwyg a.btn.special { min-width: 280px; max-width: 300px; padding: 10px 30px; border-radius: 100vw; background-color: #422881; color: #ffffff; font-size: 23px; display: block; box-sizing: border-box; border: solid 1px #000000; text-align: center; position: relative; overflow: hidden; line-height: 1.2; z-index: 1; font-family: "Cinzel", serif; font-weight: 900; font-style: normal; }
.wysiwyg a.btn.special span, .ztc-wysiwyg a.btn.special span { font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 11px; font-weight: 500; display: block; }
@media screen and (max-width: 768px) { .wysiwyg a.btn.special, .ztc-wysiwyg a.btn.special { padding: 12px 20px; max-width: 250px; min-width: auto; width: 100%; } }
.wysiwyg a.btn.special:before, .wysiwyg a.btn.special:after, .ztc-wysiwyg a.btn.special:before, .ztc-wysiwyg a.btn.special:after { content: ""; width: 20px; height: 25px; background-image: url(../img/kirakira_ye.png); background-size: cover; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); pointer-events: none; }
.wysiwyg a.btn.special:before, .ztc-wysiwyg a.btn.special:before { left: 20px; right: auto; }
.wysiwyg a.btn.special:after, .ztc-wysiwyg a.btn.special:after { left: auto; right: 20px; }
.wysiwyg a.btn.special:hover, .ztc-wysiwyg a.btn.special:hover { background-color: #36AE37; }
.wysiwyg a, .ztc-wysiwyg a { color: #422881; transition: 0.3s; border: unset; text-decoration: underline; }
.wysiwyg a:hover, .ztc-wysiwyg a:hover { color: #36AE37; opacity: .75; }
.wysiwyg a::after, .ztc-wysiwyg a::after { content: none; }
.wysiwyg .img, .ztc-wysiwyg .img { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px; margin-top: 60px; }
@media screen and (max-width: 768px) { .wysiwyg .img, .ztc-wysiwyg .img { margin-top: 30px; gap: 15px 5px; } }
.wysiwyg .img.two-block > img, .wysiwyg .img.two-block figure, .ztc-wysiwyg .img.two-block > img, .ztc-wysiwyg .img.two-block figure { width: calc((100% / 2) - 20px); max-width: 566px; }
@media screen and (max-width: 768px) { .wysiwyg .img.two-block > img, .wysiwyg .img.two-block figure, .ztc-wysiwyg .img.two-block > img, .ztc-wysiwyg .img.two-block figure { max-width: 100%; width: calc((100% / 2) - 5px); } }
.wysiwyg .img.three-block > img, .wysiwyg .img.three-block figure, .ztc-wysiwyg .img.three-block > img, .ztc-wysiwyg .img.three-block figure { width: calc((100% / 3) - 20px); max-width: 360px; }
@media screen and (max-width: 768px) { .wysiwyg .img.three-block > img, .wysiwyg .img.three-block figure, .ztc-wysiwyg .img.three-block > img, .ztc-wysiwyg .img.three-block figure { max-width: 100%; width: calc((100% / 3) - 5px); } }
.wysiwyg .img.four-block > img, .wysiwyg .img.four-block figure, .ztc-wysiwyg .img.four-block > img, .ztc-wysiwyg .img.four-block figure { width: calc((100% / 4) - 20px); }
@media screen and (max-width: 768px) { .wysiwyg .img.four-block > img, .wysiwyg .img.four-block figure, .ztc-wysiwyg .img.four-block > img, .ztc-wysiwyg .img.four-block figure { max-width: 100%; width: calc((100% / 2) - 5px); } }
.wysiwyg figcaption, .ztc-wysiwyg figcaption { font-size: 11px; }
.wysiwyg dl, .ztc-wysiwyg dl { margin-bottom: 20px; }
.wysiwyg dl dt, .ztc-wysiwyg dl dt { margin: 20px 0 5px; padding-left: 5px; background-color: #422881; font-size: 14px; line-height: 1; display: inline-block; padding: 5px 10px; letter-spacing: 1px; color: #ffffff; }
.wysiwyg dl dd, .ztc-wysiwyg dl dd { display: block; margin: 0; }
.wysiwyg table, .ztc-wysiwyg table { max-width: 100%; box-sizing: border-box; font-size: 0.9rem; border-collapse: collapse; margin-bottom: 1em; border: none; font-size: 13px; }
.wysiwyg table thead, .ztc-wysiwyg table thead { background-color: #000000; }
.wysiwyg table thead th, .ztc-wysiwyg table thead th { background-color: #000000; color: #ffffff; padding: 0.75em 1em; font-weight: 400; }
@media screen and (max-width: 768px) { .wysiwyg table thead th, .ztc-wysiwyg table thead th { font-size: 0.9em; padding: 0.25em 0.25em; } }
.wysiwyg table tbody, .ztc-wysiwyg table tbody { border-top: solid 1px #000000; }
.wysiwyg table tbody tr, .ztc-wysiwyg table tbody tr { border-right: solid 1px #000000; border-bottom: solid 1px #000000; font-size: 13px; }
.wysiwyg table tbody th, .ztc-wysiwyg table tbody th { border-left: solid 1px #000000; padding: 0.75em 1em; background-color: #000000; color: #ffffff; font-weight: 300; font-size: 13px; }
@media screen and (max-width: 768px) { .wysiwyg table tbody th, .ztc-wysiwyg table tbody th { font-size: 11px; padding: 0.25em 0.25em; width: 9em; } }
.wysiwyg table tbody td, .ztc-wysiwyg table tbody td { border-left: solid 1px #000000; padding: 0.75em 1em; font-size: 13px; }
@media screen and (max-width: 768px) { .wysiwyg table tbody td, .ztc-wysiwyg table tbody td { font-size: 11px; padding: 0.25em 0.5em; } }
.wysiwyg iframe, .ztc-wysiwyg iframe { border: none; max-width: 100%; aspect-ratio: 16/9; width: 100%; height: 100%; }
.wysiwyg .ticket-price, .ztc-wysiwyg .ticket-price { display: flex; align-items: center; justify-content: flex-start; width: 100%; column-gap: 3vw; }
.wysiwyg .ticket-price dt, .ztc-wysiwyg .ticket-price dt { flex: 1; margin: 0; padding: 0 0.5em 0 0; border-right: solid 1px #ccc; font-size: 1.75em; }
@media screen and (max-width: 449px) { .wysiwyg .ticket-price dt, .ztc-wysiwyg .ticket-price dt { font-size: 15px; font-size: 15px; } }
.wysiwyg .ticket-price dd, .ztc-wysiwyg .ticket-price dd { width: 7em; font-size: 2em; margin: 0; padding: 0; }
@media screen and (max-width: 449px) { .wysiwyg .ticket-price dd, .ztc-wysiwyg .ticket-price dd { font-size: 20px; font-size: 20px; }
  .wysiwyg .ticket-price dd small, .ztc-wysiwyg .ticket-price dd small { font-size: 12px; font-size: 12px; } }
.wysiwyg .bg-box, .ztc-wysiwyg .bg-box { background: #422881; color: #ffffff; border-radius: 10px; padding: 20px 10px; font-weight: 500; text-align: center; line-height: 2; margin: 20px 0; }
.wysiwyg ul, .ztc-wysiwyg ul { margin: 20px 0; }
.wysiwyg ul li, .ztc-wysiwyg ul li { padding-left: 14px !important; position: relative; margin-bottom: 10px; }
.wysiwyg ul li:last-child, .ztc-wysiwyg ul li:last-child { margin-bottom: 0; }
.wysiwyg ul li:before, .ztc-wysiwyg ul li:before { content: "●"; color: #422881; font-size: 8px; position: absolute; top: 6px; left: 0; }
.wysiwyg ul.caution, .ztc-wysiwyg ul.caution { list-style: none; margin: 1em 0; padding: 0; }
.wysiwyg ul.caution li, .ztc-wysiwyg ul.caution li { line-height: 1.4; list-style: none; text-indent: -1em; margin-left: 1em; }
.wysiwyg .scroll-hint, .ztc-wysiwyg .scroll-hint { overflow: hidden; }
@media screen and (max-width: 768px) { .wysiwyg .scroll-hint, .ztc-wysiwyg .scroll-hint { overflow-x: scroll; } }
.wysiwyg .scroll-hint table, .ztc-wysiwyg .scroll-hint table { width: 100%; max-width: 100%; }
@media screen and (max-width: 768px) { .wysiwyg .scroll-hint table, .ztc-wysiwyg .scroll-hint table { width: 200%; max-width: initial; }
  .wysiwyg .scroll-hint table th, .wysiwyg .scroll-hint table td, .ztc-wysiwyg .scroll-hint table th, .ztc-wysiwyg .scroll-hint table td { white-space: nowrap; } }
.wysiwyg .table-type-sp table, .ztc-wysiwyg .table-type-sp table { font-size: 0.9rem; }
.wysiwyg .table-type-sp table td .th, .ztc-wysiwyg .table-type-sp table td .th { display: none; }
@media screen and (max-width: 768px) { .wysiwyg .table-type-sp table, .ztc-wysiwyg .table-type-sp table { width: 100%; }
  .wysiwyg .table-type-sp table thead, .ztc-wysiwyg .table-type-sp table thead { display: none; }
  .wysiwyg .table-type-sp table tbody tr, .ztc-wysiwyg .table-type-sp table tbody tr { display: block; border: solid 1px #000000; margin-bottom: 5px; }
  .wysiwyg .table-type-sp table tbody tr:last-child, .ztc-wysiwyg .table-type-sp table tbody tr:last-child { margin-bottom: 0; }
  .wysiwyg .table-type-sp table tbody tr th, .ztc-wysiwyg .table-type-sp table tbody tr th { border: none; }
  .wysiwyg .table-type-sp table tbody tr td, .ztc-wysiwyg .table-type-sp table tbody tr td { display: flex; align-items: stretch; justify-content: flex-start; width: 100% !important; border: none; border-top: solid 1px #000000; padding: 0; height: auto !important; }
  .wysiwyg .table-type-sp table tbody tr td .th, .ztc-wysiwyg .table-type-sp table tbody tr td .th { width: 5rem; display: block; background-color: #000000; color: #ffffff; padding: 5px; line-height: 1.2; font-size: 0.75rem; }
  .wysiwyg .table-type-sp table tbody tr td .td, .ztc-wysiwyg .table-type-sp table tbody tr td .td { flex: 1; padding: 5px; line-height: 1.2; } }
.wysiwyg b, .wysiwyg strong, .ztc-wysiwyg b, .ztc-wysiwyg strong { font-weight: bold; }
.wysiwyg .streaming-frame, .ztc-wysiwyg .streaming-frame { display: flex; align-items: stretch; justify-content: space-between; gap: 20px; margin: 0 -16px 30px; flex-direction: column; gap: 10px; }
.wysiwyg .streaming-video, .ztc-wysiwyg .streaming-video { flex: 1; width: 100%; font-size: 0; line-height: 0; }
.wysiwyg .streaming-video iframe, .ztc-wysiwyg .streaming-video iframe { aspect-ratio: 4/3; }
.wysiwyg .streaming-chat, .ztc-wysiwyg .streaming-chat { width: 30%; width: 100%; font-size: 0; line-height: 0; }
.wysiwyg .streaming-chat iframe, .ztc-wysiwyg .streaming-chat iframe { aspect-ratio: 9/12; }

.faq--list dt { color: #000000; border-bottom: solid 1px #454545; position: relative; font-weight: 400; font-size: 1.2em !important; margin-bottom: 10px; }
.faq--list dt::before { content: "Q."; }
.faq--list dd { margin-bottom: 1em; font-size: 1em; line-height: 1.8; margin-left: 1em; }

*, *::before, *::after { box-sizing: border-box; }

/* 余白リセット */
html, body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, figure, blockquote, fieldset, legend { margin: 0; padding: 0; }

h1 { margin: 0; font-size: inherit; font-weight: inherit; }

/* リストのデフォルトスタイル削除 */
ul, ol { list-style: none; }

/* aタグは色を外して継承 */
a { color: inherit; text-decoration: none; }

/* img は親幅にフィット */
img, video { max-width: 100%; height: auto; }

/* ボタンのデフォルト解除 */
button, input, select, textarea { border: none; background: none; font: inherit; color: inherit; }

button { cursor: pointer; }

/* テキストエリアのリサイズを縦のみに */
textarea { resize: vertical; }

/* Table の初期化 */
table { border-collapse: collapse; border-spacing: 0; }

/* HTML 全体の設定（デフォルト） */
html { scroll-behavior: smooth; }

body { position: relative; overflow-x: hidden; font-size: 13px; line-height: 1.7; font-weight: 400; overflow: hidden; overflow-y: scroll; margin: 0; padding: 0; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-weight: 400; font-style: normal; }
@media screen and (max-width: 449px) { body { font-size: 13px; font-size: 13px; } }
body.fixed { overflow: hidden; position: fixed; width: 100%; }

strong { font-weight: 700; }

input, button { transition: all 0.3s; opacity: 1; }
input:hover, button:hover { opacity: 0.7; }

ul, ol, li { list-style: none; margin: 0; padding: 0; }

h1, h2, h3, h4, h5, h6, figure, p { margin: 0; }

fieldset, legend { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }

img { max-width: 100%; height: auto; }

*:focus { outline: none !important; }

.col-red { color: #E10000; }

.require { font-weight: 700; color: #E10000; }

.alert { font-weight: 700; margin-bottom: 2em; }
.alert-dismissible { color: #E10000; }

.text-align { text-align: center; }

.align-left { text-align: left; width: 100%; max-width: 100%; }

.align-center { text-align: center; width: 100%; max-width: 100%; }

.align-right { text-align: right; width: 100%; max-width: 100%; }

.pt-0 { padding-top: 0 !important; }

.grecaptcha-badge { visibility: hidden; z-index: 99; }

.sp, .only-sp { display: none !important; }
@media screen and (max-width: 768px) { .sp, .only-sp { display: block !important; } }

.pc, .only-pc { display: block !important; }
@media screen and (max-width: 768px) { .pc, .only-pc { display: none !important; } }

.no-link { pointer-events: none; }

.more { font-family: "Cinzel", serif; font-weight: 900; font-style: normal; font-size: 20px; }

.btn-animation-rotate { line-height: 1; overflow: hidden; display: inline-block; text-shadow: 0 -1.5em 0 #422881, 0 0 0 #422881; transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1); color: transparent; }
.btn-animation-rotate:hover { text-shadow: 0 0 0 #36AE37, 0 1.5em 0 #36AE37; }

.title-block h2 { font-family: "Cinzel", serif; font-weight: 900; font-style: normal; font-size: 90px; }
@media screen and (max-width: 768px) { .title-block h2 { font-size: 50px; } }
.title-block_wh { color: #ffffff; }
@media screen and (max-width: 768px) { .title-block_wh h2 { font-size: 30px; } }

.lower-title-block { margin-top: 58px; text-align: center; }
@media screen and (max-width: 768px) { .lower-title-block { margin-top: 32px; } }
.lower-title-block h2 { font-family: "Cinzel", serif; font-weight: 900; font-style: normal; font-size: 90px; color: #422881; line-height: 1em; }
.lower-title-block h2 span { display: block; font-size: 20px; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; margin-top: -1em; }
@media screen and (max-width: 768px) { .lower-title-block h2 { font-size: 50px; }
  .lower-title-block h2 span { font-size: 16px; margin-top: -0.5em; } }

.is-lower .contents-block { margin-top: 70px; background-color: #ffffff; border-radius: 40px; filter: drop-shadow(0px 14px 24px rgba(0, 0, 0, 0.1)); }
@media screen and (max-width: 768px) { .is-lower .contents-block { margin-top: 30px; border-radius: 20px; } }

.pagination { font-family: "Cinzel", serif; font-weight: 900; font-style: normal; color: #422881; padding-top: 70px; }
.pagination .pagination { padding-top: 0; }
.pagination ul { display: flex; justify-content: center; gap: 3em; align-items: center; }
@media screen and (max-width: 768px) { .pagination ul { gap: 10vw; } }
.pagination ul li { transition: color .3s; }
.pagination ul li:hover { color: #36AE37; }
.pagination ul li a { font-size: 25px; }
.pagination ul li.next img, .pagination ul li.prev img { min-width: 30px; height: 30px; }
.pagination ul li.current { display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; z-index: 1; pointer-events: none; }
.pagination ul li.current::before { position: absolute; content: ""; width: 60px; height: 60px; background-color: #422881; border-radius: 50px; display: block; z-index: -1; }
.pagination ul li.current a { color: #ffffff; }

.to-home { text-align: center; padding-top: 70px; padding-bottom: 180px; }
@media screen and (max-width: 768px) { .to-home { padding-top: 40px; padding-bottom: 120px; } }
.to-home a:before { content: '<<'; margin-right: .5em; }
.to-home a { transition: color .3s; font-family: "Cinzel", serif; font-weight: 900; font-style: normal; font-size: 20px; color: #422881; }
.to-home a:hover { color: #36AE37; }

.breadcrumb { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 12px; color: #422881; z-index: 10; position: relative; }
.breadcrumb ul { display: flex; gap: 8px; }
.breadcrumb li { display: flex; align-items: center; gap: 8px; }
.breadcrumb li::after { content: ""; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 7px solid #422881; }
.breadcrumb li:last-child { width: 46.875vw; overflow: hidden; display: -webkit-box; text-overflow: ellipsis; margin-right: 0; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
.breadcrumb li:last-child::after { content: none; }
.breadcrumb li.current { color: #222222; }
.breadcrumb li a { transition: 0.3s; color: #422881; white-space: nowrap; }
.breadcrumb li a:hover { color: #36AE37; transition: 0.3s; }

.grecaptcha-badge { visibility: hidden; z-index: 99; }

.n-pt { padding-top: 0; }

#status, .controls { display: none !important; }

.search-panel { margin-top: 70px; }
@media screen and (max-width: 768px) { .search-panel { margin-top: 20px; } }

.progress-loader { margin: 20px auto; padding: 200px 0; max-width: 320px; z-index: 10; position: relative; }
@media screen and (max-width: 768px) { .progress-loader { padding: 80px 0; } }
.progress-text { font-family: "Anonymous Pro", monospace; font-weight: 400; font-style: normal; font-weight: 600; font-size: 20px; margin-bottom: 8px; }
.progress-bar { width: 100%; height: 33px; border: 2px solid #000000; background: #ffffff; display: flex; align-items: center; padding: 4px; box-sizing: border-box; gap: 3px; position: relative; }
.progress-gif { width: 96px; height: 100%; right: -10px; top: -68px; z-index: -1; position: absolute; }
.progress-gif img { display: block; width: 100%; height: auto; }
.progress-cell { flex: 1; width: 10px; height: 20px; background: #D4D4D4; }
.progress-cell.active { background: #36AE37; }

.no-results { text-align: center; padding: 60px 20px; margin: 0 auto; }
.no-results-text { color: #9FA0A0; font-weight: 600; font-size: 20px; }
@media screen and (max-width: 768px) { .no-results-text { font-size: 18px; } }
.no-results-text .en { display: block; font-family: "Cinzel", serif; font-weight: 900; font-style: normal; font-weight: 900; font-size: 30px; }
@media screen and (max-width: 768px) { .no-results-text .en { font-size: 28px; } }

.nodata { font-family: "Cinzel", serif; font-weight: 900; font-style: normal; color: #422881; text-align: center !important; padding: 20px !important; font-size: 28px; }
@media screen and (max-width: 768px) { .nodata { padding: 10px; font-size: 22px; } }

.sp { display: none !important; }
@media screen and (max-width: 768px) { .sp { display: block !important; } }

.pc { display: block !important; }
@media screen and (max-width: 768px) { .pc { display: none !important; } }

.ztc-head { display: flex; align-items: center; justify-content: space-between; padding: 20px 60px; gap: 2vw; background: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, 0) 100%); transition: background-color 0.5s ease; position: absolute; top: 0; z-index: 100; width: 100%; }
@media screen and (max-width: 768px) { .ztc-head h1 { max-width: 141px; } }
@media screen and (max-width: 768px) { .ztc-head { padding-left: 1vw; padding-right: 1vw; } }
@media screen and (max-width: 768px) { .ztc-head { padding-left: 18px; } }
.ztc-head .hamburger { display: none; flex-direction: column; gap: 6px; width: 32px; height: 26px; /* メニュー開いたときのアニメ */ }
@media screen and (max-width: 768px) { .ztc-head .hamburger { display: flex; background-color: #422881; width: 60px; height: 60px; justify-content: center; gap: 11px; align-items: center; position: fixed; top: 0; right: 0; z-index: 1001; } }
.ztc-head .hamburger span { display: block; width: 30px; height: 1px; background: #ffffff; transition: .3s; }
.ztc-head .hamburger.active span:nth-child(1) { transform: translateY(13px) rotate(45deg); }
.ztc-head .hamburger.active span:nth-child(2) { opacity: 0; }
.ztc-head .hamburger.active span:nth-child(3) { transform: translateY(-11px) rotate(-45deg); }
.ztc-head .hamburger.active { background-color: #000000; }
.ztc-head .global-nav { display: flex; gap: 25px; }
@media screen and (max-width: 768px) { .ztc-head .global-nav { display: none; } }
.ztc-head .global-nav.open { overflow-y: auto; -webkit-overflow-scrolling: touch; display: flex; height: 100vh; z-index: 3; background-image: url(/themes/zutomayo-card/_assets/img/humbarger-bg.jpg); position: fixed; top: 0; right: 0; width: 100%; flex-direction: column; padding: 50px 30px 50px; gap: 30px; align-items: center; background-size: cover; background-repeat: no-repeat; }
.ztc-head .global-nav.open .humbarger-logo { max-width: 210px; width: 100%; }
.ztc-head .global-nav.open .humbarger-logo img { width: 100%; }
.ztc-head .global-nav.open .header-sns { display: flex; padding-top: 40px; gap: 20px; }
.ztc-head .global-nav.open .header-sns img { width: 50px; }
.ztc-head .global-nav li { font-family: "Cinzel", serif; font-weight: 900; font-style: normal; font-size: clamp(15px, 1.7vw, 20px); white-space: nowrap; }
@media screen and (max-width: 768px) { .ztc-head .global-nav li { font-size: 25px; } }
.ztc-head .global-nav li span { font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-style: normal; font-size: 10px; display: block; text-align: center; line-height: 6px; }
.ztc-head .global-nav li a { color: #ffffff; letter-spacing: initial; transition: letter-spacing 0.45s cubic-bezier(0.16, 1, 0.3, 1), color 0.3s ease; }
.ztc-head .global-nav li a:hover { color: #36AE37; letter-spacing: 0.15em; }
.ztc-head .global-nav li a:hover span { color: #36AE37; letter-spacing: 0; }
.ztc-head .global-nav li.cardlist { position: relative; transition: 0.45s; z-index: 1; }
.ztc-head .global-nav li.cardlist a { position: relative; padding-left: 14px; }
.ztc-head .global-nav li.cardlist a:hover { color: #ffffff; letter-spacing: initial; }
.ztc-head .global-nav li.cardlist a:hover span { color: #ffffff; }
.ztc-head .global-nav li.cardlist a::before { content: ""; position: absolute; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 7px solid #ffffff; left: 0; top: 40%; transform: translateY(-50%); }
.ztc-head .global-nav li.cardlist::after { content: ""; position: absolute; opacity: 0; transition: opacity .3s; width: 0; z-index: -1; height: 0%; }
@media screen and (max-width: 768px) { .ztc-head .global-nav li.cardlist::after { content: none; position: relative; } }
.ztc-head .global-nav li.cardlist:hover::after { width: 115%; height: 390%; max-height: 128px; opacity: 1; top: -10px; left: -8px; border-radius: 10px; background: rgba(0, 0, 0, 0.7); max-width: 148px; }
.ztc-head .global-nav li.cardlist:hover .cardlist-sub { display: block; padding: 10px 5px; }
@media screen and (max-width: 768px) { .ztc-head .global-nav li.cardlist:hover .cardlist-sub { padding: 0; } }
.ztc-head .global-nav li.cardlist .cardlist-sub { font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-style: normal; font-size: 12px; position: absolute; left: 0; display: none; top: 130%; display: none; width: 100%; }
.ztc-head .global-nav li.cardlist .cardlist-sub::before { content: ""; border-top: 1px solid rgba(255, 255, 255, 0.2); width: 114%; top: 2px; display: block; position: absolute; left: -6px; width: 115%; max-width: 148px; }
@media screen and (max-width: 768px) { .ztc-head .global-nav li.cardlist .cardlist-sub::before { content: none; } }
@media screen and (max-width: 768px) { .ztc-head .global-nav li.cardlist .cardlist-sub { display: block; position: static; border-top: none; text-align: center; font-size: 14px; margin-top: 20px; line-height: 26px; } }
.ztc-head .global-nav li.cardlist .cardlist-sub a:before { content: none; }
.ztc-head .global-nav li.cardlist .cardlist-sub a { display: block; padding-left: 10%; color: #ffffff; text-decoration: none; line-height: 22px; }
@media screen and (max-width: 768px) { .ztc-head .global-nav li.cardlist .cardlist-sub a { width: fit-content; margin: auto; padding-left: 0; } }
@media screen and (max-width: 768px) { .ztc-head .global-nav li.cardlist .cardlist-sub a:first-child { margin-bottom: 10px; } }
.ztc-head .global-nav li.cardlist .cardlist-sub a.only-sp { display: none; }
@media screen and (max-width: 768px) { .ztc-head .global-nav li.cardlist .cardlist-sub a.only-sp { display: block; } }
.ztc-head .global-nav li.cardlist .cardlist-sub a:hover { color: #36AE37; }
.ztc-head .global-nav li.cardlist .cardlist-sub a:hover::before { content: ''; background-image: url(/themes/zutomayo-card/_assets/img/star-green.svg); width: 9px; height: 13px; border: none; background-repeat: no-repeat; margin-top: 3px; left: -3px; }
@media screen and (max-width: 768px) { .ztc-head .global-nav li.cardlist .cardlist-sub a:hover::before { left: -15px; } }
.ztc-head .global-nav li.cardlist .cardlist-sub a::first-child { padding-top: 10px; }
.ztc-head .global-nav li.cardlist .cardlist-sub a::first-child:hover::before { margin-top: 7px; }

.fixed-head { position: fixed; top: -100px; left: 0; width: 100%; background: rgba(66, 40, 129, 0.95); z-index: 1000; padding: 13px 60px; transition: top 0.5s ease, background-color 0.5s ease; height: 80px; }
.fixed-head.is-show { top: 0; }
.fixed-head h1 { max-width: 138px; }
@media screen and (max-width: 768px) { .fixed-head { background: none; }
  .fixed-head h1 { display: none; } }
@media (max-width: 1024px) { .fixed-head { padding-left: 1vw; padding-right: 1vw; } }
@media screen and (max-width: 768px) { .fixed-head { display: none; } }

.is-lower .ztc-head { top: 0; }
@media screen and (max-width: 768px) { .is-lower .ztc-head.fixed-head { display: block; width: 60px; height: 60px; left: unset; right: 0; } }
.is-lower main { max-width: 1280px; padding: 100px 20px 0; margin: 0 auto; }
@media screen and (max-width: 768px) { .is-lower main { padding: 20px 16px 0; } }
.is-lower .ztc-news__wrap { padding: 0; }

#ztc-loading { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: linear-gradient(135deg, #60328E 0%, #1B0E28 100%); z-index: 9999; overflow: hidden; }
#ztc-loading.fade-out { animation: fadeOut 0.8s ease-out forwards; }

.ztc-loading__content { position: relative; width: 100%; height: 100%; transform: rotate(-15deg); transform-origin: center center; top: -30%; left: -10%; }
@media screen and (max-width: 449px) { .ztc-loading__content { top: -20%; left: -30%; } }
.ztc-loading__content .card { width: 180px; height: 250px; border-radius: 12px; background-size: cover; background-position: center; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5); flex-shrink: 0; opacity: 0; }
@media screen and (max-width: 449px) { .ztc-loading__content .card { width: 111px; height: 154px; } }
.ztc-loading__content .card.from-left { animation: slideInLeft 0.5s ease-out forwards; }
.ztc-loading__content .card.from-right { animation: slideInRight 0.5s ease-out forwards; }
.ztc-loading__content .card-row { display: flex; gap: 20px; margin-bottom: 20px; position: relative; }
@media screen and (max-width: 449px) { .ztc-loading__content .card-row { gap: 12px; margin-bottom: 12px; } }

@keyframes fadeOut { to { opacity: 0; visibility: hidden; } }
@keyframes slideInLeft { from { transform: translateX(-200px); opacity: 0; }
  to { transform: translateX(0); opacity: 1; } }
@keyframes slideInRight { from { transform: translateX(200px); opacity: 0; }
  to { transform: translateX(0); opacity: 1; } }
.ztc-footer { background-color: #222222; border-top-left-radius: 40px; border-top-right-radius: 40px; margin-top: -40px; }
.ztc-footer__top { border-bottom: 1px solid #454545; }
@media screen and (max-width: 768px) { .ztc-footer__top { border-bottom: none; } }
.ztc-footer__top .ztc-footer__wrap { max-width: 1280px; padding: 56px 20px 61px; margin: 0 auto; display: flex; justify-content: space-between; }
@media (max-width: 1095px) { .ztc-footer__top .ztc-footer__wrap { display: block; } }
@media screen and (max-width: 768px) { .ztc-footer__top .ztc-footer__wrap { display: block; padding-bottom: 0; } }
.ztc-footer__top .ztc-footer__wrap .logo-sns-block { display: flex; flex-direction: column; align-items: center; row-gap: 33px; }
.ztc-footer__top .ztc-footer__wrap .logo-sns-block h3 { max-width: 314px; width: 100%; }
.ztc-footer__top .ztc-footer__wrap .logo-sns-block h3 img { width: 100%; }
.ztc-footer__top .ztc-footer__wrap .logo-sns-block ul { display: flex; gap: 25px; }
.ztc-footer__top .ztc-footer__wrap .footer-nav { display: flex; gap: 30px; padding-top: 16px; white-space: nowrap; font-family: "Cinzel", serif; font-weight: 900; font-style: normal; font-size: 20px; }
@media (max-width: 1095px) { .ztc-footer__top .ztc-footer__wrap .footer-nav { justify-content: center; gap: 3vw; } }
@media screen and (max-width: 768px) { .ztc-footer__top .ztc-footer__wrap .footer-nav { font-size: 26px; flex-direction: column; align-items: center; gap: 20px; padding-top: 62px; text-align: center; } }
.ztc-footer__top .ztc-footer__wrap .footer-nav .sub-nav { display: block; font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-style: normal; font-size: 12px; line-height: 20px; }
.ztc-footer__top .ztc-footer__wrap .footer-nav .sub-nav::nth-of-type(1) { margin-top: 5px; }
.ztc-footer__top .ztc-footer__wrap .footer-nav a { color: #ffffff; }
.ztc-footer__top .ztc-footer__wrap .footer-nav a:hover { transition: 0.25s; color: #36AE37; }
.ztc-footer__bottom { padding: 70px 20px 80px; }
@media screen and (max-width: 768px) { .ztc-footer__bottom { padding-top: 55px; } }
.ztc-footer__bottom .bnr-discord { text-align: center; }
.ztc-footer__bottom .bnr-discord a { max-width: 482px; display: inline-block; }
.ztc-footer__bottom .logo-erea { display: flex; gap: 40px; justify-content: center; padding-top: 40px; }
@media screen and (max-width: 768px) { .ztc-footer__bottom .logo-erea { flex-direction: column; align-items: center; gap: 30px; } }
.ztc-footer__bottom .footer-menu { display: flex; justify-content: center; color: #ffffff; font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-style: normal; font-size: 14px; padding-top: 78px; }
@media screen and (max-width: 768px) { .ztc-footer__bottom .footer-menu { flex-direction: column; align-items: center; padding-top: 63px; line-height: 27px; } }
.ztc-footer__bottom .footer-menu li::after { content: '｜'; padding: 0 3px; }
@media screen and (max-width: 768px) { .ztc-footer__bottom .footer-menu li::after { content: ''; } }
.ztc-footer__bottom .footer-menu li:last-child::after { content: none; }
.ztc-footer__bottom .footer-menu li a { transition: color .3s; }
.ztc-footer__bottom .footer-menu li a:hover { color: #36AE37; }
.ztc-footer__bottom .copyrights { text-align: center; font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-style: normal; font-size: 14px; color: #ffffff; padding-top: 32px; }

.ztc-under__contents { background: #ffffff; border-radius: 40px; margin-top: 80px; filter: drop-shadow(0px 14px 24px rgba(0, 0, 0, 0.1)); }
.ztc-under__contents--top { border-bottom: 1px solid #D4D4D4; padding: 30px 40px; }
.ztc-under__contents--inner { max-width: 1240px; margin: 0 auto; padding: 41px 45px; }
.ztc-under__contents--inner h1 { margin-top: 36px; font-family: "Noto Sans JP", sans-serif; font-weight: 800; font-style: normal; font-size: 24px; line-height: 36px; color: #282828; }
@media screen and (max-width: 768px) { .ztc-under__contents--inner h1 { font-size: 20px; line-height: 34px; margin-top: 10px; } }
.ztc-under__contents--inner h2 { margin-top: 30px; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; line-height: 32px; color: #282828; }
@media screen and (max-width: 768px) { .ztc-under__contents--inner h2 { font-size: 18px; line-height: 30px; } }
.ztc-under__contents--inner h3 { background-color: #422881; color: #ffffff; font-size: 18px; padding: 12px 20px; margin-top: 30px; margin-bottom: 20px; font-family: "Zen Kaku Gothic Antique", sans-serif; font-weight: 700; font-style: normal; line-height: 26px; }
.ztc-under__contents--inner h3:first-child { margin-top: 0; }
@media screen and (max-width: 768px) { .ztc-under__contents--inner h3 { font-size: 16px; padding: 8px 12px; line-height: 25px; } }
.ztc-under__contents--inner h4 { font-family: "Zen Kaku Gothic Antique", sans-serif; font-weight: 700; font-style: normal; font-size: 18px; line-height: 26px; color: #282828; margin-top: 36px; border-bottom: 1px solid #282828; padding-bottom: 20px; }
.ztc-under__contents--inner h4:first-child { margin-top: 0; }
@media screen and (max-width: 768px) { .ztc-under__contents--inner h4 { font-size: 16px; } }
.ztc-under__contents--inner .errata-reason h4, .ztc-under__contents--inner .errata-exchange h4, .ztc-under__contents--inner .errata-usage h4 { border-bottom: unset; padding-bottom: unset; }
.ztc-under__contents--inner h5 { font-family: "Zen Kaku Gothic Antique", sans-serif; font-weight: 700; font-style: normal; font-size: 14px; line-height: 26px; color: #422881; background-color: #E9E9E9; padding: 8px 20px; margin-top: 35px; }
@media screen and (max-width: 768px) { .ztc-under__contents--inner h5 { padding: 8px 12px; line-height: 22px; } }
.ztc-under__contents--inner p { font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-style: normal; font-size: 14px; line-height: 24px; margin-bottom: 12px; }
.ztc-under__contents--inner a.btn { display: flex; align-items: center; justify-content: center; width: 169px; height: 38px; border-radius: 60px; font-size: 15px; text-decoration: none; padding: 0; line-height: 0; margin-top: 20px; font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-style: normal; transition: background-color .3s ease; margin: 20px auto 0; }
.ztc-under__contents--inner a.btn.purple { background: #422881; color: #ffffff; }
.ztc-under__contents--inner a.btn.purple:hover { background-color: #36AE37; }
.ztc-under__contents--inner a.btn.black { background: #000000; color: #ffffff; }
.ztc-under__contents--inner a.btn.black:hover { background-color: #36AE37; }
.ztc-under__contents--inner a.btn.white { background: #ffffff; color: #000000; border: 1px solid #000000; }
.ztc-under__contents--inner a.btn.white:hover { background-color: #F2F2F2; }
.ztc-under__contents--inner a.btn.orange { background: #FF7300; color: #ffffff; }
.ztc-under__contents--inner a.btn.orange:hover { background-color: rgba(255, 115, 0, 0.5); }
.ztc-under__contents--inner a.btn::after { content: none; }
.ztc-under__contents--inner .img { display: flex; justify-content: space-between; gap: 20px; margin-top: 60px; }
.ztc-under__contents--inner .img.two-block img { width: calc((100% - 20px) / 2); max-width: 566px; }
.ztc-under__contents--inner .img.three-block img { width: calc((100% - 40px) / 3); max-width: 360px; }
.ztc-under-404 { margin: 220px auto; }
@media screen and (max-width: 768px) { .ztc-under-404 { margin: 220px auto 120px; } }
.ztc-under-404--image { max-width: 586px; margin: 0 auto; }
@media screen and (max-width: 768px) { .ztc-under-404--image { max-width: 200px; } }
.ztc-under-404--image img { mix-blend-mode: multiply; width: 100%; }

.ztc-inner { max-width: 1280px; margin: 0 auto; padding: 0 20px; }
.ztc-kv { position: relative; }
.ztc-kv__list { margin-bottom: 4px; }
.ztc-kv__list .slick-slide img { width: 100%; }
@media screen and (max-width: 768px) { .ztc-kv__topics { padding: 20px; } }
.ztc-kv__topics .topics-block { position: absolute; bottom: 30px; right: 20px; }
@media screen and (max-width: 768px) { .ztc-kv__topics .topics-block { position: inherit; } }
.ztc-kv__topics .topics-block .uniguri-block { position: relative; }
.ztc-kv__topics .topics-block .uniguri-block .uniguri-image { position: absolute; right: 30px; top: -21px; z-index: 1; width: 70px; height: 70px; transition: transform .25s ease-out; }
@media screen and (max-width: 768px) { .ztc-kv__topics .topics-block .uniguri-block .uniguri-image { left: 68vw; } }
.ztc-kv__topics .topics-block .topics-bg { background-image: url(/themes/zutomayo-card/_assets/img/kv-topicsbg.png); background-repeat: no-repeat; position: relative; width: 100%; max-width: 320px; height: 230px; display: flex; flex-direction: column; justify-content: center; z-index: 2; background-position: center; background-size: cover; border-radius: 8px; box-shadow: 18px 20px 34px rgba(0, 0, 0, 0.55); padding: 0 20px; }
@media screen and (mIN-width: 1980px) { .ztc-kv__topics .topics-block .topics-bg { width: 29.8vw; max-width: 592px; height: 420px; padding: 0 30px; } }
@media screen and (max-width: 768px) { .ztc-kv__topics .topics-block .topics-bg { background-image: url(/themes/zutomayo-card/_assets/img/kv-topicsbg-sp.png); max-width: 600px; height: auto; aspect-ratio: 362 / 259.23; background-repeat: no-repeat; background-position: top center; padding: 0px 4% 0px; width: 90%; overflow: hidden; margin: 0 auto; border-radius: 8px; box-shadow: 10px 12px 20px rgba(0, 0, 0, 0.55); } }
.ztc-kv__topics .topics-block .topics-bg h2 { font-family: "Cinzel", serif; font-weight: 900; font-style: normal; font-size: 20px; color: #ffffff; text-align: center; margin-bottom: 3px; display: flex; justify-content: center; gap: 2px; line-height: 1; }
@media screen and (mIN-width: 1980px) { .ztc-kv__topics .topics-block .topics-bg h2 { font-size: 1.5vw; } }
@media screen and (max-width: 768px) { .ztc-kv__topics .topics-block .topics-bg h2 { font-size: 20px; gap: 5px; }
  .ztc-kv__topics .topics-block .topics-bg h2 span img { width: 10px; } }
@media screen and (mIN-width: 1980px) { .ztc-kv__topics .topics-block .topics-bg h2 span img { width: 18px; } }
.ztc-kv__topics .topics-block .topics-bg .slick-dotted.slick-slider { margin-bottom: 15px; }
.ztc-kv__topics .topics-block .topics-bg .slick-slide img { margin: 0 auto; width: 250px; height: 140px; object-fit: cover; }
@media screen and (mIN-width: 1980px) { .ztc-kv__topics .topics-block .topics-bg .slick-slide img { width: 510px; height: 287px; } }
@media screen and (max-width: 768px) { .ztc-kv__topics .topics-block .topics-bg .slick-slide img { width: 85%; height: auto; } }
.ztc-kv__topics .topics-block .topics-bg .slick-dots { bottom: -18px; }
@media screen and (max-width: 768px) { .ztc-kv__topics .topics-block .topics-bg .slick-dots { bottom: -14px; } }
.ztc-kv__topics .topics-block .topics-bg .slick-dots li.slick-active button:before { color: #36AE37; }
.ztc-kv__topics .topics-block .topics-bg .slick-dots li { width: 5px; height: 5px; margin: 0 3px; }
@media screen and (max-width: 768px) { .ztc-kv__topics .topics-block .topics-bg .slick-dots li { width: 7px; height: 7px; margin: 0 6px; } }
.ztc-kv__topics .topics-block .topics-bg .slick-dots li button { width: 5px; height: 5px; padding: 0; }
@media screen and (max-width: 768px) { .ztc-kv__topics .topics-block .topics-bg .slick-dots li button { width: 7px; height: 7px; } }
.ztc-kv__topics .topics-block .topics-bg .slick-dots li button:before { width: 5px; height: 5px; font-size: 5px; color: #DCDDDD; opacity: initial; line-height: initial; }
@media screen and (max-width: 768px) { .ztc-kv__topics .topics-block .topics-bg .slick-dots li button:before { width: 7px; height: 7px; font-size: 7px; } }
.ztc-kv__topics .topics-block:hover .uniguri-image { transform: translateY(-14px); }
@media screen and (max-width: 768px) { .ztc-kv__topics .topics-block:hover .uniguri-image { transform: translateY(-21px); } }
.ztc-kv__progress { height: 4px; background: #000000; overflow: hidden; margin-top: -6px; }
.ztc-kv__progress__bar { display: block; height: 100%; width: 0%; background: #36AE37; }
.ztc-bg-wrap { background-image: url(/themes/zutomayo-card/_assets/img/bg01.jpg); background-size: contain; background-position: top center; background-repeat: repeat-y; overflow: hidden; }
.ztc-bg-wrap.is-lower { background-size: 100% auto; }
.ztc-notice { background-color: #000000; }
.ztc-notice__wrap { padding: 0 20px; }
.ztc-notice__inner { display: flex; gap: 60px; align-items: center; padding: 20px 0 28px; }
@media screen and (max-width: 768px) { .ztc-notice__inner { flex-direction: column; align-items: flex-start; gap: 10px; } }
.ztc-notice__title { color: #E10000; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; padding-left: 25px; position: relative; }
.ztc-notice__title::before { content: ""; position: absolute; left: 0; width: 20px; height: 20px; background-image: url(/themes/zutomayo-card/_assets/img/notice.svg); background-size: contain; background-repeat: no-repeat; top: 50%; transform: translateY(-50%); }
.ztc-notice__items li { color: #ffffff; font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-style: normal; font-size: 14px; margin-bottom: 5px; position: relative; padding-left: 14px; transition: color .25s ease-out; }
.ztc-notice__items li:hover { color: #36AE37; }
.ztc-notice__items li:hover:before { border-left: 7px solid #36AE37; }
@media screen and (max-width: 768px) { .ztc-notice__items li { margin-bottom: 10px; } }
.ztc-notice__items li:last-child { margin-bottom: 0; }
.ztc-notice__items li::before { content: ""; position: absolute; left: 0; border-top: 4.5px solid transparent; border-bottom: 4.5px solid transparent; border-left: 7px solid #D9D9D9; top: 50%; transform: translateY(-50%); transition: border-left-color .25s ease-out; }
.ztc-story { position: relative; padding: 95px 20px 60px; }
@media screen and (max-width: 768px) { .ztc-story { padding: 0; } }
.ztc-story__wrap { position: relative; max-width: 1242px; padding: 160px 20px 70px; background-image: url("../../_assets/img/story_bg.png"); background-size: cover; background-position: top; background-repeat: no-repeat; border-radius: 50px; }
@media screen and (max-width: 768px) { .ztc-story__wrap { border-radius: 0px; padding: 40px 16px 10px; } }
.ztc-story__content { position: relative; z-index: 2; min-height: 600px; }
.ztc-story__card > div { transform-style: preserve-3d; backface-visibility: hidden; }
.ztc-story__card > div img { transition: opacity 0.1s; }
.ztc-story__card img { width: 100%; height: auto; display: block; border-radius: 10px; }
.ztc-story__card--01, .ztc-story__card--02, .ztc-story__card--03, .ztc-story__card--04, .ztc-story__card--05, .ztc-story__card--06, .ztc-story__card--07 { position: absolute; opacity: 0; }
.ztc-story__card--01.animate-card { animation: cardDealFromLeft 1.2s ease-out forwards; animation-delay: 0s; --start-x: -150vw; }
.ztc-story__card--02.animate-card { animation: cardDealFromRight 1.2s ease-out forwards; animation-delay: 0.15s; --start-x: 150vw; }
.ztc-story__card--03.animate-card { animation: cardDealFromLeft 1.2s ease-out forwards; animation-delay: 0.3s; --start-x: -150vw; }
.ztc-story__card--04.animate-card { animation: cardDealFromRight 1.2s ease-out forwards; animation-delay: 0.45s; --start-x: 150vw; }
.ztc-story__card--05.animate-card { animation: cardDealFromLeft 1.2s ease-out forwards; animation-delay: 0.6s; --start-x: -150vw; }
.ztc-story__card--06.animate-card { animation: cardDealFromRight 1.2s ease-out forwards; animation-delay: 0.75s; --start-x: 150vw; }
.ztc-story__card--07.animate-card { animation: cardDealFromRight 1.2s ease-out forwards; animation-delay: 0.9s; --start-x: 150vw; }
.ztc-story__card--01 { top: 3vw; left: 8%; max-width: 228px; width: 17vw; transform: rotate(-12deg); box-shadow: 0px 30px 44px 0px rgba(0, 0, 0, 0.4); z-index: 2; }
@media screen and (max-width: 449px) { .ztc-story__card--01 { top: 1vw; left: -1%; max-width: 80px; width: 22vw; } }
.ztc-story__card--02 { top: 45px; right: 9%; transform: rotate(22deg); max-width: 213px; width: 15vw; box-shadow: 0px 20px 24px 0px rgba(0, 0, 0, 0.2); z-index: 1; }
@media screen and (max-width: 449px) { .ztc-story__card--02 { top: 5px; right: 3%; max-width: 67px; width: 18vw; } }
.ztc-story__card--03 { top: 24vw; left: 10px; transform: rotate(17deg); max-width: 177px; width: 14vw; box-shadow: 28px 34px 54px 0px rgba(0, 0, 0, 0.35); z-index: 1; }
@media screen and (max-width: 449px) { .ztc-story__card--03 { top: 65vw; left: -10px; transform: rotate(32deg); max-width: 53px; width: 15vw; } }
.ztc-story__card--04 { top: 25vw; right: 3%; max-width: 107px; width: 8vw; transform: rotate(-14deg); box-shadow: 0px 20px 34px 0px rgba(0, 0, 0, 0.4); z-index: 2; }
@media screen and (max-width: 449px) { .ztc-story__card--04 { top: 45vw; right: -1%; max-width: 44px; width: 12vw; } }
.ztc-story__card--05 { bottom: 5vw; left: 8%; max-width: 249px; width: 17vw; transform: rotate(-17deg); box-shadow: 13px 30px 54px 0px rgba(0, 0, 0, 0.4); z-index: 2; }
@media screen and (max-width: 449px) { .ztc-story__card--05 { bottom: 10vw; left: 0%; max-width: 72px; width: 20vw; } }
.ztc-story__card--06 { top: 42vw; right: 2%; max-width: 170px; width: 12vw; transform: rotate(-27deg); box-shadow: 0px 30px 24px 0px rgba(0, 0, 0, 0.4); z-index: 2; }
@media screen and (max-width: 449px) { .ztc-story__card--06 { top: unset; right: -6%; max-width: 69px; width: 19vw; bottom: 60vw; } }
.ztc-story__card--07 { bottom: 6vw; right: 15%; transform: rotate(15deg); max-width: 177px; width: 15vw; box-shadow: 28px 34px 54px 0px rgba(0, 0, 0, 0.35); z-index: 1; }
@media screen and (max-width: 449px) { .ztc-story__card--07 { bottom: 16vw; right: 9%; transform: rotate(17deg); max-width: 53px; width: 15vw; } }
@keyframes cardDealFromRight { 0% { opacity: 0; translate: var(--start-x) 0; scale: 0.8; }
  100% { opacity: 1; translate: 0 0; scale: 1; } }
@keyframes cardDealFromLeft { 0% { opacity: 0; translate: var(--start-x) 0; scale: 0.8; }
  100% { opacity: 1; translate: 0 0; scale: 1; } }
.ztc-story__text { text-align: center; }
.ztc-story__description { margin: 40px 0 30px; }
@media screen and (max-width: 768px) { .ztc-story__description { margin: 10px 0; } }
.ztc-story__description p { line-height: 3; color: #ffffff; font-size: 20px; font-family: "cinecaption"; font-weight: 300; text-shadow: 0 4px 14px rgba(0, 0, 0, 0.5); opacity: 0; transform: translateY(5px); }
.ztc-story__description p.fade-in { animation: textFadeIn 1s ease-out forwards; }
@media screen and (max-width: 768px) { .ztc-story__description p { font-size: 15px; letter-spacing: -1px; line-height: 2; } }
@keyframes textFadeIn { 0% { opacity: 0; transform: translateY(5px); filter: blur(4px); }
  100% { opacity: 1; transform: translateY(0); filter: blur(0); } }
.ztc-story__cointoss { display: flex; align-items: center; justify-content: center; position: relative; }
.ztc-story .coin-animation-container { width: 172px; height: 172px; position: relative; perspective: 1000px; z-index: 99; transition: transform 0.25s ease-out; }
@media screen and (max-width: 768px) { .ztc-story .coin-animation-container { width: 132px; height: 132px; perspective: 0; } }
.ztc-story .coin-animation-container:hover { transform: translateY(-8px) scale(1.08); }
.ztc-story .coin-image { width: 100%; height: 100%; object-fit: contain; position: absolute; top: auto; left: auto; opacity: 0; }
@media screen and (max-width: 768px) { .ztc-story .coin-image { will-change: transform, opacity; } }
.ztc-story .coin-image.animating { animation: coinToss 2.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards; }
@media screen and (max-width: 768px) { .ztc-story .coin-image.animating { animation: coinTossSP 1.2s ease-out forwards; } }
@keyframes coinToss { 0% { transform: translateY(150px) translateX(-50%) rotateY(0deg) scale(0.8); opacity: 0; }
  10% { opacity: 1; }
  35% { transform: translateY(-100px) translateX(-50%) rotateY(1080deg) scale(1.1); }
  65% { transform: translateY(10px) translateX(-50%) rotateY(1080deg) scale(1); }
  72% { transform: translateY(-8px) translateX(-50%) rotateY(1080deg) scale(1.01); }
  79% { transform: translateY(3px) translateX(-50%) rotateY(1080deg) scale(1); }
  86% { transform: translateY(-2px) translateX(-50%) rotateY(1080deg) scale(1); }
  100% { transform: translateY(0px) translateX(-50%) rotateY(1080deg) scale(1); opacity: 1; } }
@keyframes coinTossSP { 0% { transform: translate(-50%, 250px) scaleX(1); opacity: 0; }
  12% { opacity: 1; transform: translate(-50%, 150px) scaleX(1); }
  20% { transform: translate(-50%, 80px) scaleX(0.05); }
  28% { transform: translate(-50%, 20px) scaleX(1); }
  36% { transform: translate(-50%, -20px) scaleX(0.05); }
  44% { transform: translate(-50%, -40px) scaleX(1); }
  52% { transform: translate(-50%, -50px) scaleX(0.05); }
  60% { transform: translate(-50%, -30px) scaleX(1); animation-timing-function: ease-out; }
  72% { transform: translate(-50%, 0) scaleX(1); animation-timing-function: ease-out; }
  81% { transform: translate(-50%, -8px) scaleX(1); animation-timing-function: ease-in; }
  90% { transform: translate(-50%, 0) scaleX(1); animation-timing-function: ease-out; }
  95% { transform: translate(-50%, -3px) scaleX(1); animation-timing-function: ease-in; }
  100% { transform: translate(-50%, 0) scaleX(1); opacity: 1; } }
.ztc-gallery { overflow: hidden; padding-bottom: 90px; }
@media screen and (max-width: 768px) { .ztc-gallery { padding-bottom: 30px; padding-top: 20px; } }
.ztc-gallery__wrap { max-width: 1248px; margin: 0 auto; padding: 0 20px; }
.ztc-gallery__wrap .title-block { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
@media screen and (max-width: 768px) { .ztc-gallery__wrap .title-block { justify-content: center; margin-bottom: 15px; } }
@media screen and (max-width: 768px) { .ztc-gallery__wrap .title-block .btn-animation-rotate { display: none; } }
.ztc-gallery__wrap h2 { color: #422881; }
@media screen and (max-width: 768px) { .ztc-gallery .more { color: #422881; text-align: center; padding: 0 20px; margin-top: 25px; }
  .ztc-gallery .more a { width: 100%; background-color: rgba(150, 150, 150, 0.4); border-radius: 10px; display: inline-block; text-align: center; padding: 9px 0 7px; } }
.ztc-gallery__items .gallery-box { width: 100%; min-width: 0; display: block; overflow: visible; }
.ztc-gallery__items .gallery-box.slider--normal { z-index: 1; }
.ztc-gallery__items .gallery-box.slider--rtl { z-index: 0; margin-top: 30px; }
.ztc-gallery__items .gallery-box.slider--rtl:hover { z-index: 2; }
@media screen and (max-width: 768px) { .ztc-gallery__items .gallery-box.slider--rtl { margin-top: 10px; } }
.ztc-gallery__items .gallery-box li { overflow: visible !important; }
.ztc-gallery__items .gallery-box .slick-slide { margin-left: 60px; overflow: visible !important; width: 188px; margin: 0 15px; }
@media screen and (max-width: 768px) { .ztc-gallery__items .gallery-box .slick-slide { margin-left: 13px; } }
.ztc-gallery__items .gallery-box img { filter: drop-shadow(0px 14px 10px rgba(0, 0, 0, 0.2)); position: relative; transition: .25s; border-radius: 10px; }
.ztc-gallery__items .gallery-box img:hover { transform: scale(1.5); z-index: 3; overflow: hidden; filter: drop-shadow(0px 6px 5px rgba(0, 0, 0, 0.2)); }
@media screen and (max-width: 768px) { .ztc-gallery__items .gallery-box img:hover { transform: none; z-index: initial; overflow: hidden; max-width: 100%; } }
.ztc-gallery__items .slick-list, .ztc-gallery__items .slick-track, .ztc-gallery__items .slick-slide { overflow: visible !important; }
.ztc-news__wrap { padding: 0 20px 100px; }
@media screen and (max-width: 768px) { .ztc-news__wrap { padding-bottom: 40px; } }
.ztc-news__wrap h2 { color: #422881; }
.ztc-news__wrap .title-block { display: flex; align-items: center; justify-content: space-between; }
@media screen and (max-width: 768px) { .ztc-news__wrap .title-block { flex-direction: column; margin-bottom: 16px; } }
@media screen and (max-width: 768px) { .ztc-news__wrap .title-block { display: block; text-align: center; } }
.ztc-news__wrap .title-block .news-tag { display: flex; font-family: "Alexandria"; font-weight: 400; font-style: normal; gap: 20px; font-size: 20px; }
@media screen and (max-width: 768px) { .ztc-news__wrap .title-block .news-tag { margin: 6px auto 22px; flex-wrap: wrap; justify-content: center; max-width: 390px; row-gap: 5px; column-gap: 1em; } }
.ztc-news__wrap .title-block .news-tag li { position: relative; }
.ztc-news__wrap .title-block .news-tag li.current::before { content: ''; background-image: url(/themes/zutomayo-card/_assets/img/star-purple.svg); width: 13px; height: 20px; background-size: contain; background-repeat: no-repeat; position: absolute; left: -16px; top: 4px; }
.ztc-news__wrap .title-block .news-tag a { text-shadow: 0 -1.5em 0 #000000, 0 0 0 #000000; }
.ztc-news__wrap .title-block .news-tag a:hover { text-shadow: 0 0 0 #36AE37, 0 1.5em 0 #36AE37; }
.ztc-news__wrap .title-block .news-tag li.current a { text-shadow: 0 -1.5em 0 #422881, 0 0 0 #422881; }
.ztc-news__wrap .title-block .news-tag li.current a:hover { text-shadow: 0 0 0 #36AE37, 0 1.5em 0 #36AE37; }
.ztc-news__wrap .contents-block { background-color: #ffffff; border-radius: 40px; }
@media screen and (max-width: 768px) { .ztc-news__wrap .contents-block { border-radius: 20px; } }
.ztc-news__wrap .contents-block li.ztc-news__li { border-bottom: 1px solid #D4D4D4; position: relative; }
.ztc-news__wrap .contents-block li.ztc-news__li:before { content: ''; width: 52px; height: 52px; background-color: #422881; border-radius: 50%; position: absolute; right: 30px; top: 50%; transform: translateY(-50%) scale(0); opacity: 0; transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1); z-index: 1; }
@media screen and (max-width: 768px) { .ztc-news__wrap .contents-block li.ztc-news__li:before { content: none; } }
.ztc-news__wrap .contents-block li.ztc-news__li:after { content: ''; background-image: url(/themes/zutomayo-card/_assets/img/arrow02.svg); width: 13px; height: 14px; background-size: contain; background-repeat: no-repeat; position: absolute; right: 19px; top: 50%; transform: translateY(-50%) translateX(-200px); opacity: 0; transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1); z-index: 2; }
@media screen and (max-width: 768px) { .ztc-news__wrap .contents-block li.ztc-news__li:after { content: none; } }
.ztc-news__wrap .contents-block li.ztc-news__li:hover:before { transform: translateY(-50%) scale(1); opacity: 1; }
.ztc-news__wrap .contents-block li.ztc-news__li:hover:after { transform: translateY(-50%) translateX(-30px); opacity: 1; }
.ztc-news__wrap .contents-block li.ztc-news__li:hover a:after { opacity: 0; }
.ztc-news__wrap .contents-block .ztc-link__arrow { display: flex; gap: 28px; align-items: center; position: relative; padding: 35px 30px 35px 51px; }
@media screen and (max-width: 768px) { .ztc-news__wrap .contents-block .ztc-link__arrow { display: grid; grid-template-columns: 120px 1fr auto; gap: 0; padding: 20px 30px 20px 26px; } }
.ztc-news__wrap .contents-block .ztc-link__arrow.more { justify-content: center; padding: 0; display: inline-block; }
.ztc-news__wrap .contents-block .ztc-link__arrow.more:after { content: none; }
.ztc-news__wrap .contents-block .ztc-link__arrow:after { content: ''; background-image: url(/themes/zutomayo-card/_assets/img/arrow01.svg); width: 13px; height: 14px; background-size: contain; background-repeat: no-repeat; position: absolute; right: 50px; top: 50%; transform: translateY(-50%); opacity: 1; transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1); z-index: 1; }
@media screen and (max-width: 768px) { .ztc-news__wrap .contents-block .ztc-link__arrow:after { content: none; } }
.ztc-news__wrap .contents-block .day { font-family: "Cinzel", serif; font-weight: 900; font-style: normal; font-size: 25px; color: #422881; width: 140px; }
@media screen and (max-width: 768px) { .ztc-news__wrap .contents-block .day { font-size: 20px; grid-column: 1; grid-row: 1; } }
.ztc-news__wrap .contents-block .tag { font-family: "Noto Sans JP", sans-serif; font-weight: 800; font-style: normal; font-size: 16px; background-color: #000000; color: #ffffff; padding: 10px; width: 120px; text-align: center; line-height: 1; }
@media screen and (max-width: 768px) { .ztc-news__wrap .contents-block .tag { width: fit-content; padding: 4px 6px 7px; text-align: center; grid-column: 2; grid-row: 1; font-size: 14px; } }
.ztc-news__wrap .contents-block .title, .ztc-news__wrap .contents-block .new { font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 20px; }
@media screen and (max-width: 768px) { .ztc-news__wrap .contents-block .title, .ztc-news__wrap .contents-block .new { font-size: 16px; grid-column: 1 / -1; grid-row: 2; } }
@media screen and (max-width: 768px) { .ztc-news__wrap .contents-block .title { margin-top: 5px; } }
.ztc-news__wrap .contents-block .new { color: #E10000; margin-left: 10px; }
@media screen and (max-width: 768px) { .ztc-news__wrap .contents-block .new { display: none; } }
.ztc-videoarea { padding-top: 450px; }
@media screen and (max-width: 768px) { .ztc-videoarea { padding-top: 240px; } }
.ztc-videoarea .bg-video { position: fixed; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; pointer-events: none; }
.ztc-mart { background-image: url(/themes/zutomayo-card/_assets/img/bg01.jpg); background-size: cover; background-position: top center; background-repeat: repeat-y; }
.ztc-mart__wrap { padding: 100px 20px 123px 20px; }
@media screen and (max-width: 768px) { .ztc-mart__wrap { padding-top: 43px; padding-bottom: 70px; } }
.ztc-mart__wrap .logo-block { text-align: center; }
.ztc-mart__wrap .logo-block img { max-width: 756px; width: 100%; }
.ztc-mart__wrap .menu-block { display: flex; font-family: "Alexandria"; font-weight: 400; font-style: normal; gap: 20px; font-size: 20px; justify-content: center; padding-top: 70px; }
@media screen and (max-width: 768px) { .ztc-mart__wrap .menu-block { padding-top: 26px; display: grid; grid-template-columns: auto auto; row-gap: 0; } }
.ztc-mart__wrap .menu-block li { position: relative; }
@media screen and (max-width: 768px) { .ztc-mart__wrap .menu-block li:nth-child(odd) { text-align: right; }
  .ztc-mart__wrap .menu-block li:nth-child(even) { text-align: left; } }
.ztc-mart__wrap .menu-block li.current::before { content: ''; background-image: url(/themes/zutomayo-card/_assets/img/star-purple.svg); width: 13px; height: 20px; background-size: contain; background-repeat: no-repeat; position: absolute; left: -16px; top: 4px; }
@media screen and (max-width: 768px) { .ztc-mart__wrap .menu-block li:nth-child(1)::before { left: 57px; } }
.ztc-mart__wrap .menu-block a { text-shadow: 0 -1.5em 0 #000000, 0 0 0 #000000; }
.ztc-mart__wrap .menu-block a:hover { text-shadow: 0 0 0 #36AE37, 0 1.5em 0 #36AE37; }
.ztc-mart__wrap .menu-block .current a { text-shadow: 0 -1.5em 0 #422881, 0 0 0 #422881; }
.ztc-mart__wrap .menu-block .current a:hover { text-shadow: 0 0 0 #36AE37, 0 1.5em 0 #36AE37; }
.ztc-mart__wrap .item-block { padding-top: 62px; }
@media screen and (max-width: 768px) { .ztc-mart__wrap .item-block { padding-top: 30px; } }
.ztc-mart__wrap .item-block ul { display: flex; flex-wrap: wrap; justify-content: center; row-gap: 40px; column-gap: 10px; }
@media screen and (max-width: 768px) { .ztc-mart__wrap .item-block ul { row-gap: 10px; } }
.ztc-mart__wrap .item-block ul li { width: 280px; position: relative; overflow: hidden; }
@media screen and (max-width: 768px) { .ztc-mart__wrap .item-block ul li { width: calc(50% - 5px); } }
.ztc-mart__wrap .item-block ul li a, .ztc-mart__wrap .item-block ul li img { display: block; width: 100%; height: auto; }
.ztc-mart__wrap .item-block ul li::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, 0); transition: background .25s; z-index: 1; pointer-events: none; }
.ztc-mart__wrap .item-block ul li .item-info { position: absolute; inset: 0; color: #ffffff; opacity: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 20px; transition: opacity .3s; z-index: 1; gap: 10px; }
@media screen and (max-width: 768px) { .ztc-mart__wrap .item-block ul li .item-info { display: none; } }
.ztc-mart__wrap .item-block ul li .item-info .title { font-family: "Noto Sans JP", sans-serif; font-weight: 400; font-style: normal; font-size: 12px; line-height: 1; }
.ztc-mart__wrap .item-block ul li .item-info .desc { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; line-height: 1.3; }
.ztc-mart__wrap .item-block ul li .item-info .price { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; line-height: 1; }
.ztc-mart__wrap .item-block ul li .item-info .price span { margin-left: 6px; font-size: 12px; }
.ztc-mart__wrap .item-block ul li:hover .item-info { opacity: 1; }
.ztc-mart__wrap .item-block ul li:hover::before { background: rgba(0, 0, 0, 0.7); }
.ztc-mart__wrap .mart-btn { padding-top: 60px; }
.ztc-mart__wrap .mart-btn a { border: 1px solid #5D6474; max-width: 300px; width: 100%; height: 60px; border-radius: 50px; display: flex; gap: 10px; align-items: center; justify-content: center; text-align: center; margin: 0 auto; font-family: "Cinzel", serif; font-weight: 600; font-style: normal; color: #5D6474; font-size: 20px; transition: background-color .3s ease, color .3s ease; }
.ztc-mart__wrap .mart-btn a:hover { color: #ffffff; background-color: #5D6474; }
.ztc-mart__wrap .mart-btn a .mart-icon { width: 35px; height: 35px; background: url("../img/mart-btn.svg") no-repeat center/contain; transition: background-image .3s; }
.ztc-mart__wrap .mart-btn a:hover .mart-icon { background-image: url("../img/mart-btn-white.svg"); }
.ztc-feature { position: relative; }
.ztc-feature:before { content: ''; position: absolute; background-color: rgba(0, 0, 0, 0.8); width: 100%; height: 130%; top: 0; left: 0; z-index: -1; }
.ztc-feature__wrap { padding: 60px 20px 170px; max-width: 1320px; }
@media (max-width: 1276px) { .ztc-feature__wrap { padding: 60px 0 170px; } }
@media screen and (max-width: 768px) { .ztc-feature__wrap { padding-left: 0; padding-right: 0; padding-bottom: 160px; } }
.ztc-feature__wrap h2 { color: #ffffff; text-align: center; }
.ztc-feature__wrap ul { display: grid; grid-template-columns: repeat(4, 290px); justify-content: space-between; gap: 20px; padding-top: 25px; }
@media screen and (max-width: 768px) { .ztc-feature__wrap ul { display: block; } }
.ztc-feature__wrap ul.slick-initialized { display: block; position: relative; }
@media (min-width: 769px) { .ztc-feature__wrap ul.slick-initialized .slick-list { overflow: hidden; } }
@media screen and (min-width: 769px) and (max-width: 768px) { .ztc-feature__wrap ul.slick-initialized .slick-list { overflow: visible; } }
@media (min-width: 769px) { .ztc-feature__wrap ul.slick-initialized .slick-track { display: flex; gap: 20px; } }
.ztc-feature__wrap ul li { background-image: url(/themes/zutomayo-card/_assets/img/feature-bgcard.png); min-width: 290px; width: 100%; background-size: 100% 100%; background-repeat: no-repeat; transition: transform .3s ease; transform-origin: center; }
.ztc-feature__wrap ul li:nth-child(odd) { margin-left: auto; }
@media screen and (max-width: 768px) { .ztc-feature__wrap ul li:nth-child(odd) { margin: 0 10px; min-width: unset; } }
.slick-initialized .ztc-feature__wrap ul li { margin-left: 0 !important; }
@media screen and (max-width: 768px) { .slick-initialized .ztc-feature__wrap ul li { margin: 0 10px; } }
@media screen and (max-width: 768px) { .ztc-feature__wrap ul li { margin: 0 10px; width: 290px !important; } }
.ztc-feature__wrap ul li .feature-item { padding: 30px 27px; display: flex; flex-direction: column; row-gap: 13px; align-items: center; transition: .3s; }
@media screen and (max-width: 768px) { .ztc-feature__wrap ul li .feature-item { max-width: 290px; width: 100%; } }
.ztc-feature__wrap ul li .feature-item .title { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; color: #ffffff; font-weight: 600; }
.ztc-feature__wrap ul li .feature-item img { width: 240px; height: 134px; object-fit: cover; object-position: center center; }
.ztc-feature__wrap ul li .feature-item .desc { font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 15px; color: #ffffff; font-weight: 300; }
.ztc-feature__wrap ul li .feature-item .more { padding-top: 7px; background-color: #422881; color: #ffffff; display: inline-block; padding: 5px 18px 3px; border-radius: 40px; transition: .3s; font-size: 14px; }
.ztc-feature__wrap ul li:hover { transform: scale(1.03); }
.ztc-feature__wrap ul li:hover .more { background-color: #36AE37; }
@media screen and (max-width: 768px) { .ztc-feature__wrap ul li:hover { transform: none; } }
.ztc-feature__wrap ul .slick-prev, .ztc-feature__wrap ul .slick-next { bottom: -75px; top: initial; width: auto; height: auto; z-index: 2; }
@media screen and (max-width: 768px) { .ztc-feature__wrap ul .slick-prev, .ztc-feature__wrap ul .slick-next { bottom: -64px; } }
.ztc-feature__wrap ul .slick-prev { left: 10%; }
.ztc-feature__wrap ul .slick-prev:before { background-image: url(/themes/zutomayo-card/_assets/img/feature-back.svg); content: ''; width: 30px; height: 30px; display: inline-flex; opacity: 1; line-height: 0; }
.ztc-feature__wrap ul .slick-next { right: 10%; }
.ztc-feature__wrap ul .slick-next:before { background-image: url(/themes/zutomayo-card/_assets/img/feature-next.svg); content: ''; width: 30px; height: 30px; display: inline-flex; opacity: 1; line-height: 0; }
.ztc-feature__wrap ul.slick-dots { display: flex; bottom: -60px; margin: 0 auto; max-width: 70%; gap: 0; position: absolute; position: absolute; top: unset; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); }
@media screen and (max-width: 768px) { .ztc-feature__wrap ul.slick-dots { bottom: -50px; max-width: 58%; } }
.ztc-feature__wrap ul.slick-dots li { background-image: none; height: 3px; margin: 0; min-width: unset; }
@media screen and (max-width: 768px) { .ztc-feature__wrap ul.slick-dots li { width: 100% !important; } }
.ztc-feature__wrap ul.slick-dots li button { width: 100%; height: 100%; padding: 0; }
.ztc-feature__wrap ul.slick-dots li button:before { content: ''; width: 100%; height: 100%; background-color: #000000; opacity: 0.4; }
.ztc-feature__wrap ul.slick-dots li.slick-active button:before { background-color: #36AE37; opacity: 1; border-radius: 40px; }

.home .ztc-news__wrap .contents-block li:last-child { padding: 35px 30px 35px 50px; text-align: center; border-bottom: none; line-height: 1; }
.home .ztc-news__wrap .contents-block li:last-child::before, .home .ztc-news__wrap .contents-block li:last-child::after { content: none; }
@media screen and (max-width: 768px) { .home .ztc-news__wrap .contents-block li:last-child { padding: 15px 0; } }

.p-news .news-tag { display: flex; font-family: "Alexandria"; font-weight: 400; font-style: normal; gap: 20px; font-size: 20px; justify-content: center; margin-top: 65px; }
@media screen and (max-width: 768px) { .p-news .news-tag { margin: 6px auto 22px; flex-wrap: wrap; justify-content: center; max-width: 390px; row-gap: 5px; column-gap: 1em; margin-top: 30px; } }
.p-news .news-tag li { position: relative; }
.p-news .news-tag li.current::before { content: ''; background-image: url(/themes/zutomayo-card/_assets/img/star-purple.svg); width: 13px; height: 20px; background-size: contain; background-repeat: no-repeat; position: absolute; left: -16px; top: 2px; }
.p-news .news-tag li.current { margin-left: 15px; }
@media screen and (max-width: 768px) { .p-news .news-tag li.current { margin-left: 10px; } }
.p-news .news-tag li.current a { pointer-events: none; }
.p-news .news-tag a { text-shadow: 0 -1.5em 0 #000000, 0 0 0 #000000; }
.p-news .news-tag a:hover { text-shadow: 0 0 0 #36AE37, 0 1.5em 0 #36AE37; }
.p-news .news-tag li.current a { text-shadow: 0 -1.5em 0 #422881, 0 0 0 #422881; }
.p-news .news-tag li.current a:hover { text-shadow: 0 0 0 #36AE37, 0 1.5em 0 #36AE37; }
.p-news .contents-block li:last-child { padding: initial; border: none; text-align: initial; }

.detail-news .contents-block li:last-child { padding: initial; border: none; }
.detail-news .contents-block__top { border-bottom: 1px solid #D4D4D4; padding: 30px 40px; }
@media screen and (max-width: 768px) { .detail-news .contents-block__top { padding: 20px; } }
.detail-news .contents-block__top .flex-box { display: flex; gap: 30px; align-items: center; margin-bottom: 20px; }
@media screen and (max-width: 768px) { .detail-news .contents-block__top .flex-box { margin-bottom: 0; gap: 10px; } }
.detail-news .contents-block__top .title { padding-left: 45px; }
@media screen and (max-width: 768px) { .detail-news .contents-block__top .title { padding-left: 20px; font-size: 18px; } }
.detail-news .contents-block__top .tag { font-size: 16px; }
@media screen and (max-width: 768px) { .detail-news .contents-block__top .tag { font-size: 14px; } }
.detail-news .contents-block__top .day { width: auto; }
.detail-news .contents-block__top .new { font-size: 16px; vertical-align: text-bottom; }
.detail-news .contents-block .title { display: inline-block; padding-left: unset; font-size: 24px; }
@media screen and (max-width: 768px) { .detail-news .contents-block .title { font-size: 18px; } }

.ztc-contact .contents-block { padding: 50px 45px; }
@media screen and (max-width: 768px) { .ztc-contact .contents-block { padding: 50px 20px; } }
.ztc-contact .contents-block h2 { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: clamp(20px, 2.9vw, 24px); color: #422881; text-align: center; }
@media screen and (max-width: 768px) { .ztc-contact .contents-block h2 { font-size: 20px; } }
.ztc-contact .contents-block ul { padding-top: 44px; }
.ztc-contact .contents-block p { padding-top: 60px; }
.ztc-contact .contents-block li, .ztc-contact .contents-block p { font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 16px; line-height: 33px; }
@media screen and (max-width: 768px) { .ztc-contact .contents-block li, .ztc-contact .contents-block p { line-height: 28px; margin-bottom: 16px; } }
.ztc-contact .contents-block .form-wrap { background-color: #F5F5F5; border-radius: 40px; padding: 20px 20px 40px 40px; margin-top: 40px; }
@media screen and (max-width: 768px) { .ztc-contact .contents-block .form-wrap { padding: 30px 20px; } }
.ztc-contact .contents-block .form-wrap .form-group { display: flex; margin-bottom: 20px; align-items: center; gap: 20px; }
@media (max-width: 1340px) { .ztc-contact .contents-block .form-wrap .form-group { display: block; } }
.ztc-contact .contents-block .form-wrap .form-group label { width: 18%; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; }
@media (max-width: 1340px) { .ztc-contact .contents-block .form-wrap .form-group label { margin-left: 30px; width: 100% !important; justify-content: center; } }
@media screen and (max-width: 768px) { .ztc-contact .contents-block .form-wrap .form-group label { font-size: 16px; margin-left: 14px; } }
.ztc-contact .contents-block .form-wrap .form-group input, .ztc-contact .contents-block .form-wrap .form-group select { border: 1px solid #D4D4D4; border-radius: 40px; background-color: #ffffff; height: 70px; width: 100%; padding-left: 36px; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 20px; color: #000000; }
@media (max-width: 1340px) { .ztc-contact .contents-block .form-wrap .form-group input, .ztc-contact .contents-block .form-wrap .form-group select { margin-top: 6px; padding-left: 20px; } }
@media screen and (max-width: 768px) { .ztc-contact .contents-block .form-wrap .form-group input, .ztc-contact .contents-block .form-wrap .form-group select { font-size: 16px; height: 40px; } }
.ztc-contact .contents-block .form-wrap .form-group input::placeholder, .ztc-contact .contents-block .form-wrap .form-group select::placeholder { color: #9FA0A0; }
.ztc-contact .contents-block .form-wrap .form-group input:invalid, .ztc-contact .contents-block .form-wrap .form-group select:invalid { color: #9FA0A0; }
.ztc-contact .contents-block .form-wrap .form-group .select-wrap { position: relative; display: inline-block; width: 100%; }
.ztc-contact .contents-block .form-wrap .form-group .select-wrap select { appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url("/themes/zutomayo-card/_assets/img/form-select-arrow.svg"); background-repeat: no-repeat; background-position: left 23px center; background-size: 18px; padding-left: 60px; cursor: pointer; }
@media screen and (max-width: 768px) { .ztc-contact .contents-block .form-wrap .form-group .select-wrap select { background-size: 11px; padding-left: 39px; background-position: left 15px center; } }
.ztc-contact .contents-block .form-wrap .form-group textarea { border: 1px solid #D4D4D4; border-radius: 20px; background-color: #ffffff; width: 100%; height: 195px; padding: 20px 30px; font-size: 18px; }
@media (max-width: 1340px) { .ztc-contact .contents-block .form-wrap .form-group textarea { margin-top: 6px; } }
@media screen and (max-width: 768px) { .ztc-contact .contents-block .form-wrap .form-group textarea { font-size: 16px; padding: 10px 20px; } }
.ztc-contact .contents-block .form-wrap .form-group.message { align-items: start; }
.ztc-contact .contents-block .form-wrap .form-group.message label { margin-top: 20px; }
.ztc-contact .contents-block .form-wrap .submit-wrap { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; background-color: #422881; color: #ffffff; width: fit-content; height: 60px; margin: 0 auto; display: flex; align-items: center; justify-content: center; line-height: 0; border-radius: 50px; transition: .3s; margin-top: 38px; }
.ztc-contact .contents-block .form-wrap .submit-wrap:hover { background-color: #36AE37; }
@media screen and (max-width: 768px) { .ztc-contact .contents-block .form-wrap .submit-wrap { height: 40px; font-size: 16px; width: 70%; margin-top: 24px; } }
.ztc-contact .contents-block .form-wrap .submit-wrap .submit { width: 300px; height: 60px; }
.ztc-contact .req { font-size: 14px; vertical-align: super; color: #E10000; }

.disabled { pointer-events: none; background-color: #ccc !important; }

/* ========================= CONTACT
========================= */
.ztc-contact .contents-block .form-wrap .submit-wrap { margin-top: 25px; }

/* ========================= PRIVACY CHECK
========================= */
.form-group.privacy { justify-content: center !important; }
.form-group.privacy .privacy-check { display: inline-flex; align-items: center; gap: 12px; cursor: pointer; user-select: none; width: unset !important; }
.form-group.privacy .privacy-check input[type="checkbox"] { position: absolute; opacity: 0; width: 20px; height: 20px; }
.form-group.privacy .privacy-check input[type="checkbox"]:checked + span::after { content: ""; position: absolute; left: 6px; top: 50%; width: 13px; height: 13px; transform: translateY(-50%); background: #36AE37; border-radius: 2px; }
.form-group.privacy .privacy-check input[type="checkbox"]:focus-visible + span::before { outline: 3px solid rgba(34, 177, 76, 0.35); outline-offset: 3px; }
.form-group.privacy .privacy-check span { position: relative; padding-left: 35px; font-size: 16px; font-weight: 400; line-height: 1.2; }
.form-group.privacy .privacy-check span a { border-bottom: 1px solid #000000; transition: 0.3s; }
.form-group.privacy .privacy-check span a:hover { color: #36AE37; border-bottom: 1px solid #36AE37; }
.form-group.privacy .privacy-check span::before { content: ""; position: absolute; left: 0; top: 50%; width: 25px; height: 25px; transform: translateY(-50%); border: 2px solid #cfcfcf; border-radius: 4px; background: #ffffff; }

/* ========================= CONFIRM MODAL
========================= */
.contactform .remodal { max-width: 1240px !important; border-radius: 40px !important; padding: 60px 0 70px !important; }
.contactform .remodal-close:before { top: 10px; left: 10px; }
.contactform .confirm-modal.is-active { display: block; }

.confirm-title { font-size: 25px; margin-bottom: 30px; text-align: center; color: #422881; font-weight: 600; }

.confirm-list { margin-bottom: 30px; }
.confirm-list dl { border-bottom: 1px solid #D4D4D4; padding: 40px; margin-bottom: 0; display: flex; align-items: flex-start; gap: 70px; }
.confirm-list dt { font-weight: 600; font-size: 20px; color: #422881; flex-shrink: 0; width: 180px; line-height: 1.4; text-align: left; }
.confirm-list dd { font-weight: 500; font-size: 20px; word-break: break-all; white-space: pre-wrap; flex: 1; line-height: 1.6; margin: 0; text-align: left; }

/* ========================= BUTTONS
========================= */
.confirm-buttons { display: flex; gap: 15px; justify-content: center; max-width: 300px; margin: 0 auto; flex-wrap: wrap; }
.confirm-buttons button { padding: 12px 30px; border: none; border-radius: 4px; cursor: pointer; font-size: 16px; }

.confirm-buttons button { padding: unset; border: none; border-radius: unset; cursor: unset; font-size: unset; }

.remodal-confirm, .remodal-cancel { color: unset; background: unset; }

.remodal-confirm:hover { background: #36AE37 !important; opacity: 1; }

.remodal-cancel:hover { background: #F2F2F2 !important; opacity: 1; }

.contactform .btn-primary, .contactform .btn-secondary { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px !important; width: 300px; height: 60px; margin: 0 auto; display: flex; align-items: center; justify-content: center; line-height: 0; border-radius: 50px !important; transition: .3s; }
.contactform .btn-primary { background-color: #422881; color: #ffffff; }
.contactform .btn-secondary { background-color: #ffffff; color: #000; border: 1px solid #000000 !important; }

/* ========================= RESPONSIVE
========================= */
@media (max-width: 768px) { .remodal { max-width: 100%; border-radius: 20px; padding: 40px 0; }
  .remodal-close:before { top: 5px; left: 5px; }
  .form-group.privacy .privacy-check span { font-size: 12px; padding-left: 30px; }
  .form-group.privacy .privacy-check span::before { width: 20px; height: 20px; }
  .form-group.privacy .privacy-check input[type="checkbox"]:checked + span::after { width: 11px; height: 11px; left: 5px; }
  .btn-primary, .btn-secondary { width: 180px; height: 50px; font-size: 16px !important; }
  .confirm-title { font-size: 20px; margin-bottom: 20px; }
  .confirm-list dl { gap: 10px; padding: 20px; font-size: 18px; flex-wrap: wrap; }
  .confirm-list dt, .confirm-list dd { font-size: 18px; width: 100%; } }
.ztc-guide .lower-title-block h2 { line-height: 1em; }
@media screen and (max-width: 768px) { .ztc-guide .lower-title-block h2 span { line-height: initial; margin-top: auto; } }
.ztc-guide ul.top-menu { display: flex; flex-wrap: wrap; justify-content: center; gap: 25px; margin-top: 70px; }
@media screen and (max-width: 768px) { .ztc-guide ul.top-menu { margin-top: 30px; gap: 10px; } }
.ztc-guide ul.top-menu li { background-color: #ffffff; color: #422881; height: 60px; border-radius: 50px; font-size: clamp(14px, 1.5vw, 20px); font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; width: calc(24% - 10px); transition: background-color .3s ease, color .3s ease; }
@media (max-width: 914px) { .ztc-guide ul.top-menu li { width: calc(50% - 15px); } }
@media screen and (max-width: 768px) { .ztc-guide ul.top-menu li { width: 48%; font-size: 12px; height: 30px; } }
.ztc-guide ul.top-menu li:hover { background-color: #422881; color: #ffffff; }
.ztc-guide ul.top-menu li a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.ztc-guide .card-feature { max-width: 80%; margin: 60px auto; }
@media screen and (max-width: 768px) { .ztc-guide .card-feature { max-width: 100%; } }
.ztc-guide .card-feature-flex { display: flex; gap: 40px; margin-bottom: 20px; }
.ztc-guide .card-feature-flex:last-of-type { margin-bottom: 0; }
@media screen and (max-width: 768px) { .ztc-guide .card-feature-flex { margin-bottom: 30px; } }
@media screen and (max-width: 768px) { .ztc-guide .card-feature-flex { flex-wrap: wrap; gap: 10px; } }
.ztc-guide .card-feature-flex_img { max-width: 140px; }
@media screen and (max-width: 768px) { .ztc-guide .card-feature-flex_img { max-width: 100%; } }
.ztc-guide .card-feature-flex_txt { flex: 1; }
@media screen and (max-width: 768px) { .ztc-guide .card-feature-flex_txt { flex: unset; } }
.ztc-guide .card-feature-flex_txt h5 { font-size: 20px; margin-bottom: 10px; }
.ztc-guide .card-feature-flex_txt p { font-size: 15px; font-weight: 500; }
.ztc-guide .guide-sections { margin-top: 70px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-sections { margin-top: 30px; } }
.ztc-guide .guide-section { background-color: #ffffff; border-radius: 40px; margin-bottom: 50px; filter: drop-shadow(0px 14px 24px rgba(0, 0, 0, 0.1)); }
@media screen and (max-width: 768px) { .ztc-guide .guide-section { margin-bottom: 35px; } }
.ztc-guide .guide-section .image__wrap { background-color: #222222; border-radius: 20px; padding: 10px 15px; margin-top: 30px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section .image__wrap { margin-top: 0; padding: 10px; } }
.ztc-guide .guide-section .image__wrap p { text-align: right; color: #F0E400; font-size: 15px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section .image__wrap p { text-align: left; font-size: clamp(13px, 1.5vw, 16px); } }
.ztc-guide .guide-section .image__wrap.bg-white, .ztc-guide .guide-section .image__wrap.bg-none { background-color: #ffffff; }
.ztc-guide .guide-section .image__wrap.bg-white p, .ztc-guide .guide-section .image__wrap.bg-none p { text-align: left; color: #422881; line-height: initial; font-size: clamp(14px, 1.5vw, 15px); margin-bottom: 10px; }
.ztc-guide .guide-section .image__wrap.bg-none { background: none; margin: 10px 0; }
.ztc-guide .guide-section .image__wrap.bg-none p { color: #000000; font-size: 13px; }
.ztc-guide .guide-section#gaiyou .guide-section-notice { margin-top: 30px; }
.ztc-guide .guide-section#required .flex-box { gap: clamp(20px, 3vw, 47px); display: flex; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#required .flex-box { flex-wrap: wrap; } }
.ztc-guide .guide-section#required .flex-box ul { width: 50%; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#required .flex-box ul { width: 100%; } }
.ztc-guide .guide-section#required .flex-box ul li { margin-bottom: 40px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#required .flex-box ul li { margin-bottom: 20px; } }
.ztc-guide .guide-section#required .flex-box ul li > :not(h4) { width: 90%; margin: 0 auto; }
.ztc-guide .guide-section#required .flex-box ul li .flex-box img { max-width: 50%; width: 100%; height: 100%; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#required .flex-box ul li .flex-box img { max-width: 100%; } }
.ztc-guide .guide-section#required .flex-box ul li img.common-image { max-width: 437px; display: block; margin-top: 30px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#required .flex-box ul li img.common-image { margin-top: 15px; } }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#required .flex-box ul li .flex-box { display: flex; justify-content: flex-start; gap: 7vw; flex-wrap: wrap; } }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#card_ex .flex-box .enchantment-card { margin-top: 25px; } }
.ztc-guide .guide-section#card_ex .description { background-color: #DCDDDD; border-radius: 20px; max-width: 415px; width: 100%; padding: 23px; height: 160px; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 14px; line-height: 1.2em; margin: 0 auto; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#card_ex .description { max-width: initial; height: auto; padding: 16px; line-height: 1.5em; } }
.ztc-guide .guide-section#card_ex dl { margin-top: 43px; border: 1px solid #2F8E3A; border-radius: 20px; display: flex; flex-wrap: wrap; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#card_ex dl { margin-top: 25px; } }
.ztc-guide .guide-section#card_ex dl dt, .ztc-guide .guide-section#card_ex dl dd { border-bottom: 1px solid #36AE37; padding: 30px; }
.ztc-guide .guide-section#card_ex dl dt:last-of-type, .ztc-guide .guide-section#card_ex dl dd:last-of-type { border: none; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#card_ex dl dt, .ztc-guide .guide-section#card_ex dl dd { padding: 8px; } }
.ztc-guide .guide-section#card_ex dl dt { width: 25%; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 18px; background-color: #2F8E3A; color: #ffffff; display: flex; align-items: center; padding-left: clamp(11px, 2vw, 25px); }
.ztc-guide .guide-section#card_ex dl dt:first-of-type { border-top-left-radius: 20px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#card_ex dl dt:first-of-type { border-top-right-radius: 20px; } }
.ztc-guide .guide-section#card_ex dl dt:last-of-type { border-bottom-left-radius: 20px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#card_ex dl dt:last-of-type { border-bottom-left-radius: 0; } }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#card_ex dl dt { width: 100%; font-size: 17px; } }
.ztc-guide .guide-section#card_ex dl dd { width: 75%; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 15px; line-height: 1.2em; display: flex; align-items: center; flex-wrap: wrap; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#card_ex dl dd { width: 100%; font-size: 14px; margin: 7px 0; border-bottom: 0; line-height: 1.5em; } }
.ztc-guide .guide-section#card_ex dl .card-wrap { display: flex; gap: 10px; margin-top: 20px; }
.ztc-guide .guide-section#card_ex dl .card-wrap img { max-width: 20%; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#card_ex dl .card-wrap img { max-width: 48%; } }
.ztc-guide .guide-section#card_ex dl .type-wrap { display: flex; gap: 10px; margin-top: 20px; }
.ztc-guide .guide-section#card_ex dl .type-wrap img { max-width: 40px; }
.ztc-guide .guide-section#card_ex .card-attribute { margin-top: 53px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#card_ex .card-attribute { margin-top: 25px; } }
.ztc-guide .guide-section#card_ex .card-attribute p { margin-left: 25px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#card_ex .card-attribute p { width: 93%; margin: 0 auto; } }
.ztc-guide .guide-section#card_ex .card-attribute img { max-width: 864px; width: 100%; margin: 39px auto 0; display: block; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#card_ex .card-attribute img { margin-top: 15px; } }
.ztc-guide .guide-section#field .flex-box > div { width: 100%; display: flex; flex-wrap: wrap; gap: 20px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#field .flex-box > div { display: contents; width: 100%; flex-wrap: wrap; } }
.ztc-guide .guide-section#field .fieldmat-image { max-width: 882px; width: 100%; display: block; margin: 0 auto; }
.ztc-guide .guide-section#field ul.field__wrap { margin-top: 67px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#field ul.field__wrap { margin-top: 20px; } }
.ztc-guide .guide-section#field ul.field__wrap li.flex-box { background-color: #F5F5F5; align-items: flex-start; gap: 10px; justify-content: left; border-radius: 20px; padding: 30px; margin-bottom: 10px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#field ul.field__wrap li.flex-box { flex-wrap: wrap; padding: 15px; border-radius: 10px; display: flex; align-items: center; } }
.ztc-guide .guide-section#field ul.field__wrap li.flex-box .num { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 30px; color: #ffffff; width: 40px; height: 40px; border-radius: 100px; display: flex; align-items: center; justify-content: center; line-height: 0.5em; padding-bottom: 3px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#field ul.field__wrap li.flex-box .num { width: 30px; height: 30px; font-size: 20px; } }
.ztc-guide .guide-section#field ul.field__wrap li.flex-box h5 { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#field ul.field__wrap li.flex-box h5 { width: 100%; display: flex; align-items: center; } }
.ztc-guide .guide-section#field ul.field__wrap li.flex-box p { font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 15px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#field ul.field__wrap li.flex-box p { font-size: 14px; } }
.ztc-guide .guide-section#field ul.field__wrap li.num1 .num { background-color: #FF5656; }
.ztc-guide .guide-section#field ul.field__wrap li.num2 .num { background-color: #FD8F35; }
.ztc-guide .guide-section#field ul.field__wrap li.num2 .set-zone { max-width: 373px; width: 100%; height: fit-content; margin-top: 20px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#field ul.field__wrap li.num2 .set-zone { width: 100%; margin-top: 10px; max-width: 100%; height: 100%; } }
.ztc-guide .guide-section#field ul.field__wrap li.num2 li:not(.guide-section-notice) { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 15px; line-height: 26px; color: #2F8E3A; border: 3px solid #2F8E3A; padding: 10px clamp(10px, 1.5vw, 20px); border-radius: 10px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#field ul.field__wrap li.num2 li:not(.guide-section-notice) { font-size: 13px; } }
.ztc-guide .guide-section#field ul.field__wrap li.num2 .guide-section-notice { font-size: 15px; margin-top: 3vh; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; width: 160%; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#field ul.field__wrap li.num2 .guide-section-notice { margin-top: 10px; width: 100%; font-size: 13px; } }
.ztc-guide .guide-section#field ul.field__wrap li.num2 div.flex-box { gap: clamp(20px, 4vw, 51px); display: flex; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#field ul.field__wrap li.num2 div.flex-box { width: 100%; flex-wrap: wrap; } }
.ztc-guide .guide-section#field ul.field__wrap li.num3 .num { background-color: #D7DB46; }
.ztc-guide .guide-section#field ul.field__wrap li.num3 .pwr-chager { max-width: 624px; margin: 24px auto 0; display: block; width: 100%; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#field ul.field__wrap li.num3 .pwr-chager { margin-top: 0; } }
.ztc-guide .guide-section#field ul.field__wrap li.num4 .num { background-color: #87B360; }
.ztc-guide .guide-section#field ul.field__wrap li.num5 .num { background-color: #4BAA7E; }
.ztc-guide .guide-section#field ul.field__wrap li.num6 .num { background-color: #527FA6; }
.ztc-guide .guide-section#field ul.field__wrap li.num7 .num { background-color: #7D4A9A; }
.ztc-guide .guide-section#field ul.field__wrap li.num7 > div span img { vertical-align: bottom; margin: 0 3px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#field ul.field__wrap li.num7 > div span img { width: 30px; vertical-align: text-bottom; } }
.ztc-guide .guide-section#field ul.field__wrap li.num7 > div img.bottom-image { max-width: 736px; width: 100%; display: block; margin: 23px auto 0; }
.ztc-guide .guide-section#prep p { font-size: 15px; font-weight: 500; line-height: 1.5; width: 100%; }
.ztc-guide .guide-section#prep .flex-box > div { width: 100%; display: flex; flex-wrap: wrap; gap: 20px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#prep .flex-box > div { display: contents; width: 100%; } }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#prep .flex-box > div > p { width: 100%; } }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#prep .flex-box > div > p.guide-section-notice { width: 100% !important; line-height: 1.6em; } }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#prep ul.prep__wrap { margin-top: 20px; } }
.ztc-guide .guide-section#prep ul.prep__wrap li.flex-box { background-color: #F5F5F5; align-items: flex-start; gap: 10px; justify-content: left; border-radius: 20px; padding: 30px; margin-bottom: 10px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#prep ul.prep__wrap li.flex-box { padding: 15px; flex-wrap: wrap; display: flex; } }
.ztc-guide .guide-section#prep ul.prep__wrap li.flex-box .num { background-color: #2F8E3A; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 30px; color: #ffffff; width: 40px; height: 40px; border-radius: 100px; display: flex; align-items: center; justify-content: center; line-height: 0.5em; padding-bottom: 4px; letter-spacing: -3px; padding-right: 3px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#prep ul.prep__wrap li.flex-box .num { width: 30px; height: 30px; font-size: 20px; } }
.ztc-guide .guide-section#prep ul.prep__wrap li.flex-box.num4 img { max-width: 1000px; width: 100%; margin: 46px auto 0; display: block; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#prep ul.prep__wrap li.flex-box.num4 img { margin-top: 10px; } }
.ztc-guide .guide-section#prep ul.prep__wrap li.flex-box.num8 img { max-width: 1000px; width: 100%; margin: 24px auto 0; display: block; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#prep ul.prep__wrap li.flex-box.num8 img { margin-top: 6px; } }
.ztc-guide .guide-section#flow .guide-section-inner > h4 { margin: 20px 0; }
.ztc-guide .guide-section#flow .flex-box-cont h5 { font-size: 20px; flex: 1; }
.ztc-guide .guide-section#flow .flex-box-cont p { font-size: 15px; font-weight: 500; line-height: 1.5; width: 100%; }
.ztc-guide .guide-section#flow .flex-box > div { width: 100%; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#flow .flex-box > div { width: 100%; display: contents; } }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#flow .flex-box > div > p { width: 100%; } }
.ztc-guide .guide-section#flow ul.flow__wrap li.flex-box { background-color: #F5F5F5; align-items: flex-start; gap: 10px; justify-content: left; border-radius: 20px; padding: 30px; margin-bottom: 10px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#flow ul.flow__wrap li.flex-box { padding: 15px; display: flex; flex-wrap: wrap; } }
.ztc-guide .guide-section#flow ul.flow__wrap li.flex-box .num { background-color: #2F8E3A; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 30px; color: #ffffff; width: 40px; height: 40px; border-radius: 100px; display: flex; align-items: center; justify-content: center; line-height: 0.5em; padding-bottom: 3px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#flow ul.flow__wrap li.flex-box .num { width: 24px; height: 24px; font-size: 18px; } }
.ztc-guide .guide-section#flow ul.flow__wrap li.flex-box.num1 img { max-width: 940px; width: 100%; margin: 0 auto; display: block; }
.ztc-guide .guide-section#flow ul.flow__wrap li.flex-box.num2 .desc { font-size: 20px; margin-top: 30px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#flow ul.flow__wrap li.flex-box.num2 .desc { width: 100% !important; font-size: clamp(14px, 3vw, 18px); margin-top: 12px; } }
.ztc-guide .guide-section#flow ul.flow__wrap li.flex-box.num2 span img { vertical-align: bottom; margin: 0 5px; }
.ztc-guide .guide-section#flow ul.flow__wrap li.flex-box.num2 .bg-white img { margin-top: 11px; }
.ztc-guide .guide-section#flow ul.flow__wrap li.flex-box.num3 img { margin-top: 20px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#flow ul.flow__wrap li.flex-box.num3 img { margin-top: 5px; } }
.ztc-guide .guide-section#flow ul.flow__wrap.second .image__wrap.bg-white p { color: #000 !important; font-size: 15px; padding-bottom: 30px; font-weight: 500; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#flow ul.flow__wrap.second .image__wrap.bg-white p { padding-bottom: 20px; } }
.ztc-guide .guide-section#flow ul.flow__wrap.second li.flex-box.num1 img { max-width: 1000px; }
.ztc-guide .guide-section#flow ul.flow__wrap.second li.flex-box.num2 p.desc { font-size: 20px; margin-top: 24px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#flow ul.flow__wrap.second li.flex-box.num2 p.desc { font-size: clamp(14px, 3vw, 18px); margin-top: 5px; } }
.ztc-guide .guide-section#flow ul.flow__wrap.second li.flex-box.num2 img.last { max-width: 627px; margin: -21px auto 0px; display: block; width: 100%; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#flow ul.flow__wrap.second li.flex-box.num2 img.last { margin-top: 0; } }
.ztc-guide .guide-section#flow ul.flow__wrap.second li.flex-box.num5 p.red { color: #E10000; margin-top: 25px; line-height: initial; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section#flow ul.flow__wrap.second li.flex-box.num5 p.red { margin-top: 0; width: 100%; } }
.ztc-guide .guide-section#flow .bg-yellow { border-radius: 20px; margin: 20px auto 0; }
.ztc-guide .guide-section-title { background-color: #422881; background-image: url(/themes/zutomayo-card/_assets/img/bg01.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; background-blend-mode: multiply; text-align: center; padding: 20px 0; cursor: pointer; position: relative; margin: 0; border-radius: 40px 40px 0 0; color: #ffffff; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 30px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section-title { font-size: 18px; padding: 15px 0; } }
.ztc-guide .guide-section-title::before { content: ""; background-image: url(/themes/zutomayo-card/_assets/img/img-circle.png); position: absolute; left: 20px; width: 30px; height: 30px; border: none; background-repeat: no-repeat; background-size: contain; top: 50%; transform: translateY(-50%); }
@media screen and (max-width: 768px) { .ztc-guide .guide-section-title::before { width: 24px; height: 24px; } }
.ztc-guide .guide-section-title::after { content: ""; background-image: url(/themes/zutomayo-card/_assets/img/img-circle.png); position: absolute; right: 20px; width: 30px; height: 30px; border: none; background-repeat: no-repeat; background-size: contain; top: 50%; transform: translateY(-50%); }
@media screen and (max-width: 768px) { .ztc-guide .guide-section-title::after { width: 24px; height: 24px; } }
.ztc-guide .guide-section-inner { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 18px; line-height: 32px; padding: 45px 45px 60px; width: 100%; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section-inner { padding: 30px 20px 40px; font-size: clamp(14px, 3vw, 18px); line-height: 1.6em; } }
.ztc-guide .guide-section-inner .flex-box-cont { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section-inner .flex-box-cont { display: block; } }
.ztc-guide .guide-section-inner h4 { background-color: #DCDDDD; border-radius: 100px; position: relative; padding-left: 55px; margin-bottom: 25px; height: 50px; display: flex; align-items: center; font-size: 20px; line-height: 1em; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section-inner h4 { height: 40px; font-size: clamp(16px, 3vw, 20px); margin-bottom: 15px; } }
.ztc-guide .guide-section-inner h4::before { content: ""; background-image: url(/themes/zutomayo-card/_assets/img/img-circle-h4.png); position: absolute; left: 10px; width: 35px; height: 34px; border: none; background-repeat: no-repeat; background-size: contain; top: 50%; transform: translateY(-50%); }
@media screen and (max-width: 768px) { .ztc-guide .guide-section-inner h4::before { width: 24px; height: 23px; left: 20px; } }
.ztc-guide .guide-section-inner h4.bg-green { background-color: #2F8E3A; color: #ffffff; }
.ztc-guide .guide-section-inner h4.bg-green span { color: #F0E400; margin-left: 12px; font-size: 25px; margin-bottom: 3px; }
.ztc-guide .guide-section-inner .bg-yellow { background-color: #F0E400; padding: 20px; margin: 0 auto 30px; text-align: center; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; word-break: keep-all; overflow-wrap: break-word; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section-inner .bg-yellow { text-align: left; word-break: initial; overflow-wrap: initial; font-size: clamp(15px, 3vw, 20px); padding: clamp(8px, 2vw, 25px); margin: 20px auto 20px; } }
.ztc-guide .guide-section-inner .point { position: relative; background-color: #eee30d; padding: 10px 0 10px 110px; margin: 40px auto; color: #491E87; font-size: clamp(13px, 1.9vw, 18px); border-radius: 10px; line-height: initial; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section-inner .point { padding-top: clamp(16px, 3.3vw, 25px); padding-left: 17px; width: 100% !important; margin-top: clamp(33px, 6vw, 44px); margin-bottom: 5px; } }
.ztc-guide .guide-section-inner .point::before { content: ''; background-image: url("/themes/zutomayo-card/_assets/img/img-point.svg"); width: 119px; height: 118px; background-repeat: no-repeat; position: absolute; top: 50%; transform: translateY(-50%); left: -20px; background-size: contain; }
@media screen and (max-width: 768px) { .ztc-guide .guide-section-inner .point::before { width: clamp(60px, 10vw, 100px); height: clamp(60px, 10vw, 100px); top: -10px; } }
.ztc-guide .guide-section-notice { color: #E10000; font-size: 14px; line-height: initial; margin-top: 10px !important; display: block; }
.ztc-guide .btn-area ul { display: flex; justify-content: center; gap: clamp(10px, 2vw, 34px); }
@media screen and (max-width: 768px) { .ztc-guide .btn-area ul { flex-direction: column; align-items: center; } }
.ztc-guide .btn-area ul li { max-width: 604px; width: 100%; }
.ztc-guide .btn-area ul li a { display: flex; align-items: center; justify-content: center; height: 150px; color: #ffffff; border-radius: 30px; font-size: clamp(19px, 2.1vw, 30px); font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; width: 100%; }
@media screen and (max-width: 768px) { .ztc-guide .btn-area ul li a { height: 80px; white-space: nowrap; } }
.ztc-guide .btn-area ul li#pdf a { background-color: #222222; gap: 18px; box-shadow: inset 0 -5px 0px black; }
@media screen and (max-width: 768px) { .ztc-guide .btn-area ul li#pdf a span { width: 7vw; } }
.ztc-guide .btn-area ul li#more a { background-color: #36AE37; gap: clamp(1px, 0.6vw, 20px); box-shadow: inset 0 -5px 0px #2b8b16; }
.ztc-guide .btn-area ul li#more a span { max-width: 70px; width: 7vw; }
@media screen and (max-width: 768px) { .ztc-guide .btn-area ul li#more a span { width: 13vw; } }
@media screen and (max-width: 768px) { .ztc-guide h5 { font-size: 16px !important; } }
.ztc-guide p { width: 100%; }
@media screen and (max-width: 768px) { .ztc-guide p { font-size: 13px !important; } }

.ttl-flex { display: flex; align-items: center; gap: 10px; }
.ttl-flex h5 { font-size: 20px; flex: 1; }

.card-flex-box { display: flex; gap: 15px; }
@media screen and (max-width: 768px) { .card-flex-box { flex-wrap: wrap; } }

.ico { display: inline-block; vertical-align: sub; padding: 0 8px; }
.ico img { max-height: 26px; }
@media screen and (max-width: 768px) { .ico img { max-height: 20px; } }
@media screen and (max-width: 768px) { .ico { max-width: 80px; } }
.ico img { margin-top: 0 !important; }

.is-lower .ztc-gallery { overflow: visible; /* カードグリッド */ /* パックタイトル */ }
@media screen and (max-width: 768px) { .is-lower .ztc-gallery { padding-bottom: 0; padding-top: 0; } }
.is-lower .ztc-gallery .pack-buttons { display: flex; flex-wrap: wrap; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; gap: 2em; font-size: 20px; justify-content: center; margin-top: 65px; }
@media screen and (max-width: 768px) { .is-lower .ztc-gallery .pack-buttons { margin: 6px auto 22px; flex-wrap: wrap; justify-content: center; max-width: 390px; row-gap: 5px; column-gap: 1em; margin-top: 30px; } }
.is-lower .ztc-gallery .pack-buttons button { position: relative; text-shadow: 0 -1.5em 0 #000000, 0 0 0 #000000; padding-left: 1.5em; }
.is-lower .ztc-gallery .pack-buttons button:hover { text-shadow: 0 0 0 #36AE37, 0 1.5em 0 #36AE37; }
.is-lower .ztc-gallery .pack-buttons button.active { text-shadow: 0 -1.5em 0 #422881, 0 0 0 #422881; }
.is-lower .ztc-gallery .pack-buttons button.active:before { content: ''; background-image: url(/themes/zutomayo-card/_assets/img/star-purple.svg); width: 13px; height: 20px; background-size: contain; background-repeat: no-repeat; position: absolute; left: 13px; top: 5px; }
.is-lower .ztc-gallery .pack-buttons button.active:hover { text-shadow: 0 0 0 #36AE37, 0 1.5em 0 #36AE37; }
.is-lower .ztc-gallery .lineup-menu { display: flex; justify-content: center; margin: 50px auto 100px; gap: 20px; flex-wrap: wrap; }
@media screen and (max-width: 768px) { .is-lower .ztc-gallery .lineup-menu { margin: 30px auto 40px; gap: 12px; } }
.is-lower .ztc-gallery .lineup-menu button { width: 150px; height: 50px; display: flex; justify-content: center; align-items: center; border-radius: 50px; font-family: "Alexandria"; font-weight: 400; font-style: normal; font-size: 25px; background-color: #ffffff; color: #422881; cursor: pointer; transition: background-color .3s, color .3s; }
.is-lower .ztc-gallery .lineup-menu button.active { background-color: #422881; color: #ffffff; }
.is-lower .ztc-gallery .lineup-menu button:hover { background-color: #422881; color: #ffffff; }
@media screen and (max-width: 768px) { .is-lower .ztc-gallery .lineup-menu button { width: calc(33% - 6px); height: 34px; font-size: clamp(18px, 3vw, 25px); } }
.is-lower .ztc-gallery .lineup-menu .all, .is-lower .ztc-gallery .lineup-menu .ur, .is-lower .ztc-gallery .lineup-menu .sr, .is-lower .ztc-gallery .lineup-menu .r, .is-lower .ztc-gallery .lineup-menu .n { display: none; }
.is-lower .ztc-gallery .lineup-menu .all.is-show, .is-lower .ztc-gallery .lineup-menu .ur.is-show, .is-lower .ztc-gallery .lineup-menu .sr.is-show, .is-lower .ztc-gallery .lineup-menu .r.is-show, .is-lower .ztc-gallery .lineup-menu .n.is-show { display: block; }
.is-lower .ztc-gallery .controls { display: flex; justify-content: center; gap: 10px; margin-bottom: 20px; }
.is-lower .ztc-gallery .controls button { background: white; border: none; padding: 10px 20px; border-radius: 20px; cursor: pointer; font-weight: 600; transition: all 0.3s ease; }
.is-lower .ztc-gallery .controls button:hover { background: #f0f0f0; transform: translateY(-2px); }
.is-lower .ztc-gallery #status { text-align: center; padding: 10px; margin-bottom: 20px; border-radius: 10px; background: rgba(255, 255, 255, 0.2); color: #ffffff; font-weight: 500; }
.is-lower .ztc-gallery #status.success { background: rgba(76, 175, 80, 0.3); }
.is-lower .ztc-gallery #status.error { background: rgba(244, 67, 54, 0.3); }
.is-lower .ztc-gallery .search-meta { text-align: center; color: #666; font-size: 0.95rem; margin-top: 15px; }
.is-lower .ztc-gallery .cards-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
@media screen and (max-width: 768px) { .is-lower .ztc-gallery .cards-grid { grid-template-columns: repeat(3, 1fr); gap: 7px; } }
.is-lower .ztc-gallery .card-item { border-radius: 10px; overflow: hidden; box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15); transition: all 0.3s ease; cursor: pointer; }
@media screen and (max-width: 768px) { .is-lower .ztc-gallery .card-item { border-radius: 4px; } }
.is-lower .ztc-gallery .card-item:hover { transform: translateY(-10px); box-shadow: 0 15px 40px rgba(0, 0, 0, 0.25); }
.is-lower .ztc-gallery .card-image { width: 100%; aspect-ratio: 2.5 / 3.5; overflow: hidden; }
.is-lower .ztc-gallery .card-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.is-lower .ztc-gallery .loading { text-align: center; padding: 60px; color: #ffffff; font-size: 1.3rem; font-weight: 600; }
.is-lower .ztc-gallery .pack-title { text-align: center; color: #ffffff; font-size: 2rem; font-weight: 700; margin: 30px 0; text-transform: uppercase; letter-spacing: 2px; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); }

.fancybox-caption, .fancybox-infobar, .fancybox__counter { display: none !important; }

.stage-close-btn { position: absolute !important; top: 40px !important; right: 40px !important; width: 42px !important; height: 42px !important; border: none !important; background: transparent !important; cursor: pointer !important; z-index: 1000000 !important; padding: 0 !important; margin: 0 !important; }
@media screen and (max-width: 768px) { .stage-close-btn { top: 10px !important; right: 10px !important; width: 32px !important; height: 32px !important; } }
.stage-close-btn::before, .stage-close-btn::after { content: '' !important; position: absolute !important; top: 50% !important; left: 50% !important; width: 42px !important; height: 4px !important; background: rgba(255, 255, 255, 0.9) !important; transform: translate(-50%, -50%) rotate(45deg) !important; border-radius: 2px !important; }
@media screen and (max-width: 768px) { .stage-close-btn::before, .stage-close-btn::after { width: 32px !important; height: 3px !important; } }
.stage-close-btn::after { transform: translate(-50%, -50%) rotate(-45deg) !important; }

.fancybox-container .custom-fancybox-navigation { position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; z-index: 99998; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; }
.fancybox-container .custom-fancybox-navigation .custom-arrow { position: absolute; padding: unset !important; width: 50px !important; height: 50px !important; background: #422881 !important; border-radius: 50% !important; border: 0; display: flex !important; align-items: center !important; justify-content: center !important; transition: background 0.3s, left 0.3s ease, right 0.3s ease !important; top: 50% !important; transform: translateY(-50%) !important; cursor: pointer; pointer-events: auto; }
@media screen and (max-width: 768px) { .fancybox-container .custom-fancybox-navigation .custom-arrow { width: 30px !important; height: 30px !important; } }
.fancybox-container .custom-fancybox-navigation .custom-arrow:hover { background: #422881 !important; }
.fancybox-container .custom-fancybox-navigation .custom-arrow svg { display: none !important; }
.fancybox-container .custom-fancybox-navigation .custom-arrow::after { content: ''; display: block; width: 18px; height: 20px; background-size: contain; background-repeat: no-repeat; background-position: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); pointer-events: none; }
@media screen and (max-width: 768px) { .fancybox-container .custom-fancybox-navigation .custom-arrow::after { width: 10px; height: 12px; } }
.fancybox-container .custom-fancybox-navigation .custom-arrow-left { left: calc(50% - (var(--fancybox-content-width, 432px) / 2) - 100px); }
@media screen and (max-width: 768px) { .fancybox-container .custom-fancybox-navigation .custom-arrow-left { left: 5px; } }
.fancybox-container .custom-fancybox-navigation .custom-arrow-left::after { background-image: url("/themes/zutomayo-card/_assets/img/arrow02.svg"); transform: translate(-50%, -50%) rotate(180deg) !important; }
.fancybox-container .custom-fancybox-navigation .custom-arrow-right { right: calc(50% - (var(--fancybox-content-width, 432px) / 2) - 100px); }
@media screen and (max-width: 768px) { .fancybox-container .custom-fancybox-navigation .custom-arrow-right { right: 5px; } }
.fancybox-container .custom-fancybox-navigation .custom-arrow-right::after { background-image: url("/themes/zutomayo-card/_assets/img/arrow02.svg"); }
.fancybox-container .custom-fancybox-navigation.thumbs-open .custom-arrow-left { left: calc(50% - (var(--fancybox-content-width, 432px) / 2) - 100px - 106px); }
@media screen and (max-width: 768px) { .fancybox-container .custom-fancybox-navigation.thumbs-open .custom-arrow-left { left: 5px; } }
.fancybox-container .custom-fancybox-navigation.thumbs-open .custom-arrow-right { right: calc(50% - var(--fancybox-content-width, 432px) / 2 - 0px - 0px); }
@media screen and (max-width: 768px) { .fancybox-container .custom-fancybox-navigation.thumbs-open .custom-arrow-right { right: 115px; } }

.fancybox-toolbar { bottom: 0; top: unset; background: #422881; padding: 2px 10px; border-radius: 30px; max-width: 160px; margin: 20px auto 0; text-align: center; left: 50%; transform: translate(-50%, -50%); right: unset; }
.fancybox-toolbar button { background: transparent; border: none; cursor: pointer; padding: 8px; color: #ffffff; font-size: 20px; transition: transform 0.2s; width: 29%; padding: 0px; }
.fancybox-toolbar button:hover { transform: scale(1.1); }

.fancybox-bg { background: #000000; opacity: 0.8; }

.fancybox-content { margin-bottom: 60px !important; }

@media screen and (max-width: 768px) { .fancybox-image, .fancybox-spaceball { padding: 40px; } }

.fancybox-progress { background: #36AE37 !important; }

.fancybox-thumbs__list a:before { border: 6px solid #36AE37 !important; }

.reveal-card-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 15px 30px; background: rgba(0, 0, 0, 0.8); color: #ffffff; border: 2px solid #ffffff; border-radius: 8px; font-size: 18px; cursor: pointer; z-index: 10000; transition: all 0.3s ease; }
.reveal-card-btn:hover { background: rgba(255, 255, 255, 0.9); color: #000000; border-color: #000000; }
@media screen and (max-width: 768px) { .reveal-card-btn { font-size: 14px; } }

.pack-select { width: 100%; max-width: 700px; margin: 0 auto; }
.pack-select-trigger { width: 100%; height: 64px; padding-left: 65px; padding-right: 24px; background: #f5f5f5 url(/themes/zutomayo-card/_assets/img/form-select-arrow.svg) no-repeat left 29px center; background-size: 20px; border-radius: 999px; border: none; display: flex; align-items: center; font-size: 25px; color: #422881; cursor: pointer; text-align: left; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; }
@media screen and (max-width: 768px) { .pack-select-trigger { font-size: 16px; padding-left: 55px; background-size: 16px; height: 44px; } }
.pack-select-panel { overflow: hidden; max-height: 0; opacity: 0; padding: 0 40px; background: #422881; border-radius: 50px; transition: max-height .35s ease, opacity .25s ease, padding .35s ease; }
@media screen and (max-width: 768px) { .pack-select-panel { border-radius: 35px; } }
.pack-select-list { list-style: none; margin: 0; padding: 0; position: relative; }
.pack-select-list li { color: #ffffff; font-size: 25px; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; padding: 20px 0 0 20px; cursor: pointer; display: flex; align-items: center; transition: opacity .2s ease; position: relative; }
.pack-select-list li:first-of-type { padding-top: 0; }
.pack-select-list li:hover { opacity: .7; }
@media screen and (max-width: 768px) { .pack-select-list li { font-size: 14px; padding: 10px 0 0 20px; } }
.pack-select-list li.current { opacity: 1; }
.pack-select-list li.current::before { content: "●"; font-size: 9px; position: absolute; left: 0; }
.pack-select.is-open .pack-select-panel { max-height: 600px; opacity: 1; padding: 45px 40px; }
@media screen and (max-width: 768px) { .pack-select.is-open .pack-select-panel { padding: 20px; } }

.fancybox-container .fancybox-image, .fancybox-container .fancybox-spaceball { border-radius: 22px; }
@media screen and (max-width: 768px) { .fancybox-container .fancybox-image, .fancybox-container .fancybox-spaceball { border-radius: 55px; } }

.is-lower .ztc-search .contents-block { background-color: initial; }

.ztc-search h3 { color: #555; margin-bottom: 15px; font-size: 1.3em; border-bottom: 2px solid #667eea; padding-bottom: 8px; }
.ztc-search .controls { display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; }
.ztc-search button { background: #667eea; color: #ffffff; border: none; padding: 12px 24px; border-radius: 8px; cursor: pointer; font-size: 1em; transition: all 0.3s; font-weight: 600; }
.ztc-search button:active { transform: translateY(0); }
.ztc-search .info, .ztc-search .success, .ztc-search .error { padding: 15px; border-radius: 8px; margin-bottom: 20px; font-weight: 500; }
.ztc-search .info { background: #e3f2fd; color: #1976d2; border-left: 4px solid #2196f3; }
.ztc-search .success { background: #e8f5e9; color: #388e3c; border-left: 4px solid #4caf50; }
.ztc-search .error { background: #ffebee; color: #c62828; border-left: 4px solid #f44336; }
.ztc-search .search-panel { background-color: #ffffff; margin-bottom: 40px; }
@media screen and (max-width: 768px) { .ztc-search .search-panel { margin-bottom: 30px; } }
.ztc-search .search-section { margin-bottom: 25px; }
@media screen and (max-width: 768px) { .ztc-search .search-section { margin-bottom: 20px; } }
.ztc-search .checkbox-group { max-width: 987px; width: 100%; display: flex; flex-wrap: wrap; gap: 15px; }
@media screen and (max-width: 768px) { .ztc-search .checkbox-group { gap: 8px; } }
.ztc-search .time-filter { display: flex; gap: 15px; }
.ztc-search .checkbox-item, .ztc-search .time-filter label { display: flex; align-items: center; gap: 10px; }
@media screen and (max-width: 768px) { .ztc-search .checkbox-item, .ztc-search .time-filter label { gap: 4px; } }
.ztc-search input[type="checkbox"], .ztc-search input[type="radio"] { appearance: none; -webkit-appearance: none; width: 40px; height: 40px; cursor: pointer; border: 1px solid #D4D4D4; border-radius: 10px; position: relative; background-color: #ffffff; }
@media screen and (max-width: 768px) { .ztc-search input[type="checkbox"], .ztc-search input[type="radio"] { width: 20px; height: 20px; border-radius: 4px; } }
.ztc-search input[type="checkbox"]:checked::before, .ztc-search input[type="radio"]:checked::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 26px; height: 26px; background: #36AE37; border-radius: 6px; }
@media screen and (max-width: 768px) { .ztc-search input[type="checkbox"]:checked::before, .ztc-search input[type="radio"]:checked::before { width: 17px; height: 17px; border-radius: 5px; } }
.ztc-search .range-group { display: flex; align-items: center; gap: 20px; width: 100%; }
.ztc-search .range-input { color: #000000; width: 100%; max-width: 240px; height: 70px; border-radius: 50px; border: 1px solid #D4D4D4; background-color: #ffffff; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 20px; padding-left: 30px; }
@media screen and (max-width: 768px) { .ztc-search .range-input { font-size: clamp(15px, 3vw, 20px); height: 40px; padding-left: 20px; } }
.ztc-search .advanced-toggle { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; text-align: center; margin: 30px 0; }
@media screen and (max-width: 768px) { .ztc-search .advanced-toggle { margin: 0; } }
.ztc-search .advanced-toggle button { background-color: #422881; width: 300px; height: 60px; border-radius: 50px; display: flex; align-items: center; justify-content: center; margin: 0 auto; gap: 16px; padding: 0 15px; transition: background-color 0.3s ease; }
@media screen and (max-width: 768px) { .ztc-search .advanced-toggle button { font-size: clamp(14px, 2.5vw, 20px); } }
.ztc-search .advanced-toggle button.is-open { background-color: #222222; }
.ztc-search .advanced-toggle button .icon { width: 30px; height: 30px; border-radius: 50%; background-color: #ffffff; position: relative; flex-shrink: 0; }
.ztc-search .advanced-toggle button .icon::before { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 12px; height: 2px; background-color: #422881; border-radius: 1px; transition: background-color 0.3s ease; }
.ztc-search .advanced-toggle button .icon::after { content: ""; position: absolute; top: 50%; left: 50%; width: 12px; height: 2px; background-color: #422881; border-radius: 1px; transform: translate(-50%, -50%) rotate(90deg); transition: transform 0.3s ease, background-color 0.3s ease; }
.ztc-search .advanced-toggle button.is-open .icon::before { background-color: #222222; }
.ztc-search .advanced-toggle button.is-open .icon::after { transform: translate(-50%, -50%) rotate(0deg); background-color: #222222; }
.ztc-search #advancedSearch { overflow: hidden; max-height: 600px; opacity: 1; transition: max-height 0.3s ease, opacity 0.3s ease; width: 96%; max-width: 1240px; background-color: #F5F5F5; margin: 0 auto; border-radius: 40px; }
@media screen and (max-width: 768px) { .ztc-search #advancedSearch { border-radius: 20px; margin-top: 10px; } }
.ztc-search #advancedSearch.hidden { display: block; max-height: 0; opacity: 0; pointer-events: none; }
.ztc-search #advancedSearch .filter-group:last-child { border: none; }
.ztc-search .hidden { display: none; }
.ztc-search .search-meta { text-align: right; color: #422881; font-size: 25px; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; margin-bottom: 20px; }
@media screen and (max-width: 768px) { .ztc-search .search-meta { font-size: 16px; margin-bottom: 10px; } }
.ztc-search .search-meta span { font-size: 50px; margin: 0 12px; }
@media screen and (max-width: 768px) { .ztc-search .search-meta span { font-size: 28px; margin: 0 10px; } }
.ztc-search #results { display: flex; flex-wrap: wrap; gap: 10px; }
@media screen and (max-width: 768px) { .ztc-search #results { gap: 0; justify-content: space-between; } }
.ztc-search #results .card { width: calc(20% - 40px / 5); cursor: pointer; transition: all 0.3s; }
@media screen and (max-width: 768px) { .ztc-search #results .card { width: calc(33.333% - 5px); } }
.ztc-search #results .card:hover { transform: scale(1.3); }
.ztc-search #results .card a { display: block; }
.ztc-search #results .card a .card-img { width: 100%; border-radius: 10px; }
.ztc-search .search-panel { border-radius: 40px; padding-bottom: 25px; }
@media screen and (max-width: 768px) { .ztc-search .search-panel { border-radius: 20px; padding-bottom: 10px; } }
.ztc-search .search-panel .filter-group { display: flex; align-items: center; border-bottom: 1px solid #D4D4D4; padding: 20px 45px; white-space: nowrap; }
@media screen and (max-width: 768px) { .ztc-search .search-panel .filter-group { padding: 15px 16px; flex-direction: column; align-items: flex-start; gap: 5px; } }
.ztc-search .search-panel .filter-group label { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; }
@media screen and (max-width: 768px) { .ztc-search .search-panel .filter-group label { width: auto; } }
.ztc-search .search-panel .filter-group label.head { min-width: 200px; }
@media screen and (max-width: 768px) { .ztc-search .search-panel .filter-group label.head { font-size: clamp(14px, 2.5vw, 20px); } }
@media screen and (max-width: 768px) { .ztc-search .search-panel .filter-group label:not(.head) { font-size: clamp(13px, 2.5vw, 20px); } }
.ztc-search .search-panel .filter-group input[type="text"], .ztc-search .search-panel .filter-group select { font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 20px; width: 100%; height: 70px; border-radius: 50px; border: 1px solid #D4D4D4; background-color: #F5F5F5; padding-left: 65px; max-width: 987px; }
@media screen and (max-width: 768px) { .ztc-search .search-panel .filter-group input[type="text"], .ztc-search .search-panel .filter-group select { font-size: 16px; height: 40px; padding-left: 40px; } }
.ztc-search .search-panel .filter-group select { font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 20px; appearance: none; -webkit-appearance: none; padding-left: 65px; background: #f5f5f5 url("/themes/zutomayo-card/_assets/img/form-select-arrow.svg") no-repeat left 29px center; background-size: 20px; }
@media screen and (max-width: 768px) { .ztc-search .search-panel .filter-group select { width: 100%; font-size: clamp(15px, 3vw, 20px); background-position: 15px; background-size: 15px; padding-left: 40px; padding-right: 0; height: 40px; } }
.ztc-search .search-panel .filter-group select:invalid { color: #9FA0A0; }
.ztc-search .search-panel .filter-group .search-input::placeholder { color: #9FA0A0; }
.ztc-search .search-panel .filter-group .search-input__wrap { position: relative; width: 100%; max-width: 987px; }
.ztc-search .search-panel .filter-group .search-input__wrap::before { content: ''; background-image: url("/themes/zutomayo-card/_assets/img/search-icon.svg"); position: absolute; left: 22px; top: 50%; transform: translateY(-50%); width: 29px; height: 30px; background-repeat: no-repeat; background-size: contain; }
@media screen and (max-width: 768px) { .ztc-search .search-panel .filter-group .search-input__wrap::before { width: 23px; height: 20px; left: 15px; } }
.ztc-search .search-panel .filter-group.attack .attack-filter__wrap { display: flex; flex-direction: column; flex: 1; gap: 20px; width: 100%; }
@media screen and (max-width: 768px) { .ztc-search .search-panel .filter-group.attack .attack-filter__wrap { gap: 8px; } }
.ztc-search .search-panel .filter-group.attack .time-filter label { width: auto; }
.ztc-search .search-panel .filter-group.attack .range-group { width: 100%; justify-content: flex-start; }

.remodal-wrapper { padding: 60px; }
@media screen and (max-width: 768px) { .remodal-wrapper { padding: 50px 25px; } }
.remodal-wrapper .remodal { max-width: 1240px; border-radius: 40px; padding: clamp(25px, 4.5vw, 60px); position: relative; }
@media screen and (max-width: 768px) { .remodal-wrapper .remodal { border-radius: 20px; padding: 30px 16px; } }
.remodal-wrapper .remodal .remodal-close { position: absolute; top: -37px; right: -30px; left: auto; width: 90px; height: 90px; border: 5px solid #ffffff; border-radius: 50%; background-color: #422881; cursor: pointer; z-index: 10; transition: 0.3s; }
@media screen and (max-width: 1245px) { .remodal-wrapper .remodal .remodal-close { right: -30px; left: auto; } }
@media screen and (max-width: 768px) { .remodal-wrapper .remodal .remodal-close { top: -30px; width: 60px; height: 60px; right: -17px; left: auto; border: 3px solid #ffffff; } }
.remodal-wrapper .remodal .remodal-close::before, .remodal-wrapper .remodal .remodal-close::after { content: ''; position: absolute; top: 50%; left: 50%; width: 40px; height: 5px; background-color: #ffffff; border-radius: 20px; }
@media screen and (max-width: 768px) { .remodal-wrapper .remodal .remodal-close::before, .remodal-wrapper .remodal .remodal-close::after { width: 30px; } }
.remodal-wrapper .remodal .remodal-close::before { transform: translate(-50%, -50%) rotate(45deg); }
.remodal-wrapper .remodal .remodal-close::after { transform: translate(-50%, -50%) rotate(-45deg); }
.remodal-wrapper .card-header { text-align: left; }
.remodal-wrapper .card-header h4 { color: #422881; font-family: "Noto Sans JP", sans-serif; font-weight: 800; font-style: normal; font-size: 30px; margin-bottom: 24px; }
@media screen and (max-width: 768px) { .remodal-wrapper .card-header h4 { text-align: center; font-size: clamp(18px, 3.7vw, 30px); margin-bottom: 20px; } }
.remodal-wrapper .card-btm { text-align: left; margin-top: 20px; font-size: 13px; }
.remodal-wrapper .card-btm .illustrator { margin-bottom: 10px; }
.remodal-wrapper .card-btm .value-pack { font-weight: 500; color: #422881; border: 1px solid #422881; border-radius: 45px; margin: 5px 10px 0 0; font-size: 13px; width: fit-content; display: inline-block; padding: 5px 8px; transition: 0.3s; }
.remodal-wrapper .card-btm .value-pack:last-child { margin-right: 0; }
.remodal-wrapper .card-btm .value-pack:hover { background-color: #422881; color: #ffffff; transition: 0.3s; }
.remodal-wrapper .card-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.remodal-wrapper .badge { border-radius: 6px; font-size: 16px; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; }
@media screen and (max-width: 768px) { .remodal-wrapper .badge { font-size: clamp(14px, 2.5vw, 16px); } }
.remodal-wrapper .badge-rare { background: #ffd700; color: #8b6914; }
.remodal-wrapper .badge-type { background: #e3f2fd; color: #1976d2; }
.remodal-wrapper .badge-class { background: #36AE37; color: #ffffff; padding: 9px 13px; display: flex; align-items: center; white-space: nowrap; }
@media screen and (max-width: 768px) { .remodal-wrapper .badge-class { margin: 0 auto; display: block; width: 100%; text-align: center; } }
.remodal-wrapper .card-effect { font-size: 13px; color: #000000; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; text-align: left; width: 80%; }
@media (max-width: 495px) { .remodal-wrapper .card-effect { width: 100%; } }
.remodal-wrapper .card-box { display: flex; gap: 20px; }
@media screen and (max-width: 1245px) { .remodal-wrapper .card-box { flex-direction: column; } }
.remodal-wrapper .card-box .power-star { width: 20px; height: 20px; margin-right: 2px; vertical-align: middle; }
@media screen and (max-width: 768px) { .remodal-wrapper .card-box .power-star { width: 16px; height: 16px; } }
.remodal-wrapper .card-box .type-icon { width: 30px; height: 30px; vertical-align: middle; }
@media screen and (max-width: 768px) { .remodal-wrapper .card-box .type-icon { width: 20px; height: 20px; } }
.remodal-wrapper .card-img { width: 100%; max-width: 358px; object-fit: contain; }
@media screen and (max-width: 1245px) { .remodal-wrapper .card-img { margin: 0 auto; } }
.remodal-wrapper .card-img-blur { filter: blur(8px); }
.remodal-wrapper .card-contents { width: 100%; }
.remodal-wrapper .card-contents > p { text-align: left; font-size: 13px; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; margin-top: 8px; }
.remodal-wrapper .card-contents > p.card-info-value { color: #422881; border: 1px solid #422881; border-radius: 45px; padding: 4px 6px; width: fit-content; }
.remodal-wrapper .card-info { background-color: #F5F5F5; border-radius: 20px; }
.remodal-wrapper .card-info-item { display: flex; border-bottom: 1px solid #D4D4D4; padding: 12px 35px; align-items: center; }
@media screen and (max-width: 768px) { .remodal-wrapper .card-info-item { padding: 15px 16px; flex-direction: unset; align-items: center; gap: 8px; flex-wrap: wrap; text-align: left; } }
.remodal-wrapper .card-info-item.top { gap: clamp(10px, 3vw, 40px); }
@media screen and (max-width: 768px) { .remodal-wrapper .card-info-item.top { gap: 10px; justify-content: space-between; } }
.remodal-wrapper .card-info-item.top .card-info-value { margin-left: 10px; }
@media screen and (max-width: 768px) { .remodal-wrapper .card-info-item.top .card-info-value { margin-left: 0; } }
.remodal-wrapper .card-info-item > p { width: 20%; text-align: left; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 14px; min-width: 110px; }
@media (max-width: 495px) { .remodal-wrapper .card-info-item > p { width: 100%; min-width: 0; } }
.remodal-wrapper .card-info-item.attack .card-info-label { vertical-align: middle; }
.remodal-wrapper .card-info-item.attack img { height: 20px; }
@media screen and (max-width: 768px) { .remodal-wrapper .card-info-item.attack img { height: 18px; vertical-align: sub; } }
.remodal-wrapper .card-info-item.attack .night { margin-right: 30px; }
@media (max-width: 495px) { .remodal-wrapper .card-info-item.attack .night { margin-right: 0; } }
.remodal-wrapper .card-info-item:last-of-type { border: none; }
@media screen and (max-width: 768px) { .remodal-wrapper .attack p { width: 100%; } }
.remodal-wrapper .card-info-label { font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; color: #000000; font-size: 16px; }
@media screen and (max-width: 768px) { .remodal-wrapper .card-info-label { font-size: clamp(14px, 2.5vw, 16px); } }
.remodal-wrapper .card-info-label.clock { vertical-align: super; }
.remodal-wrapper .card-info-value { color: #000000; font-family: "Noto Sans JP", sans-serif; font-weight: 800; font-style: normal; font-size: 20px; }
@media screen and (max-width: 768px) { .remodal-wrapper .card-info-value { line-height: 1; font-size: clamp(13px, 3.5vw, 20px); } }
.remodal-wrapper .card-info-value.font-bigger { font-size: 30px; }
@media screen and (max-width: 768px) { .remodal-wrapper .card-info-value.font-bigger { font-size: clamp(14px, 7vw, 30px); } }
.remodal-wrapper .effect-txt { font-size: 13px; font-weight: 500; text-align: left; }
.remodal-wrapper .effect-txt a { color: #422881; transition: 0.3s; border: unset; text-decoration: underline; }
.remodal-wrapper .effect-txt a:hover { color: #36AE37; opacity: .75; }
.remodal-wrapper .empty-state { text-align: center; padding: 60px 20px; color: #999; }
.remodal-wrapper .empty-state h3 { color: #666; margin-bottom: 10px; font-size: 1.5em; }
.remodal-wrapper .loading { text-align: center; padding: 60px 20px; }
.remodal-wrapper .spinner { border: 4px solid #f3f3f3; border-top: 4px solid #667eea; border-radius: 50%; width: 50px; height: 50px; animation: spin 1s linear infinite; margin: 0 auto 20px; }
@keyframes spin { 0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); } }
@media (max-width: 768px) { .remodal-wrapper .container { padding: 15px; }
  .remodal-wrapper h1 { font-size: 1.5em; }
  .remodal-wrapper #results { grid-template-columns: 1fr; }
  .remodal-wrapper .card-info { grid-template-columns: 1fr; } }

.range-input::-webkit-outer-spin-button, .range-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.range-input { -moz-appearance: textfield; }

.ztc-errata .medium { display: none; }
@media (max-width: 960px) { .ztc-errata .medium { display: block; } }
.ztc-errata .contents-block { padding: 60px 45px; }
@media screen and (max-width: 768px) { .ztc-errata .contents-block { padding: 24px 20px; } }
.ztc-errata .contents-block__head { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; line-height: 32px; text-align: center; }
@media screen and (max-width: 768px) { .ztc-errata .contents-block__head { font-size: clamp(14px, 2.7vw, 20px); line-height: 1.8em; } }
.ztc-errata .contents-block__head p { margin-bottom: 23px; }
.ztc-errata .contents-block__head .small { font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 15px; margin-bottom: 42px; }
@media screen and (max-width: 768px) { .ztc-errata .contents-block__head .small { font-size: 14px; margin-bottom: 32px; } }
.ztc-errata .contents-block__inner { background-color: #F5F5F5; border-radius: 20px; margin-top: 65px; }
@media screen and (max-width: 768px) { .ztc-errata .contents-block__inner { margin-top: 33px; } }
.ztc-errata .contents-block__inner .list-header { background-color: #422881; color: #ffffff; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 18px; border-top-left-radius: 20px; border-top-right-radius: 20px; height: 70px; display: grid; grid-template-columns: 110px 0.8fr 100px 1fr; align-items: center; padding: 0 20px; }
.ztc-errata .contents-block__inner .list-header span { text-align: center; }
@media (max-width: 1110px) { .ztc-errata .contents-block__inner .list-header { display: none; } }
.ztc-errata .contents-block__inner ul .list-item { text-align: center; border-bottom: 1px solid #D4D4D4; }
.ztc-errata .contents-block__inner ul .list-item a { position: relative; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 15px; display: grid; grid-template-columns: 110px 0.8fr 100px 1fr; align-items: center; padding: 39px 20px; }
@media (max-width: 1110px) { .ztc-errata .contents-block__inner ul .list-item a { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 30px 20px; } }
@media screen and (max-width: 1110px) and (max-width: 768px) { .ztc-errata .contents-block__inner ul .list-item a { padding: 30px 40px 30px 20px; } }

@media screen and (max-width: 768px) { .ztc-errata .contents-block__inner ul .list-item a { font-size: 14px; } }
.ztc-errata .contents-block__inner ul .list-item a:hover { color: #422881; }
.ztc-errata .contents-block__inner ul .list-item a:before { content: ''; width: 30px; height: 30px; background-color: #422881; border-radius: 50%; position: absolute; right: 30px; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); }
@media screen and (max-width: 768px) { .ztc-errata .contents-block__inner ul .list-item a:before { right: 0; width: 24px; height: 24px; } }
.ztc-errata .contents-block__inner ul .list-item a:after { content: ''; background-image: url(/themes/zutomayo-card/_assets/img/arrow02.svg); width: 11px; height: 12px; background-size: contain; background-repeat: no-repeat; position: absolute; right: 54px; top: 45%; }
@media screen and (max-width: 768px) { .ztc-errata .contents-block__inner ul .list-item a:after { width: 10px; height: 9px; right: 18px; top: 48%; } }
.ztc-errata .contents-block__inner ul .list-item a span { display: none; }
@media (max-width: 1110px) { .ztc-errata .contents-block__inner ul .list-item a span { display: block; background-color: #422881; color: #ffffff; width: 100%; max-width: 100px; padding: 7px; border-radius: 30px; font-size: 14px; } }
@media screen and (max-width: 768px) { .ztc-errata .contents-block__inner ul .list-item a span { font-size: 12px; } }
@media (max-width: 1110px) { .ztc-errata .contents-block__inner ul .list-item a > div { display: flex; gap: 10px; width: 100%; align-items: center; } }
@media (max-width: 1110px) { .ztc-errata .contents-block__inner ul .list-item a > div p { text-align: left; } }
.ztc-errata .contents-block__inner ul .list-item:last-of-type { border-bottom: none; }

.ztc-errata-detail .contents-block h3 { background-color: #422881; color: #ffffff; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 30px; text-align: center; border-top-left-radius: 40px; border-top-right-radius: 40px; height: 80px; display: flex; align-items: center; justify-content: center; }
@media screen and (max-width: 768px) { .ztc-errata-detail .contents-block h3 { font-size: 19px; border-top-left-radius: 20px; border-top-right-radius: 20px; } }
.ztc-errata-detail .contents-block .errata-wrap { padding: 0 45px 65px; }
@media screen and (max-width: 768px) { .ztc-errata-detail .contents-block .errata-wrap { padding: 0 20px 65px; } }
.ztc-errata-detail .contents-block .errata-wrap__inner { display: flex; justify-content: space-between; padding-top: 50px; gap: 20px; }
@media (max-width: 1030px) { .ztc-errata-detail .contents-block .errata-wrap__inner { flex-direction: column; align-items: center; } }
.ztc-errata-detail .contents-block .errata-wrap__inner .left { width: 358px; height: 500px; }
@media screen and (max-width: 768px) { .ztc-errata-detail .contents-block .errata-wrap__inner .left { max-width: 358px; height: auto; width: 100%; } }
.ztc-errata-detail .contents-block .errata-wrap__inner .right { max-width: 730px; flex: 1; }
@media (max-width: 1030px) { .ztc-errata-detail .contents-block .errata-wrap__inner .right { max-width: initial; width: 100%; } }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li { display: flex; border: 1px solid #D4D4D4; border-radius: 20px; height: 180px; overflow: hidden; width: 100%; }
@media screen and (max-width: 768px) { .ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li { display: block; height: auto; } }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li div:first-child { flex: 1; flex-direction: column; display: flex; min-width: 0; }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li .errata__head { background-color: #006FD7; text-align: center; color: #ffffff; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 30px; padding: 3px 0; }
@media screen and (max-width: 768px) { .ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li .errata__head { font-size: clamp(15px, 3vw, 24px); } }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li .errata__inner { text-align: center; flex: 1; display: flex; align-items: center; justify-content: center; margin: 0; flex-direction: column; overflow-y: auto; }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li .errata__inner__top { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; padding: 10px; }
@media screen and (max-width: 768px) { .ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li .errata__inner__top { font-size: 14px; } }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li .errata__inner__content { font-size: 15px; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; margin-top: 6px; }
@media screen and (max-width: 768px) { .ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li .errata__inner__content { font-size: 13px; } }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li .img-wrap { flex-shrink: 0; width: 180px; }
@media screen and (max-width: 768px) { .ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li .img-wrap { width: 100px; display: block; margin: 10px auto; } }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li .img-wrap img { width: 100%; height: 100%; object-fit: cover; }
@media screen and (max-width: 768px) { .ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li .img-wrap img { border-radius: 10px; } }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li:nth-of-type(2) { margin-top: 20px; }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-list li:nth-of-type(2) .errata__head { background-color: #E10000; }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-info { background-color: #F5F5F5; border-radius: 20px; max-width: 730px; width: 100%; margin-top: 40px; }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-info li { display: flex; border-bottom: 1px solid #D4D4D4; padding: 20px 30px; }
@media screen and (max-width: 768px) { .ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-info li { padding: 20px; } }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-info li:last-child { border-bottom: none; }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-info li .ttl { width: 22%; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 14px; min-width: 90px; }
.ztc-errata-detail .contents-block .errata-wrap__inner .right .errata-info li p { font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 15px; }

.errata-reason h4 { background-color: #DCDDDD; border-radius: 100px; position: relative; padding-left: 53px; margin-top: 50px; margin-bottom: 30px; height: 50px; display: flex; align-items: center; font-size: 25px; line-height: 1em; }
@media screen and (max-width: 768px) { .errata-reason h4 { font-size: clamp(18px, 3vw, 25px); padding-left: 40px; margin-top: 30px; margin-bottom: 14px; } }
.errata-reason h4::before { content: ""; background-image: url(/themes/zutomayo-card/_assets/img/img-circle-h4.png); position: absolute; left: 7px; width: 35px; height: 34px; border: none; background-repeat: no-repeat; background-size: contain; top: 50%; transform: translateY(-50%); }
@media screen and (max-width: 768px) { .errata-reason h4::before { width: 24px; height: 24px; } }

.errata-exchange h4, .errata-usage h4 { background-color: #422881; color: #ffffff; border-radius: 100px; position: relative; padding-left: 53px; margin-top: 50px; margin-bottom: 30px; height: 50px; display: flex; align-items: center; font-size: 25px; line-height: 1em; }
@media screen and (max-width: 768px) { .errata-exchange h4, .errata-usage h4 { font-size: clamp(18px, 3vw, 25px); padding-left: 40px; margin-top: 30px; margin-bottom: 14px; } }
.errata-exchange h4::before, .errata-usage h4::before { content: ""; background-image: url(/themes/zutomayo-card/_assets/img/img-circle.png); position: absolute; left: 7px; width: 35px; height: 34px; border: none; background-repeat: no-repeat; background-size: contain; top: 50%; transform: translateY(-50%); }
@media screen and (max-width: 768px) { .errata-exchange h4::before, .errata-usage h4::before { width: 24px; height: 24px; } }

.text p { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 15px; padding: 0 25px; line-height: 32px; }
@media screen and (max-width: 768px) { .text p { font-size: 14px; line-height: 1.5em; } }

p.exchange-period { font-size: 20px; margin: 1em 0; }
@media screen and (max-width: 768px) { p.exchange-period { font-size: 18px; } }

.ztc-faq .nav { display: flex; gap: 30px; justify-content: center; margin-top: 75px; }
.ztc-faq .nav li { width: 300px; }
.ztc-faq .nav li a { max-width: 300px; height: 60px; background-color: #ffffff; color: #422881; border-radius: 50px; display: flex; align-items: center; justify-content: center; width: 100%; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; transition: 0.3s; }
.ztc-faq .nav li a:hover { background: #422881; color: #ffffff; transition: 0.3s; }
@media screen and (max-width: 768px) { .ztc-faq .nav li a { font-size: clamp(14px, 3vw, 20px); height: 45px; } }
.ztc-faq .nav li.active a { background-color: #422881; color: #ffffff; pointer-events: none; }
@media screen and (max-width: 768px) { .ztc-faq .nav { margin-top: 30px; gap: 10px; } }
.ztc-faq .controls { display: flex; gap: 12px; margin-bottom: 20px; }
.ztc-faq .controls button { padding: 10px 20px; background: #0071e3; color: #ffffff; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 500; transition: background 0.2s; }
.ztc-faq .controls button:hover { background: #0077ed; }
.ztc-faq .info { padding: 16px; border-radius: 12px; margin-bottom: 24px; font-size: 14px; background: #e8f4fd; color: #0071e3; border: 1px solid #b8daff; }
.ztc-faq .info .success { background: #d4edda; color: #155724; border-color: #c3e6cb; }
.ztc-faq .info .error { background: #f8d7da; color: #721c24; border-color: #f5c6cb; }
.ztc-faq .search-panel { background: #ffffff; border-radius: 40px; box-shadow: 0 14px 24px rgba(0, 0, 0, 0.1); overflow: hidden; }
@media screen and (max-width: 768px) { .ztc-faq .search-panel { border-radius: 20px; margin-bottom: 20px; } }
.ztc-faq .filter-section { padding: 20px 45px; display: flex; align-items: center; border-bottom: 1px solid #e5e5ea; gap: 20px; }
.ztc-faq .filter-section:nth-of-type(3) { border-bottom: none; min-height: 131px; }
@media screen and (max-width: 768px) { .ztc-faq .filter-section:nth-of-type(3) { min-height: 110px; } }
@media (max-width: 1230px) { .ztc-faq .filter-section { flex-direction: column; align-items: flex-start; } }
@media screen and (max-width: 768px) { .ztc-faq .filter-section { gap: 10px; } }
.ztc-faq .filter-section .flex-box { gap: 20px; }
@media screen and (max-width: 768px) { .ztc-faq .filter-section .flex-box { flex-direction: column; width: 100%; gap: 10px; } }
.ztc-faq .filter-header { width: 14%; white-space: nowrap; min-width: 160px; }
@media (max-width: 1230px) { .ztc-faq .filter-header { width: 100%; } }
.ztc-faq .filter-title { font-size: 20px; color: #000000; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; }
@media screen and (max-width: 768px) { .ztc-faq .filter-title { font-size: clamp(14px, 2.5vw, 20px); } }
.ztc-faq .search-input-wrapper { position: relative; width: 100%; max-width: 987px; }
.ztc-faq .search-input-wrapper::before { content: ''; background-image: url("/themes/zutomayo-card/_assets/img/search-icon.svg"); position: absolute; left: 22px; top: 50%; transform: translateY(-50%); width: 29px; height: 30px; background-repeat: no-repeat; background-size: contain; }
@media screen and (max-width: 768px) { .ztc-faq .search-input-wrapper::before { width: 23px; height: 20px; left: 15px; } }
@media (max-width: 1230px) { .ztc-faq .search-input-wrapper { max-width: none; } }
.ztc-faq .search-input { font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; height: 70px; width: 100%; padding-left: 67px; border: 1px solid #D4D4D4; border-radius: 50px; font-size: 20px; transition: border-color 0.2s, box-shadow 0.2s; outline: none; background: #f5f5f5; }
@media screen and (max-width: 768px) { .ztc-faq .search-input { font-size: 16px; height: 40px; padding-left: 40px; } }
.ztc-faq .search-input:focus { box-shadow: 0 0 0 4px rgba(85, 91, 122, 0.08); background: white; }
.ztc-faq .search-input::placeholder { color: #999; }
.ztc-faq .card-filter-row { display: flex; align-items: center; }
.ztc-faq .select-wrapper { position: relative; flex: 1; width: clamp(500px, 52vw, 700px); }
@media (max-width: 1230px) { .ztc-faq .select-wrapper { width: clamp(500px, 66vw, 800px); } }
@media (max-width: 980px) { .ztc-faq .select-wrapper { width: 100%; } }
.ztc-faq select { width: 100%; max-width: 100%; height: 70px; border: 1px solid #D4D4D4; border-radius: 50px; cursor: pointer; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; font-size: 20px; appearance: none; -webkit-appearance: none; padding-left: 65px; padding-right: 50px; background: #f5f5f5 url("/themes/zutomayo-card/_assets/img/form-select-arrow.svg") no-repeat left 29px center; background-size: 20px; }
@media (max-width: 1230px) { .ztc-faq select { max-width: none; } }
@media screen and (max-width: 768px) { .ztc-faq select { width: 100%; font-size: clamp(15px, 3vw, 20px); background-position: 15px; background-size: 15px; padding-left: 40px; padding-right: 0; height: 40px; } }
.ztc-faq select option { width: 100%; }
.ztc-faq select:invalid { color: #9FA0A0; }
.ztc-faq select:focus { box-shadow: 0 0 0 4px rgba(85, 91, 122, 0.08); background: #ffffff url("/themes/zutomayo-card/_assets/img/form-select-arrow.svg") no-repeat left 29px center; }
@media screen and (max-width: 768px) { .ztc-faq select:focus { background-position: 15px; } }
.ztc-faq .search-card-wrapper { max-width: 266px; width: 100%; }
@media (max-width: 1230px) { .ztc-faq .search-card-wrapper { min-width: 190px; max-width: 100%; } }
.ztc-faq .search-card-wrapper .search-input { padding-left: 32px; }
.ztc-faq .popular-keywords-title { font-size: 20px; color: #000000; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; margin-bottom: 17px; }
@media screen and (max-width: 768px) { .ztc-faq .popular-keywords-title { font-size: clamp(14px, 2.5vw, 20px); margin-bottom: 10px; } }
.ztc-faq .keyword-tags { display: flex; flex-wrap: wrap; gap: 12px; }
.ztc-faq .keyword-tags .keyword-tag { font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; padding: 10px 24px; border: 1px solid #422881; border-radius: 50px; background: #ffffff; color: #422881; font-size: 16px; cursor: pointer; transition: all 0.2s; }
@media screen and (max-width: 768px) { .ztc-faq .keyword-tags .keyword-tag { font-size: 13px; padding: 5px 16px; } }
.ztc-faq .keyword-tags .keyword-tag::hover { background: #422881; color: #ffffff; }
.ztc-faq .keyword-tags .keyword-tag .active { background: #422881; color: #ffffff; }
.ztc-faq .qa-wrap { display: grid; gap: 16px; }
.ztc-faq .qa-card { border-radius: 20px; border: 1px solid #DCDDDD; }
.ztc-faq .qa-header { display: flex; align-items: center; gap: 13px; padding: 20px 30px; background: #ffffff; border-radius: 20px 20px 0 0; }
@media screen and (max-width: 768px) { .ztc-faq .qa-header { padding: 15px; align-items: flex-start; } }
.ztc-faq .qa-number, .ztc-faq .a-icon { color: #ffffff; font-family: "Alexandria", sans-serif; font-size: 30px; width: 53px; height: 53px; flex-shrink: 0; border-radius: 31px; display: flex; align-items: center; justify-content: center; padding-bottom: 3px; }
@media screen and (max-width: 768px) { .ztc-faq .qa-number, .ztc-faq .a-icon { font-size: 16px; width: 28px; height: 28px; padding-bottom: 2px; } }
.ztc-faq .qa-number { background: #422881; }
.ztc-faq .a-icon { background-color: #2F8E3A; }
.ztc-faq .qa-question { font-size: 18px; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; color: #000000; flex: 1; }
.ztc-faq .qa-answer { font-size: 15px; color: #000000; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; display: flex; gap: 13px; align-items: center; }
@media screen and (max-width: 768px) { .ztc-faq .qa-answer { align-items: flex-start; } }
.ztc-faq .qa-answer-cont { padding: 23px 30px; background: #f5f5f5; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px; }
@media screen and (max-width: 768px) { .ztc-faq .qa-answer-cont { padding: 15px; } }
.ztc-faq .qa-meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 20px; }
.ztc-faq .qa-tag { display: none; padding: 4px 12px; background: #e8f4fd; color: #0071e3; border-radius: 6px; font-size: 13px; font-weight: 500; }
.ztc-faq .qa-pack { padding: 8px 15px; color: #000000; border: 1px solid #000000; border-radius: 50px; font-size: 12px; font-weight: 600; transition: 0.3s; }
.ztc-faq .qa-pack:hover { transition: 0.3s; background: #000000; color: #ffffff; }
.ztc-faq .search-meta { padding: 20px 40px; font-size: 25px; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; color: #422881; text-align: right; }
.ztc-faq .search-meta-count { font-size: 50px; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; color: #422881; margin: 0 10px; }
.ztc-faq .loading { text-align: center; padding: 40px; color: #666; }
@media (max-width: 768px) { .ztc-faq .container { padding: 20px 16px; }
  .ztc-faq h1 { font-size: 1.5rem; }
  .ztc-faq .filter-section { padding: 24px 20px; } }
@media screen and (max-width: 768px) and (max-width: 768px) { .ztc-faq .filter-section { padding: 15px 16px; } }
@media (max-width: 768px) { .ztc-faq .search-tabs { flex-wrap: wrap; }
  .ztc-faq .search-tab { padding: 10px 20px; font-size: 14px; }
  .ztc-faq .qa-question { font-size: 16px; }
  .ztc-faq .search-meta { padding: 16px 20px; font-size: 16px; } }
@media screen and (max-width: 768px) and (max-width: 768px) { .ztc-faq .search-meta { padding: 0; margin-bottom: 10px; } }
@media (max-width: 768px) { .ztc-faq .search-meta-count { font-size: 26px; } }
.ztc-faq .flex-box { display: flex; }

.ztc-rule .nav { display: flex; gap: 30px; justify-content: center; margin-top: 75px; }
@media screen and (max-width: 768px) { .ztc-rule .nav { margin-top: 30px; gap: 10px; } }
.ztc-rule .nav li { width: 300px; }
.ztc-rule .nav li a { max-width: 300px; height: 60px; background-color: #ffffff; color: #422881; border-radius: 50px; display: flex; align-items: center; justify-content: center; width: 100%; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; font-size: 20px; transition: 0.3s; }
@media screen and (max-width: 768px) { .ztc-rule .nav li a { font-size: clamp(16px, 3vw, 20px); height: 45px; } }
.ztc-rule .nav li a:hover { background: #422881; color: #ffffff; transition: 0.3s; }
.ztc-rule .nav li.active a { background-color: #422881; color: #ffffff; pointer-events: none; }
.ztc-rule__video { margin-top: 70px; position: relative; width: 100%; padding-top: 56.25%; overflow: hidden; }
@media screen and (max-width: 768px) { .ztc-rule__video { margin-top: 40px; } }
.ztc-rule__video iframe { position: absolute; top: 0; left: 0; display: block; border: none; }
.ztc-rule .rule-block { margin-top: 56px; display: flex; flex-wrap: wrap; justify-content: space-between; row-gap: 30px; }
@media screen and (max-width: 768px) { .ztc-rule .rule-block { margin-top: 40px; row-gap: 20px; } }
.ztc-rule .rule-block .rule-item { max-width: 604px; width: calc(50% - 10px); background-color: #ffffff; border-radius: 40px; padding: 30px 43px 56px; display: flex; flex-direction: column; align-items: center; filter: drop-shadow(0px 14px 24px rgba(0, 0, 0, 0.1)); }
.ztc-rule .rule-block .rule-item a { display: flex; align-items: center; justify-content: center; gap: 14px; max-width: 529px; width: 100%; height: 80px; color: #ffffff; background-color: #422881; font-size: 25px; font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-style: normal; border-radius: 100px; position: relative; transition: 0.3s; }
.ztc-rule .rule-block .rule-item a:hover { background-color: #36AE37; }
@media screen and (max-width: 768px) { .ztc-rule .rule-block .rule-item a { gap: 12px; } }
.ztc-rule .rule-block .rule-item a.link:before { content: ''; width: 30px; height: 30px; background-color: #ffffff; border-radius: 50%; position: absolute; right: 30px; top: 30%; }
@media screen and (max-width: 768px) { .ztc-rule .rule-block .rule-item a.link:before { right: 22px; top: 30%; width: 24px; height: 24px; } }
.ztc-rule .rule-block .rule-item a.link:after { content: ''; background-image: url(/themes/zutomayo-card/_assets/img/arrow01.svg); width: 11px; height: 12px; background-size: contain; background-repeat: no-repeat; position: absolute; right: 38px; top: 42%; transition: 0.3s; }
@media screen and (max-width: 768px) { .ztc-rule .rule-block .rule-item a.link:after { right: 28px; } }
.ztc-rule .rule-block .rule-item a.link:hover::after { background-image: url(/themes/zutomayo-card/_assets/img/arrow03.svg); }
.ztc-rule .rule-block .rule-item a.pdf::before { content: ''; position: static; width: 23px; height: 28px; background-image: url(/themes/zutomayo-card/_assets/img/icon-pdf.svg); background-repeat: no-repeat; background-size: contain; flex-shrink: 0; }
@media screen and (max-width: 768px) { .ztc-rule .rule-block .rule-item a.pdf::before { width: 18px; height: 22px; } }
.ztc-rule .rule-block .rule-item p { margin-top: 26px; font-size: 15px; font-family: "Noto Sans JP", sans-serif; font-weight: 500; font-style: normal; line-height: 32px; text-align: center; }
@media screen and (max-width: 768px) { .ztc-rule .rule-block .rule-item p { text-align: left; margin-top: 5px; line-height: 1.7em; font-size: 14px; } }
@media (max-width: 960px) { .ztc-rule .rule-block { justify-content: center; }
  .ztc-rule .rule-block .rule-item { max-width: 100%; width: 100%; }
  .ztc-rule .rule-block .rule-item a { font-size: clamp(16px, 3vw, 25px); } }
@media screen and (max-width: 960px) and (max-width: 768px) { .ztc-rule .rule-block .rule-item { padding: 25px 20px 30px; border-radius: 20px; }
  .ztc-rule .rule-block .rule-item a { height: 53px; margin-bottom: 10px; } }

/*# sourceMappingURL=app.css.map */
