/* arguments inittial */
/* font style */
/* site style */
/* [ writing-mode ]
-------------------------------------------------*/
/* [ easy breakpoint ]
-------------------------------------------------*/
.top {padding-top:84px;}
.top #wrap {padding-top:0;}

/*.top:not(.layeron) .header .inner-header {background:linear-gradient(rgba(65, 57, 59, 0.7) 0%, rgba(65, 57, 59, 0) 100%);}
.top:not(.layeron) .header .logo__white {display:block;}
.top:not(.layeron) .header .logo__black {display:none;}
.top:not(.layeron) .hamberger {background:none;}*/

@media (max-width:767px) {
  .top {padding-top:80px;}
  .top .copyright {padding-bottom:40px;}
  .top .header__left .logo {padding-top:15px;}
}

.mv {position:relative; height:100vh; height:0;}
.mv__video {position:fixed; top:0; left:0; width:100%; height:100vh;}
.mv__video video {position:absolute; height:100%; width:100%; object-fit:cover;}
.mv__btnopen {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); margin-top:-42px; background:url(../../img/top/icon_video.svg) center top no-repeat; padding-top:35px; color:#c3002f; font-size:12px; font-size:1.2rem; line-height:1.66667em; letter-spacing:0.14em; font-weight:400; font-family:"Nissan Brand" !important; display:none;}

@media (max-width:767px) {
  .mv__btnopen {margin-top:0; background-size:35px auto; padding-top:50px;}
}

.recruit {position:relative; background:#fff;}

.recruit__top__scroll {position:absolute; left:50%; top:-7vh; translate:-50% -100%; color:#fff; font-size:77%; display:none;}
.recruit__top__scroll:after {content:""; display:block; width:.8em; aspect-ratio:1; margin:0 auto; border:#fff solid; border-width:0 1px 1px 0; rotate:45deg;}

.recruit__group {padding:20px 0 40px;}
.recruit__group:first-child {padding-top:135px;}
.recruit__group:last-child {padding-bottom:180px;}
.recruit__group:nth-child(2n) {background:#f4f4f4;}

.recruit__ttl {text-align:center;}
.recruit__ttl__en {color:rgba(195, 0, 47, 0.08); font-size:64px; font-size:6.4rem; line-height:1.09375em; letter-spacing:0.1em; font-weight:700; font-family:"Nissan Brand" !important;}
.recruit__ttl__jp {margin-top:-37px; font-size:34px; font-size:3.4rem; line-height:1.17647em; letter-spacing:0.08em; font-weight:400; color:#c3002f;}

@media (max-width:767px) {
  .recruit .inner {width:calc(100% - 20px);}
  .recruit__group {padding:20px 0 35px;}
  .recruit__group:first-child {padding-top:46px;}
  .recruit__group:last-child {padding-bottom:60px;}
  .recruit__ttl__en {margin:0 -30px; font-size:42px; font-size:4.2rem; line-height:1.19048em;}
  .recruit__ttl__jp {margin-top:-17px; font-size:28px; font-size:2.8rem; line-height:1.07143em;}
}

.recruit__list {margin:0 auto; max-width:984px; display:flex; flex-wrap:wrap;}
.recruit__item {position:relative; margin-top:27px; cursor:pointer;}
.recruit__item:after {content:""; position:absolute; top:22px; left:29px; width:48px; height:48px; border:#fff 1px solid; border-radius:50%; background:url(../../img/top/icon_arr.svg) no-repeat center; background-size:17px auto; transition:background 0.3s; z-index:4;}

@media (min-width:768px) {
  .recruit__item {width:calc(50% - 50px);}
  .recruit__item:nth-child(2n) {margin-left:100px;}
}

@media only screen and (min-width:768px) and (max-width:900px) {
  .recruit__item {width:calc(50% - 20px);}
  .recruit__item:nth-child(2n) {margin-left:40px;}
}

@media (max-width:767px) {
  .recruit__item {width:100%; margin-top:36px;}
  .recruit__item:after {top:19px; left:24px; width:40px; height:40px; background-size:14px auto;}
  .recruit__item + .recruit__item {margin-top:8px;}
}

.recruit__item__imgcnt {position:relative;}
.recruit__item__imgcnt img {width:100%;}
.recruit__item__imgcnt:before {content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(180deg, #c3002f 0%, #880a29 100%); opacity:0; transition:opacity 0.3s; z-index:2;}
.recruit__item__imgcnt:after {content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #808080 100%); mix-blend-mode:multiply; opacity:0.6;}
.recruit__item__txt {position:absolute; left:29px; right:20px; bottom:15px; color:#fff; font-size:28px; font-size:2.8rem; line-height:1.42857em; letter-spacing:0.08em; font-weight:400; z-index:3;}
.recruit__item__txt .small {font-size:20px; font-size:2rem; line-height:1.8em;}

@media only screen and (max-width:900px) {
  .recruit__item__txt {font-size:25px; font-size:2.5rem;}
  .recruit__item__txt .small {font-size:18px; font-size:1.8rem;}
}

@media (max-width:767px) {
  .recruit__item__txt {left:24px; right:20px; bottom:16px; font-size:22px; font-size:2.2rem; line-height:1.36364em;}
  .recruit__item__txt .small {font-size:16px; font-size:1.6rem; line-height:1.75em;}
}

@media only screen and (min-width:1025px) {
  .recruit__item:hover {opacity:1;}
  .recruit__item:hover:after {background-position:right 10px center;}
  .recruit__item:hover .recruit__item__imgcnt:before {opacity:0.3;}
}

.recruit ._menu {display:grid; --seqSlideDuration:8s; --seqSlideDelayOffset:-5s; 
  --seqSlideinitDelay1st:var(--seqSlideDelayOffset);
  --seqSlideinitDelay2nd:calc(var(--seqSlideDelayOffset) + var(--seqSlideDuration) / 4 * 1);
  --seqSlideinitDelay3rd:calc(var(--seqSlideDelayOffset) + var(--seqSlideDuration) / 4 * 2);
  --seqSlideinitDelay4th:calc(var(--seqSlideDelayOffset) + var(--seqSlideDuration) / 4 * 3);}
.recruit ._menu > div {position:relative; display:grid; grid-template-columns:1fr; grid-template-rows:1fr auto; overflow:hidden; transition:.4s;}
.recruit ._menu > div:nth-of-type(1) {--seqSlideInitDelay:var(--seqSlideinitDelay1st);}
.recruit ._menu > div:nth-of-type(2) {--seqSlideInitDelay:var(--seqSlideinitDelay3rd);}
.recruit ._menu > div:nth-of-type(3) {--seqSlideInitDelay:var(--seqSlideinitDelay4th);}
.recruit ._menu > div:nth-of-type(4) {--seqSlideInitDelay:var(--seqSlideinitDelay2nd);}
.recruit ._menu ._pic {grid-column:1/2; grid-row:1/3; position:relative; width:100%;}
.recruit ._menu ._pic img {position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; object-position:50% 0%; opacity:1;}
.recruit ._menu ._pic:has(img:nth-of-type(2):last-of-type) img {animation:seqSlide2 calc(var(--seqSlideDuration) * 2) infinite;}
.recruit ._menu ._pic:has(img:nth-of-type(3):last-of-type) img {animation:seqSlide3 calc(var(--seqSlideDuration) * 3) infinite;}
.recruit ._menu ._pic:has(img:nth-of-type(4):last-of-type) img {animation:seqSlide4 calc(var(--seqSlideDuration) * 4) infinite;}
.recruit ._menu ._pic:has(img:nth-of-type(n):last-of-type) img:nth-of-type(1) {animation-delay:var(--seqSlideInitDelay); z-index:10;}
.recruit ._menu ._pic:has(img:nth-of-type(n):last-of-type) img:nth-of-type(2) {animation-delay:calc(var(--seqSlideInitDelay) + var(--seqSlideDuration)); z-index:9;}
.recruit ._menu ._pic:has(img:nth-of-type(n):last-of-type) img:nth-of-type(3) {animation-delay:calc(var(--seqSlideInitDelay) + var(--seqSlideDuration) * 2); z-index:8;}
.recruit ._menu ._pic:has(img:nth-of-type(n):last-of-type) img:nth-of-type(4) {animation-delay:calc(var(--seqSlideInitDelay) + var(--seqSlideDuration) * 3); z-index:8;}
.recruit ._menu h2 {position:relative; z-index:20; grid-column:1/2; grid-row:2/3; font-size:clamp(1.6rem, 0.8rem + 1.333vw, 2.4rem); font-size:clamp(2.1rem, 2.8rem + -1vw, 1.6rem); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); transition:.2s;}
.recruit ._menu h2:before {display:block; position:absolute; left:0; bottom:100%; line-height:1; translate:0 11%; font-family:"Nissan Brand" !important; font-size:clamp(3.6rem, -0.32rem + 5.6vw, 6.4rem); font-size:clamp(2.8rem, -0.84rem + 5.2vw, 5.4rem); font-weight:bold; color:#C3002F33; transition:.2s;}
.recruit ._menu h2:has(a:hover):before {color:#C3002FB3;}
.recruit ._menu h2:has(a[href*="new-graduate"]) {background:#C3002FB3; color:#fff;}
.recruit ._menu h2:has(a[href*="new-graduate"]:hover) {background:#C3002F;}
.recruit ._menu h2:has(a[href*="new-graduate"]):before {content:"NEW GRADUATE";}
.recruit ._menu h2:has(a[href*="mid-career"]) {background:#FFFFFFB3; color:#C3002F;}
.recruit ._menu h2:has(a[href*="mid-career"]):before {content:"MID CAREER";}
.recruit ._menu h2 * {font:inherit; color:inherit;}
.recruit ._menu h2 svg {height:.7em; aspect-ratio:3/2; position:absolute; top:50%; translate:0 -50%;}
.recruit ._menu h2 svg path {fill:currentColor;}
.recruit ._menu h2 a:hover {opacity:1;}
.recruit ._menu h2 a:after {content:""; display:block; width:150%; aspect-ratio:1/1.5; position:absolute; left:0; bottom:0;}

@keyframes seqSlide2{
  0% {opacity:1;}
  40% {opacity:1;}
  50% {opacity:0;}
  90% {opacity:0;}
  100% {opacity:1;}
}
@keyframes seqSlide3{
  0% {opacity:1;}
  26.64% {opacity:1;}
  33.33% {opacity:0;}
  93.34% {opacity:0;}
  100% {opacity:1;}
}
@keyframes seqSlide4{
  0% {opacity:1;}
  20% {opacity:1;}
  25% {opacity:0;}
  95% {opacity:0;}
  100% {opacity:1;}
}

@media (min-width:700px) {
  .recruit ._menu {grid-template-columns:1fr 1fr;}
  .recruit ._menu > div {grid-template-rows:subgrid; grid-row:span 2;}
  .recruit ._menu ._pic {height:max(20vw, 200px);}
  .recruit ._menu h2 {padding:.4em calc(10% - 1em);}
  .recruit ._menu h2 svg {right:calc(10% - 1em);}
}
@media (max-width:699px) {
  .recruit ._menu ._pic {height:max(40vw,160px)}
  .recruit ._menu h2 {padding:.5em 1em; font-size:clamp(1.6rem, 0.753rem + 2.353vw, 2.4rem);}
  .recruit ._menu h2 svg {right:1em;}
}

.message {position:relative; padding:50px 0 208px; background:rgba(0, 0, 0, 0.6); color:#fff;}
.message__ttl {text-align:center; font-size:42px; font-size:4.2rem; line-height:1.42857em; letter-spacing:0.08em; font-weight:400;}
.message__txt {margin-top:36px; text-align:center; font-size:16px; font-size:1.6rem; line-height:2.8125em; letter-spacing:0.06em; font-weight:400;}
.message__movie_play {margin-top:36px; text-align:center;}
.message__movie_play a {color:#C3002F;}
.message__movie_play #movie_play:hover {font-size:13px;}


@media (max-width:767px) {
  .message {padding:156px 0 155px;}
  .message__ttl {font-size:20px; font-size:2rem; line-height:1.5em; letter-spacing:0.08em;}
  .message__txt {margin-top:55px; font-size:14px; font-size:1.4rem; line-height:2.85714em;}
}

:root {--mmScrlOffset:0px;}
.mmWrap {--mmPad:3vw; position:fixed; left:0; top:0; z-index:10010; display:flex; align-items:center; justify-content:center; width:100%; height:100vh; opacity:0; transition:.2s opacity; background:#111b; -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);}
.mmWrap.-ready {opacity:1;}
.mmInner {position:relative; width:100%; max-height:100vh; padding:var(--mmPad); overflow:auto; overscroll-behavior:contain;}
.mmInner:before {content:""; display:block; width:100vw; height:100vh; position:fixed; top:0; left:0;}
.mmScreen {position:fixed; left:0; top:0; width:calc(100% - 17px); height:100%;}
.mmCnt {position:relative; width:fit-content; max-width:100%; margin-inline:auto; background:#fff;}
.mmCnt > img:only-child {max-width:100%; max-height:calc(100vh - 8vw);}
.mmWrap[data-mm-type="iframe"] iframe {width:100vw; max-width:100%; height:calc(100vh - var(--mmPad) * 2);}
.mmWrap[data-mm-type="YouTube"] .mmCnt {width:100%; background:unset; text-align:center;}
.mmWrap[data-mm-type="YouTube"] iframe {width:100%; aspect-ratio:16/9;}
.mmWrap[data-mm-type="YouTube"] .-gt169 iframe {width:auto; height:calc(100vh - var(--mmPad) * 2);}
.mmCaption {position:relative; color:#fff;}
.mmCaption:not(:empty) {margin-top:1rem; text-align:center;}
.mmClose, .mmPrev, .mmNext {all:unset; position:fixed; overflow:hidden; border-radius:50%; white-space:nowrap; text-indent:100%; cursor:pointer; transition:.15s;}
.mmClose {right:calc(1.5vw + var(--mmScrlOffset)); top:1.5vw; height:36px; width:36px;}
.mmClose:before, .mmClose:after {content:""; display:block; width:70%; height:15%; position:absolute; left:50%; top:50%; background:#fff; translate:-50% -50%;}
.mmClose:before {rotate:45deg;}
.mmClose:after {rotate:-45deg;}
.mmPrev, .mmNext {top:50%; width:30px; height:30px; border-radius:50%; background:#888b;}
.mmPrev:before, .mmNext:before {content:""; display:block; position:absolute; top:50%; left:50%; width:35%; aspect-ratio:1/1; border:#fff solid; border-width:3px 0 0 3px; translate:-50% -50%;}
.mmPrev {left:1.5vw;}
.mmPrev:before {rotate:-45deg; margin-left:2px;}
.mmNext {right:calc(1.5vw + var(--mmScrlOffset));}
.mmNext:before {rotate:135deg; margin-left:-2px;}
@media (max-width:767px){.mmWrap {height:100dvh;}}
