@charset "utf-8";
/* CSS Document */
@media only screen and (max-width: 768px){

.w1000{
width: 100%;
margin: 0 auto;
}
/*--------------------pankuzu */
#pankuzu{
display: none;
}
/*--------------------main */
#main_top{
display: none;
}
#main_top_sp{
display: block;
width: 100%;
margin: 0 auto;
}
.sp_cover{
width: 100%;
height: 480px;
position: relative;
background: url("../img/spot_glover.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center
}
.sp_cover img{
display: block;
position: absolute;
width: 450px;
margin: 0 auto;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
/*
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
*/
}
/*--------------------navi */
.navi ul{
flex-wrap: wrap;
}
.navi ul li{
width: calc(100% / 2 - 0.5%);
text-align: center;
border-bottom: 3px solid #fff;
border-right: 1px solid #fff;
}
.navi ul li a{
border-radius: 0;
letter-spacing: 0.05em;
}
#lead{
display: none;
}
#lead_sp{
padding: 30px 0;
display: block;
background: url("../img/bg_notebook.jpg");
background-size: auto;
background-repeat: repeat;
}
#lead_sp p{
width: 95%;
margin: 0 auto;
font-weight: 500;
}
/*--------------------hotel */
#hotel ul{
width: 95%;
margin: 0 auto;
}
#hotel ul li{
width: calc(100% / 2 - 1%);
margin: 0 auto;
}
#hotel dl dt{
font-size: 100%;
}
#hotel dl dd.card{
height: 125px;
}
/*--------------------spot */
#spot ul,#train ul,#tour ul{
display: block;
}
#spot ul li,#train ul li,#tour ul li{
width: 95%;
margin: 0 auto;
padding-bottom: 10px;
}
#spot h6{
width: 95%;
margin: 0 auto 20px;
}
/*--------------------train */
#train p.train_tour{
width: 90%;
margin: 0 auto;
text-indent: -1em;
padding-left: 1em;
}
/*--------------------search */
.webconnect_box{
background: none;
padding: 0;
}
.tabs{
width: 95%;
margin: 0 auto;
}
.tab_item{
font-size: 95%;
}
.tab_item span{
display: block;
}
.tab_jrdp{
line-height: 1.45em;
}
p.htb-copyright{
width: 95%;
margin: 0 auto;
}
/*--------------------official_page */
#official_page{
padding: 30px 0;
}
#official_page ul{
display: block;
}
#official_page ul li{
width: 95%;
margin: 0 auto;
}
#official_page ul li p{
padding-top: 0;
padding-bottom: 15px;
font-size: 98%;
}
}
@media only screen and (max-width: 490px){
.sp_cover{
width: 100%;
height: 480px;
position: relative;
background: url("../img/bg_yoshinogari.jpg"),url("../img/bg_glover.jpg");
background-repeat: no-repeat;
background-size: auto 240px;
background-position: top,bottom;
}
.sp_cover img{
display: block;
position: absolute;
width: 90%;
margin: 0 auto;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
/*
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
*/
}
}