@charset "UTF-8";
* {
box-sizing: border-box;
margin: 0;
padding: 0; }
html {
scroll-behavior: smooth;
background: #000000;
color: #ffffff;
font-family: "Noto Sans JP", sans-serif;
-webkit-font-smoothing: antialiased; }
body {
overflow-x: hidden;
font-family: "Noto Sans JP", sans-serif;
font-feature-settings: 'palt';
background-color: #000000; }
.c-inner {
max-width: 1440px;
margin: 0 auto;
position: relative;
z-index: 2;
display: flex;
flex-direction: column; }
.u-font-en {
font-family: "Roboto", sans-serif; }
.u-font-mincho {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif; }
.u-font-gothic {
font-family: "Noto Sans JP", sans-serif; }
.sp {
display: none; }
.reveal {
opacity: 0;
transform: translateY(30px);
transition: opacity 0.8s cubic-bezier(0.2, 0.72, 0.2, 1), transform 0.8s cubic-bezier(0.2, 0.72, 0.2, 1); }
.reveal.show {
opacity: 1;
transform: translateY(0);
margin-top: 0; }
.reveal.d1 {
transition-delay: 0.15s; }
.reveal.d2 {
transition-delay: 0.3s; }
.reveal.d3 {
transition-delay: 0.45s; }
.reveal.c-highlight-box,
.reveal.show.c-highlight-box {
transform: translateY(30px); }
.p-progress {
position: fixed;
top: 0;
left: 0;
height: 3px;
background: #4b88f6;
z-index: 1000;
width: 0%;
transition: width 0.1s linear; }
/* 共通ロゴブランディング */
.c-brand {
display: flex;
align-items: center;
gap: 20px;
text-decoration: none;
color: #fff; }
.c-brand__symbol {
width: 80px;
height: 80px;
min-width: 80px;
min-height: 80px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0; }
.c-brand__symbol img {
width: 100%;
height: 100%;
display: block; }
.c-brand__text {
display: flex;
flex-direction: column; }
.c-brand__title {
font-family: "Roboto", sans-serif;
font-size: 26px;
font-weight: 700;
line-height: 1.0;
letter-spacing: 0.02em; }
.c-brand__sub {
font-family: "Roboto", sans-serif;
font-size: 15px;
letter-spacing: 0.12em;
color: rgba(255, 255, 255, 0.8);
margin-top: 4px; }
.c-brand__outline-en {
font-family: "Roboto", sans-serif;
font-size: 20px; }
.c-brand__outline-date {
font-size: 24px; }
.c-brand__outline-week {
font-size: 14px; }
/* 共通ハンバーガーメニュー */
.c-menu-toggle {
background: none;
border: none;
color: #fff;
cursor: pointer;
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
position: relative;
z-index: 1000; }
.c-menu-toggle span.u-font-en {
font-family: "Roboto", sans-serif;
font-size: 18px;
letter-spacing: 0.12em;
font-weight: 700; }
.c-menu-toggle.active .c-hamburger span:nth-child(1) {
transform: translateY(13px) rotate(45deg); }
.c-menu-toggle.active .c-hamburger span:nth-child(2) {
opacity: 0; }
.c-menu-toggle.active .c-hamburger span:nth-child(3) {
transform: translateY(-13px) rotate(-45deg); }
.c-hamburger {
width: 56px;
height: 29px;
display: flex;
flex-direction: column;
justify-content: space-between;
position: relative; }
.c-hamburger span {
display: block;
width: 56px;
height: 3px;
background: #fff;
transition: transform 0.3s ease, opacity 0.3s ease;
transform-origin: center; }
/* 共通ナビゲーション（全画面メニュー） */
.nav-morph {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: rgba(5, 10, 20, 0.95);
z-index: 999;
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity 0.4s ease, visibility 0.4s ease; }
.nav-morph.active {
opacity: 1;
visibility: visible;
pointer-events: auto; }
.nav-morph__list {
list-style: none;
padding: 0;
margin: 0;
text-align: center; }
.nav-morph__item {
margin: 24px 0; }
.nav-morph__link {
color: #fff;
text-decoration: none;
font-size: 28px;
display: inline-block;
overflow: hidden;
height: 1.5em;
position: relative; }
/* 共通ハイライトボックス */
.c-highlight-box {
position: relative;
display: inline-block;
vertical-align: text-bottom;
padding: 4px 10px;
color: #333333;
line-height: 1.25;
background-color: #ffffff;
z-index: 1;
overflow: hidden;
transition: color 0.3s ease 0.2s;
transform: translateY(0) !important; }
.c-highlight-box::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 0%;
height: 100%;
background-color: #5895ed;
z-index: -1;
transition: width 0.8s cubic-bezier(0.16, 1, 0.3, 1); }
.c-highlight-box.show {
color: #ffffff !important; }
.c-highlight-box.show::before {
width: 100%; }
/* 共通キッカー */
.c-kicker {
display: inline-block;
width: 429px;
font-family: "Noto Sans JP", sans-serif;
font-size: 18px;
color: #333333;
text-align: center;
border: 1px solid #b5b5b5;
padding: 4px 10px;
background: #ffffff;
letter-spacing: 0.05em; }
.c-kicker-frame {
display: inline-block;
width: 430px;
font-family: "Roboto", sans-serif;
font-size: 18px;
letter-spacing: 0.1em;
color: #ffffff;
border: 1px solid rgba(255, 255, 255, 0.4);
padding: 6px 24px;
margin-bottom: 80px;
text-align: center;
text-transform: uppercase; }
/* 共通ボタン類 */
.c-btn-sub {
font-family: "Noto Sans JP", sans-serif;
font-size: 18px;
width: 20em;
border: 1px solid rgba(255, 255, 255, 0.5);
background: rgba(0, 0, 0, 0.6);
color: #fff;
text-decoration: none;
letter-spacing: 0.1em;
display: inline-flex;
align-items: center;
justify-content: center;
transition: all 0.3s ease;
padding: 2px; }
.c-btn-sub:hover {
border-color: #fff;
background: rgba(255, 255, 255, 0.2); }
.c-btn-sub--arrow {
position: relative;
width: 180px;
color: #fff;
padding: 2px 18px 2px 2px;
background: transparent;
border: none; }
.c-btn-sub--arrow::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url('data:image/svg+xml;utf8,');
background-size: 100% 100%;
background-repeat: no-repeat;
z-index: -1;
transition: all 0.3s ease; }
.c-btn-sub--arrow:hover {
background: none; }
.c-btn-sub--arrow:hover::after {
background-image: url('data:image/svg+xml;utf8,'); }
.c-btn-primary {
font-family: "Noto Sans JP", sans-serif;
background: linear-gradient(90deg, #4b88f6 0%, #619bf8 100%);
color: #fff;
text-decoration: none;
font-weight: 500;
display: inline-flex;
align-items: center;
justify-content: center;
transition: all 0.3s ease; }
.c-btn-primary--fixed {
position: fixed;
right: 0;
bottom: 120px;
z-index: 9000;
background: none; }
.c-btn-primary--fixed .c-btn-primary--fixed-inner {
position: relative;
display: table;
font-size: 26px;
padding: 5px 48px;
border-radius: 32px 0 0 32px;
letter-spacing: 0.25em;
background: linear-gradient(90deg, #4b88f6 0%, #619bf8 100%);
border-right: none;
z-index: 50;
transition: 0.5s; }
.c-btn-primary--fixed .c-btn-primary--fixed-inner:hover {
opacity: 0.9;
transform: scale(1.02);
box-shadow: 0 0 35px rgba(75, 136, 246, 0.9);
background: linear-gradient(135deg, #48cae4 0%, #0096c7 100%); }
.c-btn-primary--fixed:before {
content: " ";
display: block;
width: 200px;
height: 200px;
background: url("images/section01/circle_small.webp") no-repeat center center/contain;
position: absolute;
right: -100px;
z-index: 10; }
.c-btn-primary--large {
min-width: 280px;
font-size: 20px;
font-weight: 700;
line-height: 1.2;
padding: 8px 20px;
background: #5f98e3;
border-radius: 0; }
.c-btn-primary--large:hover {
transform: translateY(-3px);
box-shadow: 0 12px 32px rgba(0, 180, 216, 0.5);
background: linear-gradient(135deg, #48cae4 0%, #0096c7 100%); }
/* 共通矢印（シェブロン） */
.c-arrow-sep {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0;
z-index: 3;
vertical-align: middle;
position: relative; }
.c-arrow-sep::before {
content: " ";
display: block;
width: 48px;
height: 22px;
background: #ffffff;
position: absolute;
right: 0; }
.c-arrow-sep__chevron {
display: inline-block;
width: 24px;
height: 22px;
background-color: #888888;
clip-path: polygon(0px 1px, 2.2px 1px, 24px 11px, 2.2px 21px, 0px 21px, 21.4px 11px); }
.c-arrow-sep--end {
position: absolute;
top: 2.05rem;
right: -6rem; }
/* 共通オーブ円形アイコン */
.c-orb-bg {
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
position: relative;
flex-shrink: 0; }
.c-orb-bg--small {
width: 88px;
height: 88px;
background-image: url("images/section02/bg_year_small.webp");
border-radius: 50%; }
.c-orb-bg--small::after {
content: "";
display: block;
width: 14px;
height: 14px;
background: #ffffff;
border-radius: 50%;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 10;
box-shadow: 0 0 2px rgba(0, 0, 0, 0.2); }
.c-orb-bg--large {
width: 100px;
height: 100px;
background-image: url("images/section02/bg_year_large.webp");
border-radius: 50%; }
.c-orb-bg--large::after {
content: "";
display: block;
width: 14px;
height: 14px;
background: #ffffff;
border-radius: 50%;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 10; }
/* 共通ノード（ネットワーク用） */
.c-node-circle {
position: absolute;
border-radius: 50%;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
opacity: 0;
animation: fadeInSoft 1.2s cubic-bezier(0.25, 1, 0.5, 1) forwards, float 3s ease-in-out infinite; }
.c-node-circle--blue {
border: 1.5px solid #5895ed;
background: rgba(0, 0, 0, 0.65);
backdrop-filter: blur(4px); }
.c-node-circle--blue a {
display: flex;
flex-flow: column;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
text-decoration: none;
padding: 20px;
border-radius: 50%;
transition: 0.5s; }
.c-node-circle--blue a:hover {
background: rgba(255, 255, 255, 0.2); }
.c-node-circle--blue a[href="#."] {
pointer-events: none; }
.c-node-circle--black {
border: 1px solid rgba(255, 255, 255, 0.7);
background: #000000;
color: #ffffff;
padding: 15px; }
.c-node-circle__cat-label {
font-family: "Roboto", sans-serif;
font-size: min(13px, 0.9028vw);
letter-spacing: 0.12em;
color: #888888;
margin-bottom: min(10px, 0.6944vw); }
.c-node-circle__main-copy {
font-family: "Noto Sans JP", sans-serif;
font-size: min(28px, 1.6433vw);
line-height: 1.4;
color: #5895ed;
font-weight: 700;
margin-bottom: min(10px, 0.6944vw); }
.c-node-circle__sub-copy {
font-family: "Noto Sans JP", sans-serif;
font-size: min(16.5px, 1.1458vw);
line-height: 1.8;
color: #ffffff;
font-weight: 400;
margin-bottom: min(10px, 0.6944vw); }
.c-node-circle__btn {
display: table;
color: #111111;
padding: 2px 20px;
background: #5895ed; }
.c-node-circle__award-title {
font-family: "Noto Sans JP", sans-serif;
font-size: min(19px, 1.3194vw);
line-height: 1.8; }
.c-node-circle__award-name {
font-family: "Noto Sans JP", sans-serif;
font-weight: 700;
font-size: min(14px, 0.9458vw);
color: #5895ed;
line-height: 1.8;
margin-bottom: 10px; }
.c-node-circle__winner-name {
font-family: "Noto Sans JP", sans-serif;
font-size: min(33px, 2.2917vw);
font-weight: 600; }
.c-node-circle__winner-etc {
font-family: "Noto Sans JP", sans-serif;
font-size: clamp(14px, 0.9vw, 19px);
margin-top: min(2px, 0.1389vw); }
/* ページ内リンク */
.scroll__link {
display: flex;
flex-flow: column;
align-items: center;
gap: 5px;
font-size: 18px;
color: #ffffff;
text-decoration: none;
background: none;
border: none;
position: fixed;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
z-index: 100;
transition: opacity 0.3s ease, visibility 0.3s ease, color 0.3s ease;
opacity: 1;
visibility: visible; }
.scroll__link.is-hidden {
opacity: 0;
visibility: hidden;
pointer-events: none; }
.scroll__link__text {
color: #ffffff;
transition: color 0.3s ease; }
.scroll__link__line {
display: block;
width: 4px;
height: 78px;
position: relative;
overflow: hidden;
background: rgba(255, 255, 255, 0.2);
transition: background-color 0.3s ease; }
.scroll__link__line::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, white 0%, rgba(255, 255, 255, 0) 100%);
animation: scrollMove 2s infinite cubic-bezier(0.77, 0, 0.175, 1);
transition: background 0.3s ease; }
.scroll__link:hover .scroll__link__line::after {
background: linear-gradient(to bottom, #48cae4 0%, rgba(255, 255, 255, 0) 100%); }
.scroll__link.is-dark .scroll__link__text {
color: #000000; }
.scroll__link.is-dark .scroll__link__line {
background: rgba(0, 0, 0, 0.15); }
.scroll__link.is-dark .scroll__link__line::after {
background: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, 0) 100%); }
.scroll__link.is-dark:hover .scroll__link__line::after {
background: linear-gradient(to bottom, #0077b6 0%, rgba(0, 0, 0, 0) 100%); }
.l-header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 120px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 60px;
z-index: 9999;
background: linear-gradient(180deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 100%); }
.l-header .c-brand-wrapper {
display: flex;
align-items: center;
gap: 20px; }
.sec-hero {
position: relative;
min-height: 100vh;
padding: 120px 0 40px;
display: flex;
flex-direction: column;
justify-content: space-between;
overflow: hidden;
background-color: #000; }
.sec-hero__bg-layer {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url("images/section01/bg_header.webp") center center/cover no-repeat;
opacity: 0.6;
z-index: 1;
pointer-events: none; }
.sec-hero__grid {
position: relative;
z-index: 2;
display: grid;
grid-template-columns: 1.2fr 0.8fr;
gap: 20px;
align-items: center;
max-width: 1440px;
margin: 0 auto 30px auto;
width: 100%; }
.sec-hero__grid.c-inner {
padding: 60px 0; }
.sec-hero__grid::before {
content: "";
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
width: 100vw;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
z-index: -1;
pointer-events: none; }
.sec-hero__title {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 81px;
line-height: 1.2;
font-weight: 400;
letter-spacing: 0.02em;
color: #ffffff;
margin-bottom: 40px; }
.sec-hero__title-num {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 88.5px;
color: #4b88f6; }
.sec-hero__title-unit {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 81px;
color: #4b88f6; }
.sec-hero__lead {
font-family: "Noto Sans JP", sans-serif;
font-size: 30px;
color: #5f98e3;
line-height: 2.6;
letter-spacing: 0.05em; }
.sec-hero__text {
font-family: "Noto Sans JP", sans-serif;
font-size: 22px;
line-height: 2; }
.sec-hero__graphic {
width: 50%;
max-width: 690px;
position: absolute;
right: -20px;
top: 15px; }
.sec-hero__graphic:before {
content: "";
display: block;
width: 14.45%;
aspect-ratio: 1;
background: url("images/section01/bg_bottom.webp") no-repeat center center/contain;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: -5.51%; }
.sec-hero__graphic--inner {
width: 100%;
aspect-ratio: 692 / 816;
background: url("images/section01/bg_figure.svg") no-repeat center top/contain;
position: relative;
z-index: 50;
container-type: inline-size; }
.sec-hero__graphic .sec-hero__graphic-item,
.sec-hero__graphic .sec-hero__graphic-caption {
opacity: 0; }
.sec-hero__graphic.show .sec-hero__graphic-item,
.sec-hero__graphic.show .sec-hero__graphic-caption {
animation: fadeInOnce 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.sec-hero__graphic.show .sec-hero__graphic-item:nth-of-type(1) {
animation-delay: 0.10s; }
.sec-hero__graphic.show .sec-hero__graphic-item:nth-of-type(2) {
animation-delay: 0.25s; }
.sec-hero__graphic.show .sec-hero__graphic-item:nth-of-type(3) {
animation-delay: 0.40s; }
.sec-hero__graphic.show .sec-hero__graphic-item:nth-of-type(4) {
animation-delay: 0.55s; }
.sec-hero__graphic.show .sec-hero__graphic-item:nth-of-type(5) {
animation-delay: 0.70s; }
.sec-hero__graphic.show .sec-hero__graphic-item:nth-of-type(6) {
animation-delay: 0.85s; }
.sec-hero__graphic.show .sec-hero__graphic-item:last-of-type {
animation-delay: 1.00s; }
.sec-hero__graphic.show .sec-hero__graphic-caption {
animation-delay: 1.15s; }
.sec-hero__graphic.show .sec-hero__graphic-item--inner,
.sec-hero__graphic.show .sec-hero__graphic-caption--inner {
animation: floatLoop 4s ease-in-out infinite; }
.sec-hero__graphic.show .sec-hero__graphic-item:nth-of-type(1) .sec-hero__graphic-item--inner {
animation-delay: 0.90s; }
.sec-hero__graphic.show .sec-hero__graphic-item:nth-of-type(2) .sec-hero__graphic-item--inner {
animation-delay: 1.05s; }
.sec-hero__graphic.show .sec-hero__graphic-item:nth-of-type(3) .sec-hero__graphic-item--inner {
animation-delay: 1.20s; }
.sec-hero__graphic.show .sec-hero__graphic-item:nth-of-type(4) .sec-hero__graphic-item--inner {
animation-delay: 1.35s; }
.sec-hero__graphic.show .sec-hero__graphic-item:nth-of-type(5) .sec-hero__graphic-item--inner {
animation-delay: 1.50s; }
.sec-hero__graphic.show .sec-hero__graphic-item:nth-of-type(6) .sec-hero__graphic-item--inner {
animation-delay: 1.65s; }
.sec-hero__graphic.show .sec-hero__graphic-item:last-of-type .sec-hero__graphic-item--inner {
animation-delay: 1.80s; }
.sec-hero__graphic.show .sec-hero__graphic-caption--inner {
animation-delay: 1.95s; }
.sec-hero__graphic .sec-hero__graphic-list {
width: 100%;
height: 100%;
position: relative; }
.sec-hero__graphic .sec-hero__graphic-list .sec-hero__graphic-item {
position: absolute;
width: 16.83%;
aspect-ratio: 1; }
.sec-hero__graphic .sec-hero__graphic-list .sec-hero__graphic-item:first-of-type {
top: -2.45%;
left: 41.58%; }
.sec-hero__graphic .sec-hero__graphic-list .sec-hero__graphic-item:nth-of-type(2) {
top: 13.85%;
left: 16.91%; }
.sec-hero__graphic .sec-hero__graphic-list .sec-hero__graphic-item:nth-of-type(3) {
top: 33.46%;
left: 0%; }
.sec-hero__graphic .sec-hero__graphic-list .sec-hero__graphic-item:nth-of-type(4) {
top: 54.17%;
left: 16.91%; }
.sec-hero__graphic .sec-hero__graphic-list .sec-hero__graphic-item:nth-of-type(5) {
top: 54.17%;
right: 16.91%; }
.sec-hero__graphic .sec-hero__graphic-list .sec-hero__graphic-item:nth-of-type(6) {
top: 33.46%;
right: 0%; }
.sec-hero__graphic .sec-hero__graphic-list .sec-hero__graphic-item:last-of-type {
top: 13.85%;
right: 18.12%; }
.sec-hero__graphic .sec-hero__graphic-list .sec-hero__graphic-item .sec-hero__graphic-item--inner {
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
font-size: min(23px, 3.32cqw);
font-weight: 500;
color: #ffffff;
aspect-ratio: 1;
border-radius: 50%;
position: absolute;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.8);
z-index: 20; }
.sec-hero__graphic .sec-hero__graphic-list .sec-hero__graphic-item .sec-hero__graphic-item--inner .sec-hero__graphic-item--text {
display: block;
width: 2.75em;
text-align: justify;
text-align-last: justify; }
.sec-hero__graphic .sec-hero__graphic-list .sec-hero__graphic-item:before {
content: " ";
display: block;
width: 183.69%;
height: 183.69%;
background: url("images/section01/circle_small.webp") no-repeat center center/cover;
position: absolute;
left: -36.05%;
top: -36.05%;
opacity: 0.75;
z-index: 10; }
.sec-hero__graphic .sec-hero__graphic-caption {
position: absolute;
width: 34.10%;
aspect-ratio: 1;
left: 32.95%;
top: 26.35%; }
.sec-hero__graphic .sec-hero__graphic-caption .sec-hero__graphic-caption--inner {
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
font-size: min(24px, 3.47cqw);
font-weight: 700;
color: #ffffff;
text-align: center;
aspect-ratio: 1;
border-radius: 50%;
position: absolute;
top: 0;
left: 0;
background: #000000;
z-index: 20; }
.sec-hero__graphic .sec-hero__graphic-caption .sec-hero__graphic-caption--inner .sec-hero__graphic-caption--text .sec-hero__graphic-accent {
display: table;
font-size: min(29px, 4.19cqw); }
.sec-hero__graphic .sec-hero__graphic-caption:before {
content: " ";
display: block;
width: 152.54%;
height: 152.54%;
background: url("images/section01/circle_large.webp") no-repeat center center/cover;
position: absolute;
left: -23.73%;
top: -23.73%;
opacity: 0.75;
z-index: 10; }
.sec-hero__img {
width: 100%;
max-width: 796px;
height: auto;
display: block;
margin: 0 auto; }
.sec-hero__bottom-bar {
position: relative;
z-index: 2;
display: flex;
flex-direction: column;
align-items: flex-start;
font-family: "Roboto", sans-serif;
font-size: 34px;
gap: 25px;
width: 100%;
max-width: 1440px;
margin: 0 auto; }
.sec-hero__dates {
font-size: 32px;
font-weight: 500;
letter-spacing: 0.1rem;
margin-bottom: 10px; }
.sec-hero__dates-week {
font-size: 24px; }
.sec-hero__venue {
font-weight: 700;
letter-spacing: 0.2rem; }
.sec-hero__bottom-btn {
list-style: none;
display: flex;
gap: 3rem; }
.sec-hero__bottom-btn-item {
width: calc(9em + 30px); }
.sec-hero__bottom-btn-item .c-btn-primary {
display: block;
width: 100%;
font-size: 21px;
font-weight: 700;
text-align: center;
letter-spacing: 0.2rem;
padding: 15px 0;
background: none;
border: 1px solid #ffffff;
border-radius: 5px;
transition: 0.5s;
white-space: nowrap; }
.sec-hero__bottom-btn-item .c-btn-primary:hover {
background: rgba(255, 255, 255, 0.2); }
.sec-hero .c-btn-primary--fixed {
display: none; }
.sec-timeline {
position: relative;
background-color: #ffffff;
color: #111111;
padding: 0;
overflow: hidden; }
.sec-timeline__header-dark {
background-image: url("images/section02/bg_title.webp");
background-position: center bottom;
background-repeat: no-repeat;
background-size: cover;
height: 22vw;
padding: 115px 0 0 0;
text-align: center; }
.sec-timeline__title-badge {
display: inline-block;
font-family: "Noto Sans JP", sans-serif;
font-size: 34px;
font-weight: 700;
color: #ffffff;
letter-spacing: 0.1em;
border-bottom: 2px solid #ffffff;
padding-bottom: 6px; }
.sec-timeline__kicker-wrapper {
margin-bottom: 60px; }
.sec-timeline__title {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 82px;
line-height: 1.75;
color: #000000;
font-weight: 500;
margin-bottom: 42px;
letter-spacing: -0.01em; }
.sec-timeline__lead {
font-family: "Noto Sans JP", sans-serif;
font-size: 22px;
line-height: 2.4;
color: #222222;
letter-spacing: 0.04em;
margin-bottom: 60px;
font-weight: 500; }
.sec-timeline__pre-history {
position: relative;
margin-bottom: 40px; }
.sec-timeline__pre-badge-wrapper {
margin-bottom: 30px; }
.sec-timeline__pre-badge {
display: inline-block;
font-family: "Noto Sans JP", sans-serif;
font-size: 20px;
color: #4b88f6;
border: 1px solid #4b88f6;
padding: 4px 40px;
background: #ffffff;
letter-spacing: 0.05em; }
.sec-timeline__pre-line-container {
position: relative;
width: 100%; }
.sec-timeline__pre-line-container::before {
content: "";
position: absolute;
top: 44px;
left: 0;
width: 100vw;
height: 1.5px;
background-color: #b0b0b0;
z-index: 1; }
.sec-timeline__pre-nodes {
display: flex;
align-items: flex-start;
justify-content: flex-end;
position: relative;
z-index: 2;
gap: 30px;
padding-left: calc(20% + 30px);
padding-right: 30px; }
.sec-timeline__pre-nodes .c-arrow-sep {
top: 2.125rem; }
.sec-timeline__node {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
width: 20%;
position: relative; }
.sec-timeline__node time {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 36px;
font-weight: 700;
color: #111111;
display: block;
margin-top: 12px;
border-bottom: 1px solid #b0b0b0;
padding-bottom: 4px;
width: 100%;
text-align: center; }
.sec-timeline__node p {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 18px;
line-height: 1.4;
color: #111111;
margin-top: 10px;
font-weight: 600; }
.sec-timeline__era-container {
position: relative; }
.sec-timeline__era-container::before {
content: "";
position: absolute;
top: 44px;
left: -50vw;
width: 200vw;
height: 1px;
background-color: #b0b0b0;
z-index: 1; }
.sec-timeline__connector-line {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 24px;
position: relative;
z-index: 2;
margin-bottom: 25px; }
.sec-timeline__connector-line .c-arrow-sep {
position: absolute;
top: 2.125rem; }
.sec-timeline__connector-line .c-arrow-sep:first-of-type {
left: -6rem; }
.sec-timeline__connector-line .c-arrow-sep:last-of-type {
right: -6rem; }
.sec-timeline__era-header {
display: flex; }
.sec-timeline__era-tag {
position: relative;
z-index: 2;
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 20px;
color: #4b88f6;
display: flex;
align-items: center;
gap: 6px;
background: #ffffff;
padding: 0 12px 0 0; }
.sec-timeline__era-tag .num {
font-size: 50px;
font-weight: 700;
line-height: 1; }
.sec-timeline__era-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 24px;
position: relative;
top: -30px; }
.sec-timeline__era-card {
display: flex;
width: 100%;
flex-direction: column; }
.sec-timeline__card-body {
background-color: #808080;
color: #ffffff;
padding: 30px 24px;
border-radius: 10px;
flex-grow: 1;
display: flex;
flex-direction: column;
position: relative; }
.sec-timeline__card-body:before {
content: " ";
display: block;
border-bottom: 17.5px solid #808080;
border-left: 13.75px solid transparent;
border-right: 13.75px solid transparent;
position: absolute;
top: -17px;
left: 36px; }
.sec-timeline__card-body .sec-timeline__time-wrap {
display: table;
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 30px;
font-weight: 700;
margin-bottom: 16px; }
.sec-timeline__card-body .sec-timeline__time-wrap .sec-timeline__time {
display: table;
border-bottom: 1px solid rgba(255, 255, 255, 0.4);
padding-bottom: 8px; }
.sec-timeline__card-body h3 {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 25px;
font-weight: 600;
line-height: 1.4;
margin-bottom: 16px; }
.sec-timeline__card-body p {
font-family: "Noto Sans JP", sans-serif;
font-size: 15px;
line-height: 1.7;
margin-bottom: 24px;
opacity: 0.95; }
.sec-timeline__card-body p.sec-timeline__card-theme {
font-size: 16px;
font-weight: 700; }
.sec-timeline__era-icons {
margin-top: auto;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
gap: 12px; }
.sec-timeline__era-icons img {
max-width: 80%;
height: auto;
display: inline-block; }
.sec-timeline__bridge-bar {
background: #000000 url("images/section02/bg_timeline.webp") no-repeat right bottom;
color: #ffffff;
padding: 120px 0;
margin-top: 0 !important;
position: relative; }
.sec-timeline__bridge-bar::before {
content: " ";
display: block;
width: calc(((100vw - 1440px) / 2) + 290px);
height: 1.5px;
background: #ffffff;
position: absolute;
left: 0;
top: 170px;
z-index: 30; }
.sec-timeline__bridge-bar .c-arrow-sep {
position: absolute;
top: 160px;
left: calc(((100vw - 1440px) / 2) - 72px);
z-index: 80;
background: none; }
.sec-timeline__bridge-bar .c-arrow-sep::before {
right: 1px;
background-color: #000000; }
.sec-timeline__bridge-bar .c-arrow-sep .c-arrow-sep__chevron {
background-color: #ffffff !important; }
.sec-timeline__bridge-inner {
display: flex;
flex-flow: row;
justify-content: center;
gap: 24px;
position: relative; }
.sec-timeline__bridge-inner .c-orb-bg {
width: 160px;
height: 160px;
top: -30px;
flex-shrink: 0;
background-color: transparent; }
.sec-timeline__year-highlight {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 62px;
font-weight: 700;
letter-spacing: 0.02em;
margin: 0 80px 0 70px; }
.sec-timeline__bridge-text {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
display: flex;
flex-flow: column;
gap: 2rem; }
.sec-timeline__bridge-text .txt-sub {
font-family: "Noto Sans JP", sans-serif;
font-size: 24px;
text-shadow: 0 0 6px #000, 0 0 6px #000, 0 0 6px #000, 0 0 6px #000, 0 0 6px #000, 0 0 6px #000;
line-height: 2.4; }
.sec-timeline__bridge-text .txt-main {
font-size: 42px;
font-weight: 600; }
.sec-now {
display: flex;
flex-flow: column;
align-items: center;
justify-content: center;
gap: 42px;
padding: 5rem 0; }
.sec-now__title {
font-family: "Roboto", sans-serif;
font-size: 34px;
letter-spacing: 0.15rem;
color: #5f98e3;
white-space: nowrap;
position: relative; }
.sec-now__title:before {
content: " ";
display: block;
width: 160px;
height: 160px;
background: url("images/section02/bg_year_large.webp") no-repeat center center/contain;
position: absolute;
left: -150px;
top: -63px; }
.sec-now__title:after {
content: " ";
width: 23px;
height: 23px;
background: #ffffff;
border-radius: 50%;
position: absolute;
left: -80px;
top: 9.5px; }
.sec-now__text {
font-size: 25px;
font-family: "Noto Sans JP", sans-serif;
text-align: center;
line-height: 1.8; }
.sec-constant {
position: relative;
background-color: #ffffff;
background-image: url("images/section03/bg_earth.webp");
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
color: #111111;
text-align: center;
padding: 60px 0 0 0;
overflow: hidden; }
.sec-constant .c-kicker-frame {
display: table;
font-size: 15px;
color: #111111;
border-color: #111111;
background: rgba(255, 255, 255, 0.8);
margin-bottom: 100px; }
.sec-constant__title {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 82px;
line-height: 1.75;
color: #111111;
font-weight: 500;
letter-spacing: 0.02em;
margin-bottom: 68px; }
.sec-constant__title .c-highlight-box {
margin-top: 30px;
padding: 0 18px; }
.sec-constant__lead {
font-family: "Noto Sans JP", sans-serif;
font-size: 26px;
line-height: 2.6;
color: #222222;
font-weight: 500;
letter-spacing: 0.04em;
margin-bottom: 80px; }
.sec-constant__question-banner {
width: 100vw;
background: rgba(0, 0, 0, 0.7);
color: #ffffff;
font-family: "Noto Sans JP", sans-serif;
font-size: 34px;
font-weight: 500;
letter-spacing: 0.12em;
padding: 88px 0;
text-align: center;
position: relative;
left: calc(((100vw - 1440px) / 2) * -1); }
.sec-constant__question-banner::after {
content: "";
display: table;
width: 26em;
height: 3px;
margin: 1rem auto 0 auto;
background-color: #5f98e3; }
.sec-impact {
background-color: #000000;
color: #ffffff;
padding: 80px 0;
position: relative;
/* 個別ノード位置 */
/* 未来ブロック */ }
.sec-impact .c-kicker-frame {
font-size: 15px; }
.sec-impact__title {
font-size: 82px;
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
line-height: 1.75;
color: #ffffff;
font-weight: 500;
letter-spacing: 0.02em;
margin-bottom: 50px; }
.sec-impact__title .c-highlight-box {
padding: 2px 16px; }
.sec-impact__lead {
font-family: "Noto Sans JP", sans-serif;
font-size: 22px;
line-height: 2.2;
color: #e5e5e5;
font-weight: 400;
letter-spacing: 0.04em;
margin-bottom: 60px; }
.sec-impact__footnote {
font-family: "Noto Sans JP", sans-serif;
font-size: 16px;
letter-spacing: 0.04em;
margin-top: 75px !important; }
.sec-impact__footnote a {
color: #ffffff; }
.sec-impact__footnote a:hover {
text-decoration: none; }
.sec-impact__network-wrapper {
position: relative;
display: block;
width: 100%;
aspect-ratio: 1440 / 807;
margin: 0 auto; }
.sec-impact__halftone {
position: absolute;
top: calc(50% - 31.4583%);
left: calc(50% - 15.72915%);
width: 31.4583%;
height: 56.1338%;
object-fit: contain;
z-index: 1;
pointer-events: none; }
.sec-impact__network-nodes {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 3;
background: url("images/section04/bg_flash.svg") no-repeat center center/100% auto; }
.sec-impact__node--immunology {
width: 25.4167%;
aspect-ratio: 1;
top: 0;
left: 17.0139%;
animation-delay: 0s, 1.2s; }
.sec-impact__node--winner1 {
width: 16.5625%;
aspect-ratio: 1;
top: 12.172%;
left: 3.556%;
animation-delay: 1.0s, 2.4s; }
.sec-impact__node--anti {
width: 25.4167%;
aspect-ratio: 1;
top: 0;
right: 17.0139%;
animation-delay: 2s, 3.2s; }
.sec-impact__node--winner4 {
width: 16.5625%;
aspect-ratio: 1;
top: 12.172%;
right: 3.556%;
animation-delay: 3.0s, 4.4s; }
.sec-impact__node--drug {
width: 25.4167%;
aspect-ratio: 1;
bottom: 0;
right: 17.0139%;
animation-delay: 4.0s, 5.3s; }
.sec-impact__node--winner6 {
width: 16.5625%;
aspect-ratio: 1;
bottom: 5.347%;
right: 3.556%;
animation-delay: 5.0s, 6.5s; }
.sec-impact__node--bioman {
width: 25.4167%;
aspect-ratio: 1;
bottom: 0;
left: 17.0139%;
animation-delay: 6.0s, 7.2s; }
.sec-impact__node--bioman .c-node-circle__cat-label,
.sec-impact__node--bioman .c-node-circle__main-copy {
margin-bottom: 10px; }
.sec-impact__node--winner3 {
width: 16.5625%;
aspect-ratio: 1;
bottom: 5.347%;
left: 3.556%;
animation-delay: 7.0s, 8.6s; }
.sec-impact__future {
padding: 10rem 0 2rem 0; }
.sec-impact__future-title {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 64px;
font-weight: 600;
text-align: center;
margin-bottom: 3rem; }
.sec-impact__future-main {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 32px;
text-align: center;
line-height: 1.4;
margin-bottom: 3rem; }
.sec-future {
position: relative;
color: #000000;
background-color: #ffffff;
padding: 50px 0 80px;
overflow: hidden;
background-image: url("images/section05/bg_photo.webp");
background-repeat: no-repeat;
background-position: 180% 0;
background-size: 1643px auto;
/* 上部 3カード */
/* 詳細ブロック */
/* サブグリッド（4列） */
/* サブグリッド（2列） */ }
.sec-future .c-kicker-frame {
font-size: 15px;
color: #000000;
margin-bottom: 50px;
border-color: #000000; }
.sec-future__title {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 82px;
line-height: 1.4;
font-weight: 500;
letter-spacing: 0.02em;
margin-bottom: 62px; }
.sec-future__title .c-highlight-box {
padding: 0 20px; }
.sec-future__lead {
font-family: "Noto Sans JP", sans-serif;
font-size: 25px;
line-height: 2.4;
font-weight: 400;
letter-spacing: 0.04em;
margin-bottom: 0; }
.sec-future__category-cards {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
margin-bottom: 100px;
list-style: none; }
.sec-future__cat-card {
display: flex;
flex-direction: column;
background: #808080;
padding: 30px 0;
position: relative;
transition: 0.5s;
/*&::before {
content: " ";
display: table;
width: 240px;
height: 240px;
background: url("images/section05/bg_title.webp") no-repeat center center / contain;
position: absolute;
left: -40px;
top: -40px;
z-index: 10;
}*/ }
.sec-future__cat-card p {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 16px;
line-height: 1.6;
letter-spacing: 0.05em;
color: #ffffff;
margin: 0 30px 30px 30px; }
.sec-future__cat-card:hover {
cursor: pointer;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.4); }
.sec-future__cat-card:hover p.sec-future__cat-btn .sec-future__cat-btn-inner {
color: #ffffff;
background: none; }
.sec-future__cat-head {
display: flex;
align-items: center;
gap: 10px; }
.sec-future__cat-num {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 105px;
line-height: 1;
color: #ffffff;
margin-left: 10px;
position: relative;
z-index: 20; }
.sec-future__cat-badge {
display: block;
width: 100%;
font-family: "Roboto", sans-serif;
font-size: 22px;
font-weight: 400;
color: #ffffff;
letter-spacing: 0.05em;
padding: 3px 20px;
background: #5f98e3;
position: relative;
z-index: 20; }
.sec-future__cat-title {
font-size: 26px;
font-weight: 700;
color: #ffffff;
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
margin: 33px 30px 18px 30px;
position: relative;
letter-spacing: 0.05em;
z-index: 20; }
.sec-future__cat-desc {
font-size: 22px;
color: #000000;
margin: 0 30px 33px 30px;
position: relative;
letter-spacing: 0.05em;
z-index: 20; }
.sec-future__cat-btn {
display: flex;
flex-flow: column;
justify-content: flex-end;
flex-grow: 1;
margin-bottom: 0 !important; }
.sec-future__cat-btn-inner {
display: block;
color: #808080;
text-align: center;
padding: 10px;
background: #ffffff;
border: 1px solid #ffffff;
transition: 0.5s; }
.sec-future__detail-block {
max-height: 0;
overflow: hidden;
opacity: 0;
transition: max-height 0.4s cubic-bezier(0, 1, 0, 1), opacity 0.4s ease;
background: #808080;
/*&::before {
content: " ";
display: table;
width: 240px;
height: 240px;
background: url("images/section05/bg_title.webp") no-repeat center center / contain;
position: absolute;
left: -40px;
top: -40px;
z-index: 10;
}*/ }
.sec-future__detail-block.is-active {
opacity: 1;
transition: max-height 0.5s cubic-bezier(0.9, 0, 0.8, 0.2), opacity 0.5s ease 0.5s; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-header, .sec-future__detail-block:nth-of-type(3) .sec-future__detail-header {
display: flex;
flex-wrap: wrap;
padding-bottom: 50px; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-meta, .sec-future__detail-block:nth-of-type(3) .sec-future__detail-meta {
width: 100%; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-header-main, .sec-future__detail-block:nth-of-type(3) .sec-future__detail-header-main {
width: 36%; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-header-desc, .sec-future__detail-block:nth-of-type(3) .sec-future__detail-header-desc {
width: 64%;
padding: 20px 40px 0 0; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-header-desc p, .sec-future__detail-block:nth-of-type(3) .sec-future__detail-header-desc p {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 18px;
color: #ffffff;
line-height: 2; }
.sec-future__detail-block:first-of-type .sec-future__sub-grid-4 .sec-future__sub-item {
flex-flow: column;
align-items: flex-start;
justify-content: space-between; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-header-desc .sec-future__catch-phrase {
font-size: 31px;
margin-top: 20px; }
.sec-future__detail-block:nth-of-type(2) .sec-future__sub-grid-4 .sec-future__sub-item {
display: block; }
.sec-future__detail-block:nth-of-type(3) .sec-future__detail-header-desc .sec-future__catch-phrase {
font-size: 31px;
margin-bottom: 20px; }
.sec-future__detail-header {
padding: 30px 0 70px 0;
position: relative; }
.sec-future__detail-meta {
display: flex;
align-items: center;
gap: 15px; }
.sec-future__detail-num {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 105px;
line-height: 1;
color: #ffffff;
margin-left: 10px;
position: relative;
z-index: 20; }
.sec-future__detail-badge {
display: block;
width: 100%;
font-family: "Roboto", sans-serif;
font-size: 22px;
font-weight: 700;
color: #ffffff;
letter-spacing: 0.05em;
padding: 3px 20px;
background: #5f98e3;
position: relative;
z-index: 20; }
.sec-future__detail-title {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 26px;
font-weight: 600;
color: #ffffff;
margin: 33px 40px 10px 40px;
line-height: 1.4; }
.sec-future__detail-title .sec-future__detail-title-strong {
display: table;
font-size: 20px;
padding: 5px 10px;
margin-bottom: 10px;
border: 1px solid #ffffff; }
.sec-future__detail-theme {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 22px;
color: #ffffff;
line-height: 2.2;
margin: 0 40px 20px 40px; }
.sec-future__detail-lead {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 15px;
color: #ffffff;
line-height: 2.2;
margin: 0 40px; }
.sec-future__section-sub-heading {
text-align: center;
padding: 58px 40px 0 40px;
background: #111111; }
.sec-future__section-sub-heading:nth-of-type(2) {
padding-top: 0; }
.sec-future__section-sub-heading--inner {
display: block;
font-size: 22px;
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
color: #5f98e3;
padding: 5px 20px;
border: 1px solid #5f98e3; }
.sec-future__notice-text {
display: block;
font-size: 22px;
color: #5f98e3;
text-align: center;
padding-bottom: 45px;
background: #111111; }
.sec-future__next-block {
color: #ffffff;
padding: 0 40px 60px 40px;
background: #111111; }
.sec-future__next-block p {
font-family: "Noto Sans JP", sans-serif;
font-size: 18px;
font-weight: 500;
line-height: 1.6;
padding: 30px 0 0 0;
color: #b3b3b3; }
.sec-future__next-block p.sec-future__next-title {
font-size: 22px; }
.sec-future__next-block p .sec-future__next-btn-link {
display: table;
font-size: 20px;
font-weight: 700;
color: #ffffff;
text-decoration: none;
line-height: 1.2;
padding: 8px 30px;
background: #5f98e3;
border-radius: 0; }
.sec-future__next-block p .sec-future__next-btn-link:hover {
transform: translateY(-3px);
box-shadow: 0 12px 32px rgba(0, 180, 216, 0.5);
background: linear-gradient(135deg, #48cae4 0%, #0096c7 100%); }
.sec-future__sub-grid-4 {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 50px;
list-style: none;
padding: 0 40px;
background: #111111; }
.sec-future__sub-item {
background: #111111;
padding: 40px 0;
display: flex;
flex-wrap: wrap;
align-items: center; }
.sec-future__sub-num {
font-family: "Roboto", sans-serif;
font-size: 25px;
font-weight: 700;
color: #ffffff;
width: 38px;
height: 38px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 20px;
border: 1px solid #ffffff; }
.sec-future__sub-title {
font-family: "Roboto", sans-serif;
font-size: 17px;
font-weight: 700;
letter-spacing: 0.05em;
color: #ffffff; }
.sec-future__sub-lead {
width: 100%;
font-family: "Noto Sans JP", sans-serif;
font-size: 18px;
font-weight: 500;
line-height: 1.6;
margin: 30px 0;
color: #b3b3b3; }
.sec-future__sub-list {
width: 100%;
margin-bottom: 30px; }
.sec-future__sub-list li {
font-size: 14px;
list-style: none;
margin-bottom: 10px;
color: #b3b3b3;
padding-left: 1em;
position: relative; }
.sec-future__sub-list li::before {
content: "●";
display: inline-block;
position: absolute;
left: 0;
top: 0; }
.sec-future__speaker-name {
font-family: "Noto Sans JP", sans-serif;
font-size: 19px;
font-weight: 700;
color: #ffffff;
margin-top: auto; }
.sec-future__speaker-title {
font-family: "Noto Sans JP", sans-serif;
font-size: 15px;
color: #ffffff;
margin-top: 4px;
line-height: 1.4; }
.sec-future__sub-grid-2 {
list-style: none;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 60px;
padding: 0 40px;
background: #111111; }
.sec-future__sub-grid-2 .sec-future__sub-item {
display: block; }
.sec-future__sub-item-content {
display: table;
margin: 0 auto; }
.sec-future__sub-head {
display: flex;
align-items: center; }
.sec-cta {
position: relative;
background: #000000;
color: #ffffff;
padding: 90px 0 0 0;
overflow: hidden; }
.sec-cta .c-inner {
position: relative;
z-index: 100; }
.sec-cta::before {
content: "";
display: block;
width: 773px;
height: 650px;
background: url("images/section06/earth.svg") no-repeat left top/1546px auto;
position: absolute;
left: 0;
top: -90px;
transform: scale(-1, -1);
z-index: 10;
opacity: 0.7; }
.sec-cta::after {
content: "";
display: block;
width: 773px;
height: 820px;
background: url("images/section06/earth.svg") no-repeat left top/1546px auto;
position: absolute;
right: 0;
bottom: -197px;
z-index: 10;
opacity: 0.7; }
.sec-cta .c-kicker-frame {
font-size: 15px; }
.sec-cta__orbs-container {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 100; }
.sec-cta__orb {
display: table;
position: absolute;
opacity: 0.7; }
.sec-cta__orb--left-top {
width: 819px;
height: 819px;
background: url("images/section06/left_top@2x.webp") no-repeat left top/contain;
left: -390px;
top: 170px; }
.sec-cta__orb--right-top {
width: 680px;
height: 680px;
background: url("images/section06/right_top@2x.webp") no-repeat left top/contain;
right: -390px;
bottom: 370px; }
.sec-cta__orb--left-bottom {
width: 332px;
height: 332px;
background: url("images/section06/left_bottom@2x.webp") no-repeat left top/contain;
left: 140px;
bottom: 0; }
.sec-cta__title {
font-size: 82px;
font-weight: 500;
text-align: center;
line-height: 1.75;
letter-spacing: 0.05em;
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
margin-bottom: 60px; }
.sec-cta__lead {
font-size: 26px;
line-height: 1.8;
text-align: center;
letter-spacing: 0.04em;
margin-bottom: 60px; }
.sec-cta__logo {
margin-bottom: 20px;
display: flex;
gap: 15px;
align-items: center;
justify-content: center; }
.sec-cta__logo .c-brand__symbol {
width: 40px;
height: 40px; }
.sec-cta__logo .c-brand__text {
margin-bottom: 0; }
.sec-cta__outline {
display: flex;
flex-flow: column;
gap: 20px;
font-family: "Roboto", sans-serif;
text-align: center;
margin: 100px 0; }
.sec-cta__outline-dates {
font-size: 28px;
letter-spacing: 0.1rem; }
.sec-cta__outline-venue {
font-size: 34px;
font-weight: 900; }
.sec-cta__actions {
display: flex;
justify-content: center;
gap: 20px;
list-style: none;
margin: 40px auto 0 auto; }
.sec-cta__actions-item {
width: 16em;
text-align: center; }
.sec-cta__actions-item .c-btn-primary-icon {
margin: 0 auto 40px auto;
transform: rotate(90deg); }
.sec-cta__actions-item a {
display: block;
min-width: auto;
font-size: 20px;
font-weight: 400;
text-align: center;
padding: 15px 30px; }
.sec-cta__actions-item a .sec-cta__actions-icon {
vertical-align: middle;
margin-left: 10px; }
.sec-result {
color: #ffffff;
text-align: center;
background: url("images/section07/bg_left.webp") no-repeat left top/contain, url("images/section07/bg_right.webp") no-repeat right bottom/contain, #000000;
padding: 72px 0; }
.sec-result__title {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 82px;
line-height: 1.75;
margin-bottom: 80px; }
.sec-result__main {
font-size: 30px;
line-height: 2.4; }
.sec-voice {
position: relative;
color: #ffffff;
background: url("images/section08/bg_top.webp") no-repeat right top, url("images/section08/bg_bottom.webp") no-repeat left bottom, #000000;
padding: 60px 0 80px;
overflow: hidden;
/* 上部 3カード */ }
.sec-voice .c-kicker-frame {
font-size: 15px;
color: #ffffff;
margin-bottom: 60px;
border-color: #ffffff; }
.sec-voice__title {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 82px;
line-height: 1.4;
font-weight: 500;
letter-spacing: 0.02em;
margin-bottom: 50px; }
.sec-voice__title .c-highlight-box {
padding: 0 20px; }
.sec-voice__lead {
font-family: "Noto Sans JP", sans-serif;
font-size: 25px;
line-height: 2.4;
font-weight: 400;
letter-spacing: 0.04em;
margin-bottom: 0; }
.sec-voice__cards {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 20px;
margin: 85px 0 100px 0 !important;
list-style: none; }
.sec-voice__cat-card {
width: calc(33.33% - 13.34px);
display: flex;
flex-direction: column;
background: #ffffff;
padding: 0;
position: relative;
transition: 0.5s;
overflow: hidden; }
.sec-voice__cat-card::before {
content: " ";
display: table;
width: 240px;
height: 240px;
background: url("images/section05/bg_title.webp") no-repeat center center/contain;
position: absolute;
left: -40px;
top: -40px;
z-index: 10; }
.sec-voice__cat-card p {
font-size: 22px;
line-height: 1.6;
letter-spacing: 0.05em;
color: #000000;
margin: 0 30px 30px 30px; }
.sec-voice__cat-card:hover {
cursor: pointer;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.4); }
.sec-voice__cat-card:hover p.sec-future__cat-btn .sec-future__cat-btn-inner {
color: #ffffff;
background: none; }
.sec-voice__btn {
display: flex;
flex-flow: column;
justify-content: space-between;
align-items: flex-end;
width: calc(33.33% - 13.34px);
position: relative; }
.sec-voice__btn-inner {
display: block;
width: 100%;
/*position: absolute;
bottom: 0;*/ }
.sec-voice__btn-inner a {
display: block;
font-size: 30px;
font-weight: 700;
color: #ffffff;
text-decoration: none;
padding: 20px 30px;
background: #5f98e3;
border-radius: 6px;
position: relative;
transition: 1s; }
.sec-voice__btn-inner a .sec-voice__btn-icon {
position: absolute;
right: 30px;
bottom: 20px; }
.sec-voice__btn-inner a:hover {
opacity: 0.9;
transform: scale(1.02);
box-shadow: 0 0 35px rgba(75, 136, 246, 0.9);
background: linear-gradient(135deg, #48cae4 0%, #0096c7 100%); }
.sec-voice__cat-head {
display: flex;
align-items: center;
gap: 10px; }
.sec-voice__cat-num {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 120px;
line-height: 1;
color: #5f98e3;
margin-left: 10px;
position: relative;
z-index: 20; }
.sec-voice__cat-badge {
display: block;
width: 100%;
font-family: "Roboto", sans-serif;
position: relative;
z-index: 20; }
.sec-voice__cat-badge-title {
display: block;
font-size: 19px;
font-weight: 400;
color: #ffffff;
letter-spacing: 0.05em;
padding: 3px 20px;
background: #5f98e3; }
.sec-voice__cat-badge-year {
display: block;
font-size: 16px;
font-weight: 400;
color: #5f98e3;
letter-spacing: 0.05em;
padding: 20px 20px 0 20px; }
.sec-voice__cat-title {
font-size: 40px;
font-weight: 700;
color: #000000;
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
margin: 33px 30px 18px 30px;
position: relative;
letter-spacing: 0.05em;
z-index: 20; }
.sec-voice__cat-desc {
flex-grow: 1; }
.sec-voice__cat-btn {
margin: 0 !important;
padding: 0;
background: #808080; }
.sec-voice__cat-btn a {
display: block;
color: #ffffff;
text-decoration: none;
padding: 20px 30px 24px 30px;
transition: 0.5s; }
.sec-voice__cat-btn a .sec-voice__cat-btn-icon {
vertical-align: middle;
margin-left: 10px; }
.sec-voice__cat-btn a:hover {
background: #333333; }
.sec-find {
position: relative;
color: #ffffff;
background: url("images/section09/bg_photo.webp") no-repeat center top/100% auto, url("images/section05/bg_bottom.webp") no-repeat center bottom/100% auto, #ffffff;
padding: 60px 0 80px;
overflow: hidden;
/* 上部 3カード */ }
.sec-find .c-kicker-frame {
font-size: 15px;
color: #ffffff;
margin-bottom: 60px;
border-color: #ffffff; }
.sec-find__title {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 82px;
line-height: 1.4;
font-weight: 500;
text-align: center;
letter-spacing: 0.02em;
margin-bottom: 50px; }
.sec-find__title .c-highlight-box {
padding: 0 20px; }
.sec-find__lead {
font-family: "Noto Sans JP", sans-serif;
font-size: 22px;
line-height: 2.4;
font-weight: 400;
text-align: center;
letter-spacing: 0.04em;
margin-bottom: 0; }
.sec-find__cards {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 20px;
margin: 85px 0 100px 0 !important;
list-style: none; }
.sec-find__cat-card {
width: calc(25% - 15px);
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 20px;
background: #000000;
border: 2px solid #ffffff;
padding: 0;
position: relative;
transition: 0.5s;
overflow: hidden; }
.sec-find__cat-num-inner {
display: flex;
align-items: center;
justify-content: center;
font-family: "Roboto", sans-serif;
font-size: 54px;
width: 82px;
color: #000000;
line-height: 1;
text-align: center;
background: #ffffff;
aspect-ratio: 1; }
.sec-find__cat-title {
font-size: 30px;
font-weight: 700;
color: #ffffff;
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
text-align: center;
padding: 15px;
background: #5f98e3;
position: relative;
letter-spacing: 0.05em;
z-index: 20; }
.sec-find__cat-title-large {
font-size: 38px; }
.sec-find__cat-desc {
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
color: #ffffff;
text-align: center;
flex-grow: 1; }
.sec-find__cat-btn {
margin: 0 !important;
padding: 0;
background: #ffffff; }
.sec-find__cat-btn a {
display: block;
font-size: 22px;
color: #000000;
text-decoration: none;
padding: 20px 30px 24px 30px;
transition: 0.5s; }
.sec-find__cat-btn a .sec-find__cat-desc-icon {
vertical-align: middle;
margin-left: 10px; }
.sec-find__cat-btn a:hover {
background: #cccccc; }
@keyframes fadeInOnce {
0% {
opacity: 0;
transform: translateY(20px); }
100% {
opacity: 1;
transform: translateY(0); } }
@keyframes floatLoop {
0%, 100% {
transform: translateY(0); }
50% {
transform: translateY(-10px); } }
@keyframes fadeIn {
0% {
opacity: 0;
transform: translateY(20px); }
100% {
opacity: 1;
transform: translateY(0); } }
@keyframes fadeInSoft {
from {
opacity: 0;
transform: scale(0.95); }
to {
opacity: 1;
transform: scale(1); } }
@keyframes float {
0%, 100% {
transform: translateY(0); }
50% {
transform: translateY(-12px); } }
@keyframes scrollMove {
0% {
transform: translateY(-100%); }
100% {
transform: translateY(100%); } }
@media (max-width: 1440px) {
.c-inner {
padding: 0 40px; }
.sec-hero__title {
font-size: 70px; }
.sec-hero__grid.c-inner {
padding: 125px 40px; }
.sec-hero__bottom-bar {
padding: 0 40px; }
.sec-constant__question-banner {
left: -40px; }
.sec-impact__network-wrapper {
width: 100%; }
.sec-future {
background-size: 1300px auto; }
.sec-future__sub-lead br {
display: none; }
.sec-future__sub-grid-4 {
display: grid;
grid-template-columns: repeat(2, 1fr);
list-style: none; }
.sec-future__sub-grid-4 .sec-future__sub-item:first-of-type,
.sec-future__sub-grid-4 .sec-future__sub-item:nth-of-type(2) {
padding: 60px 0 0 0; }
.sec-future__sub-grid-4 .sec-future__sub-item:nth-of-type(3),
.sec-future__sub-grid-4 .sec-future__sub-item:last-of-type {
padding: 0 0 60px 0; }
.sec-voice__cat-title {
font-size: 32px; }
.sec-voice__cat-card p {
font-size: 20px; }
.sec-voice__cat-btn a .sec-voice__cat-btn-icon {
width: 32px; }
.sec-find__cat-title-large {
font-size: 33px; }
.sec-find__cat-btn a {
font-size: 20px; }
.sec-find__cat-btn a .sec-find__cat-desc-icon {
width: 32px; } }
@media (max-width: 1300px) {
.c-orb-bg--large {
width: 70px;
height: 70px;
position: relative; }
.sec-hero__title {
font-size: 62px; }
.sec-hero__title-num {
font-size: 70px; }
.sec-hero__title-unit {
font-size: 70px; }
.sec-timeline__era-grid {
top: -16px; }
.sec-timeline__era-tag .num {
font-size: 40px; }
.sec-future {
background-position: -50% 0; }
.sec-voice__cat-num {
font-size: 80px; }
.sec-voice__cat-badge-title {
font-size: 15px; }
.sec-voice__cat-badge-year {
font-size: 14px;
padding: 10px 20px 0 20px; }
.sec-voice__cat-card:before {
width: 180px;
height: 180px; }
.sec-voice__cat-title {
font-size: 30px; }
.sec-voice__btn-inner a {
font-size: 24px; }
.sec-find__cat-num-inner {
font-size: 42px;
width: 68px; }
.sec-find__cat-title {
font-size: 26px; }
.sec-find__cat-title-large {
font-size: 30px; }
.sec-find__cat-desc {
font-size: 16px; }
.sec-find__cat-btn a {
padding: 20px 15px 24px 15px; } }
@media (max-width: 1200px) {
.sec-timeline__bridge-bar {
background: #000000; }
.sec-future__cat-num {
font-size: 75px; }
.sec-future__cat-badge {
font-size: 19px; }
.sec-result {
background: url("images/section07/bg_left.webp") no-repeat left top/contain, #000000; }
.sec-voice__cat-card {
width: calc(50% - 10px); }
.sec-voice__cat-card .sec-voice__cat-desc {
flex-grow: 1;
padding: 0 30px 30px 30px;
margin: 0; }
.sec-find__cat-card {
width: calc(50% - 10px); } }
@media (max-width: 1150px) {
.sec-constant__title {
font-size: 92px; }
.sec-future {
background-size: 1300px auto; } }
@media (max-width: 1100px) {
.l-header {
padding: 0 40px; }
.c-orb-bg--large {
display: none; }
.c-menu-toggle span.u-font-en {
font-size: 18px; }
.c-kicker-frame {
width: 410px;
font-size: 16px; }
.c-btn-primary--large {
min-width: 280px;
font-size: 20px; }
.c-btn-primary--fixed {
position: relative;
bottom: auto;
right: auto;
margin-top: 20px; }
.c-btn-primary--fixed:before {
display: none; }
.c-btn-primary--fixed .c-btn-primary--fixed-inner {
border-radius: 32px; }
/* ページ内リンク */
.scroll__link {
font-size: 18px; }
.scroll__link:before {
width: 3px;
height: 48px; }
.sec-hero__title {
font-size: 81px; }
.sec-hero__title-num {
font-size: 84px; }
.sec-hero__title-unit {
font-size: 81px; }
.sec-hero__grid {
display: flex;
flex-flow: column;
align-items: center;
grid-template-columns: 1fr 0.8fr; }
.sec-hero__grid.c-inner {
padding: 125px 40px; }
.sec-hero__text {
margin-bottom: 50px; }
.sec-hero__lead br {
display: none; }
.sec-hero__graphic {
width: 80%;
right: 0;
top: 0;
position: relative; }
.sec-hero__bottom-bar {
padding: 0 40px; }
.sec-timeline__era-grid {
top: -4px;
gap: 10px; }
.sec-timeline__card-body .sec-timeline__time-wrap {
font-size: 22px; }
.sec-timeline__card-body h3 {
font-size: 22px; }
.sec-timeline__card-body h3 br {
display: none; }
.sec-timeline__era-tag {
margin-bottom: 20px; }
.sec-constant__title {
font-size: 70px; }
.sec-constant__lead {
font-size: 24px; }
.sec-constant__question-banner {
font-size: 28px; }
.sec-impact__title {
font-size: 70px; }
.sec-impact__title .c-highlight-box {
padding: 0 20px; }
.sec-impact__lead {
font-family: "Noto Sans JP", sans-serif;
font-size: 22px;
line-height: 2.2;
color: #e5e5e5;
font-weight: 400;
letter-spacing: 0.04em;
margin-bottom: 60px; }
.sec-impact__footnote {
font-family: "Noto Sans JP", sans-serif;
font-size: 16px;
letter-spacing: 0.04em;
margin-top: 75px; }
.sec-future__title {
font-size: 68px; }
.sec-future__title .c-highlight-box {
padding: 0 20px; }
.sec-future__lead {
font-size: 24px; }
.sec-future__category-cards {
grid-template-columns: repeat(1, 1fr); }
.sec-future__cat-card {
padding: 40px 0; }
.sec-future__cat-card p {
font-size: 16px;
margin: 0 20px 20px 20px; }
.sec-future__cat-card p br {
display: none; }
.sec-future__cat-num {
font-size: 80px; }
.sec-future__cat-badge {
font-size: 20px; }
.sec-future__cat-title {
margin: 33px 20px 18px 20px; }
.sec-future__cat-title br {
display: none; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-header-main, .sec-future__detail-block:nth-of-type(3) .sec-future__detail-header-main {
width: 100%; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-header-desc, .sec-future__detail-block:nth-of-type(3) .sec-future__detail-header-desc {
width: 100%;
padding: 40px 40px 0 40px;
margin-top: 40px;
border-top: 1px solid #cccccc; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-header-desc p.sec-future__catch-phrase, .sec-future__detail-block:nth-of-type(3) .sec-future__detail-header-desc p.sec-future__catch-phrase {
font-size: 28px; }
.sec-future__detail-num {
font-size: 110px; }
.sec-future__detail-lead {
font-size: 16px; }
.sec-future__detail-lead br {
display: none; }
.sec-cta__title {
font-size: 70px;
margin-bottom: 74px; }
.sec-cta__lead {
font-size: 24px;
margin-bottom: 100px; }
.sec-cta__logo {
margin-bottom: 40px;
display: flex;
justify-content: center; }
.sec-result__title {
font-size: 70px; }
.sec-result__title .c-highlight-box {
padding: 0 20px; }
.sec-result__main {
font-size: 24px; }
.sec-voice__title {
font-size: 71px; }
.sec-voice__title .c-highlight-box {
padding: 0 20px; }
.sec-voice__lead {
font-size: 24px; } }
@media (max-width: 865px) {
.c-inner {
padding: 0 5%; }
.sp {
display: table !important; }
.l-header {
padding: 5%;
height: 100px; }
.c-menu-toggle span.u-font-en {
font-size: 14px; }
.c-menu-toggle.active .c-hamburger span:nth-child(1) {
transform: translateY(8px) rotate(45deg); }
.c-menu-toggle.active .c-hamburger span:nth-child(3) {
transform: translateY(-10px) rotate(-45deg); }
.c-hamburger {
width: 46px;
height: 20px; }
.c-hamburger span {
width: 46px; }
.nav-morph__link {
font-size: 16px; }
.c-brand {
align-items: center;
gap: 10px; }
.c-brand__symbol {
width: 50px;
height: 50px;
min-width: 50px;
min-height: 50px; }
.c-brand__title {
font-size: 18px; }
.c-brand__sub {
font-size: 10px; }
.c-brand__outline {
display: none; }
.c-kicker-frame {
display: flex;
justify-content: center;
align-items: center;
width: auto;
max-width: 100%;
font-size: clamp(12px, 1.85vw, 16px);
padding: min(10px, 1.16vw) min(24px, 2.77vw);
margin-bottom: min(20px, 2.31vw); }
.c-btn-primary {
text-align: center;
justify-content: center; }
.c-btn-primary--large {
width: 90%;
max-width: 340px;
min-width: auto;
font-size: clamp(16px, 2.77vw, 24px);
padding: min(20px, 2.31vw);
margin: 0 auto; }
.c-btn-primary--fixed {
display: none;
position: relative;
bottom: auto;
margin-top: 20px;
width: 100%;
right: auto; }
.c-btn-primary--fixed .c-btn-primary--fixed-inner {
display: block;
width: 100%; }
.c-btn-sub {
width: 10rem;
font-size: clamp(14px, 2.08vw, 18px); }
.c-btn-sub--arrow {
width: 6rem; }
.c-arrow-sep {
display: none; }
.c-orb-bg--large {
display: table; }
.c-orb-bg--small {
float: left; }
.c-node-circle {
position: relative; }
.c-node-circle__main-copy {
font-size: clamp(20px, 4.05vw, 35px); }
.c-node-circle__sub-copy {
font-size: clamp(14px, 2.2vw, 19px); }
.c-node-circle__award-title {
font-size: clamp(18px, 2.54vw, 22px); }
.c-node-circle__winner-name {
font-size: clamp(16px, 3.82vw, 33px); }
/* ページ内リンク */
.scroll__link {
display: none; }
.sec-hero {
--time-size: min(8.94vw, 60px);
padding-top: 100px; }
.sec-hero__title {
font-size: clamp(32px, 9.36vw, 81px);
margin-bottom: 20px; }
.sec-hero__title-unit {
font-size: clamp(32px, 9.36vw, 81px); }
.sec-hero__title-num {
font-size: clamp(44.5px, 10.23vw, 88.5px); }
.sec-hero__grid {
display: flex;
flex-flow: column;
align-items: center;
grid-template-columns: 1fr 0.8fr;
margin-bottom: 30px; }
.sec-hero__grid.c-inner {
padding: 10% 5%; }
.sec-hero__lead {
font-size: clamp(20px, 2.54vw, 22px);
margin-bottom: 20px; }
.sec-hero__lead br {
display: none; }
.sec-hero__text {
font-size: clamp(18px, 2.54vw, 22px);
margin-bottom: 40px; }
.sec-hero__text br {
display: none; }
.sec-hero__graphic {
width: 100%;
max-width: 890px;
position: relative; }
.sec-hero__bottom-bar {
padding: 0 5%; }
.sec-hero__dates {
font-size: clamp(24px, 3.7vw, 32px); }
.sec-hero__dates-week {
font-size: clamp(16px, 2.77vw, 24px); }
.sec-hero__bottom-btn {
flex-flow: column;
gap: 10px; }
.sec-hero__bottom-btn-item .c-btn-primary {
font-size: clamp(18px, 2.42vw, 21px); }
.sec-hero__timeline {
width: 100%;
max-width: 564px;
justify-content: space-between;
gap: 10px;
font-size: var(--time-size); }
.sec-hero .c-btn-sub {
width: calc(var(--time-size) * 5.5); }
.sec-hero .c-btn-sub--arrow {
width: calc(var(--time-size) * 4); }
.sec-hero__dots {
font-size: min(24px, 2.77vw); }
.sec-hero__nav-buttons {
width: 100%;
max-width: 564px;
gap: 0;
justify-content: space-between; }
.sec-hero .c-btn-primary--fixed {
display: block; }
.sec-timeline .c-inner {
align-items: flex-start; }
.sec-timeline__header-dark {
background-size: auto 40vw;
height: 40vw;
padding: 8vw 0 0 0; }
.sec-timeline__title-badge {
font-size: clamp(18px, 3.93vw, 34px);
padding-bottom: 4vw; }
.sec-timeline__kicker-wrapper {
margin: 60px 0 50px; }
.sec-timeline .c-kicker {
width: auto; }
.sec-timeline__title {
font-size: min(70px, 8.09vw); }
.sec-timeline__lead {
font-size: clamp(16px, 2.77vw, 24px); }
.sec-timeline__pre-history {
position: relative;
margin-bottom: 90px;
width: 100%; }
.sec-timeline__pre-badge-wrapper {
margin-bottom: 30px; }
.sec-timeline__pre-badge {
font-size: clamp(16px, 2.31vw, 20px); }
.sec-timeline__pre-line-container {
margin-top: 0; }
.sec-timeline__pre-line-container::before {
display: none; }
.sec-timeline__pre-nodes {
display: inherit;
border-left: 1px solid #cccccc;
margin-left: 10%;
padding: 0;
width: 100%; }
.sec-timeline__pre-nodes .c-arrow-sep {
top: 2.125rem; }
.sec-timeline__node {
display: inherit;
text-align: left;
width: 100%;
margin: 0 0 20px -44px; }
.sec-timeline__node time {
display: table;
font-size: 36px;
border-bottom: 1px solid #b0b0b0;
width: calc(100% - 88px - 5%);
text-align: left; }
.sec-timeline__node p {
display: table;
font-size: 18px; }
.sec-timeline__era-container {
width: 100%;
position: relative; }
.sec-timeline__era-container::before {
display: none; }
.sec-timeline__connector-line {
grid-template-columns: repeat(1, 1fr); }
.sec-timeline__connector-line .c-arrow-sep {
display: none; }
.sec-timeline__era-header {
justify-content: center;
align-items: center;
margin-bottom: 10px; }
.sec-timeline__era-tag {
position: relative;
z-index: 2;
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 20px;
color: #4b88f6;
display: flex;
align-items: center;
gap: 6px;
background: #ffffff;
padding: 0 12px;
margin-bottom: 0; }
.sec-timeline__era-tag .num {
font-size: 50px;
font-weight: 700;
line-height: 1; }
.sec-timeline__era-grid {
display: grid;
grid-template-columns: repeat(1, 1fr);
gap: 24px;
position: relative;
top: -24px; }
.sec-timeline__era-card {
display: flex;
width: 100%;
flex-direction: column; }
.sec-timeline__card-body {
background-color: #808080;
color: #ffffff;
padding: 32px 24px;
border-radius: 12px;
flex-grow: 1;
display: flex;
flex-direction: column;
position: relative; }
.sec-timeline__card-body:before {
left: calc(50% - 13px); }
.sec-timeline__card-body .sec-timeline__time-wrap {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 30px;
font-weight: 700;
display: block;
margin-bottom: 16px;
padding-bottom: 8px; }
.sec-timeline__card-body h3 {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: 25px;
font-weight: 600;
line-height: 1.4;
margin-bottom: 16px; }
.sec-timeline__card-body p {
font-family: "Noto Sans JP", sans-serif;
font-size: 15px;
line-height: 1.7;
margin-bottom: 24px;
opacity: 0.95; }
.sec-timeline__era-icons {
margin-top: auto;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
gap: 12px; }
.sec-timeline__bridge-bar {
background-color: #000000;
color: #ffffff;
padding: 30px 0;
position: relative; }
.sec-timeline__bridge-bar::before {
display: none; }
.sec-timeline__bridge-bar .c-arrow-sep {
position: absolute;
top: calc(50% - 10.5px);
left: calc(((100vw - 1440px) / 2) - 72px);
z-index: 80;
background: none; }
.sec-timeline__bridge-bar .c-arrow-sep::before {
right: 1px;
background-color: #000000; }
.sec-timeline__bridge-bar .c-arrow-sep .c-arrow-sep__chevron {
background-color: #ffffff !important; }
.sec-timeline__bridge-inner {
display: flex;
flex-flow: column;
align-items: center !important;
justify-content: center;
gap: 20px;
position: relative; }
.sec-timeline__bridge-inner .c-orb-bg {
width: 40px;
height: 40px;
flex-shrink: 0;
top: 0;
background-color: transparent; }
.sec-timeline__year-highlight {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
font-size: clamp(32px, 6.24vw, 54px);
font-weight: 700;
letter-spacing: 0.02em;
margin: 0 10px 0 0; }
.sec-timeline__bridge-text {
font-family: "PT Serif", "Hiragino Mincho ProN", "Yu Mincho", serif;
display: flex;
flex-flow: column;
align-items: flex-start; }
.sec-timeline__bridge-text .txt-sub {
font-size: clamp(16px, 2.31vw, 20px); }
.sec-timeline__bridge-text .txt-main {
font-size: clamp(30px, 5.55vw, 48px);
font-weight: 600; }
.sec-now {
gap: 20px;
padding: 0 0 10% 0; }
.sec-now__title {
font-size: clamp(24px, 3.93vw, 34px); }
.sec-now__title:before {
width: 100px;
height: 100px;
margin: 0 auto;
position: relative;
left: 0;
top: 0; }
.sec-now__text {
font-size: clamp(18px, 2.77vw, 24px); }
.sec-constant {
padding: min(197px, 22.77vw) 0 0 0; }
.sec-constant .c-inner {
align-items: flex-start; }
.sec-constant__title {
font-size: min(70px, 8.09vw);
margin-bottom: min(68px, 7.86vw); }
.sec-constant__title .c-highlight-box {
margin-top: 0; }
.sec-constant .c-kicker-frame {
margin-bottom: min(120px, 13.87vw); }
.sec-constant__lead {
font-size: clamp(16px, 2.77vw, 24px); }
.sec-constant__lead br {
display: none; }
.sec-constant__question-banner {
font-size: clamp(16px, 2.77vw, 24px);
padding: 10% 8%;
left: -5vw; }
.sec-constant__question-banner:after {
width: 100%; }
.sec-impact {
/* 個別ノード位置 SP調整 */ }
.sec-impact .c-inner {
align-items: flex-start; }
.sec-impact__title {
font-size: min(70px, 8.09vw); }
.sec-impact__lead {
font-size: clamp(16px, 2.77vw, 24px); }
.sec-impact__footnote {
font-family: "Noto Sans JP", sans-serif;
font-size: 12px;
letter-spacing: 0.04em;
margin-top: 75px; }
.sec-impact__network-wrapper {
position: relative;
width: 100%;
height: auto;
aspect-ratio: auto;
margin: 0 auto; }
.sec-impact__halftone {
display: none; }
.sec-impact__network-nodes {
display: flex;
flex-flow: column;
gap: 20px;
align-items: center;
position: relative;
background: none; }
.sec-impact__node--immunology {
width: 90%;
height: auto;
aspect-ratio: 1;
top: auto;
left: auto;
animation-delay: 0s, 1.2s; }
.sec-impact__node--winner1 {
width: 60%;
height: auto;
aspect-ratio: 1;
top: auto;
left: auto;
animation-delay: 1.0s, 2.4s; }
.sec-impact__node--anti {
width: 90%;
height: auto;
aspect-ratio: 1;
top: auto;
right: auto;
animation-delay: 2.0s, 3.3s; }
.sec-impact__node--winner4 {
width: 60%;
height: auto;
aspect-ratio: 1;
top: auto;
right: auto;
animation-delay: 3.0s, 4.5s; }
.sec-impact__node--drug {
width: 90%;
height: auto;
aspect-ratio: 1;
top: auto;
right: auto;
animation-delay: 4.0s, 5.3s; }
.sec-impact__node--winner6 {
width: 60%;
height: auto;
aspect-ratio: 1;
top: auto;
right: auto;
animation-delay: 5.0s, 6.5s; }
.sec-impact__node--bioman {
width: 90%;
height: auto;
aspect-ratio: 1;
bottom: auto;
left: auto;
animation-delay: 6.0s, 7.2s; }
.sec-impact__node--bioman .c-node-circle__cat-label,
.sec-impact__node--bioman .c-node-circle__main-copy {
margin-bottom: 10px; }
.sec-impact__node--winner3 {
width: 60%;
height: auto;
aspect-ratio: 1;
bottom: auto;
left: auto;
right: auto;
animation-delay: 7.0s, 8.6s; }
.sec-future {
--num-size: min(140px, 16.18vw);
--badge-size: clamp(18px, 3.47vw, 26px);
padding: min(197px, 22.77vw) 0 min(197px, 22.77vw) 0;
background-size: 140vw auto;
background-position: 45% top; }
.sec-future .c-inner {
align-items: flex-start; }
.sec-future__title {
font-size: min(70px, 8.09vw);
margin-bottom: min(68px, 7.86vw); }
.sec-future__title .c-highlight-box {
padding: 0 20px; }
.sec-future .c-kicker-frame {
margin-bottom: min(68px, 7.86vw); }
.sec-future__lead {
font-size: clamp(16px, 2.77vw, 24px); }
.sec-future__lead br {
display: none; }
.sec-future__category-cards {
grid-template-columns: repeat(1, 1fr); }
.sec-future__cat-card {
padding: 8% 0; }
.sec-future__cat-card::before {
width: 180px;
height: 180px; }
.sec-future__cat-card p {
font-size: 16px;
padding: 0 8%;
margin: 0 0 5% 0; }
.sec-future__cat-card p br {
display: none; }
.sec-future__cat-head {
margin-bottom: 5%;
overflow: hidden; }
.sec-future__cat-num {
font-size: var(--num-size); }
.sec-future__cat-badge {
flex-shrink: 0;
letter-spacing: 0;
font-size: var(--badge-size); }
.sec-future__cat-title {
font-size: clamp(20px, 3.47vw, 30px);
padding: 0 8%;
margin: 0 0 5% 0; }
.sec-future__cat-title br {
display: table; }
.sec-future__detail-block:first-of-type .sec-future__sub-grid-4 .sec-future__sub-item .sec-future__sub-lead {
margin-bottom: 30px; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-header-main, .sec-future__detail-block:nth-of-type(3) .sec-future__detail-header-main {
width: 100%; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-header-desc, .sec-future__detail-block:nth-of-type(3) .sec-future__detail-header-desc {
width: 100%;
padding: 8% 8% 0 8%;
margin-top: 8%; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-header-desc p, .sec-future__detail-block:nth-of-type(3) .sec-future__detail-header-desc p {
font-size: 16px; }
.sec-future__detail-block:nth-of-type(2) .sec-future__detail-header-desc p.sec-future__catch-phrase, .sec-future__detail-block:nth-of-type(3) .sec-future__detail-header-desc p.sec-future__catch-phrase {
font-size: clamp(20px, 3.24vw, 28px); }
.sec-future__detail-header {
padding: 8% 0;
position: relative;
overflow: hidden; }
.sec-future__detail-header::before {
width: 180px;
height: 180px; }
.sec-future__detail-num {
font-size: min(140px, 16.18vw); }
.sec-future__detail-badge {
display: block;
font-family: "Roboto", sans-serif;
font-size: var(--badge-size);
font-weight: 700;
color: #ffffff;
letter-spacing: 0.05em;
padding: 3px 20px;
background: #5f98e3;
position: relative;
z-index: 20; }
.sec-future__detail-title {
font-size: clamp(22px, 3.47vw, 30px);
padding: 0 8%;
margin: min(30px, 3.47vw) 0;
position: relative;
z-index: 50; }
.sec-future__detail-title .sec-future__detail-title-strong {
font-size: clamp(18px, 2.31vw, 20px); }
.sec-future__detail-title br {
display: table; }
.sec-future__detail-lead {
font-size: 16px;
padding: 0 8%;
margin: 0; }
.sec-future__detail-lead br {
display: none; }
.sec-future__detail-theme {
font-size: 20px;
padding: 0 8%;
margin: 0 0 1em 0; }
.sec-future__detail-theme br {
display: none; }
.sec-future__detail-theme br.sp {
display: table; }
.sec-future__section-sub-heading {
text-align: center;
padding: 8%; }
.sec-future__section-sub-heading:nth-of-type(2) {
padding-top: 2em; }
.sec-future__section-sub-heading--inner {
width: 100%;
font-size: clamp(13px, 3.24vw, 26px); }
.sec-future__notice-text {
font-size: clamp(13px, 3.24vw, 26px);
padding: 30px 0; }
.sec-future__sub-grid-4 {
display: flex;
flex-flow: column;
gap: 30px;
padding: 8% 8% 0 8%; }
.sec-future__sub-grid-4 .sec-future__sub-item:first-of-type {
padding: 8% 0; }
.sec-future__sub-grid-4 .sec-future__sub-item:first-of-type,
.sec-future__sub-grid-4 .sec-future__sub-item:nth-of-type(2) {
padding: 0 0 8% 0; }
.sec-future__sub-item {
padding: 0 0 8% 0;
border-bottom: 1px solid #cccccc; }
.sec-future__sub-num {
font-size: clamp(14px, 3.47vw, 30px);
width: 2em;
height: 2em;
margin-right: 1em; }
.sec-future__sub-title {
font-size: clamp(13px, 2.31vw, 20px); }
.sec-future__sub-title br {
display: none; }
.sec-future__sub-lead {
font-size: clamp(18px, 2.43vw, 21px);
margin-bottom: 0; }
.sec-future__sub-list li {
font-size: clamp(14px, 1.73vw, 15px);
margin-bottom: 0.5em; }
.sec-future__speaker-name {
font-size: clamp(18px, 2.54vw, 22px); }
.sec-future__speaker-title {
font-size: clamp(14px, 2.08vw, 18px); }
.sec-future__sub-grid-2 {
display: flex;
flex-flow: column;
gap: 30px;
padding: 0 8%; }
.sec-future__sub-item-content {
display: table;
margin: 0 auto; }
.sec-future__sub-head {
display: flex;
align-items: center; }
.sec-future__sub-head .sec-future__sub-title {
width: calc(100% - 2em - 20px); }
.sec-future__next-block {
padding: 0 8% 12% 8%; }
.sec-future__next-block p {
font-size: clamp(18px, 2.43vw, 21px);
padding: 1.5em 0 0 0; }
.sec-future__next-block p.sec-future__next-title {
font-size: clamp(18px, 2.54vw, 22px);
padding-top: 0; }
.sec-future__next-block p .sec-future__next-btn-link {
width: 100%;
text-align: center;
font-size: clamp(13px, 2.31vw, 20px);
padding: min(20px, 2.31vw); }
.sec-cta {
padding: min(197px, 22.77vw) 0 min(197px, 22.77vw) 0; }
.sec-cta .c-inner {
align-items: center; }
.sec-cta::before {
content: "";
display: block;
width: 773px;
height: 650px;
background: url("images/section06/earth.svg") no-repeat center top/100vw auto;
position: absolute;
left: 0;
top: -90px;
transform: scale(-1, -1);
z-index: 10;
opacity: 0.25; }
.sec-cta::after {
display: none; }
.sec-cta__orb {
opacity: 0.47; }
.sec-cta__orb--left-top {
width: 819px;
height: 819px;
background: url("images/section06/left_top@2x.webp") no-repeat left top/contain;
left: -390px;
top: 170px; }
.sec-cta__orb--right-top {
width: 680px;
height: 680px;
background: url("images/section06/right_top@2x.webp") no-repeat left top/contain;
right: -390px;
bottom: 370px; }
.sec-cta__orb--left-bottom {
width: 332px;
height: 332px;
background: url("images/section06/left_bottom@2x.webp") no-repeat left top/contain;
left: 140px;
bottom: 0; }
.sec-cta .c-kicker-frame {
margin-bottom: 30px; }
.sec-cta__title {
font-size: min(74px, 8.55vw);
margin-bottom: min(74px, 7.86vw); }
.sec-cta__lead {
font-size: clamp(16px, 2.77vw, 24px);
margin-bottom: min(100px, 11.56vw); }
.sec-cta__lead br {
display: none; }
.sec-cta__logo {
gap: 10px;
align-items: center;
margin-bottom: min(20px, 2.31vw);
display: flex;
justify-content: center; }
.sec-cta__outline {
gap: 10px;
margin-bottom: min(40px, 4.62vw); }
.sec-cta__outline-en {
font-size: clamp(16px, 2.31vw, 20px); }
.sec-cta__outline-dates {
font-size: clamp(18px, 2.77vw, 24px); }
.sec-cta__outline-venue {
font-size: clamp(22px, 3.93vw, 34px); }
.sec-cta__actions {
display: flex;
flex-flow: column;
width: 100%;
justify-content: center;
margin: min(46px, 5.32vw) auto 0 auto; }
.sec-cta__actions-item {
width: 100%; }
.sec-cta__actions-item img {
display: none; }
.sec-cta__actions-item:first-of-type img {
display: table; }
.sec-result {
padding: 80px 0; }
.sec-result__title {
font-size: min(70px, 8.09vw);
margin-bottom: 50px; }
.sec-result__main {
font-size: clamp(16px, 2.77vw, 24px); }
.sec-voice {
padding: 80px 0; }
.sec-voice .c-kicker-frame {
margin-bottom: min(68px, 7.86vw); }
.sec-voice__title {
font-size: min(70px, 8.09vw);
margin-bottom: 50px; }
.sec-voice__lead {
font-size: clamp(16px, 2.77vw, 24px); }
.sec-voice__cards {
margin-bottom: 0 !important; }
.sec-voice__cat-card {
width: 100%; }
.sec-voice__cat-card p {
font-size: clamp(16px, 2.31vw, 20px); }
.sec-voice__cat-num {
font-size: clamp(70px, 9.24vw, 80px); }
.sec-voice__cat-title {
font-size: clamp(24px, 3.46vw, 30px); }
.sec-voice__btn {
width: 100%; }
.sec-voice__btn-inner {
position: relative; }
.sec-voice__btn-inner a {
font-size: clamp(18px, 2.77vw, 24px); }
.sec-find {
background: url("images/section09/bg_photo.webp") no-repeat center top/240% auto, url("images/section05/bg_bottom.webp") no-repeat center bottom/100% auto, #ffffff; }
.sec-find__title {
font-size: min(70px, 8.09vw);
margin-bottom: 50px; }
.sec-find__title .c-highlight-box {
padding: 0 5px; }
.sec-find__lead {
font-size: clamp(16px, 2.77vw, 24px); }
.sec-find__lead br {
display: none; }
.sec-find__cards {
margin-top: 30px !important;
margin-bottom: 0 !important; }
.sec-find__cat-card {
width: 100%;
border: 1px solid #cccccc; }
.sec-find__cat-num-inner {
font-size: 32px;
width: 54px; }
.sec-find__cat-title {
font-size: clamp(20px, 2.77vw, 24px);
padding: 10px; }
.sec-find__cat-title-large {
font-size: clamp(24px, 3.46vw, 30px); }
.sec-find__cat-btn a {
font-size: 16px; } }