@charset "utf-8";

/*
 * File    : sub-etc.css
 * Author  : STUDIO-JT (KMS)
 *
 * MEDIA CENTER
 * CONTACT US
 * SEARCH & TAG
 * PRIVACY
 * REJECTION E-MAIL
 * HOVER
 */



/* **************************************** *
 * MEDIA CENTER
 * **************************************** */
.media-filter { width: 177rem; margin-bottom: 10rem; }

.media-filter .choices__inner { padding-left: 47rem; padding-right: 15rem; background: var(--color-white); border-color: var(--color-white); }
.media-filter .choices[data-type*=select-one]::after { width: 30rem; top: -1rem; right: inherit; left: 14rem; }
.media-filter .is-focused .choices__inner, 
.media-filter .is-open .choices__inner { border-color: var(--color-black); }

html.mobile .media-filter .jt-choices__wrap { background: var(--color-white); }
html.mobile .media-filter .jt-choices__wrap:before { top: calc(50% - 1rem); right: inherit; left: 20rem; }
html.mobile .media-filter .jt-choices__wrap > select { padding-left: 47rem; padding-right: 15rem; border-color: var(--color-white); }



/* **************************************** *
 * CONTACT US
 * **************************************** */
.contact-section { border-top: 3rem solid var(--color-black); }
.contact-section + .contact-section { margin-top: 60rem; }

.contact-section__head { margin-bottom: 40rem; padding: 17rem 0 15rem; border-bottom: 1px solid var(--color-black); }
.contact-section__head > h2 + p { margin-top: 20rem; padding-top: 15rem; border-top: 1px solid var(--color-black); }

/* FORM */
.contact-form .jt-checkbox:has(input[name="contact[find][]"]) { display: grid; gap: 16rem 30rem; grid-template-columns: repeat(3, 1fr); }

.contact-form .jt-form__data-item:has(#contact-product-name) .choices__list--dropdown .choices__item:nth-child(1) { display: none !important; }

/* INFO */
.contact-info { padding-bottom: 47rem; border-bottom: 3rem solid var(--color-black); }

.contact-info__list { display: grid; grid-gap: 0 80rem; grid-template-rows: repeat(4, 1fr); grid-auto-flow: column; grid-auto-columns: 1fr; position: relative; }
.contact-info__list:before { content: ''; width: 1px; height: 100%; position: absolute; left: calc(50% - 1px); top: 0; background: var(--color-black); }
.contact-info__list > li { display: flex; justify-content: space-between; align-items: center; gap: 20rem; padding: 10rem 0; }
.contact-info__list > li > * { flex: 1; }
.contact-info__list > li > p { text-align: right; }
.contact-info__list > li > p > a { padding: 3rem 0; color: inherit; transition: color .3s; }

/* LAYER */
.jt-form-layer { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; text-align: center; background: color-mix(in srgb, var(--color-black) 40%, transparent 60%); z-index: 9999; }

.jt-form-layer__container { display: flex; align-items: center; width: 100%; height: 100%; position: absolute; left: 0; top: 0; text-align: center; }
.jt-form-layer__content { position: relative; display: inline-block; vertical-align: middle; width: 480rem; text-align: center; height: fit-content; margin: 0 auto; padding: 60rem 60rem 53rem; background: var(--color-white); box-shadow: 0 10rem 30rem 0 color-mix(in srgb, var(--color-black) 25%, transparent 75%); }
.jt-form-layer__content p { margin-top: 10rem; }
.jt-form-layer__actions { margin-top: 30rem; }
.jt-form-layer__actions > a { min-width: 180rem; display: inline-block; padding: 7rem 32rem; color: inherit; background: var(--color-white); border: 3rem solid var(--color-black); transition: color .3s, background-color .3s; }

.jt-form-layer__close { width: 60rem; height: 60rem; margin: 0; padding: 0; position: absolute; top: 0; right: 0; background: transparent; border: none; outline: none; cursor: pointer; transition: background-color .3s; }
.jt-form-layer__close .jt-accent-icon { width: 18rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: transform .3s; }



/* **************************************** *
 * SEARCH & TAG
 * **************************************** */
/* FORM */
.global-search-form { position: relative; }

.global-search-form__field { position: relative; }
.global-search-form__input { display: block; width: 100%; height: 80rem; margin: 0; padding: 0 80rem 0 84rem; font-size: var(--font-size-primary-07); line-height: var(--font-lineheight-primary-08); font-weight: 500; letter-spacing: var(--letter-spacing-01); text-overflow: ellipsis; background: var(--color-gray-100); border: none; border-radius: 0; outline: none; opacity: 1; box-sizing: border-box; transition: border .3s; }
.global-search-form__label { position: absolute; top: 24rem; left: 84rem; font-size: var(--font-size-primary-07); line-height: var(--font-lineheight-primary-08); font-weight: 500; letter-spacing: var(--letter-spacing-01); color: var(--color-gray-300); transition: opacity .26s; cursor: text; }

.global-search-form__submit { display: block; width: 32rem; height: 32rem; margin: 0; padding: 0; position: absolute; left: 26rem; top: 50%; background: none; border: none; cursor: pointer; transform: translate(0, -50%); }
.global-search-form__submit .jt-accent-icon { display: block; width: 28rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

.global-search-form__reset { display: block; width: 30rem; height: 30rem; margin: 0; padding: 0; position: absolute; right: 25rem; top: 50%; background: none; border: none; cursor: pointer; transform: translate(0, -50%); opacity: 0; transition: opacity .15s, background-color .3s; }
.global-search-form__reset:before { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: var(--color-black); border-radius: 50%; transition: background-color .3s; }
.global-search-form__reset .jt-icon { display: block; width: 12rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.global-search-form__reset .jt-icon path { fill: var(--color-white); }

.global-search-form.global-search-form--active .global-search-form__label { opacity: 0; visibility: hidden; }
.global-search-form.global-search-form--active .global-search-form__reset { opacity: 1; visibility: visible; }

/* MODAL */
.global-search-modal { display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: color-mix(in srgb, var(--color-black) 40%, transparent 60%); z-index: 9999; overflow: hidden; }
.global-search-modal__inner { padding: 80rem 0; position: relative; background: var(--color-white); }

.global-search-modal__close { width: 80rem; height: 80rem; margin: 0; padding: 0; position: absolute; top: 0; right: 0; background: transparent; border: none; border-radius: 0; opacity: 1; cursor: pointer; transition: background-color .3s; }
.global-search-modal__close .jt-accent-icon { width: 28rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: transform .3s; }

/* PAGE */
.results-entries__title { text-align: center; }

.results-entries__filter { display: flex; justify-content: space-between; align-items: center; gap: 32rem; margin-top: 63rem; margin-bottom: 50rem; padding-bottom: 10rem; border-bottom: 3rem solid var(--color-black); }
.results-entries__category-select { display: none; }
.results-entries__count { padding: 4rem 0; }
.results-entries__count > span { color: var(--color-primary); }

.results-entries__list { display: flex; flex-direction: column; gap: 20rem; }
.results-entries__list-content { display: block; padding: 30rem 35rem; color: inherit; background: var(--color-gray-100); }
.results-entries__list-meta { display: flex; justify-content: space-between; align-items: center; gap: 35rem; margin-bottom: 10rem; }
.results-entries__list-date { color: var(--color-gray-400); }
.results-entries__list-title { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.results-entries__list-title > a { color: inherit; }
.results-entries__list-title span { border-bottom: 1px solid transparent; transition: border .3s; }
.results-entries__list-tag { margin-top: 20rem; }

.results-entries .jt-list-nothing.jt-list-nothing--secondary > b:after { display: none; }



/* **************************************** *
 * PRIVACY
 * **************************************** */
body.page-template-privacy .article__header.article__header--simple { margin-bottom: 30rem; }



/* **************************************** *
 * REJECTION E-MAIL
 * **************************************** */
body.page-template-rejection-email .main-container { padding-top: 80rem; padding-bottom: 0; }

.rejection-email { display: flex; align-items: center; justify-content: center; height: 100vh; min-height: 100svh; max-height: -webkit-fill-available; }
.rejection-email__inner { margin-bottom: 60rem; border: solid var(--color-black); border-width: 3rem 0; }
.rejection-email h1 { padding: 17rem 0 20rem; }
.rejection-email p { padding: 30rem 0; border: solid var(--color-black); border-width: 1px 0; }
.rejection-email p > span { display: block; }
.rejection-email__action { display: flex; align-items: center; justify-content: space-between; gap: 27rem; padding: 27rem 0; }
.rejection-email__action .jt-btn__horizontal { display: inline-flex; min-width: 270rem; }



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

    /* CONTACT US */
    .contact-info__list > li > p > a:hover { color: var(--color-primary); }

    .jt-form-layer__actions > a:hover { color: var(--color-white); background: var(--color-black); }
    .jt-form-layer__close:hover { background: var(--color-primary); }
    .jt-form-layer__close:hover .jt-accent-icon { transform: translate(-50%, -50%) rotate(90deg); }

    /* SEARCH & TAG */
    .global-search-form__reset:hover:before { background: var(--color-primary); }
    .global-search-form__reset:hover .jt-icon path { fill: var(--color-black); }

    .global-search-modal__close:hover { background: var(--color-primary); }
    .global-search-modal__close:hover .jt-accent-icon { transform: translate(-50%, -50%) rotate(90deg); }

    a.results-entries__list-content:hover .results-entries__list-title span,
    .results-entries__list-title > a:hover span { border-bottom-color: var(--color-black); }
    
}