@charset "UTF-8";
/*
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: 1920; --sp-size: 100vw; --pc-size: 620px; }

* { box-sizing: border-box; }

html { font-size: 62.5%; }

body { width: 100vw; font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, sans-serif; font-weight: 400; line-height: 1.2; word-wrap: break-word; letter-spacing: .04em; overflow-x: hidden; }
@media screen and (max-width: 767px) { body { font-size: calc(26 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { body { font-size: calc(26 / var(--campus-sp-size) * var(--pc-size)); } }
body.scroll-locked { overflow: hidden; position: fixed; width: 100%; }

.header, .main { color: #765052; }
.header a, .main a { color: #007d8a; text-decoration: none; }

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

ul, li { list-style: none; }

img { height: auto; vertical-align: bottom; }

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

sub { vertical-align: sub; font-size: smaller; }

.colorViolet { color: #441e62; }

.colorRich { color: #101010; }

.colorBrown { color: #553b27; }

.pc { display: none; }

.desktop { display: none; }

@media screen and (min-width: 768px) { .pc { display: inline-block; }
  .sp { display: none; } }
@media screen and (min-width: 1501px) { .desktop { display: inline-block; } }
.ep-header-container, .header-container { display: none; }

.ep-layout-sp { display: block; visibility: visible; }
@media screen and (max-width: 767px) { .ep-layout-sp { margin-top: calc(-130 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .ep-layout-sp { margin-top: calc(-130 / var(--campus-sp-size) * var(--pc-size)); } }
.ep-layout-sp .main { width: 100%; box-shadow: none; }

.button { position: relative; }
.button:not([tabindex="-1"]):not(.favorite)::before { content: ""; display: block; background: url(../img/button_arrow.png) 0 0/contain no-repeat; position: absolute; }
@media screen and (max-width: 767px) { .button:not([tabindex="-1"]):not(.favorite)::before { width: calc(25 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .button:not([tabindex="-1"]):not(.favorite)::before { width: calc(25 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .button:not([tabindex="-1"]):not(.favorite)::before { height: calc(10 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .button:not([tabindex="-1"]):not(.favorite)::before { height: calc(10 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .button:not([tabindex="-1"]):not(.favorite)::before { bottom: calc(55 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .button:not([tabindex="-1"]):not(.favorite)::before { bottom: calc(55 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .button:not([tabindex="-1"]):not(.favorite)::before { right: calc(40 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .button:not([tabindex="-1"]):not(.favorite)::before { right: calc(40 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .button img { width: calc(530 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .button img { width: calc(530 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .button-wrapper { margin-top: calc(30 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .button-wrapper { margin-top: calc(30 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .button-wrapper > :not(:first-of-type) { margin-top: calc(15 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .button-wrapper > :not(:first-of-type) { margin-top: calc(15 / var(--campus-sp-size) * var(--pc-size)); } }

@media screen and (min-width: 768px) { .button { transition: opacity .3s; }
  .button::before { transition: transform .3s; }
  .button:not([tabindex="-1"]) { cursor: pointer; }
  .button:not([tabindex="-1"]):hover { opacity: .7; }
  .button:not([tabindex="-1"]):hover::before { transform: translateX(6px); } }
/*--------------------------------------------------------------------------------------- fadeIn
----------------------------------------------------------------------------------------*/
.fade-in { opacity: 0; transition: opacity .7s ease-out, transform .7s ease-out; }
.fade-in.fade-in-top { transform: translate(0, -30px); }
.fade-in.fade-in-right { transform: translate(50px, 0); }
.fade-in.fade-in-bottom { transform: translate(0, 50px); }
.fade-in.fade-in-left { transform: translate(-30px, 0); }
.fade-in.fade-in-scale { transform: scale(0.995); }
.fade-in.fade-in-active { opacity: 1; transform: translate(0, 0) scale(1); }
.fade-in.duration2s { transition-duration: 2s; }
.fade-in.delay5ms { transition-delay: .5s; }
.fade-in.delay7ms { transition-delay: .7s; }
.fade-in.delay1s { transition-delay: 1s; }

@media screen and (max-width: 767px) { .fade-in.fade-in-top { transform: translate(0, calc(-60 / 750 * 100vw)); }
  .fade-in.fade-in-right { transform: translate(var(--transform-x), 0); } }
@media screen and (max-width: 767px) and (max-width: 767px) { .fade-in.fade-in-right { transform-x: calc(60 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (max-width: 767px) and (min-width: 768px) { .fade-in.fade-in-right { transform-x: calc(60 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .fade-in.fade-in-bottom { transform: translate(0, var(--transform-y)); } }
@media screen and (max-width: 767px) and (max-width: 767px) { .fade-in.fade-in-bottom { transform-y: calc(60 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (max-width: 767px) and (min-width: 768px) { .fade-in.fade-in-bottom { transform-y: calc(60 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .fade-in.fade-in-left { transform: translate(calc(-60 / 750 * 100vw), 0); }
  .fade-in.fade-in-active { opacity: 1; transform: translate(0, 0) scale(1); } }
/*--------------------------------------------------------------------------------------- header
----------------------------------------------------------------------------------------*/
.header { position: fixed; top: 0; left: 0; z-index: 999999; }
@media screen and (max-width: 767px) { .header { padding-top: calc(45 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .header { padding-top: calc(45 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .header { padding-left: calc(50 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .header { padding-left: calc(50 / var(--campus-sp-size) * var(--pc-size)); } }

@media screen and (max-width: 767px) and (max-width: 767px) { .header-logo img { width: calc(234 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (max-width: 767px) and (min-width: 768px) { .header-logo img { width: calc(234 / var(--campus-sp-size) * var(--pc-size)); } }

@media screen and (min-width: 768px) { .header { padding-top: 40px; padding-left: 40px; }
  .header-logo img { width: 158px; } }
/*--------------------------------------------------------------------------------------- bg-fixed / bg-area
----------------------------------------------------------------------------------------*/
.bg-fixed { position: fixed; top: 0; width: 100%; z-index: -1; overflow: hidden; opacity: 0; visibility: hidden; }
.bg-fixed.is-visible { opacity: 1; visibility: visible; }
.bg-fixed.fixed1 { width: 100vw; z-index: 1; }
.bg-fixed.fixed2 { background: url(../img/pc/fixed_bg.png) 50% 50%/cover no-repeat; min-width: 100%; min-height: 100vh; top: 0; left: 0; right: 0; bottom: 0; }
.bg-fixed.fixed2 img { min-width: 100%; width: auto; }

@media screen and (min-width: 768px) { .bg-fixed.fixed1 { width: var(--pc-size); left: 50%; transform: translateX(-24%); } }
.bg-area { position: relative; overflow: hidden; background: url(../img/bg.png) top 0 left 0/100% no-repeat; z-index: -1; }
@media screen and (max-width: 767px) { .bg-area { margin-top: calc(-700 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .bg-area { margin-top: calc(-700 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .bg-area { padding-top: calc(700 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .bg-area { padding-top: calc(700 / var(--campus-sp-size) * var(--pc-size)); } }
.bg-area-wrapper { position: relative; z-index: 1; }

/*--------------------------------------------------------------------------------------- fixed
----------------------------------------------------------------------------------------*/
.fixed { position: fixed; z-index: 999; }
@media screen and (max-width: 767px) { .fixed-button img { width: calc(384 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .fixed-button img { width: calc(384 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .fixed-button:not(:last-of-type) { margin-right: calc(-20 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .fixed-button:not(:last-of-type) { margin-right: calc(-20 / var(--campus-sp-size) * var(--pc-size)); } }
.fixed-button-wrapper { display: flex; justify-content: flex-start; align-items: flex-start; left: calc(20 / var(--campus-sp-size) * var(--sp-size)); opacity: 0; visibility: hidden; transition: opacity .5s, visibility .5s; }
@media screen and (max-width: 767px) { .fixed-button-wrapper { bottom: calc(30 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .fixed-button-wrapper { bottom: calc(30 / var(--campus-sp-size) * var(--pc-size)); } }
.fixed-button-wrapper.is-released { justify-content: center; left: 50%; transform: translateX(-50%); }
@media screen and (max-width: 767px) { .fixed-button-wrapper.is-released { bottom: calc(10 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .fixed-button-wrapper.is-released { bottom: calc(10 / var(--campus-sp-size) * var(--pc-size)); } }
.fixed-button-wrapper.is-show { opacity: 1; visibility: visible; }
@media screen and (max-width: 767px) { .fixed-button-wrapper .button.favorite img { width: calc(260 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .fixed-button-wrapper .button.favorite img { width: calc(260 / var(--campus-sp-size) * var(--pc-size)); } }
.fixed-kv { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: 1000; opacity: 1; transition: opacity 0.5s ease-out; pointer-events: none; }
.fixed-kv.is-fade-out { opacity: 0; }
.fixed-kv img { position: absolute; left: 50%; transform: translateX(-50%); object-fit: cover; }
.fixed-kv img.pc { display: none; }

@media screen and (max-width: 767px) { .fixed-kv { transition: opacity 0.3s ease-out; }
  .fixed-kv img { width: 100%; height: 100%; } }
@media screen and (min-width: 768px) { .fixed-button::before { transition: transform .3s; }
  .fixed-button:not([tabindex="-1"]):hover::before { transform: translateX(10px); }
  .fixed-button-wrapper.windows { left: calc(50% - 235px); transform: translateX(0); }
  .fixed-button-wrapper.sp { display: none; }
  .fixed-kv img.sp { display: none; }
  .fixed-kv img.pc { display: block; } }
/*--------------------------------------------------------------------------------------- columns
----------------------------------------------------------------------------------------*/
.columns { position: relative; opacity: 0; visibility: hidden; }
.columns.is-visible { opacity: 1; visibility: visible; }

/*--------------------------------------------------------------------------------------- main
----------------------------------------------------------------------------------------*/
.main { width: 100vw; display: block; text-align: center; position: relative; z-index: 10; }
.main img { user-drag: none; -webkit-user-drag: none; -moz-user-select: none; }

@media screen and (max-width: 767px) { .main { height: 100%; overflow: hidden; } }
@media screen and (min-width: 768px) { .main { min-width: var(--pc-size); width: var(--pc-size); position: absolute; left: 50%; transform: translateX(-24%); } }
/*--------------------------------------------------------------------------------------- side
----------------------------------------------------------------------------------------*/
.side-column { height: 100vh; display: none; flex-direction: column; justify-content: flex-start; align-items: center; position: fixed; top: 0; z-index: 99; }
.side-column.left { left: 25vw; }
.side-item-wrapper { display: none; }
.side-item-wrapper.is-show { display: block; }

@media screen and (min-width: 1081px) { .side-column { display: flex; }
  .side-item { text-align: center; top: 50%; left: 50%; transform: translate(-50%, -50%); position: absolute; z-index: 10; }
  .side-item-wrapper { display: block; z-index: 100; }
  .side-item::before { content: ""; display: block; background: url(../img/side_item_before.png) 0 0/contain no-repeat; position: absolute; width: 117px; height: 154px; top: 80px; left: -117px; }
  .side-image img { margin-right: -10px; width: 196px; }
  .side-button-wrapper { margin: -15px auto 0; max-width: 215px; }
  .side-button-wrapper .button:not([tabindex="-1"])::before { width: 13px; height: 5px; bottom: 22px; right: 14px; }
  .side-button-wrapper .button img { width: 215px; }
  .side-button-wrapper .button:not([tabindex="-1"]):hover::before { transform: translateX(3px); }
  .side-button-wrapper > :not(:first-of-type) { margin-top: 6px; } }
/*--------------------------------------------------------------------------------------- kv
----------------------------------------------------------------------------------------*/
.kv { position: relative; }
@media screen and (max-width: 767px) { .kv { padding: calc(140 / var(--campus-sp-size) * var(--sp-size)) calc(40 / var(--campus-sp-size) * var(--sp-size)) calc(60 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .kv { padding: calc(140 / var(--campus-sp-size) * var(--pc-size)) calc(40 / var(--campus-sp-size) * var(--pc-size)) calc(60 / var(--campus-sp-size) * var(--pc-size)); } }
.kv-title { z-index: 100; opacity: 0; transition: opacity 0.8s ease-out; position: absolute; right: 0; }
@media screen and (max-width: 767px) { .kv-title { top: calc(691 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .kv-title { top: calc(691 / var(--campus-sp-size) * var(--pc-size)); } }
.kv-title.is-fade-in { opacity: 1; }
@media screen and (max-width: 767px) { .kv-title img { width: calc(647 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .kv-title img { width: calc(647 / var(--campus-sp-size) * var(--pc-size)); } }
.kv-image img { max-width: 100%; }

@media screen and (min-width: 768px) and (max-width: 767px) { .kv { padding-top: calc(55 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) and (min-width: 768px) { .kv { padding-top: calc(55 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (min-width: 768px) and (max-width: 767px) { .kv-title { top: calc(604 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) and (min-width: 768px) { .kv-title { top: calc(604 / var(--campus-sp-size) * var(--pc-size)); } }

/*--------------------------------------------------------------------------------------- product
----------------------------------------------------------------------------------------*/
.product { position: relative; }
@media screen and (max-width: 767px) { .product { padding: calc(160 / var(--campus-sp-size) * var(--sp-size)) 0 calc(80 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product { padding: calc(160 / var(--campus-sp-size) * var(--pc-size)) 0 calc(80 / var(--campus-sp-size) * var(--pc-size)); } }
.product-title { position: relative; }
@media screen and (max-width: 767px) { .product-title { margin-bottom: calc(130 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-title { margin-bottom: calc(130 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-title img { width: calc(711 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-title img { width: calc(711 / var(--campus-sp-size) * var(--pc-size)); } }
.product-text { color: #e06d96; line-height: 2; }
@media screen and (max-width: 767px) { .product-text { margin-bottom: calc(28 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-text { margin-bottom: calc(28 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-text { font-size: calc(26 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-text { font-size: calc(26 / var(--campus-sp-size) * var(--pc-size)); } }
.product-item { text-align: left; position: relative; z-index: 10; }
@media screen and (max-width: 767px) { .product-item { margin-bottom: calc(115 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-item { margin-bottom: calc(115 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-item { padding-left: calc(250 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-item { padding-left: calc(250 / var(--campus-sp-size) * var(--pc-size)); } }
.product-item::before { content: ""; display: block; background: url(../img/product_item_before.png) 0 0/contain no-repeat; position: absolute; z-index: -10; }
@media screen and (max-width: 767px) { .product-item::before { width: calc(702 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-item::before { width: calc(702 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-item::before { height: calc(681 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-item::before { height: calc(681 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-item::before { top: calc(-140 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-item::before { top: calc(-140 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-item::before { left: calc(10 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-item::before { left: calc(10 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-item img { width: calc(249 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-item img { width: calc(249 / var(--campus-sp-size) * var(--pc-size)); } }
.product-name { color: #fef3cb; line-height: calc(42 / 26); }
@media screen and (max-width: 767px) { .product-name { margin-bottom: calc(20 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-name { margin-bottom: calc(20 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-name { font-size: calc(26 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-name { font-size: calc(26 / var(--campus-sp-size) * var(--pc-size)); } }
.product-price { color: #fef3cb; line-height: 1; }
@media screen and (max-width: 767px) { .product-price { margin-bottom: calc(50 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-price { margin-bottom: calc(50 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-price { font-size: calc(28 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-price { font-size: calc(28 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-price small { font-size: calc(18 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-price small { font-size: calc(18 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-note-list { margin-top: calc(60 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-note-list { margin-top: calc(60 / var(--campus-sp-size) * var(--pc-size)); } }
.product-note-item { color: #fff; }
@media screen and (max-width: 767px) { .product-note-item { font-size: calc(22 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-note-item { font-size: calc(22 / var(--campus-sp-size) * var(--pc-size)); } }
.product-note-item a { color: inherit; line-height: 2; position: relative; }
.product-note-item a::before { content: ""; width: 100%; position: absolute; background-color: #fff; }
@media screen and (max-width: 767px) { .product-note-item a::before { bottom: calc(-2 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-note-item a::before { bottom: calc(-2 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-note-item a::before { height: calc(2 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-note-item a::before { height: calc(2 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .product-note-item:not(:last-of-type) { margin-bottom: calc(40 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .product-note-item:not(:last-of-type) { margin-bottom: calc(40 / var(--campus-sp-size) * var(--pc-size)); } }

/*--------------------------------------------------------------------------------------- lead
----------------------------------------------------------------------------------------*/
@media screen and (max-width: 767px) { .lead { padding: calc(20 / var(--campus-sp-size) * var(--sp-size)) 0 calc(120 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lead { padding: calc(20 / var(--campus-sp-size) * var(--pc-size)) 0 calc(120 / var(--campus-sp-size) * var(--pc-size)); } }
.lead-wrapper { height: 100%; text-align: center; }
@media screen and (max-width: 767px) { .lead-title img { width: calc(536 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lead-title img { width: calc(536 / var(--campus-sp-size) * var(--pc-size)); } }

/*--------------------------------------------------------------------------------------- about
----------------------------------------------------------------------------------------*/
.about { position: relative; }
@media screen and (max-width: 767px) { .about { padding: calc(115 / var(--campus-sp-size) * var(--sp-size)) calc(37 / var(--campus-sp-size) * var(--sp-size)) calc(130 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about { padding: calc(115 / var(--campus-sp-size) * var(--pc-size)) calc(37 / var(--campus-sp-size) * var(--pc-size)) calc(130 / var(--campus-sp-size) * var(--pc-size)); } }
.about-wrapper { text-align: center; }
@media screen and (max-width: 767px) { .about-title.title1 { margin-bottom: calc(120 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-title.title1 { margin-bottom: calc(120 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-title.title1 img { width: calc(540 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-title.title1 img { width: calc(540 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-title.title2 { margin-bottom: calc(45 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-title.title2 { margin-bottom: calc(45 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-title.title2 img { width: calc(666 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-title.title2 img { width: calc(666 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-title.title3 { margin-bottom: calc(40 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-title.title3 { margin-bottom: calc(40 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-title.title3 img { width: calc(666 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-title.title3 img { width: calc(666 / var(--campus-sp-size) * var(--pc-size)); } }
.about-text { color: #ffffff; line-height: 2; text-align: center; }
@media screen and (max-width: 767px) { .about-text { font-size: calc(26 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-text { font-size: calc(26 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-text.text1 { margin-bottom: calc(30 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-text.text1 { margin-bottom: calc(30 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-text.text2 { margin-bottom: calc(35 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-text.text2 { margin-bottom: calc(35 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-text.text2 { padding: 0 calc(50 / var(--campus-sp-size) * var(--sp-size)) 0 calc(45 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-text.text2 { padding: 0 calc(50 / var(--campus-sp-size) * var(--pc-size)) 0 calc(45 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-image.image1 { margin: calc(33 / var(--campus-sp-size) * var(--sp-size)) 0 calc(60 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-image.image1 { margin: calc(33 / var(--campus-sp-size) * var(--pc-size)) 0 calc(60 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-image.image1 img { width: calc(565 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-image.image1 img { width: calc(565 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-image.image2 { margin: calc(100 / var(--campus-sp-size) * var(--sp-size)) 0 calc(90 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-image.image2 { margin: calc(100 / var(--campus-sp-size) * var(--pc-size)) 0 calc(90 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-image.image2 img { width: calc(391 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-image.image2 img { width: calc(391 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-image.image3 { margin-top: calc(30 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-image.image3 { margin-top: calc(30 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-image.image3 img { width: calc(571 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-image.image3 img { width: calc(571 / var(--campus-sp-size) * var(--pc-size)); } }
.about-detail { position: relative; }
@media screen and (max-width: 767px) { .about-detail { margin-bottom: calc(120 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-detail { margin-bottom: calc(120 / var(--campus-sp-size) * var(--pc-size)); } }
.about-detail::before { content: ""; display: block; background: url(../img/about_detail_before.png) 0 0/contain no-repeat; position: absolute; }
@media screen and (max-width: 767px) { .about-detail::before { width: calc(193 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-detail::before { width: calc(193 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-detail::before { height: calc(139 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-detail::before { height: calc(139 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-detail::before { top: calc(-70 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-detail::before { top: calc(-70 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-detail::before { left: calc(20 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-detail::before { left: calc(20 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .about-detail img { width: calc(646 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .about-detail img { width: calc(646 / var(--campus-sp-size) * var(--pc-size)); } }

/*--------------------------------------------------------------------------------------- feature
----------------------------------------------------------------------------------------*/
.feature { position: relative; background: url(../img/feature_bg.png) 0 0/100% no-repeat; }
@media screen and (max-width: 767px) { .feature { padding: calc(240 / var(--campus-sp-size) * var(--sp-size)) calc(50 / var(--campus-sp-size) * var(--sp-size)) 0; } }
@media screen and (min-width: 768px) { .feature { padding: calc(240 / var(--campus-sp-size) * var(--pc-size)) calc(50 / var(--campus-sp-size) * var(--pc-size)) 0; } }
@media screen and (max-width: 767px) { .feature { height: calc(3124 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature { height: calc(3124 / var(--campus-sp-size) * var(--pc-size)); } }
.feature-inner { position: relative; }
.feature-box { position: relative; }
@media screen and (max-width: 767px) { .feature-box { padding: 0 calc(40 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-box { padding: 0 calc(40 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-box:not(:last-of-type) { margin-bottom: calc(75 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-box:not(:last-of-type) { margin-bottom: calc(75 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-box.box1 { padding: 0 calc(20 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-box.box1 { padding: 0 calc(20 / var(--campus-sp-size) * var(--pc-size)); } }
.feature-title { text-align: center; position: relative; }
@media screen and (max-width: 767px) { .feature-title { margin-bottom: calc(30 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-title { margin-bottom: calc(30 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-title img { width: calc(530 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-title img { width: calc(530 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-title.title1 { margin-bottom: calc(50 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-title.title1 { margin-bottom: calc(50 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-title.title1 img { width: calc(324 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-title.title1 img { width: calc(324 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-title.title5 { margin-bottom: calc(45 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-title.title5 { margin-bottom: calc(45 / var(--campus-sp-size) * var(--pc-size)); } }
.feature-text { font-weight: 400; line-height: calc(42 / 24); text-align: center; letter-spacing: .01em; }
@media screen and (max-width: 767px) { .feature-text { margin-bottom: calc(30 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-text { margin-bottom: calc(30 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-text { font-size: calc(24 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-text { font-size: calc(24 / var(--campus-sp-size) * var(--pc-size)); } }
.feature-image { text-align: center; }
@media screen and (max-width: 767px) { .feature-image.image1 img { width: calc(488 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-image.image1 img { width: calc(488 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-image.image2 img { width: calc(383 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-image.image2 img { width: calc(383 / var(--campus-sp-size) * var(--pc-size)); } }
.feature-image.image3 { text-align: right; }
@media screen and (max-width: 767px) { .feature-image.image3 img { width: calc(510 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-image.image3 img { width: calc(510 / var(--campus-sp-size) * var(--pc-size)); } }
.feature-note-list { margin-bottom: calc(-15 / 750 * 100vw); margin-left: 0; margin-right: 0; }
@media screen and (max-width: 767px) { .feature-note-list { margin-top: calc(15 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-note-list { margin-top: calc(15 / var(--campus-sp-size) * var(--pc-size)); } }
.feature-note-list-item { font-weight: 400; color: #8f8889; line-height: calc(30 / 20); text-align: center; letter-spacing: -.06em; }
@media screen and (max-width: 767px) { .feature-note-list-item { font-size: calc(20 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-note-list-item { font-size: calc(20 / var(--campus-sp-size) * var(--pc-size)); } }
.feature-icon-list { display: flex; justify-content: center; align-items: flex-start; }
.feature-icon-list .feature-icon-list-item { font-weight: 400; color: #63474c; line-height: calc(24 / 20); text-align: center; letter-spacing: .01em; position: relative; }
@media screen and (max-width: 767px) { .feature-icon-list .feature-icon-list-item { font-size: calc(25 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-icon-list .feature-icon-list-item { font-size: calc(25 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-icon-list .feature-icon-list-item { width: calc(162 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-icon-list .feature-icon-list-item { width: calc(162 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-icon-list .feature-icon-list-item:not(:last-of-type) { margin-right: calc(20 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-icon-list .feature-icon-list-item:not(:last-of-type) { margin-right: calc(20 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-icon-list .feature-icon-list-item::before { width: calc(162 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-icon-list .feature-icon-list-item::before { width: calc(162 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-icon-list .feature-icon-list-item::before { height: calc(162 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-icon-list .feature-icon-list-item::before { height: calc(162 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .feature-icon-list .feature-icon-list-item.silk { padding-top: calc(185 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-icon-list .feature-icon-list-item.silk { padding-top: calc(185 / var(--campus-sp-size) * var(--pc-size)); } }
.feature-icon-list .feature-icon-list-item.silk::before { content: ""; display: block; background: url(../img/feature_icon_silk.png) 0 0/contain no-repeat; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
@media screen and (max-width: 767px) { .feature-icon-list .feature-icon-list-item.aloe { padding-top: calc(185 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-icon-list .feature-icon-list-item.aloe { padding-top: calc(185 / var(--campus-sp-size) * var(--pc-size)); } }
.feature-icon-list .feature-icon-list-item.aloe::before { content: ""; display: block; background: url(../img/feature_icon_aloe.png) 0 0/contain no-repeat; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
@media screen and (max-width: 767px) { .feature-icon-list .feature-icon-list-item.jojoba { padding-top: calc(195 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .feature-icon-list .feature-icon-list-item.jojoba { padding-top: calc(195 / var(--campus-sp-size) * var(--pc-size)); } }
.feature-icon-list .feature-icon-list-item.jojoba::before { content: ""; display: block; background: url(../img/feature_icon_jojoba.png) 0 0/contain no-repeat; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }

/*--------------------------------------------------------------------------------------- lineup
----------------------------------------------------------------------------------------*/
.lineup { position: relative; }
@media screen and (max-width: 767px) { .lineup { margin-top: calc(-130 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup { margin-top: calc(-130 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup { padding: 0 calc(40 / var(--campus-sp-size) * var(--sp-size)) calc(80 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup { padding: 0 calc(40 / var(--campus-sp-size) * var(--pc-size)) calc(80 / var(--campus-sp-size) * var(--pc-size)); } }
.lineup .colorGreige { color: #765052; }
.lineup .colorRich { color: #101010; }
.lineup .colorBrown { color: #553b27; }
.lineup .colorDeepNavy { color: #2e2252; }
@media screen and (max-width: 767px) { .lineup .button-wrapper { margin-top: calc(105 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup .button-wrapper { margin-top: calc(105 / var(--campus-sp-size) * var(--pc-size)); } }
.lineup-container { position: relative; background: url(../img/lineup_bg.png) 0 0/cover no-repeat; }
@media screen and (max-width: 767px) { .lineup-container { height: calc(2541 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-container { height: calc(2541 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-inner { padding: calc(70 / var(--campus-sp-size) * var(--sp-size)) 0 0 calc(73 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-inner { padding: calc(70 / var(--campus-sp-size) * var(--pc-size)) 0 0 calc(73 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-box.box1 { margin-bottom: calc(70 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-box.box1 { margin-bottom: calc(70 / var(--campus-sp-size) * var(--pc-size)); } }
.lineup-box.box1 .lineup-item-wrapper { display: flex; justify-content: flex-start; align-items: flex-end; }
@media screen and (max-width: 767px) { .lineup-box.box1 .lineup-item-wrapper { margin-top: calc(-185 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-box.box1 .lineup-item-wrapper { margin-top: calc(-185 / var(--campus-sp-size) * var(--pc-size)); } }
.lineup-box.box1 .lineup-title.title2::before { content: ""; display: block; background: url(../img/lineup_title_before.png) 0 0/contain no-repeat; position: absolute; z-index: 10; }
@media screen and (max-width: 767px) { .lineup-box.box1 .lineup-title.title2::before { width: calc(149 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-box.box1 .lineup-title.title2::before { width: calc(149 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-box.box1 .lineup-title.title2::before { height: calc(123 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-box.box1 .lineup-title.title2::before { height: calc(123 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-box.box1 .lineup-title.title2::before { top: calc(-148 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-box.box1 .lineup-title.title2::before { top: calc(-148 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-box.box1 .lineup-title.title2::before { left: calc(12 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-box.box1 .lineup-title.title2::before { left: calc(12 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-box.box1 .lineup-text-wrapper { margin: 0 calc(22 / var(--campus-sp-size) * var(--sp-size)) calc(40 / var(--campus-sp-size) * var(--sp-size)) 0; } }
@media screen and (min-width: 768px) { .lineup-box.box1 .lineup-text-wrapper { margin: 0 calc(22 / var(--campus-sp-size) * var(--pc-size)) calc(40 / var(--campus-sp-size) * var(--pc-size)) 0; } }
.lineup-box.box2, .lineup-box.box3, .lineup-box.box4 { display: flex; justify-content: flex-start; align-items: flex-start; }
@media screen and (max-width: 767px) { .lineup-box.box2, .lineup-box.box3, .lineup-box.box4 { margin-bottom: calc(40 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-box.box2, .lineup-box.box3, .lineup-box.box4 { margin-bottom: calc(40 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-box.box2, .lineup-box.box3 { margin-bottom: calc(30 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-box.box2, .lineup-box.box3 { margin-bottom: calc(30 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-title.title1 { margin-bottom: calc(95 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-title.title1 { margin-bottom: calc(95 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-title.title1 img { width: calc(392 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-title.title1 img { width: calc(392 / var(--campus-sp-size) * var(--pc-size)); } }
.lineup-title.title2 { font-weight: 700; line-height: 1; letter-spacing: -.025em; text-align: left; position: relative; }
@media screen and (max-width: 767px) { .lineup-title.title2 { margin-bottom: calc(10 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-title.title2 { margin-bottom: calc(10 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-title.title2 { font-size: calc(26 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-title.title2 { font-size: calc(26 / var(--campus-sp-size) * var(--pc-size)); } }
.lineup-title.title2 small { font-weight: 400; }
@media screen and (max-width: 767px) { .lineup-title.title2 small { font-size: calc(14 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-title.title2 small { font-size: calc(14 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-text-wrapper { margin-left: 0; } }
@media screen and (min-width: 768px) { .lineup-text-wrapper { margin-left: 0; } }
.lineup-item { text-align: left; position: relative; }
.lineup-item-wrapper { width: 100%; }
.lineup-item.item1 { z-index: 10; }
@media screen and (max-width: 767px) { .lineup-item.item1 img { width: calc(303 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-item.item1 img { width: calc(303 / var(--campus-sp-size) * var(--pc-size)); } }
.lineup-item.item2, .lineup-item.item3, .lineup-item.item4 { width: 100%; }
@media screen and (max-width: 767px) { .lineup-item.item2, .lineup-item.item3, .lineup-item.item4 { margin-bottom: calc(17 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-item.item2, .lineup-item.item3, .lineup-item.item4 { margin-bottom: calc(17 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-item.item2 img { width: calc(249 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-item.item2 img { width: calc(249 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-item.item3 img { margin-right: calc(-35 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-item.item3 img { margin-right: calc(-35 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-item.item3 img { width: calc(249 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-item.item3 img { width: calc(249 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-item.item4 img { width: calc(273 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-item.item4 img { width: calc(273 / var(--campus-sp-size) * var(--pc-size)); } }
.lineup-image.image1 { text-align: left; }
@media screen and (max-width: 767px) { .lineup-image.image1 img { width: calc(528 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-image.image1 img { width: calc(528 / var(--campus-sp-size) * var(--pc-size)); } }
.lineup-image.image2, .lineup-image.image3, .lineup-image.image4 { position: relative; }
@media screen and (max-width: 767px) { .lineup-image.image2, .lineup-image.image3, .lineup-image.image4 { margin-right: calc(40 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-image.image2, .lineup-image.image3, .lineup-image.image4 { margin-right: calc(40 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .lineup-image.image2 img, .lineup-image.image3 img, .lineup-image.image4 img { width: calc(230 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-image.image2 img, .lineup-image.image3 img, .lineup-image.image4 img { width: calc(230 / var(--campus-sp-size) * var(--pc-size)); } }
.lineup-catch { font-weight: 400; line-height: 1; letter-spacing: -.025em; text-align: left; }
@media screen and (max-width: 767px) { .lineup-catch { font-size: calc(20 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-catch { font-size: calc(20 / var(--campus-sp-size) * var(--pc-size)); } }
.lineup-note { font-weight: 400; color: #635d59; line-height: calc(26 / 20); text-align: center; }
@media screen and (max-width: 767px) { .lineup-note { font-size: calc(20 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .lineup-note { font-size: calc(20 / var(--campus-sp-size) * var(--pc-size)); } }

/*--------------------------------------------------------------------------------------- curler
----------------------------------------------------------------------------------------*/
.curler { position: relative; z-index: 1; }
.curler-title { text-align: center; }
@media screen and (max-width: 767px) { .curler-title { margin-bottom: calc(70 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-title { margin-bottom: calc(70 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-title img { width: calc(533 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-title img { width: calc(533 / var(--campus-sp-size) * var(--pc-size)); } }
.curler-item-image-wrapper { position: relative; z-index: 10; }
.curler-item-image-wrapper::before { content: ""; display: block; background: url(../img/curler_item_image_before.png) 0 0/contain no-repeat; position: absolute; z-index: -1; }
@media screen and (max-width: 767px) { .curler-item-image-wrapper::before { width: calc(264 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-item-image-wrapper::before { width: calc(264 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-item-image-wrapper::before { height: calc(267 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-item-image-wrapper::before { height: calc(267 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-item-image-wrapper::before { top: calc(250 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-item-image-wrapper::before { top: calc(250 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-item-image-wrapper::before { left: calc(-15 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-item-image-wrapper::before { left: calc(-15 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-item-image-wrapper img { width: calc(261 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-item-image-wrapper img { width: calc(261 / var(--campus-sp-size) * var(--pc-size)); } }
.curler-name { font-weight: 700; line-height: calc(42 / 26); letter-spacing: .01em; }
@media screen and (max-width: 767px) { .curler-name { margin-bottom: calc(15 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-name { margin-bottom: calc(15 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-name { font-size: calc(26 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-name { font-size: calc(26 / var(--campus-sp-size) * var(--pc-size)); } }
.curler-price { font-weight: 400; line-height: 1; letter-spacing: .01em; }
@media screen and (max-width: 767px) { .curler-price { margin-bottom: calc(40 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-price { margin-bottom: calc(40 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-price { font-size: calc(28 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-price { font-size: calc(28 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-price small { font-size: calc(18 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-price small { font-size: calc(18 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-calendar { margin-bottom: calc(10 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-calendar { margin-bottom: calc(10 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-calendar img { width: calc(520 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-calendar img { width: calc(520 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-note-list { margin-top: calc(80 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-note-list { margin-top: calc(80 / var(--campus-sp-size) * var(--pc-size)); } }
.curler-note-item { font-weight: 300; color: #765054; letter-spacing: -.01em; }
@media screen and (max-width: 767px) { .curler-note-item { font-size: calc(22 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-note-item { font-size: calc(22 / var(--campus-sp-size) * var(--pc-size)); } }
.curler-note-item a { color: #007d8a; line-height: 2; position: relative; }
.curler-note-item a::before { content: ""; width: 100%; position: absolute; background-color: #007d8a; }
@media screen and (max-width: 767px) { .curler-note-item a::before { bottom: calc(2 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-note-item a::before { bottom: calc(2 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-note-item a::before { height: calc(2 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-note-item a::before { height: calc(2 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler-note-item:not(:last-of-type) { margin-bottom: calc(20 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler-note-item:not(:last-of-type) { margin-bottom: calc(20 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler1 { background: url(../img/curler_bg.png) 0 0/100% no-repeat; position: relative; overflow: hidden; }
@media screen and (max-width: 767px) { .curler.curler1 { padding-top: calc(1080 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 { padding-top: calc(1080 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 { height: calc(4185 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 { height: calc(4185 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler1 .curler-wrapper { position: relative; z-index: 2; }
@media screen and (max-width: 767px) { .curler.curler1 .curler-box.box1 { margin-bottom: calc(140 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-box.box1 { margin-bottom: calc(140 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 .curler-box.box1 { height: calc(1400 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-box.box1 { height: calc(1400 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 .curler-box.box2 { padding-top: calc(65 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-box.box2 { padding-top: calc(65 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 .curler-title { margin-bottom: calc(40 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-title { margin-bottom: calc(40 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 .curler-title img { width: calc(441 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-title img { width: calc(441 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 .curler-name { padding-top: calc(35 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-name { padding-top: calc(35 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler1 .curler-item { position: relative; }
@media screen and (max-width: 767px) { .curler.curler1 .curler-item img { width: calc(214 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-item img { width: calc(214 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler1 .curler-item::before, .curler.curler1 .curler-item::after { content: ""; display: block; position: absolute; z-index: -1; }
.curler.curler1 .curler-item::before { background: url(../img/curler_item_before.png) 0 0/contain no-repeat; }
@media screen and (max-width: 767px) { .curler.curler1 .curler-item::before { width: calc(172 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-item::before { width: calc(172 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 .curler-item::before { height: calc(141 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-item::before { height: calc(141 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 .curler-item::before { top: calc(80 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-item::before { top: calc(80 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 .curler-item::before { left: calc(76 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-item::before { left: calc(76 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler1 .curler-item::after { background: url(../img/curler_item_after.png) 0 0/contain no-repeat; }
@media screen and (max-width: 767px) { .curler.curler1 .curler-item::after { width: calc(383 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-item::after { width: calc(383 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 .curler-item::after { height: calc(325 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-item::after { height: calc(325 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 .curler-item::after { top: calc(140 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-item::after { top: calc(140 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 .curler-item::after { right: calc(3 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-item::after { right: calc(3 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler1 .curler-text { font-weight: 400; line-height: 2; letter-spacing: .01em; }
@media screen and (max-width: 767px) { .curler.curler1 .curler-text { font-size: calc(24 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-text { font-size: calc(24 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler1 .curler-text + .curler-text { margin-top: calc(50 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler1 .curler-text + .curler-text { margin-top: calc(50 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler2 { background: url(../img/curler_bg2.png) 0 0/100% no-repeat; }
@media screen and (max-width: 767px) { .curler.curler2 { padding: calc(70 / var(--campus-sp-size) * var(--sp-size)) 0 calc(115 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 { padding: calc(70 / var(--campus-sp-size) * var(--pc-size)) 0 calc(115 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 { height: calc(3509 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 { height: calc(3509 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-container { padding: 0 calc(50 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-container { padding: 0 calc(50 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-inner { padding: 0 calc(40 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-inner { padding: 0 calc(40 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-box.box1 { margin-bottom: calc(50 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-box.box1 { margin-bottom: calc(50 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler2 .curler-box.box2 { background-color: #fff; border-style: solid; border-color: #ecddbe; }
@media screen and (max-width: 767px) { .curler.curler2 .curler-box.box2 { border-width: calc(2 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-box.box2 { border-width: calc(2 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-box.box2 { padding: calc(50 / var(--campus-sp-size) * var(--sp-size)) 0 calc(30 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-box.box2 { padding: calc(50 / var(--campus-sp-size) * var(--pc-size)) 0 calc(30 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler2 .curler-title { text-align: center; }
@media screen and (max-width: 767px) { .curler.curler2 .curler-title { margin-bottom: calc(70 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-title { margin-bottom: calc(70 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-title img { width: calc(495 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-title img { width: calc(495 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-item.item1 { margin-bottom: calc(55 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-item.item1 { margin-bottom: calc(55 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-item.item1 img { width: calc(250 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-item.item1 img { width: calc(250 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler2 .curler-item.item2 { width: 100%; text-align: left; position: relative; z-index: 100; }
@media screen and (max-width: 767px) { .curler.curler2 .curler-item.item2 { margin-bottom: calc(20 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-item.item2 { margin-bottom: calc(20 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-item.item2 img { margin-left: calc(50 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-item.item2 img { margin-left: calc(50 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-item.item2 img { width: calc(423 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-item.item2 img { width: calc(423 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-catch { margin-bottom: calc(45 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-catch { margin-bottom: calc(45 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler2 .curler-catch img { width: 100%; }
.curler.curler2 .curler-name { font-weight: 700; color: #101010; line-height: 1; letter-spacing: .01em; }
@media screen and (max-width: 767px) { .curler.curler2 .curler-name { margin-bottom: calc(18 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-name { margin-bottom: calc(18 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-name { font-size: calc(26 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-name { font-size: calc(26 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler2 .curler-price { font-weight: 400; color: #101010; line-height: 1; letter-spacing: .01em; }
@media screen and (max-width: 767px) { .curler.curler2 .curler-price { font-size: calc(28 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-price { font-size: calc(28 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-price small { font-size: calc(18 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-price small { font-size: calc(18 / var(--campus-sp-size) * var(--pc-size)); } }
.curler.curler2 .curler-text { font-weight: 400; color: #101010; line-height: calc(48 / 24); text-align: center; letter-spacing: .01em; }
@media screen and (max-width: 767px) { .curler.curler2 .curler-text { margin-bottom: calc(30 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-text { margin-bottom: calc(30 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .curler.curler2 .curler-text { font-size: calc(26 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .curler.curler2 .curler-text { font-size: calc(26 / var(--campus-sp-size) * var(--pc-size)); } }

@media screen and (min-width: 768px) { .curler-note-item a::before { transition: opacity .3s; }
  .curler-note-item a:hover::before { opacity: 0; } }
.shop .ep-store { padding: 0 5%; margin: 40px 0; position: relative; z-index: 5; }

.shop .ep-store ul { display: flex; justify-content: center; }

.shop .ep-store ul li { border: 1px solid #d2f2f4; width: 46%; text-align: center; }

.shop .ep-store ul li:last-child { margin-left: 4%; }

.shop .ep-store ul li:last-child a p:before { content: ''; display: inline-block; width: 26px; height: 26px; background-image: url("/share/img/sp/list.jpg"); background-repeat: no-repeat; position: absolute; background-size: contain; right: 50%; margin-right: -15px; top: -35px; }

.shop .ep-store ul li:first-child { margin-left: 4%; }

.shop .ep-store ul li:first-child a p:before { content: ''; display: inline-block; width: 26px; height: 26px; background-image: url("/share/img/sp/cart.jpg"); background-repeat: no-repeat; position: absolute; background-size: contain; right: 50%; margin-right: -15px; top: -35px; }

.shop .ep-store ul li a { text-decoration: none; color: #9ad4d8; padding: 70px 0 40px; display: inline-block; width: 100%; }

.shop .ep-store ul li a p { font-size: 16px; letter-spacing: 0.5px; margin-top: 5px; position: relative; font-family: 'Tenali Ramakrishna'; }

.shop { padding-bottom: 0; }

.shop .ep-store { background-repeat: no-repeat; background-size: cover; margin: 0; padding: 0 5% 0; z-index: 0; }
@media screen and (max-width: 767px) { .shop .ep-store { padding-top: calc(35 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .shop .ep-store { padding-top: calc(35 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) { .shop .ep-store { padding-bottom: calc(112 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (min-width: 768px) { .shop .ep-store { padding-bottom: calc(112 / var(--campus-sp-size) * var(--pc-size)); } }

.shop .ep-store ul li { background-color: rgba(255, 255, 255, 0.6); border: 1px solid #d2f2f4; }

.shop .ep-store ul li:first-child { margin-left: 0; }

.shop .ep-store ul li:first-child a p:before { background-image: url("/share/img/sp/cart.png"); }

.shop .ep-store ul li:last-child a p:before { background-image: url("/share/img/sp/list.png"); }

@media screen and (min-width: 749px) { .ep-main-container .ep-section-links { padding-top: 25px; } }
.footer-container { background-color: #f7f9f9; position: relative; z-index: 100; }

.footer-container footer { font-family: 'Tenali Ramakrishna'; padding-bottom: 60px; }

.footer-container footer h3 { padding-top: 50px; text-align: center; }

.footer-container footer h3 img { max-width: 235px; width: 36vw; }

.footer-container footer .mt-50 { margin-top: 50px; }

.footer-container footer ul { display: flex; align-items: center; justify-content: center; margin: 20px 0; }

.footer-container footer ul li { margin: 0 2%; }

.footer-container footer ul li a { text-decoration: none; color: #202020; font-size: 14px; }

.footer-container footer ul li a img { max-width: 50px; width: 100%; }

.footer-container footer div { display: flex; justify-content: center; margin-bottom: 10px; }

.footer-container footer div p { font-size: 14px; margin: 0 3%; }

.footer-container footer div p a { text-decoration: none; color: #888888; }

.footer-container footer p { color: #888888; font-size: 11px; text-align: center; }

@media screen and (max-width: 767px) and (max-width: 767px) { .footer-container footer { padding-bottom: calc(290 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (max-width: 767px) and (min-width: 768px) { .footer-container footer { padding-bottom: calc(290 / var(--campus-sp-size) * var(--pc-size)); } }
@media screen and (max-width: 767px) and (max-width: 767px) { .footer-container footer.is-hide { padding-bottom: calc(110 / var(--campus-sp-size) * var(--sp-size)); } }
@media screen and (max-width: 767px) and (min-width: 768px) { .footer-container footer.is-hide { padding-bottom: calc(110 / var(--campus-sp-size) * var(--pc-size)); } }