/*
Theme Name:AIDER child
Theme URI:https://tcd-theme.com/tcd115
Description:WordPressテーマ「AIDER」の子テーマ
Template:aider_tcd115
Author:TCD
Author URI:https://tcd-theme.com/
Version:1.1.0
*/

/*
  ここから下にCSSを追記してください。
*/
/* -----------------------------------------------------------
 修正: サービス詳細デザイン1（.title_area）がスマホ表示で
 高さ90pxに固定され、アイコン画像とラベルテキストがはみ出して
 白背景に白文字テキストが重なり見えなくなる不具合の修正
----------------------------------------------------------- */
@media (max-width:850px) {
  .service_design_contents_type1 .title_area {
    height: auto;
    padding: 20px 0;
  }
}

/* -----------------------------------------------------------
 追加: PC版でもスクロール時にヘッダーを固定表示する
 （モバイル/タブレット版で既に実装済みの仕様をデスクトップにも適用）
----------------------------------------------------------- */
@media (min-width: 992px) {
  .l-header {
    position: sticky;
    top: 0;
    z-index: 1000000;
  }
  body.is-scroll .l-header {
    box-shadow: var(--tcd-header-bar-box-shadow, 0 5px 20px 0 rgba(0, 0, 0, 0.1));
  }
}

/* -----------------------------------------------------------
 追加: SP版フッターにナビゲーションリンクを表示する
 （footer-menu-sp未割り当てのため、既存のフッター1/フッター2メニュー
   をPC同様スマホでも表示し、2カラムで並べる）
----------------------------------------------------------- */
@media (max-width: 767px) {
  .p-footer-nav--pc {
    display: grid;
  }
}

/* -----------------------------------------------------------
 追加: 交通アクセスページのロゴ画像をスマホ表示時のみ
 40%大きく表示する（元は全ビューポット共通でwidth:40%）
----------------------------------------------------------- */
@media (max-width: 767px) {
  .c-access-logo {
    width: 56%; /* 40% x 1.4 = 40%拡大 */
  }
}

/* -----------------------------------------------------------
 追加: 会計・税務顧問（service01）ページのアコーディオン表示
 https://ai-crest.or.jp/cms/service/service01/
 （サイドラベル型・3ブロック構成。旧 .tcd-accordion-service を置き換え）
----------------------------------------------------------- */
.tcd-service-pulldown{
  --tsp-navy:#17395c;
  --tsp-navy-soft:#2c5680;
  --tsp-bg-light:#F6F6F6;
  --tsp-text-body:#4a4a45;
  --tsp-text-heading:#1f2d26;
  --tsp-rule:#dedcd6;
}
.tcd-service-pulldown *{box-sizing:border-box;}
.tcd-service-pulldown .tsp-page{max-width:860px;margin:0 auto;}
.tcd-service-pulldown .tsp-section{margin-bottom:56px;}
.tcd-service-pulldown .tsp-section:last-child{margin-bottom:0;}

.tcd-service-pulldown .tsp-section-row{display:flex;align-items:stretch;}

.tcd-service-pulldown .tsp-section-side{
  flex:0 0 200px;background:var(--tsp-navy);color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:16px;padding:28px 18px;text-align:center;
}
.tcd-service-pulldown .tsp-section-side svg{width:var(--tcd-card-icon-size);height:var(--tcd-card-icon-size);stroke:#fff;fill:none;stroke-width:1.6;} /* 他サービスページのカード型リストと同じ変数でサイズ統一 */
.tcd-service-pulldown .tsp-section-title{font-size:20px;line-height:1.5;}

.tcd-service-pulldown .tsp-items{flex:1 1 auto;display:flex;flex-direction:column;background:var(--tsp-bg-light);}
.tcd-service-pulldown .tsp-item{border-bottom:1px solid var(--tsp-rule);}
.tcd-service-pulldown .tsp-item:last-child{border-bottom:none;}
.tcd-service-pulldown .tsp-item-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:20px 26px;cursor:pointer;user-select:none;
}
.tcd-service-pulldown .tsp-item-head:hover .tsp-item-title{color:var(--tsp-navy);}
.tcd-service-pulldown .tsp-item-text{flex:1 1 auto;}
.tcd-service-pulldown .tsp-item-title{font-size:18px;font-weight:700;color:var(--tsp-text-heading);transition:color .15s ease;}
.tcd-service-pulldown .tsp-item-teaser{margin:4px 0 0;font-size:16px;color:#8a8a84;}

.tcd-service-pulldown .tsp-item-toggle{flex:0 0 auto;width:22px;height:22px;border:1.3px solid var(--tsp-navy);border-radius:50%;position:relative;}
.tcd-service-pulldown .tsp-item-toggle::before,
.tcd-service-pulldown .tsp-item-toggle::after{
  content:'';position:absolute;top:50%;left:50%;background:var(--tsp-navy);
  transition:transform .25s ease,opacity .25s ease;
}
.tcd-service-pulldown .tsp-item-toggle::before{width:10px;height:1.4px;transform:translate(-50%,-50%);}
.tcd-service-pulldown .tsp-item-toggle::after{width:1.4px;height:10px;transform:translate(-50%,-50%);}
.tcd-service-pulldown .tsp-item.open .tsp-item-toggle::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0;}

.tcd-service-pulldown .tsp-item-panel{max-height:0;overflow:hidden;transition:max-height .4s ease;}
.tcd-service-pulldown .tsp-item-panel-inner{padding:0 26px 22px;display:flex;flex-direction:column;gap:10px;font-size:16px;color:var(--tsp-text-body);}
.tcd-service-pulldown .tsp-item-panel-inner p{margin:0;}

@media (max-width:640px){
  .tcd-service-pulldown .tsp-section-row{flex-direction:column;}
  .tcd-service-pulldown .tsp-section-side{flex:none;flex-direction:row;justify-content:flex-start;padding:16px 20px;gap:12px;}
  .tcd-service-pulldown .tsp-section-title{font-size:15px;}
  .tcd-service-pulldown .tsp-item-head{padding:16px 18px;}
  .tcd-service-pulldown .tsp-item-panel-inner{padding:0 18px 18px;}
}

/* -----------------------------------------------------------
 追加: カード型リスト（サービス紹介 [tcd_service_design_1]）の
 見出しフィールドに貼り付けたSVGアイコンのサイズを一元管理する。

 使い方:
 ・サイズを変えたい → 下の --tcd-card-icon-size の値を書き換えるだけで
   このカード型リストを使う全ページのアイコンが一括で変わる
 ・アイコンの種類を変えたい → 「見出し」フィールドのSVGコードを
   別のアイコン（lucide.devなどからCopy SVG）に貼り替えるだけでOK。
   貼り付けたSVG自体のwidth/height指定は下記CSSが自動的に上書きするため、
   サイズを気にせずどんなアイコンでも同じ大きさで表示される
----------------------------------------------------------- */
:root{
  --tcd-card-icon-size: 48px;
}
.service_design_contents_type1 .title_area svg{
  width: var(--tcd-card-icon-size);
  height: var(--tcd-card-icon-size);
  display: block;
  margin: 0 auto 12px;
}