@charset "UTF-8";
/* ============================================================
   NAGOYA ORQUES - theme.css  v1.2

   【使い方】
   このファイル1枚を /wp-content/themes/orques/css/theme.css に配置し、
   header.php の </head> 直前に以下の1行を追加するだけ。

   <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/theme.css?v=<?php echo filemtime(get_template_directory().'/css/theme.css'); ?>">

   既存の HTML・PHP は一切変更不要。
   ============================================================ */

/* ============================================================
   Web フォント
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,600;0,700;0,800;1,700&family=Noto+Sans+JP:wght@400;500;700&display=swap');

/* ============================================================
   カラートークン
   ============================================================ */
:root {
  --black:   #000000;
  --white:   #ffffff;
  --gold:    #C9A24B;
  --gold-hi: #E5C76B;
  --gold-dk: #8C6F2E;
  --jet:     #0A0A0A;
  --jet-2:   #141414;
  --jet-3:   #1e1e1e;

  /* ライトモード用 */
  --bg-base:   #f2f2f2;
  --bg-card:   #ffffff;
  --text-base: #333333;
  --border-lt: #e0e0e0;
}


.bg_black{
  background-color: var( --bg-base) !important;
}

.white{
  color: var(--text-base) !important;
}
.white_n{
  color: #ffffff;
}


/* ============================================================
   GLOBAL BASE：ライトグレー背景 × ダークテキスト
   ============================================================ */

input,
textarea,
select,
[contenteditable="true"] {
  -webkit-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

body,
p,
li,
td,
th,
input,
textarea,
select,
button {
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ============================================================
   カラートークン置き換え
   ============================================================ */
.blue { color: var(--gold) !important; }

.bg_red {
  background-color: var(--gold) !important;
}
.bg_red,
.bg_red p,
.bg_red span,
.bg_red small {
  color: var(--jet) !important;
}
.bg_red .white { color: var(--jet) !important; }

.bg_blue {
  background-color: var(--jet) !important;
  border: 1px solid var(--gold) !important;
}
.bg_gold {
  background-color: var(--gold) !important;
}
.bg_blue p,
.bg_blue span,
.bg_blue .white {
  color: var(--gold) !important;
}
.bg_blue .material-icons,
.bg_blue .material-symbols-outlined {
  color: var(--gold) !important;
}

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
.fw-en,
.header_nav_link,
.header_nav_link span,
.side-fixed p,
a.cat,
span.cat,
.news_box_list .date,
.news_box_list_post .date,
.footer-item02 small,
.footer-item02 p.blue {
  font-family: "Barlow Condensed", "Titillium Web", sans-serif !important;
  -webkit-font-smoothing: antialiased;
}

.header_nav_link,
.header_nav_link span {
  font-weight: 600 !important;
  font-size: 15px !important;
  letter-spacing: .14em !important;
}

a.cat,
span.cat {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .22em !important;
}

.news_box_list .date,
.news_box_list_post .date {
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
}

.story_area_inner h4,
.story_area_bg h4 {
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .28em !important;
  color: rgba(255, 255, 255, .45) !important;
}

.story_area_inner p,
.story_area_bg p {
  font-size: 15px !important;
  line-height: 2.1 !important;
  font-weight: 400 !important;
}

.composition_item a.title,
.composition_item .title {
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.6 !important;
  letter-spacing: .02em !important;
}

.composition_item .excerpt {
  font-size: 13px !important;
  line-height: 1.9 !important;
}

.footer-item01-nav a,
.footer-item01-nav li {
  font-size: 14px !important;
  letter-spacing: .04em !important;
  font-weight: 500 !important;
}

.side-fixed p,
.side-fixed p.white {
  letter-spacing: .22em !important;
  font-size: 11px !important;
}

/* ============================================================
   HEADER
   ============================================================ */
header {
  border-bottom: 2px solid var(--gold) !important;
  background: transparent;
  transition: background-color 0.3s;

}
/* トップページのみ：読み込み直後は黒背景、スクロールで#f2f2f2に切り替え */
header.is-top-header {
  background: var(--black);
}

header.bg_black {
  background: #f2f2f2;
}

/* 透過時＝白文字、スクロールして背景が出たら黒文字（CONTACTボタンは対象外） */
header .nav-top .header_nav_link {
  color: #fff !important;
  transition: color 0.3s;
}

header .nav-sub .header_nav_link {
  color: #262626 !important;
  transition: color 0.3s;
}

header.bg_black .header_nav_link:not(.header_nav_link--contact) {
  color: var(--text-base) !important;
}

.header_nav_link:hover {
  color: var(--gold) !important;
  opacity: 1 !important;
}

.header_nav_link.sns img{
  color: var(--gold);
}

.header_nav_link--contact {
  background-color: var(--black) !important;
  border-color: var(--black) !important;
}
.header_nav_link--contact p,
.header_nav_link--contact span {
  color: var(--white) !important;
}

.sp-menu-list-item p.blue,
.sp-menu-list-item .blue,
.sp-menu-list-item_left .blue {
  color: var(--gold) !important;
}

/* ============================================================
   MV（メインビジュアル）
   ※スライダー・画像表示はすべてここで定義（main.css / mediaquery.css を上書き）
   ============================================================ */

/* --- 両サイドに隙間（サイト背景を見せる） --- */
.mv,
main .mv {
  margin-top: 80px;
  overflow: visible !important;
  background-image: url(../img/top/mv_bg01.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.mv-inner,
main .mv .mv-inner {
  overflow: visible !important;
  padding: 0 clamp(100px, 10vw, 200px) !important;
  background-color: transparent !important;
  max-height: none !important;
  min-height: unset !important;
}
.mv_slider_wrap {
  position: relative !important;
  width: 100% !important;
  max-width: 1075px !important;
  margin: 0 auto !important;
  overflow: hidden !important;
}
main .mv .mv-inner .mv_slider .mv_slider_item picture {
  display: block !important;
  width: 100% !important;
  line-height: 0 !important;
}
main .mv .mv-inner .mv_slider .mv_slider_item img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  -o-object-fit: contain !important;
  object-fit: contain !important;
  -o-object-position: center !important;
  object-position: center !important;
}

/* --- 右端：次スライドの見切れ防止（main.css の scale(1.05) はみ出し対策） --- */
.mv_slider,
main .mv .mv-inner .mv_slider {
  overflow: hidden !important;
  max-height: none !important;
}
main .mv .mv-inner .mv_slider .slick-list,
main .mv .mv-inner .mv_slider .slick-slide,
main .mv .mv-inner .mv_slider .slick-slide > div {
  overflow: hidden !important;
}
main .mv .mv-inner .mv_slider .mv_slider_item,
main .mv .mv-inner .mv_slider .slick-slide .mv_slider_item {
  -webkit-transform: none !important;
  transform: none !important;
  max-height: none !important;
}

/* --- 拡大アニメーション無効 --- */
main .mv .mv-inner .mv_slider .mv_slider_item.add-animation,
main .mv .mv-inner .mv_slider .slick-slide.add-animation,
main .mv .mv-inner .mv_slider .slick-slide.add-animation .mv_slider_item {
  -webkit-animation: none !important;
  animation: none !important;
  -webkit-transform: none !important;
  transform: none !important;
}

/* --- スライダー上グラデーション --- */
.mv-inner::after {
  display: none !important;
}
.mv_slider_wrap::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  /* background: linear-gradient(
    110deg,
    rgba(10,10,10,.80) 0%,
    rgba(10,10,10,.55) 50%,
    rgba(10,10,10,.20) 100%
  ) !important; */
  z-index: 1 !important;
  pointer-events: none !important;
}

/* --- テキストオーバーレイ（スライダー上） --- */
.mv_text_overlay {
  position: absolute !important;
  top: 25% !important;
  left: 7% !important;
  z-index: 2 !important;
  max-width: 620px !important;
  pointer-events: none !important;
}
@media screen and (max-width: 767px) {
  .mv-inner,
  main .mv .mv-inner {
    padding: 0 clamp(12px, 4vw, 24px) 0 clamp(12px, 4vw, 100px) !important;
    max-height: none !important;
    min-height: unset !important;
  }
  main .mv .mv-inner .mv_slider .mv_slider_item img {
    max-height: none !important;
  }
  main .mv .mv-inner .mv_slider,
  main .mv .mv-inner .mv_slider .mv_slider_item {
    max-height: none !important;
  }
  .mv_text_overlay {
    bottom: 8% !important;
    left: 5% !important;
    max-width: 90% !important;
  }
}

/* リーグ名ライン */
.mv_league {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .26em !important;
  color: var(--gold) !important;
  margin-bottom: 18px !important;
}
.mv_league::before {
  content: "" !important;
  display: inline-block !important;
  width: 36px !important;
  height: 1px !important;
  background-color: var(--gold) !important;
  flex-shrink: 0 !important;
}

/* メイン見出し */
.mv_headline {
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: clamp(36px, 5.5vw, 76px) !important;
  font-weight: 800 !important;
  line-height: 1.06 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
  color: #fff !important;
  margin-bottom: 24px !important;
}
.mv_headline .gold,
.mv_headline span.gold {
  color: var(--gold) !important;
  display: block !important;
}

/* 英語サブコピー */
.mv_sub_en {
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .22em !important;
  color: rgba(255,255,255,.55) !important;
  margin-bottom: 6px !important;
  text-transform: uppercase !important;
}

/* 日本語サブコピー */
.mv_sub_ja {
  font-family: "Noto Sans JP", sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: .06em !important;
  color: rgba(255,255,255,.65) !important;
  margin-bottom: 0 !important;
}

/* --- 旧 .mv_content 互換（念のため） --- */
.mv_content {
  position: relative !important;
  z-index: 2 !important;
}
.mv_content .f_16,
.mv_content p.white.fw-en {
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .22em !important;
  color: rgba(255,255,255,.55) !important;
  margin-bottom: 6px !important;
}

/* --- サブコピー（日本語） --- */
.mv_content p:not(.fw-en):not([class*="f_"]) {
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: .06em !important;
  color: rgba(255,255,255,.70) !important;
  line-height: 1.8 !important;
}

/* ============================================================
   BAND（スポンサーロゴスライダー）
   ============================================================ */
.band {
  border-top: 2px solid var(--gold);
  border-bottom: 2px solid var(--gold);
  background-color: #fff;
}

/* ============================================================
   NEWS SECTION
   ============================================================ */

/* NEWS背景 bg_black → ライトに上書き */
.news_area.bg_black {
  background-color: var(--bg-base) !important;
}

.news_box_list .date.blue,
.news_box_list_post .date {
  color: var(--gold) !important;
}

/* ニュースリストのテキスト → ダーク */
.news_box_list li a,
.news_box_list_post a {
  color: var(--text-base) !important;
}
.news_box_list li a:hover,
.news_box_list_post a:hover {
  color: var(--gold) !important;
}

a.cat.bg_red,
span.cat.bg_red {
  background-color: var(--gold) !important;
  color: var(--jet) !important;
}
a.cat.bg_red.white,
span.cat.bg_red.white {
  color: var(--jet) !important;
}

.news_box_right.bg_blue {
  background-color: var(--gold) !important;
  border: none !important;
}
.news_box_right .white,
.news_box_right .material-symbols-outlined {
  color: var(--jet) !important;
}

/* NEWS区切り線 */
main .news_area .news_box .news_box_left .news_box_list {
  border-color: var(--border-lt) !important;
}

/* ============================================================
   BLOG SECTION（シャチログ！）
   ============================================================ */

/* BLOG背景 bg_black → ライト */
.blog_area.bg_black {
  background-color: var(--bg-base) !important;
}

/* カード → 白 */
.composition_item,
.composition_item.bg-white {
  background-color: var(--bg-card) !important;
  border: 1px solid var(--border-lt) !important;
}
.composition_item:hover {
  border-color: var(--gold) !important;
  box-shadow: 0 4px 20px rgba(201,162,75,.15) !important;
}

.composition_item a.title {
  color: var(--text-base) !important;
}
.composition_item a.title:hover {
  color: var(--gold) !important;
}

.composition_item .date,
.composition_item .date * {
  color: #999 !important;
}
.composition_item .excerpt {
  color: #666 !important;
}

.composition_item a.cat.bg_red {
  background-color: var(--gold) !important;
  color: var(--jet) !important;
}

/* スライダー内カードの高さ揃え */
.blog_slider .slick-track {
  display: flex !important;
  align-items: stretch;
}
.blog_slider .slick-slide {
  height: auto !important;
  display: flex !important;
}
.blog_slider .composition_item {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.blog_slider .composition_item .text {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.blog_slider .composition_item .excerpt {
  flex: 1;
}

a.bg_blue.radius100,
input.bg_blue.radius100 {
  background-color: var(--gold) !important;
  border-color: var(--gold) !important;
}
a.bg_blue.radius100 p,
a.bg_blue.radius100 span {
  color: var(--jet) !important;
}
a.bg_blue.radius100:hover {
  background-color: var(--gold-hi) !important;
}

/* ============================================================
   STORY SECTION
   ============================================================ */
.story_area_bg {
  background-color: var(--jet) !important;
  background-image: none !important;
}

.story_area .strip,
.story_area_bg .strip {
  background-color: transparent !important;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  padding: 0 !important;
}

.story_area_inner p:not([class*="white"]) {
  color: rgba(255, 255, 255, 0.78) !important;
}

.story_area_inner .f_stroke {
  -webkit-text-stroke: 1px rgba(201, 162, 75, 0.3);
}

.story_img_area {
  border-top: 3px solid var(--gold);
}

/* ============================================================
   PLAYER / GALLERY SECTION
   ============================================================ */
.bg_gray,
.player_area.bg_gray {
  background-color: #e8e8e8 !important;
}

.slide-arrow.prev-arrow,
.slide-arrow.next-arrow {
  background-color: var(--gold) !important;
  border-color: var(--gold) !important;
}
.slide-arrow.prev-arrow::before,
.slide-arrow.next-arrow::before {
  border-color: var(--jet) !important;
}

/* ============================================================
   第2バナーエリア
   ============================================================ */
.banner_wrap[style*="border-bottom"] {
  border-bottom-color: var(--gold) !important;
}

/* ============================================================
   FOOTER
   ============================================================ */
.footer-item01-nav {
  gap: 6rem;
}
footer .xhl_logo {
  margin: 0;
}
footer.bg_black {
  border-top: 2px solid var(--gold) !important;
}

footer .blue { color: var(--gold) !important; }

footer a.bg_red {
  background-color: var(--gold) !important;
}
footer a.bg_red p,
footer a.bg_red span {
  color: var(--jet) !important;
}
footer a.bg_red:hover {
  background-color: var(--gold-hi) !important;
}

.footer-item02 {
  border-top: 1px solid #1a1a1a !important;
}
.footer-item02 .blue,
.footer-item02 a.blue {
  color: var(--gold) !important;
}

/* ============================================================
   side-fixed（縦スクロールテキスト）
   ============================================================ */
.side-fixed p.white {
  color: #000 !important;
}

header .side-fixed {
  background-color: var(--gold) !important;
}

/* ============================================================
   その他
   ============================================================ */
.strip.white span {
  color: #fff !important;
}
/* サブページのナビゲーション内リンクの初期状態を黒にする */




/* ===============各ページ変更================ */

/* ============================================================
トップページ
============================================================ */

.story_area .story_area_bg .story_area_inner{
  padding-top: 60px;
  padding-bottom: 100px;
}

/* ============================================================
チア
============================================================ */
.cheer01 .cheer01-inner .mv-wrap {
  position: relative;
  display: inline-block;
}
.cheer01 .cheer01-inner .mv-wrap img {
  display: block;
  width: 100%;
  height: auto;
}
.cheer01 .cheer01-inner .presented_by {
  position: absolute;
  top: -35px;
  right: 0px;
  margin: 0;
  z-index: 10;
  padding-right: 0.5%;
}

/* ============================================================
チア
============================================================ */