@charset "UTF-8";
/* CSS Document */

ul,ol {
	list-style-type: none;
	padding: 0;
}
a {color: #333;}
a:hover { text-decoration: none;}

section a:hover {
	opacity: 0.8;
}


body {
	font-size: 14px;
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
	font-weight: 500;
	color: #333;
	background-color: #fff;
	
}

header {}
.header_inner {
	width: 1000px;
	margin: 0 auto;
	padding-top: 10px;
}

.head_logo {
	float: left;
}
.head_right {
	float: right
}
.head_right ul li {
	display: table-cell;
	padding: 0 5px;
}
.pc_nav {
	
}
.pc_nav li {
	display: table-cell;
	font-weight: bold;
}
.pc_nav .nav-item01 {background: url("../img/nav_icon01.png") no-repeat left center transparent;padding-left: 30px}
.pc_nav .nav-item02 {background: url("../img/nav_icon02.png") no-repeat left center transparent;padding-left: 30px}
.pc_nav .nav-item03 {background: url("../img/nav_icon03.png") no-repeat left center transparent;padding-left: 30px}
.pc_nav .nav-item04 {background: url("../img/nav_icon04.png") no-repeat left center transparent;padding-left: 30px}
.pc_nav li a {
	margin-right: 1rem;
}

/*mainvisual*/

.main_visual {
	background: url("../img/top_bg.jpg") no-repeat center 0 transparent;
	background-size: cover;
	height: 680px;
}

.main_inner {
	width: 1000px;
	margin: 0 auto;
	position: relative;
}
h1 {
	font-size: 16px;
	color: #fff;
	padding-top: 1rem;
}

.top_logo {
	position: absolute;
	top: 175px;
	left: 0;
	right: 0;
	text-align: center;
}
.top_logo img {
	animation-duration: 1s;
}
.top_plane {
	position: absolute;
	top: 250px;
	left: 100px;
	height: 100%;
	overflow: hidden;
}
.top_plane img {
	animation-duration: 1s;
	animation-delay: 1s;
	    margin-top: 20px;
}
.top_lead {
	font-weight: bold;
    padding: 280px 30px 0 580px;
    line-height: 3;
	font-size: 15px;
	color: #000;
}

section {}
section .inner {
	width: 1000px;
	margin: 0 auto;
}


h2 {}
.recommend h2 {
	background: url("../img/title_icon_ribon.png") no-repeat left center transparent;
	padding-left: 3rem;
	border-bottom: 2px solid #0087a9;
	line-height: 2;
    margin-bottom: 1rem;
}
.tour_search h2 {
	background: url("../img/title_icon_search.png") no-repeat left center transparent;
	padding-left: 3rem;
	border-bottom: 2px solid #0087a9;
	line-height: 2;
    margin-bottom: 1rem;
}
.top_plan h2 {
	background: url("../img/title_icon_crown.png") no-repeat left center transparent;
	padding-left: 3rem;
	border-bottom: 2px solid #0087a9;
	line-height: 2;
    margin-bottom: 1rem;
}
.top_hotel h2,
.hotel_info_plan h2 {
	background: url("../img/title_icon_bed.png") no-repeat left center transparent;
	padding-left: 3rem;
	border-bottom: 2px solid #0087a9;
	line-height: 2;
    margin-bottom: 1rem;
}
.price h2 {
	background: url("../img/title_icon_calender.png") no-repeat left center transparent;
	padding-left: 3rem;
	border-bottom: 2px solid #0087a9;
	line-height: 2;
    margin-bottom: 1rem;
}
.cta_area h2 {
	background: url("../img/title_icon_mail.png") no-repeat left center transparent;
	padding-left: 3rem;
	border-bottom: 2px solid #0087a9;
	line-height: 2;
    margin-bottom: 1rem;
}
.top_plan h2 form,
.top_hotel h2 form {
	display: inline-block;
	margin-left: 1.5rem;
}
.top_plan h2 dl,
.top_hotel h2 dl {display: inline;}
.top_plan h2 dt,
.top_hotel h2 dt,
.top_plan .pc_hide dt,
.top_hotel .pc_hide dt {
	font-size: 16px;
	display: inline;
	background-color: #0087a9;
	color: #fff;
	padding: 8px 15px;
}
.top_plan h2 dd,
.top_hotel h2 dd,
.top_plan .pc_hide dd,
.top_hotel .pc_hide dd {
	font-size: 15px;
	display: inline;
}
.top_plan h2 form select,
.top_hotel h2 form select,
.top_plan .pc_hide select,
.top_hotel .pc_hide select {
	height: 2rem;
    width: 12rem;
	color: #0087a9;
	font-weight: bold;
	background-color: #fff;
}

/*スライダー*/
#slider {
   width:1000px;
}
 
#photo {
   width:660px;
   height:270px;
   float:left;
   position:relative;
}
#photo::after {
	content: '';
	width: 160px;
	height: 190px;
	background: url("../img/recommend_ribon.png") no-repeat 0 0 transparent;
	position: absolute;
	top: 10px;
	left: 10px;
}
#photo li {
	position:absolute;
	background: url("../img/dot_yellow.gif") repeat 0 0 transparent;
}
#photo li p {
	text-align: center;
	font-weight: bold;
	padding: 1.5rem 0;
	margin-bottom: 0;
	font-size: 15px;
	position: relative;
}
#photo li p::after {
	content: '▶︎';
	background-color: #fff;
	border-radius: 50px;
	padding: 1rem;
	margin-left: 2rem;
}
 
#thumb {
   width:325px;
   float:right;
}
#thumb li {
   cursor:pointer;
	margin-bottom: 10px;
}

.search-form {
	background-color: #19b2d8;
	border-radius: 10px;
	padding:20px;
	width: 350px;
	font-size: 15px;
	float: left;
}
.search-form table {
	color :#fff;
	width: 100%;
}
.search-form table th,
.search-form table td {
	padding: 0.4rem;
	font-weight: bold;
}
.search-form table .col4 th,
.search-form table .col4 td {
	max-width: 3rem;
}
.search-form table select {
	color: #000;
	background-color: #fff;
    height: 35px;
}

.place {
	width: 13rem;
}
.text_center {
	margin: 0 auto;
	text-align: center;
}
.search-form input.s-btn {
	border: none;
	border-radius: 10px;
	color: #000;
	background-color: #ffe400;
	padding: 1rem 6rem;
    font-size: 22px;
    font-weight: bold;
	    margin-top: 12px;
}

.map_search {
	float: right;
	background: url("../img/map_bg.png") no-repeat 0 0 transparent;
	width: 630px;
	height: 400px;
	position: relative;
}

#hokkaido {position: absolute;right: 100px;top: 30px;}
#tohoku {position: absolute;right: 130px;top: 150px;}
#hokuriku {position: absolute;right: 275px;top: 180px;}
#kanto {position: absolute;right: 130px;top: 220px;}
#sanin {position: absolute;right: 275px;top: 245px;}
#syuto {position: absolute;right: 150px;top: 260px;}
#kinki {position: absolute;right: 180px;top: 300px;}
#kyusyu {position: absolute;left: 30px;top: 280px;}

.map_search ul li a {
	background-color: #fff;
	padding: 7px 15px;
	border-radius: 5px;
	border: 1px solid #ccc;
	color: #0087a9!important;
	font-weight: bold;
	position: relative;
	font-size: 16px;
}
.map_search ul li a::after {
	content: '▶︎';
	color: #fff;
	background-color: #0087a9;
	border-radius: 50px;
	font-size: 10px;
    padding: 3px;
	vertical-align: middle;
    margin-left: 5px;
}
.map_search ul li a:hover {
	opacity: 0.8;
}

.content {
	width: 1000px;
	margin: 0 auto;
	margin-top: 50px;
}
.main_area {
	width: 750px;
	float: left;
}
.main_area section {
	width: 100%;
	margin-bottom: 2rem;
}
.main_area section .inner {
	width: 100%;
}
/*タブ切り替え*/
.ChangeElem_Panel{
	display: none;
}
.tab_inner {
	padding: 20px;
	border-radius: 0 10px 10px 10px;
	border:4px solid #ffe400;
	min-height: auto;
    display: inline-block;
	line-height: 2rem;
}
.ChangeElem_Btn {
	background-color: #fff9c8;
	padding: 1rem;
	font-weight: bold;
	font-size: 16px;
	border: none;
	margin: 0;
	border-radius: 5px 5px 0 0;
	cursor: pointer;
	position: relative;
}
.news_btn::before {
	content: '';
	background: url("../img/topic_icon_news_off.png") no-repeat left 0 transparent;
    height: 21px;
    width: 2rem;
    display: inline-block;
	vertical-align: middle;
}
.campaign_btn::before {
	content: '';
	background: url("../img/topic_icon_campaign_off.png") no-repeat left 0 transparent;
	height: 21px;
    width: 2rem;
    display: inline-block;
	vertical-align: middle;
}
.topic_btn::before {
	content: '';
	background: url("../img/topic_icon_info_off.png") no-repeat left 0 transparent;
    height: 21px;
    width: 2rem;
    display: inline-block;
	vertical-align: middle;
}
.is-active.news_btn::before {background: url("../img/topic_icon_news_on.png") no-repeat left 0 transparent;}
.is-active.campaign_btn::before {background: url("../img/topic_icon_campaign_on.png") no-repeat left 0 transparent;}
.is-active.topic_btn::before {background: url("../img/topic_icon_info_on.png") no-repeat left 0 transparent;}
.ChangeElem_Btn_Content .is-active {
	background-color: #ffe400;
}
.ChangeElem_Panel span {
	display: block;
	text-align: right;
}
.ChangeElem_Panel span a {
	background-color: #ffe400;
    padding: 0.2rem 2rem;
    display: inline-block;
    font-weight: bold;
    border-radius: 5px;
    position: relative;
}
.ChangeElem_Panel span a::after {
	content: '▶︎';
    padding: 5px;
    background-color: #fff;
    font-size: 10px;
    border-radius: 50px;
    line-height: 1;
    vertical-align: baseline;
    margin-left: 0.5rem;
}

.col-2 li {
	display: inline-block;
	margin-bottom: 20px;
}
.col-2 li:nth-child(2n+1) {
	margin-right: 20px;
}

.side_area {
	float: right;
}
aside img {
	margin-bottom: 1rem;
}

footer {
	background-color: #19b2d8;
	color: #fff;
	text-align: center;
	padding-top: 1rem;
}
.footer_logo {
	margin: 2rem 0;
}
.footer_menu {
	margin: 1rem 0;
}
.footer_menu li {
	display: inline;
	padding: 0 1rem;
	border-right: 1px solid #fff;
	font-weight: bold;
}
.footer_menu li:last-child {
	border: none;
}

.swiper-pagination {
	width: 100%;
	bottom: 0;
}
.swiper-pagination-bullet {
	margin: 5px;
	padding: 5px;
	background: #838383!important;
}
.swiper-pagination-bullet-active {
	background: #ccc;
}

.pc_hide{display: none;}
nav.NavMenu{display: none;}

@media screen and (max-width: 960px) {
	.pc_hide {
		display: block;
	}
	.sp_hide {
		display: none!important;
	}
	.header_inner {
		width: 100%;
	}
	.sp_lead {
		color: #1EA3D0;
		padding: 0 1rem 1rem;
		text-align: center;
		font-size: 16px;
		font-weight: bold;

	}
	.head_right {
    float: none;
}
	
	/*ナビメニューのスタイルを指定*/
nav.NavMenu{
position: fixed; /*表示位置を固定*/
z-index: 2; /*重ね順を変更*/
top: 0; /*表示位置を指定*/
left: 0; /*表示位置を指定*/
background: #fff;/*背景を白にする*/
color: #000; /*文字色を黒にする*/
text-align: center; /*テキストを中央揃え*/
width: 100%; /*全幅表示*/
transform: translateY(-100%); /*ナビを上に隠す*/
transition: all 0.6s; /*アニメーションの時間を指定*/
font-weight: bold;
	display: inline-block;
}

nav.NavMenu ul{
/* background: rgb(241, 236, 236); 背景をグレーにする */
background: #19b2d8; /*背景をグレーにする*/

width: 100%;
margin: 0 auto;
padding: 0;
}

nav.NavMenu ul li{
font-size: 1.1em;
list-style-type: none;
padding: 0;
width: 100%;
border-bottom: 1px dotted #fff;
}

nav.NavMenu ul li:last-child{
padding-bottom: 0;
border-bottom: none; /*最後のメニュー項目のみ下線を消す*/
}

nav.NavMenu ul li a{
display: block; /*クリックできる領域を広げる*/
color: #fff;
padding: 1em 0;
}
	nav.NavMenu.Active{
transform: translateY(0%);
}
	/*トグルボタンのスタイルを指定*/
.Toggle {
display: block;
position: fixed;    /* bodyに対しての絶対位置指定 */
right: 13px;
top: 12px;
width: 42px;
height: 42px;
cursor: pointer;
z-index: 3;
}
 
.Toggle span {
display: block;
position: absolute;
width: 30px;
border-bottom: solid 3px #000;
-webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
-moz-transition: .35s ease-in-out;		/*変化の速度を指定*/
transition: .35s ease-in-out;			/*変化の速度を指定*/
left: 6px;
}
 
.Toggle span:nth-child(1) {
top: 9px;
}
 
.Toggle span:nth-child(2) {
top: 18px;
}
 
.Toggle span:nth-child(3) {
top: 27px;
}
 
/* 最初のspanをマイナス45度に */
.Toggle.Active span:nth-child(1) {
top: 18px;
left: 6px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
}
 
/* 2番目と3番目のspanを45度に */
.Toggle.Active span:nth-child(2),
.Toggle.Active span:nth-child(3) {
top: 18px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
}
	
	h2 {
		text-align: left;
	}
	main {
		padding: 0;
	}
	section .inner {
	width: 100%;
	}
	
	#slider {
	width: 100%;
	height: 430px;
	}
	#photo {
    width: 100%;
    height: 100%;
    float: none;
    margin: 0 auto;
    position: relative;
}
	#photo li {
		position: absolute;
	}
	#photo li img {
		height: 100%;
		display: block;
	}
	#thumb {
		width: 100%;
		float: none;
	}
	#thumb li {
		display: table-cell;
	}
	#thumb li img {
		width:25vw;
	}
	.content {
		width: 100%;
	}
	.main_area,.side_area {
		width: 100%;
		float: none;
		padding: 0 5px;
	}
	.side_area {
		text-align: center;
	}
	.ChangeElem_Btn {
    padding: 0.5rem;
    font-size: 14px;
}
	.col-2 li {
		width: 46%;
	}
	.col-2 li img {
		width: 100%;
	}
	
	.search-form {
		width: 100%;
		border-radius: 0;
	}
	.map_search {
		width: 100%;
	}
	#hokkaido,
	#tohoku,
	#hokuriku,
	#kanto,
	#sanin,
	#syuto,
	#kinki,
	#kyusyu {
		width: 100%;
		position: static;
	}
	.map_search ul li a {
	display: block;
    text-align: center;
    padding: 1rem 0;
	}

}
@media screen and (max-width: 660px) {
	body {
		font-size: 14px;
	}
	h2 {
		font-size: 16px;
	}
	#photo li img {
		width: 100%;
		
	}
	.news_btn::before {display: none}
	.campaign_btn::before {display: none}
	.topic_btn::before {display: none}
	.tab_inner {
		/* min-height: 45vh; */
	}
	#slider {
		height: 430px;;
	}
	#photo li {
		width: 100%;
		min-height: 250px;
		overflow: hidden;
	}
	#photo li img {
		min-height: 300px;
		/* width: auto; simoji-ta del */ 
	}
	#photo::after {
		max-width: 100px;
		background-size: 100px;
	}
	#photo li p {
		font-size: 13px;
	}
	.header_inner {
		text-align: center;
	}
	.head_logo {
		float: none;
	}
	.search-form {
		float: none;
	}
	.map_search {
		width: 100%;
		float: none;
	}
	.footer_menu li {
		white-space: nowrap;
	}
	.head_right ul {
		text-align: center;
		margin-top: 10px;
	}
	.head_right ul li {
		display: inline-block;
	}
}
@media screen and (max-width: 430px) {
	h2 {
		line-height: 1!important;
		padding: 10px 0;
	}
}

/*下層ページ*/
.sub-page {
	
}
.sub-page h1 {
	background: url("../img/sub_head_bg.gif") repeat-x 0 0 transparent;
	background-size: auto 100%;
	color: #fff;
	text-align: center;
	padding-bottom: 1rem;
}
.bread {
	width: 1000px;
	margin: 0 auto;
}
@media screen and (max-width: 960px) {
	.bread {width: 100%;padding: 0 5px;}
}

.bread ul li {
	display: inline-block;
}
.bread ul li::after {
	content: '＞';
	margin: 0 1rem;
}
.bread ul li:last-child::after {
	display: none;
}
h3.title_balloon {
	background-color: #ffe200;
	padding: 0.5rem 1rem;
	position: relative;
	margin-bottom: 2rem;
}
h3.title_balloon::after {
    content: '';
    height: 20px;
    width: 20px;
    border: 20px solid transparent;
    border-top: 20px solid #ffe200;
    position: absolute;
    bottom: -40px;
    left: 20px;
}
article {padding: 15px;margin-bottom: 50px;}
article h4,
.hotel_info h4,
.plan_info h4,
.caution h4 {
	border-left: 7px solid #0087a9;
	color: #19b2d8;
	position: relative;
	font-size: 20px;margin-bottom: 2rem;
	    padding-left: 0.5rem;
}
article h4::after,
.hotel_info h4::after {
	content: '';
	width: 100%;
	background: #0087a9;
	height: 2px;
	position: absolute;
	bottom: -5px;
	left: -7px;
}
.detail_img {
	float: left;
}
.detail {
width: 420px;
    float: right;
}
.detail dl {
	margin-bottom: 0;
}
.detail dt {
	display: inline-block;
	padding: 0.1rem 0.5rem;
	background-color: #19b2d8;
	color: #fff;
	font-size: 11px;
}
.detail dd {
	display: inline-block;
	font-size: 13px;
}
.plan_lead {
	font-size: 12px;
	position: relative;
	padding: 0.5rem;
	margin-bottom: 0.5rem;
}
.plan_lead::before {
	content: '';
	height: 30px;
	width: 30px;
	position: absolute;
	border-top: 2px solid #19b2d8;
	border-left: 2px solid #19b2d8;
	top: 0;
	left: 0;
}
.plan_lead::after {
	content: '';
	height: 30px;
	width: 30px;
	position: absolute;
	border-bottom: 2px solid #19b2d8;
	border-right: 2px solid #19b2d8;
	bottom: 0;
	right: 0;
}
.feature_tag li {
	color: #ff571d;
	background: #ffe200;
	border-radius: 5px;
	padding: 0.1rem 1rem;
	display: inline-block;
	margin-right: 3px;
	font-size: 11px;
	font-weight: bold;
}
.price_box {
	position: relative;
}
.price_box p {
	color: #0087a9;
	font-weight: bold;
	font-size: 11px;
	border-bottom: 1px dashed #0087a9;
	margin-bottom: 0.5rem;
	
}
.price_box dd {
	position: absolute;
    right: 110px;
    font-size: 20px;
    font-weight: bold;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif"
}
.price_box button {
	border: none;
	border-radius: 5px;
	background: #ff571d;
	color: #fff;
	font-size: 10px;
	font-weight: bold;
	padding: 0.5rem 1rem;
	position:absolute;
	top: 20px;
	right: 0;
	cursor: pointer;
}
article details {
	width: 100%;
    position: relative;
	padding-top: 1rem;
}
article summary {
	color: #ff571d;
	border-bottom: 1px solid;
	font-size: 11px;
	position: absolute;
	right: 0;
	top: 10px;
}
details h4 {
	color: #ff571d;
    border: none;
}
details h4::after {display: none;}


@media screen and (max-width: 1000px) {
	.detail {
		width: 100%;
		float: none;
	}
	.detail_img {
		float: none;
		margin: 0 auto 10px;
		display: block;
	}
	article h4 {
		font-size: 16px;
	}
}

h3.title_bar {
	background-color: #0087a9;
	color: #fff;
	font-size: 22px;
	font-weight: bold;
	padding: .3rem .8rem;
}
.hotel_detail {position: relative}
.hotel_detail .ChangeElem_Btn_Content {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 340px
}
.hotel_detail .ChangeElem_Btn {
	background-color: #fff;
	width: 100px;
	height: 80px;
	padding: 0;
	overflow: hidden;
	border-radius: 0;
	margin-left: 5px;
	margin-top: 3px;
}
.hotel_detail .ChangeElem_Btn img {
	width: auto;
	height: 100%;
}
.hotel_detail .tab_inner {
	padding: 0;
	border: none;
	margin-bottom: 0;
}
.ChangeElem_Panel img {
	vertical-align: top;
}
.photo-detail {
	display: inline-block;
    max-width: 330px;
    background: url(../img/dot_wb.gif) repeat 0 0 transparent;
    font-size: 14px;
	padding: 1rem 1rem 1rem 2rem;
	min-height: 130px;
	line-height: 1.3;
	position: relative;
}
.photo-detail::after {
	content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    top: 40px;
    left: 0;
    border: 20px solid transparent;
    border-left: 20px solid #fff;
}
.detail_lead {font-size: 15px;}
.photo-detail p {
	margin-bottom: 0;
}
.hotel_detail_img {
	display: inline;
	margin-right: 10px;
}



@media screen and (max-width: 960px) {
	.hotel_detail .ChangeElem_Btn_Content {
		position: relative;
		width: 100%;
		text-align: center;
	}
	.ChangeElem_Panel img {
		width: 100%;
		max-width: 406px;
	}
	.photo-detail {
		width: 100%;
		max-width: 100%;
		margin-bottom: 1rem;
	}
	.photo-detail::after {
		display: none;
	}
	.hotel_detail_img img {
		display: block;
		margin: 5px auto;
	}
	.hotel_detail .swiper-pagination {
		bottom: 0!important;
	}
}

.plan_info h4,
.hotel_info h4,
.caution h4 {
	color: #000;
}
.hotel_info dl {
	border-bottom: 1px dotted #1EA3D0;
	font-size: 15px;
	padding-bottom: 5px;
}
.hotel_info dl dt {
	background-color: #1EA3D0;
	color: #fff;
	width: 150px;
	display: inline-block;
	font-weight: bold;
	text-align: center;
	padding: 0.5rem;
	margin-right: 1rem;
}
.hotel_info dl dd {
	display: inline-block;
}

.room_type th,
.room_type td {
	border: 1px solid #d0d0d0;
	text-align: center;
	padding: 0.5rem 1rem;
}
.room_type th {
	background-color: #D5D6D7;
}
.room_type td {}

.table_amenity th,
.table_amenity td {
	border: 1px solid #d0d0d0;
	text-align: center;
	padding: 0.5rem;
	font-size: 14px;
}
.table_amenity {
	width: 100%;
	margin-bottom: 1rem;
}
.table_amenity tr {
    display: inline-table;
    width: 25%;
}
.table_amenity th { width: 40px;background-color: #D5D6D7;}
.table_amenity td { }
.map_in{float: left;}
.map_in iframe {
	width: 485px;
	height: 280px;
}
.map_detail {
	width: 255px;
	padding: 10px;
	display: inline-block;
	background: url("../img/dot_wb.gif") repeat 0 0 transparent;
	float: right;
	min-height: 280px;
}
.map_detail dl {
	border: none;
	margin-bottom: 0;
}
.map_detail dl dt {
	background-color: transparent;
	color: #000;
	width: 100%;
	text-align: left;
	border-bottom: 1px dotted;
	padding: 0;
	margin-bottom: 10px;
}
.map_detail dl dd {
	padding: 2px;
}
@media screen and (max-width: 960px) {
	.map_in {
		float: none;
	}
	.map_in iframe {
		width: 100%;
	}
	.map_detail {
		width: 100%;
		float: none;
	}
	.table_amenity tr {
		width: 50%;
	}
}
.side_area .side_search_ttl,
.side_search_ttl {
	background: url(../img/title_icon_search.png) no-repeat left center transparent;
    padding-left: 3rem;
    border-bottom: 2px solid #0087a9;
    line-height: 2;
    margin-bottom: 1rem;
}
.pc_hide .side_search_ttl {margin: 20px 5px;}
.side_area .search-form {
	width: 235px;
	padding: 10px;
	margin-bottom: 1rem;
}
.side_area .search-form table th,
.side_area .search-form table td {
	display: inline-block;
}
.side_area .search-form input.s-btn {
	padding: 0.5rem 3rem;
}

.plan_img {
	float: left;
}
.plan_right {
	width: 440px;
	float: right;
}
.plan_right dl {
	margin-bottom: 0.3rem;
}
.plan_right dl dt {
	display: inline-block;
    padding: 0.1rem 0.5rem;
    background-color: #19b2d8;
    color: #fff;
    font-size: 11px;
}
.plan_right dl dd {
	display: inline-block;
    font-size: 13px;
}
.plan_right dl dd.text-right {
	color: #19b2d8;
	text-align: right;
}
.plan_right .text-underline {
	color: #19b2d8;
	border-bottom: 1px dotted;
}
.plan_right .plan_lead {
	min-height: 90px;
}
@media screen and (max-width: 960px) {
	.plan_img {
		float: none;
		display: block;
		margin: 0 auto 1rem;
	}
}
.tour_point {
	margin: 1rem 0 ;
}
.tour_point h4 {
	color: #ff571d;
	border: none;
}
.box_border {
	padding: 1rem;
    border: 3px solid #ff571d;
}
.box_border p {
	word-break: break-all;
	margin-bottom: 0;
}
.table_schedule {
	border-color: #0087a9;width: 100%;
}
.table_schedule th {
	text-align: center;
	background-color: #d6f1ff;
	padding: 1rem;
}
.table_schedule td {
	padding: 1rem;
	word-break: break-all;
}
.table_schedule .adjust {
	width: 75%;
}
.table_conditions {
	width: 100%;
	border-color: #0087a9;

}
.table_conditions th {
	text-align: center;
	background-color: #d6f1ff;
	padding: 1rem;
	
}
.table_conditions td {
	padding: 1rem;
	word-break: break-all;
}
.col-4 {
	width: 100%;
}
.col-4 li {
	width: 25%;
	float: left;
	padding: 5px;
}
.hotel_info_plan h5 {
	background-color: #19b2d8;
	color: #fff;
	font-weight: bold;
	margin-bottom: 0;
	padding: 0.3rem 1rem;
	font-size: 14px;
	height: 50px;
}
.bg_dot_bl {
	background: url("../img/dot_wb.gif") repeat 0 0 transparent;
	padding: 1rem;
	font-size: 12px;
}
.hotel_info_plan .bg_dot_bl {height: 250px; max-height: 250px; overflow-y: auto;}


.tab_list li {
	display: inline-block;
	border: 1px solid #0E7499;
	font-size: 14px;
	font-weight: bold;
	color: #0E7499;
	padding: 0.3rem 1.5rem;
	cursor: pointer;
}
.tab_list li.actives {
	background-color: #1EA3D0;
	color: #FFF;
}
.tab_list .tab_active {
	background-color: #0E7499;
	color: #fff;
}
.tab_list select {
	display: inline-block;
	width: 200px;
    height: auto;
    background-color: #fff;
    border: none;
    padding: 0.3rem 1.5rem;
}



.calender {
	    width: 49%;
    float: left;
    margin: 5px;
}
.calender thead {
	background-color: #1EA3D0;
	color: #fff;
}
.calender thead th {border: 1px solid #1EA3D0;text-align: center;padding: 0.3rem;}
.calender th,
.calender td {
	border: 1px solid;
	padding: 0.5rem 0.5rem;
	
}
.calender th {
	text-align: center;
}

@media screen and (min-width: 1000px) { 
	.calender td {
		vertical-align: top;
		height: 5rem;
	}
}
@media screen and (max-width: 660px) {
	.calender td {
		vertical-align: top;
		height: 4rem;
	}
}


.text_area {
	padding: 30px;
}
.table_calender .text_area,
.caution .text_area {
	background: url("../img/dot_yellow.gif") repeat 0 0 transparent;
	font-weight: bold;
	margin-top: 1rem;
}

.cta_area .inner {
	width: 1000px;
    margin: 0 auto;
    margin-top: 50px;
}
.cta_area p {
	text-align: center;
	font-size: 20px;
	word-break:break-all;
}
.mail_bnr p.mail_w {
	color: #fff;
	font-weight: bold;
}
.cta_area p.arrow {
	color: transparent;
    text-shadow: 0px 4px 0px #fff;
}
.cta_area .mail_bnr {
	background: url("../img/planinfo_footer_bg.jpg") no-repeat center center #19b3d9;
	padding: 3rem 0;
	background-size: contain;
}
.mail_inner {
	width: 500px;
	margin: 0 auto;
	background-color: #fff;
	padding: 50px;
	text-align: center;
	opacity: 0.8;
}
.mail_text a {
	font-size: 20px;
	color: #1EA3D0;
	text-decoration: underline;
	font-weight: bold;
	background: url("../img/title_icon_mail.png") no-repeat left 0 transparent;
	    padding-left: 3rem;
}

@media screen and (max-width: 960px) {
	.plan_right {
	    width: 100%;
		float: none;
	}
	.tour_point h4 {
		text-align: center;
	}
	.side_area .search-form {
		width: 100%;
	}
	.col-4 li {
		width: 50%;
		padding: 5px;
	}
	.col-4 li img {
		display: block;
		margin: 0 auto;
		width: 100%;
	}

	.tab_list{
		width: 90%;
	    margin: 5px auto;
	}
	.tab_list li {
		/* display: block; */
		display: inline-block;
		border: 1px solid #0E7499;
		font-size: 12px;
		font-weight: bold;
		color: #0E7499;
		/* padding: 0.3rem 1.5rem; */
		padding: 0.5rem 0.5rem;
		cursor: pointer;
	}
	.tab_list select {
		border: 1px solid #ccc;
	}

	.calender {
		width: 90%;
		margin: 5px auto 30px;
		float: none;
	}
	.cta_area .inner {
		width: 100%;
		padding: 5px;
	}
	.cta_area p {
		font-size: 18px;
	}
	.mail_inner {
		width: 80%;
		padding: 20px;
	}

}

.plan_info_page .side_area {
	display: flex;
	align-items: center;
	justify-content: center;
	position: -webkit-sticky;
	position: sticky;
	top: 10px;
}
@media screen and (max-width: 960px) {
	.plan_info_page .side_area {
		display: block;
		position: relative;
	}
}
.mail_inner dl {margin-bottom: 0}
.mail_inner dl dt {
	display: inline-block;
	width: 5rem;
	text-align: left;
	position: relative;
	margin-bottom: 0
}
.mail_inner dl dt::after {
	content: '：';
	position: absolute;
	right: 0;
	
}
.mail_inner dl dd {
	display: inline-block;
	margin-bottom: 0
}
@media screen and (max-width: 960px) {
	.mail_text a {
		font-size: 16px;
	}
	.mail_inner dl dt {
		text-align: center;
	}
	.mail_inner dl dt::after {
		display: none;
	}
}
#page-top {
    position: fixed;
    bottom: 16px;
    right: 5%;
	background-color: #0087a9;
	border-radius: 5px;
    opacity: 0;
	z-index: 5;
}
#page-top.fade-in {
    color: #000;
    opacity: 1;
    transition: opacity 1s;
}
#page-top img {
	padding: 20px;
}