@charset "utf-8";

/*==================================================
スライダーのためのcss
===================================*/
.slider {
    padding-top: 230px;
    position:relative;
    z-index: 1;
    /*↑z-indexの値をh1のz-indexの値よりも小さくして背景に回す*/
    /*height: 100vh;/*スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
    background:url(../images/slider_bk.jpg);
}
/*　背景画像設定　*/

.slider-item01 img {
    max-width: 100%;
    margin: 0 auto;
    /*
    background:url(../images/main_01.jpg);
    */
}

.slider-item02 img {
    max-width: 100%;
    margin: 0 auto;
    /*
    background:url(../images/main_02.jpg);
    */
}

.slider-item03 img {
    max-width: 100%;
    margin: 0 auto;
    /*
    background:url(../images/main_03.jpg);
    */

}
.slider-item04 img {
    max-width: 100%;
    margin: 0 auto;
    /*
    background:url(../images/main_04.jpg);
    */

}

.slider-item {
    width: 100%;/*各スライダー全体の横幅を画面の高さいっぱい（100%）にする*/
    height:100%;
    /*height:100vh;*//*各スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
    background-repeat: no-repeat;/*背景画像をリピートしない*/
    background-position: center;/*背景画像の位置を中央に*/
    background-size: contain;/*背景画像が.slider-item全体を覆い表示*/
    /*background-color: #000;*/
}



/*矢印の設定*/

.slick-prev, 
.slick-next {
    position: absolute;
    z-index: 3;
    /*top: 42%;*/
    top: 55%;
  
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    /*border-top: 2px solid #fff;/*矢印の色*/
    /*border-right: 2px solid #fff;/*矢印の色*/
    /*height: 25px;
    /*width: 25px;
    */
    height: 60px;
    width: 60px;
}

.slick-prev {/*戻る矢印の位置と形状*/
    left:2.5%;
    background:url(../images/slick-prev-image.jpg);
    /*
    transform: rotate(-135deg);
    */
}

.slick-next {/*次へ矢印の位置と形状*/
    background:url(../images/slick-next-image.jpg);
    right:2.5%;
    /*
    transform: rotate(45deg);
    */
}


.slick-prev:hover, 
.slick-next:hover {opacity: 0.6;
    transition: 0.8s ;}

/*ドットナビゲーションの設定*/

.slick-dots {
    position: relative;
    z-index: 3;
    text-align:center;
    margin:30px 0 0 0;/*ドットの位置*/
}

.slick-dots li {
    display:inline-block;
    margin:0 5px;
}

.slick-dots button {
    color: transparent;
    outline: none;
    width:8px;/*ドットボタンのサイズ*/
    height:8px;/*ドットボタンのサイズ*/
    display:block;
    border-radius:50%;
    background:#ccc;/*ドットボタンの色*/
}

.slick-dots .slick-active button{
    background:#ae3232;/*ドットボタンの現在地表示の色*/
}



/*////////////////////////////////////////////////*/

header{
    position: absolute;
    top: 0;
    z-index: 999;
    width: 100%;
}

.header_contents{
    background:url(../images/head_bk.jpg);
    width: 100%;
    height: 150px;
}

.header_logo{
    width: 120px;
    margin: 0px auto;
    padding-top: 0px;
}
.header_logo img {max-width: 100%;}

/*
.header_logo{
    width: 20%;
    margin: 0px auto;
    padding-top: 27px;
}
.header_logo img {max-width: 100%;}
*/


.wrapper a{
    display: inline-block;
    line-height: 0;
    position: relative;
}
.wrapper a:before{
    content: "";
    display: block;
    background-color: rgba(0,0,0,0.5);
    opacity: 0.0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    transition-duration: 0.8s;
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    -ms-transition-duration: 0.8s;
}
.wrapper a:hover:before{
    opacity: 1.0;
}

nav{width: 100%;
    background-color: #fff;}

nav ul li.btn{    
    padding:15px 30px;
    margin:2.5px;
    border-radius: 5px;

    text-align: center;
    color: #000;
}

nav ul{
    list-style: none;
    display:flex;
    width: 960px; margin: 0 auto;
    justify-content:space-between;
}
nav ul li {font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;}

nav ul li img {width: 100%;} 

nav ul li a {
    position: relative;
    display: inline-block;
    text-decoration: none;
    color: #000;
}
nav ul li a::after {
    position: absolute;
    bottom: -4px;
    left: 0;
    content: '';
    width: 100%;
    height: 2px;
    background: #ae3232;
    transform: scale(0, 1);
    transform-origin: center top;
    transition: transform .3s;
}
nav ul li a:hover::after {
    transform: scale(1, 1);
}
/*////////////////////////////////////////////////*/


/*========= レイアウトのためのCSS ===============*/
ul{
    margin:0;
    padding: 0;
    list-style: none;
}


a{
    text-decoration: none;
}

a:hover,
a:active{
    text-decoration: none;
}


section{}
/*
section p{
    text-align: center;
    font-size: 18px;
    line-height: 220%;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: 0.1em;
}
*/

div.main_title{
    max-width: 50%;
    margin: 30px auto 80px auto;
    text-align: center;
}
div.main_title img{
    max-width: 50%;
    margin: 0px auto;
}

/*
h2.main_title{
    text-align: center;
    font-size: 4vw;
    margin-bottom: 80px;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: 0.1em;
}

h3.main_title{
    text-align: center;
    font-size: 2.5vw;
    margin-bottom: 80px;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: 0.1em;
}
h3.main_title span{
    font-size: 1.2vw;
}
*/


/*////////////////////////////////////////////////*/

#container-info{
    margin-top: 0px;
    padding-top: 50px;
    padding-bottom: 50px;
    width: 100%;
    background-color: #fff;
}
.info-contents{width: 60%; margin: 0 auto;}
.info-contents img{width: 100%;}

.info-contents a{display: block;}
.info-contents a:hover{opacity: 0.5; text-decoration: none; transition: 0.8s ;}

/*////////////////////////////////////////////////*/

#container-topics{
    margin-top: 0px;
    padding-top: 100px;
    padding-bottom: 100px;
    background:url(../images/topics_bk.jpg);
    width: 100%;
}

.topics-wrap{
    width: 80%;
    margin: 50px auto 0px auto;
    display: flex;
    justify-content: space-between;
}
.topics-contents{width: 48%;}
.topics-contents-image{width: 90%; margin: 30px auto; }
.topics-contents-image img{width: 100%; border: solid 15px #000; }
.topics-contents-comment{width: 90%; margin: 30px auto 60px auto; color: #000; line-height: 180%;}
.topics-contents-comment h2{
    text-align: center;
    font-size: 24px;
    line-height: 220%;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: 0.1em;
    margin-bottom: 20px;
}

.topics-contents-comment p{
    color: #000;
    font-size: 18px;
    line-height: 220%;
    letter-spacing: 0.1em;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
}

.topics-contents-comment a{display: block; color: #000;}
.topics-contents-comment a:hover{opacity: 0.6; text-decoration: none; transition: 0.8s ;}

.topics-contents-image a{
    display: inline-block;
    line-height: 0;
    position: relative;
}
.topics-contents-image a:before{
    content: "";
    display: block;
    background-color: rgba(0,0,0,0.5);
    opacity: 0.0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    transition-duration: 0.8s;
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    -ms-transition-duration: 0.8s;
}
.topics-contents-image a:hover:before{
    opacity: 1.0;
}

/*////////////////////////////////////////////////*/

#container-movie{
    margin-top: 0px;
    padding-top: 100px;
    padding-bottom: 100px;
    background:url(../images/movie_bk.jpg);
    width: 100%;
}

#container-movie h2{
    text-align: center;
    font-size: 22px;
    line-height: 220%;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: 0.1em;
    margin-bottom: 20px;
    color: #fff;
}
.youtube-960{width: 960px; margin: 0px auto;}

.youtube {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
}
.youtube iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
}


/*////////////////////////////////////////////////*/

#container-tourisum{
    margin-top: 0px;
    padding-top: 100px;
    padding-bottom: 100px;
    background:url(../images/tourisum_bk.jpg);
    width: 100%;
}

.tourisum-wrap{
    width: 80%;
    margin: 0px auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; /* 折返し指定 */
}
.tourisum-contents-1{width: 31.3333%; background-color: #000; margin-top:0px;}
.tourisum-contents-2{width: 31.3333%; background-color: #000; margin-top: 50px;}
.tourisum-contents-image{width: 95%; margin: 15px auto;}
.tourisum-contents-image img{width: 100%;}
.tourisum-contents-comment{width: 90%; margin: 15px auto 15px auto; }

.tourisum-contents-comment p{
    color: #fff;
    font-size: 18px;
    line-height: 220%;
    letter-spacing: 0.1em;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
}

.tourisum-contents-comment h2{
    text-align: center;
    font-size: 22px;
    line-height: 220%;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: 0.1em;
    color: #fff;
}

.kankou-map{ width: 80%; margin: 50px auto;}
.kankou-map img{ max-width: 100%; margin: 0px auto;}


.tourisum-wrap a{display: block;}
.tourisum-wrap a:hover{opacity: 0.5; text-decoration: none; transition: 0.8s ;}

/*////////////////////////////////////////////////*/

#container-access{
    margin-top: 0px;
    padding-top: 100px;
    padding-bottom: 100px;
    background-color: #dcdcdd;
    width: 100%;
}

.accsess-contents{
    width: 80%;
    margin: 50px auto 0px auto;
}

.accsess-contents .blk-map{
    width: 100%;
    height: 0;
    overflow: hidden;
    padding-bottom: 42.1875%;
    position: relative;
    margin-bottom: 100px;
}
.blk-map iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.accsess-contents .access-map {
    width: 100%;
    border: solid 5px #ccc;
}

.accsess-contents-title{
    width: 100%;
    background-color: #004017;
    text-align: center;
}

.accsess-contents p{
    margin: 80px auto;
    text-align: center;
    font-size: 18px;
    line-height: 220%;
    letter-spacing: 0.1em;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
    }

.accsess-contents-title img{margin: 15px auto;}


.accsess-train-wrap{
    width: 100%;
    margin: 50px auto 100px auto;
    display: flex;
    justify-content: space-between;
}

.accsess-train-wrap h3{ color: #3e3a39; font-size: 28px; text-align: center; padding-bottom: 30px; border-bottom: solid 5px #000; width: 100%; margin-bottom: 50px;}
.accsess-toubu-line{width: 48%; padding: 50px; background:url(../images/toubu-line_bk.jpg);}
.accsess-jr-line{width: 48%; padding: 50px; background:url(../images/jr-linebk.jpg);}

/*////////////////////////////////////////////////*/


#container-shisei{
    margin-top: 0px;
    padding-bottom: 100px;
    width: 100%;
    background:url(../images/shisei_bk.jpg);
    background-repeat:no-repeat;
    background-color: #6f4f27;
    height: 800px;
}

.shisei-contents{
    width: 80%;
    margin: 0px auto;
    display: flex;
}

.shisei-contents-image{width: 60%; }
.shisei-contents-info{width: 40%; 
    background-color: #6f4f27;
    padding: 50px;
    height: 800px;
    display: flex;
    flex-direction: row-reverse;
}
.shisei-contents-info p{
font-size: 22px;
line-height: 220%;
font-family: 'Noto Serif JP', serif;
letter-spacing: 0.1em;
    color: #fff;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
}

/*////////////////////////////////////////////////*/
#ashikagatakauji{background-color: #0a0c10; }
#container-ashikagatakauji{width: 100%; background-color: #0a0c10; display: block;}
.ashikagatakauji-contents-image { width: 100%; text-align: center; margin: 0 auto;}
.ashikagatakauji-contents-image img { width: auto; max-width: 100%;}
#container-ashikagatakauji {transition: 0.8s ;}
#container-ashikagatakauji:hover{opacity: 0.6;transition: 0.8s ;}
/*////////////////////////////////////////////////*/

.btn-box{
    width: 80%;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.special-site-btn-r{margin-right: 50px !important;}
.special-site-btn-l{margin-left: 50px !important;}

.special-site-btn{
    width:25%;
    margin:30px auto 0 auto;
}
.special-site-btn a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width:100%;
    height: 70px;
    border: 1px solid #630a0b;
    /*border-radius: 40px;*/
    background-color: #630a0b;
    color: #fff;
    font-size: 24px;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: 0.1em;
    text-decoration: none;
}

.special-site-btn a:hover {
    background-color: #a62b2c;
    border: 1px solid #a62b2c;
    color: #fff;
    text-decoration: none;
    transition: 0.8s ;
}

/*////////////////////////////////////////////////*/

footer{font-size: 16px;}
footer a{color: #333;}

.cls-1{fill:#231815;}.cls-2{fill:#fff;}

.footer-container{width: 100%; margin: 100px auto; }
.footer-contents{width: 80%; margin: 0px auto; text-align: center;}


.footer-info{width: 100%; margin-top: 30px;}
.footer-info p{
font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
}
.footer-copyright{
    font-size: 14px;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
}
.footer-sns{display: flex; justify-content: center; margin: 20px auto;}
footer .footer-sns a:hover {opacity: 0.5; transition: 0.8s ;}
ul.footer-sns li{margin-right: 10px;}


.sp_lp {display: none;}
.fas{margin-right: 10px;}
/*////////////////////////////////////////////////*/


@media screen and (min-width:1024px) and ( max-width:1366px) {
    .slider-item {
        height:50%;
    }
}


@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {

    /*
    .slider-item {
        height:40vh;
    }
    */
    .wrapper{width: 100%; padding-top: 240px;}
    .wrapper img{max-width: 100%;}
    
    


    .header_contents{
        background:url(../images/head_bk.jpg);
        width: 100%;
        height: 150px;
        background-size: contain;
    }


    .header_logo{
        width: 120px;
        margin: 0px auto;
        padding-top: 0px;
    }
    
    /*
    .header_logo{
        width: 50%;
        margin: 0px auto;
        padding-top: 17px;
    }
    */

    .header_logo img {max-width: 100%;}
    
    div.main_title{
        max-width: 35%;
        margin: 0vh auto 4vh auto;
        text-align: center;
    }
    div.main_title img{
        max-width: 100%;
        margin: 0px auto;
    }


    
    .info-contents{width: 80%; margin: 0 auto;}
    
    #container-topics{
        margin-top: 0px;
        padding-top: 4vh;
        padding-bottom: 4vh;
    }

    .topics-wrap{
        width: 95%;
        margin: 30px auto 0px auto;
        display: flex;
        justify-content: space-between;
    }
    .topics-contents{width: 49%;}
    .topics-contents-image img{width: 100%; border: solid 10px #000;}
    .topics-contents-comment{width: 90%; margin: 30px auto; color: #000; line-height: 180%;}
    .topics-contents-comment h2{
        font-size: 2.5vw;
        line-height: 160%;
        margin-bottom: 5px;
    }

    .topics-contents-comment p{
        font-size: 2vw;
        line-height: 160%;
    }
    

    #container-tourisum{
        margin-top: 0px;
        padding-top: 4vh;
        padding-bottom: 4vh;
    }

    .tourisum-wrap{
        width: 95%;
        margin: 30px auto 0px auto;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap; /* 折返し指定 */
    }
    .tourisum-contents-1{width: 32.3333%; background-color: #000; margin-top: 0px;}
    .tourisum-contents-2{width: 32.3333%; background-color: #000; margin-top: 10px;}
    .tourisum-contents-image{width: 95%; margin: 10px auto;}
    .tourisum-contents-image img{width: 100%;}
    .tourisum-contents-comment{width: 90%; margin: 15px auto 15px auto; }

    .tourisum-contents-comment p{
        color: #fff;
        font-size: 2vw;
        line-height: 160%;
    }

    .tourisum-contents-comment h2{
        font-size: 2.5vw;
        line-height: 160%;
        margin-bottom: 5px;
        color: #fff;
    }

    .kankou-map{ width: 95%; margin: 3vh auto;}

    

    #container-access{
        margin-top: 0px;
        padding-top: 4vh;
        padding-bottom: 4vh;
    }

    .accsess-contents{
        width: 95%;
        margin: 50px auto 0px auto;
    }

    .accsess-contents .blk-map{
        padding-bottom: 84.375%;
        margin-bottom: 30px;
    }
    .accsess-contents-title img{
        max-width: 35%;
    }

    .accsess-contents p{
        width: 80%;
        margin: 40px auto;
        font-size: 2vw;
        line-height: 160%;
        text-align: left;
    }

    .accsess-contents-title img{margin: 15px auto;}


    .accsess-train-wrap{
        width: 95%;
        margin: 3vh auto;
        display: flex;
        flex-direction:column;
    }

    .accsess-train-wrap h3{ color: #3e3a39; font-size: 3vh; text-align: center; padding-bottom: 2vh; border-bottom: solid 3px #000; width: 100%; margin-bottom: 3vh;}
    .accsess-toubu-line{width: 100%; padding: 30px; background:url(../images/toubu-line_bk.jpg);}
    .accsess-toubu-line img {max-width: 100%;}

    .accsess-jr-line{width: 100%; padding: 30px; background:url(../images/jr-linebk.jpg); margin-top: 3vh;}
    .accsess-jr-line img {max-width: 100%;}


    #container-shisei{
        background:url(../images/shisei_bk.jpg);
        background-position: left 50% top 0%;
        background-repeat:no-repeat;
        background-size: cover;
    }

    .shisei-contents{
        width: 100%;
        margin: 0px auto;
        display: flex;
    }

    .shisei-contents-image{width: 50%; }
    .shisei-contents-info{width: 50%; 
        background-color: #6f4f27;
        padding: 50px 30px;
        height: 800px;
        display: flex;
        flex-direction: row-reverse;
    }
    .shisei-contents-info p{
        font-size: 22px;
        line-height: 220%;
        font-family: 'Noto Serif JP', serif;
        letter-spacing: 0.1em;
        color: #fff;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
    }


    .btn-box{
        width: 90%;
    }
    
    .special-site-btn{
        width:40%;
        margin:30px auto 0 auto;
    }
    
    .pc_lp {
        display: none;
    }
    .sp_lp {
        display: block;
    }
}


@media only screen and (max-width: 760px) {

    /*///////////////////*/

    

    div.main_title{
        max-width: 50%;
        margin: 0vh auto 3vh auto;
        text-align: center;
    }
    div.main_title img{
        max-width: 100%;
        margin: 0px auto;
    }

    /*///////////////////*/
    
    .wrapper{width: 100%; padding-top: 150px;}
    .wrapper img{max-width: 100%;}

    
    /*///////////////////*/

    .header_contents{
        background:url(../images/head_bk_sp.jpg);
        width: 100%;
        height: 100px;
        background-size: cover;
    }


    .header_logo{
        width: 80px;
        margin: 0px auto;
        padding-top: 0px;
    }
    /*
    .header_logo{
        width: 70%;
        margin: 0px auto;
        padding-top: 17px;
    }
    */

    .header_logo img {max-width: 100%;}

    
    /*////////////////////////////////////////////////*/

    #container-info{
        margin-top: 0px;
        padding-top: 10px;
        padding-bottom: 10px;
        width: 100%;
        background-color: #fff;
        margin-bottom: 3vh;
    }
    .info-contents{width: 90%; margin: 0 auto;}
    .info-contents img{width: 100%;}

    /*////////////////////////////////////////////////*/

    #container-topics{
        margin-top: 0px;
        padding-top: 7vh;
        padding-bottom: 7vh;
        width: 100%;
        background:url(../images/topics_bk_sp.jpg);
        background-size: cover;
    }

    .topics-wrap{
        width: 95%;
        margin: 10px auto 0px auto;
        display: flex;
        justify-content: space-between;
    }
    .topics-contents{width: 49%;}
    .topics-contents-image{width: 95%; margin: 5px auto;}
    .topics-contents-image img{width: 100%; border: solid 5px #000;}
    .topics-contents-comment{width: 90%; margin: 10px auto; color: #000; line-height: 180%;}
    .topics-contents-comment h2{
        font-size: 4vw;
        line-height: 180%;
        margin-bottom: 5px;
    }
    
    .topics-contents-comment p{
        font-size: 3vw;
        line-height: 180%;
    }


    /*////////////////////////////////////////////////*/

    #container-movie{
        margin-top: 0px;
        padding-top: 7vh;
        padding-bottom: 7vh;
        width: 100%;
        background:url(../images/movie_bk.jpg);
        width: 100%;
        background-size: contain;
    }

    #container-movie h2{
        font-size: 4vw;
        line-height: 180%;
        margin-bottom: 3vh;
    }

    .youtube {
        position: relative;
        width: 100%;
        padding-top: 56.25%;
    }
    .youtube iframe {
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
    }

    /*////////////////////////////////////////////////*/

    #container-tourisum{
        margin-top: 0px;
        padding-top: 7vh;
        padding-bottom: 7vh;
        width: 100%;
        background:url(../images/tourisum_bk_sp.jpg);
        background-size: cover;
    }

    .tourisum-wrap{
        width: 95%;
        margin: 10px auto 0px auto;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap; /* 折返し指定 */
    }
    .tourisum-contents-1{width: 49%; background-color: #000; margin-top: 10px;}
    .tourisum-contents-2{width: 49%; background-color: #000; margin-top: 10px;}
    .tourisum-contents-image{width: 95%; margin: 5px auto;}
    .tourisum-contents-image img{width: 100%;}
    .tourisum-contents-comment{width: 90%; margin: 15px auto 15px auto; }

    .tourisum-contents-comment p{
        color: #fff;
        font-size: 3vw;
        line-height: 180%;
    }

    .tourisum-contents-comment h2{
        font-size: 4vw;
        line-height: 180%;
        margin-bottom: 5px;
        color: #fff;
    }
    
    .kankou-map{ width: 95%; margin: 3vh auto;}

    /*////////////////////////////////////////////////*/

    #container-access{
        margin-top: 0px;
        padding-top: 7vh;
        padding-bottom: 7vh;
        background-color: #dcdcdd;
        width: 100%;
    }

    .accsess-contents{
        width: 95%;
        margin: 50px auto 0px auto;
    }

    .accsess-contents .blk-map{
        padding-bottom: 84.375%;
        margin-bottom: 30px;
    }
    .accsess-contents-title img{
        max-width: 60%;
    }

    .accsess-contents p{
        width: 90%;
        margin: 30px auto;
        font-size: 3vw;
        line-height: 180%;
        text-align: left;
    }

    .accsess-contents-title img{margin: 15px auto;}


    .accsess-train-wrap{
        width: 95%;
        margin: 3vh auto;
        display: flex;
        flex-direction:column;
    }

    .accsess-train-wrap h3{ color: #3e3a39; font-size: 3vh; text-align: center; padding-bottom: 2vh; border-bottom: solid 3px #000; width: 100%; margin-bottom: 3vh;}
    .accsess-toubu-line{width: 100%; padding: 30px; background:url(../images/toubu-line_bk.jpg);}
    .accsess-toubu-line img {max-width: 100%;}
    
    .accsess-jr-line{width: 100%; padding: 30px; background:url(../images/jr-linebk.jpg); margin-top: 3vh;}
    .accsess-jr-line img {max-width: 100%;}

    /*////////////////////////////////////////////////*/


    #container-shisei{
        margin-top: 0px;
        background:url(../images/shisei_bk.jpg);
        background-position: left 20% top 0%;
        background-repeat:no-repeat;
        background-color: #6f4f27;
        height: 370px;
        background-size: cover;
    }

    .shisei-contents{
        width: 100%;
        margin: 0px auto;
        display: flex;
    }

    .shisei-contents-image{width: 0%; }
    .shisei-contents-info{width: 100%; 
        background:rgba(111,79,39,0.5);
        padding: 50px;
        height: 370px;
        display: flex;
        flex-direction: row-reverse;
    }
    .shisei-contents-info img{max-height: 280px;}
    .shisei-contents-info p{
        font-size: 3.5vw;
        line-height: 180%;
        font-family: 'Noto Serif JP', serif;
        letter-spacing: 0.1em;
        color: #fff;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
    }

    /*////////////////////////////////////////////////*/

    .btn-box{
        width: 100%;
        margin: auto;
        display: flex;
        flex-flow: column;
        align-items: center;
        justify-content: center;
    }

    .special-site-btn-r{margin-right: auto !important;}
    .special-site-btn-l{margin-left: auto !important;}
    
    .special-site-btn{
        width:80%;
        margin:30px auto 0 auto;
    }
    .special-site-btn a {
        width:100%;
        height: 40px;
        /*border-radius: 30px;*/
        font-size: 5vw;
    }



    /*///////////////////*/

    .footer-contents{width: 80%; margin: 0px auto; text-align: center;}
    

    footer{font-size: 3vw;}
    footer a{color: #333;}


    .footer-container{flex-direction: column; width: 90%;margin: 7vh auto; }
    .footer-logo{width: 80%; margin: 0 auto;}
    .footer-logo img{width: 100%;}

    .footer-logo a:hover {opacity: 0.5;transition: 0.8s ;}

    .footer-contents{flex-direction: column; width: 100%;}

    .footer-nav{width: 100%; margin-top: 30px;}
    .footer-nav ul{display: block;}
    .footer-nav ul li{margin-bottom: 10px;}

    .footer-nav ul li a {
        position: relative;
        display: inline-block;
        text-decoration: none;
    }
    .footer-nav ul li a::after {
        position: absolute;
        bottom: -4px;
        left: 0;
        content: '';
        width: 100%;
        height: 2px;
        background: #333;
        transform: scale(0, 1);
        transform-origin: center top;
        transition: transform .3s;
    }
    .footer-nav ul li a:hover::after {
        transform: scale(1, 1);
    }



    .footer-info{width: 100%; margin-top: 30px; text-align: center;}

    .footer-copyright{
        font-size: 10px;
        text-align: center;
    }
    .footer-sns{width: 20%; display: flex; margin: 10px auto;}
    ul.footer-sns li{margin-right: 10px;}



    /*///////////////////*/



    /*　ハンバーガーボタン　*/
/*
    .hamburger {
        display : block;
        position: fixed;
        z-index : 3;
        right : 13px;
        top   : 12px;
        width : 42px;
        height: 42px;
        cursor: pointer;
        text-align: center;
    }
    .hamburger span {
        display : block;
        position: absolute;
        width   : 30px;
        height  : 2px ;
        left    : 6px;
        background : #555;
        -webkit-transition: 0.5s ease-in-out;
        -moz-transition   : 0.5s ease-in-out;
        transition        : 0.5s ease-in-out;
    }
    .hamburger span:nth-child(1) {
        top: 10px;
    }
    .hamburger span:nth-child(2) {
        top: 20px;
    }
    .hamburger span:nth-child(3) {
        top: 30px;
    }

    // ナビ開いてる時のボタン //
    .hamburger.active span:nth-child(1) {
        top : 16px;
        left: 6px;
        background : #fff;
        -webkit-transform: rotate(315deg);
        -moz-transform   : rotate(315deg);
        transform        : rotate(315deg);
    }

    .hamburger.active span:nth-child(2),
    .hamburger.active span:nth-child(3) {
        top: 16px;
        background : #fff;
        -webkit-transform: rotate(-315deg);
        -moz-transform   : rotate(-315deg);
        transform        : rotate(-315deg);
    }

    nav.globalMenuSp {
        display: none;
        position: fixed;
        z-index : 2;
        top  : 0;
        left : 0;
        color: #fff;
        background: rgba(0,0,0,0.7);
        text-align: center;
        width: 100%;
        opacity: 0;
        transition: opacity .6s ease, visibility .6s ease;
        width: 100%;
        height: 100%;
    }

    nav.globalMenuSp ul {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100%;
    }

    nav.globalMenuSp ul li {
        display: block;
        padding : 20px 30px;
        width: 100%;
        transition: .4s all;
        padding: 1em 0;
        font-size: 6vw;
    }
    nav.globalMenuSp ul li:last-child {
        padding-bottom: 0;
    }

    // このクラスを、jQueryで付与・削除する //
    nav.globalMenuSp.active {
        opacity: 100;
        display: block;
    }
*/

    nav{width: 100%;
        background-color: #fff;}

    nav ul li.btn{    
        padding:10px 5px 5px 5px;
        margin:2.5px;
        border-radius: 5px;

        text-align: center;
        color: #000;
    }

    nav ul{
        list-style: none;
        display:flex;
        width: 100%; margin: 0 auto;
        justify-content:space-between;
    }
    nav ul li {font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;}

    nav ul li img {width: 100%;} 

    nav ul li a {
        position: relative;
        display: inline-block;
        text-decoration: none;
        color: #000;
    }
    nav ul li a::after {
        position: absolute;
        bottom: -4px;
        left: 0;
        content: '';
        width: 100%;
        height: 2px;
        background: #ae3232;
        transform: scale(0, 1);
        transform-origin: center top;
        transition: transform .3s;
    }
    nav ul li a:hover::after {
        transform: scale(1, 1);
    }

}

@media only screen and (max-width: 760px) {
    .pc_lp {
        display: none;
    }
    .sp_lp {
        display: block;
    }
}