html {overflow-x: hidden;} /* 横スクロール禁止 */

body {overflow-x: clip;}

body {
  font-family:
    "Yu Gothic",        /* Windows標準游ゴシック */
    "Yu Gothic Medium", /* Windows向け：かすれ防止 */
    "Hiragino Kaku Gothic ProN", /* macOS向け */
    Meiryo,             /* Windows fallback */
    sans-serif;         /* 最終フォールバック */
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 48px;
    width: 100%;
    margin:0;
    padding: 0;
}


/* ヘッダー */
.anniversary_header {
  width: 100%;
  background: rgba(255,255,255,0); /*#000;*/
}
.anniversary_header .header_inner {
  width: 100%;
  max-width: 1044px;
  padding: 48px 32px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 28px;
}
.anniversary_header .header_logo {
  /*width: 100px;
  margin: 0;*/
  width: 100%;
  max-width: 100px;
  height: auto;
  margin: 0;
}
.anniversary_header .header_logo img.w65 {width: 100px !important; max-width: 100px !important;}
.anniversary_header .header_txt {
  width: 183px;

 /* padding: 10px;
  margin: 32px 0 32px 20px;*/
}
.anniversary_header .header_txt._cn {
  width: 180px;
}
.anniversary_header .header_txt._en {
  width: 240px;
}

.anniversary_header .header_txt p {
  font-family: "Yu Gothic";
  font-size: clamp(14px, 1.3vw, 20px);/*20px;*/
  font-style: normal;
  font-weight: 500;
  line-height: 30px;
  grid-row: 1 / span 1;
  grid-column: 1 / span 1;
 color: #fff;
 /*font-weight: bold;*/
}
.anniversary_header .header_txt._cn p {width: 180px;}
.anniversary_header .header_txt._en p {width: 240px;}
.anniversary_header .header_line {
 width: 100%;
 max-width: 637px;
 color: #fff;
 margin-right: auto;
}
.anniversary_header .header_line div {
 width: 100%;
 max-width: 637px;
 background: #c11920;
 height: 1px;
 padding: 1px 0;
 text-align: left;
}

@media all and (max-width: 767px) {
.anniversary_header .header_inner {
 margin: 0 auto;;
 padding: 32px;
 gap: 16px;
}
.anniversary_header .header_logo {
  width: 80px;
  /*height: 28px;*/
  flex-shrink: 0;
  aspect-ratio: 20/7;
}
.anniversary_header .header_txt {
 width: 130px;
 margin-left: 10px;
}
.anniversary_header .header_txt._cn {
 width: 130px;
}
.anniversary_header .header_txt._en {
 width: 170px;
}
.anniversary_header .header_txt p {
 width: 130px;
 font-size: 14px;
 
}
.anniversary_header .header_txt._cn p {
 width: 150px;
}
.anniversary_header .header_txt._en p {
 width: 220px;
}
.anniversary_header .header_line {
 width: 100%;
 }
}


/* ---------------*/
.anniversary_title h2 {color: #c11920; text-align: center; font-family: "Shippori Mincho" !important; font-size: 40px; font-style: normal; font-weight: 600; line-height: 60px;  margin-bottom: 10px;}
/*.anniversary_title h2 {padding: 20px 30px; margin: 1em auto; color: #c11920;}*/
.anniversary_title p {font-size: 20px; color: #000; font-family: "Yu Gothic" !important; font-weight: 700; line-height: 30px; margin-bottom: 31px;}
.anniversary_title .subTitle {font-size: 20px; color: #000; line-height: 1.2;}
.anniversary_title .titleBox {width:100%; max-width: 980px; padding: 0 1em; margin: 0 auto; background: #f5f5f5;}


.snsTable {margin-left: auto; margin-right:0; width: 400px;}

@media all and (min-width: 1441px) {
.anniversary_mainv_inner {width: 2350px; height: 1120px; max-width: 100vw; overflow: hidden; margin: 0 auto;}
.anniversary_mainv_image {max-width: 2350px !important; height: 1120px; margin: 0 auto; object-fit: cover;}
._mainv_image_fullon {display: block;}
._mainv_image_pcon {display: none;}
}

@media all and (min-width: 768px) and (max-width: 1440px){
.anniversary_mainv_inner {width: 100vw; max-width: 1440px; margin: 0 auto;} 
.anniversary_mainv_image {width: 100vw; max-width: 1440px; margin: 0 auto;}
._mainv_image_fullon {display: none;}
._mainv_image_pcon {display: block;}
}
@media all and (max-width: 767px) {
._mainv_image_fullon {display: none;}
._mainv_image_pcon {display: block;}
}
@media all and (max-width: 742px) {
.anniversary_mainv_inner {width: 768px; height: 812px; max-width: 100vw; overflow: hidden;}
.anniversary_mainv_image {width: 100%; height: 100%; object-fit: cover;}
}


/* パンくず幅調整 */
.pnav_inner {width: calc((30px * 2) + 1440px);}　/* 1280px から 1440pxへ*/

.imgContainer_inner[data-inner="wide"] {max-width: 1440px;}

@container (min-width: 461px) {       /* 461px から 666pxへ */
.imgContainer_inner {flex-direction: column; align-items: center;}
}

@container (min-width: 666px) {       /* 461px から 666pxへ */
.imgContainer_inner {flex-direction: row; align-items: flex-start;}
.imgContainer_inner._reverse {flex-direction: row-reverse;}
}

/* ボタン */
.btnBox-red {
         margin: 0.5em auto;
         padding: 0 1em;
         width: 100%; 
         color: #fff; 
         background-color: #c33;
         border: 2px solid #c33; 
         border-radius: 10px; 
}

.btnBox-blue {
         margin: 0.5em auto;
         padding: 0 1em;
         width: 100%; 
         color: #fff; 
         background-color: #338bcc;
         border: 2px solid #338bcc; 
         border-radius: 10px; 
}

.btnBox-gray {
         margin: 0.5em auto;
         padding: 0 1em;
         width: 100%; 
         color: #fff; 
         background-color: #666; 
         border: 2px solid #666; 
         border-radius: 5px; 
}



/*クロスさせて滑らかに交差フェード切替*/
.crossfade {
  position: relative;
  height: 2.2em;
  display: grid;
  place-items: center;
}

.crossfade span {
  position: absolute;
  opacity: 0;
  animation: xfade 12s ease-in-out infinite;
}

.crossfade .a { animation-delay: 0s; }
.crossfade .b { animation-delay: 6s; } /* ちょうど半周で入替え */

@keyframes xfade {
  0%   { opacity: 0; }
  10%  { opacity: 1; }  /* フェードイン */
  40%  { opacity: 1; }  /* 表示 */
  50%  { opacity: 0; }  /* フェードアウト */
  100% { opacity: 0; }
}
.crossfade-AB {
  position: relative;
  height: 2.2em;          /* テキストの高さを確保（レイアウトのガタつき防止） */
  display: grid;
  place-items: center;     /* 中央揃え */
  overflow: hidden;        /* 念のため */
  isolation: isolate;      /* 混色防止（重なり時のアンチエイリアス崩れ対策） */
}

.crossfade-AB > span {
  position: absolute;
  left: 0; right: 0;
  text-align: center;
  opacity: 0;
  /* 見た目はお好みで調整してください */
  /*font: 700 1.25rem/1.2 system-ui, -apple-system, "Segoe UI", Roboto, "Hiragino Sans", "Noto Sans JP", sans-serif;*/
  color: #111;
  will-change: opacity;    /* モバイルでの安定化 */
}

.crossfade-AB._en > span {text-align: left;}

/* タイムラインは合計 18s＝(6s保持 + 3sフェード)×2 */
.crossfade-AB .A {
  animation: Acycle 18s linear infinite both;
  z-index: 2; /* 重なりの見え方を安定（なくてもOK） */
}
.crossfade-AB .B {
  animation: Bcycle 18s linear infinite both;
  z-index: 1;
}

/* === A のタイムチャート（18s 全体に対する割合） ===
   0%   〜 33.333% : 不透明(保持 6s)
   33.333%〜 50%   : フェードアウト(3sで0へ)  ← Bが同時にIN
   50%  〜 83.333% : 透明(休止 6s)            ← この間 B が保持
   83.333%〜100%   : フェードイン(3sで1へ)    ← Bが同時にOUT
*/
@keyframes Acycle {
  0%        { opacity: 1; }
  33.333%   { opacity: 1; }
  50%       { opacity: 0; }
  83.333%   { opacity: 0; }
  100%      { opacity: 1; }
}

/* === B のタイムチャート（Aの逆相） ===
   0%   〜 33.333% : 透明(休止 6s)
   33.333%〜 50%   : フェードイン(3sで1へ)  ← Aが同時にOUT
   50%  〜 83.333% : 不透明(保持 6s)
   83.333%〜100%   : フェードアウト(3sで0へ) ← Aが同時にIN
*/
@keyframes Bcycle {
  0%        { opacity: 0; }
  33.333%   { opacity: 0; }
  50%       { opacity: 1; }
  83.333%   { opacity: 1; }
  100%      { opacity: 0; }
}

/* 動きを減らすユーザー設定への配慮（任意だが推奨） */
@media (prefers-reduced-motion: reduce) {
  .crossfade-AB > span {
    animation: none !important;
  }
  .crossfade-AB .A { opacity: 1; }
  .crossfade-AB .B { display: none; }
}


/* 縦書きテキスト */
.vertical-text {
    writing-mode: vertical-rl; /* 縦書き（右から左へ） */
    text-orientation: upright; /* 文字を直立させる */
    padding: 10px;
    width: 11vw;
    height: clamp(340px, calc((270 / 672) * (100vw - 768px) + 340px), 630px); /*38em;*/
    display: flex;                    /* Flexboxで縦方向制御 */
    align-items: flex-start;          /* 上寄せ */
}
.vertical-text._en {
    width: 100%;
    text-align: left;
    writing-mode: horizontal-tb;
    text-orientation: mixed;
}

.vertical-text span {
    line-height: 1.6;
    letter-spacing: 0.3em;
    font-size: clamp(40px, 2.77vw, 48px);
    line-height: clamp(45px, 3.125vw, 54px);
    color: #fff;
    text-align: center;
    font-feature-settings: 'vert' on;
    font-family: "Yu Gothic";
    font-style: normal;
    font-weight: 700;
}

.vertical-text._en span {text-align: left; line-height: 1.4; letter-spacing: normal;}

.vertical-text span ._txtCombine {
    text-combine-upright: all;
    /*padding: 0 0 10px;*/
    padding-bottom: clamp(6px, 6px, 10px);
    margin-bottom: clamp(3px, 3px, 5px);
}

@media all and (min-width: 1441px) {
.vertical-text {
    width: 158.4px;
}
.vertical-text span {
    font-size: 48px;
    font-family: "Yu Gothic";
    font-style: normal;
    font-weight: 700;
    latter-spacing: 0.25em;
    line-height: 1.75;
}
.vertical-text._en span {text-align: left; line-height: 1.4; letter-spacing: normal;}

}

@media all and (min-width: 768px) and (max-width: 1440px) {
.vertical-text {
    width: 11vw;
}

.vertical-text span {
    font-size: clamp(26px, calc((22px / 672px) * (100vw - 768px) + 26px), 48px);
    font-family: "Yu Gothic";
    font-style: normal;
    font-weight: 700;
    latter-spacing: 0.25em;
    line-height: 1.75;
}
.vertical-text span ._txtCombine {
    padding-bottom: clamp(6px, 6px, 10px);
    margin-bottom: clamp(3px, 3px, 5px);
}

}

@media all and (min-width: 743px) and (max-width: 767px) {
vertical-text { /*width: 24vw;*/
    height: clamp(360px, calc((270 / 672) * (100vw - 743px) + 360px), 630px); 
    }
.vertical-text span {
    font-size: 26px; /*clamp(26px, calc((22px / 672px) * (100vw - 768px) + 26px), px);*/
    }
}


@media all and (max-width: 742px) {
.vertical-text { width: clamp(12vw, calc(12vw + (742px - 100vw) * (12 / 367) + 33px), 27vw);
    height: 580px;/*clamp(580px, calc((270 / 672) * (100vw - 375px) + 380px), 380px); */
    }
.vertical-text span {
    font-size: 40px; /*clamp(26px, calc((22px / 672px) * (100vw - 768px) + 26px), 40px);*/
    line-height: 45px;
    height: 
    }
.vertical-text._en span {
    font-size: clamp(16px, calc((16px / 672px) * (100vw - 742px) + 26px), 26px);
    }
}






/* 画像上にテキスト */
._info {
   position: relative;
}

._infoText {
   position: absolute;
   top: 50%; /*位置を指定します*/
   left: 50%;
   
   transform: translate(-50%, -50%); /* 中央寄せ */
   display: flex;
   /* flex-direction: column;*/ /* 縦に並べる */
   /* align-items: center;*/ /* 横方向中央 */
   /* text-align: center;
   
   padding: 3px 10px;
   font-weight: bold;*/
   
   gap: 30px; /* 2行の余白 */

  writing-mode: vertical-rl;
  text-orientation: upright;
   
   
}
._infoText._en {
  top: 65%;
  left: 60%;
  writing-mode: horizontal-tb;
  text-orientation: mixed;
}


._infoText._en span {font-family: 'Open Sans' !important;}
._infoText._cn span {font-family: 'Noto Sans SC' !important;}


._infoImg {
   position: absolute;
   bottom: 10%; /*位置を指定します*/
   left: 50%;
   
   transform: translate(-50%, 50%); /* 中央寄せ */
   display: flex;
    flex-direction: column; /* 縦に並べる */
    align-items: center; /* 横方向中央 */
    text-align: center;
   padding: 3px 10px;
}

._info img {
   width: 100%;
}

._infoImg img {
   max-width: 160px;
   width: clamp(102px, 11.11vw, 160px);
}

/*--  Statement Section    --*/
.wrapper.statement_inner {margin-bottom: 100px;}

.statement_inner p {
 width: 95%;
 max-width: 460px;
 font-family: "Yu Gothic";
 font-size: 16px;
 font-style: normal;
 font-weight: 700;
 line-height: 48px;
 margin: 0 auto 0 40px;
 padding-right: 20px;
}

.statement_inner p._en {font-family: 'Open Sans' !important;}
.statement_inner p._cn {font-family: 'Noto Sans SC' !important;}



@media all and (max-width: 767px) {
.statement_inner p {width: 100%; margin: 0 auto; padding: 0;}

}


    .wrapper {
      max-width: 1440px;
      margin: 0 auto;
    }

    .split {
      display: flex;
      flex-direction: row;
      gap: 40px;
    }

    .split._reverse {
      display: flex;
      flex-direction: row-reverse;
      gap: 40px;
    }

    /* 左カラム（画像＋sticky） */
    .split-left {
      flex: 1;
    }

    .split-left-inner {
      position: sticky;
      top: 40px; /* 追従位置 */
    }

    .split-left img {
      width: 100%;
      height: auto;
      display: block;
    }

    /* 右カラム（スクロールするテキスト） */
    .split-right {
      flex: 1;
      padding-right: 20px;
    }

    /* スマホ：縦並びにして sticky を解除 */
    @media (max-width: 767px) {
    .split, .split._reverse {
        flex-direction: column;
        padding: 24px 0 32px;
        gap: 24px;
      }

    .split-left-inner, .wrapper .split-left-inner {
        position: static; /* sticky 無効化 */
      }
    .split-right {
      padding: 0 32px;
      }
    }
 



/*--  Statement Section    //--*/


/*--  Message Section    --*/
.wrapper.message_inner {margin-bottom: 90px;}

.message_inner p {
 width: 95%;
 max-width: 460px;
 font-family: "Yu Gothic";
 font-size: 16px;
 font-style: normal;
 font-weight: 700;
 line-height: 32px;
 margin: 0 10px 16px auto;
 padding-left: 10px;:
}

._cnNSS {font-family: 'Noto Serif SC' !important;}
.message_inner p._en {font-family: 'Open Sans' !important;}
.message_inner p._cn {font-family: 'Noto Sans SC' !important;}
.message_inner p span._en {font-family: 'Open Sans' !important;}
.message_inner p span._cn {font-family: 'Noto Sans SC' !important;}

.message_inner table {
 width: 100%;
 max-width: 480px;
 margin: 0 0 16px auto;
}

.message_inner table img {padding-top: 16px;}

.message_inner table p {
 padding-left: 24px;
 margin: 0;
 width: 100%;
}

@media all and (max-width: 767px) {
.message_inner p {width: 100%; margin: 0 auto 16px; padding: 0;}
.message_inner figure img._photo { margin: 32px 0 16px; max-width: 460px;}
}

/*--  Message Section    //--*/


/*--  NEWS Section  --*/
.news_container {margin: 0 0 80px;}


@media all and (min-width: 768px) {
.news_inner._sp {display: none; width: 100%;}
}

@media all and (max-width: 767px) {
.news_inner._pc {display: none;}
.news_title_sp p {text-align: center;}

.news_items {width: 100%; max-width: 504px; margin: 0 auto;}
.news_item {width: 87%; min-width: 278px; max-width: 460px; min-height: 282px; max-height: 360px; aspect-ratio: 6 / 5; margin: 10px 22px; box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.15);}
.news_item:hover {box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25); transform: translateX(-4px); transform: translatey(-4px); transition: transform 200ms ease, box-shadow 200ms ease; will-change: transform;}

.news_item p {margin: 20px 20px 0;
  font-family: "Yu Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  align-self: stretch;
 }
.news_item p+p {margin: 10px 18px 0;
  font-family: "Yu Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  align-self: stretch;
 }
.news_item p a {
   text-decoration-line: underline;
   text-decoration-style: solid;
   text-decoration-skip-ink: auto;
   text-decoration-thickness: auto;
   text-underline-offset: auto;
   text-underline-position: from-font;
 }
}


  :root {
    --ns_maxw: min(100%, 1440px);
    --ns_gap: 26px;
    --ns_ms: 350ms;
    --ns_btn: 64px;
    --ns_panel-bg: #f5f5f7;
    --ns_ctrl-bg: #ffffff;
    --ns_ctrl-accent: #111;
  }

  /* 全体の2カラム（1:4） */
  .news_carousel-shell {
    width: var(--ns_maxw);
    height: 420px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 4fr; /* 1:4 */
    gap: 16px;
    align-items: stretch;
  }

  /* 左：矢印置き場 */
  .news_control-panel {
    background: var(--ns_ctrl-bg);
  /*  border-radius: 12px; */
    padding: 12px;
    display: grid;
    grid-template-rows: 1fr auto 1fr; /* 中央配置 */
    color: var(--ns_ctrl-accent);
   /* box-shadow: 0 1px 2px rgba(0,0,0,.06);*/
    position: relative;
    width: 368px;
    min-height: 220px;
  }
  .news_title {
   width: 149px;
   margin: 76px 1px 0 auto;
  }
  .news_title h2 {text-align: left;}
  .news_title p {margin-bottom: 37px ;}
  .news_control-panel .news_buttons {
    display: inline-flex;          /* ← grid から inline-flex に */
    align-items: center;
    justify-content: center;
    gap: 0;                        /* セパレーター幅で間隔を管理するため 0 に */
    margin: 0 16px 0 auto;
  }

  .news_ctrl {
    width: var(--ns_btn); height: var(--ns_btn);
    border: none; /*border-radius: 50%;*/
    background: rgba(0,0,0,0); color: #ccc;
    display: grid; place-items: center;
    cursor: pointer;
  }
  .news_ctrl:hover, .news_ctrl:focus-visible {
   /* background: rgba(0,0,0,.6);*/ color: #c11920;
   /* outline: 2px solid rgba(0,0,0,.15);
    outline-offset: 2px;*/
  }
  .news_ctrl svg { width: 13.89px; height: 26.37px; pointer-events: none; }/*width: 64px; height: 64px;*/


/* ボタンの左右余白（セパレーターに接しないよう少し離す） */
.news_ctrl.news_prev { margin-right: 8px; }
.news_ctrl.news_next { margin-left: 8px; }

.news_ctrl.news_prev, .news_ctrl.news_next { color: #000; background: transparent;}
.news_ctrl.news_prev:hover, .news_ctrl.news_next:hover { color: #c11920; background: transparent;}
.news_ctrl.news_prev:active, .news_ctrl.news_next:active { color: #c11920; background: transparent;}

/* 縦線（セパレーター） */
.v-sep {
  width: 2px;
  height: calc(var(--ns_btn) * 0.5);        /* ボタンの 80% 高さの縦線 */
  margin-left: 10px;
  background: #ccc; /*rgba(0,0,0,1);*/
}
._v-sep{width: 1px; height: 30px;}


  /* 右：カルーセル本体 */
  .news_carousel {
    margin-top: 0 !important;
    background: #fff; /*var(--ns_panel-bg);*/
    border-radius: 12px;
    position: relative;
    padding: calc(var(--ns_gap) / 2);
    overflow: hidden;
  }
  .news_viewport {
    width: 100%;
    height: 362px;/*100%;*/
    box-sizing: border-box;
    position: relative;
  }

  .news_track {
    display: flex;
    gap: var(--ns_gap);
    transition: transform var(--ns_ms) ease;
    will-change: transform;
    user-select: none;
    touch-action: pan-y;
  }

  /* 常時3枚 */
  .slide {
    flex: 0 0 calc((100% - var(--ns_gap) * 2) / 3);
    /*border: 2px solid #ccc;*/
  }
  .slide, .news_item {box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.15);}
  .slide .news_card_txt .aLink, .news_item .aLink {color: #000;}
  .slide:hover, .news_item:hover {box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25);}
  .slide:hover .news_card_txt .aLink, .news_item:hover .aLink {color: #c11920;}
  .slide:hover {transform: translateX(-4px); transform: translatey(-4px); transition: transform 200ms ease, box-shadow 200ms ease; will-change: transform;}
  .slide a {position: relative; z-index: 1; pointer-events: auto;}

  /* 正方形カード */
  .news_card {
    width: 100%;
    height: 203px;
   /* aspect-ratio: 1 / 1;*/
    position: relative;
    overflow: hidden;
    border-radius: 3px;
    background: #fff;
    margin: 0;
  }
  .news_card > img {
    position: absolute;
    inset: 0;
    width: 368px; height: 203px;
    object-fit: cover;
    display: block;
  }

  .news_card_txt {
    padding: 1em;
    width: 360px;
    height: 159px;

  }

  .news_card_txt p {
    font-family: "Yu Gothic";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 0 !important;
  }

  .news_card_txt p+p {margin-top: 10px;}

  .news_card_txt p a {
   /*color: #C11920;*/
   text-decoration-line: underline;
   text-decoration-style: solid;
   text-decoration-skip-ink: auto;
   text-decoration-thickness: auto;
   text-underline-offset: auto;
   text-underline-position: from-font;
  }

  /* ステータス */
  .news_status {
    position: absolute; right: 12px; bottom: 12px;
    background: rgba(255,255,255,.85);
    color: #111; padding: 4px 8px; border-radius: 999px;
    font-size: 12px; line-height: 1;
  }

  /* スクリーンリーダー用 */
  .sr-only {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0);
    white-space: nowrap; border: 0;
  }

  /* 2カラム→1カラム（左のボタンを移動） */
  @media (max-width: 767px) {
    .news_carousel-shell { grid-template-columns: 1fr; }
    .news_control-panel {
      grid-template-rows: auto;
      grid-auto-flow: column;
      grid-auto-columns: max-content;
      justify-content: center;
      gap: 12px;
      min-height: unset;
    }
    .news_control-panel .news_buttons {
      grid-auto-flow: column;
      grid-auto-columns: max-content;
      display: inline-grid;
      grid-template-rows: none;
      grid-template-columns: repeat(2, max-content);
    }
  }

/* 767px 以下で縦並びの見た目に */
@media (max-width: 767px) {
  .news_track {
    flex-direction: column; /* 縦スタック */
  }
  .slide {
    /* 横幅を全幅に、正方形カードは維持（.cardのaspect-ratioで正方形） */
    flex: 0 0 auto;
    width: 100%;
  }
}

  @media (prefers-reduced-motion: reduce) {
    .news_track { transition: none; }
  }






/*--  NEWS Section  //--*/


/*--- Pickup Section ---*/
.infor_container {
  width: 100%;
  max-width: 980px;
  margin: 0 auto 80px;
  display: flex; /* 横並びにする */
  gap: clamp(20px, 5.5vw, 60px);     /* 要素間の隙間 */
  align-items: stretch; /* 高さを揃える（初期値） */
}

@media all and (max-width: 767px){
.infor_container {
  display: grid;
}
.infor_container .item {
  min-height: 631px !important;
  margin: 0 auto;
}

.infor_container .item p.title {margin: 0 24px 20px !important;}
.infor_container .item p.small {margin: 0 24px 80px !important;}
.infor_container .item p._date {margin: 0 24px 20px !important;}
}

@media all and (min-width: 461px) and (max-width: 767px) {
.infor_container ._btn a {left: 66.5px !important; bottom: 20px !important;}
}
@media all and (max-width: 460px) {
.infor_container ._btn a {left: clamp(24px, calc((100vw - 327px) / 2), 230px) !important; bottom: 20px !important;}
}

.infor_container .item {
  flex: 1;      /* 2つの要素を等幅にする */
  border: 1px solid #ccc;
  padding: 0;
  width: 100%;
  max-width: 460px;
  min-height: 720px;
}

.infor_container .item img {
  width: 100%;   /* 画像を親要素に合わせる */
  height: auto;
}

.infor_container .item p {color: #fff;}
.infor_container .item p.title {
  font-family: "Yu Gothic";
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 36px;
  align-self: stretch;
  margin: 0 40px 23px;
  }
.infor_container .item p.small {
  font-family: "Yu Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  align-self: stretch;
  margin: 0 40px 80px;
  }
.infor_container .item p._date {
  font-family: "Yu Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  align-self: stretch;
  margin: 0 40px 23px;
  }
.infor_container .item, .model_container .model_txt_inner {position: relative;}

.infor_container ._btn a {
    background: #000;
    border-radius: 3px;
    position: absolute;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto 10px;
    max-width: 320px;
    padding: 12px clamp(100px, 13vw, 135px);
    color: #fff;
    transition: 0.3s ease-in-out;
    text-align: center;
    font-family: "Shippori Mincho";
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px;
    margin: auto auto 10px;
    bottom: 49px;
    left: 15%;
}
.model_container ._btn a {
    background: #000;
    border-radius: 3px;
    position: absolute;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto 10px;
    max-width: 320px;
    padding: 12px clamp(100px, 13vw, 135px);
    color: #fff;
    transition: 0.3s ease-in-out;
    text-align: center;
    font-family: "Shippori Mincho";
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px;
    margin: auto auto 10px;
    bottom: 49px;
    left: 15%;
}
.model_container ._btn a {bottom: 87.03px; left: 0;}
.model_container ._btn._red a {
    background: #c11920;
}
.model_container ._btn a:hover {
    background: #fff;
    color: #000;
}
.model_container ._btn._red a:hover {
    background: #fff;
    color: #000;
}
.infor_container ._btn._red a {
    background: #c11920;
} 
.infor_container ._btn a:hover {
    background: #fff;
    color: #000;
}
.infor_container ._btn._red a:hover {
    background: #fff;
    color: #000;
}
.infor_container .bg_black {background: #000;}
.infor_container .bg_red {background: #c11920;}

@media all and (max-width: 767px) {
.model_container ._btn a {left: calc((100vw - 327px) / 2 - 24px); bottom: 20px;}
.model_container ._btn a {padding: 12px 144.5px; max-width: 327px; display: flex; justify-content: center; align-items: center;}
.infor_container ._btn a {padding: 12px clamp(105px, calc(48.75vw - 50.25px), 144px); max-width: 327px; display: flex; justify-content: center; align-items: center;} 
}
/*-------------------------*/


/*-- VOICE Section --*/

  .voice_inner{width: 100%; margin-bottom: 80px;}
  .voice_carousel {
    position: relative;
    width: 100%;
    max-width: 1440px;
    height: 542px; /* 高さを少し増やす */
    margin: auto;
    perspective: 1440px;
    overflow: hidden;
    background: #fff;
  }

  .voice_slides {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .voice_slide {
    position: absolute;
    width: 534px;
    height: 300px;
    transition: transform 0.5s ease, opacity 0.5s ease;
    opacity: 0.7;
  }

  .voice_slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
  }

  /* 中央スライドだけ下げる */
  .voice_center {
    transform: translateX(0) translateY(-114px) translateZ(0) scale(1.2);
    opacity: 1;
    z-index: 3;
  }

  /* 左スライド（奥） */
  .voice_left {
    transform: translateX(-480px) translateY(-240px) translateZ(-150px) scale(0.9);
    z-index: 2;
  }

  /* 右スライド（奥） */
  .voice_right {
    transform: translateX(480px) translateY(-240px) translateZ(-150px) scale(0.9);
    z-index: 2;
  }

  /* 矢印ボタン（中央スライドに合わせて下げる） */
  .voice_prev, .voice_next {
    position: absolute;
    top: calc(50% + 128px); /* 中央より80px下 */
    transform: translateY(-50%);
    background: rgba(255,255,255,0); /*#fff;*/
    border: 0;
    font-size: 4.8rem;
    font-weight: bold;
    color: #000;
    z-index: 5;
  }
  .voice_prev { left: clamp(10px, calc((100vw - 760px) / 2), 340px);}/*calc(((100vw - 680px) / 2) / 2);}*/
  .voice_next { right:clamp(10px, calc((100vw - 760px) / 2), 340px);}/*calc(((100vw - 680px) / 2) / 2);}*/

  .voice_prev, .voice_next {color: #000; background: transparent;}
  .voice_prev:hover, .voice_next:hover {color: #c11920; background: transparent;}
  .voice_prev:active, .voice_next:active {color: #c11920; background: transparent;}




@media all and (max-width: 767px) {
  .voice_container{margin-top: 56px;}
  .voice_carousel {
    position: relative;
    width: 100%;
    max-width: 768px;
    height: 420px; /* 高さを少し増やす */
    margin: auto;
    perspective: 1000px;
    overflow: hidden;
    background: #fff;
  }

  .voice_inner .anniversary_title p {margin-bottom: 48px;}

  .voice_slides {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .voice_slide {
    position: absolute;
    width: 320px;/*300px;*/
    height: 180px; /*200px;*/
    transition: transform 0.5s ease, opacity 0.5s ease;
    opacity: 0.7;
  }

  .voice_slide img {
    width: 320px; /*100%;*/
   /* max-width: 320px;*/
    height: 180px; /*100%;*/
    object-fit: cover;
    border-radius: 2px;
  }

  /* 中央スライドだけ下げる */
  .voice_center {
    transform: translateX(0) translateY(-108px) translateZ(0) scale(1);
    opacity: 1;
    z-index: 3;
  }

  /* 左スライド（奥） */
  .voice_left {
    transform: translateX(-330px) translateY(-108px) translateZ(0) scale(1);
    z-index: 2;
  }

  /* 右スライド（奥） */
  .voice_right {
    transform: translateX(330px) translateY(-108px) translateZ(0) scale(1);
    z-index: 2;
  }

  /* 矢印ボタン（中央スライドに合わせて下げる） */
  .voice_prev, .voice_next {
    position: absolute;
    top: calc(50% + 190px); /* 中央より80px下 */
    transform: translateY(-50%);
    background: rgba(255,255,255,0); /*#fff;*/
    border: 0;
    font-size: 4.8rem;
    font-weight: bold;
    color: #000;
    z-index: 5;
  }
  .voice_prev { left: calc((100vw - 200px) / 2);/*140px;*/ }
  .voice_next { right: calc((100vw - 200px) / 2);/* 140px;*/ }
}


/*-- VOICE Section //--*/


/*-- HHKB Channel Section --*/

.channel_container {width: 100%; padding: 54px 0 54px 10px; margin-bottom: 100px; background: #000;}
.channel_inner {
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;   /* 初期は縦並び（<=767px） */
  gap: 60px;                /* 画像間の余白はお好みで */
  align-items: center;      /* 画像を中央寄せ（縦並び時） */

}
.channel_inner .item {
  width: calc(50vw - 30px);
  object-fit: cover;        /* 必要に応じてトリミングして収める */
  flex: 0 0 auto;           /* 画像が縮まないように固定 */
  max-width: 460px;         /* 小画面で親幅に合わせて縮小 */
  height: auto;            /* アスペクト比維持で縮小 */
  max-height: 259px;
  padding: 0;
  aspect-ratio: 119 / 67; /* 高さautoでも比率*/
}


/* 768px以上で横並びに */
@media all and (min-width: 768px) {
.channel_inner {
    flex-direction: row;
    justify-content: center; /* 横並び時に中央寄せ（任意） */
    align-items: flex-start; /* 高さ方向の整列はお好みで */
  }
}
@media all and (max-width: 767px) {
.channel_container {padding: 0; margin-bottom: 56px;}
.channel_inner {padding: 24px; gap: 24px;}
}

@media all and (min-width: 359px) and (max-width: 767px) {
.channel_inner .item {width: 100%; max-height: 300px;}
.image-overlay figure {padding: 72px 23.5px 0; margin: auto 0 0;} 
}
@media all and (max-width: 358px) {
.channel_inner .item {width:100%; max-height: 250px; }
.image-overlay figure {padding: 102px 23.5px 0; margin: auto 0 0;} 
.overlay-text2 {bottom: -10px !important;}
}

/* 親要素を相対位置に設定 */
.image-overlay {
    position: relative;
    display: inline-block;
    max-width: 460px;
}

/* 画像はレスポンシブ対応 */
.image-overlay img {
    display: block;
    width: 100%;
    height: auto;
}

/* 重ねる文字のスタイル */
.overlay-text1 {
    position: absolute;
    top: 0;       /* 上寄せ */
    left: 0;      /* 左寄せ */
    padding-top: 0 !important;
  /*  padding-left: 1em !important; */
    margin: 0 auto !important;
}
.overlay-text1 h2 {font-size: clamp(31.9px,  4.15vw, 40px); line-height:clamp(43.2px, 5.62vw, 54px);}
.overlay-text1 p {font-size: clamp(15.88px, 2.06vw, 20px); line-height: clamp(23.95px, 3.11vw, 30px); color: #fff; margin-bottom: 0;}
.overlay-text2 {
    position: absolute;
    bottom: 0;       /* 下寄せ */
    right: 1px;      /* 右寄せ */
}

p.overlay-text2 {
    color: #FFF;
    text-align: right;
    font-family: "Yu Gothic";
    font-size: clamp(24px, 3.22vw, 32px); /*32px;*/
    font-style: normal;
    font-weight: 700;
    line-height: clamp(36px, 4.68vw, 48px); /*48px;*/
    align-self: stretch;
    margin-bottom: 0;
}

@media all and (max-width: 767px) {
.overlay-text1 {width: 100%; text-align: center;}
.overlay-text1 h2 {font-size: 40px; line-height: 54px; margin-bottom: 16px;}
.overlay-text1 p {font-size: 20px; line-height: 30px; margin-bottom: 28px;}
.overlay-text2 {padding: 0 23.5px;}
.image-overlay {aspect-ratio: 327 / 239 !important;}


}


/*-- HHKB Channel Section //--*/

/*-- Anniversary Model Section --*/

.model_container {width: 100%; margin-bottom: 80px;}
.model_block_black{width: 100%; background: #000;}
.model_block_black .model_inner {width: 100%; max-width: 1440px; margin: 1em auto 0;
  background-image: url("/jp/event/30th_anniversary/images/background-image01.webp");
  background-size: 100%;
  background-repeat: no-repeat, no-repeat;
  background-position: right top;
}
.model_box {width: 580px; height: 480px; padding-top: 60px; margin-left: clamp(20px, calc((100vw - 960px) / 2), 250px); position: relative;}
.model_box img {width: 100%; max-width: 120px; margin-bottom: 3em;}
.model_box ._stitle {font-family: "Yu Gothic"; font-size: 32px; font-style: normal; font-weight: 700; line-height: 45px; margin-bottom: 10px;}
.model_box p._stxt {margin: 0;}
.model_box ._stxt {font-family: "Yu Gothic"; font-size: 20px; font-style: normal; font-weight: 700; line-height: 28px;}

.model_block_gray {width: 100%; background: linear-gradient(90deg, #ccc, #e6e6e6 50%)}
.model_block_gray .model_inner {width: 100%; max-width: 1440px; margin: 0 auto 1em;
  background-image: url("/jp/event/30th_anniversary/images/background-image02.webp");
  background-size: 100%;
  background-repeat: no-repeat, no-repeat;
  background-position: right top;
}

@media all and (max-width: 767px) {
.model_block_black .model_inner {width: 100%; max-width: 767px; margin: 1em auto 0;
  background-image: url("/jp/event/30th_anniversary/images/background-image01_sp.webp");
  background-size: calc(100vw + 280px);/*clamp(900px, calc(100vw * 0.7), 620px);*/
  background-repeat: no-repeat, no-repeat;
  background-position: right top;
}
.model_block_black .model_box {width: 100%; height: 514px; padding-top: 24px; margin: 0 24px;}
.model_block_gray .model_box {width: 100%; height: 538px; padding-top: 24px; margin: 0 24px;}
.model_block_black .model_box img {width: clamp(72px,15%,120px); margin-bottom: 10em;}
.model_block_gray .model_box img {width: clamp(72px,15%,120px); margin-bottom: 11.5em;}
.model_box ._stitle {font-family: "Yu Gothic"; font-size: 28px; font-style: normal; font-weight: 700; line-height: 42px; margin-bottom: 10px;}
.model_box ._stxt {font-family: "Yu Gothic"; font-size: 16px; font-style: normal; font-weight: 700; line-height: 24px; margin-bottom: 32px;}

.model_block_gray .model_inner {width: 100%; max-width: 767px; margin: 0 auto 1em;
  background-image: url("/jp/event/30th_anniversary/images/background-image02_sp.webp");
  background-size: calc(100vw + 280px);/*clamp(900px, calc(100vw * 0.7), 620px);*/
  background-repeat: no-repeat, no-repeat;
  background-position: right top;
}

}


/*-- Anniversary Model Section //--*/



/*-- Anniversary Option Section --*/
  :root{
    --control-bg: rgba(0,0,0,0.6);
    --control-fg: #fff;
    --dot-size: 12px;
    --dot-gap: 30px;
    --dot-active: #c11920; /*#333;*/
    --dot-inactive: #000;
    --border: #ccc;

    /* 固定サイズと表示枚数／ギャップ */
    --slide-w: 390px;
    --slide-h: 420px;
    --slides-per-view: 3;
    --track-gap: 2px; /* スライド間余白 */
  }

  .anniversary-carousel {
    width: auto;
    margin: 40px auto;
    position: relative; /* controls/dots の基準 */
  }

  /* ビューポート／トラック */
  .anniversary-carousel-viewport {
    overflow: hidden;
    width: 100%;
    /* 理想表示幅 = 3枚分幅 + ギャップ2本分 */
    max-width: calc(
      var(--slide-w) * var(--slides-per-view) +
      var(--track-gap) * (var(--slides-per-view) - 1) + 4px
    );
    margin: 0 45px 0 clamp(0px, calc((100vw - 980px) / 2), 230px); /*中央寄せ*/
    background: #fff;
  }
  .anniversary-carousel-track {
    display: flex;
    gap: var(--track-gap);
    transition: transform 0.45s ease;
    will-change: transform;
  }

  /* スライド：CSS 初期幅/高も固定（初期チラつき回避） */
  .anniversary-carousel-slide {
    flex: 0 0 auto;
    width: var(--slide-w);
    height: var(--slide-h);
    padding: 0 45px;
    overflow: hidden;
    user-select: none;
    -webkit-user-drag: none;
    position: relative;
    background: #fff;
    border-left: 2px solid #ccc;
  }
  .anniversary-carousel-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .anniversary-carousel-slide.anniversary-clone {
    visibility: visible;
  }

  /* コントロール：スライド直下に相対的に配置 */
  .anniversary-carousel-controls {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: calc(var(--slide-h) + 60px);
    display: flex;
    gap: 220px;
    z-index: 2;
  }
  .anniversary-carousel-button {
    background: #fff;/*var(--control-bg);*/
    color: #000; /*var(--control-fg);*/
    border: none;
    padding: 10px 14px;
    cursor: pointer;
    font-size: 38px;
    border-radius: 6px;
    line-height: 1;
    min-width: 44px;
    min-height: 44px;
  }
  .anniversary-carousel-button:focus-visible {
    outline: 3px solid #6aa9ff;
    outline-offset: 2px;
  }

  .anniversary-prev, .anniversary-next {color: #000; background: transparent;}
  .anniversary-prev:hover, .anniversary-next:hover {color: #c11920; background: transparent;}
  .anniversary-prev:active, .anniversary-next:active {color: #c11920; background: transparent;}

  /* ドット（ページ単位） */
  .anniversary-carousel-dots {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: calc(var(--slide-h) + 84px);
    display: flex;
    gap: var(--dot-gap);
    z-index: 3;
  }
  .anniversary-carousel-dot {
    width: var(--dot-size);
    height: var(--dot-size);
    background: var(--dot-inactive);
    border-radius: 50%;
    cursor: pointer;
    border: none;
    padding: 0;
    display: inline-block;
  }
  .anniversary-carousel-dot[aria-selected="true"] {
    background: var(--dot-active);
  }
  .anniversary-carousel-dot:focus-visible {
    outline: 3px solid #6aa9ff;
    outline-offset: 2px;
  }

  /* ドラッグ時のカーソル/選択 */
  .anniversary-grabbing {
    cursor: grabbing;
    cursor: -webkit-grabbing;
  }

  .anniversary  {width: 100%;}
  .anniversary_txt_inner {padding: 0.5em;}
  .anniversary ._btn a {
    background: #000;
    border-radius: 3px;
    position: absolute;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto 10px;
    width: 100%;
    max-width: 170px;
    padding: 9px 35px;
    color: #fff;
    transition: 0.3s ease-in-out;
    font-weight: 500;
    margin: auto auto 0;
    bottom: 0;
    left: 110px;
  }
  .anniversary ._btn a:hover {
    color: #c11920;
  }
  .anniversary_txt_inner {padding: 1.0em;}
  .anniversary p._title {font-family: "Yu Gothic"; font-size: 16px; font-style: normal; font-weight: 700; line-height: 24px;}
  .anniversary p._txt {font-family: "Yu Gothic"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 21px;}
  .anniversary ._btn a {text-align: center; font-family: "Yu Gothic"; font-size: 14px; font-style: normal; font-weight: 700; line-height: 21px;}


  @media all and (max-width: 767px) {
    .anniversary ._btn a {left: 84px;}
  
  }

  /* SR専用／動き配慮 */
  .anniversary-sr-only{
    position:absolute!important;
    width:1px;height:1px;
    padding:0;margin:-1px;
    overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
  }
  @media (prefers-reduced-motion: reduce) {
    .anniversary-carousel-track { transition: none !important; }
  }
  
  
 .anniversary .titleBox._flex {display: flex;}
 .anniversary .subTitle_box {padding-left: 60px;}
 .anniversary ._align {text-align: left; padding: 0; margin: 35px 0 0.5em;}
 .anniversary ._imgBox {text-align: right; padding: 0; margin: 0 0 0 auto;}
@media all and (max-width: 767px) {
 .anniversary .titleBox._flex {flex-direction: column;}
 .anniversary .subTitle_box {padding: 0;}
 .anniversary ._align, .anniversary .subTitle {text-align: center; padding: 0; margin: 1em auto 0.5em;}
 .anniversary ._imgBox {text-align: center; padding: 0; margin: 0 auto;}
 .anniversary_title {margin: 24px;}
 .anniversary_title .subTitle {text-align: left; font-size: 16px; line-height: 24px;}
}

  
  
  
  
/*-- Anniversary Option Section //--*/


/*-- Banner Section --*/
.userMeetup_container {
  width: 100%;
  margin: 158px 0 80px;
}

.userMeetup_inner {
  padding: 2em;
}

.userMeetup_subContainer {
  width: 100%;
  max-width: 980px;
  /*height: 312px;*/
  background: #736357;
  padding: 2em 1em;
  margin: 0 auto;
  text-align: center;
}
.userMeetup_subContainer h2 {
  color: #fff;
  text-align: center;
  font-family: "Yu Gothic";
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 60px;
}
.userMeetup_subContainer p.bold {
  color: #fff;
  text-align: center;
  font-family: "Yu Gothic";
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 36px;
}
.userMeetup_subContainer p+p {
  color: #fff;
  font-family: "Yu Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

@media all and (max-width: 767px) {
.userMeetup_subContainer h2 {
  font-size: 32px;
  line-height: 48px;
}
.userMeetup_subContainer p.bold {
  font-size: 18px;
  line-height: 27px;
}
.userMeetup_subContainer p+p {text-align: left;}
}


/*-- Banner Section //--*/


/*-- HISTORY Section --*/

.history_container {width: 100%; margin-bottom: 40px; background: linear-gradient(180deg, #333 0%, #000 100%);}
.history_inner {max-width: 1440px; padding: 1em 1em 4em; margin: 0 auto;}
.history_inner .section_inner {max-width: 980px; margin: 0 auto;}


@media all and (max-width: 767px) {
.events {margin-left: 24px;}
.-usac_panafacom .eventsItem {border-right: 0 !important; border-left: 2px solid #fff; width: 100%;}
.-usac_panafacom .eventsArea .eventsItem,
.-usac_panafacom .eventsArea.-reverse .eventsItem {padding-left: clamp(1.6rem, 2.886vw, 4rem); padding-right: 0; }
.eventsArea.-reverse .eventsItem:nth-child(2) {border-right: 0;}
.eventsArea .eventsItem:nth-child(2), .eventsArea.-reverse .eventsItem:nth-child(2) {padding-top: 0; padding-bottom: 80px;}
.eventsItem.-first {border-top: 0 !important;}
.eventsArea, .eventsArea.reverse {flex-direction: column !important;}

.-usac_panafacom .tagCommonEra, .-usac_panafacom .tagCommonEra_after {left: 61.5px !important;}
.eventsItem_imageArea figure.LR_side {margin: 0 !important;}
.eventsItem_imageArea p.LR_side {text-align: left !important;}
img.eventsItem_image.Nofigure_caption {margin-bottom: 0 !important;}

}


/*-- HISTORY Section //--*/


/* その他 */
._center {text-align: center;}
._alignAuto {text-align: center;
  font-family: "Shippori Mincho";
  font-size: 40px;
  color: #c11920;
  font-style: normal;
  font-weight: 700;
  line-height: 54px;

}
._alignAuto span {text-align: center;
  font-family: "Yu Gothic";
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 30px;
  color: #000;
  }


._bgBlack {background: #000;}
._bgGray {background: #f4f4f4;}
._bgWhite {background: #fff;}
.bgRed {background: #c11920;}
._fontWhite {color: #fff;}
._fontBlack {color: #000;}
._fontRed {color: #c11920;}
.message_line {width: 100%; max-width: 470px; background: #c11920; height:1px; padding: 1px 0; margin: 24px 0 24px auto;}
.pd00 {padding: 0;}
._mgRight20 {margin-right: 20px;}
._maxWidth800 {max-width: 800px;}
._maxWidth460 {max-width: 460px;}
._maxWidth349 {max-width: 349px;}

._none {display: none;}
._overflow-vb {overflow: visible;}
.alignCenter {text-align: center;}

@media screen and (min-width: 768px) {
.pc_on {display: block;}
.sp_on {display: none;}
._alignAuto {text-align: right;
  margin: 0 30px 10px auto;
  color: #c11920;
  width: 100%;
  max-width: 480px;
 }
._alignAuto span {text-align: right; margin-right: 20px;}
.message_line {margin: 24px 0 64px auto;}
}

@media screen and (max-width: 767px) {
.pd00 {padding: 0 !important;}
.message_line {max-width: 100vw;}

.pc_on {display: none;}
.sp_on {display: block;}
}