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

body { color: #000032; background: #fff; font-size: 1.4vw; letter-spacing: .08em; line-height: 1.6; font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; font-feature-settings: "palt"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
@media screen and (max-width: 599px) { body { font-size: 2.8vw; } }

_:lang(x)::-ms-backdrop, .selector { font-family: "Segoe UI", Meiryo, sans-serif; }

.fnt-ZAS { font-family: "Zen Antique Soft", serif; font-weight: 400; font-style: normal; letter-spacing: normal; }

p { line-height: 1.8; }

img { border: 0; vertical-align: top; }

input, select { position: relative; top: 1px; }

table, th, td { border-collapse: collapse; border-spacing: 0; }

ul, li { list-style: none; }

a:link, a:visited { color: #000032; text-decoration: none; transition: opacity 0.5s; }
a:hover, a:active { opacity: .6; }

#cover { width: 100%; height: 100%; position: fixed; background: #fff; top: 0; left: 0; z-index: 10000; }

#loader { opacity: 0; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 300px; height: 250px; }
#loader img { width: 100%; height: auto; }
@media screen and (max-width: 599px) { #loader { width: 210px; height: 175px; } }

#wrapper { position: relative; }

.floatM { position: fixed; z-index: 100; top: 1.4em; right: 0; }
@media screen and (max-width: 599px) { .floatM { top: inherit; width: 100%; bottom: 0; } }
.floatM ul { position: relative; }
@media screen and (max-width: 599px) { .floatM ul { display: flex; } }
@media screen and (max-width: 599px) { .floatM ul li { width: 50%; } }
.floatM ul li a { display: block; color: #fff; text-align: center; font-size: 80%; font-weight: 700; padding: 1.2em 2em 1.2em 2.2em; border-top-left-radius: 2em; border-bottom-left-radius: 2em; }
@media screen and (max-width: 599px) { .floatM ul li a { font-size: 100%; padding: 1.5em 0 2.2em; border-radius: 0; } }
.floatM ul li a span { display: inline-block; background: url("../img/icn_ec.svg") no-repeat left center/1em; padding-left: 1.5em; }
@media screen and (max-width: 599px) { .floatM ul li a span { background-size: 1.5em; padding-left: 2em; } }
.floatM ul li:first-child { margin-bottom: .5em; }
@media screen and (max-width: 599px) { .floatM ul li:first-child { margin-bottom: 0; } }
.floatM ul li:first-child a { background: #be0000; letter-spacing: .04em; }
.floatM ul li:last-child a { background: #a0823c; }
.floatM ul li:last-child a span { background-image: url("../img/icn_map.svg"); }

#page-top { opacity: 0; position: fixed; bottom: 20px; right: 20px; z-index: 9000; width: 40px; pointer-events: none; }
@media screen and (max-width: 599px) { #page-top { bottom: 6.4em; } }
#page-top img { width: 100%; height: auto; }
#page-top.fade { opacity: 1; transition: opacity .5s; pointer-events: auto; }

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

@media screen and (max-width: 599px) { .nn599 { display: none !important; } }

.fadeinS, .fadein1, .fadein2, .fadein3, .fadein4, .fadein5, .fadein6, .fadeinF { opacity: 0; transform: translateY(30px); transition: opacity 1s ease-in, transform 1s ease-out; }
.fadeinS.active, .fadein1.active, .fadein2.active, .fadein3.active, .fadein4.active, .fadein5.active, .fadein6.active, .fadeinF.active { opacity: 1; transform: translateY(0); }

#header { overflow: hidden; position: fixed; z-index: 900; top: 1.5em; left: 2.5%; }
@media screen and (max-width: 599px) { #header { top: 2.5em; left: 4%; } }
#header h1 { position: relative; width: 6em; }
#header h1 img { width: 100%; height: auto; }

main { position: relative; }
main section { position: relative; }
main section#topMainSct { background: #000; margin-bottom: -12em; }
@media screen and (max-width: 599px) { main section#topMainSct { margin-bottom: -8em; } }
main section#topMainSct .mainBg { display: block; width: 100%; height: auto; }
main section#topMainSct .copyB { position: absolute; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; top: 5em; left: 60%; }
@media screen and (max-width: 599px) { main section#topMainSct .copyB { top: 6.2em; left: inherit; right: 7%; font-size: 110%; } }
main section#topMainSct .copyB .txt1 { display: block; color: #fff; font-size: 190%; line-height: 2; letter-spacing: .06em; }
main section#topMainSct .copyB .txt1 span { letter-spacing: 0; }
main section#topMainSct .copyB .txt1 span.dot { letter-spacing: -.2em; }
main section#topMainSct .copyB .txt2 { display: block; color: #fff; }
main section#topMainSct .copyB .txt2 > span { display: block; font-size: 410%; line-height: 1.25; letter-spacing: .1em; }
main section#topMainSct .copyB .txt2 > span > span { letter-spacing: -.1em; }
main section#topMainSct .secondB { position: relative; top: -12em; }
@media screen and (max-width: 599px) { main section#topMainSct .secondB { top: -8em; } }
main section#topMainSct .secondB .mainBg2 { position: relative; z-index: 1; display: block; width: 100%; height: auto; }
main section#topMainSct .secondB .txtB { position: absolute; z-index: 5; left: 12%; top: 15em; color: #fff; width: 32%; }
@media screen and (max-width: 599px) { main section#topMainSct .secondB .txtB { top: 26em; left: 5%; width: 90%; } }
main section#topMainSct .secondB .txtB .txt1 { display: block; font-size: 200%; letter-spacing: .04em; white-space: nowrap; margin-bottom: .2em; }
@media screen and (max-width: 599px) { main section#topMainSct .secondB .txtB .txt1 { font-size: 220%; } }
main section#topMainSct .secondB .txtB .txt2 { display: block; font-size: 310%; letter-spacing: .04em; line-height: 1.3; white-space: nowrap; margin-bottom: .8em; }
@media screen and (max-width: 599px) { main section#topMainSct .secondB .txtB .txt2 { font-size: 340%; } }
main section#topMainSct .secondB .txtB .txt2 span { display: inline-block; letter-spacing: 0; }
main section#topMainSct .secondB .txtB .txt3 { display: block; padding-left: .4em; font-size: 75%; font-weight: 500; line-height: 1.9; }
@media screen and (max-width: 599px) { main section#topMainSct .secondB .txtB .txt3 { font-size: 136%; } }
main section#topMainSct .secondB .txtB .txt3 span { display: block; margin-bottom: 1.2em; }
main section#topMainSct .secondB .mapB { position: absolute; z-index: 5; bottom: 1.2em; right: 13%; width: 21em; }
@media screen and (max-width: 599px) { main section#topMainSct .secondB .mapB { right: 11%; bottom: 4em; width: 72%; } }
main section#topMainSct .secondB .mapB img { width: 100%; height: auto; }
main section#topAboutSct { background: #000; }
main section#topAboutSct .aboutBg { position: relative; z-index: 1; display: block; width: 100%; height: auto; }
main section#topAboutSct .inner { position: absolute; z-index: 5; color: #fff; top: 5em; left: 50%; transform: translateX(-50%); display: flex; justify-content: space-between; width: 78%; }
@media screen and (max-width: 599px) { main section#topAboutSct .inner { top: 10em; display: block; width: 90%; } }
main section#topAboutSct .inner .copyB { width: 42%; }
@media screen and (max-width: 599px) { main section#topAboutSct .inner .copyB { width: 100%; padding-left: 2%; } }
main section#topAboutSct .inner .copyB p { -ms-writing-mode: tb-rl; writing-mode: vertical-rl; }
main section#topAboutSct .inner .copyB p span { display: block; font-size: 300%; letter-spacing: .1em; line-height: 1.3; }
@media screen and (max-width: 599px) { main section#topAboutSct .inner .copyB p span { font-size: 350%; } }
main section#topAboutSct .inner .detailB { width: 42%; }
@media screen and (max-width: 599px) { main section#topAboutSct .inner .detailB { position: relative; top: -12em; margin-bottom: -12em; width: 100%; text-align: right; } }
main section#topAboutSct .inner .detailB .logo { display: block; width: 8.4em; margin: 0 auto 2.4em; }
@media screen and (max-width: 599px) { main section#topAboutSct .inner .detailB .logo { width: 9em; display: inline-block; margin: 0 8% 2.4em 0; } }
main section#topAboutSct .inner .detailB .logo img { width: 100%; height: auto; }
main section#topAboutSct .inner .detailB .txt { display: block; margin-bottom: 2.4em; }
@media screen and (max-width: 599px) { main section#topAboutSct .inner .detailB .txt { text-align: left; } }
main section#topAboutSct .inner .detailB .txt span { display: block; font-size: 75%; font-weight: 500; line-height: 2; margin-bottom: 1em; }
@media screen and (max-width: 599px) { main section#topAboutSct .inner .detailB .txt span { font-size: 136%; } }
main section#topAboutSct .inner .detailB .btn { position: relative; text-align: center; }
main section#topAboutSct .inner .detailB .btn a { display: inline-block; color: #fff; font-size: 80%; font-weight: 700; border: 2px solid #fff; padding: .6em 3.4em .6em 3em; border-radius: 2em; }
@media screen and (max-width: 599px) { main section#topAboutSct .inner .detailB .btn a { font-size: 140%; padding: .8em 3.8em .8em 3.4em; } }
main section#topAboutSct .inner .detailB .btn a span { display: inline-block; background: url("../img/icn_map.svg") no-repeat left center/1em; padding-left: 1.5em; }
main section#topFlowSct { padding: 5em 12% 4.5em; background: #f7f7f9; text-align: center; }
@media screen and (max-width: 599px) { main section#topFlowSct { padding: 6em 5%; } }
main section#topFlowSct .head { position: relative; display: block; font-size: 170%; line-height: 1.5; letter-spacing: .08em; margin-bottom: 1.4em; }
@media screen and (max-width: 599px) { main section#topFlowSct .head { font-size: 180%; margin-bottom: 1.8em; } }
main section#topFlowSct .head span { display: inline-block; padding-bottom: .12em; background: url("../img/nami2.svg") repeat-x left bottom/100%; }
main section#topFlowSct .flowI { width: 46vw; margin: 0 auto 2.2em; }
@media screen and (max-width: 599px) { main section#topFlowSct .flowI { width: 100%; margin: 0 auto 2.5em; } }
main section#topFlowSct .flowI img { width: 100%; height: auto; }
main section#topFlowSct .txt { font-size: 80%; margin-bottom: 2em; }
@media screen and (max-width: 599px) { main section#topFlowSct .txt { font-size: 136%; margin-bottom: 3em; } }
main section#topFlowSct .btn { position: relative; padding: 2em 0; }
@media screen and (max-width: 599px) { main section#topFlowSct .btn { padding: 10em 0 0; } }
main section#topFlowSct .btn a { position: relative; z-index: 1; display: inline-block; background: #be0000 url("../img/icn_ec.svg") no-repeat 1em center/1em; color: #fff; font-size: 90%; font-weight: 700; padding: .8em 4.5em; border-radius: 2em; box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.2); }
@media screen and (max-width: 599px) { main section#topFlowSct .btn a { width: 100%; font-size: 150%; background-size: 1.5em; background-position: 2.5em center; padding: 1.4em 0 1.4em 2em; border-radius: 3em; } }
main section#topFlowSct .btn a::after { content: ""; position: absolute; z-index: 5; top: -3em; right: -9em; width: 15em; height: 11em; background: url("../img/btn_pac.webp") no-repeat center center/contain; }
@media screen and (max-width: 599px) { main section#topFlowSct .btn a::after { top: -9em; right: inherit; left: 50%; transform: translateX(-50%); background-image: url("../img/btn_pac-sp.webp"); } }
main section#topItemSct .inBox { position: relative; }
main section#topItemSct .inBox .itemBg { position: relative; z-index: 1; width: 100%; height: auto; }
main section#topItemSct .inBox .txtB { position: absolute; z-index: 5; top: 5.4em; left: 12%; width: 38%; color: #fff; }
@media screen and (max-width: 599px) { main section#topItemSct .inBox .txtB { top: 6.5em; left: 5%; width: 90%; } }
main section#topItemSct .inBox .txtB .copy { display: block; font-size: 200%; line-height: 1.4; }
@media screen and (max-width: 599px) { main section#topItemSct .inBox .txtB .copy { font-size: 220%; } }
main section#topItemSct .inBox .txtB .name { display: block; font-size: 320%; line-height: 1.2; margin-bottom: .6em; white-space: nowrap; }
@media screen and (max-width: 599px) { main section#topItemSct .inBox .txtB .name { font-size: 340%; margin-bottom: .8em; } }
main section#topItemSct .inBox .txtB .txt { display: block; font-size: 70%; font-weight: 500; line-height: 2; width: 73%; margin-bottom: 2.4em; }
@media screen and (max-width: 599px) { main section#topItemSct .inBox .txtB .txt { width: 100%; font-size: 136%; } }
main section#topItemSct .inBox .txtB .glaph { width: 19em; }
@media screen and (max-width: 599px) { main section#topItemSct .inBox .txtB .glaph { display: block; width: 94%; margin: 0 auto; } }
main section#topItemSct .inBox .txtB .glaph img { width: 100%; height: auto; }
main section#topItemSct .inBox .txtB .pic { width: 19.5em; }
@media screen and (max-width: 599px) { main section#topItemSct .inBox .txtB .pic { display: block; width: 88%; margin: 0 auto; } }
main section#topItemSct .inBox .txtB .pic img { width: 100%; height: auto; }
main section#topItemSct .inBox .txtB.right { left: 60%; }
@media screen and (max-width: 599px) { main section#topItemSct .inBox .txtB.right { left: 5%; } }
@media screen and (max-width: 599px) { main section#topItemSct .inBox .txtB.scnd .copy { margin-bottom: .3em; }
  main section#topItemSct .inBox .txtB.scnd .txt { margin-bottom: 1em; } }
main section#topItemSct .uniDetail { position: relative; display: flex; }
@media screen and (max-width: 599px) { main section#topItemSct .uniDetail { flex-wrap: wrap; overflow: hidden; } }
main section#topItemSct .uniDetail .txtB { width: 50%; padding: 4em 6% 1em 12%; }
@media screen and (max-width: 599px) { main section#topItemSct .uniDetail .txtB { position: relative; width: 100%; order: 2; z-index: 5; padding: 3em 5% 5em; }
  main section#topItemSct .uniDetail .txtB::after { content: ""; position: absolute; top: -1em; right: -3em; width: 20em; height: 17em; background: url("../img/item_uni_pic2.webp") no-repeat center center/contain; } }
main section#topItemSct .uniDetail .txtB .ttl { font-size: 180%; line-height: 1.5; margin-bottom: 1.2em; }
@media screen and (max-width: 599px) { main section#topItemSct .uniDetail .txtB .ttl { font-size: 190%; } }
main section#topItemSct .uniDetail .txtB .ttl span { display: inline-block; color: #be0000; background: url("../img/nami2.svg") no-repeat center bottom/100%; padding-bottom: .1em; margin-bottom: .15em; }
main section#topItemSct .uniDetail .txtB .txt { font-size: 75%; padding: .8em 50% .8em 0; background: url("../img/item_uni_pic2.webp") no-repeat right center/auto 100%; }
@media screen and (max-width: 599px) { main section#topItemSct .uniDetail .txtB .txt { font-size: 136%; padding: 0; background: none; } }
main section#topItemSct .uniDetail .imgB { width: 50%; }
@media screen and (max-width: 599px) { main section#topItemSct .uniDetail .imgB { width: 100%; order: 1; } }
main section#topItemSct .uniDetail .imgB img { width: 100%; height: auto; }
main section#topItemSct .buyBox { position: relative; overflow: hidden; }
main section#topItemSct .buyBox .itemBg { position: relative; z-index: 1; width: 100%; height: auto; }
main section#topItemSct .buyBox .nami { position: absolute; z-index: 2; bottom: 0; right: 0; }
@media screen and (max-width: 599px) { main section#topItemSct .buyBox .nami { width: 220%; } }
main section#topItemSct .buyBox .nami img { width: 100%; height: auto; }
main section#topItemSct .buyBox .txtB { position: absolute; z-index: 5; top: 5em; left: 0%; width: 100%; text-align: center; }
@media screen and (max-width: 599px) { main section#topItemSct .buyBox .txtB { top: 7em; left: 5%; width: 90%; } }
main section#topItemSct .buyBox .txtB .ttl { display: block; white-space: nowrap; color: #fff; font-size: 320%; line-height: 1.3; margin-bottom: .8em; }
@media screen and (max-width: 599px) { main section#topItemSct .buyBox .txtB .ttl { font-size: 350%; line-height: 1.5; margin-bottom: 1em; } }
main section#topItemSct .buyBox .txtB .ttl span { display: inline-block; letter-spacing: .1em; padding-bottom: .1em; background: url("../img/nami3.svg") no-repeat center bottom/100%; }
@media screen and (max-width: 599px) { main section#topItemSct .buyBox .txtB .ttl span { padding-bottom: 0; } }
main section#topItemSct .buyBox .txtB .txt { display: block; color: #fff; font-size: 75%; white-space: nowrap; margin-bottom: 2em; }
@media screen and (max-width: 599px) { main section#topItemSct .buyBox .txtB .txt { font-size: 136%; white-space: inherit; margin-bottom: 3.2em; } }
main section#topItemSct .buyBox .txtB .btn { position: relative; padding: 2em 0; }
@media screen and (max-width: 599px) { main section#topItemSct .buyBox .txtB .btn { padding: 10em 0 0; } }
main section#topItemSct .buyBox .txtB .btn a { position: relative; z-index: 1; display: inline-block; background: #be0000 url("../img/icn_ec.svg") no-repeat 1em center/1em; color: #fff; font-size: 90%; font-weight: 700; padding: .8em 4.5em; border-radius: 2em; }
@media screen and (max-width: 599px) { main section#topItemSct .buyBox .txtB .btn a { width: 100%; font-size: 150%; background-size: 1.5em; background-position: 2.5em center; padding: 1.4em 0 1.4em 2em; border-radius: 3em; } }
main section#topItemSct .buyBox .txtB .btn a::after { content: ""; position: absolute; z-index: 5; top: -3em; right: -7em; width: 12em; height: 10em; background: url("../img/btn_pac.webp") no-repeat center center/contain; }
@media screen and (max-width: 599px) { main section#topItemSct .buyBox .txtB .btn a::after { top: -9em; right: inherit; width: 15em; height: 11em; left: 50%; transform: translateX(-50%); background-image: url("../img/btn_pac-sp.webp"); } }
main section#topShopSct { padding: 6em 12% 14.6em; background: url("../img/shop_bg.webp") no-repeat center bottom/100%; }
@media screen and (max-width: 599px) { main section#topShopSct { padding: 5em 5% 26em; background-image: url("../img/shop_bg-sp.webp"); } }
main section#topShopSct .pic { display: block; width: 100%; height: auto; margin-bottom: 4.2em; }
@media screen and (max-width: 599px) { main section#topShopSct .pic { margin-bottom: 3em; } }
main section#topShopSct .inner { position: relative; display: flex; }
@media screen and (max-width: 599px) { main section#topShopSct .inner { display: block; } }
main section#topShopSct .inner .logoB { width: 50%; }
@media screen and (max-width: 599px) { main section#topShopSct .inner .logoB { width: 100%; margin-bottom: 2.5em; } }
main section#topShopSct .inner .logoB img { display: block; margin-left: 24%; width: 7em; height: auto; }
@media screen and (max-width: 599px) { main section#topShopSct .inner .logoB img { margin: 0 auto; width: 8em; } }
main section#topShopSct .inner .infoB { width: 50%; }
@media screen and (max-width: 599px) { main section#topShopSct .inner .infoB { width: 100%; } }
main section#topShopSct .inner .infoB table { position: relative; width: 100%; margin-bottom: 1.8em; }
@media screen and (max-width: 599px) { main section#topShopSct .inner .infoB table { margin-bottom: 3em; } }
main section#topShopSct .inner .infoB table tr { border-top: 1px solid #b2b2c1; }
main section#topShopSct .inner .infoB table tr th { font-size: 80%; font-weight: 400; line-height: 1.5; padding: .8em 1em; }
@media screen and (max-width: 599px) { main section#topShopSct .inner .infoB table tr th { font-size: 120%; } }
main section#topShopSct .inner .infoB table tr td { font-size: 80%; line-height: 1.5; padding: .8em 1em; }
@media screen and (max-width: 599px) { main section#topShopSct .inner .infoB table tr td { font-size: 120%; } }
main section#topShopSct .inner .infoB table tr td a { display: inline-block; text-decoration: underline; padding-right: 1.2em; background: url("../img/icn_map2.svg") no-repeat right center/0.8em; }
@media screen and (max-width: 599px) { main section#topShopSct .inner .infoB table tr td a { background-position: 50% bottom; } }
main section#topShopSct .inner .infoB table tr:last-child { border-bottom: 1px solid #b2b2c1; }
main section#topShopSct .inner .infoB .btn { position: relative; text-align: right; }
@media screen and (max-width: 599px) { main section#topShopSct .inner .infoB .btn { text-align: center; } }
main section#topShopSct .inner .infoB .btn a { display: inline-block; background: #fff; font-size: 70%; font-weight: 500; border: 1px solid #000032; padding: 1em 2.5em; border-radius: 2em; }
@media screen and (max-width: 599px) { main section#topShopSct .inner .infoB .btn a { font-size: 130%; } }

#footer { position: relative; }
@media screen and (max-width: 599px) { #footer { text-align: center; } }
#footer .bgImg { position: relative; z-index: 1; width: 100%; height: auto; }
#footer .txtB { position: absolute; z-index: 5; top: 3.4em; left: 5%; width: 28vw; text-align: center; }
@media screen and (max-width: 599px) { #footer .txtB { width: 100%; left: 0; top: 4.4em; } }
#footer .txtB .logo { width: 8.2vw; margin: 0 auto 2.8em; }
@media screen and (max-width: 599px) { #footer .txtB .logo { width: 20vw; margin: 0 auto 2.2em; } }
#footer .txtB .logo img { width: 100%; height: auto; }
#footer .txtB .menu { display: flex; justify-content: center; margin-bottom: 1.8em; }
@media screen and (max-width: 599px) { #footer .txtB .menu { display: inline-block; margin-bottom: 30em; } }
#footer .txtB .menu li { padding: 0 .5em; }
@media screen and (max-width: 599px) { #footer .txtB .menu li { text-align: left; padding-bottom: .5em; } }
#footer .txtB .menu li a { position: relative; color: #fff; font-size: 70%; padding-left: 1.2em; white-space: nowrap; }
@media screen and (max-width: 599px) { #footer .txtB .menu li a { font-size: 140%; } }
#footer .txtB .menu li a::before { content: ""; position: absolute; left: 0; top: 40%; transform: rotate(45deg); border-top: 1px solid #fff; border-right: 1px solid #fff; width: .5em; height: .5em; }
#footer .txtB .cpr { color: #fff; font-size: 60%; }
@media screen and (max-width: 599px) { #footer .txtB .cpr { font-size: 100%; } }
