@charset "utf-8";
/* ===================================================
	Base CSS
====================================================== */
:root {
	--neutral-white: #fff;
	--neutral-black: #000;
	--neutral-black-opacity-30: rgba(0, 0, 0, 0.3);
	--neutral-black-opacity-50: rgba(0, 0, 0, 0.5);
	--neutral-black-opacity-60: rgba(0, 0, 0, 0.6);
	--brand-orange: #eb5406;
	--brand-orange2: #fd7337;
	--brand-gold: #b49540;
	--text-brand-01: #7e6b2e;
	--surface-neutral-01: #f3f3f3;
	--surface-neutral-03: #e2e2e2;
	--font-mincho: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif;
	--font-gothic: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku GothicPro", "Osaka", "Verdana", "Helvetica", "Arial", "ＭＳ Ｐゴシック", sans-serif;
}

body {
	min-width: 1200px; min-height: 100vh; background: var(--neutral-white); color: var(--neutral-black);
	font-size: 16px; font-weight: 500; line-height: 1.88;
	font-family: var(--font-mincho);
	-webkit-text-size-adjust: 100%; position: relative;
}


input,
select,
textarea { font-size: 16px; }

*, *::before, *::after { box-sizing: border-box; }

h1, h2, h3 { font-weight: 500;}
img { max-width: 100%;}

a { color: var(--neutral-black); text-decoration: none; transition: opacity .5s; }

@media screen and (min-width: 601px) and (hover: hover) {
	a:hover { opacity: .7; }
}

.ofi { object-fit: cover; width: 100%; height: 100%;}
.view_sp { display: none;}
.br_sp { display: none;}

@media screen and (max-width: 600px) {
	body { min-width: 0; font-size: 14px;}
	input,
	select,
	textarea { font-size: 16px;}

	.view_sp { display: block;}
	.view_pc { display: none !important;}
	.br_sp { display: inline;}
	.br_pc { display: none;}
}


/* ---------------------------------------------------
	Base Layout
------------------------------------------------------ */
.inner { width: 1200px; max-width: 96%; margin: 0 auto;}

@media screen and (max-width: 600px) {
	.inner { width: 88%; max-width: 100%; }
}


/* ---------------------------------------------------
	Footer
------------------------------------------------------ */
#footer { display: flex; flex-direction: column; align-items: center; gap: 31px; padding: 80px 0; text-align: center;}
#footer .ft_logo img { display: block;}
#footer address { font-style: normal;}
#footer .ft_btn a { display: block; min-width: 300px; padding: 20px 10px; background: var(--neutral-white); border: 1px solid var(--neutral-black-opacity-30); transition: background-color .5s;}

@media screen and (min-width: 601px) and (hover: hover) {
	#footer .ft_btn a:hover { opacity: 1; background: var(--surface-neutral-01);}
}

@media screen and (max-width: 600px) {
	#footer { gap: 25px; padding: 50px 6% calc(50px + env(safe-area-inset-bottom));}
	#footer .ft_logo img { width: 180px; height: auto;}
	#footer .ft_btn { width: 100%;}
	#footer .ft_btn a { min-width: 0;}
}