@charset "utf-8";

/*-webkit-text-stroke: 2px red;*/
*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,h5,p,figure,blockquote,dl,dt,dd,ul,ol,li{margin:0;padding:0;}ul,ol{list-style:none}body{min-height:100vh;}h1,h2,h3,h4,h5,button,input,label{line-height:1.4}/*h1,h2,h3,h4,h5{text-wrap:balance}*/a{text-decoration:none;color:currentColor}a:not([class]){text-decoration-skip-ink:auto;}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}

:root{
--fs: calc(100% + 100vw * 2 / 376);

--fz18: calc(18 / 16 * 1rem);
--fz20: calc(20 / 16 * 1rem);
--fz22: calc(22 / 16 * 1rem);
--fz24: calc(24 / 16 * 1rem);
--fz28: calc(28 / 16 * 1rem);
--fz32: calc(32 / 16 * 1rem);
--fz36: calc(36 / 16 * 1rem);
--gra:radial-gradient(rgba(255,255,255,0.5) 15%, rgba(0,0,0,0) 15%),radial-gradient(rgba(255,255,255,0.5) 15%, rgba(0,0,0,0) 15%),#169dc5;
--bgsize:14px 14px;
--bgps: 0 0, 7px 7px;
--color:#369;
}
html{font-size:90%;}
body{font-family:'Noto Sans JP',sans-serif;font-feature-settings: "palt";font-weight:500;color: #2f2f2f;}


main > section{padding:clamp(2em,5vw,4em) 1.6em;}
.box{margin:auto;}
main p{line-height:1.6;letter-spacing: 0.05em;}
main p:not(:last-child){margin-bottom:2em;}

h2{margin-bottom:0.5em;padding-bottom:0.5em;font-size:clamp(2.1em,5vw,2.8em);text-align:center;}
h2 span{white-space:nowrap;}
h2::after{content:'';display:block;width:100%;height:5px;margin-top:0.5em;
background: repeating-linear-gradient(-45deg ,var(--color) 0,var(--color) 3px ,#fff 3px, #fff 6px ,#ccc 6px, #ccc 9px ,#fff 9px, #fff 12px );}
h3{margin-bottom:1em;font-size:clamp(1.6em,5vw,2em);text-align:center;}
h3 span{white-space:nowrap;}

header{padding:0 1em;border-bottom:solid 1px #ccc;}
header .box{max-width:1100px;padding:1em 0;}
h1{margin-bottom:1em;font-size:clamp(0.5em,5vw,0.8em);text-align:center;}
h1 span{display:block;}
header img{margin:auto;}


nav{position:fixed;bottom:0;left:0;width:100%;background:#fff;z-index:999;}
nav ul{display:flex;max-width:1100px;}
nav li{flex:1;}
nav a{display:grid;place-content:center;padding:1em 0;font-size:0.8em;font-weight:bold;}
nav li a::before{font-family:Material Icons;display:block;margin-bottom:0.3rem;font-size:1.4rem;color:var(--color);text-align:center;}
nav li:nth-child(1) a::before{content:'\e88a';color:#fff;}
nav li:nth-child(2) a::before{content:'\e873';}
nav li:nth-child(3) a::before{content:'\eafb';}
nav li:nth-child(4) a::before{content:'\e172';}
nav li:nth-child(5) a::before{content:'\e0c8';}

@media (width < 767px){
nav li:nth-child(1){order:3;transform:translateY(-1em);}
nav li:nth-child(1) a{background:var(--color);color:#fff;width:100%;height:120%;border-radius:100%;overflow:hidden;box-shadow:0 2px 4px rgba(0,0,0,0.5);}
nav li:nth-child(2){order:1;}
nav li:nth-child(3){order:2;}
nav li:nth-child(4){order:4;}
nav li:nth-child(5){order:5;}
}


#helo{padding:1em 0;text-align:center;
background-image:repeating-linear-gradient(-45deg,rgba(255,255,255,0.1) 0px, rgba(255,255,255,0.1) 2px,rgba(255,255,255,0) 2px,rgba(255,255,255,0) 4px);
background-color:var(--color);
}
#helo img{margin:auto;}

section img{margin:0 auto 3em;width:100%;}

#sec1 .box{max-width:1100px;text-align:center;}
#sec1 img{max-width:400px;}
#sec1 p{display:inline-block;text-align:left;}
#sec1 .p1{padding:1em 2em;background:#ff0;font-size:1.2em;font-weight:700;border-radius:100px;text-align:center;}
#sec1 .p1 span{white-space:nowrap;}
#sec1 .p2{max-width:800px;margin:0 auto 4em;}
#sec1 .p3{max-width:800px;margin:0 auto;}
#sec1 section{padding:1em;background:var(--color);border-radius:1em;margin-bottom:2em;}
#sec1 h3{color:#fff;/*display:flex;align-items:center;font-weight:900;-webkit-text-stroke: 0.04em #2f2f2f;text-stroke: 0.04em #2f2f2f;text-shadow:2px 2px 0 #2f2f2f,3px 3px 0 #2f2f2f,4px 4px 0 #2f2f2f;*/}
/*#sec1 h3::before,#sec1 h3::after{content:'';display:block;flex:1;height:1em;background: repeating-linear-gradient(90deg ,#169dc5 0,#169dc5 3px ,#fff 3px, #fff 6px ,#ccc 6px, #ccc 9px ,#fff 9px, #fff 12px );}
#sec1 h3::before{margin-right:1em;}
#sec1 h3::after{margin-left:1em;}*/
#sec1 dl div{padding:2em 1em;background:#fff;border-radius:1em;border:solid 4px #2f2f2f;box-shadow:4px 4px 0 #2f2f2f;}
#sec1 dl div:not(:last-child){margin-bottom:1em;}
/*
#sec1 dl div::before{font-family:Material Icons;display:block;margin-bottom:0.2em;font-size:4em;color:#999;text-align:center;}
#sec1 dl div:nth-child(1)::before{content:'\e873';}
#sec1 dl div:nth-child(2)::before{content:'\e228';}
#sec1 dl div:nth-child(3)::before{content:'\e8eb';}
*/
#sec1 dt{margin-bottom:0.6em;font-size:1.4em;font-weight:700;}
#sec1 dt span{display:block;background:#ff0;border-radius:100px;padding:0.1em 0;}
#sec1 dd{text-align:left;font-size:1.1em;}


#sec0{}
#sec0 .box{max-width:960px;margin:auto;text-align:center;}
#sec0 .p1{display:inline-block;text-align:left;}
#sec0 img{border:solid 1px #ccc;}
#sec0 a{display:block;max-width:300px;margin:auto;padding:1em 0;text-align:center;color:#fff;background:#444;}


#sec2 {background:#f4f4f4;}
#sec2 .box{max-width:1100px;margin-bottom:4em;padding:2em;background:#fff;border-radius:1em;}
#sec2 img{max-width:200px;}
#sec2 dl{max-width:800px;margin:0 auto 2em;}
#sec2 dl div{margin-bottom:5px;overflow:hidden;border:solid 4px #2f2f2f;border-radius:1em;}
#sec2 dt,#sec2 dd{padding:0.6em 0;text-align:center;font-weight:700;background-clip:border-box;}
#sec2 dt{display:grid;place-content:center;background:#2f2f2f;color:#fff;font-size:2em;}
#sec2 dd{background:#ff0;font-size:2em;}
#sec2 small{font-size:1rem;}
#sec2 .p1{max-width:800px;margin:0 auto 2em;}
#sec2 .p2{margin-bottom:0.5em;text-align:center;font-size:2em;font-weight:900;}
#sec2 .p2::before{content:'＼';padding-right:1em;}
#sec2 .p2::after{content:'／';padding-left:1em;}

#sec3 .box{max-width:1100px;text-align:center;}
#sec3 img{max-width:300px;}
#sec3 ul{margin-bottom:4em;}
#sec3 li{padding:0.5em 0;text-indent:-2.6em;padding-left:2.6em;text-align:left;letter-spacing: 0.05em;}
#sec3 li::before{content:'\e2e6';font-family:Material Icons;margin-right:0.3em;vertical-align:middle;font-size:2rem;color:var(--color);}
#sec3 li span{white-space:nowrap;}
#sec3 p{display:inline-block;text-align:left;}
#sec3 .p2 a{padding-bottom:0;display:inline-block;color:var(--color);border-bottom:solid 2px var(--color);}
#sec3 .p2 a:hover{border-bottom:solid 2px #fff;}

iframe{margin-bottom:2rem;}
#sec4 .box{max-width:1100px;text-align:center;}
#sec4 section{margin-bottom:2em;}
#sec4 h3{margin-bottom:0.5em;padding-bottom:0.5em;text-align:left;font-size:1.4em;border-bottom:solid 2px #ccc;}
#sec4 p{text-align:left;}

.taiken{background:var(--color);/*background-size:var(--bgsize);background-position:var(--bgps);*/}
.taiken .box{max-width:1100px;border-radius:1rem;}
.taiken h2{color:#fff;/*font-weight:900;-webkit-text-stroke: 0.04em #2f2f2f;text-stroke: 0.04em #2f2f2f;text-shadow:2px 2px 0 #2f2f2f,3px 3px 0 #2f2f2f,4px 4px 0 #2f2f2f;*/}
.taiken a{display:block;max-width:500px;margin:auto;padding:1rem 0;font-size:var(--fz28);font-weight:700;text-align:center;color:#2f2f2f;
border-radius:1em;/*box-shadow:4px 4px 0 #222;*/border:solid 4px #2f2f2f;
background: rgb(255,255,255);
background: linear-gradient(-90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,0,1) 50%, rgba(255,255,0,1) 100%);
background-size:200% 100%;background-position:100% 0;
transition:background-position 0.3s;
}
.taiken a::before{font-family:Material Icons;margin-right:0.5em;vertical-align:middle;font-size:2rem;color:var(--color);}
.taiken a.tel::before{content:'\e0b0';}
.taiken a.reserved::before{content:'\e0be';}
.taiken a:hover{background-position:0% 0%;}
.taiken .box div{position:relative;padding:2em;background:#fff;border-radius:1em;box-shadow:4px 4px 0 #222;border:solid 4px #222;}
.taiken .p1{text-align:center;font-size:1.2em;color:#fff;}
.taiken .p2{position:absolute;top:0;left:50%;width: 80%;max-width: 350px;transform:translate(-50%,-50%);padding:0.5em 0;text-align:center;background:#fff;border-radius:100px;/*box-shadow:4px 4px 0 #222;*/border:solid 4px #222;}

footer{padding:3rem 1rem 6rem;}
footer .box{text-align:center;font-size:0.8rem;}
footer a img{display:inline-block;}
footer p{margin-bottom:1em;}







@media (width >= 768px){
html{font-size:110%;}
header{padding:0 1em;border-bottom:solid 1px #ccc;}
header .box{display:flex;align-items:center;max-width:1100px;padding:1em 0;}
h1{margin-bottom:0;order:2;padding-left:3em;font-size:clamp(0.6em,5vw,0.8em);text-align:left;}

nav{position:sticky;top:0;left:0;background:#fff;z-index:999;}
nav li a{display:grid;place-content:center;padding:1em 0;font-size:1.1em;font-weight:bold;
background: rgb(255,255,255);
background: linear-gradient(-180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,0,1) 50%, rgba(255,255,0,1) 100%);
background-size:100% 200%;background-position:0 0;
transition:background-position 0.3s;
}
nav li a:hover{background-position:0 100%;}
nav li:nth-child(1){order:1;transform:none;}
nav li:nth-child(1) a{color:inherit;width:auto;height:auto;border-radius:0;box-shadow:none;}
nav li:nth-child(1) a:before{color:var(--color);}
nav li:nth-child(2){order:2;}
nav li:nth-child(3){order:3;}
nav li:nth-child(4){order:4;}
nav li:nth-child(5){order:5;}

main p{line-height:1.8;}

#sec1 dl{display:grid;grid-template-columns:repeat(3,1fr);gap:1em;}
#sec1 dl div:not(:last-child){margin-bottom:0;}
#sec1 dt{margin-bottom:1em;}

#sec2 dl div{display:grid;grid-template-columns:repeat(2,1fr);margin-bottom:5px;overflow:hidden;border:solid 4px #2f2f2f;border-radius:1em;}
#sec2 dt{font-size:2.2em;}
#sec2 dd{font-size:2.2em;}
#sec2 section {padding:2em 1em;}
#sec2 section ul{display:grid;grid-template-columns:repeat(2,1fr);gap:1em;}
#sec2 section ul li:first-child{margin-bottom:0;}

#sec3 ul{display:grid;grid-template-columns:repeat(2,1fr);}


footer{padding:3rem 1rem;}

}





@media (width >= 1024px){
#sec1 section{padding:1.6em;}
#sec1 dl{gap:1em;}
#sec1 dt{margin-bottom:1em;font-size:1.8em;}

#sec2 section {padding:2em;}
#sec2 dt{font-size:2.4em;}
#sec2 dd{font-size:2.4em;}

#sec3 dl{display:grid;grid-template-columns:repeat(3,1fr);gap:1em;}

#sec3 dl div:not(:last-child){margin-bottom:0;}


#sec4 .box div{display:grid;grid-template-columns:repeat(2,1fr);gap:3em;}

.taiken a{font-size:var(--fz28);}
}