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

	.sp-bl{
		display: block;
	}

	.sp-nn{
		display: none!important;
	}

	.h-t div{
		width: 100%;
	}

	.center{
		width: 100%;
	}

	.sp-img{
		width: 100%
	}

    .sp-imgdata{
        width: 5%
    }

    .sp-img20{
        width: 20%
    }

    .sp-img30{
        width: 30%
    }

    .sp-img40{
        width: 40%
    }

    .sp-img50{
        width: 50%
    }

    .sp-img60{
        width: 60%
    }

    .sp-img70{
        width: 70%
    }

	.sp-img80{
		width: 80%
	}

	.sp-mt0{
		margin-top: 0;
	}

	.sp-mt10{
		margin-top: 10%;
	}

    .sp-mt5{
        margin-top: 5%;
    }

    .sp-mt20{
        margin-top: 20%!important;
    }

	.sp-mb5{
		margin-bottom: 5%;
	}

    .sp-mb10{
        margin-bottom: 10%;
    }

    .sp-pt10{
        padding-top: 10%;
    }

    .sp-pb20{
        padding-bottom: 20%;
    }

    .sp-pb10{
        padding-bottom: 10%;
    }

    .ta-c{
        text-align: center;
    }

	.f_n{
		float: none!important;
	}

    .mt_100{
        margin-top: 10%;
    }

    .mt_5{
        margin-top: 5%;
    }

    .mt_15{
        margin-top: 15%;
    }

	.subtit-re{
		background-color: rgba(0,0,0,0);
		padding: 0;
	}

	.sp-box1{
		width: 80%;
		margin: auto;
	}

    .sp-box2{
        width: 100%;
        margin: auto;
    }

    .sp-box3{
        width: 90%;
        margin: auto;
    }

	.sp-m-a{
		margin: auto;
	}

	.sp-logo{
		width: 70%;
	}

	.logo{
		margin: 0
	}

	footer{
		margin-top: 5em;
	}

	footer ul{
		font-size: 90%;
	}

	footer ul .tel{
		width: 100%;
	}

	footer ul li p{
		float: none;
	}

	footer div{
		background-image: url('../images/sp/sp-ftgb.png');	
    	background-size: contain;
    	background-repeat: no-repeat;
    	height: 100%;
	}

	footer div address{
		font-size: 80%;
		padding-top: 10%;
		padding-bottom: 5%;
		
	}



    


	/*menu animation*/

	#header,
    .inner {
        width: 100%;
        padding: 0;
    }

    .inner{
    	padding-bottom: 5%;
		background-image: url('../images/sp/sp-mnbtm.png');
        background-size: contain;
		background-repeat: no-repeat;
		background-position: bottom;
    }
    #header {
        top: 0;
        position: fixed;
        margin-top: 0;
        
    }
    /* Fixed reset */
    #header.fixed {
        padding-top: 0;
        background: transparent;
    }
    #mobile-head {
        background: #fff;
        width: 100%;
        height: 75px;
        z-index: 999;
        position: relative;
        padding-bottom: 13%;
    }
    #header.fixed .logo,
    #header .logo {
        position: absolute;
        left: 13px;
        top: 20%;
        color: #333;
    }
    #global-nav {
        position: absolute;
        /* 開いてないときは画面外に配置 */
        top: -500px;
        width: 100%;
        text-align: center;
        padding: 10px 0;
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
    }
    #global-nav ul {
        list-style: none;
        position: static;
        right: 0;
        bottom: 0;
        font-size: 14px;
        padding-bottom: 3%;
        background-image: url('../images/sp/sp-mnbtm2.png');
        background-size: contain;
		background-repeat: no-repeat;
		background-position: bottom;
    }
    #global-nav ul li {
        float: none;
        position: static;
        border-bottom: 1px solid #fff;
        background: #59C2E1;
    }
    #global-nav ul li:nth-last-child(1) {
    	
		border-bottom: none;
		
    }
    #header #global-nav ul li a,
    #header.fixed #global-nav ul li a {
        width: 100%;
        display: block;
        color: #fff;
        padding: 18px 0;
    }
    #nav-toggle {
        display: block;
    }
    .open #nav-toggle span:nth-child(1) {
        top: 11px;
        -webkit-transform: rotate(315deg);
        -moz-transform: rotate(315deg);
        transform: rotate(315deg);
    }
    .open #nav-toggle span:nth-child(2) {
        width: 0;
        left: 50%;
    }
    .open #nav-toggle span:nth-child(3) {
        top: 11px;
        -webkit-transform: rotate(-315deg);
        -moz-transform: rotate(-315deg);
        transform: rotate(-315deg);
    }
    .open #global-nav {
        /* #global-nav top + #mobile-head height */
        -moz-transform: translateY(556px);
        -webkit-transform: translateY(556px);
        transform: translateY(556px);
    }



.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}



/*index-main*/

#t-main{
	background-image: none;
	background-size: cover;
	margin-top: 25%;
	margin-bottom: 15%;
	height: 100%;
}

#t-main > img{
	display: none;
}

.main-bn a{
	display: block;
	margin-bottom: 5%;
}

.news{
    width: 100%;
    margin-bottom: 50px;
}

.sp-news{
	overflow: auto;
	height: 13rem;
	scrollbar-face-color: #59C2E1;
    font-size: 80%;
}

.sp-news dd{
	border-bottom: 1px dashed #aaa;
	margin-bottom: 2%;
	padding-bottom: 2%;
}

.mt5{
	margin-top: 5em;
}

/*timetable*/

#tt-1{
    padding-top: 30%;
}

#tt-1 .tt1-ad th,#tt-1 .tt1-ad td{
    font-size: 80%;
}

#tt-2{
    margin-top: 10%;
    padding: 10% 0;
}

#tt-2 p{
    font-size: 80%;
}

/*discount*/

#dc-1{
    padding-top: 30%;
}

/*assistance*/

#at-1{
    padding-top: 30%;
}

.at1-ad p{
    margin-top: 5%;
}

.at1-ad .group{
    margin-top: 5%;
}


/*access*/

#ac-1{
    padding-top: 30%;
}

#ac-2 .center2 .ac2-ad{
    font-size: 80%;
}


.ac-tit{
    padding:5px;
    font-weight:bold;
    font-size:14px;
    
    background:#59C2E1;
    cursor: pointer;
}
.ac-cont{
    padding:5%;
    font-family:Arial;
    font-size:13px;
    border:1px solid #59C2E1;
}

#ac-1 .center2 .ac1-ad{
    margin-top: 5%;
}

#ac-1 .center2 .ac1-ad ul{
    padding: 0;
    
}

#ac-1 .center2 .ac1-ad ul li{
    font-size: 60%;
    margin: 0;
}

#ac-2 .center2 .ac2-ad{
    padding: 0
}

#ac-3 .center2 .ac3-ad{
    padding: 0;
    font-size: 80%;
}

#ac-3 .center2 .ac3-ad .ht-main section ul li .rd-1{
    width: 100%;
}

#ac-3 .center2 .ac3-ad .ht-main section{
    margin-bottom: 5%;
}

#ac-3 .center2 .ac3-ad .ht-main{
    width: 100%;
}


#ac-3 .center2 .ac3-ad .ht-main section ul{
    padding-left: 0;
}

#ac-3 .center2 .ac3-ad .ht-main section .sp-rent{
    padding: 0 0 0 1em; 
    margin-bottom: 5%;
}

.imd-sp{
    padding-left: 1em;
}

#ac-3 .center2 .ac3-ad .ht-main section .as-link{
    padding-bottom: 0;
    margin-top: 5%;
}

.at1-ad{
    font-size: 80%;
}

.at-content div{
    margin: 0;
}

.at-content div div{
    margin: 0;
    margin-top: 5%;
}


.at-content dl dd{
    width: 100%;
}

/*news*/

.simply-scroll .simply-scroll-clip{
    height: 80%;
}


.sf,.sf+p{
    width: 100%;
}

.at1-ad .sp-sf{
    padding: 0;
}

.at1-ad .sp-sf li{
    margin-top: 20px;
}

.at1-ad .sp-sf+p{
    padding: 0;
}

/*spcial*/

.spe-main .main-box{
    width: 100%;

}

#at-se{
    padding-top: 15%;
}

.spe-tit{
    padding: 0;
}

.spe-menu li{
    margin: 0 0 10% 0;
}

.se-ch{
    font-size: 80%;
}


.data{
    display: inline-block;
}

.spec1,.spec2{
    display: inline-block;
}

.se-h2{
    color: #727171;
    padding: 0;
    font-weight: bold;
    margin-top: 5%;
}

.recommend{
    margin: auto;
    text-align: center;
    margin-top: 10%;
}

.vol1-link{
    padding-top: 15%;
    margin-top: 10%;
    background-image: url('../special/sp/vol1/child/img/boder.png');
    background-position: top;
    background-repeat: no-repeat;
    background-size: contain;
}


/*spot*/

.sp-spotmenu{
    height: 100%;
    text-align: justify;
    text-justify: distribute-all-lines; 
}

.sp-spotmenu:after {
    content:"";
    display: inline-block;
    width: 100%;
    line-height:0;
    height: 0;
}

.sp-spotmenu li{
    display: inline-block;
    width: 45%;
    padding: 5% 2%;
    vertical-align: bottom;
}

.sp-spotmenu li img{
    width: 100%;
}

.odate>div{
    background-color: #FEF7F6;
    font-size: 80%;
}

.kitaakita>div{
    background-color: #F8FCFD;
    font-size: 80%;
}

.noshiro>div{
    background-color: #FCFAFC;
    font-size: 80%;
}

.kosaka>div{
    background-color: #FDF5F4;
    font-size: 80%;
}

.huzisato>div{
    background-color: #F5FBF9;
    font-size: 80%;
}

.kazuno>div{
    background-color: #FEFAFA;
    font-size: 80%;
}

.mitane>div{
    background-color: #FEFAFA;
    font-size: 80%;
}

.kamikoani>div{
    background-color: #FEF6EF;
    font-size: 80%;
}

.hukaura>div{
    background-color: #F8FBF6;
    font-size: 80%;
}

.happo>div{
    background-color: #FBF9F6;
    font-size: 80%;
}

.gojome>div{
    background-color: #F8F9FC;
    font-size: 80%;
}

.sp-list>div{
    margin-bottom: 5%;
    position: relative;
}

.sp-list>div:after{
    content: "＞";
    color: #E5004F;
    position: absolute;
    top: 40%;
    right: 3%;
    font-weight: bold;
}

.kitaakita>div:after{
    color: #47BCC6;
}

.noshiro>div:after{
    color: #C37BB1;
}

.kosaka>div:after{
    color: #EC6D55;
}

.huzisato>div:after{
    color: #37B48D;
}


.kazuno>div:after{
    color: #EE858C;
}

.mitane>div:after{
    color: #86519D;
}

.kamikoani>div:after{
    color: #F08300;
}

.hukaura>div:after{
    color: #44B034;
}

.happo>div:after{
    color: #B0704A;
}

.gojome>div:after{
    color: #557EBF;
}

.sp-list>div a{
    display: block;
    width: 100%;
}

.sp-list img{
    width: 30%;
    display: inline-block;
}

.sp-list p{
    display: inline-block;
    vertical-align: middle;
}

.sp-cg img{
    width: 15%;
    display: inline-block;
    margin-right: 3%;
}


.ev1,.ev2,.ev3{
    width: 100%;
}

.ul-nm{
    margin: 0;
}

.ind3{
    text-indent: -1em;
    padding-left: 1em;
}

.ind4{
    text-indent: -1em;
    padding-left: 2em;
}


.ind5{
    text-indent: -2.5em;
    padding-left: 2.5em;
}

.at-content .ind4{
    padding-left: 2em;   
}

.at-content .pl1{
    padding-left: 1em;
}



/*news-btn*/
 .n-btn{    
    width: 100%;
}

.n-btn a{
    width: 100%;
}




/*keniki*/


.kt-1>div,.kt-2>div{
    width: 80%;
    padding: 0;
}

.art{
    font-size: 90%;
    text-align: left;
    margin-top: 10%;
}

.kt-item-box{
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center; 
}

.kt-item-box > li{
    width: 100%;
    margin-top: 1em;
}

.box-art{
    width: 100%;
}

.op h5{
    width: 100%;
    text-align: center;
}

.sp-k-comp1,.sp-k-comp2,.sp-k-comp3,.sp-k-comp4,.sp-k-comp5{
    position: absolute;

}

.sp-k-comp1{
    bottom: -5%;
}

.sp-k-comp2{
    top: 40%;
    left: 20%;
}

.sp-k-comp3{
    bottom: -5%;
}

.sp-k-comp4{
    bottom: -5%;
}

.sp-k-comp5{
    bottom: -5%;
}

.sp-item-tit{
    width: 100%;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    font-size: 1em;
}

.link h1{
    font-size: 140%;
}

.link section:nth-of-type(3) img{
    width: 100%
}

.sp-fc1{
    display:-webkit-box;
    display:-ms-flexbox;
    display: -webkit-flex;
    display:flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.sub-tit h2 img{
    display: none;
}

.fc-btn{
    width: 100%;
}

.fc-btn img{
    width: 100%;
}

.list-box1,.list-box2,.list-box3,.list-box4{
    width: 100%;
}

.gift1-list{
    width: 100%;
}

.gift1-list dt{
    width: 100%;
    padding: 0 0 10px 0;
    margin: 20px 0 10px 0;
    text-align: center;
    border-right: none;
    border-bottom: 1px solid #0086d7;
}

.gift1-list dd{
    text-align: center;
}

.gift1-list dd{
    padding: 0;
}

.gift1-list dt:nth-of-type(1), .gift1-list dd:nth-of-type(1),.gift1-list dt:nth-of-type(4), .gift1-list dd:nth-of-type(4){
    padding: 0 0 10px 0;
}

.sp-gift-box>div{
    width: 20%;
}

.sp-gift-box>div img{
    width: 100%;
}

#con-area2{
    width: 90%;
}

.fc-list{
    width: 100%;
}

.swiper-button-prev,
  .swiper-button-next {
    display: none;
  }

.sp-movie{
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
     margin-top: 10%;
}

.sp-movie iframe{
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

#sight div.onsen{
    width: 100%;
    margin-top: 0
}

.onsen-btn{
    width: 90%;
    margin: 0 auto;
}

.onsen-btn img{
    width: 100%;
}

#sight div .onsen-list{
    width: 100%;
    padding: 5%;
    background: transparent;
}

#sight div .onsen-list table{
    background: #fff;
}

}

@media screen and (max-width:550px){
    .sp-cg img{
        width: 20%;
    }

    .dc1-shop li{
        width: 100%;
        display: block;
    }
}



@media screen and (max-width:450px){
    footer div address{
        font-size: 70%;
        /*padding-top: 10%;
        padding-bottom: 5%; */
    }
    #at-se{
        padding-top: 18%;
    }

    .sp-cg img{
        width: 20%;
    }

    .n-btn a{
        font-size: 1.2em;
    }

    .fc-btn a{
        padding: 20px 0
    }

    .sp-gift-box>div{
        width: 100%;
    }

    .sp-gift-box>div img{
        width: 20%;
    }

    .sp-gift-box>div:nth-of-type(2),.sp-gift-box>div:nth-of-type(3){
        margin-top: 10%;
    }

}


@media screen and (max-width:380px){
    footer div address{
        font-size: 50%;
        /*padding-top: 10%;
        padding-bottom: 5%; */

    }
    #at-se{
        padding-top: 20%;
    }

    .sp-list>div:after{
        top: 30%;
    }
    .sp-cg img{
        width: 30%;
    }
    #t-main{
    margin-top: 33%;
}
}


@media screen and (max-width:340px){
    #at-se{
        padding-top: 24%;
    }
}