@charset "UTF-8";

:root {
	font-size: 18px;
	--color-base: #333;
	--color-darkgray:#808080;
	--color-white: #fff;
	--color-paleblue: #BFE6EF;
	--color-primary: #2f73c9;
}

/* PC(880px〜)は1440pxを基準デザイン幅とし、画面幅に応じてrem基準のサイズ(見出し・余白等)を連動して拡大する */
@media (min-width:880px) {
	:root { font-size:max(18px, 1.25vw); }
}

html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, img, strong, sub, sup, var, i, dl, dt, dd, ol, ul, li, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figcaption, figure, footer, header, nav, section, audio, video { margin:0; padding:0; border:0; font-size:inherit; vertical-align:baseline; background:transparent; outline:0; }
*, *::before, *::after { box-sizing:border-box; }

/****************************************/
/*	reset + base set										*/
/****************************************/

html { scroll-behavior: smooth; }
article, figcaption, figure, footer, header, nav, section { display:block; }
ul, ol, li { list-style:none; }
table { border-collapse:collapse; border-spacing:0; }
a { background:transparent; font-size:inherit; margin:0; padding:0; text-decoration:none; transition:all 0.2s ease; vertical-align:baseline; }
input, select { vertical-align:middle; }
sup { position:relative; top:0.1em; font-size:0.6em; vertical-align:top; }
sub { position:relative; top:0.7em; font-size:0.6em; vertical-align:top; }
img { backface-visibility:hidden; display:block; height:auto; width:100%; }
hr { margin:0 0 24px; padding:0; border:0; }
@media (min-width:880px) {
	html { scroll-behavior:auto; }
	hr { margin-bottom:max(40px, 2.78vw); }
}

/****************************************/
/*	.backtotop													*/
/****************************************/
.backtotop { position:fixed; right:0; bottom:calc(16px + env(safe-area-inset-bottom)); z-index:1000; }
.backtotop a { display:block; position:relative; width:48px; height:48px; background:rgba(0,0,0,0.6); transition:all 0.3s ease; cursor:pointer; }
.backtotop a::before { content:''; display:block; position:absolute; top:50%; left:50%; width:8px; height:8px; border-top:var(--color-white) 2px solid; border-right:var(--color-white) 2px solid; transform-origin:center center; transform:rotate(-45deg) translate(-2px,-2px); }

/****************************************/
/*	custom															*/
/****************************************/

body { color:var(--color-base); line-height:1.7; font-family:"Zen Kaku Gothic New", sans-serif; font-weight:500; font-style:normal; font-feature-settings:"palt"; text-size-adjust:100%; background:var(--color-paleblue) url('../images/bg.svg') center center; }
section { max-width:960px; width:88%; margin-inline:auto; }
@media (min-width:880px) {
	section { max-width:max(960px, 66.67vw); }
}
.wrapper { position:relative; overflow-x:hidden; width:100%; }

/* head */
.h { position:relative; }

.h-illust { display:block; position:absolute; z-index:0; top:0; left:50%; width:min(100%, 520px); transform:translateX(-50%); }
.h-illust-item { position:absolute; width:auto; height:auto; animation:kf-faqTilt 1.6s steps(2, end) infinite; }
.h-illust-item04, .h-illust-item02, .h-illust-item05 { display:none; }
.h-illust-item02sp { left:4%;  top:6%; width:30%; animation-delay:0.2s; }
.h-illust-item03 { left:66%; top:4%;  width:28%; animation-delay:0.4s; }
.h-illust-item06 { left:66%; top:90%; width:35%; animation-delay:1.0s; }
.h-illust-item07 { left:2%;  top:84%; width:27%; animation-delay:1.2s; }
.h-illust-item09 { left:44%; top:8%;  width:12%; animation-delay:0.1s; }
.h-illust-note1, .h-illust-note2, .h-illust-note3, .h-illust-note4 { display:none; }
.h-inner { position:relative; z-index:1; }

@media (min-width:880px) {
	.h-illust { position:absolute; top:0; left:50%; width:max(1200px, 100%); aspect-ratio:1440/620; transform:translateX(-50%); }
	.h-illust-item04, .h-illust-item06, .h-illust-item02, .h-illust-item05 { display:block; }
	.h-illust-item02sp { display:none; }
	.h-illust-note1, .h-illust-note2, .h-illust-note3, .h-illust-note4 { display:block; }
	.h-illust-item02 { left:15%;  top:4.7%;   width:17%;   animation-delay:0.2s; }
	.h-illust-item03 { left:74.5%;  top:8.6%;   width:15%;   animation-delay:0.4s; }
	.h-illust-item04 { left:91.46%; top:6.61%;  width:4.51%;  animation-delay:0.4s; }
	.h-illust-item05 { left:74.9%;  top:72%;    width:13%;   animation-delay:1.0s; }
	.h-illust-item06 { left:28%;    top:90%;    width:14%;   animation-delay:1.1s; }
	.h-illust-item07 { left:6.8%;  top:70.9%;  width:13.78%; animation-delay:0.6s; }
	.h-illust-item09 { left:56.39%; top:10.81%; width:5.28%;  animation-delay:0.1s; }
	.h-illust-note1 { left:39.5%; top:12.5%; width:4%; animation-delay:0.3s; }
	.h-illust-note2 { left:10.9%; top:50.8%; width:3%; animation-delay:0s; }
	.h-illust-note3 { left:85.5%; top:63%;   width:3%; animation-delay:0.8s; }
	.h-illust-note4 { left:62%;   top:90%;   width:4%; animation-delay:0.9s; }
}

@media (prefers-reduced-motion:reduce) {
	.h-illust-item { animation:none; }
}
.h-inner { display:flex; justify-content:center; max-width:960px; width:88%; margin:0 auto; padding:220px 0 160px; }
@media (min-width:880px) {
	.h-inner { padding:max(220px, 15.28vw) 0 max(160px, 11.11vw); }
}
.h-logo { max-width:640px; text-align:center; }
.h-logo small { position:relative; font-size:1.125rem; }

.h-logo-wave { display:flex; align-items:flex-end; justify-content:center; width:100%; gap:0 3.7%; margin-block:20px 30px; }
.h-logo-wave img { display:block; width:auto; height:auto; animation:kf-logoWave 3.5s infinite ease; }
.h-logo-wave img:nth-of-type(1) { width:13.63%; animation-delay:0.30s; } /* ガ */
.h-logo-wave img:nth-of-type(2) { width:10.62%; animation-delay:0.46s; } /* ン */
.h-logo-wave img:nth-of-type(3) { width:11.68%; animation-delay:0.62s; } /* マ */
.h-logo-wave img:nth-of-type(4) { width:15.75%; animation-delay:0.78s; } /* 波 */
.h-logo-wave img:nth-of-type(5) { width:1.77%;  animation-delay:0.94s; } /* ． */
.h-logo-wave img:nth-of-type(6) { width:5.84%;  animation-delay:1.10s; } /* L */
.h-logo-wave img:nth-of-type(7) { width:8.32%;  animation-delay:1.26s; } /* A */
.h-logo-wave img:nth-of-type(8) { width:6.19%;  animation-delay:1.42s; } /* B */

@keyframes kf-logoWave {
	0% { transform:translateY(0); }
	15% { transform:translateY(0.3rem); }
	45% { transform:translateY(-0.5rem); }
	70%, 100% { transform:translateY(0); }
}

@media (prefers-reduced-motion:reduce) {
	.h-logo-wave img { animation:none; }
}
.h-logo small::before { content:''; display:block; position:absolute; top:-60px; left:50%; width:80px; height:70px; background:url('../images/mark.png') no-repeat; background-size:80px auto; transform:translate(-50%,0); }
.h-catch { font-size:1.2rem; }
@media (min-width:880px) {
	.h-logo { max-width:max(800px, 55.56vw); }
	.h-logo small { font-size:1.4rem; }
	.h-catch { font-size:1.25rem; }
	.h-logo small::before { content:''; display:block; position:absolute; top:auto; bottom:60%; left:50%; width:max(110px, 7.64vw); height:max(100px, 6.94vw); background:url('../images/mark.png') no-repeat; background-size:100% auto; transform:translate(-50%,0); }
}

/* scroll */
.scroll-guide { display:flex; position:absolute; left:50%; bottom:1rem; align-items:center; color:var(--color-primary); transform:translateX(-50%); transition:opacity 0.35s ease, visibility 0.35s ease; }
.scroll-guide img { width:4.5rem; height:auto; animation:kf-scrollFloat 2.2s infinite ease-in-out; }

@keyframes kf-scrollFloat {
	0%, 100% { transform:translateY(0); }
	50% { transform:translateY(0.5rem); }
}

@media (prefers-reduced-motion:reduce) {
	.scroll-guide img { animation:none; }
}

/* section */
main { padding-top:2.5rem; }
.s { margin-block-end:4rem; }
.s-head { padding-bottom:1.5rem; }
.s-head h2 { position:relative; isolation:isolate; z-index:0; line-height:1.3; font-size:1.8rem; text-align:center; }
.s-head h2::before { content:''; display:block; position:absolute; z-index:-1; top:50%; left:50%; width:13.75rem; height:1rem; margin-left:-6.875rem; border-radius:999px; background:var(--color-white); transform-origin:left center; transform:translateY(4px) scaleX(0); transition:transform 1s ease; }
.s-head h2.is-inview::before { transform:translateY(4px) scaleX(1); }
.s-head h2.s-head-multiline::before { display:none; }
.s-head-highlight { position:relative; display:inline-block; }
.s-head-highlight::before { content:''; display:block; position:absolute; z-index:-1; top:68%; left:-14%; width:13.75rem; height:1rem; border-radius:999px; background:var(--color-white); transform-origin:left center; transform:translateY(4px) scaleX(0); transition:transform 1s ease; }
.s-head h2.is-inview .s-head-highlight::before { transform:translateY(4px) scaleX(1); }
.s-head h2 small { display:flex; justify-content:center; align-items:center; color:var(--color-primary); font-family:'Montserrat', sans-serif; font-size:0.4em; font-weight:400; letter-spacing:0.1em; }
.s-head p { padding-top:0.5rem; font-size:0.875rem; text-align:center; }
.s-inner { padding:1.5rem; border:1px solid rgb(from var(--color-primary) r g b / 40%); border-radius:0.9rem; background:var(--color-white); box-shadow:0 0.4rem 0 rgb(from var(--color-base) r g b / 8%); }
.s-content p { padding-bottom:1rem; }
.s-content p:last-child { padding-bottom:0; }
.s-placeholder { text-align:center; }
.s-img { max-width:7.45rem; }

@media (min-width:880px) {
	main { padding-top:max(4rem, 8vw); }
	.s { margin-block-end:5rem; }
	.s-head { padding-bottom:2.25rem; }
	.s-head h2 { font-size:2rem; }
	.s-head h2::before { width:26.25rem; height:1.25rem; margin-left:-13.125rem; }
	.s-head h2.s-head-multiline::before { display:block; }
	.s-head h2.s-head-wide::before { width:36rem; margin-left:-18rem; }
	.s-head-highlight::before { display:none; }
	.s-head p { font-size:1rem; }
	.s-inner { padding:2.25rem; box-shadow:0 0.5rem 0 rgb(from var(--color-base) r g b / 8%); }
	.s-img { max-width:16rem; }
}

/* faq */
.faq-item + .faq-item { margin-block-start:3rem; }
.faq-question { position:relative; margin-block-end:1rem; padding-top:3.0rem; padding-left:0; font-size:1.125rem; line-height:1.5; }
.faq-question br { display:none; }
.faq-question span[aria-hidden='true'] { display:flex; align-items:center; justify-content:center; position:absolute; top:1.0rem; left:50%; isolation:isolate; z-index:0; width:2.5rem; height:2.5rem; padding-bottom:0.15em; border-radius:0.25rem; color:var(--color-primary); line-height:1; font-size:1.5rem; background:var(--color-white); transform:translate(-50%,-50%); }
.faq-question span[aria-hidden='true']::after { content:''; position:absolute; z-index:-1; top:50%; right:25%; width:1rem; height:2px; border-radius:999px; background:var(--color-white); transform:rotate(90deg) translate(100%,0); }
.faq-question mark { padding:0 0.1em; color:inherit; background-color:transparent; background-image:linear-gradient(transparent 60%, rgb(from var(--color-white) r g b / 50%) 61%); background-repeat:no-repeat; background-size:0% 100%; transition:background-size 1s ease 1s; }
.faq-question mark.is-inview { background-size:100% 100%; }
.faq-answer { position:relative; margin-block-start:2rem; padding:1.5rem; border:1px solid rgb(from var(--color-primary) r g b / 30%); border-radius:0.9rem; background:var(--color-white); box-shadow:0 0.4rem 0 rgb(from var(--color-base) r g b / 8%); }
.faq-answer span[aria-hidden='true'] { display:flex; align-items:center; justify-content:center; position:absolute; top:-1.5rem; left:50%; isolation:isolate; z-index:0; width:2.5rem; height:2.5rem; padding-bottom:0.15em; border-radius:0.25rem; color:var(--color-white); line-height:1; font-size:1.5rem; background:var(--color-primary); transform:translate(-50%,0); }
.faq-answer span[aria-hidden='true']::after { content:''; position:absolute; z-index:-1; top:50%; right:25%; width:1rem; height:2px; border-radius:999px; background:var(--color-primary); transform:rotate(90deg) translate(100%,0); }
.faq-answer-inner { display:grid; grid-template-columns:1fr; gap:1.5rem; align-items:center; }
.faq-answer-text { min-width:0; }
.faq-answer-text p { padding-bottom:1rem; }
.faq-answer-text p:last-child { padding-bottom:0; }
.faq-answer-full p { padding-bottom:1rem; }
.faq-answer-full p:last-child { padding-bottom:0; }
.faq-answer-media { display:flex; align-items:center; justify-content:flex-end; width:60%; max-width:8rem; margin:0 auto; }
.faq-answer-media img { display:block; width:100%; height:auto; animation:kf-faqTilt 1.6s steps(2, end) infinite; }

@keyframes kf-faqTilt {
	0%, 100% { transform:rotate(-6deg); }
	50% { transform:rotate(6deg); }
}

@media (prefers-reduced-motion:reduce) {
	.faq-answer-media img { animation:none; }
}

@media (min-width:880px) {
	.faq-item + .faq-item { margin-block-start:2.25rem; }
	.faq-question { margin-block-end:0; padding-top:0; padding-left:2.25rem; font-size:1.5rem; }
	.faq-question br { display:inline; }
	.faq-question span[aria-hidden='true'] { display:flex; align-items:center; justify-content:center; position:absolute; top:0.35rem; left:-0.75rem; isolation:isolate; z-index:0; width:1.5rem; height:1.5rem; padding-bottom:0.15em; border-radius:0.25rem; color:var(--color-primary); line-height:1; font-size:1.0rem; background:var(--color-white); transform:translate(0,0); }
	.faq-question span[aria-hidden='true']::after { content:''; position:absolute; z-index:-1; top:50%; right:-0.4rem; width:1rem; height:2px; border-radius:999px; background:var(--color-white); transform:translateY(-50%); }
	.faq-answer { padding:2.25rem; box-shadow:0 0.5rem 0 rgb(from var(--color-base) r g b / 8%); }
	.faq-answer span[aria-hidden='true'] { display:flex; align-items:center; justify-content:center; position:absolute; top:2.35rem; left:-0.75rem; isolation:isolate; z-index:0; width:1.5rem; height:1.5rem; padding-bottom:0.15em; border-radius:0.25rem; color:var(--color-white); line-height:1; font-size:1.0rem; background:var(--color-primary); transform:translate(0,0); }
	.faq-answer span[aria-hidden='true']::after { content:''; position:absolute; z-index:-1; top:50%; right:-0.4rem; width:1rem; height:2px; border-radius:999px; background:var(--color-primary); transform:rotate(0) translateY(-50%); }
	.faq-answer-inner { grid-template-columns:minmax(0, 1fr) auto; gap:2rem; }
	.faq-answer-media { width:100%; max-width:10rem; justify-self:end; }
	.faq-list .faq-item:nth-child(3) .faq-answer-media,
	.faq-list .faq-item:nth-child(4) .faq-answer-media { width:7rem; max-width:7rem; }

	.faq-answer-inner.faq-answer-inner--split {
		grid-template-columns:minmax(0, 1fr) auto;
		grid-template-areas:
			"full full"
			"text media";
		align-items:end;
	}
	.faq-answer-inner--split .faq-answer-full { grid-area:full; align-self:start; }
	.faq-answer-inner--split .faq-answer-text { grid-area:text; }
	.faq-answer-inner--split .faq-answer-media { grid-area:media; justify-self:end; align-self:end; width:7rem; max-width:7rem; }
}

/* reference */
.reference { margin-block-end:60px; }
.reference-inner { padding:1.75rem; border:rgba(from var(--color-base) r g b / 20%) 1px solid; border-radius:1.0rem; color:var(--color-darkgray); background:var(--color-white); }
.reference h4 { padding-bottom:1rem; color:var(--color-primary); }
.reference ul { padding-left:2rem; text-indent:-1.0rem; }
@media (min-width:880px) {
	.reference { margin-block-end:max(120px, 8.33vw); }
	.reference-inner { padding:2.25rem; }
}

/* list */
.list-num-parentheses { font-size:0.9rem; }
.list-num-parentheses li { padding-bottom:0.15em; padding-left:1.5rem; line-height:1.5; text-indent:-1.5rem; overflow-wrap:break-word; overflow-wrap:anywhere; }
.list-num-parentheses li:last-child { padding-bottom:0; }
.list-num-parentheses li .num { display:inline-block; width:1.5rem; }
.list-num-parentheses li .ref-sub { display:block; margin-top:0.4em; text-indent:0; }

/* foot */
.f { padding:2.5rem 0 1.5rem; background:var(--color-white); }
.f-inner { width:88%; max-width:960px; margin:0 auto; text-align:center; }
.f-title { padding-bottom:0.75rem; font-size:0.85rem; font-weight:700; }
.f-text { max-width:46rem; margin:0 auto; padding-bottom:1.25rem; font-size:0.7rem; line-height:1.9; }
.f-text br { display:none; }
.f-copyright { font-size:0.6rem; font-weight:400; }

@media (min-width:880px) {
	.f { padding:3rem 0 2rem; }
	.f-inner { width:90%; max-width:max(960px, 66.67vw); }
	.f-title { font-size:1.125rem; }
	.f-text { font-size:0.75rem; line-height:1.8; }
	.f-text br { display:inline; }
	.f-copyright { font-size:0.65rem; }
}

/* adjust */
.sp{ display:block; }
.cb { clear:both; }
.d-ib { display:inline-block; }
.float-left { float:left; margin:0 1rem 1rem 0; }
.float-right { float:right; margin:0 0 1rem 1rem; }

@media (min-width:880px) {
	.sp { display:none; }
}

/* 404 */
.notfound { display:flex; align-items:center; justify-content:center; min-height:100svh; padding:3rem 0; text-align:center; }
.notfound-inner { width:88%; max-width:32rem; margin:0 auto; }
.notfound-eyebrow { color:var(--color-primary); font-family:'Montserrat', sans-serif; font-size:0.9rem; font-weight:400; letter-spacing:0.15em; }
.notfound-title { padding-top:0.75rem; font-size:1.6rem; font-weight:700; }
.notfound-text { padding-top:1.25rem; font-size:0.9rem; line-height:1.9; }
.notfound-btn { display:inline-block; margin-top:2rem; padding:0.55rem 2.5rem; border-radius:999px; color:var(--color-white); font-size:0.95rem; font-weight:700; background:var(--color-primary); box-shadow:0 0.3rem 0 rgb(from var(--color-base) r g b / 15%); }
.notfound-btn:hover { opacity:0.85; }

@media (min-width:880px) {
	.notfound-eyebrow { font-size:1.1rem; }
	.notfound-title { padding-top:1rem; font-size:2.25rem; }
	.notfound-text { padding-top:1.5rem; font-size:1rem; }
	.notfound-btn { padding:0.65rem 3rem; font-size:1.05rem; }
}