/* 基本設定 */

/* ===== 全体のベースフォント（まずは全ページで統一） ===== */
html, body {
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
　letter-spacing: 1px;	
}


/* セクションルートは継承を担保（安全ネット） */
:where(
  .sp-hero,
  .sp-midashi,
  .sp-about-text-only,
  .sp-kobutsu-wrap,
  .sp-kobutsu,
  .sp-services,
  .sp-profile,
  .sp-reasons,
  .sp-qa-sen,
  .sp-contact
) { font-family: inherit; }

/* （重要）明朝指定になっていた箇所をゴシックに統一 */
.sp-reason-badge {
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif; /* ← ここを上書き */
}



*{padding:0;margin:0;}

.wapper{
width: 100%;	
background:#f9fbfc;

}



.container {
	background-color: #ffffff;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	border-bottom-width: 0px;
	padding-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	max-width :1280px;
}

.row {
	width: 100%;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	display: inline-block
}
.body {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}



/*ヘッダーデザイン6 */
/* ヘッダー全体 */
.pc-header-6 {
  width: 1280px;
  margin: 0 auto;
  background: linear-gradient(90deg, #005f99, #007acc); /* 海系グラデーション */
  box-sizing: border-box;
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
}

/* 横並びレイアウト（左：ロゴ／右：ナビ）*/
.pc-header-6-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px; /* 画像の高さ感に合わせて調整 */
}

/* ロゴ */
.pc-header-6-logo-link {
  display: flex;
  align-items: center;
  text-decoration: none;
　background: #ffffff;	
}

.pc-header-6-logo img {
  width: 40px;          /* 実画像に合わせて調整可 */
  height: auto;
  margin-right: 12px;
}

.pc-header-6-logo-text {
  font-size: 22px;
  font-weight: 600;
  color: #fff;
  letter-spacing: 1px;
}

/* ナビ（タイトルの横に並ぶ） */
.pc-header-6-nav { margin-left: 24px; }

.pc-header-6-nav-list {
  display: flex;
  align-items: stretch;
  gap: 0;               /* 仕切り線を明確にするためgapは0 */
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 各項目 */
.pc-header-6-nav-list li {
  display: flex;
  align-items: center;
}

/* 縦仕切り線（先頭以外） */
.pc-header-6-nav-list li + li {
  border-left: 1px solid rgba(255, 255, 255, 0.35);
}

/* リンク（2行：英語/日本語） */
.pc-header-6-nav-list a {
  display: block;
  padding: 8px 14px;       /* ← クリック余白を少し減らす */
  text-decoration: none;
  text-align: center;
  color: #fff;
  transition: background-color 0.2s ease, color 0.2s ease;
  line-height: 1.2;
  min-width: 120px;        /* ← 160px → 120px に縮小 */
}

/* 英語（上段） */
.pc-header-6-nav-list .en {
  display: block;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 1px;
}

/* 日本語（下段） */
.pc-header-6-nav-list .jp {
  display: block;
  font-size: 11px;
  opacity: 0.9;
  margin-top: 2px;
}

/* ホバー時の軽い反応 */
.pc-header-6-nav-list a:hover {
  background-color: rgba(255, 255, 255, 0.1);
}

/* フォーカスリング配慮 */
.pc-header-6-nav-list a:focus-visible {
  outline: 2px solid #e8d6c9;  /* 視認性の高い明色 */
  outline-offset: -2px;
}

/* ロゴリンクの色を固定（変化しない） */
.pc-header-6-logo-link:link,
.pc-header-6-logo-link:visited,
.pc-header-6-logo-link:hover,
.pc-header-6-logo-link:active,
.pc-header-6-logo-link:focus {
  color: inherit;
  text-decoration: none;
}


/* スマホヘッダーメニュー */

/* SPヘッダー3ハンバーガーのみ */

/* =========================
   スマホ用ヘッダー（完成版CSS）
   変数は使わず直書き・中央線のズレ修正済み
========================= */

/* =========================
   SPヘッダー（このHTML用に最適化）
========================= */

/* 固定ヘッダー */
.sp-header{
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  height: 56px;
  background: #007acc;                 /* サイト基調のブルー */
  box-shadow: 0 2px 10px rgba(0,0,0,.08);
  z-index: 1000;
}
.sp-header-inner{
  height: 100%;
  max-width: 980px;
  margin: 0 auto;
  padding: 0 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
}

/* ロゴ＋タイトル */
.sp-header-brand{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}
.sp-header-logo{
  width: 28px; height: 28px; display: block;
}
.sp-header-title{
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  letter-spacing: .02em;
  color: #ffffff;
}

/* 固定ヘッダー分の下余白 */
.sp-header-offset{ height: 56px; }

/* =========================
   ハンバーガー & ドロワー
========================= */

#nav-drawer{ position: relative; }
.nav-unshown{ display: none; }

/* ハンバーガーアイコンのクリック領域 */
#nav-open{
  position: relative;
  display: inline-block;
  width: 44px; height: 44px;
  cursor: pointer;
}

/* ─ 3本線（中央揃え・ズレ防止）─ */
#nav-open span{
  position: absolute;
  left: 50%; top: 50%;
  width: 26px; height: 2px;
  background: #ffffff;
  border-radius: 2px;
  transform: translate(-50%,-50%);
  transition: transform .35s ease, opacity .35s ease;
}
#nav-open span::before,
#nav-open span::after{
  content: "";
  position: absolute;
  left: 0;
  width: 100%; height: 2px;
  background: #ffffff;
  border-radius: 2px;
  transition: transform .35s ease, opacity .35s ease, top .35s ease;
}
#nav-open span::before{ top: -8px; }   /* 上線 */
#nav-open span::after { top:  8px; }   /* 下線 */

/* オーバーレイ（閉じるカバー） */
#nav-close{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 999;
  opacity: 0;
  pointer-events: none;
  transition: opacity .55s ease;       /* ゆっくり */
}

/* =========================
   ドロワーメニュー全体
========================= */
#nav-content {
  position: fixed;
  top: 0; left: 0;
  height: 100vh;
  width: 86%;
  max-width: 340px;
  background: rgba(234,244,252,0.9); /* ← メニュー全体の背景にブルー＋透過 */
  box-shadow: 6px 0 28px rgba(0,0,0,.16);
  transform: translateX(-105%);
  transition: transform .55s cubic-bezier(.22,.61,.36,1);
  z-index: 1000;
  padding: 72px 0 24px;   /* ヘッダー分の余白 */
  box-sizing: border-box;
  border-radius: 0 12px 12px 0;
}

/* ===== 開閉状態（※HTML構造に合わせたセレクタ） ===== */
/* #nav-input の直後が #nav-open、さらに後ろに #nav-close / #nav-content がある構造 */
#nav-input:checked + #nav-open span{
  transform: translate(-50%,-50%) rotate(45deg);  /* 中央線 → 斜め */
}
#nav-input:checked + #nav-open span::before{
  top: 0; transform: rotate(90deg);               /* 上線 → 縦線 */
}
#nav-input:checked + #nav-open span::after{
  top: 0; opacity: 0;                             /* 下線 → 消える */
}
#nav-input:checked ~ #nav-close{
  opacity: 1; pointer-events: auto;               /* オーバーレイ表示 */
}
#nav-input:checked ~ #nav-content{
  transform: translateX(0%);                      /* ドロワー展開 */
}

/* メニューリスト */
.sp-menu-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 各項目に下線 */
.sp-menu-list li {
  border-bottom: 1px solid #c9d9e8;
}
.sp-menu-list li:last-child {
  border-bottom: none;
}

/* リンクデザイン */
.sp-menu-list a {
  display: block;
  padding: 14px 28px;
  text-decoration: none;
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
  font-weight: 500;
  font-size: 15px;
  color: #0b3350;
  transition: background-color .25s ease, color .25s ease;
}

/* ホバー時 */
.sp-menu-list a:hover {
  background: rgba(0,122,204,0.1);
  color: #005f99;
}

/* SPのヘッダー高さ（必要に応じて調整） */
:root {
  --sp-header-h: 72px;  /* 例：72px。あなたのSPヘッダー実寸に合わせて変更 */
}

/* スマホのみ適用 */
@media (max-width: 768px) {
  /* スマホ用のアンカー先 */
  #sp-about,
  #sp-kobutsu,
  #sp-profile {
    scroll-margin-top: var(--sp-header-h);
  }

  /* PCと共通のidにも適用したい場合（任意） */
  #about,
  #kobutsu,
  #profile {
    scroll-margin-top: var(--sp-header-h);
  }
}




.row.blockDisplay {
	display: block;
}


/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 480px) {
.pc { display: none !important; }
.sp { display: block !important; }
}
@media only screen and (max-width: 750px) {
img { max-width: 100%; }
}




/* pcサイトで使っているCSS*/
/* pc見出しタグ */



h1{

}
.pc-title-komiji{
font-size:14px;	
line-height: 100%;	
letter-spacing: 4px;	
color:#3f3f3f;
font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
font-weight: 300;
word-break: normal;
overflow-wrap: normal;
white-space: normal;	
}
.pc-title{
width: 700px;
font-size:24px;	
color:#3f3f3f;	
margin:auto;
margin-top:80px;
margin-bottom:10px;	
text-align: center;		
letter-spacing: 3px;	
line-height: 100%;font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
font-weight: 500;	
word-break: normal;
overflow-wrap: normal;
white-space: normal;	
}
.pc-title-15{
font-size:15px;	
}
.pc-title-en{
width: 700px;
font-size:28px;	
color:#3f3f3f;	
margin:auto;
margin-top:80px;
margin-bottom:10px;	
text-align: center;		
letter-spacing: 2px;	
line-height: 100%;font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
font-weight: 500;	
word-break: normal;
overflow-wrap: normal;
white-space: normal;	
}
.pc-title-en-komoji{
font-size:18px;	
word-break: normal;
overflow-wrap: normal;
white-space: normal;	
}
.pc-title-sen{
width: 800px;
margin:auto;	
}
.pc-title-sen-en{
width: 800px;
margin:auto;
margin-top:17px;
margin-bottom:70px;		
}








.sp-h1-komoji{
font-size:15px;
line-height: 100%;	
letter-spacing: 2px;	
 font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
font-weight: 300;	
}
.sp-h1{
font-size:20px;	
color:#3f3f3f;	
 	
line-height: 100%;font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
font-weight: 300;	
}

h2{

}
.pc-h2{
font-size:24px;	
color:#3f3f3f;	
line-height: 100%;font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
font-weight: 300;	
}
.sp-h2{
font-size:20px;	
color:#3f3f3f;	
 	
line-height: 100%;	
letter-spacing: 2px;font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
font-weight: 300;	
}
h3{
border-bottom:1px solid  #cccccc;	
padding-bottom:5px;	
text-align: left;	
}

.sp-h3-span{
font-size:19px;
padding-left:50px;
 	
letter-spacing: 2px;		
color:#3f3f3f;font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
font-weight: 300;		
}



.sp-h3-komoji{
font-size:12px;
line-height: 100%;	
}

h4{
font-size: 22px;
width: 80%;	
text-align: center;
margin:auto;	
color: #2a2a2a;	
letter-spacing: 2px;		
border-bottom: 1px solid #9f9f9f;		
padding-top:47px;	
font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
font-weight: 300;		
}





.sp-midashi-sen{
width: 85%;
margin:auto;	
}




/* pcトップメイン*/
/* ===== Hero Section ===== */
.pc-hero {
  position: relative;
  width: 100%;
  height: 500px;
  margin-bottom: 80px;
  overflow: hidden;
}

/* 背景画像 */
.pc-hero-bg {
  width: 100%;
  height: 100%;
}
.pc-hero-bg-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* コメントボックス（白背景） */
.pc-hero-comment {
  position: absolute;
  right: 100px;
  top: 45%;
  transform: translateY(-50%);
  background: #ffffff;       /* 白背景を復活 */
  padding: 40px 60px;
  border-radius: 10px;
  box-shadow: 0 4px 14px rgba(0,0,0,0.15);
  max-width: 600px;
  text-align: center;
}

/* タイトル部分 */
.pc-hero-comment-title {
  margin: 0 0 20px;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 30px;
  font-weight: 700;
  color: #0b3350;
  line-height: 1.5;
  letter-spacing: 3px;	
}

/* ボタン */
.pc-hero-btn {
  display: inline-block;
  padding: 12px 28px;
  background: linear-gradient(90deg, #007acc, #00bfff);
  color: #ffffff;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  border-radius: 999px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.15);
  transition: background 0.3s ease, transform 0.2s ease;
}
.pc-hero-btn:hover {
  background: linear-gradient(90deg, #006bb3, #00a4e0);
  transform: translateY(-2px);
}










.pc-midashi {
  position: relative;
  margin-bottom: 50px;
  text-align: center;
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 600;
  font-size: 24px;
  color: #5a7fc2;
  letter-spacing: 0.05em;
}
.pc-midashi::after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 3px;
  background: #5a7fc2;
}
.pc-midashi-page {
  position: relative;	
  margin-bottom: 50px;
  padding-top:60px;	
  text-align: center;
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 600;
  font-size: 24px;
  color: #5a7fc2;
  letter-spacing: 0.05em;
}
.pc-midashi-page::after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 3px;
  background: #5a7fc2;
}

/* ===== 事務所紹介（テキストのみ） ===== */
.pc-about-text-only {
  background: #ffffff;
  padding: 0px;
  width: 100%;	
  max-width: 700px;
  margin:auto;	
  margin-bottom:100px;	
} 

.pc-about-text-only p {
  margin: 0;
  font-size: 16px;
  letter-spacing: 1px;	
  line-height: 1.95;
  color: #333333;
  text-align: justify; /* 両端揃えで整った印象 */
}

/* ===== Responsive（任意） ===== */
@media (max-width: 1280px) {
  .pc-container { width: 100%; }
}
@media (max-width: 768px) {
  .pc-midashi {
    font-size: 24px;
    margin: 40px 0 30px;
  }
  .pc-midashi::after { width: 96px; }
  .pc-midashi::before { width: 160px; }
  .pc-about-text-only p {
    font-size: 15px;
  }
}


/* ===== 全体背景ラップ ===== */
.pc-kobutsu-wrap {
  width: 100%;
  background: #f0f7fb; /* 淡いブルー背景 */
  padding: 40px 0;      /* セクション上下に余白 */
  margin-bottom:100px;	
}

/* ===== 内側カード本体 ===== */
.pc-kobutsu {
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  padding: 32px 24px 28px;
  background: #fff;
  border: 1px solid #e6ebf1;
  border-radius: 14px;
  box-sizing: border-box;
  position: relative;
}

/* 見出し（左上ラベル風） */
.pc-kobutsu-heading {
  position: absolute;
  top: -16px; left: 20px;
  margin: 0;
  padding: 6px 14px;
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  background: linear-gradient(90deg, #007acc, #00bfff);
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
}

/* 内部レイアウト */
.pc-kobutsu-inner {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* 本文 */
.pc-kobutsu-text p {
  margin: 0;
  font-size: 15px;
  line-height: 1.95;
  color: #4b5563;
  text-align: justify;
}
.pc-kobutsu-text strong { color: #0b3350; font-weight: 700; }

/* リスト部分 */
.pc-kobutsu-points {
  background: #ffffff;
  border: 1px solid #e6ebf1;
  border-radius: 12px;
  padding: 16px 18px;
}

/* 小見出し */
.pc-kobutsu-subtitle {
  margin: 0 0 10px;
  font-size: 16px;
  font-weight: 700;
  color: #0b3350;
  padding-left: 10px;
  position: relative;
}
.pc-kobutsu-subtitle::before {
  content: "";
  position: absolute;
  left: 0; top: 4px; bottom: 4px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, #00bfff 0%, #007acc 100%);
}

/* 箇条書き */
.pc-kobutsu-list {
  margin: 8px 0 10px;
  padding: 0;
  list-style: none;
  display: grid;
  row-gap: 8px;
}
.pc-kobutsu-list li {
  position: relative;
  padding-left: 22px;
  font-size: 15px;
  line-height: 1.8;
  color: #374151;
}
.pc-kobutsu-list li::before {
  content: "";
  position: absolute;
  left: 0; top: 10px;
  width: 10px; height: 10px;
  border-radius: 999px;
  background: radial-gradient(60% 60% at 40% 40%, #00bfff 0%, #007acc 100%);
}

/* 注意文 */
.pc-kobutsu-note {
  margin: 8px 0 0;
  font-size: 12.5px;
  color: #586574;
}



/* ===== 取扱業務 ===== */
.pc-services{
  width: 100%;
  max-width: 1280px;
  margin: 40px auto 100px;
  padding: 0 20px;
  box-sizing: border-box;
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
}

/* 見出し（中央寄せでも左寄せでもOK。とりあえず中央） */
.pc-services-title{
  margin: 0 0 20px;
  text-align: center;
  font-weight: 700;
  font-size: 24px;
  letter-spacing: .02em;
  color: #0b3350;
}

/* 3カラムグリッド */
.pc-services-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

/* カード */
.pc-service-card{
  background: #fff;
  border: 1px solid #e6ebf1;
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding-bottom: 16px; /* 下のボタン余白 */
  transition: box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
}

/* 画像 */
.pc-service-imgwrap{
  width: 100%;
  aspect-ratio: 16 / 9;        /* 安定した比率で表示 */
  background: #eef3f7;
  overflow: hidden;
}
.pc-service-imgwrap img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 業務名 */
.pc-service-name{
  margin: 14px 16px 6px;
  font-size: 18px;
  font-weight: 700;
  color: #0b3350;
  letter-spacing: .02em;
}

/* 説明 */
.pc-service-desc{
  flex: 1;
  margin: 0 16px 12px;
  font-size: 16px;
  line-height: 1.9;
  color: #4b5563;
}

/* 詳細ボタン（海っぽいグラデ） */
.pc-service-btn{
  align-self: flex-start;        /* 左寄せ。中央にしたい場合は margin: 0 auto; */
  margin: 0 16px;
  display: inline-block;
  padding: 10px 16px;
  border-radius: 6px;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: .02em;
  color: #fff;
  background: linear-gradient(90deg, #007acc, #00bfff);
  transition: opacity .2s ease;
}
.pc-service-btn:hover{ opacity: .85; }

/* カードの軽いホバー（上がらない仕様） */
.pc-service-card:hover{
  border-color: #d7e3ee;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  background-color: #fbfdff;
}

/* ===== レスポンシブ ===== */
@media (max-width: 1024px){
  .pc-services-grid{
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px){
  .pc-services{
    padding: 0 14px;
  }
  .pc-services-grid{
    grid-template-columns: 1fr;
  }
}




/* ===== プロフィール ===== */
.pc-profile {
  width: 100%;
  max-width: 820px;
  margin: auto;
  margin-bottom: 100px;
  background: #ffffff;
  border-radius: 12px;
  padding: 24px;
  box-sizing: border-box;
}

/* PC時：横並び＆中央揃え */
.pc-profile-inner {
  display: flex;
  align-items: center;   /* 左右の高さを中央揃え */
  gap: 32px;             /* 左右の余白 */
}

/* 左：写真 */
.pc-profile-photo-wrap {
  flex: 0 0 300px;       /* 固定幅 */
  border-radius: 12px;
  overflow: hidden;
  background: #e9eef3;
}
.pc-profile-photo {
  display: block;
  width: 100%;
  height: 380px;
  object-fit: cover;
}

/* 右：本文 */
.pc-profile-content {
  flex: 1;
  min-width: 0;
  position: relative;
  padding-left: 16px;
}
.pc-profile-content::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  bottom: 2px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, #00bfff 0%, #007acc 100%);
  opacity: 0.85;
}

/* 名前 */
.pc-profile-name {
  margin: 0 0 14px;
  font-weight: 700;
  font-size: 20px;
  color: #0b3350;
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
  letter-spacing: 0.02em;
}

/* プロフィール情報（dl） */
.pc-profile-list {
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 140px 1fr;
  row-gap: 10px;
  column-gap: 16px;
  font-size: 15px;
  line-height: 1.9;
  color: #374151;
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
}
.pc-profile-row {
  display: contents;
}
.pc-profile-list dt {
  margin: 0;
  font-weight: 700;
  color: #0b3350;
}
.pc-profile-list dd {
  margin: 0;
  word-break: break-word;
}
.pc-profile-list dd > a{
text-decoration: underline;
}
.pc-profile-list dd > a:hover{
text-decoration: none;
}

/* ===== Responsive ===== */
@media (max-width: 1024px) {
  .pc-profile-inner {
    flex-direction: column; /* 縦並び */
    align-items: flex-start; /* 左寄せ */
  }
  .pc-profile-photo {
    height: 360px;
  }
  .pc-profile-list {
    grid-template-columns: 120px 1fr;
  }
}

@media (max-width: 600px) {
  .pc-profile-photo {
    height: 300px;
  }
  .pc-profile-name {
    font-size: 18px;
  }
  .pc-profile-list {
    grid-template-columns: 1fr; /* モバイルは縦積み */
  }
  .pc-profile-list dt {
    opacity: 0.9;
  }
}


/* ===== 選ばれる理由（セクション全体） ===== */
.pc-reasons {
  width: 100%;
  max-width: 1280px;   /* ← 1080px → 1280px に変更 */
  margin: 24px auto 100px;
  padding: 32px 28px;  /* ← 広がった分、余白も少し増やすとバランス◎ */
  border-radius: 16px;
  border: 0px solid #dde7f0;
  background:
    radial-gradient(90% 60% at 0% 0%, rgba(0,191,255,0.15) 0%, rgba(0,191,255,0) 70%),
    radial-gradient(80% 50% at 100% 100%, rgba(0,122,204,0.15) 0%, rgba(0,122,204,0) 70%),
    #ffffff;
}


.pc-reasons-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

/* ===== カード ===== */
.pc-reason-card {
  position: relative;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #e6ebf1;
  border-radius: 12px;
  padding: 48px 20px 36px; /* ← 上を広げて左上バッジと干渉しないように */
  box-shadow: 0 4px 14px rgba(0,0,0,0.04);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.pc-reason-card:hover {
  box-shadow: 0 8px 22px rgba(0,0,0,0.06);
  border-color: #d7e3ee;
}

/* トップバー（既存の海グラデ要素） */
.pc-reason-topbar {
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 6px;
  background: linear-gradient(90deg, #00bfff, #007acc);
}

/* ===== 新デザイン：番号ラベル（左上・明朝系・ラベル風） ===== */
.pc-reason-badge {
  position: absolute;
  top: 0; left: 0;
  padding: 8px 16px 10px;
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif; /* ← 明朝系 */
  font-size: 22px;           /* ← 大きめ */
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1;
  color: #fff;

  background: linear-gradient(135deg, #007acc, #00bfff);
  border-bottom-right-radius: 10px;           /* ラベルの角 */
  box-shadow: 0 4px 10px rgba(0,0,0,0.10);

  /* 紙ラベル感の淡いテクスチャ風ハイライト */
  position: absolute;
  z-index: 2;
}
.pc-reason-badge::after {
  content: "";
  position: absolute;
  inset: 0;
  border-bottom-right-radius: 10px;
  background:
    radial-gradient(120% 80% at 10% 0%, rgba(255,255,255,.35) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(to bottom, rgba(255,255,255,.08), rgba(0,0,0,0) 60%);
  pointer-events: none;
}

/* ===== タイトル ===== */
.pc-reason-title {
  margin: 12px 0 12px;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #0b3350;
  position: relative;
  padding-left: 12px;
}

/* 小型アクセントアイコン（海グラデの丸） */
.pc-reason-ico {
  display: inline-block;
  width: 14px; height: 14px;
  margin-right: 8px;
  border-radius: 999px;
  background: radial-gradient(60% 60% at 40% 40%, #00bfff 0%, #007acc 100%);
  vertical-align: -1px;
}

/* 説明文 */
.pc-reason-text {
  margin: 0;
  font-size: 15px;
  line-height: 1.9;
  color: #4b5563;
}

/* ミニCTAリンク */
.pc-reason-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 16px;
  font: 700 14px/1 "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
  color: #007acc;
  text-decoration: none;
}
.pc-reason-arrow { transition: transform .15s ease; }
.pc-reason-link:hover .pc-reason-arrow { transform: translateX(3px); }

/* ===== レスポンシブ ===== */
@media (max-width: 1024px) {
  .pc-reasons-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .pc-reasons { padding: 0 14px; }
  .pc-reasons-grid { grid-template-columns: 1fr; }
  .pc-reason-badge { font-size: 20px; padding: 8px 14px 10px; }
}



/* 依頼の流れ */
/* ===== ご依頼の流れ（タイムライン） ===== */

.pc-flow {
  width: 100%;
  max-width: 880px;
  margin: 24px auto 0;
  margin-bottom:100px;	
  padding: 0 20px;
}

/* タイムライン全体の線は使わない */
.pc-flow-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}

/* 各ステップ */
.pc-flow-step {
  position: relative;
  display: flex;
  align-items: flex-start;
  margin-bottom: 36px;
  padding-left: 64px;
}

/* 各ステップの下方向に線を描く */
.pc-flow-step::after {
  content: "";
  position: absolute;
  left: 24px;
  top: 48px; /* マーカー下から線を伸ばす */
  width: 2px;
  height: calc(100% + 36px); /* 次のステップとの間隔分 */
  background: linear-gradient(180deg, #00bfff, #007acc);
}

/* 最後のステップは線を消す */
.pc-flow-step:last-child {
  margin-bottom: 0;
}
.pc-flow-step:last-child::after {
  content: none;
}

/* マーカー */
.pc-flow-marker {
  position: absolute;
  left: 0;
  top: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: linear-gradient(180deg, #00bfff, #007acc);
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  z-index: 1;
}

/* 内容カード */
.pc-flow-content {
  background: #ffffff;
  border: 1px solid #e6ebf1;
  border-radius: 10px;
  padding: 18px 20px;
  flex: 1;
  box-shadow: 0 4px 10px rgba(0,0,0,0.03);
}

.pc-flow-title {
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 700;
  color: #0b3350;
}

.pc-flow-text {
  margin: 0;
  font-size: 15px;
  line-height: 1.8;
  color: #4b5563;
}

/* ===== Responsive ===== */
@media (max-width: 768px) {
  .pc-flow-step {
    padding-left: 56px;
    margin-bottom: 28px;
  }

  .pc-flow-step::after {
    left: 18px;          /* マーカー中心 (36px/2) */
    top: 36px;
    height: calc(100% + 28px);
  }

  .pc-flow-marker {
    width: 36px;
    height: 36px;
    font-size: 16px;
  }

  .pc-flow-title {
    font-size: 16px;
  }
  .pc-flow-text {
    font-size: 16px;
  }
}

/* ===== セクション枠 ===== */
.pc-qa-sen{
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
　margin-bottom:140px;	
  padding: 0px 0;
  box-sizing: border-box;
}
.pc-qa-sen{
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  margin-bottom: 100px;   /* 半角スペースに修正 */
  padding: 0px 0;
  box-sizing: border-box;
}


/* ===== アイテム ===== */
.pc-qa-item{
  margin-bottom: 30px;
  border: 1px solid #c9d9e8;
  border-radius: 8px;
  background: #fff;
  overflow: hidden; /* 角丸に合わせる */
}

/* ===== Q（ボタン） ===== */
.pc-qa-question{
  width: 100%;
  background: #fff;
  border: none;
  display: grid;
  grid-template-columns: auto 1fr auto; /* Qマーク / 質問文 / アイコン */
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  text-align: left;
  cursor: pointer;
  font-size: 16px;
  color: #333;
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
}
.pc-qa-question:hover{ background:#f3f8fc; }

/* Qマーク */
.pc-q-q{
  display: flex;                /* ← Flexboxに変更 */
  align-items: center;          /* 縦中央 */
  justify-content: center;      /* 横中央 */
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: #1d3b5e;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  flex-shrink: 0;
}

/* 右側アイコン */
.pc-qa-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:24px; height:24px;
  color:#1d3b5e;
  transition: transform .25s ease, color .25s ease;
}
.pc-qa-icon-svg{ width:20px; height:20px; display:block; }

/* 開いている時はアイコンを回転 */
.pc-qa-question[aria-expanded="true"] .pc-qa-icon{
  transform: rotate(180deg);
  color:#007acc;
}

/* ===== A（スライド領域） ===== */
/* ラッパーは高さアニメーション用。初期は閉じる */
.pc-qa-answer-wrapper{
  height: 0;
  overflow: hidden;
  transition: height .28s ease; /* 滑らかに */
  will-change: height;
  border-top: 1px solid transparent; /* 開閉時のガタつき防止 */
}

/* 中身（実際の回答ボックス） */
.pc-qa-answer{
  padding: 14px 18px;
  border-top: 1px solid #c9d9e8;
  background:#fafcff;
  display:flex;
  gap:10px;
  align-items:flex-start;
}

/* Aマーク */
.pc-q-a{
  display: flex;                /* ← Flexboxに変更 */
  align-items: center;          /* 縦中央 */
  justify-content: center;      /* 横中央 */
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid #1d3b5e;
  color: #1d3b5e;
  font-size: 16px;
  font-weight: 600;
  flex-shrink: 0;
}

/* 回答テキスト */
.pc-qa-answer p{
  margin:0;
  font-size:15px;
  line-height:1.8;
  color:#3f3f3f;
}

/* レスポンシブ微調整 */
@media (max-width: 640px){
  .pc-qa-question{ padding: 12px 14px; font-size:15px; }
  .pc-qa-answer{ padding: 12px 14px; }
}

/* ===== Q&A：フッターボタン ===== */
.pc-qa-more{
  margin-top: 8px;            /* アコーディオンとの間隔 */
  text-align: center;
}

.pc-qa-more-btn{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  border-radius: 999px;        /* 丸 pill 形状 */
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: .02em;
  color: #fff;
  background: linear-gradient(90deg, #007acc, #00bfff);
  box-shadow: 0 4px 12px rgba(0,122,204,.18);
  transition: box-shadow .2s ease, opacity .2s ease;
}

.pc-qa-more-btn:hover{
  opacity: .92;
  box-shadow: 0 6px 16px rgba(0,122,204,.24);
}

.pc-qa-more-btn:focus-visible{
  outline: 2px solid #e8f3ff;   /* 視認性の高いフォーカスリング */
  outline-offset: 2px;
}

/* アイコン */
.pc-qa-more-ic{
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.pc-qa-more-ic-svg{
  width: 18px;
  height: 18px;
  display: block;
}

/* ===== お問い合わせ：背景付き一式 ===== */

/* ===== お問い合わせ（背景画像＋白背景エリア修正） ===== */
.pc-contact{
  position: relative;
  width: 100%;
  max-width: 1280px;        /* ← 背景の幅を1280pxに変更 */
  margin: 60px auto 0;      /* ← 下の余白をなくす */
  padding: 80px 16px;
  box-sizing: border-box;
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
  text-align: center;
  background: url("../images/pc-toiawase-back.jpg") center/cover no-repeat;
  overflow: hidden;
}

/* 背景のホワイトフィルター */
.pc-contact::before{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.8); /* 白の透過フィルター */
  backdrop-filter: brightness(0.95);  /* 少し明るく＆柔らかく */
  z-index: 0;
}

/* 中身の要素を前面に */
.pc-contact > *{
  position: relative;
  z-index: 1;
}

/* セクション全体を囲う白背景（少し透かす） */
.pc-contact-inner{
  background: rgba(255,255,255,1); /* ← 白を薄く */
  border-radius: 12px;
  padding: 40px 20px;
  box-sizing: border-box;
}

/* 見出し */
.pc-contact .pc-midashi{
  margin: 0 0 40px;
  font-weight: 600;
  font-size: 24px;
  color: #0b3350;
  letter-spacing: .02em;
  background: transparent; /* ← 白背景と重ならないように */
  position: relative;
}
.pc-contact .pc-midashi::after{
  content:"";
  display:block;
  width: 200px;
  height: 2px;
  margin: 10px auto 0;
  background: #0b3350;
  border-radius: 999px;
}

/* 白カード（フォーム説明） */
.pc-contact-card{
  background: transparent; /* ← 内側の白を削除して上の白背景に統一 */
  padding: 0;
  box-shadow: none;
  border: none;
}

/* リード文など */
.pc-contact-lead{
  margin: 0 0 34px;
  font-size: 15px;
  line-height: 1.9;
  color: #222222;
}
.pc-contact-actions{
  margin-bottom: 34px;
}
.pc-contact-btn-primary{
  display: inline-block;
  padding: 16px 50px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: .02em;
  color: #fff;
  background: linear-gradient(90deg, #007acc, #00bfff);
  box-shadow: 0 4px 12px rgba(0,122,204,.18);
  transition: opacity .2s ease, transform .02s ease;
}
.pc-contact-btn-primary:hover{ opacity: .9; }
.pc-contact-btn-primary:active{ transform: translateY(1px); }

.pc-contact-notes{
  margin: 0;
  padding: 0;
  list-style: none;
  color: #222222;
  font-size: 13px;
  line-height: 1.8;
}
.pc-contact-notes li + li{ margin-top: 6px; }

/* レスポンシブ */
@media (max-width: 640px){
  .pc-contact{
    margin: 40px auto 0;
    padding: 0 14px;
  }
  .pc-contact .pc-midashi{
    font-size: 22px;
  }
  .pc-contact .pc-midashi::after{
    width: 160px;
  }
  .pc-contact-inner{
    padding: 28px 14px;
    border-radius: 10px;
  }
  .pc-contact-btn-primary{
    width: 100%;
    text-align: center;
  }
}






/* ===== 取扱業務（リスト型） ===== */
.pc-services-listing{
  width: 100%;
  max-width: 980px;
  margin: 40px auto 100px;
  padding: 0 20px;
  box-sizing: border-box;
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
}

/* 導入文 */
.pc-services-intro{
  max-width: 600px;		
  margin: 0 auto 50px;  /* ← 左右を auto にして中央寄せ */
  color: #4b5563;
  font-size: 15px;
  line-height: 1.9;
}

/* リスト本体 */
.pc-service-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  row-gap: 18px;
}

/* 各業務ボックス */
.pc-service-box{
  background: #fff;
  border: 1px solid #e6ebf1;
  border-radius: 12px;
  padding: 20px 24px;
  margin-bottom:30px;	
 /* 右と下にだけ影を付ける */
  box-shadow: 4px 4px 12px rgba(0, 0, 0, 0.25);
}

/* 業務タイトル */
.pc-service-title{
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .02em;
  color: #0b3350;
}

/* 短い説明 */
.pc-service-lead{
  margin: 0 0 10px;
  padding:10px 0 10px;	
  font-size: 16px;
  line-height: 1.7;
  color: #374151;
}

/* 詳しい説明（常時表示） */
.pc-service-details-content{
  font-size: 16px;
  line-height: 1.8;
  color: #374151;
  background: #f7fbff;
  border: 1px solid #d6e7f5;
  border-radius: 8px;
  padding: 14px 16px;
}
.pc-service-details-content ul{
  margin: 0;
  padding-left: 18px;
}
.pc-service-details-content li{
  margin-bottom: 6px;
}





/* ===== Price Page Base ===== */
.pc-price{
  width: 100%;
  max-width: 980px;
  margin: 0px auto 100px;
  padding: 0 20px 15px;
  box-sizing: border-box;
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
  color: #0b3350;
}

/* 見出し（中央・細アンダーライン） */
.pc-price-heading{
  margin: 36px 0 50px;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: .02em;
  color: #0b3350;
  position: relative;
}
.pc-price-heading::after{
  content:"";
  display:block;
  width: 220px;
  height: 2px;
  margin: 10px auto 0;
  background: #99c9e6;
}

/* テーブル（薄い枠・中央寄せ） */
.pc-price-table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 0 auto 30px;
  border: 1px solid #d9e3ec;
  background: #fff;
}
.pc-price-table thead th{
  background: #f6fbff;
  color: #0b3350;
  font-weight: 700;
}
.pc-price-table th,
.pc-price-table td{
  padding: 14px 40px;
  font-size: 15px;
  letter-spacing: .01em;
  border-bottom: 1px solid #d9e3ec;
  border-right: 1px solid #d9e3ec;
  text-align: left;
}
.pc-price-table tr:last-child td{ border-bottom: none; }
.pc-price-table th:last-child,
.pc-price-table td:last-child{ border-right: none; }

/* 列の幅感 */
.pc-col-left{ width: 52%; }
.pc-col-right{ width: 48%; text-align: right; }
.pc-price-table tbody td:nth-child(2){ text-align: right; }

/* 備考テキスト */
.pc-price-note{
  margin: 10px 0 40px;
  font-size: 16px;
  color: #4b5563;
}

/* 淡いブルーの説明枠 */
.pc-price-info{
  background: #eaf4fc;
  border: 1px solid #d6e7f5;
  border-radius: 6px;
  padding: 16px 18px;
  margin: 18px 0 100px;
}
.pc-price-list{
  margin: 0;
  padding-left: 18px;
  color: #334155;
  line-height: 1.9;
  font-size: 16px;
}

/* ===== Responsive ===== */
@media (max-width: 640px){
  .pc-price{ padding: 0 14px; }
  .pc-price-heading{ font-size: 20px; }
  .pc-price-table th, .pc-price-table td{ font-size: 16px; padding: 12px 12px; }
  .pc-col-left, .pc-col-right{ width: auto; }
}

/* ====== 問い合わせフォーム ====== */
/* ====== ベース ====== */
.pc-form-wrap { width:min(760px, 92vw); margin:40px auto 80px; color:#333; font-size:16px; }
.pc-form-title { font-size:22px; margin:0 0 12px; }

/* ====== フォーム ====== */
.pc-form { border:1px solid #ddd; border-radius:8px; padding:20px; background:#fff; }

/* 位置ユーティリティ（ご要望：中央配置） */
.pc-align-center { display:flex; justify-content:center; align-items:center; gap:10px; text-align:center; }

/* ハニーポット（非表示） */
.pc-honeypot { position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* フィールドセット */
.pc-fieldset { border:0; padding:0; margin:0; }
.pc-legend { position:relative; font-weight:600; margin:6px 0 14px; }

/* Grid：1～2行目は2カラム、以降はフル幅 */
.pc-form-grid { display:grid; grid-template-columns: 1fr 1fr; gap:18px 22px; }
.pc-form-item { display:flex; flex-direction:column; gap:8px; }
.pc-form-item--full { grid-column:1 / -1; }

.pc-label { font-size:15px; }
.pc-required { color:#e60000; font-size:12px; margin-left:.25em; }
.pc-input, .pc-textarea {
  width:100%; padding:10px 12px; border:1px solid #ccc; border-radius:6px; font-size:16px;
}
.pc-input:focus, .pc-textarea:focus { outline:2px solid #bfe0ff; border-color:#80bfff; }
.pc-error { min-height:1.2em; color:#d40000; font-size:13px; }

/* アコーディオン（CSSのみ） */
.pc-accordion { margin:22px auto; width:100%; }
.pc-accordion-input { position:absolute; opacity:0; }
.pc-accordion-label {
  display:block; background:#0068b7; color:#fff; padding:12px 16px; border-radius:6px; cursor:pointer;
  position:relative; user-select:none; letter-spacing:.03em;
}
.pc-accordion-label::after {
  content:'＋'; position:absolute; right:14px; top:50%; transform:translateY(-50%); transition:transform .25s ease;
}
.pc-accordion-input:checked + .pc-accordion-label::after { transform: translateY(-50%) rotate(45deg); }
.pc-accordion-content {
  max-height:0; overflow:hidden; transition:max-height .35s ease; background:#f9fbfe; border:1px solid #e6eef9;
  border-top:0; border-radius:0 0 6px 6px; padding:0 16px;
}
.pc-accordion-input:checked ~ .pc-accordion-content { max-height:1500px; padding:14px 16px; }

/* 同意＆送信 */
.pc-policy { margin:18px 0; }
.pc-checkbox { width:18px; height:18px; }
.pc-checkbox-label { font-size:15px; }

.pc-submit-area { width:min(360px, 92%); margin:18px auto 0; }
.pc-btn {
  width:100%; padding:12px; border-radius:8px; border:1px solid #005183; background:#005183; color:#fff;
  font-size:16px; cursor:pointer; transition: all .25s ease;
}
.pc-btn:hover { background:#fff; color:#005183; }
.pc-btn:disabled { background:#fff; color:#bbb; border-color:#ccc; cursor:default; }
.pc-btn:disabled:hover { background:#fff; color:#bbb; }

/* レスポンシブ */
@media (max-width: 720px) {
  .pc-form-grid { grid-template-columns: 1fr; }
}
/* 中央寄せラベル用 */
.pc-center-text {
  text-align: center;
  justify-content: center;
}



/* アコーディオン（問い合わせページ専用） */
.pc-toiawase-item { margin: 22px 0; }

/* 見出しボタン */
.pc-toiawase-question {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border: 0;
  border-radius: 6px;
  background: #0068b7;
  color: #fff;
  font-size: 16px;
  letter-spacing: .03em;
  cursor: pointer;
  user-select: none;
}

/* プラス → クロス */
.pc-toiawase-question .pc-toiawase-icon { transition: transform .25s ease; }
.pc-toiawase-question[aria-expanded="true"] .pc-toiawase-icon { transform: rotate(45deg); }

/* ラッパ（高さアニメーション） */
.pc-toiawase-answer-wrapper {
  height: 0;
  overflow: hidden;
  transition: height .35s ease;
  border: 1px solid #e6eef9;
  border-top: 0;
  background: #f9fbfe;
  border-radius: 0 0 6px 6px;
}

/* 中身の余白 */
.pc-toiawase-answer {
  padding: 14px 16px;
  color: #333;
  font-size: 14px;
}

/* フォーカスリング */
.pc-toiawase-question:focus-visible {
  outline: 2px solid #e8d6c9;
  outline-offset: 2px;
}

/* 確認画面 */
.pc-confirm.confirm-page {
  max-width:760px;
  margin:200px auto 600px; /* 上200px 下600px */
  padding:0 16px;
  font-family:'Noto Sans JP','Yu Gothic','メイリオ',sans-serif;
  color:#333;
}

/* 送信完了画面 */
.pc-confirm.thanks-page {
  max-width:760px;
  margin:200px auto 600px; /* 上200px 下600px */
  padding:0 16px;
  font-family:'Noto Sans JP','Yu Gothic','メイリオ',sans-serif;
  color:#333;
}





/* spサイトCSS */

/* ===== SPメインビジュアル ===== */
.sp-hero {
  position: relative;
  width: 100%;
  height: 70vh;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.sp-hero-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.sp-hero-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 画面いっぱいに広げる */
  display: block;
}

/* コメントエリア */
.sp-hero-comment {
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  text-align: right;
  z-index: 1;
}

.sp-hero-title {
  font-family: "游明朝体", "Yu Mincho", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", serif;
  font-size: 28px;
  font-weight: 700;
  color: #ffffff;
  margin: 0;
  line-height: 1.4;
}

/* スマホ調整 */
@media (max-width: 640px) {
  .sp-hero {
    height: 60vh;
  }
  .sp-hero-title {
    font-size: 22px;
  }
}












/* ===== 共通見出し（SP） ===== */
.sp-midashi{
  position: relative;
  margin: 28px auto 50px;
  text-align: center;
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
  font-weight: 600;
  font-size: 20px;
  color: #5a7fc2;
  letter-spacing: .05em;
  width: 92%;
  max-width: 700px;
}
.sp-midashi::after{
  content:"";
  position:absolute;
  bottom:-10px; left:50%;
  transform:translateX(-50%);
  width:72px; height:3px;
  background:#5a7fc2;
  border-radius:999px;
}

/* ===== SP見出し（pc-midashi のSP版） ===== */
.sp-midashi-page {
  position: relative;
  margin: 60px auto 36px;
  text-align: center;
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 600;
  font-size: 20px;
  color: #5a7fc2;
  letter-spacing: 0.05em;
  width: 92%;
  max-width: 680px;
}
.sp-midashi-page::after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 72px;
  height: 3px;
  background: #5a7fc2;
  border-radius: 999px;
}


#sp-about,
#sp-kobutsu,
#sp-profile,
.sp-service-item {
  scroll-margin-top: 100px; /* ヘッダー高さに合わせて調整 */
}

/* ===== 事務所紹介（テキストのみ：SP） ===== */
.sp-about-text-only {
  background: #ffffff;
  width: 92%;
  max-width: 680px;
  margin: 0 auto 60px;
}
.sp-about-text-only p {
  margin: 0;
  font-size: 15.5px;
  letter-spacing: 0.02em;
  line-height: 1.9;
  color: #333333;
  text-align: justify;  /* 読みやすい整形 */
}

/* ===== セクション背景（古物商許可とは：SP） ===== */
.sp-kobutsu-wrap {
  width: 100%;
  background: #f0f7fb;       /* PCと統一の淡いブルー */
  padding: 28px 0 40px;
  margin-bottom: 60px;
}

/* ===== 内側カード本体 ===== */
.sp-kobutsu {
  width: 92%;
  max-width: 700px;
  margin: 0 auto;
  padding: 24px 16px 22px;
  background: #fff;
  border: 1px solid #e6ebf1;
  border-radius: 14px;
  box-sizing: border-box;
  position: relative;
}

/* 左上ラベル風見出し（SP） */
.sp-kobutsu-heading {
  position: absolute;
  top: -14px; left: 16px;
  margin: 0;
  padding: 6px 12px;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(90deg, #007acc, #00bfff);
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
}

/* 内部レイアウト（SPは縦積み） */
.sp-kobutsu-inner {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* 本文 */
.sp-kobutsu-text p {
  margin: 0;
  font-size: 15px;
  line-height: 1.95;
  color: #4b5563;
  text-align: justify;
}
.sp-kobutsu-text strong {
  color: #0b3350;
  font-weight: 700;
}

/* リストボックス */
.sp-kobutsu-points {
  background: #ffffff;
  border: 1px solid #e6ebf1;
  border-radius: 12px;
  padding: 14px 14px;
}

/* 小見出し */
.sp-kobutsu-subtitle {
  margin: 0 0 10px;
  font-size: 15.5px;
  font-weight: 700;
  color: #0b3350;
  padding-left: 10px;
  position: relative;
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
}
.sp-kobutsu-subtitle::before {
  content: "";
  position: absolute;
  left: 0; top: 4px; bottom: 4px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, #00bfff 0%, #007acc 100%);
}

/* 箇条書き（行間広め） */
.sp-kobutsu-list {
  margin: 8px 0 10px;
  padding: 0;
  list-style: none;
  display: grid;
  row-gap: 8px;
}
.sp-kobutsu-list li {
  position: relative;
  padding-left: 22px;
  font-size: 16px;
  line-height: 1.8;
  color: #374151;
}
.sp-kobutsu-list li::before {
  content: "";
  position: absolute;
  left: 0; top: 10px;
  width: 10px; height: 10px;
  border-radius: 999px;
  background: radial-gradient(60% 60% at 40% 40%, #00bfff 0%, #007acc 100%);
}

/* 注意文 */
.sp-kobutsu-note {
  margin: 8px 0 0;
  font-size: 12.5px;
  color: #586574;
}



/* =========================
   取扱業務（SP）
========================= */
.sp-services{
  width: 100%;
  margin: 12px auto 48px;
  padding: 0 0 0; /* 外枠余白は見出しに任せる */
  box-sizing: border-box;
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
}
.sp-services-list{
  width: 92%;
  max-width: 700px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;  /* SPは1カラム */
  gap: 16px;
}

/* カード */
.sp-service-card{
  background:#fff;
  border:1px solid #e6ebf1;
  margin-bottom:20px;	
  border-radius:12px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  padding-bottom:14px;
  transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.sp-service-card:hover{
  border-color:#d7e3ee;
  background-color:#fbfdff;
  box-shadow:0 6px 18px rgba(0,0,0,.06);
}

/* 画像 */
.sp-service-imgwrap{
  width:100%;
  aspect-ratio:16/9;
  background:#eef3f7;
  overflow:hidden;
}
.sp-service-imgwrap img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* テキスト */
.sp-service-name{
  margin: 12px 14px 6px;
  font-size: 17px;
  font-weight: 700;
  color:#0b3350;
  letter-spacing:.02em;
}
.sp-service-desc{
  margin: 0 14px 12px;
  font-size: 16px;
  line-height: 1.85;
  color:#4b5563;
}

/* CTA */
.sp-service-btn{
  align-self: flex-start;
  margin: 0 14px;
  display:inline-block;
  padding:10px 16px;
  border-radius:6px;
  text-decoration:none;
  font-weight:700;
  font-size:14px;
  letter-spacing:.02em;
  color:#fff;
  background: linear-gradient(90deg, #007acc, #00bfff);
  transition: opacity .2s ease;
}
.sp-service-btn:hover{ opacity:.85; }

/* =========================
   プロフィール（SP）
========================= */
.sp-profile{
  width:100%;
  margin: 20px auto 60px;
  background:#ffffff;
  border-radius:12px;
  padding: 16px;
  box-sizing: border-box;
}
.sp-profile-inner{
  width: 92%;
  max-width: 700px;
  margin: 0 auto;
  display:flex;
  flex-direction: column; /* SPは縦積み */
  gap: 16px;
  align-items: center;
}

/* 写真 */
.sp-profile-photo-wrap{
  width: 90%;
  border-radius:12px;
  overflow:hidden;
  background:#e9eef3;
}
.sp-profile-photo{
  display:block;
  width:100%;
  height: 320px;
  object-fit: cover;
}

/* 本文 */
.sp-profile-content{
  width:100%;
  position: relative;
  padding-left: 14px;  /* アクセントバー分 */
  box-sizing: border-box;
}
.sp-profile-content::before{
  content:"";
  position:absolute;
  left:0; top:2px; bottom:2px;
  width:4px; border-radius:999px;
  background: linear-gradient(180deg, #00bfff 0%, #007acc 100%);
  opacity:.85;
}

/* 名前 */
.sp-profile-name{
  margin:0 0 10px;
  font-weight:700;
  font-size:18px;
  color:#0b3350;
  letter-spacing:.02em;
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
}

/* 情報リスト */
.sp-profile-list{
  margin:0; padding:0;
  display:grid;
  grid-template-columns: 1fr;  /* SPは縦積み */
  row-gap: 8px;
  column-gap: 0;
  font-size:14px;
  line-height:1.85;
  color:#374151;
}
.sp-profile-row{ display: contents; }
.sp-profile-list dt{
  margin:0;
  font-weight:700;
  color:#0b3350;
}
.sp-profile-list dd{
  margin:0 0 8px 0;
  word-break: break-word;
}

/* 画面がやや広いスマホ（任意の微調整） */
@media (min-width: 420px){
  .sp-profile-photo{ height: 340px; }
}


/* ===== 選ばれる理由（セクション全体） ===== */
.sp-reasons {
  width: 100%;
  max-width: 1280px;
  margin: 24px auto 100px;
  padding: 32px 28px;
  border-radius: 16px;
  border: 0px solid #dde7f0;
  background:
    radial-gradient(90% 60% at 0% 0%, rgba(0,191,255,0.15) 0%, rgba(0,191,255,0) 70%),
    radial-gradient(80% 50% at 100% 100%, rgba(0,122,204,0.15) 0%, rgba(0,122,204,0) 70%),
    #ffffff;
}

.sp-reasons-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

/* ===== カード ===== */
.sp-reason-card {
  position: relative;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #e6ebf1;
  border-radius: 12px;
  padding: 48px 20px 36px;
  box-shadow: 0 4px 14px rgba(0,0,0,0.04);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.sp-reason-card:hover {
  box-shadow: 0 8px 22px rgba(0,0,0,0.06);
  border-color: #d7e3ee;
}

/* トップバー */
.sp-reason-topbar {
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 6px;
  background: linear-gradient(90deg, #00bfff, #007acc);
}

/* 番号バッジ */
.sp-reason-badge {
  position: absolute;
  top: 0; left: 0;
  padding: 8px 16px 10px;
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1;
  color: #fff;
  background: linear-gradient(135deg, #007acc, #00bfff);
  border-bottom-right-radius: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.10);
  z-index: 2;
}
.sp-reason-badge::after {
  content: "";
  position: absolute;
  inset: 0;
  border-bottom-right-radius: 10px;
  background:
    radial-gradient(120% 80% at 10% 0%, rgba(255,255,255,.35) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(to bottom, rgba(255,255,255,.08), rgba(0,0,0,0) 60%);
}

/* タイトル */
.sp-reason-title {
  margin: 12px 0 12px;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #0b3350;
  position: relative;
  padding-left: 12px;
}

/* アクセントアイコン */
.sp-reason-ico {
  display: inline-block;
  width: 14px; height: 14px;
  margin-right: 8px;
  border-radius: 999px;
  background: radial-gradient(60% 60% at 40% 40%, #00bfff 0%, #007acc 100%);
  vertical-align: -1px;
}

/* 説明文 */
.sp-reason-text {
  margin: 0;
  font-size: 15px;
  line-height: 1.9;
  color: #4b5563;
}

/* ===== レスポンシブ ===== */
@media (max-width: 1024px) {
  .sp-reasons-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .sp-reasons { padding: 0 14px; }
  .sp-reasons-grid { grid-template-columns: 1fr; }
  .sp-reason-badge { font-size: 20px; padding: 8px 14px 10px; }
}

/* ===== Q&A ===== */
.sp-qa-sen {
  width: 100%;
  max-width: 800px;
  margin: 0 auto 100px;
  padding: 0;
  box-sizing: border-box;
}

.sp-qa-item {
  margin-bottom: 30px;
  border: 1px solid #c9d9e8;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

/* Q（ボタン） */
.sp-qa-question {
  width: 100%;
  background: #fff;
  border: none;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  text-align: left;
  cursor: pointer;
  font-size: 16px;
  color: #333;
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
}
.sp-qa-question:hover { background:#f3f8fc; }

.sp-q-q {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: #1d3b5e;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  flex-shrink: 0;
}

.sp-qa-icon {
  display:inline-flex; align-items:center; justify-content:center;
  width:24px; height:24px;
  color:#1d3b5e;
  transition: transform .25s ease, color .25s ease;
}
.sp-qa-icon-svg { width:20px; height:20px; display:block; }

.sp-qa-question[aria-expanded="true"] .sp-qa-icon {
  transform: rotate(180deg);
  color:#007acc;
}

/* A（回答） */
.sp-qa-answer-wrapper {
  height: 0;
  overflow: hidden;
  transition: height .28s ease;
  will-change: height;
  border-top: 1px solid transparent;
}

.sp-qa-answer {
  padding: 14px 18px;
  border-top: 1px solid #c9d9e8;
  background:#fafcff;
  display:flex;
  gap:10px;
  align-items:flex-start;
}

.sp-q-a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid #1d3b5e;
  color: #1d3b5e;
  font-size: 16px;
  font-weight: 600;
  flex-shrink: 0;
}

.sp-qa-answer p {
  margin:0;
  font-size:15px;
  line-height:1.8;
  color:#3f3f3f;
}

@media (max-width: 640px){
  .sp-qa-question { padding: 12px 14px; font-size:15px; }
  .sp-qa-answer { padding: 12px 14px; }
}

/* Q&A：ボタン */
.sp-qa-more {
  margin-top: 8px;
  text-align: center;
}

.sp-qa-more-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: .02em;
  color: #fff;
  background: linear-gradient(90deg, #007acc, #00bfff);
  box-shadow: 0 4px 12px rgba(0,122,204,.18);
  transition: box-shadow .2s ease, opacity .2s ease;
}
.sp-qa-more-btn:hover {
  opacity: .92;
  box-shadow: 0 6px 16px rgba(0,122,204,.24);
}
.sp-qa-more-ic-svg {
  width: 18px;
  height: 18px;
}

/* ===== お問い合わせ ===== */
.sp-contact {
  width: 100%;
  max-width: 980px;
  margin: 60px auto 100px;
  padding: 0 16px;
  box-sizing: border-box;
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
  text-align: center;
}

.sp-contact-card {
  background: #fff;
  border-radius: 12px;
  padding: 0 20px;
  box-sizing: border-box;
}

.sp-contact-lead {
  margin: 0 0 40px;
  font-size: 15px;
  line-height: 1.9;
  color: #4b5563;
}

.sp-contact-actions {
  margin-bottom: 40px;
}
.sp-contact-btn-primary {
  display: inline-block;
  padding: 16px 50px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: .02em;
  color: #fff;
  background: linear-gradient(90deg, #007acc, #00bfff);
  box-shadow: 0 4px 12px rgba(0,122,204,.18);
  transition: opacity .2s ease;
}
.sp-contact-btn-primary:hover { opacity: .9; }

.sp-contact-notes {
  margin: 0;
  padding: 0;
  list-style: none;
  color: #586574;
  font-size: 13px;
  line-height: 1.8;
}

@media (max-width: 640px){
  .sp-contact-btn-primary {
    width: 100%;
    text-align: center;
  }
}



/* ===== ご依頼の流れ（タイムライン：SP） ===== */
.sp-flow {
  width: 100%;
  max-width: 720px;
  margin: 20px auto 80px;
  padding: 0 16px;
  box-sizing: border-box;
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
}

/* タイムライン本体 */
.sp-flow-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}

/* 各ステップ（縦線は各ステップの::afterで描画） */
.sp-flow-step {
  position: relative;
  display: flex;
  align-items: flex-start;
  margin-bottom: 28px;  /* ステップ間の余白（SP向けに少し詰める） */
  padding-left: 56px;   /* マーカー分の左インデント */
  box-sizing: border-box;
}

/* ステップの縦線（次のカードの上端まで伸ばすイメージ） */
.sp-flow-step::after {
  content: "";
  position: absolute;
  left: 20px;              /* マーカー中心に合わせる（マーカー幅32pxの半分） */
  top: 36px;               /* マーカーの下から出るように */
  width: 2px;
  height: calc(100% + 28px); /* 次のステップとの余白分も含めて伸ばす */
  background: linear-gradient(180deg, #00bfff, #007acc);
}

/* 最後のステップは線を消す */
.sp-flow-step:last-child {
  margin-bottom: 0;
}
.sp-flow-step:last-child::after {
  content: none;
}

/* マーカー（番号） */
.sp-flow-marker {
  position: absolute;
  left: 4px;
  top: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: linear-gradient(180deg, #00bfff, #007acc);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  z-index: 1;
}

/* 内容カード */
.sp-flow-content {
  background: #ffffff;
  border: 1px solid #e6ebf1;
  border-radius: 10px;
  padding: 14px 16px;
  flex: 1;
  box-shadow: 0 4px 10px rgba(0,0,0,0.03);
  box-sizing: border-box;
}

.sp-flow-title {
  margin: 0 0 6px;
  font-size: 16px;
  font-weight: 700;
  color: #0b3350;
  line-height: 1.5;
}

.sp-flow-text {
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
  color: #4b5563;
}

/* 細かい端末幅での微調整（任意） */
@media (min-width: 400px) {
  .sp-flow-marker { width: 34px; height: 34px; left: 3px; }
  .sp-flow-step { padding-left: 58px; }
  .sp-flow-step::after { left: 20px; top: 38px; }
}

/* 料金ページ */
/* ベースフォント（ゴシック統一） */
html, body { font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif; }

/* ===== Price Page Base (SP) ===== */
.sp-price{
  width: 100%;
  max-width: 720px;
  margin: 40px auto 80px;
  padding: 0 16px 12px;
  box-sizing: border-box;
  color: #0b3350;
}

/* 見出し（左寄せ・長いアンダーバー） */
.sp-price-heading{
  margin: 28px 0 32px;
  text-align: left;          /* 中央寄せ → 左寄せ */
  font-size: 20px;
  font-weight: 600;
  letter-spacing: .02em;
  color: #0b3350;
  position: relative;
}
.sp-price-heading::after{
  content:"";
  display:block;
  width: 100%;               /* アンダーバーを見出し幅いっぱいに */
  max-width: 320px;          /* 長すぎ防止。必要に応じて調整可 */
  height: 2px;
  margin: 10px 0 0;          /* 左寄せに合わせ margin を修正 */
  background: #99c9e6;
  border-radius: 999px;
}

/* テーブル（通常は表、SPではカード化） */
.sp-price-table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 0 auto 12px;
  border: 1px solid #d9e3ec;
  background: #fff;
  overflow: hidden; /* 角丸のためにラップ */
  border-radius: 8px;
}

.sp-price-table thead th{
  background: #f6fbff;
  color: #0b3350;
  font-weight: 700;
}

.sp-price-table th,
.sp-price-table td{
  padding: 12px 14px;
  font-size: 15px;
  letter-spacing: .01em;
  border-bottom: 1px solid #d9e3ec;
  border-right: 1px solid #d9e3ec;
  text-align: left;
}
.sp-price-table tr:last-child td{ border-bottom: none; }
.sp-price-table th:last-child,
.sp-price-table td:last-child{ border-right: none; }

/* 列幅（横幅十分な端末時に効く） */
.sp-col-left{ width: 52%; }
.sp-col-right{ width: 48%; text-align: right; }
.sp-price-table tbody td:nth-child(2){ text-align: right; }

/* 備考テキスト */
.sp-price-note{
  margin: 8px 0 22px;
  font-size: 14px;
  color: #4b5563;
  line-height: 1.8;
}

/* 淡いブルーの説明枠 */
.sp-price-info{
  background: #eaf4fc;
  border: 1px solid #d6e7f5;
  border-radius: 8px;
  padding: 14px 16px;
  margin: 16px 0 60px;
}
.sp-price-list{
  margin: 0;
  padding-left: 18px;
  color: #334155;
  line-height: 1.9;
  font-size: 14px;
}

/* ===== スマホでのカード表示（行ごと縦積み） ===== */
@media (max-width: 600px){
  .sp-price-heading{ font-size: 18px; }

  .sp-price-table {
    border: none;            /* 外周線はカード側で表現 */
    border-radius: 0;
  }

  .sp-price-table thead {
    display: none;           /* 見出し行は非表示 */
  }

  .sp-price-table tbody,
  .sp-price-table tr,
  .sp-price-table td {
    display: block;          /* 行カード化 */
    width: 100%;
  }

  .sp-price-table tbody tr{
    background: #fff;
    border: 1px solid #d9e3ec;
    border-radius: 10px;
    margin-bottom: 12px;     /* 行と行の間隔 */
    overflow: hidden;
  }

  .sp-price-table td{
    border: none;            /* 罫線を消す（カード内で分ける） */
    padding: 10px 14px 8px;
    font-size: 15px;
  }

  /* 1行内で上：業務内容、下：金額　の順に見せる */
  .sp-price-table td[data-label]{
    position: relative;
    padding-top: 24px;       /* ラベル分の余白 */
  }

  /* 擬似ラベル（theadの代わり） */
  .sp-price-table td[data-label]::before{
    content: attr(data-label);
    position: absolute;
    left: 14px;
    top: 6px;
    font-size: 12px;
    color: #64748b;
    letter-spacing: .02em;
  }

  /* 金額セルだけ右寄せしたい場合（任意） */
  .sp-price-table tbody td:nth-child(2){
    text-align: right;
  }
}

/* 取り扱い業務 */

/* 固定ヘッダーの高さが60pxの場合 */
#sp-service-shinsei,
#sp-service-henkou,
#sp-service-koushin {
  scroll-margin-top: 70px; /* ヘッダー高さ + 少し余裕 */
}

/* ===== 取扱業務（リスト型：SP） ===== */
.sp-services-listing{
  width: 100%;
  max-width: 720px;
  margin: 24px auto 64px;
  padding: 0 16px;
  box-sizing: border-box;
}

/* 導入文（中央寄せ・読みやすい行間） */
.sp-services-intro{
  max-width: 640px;
  margin: 0 auto 28px;
  color: #4b5563;
  font-size: 16px;
  line-height: 1.9;
  text-align: left;
}

/* リスト本体 */
.sp-service-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  row-gap: 14px; /* モジュール間の余白 */
}

/* 各業務ボックス（SP向けに余白・影を軽めに） */
.sp-service-box{
  background: #fff;
  border: 1px solid #e6ebf1;
  border-radius: 12px;
  padding: 16px 16px;
  margin-bottom: 12px;
  /* 右下に寄せた軽い影（SPで重く見えない程度） */
  box-shadow: 3px 3px 10px rgba(0,0,0,0.10);
}

/* 業務タイトル */
.sp-service-title{
  margin: 0 0 8px;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .02em;
  color: #0b3350;
}

/* 短い説明 */
.sp-service-lead{
  margin: 0 0 10px;
  padding: 8px 0 8px;
  font-size: 14px;
  line-height: 1.75;
  color: #374151;
}

/* 詳しい説明（常時表示） */
.sp-service-details-content{
  font-size: 14px;
  line-height: 1.8;
  color: #374151;
  background: #f7fbff;
  border: 1px solid #d6e7f5;
  border-radius: 8px;
  padding: 12px 14px;
}
.sp-service-details-content ul{
  margin: 0;
  padding-left: 18px; /* 箇条書きインデント */
}
.sp-service-details-content li{
  margin-bottom: 6px;
}

/* 画面が少し広いスマホでの微調整（任意） */
@media (min-width: 420px){
  .sp-service-title{ font-size: 18px; }
  .sp-service-lead{ font-size: 16px; }
  .sp-service-details-content{ font-size: 16px; }
}



/* ====== 問い合わせフォーム（SP） ====== */
/* ベース */
.sp-form-wrap { width:min(680px, 92vw); margin:28px auto 64px; color:#333; font-size:16px; }
.sp-form-title { font-size:20px; margin:0 0 12px; }

/* フォーム本体 */
.sp-form { border:1px solid #e6e6e6; border-radius:10px; padding:16px; background:#fff; }

/* 位置ユーティリティ（中央寄せ） */
.sp-align-center { display:flex; justify-content:center; align-items:center; gap:10px; text-align:center; }

/* ハニーポット（非表示） */
.sp-honeypot { position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* フィールドセット */
.sp-fieldset { border:0; padding:0; margin:0; }
.sp-legend { position:relative; font-weight:600; margin:6px 0 14px; }

/* Grid（SPは基本1カラム） */
.sp-form-grid {
  display:grid;
  grid-template-columns: 1fr;
  gap:14px 18px;
}
.sp-form-item { display:flex; flex-direction:column; gap:8px; }
.sp-form-item--full { grid-column:1 / -1; }

.sp-label { font-size:15px; }
.sp-required { color:#e60000; font-size:12px; margin-left:.25em; }

.sp-input, .sp-textarea {
  width:100%;
  padding:12px 14px;
  border:1px solid #ccc;
  border-radius:8px;
  font-size:16px;
  -webkit-tap-highlight-color: transparent;
}
.sp-input:focus, .sp-textarea:focus { outline:2px solid #bfe0ff; border-color:#80bfff; }
.sp-error { min-height:1.1em; color:#d40000; font-size:13px; }

/* ===== アコーディオン（問い合わせページ専用・SP） ===== */
.sp-toiawase-item { margin: 18px 0; }

/* 見出しボタン */
.sp-toiawase-question {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  border: 0;
  border-radius: 8px;
  background: #0068b7;
  color: #fff;
  font-size: 16px;
  letter-spacing: .03em;
  cursor: pointer;
  user-select: none;
}

/* プラス → クロス */
.sp-toiawase-question .sp-toiawase-icon { transition: transform .25s ease; }
.sp-toiawase-question[aria-expanded="true"] .sp-toiawase-icon { transform: rotate(45deg); }

/* ラッパ（高さアニメーション） */
.sp-toiawase-answer-wrapper {
  height: 0;
  overflow: hidden;
  transition: height .35s ease;
  border: 1px solid #e6eef9;
  border-top: 0;
  background: #f9fbfe;
  border-radius: 0 0 8px 8px;
}

/* 中身の余白 */
.sp-toiawase-answer {
  padding: 14px 16px;
  color: #333;
  font-size: 14px;
}

/* フォーカスリング */
.sp-toiawase-question:focus-visible {
  outline: 2px solid #e8d6c9;
  outline-offset: 2px;
}

/* ===== 同意＆送信 ===== */
.sp-policy { margin:16px 0; }
.sp-checkbox { width:20px; height:20px; }
.sp-checkbox-label { font-size:15px; }

.sp-submit-area { width:min(360px, 92%); margin:12px auto 0; }
.sp-btn {
  width:100%;
  padding:14px;
  border-radius:10px;
  border:1px solid #005183;
  background:#005183;
  color:#fff;
  font-size:16px;
  cursor:pointer;
  transition: all .25s ease;
}
.sp-btn:hover { background:#fff; color:#005183; }
.sp-btn:disabled { background:#fff; color:#bbb; border-color:#ccc; cursor:default; }
.sp-btn:disabled:hover { background:#fff; color:#bbb; }

/* ===== ちょい広め端末で余白を最適化 ===== */
@media (min-width: 480px) and (max-width: 780px) {
  .sp-form-wrap { width:min(720px, 94vw); }
  .sp-form { padding:18px; }
}




/* 上に戻るボタン */

#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #aae272;
  opacity: 0.6;
  border-radius: 50%;
margin-right: 3%;
	margin-bottom: 3%;
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before{
  font-family: FontAwesome;
  content: '\f102';	
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}


/* ===== Footer 上段：リンク群 ===== */
.pc-footer {
  width: 100%;
  background: #007acc; /* 爽やかな海系ブルー（単色） */
  padding: 40px 0;
  box-sizing: border-box;
  border-top: 1px solid rgba(255,255,255,0.15);
}

.pc-footer-inner {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box;
}

.pc-footer-menu {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.pc-footer-row {
  display: flex;
  flex-wrap: wrap;
  gap: 18px 24px;
  align-items: center;
  justify-content: center;
  margin: 6px 0;
}

/* リンク */
.pc-footer-row a {
  color: #ffffff;
  text-decoration: none;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.02em;
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
  transition: color .2s ease, opacity .2s ease;
}
.pc-footer-row a:hover {
  color: #e0f7ff; /* ホバーでやや明るく */
}

/* ===== Footer 下段：コピーライト ===== */
.pc-footer-2-copyright {
  width: 100%;
  background: #005f99;  /* 上段より少し濃いブルー */
  border-top: 1px solid rgba(255,255,255,0.15);
  padding: 24px 0;
  box-sizing: border-box;
  text-align: center;
}

.pc-footer-2-copyright > p {
  margin: 0;
  max-width: 1280px;
  padding: 0 20px;
  font-size: 16px;
  letter-spacing: 0.02em;
  color: rgba(255,255,255,0.9);
  font-weight: 400;
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
  margin-left: auto; 
  margin-right: auto;
}

/* ===== Responsive ===== */
@media (max-width: 720px) {
  .pc-footer-row {
    gap: 12px 18px;
  }
  .pc-footer-row a {
    font-size: 16px;
  }
}




/* ===== SPフッターナビ（本サイト用に調整） ===== */
.sp-footer-nav{
  width: 100%;
  background: #eaf4fc;            /* サイトのトーンに合わせた淡いブルー */
  padding: 28px 0;
}

.sp-footer-nav-inner{
  width: 90%;
  margin: 0 auto;
}

.sp-footer-nav-list{
  margin: 0;
  padding: 0;
  list-style: none;
}

/* 各行 */
.sp-footer-nav-item{
  position: relative;
  padding: 8px 0;
  border-bottom: 1px solid #c9d9e8;  /* 下線（区切り） */
}

/* 最後の項目は線を外す */
.sp-footer-nav-item:last-child{
  border-bottom: none;
}

/* リンク */
.sp-footer-nav-item > a{
  display: block;
  padding-left: 8%;               /* 先頭の「-」相当の余白 */
  color: #333333;
  font-size: 15px;
  letter-spacing: 1px;
  text-decoration: none;
  font-family: "Noto Sans JP","Yu Gothic","メイリオ",sans-serif;
  font-weight: 300;
  line-height: 1.7;
}

/* 先頭の「- 」をCSSで再現（元デザイン踏襲） */
.sp-footer-nav-item::before{
  content: "- ";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-52%);
  color: #5b7287;                 /* 少し落ち着いたブルーグレー */
  font-weight: 400;
}

/* ホバー（タップ時の視認性UP） */
.sp-footer-nav-item > a:hover{
  text-decoration: underline;
  color: #005f99;
}


/* ===== SPフッター ===== */
.sp-footer {
  width: 100%;
  clear: both;
  text-align: center;
  padding: 18px 0;
  background: #007acc; /* PC版に合わせたブルー基調 */
}

.sp-footer p {
  margin: 0;
  font-size: 13px;
  line-height: 1.7;
  color: #ffffff;  /* PC版同様に白文字 */
  letter-spacing: 0.5px;
  font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 400;
}




*, *:before, *:after {
	box-sizing: border-box;
}





/*メニューをページ下部に固定*/
#sp-fixed-menu{
   position: fixed;
   width: 100%;
   bottom: 0px;
   font-size: 0;
   opacity: 1;
   z-index: 99;
}

/*メニューを横並びにする*/
#sp-fixed-menu ul{
   display: flex;
   list-style: none;
   padding:0;
   margin:0;
   width:100%;
}

#sp-fixed-menu li{
   justify-content: center;
   align-items: center;
   width: 50%;
   padding:0;
   margin:0;
   font-size: 16px;
   border-right: 1px solid #fff;
}

/*左側メニュー*/
#sp-fixed-menu li:first-child{
   background: #FF5733;
}

/*右側メニュー*/
#sp-fixed-menu li:last-child{
   background: #FF8C42;
}

/*ボタンを調整*/
#sp-fixed-menu li a{
   color: #fff;
	font-size:14px;
   text-align: center;
   display:block;
	text-decoration: none;
   width: 100%;
   padding:15px 10px;
	letter-spacing: 1px;
 font-family:"游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,sans-serif;	
}
@media (min-width: 768px) {
   .for-sp{
      display:none;
    }
}


/* モーダル全体 */

.modal {
  position: fixed;
  top: -100%;  /* 初期状態を画面外の上 */
  left: 0;
  width: 100%;
  height: 98%;
  background: #F5F5F5;
  display: none; /* 初期状態では非表示 */
  align-items: flex-start; /* 上に寄せる */
  transition: top 0.8s ease-in-out; /* スライドアニメーション */
  z-index: 100;
}

/* モーダルが表示された状態（開くとき） */
.modal.sp-show {
  display: flex;
  top: 0; /* 開くときに画面の上端へ */
}

/* モーダルが閉じるアニメーション（閉じるときに上へスライド） */
.modal.closing {
  top: -100%; /* 上へスライド */
}

/* 閉じるボタン */
.close-btn {
  position: absolute;
  top: 10px;
  right: 20px;
  font-size: 30px;
  cursor: pointer;
  color: #333;
}


.modal-content{
width: 90%;
padding-left:5%;
padding-top:40px;
background: #F5F5F5;	
}

.sp-lang-botan-ja {
  display: block;	
  background-color: #D4AF37;
  width: 300px;	
  margin: auto;	
  margin-top: 40px;
  margin-bottom: 40px;
  text-align: center;	
  padding: 8px;	
  border-radius: 0px;
  border: 1px solid #ffffff;	
  box-shadow: 0px 0px 0px 3px #D4AF37;
}
  

.sp-lang-botan-ja > a {	
  display: block;
  position: relative;	
  font-size: 16px;
  color: #ffffff;
  text-decoration: none;	
   
  letter-spacing: 2px;font-family: "Noto Sans JP", "Yu Gothic", "メイリオ", sans-serif;
font-weight: 300;
}

.sp-lang-botan-ja > a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  width: 0;
  height: 0;
  margin: -3px 0 0 0;
  border-top: 6px solid #ffffff;
  border-left: 6px solid transparent;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}




/* 初期状態の共通設定 */
.mojianime1 span,
.mojianime2 span,
.mojianime3 span,
.mojianime4 span,
.mojianime5 span,
.mojianime6 span,
.pc-main-image span,
.mojianime8 span,
.mojianime9 span,
.mojianime10 span
{
    display: inline-block;
    opacity: 0; /* 初期は透明 */
    transform: translate(0, 0) rotateY(0deg); /* 初期位置と回転角度 */
    will-change: transform, opacity; /* パフォーマンス向上 */
    backface-visibility: visible; /* 背面を表示 */
    transform-style: preserve-3d; /* 3D効果を維持 */
}

/* アニメーションごとのスタイル */
.mojianime1 span {
    transform: translate(-10px, -10px) rotateY(0deg); /* 初期状態 */
}

.mojianime2 span {
    transform: translate(0, -10px) rotateY(0deg); /* 初期状態 */
}

.mojianime3 span {
    transform: translate(0, 10px) rotateY(0deg); /* 初期状態 */
}

.mojianime4 span {
    transform: translate(-10px, 10px) rotateY(0deg); /* 初期位置 */
}

.mojianime5 span {
    transform: translateY(20px); /* 初期位置 */

}

.mojianime6 span {
    transform: translateY(0); /* 初期位置 */
}

.mojianime7 span {
    opacity: 0; /* 初期状態で透明 */
    transform: translateY(0); /* 初期位置は変化なし */
}
.mojianime8 span {
    opacity: 0; /* 初期状態で透明 */
    transform: translateY(0px); /* 初期位置 */
}
.mojianime9 span {
    transform: translate(0, -10px); /* 初期状態 */
}
.mojianime10 span {
    transform: translate(0, 10px); /* 初期状態 */
}


/* アニメーション1 */
.title-sen1 {
  width: 100%;
  max-width: 800px;
  margin: auto;
  border-bottom: 1px solid #848484;
  transform-origin: center;
  transform: scaleX(0); /* 初期状態で非表示 */
  transition: transform 1.5s ease-out;
}
.title-sen1.title-sen1-active {
  transform: scaleX(1); /* アニメーションで表示 */
}

/* アニメーション2 */

.title-sen2 {
  width: 100%;
  max-width: 750px;
  margin: auto;
  border-bottom: 1px solid #848484;
  transform-origin: left; /* アニメーションの起点を左側に設定 */
  transform: scaleX(0); /* 初期状態で非表示 */
  transition: transform 1.3s ease-out; /* アニメーション設定 */
}

.title-sen2.title-sen2-active {
  transform: scaleX(1); /* アニメーションで表示 */
}

/* アニメーション3 */

.title-sen3 {
  width: 100%;
  max-width: 750px;
  margin: auto;
  border-bottom: 3px solid #d4d4d4;
  transform-origin: right; /* アニメーションの起点を左側に設定 */
  transform: scaleX(0); /* 初期状態で非表示 */
  transition: transform 1.3s ease-out; /* アニメーション設定 */
}

.title-sen3.title-sen3-active {
  transform: scaleX(1); /* アニメーションで表示 */
}


.title-sen4 {
  width: 100%;
  max-width: 750px;
  margin: auto;
  border-bottom: 1px solid #848484;
  transform-origin: left; /* アニメーションの起点を左側に設定 */
  transform: scaleX(0); /* 初期状態で非表示 */
  transition: transform 1.3s ease-out 0.7s; /* アニメーション設定 */
}

.title-sen4.title-sen4-active {
  transform: scaleX(1); /* アニメーションで表示 */
}


/* イメージアニメーション1　右からスライド */
.image-right {

}

.image-right img {
  opacity: 0; /* 初期は透明 */
  transform: translateX(30px); /* 右にずらす */
  transition: transform 1s ease-out, opacity 1s ease-out;
}

.image-right-active img {
  transform: translateX(0); /* 元の位置に戻す */
  opacity: 1; /* 完全に表示 */
}
.image-right-all {
  opacity: 0; /* 初期は透明 */
  transform: translateX(30px); /* 右にずらす */
  transition: transform 1s ease-out, opacity 1s ease-out;
}


.image-right-all-active{
  transform: translateX(0); /* 元の位置に戻す */
  opacity: 1; /* 完全に表示 */
}


/* イメージアニメーション2　左からスライド */
.image-left {

}

.image-left img {
  opacity: 0; /* 初期は透明 */
  transform: translateX(-30px); /* 左にずらす */
  transition: transform 1s ease-out, opacity 1s ease-out;
}

.image-left-active img {
  transform: translateX(0); /* 元の位置に戻す */
  opacity: 1; /* 完全に表示 */
}

.image-left-all {
  opacity: 0; /* 初期は透明 */
  transform: translateX(-40px); /* 左にずらす */
  transition: transform 1.2s ease-out, opacity 1.2s ease-out;
}
.image-left-all-active{
  transform: translateX(0); /* 元の位置に戻す */
  opacity: 1; /* 完全に表示 */
}



.image-left-1{
  opacity: 0; /* 初期は透明 */
  transform: translateX(-30px); /* 左にずらす */
  transition: transform 1.8s ease-out, opacity 1.8s ease-out;
}
.image-left-2 {
  opacity: 0;
  transform: translateX(-80px);
  transition: transform 1.8s ease-out 0.3s, opacity 1.8s ease-out 0.3s; /* 0.3秒の遅延 */
}
.image-left-3 {
  opacity: 0;
  transform: translateX(-100px);
  transition: transform 1.8s ease-out 0.6s, opacity 1.8s ease-out 0.6s; /* 0.6秒の遅延 */
}
.image-left-1-active{
  transform: translateY(0); /* 元の位置に戻す */
  opacity: 1; /* 完全に表示 */
}

.image-left-2-active{
  transform: translateX(0); /* 元の位置に戻す */
  opacity: 1; /* 完全に表示 */
}
.image-left-3-active{
  transform: translateX(0); /* 元の位置に戻す */
  opacity: 1; /* 完全に表示 */
}

/* イメージアニメーション3　下からスライド */
.image-shita {

}

.image-shita img {
  opacity: 0; /* 初期は透明 */
  transform: translateY(30px); /* 下にずらす */
  transition: transform 1s ease-out, opacity 1s ease-out;
}

.image-shita-active img {
  transform: translateY(0); /* 元の位置に戻す */
  opacity: 1; /* 完全に表示 */
}
.image-shita-all {
  opacity: 0; /* 初期は透明 */
  transform: translateY(40px); /* 下にずらす */
  transition: transform 0.8s ease-out, opacity 0.8s ease-out;
}


.image-shita-all-active{
  transform: translateY(0); /* 元の位置に戻す */
  opacity: 1; /* 完全に表示 */
}

/* イメージアニメーション4　上からスライド */
.image-ue {

}

.image-ue img {
  opacity: 0; /* 初期は透明 */
  transform: translateY(-30px); /* 上にずらす */
  transition: transform 1s ease-out, opacity 1s ease-out;
}

.image-ue-active img {
  transform: translateY(0); /* 元の位置に戻す */
  opacity: 1; /* 完全に表示 */
}
.image-ue-all {
  opacity: 0; /* 初期は透明 */
  transform: translateY(-30px); /* 上にずらす */
  transition: transform 1s ease-out, opacity 1s ease-out;
}
.image-ue-all-active{
  transform: translateY(0); /* 元の位置に戻す */
  opacity: 1; /* 完全に表示 */
}

/* botanアニメーション1 */
a.botan{
display: block;	
width: 60%;	
max-width: 250px;
padding:10px 0;	
margin:auto;	
background: #ffffff;
position: relative;	
text-align: center;	
font-size:18px;
letter-spacing: 2px;
color:#8c6f54;
text-decoration: none; 
margin-bottom:60px;	
}


/* 初期状態: ボーダー非表示 */
a.botan::before,
a.botan::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border: 2px solid #decfbf; /* ボーダー色 */
    border-radius: 0;
    transition: none;
}

/* 左上を起点に右に伸びて下に伸びる */
a.botan::before {
    top: 0;
    left: 0;
    border-right-width: 0;
    border-bottom-width: 0;
}

/* 右下を起点に左に伸びて上に伸びる */
a.botan::after {
    bottom: 0;
    right: 0;
    border-left-width: 0;
    border-top-width: 0;
}

/* アニメーション時: ボーダー展開※クラス名は親クラス名-animate */
a.botan-animate::before {
    animation: botan-anime1 1.5s forwards;
}

a.botan-animate::after {
    animation: botan-anime2 1.5s forwards;
}

/* calcでborderの太さ文の数字を引く */
@keyframes botan-anime1 {
    0% {
        width: 0;
        height: 0;
    }
    50% {
        width: calc(100% - 0px); /* ボーダーサイズを考慮 */
        height: 0;
    }
    100% {
        width: calc(100% - 0px); /* ボーダーサイズを考慮 */
        height: calc(100% - 0px); /* ボーダーサイズを考慮 */
    }
}

@keyframes botan-anime2 {
    0% {
        width: 0;
        height: 0;
    }
    50% {
        width: calc(100% - 0px); /* ボーダーサイズを考慮 */
        height: 0;
    }
    100% {
        width: calc(100% - 0px); /* ボーダーサイズを考慮 */
        height: calc(100% - 0px); /* ボーダーサイズを考慮 */
    }
}

.botan > a::before,
.botan > a::after {
  pointer-events: none; /* ← これを追加！ */
}


/* PCでアンカー位置をずらす（ヘッダー高さに合わせて調整） */
#about,
#kobutsu,
#gyoumu,
#profile {
  scroll-margin-top: 70px;  /* ← ここを希望の高さに変更 */
}