@font-face {
  font-family: "Lexend Deca Regular";
  src: url("../fonts/LexendDeca-Regular.eot");
  src: url("../fonts/LexendDeca-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/LexendDeca-Regular.woff2") format("woff2"), url("../fonts/LexendDeca-Regular.woff") format("woff"), url("../fonts/LexendDeca-Regular.ttf") format("truetype"), url("../fonts/LexendDeca-Regular.svg#LexendDeca-Regular") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Lexend Deca SemiBold";
  src: url("../fonts/LexendDeca-SemiBold.eot");
  src: url("../fonts/LexendDeca-SemiBold.eot?#iefix") format("embedded-opentype"), url("../fonts/LexendDeca-SemiBold.woff2") format("woff2"), url("../fonts/LexendDeca-SemiBold.woff") format("woff"), url("../fonts/LexendDeca-SemiBold.ttf") format("truetype"), url("../fonts/LexendDeca-SemiBold.svg#LexendDeca-SemiBold") format("svg");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Lexend Deca Medium";
  src: url("../fonts/LexendDeca-Medium.eot");
  src: url("../fonts/LexendDeca-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/LexendDeca-Medium.woff2") format("woff2"), url("../fonts/LexendDeca-Medium.woff") format("woff"), url("../fonts/LexendDeca-Medium.ttf") format("truetype"), url("../fonts/LexendDeca-Medium.svg#LexendDeca-Medium") format("svg");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Lexend Deca Bold";
  src: url("../fonts/LexendDeca-Bold.eot");
  src: url("../fonts/LexendDeca-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/LexendDeca-Bold.woff2") format("woff2"), url("../fonts/LexendDeca-Bold.woff") format("woff"), url("../fonts/LexendDeca-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
.pageFirst {
  background-color: #DDE5E6;
  height: 32.5520833333vw;
  position: relative;
  overflow: hidden;
}
@media only screen and (max-width: 480px) {
  .pageFirst {
    height: 61vw;
  }
}
.pageFirst:after {
  content: "";
  background: url("../img/mask.png") no-repeat 0 0;
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 56%;
  background-size: contain;
}
.pageFirst:before {
  content: "";
  background-color: #31BEC3;
  height: 100%;
  width: 0.78125vw;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.pageFirst.about-img picture {
  width: 29vw;
  height: auto;
  bottom: 0;
  top: inherit;
  right: 8vw;
}
.pageFirst .caption {
  width: 50vw;
  padding-left: 5vw;
  flex-direction: column;
  height: 100%;
  z-index: 1;
}
@media only screen and (max-width: 767px) {
  .pageFirst .caption {
    width: 100%;
    padding: 0 25px;
  }
}
.pageFirst .name1 {
  font: 2.9166666667vw/3vw "Lexend Deca SemiBold";
}
@media only screen and (max-width: 767px) {
  .pageFirst .name1 {
    font-size: 25px;
    line-height: 30px;
  }
}
.pageFirst .name2 {
  font-size: 0.9375vw;
  width: 25vw;
  margin: 1vw 0 1.5vw;
}
@media only screen and (max-width: 1200px) {
  .pageFirst .name2 {
    font-size: 1.4vw;
    width: 30vw;
  }
}
@media only screen and (max-width: 767px) {
  .pageFirst .name2 {
    font-size: 14px;
    width: 100%;
    margin: 15px 0 0;
  }
}
.pageFirst picture {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  overflow: hidden;
  width: 56%;
  z-index: 1;
}
@media only screen and (max-width: 767px) {
  .pageFirst picture {
    display: none;
  }
}
.pageFirst picture img {
  margin: 0 0 0 auto;
  object-fit: cover;
  height: 100%;
}

.content {
  padding-top: 5.2vw;
}
@media only screen and (max-width: 1200px) {
  .content {
    padding-top: 80px;
  }
}

p {
  margin: 0 0 1.5vw;
}

h1 {
  font: 2.1966527197vw "Lexend Deca SemiBold";
  margin-bottom: 0.7vw;
}
@media only screen and (max-width: 767px) {
  h1 {
    font-size: 25px;
  }
}

@keyframes draw-circle {
  to {
    stroke-dashoffset: 0;
  }
}
@keyframes draw-check {
  to {
    stroke-dashoffset: 0;
  }
}
@keyframes draw-line {
  to {
    stroke-dashoffset: 0;
  }
}
.line1, .line2 {
  fill: none;
  stroke: #111;
  stroke-width: 6;
  stroke-linecap: round;
  stroke-dasharray: 40;
  stroke-dashoffset: 40;
  animation: draw-line 0.25s ease-out forwards;
}

.line1 {
  animation-delay: 0.55s;
}

.line2 {
  animation-delay: 0.75s;
}

.thank-you {
  margin: 5vw 0 10vw;
}
.thank-you svg {
  width: 4.1841004184vw;
  height: 4.1841004184vw;
  margin: 0 auto 1.5vw;
}
@media only screen and (max-width: 1023px) {
  .thank-you svg {
    width: 80px;
    height: 80px;
    margin-bottom: 25px;
  }
}
.thank-you .circle {
  fill: none;
  stroke: #111;
  stroke-width: 6;
  stroke-linecap: round;
  stroke-dasharray: 264;
  stroke-dashoffset: 264;
  animation: draw-circle 0.6s ease-out forwards;
}
.thank-you .check {
  fill: none;
  stroke: #111;
  stroke-width: 6;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 60;
  stroke-dashoffset: 60;
  animation: draw-check 0.35s ease-out 0.55s forwards;
}

.request {
  padding: 4vw;
}
.request .text strong {
  font: 2.9166666667vw/3.2vw "Lexend Deca SemiBold";
  display: block;
  margin-bottom: 1vw;
}
@media only screen and (max-width: 767px) {
  .request .text strong {
    font-size: 25px;
    line-height: 30px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .request .navs {
    display: flex;
    align-items: center;
    margin-top: 20px;
  }
}
.request .navs a {
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  height: 3.3854166667vw;
  margin: 0 auto;
}
.request .navs a:first-child {
  background: #ffffff;
  color: #000000;
}
.request .navs a:first-child:after {
  content: "";
  background: url("../img/arrow-right.svg") no-repeat 0 0;
  margin-left: 10px;
  display: block;
  width: 1.4644351464vw;
  height: 1.0460251046vw;
  background-size: cover;
}
@media only screen and (max-width: 1023px) {
  .request .navs a:first-child:after {
    width: 14px;
    height: 10px;
  }
}

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