
/* ----------------------------------------
#option  update 2020.01.10
---------------------------------------- */

.wrapper .sec-inner {
  box-sizing: border-box;
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, sans-serif;
  margin: 0 auto;
  padding: 60px 0;
  width: 1040px;
}

.sec-inner .sec-ttl {
  color: #5AB7EC;
  font-size: 32px;
  margin-bottom: 15px;
  text-align: center;
}

.sec-inner .sec-ttl::after {
  content: "";
  background-color: #5AB7EC;
  display: block;
  height: 2px;
  margin: 15px auto 0;;
  text-align: center;
  width: 120px;
}

.lead-txt {
  font-size: 20px;
  margin-bottom: 40px;
  text-align: center;
}

#option .lead-txt .baloon {
  position: relative;
}


#option .lead-txt .baloon::before {
  content: "";
  background: url(/images/hokan_b/item/img_option_baloon_taisetsu.svg) no-repeat;
  display: block;
  height: 57px;
  position: absolute;
  top: -50px;
  left: -160px;
  width: 161px;
}

.flex {
  display: flex;
  flex-wrap: wrap;
}

.option-box {
  margin-bottom: 20px;
  padding: 20px;
  width: 480px;
}

.option-box figure {
  margin-bottom: 20px;
  text-align: center;
}

.option-box figure img {
  max-width: 100%;
}

.option-box h3 {
  color: #415E8D;
  font-size: 26px;
  margin-bottom: 10px;
}

.btn-area {
  padding: 60px 0 20px;
  text-align: center;
}


/* --- media 700px以下 --- */
@media (max-width: 700px) {
.wrapper .sec-inner {
  padding: 60px 20px;
  width: 100%;
}

.sec-inner .sec-ttl {
  font-size: 24px;
}

.lead-txt {
  font-size: 14px;
  margin-bottom: 20px;
}

#option .lead-txt .baloon::before {
  background-size: 100% auto;
  height: 36px;
  margin-bottom: 10px;
  position: static;
  width: 100px;
}


}/* --- media 700px以下 --- */
