@charset "UTF-8";
/*---------------------
変数
-----------------------*/
/**************************

  カラーパレット

**************************/
/*-- mixinフォルダの中の_index.scss --*/
/*------------------------------------
SP特化サイト用メディアクエリ MIXIN
---------------------------------*/
/*---------------------
 ★ 文字関連一括指定（フォントサイズ+2px対応版）
-----------------------*/
/*---------------------
//Fontサイズ vw可変指定（SP特化サイト用）
----------------------*/
/* @include font-vw(font-size, 440px, 16px, 12px);
SP特化サイトの最大幅440pxのとき16pxの文字sizeをvw変換し、
幅を狭めるごとに比率で縮めるが、そのまま適用すると早々に小さくなりすぎるので、
最小値12pxを指定。最小値になる幅sizeを割り出し、メディアクエリにmin指定することで
16pxの比率のまま縮め、12px以下には縮まないという指定にしている。
*/
/*---------------------
 ★ リンク文字色 一括指定
-----------------------*/
/*---------------------
 ★ リンク下線復活
-----------------------*/
/*-------------------------------------
 ★ リンク下線消去 一括指定//フォーカスのみ下線
---------------------------------------*/
/*-------------------------------------
 ★ floatのあとは自動 clear: both;
 @include clearfix;
 float: left;
 のように使用する
---------------------------------------*/
/*-------------------------------------
 ★セレクトのプロパティをサイズ指定して変更
---------------------------------------*/
/*-------------------------------------

   レイアウト汎用

---------------------------------------*/
/*-----------------------------------

 上部余白

-----------------------------------*/
/*-----------------------------------

 改行制御

-----------------------------------*/
/*-----------------------------------

 中央寄せと左寄せ制御

-----------------------------------*/
/*--------------------------------------------
//文字数を指定行数で丸めて…で省略・複数行対応mixin
----------------------------------------------*/
/*-----------------------------------

 文章段落

-----------------------------------*/
/*--------------------------------
外壁塗装ページ
---------------------------------*/
.p-paint-exterior-coating {
  /*--------------------------------
  ヒーローセクション
  ---------------------------------*/
  /*--------------------------------
  モデル価格セクション
  ---------------------------------*/
  /*--------------------------------
  CTAブロック（モデル価格セクション後）
  ---------------------------------*/
  /*--------------------------------
  実績スライダー（汎用コンポーネント呼び出し）
  ---------------------------------*/
  /*--------------------------------
  ポリシーセクション（汎用コンポーネント呼び出し）
  ---------------------------------*/
  /*--------------------------------
  保証セクション（汎用コンポーネント呼び出し）
  ---------------------------------*/
  /*--------------------------------
  技術セクション
  ---------------------------------*/
  /*--------------------------------
  工法セクション
  ---------------------------------*/
  /*--------------------------------
  塗料セクション
  ---------------------------------*/
  /*--------------------------------
  問題提起セクション
  ---------------------------------*/
  /*--------------------------------
  外壁のサインセクション
  ---------------------------------*/
  /*--------------------------------
  早期対処セクション
  ---------------------------------*/
  /*--------------------------------
  検討中セクション
  ---------------------------------*/
  /*--------------------------------
  不安解消セクション
  ---------------------------------*/
  /*--------------------------------
  代表メッセージセクション
  ---------------------------------*/
  /*--------------------------------
  施工フローセクション
  ---------------------------------*/
}
.p-paint-exterior-coating .hero {
  padding: 0;
  margin: 0;
  text-align: center;
  width: 100%;
  overflow: hidden;
}
.p-paint-exterior-coating .hero__content {
  padding: 0;
  margin: 0;
  width: 100%;
}
.p-paint-exterior-coating .hero__content img {
  width: 100%;
  height: auto;
  display: block;
  margin: 0;
  padding: 0;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.p-paint-exterior-coating .hero__content img:hover {
  -webkit-transform: scale(1.02);
          transform: scale(1.02);
}
.p-paint-exterior-coating .model-price {
  background: #ffffff;
}
.p-paint-exterior-coating .model-price__content {
  text-align: center;
}
.p-paint-exterior-coating .model-price__content img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
}
.p-paint-exterior-coating .model-price__note {
  font-style: normal;
  font-weight: normal;
  font-size: calc(16 / 16 * 1rem);
  color: #666;
  letter-spacing: inherit;
  line-height: inherit;
  text-align: right;
  margin-top: 10px;
  margin-bottom: 0;
}
@media only screen and (max-width: 768px) {
  .p-paint-exterior-coating .model-price__note {
    margin-top: 8px;
  }
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .model-price__note {
    text-align: left;
  }
}
.p-paint-exterior-coating .model-price__tab {
  max-width: 700px;
  margin-inline: auto;
  margin-top: 30px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 12px;
  overflow: hidden;
  background: #ffffff;
  -webkit-box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}
@media only screen and (max-width: 768px) {
  .p-paint-exterior-coating .model-price__tab {
    margin-top: 20px;
  }
}
.p-paint-exterior-coating .model-price__tab-buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.p-paint-exterior-coating .model-price__tab-button {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  padding: 15px 20px;
  border: none;
  background: rgba(105, 205, 245, 0.47);
  color: #333;
  font-style: normal;
  font-weight: 500;
  font-size: calc(20 / 16 * 1rem);
  color: #333;
  letter-spacing: 0.02em;
  line-height: 1.5;
  cursor: pointer;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  position: relative;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .model-price__tab-button {
    padding: 12px 15px;
    font-style: normal;
    font-weight: 500;
    font-size: calc(16 / 16 * 1rem);
    color: #333;
    letter-spacing: inherit;
    line-height: inherit;
  }
}
.p-paint-exterior-coating .model-price__tab-button:hover {
  background: #3867cd;
  color: #ffffff;
}
.p-paint-exterior-coating .model-price__tab-button.is-active {
  background: #214287;
  color: #ffffff;
  font-style: normal;
  font-weight: 500;
  font-size: calc(20 / 16 * 1rem);
  color: #ffffff;
  letter-spacing: inherit;
  line-height: inherit;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .model-price__tab-button.is-active {
    font-style: normal;
    font-weight: 500;
    font-size: calc(16 / 16 * 1rem);
    color: #ffffff;
    letter-spacing: inherit;
    line-height: inherit;
  }
}
.p-paint-exterior-coating .model-price__tab-button:first-child {
  border-right: 1px solid rgba(0, 0, 0, 0.1);
}
.p-paint-exterior-coating .model-price__tab-content {
  position: relative;
  background: white;
}
.p-paint-exterior-coating .model-price__tab-panel {
  display: none;
  padding: 25px;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .model-price__tab-panel {
    padding: 15px;
  }
}
.p-paint-exterior-coating .model-price__tab-panel.is-active {
  display: block;
}
.p-paint-exterior-coating .model-price__tab-panel-lists {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 30px 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 680px) {
  .p-paint-exterior-coating .model-price__tab-panel-lists {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .model-price__tab-panel-lists {
    gap: 15px;
  }
}
.p-paint-exterior-coating .model-price__tab-panel-list {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: left;
}
.p-paint-exterior-coating .model-price__tab-panel-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.p-paint-exterior-coating .model-price__tab-panel-list li {
  position: relative;
  padding-left: 20px;
  font-style: normal;
  font-weight: 500;
  font-size: calc(19 / 16 * 1rem);
  color: #333;
  letter-spacing: 0.01em;
  line-height: 1.5;
  line-height: 1.6;
  text-align: left;
  margin-bottom: 8px;
}
.p-paint-exterior-coating .model-price__tab-panel-list li::before {
  content: "●";
  position: absolute;
  left: 0;
  top: 0;
  color: #214287;
  font-size: 12px;
}
.p-paint-exterior-coating .model-price__tab-panel-notes {
  margin-top: 20px;
  padding-top: 15px;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}
@media only screen and (max-width: 768px) {
  .p-paint-exterior-coating .model-price__tab-panel-notes {
    margin-top: 15px;
  }
}
.p-paint-exterior-coating .model-price__tab-panel-notes p {
  font-style: normal;
  font-weight: 400;
  font-size: calc(14 / 16 * 1rem);
  color: #666;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.5;
  margin-bottom: 8px;
  text-align: left;
}
.p-paint-exterior-coating .model-price__tab-panel-notes p:last-child {
  margin-bottom: 0;
}
.p-paint-exterior-coating .model-price__tab-panel-notice {
  margin-top: 20px;
  padding: 15px;
  background-color: #f7eedd;
  border-radius: 8px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  text-align: left;
}
@media only screen and (max-width: 768px) {
  .p-paint-exterior-coating .model-price__tab-panel-notice {
    margin-top: 15px;
  }
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .model-price__tab-panel-notice {
    padding: 10px;
  }
}
.p-paint-exterior-coating .model-price__tab-panel-notice-title {
  font-style: normal;
  font-weight: 700;
  font-size: calc(20 / 16 * 1rem);
  color: #eb2557;
  letter-spacing: 0.01em;
  line-height: 1.5;
  margin-bottom: 8px;
  margin-top: 0;
  text-align: left;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .model-price__tab-panel-notice-title {
    font-style: normal;
    font-weight: 700;
    font-size: calc(18 / 16 * 1rem);
    color: #eb2557;
    letter-spacing: inherit;
    line-height: inherit;
  }
}
.p-paint-exterior-coating .model-price__tab-panel-notice-text {
  font-style: normal;
  font-weight: 400;
  font-size: calc(18 / 16 * 1rem);
  color: #666;
  letter-spacing: 0.01em;
  line-height: 1.5;
  line-height: 1.5;
  margin: 0;
  text-align: left;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .model-price__tab-panel-notice-text {
    font-style: normal;
    font-weight: 400;
    font-size: calc(16 / 16 * 1rem);
    color: #666;
    letter-spacing: inherit;
    line-height: inherit;
  }
}
.p-paint-exterior-coating .cp-cta-block-800 {
  margin-top: 24px;
  padding-bottom: 40px;
}
@media only screen and (max-width: 768px) {
  .p-paint-exterior-coating .cp-cta-block-800 {
    margin-top: 24px;
  }
}
@media only screen and (max-width: 768px) {
  .p-paint-exterior-coating .cp-cta-block-800 {
    padding-bottom: 30px;
  }
}
.p-paint-exterior-coating .cp-swiper-slider-works {
  padding-bottom: 45px;
  background: #ffffff;
}
@media only screen and (max-width: 768px) {
  .p-paint-exterior-coating .cp-swiper-slider-works {
    padding-bottom: 25px;
  }
}
.p-paint-exterior-coating .policy {
  padding-top: 60px;
  padding-bottom: 30px;
  background: linear-gradient(-135deg, rgb(255, 255, 255) 0%, rgba(157, 225, 252, 0.15) 50%, rgba(114, 207, 245, 0.2) 100%);
  border-top: 1px solid rgba(0, 0, 0, 0.05);
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
@media only screen and (max-width: 768px) {
  .p-paint-exterior-coating .policy {
    padding-top: 60px;
  }
}
@media only screen and (max-width: 768px) {
  .p-paint-exterior-coating .policy {
    padding-bottom: 30px;
  }
}
.p-paint-exterior-coating .warranty {
  margin-top: 0;
  background: #f7f9fb;
  padding-bottom: 30px;
}
.p-paint-exterior-coating .technology {
  padding: 0 0 60px;
  background: linear-gradient(135deg, rgba(40, 167, 69, 0.05) 0%, rgba(40, 167, 69, 0.1) 100%);
  border-radius: 20px;
}
.p-paint-exterior-coating .technology .c-section-title {
  background: #3f51b5;
  color: #ffffff;
  font-style: normal;
  font-weight: bold;
  font-size: calc(37 / 16 * 1rem);
  color: #ffffff;
  letter-spacing: 0.05em;
  line-height: 1.5;
  text-align: center;
  padding: 40px 20px 120px;
}
@media (min-width: 800px) {
  .p-paint-exterior-coating .technology .c-section-title {
    font-size: 38px;
  }
}
@media (min-width: 320px) and (max-width: 799px) {
  .p-paint-exterior-coating .technology .c-section-title {
    font-size: calc(3.3333333333vw + 11.3333333333px);
  }
}
@media (max-width: 319px) {
  .p-paint-exterior-coating .technology .c-section-title {
    font-size: 22px;
  }
}
.p-paint-exterior-coating .technology__slider {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  margin-top: -88px;
}
.p-paint-exterior-coating .technology__slider .swiper-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition-timing-function: linear;
          transition-timing-function: linear;
}
.p-paint-exterior-coating .technology__slider .swiper-slide {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 200px;
  height: 200px;
  margin: 0;
}
.p-paint-exterior-coating .technology__slider .swiper-slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  -webkit-filter: grayscale(100%);
          filter: grayscale(100%);
}
.p-paint-exterior-coating .technology__reasons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 30px;
  margin-top: 40px;
  max-width: 80%;
  margin-inline: auto;
}
@media screen and (max-width: 680px) {
  .p-paint-exterior-coating .technology__reasons {
    max-width: 94%;
  }
}
.p-paint-exterior-coating .technology__reason {
  background: #ffffff;
  border-radius: 15px;
  -webkit-box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  width: 100%;
}
.p-paint-exterior-coating .technology__reason:hover {
  -webkit-transform: translateY(-5px);
          transform: translateY(-5px);
}
.p-paint-exterior-coating .technology__content {
  width: 100%;
  padding: 30px 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.p-paint-exterior-coating .technology__header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.p-paint-exterior-coating .technology__number {
  width: 50px;
  height: 50px;
  background: #214287;
  color: #ffffff;
  border-radius: 50%;
  font-style: normal;
  font-weight: bold;
  font-size: calc(24 / 16 * 1rem);
  color: #ffffff;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 50px;
  text-align: center;
  margin-right: 20px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.p-paint-exterior-coating .technology__title {
  font-style: normal;
  font-weight: bold;
  font-size: calc(24 / 16 * 1rem);
  color: #243969;
  letter-spacing: 0.02em;
  line-height: 1.6;
  line-height: 1.4;
}
.p-paint-exterior-coating .technology__divider {
  margin: 8px 0 20px 0;
  text-align: center;
}
.p-paint-exterior-coating .technology__divider img {
  max-width: 100%;
  height: auto;
}
.p-paint-exterior-coating .technology__description {
  font-style: normal;
  font-weight: 400;
  font-size: calc(18 / 16 * 1rem);
  color: #333;
  letter-spacing: 0.02em;
  line-height: 1.6;
  margin-bottom: 15px;
}
.p-paint-exterior-coating .technology__details {
  margin: 15px 0;
  list-style: none;
  padding: 0;
}
.p-paint-exterior-coating .technology__details li {
  position: relative;
  padding-left: 20px;
  margin-bottom: 8px;
}
.p-paint-exterior-coating .technology__details li::before {
  content: "◆";
  color: #214287;
  position: absolute;
  left: 0;
  top: 0;
}
.p-paint-exterior-coating .technology__conclusion {
  font-style: normal;
  font-weight: 500;
  font-size: calc(18 / 16 * 1rem);
  color: #214287;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.6;
  margin-top: 15px;
}
.p-paint-exterior-coating .technology__features {
  margin: 0 0 15px;
  list-style: none;
  padding: 0;
}
.p-paint-exterior-coating .technology__features li {
  font-style: normal;
  font-weight: 400;
  font-size: calc(20 / 16 * 1rem);
  color: #666;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.5;
  margin-bottom: 5px;
  position: relative;
  padding-left: 20px;
}
.p-paint-exterior-coating .technology__features li::before {
  content: "◆";
  color: #214287;
  position: absolute;
  left: 0;
  top: 0;
}
.p-paint-exterior-coating .technology__note {
  margin-top: 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 20px;
}
.p-paint-exterior-coating .technology__note-character {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 120px;
  height: 120px;
}
.p-paint-exterior-coating .technology__note-character img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.p-paint-exterior-coating .technology__note-text {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-style: normal;
  font-weight: 500;
  font-size: calc(18 / 16 * 1rem);
  color: #333;
  letter-spacing: 0.02em;
  line-height: 1.6;
  line-height: 1.6;
}
@media screen and (max-width: 768px) {
  .p-paint-exterior-coating .technology .c-section-title {
    font-style: normal;
    font-weight: bold;
    font-size: calc(24 / 16 * 1rem);
    color: #ffffff;
    letter-spacing: inherit;
    line-height: inherit;
    padding: 12px 20px 80px;
  }
  .p-paint-exterior-coating .technology__slider {
    margin-top: -60px;
  }
  .p-paint-exterior-coating .technology__slider .swiper-slide {
    width: 150px;
    height: 150px;
  }
  .p-paint-exterior-coating .technology__reasons {
    gap: 20px;
    margin-top: 30px;
  }
  .p-paint-exterior-coating .technology__content {
    padding: 25px 15px;
  }
  .p-paint-exterior-coating .technology__number {
    width: 45px;
    height: 45px;
    font-style: normal;
    font-weight: bold;
    font-size: calc(22 / 16 * 1rem);
    color: #ffffff;
    letter-spacing: inherit;
    line-height: inherit;
    line-height: 45px;
  }
  .p-paint-exterior-coating .technology__title {
    font-style: normal;
    font-weight: bold;
    font-size: calc(22 / 16 * 1rem);
    color: #333;
    letter-spacing: inherit;
    line-height: inherit;
  }
  .p-paint-exterior-coating .technology__description {
    font-style: normal;
    font-weight: 400;
    font-size: calc(17 / 16 * 1rem);
    color: #666;
    letter-spacing: inherit;
    line-height: inherit;
  }
}
.p-paint-exterior-coating .method {
  padding: 0 0 0px;
  position: relative;
}
.p-paint-exterior-coating .method__content {
  text-align: center;
}
.p-paint-exterior-coating .method .c-section-title {
  font-style: normal;
  font-weight: bold;
  font-size: calc(28 / 16 * 1rem);
  color: #ffffff;
  letter-spacing: 0.05em;
  line-height: 1.2;
  background: #214287;
  padding: 20px 30px;
  display: block;
  position: relative;
  margin: 0;
}
.p-paint-exterior-coating .method .c-section-title::after {
  content: "";
  position: absolute;
  bottom: -15px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #214287;
}
.p-paint-exterior-coating .method__standard {
  margin-top: 40px;
}
.p-paint-exterior-coating .method__subtitle {
  font-style: normal;
  font-weight: bold;
  font-size: calc(22 / 16 * 1rem);
  color: #214287;
  letter-spacing: inherit;
  line-height: inherit;
  margin-bottom: 30px;
}
.p-paint-exterior-coating .method__table {
  background: #ffffff;
  border-radius: 15px;
  overflow: hidden;
  -webkit-box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
          box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
  margin-bottom: 25px;
  max-width: 80%;
  margin-inline: auto;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .method__table {
    max-width: 94%;
  }
}
.p-paint-exterior-coating .method__row {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 2fr;
  grid-template-columns: 1fr 2fr;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.p-paint-exterior-coating .method__row:last-child {
  border-bottom: none;
}
.p-paint-exterior-coating .method__process {
  background: #214287;
  color: #ffffff;
  padding: 20px 15px;
  font-style: normal;
  font-weight: bold;
  font-size: calc(20 / 16 * 1rem);
  color: #ffffff;
  letter-spacing: inherit;
  line-height: inherit;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.p-paint-exterior-coating .method__detail {
  padding: 20px 15px;
  font-style: normal;
  font-weight: 400;
  font-size: calc(18 / 16 * 1rem);
  color: #333;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.p-paint-exterior-coating .method__note {
  margin-top: 40px;
  max-width: 80%;
  margin-inline: auto;
  font-style: normal;
  font-weight: bold;
  font-size: calc(22 / 16 * 1rem);
  color: #214287;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.6;
  text-align: left;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .method__note {
    max-width: 94%;
  }
}
.p-paint-exterior-coating .method__note hr {
  margin: 10px 0;
  border: none;
  border-top: 1px solid #214287;
}
@media screen and (max-width: 768px) {
  .p-paint-exterior-coating .method .c-section-title {
    font-style: normal;
    font-weight: bold;
    font-size: calc(24 / 16 * 1rem);
    color: #ffffff;
    letter-spacing: inherit;
    line-height: inherit;
    padding: 12px 20px;
  }
  .p-paint-exterior-coating .method .c-section-title::after {
    bottom: -12px;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-top: 12px solid #214287;
  }
}
.p-paint-exterior-coating .method::before {
  content: "";
  position: absolute;
  bottom: -30px;
  right: 50%;
  -webkit-transform: translatex(50%);
          transform: translatex(50%);
  width: 100%;
  height: 50%;
  background: #f7f7f8;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
}
.p-paint-exterior-coating .paint {
  padding: 0 0 60px;
  background: #f7f7f8;
}
.p-paint-exterior-coating .paint__content {
  text-align: center;
}
.p-paint-exterior-coating .paint__title {
  font-style: normal;
  font-weight: bold;
  font-size: calc(22 / 16 * 1rem);
  color: #214287;
  letter-spacing: inherit;
  line-height: inherit;
  margin: 0 0 20px 0;
}
.p-paint-exterior-coating .paint__lead {
  font-style: normal;
  font-weight: 400;
  font-size: calc(20 / 16 * 1rem);
  color: #666;
  letter-spacing: inherit;
  line-height: inherit;
  margin-bottom: 30px;
}
.p-paint-exterior-coating .paint__table {
  background: #ffffff;
  border-radius: 15px;
  overflow: hidden;
  -webkit-box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
          box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
  margin-bottom: 25px;
  max-width: 90%;
  margin-inline: auto;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .paint__table {
    max-width: 94%;
  }
}
.p-paint-exterior-coating .paint__header {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1.5fr 1fr;
  grid-template-columns: 1fr 1.5fr 1fr;
  background: #214287;
  color: #ffffff;
}
.p-paint-exterior-coating .paint__header .paint__col {
  font-style: normal;
  font-weight: bold;
  font-size: calc(18 / 16 * 1rem);
  color: #ffffff;
  letter-spacing: inherit;
  line-height: inherit;
  text-align: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.p-paint-exterior-coating .paint__row {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1.5fr 1fr;
  grid-template-columns: 1fr 1.5fr 1fr;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.p-paint-exterior-coating .paint__row:last-child {
  border-bottom: none;
}
.p-paint-exterior-coating .paint__col {
  padding: 20px 15px;
  font-style: normal;
  font-weight: 400;
  font-size: calc(16 / 16 * 1rem);
  color: #666;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: left;
}
.p-paint-exterior-coating .paint__col--years {
  text-align: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.p-paint-exterior-coating .paint__note {
  font-style: normal;
  font-weight: bold;
  font-size: calc(22 / 16 * 1rem);
  color: #214287;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.6;
  text-align: left;
  max-width: 80%;
  margin-inline: auto;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .paint__note {
    max-width: 94%;
  }
}
.p-paint-exterior-coating .paint .paint-character {
  height: 200px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 30px 0;
}
.p-paint-exterior-coating .paint .paint-character img {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.p-paint-exterior-coating .problem {
  padding: 0 0 60px;
  background: white;
  border-radius: 20px;
}
.p-paint-exterior-coating .problem__content {
  text-align: left;
}
.p-paint-exterior-coating .problem__header {
  margin-bottom: 30px;
  text-align: center;
}
.p-paint-exterior-coating .problem__title {
  font-style: normal;
  font-weight: bold;
  font-size: calc(28 / 16 * 1rem);
  color: #ffffff;
  letter-spacing: 0.05em;
  line-height: 1.2;
  background: #4a90e2;
  padding: 20px 30px;
  display: block;
  position: relative;
  margin: 0;
}
.p-paint-exterior-coating .problem__title::after {
  content: "";
  position: absolute;
  bottom: -15px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #4a90e2;
}
.p-paint-exterior-coating .problem__main {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 40% 30px 1fr;
  grid-template-columns: 40% 1fr;
  gap: 30px;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  max-width: 700px;
  margin-inline: auto;
  margin-bottom: 30px;
}
@media screen and (max-width: 680px) {
  .p-paint-exterior-coating .problem__main {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
.p-paint-exterior-coating .problem__image .problem__img-pc {
  width: 100%;
  height: auto;
  border-radius: 12px;
  -webkit-box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  display: block;
}
@media screen and (max-width: 680px) {
  .p-paint-exterior-coating .problem__image .problem__img-pc {
    display: none;
  }
}
.p-paint-exterior-coating .problem__image .problem__img-sp {
  width: 100%;
  height: auto;
  border-radius: 12px;
  -webkit-box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  display: none;
}
@media screen and (max-width: 680px) {
  .p-paint-exterior-coating .problem__image .problem__img-sp {
    display: block;
  }
}
.p-paint-exterior-coating .problem__text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 15px;
}
.p-paint-exterior-coating .problem__question {
  font-style: normal;
  font-weight: bold;
  font-size: calc(22 / 16 * 1rem);
  color: #333;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.6;
  margin: 0;
}
.p-paint-exterior-coating .problem__lead {
  font-style: normal;
  font-weight: 500;
  font-size: calc(20 / 16 * 1rem);
  color: #214287;
  letter-spacing: inherit;
  line-height: inherit;
  margin: 0;
}
.p-paint-exterior-coating .problem__description {
  font-style: normal;
  font-weight: 400;
  font-size: calc(18 / 16 * 1rem);
  color: #666;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.8;
  margin: 0;
}
.p-paint-exterior-coating .problem__conclusion {
  font-style: normal;
  font-weight: bold;
  font-size: calc(20 / 16 * 1rem);
  color: #333;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.6;
  color: #214287;
  max-width: 700px;
  margin-inline: auto;
  text-align: left;
}
.p-paint-exterior-coating .signs {
  padding: 0 0 30px;
  background: #eaeaea;
}
.p-paint-exterior-coating .signs__content {
  text-align: left;
}
.p-paint-exterior-coating .signs__header {
  margin-bottom: 30px;
  text-align: center;
}
.p-paint-exterior-coating .signs__title {
  font-style: normal;
  font-weight: bold;
  font-size: calc(28 / 16 * 1rem);
  color: #ffffff;
  letter-spacing: 0.05em;
  line-height: 1.2;
  background: #4a90e2;
  padding: 20px 30px;
  display: block;
  position: relative;
  margin: 0;
}
@media (min-width: 800px) {
  .p-paint-exterior-coating .signs__title {
    font-size: 28px;
  }
}
@media (min-width: 320px) and (max-width: 799px) {
  .p-paint-exterior-coating .signs__title {
    font-size: calc(0.4166666667vw + 24.6666666667px);
  }
}
@media (max-width: 319px) {
  .p-paint-exterior-coating .signs__title {
    font-size: 26px;
  }
}
.p-paint-exterior-coating .signs__title::after {
  content: "";
  position: absolute;
  bottom: -15px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #4a90e2;
}
.p-paint-exterior-coating .signs__lead {
  font-style: normal;
  font-weight: 400;
  font-size: calc(20 / 16 * 1rem);
  color: #666;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.6;
  margin-bottom: 30px;
  max-width: 700px;
  margin-inline: auto;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .signs__lead {
    width: 95%;
  }
}
.p-paint-exterior-coating .signs__list {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 20px 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 30px;
  max-width: 700px;
  margin-inline: auto;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .signs__list {
    width: 95%;
  }
}
.p-paint-exterior-coating .signs__item {
  background: #f8f9fa;
  padding: 25px 20px;
  border-radius: 12px;
  text-align: center;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.p-paint-exterior-coating .signs__item:hover {
  -webkit-transform: translateY(-5px);
          transform: translateY(-5px);
}
.p-paint-exterior-coating .signs__icon {
  width: 60px;
  height: 60px;
  margin-bottom: 15px;
  display: block;
  margin-inline: auto;
}
.p-paint-exterior-coating .signs__text {
  font-style: normal;
  font-weight: 500;
  font-size: calc(18 / 16 * 1rem);
  color: #333;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.4;
}
@media (min-width: 800px) {
  .p-paint-exterior-coating .signs__text {
    font-size: 18px;
  }
}
@media (min-width: 320px) and (max-width: 799px) {
  .p-paint-exterior-coating .signs__text {
    font-size: calc(0.8333333333vw + 11.3333333333px);
  }
}
@media (max-width: 319px) {
  .p-paint-exterior-coating .signs__text {
    font-size: 14px;
  }
}
.p-paint-exterior-coating .signs__warning {
  font-style: normal;
  font-weight: bold;
  font-size: calc(20 / 16 * 1rem);
  color: #214287;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.6;
  max-width: 700px;
  margin-inline: auto;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .signs__warning {
    width: 95%;
  }
}
.p-paint-exterior-coating .early-action {
  padding: 0 0 60px;
  background: linear-gradient(135deg, rgba(255, 193, 7, 0.1) 0%, rgba(255, 193, 7, 0.05) 100%);
  border-radius: 20px;
}
.p-paint-exterior-coating .early-action__content {
  text-align: left;
}
.p-paint-exterior-coating .early-action__header {
  margin-bottom: 30px;
  text-align: center;
}
.p-paint-exterior-coating .early-action__title {
  font-style: normal;
  font-weight: bold;
  font-size: calc(28 / 16 * 1rem);
  color: #ffffff;
  letter-spacing: 0.05em;
  line-height: 1.2;
  background: #4a90e2;
  padding: 20px 30px;
  display: block;
  position: relative;
  margin: 0;
}
.p-paint-exterior-coating .early-action__title::after {
  content: "";
  position: absolute;
  bottom: -15px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #4a90e2;
}
.p-paint-exterior-coating .early-action__main {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 30% 30px 1fr;
  grid-template-columns: 30% 1fr;
  gap: 30px;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  margin-bottom: 30px;
  max-width: 700px;
  margin-inline: auto;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .early-action__main {
    width: 95%;
  }
}
@media screen and (max-width: 680px) {
  .p-paint-exterior-coating .early-action__main {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
.p-paint-exterior-coating .early-action__image img {
  width: 100%;
  height: auto;
  border-radius: 12px;
}
.p-paint-exterior-coating .early-action__text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.p-paint-exterior-coating .early-action__description {
  font-style: normal;
  font-weight: 400;
  font-size: calc(20 / 16 * 1rem);
  color: #666;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.8;
  margin: 0;
}
.p-paint-exterior-coating .early-action__conclusion {
  font-style: normal;
  font-weight: bold;
  font-size: calc(22 / 16 * 1rem);
  color: #333;
  letter-spacing: inherit;
  line-height: inherit;
  color: #ff6b35;
  text-align: left;
  max-width: 700px;
  margin-inline: auto;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .early-action__conclusion {
    width: 95%;
  }
}
@media screen and (max-width: 680px) {
  .p-paint-exterior-coating .early-action__conclusion {
    text-align: left;
  }
}
.p-paint-exterior-coating .consideration {
  background: #eaf1f8;
  padding: 0 0 60px;
}
.p-paint-exterior-coating .consideration__header {
  margin-bottom: 60px;
  text-align: center;
}
.p-paint-exterior-coating .consideration__title {
  font-style: normal;
  font-weight: bold;
  font-size: calc(28 / 16 * 1rem);
  color: #ffffff;
  letter-spacing: 0.05em;
  line-height: 1.2;
  background: #4a90e2;
  padding: 20px 30px;
  display: block;
  position: relative;
  margin: 0;
}
.p-paint-exterior-coating .consideration__title::after {
  content: "";
  position: absolute;
  bottom: -15px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #4a90e2;
}
.p-paint-exterior-coating .consideration__content {
  text-align: left;
  max-width: 600px;
  margin-inline: auto;
}
.p-paint-exterior-coating .consideration__lead {
  font-style: normal;
  font-weight: 400;
  font-size: calc(20 / 16 * 1rem);
  color: #666;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.6;
  margin-bottom: 30px;
  max-width: 600px;
  margin-inline: auto;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .consideration__lead {
    width: 95%;
  }
}
.p-paint-exterior-coating .consideration__speech-bubble {
  position: relative;
  display: block;
  width: 100%;
  margin-bottom: 60px;
  padding: 20px;
  border: 2px solid #064992;
  border-radius: 8px;
  background-color: #ffffff;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .consideration__speech-bubble {
    width: 95%;
  }
}
.p-paint-exterior-coating .consideration__speech-bubble::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  border-style: solid;
  border-width: 16px 15px 0 15px;
  border-color: #064992 transparent transparent;
  translate: -50% 100%;
}
.p-paint-exterior-coating .consideration__speech-bubble::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  border-style: solid;
  border-width: 13.1px 12.3px 0 12.3px;
  border-color: #ffffff transparent transparent;
  translate: -50% 100%;
}
.p-paint-exterior-coating .consideration__reasons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 15px;
}
.p-paint-exterior-coating .consideration__reason {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 15px;
  padding: 10px 0;
}
.p-paint-exterior-coating .consideration__icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 30px;
  height: 30px;
  background: #064992;
  border-radius: 50%;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.p-paint-exterior-coating .consideration__icon .material-icons {
  color: #ffffff;
  font-size: 18px;
}
.p-paint-exterior-coating .consideration__text {
  font-style: normal;
  font-weight: 500;
  font-size: calc(18 / 16 * 1rem);
  color: #333;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.4;
  margin: 0;
}
.p-paint-exterior-coating .consideration__conclusion {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 20px;
  max-width: 700px;
  margin-inline: auto;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .consideration__conclusion {
    width: 95%;
  }
}
.p-paint-exterior-coating .consideration__conclusion-character {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 120px;
  height: 120px;
}
.p-paint-exterior-coating .consideration__conclusion-character img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.p-paint-exterior-coating .consideration__conclusion-text {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-style: normal;
  font-weight: bold;
  font-size: calc(20 / 16 * 1rem);
  color: #214287;
  letter-spacing: 0.02em;
  line-height: 1.6;
  line-height: 1.6;
}
.p-paint-exterior-coating .consideration__conclusion-text p {
  margin: 0;
}
.p-paint-exterior-coating .anxiety {
  padding: 0 0 60px;
  background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#cce3fb));
  background: linear-gradient(180deg, #ffffff 0%, #cce3fb 100%);
}
.p-paint-exterior-coating .anxiety__content {
  text-align: left;
  max-width: 640px;
  margin-inline: auto;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .anxiety__content {
    width: 95%;
  }
}
.p-paint-exterior-coating .anxiety__header {
  margin-bottom: 60px;
  text-align: center;
}
.p-paint-exterior-coating .anxiety__title {
  font-style: normal;
  font-weight: bold;
  font-size: calc(28 / 16 * 1rem);
  color: #ffffff;
  letter-spacing: 0.05em;
  line-height: 1.2;
  background: #4a90e2;
  padding: 20px 30px;
  display: block;
  position: relative;
  margin: 0;
}
@media (min-width: 800px) {
  .p-paint-exterior-coating .anxiety__title {
    font-size: 28px;
  }
}
@media (min-width: 320px) and (max-width: 799px) {
  .p-paint-exterior-coating .anxiety__title {
    font-size: calc(0.4166666667vw + 24.6666666667px);
  }
}
@media (max-width: 319px) {
  .p-paint-exterior-coating .anxiety__title {
    font-size: 26px;
  }
}
.p-paint-exterior-coating .anxiety__title::after {
  content: "";
  position: absolute;
  bottom: -15px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #4a90e2;
}
.p-paint-exterior-coating .anxiety__subtitle {
  font-style: normal;
  font-weight: bold;
  font-size: calc(22 / 16 * 1rem);
  color: #333;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.6;
  margin-bottom: 20px;
}
.p-paint-exterior-coating .anxiety__lead {
  font-style: normal;
  font-weight: 400;
  font-size: calc(20 / 16 * 1rem);
  color: #333;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.6;
  margin-bottom: 30px;
}
.p-paint-exterior-coating .anxiety__questions {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 20px 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 30px 0;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .anxiety__questions {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}
.p-paint-exterior-coating .anxiety__question {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.p-paint-exterior-coating .anxiety__speech-bubble {
  position: relative;
  padding: 15px 20px;
  border: 2px solid #064992;
  border-radius: 8px;
  background-color: #ffffff;
  margin-bottom: 10px;
  min-height: 88px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.p-paint-exterior-coating .anxiety__text {
  font-style: normal;
  font-weight: 400;
  font-size: calc(18 / 16 * 1rem);
  color: #243969;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.5;
  margin: 0;
}
.p-paint-exterior-coating .anxiety__conclusion {
  font-style: normal;
  font-weight: 400;
  font-size: calc(18 / 16 * 1rem);
  color: #333;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.8;
  max-width: 700px;
  margin-inline: auto;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .anxiety__conclusion {
    width: 95%;
  }
}
.p-paint-exterior-coating .message {
  padding: 60px 0;
  background: #eaf1f8;
}
.p-paint-exterior-coating .message__decoration {
  text-align: center;
  margin-bottom: 30px;
}
.p-paint-exterior-coating .message__decoration img {
  width: 84px;
  height: 22px;
}
.p-paint-exterior-coating .message__content {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 35% 1fr;
  grid-template-columns: 35% 1fr;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  text-align: left;
  max-width: 700px;
  margin-inline: auto;
}
@media screen and (max-width: 680px) {
  .p-paint-exterior-coating .message__content {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
.p-paint-exterior-coating .message__profile {
  text-align: center;
}
.p-paint-exterior-coating .message__profile img {
  width: 160px;
  height: 160px;
  max-width: 160px;
  border-radius: 50%;
  -o-object-fit: cover;
     object-fit: cover;
  margin-bottom: 15px;
  border: 4px solid #214287;
}
.p-paint-exterior-coating .message__name {
  font-style: normal;
  font-weight: bold;
  font-size: calc(20 / 16 * 1rem);
  color: #333;
  letter-spacing: inherit;
  line-height: inherit;
  margin-bottom: 5px;
}
.p-paint-exterior-coating .message__position {
  font-style: normal;
  font-weight: 400;
  font-size: calc(16 / 16 * 1rem);
  color: #666;
  letter-spacing: inherit;
  line-height: inherit;
}
.p-paint-exterior-coating .message__text p {
  font-style: normal;
  font-weight: 400;
  font-size: calc(18 / 16 * 1rem);
  color: #666;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.8;
  margin-bottom: 15px;
}
.p-paint-exterior-coating .message__text p:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 680px) {
  .p-paint-exterior-coating .message__text {
    max-width: 95%;
    margin-inline: auto;
  }
}
.p-paint-exterior-coating .flow {
  padding: 0 0 60px;
  background: linear-gradient(135deg, rgba(40, 167, 69, 0.05) 0%, rgba(40, 167, 69, 0.1) 100%);
  border-radius: 20px;
}
.p-paint-exterior-coating .flow__content {
  text-align: center;
}
.p-paint-exterior-coating .flow__header {
  margin-bottom: 30px;
  text-align: center;
}
.p-paint-exterior-coating .flow__title {
  font-style: normal;
  font-weight: bold;
  font-size: calc(28 / 16 * 1rem);
  color: #ffffff;
  letter-spacing: 0.05em;
  line-height: 1.2;
  background: #214287;
  padding: 20px 30px;
  display: block;
  position: relative;
  margin: 0;
}
.p-paint-exterior-coating .flow__title::after {
  content: "";
  position: absolute;
  bottom: -15px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #214287;
}
.p-paint-exterior-coating .flow__steps {
  max-width: 600px;
  margin-inline: auto;
  margin: 40px auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 20px;
}
@media screen and (max-width: 480px) {
  .p-paint-exterior-coating .flow__steps {
    width: 95%;
  }
}
.p-paint-exterior-coating .flow__step {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 80px 1fr;
  grid-template-columns: 80px 1fr;
  background: #ffffff;
  border-radius: 12px;
  overflow: hidden;
  -webkit-box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.p-paint-exterior-coating .flow__step:hover {
  -webkit-transform: translateY(-5px);
          transform: translateY(-5px);
}
.p-paint-exterior-coating .flow__step-number {
  background: #12529e;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 20px 0;
}
.p-paint-exterior-coating .flow__number {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 50px;
  height: 50px;
  background: #ffffff;
  color: #12529e;
  border: 2px solid #12529e;
  border-radius: 50%;
  font-style: normal;
  font-weight: bold;
  font-size: calc(22 / 16 * 1rem);
  color: #12529e;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1;
}
.p-paint-exterior-coating .flow__step-content {
  padding: 20px;
  border: 1px solid #12529e;
  border-left: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 0 12px 12px 0;
  text-align: left;
}
.p-paint-exterior-coating .flow__step-title {
  font-style: normal;
  font-weight: bold;
  font-size: calc(20 / 16 * 1rem);
  color: #12529e;
  letter-spacing: inherit;
  line-height: inherit;
  margin-bottom: 8px;
  line-height: 1.4;
}
.p-paint-exterior-coating .flow__step-description {
  font-style: normal;
  font-weight: 400;
  font-size: calc(16 / 16 * 1rem);
  color: #333;
  letter-spacing: inherit;
  line-height: inherit;
  line-height: 1.4;
  margin: 0;
}
.p-paint-exterior-coating .flow__note {
  font-style: normal;
  font-weight: 500;
  font-size: calc(18 / 16 * 1rem);
  color: #214287;
  letter-spacing: inherit;
  line-height: inherit;
  margin-top: 30px;
}