:root {
  --body: #000;
  --link: #000;
}

/*--------------------------------------------
LEDE
---------------------------------------------*/

@media screen and (max-width: 799px) {
  #lede .wrap {
    padding-top: calc( 85 * 100vw / 375 );
    padding-bottom: calc( ( 96 - 6.5 ) * 100vw / 375 );
  }

  #lede .text01 {
    margin-top: calc( ( 41 - 6.5 ) * 100vw / 375 );
  }
}

@media print, screen and (min-width: 800px) {
  #lede .wrap {
    padding-top: 87px;
    padding-bottom: calc( 83px - 10px );
  }

  #lede .text01 {
    margin-top: calc( 89px - 10px );
  }
}

/*--------------------------------------------
COMMITTED
---------------------------------------------*/

@media screen and (max-width: 799px) {
  #committed .wrap {
    padding-top: calc( 89 * 100vw / 375 );
    padding-bottom: calc( 92 * 100vw / 375 );
  }

  #committed .title02 {
    margin-top: calc( 60 * 100vw / 375 );
  }

  #committed .text01 {
    margin-top: calc( ( 37 - 6.5 ) * 100vw / 375 );
  }

  #committed .slider01 {
    margin-top: calc( ( 48 - 6.5 ) * 100vw / 375 );
  }
}

@media print, screen and (min-width: 800px) {
  #committed .wrap {
    padding-top: 163px;
    padding-bottom: 138px;
  }

  #committed .title02 {
    margin-top: 106px;
  }

  #committed .text01 {
    margin-top: calc( 51px - 9.5px );
  }

  #committed .slider01 {
    margin-top: calc( 24px - 9.5px );
  }
}

/*--------------------------------------------
SHOWER
---------------------------------------------*/

@media screen and (max-width: 799px) {
  #shower .wrap {
    padding-top: calc( 92 * 100vw / 375 );
    padding-bottom: calc( 92 * 100vw / 375 );
  }

  #shower .text01 {
    margin-top: calc( ( 37 - 6.5 ) * 100vw / 375 );
  }

  #shower .slider01 {
    margin-top: calc( ( 48 - 6.5 ) * 100vw / 375 );
  }
}

@media print, screen and (min-width: 800px) {
  #shower .wrap {
    padding-top: 141px;
    padding-bottom: 138px;
  }

  #shower .text01 {
    margin-top: calc( 51px - 9.5px );
  }

  #shower .slider01 {
    margin-top: calc( 24px - 9.5px );
  }
}

/*--------------------------------------------
WORK
---------------------------------------------*/

@media screen and (max-width: 799px) {
  #work .wrap {
    padding-top: calc( 91 * 100vw / 375 );
    padding-bottom: calc( 92 * 100vw / 375 );
  }

  #work .text01 {
    margin-top: calc( ( 37 - 6.5 ) * 100vw / 375 );
  }

  #work .slider01 {
    margin-top: calc( ( 48 - 6.5 ) * 100vw / 375 );
  }
}

@media print, screen and (min-width: 800px) {
  #work .wrap {
    padding-top: 148px;
    padding-bottom: 138px;
  }

  #work .text01 {
    margin-top: calc( 51px - 9.5px );
  }

  #work .slider01 {
    margin-top: calc( 24px - 9.5px );
  }
}

/*--------------------------------------------
DESIGNER
---------------------------------------------*/

@media screen and (max-width: 799px) {
  #designer .wrap {
    padding-top: calc( 86 * 100vw / 375 );
    padding-bottom: calc( ( 100 - 6.5 ) * 100vw / 375 );
  }

  #designer ul {
    margin-top: calc( 50 * 100vw / 375 );
  }
}

@media print, screen and (min-width: 800px) {
  #designer .wrap {
    padding-top: 170.5px;
    padding-bottom: calc( 192.5px - 10px );
  }

  #designer ul {
    margin-top: 64.5px;
  }
}

/*--------------------------------------------
HYGIENE
---------------------------------------------*/

@media screen and (max-width: 799px) {
  #hygiene .wrap {
    padding-top: calc( 76 * 100vw / 375 );
    padding-bottom: calc( 92 * 100vw / 375 );
  }

  #hygiene .text01 {
    margin-top: calc( ( 37 - 6.5 ) * 100vw / 375 );
  }

  #hygiene .slider01 {
    margin-top: calc( ( 48 - 6.5 ) * 100vw / 375 );
  }
}

@media print, screen and (min-width: 800px) {
  #hygiene .wrap {
    padding-top: 128px;
    padding-bottom: 138px;
  }

  #hygiene .text01 {
    margin-top: calc( 51px - 9.5px );
  }

  #hygiene .slider01 {
    margin-top: calc( 24px - 9.5px );
  }
}

