@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;outline: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;
}
html{font-size:90%;}
body{font-family:'Zen Kaku Gothic New',sans-serif;font-weight:500;color: #2f2f2f;}


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

h2{margin-bottom:0.5em;padding-bottom:0.5em;font-size:clamp(2em,5vw,2.8em);text-align:center;}
h2 span{display:block;}
h2::after{content:'';display:block;width:100%;height:5px;margin-top:0.5em;
background: repeating-linear-gradient(-45deg ,#169dc5 0,#169dc5 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;}


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;}
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:#169dc5;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:'\e8b8';}
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:#169dc5;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:var(--gra);
background-size:var(--bgsize);
background-position:var(--bgps);
}
#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;}
#sec1 .p2{max-width:800px;margin:0 auto 4em;}
#sec1 .p3{max-width:800px;margin:0 auto;}
#sec1 section{padding:1em;background:var(--gra);background-size:var(--bgsize);background-position:var(--bgps);border-radius:1em;margin-bottom:2em;}
#sec1 h3{display:flex;align-items:center;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;}
#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.8em;font-weight:700;}
#sec1 dt span{display:block;background:#ff0;border-radius:100px;padding:0.1em 0;}
#sec1 dd{text-align:left;}

#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:1.4em;}
#sec2 dd{background:#ff0;font-size:2em;}
#sec2 small{font-size:1rem;}
#sec2 .p1{max-width:800px;margin:0 auto 2em;}
#sec2 section {max-width:1100px;margin:auto;padding:1em;background:var(--gra);background-size:var(--bgsize);background-position:var(--bgps);border-radius:1em;}
#sec2 h3{position:relative;z-index:2;max-width:500px;margin:0 auto 1.4em;padding:0.3em 0;font-size:1.2em;background:#ff0;border-radius:100px;}
#sec2 section ul li:first-child{margin-bottom:1em;}
#sec2 section ul li a{display:block;padding:1em;font-size:1.4em;font-weight:700;text-align:center;background:#fff;border-radius:1em;border:solid 4px #2f2f2f;transition:background-color 0.3s;}
#sec2 section ul li a::after{content:'\eaaa';font-family:Material Icons;display:block;float:right;font-size:1.6em;transition:transform 0.3s;}
#sec2 section ul li a:hover{background-color:#ff0;}
#sec2 section ul li a:hover::after{transform:translateX(-0.5em);}

#sec3 .box{max-width:1100px;text-align:center;}
#sec3 img{max-width:300px;}
#sec3 dl{padding:1em;background:var(--gra);background-size:var(--bgsize);background-position:var(--bgps);border-radius:1em;}
#sec3 dl div{padding:2em 1em;background:#fff;border-radius:1em;border:solid 4px #222;box-shadow:4px 4px 0 rgba(0,0,0,1);}
#sec3 dl div:not(:last-child){margin-bottom:1em;}
#sec3 dt{margin-bottom:1em;font-size:1.8em;font-weight:700;background:#ff0;border-radius:100px;}
#sec3 dd span{white-space:nowrap;}

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(--gra);background-size:var(--bgsize);background-position:var(--bgps);}
.taiken .box{max-width:1100px;border-radius:1rem;}
.taiken h2{color:#ff0;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;padding:1rem 0;font-size:var(--fz28);font-weight:700;text-align:center;color:#2a2a2a;
border-radius:1em;box-shadow:4px 4px 0 #222;border:solid 4px #222;
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:#169dc5;}
.taiken a.tel::before{content:'\e325';}
.taiken a.reserved::before{content:'\e0be';}
.taiken a:hover{background-position:0% 0%;}

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);}

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:#169dc5;}
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;font-size:1.6em;}

#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:1.6em;}
#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 dl{padding:2em;}

.taiken .box div{display:grid;grid-template-columns:repeat(2,1fr);gap:3rem;padding-top:1rem;}

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:1.8em;}
#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);}
}