@media screen and (min-width:1024px) {
    /*whole*/
    *{
        font-family: 'Noto Sans JP', sans-serif;
    }
    html, body{
        margin:0;
        padding:0;
    }
    body{
        position: relative;
    }

    /*header*/
    .site-header{
        width: 100%;
        background: #fff;
        padding: 0.5em;
        top: 0;
        transition: .5s;
        z-index: 999;
        opacity: 0.9;
    }
    .nav{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .nav li:last-child{
        margin-right:1.5em;
        padding: 0.5em;
    }
    .nav_item{
        width: 30%;
        list-style-type: none;
        font-size:1.3em;
        color: black;
    }
    .nav_item img{
        width: 100%;
    }

    /******contents******/
    .main{
        width: 98%;
        margin: 2.0em auto;
    }
    /*title*/
    .title_42nd{
        width: 70%;
        margin: 0.5em auto;
        position: relative;
    }
    .title_42nd::before{
        content: "";
        position: absolute;
        background: #F0F8FF;
        width: 180px;
        height: 180px;
        border-radius: 50%;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
        z-index: -1;
    }
    .title_42nd img{
        width: 100%;
    }
    .introduction_42nd{
        width: 75%;
        margin: 2.5em auto 1.0em;
    }
    .introduction_42nd p{
        font-size: 1.2em;
        line-height: 1.5em;
    }
        /*ayp*/
        .ayp{
            width: 90%;
            margin: 2.5em auto;
        }
        .title_ayp{
            width: 95%;
            margin: 0.5em 0 0.5em 1.0em;
            padding: 0.5em 1.0em;
            position: relative;
            border-bottom: 1px solid #ffcce6;
            font-size: 1.5em;
            font-weight: 900;
        }
        .title_ayp::after{
            position: absolute;
            content: " ";
            display: block;
            border-bottom: 4px solid #ffcce6;
            width: 20%;
            left: 0;
            bottom: -2.5px;
        }
        .caption_ayp{
            width: 95%;
            margin: 1.5em auto;
        }
        .caption_ayp p{
            font-size: 1.2em;
            line-height: 1.5em;
        }
    
    /*iep*/
    .iep{
        width: 90%;
        margin: 2.5em auto;
    }
    .title_iep{
        width: 95%;
        margin: 0.5em 0 0.5em 1.0em;
        padding: 0.5em 1.0em;
        position: relative;
        border-bottom: 1px solid #ffcce6;
        font-size: 1.5em;
        font-weight: 900;
    }
    .title_iep::after{
        position: absolute;
        content: " ";
        display: block;
        border-bottom: 4px solid #ffcce6;
        width: 20%;
        left: 0;
        bottom: -2.5px;
    }
    .caption_iep{
        width: 95%;
        margin: 1.5em auto;
    }
    .caption_iep p{
        font-size: 1.2em;
        line-height: 1.5em;
    }
    /*arrival*/
    .arrival{
        width: 90%;
        margin: 2.5em auto;
    }
    .title_arrival{
        width: 95%;
        margin: 0.5em 0 0.5em 1.0em;
        padding: 0.5em 1.0em;
        position: relative;
        border-bottom: 1px solid #99CFFF;
        font-size: 1.5em;
        font-weight: 900;
    }
    .title_arrival::after{
        position: absolute;
        content: " ";
        display: block;
        border-bottom: 4px solid #99CFFF;
        width: 20%;
        left: 0;
        bottom: -2.5px;
    }
    .caption_arrival{
        width: 95%;
        margin: 1.5em auto;
    }
    .caption_arrival p{
        font-size: 1.2em;
        line-height: 1.5em;
    }
    /*departure*/
    .departure{
        width: 90%;
        margin: 2.5em auto;
    }
    .title_departure{
        width: 95%;
        margin: 0.5em 0 0.5em 1.0em;
        padding: 0.5em 1.0em;
        position: relative;
        border-bottom: 1px solid #11aaa4;
        font-size: 1.5em;
        font-weight: 900;
    }
    .title_departure::after{
        position: absolute;
        content: " ";
        display: block;
        border-bottom: 4px solid #11aaa4;
        width: 20%;
        left: 0;
        bottom: -2.5px;
    }
    .caption_departure{
        width: 95%;
        margin: 1.5em auto;
    }
    .caption_departure p{
        font-size: 1.2em;
        line-height: 1.5em;
    }        
    /*sr*/
    .sr{
        width: 90%;
        margin: 2.5em auto;
    }
    .title_sr{
        width: 25%;
        margin: 0.5em 0 0.5em 1.0em;
        padding: 0.5em 1.0em;
        position: relative;
        border: 4px solid #90cafd;
        text-align: center;
    }
    .title_sr::after{
        position: absolute;
        content: '';
        background-color: #d5ebfe;
        width: calc(100% + 3px);
        height: calc(100% + 3px);
        top: -7px;
        left: 4px;
        z-index: -1;
    }
    .title_sr span{
        font-size: 1.5em;
        font-weight: 900;
        color: #222;
    }
    .caption_sr{
        width: 90%;
        margin: 1.5em auto;
    }
    .caption_sr p{
        font-size: 1.2em;
        line-height: 1.5em;
    }
    .acd_sr{
        width: 85%;
        margin: 1.0em auto;
    }
    .item_acd_sr{
        width: 90%;
        margin: 0 auto;
    }
    .title_acd_sr{
        width: 100%;
        position: relative;
        padding: 1.0em 4.0em;
        border-bottom: 1px solid #fff;
        cursor: pointer;
        background-color: #75b1ff;
    }
    .acd_sr>.item_acd_sr:first-child .title_acd_sr{
        border-top: 1px solid #fff;
    }
    .title_acd_sr::before{
        background: #fff; 
        content: "";
        height: 2px; 
        position: absolute;
        right: 40px;
        top: 50%; 
        transform: rotate(90deg); 
        transition: .3s ease-in-out;
        width: 15px; 
    }
    .title_acd_sr::after{
        background: #fff; 
        content: "";
        height: 2px; 
        position: absolute;
        right: 40px;
        top: 50%; 
        transition: .3s ease-in-out;
        width: 15px; 
    }
    .title_acd_sr.open::before{
        transform: rotate(180deg);
    }
    .title_acd_sr.open::after{
        opacity: 0;
    }
    .title_acd_sr span{
        font-size: 1.3em;
        font-weight: 900;
        color: #fff;
    }
    .contents_acd_sr{
        display: none;
        border-left: 1px solid #75b1ff;
        border-right: 1px solid #75b1ff;
    }
    .contents_acd_sr:last-child{
        border-bottom: 1px solid #75b1ff;
    }
    .flex_acd_sr{
        display: flex;
        overflow-x: scroll;
        white-space: nowrap;
    }
    .item_flex_sr{
        width: 30%;
        margin: 1.0em;
        padding: 1.0em 2.0em;
    }
    .image_acd_sr{
        width: 100%;
        margin: 0 auto;
        text-align: center;
    }
    .image_acd_sr img{
        width: 12vw;
        border: 2px solid #333;
    }
    .date_acd_sr{
        width: 100%;
        margin: 1.5em auto 0;
        text-align: center;
    }
    .date_acd_sr p{
        font-size: 1.0em;
        line-height: 1.6em;
    }
    .date_acd_sr p:first-child{
        font-weight: 900;
    }
    .note_sr{
        width: 85%;
        margin: 1.5em auto;
    }
    .item_note_sr{
        width: 100%;
        list-style-type: none;
        line-height: 1.5em;
        font-size: 1.2em;
    }
    .item_note_sr::before{
        content: '※';
    }
    .list_note_sr{
        width: 85%;
        margin: 1.5em auto;
        padding: 1.0em 2.0em;
        border: 1px dotted #99CFFF;
    }
    .item_list_sr{
        font-size: 1.2em;
        line-height: 1.5em;
    }
    .item_list_sr:not(:last-of-type)::after{
        content: '／';
    }

    /*swiper*/
    .swiper {
        width: 75%;
        height: 40vw;
        margin: 1.0em auto;
        position: relative;
    }
    .swiper-wrapper{
        width: 100%;
        text-align: center;
    }    
    .swiper-slide img{
        width: 70%;
        border: 2px solid #333;
    }
    .swiper-button-prev{
        left: 5%;
        top:40%;
        --swiper-navigation-color: #333;
    }
    .swiper-button-next{
        right: 5%;
        top: 40%;
        --swiper-navigation-color: #333;
    }
    .swiper-pagination{
        position: absolute;
        left: 50%;
        bottom:40%;  
    }

    /*smooth scroll*/
    .topbtn{
        right: 40px;
        background: #333;
        opacity: 0.6;
        border-radius: 50%;
        display: block;
        width: 70px;
        height: 70px;
        text-decoration: none;
    }
    .topbtn::before{
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        content: '\f102';
        font-size: 25px;
        color: #fff;
        position: absolute;
        width: 25px;
        height: 25px;
        top: -5px;
        bottom: 0;
        right: 0;
        left: 0;
        margin: auto;
        text-align: center;
    }

    /*footer*/
    .site-footer{
        position: relative;
        margin-top: 2.4em;
        color: #fff;
    }
    .site-footer a{
        text-decoration: none;
        color: #fff;
    }
    .site-footer .top-section{
        padding: 1.6em 0.9em;
        background-color: #333;
    }
    .site-footer .top-section .flex{
        display: flex;
        justify-content: center;
    }
    .site-footer .top-section .flex .left{
        width: 50%;
        margin-left: 10vw;
    }
    .site-footer .footer-logo{
        position: relative;
        padding: 0;
        margin: 0;
        width: 100%;
        font-size: 2.2em;
        font-weight: bold;
    }
    .address{
        margin: 0.8em 0 0;
        padding: 0;
    }
    .site-footer .sns{
        margin: 1.2em 0 0 2.5em;
        padding: 0;
    }
    .site-footer .sns li{
        display: inline-block;
        margin: 0 1.2em 0 0;
        padding: 0;
        font-size: 2.2em;
    }
    .site-footer .sns li:last-child{
        margin-right: 0;
    }
    .site-footer .sns li a{
        transition: all 0.5s;
    }
    .site-footer .sns li a:hover{
        opacity: 0.7;
        transform:scale(1.2, 1.2)
    }
    .site-footer .top-section .flex .right{
        display: flex;
        width: 70%;
    }
    .navi-section{
        display: flex;
        flex-direction: column;
        width: 50%;
        margin-left: 6vw;
    }
    .title-section{
        width: 15vw;
        min-width: 30px;
        padding: 0.5rem 2rem;
        border-top: 3px solid white;
        border-bottom: 3px solid white;
        text-align: center;
        margin: 1em 0;
    }
    .site-footer .navi-list{
        margin: 0;
        padding: 0;
        list-style: none;
        line-height: 2em;
    }
    .site-footer .navi-list li{
        margin: 0.5em 0 0 0;
        padding: 0;
    }
    .site-footer .navi-list li:first-child{
        margin: 0;
    }
    .site-footer .navi-list a:hover,
    .site-footer .title-list a:hover{
        text-decoration: none;
        opacity: 0.7;
    }
    .site-footer .title-list{
        margin: 0 0 0.9em 0;
        padding: 0;
        font-weight: bold;
        line-height: 2em;
    }
    .site-footer .bottom-section{
        display: flex;
        justify-content: center;
        padding: 1.6em 0.9em;
        background: #222;
    }
    .site-footer .copyright{
        width: 90%;
        margin: 0;
        padding: 0;
        text-align: center;
    }  
}









@media screen and (min-width:768px) and (max-width:1023px) {
    /*whole*/
    *{
        font-family: 'Noto Sans JP', sans-serif;
    }
    html, body{
        margin:0;
        padding:0;
    }
    body{
        position: relative;
    }

    /*header*/
    .site-header{
        width: 100%;
        top: 0;
        transition: .5s;
        z-index: 999;
        margin: 1.0em auto;
    }
    .nav{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .nav li:last-child{
        margin-right:1.5em;
        padding: 0.5em;
    }
    .nav_item{
        list-style-type: none;
        font-size:1.1em;
        color: black;
        width: 40%;
    }
    .nav_item img{
        width: 100%;
    }

    /******contents******/
    .main{
        width: 98%;
        margin: 3.0em auto;
    }
    /*title*/
    .title_42nd{
        width: 65%;
        margin: 0.5em auto;
        position: relative;
    }
    .title_42nd::before{
        content: "";
        position: absolute;
        background: #F0F8FF;
        width: 130px;
        height: 130px;
        border-radius: 50%;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
        z-index: -1;
    }
    .title_42nd img{
        width: 100%;
    }
    .introduction_42nd{
        width: 80%;
        margin: 3.0em auto 1.0em;
    }
    .introduction_42nd p{
        font-size: 1.0em;
        line-height: 1.5em;
    }
    /*ayp*/
    .ayp{
        width: 93%;
        margin: 1.5em auto;
    }
    .title_ayp{
        width: 95%;
        margin: 0.5em 0 0.5em 1.0em;
        padding: 0.5em 1.0em;
        position: relative;
        border-bottom: 1px solid #ffcce6;
        font-size: 1.3em;
        font-weight: 900;
    }
    .title_ayp::after{
        position: absolute;
        content: " ";
        display: block;
        border-bottom: 4px solid #ffcce6;
        width: 20%;
        left: 0;
        bottom: -2.5px;
    }
    .caption_ayp{
        width: 90%;
        margin: 1.5em auto;
    }
    .caption_ayp p{
        font-size: 1.0em;
        line-height: 1.5em;
    }
    /*iep*/
    .iep{
        width: 93%;
        margin: 1.5em auto;
    }
    .title_iep{
        width: 95%;
        margin: 0.5em 0 0.5em 1.0em;
        padding: 0.5em 1.0em;
        position: relative;
        border-bottom: 1px solid #ffcce6;
        font-size: 1.3em;
        font-weight: 900;
    }
    .title_iep::after{
        position: absolute;
        content: " ";
        display: block;
        border-bottom: 4px solid #ffcce6;
        width: 20%;
        left: 0;
        bottom: -2.5px;
    }
    .caption_iep{
        width: 90%;
        margin: 1.5em auto;
    }
    .caption_iep p{
        font-size: 1.0em;
        line-height: 1.5em;
    }
    /*arrival*/
    .arrival{
        width: 93%;
        margin: 2.5em auto;
    }
    .title_arrival{
        width: 95%;
        margin: 0.5em 0 0.5em 1.0em;
        padding: 0.5em 1.0em;
        position: relative;
        border-bottom: 1px solid #99CFFF;
        font-size: 1.3em;
        font-weight: 900;
    }
    .title_arrival::after{
        position: absolute;
        content: " ";
        display: block;
        border-bottom: 4px solid #99CFFF;
        width: 20%;
        left: 0;
        bottom: -2.5px;
    }
    .caption_arrival{
        width: 90%;
        margin: 1.5em auto;
    }
    .caption_arrival p{
        font-size: 1.0em;
        line-height: 1.5em;
    }
    /*departure*/
    .departure{
        width: 93%;
        margin: 2.5em auto;
    }
    .title_departure{
        width: 95%;
        margin: 0.5em 0 0.5em 1.0em;
        padding: 0.5em 1.0em;
        position: relative;
        border-bottom: 1px solid #11aaa4;
        font-size: 1.3em;
        font-weight: 900;
    }
    .title_departure::after{
        position: absolute;
        content: " ";
        display: block;
        border-bottom: 4px solid #11aaa4;
        width: 20%;
        left: 0;
        bottom: -2.5px;
    }
    .caption_departure{
        width: 90%;
        margin: 1.5em auto;
    }
    .caption_departure p{
        font-size: 1.0em;
        line-height: 1.5em;
    }
    /*sr*/
    .sr{
        width: 93%;
        margin: 2.5em auto;
    }
    .title_sr{
        width: 30%;
        margin: 0.5em 0 0.5em 1.0em;
        padding: 0.5em 1.0em;
        position: relative;
        border: 3px solid #90cafd;
        text-align: center;
    }
    .title_sr::after{
        position: absolute;
        content: '';
        background-color: #d5ebfe;
        width: calc(100% + 3px);
        height: calc(100% + 3px);
        top: -7px;
        left: 4px;
        z-index: -1;
    }
    .title_sr span{
        font-size: 1.3em;
        font-weight: 900;
        color: #222;
    }
    .caption_sr{
        width: 90%;
        margin: 1.5em auto;
    }
    .caption_sr p{
        font-size: 1.0em;
        line-height: 1.5em;
    }
    .acd_sr{
        width: 85%;
        margin: 1.0em auto;
    }
    .item_acd_sr{
        width: 90%;
        margin: 0 auto;
    }
    .title_acd_sr{
        width: 100%;
        position: relative;
        padding: 1.0em 3.0em;
        border-bottom: 1px solid #fff;
        cursor: pointer;
        background-color: #75b1ff;
    }
    .acd_sr>.item_acd_sr:first-child .title_acd_sr{
        border-top: 1px solid #fff;
    }
    .title_acd_sr::before{
        background: #fff; 
        content: "";
        height: 2px; 
        position: absolute;
        right: 40px;
        top: 50%; 
        transform: rotate(90deg); 
        transition: .3s ease-in-out;
        width: 15px; 
    }
    .title_acd_sr::after{
        background: #fff; 
        content: "";
        height: 2px; 
        position: absolute;
        right: 40px;
        top: 50%; 
        transition: .3s ease-in-out;
        width: 15px; 
    }
    .title_acd_sr.open::before{
        transform: rotate(180deg);
    }
    .title_acd_sr.open::after{
        opacity: 0;
    }
    .title_acd_sr span{
        font-size: 1.2em;
        font-weight: 900;
        color: #fff;
    }
    .contents_acd_sr{
        width: 100%;
        display: none;
        border-left: 1px solid #75b1ff;
        border-right: 1px solid #75b1ff;
    }
    .contents_acd_sr:last-child{
        border-bottom: 1px solid #75b1ff;
    }
    .flex_acd_sr{
        display: flex;
        overflow-x: scroll;
        white-space: nowrap;
        padding: 2.0em;
    }
    .item_flex_sr{
        width: 30%;
        margin: 0 1.5em;
    }
    .image_acd_sr{
        width: 80%;
        margin: 0 auto;
    }
    .image_acd_sr img{
        width: 15vw;
        text-align: center;
        border: 2px solid #333;
    }
    .date_acd_sr{
        width: 95%;
        margin: 1.0em auto 0;
        text-align: center;
    }
    .date_acd_sr p{
        font-size: 0.9em;
        line-height: 1.6em;
    }
    .date_acd_sr p:first-child{
        font-weight: 900;
    }
    .note_sr{
        width: 85%;
        margin: 1.5em auto;
    }
    .item_note_sr{
        width: 100%;
        list-style-type: none;
        line-height: 1.5em;
        font-size: 1.0em;
    }
    .item_note_sr::before{
        content: '※';
    }
    .list_note_sr{
        width: 85%;
        margin: 1.5em auto;
        padding: 1.0em 2.0em;
        border: 1px dotted #99CFFF;
    }
    .item_list_sr{
        font-size: 1.0em;
        line-height: 1.5em;
    }
    .item_list_sr:not(:last-of-type)::after{
        content: '／';
    }

    /*swiper*/
    .swiper {
        width: 70%;
        height: 40vw;
        margin: 1.0em auto;
        position: relative;
    }
    .swiper-wrapper{
        width: 100%;
        text-align: center;
    }    
    .swiper-slide img{
        width: 70%;
        border: 2px solid #333;
    }
    .swiper-button-prev{
        left: 5%;
        top:40%;
        --swiper-navigation-color: #333;
    }
    .swiper-button-next{
        right: 5%;
        top: 40%;
        --swiper-navigation-color: #333;
    }
    .swiper-pagination{
        position: absolute;
        left: 50%;
        bottom:40%;  
    }

    /*smooth scroll*/
    .topbtn{
        right: 40px;
        background: #333;
        opacity: 0.6;
        border-radius: 50%;
        display: block;
        width: 70px;
        height: 70px;
        text-decoration: none;
    }
    .topbtn::before{
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        content: '\f102';
        font-size: 25px;
        color: #fff;
        position: absolute;
        width: 25px;
        height: 25px;
        top: -5px;
        bottom: 0;
        right: 0;
        left: 0;
        margin: auto;
        text-align: center;
    }

    /*footer*/
    .site-footer{
        position: relative;
        color: #fff;
    }
    .site-footer a{
        text-decoration: none;
        color: #fff;
    }
    .site-footer .top-section{
        padding: 1.6em 0;
        background-color: #333;
    }
    .site-footer .top-section .flex{
        display: flex;
        justify-content: center;
    }
    .site-footer .top-section .flex .left{
        width: 50%;
        margin-left: 8vw;
    }
    .site-footer .footer-logo{
        position: relative;
        padding: 0;
        margin: 0;
        width: 100%;
        font-size: 2.2em;
        font-weight: bold;
    }
    .address{
        margin: 0.8em 0 0;
        padding: 0;
        line-height: 1.5em;
    }
    .site-footer .sns{
        margin: 1.2em 0 0 2.5em;
        padding: 0;
    }
    .site-footer .sns li{
        display: inline-block;
        margin: 0 1.2em 0 0;
        padding: 0;
        font-size: 2.2em;
    }
    .site-footer .sns li:last-child{
        margin-right: 0;
    }
    .site-footer .sns li a{
        transition: all 0.5s;
    }
    .site-footer .sns li a:hover{
        opacity: 0.7;
        transform:scale(1.2, 1.2)
    }
    .site-footer .top-section .flex .right{
        display: flex;
        width: 70%;
    }
    .navi-section{
        display: flex;
        flex-direction: column;
        width: 50%;
        margin-left: 6vw;
    }
    .title-section{
        width: 19vw;
        min-width: 30px;
        padding: 0.5rem 2rem;
        border-top: 3px solid white;
        border-bottom: 3px solid white;
        text-align: center;
        margin: 1em 0;
    }
    .site-footer .navi-list{
        margin: 0;
        padding: 0;
        list-style: none;
        line-height: 2em;
        font-size: 0.8em;
    }
    .site-footer .navi-list li{
        margin: 0.5em 0 0 0;
        padding: 0;
    }
    .site-footer .navi-list li:first-child{
        margin: 0;
    }
    .site-footer .navi-list a:hover,
    .site-footer .title-list a:hover{
        text-decoration: none;
        opacity: 0.7;
    }
    .site-footer .title-list{
        margin: 0 0 0.9em 0;
        padding: 0;
        font-weight: bold;
        line-height: 2em;
    }
    .site-footer .bottom-section{
        display: flex;
        padding: 1.6em 0.9em;
        background: #222;
    }
    .site-footer .copyright{
        width: 90%;
        margin: 0;
        padding: 0;
        text-align: center;
    }
}









@media screen and (max-width:767px) {
    /*whole*/
    *{
        font-family: 'Noto Sans JP', sans-serif;
    }
    html, body{
        margin:0;
        padding:0;
    }
    body{
        position: relative;
    }

    /*header*/
    .site-header{
        width: 100%;
        margin: 1.0em 0;
        top: 0;
        transition: .5s;
        z-index: 999;
        list-style-type: none;
    }
    .nav_item{
        width: 70%;
    }
    .nav_item img{
        width: 100%;
    }

    /******contents******/
    .main{
        width: 98%;
        margin: 2.5em auto;
    }
    /*title*/
    .title_42nd{
        width: 95%;
        margin: 0.5em auto;
        position: relative;
    }
    .title_42nd::before{
        content: "";
        position: absolute;
        background: #F0F8FF;
        width: 90px;
        height: 90px;
        border-radius: 50%;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
        z-index: -1;
    }
    .title_42nd img{
        width: 100%;
    }
    .introduction_42nd{
        width: 85%;
        margin: 2.0em auto;
    }
    .introduction_42nd p{
        font-size: 0.9em;
        line-height: 1.5em;
    }
     /*ayp*/
     .ayp{
        width: 95%;
        margin: 1.5em auto;
    }
    .title_ayp{
        width: 95%;
        margin: 0.5em auto;
        padding: 0.5em;
        position: relative;
        border-bottom: 1px solid #ffcce6;
        font-size: 1.1em;
        font-weight: 900;
    }
    .title_ayp::after{
        position: absolute;
        content: " ";
        display: block;
        border-bottom: 4px solid #ffcce6;
        width: 20%;
        left: 0;
        bottom: -2.5px;
    }
    .caption_ayp{
        width: 90%;
        margin: 1.0em auto;
    }
    .caption_ayp p{
        font-size: 0.9em;
        line-height: 1.5em;
    }
    /*iep*/
    .iep{
        width: 95%;
        margin: 1.5em auto;
    }
    .title_iep{
        width: 95%;
        margin: 0.5em auto;
        padding: 0.5em;
        position: relative;
        border-bottom: 1px solid #ffcce6;
        font-size: 1.1em;
        font-weight: 900;
    }
    .title_iep::after{
        position: absolute;
        content: " ";
        display: block;
        border-bottom: 4px solid #ffcce6;
        width: 20%;
        left: 0;
        bottom: -2.5px;
    }
    .caption_iep{
        width: 90%;
        margin: 1.0em auto;
    }
    .caption_iep p{
        font-size: 0.9em;
        line-height: 1.5em;
    }
    /*arrival*/
    .arrival{
        width: 95%;
        margin: 2.5em auto;
    }
    .title_arrival{
        width: 95%;
        margin: 0.5em auto;
        padding: 0.5em 1.0em;
        position: relative;
        border-bottom: 1px solid #99CFFF;
        font-size: 1.1em;
        font-weight: 900;
    }
    .title_arrival::after{
        position: absolute;
        content: " ";
        display: block;
        border-bottom: 4px solid #99CFFF;
        width: 20%;
        left: 0;
        bottom: -2.5px;
    }
    .caption_arrival{
        width: 90%;
        margin: 1.0em auto;
    }
    .caption_arrival p{
        font-size: 0.9em;
        line-height: 1.5em;
    }
    /*departure*/
    .departure{
        width: 95%;
        margin: 2.5em auto;
    }
    .title_departure{
        width: 95%;
        margin: 0.5em auto;
        padding: 0.5em 1.0em;
        position: relative;
        border-bottom: 1px solid #11aaa4;
        font-size: 1.1em;
        font-weight: 900;
    }
    .title_departure::after{
        position: absolute;
        content: " ";
        display: block;
        border-bottom: 4px solid #11aaa4;
        width: 20%;
        left: 0;
        bottom: -2.5px;
    }
    .caption_departure{
        width: 90%;
        margin: 1.0em auto;
    }
    .caption_departure p{
        font-size: 0.9em;
        line-height: 1.5em;
    }
    /*sr*/
    .sr{
        width: 95%;
        margin: 2.5em auto;
    }
    .title_sr{
        width: 50%;
        margin: 0.5em 0 0.5em 1.0em;
        padding: 0.5em 1.0em;
        position: relative;
        border: 3px solid #90cafd;
        text-align: center;
    }
    .title_sr::after{
        position: absolute;
        content: '';
        background-color: #d5ebfe;
        width: calc(100% + 3px);
        height: calc(100% + 3px);
        top: -7px;
        left: 4px;
        z-index: -1;
    }
    .title_sr span{
        font-size: 1.1em;
        font-weight: 900;
        color: #222;
    }
    .caption_sr{
        width: 90%;
        margin: 1.5em auto;
    }
    .caption_sr p{
        font-size: 0.9em;
        line-height: 1.5em;
    }
    .acd_sr{
        width: 90%;
        margin: 1.0em auto;
    }
    .item_acd_sr{
        width: 90%;
        margin: 0 auto;
    }
    .title_acd_sr{
        width: 100%;
        position: relative;
        padding: 1.0em 2.0em;
        border-bottom: 1px solid #fff;
        background-color: #75b1ff;
    }
    .acd_sr>.item_acd_sr:first-child .title_acd_sr{
        border-top: 1px solid #fff;
    }
    .title_acd_sr::before{
        background: #fff; 
        content: "";
        height: 2px; 
        position: absolute;
        right: 40px;
        top: 50%; 
        transform: rotate(90deg); 
        transition: .3s ease-in-out;
        width: 15px; 
    }
    .title_acd_sr::after{
        background: #fff; 
        content: "";
        height: 2px; 
        position: absolute;
        right: 40px;
        top: 50%; 
        transition: .3s ease-in-out;
        width: 15px; 
    }
    .title_acd_sr.open::before{
        transform: rotate(180deg);
    }
    .title_acd_sr.open::after{
        opacity: 0;
    }
    .title_acd_sr span{
        font-size: 1.0em;
        font-weight: 900;
        color: #fff;
    }
    .contents_acd_sr{
        width: 100%;
        display: none;
        border-left: 1px solid #75b1ff;
        border-right: 1px solid #75b1ff;
        overflow-x: scroll;
    }
    .contents_acd_sr:last-child{
        border-bottom: 1px solid #75b1ff;
    }
    .flex_acd_sr{
        display: flex;
        overflow-x: scroll;
        white-space: nowrap;
    }
    .item_flex_sr{
        width: 40%;
        margin: 2.0em;
    }
    .image_acd_sr{
        width: 80%;
        text-align: center;
        margin: 0 auto;
    }
    .image_acd_sr img{
        width: 25vw;
        border: 2px solid #333;
    }
    .date_acd_sr{
        width: 100%;
        margin: 1.0em auto 0;
        text-align: center;
    }
    .date_acd_sr p{
        font-size: 0.8em;
        line-height: 1.6em;
    }
    .date_acd_sr p:first-child{
        font-weight: 900;
    }
    .note_sr{
        width: 85%;
        margin: 1.5em auto;
    }
    .item_note_sr{
        width: 100%;
        list-style-type: none;
        line-height: 1.5em;
        font-size: 0.9em;
    }
    .item_note_sr::before{
        content: '※';
    }
    .list_note_sr{
        width: 95%;
        margin: 1.5em auto;
        padding: 1.0em;
        border: 1px dotted #99CFFF;
    }
    .item_list_sr{
        font-size: 0.9em;
        line-height: 1.5em;
    }
    .item_list_sr:not(:last-of-type)::after{
        content: '／';
    }

    /*swiper*/
    .swiper {
        width: 90%;
        height: 55vw;
        margin: 1.0em auto;
        position: relative;
    }
    .swiper-wrapper{
        width: 100%;
        text-align: center;
    }    
    .swiper-slide img{
        width: 70%;
        border: 2px solid #333;
    }
    .swiper-button-prev{
        left: 0;
        top:40%;
        --swiper-navigation-color: #333;
    }
    .swiper-button-prev::after{
        font-size: 1.4em;
    }
    .swiper-button-next{
        right: 0;
        top: 40%;
        --swiper-navigation-color: #333;
    }
    .swiper-button-next::after{
        font-size: 1.4em;
    }
    .swiper-pagination{
        position: absolute;
        left: 50%;
        bottom:40%;  
    }

    /*smooth scroll*/
    .topbtn{
        right: 40px;
        background: #333;
        opacity: 0.6;
        border-radius: 50%;
        display: block;
        width: 50px;
        height: 50px;
        text-decoration: none;
    }
    .topbtn::before{
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        content: '\f102';
        font-size: 25px;
        color: #fff;
        position: absolute;
        width: 25px;
        height: 25px;
        top: -5px;
        bottom: 0;
        right: 0;
        left: 0;
        margin: auto;
        text-align: center;
    }

    /*footer*/
    .site-footer{
        position: relative;
        margin-top: 2.4em;
        color: #fff;
    }
    .site-footer a{
        text-decoration: none;
        color: #fff;
    }
    .site-footer a:hover{
        text-decoration: underline;
    }
    .site-footer .top-section{
        padding: 1.2em;
        background: #333;
    }
    .site-footer .top-section .flex{
        display: block;
    }
    .site-footer .top-section .flex .left{
        width: 100%;
    }
    .site-footer .top-section .flex .left p{
        line-height: 1.8em;
    }
    .site-footer .footer-logo{
        font-size: 1.7em;
    }
    .address{
        font-size: 0.8em;
    }
    .site-footer .sns{
        margin: 0.5em 0 0;
        padding: 0;
    }
    .site-footer .sns li{
        display: inline-block;
        margin: 0 1em 0 0;
        padding: 0;
        font-size: 1.5em;
    }
    .site-footer .sns li:last-child{
        margin-right: 0;
    }
    .site-footer .top-section .flex .right{
        width: 100%;
    }
    .navi-section{
        display: block;
        width: 100%;
        margin: 40px 0 0;
    }
    .title-section{
        width: 40vw;
        min-width: 30px;
        padding: 0.5rem 1rem;
        border-top: 2px solid white;
        border-bottom: 2px solid white;
        text-align: center;
        margin: 1em 0;
    }
    .site-footer .navi-list{
        list-style: none;
        padding-bottom: 10px;
        border-bottom: 1px solid #444;
    }
    .site-footer .navi-list li{
        border-top: 1px solid #444;
        padding-top: 10px;
        margin-top: 10px;
        font-size: 0.8em;
    }
    .site-footer .navi-list li:first-child{
        margin: 0;
    }
    .site-footer .navi-list a:hover,
    .site-footer .title-list a:hover{
        text-decoration: none;
    }
    .site-footer .title-list{
        margin: 0 0 0.9em 0;
        padding: 0;
        font-weight: bold;
        line-height: 2em;
    }
    .site-footer .bottom-section{
        display: block;
        padding: 2.2em;
        background: #222;
    }
    .site-footer .copyright{
        width: 100%;
        text-align: center;
        font-size: 0.9em;
    }
}