/* ==============================
   しろぼん最適化ページ 2ボタン共通CSS（整理版）
   ============================== */
.f_w_b {font-weight:600;}
.result_box {background:#fff; padding:3%; margin:0 4%;}
.result_text {font-size:28px; line-height: 1.5em;}
.c_red {color:#E94C4C;}
.result_figure {line-height: 1.3em; font-size:48px; border-bottom:#2B4B71 solid 3px;}
.p_b_20 {padding-bottom:20px;}


/* --- 共通（PC基準） --- */
.opt-button-list.opt-button-double{
  display:flex; flex-wrap:wrap; justify-content:center; align-items:stretch;
  gap:16px; margin:0; padding:0;
}
.opt-button-list.opt-button-double>li{
  flex:1 1 280px; list-style:none; margin:0; display:flex;
}
.opt-button-list.opt-button-double>li>a{
  display:flex; align-items:center; justify-content:center; position:relative;
  width:100%; height:100%;
  padding:16px 56px 16px 20px;  /* 右は矢印分 */
  border-radius:8px; background:#4AAC15!important; color:#fff; font-weight:600;
  text-decoration:none; text-align:center; line-height:1.4; transition:background .2s ease;
  box-shadow:0 8px 0 #318b00!important; box-sizing:border-box;
}
.opt-button-list.opt-button-double>li.opt-button02>a:hover{
  background:#6EBD44!important; box-shadow:0 8px 0 #318b00;
}
/* 右矢印 */
.opt-button-list.opt-button-double>li>a::after{
  content:""; position:absolute; right:18px; top:50%; transform:translateY(-50%);
  width:30px; height:30px;
  background:url("https://shirobon.net/optimize/img/icon_arrow01.svg") no-repeat center/contain;
  pointer-events:none; z-index:1;
}
/* 補助クラス */
.opt-button-list .small,.opt-button-list .small_2{display:block; font-size:12px; line-height:1.3; margin-bottom:4px;}
.btn_2_text{font-size:28px!important;}
.btn_02_out_box{padding:3% 5%;}
.p_30{padding-bottom:3%;}
.opt-inquiry-wrapper{padding:3%!important;}

/* フッター直前の2ボタンはPCでは非表示 */
.main-opt .opt-bottom-menu{display:none!important;}

/* --- スマホ（Windowsズーム対策で device-width も併記） --- */
@media screen and (max-width:820px), screen and (max-device-width:820px){
  /* 通常の2ボタンは縦並び */
  .opt-button-list.opt-button-double{flex-direction:column!important; align-items:stretch; gap:12px;}
  .opt-button-list.opt-button-double>li{flex:1 1 auto!important; width:100%!important; display:block; margin:0!important;}
  .opt-button-list.opt-button-double>li>a{
    height:auto!important; min-height:72px;
    padding:14px 48px 14px 16px!important;
    font-size:clamp(16px,4.2vw,18px); line-height:1.4; box-shadow:0 6px 0 #318b00;
  }
  .opt-button-list.opt-button-double>li>a::after{right:12px!important; width:22px; height:22px;}
  .br_sp_none{display:none;}
  .btn_2_text{font-size:18px!important;}

  /* フッター直前の2ボタンだけ横並び＋SPで表示 */
  .main-opt .opt-bottom-menu{display:block!important;}
  .main-opt .opt-bottom-menu .opt-button-list.opt-button-double.menu_btn{
    display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important;
    justify-content:center!important; align-items:center!important; gap:10px!important;
    padding:10px 0!important; margin:0; list-style:none;
  }
  .main-opt .opt-bottom-menu .menu_btn>li{
    flex:1 1 48%!important; width:auto!important; margin:0!important; display:flex!important;
  }
  .main-opt .opt-bottom-menu .menu_btn>li>a{
    display:flex!important; align-items:center!important; justify-content:center!important; height:100%!important;
  }
}
