@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500&display=swap');

html, body, h1, h2, h3, h4, ul, ol, dl, li, dt, dd, p, div, span, img, a, table, tr, th, td, figure, figcaption { border: 0; font-size: 100%; font-weight: normal; margin: 0; padding: 0; vertical-align: baseline; }
article, header, footer, main, aside, figure, figcaption, nav, section { display: block; }
body { line-height: 1; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
ol, ul { list-style: none; list-style-type: none; }
input, button, textarea { -webkit-appearance: none; appearance: none; font-size: 1em; }
input[type="button"], button { background: none; border: 0; font-size: 1em; padding: 0; }
button { overflow: visible; }
em { font-style: normal; }
*, *::before, *::after { box-sizing: border-box; }

@font-face { font-family: 'icon'; src: url('../font/icon.eot'); src: url('../font/icon.eot#iefix') format('embedded-opentype'), url('../font/icon.woff2') format('woff2'), url('../font/icon.woff') format('woff'), url('../font/icon.ttf') format('truetype'), url('../font/icon.svg#icon') format('svg'); font-weight: normal; font-style: normal; }

 [class^="ic-"]:before, [class*=" ic-"]:before { font-family: "icon"; font-style: normal; font-weight: normal; speak: never; display: inline-block; text-decoration: inherit; text-align: center; font-variant: normal; text-transform: none; line-height: 1;-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.ic-cart:before { content: '\e800'; }
.ic-link-arrow:before { content: '\e801'; }
.ic-link-ext:before { content: '\e802'; }
.ic-cancel:before { content: '\e803'; }
.ic-phone:before { content: '\e804'; }
.ic-mail:before { content: '\e805'; }
.ic-angle-left:before { content: '\f104'; }
.ic-angle-right:before { content: '\f105'; }
.ic-angle-up:before { content: '\f106'; }
.ic-angle-down:before { content: '\f107'; }
.ic-instagram:before { content: '\f16d'; }
.ic-facebook-official:before { content: '\f230'; }

@keyframes nav-open {
from { transform: translateX(100%); opacity: 0; }
to { transform: translateX(0); }
}
@keyframes nav-close {
from { transform: translateX(0); }
to { transform: translateX(-100%); opacity: 0; }
}
@keyframes fadeInDown {
from { opacity: 0; transform: translate3d(0, -100%, 0); }
to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes scroll {
0% { transform: translate3d(0, -100%, 0); }
15% { transform: translate3d(0, -98%, 0); }
85% { transform: translate3d(0, 98%, 0); }
100% { transform: translate3d(0, 100%, 0); }
}
@keyframes svg {
0% { stroke-dashoffset: 1200px; }
30% { fill: transparent; }
60% { stroke-dashoffset:0; }
100% { fill: #24315a; stroke-dashoffset:0; }
}

body { background-color: #fff; min-height: 100%; text-align: left; -webkit-text-size-adjust: 100%; word-wrap: break-word; }
img, svg { display: block; line-height: 1; margin: auto; max-width: 100%; vertical-align: top; }

a { transition: color .4s ease; }
a { color: #24315a; text-decoration: none; }
a img { transition: all .4s ease; }
/*a:hover { color: #656e8b; }*/
/*a:hover img { opacity: .75; }*/

.l-page { color: #333; font-family: 'Noto Serif JP', serif; font-size: 16px; font-weight: normal; line-height: 1.73; overflow: hidden; }

.l-breadcrumbs { background-color: #f2f3f5; padding: 0 1.5em; }
.l-breadcrumbs__list { display: flex; width: 100%; }
.l-breadcrumbs__item { font-size: .8125em; line-height: 3.0769; white-space: nowrap; }
.l-breadcrumbs__item + .l-breadcrumbs__item::before { background-color: #c1c1c1; content: ""; display: inline-block; height: 1px; margin: 0 .8em; vertical-align: middle; width: 1em; }
.l-breadcrumbs__item a { line-height: 1; }
.l-footer__wrap { display: flex; justify-content: flex-start; }
.l-footer__logo { flex: none; }
.l-footer__logo small { display: block; font-size: .75em; margin-top: 3em; }
.l-footer__menu { display: flex; justify-content: flex-end; width: 75%; }
.l-footer__block { padding-left: 7em; }
.l-footer__menu--item { font-size: .875em; }
.l-footer__menu--item + .l-footer__menu--item { margin-top: 1.75em; }
.l-footer__menu--item a:hover, .l-nav__item a:hover { color: #656e8b; text-decoration: underline; }
.l-header { background-color: #fff; display: flex; justify-content: space-between; width: 100%; }
.l-header__nav { align-items: center; display: flex; padding: 0 1.5em; position: relative; width: calc(100% - 70px); }
.l-header__logo { margin-right: 3.25em; }
.l-header__cart { width: 100px; }
.l-header__cart a { align-items: center; background-color: #24315a; display: flex; height: 70px; justify-content: center; transition: background-color .4s ease; }
.l-header__cart a span { color: #fff; font-size: .6875em; }
.l-header__cart a span::before { content: "\e800"; display: block; font-family: "icon"; font-size: 2.1818em; line-height: 1.2; text-align: center; }
.l-header__cart a:hover { background-color: #656e8b; }
.l-loading { background-color: #fff; display: flex; height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 2000; }
.l-loading .st0 { animation: svg 2s ease-in 0s forwards; fill:transparent; stroke: #24315a; stroke-dasharray: 1200px; stroke-dashoffset: 1200px; stroke-width: 1px; }
.l-main { display: block; }
.l-nav__btn, .l-nav__dropdown { display: none; }

.c-button { align-items: center; background-color: #fff; border: 1px solid #24315a; display: flex; height: 3em; justify-content: center; margin: 0 auto; position: relative; width: 100%; }
.c-button::before { background-color: rgba(36,49,90,0); content: ""; height: 100%; left: 0; position: absolute; top: 0; transition: all .4s ease-in-out; width: 0; }
.c-button::after { border: solid #24315a; border-width: 0 1px 1px 0; bottom: -4px; content: ""; display: block; height: 100%; position: absolute; right: -4px; width: 100%; }
.c-button span { color: #24315a; font-size: .875em; text-align: center; transition: all .4s ease-in-out; z-index: 1; }
.c-button span::after { content: "\e801"; display: inline-block; font-family: "icon"; font-size: 1.25rem; position: absolute; right: 1em; top: 50%; transform: translateY(-50%); }
.c-button:hover { cursor: pointer; }
.c-button:hover span { color: #fff; }
.c-button:hover::before { background-color: rgba(36,49,90,1); width: 100%; }
.c-button__prev span::after { left: 1em; right: auto !important; transform: translateY(-50%)scale(-1,1); }
.c-button.c-link__ext span::after { content: "\e802"; font-size: 1em; padding-left: .5em; position: static; transform: translateY(0%); }
.c-button__wrap { margin-top: 3.125em; }
.c-button__wrap .c-button + .c-button { margin-left: 2em; }
.c-cal { padding: 2em 0; text-align: center; }
.c-cal p { margin-top: 2em; }
.c-cal p span::before { content: ""; display: inline-block; height: 1.25em; margin-right: .3em; vertical-align: middle; width: 1.25em; }
.c-cal p span + span { margin-left: 2em; }
.c-cal p .holiday::before, .c-cal__table .holiday { background-color: #ffb3ba; }
.c-cal p .shorten::before, .c-cal__table .shorten { background-color: #f5ddff; }
.c-cal__month { margin-bottom: .25em; text-align: center; }
.c-cal__month em { font-size: 1.375em; }
.c-cal__table { border-collapse: collapse; display: table; table-layout: fixed; width: 100%; }
.c-cal__table, .c-cal__table th, .c-cal__table td { border: 1px solid #dbdbdb; text-align: center; }
.c-cal__table th, .c-cal__table td { padding: .5em 1em; }
.c-cal__table th { background-color: #eaedf4; }
.c-cap { font-size: .8125em; }
.c-col + .c-col { margin-top: 3em; }
.c-company__wrap { padding-left: 50%; position: relative; }
.c-company__wrap::before { background: #000 url(../img/bg-company.jpg) no-repeat 12.5% 0 / contain; content: ""; display: block; height: 100%; left: 0; position: absolute; top: -2.5em; width: 75%; }
.c-company__box { padding-bottom: 5em; padding-top: 5em; position: relative; text-align: center; width: 100%; z-index: 1; }
.c-company__box a + .c-section__title { margin-top: 3.375em; }
.c-contact__info div::before { color: #24315a; padding-right: .6em; }
.c-contact__info .ic-phone { font-size: 2em; text-align: center; }
.c-contact__info .ic-phone span { display: inline-block; font-size: .5em; margin-left: 1em; }
.c-contact__info .ic-mail { font-size: 1.25em; }
.c-contents { margin-top: 3.375em; }
.c-contents a { text-decoration: underline; }
.c-contents a:hover { color: #656e8b; }
.c-contents .c-button { text-decoration: none; }
.c-contents h2 { color: #24315a; font-size: 1.625em; margin: .5em 0 1em; position: relative; }
.c-contents.c-page h2 { margin-top: 2.5em; }
.c-contents h3 { color: #24315a; font-size: 1.25em; margin: 2.5em 0 1em; position: relative; }
.c-contents .c-title__line::after { background-color: #24315a; content: ""; display: inline-block; height: 1px; position: absolute; right: 0; top: 50%; width: 98%; }
.c-contents .c-title__line span { background-color: #fff; padding-right: 1.5em; position: relative; z-index: 1; }
.c-contents .caution { color: #e74f4f; }
.c-contents dl { overflow: hidden; width: 100%; }
.c-contents dl dt { clear: left; float: left; padding-right: 1em; }
.c-contents dl dd { float: left; }
.c-contents li { padding-left: 1em; text-indent: -1em; }
.c-contents li::before { background-color: #24315a; border-radius: 50%; content: ""; display: inline-block; height: .375em; margin-right: .6em; vertical-align: middle; width: .375em; }
.c-contents p + p, .c-contents p + ul, .c-contents p + dl, .c-contents dl + p, .c-contents .notes + p, .c-contents .notes + .c-map, .c-contents .c-map + ul { margin-top: 1.8em; }
.c-contents .mt00 { margin-top: 0; }
.c-contents .notes { background-color: #f2f3f5; border: 1px dotted #a7adbd; color: #656e8b; font-size: .875em; margin-top: 2em; padding: 1.5em; }
.c-contents__title { color: #24315a; font-size: 2.125em; }
.c-curriculum__table {  border-collapse: collapse; display: table; width: 100%; }
.c-curriculum__table, .c-curriculum__table th, .c-curriculum__table td { border: 1px solid #dbdbdb; text-align: center; }
.c-curriculum__table th, .c-curriculum__table td { padding: 1em; vertical-align: middle; }
.c-curriculum__table th { background-color: #7483b4; color: #fff; }
.c-curriculum__table .cell01 { background-color: #eaedf4; }
.c-contact__bottom { background: url(../img/bg-contact.png) no-repeat 50% 50%; }
.c-custom__wrap { padding-bottom: 5em; padding-top: 5em; position: relative; }
.c-custom__wrap::before { background-color: #f2f3f5; content: ""; display: block; height: 100%;position: absolute; right: 0; top: 0; width: 75%; }
.c-custom__item a { padding-top: 65.3846%; }
.c-custom__item .c-img__btn--title { font-size: 1.875em; text-align: center; }
.c-custom__item .c-img__btn--title small { display: block; font-size: .4667em; }
/*.c-directory__item:hover { cursor: pointer; }*/
.c-directory__item .c-button { margin-top: 1.25em; }
.c-directory__item .pic { background: #eee no-repeat 50% 50% / cover; display: block; margin-bottom: 1.25em; padding-top: 66.6667%; }
.c-directory__txt { border-top: 1px solid #dbdbdb; color: #333; margin-top: 1em; padding-top: 1em; }
.c-directory__title { color: #24315a; font-size: 1.25em; }
.c-entry table { margin-top: 1.8em; width: 100%; }
.c-entry th, .c-entry td { border-bottom: 1px dotted #dbdbdb; padding: 0.25em; vertical-align: middle; }
.c-entry__data span + span { margin-left: 1em; }
.c-entry__label { border: 1px solid #656e8b; color: #656e8b; font-size: .875em; padding: .1em 1em; }
.c-entry__title { border-bottom: 1px solid #24315a; margin-bottom: 2em !important; padding-bottom: .2em; }
.c-flow__list { padding-bottom: 5em; }
.c-flow__item { position: relative; }
.c-flow__item::before { border-left: 1px dashed #656e8b; content: ""; display: block; height: calc(100% + 2em); left: 2em; position: absolute; top: 0; width: 1px; }
.c-flow__item::after { border-left: .375em solid transparent; border-right: .375em solid transparent; border-top: .5em solid #656e8b; content: ""; display: block; height: 0; left: 1.625em; position: absolute; top: calc(100% + 2em); width: 0; }
.c-flow__item:last-child::before, .c-flow__item:last-child::after { content: none; }
.c-flow__item p { padding-left: 6em; }
.c-flow__label { background-color: #24315a; border-radius: .25em; color: #fff; display: inline-block; font-size: .75em; line-height: 1.2; margin-right: 2em; padding: .4em 0; text-align: center; vertical-align: middle; width: 4.4em; }
.c-flow__label em { display: block; font-size: 2em; }
.c-form button { margin: 0 1.5em; }
.c-form input, .c-form textarea { background-color: #eee; border: none; font-family: 'Noto Serif JP', serif; outline: none; padding: .6em 1em; }
.c-form input:focus, .c-form textarea:focus { background-color: #eaedf4; outline: 0; }
.c-form .c-table { margin-top: 2em; }
.c-form .error { color: #e74f4f; }
.c-form .require { color: #e74f4f; font-size: .75em; padding-left: 1em; }
.c-form__back { align-items: center; background-color: #ccc; border: 1px solid #ccc; cursor: pointer; display: flex; height: 3em; justify-content: center; margin: 0 auto; position: relative; width: 100%; }
.c-form__back::after { border: solid #ccc; border-width: 0 1px 1px 0; bottom: -4px; content: ""; display: block; height: 100%; position: absolute; right: -4px; width: 100%; }
.c-form__back span { color: #444; font-size: .875em; text-align: center; }
.c-form__btn { margin-top: 1.8em; text-align: center; }
.c-form__btn p { margin-bottom: 1.8em; }
.c-form__btn--wrap { display: flex; justify-content: center; }
.c-group__item + .c-group__item { margin-top: 2em; }
.c-group__item a { color: #333; text-decoration: none; }
.c-group__item a strong { color: #24315a; display: block; font-weight: bold; }
.c-img__btn a { display: block; overflow: hidden; padding-top: 65.2582%; position: relative; width: 100%; }
.c-img__btn a::after { background-color: rgba(0,0,0,.2); bottom: 0; content: ""; display: block; position: absolute; right: 0; top: 0; transition-duration: .4s; width: 100%; }
.c-img__btn a img { bottom: 0; left: 0; height: auto; margin: 0; position: absolute; right: 0; top: 0; transition-duration: .4s; width: 100%; }
.c-img__btn--title { color: #fff; display: block; left: 50%; position: absolute; text-shadow: 0 0 3px rgba(0,0,0,.5); top: 50%; transform: translate(-50%, -50%); white-space: nowrap; z-index: 1; }
.c-img__btn a:hover::after { opacity: 0; }
.c-img__btn a:hover img { transform: scale(1.1); }
.c-inner { margin: 0 auto; max-width: 1236px; position: relative; width: 100%; }
.c-inner__full { margin: 0; position: relative; width: 100%; }
.c-page-nav__list { border-top: 1px dashed #dbdbdb; margin-top: 3em; overflow: hidden; padding-top: 2em; }
.c-page-nav__item { display: inline-block; }
.c-page-nav__item.prev { float: left; }
.c-page-nav__item.next { float: right; }
.c-page-nav__item.prev::before, .c-page-nav__item.next::after { color: #24315a; content: "\e801"; display: inline-block; font-family: "icon"; font-size: 1.25rem; line-height: 1; padding-left: .75em; }
.c-page-nav__item.prev::before { transform: scale(-1,1); }
.c-link { color: #24315a; cursor: pointer; text-decoration: underline; }
.c-link::before { content: "\e801"; display: inline-block; font-family: "icon"; font-size: 1.25rem; line-height: 1; padding-right: .75em; }
.c-logo { margin: 0; width: 12em; }
.c-map { border: 1px solid #dbdbdb; height: 0; overflow: hidden; padding-top: 50%; position: relative; }
.c-map iframe { height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
.c-movie.c-section { padding: 6.25em 0 12.5em; }
.c-movie .c-inner { background: url(../img/vi-mark.png) no-repeat 100% 0 / contain; padding-bottom: 0 !important; padding-top: 0 !important; }
.c-movie__box { height: 0; overflow: hidden; padding-top: 56.25%; position: relative; width: 100%; }
.c-movie__box iframe { height: 100% !important; left: 0; position: absolute; top: 0; width: 100% !important; }
.c-mv { position: relative; }
.c-mv::after { background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 96%); bottom: 0; content: ""; display: block; height: 6.25em; left: 0; position: absolute; width: 100%; }
.c-mv__copy { animation-duration: 4s; animation-name: fadeInDown; color: #fff; filter: drop-shadow(5px 5px 5px rgba(0,0,0,.6)); font-size: 2.5em; left: 10%; letter-spacing: .1em; margin-top: -1.25em; position: absolute; top: 50%; z-index: 1; }
.c-mv__scroll { bottom: 0; height: 6.6em; position: absolute; right: 2.5em; z-index: 1; }
.c-mv__scroll p { color: #fff; font-size: .625em; letter-spacing: .1em; }
.c-news__block, .c-news__sup { align-items: baseline; display: flex; }
.c-news__block { border-bottom: 1px solid #dedede; padding-bottom: 1.75em; text-decoration: none !important; }
.c-news__block + .c-news__block { padding-top: 1.75em; }
.c-news__button { margin-top: 2.25em; }
.c-news__button .c-button { margin-left: 0; }
.c-news__sup { margin-right: 1.875em; }
.c-news__date { color: #666; font-size: .875em; margin-right: 1.7857em; }
.c-news__label { background-color: #24315a; color: #fff; display: inline-block; font-size: .8125em; line-height: 2; text-align: center; width: 7.6154em; }
.c-news__label.label-factory, .c-news__label.label-imperialhotel, .c-news__label.label-karuizawa { background-color: #af8c55; }
.c-news__label.label-magazine { background-color: #656e8b; }
.c-news__txt { padding-left: 2em; position: relative; transition: color .4s ease; }
.c-news__txt::before { content: "\e801"; display: inline-block; font-family: "icon"; font-size: 1.25rem; left: 0; line-height: 1; position: absolute; top: .2em; }
.c-news__block:hover .c-news__txt { color: #656e8b; text-decoration: underline; }
.c-paint__button { display: flex; justify-content: flex-start; }
.c-paint__button .c-button { margin: 0; }
.c-partition { clear: both; margin-top: 4.5em; }
.c-scroll { bottom: 0; display: block; height: 5em; left: 50%; overflow: hidden; position: absolute; width: 1px; }
.c-scroll::after, .c-scroll::before { content: ""; display: block; height: 100%; position: absolute; right: 0; top: 0; width: 1px; }
.c-scroll::before { background-color: #24315a; animation: scroll 2.4s infinite normal; z-index: 10; }
.c-scroll::after { background: #fff; }
.c-section { margin-top: 4.375em; position: relative; }
.c-section__head { display: flex; justify-content: space-between; }
.c-section__head .txt { width: 57%; }
.c-section__title { margin-bottom: 2.375em; }
.c-section__title span { color: #24315a; font-size: 1.875em; line-height: 1; white-space: nowrap; }
.c-section__title small { color: #af8c55; display: block; font-size: .875em; letter-spacing: .05em; line-height: 1; margin-top: .6em; }
.c-shop .c-map { display: none; }
.c-shop .js-map-trigger { margin-bottom: 1em; }
.c-shop .js-map-trigger.js-close::before { content: "\e803"; width: 1.75em; }
.c-shop__wrap { padding-top: 5em; position: relative; }
.c-shop__wrap::before { background-color: #f2f3f5; content: ""; display: block; height: 82%; left: 0; position: absolute; top: 0; width: 75%; }
.c-shop__list { display: flex; justify-content: space-between; width: 100%; }
.c-shop__item { width: calc(20% - 1em); }
.c-shop__item .c-button { height: auto; max-width: initial; padding: 2.25em 0; }
.c-shop__item .c-button span { font-size: 1.25em; }
.c-shop__item .c-button small { color: #af8c55; display: block; font-size: .6em; letter-spacing: .05em; line-height: 1; margin-top: .6em; width: 100%; }
.c-shop__online a { align-items: center; background: url(../img/bg-pattern.png) no-repeat -4% -13.125em / 21.5em, url(../img/bg-pattern.png) no-repeat 104% -.75em / 21.5em; background-color: #24315a; display: flex; justify-content: center; height: 10em; transition: all .4s ease; }
.c-shop__online a span { color: #fff; font-size: 1.625em; text-align: center; }
.c-shop__online a span::after { content: "\e801"; display: inline-block; font-family: "icon"; font-size: 1.25rem; position: absolute; right: 2.625em; top: 50%; transform: translateY(-50%); }
.c-shop__online a small { color: #af8c55; display: block; font-size: .5385em; }
.c-shop__online a:hover { background-color: #656e8b; }
.c-slide__item { height: calc(100vh - 70px ); overflow: hidden; opacity: 0; position: relative; width: 100%; }
.c-slide__item::after { background: no-repeat 50% 50% / cover; content: ""; display: block; filter: brightness(.6); height: 100%; position: absolute; top: 0; transform: scale(1.1); transition: transform 1.0s ease-out 0s; transition-property: transform, filter, opacity; width: 100%; }
.c-sns__list { align-items: center; border-bottom: 1px solid #dedede; border-top: 1px solid #dedede; display: flex; justify-content: center; padding: 2.75em 0; }
.c-sns__item { font-size: 2.5em; line-height: 1; margin-left: 1.5em; }
.c-sns__item:hover { color: #656e8b; }
.c-table__heading { color: #24315a; padding: 1.5em 0 0 0 !important; width: 12em; }
.c-table__content { border-bottom: 1px solid #dbdbdb; float: none !important; padding: 1.5em 0 1.5em 12em; }
.c-txt p + p { margin-top: 1.5em; }
.c-waza__item { opacity: 0; padding: 0 1.25em; transition: opacity .4s linear; }
.c-waza__item .c-img__btn--title { font-size: 1.25em; }
.c-work__item + .c-work__item { border-top: 1px dashed #dbdbdb; margin-top: 5em; padding-top: 5em; }
.c-work__title { border-bottom: 1px solid #24315a; padding-bottom: .3em; }
.c-work__item .c-col__item img { margin-bottom: 1.5em; width: 70%; }
.c-work__item .c-col__item p { font-size: .875em; }

.block__blue { background-color: #24315a; }
.block__blue .c-button::before { background-color: rgba(101,110,139,0); }
.block__blue .c-button, .block__blue .c-button::after { border-color: #fff; }
.block__blue .c-button:hover, .block__blue .c-button:hover::after { border-color: #656e8b; }
.block__blue .c-button:hover::before { background-color: rgba(101,110,139,1); }
.block__blue .c-button__wrap { display: flex; justify-content: flex-end; }
.block__blue .c-button__wrap .c-button { margin-right: 0; }
.block__blue .c-inner { padding-bottom: 5em; padding-top: 5em; }
.block__blue .c-inner .txt { text-align: right; }
.block__blue .c-section__title span { color: #fff; }
.block__blue .c-section__head { color: #fff; }

.home .c-about::before { background-color: #f2f3f5; content: ""; display: block; height: 82%; position: absolute; right: 0; top: -6.25em; width: 75%; }
.home .c-about__pic { margin: -4em 0 -1em 0; max-width: 38em; width: 50%; }
.home .c-about__wrap, .home .c-about__txt { position: relative; z-index: 1 }
.home .c-company.c-section { padding-top: 2.5em; }
.curriculum .c-work__block { display: flex; justify-content: space-between; }
.curriculum .c-work__block img { width: calc(50% - 2em); }
.philosophy .c-col .pic { display: flex; justify-content: center; }
.philosophy .c-col .pic-person { padding: 0 4%; text-align: center; width: 45%; }
.philosophy .c-col .pic-person span { font-size: .875em; }
.philosophy .c-col .txt { border: 1px solid #a1a6b8; box-shadow: 0 0 .5em .25em #d4d7df inset; padding: 2.5em; }
.story .c-contents li span { margin-right: 1em; }

.is-fixed { position: fixed; z-index: 999; }
.js-inview { opacity: 0; transform: translateY(3em); transition: transform .8s ease-out, opacity .8s ease-out;  }
.js-inview.show { opacity: 1; transform: translateY(0); }
.js-inview-left { opacity: 0; transform: translateX(-15%); transition: transform 1.5s ease-out, opacity 1.5s ease-out; }
.js-inview-left.show, .js-inview-right.show { opacity: 1; transform: translateX(0); }
.js-inview-right { opacity: 0; transform: translateX(15%); transition: transform 1.5s ease-out, opacity 1.5s ease-out; }

.slide-01::after { background-image: url(../img/mv-slide-01.jpg); }
.slide-02::after { background-image: url(../img/mv-slide-02.jpg); }
.slide-03::after { background-image: url(../img/mv-slide-03.jpg); }
.slick-initialized .slide-itemm, .slick-initialized .c-waza__item { opacity: 1; }
.c-slide__item.slick-current::after { filter: brightness(1); transform: scale(1); transition-duration: 6s, 2s, 2s; }
.slick-dots { position: absolute; bottom: 2.5em; display: block; left: 2.5em; margin: 0; padding: 0; text-align: center; z-index: 1; }
.slick-dots li { position: relative; display: inline-block; width: 2.5em; height: .375em; margin: 0 .375em; cursor: pointer; }
.slick-dots li button { font-size: 0; line-height: 0; display: block; width: 2.5em; height: .375em; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; }
.slick-dots li button:focus { outline: none; }
.slick-dots li button:focus::before { opacity: 1; }
.slick-dots li button::before { background-color: #fff; content: ""; font-size: 16px; height: .375em; left: 50%; position: absolute; text-align: center; top: 0; transform: translateX(-50%); transition: all .4s ease; width: 2.5em; }
.slick-dots li.slick-active button::before { background-color: #24315a; }
.goog-te-gadget { padding: 0 1.5em 1.5em 0; }
.goog-te-gadget img { display: inline-block; }

@media screen and (min-width: 1600px) {
.c-about__wrap { padding-right: 8% !important; }
}

@media screen and (min-width: 769px) {
.l-footer .c-inner { padding-bottom: 5em; padding-top: 5em; }
.l-nav__list { align-items: center; display: flex; height: 70px; }
.l-nav__item { font-size: .875em; }
.l-nav__item + .l-nav__item { padding-left: 2.1429em; }
.l-nav__item a { white-space: nowrap; }
.l-loading svg { width: 180px; }
.c-about__wrap { align-items: center; display: flex; justify-content: flex-end; padding: 0 2em; }
.c-button, .c-form__back { max-width: 16.75em; }
.c-cal__list { display: flex; justify-content: center; }
.c-cal__item { max-width: 500px; padding: 0 1.5em; width: 50%; }
.c-col { display: flex; justify-content: space-between; }
.c-col__reverse { flex-direction: row-reverse; }
.c-col .txt { width: 50%; }
.c-col .pic { width: calc(50% - 3.75em); }
.c-col__double .c-col__item { width: calc(50% - 2em); }
.c-col__triple .c-col__item { width: calc(calc(100% / 3) - 4em); }
.c-col__triple { flex-wrap: wrap; }
.c-col__triple::after { content:""; display: block; width: calc(calc(100% / 3) - 4em); }
.c-contact__info { letter-spacing: -.4em; }
.c-contact__info div { display: inline-block; letter-spacing: normal; }
.c-contact__info div + div { margin-left: 3em; }
.c-custom__list { display: flex; justify-content: space-between; width: 100%; }
.c-custom__item { width: calc(50% - 2em); }
.c-directory__list { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 3.875em; width: 100%; }
.c-directory__item { display: flex; flex-direction: column; }
.c-directory__item:nth-child(n + 4) { margin-top: 3.125em; }
.c-directory__item .txt { margin-bottom: auto; }
.c-entry { overflow: hidden; }
.c-entry .pic { float: right; max-width: 40%; padding-left: 3.75em; }
.c-form .c-field__s { max-width: 6.25em; width: 30%; }
.c-form .c-field__m { width: 50%; }
.c-form .c-field__l { width: 100%; }
.c-group__item a { display: flex; justify-content: space-between; }
.c-group__item a:hover img { opacity: .75; }
.c-group__item .pic { padding-right: 5.625em; width: 15em; }
.c-group__item .txt { flex: 1; }
.c-local__list { display: flex; justify-content: center; }
.c-local__list { font-size: .8125em; margin-bottom: 1em; }
.c-local__item { line-height: 1; }
.c-local__item + .c-local__item::before { color: #ccc; content: "／"; margin-left: .6em; padding-right: .6em; }
.c-local__item a { text-decoration: underline; }
.c-local__item.current a { text-decoration: none; }
.c-local__item a:hover { color: #656e8b; }
.c-movie__wrap { width: 58%; }
.c-news__wrap { display: flex; justify-content: space-between; }
.c-news__head { width: 18.75em; }
.c-paint__txt { width: 50%; }
.c-paint__pic { width: calc(50% - 3.75em); }
.c-paint__wrap { display: flex; flex-direction:row-reverse; justify-content: space-between; width: 100%; }
.c-shop__online a span br { display: none; }
.c-work__item .c-col + .c-col { border-top: 1px dashed #dbdbdb; padding-top: 3em; }

.home .c-section, .c-contact__bottom.c-section { margin-top: 6.25em; }
.home .c-about.c-section { margin-top: 0; }
.home .c-news__content { width: 70%; }
.news .c-contents { padding: 0 5%; }
.sp-item { display: none; }
}

@media screen and (min-width:769px) and ( max-width:1236px) {
.l-page { font-size: 1.2945vw; }
.c-inner { padding-left: 2%; padding-right: 2%; }
}

@media screen and (max-width: 768px) {
html,body { height:100%; }
.l-page { font-size: 3.2vw; overflow: hidden; }
.l-header__cart { margin-right: 5em; width: 5em; }
.l-header__cart a { height: 5em; width: 5em; }
.l-header__nav { width: auto; }
.l-nav { background-image: linear-gradient(to top, #24315a 0%, #152453 100%); display: none; height: 100vh; overflow-y: auto; padding: 5em 8%; position: fixed; right: 0; top: 0; width: 100vw; z-index: -10; }
.is-opened .l-nav { display: block; z-index: 100; }
.l-nav a { color: #fff; }
.l-nav__btn { background-color: transparent; display: block; height: 5em; position: absolute; right: 0; text-align: center; top: 0; width: 5em; z-index: 1002; }
.l-nav__btn span, .l-nav__btn span::before, .l-nav__btn span::after { background-color: #24315a; display: block; height: 2px; margin: auto; transition: all .3s ease; width: 1.8333em; }
.l-nav__btn span { position: relative; }
.l-nav__btn span::before, .l-nav__btn span::after { content: ""; left: 0; position: absolute; }
.l-nav__btn span::before { top: -.6667em; }
.l-nav__btn span::after { top: .6667em; }
.is-open .l-nav__btn { position: fixed; right: 0; top: 0; }
.is-open .l-nav__btn span::before { background-color: #fff; transform: translateY(1.6667em) rotate(-315deg); top: -1.6667em; width: 2em; }
.is-open .l-nav__btn span { background-color: transparent; }
.is-open .l-nav__btn span::after { background-color: #fff; transform: translateY(-1.6667em) rotate(315deg); top: 1.6667em; width: 2em; }
.is-opened .l-nav { display: block; z-index: 1001; }
.is-open .l-nav { animation: nav-open .6s cubic-bezier(1, 0, 0, 1) 0s; animation-fill-mode: both; }
.is-close .l-nav { animation: nav-close .5s cubic-bezier(1, 0, 0, 1) 0s; }
.l-nav__list { padding-bottom: 3em; }
.l-nav__item { font-size: 4.2667vw; margin-bottom: 1em; position: relative; width: 100%; }
.l-nav__item::after, .js-nav__trigger { color: #fff; display: inline-block; position: absolute; }
.l-nav__item::after { content: '\f105'; font-family: 'icon'; right: 12px; top: 50%; transform: translateY(-50%); }
.current .l-nav__dropdown { display: block; }
.l-nav__dropdown--item { font-size: 3.7333vw; }
.l-nav__dropdown--list { margin-top: .6em; padding-left: 1em; }
.l-nav__dropdown--item + .l-nav__dropdown--item { margin-top: .3em; }
.l-nav__dropdown--item::before { color: #fff; content: '\f105'; display: inline-block; font-family: 'icon'; padding-right: .8em; }
.l-nav__list--wrap .l-nav__dropdown--item .btn { display: inline-block; font-size: 2.604167vw; vertical-align: middle; width: auto; }
.js-nav__trigger { height: 2em; right: 0; top: -.5em; width: 2em; }
.js-nav__trigger::before, .js-nav__trigger::after { background-color: #fff; content: ""; display: block; height: 2px; position: absolute; right: .5em; top: 50%; width: 16px; }
.js-nav__trigger::after { transform: rotate(90deg); transition: all .3s ease; }
.js-nav__trigger.is-active::after { transform: rotate(0); }
.l-nav__cart .c-button { color: #24315a; line-height: 2.5em; }
.l-nav__cart .c-button span { font-size: 4.2667vw; }
.l-nav__sns { display: inline-block; font-size: 6.4vw; }
.l-nav__sns + .l-nav__sns { margin-left: .5em; }
.l-footer .c-inner { padding-bottom: 2em; padding-top: 2em; }
.l-footer__wrap { justify-content: center; }
.l-footer__menu { display: none; }
.l-footer__logo small { margin-top: 0.5em; }
.l-loading svg { width: 40%; }
.l-breadcrumbs__list { overflow: auto; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; overflow-x: auto; overflow-y: hidden; white-space: nowrap; }
.c-about::before { top: -5em; }
.c-button { height: 4em; }
.c-button span::after { font-size: 1em; right: .8em; }
.c-button__wrap { margin-top: 2em; }
.c-button__wrap .c-button + .c-button { margin-left: 0; }
.c-cal__item + .c-cal__item { margin-top: 1.5em; }
.c-col__reverse .txt { margin-top: 2em; }
.c-company__wrap { padding: 50% 0 0 0; }
.c-company__wrap::before { width: 100%; }
.c-company__box { padding: 3.5em 2em; }
.c-contact__bottom { background-size: cover; }
.c-contents, .c-directory__list, .c-partition { margin-top: 3em; }
.c-contents { padding-bottom: 1em; }
.c-curriculum__wrap { overflow: auto; white-space: nowrap; }
.c-curriculum__wrap::-webkit-scrollbar { height: 5px; }
.c-curriculum__wrap::-webkit-scrollbar-track { background: #f1f1f1; }
.c-curriculum__wrap::-webkit-scrollbar-thumb { background: #bcbcbc; }
.c-custom__list { margin-top: 2em; }
.c-custom__item + .c-custom__item { margin-top: 0.8333em; }
.c-custom__wrap, .c-shop__wrap { padding-bottom: 0; padding-top: 3.5em; }
.c-directory__item + .c-directory__item { margin-top: 3em; }
.c-directory__item .pic { margin-bottom: .75em; }
.c-directory__title { font-size: 1.5em; }
.c-directory__txt { margin-top: .75em; padding-top: .75em; }
.c-dropdown-trigger::after { content: none; }
.c-entry .pic { margin-bottom: 2em; }
.c-entry h4 { font-size: 1.1667em; font-weight: bold; margin: 1em 0; }
.c-entry img { float: none !important; margin: 1em auto; }
.c-form input, .c-form textarea { font-size: 4.2667vw; }
.c-form .c-field__s { width: 30%; }
.c-form .c-field__m, .c-form .c-field__l { width: 100%; }
.c-form .c-table__heading { float: none; width: 100%; }
.c-form .c-table__content { padding-left: 0 !important; padding-top: .3em; }
.c-group__item .pic { margin: 0 auto .5em; width: 50%; }
.c-paint .c-button, .c-shop__item, .c-contact__bottom .c-button { margin: 0; width: calc(50% - .5em); }
.c-inner { padding-left: 2em; padding-right: 2em; }
.c-inner__full { padding: 0 2em; }
.c-local__list { display: none; }
.c-movie.c-section { padding: 3.5em 0 8em; }
.c-movie .c-inner { background-position: 106% 0; background-size: 48%; }
.c-mv__copy { font-size: 7.4667vw; left: 0; text-align: center; width: 100%; }
.c-mv__scroll { left: 50%; right: auto; transform: translateX(-50%); }
.c-news__block { display: block; }
.c-news__txt { padding: .5em 0 0 3em; }
.c-news__wrap { position: relative; padding-bottom: 6em; }
.c-news__button { bottom: 0; margin-top: 0; position: absolute; width: 100%; }
.c-page__title { line-height: 1; }
.c-paint__button { justify-content: space-between; }
.c-paint__pic { margin: 0 calc(50% - 50vw); width: 100vw; }
.c-paint__txt { padding-top: 2em; }
.c-section { margin-top: 3.5em; }
.c-section__head { display: block; }
.c-section__title { margin-bottom: 2em; }
.c-shop__list { flex-wrap: wrap; margin-top: 2em; }
.c-shop__item:nth-child(n + 3) { margin-top: 1em; }
.c-shop__item .c-button { padding: 1.5em 0; }
.c-shop__online { margin-top: 1.1667em; }
.c-shop__online a { background-position: -10% -5em, 110% 5em; background-size: 36%, 36%; }
.c-shop__online a span { line-height: 1.4; }
.c-shop__online a span::after { right: 1em; }
.c-slide__item { height: 75vh; }
.c-table__heading { width: 5em; }
.c-table__content { padding-left: 5em; }
.c-waza__item { padding: 0 .5em; }
.c-work__item .c-col + .c-col, .c-work__item .c-col__item + .c-col__item { border-top: 1px dashed #dbdbdb; margin-top: 3em; padding-top: 3em; }
.block__blue .c-button__wrap { justify-content: space-between; }
.block__blue .c-inner { padding-bottom: 3.5em; padding-top: 3.5em; }
.block__blue .c-inner .txt { text-align: left; }
.slick-dots { bottom: 1em; left: auto; right: 1em; }
.slick-dots li { margin: 0 0 0 .3333em; }
.slick-dots li button::before { font-size: 3.2vw; }
.home .c-about.c-section { margin-top: 2.5em; padding-top: 3em; }
.home .c-about__txt, .c-section__head .txt { width: 100%; }
.home .c-about .c-button__wrap { padding: 0 2em; }
.home .c-about .c-section__title { position: relative; z-index: 2; }
.home .c-about__pic { margin: 0; position: absolute; right: 0; top: -8em; width: 50%; }
.home .c-about__slider { margin-top: 2em; }
.home .c-about__txt br { display: none; }
.philosophy .c-col .pic-person { width: 50%; }
.philosophy .c-col .txt { margin-top: 3em; }
}