@charset "UTF-8";html{overflow-x: hidden;}
body {font-family:'Noto Sans CJK JP', 'Noto Sans JP', sans-serif;position: relative;font-weight: 300;width: 100vw;max-width: 100vw;overflow-x: hidden;}
#wrap {overflow-x: hidden;}
h1 {}
#header {}

a{color:#5db6e7;text-decoration:underline;}
a:hover{text-decoration:none;}


.pc {display: block;}
.sph {display: none;}
@media screen and (max-width: 1120px) {


}
@media screen and (max-width: 767px) {
.pc {display: none;}
.sph {display: block;}
}


/*-------------------------
__footer
-------------------------*/
#footer {
}
.re_top{display:none;height:50px;width:50px;overflow:hidden;position:fixed;z-index:9999;right:15px;bottom:15px;}
.re_top a{display:block;}
.re_top a:hover img{margin-top:-50px;}



/* ==========================================
ベース・PC表示（1061px以上）
========================================== */
header {background: #0058a2;width: 100%;z-index: 100;position: fixed;top: 0;left: 0;}
.header__inner {max-width: 1200px;margin: 0 auto;padding: 20px 40px;display: flex;justify-content: space-between;align-items: center;}
/* ロゴ */
.header h1,
.header p{margin: 0;line-height: 1;}
.header h1 a,
.header p a{display: block;}
.header h1 img,
.header p img{display: block;height: auto;width: 272px;}
/* ナビゲーションメニュー */
.menu ul {display: flex;align-items: center;gap: 30px;list-style: none;margin: 0;padding: 0;}
.menu ul li a {color: #ffffff;text-decoration: none;font-size: 18px;font-weight: 500;white-space: nowrap;position: relative;padding-bottom: 4px;}

/* PC時 Hoverアニメーション（下線が中央から伸びる） */
@media screen and (min-width: 768px) {
.menu ul li a::after {content: '';position: absolute;bottom: 0;left: 50%;width: 0;height: 2px;background-color: #ffffff;transition: width 0.3s ease, left 0.3s ease;}
.menu ul li a:hover::after {width: 100%;left: 0;}
}

/* PC時はハンバーガーボタンとオーバーレイを非表示 */
.hamburger,
.menu-overlay {display: none;}


/* ==========================================
タブレット向け（768px 〜 1060px）
========================================== */
@media screen and (max-width: 1060px) and (min-width: 768px) {
.header__inner {padding: 1.88vw 3.77vw;}
.header h1 img,
.header p img{width: 25.66vw;}
.menu ul {gap: 2.83vw;}
.menu ul li a {font-size: 1.69vw;}
}


/* ==========================================
スマホ向け・ハンバーガーメニュー（767px以下）
========================================== */
@media screen and (max-width: 767px) {
.header__inner {padding: 15px 20px;}
.header h1 img,
.header p img{width: 150px;max-width: 100%;}
/* ハンバーガーボタン表示 */
.hamburger {display: flex;flex-direction: column;justify-content: space-between;width: 30px;height: 22px;background: transparent;border: none;cursor: pointer;padding: 0;z-index: 200;}
.hamburger span {width: 100%;height: 2px;background-color: #ffffff;border-radius: 2px;transition: transform 0.3s ease, opacity 0.3s ease;}

/* ボタンのアニメーション（X印に変形） */
.hamburger.is-active span:nth-child(1) {transform: translateY(10px) rotate(45deg);}
.hamburger.is-active span:nth-child(2) {opacity: 0;}
.hamburger.is-active span:nth-child(3) {transform: translateY(-10px) rotate(-45deg);}
/* ドロワーメニュー表示設定（非表示時は右側画面外へ） */
.menu {display: block;position: fixed;top: 0;right: -100%;width: 80%;max-width: 300px;height: 100vh;background-color: #004077;padding: 80px 20px 40px;box-sizing: border-box;transition: right 0.3s ease;z-index: 150;overflow-y: auto;}
.menu.is-active {right: 0; /* JSで.is-activeが付与されたらスライドイン */}
.menu ul {flex-direction: column;align-items: flex-start;gap: 20px;}
.menu ul li {width: 100%;border-bottom: 1px solid rgba(255, 255, 255, 0.15);padding-bottom: 12px;}
.menu ul li a {font-size: 16px;display: block;width: 100%;padding-bottom: 0;}
/* 背景オーバーレイ */
.menu-overlay {display: block;position: fixed;top: 0;left: 0;width: 100%;height: 100vh;background-color: rgba(0, 0, 0, 0.5);opacity: 0;visibility: hidden;transition: opacity 0.3s ease, visibility 0.3s ease;z-index: 100;}
.menu-overlay.is-active {opacity: 1;visibility: visible;}
}




















/* セクション全体（水色＋格子状グリッド背景） */
.sponsor_cta_section {background-color: rgba(0, 88, 162, 0.1);background-image: 
linear-gradient(#fff 1px, transparent 1px),
linear-gradient(90deg, #fff 1px, transparent 1px);background-size: 30px 30px; /* 格子のサイズ */
padding: 100px 0;}
.sponsor_cta_inner {max-width: 900px;margin: 0 auto;}

/* ----------------------------------------
1. スポンサーエリア
---------------------------------------- */
.sponsor_block {text-align: center;margin-bottom: 60px;}
.sponsor_message {font-size: 24px;font-weight: bold;line-height: 1.6;margin: 0 0 50px;}
.sponsor_logos {display: flex;justify-content: center;align-items: center;gap: 30px;}
.sponsor_card {display: flex;justify-content: center;align-items: center;background-color: #ffffff;width: 420px;box-sizing: border-box;transition: transform 0.3s ease, box-shadow 0.3s ease;}
.sponsor_card:hover {transform: translateY(-3px);box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);}
.sponsor_card img {width: 100%;height: auto;}

/* ----------------------------------------
2. CTA（お問い合わせ）エリア
---------------------------------------- */
.cta_block {width: 100%;}
.cta_btn {display: block;margin: 20px auto 0;padding: 50px 0;background-color: #0058a2;color: #fff;font-size: 18px;line-height: 1; font-weight: 400;text-decoration: none;border-radius: 50vh;transition: opacity 0.3s ease, transform 0.3s ease;box-shadow: 0 8px 20px rgba(0, 86, 179, 0.2);text-align: center;}
.cta_btn:hover {opacity: 0.9;transform: translateY(-2px);}
.cta_title {display: block;font-size: 32px;font-weight: bold;margin-bottom: 30px;letter-spacing: 0.05em;}
.cta_text {font-size: 16px;line-height: 1.7;margin: 0;}
@media screen and (max-width: 1120px) {

.sponsor_cta_section {background-size: 2.67vw 2.67vw;padding: 8.92vw 0;}

.sponsor_block {margin-bottom: 5.35vw;}
.sponsor_message {font-size: 2.14vw;margin: 0 0 4.46vw;}
.sponsor_logos {gap: 2.67vw;}
.sponsor_card {width: 37.5vw;}
.sponsor_card:hover {transform: translateY(-0.26vw);box-shadow: 0 0.53vw 1.33vw rgba(0, 0, 0, 0.1);}
.cta_btn {margin: 1.78vw auto 0;padding: 4.46vw 0;font-size: 1.60vw;box-shadow: 0 0.71vw 1.78vw rgba(0, 86, 179, 0.2);}
.cta_btn:hover {transform: translateY(-0.17vw);}
.cta_title {font-size: 2.85vw;margin-bottom: 2.67vw;}
.cta_text {font-size: 1.42vw;}

}
/* ----------------------------------------
レスポンシブ（スマホ対応 768px以下）
---------------------------------------- */
@media (max-width: 768px) {
.sponsor_cta_section {padding: 10vw 5vw;}
.sponsor_block {margin-bottom: 5vw;}
.sponsor_message {font-size: 3vw;}
.sponsor_logos {flex-direction: column;gap: 15px;}
.sponsor_card {width: 100%;}
.cta_btn {border-radius: 5vw;padding: 5vw 0;}
.cta_title {font-size: 4.6vw;}
.cta_text {font-size: 3vw;}
}






/* フッター全体 */
.footer {background-color: #0058a2;color: #ffffff;padding: 60px 20px;font-family: sans-serif;font-size: 14px;line-height: 1.6;text-align: left;}
.footer__inner {max-width: 1120px;margin: 0 auto;display: flex;justify-content: space-between;align-items: flex-start;gap: 40px;}
/* 左側：会社情報 */
.footer__company {width: 400px;}
.footer__logo img {width: 216px;height: auto;margin-bottom: 40px;}
.footer__description {font-size: 16px;line-height: 1.7;margin-bottom: 32px;}
.footer__copyright {font-size: 12px;font-weight: bold;letter-spacing: 0.05em;}
/* 右側：ナビゲーション */
.footer__nav {display: flex;gap: 60px;}
.footer__nav-column {}
.footer__nav-title {font-size: 18px;font-weight: bold;margin-bottom: 24px;}
.footer__nav-list {list-style: none;}
.footer__nav-list li {margin-bottom: 10px;}
.footer__nav-list a {color: #ffffff;text-decoration: none;font-size: 14px;display: inline-block;transition: opacity 0.3s ease, transform 0.3s ease;}
/* hover 時の動作 */
.footer__nav-list a:hover {text-decoration: underline;transform: translateX(5px);}
@media screen and (max-width: 1120px) {

.footer {padding: 5.35vw 1.78vw;font-size: 1.25vw;}
.footer__inner {gap: 3.57vw;}
.footer__company {width: 35.71vw;}
.footer__logo img {width: 19.28vw;margin-bottom: 3.57vw;}
.footer__description {font-size: 1.42vw;margin-bottom: 2.85vw;}
.footer__copyright {font-size: 1.07vw;}
.footer__nav {gap: 5.35vw;}
.footer__nav-column {}
.footer__nav-title {font-size: 1.60vw;margin-bottom: 2.14vw;}
.footer__nav-list li {margin-bottom: 0.89vw;}
.footer__nav-list a {font-size: 1.25vw;}
.footer__nav-list a:hover {transform: translateX(0.44vw);}

}

@media (max-width:768px){
.footer{padding:10vw;}
.footer__inner{flex-direction:column;gap:10vw;align-items:flex-start;}
.footer__nav{order:1;flex-wrap:wrap;gap:5vw;width:100%;justify-content:flex-start;}
.footer__company{order:2;width:80vw;text-align:center;}
.footer__logo img{width:60vw;margin:0 auto 2.5vw;}
.footer__description{font-size:3vw;margin-bottom:2.5vw;}
.footer__copyright{font-size:3vw;}
.footer__nav-column{width:100%;}
.footer__nav-title{font-size:3.6vw;margin-bottom:2.5vw;}
.footer__nav-list li{margin-bottom:3vw;}
.footer__nav-list a{font-size:3vw;}
}






/* タイトルエリア */
.block_title {margin-bottom: 50px;}
.block_title h2 {font-size: 38px;font-weight: 700;color: #000000;line-height: 1.3;margin: 0;}
.block_title h2 span {display: block;font-size: 32px;color: #0058a2;font-weight: 700;margin-bottom: 8px;}
.block_title::after {content: '';display: block;width: 50px; /* 全体の線の長さ */height: 3px; /* 線の太さ */margin: 40px 0 0; /* 左揃え配置 */
/* 左から15px分を黄色、残りを青に設定 */background: linear-gradient(to right, #f8c058 0px, #f8c058 15px, #0058a2 15px, #0058a2 100%);}
@media screen and (max-width: 1120px) {
.block_title {margin-bottom: 4.46vw;}
.block_title h2 {font-size: 3.39vw;}
.block_title h2 span {font-size: 2.85vw;margin-bottom: 0.71vw;}
.block_title::after {width: 4.46vw;height: 0.26vw;margin: 3.57vw 0 0;background: linear-gradient(to right, #f8c058 0px, #f8c058 1.33vw, #0058a2 1.33vw, #0058a2 100%);}

}
@media screen and (max-width: 767px) {
.block_title h2 {font-size: 5vw;}
.block_title h2 span {font-size: 3vw;}
.block_title::after {width: 12vw;height: .5vw;margin: 4vw 0 0;background: linear-gradient(to right, #f8c058 0px, #f8c058 4vw, #0058a2 4vw, #0058a2 100%);}
}




/* すべての .fade-in（h2, p, li など共通） */
.fade-in {
  opacity: 0;
  transform: translateY(30px);
  
  /* スピードと減速感を全要素で統一 (1.2秒かけてゆっくり着地) */
  transition: opacity 1.2s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
  
  will-change: opacity, transform;
}

/* 表示時の共通状態 */
.fade-in.is-active {
  opacity: 1;
  transform: translateY(0);
}


/* ==========================================
   .pickup_card 対策（他CSSによる上書きを強制ガード）
   ========================================== */
ul.pickup_card li.fade-in {
  /* transition の対象を明示し、時間(1.2s)を強固に固定 */
  transition-property: opacity, transform !important;
  transition-duration: 1.2s !important;
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* カード内部の a タグ等の transition が干渉しないように分離 */
ul.pickup_card li.fade-in a {
  /* ホバー用の transition などがある場合、表示アニメーションとバッティングしないよう指定 */
  transition: transform 0.3s ease, opacity 0.3s ease;
}



/* ==========================================
   右から左へふわっと表示（スピード統一版）
   ========================================== */
.fade-in-right {
  opacity: 0;
  /* 初期位置：右に30pxずらす */
  transform: translateX(30px);
  
  /* スピード（1.2秒）と滑らかなイージング（cubic-bezier）を統一 */
  transition: opacity 1.2s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
  
  will-change: opacity, transform; /* 描画最適化 */
}

/* 表示時の状態：透明度1、元の位置に戻る */
.fade-in-right.is-active {
  opacity: 1;
  transform: translateX(0);
}


.topic_path{clear:both;padding:10px;}
.topic_path ul{width:100%;text-align:left;}
.topic_path li{font-size:14px;line-height:1.4;color:#000;vertical-align:top;display:inline-block;}
.topic_path li:before{content:">";color:#000;margin-left:5px;margin-right:5px;}
.topic_path li:first-child:before{content:"";margin:0;}
.topic_path li a{color:#000;text-decoration:underline;}
.topic_path li a:hover{text-decoration:none;}

@media screen and (max-width: 1060px) {
  .topic_path{padding:0.89vw;}
  .topic_path li{font-size:1.25vw;}
  .topic_path li:before{margin-left:0.44vw;margin-right:0.44vw;}
}

@media screen and (max-width: 767px) {
  .topic_path{padding:5vw;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .topic_path ul{white-space:nowrap;}
  .topic_path li{font-size:2.8vw;}
  .topic_path li:before{margin-left:0.44vw;margin-right:0.44vw;}
}




.page_title {min-width: 100vw;width: 100%; padding: 200px 0 100px;margin: 0 0 100px; background: #465050;}
.page_title .title_block {width: 80%;margin: auto;text-align: left;}
.page_title .title_block p {font-size:4vw;line-height: 1.2;font-weight: 700; color: #fff;font-family: Barlow,Noto Sans JP,sans-serif;margin: 0 0 10px;}
.page_title .title_block h2 {font-size:1.2vw;line-height: 1.2;font-weight: 700; color: #fff;margin: 0 0 20px;}

@media screen and (max-width: 1060px) {
.page_title .title_block {width: 90%;margin: auto;text-align: left;}
.page_title .title_block p {font-size:5vw;line-height: 1.2;font-weight: 700; color: #fff;font-family: Barlow,Noto Sans JP,sans-serif;margin: 0 0 10px;}
.page_title .title_block h2 {font-size:2.2vw;line-height: 1.2;font-weight: 700; color: #fff;margin: 0 0 20px;}
}
@media screen and (max-width: 767px) {
.page_title {padding: 25% 0 10%;margin: 0 0 10%; background: #465050;}
.page_title .title_block {width: 90%;margin: auto;text-align: left;}
.page_title .title_block p {font-size:8vw;line-height: 1.2;font-weight: 700; color: #fff;font-family: Barlow,Noto Sans JP,sans-serif;margin: 0 0 10px;}
.page_title .title_block h2 {font-size:3vw;line-height: 1.2;font-weight: 700; color: #fff;margin: 0 0 20px;}
}



.flex{
display:flex;
flex-wrap: wrap;
}

.box{
box-sizing:border-box;
list-style: none;
}

.box{
opacity: 0;
}


.fadeUp {
animation-name:fadeUpAnime;
animation-duration:0.8s;
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeUpAnime{
from {
opacity: 0;
transform: translateY(100px);
}

to {
opacity: 1;
transform: translateY(0);
}
}
.fadeUpTrigger{
opacity: 0;
}
.faderight {
animation-name:faderightAnime;
animation-duration:0.8s;
animation-fill-mode:forwards;
}

@keyframes faderightAnime{
from {
opacity: 0;
transform: translateX(100px);
}

to {
opacity: 1;
transform: translateX(0);
}
}
.faderightTrigger{
opacity: 0;
}