/* ============================================
   事務所概要ページ 追加CSS
   ============================================ */
.p-office-summary.img-box .img-box__content-wrap {
  width: calc(66.6666% - 40px);
}
.p-office-summary.img-box .img-box__img-wrap {
  width: calc(33.3333% - 40px);
}
.p-office-summary.img-box .img-box__img-wrap img {
  width: 100%;
  height: auto;
}
@media screen and (max-width: 767px) {
  .p-office-summary.img-box .img-box__content-wrap,
  .p-office-summary.img-box .img-box__img-wrap {
    width: 100%;
  }
}
.p-office-map {
  height: 450px;
}
@media screen and (max-width: 767px) {
  .p-office-map {
    height: 280px;
  }
}
.box.col4 .box__content img {
  width: 100%;
  height: auto;
  display: block;
}

.gyomu-btn-grid-top {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-bottom: 8px;
}

.gyomu-btn-grid-bottom {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 20px;
  width: 75%;
  margin-left: auto;
  margin-right: auto;
}

.gyomu-btn {
  background: #5B9BD5;
  color: #fff;
  border-radius: 10px;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  text-align: center;
  box-sizing: border-box;
  height: 72px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/* スマホ対応 */
@media (max-width: 767px) {
  .gyomu-btn-grid-top {
    grid-template-columns: repeat(2, 1fr);
  }

  .gyomu-btn-grid-bottom {
    grid-template-columns: repeat(2, 1fr);
    width: 100%;
  }

  .gyomu-btn {
    height: auto;
    padding: 12px;
  }
}

/* =========================================
   page-service_daikou_gyomu 追加CSS
   ========================================= */

/* --- コンセプトカード --- */
.p-daikou-gyomu__concept-list{display:flex;gap:20px;list-style:none;padding:0}
.p-daikou-gyomu__concept-item{flex:1;border-radius:8px;padding:24px 20px}
.p-daikou-gyomu__concept-item.bg1{background-color:#e8f4fb;border-top:5px solid #009AD7}
.p-daikou-gyomu__concept-item.bg2{background-color:#fef9e7;border-top:5px solid #f0a500}
.p-daikou-gyomu__concept-item.bg3{background-color:#edfbf0;border-top:5px solid #27ae60}
.p-daikou-gyomu__concept-num{font-size:3rem;font-weight:700;color:#193771;margin-bottom:6px}
.p-daikou-gyomu__concept-lead{font-size:1.4rem;color:#555;margin-bottom:4px}
.p-daikou-gyomu__concept-title{font-size:1.9rem;font-weight:700;color:#193771;margin-bottom:10px;line-height:1.4}
.p-daikou-gyomu__concept-footer{text-align:center;font-size:1.8rem;font-weight:600;color:#193771;padding:18px 20px;background-color:#f3f4f6;border-radius:6px}

/* --- ブロック見出し --- */
.p-daikou-gyomu__block-lead{display:inline-block;padding:8px 20px;font-size:1.7rem;font-weight:700;color:#fff;background-color:#193771;border-radius:4px}

/* --- 各業務アイテム --- */
.p-daikou-gyomu__item{border:1px solid #ccd2e2;border-radius:8px;padding:28px;background-color:#fafbfd}
.p-daikou-gyomu__item-body{display:flex;gap:28px}
.p-daikou-gyomu__item-img-wrap{flex-shrink:0;width:260px;border-radius:6px;overflow:hidden}
.p-daikou-gyomu__item-img-wrap img{width:100%;height:auto;display:block}
.p-daikou-gyomu__item-content{flex:1}

/* --- ポイントボックス --- */
.p-daikou-gyomu__point-box{background-color:#e8f4fb;border-left:5px solid #009AD7;border-radius:4px;padding:14px 18px}
.p-daikou-gyomu__point-label{font-size:1.3rem;font-weight:700;color:#009AD7;margin-bottom:6px;letter-spacing:0.08em}

/* --- オプションボックス --- */
.p-daikou-gyomu__option-box{background-color:#f3f4f6;border-radius:6px;padding:14px 18px}
.p-daikou-gyomu__option-label{font-size:1.6rem;font-weight:700;color:#193771;margin-bottom:8px}

/* --- ナンバーリスト --- */
.p-daikou-gyomu__num-list{list-style:decimal;padding-left:20px;font-size:1.6rem;line-height:1.9}
.p-daikou-gyomu__num-list>li{margin-bottom:2px}

/* --- チェックリスト --- */
.p-daikou-gyomu__check-list{list-style:none;padding:0}
.p-daikou-gyomu__check-item{position:relative;padding-left:22px;font-size:1.6rem;line-height:1.9;margin-bottom:4px}
.p-daikou-gyomu__check-item::before{content:"✔";position:absolute;left:0;color:#009AD7;font-weight:bold}

/* --- 2カラム（遺産調査） --- */
.p-daikou-gyomu__survey-wrap{display:flex;gap:28px}
.p-daikou-gyomu__survey-col{flex:1}

/* --- トグル（業務の詳細） --- */
.p-daikou-gyomu__detail{margin-top:12px}
.p-daikou-gyomu__detail-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 20px;font-size:1.6rem;font-weight:600;color:#193771;background:none;border:2px solid #193771;border-radius:100px;cursor:pointer;transition:background-color 0.3s,color 0.3s}
.p-daikou-gyomu__detail-btn::after{content:"▼";font-size:1.1rem;transition:transform 0.3s}
.p-daikou-gyomu__detail-btn[aria-expanded="true"],.p-daikou-gyomu__detail-btn:hover{background-color:#193771;color:#fff}
.p-daikou-gyomu__detail-btn[aria-expanded="true"]::after{transform:rotate(180deg)}
.p-daikou-gyomu__detail-content{display:none;padding:20px;margin-top:12px;background-color:#fff;border:1px solid #ccd2e2;border-radius:6px}
.p-daikou-gyomu__detail-content.is-open{display:block}

/* --- モーダル --- */
.modal{display:none;position:fixed;inset:0;z-index:9999;align-items:center;justify-content:center}
.modal[aria-hidden="false"]{display:flex}
.modal__overlay{position:absolute;inset:0;background:rgba(0,0,0,0.6);cursor:pointer}
.modal__container{position:relative;z-index:1;max-width:700px;width:90%;max-height:80vh;overflow-y:auto;background:#fff;border-radius:10px;padding:40px}
.modal__close{position:absolute;top:14px;right:18px;font-size:2.4rem;line-height:1;background:none;border:none;cursor:pointer;color:#555}

/* --- レスポンシブ --- */
@media(max-width:767px){
  .p-daikou-gyomu__concept-list{flex-direction:column;gap:14px}
  .p-daikou-gyomu__concept-title{font-size:1.7rem}
  .p-daikou-gyomu__concept-footer{font-size:1.5rem}
  .p-daikou-gyomu__block-lead{font-size:1.4rem;padding:7px 14px}
  .p-daikou-gyomu__item{padding:18px 14px}
  .p-daikou-gyomu__item-body{flex-direction:column;gap:14px}
  .p-daikou-gyomu__item-img-wrap{width:100%}
  .p-daikou-gyomu__survey-wrap{flex-direction:column;gap:14px}
  .modal__container{padding:20px 14px}
}

/* =========================================
   page-reason 追加CSS
   ========================================= */

/* --- 理由ナンバー --- */
.p-reason__num{font-size:1.5rem;font-weight:600;color:#009AD7;letter-spacing:0.1em;margin-bottom:8px}

/* --- img-box内レイアウト調整（理由１〜６） --- */
.p-reason__img-box.img-box{margin-left:-40px}
.p-reason__img-box .img-box__img-wrap{width:calc(45% - 40px);margin-left:40px}
.p-reason__img-box .img-box__content-wrap{width:calc(55% - 40px);margin-left:40px}
.p-reason__img-box .img-box__img-wrap img{width:100%;height:auto;display:block}

/* --- 理由５ ボタン横並び --- */
.p-reason__tag-list{display:flex;flex-wrap:wrap;gap:12px}
.p-reason__tag-list .tpl-button{width:auto;min-width:180px;flex:1}

/* --- サービスカード --- */
.p-reason__service-card{display:block;text-decoration:none;color:inherit;background-color:#ffffff;border:1px solid #ccd2e2;border-radius:8px;overflow:hidden;transition:opacity 0.3s}
.p-reason__service-card:hover{opacity:0.8}
.p-reason__service-img-wrap{overflow:hidden}
.p-reason__service-img-wrap img{width:100%;height:auto;display:block;transition:transform 0.4s}
.p-reason__service-card:hover .p-reason__service-img-wrap img{transform:scale(1.05)}
.p-reason__service-body{padding:16px 18px 20px}

/* --- レスポンシブ --- */
@media(max-width:767px){
  .p-reason__img-box.img-box{flex-wrap:wrap}
  .p-reason__img-box .img-box__img-wrap{width:calc(100% - 40px);margin-bottom:20px}
  .p-reason__img-box .img-box__content-wrap{width:calc(100% - 40px)}
  .p-reason__tag-list .tpl-button{width:100%;flex:none}
  .p-reason__service-body{padding:12px 14px 16px}
}

/* ===================================================
   サブ見出し（h5）スタイル
   =================================================== */

.p-cost__sub-heading {
  display: inline-block;
  margin-top: 0;
  padding: 5px 18px 5px 14px;
  font-size: 1.7rem;
  font-weight: 600;
  line-height: 2.6rem;
  color: #193771;
  background-color: #f3f4f6;
  border-left: 4px solid #009AD7;
  letter-spacing: 0.05em;
}

@media screen and (max-width: 767px) {
  .p-cost__sub-heading {
    font-size: 1.5rem;
    padding: 4px 14px 4px 10px;
  }
}

/* 料金例の人物画像：○切り抜き解除＋サイズ拡大（page-service_daikou_cost.php 専用） */

/* PC */
.p-daikou-cost .p-touki__sec5-img-wrap {
  border-radius: 0;
  overflow: visible;
  width: 38%;
}
.p-daikou-cost .p-touki__sec5-data-list-wrap {
  width: 62%;
}

/* タブレット */
@media screen and (min-width: 768px) and (max-width: 999px) {
  .p-daikou-cost .p-touki__sec5-img-wrap {
    width: 28%;
  }
  .p-daikou-cost .p-touki__sec5-data-list-wrap {
    width: 72%;
  }
}

/* スマホ */
@media screen and (max-width: 767px) {
  .p-daikou-cost .p-touki__sec5-img-wrap {
    width: 70%;
    margin: 0 auto 15px;
  }
  .p-daikou-cost .p-touki__sec5-data-list-wrap {
    width: 100%;
  }
}

/* =========================================
   page-flow 追加CSS
   ========================================= */

/* --- 持ち物・提案書ボックス --- */
.p-flow__box{
  padding:16px 20px;
  background-color:#f3f4f6;
  border-left:5px solid #009AD7;
  border-radius:4px;
}
.p-flow__box-title{
  font-size:1.6rem;
  font-weight:700;
  color:#193771;
  margin-bottom:8px;
}
.p-flow__box-list{
  list-style:none;
  padding:0;
}
.p-flow__box-item{
  position:relative;
  padding-left:18px;
  font-size:1.6rem;
  line-height:1.9;
}
.p-flow__box-item::before{
  content:"・";
  position:absolute;
  left:0;
  color:#009AD7;
}

@media(max-width:767px){
  .p-flow__box{padding:12px 14px}
}

.p-flow__button-wrap{display:flex;flex-wrap:wrap;gap:16px}
.p-flow__button-wrap .l-button-wrap{flex:1;max-width:none}

@media(max-width:767px){
  .p-flow__button-wrap{flex-direction:column;gap:10px}
  .p-flow__button-wrap .l-button-wrap{max-width:298px}
}

/* =========================================
   page-service 追加CSS
   ========================================= */

/* --- ページ内遷移ボタン（タブ） --- */
.p-service__nav{display:flex;gap:16px}
.p-service__nav-btn{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:16px 20px;
  font-size:1.8rem;
  font-weight:700;
  color:#193771;
  text-decoration:none;
  background-color:#fff;
  border:2px solid #193771;
  border-radius:100px;
  transition:background-color 0.3s,color 0.3s;
}
.p-service__nav-btn::after{content:"▼";font-size:1.2rem}
.p-service__nav-btn:hover{background-color:#193771;color:#fff}

@media(max-width:767px){
  .p-service__nav{flex-direction:column;gap:10px}
  .p-service__nav-btn{font-size:1.6rem;padding:12px 16px}
}