@charset "UTF-8";
/* ================================================
txt-pagettl-cmn
================================================ */
.txt-pagettl-cmn{
  margin-bottom: 50px;
}

/* ================================================
セクション
================================================ */
.area-sec{
  max-width: 1200px;
}
.area-sec + .area-sec{
  margin-top: 100px;
}
.area-sec--last{
  margin-bottom: 150px;
}
.area-sec__ttl{
  display: flex;
  gap: 0 10px;
  padding: 0 0 15px 0;
  /* border-bottom: 1px solid #000; */
  color: #00aecb;
  font-size: 34px;
  line-height: 1.4;
}
.area-sec__ttl::before{
  margin: 0.2em 0 0;
  content: "";
  display: block;
  width: 1.7rem;
  height: 1.7rem;
  background: #00aecb;
}

.area-sec__list{
  display: flex;
  flex-direction: column;
  gap: 10px 0;
}

/* アコーディオン */
.area-sec-accordion__btn{
  position: relative;
  padding: 15px 35px 15px 25px;
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  border: 1px solid #00698a;
  font-size: 18px;
  transition: opacity 0.3s;
  color: #00698a;
  background: #e3eef5;
  cursor: pointer;

}

.area-sec-accordion__btn:hover{
  opacity: 0.7;
}

.area-sec-accordion__btn:before,
.area-sec-accordion__btn:after{
  position: absolute;
  content: "";
  display: block;
  width: 20px;
  height: 2px;
  background: #00698a;
}
.area-sec-accordion__btn:before{
  inset: 0 20px 0 auto;
  margin: auto 0;
  transform: rotate(90deg);
  transition: transform 0.3s;
}
.area-sec-accordion__btn:after{
  inset: 0 20px 0 auto;
  margin: auto 0;
}
.area-sec-accordion__btn.is-open:before{
  transform: rotate(0deg);
}
.area-sec-accordion__content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  display: none;
}

.area-sec-accordion__in{
  padding: 10px 10px 20px;
}