
body.noscroll{
    overflow:hidden !important;
}

.noscroll #wrap {
    position: relative;
}


.montserrat{
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: bold;
  font-style: normal;
}
@media screen and (min-width:769px){
    .sp_only{
        display:none !important;
    }
}




header{
    /*visibility:hidden;*/
    background:#fff;
    padding:0;
    position:relative;
    /*position:fixed;*/
}

header.fixed{
    /*position:fixed;
    transform: translateY(-100.5%) !important;
    transition: none;*/
}

.header-logo {
    /*width: 168px;
    margin-left: 20px;*/
}
.header-logo img{
    display: block;
}


.menu-btn, .search-btn {

}

.menu-btn img, .search-btn img{
    width:auto;
}

.header-navi{
    position: absolute;
    width:100%;
    z-index: 1000;
    opacity:0;
    transition: opacity 0.3s ease-out 0.15s;
    user-select: none;
}

body.show .header-navi{
    opacity: 1;
}

.header-navi.fixed{
     position:fixed;
     top:1em;

}

.header-navi.fixed .header-navi__back{

}

.header-navi__back{
    width:50em;
    max-width: 90vw;
    border-radius:1em;
    overflow: hidden;
    margin:0 auto;
    font-size: 1em;
    height: 2.1em;
    position:relative;
    background: #fff;
    transition:border-radius 0.15s ease-out,height 0.15s ease-out;
}

.header-navi.showbottom1 .header-navi__back,
.header-navi.showbottom2 .header-navi__back,
.header-navi.showbottom3 .header-navi__back{
    border-radius: 2.1em;
    height: 4.2em;
}

.header-navi.showbottom1 .header-navi__info{
    color:#51b2ff;
}

.header-navi.showbottom2 .header-navi__event{
    color:#51b2ff;
}

.header-navi.showbottom3 .header-navi__info2{
    color:#51b2ff;    
}

.header-navi.colsemenu .header-navi__back{
    height: 2.1em;
}

.header-navi ul{
    padding: 0 4em;
    /*border-radius:1em;*/
     background-color:#fff;
}

.header-navi-sp{
    display:none;
}

.header-navi .header-navi__bottom{
    /*display:none;
    background-color:#b3e0ff;*/
    padding: 0 23% 0.35em;
    display:flex;
    opacity:0;
    pointer-events:none;
    transition:opacity 0.3s ease-out;
}

.header-navi__bottom a{
    vertical-align:-0.1em;
}

.header-navi .header-navi__bottom2{
    padding: 0 30% 0.35em;
    position: absolute;
    top: 2.1em;
}

.header-navi .header-navi__bottom3{
    padding: 0 30% 0.35em;
    position: absolute;
    top: 2.1em;
}

.header-navi .header-navi__bottom li{
    line-height: 2.1;
    padding-bottom: 0.15em;
}

.header-navi__back li:hover a{
    color:#51b2ff;
}




.header-navi .header-navi__bottom1 li{
    margin-right:2em;
    line-height: 1.1;
}

.header-navi .header-navi__bottom1 li,
.header-navi .header-navi__bottom2 li,
.header-navi .header-navi__bottom3 li{
    /*line-height: 1.5;*/
}

.header-navi.showbottom1 .header-navi__bottom1{
    opacity:1;
    pointer-events:auto;
}

.header-navi.showbottom2 .header-navi__bottom2{
    opacity:1;
    pointer-events:auto;  
}

.header-navi.showbottom3 .header-navi__bottom3{
     opacity:1;
     pointer-events:auto;
}

.header-navi li{
    margin-bottom : 0.2em;
    line-height:2.2;
}



.header-navi .header-navi__top li:last-child{
    width:13em;
    /*vertical-align:-0.6em;*/
}

.header-navi .header-navi__top li:last-child a:after{
    content:none;
}

.header-navi a{   
    color:#000;
    font-size: 1.56rem;
    font-weight: 300;
    white-space: nowrap;
}



.header-navi__top a{
    vertical-align: -0.05em;
}


.header-navi__top a{
    /*vertical-align: 0.1em;*/
}

.header-navi .header-navi__top li:last-child a{
/* padding-top: 0.7em;
vertical-align: 0.4em;
    display: block;*/
}

.header-navi .header-navi__top li:last-child a img{
    /*display: block;*/
    vertical-align: -0.3em;
}

.contents-wrap .header-gnav-list>li a {
    font-size: 1.43rem;
    padding-bottom: 16px;
}

@media screen and (min-width:1200px){

    .header-navi.showbottom1 .header-navi__back, 
    .header-navi.showbottom2 .header-navi__back, 
    .header-navi.showbottom3 .header-navi__back {
        border-radius: 2.0em;
        height: 4em;
    }
    .header-navi li{
        line-height:1.9;
    }

    .header-navi .header-navi__top li:last-child a img {
    /* display: block; */
        vertical-align: -0.5em;
    }

    .header-navi .header-navi__bottom li {
        /*padding-bottom:*/
    }

    .header-navi .header-navi__bottom2 li,
    .header-navi .header-navi__bottom3 li{
        line-height: 1.75;
    }

    .header-navi__bottom a {
        vertical-align: -0.25em;
    }

    .header-navi .header-navi__bottom2 a,
    .header-navi .header-navi__bottom3 a{
        vertical-align: 0em;
    }
}

@media screen and (max-width: 1200px) and (min-width: 769px) {
    .header-navi a{  
        font-size: 1.45vw;
    }

    .header-navi__top a{
        vertical-align: 0em;
    }

    .header-navi .header-navi__top li:last-child a{
       
        vertical-align: 0em;
    }
}
   

.kv{
    position: relative;
    padding-top:1em;
}

html,body{
    overflow:hidden;
}

body{
    transition:opacity 0.6s ease-out 0.2s;
    opacity:0;
}

html.scroll{
overflow:scroll;
}

html.scroll body{
    overflow:visible;
}

html.scroll,
html.scroll body{
    /*overflow:visible;
    overflow:scroll;*/
}

html.noscroll{
    overflow:hidden;
}

html.show,
html.show body{
    /*overflow:visible;*/
    opacity:1;

}

html.noscroll2{
     overflow:hidden;
}

html.noscroll2 body{
  
}


.toparea{
    top:0;
    width:100%;
    z-index: 10;
    pointer-events: none;
}

.toparea__top{
    padding-top:5em;
    /*width:40em;*/
    margin-left:auto;
    margin-right:auto;
    /*pointer-events: none;*/
}

.toparea__top.headerfixed{
    padding-top:10em;
}


.toparea__mobility-logo{
    width: 22.25em;
    margin: 0 auto 0.5em;
   /*filter: drop-shadow(0.15em 0 0.15em #fff) drop-shadow(-0.25em 0 0.15em #fff);*/
}

.toparea__mobility-logo img{
    position:relative;

}

.toparea__mobility-logo:before{
   /* content:"";
    width:110%;
    height:90%;
    position:absolute;
    background:rgba(255,255,255,0.25);
    border-radius:5em;
    left:-5%;
    top: -13%;
    filter:blur(0.25em);*/
}

.toparea__top h1{
    font-optical-sizing: auto;
    font-style: normal;
    font-weight:bold;
    font-size:4.25em;
    margin:0 auto 0em;
    z-index:1;
    line-height: 0.9;
    position: relative;
}

.toparea__top h1 span{
    font-size:1em;
    font-weight:100;
    margin-left: 0.2em;
    line-height: 0;
}

.toparea__copyblock{
    margin-bottom:3em;
    margin: 0 auto 2.75em;
    width: 22.25em;
    padding-top:0em;
}

.toparea__copyblock p{
    position:absolute;
    bottom: 2.5em;
    right: 0.85em;
    color:#fff;
    font-size: 0.75em;
    line-height: 1.3;
}

.toparea__top-text{
    font-size: 1.87rem;
    white-space: nowrap;
    line-height:1.5;
    width:52em;
    font-optical-sizing: auto;
    font-style: normal;
    color:white;
    margin:0 auto;
    font-weight: 600;
    letter-spacing: 0.0em;
    word-break:break-all;
    text-align:center;
}


.toparea__main{
    padding-top: 2em;/*メッセージ詳細ありの場合4em*/
    width: 38em;
    margin: 0 auto;
    text-align: center;
    /*pointer-events: none;*/
}

.toparea__main-movie{
    aspect-ratio: 112 / 63;
}

.toparea__main-top{
    margin-bottom:4em;
    /*pointer-events:auto;*/

}



.toparea__future{
    display:flex;
    justify-content:space-between;
    perspective: 100lvh;
    width: 46em;
    margin: 0 auto;
    display: none;
    /*perspective-origin: calc(50% - 3em) center;*/
}

.top__bottom{
    width: 45%;
}

.toparea__performance{
    transform:rotateY(15deg);
    padding-left: 2em;

}

.toparea__adventure{
    transform:rotateY(-15deg);
    padding-right: 2em;
}

.top__bottom h3{
    color: #fff;
    font-size: 1.5em;
    padding: 0.35em;
    text-align: center;
    font-weight: bold;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.toparea__adventure h3{
    color: #ff8b1a;
}


.canvasarea{
  width:100vw;
  height:100lvh;
  background-color:black;
  position:fixed;
  z-index:1;
  top:0;
  height: 100lvh;
  top: 0;
  transition: height 0.3s ease-out,top 0.3s ease-out;
}

.canvasarea.notransition{
    transition:none;
}



.canvasarea.abs{
    position:absolute;
    top:auto !important;
    bottom:0;
   
}

.canvasarea canvas{
    width:100% !important;
    height:100% !important;
}

.kv__nextarrow{
    position:absolute;
    width:1em;
    bottom:1em;
    right:1em;
    opacity:0;
    pointer-events:none;
    transition:opacity 0.3s ease-out;
}

.kv__nextarrow.show{
     opacity:1;
      pointer-events:auto;
}

.chain-message{
    position:fixed;
    top:50%;left:50%;
    transform:translate(-50%,-50%);
    z-index: 10;
    text-align: center;
    filter:drop-shadow(0 0 0.2em rgba(0,60,170,1));
    pointer-events:none;
    transition:opacity 0.6s ease-out;
    margin-bottom: 3em;
    width:22em;
    display:none;
}

.chain-message .toparea__text{
    font-size: 1.6rem;
    line-height:2.2;
}

.chain-message.show .toparea__title,
.chain-message.show .toparea__text{
    opacity:1;

}

.chain-message.show-end{
     opacity:0;
}

.toparea__title{
    color:#fff;
    font-size: 1.9em;
    letter-spacing: 0.02em;
    
    opacity:0;
    transition:opacity 0.6s ease-out;
    width:95%;
    margin: 0 auto 0.5em;
}



.contents-wrap .toparea__top-text{
    filter:drop-shadow(0 0 0.05em rgba(0,100,235,1));
    font-size: 1.6rem;
    margin-bottom: 2em;
}


@media screen and (max-width: 1360px) and (min-width: 769px) {
    .contents-wrap .toparea__text{
        /*メッセージ*/
        font-size: 1.35vw;
    }
}

@media screen and (max-width: 1360px) and (min-width: 769px) {
    .contents-wrap .toparea__top-text{
        /*Chain of Happiness本文*/
        font-size: 1.35vw;
    }
}

.toparea__text{
    color:#fff;
    font-size: 0.95em;
    line-height: 1.75;
    
    font-weight: 600;
    opacity:0;
    transition:opacity 0.6s ease-out 0.4s;
}



.chain-message.notransition{
    transition:none;
}

.chain-message.notransition .toparea__title{
    transition:none;
}

.chain-message.notransition .toparea__text{
    transition:none;
}

.toparea__text:nth-child(3){
    transition-delay:0.6s;
}

.toparea__text.yellow{
    transition-delay:0.8s;
}

.videoarea{
  /*position:absolute;*/
  top:0;
  overflow:hidden;
  opacity:0;
}

.videoarea video{
  width:auto;
}

.videoarea video{
pointer-events:none;
position:relative;
top:0
}

.scrollarea{
    height: 100vw;
    pointer-events:none;
}



.content__block{
    width:calc(100% - 2em);
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    margin-bottom: 2em;
}

.content__img{
    width:60%;
}

.content__text{
    width:calc(40% - 1.5em);
}

.detail-info{
    display:none;
}





.detailarea{
    /*border:solid red 1px;*/
    position: fixed;
    left:50%;
    top: 50vh;
    transform:translate(-50%,-50%);
    z-index: 3;
    opacity: 0;
    pointer-events:none;
    background-color:rgba(255,255,255,0.9);
    transition:opacity 0.5s ease-out;

    height: auto;
    width: 80%;
    max-width: 860px;
    max-height:95vh;
   padding-bottom: 1.25em;
}





.modal {
    /*visibility:visible !important;/*for test*/
}

.subpage{
    /*transform:none !important;/*for test*/
}
/*
.technical-report__text {
    height:auto;
}

.contents-wrap .technical-report {
    top: 0;
    transform: translate(-50%, 0%);
}*/



.detailarea.show{
    opacity:1;
    pointer-events:auto;
}

.detailarea.show .detailarea__close{
    pointer-events:auto;
}

.detailarea_img{
    width: 81%;
    margin:0 auto 0.75em;
    margin-top: 5vh;
    aspect-ratio: 560 / 315;
    
}

#youtube-player{
   position:relative;
}

.detailarea_img-last{
    position:relative;
    
    transition:opacity 0.3s ease-out;
    opacity:0;
}

.detailarea_img-last.change{
    transition:none;
    opacity:1;
}

.detailarea_img-current{
    
    position:absolute;
    transition:opacity 0.3s ease-out;
    top:0;left:0;
}

.detailarea_img-current.change{
    transition:none;
    opacity:0;
}




.contents-wrap .detailarea_discription{
    padding: 0 9.5%;
    font-size: 1em;
    line-height: 1.75;
    margin-bottom: 1em;
    position:relative;
    max-width: 860px;
}

.detailarea_discription_last{
    position:absolute;
    width:100%;
    height:100%;
    left:0;top:0;
    padding: 0 9.5%;
    display:flex;
    justify-content:space-between;
    transition:opacity 0.3s ease-out;
    opacity:0;
}

.detailarea_discription_current{
    display:flex;
    height:100%;
    justify-content:space-between;
}

.detailarea_text-wrap{
    display:flex;
    flex-direction: column;
    overflow:hidden;
    /*max-height: 35dvh;*/
    max-height: 9em;
    /*max-height: max(calc(30dvh - 0em) , 10em);*/
    width: 78%;
    position: relative;
}

.detail-info__era{
    width:20%;
}
    
.detailarea_discription_last.change{
    transition:none;
    opacity:1;
}



.contents-wrap .detailarea_title{
    font-size: 1em;
    line-height: 1.4;
    font-weight:bold;
    margin-bottom: 0.25em;
}

.contents-wrap .detailarea_text{
    position: relative;
    overflow-y:scroll;
    /*max-height:calc(100% - 1.75em)*/
}

.contents-wrap .detailarea_text-innerwrap{
    position: relative;
    /*overflow-y: scroll;*/
    width:100%;
    height:100%;
}

.contents-wrap .detailarea_text-wrap:before{
    content:"";
    position:absolute;
    top:0;
    width:100%;
    height:100%;
    background-image:linear-gradient(to top ,rgba(0,0,0,0.15) ,rgba(0,0,0,0.025) 3% ,rgba(0,0,0,0) 6% ,rgba(0,0,0,0) );
}

.contents-wrap .detailarea_text-wrap.hideshadow:before{
    content:none;
}

.contents-wrap .detailarea_text-inner{
    line-height:1.5;
    font-size:0.75em;
    padding-bottom: 1em;
}

.detailarea_discription_current .detailarea_title,
.detailarea_discription_current .detailarea_text{
    transition:opacity 0.3s ease-out;
}

.detailarea_discription_current .detailarea_title.change,
.detailarea_discription_current .detailarea_text.change{
    transition:none;
    opacity:0;
}

    


.detailarea_discription_last .detailarea_title,
.detailarea_discription_last .detailarea_text{
    transition:opacity 0.3s ease-out;
    opacity:0;
}

.detailarea_discription_last .detailarea_title.change,
.detailarea_discription_last .detailarea_text.change{
    transition:none;
    opacity:1;
}





.contents-wrap .detailarea__close{
    width:1.8em;
    position:absolute;
    right:1em;
    top:1em;
    line-height: 1;
    background-color:#000;
    padding:0.4em;
    border-radius:0.9em;
    font-size:16px;
}

@media screen and (min-width:769px) and (max-width:1360px){
    .contents-wrap .detailarea__close{
        font-size:1.4vw;
    }
}

.detailarea__close img{
    display:block;
}

.contents-wrap .detailarea__pointers{
    display:flex;
    justify-content:space-between;
    width:40%;
    font-size:0.7em;
    /*position:absolute;*/
    margin:0 auto;
    align-items: center;
   
   
}

.detailarea__pointers-wrap{
    display:flex;
    justify-content:space-between;
    width:65%;
    align-items: center;
    font-size: 0.65em;

}

.detail_arrow_left,
.detail_arrow_right{
    width:3%;
}

.detail_arrow_left img,
.detail_arrow_right img{
    display:block;
}

.detail_arrow_left img{
    transform:rotate(180deg);
}

.detailarea__pointers li{
    width:1em;
    height:1em;
   
    border-radius:0.5em;
    border:solid 1px gray;
}

.detailarea__pointers li.active{
     background-color:gray;
}

.detailarea__close:hover,
.detail_arrow_left:hover,
.detail_arrow_right:hover,
.detailarea__pointers li:hover{
    animation:blink_animation 0.3s ease-in-out;
}

@media screen and (min-aspect-ratio:16/9){
    .detailarea{
        max-height:90vh;
        width: 110vh;
        aspect-ratio:16/9;
        width:auto;
    }

    .detailarea_text-wrap{
        /*max-height: max(calc(75dvh - 20em) , 8em);*/
    }

    .detailarea_discription {
        font-size:3.5vh;
    }

    .contents-wrap .detailarea_text-inner{
            font-size: 1.75vh;
    }

    .detailarea_img {
         width:95vh;
         max-width: 81%;
    }

}

@media screen and (min-aspect-ratio:2/1){
    .detailarea_img{
        width:90vh;
        max-width: 81%;
    }

    .contents-wrap .detailarea_text-inner{
        font-size:1.75vh;
    }

    .contents-wrap .detailarea_title {
         font-size:3vh;
    }

    .detailarea_text-wrap{
        /*max-height: max(calc(75vh - 14.5em) , 9.5em);*/
    }

    .contents-wrap .detailarea_text {
        max-height: 20dvh;
    }

    .contents-wrap .detailarea_discription{
        height: 26vh;
        margin-bottom: 0.25em;
    }

    .contents-wrap .detailarea__pointers{
        font-size:2vh;
    }
}

.box__title{
    color:#fff;
    font-size:3em;
    font-family: "Montserrat", sans-serif;
    position:absolute;
    left:50%;
    top:21%;
    transform:translate(-50%,-50%);

}

.box__pictures{
    display:flex;
    position:absolute;
    width:80em;
    left:50%;
    top:67%;
    justify-content: space-between;
    transform:translate(-50% , -50%);
    width:38em;
}

.box2__pictures{
    width:48em;

}

.box3__pictures{
    width: 23em;
    top:70%
}

.box__pictures figure{
    width: 49%;
}

.box2__pictures figure{
    width: 32.3%;
}

.box3__pictures figure{
    width: 100%;
}

.box__pictures figure img{
    display:block;
    margin-bottom:0.5em;
}

.box__pictures figcaption{
    color:#fff;
    font-size: 0.55em;
    text-align: center;
    letter-spacing: 0.05em;
}




.contents-wrap .box__text{
    color:#fff;
    left:50%;
    top:6%;
    position:absolute;
    transform:translate(-50%,0%);
    text-align:center;
    font-size: .9em;
    font-weight: bold;
    letter-spacing: 0.05em;
    line-height: 1.5;
    filter:drop-shadow(0 0 0.1em rgba(0,0,0,0.5)) drop-shadow(0 0 0.1em rgba(0,0,0,0.5));
}

main section{
    position:relative;
}

@keyframes blink_animation2 {
  0% {
    opacity: 0.5;
  }
  10% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
}


.box1 box1__imageback:hover,
.box2 box2__imageback:hover,
.box3 box3__imageback:hover{
    animation:blink_animation2 0.3s ease-out;
    cursor:pointer;
}

.box1>div,
.box2>div,
.box3>div,
.box3>h2{
    pointer-events:none;
}

.box1,
.box2,
.box3{
    overflow:hidden;
}

.box1{
    height: 25.6em;
}
.box2{
    height: 26.3em;
}

.box3{
    height: 28em;
}

.box1__imageback,
.box2__imageback,
.box3__imageback{
    display:block;
    width:100%;
    position:absolute;
    top:50%;left:50%;
    transform:translate(-50%,-50%);
}

.box1__imageback,
.box2__imageback,
.box3__imageback{
    max-width: 110%;
    width: 110%;
}

.box1__title{
    
    width:calc(8em * 1.22);
    top: 30.6%;

}

.box__title img{
    width:100%;
}

.box2__title{
    width:8em;
    top: 31.3%;
}

.box3__title{
    width: calc(9.3em * 1.18);
    top: 29%;
    /*transform: translate(-50%, -160%);*/
}

.contents-wrap .main__triangle{
    position:absolute;
    width: 7.5em;
    bottom:0;
    right:0;
    cursor:pointer;
    pointer-events:auto;
}



.contents-wrap .main__triangle:hover .triangle__back{
   
   animation:blink_animation2 0.3s ease-in-out;
}

@keyframes blink_animation2{
    0%{filter:none}
    50%{filter:brightness(1.5)}
    0%{filter:none}
}

.triangle__back{
    position:relative;  
    display: block;
}

.triangle__arrow{
 position:absolute;
 top:0;
 width:100%;
 display: block;
}

.contents-wrap .main__triangle:hover .triangle__arrow{
    animation:horizontal-hover 0.8s ease-in-out;
}

.triangle__arrow:hover{
    animation:horizontal-hover 0.8s ease-in-out;
}

@keyframes horizontal-hover{
    0%{transform:translateX(0%);}
    15%{transform:translateX(-5%);}
    70%{transform:translateX(5%);}
    100%{transform:translateX(0%);}
}

.box4{
    background-image:url(/jms/img/space_stars.webp);
    background-size: 1200px;
    background-size: 100% auto;
    background-position: bottom center;
    padding: 5em;
    padding-bottom: 1.25em;
    padding-top: 2.25em;
}



.box4__block-image{
    margin-bottom: 0.25em;
   
}

.box4__block2-image{
    margin-bottom:0;
}

.box4__block-image img{
    display:block;
}

.box4__title{
    top: 3.85rem;
    position: relative;
    margin-bottom: 5.5rem;
}

.box4__block{
     width: 36.363em;
     margin:0 auto 2em;
     position:relative;
}


.box4__block>div{
    position:relative;
}

.box4__block-title{
    color:#fff;
    background-color:#44b4f4;
    font-size: 1.2em;
    text-align: center;
    font-weight: 600;
    margin-bottom: 0;
}

.box4__block2 .box4__block-title,
.box4__block3 .box4__block-title,
.box4__block4 .box4__block-title,
.box4__block5 .box4__block-title{
    background-color:transparent;
    text-align: left;
    color: #01aeec;
}

.box4__block-title span{
    font-size:0.8em;
}

.box__title span{
    display:block;
    text-align:center;
    line-height:1.3;
}

.box__title span.jp{
    font-size:1.76rem;
}

.box__title span.en{
     font-size: 3rem;
}


.contents-wrap .box4__block1-text{
    color:#fff;
    font-size: 0.7em;
    line-height: 1.75;
    letter-spacing: 0.03em;
    margin-bottom: 0.75em;
    padding-top: 0.75em;
}

.box4__block-button a{
    color: var(--accentColor);
    color: #0054a7;
    background-color:#fff;
    text-align: center;
    font-size: 0.9em;
    font-weight: 600;
    height: 3em;
    line-height: 3;
    margin-bottom: 3em;
    display:block;
}

.box4__block3-title,
.box4__block4-title{
    font-size: 1.18em;
}

.box4__block3-image{
    margin-bottom:3em;
}

.contents-wrap .timetable__title{
    background-color:#fff;
    text-align:center;
    color: #0054a7;
    font-weight: bold;
    font-size: 0.9em;
    line-height: 3;
}

.contents-wrap .timetable__title.open{
    background-color:#0054a7;
    color: #fff;
}

.timetable__btn{
    position:absolute;
    width:1.2em;
    display:block;
    top: 0.7em;
    right:0.65em;
}

.timetable__btn img{
    position:relative;
    display:block;
    top:0;
}


.timetable__btn .minus{
     position:absolute;
     visibility:hidden;

}

.timetable__title.open .timetable__btn .minus{
    visibility:visible;
}
.timetable__title.open .timetable__btn .plus{
    visibility:hidden;
}

.timetable__content{
    overflow: hidden;
    margin-bottom: 2.5em;
    transition:height 0.3s ease-out;
    height:0;
}

.timetable__inner{
    position: relative;
    margin-top: -0.5px;
}

.timetable__inner img{
    display:block;
}

.timetable__close{

    position:absolute;
    bottom:0.5em;
    width:5em;
    color:#fff;
    text-align: center;
    left:50%;
    transform:translateX(-50%);

}


@media (hover: hover) {
    .timetable__close:hover{
        animation:blink_animation 0.3s ease-out;
    }

}

.timetable__close img{
    width:1.25em;
    width: 1.25em;
    display: inline-block;
    vertical-align: -0.25em;
}

.box4__discription{
    color:#fff;
    position:absolute;
    bottom: 0.75em;
    left: 1em;
}

.box4__discription dt{
    font-size: 0.85em;
    font-weight:bold;
    line-height: 1.25;
    margin-bottom: 0.5em;
}

.box4__discription dt a{
    color: #01AEEC;
    text-decoration: underline;
}

.box4__discription dt a:after{
    background: url(/jms/img/icn_blank.svg) no-repeat center center / contain;
}

.box4__block5 .box4__discription dt{
    padding-top: 0.7em;
}

.box4__discription dd{
    font-size: 0.65em;
    line-height: 1.5;
    padding-right: 1.25em;
}

.box4__discription a{
    text-decoration:none;
}

.box4__block3-image .box4__discription dd{
    letter-spacing: 0.06em;
}

.box4__discription dd .note{
    font-size: 0.77em;
}
.box4__discription dd.note{
    font-size: 0.5em;  
}

.box5{
    background: #062C53;
    background: #0a4179;
    padding-top: 2.5em;
    padding-bottom: 3.5em;
    /*background-image:linear-gradient(to bottom, #0c5299 ,#07305a);*/
    background-image:linear-gradient(to bottom,rgba(0,0,0,0.4) 0%,rgba(0,0,0,0.0) 50% ,rgba(0,0,0,0.0 ) 80% , rgba(0,0,0,0.4));
}

.box5__title{
    position: relative;
    top: 0;
    left: 0;
    transform: none;
    margin-bottom: 5.5rem;
}



.slider{
    /*padding-bottom: 2.5em;*/
    position:relative;
}

.slider div{
    position:relative;
}

.slider .slider_arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width: 1.25em;
}

.slider_arrow img{
    display:block;
}

.slider_arrow.left img{
    transform:scaleX(-1);
}

.slider_arrow.left{
    left:1.65em;
}

.slider_arrow.right{
    right:1.65em;
}





.slider_clip{
    display: flex;
    width: 200%;
    justify-content: space-between;
    width: 250%;
    margin-left: calc(-250% / 6 - 150% / 6 / 2);/*100%からはみ出した分をカード数で割って、さらに1/2*/
    margin-left: calc(-72% + 2em);
    margin-left: calc(-53% + 2em);
    transition:transform 0.3s ease-in-out;
    
}

.slider_clip.notransition{
    transition:none;
}

.slider_box{
    width:calc(16.67% - 0.65em);
    user-select:none;
}



.slider_box img{
    display:block;
    user-select:none;
    width:100%;
}

.subpage{
    position:fixed;
    width:100%;
    height:100%;
   
    overflow-y: scroll; 
    /* 横方向はスクロールバーを非表示にし、はみ出たコンテンツを隠す */
    overflow-x: hidden; 
    left:0;top:0;
    z-index:1110;
    transition:transform 0.5s ease-out;
    transform:translateY(100lvh);
}

.subpage.notransition{
    transition:none;
}

.subpage img{
    display:block;
}

.subpage.show{
    transform:none;
}
    


.subpage_close{
    position: fixed;
    top: 1em;
    right:1.5em;
    width: 3.4em;
    padding: 0.75em;
    border-radius: 1.7em;
    background-color: rgba(255, 255, 255, 0.8);
    z-index: 1;
}


.subpage div,
.subpage span,
.message-sub div,
.message-sub span{
    font-size:16px;
    line-height:1.5;
}




.message-sub{
    position:fixed;
    width:100%;
    height:100%;
    overflow-y: scroll;
    overflow-x: hidden;
    left: 0;
    top: 0;
    z-index: 1110;
    transition: transform 0.5s ease-out;
    transform: translateY(100lvh);
    background-color:gray
}

.message-sub.show{
    transform: translateY(0);
}

.message-sub_close{
    position: fixed;
    top: 1em;
    right:1.5em;
    width: 3.4em;
    padding: 0.75em;
    border-radius: 1.7em;
    background-color: rgba(255, 255, 255, 0.8);
    z-index: 1;
}

@media screen and (max-width:1360px){
    .subpage div,
    .subpage span,
    .message-sub div,
    .message-sub span{
        font-size:1.18vw;
    }
}

.subpage_close img{
    display:block;
}

.subpage__box{
    position:relative;
}

.subpage__box0-bottom,
.subpage__box1-middle1,
.subpage__box1-middle2,
.subpage__box1-middle3{
    position:relative;
}

.subpage__box>div{
    background-size:cover;
    background-position: center;
}

div.subpage__contents-block{
    display:flex;
    padding:1.25em 7.2em 0;
    justify-content:space-between;
}

div.subpage__text-box{
    width:30em;
    left: 50%;
    position: absolute;
}

.subpage__box0-middle .subpage__text-box{
    top: 15.6%;
    transform: translateX(15%);

}

.subpage__box0-bottom .subpage__text-box{
    top:11.5%;
    transform: translateX(-115%);

}

.subpage__box1 .subpage__text-box{
    
}

.subpage__box1-middle1 .subpage__text-box{
    top:28.5%;
    transform: translateX(15%);
}

.subpage__box1-middle2 .subpage__text-box{
    top:11.5%;
    transform: translateX(-115%);
}

.subpage__box1-middle3 .subpage__text-box{
    top:11%;
    transform: translateX(15%);
}

.subpage__box2 .subpage__text-box{
    top: 30.5%;
    width: 30.125em;
    transform: translateX(-115%);
}

.subpage__title{
    position:absolute;top:4.5%;
    left:50%;
    transform:translateX(-50%);
    width:34vw;
    max-width:490px;
    top: 4%;
}

.subpage__box0 .subpage__title{
    top:5.5%;
}

.subpage__box1 .subpage__title{
    width:27.99vw;
    max-width:420px;
    z-index:1;
}


.subpage__box2 .subpage__title{
    width: 32.8vw;
    max-width:395px;
    top: 4%;
}


h2.subpage__text-title{
     margin-bottom: 1.75em;
}

.subpage__text-title .en{
    font-size:1.25em;
    color:#ea0c53;
    display:block;
    margin-bottom: 0.25em;
}

.subpage__text-title .jp{
    font-size:1.5em;
    color:#fff;
    display:block;
}

div.subpage__text-discription{
    font-size:0.875em;
    color:#fff;
    letter-spacing: 0.06em;
}

.subpage__box0-top{
    height:11.11vw;
    max-height:160px;
    background-image:url(/jms/img/subpage_image1.webp);
   
}

.subpage__box0-middle{
    height: 45vw;
      max-height: 627px;
     background-image:url(/jms/img/subpage_image2.webp); 
}

.subpage__box0-bottom{
   
   
}

.subpage__box0-bottom{
     height:32.5vw;
    max-height:468px;
     background-image:url(/jms/img/subpage_image3.webp);
}

.subpage__box0-bottom .subpage__contents-block{
    flex-direction:row-reverse;
}

.subpage__box1-top{
    height:28.68vw;
    max-height:413px;
    background-image:url(/jms/img/subpage_image4.webp);
}

.subpage__box1-top-title{
    font-size:1.25em;
    text-align:center;
    width:36em;
    margin:0 auto 0;
    line-height:1.7;
    color:#fff;
    padding-top:2.5em;
    filter: drop-shadow(0 0 0.1em rgba(0, 0, 0, 0.5)) drop-shadow(0 0 0.1em rgba(0, 0, 0, 0.5));
}

.subpage__box1 .subpage__text-title .en{
    color: #ff8b1a;
}

.subpage__box1-middle1,
.subpage__box1-middle2,
.subpage__box1-middle3{
    height:38.5vw;
    max-height:556px;
    background-image:url(/jms/img/subpage_image5.webp);
}

.subpage__box1-middle2{
    height:31.1vw;
    max-height:448px;
    background-image:url(/jms/img/subpage_image6.webp);
}

.subpage__box1-middle2 .subpage__contents-block{
   
    flex-direction:row-reverse;
}

.subpage__box1-middle3{
     height:32.15vw;
    max-height:463px;
    background-image:url(/jms/img/subpage_image7.webp);
}


.subpage__box2:after{
    content:"";
    width:100%;
    display:block;
    height:max(calc(100vh - 52.1vw),calc(100vh - 616px));
    height:calc(100vh - min(52.1vw,616px));
    background-color:#1b1b1b;
}

.subpage__box2 .subpage__text-title .en{
    color:#44B4F4;
}

.subpage__box2-top-title{
    font-size:1.25em;
    text-align:center;
    width:36em;
    margin:0 auto 0;
    line-height:1.7;
    color:#fff;
    padding-top:3.75em;
    filter: drop-shadow(0 0 0.1em rgba(0, 0, 0, 0.5)) drop-shadow(0 0 0.1em rgba(0, 0, 0, 0.5));
}


.subpage__box2-top h2{
    width:42.5em;
    position:absolute;
    left:50%;top:50%;
    transform:translate(-50%,-50%);
}

.subpage__box2-middle .subpage__contents-block{
    flex-direction:row-reverse;
}

.subpage__box2-middle{
    height:49vw;
    max-height:750px;
    background-image:url(/jms/img/subpage_image9.webp);
}

.contents-wrap .technical-report{
    position:fixed;
    top:50%;left:50%;
    transform:translate(-50%,-50%);
    width: 78.5%;
    max-width: 1130px;
    z-index:2;
}

.technical-report__clip{
    overflow: hidden;
    margin-top: 1.75em;
    height: calc(100% - 3.5em);
    padding-left: 1.6em;
    padding-right: 1.6em;
}

.contents-wrap .technical-report__btn{
    background:#ea0c53;
    color:#fff;
    width: 14em;
    line-height: 2;
    padding-top: 0.1em;
    text-align: center;
    border-bottom:rgba(0, 0, 0, 0.5) solid 1px;
}

.technical-report__btn:hover,
.heritage-episode__btn:hover{
    animation:blink_animation2 0.3s ease-in-out;
    cursor:pointer;
}



.technical-report__text{
    
    background-color: #fff;
    height: 0em;
    transition:height 0.3s ease-out;
    overflow: hidden;
    position: relative;
}

.technical-report__close{
    position:absolute;
    right: 2.25em;
    top: 2.25em;
    width: 2.25em;
    border: solid #666;
    border-radius: 1.125em;
}

.technical-report.show .technical-report__text{
    height: 60vw;
    max-height: 80dvh;
    
}



.technical-report__text-inner{
    overflow-y: scroll; 
    overflow-x: hidden; 
    height: 100%;
    -webkit-overflow-scrolling: touch;
    position: relative;

}

.technical-report__text-wrap{
    width:100%;
    position: relative;
}

.technical-report__base{
        width:100%;

}

.technical-report__text-wrap>div{
    position:absolute;
    font-size: 0.725em;
    font-size: 0.75em;
    letter-spacing: 0;
}

.technical-report__text-wrap .technical-report__base{
    position:relative;
}

.technical-report .technical-report__text-text{
    text-align: center;
    margin-bottom: 4rem;
    color:white;
    left: 33%;
    top: 14.5%;
}



.technical-report .technical-report__text-pic2-text1{
    width: 100%;
    position: absolute;
    left: 11.5%;
    top: 25.5%;
}

.technical-report .technical-report__text-pic2-text2{
    
    position: absolute;
    right: 13%;
    top: 35.7%;
}

.technical-report__text-pic3{
    width: 86%;
    left: -1%;
    margin: 0 auto 4.3em;
    position: relative;
}

.technical-report .technical-report__text-pic3-text1{
    width: 100%;
    position: absolute;
    left: 13.2%;
    top: 48.8%;
}

.technical-report .technical-report__text-pic3-text2{
    position: absolute;
    right: 10.9%;
    top: 66.65%;
}



.technical-report .technical-report__text-pic4-text{
    width: 100%;
    position: absolute;
    left: 29.65%;
    top: 91.3%;
}




.contents-wrap .subpage__box2 .heritage-episode__btn{
    background:#44b3f3;
    color:#fff;
    width: 13em;
    line-height: 2;
    padding-top: 0.1em;
    text-align: center;
    border-bottom:rgba(0, 0, 0, 0.5) solid 1px;
}

.subpage__box2 .subpage__text-discription{
    margin-bottom: 1em;
}



.heritage-episode .heritage-episode__text-pic2-text1{
    width: 100%;
    position: absolute;
    left: 11.5%;
    top: 25.5%;
}



.heritage-episode .heritage-episode__text-pic3-text1{
    width: 100%;
    position: absolute;
    left: 13.2%;
    top: 48.8%;
}





.contents-wrap .heritage-episode{
    position:fixed;
    top:50%;left:50%;
    transform:translate(-50%,-50%);
    width: 78.5%;
    max-width: 1130px;
    z-index:2;
}

.heritage-episode__clip{
    overflow: hidden;
    margin-top: 1.75em;
    height: calc(100% - 3.5em);
    padding-left: 1.6em;
    padding-right: 1.6em;
}

.contents-wrap .heritage-episode__btn{
    background:#ea0c53;
    color:#fff;
    width: 15em;
    line-height: 1.5;
    padding-top: 0.1em;
    text-align: center;
    border-bottom:rgba(0, 0, 0, 0.5) solid 1px;
}

.heritage-episode .heritage-episode__text-text{
    margin-bottom: 4rem;
    color: white;
    left: 55.5%;
    top: 35.5%;
    width: 37%;
    line-height: 1.55;
}

.heritage-episode__text{
    
    background-color: #fff;
    height: 0em;
    transition:height 0.3s ease-out;
    overflow: hidden;
    position: relative;
}

.heritage-episode__close{
    position:absolute;
    right: 2.25em;
    top: 2.25em;
    width: 2.25em;
    border: solid #666;
    border-radius: 1.125em;
}

.heritage-episode.show .heritage-episode__text{
    height: min(67vw, 1172px);
    max-height: 90vh;  
}



.heritage-episode__text-inner{
    overflow-y: scroll; 
    overflow-x: hidden; 
    height: 100%;
    -webkit-overflow-scrolling: touch;
    position: relative;

}

.heritage-episode__text-wrap{
    width:100%;
    position: relative;
}

.heritage-episode__base{
        width:100%;

}

.heritage-episode__text-wrap>div{
    position:absolute;
    font-size: 0.725em;
    font-size: 0.75em;
    letter-spacing: 0;
}

.heritage-episode__text-wrap .heritage-episode__base{
    position:relative;
}








.subpage__box0 .subpage__text-discription{
    margin-bottom:1em;
    letter-spacing: 0.05em;
}

.subpage__box1-middle3 .subpage__text-discription{
     letter-spacing: 0.01em;
}



.box6{
    padding:2.25em 0 2.25em;
    font-size :2.64rem;
}

.contents-wrap .box6__btn{
    width: 25em;
    margin: 0 auto;
    font-size: 2.64rem;
}

.box6__top{
    background-color:#f4eee9;
        padding: 1.25em;
}

.box6__top img{
    display: block;
    margin-bottom: -0.25em;
}

.contents-wrap .box6__bottom{
    background-color:#0054a7;
    text-align:center;

    font-size: 1.02em;
    position: relative;
    font-weight: bold;
}

.box6__bottom a{
    display:block;
    color:#fff;
    line-height: 1.75;
    font-size: 2.42rem;
}


.box6__bottom a[target="_blank"]:after {
    background:none;
}

.box6__bottom a:after{
    content:url(/jms/img/blank_target.svg) !important;
    position:absolute !important;
    width: 0.5em !important;
    margin-left: 0.25em !important;
    bottom: 0.2em !important;
}

.contents-wrap .box7__title{
    position: relative;
    top: 0em;
    margin-bottom: 2.53rem;
    transform: translate(-50%, 0);
}

.contents-wrap .box7__top{
    width: 23em;
    padding: 0.676em 1.7em 0.58em;
    background-color: #fff;
    margin: 0 auto 1.5em;
    font-size: 2.64rem;
    font-size:1.02em;
    position:relative;
    background-color: #f4eee9;
}



.box7{
    background: #062C53;
    background: #0a4179;
    padding-top: 2.5em;
    padding-bottom: 2em;
    font-size: 2.64rem;
    background-image:linear-gradient(to bottom,rgba(0,0,0,0.4) 0%,rgba(0,0,0,0.0) 50% ,rgba(0,0,0,0.0 ) 80% , rgba(0,0,0,0.2));
}


.contents-wrap .box7__btn{
    font-size: 2.64rem;
}

.contents-wrap .box7__bottom{
    text-align:center;
    color:#fff;
    font-weight:bold;
    font-size :1.1em;
}

.contents-wrap .box7__bottom-title{
    line-height: 1.35;
    font-size: 1.05em;
    margin-bottom: 0.6em;
}

.contents-wrap .box7__bottom-day{
    color:#53b3ff;
    font-size: 1.25em;
    line-height: 1.2;
}

.box7__bottom-day span{
    font-size:0.7em;
}

.box7__bottom-day span.kakko{
    vertical-align:0.1em;
}

.contents-wrap .box7__bottom-place{
    font-size:0.6em;
}

.box7__bottom-place a{
    display:inline-block;
    border:solid #fff 1px;
    color:#fff;
    font-size: 0.7em;
    padding: 0 0.5em;
    line-height: 1.2;
    vertical-align: 0.2em;
    margin-left: 0.2em;
}

.box7__bottom-place a:after{
    content:url(/jms/img/blank_target.svg) !important;
    position: relative !important;
    left: 0.25em;
    margin-right: 0.2em;
    display: inline-block;
    width: 1em;
    top:0 !important;
}

.box7__bottom-place a[target="_blank"]:after {
    background:none;
}

.box8{
    background-image: url(/jms/img/space_stars.webp);
    background-size: 1000px;
    background-size: 100% auto;
    background-position: bottom center;
    background-position: center 88%;
    padding:2.5em;
    padding-top: 3.5em;
    padding-bottom: 4.5em;
    font-size :2.4rem;
}

.box8__title{
    position: relative;
    top: 0em;
    margin-bottom: 5.5rem;
    transform: translate(-50%, 0);
}


.box8__schedule-box{
    width:33em;
    max-width:96vw;
    margin:0 auto;
}

.box8__schedule1>img.pc_only,
.box8__schedule2>img.pc_only{
    display:block;
}

.box8__schedule1,
.box8__schedule2{
    margin-bottom:1em;
    position:relative;
}

.box8__schedule3{
    position:relative;
}

.box8__schedule-flex{
    display: flex;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 1.2%;
    width: 98%;
}

.contents-wrap .box8__schedule-flex-left{
    color:#fff;
    width: 25.7%;
    text-align: center;
    font-size: 0.925em;
    font-weight: bold;
    line-height: 4;
    letter-spacing: -0.05em;
}

.box8__schedule-flex-right{
    width: 68%;
    padding-left: 4.85%;
    position:relative;
}
.box8__schedule-flex-right img{
    margin-bottom: -1%;
}

.box8__under{
    display:flex;
    justify-content:space-between;
}


.box8__schedule3 .box8__schedule-flex-left{
 color:#0054A7;
}

.box8__schedule3 a{
    display:block;
    position:absolute;
    bottom: 12.5%;
    left: 21.8%;
    width: 54%;
}

.box8__schedule3 a:after{
    display:none !important;
}



.box9{
    background: #062C53;
    background: #0a4179;
    background-image:linear-gradient(to bottom,rgba(0,0,0,0.4) 0%,rgba(0,0,0,0.0) 50% ,rgba(0,0,0,0.0 ) 80% , rgba(0,0,0,0.4));
    padding: 4.5em 0 2.5em;
    font-size :1.09rem;
}



.box9__title{
    color:#fff;
    line-height: 2;
    margin-left:auto;
    margin-right:auto;
    margin-bottom: 1em;
    font-size: 2,97rem;
    font-weight: bold;
    border-bottom: solid #fff 1px;
    width: 88rem;
}

.box9__booth,
.box9__booth2{
    width: 96.8rem;
    margin-left:auto;
    margin-right:auto;
}

.box9__booth{
    margin-bottom: 1.2em;
    margin-top: -0.5em;
}

.box9__booth2{

}

.mousepointer{
    position:fixed;
    top:50%;left:50%;
    transform:translate(-50% ,110%);
    width:6.2%;
    max-width:62px;
    opacity:0;
    z-index: 10;
    pointer-events:none;
}

/*show for test 
.chain-message.show-end{
     opacity:1;
}

.mousepointer{
    opacity:1;
}
    */



.mousepointer__img img{
    display:block;
}

.contents-wrap .mousepointer__text{
    font-size: 0.9em;
    color:#fff;
    font-weight: bold;
    white-space: nowrap;
    position: absolute;
    left: 50%;
    width: 8.5em;
    transform: translateX(-50%) translateY(5%);
}

.mousepointer.show{
    animation:mousepointerShow 2s ease-in-out 0.05s 2;
}

.mousepointer.over{
    visibility:hidden;
}

@keyframes mousepointerShow{
    0%{opacity:0}
    20%{opacity:1}
    40%{opacity:1}
    45%{opacity:0.2}
    55%{opacity:0.2}
    60%{opacity:1}
    80%{opacity:1}
    100%{opacity:0}

}




.contents-wrap .footer-navi__title{
    letter-spacing: 0.2em;
    font-weight: bold;
    font-size: 1.25em;
    color: #666;
    margin-bottom: 1em;
    text-align: center;
}

.footer-navi li{
    width:24.15%;
}
.footer-navi li:first-child{
    transform:scaleX(0.99);
    transform-origin:left;
}

.contents-wrap .footer-navi__text{
    font-size: 1.75rem;
    letter-spacing: 0;
    margin-bottom: 2.75rem;
    text-align: center;
}
.footer_wrap div {
    font-size: 0.75rem;
    line-height: 1.25;
}

.footer.footer-simple{
    margin-top:0;
}

#contents .sec-account {
  padding: 55px 0 75px;
}
@media screen and (max-width: 767px) {
  #contents .sec-account {
    padding: 11.5384615385vw 0 14.1025641026vw;
  }
}
#contents .sec-account .w-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  max-width: 1130px;
    margin: 0 auto;
}
#contents .sec-account .txt {
  margin-bottom: 40px;
  font-size: 2.5rem;
  font-weight: 600;
  position: relative;
  /*z-index: 2;*/
}
@media screen and (max-width: 767px) {
  #contents .sec-account .txt {
    margin-bottom: 8.9743589744vw;
    font-size: 5.1282051282vw;
    text-align: center;
    line-height: 1.6;
  }
}

#contents .sec-account .sns-ul {
  max-width: 350px;
  width: 100%;
  display: flex;
  justify-content: space-between;
}

#contents .sec-account .sns-ul li a:hover {
  opacity: 0.7;
  cursor: pointer;
}
#contents .sec-account .sns-ul li a dl {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#contents .sec-account .sns-ul li a dl dt {
  width: 80px;
  margin-bottom: 16px;
}

#contents .sec-account .sns-ul li a dl dd {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  font-size: 1.6rem;
  font-weight: 400;
}

#contents .sec-account .sns-ul li a[target=_blank]::after {
  display: none;
}

/*オープニング演出*/
header{
    opacity:0;
    transition:opacity 0.6s ease-out 0.3s,transform 0.3s ease-out 0s;
}

body.show header{
    opacity:1;
}

.toparea__mobility-logo,
.toparea__copyblock,
.toparea__top-text,
.toparea__main,
.message-sub__btn{
    opacity:0;
    transition:opacity 0.6s ease-out;
}




body.show .toparea__mobility-logo,
body.show .toparea__copyblock,
body.show .toparea__top-text,
body.show .toparea__main,
body.show .message-sub__btn{
    
    opacity:1;
}

.toparea{
    padding-bottom:50em;
    transform:translate3d(0,0,0);
    position: relative;
}

body.show .toparea__mobility-logo{
    transition-delay:0.6s;

}

body.show .toparea__copyblock{
     transition-delay:1s;
}

body.show .toparea__top-text{
     transition-delay:1.4s;
}

body.show .message-sub__btn{
    transition-delay:1.8s;
    pointer-events:auto;
    display:none;
}

body.show .toparea__top{
    pointer-events: auto;
    position:relative;
}

body.show .toparea__main{
     transition-delay:2.1s;
     pointer-events: auto;

}

.toparea__copyblock img{
    width:100%;
    left:0;
    top:0;
}

.toparea:after{
    content:"";
    position:absolute;
    left:0;top:0;
    width:100%;
    height:100%;
    z-index: -1;
    opacity:0;
    transition:opacity 0.6s ease-out 0.6s;
    background-image:linear-gradient(to bottom,rgba(0,100,255,0) 0% ,
    rgba(0,100,255,0.2) 6% ,
    rgba(0,100,255,.35) calc(12%),
    rgba(0,100,255,0.4) calc(28%),
    rgba(0,100,255,0) calc(54% - 10em),
    rgba(0,100,255,0));
    pointer-events:none;

}



.toparea:has(.toparea__top.headerfixed)::after{
    background-image:linear-gradient(to bottom,rgba(0,100,255,0.0) 0% ,
    rgba(0,100,255,0.0) calc(7% + 4em) ,
    rgba(0,100,255,.35) calc(25% + 4em),
    rgba(0,100,255,.35) calc(35% + 4em),
    rgba(0,100,255,0) calc(54% - 6em),
    rgba(0,100,255,0));
}

.toparea__copyblock:after{
    content:"";
    position:absolute;
    left:0;top:-15%;
    width:100%;
    height:140%;
    z-index: -1;
    opacity:0.3;
    pointer-events: none;
}


.contents-wrap .message-sub__btn{
    width:12em;
    padding:0.25em 0.5em;
    margin:0 auto;
    background:#fff;
    position: relative;
    line-height: 1.25;
    text-align: center;
    font-weight:bold;
     pointer-events:auto;
}



.toparea__top-text:after{
    /*content:"";*/
    position:absolute;
    left:5%;top:-120%;
    width:90%;
    height:222%;
    background:rgba(0,100,245,0.0);
    background-image:linear-gradient(to bottom,rgba(0,100,235,0) 0% ,rgba(0,100,235,0.7) 80% , rgba(0,100,235,1) 94%,rgba(0,100,235,0));
    filter:blur(5em);
    z-index:-1;
    opacity:0.5;
}



body.show .toparea:after{
    opacity:1;
}

.modal{
    position:fixed;
    width:100%;
    height:100%;
   
    z-index:1110;
    top:0;
    visibility:hidden;
    background-color:rgba(0,0,0,0);
    transition:background-color 0.3s ease-out;
}


.modal.show-detail{
     visibility:visible;
}

modal.hide-detail{
    
}

.modal.show-gallery{
     visibility:visible;
    
    background-color:rgba(0,0,0,0.8);
}

.modal.hide-gallery{
    visibility:visible;
    background-color:rgba(0,0,0,0);
}

.galleryarea_wrap{
    width:90%;
    max-width:960px;
    position:absolute;
    left:50%;top:50%;
    transform:translate(-50%,-50%);
    transition:opacity 0.6s ease-out;
    opacity:0;
    height: 95dvh;
}

.galleryarea_wrap.rotateVertical{

}

.galleryarea_wrap.rotateVertical .galleryarea_photo-area{
    transform:rotate(90deg);
}


.galleryarea{
    position: absolute;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
}

.galleryarea img{
     display:block;
}
.modal.show-gallery .galleryarea_wrap{
    opacity:1;
}

.modal.hide-gallery .galleryarea{
    opacity:0;
}

.galleryarea_currentpicture img,
.galleryarea_lastpicture img{
   
    height: 100%;
    width: auto;
    margin: 0 auto;
    height: 85dvh;
    max-width: inherit;
}

.galleryarea_currentpicture img.horizon,
.galleryarea_lastpicture img.horizon{
    width: 100%;
    height: auto;

}

.galleryarea_rotation{
    position:absolute;
    top:0;left:0;
    display:none;
}

.galleryarea_lastpicture{
    position:absolute;
    top:0;left:0;
    transition:opacity 0.6s ease-out;
}

.galleryarea_lastpicture.hide{
    opacity:0;
    display:block !important;
}

.galleryarea_currentpicture{
    position:relative;
    top:0;left:0;
    transition:opacity 0.6s ease-out;
    opacity:0;
    margin: 0 auto;
}

.galleryarea_currentpicture.notransition{
    transition:none;
}
.galleryarea_lastpicture{
    position: absolute;
    width: 100%;
    /*height: 100%; */
    top: 50%;
    left:50%;
    width: 100%;
    height: 100%;
    transform:translate(-50%,-50%)
   
}

.galleryarea_lastpicture img{
    position: relative;
    display:block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.galleryarea_lastpicture.notransition{
    transition:none;
}

.galleryarea_currentpicture.show{
     opacity:1;
}



.galleryarea_left-arrow,
.galleryarea_right-arrow{
     position:absolute;
     top:50%;
     left:0.5em;
     width:0.75em;
     transform:translateY(-50%);
     filter:drop-shadow(0.05em 0.05em 0.2em rgba(0,0,0,0.4));
}

.galleryarea_left-arrow{
    transform:translateY(-50%) scaleX(-1);
}

.galleryarea_right-arrow{
    left:auto;
    right:0.5em;
}

.galleryarea_close{
    position:absolute;
    right:0.5em;
    top:0.5em;
    width: 2.25em;
    padding: 0.5em;
    background: #fff;
    border-radius:1.125em;
    opacity:0;
    transition:opacity 0.3s ease-out;
}

.modal.show-gallery .galleryarea_close{
    opacity:1;
}

.modal.hide-gallery .galleryarea_close{
    opacity:0;
}



.galleryarea_close img{
    display:block;
}

.galleryarea_left-block,
.galleryarea_right-block{
    position:absolute;
    top:0;
    width:50%;
    left:0;
}

.galleryarea_right-block{
    right:0;
}


.box5 {
    display:none;
}

.menu-sp__menu-block4{
    pointer-events:none;
}

.menu-sp__menu-block4 .menu-sp__subtitle{
    color:#ccc !important;
}

.header-navi__gallery{
    color:#ccc !important;
    pointer-events:none;
   

}

.header-navi__top li:nth-child(4){
    pointer-events:none;
}


