 :root{
    --blue:#1FAADB;
    --blue-dark:#0E7FA8;
    --pink:#FF6B93;
    --yellow:#FFC93C;
    --green:#3FBF7F;
    --navy:#1B3B5F;
    --cream:#FFF9EF;
    --ink:#25313F;
    --radius:20px;
    --shadow:0 8px 24px rgba(27,59,95,0.12);
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:"M PLUS Rounded 1c","Zen Maru Gothic",sans-serif;
    color:var(--ink);
    background:var(--cream);
    line-height:1.8;
  }
  h1,h2,h3,h4{font-family:"Zen Maru Gothic",sans-serif; margin:0; color:var(--navy);}
  p{margin:0 0 1em;}
  img,svg{max-width:100%; display:block;}
  a{color:inherit;}
  .wrap{max-width:1100px; margin:0 auto; padding:0 24px;}
  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:6px;
    padding:14px 28px; border-radius:999px; font-weight:700; font-size:16px;
    text-decoration:none; cursor:pointer; border:none; transition:transform .15s ease, box-shadow .15s ease;
  }
  .btn:hover{transform:translateY(-2px);}
  .btn-primary{background:var(--pink); color:#fff; box-shadow:0 6px 16px rgba(255,107,147,0.4);}
  .btn-outline{background:#fff; color:var(--navy); border:2px solid var(--navy);}
  .btn-blue{background:var(--blue); color:#fff; box-shadow:0 6px 16px rgba(31,170,219,0.35);}
  .btn-sm{padding:8px 18px; font-size:14px;}
  .tag{
    display:inline-block; padding:4px 12px; border-radius:999px; font-size:12px; font-weight:700;
  }
  .tag-sport{background:#E3F6FF; color:var(--blue-dark);}
  .tag-culture{background:#FFE9F0; color:#C43C63;}
  .tag-trial{background:#E9FBF1; color:#1E8F53;}
  section{padding:80px 0;}
  .section-head{text-align:center; max-width:680px; margin:0 auto 48px;}
  .section-head .eyebrow{
    display:inline-block; font-size:13px; font-weight:700; color:var(--pink); letter-spacing:.1em;
    background:#fff; padding:6px 16px; border-radius:999px; margin-bottom:14px; box-shadow:var(--shadow);
  }
  .section-head h2{font-size:clamp(24px,4vw,34px); margin-bottom:12px;}
  .section-head p{color:#5A6B7B; margin-bottom:0;}

  /* Header */
  header{
    position:sticky; top:0; z-index:100; background:rgba(255,249,239,0.92); backdrop-filter:blur(6px);
    border-bottom:1px solid rgba(27,59,95,0.08);
  }
  .nav{display:flex; align-items:center; justify-content:space-between; padding:14px 24px;}
  .logo{display:flex; align-items:center; gap:8px; font-weight:900; font-size:24px; color:var(--navy); text-decoration:none; 
}
    .logo img{ height:40px;}
    .footer .logo img{ height:60px;}

  
  .logo .star{color:var(--pink);}
  .nav-links{display:flex; align-items:center; gap:28px; list-style:none; margin:0; padding:0;}
  .nav-links a{text-decoration:none; font-weight:700; font-size:14px; color:var(--navy);}
  .nav-cta{display:flex; align-items:center; gap:12px;}
  .menu-btn{display:none; background:none; border:none; font-size:26px; color:var(--navy); cursor:pointer;}
  @media (max-width:860px){


    .nav-links{
      position:fixed; inset:64px 0 auto 0; background:#fff; flex-direction:column; align-items:flex-start;
      padding:20px 28px; gap:18px; box-shadow:var(--shadow); transform:translateY(-130%); transition:transform .25s ease;
    }
    .nav-links.open{transform:translateY(0);}
    .menu-btn{display:block;}
    .nav-cta .btn-outline{display:none;}
  }

  /* Hero */
  .hero{
    position:relative; overflow:hidden; padding:56px 0 40px;
    background:linear-gradient(180deg,#EAF9FF 0%, var(--cream) 75%);
  }
  .hero .wrap{display:grid; grid-template-columns:1.05fr 1fr; gap:32px; align-items:center;}
  @media (max-width:900px){ .hero .wrap{grid-template-columns:1fr;} .hero-copy{order:1;} .hero-visual{order:2;} }
  .hero-copy .eyebrow{
    display:inline-block; background:#fff; color:var(--blue-dark); font-weight:700; font-size:13px;
    padding:6px 16px; border-radius:999px; margin-bottom:18px; box-shadow:var(--shadow);
  }
  .hero-copy h1{font-size:clamp(30px,4.6vw,46px); line-height:1.35; margin-bottom:18px;}
  .hero-copy h1 .accent{color:var(--pink);}
  .hero-copy .lead{font-size:16px; color:#425569; max-width:480px;}
  .hero-actions{display:flex; gap:14px; flex-wrap:wrap; margin-top:26px;}
  .hero-badges{display:flex; gap:10px; flex-wrap:wrap; margin-top:28px;}
  .hero-badge{
    background:#fff; border-radius:14px; padding:10px 16px; box-shadow:var(--shadow); font-size:13px; font-weight:700;
    display:flex; align-items:center; gap:8px;
  }
  .hero-badge b{font-size:20px; color:var(--pink);}
  .hero-visual{position:relative;}
  .float-star{position:absolute; color:var(--yellow); animation:float 3.5s ease-in-out infinite;}
  @keyframes float{0%,100%{transform:translateY(0);} 50%{transform:translateY(-10px);}}

  /* About */
  .about-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:start;}
  @media (max-width:860px){.about-grid{grid-template-columns:1fr;}}
  .about-card{background:#fff; border-radius:var(--radius); padding:28px; box-shadow:var(--shadow); margin-bottom:20px;}
  .meaning-list{display:flex; flex-direction:column; gap:14px;}
  .meaning-item{display:flex; gap:14px; align-items:flex-start; background:#fff; border-radius:16px; padding:16px 18px; box-shadow:var(--shadow);}
  .meaning-item .num{
    flex:none; width:40px; height:40px; border-radius:50%; background:var(--pink); color:#fff; font-weight:900;
    display:flex; align-items:center; justify-content:center; font-size:15px;
  }
  .stat-row{display:flex; gap:16px; margin-top:20px; flex-wrap:wrap;}
  .stat-box{flex:1; min-width:130px; background:var(--navy); color:#fff; border-radius:16px; padding:18px; text-align:center;}
  .stat-box .num{font-size:28px; font-weight:900; color:var(--yellow);}
  .stat-box .label{font-size:12px; opacity:.85;}

  /* Benefits */
  .benefit-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
  @media (max-width:900px){.benefit-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:520px){.benefit-grid{grid-template-columns:1fr;}}
  .benefit-card{background:#fff; border-radius:var(--radius); padding:26px 20px; box-shadow:var(--shadow); text-align:center;}
  .benefit-card .icon{
    width:60px; height:60px; margin:0 auto 14px; border-radius:50%; background:#EAF9FF; display:flex; align-items:center; justify-content:center;
  }
  .benefit-card h3{font-size:16px; margin-bottom:8px;}
  .benefit-card p{font-size:13px; color:#5A6B7B; margin:0;}

  /* Caution */
  .caution{background:#FFF3E9;}
  .caution-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
  @media (max-width:800px){.caution-grid{grid-template-columns:1fr;}}
  .caution-card{background:#fff; border-radius:var(--radius); padding:26px; box-shadow:var(--shadow); border-left:6px solid #FF9346;}
  .caution-card h3{font-size:17px; margin-bottom:10px; display:flex; align-items:center; gap:8px;}
  .caution-card p{font-size:14px; color:#5A6B7B; margin:0;}

  /* Target */
  .target-grid{display:grid; grid-template-columns:1fr 1fr; gap:28px;}
  @media (max-width:800px){.target-grid{grid-template-columns:1fr;}}
  .target-card{background:#fff; border-radius:var(--radius); padding:26px; box-shadow:var(--shadow);}
  .target-card h3{font-size:16px; margin-bottom:14px; color:var(--blue-dark);}
  .school-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
  .school-list li{
    display:flex; justify-content:space-between; background:#F5FAFD; border-radius:10px; padding:10px 14px; font-size:14px;
  }
  .school-list li span{color:#7C8B99; font-size:12px;}

  /* Search */
  .search-section{background:#fff;}
  .search-panel{background:var(--navy); border-radius:24px; padding:28px; margin-bottom:32px;}
  .search-row{display:flex; gap:14px; flex-wrap:wrap; align-items:center;}
  .search-field{flex:1; min-width:180px;}
  .search-field label{display:block; color:#BFD9EA; font-size:12px; font-weight:700; margin-bottom:6px;}
  .search-field select, .search-field input{
    width:100%; padding:12px 14px; border-radius:12px; border:none; font-size:14px; font-family:inherit;
  }
  .tab-row{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:6px;}
  .tab-btn{
    padding:9px 18px; border-radius:999px; border:2px solid rgba(255,255,255,0.25); background:transparent; color:#fff;
    font-weight:700; font-size:13px; cursor:pointer; font-family:inherit;
  }
  .tab-btn.active{background:var(--yellow); color:var(--navy); border-color:var(--yellow);}
  .check-row{display:flex; align-items:center; gap:8px; color:#BFD9EA; font-size:13px; font-weight:700;}
  .result-meta{display:flex; justify-content:center; align-items:center; margin-bottom:16px; flex-wrap:wrap; gap:8px;}
  .result-meta .count{font-weight:700; color:var(--navy);}
  .result-meta .note{font-size:12px; color:#8E9BA8;}
  .club-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
  @media (max-width:900px){.club-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:600px){.club-grid{grid-template-columns:1fr;}}

.club-grid-wrap--first {
  max-height: 1200px;
  overflow: hidden;
  position: relative;
}
.club-grid-wrap--first:before {
  content: '';
  height: 120px;
  width: 100%;
  z-index: 1;
  position: absolute;
  bottom: 0;
  left: 0;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, #ffffff 100%);
}
.club-grid--more{
	background:#fff;
	display:none;
	line-height:1;
	position: absolute;
	bottom:24px;
	left:50%;
	z-index: 2;
	transform: translateX(-50%);
	color: var(--pink);
	letter-spacing: .1em;
	background: #fff;
	padding: 6px 16px;
	border-radius: 999px;
	box-shadow: var(--shadow);
	font-weight: bold;
	white-space: nowrap;
	cursor: pointer;
}
.club-grid-wrap--first .club-grid--more{
	display: block;
}


  .club-card{
    background:#fff; border:1px solid #EDEFF2; border-radius:18px; padding:20px; box-shadow:var(--shadow);
    display:flex; flex-direction:column; gap:10px;
  }
  .club-card .tags{display:flex; gap:6px; flex-wrap:wrap;}
  .club-card h4{font-size:16px; margin:0;}
  .club-meta{font-size:13px; color:#5A6B7B; display:flex; flex-direction:column; gap:4px;}
  .club-meta span{display:flex; gap:6px; align-items:center;}
  .club-actions{margin-top:auto; display:flex; gap:8px;}
  .empty-state{text-align:center; padding:60px 20px; color:#8E9BA8; display:none;}

.club-table th{
	text-align: left;
	white-space: nowrap;
	width:7em;
}
.club-table th,
.club-table td{
	padding-top:10px;
	padding-bottom:10px;
}


@media (max-width:800px){
	.club-table table,
	.club-table thead,
	.club-table tbody,
	.club-table tr,
	.club-table th,
	.club-table td{
		width:100%;
		display: block;
	}
	.club-table th,
	.club-table td{
	padding-top:0;
	padding-bottom:0;
	}
	.club-table tr + tr th{
		margin-top:1em;
	}
}
.club-communications{
	line-height: 1;
	background: var(--navy);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	padding: 1em 0;
}
.club-communications p{
	color: #BFD9EA;
	font-size: 12px;
	font-weight: 700;
	margin-bottom: 6px;	
	text-align: center;
}
.club-communications ul{
	display: flex;
	align-items: center;
	justify-content: center;
	margin:0;
	padding:0;
	list-style: none;
}
.club-communications li{
	margin:0 0.5em;
	padding:0;
	list-style: none;
}
.club-communications a{
	display: block;
	background-color: #fff;
	border-radius: 50%;
}
.club-communications svg,
.club-communications img{
	height:2.4em;
}

  /* Flow */
  .flow-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
  @media (max-width:900px){.flow-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:520px){.flow-grid{grid-template-columns:1fr;}}
  .flow-card{background:#fff; border-radius:18px; padding:22px; box-shadow:var(--shadow); position:relative;}
  .flow-card .step{
    width:34px; height:34px; border-radius:50%; background:var(--blue); color:#fff; font-weight:900;
    display:flex; align-items:center; justify-content:center; margin-bottom:12px; font-size:14px;
  }
  .flow-card h4{font-size:15px; margin-bottom:6px;}
  .flow-card p{font-size:13px; color:#5A6B7B; margin:0;}

  /* News */
  .news-list{display:flex; flex-direction:column; border-top:1px solid #EDEFF2;}
  .news-item{
    display:flex; gap:20px; align-items:baseline; padding:18px 4px; border-bottom:1px solid #EDEFF2; flex-wrap:wrap;
  }
  .news-item a{
	  display: block;
	  text-decoration: none;
  }
  .news-item a .title{
	  text-decoration: underline;
  }
  .news-item a:hover .title{
	  text-decoration: none;
  }


  .news-item .date{font-size:13px; color:#8E9BA8; flex:none; width:100px;}
  .news-item .cat{flex:none;}
  .news-item .title{font-size:14px; font-weight:700; color:var(--navy);}
  @media (max-width:800px){
	  .news-item .title{
		  display: block;
	  }
  }

  /* FAQ */
  .faq-list{display:flex; flex-direction:column; gap:12px;}
  details{background:#fff; border-radius:14px; box-shadow:var(--shadow); padding:4px 20px;}
  summary{
    cursor:pointer; padding:16px 0; font-weight:700; font-size:15px; list-style:none; display:flex; justify-content:space-between; align-items:center;
  }
  summary::-webkit-details-marker{display:none;}
  summary:after{content:"+"; font-size:22px; color:var(--pink); font-weight:400;}
  details[open] summary:after{content:"−";}
  details p{font-size:14px; color:#5A6B7B; padding-bottom:16px; margin:0;}

  /* Contact */
  .contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
  @media (max-width:800px){.contact-grid{grid-template-columns:1fr;}}
  .contact-card{background:#fff; border-radius:var(--radius); padding:28px; box-shadow:var(--shadow);}
  .contact-card h3{font-size:17px; margin-bottom:10px;}
  .contact-card p{font-size:14px; color:#5A6B7B;}
  .contact-info{font-size:13px; color:var(--navy); background:#F5FAFD; border-radius:12px; padding:14px 16px; margin-top:14px;}

  /* Organizer */
  .org-card{
    background:var(--navy); color:#fff; border-radius:var(--radius); padding:32px; display:flex; gap:24px; align-items:center; flex-wrap:wrap;
  }
  .org-card-wrap{
	  text-decoration: none;
	  display: block;
  }
  .org-card .org-logo{
    flex:none; width:72px; height:72px; border-radius:18px; display:flex; align-items:center; justify-content:center;
    font-weight:900; color:var(--navy); font-size:22px;
  }
  @media (max-width:900px){

   .org-card .org-logo{
		display: none;
    }
   }

  .org-card h3{color:#fff; font-size:18px; margin-bottom:6px;}
  .org-card p{color:#C9DAE8; font-size:13px; margin:0;}

  footer{background:var(--navy); color:#C9DAE8; padding:48px 0 24px; font-size:13px;}
  .footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:32px; padding-bottom:32px; border-bottom:1px solid rgba(255,255,255,0.12);}
  @media (max-width:700px){.footer-grid{grid-template-columns:1fr;}}
  footer h5{color:#fff; font-size:13px; margin-bottom:14px;}
  footer ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
  footer a{text-decoration:none; color:#C9DAE8;}
  .footer-bottom{padding-top:20px; display:flex; justify-content:center; flex-wrap:wrap; gap:10px;}

.page{
	background: #fff;
}
.page h1{
	text-align: center;
}