@charset "UTF-8";
/*--------------------------------------------
FEATURE TEACHINGS
---------------------------------------------*/
#featureTeaching02{
  @media screen and ( width <= 768px ){
    margin-top : calc( 32 * var(--remBase ) );
    h2{
      text-align: right;
    }
    picture{
      margin-block : calc( 12 * var(--remBase ) );
      margin-right : calc( -10 * var(--contentBase ) );
      img{
        width: 100%;
        height: auto;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 71 * var(--remBase ) );
    display: grid;
    grid-template-columns: auto calc( 928 * var(--contentBase) );
    justify-content: space-between;
    align-items: start;
    grid-template-rows: auto 1fr;
    row-gap : calc( 5 * var(--remBase ) );
    h2{
      grid-column: 2;
      grid-row: 1;
      text-align: center;
    }
    picture{
      grid-column: 1;
      grid-row: 1/3;
      align-self: center;
    }
    img{
      height : calc( 237 * var(--remBase ) );
    }
    .texts{
      grid-column: 2;
      grid-row: 2;
    }
  }
}
#featureTeaching03{
  @media screen and ( width <= 768px ){
    margin-top : calc( 32 * var(--remBase ) );
    > picture{
      margin-block : calc( 12 * var(--remBase ) );
      margin-left : calc( -10 * var(--contentBase ) );
      img{
        width: 100%;
        height: auto;
      }
    }
    .box{
      margin-top : calc( 20 * var(--remBase ) );
      picture{
        float: right;
        margin-left : calc( 10 * var(--remBase ) );
      }
      img{
        height : calc( 80 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    position: relative;
    margin-top : calc( 100 * var(--remBase ) );
    display: grid;
    grid-template-columns: 1fr calc( 900 * var(--contentBase) ) calc( 40 * var(--contentBase) ) auto;
    grid-template-rows: auto calc( 13 * var(--remBase) ) calc( 26 * var(--remBase) ) auto auto auto;
    h2{
      grid-column: 2;
      grid-row: 1;
      justify-self: center;
    }
    > picture{
      grid-column: 3/5;
      grid-row: 2/-1;
      align-self: start;
      img{
        height : calc( 314 * var(--remBase ) );
      }
    }
    > p{
      &:nth-of-type(1){
        grid-row: 4;
        grid-column: 2;
      }
      &:nth-of-type(2){
        grid-row: 5;
        grid-column: 2;
      }
    }
    .box{
      grid-column: 2/4;
      grid-row: 6;
      padding-top : calc( 21 * var(--remBase ) );
      display: grid;
      grid-template-columns: calc( 644 * 100% / 940 ) calc( 40 * 100% / 940 ) calc( 20 * 100% / 940 ) auto;
      position: relative;
      picture{
        grid-column: 4;
        grid-row: 1/-1;
        align-self: start;
        img{
          height : calc( 191 * var(--remBase ) );
        }
      }
      p:nth-of-type(1){
        grid-column: 1;
        grid-row: 1;
        padding-top: 0.5em;
      }
      p:nth-of-type(2){
        grid-column: 1/3;
        grid-row: 2;
      }
    }
  }
}
#featureTeaching04{
  @media screen and ( width <= 768px ){
    margin-top : calc( 32 * var(--remBase ) );
    h2{
      text-align: right;
    }
    picture{
      margin-block : calc( 12 * var(--remBase ) );
      margin-right : calc( -10 * var(--contentBase ) );
      img{
        width: 100%;
        height: auto;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 63 * var(--remBase ) );
    display: grid;
    grid-template-columns: 1fr auto calc( 916 * var(--contentBase ) );
    column-gap : calc( 40 * var(--contentBase ) );
    grid-template-rows: auto 1fr;
    row-gap : calc( 36 * var(--remBase ) );
    picture{
      grid-column: 2;
      grid-row: 1/-1;
      align-self: start;
      img{
        height : calc( 261 * var(--remBase ) );
      }
    }
    h2{
      grid-row: 1;
      grid-column: 3;
      text-align: center;
    }
    .texts{
      grid-row: 2;
      grid-column: 3;
    }
  }
}
#featureTeaching05{
  @media screen and ( width <= 768px ){
    margin-top : calc( 32 * var(--remBase ) );
    h2{
      text-align: right;
    }
    picture{
      margin-block : calc( 12 * var(--remBase ) );
      margin-left : calc( -10 * var(--contentBase ) );
      img{
        width: 100%;
        height: auto;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 94 * var(--remBase ) );
    display: grid;
    grid-template-columns: calc( 912 * var(--contentBase) ) auto;
    grid-template-rows: auto  calc( 50 * var(--remBase) ) 1fr;
    justify-content: center;
    column-gap : calc( 40 * var(--contentBase ) );
    h2{
      grid-column: 1;
      text-align: center;
      grid-row: 1;
    }
    picture{
      grid-column: 2;
      grid-row: 2/-1;
      align-self: start;
      img{
        height : calc( 291 * var(--remBase ) );
      }
    }
    .texts{
      grid-column: 1;
      grid-row: 3;
    }
  }
}
#featureTeaching06{
  @media screen and ( width <= 768px ){
    margin-top : calc( 32 * var(--remBase ) );
    p{
      margin-top: 1lh;
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 120 * var(--remBase ) );
    width : calc( 1362 * var(--contentBase ) );
    margin-inline : auto;
    display: grid;
    grid-template-columns: repeat( 2 , 50% );
    row-gap : calc( 22 * var(--remBase ) );
    h2{
      grid-column: 2;
      text-align: center;
      grid-row: 1;
    }
    p{
      grid-column: 1/-1;
      grid-row: 2;
    }
  }
}
#featureTeaching07{
  @media screen and ( width <= 768px ){
    margin-top : calc( 32 * var(--remBase ) );
    h2{
      text-align: center;
    }
    p{
      margin-top: 1lh;
    }
    div{
      margin-top : calc( 20 * var(--remBase ) );
      img{
        display: block;
        margin-inline : auto;
        &:nth-of-type(1){
          height : calc( 32 * var(--remBase ) );
        }
        &:nth-of-type(2){
          margin-top : calc( 16 * var(--remBase ) );
          height : calc( 68 * var(--remBase ) );
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 42 * var(--remBase ) );
    display: grid;
    grid-template-columns: calc( 632 * var(--contentBase) ) auto;
    column-gap : calc( 20 * var(--contentBase ) );
    grid-template-rows: auto calc( 36 * var(--remBase)  ) calc( 13 *  var(--remBase) ) 1fr;
    justify-content: center;
    h2{
      grid-row: 1;
      grid-column: 1;
      text-align: center;
    }
    p:nth-of-type(1){
      grid-column: 1;
      grid-row: 4;
    }
    div{
      grid-column: 2;
      grid-row:3/-1;
      align-self: start;
      img{
        &:nth-of-type(1){
          height : calc( 73 * var(--remBase ) );
          display: block;
          margin-left : calc( 20 * var(--remBase ) );
        }
        &:nth-of-type(2){
          display: block;
          margin-top : calc( 28 * var(--remBase ) );
          height : calc( 182 * var(--remBase ) );
        }
      }
    }
  }
}
#featureTeachings .contentAuthor{
  @media screen and ( width <= 768px ){
    text-align: center;
    margin-top : calc( 10 * var(--remBase ) );
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 31 * var(--remBase ) );
  }
}
/*--------------------------------------------
FEATURES FACILITY
---------------------------------------------*/
#featurefacility02{
  @media screen and ( width <= 768px ){
    margin-top : calc( 10 * var(--remBase ) );
    picture{
      margin-top : calc( 6 * var(--remBase ) );
      width : calc( 280 * var(--contentBase ) );
      margin-inline : auto;
      img{
        width: 100%;
        height: auto;
      }
    }
    p{
      margin-top : calc( 20 * var(--remBase ) );
      margin-inline : calc( -5 * var(--contentBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 28 * var(--remBase ) );
    grid-column: 1/-1;
    grid-row: 2;
    picture{
      height : calc( 702 * var(--remBase ) );
      position: relative;
      width: 100%;
      overflow: visible;
      margin-top : calc( 22 * var(--remBase ) );
      img{
        position: absolute;
        height: 100%;
        left: 50%;
        translate: -50% 0;
      }
    }
    p{
      text-align: center;
      margin-top : calc( 13 * var(--remBase ) );
    }
  }
}
#featurefacility03{
  display: grid;
  grid-template-columns: auto auto;
  @media screen and ( width <= 768px ){
    margin-top : calc( 8 * var(--remBase ) );
    justify-content: start;
    column-gap : calc( 20 * var(--contentBase ) );
    img{
      height : calc( 141 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 55 * var(--remBase ) );
    justify-content: center;
    column-gap : calc( 64 * var(--contentBase ) );
    img{
      height : calc( 405 * var(--remBase ) );
    }
  }
}
#featurefacility04{
  @media screen and ( width <= 768px ){
    margin-top : calc( 24 * var(--remBase ) );
    display: grid;
    grid-template-rows: 1fr auto auto auto 1fr auto;
    grid-template-columns: 1fr calc( 120 * var(--contentBase) );
    column-gap : calc( 10 * var(--contentBase ) );
    row-gap : calc( 8 * var(--remBase ) );
    align-items: start;
    > div{
      display: contents;
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    margin-top : calc( 63 * var(--remBase ) );
    grid-template-columns: calc( 247 * var(--contentBase) ) calc( 700 * var(--contentBase) );
    justify-content: space-between;
  }
}
#featurefacility0401{
  @media screen and ( width <= 768px ){
    h2{
      grid-column: 1;
      grid-row: 2;
      justify-content: start;
    }
    picture{
      grid-column: 2;
      grid-row: 1/6;
      img{
        width: 100%;
        height: auto;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    picture{
      margin-top : calc( 8 * var(--remBase ) );
    }
    img{
      width: 100%;
      height: auto;
    }
  }
}
#featurefacility0402{
  dl{
    display: grid;
    align-items: start;
    justify-content: start;
  }
  @media screen and ( width <= 768px ){
    p, dl{
      grid-column: 1;
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.5;
    }
    p{
      grid-row: 3;
    }
    dl{
      grid-row: 4;
      grid-template-columns: auto 1fr;
    }
    iframe{
      grid-column: 1/-1;
      grid-row: 6;
      width: 100%;
      height: auto;
      aspect-ratio: 600/450;
    }
  }
  @media print,screen and ( width > 768px ){
    padding-top : calc( 58 * var(--remBase ) );
    iframe{
      aspect-ratio: 700/308;
      width: 100%;
      height: auto;
    }
    p,dl{
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
      padding-left : calc( 160 * 100% / 700 );
    }
    p{
      margin-top : calc( 8 * var(--remBase ) );
    }
    dl{
      grid-auto-flow: column;
    }
  }
}
#featurefacilities .contentAuthor{
  @media screen and ( width <= 768px ){
    margin-top : calc( 10 * var(--remBase ) );
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 52 * var(--remBase ) );
  }
}
/*--------------------------------------------
SUMMER  OR WINTER
---------------------------------------------*/
#summer02 , #highSchoolWinter03{
  background : url( "../images/ui/bg/season02.avif" ) center / cover no-repeat;
  display: grid;
  align-content: center;
  justify-content: center;
  grid-auto-flow: row;
  h2 , p{
    text-align: center;
  }
  h2{
    font-weight: 400;
    color:#E83131;
  }
  p{
    color:#f3e598;
    font-family: "Noto Serif JP", serif;
    + p{
      margin-top: 1.5lh;
    }
  }
  @media screen and ( width <= 768px ){
    min-height : calc( 340 * var(--remBase ) );
  }
  @media print,screen and ( width > 768px ){
    min-height : calc( 1037 * var(--remBase ) );
  }
}
#summer03 , #highSchoolWinter04{
  background-repeat: no-repeat;
  background-image: url("../images/ui/bg/season03.avif");
  h2{
    font-weight: 400;
    text-align: center;
    color:#9e8c28;
  }
  h3{
    font-weight: 400;
    display: flex;
    flex-wrap: wrap;
    column-gap: 1em;
  }
  li{
    background-color: #f9f0bb;
  }
  @media screen and ( width <= 768px ){
    min-height: calc( 489 * var(--remBase) );
    background-size: auto calc( 489 * var(--remBase) );
    margin-top : calc( 10 * var(--remBase ) );
    padding-top : calc( 8 * var(--remBase ) );
    padding-bottom : calc( 26 * var(--remBase ) );
    h2{
      font-size : calc( 14 * var(--remBase ) );;
      line-height : 1.5;
    }
    ul{
      margin-top : calc( 7 * var(--remBase ) );
      padding-inline : calc( 10 * var(--contentBase ) );
    }
    li + li{
      margin-top : calc( 12 * var(--remBase ) );
    }
    li{
      border-radius : calc( 30 * var(--remBase ) ) 0 calc( 20 * var(--remBase ) ) 0;
      padding-top : calc( 10 * var(--remBase ) );
      padding-bottom : calc( 7 * var(--remBase ) );
      padding-inline : calc( 19.5 * 100% / 970 );
    }
    h3{
      font-size : calc( 12 * var(--remBase ) );;
      line-height : 1.5;
      margin-bottom : calc( 11 * var(--remBase ) );
    }
    p{
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.5;
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 83 * var(--remBase ) );
    padding-top : calc( 39 * var(--remBase ) );
    padding-bottom : calc( 39 * var(--remBase ) );
    background-size: auto calc( 800 * var(--remBase) );
    background-position: center;
    min-height: calc( 800 * var(--remBase) );
    h2{
      font-size : calc( 50 * var(--remBase ) );;
      line-height : 1.52;
    }
    ul{
      margin-top : calc( 11 * var(--remBase ) );
      padding-inline : calc( 5 * var(--contentBase ) );
    }
    li + li{
      margin-top : calc( 31 * var(--remBase ) );
    }
    li{
      border-radius : calc( 30 * var(--remBase ) ) 0 calc( 20 * var(--remBase ) ) 0;
      padding-top : calc( 8 * var(--remBase ) );
      padding-bottom : calc( 19 * var(--remBase ) );
      padding-inline : calc( 19.5 * 100% / 970 );
    }
    h3{
      font-size : calc( 25 * var(--remBase ) );;
      line-height : 1.52;
      margin-bottom : calc( 9 * var(--remBase ) );
      padding-left: 1em;
    }
    p{
      font-size : calc( 20 * var(--remBase ) );;
      line-height : 1.45;
    }
  }
}
#summer04 , #highSchoolWinter05{
  p{
    text-align: center;
    + p{
      margin-top: 1lh;
    }
  }
  @media screen and ( width <= 768px ){
    padding-top : calc( 42 * var(--remBase ) );
    p{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 20 / 11 );;
    }
  }
  @media print,screen and ( width > 768px ){
    padding-top : calc( 59 * var(--remBase ) );
    padding-bottom : calc( 49 * var(--remBase ) );
    p{
      font-size : calc( 30 * var(--remBase ) );;
      line-height : 1.8;
    }
  }
}
/*--------------------------------------------
PREPARATORY
---------------------------------------------*/
#preparatory02{
  background-color: color-mix( in srgb , #009df0 14% , transparent );
  h2{
    background-color: #1582c8;
    color:white;
    display: grid;
    place-items:center;
    font-weight: 400;
  }
  hgroup{
    font-weight: 700;
    color:#003399;
    display: grid;
    grid-auto-flow: column;
    align-items: baseline;
    justify-content: start;
    p:before{
      padding-inline: .5em;
    }
  }
  .box{
    p + p{
      margin-top: 1lh;
    }
  }
  @media screen and ( width <= 768px ){
    padding-bottom : calc( 9 * var(--remBase ) );
    h2{
      height : calc( 38 * var(--remBase ) );
      font-size : calc( 13 * var(--remBase ) );
      margin-bottom : calc( 5 * var(--remBase ) );
    }
    > ul{
      padding-inline : calc( 10 * var(--contentBase ) );
      margin-top : calc( 17 * var(--remBase ) );
      > li{
        + li{
          margin-top : calc( 15 * var(--remBase ) );
        }
      }
    }
    hgroup{
      h3{
        font-size : calc( 12 * var(--remBase ) );;
        line-height : 1.5;
      }
      p{
        font-size : calc( 7 * var(--remBase ) );;
        line-height : calc( 11 / 7 );;
      }
    }
    .box p{
      font-size : calc( 9 * var(--remBase ) );;
      line-height : calc( 14 / 9 );;
    }
  }
  @media print,screen and ( width > 768px ){
    position: relative;
    padding-bottom : calc( 20 * var(--remBase ) );
    h2{
      position: relative;
      height : calc( 100 * var(--remBase ) );
      font-size : calc( 40 * var(--remBase ) );
      margin-bottom : calc( 24 * var(--remBase ) );
    }
    hgroup{
      h3{
        font-size : calc( 30 * var(--remBase ) );;
        line-height : calc( 46 / 30 );;
      }
      p{
        font-size : calc( 22 * var(--remBase ) );;
        line-height : calc( 34 / 22 );;
      }
    }
    .box p{
      font-size : calc( 18 * var(--remBase ) );;
      line-height : 1.5;
    }
    > ul{
      margin-top : calc( 40 * var(--remBase ) );
      > li + li{
        margin-top : calc( 70 * var(--remBase ) );
      }
    }
  }
  @media screen and ( 768px < width < 1424px ){
    > ul{
      padding-inline: calc( 20 * var(--viewportBase) );
    }
  }
  @media screen and ( width >= 1424px ){
    > ul{
      padding-inline: calc( 308 * 100% / 2000 );
    }
  }
}
#preparatory0201{
  @media screen and ( width <= 768px ){
    .box{
      margin-top : calc( 17 * var(--remBase ) );
      picture{
        float: right;
        margin-top : calc( 20 * var(--remBase ) );
        margin-left : calc( 10 * var(--remBase ) );
        img{
          height : calc( 46 * var(--remBase ) );
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    max-width: 2000px;
    margin-inline : auto;
    hgroup{
      h3{
        padding-left: 1em;
      }
    }
    .box{
      column-gap : calc( 24 * var(--contentBase) );
      display: grid;
      grid-template-columns: calc( 852 * var(--contentBase) )  auto;
      justify-content: start;
      align-items: center;
      margin-top : calc( 50 * var(--remBase ) );
      picture{
        grid-column: 2;
        grid-row: 1;
        img{
          height : calc( 232 * var(--remBase ) );
        }
      }
      > div{
        grid-column: 1;
        grid-row: 1;
      }
    }
  }
}
#preparatory0202{
  @media screen and ( width <= 768px ){
    .box{
      margin-top : calc( 6 * var(--remBase ) );
      picture{
        float: left;
        margin-top : calc( 7 * var(--remBase ) );
        margin-right : calc( 10 * var(--remBase ) );
        img{
          height : calc( 68 * var(--remBase ) );
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto 1fr;
    column-gap : calc( 24 * var(--contentBase ) );
    row-gap : calc( 21 * var(--remBase ) );
    hgroup{
      h3{
        padding-left: 1em;
      }
      grid-row: 1;
      grid-column: 1;
    }
    .box{
      display: contents;
      picture{
        grid-column: 2;
        grid-row: 1/-1;
        align-self: center;
        img{
          height : calc( 311 * var(--remBase ) );
        }
      }
      > div{
        grid-column: 1;
        grid-row: 2;
      }
    }
  }
}
#preparatory0203{
  @media screen and ( width <= 768px ){
    .box{
      margin-top : calc( 8 * var(--remBase ) );
      display: grid;
      grid-template-columns: 1fr auto;
      column-gap : calc( 10 * 100% / 280 );
      align-items: center;
      > div{
        display: contents;
      }
      p:nth-of-type(1){
        grid-column: 1/-1;
        grid-row: 1;
      }
      p:nth-of-type(2){
        grid-column: 1;
        grid-row: 2;
      }
      picture{
        grid-column: 2;
        grid-row: 2;
        img{
          height : calc( 65 * var(--remBase ) );
        }
      }
      p:nth-of-type(3){
        grid-column: 1/-1;
        grid-row: 3;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto 1fr;
    column-gap : calc( 24 * var(--contentBase ) );
    row-gap : calc( 33 * var(--remBase ) );
    align-items: start;
    hgroup{
      h3{
        padding-left: 1em;
      }
      grid-row: 1;
      grid-column: 2;
    }
    .box{
      display: contents;
      picture{
        grid-column: 1;
        grid-row: 1/-1;
        align-self: start;
        img{
          height : calc( 421 * var(--remBase ) );
        }
      }
      > div{
        grid-column: 2;
        grid-row: 2;
      }
    }
  }
}
#preparatory0204{
  @media screen and ( width <= 768px ){
    .box{
      margin-top : calc( 15 * var(--remBase ) );
      picture{
        float: right;
        margin-top : calc( 7 * var(--remBase ) );
        margin-left : calc( 10 * var(--remBase ) );
        img{
          height : calc( 55 * var(--remBase ) );
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    grid-template-columns: calc( 821 * var(--contentBase) ) auto;
    justify-content: start;
    grid-template-rows: auto 1fr;
    column-gap : calc( 72 * var(--contentBase ) );
    row-gap : calc( 20 * var(--remBase ) );
    hgroup{
      grid-row: 1;
      grid-column: 1;
    }
    .box{
      display: contents;
      picture{
        grid-column: 2;
        grid-row: 1/-1;
        align-self: center;
        img{
          height : calc( 223 * var(--remBase ) );
        }
      }
      > div{
        grid-column: 1;
        grid-row: 2;
      }
    }
  }
}
#preparatory0205{
  @media screen and ( width <= 768px ){
    position: relative;
    .box{
      margin-top : calc( 11 * var(--remBase ) );
    }
    picture:nth-of-type(1){
      position: absolute;
      top: 0;
      right: 0;
      img{
        height : calc( 59 * var(--remBase ) );
      }
    }
    .box{
      p:nth-of-type(1){
        width : calc( 162 * 100% / 280 );
      }
    }
    picture:nth-of-type(2){
      text-align: center;
      width: fit-content;
      margin-inline : auto;
      margin-top : calc( 13 * var(--remBase ) );
      img{
        height : calc( 71 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    grid-template-columns: auto 1fr auto;
    column-gap : calc( 24 * var(--contentBase ) );
    grid-template-rows: auto calc( 33 * var(--remBase) ) auto calc( 20 * var(--remBase) ) 1fr;
    h3{
      grid-column: 2;
      grid-row:1;
    }
    picture:nth-of-type(1){
      grid-column: 1;
      grid-row: 1/-1;
      align-self: start;
      img{
        height : calc( 252 * var(--remBase ) );
      }
    }
    .box{
      display: contents;
      > p{
        &:nth-of-type(1){
          grid-row: 3;
          grid-column: 2/-1;
        }
        &:nth-of-type(2){
          grid-row: 5;
          grid-column: 2;
          align-self: start;
        }
      }
    }
    picture:nth-of-type(2){
      grid-column: 3;
      grid-row: 5;
      img{
        height : calc( 222 * var(--remBase ) );
      }
    }
  }
}
#preparatory0206{
  @media screen and ( width <= 768px ){
    .box{
      position: relative;
      margin-top : calc( 21 * var(--remBase ) );
      picture{
        position: absolute;
        right: 0;
        bottom: 0;
        margin-bottom : calc( 24 * var(--remBase ) );
        img{
          height : calc( 49 * var(--remBase ) );
        }
      }
      p:last-of-type , p:nth-last-of-type(2){
        width : calc( 126 * 100% / 280 );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    .box{
      margin-top : calc( 34 * var(--remBase ) );
      display: grid;
      grid-template-columns: 1fr auto;
      column-gap : calc( 24 * var(--contentBase ) );
      align-items: center;
      picture{
        grid-column: 2;
        grid-row:1;
      }
      img{
        height : calc( 256 * var(--remBase ) );
      }
      > div{
        grid-column: 1;
        grid-row: 1;
      }
    }
  }
}
#preparatory0207{
  em{
    color:#FF4040;
    font-weight: 700;
  }
  @media screen and ( width <= 768px ){
    display: grid;
    grid-auto-flow: row;
    hgroup{
      grid-row: 1;
    }
    .box{
      margin-top : calc( 15 * var(--remBase ) );
      grid-row: 2;
    }
    h4{
      grid-row: 3;
      margin-top : calc( 11 * var(--remBase ) );
      display: grid;
      grid-template-columns: auto auto;
      justify-content: center;
      align-items: center;
      grid-template-rows: 1fr auto;
      column-gap : calc( 10 * 100% / 280 );
      &:before{
        content:"";
        display: block;
        background : url( "../images/preparatory/bg07.avif" ) center top / contain no-repeat;
        margin-inline : auto;
        aspect-ratio: 513/131;
        height : calc( 10 * var(--remBase ) );
        width: auto;
        grid-column: 2;
        grid-row: 2;
        justify-content: center;
        margin-top : calc( -4 * var(--remBase ) );
      }
      img:nth-of-type(1){
        grid-column: 1;
        grid-row: 1;
        height : calc( 35 * var(--remBase ) );
      }
      img:nth-of-type(2){
        grid-column: 2;
        grid-row: 1;
        height : calc( 35 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    grid-template-columns: 1fr auto 1fr calc( 748 * var(--contentBase) );
    grid-template-rows: auto 1fr;
    row-gap : calc( 17 * var(--remBase ) );
    align-items: center;
    hgroup{
      grid-column: 4;
      grid-row: 1;
      h3{
        margin-left: -1em;
      }
    }
    h4{
      grid-row: 1/-1;
      align-self: center;
      grid-column: 2;
      text-align: center;
      display: grid;
      grid-auto-flow: row;
      &:before{
        content:"";
        display: block;
        background : url( "../images/preparatory/bg07.avif" ) center top / contain no-repeat;
        margin-inline : auto;
        aspect-ratio: 513/131;
        height : calc( 72 * var(--remBase ) );
        width: auto;
        order:2;
      }
      img{
        display: block;
        margin-inline : auto;
      }
      img:nth-of-type(1){
        height : calc( 112 * var(--remBase ) );
        order:1;
      }
      img:nth-of-type(2){
        height : calc( 120 * var(--remBase ) );
        margin-top : calc( -40 * var(--remBase ) );
        order:3;
      }
    }
    .box{
      grid-column:4;
      grid-row: 2;
    }
    em{
      font-size : calc( 23 * var(--remBase ) );
    }
  }
}
#preparatory02 aside{
  p{
    font-weight: 700;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 24 * var(--remBase ) );
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: 1fr auto auto auto 1fr;
    h3 , p{
      grid-column: 1;
      text-align: center;
    }
    h3{
      grid-row: 3;
      font-size : calc( 8 * var(--remBase ) );;
      line-height : 1.5;
    }
    p{
      grid-row: 4;
      font-size : calc( 6 * var(--remBase ) );;
      line-height : 1.5;
    }
    picture{
      grid-column: 2;
      grid-row: 1/-1;
      img{
        height : calc( 76 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    align-items: start;
    grid-template-rows: 1fr auto auto;
    grid-template-columns: 1fr auto auto calc( 52 * var(--contentBase) );
    column-gap : calc( 24 * var(--contentBase ) );
    margin-top : calc( 40 * var(--remBase ) );
    h3{
      grid-column: 2;
      grid-row: 2;
      font-size : calc( 20 * var(--remBase ) );;
      line-height : 1.55;
    }
    p{
      font-size : calc( 15 * var(--remBase ) );;
      line-height : calc( 23 / 15 );;
      grid-column: 2;
      grid-row: 3;
      text-align: center;
      padding-bottom : calc( 16 * var(--remBase ) );
    }
    picture{
      grid-row: 1/-1;
      grid-column: 3;
    }
    img{
      height : calc( 253 * var(--remBase ) );
    }
  }
}
#preparatory03{
  h2{
    text-align: center;
  }
  hgroup , > ul > li > h3{
    display: grid;
    align-items: center;
    justify-content: start;
    background-color: #00cc99;
    align-content: center;
    position: relative;
    grid-auto-flow: column;
    &:after{
      content:"";
      display: block;
      position: absolute;
      left: 0;
      width: 100%;
      height: 0;
      top: 50%;
      translate: 0 -50%;
      border-block-style: dashed;
      border-block-color :#F7EBD5;
    }
  }
  h3{
    font-weight: 700;
    color:#F7EBD5;
  }
  hgroup{
    p{
      color:#F7EBD5;
      font-weight: 700;
      padding-left: 1em;
    }
  }
  .box{
    p + p{
      margin-top: 1lh;
    }
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 18 * var(--remBase ) );
    h2{
      img{
        height : calc( 24 * var(--remBase ) );
      }
    }
    > ul{
      margin-top : calc( 2 * var(--remBase ) );
      > li + li{
        margin-top : calc( 27 * var(--remBase ) );
      }
    }
    hgroup , > ul > li > h3{
      margin-inline : auto;
      height : calc( 28 * var(--remBase ) );
      padding-inline : calc( 4 * var(--contentBase ) );
      &:after{
        height: calc( 100% - 2 * var(--remBase) );
        border-block-width: calc( 1 * var(--remBase) );
      }
    }
    h3{
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.5;
    }
    hgroup{
      p{
        font-size : calc( 8 * var(--remBase ) );;
        line-height : 1.25;
      }
    }
    .box{
      p , ul{
        font-size : calc( 9 * var(--remBase ) );;
        line-height : calc( 14 / 9 );;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    max-width: 2000px;
    margin-inline : auto;
    margin-top : calc( 17 * var(--remBase ) );
    h2{
      img{
        height : calc( 67 * var(--remBase ) );
      }
    }
    > ul{
      margin-top : calc( 32 * var(--remBase ) );
      > li + li{
        margin-top : calc( 65 * var(--remBase ) );
      }
    }
    hgroup , > ul > li > h3{
      width : calc( 700 * 100% / 1372 );
      height : calc( 68 * var(--remBase ) );
      &:after{
        height : calc( 100% - 8 * var(--remBase ) );
        border-block-width: calc( 2 * var(--remBase) );
      }
    }
    h3{
      font-size : calc( 25 * var(--remBase ) );;
      line-height : 1.52;
    }
    hgroup{
      p{
        font-size : calc( 20 * var(--remBase ) );;
        line-height : 1.55;
      }
    }
    .box{
      p , ul{
        font-size : calc( 18 * var(--remBase ) );;
        line-height : 1.5;
      }
    }
  }
  @media screen and ( 768px < width < 1414px ){
    > ul{
      padding-inline: calc( 20 * var(--viewportBase) );
    }
  }
  @media screen and ( width >= 1414px ){
    > ul{
      padding-inline: calc( 314 * 100% / 2000 );
    }
  }
}
#preparatory0301{
  @media screen and ( width <= 768px ){
    .box{
      margin-top : calc( 24 * var(--remBase ) );
      picture{
        float: right;
        margin-left : calc( 10 * var(--contentBase ) );
        img{
          height : calc( 72 * var(--remBase ) );
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    .box{
      margin-top : calc( 12 * var(--remBase ) );
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: center;
      column-gap : calc( 24 * 100% / 1374 );
      picture{
        order:2;
      }
      img{
        height : calc( 288 * var(--remBase ) );
      }
    }
  }
}
#preparatory0302{
  @media screen and ( width <= 768px ){
    .box{
      display: grid;
      margin-top : calc( 32 * var(--remBase ) );
      grid-template-columns: 1fr auto;
      column-gap : calc( 10 * var(--contentBase ) );
      align-items: center;
      > div{
        display: contents;
      }
      p:not(:nth-of-type(2)){
        grid-column: 1/-1;
      }
      p:nth-of-type(2){
        grid-column: 1;
        margin-top: 0;
      }
      picture{
        grid-column: 2;
        grid-row: 2;
        img{
          height : calc( 97 * var(--remBase ) );
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    .box{
      margin-top : calc( 36 * var(--remBase ) );
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: start;
      column-gap : calc( 24 * 100% / 1374 );
      picture{
        order:2;
      }
      img{
        height : calc( 266 * var(--remBase ) );
      }
    }
  }
}
#preparatory0303{
  @media screen and ( width <= 768px ){
    .box{
      margin-top : calc( 28 * var(--remBase ) );
    }
    picture{
      margin-top : calc( 10 * var(--remBase ) );
      img{
        width: 100%;
        height: auto;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    grid-template-columns: calc( 764 * 100% / 1374 ) 1fr auto;
    justify-content: space-between;
    grid-template-rows: auto 1fr;
    row-gap : calc( 10 * var(--remBase ) );
    hgroup{
      grid-column: 1/-1;
      grid-row: 1
    }
    .box{
      display: contents;
      > div{
        grid-column: 1;
        grid-row:2;
      }
    }
    picture{
      grid-column: 3;
      grid-row: 1/-1;
      align-self: center;
      img{
        height : calc( 236 * var(--remBase ) );
      }
    }
  }
}
#preparatory0304{
  @media screen and ( width <= 768px ){
    .box{
      margin-top : calc( 36 * var(--remBase ) );
      picture{
        float: right;
        margin-left : calc( 10 * var(--remBase ) );
        img{
          height : calc( 68 * var(--remBase ) );
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    grid-template-columns: calc( 1030 * 100% / 1374 ) 1fr auto;
    grid-template-rows: calc( 34 * var(--remBase) ) calc( 34 * var(--remBase) ) calc( 10 * var(--remBase) ) 1fr;
    .box{
      display: contents;
    }
    hgroup{
      grid-column: 1/-1;
      grid-row: 1/3;
    }
    picture{
      grid-column: 3;
      grid-row: 2/-1;
      align-self: start;
      img{
        height : calc( 257 * var(--remBase ) );
      }
    }
    .box > div{
      grid-column: 1;
      grid-row: 4;
    }
  }
}
#preparatory0305{
  @media screen and ( width <= 768px ){
    > div:nth-of-type(1){
      margin-top : calc( 24 * var(--remBase ) );
      display: grid;
      align-items: center;
      grid-template-columns: 1fr auto;
      column-gap : calc( 5 * var(--contentBase ) );
      picture{
        order:2;
        img{
          height : calc( 64 * var(--remBase ) );
        }
      }
    }
    > div:nth-of-type(2){
      margin-top : calc( 51 * var(--remBase ) );
      display: grid;
      grid-template-rows: 1fr auto auto 1fr;
      > div{
        grid-column: 2;
        grid-row: 1/-1;
      }
      > picture{
        grid-column: 1;
        img{
          height : calc( 64 * var(--remBase ) );
        }
        &:nth-of-type(1){
          grid-row: 2;
        }
        &:nth-of-type(2){
          grid-row: 3;
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    > div:nth-of-type(1){
      margin-top : calc( 11 * var(--remBase ) );
      display: grid;
      grid-template-columns: calc( 928 * 100% / 1374 ) 1fr auto calc( 40 * 100% / 1374 );
      align-items: start;
      > div{
        grid-row: 1;
        grid-column: 1;
      }
      picture{
        grid-row: 1;
        grid-column: 3;
      }
      img{
        height : calc( 200 * var(--remBase ) );
      }
    }
    > div:nth-of-type(2){
      display: grid;
      grid-template-columns: calc( 725 * 100% / 1374 ) auto 1fr;
      justify-content: start;
      column-gap : calc( 20 * 100% / 1374 );
      align-items: center;
      > div{
        grid-column: 1;
        grid-row: 1;
      }
      picture{
        grid-column: 2;
        grid-row: 1;
        img{
          height : calc( 195 * var(--remBase ) );
        }
        &:nth-of-type(2){
          position: relative;
          width: 100%;
          height: 100%;
          img{
            position: absolute;
            top: calc( 60 * var(--remBase) );
            left : calc( 230 * var(--remBase ) );
          }
        }
      }
    }
  }
}
#preparatory0306{
  @media screen and ( width <= 768px ){
    .box{
      margin-top : calc( 11 * var(--remBase ) );
      display: grid;
      grid-template-columns: 1fr auto;
      column-gap : calc( 10 * var(--contentBase ) );
      align-items: center;
      > div{
        display: contents;
      }
      picture{
        grid-column: 2;
        grid-row: 2;
      }
      img{
        height : calc( 100 * var(--remBase ) );
      }
      p{
        grid-column: 1/1;
      }
      ul{
        grid-column: 1;
        padding-left: 1em;
        grid-row: 2;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    grid-template-columns: calc( 1022 * 100% / 1374 ) 1fr auto calc( 80 * 100% / 1374 );
    grid-template-rows: calc( 34 * var(--remBase) ) calc( 34 * var(--remBase) ) 1fr;
    row-gap : calc( 4 * var(--remBase ) );
    hgroup{
      grid-column: 1/-1;
      grid-row: 1/3;
    }
    .box{
      display: contents;
      > div{
        grid-column: 1;
        grid-row: 3;
      }
    }
    picture{
      grid-column: 3;
      grid-row: 2/-1;
      align-self: center;
      img{
        height : calc( 248 * var(--remBase ) );
      }
    }
    ul{
      margin-block : 1em;
      padding-left: 2em;
    }
  }
}
#preparatory0307{
  dt{
    font-weight: 700;
  }
  @media screen and ( width <= 768px ){
    .box{
      margin-top : calc( 25 * var(--remBase ) );
      picture{
        float: right;
        margin-left : calc( 10 * var(--remBase ) );
        img{
          height : calc( 78 * var(--remBase ) );
        }
      }
    }
    dl{
      margin-top : calc( 16 * var(--remBase ) );
      > div + div{
        margin-top : calc( 10 * var(--remBase ) );
      }
    }
    dt{
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.5;
    }
    dd{
      font-size : calc( 9 * var(--remBase ) );;
      line-height : calc( 14 / 9 );;
      padding-left: 0.5em;
    }
  }
  @media print,screen and ( width > 768px ){
    .box{
      margin-top : calc( 15 * var(--remBase ) );
      picture{
        margin-top : calc( 14 * var(--remBase ) );
        float: right;
        margin-left : calc( 20 * var(--remBase ) );
        img{
          height : calc( 251 * var(--remBase ) );
        }
      }
      dl{
        font-size : calc( 18 * var(--remBase ) );;
        line-height : 1.5;
        padding-left: 3.5em;
        margin-top: 1em;
        > div{
          display: flex;
          + div{
            margin-top: 1lh;
          }
        }
      }
      dt{
        flex-shrink: 0;
        width: 10em;
      }
    }
  }
}
#preparatory0308{
  @media screen and ( width <= 768px ){
    .box{
      margin-top : calc( 16 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    .box{
      margin-top : calc( 16 * var(--remBase ) );
    }
  }
}
#preparatory0309{
  @media screen and ( width <= 768px ){
    .box{
      margin-top : calc( 12 * var(--remBase ) );
      picture{
        float: right;
        margin-left : calc( 10 * var(--remBase ) );
        margin-top : calc( 20 * var(--remBase ) );
      }
      img{
        height : calc( 71 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    .box{
      margin-top : calc( 8 * var(--remBase ) );
      display: grid;
      align-items: start;
      grid-template-columns: calc( 902 * 100% / 1374 ) auto;
      justify-content: space-between;
      picture{
        order: 2;
      }
      img{
        height : calc( 264 * var(--remBase ) );
      }
    }
  }
}
#preparatory0310{
  @media screen and ( width <= 768px ){
    .box{
      margin-top : calc( 32 * var(--remBase ) );
      display: grid;
      grid-template-columns: 1fr auto;
      column-gap : calc( 10 * var(--contentBase ) );
      align-items: center;
      > div{
        display: contents;
        p:nth-of-type(1){
          grid-column: 1/-1;
        }
        p:nth-of-type(2){
          grid-column: 1;
          grid-row: 2;
        }
      }
      picture{
        grid-column: 2;
        grid-row: 2;
        img{
          height : calc( 88 * var(--remBase ) );
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    grid-template-columns: calc( 864 * 100% / 1374 ) auto;
    justify-content: space-between;
    grid-template-rows: 1fr auto auto 1fr;
    hgroup{
      grid-column: 1/-1;
      grid-row: 2;
    }
    picture{
      grid-column: 2;
      grid-row: 1/-1;
      img{
        height : calc( 283 * var(--remBase ) );
      }
    }
    .box{
      display: contents;
      > div{
        grid-column: 1;
        grid-row: 3;
      }
    }
  }
}
#preparatory04{
  iframe{
    aspect-ratio: 560/315;
    width: 100%;
    height: auto;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 35 * var(--remBase ) );
    width : calc( 280 * var(--viewportBase ) );
    margin-inline : auto;
    li + li{
      margin-top : calc( 10 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 68 * var(--remBase ) );
    display: grid;
    grid-template-columns: repeat( 2 , calc( 480 * var(--viewportBase) ) );
    column-gap : calc( 38 * var(--viewportBase ) );
    justify-content: center;
    row-gap : calc( 58 * var(--remBase ) );
  }
}
/*--------------------------------------------
PREPARATORY SCHEDULE
---------------------------------------------*/
#preparatorySchedule02{
  @media screen and ( width <= 768px ){
    padding-top : calc( 29 * var(--remBase ) );
    picture{
      margin-top : calc( 10 * var(--remBase ) );
      width : calc( 280 * var(--contentBase ) );
      margin-inline : auto;
    }
  }
  @media print,screen and ( width > 768px ){
    padding-top : calc( 76 * var(--remBase ) );
    padding-bottom : calc( 27 * var(--remBase ) );
    picture{
      margin-inline : auto;
      margin-top : calc( 11 * var(--remBase ) );
      width : calc( 716 * var(--contentBase ) );
    }
  }
}
#preparatorySchedule03{
  .box{
    > p{
      strong{
        font-weight: 700;
        color:#F21111;
      }
    }
    ul{
      padding-left: 1em;
    }
  }
  h3{
    font-weight: 400;
  }
  .notes{
    strong{
      font-weight: 700;
      text-decoration: underline;
      color:black;
    }
  }
  @media screen and ( width <= 768px ){
    padding-top : calc( 29 * var(--remBase ) );
    .box{
      margin-top : calc( 6 * var(--remBase ) );
      > p , ul , h3 , dl{
        font-size : calc( 12 * var(--remBase ) );;
        line-height : 1.5;
      }
      ul{
        margin-top : calc( 6 * var(--remBase ) );
      }
    }
    .notes{
      margin-top : calc( 21 * var(--remBase ) );
      p:has(strong){
        font-size : calc( 12 * var(--remBase ) );;
        line-height : 1.5;
        margin-bottom : calc( 5 * var(--remBase ) );
      }
      p:not(:has(strong)){
        font-size : calc( 11 * var(--remBase ) );;
        line-height : calc( 15 / 11 );;
        + p{
          margin-top : calc( 6 * var(--remBase ) );
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    padding-top : calc( 38 * var(--remBase ) );
    .box{
      width : calc( 824 * var(--contentBase ) );
      margin-inline : auto;
      > p , ul , h3 , dl{
        font-size : calc( 17 * var(--remBase ) );;
        line-height : calc( 26 / 17 );;
      }
      li{
        margin-top : calc( 7 * var(--remBase ) );
      }

    }
    .notes{
      margin-top : calc( 41 * var(--remBase ) );
      p:has(strong){
        font-size : calc( 17 * var(--remBase ) );;
        line-height : calc( 26 / 17 );;
        margin-bottom : calc( 7 * var(--remBase ) );
      }
      p:not(:has(strong)){
        font-size : calc( 14 * var(--remBase ) );;
        line-height : 1.5;
        + p{
          margin-top : calc( 12 * var(--remBase ) );
        }
      }
    }
  }
}
#preparatorySchedule0301{
  @media screen and ( width <= 768px ){
    margin-top : calc( 35 * var(--remBase ) );
    h3{
      padding-left: 1em;
    }
    > dl{
      display: grid;
      grid-template-columns: auto 1fr;
      column-gap: 1em;
      row-gap : calc( 3 * var(--remBase ) );
    }
    dl dl{
      dd{
        text-align: right;
      }
      > dt:not(:nth-of-type(1)){
        margin-top : calc( 9 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 7 * var(--remBase ) );
    > dl{
      margin-top : calc( 7 * var(--remBase ) );
      padding-left: 1.5em;
      display: grid;
      grid-template-columns: 4.5em 1fr;
      row-gap : calc( 23 * var(--remBase ) );
    }
    dl dl{
      display: grid;
      grid-template-columns: 16em 1fr;
      row-gap : calc( 18 * var(--remBase ) );
    }
  }
}
#preparatorySchedule0302{
  p{
    padding-left: 2em;
  }
  .column{
    display: grid;
    grid-auto-flow: column;
    justify-content: start;
    align-items: baseline;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 10 * var(--remBase ) );
    p{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
    dl{
      margin-top : calc( 5 * var(--remBase ) );
      padding-left: 0.5em;
      > div + div{
        margin-top : calc( 19 * var(--remBase ) );
      }
    }
    dd{
      margin-top : calc( 5 * var(--remBase ) );
    }
    .column{
      column-gap: 1em;
      dd{
        margin-top: 0;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 39 * var(--remBase ) );
    p{
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
    }
    dl{
      margin-top : calc( 20 * var(--remBase ) );
      padding-left: 1em;
    }
    dd{
      padding-left: 1em;
    }
    dl > div + div{
      margin-top : calc( 7 * var(--remBase ) );
    }
  }
}
/*--------------------------------------------
PREPARATORY FORM
---------------------------------------------*/
#preparatoryForm01{
  .box{
    position: relative;
    &:before{
      content:"";
      display: block;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      background-color: #f7ebd5;
      left: 50%;
      translate: -50% 0;
      z-index: -1;
    }
  }
  h2{
    font-family: "Noto Serif JP", serif;
    text-align: center;
    margin-inline : auto;
    color:#2f2e2e;
    border-bottom-color: #002626;
    border-bottom-style: solid;
  }
  .box{
    li{
      font-family: "Noto Serif JP", serif;
      display: grid;
      grid-template-columns: auto auto;
      justify-content: start;
      &:before{
        content:"✔　";
        white-space: pre;
        color:#FF4040;
      }
      span{
        em , span{
          color:#FF4040;
        }
      }
    }
  }
  p{
    background-color: #f7ebd5;
    outline-color: #003e7f;
    outline-style: solid;
    font-family: "Noto Serif JP", serif;
    text-align: center;
    em{
      color:#C9B81C;
      font-weight: 700;
      text-decoration: underline;
    }
  }
  @media screen and ( width <= 768px ){
    padding-bottom : calc( 12 * var(--remBase ) );
    .box{
      &:before{
        width : calc( 320 * var(--contentBase ) );
      }
      padding-top : calc( 17 * var(--remBase ) );
      padding-bottom : calc( 18 * var(--remBase ) );
    }
    h2{
      width : calc( 260 * var(--contentBase ) );
      border-bottom-width: calc( 3 * var(--remBase) );
      font-size : calc( 14 * var(--remBase ) );;
      line-height : 1.5;
      padding-bottom : calc( 3 * var(--remBase ) );
    }
    .box ul{
      margin-top : calc( 13 * var(--remBase ) );
      padding-inline : calc( 10 * var(--contentBase ) );
      li + li{
        margin-top : calc( 13 * var(--remBase ) );
      }
      li{
        font-size : calc( 11 * var(--remBase ) );;
        line-height : calc( 17 / 11 );;
      }
    }
    p{
      margin-top : calc( 6 * var(--remBase ) );
      outline-width : calc( 5 * var(--remBase ) );
      outline-offset : calc(  -5 * var(--remBase ) );
      width : calc( 280 * var(--contentBase ) );
      margin-inline : auto;
      border-radius : calc( 20 * var(--remBase ) );
      font-size : calc( 16 * var(--remBase ) );;
      line-height : 1.4;
      padding-top : calc( 12 * var(--remBase ) );
      padding-bottom : calc( 12 * var(--remBase ) );
    }
    .links-preparatoryForm{
      margin-top : calc( 21 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    padding-bottom : calc( 13 * var(--remBase ) );
    .box{
      &:before{
        width : calc( 2271 * var(--contentBase ) );
      }
      padding-top : calc( 40 * var(--remBase ) );
      padding-bottom : calc( 40 * var(--remBase ) );
    }
    h2{
      width : calc( 788 * var(--contentBase ) );
      border-bottom-width: calc( 2 * var(--remBase) );
      font-size : calc( 50 * var(--remBase ) );;
      line-height : 1.52;
      padding-bottom : calc( 6 * var(--remBase ) );
    }
    .box ul{
      width: fit-content;
      margin-inline : auto;
      margin-top : calc( 56 * var(--remBase ) );
      li + li{
        margin-top : calc( 37 * var(--remBase ) );
      }
      li{
        font-size : calc( 33 * var(--remBase ) );;
        line-height : calc( 50 / 33 );;
      }
    }
    p{
      margin-top : calc( 41 * var(--remBase ) );
      outline-width : calc( 5 * var(--remBase ) );
      outline-offset : calc(  -5 * var(--remBase ) );
      width : calc( 914 * var(--contentBase ) );
      margin-inline : auto;
      border-radius : calc( 20 * var(--remBase ) );
      font-size : calc( 40 * var(--remBase ) );;
      line-height : 1.4;
      padding-top : calc( 19 * var(--remBase ) );
      padding-bottom : calc( 24 * var(--remBase ) );
    }
    .links-preparatoryForm{
      margin-top : calc( 25 * var(--remBase ) );
    }
  }
}
#preparatoryForm02{
  h2{
    text-align: center;
    font-weight: 700;
    color:#1A2DF3;
  }
  iframe{
    aspect-ratio: 560/315;
    height: auto;
    margin-inline : auto;
  }
  dl{
    >div:nth-of-type(1){
      background-color: #f6ae54;
    }
    > div:nth-of-type(2){
      background-color: #25b7c0;
    }
  }
  dt{
    color:white;
    text-align: center;
  }
  li{
    color:white;
  }
  @media screen and ( width <= 768px ){
    padding-bottom : calc( 10 * var(--remBase ) );
    h2{
      font-size : calc( 16 * var(--remBase ) );;
      line-height : 2;
    }
    dl{
      display: grid;
      grid-template-columns: repeat( 2 , 50% );
      background-color: #091933;
      padding-top : calc( 10 * var(--remBase ) );
      &:before{
        content:"";
        display: block;
        background : url( "../images/preparatory/form/bg02.avif" ) left top / contain no-repeat;
        aspect-ratio: 1202/544;
        width: auto;
        margin-inline : auto;
        height : calc( 127 * var(--remBase ) );
        opacity: .75;
        margin-inline : auto;
        grid-column: 1/-1;
        justify-self: center;
        grid-row: 1;
      }
      > div{
        padding-bottom : calc( 20 * var(--remBase ) );
        &:nth-of-type(1){
          grid-column: 1;
          grid-row: 2;
        }
        &:nth-of-type(2){
          grid-column:2;
          grid-row: 2;
        }
        &:nth-of-type(3){
          grid-column: 1/-1;
          grid-row: 3;
          ul{
            width: fit-content;
            margin-inline : auto;
          }
        }
      }
    }
    dt{
      font-size : calc( 14 * var(--remBase ) );;
      line-height : calc( 40 / 14 );;
    }
    ul{
      padding-inline : calc( 8 * var(--remBase ) );
    }
    li{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 16 / 11 );;
    }
    iframe{
      width : calc( 280 * var(--viewportBase ) );
      margin-top : calc( 8 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    padding-bottom : calc( 60 * var(--remBase ) );
    h2{
      font-size : calc( 40 * var(--remBase ) );;
      line-height : 2;
    }
    dl{
      position: relative;
      display: grid;
      grid-template-columns: repeat( 3 ,  calc( 100% / 3 ) );
      margin-top : calc( 12 * var(--remBase ) );
      min-height: calc( 300 * var(--remBase) );
      &:before{
        content:"";
        display: block;
        position: absolute;
        top: 0;
        height: 100%;
        background-color: #091933;
        z-index: -1;
        width : calc( 2445 * var(--contentBase ) );
        left: 50%;
        translate: -50%;
      }
      &:after{
        content:"";
        display: block;
        position: absolute;
        top: 50%;
        translate: 0 -50%;
        right: calc( 100% + calc( 10 * var(--contentBase) ) );
        background : url( "../images/preparatory/form/bg02.avif" ) left top / contain no-repeat;
        aspect-ratio: 1202/544;
        width: auto;
        height : calc( 272 * var(--remBase ) );
        opacity: .75;
      }
      > div{
        padding-block : calc( 11 * var(--remBase ) );
      }
    }
    dt{
      font-size : calc( 35 * var(--remBase ) );;
      line-height : 1.4;
    }
    ul{
      padding-inline : calc( 10 * 100% / (  980 / 3 ) );
    }
    li{
      font-size : calc( 23 * var(--remBase ) );;
      line-height : calc( 32.2 / 23 );;
    }
    iframe{
      width : calc( 614 * var(--contentBase ) );
      margin-top : calc( 48 * var(--remBase ) );
    }
  }
}
#preparatoryFormsForm{
  .title{
    text-align: center;
  }
  .note01{
    text-align: center;
  }
  .note02{
    font-weight: 700;
    color:#F14900;
  }
  .box{
    > ul{
      color:black;
    }
    .past{
      color:#DBDBDB;
    }
    > ul{
      > li{
        > ul{
          > li{
            > time:has( + ul li:last-child.past ){
              color:#DBDBDB;
            }
          }
        }
      }
    }
  }
  .box > ul > li > ul > li{
    display: flex;
    flex-wrap: wrap;
  }
  li li li:not(:last-child):after{
    content:" / ";
    white-space: pre;
  }
  ul ul ul{
    display: flex;
    flex-wrap: wrap;
  }
  .note03{
    color:#F14900;
  }
  @media screen and ( width <= 768px ){
    .title{
      font-size : calc( 15 * var(--remBase ) );;
      line-height : 1.4;
    }
    .note01{
      margin-top : calc( 6 * var(--remBase ) );
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 16 / 11 );;
    }
    .note02{
      margin-top : calc( 10 * var(--remBase ) );
       font-size : calc( 11 * var(--remBase ) );;
       line-height : calc( 16 / 11 );;
    }
    .box > ul{
      margin-top : calc( 5 * var(--remBase ) );
      font-size : calc( 12 * var(--remBase ) );;
      line-height : calc( 19 / 12 );;
    }
    .box > ul + p{
      margin-top : calc( 10 * var(--remBase ) );
    }
    .note03{
      color:#F14900;
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 16 / 11 );;
    }
    .note04{
      margin-top : calc( 10 * var(--remBase ) );
      font-size : calc( 12 * var(--remBase ) );;
      line-height : calc( 17 / 12 );;
    }
  }
  @media print,screen and ( width > 768px ){
    .box{
      margin-inline : auto;
      width : calc( 952 * var(--contentBase ) );
      outline : solid calc( 10 * var(--remBase ) ) #003e7f;
      outline-offset : calc(  -10 * var(--remBase ) );
      background-color: color-mix( in srgb , #bae9ff 35% , transparent );
      position: relative;
      padding-top : calc( 19 * var(--remBase ) );
      padding-bottom : calc( 38 * var(--remBase ) );
      padding-inline : calc( 147 * var(--contentBase ) );
      &:before , &:after{
        content:"";
        display: block;
        font-size: 0;
        position: absolute;
        background-repeat: no-repeat;
        background-size: contain;
        background-position: 0 0;
        width: auto;
      }
      &:before{
        aspect-ratio: 85/86;
        height : calc( 86 * var(--remBase ) );
        top : calc( -20 * var(--remBase ) );
        left : calc( -30 * 100% / 952 );
        background-image: url("../images/preparatory/form/bg0401.webp");
      }
      &:after{
        aspect-ratio: 1;
        height : calc( 85 * var(--remBase ) );
        top : calc( -20 * var(--remBase ) );
        right : calc( -30 * 100% / 952 );
        background-image: url("../images/preparatory/form/bg0402.webp");
      }
    }
    .title{
      font-size : calc( 40 * var(--remBase ) );;
      line-height : 1.4;
    }
    .note01{
      margin-top : calc( 23 * var(--remBase ) );
      font-size : calc( 20 * var(--remBase ) );;
      line-height : 1.4;
    }
    .note02{
      text-align: center;
      margin-top : calc( 41 * var(--remBase ) );
       font-size : calc( 20 * var(--remBase ) );;
       line-height : 1.4;
    }
    .box > ul{
      margin-top : calc( 14 * var(--remBase ) );
      width : calc( 574 * 100% / 658 );
      margin-inline : auto;
      font-size : calc( 22 * var(--remBase ) );;
      line-height : calc( 35 / 22 );;
    }
    .box > ul + p{
      margin-top : calc( 9 * var(--remBase ) );
    }
    .note03{
      width : calc( 574 * 100% / 658 );
      margin-inline : auto;
      padding-left: 1em;
      color:#F14900;
      font-size : calc( 20 * var(--remBase ) );;
      line-height : 1.4;
    }
    .note04{
      margin-top : calc( 14 * var(--remBase ) );
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 24 / 17 );;
    }
  }
}
/*--------------------------------------------
SUMMER
---------------------------------------------*/
#summer02{
  @media screen and ( width <= 768px ){
    h2{
      font-size : calc( 15 * var(--remBase ) );;
      line-height : calc( 23 / 15 );;
      margin-bottom : calc( 10 * var(--remBase ) );
    }
    p{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
  }
  @media print,screen and ( width > 768px ){
    h2{
      font-size : calc( 42 * var(--remBase ) );;
      line-height : calc( 64 / 42 );;
      margin-bottom : calc( 61 * var(--remBase ) );
    }
    p{
      font-size : calc( 30 * var(--remBase ) );;
      line-height : 1.6;
    }
  }
}
#summer04{
  p{
    color:var(--blue02);
  }
  @media screen and ( width <= 768px ){
    .links-summer{
      margin-top : calc( 14 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    .links-summer{
      margin-top : calc( 70 * var(--remBase ) );
    }
  }
}
#preparatoryForm03{
  @media screen and ( width <= 768px ){
    padding-top : calc( 48 * var(--remBase ) );
    padding-bottom : calc( 38 * var(--remBase ) );
  }
  @media print,screen and ( width > 768px ){
    padding-top : calc( 30 * var(--remBase ) );
    padding-bottom : calc( 24 * var(--remBase ) );
  }
}
/*--------------------------------------------
HIGH SCHOOL
---------------------------------------------*/
#highschoolAdvaices{
  h2{
    margin-inline : auto;
    position: relative;
    background-color: #081d45;
    color:white;
    text-align: center;
    box-shadow: 0 calc( 1 * var(--remBase ) ) calc( 3 * var(--remBase ) ) color-mix( in srgb , black 50% , transparent );
    display: grid;
    place-items:center;
    &:before{
      content:"";
      display: block;
      outline : solid 1px white;
      outline-offset : -1px;
      position: absolute;
      top: 50%;
      left: 50%;
      translate: -50% -50%;
      font-size: 0;
      pointer-events: none;
      z-index: 1;
    }
  }
  h3{
    font-weight: 400;
  }
  p + p{
    margin-top: 1lh;
  }
  h4{
    font-weight: 400;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 10 * var(--remBase ) );
    h2{
      width : calc( 250 * var(--contentBase ) );
      height : calc( 40 * var(--remBase ) );
      font-size : calc( 14 * var(--remBase ) );
      &:before{
        width : calc( 234 * 100% / 250 );
        height : calc( 26 * var(--remBase ) );
      }
    }
    > ul{
      margin-top : calc( 9 * var(--remBase ) );
      > li + li{
        margin-top : calc( 23 * var(--remBase ) );
      }
      > li{
        padding-top : calc( 10 * var(--remBase ) );
        padding-bottom : calc( 15 * var(--remBase ) );
      }
    }
    h3{
      margin-bottom : calc( 11 * var(--remBase ) );
      font-size : calc( 12 * var(--remBase ) );;
      line-height : 1.5;
      padding-left: 1em;
    }
    .box{
      padding-left : calc( 10 * var(--contentBase ) );
      padding-right : calc( 10 * var(--contentBase ) );
      picture{
        float: right;
        margin-left : calc( 10 * var(--remBase ) );
        img{
          height : calc( 75 * var(--remBase ) );
        }
      }
    }
    p , li li , h4{
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.5;
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 34 * var(--remBase ) );
    h2{
      width : calc( 470 * var(--contentBase ) );
      height : calc( 62 * var(--remBase ) );
      font-size : calc( 25 * var(--remBase ) );
      &:before{
        width : calc( 456 * 100% / 470 );
        height : calc( 48 * var(--remBase ) );
      }
    }
    > ul{
      margin-top : calc( 42 * var(--remBase ) );
      > li{
        + li{
          margin-top : calc( 67 * var(--remBase ) );
        }
        padding-top : calc( 24 * var(--remBase ) );
        padding-bottom : calc( 25 * var(--remBase ) );
      }
    }
    > ul > li , > dl{
      position: relative;
      &:before{
        position: absolute;
        top: 0;
        left: 50%;
        translate: -50% 0;
        content:"";
        display: block;
        height: 100%;
        z-index: -1;
        width : calc( 1448 * var(--contentBase ) );
      }
    }
    h3{
      font-size : calc( 20 * var(--remBase ) );;
      line-height : 1.55;
    }
    p , li li , h4{
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
    }
    .box{
      padding-left : calc( 34 * var(--contentBase ) );
      padding-right : calc( 40 * var(--contentBase ) );
      picture{
        right : calc( -320 * var(--contentBase ) );
        position: absolute;
        top: 50%;
        translate: 0 -50%;
      }
    }
  }
}
#highschoolAdvaice01{
  iframe{
    height: auto;
    aspect-ratio: 560/315;
    width: 100%;
  }
  @media screen and ( width <= 768px ){
    background-color: #fce6e6;
    ul{
      margin-top : calc( 6 * var(--remBase ) );
      padding-inline : calc( 10 * var(--contentBase ) );
    }
    li + li{
      margin-top : calc( 9 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    &:before{
      background-color: #fce6e6;
    }
    .box{
      img{
        height : calc( 317 * var(--remBase ) );
      }
    }
    ul{
      margin-top : calc( 20 * var(--remBase ) );
      display: grid;
      grid-template-columns: repeat( 2 , calc( 440 * 100% / 906 ) );
      column-gap : calc( 20 * 100% / 906 );
    }
  }
}
#highschoolAdvaice02{
  @media screen and ( width <= 768px ){
    background-color: #dcf3f0;
    li + li{
      margin-top: 1lh;
    }
  }
  @media print,screen and ( width > 768px ){
    &:before{
      background-color: #dcf3f0;
    }
    .box{
      img{
        height : calc( 349 * var(--remBase ) );
      }
    }
    li + li{
      margin-top: 2lh;
    }
  }
}
#highschoolAdvaice03{
  @media screen and ( width <= 768px ){
    background-color: #faf7e9;
  }
  @media print,screen and ( width > 768px ){
    &:before{
      background-color: #faf7e9;
    }
    .box{
      picture{
        translate: none;
        top : calc( 56 * var(--remBase ) );
      }
      img{
        height : calc( 321 * var(--remBase ) );
      }
    }
  }
}
#highschoolAdvaices > dl{
  dt{
    font-weight: 700;
    color:var(--blue02);
  }
  dd a{
    text-decoration: underline;
  }
  @media screen and ( width <= 768px ){
    background-color: #faf7e9;
    padding-inline : calc( 10 * var(--contentBase ) );
    padding-top : calc( ( 37 - 15 ) * var(--remBase ) );
    padding-bottom : calc( 10 * var(--remBase ) );
    dt{
      font-size : calc( 14 * var(--remBase ) );;
      line-height : 1.5;
    }
    dd{
      margin-top : calc( 6 * var(--remBase ) );
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.5;
      + dt{
        margin-top : calc( 17 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    &:before{
      background-color: #faf7e9;
    }
    padding-top : calc( ( 64 - 25 ) * var(--remBase ) );
    display: grid;
    grid-template-columns: calc( 180 * var(--contentBase) ) 1fr;
    align-items: center;
    row-gap : calc( 24 * var(--remBase ) );
    padding-bottom : calc( 10 * var(--remBase ) );
    dt{
      font-size : calc( 25 * var(--remBase ) );;
      line-height : 1.52;
    }
    dd{
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
    }
  }
}
#highSchools .contentAuthor{
  @media screen and ( width <= 768px ){
    margin-top : calc( 10 * var(--remBase ) );
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 24 * var(--remBase ) );
  }
}
/*--------------------------------------------
HIGH SCHOOL WINTER
---------------------------------------------*/
#highSchoolWinter02{
  header{
    background-image: url("../images/high-school/winter/bg01.avif");
    background-position: center top;
    background-repeat: no-repeat;
    display: grid;
    align-content: center;
    justify-content: center;
    grid-auto-flow: row;
    p{
      + p{
        margin-top: 1em;
      }
      text-align: center;
      color:var(--blue02);
      font-weight: 700;
      em{
        background-image: linear-gradient(transparent 40%, #f3f707b3 80%);
      }
    }
  }
  > ol > li{
    position: relative;
    > div{
      > div{
        width: fit-content;
        color:#081D45;
        filter: drop-shadow( calc( 1 * var(--remBase ) ) calc( 4 * var(--remBase ) ) calc( 2 * var(--remBase ) ) color-mix( in srgb , black 60% , transparent ) );
        position: relative;
        outline-offset : calc(  -6 * var(--remBase ) );
        &:before{
          content:"";
          display: block;
          aspect-ratio: 10/20;
          width: auto;
          font-size: 0;
          top: 50%;
          position: absolute;
          translate: 0 -50%;
        }
      }
    }
    img{
      position: absolute;
      top: 50%;
      translate: 0 -50%;
    }
    p + p{
      margin-top: 1lh;
    }
  }
  .char01{
    > div{
      > div{
        margin-left: auto;
        background-color: #b6e8e3;
        outline : solid calc( 6 * var(--remBase ) ) #1c2984;
        &:before{
          background-color: #1c2984;
          left : calc( 100% - 1px );
          clip-path: polygon(0 0, 100% 50%, 0 100%);
        }
      }
    }
    img{
      right: 0;
    }
    em{
      background-image: linear-gradient(transparent 50%, #f3f707b3 50% , #f3f707b3 50%);
    }
  }
  .char02{
    > div{
      > div{
        background-color: #f9f0bb;
        outline : solid calc( 6 * var(--remBase ) ) #20ce88;
        &:before{
          background-color: #20ce88;
          right : calc( 100% - 1px );
          clip-path: polygon(0 50%, 100% 0,  100% 100%);
        }
      }
    }
    img{
      left: 0;
    }
    em{
      background-image: linear-gradient(transparent 50%, #f14900bd 50% , #f14900bd 50%);
    }
  }
  .center{
    text-align: center;
  }
  @media screen and ( width <= 768px ){
    padding-bottom : calc( 20 * var(--remBase ) );
    header{
      min-height: calc( 133 * var(--remBase) );
      background-size: 100% calc( 133 * var(--remBase) );
      p{
        font-size : calc( 11 * var(--remBase ) );;
        line-height : calc( 21 / 11 );;
      }
    }
    > ol{
      margin-top : calc( 36 * var(--remBase ) );
      > li{
        > div > div + div{
          margin-top : calc( 11 * var(--remBase ) );
        }
        > div{
          >div{
            padding-inline : calc( 9 * var(--remBase ) );
            padding-top : calc( 11 * var(--remBase ) );
            padding-bottom : calc( 16 * var(--remBase ) );
            font-size : calc( 10 * var(--remBase ) );;
            line-height : 1.5;
            &:before{
              height : calc( 20 * var(--remBase ) );
            }
          }
        }
      }
    }
    .char01 + .char02{
      margin-top : calc( 14 * var(--remBase ) );
    }
    .char02 + .char01{
      margin-top : calc( 20 * var(--remBase ) );
    }
    .char01 , .char02{
      img{
        height : calc( 60 * var(--remBase ) );
        translate: 0 -50%;
      }
    }
    .char01{
      > div > div{
        margin-right : calc( 60 * var(--contentBase ) );
        margin-left: auto;
      }
    }
    .char02{
      > div > div{
        margin-left : calc( 56 * var(--contentBase ) );
      }
    }
    .link-highSchoolWinter{
      margin-top : calc( 31 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    padding-bottom : calc( 51 * var(--remBase ) );
    header{
      min-height: calc( 483 * var(--remBase) );
      background-size: 100% calc( 483 * var(--remBase) );
      p{
        font-size : calc( 40 * var(--remBase ) );;
        line-height : calc( 73 / 40 );;
      }
    }
    .char01 + .char02{
      margin-top : calc( 25 * var(--remBase ) );
    }
    .char02 + .char01{
      margin-top : calc( 35 * var(--remBase ) );
    }
    > ol{
      margin-top : calc( 42 * var(--remBase ) );
      width : calc( 700 * var(--contentBase ) );
      margin-inline : auto;
      > li{
        > div > div + div{
          margin-top : calc( 24 * var(--remBase ) );
        }
        > div{
          >div{
            padding-inline : calc( 25 * var(--remBase ) );
            padding-top : calc( 20 * var(--remBase ) );
            padding-bottom : calc( 24 * var(--remBase ) );
            font-size : calc( 25 * var(--remBase ) );;
            line-height : 1.52;
            &:before{
              height : calc( 20 * var(--remBase ) );
            }
          }
        }
      }
    }
    .char01 , .char02{
      img{
        height : calc( 163 * var(--remBase ) );
      }
    }
    .char01{
      img{
        translate: 100% -50%;
      }
    }
    .char02{
      img{
        translate: -100% -50%;
      }
    }
    .link-highSchoolWinter{
      margin-top : calc( 100 * var(--remBase ) );
    }
  }
}
#highSchoolWinter03{
  h2{
    span{
      background-image: linear-gradient(transparent 50%, #f3f707b3 50% , #f3f707b3 80% , transparent 80% , transparent);
    }
  }
  @media screen and ( width <= 768px ){
    h2{
      font-size : calc( 18 * var(--remBase ) );;
      line-height : 1.5;
      margin-bottom : calc( 8 * var(--remBase ) );
    }
    p{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 19 / 11 );;
      + p{
        margin-top: 1em;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    h2{
      font-size : calc( 60 * var(--remBase ) );;
      line-height : calc( 91 / 60 );;
      margin-bottom : calc( 46 * var(--remBase ) );
    }
    p{
      font-size : calc( 30 * var(--remBase ) );;
      line-height : 1.8;
    }
  }
}
#highSchoolWinter05{
  p{
    font-weight: 500;
    color:#163e3a;
  }
  @media screen and ( width <= 768px ){
    .link-highSchoolWinter{
      margin-top : calc( 49 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    .link-highSchoolWinter{
      margin-top : calc( 38 * var(--remBase ) );
    }
  }
}
/*--------------------------------------------
HISHSHOOL TRAINING
---------------------------------------------*/
#highSchoolTraining01{
  > p{
    strong{
      color:#324158;
      font-weight: 700;
    }
  }
  > ul{
    > li + li{
      border-top : solid calc( 2 * var(--remBase ) ) #605e5e;
    }
  }
  .english{
    border-left-color:#ff8585;
  }
  .japanese{
    border-left-color: #a0cb83;
  }
  .science{
    border-left-color: #c7b583;
  }
  .math{
    border-left-color: #85aeff;
  }
  h2{
    font-weight: 700;
    span{
      display: block;
    }
    span:nth-of-type(2){
      padding-left: 1em;
    }
  }
  dl{
    display: grid;
    grid-auto-flow: column;
    justify-content: start;
  }
  .times{
    > li{
      display: grid;
      align-items: start;
    }
  }
  .dates{
    display: flex;
    flex-wrap: wrap;
    > time:not(:last-of-type):after{
      content:",";
    }
  }
  @media screen and ( width <= 768px ){
    padding-top : calc( 18 * var(--remBase ) );
    > p{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
      text-align: center;
    }
    > ul{
      margin-top : calc( 30 * var(--remBase ) );
      > li{
        + li{
          margin-top : calc( 12 * var(--remBase ) );
          padding-top : calc( 12 * var(--remBase ) );
        }
        > ul{
          border-left-width: calc( 8 * var(--remBase) );
          padding-left : calc( 10 * var(--contentBase) );
          padding-block : calc( 8 * var(--remBase ) );
          > li{
            + li{
              margin-top : calc( 12 * var(--remBase ) );
            }
            display: grid;
            grid-template-columns: 1fr auto;
            row-gap : calc( 5 * var(--remBase ) );
          }
        }
      }
    }
    h2{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
      grid-column: 1;
      grid-row: 1
    }
    dl{
      grid-column: 2;
      grid-row: 1;
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.5;
      align-self: center;
    }
    .times{
      grid-row: 2;
      grid-column: 1/-1;
      padding-left: 1em;
      > li{
        grid-template-columns: auto auto;
        justify-content: start;
        column-gap : 1em;
        font-size : calc( 10 * var(--remBase ) );;
        line-height : 1.2;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    padding-bottom : calc( 48 * var(--remBase ) );
    > p{
      font-size : calc( 22 * var(--remBase ) );;
      line-height : calc( 34 / 22 );;
    }
    > ul{
      margin-top : calc( 32 * var(--remBase ) );
      > li{
        + li{
          margin-top : calc( 20 * var(--remBase ) );
          padding-top : calc( 20 * var(--remBase ) );
        }
        padding-inline : calc( 20 * 100% / 932 );
        > ul{
          min-height : calc( 125 * var(--remBase ) );
          border-left-width: calc( 15 * var(--remBase) );
          padding-left : calc( 20 * 100% / 896 );
          display: grid;
          align-content: center;
          grid-auto-flow: row;
          row-gap : calc( 20 * var(--remBase ) );
          > li{
            display: grid;
            grid-template-columns: calc( 360 * 100% / 861 ) calc( 200 * 100% / 861 ) calc( 301 * 100% / 861 );
          }
        }
      }
    }
    h2{
      font-size : calc( 19 * var(--remBase ) );;
      line-height : calc( 29 / 19 );;
    }
    dl{
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
      padding-top : calc( 1.5 * var(--remBase ) );
    }
    .times{
      padding-top : calc( 3 * var(--remBase ) );
      > li{
        grid-template-columns: calc( 181 * 100% / 301 ) calc( 120 * 100% / 301 );
        column-gap : 1em;
        font-size : calc( 19 * var(--remBase ) );;
        line-height : calc( 23 / 19 );;
      }
    }
  }
}
/*--------------------------------------------
JUNIOR HIGHSCHOOL
---------------------------------------------*/
#junior02{
  h2{
    font-weight: 700;
    color:#00A6D9;
  }
  h3{
    font-weight: 700;
    color:var(--blue02);
  }
  iframe{
    height: auto;
    aspect-ratio: 560/315;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 13 * var(--remBase ) );
    padding-bottom : calc( 21 * var(--remBase ) );
    h2{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
    > ul{
      margin-top : calc( 9 * var(--remBase ) );
      > li{
        + li{
          margin-top : calc( 26 * var(--remBase ) );
        }
      }
    }
    h3{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
    iframe{
      width : calc( 280 * var(--contentBase ) );
      margin-inline : auto;
      margin-top : calc( 43 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 58 * var(--remBase ) );
    position: relative;
    iframe{
      position: absolute;
      width : calc( 437 * var(--contentBase ) );
      top : calc( 19 * var(--remBase ) );
      right: 0;
    }
    h2{
      font-size : calc( 21 * var(--remBase ) );;
      line-height : calc( 32 / 21 );;
    }
    > ul{
      margin-top : calc( 6 * var(--remBase ) );
      > li{
        + li{
          margin-top : calc( 26 * var(--remBase ) );
        }
      }
    }
    h3{
      font-size : calc( 21 * var(--remBase ) );;
      line-height : calc( 32 / 21 );;
    }
  }
}
#junior0201{
  > dl > div > dt{
    font-weight: 700;
  }
  .box01{
    p{
      padding-left: 1em;
    }
  }
  h4{
    font-weight: 400;
    color:#41BDF2;
  }
  @media screen and ( width <= 768px ){
    > dl{
      > div{
        + div{
          margin-top : calc( 17 * var(--remBase ) );
        }
        > dt{
          font-size : calc( 11 * var(--remBase ) );;
          line-height : calc( 17 / 11 );;
        }
        > dd{
          font-size : calc( 11 * var(--remBase ) );;
          line-height : calc( 17 / 11 );;
          &:not(:has(div)){
            padding-left: 1em;
          }
        }
      }
    }
    .box01{
      p{
        padding-left: 1em;
      }
      dl{
        margin-block: 1lh;
        padding-left: 3em;
      }
      dd{
        padding-left: 3em;
      }
    }
    .box02{
      > p{
        &:nth-of-type(1){
          padding-left: 1em;
        }
      }
      > ul{
        margin-block: 1lh;
        > li + li{
          margin-top: 1lh;
        }
      }
      ul ul{
        padding-left: 1em;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    > dl{
      display: flex;
      flex-wrap: wrap;
      padding-left : calc( 42 * var(--contentBase ) );
      margin-top : calc( 6 * var(--remBase ) );
      row-gap : calc( 37 * var(--remBase ) );
      > div:not(.column02){
        width: 100%;
      }
      > div.column02{
        width: 50%;
      }
      > div{
        >dt{
          font-size : calc( 17 * var(--remBase ) );;
          line-height : calc( 26 / 17 );;
        }
        >dd{
          font-size : calc( 17 * var(--remBase ) );;
          line-height : calc( 26 / 17 );;
          &:not(:has(div)){
            padding-left: 1em;
          }
        }
      }
    }
    .box01{
      position: relative;
      dl{
        position: absolute;
        top: 0;
        right: 0;
      }
      dd{
        padding-left: 3em;
      }
      > ul{
        margin-top: 1lh;
        padding-left: 1em;
      }
    }
    .box02{
      > p{
        &:nth-of-type(1){
          padding-left: 1em;
        }
        &:nth-of-type(2){
          padding-top: 1.5lh;
        }
      }
      > ul{
        margin-top: 1.5lh;
        > li{
          + li{
            margin-top: 1.5lh;
          }
        }
      }
      ul ul{
        padding-left: 0.5em;
        margin-top: 0.5lh;
      }
    }
  }
}
#junior0202{
  p + p{
    margin-top: 1lh;
  }
  p + ul , ul + p{
    margin-top: 1lh;
  }
  ul{
    padding-left: 1em;
    margin-top: 1lh;
  }
  li{
    font-weight: 700;
  }
  @media screen and ( width <= 768px ){
    h3{
      margin-bottom : calc( 7 * var(--remBase ) );
    }
    p , li{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
  }
  @media print,screen and ( width > 768px ){
    h3{
      margin-bottom : calc( 13 * var(--remBase ) );
    }
    p , li{
      padding-left : calc( 42 * var(--remBase ) );
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
    }
  }
}
#juniorPoint{
  h3{
    font-weight: 700;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 37 * var(--remBase ) );
    h2{
      position: relative;
      text-align: center;
      img{
        &:nth-of-type(1) , &:nth-of-type(3){
          position: absolute;
          top: 50%;
          translate: 0 -50%;
          height : calc( 73 * var(--remBase ) );
        }
        &:nth-of-type(1){
          left: 0;
        }
        &:nth-of-type(2){
          height : calc( 76 * var(--remBase ) );
        }
        &:nth-of-type(3){
          right: 0;
        }
      }
    }
    > ul{
      margin-top : calc( 6 * var(--remBase ) );
      > li + li{
        margin-top : calc( 50 * var(--remBase ) );
      }
    }
    h3{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
    p , li li{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 68 * var(--remBase ) );
    h2{
      display: grid;
      align-items: center;
      justify-content: center;
      grid-auto-flow: column;
      img{
        &:nth-of-type(1) , &:nth-of-type(3){
          height : calc( 194 * var(--remBase ) );
        }
        &:nth-of-type(2){
          height : calc( 230 * var(--remBase ) );
        }
      }
    }
    > ul{
      margin-top : calc( 17 * var(--remBase ) );
      > li + li{
        margin-top : calc( 64 * var(--remBase ) );
      }
    }
    h3{
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
    }
    p , li li{
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
    }
  }
}
#juniorPoint01{
  .box{
    position: relative;
    li{
      padding-left: 1em;
    }
    picture{
      position: absolute;
      right: 0;
    }
  }
  @media screen and ( width <= 768px ){
    .box{
      picture{
        bottom : calc( -5.5 * var(--remBase ) );
        img{
          height : calc( 73 * var(--remBase ) );
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    .box{
      picture{
        top : calc( -17 * var(--remBase ) );
        img{
          height : calc( 176 * var(--remBase ) );
        }
      }
    }
  }
}
#juniorPoint02{
  @media screen and ( width <= 768px ){
    .box{
      display: grid;
      align-items: center;
      grid-template-columns: auto auto;
      img{
        height : calc( 114 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    position: relative;
    padding-left : calc( 250 * var(--contentBase ) );
    picture{
      position: absolute;
      top: 50%;
      translate: 0 -50%;
      left : calc( 10 * var(--contentBase ) );
      img{
        height : calc( 161 * var(--remBase ) );
      }
    }
  }
}
#juniorPoint04{
  @media screen and ( width <= 768px ){
    .box{
      display: grid;
      align-items: center;
      grid-template-columns: auto auto;
      img{
        height : calc( 150 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    position: relative;
    padding-right : calc( 254 * var(--contentBase ) );
    picture{
      position: absolute;
      top: 50%;
      translate: 0 -50%;
      right: 0;
      img{
        height : calc( 221 * var(--remBase ) );
      }
    }
  }
}
#juniorSeason{
  h2{
    font-weight: 700;
    color:#024D28;
  }
  h3{
    font-weight: 400;
  }
  .box{
    position: relative;
    picture{
      position: absolute;
      top: 0;
      right: 0;
    }
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 32 * var(--remBase ) );
    h3{
      font-size : calc( 15 * var(--remBase ) );;
      line-height : calc( 23 / 15 );;
    }
    > p{
      margin-top : calc( 10 * var(--remBase ) );
    }
    p , li , h3{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
    .box{
      padding-top : calc( 17 * var(--remBase ) );
    }
    picture{
      z-index: -1;
      img{
        height : calc( 84 * var(--remBase ) );
      }
    }
    li{
      padding-left: 1em;
    }
    .box{
      p{
        padding-left: 1em;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 66 * var(--remBase ) );
    h3{
      font-size : calc( 27 * var(--remBase ) );;
      line-height : calc( 41 / 27 );;
    }
    > p{
      margin-top : calc( 13 * var(--remBase ) );
      padding-left: 2em;
    }
    p , li , h3{
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
    }
    .box{
      margin-top : calc( 13 * var(--remBase ) );
      padding-top : calc( 13 * var(--remBase ) );
    }
    picture{
      img{
        height : calc( 203 * var(--remBase ) );
      }
    }
    h3{
      padding-left: 2em;
    }
    li{
      padding-left: 3em;
    }
    .box{
      p{
        padding-left: 3em;
      }
    }
  }
}
#juniorMock{
  h2{
    color:#8B0000;
    font-weight: 700;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 32 * var(--remBase ) );
    h2{
      font-size : calc( 15 * var(--remBase ) );;
      line-height : calc( 23 / 15 );;
    }
    .box{
      margin-top : calc( 9 * var(--remBase ) );
    }
    p{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
      + p{
        margin-top: 1lh;
      }
    }
    picture{
      text-align: center;
      margin-top : calc( 15 * var(--remBase ) );
      img{
        height : calc( 186 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 28 * var(--remBase ) );
    h2{
      font-size : calc( 25 * var(--remBase ) );;
      line-height : 1.52;
    }
    .box{
      margin-top : calc( 18 * var(--remBase ) );
      position: relative;
      padding-left : calc( 40 * var(--contentBase ) );
      padding-right : calc( 480 * var(--contentBase ) );
      picture{
        position: absolute;
        right: 0;
        top : calc( 11.5 * var(--remBase ) );
        img{
          height : calc( 301 * var(--remBase ) );
        }
      }
    }
    p{
      font-size : calc( 15 * var(--remBase ) );;
      line-height : calc( 23 / 15 );;
      + p{
        margin-top: 1lh;
      }
    }
  }
}
#juniors{
  > p{
    strong{
      font-weight: 700;
      color:#E83131;
    }
  }
  @media screen and ( width <= 768px ){
    > p{
      text-align: center;
      margin-top : calc( 10 * var(--remBase ) );
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.5;
    }
    .contentAuthor{
      margin-top : calc( 10 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    > p{
      margin-top : calc( 63 * var(--remBase ) );
      font-size : calc( 20 * var(--remBase ) );;
      line-height : 1.55;
    }
    .contentAuthor{
      margin-top : calc( 8 * var(--remBase ) );
    }
  }
}
/*--------------------------------------------
JUNIOR J3TRAINING
---------------------------------------------*/
#j3training02{
  @media screen and ( width <= 768px ){
    padding-top : calc( 33 * var(--remBase ) );
    padding-bottom : calc( 20 * var(--remBase ) );
  }
  @media print,screen and ( width > 768px ){
    padding-top : calc( 54 * var(--remBase ) );
    padding-bottom : calc( 28 * var(--remBase ) );
  }
}
/*--------------------------------------------
ELEMENTARY
---------------------------------------------*/
#elementary02{
  h2{
    font-weight: 700;
    color:#00A6D9;
  }
  h3{
    font-weight: 700;
    color:var(--blue02);
  }
  >p{
    text-align: center;
    strong{
      font-weight: 700;
      color:#E83131;
    }
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 13 * var(--remBase ) );
    padding-bottom : calc( 21 * var(--remBase ) );
    h2{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
    > ul{
      margin-top : calc( 7 * var(--remBase ) );
      > li{
        + li{
          margin-top : calc( 8 * var(--remBase ) );
        }
      }
    }
    h3{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
    > p{
      margin-top : calc( 19 * var(--remBase ) );
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 53 * var(--remBase ) );
    padding-bottom : calc( 59 * var(--remBase ) );
    h2{
      font-size : calc( 21 * var(--remBase ) );;
      line-height : calc( 32 / 21 );;
    }
    > ul{
      margin-top : calc( 21 * var(--remBase ) );
      > li{
        + li{
          margin-top : calc( 30 * var(--remBase ) );
        }
      }
    }
    h3{
      font-size : calc( 21 * var(--remBase ) );;
      line-height : calc( 32 / 21 );;
    }
    > p{
      margin-top : calc( 56 * var(--remBase ) );
      font-size : calc( 21 * var(--remBase ) );;
      line-height : calc( 32 / 21 );;
    }
  }
}
#elementary0201{
  dt{
    font-weight: 700;
  }
  h4{
    font-weight: 400;
    color:#41BDF2;
    margin-top: 1lh;
    + ul{
      margin-bottom: 1lh;
    }
  }
  .box{
    margin-block: 1lh;
    margin-left: 2em;
  }
  @media screen and ( width <= 768px ){
    dt{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
    dd{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
      > ul > li{
        text-indent: 1em;
      }
      > p{
        &:first-of-type{
          padding-left: 1em;
        }
      }
      > p + ul{
        padding-left: 1em;
      }
      + dt{
        margin-top : calc( 25 * var(--remBase ) );
      }
    }
    h4{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
  }
  @media print,screen and ( width > 768px ){
    dl{
      margin-top : calc( 35 * var(--remBase ) );
    }
    dt{
      font-size : calc( 15 * var(--remBase ) );;
      line-height : calc( 23 / 15 );;
    }
    dd{
      font-size : calc( 15 * var(--remBase ) );;
      line-height : calc( 23 / 15 );;
      padding-left: 1em;
      p + ul{
        padding-left: 1em;
      }
      + dt{
        margin-top : calc( 47 * var(--remBase ) );
      }
    }
    h4{
      font-size : calc( 15 * var(--remBase ) );;
      line-height : calc( 23 / 15 );;
      padding-left: 3em;
      + ul{
        padding-left: 4em;
      }
    }
  }
}
#elementary0202{
  p + p{
    margin-top: 1lh;
  }
  p + ul , ul + p{
    margin-top: 1lh;
  }
  ul{
    padding-left: 1em;
    margin-top: 1lh;
  }
  li{
    font-weight: 700;
  }
  @media screen and ( width <= 768px ){
    h3{
      margin-bottom : calc( 7 * var(--remBase ) );
    }
    p , li{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
  }
  @media print,screen and ( width > 768px ){
    h3{
      margin-bottom : calc( 13 * var(--remBase ) );
    }
    p , li{
      padding-left : calc( 10.5 * var(--remBase ) );
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
    }
  }
}
/*--------------------------------------------
SPECIAL COURSE LP
---------------------------------------------*/
#specialCourses{
  .title{
    h2{
      text-align: center;
    }
  }
  @media screen and ( width <= 768px ){
    .titles{
      h2{
        img{
          height : calc( 56 * var(--remBase ) );
        }
      }
      p{
        margin-top : calc( 10 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    .titles{
      h2{
        text-align: center;
        img{
          height : calc( 174 * var(--remBase ) );
        }
      }
    }
  }
}
#specialCourse02{
  background-color: #f7e7ce;
  > p + p{
    margin-top: 1lh;
  }
  >p{
    color:#324158;
    font-weight: 700;
  }
  @media screen and ( width <= 768px ){
    padding-inline : calc( 20 * var(--contentBase ) );
    padding-top : calc( 13 * var(--remBase ) );
    padding-bottom : calc( 10 * var(--remBase ) );
    >p{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
      span{
        display: block;
        margin-top: 1lh;
      }
    }
    .titles{
      margin-top : calc( 10 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    padding-top : calc( 45 * var(--remBase ) );
    padding-bottom : calc( 38 * var(--remBase ) );
    >p{
      font-size : calc( 30 * var(--remBase ) );;
      line-height : 1.5;
    }
    .titles{
      margin-top : calc( 30 * var(--remBase ) );
    }
  }
}
#specialCourse03{
  h2{
    font-weight: 700;
    color:#FF4040;
  }
  li{
    font-weight: 700;
    color:#081D45;
  }
  p{
    background-color: #85cbbf;
    >span{
      display: block;
      text-align: center;
      color:white;
      font-weight: 700;
      span{
        color:#FF4040;
      }
    }
    img{
      display: block;
      margin-inline : auto;
    }
  }
  @media screen and ( width <= 768px ){
    padding-top : calc( 25 * var(--remBase ) );
    header{
      position: relative;
      padding-left : calc( 48 * var(--contentBase ) );
      padding-right : calc( 16 * var(--contentBase ) );
      h2{
        font-size : calc( 12 * var(--remBase ) );;
        line-height : 1.5;
      }
      ul{
        margin-top : calc( 16 * var(--remBase ) );
      }
      li{
        font-size : calc( 10 * var(--remBase ) );;
        line-height : 1.5;
        display: grid;
        grid-template-columns: auto 1fr;
      }
      &:before , &:after , > h2:before , > h2:after{
        content:"";
        display: block;
        font-size: 0;
        position: absolute;
        background-repeat: no-repeat;
        background-size: contain;
        background-position: 0 0;
        width: auto;
      }
      &:before{
        background-image: url("../images/lp/special-course/char01.avif");
        aspect-ratio: 63/125;
        height : calc( 57 * var(--remBase ) );
        top : calc( -6 * var(--remBase ) );
        left : 0;
      }
      &:after{
        background-image: url("../images/lp/special-course/char02.avif");
        aspect-ratio: 84/120;
        height : calc( 57 * var(--remBase ) );
        left : 0;
        bottom : calc( 15 * var(--remBase ) );
      }
      > h2{
        &:before{
          background-image: url("../images/lp/special-course/char03.avif");
          aspect-ratio: 84/106;
          height : calc( 50 * var(--remBase ) );
          right : calc( 16 * var(--contentBase ) );
          bottom : calc( -3 * var(--remBase ) );
        }
        &:after{
          background-image: url("../images/lp/special-course/char04.avif");
          aspect-ratio: 63/114;
          height : calc( 50 * var(--remBase ) );
          right: 0;
          top : calc( 9 * var(--remBase ) );
        }
      }
    }
    p{
      margin-top : calc( 6 * var(--remBase ) );
      padding-top : calc( 10 * var(--remBase ) );
      padding-bottom : calc( 8 * var(--remBase ) );
      span{
        font-size : calc( 12 * var(--remBase ) );;
        line-height : 1.5;
      }
      img{
        margin-top : calc( 10 * var(--remBase ) );
        height : calc( 66 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    padding-top : calc( 64 * var(--remBase ) );
    padding-bottom : calc( 37 * var(--remBase ) );
    header{
      background : url( "../images/lp/special-course/bg_title03.avif" ) left top / contain no-repeat;
      width: 100%;
      height : calc( 401 * var(--remBase ) );
      padding-top : calc( 90 * var(--remBase ) );
      h2{
        text-align: center;
        font-size : calc( 40 * var(--remBase ) );;
        line-height : calc( 61 / 40 );;
      }
      ul{
        display: grid;
        grid-template-columns: 1fr auto;
        padding-left : calc( 68 * var(--contentBase ) );
        padding-right : calc( 140 * var(--contentBase ) );
        margin-top : calc( 5 * var(--remBase ) );
      }
      li{
        font-size : calc( 20 * var(--remBase ) );;
        line-height : 1.55;
        &:nth-child(1){
          grid-column: 1;
          grid-row: 1;
        }
        &:nth-child(6){
          grid-column: 2;
          grid-row: 1;
        }
        &:nth-child(2){
          grid-column: 1;
          grid-row: 2;
        }
        &:nth-child(7){
          grid-column: 2;
          grid-row: 2;
        }
        &:nth-child(3){
          grid-column: 1/-1;
          grid-row: 3;
        }
        &:nth-child(4){
          grid-column: 1/-1;
          grid-row: 4;
        }
        &:nth-child(5){
          grid-column: 1/-1;
          grid-row: 5;

        }
      }
    }
    p{
      position: relative;
      z-index: 1;
      margin-top : calc( 54 * var(--remBase ) );
      width : calc( 872 * var(--contentBase ) );
      padding-top : calc( 28 * var(--remBase ) );
      padding-block : calc( 11 * var(--remBase ) );
      margin-inline : auto;
      span{
        font-size : calc( 40 * var(--remBase ) );;
        line-height : calc( 61 / 40 );;
      }
      img{
        height : calc( 200 * var(--remBase ) );
        margin-top : calc( 7 * var(--remBase ) );
      }
      &:before , &:after , > span:before , > span:after{
        content:"";
        display: block;
        font-size: 0;
        position: absolute;
        bottom: calc( 100% - calc( 2 * var(--remBase) ) );
        background-repeat: no-repeat;
        background-size: contain;
        background-position: 0 0;
        width: auto;
      }
      &:before{
        background-image: url("../images/lp/special-course/char01.avif");
        aspect-ratio: 63/125;
        height : calc( 125 * var(--remBase ) );
        left : calc( 80 * 100% / 872 );
      }
      &:after{
        background-image: url("../images/lp/special-course/char02.avif");
        aspect-ratio: 84/120;
        height : calc( 120 * var(--remBase ) );
        left : calc( 260 * 100% / 872 );
      }
      > span{
        &:before{
          background-image: url("../images/lp/special-course/char03.avif");
          aspect-ratio: 84/106;
          height : calc( 106 * var(--remBase ) );
          left : calc( 440 * 100% / 872 );
        }
        &:after{
          background-image: url("../images/lp/special-course/char04.avif");
          aspect-ratio: 63/114;
          height : calc( 114 * var(--remBase ) );
          left : calc( 660 * 100% / 872 );
        }
      }
    }
  }
}
#specialCourse04{
  background-color: #f7e7ce;
  .box{
    p{
      text-align: right;
      color:var(--blue02);
      font-weight: 700;
    }
  }
  @media screen and ( width <= 768px ){
    padding-top : calc( 9 * var(--remBase ) );
    padding-bottom : calc( 20 * var(--remBase ) );
    ul{
      display: grid;
      grid-template-columns: repeat( 3 , auto );
      img{
        height : calc( 90 * var(--remBase ) );
      }
    }
    .titles{
      margin-top : calc( 10 * var(--remBase ) );
    }
    .box{
      margin-top : calc( 6 * var(--remBase ) );
      width: fit-content;
      margin-inline : auto;
      p{
        font-size : calc( 12 * var(--remBase ) );;
        line-height : calc( 14 / 12 );;
      }
      img{
        height : calc( 143 * var(--remBase ) );
      }
    }
    > p{
      margin-top : calc( 10 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    padding-top : calc( 27 * var(--remBase ) );
    padding-bottom : calc( 31 * var(--remBase ) );
    position: relative;
    overflow-x: clip;
    ul{
      margin-inline : auto;
      position: relative;
      width: fit-content;
      li:nth-child(1) , li:nth-child(3){
        position: absolute;
        top: 0;
      }
      li:nth-child(1){
        right: 100%;
      }
      li:nth-child(3){
        left: 100%;
      }
      img{
        height : calc( 292 * var(--remBase ) );
      }
    }
    .titles{
      margin-top : calc( 33 * var(--remBase ) );
    }
    .box{
      margin-top : calc( 10 * var(--remBase ) );
      width: fit-content;
      margin-inline : auto;
      display: grid;
      grid-auto-flow: row;
      img{
        height : calc( 408 * var(--remBase ) );
      }
      p{
        order:2;
        font-size : calc( 17 * var(--remBase ) );;
        line-height : 1.4;
      }
    }
    > p{
      margin-top : calc( 35 * var(--remBase ) );
    }
  }
}
#specialCourse05{
  @media screen and ( width <= 768px ){
    padding-top : calc( 59 * var(--remBase ) );
    .lede{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
      margin-bottom : calc( 36 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    padding-top : calc( 38 * var(--remBase ) );
    .lede{
      width : calc( 560 * var(--contentBase ) );
      margin-inline : auto;
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
      margin-bottom : calc( 23 * var(--remBase ) );
    }
  }
}
/*--------------------------------------------
KAWAI ONEF OR SCHOOL
---------------------------------------------*/
#kawaioneforschools{
  ol{
    background-image: url("../images/kawaioneforschool/arrow.svg");
    background-position: center top;
    background-repeat: no-repeat;
    p , li li{
      color:#1C2984;
      font-weight: 700;
    }
    font-weight: 700;
    > li:nth-child(1){
      display: grid;
      grid-auto-flow: column;
      align-items: center;
      grid-template-columns: auto 1fr;
      grid-column: 1/-1;
      grid-row: 1;
    }
    > li:nth-child(2){
      grid-row: 3/5;
      grid-column: 2;
      img{
        margin-inline : auto;
        display: block;
      }
      p{
        text-align: center;
      }
    }
    > li:nth-child(3){
      grid-column: 4;
      grid-row: 4/-1;
      li{
        text-align: right;
      }
    }
  }
  @media screen and ( width <= 768px ){
    ol{
      padding-left : calc( 20 * var(--contentBase ) );
      margin-top : calc( 6 * var(--remBase ) );
      background-size: auto calc( 183 * var(--remBase) );
      min-height: calc( 183 * var(--remBase) );
      display: grid;
      grid-template-rows: auto calc( 8 * var(--remBase) ) calc( 22 * var(--remBase) ) auto 1fr;
      grid-template-columns: calc( 20 * 100% / 280 ) auto 1fr auto;
      > li:nth-child(1){
        margin-top : calc( 10 * var(--remBase ) );
        column-gap : calc( 20 * var(--contentBase ) );
        img{
          height : calc( 45 * var(--remBase ) );
        }
        p{
          font-size : calc( 10 * var(--remBase ) );;
          line-height : 1.4;
        }
      }
      > li:nth-child(2){
        img{
          height : calc( 45 * var(--remBase ) );
        }
        p{
          font-size : calc( 8 * var(--remBase ) );;
          line-height : 1.4;
          margin-top : calc( 6 * var(--remBase ) );
          span{
            display: block;
            text-align: center;
            font-size : calc( 10 * var(--remBase ) );;
            line-height : 1.4;
          }
        }
      }
      > li:nth-child(3){
        li{
          + li{
            margin-top : calc( 52 * var(--remBase ) );
          }
          font-size : calc( 10 * var(--remBase ) );;
          line-height : 1.4;
          white-space: nowrap;
        }
      }
    }
    > picture{
      margin-top : calc( 20 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    ol{
      margin-top : calc( 26 * var(--remBase ) );
      background-size: auto calc( 542 * var(--remBase) );
      min-height: calc( 542 * var(--remBase) );
      display: grid;
      grid-template-rows: auto calc( 40 * var(--remBase) ) calc( 59 * var(--remBase) ) auto 1fr;
      grid-template-columns: calc( 140 * var(--contentBase) ) auto 1fr auto;
      > li:nth-child(1){
        margin-top : calc( 6 * var(--remBase ) );
        column-gap : calc( 20 * var(--contentBase ) );
        img{
          height : calc( 153 * var(--remBase ) );
        }
        p{
          font-size : calc( 20 * var(--remBase ) );;
          line-height : 1.4;
        }
      }
      > li:nth-child(2){
        img{
          height : calc( 153 * var(--remBase ) );
        }
        p{
          font-size : calc( 20 * var(--remBase ) );;
          line-height : 1.4;
          margin-top : calc( 15 * var(--remBase ) );
        }
      }
      > li:nth-child(3){
        li{
          + li{
            margin-top : calc( 150 * var(--remBase ) );
          }
          font-size : calc( 25 * var(--remBase ) );;
          line-height : 1.4;
        }
      }
    }
    > picture{
      margin-top : calc( 8 * var(--remBase ) );
    }
  }
}
/*--------------------------------------------
STUDY ABROAD
---------------------------------------------*/
#studyabroads{
  h2{
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    font-weight: 700;
    align-items: center;
    img{
      grid-column: 1;
    }
    span{
      grid-column: 2;
    }
    span:before{
      content:attr(data-en);
      display: block;
    }
  }
  footer{
    p{
      text-indent: 1em;
    }
    p + p{
      margin-top: 1lh;
    }
  }
  @media screen and ( width <= 768px ){
    ul{
      margin-top : calc( 37 * var(--remBase ) );
      width : calc( 280 * var(--contentBase ) );
      margin-inline : auto;
      border-top : solid calc( 2 * var(--remBase) ) #9999ff;
      padding-top : calc( 10 * var(--remBase ) );
    }
    li{
      + li{
        margin-top : calc( 28 * var(--remBase ) );
      }
    }
    h2{
      column-gap : calc( 10 * 100% / 280 );
      span{
        font-size : calc( 14 * var(--remBase ) );;
        line-height : calc( 19.6 / 14 );;
      }
    }
    li{
      picture{
        margin-top : calc( 15 * var(--remBase ) );
      }
      p{
        margin-top : calc( 12 * var(--remBase ) );
        font-size : calc( 11 * var(--remBase ) );;
        line-height : calc( 17 / 11 );;
      }
    }
    li:nth-child(1){
      h2 img{
        height : calc( 49 * var(--remBase ) );
      }
    }
    li:nth-child(2){
      h2 img{
        height : calc( 57 * var(--remBase ) );
      }
    }
    li:nth-child(3){
      h2 img{
        height : calc( 29 * var(--remBase ) );
      }
    }
    li:nth-child(4){
      h2 img{
        height : calc( 70 * var(--remBase ) );
      }
    }
    li:nth-child(5){
      h2 img{
        height : calc( 69 * var(--remBase ) );
      }
    }
    li:nth-child(6){
      h2 img{
        height : calc( 52 * var(--remBase ) );
      }
    }
    footer{
      border-top : solid calc( 2 * var(--remBase) ) #9999ff;
      padding-inline : calc( 10 * var(--contentBase ) );
      margin-top : calc( 33 * var(--remBase ) );
      padding-top : calc( 30 * var(--remBase ) );
      p{
        font-size : calc( 11 * var(--remBase ) );;
        line-height : 1.4;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    ul{
      margin-top : calc( 38 * var(--remBase ) );
      border-top : solid calc( 3 * var(--remBase) ) #9999ff;
      padding-top : calc( 30 * var(--remBase ) );
    }
    li{
      + li{
        margin-top : calc( 66 * var(--remBase ) );
      }
      position: relative;
      min-height: calc( 347 * var(--remBase) );
      padding-left : calc( 380 * var(--contentBase ) );
      picture{
        position: absolute;
        left : calc( -160 * var(--contentBase ) );
        top: 0;
        img{
          height : calc( 347 * var(--remBase ) );
        }
      }
    }
    h2{
      column-gap : calc( 12 * 100% / 600 );
      span{
        font-size : calc( 25 * var(--remBase ) );;
        line-height : 1.4;
      }
    }
    li p{
      margin-top : calc( 16 * var(--remBase ) );
      font-size : calc( 15 * var(--remBase ) );;
      line-height : 1.6;
      padding-left : calc( 24 * 100% / 600 );
    }
    li:nth-child(1){
      h2 img{
        height : calc( 65 * var(--remBase ) );
      }
    }
    li:nth-child(2){
      h2 img{
        height : calc( 72 * var(--remBase ) );
      }
    }
    li:nth-child(3){
      h2 img{
        height : calc( 55 * var(--remBase ) );
      }
    }
    li:nth-child(4){
      h2 img{
        height : calc( 96 * var(--remBase ) );
      }
    }
    li:nth-child(5){
      h2 img{
        height : calc( 82 * var(--remBase ) );
      }
    }
    li:nth-child(6){
      h2 img{
        height : calc( 82 * var(--remBase ) );
      }
    }
    footer{
      width : calc( 950 * var(--contentBase ) );
      margin-inline : auto;
      border-top : solid calc( 3 * var(--remBase) ) #9999ff;
      margin-top : calc( 27 * var(--remBase ) );
      padding-top : calc( 20 * var(--remBase ) );
      p{
        font-size : calc( 15 * var(--remBase ) );;
        line-height : 1.4;
      }
    }
  }
}
/*--------------------------------------------
EIKEN
---------------------------------------------*/
#eikens .notes02{
  color:#2f2e2e;
  h2{
    font-weight: 400;
    color:#E83131;
  }
  li[data-before]{
    position: relative;
    padding-left: 1em;
    &:before{
      position: absolute;
      top: 0;
      left: 0;
    }
  }
  li:before , em , a{
    color:#E83131;
  }
  a{
    text-decoration: underline;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 20 * var(--remBase ) );
    padding-inline : calc( 10 * var(--contentBase ) );
    h2 , ul{
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.4;
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 39 * var(--remBase ) );
    display: block;
    width : calc( 800 * var(--contentBase ) );
    margin-inline : auto;
    h2 , ul{
      font-size : calc( 22 * var(--remBase ) );;
      line-height : calc( 31 / 22 );;
    }
  }
}
#eikens .keys{
  display: grid;
  outline-color: #b4b4b4;
  outline-style: solid;
  color:#2f2e2e;
  margin-inline : auto;
  grid-template-columns: repeat( 2 ,  50% );
  dt,dd{
    display: grid;
    align-items: center;
    padding-inline: 1em;
  }
  dt{
    background-color: #f1f1f1;
    font-weight: 700;
  }
  dd{
    font-weight: 500;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 16 * var(--remBase ) );
    width : calc( 280 * var(--contentBase ) );
    outline-width: calc( 1 * var(--remBase) );
    outline-offset: calc( -1 * var(--remBase) );
    > :where( dt,dd ){
      font-size : calc( 11 * var(--remBase ) );
      padding-block : calc( 6 * var(--remBase ) );
      &:not(:first-of-type){
        border-top : solid #b4b4b4 calc( 1 * var(--remBase) );
      }
    }
    dd{
      border-left : solid #b4b4b4 calc( 1 * var(--remBase) );
    }
    + .caution{
      margin-top : calc( 12 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 32 * var(--remBase ) );
    width : calc( 440 * var(--contentBase ) );
    outline-width: calc( 2 * var(--remBase) );
    outline-offset: calc( -2 * var(--remBase) );
    > :where( dt,dd ){
      font-size : calc( 18 * var(--remBase ) );
      padding-block : calc( 10 * var(--remBase ) );
      &:not(:first-of-type){
        border-top : solid #b4b4b4 calc( 2 * var(--remBase) );
      }
    }
    dd{
      border-left : solid #b4b4b4 calc( 2 * var(--remBase) );
    }
    + .caution{
      text-align: center;
      margin-top : calc( 16 * var(--remBase ) );
    }
  }
}
#eikens .access{
  picture{
    display: grid;
    justify-content: center;
    align-items: center;
    &:before{
      content:"";
      display: block;
      font-size: 0;
      background : url( "../images/eiken/arrow.avif" ) center / contain no-repeat;
      aspect-ratio: 282/210;
      grid-row: 1;
    }
    img{
      grid-row: 1;
    }
  }
  p{
    text-align: center;
    a{
      color:#1D2CF3;
      text-decoration: underline;
      display: inline;
      margin-left: 1em;
    }
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 20 * var(--remBase ) );
    picture{
      grid-template-columns: auto auto;
      column-gap : calc( 10 * var(--contentBase ) );
      &:before{
        height : calc( 51 * var(--remBase ) );
        grid-column: 1;
      }
      img{
        grid-column: 2;
        height : calc( 97 * var(--remBase ) );
      }
    }
    p{
      margin-top : calc( 6 * var(--remBase ) );
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.6;
    }
  }
  @media print,screen and ( width > 768px ){
    grid-template-columns: auto auto auto ;
    margin-top : calc( 20 * var(--remBase ) );
    column-gap : calc( 20 * var(--contentBase ) );
    picture{
      column-gap : calc( 20 * var(--contentBase ) );
      &:before{
        height : calc( 105 * var(--remBase ) );
        grid-column: 2;
      }
      &:after{
        content:"";
        display: block;
        grid-column: 1;
        aspect-ratio: 204/199;
        grid-row: 1;
      }
      &:after , img{
        height : calc( 142 * var(--remBase ) );
      }
      img{
        grid-column: 3;
      }
    }
    p{
      margin-top : calc( 18 * var(--remBase ) );
      font-size : calc( 22 * var(--remBase ) );;
      line-height : calc( 35 / 22 );;
    }
  }
}
#eikens .price , #eikens .limit{
  color:#2f2e2e;
  h2{
    font-weight: 700;
  }
  @media screen and ( width <= 768px ){
    h2{
      font-size : calc( 16 * var(--remBase ) );;
      line-height : calc( 23 / 16 );;
    }
  }
  @media print,screen and ( width > 768px ){
    h2{
      font-size : calc( 25 * var(--remBase ) );;
      line-height : 1.4;
    }
  }
}
#eikens .price{
  dl{
    display: grid;
    grid-auto-flow: column;
    grid-template-rows: repeat(2, auto);
    outline-style: solid;
    outline-color: #2f2e2e;
    font-weight: 700;
  }
  dt,dd{
    padding-inline: .5em;
  }
  dt{
    text-align: center;
    background-color: var(--bgColor);
  }
  dd{
    text-align: right;
  }
  p{
    text-align: right;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 13 * var(--remBase ) );
    dl{
      margin-top : calc( 30 * var(--remBase ) );
      width : calc( 270 * var(--contentBase ) );
      margin-left: auto;
    }
    dl{
      outline-width: calc( 1  * var(--remBase) );
      outline-offset: calc( -1  * var(--remBase) );
      margin-top : calc( 20 * var(--remBase ) );
    }
    dt,dd{
      padding-block : calc( 5.5 * var(--remBase ) );
      font-size : calc( 11 * var(--remBase ) );
      &:not(:first-of-type){
        border-left : solid calc( 1  * var(--remBase) ) #2f2e2e;
      }
    }
    dd{
      border-top : solid calc( 1  * var(--remBase) ) #2f2e2e;
    }
    p{
      font-size : calc( 9 * var(--remBase ) );;
      line-height : calc( 21 / 9 );;
      margin-top : calc( 4 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    align-items: start;
    grid-template-columns: auto calc(  500 * var(--contentBase) );
    column-gap : calc( 40 * var(--contentBase ) );
    margin-top : calc( 80 * var(--remBase ) );
    justify-content: center;
    dl{
      outline-width: calc( 2  * var(--remBase) );
      outline-offset: calc( -2  * var(--remBase) );
      margin-top : calc( 20 * var(--remBase ) );
    }
    dt,dd{
      padding-block : calc( 10 * var(--remBase ) );
      font-size : calc( 20 * var(--remBase ) );
      &:not(:first-of-type){
        border-left : solid calc( 2  * var(--remBase) ) #2f2e2e;
      }
    }
    dd{
      border-top : solid calc( 2  * var(--remBase) ) #2f2e2e;
    }
    p{
      font-size : calc( 15 * var(--remBase ) );;
      line-height : calc( 35 / 15 );;
    }
  }
}
#eikens .limit{
  dl{
    display: grid;
    grid-template-columns: auto auto;
    justify-content: center;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 22 * var(--remBase ) );
    dl{
      margin-top : calc( 10 * var(--remBase ) );
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 19 / 11 );;
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 6 * var(--remBase ) );
    width : calc( 720 * var(--contentBase ) );
    margin-inline : auto;
    dl{
      margin-top : calc( 18 * var(--remBase ) );
      font-size : calc( 22 * var(--remBase ) );;
      line-height : calc( 35 / 22 );;
    }
  }
}
#eikens .caution02{
  color:#FF4040;
  font-weight: 700;
  @media screen and ( width <= 768px ){
    padding-inline: 1em;
    margin-top : calc( 7 * var(--remBase ) );
    font-size : calc( 11 * var(--remBase ) );;
    line-height : calc( 16 / 11 );;
  }
  @media print,screen and ( width > 768px ){
    text-align: center;
    margin-top : calc( 19 * var(--remBase ) );
    font-size : calc( 20 * var(--remBase ) );;
    line-height : 1.4;
  }
}
/*--------------------------------------------
TUTORS
---------------------------------------------*/
#tutors{
  @media screen and ( width <= 768px ){
    section{
      margin-top : calc( 13 * var(--remBase ) );
      ul{
        font-size : calc( 12 * var(--remBase ) );;
        line-height : 1.5;
      }
      li + li{
        margin-top: 1lh;
      }
      p{
        margin-top: 1lh;
        font-size : calc( 12 * var(--remBase ) );;
        line-height : 1.5;
      }
    }
    h2{
      font-size : calc( 12 * var(--remBase ) );;
      line-height : 1.5;
    }
    .contentAuthor{
      margin-top : calc( 14 * var(--remBase ) );
    }
  }
  @media print,screen and ( width > 768px ){
    section{
      margin-top : calc( 47 * var(--remBase ) );
      ul{
        font-size : calc( 17 * var(--remBase ) );;
        line-height : calc( 26 / 17 );;
      }
      li + li{
        margin-top: 1lh;
      }
      p{
        margin-top: 1lh;
        font-size : calc( 17 * var(--remBase ) );;
        line-height : calc( 26 / 17 );;
      }
    }
    h2{
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
    }
    .contentAuthor{
      margin-top : calc( 30 * var(--remBase ) );
    }
  }
}
/*--------------------------------------------
VOICE
---------------------------------------------*/
#voices{
  position: relative;
  overflow-x: clip;
  ul{
    position: relative;
    &:before{
      aspect-ratio: 1024/682;
      height: auto;
      left: 50%;
      translate: -50% 0;
      content:"";
      display: block;
      background-image: url( "../images/voice/bg.avif" );
      background-repeat: no-repeat;
      position: absolute;
      font-size: 0;
      top: 0;
      z-index: -1;
      background-position: center 0;
      background-size: 100% auto;
    }
  }
  li , a{
    width: 100%;
    height: 100%;
  }
  a{
    outline : solid calc( 2 * var(--remBase) ) #1c2984;
    color:white;
    outline-offset : calc( -2 * var(--remBase) );
    font-weight: 700;
    display: grid;
    place-items:center;
    background-color: #1c2984;
  }
  @media screen and ( width <= 768px ){
    > ul{
      &:before{
        width : calc( 320 * var(--contentBase ) );
      }
      display: flex;
      flex-direction: column;
      row-gap : calc( 6 * var(--remBase ) );
      height : calc( 214 * var(--remBase ) );
      justify-content: center;
      align-items: end;
    }
    li{
      height : calc( 20 * var(--remBase ) );
      width: fit-content;
    }
    a{
      padding-inline : 1em;
      font-size : calc( 10 * var(--remBase ) );
      min-width: calc( 146 * var(--remBase) );
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( -37 * var(--remBase ) );
    > ul{
      &:before{
        width : calc( 1024 * var(--contentBase ) );
      }
      display: grid;
      height : calc( 682 * var(--remBase ) );
      row-gap : calc( 17 * var(--remBase ) );
      grid-auto-rows: calc( 56 * var(--remBase) );
      grid-template-columns: calc( 583 * var(--contentBase) );
      align-content: center;
      justify-content: end;
    }
    a{
      font-size : calc( 40 * var(--remBase ) );
    }
  }
}
@media ( hover : hover ){
  #voices a:hover{
    background-color: white;
    color:#1c2984;
  }
}
@media ( prefers-reduced-motion : no-preference ){
  #voices a{
    transition: color var(--transitionBase) , background-color var(--transitionBase);
  }
}
/*--------------------------------------------
ENTERING
---------------------------------------------*/
#enterings{
  > ol{
    > li{
      counter-increment: no;
    }
  }
  h2{
    font-weight: 400;
    text-align: center;
    &:before , &:after{
      color:white;
      position: absolute;
    }
    &:before{
      content:"STEP";
      font-weight: 400;
    }
    &:after{
      content:counter(no);
      font-weight: 700;
    }
    span{
      color:#DE5021
    }
  }
  dl{
    > div{
      display: grid;
      align-items: baseline;
      justify-content: start;
      grid-auto-flow: column;
    }
  }
  p{
    em{
      color:#DE5021;
    }
  }
  address{
    font-style: normal;
    a{
      color:white;
      outline : solid 1px #00CC99;
      background-color: #00CC99;
      outline-offset : -1px;
      border-radius: 100vmax;
      display: grid;
      place-items:center;
    }
  }
  @media screen and ( width <= 768px ){
    > ol{
      > li{
        + li{
          margin-top : calc( -50 * var(--remBase ) );
          padding-top : calc( 69 * var(--remBase ) );
          h2{
            &:before , &:after{
              top : calc( 46 * var(--remBase ) );
            }
          }
        }
        padding-bottom : calc( 46 * var(--remBase ) );
        position: relative;
        clip-path: polygon( 0 0, 100% 0, 100% calc( 100% - 50 * var(--remBase) ), 50% 100%, 0 calc( 100% - 50 * var(--remBase) ));
        &:nth-child(1){
          background-color: #41BDF2;
          z-index: 5;
          padding-top : calc( 10 * var(--remBase ) );
          h2{
            padding-left : calc( 56 * var(--contentBase ) );
          }
        }
        &:nth-child(2){
          background-color: #41DEF2;
          z-index: 4;
        }
        &:nth-child(3){
          background-color: #69FA99;
          z-index: 3;
        }
        &:nth-child(4){
          background-color: #F2C074;
          z-index: 2;
        }
        &:nth-child(5){
          background-color: #F29174;
          z-index: 1;
        }
      }
    }
    h2{
      font-size : calc( 14 * var(--remBase ) );;
      line-height : calc( 22 / 14 );;
      &:before , &:after{
        position: absolute;
        top : calc( 10 * var(--remBase ) );
        font-size : calc( 18 * var(--remBase ) );;
        line-height : calc( 22 / 18 );;
      }
      &:before{
        left : calc( 7 * var(--contentBase ) );
      }
      &:after{
        left : calc( 7 * var(--contentBase ) + 2.5em );
      }
    }
    ol{
      > li{
        > div{
          padding-inline : calc( 10 * var(--contentBase ) );
          margin-top : calc( 10 * var(--remBase ) );
          font-size : calc( 12 * var(--remBase ) );;
          line-height : 1.5;
          dl{
            width: fit-content;
            margin-inline : auto;
          }
        }
      }
    }
    address{
      margin-top : calc( 22 * var(--remBase ) );
      a{
        margin-inline : auto;
        width : calc( 120 * var(--contentBase ) );
        height : calc( 42 * var(--remBase ) );
        font-size : calc( 14 * var(--remBase ) );
      }
      p{
        text-align: center;
        margin-top : calc( 7 * var(--remBase ) );
        font-size : calc( 13 * var(--remBase ) );;
        line-height : calc( 20 / 13 );;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    ol{
      position: relative;
    }
    h2{
      position: absolute;
      font-size : calc( 20 * var(--remBase ) );;
      line-height : 1.6;
      width : calc( 364 * 100% / 932 );
      left : calc( 60 * 100% / 932 );
      clip-path: polygon( 0 0, 100% 0, 100% calc( 100% - 80 * var(--remBase) ), 50% 100%, 0 calc( 100% - 80 * var(--remBase) ));
      &:before , &:after{
        font-size : calc( 28 * var(--remBase ) );;
        line-height : 1.5;
      }
      &:before{
        left : calc( 20 * 100% / 364 );
      }
      &:after{
        left : calc( 20 * 100% / 364 + 2.5em );
      }
    }
    li:nth-child(1){
      h2{
        top: 0;
        padding-top : calc( 58 * var(--remBase ) );
        height : calc( 170 * var(--remBase ) );
        background-color: #41BDF2;
        z-index: 5;
        &:before , &:after{
          top : calc( 16 * var(--remBase ) );
        }

      }
    }
    li + li{
      h2{
        padding-top : calc( 87 * var(--remBase ) );
        &:before , &:after{
          top : calc( 40 * var(--remBase ) );
        }
      }
    }
    li:nth-child(2){
      h2{
        top : calc( 90 * var(--remBase ) );
        background-color: #41DEF2;
        height : calc( 192 * var(--remBase ) );
        z-index: 4;
      }
    }
    li:nth-child(3){
      h2{
        top : calc( 202 * var(--remBase ) );
        background-color: #69FA99;
        height : calc( 192 * var(--remBase ) );
        z-index: 3;
      }
    }
    li:nth-child(4){
      h2{
        top : calc( 312 * var(--remBase ) );
        background-color: #F2C074;
        height : calc( 158 * var(--remBase ) );
        z-index: 2;
      }
    }
    li:nth-child(5){
      h2{
        top : calc( 390 * var(--remBase ) );
        background-color: #F29174;
        height : calc( 158 * var(--remBase ) );
        z-index: 1;
      }
    }
    li > div{
      width : calc( 408 * 100% / 932 );
      margin-left : calc( 464 * 100% / 932 );
      padding-top: 1em;
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 26 / 17 );;
      * + p{
        margin-top: 1em;
      }
    }
    address{
      width : calc( 468 * 100% / 932 );
      margin-left : auto;
      margin-top : calc( 18 * var(--remBase ) );
      a{
        width : calc( 152 * 100% / 468 );
        height : calc( 50 * var(--remBase ) );
        font-size : calc( 15 * var(--remBase ) );
      }
      p{
        text-align: right;
        font-size : calc( 17 * var(--remBase ) );;
        line-height : calc( 26 / 17 );;
      }
    }
  }
}
@media ( hover : hover ){
  #enterings a:hover{
    background-color: white;
    color:#00CC99;
  }
}
@media ( prefers-reduced-motion : no-preference ){
  #enterings a{
    transition: background-color var(--transitionBase) , color var(--transitionBase);
  }
}
/*--------------------------------------------
TEST
---------------------------------------------*/
:where( #zento , #shinkyoken , #newskentei ){
  &:before{
    content:"";
    display: block;
    height : calc( 29 * var(--remBase ) );
    background : url( "../images/test/border.webp" ) left top / 100% 100% no-repeat;
    margin-bottom : calc( 9 * var(--remBase ) );
  }
}
#zento{
  hgroup{
    p{
      font-weight: 700;
      color:#56EB25;
      > span:nth-of-type(1){
        color:#1AED48;
      }
    }
    h2{
      text-align: center;
    }
  }
  @media screen and ( width <= 768px ){
    padding-bottom : calc( 20 * var(--remBase ) );
    hgroup{
      display: block;
      width: fit-content;
      margin-inline : auto;
      p{
        font-size : calc( 14 * var(--remBase ) );;
        line-height : calc( 24 / 14 );;
        > span:nth-of-type(1){
          font-size : calc( 17 * var(--remBase ) );;
          line-height : calc( 24 / 17 );;
        }
        > span:nth-of-type(2){
          font-size : calc( 11 * var(--remBase ) );;
          line-height : calc( 24 / 11 );;
        }
      }
      h2{
        img{
          height : calc( 67 * var(--remBase ) );
        }
      }
    }
    > p{
      margin-top : calc( 10 * var(--remBase ) );
      padding-inline : calc( 10 * var(--contentBase ) );
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 15 / 11 );;
    }
    > picture{
      margin-top : calc( 10 * var(--remBase ) );
      text-align: center;
      img{
        height : calc( 261 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    padding-bottom : calc( 40 * var(--remBase ) );
    hgroup{
      p{
        display: grid;
        align-items: baseline;
        justify-content: center;
        grid-auto-flow: column;
        font-size : calc( 22 * var(--remBase ) );;
        line-height : calc( 45 / 22 );;
        > span:nth-of-type(1){
          font-size : calc( 30 * var(--remBase ) );;
          line-height : 1.5;
        }
        > span:nth-of-type(2){
          font-size : calc( 18 * var(--remBase ) );;
          line-height : 2.5;
        }
      }
      h2{
        img{
          height : calc( 144 * var(--remBase ) );
        }
      }
    }
    > p{
      text-align: center;
      margin-top : calc( 27 * var(--remBase ) );
      font-size : calc( 20 * var(--remBase ) );;
      line-height : 1.4;
    }
    > picture{
      margin-top : calc( 16 * var(--remBase ) );
      text-align: center;
      img{
        height : calc( 560 * var(--remBase ) );
      }
    }
  }
}
#shinkyoken{
  h2{
    text-align: center;
  }
  p{
    &:nth-of-type(1){
      text-align: center;
    }
    &:nth-of-type(2){
      strong{
        color:#E83131;
        font-weight: 700;
      }
    }
  }
  > picture{
    text-align: center;
  }
  dt{
    color:#8B0000;
    font-weight: 700;
    &:after{
      color:var(--base);
    }
  }
  @media screen and ( width <= 768px ){
    padding-bottom : calc( 20 * var(--remBase ) );
    h2{
      img{
        height : calc( 102 * var(--remBase ) );
      }
    }
    p{
      &:nth-of-type(1){
        margin-top : calc( 10 * var(--remBase ) );
        img{
          height : calc( 23 * var(--remBase ) );
        }
      }
      &:nth-of-type(2){
        margin-top : calc( 6 * var(--remBase ) );
        font-size : calc( 12 * var(--remBase ) );;
        line-height : 1.5;
        span{
          font-size : calc( 10 * var(--remBase ) );;
          line-height : 1.8;
        }
      }
      &:nth-of-type(3){
        font-size : calc( 10 * var(--remBase ) );;
        line-height : 1.4;
      }
      &:nth-of-type(4){
        font-size : calc( 10 * var(--remBase ) );;
        line-height : 1.4;
        margin-top : 1lh;
      }
    }
    > picture{
      margin-top : calc( 10 * var(--remBase ) );
      img{
        height : calc( 350 * var(--remBase ) );
      }
    }
    .box{
      margin-top : calc( 10 * var(--remBase ) );
    }
    dt{
      font-size : calc( 13 * var(--remBase ) );;
      line-height : calc( 20 / 13 );;
    }
    dd{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
      +dt{
        margin-top : calc( 17 * var(--remBase ) );
      }
    }
  }
  @media print,screen and ( width > 768px ){
    padding-bottom : calc( 40 * var(--remBase ) );
    h2{
      img{
        height : calc( 219 * var(--remBase ) );
      }
    }
    p{
      &:nth-of-type(1){
        margin-top : calc( 22 * var(--remBase ) );
        img{
          height : calc( 49 * var(--remBase ) );
        }
      }
      &:nth-of-type(2){
        margin-top : calc( 29 * var(--remBase ) );
        font-size : calc( 20 * var(--remBase ) );;
        line-height : 1.55;
        span{
          font-size : calc( 17 * var(--remBase ) );;
          line-height : calc( 31 / 17 );;
        }
      }
      &:nth-of-type(3){
        font-size : calc( 17 * var(--remBase ) );;
        line-height : calc( 26 / 17 );;
      }
      &:nth-of-type(4){
        font-size : calc( 17 * var(--remBase ) );;
        line-height : calc( 26 / 17 );;
        margin-top : calc( 51 * var(--remBase ) );
        width : calc( 586 * 100% / 932 );
        margin-inline : auto;
      }
    }
    > picture{
      margin-top : calc( 56 * var(--remBase ) );
      img{
        height : calc( 751 * var(--remBase ) );
      }
    }
    .box{
      margin-top : calc( 26 * var(--remBase ) );
      display: grid;
      align-items: start;
      grid-auto-flow: column;
      justify-content: start;
      padding-left : calc( 173 * 100% / 932 );
      column-gap : calc( 160 * 100% / 759 );
      img{
        height : calc( 147 * var(--remBase ) );
      }
    }
    dt{
      font-size : calc( 22 * var(--remBase ) );;
      line-height : 1.5;
    }
    dd{
      font-size : calc( 18 * var(--remBase ) );;
      line-height : 1.5;
      +dt{
        margin-top : calc( 27 * var(--remBase ) );
      }
    }
  }
}
#newskentei{
  h2{
    text-align: center;
  }
  > picture{
    text-align: center;
  }
  @media screen and ( width <= 768px ){
    h2{
      img{
        height : calc( 62 * var(--remBase ) );
      }
    }
    > picture{
      &:nth-of-type(1){
        img{
          height : calc( 118 * var(--remBase ) );
        }
      }
      &:nth-of-type(2){
        margin-top : calc( 5 * var(--remBase ) );
        img{
          height : calc( 32 * var(--remBase ) );
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    h2{
      img{
        height : calc( 133 * var(--remBase ) );
      }
    }
    > picture{
      margin-top : calc( 3 * var(--remBase ) );
      img{
        height : calc( 352 * var(--remBase ) );
      }
    }
  }
}
#newskentei01{
  h3{
    display: grid;
    place-items:center;
    color:white;
    font-weight: 700;
    background-color: var(--blue02);
  }
  dt{
    border-radius: 50%;
    aspect-ratio: 1;
    width: auto;
    background-color: #D5004E;
    color:white;
    font-weight: 700;
    display: grid;
    place-items:center;
    text-align: center;
  }
  dd:nth-of-type(1){
    display: grid;
    align-items: baseline;
    grid-auto-flow: column;
    font-weight: 700;
  }
  h4{
    font-weight: 400;
  }
  form{
    display: grid;
    align-items: center;
    justify-content: start;
    grid-auto-flow: column;
    input , button{
      border: 0;
      box-shadow: none;
      outline : solid 1px #2F2E2E;
      outline-offset : -1px;
      color:#2F2E2E;
    }
    button{
      display: grid;
      place-items:center;
    }
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 20 * var(--remBase ) );
    h3{
      height : calc( 43 * var(--remBase ) );
      font-size : calc( 15 * var(--remBase ) );
    }
    .box{
      display: grid;
      grid-template-columns: calc( 10 * var(--contentBase) ) auto calc( 4 * var(--contentBase) ) auto 1fr;
      grid-template-rows: calc( 15 * var(--remBase) ) auto auto auto calc( 4 * var(--remBase) ) auto calc( 5 * var(--remBase) ) auto auto;
    }
    dl{
      display: contents;
    }
    dd:nth-of-type(1){
      grid-column: 4/-1;
      grid-row: 1/3;
      justify-content: start;
      padding-left : calc( 8 * var(--remBase ) );
      font-size : calc( 15 * var(--remBase ) );;
      line-height : 2;
      span{
        font-size : calc( 20 * var(--remBase ) );;
        line-height : 1.5;
      }
    }
    dt{
      grid-row: 2/5;
      grid-column: 1/3;
      height : calc( 62 * var(--remBase ) );
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.35;
    }
    dd:nth-of-type(2){
      display: contents;
      ul:nth-of-type(1){
        grid-column: 4/-1;
        grid-row: 3;
        display: flex;
        flex-wrap: wrap;
        font-size : calc( 12 * var(--remBase ) );;
        line-height : 1.5;
        column-gap : 1em;
        font-weight: 700;
      }
      p{
        grid-column: 4/-1;
        grid-row: 6;
        justify-self: start;
        align-self: center;
        font-size : calc( 11 * var(--remBase ) );;
        line-height : calc( 16 / 11 );;
      }
    }
    dd:nth-of-type(3){
      grid-column: 4/-1;
      grid-row: 6;
      justify-self: end;
      align-self: center;
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 16 / 11 );;
    }
    .box > div{
      grid-column: 2/-1;
      grid-row: 8;
    }
    h4{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 17 / 11 );;
    }
    form{
      grid-template-columns: calc( 124 * 100% / 290 ) calc( 36 * 100% / 290 );
      column-gap : calc( 10 * 100% / 290 );
      input{
        height : calc( 23 * var(--remBase ) );
        padding-inline : calc( 5 * var(--remBase ) );
        font-size : calc( 10 * var(--remBase ) );
      }
      button{
        height : calc( 23 * var(--remBase ) );
        font-size : calc( 10 * var(--remBase ) );
        border-radius : calc( 5 * var(--remBase ) );
      }
    }
    .box > p{
      grid-column: 2/-1;
      grid-row: 9;
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.5;
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 21 * var(--remBase ) );
    h3{
      height : calc( 76 * var(--remBase ) );
      font-size : calc( 30 * var(--remBase ) );
    }
    .box{
      display: grid;
      grid-template-columns: auto 1fr calc( 502 * 100% / 932 );
      justify-content: space-between;
      grid-template-rows: calc( 30 * var(--remBase) ) auto calc( 13 * var(--remBase) ) auto auto calc( 31 * var(--remBase) ) auto;
    }
    dl{
      display: contents;
    }
    dt{
      grid-column: 1;
      grid-row: 2/5;
      height : calc( 117 * var(--remBase ) );
      font-size : calc( 20 * var(--remBase ) );;
      line-height : 1.4;
      margin-top : calc( 8 * var(--remBase ) );
    }
    dd:nth-of-type(1){
      grid-column: 2;
      grid-row: 2;
      font-size : calc( 30 * var(--remBase ) );;
      line-height : 3;
      justify-content: center;
      span{
        font-size : calc( 60 * var(--remBase ) );;
        line-height : 1.5;
      }
    }
    dd:nth-of-type(2){
      display: contents;
      ul{
        &:nth-of-type(1){
          column-gap: 1.5em;
          grid-row: 1;
          grid-column: 2/-1;
          display: flex;
          justify-content: start;
          align-items: center;
          font-size : calc( 20 * var(--remBase ) );;
          line-height : 1.5;
          li{
            font-weight: 700;
          }
        }
        &:nth-of-type(2){
          column-gap: 1em;
          grid-column: 3;
          grid-row: 2/6;
          display: flex;
          flex-wrap: wrap;
          font-size : calc( 15 * var(--remBase ) );;
          line-height : calc( 23 / 15 );;
          column-gap: 1em;
        }
      }
      p{
        grid-column: 3;
        grid-row: 7;
        justify-self: center;
        align-self: center;
        font-size : calc( 15 * var(--remBase ) );;
        line-height : 1.2;
        padding-right: 2em;
      }
    }
    dd:nth-of-type(3){
      grid-column: 3;
      grid-row: 7;
      justify-self: end;
      align-self: center;
      font-size : calc( 15 * var(--remBase ) );;
      line-height : 1.2;
    }
    .box > div{
      grid-column: 1/3;
      grid-row: 4;
    }
    h4{
      padding-left : calc( 117 * 100% / 430 );
      font-size : calc( 15 * var(--remBase ) );;
      line-height : calc( 23 / 15 );;
    }
    form{
      margin-top : calc( 6 * var(--remBase ) );
      grid-template-columns: calc( 200 * 100% / 430 ) calc( 48 * 100% / 430 );
      column-gap : calc( 10 * 100% / 430 );
      input , button{
        height : calc( 33 * var(--remBase ) );
        font-size : calc( 15 * var(--remBase ) );
      }
      input{
        padding-inline : calc( 13 * 100% / 200 );
      }
      button{
        border-radius : calc( 5 * var(--remBase ) );
      }
    }
    .box > p{
      grid-column: 1/3;
      grid-row: 7;
      align-self: center;
      font-size : calc( 15 * var(--remBase ) );;
      line-height : 1.4;
    }
  }
}
#newskentei02{
  h3{
    color:white;
    font-weight: 700;
    text-align: center;
    background-color: #D5004E;
    display: grid;
    place-items:center;
  }
  h4{
    font-weight: 700;
    color: #D5004E;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 4 * var(--remBase ) );
    position: relative;
    padding-top : calc( 15 * var(--remBase ) );
    h3{
      position: absolute;
      right: 0;
      top: 0;
      width : calc( 108 * var(--contentBase ) );
      height : calc( 34 * var(--remBase ) );
      font-size : calc( 10 * var(--remBase ) );;
      line-height : 1.4;
      border-radius : calc( 8 * var(--remBase ) );
    }
    li + li{
      margin-top : calc( 22 * var(--remBase ) );
    }
    h4{
      font-size : calc( 15 * var(--remBase ) );;
      line-height : calc( 23 / 15 );;
      span{
        font-size : calc( 10 * var(--remBase ) );;
        line-height : 2.29;
      }
    }
    p{
      font-size : calc( 11 * var(--remBase ) );;
      line-height : calc( 15 / 11 );;
    }
  }
  @media print,screen and ( width > 768px ){
    display: grid;
    align-items: start;
    grid-template-columns: calc( 279 * 100% / 932 ) 1fr;
    column-gap : calc( 20 * 100% / 932 );
    margin-top : calc( 8 * var(--remBase ) );
    h3{
      grid-column: 1;
      font-size : calc( 30 * var(--remBase ) );;
      line-height : calc( 41 / 30 );;
      height : calc( 128 * var(--remBase ) );
      border-radius : calc( 20 * var(--remBase ) );
    }
    li + li{
      margin-top : calc( 6 * var(--remBase ) );
    }
    h4{
      font-size : calc( 35 * var(--remBase ) );;
      line-height : calc( 52 / 35 );;
      span{
        font-size : calc( 20 * var(--remBase ) );;
        line-height : 2.6;
      }
    }
    p{
      font-size : calc( 15 * var(--remBase ) );;
      line-height : calc( 23 / 15 );;
    }
  }
}
/*--------------------------------------------
CONTACT
---------------------------------------------*/
#contact02{
  h2{
    text-align: center;
    font-weight: 700;
    color:#2B7C74;
  }
  .note{
    width:fit-content;
    margin-inline : auto;
  }
  @media screen and ( width <= 768px ){
    margin-top : calc( 24 * var(--remBase ) );
    h2{
      font-size : calc( 17 * var(--remBase ) );;
      line-height : calc( 30 / 17 );;
    }
    .note{
      margin-top : calc( 46 * var(--remBase ) );
      p{
        padding-inline: 1em;
        font-size : calc( 12 * var(--remBase ) );;
        line-height : 1.5;
      }
      dl{
        display: grid;
        justify-content: center;
        grid-auto-flow: column;
        font-size : calc( 15 * var(--remBase ) );;
        line-height : 1.2;
      }
    }
  }
  @media print,screen and ( width > 768px ){
    margin-top : calc( 56 * var(--remBase ) );
    h2{
      font-size : calc( 30 * var(--remBase ) );;
      line-height : calc( 68 / 30 );;
    }
    .note{
      font-size: 0;
      margin-top : calc( 66 * var(--remBase ) );
      p,dl{
        font-size : calc( 13 * var(--remBase ) );;
        line-height : calc( 18 / 13 );;
      }
      p,dl,dt,dd{
        display: inline;
      }
      dl{
        padding-left: 1em;
      }
    }
  }
}
/*--------------------------------------------
PRIVACY
---------------------------------------------*/
#privacies{
  .update{
    display: grid;
    grid-auto-flow: column;
    align-items: baseline;
    justify-content: end;
  }
  h2 , h3 , h4 , p , dl , dt , dd , ul , li{
    font-weight: 400;
  }
  > p , > ul , > ul > li + li , h4{
    margin-top: 1lh;
  }
  .column{
    > div{
      display: grid;
      grid-auto-flow: column;
      justify-content: start;
      align-items: baseline;
    }
  }
  > ul{
    > li{
      > *:not(h3){
        padding-left: 1em;
      }
    }
  }
  h3{
    margin-bottom: 0.25em;
  }
  ul ul li:not([data-before]):not(:has(p)){
    counter-increment: no;
    position: relative;
    padding-left: 1.5em;
    &:before{
      content:counter(no)". ";
      padding-left: 0.25em;
      text-align: left;
      position: absolute;
      top: 0;
      left: 0;
    }
  }
  > ul > li > ul{
    margin-top: 0.25lh;
    li li{
      margin-top: 0.25lh;
    }
  }
  address{
    font-style: normal;
    > dl{
      margin-top: 1lh;
    }
  }
  @media screen and ( width <= 768px ){
    h2 , h3 , h4 , p , dl , dt , dd , ul , li{
      font-size : calc( 15 * var(--remBase ) );
      line-height : calc( 21 / 15 );
    }
    h2{
      margin-top : 1lh;
    }
    > ul > li > ul{
      > li + li{
        margin-top: 0.5lh;
      }
    }
    address{
      dl dl{
        dd{
          padding-left: 1em;
        }
        dt{
          margin-top: .25lh;
        }
      }
    }
  }
  @media print,screen and ( width > 768px ){
    h2 , h3 , h4 , p , dl , dt , dd , ul , li{
      font-size : calc( 15 * var(--remBase ) );
      line-height : calc( 21 / 15 );
    }
    > ul > li > ul{
      > li + li{
        margin-top: 0.75lh;
      }
    }
    address{
      > dl{
        dl div{
          display: grid;
          grid-auto-flow: column;
          justify-content: start;
          align-items: baseline;
        }
      }
    }
  }
}
/*--------------------------------------------
RECRUITMENTS
---------------------------------------------*/
#recruitments{
  dd , dd + dt{
    margin-top: 1lh;
  }
  @media screen and ( width <= 768px ){
    > ul , > dl{
      padding-inline:1em;
    }
  }
  @media print,screen and ( width > 768px ){
    .float-right-pc{
      picture{
        width : calc( 228 * 100% / 932 );
      }
    }
    > ul , > dl{
      padding-inline:4em;
    }
  }
}