/* ---------------------------------------------------------
	トップページ
--------------------------------------------------------- */
#title{
	margin: 0 auto 50px;
	width: 100%;
	height: 400px;
	background-position: center top;
	background-size: cover;
	background-repeat: repeat-x;
}
#title #title_inner{
	position: relative;
	margin: 0 auto;
	max-width: 960px;
	height: 100%;
	text-align: right;
	align-content: center;
}
#title_inner h2{
	width: 100%;
	font-size: clamp(2rem, 1.679rem + 1.368vw, 2.5rem);
	color: #8B5E3C;
	text-shadow:
		4px  4px 2px white,
		-4px  4px 2px white,
		4px -4px 2px white,
		-4px -4px 2px white,
		4px  0px 2px white,
		0px  4px 2px white,
		-4px  0px 2px white,
		0px -4px 2px white;
}
#title_inner h2 span{
	display: block;
	font-size: clamp(1.625rem, 1.385rem + 1.026vw, 2rem);
}
#title_inner p#title_caption{
	width: 100%;
	margin: 0.8em 0;
	font-size: clamp(1rem, 0.679rem + 1.368vw, 1.5rem);
	font-weight: bold;
	line-height: 1.2;
	color: #FFF;
	filter: drop-shadow(0px 0px 6px rgba(0,0,0,1));
}
#title_inner dl{
	margin: 0 0 0 auto;
	padding: 5px 10px;
	width: fit-content;
	line-height: 1.2;
	text-align: center;
	background: rgba(255,255,255,0.75);
	border: 1px solid #FFF;
	border-radius: 5px;
}
#title_inner dl dt{
	margin-bottom: 0.5em;
	font-size: 12px;
	text-align: center;
	color: #000;
}
#title_inner dl dd a{
	display: block;
	margin: 0 auto;
	width: fit-content;
	padding: 3px 20px;
	font-size: 14px;
	text-align: center;
	color: #FFF;
	background: #AC452B;
	border-radius: 5px;
}
#title_inner dl dd a span{
	display: block;
	font-size: 12px;
}
#title_inner dl dd a:hover{
	background: #C27D58;
}

#category_list{
	margin: 0 auto;
	max-width: 960px;
	gap: 30px 3.5%;
	align-items: stretch;
}
#category_list .category_outline{
	width: 31%;
}
.category_outline a{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	height: 100%;
	padding: 10px 10px 15px;
	background: #FFF;
	border: 1px solid #A9A18C;
	filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.15));
}
.category_outline a > *{
	width: 100%;
}
.category_outline a *{
	transition: 0.3s;
}
.category_outline a h3{
	position: absolute;
	left: -10px;
	right: -10px;
	margin: -10px auto 0;
	padding: 5px 0;
	font-size: 18px;
	text-align: center;
	color: #FFF;
	background: #A9A18C;
}
.category_outline a figure{
	margin-top: 2em;
	padding: 10px 0;
	font-size: 14px;
}
.category_outline a figure img{
	overflow: hidden;
	width: 100%;
	height: 170px;
	object-fit: cover;
	border: 1px solid #D9C5A0;
	border-radius: 10px;
}
.category_outline a figure figcaption{
	margin: 10px 0 0;
}
.category_outline a p.tour_list{
	position: relative;
	margin-top: auto;
	padding: 8px 0;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	color: #FFF;
	background: #6B8E23;
	border-radius: 8px;
}
p.tour_list::before{
	content: "";
	position: absolute;
	height: 10px;
	width: 10px;
	top: 50%;
	right: 7%;
	border-width: 2px 2px 0 0;
	border-color: #FFF;
	border-style: solid;
	transform: translateY(-50%) rotate(45deg);
}
p.tour_list::after{
	content: "";
	position: absolute;
	height: 10px;
	width: 10px;
	top: 50%;
	right: 5%;
	border-width: 2px 2px 0 0;
	border-color: #FFF;
	border-style: solid;
	transform: translateY(-50%) rotate(45deg);
}
.category_outline a:hover{
	border-color: #8B5E3C;
}
.category_outline a:hover h3{
	background: #8B5E3C;
}
.category_outline a:hover img{
	opacity: 0.75;
	transform: scale(1.025);
	border: 1px solid #C27D58;
}
.category_outline a:hover figcaption{
	color: #000;
}
.category_outline a:hover p.tour_list{
	background: #C27D58;
}

@media screen and (max-width:820px){
	#title{
		padding: 0 20px;
	}
	.category_outline a figure img{
		height: 135px;
	}
}
@media screen and (max-width:768px){
	#category_list .category_outline{
		width: 48%;
	}
	.category_outline a figure img{
		height: 205px;
	}
}
@media screen and (max-width:480px){
	#title{
		margin-bottom: 8em;
		padding: 0;
	}
	#title #title_inner{
		align-content: space-between;
		padding: 2em 0 1em;
		text-align: center;
	}
	#title_inner dl{
		position: absolute;
		top: 100%;
		left: 50%;
		transform: translate(-50%, 1em);
		padding: 0;
		width: 100%;
		line-height: 1.2;
		text-align: center;
		background: none;
		border: none;
	}
	#category_list .category_outline{
		width: 100%;
	}
	.category_outline a figure img{
		height: 53vw;
	}
}
@media screen and (max-width:375px){
	#title_inner p#title_caption{
		font-size: 15px;
	}
}

/* ---------------------------------------------------------
	カテゴリ
--------------------------------------------------------- */
#lead{
	position: relative;
	min-height: 300px;
	max-width: 960px;
	margin: 0 auto 50px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: right center;
}
#lead #lead_inner{
	padding-bottom: 20px;
}
#lead_inner h2{
	width: 65%;
	margin-bottom: 5px;
	padding-bottom: 5px;
	line-height: 1.2;
	color: #8B5E3C;
	font-size: clamp(1.5rem, 1.019rem + 2.051vw, 2.25rem);
	border-bottom: 3px solid #8B5E3C;
}
#lead_inner h2 span{
	display: block;
	font-size: clamp(1.125rem, 0.724rem + 1.709vw, 1.75rem);
}
#lead #lead_caption{
	width: 65%;
	line-height: 1.8;
	text-shadow:
		white 2px 0px,  white -2px 0px,
		white 0px -2px, white 0px 2px,
		white 2px 2px , white -2px 2px,
		white 2px -2px, white -2px -2px,
		white 1px 2px,  white -1px 2px,
		white 1px -2px, white -1px -2px,
		white 2px 1px,  white -2px 1px,
		white 2px -1px, white -2px -1px;
}

#tour_list{
	margin: 0 auto;
	max-width: 960px;
	gap: 30px 3.5%;
	align-items: stretch;
}
#tour_list .tour_outline{
	width: 31%;
}
.tour_outline a{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	height: 100%;
	padding: 10px 10px 15px;
	background: #FFF;
	border: 1px solid #A9A18C;
	filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.15));
}
.tour_outline a > *{
	width: 100%;
}
.tour_outline a *{
	transition: 0.3s;
}
ul.tour_outline_mark li{
	display: inline-block;
	margin: 0 3px 5px 0;
	padding: 1px 4px;
	font-size: 12px;
	color: #FFF;
	border-radius: 3px;
}
ul.tour_outline_mark li.new{
	padding: 0;
	font-size: 14px;
	color: #FFF;
	text-shadow:
		red 2px 0px,  red -2px 0px,
		red 0px -2px, red 0px 2px,
		red 2px 2px , red -2px 2px,
		red 2px -2px, red -2px -2px,
		red 1px 2px,  red -1px 2px,
		red 1px -2px, red -1px -2px,
		red 2px 1px,  red -2px 1px,
		red 2px -1px, red -2px -1px;
}
ul.tour_outline_mark li.day{
	background: #FF9900;
}
ul.tour_outline_mark li.cls{
	background: #2AAD39;
}
ul.tour_outline_mark li:last-of-type{
	margin-right: 0;
}
.tour_outline a h3{
	font-size: 18px;
	font-weight: bold;
	line-height: 1.2;
	color: #6B8E23;
}
.tour_outline a figure{
	padding: 10px 0;
	font-size: 14px;
}
.tour_outline a figure img{
	overflow: hidden;
	width: 100%;
	height: 170px;
	object-fit: cover;
	border: 1px solid #D9C5A0;
	border-radius: 10px;
}
.tour_outline a figure figcaption{
	margin: 10px 0 0;
}
.tour_outline a p.tour_detail{
	position: relative;
	margin-top: auto;
	padding: 8px 0;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	color: #FFF;
	background: #6B8E23;
	border-radius: 8px;
}
p.tour_detail::before{
	content: "";
	position: absolute;
	height: 10px;
	width: 10px;
	top: 50%;
	right: 7%;
	border-width: 2px 2px 0 0;
	border-color: #FFF;
	border-style: solid;
	transform: translateY(-50%) rotate(45deg);
}
p.tour_detail::after{
	content: "";
	position: absolute;
	height: 10px;
	width: 10px;
	top: 50%;
	right: 5%;
	border-width: 2px 2px 0 0;
	border-color: #FFF;
	border-style: solid;
	transform: translateY(-50%) rotate(45deg);
}
.tour_outline a:hover{
	border-color: #8B5E3C;
}
.tour_outline a:hover h3{
	color: #8B5E3C;
}
.tour_outline a:hover img{
	opacity: 0.75;
	transform: scale(1.025);
	border: 1px solid #C27D58;
}
.tour_outline a:hover figcaption{
	color: #000;
}
.tour_outline a:hover p.tour_detail{
	background: #C27D58;
}

@media screen and (max-width:820px){
	.tour_outline a figure img{
		height: 135px;
	}
}
@media screen and (max-width:768px){
	#tour_list .tour_outline{
		width: 48%;
	}
	.tour_outline a figure img{
		height: 205px;
	}
}
@media screen and (max-width:480px){
	#lead{
		background: none !important;
	}
	#lead_inner h2{
		width: 100%;
		margin-bottom: 10px;
	}
	#lead_inner #lead_caption{
		width: 100%;
		margin-top: 5px;
	}
	#tour_list .tour_outline{
		width: 100%;
	}
	.tour_outline a figure img{
		height: 53vw;
	}
}
@media screen and (max-width:375px){
	#title_inner p#title_caption{
		font-size: 15px;
	}
}

/* ---------------------------------------------------------
	ツアー
--------------------------------------------------------- */
#tour_detail{
	margin: 0 auto;
	max-width: 960px;
}
#tour_detail #tour_title{
	margin-bottom: 1.5em;
	padding-bottom: 5px;
	border-bottom: 3px solid #8B5E3C;
	gap: 0 10px;
	align-items: center;
}
#tour_title dl#code{
	text-align: center;
	border: 1px solid #8B5E3C;
}
dl#code dt{
	display: inline-block;
	padding: 2px 5px;
	font-size: 12px;
	font-weight: bold;
	color: #FFF;
	background: #8B5E3C;
}
dl#code dd{
	display: inline-block;
	padding: 2px 5px;
	font-size: 12px;
	font-weight: bold;
	color: #8B5E3C;
}
#tour_title h2{
	width: 100%;
	font-size: clamp(1.563rem, 1.122rem + 1.88vw, 2.25rem);
	line-height: 1.2;
	color: #8B5E3C;
}
#tour_detail #tour_explain{
	margin-bottom: 50px;
	gap: 0 3%;
}
#tour_explain #slider{
	width: 60%;
	height: auto;
	align-self: flex-start;
}
.bx-viewport{
	height: auto !important;
}
ul.bxslider li{
	width: 100%;
	height: calc(375px + 3.2em);
	height: calc(var(--bxH) + 3.2em);
	font-size: 12px;
}
.bx-wrapper li img{
	height: 375px;
	height: var(--bxH);
}
ul.bxslider li span{
	display: block;
	margin-top: 5px;
	height: 3.2em;
	text-align: center;
}
.bx-wrapper .bx-pager{
	padding: 0 !important;
	line-height: 1.0;
}
.bx-wrapper .bx-controls-direction a{
	margin-top: calc(-16px - 1.75em) !important;
}
ul.bxslider li{
	display: none;
}
.bx-viewport ul.bxslider li,
.oneslide ul.bxslider li{
	display: block !important;
}

#tour_explain #tour_text{
	width: 37%;
	font-size: 16px;
	line-height: 1.7;
}
#tour_explain #tour_text.nopct{
	width: 100%;
}
#tour_text em,
#tour_text strong{
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 0.5em;
}
#lead_explain ol#lead_point{
	width: 32%;
	font-size: 16px;
	border-top: 1px dotted #E23035;
}
ol#lead_point li{
	margin-top: 5px;
	padding: 10px 0 10px 1.0em;
	text-indent: -1.2em;
	border-bottom: 1px dotted #E23035;
}
ol#lead_point li::before{
	content: "●";
	margin-right: 0.3em;
	color: #E23035;
}
ol#lead_point li em{
	color: #E23035;
	font-weight: bold;
}
#lead_explain #tour_text.noslide{
	width: 65%;
	margin-top: 0;
}
#lead_explain #tour_text.noslide.nopoint{
	width: 100%;
	margin-top: 0;
}

#tour_schedule{

}
#tour_schedule table{
	width: 100%;
	border-top: 1px solid #A9A18C;
	background: #FFF;
}
#tour_schedule table caption{
	padding: 5px 0;
	font-weight: bold;
	text-align: center;
	color: #FFF;
	background: #A9A18C;
}
#tour_schedule table tr{
	border-bottom: 1px solid #A9A18C;
}
#tour_schedule table th{
	font-size: 14px;
	font-weight: normal;
	text-align: center;
	white-space: nowrap;
	background: #F6F6F6;
}
#tour_schedule table th,
#tour_schedule table td{
	padding: 8px 5px;
	vertical-align: middle;
	border-right: 1px dotted #A9A18C;
}
#tour_schedule table th:nth-of-type(2n){
	border-left: 1px solid #A9A18C;
}
#tour_schedule table th:nth-of-type(2n){
	border-left: 1px solid #A9A18C;
}
#tour_schedule table td:last-of-type,
#tour_schedule table th:nth-of-type(3){
	border-right: none !important;
}
#tour_schedule table td.meal{
	text-align: center;
	vertical-align: middle;
}
#tour_schedule #notice{
	margin-top: 5px;
	justify-content: space-between;
}
#notice dl{
	margin-top: 5px;
	font-size: 14px;
	gap: 0 4%;
	align-self: flex-start;
}
#notice dl dt{
	display: inline-block;
	vertical-align: top;
	font-weight: bold;
	color: #8B5E3C;
}
#notice dl dd{
	display: inline-block;
}
#tour_detail #caution{
	margin-top: 50px;
	padding: 10px 20px 10px calc(20px + 1em);
	font-size: 12px;
	color: #F00;
	background: #FFFFEF;
	border: 1px solid #F00;
	border-radius: 5px;
}
#caution p{
	text-indent: -1em;
	line-height: 1.2;
}
#caution p:first-of-type{
	margin-bottom: 0.5em;
}
#caution p::before{
	content: "※";
}
@media screen and (max-width:480px){
	#tour_explain #slider,
	#tour_explain #tour_text{
		width: 100%;
	}
	#tour_explain #slider{
		margin-bottom: 2em;
	}
}