@charset "UTF-8";
/* reset5 © 2011 opensource.736cs.com MIT */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, audio, canvas, details, figcaption, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, summary, time, video {
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  margin: 0;
  padding: 0; }

body {
  line-height: 1; }

article, aside, dialog, figure, footer, header, hgroup, nav, section, blockquote {
  display: block; }

nav ul {
  list-style: none; }

ol {
  list-style: decimal; }

ul {
  list-style: disc; }

ul ul {
  list-style: circle; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
  content: none; }

ins {
  text-decoration: underline; }

del {
  text-decoration: line-through; }

mark {
  background: none; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0; }

input[type=submit], input[type=button], button {
  margin: 0 !important;
  padding: 0 !important; }

input, select, a img {
  vertical-align: middle; }

/* フォームのリセットここから */
input,
button,
select,
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  border-radius: 0;
  font: inherit;
  outline: none; }

textarea {
  resize: vertical; }

input[type='checkbox'],
input[type='radio'] {
  display: none; }

input[type='submit'],
input[type='button'],
label,
button,
select {
  cursor: pointer; }

select::-ms-expand {
  display: none; }

/* フォームのリセットここまで */
html {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 10px; }

*, *:before, *:after {
  -moz-box-sizing: inherit;
  -webkit-box-sizing: inherit;
  box-sizing: inherit; }

body {
  -webkit-text-size-adjust: 100%;
  	/*
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  	*/ }

main {
  display: block; }

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

ul, ol {
  list-style: none !important; }

a {
  color: inherit;
  text-decoration: none; }

button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
  color: inherit;
  font-size: inherit; }

img {
  width: auto;
  height: auto;
  max-width: 100%;
  vertical-align: top; }

mark {
  color: inherit; }

.pc {
  display: none; }

.sp {
  display: none; }

@media screen and (min-width: 769px) {
  .pc {
    display: block !important; }

  img.pc,
  span.pc {
    display: inline !important; } }
@media screen and (max-width: 768px) {
  .sp {
    display: block !important; }

  img.sp,
  span.sp {
    display: inline !important; } }
span.nowrap {
  display: inline-block; }

html {
  height: 100%; }

body {
  height: 100%;
  font-family: "Noto Sans JP", sans-serif;
  transition: all ease 1s;
  opacity: 0; }
  .is-loaded body {
    opacity: 1; }
  body main {
    display: flex;
    justify-content: center;
    height: 100%; }
    body main .visual {
      display: none; }
      @media screen and (min-width: 769px) {
        body main .visual {
          display: flex;
          justify-content: center;
          align-items: center;
          flex: 0 0 calc(100% - 375px);
          background-image: url("../images/visual.jpg");
          background-size: cover; }
          body main .visual .logo {
            width: 250px; } }
    body main #content {
      position: relative;
      overflow: hidden;
      background-image: url("../images/bg.png");
      background-size: cover;
      flex: 0 0 100%; }
      @media screen and (min-width: 769px) {
        body main #content {
          flex: 0 0 375px; } }
      body main #content:before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-image: url("../images/bg_white.png");
        background-size: cover;
        background-color: #fff;
        opacity: 0;
        transition: all ease .3s; }
      body main #content.white:before {
        opacity: 1; }
      body main #content > header {
        position: absolute;
        z-index: 100;
        top: -100px;
        left: 0;
        right: 0;
        transition: all ease .5s; }
        body main #content > header.active {
          top: 0; }
        body main #content > header .logo {
          position: absolute;
          top: 40px;
          left: 25px;
          -webkit-mask-image: url("../images/header_logo.png");
          -webkit-mask-size: 100% 100%;
          mask-image: url("../images/header_logo.png");
          mask-size: 100% 100%;
          width: 64px;
          height: 60px;
          transition: all ease .5s;
          background-color: #039146; }
        body main #content > header ul.progress {
          display: flex;
          gap: 10px;
          position: absolute;
          right: 25px;
          top: 43px;
          transition: all ease .5s; }
          body main #content > header ul.progress li {
            position: relative;
            background-color: #E8E8E8;
            border-radius: 50%;
            width: 8px;
            height: 8px;
            transition: all ease .5s; }
            body main #content > header ul.progress li:after {
              content: "";
              position: absolute;
              top: 50%;
              left: 50%;
              display: block;
              width: 14px;
              height: 14px;
              border: 1px solid #039146;
              border-radius: 50%;
              transform: translate(-50%, -50%);
              transition: all ease .5s;
              opacity: 0; }
            body main #content > header ul.progress li.active {
              background-color: #039146; }
              body main #content > header ul.progress li.active:after {
                opacity: 1; }
        body main #content > header.white .logo {
          background-color: #fff; }
        body main #content > header.white ul.progress {
          opacity: 0; }
      body main #content section {
        position: absolute;
        top: 0;
        left: 100%;
        width: 100%;
        height: 100%;
        overflow: auto;
        transition: all ease .5s;
        -ms-overflow-style: none;
        scrollbar-width: none; }
        body main #content section::-webkit-scrollbar {
          display: none; }
        body main #content section.intro {
          left: 0; }
          body main #content section.intro .container {
            position: relative;
            width: calc(100% - 25px * 2);
            margin: 0 auto;
            min-height: 100%;
            display: flex;
            justify-content: center;
            align-items: center; }
            body main #content section.intro .container .logo {
              background-image: url("../images/intro_logo.svg");
              background-size: 100% 100%;
              background-repeat: no-repeat;
              width: 110px;
              height: 112px;
              position: absolute;
              top: 40px;
              left: 0; }
            body main #content section.intro .container .content {
              padding-top: 196px;
              padding-bottom: 162px;
              padding-top: 186px;
              padding-bottom: 152px; }
              body main #content section.intro .container .content .copy {
                margin-bottom: 36px; }
                body main #content section.intro .container .content .copy p[lang='ja'] {
                  font-weight: bold;
                  font-size: 16px;
                  letter-spacing: 0.12em;
                  line-height: 30px;
                  text-align: left;
                  color: #fff;
                  margin-bottom: 13px; }
                body main #content section.intro .container .content .copy p[lang='en'] {
                  font-family: "Inter", sans-serif;
                  font-weight: 500;
                  font-size: 12px;
                  line-height: 20px;
                  text-align: left;
                  color: #fff; }
              body main #content section.intro .container .content .notice p[lang='ja'] {
                font-weight: 500;
                font-size: 12px;
                line-height: 20px;
                text-align: left;
                color: #fff;
                margin-bottom: 13px; }
              body main #content section.intro .container .content .notice p[lang='en'] {
                font-family: "Inter", sans-serif;
                font-weight: normal;
                font-size: 10px;
                line-height: 14px;
                text-align: left;
                color: #fff; }
            body main #content section.intro .container .action {
              position: absolute;
              bottom: 40px;
              left: 0;
              right: 0; }
              body main #content section.intro .container .action button {
                position: relative;
                border: 2px solid #fff;
                width: 100%;
                height: 88px;
                display: flex;
                justify-content: center;
                align-items: center; }
                body main #content section.intro .container .action button .inner p[lang='ja'] {
                  font-weight: bold;
                  font-size: 16px;
                  letter-spacing: 0.2em;
                  line-height: 24px;
                  text-align: center;
                  color: #fff; }
                body main #content section.intro .container .action button .inner p[lang='en'] {
                  font-family: "Inter", sans-serif;
                  font-weight: 500;
                  font-size: 12px;
                  line-height: 15px;
                  text-align: center;
                  color: #fff;
                  margin-top: 8px; }
                body main #content section.intro .container .action button:after {
                  content: "";
                  background-color: #fff;
                  display: block;
                  width: 29px;
                  height: 29px;
                  border-radius: 50%;
                  position: absolute;
                  right: 32px;
                  top: 50%;
                  transform: translateY(-50%);
                  background-image: url("../images/intro_action_btn_arrow.svg");
                  background-position: 50% 50%;
                  background-repeat: no-repeat; }
        body main #content section.q .container {
          position: relative;
          width: calc(100% - 25px * 2);
          margin: 0 auto;
          min-height: 100%;
          display: flex;
          justify-content: center;
          align-items: center; }
          body main #content section.q .container .content {
            padding-top: 112px;
            padding-bottom: 80px;
            width: 100%; }
            body main #content section.q .container .content .marker {
              font-family: "Inter", sans-serif;
              font-weight: 600;
              font-size: 32px;
              letter-spacing: 0.1em;
              line-height: 39px;
              text-align: center;
              color: #039146;
              margin-bottom: 32px; }
            body main #content section.q .container .content .question {
              display: flex;
              justify-content: center;
              align-items: center;
              flex-direction: column;
              min-height: 52px;
              margin-bottom: 44px; }
              body main #content section.q .container .content .question p[lang='ja'] {
                font-weight: bold;
                font-size: 16px;
                letter-spacing: 0.1em;
                line-height: 24px;
                text-align: center;
                color: #000; }
              body main #content section.q .container .content .question p[lang='en'] {
                margin-top: 12px;
                font-family: "Inter", sans-serif;
                font-weight: 500;
                font-size: 12px;
                line-height: 20px;
                text-align: center;
                color: #000; }
            body main #content section.q .container .content ul.answer {
              display: flex;
              flex-wrap: wrap;
              gap: 16px;
              min-height: 304px;
              align-content: flex-start; }
              body main #content section.q .container .content ul.answer li {
                flex: 0 0 100%;
                border: 2px solid #009245;
                height: 64px;
                display: flex;
                justify-content: center;
                align-items: center;
                flex-direction: column;
                cursor: pointer; }
                body main #content section.q .container .content ul.answer li p[lang='ja'] {
                  font-weight: bold;
                  font-size: 16px;
                  letter-spacing: 0.2em;
                  line-height: 24px;
                  text-align: center;
                  color: #039146;
                  margin-bottom: 1px; }
                body main #content section.q .container .content ul.answer li p[lang='en'] {
                  font-family: "Inter", sans-serif;
                  font-weight: 500;
                  font-size: 12px;
                  line-height: 15px;
                  text-align: center;
                  color: #039146; }
          body main #content section.q .container .back {
            position: absolute;
            bottom: 34px;
            left: 0;
            padding-left: 34px;
            font-weight: 500;
            font-size: 14px;
            letter-spacing: 0.1em;
            line-height: 24px;
            color: #000;
            cursor: pointer; }
            body main #content section.q .container .back:before {
              content: "";
              background-color: #039146;
              width: 24px;
              height: 24px;
              border-radius: 50%;
              position: absolute;
              top: 0;
              left: 0;
              background-image: url("../images/back_arrow.svg");
              background-repeat: no-repeat;
              background-position: 50% 50%; }
        body main #content section.q[data-q="1"] .container .content ul.answer li {
          flex: 0 0 calc((100% - 16px) / 2); }
        body main #content section.processing {
          pointer-events: none;
          left: 0;
          opacity: 0;
          transition: all ease 1s; }
          body main #content section.processing .container {
            position: relative;
            width: calc(100% - 25px * 2);
            margin: 0 auto;
            min-height: 100%;
            display: flex;
            justify-content: center;
            align-items: center; }
            body main #content section.processing .container .content {
              padding: 140px 0 72px; }
              body main #content section.processing .container .content .title p[lang='ja'] {
                font-weight: bold;
                font-size: 20px;
                letter-spacing: 0.15em;
                line-height: 36px;
                text-align: center;
                color: #fff; }
              body main #content section.processing .container .content .title p[lang='en'] {
                font-family: "Inter", sans-serif;
                font-weight: 500;
                font-size: 14px;
                line-height: 24px;
                text-align: center;
                color: #fff;
                margin-top: 16px; }
@keyframes revealUp {
  0% {
    clip-path: inset(100% 0 0 0); }
  80% {
    clip-path: inset(0 0 0 0); }
  100% {
    clip-path: inset(0 0 0 0); } }
              body main #content section.processing .container .content figure {
                position: relative;
                width: 156px;
                margin: 0 auto;
                margin-top: 54px; }
                body main #content section.processing .container .content figure img:nth-child(2) {
                  position: absolute;
                  top: 0;
                  left: 0;
                  right: 0;
                  bottom: 0;
                  clip-path: inset(100% 0 0 0); }
          body main #content section.processing.active figure img:nth-child(2) {
            animation: revealUp 3s 1s 2 ease-out both; }
          body main #content section.processing.comp {
            left: 0;
            opacity: 0; }
        body main #content section.result {
          pointer-events: none;
          left: 0;
          opacity: 0;
          transition: all ease 0.5s 0.5s; }
          body main #content section.result .container {
            position: relative;
            width: calc(100% - 25px * 2);
            margin: 0 auto;
            min-height: 100%;
            display: flex;
            justify-content: center;
            align-items: center; }
            body main #content section.result .container .content {
              width: 100%;
              padding: 112px 0 32px; }
              body main #content section.result .container .content .title {
                margin-bottom: 24px; }
                body main #content section.result .container .content .title p[lang='ja'] {
                  font-weight: bold;
                  font-size: 24px;
                  letter-spacing: 0.2em;
                  line-height: 35px;
                  text-align: center;
                  color: #fff;
                  margin-bottom: 5px; }
                body main #content section.result .container .content .title p[lang='en'] {
                  font-family: "Inter", sans-serif;
                  font-weight: 500;
                  font-size: 14px;
                  line-height: 17px;
                  text-align: center;
                  color: #fff; }
              body main #content section.result .container .content .message p[lang='ja'] {
                font-weight: bold;
                font-size: 14px;
                letter-spacing: 0.1em;
                line-height: 28px;
                text-align: left;
                color: #fff;
                margin-bottom: 12px; }
              body main #content section.result .container .content .message p[lang='en'] {
                font-family: "Inter", sans-serif;
                font-weight: 500;
                font-size: 12px;
                line-height: 20px;
                text-align: left;
                color: #fff; }
              body main #content section.result .container .content table {
                margin-top: 30px;
                width: 100%; }
                body main #content section.result .container .content table tr th {
                  font-family: "Inter", sans-serif;
                  font-weight: 600;
                  font-size: 16px;
                  letter-spacing: 0.1em;
                  line-height: 48px;
                  text-align: center;
                  color: #039146;
                  background-color: #fff;
                  width: 49px;
                  border-bottom: 1px solid #00924D; }
                body main #content section.result .container .content table tr td {
                  display: flex;
                  align-items: baseline;
                  border-bottom: 1px solid #fff;
                  padding-left: 23px; }
                  body main #content section.result .container .content table tr td p[lang='ja'] {
                    font-weight: bold;
                    font-size: 16px;
                    letter-spacing: 0.05em;
                    line-height: 48px;
                    text-align: left;
                    color: #fff; }
                  body main #content section.result .container .content table tr td p[lang='en'] {
                    margin-left: 10px;
                    font-family: "Inter", sans-serif;
                    font-weight: 500;
                    font-size: 12px;
                    line-height: 20px;
                    text-align: left;
                    color: #fff; }
                body main #content section.result .container .content table tr:first-child th {
                  border-top: 1px solid #fff; }
                body main #content section.result .container .content table tr:first-child td {
                  border-top: 1px solid #fff; }
                body main #content section.result .container .content table tr:last-child th {
                  border-bottom: 1px solid #fff; }
        body main #content section.active {
          left: 0;
          opacity: 1;
          pointer-events: auto; }
        body main #content section.comp {
          left: -100%; }