@charset "utf-8";
/***
* main 
**************************************/
main {
	position: relative;
}

/***
* section
**************************************/
section {
	margin-inline: auto;
}
/***
* Header
**************************************/
header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: calc(var(--winW)* 20) calc(var(--winW)* 35) calc(var(--winW)* 20) calc(var(--winW)* 53);
	position: fixed;
    z-index: 10;
    width: 100%;
	background-color: #fff;
}
header div:last-child {
	display: flex;
	align-items: center;
	gap: calc(var(--winW)* 36);
}
.header_logo {
	width: calc(var(--winW)* 137);
}
.header_insta {
	width: calc(var(--winW)* 26);
}
.header_insta:hover {
	opacity: 0.6;
}
.header_tel {
	color: #000;
	letter-spacing: calc(9em / 100);
	font-size: calc(var(--winW)* 14);
	font-family: montserrat, sans-serif;
	font-weight: 500;
}
.header_tel:hover {
	opacity: 0.6;
}


/***
* KV
**************************************/
.kv {
	position: relative;
	width: 100%;
	min-height: 100vh;
	background: url("../images/kv_pc.webp") center / cover;
	z-index: 2;
}
.kv .kv_box {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: calc(var(--winW)* 481);
}
.kv .logo {
	width: 100%;
	display: flex;
	justify-content: center;
	padding-top: calc(var(--winW)* 84);
}
.kv .logo img {
	width: calc(var(--winW)* 433);
}
.kv .reserve_box {
	width: 100%;
	display: flex;
	justify-content: center;
	padding-top:calc(var(--winW)* 30);
}
.kv .reserve_box .reserve_btn {
	font-size: calc(var(--winW)* 24);
	border-radius: 100vh;
	position: relative;
	transition: all .3s;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	color: #000;
	font-size: calc(var(--winW)* 18);
	letter-spacing: .06em;
	line-height: 1;
	width: calc(var(--winW)* 238);
	height: calc(var(--winW)* 67);
	border: calc(var(--winW)* 1) solid transparent;
	border-radius: 100vh;
	position: relative;
}
.kv .reserve_box .reserve_btn:hover {
	background-color: #000;
	color: #fff;
}
.kv .reserve_box .reserve_btn::before {
	content: '';
	background-image: url(../images/icon_arrow.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	width: calc(var(--winW)* 9.9);
	height: calc(var(--winW)* 9.9);
	position: absolute;
	top: 50%;
	right: calc(var(--winW)* 20);
	transform: translateY(-50%);
}
.kv .reserve_box .reserve_btn:hover::before {
	background-image: url(../images/icon_arrow_wh.svg);
}
.kv .reserve_box .reserve_btn span {
	display: block;
}
.kv .reserve_box .reserve_btn span span {
	position: relative;
	display: block;
	width: 100%;
	margin-top: calc(var(--winW)* 6);
	font-size: calc(var(--winW)* 14);
	text-align: center;
}

/***
* content
**************************************/
.content {
	position: relative;
	width: 100%;
	margin-top: calc(var(--winW)* -90);
	z-index: 1;
}
.content_bg {
	position: relative;
}
.content_bg > p:nth-child(1) {
	position: relative;
	z-index: 2;
}
.content_bg > p:nth-child(2) {
	position: absolute;
	top: calc(var(--winW)* 278);
	left: 50%;
	transform: translateX(-50%);
	width: calc(var(--winW)* 1315.8);
	height: calc(var(--winW)* 970.89);
}
.content_img {
	position: absolute;
	top: calc(var(--winW)* 428);
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	flex-wrap: wrap;
	row-gap: calc(var(--winW)* 54.83);
	column-gap: calc(var(--winW)* 51.85);
	width: calc(var(--winW)* 976.93);
	height: calc(var(--winW)* 672.57);
}
.content_img img {
	width: calc(var(--winW)* 462.54);
	height: calc(var(--winW)* 308.87);
}
.statement {
	position: absolute;
	top: calc(var(--winW)* 174);
	right: 0%;
	width:100%;
	text-align:center;
	font-size: calc(var(--winW)* 16);
	line-height: 2.3;
	letter-spacing: calc(16em / 100);
	z-index:3;
	font-weight: 600;
}

/***
* instagram_sec
**************************************/
.instagram_sec {
	background:#FEFFE5;
	padding: calc(var(--winW)* 139) 0;
	margin-top: calc(var(--winW)* -432);
	position: relative;
	z-index: 2;
}
.instagram_logo {
	width: calc(var(--winW)* 26);
	margin: 0 auto calc(var(--winW)* 33);
}
.instagram_text {
	width: 100%;
	margin-bottom: calc(var(--winW)* 32);
	font-size: calc(var(--winW)* 16);
	text-align: center;
	line-height: 2.3;
	letter-spacing: calc(8em / 100);
}
.instagram_btn {
	transition: all .3s;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #000;
    color: #fff;
    font-size: calc(var(--winW)* 16);
    letter-spacing: .01em;
    line-height: 1;
    width: calc(var(--winW)* 317);
    height: calc(var(--winW)* 61);
    border: calc(var(--winW)* 1) solid transparent;
    border-radius: 100vh;
    position: relative;
	margin: 0 auto;
}
.instagram_btn:hover {
	background-color: #fff;
	color: #000;
}
/***
* map_sec
**************************************/
.map_sec {
	padding: calc(var(--winW)* 93) 0 calc(var(--winW)* 171);
}
.sec_title {
	margin-bottom: calc(var(--winW)* 44);
	font-size: calc(var(--winW)* 32);
	font-family: montserrat, sans-serif;
	font-weight: 700;
	text-align: center;
	letter-spacing: calc(20em / 100);
}
.map_text {
	width: 100%;
	margin-bottom: calc(var(--winW)* 43);
	font-size: calc(var(--winW)* 16);
	text-align: center;
	line-height: 2.3;
	letter-spacing: calc(8em / 100);
}
.map_sec .map {
	text-align: center;
}
.map_sec .map iframe {
	width: calc(var(--winW)* 794);
	height: calc(var(--winW)* 308);
}
.illust_dog {
	position: absolute;
	width: calc(var(--winW)* 88);
	right: calc(var(--winW)* 428);
	bottom: calc(var(--winW)* -18);
}
/***
* footer
**************************************/
footer {
	background-color: #444444;
}
.footer_container {
	display: flex;
	justify-content: space-between;
	padding: calc(var(--winW)* 53) calc(var(--winW)* 71) calc(var(--winW)* 48) calc(var(--winW)* 89);
}
.footer_container > div:first-child {
	display: flex;
	align-items: center;
	gap: calc(var(--winW)* 56);
}
.footer_logo {
	display: flex;
	align-items: center;
	gap: calc(var(--winW)* 69);
}
.footer_logo img {
	width: calc(var(--winW)* 186);
}
.footer_logo_insta {
	width: calc(var(--winW)* 26);
}
.tel {
	color: #fff;
	letter-spacing: calc(9em / 100);
	font-size: calc(var(--winW)* 19);
	font-family: montserrat, sans-serif;
	font-weight: 500;
}
.footer_banner {
	width: calc(var(--winW)* 251);
	transition: all .3s;
}
.footer_banner:hover {
	opacity: 0.7;
}
.footer_banner img {
	border-radius: calc(var(--winW)* 6);
}
small {
	font-size: calc(var(--winW)* 10);
	font-weight: 300;
	letter-spacing: calc(9em / 100);
	color: #fff;
	text-align: center;
	border-top: calc(var(--winW)* 1) solid #787878;
	padding: calc(var(--winW)* 24) 0 calc(var(--winW)* 27);
	width: 100%;
	display: block;
	
}



@media only screen and (max-width: 769px) {
	header {
		padding: calc(var(--winW)* 12) calc(var(--winW)* 15) calc(var(--winW)* 12) calc(var(--winW)* 20);
	}
	.header_logo {
		width: calc(var(--winW)* 122);
	}
	header div:last-child {
		display: block;
	}
	.header_tel {
		font-size: calc(var(--winW)* 16);
	}
	header div:last-child div {
		display: flex;
		justify-content: flex-start;
		gap: calc(var(--winW)* 15);
		align-items: center;
	}
	.kv .logo {
		padding-top: 0;
	}


	.kv {
		min-height: calc(var(--winW)* 580);
		background: url(../images/kv_sp.webp) center / cover;
	}
	.kv .logo img {
		width: calc(var(--winW)* 249);
	}
	.kv .kv_box {
		position: relative;
		width: calc(var(--winW)* 249);
		top: initial;
		left: inherit;
		transform: none;
		padding: calc(var(--winW)* 239.58) 0 calc(var(--winW)* 174);
		margin: 0 auto;
	}
	.kv .reserve_box .reserve_btn::before {
		right: calc(var(--winW)* 28);
	}
	.kv .reserve_box {
		padding-top: calc(var(--winW)* 17.5);
	}


	.content {
		margin-top: calc(var(--winW)* -48);
	}
	.content_bg > p:nth-child(1) {
		position: relative;
		z-index: 2;
	}
	.content_bg > p:nth-child(2) {
		position: absolute;
		top: 0;
		left: 0;
		transform: none;
		width: 100%;
		height: inherit;
	}
	.content_img {
		position: absolute;
		top: calc(var(--winW)* 558);
		left: calc(var(--winW)* 20);
		transform: none;
		gap: calc(var(--winW)* 28);
		width: calc(var(--winW)* 335);
		height: inherit;
	}
	.content_img img {
		width: calc(var(--winW)* 335);
		height: inherit;
	}
	.statement {
		top: calc(var(--winW)* 231);
		font-size: calc(var(--winW)* 14);
		line-height: 2;
	}




	.instagram_sec {
		margin-top: calc(var(--winW)* -145);
		padding: calc(var(--winW)* 48) calc(var(--winW)* 20) calc(var(--winW)* 47);
	}
	.instagram_logo {
		margin-bottom: calc(var(--winW) * 25);
	}
	.instagram_text {
		margin-bottom: calc(var(--winW) * 21);
		font-size: calc(var(--winW) * 14);
	}
	.instagram_btn {
		width: calc(var(--winW) * 281);
	}

	/***
	* map_sec
	**************************************/
	.map_sec {
		padding: calc(var(--winW)* 77) 0 calc(var(--winW)* 72);
	}
	.sec_title {
		margin-bottom: calc(var(--winW) * 29);
	}
	.map_text {
		margin-bottom: calc(var(--winW) * 30);
		font-size: calc(var(--winW) * 14);
	}
	.map_sec .map iframe {
		width: 100%;
		height: calc(var(--winW)* 260);
	}
	.illust_dog {
		width: calc(var(--winW)* 52.68);
		right: calc(var(--winW)* 58.32);
		bottom: calc(var(--winW)* -5);
	}



	.footer_container {
		display: block;
		padding: calc(var(--winW)* 32) calc(var(--winW)* 40) calc(var(--winW)* 27.21);
	}
	.footer_container > div:first-child {
		justify-content: space-between;
		align-items: flex-start;
		gap: 0;
		margin-bottom: calc(var(--winW) * 28);
	}
	.footer_logo {
		display: block;
	}
	.footer_logo img {
		width: calc(var(--winW) * 115.84);
		margin-bottom: calc(var(--winW) * 26);
	}
	.footer_logo_insta {
		margin-top: calc(var(--winW) * 6);
	}
	.footer_banner {
		width: calc(var(--winW)* 206);
		margin: 0 auto;
	}
	small {
		font-size: calc(var(--winW)* 8);
		padding: calc(var(--winW)* 20) 0;
	}

}