@charset "utf-8";

/*
 * File       : layout.css
 * Author     : STUDIO-JT (KMS)
 * Guideline  : JTstyle.2.0
 *
 * Dependency : css/reset.css
 * Dependency : css/jt-strap.css
 *
 * SUMMARY:
 * 01) GLOBAL
 * 02) 404
 * 03) RWD
 */



/* **************************************** *
 * GLOBAL
 * **************************************** */
html { font-size: 6.25%; }
html.safari.desktop { font-size: .05254860746190226vw; }

body { overflow-x: hidden; font-family: var(--font-primary); font-size: 16rem; word-break: keep-all; color: #000; }
a { color: var(--color-primary); text-decoration: none; }
[lang="en"] { font-family: var(--font-secondary); }
input {font-family: var(--font-primary);}



/* **************************************** *
 * Mobile
 * **************************************** */
html.mobile #header {display: none;}
html.mobile #footer {display: none;}
.jt-mobile-ui{padding: 30rem 24rem; position: relative; width: 100%; height: 100vh;}
.jt-mobile-ui .jtin-logo {position: absolute; top: 30rem; left: 24rem;}
.jt-mobile-ui .jtin-logo img {width: 90rem;}
.jt-mobile-ui .jtin-shop {position: absolute; top: 33rem; right: 22rem; padding: 0;}
.jt-mobile-ui .jtin-shop a{color: #000; font-size: 13rem; padding-right: 17rem;}
.jt-mobile-ui .jtin-shop a::after {background: no-repeat url(../images/layout/mobile-link.svg); width: 13rem; height: 13rem; background-size: 11rem; top: 2rem;}
.jt-mobile-ui .jt-content {width: 100%; text-align: center; position: absolute; top: 51%; left: 50%; transform: translate(-50%,-50%);}
.jt-mobile-ui .jt-content .jt-mobile__text {margin-top: 17rem; margin-bottom: 8rem;}
.jt-mobile-ui .jt-content .jt-mobile__text h1 {font-size: 32rem; line-height: 44rem; margin-bottom: 10rem; font-weight: 600;}
.jt-mobile-ui .jt-content .jt-mobile__text p {font-size: 20rem; line-height: 32rem;}
.jt-mobile-ui .jt-content .jt-mobile__bg {width: 200rem; height: 200rem; position: relative; margin: 0 auto;}
.jt-mobile-ui .jt-content .jt-mobile__bg iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.jt-mobile-ui .jt-content .jt-mobile__bg img {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.jt-mobile-ui .jt-footer {position: absolute; bottom: 36rem; left: 24rem; color: #888; font-size: 10rem;}


/* **************************************** *
 * 404
 * **************************************** */
.header_errer .jtin-shop a{color: #000;}
.header_errer .jtin-shop a:hover {color: rgba(34, 29, 30, 1); padding-right: 23rem;}
.header_errer .jtin-shop a::after {background: no-repeat url(../images/layout/icon-link-black.svg); width: 13rem; height: 13rem;}
.header_errer .jtin-shop a:hover:after {transform: translate(3rem, -3rem); background-image: url(../images/layout/icon-link-404.svg);}

.error-404 {padding: 0 208rem;}
.error-404 .jt-fullvid-overlay {background: none;}
.error-404__inner {position: absolute; top: 50%; transform: translateY(-50%);}
.error-404__inner h1{color: #000; font-size: 72rem; line-height: 88rem; font-weight: 600; margin-top: -20rem;}
.error-404__inner p {font-size: 18rem; line-height: 30rem; color: #666; margin: 25rem 0 60rem;}
.error-404__controller a {display: inline-block; padding: 19rem 0; width: 200rem; height: 55rem; background: #000; color: #fff; font-size: 15rem; font-weight: 600; border-radius: 100rem; text-align: center; transition: background .3s;}
.error-404__controller a:hover {background: rgba(34, 29, 30, 1);}


#footer.footer_errer p {color: #888;}



/* **************************************** *
 * RWD
 * **************************************** */
@media (min-width: 2000px){

    html { font-size: 0.05254860746190225vw; }

} /* 2000px */

@media (max-width: 1480px){

    html { font-size: 0.06756756756756757vw; }
    html.mobile { font-size: 0.09775171065493645vw; }

} /* 1480px */

@media (max-width: 1023px){

    html { font-size: 0.09775171065493645vw; }

} /* 1023px */

@media (max-width: 860px){

    html.mobile { font-size: 0.13020833333333335vw; }

} /* 860px */

@media (max-width: 540px){

    html.mobile { font-size: 0.26666666666666665vw; }

} /* 540px */