@charset "UTF-8";
/* 日本語 */
.head { background-color: #D0F5FE; padding: 90px 0 80px; }
.head h1 { max-width: 880px; height: 220px; width: calc(100% - 180px); margin: 0 auto; border: 12px solid #08F7EF; background: url("../image/single.svg") center center repeat #DFF9FF; border-radius: 30px; text-align: center; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; align-items: center; font: 6.4rem/1em "Nunito", sans-serif; font-weight: 900; }
.head h1 span { margin: 20px 0 0; font: 2.5rem/1em "LINE Seed JP", sans-serif; font-weight: 700; letter-spacing: 0.05em; }
.head h1 rt { font-weight: 400; margin: 0 0 8px; }

/*min-width:1920px*/
/*max-width:1280px*/
@media (max-width: 1024px) { .head h1 { max-width: 768px; } }
/*max-width:1024px*/
@media (max-width: 768px) { .head h1 { max-width: 480px; height: 200px; width: calc(100% - 50px); font: 6rem/1em "Nunito", sans-serif; font-weight: 900; }
  .head h1 span { margin: 10px 0 0; } }
/*max-width:768px*/
@media (max-width: 480px) { .head h1 { height: 170px; font: 4.6rem/1em "Nunito", sans-serif; font-weight: 900; border: 10px solid #08F7EF; }
  .head h1 span { margin: 10px 0 0; font: 2.4rem/1em "LINE Seed JP", sans-serif; font-weight: 700; letter-spacing: 0.05em; } }
/*max-width:480px*/
/**********************************************/
section { position: relative; z-index: 10; background-color: #D0F5FE; padding: 0 0 60px; }
section .faq_box { max-width: 1240px; width: calc(100% - 180px); margin: 0 auto; }
section .faq_box h1 { padding: 2px 0 0 45px; margin: 0 auto 40px; position: relative; font: 2.8rem/1.6em "LINE Seed JP", sans-serif; font-weight: 700; letter-spacing: 0.05em; }
section .faq_box h1:before { position: absolute; content: ""; display: block; width: 15px; height: 100%; background-color: #08F7EF; left: 0; top: 0; }
section:last-of-type { border-radius: 0 0 25px 25px; padding: 0 0 140px; }
section dl { width: 100%; margin: 0 auto; counter-reset: hoge; overflow: hidden; }
section dt { background-color: #fff; padding: 22px 30px 22px 110px; position: relative; border-radius: 15px; min-height: 110px; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; align-items: flex-start; font: 2rem/1.8em "Nunito", sans-serif; font-weight: 700; letter-spacing: 0.05em; z-index: 10; }
section dt span { padding: 0 60px 0 30px; position: relative; display: block; width: 100%; }
section dt span:after, section dt span:before { transition: .3s; position: absolute; content: ""; display: block; width: 20px; height: 2px; letter-spacing: 0; line-height: 50px; text-align: center; right: 15px; top: 50%; transform: translateY(-50%); z-index: 5; background-color: #000; }
section dt span:after { transform: translateY(-50%) rotate(90deg); }
section dt::before { display: flex; align-items: center; justify-content: center; width: 110px; height: 100%; border-radius: 15px 0 0 15px; position: absolute; top: 0; left: 0; z-index: 1; counter-increment: hoge; content: "Q" counter(hoge); font: 3rem/1em "Nunito", sans-serif; font-weight: 700; background-color: #08f7ef; }
section dt:after { position: absolute; content: ""; display: block; width: 50px; height: 50px; background-color: #08F7EF; border-radius: 50%; right: 30px; top: 50%; transform: translateY(-50%); }
section dt.active span:after { transform: translateY(-50%) rotate(0deg); }
section dd { border-radius: 0 0 15px 15px; display: grid; grid-template-rows: 0fr; margin: -15px 0 35px; overflow: hidden; padding: 0 50px; background-color: #eafbff; transition: grid-template-rows 0.4s cubic-bezier(0.4, 0, 0.2, 1), margin-bottom 0.4s cubic-bezier(0.4, 0, 0.2, 1); position: relative; }
section dd a { color: #FF7E93; text-decoration: underline; }
section dd a:hover { opacity: 0.5; }
section dd h3 { font: 1.9rem/2em "Noto Sans JP", sans-serif; font-weight: 700; border-bottom: 1px solid #707070; margin: 0 0 15px; padding: 0 0 5px 0; }
section dd .kome { padding: 25px 0 45px 0; counter-reset: hoge; }
section dd .kome li { font: 1.6rem/1.8em "Noto Sans JP", sans-serif; font-weight: 400; position: relative; padding: 0 0 0 45px; }
section dd .kome li:before { position: absolute; content: "※" counter(hoge) "）"; left: 0; counter-increment: hoge; }
section dd > div { min-height: 0; padding: 0 0 0 55px; transition: padding-top 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding-bottom 0.4s cubic-bezier(0.4, 0, 0.2, 1); position: relative; font: 1.8rem/2em "Noto Sans JP", sans-serif; font-weight: 500; letter-spacing: 0.05em; text-align: justify; text-justify: inter-ideograph; }
section dd > div p { margin: 0 0 15px; }
section dd > div:before { position: absolute; content: "A"; left: 0; top: 50px; color: #FF7E93; font: 3rem/1em "Nunito", sans-serif; font-weight: 700; transition: 0.4s; opacity: 0; }
section dd:last-of-type { margin: 0; }
section dd.open { grid-template-rows: 1fr; }
section dd.open:after { opacity: 1; }
section dd.open > div { padding-top: 45px; padding-bottom: 35px; }
section dd.open > div:before { opacity: 1; }

/*min-width:1920px*/
/*max-width:1280px*/
/*max-width:1024px*/
@media (max-width: 768px) { section .faq_box { width: calc(100% - 50px); }
  section .faq_box h1 { padding: 2px 0 0 35px; font: 2rem/1.6em "LINE Seed JP", sans-serif; font-weight: 700; }
  section .faq_box h1:before { width: 10px; }
  section:last-of-type { border-radius: 0 0 25px 25px; padding: 0 0 140px; }
  section dt { padding: 18px 15px 18px 50px; font: 1.8rem/1.8em "Nunito", sans-serif; font-weight: 700; letter-spacing: 0.05em; z-index: 10; min-height: 100px; }
  section dt span { padding: 0 50px 0 20px; }
  section dt span br { display: none; }
  section dt span:after, section dt span:before { width: 15px; height: 2px; right: 10px; }
  section dt::before { display: flex; align-items: flex-start; padding: 20px 0 0 0; width: 50px; height: calc(100% - 20px); font: 1.8rem/1em "Nunito", sans-serif; font-weight: 700; }
  section dt:after { width: 36px; height: 36px; right: 15px; }
  section dd { margin: -15px 0 35px; padding: 0 0; }
  section dd > div { min-height: 0; padding: 0 25px 0 50px; font: 1.6rem/2em "Noto Sans JP", sans-serif; font-weight: 500; letter-spacing: 0.05em; }
  section dd > div:before { width: 50px; text-align: center; left: 0; top: 42px; font: 2rem/1em "Nunito", sans-serif; font-weight: 700; }
  section dd h3 { font: 1.8rem/2em "Noto Sans JP", sans-serif; font-weight: 700; border-bottom: 1px solid #707070; margin: 0 0 15px; padding: 0 0 5px 0; }
  section dd .kome { padding: 25px 0 45px 0; counter-reset: hoge; }
  section dd .kome li { font: 1.5rem/1.8em "Noto Sans JP", sans-serif; font-weight: 400; position: relative; padding: 0 0 0 45px; }
  section dd .kome li:before { position: absolute; content: "※" counter(hoge) "）"; left: 0; counter-increment: hoge; }
  section dd.open { grid-template-rows: 1fr; }
  section dd.open:after { opacity: 1; }
  section dd.open > div { padding-top: 35px; padding-bottom: 25px; }
  section dd.open > div:before { opacity: 1; } }
/*max-width:768px*/
/*max-width:480px*/