/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: 100%; }

ul, ol { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

del { text-decoration: line-through; }

table { border-collapse: collapse; border-spacing: 0; }

hr { display: block; height: 1px; border: 0; margin: 1em 0; padding: 0; }

input, select { vertical-align: middle; }

* { box-sizing: border-box; }

:root { --campus-sp-size: 750; --campus-pc-size: 1440; --sp-size: 100vw; --pc-size: 550px; }

* { box-sizing: border-box; }

html { font-size: 62.5%; }

body { font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif; font-size: calc(28 / var(--campus-sp-size) * var(--sp-size)); font-weight: 300; color: #fff; line-height: 1.2; word-wrap: break-word; background-color: #000000; letter-spacing: 0.05em; }

a { color: #333; text-decoration: none; display: inline-block; }

ul, li { list-style: none; }

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

sup { vertical-align: text-top; font-size: unset; }

.pc { display: none; }

@media screen and (min-width: 768px) { .pc { display: inline-block; }
  .sp { display: none; } }
.button { margin-top: calc(10 / var(--campus-sp-size) * var(--sp-size)); }
.button a { padding: calc(18 / var(--campus-sp-size) * var(--sp-size)) 0 calc(19 / var(--campus-sp-size) * var(--sp-size)); width: calc(414 / var(--campus-sp-size) * var(--sp-size)); font-size: calc(28 / var(--campus-sp-size) * var(--sp-size)); font-weight: 700; color: #6a3325; line-height: 1; text-align: center; border-radius: calc(33 / var(--campus-sp-size) * var(--sp-size)); background-color: #ffe400; }

@media screen and (min-width: 768px) { .button { margin-top: 10px; }
  .button a { padding: 11px 0 10px; width: 320px; font-size: 20px; border-radius: 20px; transition: opacity 0.3s; }
  .button a:hover { opacity: 0.7; } }
/*--------------------------------------------------------------------------------------- animation
----------------------------------------------------------------------------------------*/
.fade-in { opacity: 0; position: relative; transform: translate(0, calc(30 / var(--campus-sp-size) * var(--sp-size))); }
.fade-in.fade-in-right { transform: translate(calc(20 / var(--campus-sp-size) * var(--sp-size)), 0); }
.fade-in.fade-in-left { transform: translate(calc(-20 / var(--campus-sp-size) * var(--sp-size)), 0); }
.fade-in.fade-in-active { transform: translate(0, 0); opacity: 1; transition: transform 0.5s, opacity 0.7s; }

/*--------------------------------------------------------------------------------------- bg-area
----------------------------------------------------------------------------------------*/
.bg-area { position: relative; }
.bg-area.area1 { background: url(../img/bg1.png) 0 0/100% no-repeat; }
.bg-area.area2 { background: url(../img/bg2.png) 0 0/100% no-repeat; }

@media screen and (min-width: 768px) { .bg-area.area1 { background: url(../img/pc/bg1.png) top -200px center/100% no-repeat; }
  .bg-area.area2 { background: url(../img/pc/bg2.png) top 0 center/100% no-repeat; } }
/*--------------------------------------------------------------------------------------- header / footer
----------------------------------------------------------------------------------------*/
.header { padding: calc(18 / var(--campus-sp-size) * var(--sp-size)); width: 100%; }
.header-wrapper { display: flex; justify-content: flex-start; align-items: center; }
.header-logo { line-height: 0; }

@media screen and (max-width: 767px) { .header-logo img { width: calc(215 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .header { padding: 18px; }
  .header-logo img { width: 215px; } }
.footer { position: relative; }
.footer-wrapper { padding: calc(25 / var(--campus-sp-size) * var(--sp-size)) calc(30 / var(--campus-sp-size) * var(--sp-size)) calc(35 / var(--campus-sp-size) * var(--sp-size)); }
.footer-wrapper::before { content: ""; width: calc(742 / var(--campus-sp-size) * var(--sp-size)); height: calc(58 / var(--campus-sp-size) * var(--sp-size)); background: url(../img/footer_line.png) top 0 left 50%/100% no-repeat; position: absolute; top: calc(-29 / var(--campus-sp-size) * var(--sp-size)); left: 0; }
.footer-copyright { font-size: calc(20 / var(--campus-sp-size) * var(--sp-size)); font-weight: 300; color: #fff; line-height: 1; text-align: center; letter-spacing: 0.01em; }

@media screen and (min-width: 768px) { .footer { position: relative; }
  .footer-wrapper { margin: 0 auto; max-width: 900px; padding: 36px 0 32px; }
  .footer-wrapper::before { content: ""; width: 952px; height: 56px; background: url(../img/pc/footer_line.png) top 0 left 50%/100% no-repeat; position: absolute; top: -28px; left: 50%; transform: translateX(-50%); }
  .footer-copyright { font-size: 16px; } }
/*--------------------------------------------------------------------------------------- main / side
----------------------------------------------------------------------------------------*/
.main { width: 100vw; display: block; text-align: center; position: relative; }

@media screen and (max-width: 767px) { .main { height: 100%; overflow: hidden; }
  .main .footer { position: relative; } }
@media screen and (min-width: 768px) { .main { overflow-x: hidden; } }
/*--------------------------------------------------------------------------------------- kv
----------------------------------------------------------------------------------------*/
.kv { position: relative; padding-top: calc(60 / var(--campus-sp-size) * var(--sp-size)) calc(40 / var(--campus-sp-size) * var(--sp-size)) calc(80 / var(--campus-sp-size) * var(--sp-size)); }
.kv-image { line-height: 0; }
.kv-title { margin: calc(10 / var(--campus-sp-size) * var(--sp-size)) 0 calc(-20 / var(--campus-sp-size) * var(--sp-size)); line-height: 0; }
.kv-date { line-height: 0; }

@media screen and (max-width: 767px) { .kv-image img { width: calc(690 / var(--campus-sp-size) * var(--sp-size)); }
  .kv-title img { width: calc(727 / var(--campus-sp-size) * var(--sp-size)); }
  .kv-date img { width: calc(550 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .kv { padding: 0 0 70px; }
  .kv-title { margin: -170px 0 -10px; } }
/*--------------------------------------------------------------------------------------- lead
----------------------------------------------------------------------------------------*/
.lead { padding: calc(70 / var(--campus-sp-size) * var(--sp-size)) 0 calc(75 / var(--campus-sp-size) * var(--sp-size)); }
.lead-title { margin-bottom: calc(50 / var(--campus-sp-size) * var(--sp-size)); line-height: 0; }
.lead-text { font-size: calc(28 / var(--campus-sp-size) * var(--sp-size)); line-height: calc(50 / 28); text-align: center; letter-spacing: 0.01em; }
.lead-note { margin-top: calc(20 / var(--campus-sp-size) * var(--sp-size)); font-size: calc(20 / var(--campus-sp-size) * var(--sp-size)); line-height: 1; text-align: center; letter-spacing: 0.01em; }
.lead-image { margin-top: calc(80 / var(--campus-sp-size) * var(--sp-size)); line-height: 0; }
.lead-detail { margin-top: calc(60 / var(--campus-sp-size) * var(--sp-size)); padding: calc(60 / var(--campus-sp-size) * var(--sp-size)) 0; position: relative; }
.lead-detail::before, .lead-detail::after { content: ""; width: calc(742 / var(--campus-sp-size) * var(--sp-size)); height: calc(58 / var(--campus-sp-size) * var(--sp-size)); background: url(../img/lead_detail_line.png) center center/cover no-repeat; position: absolute; left: 50%; transform: translateX(-50%); }
.lead-detail::before { top: calc(-29 / var(--campus-sp-size) * var(--sp-size)); }
.lead-detail::after { bottom: calc(-29 / var(--campus-sp-size) * var(--sp-size)); }
.lead-detail-title { margin-bottom: calc(20 / var(--campus-sp-size) * var(--sp-size)); line-height: 0; }
.lead-detail-image { line-height: 0; }
.lead-movie { margin: calc(60 / var(--campus-sp-size) * var(--sp-size)) auto 0; width: calc(680 / var(--campus-sp-size) * var(--sp-size)); }
.lead-movie-inner { position: relative; width: 100%; height: 0; padding-top: 56.25%; }
.lead-movie iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

@media screen and (max-width: 767px) { .lead-title img { width: calc(625 / var(--campus-sp-size) * var(--sp-size)); }
  .lead-image img { width: calc(715 / var(--campus-sp-size) * var(--sp-size)); }
  .lead-detail-title img { width: calc(607 / var(--campus-sp-size) * var(--sp-size)); }
  .lead-detail-image img { width: calc(633 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lead { padding: 0 0 110px; position: relative; z-index: 1; }
  .lead::before { content: ""; width: 418px; height: 475px; background: url(../img/pc/lead_bg.png) 0 0/contain no-repeat; position: absolute; top: 240px; left: calc(50% + 193px); z-index: -1; }
  .lead-text { font-size: 20px; line-height: calc(44 / 20); }
  .lead-note { margin-top: 10px; font-size: 13px; line-height: calc(18 / 13); }
  .lead-image { margin-top: 45px; }
  .lead-detail { margin-top: 70px; padding: 50px 0 60px; position: relative; display: flex; flex-direction: column; align-items: center; }
  .lead-detail::before, .lead-detail::after { width: 952px; height: 56px; background: url(../img/pc/lead_detail_line.png) center center/cover no-repeat; }
  .lead-detail::before { top: -28px; }
  .lead-detail::after { bottom: -28px; }
  .lead-detail-title { margin-bottom: 10px; }
  .lead-detail-image { flex: 1; display: flex; align-items: center; justify-content: center; }
  .lead-detail-image img { width: 494px; }
  .lead-movie { margin: 40px auto 0; width: 720px; } }
/*--------------------------------------------------------------------------------------- howto
----------------------------------------------------------------------------------------*/
.howto { padding: calc(70 / var(--campus-sp-size) * var(--sp-size)) 0 calc(80 / var(--campus-sp-size) * var(--sp-size)); background-color: #500800; }
.howto-title { margin-bottom: calc(20 / var(--campus-sp-size) * var(--sp-size)); line-height: 0; }
.howto-list { display: flex; flex-direction: column; align-items: center; }
.howto-item { padding-top: calc(40 / var(--campus-sp-size) * var(--sp-size)); width: calc(750 / var(--campus-sp-size) * var(--sp-size)); height: calc(518 / var(--campus-sp-size) * var(--sp-size)); position: relative; z-index: 1; }
.howto-item::before { content: ""; width: calc(750 / var(--campus-sp-size) * var(--sp-size)); position: absolute; top: calc(-50 / var(--campus-sp-size) * var(--sp-size)); left: 50%; transform: translateX(-50%); z-index: -1; }
@media screen and (max-width: 767px) { .howto-item-text { margin-bottom: calc(40 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .howto-item-text { margin-bottom: calc(40 / var(--campus-sp-size) * var(--pc-size)); } }
.howto-item-text p { color: #fff; font-weight: 400; line-height: 1.6; text-align: center; }
@media screen and (max-width: 767px) { .howto-item-text p { font-size: calc(28 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .howto-item-text p { font-size: calc(28 / var(--campus-sp-size) * var(--pc-size)); } }
.howto-icon { margin-bottom: calc(40 / var(--campus-sp-size) * var(--sp-size)); line-height: 0; }
.howto-text { font-size: calc(32 / var(--campus-sp-size) * var(--sp-size)); line-height: calc(48 / 32); text-align: center; }
.howto-text strong { font-weight: 300; color: #efdd78; }
.howto-note-list { margin: calc(45 / var(--campus-sp-size) * var(--sp-size)) auto 0; max-width: calc(690 / var(--campus-sp-size) * var(--sp-size)); }
.howto-note-list li { font-size: calc(20 / var(--campus-sp-size) * var(--sp-size)); line-height: calc(28 / 20); text-align: center; letter-spacing: 0.07em; }
.howto-note-list li:not(:last-of-type) { margin-bottom: calc(10 / var(--campus-sp-size) * var(--sp-size)); }
.howto .button { margin-top: calc(40 / var(--campus-sp-size) * var(--sp-size)); }

@media screen and (max-width: 767px) { .howto-title img { width: calc(263 / var(--campus-sp-size) * var(--sp-size)); }
  .howto-item:nth-of-type(1)::before { height: calc(518 / var(--campus-sp-size) * var(--sp-size)); background: url(../img/howto_step_bg1.png) center center/cover no-repeat; }
  .howto-item:nth-of-type(1) .howto-icon img { width: calc(161 / var(--campus-sp-size) * var(--sp-size)); }
  .howto-item:nth-of-type(2)::before { height: calc(608 / var(--campus-sp-size) * var(--sp-size)); background: url(../img/howto_step_bg2.png) center center/cover no-repeat; }
  .howto-item:nth-of-type(2) .howto-icon img { width: calc(174 / var(--campus-sp-size) * var(--sp-size)); }
  .howto-item:nth-of-type(2) .button a { line-height: 1.2; border-radius: calc(60 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .howto { padding: 55px 0; }
  .howto-list { flex-direction: row; justify-content: center; align-items: flex-start; }
  .howto-item { padding: 30px 0 0; width: 478px; height: 388px; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; }
  .howto-item::before { width: 478px; height: 388px; background: url(../img/pc/howto_step_bg.png) center center/cover no-repeat; top: -40px; }
  .howto-item:nth-of-type(1) .howto-icon img { width: 100px; }
  .howto-item:nth-of-type(1) .button { position: relative; bottom: 138px; }
  .howto-item:nth-of-type(2) .howto-icon img { width: 109px; }
  .howto-item:nth-of-type(2) .button { margin-top: auto; position: relative; bottom: 115px; }
  .howto-item:nth-of-type(2) .button a { padding: 7px 0 9px; line-height: 1.2; border-radius: 30px; }
  .howto-icon { margin-bottom: 15px; display: inline-flex; }
  .howto-text { flex: 1; font-size: 20px; }
  .howto-note-list { margin-top: -40px; }
  .howto-note-list li { font-size: 13px; line-height: calc(18 / 13); }
  .howto-note-list li:not(:last-of-type) { margin-bottom: 4px; } }
/*--------------------------------------------------------------------------------------- ranking
----------------------------------------------------------------------------------------*/
.ranking { padding: calc(70 / var(--campus-sp-size) * var(--sp-size)) 0 calc(50 / var(--campus-sp-size) * var(--sp-size)); }
.ranking-title { margin-bottom: calc(50 / var(--campus-sp-size) * var(--sp-size)); line-height: 0; }
.ranking-text { margin-bottom: calc(100 / var(--campus-sp-size) * var(--sp-size)); font-size: calc(28 / var(--campus-sp-size) * var(--sp-size)); line-height: calc(50 / 28); text-align: center; }
.ranking-result { margin-bottom: calc(-40 / var(--campus-sp-size) * var(--sp-size)); position: relative; line-height: 0; }
.ranking-coming { margin-top: calc(30 / var(--campus-sp-size) * var(--sp-size)); line-height: 0; }
.ranking-list { margin-top: calc(50 / var(--campus-sp-size) * var(--sp-size)); display: flex; flex-direction: column; align-items: center; }
.ranking-item { padding: calc(85 / var(--campus-sp-size) * var(--sp-size)) calc(80 / var(--campus-sp-size) * var(--sp-size)) calc(70 / var(--campus-sp-size) * var(--sp-size)); width: calc(750 / var(--campus-sp-size) * var(--sp-size)); height: calc(1085 / var(--campus-sp-size) * var(--sp-size)); background: url(../img/ranking_item_bg.png) center center/cover no-repeat; }
.ranking-item:not(:last-of-type) { margin-bottom: calc(-34 / var(--campus-sp-size) * var(--sp-size)); }
.ranking-item:nth-of-type(1) .ranking-item-date { line-height: calc(28 / 20); }
.ranking-item-image { margin-bottom: calc(40 / var(--campus-sp-size) * var(--sp-size)); line-height: 0; }
.ranking-item-edition { margin-bottom: calc(20 / var(--campus-sp-size) * var(--sp-size)); text-align: left; line-height: 0; }
.ranking-item-name { margin-bottom: calc(20 / var(--campus-sp-size) * var(--sp-size)); text-align: left; line-height: 0; }
.ranking-item-date { margin-bottom: calc(44 / var(--campus-sp-size) * var(--sp-size)); font-size: calc(25 / var(--campus-sp-size) * var(--sp-size)); line-height: 1; text-align: left; }
.ranking-item-text { font-size: calc(28 / var(--campus-sp-size) * var(--sp-size)); line-height: calc(50 / 28); text-align: left; letter-spacing: 0.01em; }
.ranking-item .button a { padding: calc(25 / var(--campus-sp-size) * var(--sp-size)) 0 calc(24 / var(--campus-sp-size) * var(--sp-size)); width: calc(512 / var(--campus-sp-size) * var(--sp-size)); font-size: calc(40 / var(--campus-sp-size) * var(--sp-size)); line-height: 1; border-radius: calc(43 / var(--campus-sp-size) * var(--sp-size)); }
.ranking-note { font-size: calc(20 / var(--campus-sp-size) * var(--sp-size)); line-height: calc(28 / 20); text-align: center; }

@media screen and (max-width: 767px) { .ranking-title img { width: calc(474 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-result img { width: calc(447 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-coming img { width: calc(750 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-item:nth-of-type(1) .ranking-item-edition img { width: calc(115 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-item:nth-of-type(1) .ranking-item-name img { width: calc(590 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-item:nth-of-type(2) { height: calc(1125 / var(--campus-sp-size) * var(--sp-size)); background: url(../img/ranking_item_bg2.png) center center/cover no-repeat; }
  .ranking-item:nth-of-type(2) .ranking-item-edition img { width: calc(125 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-item:nth-of-type(2) .ranking-item-name img { width: calc(484 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-item:nth-of-type(3) { height: calc(1121 / var(--campus-sp-size) * var(--sp-size)); background: url(../img/ranking_item_bg3.png) center center/cover no-repeat; }
  .ranking-item:nth-of-type(3) .ranking-item-edition img { width: calc(123 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-item:nth-of-type(3) .ranking-item-name img { width: calc(592 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-item:nth-of-type(4) { height: calc(1222 / var(--campus-sp-size) * var(--sp-size)); background: url(../img/ranking_item_bg4.png) center center/cover no-repeat; }
  .ranking-item:nth-of-type(4) .ranking-item-edition img { width: calc(123 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-item:nth-of-type(4) .ranking-item-name img { width: calc(363 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-item:nth-of-type(5) { height: calc(1175 / var(--campus-sp-size) * var(--sp-size)); background: url(../img/ranking_item_bg5.png) center center/cover no-repeat; }
  .ranking-item:nth-of-type(5) .ranking-item-edition img { width: calc(125 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-item:nth-of-type(5) .ranking-item-name img { width: calc(429 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-item-text { margin-bottom: calc(40 / var(--campus-sp-size) * var(--sp-size)); }
  .ranking-item-image img { width: calc(630 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .ranking { padding: 75px 0 40px; }
  .ranking-title { margin-bottom: 40px; line-height: 0; }
  .ranking-text { margin-bottom: 70px; font-size: 20px; line-height: calc(44 / 20); }
  .ranking-result { margin-bottom: -100px; line-height: 0; }
  .ranking-coming { margin-top: 80px; line-height: 0; }
  .ranking-list { margin: 0 auto; max-width: 998px; }
  .ranking-item { max-width: 100%; padding: 70px 50px 50px; min-width: 998px; height: 500px; background: url(../img/pc/ranking_item_bg.png) center center/cover no-repeat; display: flex; flex-direction: column; }
  .ranking-item:not(:last-of-type) { margin-bottom: -40px; }
  .ranking-item-inner { display: flex; justify-content: center; align-items: flex-start; flex: 1; }
  .ranking-item-content { margin-left: 50px; max-width: 420px; }
  .ranking-item-image { margin-bottom: 15px; padding-top: 40px; line-height: 0; }
  .ranking-item-image img { max-width: 390px; }
  .ranking-item-edition { margin-bottom: 15px; line-height: 0; }
  .ranking-item-edition img { max-width: 80px; }
  .ranking-item-name { margin-bottom: 15px; line-height: 0; }
  .ranking-item-date { margin-bottom: 20px; font-size: 16px; }
  .ranking-item-text { font-size: 16px; line-height: calc(28 / 16); }
  .ranking-item .button { position: relative; bottom: 30px; }
  .ranking-item .button a { padding: 11px 0 12px; width: 320px; font-size: 28px; line-height: 1; border-radius: 25px; }
  .ranking-note { margin-top: -15px; font-size: 13px; line-height: calc(18 / 13); } }
/*--------------------------------------------------------------------------------------- terms
----------------------------------------------------------------------------------------*/
.terms { padding: calc(50 / var(--campus-sp-size) * var(--sp-size)) 0 calc(110 / var(--campus-sp-size) * var(--sp-size)); }
.terms-title { line-height: 0; }
.terms-container { padding: calc(55 / var(--campus-sp-size) * var(--sp-size)) calc(55 / var(--campus-sp-size) * var(--sp-size)) calc(60 / var(--campus-sp-size) * var(--sp-size)) calc(60 / var(--campus-sp-size) * var(--sp-size)); width: calc(744 / var(--campus-sp-size) * var(--sp-size)); height: calc(448 / var(--campus-sp-size) * var(--sp-size)); background: url(../img/terms_bg.png) center center/cover no-repeat; }
.terms-inner { padding: calc(5 / var(--campus-sp-size) * var(--sp-size)) calc(5 / var(--campus-sp-size) * var(--sp-size)) 0 0; max-height: calc(350 / var(--campus-sp-size) * var(--sp-size)); overflow-y: scroll; }
.terms-inner::-webkit-scrollbar { width: calc(19 / var(--campus-sp-size) * var(--sp-size)); }
.terms-inner::-webkit-scrollbar-track { border-radius: calc(10 / var(--campus-sp-size) * var(--sp-size)); }
.terms-inner::-webkit-scrollbar-thumb { background-color: #802c23; border-radius: calc(10 / var(--campus-sp-size) * var(--sp-size)); }
.terms-subtitle { margin-top: calc(40 / var(--campus-sp-size) * var(--sp-size)); font-size: calc(28 / var(--campus-sp-size) * var(--sp-size)); font-weight: 500; line-height: calc(50 / 28); text-align: left; position: relative; }
.terms-text { margin-bottom: 0; font-size: calc(28 / var(--campus-sp-size) * var(--sp-size)); line-height: calc(50 / 28); text-align: left; }
.terms-text a { font-weight: 400; color: #fff; text-decoration: underline; word-break: break-all; transition: opacity 0.3s; letter-spacing: 0.025em; }

@media screen and (max-width: 767px) { .terms-title img { width: calc(263 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .terms { padding: 50px 0 90px; }
  .terms-container { padding: 60px 50px 50px 60px; width: 954px; height: 334px; background: url(../img/pc/terms_bg.png) center center/cover no-repeat; position: relative; left: 50%; transform: translateX(-50%); }
  .terms-inner { padding: 5px 5px 0 0; max-height: 220px; overflow-y: scroll; }
  .terms-inner::-webkit-scrollbar { width: 12px; }
  .terms-inner::-webkit-scrollbar-track { border-radius: 6px; }
  .terms-inner::-webkit-scrollbar-thumb { background-color: #802c23; border-radius: 6px; }
  .terms-subtitle { margin-top: 20px; font-size: 18px; line-height: calc(30 / 18); text-align: left; position: relative; }
  .terms-text { margin-bottom: 0; font-size: 18px; line-height: calc(30 / 18); text-align: left; }
  .terms-text a:hover { opacity: 0.7; } }