@charset "UTF-8";

/* 上マージン */
.margintop{
  margin-top: 200px;
}

/* 下マージン */
.container {
  padding-bottom: 80px;
}


/* 背景グレー*/
.bg-gray{
  background-color: #F6F6F5;
  border-radius: 15px;
  padding: 20px 34px 20px;
  /* width: 980px; */
  /* line-height: 2em; */
} 

p{
  font-weight: bold;
}

/* --------------------------------------------------- */
/* h2の体裁 */
h2 {
  position: relative; 
  left: 82px;                         /* ← 基準とする */
  width: 820px;                              /* 見出しの幅 */
  line-height: 82px; /* ← 高さと同じ値にする！ */
 
  background-image: url("../images/sub5_Q&A/heading_faq_02.png");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: cover;
  margin-top: 30px;
  margin-bottom: 20px;
  /* display: flex;   */
  text-align: center;/* テキストを縦中央に揃える */
  padding-bottom: 10px;
font-size: 32px;

}

.heading2{
  margin-right: 82px;
}

/* .heading2の前に画像をつける */
h2::before {
  content: "";
  position: absolute;
  top: 0;
  left: -82px;                                 /* ← 左端に配置 */
  width: 82px;          /* 画像サイズ調整 */
  height: 82px;
  background-image: url("../images/sub5_Q&A/heading_faq_01.png"); /* ← ここに画像URL */
  background-size: contain;          /* 画像が枠に収まるように */
  background-repeat: no-repeat;
}



/* ← 右端の画像を配置する */
h2::after {
  content: "";
  position: absolute;
  top: 0;
  right: -78px;                                 /* ← 右端に配置 */
  width: 78px;
  height: 83px;
  background-image: url("../images/sub5_Q&A/heading_faq_03.png");
  background-size: contain;
  background-repeat: no-repeat;
}

  .heading3 {
    /* display: inline-block; *//* 文字幅に合わせる！ */
    background-image: url("../images/sub5_Q&A/heading_faq_04.png"); /* 背景画像 */  
    background-repeat: no-repeat;
    background-position: left bottom;       /* 左　下寄せ */
    background-size: cover;
    color: #F06E6E;
    margin-top: 20px;
    margin-bottom: 10px;
  }



/* ---------------------------------- */
/* 質問のanswerを表示しないでおく */
.answer {
  display: none;
}

.quest{
  margin-bottom: 20px;

}

.answer{
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: 36px;
 
 
 

}


/* 質問の前に画像をつける */
.with-icon::before {
  content: "";
  display: inline-block;
  width: 20px;          /* 画像サイズ調整 */
  height: 20px;
  background-image: url("../images/sub5_Q&A/btn1.png"); 
  background-size: contain;          /* 画像が枠に収まるように */
  background-repeat: no-repeat;
  vertical-align: middle;            /* テキストと高さを揃える */
  margin-right: 8px;                 /* テキストとの間隔 */
}