@charset "UTF-8";
/* ---------- reset --------- */
html, body {
  margin: 0;
  padding: 0;
  border: 0;
  font-style: normal;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

div, p, table, tbody, thead, th, tr, td, form, fieldset, input, textarea, blockquote, header, footer, nav, article, section, dl, dt, dd, ul, ol, li {
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4, h5 {
  margin: 0;
  padding: 0;
  line-height: 1.0;
  font-style: normal;
}

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal;
}

body {
  line-height: 1;
}

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

caption, th {
  text-align: left;
}

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

audio, canvas, iframe, img, svg, video {
  vertical-align: middle;
}

fieldset, img {
  border: 0;
  margin: 0;
  padding: 0;
}

textarea {
  resize: vertical;
}

button, textarea, select, input {
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-radius: 0px;
  border: none;
}

header, footer, section, main, p, div, ul, li, span, a {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

strong {
  font-weight: 700;
}

/* ----------- flex-box setting ----------- */
.row {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
}

.row-wrap {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}

.row-space {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

.row-space-wrap {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

.reverse {
  -webkit-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

.column {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
}

.column-space {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

.row-space-wrap {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

/* ---------- Base --------- */
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/* ---------- font --------- */
html {
  font-size: 62.5%;
}

body {
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-style: normal;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: 0.03em;
  line-height: 1.8;
  color: #FFF;
  -webkit-font-feature-settings: 'palt', auto;
  font-feature-settings: 'palt', auto;
  -webkit-font-kerning: auto;
  font-kerning: auto;
  font-display: swap;
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: 100%;
  color: #000;
  overflow-x: hidden;
}

.sp {
  display: none !important;
}

.inner_wrapper {
  display: block;
  position: relative;
}

a {
  color: #000;
  text-decoration: none;
}
a:hover {
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
a:focus {
  outline: none;
}
a.nolink {
  pointer-events: none;
}

a, input[type=radio], input[type=checkbox], input[type=submit], button, select {
  cursor: pointer;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

@media screen and (max-width: 767px), print {
  body {
    min-width: 100%;
    font-size: 3.2vw;
  }

  .sp {
    display: block !important;
  }

  .pc {
    display: none !important;
  }

  img {
    width: 100%;
    height: auto;
  }
}
/* =============================================================

Pace

* ============================================================= */
/* =============================================================

Wrapper

* ============================================================= */
.l-wrapper {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-width: 1200px;
  margin: 0;
  padding: 0;
}

.l-wrapper.is-resizing * {
  -moz-transition: none !important;
  -o-transition: none !important;
  -webkit-transition: none !important;
  transition: none !important;
}

@media screen and (max-width: 767px), print {
  .l-wrapper {
    min-width: 100%;
  }

  .l-wrapper__inner {
    display: block;
  }
}
/* =============================================================

Animation

* ============================================================= */
@-moz-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-moz-keyframes cover-bottom-to-top {
  100% {
    transform: translateY(-100%);
  }
}
@-webkit-keyframes cover-bottom-to-top {
  100% {
    transform: translateY(-100%);
  }
}
@keyframes cover-bottom-to-top {
  100% {
    transform: translateY(-100%);
  }
}
@-moz-keyframes from-top-in {
  100% {
    transform: translateY(0);
  }
}
@-webkit-keyframes from-top-in {
  100% {
    transform: translateY(0);
  }
}
@keyframes from-top-in {
  100% {
    transform: translateY(0);
  }
}
@-moz-keyframes from-side-in {
  100% {
    transform: translateX(0);
  }
}
@-webkit-keyframes from-side-in {
  100% {
    transform: translateX(0);
  }
}
@keyframes from-side-in {
  100% {
    transform: translateX(0);
  }
}
@-moz-keyframes img-mask-to-right {
  100% {
    transform: translateX(100%);
  }
}
@-webkit-keyframes img-mask-to-right {
  100% {
    transform: translateX(100%);
  }
}
@keyframes img-mask-to-right {
  100% {
    transform: translateX(100%);
  }
}
@-moz-keyframes img-mask-to-right2 {
  100% {
    width: 100%;
  }
}
@-webkit-keyframes img-mask-to-right2 {
  100% {
    width: 100%;
  }
}
@keyframes img-mask-to-right2 {
  100% {
    width: 100%;
  }
}
@-moz-keyframes scale-to-big {
  100% {
    -moz-transform: scale(1, 1);
    transform: scale(1, 1);
  }
}
@-webkit-keyframes scale-to-big {
  100% {
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
}
@keyframes scale-to-big {
  100% {
    -moz-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
}
@-moz-keyframes scale-to-small {
  100% {
    -moz-transform: scale(0, 0);
    transform: scale(0, 0);
  }
}
@-webkit-keyframes scale-to-small {
  100% {
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0);
  }
}
@keyframes scale-to-small {
  100% {
    -moz-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0);
  }
}
@-moz-keyframes dash {
  100% {
    stroke-dashoffset: 0;
  }
}
@-webkit-keyframes dash {
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes dash {
  100% {
    stroke-dashoffset: 0;
  }
}
@-moz-keyframes moveLogo {
  100% {
    transform: translateY(-10vh);
  }
}
@-webkit-keyframes moveLogo {
  100% {
    transform: translateY(-10vh);
  }
}
@keyframes moveLogo {
  100% {
    transform: translateY(-10vh);
  }
}
@-moz-keyframes main-bounce {
  0% {
    transform: translateY(100%);
  }
  16%, 100%, 28%, 58%, 85% {
    transform: translateY(0px);
    opacity: 1;
  }
  49% {
    transform: translateY(10px);
    opacity: 1;
  }
  67% {
    transform: translateY(5px);
    opacity: 1;
  }
}
@-webkit-keyframes main-bounce {
  0% {
    transform: translateY(100%);
  }
  16%, 100%, 28%, 58%, 85% {
    transform: translateY(0px);
    opacity: 1;
  }
  49% {
    transform: translateY(10px);
    opacity: 1;
  }
  67% {
    transform: translateY(5px);
    opacity: 1;
  }
}
@keyframes main-bounce {
  0% {
    transform: translateY(100%);
  }
  16%, 100%, 28%, 58%, 85% {
    transform: translateY(0px);
    opacity: 1;
  }
  49% {
    transform: translateY(10px);
    opacity: 1;
  }
  67% {
    transform: translateY(5px);
    opacity: 1;
  }
}
@-moz-keyframes bounce {
  0%, 100%, 20%, 50%, 80% {
    transform: translateY(0px);
  }
  100%, 20%, 50%, 80% {
    opacity: 1;
  }
  40% {
    transform: translateY(-30px);
    opacity: 1;
  }
  60% {
    transform: translateY(-15px);
    opacity: 1;
  }
}
@-webkit-keyframes bounce {
  0%, 100%, 20%, 50%, 80% {
    transform: translateY(0px);
  }
  100%, 20%, 50%, 80% {
    opacity: 1;
  }
  40% {
    transform: translateY(-30px);
    opacity: 1;
  }
  60% {
    transform: translateY(-15px);
    opacity: 1;
  }
}
@keyframes bounce {
  0%, 100%, 20%, 50%, 80% {
    transform: translateY(0px);
  }
  100%, 20%, 50%, 80% {
    opacity: 1;
  }
  40% {
    transform: translateY(-30px);
    opacity: 1;
  }
  60% {
    transform: translateY(-15px);
    opacity: 1;
  }
}
@-moz-keyframes main-comment {
  100% {
    -moz-transform: scale(1, 1);
    transform: scale(1, 1);
    opacity: 1;
  }
}
@-webkit-keyframes main-comment {
  100% {
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    opacity: 1;
  }
}
@keyframes main-comment {
  100% {
    -moz-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    opacity: 1;
  }
}
/* =============================================================

cover

* ============================================================= */
.l-cover {
  position: relative;
  width: 100%;
  height: 100vh;
  min-width: 1200px;
}

#a-logo {
  z-index: 2;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  bottom: 0;
  margin: -160px auto auto;
  width: 50%;
  max-width: 740px;
  min-width: 630px;
  height: auto;
}

#logo-bk {
  z-index: 1;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  bottom: 0;
  margin: -160px auto auto;
  width: 50%;
  max-width: 740px;
  min-width: 630px;
  height: auto;
}

path {
  fill-opacity: 0;
  transition: fill .4s ease;
}

.st {
  fill: #FFF;
  stroke: #000;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
}

.done .st {
  fill: #000;
  fill-opacity: 1;
}

.done path {
  stroke: none;
}

.cls-1 {
  fill: #FFF !important;
}

.parts {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}

.bk {
  width: 100%;
  height: 100%;
  background: url(../img/bk.jpg) no-repeat top center;
  background-size: cover;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  display: block;
  position: fixed;
  top: 0;
  z-index: 0;
}

.bk2 {
  width: 100%;
  height: 100%;
  background: url(../img/bk2.svg) no-repeat center;
  background-size: 82.14%;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  display: block;
  position: absolute;
  top: 0;
  z-index: 1;
}

.pace-done .l-cover .bk {
  -moz-animation: fadeIn 0.1s linear 3s forwards;
  -webkit-animation: fadeIn 0.1s linear 3s forwards;
  animation: fadeIn 0.1s linear 3s forwards;
}
.pace-done .l-cover .bk2 {
  -moz-animation: fadeIn 0.3s linear 4.6s forwards;
  -webkit-animation: fadeIn 0.3s linear 4.6s forwards;
  animation: fadeIn 0.3s linear 4.6s forwards;
}
.pace-done .l-cover .parts {
  -moz-animation: fadeIn 0.1s linear 3s forwards;
  -webkit-animation: fadeIn 0.1s linear 3s forwards;
  animation: fadeIn 0.1s linear 3s forwards;
}
.pace-done .l-cover .parts .t1 .mask {
  -moz-animation: img-mask-to-right 0.3s ease-in-out 3.6s forwards;
  -webkit-animation: img-mask-to-right 0.3s ease-in-out 3.6s forwards;
  animation: img-mask-to-right 0.3s ease-in-out 3.6s forwards;
}
.pace-done .l-cover .parts .t2 .mask {
  -moz-animation: cover-bottom-to-top 0.3s ease-in-out 4.6s forwards;
  -webkit-animation: cover-bottom-to-top 0.3s ease-in-out 4.6s forwards;
  animation: cover-bottom-to-top 0.3s ease-in-out 4.6s forwards;
}
.pace-done .l-cover .parts .c1 {
  -moz-animation: scale-to-big 0.3s ease-in-out 3.6s forwards;
  -webkit-animation: scale-to-big 0.3s ease-in-out 3.6s forwards;
  animation: scale-to-big 0.3s ease-in-out 3.6s forwards;
}
.pace-done .l-cover .parts .c1 .mask {
  -moz-animation: scale-to-small 0.3s ease-in-out 4.6s forwards;
  -webkit-animation: scale-to-small 0.3s ease-in-out 4.6s forwards;
  animation: scale-to-small 0.3s ease-in-out 4.6s forwards;
}
.pace-done .l-cover .parts .c2 {
  -moz-animation: scale-to-big 0.3s ease-in-out 3.6s forwards;
  -webkit-animation: scale-to-big 0.3s ease-in-out 3.6s forwards;
  animation: scale-to-big 0.3s ease-in-out 3.6s forwards;
}
.pace-done .l-cover .parts .c2 a {
  -moz-animation: scale-to-big 0.3s ease-in-out 4.6s forwards;
  -webkit-animation: scale-to-big 0.3s ease-in-out 4.6s forwards;
  animation: scale-to-big 0.3s ease-in-out 4.6s forwards;
}
.pace-done .l-cover .parts .tr1 a {
  -moz-animation: from-side-in 0.3s ease-in-out 3.6s forwards;
  -webkit-animation: from-side-in 0.3s ease-in-out 3.6s forwards;
  animation: from-side-in 0.3s ease-in-out 3.6s forwards;
}
.pace-done .l-cover .parts .tr1 .mask {
  -moz-animation: from-side-in 0.3s ease-in-out 4.6s forwards;
  -webkit-animation: from-side-in 0.3s ease-in-out 4.6s forwards;
  animation: from-side-in 0.3s ease-in-out 4.6s forwards;
}

.parts {
  position: absolute;
  top: 0;
  z-index: 100;
  width: 100%;
  height: 100vh;
}
.parts .__inner {
  width: 100%;
  height: 100%;
  position: relative;
}
.parts .t1 {
  position: absolute;
  right: 8.564%;
  bottom: 18.103%;
  width: 46.66%;
  min-width: 560px;
}
.parts .t1 h2 {
  display: block;
  width: 100%;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.parts .t1 h2 .mask {
  position: absolute;
  top: 0;
  z-index: 10;
  background: #FFF;
  display: block;
  width: 100%;
}
.parts .t1 h2 .tt {
  position: absolute;
  top: 0;
  z-index: 9;
  display: block;
  width: 100%;
}
.parts .t1 h2 img {
  width: 100%;
  height: auto;
}
.parts .c1 {
  position: absolute;
  left: 21.42%;
  bottom: 23.4%;
  width: 15%;
  min-width: 180px;
  -moz-transform: scale(0, 0);
  -ms-transform: scale(0, 0);
  -webkit-transform: scale(0, 0);
  transform: scale(0, 0);
}
.parts .c1 h3 {
  width: 100%;
  background: #00ff00;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  display: block;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.parts .c1 h3 .mask {
  position: absolute;
  top: 0;
  z-index: 10;
  background: #00ff00;
  display: block;
  width: 100%;
}
.parts .c1 h3 .tt {
  position: absolute;
  top: 0;
  z-index: 9;
  display: block;
  width: 100%;
}
.parts .c1 h3 img {
  width: 100%;
  height: auto;
}
.parts .t2 {
  position: absolute;
  top: 0;
  right: 29.28%;
  width: 29.14%;
  min-width: 348px;
}
.parts .t2 .l-link-to-o-hp {
  display: block;
  width: 100%;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.parts .t2 .l-link-to-o-hp .mask {
  position: absolute;
  top: 0;
  z-index: 10;
  background: #FFF;
  display: block;
  width: 100%;
}
.parts .t2 .l-link-to-o-hp a {
  position: absolute;
  top: 0;
  z-index: 9;
  display: block;
  width: 100%;
}
.parts .t2 .l-link-to-o-hp img {
  width: 100%;
  height: auto;
}
.parts .tr1 {
  position: absolute;
  top: 50px;
  left: 0;
  width: 14.28%;
  min-width: 170px;
}
.parts .tr1 .l-link-to-blog {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
}
.parts .tr1 .l-link-to-blog .mask {
  position: absolute;
  left: 0;
  bottom: -20px;
  z-index: 9;
  display: block;
  width: 100%;
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}
.parts .tr1 .l-link-to-blog a {
  position: absolute;
  top: 0;
  z-index: 10;
  display: block;
  width: 100%;
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}
.parts .tr1 .l-link-to-blog img {
  width: 100%;
  height: auto;
}
.parts .c2 {
  position: absolute;
  top: 30px;
  right: 30px;
  width: 13.07%;
  min-width: 154px;
  display: block;
  -moz-transform: scale(0, 0);
  -ms-transform: scale(0, 0);
  -webkit-transform: scale(0, 0);
  transform: scale(0, 0);
}
.parts .c2 .l-apply-btn {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
}
.parts .c2 .l-apply-btn .mask {
  position: absolute;
  bottom: -10px;
  right: -10px;
  z-index: 9;
  display: block;
  width: 100%;
  background: #000;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}
.parts .c2 .l-apply-btn a {
  position: absolute;
  top: 0;
  z-index: 10;
  display: block;
  width: 100%;
  text-align: center;
  background: #00ff00;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  -moz-transform: scale(0, 0);
  -ms-transform: scale(0, 0);
  -webkit-transform: scale(0, 0);
  transform: scale(0, 0);
}
.parts .c2 .l-apply-btn img {
  width: 100%;
  height: auto;
}

@media screen and (max-width: 767px), print {
  .l-cover {
    width: 100%;
    height: 100vh;
    min-width: 100%;
  }

  #a-logo {
    z-index: 2;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    bottom: 0;
    margin: -10vh auto auto auto;
    width: 83.3%;
    max-width: 83.3%;
    min-width: 83.3%;
  }

  #logo-bk {
    z-index: 1;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    bottom: 0;
    margin: -10vh auto auto auto;
    width: 83.3%;
    max-width: 83.3%;
    min-width: 83.3%;
  }

  .bk-sp {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
    position: fixed;
  }
  .bk-sp img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    font-family: "object-fit: cover;";
  }

  .bk2 {
    background: url(../img/bk2-sp.svg) no-repeat center;
    background-size: contain;
  }

  .pace-done .l-cover #a-logo, .pace-done .l-cover #logo-bk {
    -moz-animation: moveLogo 0.6s ease 2.2s forwards;
    -webkit-animation: moveLogo 0.6s ease 2.2s forwards;
    animation: moveLogo 0.6s ease 2.2s forwards;
  }
  .pace-done .l-cover .bk-sp {
    -moz-animation: fadeIn 0.4s linear 3s forwards;
    -webkit-animation: fadeIn 0.4s linear 3s forwards;
    animation: fadeIn 0.4s linear 3s forwards;
  }
  .pace-done .l-cover .bk2 {
    -moz-animation: fadeIn 0.4s linear 3s forwards;
    -webkit-animation: fadeIn 0.4s linear 3s forwards;
    animation: fadeIn 0.4s linear 3s forwards;
  }
  .pace-done .l-cover .parts {
    -moz-animation: fadeIn 0.4s linear 3s forwards;
    -webkit-animation: fadeIn 0.4s linear 3s forwards;
    animation: fadeIn 0.4s linear 3s forwards;
  }

  .parts {
    z-index: 9998;
  }
  .parts .__inner {
    -js-display: flex;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    height: 100vh;
  }
  .parts .l-link-to-o-hp {
    width: 44.27%;
    margin: 0 auto auto;
  }
  .parts h2 {
    width: 78.12%;
    margin: 0 auto;
  }
  .parts h3 {
    width: 39.84%;
    background: #00ff00;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    display: block;
    margin: 0 auto 3vh;
  }
  .parts .l-apply-btn {
    width: 100%;
  }
}
/* =============================================================

Header

* ============================================================= */
.l-header {
  -moz-transform: translateY(100%);
  -ms-transform: translateY(100%);
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
  position: fixed;
  bottom: 0;
  width: 100%;
  min-width: 1250px;
  z-index: 999;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.l-header.__show {
  -moz-box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);
}
.l-header .l-header__inner {
  position: relative;
  width: 100%;
  height: 50px;
  background: #FFF;
  display: block;
}
.l-header .l-header__nav {
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  z-index: 10;
}
.l-header .pagetop {
  position: absolute;
  right: 20px;
  line-height: 50px;
  z-index: 10;
  font-size: 1.5rem;
  font-weight: 600;
}
.l-header .pagetop::after {
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  content: "";
  display: block;
  height: 30px;
  width: 30px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  border-radius: 15px;
  background: #00ff00;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: -1;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -moz-transform: scale(0, 0);
  -ms-transform: scale(0, 0);
  -webkit-transform: scale(0, 0);
  transform: scale(0, 0);
}
.l-header .pagetop:hover::after {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  -moz-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

.l-header__sp-nav {
  display: none;
}

.pace-done .l-header {
  -moz-animation: from-top-in 0.2s ease 6s forwards;
  -webkit-animation: from-top-in 0.2s ease 6s forwards;
  animation: from-top-in 0.2s ease 6s forwards;
}

.l-global-nav .l-global-nav__list {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-justify-content: center;
  justify-content: center;
}
.l-global-nav .l-global-nav__item a {
  display: block;
  line-height: 50px;
  font-size: 1.5rem;
  font-weight: 600;
  padding: 0 4.257vw;
  font-family: heisei-mincho-std,serif;
  position: relative;
}
.l-global-nav .l-global-nav__item a::after {
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  content: "";
  display: block;
  height: 30px;
  width: 30px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  border-radius: 15px;
  background: #00ff00;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: -1;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -moz-transform: scale(0, 0);
  -ms-transform: scale(0, 0);
  -webkit-transform: scale(0, 0);
  transform: scale(0, 0);
}
.l-global-nav .l-global-nav__item a:hover::after {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  -moz-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

@media screen and (max-width: 767px), print {
  .l-header {
    display: none;
  }
  .l-header .l-header__inner {
    background: transparent;
  }
  .l-header .is-drawer-open .l-header__sp-nav {
    background: white;
  }
  .l-header .l-header__nav {
    display: none;
  }
  .l-header .pagetop {
    position: fixed;
    right: 0;
    bottom: 0;
    width: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 3vw;
    display: block;
    background: #00ff00;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
    visibility: hidden;
  }
  .l-header .pagetop.__show {
    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1;
    visibility: visible;
  }

  .pace-done .l-header {
    -moz-animation: from-top-in 0.2s ease 6s forwards;
    -webkit-animation: from-top-in 0.2s ease 6s forwards;
    animation: from-top-in 0.2s ease 6s forwards;
  }

  .l-global-nav .l-global-nav__list {
    -js-display: flex;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: center;
    justify-content: center;
  }
  .l-global-nav .l-global-nav__item a {
    display: block;
    line-height: 50px;
    font-size: 1.5rem;
    font-weight: 600;
    padding: 0 4.257vw;
    font-family: heisei-mincho-std,serif;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }
  .l-global-nav .l-global-nav__item a:hover {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
    opacity: 0.5;
  }

  .l-header__sp-nav {
    display: block;
    width: 50px;
    height: 50px;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 10000;
    -moz-transition: opacity 0.4s linear 1s;
    -o-transition: opacity 0.4s linear 1s;
    -webkit-transition: opacity 0.4s linear;
    -webkit-transition-delay: 1s;
    transition: opacity 0.4s linear 1s;
    width: 100%;
  }
  .l-header__sp-nav .sp-nav-btn {
    width: 50px;
    height: 50px;
    padding: 16px 14px;
    display: block;
    margin-left: auto;
  }
}
/*
  hamburger
=============================== */
.l-header-hamburger {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1000;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -moz-transition: opacity 0.25s linear 0.75s;
  -o-transition: opacity 0.25s linear 0.75s;
  -webkit-transition: opacity 0.25s linear;
  -webkit-transition-delay: 0.75s;
  transition: opacity 0.25s linear 0.75s;
}

.pace-done .l-header-hamburger {
  -moz-animation: fadeIn 0.4s linear 3s forwards;
  -webkit-animation: fadeIn 0.4s linear 3s forwards;
  animation: fadeIn 0.4s linear 3s forwards;
}

.l-header-hamburger > p {
  overflow: hidden;
  position: absolute;
  text-indent: -9999px;
}

.l-header-hamburger > span {
  display: inline-block;
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background-color: #00ff00;
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

.is-drawer-open .l-header-hamburger > span {
  background: #00ff00;
}

.l-header-hamburger > span._top {
  top: 0;
  -moz-animation: hamburger-top 0.75s forwards;
  -webkit-animation: hamburger-top 0.75s forwards;
  animation: hamburger-top 0.75s forwards;
}

.is-drawer-open .l-header-hamburger > span._top {
  -moz-animation: active-hamburger-top 0.75s forwards;
  -webkit-animation: active-hamburger-top 0.75s forwards;
  animation: active-hamburger-top 0.75s forwards;
}

.l-header-hamburger > span._middle {
  top: 50%;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  -moz-transition: opacity 0.375s, background 0.375s 0.375s;
  -o-transition: opacity 0.375s, background 0.375s 0.375s;
  -webkit-transition: opacity 0.375s, background 0.375s;
  -webkit-transition-delay: 0s, 0.375s;
  transition: opacity 0.375s, background 0.375s 0.375s;
}

.is-drawer-open .l-header-hamburger > span._middle {
  -moz-transition: opacity 0.375s 0.375s, background 0.375s;
  -o-transition: opacity 0.375s 0.375s, background 0.375s;
  -webkit-transition: opacity 0.375s, background 0.375s;
  -webkit-transition-delay: 0.375s, 0s;
  transition: opacity 0.375s 0.375s, background 0.375s;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}

.l-header-hamburger > span._bottom {
  bottom: 0;
  -moz-animation: hamburger-bottom 0.75s forwards;
  -webkit-animation: hamburger-bottom 0.75s forwards;
  animation: hamburger-bottom 0.75s forwards;
}

.is-drawer-open .l-header-hamburger > span._bottom {
  -moz-animation: active-hamburger-bottom 0.75s forwards;
  -webkit-animation: active-hamburger-bottom 0.75s forwards;
  animation: active-hamburger-bottom 0.75s forwards;
}

@-moz-keyframes hamburger-top {
  0% {
    top: -1px;
    -webkit-transform: translateY(11px) rotate(45deg);
    transform: translateY(11px) rotate(45deg);
  }
  50% {
    top: -1px;
    -webkit-transform: translateY(11px) rotate(0);
    transform: translateY(11px) rotate(0);
  }
  100% {
    top: 0;
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
  }
}
@-webkit-keyframes hamburger-top {
  0% {
    top: -1px;
    -webkit-transform: translateY(11px) rotate(45deg);
    transform: translateY(11px) rotate(45deg);
  }
  50% {
    top: -1px;
    -webkit-transform: translateY(11px) rotate(0);
    transform: translateY(11px) rotate(0);
  }
  100% {
    top: 0;
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
  }
}
@keyframes hamburger-top {
  0% {
    top: -1px;
    -webkit-transform: translateY(11px) rotate(45deg);
    transform: translateY(11px) rotate(45deg);
  }
  50% {
    top: -1px;
    -webkit-transform: translateY(11px) rotate(0);
    transform: translateY(11px) rotate(0);
  }
  100% {
    top: 0;
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
  }
}
@-moz-keyframes hamburger-bottom {
  0% {
    bottom: -1px;
    -webkit-transform: translateY(-7px) rotate(-45deg);
    transform: translateY(-7px) rotate(-45deg);
  }
  50% {
    bottom: -1px;
    -webkit-transform: translateY(-7px) rotate(0);
    transform: translateY(-7px) rotate(0);
  }
  100% {
    bottom: 0;
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
  }
}
@-webkit-keyframes hamburger-bottom {
  0% {
    bottom: -1px;
    -webkit-transform: translateY(-7px) rotate(-45deg);
    transform: translateY(-7px) rotate(-45deg);
  }
  50% {
    bottom: -1px;
    -webkit-transform: translateY(-7px) rotate(0);
    transform: translateY(-7px) rotate(0);
  }
  100% {
    bottom: 0;
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
  }
}
@keyframes hamburger-bottom {
  0% {
    bottom: -1px;
    -webkit-transform: translateY(-7px) rotate(-45deg);
    transform: translateY(-7px) rotate(-45deg);
  }
  50% {
    bottom: -1px;
    -webkit-transform: translateY(-7px) rotate(0);
    transform: translateY(-7px) rotate(0);
  }
  100% {
    bottom: 0;
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
  }
}
@-moz-keyframes active-hamburger-top {
  0% {
    top: 0;
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
  }
  50% {
    top: -1px;
    -webkit-transform: translateY(11px) rotate(0);
    transform: translateY(11px) rotate(0);
  }
  100% {
    top: -1px;
    -webkit-transform: translateY(11px) rotate(45deg);
    transform: translateY(11px) rotate(45deg);
  }
}
@-webkit-keyframes active-hamburger-top {
  0% {
    top: 0;
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
  }
  50% {
    top: -1px;
    -webkit-transform: translateY(11px) rotate(0);
    transform: translateY(11px) rotate(0);
  }
  100% {
    top: -1px;
    -webkit-transform: translateY(11px) rotate(45deg);
    transform: translateY(11px) rotate(45deg);
  }
}
@keyframes active-hamburger-top {
  0% {
    top: 0;
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
  }
  50% {
    top: -1px;
    -webkit-transform: translateY(11px) rotate(0);
    transform: translateY(11px) rotate(0);
  }
  100% {
    top: -1px;
    -webkit-transform: translateY(11px) rotate(45deg);
    transform: translateY(11px) rotate(45deg);
  }
}
@-moz-keyframes active-hamburger-bottom {
  0% {
    bottom: 0;
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
  }
  50% {
    bottom: -1px;
    -webkit-transform: translateY(-7px) rotate(0);
    transform: translateY(-7px) rotate(0);
  }
  100% {
    bottom: -1px;
    -webkit-transform: translateY(-7px) rotate(-45deg);
    transform: translateY(-7px) rotate(-45deg);
  }
}
@-webkit-keyframes active-hamburger-bottom {
  0% {
    bottom: 0;
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
  }
  50% {
    bottom: -1px;
    -webkit-transform: translateY(-7px) rotate(0);
    transform: translateY(-7px) rotate(0);
  }
  100% {
    bottom: -1px;
    -webkit-transform: translateY(-7px) rotate(-45deg);
    transform: translateY(-7px) rotate(-45deg);
  }
}
@keyframes active-hamburger-bottom {
  0% {
    bottom: 0;
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
  }
  50% {
    bottom: -1px;
    -webkit-transform: translateY(-7px) rotate(0);
    transform: translateY(-7px) rotate(0);
  }
  100% {
    bottom: -1px;
    -webkit-transform: translateY(-7px) rotate(-45deg);
    transform: translateY(-7px) rotate(-45deg);
  }
}
/* =============================================================

Drawer

* ============================================================= */
.l-drawer {
  display: block;
  width: 100%;
  height: 0;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9999;
  background: white;
  color: #FFF;
  overflow: hidden;
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

.is-drawer-open .l-drawer {
  height: 100vh;
  overflow-y: auto;
}

.l-drawer__inner {
  padding: 50px 0 100px;
}

.l-drawer .l-global-nav .l-global-nav__list {
  display: block;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  -moz-border-radius-bottomleft: none;
  -webkit-border-bottom-left-radius: none;
  border-bottom-left-radius: none;
  -moz-border-radius-bottomright: none;
  -webkit-border-bottom-right-radius: none;
  border-bottom-right-radius: none;
}
.l-drawer .l-global-nav .l-global-nav__item {
  background: transparent;
  padding: 14px 0;
}
.l-drawer .l-global-nav .l-global-nav__item a {
  border-right: none;
  font-size: 4vw;
  padding: 0;
  text-align: center;
  line-height: 1.0;
  color: #000 !important;
}

/* =============================================================

footer

* ============================================================= */
.l-footer {
  padding-top: 40px;
  margin-bottom: -30px;
}
.l-footer .l-footer-copyright {
  font-size: 1.2rem;
  text-align: center;
  width: 100%;
  display: block;
  line-height: 40px;
}

@media screen and (max-width: 767px), print {
  .l-footer .l-footer-copyright {
    font-size: 2.0vw;
  }
}
/* =============================================================

 contents

* ============================================================= */
.l-main {
  min-height: 0;
  height: 100%;
}

.js-inview {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -moz-transform: translateY(10px);
  -ms-transform: translateY(10px);
  -webkit-transform: translateY(10px);
  transform: translateY(10px);
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  -webkit-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
  -moz-transition: -moz-transform 0.4s ease-in-out, opacity 0.4s ease-in-out;
  -o-transition: -o-transform 0.4s ease-in-out, opacity 0.4s ease-in-out;
  -webkit-transition: -webkit-transform 0.4s ease-in-out, opacity 0.4s ease-in-out;
  transition: transform 0.4s ease-in-out, opacity 0.4s ease-in-out;
}

.js-inview.inview-border-in-once {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -webkit-transform: translateY(0);
  transform: translateY(0);
  -moz-transition-delay: 0.1s;
  -o-transition-delay: 0.1s;
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}

.l-page-content {
  text-align: center;
  padding: 0 0 80px;
}
.l-page-content .inner_wrapper {
  width: 90%;
  max-width: 1100px;
  margin: 0 auto;
}
.l-page-content h2 {
  font-size: 3.4rem;
  display: inline-block;
  margin: 0 0 40px;
  font-family: heisei-mincho-std,serif;
}
.l-page-content h3 {
  font-size: 2.6rem;
  display: inline-block;
  margin: 0 0 20px;
  text-align: left;
  font-family: heisei-mincho-std,serif;
}
.l-page-content h3.l-row-ttl {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  align-items: center;
}
.l-page-content h3 .num {
  width: 30px;
  height: 100%;
  display: inline-block;
  margin-right: 15px;
  background: #000;
  color: #FFF;
  text-align: center;
  font-size: 2.4rem;
}
.l-page-content h3 .t {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  align-items: center;
}
.l-page-content h3 .small {
  font-size: 2.0rem;
}
.l-page-content .t-border {
  border-bottom: #000 solid 2px;
  padding-bottom: 10px;
}
.l-page-content p {
  font-size: 1.5rem;
  line-height: 2.0;
  text-align: justify;
  padding-bottom: 30px;
}
.l-page-content p.t-right {
  text-align: right;
}
.l-page-content .txt-box {
  padding: 0 40px 40px;
}
.l-page-content .txt-box.__start p {
  font-size: 1.6rem;
}
.l-page-content .txt-box:last-child {
  padding-bottom: 0;
}
.l-page-content .txt-box .l-table-box {
  padding: 10px 0 30px;
  border-bottom: #000 dotted 1px;
  margin-bottom: 30px;
}
.l-page-content .txt-box .l-table-box:last-child {
  border-bottom: none;
}
.l-page-content .txt-box .l-table-box p:first-child {
  padding-bottom: 10px;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.5;
}
.l-page-content .txt-box .l-table-box p:first-child span.small {
  font-weight: 400;
  font-size: 1.5rem;
}
.l-page-content .txt-box .l-table-box a {
  text-decoration: underline;
}
.l-page-content .txt-box .sline {
  color: red;
  text-decoration-line: line-through;
  -webkit-text-decoration-line: line-through;
}
.l-page-content .txt-box .sline span {
  color: black;
}
.l-page-content .txt-box .sline a {
  pointer-events: none;
}
.l-page-content .txt-box .row {
  padding-bottom: 0;
}
.l-page-content .txt-box .row span.t {
  font-weight: 700;
  width: 80px;
}
.l-page-content .txt-box .row span.c {
  flex: 1;
}
.l-page-content .txt-box .red {
  color: red;
}
.l-page-content .txt-box .red a {
  color: red;
  text-decoration: underline;
}
.l-page-content .txt-box span.deadline {
  font-size: 2.8rem;
  font-weight: 700;
  position: relative;
  display: inline-block;
  padding: 0 6px;
  background: linear-gradient(0deg, #f5ff00 0%, #f5ff00 50%, #ffffff 50%, #ffffff 100%);
}
.l-page-content .txt-box .sline .deadline {
  text-decoration-line: line-through;
  -webkit-text-decoration-line: line-through;
}
.l-page-content .l-yellow-box {
  background: #F5FF00;
  padding: 80px 50px;
  margin-bottom: 80px;
}
.l-page-content .l-gray-box {
  background: #F2F0F0;
  padding: 80px 50px;
  margin-bottom: 80px;
}
.l-page-content .l-gray-box img.monka {
  width: 160px;
  height: auto;
}
.l-page-content .l-wt-box {
  text-align: left;
  background: #FFF;
  padding: 80px 50px;
}
.l-page-content .l-wt-box p {
  text-align: left;
}
.l-page-content .l-wt2-box {
  background: #FFF;
  padding: 80px 50px 50px;
  margin: 100px 0 80px;
}
.l-page-content .btn-apply a {
  width: 60%;
  line-height: 80px;
  text-align: center;
  margin: 0 auto 20px;
  display: block;
  font-weight: 700;
  color: #FFF;
  font-size: 2.4rem;
  background: #707070;
  -moz-box-shadow: 10px 10px 0px 0px black;
  -webkit-box-shadow: 10px 10px 0px 0px black;
  box-shadow: 10px 10px 0px 0px black;
}
.l-page-content .btn-apply a:hover {
  background: #00ff00;
  color: #000;
}

@media screen and (max-width: 767px), print {
  .l-page-content {
    padding: 0;
  }
  .l-page-content .inner_wrapper {
    width: 100%;
    max-width: 100%;
  }
  .l-page-content h2 {
    font-size: 5.2vw;
    margin: 0 0 20px;
  }
  .l-page-content h3 {
    font-size: 4.4vw;
    margin: 0 0 15px;
  }
  .l-page-content h3 .small {
    font-size: 3.4vw;
    display: block;
  }
  .l-page-content h3 .num {
    width: auto;
    padding: 6px 12px;
    margin-right: 15px;
    font-size: 5vw;
  }
  .l-page-content h3 .t {
    display: block;
    line-height: 1.5;
  }
  .l-page-content p {
    font-size: 3.8vw;
    padding-bottom: 20px;
  }
  .l-page-content .txt-box {
    padding: 0 40px 40px;
  }
  .l-page-content .txt-box span.deadline {
    font-size: 4.0vw;
  }
  .l-page-content .l-yellow-box {
    padding: 50px 30px;
    margin-bottom: 0;
  }
  .l-page-content .l-gray-box {
    padding: 50px 30px;
    margin-bottom: 0;
  }
  .l-page-content .l-gray-box .txt-box {
    padding: 0 10px 40px;
  }
  .l-page-content .l-gray-box img.monka {
    width: 36vw;
    height: auto;
    display: block;
    margin: 0 auto;
  }
  .l-page-content .l-wt-box {
    padding: 50px 30px;
  }
  .l-page-content .l-wt-box .txt-box {
    padding: 0 0 20px;
  }
  .l-page-content .l-wt-box .txt-box:last-child {
    padding: 0 0 0;
  }
  .l-page-content .l-wt-box .txt-box p {
    font-size: 3.3vw;
    line-height: 1.8;
  }
  .l-page-content .l-wt2-box {
    padding: 50px 30px;
    margin: 0;
  }
  .l-page-content .l-wt2-box .txt-box {
    padding: 0;
  }
  .l-page-content .btn-apply a {
    width: 100%;
    line-height: 60px;
    margin: 0 auto 20px;
    font-size: 3.5vw;
  }
}
.l-list-3col {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
.l-list-3col li {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  width: calc(calc(100% - 80px) / 3);
}
.l-list-3col li .num {
  display: block;
  text-align: center;
  font-size: 3.2rem;
  line-height: 1.0;
  font-weight: 700;
  height: 80px;
}
.l-list-3col li .alpha {
  text-align: center;
  font-size: 3.2rem;
  line-height: 1.0;
  font-weight: 700;
  position: absolute;
  top: -30px;
  left: -30px;
  background: #F5FF00;
  display: block;
  width: 60px;
  height: 60px;
  line-height: 60px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
}
.l-list-3col li .pic {
  position: relative;
  margin-bottom: 30px;
}
.l-list-3col li .txt {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  max-width: 100%;
  height: 100%;
  background: #FFF;
  padding: 20px 30px 0;
}
.l-list-3col li .txt h3 {
  line-height: 1.5;
}
.l-list-3col li .txt p {
  font-size: 1.4rem;
  line-height: 1.8;
}
.l-list-3col li.l-line-box {
  width: 40px;
}
.l-list-3col li.l-line-box .line {
  width: 100%;
  height: 100%;
  background: #FFF;
  position: relative;
  padding: 20px 0 0;
}
.l-list-3col li.l-line-box .line::after {
  content: "";
  width: 1px;
  height: calc(100% - 40px);
  display: block;
  background: #000;
  -moz-transform: rotate(20deg);
  -ms-transform: rotate(20deg);
  -webkit-transform: rotate(20deg);
  transform: rotate(20deg);
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto auto auto 10px;
}
.l-list-3col.__third {
  -webkit-justify-content: center;
  justify-content: center;
}
.l-list-3col.__third li {
  width: calc(calc(100% - 40px) / 2);
}
.l-list-3col.__third li.l-line-box {
  width: 40px;
}

@media screen and (max-width: 767px), print {
  .l-list-3col {
    display: block;
  }
  .l-list-3col li {
    width: 100%;
  }
  .l-list-3col li .num {
    font-size: 6vw;
    height: auto;
    text-align: center;
    width: 18%;
    padding: 10px 0 0;
  }
  .l-list-3col li .alpha {
    font-size: 4.4vw;
    width: 60px;
    height: 60px;
    line-height: 60px;
  }
  .l-list-3col li .pic {
    margin: 0 auto 20px;
    width: 60%;
  }
  .l-list-3col li .txt {
    flex: 1;
    width: auto;
    background: #FFF;
    padding: 20px 20px 0;
  }
  .l-list-3col li .txt p {
    font-size: 3.3vw;
  }
  .l-list-3col li.l-line-box {
    display: none !important;
  }
  .l-list-3col.__first li {
    -js-display: flex;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-bottom: 20px;
  }
  .l-list-3col.__first li:last-child {
    margin-bottom: 0;
  }
  .l-list-3col.__second li {
    display: block;
    padding: 0 20px;
    margin-top: -20px;
    margin-bottom: 40px;
  }
  .l-list-3col.__second li:last-child {
    margin-bottom: 0;
  }
  .l-list-3col.__second li .pic {
    width: 100%;
    margin-bottom: 0;
  }
  .l-list-3col.__second li .txt {
    width: 100%;
    padding: 20px 25px 15px;
  }
  .l-list-3col.__third li {
    width: 100%;
    -js-display: flex;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-bottom: 20px;
  }
  .l-list-3col.__third li:last-child {
    margin-bottom: 0;
  }
}
.prof-box {
  padding: 50px 0 0;
}
.prof-box li {
  -js-display: flex;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  margin-bottom: 50px;
}
.prof-box li:last-child {
  margin-bottom: 0;
}
.prof-box li h3 {
  font-size: 2.4rem;
}
.prof-box li h3 .small {
  font-size: 1.8rem;
}
.prof-box.company li h3 {
  font-size: 2.2rem;
}
.prof-box .pic {
  width: 28%;
}
.prof-box .pic.__circle img {
  width: 80%;
  display: block;
  margin: 0 auto;
}
.prof-box .txt {
  flex: 1;
  padding-left: 60px;
  text-align: left;
}
.prof-box .txt p {
  background: #FFF;
  padding: 30px;
  font-size: 1.4rem;
  line-height: 1.8;
}

@media screen and (max-width: 767px), print {
  .prof-box {
    padding: 30px 0 0;
  }
  .prof-box li {
    display: block;
    margin-bottom: 60px;
  }
  .prof-box li:last-child {
    margin-bottom: 0;
  }
  .prof-box.company li h3 {
    font-size: 3.8vw;
  }
  .prof-box .pic {
    margin: 0 auto 20px;
    width: 60%;
  }
  .prof-box .pic.__circle img {
    width: 100%;
    display: block;
    margin: 0 auto;
  }
  .prof-box .txt {
    width: 100%;
    padding-left: 0;
  }
  .prof-box .txt h3 {
    line-height: 1.5;
    text-align: center;
    display: block;
  }
  .prof-box .txt h3 .small {
    font-size: 3.4vw;
  }
  .prof-box .txt p {
    padding: 20px;
    font-size: 3.3vw;
  }
}