@charset "utf-8";
/* CSS Document */
/*-------------------- バナー --------------------*/
.center_box .textitem{text-align: center;}
/*-------------------- テキスト --------------------*/
.tx_note {font-size: 1.2rem;}
.sup {vertical-align: super; font-size: 60%;}

.tx_link {
	padding-left: 10px;
	position: relative;
}
.tx_link::before {
	position: absolute;
	content: "";
	width: 8px;
	height: 8px;
	top: .5em;
	left: -3px;
	border-top: 1px solid #4d4d4d;
	border-right: 1px solid #4d4d4d;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.tx_red {
	color: #eb5038;
	font-weight: bold;
}

.d_i_block {display: inline-block;}

/*-------------------- アコーディオン --------------------*/
.wrap_acc {padding: 0 10px;}
.wrap_acc dt {
	font-size: 1.5rem;
	color: #222;
	position: relative;
}
.wrap_acc dt .ttl_acc {
	padding: 8px 20px 8px 10px;
	flex: 1;
}
.wrap_acc dt::before, .wrap_acc dt::after {
	position: absolute;
	content: "";
	width: 8px;
	height: 2px;
	top: 50%;
	right: 8px;
	margin-top: -1px;
}
.wrap_acc dt::after {
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
	transition: .3s;
}
.wrap_acc dt.open::after {
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
}
.wrap_acc .inner_acc .inner_wrap + .inner_wrap {margin-top: 10px;}
.wrap_acc .inner_acc {display: none; padding: 8px 8px 10px;}

/*-------------------- ボタン --------------------*/
.btn01_rt {
	width: auto;
	background: none;
}
.btn01_rt a {
	background: #2cb5bf;
	padding: 8px 20px 8px 10px;
	display: inline-block;
	width: auto;
	min-width: 145px;
	position: relative;
	border-radius: 5px;
}
.btn01_rt a::after {
	position: absolute;
	content: "";
	border-width: 1px;
	display: block;
	width: 8px;
	height: 8px;
	top: 50%;
	right: 8%;
	transform: rotate(45deg) translate(-35%,-40%);
}

/*-------------------- ナビ --------------------*/
.naviArea .nav_drp li, .naviArea .nav_drp li a,
.naviArea .nav_drp li, .naviArea .nav_drp li a {
	height: auto;
}
.naviArea .nav_drp li a span,
.naviArea3 .nav_drp li a span {
	padding: 10px 20px 10px 10px;
	position: relative;
}
.naviArea .nav_drp li a span::after,
.naviArea3 .nav_drp li a span::after {
	position: absolute;
	margin: -7px 0 0 0;
	top: 50%;
	right: 8px;
	width: 8px;
	height: 8px;
	border-top: none;
	border-bottom: 2px solid #fff;
}

/*-------------------- タイトル --------------------*/
.top .section.ttl_dp {margin-bottom: 10px;}
.top .section.ttl_dp h2 {
	color: #227e84;
	font-size: 2.4rem;
	border-bottom: 2px solid #227e84;
	display: block;
	text-align: center;
	margin: 0 5px;
	padding-bottom: 4px;
}

/*-------------------- 8つの特徴 --------------------*/
.bg_blue {background: #f0feff;}

.wrap_eight {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	padding: 0 10px;
}
.box_eight {
	width: calc(50% - 5px);
	background: #fff;
	border: 1px solid #227e84;
	margin-top: 15px;
	padding: 10px 8px 15px;
	text-align: center;
}
.tx_number {
	font-size: 3rem;
	color: #2cb5bf;
	line-height: 1;
	padding-right: 3px;
	margin-bottom: 18px;
	font-weight: bold;
	font-style: italic;
	position: relative;
}
.tx_number::before {
	position: absolute;
	content: "";
	width: 16px;
	height: 3px;
	background: #2cb5bf;
	border-radius: 2px;
	bottom: -7px;
	left: 50%;
	margin-left: -8px;
}
.ttl_eight {
	margin: 0 -2px;
	font-size: 1.6rem;
	font-weight: bold;
	color: #d97c2b;
	line-height: 1.4;
	display: inline;
	background: linear-gradient(transparent 60%, #ffebd9 60%);
}
.tx_eight {
	margin-top: 10px;
	line-height: 1.5;
	text-align: left;
}
.box_eight .tx_note,
.box_eight .tx_link {
	text-align: left;
}
.box_eight p + .tx_link, .box_eight p + .tx_note {margin-top: 10px;}

/*-------------------- ご予約から出発までの流れ --------------------*/
.bg_orange {background: #fff9ed;}

.wrap_acc.step {
	padding: 15px 10px 0;
	position: relative;
}
.wrap_acc.step::before {
	position: absolute;
	content: "";
	top: 15px;
	left: 26px;
	width: 6px;
	height: 100%;
	background: #e89146;
}
.wrap_acc.step:nth-last-of-type(1)::before {display: none;}

.wrap_acc.step dt {
	background: #fcd7b6;
	display: -webkit-flex;
	display: flex;
}
.wrap_acc.step dt .no_acc {
	display: -webkit-flex;
	display: flex;
	-wenkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	color: #fff;
	background: #e89146;
	font-size: .9rem;
	width: 40px;
	text-align: center;
	line-height: 1.1;
}
.wrap_acc.step dt .tx_no {
	font-size: 1.7rem;
	display: block;
}
.wrap_acc.step dt::before, .wrap_acc.step dt::after {
	background-color: #e89146;
}
.wrap_acc.step .inner_acc {
	padding: 10px 10px 0 50px;
	position: relative;
}
.wrap_acc.step .inner_acc .list_link {margin-top: 6px;}
.wrap_acc.step .ttl_i_orange {
	font-size: 1.5rem;
	font-weight: bold;
	color: #d97c2b;
	position: relative;
	display: inline;
	padding: 0 4px 0 17px;
	background: linear-gradient(transparent 50%, #ffe5d1 50%);
}
.wrap_acc.step .ttl_i_orange::before {
	position: absolute;
	content: "";
	width: 12px;
	height: 12px;
	top: 3px;
	left: 2px;
	background: #d97c2b;
	border-radius: 50%;
}

/*-------------------- ご利用上の注意事項 --------------------*/
.wrap_tx {margin: 6px 10px 15px;}

.wrap_acc.caution {margin-top: 1px;}
.wrap_acc.caution dt {
	background: #bae5e8;
}
.wrap_acc.caution dt::before, .wrap_acc.caution dt::after {
	background: #227e84;
}
.wrap_acc.caution dt .ttl_acc {color: #227e84;}
.wrap_acc.caution .inner_acc {
	background: #f0feff;
}
.wrap_acc.caution .inner_acc .list_tx li {
	padding-left: 14px;
	position: relative;
}
.wrap_acc.caution .inner_acc .list_tx li::before {
	position: absolute;
	content: "";
	width: 3px;
	height: 3px;
	background: #4d4d4d;
	border-radius: 50%;
	top: 10px;
	left: 5px;
}
.wrap_acc.caution .inner_acc .list_tx li + li {margin-top: 3px;}

/* リンクのリスト */
.wrap_link li {
	border-bottom: 1px dashed #ccc;
}
.wrap_link li:nth-of-type(1) {
	border-top: 1px dashed #ccc;
}
.wrap_link li a {
	display: block;
	padding: 6px 25px 6px 14px;
	position: relative;
}
.wrap_link li a::before {
	position: absolute;
	content: "";
	width: 8px;
	height: 8px;
	top: 50%;
	right: 18px;
	margin-top: -4px;
	border-top: 2px solid #ccc;
	border-right: 2px solid #ccc;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

/*-------------------- お問い合わせについて --------------------*/
.box_content {
	border: 3px solid #bae5e8;
	border-radius: 5px;
	margin: 0 10px 5px;
	text-align: left;
}
.ttl_content {
	font-weight: bold;
	color: #227e84;
	background: #bae5e8;
	padding: 2px 8px;
	margin: -1px -1px 0;
}
.inner_content {padding: 3px 8px;}
.inner_content .tx_red {font-size: 2rem;}
.inner_content p {display: inline-block;}


@media screen and (min-width: 768px) {
	/*-------------------- アコーディオン --------------------*/
	.wrap_acc .inner_acc {display: block;}
	.wrap_acc dt {pointer-events: none;}
	.wrap_acc dt::before, .wrap_acc dt::after {display: none;}

	/*-------------------- ボタン --------------------*/
	.btn01_rt a {line-height: inherit;}

	/*-------------------- タイトル --------------------*/
	.top .section.ttl_dp {
		margin-bottom: 20px;
		text-align: center;
		position: relative;
	}
	.top .section.ttl_dp::before {
		position: absolute;
		content: "";
		width: 100%;
		border-top: 2px solid #227e84;
		top: 50%;
		left: 0;
	}
	.top .section.ttl_dp h2 {
		border: none;
		display: inline-block;
		background: #fff;
		padding: 0 20px;
		z-index: 10;
		position: relative;
	}
	.bg_blue .top .section.ttl_dp h2 {background: #f0feff;}
	.bg_orange .top .section.ttl_dp h2 {background: #fff9ed;}

	/*-------------------- hover --------------------*/
	a img:hover {opacity: .8;}
	.codeitem .listitem a img:hover {opacity: 1;}

	/*-------------------- 8つの特徴 --------------------*/
	.box_eight {
		width: calc(25% - 10px);
		padding: 10px 10px 15px;
	}
	/*-------------------- ご予約から出発までの流れ --------------------*/
	.wrap_acc.step {padding-left: 100px;}
	.wrap_acc.step::before {
		width: 8px;
		left: 31px;
	}
	.wrap_acc.step dt {position: relative;}
	.wrap_acc.step dt::before, .wrap_acc.step dt::after {
		position: absolute;
		content: "";
		display: block;
	}
	.wrap_acc.step dt::after {
		width: 30px;
		height: 3px;
		background-color: transparent;
		background-size: 12px 3px;
		background-image: linear-gradient(to right, #e89146, #e89146 7px, transparent 7px, transparent 11px);
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
		left: -30px;
	}
	.wrap_acc.step dt::before {
		width: 70px;
		height: 70px;
		top: 50%;
		left: -100px;
		margin-top: -35px;
	}
	.wrap_acc.step:nth-of-type(1) dt::before {background: url("/content/dam/jretravel/site/page/drp/images_2022/ic_drp01.png");}
	.wrap_acc.step:nth-of-type(2) dt::before {background: url("/content/dam/jretravel/site/page/drp/images_2022/ic_drp02.png");}
	.wrap_acc.step:nth-of-type(3) dt::before {background: url("/content/dam/jretravel/site/page/drp/images_2022/ic_drp03.png");}
	.wrap_acc.step:nth-of-type(4) dt::before {background: url("/content/dam/jretravel/site/page/drp/images_2022/ic_drp04.png");}
	.wrap_acc.step:nth-of-type(5) dt::before {background: url("/content/dam/jretravel/site/page/drp/images_2022/ic_drp05.png");}

	/*-------------------- ご利用上の注意事項 --------------------*/
	.wrap_acc.caution dt .ttl_acc {padding: 5px 20px 5px 20px;}
	dl.wrap_acc.caution + dl.wrap_acc.caution {margin-top: 5px;}

	.wrap_link {
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
	}
	.wrap_link li {
		width: calc(25% - 10px);
	}
	.wrap_link li, .wrap_link li:nth-of-type(1) {border: none;}
	.wrap_link li a {
		color: #fff;
		padding: 8px 25px 8px 10px;
		text-align: center;
		text-decoration: none;
		background: #2cb5bf;
		border-radius: 5px;
	}
	.wrap_link li a:hover {opacity: .8;}
	.wrap_link li a::before {
		border-color: #fff;
		border-width: 1px;
	}
	/*-------------------- お問い合わせについて --------------------*/
	.pc_center {text-align: center;}
	.box_content {display: inline-block;}

	/*-------------------- おすすめ記事 --------------------*/
	.article_contens>ul>li:nth-child(odd) {margin-bottom: 3.5%;}
}

/*-------------------- おすすめ記事 --------------------*/
.topSearchArea .train .inner .submit+.panel_comment p a.outside_icon{padding:0 0 0 15px}

/*---------------------------------------------------------------
                    time sale
-----------------------------------------------------------------*/
/*base*/
.text_center {justify-content: center;text-align: center;}
.link_text {color: #222;text-decoration: underline;}
a.outside_icon.link_text {padding: 0 0 0 15px;}
@media all and (min-width:768px) {.sp {display: none}}
@media all and (max-width:767px) {.sp {display: block}}
/*timesale*/
#timesale {margin: 20px auto}
#timesale h2 {font-size: 2.4rem;font-weight: bold;text-align: center;margin-bottom: 1%;color: #4d4d4d}
@media all and (min-width:768px) {
#timesale h2:before,#timesale h2:after {content: '';display: inline-block;width: 100px;height: 2px;background: #eee;margin-bottom: 6px}
#timesale h2:before {margin-right: 20px;}
#timesale h2:after {margin-left: 20px;}
}
#timesale .title.top .section {padding: 0}
#timesale p {line-height: 1.5}
#timesale .text1 {padding: 10px}
#timesale .text1 .att_text {font-weight: bold}
#timesale .text2 {padding: 10px;text-align: center}
#timesale .text_box {margin: 0 auto 10px;padding: 5px;text-align: center;background:/*#333*/#1794a5;color: #fff;}
#timesale .text_box>span {font-size: 1.8rem;}
#timesale .text3 {text-align: center;font-weight: bold;background: linear-gradient(transparent 60%, #ffebd9 0);margin: 0 auto;display: inline;padding: 0 1px 0px;}
#timesale .text3 .red {color: /*#D65858*/#ef3f3f;}
#timesale .text3 .font15 {font-size: 2rem;}
#timesale ul.text4 {display: block;padding: 1em 10px;}
#timesale ul.text4 li {font-size: 1.1em;width: 100%;margin: 1% auto;}
#timesale ul.text4 li:nth-child(2) {margin-top: 3%;}
#timesale ul.text4 li dl {display: block;border: 3px solid #eee;background: #eee;}
#timesale ul.text4 li dl dt,#timesale ul.text4 li dl dd {display: block;padding: .5em;}
#timesale ul.text4 li dl dd {font-size: /*1.2em*/4.8vw;font-weight: bold;background: #fff;white-space: pre;}
#timesale ul.text4 li dl dd span {font-size: 0.6em;}
#timesale .outside_txt {margin: 10px 0;}
@media all and (max-width:767px) {
#timesale ul.text4 li dl dt {font-size: 0.9em}
#timesale .text5 {text-align: left;}
}
@media all and (min-width:768px) {
#timesale ul.text4 {display: flex;justify-content: space-between;padding: 1em 10px;}
#timesale ul.text4 li {font-size: 1.1em;width: calc(100%/2);}
#timesale ul.text4 li:nth-child(2) {margin: 1% 0 1% 2%;}
#timesale ul.text4 li dl dd {font-size: 1.5em;}
#timesale ul.text4 li dl dd span {font-size: 0.65em;}
#timesale .text5 {text-align: right;}
}
/*timer*/
#CDT {width: 100%;text-align: center;font-size: 33px;font-weight: bold;color: #D65858;font-family: 'Noto Sans JP', sans-serif;}
.time_end_ttl {width: 100%;color: #222;font-size: 18px;font-weight: 600;text-align: center;margin: 0;font-family: 'Noto Sans JP', sans-serif;}
/*1column set */
/*
#att_cp .timesale p {font-size: 1.2em;}
#att_cp .timesale p.font15 {font-size: 1.3em;}
#att_cp .timesale p>span.red {color: #ea0000;font-size: 1.5em;margin: 0}
#att_cp .timesale .product_tag_icon {font-size: 1.2em;margin: 0;}
#att_cp .arrow_icon:before {content: none;}
#att_cp .arrow_icon {width: 80%;margin: 0 auto 2%;}
#att_cp .arrow_icon p {display: inline-block;width: 18px;height: 18px;margin: 0 10px;border-bottom: 4px solid #aaa;border-right: 4px solid #aaa;transform: rotate(45deg);}*/
#att_cp .details_box .price {font-size: 3rem;}
#att_cp .details_box .txt {margin-bottom: 1.5rem;}
#att_cp .att_icon:before {content: "✽";margin: 0 .5rem 0 0;display: inline-block;}
/*other plan*/
/*#timesale .clm3 .outside_txt {margin: 5% 1% 1%;}
p.other_plan {margin: 1%;text-align: right;display: block;position: relative;width: auto;}
p.other_plan a {display: flex;justify-content: center;align-items: center;width: 100%;height: 50px;box-sizing: border-box;background: repeating-linear-gradient(45deg, #ffffff, #ffffff 3px, #e7e7e7 3px, #e7e7e7 30px);color: #333;letter-spacing: 0.1em;text-decoration: none;position: relative;}
p.other_plan a span {display: flex;justify-content: center;align-items: center;width: 100%;height: 50px;background: #fff;border: 1px solid #666;box-sizing: border-box;position: absolute;top: -6px;left: -6px;transition-duration: 0.2s;}
p.other_plan a:hover span {left: -1px;top: -1px;}
p.other_plan a span::after {content: '';position: absolute;display: block;top: 50%;right: 10px;width: 10px;height: 10px;margin-top: -5px;border-top: 2px solid #666;border-right: 2px solid #666;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
@media all and (max-width:568px) {
p.other_plan {margin: 9% 1% 2%;}
p.other_plan a span {text-align: center;}
p.other_plan a span::after {right: 8px;width: 8px;height: 8px;}
}
@media all and (min-width:569px) {#att_cp+.outside_txt .other_plan {width: 50%;margin-left: 50%;}}
.plan_text {font-weight: bold;}*/
#timesale p.icon {background: #099;color: #fff;}
@media all and (max-width:767px) {
.base_prod.side_box .hotel li>a .img_box,.base_prod.sort li:nth-child(-n+2)>a .img_box {width: 100%;}
.base_prod.side_box .hotel li>a .details_box,.base_prod.sort li:nth-child(-n+2)>a .details_box {width: 100%;margin-left: 0}
}
/*対象列車ボタン*/
#time_table p {display: flex;}
#time_table a {width: 50%;background:linear-gradient(#f59143, 80%, #f58d43);padding: 1% 2%;text-align: center;margin: 0 auto;text-decoration: none;font-size: 1.7rem;color: #fff;position: relative;border-radius: 10px;}
#time_table a:hover {background: #f56c43;}
#time_table a span.outside_icon {background-position: 0 6px;padding: 0 0 0 18px;background-image: url('data:image/svg+xml;utf8,<svg%20xmlns="http://www.w3.org/2000/svg"%20viewBox="0%200%2012%2012"><path%20d="M302.64,421.91v2.61h-8.15v-8.15h2.61m6.44,3.81v-4.71h-4.71m-.9,5.5,5.29-5.3m-10.68,2.66v8.14h8.14"%20transform="translate(-292.04%20-414.97)"%20fill="none"%20stroke="%23fff"%20stroke-miterlimit="10"/></svg>');}
.banner.tyo_otherarea_banner {width: 100% !important;margin: 0 !important;}
p.imageitem {text-align: center}
@media all and (max-width:767px) {#time_table a {width: 90%;padding: 2%;}#time_table a{margin:2% auto}}
@media all and (-ms-high-contrast: none) {#time_table a {background: #f59143}}
#time_table a[href*=".pdf"]:before {background-position: 0px 3px;}
/*宿泊地から探す*/
ul.area_contents_box {display: inline-flex;width: 100%;flex-wrap: wrap;margin: 1% 0 0;}
ul.area_contents_box>li {display: inline-block;width: /*calc(100%/5.5)*/calc(100%/4.2);margin: 1% auto;text-align: center;border: 2px solid #333;}
ul.area_contents_box>li>a {padding: 6% 5%;display: block;text-decoration: none;}
ul.area_contents_box>li>a>p {display: block;width: 100%;line-height: 1.5;font-size: 1.7rem;font-weight: bold;margin-bottom: 2%;color: #222;}
ul.area_contents_box>li>a>p>span {font-size: 1rem}
ul.area_contents_box>li>a>p.min_price {font-size: 2rem;color: #D65858;/*margin-left: 2%;*/}
ul.area_contents_box>li>ul {justify-content: space-around;}
ul.area_contents_box>li>ul>li {display: inline-block}
ul.area_contents_box>li>a {position: relative}
ul.area_contents_box+.small.att_text {margin: 0 0 2%;}
ul.area_contents_box+.small.att_text>p {margin-left: 3%}
ul.area_contents_box+.small.att_text>p>span {margin-left: -15px;}
@media all and (min-width:767px){
ul.area_contents_box>li>a:after {content: '';position: absolute;content: "";display: block;top: 50%;right: 10px;width: 10px;height: 10px;margin-top: -5px;border-top: 2px solid #ccc;border-right: 2px solid #ccc;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
}
@media all and (max-width:767px) {
ul.area_contents_box>li {display: inline-block;width: calc(100%/2.1);}
ul.area_contents_box>li>a:after{content:'';position: absolute;width: 0;height: 0;bottom: 0;right: 3%;border-left: 10px solid #333;border-top: 10px solid transparent;border-bottom: 10px solid transparent;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
ul.area_contents_box>li>a>p.min_price {font-size: 1.6rem;}
ul.area_contents_box+.small.att_text {width: 95%;margin: 0 auto 2%}
}
ul.area_contents_box.ab>li>a>p.min_price{display:none}
/*------------------
下期発売
--------------------*/
#drp_notice01{background:#eff8ff;padding:2% 0 1%;}
#drp_notice01_1 {width:100%;text-align:center;line-height:1.3}
#drp_notice01_1 h2{font-size:2.4em;line-height: 1.3;letter-spacing: 1.2px;position: relative;color: #0b3538;font-family: 'Kosugi Maru', sans-serif;}
#drp_notice01_1 span{font-size:.6em}
#drp_notice01_1 span.rc{color:#e84546;font-size:1em}
#drp_notice01_1 h2:before {content: '';display: inline-flex;position: absolute;background: repeating-linear-gradient(-45deg,#1db3ac,#1db3ac 10px,#eff8ff 0,#eff8ff 14px);width: 60%;height: 5px;top: -15px;left: 210px;}
#drp_notice01_1 h2:after {content: '';display: inline-flex;position: absolute;background: repeating-linear-gradient(-45deg,#1db3ac,#1db3ac 10px,#eff8ff 0,#eff8ff 14px);width: 60%;height: 5px;bottom: -15px;left: 210px;}/*#ffaeae*/
#drp_notice01_1 div .text_box {margin: 0 auto;text-align: left;color: #0b3538;}
#drp_notice01_1 div .text_box:before {content:'※';margin-left: -15px;}
@media all and (min-width:768px) {
#drp_notice01_1 div .text_box{width: /*48%46%*/58%;padding-left: 4%;}
}
@media all and (max-width:767px){
#drp_notice01_1 h2{font-size: 1.7em;width: 95%;margin: 0 auto;}
#drp_notice01_1 h2:before,#drp_notice01_1 h2:after{content: '';width: 98%;left: 1px;}
#drp_notice01_1 div .text_box {width: 89%;margin: 0 8%;}
}
/*------------------
上期発売
--------------------*/
#drp_notice01.first_half{background:#f2ffef;}
#drp_notice01.first_half #drp_notice01_1 span.rc{color:#C63A3A}

/*---------------------------------------------------------------
                    全国旅行支援
-----------------------------------------------------------------*/
.tx_note2{font-size: 1.2rem;color: #eb5038;display:none;}