@charset "utf-8";

/*
 * File    : rwd-safety.css
 * Author  : STUDIO-JT
 *
 * SUMMARY :
 * 2041px (min-width)
 * 861px (min-width)
 * 1480px
 * 860px
 * 540px
 */



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

    /* VISUAL */
    .safety-visual__bg:after { content: ''; width: 100%; height: 70rem; position: absolute; left: 0; bottom: 0; background: linear-gradient(to bottom, rgba(204, 204, 204, 0) 0%, rgba(0, 0, 0, 0.6) 50%, rgba(0, 0, 0, 1) 100%); }

}



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

    /* HEADER */
    body.page-template-safety #header { background: var(--color-primary); }
    body.page-template-safety #header:before { opacity: 0; visibility: hidden; }
    body.page-template-safety #menu > li > ul { background: var(--color-primary); }
    body.page-template-safety #menu > li.current-menu-item > a,
    body.page-template-safety #menu > li.current-menu-ancestor > a,
    body.page-template-safety #menu > li > ul > li.current-menu-item > a, 
    body.page-template-safety #menu > li > ul > li.current-menu-ancestor > a { box-shadow: 4rem 4rem 10rem 0 rgba(222, 222, 222, 0.9) inset; }

}



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

    /* LAYOUT */
    .safety-section__head { grid-template-columns: 1fr 1fr; }
    .safety-section__head-desc + .safety-section__head-sub { margin-top: 40rem; }

    .safety-navigation { display: none; }

    /* CONE */
    .safety-cone.safety-section { padding-top: 182rem; padding-bottom: 66rem; }

    /* OVERVIEW */
    .safety-overview.safety-section { padding-bottom: 73rem; }

    .safety-overview__illust > svg { width: 2500rem; left: calc(50% + 25rem); transform: translateX(-50%); }

    /* VALUE */
    .safety-value .safety-section__head { margin-bottom: 122rem; }

    .safety-value__illust-inner { width: 2500rem; left: calc(50% - 6rem); transform: translateX(-50%); }

    /* CASE */
    .safety-case.safety-section { padding-bottom: 263rem; }

    .safety-case .safety-section__head { margin-bottom: 182rem; }

    .safety-case__list > li { gap: 102rem; padding: 0 25rem 108rem; }
    .safety-case__list-lottie { width: 320rem; }

    /* DATA */
    .safety-data.safety-section { padding-top: 150rem; }

    .safety-data .safety-section__head { margin-bottom: 172rem; }

    .safety-data__bg--large { display: none; }
    .safety-data__bg--medium { display: block; }

    .safety-data__chart { max-width: 730rem; display: flex; flex-direction: column; gap: 36rem; }
    .safety-data__chart-graphic { height: 545rem; }
    .safety-data__chart-graphic > i { right: 28rem; bottom: 35rem; }

    .safety-data__chart--task .safety-data__chart-graphic > i { width: 232rem; }
    .safety-data__chart--color .safety-data__chart-graphic > i { width: 186rem; }
    .safety-data__chart--worker .safety-data__chart-graphic > i { width: 338rem; }
    .safety-data__chart--lead .safety-data__chart-graphic > i { width: 101rem; }

    /* PORTFOLIO */
    .safety-portfolio.safety-section { padding-top: 186rem; padding-bottom: 200rem; }

    .safety-portfolio-popup__content { padding: 0 71rem; }
    .safety-portfolio-popup__actions { top: 35rem; }
    .safety-portfolio-popup__actions > * { width: 70rem; height: 70rem; }

    /* WX DESIGN */
    .safety-wxdesign__explain { padding-bottom: 140rem; }
    .safety-wxdesign__explain-inner { max-width: 1180rem; padding: 75rem 50rem; }
    .safety-wxdesign__explain-content { margin-top: 45rem; }

    .safety-wxdesign__gallery { margin-top: -160rem; }

    /* CONTACT */
    .safety-contact.safety-section { padding-top: 57rem; }

    .safety-contact .wrap-narrow { margin: 0 100rem; }

    .safety-contact .jt-form__chip > label > span { font-size: 30rem; }
    .safety-contact .jt-form__fieldset-row.jt-form__fieldset-row--custom > .jt-form__fieldset-col:last-child { margin-top: 13rem; }

    /* ENDING */
    .safety-ending__image { width: 631rem; }

}



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

    /* LAYOUT */
    body.page-template-safety #header { box-shadow: none; }

    .safety-section { padding-top: 84rem; }
    
    .safety-section__head { grid-template-columns: 1fr; gap: 20rem; margin-bottom: 65rem; }
    .safety-section__head-label { display: none; }
    .safety-section__head-title { font-size: 36rem; }
    .safety-section__head-desc { font-size: 14rem; }
    .safety-section__head-desc + .safety-section__head-desc { margin-top: 20rem; }
    .safety-section__head-sub { font-size: 12rem; font-weight: 400 }
    .safety-section__head-sub + .safety-section__head-sub { margin-top: 12rem; }
    .safety-section__head-desc + .safety-section__head-sub { margin-top: 20rem; }

    /* VISUAL */
    .safety-visual.safety-section { padding-top: 24rem; padding-bottom: 70rem; }

    .safety-visual__typo { font-size: 68rem; line-height: 1.08; font-weight: 500; }
    .safety-visual__typo--02 { margin-top: 83rem; }
    .safety-visual__typo--02 i { padding-left: 145rem; }

    .safety-visual__typo .jt-split-text--line-wrap { height: 1.12em; }
    .safety-visual__typo .jt-split-text--line-wrap:not(:first-child) { margin-top: -1rem; }

    /* CONE */
    .safety-cone.safety-section { padding-top: 120rem; padding-bottom: 45rem; }

    .safety-cone__image { width: 136rem; opacity: 1 !important; visibility: visible !important; transform: none !important; }

    /* OVERVIEW */
    .safety-overview.safety-section { padding-bottom: 31rem; }

    .safety-overview__illust > svg { width: 180vw; left: calc(50% + 12rem); }

    /* VALUE */
    .safety-value .safety-section__head { margin-bottom: 63rem; }

    .safety-value__illust-inner { width: 220vw; left: 50%; }

    .safety-value__image { margin-top: 40rem; }

    /* CASE */
    .safety-case.safety-section { padding-top: 125rem; padding-bottom: 125rem; }

    .safety-case .safety-section__head { margin-bottom: 70rem; }

    .safety-case__list { width: 100%; flex-direction: column; gap: 80rem; border: none; }
    .safety-case__list > li { width: 100%; max-width: 375rem; margin: 0 auto; padding: 0 0 37rem; gap: 28rem; }
    .safety-case__list > li:not(:last-child) { border: none; }
    .safety-case__list-question { font-size: 18rem; }
    .safety-case__list-lottie { width: 320rem; margin: 0 auto; }
    .safety-case__list-answer { left: 0; bottom: 0; font-size: 70rem; }
    .safety-case__list-answer > span:first-child { margin-bottom: -9rem; }

    /* DATA */
    .safety-data.safety-section { padding-top: 125rem; padding-bottom: 125rem; }

    .safety-data .safety-section__head { margin-bottom: 70rem; }

    .safety-data__chart { max-width: 375rem; gap: 45rem; }
    .safety-data__chart-title { margin-bottom: 10rem; font-size: 14rem; }
    .safety-data__chart-graphic { height: 243rem; border-radius: 14rem; }
    .safety-data__chart-graphic:after { opacity: 0.45; }
    .safety-data__chart-graphic > span { font-size: 70rem; }
    .safety-data__chart-graphic > i { right: 10rem; bottom: 14rem; }

    .safety-data__chart--task .safety-data__chart-graphic > span, 
    .safety-data__chart--color .safety-data__chart-graphic > span,
    .safety-data__chart--worker .safety-data__chart-graphic > span, 
    .safety-data__chart--lead .safety-data__chart-graphic > span { font-size: 70rem; top: 10rem; left: 12rem; }
    .safety-data__chart--task .safety-data__chart-graphic > i { width: 103rem; }
    .safety-data__chart--color .safety-data__chart-graphic > i { width: 82rem; }
    .safety-data__chart--worker .safety-data__chart-graphic > i { width: 150rem; }
    .safety-data__chart--lead .safety-data__chart-graphic > i { width: 44rem; }

    /* PORTFOLIO */
    .safety-portfolio { display: none; }

    .safety-portfolio-popup__bg,
    html.mac.safari .safety-portfolio-popup__bg { filter: blur(47rem); }
    .safety-portfolio-popup__content { padding: 0 42rem; }
    .safety-portfolio-popup__actions { top: 35rem; right: 21rem; }
    .safety-portfolio-popup__actions > * { width: 36rem; height: 36rem; }

    /* WX DESIGN */
    .safety-wxdesign.safety-section { padding-top: 125rem; }

    .safety-wxdesign__explain { padding-bottom: 0rem; }
    .safety-wxdesign__explain:before { width: 151%; height: 89.3%; top: 32rem; }
    .safety-wxdesign__explain-inner { max-width: inherit; margin: 0 25rem; padding: 39rem 27rem; top: 0; background: linear-gradient(180deg, #1AF91A 43.94%, #85E181 100%); border-radius: 40rem; }
    .safety-wxdesign__explain-inner:before { display: none; }
    .safety-wxdesign__explain-title { margin-bottom: 30rem; font-size: 48rem; }
    .safety-wxdesign__explain-content { margin-top: 33rem; }
    .safety-wxdesign__explain-content > b { margin-bottom: 20rem; font-size: 38rem; line-height: 1; }
    .safety-wxdesign__explain-content > p { font-size: 12rem; }
    .safety-wxdesign__explain-content > b + p { font-size: 14rem; }
    .safety-wxdesign__explain-content > p + p { margin-top: 19rem; }
    .safety-wxdesign__explain-content > ul { flex-wrap: wrap; gap: 9rem 14rem; margin: 27rem auto 37rem; }
    .safety-wxdesign__explain-content > ul > li { font-size: 18rem; }

    .safety-wxdesign__gallery { margin-top: 100rem; }
    .safety-wxdesign__gallery-item { margin: 60rem 0; }
    .safety-wxdesign__gallery-item:nth-child(1) { margin-bottom: 33rem; }
    .safety-wxdesign__gallery-item:nth-child(2) { margin-top: 33rem; }

    /* WITH US */
    .safety-withus .safety-section__head { margin-bottom: 36rem; }

    .safety-withus__partner { padding-left: 13rem; padding-right: 13rem; }

    /* CONTACT */
    .safety-contact .wrap-narrow { margin: 0 24rem; }

    .safety-contact .safety-section__head { margin-bottom: 60rem; }    

    .safety-contact .jt-form__chip > label > span { font-size: 25rem; }
    .safety-contact .jt-form__fieldset-row.jt-form__fieldset-row--custom > .jt-form__fieldset-col:last-child { margin-top: -14rem; }

    /* ENDING */
    .safety-ending.safety-section { padding-top: 150rem; padding-bottom: 150rem; }

    .safety-ending__image { width: 420rem; }

}



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

    /* LAYOUT */
    .safety-section__head { gap: 10rem; margin-bottom: 50rem; }
    .safety-section__head-title { font-size: 30rem; }
    .safety-section__head-desc { font-size: 10rem; }
    .safety-section__head-sub { font-size: 8rem; }

    /* VISUAL */
    .safety-visual.safety-section { padding-bottom: 55rem; }

    .safety-value .safety-section__head { margin-bottom: 48rem; }

    .safety-visual__bg { background-size: auto 110%; background-position: 40% 100%; }

    .safety-visual__typo { font-size: 36rem; }
    .safety-visual__typo--02 i { padding-left: 76rem; }

    /* CONE */
    .safety-cone.safety-section { padding-top: 93rem; padding-bottom: 14rem; }

    .safety-cone__image { width: 85rem; }

    /* VALUE */
    .safety-value__image { margin-top: 16rem; }

    /* CASE */
    .safety-case.safety-section { padding-bottom: 70rem; }

    .safety-case .safety-section__head { margin-bottom: 43rem; }

    .safety-case__list { gap: 50rem; }
    .safety-case__list-question { font-size: 12rem; }
    .safety-case__list-question br { display: none; }
    .safety-case__list-lottie { width: 282rem; }

    /* DATA */
    .safety-data.safety-section { padding-top: 64rem; padding-bottom: 87rem; }

    .safety-data .safety-section__head { margin-bottom: 39rem; }

    .safety-data__chart-title { margin-bottom: 5rem; font-size: 10rem }

    /* PORTFOLIO */
    .safety-portfolio-popup__content { padding: 0 37rem; }
    .safety-portfolio-popup__actions { top: 31rem; right: 24rem; }
    .safety-portfolio-popup__actions > * { width: 30rem; height: 30rem; }

    /* WX DESIGN */
    .safety-wxdesign.safety-section { padding-top: 65rem; }

    .safety-wxdesign__explain-inner { padding-top: 11rem; }
    .safety-wxdesign__explain-title { margin-bottom: 17rem; font-size: 36rem; }
    .safety-wxdesign__explain-content > b { font-size: 30rem; }
    .safety-wxdesign__explain-content > p { font-size: 10rem; }
    .safety-wxdesign__explain-content > b + p { font-size: 12rem; }
    .safety-wxdesign__explain-content > ul > li { font-size: 14rem; }

    /* CONTACT */
    .safety-contact .jt-form__chip > label > span { font-size: 18rem; }
    .safety-contact .jt-form__fieldset-row.jt-form__fieldset-row--custom > .jt-form__fieldset-col:last-child { margin-top: -10rem; }
    
    /* ENDING */
    .safety-ending.safety-section { padding-top: 90rem; padding-bottom: 90rem; }

    .safety-ending__image { width: 300rem; }
    
}