@charset "UTF-8";
/* Scss Document */
/*color*/
/*font*/
/*layout*/
* { box-sizing: border-box; }

html { width: 100% !important; min-height: 100% !important; margin: 0px; padding: 0px; }

body { width: 100% !important; min-height: 100% !important; color: #333; margin: 0px 0px 0px 0px; /*padding: 343px 0px 0px 0px ;*/ /*デモ用（楽天ヘッダー分ずらし）*/ padding: 0px 0px 0px 0px; /*本番用*/ min-width: 1250px !important; overflow-x: hidden; }

/*----------------------------------------------------
	楽天パーツ
----------------------------------------------------*/
.rt-header { z-index: 1; }

#htlMainContent { /*padding: 343px 0px 0px 0px ;*/ /*デモ用（楽天ヘッダー分ずらし）*/ padding: 0px 0px 0px 0px; /*本番用*/ }

#htlContents { margin-left: 0; }

#htlContents #htlBrdCrmbs { margin: 0 auto; max-width: 1600px; width: 100%; }

#htlContents #htlHeader { margin: 0 auto; max-width: 1600px; width: 100%; }

#htlMainContent { width: 100%; float: none; margin-left: auto; margin-right: auto; }

#htlMainContent > div:first-child { margin: 0 auto; max-width: 1600px; }

div#RthCustomizeW { clear: both; width: 100%; margin: 0 auto 10px auto; padding: 0; }

/*左カラム*/
#htlSide-A { width: 1600px; min-width: 1190px; margin: 0 auto; float: none; display: block; position: relative; }

#htlRmSrch { margin-top: 0px; position: absolute; left: 0; z-index: 1; }

#upfrntPlans { position: absolute; left: 0; }

#htlSide-A #latest_cstm_review { position: absolute; left: 0; }

#htlSide-A .module-history-domsearch { position: absolute; left: 0; text-align: left; }

.rt-footer { z-index: 0 !important; }

/*----------------------------------------------------
	全体
----------------------------------------------------*/
.all { font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif; font-weight: 500; zoom: 100%; width: 100%; font-size: 15px; }
.all:after { content: ''; display: block; clear: both; }

.f_serif { font-family: "Times New Roman", 游明朝, "Yu Mincho", 游明朝体, YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", HiraMinProN-W3, "ＭＳ Ｐ明朝", "MS PMincho", serif; font-weight: normal; }

#contents { position: relative; }

.wrp { max-width: 1190px; margin-left: auto; margin-right: auto; }

.cf:after { content: ''; display: block; clear: both; }

/*----------------------------------------------------
	リンク
----------------------------------------------------*/
.all a { cursor: pointer; color: #333; text-decoration: none; }
.all a[href]:hover img { opacity: 0.6; }
.all a:active, .all a:hover, .all a:link, .all a:visited { color: #333; }

.all h2, .all h3, .all h4, .all h5 { color: #000; }

.btn_arw { margin-top: 50px; }
.btn_arw a { display: block; border: 1px solid #bfbfbf; width: 200px; height: 40px; margin-left: auto; margin-right: auto; border-radius: 3px; line-height: 40px; text-align: center; position: relative; }
.btn_arw a:after { content: ''; display: block; display: inline-block; width: 21px; height: 11px; margin-left: 10px; background: url("../com/arrow.png") no-repeat center center; background-size: contain; vertical-align: middle; transition: all 0.2s; }
.btn_arw a:hover { background-color: #bfbfbf; }
.btn_arw a:hover:after { transform: translateX(10px); }

/*----------------------------------------------------
	画像
----------------------------------------------------*/
img { border: 0; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; vertical-align: bottom; /* [disabled]margin: 0px 0px 0px 0px; */ }

/*----------------------------------------------------
	段落
----------------------------------------------------*/
body p { font-size: 15px; line-height: 2.1; }

body p a:link { font-size: 15px; line-height: 2.1; }

body p a:hover { font-size: 15px; line-height: 2.1; }

body p a:visited { font-size: 15px; line-height: 2.1; }

body p a:hover, body p a:active { font-size: 15px; line-height: 2.1; }

/*----------------------------------------------------
	ヘッダー
----------------------------------------------------*/
.head { background: url(hline_01.png); background-position: 0px 0px; background-repeat: no-repeat; margin-bottom: 30px; padding-top: 3px; display: block; }

.head h2 { width: 350px; margin: 50px 0px 0px 20px; float: left; }

.hset { width: 565px; height: 110px; margin: 0px 0px 0px 0px; float: right; text-align: right; display: block; }

.hset a { height: 30px; display: block; float: left; }

/*----------------------------------------------------
	.gnav	ナビ
----------------------------------------------------*/
.gnav ul { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; width: 100%; height: 60px; }
.gnav ul li { border-right: 1px solid #f8f8f8; flex-grow: 1; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; align-content: center; align-items: center; font-size: 18px; color: #bfbfbf; }
.gnav ul li:last-of-type { border-right: 0; }
.gnav ul li a { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; align-content: center; align-items: center; font-size: 18px; width: 100%; height: 100%; position: relative; }
.gnav ul li a[href]:after { content: ''; display: block; width: 0; height: 1px; background-color: #000; position: absolute; bottom: 10px; left: 0; right: 0; margin: auto; transition: all 0.5s; }
.gnav ul li a[href]:hover:after { width: 60px; }
.gnav ul li.hotel { background-color: #f8f8f8; }

#btm_nav { width: 800px; margin-bottom: 70px; }

#top_nav { margin-top: 50px; margin-bottom: 130px; }
#top_nav .gnav { width: 800px; }

#right_nav { right: -550px; top: 110px; width: 650px; position: fixed; padding-top: 50px; padding-bottom: 50px; transition: all 0.5s; z-index: 2; }
#right_nav:hover { right: 0; }
#right_nav .box { background-color: #FFF; border: 1px solid #e6e6e6; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; }
#right_nav .box .button { width: 100px; height: 100px; position: relative; }
#right_nav .box .button span { display: block; width: 40px; height: 1px; background-color: #666; position: absolute; margin: auto; left: 0; right: 0; top: 50%; }
#right_nav .box .button span:nth-child(1) { transform: translateY(-10px); }
#right_nav .box .button span:nth-child(3) { transform: translateY(10px); }
#right_nav .box .gnav { width: 550px; padding-top: 20px; }

#right_coupon { right: 0; top: 50px; width: 100px; height: 110px; position: fixed; z-index: 2; }
#right_coupon a { width: 100%; height: 100%; background-color: #000; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; color: #FFF; justify-content: center; align-content: center; align-items: center; transition: all 0.2s; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; font-size: 20px; line-height: 1.6; }
#right_coupon a:hover { background-color: #bfbfbf; }
#right_coupon .banner { padding: 0 20px; }
#right_coupon .banner img { max-width: 450px; margin-bottom: 20px; }
#right_coupon .banner img:last-child { margin-bottom: 0; }
#right_coupon .banner a:hover img { opacity: 1; }

#right_search { position: fixed; right: 0; top: 260px; width: 100px; height: 130px; z-index: 3; }
#right_search a { width: 100%; height: 100%; background-color: #666; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; color: #FFF; justify-content: center; align-content: center; align-items: center; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; transition: all 0.2s; font-size: 20px; }
#right_search a:hover { background-color: #bfbfbf; }

#right_plan { position: fixed; right: 0; top: 390px; width: 100px; height: 60px; z-index: 3; }
#right_plan a { width: 100%; height: 100%; border: 1px solid #e6e6e6; background-color: #fff; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; align-content: center; align-items: center; transition: all 0.2s; font-size: 16px; }
#right_plan a:hover { background-color: #bfbfbf; border-color: #bfbfbf; }

/*----------------------------------------------------
	メインコンテンツ
----------------------------------------------------*/
#main:after { content: "."; display: block; clear: both; height: 0; max-height: 0; visibility: hidden; }

.copy { width: 950px; margin: 20px 0px 30px 0px; }

.cont { margin: 120px 0px 0px 0px; }

/*----------------------------------------------------
	メインビジュアル
----------------------------------------------------*/
.mv { width: 1190px; margin-left: auto; margin-right: auto; position: relative; margin-top: 20px; }
.mv iframe { width: 1600px; height: 532px; margin-left: -205px; position: relative; z-index: 0; }
.mv h2 { margin-bottom: 20px; text-align: center; /*position: absolute;
z-index: 1;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);*/ }
.mv h2 span { display: block; font-size: 15px; margin-top: 10px; }

/*----------------------------------------------------
	導入
----------------------------------------------------*/
#lead { width: 800px; margin-left: auto; margin-right: auto; }
#lead h2 { font-size: 28px; text-align: center; line-height: 1.14; color: #666; margin-bottom: 110px; }
#lead h3 { text-align: center; margin-bottom: 40px; font-size: 28px; line-height: 1.6; }

/*----------------------------------------------------
	バナー
----------------------------------------------------*/
.bn_set { width: 950px; margin: 80px 0px 0px 0px; }

.bn_set .bn { width: 220px; margin-right: 23px; margin-bottom: 16.5px; float: left; }

/*----------------------------------------------------
	区切り線
----------------------------------------------------*/
.line { width: 100%; height: 1px; background-color: #e6e6e6; }

/*----------------------------------------------------
	並びボタン
----------------------------------------------------*/
ul.btn { margin-top: 50px; font-size: 0; text-align: center; }
ul.btn li { display: inline-block; margin-left: 20px; }
ul.btn li:first-child { margin-left: 0; }
ul.btn li a { font-size: 15px; border: 1px solid #bfbfbf; height: 40px; line-height: 40px; text-align: center; padding-left: 10px; padding-right: 10px; width: 200px; display: block; border-radius: 3px; transition: all 0.2s; }
ul.btn li a:hover { background-color: #bfbfbf; border: 1px solid #bfbfbf; }
ul.btn li.air a { background-color: #e6e6e6; border: 1px solid #e6e6e6; }
ul.btn li.air a:hover { background-color: #bfbfbf; border: 1px solid #bfbfbf; }

/*----------------------------------------------------
	プラン
----------------------------------------------------*/
#plan { margin-top: 40px; margin-left: auto; margin-right: auto; width: 800px; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; }
#plan .info { padding: 0px 40px 0; /*20190725更新反映後 .button 設定消す*/ }
#plan .info .name { font-size: 18px; }
#plan .info .text { max-width: 320px; position: relative; padding-right: 25px; }
#plan .info .text:after { content: ''; display: block; width: 21px; height: 11px; background: url("../com/arrow.png") no-repeat center center; background-size: contain; position: absolute; right: 0; top: 50%; margin-top: -5px; transition: all 0.2s; }
#plan .info a:hover .text:after { right: -10px; }
#plan .info .btn { margin-top: 25px; text-align: left; }
#plan .info .button { margin-top: 25px; margin-right: 30px; float: left; }
#plan .info .button.list a { border: 1px solid #e6e6e6; border-radius: 3px; background-color: #fff; }
#plan .info .button a { display: inline-block; background-color: #e6e6e6; text-align: center; width: 200px; border-radius: 3px; transition: all 0.2s; line-height: 40px; }
#plan .info .button a:hover { background-color: #bfbfbf; }

/*----------------------------------------------------
	検索
----------------------------------------------------*/
#btm_search { margin-top: 120px; margin-bottom: 100px; }
#btm_search iframe { width: 950px; height: 372px; margin-left: auto; margin-right: auto; display: block; }

/*----------------------------------------------------
	ページトップ
----------------------------------------------------*/
.ptop { float: right; position: fixed; right: 50px; bottom: 50px; z-index: 9999; }

/*----------------------------------------------------
	フッター
----------------------------------------------------*/
#footer { width: 100%; background: url("../com/footer_bg.jpg") no-repeat center center; background-size: cover; padding-top: 50px; padding-bottom: 20px; }
#footer p, #footer a { color: #FFF; }
#footer .wrp { width: 870px; padding-left: 20px; padding-right: 20px; }
#footer .flogo { text-align: center; }
#footer .hotels { margin-top: 50px; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-wrap: wrap; }
#footer .hotels .hotel { width: 250px; margin-bottom: 30px; margin-left: 40px; /*軽井沢*/ /*京都*/ /*竹富島*/ /*富士*/ /*東京*/ /*沖縄*/ }
#footer .hotels .hotel:nth-child(3n+1) { margin-left: 0; }
#footer .hotels .hotel:nth-last-of-type(-n+3) { margin-bottom: 0; }
#footer .hotels .hotel a { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; margin-top: 20px; align-content: center; align-items: center; }
#footer .hotels .hotel a .name { font-size: 18px; margin-left: 20px; }
#footer .hotels .hotel a .name:before { content: ''; display: block; width: 14px; height: 14px; background-image: url("../com/h_icon_w.png"); background-repeat: no-repeat; background-size: contain; display: inline-block; vertical-align: middle; margin-right: 5px; }
#footer .hotels .hotel a .name .info { display: block; font-size: 12px; line-height: 1.4; color: #bfbfbf; }
#footer .hotels .hotel.current a[href] .name, #footer .hotels .hotel:hover a[href] .name { color: #666; }
#footer .hotels .hotel.current a[href] .name:before, #footer .hotels .hotel:hover a[href] .name:before { background-image: url("../com/h_icon_g.png"); }
#footer .hotels .hotel.ka a .name:before { background-image: url("../com/logo_ka_w.png"); }
#footer .hotels .hotel.ka.current a[href] .name:before, #footer .hotels .hotel.ka:hover a[href] .name:before { background-image: url("../com/logo_ka_g.png"); }
#footer .hotels .hotel.kyo a .name:before { background-image: url("../com/logo_kyo_w.png"); }
#footer .hotels .hotel.kyo.current a[href] .name:before, #footer .hotels .hotel.kyo:hover a[href] .name:before { background-image: url("../com/logo_kyo_g.png"); }
#footer .hotels .hotel.take a .name:before { background-image: url("../com/logo_take_w.png"); }
#footer .hotels .hotel.take.current a[href] .name:before, #footer .hotels .hotel.take:hover a[href] .name:before { background-image: url("../com/logo_take_g.png"); }
#footer .hotels .hotel.fuji a .name:before { background-image: url("../com/logo_fuji_w.png"); }
#footer .hotels .hotel.fuji.current a[href] .name:before, #footer .hotels .hotel.fuji:hover a[href] .name:before { background-image: url("../com/logo_fuji_g.png"); }
#footer .hotels .hotel.tko a .name:before { background-image: url("../com/logo_tko_w.png"); }
#footer .hotels .hotel.tko.current a[href] .name:before, #footer .hotels .hotel.tko:hover a[href] .name:before { background-image: url("../com/logo_tko_g.png"); }
#footer .hotels .hotel.oki a .name:before { background-image: url("../com/logo_oki_w.png"); }
#footer .hotels .hotel.oki.current a[href] .name:before, #footer .hotels .hotel.oki:hover a[href] .name:before { background-image: url("../com/logo_oki_g.png"); }
#footer .ftel { text-align: center; margin-top: 60px; }
#footer .ftel img:first-child { margin-right: 30px; }
#footer .cr { margin-top: 50px; font-size: 11px; text-align: center; color: #666; }

/*----------------------------------------------------
	クーポン
----------------------------------------------------*/
#coupon { margin-top: 80px; background-color: #f8f8f8; padding-top: 50px; padding-bottom: 50px; /*ボックス全体*/ /*クリックで中身表示*/ /*クリックで矢印回転*/ }
#coupon h3 { font-size: 22px; line-height: 1.6; margin-bottom: 30px; }
#coupon .accbox { margin-top: 30px; /*ラベル*/ /*上のラベル*/ /*チェックは隠す*/ /*中身を非表示にしておく*/ }
#coupon .accbox h3 { font-size: 28px; text-align: center; }
#coupon .accbox label { display: block; width: 100%; font-size: 18px; text-align: center; cursor: pointer; }
#coupon .accbox label img { display: block; width: 30px; transition: all 0.5s; }
#coupon .accbox label.title img { margin: 20px auto 0; }
#coupon .accbox input { display: none; }
#coupon .accbox .wrp { margin-bottom: 0; }
#coupon .accbox .accshow { height: 0; padding: 0; overflow: hidden; opacity: 0; transition: 0.8s; }
#coupon .cssacc:checked + label + .accshow { height: auto; padding-bottom: 20px; border-bottom: 0; opacity: 1; }
#coupon .cssacc:checked + label + .accshow img { margin-top: 30px; }
#coupon .cssacc:checked + label img { transform: rotate(-180deg); }

/*----------------------------------------------------
	ページトップ
----------------------------------------------------*/
.spt { width: 930px; text-align: right; margin: 15px 20px 20px 0px; }

.sptl { width: 100px; float: right; margin: 15px 20px 20px 0px; }

/*----------------------------------------------------
	共通
----------------------------------------------------*/
/* リスト */
.sq { width: 890px; background: #fff; margin: 0px 0px 0px 25px; padding: 15px 0px 5px 0px; }

.sq ul { width: 210px; list-style: none; float: left; margin: 0px 0px 0px 0px; padding-left: 10px; display: inline; }

.sq li { width: 230px; background-image: url(squ.gif); background-repeat: no-repeat; background-position: 2px 6px; padding: 0px 0px 0px 20px; margin-bottom: 10px; font-size: 12px; line-height: 18px; }

/*----------------------------------------------------
	共通　table　テーブル設定
----------------------------------------------------*/
.cht table { border-bottom: #9C8C72 dotted 1px; border-left: #9C8C72 dotted 1px; }

.cht th { background-image: url(../com/tbg.gif); background-repeat: repeat; background-position: 0px 0px; font-size: 12px; text-align: center; font-weight: normal; line-height: 18px; color: #281E18; border-top: #fff dotted 1px; border-right: #fff dotted 1px; }

.cht td { text-align: left; font-size: 12px; line-height: 18px; padding-left: 15px; border-top: #9C8C72 dotted 1px; border-right: #9C8C72 dotted 1px; color: #281E18; background-color: #fff; }

.not th { text-align: left; vertical-align: top; font-weight: normal; text-align: left; font-size: 12px; padding-left: 10px; }

.not td { text-align: left; vertical-align: top; font-size: 12px; padding-left: 15px; }

.dot900 { border-top: 1px #6C5D48 dotted; width: 900px; }

.dot950 { border-top: 1px #6C5D48 dotted; width: 950px; }

/* div配置 */
.left { float: left; display: inline; }

.right { float: right; display: inline; }

.clear { clear: both; }

/* 余白 */
.mar3 { margin: 3px; }

.mar5 { margin: 5px; }

.mar7 { margin: 7px; }

.mar10 { margin: 10px; }

.mt5 { margin-top: 5px; }

.mt10 { margin-top: 10px; }

.mt15 { margin-top: 15px; }

.mt20 { margin-top: 20px; }

.mt25 { margin-top: 25px; }

.mt30 { margin-top: 30px; }

.mt35 { margin-top: 35px; }

.mt40 { margin-top: 40px; }

.mt45 { margin-top: 45px; }

.mt50 { margin-top: 50px; }

.mt60 { margin-top: 60px; }

.mt70 { margin-top: 70px; }

.mt80 { margin-top: 80px; }

.mt100 { margin-top: 100px; }

.mt120 { margin-top: 120px; }

.mb5 { margin-bottom: 5px; }

.mb10 { margin-bottom: 10px; }

.mb15 { margin-bottom: 15px; }

.mb20 { margin-bottom: 20px; }

.mb30 { margin-bottom: 30px; }

.mb40 { margin-bottom: 40px; }

.ml1 { margin-left: 1px; }

.ml2 { margin-left: 2px; }

.ml5 { margin-left: 5px; }

.ml8 { margin-left: 8px; }

.ml10 { margin-left: 10px; }

.ml12 { margin-left: 12px; }

.ml15 { margin-left: 15px; }

.ml20 { margin-left: 20px; }

.ml22 { margin-left: 22px; }

.ml25 { margin-left: 25px; }

.ml30 { margin-left: 30px; }

.ml35 { margin-left: 35px; }

.ml40 { margin-left: 40px; }

.ml45 { margin-left: 45px; }

.ml50 { margin-left: 50px; }

.ml53 { margin-left: 53px; }

.ml60 { margin-left: 60px; }

.ml65 { margin-left: 65px; }

.ml70 { margin-left: 70px; }

.ml80 { margin-left: 80px; }

.ml100 { margin-left: 100px; }

.ml120 { margin-left: 120px; }

.ml130 { margin-left: 130px; }

.ml150 { margin-left: 150px; }

.ml170 { margin-left: 170px; }

.ml180 { margin-left: 180px; }

.ml200 { margin-left: 200px; }

.ml250 { margin-left: 250px; }

.ml300 { margin-left: 300px; }

.mr5 { margin-right: 5px; }

.mr10 { margin-right: 10px; }

.mr12 { margin-right: 12px; }

.mr15 { margin-right: 15px; }

.mr20 { margin-right: 20px; }

.mr25 { margin-right: 25px; }

.mr30 { margin-right: 30px; }

.mr35 { margin-right: 35px; }

.mr40 { margin-right: 40px; }

.pad5 { padding: 5px; }

.pad10 { padding: 10px; }

.pdt10 { padding-top: 10px; }

.pdt15 { padding-top: 15px; }

.pdt20 { padding-top: 20px; }

.pdt25 { padding-top: 25px; }

/* 横幅 */
.w100 { width: 100px; }

.w120 { width: 120px; }

.w130 { width: 130px; }

.w150 { width: 150px; }

.w160 { width: 160px; }

.w170 { width: 170px; }

.w175 { width: 175px; }

.w177 { width: 177px; }

.w190 { width: 190px; }

.w193 { width: 193px; }

.w200 { width: 200px; }

.w202 { width: 202px; }

.w205 { width: 205px; }

.w220 { width: 220px; }

.w230 { width: 230px; }

.w250 { width: 250px; }

.w260 { width: 260px; }

.w270 { width: 270px; }

.w280 { width: 280px; }

.w300 { width: 300px; }

.w305 { width: 305px; }

.w315 { width: 315px; }

.w320 { width: 320px; }

.w350 { width: 350px; }

.w360 { width: 360px; }

.w370 { width: 370px; }

.w380 { width: 380px; }

.w390 { width: 390px; }

.w400 { width: 400px; }

.w410 { width: 410px; }

.w415 { width: 415px; }

.w420 { width: 420px; }

.w430 { width: 430px; }

.w440 { width: 440px; }

.w450 { width: 450px; }

.w480 { width: 480px; }

.w500 { width: 500px; }

.w522 { width: 522px; }

.w545 { width: 545px; }

.w620 { width: 620px; }

.w720 { width: 720px; }

.w735 { width: 735px; }

.w800 { width: 800px; }

.w850 { width: 850px; }

.w860 { width: 860px; }

/* テキスト */
.chu { color: #5c8799; font-size: 12px; line-height: 18px; }

.siro { color: #fff; }

.txt_c { text-align: center !important; }

/*======================================

	hack - 各種cssハック - for IE7

=======================================*/
/*======================================

	hack - 各種cssハック - for IE6

=======================================*/
