@charset "utf-8";
/* ===================================================
	Meal CSS
====================================================== */

/* ---------------------------------------------------
	共通
------------------------------------------------------ */
section h3.tit {
	display: -webkit-flex; display: -ms-flex; display: flex;
	-ms-align-items: center; align-items: center; justify-content: center;
	width: 100%; height: 500px; background: no-repeat center center;
	-webkit-background-size: cover; background-size: cover;
}
section h3.tit .eng { color: #fff;}

section .cnav {
	display: -webkit-flex; display: -ms-flex; display: flex;
	justify-content: center; margin: 50px 0 10px;
}
section .cnav li { margin: 0 30px;}
section .cnav li a { padding: 0 0 25px; display: block; position: relative; font-size: 18px;}
section .cnav li a::after {
	content: ''; width: 26px; height: 26px; margin: 0 0 0 -13px;
	position: absolute; left: 50%; bottom: 0;
	background: url(../img/icon_arrow_b.svg) no-repeat center center;
	-webkit-background-size: 100% auto; background-size: 100% auto;
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
	-webkit-transition: transform 0.5s;
	-o-transition: transform 0.5s;
	transition: transform 0.5s;
}
section .cnav li a:hover { text-decoration: none;}
section .cnav li a:hover::after {
	-webkit-transform: rotate(90deg) translateX(3px);
	-ms-transform: rotate(90deg) translateX(3px);
	transform: rotate(90deg) translateX(3px);
}

section > div {/* padding: 60px 0 80px; */}

section h4 { margin: 0 0 35px;}
section .inner {max-width: 1000px;margin: 0 auto;}

section [class*='layout'] {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	justify-content: space-evenly;
	width: 1000px;
}
section [class*='layout'] .image {width: 45%;}
section [class*='layout'] .detail, .detail_bottom {width: 45%;/* padding: 0 calc( (31.4% - 290px) / 2); */}

section .layout1 {
	-webkit-flex-direction: row-reverse;
	-ms-flex-direction: row-reverse;
	flex-direction: row-reverse;
	/* margin-bottom: 80px; */
}

section .caption {margin: 0 0 15px !important;font-size: 26px;}

@media screen and (max-width: 600px) {
	section h3.tit { height: 275px;}
	section h3.tit span { text-indent: 5px;}
	section h3.tit .eng { text-indent: 3px;}

	section .cnav { margin-top: 25px;}
	section .cnav li { margin: 0 10px;}
	section .cnav li a { font-size: 14px;}

	section > div {padding: 0;}

	section h4 { width: 92%; margin: 0 auto 20px;}
	section .inner { width: 92% !important;}

	section [class*='layout'] { display: block;}
	section [class*='layout'] .image,
	section [class*='layout'] .detail { width: 100%;}
	section [class*='layout'] .detail { padding: 0; margin: 15px 0 0;}

	section .caption { margin-bottom: 10px; font-size: 19px;}
}



/* ---------------------------------------------------
	sec1
------------------------------------------------------ */
#sec1 h3.tit {background: url(../../plan/img/sec3_tit_pc.jpg)  right top no-repeat;max-height: 300px;background-size: 100%;}

/* sec1a */
#sec1a { padding-bottom: 100px;}
#sec1a .detail p:not(:last-child) {margin: 0px 0 10px;}
#sec1a .detail li span { font-weight: bold;}
#sec1a .detail li span::before { content: '*';}
#sec1a .detail li span::after { content: '･･･'; font-weight: normal;}

/* sec1b */
#sec1b .inner {
	display: -webkit-flex; display: -ms-flex; display: flex;
	justify-content: space-between; width: 1400px;
}
#sec1b .inner div { width: 48.6%;}
#sec1b .inner dl { padding: 0 6.6%; margin: 35px 0 0;}
#sec1b .inner dt { text-align: center;}
#sec1b .inner dd .btn { display: block; width: 280px; padding: 10px; margin: 20px auto 0;}

/* sec1c */
#sec1c .inner { width: 1100px; overflow: hidden;}
#sec1c .slick { height: 300px; overflow: hidden;}
#sec1c .slick.slick-initialized { height: auto;}
#sec1c .slick.slick-slider { width: 1140px; max-width: calc(100% + 40px); margin: 0 -20px 75px;}
#sec1c .slick-slide > div { margin: 0 20px;}
#sec1c .slick dl { margin: 10px 0 0; line-height: 1.6;}
#sec1c .slick dt { font-size: 18px;}

#sec1c .bnr_col { text-align: center;}

@media screen and (max-width: 600px) {
	#sec1 h3.tit {background-image: url(../../plan/img/sec3_tit_sp.jpg);max-height: 250px;}

	/* sec1a */
	#sec1a { padding-bottom: 50px;}
	#sec1a .detail { margin-top: 40px;}

	/* sec1b */
	#sec1b .inner { display: block;}
	#sec1b .inner div { width: 100%;}
	#sec1b .inner div:not(:last-child) { margin: 0 0 30px;}
	#sec1b .inner dl { padding: 0; margin-top: 15px;}
	#sec1b .inner dt { text-align: left;}
	#sec1b .inner dd .btn { width: 100%; margin-top: 15px;}

	/* sec1c */
	#sec1c .slick.slick-dotted.slick-slider { max-width: calc(100% + 20px); margin: 0 -10px 30px;}
	#sec1c .slick-slide > div { margin: 0 10px;}
	#sec1c .slick dt { font-size: 16px;}
	#sec1c .slick dd { font-size: 14px;}
}



/* ---------------------------------------------------
	sec2
------------------------------------------------------ */
#sec2 h3.tit { background-image: url(../../meal/img/sec2_tit_pc.jpg);}

#sec2 .detail .attention { margin: 15px 0 0; color: #cb503c;}
#sec2 .detail .attention li { margin: 0 0 3px;}
#sec2 .detail .attention li::before { content: '※';}
#sec2 .btn, #sec1 .btn {display: block;padding: 10px;margin: 20px 0;}

/* sec2a */
#sec2a .image {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 42.7% 57.3%;
	grid-template-columns: 42.7% 57.3%;
	-ms-grid-rows: auto auto;
	grid-template-rows: auto auto;
}
#sec2a .image p:last-child {
	-ms-grid-row: 1; -ms-grid-row-span: 2; grid-row: 1 / 3;
	-ms-grid-column: 2; grid-column: 2;
}

/* IE11 */
#sec2a .image p:nth-child(2) { -ms-grid-row: 2; -ms-grid-column: 1;}


/* ---------------------------------------------------
	contact_col
------------------------------------------------------ */
.contact_col { padding: 50px 0 60px; text-align: center;}
.contact_col .caption { font-size: 18px;}
.contact_col .tel-link {
	display: inline-block; font-size: 30px; padding: 0 0 0 30px;
	background: url(../img/icon_tel_b.svg) no-repeat left center;
	-webkit-background-size: 35px auto; background-size: 35px auto;
}

@media screen and (max-width: 600px) {
	.contact_col { padding: 30px 4% 50px; font-size: 14px;}
	.contact_col .caption { font-size: 16px;}
	.contact_col .tel-link { font-size: 24px;}
}

#plan{
	/* background: url(../../plan/img/bg_family.jpg?24); */
}

body {
	/* font-weight: 600; */
}

.facility {
	display: flex;
	/* justify-content: space-evenly; */
	padding: 0 20px;
	width: 100%;
	max-width: 1400px;
	align-items: center;
}

.img.facility {
	display: block;
	width: 47%;
	max-width: 400px;
}

.img.facility img {
	max-width: 100%;
	margin-bottom: 20px;
	border-radius: 10px;
	box-shadow: 1px 1px 15px 0px #858585;
}

.text.facility {
	width: 58%;
	line-height: 2.5rem;
	display: block;
}

.text.facility h5 {
	font-size: 22px;
	font-weight: 500;
	color: #dd8f25;
	padding-bottom: 12px;
}

.flex.facility {
	padding: 30px 0;
	display: flex;
	justify-content: space-evenly;
	align-items: center;
	margin: auto;
}

.btn.facility {
	max-width: 450px;
	width: 100%;
	line-height: normal;
}

.slide-navigation figure {
	width: 98% !important;
	height: 20p;
}

.caption.sub {
	font-size: 17px;
	font-weight: 500;
}

.caption.sub span, .underline span {
	background: linear-gradient(transparent 60%, #fffe54 60%);
	border-bottom: none;
}

.underline span {
	font-weight: 500;
}

p span {
	border-bottom: 3px dotted #c6c6c6;
	line-height: 1.8em;
}

.inner.facility {
	display: block;
	padding: 0;
	max-width: 1000px;
}

.flex.ski {
	display: flex;
	justify-content: space-around;
	text-align: center;
	/* margin: auto; */
	width: 100%;
	max-width: 1100px;
}

.card.ski {
	margin: auto;
	width: 33%;
	max-width: 350px;
	padding: 40px 20px;
	/* background-color: #fff; */
	/* box-shadow: 1px 1px 10px 0px #b0b0b0; */
}

.image.ski {
	width: 100% !important;
	display: block !important;
	max-width: 250px;
	margin: auto;
}

.text.ski {
	padding-top: 15px;
}

.btn.ski {
	max-width: 450px;
	width: 100%;
}

.center_btn {
	width: 100%;
	display: flex;
	justify-content: center;
}

.flex.bottom {
	display: flex;
	justify-content: space-between;
	padding-top: 25px;
}

.text.bottom {
	text-align: left;
	font-size: 14px;
}

.image.bottom {
	width: 40%;
}

.text.bottom {
	width: 55%;
	padding-top: 25px;
	line-height: 1.8rem;
}

.detail_bottom img {
	padding-top: 25px;
}

.detail_bottom p span {
	line-height: 2.5em;
}

.image {
	padding-top: 25px;
}

.caption.bottom {
	border-bottom: none;
	font-size: 20px;
	font-weight: 500;
	color: #ff8989;
}

.small {
    font-size: 13px;
    padding-top: 10px;
}

.flex.bottom_btn {
	width: 100%;
	max-width: 450px;
}

.clm.bottom_btn {
	width: 100%;
	max-width: 450px;
}

.inner.layout.text {
	display: block;
	margin: auto;
	text-align: center;
	line-height: 2.5em;
	font-size: 1.2rem;
	font-weight: 400;
}

.is-pc{
	display: none;
}
  
.is-sp{
	display: block;
}

.inner.card {
	display: flex;
}

.flex_card {
	padding: 10px 10px 50px;
	width: 33%;
}

@media screen and (max-width: 600px) {
	.facility {
		padding: 0;
	}
	.flex.facility {
		display: block;
	}

	.img.facility {
		width: 100%;
		padding: 20px 0 0px 0;
	}

	.img.facility img {
		box-shadow: none;
		border-radius: 0;
	}

	.text.facility {
		width: 100%;
	}

	.text.facility h5 {
		font-size: 18px;
	}

	.flex.ski {
		display: block !important;
	}

	.card.ski {
		width: 100%;
	}

	.flex.bottom {
		display: block;
	}

	.detail_bottom {
		width: 100%;
		line-height: 2.5rem
	}

	.text.bottom {
		width: 100%;
		line-height: 2.5em;
	}

	.inner.layout.text {
		font-size: 16px;
		text-align: left;
	}

	.is-pc{
		display: block;
	}
	  
	.is-sp{
		display: none;
	}
	
	.inner.card {
	    display: block;
    }

	.flex_card {
		width: 100%;
	}

	section .tit {
		font-weight: 500;
		text-align: center;
	}

	.slick-next {
		right: 0 !important;
	}

	.slick-prev {
		left: 0px !important;
		z-index: 1;
	}
}

.text_card p  {
	text-align: center;
	font-size: 0.8rem;
	line-height: 1.6rem;
	letter-spacing: 0.1rem;
}

.text_card h5 {
	text-align: center;
	font-size: 1.1rem;
	font-weight: 600;
	color: #b58500;
	padding-bottom: 3px;
	margin-bottom: 6px;
	border-bottom: #b58500 1px solid;
}


.text_card {
	padding: 10px;
}

.text_card p {
	text-align: left;
}

.image01 {
	display: inline-block;
    box-shadow: 8px 8px 5px #bbbbbb;
    transform: rotate(-3deg);
}

.image02 {
	display: inline-block;
    box-shadow: 8px 8px 5px #bbbbbb;
    transform: rotate(1deg);
}

.image03 {
	display: inline-block;
    box-shadow: 8px 8px 5px #bbbbbb;
    transform: rotate(5deg);
}

@charset "utf-8";
/* ===================================================
	Access CSS
====================================================== */

.lead_col .inner ul { font-size: 0;}
.lead_col .inner li { display: inline-block; margin: 0 30px 0 0; font-size: 15px;}
.lead_col .inner li a {
	display: inline-block; padding: 0 0 0 30px;
	background: url(../img/icon_arrow_y.svg) no-repeat left center;
	-webkit-background-size: 30px auto; background-size: 30px auto;
	color: #85621e;
}


/* ---------------------------------------------------
	共通
------------------------------------------------------ */
section h3.tit {
	display: -webkit-flex; display: -ms-flex; display: flex;
	-ms-align-items: center; align-items: center; justify-content: center;
	width: 100%; height: 500px; background: no-repeat center center;
	-webkit-background-size: cover; background-size: cover; color: #fff;
}
section h3.tit .eng { color: #fff;}

section .cnav {
	display: -webkit-flex; display: -ms-flex; display: flex;
	justify-content: center; margin: 50px 0 10px;
}
section .cnav li { margin: 0 30px;}
section .cnav li a { padding: 0 0 25px; display: block; position: relative; font-size: 18px;}
section .cnav li a::after {
	content: ''; width: 26px; height: 26px; margin: 0 0 0 -13px;
	position: absolute; left: 50%; bottom: 0;
	background: url(../img/icon_arrow_b.svg) no-repeat center center;
	-webkit-background-size: 100% auto; background-size: 100% auto;
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
	-webkit-transition: transform 0.5s;
	-o-transition: transform 0.5s;
	transition: transform 0.5s;
}
section .cnav li a:hover { text-decoration: none;}
section .cnav li a:hover::after {
	-webkit-transform: rotate(90deg) translateX(3px);
	-ms-transform: rotate(90deg) translateX(3px);
	transform: rotate(90deg) translateX(3px);
}


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

@media screen and (max-width: 600px) {
	section h3.tit { height: 275px;}
	section h3.tit span { text-indent: 5px;}
	section h3.tit .eng { text-indent: 3px;}

	section .cnav { margin-top: 25px;}
	section .cnav li { margin: 0 23px;}
	section .cnav li a { font-size: 14px;}

	section > div {padding: 40px 0 30px;}

	section .inner { width: 92% !important;}
}



/* ---------------------------------------------------
	sec1
------------------------------------------------------ */
#sec1 h3.tit { background-image: url(../../access/img/sec1_tit_pc.jpg);}

#sec1 #map_col { width: 1400px; max-width: 96%; padding: 0; margin: 70px auto 20px; border: 1px solid #cdc8bc;}
#sec1 #map_col iframe { display: block; max-width: 100%;}

#sec1 h4.tit { margin: auto;}
#sec1 h4.tit + p { text-align: center;}
#sec1 h4.tit + p span { color: #cb503c;}

#sec1 .route_box,
#sec1 .route,
#sec1 .route ul,
#sec1 .route li {display: -webkit-flex;display: -ms-flex;display: flex;}
#sec1 .route_box {width: 1000px;margin: 50px auto 0;justify-content: space-between;}
#sec1 .route {
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	width: 330px;
	text-align: center;
	font-size: 17px;
	padding: 5px;
}
#sec1 .route .acc_tit { padding: 10px; background: rgba(255,255,255,0.7);}
#sec1 .route ul {
	-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	justify-content: space-between; flex-grow: 1;
	position: relative; z-index: 0;
}
#sec1 .route ul:before {
	content: ""; display: block; position: absolute; z-index: -1; top: 0; bottom: 0;
	left: 50%; margin: 0 0 0 -2.5px; width: 5px; height: 100%; background: #c5bab2;
}
#sec1 .route li {padding: 0;}
#sec1 .route li > span {display: block;width: 100%;}
#sec1 .route li.point > span {width: 90%;margin: auto;padding: 10px 0;}
#sec1 .route li > span span { display: inline-block;}
#sec1 .route .point {background: url(../img/bg.jpg) center center;border: 1px solid #c5bab2;display: block;}
#sec1 .route.first li.point.second,
#sec1 .route.second .point.second,
#sec1 .route.third .point.second {
    position: relative;
}
#sec1 .route .point .small { font-size: 15px;}
#sec1 .route .point a {
	padding: 10px 40px;
	border: 1px solid #c5bab2;
	font-size: 15px;
}
#sec1 .route .point a:hover {
	text-decoration: none;
	background: #c5bab2;
}

#sec1 .route .goal { background: #33231a; color: #fff;}
#sec1 .route .time {
	-ms-align-items: center;
	align-items: center;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	flex-grow: 1;
	padding: 20px 10px;
	font-size: 15px;
}
#sec1 .route span.caption {
	position: absolute;
	font-size: 11px;
	/* color: #fff; */
	top: -29px;
	z-index: 99999;
	/* right: -92px; */
	width: 120px !important;
	background: none !important;
}
#sec1 .route .time span { display: block; padding: 15px 0; background: url(../img/bg.jpg) center center;}

#sec1 .bg_dark .route .point,
#sec1 .bg_dark .route .time span { position: relative; z-index: 0;}
#sec1 .bg_dark .route .point::before,
#sec1 .bg_dark .route .time span::before {
	content: ''; width: 100%; height: 100%;
	position: absolute; left: 0; top: 0; z-index: -1;
	background: rgba(60, 31, 15, 0.06);
}

#sec1c .btn { display: block; width: 300px; padding: 10px; margin: 30px auto 0;}

@media screen and (max-width: 600px) {
	#sec1 h3.tit { background-image: url(../../access/img/sec1_tit_sp.jpg);}

	#sec1 #map_col { width: 92%; height: 65vw; margin: 40px auto 0;}
	#sec1 #map_col iframe { height: 100%;}

	#sec1 h4.tit { margin-bottom: 15px;}
	#sec1 h4.tit + p { text-align: left;}

	#sec1 .route_box,
	#sec1 .route,
	#sec1 .route ul,
	#sec1 .route li { display: block;}
	#sec1 .route_box { width: 100%; margin-top: 20px;}
	#sec1 .route { width: 100%;}
	#sec1 .route+.route { margin: 20px 0 0;}

	#sec1 .route .acc_tit { position: relative;}
	#sec1 .route .acc_tit::after {
		content: '▼'; margin: -6px 0 0;
		position: absolute; right: 10px; top: 50%;
		font-size: 12px; line-height: 1;
	}
	#sec1 .route .acc_tit.active::after {
		content: '▲'; margin: -6px 0 0;
	}

	#sec1c .btn { width: 100%; margin-top: 20px;}
}



/* ---------------------------------------------------
	sec2
------------------------------------------------------ */
#sec2 h3.tit { background-image: url(../../access/img/sec2_tit_pc.jpg);}

#sec2 [class*="icon_"] {
	background-repeat: no-repeat;
	-webkit-background-size: 28px auto; background-size: 28px auto;
}
#sec2 .icon_link { background-image: url(../img/icon_link.svg);}
#sec2 .icon_access { background-image: url(../img/icon_access.svg);}
#sec2 .icon_walk { background-image: url(../img/icon_walk.svg);}
#sec2 .icon_car { background-image: url(../img/icon_car.svg);}

#sec2 h3.tit + div { padding-bottom: 0; text-align: center;}
#sec2 h3.tit + div .caption { margin: 0 0 15px; font-size: 26px;}
#sec2 h3.tit + div .btn { display: block; width: 420px; padding: 10px; margin: 25px auto 0;}
#sec2 h3.tit + div .btn .icon_link {
	display: inline-block; padding: 0 35px 0 0;
	background-position: right center;
}

#sec2 [class*="box_"] { width: 1100px; max-width: 96%; margin: 0 auto;}
#sec2 [class*="box_"] dt { border-bottom: 1px solid #bbafa6; font-size: 22px;}
#sec2 .box_s dd p[class*="icon_"],
#sec2 .box_l dt [class*="icon_"] {
	padding: 0 0 0 30px; background-position: left center;
	color: #85621e;
}
#sec2 [class*="box_"] .btn_col {
	display: -webkit-flex; display: -ms-flex; display: flex;
	justify-content: space-between;
}
#sec2 [class*="box_"] .btn_col a { display: block; padding: 5px; background: rgba(255,255,255,0.4);}
#sec2 [class*="box_"] .btn_col [class*="icon_"] {
	display: inline-block; padding: 0 0 0 25px; background-position: left center;
	-webkit-background-size: 22px auto; background-size: 22px auto;
}
#sec2 [class*="box_"] .btn_access { width: 205px; max-width: 60.3%;}
#sec2 [class*="box_"] .btn_link { width: 125px; max-width: 36.8%;}

#sec2 .box_s {
	display: -webkit-flex; display: -ms-flex; display: flex;
	-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
	justify-content: space-between;
}
#sec2 .box_s > div {
	width: 340px; max-width: calc( (100% - 40px) / 3);
	padding: 0 0 65px; margin: 35px 0 80px; position: relative;
}
#sec2 .box_s dt { padding: 20px 0 5px; text-align: center;}
#sec2 .box_s dt span { display: block; font-size: 13px;}
#sec2 .box_s dd { padding: 10px 0 0; text-align: center;}
#sec2 .box_s dd p[class*="icon_"] { display: inline-block;}
#sec2 .box_s dd p { text-align: left;}
#sec2 .box_s dd .btn_col { width: 100%; position: absolute; left: 0; bottom: 0;}

#sec2 .box_l > div,
#sec2 .box_l dt {
	display: -webkit-flex; display: -ms-flex; display: flex;
	-ms-align-items: center; align-items: center;
	justify-content: space-between;
}
#sec2 .box_l > div:not(:last-child) { margin: 0 0 70px;}
#sec2 .box_l .image { width: 560px; max-width: 53%;}
#sec2 .box_l dl { width: 480px; max-width: 45%;}
#sec2 .box_l dt { padding: 0 0 5px;}
#sec2 .box_l dt [class*="icon_"] { font-size: 15px;}
#sec2 .box_l dd { padding: 15px 0 0;}
#sec2 .box_l dd .btn_col { width: 340px; margin: 25px 0 0 auto;}

#sec2a,
#sec2b { padding-bottom: 0;}
#sec2c h4.tit { margin: 0 0 35px;}


/* sec2d */
#sec2d h4 { margin: 0 0 35px;}
#sec2d .btn_col {
	display: -webkit-flex; display: -ms-flex; display: flex;
	justify-content: center;
}
#sec2d .btn_col li { width: 420px; margin: 0 8px;}
#sec2d .btn_col a { display: block; padding: 10px;}
#sec2d .btn_col a span {
	display: inline-block; width: 320px; padding: 0 35px;
	background-position: right center;
	-webkit-box-sizing: border-box; box-sizing: border-box;
}


@media screen and (max-width: 600px) {
	#sec2 h3.tit { background-image: url(../../access/img/sec2_tit_sp.jpg);}

	#sec2 [class*="icon_"] { -webkit-background-size: 24px auto; background-size: 24px auto;}

	#sec2 h3.tit + div { width: 92%; padding-bottom: 20px; margin: 0 auto; text-align: left;}
	#sec2 h3.tit + div .caption { font-size: 19px;}
	#sec2 h3.tit + div .btn { width: 100%; padding: 5px 10px; margin-top: 10px;}
	#sec2 h3.tit + div .btn .icon_link { display: block; padding: 0 30px; line-height: 1.6;}

	#sec2 h4.tit { width: 92%; margin: 0 auto 20px;}

	#sec2 [class*="box_"] { width: 92%;}
	#sec2 [class*="box_"] img { width: 100%;}
	#sec2 [class*="box_"] dt { font-size: 19px;}
	#sec2 [class*="box_"] .btn_col { display: block;}
	#sec2 [class*="box_"] .btn_col [class*="icon_"] { padding: 0 25px;}
	#sec2 [class*="box_"] .btn_col li:not(:last-child) { margin: 0 0 8px;}
	#sec2 [class*="box_"] .btn_access,
	#sec2 [class*="box_"] .btn_link { width: 100%; max-width: none;}

	#sec2 .box_s { display: block; padding: 0 0 40px;}
	#sec2 .box_s > div { width: 100%; max-width: none; padding-bottom: 0; margin: 0 0 40px;}
	#sec2 .box_s > div:last-child { margin-bottom: 0;}
	#sec2 .box_s dt { padding: 15px 0 10px; text-align: left;}
	#sec2 .box_s dd { text-align: left;}
	#sec2 .box_s dd p[class*="icon_"] { display: block;}
	#sec2 .box_s dd .btn_col { position: static; margin: 15px 0 0;}

	#sec2 .box_l > div,
	#sec2 .box_l dt { display: block;}
	#sec2 .box_l > div:not(:last-child) { margin-bottom: 40px;}
	#sec2 .box_l .image,
	#sec2 .box_l dl { width: 100%; max-width: none;}
	#sec2 .box_l dt { padding: 15px 0 10px;}
	#sec2 .box_l dt [class*="icon_"] { display: block; font-size: 16px;}
	#sec2 .box_l dd { padding-top: 10px;}
	#sec2 .box_l dd .btn_col { width: 100%; margin-top: 15px;}

	/* sec2d */
	#sec2d h4 { margin-bottom: 20px;}
	#sec2d .btn_col { display: block; width: 92%; margin: 0 auto;}
	#sec2d .btn_col li { width: 100%; margin: 0;}
	#sec2d .btn_col li:not(:last-child) { margin-bottom: 10px;}
	#sec2d .btn_col a span { display: block; width: auto; padding: 0 30px;}
}
.ifsp {
	display: none;
}
@media screen and (max-width: 600px) {
    #sp_nav {
        padding: 0;
    }
	.ifsp {
		display: block;
	}
	.ifpc {
		display: none !important;
	}
}

.road-closed {
	color: #33231a !important;
}

#sec1 h3.spring {
	background: url(../../plan/img/outdoor-pass-top.jpg)  right top no-repeat;max-height: 300px;background-size: 100%;
}


@media screen and (max-width: 600px) {
    #sec1 h3.spring {
        background-image: url(../../plan/img/outdoor-pass-top-sp.jpg);
    }

	.road-closed-span {
		display: block;
	}

	.road-closed-p {
		text-align: center !important;
		font-size: 0.9rem;
		padding: 0 25px;
	}
}

.road-closed-p {
	margin-top: 20px;
	text-align: center;
	margin-bottom: 20px;
}

.tit {
    font-size: 30px;
    letter-spacing: 8px;
    line-height: 1.5;
    text-align: center;
    margin-top: 0px;
    margin-bottom: 30px;
}

.tit .eng {
    display: block;
    margin: 0 0 10px;
    color: #977441;
    font-size: 12px;
    letter-spacing: 3px;
    text-indent: 3px;
}

.tit span {
    display: inline-block;
    text-indent: 8px;
}

@media screen and (max-width: 600px) {
    .tit {
        margin-bottom: 15px;
    }

        .tit {
        font-size: 22px;
        letter-spacing: 5px;
        /* text-align: left; */
    }

    .tit .eng {
        margin-bottom: 5px;
        font-size: 10px;
        text-indent: 0;
    }

        .tit span {
        text-indent: 0;
        font-size: 21px;
    }
}

.other-content_a {
    padding-top: 0;
    display: block;
    clear: both;
    width: 1280px;
    max-width: 96%;
    margin: 55px auto 55px;
}

.other-box-2column {
  position: relative !important; /* 子要素のabsolute配置の基準になります */
  padding-top: 30px; /* タグのスペースを確保するため、上部にパディングを追加 */
}

.other-box-tag {
  position: absolute; /* 親要素 (.other-box-2column) を基準に配置します */
  top: -51px; /* 親要素の上端に配置 */
  left: 0; /* 親要素の左端に配置 */
  background-color: #152f0a; /* タグの背景色（茶色） */
  color: #fff; /* テキストの色（白） */
  padding: 3px 17px; /* 内側の余白 */
  font-size: 18px; /* 全体のフォントサイズ */
  font-weight: bold; /* フォントを太く */
  /* z-index: 10; */ /* 他のコンテンツの上に表示されるようにする */
  /* 必要に応じて角丸など */
  /* border-bottom-right-radius: 5px; */ /* 右下を少し角丸にするなど、タグ感を出す */
  border-radius: 5px 5px 0px 0px;
}

.other-box-tag span {
  font-size: 1.4em; /* 親要素のフォントサイズに対して1.5倍の大きさ */
  vertical-align: middle; /* 上下の位置を調整 */
  margin-left: 3px; /* 「特典」との間に少しスペース */
}

.top-plan-flex {
    gap: 20px;
    display: flex;
    margin-top: 20px !important;
}

  .outdoor-pass-pricing {
      /* font-family: sans-serif; */
      padding: 20px;
      /* background: #f9f9f9; */
      background: rgba(60, 31, 15, 0.06);
      margin-bottom: 105px;
    }

    .outdoor-pass-pricing .table-wrapper {
      overflow-x: auto;
      margin: 0 auto 2em;
      max-width: 1100px; /* 全テーブル共通の最大幅 */
    }

    .outdoor-pass-pricing table {
      border-collapse: collapse;
      width: 100%;
      /* background-color: #fff; */
      table-layout: fixed; /* 各列の幅を均等に */
    }

    .outdoor-pass-pricing th,
    .outdoor-pass-pricing td {
      border: 1px solid #c5bab2;
      padding: 10px 12px;
      text-align: left;
      vertical-align: top;
      word-break: break-word;
    }

    .outdoor-pass-pricing th {
      /* background-color: #e0eff6; */
      white-space: nowrap;
    }

    .outdoor-pass-pricing caption {
      font-weight: bold;
      margin-bottom: 0.5em;
      text-align: left;
      font-size: 1.1em;
    }

    @media screen and (max-width: 600px) {
      .outdoor-pass-pricing table {
        font-size: 14px;
      }
      .outdoor-pass-pricing th,
      .outdoor-pass-pricing td {
        padding: 8px;
      }
    }

    .section-contents {
      /* max-width: 1200px; */
      width: 100%;
      margin: 0 auto 105px;
    }

    .content-block {
      display: flex;
      align-items: center;
      margin-bottom: 40px;
      /* background-color: #ffffff; */
      /* border-radius: 8px; */
      overflow: hidden;
      padding: 50px 15%;
      /* box-shadow: 0 2px 8px rgba(0,0,0,0.1); */
    }

    .content-block img {
      width: 70%;
      object-fit: cover;
    }

    .content-text {
      padding: 20px;
      width: 50%;
    }

    /* 左画像・右テキスト */
    .content-left {
      flex-direction: row;
      background: rgba(60, 31, 15, 0.06);
      /* padding: 50px 300px; */
    }

    /* 右画像・左テキスト */
    .content-right {
      flex-direction: row-reverse;
    }

    /* スマホ表示 */
    @media screen and (max-width: 768px) {
      .content-block {
        flex-direction: column;
        width: 90%;
        margin: 30px auto;
        padding: 0px;
      }
      .content-block img,
      .content-text {
        width: 100%;
      }
      /* 右画像のブロックだけ入れ替え */
      .content-right {
        flex-direction: column;
      }
    }

    .info-box {
    /* border: 1px solid #dddddd; */
    background-color: #f4f7f9;
    padding: 15px;
    /* margin: 20px auto; */
    margin-top: 10px;
    margin-bottom: 10px;
    width: 55%;
    min-width: 600px;
    box-sizing: border-box;
    line-height: 1.6;
    /* border-radius: 7px; */
    margin: 0 auto;
}


.plans {
      display: flex;
      flex-wrap: wrap;
      gap: 20px;
      max-width: 1200px;
      margin: 0 auto;
      justify-content: center;
      margin-bottom: 105px;
      margin: 0 auto;
      margin-bottom: 80px;
    }

    .plan-card {
      background: #fff;
      border-radius: 10px;
      /* padding: 20px; */
      flex: 1 1 250px;
      max-width: 280px;
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      margin: 0 auto;
    }

    .plan-title {
      font-size: 18px;
      font-weight: bold;
      color: #fff;
      background-color: #83aa41;
      /* border: 1px solid #a38888; */
      padding: 10px 0;
      border-radius: 6px 6px 0 0;
      width: 100%;
      margin-bottom: 10px;
    }

    .plan-title.standard { background-color: #f5b933; }
    .plan-title.business { background-color: #e37a2d; }
    .plan-title.premium  { background-color: #7b58c4; }

    .plan-price {
      font-size: 24px;
      font-weight: bold;
      margin: 10px 0;
    }

    .plan-note {
      font-size: 14px;
      color: #281414;
      /* margin-bottom: 15px; */
      padding: 10px 20px 20px 20px;
    }

    .plan-limit {
      font-weight: bold;
      font-size: 16px;
      margin-bottom: 5px;
    }

    .plan-count {
      font-size: 24px;
      color: #e37a2d;
      margin-bottom: 15px;
    }

    .plan-features {
      font-size: 14px;
      text-align: left;
      margin-top: auto;
    }

    .plan-features li {
      margin-bottom: 5px;
    }

    @media (max-width: 768px) {
      .plans {
        flex-direction: column;
        align-items: center;
        margin-top: 30px;
        margin-bottom: 50px;
      }
    }

    .col-sales {
    padding: 1.5em;
    /* border-radius: 20px; */
    margin-top: 20px;
    margin: 0 auto;
    background-color: #ffffff;
    display: flex;
    margin-bottom: 50px;
    text-align: center;
}
.dep-container-column {
    /* flex-basis: 30%; */
    max-width: 50%;
    /* flex: 1; */
    /* display: flex; */
    /* flex-direction: column; */
    /* margin-left: 30px; */
}

.custom-textarea-wrapper {
    position: relative;
    width: 100%;
    /* margin-top: 20px; */
}

.custom-textarea-content-box {
    /* border: 1px solid #52525266; */
    padding: 0px 15px 15px 15px;
    min-height: 100px;
    box-sizing: border-box;
    margin-top: 40px;
}

.custom-textarea-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: block !important;
    margin-top: 20px;
}

.qa-question {
    display: flex;
    align-items: flex-start;
    text-align: left;
    margin-bottom: 15px;
}

.qa-question .check-icon {
    font-size: 1.5em;
    color: #17592d;
    width: 25px;
    text-align: left;
    flex-shrink: 0;
    margin-right: 5px;
}

.fas {
    font-family: "Font Awesome 6 Pro";
}

.fa-check-circle:before {
    content: "\f058";
}

.pla_col_dep {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

.p-footer-shop__tel {
    font-size: 3rem;
    margin-top: 0;
    padding-left: 2rem;
    line-height: 1.6;
    font-family: "YuMincho", "Yu Mincho", serif;
    color: rgb(80, 66, 66);
}

.p-footer-shop__tel::before {
    /* top: 44%; */
    /* width: 1.4rem; */
    /* height: 1.4rem; */
    /* background: url(./img/icon-telephone.svg) no-repeat center / contain; */
    /* content: ""; */
    /* height: 1.0625rem; */
    /* left: 0; */
    /* position: absolute; */
    /* top: 50%; */
    /* translate: 0 -50%; */
    /* width: 0.8125rem; */
    font-family: 'Font Awesome 6 pro';
    content: "\f095";
    font-weight: 600;
    padding-right: 10px;
    color: #88827b;
}

    .contact-box {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 20px;
      max-width: 800px;
      margin: 40px auto;
      background-color: #f3f3f3;
      border-radius: 8px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.05);
      gap: 20px;
    }

    .contact-text {
      font-size: 16px;
      color: #333;
      flex: 1;
    }

.contact-text p {
    line-height: 2rem;
    }

    .contact-phone {
      font-size: 20px;
      color: #0078D7;
      font-weight: bold;
      white-space: nowrap;
    }

    @media (max-width: 600px) {
      .contact-box {
        flex-direction: column;
        align-items: flex-start;
      }

      .contact-phone {
        margin-top: 10px;
      }
    }

    @media only screen and (max-width: 767px) {
    .top-plan-flex {
        flex-direction: column;
        gap: 0px;
        margin-top: 0px;
    }

        .tit {
        font-size: 22px;
        letter-spacing: 5px;
        /* text-align: left; */
        margin-top: 0px;
        margin-bottom: 0px;
    }

    .other-box-tag {
    position: absolute;
    top: -46px;
    left: 0;
    padding: 3px 15px;
    font-size: 16px;
    font-weight: bold;
}

.other-box-2column {
        margin: 0 auto 80px !important;
    }

    .other-box-2column-02 {
        margin-bottom: 0px !important;
    }

    .other-box-2column-03 {
        margin-top: 0px !important;
    }

    .top-plan-flex-02 {
        margin-top: 0px !important;
    }

        .other-content_a {
        margin: 0px auto 30px !important;
    }

    .outdoor-pass-pricing {
    /* font-family: sans-serif; */
    padding: 20px;
    /* background: #f9f9f9; */
    background: rgba(60, 31, 15, 0.06);
    margin-bottom: 50px;
    margin-top: 20px;
}

.plan-card {
    flex: 1 1 250px;
    max-width: 280px;
    width: 100%;
    /* margin: 0 auto; */
    margin-bottom: 15px;
}

.section-contents {
    max-width: 1100px;
    margin: 0 auto 60px;
}

.col-sales {
    padding: 1.5em;
    /* border-radius: 20px; */
    margin-top: 20px;
    margin: 50px auto;
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
    width: 90%;
}

.dep-image-container {
    max-width: 100%;
}

.dep-container-column {
    max-width: 100%;
}

.custom-textarea-content-box {
    margin-top: 0px;
}
}


.dep-image-container {
    text-align: center;
    margin: 0 auto;
}

.col12 {
    margin-bottom: 7rem;
}

.col12 h1 {
    /* padding-left: 8%; */
    font-size: 30px;
    /* font-family: "YakuHanJP", dnp-shuei-mincho-pr6n, sans-serif; */
    font-weight: 600;
    margin: 0 auto;
    margin-bottom: 0.5em;
    padding: .3rem 0;
    text-align: center;
    color: #503a3a;
    border-top: 1px solid #8f7e7e;
    border-bottom: 1px solid #8f7e7e;
    width: 50%;
    /* max-width: 500px; */
    min-width: 300px;
}


@media only screen and (max-width: 767px) {
    .col12 h1 {
		font-size: 21px;
    }
}

.top_cardArea .tit {
	font-size: 20px !important;
}

.styled-heading {
    position: relative;
    padding-left: 20px;
    font-weight: bold;
    text-align: left;
    margin-bottom: 20px;
}

.styled-heading::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 5px;
    height: 100%;
    background-color: #986c57;
    border-radius: 2px;
}

.styled-heading span {
    display: block;
    font-size: 22px;
}

.styled-heading h2:after {
    position: absolute;
    top: 0;
    content: '';
    width: 8px;
    height: 100%;
    display: inline-block;
}

@media only screen and (max-width: 767px) {
    .styled-heading span {
    display: block;
    font-size: 20px;
}

.pc-br{
	display: none;
}

.p-footer-shop__tel {
    font-size: 2rem;
}

.col12 {
    margin-bottom: 0px;
}
}

.custom-textarea-wrapper .link_btn {
    /* margin-top: 20px; */
    text-align: center;
}

.custom-textarea-wrapper .btn {
    display: inline-block;
    font-size: 16px;
    background-color: #4c5a22;
    border: 1px solid #4c5a22;
    padding: 10px 30px;
    text-align: center;
    color: #fff;
    text-decoration: none;
    transition: .5s;
}


.custom-textarea-wrapper .btn:hover {
    background-color: #fff;
    color: #4c5a22;
    font-weight: 600;
}

@media screen and (max-width: 767px) {
  /* スマホ画面だけに適用されるスタイル */
  .custom-textarea-wrapper .link_btn {
        margin-bottom: 25px;
  }
}