@charset "utf-8";
/* reset */
abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;text-decoration:none}ins{text-decoration:none}ins,mark{background-color:#ff9;color:#000}mark{font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}
/* google font */
@import url('https://fonts.googleapis.com/css2?family=Lora&family=Sawarabi+Mincho&family=Readex+Pro:wght@300&display=swap');

html{ scroll-behavior: smooth; height: calc(100% - 90px); }
*, *:before, *:after { -webkit-box-sizing: border-box !important; box-sizing: border-box !important; font-feature-settings: "palt" 1; letter-spacing: 0; }
@media screen and (max-width:900px) {
	html { height: calc(100% - 70px); }
}


.mgt0{ margin-top: 0 !important; } .mgt10{ margin-top: 10px !important; } .mgt20{ margin-top: 20px !important; } .mgt60{ margin-top: 60px !important; } .mgt80{ margin-top: 80px !important; } .mgt100{ margin-top: 100px !important; } .mgt120{ margin-top: 120px !important; }
.mgb0{ margin-bottom: 0 !important; } .mgb10{ margin-bottom: 10px !important; } .mgb20{ margin-bottom: 20px !important; } .mgb30{ margin-bottom: 30px !important; } .mgb40{ margin-bottom: 40px !important; } .mgb50{ margin-bottom: 50px !important; } .mgb60{ margin-bottom: 60px !important; } .mgb70{ margin-bottom: 70px !important; } .mgb80{ margin-bottom: 80px !important; }
.pdt0{ padding-top: 0 !important; } .pdt10{ padding-top: 10px !important; } .pdt20{ padding-top: 20px !important; } .pdt30{ padding-top: 30px !important; } .pdt40{ padding-top: 40px !important; } .pdt50{ padding-top: 50px !important; } .pdt60{ padding-top: 60px !important; } .pdt70{ padding-top: 70px !important; }
.pdb0{ padding-bottom: 0 !important; } .pdb10{ padding-bottom: 10px !important; } .pdb20{ padding-bottom: 20px !important; } .pdb30{ padding-bottom: 30px !important; } .pdb40{ padding-bottom: 40px !important; } .pdb50{ padding-bottom: 50px !important; } .pdb60{ padding-bottom: 60px !important; }
.pdl10{ padding-left: 10px !important; } .pdl20{ padding-left: 20px !important; } .pdl30{ padding-left: 30px !important; }


body { width:100%; height:100%; font-size:16px; color:#333; background-color:#fefefe; background-image: url(../img/bg.jpg); background-attachment: fixed; position:relative; z-index: 1; line-height: 1.8; margin:auto; text-align: center; font-weight: 400 !important; font-family: YakuHanMP_Noto, 'Sawarabi Mincho', "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif; }
@media screen and (max-width:900px) {
	body { font-size:12px; background-image: none; }
	body::before { content:"";
		display:block;
		position:fixed;
		top:0;
		left:0;
		z-index:-1;
		width:100%;
		height:100vh;
		background-repeat:no-repeat;
		background-position:50% 100%;
		background-image:url(../img/bg_sp.jpg);
		background-size:cover; }
}

.nosp{ display: block!important; }
.forsp{ display: none!important; }
img.auto{ width:100%; vertical-align: bottom !important; /*image-rendering:auto !important;*/ image-rendering: -webkit-optimize-contrast; }
.gothic_font { font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", YakuHanJP, "Helvetica Neue", "Helvetica", "Hiragino Kaku Gothic ProN", "Arial", "Meiryo", sans-serif; }
.mincho_font { font-family: YakuHanMP_Noto, "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif !important; }
svg { font-size:0 !important; vertical-align: bottom; }
svg > path { font-size:0 !important; }
@media screen and (max-width:900px) {
	body { width:100%; font-size:13px; padding-bottom:0; }
	img.auto{ width:100%; }
	img.auto.forsp{ width:100%; }
	.nosp{ display: none!important; }
	.forsp{ display: inline-block!important; }
} 

header { display: flex; position: fixed; top:0; width: 100%; justify-content: space-between; align-items: center; background-color:rgba(255,250,255,0.9); height:90px; z-index: 1000; }
header > h1 { font-weight: normal; width:10%; }
@media screen and (max-width:900px) {
	header { height:70px; }
	header > h1 { width:50%; margin:auto; }
}

/* グローバルメニュー */
nav#g_nav { display:inherit; width:90%; }
nav#g_nav > ul { display: flex; gap:3%; justify-content: center; align-items: center; width:77%; }
nav#g_nav ul li { line-height: 1.2; }
nav#g_nav ul li a { font-size:15px; color:#333; letter-spacing: 1px; }
nav#g_nav ul li a > span { display: inline-block; font-size:70%; letter-spacing: 0; }
@media screen and (max-width:900px) {
	nav#g_nav { position: fixed; right: -90%; top:0; z-index: 10001; width: 90%; height: 100vh; margin-left: auto; display: flex; flex-direction: column; color: #efefef; background-color: #bfa872; transition: .3s; padding-top:50px; }
	nav#g_nav.open { right: 0; }
	nav#g_nav ul { flex-direction: column; width:100%; }
	nav#g_nav ul li { margin-bottom:30px; }
	nav#g_nav ul li a { font-size:16px; color:#fefefe; }
}

nav#g_nav ul#g_sns { display: flex; gap:5%; justify-content: center; align-items: center; width:23%; }
nav#g_nav ul#g_sns li { width:22px; height:22px; }
nav#g_nav ul#g_sns li a { display: inline-block; width:22px; height:22px; line-height: 22px; }
nav#g_nav ul#g_sns li a:hover { opacity: 0.5; }
nav#g_nav ul#g_sns li a > img { width:100%; height:auto; }
@media screen and (max-width:900px) {
	nav#g_nav ul#g_sns { flex-direction: row; gap:20px; justify-content: center; margin:auto; width:100%; }
}

/* 画像でのクリップマスクでやっていたが変更！
div#content01 { padding-top:70px; width:100%; height:auto; position:relative; z-index:10; }
div#content01 img { width:100%; height: 100%; object-fit: cover; }
img.mask3 { -webkit-mask-image: url("../img/top_mask.png"); mask-image: url("../img/top_mask.png"); -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
*/




div#beneath_sticky { position: sticky; top: 100vh; width: 100%; }

.wave{ position:relative; height:20px; }
canvas { position: absolute; bottom: -1px; left:0; width: 100%; }

div#footer_border { position:relative; vertical-align:bottom; bottom: 0; }
div#footer_border > svg { position:relative; top:1px; }

footer#footer { position: relative; background-color:#bfa872; color:#fefefe; padding-top:50px; padding-bottom:60px; }
footer#footer ul#footer_sns { display: flex; gap:5%; justify-content: center; align-items: center; width:25%; margin:0 auto 20px; }
footer#footer ul#footer_sns li { width:22px; height:22px; }
footer#footer ul#footer_sns li a { display: inline-block; width:22px; height:22px; line-height: 22px; }
footer#footer ul#footer_sns li a:hover { opacity: 0.5; }
footer#footer ul#footer_sns li a > img { width:100%; height:auto; }
footer#footer small { font-size:12px; letter-spacing: 1px; color:#fefefe; }
footer#footer > p { padding-bottom:20px; }
footer#footer > p > a { color:#fefefe; }
footer#footer > p > a:hover { text-decoration: underline; }

@media screen and (max-width:900px) {
	footer#footer { padding-top:30px; padding-bottom:40px; }
	footer#footer ul#footer_sns { gap:20px; }
	footer#footer small { font-size:10px; }
}





/* ハンバーガーメニュー */
button#sp_btn { display: none; }
@media screen and (max-width:900px) {
	button#sp_btn { display:inherit; }
}

* { box-sizing: border-box; margin: 0; padding: 0; }
::before , ::after { box-sizing: inherit; }
button#sp_btn { margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: inherit; vertical-align: middle; text-align: inherit; font: inherit; -webkit-appearance: none; appearance: none; }

.btn { position: fixed; top: 8px; right: 10px; width: 52px; height: 52px; z-index: 10001; background-color:rgba(255,255,255,0); }
.btn:hover{ cursor: pointer; }
.btn-line { display: block; position: relative; width: 80%; height: 1px; background-color: #333; transition: .5s; margin:auto; }

.btn-line::before, .btn-line::after { content: ""; position: absolute; left:0; width: 100%; height: 100%; background-color: #333; transition: .5s;}
.btn-line::before { transform: translateY(-10px); }
.btn-line::after { transform: translateY(10px); }
@media screen and (max-width:900px) {
}

.btn-line.open { background-color: transparent; }
.btn-line.open::before, .btn-line.open::after { content: ""; background-color: #333; transition: .5s; }
.btn-line.open::before { transform: rotate(45deg); }
.btn-line.open::after { transform: rotate(-45deg); }
@media screen and (max-width:900px) {
	.btn-line.open::before, .btn-line.open::after { background-color: #fefefe; }
}