/*============================================================================
	kanmaKey
=============================================================================*/
#kanmaKeyWrap {
  width: 100%;
  height: 100dvh;
  background: url("../img/kanma/chaeder.jpg") center center no-repeat;
  background-size: cover;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
#kanmaKeyWrap::after {
  content: "";
  width: 100%;
  height: 100%;
  background: url("../img/kanma/key_mask.svg") left bottom no-repeat;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  right: 0;
}
#kanmaKeyWrap .logo {
  width: 375px;
  text-align: center;
  transform: translateY(-10%);
}
@media (max-width: 480px) {
  #kanmaKeyWrap .logo {
    width: 180px;
  }
}

/*============================================================================
	kanmaIntroArea
=============================================================================*/
.kanmaContWrapper {
  overflow: hidden;
}

#kanmaIntroArea {
  padding: clamp(24px, 4.167vw, 40px) 0;
}

#kanmaIntro02Area {
  padding: clamp(52.5px, 12.5004vw, 150px) 0 clamp(87.5px, 20.8332vw, 250px);
}

.kanmaContainer {
  width: 90%;
  max-width: 1000px;
  margin: auto;
}

.kanmaIntroLeadBox {
  display: flex;
  gap: 50px;
}
@media (max-width: 1024px) {
  .kanmaIntroLeadBox {
    flex-direction: column;
  }
}
.kanmaIntroLeadBox .headBox {
  width: 450px;
  flex-shrink: 0;
}
@media (max-width: 1024px) {
  .kanmaIntroLeadBox .headBox {
    width: 100%;
  }
}
@media (max-width: 480px) {
  .kanmaIntroLeadBox .headBox {
    width: 230px;
  }
}
.kanmaIntroLeadBox .headBox h2 {
  color: #29588C;
  font-size: clamp(45px, 5.8338vw, 60px);
  font-weight: 400;
  line-height: 1.5;
  padding: 0 0 0.5em 0;
  border-bottom: 1px solid #29588C;
  position: relative;
}
@media (max-width: 480px) {
  .kanmaIntroLeadBox .headBox h2 {
    font-size: 3rem;
  }
}
.kanmaIntroLeadBox .headBox h2.s {
  font-size: clamp(39px, 5.0554vw, 52px);
}
@media (max-width: 480px) {
  .kanmaIntroLeadBox .headBox h2.s {
    font-size: 2.6rem;
  }
}
.kanmaIntroLeadBox .headBox h2 .en {
  position: absolute;
  right: 0;
  bottom: -42%;
  width: 23.8888888889vw;
}
.kanmaIntroLeadBox .txtBox {
  font-size: clamp(14px, 3.4vw, 18px);
  font-weight: 400;
  line-height: 1.8;
}
.kanmaIntroLeadBox .txtBox p + p {
  margin-top: 1em;
}

.kanmaIntroBodyBox01 {
  display: flex;
  justify-content: space-between;
  margin: clamp(52.5px, 12.5004vw, 150px) 0;
  position: relative;
}
@media (max-width: 480px) {
  .kanmaIntroBodyBox01 {
    flex-direction: column;
  }
}
.kanmaIntroBodyBox01::after {
  content: "";
  display: block;
  width: 792px;
  height: 531px;
  background: url("../img/kanma/bg_intro01.png") top right no-repeat;
  background-size: contain;
  position: absolute;
  top: -38%;
  left: 43%;
  z-index: -1;
}
@media (max-width: 480px) {
  .kanmaIntroBodyBox01::after {
    width: 396px;
    height: 266px;
  }
}
.kanmaIntroBodyBox01 .clm01 {
  width: 54.4%;
}
@media (max-width: 480px) {
  .kanmaIntroBodyBox01 .clm01 {
    width: auto;
  }
}
.kanmaIntroBodyBox01 .clm01 .imgBox01 {
  display: block;
  width: 82.7205882353%;
  margin: 0 0 0 auto;
  position: relative;
}
.kanmaIntroBodyBox01 .clm01 .imgBox01 .en {
  position: absolute;
  right: 0;
  bottom: -34%;
  width: 75.5555555556%;
}
.kanmaIntroBodyBox01 .clm02 {
  width: 45.3%;
  margin: clamp(63px, 15vw, 180px) -3% 0 0;
}
@media (max-width: 480px) {
  .kanmaIntroBodyBox01 .clm02 {
    width: 70%;
    margin-right: auto;
  }
}
.kanmaIntroBodyBox01 .txtBox01 {
  margin: clamp(56px, 13.3332vw, 160px) 0 0 0;
  font-size: clamp(14px, 3.4vw, 18px);
  font-weight: 400;
  line-height: 1.8;
}
.kanmaIntroBodyBox01 .txtBox01 p + p {
  margin-top: 1em;
}

.kanmaIntroBodyBox02 {
  margin: clamp(52.5px, 12.5004vw, 150px) 0;
  position: relative;
}
.kanmaIntroBodyBox02::after {
  content: "";
  display: block;
  width: 711px;
  height: 509px;
  background: url("../img/kanma/bg_intro02.png") top right no-repeat;
  background-size: contain;
  position: absolute;
  top: -36%;
  left: -34%;
  z-index: -1;
}
@media (max-width: 480px) {
  .kanmaIntroBodyBox02::after {
    width: 356px;
    height: 255px;
  }
}
.kanmaIntroBodyBox02 .imgBox03 {
  display: block;
  width: 66.2%;
  margin: 0 -3% 0 auto;
}
.kanmaIntroBodyBox02 .imgBox04 {
  display: block;
  width: 52%;
  margin: clamp(30px, 5.208vw, 50px) auto 0 0;
}

.kanmaIntroBodyBox03 {
  display: flex;
}
.kanmaIntroBodyBox03 .clm01 {
  width: 50%;
  flex-shrink: 0;
}
.kanmaIntroBodyBox03 .clm02 {
  width: 44.3%;
  margin: clamp(36px, 6.2505vw, 60px) 0 0 0;
}
.kanmaIntroBodyBox03 .imgBox05 {
  display: block;
  width: 59.2%;
  margin: 0 auto;
}
.kanmaIntroBodyBox03 .imgBox06 {
  display: block;
}
@media (max-width: 1024px) {
  .kanmaIntroBodyBox03 {
    margin-top: clamp(36px, 6.2505vw, 60px);
  }
}

.moreBtn.kanma {
  margin: 50px 0 0 auto;
}
.moreBtn.kanma a {
  background: #BEA175;
}
.moreBtn.kanma a:hover {
  background: #BEA175;
}

/*============================================================================
	kanmaAgreementArea
=============================================================================*/
#kanmaAgreementArea {
  padding: clamp(42px, 7.2915vw, 70px) 0;
  background: url("../img/kanma/bg_agreement.jpg") 0 0 repeat;
}
#kanmaAgreementArea .innner {
  width: 90%;
  max-width: 1260px;
  margin: auto;
}
#kanmaAgreementArea .head {
  color: #29588C;
  font-size: clamp(24px, 3.7494vw, 30px);
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  margin: 0 0 1em 0;
}
#kanmaAgreementArea .head .notion {
  font-size: clamp(12px, 2.222vw, 16px);
  font-weight: 400;
  margin: 0 -6em 0 1em;
}
@media (max-width: 480px) {
  #kanmaAgreementArea .head .notion {
    display: block;
    margin: 0.5em 0 0 0;
  }
}
#kanmaAgreementArea .list01 {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 1.25%;
  color: #29588C;
}
@media (max-width: 480px) {
  #kanmaAgreementArea .list01 {
    flex-direction: column;
  }
}
#kanmaAgreementArea .list01 > li {
  width: 32.5%;
  padding: 50px 38px;
  background: #FFFFFF;
}
@media (max-width: 480px) {
  #kanmaAgreementArea .list01 > li {
    width: auto;
    padding: 25px 20px;
  }
}
#kanmaAgreementArea .list01 > li figure {
  margin: 0;
}
#kanmaAgreementArea .list01 > li .txtBox h4 {
  font-size: clamp(17.6px, 2.7504vw, 22px);
  font-weight: 700;
  line-height: 1.5;
  margin: 0.5em 0 0 0;
}
#kanmaAgreementArea .list01 > li .txtBox p {
  font-size: clamp(12px, 2.222vw, 16px);
  font-weight: 400;
  line-height: 1.5;
  margin: 0.5em 0 0 0;
}