@charset "utf-8";

/* contact.html用の設定 */

.container h2 {
    margin-top: 24px;
}
.container p {
    margin-top: 12px;
}

/* よくある質問 */

.mark1 {
    background: linear-gradient(transparent 40%, pink 80%);
}
.mark2 {
    background: linear-gradient(transparent 40%, rgb(214, 182, 243) 80%);
}

/* Q&A 全体の枠取り */
.quest {
    margin: 0 auto;
    /* max-width: 800px; */
}

/* タイトル */
.quest h2 {
    margin-top: 64px;
}

/* アコーディオン全体 */
.acc_wrap {
    /* max-width: 800px; */
    margin: 0;
    /* width: 95%; */
}
  
/* アコーディオン 　行ごとに色分け*/
.acc_item {
    margin-top: 10px;
    background: rgb(196, 245, 196);
}
.acc_item2 {
    margin-top: 10px;
    /* background: rgb(196, 234, 245); */
    background: white;
} 

/* アコーディオンのタイトル */
.acc_title {
    position: relative;
    padding: 15px 60px 15px 20px;
    font-size: 14px;
    cursor: pointer;
     /* (+)アイコン */
    &::before,
    &::after {
      content: "";
      position: absolute;
      right: 20px;
      top: 0;
      bottom: 0;
      margin: auto 0;
      background-color: black;
      width: 20px;
      height: 2px;
      transition: transform ease 0.2s, opacity ease 0.2s;
    }
    &::after {
        transform: rotate(90deg);
    }
}
/* アコーディオン展開時の(-)アイコン */
.acc_title.is-active {
    &::before {
      transform: rotate(180deg);
    }
    &::after {
      transform: rotate(180deg);
      opacity: 0;
    }
}
  
/* アコーディオンのコンテンツ */
.acc_content {
    /* padding: 0 20px 15px 20px; */
    padding: 0;
    display: none;
    font-size: 14px;
}

/* 表示画面設定 PC */
@media(min-width:600px) {
    .acc_title {
        font-weight: bold;
    }
}