@charset "UTF-8";
/* CSS Document */
@media(max-width:1150px){
  .sec-after-box.block01::before{
    z-index: 0;
    translate: 0 55%;
  }
}
@media(max-width:1000px){
  
  /*hero +++++++++++++++++*/
  .hero_inner .pic-go{
    right: 50%;
    bottom: max(-50px,-10vw);
    translate: 50% 100%;
  }
  .pic-road{
    z-index: 1;
  }
  /*oneday +++++++++++++++*/
  .sec-oneday-blc::before{
    z-index: 2;
    background-image: url("../images/pic/tree_sp.svg");
    aspect-ratio:1/2.7778;
  }
  .sec-oneday_intro{
    z-index: 3;
  }
}
@media(max-width:768px){
  .l-nav_menu{
    grid-template-columns: auto;
  }
  
  /*hero +++++++++++++++++*/
  .hero_inner .pic-flower{
    translate: -15% 100%;
  }
  
  /*oneday +++++++++++++++*/
  .pic-road .pic-bus.is-visible {
    translate: -70% -20%;
  }
  .pic-oneday01_wind01{
    top: 18%;
  }
  .pic-oneday01_wind02{
    bottom: 10%;
  }
  .pic-oneday-intro_grass{
    translate: -50% 100%;
  }
  .pic-oneday01_tree02{
    bottom: 20%;
  }
  .pic-oneday2_tree01{
    translate: 0 -82%;
  }
  .pic-aftr01-piyo{
    top: -82%;
    left: 85%;
    translate: 0% -35%;
  }
  .pic-oneday2_tree2{
    top: 45%;
    left: 0;
    translate:-10% 0;
  }
  .pic-oneday2_grass_lf{
    top: 70%;
  }
  .pic-oneday4_tree4{
    top: 60%;
  }
  .pic-oneday4_flower{
    width: min(100px,25vw);
    right: 0;
    translate: 25% 0;
  }
  .pic-oneday2_tree3{
    top: 87%;
    tlanslate:50% 0;
  }
  .pic-oneday3_ball{
    top: 42%;
  }
  .pic-oneday3_ccl{
    translate: 50% 0;
  }
  .pic-hill-flower01{
    top: 0;
    translate: 50% 25%;
  }
  .pic-hill-flower02{
    top: 0;
    translate: -50% 50%;
  }
  .pic-hill-tree{
    translate: -10% 0%;
    right: min(50px, 4vw);
  }
  .pic-hill-rabbit{
    translate: 0% -100%;
  }
  .pic-after_acorns{
    left: 82%;
    translate:0 120%;
  }
  .sec-after-box.block03 .after-wid-item::after{
    top: -42%;
    left: 5%;
  }
  /*detail*/
  .sec-after_intro{
    padding-top: min(35px,8vw);
  }
  .oneday-box01 .title{
    top: 43%;
    width: min(182px,44%);
  }
  .oneday-ccl-box.pos-lf{
    margin-right: 0;
  }
  .oneday-ccl-box.pos-rt{
    margin-left: 0;
  }
  .item-oneday.ccl{
    gap:min(60px,16vw);
  }
  .oneday-box03{
    margin-top: 0;
  }
  .oneday-box04 .thumb{
    translate: 0 0;
  }
  .oneday-box05 .oneday-rect-box .timeline{
    left: max(-20px,-5vw);
  }
  .oneday-box05 .title{
    width:min(200px,52%);
    top: 50%;
    translate: -20% -100%;
  }
  .oneday-box05 .in-title{
    right: 50%;
    translate: 50% -50%;
  }
  .oneday-box08 .timeline{
    left: auto;
    right: 0;
    translate: -10% -40%;
  }
  .oneday-box08 .title{
    width: min(200px,50%);
    translate: 10% -85%;
  }
  /*dot line*/
  .js-dot-path{
    stroke-width: 4.8px;
  }
  .blk01-line_1{
    width: 4.8px;
    top: 80%;
    translate: -50% 0;
  }
  .blk01-line_2{
    width: 4.8px;
    top: 50%;
    right: 50%;
    translate: -50% 0;
  }
  .blk01-line_3{
    width: 4.8px;
    top: 50%;
    left: 50%;
    translate: -100% 0;
  }
  .blk02-line_1{
    left: 40%
  }
  .blk02-line_2{
    width: 4.8px;
  }
  .blk02-line_3{
    width: 4.8px;
    rotate:0deg;
    left: 50%;
    translate: -50% 0;
  }
  .blk03-line_1{
    scale:-1 1;
    left: 18%;
    bottom: 100%;
    rotate:-25deg;
  }
  .blk03-line_2{
    width: 4.8px;
    top: 95%;
    translate: 50% 0;
  }
  .blk03-line_3{
    width: 4.8px;
    left: 50%;
    translate: -50% 80%;
  }

  
  /*after school +++++++++++++++++++*/
  .sec-after-box.block01 .after-wid-item{
    grid-template-columns: auto;
  }
  .after-min-item{
    margin-left: auto;
    margin-right: auto;
    -ms-align-items: center;
    align-items: center;
  }
  /*block01*/
  .sec-after-box.block01::before{
    width: min(200px,30vw);
    top: 50%;
    translate: 0 -70%;
    z-index: 0;
  }
  .sec-after-box.block01 .after-wid-item .comment::before{
    width: 120%;
    left: 45%;
  }
  .sec-after-box.block01 .after-wid-item .thumb{
    width: calc(100% + min(50px,4vw));
    translate:min(50px,4vw) 0;
    margin-top: min(25px, 5vw);
  }
  .pic-leaf_after01{
    right: auto;
    left: 0;
    top: max(-150px, -25vw);
  }
  .sec-after-box.block01 .after-min-item{
    margin-top: min(40px,10vw);
  }
  .pic-aftr-blk02{
    display: none;
  }
  .pic-leaf_after03{
    top: 40%;
  }
  /*block02*/
  .sec-after-box.block02 .after-wid-item{
    grid-template-columns: auto;
  }
  .sec-after-box.block02::before{
    z-index: 0;
    width: min(487px, 100vw);
    translate: 40% 0;
  }
  .sec-after-box.block02 .after-wid-item .comment::before{
    width: auto;
    height: 180%;
    translate: 50% -50%;
    right: 50%;
  }
  .sec-after-box.block02 .after-wid-item .thumb{
    translate:max(-50px,-6vw) 0;
  }
  .sec-after-box.block02 .after-wid-item .comment{
    margin-top: max(-65px,-15vw);
    width: 100%;
    grid-template-columns: 100%;
    padding-left: 0;
  }
  .sec-after-box.block02 .after-wid-item .comment > div{
    translate: 0 0;
  }
  .sec-after-box.block02 .after-wid-item .comment .in-title{
    translate:min(-15px,-2vw) 0;
  }
  /*block03*/
  .sec-after-box.block03{
    margin-top: min(50px,12vw);
  }
  .sec-after-box.block03 .after-wid-item{
    grid-template-columns:auto;
  }
  .sec-after-box.block03 .after-wid-item .comment::before{
    width: 150%;
  }
  .sec-after-box.block03 .after-wid-item .thumb{
    translate:max(-50px,-6vw);
    margin-top: min(10px,2.5vw);
  }
  .sec-after-box.block03 .after-min-item{
    margin-top: min(20px,5.333vw);
  }
  .pic-leaf_after04{
    bottom: 42%;
  }
  /*block04*/
  .pic-leaf_after05{
    width: min(70px, 14vw);
    bottom: auto;
    top: max(-70px,-15vw);
    left: 0;
    right: auto;
  }

  .sec-after-box.block04{
    margin-top: min(100px,26vw);
  }
  .sec-after-box.block04::before{
    content: "";
    background-color: #F4FAC9;
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: -25%;
    left: 0;
  }
  .sec-after-box.block04 .after-wid-item{
    grid-template-columns:auto;
  }
  .sec-after-box.block04 .after-wid-item .thumb{
    grid-area:2/1;
    margin-top: min(30px, 4vw);
    translate:max(-50px,-6vw);
  }
  .sec-after-box.block04 .after-wid-item .comment{
     grid-area:1/1;
  }
  .sec-after-box.block04 .after-wid-item .comment::before{
    top: 55%;
  }
  .pic-hash_aftr04{
    translate: 100% -200%;
  }
  .wall-after_hill{
    margin-top: max(-100px,-25vw);
  }
  .wall-mountain{
    aspect-ratio:1/0.2767;
  }
  .wall-mountain{
    scale:1.1;
  }
  .foot-about-box{
    margin-top: 0;
  }
}
@media(max-width:600px){
  .program-item{
    grid-template-columns: 100%;
  }
  .program-item figure{
    aspect-ratio:1/0.7333;
    overflow: hidden;
  }
  .program-item figure img{
    object-fit: cover;
    object-position: center;
    height: 100%;
  }
  .program-item .in-text{
    text-align: center;
  }
  
  .foot-more-box{
    padding-top: min(30px,5vw);
  }
}
@media(max-width:480px){
  .hero_inner{
    padding-top: min(25px,5vw);
  }
  .sec-oneday-blc::before{
    translate: 10% 0;
  }
  .oneday-title{
    margin-left: auto;
    margin-right: auto;
  }
  .sec-oneday-box.block01{
    margin-top: min(40px,8vw);
  }
  .oneday-box08 .in-title{
    width: 48%;
    translate: -5% 65%;
  }
  .pic-oneday2_tree2{
    top: 50%;
  }
  .pic-oneday4_tree4{
    top: 75%;
  }
  .pic-oneday4_flower{
    top: 85%;
  }
  .pic-oneday3_wind{
    scale:130%;
  }
  .sec-after-wall::before{
    translate: 0 -25%;
  }
  .sec-after-box.block01 .after-wid-item .comment::before{
    width: 150%;
  }
  .sec-after-box.block02 .after-wid-item .thumb{
    translate: max(-50px, -6vw) -8%;
  }
  .sec-after-box.block02 .after-wid-item .comment .in-title{
    translate:min(25px,5vw) 0;
  }
  .sec-after-box.block02 .after-wid-item .comment::before{
    height: 170%;
    translate: 50% -52%;
  }
  .sec-after-box.block03::before{
    translate: 0 -10%;
  }
  .blk03-line_1{
    left: 0;
  }
  .sec-after-box.block03 .after-wid-item .comment::before{
    translate: -50% -45%;
  }
  .sec-after-box.block03 .after-min-item{
    margin-top: min(40px,10vw);
  }
  .sec-after-box.block04{
    margin-top: min(150px,28vw);
  }
  .pic-leaf_after04{
    bottom: 38%;
  }
 
}