/**
 * ASE 追加CSS
 */
 
 body {
  font-family: "Noto Sans JP",sans-serif,-apple-system,  "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
  font-size:16px !important;
}
.navtxt-13px{
    font-size:13px;
}

.navtxt-13px a{
    color:#004097 !important;
}
/* ヘッダー初期状態 */
#site-header {
  position: fixed;
  top: 0; 
  left: 0;
  width: 100%;
  transition: top 0.3s ease; /* スクロール時にスムーズに隠す */
  z-index: 999;
}

/* ロゴ初期サイズ */
.logo {
  transition: transform 0.3s ease; /* 縮小アニメ用 */
}

/* ヘッダーがスクロールで縮小されるときに付与するクラス */
.scrolled-down {
  top: -50px !important; 
  /* 下スクロール時にヘッダーをちょっと上に隠す（上部のバーだけ見える想定） */
}

/* ロゴ縮小 */
.shrink .logo {
  transform: scale(0.6); 
  /* 下スクロールでちょっと小さくする例 */
}



/* スマホのみの改行 */
@media screen and (min-width: 768px){

.br-sp {
  display: none !important;
  }
  
}
 
/* -----------------------------------
   フル幅 & カラム間の隙間なし
----------------------------------- */
.features-container {
  width: 100%;           /* 横幅いっぱいに */
  display: flex;         /* 横並び */
  margin: 0;             /* 外余白をゼロに */
  padding: 0;            /* 内余白もゼロに */
  /* gap: 0;  → 指定しなければデフォルトで隙間なし */
  
  /* 上に100pxの余白を追加 */
  margin-top: 100px; 
}

/* -----------------------------------
   全てのボックスに同じクラス: feature-box01
----------------------------------- */
.feature-box01 {
  position: relative;
  flex: 1;
  border: 1px solid #ddd;    /* 枠線 */
  background-color: #fff;
  padding: 40px 30px 20px;   /* 上・左右・下の余白 */
  /* 画像を最下部へ配置するために縦方向のFlexを導入 */
  display: flex;
  flex-direction: column;         /* 中身を縦に並べる */
  /* （必要に応じて min-height など指定可） */
}
.feature-box01:first-child {
  border-left: none;
}

.feature-box01:last-child {
  border-right: none;
}

/* ナンバー（数字）を枠線に重ねて表示 */
.feature-number1,.feature-number2,.feature-number3 {
  position: absolute;
  top: 0;
  left: 25px;                /* 左余白と同じ 20px に */
  transform: translateY(-70%);  /* 枠線より少し上に飛び出す */
  background-color: #fff; 
  padding: 4px 5px;
  border: none; 
  border-radius: 4px;
  font-family: Roboto;
  font-size: 48px;
  font-style: normal;
  font-weight: 500;
  line-height: 48px; /* 100% */
}

/* ナンバー（数字）を枠線に重ねて表示 */
.feature-box02 .feature-number1,.feature-box02 .feature-number2,.feature-box02 .feature-number3 {

  transform: translateY(-50%) !important;  /* 枠線より少し上に飛び出す */
}

.feature-number1 {
  color: #019FE8;
}
.feature-number2 {
  color: #0175C0;
}
.feature-number3 {
  color: #004097;
}

/* タイトル・本文 */
.feature-title {
  margin-bottom: 20px;
  font-size: 1.4rem;
}
.feature-text {
  margin-bottom: 20px;
  line-height: 1.8;
}

/* 画像を最下部に配置するために .feature-image を'押し下げ' */
.feature-image {
  margin-top: auto; /* これが重要！余白を自動拡張して一番下に追いやる */
}
/* 画像を横幅100%にフィット */
.feature-image img {
  width: 100%;
  display: block;
  border-radius: 0px;
  /* 画像の下に50pxの余白を追加 */
  margin-bottom: 50px; 
}

/* -----------------------------------
   レスポンシブ対応（768px以下で縦並び）
----------------------------------- */
@media screen and (max-width: 768px) {
  .features-container {
    flex-direction: column;
  }
  
  .feature-box01 {
    margin-bottom: -1px; /* 枠線が重なるのが気になる場合に調整 */
    border-left: none;
    border-right: none;
  }
}

/* -----------------------------------
   フル幅 & カラム間の隙間なし
----------------------------------- */
.features-container02 {
  width: 100%;           /* 横幅いっぱいに */
  display: flex;         /* 横並び */
  justify-content: center;
  margin: 0;             /* 外余白をゼロに */
  padding: 0;            /* 内余白もゼロに */
  /* gap: 0;  → 指定しなければデフォルトで隙間なし */
  
  /* 上に100pxの余白を追加 */
  margin-top: 100px; 
  flex-direction: column;         /* 中身を縦に並べる */
}

/* -----------------------------------
   全てのボックスに同じクラス: feature-box02
----------------------------------- */
.feature-box02 {
  position: relative;
  flex: 1;
  justify-content: center;
  align-items: center;
  border-top: 1px solid #ddd;    /* 枠線 */
  border-bottom: none;    /* 枠線 */
  background-color: #fff;
  padding: 40px 0 20px;   /* 上・左右・下の余白 */
  /* 画像を最下部へ配置するために縦方向のFlexを導入 */
  display: flex;
  flex-direction: column;         /* 中身を縦に並べる */
  /* （必要に応じて min-height など指定可） */
  border-left: none;
  border-right: none;
}



/* ----- 親コンテナ ----- */
.facilities-container {
  display: flex;               /* 横並び */
  flex-wrap: nowrap;           /* 折り返ししない */
  width: 100%;                 /* 横幅いっぱいに */
  margin: 0;
  padding: 0;
}


.facilities-container a {
  text-decoration: none;      /* リンクの下線 */
}
.facilities-container a:hover{
  text-decoration: none;
}

/* ----- 各カラム ----- */
.facility-box {
  position: relative;
  flex: 1;                     /* 均等に伸ばす */
  min-height: 480px;           /* 高さの目安。お好みで変更 */
  
  /* 背景画像 */
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  
  /* 右側の仕切り線を入れたい場合 */
  border-right: 1px solid #ccc;
  text-decoration: none;      /* リンクの下線を消す */
  color: #fff;                /* テキストの色を白に（継承） */
}

/* ホバーしたときに何らかの演出が欲しければ */
.facility-box:hover {
  opacity: 0.9;               /* 少し暗くするなど */
  transition: 0.3s;
}

.facility-box::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.3);
}

/* 最後のカラムは右線を消す */
.facility-box:last-child {
  border-right: none;
}

/* テキストをまとめる領域（overlayでもOK） */
.facility-content {
  position: relative;          /* ここ自体は通常配置 */
  color: #fff;                 /* 文字を白に */
  padding: 40px 32px;          /* 内側余白をつける */

  /* 縦方向の位置を上部にしたい場合 → これでOK
     下部に寄せたい場合や中央寄せしたい場合は
     親要素を display: flex; align-items: center; などでも調整可能 */
}

/* 見出し */
.facility-content h2 {
  font-size: 1.4rem;
  margin-bottom: 20px;
  /* ハイフンはHTML側に直接「－会議施設案内」と書いています */
}

/* 段落 */
.facility-content p {
  line-height: 1.8;
  margin-bottom: 20px;
  max-width: 90%;  /* テキスト幅を抑えたい場合はこんな指定も */
}

/* 矢印アイコン配置 */
.arrow-button {
  position: absolute;
  bottom: 20px;  /* ボックス下から20px */
  right: 20px;   /* ボックス右から20px */
}
.arrow-button img {
  display: block;
  width: 24px;   /* アイコンの大きさを調整 */
  height: auto;
}


/* 矢印アイコン配置 */
.arrow-button1 {
  position: absolute;
  top: 40px;  /* ボックス下から20px */
  right: 20px;   /* ボックス右から20px */
}
.arrow-button1 img {
  display: block;
  width: 24px;   /* アイコンの大きさを調整 */
  height: auto;
}

/* ----- レスポンシブ対応 ----- */
@media screen and (max-width: 768px) {
  .facilities-container {
    flex-direction: column; /* 縦並び */
  }
  .facility-box {
    border-right: none;    /* 縦並びのときは不要なら消す */
    border-bottom: 1px solid #ccc;  /* 代わりに下線を付けるなど */
  }
  .facility-box:last-child {
    border-bottom: none;
  }
  .facility-content {
    padding: 30px 20px; 
  }
}




/* ----- 親コンテナ ----- */
.welcome-container {
  display: flex;               /* 横並び */
  flex-wrap: nowrap;           /* 折り返ししない */
  width: 100%;                 /* 横幅いっぱいに */
  margin: 0;
  padding: 0;
  column-gap: 10px;
}

.welcome-container a {
  text-decoration: none;      /* リンクの下線 */
}
.welcome-container a:hover{
  text-decoration: none;
}



/* ----- 各カラム ----- */
.welcome-box {
  position: relative;
  flex: 1;                     /* 均等に伸ばす */
  min-height: 188px;           /* 高さの目安。お好みで変更 */
  
  /* 背景画像 */
  background-repeat: repeat;
  background-position: center center;
  background-size: auto;
  
  /* 右側の仕切り線を入れたい場合 */
  border-right: 1px solid #ccc;
  text-decoration: none;      /* リンクの下線を消す */
  color: #fff;                /* テキストの色を白に（継承） */
}

/* ホバーしたときに何らかの演出が欲しければ */
.welcome-box:hover {
  opacity: 0.9;               /* 少し暗くするなど */
  transition: 0.3s;
}

.welcome-box::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.3);
}

/* 最後のカラムは右線を消す */
.welcome-box:last-child {
  border-right: none;
}

/* テキストをまとめる領域（overlayでもOK） */
.welcome-content {
  position: relative;          /* ここ自体は通常配置 */
  color: #fff;                 /* 文字を白に */
  padding: 40px 32px;          /* 内側余白をつける */

  /* 縦方向の位置を上部にしたい場合 → これでOK
     下部に寄せたい場合や中央寄せしたい場合は
     親要素を display: flex; align-items: center; などでも調整可能 */
}

/* 見出し */
.welcome-content h2 {
  font-size: 1.4rem;
  margin-bottom: 20px;
}

/* 段落 */
.welcome-content p {
  line-height: 1.8;
  margin-bottom: 20px;
  max-width: 90%;  /* テキスト幅を抑えたい場合はこんな指定も */
}


/* 矢印アイコン配置 */
.arrow-button1 {
  position: absolute;
  top: 40px;  /* ボックス下から20px */
  right: 20px;   /* ボックス右から20px */
}
.arrow-button1 img {
  display: block;
  width: 24px;   /* アイコンの大きさを調整 */
  height: auto;
}

/* ----- レスポンシブ対応 ----- */
@media screen and (max-width: 768px) {
  .welcome-container {
    flex-direction: column; /* 縦並び */
    row-gap:10px;
  }
  .welcome-box {
    border-right: none;    /* 縦並びのときは不要なら消す */
    border-bottom: 1px solid #ccc;  /* 代わりに下線を付けるなど */
  }
  .welcome-box:last-child {
    border-bottom: none;
  }
  .welcome-content {
    padding: 30px 20px; 
  }
}







/* 全体外枠 */
.menu-row {
  display: flex;
  width: 100%;
  border: 1px solid #ccc;  /* 全体を囲う外枠 */
  /* デスクトップでは4つを1行に並べる */
  flex-wrap: nowrap;
}


.menu-row a {
  text-decoration: none;      /* リンクの下線 */
}
.menu-row a:hover{
  text-decoration: none;
}



/* 各メニューボックス */
.menu-box {
  display: flex;
  align-items: center;
  flex: 1;                      /* 残り幅を等分 */
  padding: 20px;
  text-decoration: none;        
  color: #1a3b76;               /* 文字色 */
  
  border-right: 1px solid #ccc; /* ボックス間の仕切り線 */
  /* 下線は不要なら省略 */
}

/* 最後のボックスは右線を消す */
.menu-box:last-child {
  border-right: none;
}

/* ホバーエフェクト例 */
.menu-box:hover {
  background-color: #f9f9f9;
}

/* アイコン */
.menu-icon {
  width: 40px;
  height: auto;
  margin-right: 12px;
}

/* テキスト */
.menu-text {
  flex: 1; /* テキスト部分を伸ばす */
  font-size: 1rem;
}

/* 矢印アイコン */
.menu-arrow img {
  width: 24px;
  height: auto;
}

/* -----------------------------
   レスポンシブ対応
   768px以下で 2x2 レイアウト
------------------------------ */
@media screen and (max-width: 1024px) {
  .menu-row {
    flex-wrap: wrap;      /* 折り返しを有効に */
  }
  .menu-box {
    flex: 0 0 50%;        /* 幅を50%に固定 → 1行に2個 */
    border-right: 1px solid #ccc; /* 行末の仕切り線対応のため再指定 */
    border-bottom: 1px solid #ccc;/* 2列で上下に並ぶとき、下線も付加 */
  }
  /* 各行の2番目(2, 4, 6...)には右線を消す */
  .menu-box:nth-child(2n) {
    border-right: none;
  }
  /* 最後の2つは下線を消す等、調整したい場合 */
  /* 例えば「4番目（最後）」 */
  .menu-box:last-child {
    border-bottom: none;  
  }
  /* もし「3番目と4番目両方の下線を消したい」なら
     .menu-box:nth-child(n+3) { border-bottom: none; } など調整 */
}


/* ----- スマホ対応 (～768px) ここで1カラム ----- */
@media screen and (max-width: 768px) {
  .menu-row {
    flex-wrap: wrap;      /* 折り返しを有効に */
  }
  .menu-box {
    flex-basis: 100%; /* 1行に1個 */
    border-right: none;         /* 1列表示なので右線不要 */
    border-bottom: 1px solid #ccc; /* 下線を付けたい場合など */
  }
  /* 最後の要素は下線を消す */
  .menu-box:last-child {
    border-bottom: none;
  }
}



/* --------------------------------
   download-table（外枠）:
   枠線を表示
-------------------------------- */
.download-table {
  border: 1px solid #ccc;   /* 全体を囲む枠線 */
  width: 100%;
  margin: 20px auto;
  box-sizing: border-box;
}

/* --------------------------------
   各行（.download-row）:
   行ごとの区切り線
-------------------------------- */
.download-row {
  display: flex;
  border-bottom: 1px solid #ccc; /* 行の下線 */
}



.download-row a {
  text-decoration: none;      /* リンクの下線 */
}
.download-row a:hover{
  text-decoration: none;
}

/* 最後の行は下線を消す場合はここで制御:
*/
.download-row:last-child { border-bottom: none; }


/* --------------------------------
   各カラム（.download-box）:
   2カラム間の仕切り線
-------------------------------- */
.download-box {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  
  border-right: 1px solid #ccc;  /* カラム間の縦線 */
  padding: 12px 16px;
  text-decoration: none;         /* リンク下線を消す */
  color: #333333;
  box-sizing: border-box;
  min-height: 80px;
}

.download-box:hover {
  background-color: #f9f9f9;
}

/* 行内で最後のカラムは右線を消す */
.download-box:last-child {
  border-right: none;
}

/* --------------------------------
   テキスト / アイコン
-------------------------------- */
.download-text {
  font-size: 1rem;
}
.download-arrow {
  width: 24px;
  height: auto;
}

/* --------------------------------
   空セル (.empty) に疑似要素で白上塗り
-------------------------------- */
.download-box.empty {
  position: relative;   /* 疑似要素を絶対配置できるように */
  pointer-events: none; /* クリックを無効化 */
}
/* 枠線自体は .download-box に付いているが、
   疑似要素で上塗りして視覚的に隠す */
.download-box.empty::after {
  content: "";
  position: absolute;
  top: 0px;     /* 1px下にオフセット */
  left: 0px;    /* 1px右にオフセット */
  right: -2px;     /* 右端まで覆う */
  bottom: -2px;    /* 下端まで覆う */
  background: #fff; /* 背景を白にして線を隠す */
  pointer-events: none;
}

/* --------------------------------
   レスポンシブ (例: 768px以下で1カラム)
-------------------------------- */
@media screen and (max-width: 768px) {
  .download-row {
    flex-direction: column;      /* 縦積み */
  }
  .download-box {
    border-right: none;         /* 1列表示なので右線不要 */
    border-bottom: 1px solid #ccc;
  }
  .download-box:last-child {
    border-bottom: none;        /* 行の最後は下線オフ */
  }
  
  /* 空セルを表示ごと隠したいなら */
  .download-box.empty {
    display: none;              /* 完全に非表示に */
  }
}


.service-blocks {
  display: flex;
  flex-wrap: wrap;      /* 横並び＆折り返し */
  gap: 0;            /* ブロック間の余白（お好みで変更） */
  margin: 0 auto;       /* 必要に応じて中央寄せなど */
  max-width: 100%;    /* 必要に応じて最大幅を設定 */
  box-sizing: border-box;
}

.service-item {
  box-sizing: border-box;
  /* スマホでは1カラム(= 100%) */
  flex: 0 0 100%;

  /* ブロック自体は上と左にだけ境界線をつける */
  border-left: 1px solid #D9D9D9;
  border-top: 1px solid #D9D9D9;
  border-bottom: 1px solid #D9D9D9;
  border-right: 1px solid #D9D9D9;  /* カラム間の縦線 */

  padding-top: 25px;
  padding-bottom: 25px;
  padding-left: 25px;
  padding-right: 10px;
}

.service-item.empty {
display:none;
}

/* タブレット(768px以上)で2カラム */
@media screen and (min-width: 768px) {
  .service-item {
    flex: 0 0 50%;  /* 2カラム = 50%ずつ */
  }
.service-item.empty {
display:none;
}
}

/* PC(1024px以上)で3カラム */
@media screen and (min-width: 1024px) {
  .service-item {
    flex: 0 0 33.3333%;  /* 3カラム = 約33.333%ずつ */
  }
  
/* 空セルを判定するクラス */
.service-item.empty {
  position: relative;   /* 疑似要素を絶対配置できるように */
  border-right: 1px solid #ffffff !important;  /* カラム間の縦線 */
}

/* 疑似要素で「上と左の枠線」含め全体を白で覆う */
.service-item.empty::after {
  content: "";
  position: absolute;
  top: 1px !important;     /* 1px下にオフセット */
  left: 2px !important;    /* 1px右にオフセット */
  right: -3px !important;     /* 右端まで覆う */
  bottom: -1px !important;    /* 下端まで覆う */
  background: #fff; /* 背景を白にして線を隠す */
}
}
/* ===== フッター共通 ===== */
.footer{
  background:#fff;
  color:#333;
  padding:20px 0;
  max-width:100%;
  margin:0 auto;
  box-sizing:border-box;
}

/* ===== 最上段ナビ（横並び・区切り「・」） ===== */
.footer-topnav{ margin:0 0 24px; }

.footer-topnav-list{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;   /* 上揃え */
  gap:40px;
  margin:0;
  padding:0;
  list-style:none;
}
.footer-topnav-list li{
  display:flex;
  align-items:flex-start;   /* 上揃え */
}

/* 区切りドット：最上位の li 同士のみ。has-sub には付けない */
.footer-topnav-list > li:not(.has-sub)::before{
  content:"・";
  color:#333333;
  margin-right:5px;
}

/* has-sub（お問合せ）自体には区切りドットを出さない */
.footer-topnav-list > li.has-sub::before{
  content:none !important;
}

/* has-sub はタイトル＋子ULを縦積み。左にわずかに間隔を確保 */
.footer-topnav-list li.has-sub{
  display:block;
  margin-left:30px;
}
.footer-topnav-list li.has-sub h3{
  font-size:18px;
  margin:0 0 10px;
  font-weight:500;
  color:#093167;
}

/* 最上位リンク（青） */
.footer-topnav-list a{
  color:#333333;
  text-decoration:none;
  font-size:16px;
}
.footer-topnav-list a:hover{ text-decoration:underline; }

/* has-sub のタイトルリンクと子リンクの間隔 */
.footer-topnav-list li.has-sub > a{
  display:inline-block;
  margin-bottom:4px;
}

/* has-sub の子リンクUL */
.footer-topnav-sub{
  margin:6px 0 0;
  padding:0;
  list-style:none;
}
.footer-topnav-sub li{
  position:relative;
  line-height:1.9;
  padding-left:1em;         /* 中点ぶんオフセット */
}
.footer-topnav-sub li::before{
  content:"・";
  position:absolute;
  left:0; top:0;
  color:#004097;
  line-height:1.9;
}
.footer-topnav-sub a{
  color:#333;               /* 子リンクは本文色 */
  text-decoration:none;
  font-size:16px;
}
.footer-topnav-sub a:hover{ text-decoration:underline; }

/* ===== セクション見出し（左ダッシュ） ===== */
.footer-title{
  font-size:18px;
  margin:0 0 12px;
  position:relative;
  padding-left:30px;
  font-weight:500;
  color:#333333;
}
.footer-title::before{
  content:"—";
  position:absolute;
  left:0; top:0px;
  font-size:18px;
  line-height:1;
  color:#004097;
}

/* ===== セクション枠 ===== */
.footer-section{ margin-bottom:20px; }

/* ===== カラムレイアウト ===== */
.footer-row{
  display:flex;
  flex-wrap:wrap;
  gap:40px;
}
.footer-col{
  flex:1;
  min-width:220px;
}

/* ===== 小見出し ===== */
.footer-col h3{
  font-size:18px;
  margin:0 0 10px;
  font-weight:500;
  color:#093167;
}

/* ===== リスト（青い中点「・」で表示） ===== */
.footer-col ul{
  list-style:none;
  margin:0;
  padding:0;
}
.footer-col ul li{
  position:relative;
  line-height:2.2;
  padding-left:1.2em;       /* 中点のぶんオフセット */
}
.footer-col ul li::before{
  content:"・";
  position:absolute;
  left:0; top:0;
  color:#004097;
  line-height:2.2;
}
.footer-col li a{
  color:#333;
  text-decoration:none;
  font-size:16px;
}
.footer-col li a:hover{ text-decoration:underline; }

/* ===== セクション仕切り線 ===== */
.footer-separator{
  border: none;
  border-top: 1px solid #ddd;
  padding-bottom:40px;
}

/* ===== 来場者用：小さな横並びリンク ===== */
.footer-mini-links{ margin:0 0 8px; }
.footer-mini-links ul{
  display:flex;
  flex-wrap:wrap;
  gap:28px;
  margin:0;
  padding:0;
  list-style:none;
}
.footer-mini-links li{
  display:flex;
  align-items:center;
}
.footer-mini-links li + li::before{
  content:"・";
  color:#004097;
  margin-right:28px;
}
.footer-mini-links a{
  color:#004097;
  text-decoration:none;
  font-size:16px;
}
.footer-mini-links a:hover{ text-decoration:underline; }


/* フッターカンパニーインフォー */
.ftcom-container {
  display: flex;
  flex-direction: column; /* デフォルトは縦並び（PC・スマホ） */
  align-items: center;
  width: 100%;
  max-width: 1200px;
  background: white;
  padding: 0px;00
  text-align: center;
}

/* 左側（ロゴ＋情報） */
.ftcom-left {
  width: 100%;
}

.ftcom-main-logo {
  max-width: 200px;
}

.ftcom-company-info {
  text-align: left;  /* テキストのみ左寄せ */
  margin-top: 10px;
}

.ftcom-company-info p {
  margin: 5px 0;
}

.ftcom-company-info h2 {
  font-size:18px;
}

.ftcom-company-info a {
  color: #0066cc;
  text-decoration: none;
}

.ftcom-company-info a:hover {
  text-decoration: underline;
}

/* 右側（パートナーロゴ） */
.ftcom-right {
  display: flex;
  justify-content: center;
  gap: 15px;
  margin-top: 20px;
}

.ftcom-partner-logo {
  width: 80px;
  height: auto;
}

/* タブレット用（幅 768px 以上 1024px 以下） */
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .ftcom-container {
    flex-direction: row; /* 横並びに変更 */
    text-align: left;
    justify-content: space-between;
    align-items: center;
  }

  .ftcom-left {
    width: 50%;
    text-align: left;
  }

  .ftcom-right {
    width: 50%;
    justify-content: flex-end; /* 右端に寄せる */
    margin-top: 0;
  }

  .ftcom-main-logo {
    max-width: 180px;
  }
}

/* PC（1025px以上）& スマホ（768px未満） */
@media screen and (max-width: 767px), (min-width: 1025px) {
  .ftcom-container {
    flex-direction: column;
    align-items: center;
    text-align: center; /* 全体の中央配置を維持 */
  }

  .ftcom-left {
    width: 100%;
  }

  .ftcom-company-info {
    text-align: left; /* テキストブロックのみ左寄せ */
  }

  .ftcom-right {
    justify-content: center;
  }
}



/* ===== フッターのデザイン ===== */

/* フッター全体 */
.ase-footer {
  width: 100%;
  text-align: center;
}

/* 上段ナビゲーション */
.ase-footer-nav {
  background-color: #f5f5f5; /* 薄いグレー */
  padding: 24px 0;
}

.ase-footer-nav ul {
  display: flex;
  justify-content: center;
  list-style: none;
  padding: 0;
  margin: 0;
}

.ase-footer-nav li {
  margin: 0 15px;
}

.ase-footer-nav a {
  text-decoration: none;
  color: #333;
  font-size: 14px;
}

.ase-footer-nav a:hover {
  text-decoration: underline;
}

/* 下段コピーライト */
.ase-footer-bottom {
  background-color: #00479c; /* 青色 */
  color: white;
  padding: 10px 0;
}

/* ===== ページトップへ戻るボタン ===== */

.ase-back-to-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: #00479c; /* 青色 */
  color: white;
  border: none;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  font-size: 20px;
  cursor: pointer;
  display: none; /* 初期状態では非表示 */
  justify-content: center;
  align-items: center;
}

.ase-back-to-top:hover {
  background-color: #003366; /* 少し暗い青 */
}


/* ===== スマホ用メディアクエリ（幅 767px以下） ===== */
@media screen and (max-width: 767px) {
  .ase-footer-nav ul {
    flex-direction: column; /* 縦並びに変更 */
    align-items: flex-start; /* 左寄せ */
    gap: 10px; /* メニュー間の余白 */
    padding-left: 20px; /* 左側に余白を作る */
  }

  .ase-footer-nav li {
    margin: 5px 0; /* 上下の余白を調整 */
  }
}


/* 
  スマホ(767px以下)を想定したレイアウト (縦に3つ)
  1) テキストブロック
  2) 左イメージ
  3) 右イメージ
*/
/*************************************
 * パターン0 (eb0-xxx) クラスのスタイル
 *  - PC時: 左・右イメージの下端揃え
 *  - タブレット・スマホは縦/横並び
 ************************************/

/* ========== ベース(スマホ) ========== */
.eb0-layout {
  display: grid;
  grid-template-columns: 1fr;            /* 1列 */
  grid-template-rows: auto auto auto;    /* 3行 */
  grid-template-areas:
    "eb0-text-block"
    "eb0-left-image"
    "eb0-right-image";
  gap: 0;
  margin: 0;
  padding: 0;
  max-width: 1140px;
}

.eb0-text-block {
  grid-area: eb0-text-block;
  padding: 0 20px 0;   /* 上・左右・下の余白 */
}
.eb0-left-image {
  grid-area: eb0-left-image;
  padding: 0;
}
.eb0-right-image {
  grid-area: eb0-right-image;
  padding: 0;
}

.eb0-image-block img {
  width: 100%;
  height: auto;
  display: block;
}

/* ========== タブレット(768px~1023px) ========== */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .eb0-layout {
    grid-template-columns: 1fr 1fr;  /* 2列 */
    grid-template-rows: auto auto;   /* 2行 */
    grid-template-areas:
      "eb0-text-block eb0-text-block"
      "eb0-left-image eb0-right-image";
  }
  
.eb0-text-block {
  padding: 0;   /* 上・左右・下の余白 */
}
}

/* ========== PC(1024px以上) ========== */
@media screen and (min-width: 1024px) {
  .eb0-layout {
    grid-template-columns: 1fr 1fr;  /* 2列 */
    grid-template-rows: auto auto;   /* 2行 */
    grid-template-areas:
      "eb0-text-block eb0-text-block"
      "eb0-left-image eb0-right-image";


  }
.eb0-text-block {
  padding: 0;   /* 上・左右・下の余白 */
}
}
/* 
  スマホ(767px以下)を想定したレイアウト (縦に3つ)
  1) テキストブロック
  2) 左イメージ
  3) 右イメージ
*/
/*************************************
 * パターン1 (eb1-xxx) クラスのスタイル
 *  - PC時: 左・右イメージの下端揃え
 *  - タブレット・スマホは縦/横並び
 ************************************/

/* ========== ベース(スマホ) ========== */
.eb1-layout {
  display: grid;
  grid-template-columns: 1fr;            /* 1列 */
  grid-template-rows: auto auto auto;    /* 3行 */
  grid-template-areas:
    "eb1-text-block"
    "eb1-left-image"
    "eb1-right-image";
  gap: 0;
  margin: 0;
  padding: 0;
  max-width: 1140px;
}

.eb1-text-block {
  grid-area: eb1-text-block;
  padding: 0 20px 0;   /* 上・左右・下の余白 */
}
.eb1-left-image {
  grid-area: eb1-left-image;
  padding: 0;
}
.eb1-right-image {
  grid-area: eb1-right-image;
  padding: 0;
}

.eb1-image-block img {
  width: 100%;
  height: auto;
  display: block;
}

/* ========== タブレット(768px~1023px) ========== */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .eb1-layout {
    grid-template-columns: 1fr 1fr;  /* 2列 */
    grid-template-rows: auto auto;   /* 2行 */
    grid-template-areas:
      "eb1-text-block eb1-text-block"
      "eb1-left-image eb1-right-image";
  }
.eb1-text-block {
  padding: 0;   /* 上・左右・下の余白 */
}
}

/* ========== PC(1024px以上) ========== */
@media screen and (min-width: 1024px) {
  .eb1-layout {
    /* 2列×2行 */
    grid-template-columns: 1fr 1.6fr;
    grid-template-rows: auto minmax(auto,200px);
    grid-template-areas:
      "eb1-text-block eb1-right-image"
      "eb1-left-image  eb1-right-image";
  }

.eb1-left-image img {
  height: 200px;
  object-fit: cover;
}

.eb1-text-block {
  padding-right: 20px;
  padding-bottom: 5px;
  padding-left: 0px;
}
  /* 左イメージ下端揃え */
  .eb1-left-image {
    align-self: end;
  }
  /* 右イメージ下端揃え (2行にまたがる) */
  .eb1-right-image {
    align-self: end;
  }
}

/*******************************************************
 * パターン2 (eb2-xxx) 
 *  - スマホ/タブレット: Gridで従来のレイアウト
 *  - PC(1024px以上): 左イメージ(左), テキスト(右),
 *                   右イメージは背面に敷き 100%幅 x 高さ400px
 *******************************************************/

/* ========== スマホ(~767px) ========== */
.eb2-layout {
  display: grid;
  grid-template-columns: 1fr;            
  grid-template-rows: auto auto auto;    
  grid-template-areas:
    "eb2-text-block"
    "eb2-left-image"
    "eb2-right-image";
  gap: 0;
  margin: 0;
  padding: 0;
  max-width: 1140px;
}
.eb2-text-block {
  grid-area: eb2-text-block;
  padding: 0 20px 0;   /* 上・左右・下の余白 */
}
.eb2-left-image {
  grid-area: eb2-left-image;
  padding: 0;
}
.eb2-right-image {
  grid-area: eb2-right-image;
  padding: 0;
}
.eb2-image-block img {
  width: 100%;
  height: auto;
  display: block;
}

/* ========== タブレット(768px~1023px) ========== */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .eb2-layout {
    grid-template-columns: 1fr 1fr;  
    grid-template-rows: auto auto;   
    grid-template-areas:
      "eb2-text-block eb2-text-block"
      "eb2-left-image eb2-right-image";
  }
.eb2-text-block {
  padding: 0;   /* 上・左右・下の余白 */
}
}

/* ========== PC(1024px以上) ========== */
@media screen and (min-width: 1024px) {
  .eb2-layout {
    display: flex;
    position: relative;
    align-items: flex-start; 
    min-height: 600px; /* 下イメージが隠れない程度に高さ確保（必要に応じて） */
    gap: 0;
  }
  .eb2-text-block,
  .eb2-left-image,
  .eb2-right-image {
    padding: 0;
  }

  /* 右イメージを背面に敷き、幅100%・高さ400px固定 */
  .eb2-right-image {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 400px;   /* 高さを固定 */
    z-index: 0;      /* 最背面 */
  }

  /* 画像を拡大・一部トリミングして表示する */
  .eb2-right-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;  /* アスペクト比を崩さずに埋め、余分はトリミング */
    position: 50% 50%;
    display: block;
  }

  /* 左イメージ: 左側 */
  .eb2-left-image {
    order: 1;         
    position: relative;
    z-index: 2;       
    flex: 0 0 auto;   
    margin-left: 60px;
    width: 480px;
  }

  /* テキストブロック: 右側 */
  .eb2-text-block {
    order: 2;
    position: relative;
    z-index: 2;
    margin-left: 20px; 
    flex: 1; 
    padding: 0;   /* 上・左右・下の余白 */
  }
}

// スマホの時だけ改行させるクラス
.br-sp {
    display: none;
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
    .br-sp {
        display: block;
    }
}

/*******************************************************
 * パターン3 (eb3-xxx)
 *  - スマホ/タブレット: 縦に並べる(画像→テキスト)
 *  - PC(1024px以上): テキストを画像の上に重ねる(オーバーレイ)
 *******************************************************/

/* ========== ベース(モバイルファースト) ========== */
.eb3-layout {
  display: flex;           /* 縦に積む */
  flex-direction: column;
  margin: 0;
  padding: 0;
  max-width: 100%;       /* 必要に応じて最大幅を設定 */
  margin: 0 auto;          /* ページ中央寄せ (お好みで) */
}

.eb3-image-block img {
  width: 100%;
  height: auto;
  display: block;
}

.eb3-text-block {
  padding: 16px;           /* 文字に余白をつける */
  color: #fff;             /* 文字色(お好みで) */
  background-image: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/02/bgbutton3.png");
}
.eb3-text-block2 {
  padding: 16px;           /* 文字に余白をつける */
  color: #fff;             /* 文字色(お好みで) */
  background-image: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/02/bgbutton3.png");
}
  .eb3-text-block h2 {
    color: var(--color-bgGray, #F5F6F9);
    font-family: Roboto;
    font-size: 64px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%; 
    letter-spacing: -1.28px;
  }
  .eb3-text-block2 h3 {
    color: var(--color-bgGray, #F5F6F9);
    /* headingPrimary */
    font-family: "Noto Sans JP";
    font-size: var(--fontSize-headingPrimary, 30px);
    font-style: normal;
    font-weight: 500;
    line-height: 150%; /* 45px */
  }

/* 
   タブレット(768px ~ 1023px) も 
   ここではスマホと同様の縦レイアウトを採用 
   → 特に変更がなければ何も書かなくてOK
*/

/* ========== PC(1024px以上) ========== */
@media screen and (min-width: 1024px) {
  .eb3-layout {
    /* 画像とテキストを重ねるために position: relative を使う */
    position: relative;
    /* 必要に応じて高さを設定する場合は以下を指定
       min-height: 600px;
    max-width: 100%;       /* 必要に応じて最大幅を設定 */
    */
  }

  /* テキストブロックを絶対配置で画像に重ねる */
  .eb3-text-block {
    position: absolute;
    bottom: 0px;   /* 画像の下から20px上げる */
    left: 0px;     /* 左端から20px右へ寄せる */
    min-width: 50%; /* テキストブロックの幅を適宜制限 */
    max-width: 70%;       /* 必要に応じて最大幅を設定 */
    margin: 0;      /* PC時は余白をリセット(必要なら) */
    padding: 60px 60px 10px 60px;  /* かぶせるので余白を少し多めに */
    /* ↑ 透過背景にして画像が少し見えるようにする例 */
    /* 透過を望まなければ普通の色指定でOK
       background-image: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/02/bgbutton3.png");
    */
  }
  
  /* テキストブロックを絶対配置で画像に重ねる */
  .eb3-text-block2 {
    top: 0px;   /* 画像の下から20px上げる */
    left: 0px;     /* 左端から20px右へ寄せる */
    max-width: 100%; /* テキストブロックの幅を適宜制限 */
    margin: 0;      /* PC時は余白をリセット(必要なら) */
    padding: 60px clamp(50%, 40%, 30%) 60px 60px; /*  ［上］ と ［右］ と ［下］ と ［左］ を指定 */
    /* ↑ 透過背景にして画像が少し見えるようにする例 */
    /* 透過を望まなければ普通の色指定でOK
       background-image: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/02/bgbutton3.png");
    */
  }
  
  .eb3-text-block h2 {
    color: var(--color-bgGray, #F5F6F9);
    font-family: Roboto;
    font-size: 120px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%; /* 120px */
    letter-spacing: -2.4px;
  }
  .eb3-text-block2 h3 {
    color: var(--color-bgGray, #F5F6F9);
    /* headingPrimary */
    font-family: "Noto Sans JP";
    font-size: var(--fontSize-headingPrimary, 32px);
    font-style: normal;
    font-weight: 500;
    line-height: 150%; /* 48px */
  }
}

/*******************************************************
 * パターン4 (eb4-xxx)
 *  - スマホ: 1列で縦に並べる (画像→タイトルブロック→文章)
 *            タイトルはかぶせず通常フロー
 *  - タブレット: 2列、タイトルはかぶせず
 *  - PC(1024px以上): 2列、タイトルだけ画像にかぶせる(width: 60%)
 *******************************************************/

/* ========== ベース(スマホ: ~767px) ========== */

/* コンテナ: スマホは1列 */
.eb4-layout {
  display: grid;
  grid-template-columns: 1fr; /* 1列 */
  gap: 10px;                  /* ブロック間の隙間 */
  max-width: 1140px;
  margin: 0 auto;
  padding: 0;
}

/* ブロック */
.eb4-block {
  background-color: #F5F6F9; /* お好みで変更 */
  padding: 0;
}

/* 画像ブロック (タイトルブロックを重ねるためにrelativeにしておく) */
.eb4-image-block {
  position: relative; 
  padding: 20px;
}

/* 画像 */
.eb4-image-block img {
  width: 100%;
  height: auto;
  display: block;
}

/* タイトルブロック: スマホではかぶせない (static) */
.eb4-title-block {
  position: static;
  padding: 20px;
  background-color: #F5F6F9; /* スマホやタブレット時は白背景など */
  color: #333; 
}
  /* タイトルだけ画像にかぶせる (オーバーレイ) */
  .eb4-title-block h3 {
  /* cardTitle */
  font-family: "Noto Sans JP";
  font-size: var(--fontSize-cardTitle, 14px);
  font-weight: 500;
  line-height: 150%; /* 21px */
  }

/* 文章ブロック */
.eb4-text-block {
  padding: 20px;
  color: #333; /* お好みで */
  background-color: #F5F6F9; 
}
  .eb4-text-block p {
    /* 特に変更なし */
  font-size: var(--fontSize-cardDesc, 13px);
  font-style: normal;
  font-weight: 400;
  line-height: 175%; /* 22.75px */
  }

/* ========== タブレット(768px~1023px) ========== */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .eb4-layout {
    grid-template-columns: 1fr 1fr;  /* 2列 */
  }

  /* タブレットではタイトルブロックもかぶせない (static) */
  .eb4-title-block {
    position: static;
    background-color: #F5F6F9;
    color: #333;
  }
  /* 文章ブロックは通常フローのまま (画像の下に配置) */
  .eb4-text-block {
    /* 特に変更なし */
    font-family: "Noto Sans JP";
    font-size: var(--fontSize-cardDesc, 15px);
    font-style: normal;
    font-weight: 400;
    line-height: 175%; /* 26.25px */
  }
}

/* ========== PC(1024px以上) ========== */
@media screen and (min-width: 1024px) {
  .eb4-layout {
    grid-template-columns: 1fr 1fr; /* 2列 */
  }

  /* タイトルだけ画像にかぶせる (オーバーレイ) */
  .eb4-title-block {
    position: absolute;  /* 画像の上に重ねる */
    bottom: 0;           /* 画像の下端 */
    left: 0;             /* 左端 */
    width: 60%;          /* 幅60%でオーバーレイ */
    box-sizing: border-box;
    background-color: #F5F6F9; /* 半透明黒背景(例) */
    padding: 20px;
  }
  /* タイトルだけ画像にかぶせる (オーバーレイ) */
  .eb4-title-block h3 {
    color: var(--color-black, #333);
    /* cardTitle */
    font-family: "Noto Sans JP";
    font-size: var(--fontSize-cardTitle, 16px);
    font-style: normal;
    font-weight: 500;
    line-height: 150%; /* 24px */
  }

  /* 文章ブロックは通常フローのまま (画像の下に配置) */
  .eb4-text-block {
    /* 特に変更なし */
    padding: 20px;
  }
  .eb4-text-block p {
    /* 特に変更なし */
    font-family: "Noto Sans JP";
    font-size: var(--fontSize-cardDesc, 15px);
    font-style: normal;
    font-weight: 400;
    line-height: 175%; /* 26.25px */
  }
}


/*******************************************************
 * パターン5 (eb5-xxx)
 *  - スマホ: 1列で縦に並べる (画像→タイトルブロック→文章)
 *            タイトルはかぶせず通常フロー
 *  - タブレット: 2列、タイトルはかぶせず
 *  - PC(1024px以上): 2列、タイトルだけ画像にかぶせる(width: 60%)
 *******************************************************/

/* ========== ベース(スマホ: ~767px) ========== */

/* コンテナ: スマホは1列 */
.eb5-layout {
  display: grid;
  grid-template-columns: 1fr; /* 1列 */
  gap: 0;                  /* ブロック間の隙間 */
  width: 100%;
  margin: 0 auto;
  padding: 0;
  border-top: 1px solid #ddd;
}

/* ブロック */
.eb5-block {
  background-color: #F5F6F9; /* お好みで変更 */
  padding: 0;
}

/* 画像ブロック (タイトルブロックを重ねるためにrelativeにしておく) */
.eb5-image-block {
  position: relative; 
}

/* 画像 */
.eb5-image-block img {
  width: 100%;
  height: auto;
  display: block;
}

/* タイトルブロック: スマホではかぶせない (static) */
.eb5-title-block {
  position: static;
  padding: 20px 10px 10px 30px;  /* ［上］ と ［右］ と ［下］ と ［左］ を指定 */
  background-image: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/02/bgbutton3.png");
  color: #FFFFFF; 
}

/* 文章ブロック */
.eb5-text-block {
  padding: 10px 30px 10px 30px; /*  ［上］ と ［右］ と ［下］ と ［左］ を指定 */
  color: #ffffff; /* お好みで */
  background-image: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/02/bgbutton3.png");
  min-height:230px;
}

/* ========== タブレット(768px~1023px) ========== */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .eb5-layout {
    grid-template-columns: 1fr 1fr;  /* 2列 */
  }

  /* タブレットではタイトルブロックもかぶせない (static) */
  .eb5-title-block {
    position: static;
    background-image: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/02/bgbutton3.png");
    color: #FFFFFF;
    padding: 20px 10px 10px 30px;  /* ［上］ と ［右］ と ［下］ と ［左］ を指定 */
  }
/* 文章ブロック */
.eb5-text-block {
  padding: 10px 30px 10px 30px; /*  ［上］ と ［右］ と ［下］ と ［左］ を指定 */
}
}

/* ========== PC(1024px以上) ========== */
@media screen and (min-width: 1024px) {
  .eb5-layout {
    grid-template-columns: 1fr 1fr; /* 2列 */
  }

  /* タイトルだけ画像にかぶせる (オーバーレイ) */
  .eb5-title-block {
    position: absolute;  /* 画像の上に重ねる */
    bottom: 0;           /* 画像の下端 */
    left: 0;             /* 左端 */
    width: 80%;          /* 幅60%でオーバーレイ */
    box-sizing: border-box;
    background-image: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/02/bgbutton3.png");
    color: #FFFFFF; 
    padding: 20px 10px 10px 40px;  /* ［上］ と ［右］ と ［下］ と ［左］ を指定 */
  }

  /* 文章ブロックは通常フローのまま (画像の下に配置) */
/* 文章ブロック */
.eb5-text-block {
  padding: 10px clamp(20%, 20%, 10%) 60px 40px; /*  ［上］ と ［右］ と ［下］ と ［左］ を指定 */
}
}


/*******************************************************
 * パターン6 (eb6-xxx)
 *  - スマホ/タブレット: 縦に並べる(画像→テキスト)
 *  - PC(1024px以上): テキストを画像の上に重ねる(オーバーレイ)
 *******************************************************/

/* ========== ベース(モバイルファースト) ========== */
.eb6-layout {
  display: flex;           /* 縦に積む */
  flex-direction: column;
  margin: 0;
  padding: 0;
  max-width: 100%;       /* 必要に応じて最大幅を設定 */
  margin: 0 auto;          /* ページ中央寄せ (お好みで) */
  background-color: #F5F6F9;
}

.eb6-image-block img {
  width: 100%;
  height: auto;
  display: block;
}

.eb6-text-block {
  padding: 16px;           /* 文字に余白をつける */
  color: #333333;             /* 文字色(お好みで) */
  background-color: #F5F6F9;
}
.eb6-text-block2 {
  padding: 16px;           /* 文字に余白をつける */
  color: #333333;             /* 文字色(お好みで) */
  background-color: #F5F6F9;
}
.eb6-text-block h2 {
  color: var(--color-accentBase, #004097);
  /* headingPrimary */
  font-family: "Noto Sans JP";
  font-size: var(--fontSize-headingPrimary, 28px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 45px */
}
.eb6-text-block p {
  color: var(--color-fontBase, #333);

  /* base */
  font-family: "Noto Sans JP";
  font-size: var(--fontSize-base, 15px);
  font-style: normal;
  font-weight: 400;
  line-height: 175%; /* 28px */
}
/* 
   タブレット(768px ~ 1023px) も 
   ここではスマホと同様の縦レイアウトを採用 
   → 特に変更がなければ何も書かなくてOK
*/

/* ========== PC(1024px以上) ========== */
@media screen and (min-width: 1024px) {
  .eb6-layout {
    /* 画像とテキストを重ねるために position: relative を使う */
    position: relative;
    /* 必要に応じて高さを設定する場合は以下を指定
       min-height: 600px;
    max-width: 100%;       /* 必要に応じて最大幅を設定 */
    */
  }

  /* テキストブロックを絶対配置で画像に重ねる */
  .eb6-text-block {
    position: absolute;
    bottom: -180px;   /* 画像の下から20px上げる */
    right: 0px;     /* 左端から20px右へ寄せる */
    min-width: 50%; /* テキストブロックの幅を適宜制限 */
    max-width: 70%;       /* 必要に応じて最大幅を設定 */
    margin: 0;      /* PC時は余白をリセット(必要なら) */
    padding: 60px 60px 10px 60px;  /* かぶせるので余白を少し多めに */
    /* ↑ 透過背景にして画像が少し見えるようにする例 */
    /* 透過を望まなければ普通の色指定でOK
    */
    background-color: #F5F6F9;
    z-index: 20;
  }
  
  /* テキストブロックを絶対配置で画像に重ねる */
  .eb6-text-block2 {
    top: 0px;   /* 画像の下から20px上げる */
    right: 0px;     /* 左端から20px右へ寄せる */
    max-width: 100%; /* テキストブロックの幅を適宜制限 */
    margin: 0;      /* PC時は余白をリセット(必要なら) */
    padding: 60px 60px 60px clamp(50%, 40%, 30%); /*  ［上］ と ［右］ と ［下］ と ［左］ を指定 */
    /* ↑ 透過背景にして画像が少し見えるようにする例 */
    /* 透過を望まなければ普通の色指定でOK
    */
    min-height: 200px; /* 45px */
    background-color: #F5F6F9;
    z-index: 10;
  }
  
  .eb6-text-block h2 {
  color: var(--color-accentBase, #004097);
  font-family: "Noto Sans JP";
  font-size: 48px;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 62.4px */
  
  }
.eb6-text-block p {
  color: var(--color-fontBase, #333);

  /* base */
  font-family: "Noto Sans JP";
  font-size: var(--fontSize-base, 16px);
  font-style: normal;
  font-weight: 400;
  line-height: 175%; /* 28px */
}
}

    /*------------------------------
      2) トップ用 全幅スライダー
         (mySwiperTop)
    ------------------------------*/
    .fullwidth-slider {
      width: 100%;
      position: relative;
      margin: 0 auto;
    }

    /* 高さは画面いっぱい(100vh)にする例。任意で変更 */
    .mySwiperTop {
      width: 100%;
      height: 720px;
      position: relative;
      overflow: hidden;
    }
    /* スライド */
    .mySwiperTop .swiper-slide {
      width: 100%;
      height: 100%;
    }
    .mySwiperTop .swiper-slide img {
  position: absolute;
  top: 0; left: 0; 
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1; /* 画像の後ろにオーバーレイを重ねる */
    }
    /* ▼ 黒のオーバーレイ(透明度0.3) ▼ */
.mySwiperTop .swiper-slide::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.3);
  z-index: 2; /* 画像の上に重ねる */
}
    /* ▼ ページネーションのドットを「●」に、アクティブ時「⦿」に ▼ */
    .mySwiperTop .swiper-pagination-bullet {
      background: none !important;
      border: none !important;
      width: auto !important;
      height: auto !important;
      margin: 0 10px !important;
      padding: 0 !important;
      opacity: 1 !important;
      font-size: 8px;
      color: #fff;
      cursor: pointer;
      transition: color 0.3s ease;
      position: relative;
      justify-content: center !important;
      align-items: center !important;
    }
    .mySwiperTop .swiper-pagination-bullet::before {
      content: "●";
      justify-content: center !important;
      align-items: center !important;
    }
    .mySwiperTop .swiper-pagination-bullet-active::before {
      font-size: 12px;
      width: 20px;
      height: 20px;
      background-color: rgba(255, 255, 255, 0);
      border-radius: 50%;
      border: #FFFFFF 1px solid;
      display: flex;
      justify-content: center !important;
      align-items: center !important;
    }
    /*================================
      3) ページネーション＆再生ボタン
         をひとつのコンテナにまとめる
    ================================*/
    .fullwidth-controls {
      position: absolute;
      bottom: 20px;
      right: 20px;
      z-index: 3; /* オーバーレイより前面 */
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      gap: 10px; /* ドットとボタンの隙間 */
    }

    /* ページネーション（ドット） */
    .mySwiperTop .fullwidth-pagination {
      display: flex;
      flex-direction: row;
      position: relative;
      bottom: 30px;
      right: 10px;
      font-size: 8px;
      z-index: 3;
    }

    /* 再生／一時停止ボタン */
    .mySwiperTop .fullwidth-playpause {
      position: relative;
      bottom: 10px;
      right: 10px;
      z-index: 10;
      width: 35px;
      height: 25px;
      background-color: rgba(255, 255, 255, 0);
      border-radius: 50%;
      border: #FFFFFF 1px solid;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      color: #FFFFFF;
      cursor: pointer;
      transition: background-color 0.3s ease;
    }
    .mySwiperTop .fullwidth-playpause:hover {
      background-color: rgba(255, 255, 255, 0.3);
    }



    /*------------------------------
      3) 1つ目のスライダー (mySwiper)
    ------------------------------*/
    .slider-container {
      display: flex;
      justify-content: flex-start;
      align-items: center;
      width: 100%;
      margin: 0 auto;
      padding: 20px 0;
      box-sizing: border-box;
      position: relative;
    }
    .mySwiper {
      width: 100%;
      position: relative;
      padding-bottom: 150px !important; /* ナビゲーションの余白 */
    }
    .mySwiper .swiper-slide {
      width: 540px !important;
      height: auto;
      display: flex;
      justify-content: center;
      align-items: flex-start;
      border: 1px solid #D9D9D9;
      background-color: #fff;
      padding: 20px;
      box-sizing: border-box;
      text-align: center;
      transition: all 0.3s ease;
    }
    .slide-content {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      width: 100%;
      text-align: left;
      gap: 20px;
    }
    .text-section {
      flex: 1;
      padding-right: 10px;
    }
    .text-section h2 {
      font-size: 22px;
      color: #333;
      margin-bottom: 10px;
      position: relative;  /* 擬似要素の配置に備えて */
      display: inline-block;
    }

.text-section h2::before {
      font-size: 10px;
  content: "●";
  color: #004097;
  display: inline-block;        /* インライン要素として横棒を描画 */
  vertical-align: middle;       /* タイトルと縦方向を揃える */
}
    .text-section p {
      font-size: 14px;
      margin: 5px 0;
      color: #333;
    }
    .image-section {
      width: 200px;
      height: auto;
    }
    .image-section1 {
      width: 300px;
      height: auto;
    }
    .image-section img {
      width: 100%;
      height: auto;
    }

    /* 1つ目スライダーのナビゲーション */
    .swiper-navigation {
      position: relative;
      justify-content: flex-end;
      bottom: -50px;
      right: 10px;
      transform: translateY(-50%);
      display: flex;
      flex-direction: row;
      gap: 10px;
      z-index: 200;
    }
    .custom-button-prev, .custom-button-next {
      width: 40px;
      height: 40px;
      background-color: white;
      border: 2px solid #D9D9D9;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      color: #004097;
      cursor: pointer;
      transition: all 0.3s ease;
    }
    .custom-button-prev:hover, .custom-button-next:hover {
      background-color: #004097;
      color: white;
    }
    .mySwiper .swiper-pagination {
    display:none;
      position: absolute;
      bottom: -20px;
      text-align: center;
      width: 100%;
    }

    /*------------------------------
      4) 2つ目のスライダー (mySwiper1)
    ------------------------------*/
    .mySwiper1 {
      width: 100%;
      position: relative;
      padding-bottom: 120px !important; /* ナビゲーションの余白 */
    }
    .mySwiper1 .swiper-slide {
      width: 500px !important;
      height: auto;
      display: flex;
      justify-content: center;
      align-items: center;
      background-color: transparent;
      box-sizing: border-box;
      text-align: center;
      transition: all 0.3s ease;
    }
    .custom-slide-card {
      width: 100%;
      max-width: 500px;
      overflow: hidden;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      text-align: left;
      margin: 0 auto;
    }
    .custom-image-section {
      width: 100%;
      height: 250px;
      overflow: hidden;
      border-bottom: 1px solid #ddd;
    }
    .custom-image-section img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .custom-text-section {
      padding: 15px;
    }
    .custom-title {
      font-size: 16px;
      color: #333;
      margin-bottom: 10px;
      font-weight: 500;
      position: relative;  /* 擬似要素の配置に備えて */
      display: inline-block;
    }
    .custom-title::before {
      content: "";
      display: inline-block;        /* インライン要素として横棒を描画 */
      vertical-align: middle;       /* タイトルと縦方向を揃える */
      width: 16px;                  /* 横棒の長さ（調整可） */
      height: 3px;                  /* 横棒の太さ（調整可） */
      margin-right: 10px;            /* タイトルとの間隔 */
      background-color: #005bab;    /* 横棒の色 */
}
    .custom-description {
      font-size: 14px;
      color: #333;
      line-height: 1.6;
      margin: 0 0 10px 0;
    }
    .custom-facility-info {
      font-size: 12px;
      color: #666;
      background-color: #ffffff;
      padding: 5px 10px;
      display: inline-block;
    }
    /* 2つ目スライダーのナビゲーション */
    .prev1, .next1 {
      width: 40px;
      height: 40px;
      background-color: white;
      border: 2px solid #D9D9D9;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      color: #004097;
      cursor: pointer;
      transition: all 0.3s ease;
    }
    .prev1:hover, .next1:hover {
      background-color: #004097;
      color: white;
    }
    .mySwiper1 .swiper-pagination {
    display:none;
      position: absolute;
      bottom: -20px;
      text-align: center;
      width: 100%;
    }
    
    /* スライダー共通の基本設定 */
    .swiper {
      /* 必要に応じてスライダー全体の最大幅などを指定 */
      width: 100%;
      margin: 0 auto;
    }

    /* kitchenスライダー用 */
    .swiper-kitchen .swiper-slide {
      /* 1スライドあたりの幅を 300px に固定 */
      width: 400px !important;
    }

    /* 画像はスライド幅に合わせる */
    .swiper-kitchen .swiper-slide img {
      width: 100%;
      height: auto;
      display: block;
    }


    /*------------------------------
      5) レスポンシブ対応
    ------------------------------*/
    @media (max-width: 768px) {
      /* トップスライダー高さを調整 */
      .mySwiperTop {
        height: 60vh; /* 例: 60%の高さにする */
      }

      /* 1つ目スライダー */
      .mySwiper .swiper-slide {
        width: 240px !important;
        padding: 10px;
      }
      .slide-content {
        flex-direction: column;
        gap: 10px;
      }
      .text-section h2 {
        font-size: 18px;
      }
      .text-section p {
        font-size: 12px;
      }
      .image-section {
        width: 100%;
        max-width: 200px;
        margin: 0 auto;
      }

      /* 2つ目スライダー */
      .mySwiper1 .swiper-slide {
        width: 240px !important;
      }
      .custom-image-section {
        height: 200px;
      }
      .custom-title {
        font-size: 14px;
      }
      .custom-description {
        font-size: 12px;
      }
      
    /* kitchenスライダー用 */
    .swiper-kitchen .swiper-slide {
      /* 1スライドあたりの幅を 300px に固定 */
      width: 300px !important;
    }
    }
    
    
/* タイトル（横棒を擬似要素で表示） */
.hall-title {
  font-size: 24px;
  margin: 20px 10px 20px 0px; /* 適度な余白 */
  color: #333;
  position: relative;  /* 擬似要素の配置に備えて */
  display: inline-block;
}

.hall-title::before {
  content: "";
  display: inline-block;        /* インライン要素として横棒を描画 */
  vertical-align: middle;       /* タイトルと縦方向を揃える */
  width: 20px;                  /* 横棒の長さ（調整可） */
  height: 3px;                  /* 横棒の太さ（調整可） */
  margin-right: 15px;            /* タイトルとの間隔 */
  background-color: #005bab;    /* 横棒の色 */
  left: -5px;
}

/* テーブル本体 */
.hall-detail-table {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
  font-size: 14px; /* 文字サイズ14px */
  margin-bottom: 30px; /* 下に余白（任意） */
}

/* セルの基本スタイル */
.hall-detail-table th,
.hall-detail-table td {
  border: 1px solid #ddd;
  padding: 10px;
  text-align: center;      /* 左寄せ */
  vertical-align: middle;
  background-color: #FFFFFF !important; /* ヘッダー背景色 */
}

/* テーブルヘッダー */
.hall-detail-table thead th {
  background-color: #005bab !important; /* ヘッダー背景色 */
  color: #fff;               /* ヘッダー文字色 */
  font-weight: bold;
}

/* 1列目セル（項目名） */
.hall-detail-table td:first-child {
  background-color: #f9f9f9 !important;
  font-weight: bold;
  width: 180px; /* 幅は任意（調整） */
}

.gallery-description {
  font-size: 14px;
  margin-bottom: 20px;
  color: #333;
}
/* ギャラリー全体のコンテナ */
.gallery-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* PC時は3列 */
  gap: 1px; /* 画像間の間隔1px */
}

/* スマホ（768px以下）では2列 */
@media (max-width: 768px) {
  .gallery-container {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ギャラリーアイテム1つ分 */
.gallery-item {
  position: relative; /* キャプションを重ねるため */
  overflow: hidden;   /* はみ出す部分を隠す場合は指定 */
  background-color: black;
}

/* 画像を横幅いっぱいに表示 */
.gallery-item img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover; /* 必要に応じてトリミング */
  opacity: 0.7; /* 半透明の背景 */
}

/* キャプションを画像の左上に重ねる */
.gallery-caption {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  padding: 6px 10px;
  color: #fff;
  font-size: 14px; /* キャプション文字サイズ */
}
/* 親コンテナ：横並び & 自動折返し */
.room-card-container {
  display: flex;
  flex-wrap: wrap;       /* 横幅が足りない場合に折り返す */
  gap: 20px;             /* ブロック間の余白 */
  margin: 0 auto;        /* 中央寄せなどしたい場合 */
  max-width: 1200px;     /* レイアウト幅の上限を指定したい場合 */
  box-sizing: border-box;
}

/* 各ブロック */
.room-card {
  /* PCなど画面が広い場合は、2カラム(= 50%)になるように計算 */
  flex: 0 0 calc(50% - 20px);
  box-sizing: border-box;
  background-color: #fff;  /* 背景色(お好みで) */
  padding: 10px;
}

/* スマホなど画面が狭い場合は1カラム(= 100%)に */
@media screen and (max-width: 767px) {
  .room-card {
    flex: 0 0 100%;
  }
}

/* 画像や見出し、テーブルの調整例 */
.room-card img {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 10px;
}

.room-card h3 {
  font-size: 1.2rem;
  margin: 0 0 20px;
  font-weight: 400;
}

.room-card table {
  width: 100%;
  border-collapse: collapse;
}

.room-card table th,
.room-card table td {
  border: 1px solid #ddd;
  padding: 15px;
  text-align: center;
  background: var(--color-bgGray, #FFFFFF) !important;
  font-weight: 400;
  font-family: "Noto Sans JP";
}
.room-card table th {
  background: var(--color-bgGray, #F5F6F9) !important;
  width: 160px;
}2

/* タイトル横棒 */
.customtitle {
  position: relative !important;
  display: inline-block !important;
}

.customtitle::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 16px;
  height: 2px;
  margin-right: 11px;
  background-color: #005bab; /* 横棒の色 */
}

.customlink a{
  text-decoration: underline !important;
  color:#004097 !important;
}

.customlink a:hover{
  color:#3370c7 !important;

}
.customlink {
  text-decoration: underline !important;
  color:#004097 !important;
}

.customlink:hover{
  color:#3370c7 !important;

}

/* 全体ラッパ（任意で幅など調整） */
.report-container {
  max-width: 100%;   /* 必要なら幅制限 */
  margin: 0 auto;     /* 中央寄せ */
  box-sizing: border-box;
}

/* 1行分 */
.report-row {
  display: flex;
  flex-wrap: wrap; /* 折り返しを許可 */
  margin-bottom: 10px; /* 行間 */
  min-height:90px;
  align-items: center;
  border-bottom:1px solid #D9D9D9;
}
.report-row:first-child{
  border-top:1px solid #D9D9D9;
}

/* PC/タブレット: 1行に2要素(年度・リンク)横並び */
@media (min-width: 769px) {
  .report-year {
    flex: 0 0 30%;  /* 項目名を30%幅 (調整可) */
    max-width: 30%;
    font-weight: 500;
    color: #333;
    padding-right: 10px; /* 年度とリンクの間隔 */
  }
  .report-link {
    flex: 0 0 70%;  /* 内容を70%幅 */
    max-width: 70%;
  }
}

/* スマホ (768px以下): 縦並び */
@media (max-width: 768px) {
  .report-row {
    flex-direction: column;
    align-items: start;
    justify-content: center;
  }
  .report-year,
  .report-link {
    flex: none;
    max-width: 100%;
    margin-bottom: 4px; /* 下に少し間隔 */
  }
}

/* リンク色: 通常 #004097, hover #3370c7 */
.report-link a {
  color: #004097;
  text-decoration: undeline; /* 下線なし(任意) */
}
.report-link a:hover {
  color: #3370c7;
}
/* リンク色: 通常 #004097, hover #3370c7 */
.ws-link a {
  text-align: left !important;
}

/* PDFアイコンを疑似要素で表示 */
.report-link a::before {
  content: "";
  display: inline-block;
  width: 18px; 
  height: 18px;
  background: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/03/pdf.svg") no-repeat center;
  /* ↑ ここにPDFアイコンのBase64などを入れるか、外部URLでも可 */
  background-size: 18px 18px;
  margin-right: 5px;
  vertical-align: middle;
}

/* リンク色: 通常 #004097, hover #3370c7 */
.report-link-d a ,.report-link-zip a ,.report-link-none a {
  color: #004097;
  text-decoration: undeline; /* 下線なし(任意) */
}
.report-link-d a:hover ,.report-link-zip a ,.report-link-none a {
  color: #3370c7;
}

/* PDFアイコンを疑似要素で表示 */
.report-link-d a::before {
  content: "";
  display: inline-block;
  width: 18px; 
  height: 18px;
  background: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/03/pdf.svg") no-repeat center;
  /* ↑ ここにPDFアイコンのBase64などを入れるか、外部URLでも可 */
  background-size: 18px 18px;
  margin-right: 5px;
  vertical-align: middle;
}

/* PDFアイコンを疑似要素で表示 */
.report-link-d a::after ,.report-link-zip a::after ,.report-link-none a::after {
  content: "";
  display: inline-block;
  width: 18px; 
  height: 18px;
  background: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/03/download.svg") no-repeat center;
  /* ↑ ここにPDFアイコンのBase64などを入れるか、外部URLでも可 */
  background-size: 18px 18px;
  margin-left: 5px;
  vertical-align: middle;
}


/* ZIPアイコンを疑似要素で表示 */
.report-link-zip a::before {
  content: "";
  display: inline-block;
  width: 18px; 
  height: 18px;
  background: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/03/zip.svg") no-repeat center;
  /* ↑ ここにPDFアイコンのBase64などを入れるか、外部URLでも可 */
  background-size: 18px 18px;
  margin-right: 5px;
  vertical-align: middle;
}



/* リンク色: 通常 #004097, hover #3370c7 */
.out-link a {
  color: #004097;
  text-decoration: undeline; /* 下線なし(任意) */
}
.out-link a:hover {
  color: #3370c7;
}

/* PDFアイコンを疑似要素で表示 */
.out-link a::after {
  content: "";
  display: inline-block;
  width: 18px; 
  height: 18px;
  background: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/03/outlink.svg") no-repeat center;
  /* ↑ ここにPDFアイコンのBase64などを入れるか、外部URLでも可 */
  background-size: 18px 18px;
  margin-left: 10px;
  vertical-align: middle;
}

.ryoukin .icon {
    color:#004097 !important;
}

  /* コンテナ */
.overview-table-container1 {
  width: 100%;
  margin: 0 auto;
  /* 初期状態ではスクロールしない（隠す） */
  overflow-x: auto;
  box-sizing: border-box;
}

/* テーブル本体 */
.overview-table1,.overview-table2 {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse; /* 罫線を重ねて表示しない */
  font-size: 14px; /* 文字サイズ14px */
}

/* セルの基本スタイル */
.overview-table1 th,.overview-table1 td {
  border: 1px solid #ddd;
  padding: 20px 10px;
  text-align: center;
  vertical-align: middle;
  width: 110px;
}

.overview-table2 th{
  border: 1px solid #fff;
  padding: 20px 10px;
  text-align: center;
  vertical-align: middle;
  width: 50px;
}
.overview-table2 td {
  border: none !important;
}

.overview-table2 tr {
  background-color: #fff;      /* 奇数行 */
}

/* テーブルの偶数行・奇数行指定を強制的に上書きする */
.overview-table1 tbody tr:nth-child(even),
.overview-table1 tbody tr:nth-child(odd) {
  background-color: #F5F6F9 !important;
}

.overview-table1 td{
  background-color: #F5F6F9 !important;
}
/* ヘッダー行 */
.overview-table1 thead th {
  background-color: #0175C0; /* ヘッダー背景色 */
  color: #fff;              /* ヘッダー文字色 */
  font-weight: bold;
}

/* thead */
.overview-table2 thead th {
  background-color: #0175C0; /* ヘッダー背景色 */
  color: #fff;              /* ヘッダー文字色 */
  padding: 20px 10px;
  text-align: center;
  vertical-align: middle;
  /* ここでは白い境界線は見えないので、下線だけ太めに付与 */
  border-bottom: 2px solid #ccc;
}

.overview-table1 .th-header,.overview-table2 .th-header {
  background-color: #004097 !important; /* ヘッダー背景色 */
  font-size: 18px !important;         /* 好みで調整 */
}
.overview-table2 .left-td {
  text-align: left;
}

/* tbody：偶数行を薄いグレー、奇数行を白に */
.overview-table2 tbody tr:nth-child(odd) {
  background-color: #fff !important;      /* 奇数行 */
}
.overview-table2 tbody tr:nth-child(even) {
  background-color: #f5f6f9 !important;    /* 偶数行 */
}

.overview-table1 .left-td {
  text-align: left !important;
  background-color: #FFFFFF !important; /* ヘッダー背景色 */
}


  /* コンテナ */
.overview-table-container {
  width: 100%;
  margin: 0 auto;
  /* 初期状態ではスクロールしない（隠す） */
  overflow-x: auto;
  box-sizing: border-box;
}

/* テーブル本体 */
.overview-table {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
  font-size: 14px; /* 文字サイズ14px */
}

/* セルの基本スタイル */
.overview-table th,
.overview-table td {
  border: 1px solid #ddd;
  padding: 10px;
  text-align: center;
  vertical-align: middle;
  width: 110px;
}
/* テーブルの偶数行・奇数行指定を強制的に上書きする */
.overview-table tbody tr:nth-child(even),
.overview-table tbody tr:nth-child(odd) {
  background-color: #fff !important;
}
/* ヘッダー行 */
.overview-table thead th {
  background-color: #005bab; /* ヘッダー背景色 */
  color: #fff;              /* ヘッダー文字色 */
  font-weight: bold;
}

/* 左端セル（項目名） */
.overview-table td:first-child {
  background-color: #f9f9f9;
  font-weight: bold;
  text-align: left;
}




.button-list1 {
  display: flex;           /* 横並びのベース */
  flex-wrap: wrap;         /* はみ出したら折り返す */
  gap: 0;           /* ボタン同士の間隔を 0 に */
  margin: 0;
  padding: 0;
  list-style: none;        /* ul/liを使う場合はリストマーカー除去 */
  box-sizing: border-box;
}

/* 各ボタンのスタイル */
.button-list1 a {
  display: flex;           /* ラベルとアイコンを左右に配置 */
  justify-content: space-between;
  align-items: center;
  flex: 0 0 auto;           /* PC時は4つで100%幅を占有するイメージ */
  min-width: auto;
  box-sizing: border-box;
  margin: 0;             /* ボタン同士の余白 */
  padding: 32px 24px 32px 24px;
  border: 1px solid #D9D9D9;  /* ボタンの枠線(好みで調整) */
  background-color: #fff;  
  color: #333;             /* 文字色: #333 */
  font-size: 18px;         /* 好みで調整 */
  cursor: pointer;
  text-decoration: none; /* 下線なし(任意) */
  
}
.button-list1 a:hover {
  background-color: #F5F6F9 !important; 

}

/* アイコン部分のスタイル */
.button-list1 .icon {
  margin-left: 20px;        /* ラベルとアイコンの間隔 */
  color: #004097;          /* アイコン色: #004097 */
}


/* スマホ: 縦並び(横幅100%)にする */
@media (max-width: 768px) {
  .button-list1 a {
    flex: 0 0 100%; /* 1列 */
    font-size: 16px;         /* 好みで調整 */
  }
}

    /* PC表示時の基本スタイル */
    .responsive-table {
      width: 100%;
      border-collapse: collapse; /* 通常のテーブルのように隣接する枠線を重ねる */
      margin: 0 auto;
    }
    .responsive-table th,
    .responsive-table td {
      border: 1px solid #D9D9D9;
      padding: 20px;
      vertical-align: top;
    }
    .responsive-table th {
      background-color: #004097; /* ヘッダー背景色 */
      color: #FFFFFF;
      text-align: center; /* PC表示時は左寄せ */
    }
      /* スマホ時に各行の1カラム目（最初のtd）を中央寄せ */
      .responsive-table td:first-of-type {
        background-color: #F5F6F9; /* ヘッダー背景色 */
      }
      /* スマホ時に各行の1カラム目（最初のtd）を中央寄せ */
      .responsive-table td:nth-child(2) {
        background-color: #FFFFFF; /* ヘッダー背景色 */
      }

    /* 768px以下（スマホ）で縦並びにする */
    @media screen and (max-width: 768px) {
      /* テーブルや行をブロック化 */
      .responsive-table tr {
        display: block;
        width: 100%;
        /* スマホ表示時は行自体の枠線を削除 */
        border: none;
        margin-bottom: 0;
      }
      .responsive-table th,
      .responsive-table td {
        display: block;
        width: 100%;
        /* 各セルだけにボーダーを付ける */
        border: 1px solid #D9D9D9;
        box-sizing: border-box;
      }
      /* スマホ時にテーブルヘッダーを中央寄せ */
      .responsive-table th {
        text-align: center;
      }
      /* スマホ時に各行の1カラム目（最初のtd）を中央寄せ */
      .responsive-table td:first-of-type {
        text-align: center;
      }
    }
    
    
/* コンテナ: PC/タブレット時は2カラム、スマホ時は1カラム */
.content-container {
  display: flex;       /* Flexboxを使用 */
  flex-wrap: wrap;     /* 複数行に折り返し */
  gap: 40px;           /* ブロック間の余白を20pxに */
  margin: 0 auto;      /* 必要なら中央寄せ */
  max-width: 1200px;   /* 必要なら幅制限 (任意) */
  box-sizing: border-box;
}

/* PC/タブレット時 (幅769px以上) は1ブロックを50% - αに */
@media (min-width: 769px) {
  .content-block {
    flex: 0 0 calc(50% - 20px); 
    /* ↑ gap: 20px の半分を差し引いて調整。
       必要に応じて calc(50% - 20px) 等に変更可 */
  }
}

/* スマホ (768px以下) では1カラム */
@media (max-width: 768px) {
  .content-block {
    flex: 0 0 100%;
  }/* タイトル: 疑似要素で横棒を付与 */
.content-title {
  margin-bottom: 10px !important;
}
}

/* コンテンツブロック本体: ボーダーなし */
.content-block {
  background-color: #fff;
  border: none;       /* 枠線なし */
  margin: 0;          /* gapに依存 */
  padding: 0;         /* 必要に応じて余白追加 */
}

/* 画像: 横幅100%表示 */
.content-block img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;  /* 必要なら画像トリミング */
}

/* タイトル: 疑似要素で横棒を付与 */
.content-title {
  position: relative;
  display: inline-block;
  font-size: 16px;
  color: #333;
  margin: 10px 0 5px;
  font-weight: 500;
  margin-bottom: 20px;
  margin-top: 20px;
}
.content-title::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 16px;
  height: 2px;
  margin-right: 8px;
  background-color: #005bab; /* 横棒の色 */
}

/* サブタイトルなど */
.content-subtitle {
  font-size: 18px;
  color: #333;
  margin-bottom: 10px;
}

/* 施設情報: 背景色 #F5F6F9 */
.content-facility {
  font-size: 14px;
  color: #333;
  background-color: #F5F6F9;
  padding: 4px 8px;      /* 少し余白を入れる */
  display: inline-block; /* 背景をテキスト範囲に合わせる */
}

/* --------------------------------------
   1) シーン全体のコンテナ
--------------------------------------- */
.scene-container {
  margin-bottom: 40px; /* セクション間の余白などお好みで */
  /* ボーダーなど不要の場合は付けない */
  /* padding: 20px;  必要なら余白を追加 */
}
.scene-container-inner {
  padding: 40px; /* セクション間の余白などお好みで */
  /* ボーダーなど不要の場合は付けない */
  /* padding: 20px;  必要なら余白を追加 */
}

/* --------------------------------------
   2) タイトル（疑似要素で横棒）
--------------------------------------- */
.scene-title {
  position: relative;
  display: inline-block; /* 疑似要素を同じ行で扱う */
  font-size: 20px;
  color: #333;
  margin: 40px 0;
}
.scene-title::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 20px;     /* 横棒の長さ */
  height: 2px;     /* 横棒の太さ */
  margin-right: 8px;
  background-color: #005bab; /* 横棒の色 */
}

/* --------------------------------------
   3) 説明文など
--------------------------------------- */
.scene-description {
  font-size: 14px;
  color: #333;
  margin-bottom: 10px;
}
/* 横並び用のコンテナ */
.scene-info {
  display: flex;       /* Flexbox */
  flex-wrap: wrap;     /* 折り返しを許可 */
  gap: 10px;           /* ブロック間の余白10px */
  margin-bottom: 20px; /* 下に余白(任意) */
}
/* PC/タブレット: 横並び（幅769px以上） */
@media (min-width: 769px) {
  .scene-block {
    flex: 200px,200px; /* 2ブロックを等分に横並び */
    
    font-size: 15px;
  }
}
/* 各ブロックの背景色を白に */
.scene-block {
  background-color: #fff;
  padding: 10px;         /* 内側の余白(任意) */
  box-sizing: border-box;
  font-size: 14px;
}

/* ラベル */
.scene-label {
  font-weight: bold;
  color: #333;
  margin-right: 5px; /* ラベルと内容の間隔 */
}

/* リンクに下線＆色設定 */
.scene-facility {
  text-decoration: underline;
  color: #007bff; /* リンク色(例) */
}

/* --------------------------------------
   4) 画像2枚のコンテナ (FLEXBOX)
--------------------------------------- */
.scene-images {
  display: flex;
  flex-wrap: wrap; /* 行折り返し */
  gap: 10px;       /* 画像間の余白を10pxに */
}

/* PC時: 画像を横並び、幅50% */
@media (min-width: 1024px) {
    
.scene-container-inner {
  padding: 0; /* セクション間の余白などお好みで */
  /* ボーダーなど不要の場合は付けない */
  /* padding: 20px;  必要なら余白を追加 */
}
  .scene-images {
    display: flex;
    gap: 10px;
  }
  .scene-images img {
    width: calc(50% - 5px); /* gapで余白があるので -0pxに */
    height: 387px;  /* 高さ200pxに固定 */
    object-fit: cover;      /* 必要ならトリミング */
  }
  .scene-title {
  font-size: 24px;
}
}

/* タブレット・スマホ時: 縦並び、幅100%、高さは半分 (例: 50vh) */
@media (max-width: 1023px) {
  .scene-images {
    display: flex;
    flex-direction: column; /* 縦並び */
    gap: 10px;
  }
  .scene-images img {
    width: 100%;
    height: 200px;  /* 高さ200pxに固定 */
    object-fit: cover;
  }
}

  /*==============================
  全体レイアウト設定
==============================*/

/* 各セクションのラップ */
.info-section {
  margin-bottom: 40px; /* セクション間の余白 */
}

/* タイトルに疑似要素で横棒 */
.info-section-title {
  position: relative;
  display: inline-block;
  font-size: 24px;
  color: #333;
  margin: 20px 0;
}

.info-section-title::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 16px;
  height: 2px;
  margin-right: 8px;
  background-color: #005bab; /* 横棒の色 */
}

/*==============================
  PC時は横並び、モバイル時は縦並び
==============================*/

/* 行ラッパ: PCで横並び */
.info-row {
  display: flex;
  margin-bottom: 10px; /* 行ごとの下余白 */
  flex-wrap: wrap;     /* 項目が長いとき折り返し */
  min-height: 30px;
  border-bottom: 1px solid #D9D9D9;
  padding-top: 15px;
  padding-bottom: 15px;
}

/* PC時: ラベル30% / 内容70% など調整可 */
@media (min-width: 769px) {
  .info-label {
    flex: 0 0 30%;  /* 項目名の幅 */
    max-width: 200px;
    font-weight: bold;
    color: #333;
    padding-right: 10px; /* ラベルと内容の間隔 */
  }
  .info-content {
    flex: 0 0 70%;  /* 内容の幅 */
    max-width: 70%;
  }
}

/* タブレット・スマホ時: 縦並び */
@media (max-width: 768px) {
  .info-row {
    flex-direction: column;
    min-height: 30px;
  }
  .info-label {
    flex: none;
    max-width: 100%;
    margin-bottom: 4px; /* ラベルと内容の間隔 */
    font-weight: bold;
  }
  .info-content {
    flex: none;
    max-width: 100%;
  }
.info-section-title {
  font-size: 20px;
}
}

/*==============================
  テキストや余白の基本設定
==============================*/

/* ラベル・内容共通設定 (PC/モバイル共通) */
.info-label,
.info-content {
  font-size: 14px;   /* 文字サイズ */
  line-height: 1.5;
  box-sizing: border-box;
  /* 背景やボーダー不要なら省略 */
  background-color: transparent; /* デフォルト透明 */
}

/* ラベルを強調したい場合 */
.info-label {
  color: #333;  /* 任意 */
}

/* 内容 */
.info-content {
  color: #555;  /* 任意 */
}

    /* 全体ラッパ（任意で幅など調整） */
.report-container {
  max-width: 100%;   /* 必要なら幅制限 */
  margin: 0 auto;     /* 中央寄せ */
  box-sizing: border-box;
}

/* 1行分 */
.report-row {
  display: flex;
  flex-wrap: wrap; /* 折り返しを許可 */
  margin-bottom: 10px; /* 行間 */
  min-height:90px;
  align-items: center;
  border-bottom:1px solid #D9D9D9;
}
.report-row:first-child{
  border-top:1px solid #D9D9D9;
}

/* PC/タブレット: 1行に2要素(年度・リンク)横並び */
@media (min-width: 769px) {
  .report-year {
    flex: 0 0 30%;  /* 項目名を30%幅 (調整可) */
    max-width: 30%;
    font-weight: 500;
    color: #333;
    padding-right: 10px; /* 年度とリンクの間隔 */
  }
  .report-link {
    flex: 0 0 70%;  /* 内容を70%幅 */
    max-width: 70%;
  }
}

/* スマホ (768px以下): 縦並び */
@media (max-width: 768px) {
  .report-row {
    flex-direction: column;
    align-items: start;
    justify-content: center;
  }
  .report-year,
  .report-link {
    flex: none;
    max-width: 100%;
    margin-bottom: 4px; /* 下に少し間隔 */
  }
}

/* リンク色: 通常 #004097, hover #3370c7 */
.report-link a {
  color: #004097;
  text-decoration: undeline; /* 下線なし(任意) */
}
.report-link a:hover {
  color: #3370c7;
}

/* PDFアイコンを疑似要素で表示 */
.report-link a::before {
  content: "";
  display: inline-block;
  width: 18px; 
  height: 18px;
  background: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/03/pdf.svg") no-repeat center;
  /* ↑ ここにPDFアイコンのBase64などを入れるか、外部URLでも可 */
  background-size: 18px 18px;
  margin-right: 5px;
  vertical-align: middle;
}

/* タイトルの疑似要素で横棒 */
.services-title {
  position: relative;
  display: inline-block;
  font-size: 18px;
  color: #333;
  margin: 20px 0;
}
.services-title::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 20px;
  height: 2px;
  margin-right: 8px;
  background-color: #005bab; /* 横棒の色 */
}

/* ▼ 全体のコンテナーを幅900pxに */
.services-wrapper {
  width: 100%;
  margin: 0 auto;       /* 中央寄せ */
  box-sizing: border-box;
}

/* ▼ Flexboxでアイテムを並べる */
.services-container {
  display: flex;
  flex-wrap: wrap;   /* 折り返しを許可 */
  gap: 0;         /* アイテム間の隙間0px */
}

/* スマホ（デフォルト）: 縦並び (1列) */
.service-item {
  flex: 0 0 100%;
  padding: 10px;
  box-sizing: border-box;
  text-align: center;    /* テキスト中央 (任意) */
  border: 1px solid #ddd; /* 1pxの枠線 */
  min-height: 50px;
}

/* タブレット (768px～1024px) */
/* 1行目・2行目は3アイテム(33.33%)、3行目は2アイテム(50%) */
@media (min-width: 768px) and (max-width: 1024px) {
  .service-item {
    flex: 0 0 33.33%;
  }
  /* 7番目・8番目だけ幅50%に */
  .service-item:nth-child(7),
  .service-item:nth-child(8) {
    flex: 0 0 50%;
  }
}

/* PC (1025px以上): 4アイテム(25%) × 2行 */
@media (min-width: 1025px) {
  .service-item {
    flex: 0 0 25%;
  }
}

    /* タイトルの疑似要素で横棒 */
.section-title {
  position: relative;
  display: inline-block;
  font-size: 18px;
  color: #333;
  margin: 20px 0;
}
.section-title::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 15px;
  height: 2px;
  margin-right: 8px;
  background-color: #005bab; /* 横棒の色 */
}

/* 全体コンテナ (Flexbox) */
.industry-container {
  display: flex;
  flex-wrap: wrap;       /* 複数行に折り返し */
  gap: 40px;             /* コンテンツボックス間の余白 */
  margin: 0 auto;        /* 中央寄せ（幅指定がある場合など） */
  max-width: 1200px;     /* 必要に応じて最大幅など調整 */
}

/* コンテンツボックス: 幅280px、ボーダーなし */
.industry-box {
  width: 280px;       /* 固定幅280px */
  border: none;       /* 枠線なし */
  background: none;   /* 背景なし */
  box-sizing: border-box;
}

/* アイコン表示エリア: 幅100% × 高さ180px、背景#ffffff、中央配置 */
.industry-image {
  width: 100%;
  height: 180px;
  background-color: #ffffff; 
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px; 
  box-sizing: border-box;
}
.industry-image img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain; /* アイコンが潰れないように表示 */
}

/* タイトル・テキスト */
.industry-title {
  font-size: 16px;
  margin: 15px 0 10px 0;
  color: #333;
}
.industry-text {
  font-size: 14px;
  color: #555;
  line-height: 1.6;
}

/* -----------------------------
   レスポンシブ対応
------------------------------*/

/* スマホ: 幅～767px => 1列 */
@media (max-width: 767px) {
  .industry-box {
    flex: 0 0 100%;
  }
}

/* タブレット: 幅768px～1024px => 2列 */
@media (min-width: 768px) and (max-width: 1024px) {
  .industry-box {
    flex: 0 0 calc((100% - 40px) / 2); 
    /* 2列 => gap:20pxの1列分を引く => (100% - 20px)/2 */
  }
}

/* PC: 幅1025px～ => 3列 */
@media (min-width: 1025px) {
  .industry-box {
    flex: 0 0 calc((100% - 2 * 40px) / 3);
    /* 3列 => gap:20pxが2つ => (100% - 2*20px)/3 */
  }
}

/* メガメニュー全体のラップ要素 */
.my-mega-submenu {
  /* 必要に応じてレイアウトや余白を調整 */
  padding: 24px;
  background-color: #fff; /* 背景色などを指定 */
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.05);
}

/* タイトルのスタイル */
.my-mega-submenu .guide-title {
  font-size: 24px;
  margin-bottom: 24px;
  position: relative; /* 疑似要素配置用 */
}
.my-mega-submenu .guide-title::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 15px;
  height: 2px;
  margin-right: 8px;
  background-color: #005bab; /* 横棒の色 */
}

/* ナビゲーションリスト（横並び） */
.my-mega-submenu .guide-nav {
  list-style: none;  /* デフォルトのリストマーカーを消す */
  padding: 0;
  margin: 0;
  display: flex;     /* 横並び */
  flex-wrap: wrap;   /* 折り返しを有効にする */
  gap: 2rem;         /* 各要素の間隔を調整（お好みで） */  
}

/* リスト項目 */
.my-mega-submenu .guide-nav li {
  position: relative; /* 疑似要素配置用 */
}

/* リンク：下線付き、hover時に色を変更 */
.my-mega-submenu .guide-nav li a {
  font-size: 14px;
  text-decoration: underline;
  color: #333;
  font-weight: 500;
  transition: color 0.2s ease;
}
.my-mega-submenu .guide-nav li a:hover {
  color: #CCCCCC;
}

/* 矢印アイコン（全項目に表示する場合） */
.my-mega-submenu .guide-nav li::after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 20px; 
  height: 20px;
  margin-left: 0.5rem;
  /* Base64エンコードしたSVGアイコン（右向き矢印）を背景画像に */
  background: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/02/buttonicon2-1.svg") 
              no-repeat center;
  background-size: contain;
}
/* 親メニューがアクティブな場合のリンクを相対配置に */
.current-menu-item > a,
.current-menu-parent > a {
  position: relative;  /* 疑似要素を絶対配置するために必要 */
}
/* アクティブメニューの下に20px幅のラインを引く */
.current-menu-item > a::after,
.current-menu-parent > a::after {
  content: "";
  position: absolute;
  width: 24px;                /* ラインの長さ */
  height: 2px;               /* ラインの太さ */
  background-color: #004097;     /* ラインの色 */
  bottom: 0;              /* テキストの下からどのくらい離すか */
  left: 50%;                 /* テキスト中央に配置 */
  transform: translateX(-50%); /* 中央寄せ */
}
.shiryou .elementskit-megamenu-panel {
  position: absolute;
  left: -500px !important; /* 左に300pxずらす */
  top: 20px !important;     /* 上から80pxの位置に */  
}
#menu-item-1282 > a:before,
#menu-item-1354 > a:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 20px;              /* アイコンの幅 */
  height: 20px;             /* アイコンの高さ */
  margin-right: 8px;        /* アイコンとテキストの間隔 */
  background: url('https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/03/download.svg') no-repeat center center;
  background-size: contain;
}


/* メガメニュー全体のラップ要素 */
.my-mega-submenu-mobi {
  padding: 24px;
  background-color: #F5F6F9; /* 背景色を変更した例 */
}

/* タイトルのスタイル */
.my-mega-submenu-mobi .guide-title {
  font-size: 24px;
  margin-bottom: 24px;
  position: relative; /* 疑似要素配置用 */
}

/* タイトルの左に細い横棒を入れる例 */
.my-mega-submenu-mobi .guide-title::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 15px;
  height: 2px;
  margin-right: 8px;
  background-color: #005bab; /* 横棒の色 */
}

/* ナビゲーションリスト（縦並びに） */
.my-mega-submenu-mobi .guide-nav {
  list-style: none;  /* デフォルトのリストマーカーを消す */
  padding: 0;
  margin: 0;
  display: flex;     
  flex-direction: column; /* 縦並び */
  gap: 1rem;              /* 各要素の間隔を調整 */
}

/* リスト項目 */
.my-mega-submenu-mobi .guide-nav li {
  position: relative; /* 疑似要素配置用 */
}

/* リンク：下線付き、hover時に色を変更 */
.my-mega-submenu-mobi .guide-nav li a {
  font-size: 14px;
  text-decoration: underline;
  color: #333;
  font-weight: 500;
  transition: color 0.2s ease;
}
.my-mega-submenu-mobi .guide-nav li a:hover {
  color: #CCCCCC;
}

/* 矢印アイコン（全項目に表示する場合） */
.my-mega-submenu-mobi .guide-nav li::after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 20px; 
  height: 20px;
  margin-left: 0.5rem;
  background: url("https://www.aichiskyexpo.com/neworganizer/wp-content/uploads/2025/02/buttonicon2-1.svg") no-repeat center;
  background-size: contain;
}
    /* 全体をフル幅にし、横スクロール可能にするためのラッパ */
    .breadcrumbase-wrap {
      width: 100%;
      overflow-x: auto;  /* 横にはみ出たらスクロールバー表示 */
    }

    /* 実際のパンくず本体（リスト）を横並びにする */
    .breadcrumbase {
      display: flex;
      /* 折り返ししないようにする（はみ出す分はscrollへ） */
      white-space: nowrap;
      list-style: none;
      margin: 0;
      padding: 0;
      font-size:13px;
    }

    /* PC(大画面)のときは右寄せ */
    @media screen and (min-width: 1025px) {
      .breadcrumbase {
        justify-content: flex-end; 
      }
    }

    /* タブレット・スマホ(1024px以下)のときは左寄せ */
    @media screen and (max-width: 1024px) {
      .breadcrumbase {
        justify-content: flex-start;
      }
    }

    /* li 要素に挟まる '>' を疑似要素で表示 */
    .breadcrumbase li + li::before {
      content: ">";
      margin: 0 8px;
      color: #666;
    }

    /* リンクのスタイル */
    .breadcrumbase a {
      color: #004097;
      text-decoration: underline; 
    }
    .breadcrumbase a:hover {
      text-decoration: underline; /* マウスオーバー時に下線 */
      color: #3370c7;
    }
    

    /* コンテナ */
.image-scroll-container {
  width: 100%;
  margin: 0 auto;
  overflow-x: hidden; /* 初期は横スクロール非表示 */
  box-sizing: border-box;
}

/* 画面幅が900px未満になったら横スクロールを有効化 */
@media (max-width: 900px) {
  .image-scroll-container {
    overflow-x: auto; /* コンテナ内でスクロール */
  }
}

/* 画像に最小幅を設定 => コンテナが900px未満でスクロールが必要になる */
.image-scroll-container img {
  display: block;       /* 余計な隙間をなくすため */
  min-width: 900px;     /* 900pxより小さく縮まらない */
  height: auto;
  /* 必要に応じて以下を調整:
     border: 1px solid #ccc;
     border-radius: 4px;
  */
}

    /* コンテナ */
.image-scroll-container {
  width: 100%;
  margin: 0 auto;
  overflow-x: hidden; /* 初期は横スクロール非表示 */
  box-sizing: border-box;
}

/* 画面幅が900px未満になったら横スクロールを有効化 */
@media (max-width: 900px) {
  .image-scroll-container {
    overflow-x: auto; /* コンテナ内でスクロール */
  }
}

/* 画像に最小幅を設定 => コンテナが500px未満でスクロールが必要になる */
.image-scroll-container img {
  display: block;       /* 余計な隙間をなくすため */
  min-width: 640px;     /* 500pxより小さく縮まらない */
  height: auto;
  /* 必要に応じて以下を調整:
     border: 1px solid #ccc;
     border-radius: 4px;
  */
}

  
/* コンテナ */
.overview-table-container {
  width: 100%;
  margin: 0 auto;
  /* 必要に応じてスクロールバー表示 */
  overflow-x: auto;
  box-sizing: border-box;
}

/* テーブル本体 */
.overview-table-conf,
.overview-table-confdata {
  width: 100%;
  min-width: 900px; /* 小さい画面でも横スクロールできるよう最小幅を指定 */
  border-collapse: collapse;
  font-size: 14px;
}

/* セルの基本スタイル */
.overview-table-conf th,
.overview-table-conf td,
.overview-table-confdata th,
.overview-table-confdata td {
  border: 1px solid #F5F6F9;
  padding: 10px;
  text-align: center;
  vertical-align: middle;
  width: 80px;
  /* ここで全セルを背景色#fffに */
  background-color: #fff !important;
}

/* ヘッダー行 */
.overview-table-conf thead th,
.overview-table-confdata thead th {
  background-color: #005bab !important; /* ヘッダー背景色 */
  color: #fff;              /* ヘッダー文字色 */
  font-weight: 500;
}

/* 左端セル（項目名） */
.overview-table-conf td:first-child {
  background-color: #EBEBEB !important;
  font-weight: 500;
  width: 200px !important;
}

.overview-table-conf td:nth-child(2) {
  width: 200px !important;
}



/* セルの基本スタイル */
.overview-table-confdata th,
.overview-table-confdata td {
  width: 50px !important;
}


/* 左端セル（項目名） */
.overview-table-confdata td:first-child {
  width: 100px !important;
}

.overview-table-confdata td:nth-child(2)
{
  width: 50px !important;
}
.overview-table-confdata td:nth-child(20),
.overview-table-confdata td:nth-child(21),
.overview-table-confdata td:nth-child(22)
{
  width: 80px !important;
}


.search-form {
  line-height: 1;
  position: relative;
  margin: 2em 0;
    display: flex;
    flex-wrap: nowrap;
    align-items: center; /* 垂直方向の整列 */
}
 
.search-field {
  box-sizing: border-box;
  width: 50%;
  padding: .75em;
  border: 1px solid #bbb;
  border-radius: 0;
  background-color: #efefef;
}
 
.search-submit {
  border: 1px solid #333 !important;
  background-color: #0175C0 !important;
  color:#ffffff !important;
  margin-left: 10px !important;
}
 
.search-submit:hover {
  opacity: .6;
}

search-form input[type="search"] {
    flex: 1;
    min-width: 0; /* 幅の自動調整 */
}
