/* =====================================================
   ラクマス用：最終CSS（!importantなし／競合なし）
   PC：社名（左）＋上部メニュー4項目（右）
   SP：右上ハンバーガー（PCと同じ4項目）
   左サイド非表示で1カラム
   800px固定テーブルをSPで100%
   バナー高さ155px欠けない
   ===================================================== */


/* ===== 全体の基本 ===== */
body, td, th, input, textarea, select{
  font-size:14px;
  color:#000;
  font-family:"游明朝","ヒラギノ角ゴ ProN","MS PGothic",sans-serif;
  line-height:150%;
  background:#fff;
  margin:0;
  padding:0;
}
img{
  margin:0;
  border:0;
  max-width:100%;
  height:auto;
}
a:link, a:visited{
  color:#000;
  text-decoration:none;
}
a:hover{
  color:#006699;
  text-decoration:underline;
}
a:active{
  text-decoration:underline;
}

/* ===== 1カラム化（サイド非表示） ===== */
html body #sidebar_left,
html body #sidebar_right{
  display:none;
  width:0;
}
html body #col_layout{
  width:100%;
  margin:0;
  padding:0;
}
html body #main{
  margin:0;
  padding:0 10px 10px;
  text-align:left;
  line-height:165%;
}

/* ===== ヘッダー（PC） 社名＋上部メニュー ===== */
/* ラクマス既存の #header_menu を使う前提 */
html body div#header_menu{
  display:block;
  background:#ffffff;
  padding:8px 10px;
  border-bottom:0px solid #dddddd;
}

/* 社名を左に表示（topmsgが無くても出る保険） */
html body div#header_menu::before{
  content:"株式会社サンライズコーポレーション";
  float:left;
  font-size:17px;
  font-weight:bold;
  color:#000;
  line-height:1.2;
  padding:6px 0;
}

/* メニューを右に */
html body div#header_menu ul.header_menu{
  float:right;
  margin:0;
  padding:0;
}
html body div#header_menu li.header_menu{
  list-style:none;
  float:left;
  margin:0;
  padding:0;
}
html body div#header_menu li.header_menu a{
  display:block;
  padding:6px 8px;
  font-size:15px;
  color:#000;
  text-decoration:none;
}
html body div#header_menu li.header_menu a:hover{
  color:#0066cc;
  text-decoration:none;
}

/* floatの回り込み解除 */
html body div#header_menu::after{
  content:"";
  display:block;
  clear:both;
}

/* ===== 見出しをシンプルに ===== */
h1 {
	font-size: 26px;
	color: #A7B1BE;
	text-decoration: none;
	font-weight: bold;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 15px;
	margin-left: 0px;
	padding-top: 8px;
	padding-right: 6px;
	padding-bottom: 6px;
	padding-left: 20px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #DDDDDD;
}
h2 {
	font-size: 18px;
	color: #494949;
	background: #FFFFFF url(/skins/highgrade02/image/tem_h2.png) no-repeat left top;
	text-decoration: none;
	border-right-width: 1px;
	border-bottom-width: 3px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #A7B1BE;
	border-bottom-color: #A7B1BE;
	font-weight: bold;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	padding-top: 12px;
	padding-right: 0px;
	padding-bottom: 8px;
	padding-left: 25px;
}
h3 {
	font-size: 18px;
	color: #494949;
	font-weight: bold;
	text-decoration: none;
	background-image: url(/skins/highgrade02/image/tem_h3.gif);
	background-repeat: no-repeat;
	background-position: 4px 6px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #A7B1BE;
	margin-top: 15px;
	margin-right: 5px;
	margin-bottom: 10px;
	margin-left: 0px;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 3px;
	padding-left: 25px;
}
h4 {
	font-size: 16px;
	color: #494949;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #A7B1BE;
	margin-top: 15px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	padding-top: 2px;
	padding-right: 0px;
	padding-bottom: 2px;
	padding-left: 15px;
}
h5 {
	font-size: 16px;
	color: #494949;
	background-image: url(/skins/highgrade02/image/tem_h5.gif);
	background-repeat: no-repeat;
	background-position: 0px 2px;
	padding-top: 2px;
	padding-left: 25px;
	text-decoration: none;
	padding-bottom: 2px;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
}
h6 {
	color: #494949;
	font-size: 16px;
	padding-left: 10px;
	padding-top: 0px;
	text-decoration: none;
	border-left-width: 8px;
	border-left-style: solid;
	border-left-color: #A7B1BE;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
}
hr{
  border:none;
  border-bottom:0px solid #eee;
  margin:8px 0;
}

/* ===== 表 ===== */
table{
  font-size:13px;
  line-height:165%;
}
table.table_type1, table.table_type2{
  width:100%;
  border-collapse:collapse;
  margin-bottom:10px;
  background:#fff;
}
table.table_type1 th, table.table_type2 th{
  background:#f5f5f5;
  padding:6px;
  border:0px solid #ddd;
  text-align:center;
}
table.table_type1 td, table.table_type2 td{
  padding:6px;
  border:0px solid #ddd;
}


/* =====================================================
   スマホ用：右上ハンバーガー（同じ4項目）
   HTMLの hm-wrap / hm-check / hm-btn / hm-menu / hm-bg を使う
   ===================================================== */
.hm-wrap{ position:relative; }
.hm-check{ display:none; }

/* 三本線ボタン（右上固定） */
.hm-btn{
  display:none;               /* SPだけ表示 */
  width:46px;
  height:46px;
  background:#222;
  border-radius:4px;
  position:fixed;
  top:10px;
  right:10px;
  cursor:pointer;
  z-index:99999;
}
.hm-btn span{
  position:absolute;
  top:50%;
  left:50%;
  width:26px;
  height:3px;
  background:#fff;
  transform:translate(-50%,-50%);
}
.hm-btn span::before,
.hm-btn span::after{
  content:"";
  position:absolute;
  left:0;
  width:26px;
  height:3px;
  background:#fff;
}
.hm-btn span::before{ top:-8px; }
.hm-btn span::after { top: 8px; }

/* メニュー本体（下から出る） */
.hm-menu{
  position:fixed;
  bottom:-100vh;
  left:0;
  width:100vw;
  height:60vh;
  background:#fff;
  box-shadow:0 -2px 6px rgba(0,0,0,0.25);
  transition:bottom .32s;
  padding-top:20px;
  z-index:99998;
}
.hm-menu ul{
  list-style:none;
  margin:0;
  padding:0;
}
.hm-menu li a{
  display:block;
  padding:15px 18px;
  border-bottom:1px solid #eee;
  font-size:17px;
  color:#000;
  text-decoration:none;
}

/* 暗幕 */
.hm-bg{
  position:fixed;
  top:0; left:0;
  width:100vw; height:100vh;
  background:rgba(0,0,0,0.45);
  opacity:0;
  pointer-events:none;
  transition:.32s;
  z-index:99997;
}

/* 開閉 */
.hm-check:checked ~ .hm-menu{ bottom:0; }
.hm-check:checked ~ .hm-bg{ opacity:1; pointer-events:auto; }

/* 開いたら× */
.hm-check:checked + .hm-btn span{ background:transparent; }
.hm-check:checked + .hm-btn span::before{
  top:0; transform:rotate(45deg);
}
.hm-check:checked + .hm-btn span::after{
  top:0; transform:rotate(-45deg);
}


/* =====================================================
   レスポンシブ切替
   ===================================================== */
@media screen and (max-width:768px){

  /* スマホは上部メニュー文字を消す（社名だけ残す） */
  html body div#header_menu ul.header_menu{
    display:none;
  }

  /* スマホ社名を中央寄せ */
  html body div#header_menu::before{
    float:none;
    display:block;
    text-align:center;
    padding:10px 0;
  }

  /* ハンバーガー表示 */
  .hm-btn{ display:block; }

  /* 固定幅テーブルを100%化 */
  html body table[width="800"],
  html body table[width="900"],
  html body table[width="1000"],
  html body .full-width-table{
    width:100%;
    max-width:100%;
    margin:0 auto;
  }

  /* バナー2列 */
  .banner-item{ width:50%; }

  html, body{ overflow-x:hidden; }
}

@media screen and (max-width:480px){
  .banner-item{ width:100%; }
}
/* パンくず（TOP > 料金案内）を非表示 */
#navigation{
  display:none;
  height:0;
  margin:0;
  padding:0;
  border:0;
}
/* header_menu に擬似要素で社名を出していた場合の重複防止 */
#header_menu::before{
  content:none;
}
/* フッター */
#footer {
border: none;
background-image: none;
font-weight: normal;
font-size: 12px;
margin: 0px;
padding: 5px 10px;
text-align:center;
background: transparent;
color: #000000;
}

/* フッター：下部 */
#footer_suf {
display: none;
}

/* フッター：コピーライト部 */
#copyright {
color: #000000;
}

#copyright a{
color: #000000;
text-decoration:none;
}
#copyright a:hover{
color : #0000ED ;
}

/* フッターメニュー外枠：上部 */
div#footer_menu_pre {
display: none;
}

/* フッターメニュー外枠 */
div#footer_menu {
font-size: 12px;
padding: 2px 8px 2px 8px;
background: #000000 url(/skins/b-black2/image/mm-bg.jpg) no-repeat center right;
border-top:1px #ffffff solid;
}

/* フッターメニュー外枠：下部 */
div#footer_menu_suf {
display: none;
padding: 0px;
margin: 0px;
height: 0px;
clear: both;
}

/* フッターメニュー：リスト */
ul.footer_menu{
float: right;
padding: 0px;
margin : 0px;
}

li.footer_menu {
list-style-type : none;
margin : 0px 5px;
float: left;
}

/* フッターメニュー：リンク */
li.footer_menu a {
color: #ffffff;
text-decoration:none;
background: transparent url(/skins/b-black2/image/mmicon.gif) no-repeat center left;
padding : 0px 0px 0px 15px;
}
li.footer_menu a:visited {
color: #ffffff;
text-decoration:none;
background: transparent url(/skins/b-black2/image/mmicon.gif) no-repeat center left;
padding : 0px 0px 0px 15px;
}
li.footer_menu a:active {
color: #ffffff;
text-decoration:none;
background: transparent url(/skins/b-black2/image/mmicon-on.gif) no-repeat center left;
padding : 0px 0px 0px 15px;
}
li.footer_menu a:hover {
color: #ffffff;
text-decoration:none;
background: transparent url(/skins/b-black2/image/mmicon-on.gif) no-repeat center left;
padding : 0px 0px 0px 15px;
}
/* フォーム */
.form_table {
	border: 1px solid #cccccc;
	margin: 8px 0px;
}
.err_msg {
	border-bottom: 1px solid #862014;
	color: #cb5a26;
	font-weight: bold;
	padding: 5px;
}
th.item {
	border-right: 1px solid #dddddd;
	border-bottom: 1px solid #cccccc;
	color: #444444;
	padding: 5px;
	background-color: #f5f5f5;
}
th.necessary_item {
	color: #444444;
	background-image: url(/skins/highgrade02/image/tem_kome.gif);
	background-repeat: no-repeat;
	background-position: right top;
}
td.item {
	border-bottom: 1px solid #cccccc;
	color: #444444;
	padding: 5px;
}
th.error_item {
	background-color: #fff3f0;
}
.form_submit {
	text-align: center;
	padding: 5px;
}

/* ===== PCヘッダーを1列（社名左・メニュー右）に ===== */
#header_menu{
  display:block;
  background:#fff;
  padding:8px 12px;
  border-bottom:1px solid #ddd;
}

/* 社名（topmsg）を左側として生かす */
h1#topmsg{
  float:left;
  margin:0;
  padding:8px 12px;
  font-size:17px;
  font-weight:bold;
  line-height:1.4;
}

/* 右側メニュー */
#header_menu ul.header_menu{
  float:right;
  margin:0;
  padding:0;
}
#header_menu li.header_menu{
  list-style:none;
  float:left;
  margin:0;
}
#header_menu li.header_menu a{
  display:block;
  padding:8px 10px;
  font-size:15px;
  color:#000;
  text-decoration:none;
}
#header_menu li.header_menu a:hover{
  color:#06c;
}

/* 回り込み解除 */
#header_menu::after{
  content:"";
  display:block;
  clear:both;
}

/* ===== スマホではPCメニューを隠してハンバーガーだけ ===== */
@media screen and (max-width:768px){
  #header_menu{
    display:none;
  }
  h1#topmsg{
    float:none;
    text-align:center;
    font-size:18px;
    padding:10px 0;
  }
  .hm-footer-btn{
    display:block;
  }
}
/* ===== パンくず（TOP > 料金案内）消す ===== */
#navigation{
  display:none;
  height:0;
  margin:0;
  padding:0;
  border:0;
}

/* ===== 社名二重の原因だった擬似要素を止める ===== */
#header_menu::before{
  content:none;
}

/* ===== PCヘッダー：社名左／メニュー右（横一列） ===== */
body #header_menu{
  display:block;
  background:#fff;
  padding:8px 12px;
  border-bottom:1px solid #ddd;
}

/* テンプレ側の社名（topmsg）を左に */
body h1#topmsg{
  float:left;
  margin:0;
  padding:8px 12px;
  font-size:21px;
  font-weight:bold;
  line-height:1.4;
}

/* PCメニューを右へ */
body #header_menu ul.header_menu{
  float:right;
  margin:0;
  padding:0;
}
body #header_menu li.header_menu{
  list-style:none;
  float:left;
  margin:0;
}
body #header_menu li.header_menu a{
  display:block;
  padding:8px 10px;
  font-size:15px;
  color:#000;
  text-decoration:none;
}
body #header_menu li.header_menu a:hover{
  color:#06c;
}

/* 回り込み解除 */
body #header_menu::after{
  content:"";
  display:block;
  clear:both;
}

/* ===== スマホ：PCメニューを隠してハンバーガーだけ ===== */
@media screen and (max-width:768px){
  body #header_menu{ display:none; }

  body h1#topmsg{
    float:none;
    text-align:center;
    font-size:21px;
    padding:10px 0;
  }

  body .hm-footer-btn{ display:block; }
}
/* =========================
   ハンバーガー三本線を白で固定（追加分）
   ========================= */

/* ボタン自体は黒 */
.hm-wrap.hm-footer .hm-footer-btn{
  background:#222;
}

/* 三本線（中央） */
.hm-wrap.hm-footer .hm-footer-btn span{
  background:#ffffff;
}

/* 上下の線 */
.hm-wrap.hm-footer .hm-footer-btn span::before,
.hm-wrap.hm-footer .hm-footer-btn span::after{
  background:#ffffff;
}

/* もし span の高さや幅が潰れてた時の保険 */
.hm-wrap.hm-footer .hm-footer-btn span,
.hm-wrap.hm-footer .hm-footer-btn span::before,
.hm-wrap.hm-footer .hm-footer-btn span::after{
  display:block;
  width:26px;
  height:3px;
  opacity:1;
}
/* =====================================================
   ハンバーガー（三本線が見えない問題の最終修正版）
   ・HTMLは hm-wrap 1個だけ前提
   ・PCでは非表示、スマホだけ表示
   ・三本線は白固定
   ===================================================== */

.hm-wrap { position: relative; }
.hm-check { display: none; }

/* ボタン（スマホ右上固定） */
.hm-btn{
  display: none;            /* ←PCは非表示 */
  width: 46px;
  height: 46px;
  background: #222;
  border-radius: 4px;
  position: fixed;
  top: 10px;
  right: 10px;
  cursor: pointer;
  z-index: 99999;
}

/* 三本線（白） */
.hm-btn span{
  position: absolute;
  top: 50%;
  left: 50%;
  width: 26px;
  height: 3px;
  background: #fff;
  transform: translate(-50%, -50%);
}
.hm-btn span::before,
.hm-btn span::after{
  content:"";
  position:absolute;
  left:0;
  width:26px;
  height:3px;
  background:#fff;
}
.hm-btn span::before{ top:-8px; }
.hm-btn span::after { top: 8px; }

/* メニュー本体（下から出る） */
.hm-menu{
  position: fixed;
  bottom: -100vh;
  left: 0;
  width: 100vw;
  height: 60vh;
  background: #fff;
  box-shadow: 0 -2px 6px rgba(0,0,0,0.25);
  transition: bottom .32s;
  padding-top: 20px;
  z-index: 99998;
}
.hm-menu ul{ list-style:none; margin:0; padding:0; }
.hm-menu li a{
  display:block;
  padding:15px 18px;
  border-bottom:1px solid #eee;
  font-size:17px;
  color:#000;
  text-decoration:none;
}

/* 暗幕 */
.hm-bg{
  position: fixed;
  top:0; left:0;
  width:100vw; height:100vh;
  background: rgba(0,0,0,0.45);
  opacity:0;
  pointer-events:none;
  transition:.32s;
  z-index:99997;
}

/* 開閉 */
.hm-check:checked ~ .hm-menu{ bottom:0; }
.hm-check:checked ~ .hm-bg{ opacity:1; pointer-events:auto; }

/* 開いたら× */
.hm-check:checked + .hm-btn span{ background: transparent; }
.hm-check:checked + .hm-btn span::before{
  top:0; transform:rotate(45deg);
}
.hm-check:checked + .hm-btn span::after{
  top:0; transform:rotate(-45deg);
}

/* ===== スマホだけ表示 ===== */
@media screen and (max-width:768px){
  .hm-btn{ display:block; }
}
@media screen and (min-width:769px){
  .hm-wrap, .hm-btn, .hm-menu, .hm-bg{ display:none; }
}
/* ==============================
   ラクマス用 ハンバーガー最終手段
   span不要・CSSだけで三本線を描く
   ============================== */

.hm-check{ display:none; }

/* ボタン本体 */
.hm-btn{
  display:none;              /* PCでは隠す */
  position:fixed;
  top:10px;
  right:10px;
  width:46px;
  height:46px;
  background:#222;
  border-radius:4px;
  cursor:pointer;
  z-index:99999;

  /* ▼三本線を背景で描画（白3本） */
  background-image:
    linear-gradient(#fff,#fff),
    linear-gradient(#fff,#fff),
    linear-gradient(#fff,#fff);
  background-size:26px 3px, 26px 3px, 26px 3px;
  background-position:center 14px, center 22px, center 30px;
  background-repeat:no-repeat;
}

/* メニュー本体（下から出る） */
.hm-menu{
  position:fixed;
  bottom:-100vh;
  left:0;
  width:100vw;
  height:60vh;
  background:#fff;
  box-shadow:0 -2px 6px rgba(0,0,0,0.25);
  transition:bottom .32s;
  padding-top:20px;
  z-index:99998;
}
.hm-menu ul{ list-style:none; margin:0; padding:0; }
.hm-menu li a{
  display:block;
  padding:15px 18px;
  border-bottom:1px solid #eee;
  font-size:17px;
  color:#000;
  text-decoration:none;
}

/* 暗幕 */
.hm-bg{
  position:fixed;
  top:0; left:0;
  width:100vw; height:100vh;
  background:rgba(0,0,0,0.45);
  opacity:0;
  pointer-events:none;
  transition:.32s;
  z-index:99997;
}

/* 開閉 */
.hm-check:checked ~ .hm-menu{ bottom:0; }
.hm-check:checked ~ .hm-bg{ opacity:1; pointer-events:auto; }

/* スマホだけ表示 */
@media screen and (max-width:768px){
  .hm-btn{ display:block; }
}
@media screen and (min-width:769px){
  .hm-wrap, .hm-btn, .hm-menu, .hm-bg{ display:none; }
}
  /* テーブル */
  table th, table td{
    font-size:13px;
    padding:6px;
  }

  /* 横幅の調整 */
  html, body{
    overflow-x:hidden;
  }

/* ===== キャッチコピー調整 ===== */
.catchcopy{
  text-align:center;
  padding:40px 10px 20px;
}

.catch-ja{
  font-family:"游明朝","ヒラギノ明朝 ProN","MS PMincho",serif;
  font-size:30px;       /* PC基準 */
  line-height:1.3;     /* 行間をしっかり */
  letter-spacing:0.03em;
  margin:0;
  word-break:keep-all;  /* 変な位置で切れにくく */
}

.catch-en{
  font-family:sans-serif;
  font-size:20px;
  line-height:1.6;
  margin:16px 0 0;
}

/* スマホで小さく・きれいに */
@media screen and (max-width:768px){
  .catch-ja{
    font-size:22px;
    line-height:1.7;
    letter-spacing:0.02em;
  }
  .catch-en{
    font-size:16px;
    line-height:1.6;
  }
}

/* さらに小さいスマホ */
@media screen and (max-width:480px){
  .catch-ja{ font-size:20px; }
  .catch-en{ font-size:15px; }
}
/* ================================
   スマホ時：キャッチコピーを綺麗に整える（行間少し狭め）
================================= */

@media screen and (max-width:768px){

  /* 日本語32px → スマホ向け小さめに */
  span[style*="font-size: 32px"]{
    font-size:22px !important;
    line-height:1.15;   /* ← 前回 1.65 → 少し狭く */
    display:block;
    text-align:center;
    margin:4px 0;
    letter-spacing:0.03em;
    word-break:keep-all;
  }

  /* 英語20px → スマホ向けに調整 */
  p[style*="font-size:20px"],
  span[style*="font-size: 20px"]{
    font-size:16px !important;
    line-height:1.45;   /* ← こちらも少し狭く */
    display:block;
    text-align:center;
  }
}
/* ================================
   スマホ時：キャッチコピー強制上書き（inline-style に勝つ）
================================= */
@media screen and (max-width:768px){

  /* 日本語キャッチコピー（1行目・2行目） */
  table.full-width-table td span[style*="font-size"]{
    font-size:22px;
    line-height:1.4;
    display:block;
    text-align:center;
    margin:6px 0;
    letter-spacing:0.03em;
  }

  /* 英語部分 */
  table.full-width-table td p[style*="font-size"]{
    font-size:16px;
    line-height:1.45;
    text-align:center;
  }
}
/* ============================
   スマホ時：キャッチコピーの高さリセット
============================ */
@media screen and (max-width:768px){



  /* 日本語キャッチコピー（強制上書き） */
  table.full-width-table td span[style*="font-size"]{
    font-size:22px;
    line-height:1.3;
    letter-spacing:0.02em;
    display:block;
    margin:4px 0;
  }

  /* 英語部分 */
  table.full-width-table td p[style*="font-size"]{
    font-size:16px;
    line-height:1.3;
  }
}
/* ============================
   スマホ時：キャッチコピーを別CSSで強制再レイアウト
   （!important なし）
============================ */
@media screen and (max-width:768px){

  /* td の固定高さを無効化するため “中身をブロック化” する */
  table.full-width-table td > span,
  table.full-width-table td > p {
    display:block;      /* span を段落扱いにする */
    margin:4px 0;       /* td height を相殺 */
  }

  /* 日本語キャッチコピー（行間・サイズ調整） */
  table.full-width-table td > span {
    font-size:20px;     
    line-height:1.2;    
    letter-spacing:0.03em;
  }

  /* 英語部分 */
  table.full-width-table td > p {
    font-size:16px;
    line-height:1.2;
  }
}
/* ============================
   PC画面：ヘッダー（社名＋メニュー）を固定
============================ */
@media screen and (min-width:769px){

  body #header_menu{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9998;
    background: #fff;
    border-bottom: 1px solid #ddd;
    padding: 8px 12px;
  }

  /* 固定のぶん下の内容が隠れないよう余白を追加 */
  body #col_layout{
    margin-top: 60px;
  }
}
.menu-area {
    background-color: #f6f6f6;
}
.menu-area table {
    background-color: #f6f6f6;
}


.menu-area,
.menu-area table,
.menu-area td {
    background-color: #f6f6f6;
}

/* ============================================================
   お問い合わせページ 専用レスポンシブ調整
   PC：幅800px前後の中央寄せ
   SP：幅100%
============================================================ */

/* PC基準（800px） */
.form-top-wrap,
.form-phone-table,
.form_table {
  width: 800px;
  margin: 0 auto;
  border-collapse: collapse;
}

/* スマホ用：100%に自動フィット */
@media screen and (max-width: 768px){
  .form-top-wrap,
  .form-phone-table,
  .form_table {
    width: 100%;
  }
}

/* 電話番号テーブルのデザイン */
.form-phone-table td{
  padding: 6px;
  line-height: 1.5;
  border: 1px solid #ddd;
}
/* 画面右端のスクロールバーをできるだけシンプルに */
html {
  background: #ffffff;  /* ページ全体の下地も白に */
}

/* スクロールバー全体の幅 */
html::-webkit-scrollbar {
  width: 10px;
}

/* レール部分（下地） */
html::-webkit-scrollbar-track {
  background: #ffffff;   /* ページと同じ真っ白に */
}

/* つまみ（動く部分） */
html::-webkit-scrollbar-thumb {
  background: #cccccc;   /* 薄いグレー1色 */
  border-radius: 10px;
  border: 2px solid #ffffff;  /* まわりを白で囲んで、線を1本ぽく */
}
/* ページ全体の下地を白で統一 */
html, body{
  background:#ffffff;
}

/* Chrome / Edge / Safari 系：スクロールバー細め＆シンプル */
html::-webkit-scrollbar,
body::-webkit-scrollbar{
  width:10px;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track{
  background:#ffffff;     /* ページと同じ白 */
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb{
  background:#c0c0c0;     /* 薄いグレー1色 */
  border-radius:8px;
  border:2px solid #ffffff;
}

/* Firefox 用（対応ブラウザだけ反映される） */
html{
  scrollbar-width:thin;                    /* 細め */
  scrollbar-color:#c0c0c0 #ffffff;         /* thumb / track */
}
/* ===== スクロールバーを薄くする（Chrome / Edge / Safari） ===== */
html::-webkit-scrollbar {
  width: 10px;   /* 細め */
}

html::-webkit-scrollbar-track {
  background: #ffffff;   /* 下地は白 */
}

html::-webkit-scrollbar-thumb {
  background: #e0e0e0;   /* ← かなり薄いグレー */
  border-radius: 8px;
  border: 2px solid #ffffff;  /* まわりも白で薄く見せる */
}

/* ===== Firefox ===== */
html {
  scrollbar-width: thin;                   /* 細め */
  scrollbar-color: #e0e0e0 #ffffff;        /* thumb / track */
}
/* PC版：メニュー左の社名（topmsg）を大きくする */
body h1#topmsg{
  font-size: 21px;     /* ← 好きな大きさに変更 */
  font-weight: bold;
}