@charset "utf-8";
.main_temp_img {width:100%; height:auto;}
body.main_wrap{-ms-overflow-style:none;}
::-webkit-scrollbar {display:none;}
.main_wrap .header {position:fixed; left:0; right:0; top:0; z-index:150; background-color:#fff;}
.main_wrap .header--no-bg {background-color:transparent;}
.main_wrap .header--fixed.header--no-bg {color:#fff}
.main_wrap .header--fixed.header--no-bg .header__logo a {filter:invert(1);}
.main_wrap .header--fixed.header--no-bg .all-menu-btn .menu-bar {filter:invert(1);}
.main_wrap .header--fixed.header--no-bg .all-menu-btn.menu--active .menu-bar {filter:invert(0);}
.pc_img, .pc_br {display:block;}
.mo_img, .mo_br {display:none;}
.pc_inline {display:inline;}
.mo_inline {display:none;}
.main_wrap .footer {background-color:#171717; border-color:#171717; color:#fff;}
.main_wrap .footer__inner {max-width:1920px;}
.main_wrap .footer__sns a {filter:invert(1);}
.container.main {padding-top:0;}
.main_section {position:relative; max-width:100%; overflow:hidden;}
.full_page {height:100vh;}

.swiper-container-vertical > .swiper-pagination-bullets {position:fixed; top:50%; right:50px;}
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {width:15px; height:15px; margin:20px 0; background-color:#dcdcdc; opacity:0.6;}
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet-active {background-color:#4f7df5; opacity:1; transition:background-color .4s linear}
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet:nth-child(3).swiper-pagination-bullet-active,
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet:nth-child(8).swiper-pagination-bullet-active {background-color:#fff;}

.sec01, .sec03, .sec06 {color:#fff;}
.main_cont {position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); margin-top: 40px;}
.main_cont.center {width:100%; height:auto; text-align:center; justify-content:center; padding:0 15px;}
h2.sec_tit {font-family: 'GothamPro'; font-weight:600; font-size:45px; line-height:1.33; text-transform: uppercase;}
.sec_tit.large {font-size:55px;line-height:1.18; }
.sec_tit.lower {text-transform: none;}
.sec_desc {margin-top:35px; font-size:18px; line-height: 1.66; word-break: keep-all;}
.inc_slider {display:flex; align-items:center; margin-top:40px; margin-left:-180px;}
.inc_slider .sec_tit {position:relative; z-index:10; width:330px; margin-right:30px;}
.inc_slider:before {position:absolute; top:50%; right:100%; margin-right:-330px; display:block; width:500%; height:800px; transform:translateY(-50%); background-color:#fff; z-index:5; content:'';}
.inc_slider .swiper-button-prev {left:-10px; background:url('/data/images/main/btn_main_prev.png') no-repeat 50% 50% / 21px auto}
.inc_slider .swiper-button-next {right:-10px; background:url('/data/images/main/btn_main_next.png') no-repeat 50% 50% / 21px auto}

.btn_top {position:fixed; bottom: 30px; right:50px; display:block; width:60px; height:60px; background:url('/data/images/main/btn_main_top.png') no-repeat 0 0 / 120px auto; overflow:hidden; opacity:0; transform: translateY(-40px); transition:opacity .5s linear, transform .5s linear;}
.btn_top.is-active {opacity:1; transform:translateY(0); z-index:10;}
.btn_top.type-black {background-image:url('/data/images/main/btn_main_top.png'); background-position: -60px 0;}

/* sec01_video */
/* .sec01 .sec_tit,
.sec01 .sec_desc {filter:drop-shadow(0px 1px 3px #333);} */
.main_video:after {content:''; display:block; width:100%; height:100%; background:rgba(0,0,0,0.5); position:absolute; top:0; left:0;}
.main_video video {width: 100%; height:100vh; -o-object-fit: cover; object-fit: cover;}
.ico_scroll {position:absolute; bottom:40px; left:50%; padding-bottom:70px; transform:translateX(-50%); animation-name:updown; animation-duration:1s; animation-iteration-count:infinite; animation-direction:alternate; color:#fff; background:url('/data/images/main/ico_scroll.png') no-repeat 50% 100% / 22px auto; letter-spacing: 0;}

/* sec02_work */
.work_swiper {width:514px;}
.work_swiper .main_work {position:relative; width:514px; height:440px; padding:0 37px;}
.work_bg {position:relative; width:100%; height:100%; overflow:hidden; border-radius:50%; border: 1px solid #eaeaea; box-sizing: border-box;}
.work_bg:before {content:''; opacity:0; position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.7); transition:all .5s ease-in-out; border-radius:50%; overflow:hidden;}
.work_bg img {width:100%; height:100%;;overflow:hidden; border-radius:50%;}
.work_txt {position: absolute; top: 50%; left:50%; transform:translate(-50%, -50%); padding-top:10px; text-align:center; z-index:5; color:#fff; transition:all .5s ease-in-out; opacity:0;}
.work_category {font-size:13px; font-family: 'GothamPro'; font-weight:600; letter-spacing: 0;}
.work_detail {margin-top:10px; font-size:25px; font-weight:700;}
.work_hash {margin-top:25px; font-size:18px; font-weight:300; opacity: 0.7;}
.main_work:hover .work_bg:before {opacity:1;}
.main_work:hover .work_txt {opacity:1;}

/* sec03 */
.main_bg {height:100vh; overflow: hidden;}
.main_bg canvas {width:100% !important; height: 100% !important;}

/* sec04_branding */
.sec04 {height: 500px;}
.sec04 .main_cont {margin-top:0;}
.sec04 .main_inner {color:#000;}
.sec04 .sec_desc {color:#666;}

.self_ani {transform:translatex(100px); opacity:0; transition:all .7s ease;}
.self_ani.active {transform:translatex(0); opacity:1;}
.branding ul {display:flex; max-width:1700px; padding:0 5px; margin:70px auto 0; justify-content:space-between}
.brand_txt {position: relative; padding-top:70px; white-space:nowrap; font-size:18px; line-height:1.11; font-weight:300;}
.brand_txt:before {content:''; display:block; width:60px; height: 50px; position: absolute; top:0; left:50%; transform:translateX(-50%); background:url('/data/images/main/ico_branding.png') no-repeat 50% 0 / 100% auto;}
.item_01 .brand_txt:before {background-position:50% 0;}
.item_02 .brand_txt:before {background-position:50% -55px;}
.item_03 .brand_txt:before {background-position:50% -113px;}
.item_04 .brand_txt:before {background-position:50% -169px;}
.item_05 .brand_txt:before {background-position:50% -225px;}
.item_06 .brand_txt:before {background-position:50% 100%;}

/* sec05_story */
.sec05 {background-color:#f8f8f8;}
.sec05 .inc_slider:before {background:#f8f8f8;}
.story_swiper {width:514px;}
.story_swiper .main_story {position:relative; width:514px; height:370px; padding:0 37px;}
.story_txt {width:100%; height:100%; padding:55px; overflow:hidden; border-radius:45px; word-break: keep-all; background:#fff; transition:all .3s ease-in-out; display: flex; flex-direction: column; justify-content: center;}
.swiper-slide-active .story_txt {background:#000; color:#fff; box-shadow:20px 0 20px rgba(0, 0, 0, .14)}
.story_tit { display: -webkit-inline-box; -webkit-box-orient: vertical; -webkit-line-clamp:2; overflow: hidden;font-size:25px; line-height:35px; letter-spacing:-0.5px;}
.story_news {margin-top:30px; font-size:16px; line-height:28px; font-weight:300; -webkit-line-clamp: 6; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; text-overflow: ellipsis;}

/* sec06_location */
.sec06 {background-color:#171717;}
.sec06 .main_cont {display: flex; align-items:center;}
.location_img {position: relative; width:50%; height:100%; padding-right:20px;}
.location_img img {width:100%; height: auto;}
.btn_gomap {position: absolute; bottom:0; left:0; display:block; min-width:110px; padding:20px 0 12px; text-align:center; color:#1e1e1e; background-color:#fae100;}
.btn_gomap span {display:inline-block; padding-top:48px; font-size:15px; line-height:2; background:url('/data/images/main/ico_pin.png') no-repeat 50% 0 / 30px auto;}
.location_text {width:50%; padding-left:90px; text-align:left;}
.company_name {display:block; margin-top:40px; font-size:22px; line-height:30px;}
.company_addr {margin-top:12px; font-size:16px; line-height:30px; font-weight:300;}
.company_contact {margin-top:48px; font-size:15px; line-height:30px; font-weight:300; color:#aeaeae;}
.btn_contact {display:inline-block; width:162px; height:50px; margin-top:25px; padding-left:10px; line-height:46px; text-align:center; border:1px solid #fff;}
.btn_contact span {padding-right:58px; background:url('/data/images/common/ico_go_arrowpng.png') no-repeat 100% 50% / 16px auto;}

@keyframes updown {
  from {bottom:40px;}
  to {bottom:20px;}
}

@keyframes updown2 {
  from {bottom:80px;}
  to {bottom:20px;}
}

@media all and (max-width:1320px) {
  .inc_slider {margin-left:-11.36%;}
  .inc_slider .sec_tit {width:250px;}
  .inc_slider:before {margin-right:-250px;}
}

/* Tablet */
@media all and (max-width:1024px) {
  h2.sec_tit {font-size:40px; line-height:1.37;}
  .sec_tit.large {font-size:50px; line-height:1.2;}
  .sec_desc {margin-top:18px; font-size:16px; line-height:1.75;}

  .pc_br {display:none;}
  .main_cont  {width:100%;}
  .inc_slider {display:block; margin-top:0; margin-left:0px; padding:0 50px;}
  .inc_slider .sec_tit {position:relative; z-index:10; width:100%; margin-right:0px;}
  .inc_slider:before {display:none;}
  .inc_slider .swiper-button-prev {left:-15px; background-size:19px auto;}
  .inc_slider .swiper-button-next {right:-15px; background-size:19px auto;}

  /* sec01_video */
  .sec01 .sec_tit {padding:0 150px;}

  /* sec02_work */
  .work_swiper {width:500px; margin:75px auto 0;}
  .work_swiper .main_work {position:relative; width:500px; height:400px; padding:0 50px;}
  .work_category {font-size:14px}
  .work_detail {margin-top:15px; font-size:22px; line-height:32px;}
  .work_hash {font-size:16px;}
  .main_work:hover .work_bg:before {opacity:0;}
  .main_work:hover .work_txt {opacity:0;}
  .main_work.swiper-slide-active .work_bg:before {opacity:1;}
  .main_work.swiper-slide-active .work_txt {opacity:1;}

  .sec04 {height:400px;}
  .branding ul {margin:60px auto 0; padding:0 40px;}
  .brand_txt {padding-top:65px; font-size:16px; line-height:1.25;}
  .brand_txt:before {width:54px; height: 46px;}
  .item_01 .brand_txt:before {background-position:50% 0;}
  .item_02 .brand_txt:before {background-position:50% -50px;}
  .item_03 .brand_txt:before {background-position:50% -101px;}
  .item_04 .brand_txt:before {background-position:50% -151px;}
  .item_05 .brand_txt:before {background-position:50% -202px;}
  .item_06 .brand_txt:before {background-position:50% 100%;}

  .story_swiper {width:468px; margin:110px auto 0;}
  .story_swiper .main_story {width:468px; height:330px; padding:0 34px;}
  .story_txt {padding:40px; border-radius:45px;}
  .story_tit {font-size:22px; line-height:32px;}
  .story_news {margin-top:28px; font-size:15px; line-height:25px;}

  /* sec06_location */
  .sec06 .main_cont {display:block;}
  .location_img {width:100%; min-width:100%; padding:0;}
  .btn_gomap {min-width:65px; padding:12px 0 8px;}
  .btn_gomap span {padding-top:24px; font-size:12px; background-size:15px auto;}
  .location_text {width:100%; margin-top:50px; padding-left:0; padding-right:0;}
  .company_name {margin-top:20px; font-size:18px; line-height:30px;}
  .company_addr {margin-top:7px; font-size:14px; line-height:23px;}
  .company_contact {margin-top:34px; font-size:13px; line-height:24px;}
  .btn_contact {width:100%; height:45px; margin-top:20px; padding-left:0; line-height:41px;}
  .btn_contact span {padding-right:25px; background-size:14px auto; background-position:100% 6px;}

  /* sec06_location 
  .sec06 .sec_tit {line-height:1;}
  .location_img {width:56%; min-width:580px; padding-right:0px;}
  .btn_gomap {min-width:87px; padding:12px 0 12px;}
  .btn_gomap span {padding-top:35px; font-size:12px; background-size:23px auto;}
  .location_text {width:44%; padding-left:7.812%; padding-right:5.859%}
  .company_name {margin-top:45px; font-size:20px; line-height:20px;}
  .company_addr {margin-top:22px; font-size:15px; line-height:25px;}
  .company_contact {margin-top:40px; font-size:14px; line-height:25px;}
  .btn_contact {margin-top:23px;} */
}

@media all and (max-width:750px) {
  html,
  body {height:500px; overflow:hidden;}
  .pc_img,
  .pc_br,
  .pc_inline {display:none;}
  .mo_inline {display:inline;}
  .mo_img, .mo_br {display:block; width:100%;}

  .main_cont {margin-top:30px;}
  .ico_scroll {background-size:18px; font-size:12px; padding-bottom:60px; animation-name:updown2;}

  .inc_slider {margin-top:0; margin-left:0; padding:0 15px;}
  .inc_slider .swiper-button-prev {left:-5px; background-size:14px auto;}
  .inc_slider .swiper-button-next {right:-5px; background-size:14px auto;}

  h2.sec_tit {font-size:7.5vw;}
  .sec_desc {margin-top:24px; font-size:16px;}
  .sec_tit.large {font-size:35px;}
  .sec_tit.show--mobile {position:absolute; top:100px; left:15px;}

  .btn_top {bottom:20px; right:20px; width:30px; height:30px; background-size:60px auto;}
  .btn_top.type-black {background-position: -30px 0;}

  /* sec01_video */
  .sec01 .sec_tit {padding:0;}
  .sec01 .sec_desc.aos-animate {opacity:0.8}

  /* sec02_work */
  .work_swiper {width:100%; margin:105px auto 0;}
  .work_swiper .main_work {width:100%; height:100%; padding:0 30px;}
  .work_txt {color:#000; top:100%; transform:translate(-50%, 0); padding-top:0; width:100%;}
  .work_category {display:none; /* font-size:14px */}
  .work_detail {margin-top:20px; font-size:16px; line-height:1.3;}
  .work_hash {margin-top:10px; font-size:11px; line-height:1;}
  .main_work.swiper-slide-active .work_bg:before {display:none;}

  .sec03 .sec_desc.aos-animate {opacity:0.8}

  .sec04 {height:100vh;}
  .sec04 .sec_tit,
  .sec04 .sec_desc {text-align:left; padding-left:0px;}
  .branding ul {margin:200px auto 0; padding:0; flex-wrap:wrap;}
  .branding ul li {width:30%; margin-top:55px;}
  .brand_txt {padding-top:65px; font-size:15px; line-height:1;}
  .brand_txt:before {width:48px; height: 40px;}
  .item_01 .brand_txt:before {background-position:50% 0;}
  .item_02 .brand_txt:before {background-position:50% -45px;}
  .item_03 .brand_txt:before {background-position:50% -90px;}
  .item_04 .brand_txt:before {background-position:50% -135px;}
  .item_05 .brand_txt:before {background-position:50% -180px;}
  .item_06 .brand_txt:before {background-position:50% 100%;}

  .story_swiper {width:100%; margin:125px auto 0;}
  .story_swiper .main_story {width:100%; height:auto; padding:0 30px;}
  .story_txt {/*padding:35px 20px 45px;*/ border-radius:50px;}
  .story_tit {font-size:20px; line-height:28px;}
  .story_news {margin-top:18px; font-size:13px; line-height:23px; -webkit-line-clamp: 4;}

  /* sec06_location */
  .btn_gomap span {font-size:9px;}

  .main_wrap .footer__inner {position:relative;}
  .main_wrap .footer__info {position:absolute; bottom:40px;}
  .main_wrap .footer__logo, .footer__list, .footer__family {display:none;}
  .main_wrap .footer__sns {margin:0 0 50px;}
}
@media all and (max-width:375px) {
  .sec_tit {font-size:26px;}
  .sec_desc {margin-top:15px; font-size:14px;}
  .sec_tit.large {font-size:26px;}

  .work_swiper, .story_swiper {margin-top:50px;}
  /* .branding ul {margin-top:0;} */
}

@media all and (max-width:320px) {
  .sec_tit {font-size:20px;}
  .sec_desc {margin-top:15px; font-size:12px;}
  .sec_tit.large {font-size:23px;}

  .work_swiper, .story_swiper {margin-top:25px;}
}

@media screen and (max-height: 570px) {
  .sec04 .sec_tit.show--mobile {top:80px;}
  .location_text {margin-top:18px;}
  .company_name {margin-top:12px;}
  .company_contact {margin-top:10px;}
}