#banner { width: 100%; z-index: 3; overflow: hidden; }
#banner,#banner * { transition: all 0s ease-in-out; -webkit-transition: all 0s ease-in-out }
#banner .coan_bg { position: absolute; z-index: 1; opacity: 0.4; top: 0; height: 100%; mix-blend-mode: plus-lighter; }
#banner img { width: 100vw; min-height: 75vh; height: 75vh }
#banner .pos_abs { width: 100vw; height: 75vh; top: 0; left: 0 }
#banner .info {height: 75vh;z-index: 6;background-image: url(/images/40/banner_nblank.png);}
#banner .info:before{content:"";position: absolute;width: 100%;height: 100%;background: linear-gradient(0deg, #040404 0%, rgb(0 0 0 / 0%));}
#banner .item { position: relative }
#banner .item:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(0deg,#00182a 0%,rgb(0 0 0/5%)); z-index: 1; opacity: .5; }
#banner .item:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 60%; background: linear-gradient(180deg,#000000 -30%,rgb(0 0 0/0%)); z-index: 1; opacity: 1; }
#banner .info .txt {margin: auto;-webkit-transform: translateY(4.25em);transform: translateY(2.25em);display: flex;flex-direction: column;align-items: center}
#banner .info .txt * { font-weight: 400; color: var(--white) }
#banner .info .txt h3 { font-size: max(5.5*(1vw + 1vh)/2,45px); word-spacing: 100vw; max-width: 100%; line-height: 100%; font-weight: 500; text-align: left }
#banner .info .txt h3 .comcoobox { font-size: max(1.4*(1vw + 1vh)/2,16px); padding: 10px; margin-left: 10px; position: relative; top: -4px }
#banner .info .txt p { font-weight: 300; font-size: 18px }
#banner a.pos_abs { z-index: 2 }
#banner video,#banner iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover }
/* slick-current */
#banner .slick-current .info .txt * { opacity: 1 }
#banner .mmtmore { display: flex; flex-direction: column; align-items: center; width: 100% }
#banner .mmtmore a { border: #e4e4e4 1px solid; transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; }
#banner .mmtmore a svg { background: unset; fill: var(--white); }
#banner .mmtmore a svg path { fill: var(--white) }
#banner .info .txt .coorbox { width: min(370px,91%); margin-bottom: 60px; margin-top: 0px; }
#banner .info .midtexrb p { font-size: max(3.5*(1vw + 1vh)/2,22px); font-weight: 500; line-height: 1.5; }
#banner .info .txt .coorbox p { font-size: max(1.7*(1vw + 1vh)/2,18px); max-width: 100%; line-height: 140%; text-align: center; font-family: 'Montserrat',sans-serif; }
#banner .slick-current .info .txt p.madowinfo { font-size: max(1*(1vw + 1vh)/2,12px); font-weight: 100; padding-top: 10px; border-top: rgb(255 255 255/35%) 1px solid; margin-top: 25px; width: min(666px,50%) }
@keyframes colorChange {
  0% { background-color: rgb(141 0 9/78%) }
  100% { background-color: rgb(183 49 58/78%) }
}
@media screen and (max-width:1470px) {
  #banner img { min-height: unset; height: 640px }
  #banner {margin-top: 0;}
}
@media screen and (min-width:1281px) {
  #banner img { height: 100vh }
  #banner .pos_abs { height: 100% }
  #banner .info { padding-bottom: 0vh; height: 100%; }
  #banner .info:after {content: '';position: absolute;bottom: 11vw;left: 25vw;width: 47vw;aspect-ratio: 1253/643;background: url(/images/40/img-bannerlogo.png) no-repeat right bottom;background-size: contain;mix-blend-mode: soft-light;opacity: 0.2;pointer-events: none;z-index: 1;}
}
@media screen and (max-width:1280px) {
  #banner .info .txt { -webkit-transform: translateY(13.25em); transform: translateY(13.25em); }
  #banner img { object-position: 0% 50% }
  #banner .mmtmore { display: flex; }
  #banner .info {height: 100%;}
  #banner video,#banner iframe { width: 100%; height: 100%; }
}
@media screen and (max-width:640px) {
  #banner img { height: 440px; object-position: 65% 50% }
  #banner .info .txt {-webkit-transform: translateY(2em);transform: translateY(2em);}
}
@media screen and (max-width:550px) {
  #banner img { object-position: 0% 50%; height: 450px; }
  #banner .slick-current .info .txt p.madowinfo { width: 100% }
  #banner .info:before {content: "";position: absolute;width: 100%;height: 100%;}
}
@media screen and (max-width:480px) {
  #banner .info .txt p { letter-spacing: 0; text-align: center; font-size: 19px; }
  #banner .slick-current .info .txt .coorbox { margin-left: -16px }
}