/* =========================================

	@ いろんなところで使えそうなやつ

============================================ */

.disnone{
	display: none;
}

.bg-gray {background: #eee;padding: 2% 0;}

/* もっと見るボタン */
.mottoBtn {
    text-align: right;
    margin: 4% 0;
}
.mottoBtn a{
	background: #3a77c7;
    color: #fff;
    padding: 8px 20px;
    font-size: 120%;
    display: inline-block;
    transition-duration: 0.3s;
}
.mottoBtn a img{width:65px;}
.mottoBtn a:hover{text-decoration:none;}

.fw{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;	
}

/* 隙間 */
.mb10{margin-bottom:10px;}

/* 打消しくん */
input[type="text"],
input[type="password"],
textarea,button,select {
    outline: none;
}
/* ios用 */
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
#container{width:inherit !important;}
.container.cf{overflow:hidden;}

/* =========================================

	@ ナビゲーション

============================================ */

#pageNavBtn{display:none;}
.paegNav{
	border-top: 2px solid #3a77c7;
    border-bottom: 2px solid #3a77c7;
    background: #eee;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;    
    width: 100%;
}
.paegNav li{
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
	margin:5px 0;
    border-left: 1px solid #a4a4a4;
}
.paegNav li.spOnly{display:none;}
.paegNav li:last-of-type{border-right: 1px solid #a4a4a4;}
.paegNav li a {
    display: block;
    padding:0 10px;
    margin: 5px 0;
    text-align: center;
    font-size: 85%;
    color: #3a77c7;
}

/* =======================================

	@ タイトル 

========================================== */

.contTtl {
    text-align: center;
    height: inherit;
    margin: 5% 0;
}
.contTtl span {
    font-size: 190%;
    color: #3a77c7;
    display: inline-block;
    padding: 10px 0;
}
.contTtl span:nth-of-type(1){font-weight:bold;border-bottom: 1px solid #3a77c7;}
.contTtl span:nth-of-type(2){display:block;}

/* =======================================

	@ 出発地切り替え 

========================================== */

.depChangeWrap {
    box-sizing: border-box;
    background: #444;
    padding: 10px 5%;
    display: -webkit-box;
    display: -ms-flexbox;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    display: none;
}
.depChangeWrap select[name=depChange] {
    font-size: 110%;
    background: url(/search-renew/images/2020/btn_arrow2.png) no-repeat 95% center #fff;
    width: 300px;
    padding: 10px;
    border: none;
    border-radius: 6px;
    background-size: 10px auto;
}
.depChangeWrap .txt-w {
    color: #fff;
    margin: 0 15px;
    font-size: 120%;
}

/* =======================================

	@ 検索ボックス ／　searchBoxArea

========================================== */

.searchBoxArea {
    height: 520px;
    padding: 20px 0;
    background-size: 100% 100%;
}
.searchBoxArea .searchWrap {
    width: 992px;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;  
}
.searchBoxArea .sbWrap {
    /*background: #fff;*/
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;  
}
.formTitle {
    color: #3a77c7;
    font-size: 120%;
    background: url(/search-renew/images/2020/ico_megane.png) no-repeat 0 center;
    background-size: 24px;
    padding: 10px 0 10px 30px;
}



/* ---------------------------------------
	１．タブの部分 
----------------------------------------- */

.searchBoxArea .pdyList{
	width:160px;
}
.searchBoxArea .pdyList li {
	cursor:pointer;
    text-align: center;
    background: #eee;
    transition-duration: 0.6s;
}
.searchBoxArea .pdyList li:nth-of-type(2){margin:5px 0;}
.searchBoxArea .pdyList li span {
    display: inline-block;
    padding: 88px 0 40px;
}
.searchBoxArea .pdyList li.sel{
	position:relative;
    background: #3a77c7;
    color: #fff;
}
.searchBoxArea .pdyList li::after {
	opacity:0;
	transition-duration: 0.6s;
    content: "";
    position: absolute;
    top: 40%;
    right: -15px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 0 10px 15px;
    border-color: transparent transparent transparent #3a77c7;
}
.searchBoxArea .pdyList li.sel::after {
	opacity:1;
}

/* 国内の場合 */
.searchBoxArea .pdyList li.dom span {
    background: url(/search-renew/images/2020/search_dom.png) no-repeat left;
    background-position: -88px 25px;
    background-size: 140px;
}
.searchBoxArea .pdyList li.dom.sel span {
    background: url(/search-renew/images/2020/search_dom.png) no-repeat left;
    background-position: 8px 25px;
    background-size: 140px;
}
/* DPの場合 */
.searchBoxArea .pdyList li.dp span {
    background: url(/search-renew/images/2020/search_dp.png) no-repeat left;
    background-position: -80px 24px;
    background-size: 160px;
}
.searchBoxArea .pdyList li.dp.sel span {
    background: url(/search-renew/images/2020/search_dp.png) no-repeat left;
    background-position: 30px 24px;
    background-size: 160px;
}
/* やどたすの場合 */
.searchBoxArea .pdyList li.ydts span {
    background: url(/search-renew/images/2020/search_ydts.png) no-repeat left;
    background-position: -96px 30px;
    background-size: 180px;
}
.searchBoxArea .pdyList li.ydts.sel span {
    background: url(/search-renew/images/2020/search_ydts.png) no-repeat left;
    background-position: 31px 30px;
    background-size: 180px;
}
select:disabled{
    opacity:0.8;
}
.countTxtPrc{
    display: block;
    color: #bf0909;
    margin: 5px 0;
    font-size: 12px;
    font-weight: bold;
}

/* ---------------------------------------
	2．中身（ツアー検索） 
----------------------------------------- */

.searchBoxArea .searchBox {
    width: 1040px;
    padding:0;
    box-sizing: border-box;
}
.searchBox .brandInfo{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;	
}
.searchBox .brandInfo img{width:170px;}
.searchBox .brandInfo span {
    display: block;
    padding: 0 0 0px 15px;
    font-size: 11px;
    line-height: 1.5;
    width: 200px;
}

/*パキっとする前の状態*/
/*.tourSearch{
    width: 400px;
    box-sizing: border-box;
    padding: 10px 10px 10px 0;
    border-right: 2px solid #a7ccfd;
}*/
.tourSearch {
    box-sizing: border-box;
    border-radius: 4px;
    box-shadow: 1px 2px 2px #0000003b;
    border-right: none;
    background: #fff;
    margin-right: 10px;
    margin-left: 10px;
    padding: 15px;
    width: 420px;
    height: 440px;
}

/* select部分 */
.selWrap select,.selWrap input{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: block;
    cursor:pointer;
    margin: 0;
    border: 0;
    background: transparent;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    font-size: 16px;
    color:#333;
    padding: 18px 30px 0 10px;
}
.selWrap input[name=date] {
    background: transparent url(/search-renew/images/2020/date_ttl.png) no-repeat left;
    background-size: 40px auto;
    padding-left: 40px;
}
.searchBox input[type="text"],.searchBox input[type="password"],.searchBox textarea,.searchBox select {
    outline: none;
}
.searchBox label {
    width: 100%;
    display: block;
    border: 1px solid #ccc;
    border-radius: 4px;
    position: relative;
    height: 50px;
    background: url(/search-renew/images/2020/btn_arrow2.png) no-repeat 95% center;
    background-size: 20px auto;
}
.searchBox label::before {
    top: 8px;
    left: 10px;
    display: block;
    position: absolute;
    font-size: 12px;
    pointer-events: none;
    color: #666;
}
.searchBox label[name=date]::before{
    left: 40px;	
}
.searchBox label[name=dephomen]::before {
    content: "\51FA\767A\5730";
}
.searchBox label[name=homeng_hr]::before {
    content: "\5BBF\6CCA\30A8\30EA\30A2";
}
.searchBox label[name=homeng]::before {
    content: "\884C\304D\5148";
}
.searchBox label[name=homen]::before {
    content: "\30A8\30EA\30A2\FF08\4EFB\610F\FF09";
}
.searchBox label[name=date]::before {
    content: "\65E5\7A0B";
}
.searchBox label[name=pax]::before {
    content: "\4EBA\6570";
}
.searchBox label[name=tbpndep]::before {
    content: "\51FA\767A\7A7A\6E2F\FF08\5F80\8DEF\FF09";
}
.searchBox label[name=tbpnarr]::before {
    content: "\5230\7740\7A7A\6E2F\FF08\5F80\8DEF\FF09";
}
.searchBox label[name=tbpndepf]::before {
    content: "\51FA\767A\7A7A\6E2F\FF08\5FA9\8DEF\FF09";
}
.searchBox label[name=tbpnarrf]::before {
    content: "\5230\7740\7A7A\6E2F\FF08\5FA9\8DEF\FF09";
}
.searchBox label[name=odd]::before {
    content: "\51FA\767A\65E5";
}
.searchBox label[name=fdd]::before {
    content: "\5E30\7740\65E5";
}
.searchBox label[name=tbpn_adt]::before {
    content: "\5927\4EBA";
}
.searchBox label[name=tbpn_chd]::before {
    content: "\5C0F\4EBA";
}


.searchBox .col2{margin:10px 0;}
.searchBox .col2 .selWrap {width: 189px;}
.searchBox .col2 .selWrap:nth-of-type(1) {
    margin-right: 10px;
}
.searchBox input[type=submit]{
	background: #edab2b;
    border: none;
    width: 100%;
    color: #fff;
    padding: 15px 0;
    font-size: 120%;
    margin: 15px 0;
    border-radius: 4px;
}

#SearchFormDomesticHR .selWrap{margin-bottom:10px;}

/* ---------------------------------------
	3．中身（どこ行く検索） 
----------------------------------------- */

/* パキっと割る前 */
/*.docoBox{
	position:relative;
    width: 600px;
    height:350px;
    box-sizing: border-box;
    padding: 10px;	
}*/


.docoBox {
    position:relative;
    border-radius: 4px;
    box-shadow: 1px 2px 2px #0000003b;
    width: 500px;
    height: 440px;
    padding: 10px;
    background: #fff;
}
.docoBox .fw{
    margin-top: 10px;
}
.docoTtlWrap span,.docoTtlWrap h3{
    display:inline-block;
    vertical-align:middle;
}
.docoTtlWrap span{
    font-size: 12px;
    color: #555;
}
.docoBox .docoInr {
    width: 95px;
    padding: 0 10px;
    box-sizing: border-box;
}
.docoInr .depTtl {
    text-align: right;
    background: url(/search-renew/images/2020/dep_ttl.png) no-repeat left;
    background-size: 25px;
    padding: 5px 0;
}
.docoInr .dateTtl {
    background: url(/search-renew/images/2020/date_ttl.png) no-repeat left;
    background-size: 25px;
    padding: 5px 0 5px 30px;
}
.docoBox .docoInr:nth-of-type(3) {
    width: 385px;
    margin: 0 auto;
}
.comeDoco,.closeBtn{display:none;}

.docoInr:nth-of-type(2){
	/* 一旦非掲載 
	border-left:2px dotted #e2e2e2;
	*/
	border-right:2px dotted #e2e2e2;
}
.docoBtnList li{margin:10px 0;cursor:pointer;}
.docoBtnList span {
    text-align: center;
    display: block;
    background: #eee;
    padding: 6px;
    border-radius: 25px;
	transition-duration: 0.3s;
}
.docoBtnList .sel span{background:#3a77c7;color:#fff;}
.docoBtnList li:hover span{background:#3a77c7;color:#fff;}

/* 地図のパンくず */
.mapPankuzu {
    z-index: 15;
    position: absolute;
    width: 140px;
    top: 55px;
    right: 230px;
    /* right: 245px; */
}
.mapPankuzu .ttl {
    display:block;
    margin: 5px 0 0 0;
}
.mapPankuzu .parent,.mapPankuzu .child {
	cursor:pointer;
    display: inline-block;
    color: #999;
    font-size: 80%;
    margin: 5px 0;
    z-index: 11;
}
.mapPankuzu .child:nth-of-type(1)::before{
	content:"";
}
.mapPankuzu .child::before {
    content: ">";
    color: #999;
}

/* 地図 */
.mapWrap {
	opacity:0;
    position: absolute;
/*    top: 40px;
    right: 20px;*/
    top:85px;
    right:10px;
    width: 355px;
    z-index:5;
}
.mapWrap.on{
	opacity:1;
	z-index:10;
    -webkit-transition: all 2s ease;
    -moz-transition: all 2s ease;
    -o-transition: all 2s ease;
    transition: all  2s ease;
}
.mapWrap .mapBox {
	position:relative;
    background: url(/search-renew/images/2020/map/dom_map.png) no-repeat center;
    height: 300px;
    background-size: 300px auto;
    padding: 0 20px;
}

/* でっかいどうシリーズ */
.mapWrap.hkd .mapBox{
    background: url(/search-renew/images/2020/map/hkd_map.png) no-repeat center;
    background-size: 300px auto;
}
.mapWrap.sapporo .mapBox{
    background: url(/search-renew/images/2020/map/hkd_sapporo_map.png) no-repeat center;
    background-size: 300px auto;
}
.mapWrap.dounan .mapBox{
    background: url(/search-renew/images/2020/map/hkd_dounan_map.png) no-repeat center;
    background-size: 300px auto;
}
.mapWrap.douou .mapBox{
    background: url(/search-renew/images/2020/map/hkd_douou_map.png) no-repeat center;
    background-size: 300px auto;
}

.mapWrap.okinawa .mapBox{
    background: url(/search-renew/images/2020/map/oka_map.png) no-repeat center;
    background-size: 300px auto;
}
.mapWrap.kyushu .mapBox{
    background: url(/search-renew/images/2020/map/kyu_map.png) no-repeat center;
    background-size: 300px auto;
}
.mapWrap.chugoku .mapBox{
    background: url(/search-renew/images/2020/map/chu_map.png) no-repeat center;
    background-size: 300px auto;
}
.mapWrap.shikoku .mapBox{
    background: url(/search-renew/images/2020/map/shi_map.png) no-repeat center;
    background-size: 300px auto;
}

.mapBox li{
    top: 0;
    left: 0;
    position: absolute;
}
.mapBox li span.btn,.mapBox li a.btn{
    background: #3a77c7 url(/search-renew/images/2020/btn_arrow.png) no-repeat 90% center;
    color: #fff;
    background-size: 10px auto;
    display: inline-block;
    padding: 5px 20px 5px 10px;
    border-radius: 4px;
    cursor:pointer;
    font-size:90%;
    transition-duration: 0.3s;
}
.mapBox li span.btn,.mapBox li a:hover{text-decoration:none;opacity:1;}
.mapBox li span.txt {
    display: block;
    font-weight: bold;
    margin:0;
    font-size: 80%;
    color:#333;
    text-shadow: 1px 1px 0px #fff;
}
.mapBox li span.btn:hover,.mapBox li a.btn:hover {
    background-color: #edab2b;
}

/* positionズ */
.mapBox li.map_hkd{left: 160px;}
.mapBox li.map_knt {
    left: 240px;
    top: 180px;
}
.mapBox li.map_kns {
    left: 160px;
    top: 215px;
}
.mapBox li.map_shi {
    left: 95px;
    top: 255px;
}
.mapBox li.map_chu {
    left: 75px;
    top: 165px;
}
.mapBox li.map_kyu {
    left: 5px;
    top: 265px;
}
.mapBox li.map_oka {
    left: 5px;
    top: 60px;
}

/* 北海道（data-level:2） */
.mapBox li.map_hkd-sapporo {
    left: 10px;
    top: 140px;
}
.mapBox li.map_hkd-douhoku {
    left: 160px;
    top: 40px;
}
.mapBox li.map_hkd-doutou {
    left: 220px;
    top: 200px;
}
.mapBox li.map_hkd-dounan {
    left: 60px;
    top: 260px;
}
.mapBox li.map_hkd-douou {
    left: 140px;
    top: 164px;
}
/* 北海道（札幌・小樽 */
.mapBox li.map_hkd-sp-sapporo {
	top: 145px;
    left: 145px;
}
.mapBox li.map_hkd-sp-otaru {
    left: 110px;
    top: 90px;
}
/* 北海道（道南） */
.mapBox li.map_hkd-dn-oonuma {
	top: 155px;
    left: 185px;
}
.mapBox li.map_hkd-dn-yunokawa {
	top: 220px;
    left: 220px;
}
.mapBox li.map_hkd-dn-hakodate {
	top: 275px;
    left: 140px;
}

.mapBox li.map_oka-honto {
	left: 160px;
    top: 30px;
}
.mapBox li.map_oka-naha {
    top: 150px;
    left: 200px;
}
.mapBox li.map_oka-rito {
	top: 180px;
    left: 40px;
}

.mapBox li.map_kyu-fukuoka {
    left: 200px;
    top: 20px;
}
.mapBox li.map_kyu-oita {
	left: 260px;
    top: 100px;
}
.mapBox li.map_kyu-miyazaki {
	top: 170px;
    left: 250px;
}
.mapBox li.map_kyu-yakushima {
	top: 260px;
    left: 220px;
}
.mapBox li.map_kyu-kagoshima {
	top: 260px;
    left: 220px;
}
.mapBox li.map_kyu-kagoshima {
	left: 90px;
    top: 220px;
}
.mapBox li.map_kyu-amami {
    top: 290px;
    left: 60px;
}
.mapBox li.map_kyu-kumamoto {
    top: 130px;
    left: 180px;
}
.mapBox li.map_kyu-nagasaki {
	top: 130px;
    left: 100px;
}
.mapBox li.map_kyu-goto {
	top: 95px;
    left: 15px;
}
.mapBox li.map_kyu-saga {
    top: 52px;
    left: 115px;
}
.mapBox li.map_kyu-iki{left:90px;}

.mapWrap li.map_chu-shimane{
    top: 100px;
    left: 50px;
}
.mapWrap li.map_chu-shimane{
    top: 100px;
    left: 50px;
}
.mapWrap li.map_chu-tottori{
    top: 40px;
    left: 240px;
}
.mapWrap li.map_chu-okayama{
	left: 230px;
    top: 140px;
}
.mapWrap li.map_chu-hiroshima{
    left: 140px;
    top: 180px;
}
.mapWrap li.map_chu-yamaguchi{
	left: 40px;
    top: 210px;
}

.mapWrap li.map_shi-kagawa{
    top: 65px;
    left: 160px;
}
.mapWrap li.map_shi-tokushima{
    top: 120px;
    left: 240px;
}
.mapWrap li.map_shi-kochi{
    left: 160px;
    top: 180px;
}
.mapWrap li.map_shi-ehime{
    top: 170px;
    left: 35px;
}

/* --------------------------
    @ カレンダー
------------------------------------　*/

#wbfCalender{
/*    cursor:pointer;
    border:none;
    text-align: center;
    padding:0;
    font-size: 130%;
    color: #348cc4;
    font-weight: bold;
    display: block;
    width: 70%;
    margin: 0 auto;*/
}
#calendar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    padding: 15px;
}
#calenderBox {
    /*position: fixed;*/
    top: 10%;
    left: 20%;
    width: 60%;
    margin-left: -30%;
    margin: 0 auto;
    padding: 15px 0;
    z-index:10000;
    /*display:none;*/
    box-sizing: border-box;
}
#calKetteiBtn{
    background: #348cc4;
    color: #fff;
    padding: 10px 20px;
    display: inline-block;
    border-radius: 4px;
}
#calendar .is-disabled{color:#aaa !important;cursor:inherit;}
#calendar table {
    width: 48.5%;
    background: #fff;
    font-size: 80%;
    box-shadow: 1px 1px 2px #ccc;
    margin: 0 0 10px;
}
#calendar table td {
    font-size: 120%;
    width: 2em;
    text-align: center;
    padding: 14px;
    font-weight: normal;
    color: #333;
}
#calendar table td.cal {
    cursor: pointer;
}
#calendar table th{
    text-align: center;
    padding: 10px 0;
}
#calendar .is-calSelect {
    color: #464646;
    background: #b3d9f0;
}
#calendar table td:first-of-type{
    color: #f27979;
}
#calendar table td:last-of-type{
color: #71b2d6;
}

input.from{
  width:2em;
  display:inline-block;
  border:none;
  text-align:center;
 }
.scrollBox {
    height: 400px;
    overflow-y: auto;
    background: #eee;
}
 .calControl {
     width: 100%;
     box-sizing: border-box;
     padding: 8px;
     background: #3a77c7;
     display: flex;
     justify-content: space-between;
 }
#changeHakuBox {
    color:#fff;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: inherit;
    width: 18%;
}

#changeHakuBox input{
    color:#fff;
  background:none;
  font-size:140%;
}
#prev + p{text-align:center;}
input#hakuLen + span{
  display:block;
  color:#fff;
  font-size:80%;
}
#calBtnBox p {
    cursor: pointer;
    font-size: 140%;
    background: #273950;
    color: #fff;
    padding: 10px 25px;
    border-radius: 2px;
    width: 6em;
    text-align: center;
    box-shadow: 1px 1px 1px #1f2c3d;
}
#next{
    cursor: pointer;
    padding: 5px 5px 5px 10px;
    width: 2em;
}
#prev {
    cursor: pointer;
    padding: 5px 10px 5px 5px;
    width: 2em;
}
#calBtnBox {
    width: 60%;
    display: flex;
    font-size:80%;
    align-items: baseline;
    justify-content: flex-end;
}
#changeHakuBox input {
    outline: none;
    display: inline-block;
    width: 1.5em;
}
#changeHakuBox input:focus {outline: none;}
input[name=date_mieti]{display:none;}
input[name=date_mieti] + span {
    display: block;
    background: #fff;
    color: #aaa;
    font-size:130%;
    padding: 9px 6px;
    border-radius: 2px;
    width: 6em;
    margin-right: .5em;
    text-align: center;
}
input[name=date_mieti]:checked + span {
    display: block;
    border: 1px solid #348cc4;
    background: #fff;
    color: #348cc4;
    border-radius: 2px;
    margin-right: .5em;
    text-align: center;
}

#calendar table td.holiday{
    color: #f27979;
}

/* --------------------------
    @ お部屋を選ぼう
------------------------------------　*/

.bg{
    padding:15px;
    width: 100%;
    height: 100%;
    /*position: fixed;*/
    /*top: 0;*/
    z-index: 10000;
    background: rgba(0,0,0,0.7);
}
.selectRoomWrap {
    background: #fff;
    width: 600px;
    border-radius: 4px;
    margin: 0 auto;
    padding: 15px;
    box-shadow: 1px 2px 2px #464646;
}
.selectRoomWrap input {
    border: none;
    text-align: center;
    width: 4em;
    font-size: 18px;
}
.selectRoomWrap .srBtn{
    cursor:pointer;
    width: 3em;
    padding: 10px 0;
    border-radius: 20px;
    background: #70a2e4;
    color: #fff;
    border: none;
    transition-duration: 0.2s;
    border-bottom: 2px solid #2f4d75;
}
.selectRoomWrap .srBtn.dis {
    cursor:inherit;
    background: #d6d6d6;
    color: #a8a5a5;
    border: none;
    border-bottom: 2px solid #bfbfbf;
}
.selectRoomWrap .srBtn.dis:active{border-bottom: 2px solid #bfbfbf;}
.selectRoomWrap .srBtn:active {border-bottom:none;}

.selectRoomWrap .ttl{
    font-weight: bold;
    font-size: 115%;
}

.selectRoomWrap dl{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
}

/* 人数 */
.srPerson dt{
    text-align: left;
    font-size: 16px;
    width: 200px;
}
.srPerson dd{
    margin-left: auto;
    width: 340px;
    text-align: right;
}

/* 部屋 */
.roomType dl:last-of-type{margin-bottom:0;}
.roomType dt {
    text-align: left;
    font-size: 16px;
    width: 200px;
}
.roomType dd{
    margin-left: auto;
    width: 340px;
    text-align: right;
    margin-bottom:10px;
}
.srRoom{margin-top:20px;}
.srKettei {
    background: #edab2b;
    color: #fff;
    padding: 15px;
    text-align: center;
    border-radius: 4px;
    font-size: 120%;
    margin-top: 20px;
}

.srRoom .dis{opacity:0.5;filter: grayscale(1);}

/* =======================================

	@ 今が旬のおすすめツアー 

========================================== */

/* 全体囲ってる箱 */
.osusumeTourWrap{
	width:1200px;
	margin:0 auto;
}
.text_sml{
    display: block;
    font-size: 70%;
    font-weight: normal;
}

/* ---------------------------------------
	1．タブ 
----------------------------------------- */

.osusumeTab {
	display: block;
	cursor:pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 4%;
}
.osusumeTab li {
    margin: 0 4px;
    transition: all .5s;
    background: #e6e6e6;
    padding: 10px 15px;
    border-radius: 25px;
    cursor: pointer;
}
.osusumeTab li:hover{
    color:#3a77c7;
    opacity:0.6;
}
.osusumeTab li.sel{
	background: #3a77c7;
    color: #fff;
}
.osusumeTab li.sel:hover{opacity:1;}

/* ---------------------------------------
	2．中身 
----------------------------------------- */

.osusumeInr{
    display:none;
}
.osusumeInr.on{
	transition: all 1s;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
    width: 100%;
}
.osusumeInr a{width:320px;color: #333;}
.osusumeInr a:hover{text-decoration:none;}
.osusumeInr a:nth-of-type(2),.osusumeInr a:nth-of-type(5){
	margin:0 15px;
}

.osusumeInr img {
    width: 100%;
    border-radius: 8px;
}
.osusumeInr .areaDate{margin: 6px 0;font-size:90%;}
.osusumeInr a div{position:relative;}
.osusumeInr a div:nth-of-type(1) span {
    top: 0;
    right: 0;
    position: absolute;
    background: #000000b3;
    color: #fff;
    display: inline-block;
    padding: 4px 15px;
    border-radius: 0 6px 0 0;
}
.osusumeInr .ttl{
	font-size: 110%;
    line-height: 1.5;
    font-weight: bold;
}
.osusumeInr .subTxt {
    color: #666;
    line-height: 1.5;
    font-size: 70%;
    font-weight: normal;
    text-align: left;
    margin: 10px 0 10px;
}
.priceBox{
	color: #cb220b;
    font-weight: bold;
    font-size: 140%;
    text-align: center;
    margin: 10px 0;
}

/* =======================================

	@ おすすめ都市から選ぶ 

========================================== */

/* 全体囲ってる箱 */
.osusumeToshiWrap {
    width: 1200px;
    margin: 0 auto;
}
.osusumeToshiWrap .toshiName{
	font-size: 140%;
    display: block;
    text-align: center;
    font-weight: bold;
    margin: 10px 0;
}
.osusumeToshiWrap .toshiTxt {
    line-height: 1.5;
    font-size: 90%;
    display: block;
}
.osusumeToshiWrap .toshiTxt a {
    display: block;
    color: #555;
    line-height: 2;
    text-decoration: none;
}

.toshiInr {
    transition: all 1s;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
}
.toshiInr .toshiNameSml{display:none;}

.toshiInr dl{width:320px;color: #333;margin:15px 0;}
.toshiInr dl:nth-of-type(2),.toshiInr dl:nth-of-type(5){
	margin:15px;
}
.toshiInr a{text-decoration:none;}
.toshiInr a:nth-of-type(2),.toshiInr a:nth-of-type(5){margin:0 15px;}

.toshiInr img {
    width: 100%;
    border-radius: 8px;
}

/* エリアがいっぱい並んでるところ */
.otherArea {
    width: 1200px;
    margin: 20px auto;
    background: #fff;
    padding: 30px 40px;
    box-sizing: border-box;
    border-radius: 4px;
}
.otherArea dl{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    margin-bottom:10px;
    font-size: 90%;
    width: 100%;
}
.otherArea dl:last-of-type{margin-bottom:0;}
.otherArea dt{
    background: #3a77c7;
    color: #fff;
    padding: 5px 10px;
    border-radius: 25px;
    width: 95px;
    text-align: center;
}
.otherArea dd {
    width: 960px;
    margin: 0 auto;
    line-height: 2;
}
.otherArea dd a{color:#333;margin: 0 4px 0 0;text-decoration:underline;}
.otherArea .ttl{
    font-size: 20px;
    text-align: center;
    margin-bottom: 15px;
    font-weight: bold;
}

/* =======================================

	@ バナー 

========================================== */

.osusumeBnr{
	width:1200px;
	margin:3% auto;
}
.osusumeBnr ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 90%;
    width: 100%;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.osusumeBnr li{width:590px;margin-bottom:15px;}
.osusumeBnr li img{width:100%;height:auto;}
.osusumeBnr li a{display:block;}

/* =======================================

	@ おすすめ・テーマ・目的から選ぶ

========================================== */

.osusumeTheme{width:1200px;margin:0 auto;}
.osusumeTheme img{width:100%;height:100%;}

.bnrInr{
	margin:5px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.bnrInr2{
    margin:5px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.bnrInr a,.bnrInr2 a{
	overflow: hidden;
	position:relative;
	display:block;
	font-size:0;
}
.bnrInr a:hover,.bnrInr2 a:hover{opacity:1;}
.bnrInr a .on,.bnrInr2 a .on {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    background-color: rgba(0, 0, 0, 0.76);
    transition-duration: 0.3s;
}
.bnrInr a:hover .on,.bnrInr2 a:hover .on {opacity:1;}
.bnrInr .txt,.bnrInr2 .txt {
	font-size:14px;
	color:#fff;
	text-align:center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	padding: 10px;
	width:90%;
	box-sizing: border-box;
}
.bnrInr .txt .ttl,.bnrInr2 .txt .ttl{
	display: block;
    font-weight: bold;
    font-size: 115%;
    padding-bottom:10px;
}
.bnrInr .txt .ttl2, .bnrInr2 .txt .ttl2 {
    padding: 10px 0 0;
    font-size: 90%;
    display: block;
    border-top: 1px solid #fff;
    line-height: 1.5;
}
.bnrInr img,.bnrInr2 img{transition-duration: 0.3s;}

.bnrInr a:hover img,.bnrInr2 a:hover img{
	transform: scale(1.2);
	transition-duration: 0.6s;
}

.bnrInr div.left{
    width: 410px;
    border-right: 4px solid #fff;
}
.bnrInr2 div.right{
    width: 410px;
}

.bnrInr div:nth-of-type(2),.bnrInr2 div.left{
	width:786px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.bnrInr div:nth-of-type(2) a, .bnrInr2 div:nth-of-type(1) a {
    width: 192px;
    height: 203px;
}
.bnrInr div:nth-of-type(2) a:nth-of-type(1),.bnrInr div:nth-of-type(2) a:nth-of-type(2),.bnrInr div:nth-of-type(2) a:nth-of-type(3),.bnrInr div:nth-of-type(2) a:nth-of-type(4),.bnrInr2 div:nth-of-type(1) a:nth-of-type(1),.bnrInr2 div:nth-of-type(1) a:nth-of-type(2),.bnrInr2 div:nth-of-type(1) a:nth-of-type(3),.bnrInr2 div:nth-of-type(1) a:nth-of-type(4){
    border-bottom:4px solid #fff;
}
.bnrInr div:nth-of-type(2) a:nth-of-type(4),.bnrInr div:nth-of-type(2) a:nth-of-type(8){border-left:4px solid #fff;}
.bnrInr div:nth-of-type(2) a:nth-of-type(2),.bnrInr div:nth-of-type(2) a:nth-of-type(6),.bnrInr2 div:nth-of-type(1) a:nth-of-type(2),.bnrInr2 div:nth-of-type(1) a:nth-of-type(6),.bnrInr2 div:nth-of-type(1) a:nth-of-type(4),.bnrInr2 div:nth-of-type(1) a:nth-of-type(8){
    border-left:4px solid #fff;
    border-right:4px solid #fff;
}
#otMoreBtn{display:none;}

/* =======================================

	@ お知らせ

========================================== */

.oshiraseBox{width:1200px;margin:0 auto;}
.oshiraseBox li{border-top:1px dashed #ccc;}
.oshiraseBox li:last-of-type{border-bottom:1px dashed #ccc;}
.oshiraseBox a{
	padding:10px 0;
	color:#333;
	text-decoration:none;
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
}
.oshiraseBox a .area {
    background: #3a77c7;
    color: #fff;
    margin: 0 20px;
    padding: 5px 10px;
}
.oshiraseBox a .ttl{
	text-decoration:underline;
}
.newsList{
	padding: 0 0 6% 0;
}

/* =======================================

	@ 旅に関する知って得するコーナー

========================================== */

.tabitokuBox{
	width:1200px;
    margin:4% auto;
}
.tabitokuBox ul{
	text-decoration:none;
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.tabitokuBox li{width:280px;}
.tabitokuBox li a{display:block;}
.tabitokuBox li img.artImg{
    width: 280px;
    height: 183px;
	overflow:hidden;
	display:block;
	border-radius:8px;
	transition-duration: 0.6s;
}
.tabitokuBox li img.ttlImg {
    position: absolute;
    top: 100px;
    left: 10px;
    width: 60%;
}
.tabitokuBox li a{
    color:#333;
    text-align:center;
    position:relative;
}
.tabitokuBox li a span.area {
    color: #333;
    display: block;
    margin: 10px 0 0;
    font-size: 120%;
    font-weight: bold;
}
.tabitokuBox li a span.txt {
    color: #555;
    display: block;
    margin: 5px 0;
    font-size: 90%;
    text-align: left;
    line-height: 1.5;
}

/* =======================================

	@ 『安心・あったらいい旅！』をご提案

========================================== */

.hmBox{width:1200px;margin:0 auto;position:relative;}
.hmBox .txt {
    line-height: 2;
    font-size: 90%;
    margin: 0 auto 4%;
    width: 900px;
}
.hmBox img.kuma {
    position: absolute;
    bottom: -50px;
    right:0;
    width: 300px;
    height: auto;
}

/* ３ポイント */
.hm3Box{
	text-decoration:none;
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;    
    width:1200px;
    margin:4% auto;
}
.hm3Box dl {
    text-align: center;
    width: 380px;
}
.hm3Box dt img {
    display: block;
    width: 65px;
    margin: 0 auto;
}
.hm3Box dl:nth-of-type(1) span {
    color: #d170b7;
    font-weight: bold;
    font-size: 140%;
    display: block;
    margin: 15px 0 5px;
}
.hm3Box dl:nth-of-type(2) span {
    color: #edab2b;
    font-weight: bold;
    font-size: 140%;
    display: block;
    margin: 15px 0 5px;
}
.hm3Box dl:nth-of-type(3) span {
    color: #3977c0;
    font-weight: bold;
    font-size: 140%;
    display: block;
    margin: 15px 0 5px;
}
.hm3Box dd.txt{
	line-height: 2;
    font-size: 90%;
    text-align: left;
}

/* =======================================

	@ お客様の声

========================================== */

.voiceBox{width:1200px;margin:0 auto;}
.voiceList{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;    
    width:100%;
    margin:4% 0;
}
.voiceList .vgWrap {
    width: 285px;
}
.voiceInfo{
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width:100%;
}
.voiceInfo img{display:block;width:60px;height:auto;}

.voiceInfo .person{width:160px;line-height: 1.5;margin:0 auto;}
.voiceInfo .area{color: #3a77c7;display:block;}
.vgWrap .txt{
	font-size: 95%;
    color: #444;
    line-height: 1.5;
    margin: 10px 0;
}

/* =======================================

	@ バナー2枚

========================================== */

.shirokumaBox {
    background: #dff3ff;
    padding: 4% 0;
}
.shirokumaBox .col2{
	width: 1200px;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.shirokumaBox .col2 img {
    display: block;
    width: 590px;
}

/* =======================================

	@ お客様サポート

========================================== */

.supportBox .contactBox {
	box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 1200px;
    margin: 0 auto;
    border: 6px solid #dff3ff;
    border-radius: 12px;
    padding: 2% 4%;
}
.supportBox .contactBox dl:nth-of-type(1){
	width:300px;
}
.supportBox .contactBox dl:nth-of-type(2) {
    width: 430px;
}
.supportBox .contactBox dt{
	font-weight: bold;
    font-size: 120%;
    margin: 10px 0;
}
.supportBox .contactBox dt img {
    width: 60px;
    vertical-align: middle;
}
.supportBox .contactBox dt span {
	margin:0 20px;
}
.supportBox .contactBox dd a{
	line-height:2;
	color:#333;
}
.supportBox .contactBox dd a.cal2{
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width:100%;
}
.supportBox .contactBox dd span:nth-of-type(1) {line-height:1.5;}
.supportBox .contactBox dd span:nth-of-type(2) {
    font-size: 280%;
    font-weight: bold;
    margin: 0 20px;
}
.mailWrap{width:333px;}
.mailWrap dd{
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width:100%;
}
.mailWrap dd a {
    border-radius: 6px;
    background: #6b9dd8;
    color: #fff !important;
    text-align: center;
    font-size: 110%;
    padding: 10px;
    width: 42% !important;
    line-height: 1.5 !important;
    display: block !important;
}
.mailWrap dd a:nth-of-type(2) {
    background: #e27676;
}

/* =======================================

	@ 関連サイト

========================================== */

.kanrenBox {
    padding:0 0 8% 0;
}
.kanrenBox .col2{
	width: 1200px;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.kanrenBox .col2 img {
    display: block;
    width: 590px;
}

/* =======================================

    @ 出発地を選択してね！（圧）

========================================== */

#selectDepMap {
    width: 100%;
    height: 100%;
    text-align: center;
    position: fixed;
    top: 0;
    z-index: 10000;
    background: rgba(0,0,0,0.7);
}
#selectDepMap .sdmInr{
    background: #fff;
    width: 60%;
    height: 560px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius:6px;
}
#selectDepMap .sdmInr ul {
    height: 400px;
    position: relative;
    background: url(/module/kokunai-top/images/map/dom_map.png) no-repeat center bottom;
    background-size: 50% auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
#selectDepMap .sdmInr li {
    cursor:pointer;
    position: absolute;
    background: #1e3c72;
    background: -webkit-linear-gradient(to right, #2a5298, #1e3c72);
    background: linear-gradient(to right, #2a5298, #1e3c72);
    font-size: 120%;
    padding: 8px 15px;
    border-radius: 6px;
    color: #fff;
    box-shadow: 1px 1px 1px #ccc;
}
#selectDepMap .sdmInr li.dep_KK{
    top: 260px;
    left: 440px;
}
#selectDepMap .sdmInr li.dep_KS {
    top: 300px;
    left: 320px;
}
#selectDepMap .sdmInr li.dep_TB {
    top: 200px;
    left: 340px;
}
#selectDepMap .sdmInr li.dep_CY {
    top: 280px;
    left: 180px;
}
#selectDepMap .sdmInr li.dep_HK {
    top: 40px;
    left: 480px;
}

#selectDepMap .sdmInr .ttl{
    padding: 10px 0;
    background: #507fb3;
    color: #fff;
    font-size: 140%;
}