@import url(common/common.css);

html, body {position: relative;overflow-x: hidden;}
#contents {transition: all .8s ease;}
#contents.fixed {position: fixed; overflow: hidden;}
.sec-wrap {transition: all .8s ease;}
/* .sec-wrap.depth1,.sec-wrap.depth3 {position:fixed;overflow: hidden;} */
/* .main #contents.fixed{position:fixed;overflow: hidden;} */

/* activeMotion */
.txtLine {display: block;overflow: hidden;}
.txtLine > span {position: relative;transform: translate3d(0, 100%, 0);transition:transform .6s ease .2s;display: block;}
.txtLine.activeMotion span {transform: translate3d(0, 0, 0);}
.tit.activeMotion > .txtLine span {transform: translate3d(0, 0, 0);}
.desc .txtLine > span {display: block;position: relative;transform: translate3d(0, 100%, 0);transition:transform .6s ease .3s}
.desc.activeMotion .txtLine > span {transform: translate3d(0, 0, 0);}

/* visual-sec */
.main .visual-sec {padding-top: 200vw;transition:.7s ease-in-out}
.main .visual-sec .text-area {position: absolute;top: 42.7778vw;left: 11.1111vw;z-index: 100;}
.main .visual-sec .page-tit {margin-bottom: 8.3333vw;}
.main .visual-sec .page-tit span {font-weight: 900;font-size: 6.8889vw;line-height: 11.6667vw;letter-spacing: 0.03rem;}
.main .visual-sec .page-tit .txtLine:nth-of-type(n+2) {margin-left: 10vw;}
.main .visual-sec .page-tit.activeMotion > .txtLine span {transform: translate3d(0, 0, 0);transition: 0.7s;transition-delay:0.8s}
/* .main .visual-sec .page-tit.activeMotion > .txtLine:nth-of-type(2) span {transition-delay: .2s;}
.main .visual-sec .page-tit.activeMotion > .txtLine:nth-of-type(3) span {transition-delay: .3s;} */
.main .visual-sec .text-area > .txtLine {margin-left: 10vw;}
.main .visual-sec .text-area > .txtLine.eng {margin-bottom: 2.2222vw;}
.main .visual-sec .text-area > .txtLine.eng span {transition-delay: .7s;font-family: var(--poppins-fonts);font-weight: 400;font-size: var(--title-type3);line-height: 6vw;transition: transform .6s ease 1.1s;} 
.main .visual-sec .text-area > .txtLine:last-child span {transition-delay:1.2s;font-family: var(--poppins-fonts);font-weight: 600;font-size: 6.6667vw;line-height: 8vw;} 

.main .visual-sec .video-wrap {position: relative;display: flex;justify-content: center;width: 100%;min-height: 177.7778vw;}
.main .visual-sec .video-inner {position: absolute;width: 1vw;height:1vw;overflow: hidden;transition-duration:1s;bottom:0;}
.main .video-wrap .video-inner::after {content: '';position:absolute;top:0;left:0;width:100%;height:100%;background: url(../images/main_visual_linear_bg02.png) 50% 50% no-repeat;background-size: cover;}
.main .visual-sec .video-inner video {width: 100%;transition: .6s;transition-delay:0.6s;}
.main .visual-sec .video-inner.class video {transform: scale(1.15);}


/* balance-promise-sec */
.main .balance-promise-sec .inner {padding: 33.3333vw 5.5556vw 50vw;}
.main .balance-promise-sec .tit {margin-bottom: 27.7778vw;padding-left: 5.5556vw;}
.main .balance-promise-sec .tit .txtLine span {font-weight: 800;font-size: var(--title-type3);line-height: 7vw;}
.main .balance-promise-sec .desc {padding-left: 15.5556vw;}
.main .balance-promise-sec .desc strong {display: block;margin-bottom: 11.1111vw;overflow: hidden;}
.main .balance-promise-sec .desc strong .txtLine span {font-weight: 500;font-size:6.6667vw;line-height: 9.3333vw;letter-spacing: -0.02rem;}
.main .balance-promise-sec .desc > .txtLine.depth02 span {font-weight: 500;font-size: var(--basic-size);line-height: 6.2222vw;}

/* foundation01-sec */
.main .foundation01-sec .inner {position:relative;padding: 50vw 5.5556vw 100vw;}
.main .foundation01-sec .info-wrap {padding-left: 5.5556vw;}
.main .foundation01-sec .tit {margin-bottom: 6.6667vw;}
.main .foundation01-sec .tit .txtLine:nth-of-type(1) {margin-bottom: 1.1111vw;}
.main .foundation01-sec .tit .txtLine:nth-of-type(1) span {font-weight: 900;font-size: 10vw;line-height: 11vw;}
.main .foundation01-sec .tit .txtLine:nth-of-type(n+2) span {font-family: var(--poppins-fonts);font-weight: 700;font-size: 10vw;line-height: 12vw;}
.main .foundation01-sec .desc .txtLine span {font-weight: 500;font-size: var(--basic-size);line-height: 6.2222vw;}
.main .foundation01-sec .img-wrap {position:relative;transform: translate3d(0, 50%, 0);width: 63.3333vw;height: 111.1111vw;margin-top: 27.7778vw;overflow: hidden;opacity: 0;;z-index: 10;bottom:0}
.main .foundation01-sec .img-wrap.activeMotion {opacity: 1;transform: translate3d(0, 0, 0);transition: transform 1.2s ease .2s, opacity 1.2s ease .2s;}
.main .foundation01-sec .img-wrap.activeMotion img {transform: scale(1.2);transition: transform 1.5s linear .3s;}
.main .foundation01-sec .img-wrap img {position:relative;width: 100%;}
.main .foundation01-sec .circle {position: absolute;top: 177.1667vw;right: 15.1250vw;}
.main .foundation01-sec .circle svg {width: 2.9167vw;height: 2.9167vw;}
.main .foundation01-sec .circle02 {position: absolute;top: 102.6667vw;left: 56%;transform: translateX(-50%);z-index: -1;}
.main .foundation01-sec .circle02 svg {width: 141.6667vw;height: 115.6667vw;}
.main .foundation01-sec .circle02 path {stroke-dasharray: 3910;stroke-dashoffset: 3910;}
.main .foundation01-sec .circle02.activeMotion path {animation: stroke-ani-3 1.5s forwards .5s;}
.main .foundation01-sec .line {position: absolute;top: 178.555vw;left: 0;width: 0;height: 0.1667vw;background: linear-gradient(270deg, #000000 4.64%, rgba(0, 0, 0, 0.44) 98.49%);z-index: -1;}
.main .foundation01-sec .line.activeMotion {width: 100%;transition: width 1.5s ease .7s;}
@keyframes stroke-ani-3 {
    0% {
        stroke-dashoffset: 3910;
    }
    100% {
        stroke-dashoffset: 7820
    }
}

/* foundation02-sec */
.main .foundation02-sec {position: relative;overflow: hidden;}
.main .foundation02-sec .inner {display: flex;flex-direction: column;justify-content: center;height: 100vh;color: #fff;}
.main .foundation02-sec .bg {position:absolute;top:0;left:0;width:100%;height:100%;background: url(../images/main_challenge_bg.jpg) 100% 50% no-repeat;background-size: cover;z-index: -1;transition: transform 2s ease .3s;}
.main .foundation02-sec .bg.activeMotion {opacity: 1;transform: scale(1.2) translate3d(0, 0, 0);}
.main .foundation02-sec .tit {margin-bottom: 6.6667vw;padding-left: 5.5556vw;}
.main .foundation02-sec .tit .txtLine:nth-of-type(1) {margin-bottom: 1.1111vw;}
.main .foundation02-sec .tit .txtLine:nth-of-type(1) span {font-weight: 900;font-size: 10vw;line-height: 11vw;}
.main .foundation02-sec .tit .txtLine:nth-of-type(n+2) span {font-family: var(--poppins-fonts);font-weight: 700;font-size: 10vw;line-height: 13vw;}
.main .foundation02-sec .desc .txtLine span {padding-left: 5.5556vw;font-weight: 500;font-size: var(--basic-size);line-height: 6.2222vw;}

/* foundation03-sec */
.main .foundation03-sec .inner {padding: 111.11118vw 5.5556vw;}
.main .foundation03-sec .info-wrap {padding-left: 5.5556vw;}
.main .foundation03-sec .tit {margin-bottom: 6.6667vw;}
.main .foundation03-sec .tit .txtLine:nth-of-type(1) {margin-bottom: 1.1111vw;}
.main .foundation03-sec .tit .txtLine:nth-of-type(1) span {font-weight: 900;font-size: 10vw;line-height: 11vw;}
.main .foundation03-sec .tit .txtLine:nth-of-type(n+2) span {font-family: var(--poppins-fonts);font-weight: 700;font-size: 10vw;line-height: 13vw;}
.main .foundation03-sec .desc .txtLine span {font-weight: 500;font-size: var(--basic-size);line-height: 6.2222vw;}
.main .foundation03-sec .img-wrap {position: relative;display: flex;justify-content: flex-end;margin-top: 38.8889vw;min-height:33.8889vw;}
.main .foundation03-sec .img-wrap::before {content: '';position: absolute;top: 0;left: -5.5556vw;width: 16.9444vw;height: 33.8889vw;background: url(../images/main_circle01.svg) 50% 50% no-repeat;background-size: cover;opacity: 0;transform: translate3d(0, 50%, 0);}
.main .foundation03-sec .img-wrap.activeMotion::before {opacity: 1;transform: translateY(0);transition: transform 0.9s ease .3s, opacity 0.9s ease .3s;}
.main .foundation03-sec .img-wrap::after {content: '';position: absolute;top: 50%;right: -5.5556vw;transform: translateY(-50%);z-index: -1;width: 55.5556vw;height: 100vw;background: url(../images/main_confidence_img_linear.png) 50% 50% no-repeat;background-size: cover;opacity: 0;}
.main .foundation03-sec .img-wrap.activeMotion::after {opacity: 1;transition: opacity .8s ease .8s;}
.main .foundation03-sec .img-wrap > div {width: 33.8889vw;height: 33.8889vw;border-radius: 50%;}
.main .foundation03-sec .img-wrap > div.img {position: relative;right:-8.5vw;overflow: hidden;opacity: 0;transform: translate3d(0, 50%, 0);}
.main .foundation03-sec .img-wrap > div.img.activeMotion {opacity: 1;transform: translateY(0);transition: transform 0.8s ease .2s, opacity 0.8s ease .2s;}
.main .foundation03-sec .img-wrap > div.img.activeMotion img {transform: scale(1.2);transition: transform 1.5s linear .3s;}
.main .foundation03-sec .img-wrap > div.img img {position: relative;top: -1.6rem;right:0;width: 100%;}
.main .foundation03-sec .circle {position: absolute;top: 0;right: -8.5vw;display: flex;align-items: center;justify-content: center;width: 48.0556vw;height: 48.0556vw;opacity: 0;background: url(../images/main_circle_img.png) 50% 50% no-repeat;background-size: cover;}
.main .foundation03-sec .circle.activeMotion {opacity: 1;transform: translate3d(-29.1875vw, 0, 0);transition:transform 0.8s ease-out .7s, opacity 0.8s linear .7s;}
.main .foundation03-sec .circle .line svg {width: 48.0556vw;height: 48.0556vw;}
.main .foundation03-sec .circle line {stroke-dasharray: 343.4;stroke-dashoffset: 343.4;}
.main .foundation03-sec .circle line line:nth-of-type(2),.main .foundation03-sec .circle line line:nth-of-type(3) {stroke-dashoffset: 0;}
.main .foundation03-sec .circle.activeMotion line:nth-of-type(1) {animation: stroke-ani-1 .8s forwards ease 1.4s;}
.main .foundation03-sec .circle.activeMotion line:nth-of-type(2) {animation: stroke-ani-2 .8s forwards ease 1.4s;}
.main .foundation03-sec .circle.activeMotion line:nth-of-type(3) {animation: stroke-ani-2 .8s forwards ease 1.4s;}
.main .foundation03-sec .circle.activeMotion line:nth-of-type(4) {animation: stroke-ani-1 .8s forwards ease 1.4s;}
@keyframes circle-show-ani-1 { 
    100% {
        opacity: 1; 
    }
}
@keyframes stroke-ani-1 { 
    100% {
        stroke-dashoffset: 0; 
    }
}
@keyframes stroke-ani-2 { 
    0% {
        stroke-dashoffset: 343;
    }
    100% {
        stroke-dashoffset: 686;
    }
}

/* foundation04-sec */
.main .foundation04-sec {position: relative;overflow:hidden;}
.main .foundation04-sec .inner {display: flex;flex-direction: column;justify-content: center;height:100vh;color: #fff;}
.main .foundation04-sec .bg {position:absolute;top:0;left:0;width:100%;height:100%;background: url(../images/main_excellent_bg.jpg) 100% 50% no-repeat;background-size: cover;z-index: -1;transition: transform 2s ease .3s;}
.main .foundation04-sec .bg.activeMotion {opacity: 1;transform: scale(1.2) translate3d(0, 0, 0);}
.main .foundation04-sec .tit {margin-bottom: 6.6667vw;padding-left: 5.5556vw;}
.main .foundation04-sec .tit .txtLine:nth-of-type(1) {margin-bottom: 1.1111vw;}
.main .foundation04-sec .tit .txtLine:nth-of-type(1) span {font-weight: 900;font-size: 10vw;line-height: 11vw;}
.main .foundation04-sec .tit .txtLine:nth-of-type(n+2) span {font-family: var(--poppins-fonts);font-weight: 700;font-size: 10vw;line-height: 12vw;}
.main .foundation04-sec .desc .txtLine span {padding-left: 5.5556vw;font-weight: 500;font-size: var(--basic-size);line-height: 6.2222vw;}

/* brand-goal-sec */
.main .brand-goal-sec {position: relative;}
.main .brand-goal-sec .inner {padding: 127.7778vw 5.5556vw;}
.main .brand-goal-sec .text-area {position: relative;height: 34.7222vw;margin-bottom: 11.1111vw;padding-left: 5.5556vw;}
.main .brand-goal-sec .desc {position:absolute;top: 0.5556vw;width: 100%;opacity: 0;transition: opacity .6s ease;font-weight: 700;font-size: var(--title-type3);line-height: 7vw;letter-spacing: -0.01rem;}
.main .brand-goal-sec .desc:last-child {top: 8.0556vw;}
.main .brand-goal-sec .desc.active{opacity: 1;}
.main .brand-goal-sec .swiper-controller {position: relative;display: flex;align-items: center;justify-content: center;width: 35.5556vw;height: 6.6667vw;margin: 5.5556vw 11.1111vw 0 auto;}
.main .brand-goal-sec .swiper-controller button {position:absolute;top:50%;transform:translateY(-50%);width: 6.6667vw;height: 6.6667vw;padding:0;border:none;background-color: transparent;cursor: pointer;}
.main .brand-goal-sec .swiper-controller button svg {width: 100%;height: 100%;}
.main .brand-goal-sec .swiper-controller button.control-prev {left:0;}
.main .brand-goal-sec .swiper-controller button.swiper-button-disabled svg{opacity: .2;cursor: not-allowed;}
.main .brand-goal-sec .swiper-controller button.control-next {right: 0;}
.main .brand-goal-sec .swiper-controller button.control-next.disabled {pointer-events: none;}
.main .brand-goal-sec .swiper-controller button.control-next.disabled svg{opacity: .2;cursor: not-allowed;}
.main .brand-goal-sec .index-wrap {display: flex;align-items: center;}
.main .brand-goal-sec .index-wrap svg {width: 10vw;height: 0.2778vw;margin: 0 1.1111vw;}
.main .brand-goal-sec .index-wrap span {width: 2.7778vw;text-align: center;font-weight: 500;font-size: var(--small-size); line-height: 5.0556vw;letter-spacing: 0.06rem;}
.main .brand-goal-sec .brand-goal-swiper {position: static;min-height: 83.3333vw;}
.main .brand-goal-sec .swiper-wrapper {position: absolute;top: 173.6111vw;left: 5.5556vw;display: flex;height: 83.3333vw;padding-left: 5.5556vw;}
.main .brand-goal-sec .swiper-slide {position: relative;display: flex;width: 72.2222vw;height: 83.3333vw;margin-right: 5.5556vw;padding: 6.9444vw;border: 0.1667vw solid #000;box-sizing: border-box;background-color: #fff;transition: color .8s ease;}
.main .brand-goal-sec .swiper-slide::after {content: '';position: absolute;top:0;left:0;width: 100%;height: 100%;background: linear-gradient(7.03deg, #2A23BD -16.68%, #140F70 93.91%);opacity: 0;transition: opacity .3s ease;z-index: -1;}
.main .brand-goal-sec .swiper-slide h3 span {display: block;font-family: var(--poppins-fonts);font-weight: 700;font-size: 7.7778vw;line-height: 8.5556vw;}
.main .brand-goal-sec .swiper-slide .shapes {position: absolute;right: 6.6667vw;bottom: 6.6667vw;width: 21.6667vw; height: 21.6667vw;}
.main .brand-goal-sec .swiper-slide .shapes mask {width: 100%; height: 100%;}
.main .brand-goal-sec .swiper-slide.swiper-slide-active {border:none;color: #fff;}
.main .brand-goal-sec .swiper-slide.swiper-slide-active::after {opacity: 1;}
.main .brand-goal-sec .swiper-slide.swiper-slide-active .shapes path {transition: fill .3s ease;}
.main .brand-goal-sec .swiper-slide:nth-of-type(1).swiper-slide-active .shapes path {fill:#01C1D6;}
.main .brand-goal-sec .swiper-slide:nth-of-type(2).swiper-slide-active .shapes path {fill: #FFB617;}

/* related-info-sec */
.main .related-info-sec .inner {position:relative;margin-bottom: 16.6667vw;padding: 40.5556vw 5.5556vw;}
.main .related-info-sec .cont-box {padding-top: 8.3333vw;padding-left: 5.5556vw;}
.main .related-info-sec .cont-box:nth-of-type(n+2) {margin-top: 16.6667vw;}
.main .related-info-sec .cont-box a {display: flex;justify-content: space-between;width:100%;color:#000;}
.main .related-info-sec .cont-box .desc {font-weight: 400;font-size: var(--small-size);line-height: 5.4444vw;}
.main .related-info-sec .cont-box h3 {position:relative;display: inline-block;margin-bottom: 3.3333vw;}
.main .related-info-sec .cont-box.recruit h3 {font-weight: 900;font-size: 7.7778vw;line-height: 10.1111vw;letter-spacing: 0.06rem;}
.main .related-info-sec .cont-box.contact h3 {font-family: var(--poppins-fonts);font-weight: 700;font-size: 7.7778vw;line-height: 10.1111vw;}
.main .related-info-sec .cont-box .ico-arrow-area {position:relative;display: inline-block;width: 8.8889vw;height: 8.8889vw;margin-left: 2.3438vw;overflow: hidden;}
.main .related-info-sec .cont-box .ico-arrow {position: relative;width:100%;height:100%;transition: transform .6s ease;}
.main .related-info-sec .cont-box .ico-arrow.hover{left: -100%;}
.main .related-info-sec .cont-box .ico-arrow-area img {width: 100%;}
.main .related-info-sec .line {position: absolute;top: 40.5556vw;left: 11.1111vw;width: 150%;height: 0.1667vw;background-color:#191919;}
.main .related-info-sec .line.line02 {top: 95.2778vw;}
.main .related-info-sec .bg {width: 100%;height: 120vw;background: url(../images/main_bhr_quote_bg.jpg) 50% 50% no-repeat;background-size: cover;}

/* footer-sec */
/* .main .footer-sec .inner {padding: 55.5556 49.7222vw 0;} */

/* fixed-controls-wrap */
.main .indicator-group {position: fixed;top: auto;bottom: 27.7778vw;right: 9.7222vw;display: flex;flex-direction: column;z-index: 300;}
.main .indicator-group .dot {width: 2.2222vw;height: 2.2222vw;margin-bottom: 1.1111vw;padding: 0;border: 0.2778vw solid #000;border-radius: 50%;box-sizing: border-box;opacity: 0.3;background-color: transparent;cursor: pointer;}
.main .indicator-group .dot.active {opacity: 1;background-color: #000;}
.main .sec-move-btn {position: fixed;right: 5.5556vw;bottom: 11.1111vw;z-index: 300;}
.main .sec-move-btn.up button {transform: rotate(0);}
.main .sec-move-btn button {transform: rotate(-180deg);width: 11.1111vw;height: 11.1111vw;padding:0;border: 1px solid #000;border-radius: 50%;background-color: transparent;background:url(../images/icon/arrow_top.png) 50% 50% no-repeat;background-size: cover;cursor: pointer;}


