*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --red:#E60012;
  --black:#111;
  --navy:#1e2535;
  --white:#fff;
  --font-en:'Avenir Next LT Pro','Avenir Next','Century Gothic','Trebuchet MS',sans-serif;
  --font-ja:'Noto Sans JP',sans-serif;
}
html{scroll-behavior:smooth}
body{font-family:var(--font-ja);background:#fff;color:var(--black);overflow-x:hidden}
img{display:block;max-width:100%}

/* ========== HERO ========== */
#hero{
  position:relative;
  background:#000;
  height:90svh;
  min-height:560px;
  overflow:hidden;
}
#hero .bg{
  position:absolute;inset:0;
  background:url('img/hero_bg.png') center 30% / cover no-repeat;
  opacity:0.55;
}
#hero .overlay{
  position:absolute;inset:0;
  background:linear-gradient(160deg,rgba(0,0,0,0.15) 0%,rgba(0,0,0,0.55) 100%);
}
/* 右側の薄い1926 */
#hero .deco-year{
  position:absolute;right:-10px;bottom:50px;
  font-family:var(--font-en);
  font-size:clamp(120px,28vw,280px);
  font-weight:900;color:rgba(255,255,255,0.25);
  line-height:1;letter-spacing:-0.02em;
  pointer-events:none;user-select:none;
  z-index: 9;
}
@media only screen and (max-width: 767px) {

#hero{
  height:80svh;
}
#hero .deco-year{
  bottom:170px;
}
}

/* 左上ロゴ */
#hero .logo-top{
  position:absolute;top:20px;left:20px;z-index:5;
  display:flex;align-items:center;gap:8px;max-width: 150px;
}
@media only screen and (max-width: 767px) {
#hero .logo-top{
max-width: 100px;
}
}
#hero .logo-top svg{width:38px;height:38px}
#hero .logo-top .lt{
  font-family:var(--font-en);font-size:9px;
  color:rgba(255,255,255,0.8);letter-spacing:0.15em;line-height:1.5;
}
/* 左下テキスト */
#hero .hero-text{
  position:absolute;left:28px;bottom:52px;z-index:4;
}
#hero .hero-text .t1{
  font-family:var(--font-en);font-size:clamp(52px,11vw,108px);
  font-weight:900;color:#fff;letter-spacing:0.06em;line-height:1;max-width:200px;    padding-left: 10px;
}
#hero .hero-text .t2{
  font-family:var(--font-en);font-size:clamp(52px,11vw,108px);
  font-weight:900;color:#fff;letter-spacing:0.06em;line-height:1;
}
@media only screen and (max-width: 767px) {
#hero .hero-text .t2{
    font-size: clamp(72px, 14vw, 140px);
}
.sub {
    font-size: 50% !important;
}
}
#hero .hero-text .t3{
  font-family:var(--font-en);font-size:clamp(22px,4vw,32px);
  color:rgba(255,255,255,0.75);letter-spacing:0.15em;margin-top:6px;margin-left:12px;
}
#hero .hero-text .t4{
  font-family:var(--font-en);font-size:clamp(30px,5vw,42px);
  color:rgba(255,255,255,1);letter-spacing:0.05em;margin-top:4px;font-weight:900;margin-left:12px;
}
/* スクロールライン */
#hero .scroll-bar{
  position:absolute;right:28px;bottom:0;z-index:4;
  display:flex;flex-direction:column;align-items:center;gap:8px;
  padding-bottom:20px;
}
#hero .scroll-bar span{
  font-family:var(--font-en);font-size:8px;letter-spacing:0.3em;
  color:rgba(255,255,255,0.45);writing-mode:vertical-rl;
}
#hero .scroll-bar .line{
  width:1px;height:60px;background:rgba(255,255,255,0.25);
  position:relative;overflow:hidden;
}
#hero .scroll-bar .line::after{
  content:'';position:absolute;top:-100%;left:0;width:100%;height:100%;
  background:#fff;animation:sa 2.2s ease-in-out infinite;
}
@keyframes sa{0%{top:-100%}100%{top:100%}}

/* ========== 100 YEARS ========== */
#hundred{
  position:relative;
  background:url('img/hundred_bg.png') center center / cover no-repeat;
}
#hundred .title-block{
  text-align:center;padding:80px 20px 32px;
  position:relative;
}
#hundred .title-block .pre{
  font-family:var(--font-en);font-size:20px;letter-spacing:0.35em;
  color:#000;margin-bottom:8px;
}
#hundred .title-block .main{
  font-family:var(--font-en);font-size:clamp(64px,14vw,140px);
  font-weight:900;color:var(--black);letter-spacing:0.02em;line-height:1;margin-bottom:20px;
}
#hundred .title-block .sub{
  font-family:var(--font-en);font-size:12px;letter-spacing:0.3em;color:#000;margin-top:6px;
}

/* ボルト画像＋縦書きエリア */
.bolt-overlay-wrap{
  position:relative;overflow:hidden;
  width:100%;
}
.bolt-full-img{
  width:100%;max-height:440px;object-fit:cover;object-position:center;
  display:block;
}
.bolt-vtext-overlay{
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    vertical-align: top;
    text-align: justify;
    margin: 0 auto;margin-top: 30px;}

@media only screen and (max-width: 767px) {
.bolt-vtext-overlay span{
	font-size:26px !important;
}
#hundred {
    background: url(img/hundred_bg.png) center center / contain no-repeat;
}
#movie .title-block {
    padding: 0 20px 32px !important;
}
#movie .movie {
    margin-bottom: 0 !important;
}
}

.bolt-vtext-overlay span{
  writing-mode:vertical-rl;text-orientation:mixed;
  font-size:clamp(15px,2.5vw,22px);font-weight:700;
  color:var(--black);letter-spacing:0.18em;line-height:1.7;
}
/* 本文テキスト */
#hundred .body-block{
  padding: 350px 0 80px;max-width: 900px;text-align: center;margin: 0 auto;
}
#hundred .body-block p{
  font-size:13px;line-height:2.3;color:#000;margin-bottom:18px;
}

/* ========== MOVIE ========== */
#movie{
  position:relative;
  background:#fff;
}
#movie .title-block{
  text-align:center;padding:80px 20px 32px;
  position:relative;
}
#movie .title-block .pre{
  font-family:var(--font-en);font-size:20px;letter-spacing:0.35em;
  color:#000;margin-bottom:8px;
}
#movie .title-block .main{
  font-family:var(--font-en);font-size:clamp(64px,14vw,140px);
  font-weight:900;color:var(--black);letter-spacing:0.02em;line-height:1;margin-bottom:20px;
}
#movie .title-block .sub{
  font-family:var(--font-en);font-size:12px;letter-spacing:0.3em;color:#000;margin-top:6px;
}

#movie .movie{
	position: relative;
	padding-top: 56.25%; /* 16:9 アスペクト比 */
	height: 0;
	max-width:960px;
	left:50%;
	transform: translateX(-50%);
	margin-bottom:90px;
}

#movie .movie iframe {
	position: absolute;
	top: 0;
  left:50%;
  transform: translateX(-50%);
	width: 100%;
	height: 100%;
}
/* 本文テキスト */

#movie .body-block p{
  font-size:13px;line-height:2.3;color:#000;margin-bottom:18px;
}

/* ========== MESSAGE ========== */
#message{
  position:relative;background:#111;padding:80px 0 50px;overflow:hidden;
}
#message .msg-bg{
  position:absolute;inset:0;
  background:url('img/message_bg.png') center center / cover no-repeat;
}
#message .msg-header{
  position:relative;z-index:2;text-align:center;margin-bottom:52px;padding:0 20px;
}
#message .msg-header .pre{
  font-size:20px;color:#fff;letter-spacing:0.25em;margin-bottom:10px;
}
#message .msg-header .title{
  font-family:var(--font-en);font-size:clamp(48px,10vw,100px);
  font-weight:900;color:#fff;letter-spacing:0.1em;line-height:1;margin-bottom:20px;
}
#message .msg-header .sub{
  font-family:var(--font-en);font-size:12px;color:#fff;
  letter-spacing:0.3em;margin-top:6px;
}

/* 1人分のカード */
.mc{
  position:relative;z-index:2;
  max-width:900px;margin:0 auto;padding:0 24px;display:flex;
}
.mc-inner{
  display:grid;grid-template-columns:1fr 360px;align-items:start;gap:0;margin-left: 100px;
}
.mc-inner.rev{grid-template-columns:260px 1fr}
.mc-info{padding:0 0 12px}
.mc-info .role{font-size:14px;color:#fff;letter-spacing:0.18em;line-height:1.8;margin-top: 80px;}
.mc-info .role-en{
  font-family:var(--font-en);font-size:9px;
  color:#fff;letter-spacing:0.25em;
}
.mc-info .name{
  font-size:clamp(22px,4vw,32px);font-weight:700;
  color:#fff;letter-spacing:0.12em;margin:6px 0 3px;
}
.mc-info .name-en{
  font-family:var(--font-en);font-size:10px;
  color:#fff;letter-spacing:0.2em;
}
/* 写真エリア */
.mc-photo{position:relative}
.mc-photo .ph{
  width:100%;
  overflow:hidden;display:flex;align-items:center;justify-content:center;
}
.mc-photo .ph img{width:100%;height:100%;object-fit:cover;object-position:top}
.mc-photo .ph-placeholder{
  width:100%;font-size:11px;color:#000;text-align:center;padding:40px 10px;
}
/* 赤いバッジ（右端に縦書き） */
.mc-badge{
  position:absolute;right:-2px;top:16px;
  background:var(--red);
  writing-mode:vertical-rl;text-orientation:mixed;
  font-size:19px;font-weight:700;color:#fff;
  padding:10px 10px;letter-spacing:0.15em;line-height:1.5;
  z-index:3;
}
.mc-inner.rev .mc-badge{right:auto;left:-2px}

@media only screen and (max-width: 767px) {
.mc {
    display: unset;
}
.mc-inner {
    margin: 0 8%;
}
.mc-info .role {
    margin-top: 40px;
}
.mc-info {
    padding: 0 0 8% 10%;
}
.mc-badge {
    font-size: 16px;
}
}

/* ========== HISTORY ========== */
#history{padding:80px 0 0}
#history .hist-header{text-align:center;margin-bottom:64px;padding:0 20px}
#history .hist-header .pre{
  font-size:20px;color:#000;letter-spacing:0.2em;margin-bottom:8px;
}
#history .hist-header .title{
  font-family:var(--font-en);font-size:clamp(48px,10vw,100px);
  font-weight:900;color:var(--black);letter-spacing:0.08em;line-height:1;margin-bottom:20px;
}
#history .hist-header .sub{
  font-family:var(--font-en);font-size:12px;color:#000;letter-spacing:0.3em;margin-top:6px;
}

.tl-dark .ti.vis{
	grid-template-columns:1fr 1fr;
	opacity:1;
	transform:none
}
@media only screen and (max-width: 767px) {
.tlw::before {
	left: 50%;
	transform: translateX(-50%);
	width: 30px !important;
}
.ti .dot {
	left: 50%;
	transform: translateX(-50%);
        top: 28px !important;
}
.ty {
    font-size: 56px !important;
}
.ti.vis {
}
.td {
    font-size: 10px !important;
}
.ti-r {
	padding: 20px 0 20px 0 !important;
}
.ti-l {
	padding: 28px 0 0 0 !important;
}
.tl-dark .ti {
    display: unset;
    grid-template-columns: 1fr 1fr !important;
}

.ht-section .ht-year {
    font-size: 56px !important;
}
.ht-section .ht-title {
    font-size: 20px !important;
}
.tt {
    font-size: 20px !important;
}
.ht-section .ht-logo-txt {
    font-size: 60px !important;
}
.ht-section .ht-body2 {
    font-size: 22px !important;
}


}


/* タイムライン */
.tlw{
  position:relative;max-width:900px;margin:0 auto;padding:0 20px;
}
.tlw::before{
  content:'';position:absolute;top:0;bottom:0;
  left:50%;transform:translateX(-50%);
  width:69px;background:var(--red);margin-top:-50px;z-index:-1;
}
/* アイテム */
.ti{
  display:grid;grid-template-columns:1fr 1fr;
  opacity:0;transform:translateY(28px);
  transition:opacity 0.55s ease,transform 0.55s ease;
}
.ti.vis{opacity:1;transform:translateY(0);margin-top:-100px;}
.ti-l{padding:28px 36px 0 0;text-align:left}
.ti-r{padding:28px 0 28px 36px;text-align:right}
/* 中央ドット */
.ti{position:relative}
.ti .dot{
  position:absolute;left:50%;top:34px;
  transform:translateX(-50%);
  width:15px;height:15px;border-radius:50%;
  background:var(--red);border:3px solid #fff;
  outline:2px solid var(--red);z-index:2;
}
/* 空セル非表示 */
.ti.lo .ti-r{visibility:hidden}
.ti.ro .ti-l{visibility:hidden}

.ty{font-family:var(--font-en);font-size:clamp(30px,5.5vw,56px);font-weight:900;color:var(--black);line-height:1;margin-bottom:2px}
.tt{font-size:clamp(13px,2vw,17px);font-weight:700;color:var(--black);line-height:1.5;margin-bottom:6px}
.td{font-size:13px;color:#000;line-height:1.9;max-width:380px;}
.timg{margin-top:10px;overflow:hidden}
.timg img{width:100%;max-width:210px;height:auto;filter:grayscale(20%);margin-bottom: 10px;}
.ti-l .timg{margin-left:auto}

.ti-r .timg img {float:right;}
.ti-r .td {float:right;}

/* 2020 黒背景ブロック */
.tl-dark{background:var(--black);padding:0;margin:100px 0 0 0;}
.tl-dark .tlw::before{background:var(--red)}
.tl-dark .ty{color:#fff}
.tl-dark .tt{color:#fff}
.tl-dark .td{color:rgba(255,255,255,0.65)}
/* 2020の赤セル */
.ti-red-l{
  background:var(--red);
  padding:88px 30px 28px 0;
  text-align:left;
}
.ti-red-l .ty,.ti-red-l .tt{color:#fff}
.ti-red-l .td{color:#fff}
/* TORQロゴ赤セル */
.ti-torq-r{
  background:var(--red);
  display:flex;align-items:center;justify-content:center;
  padding:60px;
}
.ti-torq-r .torq-wm{
  font-family:var(--font-en);font-size:clamp(28px,5vw,48px);font-weight:900;
  color:#fff;letter-spacing:0.1em;
  display:flex;align-items:center;gap:10px;
}

.tl-dark .tlw{
    max-width: 100%;
    padding: 0;
}

/* HIGH TECH LOGISTICS ダークネイビー */
.ht-section{
  background:var(--black);
  padding:56px 40px;
}
.ht-section .ht-top{
  display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start;margin-bottom:32px;
}
.ht-section .ht-photo img{width:100%;height:180px;object-fit:cover}
.ht-section .ht-logo-txt{
  font-family:var(--font-en);
  font-size:clamp(28px,5.5vw,56px);font-weight:900;
  color:rgba(255,255,255,0.12);line-height:1.15;letter-spacing:0.04em;text-align:right;
  align-self:center;
}
.ht-section .ht-year{
  font-family:var(--font-en);font-size:clamp(28px,5.5vw,56px);font-weight:900;color:#fff;line-height:1;text-align:left;
}
.ht-section .ht-title{
  font-size:clamp(15px,2.5vw,20px);font-weight:700;color:#fff;line-height:1.5;margin:8px 0 16px;text-align:left;
}
.ht-section .ht-body{font-size:12px;color:#fff;line-height:2;margin-bottom:28px;text-align:left;    max-width: 400px;}
.ht-section .ht-body2{font-size:clamp(16px,2.5vw,20px);font-weight:700;color:#fff;line-height:1.6;margin-bottom:12px;text-align:left;max-width: 400px;}
.ht-section .ht-body3{font-size:12px;color:#fff;line-height:2;margin-bottom:20px;text-align:left;}
.ht-photo-row{display:grid;gap:3px;margin-top:10px}
.ht-photo-row img{width:100%;height:90%;object-fit:cover}

/* 2022〜2026 白背景 */
.tl-white{}

/* 2023 ねじネット暗いブロック */
.nejinet-block{
	background:var(--navy);
	min-height:200px;
}

.nejinet-block .nejinet-block_inner{
	max-width: 860px;
	text-align: center;
	margin: 0 auto;
	padding:60px 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
}

.ht-section_left{
	width:50%;
	float:left;
}
.ht-section_right{
	width:40%;
	float:right;
}
@media only screen and (max-width: 767px) {
.tlw {
    padding: 0 8%;
}
.ht-section_left{
	width:100%;
	float:unset;
}
.ht-section_right{
	width:100%;
	float:unset;
}
.tl-dark .ti.vis{
	padding:30px 0 45px 0;
	display: block;
}
.ti.vis{
	margin-top:-30px;
}
.tlw.dk_navy {
    padding: 40px 8% !important;
}
.nejinet-block .nby {
    font-size: 56px !important;
}
.nejinet-block .nbt {
    font-size: 20px !important;
}
.nejinet-block .nejinet-block_inner {
    padding: 60px 8%;
}
.tl-white_right{
    padding-top: 100px !important;
}
.img_hand{
	max-width: 200px;
        text-align: center;
        margin: 0 auto;
}
.tlw.img_hand_bottom{
	padding: 0 8%;
        margin-top: 100px;
}
}


.nejinet-block .nb-left{;text-align:left;}
.nejinet-block .nb-right{}
.nejinet-block .nby{font-family:var(--font-en);font-size:clamp(30px, 5.5vw, 56px);font-weight:900;color:#fff;line-height:1;margin-bottom:6px}
.nejinet-block .nbt{font-size:clamp(14px,2vw,18px);font-weight:700;color:#fff;margin-bottom:8px}
.nejinet-block .nbd{font-size:11px;color:rgba(255,255,255,0.65);line-height:1.9}
.nejinet-block .nb-img{
  background:#2a3040;width:100%;max-width:260px;height:140px;
  display:flex;align-items:center;justify-content:center;color:#000;font-size:11px;
  overflow:hidden;
}
.nejinet-block .nb-img img{width:100%;height:100%;object-fit:cover}

/* 引取通知バッジ */
.hikitori-badge{
  display:inline-flex;flex-direction:column;align-items:center;justify-content:center;
  width:72px;height:72px;border-radius:10px;
  border:3px solid var(--red);
  font-size:13px;font-weight:900;color:var(--red);
  line-height:1.3;text-align:center;margin:8px 0;
}

/* ========== NUMBERS ========== */
#numbers{background:#F8F8F8;padding:80px 20px}
#numbers .num-pre{text-align:center;font-size:20px;color: var(--red);letter-spacing:0.2em;margin-bottom:14px}
#numbers .num-torq{
  text-align:center;
  font-family:var(--font-en);font-size:clamp(56px,11vw,112px);
  font-weight:900;color:var(--red);letter-spacing:0.1em;line-height:1;margin-bottom:20px;
}
#numbers .num-sub{
  text-align:center;font-family:var(--font-en);font-size:12px;
  color: var(--red);letter-spacing:0.3em;margin-bottom:48px;
}
.ng{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:840px;margin:0 auto}
.nc{border:2px solid var(--red);padding:22px 12px;text-align:center}
.nc .ncl{font-size:16px;color:var(--red);line-height:1.65;margin-bottom:10px}
.nc .ncv{
  font-family:var(--font-en);font-size:clamp(28px,5vw,46px);
  font-weight:900;color:var(--red);line-height:1;
}
.nc .ncv .ncu{font-size:14px;font-weight:700}

@media only screen and (max-width: 767px) {
#numbers {
    padding: 80px 8%;
}
.nc {
    padding: 22px 5px;
}
.nc .ncl {
    font-size: 10px;
}
.nc .ncv {
    font-size: 40px;
}
}

/* ========== NEXT 100 YEARS ========== */
#next{
  position:relative;overflow:hidden;
  background:#111;min-height:600px;
}
#next .nbg{
  position:absolute;inset:0;
  background:url('img/next_bg.png') center center / cover no-repeat;
  opacity:0.55;
}
#next .nov{
  position:absolute;inset:0;
  background:rgba(0,0,0,0.45);
}
#next .ndeco{
  position:absolute;right:332px;top:44%;transform:translateY(-50%);
  pointer-events:none;user-select:none;
  line-height:1;
}
#next .ndeco .dl1{
  font-family:var(--font-en);
  font-size:clamp(40px,8vw,88px);font-weight:900;
  color:rgba(255,255,255,0.12);letter-spacing:0.05em;
  display:block;text-align:right;
}

@media only screen and (max-width: 767px) {
#next .nbig {
    font-size: clamp(64px, 14vw, 140px) !important;
}
#next .ntitle {
    font-size: 20px;
}
#next .nc2 {
    padding: 72px 10% !important;
}
#next .ndeco .dl1 {
    font-size: 60px;
}
#next .nic {
    margin-top: 20px;
}
#next .ndeco {
    right: 0;
    top: 40%;
}
}

#next .nc2{
  position:relative;z-index:3;
  padding:72px 0;
}
#next .npre{
  font-family:var(--font-en);font-size:10px;color:rgba(255,255,255,0.6);
  letter-spacing:0.4em;margin-bottom:10px;
}
#next .ntitle{
  font-family:var(--font-en);font-size:clamp(12px,2.5vw,22px);
  color:#fff;letter-spacing:0.35em;margin-bottom:4px;
}
#next .nbig{
  font-family:var(--font-en);font-size:clamp(48px,10vw,108px);
  font-weight:900;color:#fff;letter-spacing:0.06em;line-height:1;margin-bottom:16px;
}
#next .nhead{
  font-size:clamp(18px,3vw,28px);font-weight:700;color:#fff;line-height:1.6;margin-bottom:16px;text-align:left;
}
#next .nbody{font-size:14px;color:rgba(255,255,255,0.75);line-height:2;margin-bottom:28px;max-width:900px;text-align:left;}
#next .nicons{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;max-width:900px}
#next .nic{padding:16px 5px;text-align:center;margin-top: 70px;}
#next .nic img{width:100%;height:auto;object-fit:cover;margin-bottom:8px}
#next .nic .niph{width:100%;margin-bottom:8px;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.3);font-size:10px}
#next .nic .nit{font-size:13px;color:rgba(255,255,255,0.75);line-height:1.7;font-weight:500}

/* ========== TOGETHER ========== */
#together{background:#fff}
/* 社員グリッド */
.staff-grid{
  display:grid;grid-template-columns:repeat(10,1fr);
  gap:2px;background:#ddd;
}
.staff-grid .sc{
  aspect-ratio:1;background:#000;overflow:hidden;
}
.staff-grid .sc img{width:100%;height:100%;object-fit:cover}
/* 青い都市背景エリア */
.together-city{
  position:relative;overflow:hidden;
  min-height:520px;
}
.together-city .cbg{
  position:absolute;inset:0;
  background:url('img/together_bg.png') top center / cover no-repeat;background-size: 200%;
}

@media only screen and (max-width: 767px) {
.together-city .cbg {
    background: url(img/together_bg.png) top center / contain no-repeat;
    background-size: 500%;
}
.together-city .ccatch span {
    font-size: 26px !important;
}
}

.together-city .cov{
  position:absolute;inset:0;
  background:rgba(100,165,210,0.35);
}
.together-city .cc{
  position:relative;z-index:2;
  text-align:center;padding:80px 20px 56px;
}
.together-city .cpre{
  font-size:20px;color:rgba(255,255,255,0.9);letter-spacing:0.22em;margin-bottom:12px;
}
.together-city .ctitle{
  font-family:var(--font-en);font-size:clamp(44px,10vw,100px);
  font-weight:900;color:#fff;letter-spacing:0.1em;line-height:1;margin-bottom:20px;
}
.together-city .csub{
  font-family:var(--font-en);font-size:26px;color:#fff;
  letter-spacing:0.35em;margin:6px 0 4px;
}
.together-city .ctorqsub{
  font-family:var(--font-en);font-size:12px;color:rgba(255,255,255,0.45);
  letter-spacing:0.28em;margin-bottom:40px;
}
.together-city .ccatch{
  writing-mode: vertical-rl; 
  -webkit-writing-mode: vertical-rl; /* Safari対策 */ vertical-align: top;text-align: justify;margin: 0 auto;}

.together-city .ccatch span{
  writing-mode:vertical-rl;
  font-size:clamp(18px,3.5vw,30px);font-weight:700;
  color:#fff;letter-spacing:0.18em;
}
.together-city .cbody{
  font-size:14px;color:rgba(255,255,255,0.88);line-height:2.3;
  max-width: 900px;margin: 0 auto;margin-top: 60px;
}

/* ========== FOR THE FUTURE ========== */
#future{background:#fff}
.future-staff{
  display:grid;grid-template-columns:repeat(10,1fr);
  gap:2px;background:#ddd;
}
.future-staff .fc{aspect-ratio:1;background:#000;overflow:hidden}
.future-staff .fc img{width:100%;height:100%;object-fit:cover}
.future-body{padding:80px 40px;max-width:900px;margin:0 auto}
.future-body .ft{
  font-family:var(--font-en);font-size:clamp(38px,7.5vw,84px);
  font-weight:900;color:#B11429;line-height:1;margin-bottom:8px;
}
.future-body .fs{
  font-size:clamp(14px,2vw,18px);font-weight:700;color:#B11429;margin-bottom:10px;
}
.future-body .fc2{
  font-size:14px;font-weight:700;color:#B11429;
  padding-bottom:28px;margin-top:30px;
}
.future-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:56px}
.future-card{border:3px solid #B11429;padding:22px}
.future-card h3{font-size:16px;font-weight:700;color:#B11429;margin-bottom:14px;padding-bottom:8px;}
.future-card ul{list-style:none}
.future-card ul li{font-size:12px;color:#000;line-height:1.95;padding:3px 0;}
.future-card ul li:last-child{border:none}
.future-card ul li::before{content:'・';color:var(--red)}
.future-logo{text-align:center;margin: 0 auto;max-width:150px;}
.future-foot{text-align:center;font-family:var(--font-en);font-size:12px;color:#000;letter-spacing:0.25em;margin-top:20px}

/* ========== FOOTER ========== */
footer{background: linear-gradient(to right, #ff0000 0%, #ff0000 50%, #B11429 50%, #B11429 100%);text-align:center;padding:30px 20px}
footer p{font-family:var(--font-en);font-size:9px;color:rgba(255,255,255,0.65);letter-spacing:0.2em}
#future a {text-decoration:none;color:#000;}

@media only screen and (max-width: 767px) {
footer {
    padding: 150px 20px;
}
}

/* ========== RESPONSIVE ========== */
@media(max-width:768px){
  #hero .hero-text{left:20px;bottom:44px}
  .bolt-full-img{max-height:320px}
  .bolt-vtext-overlay{}
  .bolt-vtext-overlay span{font-size:clamp(13px,4vw,18px)}
  #hundred .body-block{padding: 200px 20px 48px;}
  .mc-inner,.mc-inner.rev{grid-template-columns:1fr}
  .mc-photo .ph{aspect-ratio:16/9;max-height:220px}
  .ti-r{padding:20px 0 20px 16px;grid-column:2}
  .ti.lo .ti-r{visibility:visible}
  .ti.ro .ti-l{display:none}
  .ht-section{padding:40px 8%}
  .ht-section .ht-top{grid-template-columns:1fr}
  .ht-section .ht-logo-txt{text-align:left}
  .nejinet-block{grid-template-columns:1fr}
  .ng{grid-template-columns:1fr 1fr}
  #next .nicons{grid-template-columns:1fr}
  .staff-grid,.future-staff{grid-template-columns:repeat(3,1fr)}
  .together-city .ccatch{gap:12px}
  .future-cards{grid-template-columns:1fr}
  .future-body{padding:56px 7%}
  .tl-dark .ti{grid-template-columns:36px 1fr}
  .tl-dark .ti-red-l,.tl-dark .ti-torq-r{grid-column:2;padding:0 8%}
}




.loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 10;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeOut 1.5s 2.5s forwards;
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    visibility: hidden;
  }
}

.loading__logo {
  opacity: 0;
  animation: logo_fade 2s 0.5s forwards;
  width: 175px;
}

@keyframes logo_fade {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }

  60% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    opacity: 0;
  }
}







/* Opening
-----------------------------------------*/
.Opening {
position:relative;
background-color: #FFF;
}
.Opening ul li{
  position: relative;
  overflow: hidden;
  width: 100%;
  text-align: center;
}
.Opening ul li img.Opening__text{
  position: absolute;
  top:50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform:translate(-50%, -50%);
  z-index: 9;
}
.Opening ul li span {
}
.Opening ul li span img.Opening__img{
  max-width: inherit;
  width: 100%;
  height: auto;
}


@keyframes infinity-scroll-left {
from {
  transform: translateX(0);
}
  to {
  transform: translateX(-100%);
}
}
.scroll-infinity__wrap {
  display: flex;
  overflow: hidden;
}
.scroll-infinity__list {
  display: flex;
  list-style: none;
  padding: 0
}
.scroll-infinity__list--left {
  animation: infinity-scroll-left 500s infinite linear 0.5s both;
}
.scroll-infinity__item {
  width: calc(100vw / 8);
}
@media only screen and (max-width: 767px) {

.scroll-infinity__item {
  width: calc(100vw / 4);
}
}
.scroll-infinity__item>img {
  width: 100%;
}

	@keyframes infinity-scroll-right {
from {
  transform: translateX(-100%);
}
  to {
  transform: translateX(0%);
}
}
.scroll-infinity__list--right{
  animation :infinity-scroll-right 500s infinite linear 0.5s both;
}


.scrollanime {
  /*ここで全体のアニメーション秒数を設定*/
  transition: all ease 1.5s;
  /*出現前は全て透明に*/
  opacity: 0;
}
/*classに応じて出現前の位置や大きさを設定*/
.toUp {
  transform: translateY(50px);
}
.toDown {
  transform: translateY(-50px);
}
.toLeft {
  transform: translateX(50px);
}
.toRight {
  transform: translateX(-50px);
}
.toBig {
  transform: scale(0.8);
}
/*画面に入った後は元の位置や大きさに戻る*/
.fadeIn.scrollanime {
  opacity: 1;
}
.fadeIn.toUp {
  transform: translateY(0);
}
.fadeIn.toDown {
  transform: translateY(0);
}
.fadeIn.toLeft {
  transform: translateX(0);
}
.fadeIn.toRight {
  transform: translateX(0);
}
.fadeIn.toBig {
  transform: scale(1);
}


@media screen and (min-width:768px){
.sp{
	display:none;
}

.pc{
	display:inline;
}
}

@media screen and (max-width: 767px){
.sp{
	display:inline;
}

.pc{
	display:none;
}
}

@media only screen and (max-width: 767px) {
p{
	font-size:10px;
}

}