@charset "UTF-8";
@import 'font.css';


/*****************************************
   initialize  
 *****************************************/
 * {margin:0;padding:0;line-height:1.4em;-webkit-overflow-scrolling: touch;box-sizing:border-box;-webkit-hyphens: auto;hyphens: auto;vertical-align:middle;letter-spacing: -0.05em;font-family: inherit;color: inherit;font-weight: inherit;}
 html, body{height:100%;font-size:12px;font-family:'Gotham', 'sans-serif';}
 html{font-size: 28.51px;}
 body{color:#F1F1F1;-webkit-text-size-adjust:none;/* word-break:keep-all; */word-wrap:break-word;}
 legend, caption, figcaption{display:none;}
 p,ul,ol,li,dl,dt,dd,form {list-style-image:none;list-style-position:outside;list-style-type:none;border:0px;}
 img,fieldset, frameset, frameborder, frame {border:0;}
 a, img, span, b, input, select, em, textarea, label, strong{vertical-align:middle;outline-style:none;color:inherit;font-family:inherit}
 a{color:inherit;text-decoration:none;cursor:pointer;color:inherit;font-family:inherit;}
 a:hover{text-decoration:none}
 i, em{font-style:normal}
 
 textarea{resize: none;}
 button{border:none;background:none;outline:none;cursor:pointer;}
 input[type="text"],input[type="password"], textarea{-webkit-appearance: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;border-radius:0;}
 select{border-radius:0;background:#F1F1F1;}
 label{cursor:pointer;}

/*****************************************
   common  
 *****************************************/
 body{background:#000;}
 picture{display:block;}
 
 .fs-hgg{/* font-family: 'HGGGothicssi'; */ font-weight:bold !important;}
 .fs-noto{font-family: 'NotoSans';}
 
 .bold{font-weight:700 !important;;}
 .medium{font-weight:500 !important;;}
 .regular{font-weight:400 !important;;}
 .light{font-weight:300 !important;;}

.sec-about{background: #f1f1f1;}
.sec-about .header .btn-hamburger > a div{background:#282828;}
.sec-about .section-next a svg path{fill:#000}
html:not(.is-menu-hover ) .sec-about .header .nav > ul > li > a{color:#000;}
html:not(.is-menu-hover ) .sec-about .header .logo a{background-image:url('../images/logo-black.png')}
html:not(.is-menu-hover ) .sec-about .slogan{background:url('../images/txt-slogan-black.png') no-repeat 0 0;}
html:not(.is-menu-hover ) .sec-about .socials [class*=ico-] svg path{fill:#000}
html:not(.is-menu-hover ) .sec-about .socials .languages ul a{color:#000;}

 
/*****************************************
   layout  
 *****************************************/

 .js-section{ position: relative; z-index: 1; min-height: 130vh;}
 .js-section .section-inner{ position: -webkit-sticky; position: sticky; top: 0; overflow: hidden; min-height: 100vh; display:flex;flex-direction: column;justify-content:center;align-items:center;}
 .section-bg:after{display: block; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(241, 241, 241, 0.4); z-index: 1; transition: all 0.5s ease; -webkit-transition: all 0.5s ease;}
 .js-section .section-inner > [class*=-wrap]{display:flex;flex-direction: column;justify-content:center;align-items:center;}
 .js-section.is-fixed:not(.is-over) .section-inner{ top: 0; position: fixed; left: 0; bottom: 0; width: 100%; }
 .js-section .sec-fixed{clip: rect(0,auto,auto,0); position: absolute; z-index: 1; left: 0; top: 0; bottom: 0; right: 0; height: auto; opacity: .999; overflow: hidden; pointer-events: none;transition: background 0.5s ease}
 .js-section .section-next{position: fixed; width: 42px; height: 38px; left: calc(50% - 21px); bottom: 18px; transform: rotate(90deg); -webkit-animation-name: bounce; animation-name: bounce; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; transition: opacity .3s ease;    pointer-events: all;}
 .js-section .section-next a{display: block; padding: 10px 15px;}
 .js-section .section-next a svg{width: 100%;  height: auto;}
 .js-section.is-half .section-next{display:none;}
 
 @media screen and (-webkit-min-device-pixel-ratio:0) { 
  .js-section .sec-fixed{
    clip: auto;
    -webkit-mask-image: -webkit-linear-gradient(top, #ffffff 0%,#ffffff 100%)
  }
}

 .js-footer{position:relative;width:100%;background:#aeaeae;padding:15px 80px;font-size:17px;color:#000;position:relative;z-index: 1;font-weight:500;}
 .is-footer .socials,
 .is-footer .slogan{bottom:150px !important;}
 .is-footer .copyright{position:absolute;top:50%;right:80px;transform:translateY(-50%);-webkit-transform:translateY(-50%);}
 
 /* fixed */
 .header{display:flex;flex-direction:row;align-items:center;position:fixed;top:70px;left:0;width:100%;padding:0 80px; pointer-events: all;z-index: 11;}
 .header .logo a{display:block;width:132px;height:23px;background:url('../images/logo.png') no-repeat 0 0;background-size:auto 100%; opacity:50%}
 .header .logo a:hover{opacity:100%}
 .header .nav {margin-left:auto;transition: background-color 0.3s ease;}
 .header .nav > ul {display:flex;flex-direction:row;align-items:center;font-weight:800;font-size:19px;margin-right:-25px;}
 .header .nav > ul > li{position:relative;}
 .header .nav > ul > li > a{display:block;padding:8px 25px;position:relative;z-index: 1;transition: color 0.5s ease;-webkit-transition: color 0.5s ease;}
 .header .nav > ul > li > a span{display:block;padding:1px 0;border-bottom:2px solid transparent;opacity: 50%;/**color: #6c6c6c;**/}
 .header .nav > ul > li > a span:hover{opacity: 100%;}
 .header .nav > ul > li.on > a span{border-color:#F1F1F1;}
 .header .nav > ul > li > ul{display:none;position:absolute;top:0;left:50%;padding-top:50px;transform:translateX(-50%);-webkit-transform:translateX(-50%);}
 .header .nav > ul > li.on > ul{display:block;}
 .header .nav > ul > li > ul li {white-space: nowrap;line-height:1em;overflow:hidden;}
 .header .nav > ul > li > ul li a{display:block;opacity: 0.5;text-align:center;line-height:1em;}
 .header .nav > ul > li > ul li.on a{opacity: 1;}
 .header .nav .fs1{font-size:18px;}
 .header .nav .fs2{font-size:38px;}
 .header .nav .fs3{font-size:38px;}
 .header .nav .fs4{font-size:38px;}
 .header .nav .fs5{font-size:38px;}
 .header .nav .fs6{font-size:38px;}
 .header .nav .fs6 a{line-height:0.8em;height:0.85em;}
 .header .nav .fs7{font-size:38px;}
 .header .nav .fs7 a{line-height:0.75em;height:0.82em;}
 
 .js-section .socials{pointer-events: all; display: inline-block; vertical-align: middle; position: fixed; z-index: 11; left: 80px; bottom: 40px; text-align: right}
 .socials{transition: all 0.5s ease;-webkit-transition: all 0.5s ease;}
 .socials ul{display:grid;grid-template-columns: repeat(2, 1fr);width:100px;}
 .socials ul li a{width:50px;height:50px;display:flex;justify-content:center;align-items:center; opacity:0.5;}
 .socials ul li a:hover{opacity:1;}
 .socials .ico-facebook svg{width:13px;height:27px;}
 .socials .ico-instagram svg{width:27px;height:27px;}
 .socials .ico-vimeo svg{width:27px;height:23px;}
 .socials .ico-youtube svg{width:27px;height:19px;}
 .socials [class*=ico-] svg path{transition: all 0.5s ease;-webkit-transition: all 0.5s ease;}
 .socials .languages ul{display:flex;align-items:center;font-weight:800;font-size:17px;}
 .socials .languages ul a{width:50px;height:50px;display:flex;justify-content:center;align-items:center;opacity: 0.5;transition: all 0.3s ease;-webkit-transition: all 0.3s ease;}
 .socials .languages ul li.on a{opacity:1;}
 
 .slogan{position: fixed;right:80px;bottom:40px;  z-index: 11;width:38px;height:250px;background:url('../images/txt-slogan.png') no-repeat 0 0;transition: all 0.5s ease;-webkit-transition: all 0.5s ease; opacity:50%}
 .slogan:hover{opacity:100%;}
 
 
 @media all and (max-width:1260px){
   .js-section .section-inner > [class*=-wrap]{padding:0 80px;}
 
   .header{padding:0 50px;top:50px;}
   .header .nav > ul {margin-right:-15px;}
   .header .nav > ul > li > a{padding:0 20px;}
 
   .js-section .socials{left:50px}
   .js-section .slogan{right:50px;}
   .is-footer .copyright{position:relative;top:0;right:initial;transform:translateY(0%);-webkit-transform:translateY(0%);}
 }
 @media all and (max-width:1024px){
   .js-section .section-inner > [class*=-wrap]{padding:0 25px;    max-width: 100%;}
   
   .header{top:20px;padding:0 25px;}
   .header .nav {display:none;}
   .header .btn-hamburger{margin-left: auto;}
   .header .btn-hamburger a{width:50px;height:25px;display:flex;flex-direction: column;justify-content:space-between;align-items:center;}
   .header .btn-hamburger > a div{width:38px;height:3px;background:#F1F1F1;}
 
   .js-section .socials,
   .js-section .slogan{display:none;}
 }
 
 @media all and (max-width:767px){
   .js-footer{padding:10px 25px;font-size:2.5vw;}
 }
 @media all and (max-width:420px){
   .header .logo a{transform: scale(0.8);transform-origin: 0 50%;}
   .header .btn-hamburger{transform: scale(0.8);transform-origin: 100% 50%;}
 }
 
 /* m-menu - aside */
 .m-menu .btn-close{display:none;position: fixed; top: 0; right: 0; bottom: 0; transition: .3s ease;    left: 0; width: 100%; z-index: 1110; box-shadow: none; border: none; background-color: rgba(0,0,0,.5);}
 .m-menu .menu-inner{ position: fixed; top: 0; right: 0; bottom: 0; transition: .3s ease; z-index: 1111;height:100vh; display: flex; flex-direction: column; padding: 30px 80px 30px 30px; overflow-y: auto; overflow-x: hidden; background-color: #000; width: 270px; font-weight: 800; transform: translateX(100%); }
 .m-menu .menu-inner .menu-nav > ul > li~ li{margin-top:10px;}
 .m-menu .menu-inner .menu-nav > ul > li > a{font-size:16px;white-space: nowrap;}
 .m-menu .menu-inner .menu-nav > ul ul{padding-left:15px;font-size:14px;}
 .m-menu .menu-inner .menu-nav > ul ul li a{opacity: 0.5;white-space: nowrap;}
 .m-menu .menu-inner .menu-nav > ul ul li a:hover{opacity: 1;}
 .m-menu .menu-bottom{ margin-top:auto; }
 .m-menu .menu-bottom .socials{margin-bottom:-10px;}
 .m-menu.on .menu-inner{transform: none;}
 .m-menu.on .btn-close{display:block;}
 
 .is-menu-hover .header .nav  { background-color: transparent !important }
 .is-menu-hover .sec-fixed { background-color: rgba(0, 0, 0, .7) }
 

 /*****************************************
   content  
 *****************************************/

 /* common */
.btn-wrap{text-align:center;margin-top:40px;display:flex;align-items:center;width:100%;flex-direction: row !important;justify-content: center;}
.btn-wrap > * ~ *{margin-left:25px;}
.btn-wrap button{position:relative;display:inline-flex;width:357px;max-width:calc(100vw - 50px);height:60px;border:1px solid #ffffff;border-radius:14px;font-size:20px;font-weight:300;justify-content:center;align-items:center;}
.btn-wrap.black button{border-color: #282828; color:#282828;}
.btn-wrap button:hover,
.btn-wrap.black button:hover{border-color: #c6c6c6; background:rgba(255,255,255,.5); color:#F1F1F1;}
.btn-wrap.black button:hover{background:#949494;}

.btn-wrap button .txt-tooltip{display:none;position:absolute;top:120%;font-size:26px;font-weight:700;white-space: nowrap;}
.btn-wrap button:first-child .txt-tooltip{left:0;}
.btn-wrap button:last-child .txt-tooltip{right:0;}
.btn-wrap button:hover .txt-tooltip{display:block;}

@media all and (max-width:1260px){
  .btn-wrap{margin-top:32px;}
  .btn-wrap > * ~ *{margin-left:20px;}
  .btn-wrap button{width:286px;max-width:calc(100vw - 40px);height:48px;border-radius:11px;font-size:16px;}

  .btn-wrap button .txt-tooltip{font-size:2vw;}
}
@media all and (max-width:767px){
  .btn-wrap{margin-top:28px;}
  .btn-wrap > * ~ *{margin-left:18px;}
  .btn-wrap button{width:250px;max-width:calc(100vw - 35px);height:42px;border-radius:10px;font-size:14px;}
}

.board-wrap{width:1343px;margin:0 auto;height:100%;}
.board-list{max-width: 100%;}
.board-list ul{display:grid;grid-template-columns: repeat(3, 1fr);grid-gap: 5px;}
.board-list ul li .card{display:block;position:relative;font-family: "NotoSans";font-weight:500;width:445px;}
.board-list ul li .card img{width:100%;max-height: 100%;}
.board-list ul li .card .desc{background:#F1F1F1;height:127px;padding:15px;color:#373737;}
.board-list ul li .card .desc dt{border-bottom:1px solid #363636;padding-bottom:7px;}
.board-list ul li .card .desc dt .cate{font-size:33px;vertical-align:baseline;line-height:1em;}
.board-list ul li .card .desc dt .date{font-size:16px;vertical-align:baseline;margin-left:5px;line-height:1em;}
.board-list ul li .card .desc dd{font-size:20px;margin-top:10px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;line-height:1.2em;height:2.4em;}
.board-list ul li .card.black .desc{background:#282828;}
.board-list ul li .card.black *{color:#F1F1F1;}
.board-list ul li .card.black .desc dt{border-color: #F1F1F1;}
@media all and (max-width:1620px){
  .board-wrap{width:auto;}
  .board-list ul{grid-template-columns: repeat(2, 1fr);}  
  .board-list ul li .card{max-width: 45vw;}
}
@media all and (max-width:1620px) and (min-width:768px){
  .board-list.m-scroll{overflow:hidden;overflow-x:auto;max-width: 100%;padding-bottom:15px;}
  .board-list.m-scroll::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 5px; background-color: #F5F5F5; }
  .board-list.m-scroll::-webkit-scrollbar { height:10px; background-color: #F5F5F5; }
  .board-list.m-scroll::-webkit-scrollbar-thumb { border-radius: 5px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); background-color: rgba(0,0,0,0.2); }
  .board-list.m-scroll ul{display:block;display:flex;flex-direction:row;align-items:center;}
  .board-list.m-scroll ul .card{width:445px;}
}
@media all and (max-width:767px){
  .board-list ul{grid-template-columns: repeat(1, 1fr);}
  .board-list ul li .card{max-width: calc(100vw - 50px);}
  .board-list ul li .card .desc{height:120px;}
  .board-list ul li .card .desc dt{padding-bottom:6px;}
  .board-list ul li .card .desc dt .cate{font-size:29px;}
  .board-list ul li .card .desc dt .date{font-size:14px;}
  .board-list ul li .card .desc dd{font-size:17px;}
}
@media all and (max-width:420px){
  .board-list ul li .card .desc{height:100px;}
  .board-list ul li .card .desc dt .cate{font-size:4.6vw;}
  .board-list ul li .card .desc dt .date{font-size:3vw;}
  .board-list ul li .card .desc dd{font-size:3.7vw;}
}

.detail-wrap{width: fit-content;height:fit-content;/*  height:100%; */font-size:24px;line-height:1.8;margin-top:30px;font-family: 'NotoSans'; margin-top: 10px; background-color: #f1f1f1; padding: 30px 30px;}
.detail-wrap p{color:#282828;}
.detail-wrap div{color:#282828;}
.detail-wrap.black{ background-color: #282828;;}
.detail-wrap.black p{ color: #f1f1f1;;}
.detail-wrap.black div{ color: #f1f1f1;;}
.detail-wrap img{/*margin:10px 15px;*/max-width: 100%;}
.detail-wrap img[style*=left]{margin-left:0;}
.detail-wrap img[style*=right]{margin-right:0;}
.detail-wrap .detail-content{position:relative; height:100%}
@media all and (max-width:1024px){
  .detail-wrap{font-size:3vw;}
}


/* section */
.triangle{ margin-left: 20px; display: inline-block; vertical-align: baseline; width: 0; height: 0; border-color: transparent transparent transparent currentcolor; border-style: solid; border-width: 16px 0 16px 29px; }
.sec-top{min-height: 0;}
.sec-top .tit{display:inline-block;font-size:135px;font-weight:800;line-height:1.3em;white-space: nowrap;}
.sec-top .txt{display:inline-block;font-size:56px;font-weight:700;line-height:1.3em;margin-top:-10px;display:flex;align-items:center; opacity: 50%;}
.sec-top .txt:hover{opacity: 100%;}
.sec-top .top-bg{position: fixed; left: 0; top: 0; right: 0; bottom:0; min-height: 100vh; z-index: -1;}
.sec-top .top-bg img,
.sec-top .top-bg video{position: absolute; left: 0; top: 0; width: 100%; height: 100%;object-fit: cover;object-position: center;}
.sec-top .top-bg iframe{position: absolute; left: 0; top: 0; width: 100%; height: 100%;object-fit: cover;object-position: center;}

.about-wrap p{font-size:30px;line-height:1.4em;text-transform:uppercase;text-align:center;font-weight:300;}
.about-wrap .fs1{display:block;font-size:138px;line-height:0.9em;font-weight:800;vertical-align:top;margin-bottom:5px;}
.about-wrap .fs2{font-size:40px;line-height:1em;}
.about-wrap .main-txt{margin-bottom:100px;}
.about-wrap .about-wrap > p ~ p{margin-top:30px;}
.about-wrap img{max-width: 80vw;}

@media all and (max-width:1260px){

  .sec-top .tit{font-size:9.5vw;}
  .sec-top .txt{font-size:6vw;}

  .about-wrap p{display:block;width:100%;font-size:2.5vw;}
  .about-wrap p br{display:none;}
  .about-wrap .fs1{font-size:9vw;}
  .about-wrap .fs2{font-size:3vw;}
}

@media all and (max-width:767px){
  .triangle{ transform: scale(0.7);margin-left:10px;}

  .about-wrap p,
  .about-wrap p *{font-size:17px !important;}
  .about-wrap .fs1{font-size:50px !important;}
  .about-wrap .fs2{font-size:20px !important;}
  .about-wrap .main-txt{margin-bottom:50px;}
}
@media all and (max-width:420px){
  .triangle{ transform: scale(0.4);margin-left:0;}
  .about-wrap .fs1{line-height:0.8em;}
}

 /*about-list */
 .sec-about-menu[class*=bg]{background-size:cover;background-position:50% 50%;background-repeat:no-repeat;}
 .sec-about-menu.bg1{background-image:url('../images/06.pv_background.jpg');}
 .sec-about-menu.bg2{background-image:url('../images/07.cm_background.jpg');}
 .sec-about-menu.bg3{background-image:url('../images/09.ne_background.jpg');}
 .sec-about-menu.bg4{background-image:url('../images/08.ma_background.jpg');}
 .sec-about-menu.bg5{background-image:url('../images/10.ai_background.jpg');}
 .about-menu-wrap{padding:0 0 !important;margin-top:50px;}
 .about-menu-wrap > .txt{font-size:73px;margin-bottom:40px;font-weight:500;text-align:center;font-family: 'AppleSDGothicNeoEB';}
 .about-menu-wrap ul{text-align:center;display:flex;gap:3vw;margin:0 auto;max-width: 80vw;width: 1600px;}
 .about-menu-wrap ul li{flex:1;}
 .about-menu-wrap ul li a{position:relative; height:100%;border-radius:20px; display:flex;flex-direction: column;justify-content:center;align-items:center;transition: all 0.5s ease;-webkit-transition: all 0.5s ease;}
 .about-menu-wrap ul li .main-txt{position:absolute;top:50%;left:0;padding:20px;text-align:center;font-size:32px;width:100%;transform:translateY(-50%);z-index: 2;transition: all 0.5s ease;}
 .about-menu-wrap ul li .txt{position:absolute;bottom:0;left:0;z-index: 2;overflow:hidden;width:100%;}
 .about-menu-wrap ul li .txt p{position:relative;top:50px; padding:20px; opacity: 0;transition: all 0.5s ease;word-break: keep-all;text-align:left;font-size:18px;font-weight:500;line-height:1.4em;}
 .about-menu-wrap ul li .bg{width: 100%;position:relative;transition: all 0.5s ease;}
 .about-menu-wrap ul li .bg > div{max-width: 100%;width: 100%;opacity: 1;top:0}
 .about-menu-wrap ul li .bg img{max-width: 100%;width: 100%;}
 .about-menu-wrap ul li a:not(:hover) .bg .default{position: absolute;opacity: 1;z-index: 1;}
 .about-menu-wrap ul li a:hover .bg .hover{position: absolute;opacity: 1;z-index: 1;}
 @media all and (max-width:1560px){
   .about-menu-wrap ul{gap:2vw;max-width: 85vw;}
   .about-menu-wrap ul li .main-txt{font-size:2vw;}
   .about-menu-wrap ul li .txt p{padding:10px;font-size:1.4vw;}
   .about-menu-wrap ul li .main-txt{padding:10px;}
   
 }
 @media all and (min-width:769px){
   .about-menu-wrap ul li a:hover .bg{transform: scale(1.1);}
   .about-menu-wrap ul li a:hover .main-txt{top:80px;}
   .about-menu-wrap ul li a:hover .txt p{top:0;opacity: 1;}
 }
 @media all and (max-width:768px){
   .about-menu-wrap > .txt{font-size:6vw;margin-bottom:50px;}
   .about-menu-wrap{margin-top:0;}
   .about-menu-wrap,
   .about-menu-wrap ul{width:100%;flex-direction: column;}
   .about-menu-wrap ul li a{height:15vh;overflow:hidden;}
   .about-menu-wrap ul li .main-txt{font-size:20px;}
   .about-menu-wrap ul li .txt{display:flex;justify-content:center;align-items:center;}
   .about-menu-wrap ul li .txt p{font-size:14px;text-align:center;}
   .about-menu-wrap ul li .bg{overflow:hidden;position:relative;border-radius:15px;}
   .about-menu-wrap ul li .bg > div{object-fit: cover;top:50%;left:50%;transform:translate(-50%, -50%);}
   .about-menu-wrap ul li a:focus .main-txt{opacity: 0;}
   .about-menu-wrap ul li a:focus .txt{height:100%;}
   .about-menu-wrap ul li a:focus .txt p{top:0;opacity: 1;} 
 }
 


/* work */
.sec-works{background:#000;}
.work-wrap{width:100vw;height:100vh;display:block !important;padding:0 0 !important;}
.work-wrap .swiper-container{height:100%;width:100% !important;}
.work-wrap .swiper-container .swiper-slide{background-size:cover;background-position:50% 50%;background-repeat:no-repeat;display:flex;flex-direction: column;justify-content:flex-end;align-items:center;;}
.work-wrap [class*=swiper-button]{width:100px;height:100px;opacity: 1 !important;display:flex;justify-content:center;align-items:center;}
.work-wrap [class*=swiper-button]::before,
.work-wrap [class*=swiper-button]:after{display:none;}
.work-wrap .swiper-button-prev:after{content:'';display:block;border-bottom:16px solid transparent;border-top:16px solid transparent;border-right:32px solid #F1F1F1;}
.work-wrap .swiper-button-next:after{content:'';display:block;border-bottom:16px solid transparent;border-top:16px solid transparent;border-left:32px solid #F1F1F1;}
.work-wrap .swiper-button-disabled:after{opacity: 0.35;}
.work-wrap .conts{padding-bottom:140px;}
.work-wrap .conts .main-txt{text-align:center;padding:0 70px;}
.work-wrap .conts .main-txt a{display:inline-flex;align-items: flex-end; justify-content: center; flex-wrap: wrap;}
.work-wrap .conts .main-txt a strong{font-size:108px;font-weight:800;}
.work-wrap .conts .main-txt a strong.fs-hgg{font-weight:500;letter-spacing: -0.08em;}
.work-wrap .conts .main-txt a > *{border-bottom:1px solid transparent;line-height:1em;vertical-align:baseline;}
.work-wrap .conts .main-txt a > *{display:inline-block;line-height:1em;padding:0 10px;}
.work-wrap .conts .main-txt a:hover > *{border-bottom:1px solid #F1F1F1;}
.work-wrap .conts .main-txt a [class*=s-txt]{letter-spacing: -0.05em;font-weight:800;}
.work-wrap .conts .main-txt a .s-txt{font-size:80px;}
.work-wrap .conts .main-txt a .s-txt2{display:block;font-size:50px;}
.work-wrap .conts .main-txt > p{font-size:40px;font-weight:500;}
@media all and (max-width:1260px){
  .work-wrap [class*=swiper-button]{width:50px;height:50px;}
  .work-wrap .swiper-button-prev:after,
  .work-wrap .swiper-button-next:after{transform: scale(0.6);}
  .work-wrap .conts{padding-bottom:8vh;}
  .work-wrap .conts .main-txt{padding:0 25px;}
  .work-wrap .conts .main-txt a strong{font-size:8vw;}
  .work-wrap .conts .main-txt a .s-txt{font-size:4vw;}
  .work-wrap .conts .main-txt p{font-size:3.5vw;}
}
@media all and (max-width:767px){
  .work-wrap .swiper-button-prev:after,
  .work-wrap .swiper-button-next:after{transform: scale(0.35);}
}

/* works-list */
.sec-works-list{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000;z-index: 300;}
.sec-works-list .section-inner{overflow-x:hidden;overflow-y:auto;height:100vh;display:flex !important;flex-direction: column;justify-content: flex-start;}
.sec-works-list .section-inner .js-footer{margin-top:auto;}
.sec-works-list .section-next{display:none !important;}
.work-list-wrap{display:block !important;padding:0 0 !important;}
.work-list-wrap ul{display:grid;grid-template-columns: repeat(2, 1fr);}
.work-list-wrap.all ul{grid-template-columns: repeat(4, 1fr);}
.work-list-wrap ul li a{position:relative;display:block;}
.work-list-wrap ul li a:after{display:block;opacity:1;content:'';position:absolute;top:0;left:0;width:100%;height:100%;/* background:rgba(0, 0, 0, .7); */z-index: 1;transition: all 0.5s ease;-webkit-transition: all 0.5s ease;}
.work-list-wrap ul li a:hover:after{opacity:0;}
.work-list-wrap ul li img{width:100%;}
.work-category-menu{display:none;}
@media all and (max-width:1024px){
 .work-category-menu{display:block;padding:100px 0 50px;}
 .work-category-menu ul{ text-align:center;}
 .work-category-menu ul li{display:inline-block;text-align:center;font-weight:700;opacity: 0.5;margin:0 15px;}
 .work-category-menu ul li.on{opacity: 1;}
 .work-category-menu ul li a{display:block;font-size:15px;padding:3px 0;}
 }
 @media all and (max-width:767px){
  .work-list-wrap ul{display:block;}
 }

 /* news */
.sec-newsroom{background:#282828;}
.sec-newsroom h2{font-size:95px;font-weight:800;text-align:left;width:100%;}
.news-wrap{padding-top:100px;padding-bottom:100px;}
@media all and (max-width:1620px){
  .sec-newsroom h2{font-size:5vw;} 
}
@media all and (max-width:1260px){
  .news-wrap{padding-top:90px !important;padding-bottom:90px !important;}
  }
@media all and (max-width:767px){
  .news-wrap{padding-top:70px !important;padding-bottom:50px !important;}
}

/* lab */
.sec-lab{background:#f1f1f1;}
.sec-lab .header .btn-hamburger > a div{background:#282828;}
.sec-lab .section-next a svg path{fill:#000}
html:not(.is-menu-hover ) .sec-lab .header .nav > ul > li > a{color:#000;}
html:not(.is-menu-hover ) .sec-lab .header .logo a{background-image:url('../images/logo-black.png')}
html:not(.is-menu-hover ) .sec-lab .slogan{background:url('../images/txt-slogan-black.png') no-repeat 0 0;}
html:not(.is-menu-hover ) .sec-lab .socials [class*=ico-] svg path{fill:#000}
html:not(.is-menu-hover ) .sec-lab .socials .languages ul a{color:#000;}

.lab-wrap{padding:100px 0;}
.lab-wrap h2{width:100%;color:#282828;max-width: 1345px;margin:0 auto;}
.lab-wrap h2 > strong{font-size:184px;display:inline-block;line-height:1em;vertical-align:baseline;font-weight:800;margin-right:20px;margin-left:-0.05em;}
.lab-wrap h2 > .txt{display:inline-block;vertical-align:baseline;}
.lab-wrap h2 > .txt b{display:block;font-size:46px;line-height:1em;font-family: 'AppleSDGothicNeoEB00'; font-weight:500;/* letter-spacing: -1px; */}
.lab-wrap h2 > .txt span{display:block;font-size:32px;font-weight:500;letter-spacing: -0.075em;line-height:1em;}
.lab-wrap .lab-slogan{margin-top:25px;color:#282828;}
.lab-wrap .lab-slogan b{font-size:61px;font-weight:800;text-align:center;display:block;line-height:1em;}
.lab-wrap .lab-slogan p{font-family: AppleSDGothicNeoEB;text-align: center;font-size:24px;line-height:1.2em;font-weight:500;margin-top:10px;}

.lab-wrap .btn-wrap{margin-top:60px;}
@media all and (max-width:1620px){
  .lab-wrap{padding-left:80px;padding-right:80px;width:100%;}
}
@media all and (max-width:1260px){
  .lab-wrap{padding-top:90px !important;padding-bottom:90px !important;}
  .lab-wrap h2 > strong{font-size:8vw;margin-right:2vw;}
  .lab-wrap h2 > .txt b{font-size:2.8vw;}
  .lab-wrap h2 > .txt span{font-size:2.5vw;}

  .lab-wrap .lab-slogan b{font-size:5vw;}
  .lab-wrap .lab-slogan p{font-size:2.5vw;}
}

@media all and (max-width:767px){
  .lab-wrap{padding-top:70px !important;padding-bottom:50px !important;}
  .lab-wrap h2 > strong{margin-left:0;}
  .lab-wrap{padding-top:70px !important;padding-bottom:50px !important;}
  .lab-wrap h2{width:445px;max-width: 100%;margin:0 auto;}

  .lab-wrap .btn-wrap{margin-top:25px;}
}

/* contact */
.sec-contact{background:url('../images/bg-contact.jpg') no-repeat 50% 50%;background-size:cover;}
.contact-wrap{width:1152px;margin:0 auto;}
.contact-wrap .txt-contact img{max-width: 100%;}
.contact-wrap .btn-wrap{width:100%;}
.contact-wrap .btn-wrap button{flex:1;}
@media all and (max-width:1260px){
  .contact-wrap{width:auto;}
}


.is-popup{overflow:hidden;}
.popup-wrap{display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index: 200;background:#282828;}
.popup-wrap .btn-close{width:70px;height:70px;margin-left:auto;display:flex;justify-content:center;align-items:center;background:url("data:image/svg+xml,%3Csvg width='85' height='85' viewBox='0 0 85 85' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M70.9515 0L42.5031 28.4484L14.0485 0L0 14.0485L28.4484 42.5031L0 70.9515L14.0485 85L42.5031 56.5516L70.9515 85L85 70.9515L56.5516 42.5031L85 14.0485L70.9515 0Z' fill='white'/%3E%3C/svg%3E%0A") no-repeat 50% 50%;background-size:auto 42px;}
.popup-wrap .popup > .btn-close{position:absolute;top:50px;right:50px;z-index: 1;}
.popup-wrap .popup{padding:90px 100px;height:100%;overflow:hidden;overflow-y:auto;display:flex;flex-direction: column;}
.popup-wrap .popup .pop-header{display:flex;align-items:flex-end;padding-bottom:10px;}
.popup-wrap .popup .pop-header.line{border-bottom:1px solid #F1F1F1;}
.popup-wrap .popup .pop-header .pop-tit{font-size:50px;font-weight:700;/* font-family: 'NotoSans'; */line-height:1.2em;}
.popup-wrap .popup .pop-header .pop-tit b{font-size:90px;line-height:1em;vertical-align:baseline;letter-spacing: -0.08em;font-family: 'Gotham';}
.popup-wrap .popup .pop-header .pop-tit .date{font-size:20px;vertical-align:baseline;font-weight:500;}
.popup-wrap .popup .pop-header .pop-tit .s-txt{font-size:50px;vertical-align:baseline;}
.popup-wrap .popup .pop-body{display: flex;justify-content: center;position:relative;flex:1;/* padding-bottom:100px; */}
.popup-wrap .popup .pop-logo{position:absolute;bottom:0px;right: 0px;float:right; display:block;width:60px;height:11px;background:url('../images/logo-black.png') no-repeat 0 0;background-size:auto 100%;}
.popup-wrap .popup .board-wrap{margin:0 auto;width:1345px;max-width:100%;display:flex;justify-content: center;}
.popup-wrap .popup .video,
.popup-wrap .popup .vimeo,
.popup-wrap .popup iframe,
.popup-wrap .popup video{height:100%;}
.popup-wrap .popup .video:empty,
.popup-wrap .popup .vimeo:empty{display:none !important;}
.popup-wrap .popup .video,
.popup-wrap .popup .vimeo{position: relative;max-height: 100%;aspect-ratio: 16 / 9;max-height: 100%;  max-width: 100%;}
.popup-wrap .popup .video > *,
.popup-wrap .popup .vimeo > *{position:absolute;top:50%;left:0;transform:translateY(-50%);-webkit-transform:translateY(-50%);max-width: 100%;width:100%;}
.popup-wrap.white{background:#F1F1F1;}
.popup-wrap.white .popup .pop-header .pop-tit{color:#282828;}
.popup-wrap.white .popup .pop-header.line{border-color: #282828;}
.popup-wrap.white .detail-wrap{ color:#282828;}
.popup-wrap.white .btn-close{background-image: url("data:image/svg+xml,%3Csvg width='85' height='85' viewBox='0 0 85 85' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M70.9515 0L42.5031 28.4484L14.0485 0L0 14.0485L28.4484 42.5031L0 70.9515L14.0485 85L42.5031 56.5516L70.9515 85L85 70.9515L56.5516 42.5031L85 14.0485L70.9515 0Z' fill='%23282828'/%3E%3C/svg%3E%0A");}
.popup-wrap.white .pop-logo{background-image:url('../images/logo.png');}

.popup-wrap .popup .pop-header .pop-tit h2{width:100%;color:#282828;max-width: 1345px;margin:0 auto;}
.popup-wrap .popup .pop-header .pop-tit  h2 > strong{font-size:184px;display:inline-block;line-height:1em;vertical-align:baseline;font-weight:800;/*margin-right:20px;*/margin-right:40px; margin-left:-0.05em;}
.popup-wrap .popup .pop-header .pop-tit  h2 > .txt{display:inline-block;vertical-align:baseline;}
.popup-wrap .popup .pop-header .pop-tit  h2 > .txt b{display:block;font-size:46px;line-height:1em;font-family: 'HGGGothicssi';font-weight:500;}
.popup-wrap .popup .pop-header .pop-tit  h2> .txt span{display:block;font-size:32px;font-weight:500;letter-spacing: -0.075em;line-height:1em;}

.popup-wrap .popup .pop-body .detail-wrap video {float:left;  width:40%; margin-right:30px;}

#pop-video{z-index: 300;}
#pop-video .popup{display:flex;justify-content:center;align-items:center;padding:0;}
@media all and (max-width:1260px){
  .popup-wrap .btn-close{width:56px;height:56px;background-size:auto 34px;}
  .popup-wrap .popup{padding:80px 80px;}
  .popup-wrap .popup .pop-header .pop-tit{font-size:4.5vw;}
  .popup-wrap .popup .pop-header .pop-tit .s-txt{font-size:3vw;}
  .popup-wrap .popup .pop-header .pop-tit b{font-size:7vw;}
  .popup-wrap .popup .pop-header .pop-tit .date{font-size:2vw;}
  .popup-wrap .popup .pop-logo{width:100px;height:18px;}
}
@media all and (max-width:1024px){
  .popup-wrap .btn-close{width:42px;height:42px;background-size:auto 25px;}
  .popup-wrap .popup{padding:40px 25px;}
  .popup-wrap .popup .pop-logo{width:73px;height:13px;}
  .popup-wrap .popup .pop-body{padding-bottom:70px;}
  .popup-wrap .popup .pop-body .detail-wrap video{width:100%;}
}


@-webkit-keyframes bounce {
  to {
      transform: translateY(0) rotate(90deg)
  }
  50% {
      transform: translateY(-15px) rotate(90deg)
  }
}
@keyframes bounce {
  to {
      transform: translateY(0) rotate(90deg)
  }
  50% {
      transform: translateY(-15px) rotate(90deg)
  }
}