@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;200;300;400;500;600;700;800;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&display=swap");
/* reset */
* { box-sizing: border-box; }

html { -moz-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; }

html, body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, figure, figcaption, blockquote, dl, dt, dd, table, tr, td, th { margin: 0; padding: 0; box-sizing: border-box; font-size: 100%; }

ul, ol, li { list-style: none; }

em, i { font-style: normal; }

img, iframe, svg { max-width: 100%; }

input, button, textarea, select { font: inherit; }

a { text-decoration: none; }

.ffm { font-family: "Noto Serif Japanese", serif; position: relative; }

.pt1 { padding-top: 1rem; }

.pt2 { padding-top: 2rem; }

.pt3 { padding-top: 3rem; }

.mt0 { margin-top: 0; }

.mt1 { margin-top: 1rem; }

.mb0 { margin-bottom: 0; }

.txt-center { text-align: center; }

.txt-right { text-align: right; }

.ti1 { text-indent: -1em; padding-left: 1em; }

.ti12 { text-indent: -1.2em; padding-left: 1.2em; }

.ti15 { text-indent: -1.5em; padding-left: 1.5em; }

.ti2 { text-indent: -2em; padding-left: 2em; }

.notes { font-size: 12px; font-weight: 400; padding-top: 1em; line-height: 1.4; }
.notes li { margin-bottom: 4px; }

.d_ib { display: inline-block; text-indent: 0; }

.fadeIn, .fadeIn2 { visibility: hidden; opacity: 0; transition-duration: 1.2s; }
.fadeIn.inView, .fadeIn2.inView { visibility: visible; opacity: 1; }

.italic { font-style: italic; margin-right: 3px; }

h1, h2, h3, h4, h5, h6 { font-weight: 600; }

b, strong { font-weight: 600; }

sup { font-size: 0.75em; }

/*
---------------------------------------------------------------------------
common
---------------------------------------------------------------------------
*/
body { line-height: 1.7; font-size: 20px; font-family: 'Noto Sans JP', sans-serif; color: #333; font-weight: 500; }

.container { width: 980px; max-width: 92%; margin-left: auto; margin-right: auto; }

/*
---------------------------------------------------------------------------
kv
---------------------------------------------------------------------------
*/
.kv { position: relative; }
.kv h1 { position: absolute; left: 50%; top: 40%; transform: translate(-50%, -50%); z-index: 2; width: 45vw; min-width: 200px; }

/*
---------------------------------------------------------------------------
lead
---------------------------------------------------------------------------
*/
.lead { border-bottom: 6rem solid #091389; }
.lead .container { padding: 5rem 0; position: relative; }
.lead p { width: 72%; }
.lead figure { position: absolute; width: 18%; bottom: -4rem; right: 0; }

/*
---------------------------------------------------------------------------
selfcheck
---------------------------------------------------------------------------
*/
.selfcheck { background: #d1d3d4; padding-bottom: 6rem; }

.btn { background: #091389; color: #fff; text-align: center; font-size: min(6vw, 32px); display: inline-block; padding: 1.5rem 5rem 1.8rem; border-radius: 24px; box-shadow: 0 2px 3px #666; transition-duration: 0.5s; line-height: 1.1; }

.btn:hover { transform: scale(1.1); }

.selfcheck-start { padding: 6rem 0 9rem; text-align: center; position: relative; }
.selfcheck-start h2 { color: #091389; font-size: min(7vw, 38px); padding-bottom: 1rem; }
.selfcheck-start .start-btn { padding: 5rem 0 0; }
.selfcheck-start .start-btn .btn { font-size: min(7.2vw, 40px); }
.selfcheck-start .start-btn .btn.done { pointer-events: none; box-shadow: none; }
.selfcheck-start figure { position: absolute; width: 24%; right: -4%; bottom: 3rem; }

/*
---------------------------------------------------------------------------
Q
---------------------------------------------------------------------------
*/
.q-wrap { background: #fff; border: 2px solid #091389; border-radius: 24px; padding: 3rem; }
.q-wrap h3 { max-width: 80%; margin: auto; display: flex; align-items: center; line-height: 1.4; }
.q-wrap h3 i { flex: 0 0 100px; padding-right: 2rem; line-height: 0; }
.q-wrap h3 em { font-size: min(4.2vw, 28px); }
.q-wrap h3 span { color: #d11; padding-bottom: 0.3em; }

.q-btn { display: flex; justify-content: center; padding: 2rem 0 0; }
.q-btn li { padding: 0 2rem; }
.q-btn .btn { background: #b1b3b3; width: 6em; padding: 0.5em 0.5em 0.7em; }

.done .btn { pointer-events: none; opacity: 0.4; box-shadow: none; }
.done .btn.selected { background: #091389; opacity: 1; }

.q { position: relative; }

.q1 { border-top: 4px dashed #091389; padding-top: 9rem; }
.q1::before { content: ""; display: block; position: absolute; left: 0; top: 3rem; width: 100%; height: 3rem; background: url("../images/down.svg") no-repeat center; background-size: contain; display: block; }

.q-all { padding-top: 9rem; position: relative; }
.q-all::before { content: ""; display: block; position: absolute; left: 0; top: 3rem; width: 100%; height: 3rem; background: url("../images/down.svg") no-repeat center; background-size: contain; display: block; }
.q-all .q { margin-bottom: 4rem; }
.q-all abbr.show { display: block; padding-top: 3rem; text-align: center; color: #d11; font-size: 16px; }

.result { text-align: center; padding: 2rem 0; }
.result .btn { width: 400px; max-width: 100%; }
.result .done { pointer-events: none; box-shadow: none; }

/*
---------------------------------------------------------------------------
fin
---------------------------------------------------------------------------
*/
.fin { position: relative; padding-top: 9rem; }
.fin::before { content: ""; display: block; position: absolute; left: 0; top: 3rem; width: 100%; height: 3rem; background: url("../images/down.svg") no-repeat center; background-size: contain; display: block; }

.fin-wrap { background: #fff; border-radius: 24px; padding: 3rem 1rem; text-align: center; }
.fin-wrap h3 { color: #091389; font-size: min(6.4vw, 42px); font-weight: 700; padding-bottom: 3rem; }
.fin-wrap p { color: #091389; font-size: min(4.2vw, 32px); font-weight: 500; padding-bottom: 1rem; display: none; }

.show_fin1 p.fin1 { display: block; }

.show_fin2 p.fin2 { display: block; }

/*
---------------------------------------------------------------------------
more
---------------------------------------------------------------------------
*/
.more { background: #fff; padding: 6rem 0 0; }

.more_pdf .container { display: flex; flex-direction: row-reverse; justify-content: space-between; }
.more_pdf .more-txt { flex: 0 0 56%; font-size: clamp(14px, 5vw, 24px); }
.more_pdf .more-txt p { padding-bottom: 2rem; }
.more_pdf figure { flex: 0 0 36%; }

.pdf-btn { display: inline-flex; align-items: center; justify-content: center; padding-left: 2rem; padding-right: 2rem; white-space: nowrap; }
.pdf-btn i { flex: 0 0 1.1em; margin-left: 1rem; }

.more_comment { background: #091389; color: #fff; font-size: clamp(14px, 4.6vw, 24px); }
.more_comment .container { position: relative; padding: 4rem 0; }
.more_comment p { width: 70%; }
.more_comment figure { position: absolute; line-height: 0; bottom: 0; right: 0; width: 28%; }

/*
---------------------------------------------------------------------------
---------------------------------------------------------------------------
*/
.pagetop { position: sticky; z-index: 10; bottom: 8px; }
.pagetop p { text-align: right; position: absolute; right: 8px; bottom: 8px; font-size: 12px; }
.pagetop p a { display: flex; justify-content: center; align-items: center; position: relative; border-radius: 10px; padding: 8px; width: 40px; height: 40px; background: #fff; border-radius: 50%; border: 1px solid #091389; transition-duration: 0.4s; }
.pagetop p a span { width: 8px; height: 8px; border-top: 1px solid #091389; border-right: 1px solid #091389; transform: rotate(-45deg) translate(-5%, 5%); transform-origin: center; }
.pagetop p a::after { position: absolute; left: 50%; top: 50%; width: 16px; height: 12px; clip-path: polygon(0 100%, 50% 0, 100% 100%); background: #091389; transform: translate(-50%, -50%); transform-origin: center; }
.pagetop p a:hover { opacity: 0.8; background: #091389; }
.pagetop p a:hover span { border-color: #fff; }
.pagetop p a:hover::after { background: #fff; }

.footer { padding: 3rem 0; }
.footer p { text-align: center; font-size: 12px; color: #444; line-height: 2; font-weight: 300; }

/*
---------------------------------------------------------------------------
responsive
---------------------------------------------------------------------------
*/
.sp { display: none; }

@media (max-width: 768px) { .sp { display: block; }
  br.sp { display: inline; }
  .pc { display: none; }
  body { font-size: 16px; }
  .btn { padding: 1.2rem; width: 400px; max-width: 92%; margin: 0 auto; }
  .kv h1 { width: 60vw; }
  .kv figure { overflow: hidden; }
  .kv figure img { transform: scale(1.2); }
  .lead { border-bottom-width: 8vw; }
  .lead .container { padding: 8vw 0; }
  .lead p { width: auto; }
  .lead figure { width: 24%; position: static; float: right; margin-left: 1rem; }
  .selfcheck-start { padding: 8vw 0; }
  .selfcheck-start figure { position: static; text-align: right; padding-top: 8vw; margin: auto; }
  .selfcheck-start .start-btn { padding-top: 0; }
  .selfcheck { padding-bottom: 12vw; }
  .q1, .q-all, .fin { padding-top: 7rem; }
  .q-all::before, .fin::before, .q1::before { height: 2rem; }
  .q-wrap { padding: 1rem; }
  .q-wrap h3 { max-width: 100%; }
  .q-wrap h3 i { flex: 0 0 20%; padding-right: 1rem; }
  .q-btn { padding-top: 1rem; }
  .q-btn li { padding: 0 8px; }
  .q-btn .btn { width: auto; min-width: 5em; }
  .q-all .q { margin-bottom: 2rem; }
  .result { padding-bottom: 0; }
  .fin-wrap { padding: 8vw; }
  .fin-wrap h3 { padding-bottom: 8vw; }
  .more { padding-top: 8vw; }
  .more_pdf .container { display: block; text-align: center; }
  .pagetop { display: none; bottom: 0; visibility: hidden; }
  .pagetop p { right: 50%; transform: translateX(50%); } }
.ssp { display: none; }

@media (max-width: 480px) { .ssp { display: inline; }
  .btn:hover { transform: scale(1); }
  .q-wrap h3 i { flex: 0 0 16%; padding-right: 8px; }
  .q-wrap h3 em { white-space: nowrap; }
  .result { padding-top: 0; } }

/*# sourceMappingURL=page.css.map */