/*==============================
  cks3a.css
  - cks3a 固有のスタイル
==============================*/
.d-inline-block {
  display: inline-block;
}

/*********************
* cks3a-hero（MV + achievement 共通背景）
*********************/
.cks3a-hero {
  background-image: url(/cks3a/img/mv_bg.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding-top: 90px;
}

/*********************
* cks3a-mv
*********************/
.cks3a-mv {
  text-align: center;
}

.cks3a-mv__inner {
  max-width: 1067px;
  margin: 0 auto;
}

.cks3a-mv__inner img {
  width: 100%;
  height: auto;
  display: block;
}

/*********************
* cks3a-achievement（月桂樹）
*********************/
.cks3a-achievement {
  background: rgba(245, 252, 255, 0.8);
  padding: 10px 0 7px;
}

.cks3a-achievement__inner {
  width: 90%;
  max-width: 570px;
  margin: 0 auto;
}

.cks3a-achievement__inner img {
  width: 100%;
  height: auto;
  display: block;
}

.cks3a-achievement__note {
  font-size: 10px;
  text-align: center;
  margin-top: 3px;
}

/*********************
* concern 「でも」+ サブタイトル + 波線
*********************/
.cks2-concern__top {
  padding-top: 40px;
}

.cks2-concern__ttl {
  font-weight: normal;
}

.cks2-concern__ttl--bold {
  font-weight: 900;
}

.cks3a-concern__demo {
  text-align: center;
  margin: 15px auto 10px;
}

.cks3a-concern__sub {
  font-size: clamp(16px, 2.5vw + 6px, 32px);
  font-weight: bold;
  text-align: center;
  margin-top: 10px;
  margin-bottom: 30px;
}

.cks3a-concern__onayami {
  position: relative;
  display: inline-block;
  color: #005BAB;
}

.cks3a-concern__wave-line {
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 767px) {
  .cks3a-concern__sub {
    font-size: 18px;
  }
}

/*********************
* kv_cta 上書き
*********************/
.cks2-merit-wrap .kv_cta {
  background: rgba(255, 255, 255, 1);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/*********************
* cks3a-intrust
*********************/

.cks3a-intrust__top {
  background: url(/ckn1/img/common/intrust_bg.png) repeat top left / 371px 400px;
  padding: 40px 0;
  text-align: center;
}

.cks3a-intrust__ttl {
  font-size: clamp(18px, 2.5vw + 6px, 28px);
  font-weight: normal;
  line-height: 1.6;
  color: #005BAB;
}

.cks3a-intrust__ttl--em {
  font-weight: 900;
}

.cks3a-intrust__icons {
  margin-top: 25px;
}

.cks3a-intrust__icons img {
  width: 100%;
  max-width: 1000px;
  height: auto;
}

.cks3a-intrust__bottom {
  background: linear-gradient(56deg, #eaf0f5 1%, #fbfbfc 48%, #e6f0f9 82%, #e6f3ff 98%), url(/ckn1/img/common/section_bg.png) no-repeat center / cover;
  background-blend-mode: multiply;
  padding: 0 0 100px;
  text-align: center;
}

.cks3a-intrust__label {
  margin-bottom: 15px;
}

.cks3a-intrust__label img {
  width: 220px;
  height: auto;
}

.cks3a-intrust__sub {
  font-size: 38px;
  font-weight: bold;
  line-height: 1.6;
  color: #333;
}

.cks3a-intrust__sub--lg {
  font-size: 46px;
}

.cks3a-intrust__sub--blue {
  color: #005BAB;
}

.cks3a-intrust__sub--em {
  display: inline-block;
  background: #005BAB;
  color: #fff;
  font-size: 46px;
  font-weight: 900;
  padding: 0 5px;
}

.cks3a-intrust__sub--highlight {
  color: #FAE163;
}

.cks3a-intrust__compare {
  margin-top: 25px;
}

.cks3a-intrust__compare img {
  width: 100%;
  max-width: 700px;
  height: auto;
}

@media screen and (max-width: 767px) {

  .cks3a-intrust__top {
    padding: 30px 0;
  }

  .cks3a-intrust__bottom {
    padding: 0 0 30px;
  }

  .cks3a-intrust__label img {
    width: 120px;
  }

  .cks3a-intrust__sub {
    font-size: 21px;
  }

  .cks3a-intrust__sub--lg {
    font-size: 21px;
  }

  .cks3a-intrust__sub--em {
    font-size: 21px;
  }

  .cks3a-hero {
    background-image: url(/cks3a/img/mv_bg_sp.jpg);
    padding-top: 75px;
  }

  .cks2-concern__top {
    padding-top: 30px;
  }

  .cks2-cta-alt__text img {
    max-width: 420px;
  }
}