@charset "utf-8";
/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap');

/* ========== INFORMATION タイトル ========== */
.info-title{
  width:100%;
  /* 基本の上下余白（必要に応じて --tight で詰める） */
  padding:100px 0 50px;
  background:url("../images/info-bg.jpg") center/cover no-repeat;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}

/* 上余白だけ詰めたい時に付ける補助クラス */
.info-title--tight{ padding-top:32px; }

/* 小見出し（新着情報） */
.info-sub{
  font-size:clamp(12px,1.4vw,14px);
  font-weight:700;
  letter-spacing:.15em;
  color:#fff;
  padding-bottom: 10px;
  margin:0;           /* 余白をゼロに */
  line-height:1;      /* 行間も詰める */
}

/* 大見出し（INFORMATION など） */
.info-main{
  position:relative;                 /* 擬似要素ラインの基準 */
  margin:0;                          /* h2 既定の余白リセット */
  padding:0;
  font-family:'Do Hyeon',sans-serif; /* 英字見出し用 */
  font-weight:400;                   /* Do Hyeon は 400 固定 */
  font-size:clamp(24px,3vw,36px);
  letter-spacing:.12em;
  line-height:1.1;                   /* 文字の上下をタイトに */
  color:#fff;
  display:inline-block;              /* PC で中央揃え維持 */
  text-align:center;
}

/* 左右のライン（PC） */
.info-main::before,
.info-main::after{
  content:"";
  position:absolute;
  top:50%;
  width:60px;
  height:2px;
  background:#fff;
}
.info-main::before{ left:-80px; }
.info-main::after { right:-80px; }

/* ========== モバイル最適化 ========== */
@media (max-width:768px){
  .info-title{ padding:60px 0 24px; }     /* モバイルは少しコンパクトに */

  .info-main{
    /* 文字と左右線を一列で中央揃えにする */
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    width:100%;
  }
  .info-main{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    width:80%;              /* ← スマホでは全体幅を80%に制限 */
    margin:0 auto;          /* ← 中央寄せ */
  }	
  .info-main::before,
  .info-main::after{
    position:static;        /* flex 子要素として扱う */
    flex:1 1 auto;          /* 線は残りスペースで自動伸縮 */
    min-width:24px;         /* 最低限の線幅を確保 */
    height:2px;
    background:#fff;
  }
}

/* ========== 背景コンテナ（INFORMATION 以降） ========== */
.bg-cont{
  background-image:url("../images/background-002.jpg");
  background-position:center top;
  background-repeat:repeat-y;
  background-size:100% auto;
  padding-bottom:24px;  /* フッター直前の余白を統一 */
}
/* 先頭要素の段差防止 */
.bg-cont > *:first-child{ margin-top:0; }

/* （必要なら）フッター上の余白を打ち消す */
.site-footer{ margin-top:0 !important; }