@charset "utf-8";

/*
 * File       : rwd-sub.css
 * Author     : STUDIO-JT (KMS)
 * Guideline  : JTstyle.2.1
 *
 * Dependency : css/reset.css
 *
 * SUMMARY:
 * 01) 1680px
 * 02) 1480px
 * 03) 1023px
 * 04) 860px
 * 05) 540px
 */



/* **************************************** *
 * 1680px
 * **************************************** */
@media (max-width: 1680px){

    /* MARKETING */
    .promotion__head-inner { max-width: inherit; margin: 0 80rem; }

}



/* **************************************** *
 * 1480px
 * **************************************** */
@media (max-width: 1480px){

    /* DEVELOPER */
    .developer-visual { padding-top: 44rem; }

    .developer-section { padding: 140rem 0; }

    .developer-story__list { -webkit-column-gap: 30rem; -moz-column-gap: 30rem; column-gap: 30rem; }
    .developer-story__list-content { margin-top: 28rem; }
    .developer-story__list-content .ke-btn__point { margin-top: 22rem; }

    .developer-news__slider .component-slider__item { width: 50%; max-width: inherit; }

    .developer-blog__data { row-gap: 80rem; -webkit-column-gap: 30rem; -moz-column-gap: 30rem; column-gap: 30rem; }

    /* ABOUT */
    .about-message + .about-message { margin-top: 100rem; padding-top: 100rem; }
    .about-message__title { font-size: 40rem; }
    .about-message__content p { margin-top: 26rem; }
    .about-message__buttons { margin-top: 32rem; }
    
    .about-visual { padding-top: 44rem; }

    .about-browse__item { width: 470rem; padding: 0 15rem; }
    .about-browse__title { margin-top: 20rem; }

    .about-intro { padding-top: 140rem; }
    .about-intro__logo { width: 238rem; }
    .about-intro__movie { margin-top: 80rem; }

    .about-philosophy { padding: 140rem 0; }
    .about-philosophy__title { font-size: 20rem; }
    .about-philosophy__slogan { margin: 48rem 0; }
    .about-philosophy__slogan b, 
    .about-philosophy__slogan span { font-size: 54rem; }
    .about-philosophy__slogan p { font-size: 20rem; }
    .about-philosophy__slogan-bracket > span:first-child { margin-right: 140rem; }

    .about-slogan { padding: 140rem 0; }
    .about-slogan__keyword-connect { width: 300rem; }
    .about-slogan__keyword-solve { width: 190rem; }
    .about-slogan__keyword-create { width: 241rem; }
    .about-slogan__keyword-ai { width: 176rem; }
    .about-slogan__point { width: 938rem; margin-top: 76rem; -webkit-column-gap: 30rem; -moz-column-gap: 30rem; column-gap: 30rem; }
    .about-slogan__image { width: 885rem; height: 489rem; margin-left: 178rem; }

    .about-location { padding-top: 140rem; }
    .about-location__map { height: 530rem; margin-top: 65rem; }

    /* CASE */
    .case-filter { margin-bottom: 30rem; }

    .case-filter__label > span > * { font-size: 17rem; }

    .case-filter__content { margin-bottom: 72rem; }
    .case-filter__content-inner { padding: 47rem 46rem 95rem; }

    .case-filter__data { -webkit-column-gap: 30rem; -moz-column-gap: 30rem; column-gap: 30rem; }

    /* INQUIRY */
    .inquiry-datalist { -webkit-column-gap: 30rem; -moz-column-gap: 30rem; column-gap: 30rem; row-gap: 70rem; }

    .inquiry-center { margin-top: 114rem; padding-top: 121rem; }
    .inquiry-center .inquiry-datalist { max-width: inherit; }
    .inquiry-center .inquiry-datalist.inquiry-datalist--center { max-width: inherit; margin: 0 -15rem; }
    .inquiry-center .inquiry-datalist.inquiry-datalist--center > li { padding: 0 15rem; }

    /* BOOSTUP */
    body.page-template-info-boostup .component-resource { margin-top: 160rem; background-color:transparent !important; }
    

    /* MARKETING */
    .promotion__head-inner { margin: 0 50rem; }

}



/* **************************************** *
 * 1023px
 * **************************************** */
@media (max-width: 1023px){

    /* DEVELOPER */
    .developer-visual { padding-top: 32rem; }
    .developer-visual__bg { margin-top: -90rem; }

    .developer-column__title { float: none; width: 100%; padding-right: 0; margin-bottom: 50rem; }
    .developer-column__name br { display: none; }
    .developer-column__content { float: none; width: 100%; }

    .developer-story__list { -webkit-column-gap: 20rem; -moz-column-gap: 20rem; column-gap: 20rem; }
    .developer-story__list-content { margin-top: 22rem; }
    .developer-story__list-content p { margin-top: 8rem; font-size: 19rem; }
    .developer-story__list-content p br { display: none; }
    .developer-story__list-content .ke-btn__point { margin-top: 20rem; }

    .developer-blog__data-content { margin-top: 22rem; }
    .developer-blog__data-title { font-size: 19rem; }
    .developer-blog__data-title br { display: none; }

    /* ABOUT */
    .about-message__title { width: 37%; padding-right: 30rem; font-size: 37rem; }
    .about-message__content { width: 63%; }
    .about-message__content b { font-size: 19rem; }
    .about-message__content b br { display: none; }
    .about-message__content p { margin-top: 23rem; }
    .about-message__content p br { display: none; }

    .about-visual { padding-top: 32rem; }

    .about-browse__item { width: 420rem; padding: 0 10rem; }
    .about-browse__title { margin-top: 18rem; }

    .about-intro__logo { width: 200rem; }
    .about-intro__movie { margin-top: 68rem; }

    .about-philosophy__slogan { margin: 44rem 0; }
    .about-philosophy__slogan > div { margin-right: 13rem; }
    .about-philosophy__slogan b, 
    .about-philosophy__slogan span { font-size: 48rem; }
    .about-philosophy__slogan p { margin-top: 15rem; font-size: 19rem; }
    .about-philosophy__slogan-bracket > span:first-child { margin-right: 120rem; }
    
    .about-slogan { padding: 130rem 0; }
    .about-slogan__keyword { width: 480rem; margin-bottom: -16rem; }
    .about-slogan__keyword > * { margin-bottom: 16rem; }
    .about-slogan__keyword-connect { width: 255rem; }
    .about-slogan__keyword-solve { width: 162rem; }
    .about-slogan__keyword-create { width: 205rem; }
    .about-slogan__keyword-ai { width: 150rem; }
    .about-slogan__point { width: 100%; margin-top: 62rem; -webkit-column-gap: 20rem; -moz-column-gap: 20rem; column-gap: 20rem; }
    .about-slogan__point p { font-size: 17rem; }
    .about-slogan__image { width: 708rem; height: 391rem; margin-left: -116rem; margin-top: -210rem; }

    .about-location__map { height: 500rem; }

    /* BOARD */
    .page-template-info-notice .wrap-narrow,
    .page-template-info-certification .wrap-narrow { margin: 0 40rem; }

    /* CASE */
    .case-filter { margin-bottom: 22rem; }

    .case-filter__label { margin-bottom: 18rem; }

    .case-filter__content { margin-bottom: 65rem; }
    .case-filter__content-inner { padding: 36rem 40rem 85rem; }

    .case-filter__data b { margin-bottom: 18rem; }

    .case-filter__reset { bottom: 20rem; }

    /* INQUIRY */
    .inquiry-datalist { -webkit-column-gap: 20rem; -moz-column-gap: 20rem; column-gap: 20rem; row-gap: 65rem; }
    .inquiry-datalist__title { margin-top: 23rem; font-size: 19rem; }

    .inquiry-center { margin-top: 105rem; padding-top: 105rem; }
    .inquiry-center .inquiry-datalist.inquiry-datalist--center { margin: 0 -10rem; }
    .inquiry-center .inquiry-datalist.inquiry-datalist--center > li { padding: 0 10rem; }

    /* BOOSTUP */
    body.page-template-info-boostup .component-resource { margin-top: 150rem; }

    /* MARKETING */
    .promotion__head-inner { margin: 0 40rem; }

}




/* **************************************** *
 * 860px
 * **************************************** */
@media (max-width: 860px){

    /* DEVELOPER */
    body.page-template-developer .article-header { overflow: hidden; }

    .developer-section { padding: 120rem 0; }

    .developer-column__name { font-weight: bold; letter-spacing: -0.025em; }

    .developer-visual { padding-top: 15rem; }
    .developer-visual__bg { width: 140vw; padding-top: 85%; margin-left: -20vw; margin-top: -120rem; }

    .developer-story__list { grid-template-columns: 1fr 1fr; row-gap: 70rem; }
    .developer-story__list-thumb { border-radius: 12rem; }
    .developer-story__list-content h2 { font-weight: bold; }
    .developer-story__list-content p { letter-spacing: -0.025em; }
    .developer-story__list-content .ke-btn__point { margin-top: 18rem; }

    .developer-blog__data { row-gap: 65rem; -webkit-column-gap: 20rem; -moz-column-gap: 20rem; column-gap: 20rem; }
    .developer-blog__data-thumb,
    .developer-blog__data-thumb img { border-radius: 12rem; }
    .developer-blog__data-title { font-weight: bold; letter-spacing: -0.025em; }

    /* ABOUT */
    .about-message + .about-message { margin-top: 85rem; padding-top: 85rem; }
    .about-message__title { width: 100%; padding-right: 0; margin-bottom: 28rem; font-size: 32rem; font-weight: bold; }
    .about-message__title br { display: none; }
    .about-message__content { width: 100%; }
    .about-message__content b { font-weight: bold; letter-spacing: -0.025em; }
    .about-message__content p { margin-top: 20rem; letter-spacing: -0.025em; }
    .about-message__buttons { margin-top: 25rem; }

    .about-visual { padding-top: 15rem; }

    .about-browse__item { width: 380rem; }
    .about-browse__thumb,
    .about-browse__thumb img { border-radius: 12rem; }
    .about-browse__title { margin-top: 15rem; }

    .about-intro { padding-top: 120rem; }
    .about-intro__logo { margin-top: 0; }
    .about-intro__movie { margin-top: 53rem; }

    .about-philosophy { padding: 120rem 0; }
    .about-philosophy__title { font-size: 19rem; }
    .about-philosophy__desc { letter-spacing: -0.025em; }
    .about-philosophy__slogan { margin: 51rem 0 55rem; }
    .about-philosophy__slogan b, .about-philosophy__slogan span { font-size: 46rem; }
    .about-philosophy__slogan p { margin-top: 7rem; font-size: 15rem; }
    .about-philosophy__slogan > div { margin-right: 11rem; }
    .about-philosophy__slogan > div.about-philosophy__slogan-key:first-child { display: block; margin-bottom: 24rem; }
    .about-philosophy__slogan-bracket > span:first-child { margin-right: 100rem; }

    .about-slogan { padding: 110rem 0; }
    .about-slogan > .wrap { margin: 0 64rem; }
    .about-slogan__keyword { width: 440rem; }
    .about-slogan__keyword > *:nth-child(odd) { margin-right: 16rem; }    
    .about-slogan__keyword-connect { width: 218rem; }
    .about-slogan__keyword-solve { width: 138rem; }
    .about-slogan__keyword-create { width: 175rem; }
    .about-slogan__keyword-ai { width: 128rem; }
    .about-slogan__point p { letter-spacing: -0.025em; }
    .about-slogan__point p br { display: none; }
    .about-slogan__image { width: 566rem; height: 312rem; margin-left: -66rem; margin-top: -208rem; }

    .about-location { padding-top: 120rem; }
    .about-location__map { height: 380rem; margin-top: 55rem; border-radius: 12rem; }

    /* BOARD */
    .page-template-info-notice .wrap-narrow,
    .page-template-info-certification .wrap-narrow { margin: 0 32rem; }

    /* CASE */
    .case-filter { margin-bottom: 20rem; }

    .case-filter__label { padding: 9rem 50rem 9rem 26rem; border-width: 2rem; }
    .case-filter__label > .ke-guide--icon { width: 14rem; right: 22rem; }

    .case-filter__content { border-radius: 12rem; }
    .case-filter__content-inner { padding: 40rem 32rem 86rem; }

    .case-filter__data { grid-template-columns: 1fr; row-gap: 40rem; }
    .case-filter__data b { margin-bottom: 16rem; font-weight: bold; }

    .case-filter__reset { right: 28rem; }

    /* INQUIRY */
    .inquiry-datalist { grid-template-columns: 1fr 1fr 1fr; row-gap: 60rem; }
    .inquiry-datalist__image { border-radius: 12rem; }
    .inquiry-datalist__image img { border-radius: 12rem; }
    .inquiry-datalist__title { margin-top: 20rem; letter-spacing: -0.025em; font-weight: bold; }
    .inquiry-datalist__action { margin-top: 8rem; }
    .inquiry-datalist__action .ke-btn__point { margin-right: 20rem; }
    
    .inquiry-center { margin-top: 85rem; padding-top: 85rem; }
    .inquiry-center .inquiry-datalist { grid-template-columns: 1fr 1fr; }
    .inquiry-center .inquiry-datalist__image { border-radius: 8rem; }
    .inquiry-center .inquiry-datalist__image img { border-radius: 8rem; }

    .inquiry-center .inquiry-datalist.inquiry-datalist--center { display: grid; margin: 0; }
    .inquiry-center .inquiry-datalist.inquiry-datalist--center > li { width: auto; padding: 0; }

    /* BOOSTUP */
    body.page-template-info-boostup .component-resource { margin-top: 130rem; }

    /* MARKETING */
    .promotion__head-inner { margin: 0 32rem; }

}



/* **************************************** *
 * 540px
 * **************************************** */
@media (max-width: 540px){

    /* DEVELOPER */
    body.page-template-developer .article-intro { font-size: 28rem; }

    .developer-section { padding: 90rem 0; }

    .developer-column__title { margin-bottom: 40rem; }

    .developer-visual { padding-top: 10rem; }
    .developer-visual__bg { width: 180vw; padding-top: 95%; margin-left: -40vw; margin-top: -46rem; }

    .developer-story__list { grid-template-columns: 1fr; }
    .developer-story__list-content p { font-size: 18rem; }
    .developer-story__list-content .ke-btn__point { margin-top: 14rem; }

    .developer-news__slider .wrap-narrow { margin: 0 40rem; }
    .developer-news__slider .component-slider__item { width: 100%; }

    .developer-blog__data { grid-template-columns: 1fr; row-gap: 60rem; }
    .developer-blog__data-title { font-size: 18rem; }
    .developer-blog__data-action { margin-bottom: -8rem; }

    /* ABOUT */
    .about-message + .about-message { margin-top: 70rem; padding-top: 70rem; }
    .about-message__title { margin-bottom: 24rem; font-size: 24rem; }
    .about-message__content b { font-size: 18rem; }
    .about-message__content p { margin-top: 16rem; line-height: 1.75; }
    .about-message__buttons { margin-top: 19rem; }
    .about-message__buttons .ke-btn__basic { margin-right: 8rem; }

    .about-visual { padding-top: 10rem; }

    .about-browse__item { width: 280rem; padding: 0 6rem; }
    .about-browse__title { margin-top: 10rem; }

    .about-intro { padding-top: 90rem; }

    .about-philosophy { padding: 90rem 0; }
    .about-philosophy__title { font-size: 18rem; }
    .about-philosophy__desc { line-height: 1.75; }
    .about-philosophy__desc br { display: none; }
    .about-philosophy__slogan-wrap { margin: 32rem -24rem 45rem; overflow-y: hidden; overflow-x: auto; -webkit-overflow-scrolling: touch; pointer-events: none; }
    .about-philosophy__slogan-wrap::-webkit-scrollbar { display: none; }
    .about-philosophy__slogan { width: -webkit-max-content; width: -moz-max-content; width: max-content; margin: 0; padding: 0 24rem; white-space: nowrap; }
    .about-philosophy__slogan b, .about-philosophy__slogan span { font-size: 42rem; }
    .about-philosophy__slogan p { font-size: 14rem; }
    .about-philosophy__slogan > div.about-philosophy__slogan-key:first-child { display: inline-block; margin-bottom: 0; }

    .about-slogan { padding: 80rem 0 200rem; }
    .about-slogan > .wrap { margin: 0 24rem; }
    .about-slogan__keyword { width: 240rem; }
    .about-slogan__keyword-connect { width: 155rem; }
    .about-slogan__keyword-solve { width: 99rem; }
    .about-slogan__keyword-create { width: 126rem; }
    .about-slogan__keyword-ai { width: 91rem; position: absolute; top: 78rem; left: 138rem; }
    .about-slogan__point { grid-template-columns: 1fr 1fr; -webkit-column-gap: 16rem; -moz-column-gap: 16rem; column-gap: 16rem; row-gap: 42rem; }
    .about-slogan__point b { margin-bottom: 13rem; padding-bottom: 8rem; font-size: 18rem; }
    .about-slogan__point p { font-size: 15rem; }
    .about-slogan__image { width: 498rem; height: 275rem; margin: 0; top: auto; left: -61rem; bottom: -132rem; -webkit-transform: none; -ms-transform: none; transform: none; }

    .about-location { padding-top: 90rem; }
    .about-location__map { height: 230rem; margin-top: 55rem; }

    /* BOARD */
    .page-template-info-notice .wrap-narrow,
    .page-template-info-certification .wrap-narrow { margin: 0 24rem; }

    /* CASE */
    .case-filter { margin-bottom: 16rem; }

    .case-filter__label { width: 100%; margin-bottom: 14rem; padding-top: 10rem; }
    .case-filter__label > span { display: block; }
    .case-filter__label > span > * { display: inline-block; font-size: 15rem; }
    .case-filter__label > span > i:first-child { margin-right: 4rem; }
    .case-filter__label > span > i:last-child { margin-left: 4rem; }
    .case-filter__label > span > b { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

    .case-filter__content { margin-bottom: 62rem; }
    .case-filter__content-inner { padding: 30rem 20rem 76rem; }

    .case-filter__data { row-gap: 36rem; }
    .case-filter__data b { margin-bottom: 10rem; line-height: 1.75; }
    .case-filter__list { margin: -3rem; }
    .case-filter__list label { margin: 3rem; padding-left: 13rem; padding-right: 13rem; font-size: 13rem; }

    .case-filter__reset { right: 18rem; bottom: 15rem; }

    html.ios .case-filter__label { padding-top: 11rem; padding-bottom: 8rem; }

    /* INQUIRY */
    .inquiry-datalist { grid-template-columns: 1fr 1fr; -webkit-column-gap: 12rem; -moz-column-gap: 12rem; column-gap: 12rem; row-gap: 50rem; }
    .inquiry-datalist__title { margin-top: 18rem; font-size: 16rem; }

    .inquiry-center { margin-top: 78rem; padding-top: 78rem; }
    .inquiry-center .inquiry-datalist { grid-template-columns: 1fr; }

    body.page-template-inquiry .global-inquiry-banner__obj { background-position: 0 100%; background-size: 380rem auto; }

    /* BOOSTUP */
    body.page-template-info-boostup .component-resource { margin-top: 110rem; }

    /* MARKETING */
    .promotion__head-inner { margin: 0 24rem; }
    .promotion__head-ryan { height: 285rem; padding-top: 0; background-size: 130% auto; background-position: center bottom; }

    .promotion__content { padding: 38rem 30rem 79rem; }
    .promotion__btn { padding: 18rem 29rem; font-size: 16rem; }
    .promotion__btn > span { padding-right: 25rem; position: relative; }

    .promotion__section h1 { font-size: 24rem; }
    .promotion__section p { font-size: 15rem; }

    .promotion__section.promotion__data li { font-size: 15rem; }
    .promotion__section.promotion__data li span { top: 0; -webkit-transform: none; -ms-transform: none; transform: none; }

    .promotion__section.promotion__expect ul { grid-template-columns: 1fr; }
    .promotion__section.promotion__expect ul > li { padding: 0 16rem 20rem; border-bottom: 1rem solid rgba(255,255,255,0.2); }
    .promotion__section.promotion__expect ul > li:last-child { border-bottom: none; }

    .promotion__section.promotion__program table th:nth-child(1) { width: 92rem; }
    .promotion__section.promotion__program table tr > *:first-child { padding-right: 15rem; }
    .promotion__section.promotion__program table th, 
    .promotion__section.promotion__program table td { padding: 20rem 0 19rem; }
    .promotion__section.promotion__program table th { font-size: 14rem; }
    .promotion__section.promotion__program .promotion__action { margin-top: 41rem; }

    .promotion__footer { padding: 40rem 30rem 60rem; }
    .promotion__footer p br { display: none; }
    .promotion__sns { margin: 30rem -8rem 0; position: relative; top: auto; right: auto; }

    html.ios .promotion__btn > span:after { margin-top: -10.5rem; }
    html.ios .promotion__section.promotion__program table th, 
    html.ios .promotion__section.promotion__program table td { padding: 21rem 0 18rem; }
    html.ios .promotion__section.promotion__notice li { padding-left: 18rem; }

}