/* RENACER FC 共通CSS：ネイビー・ゴールドを基調にしたシンプルなデザイン */
:root {
  --navy:#0a1b39; --blue:#2e5f91; --gold:#e7d49b; --white:#fff;
  --cream:#f5f5f1; --ink:#172033; --muted:#687486; --line:#dce1e7;
  --max:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--cream);font-family:"Noto Sans JP","Yu Gothic",Meiryo,sans-serif;line-height:1.85}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
.site-header{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:12px clamp(20px,5vw,70px);background:var(--white);border-bottom:1px solid var(--line)}
.header-inner{width:100%;max-width:var(--max);margin:auto;display:flex;align-items:center;justify-content:space-between;gap:25px}

.brand,
.site-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
  text-decoration: none;
  color: var(--navy);
}

.brand img,
.site-logo img {
  width: 58px;
  height: 58px;
  object-fit: contain;
}

.brand strong,
.site-logo strong {
  display: block;
  color: var(--navy);
  font-family: "Noto Sans JP", sans-serif;
  font-size: 25px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 1px;
}

.brand small,
.site-logo small {
  display: block;
  margin: 5px 0 0;
  padding: 0;
  color: var(--muted);
  font: 700 10px/1.4 "Noto Sans JP", sans-serif;
  letter-spacing: 1px;
}
.nav,.main-nav{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;justify-content:flex-end}
.nav a,.main-nav a{color:var(--navy);font-size:12px;font-weight:700;border-bottom:2px solid transparent;padding:7px 0}
.nav a:hover,.main-nav a:hover,.nav a[aria-current="page"],.main-nav a[aria-current="page"]{color:var(--blue);border-color:var(--gold)}
.hero{position:relative;display:flex;align-items:center;min-height:540px;overflow:hidden;padding:75px clamp(24px,9vw,135px);color:var(--white);background:repeating-linear-gradient(135deg,transparent 0,transparent 65px,rgba(255,255,255,.035) 66px,rgba(255,255,255,.035) 68px),var(--navy)}
.hero-inner{position:relative;z-index:2;max-width:var(--max);width:100%;margin:auto}
.hero-logo{width:90px;margin:0 0 18px}
.hero-line{width:74px;height:3px;margin:28px 0 22px;background:var(--gold)}
.hero .hero-message{margin:0 0 30px;font-size:clamp(16px,2vw,20px);font-weight:500;line-height:2;letter-spacing:1px;color:#f1f3f7}
.hero h1 span{color:var(--gold)}
.hero .button{min-width:220px}
.eyebrow,.hero-label{color:var(--gold);font:700 11px "Barlow Condensed",sans-serif;letter-spacing:2px}
.hero h1{margin:25px 0 20px;font:900 clamp(60px,9vw,112px)/.95 "Barlow Condensed",sans-serif;letter-spacing:.01em}
.hero h1 span{color:var(--gold)}
.hero p{max-width:620px;margin:14px 0 26px;color:#e0e5ed;font-size:15px;line-height:2;letter-spacing:.5px}
.hero-decoration{position:absolute;right:7%;top:24%;color:rgba(255,255,255,.055);font:900 clamp(150px,28vw,360px)/1 "Barlow Condensed",sans-serif;transform:skew(-8deg)}
.button-row{display:flex;gap:12px;flex-wrap:wrap}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:25px;min-width:190px;padding:15px 18px;background:var(--gold);color:var(--navy);font-size:12px;font-weight:700;border:1px solid var(--gold);transition:transform .2s}
.button.outline{background:transparent;color:var(--white);border-color:#aab4c1}
.button:hover{transform:translateY(-2px)}
.container{max-width:var(--max);padding:0 22px;margin:auto}
.section{padding:80px clamp(22px,8vw,120px)}
.section.alt{background:#e8e9e5}
.section-title{text-align:center;margin:0 0 30px;color:var(--navy);font-size:clamp(27px,3vw,40px);font-weight:900;line-height:1.5}
.section-title span{display:block;margin-bottom:10px;color:var(--muted);font:700 11px "Barlow Condensed",sans-serif;letter-spacing:2px}
.lead{text-align:center;max-width:760px;margin:-10px auto 30px;color:#4e5a6a;font-size:14px;line-height:2.1}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.card{padding:28px;background:var(--white);border:0;border-top:3px solid var(--navy);box-shadow:none}
.card h3{margin:15px 0 8px;color:var(--navy);font-weight:800}
.card p{margin:0;color:var(--muted);font-size:13px}

.team-photo {
  display: block;
  width: 100%;
  height: auto;
  margin: 28px 0;
  border: 0;
  box-shadow: none;
}
.photo-note{text-align:center;color:var(--muted);font-size:13px;margin-top:20px}
.page-hero,.join-page-hero,.schedule-hero{background:repeating-linear-gradient(135deg,transparent 0,transparent 55px,rgba(255,255,255,.035) 56px,rgba(255,255,255,.035) 58px),var(--navy);color:var(--white);padding:58px clamp(22px,8vw,120px);border:0}
.page-hero h1,.join-page-hero h1,.schedule-hero h1{margin:0;color:var(--white);font-size:clamp(32px,5vw,48px);font-weight:900;line-height:1.3}
.page-hero p,.join-page-hero>p:last-child,.schedule-hero>p:last-child{margin:14px 0 0;color:#d9e0e9;font-size:14px}


.page-hero .eyebrow,.join-kicker,.schedule-kicker
{margin:0 0 12px;color:var(--gold);
  font:700 11px "Barlow Condensed",sans-serif;letter-spacing:2px}


.breadcrumbs{font-size:.82rem;color:#e2e8f0;margin-bottom:12px}
.breadcrumbs a{color:var(--gold)}
.content{max-width:900px;margin:auto;padding:55px 22px 80px}
.content h2{color:var(--navy);border:0;border-bottom:1px solid var(--line);padding:0 0 12px;margin:32px 0 16px;font-size:clamp(22px,3vw,30px)}
.content p{margin:0 0 14px}
.info-table{width:100%;border-collapse:collapse;margin:18px 0;background:var(--white)}
.info-table th,.info-table td{border:1px solid var(--line);padding:13px 15px;text-align:left;vertical-align:top}
.info-table th{width:28%;background:#eef0ed;color:var(--navy)}
.notice{padding:16px 18px;background:#fff8e8;border-left:4px solid var(--gold);margin:18px 0}
.match-list{display:grid;gap:14px}
.match-card{display:grid;grid-template-columns:150px 1fr auto;align-items:center;gap:18px;padding:20px;background:var(--white);border:0;border-left:3px solid var(--navy)}
.match-date{font-weight:800;color:var(--navy)}
.match-card h3{margin:0;font-size:1rem}
.match-card p{margin:3px 0 0;color:var(--muted);font-size:.9rem}
.score{font-size:1.15rem;font-weight:900;color:var(--navy);white-space:nowrap}
.tag{display:inline-block;background:#eef0ed;color:var(--navy);font-size:.75rem;font-weight:800;padding:3px 8px;margin-right:8px}
.contact-box{background:var(--navy);color:var(--white);padding:30px;text-align:center}
.contact-box a{color:var(--gold)}
.site-footer{background:#061329;color:var(--white);padding:30px clamp(20px,5vw,70px);text-align:center;font-size:.82rem}
.footer-logo{width:42px;height:42px;object-fit:contain;margin:0 auto 8px}
.site-footer p{margin:5px;color:#aeb8c6}
.footer-nav{display:flex;gap:15px;justify-content:center;flex-wrap:wrap;margin:14px 0}
.footer-nav a{color:var(--white);font-size:12px;font-weight:700}
.footer-nav a:hover{color:var(--gold)}
.small{font-size:.85rem;color:var(--muted)}
.schedule-content{max-width:1100px;margin:0 auto;padding:42px 22px 80px}
.schedule-note{margin:0 0 28px;color:#596576;font-size:14px;line-height:1.9}
.schedule-month{margin:0 0 36px;padding:22px;background:var(--white);border-top:3px solid var(--navy)}
.schedule-month h2{margin:0 0 16px;color:var(--navy)}
.schedule-month img{width:100%;height:auto}
.join-details{max-width:900px;margin:0 auto;padding:45px 22px 80px}
.join-details h2{color:var(--navy);border-bottom:1px solid var(--line);padding-bottom:12px}
.join-details table{width:100%;border-collapse:collapse;background:var(--white)}
.join-details th,.join-details td{padding:13px 15px;border:1px solid var(--line);text-align:left;vertical-align:top}
.join-details th{width:28%;background:#eef0ed;color:var(--navy)}
@media(max-width:800px){
 .site-header{align-items:flex-start;flex-direction:column;gap:15px;padding:12px 20px 18px}
 .header-inner{align-items:flex-start;flex-direction:column;gap:15px}
 .brand img,.site-logo img{width:48px;height:48px}
 .brand strong,.site-logo strong{font-size:22px}
 .nav,.main-nav{width:100%;justify-content:flex-start;gap:8px 18px}
 .nav a,.main-nav a{font-size:11px}
 .hero{min-height:500px;padding:60px 25px}
 .hero h1{font-size:clamp(58px,13vw,85px)}
 .hero-decoration{top:40%;right:-5%}
 .section{padding:60px 22px}
 .cards{grid-template-columns:1fr}
 .match-card{grid-template-columns:1fr;gap:5px}
 .score{font-size:1.05rem}
 .info-table th,.info-table td,.join-details th,.join-details td{padding:10px;font-size:.92rem}
 .info-table th,.join-details th{width:32%}
 .site-footer{padding:28px 20px}
}

/* ページタイトル上の英字 */
.page-hero .eyebrow {
  display: block;
  margin: 0 0 10px;
  padding: 0;
  color: var(--gold);
  font: 700 12px/1.4 "Noto Sans JP", sans-serif;
  letter-spacing: 1px;
  text-transform: uppercase;
}

/* Instagramリンク */
.nav a.instagram-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 10px;
  background: var(--gold);
  color: var(--navy);
  border: 1px solid var(--gold);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.4;
  transition: background 0.2s, color 0.2s;
}

.nav a.instagram-link:hover {
  background: var(--navy);
  color: var(--gold);
}


/* フッターのInstagramリンク */
.footer-nav a:hover {
  color: var(--gold);
}





/* ページ下部 */
.team-closing {
  padding: 68px 24px 72px;
  color: #fff;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(46, 95, 145, 0.4), transparent 70%),
    #0a1b39;
  text-align: center;
}

.team-closing-label {
  margin: 0 0 22px;
  color: #e7d49b;
  font-family: "Barlow Condensed", sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.2em;
}

.team-closing h2 {
  margin: 0;
  font-size: clamp(25px, 4vw, 38px);
  font-weight: 900;
  line-height: 1.8;
  letter-spacing: 0.04em;
}

.team-closing > span {
  display: block;
  width: 45px;
  height: 3px;
  margin: 24px auto;
  background: #e7d49b;
}

.team-closing > p:last-child {
  margin: 0;
  color: rgba(255, 255, 255, 0.7);
  font-family: "Barlow Condensed", sans-serif;
  font-size: 13px;
  letter-spacing: 0.18em;
}
/* ページ下部ここまで */