@charset "utf-8";

/*
 * File    : jt-strap.css
 * Author  : STUDIO-JT (KMS)
 *
 * SUMMARY :
 * A11Y
 * TYPOGRAPHY
 * JT GUIDE
 * BUTTON
 * CATEGORY
 * TABS
 * PAGINATION
 * LIST COMPONENT
 * SINGLE LAYOUT
 * SWIPER
 * LAZYLOAD
 * VIDEO
 * JT POPUP
 * JT CONFIRM
 * HOVER
 */



/* **************************************** *
 * A11Y
 * **************************************** */
.sr-only { position: absolute; clip: rect(1px, 1px, 1px, 1px); -webkit-clip-path: inset(0px 0px 99.9% 99.9%); clip-path: inset(0px 0px 99.9% 99.9%); overflow: hidden; height: 1px; width: 1px; padding: 0; border: 0; }

#skip a { width: 1rem; height: 1rem; position: absolute; left: -10000rem; top: auto; overflow: hidden; }
#skip a:focus { display: block; width: 100%; height: 50rem; padding: 0 24rem; position: fixed; top: 0; left: 0; font-size: var(--font-size-ko-09); line-height: 50rem; text-align: center; font-weight: bold; color: var(--color-white); background: var(--color-black); z-index: 999; }

:focus:not(:focus-visible) :is( select, input[type=text], input[type=tel], input[type=email], input[type=password], input[type=url], input[type=number], input[type=search], textarea, input[type=submit], input[type=button], button, a ) { outline: none; }



/* **************************************** *
 * TYPOGRAPHY
 * **************************************** */
.jt-typo--01 { font-size: var(--font-size-ko-01); line-height: var(--font-lineheight-ko-01); font-weight: 700; letter-spacing: var(--letter-spacing-01); }
.jt-typo--02 { font-size: var(--font-size-ko-02); line-height: var(--font-lineheight-ko-02); font-weight: 700; letter-spacing: var(--letter-spacing-02); }
.jt-typo--03 { font-size: var(--font-size-ko-03); line-height: var(--font-lineheight-ko-03); font-weight: 700; letter-spacing: var(--letter-spacing-02); }
.jt-typo--04 { font-size: var(--font-size-ko-04); line-height: var(--font-lineheight-ko-04); font-weight: 700; letter-spacing: var(--letter-spacing-02); }
.jt-typo--05 { font-size: var(--font-size-ko-05); line-height: var(--font-lineheight-ko-05); font-weight: 700; letter-spacing: var(--letter-spacing-02); }
.jt-typo--06 { font-size: var(--font-size-ko-06); line-height: var(--font-lineheight-ko-06); font-weight: 700; letter-spacing: var(--letter-spacing-02); }
.jt-typo--07 { font-size: var(--font-size-ko-07); line-height: var(--font-lineheight-ko-07); font-weight: 700; letter-spacing: var(--letter-spacing-02); }
.jt-typo--08 { font-size: var(--font-size-ko-07); line-height: var(--font-lineheight-ko-07); font-weight: 400; letter-spacing: var(--letter-spacing-02); }
.jt-typo--09 { font-size: var(--font-size-ko-08); line-height: var(--font-lineheight-ko-08); font-weight: 700; letter-spacing: var(--letter-spacing-02); }
.jt-typo--10 { font-size: var(--font-size-ko-08); line-height: var(--font-lineheight-ko-08); font-weight: 500; letter-spacing: var(--letter-spacing-02); }
.jt-typo--11 { font-size: var(--font-size-ko-08); line-height: var(--font-lineheight-ko-08); font-weight: 400; letter-spacing: var(--letter-spacing-02); }
.jt-typo--12 { font-size: var(--font-size-ko-09); line-height: var(--font-lineheight-ko-09); font-weight: 700; letter-spacing: var(--letter-spacing-02); }
.jt-typo--13 { font-size: var(--font-size-ko-09); line-height: var(--font-lineheight-ko-09); font-weight: 400; letter-spacing: var(--letter-spacing-02); }
.jt-typo--14 { font-size: var(--font-size-ko-10); line-height: var(--font-lineheight-ko-10); font-weight: 400; letter-spacing: var(--letter-spacing-02); }



/* **************************************** *
 * JT GUIDE
 * **************************************** */
/* ICON */
.jt-icon { display: inline-block; }
.jt-icon svg { display: block; width: 100%; height: auto; }
.jt-icon svg path { fill: var(--color-black); transition: fill .3s; }



/* **************************************** *
 * BUTTON
 * **************************************** */
/* Basic Button */
.jt-btn__basic { display: inline-block; position: relative; vertical-align: middle; padding: 10rem 58rem; font-size: 0; background: var(--color-black); border: 2rem solid var(--color-black); color: var(--color-white); border-radius: 30rem; cursor: pointer; transition: color .3s, background-color .3s, border-color .3s; }
.jt-btn__basic > span { position: relative; vertical-align: middle; font-size: var(--font-size-ko-07); line-height: var(--font-lineheight-ko-07); font-weight: 700; letter-spacing: var(--letter-spacing-02); }
.jt-btn__basic .jt-icon { position: relative; width: 16rem; height: 16rem; vertical-align: middle; margin-left: 10rem; }
.jt-btn__basic .jt-icon svg path { fill: currentColor; }

.jt-btn__basic.jt-btn--type-02 { background: transparent; color: var(--color-white); border-color: var(--color-white); }

.jt-btn__basic.jt-btn--small { padding-left: 28rem; padding-right: 28rem; }
.jt-btn__basic.jt-btn--small > span { font-size: var(--font-size-ko-09); line-height: var(--font-lineheight-ko-09); }
.jt-btn__basic.jt-btn--small .jt-icon { margin-left: 8rem; top: .5rem; }
html.ios .jt-btn__basic.jt-btn--small .jt-icon { top: .5rem; }



/* **************************************** *
 * FORM
 * **************************************** */
.jt-form__fieldset { display: flex; flex-wrap: wrap; gap: 60rem 0; }
.jt-form__entry { width: 100%; }
.jt-form__data { margin-top: 20rem; position: relative; font-size: 0; }

/* Label */
.jt-form__label { display: block; position: relative; font-size: 0; }
.jt-form__label > span { display: inline-block; vertical-align: middle; }
.jt-form--required .jt-form__label:after { content: ''; display: inline-block; vertical-align: super; width: 5rem; height: 5rem; margin-left: 6rem; background: #D60000; border-radius: 50%; position: relative; top: -2rem; }

/* Input */
.jt-form__field { display: block; width: 100%; height: 52rem; margin: 0; padding: 12rem 0; font-size: var(--font-size-ko-08); line-height: var(--font-lineheight-ko-08); font-weight: 400; letter-spacing: var(--letter-spacing-02); border: 0; border-bottom: 1px solid var(--color-gray-400); border-radius: 0; outline: none; background: var(--color-white); box-sizing: border-box; transition: border .3s; opacity: 1; }
textarea.jt-form__field { height: 200rem; padding: 19rem; border: 1px solid var(--color-gray-400); overflow: auto; resize: none; }
.jt-form__field:focus { border-color: var(--color-black); }
.jt-form__field:disabled, .jt-form__field:read-only { border-color: var(--color-gray-300); background: var(--color-gray-100); color: var(--color-gray-700); }

/* Explain */
.jt-form__explain { color: var(--color-gray-700); margin-top: 10rem; }
.jt-form__explain a { color: var(--color-black); display: inline-block; border-bottom: 1px solid transparent; transition: border-color .3s; }

/* Choices */
.jt-choices__wrap { position: relative; }

html.desktop .jt-choices { opacity: 0; } /* fix FOUC */

.choices { margin-bottom: 0; font-size: var(--font-size-ko-08); }
.choices__inner { display: block; min-height: inherit; min-width: 240rem; padding: 15rem 52rem 15rem 19rem; font-size: var(--font-size-ko-08); line-height: var(--font-lineheight-ko-08); font-weight: 400; letter-spacing: var(--letter-spacing-02); color: var(--color-black); background: var(--color-white); border: 1px solid var(--color-black); border-radius: 0; transition: border-color .3s; }
.choices__placeholder { color: var(--color-gray-700); opacity: 1; }

.choices[data-type*=select-one] .choices__inner { padding-bottom: 15rem; }
.choices[data-type*=select-one]::after { content: ''; width: 52rem; height: 100%; margin: 0; right: 0; top: 0; border: none; background: url('../images/icon/icon-select.svg') no-repeat center center; background-size: 16rem auto; transition: rotate .4s cubic-bezier(0.22, 0.61, 0.36, 1); }

.choices__list--single { display: block; padding: 0; }

.choices__list--dropdown, 
.choices__list[aria-expanded] { border-radius: 0; }
.choices__list--dropdown .choices__item, 
.choices__list[aria-expanded] .choices__item { padding: 15rem 19rem; font-size: var(--font-size-ko-08); line-height: var(--font-lineheight-ko-08); font-weight: 400; letter-spacing: var(--letter-spacing-02); color: var(--color-gray-700); transition: background-color .3s; }

.is-open .choices__inner,
.is-flipped.is-open .choices__inner { border-radius: 0; }

.is-focused .choices__inner, 
.is-open .choices__inner { border-color: var(--color-black); }

.choices[data-type*=select-one].is-open::after { margin-top: 0; border: none; rotate: -180deg; }

.is-open .choices__list--dropdown,
.is-open .choices__list[aria-expanded] { border-color: inherit; }

.choices__list--dropdown .choices__list,
.choices__list[aria-expanded] .choices__list { max-height: calc((var(--font-lineheight-ko-08) + 30rem) * 4); }
.choices__list--dropdown .choices__item--selectable.is-highlighted, 
.choices__list[aria-expanded] .choices__item--selectable.is-highlighted { background: var(--color-gray-200); }
.choices__list--dropdown .choices__item--selectable.is-selected,
.choices__list[aria-expanded] .choices__item--selectable.is-selected { color: var(--color-black); }

html.desktop .choices__list { overscroll-behavior: none; }
html.desktop.ff .choices__list { scrollbar-width: thin; }
html.desktop .choices__list::-webkit-scrollbar { width: 6rem; }
html.desktop .choices__list::-webkit-scrollbar-track { background: var(--color-gray-200); }
html.desktop .choices__list::-webkit-scrollbar-thumb { background: var(--color-gray-600); }

html.mobile .jt-choices__wrap { min-width: 200rem; background: var(--color-white); overflow: hidden; }
html.mobile .jt-choices__wrap:before { content: ''; width: 16rem; height: 16rem; position: absolute; top: 50%; right: 19rem; background: url(../images/icon/icon-select.svg) no-repeat center center; background-size: contain; translate: 0 -50%; }
html.mobile .jt-choices__wrap > select { appearance: none; width: 100%; margin: 0; height: 58rem; padding: 0 52rem 0 19rem; position: relative; font-family: var(--font-primary); font-size: var(--font-size-ko-08); line-height: 56rem; font-weight: 400; letter-spacing: var(--letter-spacing-02); color: var(--color-black); background: transparent; border: 1px solid var(--color-black); border-radius: 0; outline: none; box-shadow: none; opacity: 1; box-sizing: border-box; }

/* Email Autocomplete */
.jt-automail { position: relative; }
.jt-automail__list { width: 100%; position: absolute; top: calc(100% - 1px); left: 0; background: var(--color-white); border: 1px solid var(--color-black); z-index: 1; }
.jt-automail__list > li { padding: 10rem 18rem; font-size: var(--font-size-ko-08); line-height: var(--font-lineheight-ko-08); font-weight: 400; letter-spacing: var(--letter-spacing-02); color: var(--color-black); cursor: pointer; }
.jt-automail__list > li > span { color: var(--color-primary); }
.jt-automail__list > li.jt-automail--focus { background: var(--color-gray-100); }

/* Agreement */
.jt-agreement { margin-top: 40rem; }
.jt-agreement__title { margin-bottom: 40rem; }

.jt-agreement__item + .jt-agreement__item { margin-top: 24rem; }
.jt-agreement__item b { display: block; color: var(--color-gray-900); margin-bottom: 12rem; }
.jt-agreement__item > p { color: var(--color-gray-800); margin-bottom: 12rem; }
.jt-agreement__item ul > li { position: relative; color: var(--color-gray-800); margin-bottom: 12rem; padding-left: 18rem; }
.jt-agreement__item ul > li:last-child { margin-bottom: 0; }
.jt-agreement__item ul > li:before { content: ''; position: absolute; left: 4rem; top: calc(var(--font-lineheight-ko-09) / 2 - 2rem); display: block; width: 4rem; height: 4rem; border-radius: 50%; background: var(--color-primary); }
html.ios .jt-agreement__item ul > li:before { margin-top: -1rem; }
.jt-agreement__item ul > li > ul { margin-top: 8rem; }
.jt-agreement__item ul > li > ul > li { padding-left: 16rem; margin-bottom: 4rem; }
.jt-agreement__item ul > li > ul > li:before { width: 6rem; height: 1px; background: var(--color-gray-600);  top: calc(var(--font-lineheight-ko-09) / 2 - .5px) }

.jt-agreement__choice label { display: inline-block; font-size: 0; color: var(--color-gray-900); cursor: pointer; }
.jt-agreement__choice a { color: inherit; color: var(--color-black); font-weight: 700; text-decoration: underline; text-decoration-thickness: 1rem; text-underline-offset: 8rem; transition: color .3s; }
.jt-agreement__choice .wpcf7-form-control-wrap { display: inline-block; }

/* Control */
.jt-form__control { position: relative; margin-top: 80rem; }

/* Loading */
.jt-form__loading { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--color-black); border-radius: 50rem; }
.jt-form__loading-icon { display: inline-block; width: 8rem; height: 8rem; margin: 0 6rem; position: relative; background: var(--color-gray-500); border-radius: 50%; opacity: .8; }
.jt-form__loading-icon:nth-child(1) { animation: jt-form-loading 1s infinite ease-out; }
.jt-form__loading-icon:nth-child(2) { animation: jt-form-loading 1s .1s infinite ease-out; }
.jt-form__loading-icon:nth-child(3) { animation: jt-form-loading 1s .2s infinite ease-out; }

/* Contact form 7 */
.wpcf7-list-item { margin: 0; }
.wpcf7-not-valid-tip { margin-top: 10rem; font-size: var(--font-size-ko-09); line-height: var(--font-lineheight-ko-09); letter-spacing: var(--letter-spacing-02); font-weight: 400; color: var(--color-primary); }
.wpcf7-checkbox { position: relative; font-size: var(--font-size-ko-08); }
.wpcf7-not-valid-tip { position: absolute; top: 100%; left: 0; margin-top: 12rem; white-space: nowrap; }
.wpcf7-checkbox input { position: absolute; opacity: 0; cursor: pointer; }
.wpcf7-checkbox .wpcf7-list-item-label { padding-left: 30rem; font-size: 0; }
.wpcf7-checkbox .wpcf7-list-item-label:before { content: ''; display: block; width: 20rem; height: 20rem; position: absolute; top: 0; left: 0; border: 1px solid var(--color-gray-400); transition: border .3s, background-color .1s; box-sizing: border-box; }
.wpcf7-checkbox .wpcf7-list-item-label:after { content: ''; display: none; position: absolute; width: 7rem; height: 11rem; left: 7rem; top: 3rem; border: solid var(--color-white); border-width: 0 2rem 2rem 0; rotate: 45deg; box-sizing: border-box; }
.wpcf7-checkbox input:checked + .wpcf7-list-item-label:before { background: var(--color-black); border-color: var(--color-black); }
.wpcf7-checkbox input:checked + .wpcf7-list-item-label:after { display: block; }
.wpcf7 input.wpcf7-submit { display: block; width: 100%; padding: 10rem 58rem; position: relative; font-size: var(--font-size-ko-07); line-height: var(--font-lineheight-ko-07); font-weight: 700; letter-spacing: var(--letter-spacing-02); color: var(--color-white); text-align: center; background: var(--color-black); border: 2rem solid var(--color-black); border-radius: 30rem; box-sizing: border-box; transition: color .3s, background-color .3s; cursor: pointer; }
.wpcf7 form .wpcf7-response-output { position: absolute; opacity: 0; width: 0; height: 0; overflow: hidden; padding: 0; margin: 0; border: 0; }
.wpcf7-spinner { display: none; }
.wpcf7 form.submitting .wpcf7-submit { pointer-events: none; }

/* Loading keyframes */
@keyframes jt-form-loading {
    0% { scale: 1; opacity: .8; }
    20% { scale: 1.2; opacity: 1; }
    40% { scale: 1; opacity: .8; }
}



/* **************************************** *
 * CATEGORY
 * **************************************** */
.jt-category__list { display: flex; flex-wrap: wrap; gap: 8rem; }
.jt-category__list > li > a, .jt-category__list > li > span { display: block; min-width: 100rem; text-align: center; padding: 8rem 24rem; border-radius: 99rem; color: var(--color-gray-900); background: var(--color-gray-200); transition: color .3s, background .3s; }
.jt-category__list > li.jt-category--active > a { background: var(--color-black); color: var(--color-white); }
.jt-category__title { margin-bottom: 24rem; }

/* Swiper pagination */
.jt-category__list.swiper-pagination-horizontal { width: auto; }
.jt-category__list.swiper-pagination-horizontal li.swiper-pagination-bullet { width: auto; height: auto; border-radius: 0; background: none; margin: 0; opacity: 1; }
.jt-category__list.swiper-pagination-horizontal li.swiper-pagination-bullet-active span { background: var(--color-black); color: var(--color-white); }



/* **************************************** *
 * TABS
 * **************************************** */
.jt-tabs__head + .jt-tabs__panels { margin-top: 80rem; }

.jt-tabs__menu { display: flex; flex-wrap: wrap; gap: 8rem; }
.jt-tabs__menu--center { justify-content: center; text-align: center; }
.jt-tabs__menu a { display: block; min-width: 100rem; text-align: center; padding: 8rem 24rem; border-radius: 99rem; color: var(--color-gray-900); background: var(--color-gray-200); transition: color .3s, background .3s; }
.jt-tabs__menu a br { display: none !important; }
.jt-tabs__menu li.jt-tabs--active a { background: var(--color-black); color: var(--color-white); }

.jt-tabs__panels > div { display: none; }
.jt-tabs__panels > div:first-child { display: block; }



/* **************************************** *
 * PAGINATION
 * **************************************** */
.jt-pagination { margin-top: 60rem; font-size: 0; text-align: center; }
.jt-pagination:empty { margin-top: 0; }

.jt-pagination .jt-pagination__numbers { display: inline-flex; align-items: center; justify-content: center; vertical-align: top; min-width: 26rem; height: 24rem; margin: 0 5rem; position: relative; font-size: var(--font-size-ko-09); line-height: var(--font-lineheight-ko-09); font-weight: 400; letter-spacing: var(--letter-spacing-02); color: var(--color-gray-600); transition: color .3s; }
.jt-pagination .jt-pagination__numbers:after { content: ''; display: block; width: 12rem; height: 2rem; position: absolute; bottom: 0; left: 50%; translate: -50% 0; box-sizing: border-box; }
.jt-pagination .jt-pagination__numbers .jt-icon { width: 12rem; }
.jt-pagination .jt-pagination__numbers.jt-pagination--prev { margin-right: 8rem; }
.jt-pagination .jt-pagination__numbers.jt-pagination--next { margin-left: 8rem; }
.jt-pagination .jt-pagination__numbers.jt-pagination--first { margin-right: 1rem; margin-left: 0; }
.jt-pagination .jt-pagination__numbers.jt-pagination--last { margin-left: 1rem; margin-right: 0; }

.jt-pagination .jt-pagination__numbers.jt-pagination--current { font-weight: 700; color: var(--color-black); }
.jt-pagination .jt-pagination__numbers.jt-pagination--current:after { background: var(--color-black); }

.jt-pagination--disabled { pointer-events: none; }
.jt-pagination--disabled .jt-icon svg path { fill: var(--color-gray-600); }



/* **************************************** *
 * LIST COMPONENT
 * **************************************** */
/* List */
.jt-board-list > li { position: relative; }
.jt-board-list > li > a { position: relative; display: block; padding: 30rem 0; }
.jt-board-list > li > a:before { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: var(--color-gray-400); transition: background .3s; }
.jt-board-list__thumb { position: absolute; left: 60%; top: 0; width: 206rem; z-index: 1; visibility: hidden; opacity: 0; pointer-events: none; }
.jt-board-list__thumb img { display: block; width: 100%; height: auto; }
.jt-board-list__category { margin-bottom: 8rem; color: var(--color-primary); }
.jt-board-list__title { display: inline-flex; align-items: center; gap: 8rem; max-width: 100%; }
.jt-board-list__title span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jt-board-list__title .jt-icon { width: 16rem; height: 16rem; }
.jt-board-list__data { display: flex; justify-content: space-between; align-items: end; gap: 80rem; }
.jt-board-list__data h3 { color: var(--color-black); overflow: hidden; }
.jt-board-list__data time { color: var(--color-gray-800); white-space: nowrap; }

/* Nothing */
.jt-list-nothing { padding: 160rem 0; text-align: center; }
.jt-list-nothing b { display: block; }
.jt-list-nothing p { margin-top: 12rem; color: var(--color-gray-900); }
.jt-list-nothing p:empty { display: none; }



/* **************************************** *
 * SINGLE LAYOUT
 * **************************************** */
/* LAYOUT */
.jt-single { margin-top: 160rem; overflow: hidden; }
.jt-single__header { display: flex; flex-direction: column; gap: 16rem; max-width: 874rem; margin: 0 auto 60rem; }
.jt-single__header--center { text-align: center; }

.jt-single__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 25rem; }
.jt-single__meta > * { display: block; position: relative; color: var(--color-gray-800); }
.jt-single__meta > *:not(:last-child):after { content: ''; display: block; width: 1px; height: 14rem; position: absolute; right: -13rem; top: 6rem; background: var(--color-gray-500); }
.jt-single__meta > *.jt-typo--06:not(:last-child):after { top: 9rem; }

.jt-single__title { overflow-wrap: anywhere; }

.jt-single__content { padding-bottom: 120rem; }
.jt-single__content:last-child { padding-bottom: 0; }

/* PREV, NEXT POST */
.jt-single__post { max-width: 874rem; margin: 0 auto; border-top: 1px solid var(--color-gray-600); }
.jt-single__post-item { display: flex; align-items: center; gap: 48rem; padding: 29rem 32rem; border-bottom: 1px solid var(--color-gray-600); }
.jt-single__post-label { white-space: nowrap; }
.jt-single__post-data { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jt-single__post-data > span { color: var(--color-gray-600); }
.jt-single__post-data > a { position: relative; color: var(--color-gray-900); border-bottom: 1px solid transparent; transition: border-color .3s; }

/* CONTROL */
.jt-single__control { margin-top: 60rem; font-size: 0; text-align: center; }



/* **************************************** *
 * SWIPER
 * **************************************** */
.swiper { height: 100%; overflow: visible; }

.swiper-buttons { width: 100%; }
.swiper-control { width: 100%; position: absolute; left: 0; bottom: 0; font-size: 0; text-align: center; z-index: 2; opacity: 0; visibility: hidden; }

/* PAGINATION */
.swiper-control .swiper-pagination.swiper-pagination-bullets { display: inline-block; vertical-align: middle; width: auto; position: relative; bottom: auto; left: auto; }
.swiper-control .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet { width: 13rem; height: 13rem; position: relative; background: transparent; opacity: 1; }
.swiper-control .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet:after { content: ''; width: 9rem; height: 9rem; margin-top: -4.5rem; margin-left: -4.5rem; position: absolute; top: 50%; left: 50%; background: var(--color-gray-500); border-radius: 50%; transition: background-color .3s; }
.swiper-control .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active:after { background: var(--color-gray-800); }

/* NAVIGATION */
.swiper-navigation { opacity: 0; visibility: hidden; }
.swiper-navigation .swiper-button { width: 64rem; height: 64rem; margin: -32rem 0 0; padding: 0; background: transparent; border: none; }
.swiper-navigation .swiper-button:after { display: none; }
.swiper-navigation .swiper-button-prev { right: 100%; left: auto; margin-right: 32rem; }
.swiper-navigation .swiper-button-next { left: 100%; right: auto; margin-left: 32rem; }
.swiper-navigation .swiper-button .jt-icon { width: 100%; position: absolute; top: 50%; left: 50%; translate: -50% -50%; }
.swiper-navigation .swiper-button .jt-icon path { fill: var(--color-gray-500); }

/* INITIALIZE */
.swiper-initialized .swiper-control { opacity: 1; visibility: visible; }
.swiper-initialized .swiper-navigation { opacity: 1; visibility: visible; }



/* **************************************** *
 * LAZYLOAD
 * **************************************** */
img[data-unveil] { opacity: 0; transition: opacity .3s; }
.jt-lazyload--loaded img[data-unveil], img[data-unveil].jt-lazyload--loaded { opacity: 1; }

.jt-lazyload { position: relative; overflow: hidden; }
.jt-lazyload img { display: block; width: 100%; position: absolute; left: 0; top: 0; }
.jt-lazyload.jt-lazyload--loaded img, .jt-lazyload img.jt-lazyload--loaded { height: auto; }

/* Color preview */
.jt-lazyload__color-preview { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: var(--color-gray-100); }
.jt-lazyload.jt-lazyload--loaded .jt-lazyload__color-preview { background: transparent; transition: background-color .1s; transition-delay: .3s; }



/* **************************************** *
 * VIDEO
 * **************************************** */
 /* Embed Video */
.jt-embed-video { margin-left: auto; margin-right: auto; position: relative; } 
.jt-embed-video__inner { position: relative; width: 100%; padding-top: 56.25%; } 
.jt-embed-video__inner iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; box-sizing: content-box; background: #000 url(../images/layout/spin.png) no-repeat center center; background-size: 32rem 32rem; }
.jt-embed-video__poster { width: 100%; height: 100%; position: absolute; top: 0; left: 0; cursor: pointer; z-index: 1; }
.jt-embed-video__poster .jt-embed-video__img { display: block; width: 100%; margin: 0; }
.jt-embed-video__overlay { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0, 0, 0, .4); }
.jt-embed-video__overlay-btn { display: block; width: 82rem; height: 82rem; margin-top: -41rem; margin-left: -41rem; position: absolute; top: 50%; left: 50%; background: var(--color-white); border-radius: 50%; box-sizing: border-box; opacity: 0.8; scale: 1; transition: opacity .5s cubic-bezier(.165, .84, .44, 1), scale 1s cubic-bezier(.23, 1, .32, 1); }
.jt-embed-video__overlay-btn:after { content: ''; width: auto; height: auto; display: block; position: absolute; top: 50%; left: 50%; margin-top: -7rem; margin-left: -4rem; font-style: normal; border-top: 7rem solid transparent; border-bottom: 7rem solid transparent; border-left: 10rem solid var(--color-primary); transition: scale 1s cubic-bezier(.23, 1, .32, 1); }

.ios .jt-embed-video__poster { opacity: 0; visibility: hidden; }

/* Native Background Video */
.jt-background-video { width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow: hidden; }
.jt-background-video__vod { width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow: hidden; transform: translateZ(0); }
.jt-background-video__vod:after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; }
.jt-background-video__vod video { display: block; width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; translate: -50% -50%; object-fit: cover; }
.jt-background-video__poster { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: no-repeat center center; background-size: cover; }
.jt-background-video__error { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .4); cursor: pointer; opacity: 0; visibility: hidden; }
.jt-background-video__error .jt-icon { width: 72rem; height: 72rem; }
.jt-background-video__error .jt-icon svg path { fill: var(--color-white); }



/* **************************************** *
 * JT POPUP
 * **************************************** */
.jt-popup { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0 80rem; background: rgba(0, 0, 0, .5); z-index: 1000; }
/* .jt-popup__container { display: flex; position: relative; max-width: 680rem; max-height: calc(100% - 80rem); background: var(--color-white); padding-right: 24rem; } */
.jt-popup__container { display: flex; position: relative; max-width: 680rem; max-height: 100%; background: var(--color-white); padding-right: 24rem; }
.jt-popup__inner { padding: 60rem 24rem 60rem 48rem; overflow: hidden auto; overscroll-behavior: none; }
.jt-popup__inner::-webkit-scrollbar { width: 6rem; }
.jt-popup__inner::-webkit-scrollbar-thumb { background: var(--color-gray-400); border-top: 60rem solid var(--color-white); border-bottom: 60rem solid var(--color-white); }
/* .jt-popup__close { position: absolute; top: 0; left: calc(100% + 12rem); width: 40rem; height: 40rem; border: 0; background: none; padding: 0; cursor: pointer; } */
.jt-popup__close-container { position: absolute; top: 50%; left: calc(100% + 12rem); height: 100%; max-height: calc(100vh - 40rem); translate: 0 -50%; }
.jt-popup__close { width: 40rem; height: 40rem; border: 0; background: none; padding: 0; cursor: pointer; vertical-align: top; }
.jt-popup__close .jt-icon { display: block; width: 100%; height: 100%; transition: rotate .3s; }
.jt-popup__close .jt-icon svg path { fill: var(--color-white); }

.jt-popup__template { display: none; }

/* Image popup */
.jt-popup--image .jt-popup__container { padding-right: 0; }
.jt-popup--image .jt-popup__inner { padding: 0; scrollbar-width: none; }
.jt-popup--image .jt-popup__inner img { display: block; max-width: 100%; }



/* **************************************** *
 * JT CONFIRM
 * **************************************** */
.jt-confirm { position: fixed; left: 0; top: 0; width: 100%; height: 100%; text-align: center; background: rgba(0, 0, 0, .5); z-index: 99999; }
.jt-confirm:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; }

.jt-confirm__container { display: inline-block; vertical-align: middle; width: calc(100% - 40rem); max-width: 366rem; background: var(--color-white); overflow: hidden; }

.jt-confirm__content { display: flex; flex-direction: column; gap: 4rem; align-items: center; justify-content: center; padding: 60rem 40rem 50rem; }
.jt-confirm__content b { display: block; font-size: var(--font-size-ko-07); line-height: var(--font-lineheight-ko-07); font-weight: 700; letter-spacing: var(--letter-spacing-02); }
.jt-confirm__content p { font-size: var(--font-size-ko-09); line-height: var(--font-lineheight-ko-09); font-weight: 400; letter-spacing: var(--letter-spacing-02); color: var(--color-gray-800); }

.jt-confirm__actions { display: flex; flex-wrap: nowrap; }
.jt-confirm__btn { width: 100%; padding: 12rem 20rem; font-size: var(--font-size-ko-08); line-height: var(--font-lineheight-ko-08); font-weight: 400; letter-spacing: var(--letter-spacing-02); color: var(--color-gray-900); background: var(--color-gray-200); border: 0; cursor: pointer; transition: .3s; }

.jt-confirm--choice .jt-confirm__btn { width: 50%; }
.jt-confirm--choice .jt-confirm__btn.jt-confirm--success { background: var(--color-black); color: var(--color-white); }



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

    /* BUTTON */
    .jt-btn__basic:hover { color: var(--color-black); background: transparent; border-color: var(--color-black); }
    .jt-btn__basic.jt-btn--type-02:hover { color: var(--color-black); background: var(--color-white); border-color: var(--color-white); }

    /* FORM */
    .jt-form__explain a:hover { border-color: var(--color-black); }

    .jt-automail__list > li:hover { background: var(--color-gray-100); }
    .jt-agreement__choice a:hover { color: var(--color-primary); }
    .jt-agreement__choice label:hover .wpcf7-checkbox .wpcf7-list-item-label:before { border-color: var(--color-black); }
    input.wpcf7-submit:hover { color: var(--color-black); background: transparent; border-color: var(--color-black); }

    /* CATEGORY */
    .jt-category__list > li:not(.jt-category--active) > a:hover,
    .jt-category__list > li:not(.jt-category--active, .swiper-pagination-bullet-active) > span:hover { background: var(--color-gray-400); }

    /* TABS */
    .jt-tabs__menu a:hover { background: var(--color-gray-400); }

    /* PAGINATION */
    .jt-pagination .jt-pagination__numbers:hover { color: var(--color-black); }

    /* LIST COMPONENT */
    .jt-board-list > li > a:hover:before { height: 2px; background: var(--color-black); }

    /* SINGLE */
    .jt-single__post-data > a:hover { border-color: currentColor; }

    /* SWIPER */
    .swiper-navigation .swiper-button:hover .jt-icon path { fill: var(--color-black); }

    /* POPUP */
    .jt-popup__close:hover .jt-icon { rotate: 90deg; }

    /* JT CONFIRM */
    .jt-confirm__btn:hover { background: var(--color-gray-400); }
    .jt-confirm--choice .jt-confirm__btn.jt-confirm--success:hover { background: var(--color-gray-900); }

}