@charset "utf-8";

/* MAIN SETTING */
/*----- MAIN - COMMON -----*/
.section {overflow:hidden;}
.section.main-footer {overflow:visible;}

.section,.fp-tableCell {min-height:50rem !important;}
.section.main-footer,.main-footer .fp-tableCell {min-height:auto !important;}
.main-tit-wrap {text-align:center; z-index: 20}
.main-tit {overflow:hidden;}
.main-tit span {display:inline-block;font-size:4.4rem;color:#fff;font-weight:800;letter-spacing:-0.045em;line-height:1.227em;vertical-align:middle;}
.main-txt {margin-top:0.850em;font-size:1.4rem;color:#eee;line-height:1.65em;font-weight:300;letter-spacing:-0.010em;}

/* VISUAL */
.visual-slider {height:100%;text-align:center;}
.visual-slider .swiper-slide {overflow:hidden;position:relative;height:100%;}
.visual-slider .visual-bg {position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transition: all 5s;transition: all 5s;-webkit-transform: scale(1.2);transform: scale(1.2);}
.visual-slider .visual-bg > div {position:absolute;left:0;top:0;width:100%;height:100%;background-repeat:no-repeat;background-position:center center; background-size:cover;}
.visual-slider .visual-txtbox-wrap {display:flex;justify-content:center;align-items:flex-end;position:relative;z-index:1;margin:0 auto;max-width:100rem;width:90%;height:56.35%;}
.visual-slider .visual-txtbox h2 {overflow:hidden;}
.visual-slider .visual-txtbox h2 span {display:inline-block;vertical-align: middle;font-size:3rem;color:#f0f0f0;font-weight:800;line-height:1.333em; letter-spacing:-0.017em;}
.visual-slider .visual-txtbox p {margin-top:0.9em;font-size:2rem;color:#fff;line-height:1.6em;}
.visual-slider .swiper-slide-active .visual-txtbox h2 span {-webkit-animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;}
.visual-slider .swiper-slide-active .visual-txtbox p {-webkit-animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;-webkit-animation-delay:1.2s;animation-delay:1.2s;}
@-webkit-keyframes slideAni {
	from {
		opacity:0;
		-webkit-transform: translateY(4rem);
		transform: translateY(4rem);
	}
	to {
		opacity:1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}
@keyframes slideAni {
	from {
		opacity:0;
		-webkit-transform: translateY(4rem);
		transform: translateY(4rem);
	}
	to {
		opacity:1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}
.visual-slider .swiper-slide-active .visual-bg {
	-webkit-transform: scale(1);
	transform: scale(1);
}

/* SWIPER PAGINATION */
.visual-slider .swiper-opt-wrap {display:flex;justify-content:center;align-items:center;position:absolute;left:0;top:56%;right:auto;bottom:auto;z-index:10;margin:5.5rem 0 0;width:100%;
    -webkit-animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;
    animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;
    -webkit-animation-delay:1.3s;
    animation-delay:1.3s;}
.visual-slider .swiper-play {width:3rem;height:3rem;background:url(/img/ico-slide-stop.png) no-repeat center;cursor:pointer;}
.stopped .visual-slider .swiper-play {background:url(/img/ico-slide-play.png) no-repeat center;}
.visual-slider .swiper-pagination {display:flex; justify-content:center; align-items:center; position:static; margin:0; text-align:center;}
.visual-slider .swiper-pagination-bullet {display:block;opacity:0.4 !important;margin:0 0.467em;width:auto;height:auto;border-radius:0;background:transparent;font-size:1.5em;color:#f0f0f0;font-weight:600;line-height:1.5em;}
.visual-slider .swiper-pagination-bullet .progressbar {overflow:hidden;display:inline-block;position:relative;width:0;height:0.1rem;background:rgba(255,255,255,0.5);vertical-align:middle;-webkit-transition:all 1s ease;transition:all 1s ease;}
.visual-slider .swiper-pagination-bullet .progressbar::after {content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:#fff;}
.stopped .visual-slider .swiper-pagination-bullet .progressbar::after {animation:none !important;}
.visual-slider .swiper-pagination-bullet.swiper-pagination-bullet-active {opacity:1 !important;}
.visual-slider .swiper-pagination-bullet.swiper-pagination-bullet-active .progressbar {margin-left:0.8rem;width:5rem;}
.visual-slider .swiper-pagination-bullet.swiper-pagination-bullet-active .progressbar::after {-webkit-animation:progressBar 5s ease;animation:progressBar 5s ease;}
.init .visual-slider .swiper-pagination-bullet.swiper-pagination-bullet-active .progressbar::after {-webkit-animation-delay:1s;animation-delay:1s;}
@-webkit-keyframes progressBar {
    0% {width:0;}
    100% {width:100%;}
}
@keyframes progressBar {
    0% {width:0;}
    100% {width:100%;}
}


.particles-background, .particles-foreground {left: -51%; top: -51%; width: 202%; height: 202%; transform: scale3d(0.5, 0.5, 1);}
#particles-background { background: #2c2d44;
  background-image: -moz-linear-gradient(45deg, #3f3251 2%, #002025 100%);
  background-image: -webkit-linear-gradient(45deg, #3f3251 2%, #002025 100%);
  background-image: linear-gradient(45deg, #3f3251 2%, #002025 100%);
}
@keyframes rotate {
  0% {transform: rotate(0deg);}
  100% {transform: rotate(360deg);}
}
@keyframes fade {
  0% {opacity: 1;}
  50% {opacity: 0.25;}
}
@keyframes fade-in {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

/* ===== SCROLLDOWN ===== */
.scrolldown {position:absolute;left:50%;bottom:0;z-index:10;width:1px;height:4rem;background:rgba(255,255,255,0.4);
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    -webkit-animation: slideAni 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
    animation: slideAni 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
    -webkit-animation-delay:1s;animation-delay:1s;
}
.scrolldown i {position:absolute;left:0;top:0;width:100%;background-color:#fff;height:0%;
    -webkit-animation:scrollDown 1.8s infinite linear;
    animation:scrollDown 1.8s infinite linear;
    -webkit-animation-delay:1.5s;animation-delay:1.5s;
}
.scrolldown i::after {content:"";position:absolute;left:50%;top:100%;margin-left:-0.25rem; width:0.5rem; height:0.5rem; background-color:#fff;
-webkit-transform:rotate(45deg);transform:rotate(45deg);
}
@-webkit-keyframes scrollDown {
	0% {height:0;}
	100% {height:100%;}
}
@keyframes scrollDown {
	0% {height:0;}
	100% {height:100%;}
}


.ico_main_product_next {background: url(/img/main_product_next.png) no-repeat center; display: inline-block; width: 50px; height: 15px; flex-shrink: 0;}
.main-btn a{display:inline-block; font-size:1rem; padding:5px 40px; border:1px solid #f0f0f0; color:#fff; transition:all ease .3s;}
.main-btn a:hover{background:#ee2d23; color:#fff; border-color:#ee2d23;}
/* main */
.main-product {position: relative; padding: 15px 0; display: flex; overflow:hidden;} /*background-color: #f8f9fd;*/
.main-product-container {display: flex; position: relative; width: 100%;max-width: 1400px;margin: 0 auto; }
.main-product::after {z-index: 0;background: #222; opacity: 0.8; width:48%; height:100%; content:''; position: absolute; left:0; top:50%; transform:translate3d(0,-50%,0);}
.main-product .section_sub_title {font-size: 16px; font-weight: 500; color: #fff; padding-bottom: 33px; position: relative; margin-bottom: 30px;}
.main-product .section_sub_title::after {content:''; position: absolute; bottom:0; left:0; width: 30px; height: 3px; background:#fff;}
.main-product .section_title {font-size: 46px; font-weight: 500; color: #fff; display: flex; flex-direction:column; margin-bottom: 35px; align-items:flex-start;}
.main-product .section_desc {font-size: 16px; color: #fff; font-weight: 400; margin-bottom: 130px;}
.main-product .btn {color:#666; padding: 20px 50px; border:1px solid #aaa; display: inline-block;}
.product-swiper-handle-wrapper {display: flex; align-items: center; justify-content: flex-start;}
.main-product-col {z-index: 1;}
.main-product-col:first-child {display: flex; flex-direction:column; justify-content: center; align-items: flex-start; padding-right: 130px;margin:2em 0}
.main-product-col:nth-of-type(2) {position: relative;}
.product-swiper-container {}
.main-product .swiper-slide {height: 500px; position: relative; display: flex; align-items: flex-end; justify-content: center; cursor:pointer; }
/* .main-product .swiper-slide:nth-of-type(1) {background:url(/img/solution_card_bg01.jpg) no-repeat center;}
.main-product .swiper-slide:nth-of-type(2) {background:url(/img/solution_card_bg02.jpg) no-repeat center;}
.main-product .swiper-slide:nth-of-type(3) {background:url(/img/solution_card_bg03.jpg) no-repeat center;}
.main-product .swiper-slide:nth-of-type(4) {background:url(/img/solution_card_bg04.jpg) no-repeat center;}
.main-product .swiper-slide:nth-of-type(5) {background:url(/img/solution_card_bg05.jpg) no-repeat center;} */
.main-product .swiper-slide .inner_content {z-index: 1; position: relative; display: flex; flex-direction:column; align-items: center; justify-content: center; margin-bottom: 80px;}
.product_title {color: #fff; font-size: 26px; font-weight: 600; margin-bottom: 10px;}
.product_desc {color: #fff; font-size: 16px; font-weight: 400; margin-bottom: 20px; display: none;}
.bi-plus-circle-fill {display: none;}
.main-product .swiper-slide:hover::after {content:''; width: 100%; height: 100%; background: #000; opacity: 0.5; position: absolute; top: 0; left: 0; z-index: 0;}
.main-product .swiper-slide:hover .product_desc {display: block;}
.main-product .swiper-slide:hover .bi-plus-circle-fill {display: block; font-size: 1.5rem; color:#fff}
.product-swiper-button-prev {width: 56px; height: 56px; border:1px solid #fff; background: url(/img/product_prev.png) no-repeat center; cursor:pointer; margin-right: 30px;}
.product-swiper-button-next {width: 56px; height: 56px; border:1px solid #fff; background: url(/img/product_next.png) no-repeat center; cursor:pointer; margin-left: 30px;}
.product-swiper-button-prev:hover,.product-swiper-button-next:hover {border:none; background-color: red}
.product-swiper-pagination {display: flex; flex-wrap:no-wrap;}
.product-swiper-pagination .swiper-pagination-bullet {width: 6px; height: 6px; boredr-radius:50%; background: #fff; margin: 0 8px;}

.main-txt {opacity:0;}
.main-products.active .main-tit span, .main-products.on .main-txt,
.main-quality.active .main-tit span, .main-quality.on .main-txt,
.main-global.active .main-tit span, .main-global.on .main-txt {
    -webkit-animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;
    animation: slideAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;
    -webkit-animation-delay:1s;animation-delay:1s;
}

.main-products{position:relative;height:100%;overflow:hidden; background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('../img/sub-visual-6.jpg'); background-repeat:no-repeat;background-position:center center; background-size:cover;}

.main-quality{position:relative;height:10em;overflow:hidden; background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('/img/main_visual_05.jpg'); background-repeat:no-repeat;background-position:center center; background-size:cover;}

.main-client{position:relative;height:100%;overflow:hidden; background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('../img/sub-visual-32.jpg'); background-repeat:no-repeat;background-position:center center; background-size:cover;}

.main-products{position: relative; z-index: -2}
.main-products.active .vd-bg{transform:scale(1);}
.main-products .vd-bg{position:absolute; left:0; top:0; width:100%; height:100%; z-index:-1;background:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('../img/sub-visual-6.jpg') no-repeat center center / cover; -webkit-transition: all 5s;transition: all 5s;-webkit-transform: scale(1.2);transform: scale(1.2);}

.main-quality{position: relative; z-index: -2}
.main-quality.active .vd-bg{transform:scale(1);}
.main-quality .vd-bg{position:absolute; left:0; top:0; width:100%; height:100%; z-index:-1;background:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('/img/main_visual_05.jpg') no-repeat center center / cover; -webkit-transition: all 5s;transition: all 5s;-webkit-transform: scale(1.2);transform: scale(1.2);}

.main-global{position: relative; background-color: #0c1a25;z-index: -2}
.main-global.active .vd-bg{transform:scale(1);}
.main-global .vd-bg{position:absolute; left:0; top:0; width:100%; height:100%; z-index:-1;background:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('../img/main_visual_earth.png') no-repeat center center / cover; -webkit-transition: all 5s;transition: all 5s;-webkit-transform: scale(1.2);transform: scale(1.2);}
.main-global .vd-bg1{position:absolute; left:0; top:0; width:100%; height:100%; z-index:-2;background:url('../img/main_visual_earth1.png') no-repeat center center / cover; }
.main-global.accordion-button:not(.collapsed){color:#fff; background-color: red;}
.main-global .on .main-txt, .main-quality .on .main-txt {-webkit-animation-delay:0.2s;animation-delay:0.2s;z-index: -2}

/* PRODUCT */
/* .products {position:relative;text-align:center;height:100%;}
.products .maxinner {padding-top:9rem;}
.products .vd-bg {position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transition: all 5s;transition: all 5s;-webkit-transform: scale(1.2);transform: scale(1.2);}
.products .vd-bg > div {position:absolute;left:0;top:0;width:100%;height:100%;background-repeat:no-repeat;background-position:center center;background-size:cover;}
.products .on .main-txt {-webkit-animation-delay:0.2s;animation-delay:0.2s;} */
.values .main-tit span {color:#2d76ee;}
.values::after {opacity:0.5;content:"";position:absolute;right:0;top:-26.4%;z-index:-1;padding-bottom:26.3028%;width:29.011%;background:url(/images/main/values-bg01.png) no-repeat center;background-size:100%;}
.values::before {opacity:0.4;content:"";position:absolute;left:-1.5%;bottom:-15.3%;z-index:-1;padding-bottom:28.959%;width:31.9278%;background:url(/images/main/values-bg02.png) no-repeat center;background-size:100%;}
.values .maxinner {padding-top:9rem;}

.quality {position:relative;text-align:center;height:100%;}
.quality .maxinner {padding-top:9rem;}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

}

.client ul > li{display:flex;flex-wrap:wrap;}
.client ul > li img {width:100%; height:100%; border:1px solid #dddd; min-width:130px; }

/* ===== KEYWORDS - ANIMATION ===== */
.global h2 span {opacity:0;}
.global.on h2 span {-webkit-animation: slideLeftAni 1s cubic-bezier(0.4, 0, 0.2, 1) both; animation: slideLeftAni 1s cubic-bezier(0.4, 0, 0.2, 1) both;}
@-webkit-keyframes slideLeftAni {
	from {
		opacity:0;
		-webkit-transform: translateX(2rem);
		transform: translateX(2rem);
	}
	to {
		opacity:1;
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
}
@keyframes slideLeftAni {
	from {
		opacity:0;
		-webkit-transform: translateX(2rem);
		transform: translateX(2rem);
	}
	to {
		opacity:1;
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
}


/* ===== RESPONSIVE ===== */
@media all and (max-width:1700px) {
/* .fullnav-list li a {padding:0;width:0.5rem;height:3.4rem;font-size:0;} */
}
@media all and (max-width:1500px) {

}
@media all and (max-width:1440px) {
.main-tit span {font-size:3.8rem;}
/* .main-txt {font-size:1.8rem;} */
/* #fullnav.active {right:3%;} */
.visual-slider .visual-txtbox h2 span {font-size:3.5rem;}
.visual-slider .visual-txtbox p {font-size:1.5rem;}
.main-product-col:first-child {padding-left: 5em;}
}

@media all and (max-width:1024px) {
.main-tit span {font-size:3.2rem;}
.main-txt {padding:0 1em; font-size: 1.2rem}
.section, .fp-tableCell {height:auto !important;min-height:50rem !important;}
.visual .fp-tableCell {height:100vh !important;}
/* .section.main-footer, .main-footer .fp-tableCell {min-height:auto !important;} */
/* #fullnav {display:none !important;} */

.visual-slider .visual-txtbox h2 span {font-size:3rem;}
.visual-slider .visual-txtbox p {font-size:1.6rem;}

.main-product-container {flex-direction: column;}
.main-product::after {width: 100%; height: 60%;top: 0; transform: unset;}
.main-product .section_title, .section_media_section .section_title {font-size: 40px; margin-bottom: 35px;}
.main-product .section_desc {margin-bottom: 75px;}
.main-product-col:first-child {padding: 3em 2em;}
.product-swiper-container {margin-right: -35px;}
.main-product .swiper-slide {height: 500px;}

}

@media all and (max-width:767px) {
.main-txt {font-size: }
.main-txt br {display:none;}
.main-tit span {font-size:2.7rem;}
.visual-slider .visual-txtbox h2 span {font-size:3rem;}
.visual-slider .visual-txtbox p br {display:none;}



}

@media all and (max-width:576px) {
.main-product .section_sub_title {padding-bottom: 24px;margin-bottom: 22px;}
.main-product .section_title,.section_media_section .section_title {font-size: 32px;margin-bottom: 24px;}
.main-product .section_desc {font-size: 15px;margin-bottom: 32px;}
.product-swiper-button-prev {width: 40px;height: 40px;background-size: 8px;margin-right: 20px;}
.product-swiper-button-next {width: 40px;height: 40px;background-size: 8px;margin-left: 20px;}
.product-swiper-pagination .swiper-pagination-bullet {width: 5px;height: 5px;margin: 0 6px;}
.product {margin-right: 0;}
.main-product .swiper-slide .inner_content {padding: 0 18px;}
.main-product .swiper-slide {height: 300px;width: 100% !important;}
.solution_title {font-size: 20px;text-align: center;}
.solution_desc {text-align: center;}

}

@media (max-width: 480px) {
.visual-slider .visual-txtbox h2 span {font-size:1.5rem;font-weight:500;line-height:0.333em; letter-spacing:-0.017em;}
.values {padding:8rem 0;}
.visual-slider .swiper-pagination-bullet.swiper-pagination-bullet-active .progressbar {width:2rem;}
.visual-slider .swiper-pagination-bullet {font-size:1rem;}
.visual-slider .visual-txtbox p {font-size:1.1rem; font-weight: 300}
.main-tit span {font-size:8.4375vw;}
.main-txt {font-size:4.2vw;}
}

@media all and (max-width:320px) {
.visual-slider .visual-txtbox h2 span {font-size:10.9375vw;}
.visual-slider .visual-txtbox p {font-size:5vw;}

}
