﻿@charset "UTF-8";

/* @class */

/* コース一覧 */
.subsection.tours-region {
	margin-bottom: 20px; }
	.tours-region ul.layout-flex {
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		-webkit-justify-content: center;
		justify-content: center;
		-ms-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap; }
		.tours-region li {
			margin-right: 10px;
			margin-bottom: 10px;  }
			.tours-region li:last-of-type {
				margin-right: 0; }
			.tours-region a {
				padding: 8px 1em;
				background-color: #999; }
				.tours-region a.current {
					background-color: rgb(38, 139, 186); }
				.tours-region a:hover,
				.tours-region a:focus {
					background-color: rgb(38, 139, 186);
					opacity: 1; }

.subsection.tours-search {
	position: relative;
	background-color: rgb(242, 242, 242); }
	.subsection.tours-search .shape-triangle {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		margin: auto;
		border: 25px solid transparent;
		border-top: 25px solid #fff; }
	.tours-search a:hover,
	.tours-search a:focus {
		text-decoration: none; }
	.subsection.tours-search .in-subsection {
		padding: 40px 0 20px; }
		.subsection.tours-search　h3.subheading a {
			color: #333; }
		.wrap-filter-sort * {
			font-size: .875rem;
			line-height: 1.2; }
		.search-fliter {
			text-align: left; }
		.search-sort {
			text-align: left; }
			.search-filter > span,
			.search-sort > span {
				float: left;
				width: 4em;
				margin-right: 1em;
				padding: 10px 0;
				text-align: right; }
			.search-filter p {
				overflow: hidden; }
			.search-filter a,
			.search-sort a {
				display: inline-block;
				margin: 0 5px 10px 0;
				padding: 10px 1em;
				border-radius: 4px;
				background-color: #999;
				color: #fff;
				font-weight: bold; }
			.search-filter a.current,
			.search-sort a.current {
				background-color: rgb(38, 139, 186); }

@media screen and (max-width: 768px) {
	.tours-region ul {
		padding: 0 20px; }
	.subsection.tours-search .in-subsection {
		padding: 40px 20px 20px; }
	.search-filter > span,
	.search-sort > span {
		display: block;
		float: none;
		width: 100%;
		margin-right: 0;
		margin-bottom: 10px;
		padding: 0;
		font-weight: bold;
		text-align: left; }
}

.routeinfo .dep-arr.layout-flex {}
	.routeinfo .dep-arr {
		margin-bottom: 20px;
		background-color: rgb(38, 139, 186);
		text-align: center; }
		.routeinfo .dep-arr > * {
			padding: 10px 20px;
			border-bottom: 2px solid rgb(38, 139, 186);
			border-right: 2px solid rgb(38, 139, 186); }
			.routeinfo .dep-arr .departure:first-of-type {
				border-left: 2px solid rgb(38, 139, 186); }
		.routeinfo .dep-arr .departure {
			position: relative;
			color: rgb(38, 139, 186);
			background-color: #fff;
			font-weight: bold; }
		.routeinfo .dep-arr .arrival {
			position: relative;
			color: rgb(38, 139, 186);
			background-color: #fff;
			font-weight: bold; }
			.routeinfo .dep-arr .box {
				padding-right: 10px; }
				.routeinfo .dep-arr .box .shape-triangle {
					width: 0;
					height: 0;
					border: 10px solid transparent;
					border-left: 10px solid #fff; }
	.body-routeinfo.layout-flex {
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		-webkit-justify-content: space-between;
		justify-content: space-between; }
		.body-routeinfo .show-tour-photos {
			width: 280px;
			margin-right: 20px; }
		.body-routeinfo .tour-description .m-moreinfo {
			text-align: left; }
		.body-routeinfo .tour-description .tour-tag {
			letter-spacing: -0.5em; }
			.body-routeinfo .tour-description .tour-tag li {
				display: inline-block;
				margin-bottom: 10px;
				margin-right: 10px;
				padding: 10px 1em;
				border: 1px solid #ccc;
				border-radius: 4px;
				font-weight: .875rem;
				font-weight: bold;
				line-height: 1.2;
				letter-spacing: normal; }
		.body-routeinfo.layout-flex .order-2 {
			-webkit-flex: 1;
			flex: 1; }
		.body-routeinfo.layout-flex .cta {
			width: 200px;
			margin-left: 20px; }
			.body-routeinfo .action-web h3.subheading-bg {
				margin-bottom: 10px;
				font-size: .875rem;
				text-align: center; }
			.body-routeinfo .action-tel h3.subheading-bg {
				font-size: .875rem;
				text-align: center; }
			.body-routeinfo.layout-flex .cta .m-button {
				display: block;
				background-color: rgb(251, 145, 0); }
				.body-routeinfo .division.action-tel p {
					padding: 10px;
					border: 1px solid #ccc; }
		
@media screen and (max-width: 768px) {
	.routeinfo .dep-arr.layout-flex {
		-ms-flex-wrap: nowrap;
		-webkit-flex-wrap: nowrap;
		flex-wrap: nowrap; }
	.routeinfo .dep-arr {
		width: 100%;
		overflow-x: auto;
		white-space: nowrap;
		-webkit-overflow-scrolling: touch; }
	.body-routeinfo {
		padding: 0 20px 20px; }
	.body-routeinfo.layout-flex {
		display: block; }
		.body-routeinfo.layout-flex > * {
			width: 100%; }
			.body-routeinfo .show-tour-photos {
				margin: 0 auto 20px;
				text-align: center; }
			.body-routeinfo .tour-description .m-moreinfo {
				text-align: center; }
			.body-routeinfo.layout-flex .cta {
				margin-left: 0;
				width: 100%; }
}

.subsection.tours-common {
	margin-bottom: 0;
	background-color: rgb(242, 242, 242); }
	.subsection.tours-common .division {
		margin: 0; }
	.subsection.tours-common .in-subsection {
		padding: 40px 0 40px; }
		.tours-common .conts-1 .in-division,
		.tours-common .conts-2 .in-division {
			padding: 20px;
			text-align: center; }
		.tours-common .conts-1 .wrap-item {
			width: 580px;
			margin: auto; }
		.tours-common .conts-2 .wrap-item {
			width: 1000px;
			margin: auto; }
		.tours-common .conts-1 .wrap-item.layout-flex,
		.tours-common .conts-2 .wrap-item.layout-flex {
			-webkit-box-pack: justify;
			-ms-flex-pack: justify;
			-webkit-justify-content: space-between;
			justify-content: space-between;
			-ms-flex-wrap: wrap;
			-webkit-flex-wrap: wrap;
			flex-wrap: wrap; }
			.tours-common .conts-1 .item {
				width: 180px;
				padding: 15px;
				border: 1px solid #ccc;
				border-radius: 4px;
				background-color: #fff; }
				.tours-common .conts-1 .item h4 {
					margin-top: 1em;
					line-height: 1.2; }
			.tours-common .conts-2 .item {
				position: relative;
				width: 220px;
				padding: 20px;
				background-color: rgb(38, 139, 186);
				color: #fff; }
				.tours-common .conts-2 .item h4 {
					margin-top: 1em;
					font-size: 1.125rem;
					line-height: 1.2; }
				.tours-common .conts-2 .item .shape-triangle {
					position: absolute;
					top: 0;
					bottom: 0;
					right: -30px;
					margin: auto;
					border: 15px solid transparent;
					border-left: 15px solid rgb(38, 139, 186); }

@media screen and (max-width: 768px) {
	.subsection.tours-common .in-subsection {
		padding-top: 0; }
	.tours-common .conts-1 p,
	.tours-common .conts-2 p {
		text-align: left; }
	.tours-common .conts-1 .wrap-item,
	.tours-common .conts-2 .wrap-item {
		width: 100%; }
	.tours-common .conts-1 .item {
		width: 48%; }
	.tours-common .conts-2 .wrap-item.layout-flex {
		display: block; }
	.tours-common .conts-2 .item {
		width: 100%;
		-js-display: flex;
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		-webkit-align-items: center;
		align-items: center;
		margin-bottom: 20px;
		padding: 15px; }
		.tours-common .conts-2 .item:last-of-type {
			margin-bottom: 0; }
		.tours-common .conts-2 .item .figure {
			max-width: 33%;
		/*-webkit-flex: 1;
			flex: 1;*/ }
			.tours-common .conts-2 .item h4 {
				margin-top: 0;
				margin-left: 1em; }
		.tours-common .conts-2 .item .shape-triangle {
			left: 0;
			right: 0;
			top: 100%;
			bottom: 0;
			margin: 0 auto;
			border: 15px solid transparent;
			border-top: 15px solid rgb(38, 139, 186); }
}

.date-prev,
.date-next {
	position: relative;
	padding: 5px 1em 5px 2em;
	border-radius: 4px;
	background-color: #333;
	color: #fff;
	font-size: .875rem;
	font-weight: bold; }
.date-next {
	padding: 5px 2em 5px 1em; }
	.date-prev:hover,
	.date-prev:focus,
	.date-next:hover,
	.date-next:focus {
		text-decoration: none;
		opacity: .5;
		-webkit-transition: 0.3s ease;
		transition: 0.3s ease; }
		.date-prev.inactive,
		.date-prev.inactive:hover,
		.date-prev.inactive:focus,
		.date-next.inactive,
		.date-next.inactive:hover,
		.date-next.inactive:focus {
			opacity: .5;
			cursor: default; }
		.date-prev::before {
			position: absolute;
			top: 0;
			bottom: 0;
			margin: auto;
			vertical-align: middle;
			content: ""; }
		.date-prev::before {
			left: 1em;
			width: 0.5em;
			height: 0.5em;
			border-bottom: 2px solid #fff;
			border-left: 2px solid #fff;
			webkit-transform: rotate(45deg);
			-ms-transform: rotate(45deg);
			-moz-transform: rotate(45deg);
			transform: rotate(45deg); }

/* 空席照会 */
.subsection.tours-date-top {}
	.subsection.tours-date-top > .layout-flex {
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		-webkit-justify-content: space-between;
		justify-content: space-between; }
		.subsection.tours-date-top .tour-name::after {
			display: block;
			clear: both;
			content: ""; }
			.subsection.tours-date-top .tour-name .cell-2 {
				float: right;
				font-size: .875rem;
				font-weight: normal; }
		.subsection.tours-date-top > .layout-flex .order-1,
		.subsection.tours-date-top > .layout-flex .order-2 {
			width: 580px; }
			.select-bus-number.layout-flex {
				-webkit-box-pack: center;
				-ms-flex-pack: center;
				-webkit-justify-content: center;
				justify-content: center; }
			.select-bus-number {
				margin-bottom: 30px; }
				.select-bus-number a {
					text-decoration: none; }
				.select-bus-number .number-prev,
				.select-bus-number .number-next {
					padding: 10px 1em;
					border-radius: 4px;
					background-color: #ddd;
					font-size: .875rem;
					font-weight: bold; }
				.select-bus-number .bus-number {
					position: relative;
					margin: 0 5px;
					padding: 10px 2em;
					background-color: rgb(38, 139, 186);
					color: #fff; }
				.select-bus-number .bus-number.current::after {
					position: absolute;
					left: 50%;
					bottom: -10px;
					width: 0;
					height: 0;
					margin-left: -10px;
					border-top: 10px solid rgb(38, 139, 187);
					border-right: 10px solid transparent;
					border-left: 10px solid transparent;
					content: ""; }
			.calendar-box .select-month {
				margin-bottom: 10px; }
			.calendar-box .select-month.layout-flex {
				-webkit-box-pack: justify;
				-ms-flex-pack: justify;
				-webkit-justify-content: space-between;
				justify-content: space-between;
				-webkit-box-align: center;
				-ms-flex-align: center;
				-webkit-align-items: center;
				align-items: center; }
				.calendar-box .select-month .year-month {
					line-height: 1; }
					.calendar-box .select-month .year-month .txt-year {
						font-size: 1rem;
						margin-right: 5px; }
					.calendar-box .select-month .year-month strong {
						font-size: 2.25rem; }
					.calendar-box .select-month .year-month .txt-month {
						font-size: 0.667em; }
					.body-calendar-box table {
						width: 100%;
						border-collapse: collapse;
						font-size: .875rem;
						line-height: 1;
						text-align: center; }
						.body-calendar-box table th {
							padding: 10px 0;
							border: 1px solid #ccc;
							background-color: #999;
							color: #fff;
							font-weight: normal;
							white-space: nowrap; }
						.body-calendar-box table td {
							padding: 10px 0;
							border: 1px solid #ccc;
							white-space: nowrap; }
							.body-calendar-box table a {
								color: #333;
								text-decoration: none; }
								.body-calendar-box table a:hover span,
								.body-calendar-box table a:focus span {
									opacity: .5;
									-webkit-transition: 0.3s ease;
									transition: 0.3s ease; }
								.body-calendar-box table a.past:hover span,
								.body-calendar-box table a.past:focus span,
								.body-calendar-box table a.seat-still:hover span,
								.body-calendar-box table a.seat-still:focus span {
									opacity: 1;
									-webkit-transition: 0 ease;
									transition: 0 ease;
									cursor: default; }
								.body-calendar-box a span {
									display: block;
									width: 1.5em;
									margin: auto;
									padding: .25em 0;
									border-radius: 4px;
									font-size: 1.25rem;
									font-weight: bold;
									color: #fff; }
								.body-calendar-box a.past span {
									background-color: #ccc; }
								.body-calendar-box a.still span {
									background-color: #ccc; }
								.body-calendar-box a.many span {
									background-color: rgb(123, 182, 48); }
								.body-calendar-box a.some span {
									background-color: rgb(255, 191, 0); }
								.body-calendar-box a.few span {
									background-color: rgb(251, 145, 0); }
								.body-calendar-box a.full span {
									background-color: red; }
	.tours-date-top ul.icons {
		margin-top: 20px; } 
    	.tours-date-top ul.icons li {
    		display: inline-block;
    		margin-right: 10px;
    		margin-bottom: 10px;
    		line-height: 1; }
    		.tours-date-top ul.icons span {
    			display: inline-block;
    			width: 1.5em;
    			margin-right: 5px;
    			padding: .25em 0;
    			border-radius: 4px;
    			color: #fff;
    			text-align: center; }
			 ul.icons span.icon-past {
				background-color: #ccc; }
			 ul.icons span.icon-seat-many {
				background-color: rgb(123, 182, 48); }
			 ul.icons span.icon-seat-some {
				background-color: rgb(255, 191, 0); }
			 ul.icons span.icon-seat-few {
				background-color: rgb(251, 145, 0); }
			 ul.icons span.icon-seat-full {
				background-color: red; }

			.tours-date-top .tourist-info {
				padding: 20px;
				border: 1px solid #ccc;
				border-radius: 4px; }
				.tours-date-top .tourist-info .m-moreinfo {
					text-align: left; }
			.tours-date-top .from-company {
				padding: 20px;
				border: 1px solid #ccc;
				border-radius: 4px; }

@media screen and (max-width: 768px) {
	.subsection.tours-date-top > .layout-flex {
		display: block; }
		.subsection.tours-date-top > .layout-flex .order-1,
    	.subsection.tours-date-top > .layout-flex .order-2 {
    		width: 100%; }
    		.tours-date-top .tourist-info,
    		.tours-date-top .from-company {
    			margin: 0;
    			padding: 0;
    			padding-top: 20px;
    			border: none; }
    			.tours-date-top .tourist-info .m-moreinfo {
    				text-align: center; }
}

#searchStatus,
#searchLoading{
	display:none;
}

#searchStatus .in-section {
	text-align: center; }
	#searchStatus .in-section h2 {
		font-size: 1.25rem; }
	#searchStatus .in-section .ytext {
		font-size: 1.25rem;
		font-weight: bold;
		color: rgb(251, 145, 0); }
	#searchStatus .in-section .stext {
		font-size: 1rem; }
	#searchStatus .in-section ul {
		display: inline-block; }
	#searchStatus .in-section ul li {
		text-align: left;
		font-size: 1rem; }
.section-result {}
	.section-result .in-section {
		padding-top: 0;
		padding-bottom: 40px; }
.loading {
	text-align: center; }

.section-nothing {}
	.section-nothing .in-section {
		padding-top: 0;
		padding-bottom: 40px; }
		.section-nothing img {
			margin-bottom: 20px; }
@media screen and (max-width: 768px) {
	.section-search {
		margin-bottom: 0; }
	.section-search .in-section,
	.section-nothing .in-section {
		padding-right: 20px;
		padding-left: 20px; }
}
