@charset "UTF-8";

h2{font-family: "Noto Serif JP", serif;}

header{background:#000;color:#FFF;position:relative;z-index:100;
	& .row{width:100%;padding:0.75em 1em;display:flex;align-items:center;justify-content:space-between;
		& .header_lc{display:flex;align-items:center;
			& .sitename{display:block;width:4em;height:4em;margin-right:1em;
				& picture{
					& >img{}
				}
			}
			& .header_caption{font-size:0.8125em;line-height:1.5;}
		}
		& > .header_rc{position:relative;
			& .pannel_btn{border:2px solid #DAB300;border-radius:9999px;height:2.5em;padding:0 3em 0 1em;display:flex;color:#DAB300;font-weight:700;width:auto;align-items:center;
				& > span{display:block;width:1em;height:2px;background:#DAB300;position:absolute;right:1em;top:50%;margin-top:-1px;
					&:before,&:after{content:'';display:block;width:100%;height:2px;background:#DAB300;position:absolute;left:0;transition:all 0.2s;}
					&:before{top:-0.3em;}
					&:after{top:0.3em;}
				}
				
				&.new_regist{
					&:after{content:'';display:display:inline-block;position:absolute;right:1em;top:50%;margin-top:-0.75em;width:1.5em;height:1.5em;background:url(../images/parts/icon_regis_ylw.svg) center center no-repeat;background-size:contain;}
				}
			}

			& .pannel_btn.active{
				& > span{background:none;
					&:before{transform:rotate(-45deg);top:0;}
					&:after{transform:rotate(45deg);top:0;}
				}
				&+.member_menu{display:block;}
			}
			& .member_menu{position:absolute;right:0;top:3em;background:000;z-index:1001;width:100%;transition:all 0.2s;display:none;
				& > *{display:flex;align-items:center;;height:3em;font-weight:700;font-size:0.875em;width:100%;background:#ECD980;padding:0 0.75em;box-sizing:border-box;color:#000;}
				& > *+*{margin-top:2px;}
				& > .logout_btn{background:#DAB300;}
			}
		}
	}
	& .global_menu{width:100%;background:#222222;
		& .gm{padding:0em 1em; text-align:center;max-width:960px;width:90vw;margin:0 auto;justify-content:center;
			& > a{display:flex;align-items:center;justify-content:center;height:3em;color:#DAB300;font-size:0.875em;font-weight:500;padding:0 1.5em;letter-spacing:0.1em;
				&:hover{color:#FFF;background:#454545;}
			}
		}
	}
}

.page_head{height: 10em;background: #182A87 url(../images/parts/page_head_bg.webp) center bottom no-repeat;background-size:100% auto;color: #FFF;display: flex;align-items: center;justify-content: center;margin-bottom:4em;
	& > .row{
		& h1{display:block;margin:0 auto;text-align:center;font-family: "Noto Serif JP", serif;    letter-spacing: 0.1em;}
	}
}
.page_body{}

section{
	&.bg_gry{background:#f4f4f4;}
 & > .row{width:90vw;max-width:1000px;
	&.w100{width:100%;max-width:none;}
 }
}

.information_lists{border-top:1px solid #000;
	& > li{border-bottom:1px solid #000;padding:1em 0;display:flex;
		& time{flex-shrnk:0;margin-right:1em;}
		& a{text-decoration:underline;
			&:hover{text-decoration:none;}
		}
	}
}

.top_mv{padding:6em 0 6em;background:#000 url(../images/parts/top_mv_bg.webp) center top no-repeat;background-size:auto 100%;display:flex;align-items:center;justify-content:center;
	&:before{content:'';display:block;position:absolute;left:50%;bottom:5em;width:45vw;aspect-ratio: 1 / 0.7;background:url(../images/parts/top_mv_car.webp) right bottom no-repeat;background-size:100% auto;max-width:632px;}
	& .row{color:#FFF;}
	& h1{font-size:3.75em;margin-bottom:0.75em;display:inline-block;text-shadow: 0 0 10px #000000;
		& small{text-align:center;}
	}
	& .cont{
		& .lead{line-height:2.2;letter-spacing:0.075em;}
	}
	
}

section.hokkaido_category,
section.front_reservation{padding-top:6em;}

.hokkaido_category_card{font-family: "Noto Serif JP", serif;
	& picture{width:100%;aspect-ratio: 1 / 1;
		&:before{background:#00000099;}
	}
	& .card_title{display:flex;align-items:center;justify-content:center;width:100%;height:100%;pointer-events:none;font-size:2em;color:#FFF;text-align:center;position:absolute;left:0;top:0;z-index:10;letter-spacing:0.1em;}
}

.hokkaido_wigets{
	& .bn{color:#FFF;font-family: "Noto Serif JP", serif;font-size:1.25em;font-weight:500;display:flex;align-items:center;height:2.5em;padding:0.25em 0.75em;transition:all 0.2s;margin-bottom:1em;
		& .icon{display:block;width:2em;height:2em;overflow:clip;margin-right:0.75em;}
		& > img{object-fit:contain;width:100%;height:auto;display:block;}
		&:hover{opacity:0.6;}
	}
}



.reserve_car_card{position:relative;
	& .labels{border-radius:2em;border:2px solid #000;padding:1.25em 1.25em 6em;box-sizing:border-box;display:block;position:relative;height:100%;
		& .abs.bottom_center{bottom:1.25em;left:50%;transform: translateX(-50%);}
	}
	& picture{margin-bottom:1em;}
	& h3{margin-bottom:0.6em;}
	& p > em{font-size:1.25em;line-height:1;}
	& .spec{font-size:0.825em;font-family:sans-serif;margin-top:0.5em;margin-bottom:0;
		& li+li{margin-top:0.2em;}
	}
}

.archive_body{
	& .reserve_car_card{
		& ul.spec{
			& > li{display:inline-block;padding:0.2em 0.6em;border:1px solid #000;border-radius:9999px;margin:0 0.5em 0.5em 0;}
		}
		& .abs_rt{position: absolute;right: 1.5em; top: 1.5em;display:flex;align-items:center;justify-content:center;background:#DAB300;line-height:1.2;padding:0.5em;flex-direction: column;font-size:1em;font-weight:700;text-align:center;width:3em;height:3em;
			& em{font-size:1.5em;}
			& small{}
		}
	}
}

.select_vehicle{opacity:0.7;
	&:hover{opacity:1;}
	& input[type=radio]{margin:0 auto 1em;display:none;
		&:checked+.labels{background:#ECD980;
			&:after{content:'';display:block;width:1em;height:1em;background:#004499;position:absolute;left:50%;margin-left:-0.5em;top:1.5em;border-radius:50%;}
		}
	}
	& .labels{padding-bottom:4em;margin:1em 0;
		&:before{content:'';display:block;width:1.25em;height:1.25em;border:2px solid #000;background:#FFF;position:relative;margin:0 auto 1em;border-radius:50%;}
	}
}

.archive_genre_head{padding:0;margin:0em 0 4em;
	& > .row{}
	& picture{width:100%;height:24em;position:relative;z-index:2;
		& > img{width:100%;height:100%;object-fit:cover;display:block;}
	}
	& h2{position:absolute;top:50%;left:50%;z-index:4;transform: translate(-50%,-50%);margin:0;text-align:center;font-size:4em;color:#FFF;text-shadow:0 0 10px #00000045;}
}

.genre_article_lists{
	& .genre_card{margin-bottom:2em;
		& > picture{border-radius:2em;}
	}
}

.foot_bn{position:relative;
	& > picture{
		& img{width:100%;height:auto;object-fit:cover;}
	}
	& h3{margin:0;position:absolute;top:50%;left:50%;transform: translate(-50%,-50%);color:#FFF;text-align:center;z-index:10;}
	&:hover{
		& picture > img{opacity:0.8;transition:all 0.2s;}
	}
}

.top_line{border-top:1px solid #bbb;padding-top:1.5em;}

footer{
	& > .row{padding:2em 0;}
	& .footer_menu{font-size:0.8125em;
		& a{display:inline-block;color:#777777;padding:0 0.75em;line-height:1;
			&:hover{color:#FFF;}
			&+a{border-left:1px solid #777777;margin-left:0.75em;}
		}
	}

}


.article_head{
	& > .row{border-top:1px solid #000;border-bottom:1px solid #000;padding:2em 0;}
	& time{display:block;margin:0 auto 1em;line-height:1;text-align:center;font-size:1.125em;}
	& h2{margin-bottom:0.6em;}
	& .data{
		& .cat{display:inline-block;line-height:1;padding:0.2em 0.6em;border-radius:0.25em;border:1px solid #000;font-size:0.8125em;font-family:sans-serif;margin:0 0.5em 0.5em;}
	}
}

.vehicle_brand{font-size:1em;font-weight:700;margin-right:1em;}
.vehicle_name{font-size:1.25em;font-weight:700;}
.vehicle_capacity{display: block;width: 8em;background: #000;margin: 1em auto 0;text-align: center;color: #FFF;font-size: 1.25em;
	& em{font-size:1.5em;padding: 0.2em 0.5em 0.5em;}
}


.article_body{
	& h1{}
	& h2{text-align:left;}
	& h3{}
	& h4{}
	& h5{}
	& img{display:block;max-width:100%;}
	& .aligncenter{display:block;margin-left:auto;margin-right:auto;}
	& .alignleft{float: left;margin-right: 2em;margin-bottom: 2em;}
	& .alignright{float: right;margin-left: 2em;margin-bottom: 2em;}
	& *+*{margin-top:2em;}
	& *+p{margin-top:1.25em;}
}

.article_data{
	& .border_blk{padding:2em;align-items:flex-start;}
	& .facility_spec{
		& > dl{display:flex;padding:0.5em 0;font-size:0.825em;border-top:1px dotted #999;
			& > dt{width:6em;flex-shrink:0;}
		}
	}
}

.vehicle_spec{margin:0;
	& > li{display:inline-block;margin:0 1em 1em 0;border:1px solid #000;border-radius:9999px;padding:0.2em 1em;font-size:1.125em;font-weight:500;
		&+li{margin-top:0;}
	}
}



.reserve_form{border-top:1px solid #000;
	& > dl{display:flex;padding:1em 0;border-bottom:1px solid #000;align-items:center;
		& > dt{width:13em;fle-shrink:0;}
		& > dd{flex-grow:1;
			& input[type=tel],
			& input[type=text],
			& input[type=email],
			& textarea{background:#DDD;font-size:1em;padding:0.75em;box-sizing:border-box;width:100%;border:0px;}
			& textarea{height:9em;}
			& input[readonly=readonly]{background:#FFF; user-select: none;}
		}
	}
}

.border_blk{border:1px solid #000;box-sizing:border-box;}

.mw_wp_form_input{
	& .confim_only{display:none;}
	& .complete_only{display:none;}
}
.mw_wp_form_confirm{
	& .input_only{display:none;}
	& .complete_only{display:none;}
}

.mw_wp_form_complete{
	& .input_only{display:none;}
	& .confim_only{display:none;}
}

table.log_table{font-size:0.75em;
	& th{padding:0.5em;text-align:center;}
	& td{padding:0.5em;}
}

@media screen and (min-width: 751px){


}


@media screen and (max-width: 750px){

.top_mv{padding-bottom:55vw;
	&:before{width:80%;left:10%;}
	& h1{
		font-size:1.5em;
		& small{font-size:0.75em;}
		&
	}
}

}


body.single{}

@media screen and (min-width: 751px){


}


@media screen and (max-width: 750px){


}


body.archive{}

@media screen and (min-width: 751px){


}


@media screen and (max-width: 750px){


}



