@charset 'utf-8';

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

/*----------------------------------- #globalNav --*/

#contents{
overflow: hidden;
position: relative;
padding-top:48px;
margin-top:20px;
}

#globalNav{
position: absolute;
top: 90px;
width: 100%;#globalNav div.child .byTheme .childBox li a
height: 48px;
background-image: url(../images/top/gnav_bg.jpg);
background-repeat: repeat-x;
background-position: center center;
z-index:10;
}
#globalNav .floatL{float:left;}
#globalNav .floatR{float:right;}

#globalNav nav{
max-width:1000px;
width:100%;
margin:0 auto;
}
#globalNav nav ul.menu{
position: relative;

}
#globalNav nav ul.menu li.level01{
width:50%;
float:left;
text-align:center;
display:block !important;

}
#globalNav nav ul.menu li.level01 span.navTit{
position: relative;
overflow:hidden;
display:block;
font-size:15px;
color:#ffffff;
padding: 10px;
cursor: pointer;
margin: 7px 0 6px;
letter-spacing: 0.03em;
border-right:1px dotted #ffffff;
}
#globalNav nav ul.menu li:first-child span.navTit{
border-left:1px dotted #ffffff;
}
#globalNav nav ul.menu li.level01 span.navTit:after{
content: "";
width: 11px;
height: 6px;
margin-left: 15px;
display: inline-block;
background-image: url(../images/icon/ico_arr_wb.png);
background-repeat: no-repeat;
background-position: 0 0;
background-size: 100% auto;
vertical-align: middle;
}


#globalNav div.child{
display: none;
position: absolute;
left:50px;
top:48px;
margin: 0;
padding: 18px 0 0;
width:100%;
	
}
#globalNav div.child:before{
content:"";
position: absolute;
left:0;
top: 0;
width: 33.33333333%;
height: 20px;
background-image: url(../images/icon/ico_arr_wt.png);
background-repeat: no-repeat;
background-position: center 0;
background-size: 35px auto;
}
#globalNav nav ul.menu li.nav02 div.child:before{
left: 50%;
margin-left: -16.65%;
}
#globalNav nav ul.menu li.nav03 div.child:before{
left: initial;
right: 0;
margin-left: -16.65%;
}
#globalNav div.child .childNav{
overflow:hidden;
position: relative;
width:90%;
margin:0 auto;
background: #ffffff;
}
#globalNav div.child .byArea{
background: #ffffff url(../images/top/nav_map.png) no-repeat center 30px;
}
#globalNav div.child li a{
display: block;
}



#globalNav div.child .childNav .childInn{
clear: both;
overflow: hidden;
padding:25px 40px 40px;
}
#globalNav div.child .byArea .childBox{
width:22.2%;
float:left;
}
#globalNav div.child .byArea .floatL{
width:22.2%;
}
#globalNav div.child .childNav .hokkaido_a{
width:100%;
float:none;
}
#globalNav div.child .childNav .tohoku_a{
width:100%;
float:none;
}
#globalNav div.child .childNav .tokyo_a{
margin-left: 30px;
float:left;
}
#globalNav div.child .childNav .nagoya_a{
float: right;
}
#globalNav div.child .childNav .osaka_a{

}
#globalNav div.child .childNav .sanin_a{
margin-left: 30px;
}
#globalNav div.child .childNav .shikoku_a{
margin-left: 30px;
}
#globalNav div.child .childNav .kyushu_a{
margin-left: 30px;
}



#globalNav div.child .byArea .childBox h2{
font-size: 18px;
font-weight: bold;
text-align: left;
line-height: 100%;
padding: 10px 0;
margin-bottom:12px;
}
#globalNav div.child .childNav .hokkaido_a h2{
color:#ec9418;
border-bottom:1px solid #ec9418;
}
#globalNav div.child .childNav .tohoku_a h2{
color:#e0ac00;
border-bottom:1px solid #e0ac00;
}
#globalNav div.child .childNav .tokyo_a h2{
color:#298bc3;
border-bottom:1px solid #298bc3;
}
#globalNav div.child .childNav .nagoya_a h2{
color:#33b688;
border-bottom:1px solid #33b688;
}
#globalNav div.child .childNav .osaka_a h2{
color:#52a247;
border-bottom:1px solid #52a247;
}
#globalNav div.child .childNav .sanin_a h2{
color:#87b500;
border-bottom:1px solid #87b500;
}
#globalNav div.child .childNav .shikoku_a h2{
color:#af73bc;
border-bottom:1px solid #af73bc;
}
#globalNav div.child .childNav .kyushu_a h2{
color:#f491cd;
border-bottom:1px solid #f491cd;
}



#globalNav div.child .byArea .childBox li a{
font-size:14px;
font-weight:bold;
color:#000000;
text-align: left;
line-height: 100%;
padding: 8px 0 5px 8px;
text-decoration: none;

background-repeat: no-repeat;
background-position: 0 center;
background-size: 5px auto;
}
#globalNav div.child .childNav .hokkaido_a li a{
background-image: url(../images/icon/ico_arr_r01.png);
}
#globalNav div.child .childNav .tohoku_a li a{
background-image: url(../images/icon/ico_arr_r02.png);
}
#globalNav div.child .childNav .tokyo_a li a{
background-image: url(../images/icon/ico_arr_r03.png);
}
#globalNav div.child .childNav .nagoya_a li a{
background-image: url(../images/icon/ico_arr_r04.png);
}
#globalNav div.child .childNav .osaka_a li a{
background-image: url(../images/icon/ico_arr_r05.png);
}
#globalNav div.child .childNav .sanin_a li a{
background-image: url(../images/icon/ico_arr_r06.png);
}
#globalNav div.child .childNav .shikoku_a li a{
background-image: url(../images/icon/ico_arr_r07.png);
}
#globalNav div.child .childNav .kyushu_a li a{
background-image: url(../images/icon/ico_arr_r08.png);
}



#globalNav div.child .byArea .childBox li a:hover{
text-decoration: none;
}
#globalNav div.child .childNav .hokkaido_a  li a:hover{
color:#ec9418;
}
#globalNav div.child .childNav .tohoku_a  li a:hover{
color:#e0ac00;
}
#globalNav div.child .childNav .tokyo_a  li a:hover{
color:#298bc3;
}
#globalNav div.child .childNav .nagoya_a  li a:hover{
color:#33b688;
}
#globalNav div.child .childNav .osaka_a  li a:hover{
color:#52a247;
}
#globalNav div.child .childNav .sanin_a  li a:hover{
color:#87b500;
}
#globalNav div.child .childNav .shikoku_a  li a:hover{
color:#af73bc;
}
#globalNav div.child .childNav .kyushu_a  li a:hover{
color:#f491cd;
}

#globalNav div.child .childNav .childBox h2{
text-align:left;
}



/*------ Serch by Theme -----*/
#globalNav div.child .byTheme .childInn{
padding-top:35px;
padding-bottom: 35px;
}
#globalNav div.child .byTheme .childBox h2{
text-align:left;
font-size:18px;
font-weight:bold;
color:#9d0031;
margin-bottom: 15px;
}
#globalNav div.child .byTheme .childInn .floatL{
width:50%;
}
#globalNav div.child .byTheme .childInn .floatR{
width:50%;
}
#globalNav div.child .byTheme .childInn .floatL .childBox{
margin-right: 15px;
}
#globalNav div.child .byTheme .childInn .floatR .childBox{
margin-left: 15px;
}
#globalNav div.child .byTheme .childInn .childBox ul{
overflow: hidden;
margin-left:-5px;
margin-right:-5px;
}
#globalNav div.child .byTheme .childBox li a{
font-size:14px;
font-weight:bold;
color:#000000;
padding:18px 5px 18px;
margin:10px 5px;
text-align:center;
letter-spacing: -0.03em;
background:#dedede;
text-decoration: none;
}
#globalNav div.child .byTheme .childBox li a:hover{
color:#ffffff;
background:#9d0031;
text-decoration: none;
}



/*------ Whats a Ryokan -----*/
#globalNav div.child .whats_ryokan .childInn{
padding:35px 40px;
display: table;
table-layout: fixed;
width: 100%;
}
#globalNav div.child .whats_ryokan .childInn .floatL{
width: 40%;
display: table-cell;
vertical-align: middle;
float: none;
}
#globalNav div.child .whats_ryokan .childInn .floatR{
display: table-cell;
vertical-align: middle;
float: none;
padding-left: 3%;
}
#globalNav div.child .whats_ryokan .childInn .childBox ul{
overflow: hidden;
margin-left:-5px;
margin-right:-5px;
}
#globalNav div.child .whats_ryokan .childBox li{
/*
float:left;
width:50%;
*/
}
#globalNav div.child .whats_ryokan .childBox li img{
margin:0 2%;
width:96%;
vertical-align: middle;
}
#globalNav div.child .whats_ryokan .childInn .floatR .childBox p{
font-size: 14px;
color: #000000;
text-align: left;
line-height: 1.45;
letter-spacing: -0.03em;
}
.tit_bg_kara{
display:none;
}



#globalNav .menu li.level01.nav03{
position: absolute;
top: 0;
right: 0;
z-index: 999;
width: 100%;
text-align: right;
}
#globalNav .menu li.level01.nav03 .navTit{
width: 46%;
display: block;
margin-left: 54%;
position: relative;
border: 1px solid #000;
background:#fff;
}
#globalNav .menu li.level01.nav03 .navTit.active{
border-bottom:none;
}
#globalNav .menu li.level01.nav03 .navTit b{
display:block !important;
position: absolute;
top: 0;
left: 0;
font-size: 3.75vw;
width: 100%;
margin-top: 19.5%;
font-weight: bold;
text-align: center;
color: #000000;
clear: both;
}
#globalNav .menu li.level01.nav03 .navTit.active b:after{
background-image: url(../images/icon/ico_arr_bt.png);
background-repeat: no-repeat;
background-position: 0 0;
background-size: auto;
}
#globalNav .menu li.level01.nav03 .navTit b:after{
content: "";
width: 15px;
height: 8px;
background-image: url(../images/icon/ico_arr_bb.png);
background-repeat: no-repeat;
background-position: 0 0;
background-size: auto;
display: inline-block;
margin-left: 5px;
vertical-align: middle;
}
#globalNav .menu li.level01.nav03 .child{
display:none;
width:100%;
padding: 2%;
text-align:left;
background: #fff;
border: 1px solid #000;
margin-top: -1px;
}
#globalNav .menu li.level01.nav03 .child .childBox ul{
overflow:hidden;
}
#globalNav .menu li.level01.nav03 .child .floatL{
display: inline;
}
#globalNav .menu li.level01.nav03 .child .floatL .childBox{
display: inline;
}
#globalNav .menu li.level01.nav03 .child .floatL .childBox ul{
display: inline;
}
#globalNav .menu li.level01.nav03 .child .childBox li{
width: 53%;
float: left;
margin: 1.5%;
padding-right: 3%;
}
#globalNav .menu li.level01.nav03 .child .childBox p{
font-size: 3.75vw;
color: #000000;
text-align: left;
line-height: 1.45;
padding: 2vw;
}
}


/*----------------------------------------------

SP

----------------------------------------------*/


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

#globalNav {
margin:2vw 3vw 4vw 3vw;
}
#globalNav .menu{
overflow: hidden;
}
#globalNav .globalNavTit{
text-align: left;
font-size: 5.2vw;
font-weight: bold;
padding: 1.5vw 0;
color: #9d0031;
margin: 0 0 2vw 0;
position: relative;
}
#globalNav .menu li.level01.nav01{
width:50%;
}
#globalNav nav ul.menu li.level01 span.navTit b{
display:none;
}
#globalNav .menu li.level01.nav01 .child,
#globalNav .menu li.level01.nav02 .child{
display:block;

}
#globalNav .menu li.level01.nav01 .child.active{
padding: 0;
}
#globalNav .menu li.level01.nav01 .child ul{
padding:2.5vw 3.75vw 3vw;
}
#globalNav .menu li.level01.nav02 .child.active h2{
padding: 3.5vw;
margin-bottom:0;
border-bottom:1px solid #9c002c;
}
#globalNav .menu li.level01.nav02 .child.active .floatL h2.active + ul{
border-bottom:1px solid #9c002c;
}
#globalNav .menu li.level01.nav02 .child ul{
padding: 3.5vw 3.5vw 2.5vw;
margin-bottom:0 !important;
}
#globalNav .menu li.level01.nav02 .child.active .floatR h2.active{
border-bottom:1px solid #9c002c;
}
#globalNav .menu li.level01.nav02 .child.active .floatR h2{
border-bottom:none;
}
#globalNav .menu li.level01.nav01 .child.active,
#globalNav .menu li.level01.nav02 .child.active{
display:block !important;
width: 200%;
border-top: 3px solid #9c002c !important;
border: 1px solid #9c002c;
}
#globalNav .menu li.level01.nav02 .child.active{
margin-left: -100%;
}
#globalNav .menu li.level01.nav01 .navTit{
border-right:none !important;
}
#globalNav .menu li.level01.nav01 .navTit,
#globalNav .menu li.level01.nav02 .navTit{
display: block;
font-weight: bold;
font-size: 4.2vw;
color: #9c002c;
line-height: 100%;
padding: 3vw 2vw 2.5vw 0vw;

}
#globalNav .menu li.level01.nav01 .navTit.active,
#globalNav .menu li.level01.nav02 .navTit.active{
color: #9c002c;
background: #FFF;
}
#globalNav .menu li.level01.nav01 .child ul,
#globalNav .menu li.level01.nav02 .child ul{
display:none;
margin-bottom:0;
}
#globalNav div.child .childNav .childBox h2:after{
content:"＋";
float: right;
font-size: 5vw;
}
#globalNav div.child .childNav .childBox h2.active:after{
content:"－";
float: right;
font-size: 5vw;
}



/*----------------------------------- #Search by Area --*/

	
#globalNav div.child .byArea .childBox h2{
font-size: 4.2vw;
font-weight: bold;
text-align: left;
line-height: 100%;
padding: 3.5vw;
}
#globalNav div.child .childNav .hokkaido_a h2{
color:#ec9418;
border-bottom:1px solid #ec9418;
}
#globalNav div.child .childNav .tohoku_a h2{
color:#e0ac00;
border-bottom:1px solid #e0ac00;
}
#globalNav div.child .childNav .tokyo_a h2{
color:#298bc3;
border-bottom:1px solid #298bc3;
}
#globalNav div.child .childNav .nagoya_a h2{
color:#33b688;
border-bottom:1px solid #33b688;
}
#globalNav div.child .childNav .osaka_a h2{
color:#52a247;
border-bottom:1px solid #52a247;
}
#globalNav div.child .childNav .sanin_a h2{
color:#87b500;
border-bottom:1px solid #87b500;
}
#globalNav div.child .childNav .shikoku_a h2{
color:#af73bc;
border-bottom:1px solid #af73bc;
}
#globalNav div.child .childNav .kyushu_a h2{
color:#f491cd;
/*
border-bottom:1px solid #f491cd;
*/
}
#globalNav div.child .childNav .kyushu_a h2.active{
border-bottom:1px solid #f491cd;
}



#globalNav div.child .byArea .childBox li a{
font-size: 3.75vw;
font-weight: bold;
color: #666666;
text-align: left;
line-height: 100%;
padding: 1.8vw 1vw 1.2vw 10px;
display: block;
text-decoration: none;
background-repeat: no-repeat;
background-position: 0 center;
background-size: 5px auto;
}
#globalNav div.child .childNav .hokkaido_a li a{
background-image: url(../images/icon/ico_arr_r01.png);
}
#globalNav div.child .childNav .tohoku_a li a{
background-image: url(../images/icon/ico_arr_r02.png);
}
#globalNav div.child .childNav .tokyo_a li a{
background-image: url(../images/icon/ico_arr_r03.png);
}
#globalNav div.child .childNav .nagoya_a li a{
background-image: url(../images/icon/ico_arr_r04.png);
}
#globalNav div.child .childNav .osaka_a li a{
background-image: url(../images/icon/ico_arr_r05.png);
}
#globalNav div.child .childNav .sanin_a li a{
background-image: url(../images/icon/ico_arr_r06.png);
}
#globalNav div.child .childNav .shikoku_a li a{
background-image: url(../images/icon/ico_arr_r07.png);
}
#globalNav div.child .childNav .kyushu_a li a{
background-image: url(../images/icon/ico_arr_r08.png);
}



#globalNav div.child .byArea .childBox li a:hover{
text-decoration: none;
}
#globalNav div.child .childNav .hokkaido_a  li a:hover{
color:#ec9418;
}
#globalNav div.child .childNav .tohoku_a  li a:hover{
color:#e0ac00;
}
#globalNav div.child .childNav .tokyo_a  li a:hover{
color:#298bc3;
}
#globalNav div.child .childNav .nagoya_a  li a:hover{
color:#33b688;
}
#globalNav div.child .childNav .osaka_a  li a:hover{
color:#52a247;
}
#globalNav div.child .childNav .sanin_a  li a:hover{
color:#87b500;
}
#globalNav div.child .childNav .shikoku_a  li a:hover{
color:#af73bc;
}
#globalNav div.child .childNav .kyushu_a  li a:hover{
color:#f491cd;
}
#globalNav .menu li.level01.nav01 .child .hokkaido_a ul{
display:block;
border-bottom: 1px solid #ec9418;
}
#globalNav .menu li.level01.nav01 .child .tohoku_a ul{
border-bottom: 1px solid #e0ac00;
}
#globalNav .menu li.level01.nav01 .child .tokyo_a ul{
border-bottom: 1px solid #298bc3;
}
#globalNav .menu li.level01.nav01 .child .nagoya_a ul{
border-bottom: 1px solid #33b688;
}
#globalNav .menu li.level01.nav01 .child .osaka_a ul{
border-bottom: 1px solid #52a247;
}
#globalNav .menu li.level01.nav01 .child .sanin_a ul{
border-bottom: 1px solid #87b500;
}
#globalNav .menu li.level01.nav01 .child .shikoku_a ul{
border-bottom: 1px solid #af73bc;
}
#globalNav .menu li.level01.nav01 .child .kyushu_a ul{

}



/*------ Serch by Theme -----*/
#globalNav div.child .byTheme .childInn{
}
#globalNav div.child .byTheme .childBox h2{
font-size: 4.2vw;
font-weight: bold;
text-align: left;
line-height: 100%;
padding: 2.5vw 0;
margin-bottom: 3vw;
border-bottom: 1px solid #000;
}
#globalNav div.child .byTheme .childInn .floatL .childBox ul{
display:block;
}
#globalNav div.child .byTheme .childInn .childBox ul{
overflow: hidden;
}
#globalNav div.child .byTheme .childBox li{
}
#globalNav div.child .byTheme .childBox li a{
font-size: 3.75vw;
font-weight: bold;
color: #666666;
padding: 3vw;
margin: 0 0 1vw;
text-align: left;
background-color: #e5e5e5;
background-image: url(../images/icon/ico_arr_r.png);
background-repeat: no-repeat;
background-position: 97.5% center;
background-size: 5px auto;
display: block;
text-decoration: none;
}
#globalNav div.child .byTheme .childBox li a:hover{
color:#ffffff;
background:#000000;
text-decoration: none;
}
}