/* #banner */
#banner { --banner-navy:#052d50; --banner-navy-deep:#021f38; --banner-red:#f44336; --banner-orange:#ff982e; --banner-white:#fff; overflow:hidden; background:#061f36; }
#banner .item { overflow:hidden; background:#061f36; }
#banner .banner_visual { position:relative; z-index:1; aspect-ratio:1920 / 820; overflow:hidden; }
#banner .banner_visual img { display:block; width:100%; height:100%; object-fit:cover; object-position:center center; transform:scale(1.01); transition:transform 7s cubic-bezier(.2,.6,.2,1); }
#banner .slick-active .banner_visual img { transform:scale(1.045); }
#banner .banner_shape {inset: 0 auto 0 0;z-index: 2;width: 63%;height: 100%;overflow: visible;pointer-events: none;}
#banner .banner_shape .shape_main,#banner .banner_shape .shape_arc { position: absolute; inset: 0 auto 0 0; display: block; height: 100%; transform-origin: left center; }
#banner .banner_shape .shape_main {
  z-index:3;
  width:100%;
  background: linear-gradient(112deg, rgb(2 28 50 / 58%) 0%, rgb(3 42 74 / 83%) 48%, rgb(5 51 88 / 87%) 100%);
  -webkit-mask-image:radial-gradient(   ellipse 98% 169% at 120% 14%,transparent 0%,transparent 55.5%,#000 56.1%,#000 100%  );
  mask-image:radial-gradient(
   ellipse 98% 169% at 120% 14%,transparent 0%,transparent 55.5%,#000 56.1%,#000 100%
  );
}
#banner .banner_shape .shape_main:before {
  content:"";position:absolute;inset:0;background:radial-gradient(
			circle at 18% 40%,rgba(41,104,152,.15) 0%,rgba(41,104,152,.055) 34%,transparent 64%
		);pointer-events:none;
}
#banner .banner_shape .shape_arc_1 {
  z-index:2;width:103%;opacity:.52;background:linear-gradient(
			110deg,rgba(18,64,101,.72) 0%,rgba(37,82,119,.48) 65%,rgba(85,122,151,.28) 100%
		);-webkit-mask-image:radial-gradient(   ellipse 91% 169% at 119% 12%,transparent 0%,transparent 56.5%,#000 57.1%,#000 100%  );mask-image:radial-gradient(
   ellipse 91% 169% at 119% 12%,transparent 0%,transparent 56.5%,#000 57.1%,#000 100%
  );animation:bannerShapeArc1 10s ease-in-out infinite alternate;
}
#banner .banner_shape .shape_arc_2 {
  z-index:1;width:116%;opacity:.28;background:linear-gradient(
			108deg,rgba(45,83,116,.72) 0%,rgba(77,110,139,.42) 68%,rgba(255,255,255,.16) 100%
		);-webkit-mask-image:radial-gradient(   ellipse 97% 170% at 120% 10%,transparent 0%,transparent 57.5%,#000 58.1%,#000 100%  );mask-image:radial-gradient(
   ellipse 97% 170% at 120% 10%,transparent 0%,transparent 57.5%,#000 58.1%,#000 100%
  );animation:bannerShapeArc2 13s ease-in-out infinite alternate;
}
@keyframes bannerShapeArc1 {
  0% { transform: translateX(-4px); }
  100% { transform: translateX(7px); }
}
@keyframes bannerShapeArc2 {
  0% { transform: translateX(-7px); }
  100% { transform: translateX(9px); }
}
#banner .item { overflow:hidden; }
#banner .banner_visual {position:relative;z-index:0;aspect-ratio: 192 / 92;overflow:hidden;}
#banner .banner_visual img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }

#banner .banner_video { inset:0; z-index:1; width:100%; height:100%; overflow:hidden; pointer-events:none; }
#banner .banner_video video,
#banner .banner_video .slide-video,
#banner .banner_video .slide-media {position: absolute;top:0!important;left:0!important;display:block!important;width:100%!important;height: 100%;max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;object-fit:cover!important;object-position: center center;}

#banner .banner_shape { z-index:2; }
#banner .info { z-index:4; }
#banner .banner_brand { z-index:4; }
#banner .banner_link { inset:0; z-index:5; }

#banner .info { inset:0; z-index:4; align-items:center; pointer-events:none; }
#banner .banner_inner {width:100%;padding-left: clamp(50px,6vw,150px);padding-right:40px;box-sizing:border-box;}
#banner .banner_content { width:min(650px,38vw); color:#fff; pointer-events:auto; }
#banner .banner_kicker { display:flex; align-items:center; gap:14px; margin-bottom:22px; color:#f5aa61; font-size:13px; font-weight:600; letter-spacing:.2em; line-height:1.4; }
#banner .banner_kicker:before { content:""; display:block; width:34px; height:2px; flex:none; background:linear-gradient(90deg,var(--banner-red),var(--banner-orange)); }
#banner .h3 { margin:0; color:#fff; font-size:clamp(40px,3.5vw,68px); font-weight:700; letter-spacing:.025em; line-height:1.3; text-wrap:balance; }
#banner .h3:after { content:""; display:block; width:68px; height:4px; margin-top:26px; border-radius:10px; background:linear-gradient(90deg,var(--banner-red),var(--banner-orange)); }
#banner .banner_content p {max-width: 645px;margin:26px 0 0;color:rgba(255,255,255,.84);font-size: 18px;font-weight:400;letter-spacing:.04em;line-height:2;}
#banner .banner_more { position:relative; display:inline-flex; align-items:center; gap:30px; margin-top:34px; padding:15px 22px; border:1px solid rgba(255,255,255,.42); color:#fff; font-size:14px; font-weight:500; letter-spacing:.08em; overflow:hidden; transition:border-color .35s ease,background .35s ease,transform .35s ease; }
#banner .banner_more:before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,var(--banner-red),var(--banner-orange)); transform:translateX(-102%); transition:transform .4s cubic-bezier(.22,.61,.36,1); }
#banner .banner_more i { position:relative; display:block; width:30px; height:1px; background:#fff; transition:width .35s ease; }
#banner .banner_more i:after { content:""; position:absolute; top:-3px; right:0; width:7px; height:7px; border-top:1px solid #fff; border-right:1px solid #fff; transform:rotate(45deg); }
#banner .banner_more:hover { border-color:transparent; transform:translateY(-2px); }
#banner .banner_more:hover:before { transform:translateX(0); }
#banner .banner_more:hover i { width:40px; }


#banner .banner_brand { right:4%; bottom:7%; z-index:3; display:grid; grid-template-columns:repeat(3,8px); gap:5px; opacity:.65; pointer-events:none; }
#banner .banner_brand span { display:block; aspect-ratio:1; background:var(--banner-red); }
#banner .banner_brand span:nth-child(2),#banner .banner_brand span:nth-child(4),#banner .banner_brand span:nth-child(8) { background:var(--banner-orange); }

/* Banner Link */
#banner .banner_link { inset:0; z-index:5; }

/* Slick */
#banner .slick-dots { position:absolute; z-index:8; right:5%; bottom:28px; display:flex!important; align-items:center; gap:8px; width:auto; margin:0; padding:0; list-style:none; }
#banner .slick-dots li { width:auto; height:auto; margin:0; }
#banner .slick-dots button { display:block; width:22px; height:3px; padding:0; border:0; border-radius:20px; overflow:hidden; background:rgba(255,255,255,.35); font-size:0; cursor:pointer; transition:width .35s ease,background .35s ease; }
#banner .slick-dots .slick-active button { width:48px; background:linear-gradient(90deg,var(--banner-red),var(--banner-orange)); }
#banner .slick-dots li button:before{display:none;}
/* Banner 進場 */
#banner .slick-slide .banner_kicker,#banner .slick-slide .h3,#banner .slick-slide .banner_content p,#banner .slick-slide .banner_more { opacity:0; transform:translateY(26px); transition:opacity .7s ease,transform .8s cubic-bezier(.22,.61,.36,1); }
#banner .slick-active .banner_kicker { opacity:1; transform:none; transition-delay:.18s; }
#banner .slick-active .h3 { opacity:1; transform:none; transition-delay:.28s; }
#banner .slick-active .banner_content p { opacity:1; transform:none; transition-delay:.4s; }
#banner .slick-active .banner_more { opacity:1; transform:none; transition-delay:.52s; }
#banner .slick-active .banner_more span{color:white;}
@keyframes bannerArcOne { 0% { transform:translateX(-8px) scaleX(.985); } 100% { transform:translateX(8px) scaleX(1.01); } }
@keyframes bannerArcTwo { 0% { transform:translateX(5px); opacity:.35; } 100% { transform:translateX(-7px); opacity:.7; } }

@media screen and (max-width:1400px) {
  #banner .banner_inner { padding-left: 5vw; }
  #banner .banner_content { width: min(610px,43vw); }
  #banner .h3 { font-size: clamp(38px,4vw,58px); }
}
@media screen and (max-width:1199px) {
  #banner .banner_visual { aspect-ratio: 16/8; }
  #banner .banner_content { width: 48vw; }
  #banner .banner_content p { font-size: 15px; line-height: 1.85; }
}
@media screen and (max-width:991px) {
  #banner .banner_visual { aspect-ratio: 4/3; }
  #banner .banner_inner { padding-left: 5vw; }
  #banner .banner_content { width: 58vw; }
  #banner .banner_brand { display: none; }
}
@media screen and (max-width:767px) {
  #banner .item { background: #052d50; }
  #banner .banner_visual { aspect-ratio: 4/3; }
  #banner .info { position: relative!important; inset: auto; margin-top: -1px; background: linear-gradient(135deg,#021f38bf,#07385fa8); }
  #banner .banner_inner { padding: 0 6vw; }
  #banner .banner_content { width: 100%; padding: 34px 0 64px; }
  #banner .banner_kicker { margin-bottom: 15px; font-size: 10px; }
  #banner .h3 { font-size: 31px; line-height: 1.4; }
  #banner .h3:after { width: 46px; height: 3px; margin-top: 18px; }
  #banner .banner_content p { margin-top: 18px; font-size: 14px; line-height: 1.85; }
  #banner .banner_more { margin-top: 24px; }
  #banner .slick-dots { right: auto; left: 6vw; bottom: 24px; }
}
@media screen and (max-width:480px) {
  #banner .banner_visual { aspect-ratio: 1/1; }
  #banner .banner_visual img { object-position: 95% 50%; }
  #banner .banner_content { padding-top: 28px; }
  #banner .banner_shape { display: none; }
  #banner .h3 { font-size: 28px; }
  #banner .banner_content p {font-size: 16px;}
  #banner .banner_video video,#banner .banner_video .slide-video,#banner .banner_video .slide-media { position: relative; object-position: 77% 50%; height: auto; aspect-ratio: 1/1; }
  #banner .banner_video { height: auto; }
}