@charset "utf-8";

/*
 * File    : rwd-brand.css
 * Author  : STUDIO-JT
 *
 * SUMMARY :
 * 2000px
 * 1480px
 * 1200px
 * 860px
 * 540px
 */



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

    .brand-product__list-wrap { margin-left: auto; margin-right: auto; position: relative; width: 100vw; left: 50%; transform: translateX(-50%); }
    .brand-product__list { max-width: 1846rem; margin-left: auto; margin-right: auto; }
    .brand-contact__gallery { margin-left: auto; margin-right: auto; position: relative; width: 100vw; left: 50%; transform: translateX(-50%); }

}



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

    .brand-container { gap: 240rem; padding-top: 240rem; }

    .brand-point__list { gap: 90rem; margin-top: 90rem; }
    .brand-point__list-figure { width: 150rem; height: 150rem; }

    .brand-product__list { margin-left: -12rem; margin-right: -12rem; }
    .brand-product__list-inner { padding: 54rem 40rem 40rem; }
    .brand-product__list-item { width: calc(33.33% - 24rem); margin: 0 12rem; }
    .brand-product__list-figure-wrap { margin-top: 52rem; }
    .brand-product__list-desc { margin-top: 12rem; }
    .brand-product__list-icon { width: 202rem; }

    .brand-contact__gallery-item { width: 520rem; }

    /* YOGURT */
    .yogurt-content__probiotics-subtxt { font-size: 44rem; line-height: 52rem; }
    .yogurt-content__probiotics .brand-detail__content--row { gap: 12rem; }

    .brand-detail__content.yogurt-content__light { padding-bottom: 230rem; }
    .yogurt-content__light-img-wrap { width: 280rem; bottom: 60rem; }
    
    /* SOYSAUCE */
    .brand-detail__slider-content i { width: 200rem; }
    
    .soysauce-content__fermentation-line i svg { width: 1680rem; }

    .soysauce-content__fermentation-icon { width: 180rem; height: 180rem; }
    .soysauce-content__fermentation-text { gap: 16rem; }

    /* TOFU */
    .tofu-content__haccp { gap: 12rem; }

    .tofu-content__free { gap: 16rem; }
    .tofu-content__free i { width: 180rem; height: auto; }

    /* BEDDING */
    .bedding-content__febric { bottom: 80rem; }

    /* UNDERWEAR */
    .underwear-content__since-text { font-size: 200rem; }
    .underwear-content__since-num { bottom: 37rem; }

    .underwaer-content__anti { bottom: 60rem; }
    .underwaer-content__anti span { font-size: var(--font-size-en-06); line-height: var(--font-lineheight-en-06); }

    .underwear-content__list { padding: 0 80rem; }
    .underwear-content__item { width: calc(20% + 64rem); }
    .underwear-content__item:not(:first-child) { margin-left: -80rem; }

}



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

    .brand-container { gap: 200rem; padding-top: 200rem; }
    
    .brand-detail__slider-content i { width: 180rem; }

    .brand-point__list { gap: 48rem; margin-top: 70rem; }
    .brand-point__list-figure { width: 130rem; height: 130rem; }

    .brand-product__list-wrap { padding-left: 40rem; padding-right: 40rem; margin-left: -40rem; margin-right: -40rem; }
    .brand-product__list { margin-left: -10rem; margin-right: -10rem; }
    .brand-product__list-inner { padding: 44rem 30rem 30rem; }
    .brand-product__list-item { width: calc(33.33% - 20rem); margin: 0 10rem; }
    .brand-product__list-figure-wrap { margin-top: 42rem; }
    .brand-product__list-desc { margin-top: 10rem; }
    .brand-product__list-icon { width: 180rem; }
    .brand-product__list-item--regular-delivery .brand-product__list-inner { padding-bottom: 60rem; }

    .brand-contact__gallery { margin-left: -40rem; margin-right: -40rem; }
    .brand-contact__gallery-item { width: 480rem; }

    /* YOGURT */
    .yogurt-content__probiotics-subtxt { font-size: 40rem; line-height: 48rem; }
    .yogurt-content__probiotics .brand-detail__content--row { gap: 10rem; }
    .yogurt-content__probiotics .jt-scramble-txt + span { top: -5rem; }

    .brand-detail__content.yogurt-content__light { gap: 8rem; padding-bottom: 182rem; }
    .yogurt-content__light-img-wrap { width: 220rem; bottom: 48rem; }

    /* SOYSAUCE */
    .soysauce-content__fermentation-line i svg { width: 1400rem; }

    .soysauce-content__fermentation-icon { width: 150rem; height: 150rem; }
    .soysauce-content__fermentation-text { gap: 12rem; }
    .soysauce-content__fermentation .brand-detail__content--row { gap: 12rem; }

    /* TOFU */
    .tofu-content__haccp { gap: 10rem; }

    .tofu-content__free { gap: 12rem; }
    .tofu-content__free i { width: 160rem; }

    /* BEDDING */
    .bedding-content__madein { gap: 12rem; }

    .bedding-content__febric { bottom: 60rem; }
    
    /* UNDERWEAR */
    .underwear-content__since-text { font-size: 150rem; }
    .underwear-content__since-num { bottom: 27rem; }

    .underwear-content__pio .jt-typo-en--01 { font-size: var(--font-size-en-02); line-height: var(--font-lineheight-en-02); }
    
    .underwear-content__list { padding: 0 40rem; }

    .underwaer-content__anti { bottom: 40rem; }

}



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

    .brand-container { gap: 180rem; padding-top: 160rem; }

    .brand-section__control { margin-top: 40rem; }
    
    .brand-detail__sections { gap: 12rem; }
    
    .brand-detail__content { gap: 16rem; }
    .brand-detail__content span.jt-typo-en--03 { font-size: var(--font-size-en-05); line-height: var(--font-lineheight-en-05); }
    
    .brand-detail__slider-content i { width: 150rem; }

    .brand-detail__group { gap: 12rem; } 

    .brand-point__list-wrap { margin: 60rem -24rem 0; }
    .brand-point__list { margin: 0; padding: 0; gap: 0; justify-content: unset; }
    .brand-point__list-item { display: inline-block; vertical-align: top; width: auto; margin: 0 30rem; }
    .brand-point__list-figure { width: 120rem; height: 120rem; }
    .brand-point__list-item b { margin-top: 10rem; }

    .brand-product__list-wrap { padding-left: 24rem; padding-right: 24rem; margin-left: -24rem; margin-right: -24rem; }
    .brand-product__list { margin-left: -8rem; margin-right: -8rem; }
    .brand-product__list-item { width: calc(50% - 16rem); margin: 0 8rem; }
    .brand-product__list-inner { padding: 40rem 24rem 24rem; }
    .brand-product__list-desc { margin-top: 9rem; }
    .brand-product__list-figure-wrap { margin-top: 36rem; }
    .brand-product__list-icon { width: 170rem; }
    .brand-product__list .swiper-navigation .swiper-button-prev { left: -12rem; }
    .brand-product__list .swiper-navigation .swiper-button-next { right: -12rem; }

    .brand-faq .wrap { margin-left: auto; margin-right: auto; }

    .brand-contact__gallery { margin-left: -24rem; margin-right: -24rem; }
    .brand-contact__gallery-item { width: 350rem; margin-left: 6rem; margin-right: 6rem; }

    /* YOGURT */
    .yogurt-content__probiotics-subtxt { font-size: 34rem; line-height: 41rem; }
    .yogurt-content__probiotics .brand-detail__content--row { gap: 8rem; margin-left: -22rem; }
    .yogurt-content__probiotics .jt-scramble-txt + span { top: -3rem; }

    .brand-detail__content.yogurt-content__light { gap: 7rem; padding-bottom: 110rem; }
    .yogurt-content__light .jt-typo-en--02 { font-size: var(--font-size-en-03); line-height: var(--font-lineheight-en-03); }
    .yogurt-content__light .jt-typo-en--03 { font-size: var(--font-size-en-05); line-height: var(--font-lineheight-en-05); }
    .yogurt-content__light-img-wrap { width: 126rem; bottom: 38rem; }
    
    /* SOYSAUCE */
    .soysauce-content__fermentation-line i svg { width: 900rem; }

    .soysauce-content__fermentation-icon { width: 100rem; height: 100rem; }
    .soysauce-content__fermentation-text { gap: 10rem; }
    .soysauce-content__fermentation .brand-detail__content--row { gap: 10rem; }

    /* TOFU */
    .tofu-content__haccp { gap: 8rem; }

    .tofu-content__free { gap: 10rem; }
    .tofu-content__free i { width: 110rem; }
    
    /* BEDDING */
    .bedding-content__madein { gap: 10rem; }
    
    .bedding-content__pio .jt-typo-en--01 { font-size: var(--font-size-en-02); line-height: var(--font-lineheight-en-02); }
    
    .bedding-content__febric { bottom: 45rem; }
    .bedding-content__febric span.jt-typo-en--03 { font-size: var(--font-size-en-04); line-height: var(--font-lineheight-en-04) }

    /* UNDERWEAR */
    .underwear-content__since-num { bottom: 15rem; }
    .underwear-content__since-num.jt-typo-en--03 { font-size: var(--font-size-en-04); line-height: var(--font-lineheight-en-04); }
    .underwear-content__since-text { font-size: 100rem; }

    .underwear-content__pio .jt-typo-en--01 { font-size: var(--font-size-en-03); line-height: var(--font-lineheight-en-03); }
    
    .underwear-content__list { padding: 0 24rem; }
    .underwear-content__item { width: calc(20% + 32rem); }
    .underwear-content__item:not(:first-child) { margin-left: -40rem; }

    .underwaer-content__anti { bottom: 24rem; }

}



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

    .brand-container { gap: 120rem; padding-top: 100rem; }
    
    .brand-section__control { margin-top: 20rem; }
    .brand-section__control .jt-btn__basic { display: block; }

    .brand-detail__figure { padding-top: 95.56%; }
    .brand-detail__figure-parallax:has(.brand-detail__figure.jt-lazyload) { padding-top: 95.56%; }
    .brand-detail__figure.jt-lazyload.jt-lazyload--loaded img { height: 100%; object-fit: cover; }
    .brand-detail__content { gap: 8rem; }
    .brand-detail__content span.jt-typo-en--03 { font-size: var(--font-size-en-05); line-height: var(--font-lineheight-en-05); }

    .brand-detail__slider-container { padding-top: 95.56%; }
    .brand-detail__slider-content i { width: 140rem; }

    .brand-detail__group { flex-direction: column; }
    .brand-detail__group-item { width: 100%; }
    .brand-detail__group-item:has(.brand-detail__content) { padding-top: 95.56%; }
    .brand-detail__group-item .brand-detail__content { position: absolute; top: 0; left: 0; }

    .brand-point__list-wrap { margin-top: 40rem; margin: 40rem -21rem 0; }
    .brand-point__list-item { margin: 0 24rem; }
    .brand-point__list-figure { width: 100rem; height: 100rem; }
    .brand-point__list-item b { margin-top: 8rem; }
    
    .brand-product__list-wrap { padding-left: 21rem; padding-right: 21rem; margin-left: -21rem; margin-right: -21rem; }
    .brand-product__list { margin-left: auto; margin-right: auto; }
    .brand-product__list .swiper-wrapper { flex-direction: column; gap: 16rem; }
    .brand-product__list-item { width: 100%; margin: 0; }
    .brand-product__list-inner { padding: 30rem 9rem 22rem; }
    .brand-product__list-figure-wrap { margin-top: 32rem; }
    .brand-product__list-desc { margin-top: 8rem; }
    .brand-product__list-icon { width: 150rem; }
    .brand-product__list-item--regular-delivery { padding-top: 124.14%; }
    .brand-product__list-item--regular-delivery .brand-product__list-inner { position: absolute; top: 0; left: 0; padding: 0 20rem 40rem; }
    .brand-product__list-item--regular-delivery .brand-product__list-btn { bottom: 46rem; }

    .brand-product-list--secondary .brand-product__list-inner { padding: 30rem 21rem 21rem; }
    
    .brand-contact__gallery { margin-left: -21rem; margin-right: -21rem; }
    .brand-contact__gallery-item { width: 292rem; margin-left: 4rem; margin-right: 4rem; }

    /* YOGURT */
    .yogurt-content__probiotics-subtxt { font-size: 32rem; line-height: 38rem; }
    .yogurt-content__probiotics .brand-detail__content--row { gap: 6rem; }
    .yogurt-content__probiotics .jt-scramble-txt + span { top: -2rem; }

    /* SOYSAUCE */
    .soysauce-content__fermentation-line i svg { width: 700rem; }

    .soysauce-content__fermentation-text { gap: 8rem; }
    .soysauce-content__fermentation .brand-detail__content--row { gap: 8rem; }

    .soysauce-content__tn .soysauce-content__tn-tag { padding: 4rem 32rem; }

    /* TOFU */
    .tofu-content__haccp { gap: 6rem; }

    .tofu-content__free { gap: 6rem; }
    .tofu-content__free i { width: 100rem; }

    /* BEDDING */
    .bedding-content__madein { gap: 8rem; padding: 0 24rem; }

    /* UNDERWEAR */
    .underwear-content__since-text { font-size: 80rem; }
    .underwear-content__since-num { bottom: 14rem; }
    .underwear-content__since-num.jt-typo-en--03 { font-size: var(--font-size-en-05); line-height: var(--font-lineheight-en-05); }

    .underwear-content__pio .jt-typo-en--01 { font-size: var(--font-size-en-02); line-height: var(--font-lineheight-en-02); }

    .underwear-content-wrapper { margin: 0 -21rem; overflow: hidden; }
    .underwear-content__list { position: relative; top: auto; left: auto; transform: none; width: auto; display: block; padding: 0 21rem; margin: 0; white-space: nowrap; overflow-x: scroll; overflow-y: hidden; }
    .underwear-content__list::-webkit-scrollbar { display: none; }
    .underwear-content__item { display: inline-block; width: calc(50% + 18rem); }
    .underwear-content__item figure { margin-bottom: 12rem; }
    .underwear-content__bg { display: none; }
    
}