@charset "utf-8";


/*トップ：メイン画像
********************************************************/
.top-mainvis,.mainvis-area {position: relative; top: -11px;}
.common-layout .top-mainvis, .common-layout .mainvis-area {top: 0;}/*共通ページの場合*/
.top-mainvis .set-vis {height: 560px; margin-bottom: 20px;}
.mainvis-area .set-vis {height: 600px; position: relative;}
.m-a-area .set-vis {height: 660px; position: relative;}

.top-mainvis .catchcopy {color: #fff; position: absolute; width: 100%; font-size: 2.1rem; text-align: center; left: 0; padding-top: 160px; text-shadow: 0 0 4px rgba(0,0,0,.6);}
.top-mainvis .catchcopy span {font-size: 5.0rem; display: block; margin-bottom: 5px;}

#my-slider h2 {z-index: 99; position: absolute; top: -160px; bottom: 0; right: 0; left: 0; height: 80px; color: #fff; position: absolute; width: 100%; font-size: 2.1rem; text-align: center; left: 0; margin-top: -60px; text-shadow: 0 0 4px rgba(0,0,0,.6); margin: auto;}
#my-slider h2 span {font-size: 4.0rem; display: block; margin-bottom: 5px;}
.sp-grab {cursor: default; cursor: url(none), default !important;}


/*レンガ基本スタイル
********************************************************/
.masonry .box {margin-bottom: 3%;}
.masonry .box img {width: 100%;}
.masonry .box dl {border: 1px solid #ddd; padding-bottom: 4.5%;}
.masonry .box dl dt span{display: block; font-size: 3.0rem; margin: 3% 4%  0 4%; font-weight: normal;word-wrap:break-word;}
.masonry .box dl dd {padding: 3% 4% 0 4%;}

.tt-dropdown-menu {color: #000;z-index: 99999 !important;max-height: 150px;overflow-y: auto;-webkit-overflow-scrolling: touch;}


/*トップ：フォーム
********************************************************/
.top-mainvis {margin-bottom: 2%;}
.top-mainvis .set-search {margin-top: 0;  background-color: rgba(6,38,110,.8); padding-left: 20px; padding-right: 20px; padding-bottom: 10px; border-radius: 5px; box-shadow:0 0 8px rgba(0,0,0,.7);z-index:100;}
.top-mainvis .set-search .set-box {/*display: table-cell;*/ display:inline-block;text-align: center; vertical-align: middle;}
.top-mainvis .set-search .box-day > div {/*margin: 22px 5px 0 0;*/width:48%;/*display:inline-block;*/float:left;}
.top-mainvis .set-search .box-day > div input {width: 100%;}
.top-mainvis .set-search .box-day .inline-stayday {/*display:inline-block;*/float:left;width:25%;}
.top-mainvis .set-search .tt-dropdown-menu {width: 586px;margin-top: 4px;max-height: 160px;}
.top-mainvis .set-search .tt-suggestion {color: #717171 !important;font-weight: normal !important;}
.top-mainvis .set-search .tt-suggestion:hover {color: #fff !important;background-color: #0078d7;}

/**/
.top-mainvis .top-mainvis-inner {position: absolute; bottom: 160px; z-index: 99; right: 0; left: 0;}

.top-mainvis .set-search .box-day {width: 28%;}
.top-mainvis .set-search .box-stayday {width: 8%;}
.top-mainvis .set-search .box-adult {width: 30%;}
.top-mainvis .set-search .box-area {width: 22%; margin-right: 25px;}
.top-mainvis .set-search .box-area .pos-rel{margin: 25px 0 0;}
.top-mainvis .set-search .box-btn {width: 16%;}
.top-mainvis .set-search .span-block {padding-left: 10px;}
/*.top-mainvis .set-search .box-day div input {width: 170px; margin: 0;}
.top-mainvis .set-search .box-area select {width: 290px;}*/

.top-mainvis .set-search .box-day,
.top-mainvis .set-search .box-adult,
.top-mainvis .set-search .box-stayday,
.top-mainvis .set-search .box-area,
.top-mainvis .set-search .box-btn {
    padding: 10px 0;
    vertical-align: top;
    text-align: left;
    /*border-right: 1px dotted #6170D6;*/
}

.top-mainvis .set-search div[class*="box-"] p {font-size: 1.5rem; font-weight: 600;  vertical-align: middle; text-align: left; margin-bottom: 3px; color: #fff;}
.top-mainvis .set-search div[class*="box-"] p span:before {font-weight: normal; vertical-align: middle; font-size: 2.6rem; margin-right: 2px;}
.top-mainvis .set-search .box-day p span:before {content: "\e900"; font-family: 'icomoon';}
.top-mainvis .set-search .box-adult p span:before {content: "\e903"; font-family: 'icomoon';}
.top-mainvis .set-search .box-area p span:before {content: "\e901"; font-family: 'icomoon';}

.top-mainvis .set-search .box-day-inner {margin: 0;}
.top-mainvis .set-search .box-day-inner-inline {padding: 0 5px !important;}
.top-mainvis .set-search .box-day-inner-inline .ttl-block {display: block;font-size: 1.2rem;margin-bottom: 5px;}

.top-mainvis .set-search .box-adult-inner {margin: 0;}
.top-mainvis .set-search .box-adult-inner-inline {padding: 0 5px !important;}
.top-mainvis .set-search .box-adult-inner-inline .ttl-block {display: block;font-size: 1.2rem;margin-bottom: 5px;}

.top-mainvis .set-search .box-adult-inner-inline .childin_close {text-align: center;}
.top-mainvis .set-search .box-adult-inner-inline .childin_close span:before{content: "\f00d";font-family: 'FontAwesome';font-size: 14px;}

.top-mainvis .set-search .box-day input,
.top-mainvis .set-search .box-adult select,
.top-mainvis .set-search .box-stayday select{
    display: inline-block;
    width: auto;
}
.top-mainvis .set-search .box-btn {
    border-right: none;
    vertical-align: top;
    margin-top: 30px;
}
.top-mainvis .set-search .box-area .twitter-typeahead {width: 100%;}
.top-mainvis .set-search .form-control {height: 40px;}

.top-mainvis .set-search .box-area input {width: 100%;}
.top-mainvis .set-search .box-btn .btn {width: 100%; font-size: 1.7rem; font-weight: bold; padding: 18px 0;}

input[readonly] {
    background-color: #fff !important;
    cursor: default !important;
}


/*.top-mainvis .set-search .span-block {display:block;}*/



/*トップ：観光スポット
********************************************************/
.kanko-spot-list img {width: 100%;}
.kanko-spot-list > div {margin-bottom: 22px;}
.kanko-spot-list > div a {display: block;  position: relative;}
.kanko-spot-list > div a:hover {opacity: .85}
.kanko-spot-list > div a span {display: block; position: absolute; width: 100%; bottom: 0; left: 0; background-color: rgba(14,63,112,.85); text-align: center; color: #fff; padding: 7px 0; font-weight: bold; }

.kanko-spot-link {margin: 0 0 50px;padding-bottom: 15px;padding-right: 15px;border-bottom: 1px solid #ccc; }
.kanko-spot-link p {text-align: right;}
.kanko-spot-link a {font-size: 1.5rem;}
.kanko-spot-link a:before {font-family: FontAwesome;content: "\f105";margin-right: 5px;}

/*トップ：キャンペーン
********************************************************/
.top-campaign {background-color: #F7F0E6; padding: 30px 0; margin-bottom: 30px;}
.top-campaign .swiper-slide {padding: 15px;}
.top-campaign .swiper-slide a {display: block;}


/*トップ：コンテンツリンク
*******************************/
.entrance-nav {clear: both; padding-bottom: 15px;}
.entrance-nav div img {width: 100%;}

.nav-list a,
.nav-list input {display: block !important; border-radius: 4px; background: #fff; color: #0058B0; padding: 10px 0; border: 1px solid #0058B0; text-align: center; width: 100%;}
.nav-list {position: relative; padding: 10px 5px 15px;}
.nav-list div,.nav-list form {margin-bottom: 15px; padding-right: 10px; padding-left: 10px;}
.nav-list a:hover,
.nav-list input:hover {text-decoration: none; background-color: #D9ECFF;}

/*民宿サイトLPバナー*/
.entrance-nav .sj-banner .sj-pc { display: block !important; }
.entrance-nav .sj-banner .sj-sp { display: none !important; }

.entrance-nav .sum-img {position: relative; margin-bottom: 25px; overflow: hidden;}
.entrance-nav .sum-img h3 {position: absolute; width: 100%; text-align: center; top: 50%; font-size: 2.8rem; font-weight: bold; color: #fff; margin-top: -15px;text-shadow: 0 0 4px rgba(0,0,0,.6);}

.nav-list .icn {width: 68px; height: 68px; background-color: #fff; border-radius: 50%; position: absolute; top: -60px; left: 50%; text-align: center; line-height: 84px; margin-left: -35px;}
.nav-list .icn i {font-size: 4.0rem; }

/*トップ：イベント情報、その他バナー
********************************************************/
.banner-wrap .container .row {border-top: 1px solid #ccc; padding-top: 20px; padding-bottom: 10px;}
.banner-wrap .box-info-opt {padding: 10px 0;}
.banner-wrap .box-info-event {padding: 10px 0;}

/*トップ：イベント情報-ブログ
********************************************************/
.section-info .container > .row .box-info > .row {border-top: 1px solid #ccc; padding-top: 20px;}
.event-blog {margin-bottom: 25px;}
.event-blog a {display: block;}
.event-blog a:hover{text-decoration: none; opacity: .8;}
.event-blog .box-event,
.event-blog .box-blog {
    width: 50%; float: left;
}
.event-blog .txt,
.event-blog .photo {
    color: #fff;
    width: 50%;
    display: table-cell;
    text-align: center;
}
.event-blog .txt strong {font-weight: bold; font-size: 2.0rem; font-weight: normal; display: inline-block; margin-bottom: 5px;}
.event-blog .txt strong i {display: block; text-align: center; font-size: 4.5rem;}
.event-blog .txt span {
    display: block;
    background-color: #fff;
    width: 70%;
    margin: 0 auto;
    border-radius: 15px;
}
.event-blog .box-event .txt span {color: #0091EA;}
.event-blog .box-blog .txt span {color: #00C853;}

.event-blog .photo img {width: 100%;}
.event-blog .box-event .txt,
.box-info-event a {background-color: #0091EA;}
.event-blog .box-blog .txt {background-color: #00C853;}

.box-info-event a { text-align: center; color: #FFF; display: block; padding: 15px 0; background-color: #f9a825;}
.box-info-event a:hover {text-decoration: none; opacity: .9;}
.box-info-event a strong {display: block; text-align: center; font-size: 16px; margin-bottom: 5px;}
.box-info-event a i {font-size: 31px;display: inline-block; vertical-align: middle; margin-right: 5px;}
.box-info-event a span {background-color: #fff; margin: 0 15px; width: auto; color: #f57f17; padding: 3px 15px; border-radius: 12px;font-size: 12px;}


/*トップ：インフォメーション
********************************************************/
.info-list {padding-bottom: 2%;}
.info-list li { text-overflow: ellipsis; height: 1.5em; overflow: hidden; white-space: nowrap; width: 100%; margin-bottom: 5px;}
.info-list li a {text-decoration: none; }
.info-list li a span {display: inline-block; margin-right: 15px;}
.info-list li a:hover {color: #F4511E;}

/*検索結果 検索枠固定
********************************************************/
.top-serch-navi {display: none;z-index: 1000;position: fixed;top: 0;background-color: rgba(0,0,0,0.8);width: 100vw;left: 50%;padding: 15px 15px;-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-ms-transform: translateX(-50%);-o-transform: translateX(-50%);transform: translateX(-50%);}
.top-serch-navi .navi-result {float: left;width: 65%;color: #fff;}
.top-serch-navi .refineBtn span {margin-right: 0;}

/*検索結果
********************************************************/
.search-terms {float: left; width: 231px; padding-bottom: 30px;/*position: relative;*/}
.search-hotel {float: right;width: 915px;}
.search-terms dl {padding: 10px; background-color: #F7F0E6; margin-bottom: 10px; border-radius: 5px;}
.search-terms .my-row {display: block;}
.search-terms .my-row.mr-ss {margin-right: 9px;}
.search-terms-pluss {text-align: center; margin-bottom: 10px;}
.search-terms-pluss span {border-radius: 50%; width: 40px; height: 40px; color: #fff; background-color: #808080; display: inline-block;}
.search-terms-pluss span i {display: inline-block; padding-top: 10px; font-size: 2.4rem;}
.search-terms .twitter-typeahead {width: 100%;}
.search-terms .checkbox span,.search-terms-hrz-pluss .checkbox span {color: #7986cc;}
.search-terms dl.ttl-icon-plus dd {display: none;}
.search-terms .ttl-icon-plus dt::before {content: " \f055";font-family: FontAwesome;margin-right: 5px;font-size: 1.7rem;}
.search-terms .ttl-icon-plus dt.active::before {content: " \f056";font-family: FontAwesome;margin-right: 5px;font-size: 1.7rem;}

/*検索結果 横検索
********************************************************/
.search-conts-hrz {padding-bottom: 1%;position: relative;}
.search-conts-hrz .toggle {display: block;width: 270px;text-align: center;cursor: pointer;font-size: 1.6rem;background-color: #f5d1a1;margin: 0 auto;padding: 11px 0;font-weight: 700;}

.search-terms-hrz,.search-terms-hrz-pluss,.search-terms-hrz-selected {width:100%; margin-top: 10px; background-color: #F7F0E6; padding: 0 20px;}
.search-terms-hrz dl {padding: 10px 10px 15px; width:22%;display: inline-block;vertical-align: middle}
.search-terms-hrz dl.room-num-input {width: 13%;}
.search-terms-hrz dl.submit {width: 18%;padding: 0;}
.search-terms-hrz .ttl-icon-ball dd {margin-bottom: 0;}
.search-terms-hrz .checkin-cal .pos-rel,
.search-terms-hrz .checkout-cal .pos-rel {margin-top: 27px;}
.search-terms-hrz .room-num-input .my-row {margin-top: 23px;}
.search-terms-hrz .ttl-block {display: block;margin-bottom: 5px;}
.search-terms-hrz .my-row {display: inline-block;}
.search-terms-hrz .my-row.mr-ss {margin-right: 9px;}
.search-terms-hrz .twitter-typeahead {width: 100%;}
.search-terms-hrz .checkbox span {color: #7986cc;}

.search-terms-hrz-pluss {margin-top: 0px; padding-top: 10px;display:none;}
.search-terms-hrz-pluss dl {padding: 10px 10px 15px; width:19%;display: inline-block;vertical-align: top;}
.search-terms-hrz-pluss dl.plus-submit{padding: 10px 10px 15px; width:19%;display: block;text-align:center;margin: 0 auto;}
.search-terms-hrz-pluss .dt-none {margin-bottom:5px;}

.search-terms-hrz-selected {margin-top: 0px; padding: 5px 20px;}
.search-terms-hrz-selected .select-ttl {font-weight: 700;margin-bottom: 5px;font-size: 1.1em;}
.search-terms-hrz-selected .select-body {margin-bottom: 5px;}

.search-terms .childin-inner select,
.search-terms-hrz .childin-inner select {display: inline-block;width: auto;}

.search-conts-hrz .fixed {z-index: 99;position: fixed;top: 0;width: 100vw;left: 50%;margin-top: 0;background-color: rgba(6, 38, 110, 0.87);-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-ms-transform: translateX(-50%);-o-transform: translateX(-50%);transform: translateX(-50%);}

/**/
.search-bc {background-color: rgba(6,38,110,.8);}
.search-bc dt, .search-bc span{color: #fff;}
.search-bc .childin-inner span{color: #717171;}

.childin-inner .childin_close {margin-top: 5px;text-align: center;cursor: pointer;}
.childin-inner .childin_close span {color: #fff;}

/*表示切替*/
.view-change {border-bottom: 4px solid #463930; padding-bottom: .8%;}
.view-change .view-flg {float: left;}
.view-change .sort-flg {float: right;}

.view-change .set {display: block; background: #EFEFEF; border-radius: 4px;  padding: 10px 15px; cursor: pointer; margin-right: 5px; float: left;}
.view-change .set.ttl {background-color: #fff;  font-weight: bold; }
.view-change .set.ttl:hover {background-color: #fff; cursor: default;}
.view-change .set:hover {background-color: #FFE6D9; text-decoration: none;}
.view-change .set.current {background-color: #FF6E41; color: #fff; }

/*価格帯*/
.slider.slider-horizontal {margin: 10px 5% 2px;width: 90% !important;}
.slider-track {background-image: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;background-color: #ddd;}
.slider-selection {background-image: none !important;background-color: #ff9574;-webkit-box-shadow: none !important;box-shadow: none !important;}
.slider-handle {background-image: none !important;border: 1px solid #717171 !important;background-color: #FFF !important;}
.sort-price-num {overflow: hidden;}
.price-low {float: left;}
.price-high {float: right;}

/*ホテル一覧
********************************************************/
.search-conts {padding-bottom: 5%;}

/*.search-hotel-list {display: none;}*/
.search-hotel-list .block-link { display: block; border-bottom: 1px solid #DDDDDD; text-decoration: none; padding-bottom: 20px; position: relative; padding: 2%;}
.search-hotel-list .block-link:hover {background-color: #FFF7F7;}


.arrow-fcr {position: absolute; right: 1%; top: 50%; width: 30px; height: 30px; border-radius: 50%; background-color: #F50057; text-align: center; margin-top: -15px;}
.arrow-fcr i {display: inline-block; padding-top: 9px; color: #fff; padding-left: 3px;}

/*ホテル一覧-たいとる*/
.search-hotel-list .block-link .ttl {padding: 0 0 2%;
}
.dis {float: right;  padding: 2px 0; margin-top: -3px; margin-left: 15px; font-size: 12px;}
span[class*="map-dis-"] {float: none; margin-left: 0; display: block;}

.search-hotel-list .block-link .ttl .h-name {font-size: 2.1rem; font-weight: bold;}
/*ホテル一覧-画像*/
.search-hotel-list .block-link .pic {float: left; position: relative; width: 20%; margin-right: 2%;}
.search-hotel-list .block-link .pic img {width: 100%; /*border-radius: 3px;*/}

.search-hotel-list .block-link .pic .icon-top {position: absolute; top: 5px; left: -11px; width:117px;}
.search-hotel-list .block-link .pic .icon-bottom {}

/*ホテル一覧クーポンラベル*/
.cpn-label-img {display: block;text-align: left;margin-top: 6px;}
.cpn-label-img img {max-width: 119px !important;-webkit-border-radius: 0 !important;border-radius: 0 !important;}
/*ホテル一覧-テキスト*/
.search-hotel-list .block-link .txt {float: left; width: 49%; margin-right: 2%;}
.search-hotel-list .block-link .txt dt {font-size: 1.6rem; color: #00BFA5; margin-bottom: 10px;}
.search-hotel-list .block-link .txt .area-name {font-weight: bold; color: #00BFA5; margin-bottom: 5px;}
/*概要*/
.search-hotel-list .block-link .h-gaiyou {margin-bottom: 10px;}
/*クチコミ*/
.search-hotel-list .block-link .h-kutikomi {margin-bottom: 10px; border-bottom: 1px dotted #C0C0C0; padding-bottom: 10px; padding-top: 5px;}
.h-kutikomi i {font-size: 1.7rem; color: #C0C0C0;}
i.star-on {color: #FF6E40;}
/*ポイント*/
.h-point {margin-bottom: 10px;}
.h-point li {display: inline-block; padding: 3px 5px; border-radius: 2px; background-color: #7986CC; color: #fff; font-size: 1.2rem; margin-bottom: 3px;}
.h-point .hotel-type {background-color: #2ab954; color: #fff;}
.r-point .room_bed p {display: inline-block;white-space: nowrap;line-height: 17px;padding-bottom: 3px;}
.room-bed-pic {padding: 0 2px 0 2px;}
/*ホテル一覧-金額*/
.search-hotel-list .block-link .prc {float: left; width: 23%;}
.search-hotel-list .block-link .prc .prc-ttl {font-weight: bold;margin-bottom: 3px;}
.search-hotel-list .block-link .prc li {background-color: #F8F8F8; margin-bottom: 5px; padding: 3px 8px; text-align: right; border: 1px solid #DDDDDD;}
.search-hotel-list .block-link .prc li.hit {background-color: #FFFF8D; border: 1px solid #FFD600;}
.search-hotel-list .block-link .prc li .type-name {float: left; font-weight: bold; font-size: 1.2rem;}
.search-hotel-list .block-link .prc li .type-prc { font-weight: bold; color: #808080;}
.search-hotel-list .block-link .prc li.hit .type-prc {color: #F50057;}
/*ホテル一覧-売り切れ*/
.search-hotel-list .block-link .prc .sold-out-htl {background-color: #fae1e1;color: #808080;border: 1px solid #ffa9a9;padding: 3px 8px;}
.search-hotel-list .block-link .prc .sold-out-htl img {width: 23px;height: 23px;margin-bottom: 6px;}
.search-hotel-list .block-link .prc .sold-out-htl span {font-size:1.2rem;font-weight:bold;} 
    
/*お気入り削除*/
.favorite-list {border-bottom: 4px solid #ddd; padding-bottom: 3%;}
.favorite-hotel .icon-delete {margin-top: 2%;}
.icon-delete {background-color: #79919D; width: 30px; height: 30px; position: absolute; left: -30px; top: 0; text-align: center; line-height: 26px; font-size: 1.7rem; font-weight: normal; z-index: 99; cursor: pointer;}
.icon-delete i {color: #fff; }
.favorite-hotel,.favorite-plan {
    margin-left: 30px; position: relative;
}

/*対応言語表示*/
.list-language-area {overflow: hidden;}
.list-language-icon-ttl {font-weight: bold;margin-top: 1%;margin-right: 10px;float: left;}
.list-language-icon {overflow: hidden;padding: 0 0 1%;float: left;}
.list-language-icon li {display: inline-block;-webkit-border-radius: 4px;border-radius: 4px;margin-bottom: 1%;font-size: 1.2rem;padding: 3px 5px;}
.list-language-icon li.list-language-icon-ok {background-color: #eee;color: #808080;}
.list-language-icon li.list-language-icon-no {background-color: #e4e9eb;color: #717171;}

/*ページング
********************************/
.paginat {margin-top: 3%;}
.paginat li {display: inline-block;margin-left: -1px; font-size: 1.5rem;}
.paginat li.nulll  {background-color: #EFEFEF;border: 1px solid #ddd;color: #858585;padding: 8px 15px;text-decoration: none;}
.paginat li a {border: 1px solid #ddd; background-color: #fff; padding: 8px 15px; display: inline-block;}
.paginat li a:hover {background-color: #E8EAEA; text-decoration: none;}
.paginat li:first-child , .paginat li:first-child a {border-bottom-left-radius: 4px;border-top-left-radius: 4px;}
.paginat li:last-child , .paginat li:last-child a {border-bottom-right-radius: 4px;border-top-right-radius: 4px;}
.paginat .current.num {background-color: #FF6E41;border: 1px solid #FF6E41;color: #fff;padding: 8px 15px;text-decoration: none;}


/*ホテル詳細
********************************************************/

/*メイン画像*/
.h-mainvis {margin-bottom: 15px;}
/*.h-mainvis-imagefit {width: 1170px; height: 680px; background-color: #F0F0F0;}*/
.h-mainvis .pic {width: 100%; margin-bottom: 25px;}

/*紹介テキスト*/
.h-about-txt {padding-bottom: 20px;}
.h-about-txt .h-about-txt-first {padding-bottom: 25px;}
.h-about-txt .h-about-txt-first dt {font-size: 2.2rem; color: #00BFA5; margin-bottom: 15px; }
.h-about-txt .h-about-txt-first dd {font-size: 1.5rem; line-height: 1.5;}

/*紹介テキスト col-*/
.h-about-txt .h-about-txt-col {}
/*.h-about-txt .h-about-txt-col .imagefit {position: relative; overflow: hidden;height: 260px;}*/
/*.h-about-txt .h-about-txt-col .imagefit div {position: absolute; left: 50%; top: 50%; width: 200%; height: 300px; line-height: 300px; text-align: center; margin:-150px 0 0 -100%;}*/
.h-about-txt .h-about-txt-col img {max-width: 100%;vertical-align: middle;}
.h-about-txt .h-about-txt-col dl {padding-top: 10px;}
.h-about-txt .h-about-txt-col dt {font-size: 1.5rem; font-weight: bold; margin-bottom: 15px;}
.h-about-txt .h-about-txt-col dd {font-size: 1.3rem; line-height: 1.5; margin-bottom: 20px;}

/*支払い方法*/
.h-plan-txt .payment {background-color: #eee;display: inline-block;padding: 3px 10px;margin-bottom: 10px;}
.h-plan-txt .payment span { font-weight: bold; margin-left: 7px;}

/*ホテルからのお知らせ*/
.h-info-block {border: 1px solid #dddddd;margin-bottom: 30px;padding: 2%;}
.h-info-block h3 {font-weight: bold;font-size: 1.8rem;float: left;width: 20%;}
.h-info-block .h-info-list {float: left;width: 80%;}
.h-info-block .h-info-list li {margin-bottom: 5px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;-o-text-overflow: ellipsis;}
.h-info-block .h-info-list li:before {content: " \f105";font-family: FontAwesome;margin-right: 7px;color: #734B3E;}

/*ホテルからのお知らせ モーダル*/
.h-info-detail .modal-title {font-size: 1.6rem;}
.h-info-detail .modal-body img {max-width: 100%;margin-bottom: 10px;}
.h-info-detail .modal-body p {margin-bottom: 10px;}
.h-info-detail .h-info-plan {background-color: #F8F0E6;padding: 1%;margin-top:10px;}
.h-info-detail .h-info-plan .h-info-plan-list {background-color: #fff;padding: 10px;}
.h-info-detail .h-info-plan .h-info-plan-ttl {font-weight: bold;font-size: 1.5rem;margin-top: 5px;}
.h-info-detail .h-info-plan-list dt.hd-block-head {border: none;padding: 0;}
.h-info-detail .h-info-plan-list dt.hd-block-head:hover {background: none;}
.h-info-detail .h-info-plan-list .hd-block-head span.open-icon {font-family: FontAwesome; color: #FF4081;margin-right: 7px;float: left;}
.h-info-detail .h-info-plan-list .hd-block-head span.open-icon:before {content: "\f055";}
.h-info-detail .h-info-plan-list .hd-block-head.open span.open-icon:before {content: "\f056";}
.h-info-detail .h-info-plan-list .hd-block-head .hd-block-head-ttl {display: block;overflow: hidden;}
.h-info-detail .h-info-plan-list dd {margin: 5px 0 10px 15px;}
.h-info-detail .h-info-plan-list dd ul li {margin-bottom: 10px;}
.h-info-detail .h-info-plan-list dd ul li a {display: block;overflow: hidden;}
.h-info-detail .h-info-plan-list dd ul li:before {content: " \f138";font-family: FontAwesome;margin-right: 7px;color: #FF4081;float: left;}


/*プラン詳細
********************************************************/
/*アイコン*/
.plan--point {border-radius: 2px; float: right; margin-left: 5px; padding: 5px 8px; background-color: #C0C0C0; font-size: 1.2rem; font-weight: bold;}
.plan--point.pp-asa {background-color: #C9E6C7;}
.plan--point.pp-hir {background-color: #D2C4E8;}
.plan--point.pp-tok {background-color: #FFEC3A;}
.plan--point.pp-cpn {background-color: #ffd588;}

.h-plan-list {background-color: #F7F0E6; padding-bottom: 3.0%;}
.h-plan-list h2,.gmap .ttl,.facility .ttl {text-align: center; font-weight: bold; font-size: 2.6rem; padding: 2.4% 0;}
.h-plan-list .no-data-msg {text-align: center;font-weight: bold;font-size: 2.0rem;padding: 2.4% 0;}
.h-plan-list .no-data-msg a {color: #ff0000;}

.htl-detail-list ul {width: 180px;}
.htl-detail-list ul li .price {float: right;}
.h-plan-list .hd-block-link .hd-block-head {cursor: pointer;}
.h-plan-list .hd-block-link .hd-block-head:hover {text-decoration: none; background-color: #FFF7F7; }

/*上段リンクブロック*/
.hd-block-head {background-color: #fff; padding: 3.0% 3.5%;  border: 1px solid #DCDDDD; position: relative; overflow: hidden;}
.hd-block-head.open {overflow: visible;}
/*.hd-block-head:hover {text-decoration: none; background-color: #FFF7F7; border: 1px solid #E296B8; cursor: pointer;}*/

.hd-block-head .flag-op-icon {position: absolute; right: 2%; top: 0; bottom: 0; text-align: center; margin: auto; border-radius: 50%; width: 34px; height: 34px; background-color: #FF4081; vertical-align: middle;}
.hd-block-head .flag-op-icon span {color: #fff; display: inline-block;font-size: 1.4rem; padding-top: 8px;}
.hd-block-head .flag-op-icon span:before {content: "\f067";font-family: FontAwesome; }
.hd-block-head.open .flag-op-icon span:before {content: "\f068";font-family: FontAwesome; }


.fully-booked {position: relative;}
.fully-booked .hd-block-head {cursor: default; }
.fully-booked .hd-block-head:hover {background-color: #fff;}
.fully-booked .hd-block-head:before {
    background-color: rgba(0,0,0,.2);
    width: 100%;
    left: 0; top: 0;
    display: block;
    position: absolute; height: 100%;
}
.fully-booked .hd-block-head .slide-on-arrow {display: none;}

.slide-on-arrow { position: absolute; bottom: -48px; left: 50%; }
.slide-on-arrow i {color: #fff; font-size: 8rem;}
.hd-block-head:hover i {color: #FFF7F7;}

/*画像*/
.h-plan-pic {width: 20%; float: left; margin-right: 2%;}
.h-plan-info {overflow: hidden;}
/*タイトル*/
.h-plan-ttl {font-size: 2.1rem; font-weight: bold; color: #734B3E; margin-bottom: 20px;}
/*価格*/
.h-plan-info .h-plan-prc {font-size: 2.4rem; color: #F50057; font-weight: bold; margin-bottom: 10px; float: right;}
/*期間*/
.h-plan-info .h-plan-time, .p-detail-plan .h-plan-time,  .room-section .room-list .h-plan-time{background-color: #FF4081; display: inline-block; color: #fff; padding: 3px 10px; margin-bottom: 10px; }
.h-plan-info .h-plan-txt {clear: both;padding-top: 10px;}
.h-plan-info .h-plan-txt p {overflow: hidden; word-wrap:break-word;}
/*支払い方法*/
.p-detail-plan .h-plan-time {margin: 0 5% 1%;}
.h-plan-info .h-plan-txt-pay {display: inline-block; }
.h-plan-info .h-plan-txt-pay .payment {padding: 3px 10px; display: inline-block; background-color: #6F99E6; color: #fff;}

/*支払いのアイコン*/
.h-plan-txt-payicon {display: inline-block;}
.h-plan-txt-payicon .payment > span {color: #1977D1;}
.h-plan-txt-payicon .payment img {margin-right: 5px;}

/* 部屋の特徴 */
.clear-both {clear: both;}

/*部屋一覧
********************************************************/
.hd-block-link {margin-bottom: 15px;}
.room-section {background-color: #3E3A39; padding: 3.5%; display: block;    }

.room-section .room-list {position: relative; display: block; overflow: hidden; background-color: #fff; padding: 1.6% 2%; border-bottom: 1px solid #C0C0C0; text-decoration: none;}
.room-section .room-list:hover {text-decoration: none; background-color: #FFF7F7; }
.room-section .room-list .room-list-pic {float: left; width: 10%; margin-right: 1.2%;}
.room-section .room-list .room-list-pic img {width: 100%;}
.room-section .room-list dt {font-size: 1.8rem; font-weight: bold; margin-bottom: 5px; color: #734B3E;}
.room-section .room-list .room-list-prc {margin-right: 35px; font-size: 2.1rem; color: #F50057; font-weight: bold; margin-bottom: 5px; float: right;}
.room-section .room-list .room-list-prc .ohh-price span{font-size: 1.3rem;font-weight: normal;}
.room-section .room-list dl {overflow: hidden;}
.room-section .room-list dl .h-point {margin-top: 5px; margin-left: 5px;}
.room-nokori {background-color: #F50057; color: #fff; font-size: 1.3rem; padding: 2px 8px; margin-left: 15px;}
.room-section .room-list .arrow-fcr {margin-top: -5px;}

.room-section .room-block .tgl_list{display: none;}
.room-section .plan_btn{text-align: center; margin-top: 10px; cursor: pointer; color: #fff; font-size: 1.5rem; font-weight: bold;}

.room-section .room-list .event-list-pic {margin-bottom:5px;}
/*地図*/
.gmap-set {height: 450px;}

/*基本情報*/
.facility-tbl {margin-bottom: 30px;}
.facility-tbl th {background-color: #F2F2F2; width: 25%;}


/*お気に入り*/
.func-tuika:before {
    content: "\f006";
    font-family: FontAwesome;
    margin-right: 4px;
    font-size: 1.8rem;
}
.func-kaizyo:before {
    content: "\f005";
    font-family: FontAwesome;
    margin-right: 4px;
    font-size: 1.8rem;
}

.favorite-func {cursor: pointer; background-color: #E4E9EB; padding: 5px 10px; border-radius: 4px; }
.favorite-func.tuika {background-color: #546E7A; color: #fff;}

.favorite-func .func-kaizyo {display: none;}
.favorite-func .func-tuika {display: block;}

.favorite-func.tuika .func-kaizyo {display: block;}
.favorite-func.tuika .func-tuika {display: none;}

/*部屋詳細モーダル
********************************************************/
.modal-room-info-detail .modal-header {background-color: #F7F0E6;}
.modal-room-info-detail .modal-header h4{font-weight: bold; font-size: 1.5rem;}
.modal-room-info-detail .h-point .r-type,
.modal-room-info-detail .h-point .r-feature {margin-bottom: 5px;}
.h-info-detail .modal-footer,
.modal-room-info-detail .modal-footer {text-align: center;}
.modal-room-info-detail .slider-control {height: 40px!important;width: 32px!important;background-color: #fff;margin-left: 0;position: absolute;top: 25%;opacity: .7;border: 0;padding: 0;cursor: pointer;}
.modal-room-info-detail .slider-control-prev {left: 3px;}
.modal-room-info-detail .slider-control-next {right: 3px;}

.modal-room-info-detail .flickscroll {margin: 0 auto;width: 327px;height: 230px;text-align: left;position: relative;overflow: hidden;cursor: pointer;}
.modal-room-info-detail .flickscroll ul {top: 0;left: 0;height: 230px;position: absolute;overflow: hidden;}
.modal-room-info-detail .flickscroll ul li {width: 327px;height: 230px;float: left;display: inline;overflow: hidden;}
.modal-room-info-detail .flickscroll ul li img{width: 327px;height: 230px;}

.modal-room-info-detail .flickthumb {margin: 10px auto;width: 327px;text-align: center;}
.modal-room-info-detail .flickthumb ul {width: 327px;}
.modal-room-info-detail .flickthumb ul li {width: 74px;height: 50px;float: left;cursor: pointer;display: inline;}
.modal-room-info-detail .flickthumb ul li.active {filter:alpha(opacity=100)!important;-moz-opacity: 1!important;opacity: 1!important;}
 
.modal-room-info-detail .flickscroll ul:after,
.modal-room-info-detail .flickthumb ul:after {content: ".";height: 0;clear: both;display: block;visibility: hidden;}
.modal-room-info-detail .flickscroll ul,
.modal-room-info-detail .flickthumb ul {display: inline-block;overflow: hidden;}

/*プラン詳細　口コミレビュー
********************************************************/

#kutchikomi {height: 100%;}
#kutchikomi .modal-dialog {height: 90%;}
#kutchikomi .modal-content {height: 500px;}
#kutchikomi #article {overflow: auto; height: 400px;}
#kutchikomi .modal-title {font-size: 2rem;font-weight: bold;}
#kutchikomi .kuchikomi-detail .kuchikomi-rank {font-size: 1.7rem;}
#kutchikomi .kuchikomi-detail .kuchikomi-rank {font-size: 1.7rem;}
#kutchikomi .kuchikomi-detail dd {padding: 1% 0 2%;border-bottom: 1px dotted #ccc;margin-bottom: 2%;}
#kutchikomi .kuchikomi-detail dd .user-name {margin-top: 1%;text-align: right;}

/*プラン詳細
********************************************************/
.p-detail-head .p-detail-body {border: 1px solid #dddddd; padding: 3%;}
.p-detail-head .p-detail-body .h-plan-ttl {margin-bottom: 0;}

.p-detail-main {border-right: 1px solid #ddd; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.p-detail-main .article { border-right: 1px solid #ddd;}

/*プラン詳細　プラン情報
********************************************************/
/*メインエリア プラン*/

/*メイン画像*/
.p-detail-main .p-detail-plan .pic-main {padding: 5% 7%; text-align: center;}
.p-detail-main .p-detail-plan .pic-main li {display: none;}
.p-detail-main .p-detail-plan .pic-main li img {width: 100%;}
.p-detail-main .p-detail-plan .pic-main li:first-child {display: inline-block;}

/*サムネイル*/
.p-detail-main .p-detail-plan .pic-sum {padding-left: 10%; margin-bottom: 5%; overflow: hidden;}
.p-detail-main .p-detail-plan .pic-sum li {height: 70px; border: 1px solid #E7E7E7; margin-bottom: 10px; margin-right: 10px;  width: 100px; cursor: pointer;  float: left; background-color: #F8F8F5; overflow: hidden;}
.p-detail-main .p-detail-plan .pic-sum li img {width: 100%;}

.p-detail-main .p-detail-plan .txt {padding-right: 5%; padding-left: 5%; margin-bottom: 5%; word-wrap:break-word;}

.p-detail-plan .h-plan-txt-payicon {margin: 1% 5%;}

.p-detail-plan .p-detail-cxl {font-size: 1.3rem;}
.p-detail-plan .p-detail-etc {background-color: #EEE;font-size: 1.5rem;font-weight: bold;margin-bottom: 1%;padding: 1.5%;}
.p-detail-plan .dl-cancel-policy dt {border-right: 1px solid #eee;float: left;font-weight: normal;margin-right: 1%;padding: 1.5%;width: 40%;text-align: left;}
.p-detail-plan .dl-cancel-policy dd {border-bottom: 1px solid #eee;padding: 1.5% 0 0;margin-left: 0;}

/*プラン詳細　お部屋情報
********************************************************/
.p-detail-room,.p-detail-map {padding: 5%;overflow: hidden;}

.p-detail-room .pic-main li {display: none;}
.p-detail-room .pic-main li img {width: 100%;}
.p-detail-room .pic-main li:first-child {display: inline-block;}

.p-detail-room .pic-sum {text-align: center; margin-bottom: 5%; overflow: hidden; padding-top: 10px; padding-bottom: 10px;}
.p-detail-room .pic-sum li {height: 50px; border: 1px solid #E7E7E7; margin-bottom: 10px; margin-right: 10px;  width: 74px; cursor: pointer;  float: left; background-color: #F8F8F5; overflow: hidden;}
.p-detail-room .pic-sum li:nth-child(4n) {margin-right: 0;}
.p-detail-room .pic-sum li img {max-width: 100%;}

.p-detail-room dl dt {margin-bottom: 3%;}
.p-detail-room dl dd {word-wrap: break-word; margin-bottom: 6%;}
.p-detail-room table {clear: both;}

.ameni-tble {font-size: 1.2rem; margin-bottom: 0;}
.ameni-tble td {width: 33.33%;}

.p-detail-map p.txt {margin-top: 5%;}

/*右の予約条件
********************************************************/
.ext-contents-wrapper {}
.rsv-terms { padding-bottom: 2%; padding-top: 20px;}
.rsv-terms h2 {font-size: 1.8rem; padding-bottom: 5%;  border-bottom: 1px solid #ddd; margin-bottom: 3%; padding-left: 15px;}
.rsv-terms-re {float: right; margin-top: -5px;}
.rsv-terms dl {padding-bottom: 3%; margin-bottom: 3%; border-bottom: 1px dotted #ddd; overflow: hidden;}
.rsv-terms dl dd span {font-size: 2.0rem; font-weight: bold; margin-left: 5px;}
.rsv-terms dl dd {font-size: 1.5rem;}

.rsv-terms dl.r-bed {border-style: none;padding-bottom: 1%;margin-bottom: 0;}
.rsv-terms dl.r-bed dd p {padding: 2px 0 2px 0;}
.rsv-terms .r-bed-str {font-size: 1.2rem;padding-bottom: 3%; margin-bottom: 3%; border-bottom: 1px dotted #ddd; overflow: hidden;color: red;}

.rsv-terms-prc {background-color: #F8F8F8; padding: 5%;}
.rsv-terms-prc p {text-align: right; font-size: 1.4rem;}
.rsv-terms-prc p span {font-size: 2.1rem; color: #F50057; margin-left: 8px;}


#rsv-error {color: #FF0000; padding: 3% 3% 0; display: block;}
#rsv-error:before {
    content: "\f071";
    font-family: FontAwesome;
    margin-right: 4px;
    font-size: 1.8rem;
}

#rsv-error-estimate {text-align: center; padding-top: 15px; border-bottom: 1px dotted #C0C0C0; margin-bottom: 15px; padding-bottom: 15px;}
#rsv-error-estimate .rsv-terms-re {float: none; margin-top: 0; display: inline-block;}

/*見積りテーブル
********************************************************/
#terms-calendar {margin-bottom: 20px;}
#terms-calendar table {border: 1px solid #ddd; width: 100%;}
#terms-calendar table td,
#terms-calendar table th {border: 1px solid #ddd; text-align: center; padding: 5px;}
#terms-calendar table td.hit {background-color: #FFFF6F; box-shadow: 0 0 5px rgba(100,100,100,.4) inset;}
#terms-calendar table td {cursor: pointer; height: 80px; width: 96px;}
#terms-calendar table td .prc {font-weight: bold; display: block; color: #F7216B;}
#terms-calendar table td:hover {background-color: #FFFF6F;}

/*空き室無し*/
#terms-calendar table td.none {cursor: default; background-color: #EFEFEF; height: 80px;}
#terms-calendar table td.none:hover {background-color: #EFEFEF;}
#terms-calendar table td.none .prc,
#terms-calendar table td.none .status {
    color: #555;
}


/*見積り条件
********************************************************/
#terms-calendar-paging {overflow-x: hidden; text-align: center; padding-bottom: 12px; padding-top: 5px;}
#terms-calendar-paging .lt {float: left;}
#terms-calendar-paging .rt {float: right;}
#terms-calendar-paging .cr {display: inline-block; font-size: 1.8rem; font-weight: bold;}

#terms-calendar-paging .lt span,
#terms-calendar-paging .rt span {background-color: #F0F0EE; border-radius: 5px; padding: 5px 10px; cursor: pointer;}

/*ページ送り押せる時*/
#terms-calendar-paging .lt.more span,
#terms-calendar-paging .rt.more span {background-color: #0066CC; color: #fff;}
#terms-calendar-paging .lt.more span:hover,
#terms-calendar-paging .rt.more span:hover {background-color: #0078F0; color: #fff;}

#terms-set-detail {overflow: visible;}
#terms-set-detail ul {overflow: visible;}
#terms-set-detail ul li {width: 25%; text-align: center; float: left; box-shadow: 1px 0 0 0 #ddd; font-size: 1.6rem; padding-bottom: 10px; padding-top: 5px;}
#terms-set-detail ul li .ttl {font-weight: bold;}
#terms-set-detail ul li .d-numu {display: block; margin: 4px 0;}
#terms-set-detail ul li .d-numu span {font-size: 2.5rem;font-weight: bold;}
#terms-set-detail ul li [class*='cng-'] {background-color: #0066CC; display: inline-block; border-radius: 3px; padding: 2px 0; width: 30px; font-size: 1.7rem; font-weight: bold; color: #fff; cursor: pointer; margin: 0 3px;}

#terms-set-detail ul li [class*='cng-']:hover {background-color: #0078F0;}

/*off設定*/
#terms-set-detail ul li [class*='cng-'].btn-off {background: none repeat scroll 0 0 #e1e1e1;color: #999999;cursor: default;}

/*modalフッター*/
#modal-footer {padding-bottom: 20px; text-align: center; border-top: 1px solid #ddd; padding-top: 20px;}
#modal-footer p {display: inline-block; margin: 0 10px;}


/*type
**********************************/
.mainvis-area.mainvis-type .txt { background-color: rgba(35,24,21,.8); text-align: center; color: #fff; padding: 30px 50px; position: absolute; top: 50%; left: 50%; margin-left: -310px; margin-top: -100px;}
.mainvis-area.mainvis-type .txt h2 {font-size: 3.7rem; margin-bottom: 20px;}
.mainvis-area.mainvis-type .txt p {font-size: 1.5rem;}
.type-list li {margin-bottom: 10px;}



/*rank
**********************************/
.mainvis-area.mainvis-rank .txt { background-color: rgba(92,107,192,.8); text-align: center; color: #fff; padding: 30px 50px; position: absolute; top: 50%; left: 50%; margin-left: -310px; margin-top: -120px;}
.mainvis-area.mainvis-rank .txt h2 {font-size: 3.7rem; margin-bottom: 20px;}
.mainvis-area.mainvis-rank .txt p {font-size: 1.5rem;}


/*サムネイル*/
.rank-sum {overflow-x: hidden; padding-bottom: 3%;}
.rank-sum li a {padding: 3%; background-color: #B0BFC6; font-size: 1.2rem; font-weight: normal; color: #fff; display: block; overflow-x: hidden;}
.rank-sum li a img {float: left; margin-right: 10px;}
.rank-sum li a span {font-size: 1.6rem; font-weight: bold; display: block; padding-top: 10px;}
.rank-sum li:hover a {text-decoration: none; opacity: .9;}
.rank-sum li:first-child a {background-color: #80CBC4;}
.rank-sum li:last-child a {background-color: #93C8E8;}


/*rank--swiper
**********************************/
.rank-ttl {background-color: #E0F2F2; padding: 2% 0; text-align: center;  font-size: 2.4rem; font-weight: bold; color: #26A69A;}
.rank-ttl span {display: block; background-color: #80CBC4; padding: 5px 0; width: 300px; margin: 10px  auto 0 auto; font-size: 1.2rem; font-weight: normal; color: #fff;}

.rank-ttl.rank-ttl-naha {background-color: #ECEFF1; color: #78909C;}
.rank-ttl.rank-ttl-naha span {background-color: #78909C;}
.rank-ttl.rank-ttl-iih {color: #2888C1; background-color: #DDEEF9;}
.rank-ttl.rank-ttl-iih span {background-color: #2888C1;}

.rank-swiper {border-bottom: 1px solid #ddd;}
.rank-swiper .link-box {display: block; width: 400px; text-align: center; border-right: 1px solid #ddd; padding: 6%;}
.rank-swiper .link-box:hover  {text-decoration: none;}
.rank-swiper .link-box img {width: 100%; display: block; margin-bottom: 5px;}
.rank-swiper .link-box dl {padding-top: 10px; clear: both;}
.rank-swiper .link-box dd {text-align: left;}
.rank-swiper .link-box dt {font-size: 1.2rem; font-weight: normal; border-bottom: 1px solid #ddd; margin-bottom: 15px; padding-bottom: 15px;}
.rank-swiper .link-box dt span {display: block; font-weight: bold; font-size: 1.8rem;}

.rank-swiper .link-box .img-wrapp {position: relative;}
.rank-swiper .link-box .rank-icon {float: left;}
.rank-swiper .link-box .rank-area {float: right; font-size: 1.1rem;}
/*ランクラベル*/
.rank-swiper .link-box .rank-icon { position: absolute;  bottom: -15px; left: 15px;}
.rank-swiper .link-box .rank-icon span {background-color: #FF7044; position: relative; width: 40px; height: 50px; display: block; color: #fff; line-height: 40px;}
.rank-swiper .link-box .rank-icon span:before{
content: "";
position: absolute;
bottom: 0px;
right: 0;
border: 20px solid transparent;
border-bottom: 10px solid #fff;
}
/*.rank-point ul {overflow-x: hidden;}*/
.rank-point li {float: left; width: 50%; margin-bottom: 15px;}
.rank-point li span {border-radius: 50%; display: table-cell; height: 40px; width: 40px; background-color: #90A4AD; text-align: center; vertical-align: middle; color: #fff;font-size: 1.3rem;}
.rank-point li p {display: table-cell; vertical-align: middle;}
.rank-point li p i:first-child {margin-left: 5px;}
.rank-point li p i {font-size: 2.1rem; font-weight: normal;}

/*airport
**********************************/
.airport h2 {text-align: center; font-size: 2.0rem; padding-top: 10px; padding-bottom: 30px; font-weight: bold;}
.airport .row div {border-left: 1px solid #ddd; padding-bottom: 5%;}

.airport .row dd {padding-bottom: 20px;}
.airport .row dt img {max-width: 100%; }
.airport .row div dt {padding: 100px 0 84px 0; text-align: center; }
.airport .row div:last-child dt {padding: 0 0 30px;}





/*airport
**********************************/
.station-nav {background-color: #F2F2F9; margin-bottom: 2%; overflow-x: hidden;  padding-top: 25px; padding-bottom: 10px;}
.station-vis img {max-width: 100%;}
.station-vis h3 {font-size: 3.0rem; text-align: center; padding-bottom: 2%;}
/*リスト*/
.station-list dl dt {text-align: center; font-size: 2.0rem; padding-top: 15px;}
.station-map {height: 640px;}


/*area
**********************************/
.m-a-area { text-align: center;}
.m-a-area .txt {padding-top: 60px; color: #fff;}
.m-a-area .txt h2 {font-size: 4.0rem; text-shadow: 0 0 1px rgba(0,0,0,.2); margin-bottom: 15px;}
.m-a-area .txt p {font-size: 1.8rem; text-shadow: 0 0 1px rgba(0,0,0,.2);}


/*タイトル*/
.area-hd-ttl {padding: 1% 0 3%;}
.area-hd-ttl h3 {text-align: center; font-size: 2.4rem; }
.area-hd-ttl h3 span {color: #fff; background-color: #C0C0C0; display: block; padding: .3% 0; width: 200px; margin: 5px auto 0; font-size: 1.3rem;}

.area-hd-ttl.area-hd-nor h3 {color: #00BFA5;}
.area-hd-ttl.area-hd-nor h3 span {background-color: #00BFA5;}
.area-hd-ttl.area-hd-cen h3 {color: #F58A00;}
.area-hd-ttl.area-hd-cen h3 span {background-color: #F58A00;}
.area-hd-ttl.area-hd-sou h3 {color: #1E88E5;}
.area-hd-ttl.area-hd-sou h3 span {background-color: #1E88E5;}
.area-hd-ttl.area-hd-isl h3 {color: #01897B;}
.area-hd-ttl.area-hd-isl h3 span {background-color: #01897B;}

/*エリア地図*/
.area-info {margin-bottom: 3%;}
.area-info .txt {padding-top: 7%;}
.area-info .txt dt { font-size: 1.6rem; font-weight: bold; margin-bottom: 6%;}
.area-info .txt dd {font-size: 1.4rem; line-height: 1.5; padding-bottom: 3%;}

.area-link li {position: absolute;}
.area-link li.hokubu {left: 62%;top: 35%;background-color: #00BFA5;}
.area-link li.chubu {left: 60%;top: 60%;background-color: #F58A00;}
.area-link li.nanbu {left: 57%;top: 77%;background-color: #1E88E5;}
.area-link li.ritou {background-color: #01897B;}
.area-link li.miyako {left: 33%;top: 40%;}
.area-link li.ishigaki {left: 30%;top: 65%;}
.area-link li.kumejima {left: 46%;top: 65%;}
.area-link li.iejima {left: 50%;top: 45%;}
.area-link li.kerama {left: 40%;top: 82%;}
.area-link li.ritousp {left: 15%;top: 60%;}

/*中四国エリア*/
.area-link li.okayama {left: 37%;top: 70%;}
.area-link li.kagawa {left: 37%;top: 73%;}
.area-link li.ehime {left: 36%;top: 74%;}

.area-link li a {padding: 3px 20px;font-size: 1.6rem;font-weight: bold;display: block;color: #FFF;}
.area-link li a:hover {text-decoration: none;}

.area-info-nor {background-color: #ECFFFE;}
.area-info-nor .txt dt {color: #00BFA5;}

.area-info-cen {background-color: #FFFDE7;}
.area-info-cen .txt dt {color: #F58A00;}

.area-info-sou {background-color: #E1F5FE;}
.area-info-sou .txt dt {color: #1E88E5;}

.area-info-isl {background-color: #ECFEFE;}
.area-info-isl .txt dt {color: #01897B;}

/*エリア　スポット*/
.area-info-spot .inner {padding-bottom: 2%; margin-bottom: 2%; border-bottom: 1px dotted #ddd; overflow: hidden;}

.area-info-spot .pic {margin-bottom: 3%;}
.area-info-spot .pic img {width: 100%; border-radius: 3px;}
.area-info-spot .txt dt {font-size: 2.7rem; margin-bottom: 1.6%; color: #FF6E40;}
.area-info-spot .txt dd.ttl {font-size: 1.5rem; margin-bottom: 1.6%; font-weight: bold; color: #A1769F;}
.area-info-spot .txt dd {font-size: 1.4rem; }
.area-info-spot .btn-box {padding-top: 3%;}
.area-info-spot .btn a.btn--lg {width: 100%;}



/*一覧：マップタイプ
**********************************/
.map-view .spot-detail {border-bottom: 1px solid #ddd; padding: 2%; overflow: hidden; box-shadow: 0 0 3px rgba(180,180,180,.8);}
.map-view .spot-detail .spot-detail-img {float: left; width: 38%; margin-right: 2%;}
.map-view .spot-detail .spot-detail-img img {width: 100%;  display: inline-block;}
.map-view .spot-detail dt {font-size: 2.0rem; padding-bottom: 2%; padding-top: 2%;}
.map-view .spot-detail dd {font-size: 1.4rem; line-height: 1.4;}

.map-view .box-map {}
.map-view .box-map .map-reload {margin:2% auto 3%;}
.map-view .box-map .map-reload i {margin-right:7px;}
.map-view .map-view-set,
.map-view .box-plan {height: 800px; }
.map-view .box-plan {overflow: auto; height: 800px; position: relative;}

.no-gutter > [class*='col-'] {padding-right:0;padding-left:0;}
.map-view .search-hotel-list .block-link .pic {width: 16%;}
.map-view .search-hotel-list .block-link {padding-top: 2%;}
.map-view .search-hotel-list .block-link .box-rt {width: 82%; float: left;}
.map-view .search-hotel-list .block-link .box-rt .txt {width: 65%;}
.map-view .search-hotel-list .block-link .box-rt .prc {width: 29%;}


/*アプリケーションエラー
**********************************/
.error-info {color: #F4511E;text-align: center;background-color: #f7eaea;border: 1px solid #EBCCD1;padding: 15px;margin: 30px 0;border-radius: 4px}
.error-ttl {font-weight: bold;font-size: 2.8rem;margin-bottom: 10px;}
.error-ttl:before {content: " \f071";font-family: FontAwesome;margin-right: 7px;}
.error-info .btn {margin-top: 20px;}


/*スタッフブログ
**********************************/
.staffblog-hd-ttl {padding: 1% 0 5%;}
.staffblog-hd-ttl h2 {font-size: 2.8rem;text-align: center;color: #00C853;}
.staffblog-hd-ttl span {background-color: #00C853;color: #fff;display: block;font-size: 1.3rem;margin: 5px auto 0;padding: 0.3% 0;width: 250px;}

.staffblog-list {padding-bottom: 5%;}
.staffblog-list .blogEnt-list {border-bottom: 1px solid #ccc;display: block;margin-bottom: 30px;}
.staffblog-list .blogEnt-list a {color: #717171; display: block;padding-bottom: 30px;}
.staffblog-list .blogEnt-list a:hover {opacity: 0.7; color: #717171;text-decoration: none;}
.staffblog-list .blogEnt-list .staffblog-img {margin-bottom: 10px;}
.staffblog-list .blogEnt-list .staffblog-img img {width: 100%;}
.staffblog-list .blogEnt-list dl dt {font-weight: bold;font-size: 2.0rem;}
.staffblog-list .blogEnt-list dl dd.blogDate {font-size: 1.2rem;margin: 10px 0 20px;}
.staffblog-list .blogEnt-list dl dd.blogDate span {margin-left: 7px;}

.paginat-w {position: relative;overflow: hidden;padding-bottom: 30px;}
.paginat-w .paginat {position: relative;left: 50%;float: left;}
.paginat-w .paginat li {position: relative;left: -50%;float: left;}
.paginat-w .paginat li a, .paginat-w .paginat li {color: #858585;}
.paginat-w .paginat .current.num {background-color: #00c853;border: 1px solid #00C853;}

/*スタッフブログサイド*/
.blogReceLi, .blogCateLi {margin-bottom: 50px;}
.staffblog-side .blogSidTtl {font-size: 1.6rem;font-weight: bold;margin-bottom: 5px;}
.staffblog-side .blogEntLi li {border-bottom: 1px dotted #ccc;}
.staffblog-side .blogEntLi li:before {content: " \f105";font-family: FontAwesome;margin-right: 7px;float: left;position: relative;top: 12px;}
.staffblog-side .blogEntLi li:hover {background-color: #EAFFF3;}
.staffblog-side .blogEntLi li a {display: block;overflow: hidden;padding: 5% 0;color: #717171;}
.staffblog-side .blogEntLi li a:hover {color: #717171;}

/*カテゴリ一覧タイトル・ブログ記事タイトル*/
.blogCat-ttl, .blogEnt-ttl {border-color: #ccc;border-style: solid;border-width: 1px 0;padding: 15px 0;margin-bottom: 30px;}
.blogCat-ttl p, .blogEnt-ttl p {font-size: 1.8rem;padding-left: 2%;}

/*ブログ記事詳細*/
.blogEntdate , .blogEntCate {float: right;padding-bottom: 25px;}
.blogEntdate {margin-right: 10px;}
.blogEntBody {padding: 4%;border-bottom: 1px solid #ccc;margin-bottom: 30px;}
.blogEntBody img {margin-bottom: 20px;width: 100%;}
.blogEntBody p {font-size: 1.4rem;line-height: 1.7;}

.paginat-w {overflow: hidden;padding-bottom: 30px;}
.paginat-w .paginat02 {overflow: hidden;}
.paginat-w .paginat02 li a {border-radius: 4px;-webkit-border-radius: 4px;-moz-border-radius: 4px; padding: 8px 15px;border: 1px solid #ddd;display: inline-block;}
.paginat-w .paginat02 li a, .paginat-w .paginat02 li {color: #858585;}
.paginat-w .paginat02 li a:hover {background-color: #E8EAEA; text-decoration: none;}
.paginat-w .paginat02 .previous {float: left;}
.paginat-w .paginat02 .next {float: right;}

/*サポート
**********************************/
.mainvis-suport {background-color: #3FC4FF;}
.mainvis-suport {padding-top: 3%; padding-bottom: 3%;}
.mainvis-suport .pic {text-align: center; display: none;}
.mainvis-suport .pic img {max-width: 100%;}
.mainvis-suport .txt h2 {font-size: 2.7rem; margin-bottom: 2%;line-height: 1.5;}
.mainvis-suport .txt p {font-size: 1.4rem;line-height: 2; max-width: 700px; display: inline-block;}
.mainvis-suport .txt {color: #fff; padding-top: 2%; width: 100%; text-align: center;}

.suport-conts {margin-bottom: 5%;}

.suport-w, .suport-tel, .suport-mail {background-color: #FFFDE8;}
.suport-w {padding: 3% 3.5% 0;}
.suport-tel, .suport-mail {padding: 6.5% 5%;}
.suport-conts .icon-ttl {color: #039BE6;text-align: center;margin-bottom: 5%;}
.suport-conts .icon-ttl h2 {font-size: 2.5rem;margin-top: 2%;padding-bottom: 2%;}
.suport-conts .icon-ttl p {background-color: #039BE6;font-size: 3rem;line-height: 40px;height: 50px;width: 50px;margin: 0 auto;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;}
.suport-conts .suport-tel .icon-ttl p {line-height: 45px;}
.suport-conts .icon-ttl .fa {color: #fff;}

.suport-conts-main .qa-cat-ttl, .suport-conts-main h3 {font-size: 2rem;padding-bottom: 15px;border-bottom: 1px solid #dcdddd;margin-bottom: 20px;font-weight: normal;}
.suport-conts-main .qa-cat {padding: 0;overflow: hidden;margin-bottom: 40px;}
.suport-conts-main .qa-cat li {margin-bottom: 1%;text-align: center;padding: 0 5px;}
.suport-conts-main .qa-cat li a {font-size: 1.6rem;line-height: 50px;color: #039BE6;display: block;background-color: #E1F5FE;}

.suport-conts-main .qa-list {margin-bottom: 40px;}
.suport-conts-main .qa-list dt {color: #039BE6;font-size: 1.5rem;padding-bottom: 1%;cursor: pointer;font-weight: normal;}
.suport-conts-main .qa-list dt:hover {opacity: 0.7;}
.suport-conts-main .qa-list dt:before {content: " \f059";font-family: FontAwesome;margin-right: 7px;font-size: 2.2rem;position: relative;top: 2px;}
.suport-conts-main .qa-list dd {display: none;background-color: #FFF;padding: 4% 2%;margin: 0 0 15px 20px;}
.suport-conts-main .qa-list .point {color: #f50057;}

.suport-tel, .suport-mail {margin-bottom: 4%;}

.suport-tel .suport-mail-text {line-height: 1.7;padding-top: 2%;}
.suport-tel dt {color: #039BE6;font-weight: bold;font-size: 3.5rem;padding: 3% 0 1%;margin-bottom: 3%;border-bottom: 1px solid #dcdddd;text-align: center;}
.suport-tel dd {text-align: right;}

.suport-mail form {text-align: center;padding-top: 2%;}
.suport-mail input, .suport-mail textarea {margin-bottom: 2%;}
.suport-mail .btn {width: 80%; background-color: #26C7DB;font-size: 2rem;color: #FFF;box-shadow: 0 -2px 0 0 rgba(0,0,0,.2) inset;position: relative;margin-top: 10px;}
.suport-mail .btn:active {background-color: #26C7DB;box-shadow: none;top: 1px;}
.suport-mail .msg {font-size: 1.3rem;color: #cd5c5c;}

/*サポートメール*/
.user-contacts{margin-bottom: 50px;}
.user-contacts .page-head{background-color: #3FC4FF;text-align: center;position: relative;top: -11px;padding: 30px 0 20px;}
.user-contacts .page-head h2{color: #FFF;font-size: 2.7rem;line-height: 1.5;margin-bottom: 4%;margin: 0;}
.user-contacts .page-head p{color: #3FC4FF;background-color: #FFF;border-radius: 50%;font-size: 2.6rem;height: 45px;line-height: 43px;margin: 0 auto;width: 45px;}
.user-contacts .page-title i{margin-right: 5px;}
.user-mail{margin: 30px 0;}
.user-mail p{margin-bottom: 30px;font-size: 1.5rem;text-align: center;}
.user_mailbody .submit{text-align: center;}
.user_mailbody .btn{background-color: #26c7db;box-shadow: 0 -2px 0 0 rgba(0, 0, 0, 0.2) inset;color: #fff;font-size: 2rem;margin-top: 10px;position: relative;width: 80%;}
.mail-history{margin: 30px 0;}
.mail-history .page-title{margin-bottom: 30px;}
.msg-detail .panel-title{float: left;}
.msg-detail .panel-heading p{text-align: right;}
.msg-detail.usertype1{border-color: #d6e9c6;}
.msg-detail.usertype1 > .panel-heading{background-color: #dff0d8;border-color: #d6e9c6;color: #3c763d;}
.msg-detail.usertype2{border-color: #bce8f1;}
.msg-detail.usertype2 > .panel-heading{background-color: #d9edf7;border-color: #bce8f1;color: #31708f;}
.msg-detail.usertype3{border-color: #FCEB98;}
.msg-detail.usertype3 > .panel-heading{background-color: #FCF8E3;border-color: #FCEB98;color: #A4902A;}

/*予約問い合わせ*/
.flash-message {font-size: 1.8rem; font-weight: bold; color: #f00; margin-bottom: 20px;text-align: center;}
.select_body_area {width: 80%;margin: auto;}
.SumoSelect {width: 100%;}
.SumoSelect .SelectBox {text-align: left;}
.SumoSelect>.optWrapper.multiple>.MultiControls>p.btnOk {background-color: #11a911;color: #fff;font-weight: bold;}
.SumoSelect>.optWrapper.multiple>.MultiControls>p.btnCancel {background-color: #97a297;color: #fff;font-weight: bold;}
.SumoSelect .optWrapper .options .opt label {white-space: normal;}
#selectBody {margin: 15px 0;}
#selectBody p {text-align: left;margin-bottom: 0px;}
#selectBody .select-ttl {font-size: 1.8rem;border-bottom: solid 1px #5989cf;padding: 0 0 5px 0;font-weight: bold;}
#selectBody .input-text {font-weight:bold;margin-top: 10px;}
#selectBody .select-item-list {padding: 8px 0;border-bottom: solid 1px #5989cf;}
#selectBody .select-item-list .select-text {margin-bottom: 10px;}
#selectBody .select-item-list .body-area {margin-bottom: 10px;}
#selectBody .notes-text {padding: 1em;margin: 2em 0;color: #ff4a35;background: #ffebe9;border: solid 3px #ff7d6e;}
#selectBody .body-area::placeholder {color: #fb7070;}
#selectBody .body-area:-ms-input-placeholder {color: #fb7070;}/* IE */
#selectBody .body-area::-ms-input-placeholder {color: #fb7070;}/* Edge */


/*お知らせ　information
**********************************/
.news-hd-ttl {padding: 1% 0 5%;}
.news-hd-ttl h2 {font-size: 2.8rem;color: #717171;font-weight: bold;}

.news-list {padding: 2% 0 5%;}
.news-list .newsEnt-list li {border-bottom: 1px solid #ccc;display: block;margin-bottom: 30px;padding-bottom: 30px;}
.news-list .newsEnt-list li p.newsData {float: left;}
.news-list .newsEnt-list li span.newsCatIcon {background-color: #e1ceb3;padding: 3px 10px;margin-left: 15px;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;}
.news-list .newsEnt-list a {color: #717171;font-size: 1.4rem;overflow: hidden;display: block;padding-left: 20px;}
.news-list .newsEnt-list a:hover {opacity: 0.7; color: #F4511E;}

.news-list .paginat-w .paginat .current.num {background-color: #efefef;border: 1px solid #ddd;color: #717171;}

/*お知らせサイド*/
.news-list .staffblog-side .blogEntLi li:hover {background-color: #FEF4F0;}

/*カテゴリ一覧タイトル・お知らせ記事タイトル*/
.newsCat-ttl, .newsEnt-ttl {border-color: #ccc;border-style: solid;border-width: 1px 0;padding: 15px 0;margin-bottom: 30px;}
.newsCat-ttl p {font-size: 1.8rem;}

/*ブログ記事詳細*/
.newsEnt-ttl {padding: 20px 2% 15px;}
.newsEnt-ttl span.newsCatIcon {background-color: #717171;color:#fff;padding: 3px 10px;margin-left: 15px;border-radius: 2px;-webkit-border-radius: 2px;-moz-border-radius: 2px;}
.newsEnt-ttl .newsTtl {font-size: 1.8rem; padding: 2% 0 0;}
.newsEntBody {padding: 0 2% 4%;border-bottom: 1px solid #ccc;margin-bottom: 30px;}
.newsEntBody p {font-size: 1.4rem;line-height: 1.7;}

.newsBack {overflow: hidden;padding-bottom: 30px;}
.newsBack p {overflow: hidden;}
.newsBack p.back a {float: right;border-radius: 4px;-webkit-border-radius: 4px;-moz-border-radius: 4px; padding: 8px 15px;border: 1px solid #ddd;display: inline-block;}
.newsBack a {color: #858585;}
.newsBack a:hover {background-color: #E8EAEA; text-decoration: none;}


/*カレンダー
***************************/
.events {margin-bottom: 5%;}
.events-hd-ttl {padding: 1% 0 5%;}
.events-hd-ttl h2 {color: #717171;font-size: 2.8rem;font-weight: bold;}

.events {margin-top: 20px;}
.events .event-head {overflow: hidden; text-align: center;}
.events .event-head p {float: left;}
.events .event-head select {display: inline-block; width: auto; margin-left: 10px;}

.event-head {margin-bottom: 20px;}
.eventEndDay {font-size: 1.4rem;}
.link-prev {float: left; font-size: 1.4rem;}
.link-next {float: right; font-size: 1.4rem;}
.now-month {font-size: 1.6rem; text-align: center; font-weight: bold;}

table.eventMonthCalender {border: 5px solid #E1CEB3;width: 100%; background-color: #fff;}
table.eventMonthCalender td {border-bottom: 1px dotted #ccc;border-left: 1px dotted #ccc;padding: 5px;text-align: center;}

table.eventMonthCalender tr td.cel-day {width: 40px; text-align: center;}
table.eventMonthCalender td.event {text-align: left; }
table.eventMonthCalender td.event p {overflow: hidden;white-space: nowrap;text-overflow: ellipsis; width: 430px; margin-top: 5px;}
table.eventMonthCalender td.event p:first-child {margin-top: 0;}


table.eventMonthCalender td.sat {background-color: #e6f6fa;}
table.eventMonthCalender td.sun, table.eventMonthCalender td.holiday {background-color: #fae6f0;}
table.eventMonthCalender tr.today {background-color: #fffbdc;}
table.eventMonthCalender td.event span.holiday {display: block;font-size: 10px;}


.event-side-box {margin-bottom: 7%;}
.event-side-ttl {font-size: 1.6rem;font-weight: bold;margin-bottom: 10px;}

.event-side-list li {display: inline-block; margin-bottom: 5px;}
.event-side-list li a {display: inline-block; background-color: #E1CEB3; border: 1px solid #E1CEB3; color: #333; border-radius: 3px; padding: 5px 8px;}
.event-side-list li.hit a {background-color: #FF8040; border: 1px solid #FF8040; color: #fff;}
.event-side-list li a:hover {background-color: #FFC6AA; color: #333; text-decoration: none; border: 1px solid #FF8040;}

.event-side-list li.event-reset {margin-top: 5px; padding-top: 5px; border-top: 1px dotted #C0C0C0; display: block; text-align: right;}
.event-side-list li.event-reset a {background-color: #fff; border: 1px solid #fff; color: #333;}

.events-func li {float: right; margin-left: 5px;}
.events-func li a {display: block; background-color: #E1CEB3; color: #333; padding: 8px 15px; border-radius: 3px 3px 0 0; text-decoration: none;}
.events-func li a:hover {background-color: #D5BA95;}

.event-body dl {overflow: hidden; margin-bottom: 10px;}
.event-body dt {float: left; width: 100px; font-size: 1.6rem;}
.event-body dd {font-size: 1.6rem; padding-left: 100px; padding-bottom: 10px; border-bottom: 1px dotted #C0C0C0; margin-bottom: 10px;}
.event-map {height: 600px; border: 1px solid #C0C0C0; margin-top: 15px;}


/* ホテルガイド
***************************/
.hotelguide-hd-ttl {padding: 1% 0 2%;}
.hotelguide-area {padding-bottom: 5%;}
.hotelguide-area .nav-list .icn {top: 0;position: relative;background-color: #d9ecff;color: #0058B0;margin-bottom: 2%;}

/*エリア*/
.hotelguide-list {padding:0 0 5%;}
.hotelguide-list h3 {font-size: 2rem;padding-bottom: 15px;border-bottom: 1px solid #dcdddd;margin: 50px 0 20px;}

.hotelguide-box {padding: 2% 0;border-bottom: 1px dotted #dcdddd;overflow: hidden;}
.hotelguide-box .pic {width: 25%;float: left;}
.hotelguide-box .pic a {display: block;}
.hotelguide-box .pic a:hover {opacity: 0.8;}
.hotelguide-box .pic img {width: 100%;border-radius: 3px;-webkit-border-radius: 3px;-moz-border-radius: 3px;}
.hotelguide-box dt {margin-bottom: 15px;}
.hotelguide-box .hotelguide-name {font-size: 2rem;margin-bottom: 1%;}
.hotelguide-box span {padding: 1% 2%;font-size: 1.2rem;font-weight: normal;border-radius: 3px;-webkit-border-radius: 3px;-moz-border-radius: 3px;}
.hotelguide-box span.yes {color: #fff;background-color: #039BE6;}
.hotelguide-box span.no {background-color: #efefef;}
.hotelguide-box dl {padding-left: 2%;overflow: hidden;}

/*詳細*/
.hotelguide-detail {padding: 1% 0 5%;}
.hotelguide-detail h2 {padding: 1% 0 2%;text-align: left;}

.hotelguide-detail .info {text-align: center;margin-bottom: 5%;}
.hotelguide-detail .info img {width: 100%;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;}
.hotelguide-detail .info dl {overflow: hidden;margin: 20px 0;}
.hotelguide-detail .info dt {padding: 1% 2%;font-size: 1.4rem;border-radius: 3px;background-color: #EFEFEF;text-align: center;}
.hotelguide-detail .info dd {padding: 1% 2%;text-align: left;}


/*ログイン
***************************/
#page-login {background-color: #f9f9fb;}
#page-login .head {background-color: #456DB1; padding: 2% 5%; text-align: center; margin-bottom: 3%; margin-top: -3%;}
.common-layout #page-login .head {background-color: #456DB1; padding: 2% 5%; text-align: center; margin-bottom: 3%; margin-top: 0;}
#page-login .head .ttl {font-size: 3.6rem; color: #fff; margin-bottom: 1%;padding-top: 3%;}
#page-login .head .ttl + p {color: #fff; font-size: 1.6rem;}

#page-login .sign-sec {width: 700px; margin: 0 auto;}
#page-login .sign-sec .ttl {font-size: 1.8rem; font-weight: bold; margin-bottom: 5%;}

#page-login .sign-sec .box-inner {background-color: #fff; border-radius: 3px; padding: 5% 3%; margin-bottom: 3%;}

#page-login .sign-sec .col--row {overflow: hidden; margin: 0 20% 3% 20%;}
#page-login .sign-sec .col--row + .col--row {margin-bottom: 6%;}
#page-login .sign-sec .col--row dt {float: left; width: 120px;}
#page-login .sign-sec .col--row dd {overflow: hidden;}

#page-login .ttl-a {color: #144182; font-size: 1.5rem; font-weight: bold; border-bottom: 2px solid #144182; padding-bottom: 10px;}

#page-login .sign-sec .error-msg {margin-bottom: 5%;color: #f4511e;}
#page-login .sign-sec .menber-msg {margin-bottom: 3%; font-size: 1.6rem; color: #2D4DA2;}

#page-login .forgot-msg {margin-top: 25px; text-align: right;}
#page-login .sign-sec .dl-col-2 dt {width: 30%;}
#page-login .sign-sec .dl-col-2 dd {width: 70%;}

#page-login .btn-fbb {background-color: #212E9E; color: #fff; position: relative; border: none; box-shadow: 0 -3px 0 0 #182278 inset; }
#page-login .btn-fbb:hover, .btn-fbb:focus {background-color: #2432B0; color: #fff; }
#page-login .btn-fbb:active {background-color: #212E9E; color: #fff; box-shadow: none; top: 3px;}
#page-login .btn--lg {padding: 15px 0; text-align: center; font-size: 1.7rem; display: block; font-weight: bold; margin: 0 auto; width: 60%;}



/*非会員向けの予約確認・キャンセルページ
***************************/
.no-member-reserve {padding-top: 3%; padding-bottom: 3%;}
.nmr-box {padding-bottom: 3%; padding-left: 15px;}
.nmr-box dl {overflow: hidden;}
.nmr-box dt {float: left; width: 15%; padding-left: 10px;}
.nmr-box dd {padding-left: 15%; padding-bottom: 8px; margin-bottom: 8px; border-bottom: 1px dotted #D4D4D4;}

.nmr-box dd.r-bed span {padding: 2px 0 2px 0;}
.nmr-box dd.r-bed p {font-size: 1.2rem;padding: 6px 0 2px 0;color: red;}

.btn-wp {text-align: center; background-color: #F3F3F3; border-radius: 5px; padding: 15px 0;}
.nmr-box dd .prc-day {padding-bottom: 3%;}
.no-member-reserve-modal-footer {text-align: center;}
.no-member-reserve-modal-footer li {display: inline-block;}
.cancel-comp {text-align: center; padding: 5%;}
.cancel-comp h2 {font-size: 3.0rem; padding-bottom: 3%;}



.kanko-navi {float: right;}
.kanko-navi li {float: left; margin-left: 10px;}
.kanko-navi li a {background-color: #03a9f4; border-radius: 15px; padding: 5px 15px; color: #fff; display: block;}
.kanko-navi li a:hover {text-decoration: none; background-color: #0093D5;}



/*クーポンバナー
***********************************/
.fixed-bnr { position: fixed; bottom: -300px; left: 0; width: 100%; background-color: rgba(0,0,0,.8); padding: 10px 0 10px 0 ; z-index: 99;}
.fixed-bnr .inner {width: 1170px; margin: 0 auto;}
.fixed-bnr .inner img {width: 100%;}

.bx-wrapper .bx-viewport {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: none !important;
    left: 0 !important;
    background: #fff !important;
}
.bx-wrapper .bx-pager {text-align: center !important; width: 100%;}


.coupon-bnrs {padding-bottom: 40px; padding-top: 10px;}
.coupon-bnrs li {margin-bottom: 10px;}

.coupon-list li.coupon-close a{position: relative;display: block;cursor: default;}
.coupon-list li.coupon-close a img.end-img{position: absolute;left: 0px;top: 0px;}

/*クーポンLP
***********************************/
.coupon-lp .main-img img {width: 100%;}
.coupon-lp .cpn-ttl-cr {text-align: center; font-size: 34px; margin-bottom: 40px; margin-top: 40px;}

/*利用方法*/
.coupon-lp .riyou-container {clear: both;  overflow: hidden; background-color: #19D7A8;}
.coupon-lp .riyou-container .box-member  { width: 50%; float: left; position: relative; background-size: cover; background-color: #00A4EE;}
.coupon-lp .riyou-container .box-nonmember  {width: 50%; float: right; position: relative; background-size: cover;}

.coupon-lp .riyou-container .box-member .inner ,
.coupon-lp .riyou-container .box-nonmember .inner {width: 600px; margin: 0 auto; z-index: 2; position: relative;}

.coupon-lp .box-member {position: relative; z-index: 5;}
.coupon-lp .box-member {float: left; width: 50%; }

.coupon-lp .box-member h3,.coupon-lp .box-nonmember h3 {color: #FFF; text-align: center; font-size: 27px; margin-bottom: 20px;}
.coupon-lp .box-member h3 span ,.coupon-lp .box-nonmember h3 span {display: block; text-align: center; margin-bottom: 5px;}
.coupon-lp .box-member h3 span i ,.coupon-lp .box-nonmember h3 span i {font-size: 74px;}
.coupon-lp .box-member h3 + p ,.coupon-lp .box-nonmember h3 + p {color: #FFF; text-align: center; font-size: 16px; margin-bottom: 20px;}

.coupon-lp .box-member .inner,.coupon-lp .box-nonmember .inner {padding: 40px 30px 80px 30px;}

/*.coupon-lp .box-member form {background-color: #FFF; border-radius: 5px; padding: 0 0 0 20px; }*/
.coupon-lp .box-member form dl {margin-bottom: 30px;}
.coupon-lp .box-member form dt {clear: both; font-size: 18px; font-weight: normal; margin-bottom: 5px; padding-top: 20px; color: #FFF; }
.coupon-lp .box-member form dd {color: #FFF; font-size: 16px; margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px dotted #fff;}
.coupon-lp .box-member form .pos-rel {width: 180px; margin-right: 5px; display: inline-block;}
.coupon-lp .box-member form .cou-data {width: 80px; display: inline-block;}

.coupon-lp .box-member form dd .data-an {display: inline-block; width: 150px;}
.coupon-lp .box-member form dd .data-cl {display: inline-block; width: 140px;}
.coupon-lp .box-member form dd .data-rn {display: inline-block; width: 160px;}

.coupon-lp .box-member form dd .data-an span.ttl,
.coupon-lp .box-member form dd .data-cl span.ttl,
.coupon-lp .box-member form dd .data-rn span.ttl {
    display: inline-block;
    margin-right: 3px;
}
.coupon-lp .box-member form dd .data-an span.ttl.ttl-block,
.coupon-lp .box-member form dd .data-cl span.ttl.ttl-block
 {display: block;margin-bottom: 5px;}

.coupon-lp .box-member form dd .data-an select,
.coupon-lp .box-member form dd .data-cl select,
.coupon-lp .box-member form dd .data-rn select {
    width: auto;
    display: inline-block;
}

.coupon-lp .box-member form dd.erea input {width: 340px;}
.coupon-lp .box-nonmember .setbtn {margin-top: 50px;}
.coupon-lp .box-member form .setbtn ,.coupon-lp .box-nonmember .setbtn {text-align: center;}
.coupon-lp .box-member form .setbtn .btn , .coupon-lp .box-nonmember .setbtn .btn {width: 80%; font-size: 18px; padding: 15px 0; display: block; margin: 0 auto;}

.coupon-lp .box-member .childin-wp > div > div span {color: #444;width: 80%;text-align: left;font-size: 1.3rem;}


/*イベント画像
**************************/
.events-mainvis {text-align: center; margin-top: 15px; margin-bottom: 15px;}
.events-mainvis img {max-width: 100%;}
.events-detail {text-align: left; padding-top: 20px; padding-bottom: 40px;}
.events-detail > li {margin-bottom: 10px; font-size: 16px; padding-left: 15px; padding-right: 15px;  border-bottom: 1px dotted #ddd; padding-bottom: 10px;}
.events-detail > li:before {content: "●"; float: left; margin-right: 4px;}
.events-detail > li span {display: block; float: left; font-weight: bold; width: 130px; margin-right: 30px;}
.events-detail > li div {overflow: hidden;}

.events-detail.en > li span,
.events-detail.ko > li span,
.events-detail.zh-Hans > li span,
.events-detail.zh-Hant > li span {
    width: 230px;
}




/*20160217 nakamura*/
.kukou .airport-map img {width: 100%; margin-bottom: 3%;}
.comp-bnr {margin: 5% 0; text-align: center;}
.comp-bnr img {max-width: 100%;}


/* 20160316 nakamura トップオープン検索フィールド
*****************/
.opn-sh {}
.dep-field {position: absolute; top: 420px; right: 0; left: 0; z-index: 999; width: 1170px; margin: auto; background-color: rgba(255,255,255,1); box-shadow: 0 0 5px rgba(0,0,0,.4);}
.dep-field-inner {padding: 40px; overflow: hidden; position: relative;}
.dep-field-inner h3 {font-size: 2.7rem; color: #444; margin-bottom: 20px;}
.dep-field .box {float: left; width: 20%;}
.dep-field .box dl dt {font-size: 2.0rem; color: #444; margin-bottom: 10px;}
.dep-field .box dl dd li span{font-size: 1.6rem; color: #444; margin-bottom: 3px; cursor: pointer; padding-left: 7px;}
.dep-field .box dl dd li span:hover {color: #E9801A;}
.dep-field .box dl dd li span:before {content: "\f096 "; font-family: FontAwesome; margin-right: 3px; font-size: 2.3rem; vertical-align: middle;}
.dep-field .box dl dd li.hit span:before {content: "\f046 "; font-family: 'FontAwesome';}
.dep-field .box dl dd li.hit {background-color: #F67120; border-radius: 4px;}
.dep-field .box dl dd li.hit span {color: #fff;}

.dep-field .box dl dd .tikaku li span:after {content: "近く";}

.dep-field.mobile {position: fixed; top: 0; left: 0; right: 0; bottom: 0;background-color: rgba(255,255,255,.9); width: 90%; height: 90%; overflow: scroll;}
.dep-field.mobile .box {width: auto; float: none; margin-bottom: 15px;}
.dep-field.mobile .box dl dd {overflow: hidden;}
.dep-field.mobile .box dl dd li {float: left; margin-bottom: 0px; margin-right: 1px;padding-right: 8px}
.dep-field.mobile .box dl dd li span {; font-size: 1.2rem;}

.contact_email{
    border:#fff;
    color:#fff;
}

/* TOPお知らせモーダル
********************************/
#infoModal .modal-header {padding: 26px;}
#infoModal .modal-header .modal-title {font-size: 2rem;font-weight: bold;color: #f93a80;}
#infoModal .modal-body {padding: 26px;line-height: 2;color: #000;}

/* おきなわ彩発見対応（アイコン・テキスト）
********************************/
.discount-icon{
    margin-bottom: 7px;
}
.plan--point--list .discount-icon{
    float: right;
    margin-bottom: 0;
    margin-left: 5px;
    padding-right: 8px;
}
.discount-icon span{
    color: #FFF;
    background-color: #f75b00;
    -webkit-border-radius: 3px 0 0 3px;
            border-radius: 3px 0 0 3px;
    font-size: 11px;
    padding: 4px 5px 4px 6px;
    position: relative;
}
.plan--point--list .discount-icon span{
    font-size: 1rem;
    padding: 3px 5px;
    display: inline-block;
}
.discount-icon span:before,.discount-icon span:after{
    content: "";
    position: absolute;
    right: -6px;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent;
}
.discount-icon span:before{
    bottom: 0;
    border-width: 0 6px 10px 6px;
    border-bottom-color: #f75b00;
}
.discount-icon span:after{
    top: 0;
    border-width: 10px 6px 10px 6px;
    border-top-color: #f75b00;
}
.discount-icon.original-icon span{
    color: #131212;
    background-color: #f1e12b;
}
.discount-icon.original-icon span:before{
    border-bottom-color: #f1e12b;
}
.discount-icon.original-icon span:after{
    border-top-color: #f1e12b;
}

@media only screen and (min-width: 768px){
    .plan--point--list .discount-icon span{
        font-size: 1.2rem;
        padding: 5px 8px;
        display: block;
    }
    .plan--point--list .discount-icon span:before,
    .plan--point--list .discount-icon span:after{
        right: -8px;
    }
    .plan--point--list .discount-icon span:before{
        border-width: 0 8px 13px 8px;
    }
    .plan--point--list .discount-icon span:after{
        border-width: 13px 8px 0 8px;
    }
}

.discount-information{
    color: #F50057;
    text-align: center;
    margin: 15px 0;
}
.discount-information .discount-info-ttl{
    font-weight: bold;
    display: block;
}
.discount-info-search{
    text-align: left;
    color: #f50057;
    background-color: #FFF0F5;
    padding: 15px;
    border: 1px solid #F50057;
    -webkit-border-radius: 5px;
            border-radius: 5px;
}