@charset "UTF-8";
* {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
  box-sizing: border-box;
}

body {
  font-family: "メイリオ", "Meiryo", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
  font-size: 1.6rem;
  color: #000000;
  margin: 0;
  overflow-x: hidden;
}

#header {
  padding: 4rem 2.4rem;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
}
@media screen and (max-width: 767px) {
  #header {
    padding: 2rem 1.4rem;
  }
}
@media screen and (max-width: 480px) {
  #header {
    padding: 1rem 1.4rem;
  }
}

.header_wrap {
  display: flex;
  justify-content: space-between;
}

.h_atermlogo {
  width: 40%;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 480px) {
  .h_atermlogo {
    width: 50%;
  }
}
@media screen and (max-width: 480px) {
  .h_atermlogo img {
    width: 100%;
  }
}

.h_sns {
  width: 60%;
}
@media screen and (max-width: 480px) {
  .h_sns {
    width: 50%;
  }
}

.h_snsX {
  display: flex;
  justify-content: flex-end;
}

.h_snsXbtn {
  background: linear-gradient(to right, #ffffff, #ffffff 40%, #000000 60%);
  background-size: 300% 300%;
  background-position: 100%;
  transition: all 0.14s;
  display: flex;
  text-align: center;
  max-width: 6rem;
  padding: 1.5rem;
  border: 1px solid #fff;
  border-radius: 4px;
  color: #fff;
}
.h_snsXbtn:hover {
  background-position: 0;
  border-color: #000;
  color: #000;
  opacity: 1;
}
.h_snsXbtn:hover .snsX_icon {
  fill: #000;
}

.snsX_icon {
  width: 100%;
  height: 100%;
  max-width: 2.8rem;
  max-height: 2.8rem;
  cursor: pointer;
  fill: #fff;
}

.kv_sec {
  position: relative;
  width: 100%;
  height: 100vh;
}
@media screen and (min-width: 1367px) {
  .kv_sec {
    min-height: 930px;
  }
}
@media screen and (max-width: 1366px) {
  .kv_sec {
    min-height: 760px;
    max-height: 900px;
  }
}
@media screen and (max-width: 1100px) {
  .kv_sec {
    min-height: 760px;
    max-height: 860px;
  }
}
@media screen and (max-width: 767px) {
  .kv_sec {
    min-height: 900px;
    max-height: 860px;
  }
}
@media screen and (max-width: 480px) {
  .kv_sec {
    max-height: 193.75vw;
    min-height: 626px;
  }
}

.kv_imgbase,
.kv_img1,
.kv_img2 {
  opacity: 0;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.kv_imgbase img,
.kv_img1 img,
.kv_img2 img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.kv_imgbase {
  z-index: 3;
}

.kv_img1 {
  z-index: 2;
}

.kv_img1 {
  z-index: 1;
}

.kv_paint1,
.kv_paint2 {
  position: absolute;
  top: 0;
}

.kv_paint1 {
  left: 0;
  z-index: 4;
}
.kv_paint1 img {
  width: 61rem;
}
@media screen and (min-width: 1367px) {
  .kv_paint1 img {
    width: 35.8585858586vw;
  }
}
@media screen and (max-width: 1366px) {
  .kv_paint1 img {
    width: 44.6559297218vw;
  }
}
@media screen and (max-width: 480px) {
  .kv_paint1 img {
    width: 62.5vw;
  }
}

.kv_paint2 {
  right: 0;
  z-index: 5;
}
.kv_paint2 img {
  width: 74rem;
}
@media screen and (min-width: 1367px) {
  .kv_paint2 img {
    width: 40.9090909091vw;
  }
}
@media screen and (max-width: 1366px) {
  .kv_paint2 img {
    width: 54.1727672035vw;
  }
}

.kv_item {
  opacity: 0;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 5;
  max-width: 43%;
  width: 100%;
}
@media screen and (min-width: 1367px) {
  .kv_item {
    min-width: 712px;
  }
}
@media screen and (max-width: 1366px) {
  .kv_item {
    min-width: 622px;
  }
}
@media screen and (max-width: 1100px) {
  .kv_item {
    min-width: 636px;
    max-width: 78%;
  }
}
@media screen and (max-width: 767px) {
  .kv_item {
    min-width: auto;
    max-width: 100%;
  }
}
@media screen and (max-width: 480px) {
  .kv_item {
    max-width: 100%;
    min-width: auto;
    bottom: 41px;
  }
}
.kv_item figure {
  margin: 0;
}
.kv_item figure picture {
  display: block;
}
@media screen and (max-width: 1100px) {
  .kv_item figure picture {
    text-align: center;
  }
}
.kv_item figure picture img {
  width: 100%;
}
@media screen and (max-width: 1100px) {
  .kv_item figure picture img {
    max-width: 80%;
    min-width: 470px;
  }
}
@media screen and (max-width: 1100px) {
  .kv_item figure picture img {
    max-width: 69%;
    min-width: 470px;
  }
}
@media screen and (max-width: 480px) {
  .kv_item figure picture img {
    max-width: 82%;
    min-width: auto;
  }
}

.kv_title {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
}
@media screen and (max-width: 1100px) {
  .kv_title {
    top: -19%;
  }
}
.kv_title h1 {
  opacity: 0;
  position: relative;
  z-index: 6;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60%;
}
@media screen and (max-width: 1100px) {
  .kv_title h1 {
    width: 100%;
    justify-content: end;
  }
}
@media screen and (max-width: 767px) {
  .kv_title h1 {
    justify-content: center;
  }
}
.kv_title h1 span {
  display: none;
}
.kv_title h1 img {
  width: 91%;
}
@media screen and (max-width: 1100px) {
  .kv_title h1 img {
    width: 70%;
  }
}
@media screen and (max-width: 767px) {
  .kv_title h1 img {
    width: 89%;
  }
}
.kv_title::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  translate: 0 -50%;
  background-color: #fff;
  opacity: 0.6;
  height: 22rem;
  z-index: 4;
}

main {
  overflow: hidden;
}

.sec_1 {
  background-color: #fff;
  position: relative;
  z-index: 7;
}
.sec_1::before {
  content: "";
  position: absolute;
  top: -18rem;
  height: 30rem;
  width: 104%;
  left: -2%;
  background-color: #fff;
  border-radius: 50%;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .sec_1::before {
    top: -7rem;
    height: 25rem;
  }
}
@media screen and (max-width: 480px) {
  .sec_1::before {
    top: -7rem;
  }
}
.sec_1::after {
  content: "";
  position: absolute;
  bottom: -11rem;
  height: 30rem;
  width: 104%;
  left: -2%;
  background-color: #fff;
  border-radius: 50%;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .sec_1::after {
    bottom: -7rem;
    height: 15rem;
  }
}
@media screen and (max-width: 480px) {
  .sec_1::after {
    bottom: -4rem;
    height: 10rem;
  }
}

.app_band_sec .top_appDl {
  background: #fff;
}

.top_appDl {
  position: absolute;
  top: -30rem;
  left: 50%;
  translate: -50% 0;
  padding: 3rem 3rem;
  border: 1px solid #212D10;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.8);
}
@media screen and (max-width: 1100px) {
  .top_appDl {
    width: 80%;
    top: -28rem;
    padding: 3rem 2rem;
  }
}
@media screen and (max-width: 767px) {
  .top_appDl {
    padding: 1.6rem 1.6rem;
    width: 90%;
    top: -12rem;
  }
}
@media screen and (max-width: 480px) {
  .top_appDl {
    top: -12rem;
  }
}

.top_appDl_inner {
  display: flex;
}
@media screen and (max-width: 767px) {
  .top_appDl_inner {
    flex-direction: column;
    align-items: center;
  }
}

.top_appDl_icon {
  width: 20%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .top_appDl_icon {
    width: 15%;
  }
}
@media screen and (max-width: 480px) {
  .top_appDl_icon {
    width: 25%;
  }
}
@media screen and (max-width: 1100px) {
  .top_appDl_icon img {
    width: 100%;
  }
}

.top_appDl_detail {
  width: 80%;
  padding-left: 2rem;
}
@media screen and (max-width: 767px) {
  .top_appDl_detail {
    width: 100%;
    padding-left: 0;
  }
}
.top_appDl_detail span {
  display: block;
  font-size: 1.6rem;
  margin-bottom: 1.6rem;
}
@media screen and (max-width: 767px) {
  .top_appDl_detail span {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 2.0860495437vw;
  }
}
@media screen and (max-width: 480px) {
  .top_appDl_detail span {
    font-size: 3.3333333333vw;
  }
}

.top_appDl_detail_title {
  font-size: 2.6rem;
  margin-bottom: 1.4rem;
  margin-top: 1rem;
}
@media screen and (max-width: 767px) {
  .top_appDl_detail_title {
    line-height: 3rem;
    text-align: center;
    font-size: 3.3898305085vw;
    margin-bottom: 1rem;
  }
}
@media screen and (max-width: 480px) {
  .top_appDl_detail_title {
    font-size: 4.1666666667vw;
  }
}

.top_appDl_Qr {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 480px) {
  .top_appDl_Qr {
    flex-direction: column;
  }
}

.top_appDl_Qr_inner {
  width: 47%;
  display: flex;
  justify-content: space-between;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .top_appDl_Qr_inner {
    margin-bottom: 1rem;
  }
}
@media screen and (max-width: 480px) {
  .top_appDl_Qr_inner {
    width: 100%;
  }
}

.qr_img {
  width: 35%;
}
@media screen and (max-width: 480px) {
  .qr_img {
    width: 26%;
  }
}
.qr_img img {
  width: 100%;
  object-fit: cover;
  height: 100%;
}

.app_btns {
  width: 63%;
}
@media screen and (max-width: 1100px) {
  .app_btns {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
}
@media screen and (max-width: 480px) {
  .app_btns {
    width: 71%;
  }
}
.app_btns p {
  font-size: 2.2rem;
  margin-top: 0.7rem;
  margin-bottom: 0.7rem;
}
@media screen and (max-width: 480px) {
  .app_btns p {
    font-size: 2rem;
  }
}
.app_btns .top_app_btn a {
  display: flex;
  max-height: 4.5rem;
  flex-direction: column;
  justify-content: end;
}
.app_btns .top_app_btn a:hover {
  opacity: 0.8;
}
.app_btns .top_app_btn a img {
  width: 92%;
}
@media screen and (max-width: 480px) {
  .app_btns .top_app_btn a img {
    width: 84%;
  }
}
.app_btns .top_app_btn a .gp_d_btn {
  width: 83%;
}
@media screen and (max-width: 1100px) {
  .app_btns .top_app_btn a .gp_d_btn {
    width: 79%;
  }
}
@media screen and (max-width: 480px) {
  .app_btns .top_app_btn a .gp_d_btn {
    width: 70%;
  }
}

.app_description {
  display: block;
  font-size: 1.2rem;
  line-height: 2.4rem;
}
@media screen and (max-width: 480px) {
  .app_description {
    font-size: 2.9166666667vw;
    line-height: 5vw;
  }
}

.sec_1 h2 {
  text-align: center;
}
.sec_1 h2 .sub_txt {
  padding-top: 4rem;
  display: block;
  font-weight: 500;
  font-size: 2.8rem;
  margin-bottom: 2.4rem;
}
@media screen and (max-width: 767px) {
  .sec_1 h2 .sub_txt {
    padding-top: 24rem;
    font-size: 2.2rem;
    line-height: 4rem;
  }
}
@media screen and (max-width: 480px) {
  .sec_1 h2 .sub_txt {
    padding-top: 33rem;
    font-size: 1.8rem;
    line-height: 3rem;
    margin-bottom: 1rem;
    font-size: 4.5833333333vw;
  }
}
.sec_1 h2 .main_txt {
  font-size: 3.6rem;
  margin-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .sec_1 h2 .main_txt {
    font-size: 2.8rem;
    line-height: 5rem;
  }
}
@media screen and (max-width: 480px) {
  .sec_1 h2 .main_txt {
    font-size: 2.4rem;
    line-height: 4rem;
    font-size: 5.4166666667vw;
  }
}

.sec_description {
  font-size: 1.6rem;
  line-height: 3.4rem;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .sec_description {
    font-size: 1.6rem;
    text-align: left;
  }
}

.youtube a {
  cursor: pointer;
  text-decoration: none;
  z-index: 6;
  overflow: hidden;
  display: block;
  padding: 8rem 0;
  position: relative;
  background: rgba(0, 0, 0, 0.4);
  transition: 0.2s;
}
.youtube a:hover {
  background: rgba(0, 0, 0, 0.5);
}
.youtube a:hover::before {
  content: "";
  backdrop-filter: blur(16px);
}
.youtube a:hover .mov_icon {
  transform: scale(1.1);
}
.youtube a::before {
  content: "";
  background: inherit;
  backdrop-filter: blur(12px);
  position: absolute;
  top: -5px;
  left: -5px;
  right: -5px;
  bottom: -5px;
  z-index: -1;
}

.mov_inner {
  margin: 0 auto;
  padding: 13rem 0;
  max-width: 1100px;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .mov_inner {
    padding: 5rem 0;
  }
}
@media screen and (max-width: 480px) {
  .mov_inner {
    flex-direction: column;
    padding: 0 1.4rem;
  }
}

.mov_text {
  display: flex;
  justify-content: center;
  color: #fff;
  font-size: 3.2rem;
  width: 40%;
  line-height: 5rem;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 1100px) {
  .mov_text {
    font-size: 2.9090909091vw;
    line-height: 4.5454545455vw;
  }
}
@media screen and (max-width: 480px) {
  .mov_text {
    width: 100%;
    font-size: 4.5833333333vw;
    text-align: center;
    line-height: 3rem;
  }
}

.mov_icon {
  display: flex;
  justify-content: center;
  width: 20%;
  padding: 3rem 0;
  transition: 0.2s;
}
@media screen and (max-width: 480px) {
  .mov_icon {
    width: 100%;
  }
}
.mov_icon img {
  width: 90%;
}
@media screen and (max-width: 480px) {
  .mov_icon img {
    width: 30%;
  }
}

.sec_3 {
  background-color: #fff;
  position: relative;
  z-index: 7;
}
.sec_3::before {
  content: "";
  position: absolute;
  top: -11rem;
  height: 30rem;
  width: 104%;
  left: -2%;
  background-color: #fff;
  border-radius: 50%;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .sec_3::before {
    top: -7rem;
    height: 15rem;
  }
}
@media screen and (max-width: 480px) {
  .sec_3::before {
    top: -4rem;
    height: 10rem;
  }
}
.sec_3 .sec_inner {
  padding-top: 3rem;
}

.cont_num_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
}

.cont_title_wrap {
  position: relative;
}
.cont_title_wrap::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  z-index: -1;
}

.cont_title_01::before {
  background: url(../img/paint01.svg);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 430px;
}

.cont_title_02::before {
  background: url(../img/paint02.svg);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 489px;
}

.cont_title_03::before {
  background: url(../img/paint03.svg);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 310px;
}

.cont_title_04::before {
  background: url(../img/paint04.svg);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 390px;
}

.cont_title_05::before {
  background: url(../img/paint05.svg);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 310px;
  top: 25% !important;
}

.cont_num {
  height: 120px;
  width: 120px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .cont_num {
    height: 120px;
    width: 120px;
  }
}
@media screen and (max-width: 480px) {
  .cont_num {
    height: 90px;
    width: 90px;
  }
}
.cont_num span {
  font-size: 9rem;
  color: #fff;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 900;
}
@media screen and (max-width: 767px) {
  .cont_num span {
    font-size: 7rem;
  }
}
@media screen and (max-width: 480px) {
  .cont_num span {
    font-size: 5rem;
  }
}

.explanation_list ul li {
  margin-bottom: 8rem;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .explanation_list ul li {
    flex-direction: column;
  }
}
@media screen and (max-width: 480px) {
  .explanation_list ul li {
    margin-bottom: 4rem;
  }
}

.explanation_list_inner_l {
  width: 40%;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .explanation_list_inner_l {
    order: 1;
    width: 100%;
    text-align: center;
  }
}
.explanation_list_inner_l > img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .explanation_list_inner_l > img {
    width: 60%;
  }
}
@media screen and (max-width: 480px) {
  .explanation_list_inner_l > img {
    width: 90%;
  }
}

.explanation_list_inner_r {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 50%;
}
@media screen and (max-width: 767px) {
  .explanation_list_inner_r {
    order: 0;
    width: 100%;
  }
}
.explanation_list_inner_r p {
  font-size: 2.8rem;
  line-height: 4.6rem;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .explanation_list_inner_r p {
    font-size: 3.9113428944vw;
    line-height: 5.9973924381vw;
  }
}
@media screen and (max-width: 480px) {
  .explanation_list_inner_r p {
    font-size: 5vw;
    line-height: 8.3333333333vw;
  }
}
.explanation_list_inner_r > span {
  font-size: 1.4rem;
  line-height: 3rem;
}
@media screen and (max-width: 767px) {
  .explanation_list_inner_r > span {
    font-size: 2.0860495437vw;
    line-height: 1.8em;
    margin-bottom: 4rem;
  }
}
@media screen and (max-width: 480px) {
  .explanation_list_inner_r > span {
    font-size: 3.3333333333vw;
    margin-bottom: 2rem;
  }
}
.explanation_list_inner_r .normal_txt {
  font-size: 1.6rem;
  line-height: 3rem;
}
@media screen and (max-width: 767px) {
  .explanation_list_inner_r .normal_txt {
    font-size: 2.3468057366vw;
    line-height: 1.8em;
    margin-bottom: 4rem;
  }
}
@media screen and (max-width: 480px) {
  .explanation_list_inner_r .normal_txt {
    font-size: 3.75vw;
    line-height: 1.8em;
    margin-bottom: 2rem;
  }
}

.circle_txt {
  margin-bottom: 2rem;
  width: 150px;
  height: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
}
@media screen and (max-width: 767px) {
  .circle_txt {
    margin-bottom: 4rem;
    width: 120px;
    height: 120px;
  }
}
@media screen and (max-width: 480px) {
  .circle_txt {
    width: 100px;
    height: 100px;
  }
}
.circle_txt > span {
  color: #fff;
  text-align: center;
  font-size: 2.3rem;
  line-height: 3rem;
}
@media screen and (max-width: 767px) {
  .circle_txt > span {
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
@media screen and (max-width: 480px) {
  .circle_txt > span {
    font-size: 1.4rem;
    line-height: 1.4em;
  }
}

.explanation_list_dl {
  border: 1px solid #000000;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
}
@media screen and (max-width: 767px) {
  .explanation_list_dl {
    width: 80%;
    margin: 0 auto;
  }
}
@media screen and (max-width: 480px) {
  .explanation_list_dl {
    width: 100%;
    margin: 0 auto;
  }
}
.explanation_list_dl .dl_title {
  font-size: 2rem;
  margin-bottom: 1.2rem;
}
@media screen and (max-width: 480px) {
  .explanation_list_dl .dl_title {
    font-size: 4.1666666667vw;
  }
}
.explanation_list_dl > span {
  font-size: 1.4rem;
  margin-bottom: 3rem;
}
@media screen and (max-width: 480px) {
  .explanation_list_dl > span {
    font-size: 2.9166666667vw;
  }
}

.explanation_list_dl_inner {
  display: flex;
  justify-content: space-between;
}

.explanation_list_dl_icon {
  display: flex;
  width: 35%;
}
.explanation_list_dl_icon img {
  width: 100%;
}

.explanation_list_dl_btns {
  width: 60%;
}

.explanation_list_dl_btns__inner {
  display: flex;
  justify-content: space-between;
}

.explanation_list_dl_qr {
  width: 35%;
}
.explanation_list_dl_qr img {
  width: 100%;
}

.explanation_list_dl_btn {
  width: 60%;
  display: flex;
  flex-direction: column;
}
.explanation_list_dl_btn p {
  font-size: 2rem;
  margin-bottom: 1rem;
  text-align: left;
}
@media screen and (max-width: 480px) {
  .explanation_list_dl_btn p {
    font-size: 4.1666666667vw;
  }
}
.explanation_list_dl_btn .app_btn {
  display: flex;
}
.explanation_list_dl_btn .app_btn .ios_d_btn {
  width: 99%;
}
.explanation_list_dl_btn .app_btn .gp_d_btn {
  width: 86%;
}

.cont_title_sub {
  font-size: 1.6rem;
  text-align: center;
  display: block;
  line-height: 1.8em;
}

.app_explanation_li {
  display: flex;
}
@media screen and (max-width: 767px) {
  .app_explanation_li {
    flex-direction: column;
  }
}

.app_explanation_li1,
.app_explanation_li2 {
  width: 50%;
  padding: 0 1.6rem;
}
@media screen and (max-width: 767px) {
  .app_explanation_li1,
  .app_explanation_li2 {
    width: 100%;
  }
}
@media screen and (max-width: 480px) {
  .app_explanation_li1,
  .app_explanation_li2 {
    padding: 0;
  }
}

.app_explanation_li1 {
  border-right: 1px solid #EA9F0A;
}
@media screen and (max-width: 767px) {
  .app_explanation_li1 {
    border-right: 0px;
  }
}

.app_exp_inner_titleWrap {
  margin-bottom: 10rem;
}
@media screen and (max-width: 480px) {
  .app_exp_inner_titleWrap {
    margin-bottom: 6rem;
  }
}

.app_exp_inner_title {
  display: flex;
}
.app_exp_inner_title > span {
  padding: 0.3rem;
  font-weight: 300;
  font-size: 2.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #000;
  width: 20%;
  background-color: #F7D99D;
}
@media screen and (max-width: 480px) {
  .app_exp_inner_title > span {
    font-size: 1.6rem;
  }
}
.app_exp_inner_title > p {
  padding: 1.4rem 0.3rem;
  width: 80%;
  color: #fff;
  font-size: 2.8rem;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 1100px) {
  .app_exp_inner_title > p {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 480px) {
  .app_exp_inner_title > p {
    font-size: 2rem;
  }
}

.app_exp_inner_02wrap {
  position: relative;
  min-height: 338px;
  margin-bottom: 5rem;
  padding: 1rem;
}
@media screen and (max-width: 767px) {
  .app_exp_inner_02wrap {
    padding: 0;
    margin-bottom: 0;
  }
}

.app_exp_inner_02item {
  display: flex;
}
@media screen and (max-width: 767px) {
  .app_exp_inner_02item {
    margin-bottom: 4rem;
  }
}
.app_exp_inner_02item:nth-child(2) {
  position: absolute;
  top: 23%;
  width: 69%;
  left: 31%;
}
@media screen and (max-width: 767px) {
  .app_exp_inner_02item:nth-child(2) {
    position: static;
    width: 100%;
  }
}
.app_exp_inner_02item:nth-child(3) {
  position: absolute;
  top: 33%;
  width: 70%;
  left: 30%;
}
@media screen and (max-width: 767px) {
  .app_exp_inner_02item:nth-child(3) {
    position: static;
    width: 100%;
    margin-bottom: 0;
  }
}

.app_exp_inner_02item__img {
  width: 170px;
}
@media screen and (max-width: 767px) {
  .app_exp_inner_02item__img {
    width: 37%;
    display: block;
  }
}
.app_exp_inner_02item__img img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .app_exp_inner_02item__img img {
    width: 100%;
  }
}

.app_exp_inner_02item__txt {
  width: calc(100% - 170px);
  font-size: 1.6rem;
  padding: 1.2rem;
  line-height: 1.8em;
}
@media screen and (max-width: 1100px) {
  .app_exp_inner_02item__txt {
    font-size: 1.4rem;
  }
}
@media screen and (max-width: 767px) {
  .app_exp_inner_02item__txt {
    width: 63%;
    font-size: 1.6rem;
  }
}

@media screen and (max-width: 767px) {
  .app_exp_inner_wifi {
    margin-top: 6rem;
    flex-direction: column !important;
  }
}
.app_exp_inner_wifi .app_exp_inner_03item__img {
  width: 91%;
}
@media screen and (max-width: 767px) {
  .app_exp_inner_wifi .app_exp_inner_03item__img {
    width: 100%;
    text-align: center;
  }
}
@media screen and (max-width: 767px) {
  .app_exp_inner_wifi .app_exp_inner_03item__img img {
    width: 59%;
  }
}
@media screen and (max-width: 767px) {
  .app_exp_inner_wifi .app_exp_inner_03item__txt {
    width: 100%;
    text-align: center;
  }
}

.app_exp_inner_03wrap {
  display: flex;
  min-height: 350px;
  max-height: 350px;
  padding: 1rem;
}
@media screen and (max-width: 767px) {
  .app_exp_inner_03wrap {
    min-height: auto;
    max-height: none;
    margin-bottom: 4rem;
    padding: 0;
  }
}

.app_exp_inner_03item__img {
  width: 37%;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .app_exp_inner_03item__img {
    display: block;
  }
}
.app_exp_inner_03item__img img {
  width: 100%;
}
.app_exp_inner_03item__img .sec04_sp05 {
  width: 100%;
}

.app_exp_inner_03item__txt {
  width: 63%;
  display: flex;
  padding: 1.2rem;
  justify-content: center;
  flex-direction: column;
}
@media screen and (max-width: 767px) {
  .app_exp_inner_03item__txt {
    justify-content: flex-start;
  }
}
.app_exp_inner_03item__txt p {
  font-size: 1.6rem;
  line-height: 1.8em;
  margin-bottom: 1.4rem;
}
.app_exp_inner_03item__txt p span {
  font-size: 1.6rem;
}
.app_exp_inner_03item__txt > span {
  line-height: 2rem;
  font-size: 1.4rem;
}

.sec_5 {
  padding-bottom: 12rem;
}
@media screen and (max-width: 767px) {
  .sec_5 {
    padding-bottom: 6rem;
  }
}

.sec5_caution {
  text-align: right;
  margin-top: 2.6em;
  font-size: 1.4rem;
  line-height: 1.8em;
}
@media screen and (max-width: 767px) {
  .sec5_caution {
    text-align: left;
  }
}

.sec_7 {
  padding-bottom: 12rem;
}
@media screen and (max-width: 767px) {
  .sec_7 {
    padding-bottom: 6rem;
  }
}

.measurement_grid {
  display: grid;
  grid: "img1 txt1 txt1 txt1 txt1" 150px "img1 img2 txt2 txt2 txt2" 150px "any1 img2 img3 txt3 txt3" 150px "any1 any2 img3 img4 txt4" 150px "any1 any2 any3 img4 txt4" 150px/20% 20% 20% 20% 20%;
  grid-row-gap: 0;
}
@media screen and (max-width: 767px) {
  .measurement_grid {
    grid: "img1 txt1 txt1 txt1" 1fr "img1 txt1 txt1 txt1" 1fr "img2 txt2 txt2 txt2" 1fr "img2 txt2 txt2 txt2" 1fr "img3 txt3 txt3 txt3" 1fr "img3 txt3 txt3 txt3" 1fr "img4 txt4 txt4 txt4" 1fr "img4 txt4 txt4 txt4" 1fr/1.8fr 1fr 1fr 1fr;
    grid-row-gap: 4rem;
  }
}

.measurement_img01,
.measurement_img02,
.measurement_img03,
.measurement_img04 {
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .measurement_img01,
  .measurement_img02,
  .measurement_img03,
  .measurement_img04 {
    display: block;
    text-align: center;
  }
}
@media screen and (max-width: 767px) {
  .measurement_img01 img,
  .measurement_img02 img,
  .measurement_img03 img,
  .measurement_img04 img {
    width: 90%;
  }
}
@media screen and (max-width: 480px) {
  .measurement_img01 img,
  .measurement_img02 img,
  .measurement_img03 img,
  .measurement_img04 img {
    width: 100%;
  }
}

.measurement_img01 {
  position: relative;
  z-index: 1;
}

.measurement_txt01,
.measurement_txt02,
.measurement_txt03,
.measurement_txt04 {
  padding: 1rem;
}
.measurement_txt01 .border_txt,
.measurement_txt02 .border_txt,
.measurement_txt03 .border_txt,
.measurement_txt04 .border_txt {
  position: relative;
  display: inline-block;
  font-size: 2.8rem;
  padding-bottom: 0.3rem;
  line-height: 1.4em;
}
@media screen and (max-width: 767px) {
  .measurement_txt01 .border_txt,
  .measurement_txt02 .border_txt,
  .measurement_txt03 .border_txt,
  .measurement_txt04 .border_txt {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 480px) {
  .measurement_txt01 .border_txt,
  .measurement_txt02 .border_txt,
  .measurement_txt03 .border_txt,
  .measurement_txt04 .border_txt {
    font-size: 1.8rem;
  }
}
.measurement_txt01 .border_txt::before,
.measurement_txt02 .border_txt::before,
.measurement_txt03 .border_txt::before,
.measurement_txt04 .border_txt::before {
  content: "";
  position: absolute;
  width: calc(100% + 50px);
  height: 2px;
  bottom: 0;
  right: 0;
  background-color: #14A83A;
  z-index: -1;
}
.measurement_txt01 .border_txt span,
.measurement_txt02 .border_txt span,
.measurement_txt03 .border_txt span,
.measurement_txt04 .border_txt span {
  color: #14A83A;
  font-size: 2.8rem;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .measurement_txt01 .border_txt span,
  .measurement_txt02 .border_txt span,
  .measurement_txt03 .border_txt span,
  .measurement_txt04 .border_txt span {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 480px) {
  .measurement_txt01 .border_txt span,
  .measurement_txt02 .border_txt span,
  .measurement_txt03 .border_txt span,
  .measurement_txt04 .border_txt span {
    font-size: 1.8rem;
  }
}
.measurement_txt01 p,
.measurement_txt02 p,
.measurement_txt03 p,
.measurement_txt04 p {
  font-size: 1.6rem;
  line-height: 1.6em;
  margin-top: 1rem;
}
@media screen and (max-width: 480px) {
  .measurement_txt01 p,
  .measurement_txt02 p,
  .measurement_txt03 p,
  .measurement_txt04 p {
    font-size: 1.4rem;
  }
}

.measurement_txt04 p {
  font-size: 1.8rem;
}

.measurement_img01 {
  grid-area: img1;
}

.measurement_txt01 {
  grid-area: txt1;
}

.measurement_img02 {
  grid-area: img2;
}

.measurement_txt02 {
  grid-area: txt2;
}

.measurement_img03 {
  grid-area: img3;
}

.measurement_txt03 {
  grid-area: txt3;
}

.measurement_img04 {
  grid-area: img4;
}

.measurement_txt04 {
  grid-area: txt4;
}

.wifi_speed_wrap h4 {
  font-size: 3.4rem;
  text-align: center;
  line-height: 1.6em;
  margin-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .wifi_speed_wrap h4 {
    font-size: 2.4rem;
    margin-bottom: 4rem;
  }
}
@media screen and (max-width: 480px) {
  .wifi_speed_wrap h4 {
    font-size: 1.8rem;
    font-size: 4.5833333333vw;
  }
}

.wifi_speed_wrap_detail > p {
  text-align: center;
  font-size: 2.8rem;
  margin-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .wifi_speed_wrap_detail > p {
    font-size: 2.2rem;
  }
}
@media screen and (max-width: 480px) {
  .wifi_speed_wrap_detail > p {
    font-size: 4.5833333333vw;
  }
}

.wifi_speed_wrap_li {
  display: flex;
  flex-wrap: wrap;
}
.wifi_speed_wrap_li li {
  position: relative;
  width: 25%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .wifi_speed_wrap_li li {
    width: 33%;
    margin-bottom: 7rem;
  }
}
@media screen and (max-width: 480px) {
  .wifi_speed_wrap_li li {
    width: 50%;
    margin-bottom: 7rem;
  }
}
.wifi_speed_wrap_li li::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  height: 170px;
  width: 170px;
  border: 1px solid #A1DCB0;
  border-radius: 50%;
}
@media screen and (max-width: 767px) {
  .wifi_speed_wrap_li li::before {
    height: 150px;
    width: 150px;
  }
}

.wifi_speed_cate__img {
  margin-bottom: 1rem;
  text-align: center;
}
.wifi_speed_cate__img img {
  width: 80%;
}
@media screen and (max-width: 767px) {
  .wifi_speed_cate__img img {
    width: 60%;
  }
}

.wifi_speed_cate__title {
  font-size: 1.4rem;
  color: #14A83A;
  font-weight: bold;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .wifi_speed_cate__title {
    font-size: 1.2rem;
  }
}

.wifi_speed_cate__detail {
  font-size: 1.4rem;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .wifi_speed_cate__detail {
    font-size: 1.2rem;
  }
}
.wifi_speed_cate__detail span {
  font-size: 1.8rem;
}

.sec_7 {
  position: relative;
}
.sec_7 svg {
  height: 228px;
}
@media screen and (max-width: 767px) {
  .sec_7 svg {
    height: 180px;
  }
}
@media screen and (max-width: 480px) {
  .sec_7 svg {
    height: 100%;
  }
}
.sec_7 .my-text {
  font-size: 7rem;
}
@media screen and (max-width: 480px) {
  .sec_7 .my-text {
    font-size: 4.1rem;
  }
}
.sec_7 .cont_title_sub {
  margin-top: 2rem;
}

.other_sec {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .other_sec {
    flex-direction: column;
  }
}

.other_sec_item {
  width: 32%;
  display: flex;
}
@media screen and (max-width: 767px) {
  .other_sec_item {
    width: 100%;
    margin-bottom: 4rem;
  }
}

.other_sec_item__img {
  cursor: zoom-in;
  width: 40%;
}
.other_sec_item__img img {
  width: 100%;
  box-shadow: 1px 1px 8px -1px rgba(0, 0, 0, 0.3);
}
@media screen and (max-width: 767px) {
  .other_sec_item__img {
    width: 37%;
  }
}

.other_sec_item__txt {
  display: flex;
  flex-direction: column;
  width: 63%;
}
.other_sec_item__txt p {
  font-size: 2.4rem;
  padding: 2rem 1rem;
  position: relative;
  line-height: 1.6em;
}
@media screen and (max-width: 1100px) {
  .other_sec_item__txt p {
    font-size: 1.8rem;
    padding: 1rem 0.7rem;
  }
}
.other_sec_item__txt p::before {
  content: "";
  position: absolute;
  height: 1px;
  background-color: #666666;
  width: calc(100% + 20px);
  bottom: 0;
  right: 0;
  z-index: -1;
}
.other_sec_item__txt span {
  font-size: 1.4rem;
  line-height: 1.6em;
  padding: 1rem;
  display: inline-block;
}

.sec_8 {
  position: relative;
}
.sec_8_denpa{
  font-size: 1.6rem;
  color: #006DD9;
}
.sec_8::after {
  content: "";
  position: absolute;
  bottom: -11rem;
  height: 30rem;
  width: 104%;
  left: -2%;
  background-color: #fff;
  border-radius: 50%;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .sec_8::after {
    bottom: -7rem;
    height: 15rem;
  }
}
@media screen and (max-width: 480px) {
  .sec_8::after {
    bottom: -4rem;
    height: 10rem;
  }
}
.sec_8 .my-text {
  font-size: 10rem;
}
@media screen and (max-width: 767px) {
  .sec_8 .my-text {
    font-size: 8rem;
  }
}
@media screen and (max-width: 480px) {
  .sec_8 .my-text {
    font-size: 7rem;
  }
}

.sec_8contsub {
  text-align: center;
  display: block;
  font-weight: 500;
  font-size: 2.8rem;
  margin-bottom: 2.4rem;
  line-height: 1.6em;
}
@media screen and (max-width: 767px) {
  .sec_8contsub {
    font-size: 3.6505867014vw;
    line-height: 1.6em;
  }
}
@media screen and (max-width: 480px) {
  .sec_8contsub {
    font-size: 1.8rem;
    line-height: 1.6em;
    margin-bottom: 1rem;
    font-size: 4.5833333333vw;
    text-align: left;
  }
}

.test_iphone16{
  border-radius: 5px;
  padding: 3.2rem;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
}
@media screen and (max-width: 480px) {
  .test_iphone16{
    padding: 2.4rem 1.6rem;
  }  
}

.test_iphone16 .cont_title_sub_s{
  line-height: 2em;
}

.test_iphone16 .finish_img_inner{
  text-align: center;
  margin-left: 16px;
}

.finish_img_span_inner{
  font-weight: bold;
  font-size: 1.6rem;
}

.test_iphone16 .finish_img_inner .finish_img_span{
  text-align: center;
}

.test_iphone16 .finish_img_inner img{
  width: auto;
}

.test_iphone16_table{
  font-size: 5rem;
  width: 100%;
  border-collapse:collapse;
}

.test_iphone16_img img{
  width: 100%;
}

.test_iphone16_table th,td{
  padding: 20px;
  box-sizing: border-box;
  line-height: 1.3;
}

.test_iphone16_table th{
  border: 1px solid #DDD;
  background: #B7DDFF;
  padding: 20px;
  text-align: center;
  font-size: 1.6rem;
  line-height: 1.5em;
}
.test_iphone16_table th span{
  font-weight: normal;
}
@media screen and (max-width: 480px) {
  .test_iphone16_table th{
    padding: 10px;
    vertical-align: middle;
    font-size: 1.2rem;
  }  
}
.test_iphone16_table_img img{
  width: 30%;
}
@media screen and (max-width: 480px) {
  .test_iphone16_table_img img{
    width: 42%;
  }  
}
.test_iphone16_table_th_l{
  width: 30%;
  vertical-align: middle;
}
@media screen and (max-width: 480px) {
  .test_iphone16_table_th_l{
    width: auto;
  }  
}
.test_iphone16_table_th{
  width: 35%;
  line-height: 1.5em;
}
@media screen and (max-width: 480px) {
  .test_iphone16_table_th{
    width: auto;
  }  
}

.test_iphone16_table td{
  border: 1px solid #DDD;
  padding: 20px;
  text-align: center;
  vertical-align: middle;
  font-size: 1.6rem;
}
@media screen and (max-width: 480px) {
  .test_iphone16_table td{
    padding: 10px;
    font-size: 1.2rem;
  }  
}

.test_iphone16_table td span{
  color: #EA9F0A;
  font-size: 3.8rem;
  font-weight: bold;
}
@media screen and (max-width: 480px) {
  .test_iphone16_table td span{
    font-size: 2rem;
  }  
}

.alert_inner{
  padding-left: 1em;
  position: relative;
  font-size: 1.4rem;
}
.alert_inner::after{
  content: '＊';
  position: absolute;
  top: 0;
  left: 0;
}
.alert_inner3{
  padding-left: 1em;
  position: relative;
  font-size: 1.4rem;
}
.alert_inner3::after{
  content: '※';
  position: absolute;
  top: 0;
  left: 0;
}
.alert_inner2{
  padding-left: 1em;
  position: relative;
}
.alert_inner2::after{
  content: '★';
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (max-width: 480px) {
  .alert_inner{
    font-size: 1.2rem;
  }  
}

.finish_img {
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 480px) {
  .finish_img {
    flex-direction: column;
  }
}

.cont_title_sub_s {
  width: 75%;
  font-size: 1.6rem;
  display: block;
  line-height: 2.7em;
}
@media screen and (max-width: 767px) {
  .cont_title_sub_s {
    font-size: 2.0860495437vw;
  }
}
@media screen and (max-width: 480px) {
  .cont_title_sub_s {
    font-size: 1.4rem;
    width: 100%;
    margin-bottom: 2em;
  }
}

.finish_img_span {
  display: block;
  text-align: right;
  margin-top: 1em;
  font-size: 1.4rem;
  text-align: right;
  width: 100%;
}

.finish_img_inner {
  width: 25%;
}
@media screen and (max-width: 480px) {
  .finish_img_inner {
    width: 80%;
  }
}
.finish_img_inner img {
  width: 100%;
}

.app_band_inner {
  margin: 0 auto;
  padding: 37rem 0 13rem;
  max-width: 1100px;
  position: relative;
  z-index: 10;
}
@media screen and (max-width: 767px) {
  .app_band_inner {
    padding: 43rem 0 13rem;
  }
}
@media screen and (max-width: 480px) {
  .app_band_inner {
    padding: 26rem 0 16rem;
  }
}
.app_band_inner .top_appDl {
  width: 60%;
  top: auto;
  z-index: 10;
  left: 0;
  translate: 0 0;
  bottom: 0;
}
@media screen and (max-width: 1100px) {
  .app_band_inner .top_appDl {
    margin-left: 1.6rem;
    padding: 2rem 1rem;
  }
}
@media screen and (max-width: 767px) {
  .app_band_inner .top_appDl {
    left: 50%;
    translate: -50% 0;
    width: calc(100% - 3.2rem);
    margin-left: 0;
    padding: 1rem 1rem;
  }
}
@media screen and (max-width: 480px) {
  .app_band_inner .top_appDl {
    bottom: -10px;
  }
}
@media screen and (max-width: 1100px) {
  .app_band_inner .top_appDl_detail_title {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 767px) {
  .app_band_inner .top_appDl_detail_title {
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 480px) {
  .app_band_inner .top_appDl_detail_title {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 480px) {
  .app_band_inner .top_appDl_icon {
    width: 16%;
  }
}
@media screen and (max-width: 480px) {
  .app_band_inner .top_appDl_detail {
    padding-left: 0 !important;
  }
}
@media screen and (max-width: 767px) {
  .app_band_inner .top_appDl_detail span {
    font-size: 1.4rem;
    margin-bottom: 1.6rem;
  }
}
@media screen and (max-width: 480px) {
  .app_band_inner .top_appDl_detail span {
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 767px) {
  .app_band_inner .qr_img {
    width: 26%;
  }
}
@media screen and (max-width: 767px) {
  .app_band_inner .qr_img {
    width: 30%;
  }
}
@media screen and (max-width: 1100px) {
  .app_band_inner .qr_img img {
    object-fit: contain;
  }
}
@media screen and (max-width: 1100px) {
  .app_band_inner .app_description {
    line-height: 1.6em;
  }
}
.app_band_inner .top_appDl_Qr {
  flex-direction: row;
}
@media screen and (max-width: 1100px) {
  .app_band_inner .top_appDl_Qr_inner {
    width: 49%;
  }
}
@media screen and (max-width: 480px) {
  .app_band_inner .top_appDl_Qr_inner {
    width: 50%;
    justify-content: space-around;
  }
}
@media screen and (max-width: 480px) {
  .app_band_inner .app_btns {
    width: 70%;
    padding-left: 0.5rem;
  }
}
@media screen and (max-width: 480px) {
  .app_band_inner .app_btns p {
    font-size: 3.75vw;
  }
}
.app_band_inner .top_app_btn .gp_d_btn {
  width: 73%;
}
@media screen and (max-width: 1100px) {
  .app_band_inner .top_appDl_detail {
    padding-left: 1rem;
  }
}

.app_band_img {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 9;
}
@media screen and (max-width: 767px) {
  .app_band_img {
    width: 40%;
    right: auto;
    left: 50%;
    translate: -50% 0;
    top: auto;
    bottom: 200px;
  }
}
@media screen and (max-width: 767px) {
  .app_band_img img {
    width: 100%;
  }
}

.sec_9,
.sec_13 {
  background-color: #fff;
  position: relative;
  z-index: 7;
  padding-bottom: 5rem;
}
.sec_9::before,
.sec_13::before {
  content: "";
  position: absolute;
  top: -11rem;
  height: 30rem;
  width: 104%;
  left: -2%;
  background-color: #fff;
  border-radius: 50%;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .sec_9::before,
  .sec_13::before {
    top: -7rem;
    height: 15rem;
  }
}
@media screen and (max-width: 480px) {
  .sec_9::before,
  .sec_13::before {
    top: -4rem;
    height: 10rem;
  }
}
.sec_9 .sec_inner,
.sec_13 .sec_inner {
  padding-top: 12rem;
  padding-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .sec_9 .sec_inner,
  .sec_13 .sec_inner {
    padding-top: 8rem;
  }
}

.introduction_sub {
  padding-bottom: 3rem;
  width: 100%;
  text-align: center;
  font-size: 2.8rem;
  box-shadow: 0px 11px 14px -10px rgba(0, 0, 0, 0.3);
}
@media screen and (max-width: 767px) {
  .introduction_sub {
    font-size: 2.2rem;
  }
}
@media screen and (max-width: 480px) {
  .introduction_sub {
    font-size: 4.5833333333vw;
  }
}

.introduction_mesh,
.introduction_6e {
  display: flex;
}
@media screen and (max-width: 480px) {
  .introduction_mesh,
  .introduction_6e {
    flex-direction: column;
  }
}

.introduction_mesh_contL {
  width: 60%;
}
@media screen and (max-width: 480px) {
  .introduction_mesh_contL {
    width: 100%;
    order: 1;
  }
}
.introduction_mesh_contL p {
  font-size: 1.6rem;
  line-height: 1.8em;
  margin-bottom: 2.8rem;
}
@media screen and (max-width: 480px) {
  .introduction_mesh_contL p {
    font-size: 1.4rem;
  }
}

.introduction_mesh_contL_img > a {
  display: inline-block;
  max-width: 80%;
  margin-bottom: 1rem;
}
@media screen and (max-width: 480px) {
  .introduction_mesh_contL_img > a {
    max-width: 100%;
  }
}
.introduction_mesh_contL_img > a:hover {
  opacity: 0.8;
}
.introduction_mesh_contL_img > a img {
  width: 100%;
}
.introduction_mesh_contL_img span a {
  color: #006DD9;
  padding-bottom: 0.2rem;
  border-bottom: 1px solid #006DD9;
  display: inline-block;
  font-size: 1.2rem;
  text-decoration: none;
}
.introduction_mesh_contL_img span a:hover {
  opacity: 0.8;
}

.introduction_mesh_contR {
  text-align: right;
  width: 40%;
  padding-left: 2rem;
}
@media screen and (max-width: 480px) {
  .introduction_mesh_contR {
    width: 100%;
    padding-left: 0;
    text-align: center;
    margin-bottom: 2rem;
    order: 0;
  }
}
.introduction_mesh_contR img {
  width: 90%;
}

.introduction_6e_contR,
.introduction_6e_contL {
  width: 50%;
}
@media screen and (max-width: 480px) {
  .introduction_6e_contR,
  .introduction_6e_contL {
    width: 100%;
  }
}
.introduction_6e_contR h3,
.introduction_6e_contL h3 {
  font-size: 2.4rem;
  font-weight: normal;
  margin-bottom: 2.4rem;
}
@media screen and (max-width: 767px) {
  .introduction_6e_contR h3,
  .introduction_6e_contL h3 {
    font-size: 1.8rem;
  }
}
.introduction_6e_contR p,
.introduction_6e_contL p {
  font-size: 1.6rem;
  line-height: 1.8em;
}
@media screen and (max-width: 480px) {
  .introduction_6e_contR p,
  .introduction_6e_contL p {
    font-size: 1.4rem;
  }
}

.introduction_6e_contR {
  padding-right: 1rem;
}
@media screen and (max-width: 480px) {
  .introduction_6e_contR {
    padding-right: 0;
    margin-bottom: 2.8rem;
  }
}

.introduction_6e_contL {
  padding-left: 1rem;
}
@media screen and (max-width: 480px) {
  .introduction_6e_contL {
    padding-right: 0;
  }
}
.introduction_6e_contL p {
  margin-bottom: 1.8rem;
}

.introduction_6e_contL_img > a {
  display: inline-block;
  margin-bottom: 1rem;
}
.introduction_6e_contL_img > a:hover {
  opacity: 0.8;
}
.introduction_6e_contL_img > a img {
  width: 100%;
}
.introduction_6e_contL_img span a {
  color: #006DD9;
  padding-bottom: 0.2rem;
  border-bottom: 1px solid #006DD9;
  display: inline-block;
  font-size: 1.2rem;
  text-decoration: none;
}
.introduction_6e_contL_img span a:hover {
  opacity: 0.8;
}

.sec_11::after {
  content: "";
  position: absolute;
  bottom: -11rem;
  height: 30rem;
  width: 104%;
  left: -2%;
  background-color: #fff;
  border-radius: 50%;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .sec_11::after {
    bottom: -7rem;
    height: 15rem;
  }
}
@media screen and (max-width: 480px) {
  .sec_11::after {
    bottom: -4rem;
    height: 10rem;
  }
}

.introduction_out {
  font-weight: 600;
  line-height: 1.6em;
  padding: 8rem 2rem 3rem;
  width: 100%;
  text-align: center;
  font-size: 3.6rem;
  box-shadow: 0px -10px 14px -10px rgba(0, 0, 0, 0.3);
}
@media screen and (max-width: 767px) {
  .introduction_out {
    padding: 3rem 2rem 3rem;
    font-size: 4.1720990874vw;
    line-height: 1.8em;
  }
}
@media screen and (max-width: 480px) {
  .introduction_out {
    font-size: 2.4rem;
    line-height: 1.8em;
    font-size: 5.4166666667vw;
    text-align: left;
  }
}

.partner_weblink {
  padding: 5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #eee;
  flex-direction: column;
}
@media screen and (max-width: 767px) {
  .partner_weblink {
    padding: 4rem;
  }
}
@media screen and (max-width: 480px) {
  .partner_weblink {
    padding: 2rem;
  }
}
.partner_weblink > p {
  font-size: 2.4rem;
  line-height: 1.6em;
  margin-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .partner_weblink > p {
    margin-bottom: 4rem;
  }
}
@media screen and (max-width: 480px) {
  .partner_weblink > p {
    margin-bottom: 2rem;
    font-size: 1.8rem;
  }
}

.sec_13 {
  padding-bottom: 0;
}

.sec_14 .sec_inner {
  padding: 4rem 0;
}
@media screen and (max-width: 480px) {
  .sec_14 .sec_inner {
    padding: 2rem 0;
  }
}

.other_link {
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 1100px) {
  .other_link {
    padding: 0 1.6rem;
  }
}

.other_link__aterm,
.other_link__Partner {
  text-decoration: none;
  color: #000;
  transition: all 0.3s ease;
  width: 47%;
  display: flex;
  align-items: center;
  border: 1px solid #000;
  padding: 1.6rem 2rem;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
}
.other_link__aterm:hover,
.other_link__Partner:hover {
  background-color: #000;
  color: #fff;
}
.other_link__aterm:hover .atermlink_icon,
.other_link__Partner:hover .atermlink_icon {
  transition: all 0.4s ease;
  fill: #fff;
}
.other_link__aterm:hover .link_icon,
.other_link__Partner:hover .link_icon {
  border-color: #fff;
}
.other_link__aterm:hover .link_icon svg,
.other_link__Partner:hover .link_icon svg {
  fill: #fff;
}
@media screen and (max-width: 1100px) {
  .other_link__aterm,
  .other_link__Partner {
    width: 60%;
  }
}
@media screen and (max-width: 767px) {
  .other_link__aterm,
  .other_link__Partner {
    width: 70%;
  }
}
@media screen and (max-width: 480px) {
  .other_link__aterm,
  .other_link__Partner {
    width: 100%;
    padding: 1.4rem 1.6rem;
  }
}

.link_icon {
  width: 40px;
  height: 40px;
  border: 1px solid #000;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 1100px) {
  .link_icon {
    max-width: 30px;
    max-height: 30px;
  }
}
@media screen and (max-width: 767px) {
  .link_icon {
    width: 40px;
    height: 40px;
  }
}
@media screen and (max-width: 480px) {
  .link_icon {
    width: 24px;
    height: 24px;
  }
}
.link_icon svg {
  max-width: 25px;
}
@media screen and (max-width: 1100px) {
  .link_icon svg {
    max-width: 10px;
  }
}
@media screen and (max-width: 480px) {
  .link_icon svg {
    max-width: 6px;
  }
}

.link_inner__l {
  width: 90%;
}
.link_inner__l p {
  font-size: 1.8rem;
  padding-top: 0.8rem;
}
@media screen and (max-width: 1100px) {
  .link_inner__l p {
    font-size: 1.6363636364vw;
  }
}

.link_inner_title {
  padding-top: 1rem;
  font-weight: bold;
  font-size: 2.8rem;
}
@media screen and (max-width: 1100px) {
  .link_inner_title {
    font-size: 2.5454545455vw;
  }
}
@media screen and (max-width: 480px) {
  .link_inner_title {
    font-size: 5vw;
    padding-top: 0;
  }
}
.link_inner_title span {
  font-size: 3.6rem;
}
@media screen and (max-width: 1100px) {
  .link_inner_title span {
    font-size: 3.2727272727vw;
  }
}
@media screen and (max-width: 480px) {
  .link_inner_title span {
    font-size: 6.6666666667vw;
  }
}

.link_inner__r {
  width: 10%;
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
}

.atermlink_icon {
  max-height: 50px;
  max-width: 245px;
}
@media screen and (max-width: 1100px) {
  .atermlink_icon {
    width: 22.2727272727vw;
    height: 4.5454545455vw;
  }
}
@media screen and (max-width: 480px) {
  .atermlink_icon {
    width: 42.5vw;
    height: 6.875vw;
  }
}

.precautions {
  border: 1px solid #000;
  padding: 2.4rem;
  width: 80%;
  margin: 0 auto 4rem;
}
@media screen and (max-width: 767px) {
  .precautions {
    width: 90%;
  }
}
@media screen and (max-width: 480px) {
  .precautions {
    padding: 1.6rem;
  }
}
.precautions p {
  font-size: 1.6rem;
  text-align: center;
  line-height: 2em;
}
@media screen and (max-width: 480px) {
  .precautions p {
    font-size: 1.4rem;
  }
}

.precautions_txt {
  font-size: 1.4rem;
  line-height: 2.6em;
}
@media screen and (max-width: 480px) {
  .precautions_txt {
    font-size: 1.2rem;
  }
}

.sec_16 .sec_inner {
  padding: 4rem 1.6rem;
}

.f_snsXbtn {
  margin: 0 auto;
  background: linear-gradient(to right, #ffffff, #ffffff 40%, #000000 60%);
  background-size: 300% 300%;
  background-position: 100%;
  transition: all 0.14s;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  text-decoration: none;
  text-align: center;
  padding: 1.5rem;
  border: 1px solid #fff;
  border-radius: 4px;
  color: #fff;
  width: 32%;
}
.f_snsXbtn:hover {
  background-position: 0;
  border-color: #000;
  color: #000;
  opacity: 1;
}
.f_snsXbtn:hover .snsX_ficon {
  fill: #000;
}
@media screen and (max-width: 1100px) {
  .f_snsXbtn {
    width: 42%;
  }
}
@media screen and (max-width: 767px) {
  .f_snsXbtn {
    width: 70%;
  }
}
@media screen and (max-width: 480px) {
  .f_snsXbtn {
    font-size: 1.6rem;
    width: 90%;
  }
}

.snsX_ficon {
  width: 100%;
  height: 100%;
  max-width: 2.8rem;
  max-height: 2.8rem;
  cursor: pointer;
  fill: #fff;
  margin-right: 2rem;
}

footer {
  background-color: #2F61C8;
}
footer .sec_inner {
  text-align: center;
  padding: 2rem 1.6rem;
  color: #fff;
}
footer .sec_inner .atermlink_icon {
  fill: #fff;
}
footer .sec_inner p {
  text-align: center;
  font-size: 1rem;
  margin-top: 0.5rem;
}

/***************************
modal
***************************/
#modal-content {
  width: 80%;
  margin: 0;
  padding: 0;
  background: #fff;
  position: fixed;
  display: none;
  z-index: 99999;
}
#modal-content .inner {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  overflow: hidden;
}
#modal-content .inner #player {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

#modal-overlay {
  z-index: 9999;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 120%;
  background-color: rgba(0, 0, 0, 0.75);
}

/* モーダルのスタイル */
.modal {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  z-index: 9999999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.4);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s, visibility 0.5s;
}

/* モーダルの画像スタイル */
.modal-content {
  display: block;
  max-width: 700px;
  max-height: 100vh;
}
@media screen and (max-width: 767px) {
  .modal-content {
    width: 60%;
  }
}
@media screen and (max-width: 480px) {
  .modal-content {
    width: 70%;
  }
}

/* モーダルの閉じるボタン */
#close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  cursor: pointer;
}

/***************************
aseet
****************************/
sup{
  vertical-align: super;
}
.sec_paint_item01 {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: -1;
}
.sec_paint_item01 img {
  width: 100%;
}
@media screen and (max-width: 1100px) {
  .sec_paint_item01 {
    width: 42.7272727273vw;
  }
}
@media screen and (max-width: 767px) {
  .sec_paint_item01 {
    width: 61.2777053455vw;
  }
}

.sec_paint_item03 {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: -1;
}
.sec_paint_item03 img {
  width: 100%;
}
@media screen and (max-width: 1100px) {
  .sec_paint_item03 {
    width: 42.7272727273vw;
  }
}
@media screen and (max-width: 767px) {
  .sec_paint_item03 {
    width: 61.2777053455vw;
  }
}

.color_01 {
  fill: #e8653e;
  color: #e8653e;
}

.bg_color_01 {
  background-color: #e8653e;
}

.color_02 {
  fill: #EA9F0A;
  color: #EA9F0A;
}

.bg_color_02 {
  background-color: #EA9F0A;
}

.color_03 {
  fill: #14A83A;
  color: #14A83A;
}

.bg_color_03 {
  background-color: #14A83A;
}

.color_04 {
  fill: #00B4FC;
  color: #00B4FC;
}

.bg_color_04 {
  background-color: #00B4FC;
}

.color_05 {
  fill: #333333;
  color: #333333;
}

.bg_color_05 {
  background-color: #333333;
}

.txt_l{
  text-align: left !important;
}

.my-text {
  font-weight: 900;
  font-size: 8rem;
  font-family: "M PLUS 1p", sans-serif;
  stroke: #ffffff;
  letter-spacing: 0px;
  text-anchor: middle;
  dominant-baseline: alphabetic;
  letter-spacing: 4px;
}
@media screen and (max-width: 767px) {
  .my-text {
    font-size: 6rem;
  }
}
@media screen and (max-width: 480px) {
  .my-text {
    font-size: 5rem;
  }
}

.cont_title > svg > use:nth-of-type(1) {
  stroke-width: 14px;
  stroke: #fff;
  paint-order: stroke;
  stroke-linejoin: round;
}

.cont_title > svg > use:nth-of-type(2) {
  stroke-width: 0;
}

.def_posi {
  position: relative;
  z-index: 7;
}

.bg_white {
  background-color: #fff;
}

.bg_gray {
  background-color: #EEEEEE;
}

.sec_1 .sec_inner {
  max-width: 1100px;
  margin: 8rem auto 0;
  padding: 0 1.6rem;
  padding-bottom: 6rem;
}
@media screen and (max-width: 767px) {
  .sec_1 .sec_inner {
    margin: 0 auto;
    padding-bottom: 2rem;
  }
}
@media screen and (max-width: 480px) {
  .sec_1 .sec_inner {
    margin: 0 auto;
    padding-bottom: 3;
  }
}

.sec_inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 8rem 1.6rem;
}
@media screen and (max-width: 480px) {
  .sec_inner {
    margin: 0 auto;
    padding: 4rem 1.4rem;
  }
}

.sub_txt {
  text-align: center;
  display: block;
  font-weight: 500;
  font-size: 2.8rem;
  margin-bottom: 2.4rem;
  line-height: 1.6em;
}
@media screen and (max-width: 767px) {
  .sub_txt {
    font-size: 3.6505867014vw;
    line-height: 1.6em;
  }
}
@media screen and (max-width: 480px) {
  .sub_txt {
    font-size: 1.8rem;
    line-height: 1.6em;
    margin-bottom: 1rem;
    font-size: 4.5833333333vw;
    text-align: left;
  }
}

.main_txt {
  text-align: center;
  font-size: 3.6rem;
  margin-bottom: 4rem;
  line-height: 1.8em;
}
@media screen and (max-width: 767px) {
  .main_txt {
    font-size: 4.1720990874vw;
    line-height: 1.8em;
  }
}
@media screen and (max-width: 480px) {
  .main_txt {
    font-size: 2.4rem;
    line-height: 1.8em;
    font-size: 5.4166666667vw;
    text-align: left;
  }
}
@media screen and (max-width: 1100px) {
  .mb10sp {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .mb10sp {
    margin-bottom: 2rem;
  }
}
.ft14 {
  font-size: 1.4rem;
}

.mb10 {
  margin-bottom: 10rem;
}
@media screen and (max-width: 1100px) {
  .mb10 {
    margin-bottom: 10rem;
  }
}
@media screen and (max-width: 767px) {
  .mb10 {
    margin-bottom: 8rem;
  }
}
@media screen and (max-width: 480px) {
  .mb10 {
    margin-bottom: 6rem;
  }
}

.mb12 {
  margin-bottom: 12rem;
}
@media screen and (max-width: 1100px) {
  .mb12 {
    margin-bottom: 10rem;
  }
}
@media screen and (max-width: 767px) {
  .mb12 {
    margin-bottom: 8rem;
  }
}
@media screen and (max-width: 480px) {
  .mb12 {
    margin-bottom: 6rem;
  }
}

.mt12 {
  margin-top: 12rem;
}
@media screen and (max-width: 1100px) {
  .mt12 {
    margin-top: 12rem;
  }
}
@media screen and (max-width: 767px) {
  .mt12 {
    margin-top: 9rem;
  }
}
@media screen and (max-width: 480px) {
  .mt12 {
    margin-top: 6rem;
  }
}

.mb8 {
  margin-bottom: 8rem;
}
@media screen and (max-width: 1100px) {
  .mb8 {
    margin-bottom: 8rem;
  }
}
@media screen and (max-width: 767px) {
  .mb8 {
    margin-bottom: 6rem;
  }
}
@media screen and (max-width: 480px) {
  .mb8 {
    margin-bottom: 4rem;
  }
}

.mb4 {
  margin-bottom: 4rem;
}
@media screen and (max-width: 1100px) {
  .mb4 {
    margin-bottom: 4rem;
  }
}
@media screen and (max-width: 767px) {
  .mb4 {
    margin-bottom: 4rem;
  }
}
@media screen and (max-width: 480px) {
  .mb4 {
    margin-bottom: 2rem;
  }
}

.mb2 {
  margin-bottom: 2rem;
}
@media screen and (max-width: 1100px) {
  .mb2 {
    margin-bottom: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .mb2 {
    margin-bottom: 2rem;
  }
}
@media screen and (max-width: 480px) {
  .mb2 {
    margin-bottom: 1.6rem;
  }
}

.pb12 {
  padding-bottom: 12rem;
}
@media screen and (max-width: 1100px) {
  .pb12 {
    padding-bottom: 12rem;
  }
}
@media screen and (max-width: 767px) {
  .pb12 {
    padding-bottom: 9rem;
  }
}
@media screen and (max-width: 480px) {
  .pb12 {
    padding-bottom: 6rem;
  }
}

@media screen and (max-width: 480px) {
  .pcOnly {
    display: none;
  }
}

@media screen and (max-width: 1100px) {
  .spOnly_sm {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .spOnly_sm {
    display: none;
  }
}

@media screen and (min-width: 1367px) {
  .spOnly_vsm {
    display: block;
  }
}
@media screen and (max-width: 1100px) {
  .spOnly_vsm {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .spOnly_vsm {
    display: none;
  }
}

@media screen and (min-width: 1367px) {
  .vsmOnly {
    display: none;
  }
}
@media screen and (max-width: 1366px) {
  .vsmOnly {
    display: none;
  }
}
@media screen and (max-width: 1100px) {
  .vsmOnly {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .vsmOnly {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .vsmOnly {
    display: block;
  }
}

@media screen and (max-width: 1100px) {
  .spOnly {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .spOnly {
    display: block;
  }
}/*# sourceMappingURL=style.css.map */