@charset "utf-8";

/*-----------------
 　　　　予約フロー
 ----------------*/


 /*-----------------
 　　　　　　共通
 ----------------*/

 #container{
 	width: 992px;
 	margin: 0 auto;
 	text-align: center;
 }

 #container select{ cursor: pointer;}

 .mt10{ margin-top: 10px;}
 .mb25{ margin-bottom: 25px;}
 .mb50{ margin-bottom: 50px;}

 .oh{ overflow: hidden;}

 .fl{ float: left;}

 .fr{ float: right;}

 .ex{ line-height: 1.5;}

 .ib{ display: inline-block;}

 .red{ color: red; }


 .common-ttl{
    background: #ebf6fd;
    padding: 10px 0 10px 15px;
    color: #000;
    font-size: 130%;
        position: relative;
 }

 .common-ttl:before{
    content: "";
    display: block;
    width: 4px;
    height: 70%;
    position: absolute;
    top: 15%;
    left: 0;
    background-color: #23afef;
 }

 .common-ttl2{
    background: #23afef;
    color: #fff;
    font-size: 140%;
    text-align: center;
    padding: 5px 0 3px;
}

.common-ttl3{
    font-size: 150%;
    border-left: #23afef solid 6px;
    background: none;
    padding: 6px 0 5px 15px;
    color: #000;
}

.common-ttl4{
    font-size: 140%;
    border-left: #23afef solid 3px;
    background: none;
    padding: 3px 0 2px 10px;
    color: #000;
    margin-bottom: 15px;
}

#modal-gray-layer {
    z-index: 1;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba( 0,0,0, 0.5 );
}

.modal-window {
    display: none;
}

.modal-close {
    position: absolute;
    top: 10px;
    right: 10px;
    display: block;
    z-index: 2;
    cursor: pointer;
}

.modal-close:before{
    content: "×";
    width: 25px;
    display: inline-block;
    font-size: 160%;
    padding: 5px 0;
    text-align: center;
    border: 1px solid #000;
    margin-right: 8px;
}

.modal-close:hover:before{ background: #ccc;}

#container input[type=text].disa,
#container input[type=password].disa{
    background: #D8D7D7;
}

a.common-btn{
    background: #4E4E4E;
    color: #FFFFFF;
    border-radius: 5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
}

.common-table .idx th{ background: #fffbb5;}
.common-table .idx th.flight-box-qty{
        background:#ffb455;
}

.txt-red { color: #ea0000;}
.txt-red2 { color: #ea0000;display:block;}

.inputHissu{
    display: block;
    font-size: 120%;
    margin-bottom: 5px;
}

.reserve{
    text-align: center;
}

.fukuroerror,
.ouroerror,
.noouro,
.nofukuro{
    clear: both;
    margin-left: 15px;
}

.noouro2,
.nofukuro2,
.noflight-text{
	text-align:center;
	margin:30px 5px;
}

.selecterror{
    float: right;
}

.dn{ display: none;}

.changeBtn {
    position: relative;
    background: #acacac;
    color: #404040;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    font-size: 80%;
    padding: 8px 20px 6px 10px;
    cursor: pointer;
    display: inline-block;
}

.changeBtn:after {
    position: absolute;
    top: 11px;
    right: 11px;
    content: " ";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3.5px 0 3.5px 5px;
    border-color: transparent transparent transparent #404040;
}

.inputError,.inputError2{
    display: inline-block;
    border: 1px dashed #ea0000;
    padding: 8px 16px 6px 28px;
    margin-bottom: 5px;
    position: relative;
}

.inputError:before, .inputError2:before {
    position: absolute;
    top: 6px;
    left: 7px;
    content: " ";
    width: 15px;
    height: 15px;
    background: url(../img/caution.png) no-repeat;
    background-size: 15px 15px;
}

.priceList-check .txtright {text-align: right; }

.mytabi {
    width: 30%;
}

.mytabi a{
    text-align: center;
    margin: 10px auto 10px;
    display: block;
    background: #f64e59;
    color: #fff;
    font-size: 120%;
    border-radius: 5px;
    padding: 15px 15px;
}

.sistemerror{
    margin-top: 15px;
}

.age_txt {
    font-size: 135%;
}
.age_txt2{
    display: block;
    margin-top: 8px;
    font-size: 105%;
    color: #ff0000;
}
.insurance_image{
    height: 300px;
    overflow: scroll;
    margin-top: 30px;
    border: 1px solid #dadada;
}
.insurance_image img{
    width: 100%;
    height: auto;
}
.insuranceselect-box .insurance-info,
.insurance-check .insurance-info{
    text-align: right;
    padding: 0 10px 10px;
    text-decoration: underline;
}
.loading_all img{
    margin-bottom: 5px;
    display: inline-block;
}
.loading_all {
    display: block;
    text-align: center;
    padding: 30px;
}
 /*-----------------
 　　　   header
 ----------------*/

 header{
 	text-align: left;
 	padding: 15px 0;
 }

 header h1 span{
 	vertical-align: bottom;
 	margin-left: 10px;
 }

 /*-----------------
 　　  content
 ----------------*/

 .content{
 	text-align: left;
 }

 .bread{
    font-size: 135%;
    margin-bottom: 15px;
 }

 .bread li{
    display: inline-block;
    position: relative;
    vertical-align: top;
    height: 40px;
    padding: 0 38px;
    background-color: #cacaca;
    color: #585858;
 }

 .bread li:before,.bread li:after{
    content: '';
    position: absolute;
    width: 0;
    height: 0;
 }

.bread li:before{
    left: 0;
    top: 0;
    border-top: 20px solid transparent;
    border-left: 20px solid #fff;
    border-bottom: 20px solid transparent;
  }

.bread li:after{
    z-index: 1;
    right: -20px;
    bottom: 0;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 20px solid #cacaca;
}

.bread li.select{
    background: #23afef;
    color: #fff;
}

.bread li.select:after{border-left: 20px solid #23afef;}
.bread li:first-child{ padding: 0 40px}
.bread li:first-child:before{ border: none;}
.bread li:last-child{ padding: 0 40px 0 41px}
.bread li:last-child:after{ border: none;}

.bread li p{ padding: 10px 0 0; right: 0;}
 
/*-- ツアータイトル --*/

.tour-ttl{
    background: #ECECEC;
    font-size: 120%;
    text-align: center;
    padding: 10px;
    border-radius: 5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-bottom: #d4d4d4 solid 3px;
    margin-bottom: 15px;
}

.tour-ttl dt{
    background:#fff;
    border: #828282 2px solid;
    padding: 6px 0 0;
}


.tour-ttl dt img{
    width: 86px;
    height: auto;
    padding: 5px 10px;
}

/*190409ロゴ調整----*/
/*.tour-ttl dt img {
    width: 100%;
    height: auto;
    padding: 5px 0;
    display: inline-block;
}
*/
.tour-ttl dt span{
    display: block;
    background: #ebf6fd;
    font-size: 135%;
    padding: 16px 0 9px;
}

.tour-ttl dd{
    width: 87%;
    text-align: left;
}

.tour-ttl .ttl{
    font-size: 120%;
    line-height: 1.5;
}

.tour-ttl .tour-code{margin-top: 30px;}


/*-- 下部ボタン --*/

.box-btn{ margin-bottom: 40px;}

.box-btn button:hover{
    opacity: 0.5;
    text-decoration: none;
}

.box-btn .return-btn p{
    vertical-align: top;
    display: inline-block;
    margin-right: 10px;
	
}
#wbf .box-btn .return-btn .contact,
#geo .box-btn .return-btn .contact,
#life .box-btn .return-btn .contact{
	display:none;
}
.box-btn .return-btn a{
    height: 55px;
    line-height: 1.0;
}

.box-btn .return a{
    display: table-cell;
    border-bottom: #969696 solid 3px;
    background: #dbdbdb;
    font-size: 120%;
    text-align: center;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 0 18px 0px 24px;
    color: #000;
    position: relative;
    vertical-align: middle;
    font-weight: bold;
}

.box-btn .return a:after{
    position: absolute;
    top: 41%;
    left: 10px;
    content: " ";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3.5px 5px 3.5px 0;
    border-color: transparent #000 transparent transparent;
}

.box-btn .return a:hover{
    opacity: 0.5;
}

.box-btn .contact button{
    display: table-cell;
    border-bottom: #d69d1d solid 3px;
    border-top: none;
    border-left: none;
    border-right: none;
    background: #efbd25;
    font-size: 120%;
    text-align: center;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 11px 34px 8px 17px;
    color: #fff;
    font-weight: bold;
    position: relative;
    vertical-align: middle;
    cursor: pointer;
}

.box-btn .contact button:after {
    position: absolute;
    top: 46%;
    right: 13px;
    content: " ";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3.5px 0 3.5px 5px;
    border-color: transparent transparent transparent #fff;
}

.box-btn .reserve button{
    display: table-cell;
    border-bottom: #f02800 solid 3px;
    border-top: none;
    border-left: none;
    border-right: none;
    background: #ff8400;
    font-size: 220%;
    text-align: center;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 14px 84px 10px 81px;
    color: #fff;
    font-weight: bold;
    position: relative;
    vertical-align: middle;
    line-height: 1.0;
    cursor: pointer;
    height: 58px;
}

.box-btn .reserve button.disabled,
.box-btn .contact button.disabled{
    background: #D0D0D0;
    border-bottom: #A5A5A5 solid 3px;
}

.box-btn button.disabled:hover{
    opacity: 1.0;
}

.box-btn .reserve button:after {
    position: absolute;
    top: 46%;
    right: 29px;
    content: " ";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 6px;
    border-color: transparent transparent transparent #fff;
}

/*-- common-table2 --*/

.common-table2{
    border: #828282 solid 1px;
    width: 990px;
    font-size: 120%;
}

.common-table2 tr{ border-bottom: dashed 1px #828282;}
.common-table2 th{
    background: #EBF6FD;
    padding: 15px 0 15px 15px;
    vertical-align: top;
    position: relative;
    width: 180px;
    font-weight: normal;
}

.common-table2.bg-yellow th{background: #fffbb5; }

.common-table2 td{
    padding: 15px;
}

#specification .flight td p,
.tour-check .flight td p{
	margin-bottom:10px;
}

/*-- common-table3 --*/

.common-table3{
    border: #828282 solid 1px;
    width: 990px;
}

.fellow .common-table3{ margin-bottom: 20px;}

.common-table3 tr{
    border-bottom: dashed 1px #828282;
}

.common-table3 th{
    background: #EBF6FD;
    font-size: 110%;
    padding: 15px 0 10px 53px;
    vertical-align: top;
    position: relative;
    width: 140px;
    font-weight: normal;
}

.common-table3 th.required-none{
    padding: 15px 0 15px 15px;
}

.common-table3 th .required{
    position: absolute;
    top: 14px;
    left: 12px;
}

.common-table3 td{
    padding: 15px;
}
.common-table3 .yakkan{
    font-size: 140%;
    text-decoration: underline;
}
.common-table3 .yakkan:hover{
    text-decoration: none;
}

.common-table3 label{
    font-size: 130%;
    vertical-align: middle;
}

.common-table3 input[type=text],
.common-table3 input[type=tel],
.common-table3 input[type=email]{
    padding: 10px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border:1px #828282 solid;
    background:#fff;
    -webkit-appearance:none;
    font-size: 120%;
}

.common-table3 .ex{
    margin-top: 5px;
}

.common-table3 .ex2{
    margin-bottom: 7px;
}

/*-- coupon --*/
.coupon #coupon{
    height: 30px;
    font-size: 140%;
	
}

.coupon p{
	display: inline-block;
    margin-left: 20px;
    font-size: 140%;
	color: #f00;
	font-weight: bold;
}

/*-- pageloading --*/

#loader-bg {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: rgba(255,255,255,0.5);
  z-index: 3;
}
#loader {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 200px;
  margin-top: -100px;
  margin-left: -100px;
  text-align: center;
  color: #000;
  z-index: 4;
}

#loader p{
    margin-top: 15px;
}

/*-- footer --*/

footer{
    background: #ebf6fd;
    text-align: center;
    padding: 20px 0 0;
}

footer p{
    font-size: 230%;
}
footer .tel {
    padding-left: 0;
    background: none;
    color: #000;
    font-size: 300%;
    font-weight: bold;
    padding: 10px 0;
}

footer .fax{
    padding-bottom: 6px;
}

footer .open-time{
    padding: 0 0 20px;
    font-size: 160%;

}

footer .copy{
    font-size: 100%;
}

/* アプリダウンロードボタン */

.btn_area{
    text-align: left;
}
.btn_area .mytabi{ display: inline-block; }
.btn_area .googleplay{
    display: inline-block;
    vertical-align: top;
    width: 18%;
}
.btn_area .apple_icon{
    display: inline-block;
    vertical-align: top;
    margin-top: 11px;
    width: 154px;
}
.btn_area .googleplay a{
    display: block;
}
.btn_area .googleplay a img{
    width: 100%;
}
.btn_area .apple_icon a img{
    width: 100%;
}
.contact-info {
    overflow: hidden;
}
.contact-info .common-table2{
    border: #828282 solid 1px;
    width: 675px;
    font-size: 120%;
    float: left;
    margin-right: 17px;
}
/*.fb_box{ float: right;}*/

/*保険追加*/
.chubb_hoken{
    margin-bottom: 10px;
    width: 100%;
}

/*---------------------
　　　　ボタンデザイン
---------------------*/
.tabclose-btn{
    margin: 45px auto;
    text-align: center;
}

.tabclose-btn a {
    display: inline-block;
    background: #ECEBEB;
    border-bottom: #d4d4d4 solid 3px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 5px 10px 5px 10px;
    margin-bottom: 5px;
    color: #000;
    position: relative;
}


span.minitext{
    font-size: 80% !important;
    display: block !important;
    vertical-align: middle !important;
}
span.minitext2 {
    font-size: 80% !important;
    vertical-align: middle !important;
}
.addErr{
    display: inline-block;
    border: 1px dashed #ea0000;
    padding: 8px 16px 6px 28px;
    margin-bottom: 5px;
    position: relative;
}
.addErr:before{
    position: absolute;
    top: 6px;
    left: 7px;
    content: " ";
    width: 15px;
    height: 15px;
    background: url(../img/caution.png) no-repeat;
    background-size: 15px 15px;
}

.f120{font-size: 125% !important;margin:10px 0;}

.Cinsurance-box {
    margin: 15px 0;
    padding: 10px;
    border: 1px solid #d5d7d8;
}
.insurance_image {
    height: 300px;
    overflow: scroll;
    margin-top: 15px;
    border: 1px solid #dadada;
}
.Cinsurance_image img{
    width: 100%;
}
.Cinsurance-box .ex {
    font-size: 120%;
    line-height: 1.5;
}
.Cinsurance-box .txtred {
    color: #ea0000;
    font-weight: bold;
}
.Cinsurance-box .subttl {
    font-size: 140%;
    margin: 20px 0;
    border-left: 6px solid #23afef;
    padding: 10px 10px;
}
.Cinsurance-box .subttl .minitxt{
    font-size: 80%;
}
.Cinsurance-box .bg1{background: #e1f6ff;}
.Cinsurance-box .ctable{
    width: 100%;
    border: 1px solid #c5c5c5;
    margin: 20px 0;
}
.Cinsurance-box .ctable th {
    padding: 10px;
    text-align: center;
    font-size: 120%;
     border: 1px solid #c5c5c5; 
}
.Cinsurance-box .ctable td {
    padding: 20px;
    font-size: 110%;
    text-align: center;
    border-right: 1px solid #c5c5c5;
}
.Cinsurance-box input{margin-right: 10px;}
.Cinsurance-box .inrbox{margin: 15px 0;}
.Cinsurance-box .bt {
    border: none;
    border-top: 2px dashed #ccc;
    margin: 10px 0;
}

.Cinsurance-box .common-ttl {
    background: #ebf6fd;
    padding: 10px 0 10px 15px;
    color: #000;
    font-size: 160%;
    position: relative;
    margin: -10px -10px 10px;
}
.Cinsurance-box a{text-decoration:underline;}
.CcheckList .ex {
    font-size: 130%;
}
.CcheckList.bg2,.CcheckList .bg2 {
    background: #ffd6d6;
}
.Cinsurance-box .CcheckList{
	padding: 20px;
	margin-bottom: 10px;
}
.Cinsurance-box .CcheckList strong{
	font-size: 140%;
	margin-left: 5px;
}
.Cinsurance-box .txt-red2{
	display: inline;
}
.Cinsurance-box .comment{
    line-height: 170%;
	margin-bottom: 10px;
}
.Cinsurance-box .insurance_image {
    font-size: 110%;
    padding: 20px;
}
.Cinsurance-box .insurance_image p{    line-height: 1.8;}
.Cinsurance-box .bg1 {
    background: #e1f6ff;
    padding: 10px;
    border-radius: 4px;
    margin: 10px 0;
}
.Cinsurance-box .txtr{
	text-align:right;
	line-height:1.8;
}

.Cinsurance-box .catch{
	margin-top: 20px;
	font-size: 140%;
	color: #1664ED;
	font-weight: bold;
}

.Cinsurance-box .ex-border{
	border: 1px solid #d5d7d8;
	padding: 10px;
	line-height: 170%;
}
.Cinsurance-box .ex-border span{
	color: #f00;
	font-weight: bold;
}
.f80 {
    font-size: 80%;
    display: block;
    padding: 0;
}

.Cinsurance-box .box3 dl{
    display: inline-block;
    width: 28%;
}
.Cinsurance-box .box3 dl:nth-child(2){margin:0 5%;}
.Cinsurance-box .box3 dd{
    color: #1ca5e4;
    font-size: 110%;
    font-weight: bold;
    margin: 10px 0;
}
.Cinsurance-box .box3 dt img{width:100%;height:auto;}
.Cinsurance-box .box3 dt {
    height: 200px;
    overflow: hidden;
}
.Cinsurance-box tr{
    border: 1px solid #ccc;
}
.Cinsurance-box .insurance_image {
    height: 90px;
}

.Cinsurance-box table .txt-red2 {
    color: #ea0000;
    font-size: 160%;
}
.Cinsurance-box .company{
	text-align: right;
    line-height: 170%;
}
.roomtype_choice{text-align:left;}
.roomtype_choice label.mileage {
    margin-right: 15px;
    font-size: 120%;
    width: 100%;
    display: block;
}
.roomtype_choice label.mileage span {
    display: inline-block;
    width: 4em;
}
.roomtype_choice input[name=mileage] {
    margin-right: 5px;
    width: 30%;
    padding: 8px;
    font-size: 100%;
    border-radius: 4px;
    margin: 4px 0;
    border: 2px solid #bbb;
}
.send-message,.common-ttl{text-align:left;}
textarea {
    display: block;
    width: 100%;
}
.pcr{
    border: 1px solid #000;
    margin: 20px 0 20px 0;
    padding: 10px;
    line-height: 1.5;
    background-color: #fdffd3;
}
.pcr span{
    color: red;
}
.hissu{
    background:#ffdbdb !important;
}

.rentAgeCheck p {
    font-size: 110%;
    margin: 5px 0;
}

.rentAgeCheck p.yearbox{
    display:inline-block;
    padding:10px;
}
.rentAgeCheck p.yearbox label{
    cursor:pointer;
    margin:0 20px 0 0;
}

.prbnr:hover{opacity:0.8;}

/* 会員対策用に追記 0614 */
.oh{
    overflow:hidden;
}
header h1{float:left;}
#head-bottom-menu{
    float:right;
}
#head-bottom-menu a {
    text-align: center;
    font-weight: bold;
    color: #3b7bab;
    text-decoration: none;
    font-size: 14px;
    line-height: 20px;
    display: block;
    width: 140px;
    height: 30px;
    padding-top: 45px;
    box-sizing: border-box;
    background: url(/module/common/images/menu-coupon.png) no-repeat center top;
    background-size: contain;
    margin-bottom: 20px;
}
#head-bottom-menu a:hover{opacity:0.8;}
.coupon-n {
    display: block;
    width: 18px;
    height: 18px;
    background: #FF0000;
    color: #FFF;
    font-size: 12px;
    line-height: 18px;
    border-radius: 50%;
    position: relative;
    top: -55px;
    left: 83px;
}
/*メルマガ登録モーダル*/
  .mailmag_pop {
        border: 2px solid #5d94b6;
        width: 560px;
        background: #fff;
        top: 16%;
        position: fixed;
        left: 28%;
        z-index: 9999;
        border-radius: 4px;
        display:none;
    }
    .mailmag_pop .inr {
        padding: 40px;
    }
.btnBox .btn1,.btnBox .btn2{display:inline-block;  width: 40%;margin:0 10px;}
.btnBox .btn1 a {
    font-size: 110%;
    text-align: center;
    background: #ff2638 url(/oka/img/tourokuico.png) no-repeat 4% 47%;
    background-size: 20px auto;
    padding: 16px;
    color: #fff;
    display: inline-block;
    border-radius: 4px;
    border-bottom: 2px solid #bc1a27;
    width: 90%;
    font-weight: bold;
}
.btnBox .btn2 a {
    font-size:110%;
    margin-left: 10px;
    text-align: center;
    background: #00a0e9 url(/oka/img/loginico.png) no-repeat 4% 50%;
    background-size: 20px auto;
    padding: 16px;
    color: #fff;
    display: inline-block;
    border-radius: 4px;
    border-bottom: 2px solid #0e6e99;
    width: 90%;
    font-weight: bold;
}
.btnBox .btn1 a:hover,.btnBox .btn2 a:hover{opacity:0.8;text-decoration:none;}
#batten{
    background: #ccc;
    padding: 8px 10px;
    border-radius: 40px;
    position: absolute;
    z-index: 11;
    top: -14px;
    right: -10px;
    border: 4px solid #3d3d3d;
    font-weight: bold;
    font-size: 127%;
}
#batten:hover{cursor:pointer;}
#gnav-overlay {
    display: none;
    width: 100%;
    height: 100%;
    text-align: center;
    position: fixed;
    top: 0;
    z-index: 100;
    background: rgba(0,0,0,0.7);
}
.closeBtn{
    padding: 10px 0;
    background: #4a4a4a;
    color: #fff;
    text-align: center;
    border-radius: 4px;
    border-bottom: 2px solid #333;
}
@media screen and (max-width: 789px){

    .mailmag_pop {
        width: 90%;
        position: fixed;
        left: 4%;
    }
    .mailmag_pop img{
        width:100%;height:auto;
    }
    #head-bottom-menu{
        margin-right:10px;
    }
    #head-bottom-menu a{
        font-size:10px;
        width: 70px;
        height: 24px;
        padding-top: 25px;
    }
    .coupon-n {
        width: 14px;
        height: 14px;
        font-size: 10px;
        line-height: 15px;
        top: -42px;
        left: 46px;
    }
    .btnBox .btn1, .btnBox .btn2{
        width:100%;
        display:block;
        margin:10px 0;
    }
    .btnBox .btn2 a{
        margin-left:0;
    }
}