@charset "utf-8";
section{
  box-sizing: border-box;
  margin: 0 auto;
  width: 1440px;
}

@media screen and (max-width:1440px){
  section{
    width:100%;
  }

  section h2 > img{
    width: 100%;
    height: auto;
  }

}

section#mv.p1-1{
  background: url('/img/1-1_mv.png') no-repeat;
  background-size: cover;
  padding-top: 34.375%;
  position: relative;
  height: 0;
}

section#mv.p1-6{
  background: url('/img/1-6_mv.png') no-repeat;
  background-size: cover;
  padding-top: 34.02777777777778%;
  position: relative;
  height: 0;
}

section#mv.p1-6::after{
  content:"";
  background: url('/img/pijin_lg02.png') no-repeat;
  background-size: contain;
  position: absolute;
  top: 3%;
  left:3%;
  width: 215px;
  height: 271px;
}

section#mv.p1-7{
  background: url('/img/1-7_mv.png') no-repeat;
  background-size: cover;
  padding-top: 34.02777777777778%;
  position: relative;
  height: 0;
}

section#mv.p1-7::after{
  content:"";
  background: url('/img/pijin_lg02.png') no-repeat;
  background-size: contain;
  position: absolute;
  top: 3%;
  right:3%;
  width: 200px;
  height: 252px;
}



/* 1-1 */
section#mv.p1-1 h2{
  position: absolute;
  left: 80px;
  top: 90px;
}

section#mv.p1-1 p:nth-of-type(1){
  position: absolute;
  left: 570px;
  top: 120px;
}


section#mv.p1-1 p:nth-of-type(2){
  position: absolute;
  left: 100px;
  bottom: 150px;
}

section#mv.p1-1 p:nth-of-type(3){
  position: absolute;
  left: 360px;
  bottom: 150px;
}

@media screen and (max-width:1440px){
  section#mv.p1-1 h2{
    left: 3%;
    top: 24%;
  }

  section#mv.p1-1 h2 img{
    width: 80%;
    height: auto;
  }

  section#mv.p1-1 p:nth-of-type(1){
    left: 35%;
    top: 29%;
  }

  section#mv.p1-1 p:nth-of-type(1) img{
    width: 80%;
    height: auto;
  }

  section#mv.p1-1 p:nth-of-type(2){
    left: 11%;
    bottom: 25%;
  }
  section#mv.p1-1 p:nth-of-type(3){
    left: 35%;
    bottom: 25%;
  }
}

@media screen and (max-width:1180px){
  section#mv.p1-1 p:nth-of-type(1){
    left: 40%;
  }
}

@media screen and (max-width:1024px){
  section#mv.p1-1 h2 img{
    width: 65%;
    height: auto;
  }

  section#mv.p1-1 p:nth-of-type(1){
    left: 39%;
  }

  section#mv.p1-1 p:nth-of-type(2){
    left: 11%;
    bottom: 19%;
  }

  section#mv.p1-1 p:nth-of-type(3){
    left: 35%;
    bottom: 19%;
  }

  section#mv.p1-1 p:nth-of-type(2) img,
  section#mv.p1-1 p:nth-of-type(3) img{
    width: 80%;
    height: auto;
  }

}

@media screen and (max-width:896px){
  section#mv.p1-1{
    padding-top: 60%;
    margin: 13% 0 0;
    background-position-x: center;
  }

  section#mv.p1-1 h2 img{
    width: 60%;
    height: auto;
  }

  section#mv.p1-1 p:nth-of-type(1){
    left: 45%;
  }
}


@media screen and (max-width:640px){
  section#mv.p1-1{
    padding-top: 60%;
    margin: 26% 0 0;
    background-position-x: center;
  }

  section#mv.p1-1 h2 img{
    width: 50%;
    height: auto;
  }

  section#mv.p1-1 p:nth-of-type(1){
    left: 45%;
  }

  section#mv.p1-1 p:nth-of-type(1) img{
    width: 60%;
    height: auto;
  }

  section#mv.p1-1 p:nth-of-type(2){
    bottom: 30%;
  }

  section#mv.p1-1 p:nth-of-type(3){
    left: 11%;
    bottom: 13%;
  }

  section#mv.p1-1 p:nth-of-type(2) img,
  section#mv.p1-1 p:nth-of-type(3) img{
    width: 65%;
    height: auto;
  }
}

@media screen and (max-width:480px){
  section#mv.p1-1{
    background: url('/img/1-1_mv_sp.png') no-repeat;
    background-size: cover;
    padding-top: 0;
    margin: 26% 0 0;
    width: 100%;
    height:257px;
  }

  section#mv.p1-1 h2{
    left: 3%;
    top: 35%;
  }

  section#mv.p1-1 h2 img{
    width: 36%;
    height: auto;
  }

  section#mv.p1-1 p:nth-of-type(1){
    left: 40%;
    top: 42%;
  }

  section#mv.p1-1 p:nth-of-type(1) img{
    width: 40%;
    height: auto;
  }

  section#mv.p1-1 p:nth-of-type(2){
    left: 7%;
    bottom: 26%;
  }

  section#mv.p1-1 p:nth-of-type(3){
    left: 7%;
    bottom: 7%;
  }

  section#mv.p1-1 p:nth-of-type(2) img,
  section#mv.p1-1 p:nth-of-type(3) img{
    width: 55%;
    height: auto;
  }
}

/* 1-6 */
section#mv.p1-6 h2{
  position: absolute;
  right: 65px;
  top: 200px;
}

section#mv.p1-6 p{
  position: absolute;
  right: 400px;
  bottom: 100px;
}

@media screen and (max-width:1440px){
  section#mv.p1-6 h2{
    right: -2%;
  }

  section#mv.p1-6 h2 img{
    width: 80%;
    height: auto;
  }

  section#mv.p1-6 p{
    right: 30%;
    bottom: 11%;
  }
}

@media screen and (max-width:1200px){
  section#mv.p1-6 h2{
    right: -11%;
    top: 40%;
  }
}

@media screen and (max-width:1024px){
  section#mv.p1-6::after{
    top: 8%;
    right: 3%;
    width: 100px;
    height: 126px;
  }

  section#mv.p1-6 h2{
    right: -24%;
    top: 40%;
  }

  section#mv.p1-6 h2 img{
    width: 65%;
    height: auto;
  }

  section#mv.p1-6 p{
    right: 20%;
    bottom: 11%;
  }
}

@media screen and (max-width:896px){
  section#mv.p1-6{
    padding-top: 60%;
    margin: 13% 0 0;
    background-position-x: 38%;
  }

  section#mv.p1-6::after{
    top: 8%;
    left: 37%;
  }


  section#mv.p1-6 h2{
    right: -34%;
  }

  section#mv.p1-6 h2 img{
    width: 56%;
    height: auto;
  }
}

@media screen and (max-width:640px){
  section#mv.p1-6{
    padding-top: 60%;
    margin: 17% 0 0;
    background-position-x: 38%;
  }

  section#mv.p1-6::after{
    width: 80px;
    height: 101px;
  }


  section#mv.p1-6 h2 img{
    width: 100%;
    height: auto;
  }

  section#mv.p1-6 h2{
    right: 18%;
  }

  section#mv.p1-6 p{
    right: 12%;
    bottom: 11%;
  }

  section#mv.p1-6 p img{
    width: 80%;
    height: auto;
  }
}

@media screen and (max-width:480px){
  section#mv.p1-6{
    background: url('/img/1-6_mv_sp.png') no-repeat;
    background-size: cover;
    padding-top: 0;
    margin: 26% 0 0;
    width: 100%;
    height:257px;
  }

  section#mv.p1-6::after{
    top: 4%;
    left: 33%;
    width: 60px;
    height: 76px;
  }

  section#mv.p1-6 h2{
    top: 38%;
    right: 16%;
  }

  section#mv.p1-6 p{
    right: 7%;
    bottom: 11%;
  }

  section#mv.p1-6 p img{
    width: 60%;
    height: auto;
  }
}

@media screen and (max-width:375px){
  section#mv.p1-6::after{
    top: 7%;
    left: 33%;
    width: 60px;
    height: 76px;
  }

  section#mv.p1-6 p{
    right: 1%;
  }
}

/* 1-7 */
section#mv.p1-7 h2{
  position: absolute;
  right: 200px;
  bottom: 100px;
}

section#mv.p1-7 p{
  position: absolute;
  right: 200px;
  bottom: 10px;
}


@media screen and (max-width:1440px){
  section#mv.p1-7 h2{
    right: 3%;
    bottom: 24%;
  }

  section#mv.p1-7 h2 img{
    width: 80%;
    height: auto;
  }
}

@media screen and (max-width:1240px){
  section#mv.p1-7 h2{
    right: -14%;
    bottom: 24%;
  }

  section#mv.p1-7 h2 img{
    width: 70%;
    height: auto;
  }

  section#mv.p1-7 p{
    right: 6%;
  }

  section#mv.p1-7 p img{
    width: 80%;
    height: auto;
  }
}

@media screen and (max-width:896px){
  section#mv.p1-7::after{
    top: 8%;
    right: 3%;
    width: 100px;
    height: 126px;
  }

  section#mv.p1-7{
    padding-top: 60%;
    margin: 13% 0 0;
    background-position-x: center;
  }

  section#mv.p1-7 h2{
    right: -18%;
    bottom: 20%;
  }
}

@media screen and (max-width:740px){
  section#mv.p1-7 {
    margin: 26% 0 0;
  }

  section#mv.p1-7 h2 img{
    width: 60%;
    height: auto;
  }

  section#mv.p1-7 h2{
    right: -30%;
  }

  section#mv.p1-7 p{
    right: 33%;
  }
}

@media screen and (max-width:640px){
  section#mv.p1-7 {
    margin: 17% 0 0;
  }

  section#mv.p1-7 h2 img{
    width: 88%;
    height: auto;
  }

  section#mv.p1-7 h2{
    right: unset;
    left: 9%;
    bottom: 24%;
  }

  section#mv.p1-7 p{
    right: 24%;
  }

  section#mv.p1-7 p img{
    width:70%;
    height: auto;
  }
}

@media screen and (max-width:480px){
  section#mv.p1-7{
    background: url('/img/1-7_mv_sp.png') no-repeat;
    background-size: cover;
    padding-top: 0;
    margin: 26% 0 0;
    width: 100%;
    height:257px;
  }

  section#mv.p1-7::after{
    top: 8%;
    right: 3%;
    width: 80px;
    height: 101px;
  }

  section#mv.p1-7 h2 img{
    width: 93%;
    height: auto;
  }

  section#mv.p1-7 h2{
    left: 8%;
    bottom: 23%;
  }

  section#mv.p1-7 p{
    right: 14%;
  }

  section#mv.p1-7 p img{
    width:55%;
    height: auto;
  }
}


@media screen and (max-width:320px){
  section#mv.p1-7{
    margin: 34% 0 0;
  }

  section#mv.p1-7::after{
    top: 8%;
    right: 3%;
    width: 50px;
    height: 63px;
  }

  section#mv.p1-7 p{
    right: 6%;
  }


}

/* section#about */
section#about{
  box-sizing: border-box;
  padding: 50px 140px;
  position: relative;
}

@media screen and (max-width:1440px){
  section#about{
    padding: 50px;
  }
}

@media screen and (max-width:1024px){
  section#about{
    padding: 50px 20px;
  }
}

@media screen and (max-width:640px){
  section#about{
    padding: 20px;
  }
}


@media screen and (max-width:375px){
  section#about{
    padding: 10px 0;
  }
}


section#about ul.about_list_wrap{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  justify-content: center;
  align-items: center;
  margin: 50px 0;
}


section#about ul.about_list_wrap li{
  width: 50%;
}

@media screen and (max-width:896px){
  section#about ul.about_list_wrap:nth-of-type(1){
    position: relative;
    margin: 50px 0 0;
  }

  section#about ul.about_list_wrap:nth-of-type(1) li:nth-child(1){
    width: 100%;
  }

  section#about ul.about_list_wrap:nth-of-type(1) li:nth-child(2){
    position: absolute;
    top: -55%;
    right: -2%;
    width: 180px;
  }

  section#about ul.about_list_wrap:nth-of-type(1) li:nth-child(2) img{
    width: 100%;
    height: auto;
  }

  section#about ul.about_list_wrap:nth-of-type(2),
  section#about ul.about_list_wrap:nth-of-type(3){
    justify-content: space-between;
 }

  section#about ul.about_list_wrap:nth-of-type(2) li:nth-child(1),
  section#about ul.about_list_wrap:nth-of-type(3) li:nth-child(1){
    width: 300px;
  }

  section#about ul.about_list_wrap:nth-of-type(2) li:nth-child(2),
  section#about ul.about_list_wrap:nth-of-type(3) li:nth-child(2){
    width: calc(100% - 330px);
  }

  section#about ul.about_list_wrap:nth-of-type(2) li img,
  section#about ul.about_list_wrap:nth-of-type(3) li img{
    width: 100%;
    height: auto;
  }
}

@media screen and (max-width:640px){
  section#about ul.about_list_wrap:nth-of-type(2),
  section#about ul.about_list_wrap:nth-of-type(3){
    flex-direction: column;
    justify-content: center;
 }

  section#about ul.about_list_wrap:nth-of-type(2) li:nth-child(1),
  section#about ul.about_list_wrap:nth-of-type(3) li:nth-child(1){
    margin-bottom: 20px;
    width: 100%;
  }

  section#about ul.about_list_wrap:nth-of-type(2) li:nth-child(2),
  section#about ul.about_list_wrap:nth-of-type(3) li:nth-child(2){
    width: 100%;
  }

  section#about ul.about_list_wrap:nth-of-type(1) li:nth-child(2){
    top: -32%;
    right: -4%;
    width: 110px;
  }
}

@media screen and (max-width:420px){
  section#about ul.about_list_wrap:nth-of-type(1) li:nth-child(2){
    top: -24%;
    right: 0%;
  }
}

@media screen and (max-width:375px){
  section#about ul.about_list_wrap{
    margin: 20px 0;
  }

  section#about ul.about_list_wrap:nth-of-type(1) li:nth-child(1),
  section#about ul.about_list_wrap:nth-of-type(2) li:nth-child(2),
  section#about ul.about_list_wrap:nth-of-type(3) li:nth-child(2){
    width: 90%;
  }

  section#about ul.about_list_wrap:nth-of-type(2) li img,
  section#about ul.about_list_wrap:nth-of-type(3) li img{
    width: 100%;
    height: 235px;
    object-fit: cover;
    border-radius: 0 10%;
  }

  section#about ul.about_list_wrap:nth-of-type(1) li:nth-child(2){
    top: -33%;
  }
}


section#about ul.about_list_wrap li h2{
  color: #000;
  font-weight: 700;
  font-size: 40px;
  position: relative;
}

section#about ul.about_list_wrap li h2::after{
  content:"";
  background: #c23025;
  margin-top: 23px;
  width: 50px;
  height: 3px;
  position: absolute;
  top: 100%;
  left: 0;
}


@media screen and (max-width:896px){
  section#about ul.about_list_wrap li h2{
    font-size: 30px;
  }
}

@media screen and (max-width:640px){
  section#about ul.about_list_wrap li h2{
    font-size: 20px;
  }

  section#about ul.about_list_wrap li h2::after{
    margin-top: 16px;
  }
}

@media screen and (max-width:375px){
  section#about ul.about_list_wrap li h2::after{
    margin-top: 10px;
  }
}

section#about ul.about_list_wrap li h2 + p{
  font-size: 16px;
  font-weight: 500;
  line-height: 2;
  margin: 60px 95px 40px 0;
}

@media screen and (max-width:1024px){
  section#about ul.about_list_wrap li h2 + p{
    margin: 50px 0 20px;
  }
}

@media screen and (max-width:640px){
  section#about ul.about_list_wrap li h2 + p{
    font-size: 12px;
    line-height: 1.8;
    margin: 30px 0 10px;
  }
}

section#about ul.about_list_wrap:nth-child(3){
  flex-direction: row-reverse;
}

@media screen and (max-width:640px){
  section#about ul.about_list_wrap:nth-child(3){
    margin: 0;
  }
}



section#about ul.about_list_wrap:nth-of-type(1) li figure{
  position: relative;
  text-align: center;

}

section#about ul.about_list_wrap:nth-of-type(1) li figure::before{
  content: "";
  background: url('/img/oval.png') no-repeat;
  background-size: contain;
  position: absolute;
  top: 17px;
  left: 76px;
  width: 182px;
  height: 215px;
  z-index:-2;
}

section#about ul.about_list_wrap:nth-of-type(1) li figure::after{
  content: "";
  background: url('/img/oval.png') no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 9px;
  right: 69px;
  width: 182px;
  height: 215px;
  z-index:-1;
}

@media screen and (max-width:896px){
  section#about ul.about_list_wrap:nth-of-type(1) li figure::before,
  section#about ul.about_list_wrap:nth-of-type(1) li figure::after{
    content: none;
  }
}

section#chi{
  background: #F0F5FD;
  box-sizing: border-box;
  padding: 50px 100px;
  position: relative;
}

@media screen and (max-width:1440px){
  section#chi{
    padding: 50px 0;
  }
}

@media screen and (max-width:480px){
  section#chi{
    padding: 30px 0;
  }
}

section#chi h2{
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 40px;
  text-align: center;
  position: relative;
}

section#chi h2::after{
  content:"";
  background: #c23025;
  margin-top: 23px;
  width: 50px;
  height: 3px;
  position: absolute;
  top: 100%;
  left: calc(50% - 25px);
}

@media screen and (max-width:896px){
  section#chi h2{
    font-size: 30px;
  }
}

@media screen and (max-width:640px){
  section#chi h2{
    font-size: 20px;
  }

  section#chi h2::after{
    margin-top: 16px;
  }
}
section#chi ul.chi_wrap{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  justify-content: center;
  align-items: center;
  margin: 50px 0;
}

section#chi ul.chi_wrap li{
  position: relative;
}

section#chi ul.chi_wrap:nth-of-type(1) > li:nth-child(2),
section#chi ul.chi_wrap:nth-of-type(2) > li:nth-child(2){
  width: 419px;
}

section#chi ul.chi_wrap:nth-of-type(1) > li:nth-child(1),
section#chi ul.chi_wrap:nth-of-type(2) > li:nth-child(1){
  box-sizing: border-box;
  padding: 0 40px;
  width: calc(100% - 419px);
}

@media screen and (max-width:1024px){
  section#chi ul.chi_wrap:nth-of-type(1) > li:nth-child(1),
  section#chi ul.chi_wrap:nth-of-type(2) > li:nth-child(1){
    padding: 0 20px;
  }
}

@media screen and (max-width:896px){
  section#chi ul.chi_wrap{
    flex-direction: column;
  }

  section#chi ul.chi_wrap li{
    padding: 0 !important;
    width: 100% !important;
  }

  section#chi ul.chi_wrap:nth-of-type(1) {
    flex-direction: column-reverse;
  }

  section#chi ul.chi_wrap li figure img{
    display: block;
    margin: 0 auto;
  }
}

@media screen and (max-width:375px){
  section#chi ul.chi_wrap:nth-of-type(1) > li:nth-child(1),
  section#chi ul.chi_wrap:nth-of-type(2) > li:nth-child(1){
    padding: 10px !important;
  }

  section#chi ul.chi_wrap li figure img{
    width: 100%;
    height: 235px;
    object-fit: cover;
    border-radius: 0 10%;
  }

}


section#chi ul.chi_wrap li h3{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  align-items: center;
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 35px;
  margin-bottom: 50px;
  position: relative;
}

section#chi ul.chi_wrap li h3 > span{
  color: rgba(37, 37, 37, 0.05);
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 150px;
  font-weight:900;
}

section#chi ul.chi_wrap li p:not(.more_btn){
  color: rgba(37, 37, 37, 0.7);
  font-size: 16px;
  font-weight: 500;
  line-height: 200%;
  margin: 60px 60px 40px;
}

section#chi ul.chi_wrap:nth-of-type(2){
  flex-direction: row-reverse;
}

@media screen and (max-width:1150px){
  section#chi ul.chi_wrap li h3 > span{
    font-size: 120px;
  }

  section#chi ul.chi_wrap li p:not(.more_btn){
    margin: 60px 20px 40px;
  }
}

@media screen and (max-width:1024px){
  section#chi ul.chi_wrap li h3{
    font-size:30px;
  }
  section#chi ul.chi_wrap li h3 > span{
    font-size: 100px;
  }
}

@media screen and (max-width:896px){
  section#chi ul.chi_wrap:nth-of-type(2){
    flex-direction: column-reverse;
    margin: 0;
  }

  section#chi ul.chi_wrap li h3 > span{
    font-size: 90px;
  }

  section#chi ul.chi_wrap li h3{
    margin-bottom: 30px;
    font-size: 25px;
  }

  section#chi ul.chi_wrap li p:not(.more_btn){
    margin: 20px 60px;
    font-size: 13px;
  }
}

@media screen and (max-width:640px){
  section#chi ul.chi_wrap li h3 > span{
    font-size: 90px;
  }

  section#chi ul.chi_wrap li h3{
    margin: 10px 0 0;
    font-size: 20px;
  }

  section#chi ul.chi_wrap li p:not(.more_btn){
    margin: 10px 0;
    font-size: 11px;
  }
}

@media screen and (max-width:320px){
  section#chi ul.chi_wrap li h3 > span{
     font-size: 60px;
  }

  section#chi ul.chi_wrap li h3{
    margin-bottom: 20px;
    font-size: 20px;
  }

  section#chi ul.chi_wrap li p:not(.more_btn){
    margin: 10px 0;
    font-size: 11px;
  }

}


section#chi ul.chi_wrap:nth-of-type(1) li p.more_btn{
  position: absolute;
  top: 8%;
  left: 57%;
}

section#chi ul.chi_wrap:nth-of-type(2) li p.more_btn{
  position: absolute;
  top: 11%;
  right: 0;
}

@media screen and (max-width:1300px){
  section#chi ul.chi_wrap:nth-of-type(1) li p.more_btn{
    top: 25%;
  }

  section#chi ul.chi_wrap:nth-of-type(2) li p.more_btn{
    top: 27%;
  }
}

@media screen and (max-width:1024px){
  section#chi ul.chi_wrap:nth-of-type(1) li p.more_btn{
    top: 84%;
    left: 29%;
  }

  section#chi ul.chi_wrap:nth-of-type(2) li p.more_btn{
    top: 89%;
    left: 31%;
  }
}


@media screen and (max-width:896px){
  section#chi ul.chi_wrap li p.more_btn{
    position: unset !important;
    text-align: center;
  }
}


section#features{
  padding: 30px 0 0;
}

section#features h2{
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 45px;
  text-align: center;
  position: relative;
  margin-bottom: 60px;
}

section#features h2::after{
  content:"";
  background: #c23025;
  margin-top: 23px;
  width: 50px;
  height: 3px;
  position: absolute;
  top: 100%;
  left: calc(50% - 25px);
}

@media screen and (max-width:896px){
  section#features h2{
    font-size: 30px;
  }
}

@media screen and (max-width:640px){
  section#features h2{
    font-size: 20px;
  }

  section#features h2::after{
    margin-top: 16px;
  }
}

section#features ul{
  background:url('/img/features_bg.png') no-repeat;
  background-size: cover;
  box-sizing: border-box;
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  justify-content: space-between;
  padding: 60px 80px;
  width: 100%;
}

section#features ul li{
  background: #fff;
  border-radius:20px;
  box-sizing: border-box;
  padding: 30px 50px;
  margin-bottom: 42px;
  width: 47%;
  height: 396px;
}

@media screen and (max-width:1280px){
  section#features ul{
    padding: 60px 60px;
  }

  section#features ul li{
    padding: 30px 20px;
    width: 49%;
  }

  section#features ul li:nth-child(5) figure > img:nth-of-type(1){
    width: auto;
    height: 110px;
  }
  section#features ul li:nth-child(4) figure > img{
    width: auto;
    height: 120px;
  }
}

@media screen and (max-width:1024px){
  section#features ul li{
    padding: 30px 20px;
  }

}

@media screen and (max-width:896px){
  section#features ul{
    padding: 30px 40px;
    margin: 0;
    width: 100%;
  }

  section#features ul li{
    padding: 20px 10px;
  }

  section#features ul li figure{
    margin: 5px auto;
    width: 80%;
  }

  section#features ul li:nth-child(4) figure > img{
    width: auto;
    height: 100px;
  }

}

@media screen and (max-width:768px){
  section#features ul{
    padding: 60px 30px;
  }

  section#features ul li{
    width: 100%;
    height: 333px;
  }

  section#features ul li:last-child{
    margin-bottom: 0;
  }
}

@media screen and (max-width:640px){
  section#features ul li{
    height: 310px;
  }
}

@media screen and (max-width:375px){
  section#features ul{
    padding: 40px 20px;
  }
}


@media screen and (max-width:320px){
  section#features ul{
    padding: 40px 15px;
  }
}


section#features ul li h3{
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 20px;
  font-weight: 900;
  line-height: 1.2;
  color: #455a64;
  text-align: center;
}

section#features ul li figure{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  justify-content: center;
  align-items: center;
  margin: 15px auto;
}

section#features ul li:nth-child(3) figure{
  margin: 0 auto;
}

section#features ul li:nth-child(3) figure img:nth-of-type(1){
  margin: -25px 0 0;
}


section#features ul li p{
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.001em;
  color: #455A64;
  margin: 40px 30px 0;
}

section#features ul li:nth-child(3) p {
  line-height: 130%;
  margin: -50px 0 0 !important;
}

@media screen and (max-width:768px){
  section#features ul li:nth-child(3) p {
    margin: -80px 0 0 !important;
  }
}

@media screen and (max-width:640px){
  section#features ul li:nth-child(3) p {
    margin: -48px 0 0 !important;
  }
}

@media screen and (max-width:375px){
  section#features ul li:nth-child(3) p {
    margin: -33px 0 0 !important;
  }
}


section#features ul li p > span:not(.sm){
  background: #C23025;
  border-radius: 15px;
  color: #fff;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 13px;
  font-weight: 900;
  display: block;
  margin: 1.2em 0 5px;
  padding: 5px 7px;
  text-align: center;
  width: 100px;
}

section#features ul li p > span.sm{
  font-size: 11px;
}

@media screen and (max-width:896px){
  section#features ul li p{
    font-size: 15px;
  }
}

@media screen and (max-width:640px){
  section#features ul li h3{
    font-size: 14px;
  }

  section#features ul li p{
    font-size: 13px;
  }

  section#features ul li p > span:not(.sm){
    font-size: 11px;
  }

  section#features ul li figure{
    margin: 5px auto;
    width: 80%;
  }
}

@media screen and (max-width:375px){
  section#features ul li p{
    margin: 20px 10px 0;
  }
}

@media screen and (max-width:1024px){
  section#features ul li:nth-child(2) figure > img:nth-of-type(1){
    width: 120px;
    height: auto;
  }
  section#features ul li:nth-child(2) figure > img:nth-of-type(2){
    width: 140px;
    height: auto;
  }

  section#features ul li:nth-child(3) figure > img:nth-of-type(1){
    width: 73px;
    height: auto;
  }

  section#features ul li:nth-child(3) figure > img:nth-of-type(2){
    width: 140px;
    height: auto;
  }

  section#features ul li:nth-child(4) figure > img:nth-of-type(1){
    width: 140px;
    height: auto;
  }
  section#features ul li:nth-child(4) figure > img:nth-of-type(2){
    width: 120px;
    height: auto;
  }

  section#features ul li:nth-child(5) figure > img:nth-of-type(1){
    width: 120px;
    height: auto;
  }
  section#features ul li:nth-child(5) figure > img:nth-of-type(2){
    width: 140px;
    height: auto;
  }
  section#features ul li:nth-child(5) figure > img:nth-of-type(3){
    width: 90px;
    height: auto;
  }
  section#features ul li:nth-child(6) figure > img:nth-of-type(1){
    width: 120px;
    height: auto;
  }
  section#features ul li:nth-child(6) figure > img:nth-of-type(2){
    width: 140px;
    height: auto;
  }
}

@media screen and (max-width:375px){
  section#features ul li:nth-child(3) figure > img:nth-of-type(2){
    width: 120px;
    height: auto;
  }

}


section#features p.chi_btn a {
  background: url(/img/chi_btn_border.png) no-repeat;
  background-size: contain;
  color: #fff;
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flexbox;
  display: -moz-flexbox;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  font-size: 38px;
  line-height: 46px;
  text-shadow: 0px 4px 30px rgb(0 0 0 / 50%);
  margin: 0 auto;
  width: 516px;
  height: 152px;
}

@media screen and (max-width:640px){
  section#features p.chi_btn a{
    font-size: 16px;
  }

  section#features p.chi_btn a{
    width: 300px;
    height: 88px;
  }
}

section#video{
  padding: 80px 0;
  position: relative;
}

@media screen and (max-width:640px){
  section#video{
    padding: 40px 0;
  }
}

section#video::before{
  content: "";
  background: url('/img/oval.png') no-repeat;
  background-size: contain;
  position: absolute;
  top: 17px;
  left: 5px;
  width: 182px;
  height: 215px;
  z-index:-2;
}

section#video::after{
  content: "";
  background: url('/img/oval.png') no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 9px;
  right: 5px;
  width: 182px;
  height: 215px;
  z-index:-1;
}


@media screen and (max-width:640px){
  section#video::before,
  section#video::after{
    content: none;
  }
}

section#video ul{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  justify-content: space-between;
  margin: 0 80px;
  width: calc(100% - 160px);
}

section#video ul li{
  width: 560px;
}

section#video ul li h2{
  color: #252525;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 40px;
  font-weight: 700;
  position: relative;
  margin-bottom: 50px;
}

section#video ul li h2::after{
  content:"";
  background: #C23025;
  margin-top: 9px;
  width: 50px;
  height: 3px;
  position: absolute;
  top: 100%;
  left: 0;
}

@media screen and (max-width:1440px){
  section#video ul li{
    width: calc((100% - 40px) / 2);
  }

  section#video ul li video{
    width: 100%;
    height: auto;
  }

  section#video ul li h2{
    font-size: 30px;
  }

}

@media screen and (max-width:640px){
  section#video ul{
    margin: 0 30px;
    width: calc(100% - 60px);
  }

  section#video ul li{
    width: 100%
  }

  section#video ul li:first-child{
    margin-bottom: 40px;
  }

  section#video ul li h2{
    font-size: 20px;
    margin-bottom: 20px;
  }

  section#video h2::before{
    content:"";
    background: url('/img/oval_sp.png') no-repeat;
    background-size: contain;
    position: absolute;
    top: -17px;
    left: -26px;
    width: 65px;
    height: 70px;
  }

  section#video ul li > figure{
    width: 100%;
  }

  section#video ul li > figure > img{
    width: 100%;
    height: auto;
  }
}


section#students{
  background: url('/img/oval_bg.png') repeat-y;
  padding: 60px 0;
}

section#students h2{
  color: #252525;
  font-weight: bold;
  font-size: 45px;
  text-align: center;
  position: relative;
  margin-bottom: 50px;
}

section#students h2::after{
  content:"";
  background: #C23025;
  margin-top: 23px;
  width: 50px;
  height: 3px;
  position: absolute;
  top: 100%;
  left: calc(50% - 25px);
}

section#students ul{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  justify-content: space-between;
  margin: 20px auto;
  width: 1060px;
}

section#students ul li{
  width: 250px;
}

section#students ul li p{
  font-family: Noto Sans JP;
  font-size: 14px;
  line-height: 22.4px;
  margin: 20px 0;
}

section#sns{
  padding: 80px 0;
}

section#sns ul{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  justify-content: space-between;
  margin: 0 140px;
  width: calc(100% - 280px);
}

section#sns ul li{
  width: 506px;
}

section#sns ul li h2{
  color: #252525;
  font-size: 40px;
  font-weight: bold;
  position: relative;
  margin-bottom: 50px;
}

section#sns ul li h2::after{
  content:"";
  background: #C23025;
  margin-top: 9px;
  width: 50px;
  height: 3px;
  position: absolute;
  top: 100%;
  left: 0;
}

section.under h2{
  color: #252525;
  font-size: 40px;
  font-weight: bold;
  position: relative;
  margin-bottom: 50px;
  padding: 140px 0 0 130px;

}

section.under h2::after{
  content:"";
  background: #C23025;
  margin-top: 9px;
  width: 50px;
  height: 3px;
  position: absolute;
  top: 100%;
  left: 140px;
}


section.under h2::before{
  content:"";
  background: url('/img/oval.png') no-repeat;
  background-size: contain;
  position: absolute;
  top: 30px;
  left: 0px;
  width:182px;
  height:215px;
}

section.c01{
  position: relative;
}

section.c01 p.chat_btn{
  position: absolute;
  bottom: -200px;
  right: 31px;
}


section.c01 p:not(.chat_btn){
  color: #455a64;
  font-size: 22px;
  line-height: 40px;
  margin: 60px 0 0 140px;
}

section.c01::after{
  content:"";
  background: url('/img/c01.png') no-repeat;
  background-size: contain;
  position: absolute;
  top: 60px;
  right: 60px;
  width:394px;
  height:377px;
}

section.c02 ul,
section.c03 ul,
section.c04 ul{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  width: 100%;
}

section.c02 ul li,
section.c03 ul li{
  color: #fff;
  font-size: 22px;
  line-height: 40px;
  width: 50%;
}

section.c02 ul li img,
section.c03 ul li img,
section.c04 ul li img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}


section.c02 ul li:nth-child(2){
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), rgba(194, 48, 37, 0.6);
  box-sizing: border-box;
  padding: 100px 70px 0;
}

section.c03 ul{
  flex-direction: row-reverse;
}

section.c03 ul li:nth-child(2){
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)), rgba(194, 48, 37, 0.8);
  box-sizing: border-box;
  padding: 100px 70px 0;
}

section.c04 ul{
  margin-top: 80px;
}

section.c04 ul li:nth-child(1){
  width: 508px;
}

section.c04 ul li:nth-child(2){
  background: rgba(37, 37, 37, 0.65);
  box-sizing: border-box;
  padding: 50px 70px;
  width: calc(100% - 508px);
}

section.c04 ul li:nth-child(2) p:not(.chi_btn){
  font-size: 22px;
  line-height: 40px;
  color: #fff;
}


section.c04 ul li p.chi_btn a{
  background: url('/img/chi_btn_border.png') no-repeat;
  background-size: contain;
  color: #fff;
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  font-size: 38px;
  line-height: 46px;
  text-shadow: 0px 4px 30px rgba(0, 0, 0, 0.5);
  margin: 40px auto 0;
  width: 516px;
  height: 152px;
}

section.c05 h3{
  color: #fafafa;
  font-size:40px;
  line-height: 48px;
  text-align: center;
  margin-bottom: 80px;
}

section.c05 div{
  background: linear-gradient(180deg, rgba(66, 36, 251, 0.5) 0%, rgba(184, 30, 238, 0) 100%), rgba(58, 36, 147, 0.6);
  box-sizing: border-box;
  padding: 30px;
}

section.c05 div ul{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  justify-content: space-between;
}

section.c05 div ul.flow > li{
  background: #fff;
  border: 5px solid #3a2493;
  box-sizing: border-box;
  border-radius: 15px;
  padding: 80px 10px 10px;
  position: relative;
  width: 350px;
}

section.c05 div ul.flow li h4{
  color: #3a2493;
  font-size: 16px;
  font-weight: bold;
  line-height: 19px;
  text-align: center;
  height: 2em;
}

section.c05 div ul.flow li p{
  color: #455a64;
  font-size: 16px;
  line-height: 24px;
}

section.c05 div ul.flow li figure{
  text-align: center;
  height: 287px;
}

section.c05 div ul.flow > li:nth-child(1)::before{
  background: #3a2493;
  border-radius: 50%;
  content: "Bài tập về nhà";
  color:#fff;
  font-size: 20px;
  padding: 10% 2%;
  text-align: center;
  position:absolute;
  top: -9%;
  left:9%;
  width: 80%;
}

section.c05 div ul.flow > li:nth-child(2)::before{
  background: #3a2493;
  border-radius: 50%;
  content: "Bài học";
  color:#fff;
  font-size: 20px;
  padding: 10% 2%;
  text-align: center;
  position:absolute;
  top: -9%;
  left:9%;
  width: 80%;
}

section.c05 div ul.flow > li:nth-child(3)::before{
  background: #3a2493;
  border-radius: 50%;
  content: "Ôn tập";
  color:#fff;
  font-size: 20px;
  padding: 10% 0;
  text-align: center;
  position:absolute;
  top: -9%;
  left:9%;
  width: 80%;
}

section.c05 div ul.flow > li:nth-child(2)::after,
section.c05 div ul.flow > li:nth-child(3)::after{
  content:"";
  background: url('/img/arrow01.png') no-repeat;
  background-size: contain;
  position: absolute;
  top:30%;
  left: -45%;
  width:144px;
  height: 183px;
}



section.c05 div ul.flow > li:nth-child(4){
  background: rgba(255, 255, 255, 0.7);
  border: 5px solid #3A2493;
  box-sizing: border-box;
  margin-top: 50px;
  padding:20px 10px 10px;
  width: 100%;
}

section.c05 div ul.flow li:nth-child(4) figure{
  position: absolute;
}

section.c05 div ul.flow li:nth-child(4) figure:nth-of-type(1){
  right: -1%;
  bottom: 31%;
}


section.c05 div ul.flow li:nth-child(4) figure:nth-of-type(2){
  top: -4%;
  left: 2%;
}

section.c05 div ul.flow li:nth-child(4) h4{
  line-height: 55px;
  font-size: 30px;
}

section.c05 div ul.flow li:nth-child(4) h4 > span{
  line-height: 55px;
  font-size: 40px;
}

section.c05 div ul.list01{
  margin: 20px auto;
  padding-top: 80px;
  width: 840px;
}

section.c05 div ul.list01 > li{
  width: 50%;
}

section.c05 div ul.list01 > li > ul > li{
  font-size: 25px;
  margin-bottom: 1.5em;
}

section.c05 div ul.list01 > li > ul > li::before{
  content: "✔ ";
}

section#regist{
  padding: 30px 0 0;
}

section#regist h2{
  color: #000;
  font-weight: 700;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 40px;
  text-align: center;
  position: relative;
}

section#regist h2::after{
  content:"";
  background: #c23025;
  margin-top: 23px;
  width: 50px;
  height: 3px;
  position: absolute;
  top: 100%;
  left: calc(50% - 25px);
}

@media screen and (max-width:896px){
  section#regist h2{
    font-size: 30px;
  }
}

@media screen and (max-width:640px){
  section#regist h2{
    font-size: 20px;
  }

  section#regist h2::after{
    margin-top: 16px;
  }
}

section#regist div{
  background: url('/img/regist_bg_jp.png') no-repeat;
  background-size: cover;
  box-sizing: border-box;
  margin: 60px 0 20px;
  padding: 50px 30px;
}

section#regist.int_jp div{
  background: url('/img/regist_bg_jp02.png') no-repeat;
  background-size: cover;
  background-position: 48%;
}

section#regist ul{
  margin: 0 auto;
  width: 80%;
}
section#regist div > ul li{
  background: rgba(255, 255, 255, 0.6);
  border: solid 4px #c23025;
  border-radius: 20px;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 25px;
  line-height: 36px;
  text-align: center;
  padding:36px 0;
  margin-bottom: 25px;
  width: 100%;
}
section#regist div > ul li span{
  color: #c23025;
}

section#regist p.chi_btn{
  margin: 44px 0 0;
}
section#regist p.chi_btn a{
  background: url('/img/chi_btn_border.png') no-repeat;
  background-size: contain;
  color: #fff;
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  font-size: 38px;
  line-height: 46px;
  text-shadow: 0px 4px 30px rgba(0, 0, 0, 0.5);
  margin: 0 auto;
  width: 516px;
  height: 152px;
}

section#regist h2 + p{
  color:#252525;
  font-size: 20px;
  font-weight: 500;
  line-height: 36px;
  text-align: center;
  margin: 40px 0;
}

section#regist figure{
  text-align: center;
}

@media screen and (max-width:896px){
  section#regist ul{
    width: 100%;
  }
  section#regist div > ul li{
    box-sizing: border-box;
    font-size: 18px;
    padding:28px 20px;
  }
}

@media screen and (max-width:640px){
  section#regist div{
    background-position: 80%;
    padding: 30px 18px;
    margin: 50px 0 0;
  }
  
  section#regist div > ul li{
    font-size: 12px;
    line-height: 17px;
    margin-bottom: 15px;
  }
}

@media screen and (max-width:375px){
  section#regist div > ul li{
    font-size: 11.5px;
    padding: 10px;
  }
}

section#regist p.chi_btn_r{
  margin: 60px 0;
}
section#regist p.chi_btn_r a{
  background: url('/img/chi_btn_border_r.png') no-repeat;
  background-size: contain;
  color: rgba(194, 48, 37, 0.83);
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  font-size: 33px;
  line-height: 40px;
  text-shadow: 0px 4px 30px rgba(0, 0, 0, 0.5);
  margin: 0 auto;
  width: 516px;
  height: 152px;
}

section#regist h3{
  color: #252525;
  font-size: 28px;
  font-weight: bold;
  position: relative;
  margin-bottom: 50px;
}

section#regist h3::after{
  content:"";
  background: #C23025;
  margin-top: 9px;
  width: 50px;
  height: 3px;
  position: absolute;
  top: 100%;
  left: 0;
}

section#regist h3 + p{
  color: #252525;
  font-size: 20px;
  line-height: 24px;
  margin-bottom: 1em;
}

section#regist ul.if{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  justify-content: space-between;
  margin: 0 auto;
  width: 1230px;
}

section#regist ul.if li{
  width: 390px;
}

section#regist ul.if li img{
  width: 100%;
  height: auto;
}

section#payment{
  padding: 40px 0;
}

section#payment h2{
  color: #000;
  font-weight: bold;
  font-size: 40px;
  text-align: center;
  position: relative;
}

section#payment h2::after{
  content:"";
  background: #c23025;
  margin-top: 23px;
  width: 50px;
  height: 3px;
  position: absolute;
  top: 100%;
  left: calc(50% - 25px);
}

section#payment ul{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  justify-content: space-between;
  align-items: center;
  text-align: center;
  margin: 50px auto 20px;
  width: 100%;
}

section#payment ul li{
  width: 30%;
}

section#payment ul li figcaption{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  align-items: center;
  color: #252525;
  font-size: 20px;
  font-weight: bold;
  line-height: 24px;
}

section#payment ul li figcaption > span{
  color: rgba(37, 37, 37, 0.1);
  font-size: 55px;
  font-weight: 900;
  margin-right: 12px;
}

section#payment ul li figure img{
  margin: 15px auto;
}

section#service{
  padding: 30px 0 0;
}

section#service h2{
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: 45px;
  text-align: center;
  position: relative;
  margin-bottom: 60px;
}

section#service h2::after{
  content:"";
  background: #c23025;
  margin-top: 23px;
  width: 50px;
  height: 3px;
  position: absolute;
  top: 100%;
  left: calc(50% - 25px);
}

@media screen and (max-width:896px){
  section#service h2{
    font-size: 30px;
  }
}

@media screen and (max-width:640px){
  section#service h2{
    font-size: 20px;
    margin-bottom: 40px;
  }

  section#service h2::after{
    margin-top: 16px;
  }
}


section#service ul{
  box-sizing: border-box;
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  justify-content: space-between;
  box-sizing: border-box;
  padding: 60px 80px;
  width: 100%;
}

section#service ul li{
  background: #FAFAFA;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  box-sizing: border-box;
  padding: 30px 50px;
  margin-bottom: 42px;
  width: 46%;
}

section#service ul li h3{
  display:-webkit-box;
  display:-moz-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  jusify-content: center;
  align-items: center;
  color: #252525;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 35px;
  font-weight: 700;
  margin: 0 0 20px;
}

section#service ul li h3 > span{
  color: rgba(37, 37, 37, 0.05);
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 150px;
  font-weight: 900;
  margin-right: 30px;
}

section#service ul li figure{
  text-align: center;
  margin-bottom: 30px;
}

section#service ul li p{
  color: rgba(37, 37, 37, 0.7);
  font-size: 16px;
  font-weight:500;
  line-height: 36px;
}

@media screen and (max-width:1280px){
  section#service ul li h3{
    font-size: 33px;
  }

  section#service ul li h3 > span{
    font-size: 130px;
  }

  section#service ul li figure img{
    width: 100%;
    height: auto;
  }
}

@media screen and (max-width:1024px){
  section#service ul li h3{
    font-size: 28px;
  }

  section#service ul li h3 > span{
    font-size: 110px;
  }
}

@media screen and (max-width:896px){
  section#service ul{
    padding: 60px 40px;
  }

  section#service ul li{
    padding: 30px 20px;
  }

  section#service ul li figure{
    margin-bottom: 0;
  }

  section#service ul li h3{
    font-size: 25px;
  }

  section#service ul li h3 > span{
    font-size: 100px;
  }

  section#service ul li p{
    font-size: 13px;
    line-height: 1.8;
  }
}

@media screen and (max-width:640px){
  section#service ul{
    padding: 0 20px;
    flex-direction: column;
  }

  section#service ul li{
    padding: 20px;
    width: 100%;
  }

  section#service ul li figure img{
    width: 80%;
    height: auto;
  }

  section#service ul li h3{
    font-size: 20px;
    margin:0; 
  }

  section#service ul li h3 > span{
    font-size: 90px;
  }

  section#service ul li p{
    font-size: 11px;
    line-height: 1.8;
  }
}

@media screen and (max-width:375px){
  section#service ul li{
    padding: 15px;
  }

  section#service ul li h3 > span{
    font-size: 70px;
  }
}