body {
  background-color: rgb(0, 22, 222);
 
}

.FV {
  width: 100%;
  height: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  aspect-ratio: 1280 / 832;
  position: relative;
  background-color: rgb(0, 22, 222);
}


/* アスペクト比維持のためのラッパー */
.ratio-wrapper {
  position: relative;
  width: 100%;
  padding-top: calc(832 / 1280 * 100%); /* アスペクト比 = 高さ ÷ 幅 */
}


.FV .div {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;

}

.FV .logo {
  position: absolute;
  width: 56.95%;   /* 729 / 1280 */
  height: 49.04%;  /* 408 / 832 */
  top: 25.48%;     /* 212 / 832 */
  left: 21.72%;    /* 278 / 1280 */
}

a,
a:visited,
a:hover,
a:active {
  color: inherit;       /* 親の色を引き継ぐ */
  text-decoration: none; /* アンダーラインも消す（必要なら） */
}

.FV .LEFT {
  position: fixed;
  width: 24%;
  height: 100%;
z-index: 2;
  left: 0; 
}

.FV .CENTER {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 76%;
  background-color: #000000;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 1;
  border-top: 2px solid rgb(0, 22, 222);
  border-bottom: 2px solid rgb(0, 22, 222);
 pointer-events: auto;
}

.FV .UP, .FV .DOWN{
  position: fixed; 
  left:0; 
  width:100%; 
  height:0svh; 
 
  z-index: -1;
}

.FV canvas.fv-noise{
  mix-blend-mode: screen; /* 黒地でも粒が立つ */
  opacity: .18;           /* お好みで .12〜.25 */
}

.FV .MENU{
  position:absolute;                 /* ← relativeに統一（anchor用） */
  top: calc(12% );
  left:0;             /* ← 無効化していた指定は削除 */
  display:flex; 
  flex-direction:column; 
  align-items:flex-start;
}

/*******/
/* 十字アイコン本体 */
.FV .menu-icon {
  position: relative;
  width: 40px;
  height: 40px;
  background-color: #0016de;
  flex-shrink: 0;
  cursor: pointer;
}

/* 横線（ホバー時だけ表示） */
.FV .menu-icon span:nth-child(1) {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0%;
  height: 2px;
  background-color: black;
  transform: translate(-50%, -50%);
  transition: width 0.3s ease;
}

/* 縦線（ホバー時だけ表示） */
.FV .menu-icon span:nth-child(2) {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 0%;
  background-color: black;
  transform: translate(-50%, -50%);
  transition: height 0.3s ease;
}

/* デフォルト：斜め線（X）を表示 */
.FV .menu-icon::before,
.FV .menu-icon::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 137%;
  height: 2px;
  background-color: black;
  transform-origin: center;
  opacity: 1;
  transition: width 0.3s ease, opacity 0.2s ease;
}

/* ／斜め線 */
.FV .menu-icon::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* ＼斜め線 */
.FV .menu-icon::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

/* ホバー時：Xを非表示（opacity: 0）、+を表示（縦横線） */
.FV .menu-icon:hover::before,
.FV .menu-icon:hover::after {
  width: 0%;
  opacity: 0;
}

.FV .menu-icon:hover span:nth-child(1) {
  width: 100%;
}

.FV .menu-icon:hover span:nth-child(2) {
  height: 100%;
}



/*******/

.FV .menu-list {
  position: absolute;   /* ← 追加 */
  top: 100%;            /* menu-icon の下に */
  left: 0;              /* menu-icon の左に揃える */
  margin-top:15px;    /* そのまま維持 OK */
  padding: 0px 0px;
  display: none;
  flex-direction: column;
  gap: 0px;
  color: rgb(0, 0, 0);
  font-size: 18px;
  line-height: 1;
  text-align: left;
  min-width: auto;
  font-family: lores-9-narrow, sans-serif;
  font-weight: 700;
  font-style: normal;
}

.FV .menu-list li {
  background-color: rgb(0, 22, 222);
  
  margin-bottom: 15px;        /* ← 間に余白を作る */
  padding: 0px 0px 1px;
  color: black;
  list-style: none;           /* li の●マークを消す */
  width: max-content;         /* 内容に合わせる。必要に応じて固定幅でもOK */
}

.FV .menu-list li:last-child {
  margin-bottom: 0;           /* 最後だけ余白なしに */
}
.FV .menu-list .glitch-text { pointer-events: none; }

/* 表示時 */
.FV .menu-list.active {
  display: flex;
}

.glitch-text {
  display: inline-block;
  transition: all 0.2s ease;
  font-family: inherit;
  font-weight: inherit;
}

.glitch-text.active {
  color: #0016de;
}

.FV .property-default {
  position: relative;
  width: 40px;
  height: 40px;
  top: 30px;
  left: 30px;
  background-color: rgb(0, 22, 222);
}

.FV .group {
  height: 40px;
}

.FV .overlap-group {
  position: relative;
  width: 40px;
  height: 40px;
}


/* UPとDOWN: 高さ100px, 幅1280px（100%） */


.FV .UP,
.FV .DOWN {
  position: fixed;
  width: 100%;
  height: 12%;  /* 100 / 832 */
  background-color: #000;
  left: 0;
}

.FV .UP {
  top: 0;
}

.FV .DOWN {
  bottom: 0;
}

/* 線：高さ比率維持 */
.FV .line-2,
.FV .line-3 {
  position: absolute;
  width: 100%;
  height: 2px;  /* 2 / 832 */
  left: 0;
  background-color: #0016de;
}

.FV .line-2 {
  bottom: 0;
}

.FV .line-3 {
  top: 0;
}

/********** BGLG ***********/
/* 背景動画 */
#news-bg-video {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  pointer-events: none;
}

.FV .bglg {
  position: relative;
  width: 100%;
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-top: #0016de 2px;
  border-bottom: #0016de 2px;
  z-index: 1;
  display:flex; white-space: nowrap;
}

.FV .bglg_up,
.FV .bglg_down {
  background-repeat: repeat-x;
  background-size: auto 100%;
  position: relative;
  width: 100%;
  height: 12%; /* 上下帯の高さを揃える */
  background-color: rgb(0, 22, 222);
  flex-shrink: 0;
}

/* スクロールコンテンツを配置するエリア */
.FV .bglg_content {
  flex: 1;
  overflow-x: auto;
  scroll-snap-align: start;
  overflow-y: hidden;
  display: flex;
  gap:30px;
  padding-left: 12%;
  padding-top: 30px;
  padding-bottom: 30px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  pointer-events: auto;
  white-space: nowrap;
}

/* 横並びの各アイテム（例） */
.FV .bglg_item {
  width: 60%;
  height: 100%;
  background: rgb(0, 22, 222);
  flex-shrink: 0;
  position: relative;   /* オーバーレイ配置の基準 */
  overflow: hidden;     /* はみ出した画像をクリップ */
  border: #0016de solid 2px;
  
}

.FV .bglg_item > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;      /* 全面フィット（必要なら contain に変更） */
  object-position: center;
  display: block;
  z-index: 0;
}

/* ---- 画像上のテキストレイヤ（縦センター／横いっぱい） ---- */
.FV .bglg_item > p {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
  margin: 0;
  padding: 0 0;              /* 基本は0、座布団側で余白付ける */
  display: flex;
  flex-direction: column;
  align-items: flex-start;   /* 横は左に詰める（中央にしたいなら center） */
  gap: 0.25em;               /* p1 と p2 の間隔 */
  pointer-events: none;      /* クリック可能にしたいなら外す */
  z-index: 2;
}

/* ---- テキスト座布団（文字長に追従） ---- */
/* p1/p2 は <p> の内側にあるので子孫セレクタに修正 */
.FV .bglg_item p1,
.FV .bglg_item p2 {
  display: inline-block;               /* 文字分だけ幅を持たせる */
  background-color: rgba(0,22,222);     /* 真っ黒座布団（半透明なら 0.85 など） */
  color: #fff;
  line-height: 1.05;                   /* 文字の上下詰め */
  box-decoration-break: clone;         /* 複数行でも行ごとに座布団（対応ブラウザで有効） */
  -webkit-box-decoration-break: clone;
}

/* ---- フォント指定：p1 と p2 を個別に ---- */
.FV .bglg_item p1 {
  font-family: "lores-15", sans-serif;
  font-weight: 700;
  font-style: normal;

  /* サイズは自由に：固定か clamp か選んでください */
  padding-top: 2.5px;
  padding-left: 3px;
  padding-right: 2px;
  font-size: 20px;
  letter-spacing: -0.5px;   /* お好みで */
  isolation: isolate;
}

.FV .bglg_item p2 {
  font-family: "DotGothic16","yu-gothic-pr6n", "Noto Sans JP", sans-serif;
  font-weight: 100;
  font-size: 50px; /* p1 より大きく */
  letter-spacing: 2px;
  padding-bottom: 6px;
}

/* 既存の過激な設定を打ち消し（もし残っていたら） */
.FV .bglg_item > p1,
.FV .bglg_item > p2 {
  all: unset;
}

/* ホバー時のテキスト反転 */
.FV .bglg_item:hover p1,
.FV .bglg_item:hover p2 {
  background-color: #000000; /* 反転背景（白） */
  color: rgb(0, 22, 222); /* 反転文字色（青） */
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* ホバー時の画像を青モノクロ化 */
.FV .bglg_item:hover > img {
  filter: grayscale(100%) brightness(1.1) contrast(1.1)
          sepia(100%) hue-rotate(190deg) saturate(400%);
  transition: filter 0.4s ease;
}

/* 通常状態にもスムーズな戻りを設定 */
.FV .bglg_item > img,
.FV .bglg_item p1,
.FV .bglg_item p2 {
  transition: filter 0.4s ease, background-color 0.3s ease, color 0.3s ease;
}


/*********/
/* スクロールバーのカスタマイズ（Webkit系: Chrome, Safariなど） */
.FV .bglg_content::-webkit-scrollbar {
  height: 8px; /* 横スクロールバーの高さ */
}

.FV .bglg_content::-webkit-scrollbar-track {
  background: #000; /* バーの背景色 */
  border-radius: 0px;
}

.FV .bglg_content::-webkit-scrollbar-thumb {
  background: #0016de; /* スクロールつまみの色 */
  border-radius: 0px;
}

.FV .bglg_content::-webkit-scrollbar-thumb:hover {
  background: #0016de; /* ホバー時の色 */
}

/* Firefox用 */
.FV .bglg_content {
  scrollbar-width: thin;
  scrollbar-color: #0016de #000;
}

/*********/


/* === FV 背景用レイヤ（HTML追加なし/JSで生成） === */
/* FV 背景レイヤの最終積層（全体ノイズを上面に） */
.FV .CENTER .fv-bg-wrap{ position:absolute; inset:0; pointer-events:none; }
.FV .CENTER canvas.fv-bg{ position:absolute; inset:0; width:100%; height:100%; z-index:0; image-rendering:pixelated; pointer-events:none; }
.FV .CENTER canvas.fv-noise{ position:absolute; inset:0; width:100%; height:100%; z-index:2; mix-blend-mode:screen; opacity:.18; pointer-events:none; }
.FV .bglg{ position:relative; z-index:1; }


/* ==== MERGED FINAL: FV root background layers (.FV / .fv) ===================== */
/* 背景は .FV 直下に敷く（CENTERの内側ではなく“後ろ”）。left MENU が常に前面に見えるように調整 */

/* 既存の CENTER 直下に作った古いラップがあっても見えないように無効化（保険） */
.FV .CENTER .fv-bg-wrap { display: none !important; }

/* ルートの積層とクリック透過 */
.FV, .fv { position: relative; }
.FV .fv-bg-wrap, .fv .fv-bg-wrap {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0; /* 背景のベース */
}

/* 背景画像（モザイク）を描画するキャンバス */
.FV canvas.fv-bg, .fv canvas.fv-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  image-rendering: pixelated;
  z-index: 0; /* 最背面 */
}

/* 全体ノイズは画面に薄く“上から”乗せる（青/黒の上でも見える） */
.FV canvas.fv-noise, .fv canvas.fv-noise {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: var(--fv-noise-opacity, .18);
  z-index: 5; /* CENTERより前に置くことで上下帯の上にも粒が乗る */
}

/* コンテンツ側の積層。LEFT MENU を最前に固定して見えなくならないようにする */
.FV .CENTER { position: fixed; z-index: 1; pointer-events: auto; }
.FV .LEFT   { position: fixed; z-index: 5; } /* MENU を常に前面へ */

/* ===== FV 背景レイヤ（.CENTERではなく .FV に敷く） ===== */


.FV { position: relative; } /* 念のため基準化（既に relative でもOK） */

/* 背景ラップ（.FV 全体に張る・クリック透過） */
.FV .fv-bg-wrap{
  position: absolute;
  inset: 0;
  z-index: 0;          /* 背景のベース */
  pointer-events: none;
}

/* 背景画像（モザイクを描画するcanvas） */
.FV canvas.fv-bg{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  image-rendering: pixelated; /* ブロック感を保つ */
  z-index: 0;
}

/* 全体ノイズ（青地でも見えるよう screen 合成） */
.FV canvas.fv-noise{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: var(--fv-noise-opacity, .18); /* 濃さはここで調整 */
  z-index: 1; /* 背景画像よりは上、コンテンツよりは下 */
}

/* コンテンツを常に前面に保つ（MENUも含む） */
.FV .CENTER{ z-index: 2; pointer-events: auto; }  /* position は既存値のまま */
.FV .LEFT  { z-index: 5; }                        /* MENU を前面に固定 */

/* もし過去に .CENTER 直下へ背景を作っていた場合は無効化（保険） */
.FV .CENTER .fv-bg-wrap{ display: none !important; }


/* === SP overrides (≤ 768px) ===================================== */
@media (max-width: 768px) {
  :root{
    --sp-pad: clamp(12px, 4vw, 20px);
    --hit: 44px; /* 最小タップ領域 */
  }

  html, body { height: 100%; }
  body { font-size: clamp(14px, 3.5vw, 16px); line-height: 1.6; 
  background-color: #000000;}

  /* iOSノッチ対応 */
  .app, body {
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
  }

  /* ===== FV（背景動画/画像） ===== */
  .FV{
    position: relative;
    min-height: 100%;   /* ツールバー縮小時に安定 */
    height: 100%;
    aspect-ratio: auto;   /* PCの固定比率はSPで解除 */
    overflow: clip;
    background-color: #000000;
    
    }

      /* レイヤー内枠 */
  .FV .div {
    position: absolute;
    inset: 0;
  }

    /* 中央フレーム（NEWSと同寸・同枠線） */
    .FV .CENTER{
      position: relative;
      top: 50%; left: 50%; transform: translate(-50%,-50%);
      width: 100%;
      height: 100%;
      display: flex; 
      align-items: 
      center; 
      justify-content: center; 
      flex-direction: column;
      gap: 0px;
      border-top: 0px solid rgb(0,22,222);
      border-bottom: 0px solid rgb(0,22,222);
      
    }

/* ===== 上下帯 ===== */
    /* 上下帯 */
.FV .UP, .FV .DOWN{
  position: fixed; 
  left:0; 
  width:100%; 
  height:50px; 
  background:rgba(0, 0, 0,0);
  z-index: 1;
  color:#0016de;
  display: flex;
  align-items: center; 
  justify-content: center;  
}

.FV .DOWN p1 {
 text-align: static; 
 transform: none ;
 margin: 0;
 font:clamp(9px, 1vw, 10px); 
 font-family: lores-9-narrow, sans-serif;
 position: absolute;
 letter-spacing: 0.45rem;
 display: block;
}
/* ===== 上下帯 ===== */

.FV .UP{ top:0; } .FV .DOWN{ bottom:0; }
.FV .line-2, 
.FV .line-3{ position:absolute; 
  left:0; width:100%; height:2px; background:#0016de; }
.FV .line-2{ bottom:0; } .FV .line-3{ top:0; }


  /* ===== Menu ===== */
.FV .MENU{
  position:absolute;                 /* ← relativeに統一（anchor用） */
  top: 0;
  left:0;             /* ← 無効化していた指定は削除 */
  display:flex; 
  flex-direction:column; 
  align-items:flex-start;
}
.FV .menu-icon{
  position:relative; 
  aspect-ratio: 1 / 1; 
  width: auto;
  height: 50px;
  background-color: rgba(0, 0, 0,0);
  border: #0016de solid 2px;
  
  background-color: #000;
  display: grid; place-items: center;
  cursor:pointer; 
  flex-shrink:0;
  box-sizing: border-box;
}  
  .FV .menu-icon::before,
  .FV .menu-icon::after{
    content: none !important;
  }

  .FV .menu-icon span{
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%, -50%);
    transform-origin: 50% 50%;
    background: rgb(0,22,222);
    transition: none !important;  /* モーション不要なので無効化 */
    z-index: 1; 
  }

  /* ＋は最初から見せる：アニメ無効化＆フル長さに */
  .FV .menu-icon span:nth-child(1),
  .FV .menu-icon span:nth-child(2){
    transition: none !important;            /* 伸縮アニメ停止 */
  }
 .FV .menu-icon span:nth-child(1){ /* 横線 */
    width: 100%;
    height: 2px;
  }
  .FV .menu-icon span:nth-child(2){ /* 縦線 */
    width: 2px;
    height: 100%;
  }

  /* hover時の上書きも無効化（保険） */
  .FV .menu-icon:hover span:nth-child(1){ width: 100% !important; }
  .FV .menu-icon:hover span:nth-child(2){ height: 100% !important; }

/* ＋（初期状態） */
  .FV .menu-icon span:nth-child(1){ /* 横線 */
    width: 100% !important;
    height: 2px !important;
    rotate: 0deg;
    background:rgb(0, 22, 222);
  }
  .FV .menu-icon span:nth-child(2){ /* 縦線 */
    width: 2px !important;
    height: 100% !important;
    rotate: 0deg;
    background:rgb(0, 22, 222);
  }

  .FV .menu-icon.clicked span{
    width: 140% !important;  /* 右2px(border) + 左2pxのマージン相当を回避 */
    height: 2px !important;
  
  }
  .FV .menu-icon.clicked span:nth-child(1){
transform: translate(-50%, -50%) rotate(45deg);
  }
  .FV .menu-icon.clicked span:nth-child(2){
transform: translate(-50%, -50%) rotate(-45deg);
  }

  /* hover 上書きを無効化（SPのタップ時にブレないよう保険） */
  .FV .menu-icon:hover span:nth-child(1){
    width: 100% !important; height: 2px !important;
  }
  .FV .menu-icon:hover span:nth-child(2){
    width: 2px !important; height: 100% !important;
  }
  .FV .menu-icon.clicked:hover span{
    width: 140% !important; height: 2px !important;
  }

.FV .menu-list{
  position: fixed;
  top: calc(50px + env(safe-area-inset-top)); 
  bottom: calc(0px + env(safe-area-inset-bottom));
  left:0; 
  margin-top:0px;
  height: auto;
  display:none; 
  flex-direction:column; 
  justify-content: space-between;
  align-items: flex-start; 
  gap:0;
  color:#000; 
  font:700　lores-9-narrow,sans-serif; text-align:left;
  padding: 0;
  overflow-y: auto;              /* 中身が多い場合にスクロール */
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;  /* 背景までバウンドしない */
  z-index: 1002;   
}


.FV .menu-list.active{display:flex;}
.FV .menu-list li{
  list-style:none; 
  margin:0px 0 0px; 
  padding:0 0 1px;
  width:auto; 
  background:rgb(0, 22, 222); 
  color:rgb(0, 0, 0);
  border: #0016de solid 2px;
  font-size: clamp(28px, 7cqh, 68px);
}

 .FV .menu-list::after{
    content:"";
    display:block;
    height: 0svh;                  /* DOWNと同じぶんダミー余白を確保 */
  }

  @supports not (height: 1svh){
    .FV .menu-list{
      top: calc(6vh + env(safe-area-inset-top));
      bottom: calc(6vh + env(safe-area-inset-bottom));
    }
    .FV .menu-list::after{ height: 6vh; }
  }

  .FV .menu-list{
    /* 既存の position:fixed / top/bottom 等はそのまま活かしてOK */
    display: flex !important;            /* ← display:none は使わない */
    flex-direction: column;

    /* 初期は見えない（タップで可視化） */
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition:
      opacity .28s ease,
      visibility 0s linear .28s;
  }

  /* 2) メニューアイコンに .clicked が付いた時だけ表示
        （script.jsが .menu-icon に .clicked をトグル済み） */
  .FV .MENU .menu-icon.clicked ~ .menu-list{
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transition:
      opacity .28s ease,
      visibility 0s linear 0s;
  }



.FV .bglg {
  position: relative;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-top: #0016de 0px;
  border-bottom: #0016de 0px;
  z-index: 1;
}

  .FV .bglg_up,
.FV .bglg_down {
  background-repeat: repeat-y;
  background-size: 50px 100%;
  position: relative;
  width: 50px;
  height: auto; /* 上下帯の高さを揃える */
  background-color: rgb(0, 22, 222);
  flex-shrink: 0;
}

/* スクロールコンテンツを配置するエリア */
.FV .bglg_content {
  flex: 1;
  overflow-x: hidden;
  overflow-y: auto;
  scroll-snap-align: none;
  
  display: flex;
  flex-direction: column !important;
  gap:50px;
  padding-left: 48px;
  padding-right: 48px;
  padding-top: 48px;
  padding-bottom: 50px;
  
  scroll-snap-type: none;
  pointer-events: auto;
  white-space:normal;
}

/* 横並びの各アイテム（例） */
.FV .bglg_item {
  width: 100%;
  height: calc(100% - 2px);
  background: rgb(0, 22, 222);
  flex-shrink: 0;
  position: relative;   /* オーバーレイ配置の基準 */
  overflow: hidden;     /* はみ出した画像をクリップ */
  border: #0016de solid 2px;
}

/* ---- フォント指定：p1 と p2 を個別に ---- */
.FV .bglg_item p1 {
  font-family: "lores-15", sans-serif;
  font-weight: 700;
  font-style: normal;
  
  /* サイズは自由に：固定か clamp か選んでください */
  padding-top: 2.5px;
  padding-left: 3px;
  padding-right: 2px;
  font-size: 24px;
  letter-spacing: -0.5px;   /* お好みで */
  isolation: isolate;
}

.FV .bglg_item p2 {
  font-family: "DotGothic16","yu-gothic-pr6n", "Noto Sans JP", sans-serif;
  font-weight: 100;
  font-size: 40px; /* p1 より大きく */
  letter-spacing: 2px;
  padding-bottom: 6px;
}

}