@charset "UTF-8";
#selectbeam .ttlbk {
  margin-bottom: 67px;
}
.bdr_btm {
  border-bottom: 1px solid #e6e6e6;
}
/* ======================
article__head
========================= */
.article__head {
  padding: clamp(55px, 11.46vw, 103px) 0 clamp(30px, 6.25vw, 67px);
}
.article__head-logo {
  width: 50%;
  max-width: 426px;
  min-width: 230px;
  margin: 0 auto clamp(35px, 6.84vw, 67px);
}
.article__head-catch {
  font-size: clamp(23px, 4.29vw, 42px);
  text-align: center;
  max-width: 800px;
  margin: 0 auto 48px;
}
.system__list {
  max-width: 1200px;
  margin: 0 auto;
  gap: 4vw 0;
}
.system__item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: min(10%, 23px);
  aspect-ratio: 1/1;
  width: 23.5%;
  max-width: 263px;
  max-height: 242px;
  background: #fff;
}
.system__item-imgbk {
  width: 80%;
  max-width: 99px;
}
.system__item-txt {
  font-size: clamp(18px, 2.55vw, 25px);
  color: #012a2d;
}
/* ======================
about
========================= */
.about {
  padding: clamp(30px, 6.25vw, 67px) 0 clamp(80px, 18.67vw, 140px);
}

.about__inner {
  max-width: 1425px;
  margin: 0 auto;
}
.about__txtbk {
  width: 45%;
  max-width: 630px;
}
.about__txtbk-inner {
  max-width: 467px;
  margin: 0 auto;
}
.about__ttl {
  margin-bottom: 1.5em;
}
.about__ttl .en {
  /* 980→30px */
  font-size: clamp(30px, 3.06vw, 33px);
  display: block;
  margin-bottom: 0.7em;
}
.about__ttl .ja {
  /* 980→33px */
  font-size: clamp(33px, 3.37vw, 36px);
}
.about__imgbk {
  width: 53%;
  max-width: 719px;
}
.about__txt {
  line-height: 2.125;
}

/* ======================
comparison
========================= */
.comparison {
  padding: clamp(55px, 11.46vw, 94px) 0 clamp(60px, 16.53vw, 124px);
}
.comparison__txtbk {
  margin-bottom: clamp(55px, 11.46vw, 80px);
}
.comparison__ttl {
  font-size: clamp(22px, 4.58vw, 33px);
  margin-bottom: 20px;
}
.comparison__table-ttl {
  font-size: 22px;
  letter-spacing: 0.06em;
  color: #221815;
  margin-bottom: 10px;
}
.comparison__tableWrap {
  overflow-x: scroll;
  overflow-y: clip;
  padding-bottom: 20px;
}
.comparison__tableWrap table {
  font-size: clamp(15px, 2vw, 18px);
  font-weight: 500;
  text-align: center;
  width: 100%;
  min-width: 590px;
  border-collapse: initial;
}
.comparison__tableWrap table th,
.comparison__tableWrap table td {
  height: 37px;
}
.comparison__tableWrap table thead th {
  color: #fff;
  background-color: #3e3a39;
}
.comparison__tableWrap table thead tr:first-child > *:first-child {
  background-image: linear-gradient(to right top, transparent calc(50% - 1px), #fff 50%, #fff calc(50% + 1px), transparent calc(50% + 2px));
}
.comparison__tableWrap table thead th.sb {
  background-color: #16a4a0;
}
.comparison__tableWrap table thead th {
  background-color: #3e3a39;
}

.comparison__tableWrap table tbody th {
  font-weight: 500;
  letter-spacing: 0;
  color: #fff;
  width: 28%;
  background-color: #595757;
}
.comparison__tableWrap table tbody th span {
  text-align-last: justify;
  display: block;
  width: 10em;
  margin: 0 auto;
}
.comparison__tableWrap table tbody td {
  text-align: center;
  color: #221815;
  width: 24%;
  background-color: #dcdddd;
}
.comparison__tableWrap table tbody td.sb {
  color: #16a4a0;
  font-weight: 800;
  background-color: #c8e7e9;
}
.comparison__tableWrap table tbody td span {
  font-size: 84%;
}

/* ======================
reason
========================= */
.reason {
  padding: clamp(55px, 11.46vw, 106px) 0 clamp(60px, 19.33vw, 145px);
}
.reason__head {
  margin-bottom: clamp(60px, 16.8vw, 126px);
}
.reason__head-ttl {
  font-size: clamp(22px, 4.58vw, 33px);
  margin-bottom: 17px;
}
.reason__list {
  display: flex;
  flex-direction: column;
  gap: clamp(55px, 11.46vw, 90px);
}
.reason__item-ttl {
  font-size: clamp(22px, 2.93vw, 28px);
  margin-bottom: 1.2em;
}
.reason__item-inner {
  align-items: flex-start;
}
.reason__item-inner .reason__item-txtbk {
  width: 47%;
  max-width: 464px;
}
.reason__item-inner .reason__item-imgbk {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: min(2.26vw, 40px);
  aspect-ratio: 443/ 332;
  width: 47%;
  max-width: 443px;
  background: #fff;
}
.reason__item-inner .reason__item-imgbk-in {
  width: 38%;
  max-width: 165px;
}
.reason__item-inner .reason__item-imgbk-txt {
  font-size: clamp(18px, 4vw, 42px);
  color: #012a2d;
}
/* ======================
article__bottom
========================= */
.article__bottom {
  padding: clamp(55px, 11.46vw, 100px) 0 clamp(60px, 16vw, 120px);
}
.article__bottom-txt {
  font-size: clamp(17px, 2.53vw, 19px);
  line-height: 1.789;
  margin-bottom: clamp(55px, 11.46vw, 100px);
}
.article__bottom a {
  font-size: clamp(20px, 2.93vw, 22px);
  line-height: 1.3;
  letter-spacing: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 453px;
  margin: 0 auto;
  padding: 0.97em;
  background: #ed6c00;
  border-radius: 10px;
}
@media screen and (max-width: 980px) {
  /* ======================
	about
	========================= */
  .about__inner {
    flex-direction: column;
    align-items: center;
    gap: 30px;
  }
  .about__txtbk,
  .about__txtbk-inner {
    width: 100%;
    max-width: 690px;
  }
  .about__ttl .en {
    font-size: clamp(22px, 4.58vw, 30px);
  }
  .about__ttl .ja {
    font-size: clamp(22px, 4.58vw, 30px);
  }
  .about__imgbk {
    width: 100%;
  }
}
@media screen and (max-width: 750px) {
  /* ======================
	article__head
	========================= */
  .system__item {
    aspect-ratio: 4/1;
    width: 48%;
    max-width: initial;
    height: auto;
    padding: 2%;
  }
  /* ======================
	reason
	========================= */
  .reason__item-inner {
    flex-direction: column;
    align-items: center;
    gap: clamp(20px, 6.67vw, 50px);
  }
  .reason__item-inner .reason__item-txtbk {
    width: 100%;
    max-width: initial;
  }
  .reason__item-inner .reason__item-imgbk {
    width: 60%;
  }
}
@media screen and (max-width: 500px) {
  /* ======================
	article__head
	========================= */
  .article__head-logo {
    width: 70%;
    max-width: 230px;
    min-width: initial;
  }
}