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

/* indexのメインビジュアル */
.hdg-main-img {
	margin-top: 0;
	width: 100%;
	height: 25vh;
	padding: 20px;
  background: -moz-linear-gradient(180deg, transparent 90%, #ffffff), url(/tourism/recommende/img/hdg_bg.jpg) center;
	background: -webkit-linear-gradient(180deg, transparent 90%, #ffffff), url(/tourism/recommende/img/hdg_bg.jpg) center;
	background: linear-gradient(180deg, transparent 90%, #ffffff), url(/tourism/recommende/img/hdg_bg.jpg) center;
	background-size: cover !important;
}
.hdg-main-img-inner {
	margin: 0 auto;
	max-width: 1000px;
	height: 100%;
	padding: 0 20px;
	display: flex;
  justify-content: center;
  align-items: center;
}
.hdg-main-img-inner > .hdg-main-ttl {
	color: #ffffff;
	font-size: 3.6rem;
	letter-spacing: 0.2em;
}
@media screen and (min-width: 1366px) {
	.hdg-main-img {
		height: 35vh;
	}
	.hdg-main-img-inner > .hdg-main-ttl {
		font-size: 4.2rem;
	}
}
@media screen and (max-width: 767px) {
	.hdg-main-img {
		width: 100vw;
		margin-left: -10px !important;
		margin-right: -10px !important;
	}
	.hdg-main-img-inner > .hdg-main-ttl {
		font-size: 2.6rem;
	}
}

/* indexのデザイン調整 */
.l-content-body[data-type="recommende"] {
	padding:0;
}
@media screen and (min-width: 768px) {
	.l-content-body[data-type="recommende"] {
		max-width:100%;
	}
	.l-content-body[data-type="recommende"] .content {
		max-width:1000px;
		margin: 30px auto 0px;
		padding: 0 15px;
	}
}
@media screen and (max-width: 767px) {
	.l-content-body[data-type="recommende"] .content {
		padding: 0 10px;
	}
}

/* 下層のデザイン調整 */
.l-content-body[data-type="recommende-city"] {
	max-width: 100%;
	padding: 0;
	margin: 0;
}
.l-content-main[data-type="okinawa"] {
	background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/okinawa/img/body_bg_okinawa.jpg) center center;
	background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/okinawa/img/body_bg_okinawa.jpg) center center;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/okinawa/img/body_bg_okinawa.jpg) center center;
	background-size: cover;
	margin: 0;
}
.l-content-main[data-type="tokyo"] {
	background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/tokyo/img/body_bg_tokyo.jpg?190207) center center;
	background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/tokyo/img/body_bg_tokyo.jpg?190207) center center;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/tokyo/img/body_bg_tokyo.jpg?190207) center center;
	background-size: cover;
	margin: 0;
}
.l-content-main[data-type="tokyo-event"] {
	background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/tokyo/event/img/body_bg_tokyo_event.jpg) center center;
	background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/tokyo/event/img/body_bg_tokyo_event.jpg) center center;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/tokyo/event/img/body_bg_tokyo_event.jpg) center center;
	background-size: cover;
	margin: 0;
}
.l-content-main[data-type="fukuoka"] {
	background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/fukuoka/img/body_bg_fukuoka.jpg) center center;
	background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/fukuoka/img/body_bg_fukuoka.jpg) center center;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/fukuoka/img/body_bg_fukuoka.jpg) center center;
	background-size: cover;
	margin: 0;
}
.l-content-main[data-type="fukuoka-event"] {
	background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/fukuoka/event/img/body_bg_fukuoka_event.jpg) center center;
	background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/fukuoka/event/img/body_bg_fukuoka_event.jpg) center center;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/fukuoka/event/img/body_bg_fukuoka_event.jpg) center center;
	background-size: cover;
	margin: 0;
}
.l-content-main[data-type="nagoya"] {
	background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/nagoya/img/body_bg_nagoya.jpg) center center;
	background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/nagoya/img/body_bg_nagoya.jpg) center center;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/nagoya/img/body_bg_nagoya.jpg) center center;
	background-size: cover;
	margin: 0;
}
.l-content-main[data-type="yamaguchi"] {
	background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/yamaguchi/img/body_bg_yamaguchi.jpg) center center;
	background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/yamaguchi/img/body_bg_yamaguchi.jpg) center center;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/yamaguchi/img/body_bg_yamaguchi.jpg) center center;
	background-size: cover;
	margin: 0;
}
.l-content-main[data-type="event"] {
	background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/event/img/body_bg_event.jpg) center center;
	background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/event/img/body_bg_event.jpg) center center;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0)), url(/tourism/recommende/event/img/body_bg_event.jpg) center center;
	background-size: cover;
	margin: 0;
}
.article-inner {
	max-width: 1030px;
	margin: 0 auto;
}
.hdg-content {
	color: #ffffff;
	margin-bottom: 40px; 
}
.hdg-content > .hdg_ttl {
	font-size: 3.6rem;
	letter-spacing: 0.2em;
}
.hdg-content > .m-txt-lead {
	line-height: 3.5rem;
	margin-top: 25px;
}
.content-box {
	background: rgba(255,255,255,0.7);
}
.content-box > .m-img {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

@media screen and (min-width: 768px) {
	.article-inner {
		padding: 100px 15px 60px;
	}
	.l-content-related[data-type="recommende"] {
		max-width: 1000px;
		float: none;
		margin: 0 auto 0;
		box-sizing: border-box;
		padding: 80px 15px 100px;
	}
	.content-box {
		padding: 25px;
	}
	.l-content-head[data-type="on-bg"] {
		position: absolute;
	}
	.l-content-head[data-type="on-bg"] .m-nav-breadcrumb a {
		color: #cccccc;
	}
	.l-content-main[data-type="tokyo"] .m-list-bnr {
		display: flex;
		flex-wrap: wrap;
	}
}

@media screen and (max-width: 767px) {
	.l-content-related[data-type="recommende"] {
		margin: 0;
	}
	.article-inner {
		padding: 50px 10px 40px;
	}
	.content-box {
		padding: 15px;
	}
	.hdg-content > .hdg_ttl {
		font-size: 3rem;
	}
}

@media screen and (max-width: 900px) and (min-width: 768px) {
	.t-mode-rwd .l-content-body[data-type="recommende-city"] .l-content-main {
		padding: 0 !important;
	}
}

/* 東京用 エリア選択ボックス */
.area-selector label {
	padding-right: 12px;
}
.area-selector .m-frm-select {
	max-width: 296px;
	width: 100%;
}
.area-selector .m-frm-select select {
	width: 100%;
}

@media screen and (min-width: 1366px) {
	.area-selector .m-frm-select {
		max-width: 330px;
	}
	.area-selector label {
		padding-left: 15px;
	}
}
@media screen and (min-width: 768px) {
	.area-change-box {
		display: flex;
		flex-wrap: wrap;
		margin: 0 0 0 -20px;
		align-items: flex-end;
	}
	.area-selector, .area-changer {
		width: 50%;
		padding-left: 20px;
	}
	.area-changer .m-list-btn {
		margin: 0;
	}
}
@media screen and (max-width: 767px) {
	.area-change-box {
		margin: 0;
	}
	.area-changer .m-btn[data-type="em"] span {
		letter-spacing: 3px;
	}
}

/* ホテルボックス */
.hotel-box {
	padding: 0 0 0 20px;
	margin-top: 20px;
}
.hotel-box:hover {
	opacity: .7;
	transition: 0.3s ease all;
	cursor: pointer;
}

.hotel-box-inner {
	width: 100%;
	height: 100%;
	background: #f2f2f2;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
}
.hotel-main {
	position: relative;
}
.hotel-main .hotel-img {
	width: 100%;
	-moz-border-top-left-radius: 15px;
	-moz-border-top-right-radius: 15px;
	-webkit-border-top-left-radius: 15px;
	-webkit-border-top-right-radius: 15px;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}
.hotel-img-txt {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: auto;
	padding: 15px 10px 10px 10px;
	background: -moz-linear-gradient(top, transparent 15%, rgba(0,0,0,0.5));
	background: -webkit-linear-gradient(top, transparent 15%, rgba(0,0,0,0.5));
	background: linear-gradient(to bottom, transparent 15%, rgba(0,0,0,0.5));
}
.hotel-img-txt p {
	margin-top: 0;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.5);
}
.hotel-img-txt p.hotel-name {
	font-size: 1.5rem;
	font-weight: bold;
	color: #ffffff;
}
.hotel-img-txt p.hotel-name a {
	color: #ffffff;
	pointer-events: none;
}

.hotel-img-txt p.hotel-name a:hover {
	opacity: 1;
	text-decoration: none;
}
.hotel-img-txt p.hotel-address {
	font-size: 0.95em;
	color: #f2f2f2;
}
.hotel-introduction {
	padding: 15px;
}
.hotel-introduction p {
	margin: 0;
	font-size: 95%;
}

/* 3-2-1flex ホテルリスト */
.hotel-list {
	display: flex;
	flex-wrap: wrap;
	margin-left: -20px;
}
@media screen and (min-width: 1024px) {
	.hotel-list[data-col="3-2-1"] .hotel-box {
		width: 33.33333%;
	}
	.hotel-list[data-col="3-2-1"] .hotel-box:nth-child(-n+3) {
		margin-top: 0;
	}
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
	.hotel-list[data-col="3-2-1"] .hotel-box {
		width: 50%;
	}
  .hotel-list[data-col="3-2-1"] .hotel-box:nth-child(-n+2) {
    margin-top: 0px;
  }
}
@media screen and (max-width: 767px) {
	.hotel-list {
		flex-direction: column !important;
		margin-left: 0 !important;
	}
	.hotel-list[data-col="3-2-1"] .hotel-box {
		margin: 20px 0 0 0 !important;
		width: 100%;
		padding: 0 !important;
  }
  .hotel-list[data-col="3-2-1"] .hotel-box:first-child {
		margin-top: 0 !important;
  }
}

/* colorBox調整 */
#cboxOverlay {
	background: #000;
	z-index: 999;
}
#cboxLoadedContent {
	background: #fff;
  padding: 0;
  overflow: auto;
	-moz-box-shadow: 0px 1px 10px #000000;
	-webkit-box-shadow: 0px 1px 10px #000000;
	box-shadow: 0px 1px 10px #000000;
}
#cboxClose {
	top: -30px;
}
#colorbox, #cboxOverlay, #cboxWrapper {
  overflow: visible;
}
#cboxTitle {
  color: #fff;
}
#inline-content {
	margin: 20px;
}
#ajax-wrap {
  margin: 20px;
}

/* ホテル検索ポップアップ用 */
.l-wrapper[data-type="popup"] {
	padding-bottom: 15px;
}
.pop-hdg-h1 {
	width: 100%;
	padding: 2px 0 2px 10px;
	font-size: 2.2rem;
	font-weight: normal;
	line-height: 1.2;
	display: table-cell;
	border-left: 3px solid #000;
}
.m-frm-txt {
	display: flex;
}
.m-frm-txt input {
	margin-right: 10px;
}
img.ui-datepicker-trigger {
	border-radius: 3px;
}
.apo-radio {
 line-height: 2em;
}
@media screen and (max-width: 767px) {
	.apo-radio {
		line-height: 2em;
	}
}
.m-frm-select .selector {
	height: 100%;
	margin: 0;
	padding: 10px 17px 10px 10px;
	font-family: \30D2\30E9\30AE\30CE\89D2\30B4\20\50\72\6F\20\57\33, "Hiragino Kaku Gothic Pro", \30e1\30a4\30ea\30aa, Meiryo, \FF2D\FF33\20\FF30\30B4\30B7\30C3\30AF, "MS PGothic", sans-serif;
	text-indent: 0.01px;
	text-overflow: '';
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	box-sizing: border-box;
	border-radius: 3px;
	border: none;
	background: #fff;
}
.m-frm-select .selector.is-ios-adjust {
	padding: 9px 17px 9px 10px;
}
.selector.is-ios-adjust {
  font-size: 16px !important;
}
a.sel-link:hover {
	opacity: 1 !important;
	transition: none;
	cursor: default;
}
.num-select {
	margin-top: 20px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin-left: -20px;
}
.num-select-content {
	padding: 0 0 0 20px;
  margin-top: 10px;
}
#sub-button {
	background-color: #E02929;
}
@media screen and (min-width: 768px) {
	.num-select .num-select-content {
		width: 50%;
	}
  .num-select .num-select-content:nth-child(-n+2) {
    margin-top: 0px;
  }
	.num-select .num-select-content .m-frm-select {
		width: 100%;
	}
	.num-select[data-type="ch"] .num-select-content label {
		width: 32%;
		display: inline-block;
		padding-right: 5px;
	}
	.num-select[data-type="ch"] .num-select-content .m-frm-select {
		width: 60%;
	}
	.num-select .num-select-content .m-frm-select select {
		width: 100%;
	}
}
@media screen and (max-width: 767px) {
	.num-select {
		flex-direction: column !important;
		margin-left: 0 !important;
	}
	.num-select .num-select-content {
		margin: 10px 0 0 0;
		width: 100%;
		padding: 0 !important;
  }
  .num-select .num-select-content:first-child {
		margin-top: 0 !important;
  }
	.num-select-content label {
		display: inline-block;
		width: 7rem;
		padding-right: 5px;
	}
	.num-select .num-select-content .m-frm-select {
		width: 70%;
	}
	.num-select .num-select-content .m-frm-select select {
		width: 100%;
	}
	.num-select[data-type="ch"] .num-select-content label {
		width: 40%;
		display: inline-block;
		padding-right: 5px;
	}
	.num-select[data-type="ch"] .num-select-content .m-frm-select {
		width: 58%;
	}
}
.set-child-cnt {
	top:30px !important;
}
.set-child-cnt .m-hdg-lv5, .set-child-cnt .m-line {
	margin: 20px 0;
}
.set-child-cnt .m-hdg-lv5 .m-hdg {
	font-size: 1.6rem;
}
.ui-datepicker {
	width: 17em !important;
}
.ui-datepicker-title {
	font-size: 1em;
}
.ui-datepicker-calendar thead span {
	font-size: 1.1em;
}
.ui-datepicker td span, .ui-datepicker td a {
	font-size: 1.2em;
}
@media screen and (max-width: 768px) {
	.ui-datepicker {
		width: 20em !important;
	}
	.ui-datepicker-title {
		font-size: 1.2em;
	}
	.ui-datepicker-calendar thead span {
		font-size: 1.2em;
	}
	.ui-datepicker td span, .ui-datepicker td a {
		font-size: 1.5em;
	}
}

/* リンク無効 */
.disable {
	pointer-events: none;
}

/* 各トップのバナーリスト崩れ対策 */
@media screen and (min-width: 767px) {
	.m-list-bnr {
		display: flex;
		flex-wrap: wrap;
	}
}

#fareMod01 .m-form__content__wrap form > .inner,
#fareMod01 .m-form-cont__content__wrap form > .inner {
	background-color: #FFF9DF !important;
}

.mod-hide {
	display: none;
}