@charset "utf-8";

/* ============================================================
   ケイタイム 統合スタイルシート
   最終更新 2026-09-04

   ■ このファイルについて
   もとは7本のCSS（別々のサイトから持ち寄った継ぎはぎ）でしたが、
   実際に index.html / profile.html で使われているルールだけを残して
   1本にまとめたものです。元の7本は
   C:\Share\_trashbox\ケイタイム\CSS整理_20260904\旧CSS\ にあります。

   ■ 構成（元ファイル別。この順序がそのまま優先順位）
     1. base37f5.css   … 全体の土台・ヘッダー・フッター・問い合わせボタン
     2. top1b50.css    … トップページの各セクション
     3. catalogde22.css… 車種一覧（.carList / .maker）
     4. common3a80.css … 文字・リンク・見出しなどの共通指定
     5. baseb58f.css   … #wrapper / .inner / sp_only などの土台（後勝ち）
     6. sp.css         … スマホ向けの上書き
     7. pc.css         … PC向けの上書き
     8. ページ個別      … チラシ拡大ボタン・スティッキーヘッダーほか

   ■ 使っているブレークポイント
     1040px以下 / 960px以上 / 959px以下 / 768px以上 / 767px以下
     / 680px以上（印刷含む）/ 679px以下 / 599px以下

   ■ 変更したときの注意
     このファイルを1文字でも直したら、index.html と profile.html の
       <link rel="stylesheet" href="css/style.css?v=YYYYMMDD">
     を必ず当日の日付に揃えて更新してください。
     同じ日に2回目を上げるときは ?v=20260904b のように末尾に英字を足します。
     （サーバーはCSSを30日キャッシュするため、URLを変えないと届きません）
   ============================================================ */
/* ==================================================
   base37f5.css より
   ================================================== */
/* base ------------------------*/
/* ※ body は他に5か所（各ブレークポイント）で再定義。後勝ち */
body { overflow:hidden; width:100%;}
/* ※ #wrapper は他に2か所で再定義。後勝ち */
#wrapper { position:relative; }
/* ※ .inner は他に3か所で再定義。後勝ち */
.inner { max-width:1200px; width:96%; margin:0 auto; position:relative; }
/* title */
.top_ttl {font-size:4.6rem; color:#2e3093; font-weight:700; font-family:'M PLUS Rounded 1c', sans-serif; text-align:center; line-height:100%; margin-bottom:40px;}
.ttl_wht {font-size:4.6rem; color:#fff; font-weight:700; font-family:'M PLUS Rounded 1c', sans-serif; text-align:center; line-height:100%; margin-bottom:40px;}
/* background */
.bg_blu {background-color:#a5a6f0; height: 230px; }
/*.bg_stripe_b {background-color:#ccf7fd; background-size: cover; background-image:repeating-linear-gradient(-45deg, #ccf7fd, #fff 3px, transparent 0, transparent 6px);}
.bg_stripe_y {background-color:#faf183; background-size: cover; background-image:repeating-linear-gradient(-45deg, #faf183, #fff 3px, transparent 0, transparent 6px);}
.bg_kikagaku {background:url(../img/kikagaku.jpg);}*/
.bg_stripe_b {
  background-color: #ccf7fd;
  background-size: cover;
  height: 100%;
  width: 100%; /* 追加：背景の幅を100%に設定 */
  background-image: repeating-linear-gradient(-45deg, #ccf7fd, #fff 3px, transparent 0, transparent 6px);
}
.bg_stripe_y {
  background-color: #faf183;
  background-size: cover;
  height: 100%;
  width: 100%; /* 追加：背景の幅を100%に設定 */
  background-image: repeating-linear-gradient(-45deg, #faf183, #fff 3px, transparent 0, transparent 6px);
}
/* font */
.round_bold {font-family:'M PLUS Rounded 1c', sans-serif; font-weight:700;}
/* header ------------------------*/
#header {
  width:100%; background-color:#2e3093; color:#fff;
  /* WordPressテーマJIN対応 */
  display:block; padding:0;
}
#header a, #gnav a {text-decoration:none;}
/* footer ------------------------*/
/* ※ #footer は他に4か所で再定義。後勝ち */
#footer { background:#2e3093; margin-top:150px; color:#fff;}
/* contact */
.contact li {width:49%;}
.contact li > a {display:flex; justify-content:center; align-items:center; padding:1em 0 1em 1.5em; height:100%; background:#fce903; color:#2e3093; font-weight:700; font-family:'M PLUS Rounded 1c', sans-serif; text-align:center; line-height:100%; font-size:0.6rem; text-decoration:none; position:relative; }
.contact li > a::before {
  position:absolute; top:30%; left:.5em;
  content:""; display:block; width:47px; height:40%;
  background:no-repeat 0 0 / contain;
  }
.contact li > a > p { margin:0; }
.contact li > a span { display:block; font-size:.75em; line-height:180%;}
li.contact_btn > a:before { background-image:url(../img/mail_ico.svg); }
li.reserve_btn > a:before { background-image:url(../img/reserve_ico.svg); }
.contact li a:hover { background:#bdb34a;}
/* 960以上(PC) */
@media screen and (min-width:960px) {  /* PC（960px以上） */
  li.contact_btn > a { padding-bottom:.8em; }
}
/* ================================================================
  タブレット
=================================================================== */
@media screen and (max-width:959px) {  /* タブレット以下（959px以下） */
  html {font-size:8px;}
  body {font-size:1.6rem;}
  /* ※ p は他に2か所で再定義。後勝ち */
  p {line-height:2em; letter-spacing:.03em;}
  /* header ------------------------ */
  #header { position:fixed; top:0; left:0; z-index:9999;}
  /* footer ------------------------*/
  #footer { padding-bottom:80px; background:#2e3093; margin-top:40px;}
  /* contact */
  .contact ul li {width:100%; margin-bottom:15px;}
  .contact ul li a {display:flex; justify-content:center; align-items:center; height:90px; background:#fce903; color:#2e3093; font-weight:700; font-family:'M PLUS Rounded 1c', sans-serif; text-align:center; line-height:100%; font-size:3rem; text-decoration:none; position:relative; padding-left:1.5em;}
  .contact ul li a span {display:block; font-size:1.8rem; line-height:100%;}
  .contact_btn a:before {content:""; display:block; background:url(../img/mail_ico.svg) no-repeat; background-size:100%; width:35px; height:100%; position:absolute; top:32%; left:1em;}
  .reserve_btn a:before {content:""; display:block; background:url(../img/reserve_ico.svg) no-repeat; background-size:100%; width:35px; height:100%; position:absolute; top:32%; left:1em;}
  .contact ul li a:hover {background:#bdb34a;}
}
/* ================================================================
  スマホ
=================================================================== */
@media screen and (max-width:599px) {  /* スマホ（599px以下） */
  /*  .wide_inner,
 .inner, .narrow { margin:0 15px; }*/ /* title */
  .top_ttl {font-size:3rem; color:#2e3093; font-weight:700; font-family:'M PLUS Rounded 1c', sans-serif; text-align:center; line-height:100%; margin-bottom:26px;}
  .ttl_wht {font-size:3rem; color:#fff; font-weight:700; font-family:'M PLUS Rounded 1c', sans-serif; text-align:center; line-height:100%; margin-bottom:26px;}
  /* tel */ /* title */ /* contact */
  .contact ul li {width:100%; margin-bottom:10px;}
  .contact ul li a {display:flex; justify-content:center; align-items:center; height:90px; background:#fce903; color:#2e3093; font-weight:700; font-family:'M PLUS Rounded 1c', sans-serif; text-align:center; line-height:100%; font-size:2.8rem; text-decoration:none; position:relative; padding-left:1.5em;}
  .contact ul li a span {display:block; font-size:1.8rem; line-height:100%;}
  .contact_btn a:before {content:""; display:block; background:url(../img/mail_ico.svg) no-repeat; background-size:100%; width:35px; height:100%; position:absolute; top:32%; left:.7em;}
  .reserve_btn a:before {content:""; display:block; background:url(../img/reserve_ico.svg) no-repeat; background-size:100%; width:35px; height:100%; position:absolute; top:32%; left:.7em;}
  .contact ul li a:hover {background:#bdb34a;}
}

/* ==================================================
   top1b50.css より
   ================================================== */
/* top_flyer */
#top_flyer p {margin: 0;}
/* top_point */
#top_point .reason_point {margin-top: -80px; width: 100%;}
#top_point li.point {background: #fff; width: 87%; border: 4px solid #2e3093; border-radius: 15px; padding: 50px 70px; margin-bottom: 40px; font-size: 1.8rem;}
#top_point h3.point_ttl {font-size: 3rem; font-weight: 700; color: #2e3093; margin-bottom: 1em; position: relative; padding-left: 85px; line-height: 130%;}
#top_point h3.point_ttl span {
  display: block;
  text-align: center; padding-top: 26px;
    width: 77px;
    height: 62px;
    background: #2e3093;
    font-size: 5rem;
    line-height: 45px;
    color: #faea2b;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 0;}
#top_point h3.point_ttl span:before {content: "POINT"; font-size: 1.8rem; color: #2e3093; position: absolute; top: -2em; left: .5em;}
.half {width: 48%; margin-bottom: 40px;}
#top_point h3.round_bold {font-size: 3rem;color: #2e3093; margin-bottom: -.5em; line-height: 160%;}
.line_txt {background: linear-gradient(transparent 50%, yellow 50%); font-size: 4rem; text-align: center; line-height: 100%;}
.line_txt .red {font-size: 5.6rem;}
.p4 li {width: 45%; font-size: 1.6rem;}
.p4 li figure {width: 80%; margin: 0 auto;}
.p4 li h4 {color: #fff; font-size: 2rem; font-weight: 700; text-align: center; padding: .5em 0; width: 100%; border-radius: 30px;}
.p4 li h4.p4_1 {background: #0067b1;}
.p4 li h4.p4_2 {background: #0067b1;}
.p4 li h4.p4_3 {background: #0067b1;}
.p4 li h4.p4_4 {background: #0067b1;}
/* top_reason */
#top_reason li {width: 30%; margin: 0 1% 2%;}
/* top_faq */
#top_faq > .inner {max-width: 1060px; margin-top: 0px;}
#top_faq > .inner > dl > div {border: 5px solid #2e3093; padding: 0 30px 20px; border-radius: 20px; margin-bottom: 20px; background: #fff;}
#top_faq dt{
  display:block;
  font-size: 2.0rem;
  cursor:pointer;
  color: #2e3093; font-weight: 700;
  padding: 20px 0 15px 60px;
  position: relative;
}
#top_faq dt::before {content: 'Q.'; font-size: 3.5rem; color: #2e3093; position: absolute; left: 0; top: 0;}
#top_faq dt::after {content: '▼'; color: #2e3093; margin-left: 30px; position: absolute; right: 0; bottom: 15px;}
#top_faq dd{
  width:90%;
  display:none;
  border-top: 1px dotted #999;
  padding: 20px 0 15px 75px;
  line-height: 160%;
  position: relative;
}
#top_faq dd::before {content: 'A.'; font-size: 3.5rem; color: #666;font-weight: 700;position: absolute; left: 0; top: 15px;}
/* 959以下 (タブレット以下) */
@media screen and (max-width: 959px) {  /* タブレット以下（959px以下） */
  section {padding: 40px 0;}
  /* top_point */
  #top_point li.point {padding: 30px 21px; margin-bottom: 10px; font-size: 1.6rem;}
  #top_point h3.point_ttl {font-size: 3.8rem; padding-left: 65px;}
  #top_point h3.point_ttl span {
    padding-top: 0;
      width: 60px;
      height: 60px;
      font-size: 4.5rem;
      line-height: 55px;
    }
  #top_point h3.point_ttl span:before {font-size: 1.4rem; top: -3em; left: 1.2em;}
  #top_point h3.round_bold {font-size: 3.5rem;}
  .line_txt {font-size: 3.5rem;}
  .line_txt .red {font-size: 4rem;}
}
/* ================================================================
  スマホ
=================================================================== */
@media screen and (max-width: 599px) {  /* スマホ（599px以下） */
  section {padding: 30px 0;}
  /* top_point */
  #top_point li.point {margin-bottom: 15px; font-size: 1.6rem;}
  #top_point h3.point_ttl {font-size: 3rem; padding-left: 70px;}
  #top_point h3.point_ttl span {
    display: block;
    text-align: center; padding-top: 0;
      width: 55px;
      height: 55px;
      font-size: 4rem;
      line-height: 55px;
  }
  #top_point h3.point_ttl span:before {font-size: 1.4rem; top: -3em; left: 1em;}
  .half {width: 100%; margin-bottom: 20px;}
  #top_point h3.round_bold {font-size: 3rem;}
  .line_txt {font-size: 3rem;}
  .line_txt .red {font-size: 4rem;}
  .p4 li {width: 100%;}
  /* top_reason */
  #top_reason li {width: 98%;}
  /* top_faq */
  #top_faq > .inner > dl > div {padding: 0 10px 20px; border-radius: 15px; margin-bottom: 15px;}
  #top_faq dt{
    font-size: 2rem;
    padding: 15px 0 0 40px;
  }
  #top_faq dt::before {font-size: 3.6rem;}
  #top_faq dt::after { position: absolute; right: 15px; bottom: 0;}
  #top_faq dd{
    padding: 15px 25px 0 40px;
    padding-left: 40px;
    position: relative;
  }
  #top_faq dd::before {font-size: 3.6rem;}
}

/* ==================================================
   catalogde22.css より
   ================================================== */
.maker > li {width:12.5%;}
.carList > li{ position:relative; width:29.3%; margin:0 2% 1em; }
.carList .name{font-size:1.1em;}
.carList .name .maker{ margin-right:0.5em; padding:0 .5em; font-size:0.7em; background:#fff034; }
.carList .detail p { line-height:1; text-align:center;}
.carList .detail .monthly span em {font-size:1.5em; font-weight:600;}
.carList .detail .bonus span{ margin:0 2px; font-size:1.1em; font-weight:600; }
/* ================================================================
  スマホ
=================================================================== */
@media screen and (max-width:599px) {  /* スマホ（599px以下） */
  .maker > li { width:25%; }
  /* carlist ---------------- */
  .carList > li{ width:48%; margin:0 0 .5em; }
}

/* ==================================================
   common3a80.css より
   ================================================== */
/* * { box-sizing:border-box; }*/
html { overflow:auto; -webkit-text-size-adjust:100%; }
body { margin:0; padding:0; font-size:15px; color:#3a3b3f; line-height:1.7; font-weight:500; letter-spacing:1px; font-family:"游ゴシック体", "Yu Gothic", YuGothic, "メイリオ", "Meiryo", sans-serif; }
h1, h2, h3, h4, h5, h6, dl, dd, ul, form, textarea, figure { margin:0; padding:0; font-size:100%; }
article, aside, dialog, figure, footer, header, hgroup, nav, section { display:block; }
/* clearfix 回り込み解除 ------------------------ */
.clearfix:after { content:""; clear:both; display:block; }
/* 共通 ------------------------ */
a { color:#3a3b3f; text-decoration:none; }
a:not(.fade) { -webkit-transition:all .3s; transition:all .3s; }
p { margin-top: 1em; margin-bottom:0; }
strong { font-size:1.2em; }
em { font-style:normal; font-weight:bold; }
table { border-collapse:collapse; border-spacing:0; }
ul { list-style-type:none; }
/* ※ img は他に2か所（.inner系の後ろと最下部）で再定義。後に書かれた方が優先 */
img { max-width:100%; font-size:0; line-height:0; border-width:0px; vertical-align:bottom; }
.center { text-align:center; }
.red { color: #da263c; }
.flex { display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap; }
.flex-between { justify-content:space-between; -webkit-justify-content:space-between; }
.flex-center  { justify-content:center; -webkit-justify-content:center; }

/* ==================================================
   baseb58f.css より
   ================================================== */
/* base ------------------------*/
#wrapper { min-width:1000px; overflow:hidden; }
.sp_only { display:none; }
.inner { position:relative; max-width:1200px; width:100%; margin-left:auto; margin-right:auto; padding-bottom: 50px;}
#footer { margin-top:60px; }
/* ================================================================
  タブレット
=================================================================== */
@media screen and (max-width:1040px) {  /* 狭めのPC以下（1040px以下） */
  #wrapper { min-width:inherit; }
  .inner { padding-left:30px; padding-right:30px; }
}
/* ================================================================
  スマホ
=================================================================== */
@media screen and (max-width:599px) {  /* スマホ（599px以下） */
  body { font-size:14px; }
  .sp_none { display:none; }
  .sp_only { display:block; }
  .inner {padding:0 0px; margin-top: 90px;}
  #contents > section:not(:first-of-type) { margin-top:50px; }
  @media screen and (max-width: 679px) {  /* スマホ（679px以下） */
    #top_point .inner {
        margin: 30px 0 0 0; /* ４つの理由のマージン */
      }
  }
  @media screen and (max-width: 767px) {  /* スマホ横まで（767px以下） */
    .contact .inner {
        margin: -42px 0 10px 0; /* お問合せセクションのマージン */
      }
  }
  @media screen and (max-width: 679px) {  /* スマホ（679px以下） */
    #top_faq .inner {
        margin: 30px 0 10px 0;/* よくある質問セクションのマージン */
    }
    .jidai .inner {
      padding: 0 0px;
      margin-top: 60px;
    }
  }
}

/* ==================================================
   sp.css より
   ================================================== */
/*---------------------------- 共通部分 ----------------------------*/
html, body, header, nav, article, section, aside, footer,
div, span, p, h1, h2, h3, h4,
ul, ol, li, dl, dt, dd,
table, tr, th, td, tbody, thead, tfoot {
  margin: 0;
  padding: 0;
}
header, nav, article, section, aside, footer {
  display: block;
}
ol, ul {
  list-style: none;
}
img {
  max-width: 100%;
  height: auto;
  border: 0;
}
a:link {
  color: #202020;
}
a:visited {
  color: #1d1c1c;
}
a:hover {
  color: #1d1c1c;
}
p {
  margin: 15px 0 15px 0;
  line-height: 1.7;
  letter-spacing: 0.05em;
}
/*---------------------------- スマートフォン向けのスタイル ----------------------------*/
@media only screen and (max-width: 679px) {  /* スマホ（679px以下） */
  /*---------------------------- ページ全体の指定 ----------------------------*/
  body {
    width: 100%;
    font: 87.5% 'ヒラギノ角ゴ pro W3', "Hiragino KaKu Gothic Pro", "メイリオ", Meiryo, Osaka, sans-serif;
    color: #333333;
    letter-spacing: 0.05em;
    -webkit-text-size-adjust: 100%;
  }
  /*---------- ヘッダー ----------*/
  #header {
    width: 100%;
    height: auto;
    padding: 0 0 4px 0;
    line-height: 1.6;
  }
  #header h1 {
    display: none;
  }
  /*---------- ヘッダー内 ----------*/
  #header #header_inner {
    margin: 0;
    padding: 2px;  /*-- 余白 --*/
    background-color: #df2f03;  /*-- 背景色 --*/
  }
  /*----- 左 logo -----*/
  #h_logo {
    width: 100%;
    padding: 8px 0 0 0;
    text-align: center;
    color: #ffffff;
  }
  #h_logo h2 {
    padding: 0;  /*-- logo 位置 --*/
    margin: 0;
  }
  #h_logo img {
    max-width: 100%;
    height: auto;
  }
  #h_logo a {
    color: #ffffff !important;
    text-decoration: none;
    font-size: 1em;
  }
  #h_logo a:hover {
    color: #ffffff !important;
    text-decoration: underline;
    font-size: 1em;
  }
  /*----- 右 info -----*/
  #h_info {
    padding: 0 6px 0 6px;
    text-align: center;
  }
  #h_info p {
    font-size: 2.5em;
    margin: 6px 0 10px 0;
    line-height: 1.0;
  }
  /*---------- ヘッダーメニュー ----------*/
  #header-menu {
    margin: 0 1px 4px 1px;
    border-top: 1px solid #d7d2c7;
    border-right: 1px solid #d7d2c7;
  }
  #header-menu ul {
    padding: 0;
  }
  #header-menu ul li {
    width: 50%;
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
    text-align: center;
  }
  #header-menu li a {
    width: 99.6%;
    font-size: 0.75em;
    padding: 10px 0 10px 0;
    display: block;
    line-height: 1.2;
    letter-spacing: 0.05em;
    color: #765c47 !important;
    text-decoration: none;
    border-left: 1px solid #d7d2c7;
    border-bottom: 1px solid #d7d2c7;
    background: #e2d0ab url(../img/head_menu_back_abase.gif) repeat-x;
  }
  #header-menu li a:hover {
    color: #765c47 !important;
    display: block;
    text-decoration: none;
    background: #f7f4ec url(../img/head_menu_back_hover.gif) repeat-x;
  }
  #header-menu li.home a {
    border-bottom: 1px solid #d7d2c7;
  }
  #header-menu span.sub {
    display: none;
  }
  .clearfix:after {
    content: "";
    display: block;
    clear: both;
    height: 0; 
    visibility: hidden;
  }
  /*---------- メイン画像 ----------*/
  #header-img {
    width: 100%;
    height: auto;
    margin: 10px 0 10px 0;
  }
  .main_photo {
    display: block;
    margin: 0 auto 0 auto;
  }
  /*---------- メインコンテンツ ----------*/
  #container {
    padding: 0;
  }
  /*---------- コンテンツ ----------*/
  #contents {
    padding: 0px 6px 25px 6px;
    font-size: 1.8em;
  }
  #contents h2 {
    height: auto !important;
    margin: 0 0 10px 0;
    padding: 13px 0 8px 16px;
    font-size: 18px;
    color: #54351f;
    border-top: solid 1px #a48b78;
    border-right: solid 2px #a48b78;
    border-bottom: solid 4px #8c826c;
    border-left: solid 2px #a48b78;
    background-image: none;
    background-color: #fffffe;
  }
  #contents h2.page_title {
    height: auto !important;
    margin: 0 0 18px 0;
    padding: 16px 0 12px 20px;
    line-height: 1.6;
    font-size: 20px;
    color: #581201;
    border-top: solid 1px #a48b78;
    border-right: solid 2px #a48b78;
    border-bottom: solid 2px #a48b78;
    border-left: solid 7px #a48b78;
    background-image: none;
    background-color: #fdfbf7;
  }
  #contents h3 {
    margin: 12px 3px 10px 3px;
    padding: 12px 10px 6px 12px;
    line-height: 1.6;
    font-size: 1.28em;
    color: #662200;
    border-top: solid 1px #dddddd;
    border-right: solid 1px #dddddd;
    border-bottom: solid 1px #966934;
    border-left: solid 5px #966934;
    background-color: #f9f2d5;
  }
  #contents p {
    padding-right: 2px;
    padding-left: 2px;
    line-height: 1.6;
  }
  table.table_line {
    width: 100%;
    border-collapse: collapse;
    border: solid 1px #bbbbbb;
    padding : 8px 4px 8px 4px;
  }
  td.table_left {
    border-collapse: collapse;
    border: solid 1px #bbbbbb;
    padding : 8px 4px 8px 4px;
    background-color: #fff8e3;
    width: 30%;
  }
  td.table_right {
    border-collapse: collapse;
    border: solid 1px #bbbbbb;
    padding : 8px 4px 8px 4px;
    background-color: #ffffff;
    width: 70%;
  }
  /*---------- Googleマップ ----------*/
  .map {
    position: relative;
    padding-bottom: 75%; 
    height: 0;
    overflow: hidden;
  }
  .map iframe {
    position: absolute;
    top: 0;
    left: 0;
    padding: 6%;
    width: 88% !important;
    height: 100% !important;
  }
  /*---------- フッター ----------*/
  #footer {
    width: auto;
    padding: 20px 10px 20px 10px;
    color: #333333;
    line-height: 1.7;
    text-align: center;
    background-color: #e8e4df;
  }
  #footer a {
    color: #555555 !important;
  }
  #footer a:hover {
    color: #777777 !important;
  }
  #footer a:visited {
    color: #555555;
  }
}
/*メニューをページ下部に固定*/
@media (min-width: 768px) {  /* タブレット以上（768px以上） */
  .for-sp{
       display:none;
     }
}
#sp-fixed-menu {
  position: fixed;
  width: 100%;
  bottom: 0px;
  font-size: 0;
  opacity: 0.9;
  z-index: 99;
}
/* フォントの設定 */
.sp-icon-txt {
  color: #ffffff;
  font-size: 12px;
  line-height: 1.2;
  text-align: center;
  margin: 0;
  margin-top: -10px;
  padding: 0;
}
.sp-icon-list {
  list-style-type: none; /* 点を削除 */
  padding: 0; /* デフォルトのパディングを削除 */
  margin: 0; /* デフォルトのマージンを削除 */
}
#sp-fixed-menu ul {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
  justify-content: center; /* 水平方向に中央に寄せる */
}
#sp-fixed-menu li {
  text-align: center;
  flex: 1;
  font-size: 14px;
  height: auto; /* ←ココ重要 */
  display: flex;
  justify-content: center; /* 水平方向に中央に寄せる */
  align-items: center;
  border-right: 1px solid #fff;
  padding: 10px 0; /* 上下に余裕を持たせる */
}
/* ※ #sp-fixed-menu li a img は他に1か所で再定義。後勝ち */
#sp-fixed-menu li a img {
  width: 35px; /* 適切な横幅に調整 */
  height: 25px; /* 適切な縦幅に調整 */
  max-width: 100%;
}
/* 左側メニューを赤色に */
#sp-fixed-menu li:nth-child(1) {
  background: #ff0000;
}
/* 中央メニューを青色に */
#sp-fixed-menu li:nth-child(2) {
  background: #0000ff;
}
/* 右側メニューを緑色に */
#sp-fixed-menu li:nth-child(3) {
  background: #01bb01;
  border-right: none;
}
/* ボタンを調整 */
#sp-fixed-menu li a {
  color: #fff;
  display: flex;
  flex-direction: column; /* 縦に並べる */
  justify-content: center; /* 垂直中央揃え */
  align-items: center; /* 水平中央揃え */
  width: 100%;
  height: 100%; /* ボタンの高さを確保 */
  padding: 0; /* 不要な上下余白をなくす */
}
/* 各メニューアイコンの高さを一定にするためのスタイル */
#sp-fixed-menu li a img {
  height: 30px; /* 適切な高さに調整 */
  max-width: 100%;
}

/* ==================================================
   pc.css より
   ================================================== */
/*---------------------------- PC向けのスタイル ----------------------------*/
@media print, screen and (min-width: 680px) {  /* 印刷 ＋ 680px以上 */
  /*---------- ページ全体の指定 ----------*/
  body {
    width: 100%;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS P ゴシック", "MS P Gothic", sans-Serif;
    margin: 0;
    padding: 0;
    font-size: 16px;
    color: #333333;
    background-color: #ffffff;
    -webkit-text-size-adjust: none;
  }
  /*---------- ヘッダー ----------*/
  #header {
    width: 100%;
    margin: 0 auto 0 auto;
    border-top: solid 2px #a5967a;
    background-color: #df2f03;
  }
  #header h1 {
    margin: 0 auto 0 auto;
    width: 1200px;
    padding: 2px 0 0 5px;
    font-weight: normal;
    text-align: left;
    font-size: 12px;
    color: #ffffff;
  }
  /*---------- ヘッダー内 ----------*/
  #header #header_inner {
    width: 1200px;
    height: 110px;  /*-- 高さ --*/
    padding: 4px;  /*-- 余白 --*/
    margin: 0 auto 0 auto;
    background-color: #df2f03;
  }
  /*----- 左 logo -----*/
  #h_logo {
    padding: 0;
    text-align: left;
    font-size: 14px;
    color: #444444;
    line-height: 1.5;
    text-decoration: none;
    float: left;
  }
  #h_logo h2 {
    margin: 0;
    padding: 0 0 0 4px;  /*-- logo 位置 --*/
    text-align: left;
    font-size: 22px;
    color: #444444;
    letter-spacing: 0.05em;
  }
  #h_logo a {
    font-size: 22px;
    color: #666666;
    text-decoration: none;
  }
  #h_logo a:hover {
    font-size: 22px;
    color: #888888;
    text-decoration: none;
  }
  /*----- 右 info -----*/
  #h_info{
    margin: 0;
    padding: 10px 10px 0 0;  /*-- info 位置 --*/
    text-align: right;
    font-size: 16px;
    color: #ffffff;
    line-height: 1.6;
    text-decoration: none;
    float: right;
  }
  #h_info p{
    margin: 0;
    padding: 3px 0 0 0;
    text-align: left;
    font-size: 18px;
    color: #ffffff;
    letter-spacing: 0.05em;
    font-weight: bold;
  }
  /*---------- ヘッダーメニュー ----------*/
  #header-menu {
    clear: both;
    width: 100%;
    margin: 6px 0 0 0;
    padding: 0;
    height: 56px;
    text-align: left;
  }
  #header-menu ul {
    width: 1200px;
    text-align: left;
    margin: 0 auto 0 auto;
    padding: 0;
  }
  #header-menu li {
    display: inline;
    list-style-type: none;
    float: left;
    color: #ffffff;
  }
  #header-menu li a {
    font-size: 24px;
    font-weight: 700;
    color: #765c47;
    text-align: center;
    display: block;
    line-height: 1.3;
    letter-spacing: 0.05em;
    border-left: solid 1px #d6c6af;
    text-decoration: none;
    margin-top: 8px;
    padding: 6px 38px 2px 38px;
  }
  #header-menu li a:hover {
    color: #765c47;
    background-color: #f7f4ec;
  }
  #header-menu li.home a {
    padding: 6px 38px 2px 38px;
    border-left: none;
  }
  #header-menu span.sub {
    color: #b29164;
  }
  .clearfix:after {
    content: "";
    display: block;
    clear: both;
    height: 0; 
    visibility: hidden;
  }
  /*---------- メイン画像 ----------*/
  #header-img {
    width: 100%;
    margin: 6px 0 12px 0;
    text-align: center;
    background-image: url(../img/head_img_bg.png);
  }
  .main_photo {
    display: block;
    margin: 0 auto 0 auto;
  }
  /*---------- コンテンツ ----------*/
  #container {
    width: 100%;
    margin: 0 auto 0 auto;
    overflow: hidden;
    padding: 6px 0 10px 0;
  }
  /*---------- メインコンテンツ ----------*/
  #contents {
    float: right;
    margin: 0;
    padding: 0;
    font-size: 16px;
    width: 100%;
    letter-spacing: 0.05em;
    text-align: left;
    line-height: 1.7;
    height: 100%; /* 追加：要素の高さを100%に設定 */
  }
  #contents h2 {
    height: auto;
    margin: 0 0 14px 0;
    padding: 30px 0 0 0;
    font-size: 46px;
    color: #791a02;
    text-align: center;
  }
  #contents h2.page_title {
    margin: 0 0 18px 0;
    padding: 18px 0 18px 30px !important;
    line-height: 1.7;
    font-size: 20px;
    color: #581201;
    border: none;
    text-align: left;
    background-image: url(../img/page_title.gif);
    background-repeat: no-repeat;
  }
  #contents h3 {
    margin: 12px 3px 10px 3px;
    padding: 15px 10px 10px 18px;
    line-height: 1.4;
    font-size: 17px;
    color: #54351f;
    border-top: solid 1px #dddddd;
    border-right: solid 1px #dddddd;
    border-bottom: solid 1px #966934;
    border-left: solid 5px #966934;
    background-color: #f9f2d5;
  }
  #contents p {
    margin: 15px 0 15px 0;
    padding: 0 2px 0 2px;
    line-height: 1.7;
    font-size: 16px;
  }
  table.table_line {
    border-collapse: collapse;
    border: solid 1px #999999;
    width: 100%;
  }
  td.table_left {
    border-collapse: collapse;
    border: solid 1px #999999;
    padding: 12px 14px 8px 14px;
    width: auto;
    background-color: #fff8e3;
  }
  td.table_right {
    border-collapse: collapse;
    border: solid 1px #999999;
    padding: 12px 14px 8px 14px;
    width: 680px;
    background-color: #ffffff;
  }
  /*---------- フッター ----------*/
  #footer {
    clear: both;
    width: 100%;
    margin: 0;
    padding: 30px 0 30px 0;
    text-align: center;
    font-size: 14px;
    color: #ffffff;
    line-height: 1.8;
    background-color: #df2f03;
  }
  #footer a {
    color: #ffffff;
    font-size: 14px;
    text-decoration: none;
  }
  #footer a:hover {
    color: #555555;
    text-decoration: none;
  }
}
hr.line {
  margin: 0 0 10px 0;
  padding: 2px 0 6px 0;
  border: 0;
  border-bottom: dotted 1px #666666;
}
#news {
  height: 170px;
  overflow: auto;
  line-height: 1.8;
  padding: 8px 6px 7px 6px;
  margin: 12px 0 7px 0;
  border: solid 1px #cccccc;
  background-color: #ffffff;
}
p.back {
  margin: 0;
  padding: 0 5px 0 0;
  text-align: right;
}
span.red {
  color: #e60033;
}
span.red_b {
  color: #e60033;
  font-weight: bold;
  line-height: 1.7;
}
/*---------- インスタ　ライン画像配置 ----------*/
.centered-list {
  display: flex;
  justify-content: center;
  list-style: none;
  padding: 0;
}
.centered-list li {
  margin: 0; /* 他の部分のスタイルに影響を与えないようにmarginをリセット */
}
img {
  display: block;
  margin: auto;
  margin-bottom: 20px;
}
.scroll {
  width: 180px;
  height: 28px;
}

/* ==================================================
   8. ページ個別の指定
   （もと index.html / profile.html の <style> に
     直接書かれていたもの。読み込み順を保つため末尾に置く）
   ================================================== */

/* --- トップページ：チラシ拡大ボタン（スマホのみ表示） --- */
#top_flyer p.flyer_zoom { margin: 14px auto 0; padding: 0 15px; }
#top_flyer p.flyer_zoom a {
  display: block; max-width: 420px; margin: 0 auto;
  padding: 16px 10px;
  background: #ce071e; color: #fff;
  font-size: 17px; font-weight: bold; line-height: 1.4;
  text-align: center; text-decoration: none;
  border-radius: 6px; box-shadow: 0 3px 0 #8f0514;
}
#top_flyer p.flyer_zoom a:hover,
#top_flyer p.flyer_zoom a:active { background: #b00619; }
#top_flyer p.flyer_zoom .zoom_note {
  display: block; margin-top: 4px;
  font-size: 12px; font-weight: normal;
}

/* --- 全ページ：スティッキーヘッダー --- */
/* ページ本体をブラウザ本来のスクロールに戻し、ヘッダーは position:sticky で追従させる。
   旧方式（html,bodyをoverflow:hiddenにして内側のdivだけスクロール）は、
   ページ内検索のジャンプ・戻るボタンでの位置復元・スマホのアドレスバー自動格納が
   効かなくなるため取りやめた。 */
body, html { margin: 0; padding: 0; }
/* style.css の body{overflow:hidden} と #wrapper{overflow:hidden} は、
   その要素をスクロール容器にしてしまい position:sticky を無効化する。
   横方向のはみ出し防止だけを clip で残し、縦は visible に戻す
   （visible と clip の組み合わせだけはスクロール容器を作らない）。 */
body, #wrapper { overflow-x: clip; overflow-y: visible; }
/* 旧方式では本文がヘッダーの下に潜らなかったため背景が透明のままだった。
   sticky では本文が下を通るので、不透明な背景を必ず指定する。 */
#fixed-header { position: sticky; top: 0; z-index: 9000; display: flow-root;
                background-color: #fff; }
#scrollable-content { display: flow-root; }

/* --- 店舗情報ページ：本文の幅 --- */
#profile_wide {
    width: 1200px;
    margin: 0 auto; /* ページ中央に配置 */
  }