.cmn-cnt {
  display: flex;
  flex-direction: column;
  background: url(/system_panel/uploads/images/bg_cmn-contact01.jpg) no-repeat center center/cover;
}
@media screen and (min-width: 1100px) {
  .cmn-cnt {
    flex-direction: row;
  }
}

.cmn-faq {
  padding-block: clamp(6rem, 5rem + 2.59vw, 10rem);
  padding-inline: 15px;
  position: relative;
}
@media screen and (min-width: 768px) {
  .cmn-faq {
    padding-inline: 90px;
  }
}
@media screen and (min-width: 1100px) {
  .cmn-faq {
    width: 50%;
    padding-inline: 40px;
  }
}
.cmn-faq::before {
  content: "";
  width: 90%;
  height: 1px;
  background-color: #ccc;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (min-width: 1024px) {
  .cmn-faq::before {
    width: 1px;
    height: 90%;
    position: absolute;
    top: 50%;
    right: 0;
    left: auto;
    transform: translate(0, -50%);
  }
}
.cmn-faq__inr {
  display: grid;
  grid-template-rows: auto;
  grid-template-columns: auto;
  grid-template-areas: "cmn-faq__ttl" "cmn-faq__cnt" "cmn-faq__btn";
  gap: clamp(4rem, 3rem + 2.54vw, 5rem) 30px;
  max-width: 660px;
  width: 100%;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .cmn-faq__inr {
    grid-template-columns: 1fr 160px;
    grid-template-areas: "cmn-faq__ttl cmn-faq__btn" "cmn-faq__cnt cmn-faq__cnt";
  }
}
.cmn-faq__ttl {
  grid-area: cmn-faq__ttl;
}
@media screen and (min-width: 1024px) {
  .cmn-faq__ttl .cmn-ttl__main {
    font-size: min(3.2vw, 3.6rem);
  }
}
.cmn-faq .faq__list {
  grid-area: cmn-faq__cnt;
}
.cmn-faq__btn {
  grid-area: cmn-faq__btn;
}
@media screen and (min-width: 768px) {
  .cmn-faq__btn {
    align-self: flex-end;
  }
}

.cmn-contact {
  width: 100%;
  padding-block: clamp(6rem, 5rem + 2.59vw, 10rem);
  padding-inline: 15px;
}
@media screen and (min-width: 768px) {
  .cmn-contact {
    padding-inline: 90px;
  }
}
@media screen and (min-width: 1100px) {
  .cmn-contact {
    width: 50%;
    padding-inline: 40px 90px;
  }
}
.cmn-contact__inr {
  max-width: 660px;
  width: 100%;
  margin-inline: auto;
}
.cmn-contact__catch {
  font-size: clamp(2rem, 1.6rem + 1.02vw, 2.4rem);
  letter-spacing: 0.025em;
  color: #000;
  margin-top: 30px;
}
.cmn-contact__txt {
  font-size: clamp(1.6rem, 1.4rem + 0.51vw, 1.8rem);
  letter-spacing: 0.05em;
  margin-top: 30px;
}
.cmn-contact__btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(2rem, 1rem + 2.54vw, 3rem);
  margin-top: clamp(4rem, 3rem + 2.54vw, 5rem);
}
.cmn-contact__btn-item {
  max-width: 660px;
  width: 100%;
}
.cmn-contact__btn-link {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  border-radius: 5px;
}
.cmn-contact__btn-inr {
  display: flex;
  align-items: center;
  gap: 25px;
  width: clamp(31rem, 25.3rem + 15.27vw, 37rem);
}
.cmn-contact__btn-icon {
  display: flex;
  align-items: center;
}
.cmn-contact__btn-txt {
  flex: 1;
  font-size: clamp(2rem, 1.6rem + 1.02vw, 2.4rem);
  letter-spacing: 0.025em;
  line-height: 80px;
  color: #fff;
  text-align: center;
  position: relative;
}
@media screen and (min-width: 768px) {
  .cmn-contact__btn-txt {
    line-height: 100px;
  }
}
.cmn-contact__btn-item.--tel .cmn-contact__btn-link {
  background-color: #42382f;
}
.cmn-contact__btn-item.--tel .cmn-contact__btn-icon {
  width: 30px;
  aspect-ratio: 30/31;
}
.cmn-contact__btn-item.--tel .cmn-contact__btn-txt {
  font-family: "EB Garamond", serif;
  font-size: clamp(3rem, 2.4rem + 1.53vw, 3.6rem);
}
.cmn-contact__btn-item.--line .cmn-contact__btn-link {
  background-color: #06c755;
}
.cmn-contact__btn-item.--line .cmn-contact__btn-icon {
  width: 36px;
  aspect-ratio: 1;
}
.cmn-contact__btn-item.--line .cmn-contact__btn-txt {
  color: #fff;
}
.cmn-contact__btn-item.--insta .cmn-contact__btn-link {
  background-color: #fff;
  border: solid 2px #42382f;
}
.cmn-contact__btn-item.--insta .cmn-contact__btn-icon {
  width: 36px;
  aspect-ratio: 1;
}
.cmn-contact__btn-item.--insta .cmn-contact__btn-txt {
  color: #42382f;
}