@charset "utf-8";

/*
 * File    : sub-company.css
 * Author  : STUDIO-JT
 *
 * SUMMARY :
 * COMMON
 * SANC 소개
 * SANC 메시지
 * SANC STORES
 * SANC LOCATION
 * SANC HISTORY
 * BI/CI
 * HOVER
 */



/* **************************************** *
 * COMMON
 * **************************************** */
/* LAYOUT */
.company-container { display: flex; flex-direction: column; gap: 260rem; }

/* COMPANY SLIDER */
.company-slider__container { position: relative; border-radius: var(--round-06); margin: 0 52rem; overflow: hidden; }
.company-slider__container-inner { padding-top: 47.35%; position: relative; }

.company-slider__visual { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.company-slider__item-figure { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: no-repeat center center / cover; }
.company-slider__content { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 52rem; position: relative; color: var(--color-white); text-align: center; }



/* **************************************** *
 * SANC 소개
 * **************************************** */
/* GLOBAL */
.company-introduce { --section-fvh: 100vh; --section-margin: 52rem; --section-gap: 32rem; }
html.mobile:not(.naver) .company-introduce { --section-fvh: 100lvh; }
html.mobile.naver .company-introduce { --section-fvh: 100svh; }

.company-introduce__separate { margin: 260rem 0; }

.company-introduce__bracket { display: flex; align-items: center; justify-content: center; gap: 110rem; color: var(--color-white); }
.company-introduce__bracket > i { font-style: normal; }
.company-introduce__bracket > span { display: block; }
.company-introduce__bracket.company-introduce__bracket--secondary { gap: 90rem; }

/* EXHIBITION */
.introduce-exhibition { margin: calc(-1 * var(--section-margin)) 0; text-align: center; }

.introduce-exhibition__item { position: relative; }
.introduce-exhibition__item + .introduce-exhibition__item { margin-top: calc( -1 * var(--section-margin) ); }
html.mobile:not(.naver, .kakao) .introduce-exhibition__item + .introduce-exhibition__item { margin-top: calc( ( -1 * var(--section-margin) ) + ( 100lvh - 100svh ) ); }

.introduce-exhibition__bg { width: 100%; height: var(--section-fvh); position: absolute; top: 0; left: 0; overflow: hidden; }
.introduce-exhibition__bg-scaler { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.introduce-exhibition__bg-primary,
.introduce-exhibition__bg-secondary { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: var(--color-point-02) no-repeat center center / cover; }
.introduce-exhibition__bg-primary { --clip-gap: 0rem; --clip-space: 0%; clip-path: inset(var(--section-margin) calc(var(--clip-gap) / 2 + var(--clip-space)) var(--section-margin) 0% round var(--round-06)); }
.introduce-exhibition__bg-secondary { --clip-gap: 0rem; --clip-space: 100%; clip-path: inset(var(--section-margin) 0% var(--section-margin) calc(var(--clip-gap) / 2 + var(--clip-space)) round var(--round-06)); }
.introduce-exhibition__bg-secondary > span { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: var(--color-point-02); opacity: 0.9; }

.introduce-exhibition__content { height: calc( var(--section-fvh) * 2 ); }
.introduce-exhibition__content-inner { width: 100%; height: var(--section-fvh); display: flex; justify-content: center; align-items: center; gap: var(--section-gap); }

.introduce-exhibition__txt { width: 100%; padding: 0 var(--section-margin); }
.introduce-exhibition__txt h2 { color: var(--color-white); }
.introduce-exhibition__content--half .introduce-exhibition__txt { width: 50%; }

.introduce-exhibition__gallery { position: absolute; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); opacity: 0; }
.introduce-exhibition__gallery > * { display: flex; flex-direction: column; gap: var(--section-gap); }
.introduce-exhibition__gallery-row { display: flex; justify-content: center; gap: var(--section-gap); }
.introduce-exhibition__gallery figure { min-width: var(--gallery-width); max-width: var(--gallery-width); height: var(--gallery-height); border-radius: var(--round-06); overflow: hidden; }
.introduce-exhibition__gallery figure img { display: block; width: 100%; height: 100%; object-fit: cover; }

.introduce-exhibition__gallery--large { --gallery-width: calc((100vw - (var(--section-margin) * 2) - (var(--section-gap) / 2)) / 2); --gallery-height: calc(var(--section-fvh) - (var(--section-margin) * 2)); }
.introduce-exhibition__gallery--small { display: none; --gallery-width: calc(100vw - (var(--section-margin) * 2)); --gallery-height: calc((var(--section-fvh) - (var(--section-margin) * 2) - (var(--section-gap) / 2)) / 2); }

.introduce-exhibition--experience .introduce-exhibition__bg-primary { background-color: #95B7AA; }

.introduce-exhibition--honesty .introduce-exhibition__bg-primary { background-color: #101010; }
.introduce-exhibition--honesty .introduce-exhibition__content--half { height: calc(var(--section-fvh) * 4); }

html.kakao .introduce-exhibition { margin-top: 0; margin-bottom: 0; }
html.kakao .introduce-exhibition__item + .introduce-exhibition__item { margin-top: var(--section-margin); }
html.kakao .introduce-exhibition__bg { display: none; }
html.kakao .introduce-exhibition__content { height: auto; }
html.kakao .introduce-exhibition__content-inner { height: auto; align-items: stretch; aspect-ratio: 16 / 9; }
html.kakao .introduce-exhibition__content ~ .introduce-exhibition__content { margin-top: var(--section-gap); }
html.kakao .introduce-exhibition__txt { display: flex; align-items: center; justify-content: center; background: no-repeat center / cover; border-radius: var(--round-06); flex: 1; }
html.kakao .introduce-exhibition__content--half .introduce-exhibition__txt--description { background-color: var(--color-point-02); }
html.kakao .introduce-exhibition--experience .introduce-exhibition__content--full .introduce-exhibition__txt--slogan { background-image: url(../images/sub/company/company-introduce-experience.jpg); }
html.kakao .introduce-exhibition--experience .introduce-exhibition__content--half .introduce-exhibition__txt--bracket { background-image: url(../images/sub/company/company-introduce-experience.jpg); }
html.kakao .introduce-exhibition--trustful .introduce-exhibition__content--full .introduce-exhibition__txt--slogan { background-image: url(../images/sub/company/company-introduce-trustful.jpg); }
html.kakao .introduce-exhibition--trustful .introduce-exhibition__content--half .introduce-exhibition__txt--bracket { background-image: url(../images/sub/company/company-introduce-trustful.jpg); }
html.kakao .introduce-exhibition--honesty .introduce-exhibition__content--full .introduce-exhibition__txt--slogan { background-image: url(../images/sub/company/company-introduce-honesty.jpg); }
html.kakao .introduce-exhibition--honesty .introduce-exhibition__content--half .introduce-exhibition__txt--bracket { background-image: url(../images/sub/company/company-introduce-honesty.jpg); }

/* COMPANY */
.introduce-company__list { display: flex; flex-direction: column; gap: 200rem; }

.introduce-company__thumb { padding-top: 30.83%; position: relative; background: var(--color-gray-100); border-radius: var(--round-06); overflow: hidden; }
.introduce-company__thumb .jt-bg-parallax { position: absolute; top: 0; left: 0; }

.introduce-company__content { display: flex; justify-content: flex-end; margin-top: 60rem; }
.introduce-company__content-inner { flex: 0 0 calc(50% - (var(--section-gap)/2)); }
.introduce-company__content p { margin-top: 20rem; color: var(--color-gray-800); }

/* CORE */
.introduce-core { margin: 0 calc(-1 * var(--section-margin)); padding-bottom: 540rem; position: relative; overflow: hidden; }

.introduce-core__illust { position: absolute; background: no-repeat center center / contain; }
.introduce-core__illust--door { width: 253rem; height: 273rem; top: 402rem; right: 254rem; }
.introduce-core__illust--front-line { width: 1907rem; height: 559rem; bottom: 122rem; left: -510rem; }
.introduce-core__illust--back-line { width: 1907rem; height: 559rem; bottom: 254rem; right: -1045rem; }

.introduce-core__keyword > li { display: flex; flex-direction: column; gap: 16rem; padding: 60rem 0; position: relative; text-align: center; }
.introduce-core__keyword > li:first-child { padding-top: 0; }
.introduce-core__keyword > li:last-child { padding-bottom: 0; }
.introduce-core__keyword > li:not(:last-child):after { content: ''; width: 400rem; height: 1px; position: absolute; bottom: 0; left: 50%; background: var(--color-point-03); transform: translateX(-50%); }
.introduce-core__keyword p { color: var(--color-gray-800); }

/* FACTORY */
.introduce-factory__key { --factory-size: 760rem; --factory-gap: 100rem; position: relative; font-size: 0; text-align: center; }
.introduce-factory__key > li { display: inline-block; width: var(--factory-size); position: relative; opacity: 0; }
.introduce-factory__key > li:nth-child(1) { transform: translateX( calc( ( var(--factory-size) / 2 ) - ( var(--factory-gap) / 2 ) ) ); }
.introduce-factory__key > li:nth-child(2) { margin-left: calc(-1 * var(--factory-gap)); transform: translateX( calc( -1 * ( ( var(--factory-size) / 2 ) - ( var(--factory-gap) / 2 ) ) ) ); }
.introduce-factory__key-bg { width: 100%; padding-top: 100%; background: no-repeat center center / cover; border-radius: 50%; overflow: hidden; }
.introduce-factory__key-bg:after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.15); border-radius: inherit; }
.introduce-factory__key .company-introduce__bracket { position: absolute; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); }

.introduce-factory__list { margin-top: 260rem; display: flex; flex-direction: column; gap: 260rem; }
.introduce-factory__list > li { display: flex; gap: var(--section-gap); }
.introduce-factory__list > li > * { width: calc(50% - (var(--section-gap)/2)); }
.introduce-factory__list-intro { padding-right: 32rem; position: relative; }
.introduce-factory__list-intro-inner { position: sticky; top: 120rem; }
.introduce-factory__list-intro p { margin-top: 40rem; color: var(--color-gray-800); }
.introduce-factory__list-intro p ~ p { margin-top: 30rem; }

.introduce-factory__list-brand { display: flex; flex-direction: column; gap: 144rem; }
.introduce-factory__list-thumb { border-radius: var(--round-05); overflow: hidden; }
.introduce-factory__list-thumb .jt-lazyload { padding-top: 69.58%; }
.introduce-factory__list-content { margin-top: 40rem; }
.introduce-factory__list-content > p { margin-top: 20rem; margin-bottom: 40rem; color: var(--color-gray-800); }



/* **************************************** *
 * SANC 메시지
 * **************************************** */
/* GLOBAL */
.company-message { --section-fvh: 100vh; --section-margin: 52rem; --section-gap: 32rem; }
html.mobile .company-message { --section-fvh: 100svh; }

/* PROLOGUE */
.message-prologue { height: calc(var(--section-fvh) * 10); margin: calc(-1 * var(--section-margin)) 0; position: relative; }
html.mobile .message-prologue { --section-fvh: 100lvh; height: calc(var(--section-fvh) * 7.5); }

.message-prologue__bg { width: 100%; height: var(--section-fvh); position: absolute; top: 0; left: 0; clip-path: inset(var(--section-margin) 0% round var(--round-06)); }
.message-prologue__bg-item { --clip-space: 0%; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: var(--color-gray-100) no-repeat center center / cover; clip-path: inset(0 var(--clip-space) 0 0% round var(--round-06)); }

.message-prologue__content-item { width: 100%; height: var(--section-fvh); padding: 0 var(--section-margin); display: flex; justify-content: center; align-items: center; position: absolute; top: 0; left: 0; text-align: center; color: var(--color-white); }
.message-prologue__content-item ~ .message-prologue__content-item { opacity: 0; }

html.kakao .message-prologue { height: auto !important; margin-top: 0 !important; margin-bottom: 0 !important; }
html.kakao .message-prologue__bg { display: none; }
html.kakao .message-prologue__content-item { height: auto; position: relative; background: no-repeat center / cover; border-radius: var(--round-06); aspect-ratio: 16 / 9; }
html.kakao .message-prologue__content-item ~ .message-prologue__content-item { margin-top: var(--section-margin); opacity: 1; }
html.kakao .message-prologue__content-item:nth-child(1) { background-image: url(../images/sub/company/company-message-prologue-01.jpg); }
html.kakao .message-prologue__content-item:nth-child(2) { background-image: url(../images/sub/company/company-message-prologue-02.jpg); }
html.kakao .message-prologue__content-item:nth-child(3) { background-image: url(../images/sub/company/company-message-prologue-03.jpg); }
html.kakao .message-prologue__content-item:nth-child(4) { background-image: url(../images/sub/company/company-message-prologue-04.jpg); }
html.kakao .message-prologue__content-item:nth-child(5) { background-image: url(../images/sub/company/company-message-prologue-05.jpg); }

/* STORYBOOK */
.message-storybook { padding: 300rem 0 260rem; }

.message-storybook__content { position: relative; }

.message-storybook__slider-typo { width: 100%; position: absolute; left: 0; top: 50%; margin-top: -317rem; font-size: 200rem; line-height: 1; font-weight: 600; font-style: normal; text-align: center; color: var(--color-point-02); }

.message-storybook__slider-wrap { margin: 0 calc(-1 * var(--section-margin)); position: relative; overflow: hidden; }
.message-storybook__slider { margin: 0 var(--section-margin); position: relative; overflow: visible; }

.message-storybook__slider .swiper-navigation .swiper-button-prev { left: 16rem; }
.message-storybook__slider .swiper-navigation .swiper-button-next { right: 16rem; }

.message-storybook__slider-item { display: flex; align-items: center; justify-content: center; gap: 60rem; flex-shrink: 0; width: fit-content; height: 860rem; margin-right: 350rem; }
.message-storybook__slider-item:last-child { margin-right: 0; }
.message-storybook__slider-item:has(.message-storybook__banner) { width: 100%; }

.message-storybook__media { border-radius: var(--round-07); overflow: hidden; -webkit-mask-image: -webkit-radial-gradient(white, black); }
.message-storybook__media-inner { position: relative; }
.message-storybook__media .jt-lazyload { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.message-storybook__media .jt-background-video__vod video { width: 100%; height: 100%; min-width: inherit; min-height: inherit; top: 0; left: 0; translate: none; object-fit: cover; }
.message-storybook__media--primary { width: 891rem; }
.message-storybook__media--primary .message-storybook__media-inner { padding-top: 56.11%; }
.message-storybook__media--secondary { width: 600rem; }
.message-storybook__media--secondary .message-storybook__media-inner { padding-top: 83.33%; }

.message-storybook__txt { display: flex; flex-direction: column; gap: 20rem; white-space: nowrap; }
.message-storybook__txt p { color: var(--color-gray-800); }

.message-storybook__banner { width: 100%; height: 100%; position: relative; background: var(--color-gray-100) no-repeat center center / cover; border-radius: var(--round-06); overflow: hidden; }
.message-storybook__banner p { position: absolute; top: 50%; left: 50%; text-align: center; color: var(--color-white); transform: translate3d(-50%, -50%, 0); }

/* SEASON */
.message-season { padding-top: 260rem; }

.message-season__cards { max-width: 760rem; margin: 0 auto; }
.message-season__card-inner { max-height: 860rem; }

.message-season__picture { height: 100%; border-radius: var(--round-06); overflow: hidden; }
.message-season__picture img { width: 100%; height: 100%; object-fit: cover; }

.message-season__name { display: flex; align-items: center; justify-content: center; gap: 110rem; position: absolute; top: 50%; left: 50%; color: var(--color-white); transform: translate3d(-50%, -50%, 0); }
.message-season__name > i { font-style: normal; }
.message-season__name > span { display: block; }

html.kakao .message-season__card { height: auto !important; aspect-ratio: auto !important; }
html.kakao .message-season__card-inner { height: auto; max-height: inherit; padding-top: 113.15%; }
html.kakao .message-season__picture { position: absolute; top: 0; left: 0; }

/* GALLERY */
.message-gallery { margin: 0 calc( -1 * var(--section-margin) ); padding: 260rem 0; position: relative; overflow: hidden; }

.message-gallery__illust { position: absolute; background: no-repeat center center / contain; }
.message-gallery__illust--bowl { width: 926rem; height: 448rem; top: 154rem; left: -244rem; }
.message-gallery__illust--bean { width: 245rem; height: 230rem; top: 712rem; right: 300rem; }
.message-gallery__illust--chopstick { width: 521rem; height: 707rem; top: 976rem; right: -163rem; }
.message-gallery__illust--front-line { width: 1907rem; height: 559rem; bottom: 1653rem; left: -510rem; }
.message-gallery__illust--back-line { width: 1907rem; height: 559rem; bottom: 1784rem; right: -1045rem; }

.message-gallery__case { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; gap: 32rem; margin: 0 var(--section-margin); position: relative; }
.message-gallery__picture { width: 100%; position: relative; border-radius: var(--round-03); overflow: hidden; }
.message-gallery__picture .jt-lazyload,
.message-gallery__picture-movie { padding-top: 96.51%; }
.message-gallery__picture:nth-child(1) { margin-top: 498rem; }
.message-gallery__picture:nth-child(2) { margin-top: 1120rem; }
.message-gallery__picture:nth-child(3) { margin-top: 912rem; }
.message-gallery__picture:nth-child(5) { margin-top: 610rem; }
.message-gallery__picture:nth-child(6) { margin-top: 1257rem; }
.message-gallery__picture:nth-child(7) { margin-top: 1049rem; }
.message-gallery__picture:nth-child(8) { margin-top: 261rem; }
.message-gallery__picture:nth-child(9) { margin-top: -237rem; grid-column: 4; grid-row: 3; }

.message-gallery__typo { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.message-gallery__typo-inner { width: 100%; height: var(--section-fvh); position: relative; text-align: center; }
.message-gallery__typo-inner > * { position: absolute; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); }
.message-gallery__typo-inner > *:not(:first-child) { opacity: 0; }

/* EPILOGUE */
.message-epilogue { padding-bottom: 40px; }

.message-epilogue__picture { width: 100%; height: 100%; position: relative; border-radius: var(--round-06); overflow: hidden; }
.message-epilogue__picture img { width: 100%; height: 100%; object-fit: cover; }

.message-epilogue__content { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 40rem; width: 100%; padding: 0 var(--section-margin); position: absolute; top: 50%; left: 50%; text-align: center; color: var(--color-white); transform: translate3d(-50%, -50%, 0); }



/* **************************************** *
 * SANC STORES
 * **************************************** */
/* store major */
.store-major { overflow: hidden; }
.store-major__list { position: relative; }
.store-major__list .swiper-wrapper { display: flex; gap: 32rem; text-align: center; }
.store-major__list-item { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; aspect-ratio: 1 / 1.02; padding: 40rem; border-radius: var(--round-06); overflow: hidden; }
.store-major__list-item p { margin-top: 32rem; color: rgba(255, 255, 255, 0.8); }
.store-major__list-item a { margin-top: 60rem; }
.store-major__list-item-contents { display: none; }

.store-major__list-item--store { background: var(--color-tertiary); }
.store-major__list-item--store .store-major__list-item-figure { width: 181rem; }
.store-major__list-item--store .store-major__list-item-figure .jt-lazyload { padding-top: 78.45%; }

.store-major__list-item--mall { background: var(--color-primary); }
.store-major__list-item--mall .store-major__list-item-figure { width: 255rem; }
.store-major__list-item--mall .store-major__list-item-figure .jt-lazyload { padding-top: 27.45%; }

.store-major__list-item--amazon { background: var(--color-gray-900); }
.store-major__list-item--amazon .store-major__list-item-figure { width: 240rem; }
.store-major__list-item--amazon .store-major__list-item-figure .jt-lazyload { padding-top: 30.41%; }

html.mobile .store-major__list-item-contents { display: block; }

/* store distributor */
.store-distributor__list { display: grid; grid-template-columns: repeat(5, 1fr); gap: 29rem; }
.store-distributor__list-item { position: relative; background: var(--color-gray-200); border-radius: var(--round-04); overflow: hidden; }
.store-distributor__list-item .jt-lazyload { padding-top: 58.82%; }
.store-distributor__list-item.store-distributor__list-item--multiply img { mix-blend-mode: multiply; }
.store-distributor__list:not(.store-distributor__list--open) .store-distributor__list-item:nth-child(n+21) { display: none; }

.store-distributor__more { display: flex; align-items: center; gap: 4rem; margin: 60rem auto 0; padding: 0; color: var(--color-black); background: transparent; border: none; border-bottom: 2px solid var(--color-black); cursor: pointer; }
.store-distributor__more .jt-icon { width: 20rem; }

/* store case */
.store-case__gallery { margin-left: -52rem; margin-right: -52rem; overflow: hidden; }
.store-case__gallery-item { position: relative; display: inline-block; vertical-align: top; width: 584rem; border-radius: var(--round-05); overflow: hidden; margin-left: 8rem; margin-right: 8rem; }
.store-case__gallery-item figure { padding-top: 100%; }
.store-case__gallery-item:after { display: none; opacity: 0; position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(0deg, rgba(56, 56, 56, 0.8), rgba(0, 0, 0, 0)); transition: opacity .3s; }

html.mobile .store-case__gallery-item:after { opacity: 1; }



/* **************************************** *
 * SANC LOCATION
 * **************************************** */
body.page-template-company-location .company-slider__item-figure { transition-duration: 6.2s; }

/* Gallery */
.location-gallery { --section-margin: 52rem; margin: 0 calc(-1 * var(--section-margin)); padding-bottom: 327rem; position: relative; overflow: hidden; }
.location-gallery__illust { position: absolute; background: no-repeat center center / contain; }
.location-gallery__illust--flower-branch { width: 552rem; height: 406rem; top: 126rem; left: -16rem; }
.location-gallery__illust--ginkgo-leaf { width: 266rem; height: 283rem; top: 775rem; right: 190rem; }
.location-gallery__illust--front-line { width: 1907rem; height: 559rem; bottom: 0rem; left: -510rem; }
.location-gallery__illust--back-line { width: 1907rem; height: 559rem; bottom: 130rem; right: -1045rem; }

.location-gallery__case { position: relative; margin: 0 var(--section-margin); padding-top: 104rem; overflow: visible; }
.location-gallery__case .swiper-wrapper { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; gap: 32rem; }
.location-gallery__case-item { opacity: 0; }
.location-gallery__case-item-inner { position: relative; }
.location-gallery__case-item-inner p { margin-top: 24rem; } 
.location-gallery__picture { width: 100%; position: relative; border-radius: var(--round-03); overflow: hidden; }
.location-gallery__picture .jt-lazyload { padding-top: 96.51%; }

.location-gallery__case-item:nth-child(1) { grid-column: 4; grid-row: 1; }
.location-gallery__case-item:nth-child(2) { grid-column: 1; grid-row: 1; }
.location-gallery__case-item:nth-child(2) .location-gallery__case-item-inner { margin-top: 500rem; }
.location-gallery__case-item:nth-child(3) { width: 650rem; grid-column: 3; grid-row: 1; }
.location-gallery__case-item:nth-child(3) .location-gallery__picture .jt-lazyload { padding-top: 65.53%; }
.location-gallery__case-item:nth-child(3) .location-gallery__case-item-inner { margin-top: 914rem; }
.location-gallery__case-item:nth-child(4) { width: 560rem; grid-column: 2; grid-row: 1; }
.location-gallery__case-item:nth-child(4) .location-gallery__case-item-inner { margin-top: 1267rem; right: 179rem; }
.location-gallery__case-item:nth-child(4) .location-gallery__picture .jt-lazyload { padding-top: 74.1%; }
.location-gallery__case-item:nth-child(5) { grid-column: 4; grid-row: 2; }
.location-gallery__case-item:nth-child(5) .location-gallery__case-item-inner { margin-top: -213rem; left: -154rem; }

.location-gallery__title { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; }
.location-gallery__title-inner { width: 100%; height: 100vh; display: flex; align-items: center; justify-content: center; text-align: center; }

/* Map */
.location-map__figure { width: 100%; border-radius: var(--round-06); overflow: hidden; }
.location-map__figure .jt-lazyload { padding-top: 41.85%; }
.location-map__figure--small { display: none; }

.location-map__contents { margin-top: 40rem; display: flex; justify-content: space-between; align-items: flex-start; gap: 32rem; }
.location-map__desc { flex: 1; display: flex; flex-direction: column; gap: 8rem; }
.location-map__desc > li { display: flex; gap: 8rem; }
.location-map__desc span { color: var(--color-gray-800); }
.location-map__btn { display: flex; justify-content: flex-end; gap: 8rem; }



/* **************************************** *
 * SANC HISTORY
 * **************************************** */
body.page-template-company-history .main-container { padding-bottom: 0; }
body.page-template-company-history .company-container { gap: 120rem; }
body.page-template-company-history .company-slider__item-figure { transition-duration: 6.2s; }

.history-nav { position: sticky; top: 0; z-index: 20; background: var(--color-tertiary); }
.history-nav__list { display: flex; justify-content: space-between; }
.history-nav__item a { position: relative; display: block; padding: 15rem 0; }
.history-nav__item span { color: rgba(255, 255, 255, 0.5); transition: color .3s; }
.history-nav__item--active > a:before { position: absolute; content: ''; bottom: 0; left: 0; background: var(--color-white); height: 2rem; width: 100%; }
.history-nav__item--active span { color: var(--color-white); }

.history-contents__filter { position: absolute; right: 0; top: 0; bottom: 0; z-index: 10; opacity: 0; visibility: hidden; }
.history-contents__filter-list { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4rem; }
.history-contents__filter-item a { min-width: 120rem; padding: 6rem 21rem; border: 2px solid transparent; color: var(--color-gray-700); border-radius: 999rem; display: inline-block; text-align: center; transition: color .3s; -webkit-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); }
.history-contents__filter-item--active a { border-color: var(--color-black); color: var(--color-black); }

.history-contents__inner { display: grid; grid-template-columns: 1fr 1fr; align-items: flex-start; }
.history-contents__visual { position: sticky; top: 0; height: 100vh; padding-right: 100rem; display: flex; flex-direction: column; align-items: end; justify-content: center; }
.history-contents__visual-inner { width: 560rem; display: flex; flex-direction: column; align-items: center; }
.history-contents__visual h2 { height: var(--font-lineheight-ko-02); margin-bottom: 8rem; }
.history-contents__visual h2 strong { font-family: var(--font-primary); }
.history-contents__visual h2 em { position: relative; top: -12rem; }
.history-contents__visual span { margin-bottom: 4rem; display: block; color: var(--color-quinary); }
.history-contents__visual b { margin-bottom: 40rem; display: block; }
.history-contents__visual p { color: var(--color-gray-800); text-align: center; min-height: calc(var(--font-lineheight-ko-09) * 2); margin-top: 16rem; }
.history-contents__visual-image { width: 100%; border-radius: var(--round-02); overflow: hidden; }
.history-contents__visual-figure{ width: 100%; padding-top: 67.85%; background-image: url(../images/sub/company/company-history-01.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; }
.history-contents__visual-image--vertical { max-width: 280rem; }
.history-contents__visual-image--vertical .history-contents__visual-figure { padding-top: 135.7%; }
.history-contents__visual-image--square { max-width: 380rem; }
.history-contents__visual-image--square .history-contents__visual-figure { padding-top: 100%; }
.history-contents__visual-image--line  { border: 1rem solid var(--color-point-03); }

.history-contents__desc { position: relative; padding: 148rem 200rem 600rem 100rem; }
.history-contents__desc:before { position: absolute; content: ''; left: 0; top: 0; width: 1px; height: 100%; background: var(--color-gray-400); }

.history-contents__term:not(:last-child) { margin-bottom: 400rem; }
.history-contents__term-head { display: none; }
.history-contents__term-item:not(:last-child) { margin-bottom: 80rem; }
.history-contents__term-item-list { margin-top: 16rem; }
.history-contents__term-item-list li:not(:last-child) { margin-bottom: 8rem; }
.history-contents__term-item p:not(.sr-only) { display: inline-block; }
.history-contents__term-item--mark { position: relative; }
.history-contents__term-item--mark:after { content: ''; display: inline-block; vertical-align: top; width: 6rem; height: 6rem; margin: 6rem 0 0 8rem; background: var(--color-primary); border-radius: 3rem; }
.history-contents__term-image { display: none; }

.history-contents__inner.filtering .history-contents__term-list { color: var(--color-gray-500); }
.history-contents__inner.filtering .history-contents__term-item--mark:after { background: var(--color-gray-500); }
.history-contents__inner.filtering .history-contents__term-item--filter b { color: var(--color-black); }
.history-contents__inner.filtering .history-contents__term-item--filter p { position: relative; color: var(--color-primary); text-decoration: underline; text-decoration-thickness: 1rem; text-underline-offset: 8rem; text-decoration-color: currentColor; }
.history-contents__inner.filtering .history-contents__term-item--filter .history-contents__term-item--mark:after { background: var(--color-primary); }



/* **************************************** *
 * BI/CI
 * **************************************** */
/* SYMBOL */
.bici-basic__symbol { padding: 184rem 0; position: relative; background: var(--color-gray-200); border-radius: var(--round-05); }

.bici-basic__symbol-image { width: 518rem; margin: 0 auto; }
.bici-basic__symbol-image .jt-lazyload { padding-top: 48.84%; }

/* COLOR */
.bici-color__palette { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 422rem); gap: 16rem; }
.bici-color__palette > * { display: flex; flex-direction: column; justify-content: space-between; padding: 60rem 50rem; border-radius: var(--round-06); }
.bici-color__palette-name { display: flex; flex-direction: column; gap: 4rem; color: var(--color-white); }
.bici-color__palette-code { color: var(--color-white); }

.bici-color__palette .bici-color__palette-green { grid-column: 1 / span 2; grid-row: 1 / span 2; padding-left: 60rem; padding-right: 60rem; background: #042F0D; border-radius: var(--round-05); }
.bici-color__palette .bici-color__palette-green .bici-color__palette-name { gap: 16rem; }
.bici-color__palette .bici-color__palette-earth { background: #492A00; }
.bici-color__palette .bici-color__palette-umber { background: #94927F; }
.bici-color__palette .bici-color__palette-taupe { grid-column: 3 / span 2; background: #7D7C77; }

/* BRAND */
.bici-brand__list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32rem; }
.bici-brand__list > li { display: flex; align-items: center; justify-content: center; padding: 88rem 0; position: relative; background: var(--color-gray-300); border-radius: var(--round-03); overflow: hidden; }
.bici-brand__list .bici-brand__list-logo { width: 240rem; height: 239rem; }
.bici-brand__list-label { padding: 4rem 20rem; position: absolute; top: 20rem; left: 20rem; background: var(--color-white); border-radius: 99rem; }

/* POSITION */
.bici-position__graph { position: relative; }
.bici-position__graph:before,
.bici-position__graph:after { content: ''; display: block; position: absolute; background-color: var(--color-point-03); }
.bici-position__graph:before { width: 1px; height: 100%; top: 0; left: 50%; }
.bici-position__graph:after { width: 100%; height: 1px; top: 50%; left: 0; }

.bici-position__graph svg { position: absolute; top: 0; left: 0; visibility: hidden; }

.bici-position__graph-element { padding-top: 48.45%; position: relative; z-index: 2; filter: url(#gooey); }
.bici-position__graph-element > li { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.bici-position__graph-element > li i { display: block; width: 100%; height: 100%; font-style: normal; background: no-repeat center / cover; }
.bici-position__graph-element > li span { position: absolute; top: 50%; left: 50%; translate: -50% -50%; }
.bici-position__graph-element > li.bici-position__graph--health { width: 802rem; height: 558rem; transform: translate(-50%, -50%); }
.bici-position__graph-element > li.bici-position__graph--sustainability { width: 281rem; height: 334rem; margin-top: -11.6%; margin-left: -25.5%; }
.bici-position__graph-element > li.bici-position__graph--authenticity { width: 319rem; height: 230rem; margin-top: -13.4%; margin-left: 31.2%; }
.bici-position__graph-element > li.bici-position__graph--innovation { width: 398rem; height: 259rem; margin-top: 11.5%; margin-left: -30%; }
.bici-position__graph-element > li.bici-position__graph--innovation i { background: var(--color-point-02); border-radius: 50%; }
.bici-position__graph-element > li.bici-position__graph--trust { width: 397rem; height: 375rem; margin-top: 8.5%; margin-left: 24.9%; }

html.mobile .bici-position__graph-element { filter: none; }
html.mobile .bici-position__graph-element > li.bici-position__graph--innovation i { background: rgba(249, 244, 238, 0.9); }

/* STORY */
.bici-story__picture { width: 100%; height: 100%; position: relative; background: no-repeat center / cover; border-radius: var(--round-06); overflow: hidden; }

.bici-story__content { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; width: 564rem; height: calc(100% - 60rem); padding: 32rem; position: absolute; top: 30rem; right: 30rem; background: var(--color-point-01); border-radius: var(--round-06); }
.bici-story__content p { margin-top: 16rem; color: var(--color-gray-800); }
.bici-story__icon { width: 160rem; margin-bottom: 24rem; }
.bici-story__icon .jt-lazyload { padding-top: 100%; }



/* **************************************** *
 * HOVER
 * **************************************** */
@media (hover: hover) and (pointer: fine) {

    /* SANC HISTORY */
    .history-nav__item a:hover span { color: var(--color-white); }

    .history-contents__filter-item a:hover { color: var(--color-black); }
    
    /* SANC STORES */
    .store-case__gallery-item:hover:after { opacity: 1; }

    .store-distributor__more:hover { border-bottom-style: dashed; }

}