/* ==========================================
   諫早市・大村市 専用ブロック
========================================== */

.so-area-section{
  padding:75px 0;
}

.so-area-box{
  max-width:950px;
  margin:0 auto;
  padding:50px 45px;

  background:#ffffff;

  border-top:5px solid #123f6d;

  box-shadow:
    0 8px 30px rgba(18,63,109,.12);

  text-align:center;
}

.so-area-label{
  color:#c7a85a;
  font-family:Arial,sans-serif;
  font-size:13px;
  font-weight:bold;
  letter-spacing:4px;
  margin-bottom:10px;
}

.so-area-box h2{
  margin:0;

  color:#123f6d;

  font-size:31px;
  line-height:1.55;
  font-weight:bold;
}

.so-area-line{
  width:55px;
  height:3px;

  margin:20px auto 25px;

  background:#c7a85a;
}

.so-area-main{
  font-size:18px;
  line-height:2;
  color:#35424c;
}

.so-area-main strong{
  color:#123f6d;
  font-size:20px;
}

.so-area-text{
  max-width:750px;

  margin:15px auto 30px;

  color:#56636d;

  font-size:15px;
  line-height:2;
}


/* 3つのポイント */

.so-area-points{
  display:grid;

  grid-template-columns:
    repeat(3,1fr);

  gap:15px;

  margin:35px 0;
}

.so-area-point{
  padding:25px 15px;

  background:#f2f7fb;

  border-top:3px solid #123f6d;
}

.so-area-point span{
  display:block;

  color:#c7a85a;

  font-family:Arial,sans-serif;
  font-size:12px;
  font-weight:bold;

  margin-bottom:5px;
}

.so-area-point strong{
  display:block;

  color:#123f6d;

  font-size:18px;

  margin-bottom:6px;
}

.so-area-point p{
  margin:0;

  color:#606b73;

  font-size:12px;
  line-height:1.7;
}


/* お客様の疑問 */

.so-area-question{
  max-width:700px;

  margin:35px auto;

  padding:27px 25px;

  background:#f7f5ef;

  border-left:4px solid #c7a85a;

  text-align:left;
}

.so-area-question p{
  position:relative;

  margin:7px 0;

  padding-left:24px;

  color:#38454f;

  font-size:15px;
}

.so-area-question p:before{
  content:"✓";

  position:absolute;

  left:0;

  color:#123f6d;

  font-weight:bold;
}

.so-area-question strong{
  display:block;

  margin-top:18px;

  color:#123f6d;

  text-align:center;

  font-size:16px;
}

.so-area-small{
  text-align:center;

  margin:12px 0 0;

  color:#707b83;

  font-size:12px;
}


/* ==========================================
   FAQ
========================================== */

.so-faq-section{
  background:#ffffff;
}

.so-faq{
  max-width:900px;

  margin:0 auto;
}

.so-faq-item{
  margin-bottom:12px;

  background:#ffffff;

  border:1px solid #d8e3eb;

  box-shadow:
    0 3px 12px rgba(18,63,109,.06);
}

.so-faq-item summary{
  position:relative;

  display:flex;

  align-items:center;

  gap:15px;

  padding:20px 50px 20px 20px;

  color:#263b4c;

  font-size:16px;
  font-weight:bold;

  cursor:pointer;

  list-style:none;
}

.so-faq-item summary::-webkit-details-marker{
  display:none;
}

.so-faq-item summary:after{
  content:"+";

  position:absolute;

  right:20px;

  top:50%;

  transform:translateY(-50%);

  color:#123f6d;

  font-family:Arial,sans-serif;

  font-size:26px;

  font-weight:normal;
}

.so-faq-item[open] summary:after{
  content:"−";
}

.so-q{
  display:flex;

  align-items:center;
  justify-content:center;

  flex:0 0 36px;

  width:36px;
  height:36px;

  border-radius:50%;

  background:#123f6d;

  color:#ffffff;

  font-family:Arial,sans-serif;

  font-size:17px;
}

.so-answer{
  display:flex;

  gap:15px;

  padding:
    0 25px 22px 20px;

  border-top:
    1px solid #edf1f4;
}

.so-a{
  display:flex;

  align-items:center;
  justify-content:center;

  flex:0 0 36px;

  width:36px;
  height:36px;

  margin-top:18px;

  border-radius:50%;

  background:#c7a85a;

  color:#ffffff;

  font-family:Arial,sans-serif;

  font-size:17px;
  font-weight:bold;
}

.so-answer p{
  margin:0;

  padding-top:17px;

  color:#53606a;

  font-size:14px;

  line-height:1.9;
}


/* FAQ下CTA */

.so-faq-cta{
  max-width:800px;

  margin:50px auto 0;

  padding:40px 25px;

  text-align:center;

  color:#ffffff;

  background:
    linear-gradient(
      135deg,
      #0a345d,
      #1c5b8e
    );

  border-bottom:4px solid #c7a85a;

  box-shadow:
    0 8px 25px rgba(18,63,109,.15);
}

.so-faq-cta-small{
  color:#efd783;

  font-size:13px;

  letter-spacing:1px;
}

.so-faq-cta h3{
  margin:10px 0 15px;

  color:#ffffff !important;

  font-size:26px;

  line-height:1.6;
}

.so-faq-cta p{
  margin:0 0 18px;

  color:#ffffff;

  font-size:14px;

  line-height:1.8;
}


/* ==========================================
   スマホ
========================================== */

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

  .so-area-section{
    padding:50px 0;
  }

  .so-area-box{
    padding:35px 17px;
  }

  .so-area-box h2{
    font-size:24px !important;
  }

  .so-area-main{
    font-size:15px;
  }

  .so-area-main strong{
    font-size:17px;
  }

  .so-area-text{
    text-align:left;

    font-size:14px;
  }

  .so-area-points{
    grid-template-columns:1fr;

    gap:9px;
  }

  .so-area-point{
    padding:18px 12px;
  }

  .so-area-question{
    padding:20px 15px;
  }

  .so-area-question p{
    font-size:14px;
  }

  .so-area-question strong{
    text-align:left;

    font-size:14px;
  }

  .so-faq-item summary{
    gap:10px;

    padding:
      17px 42px 17px 12px;

    font-size:14px;

    line-height:1.6;
  }

  .so-q{
    flex-basis:31px;

    width:31px;
    height:31px;

    font-size:15px;
  }

  .so-answer{
    gap:10px;

    padding:
      0 15px 18px 12px;
  }

  .so-a{
    flex-basis:31px;

    width:31px;
    height:31px;

    font-size:15px;
  }

  .so-answer p{
    font-size:13px;
  }

  .so-faq-cta{
    margin-top:35px;

    padding:32px 15px;
  }

  .so-faq-cta h3{
    font-size:21px !important;
  }

}