body{min-width:calc(1300px + 180px);overflow-y: auto;position: relative;}  
#ct{padding-top: 0;padding-bottom: 102px;}  
.index #ct{padding-bottom: 0;}

.mt-10{margin-top: 100px !important;}
.mt-8{margin-top: 80px !important;}
.h6.v2{font-size:1.625rem;} /* 26px */ 
.f-sm{font-size:0.875rem;} /* 14px */ 
.tit.v2{font-weight: 400;color: inherit;}

.icon-youtube{ width:45px;height: 35px;}
.icon-blog{ width: 35px;height: 35px;}
.icon-life{ width: 35px;height: 35px;}
.icon-Ntv {width: 35px;height: 35px;}

#hd{position: sticky; position: -webkit-sticky;}
#hd #top{position: absolute;width: 100%;min-width:calc(1300px + 180px); padding:15px 28px;}
@media screen and (max-width:1720px){ 
    #hd #top{ padding:15px 5px}
    #hd .form-srch{display: none !important;}
}

#hd #top h1{position: relative;}
#hd #top>*{z-index: 5;}
#hd::before{content: "";position: absolute; background: #fff;width: 100%;height:437px;top: calc(100% + 1px);left: 0;border-bottom:1px solid #E0E0E0 ;transition: 0.3s;opacity: 0;pointer-events: none;}
#gnb {background-color: #fff;padding:0 180px;box-sizing: content-box;}
@media screen and (max-width:1660px){ 
    #gnb {padding:0 0 0 180px;}
}
#gnb .dep2{position: absolute;left:50%;transform: translateX(-50%);padding-top: 15px;opacity: 0;pointer-events: none;transition: 0.3s;min-width: calc(100% + 2px);height:473px} 
#gnb .dep2 li a{display: inline-block;text-align: center;word-break: keep-all;white-space: nowrap; color: #525252;font-size: 14px;font-weight: 300;padding: 0.5em 0;}

.mn-open #hd::before,
.mn-open #gnb .dep2{opacity: 1;pointer-events: all;}

#gnb ul li:hover>a , #gnb .dep2 li a:hover , #gnb li.active>a{color:#F88125 !important ;}

#hd .form-srch{display: flex;justify-content: space-between;position: absolute;top:23px; right: 0; border:1px solid transparent;width: 220px; border-radius: 50px;padding:0 16px;}
#hd .form-srch:hover {border-color:#E0E0E0 ;}
#hd .form-srch:hover input{opacity: 1;pointer-events: all;}
#hd .mo-menu{display: none;}
.form-check {margin-right: 2rem;}

#gnb>ul{display: flex; width:100%;justify-content: space-between;}
#gnb>ul>li{    flex: auto;position: relative;font-size: 18px; text-align: center;}  

#ft>.wrap{display: flex;} 
#ft>.wrap>div:nth-child(2){flex: 1; padding: 0 40px;font-size: 14px;}
#ft>.wrap>div:last-child{width: 220px;}
#ft .logo{width: 180px;height: 45px;} 
.familysite .dropdown-menu{margin-bottom: 10px;}

#chatbot.active .chatbot-frame{width: 450px;height:700px ;max-height:calc( 100vh - 200px);}
/* modal */
.modal-dialog {max-width: 670px;}
.modal-body{padding: 40px;}

#indexModal .modal-body{padding: 0 !important;}
#indexModal .modal-dialog {max-width: 560px;}

/*================== index ==================*/ 
 
.index-container{width: 100%;overflow: hidden; margin-top: -80px;} 
.index-container #linecanvas{min-width: 1300px;}
.sc-full{position: absolute ;height: calc(100vh - 80px);width: 100%; }
.sect-content:not(.normal):before{content: ""; min-height:  calc(100vh - 80px); }
.sect-content {position: relative;display: flex;align-items: center;justify-content: center;text-align: center;width: 100%;padding-top: 80px; overflow: hidden;} 
.sect-content+.sect-content {position: absolute ;}
.index-container .disable{opacity: 0;pointer-events: none;transition: 1s;}
.index-container .disable.active{opacity: 1;pointer-events: all;}
.index-container .bottom{top:100% !important}

.sect-content.normal { padding-top: 0;max-height: none} 
.sect-content+.sect-content{top: 0;}

#indexSect-1{}
#indexSect-1 h2{font-size: 60px;color: #000;}
#indexSect-1 h2+p{padding: 1rem 0 60px;}
#indexSect-1 .sect-content video{width: 100%;height: 100%;object-fit: cover;object-position: left center; }
#indexSect-1 .sect-content .desc{color: #fff;text-align: left;transition:opacity 1s;position: absolute;width: 100%; max-width: 1300px;top:50%;transform: translateY(calc(-50% + 90px));}
#indexSect-1 .sect-content .desc .dt{font-size: 120px;line-height: 1;font-weight: 700;padding-bottom: 20px;}
#indexSect-1 .sect-content .desc .dd {font-size: 20px;}
#indexSect-1 .cont1 .bg-linemoving p{position: absolute;bottom:0;left:50%;padding-bottom: 45px;transform: translateX(-50%);animation: btn-over 2s infinite;}
#indexSect-1 .cont1 .bg-linemoving p::before{content: "";position: absolute;width: 1px;height: 36px;background-color: #343A40;bottom:0;left:50%;}

#indexSect-1 [class^=bg-deep]>div{position: relative;max-width: 1920px;height: 100%;margin:0 auto;}
#indexSect-1 [class^=bg-deep]>div>p{position: absolute;transform: scale(0);}
#indexSect-1 .cont3 video{object-position:center 85%}
#indexSect-1 .cont4 video{object-position:center top}
#indexSect-1 .cont5 video{object-position:center center}

#indexSect-1 .bg-deepVision{position: absolute;top: 50%;left: 50%;width: 0px;height: 0px; } 
.bg-deepVision p[class^=p]{width: 330px;height: 615px; border:3px solid #F48120}
.bg-deepVision p[class^=p] span{position: absolute;background-color: #F48120;color:#fff;font-size: 10px;padding:0 5px;bottom:100%;left:-3px}
.bg-deepVision p[class^=n]{width: 143px;height: 143px; border:3px solid #6156FF}
.bg-deepVision p[class^=n] span{position: absolute;background-color: #6156FF;color:#fff;font-size: 10px;padding:0 5px;bottom:100%;left:-3px}
.bg-deepVision .p1{top:19%;left:calc(50% - 188px)}
.bg-deepVision .p2{top:7%;left:calc(50% + 73px)}
.bg-deepVision .p3{top:23%;left:calc(50% + 500px)}
.bg-deepVision .n1{top:26%;left:calc(50% - 33px)}
.bg-deepVision .n2{top:15%;left:calc(50% + 171px)}
.bg-deepVision .n3{top:28%;left:calc(50% + 600px)}

.bg-deepSpeech{position: absolute; width: 100%;height: 100%;  }  
.bg-deepSpeech p[class^=p] span{position: absolute; color:#fff;font-size: 10px;padding:0 5px;bottom:100%;left:-3px}
.bg-deepSpeech .p1{width: 228px;height: 250px; top:16%;left:calc(50% - 482px) ;border:3px solid #F48120}
.bg-deepSpeech .p1>span{background: #F48120;}
.bg-deepSpeech .p2{width: 330px;height: 486px; top:8%;left:calc(50% - 230px) ;border:3px solid #6156FF}
.bg-deepSpeech .p2>span{background: #6156FF;}
.bg-deepSpeech .p3{width: 238px;height: 270px; top:27%;left:calc(50% + 122px) ;border:3px solid #FF5656}
.bg-deepSpeech .p3>span{background: #FF5656;}
.bg-deepSpeech .p4{width: 330px;height: 322px; top:41%;left:calc(50% + 488px) ;border:3px solid #D356FF}
.bg-deepSpeech .p4>span{background: #D356FF;}

.bg-deepText{position: absolute; width: 100%;height: 100%; }  
.bg-deepText p[class^=p] span{position: absolute; color:#fff;font-size: 10px;padding:0 5px;bottom:100%;left:-3px}
.bg-deepText .p1{min-width: 310px; height: 90px;border:3px solid #F48120}
.bg-deepText .p1>span{background: #F48120;}
.bg-deepText .p2{min-width: 120px; height: 90px;border:3px solid #6156FF}
.bg-deepText .p2>span{background: #6156FF;}
.bg-deepText .p3{min-width: 180px; height: 90px; ;border:3px solid #D356FF}
.bg-deepText .p3>span{background: #D356FF;}

#indexSect-2 .cont1>div{padding:187px 0;font-size: 36px;}
#indexSect-3{background: #050E26;}
#indexSect-3 h3{color:#fff;font-size: 52px;line-height:1;}
#indexSect-3 h3 small{display: block; font-size:18px;color: #ADB5BD;font-weight: 600;}
#indexSect-3 h3+p{font-size: 24px; color: #CED4DA;margin-top: 37px; margin-bottom: 100px;font-weight: 200;}
#indexSect-3 .cont3 dt{font-size: 24px;color:#fff !important;font-weight: 600;}
#indexSect-3 .cont3 dd{color: #CED4DA;padding-top: 40px;}

#indexSect-4{padding:130px 0;text-align: center;}
#indexSect-4 h2{font-size: 80px;line-height: 1;}
#indexSect-4 h2 small{display: block; font-size: 20px;font-weight: 600;color: #ADB5BD;}
#indexSect-4 h2+p{padding-top: 30px;}
#indexSect-4 div.row>div{padding-top: 90px;font-size: 18px;font-weight: 700;}
#indexSect-4 div.row>div p{padding-top: 20px;}  
#indexSect-4 .col.last p{font-size: 20px;font-weight:700;text-align: right; color: #FFA723; }

#indexSect-5{background: #F8F9FA;padding-top: 90px;overflow-y: visible;height:590px;margin-bottom: 130px;}
#indexSect-5 h2{font-size:52px;line-height: 1; background: url(../img/main/graphic.png) no-repeat right top/auto 100%;margin-bottom: 60px;}
#indexSect-5 h2 small{display: block; font-size: 20px;font-weight: 600;color: #ADB5BD;margin-bottom: 1rem;} 
#indexSect-5 dt{font-size: 18px;}
#indexSect-5 dd{padding-top: 120px;}
#indexSect-5 .bx-shadow{padding: 30px 35px;}

#indexSect-6 {padding : 130px 0;}
#indexSect-6 h2{font-size: 80px;line-height: 1;text-align: center;margin-bottom: 60px;}
#indexSect-6 h2 small{display: block; font-size: 18px;font-weight: 600;color: #ADB5BD;}

#indexSect-7 {background: transparent linear-gradient(98deg, #FFA723 0%, #FF6600 100%) 0% 0% no-repeat padding-box;height: 367px;overflow: hidden;color: #fff;}
#indexSect-7 canvas{filter: brightness(100);opacity: 0.5;}
#indexSect-7 h2{font-size: 52px;}
#indexSect-7 h2+p{margin-bottom: 40px;}
#indexSect-7 .btn{border:1px solid rgba(255,255,255, 0.6) !important}
#indexSect-7 .btn::after{background: transparent;}

.rred{border:1px solid red ;}
/*================== sub ==================*/  
.search-mo{text-align: center; padding-top: 90px;}
/* company */ 
.sect-div.CEO{margin-top: 80px;}
.sect-div.CEO h6{width: 290px;}
.core-tech .bg-lg{padding:30px;margin : 40px 0; height: calc(100% - 40px);}
.core-tech .row img{ height:176px}
.core-tech .row .row div:last-child{text-align: right;}
.core-tech dd{height: 6em;}
.appliance-swiper>div{display: flex;flex-wrap: wrap;margin-left: -15px;margin-right: -15px;}
.appliance-swiper .swiper-slide{margin-top: 40px;width: 20% !important;}
.appliance-swiper .swiper-slide img{width: 78px;}
.appliance-swiper .swiper-slide div{padding: 50px 0 30px;height:224px;width: 224px; margin: 0 auto;}
.company .service::before{font-size: 160px;}
.company .service::after{font-size: 160px;}
.history .overview{position: relative;}
.history .overview::before{content: "AI Business Leader \A Konan Technology";white-space:pre; position: absolute;left: 0;bottom: -2rem ;color: #fff;font-size: 160px; font-weight: 700;line-height: 1;}
.history-swiper::before{content: "";position: absolute; top: 0;left: 0;width: calc(100vw - ((100vw - 1300px) / 2));height: 3px;background-color: #E9ECEF ;}

.Introduction {background:#050E26;margin-top: 150px;padding-top: 80px;}
.Introduction .sect-content{padding-top: 0;}
.Introduction .main-text{font-weight: 700;color: #fff;font-size: 82px;line-height: 1;z-index: 2;}

.Introduction .sc-full p:nth-child(1).active{top: 3%; left: 66%;}
.Introduction .sc-full p:nth-child(2).active{top: 17%; left: 24%;}
.Introduction .sc-full p:nth-child(3).active{ top:10%; left: 3%;}
.Introduction .sc-full p:nth-child(4).active{top: 58%; left: 6%;}
.Introduction .sc-full p:nth-child(5).active{top: 5%; left: 14%;}
.Introduction .sc-full p:nth-child(6).active{top: 14%; left: 56%;}
.Introduction .sc-full p:nth-child(7).active{top: 38%; left: 73%;}
.Introduction .sc-full p:nth-child(8).active{top: 69%; left: 55%;}
.Introduction .sc-full p:nth-child(9).active{top: 70%; left: 28%;}
.Introduction .sc-full p:nth-child(10).active{top: 65%;left: 40%;}

.Introduction .intro-desc{color: #fff;text-align: center;padding-top: 100px;font-size: 24px;font-weight: 200;}
.Introduction .intro-desc p{padding: 130px 0;font-size: 42px;font-weight: 400;}
.ci .row.logos>div{margin-bottom: 60px;}
.bi .row p{margin-bottom: 10px;}

/* customer */
.customer .contact th{width: 200px;}
.form-agreement{font-size: 18px}
.form-agreement a{display: inline-block;margin-left: 2rem;text-decoration: underline !important;}
.contact-info {padding-left: calc(25px + 0.5rem);padding-top: 0.5rem;font-size: 1rem;}
.contact .text-alert{text-align: right;}

.schedule-table table th{height: 88px;}
.schedule-table table td{height: 120px;padding: 20px;}
.customer .information table tr>*:first-child{width: 220px;}
#customerFaq .card-header{display: flex;align-items: center; }
#customerFaq .card-header p.qa-cate{width: 160px;}
.customer  .partners .row>div{display: flex;justify-content: center;align-items: center; min-height: 200px;}

/* news */
.news-view .tit{padding-right: 3rem;}
.news-view .video-size{width: 1000px ;height: 560px;;}
.gallery-list .cont-bx{position: relative;min-height: 252px;}
.gallery-list .viewmore{position: absolute;bottom: 0;width: 100%;}

/* deepvision */ 
.deep-benefits hr{margin: 30px 0;}
.deep-benefits .row>div:first-child{flex:1;padding-right: 3.125rem;align-self: center;}
[class^=deep-]  .diagram{position: relative; margin-top: 6.5rem;margin-bottom: 6.5rem; ;padding:60px 0}
[class^=deep-]  .diagram ul{display: flex;flex-wrap: wrap; position: absolute;top: 0;left: 0; width: 100%; }
[class^=deep-]  .diagram ul li{display: flex;width: 50%;align-items: center;}
[class^=deep-]  .diagram ul li>img{width: 84px;height: 97px;margin:0 30px}
[class^=deep-]  .diagram ul li>p{max-width:280px ;color: #495057;}
[class^=deep-]  .diagram ul.v2 li>p{max-width:310px ;color: #495057;}
[class^=deep-]  .diagram ul li:nth-child(odd){flex-direction: row-reverse;text-align: right;padding-right: 120px;}
[class^=deep-]  .diagram ul li:nth-child(even){padding-left: 120px;}
[class^=deep-]  .diagram ul li:nth-child(3){margin:160px 0;padding-right: 250px;}
[class^=deep-]  .diagram ul li:nth-child(4){margin:160px 0;padding-left: 250px;} 
.masonry-grid .grid-item{width: 33.3%;padding:0 15px}
.masonry-grid .grid-item .bx-shadow .obj{padding: 7.8rem 0 1rem;}

/* deeptext */ 
.deeptext .gate .bx-shadow{max-width: 400px;margin:0 auto;}
/* .ksm-feafure>.row>div:first-child{padding-right: 2rem;} */

/* rnd */
.rnd .effect .st{font-size: 1.25rem;width: 240px; }
.rnd .library::before{content:"Easy,Simple \A K-language" ;color:#fff;font-size: 160px;position: absolute;top: 0;right: 0;line-height: 1;white-space:pre; font-weight: 700;margin-top: -1rem;}
.rnd .exp-effect .h6{font-size: 1.625rem; padding-top: 2rem;}
.rnd .exp-effect .h6+p{font-size: 1.25rem;}  
.rnd .rbx{width: 310px;height: 310px;}
.rnd .rbx p{font-size: 1.5rem; } 

/* certification */
.gssp.overview .graph>.bars{height :calc( 100%  - 28px);padding-right: 18px;overflow: hidden;}
.gssp.overview .graph>.bars p{padding:0 14.5px 0 15px;}
.gssp-docs{padding:78px 0;margin-top: 0.5rem;position: relative;}
.gssp-docs>*{position: relative;}
.gssp-docs::before{content:"SP certification";color:#fff;font-size: 160px;position: absolute;bottom: -2rem;right: 0;line-height: 1;white-space:pre; font-weight: 700; }
.gssp-docs.v2::before{content: "Direct production";}

/* recruit */  
.recruit>.process li>div{margin-top: 1.25rem;font-size: 1.125rem;}
.recruit>.process li:not(:last-child)>div{margin-right: 35px;}
.recruit .HR .st{font-size: 1.25rem;width: 240px; } 
.recruit .chart-flow .row{position: relative;}
.recruit .chart-flow .row::before{content: "";position: absolute;top: 4rem;left:164px; width: calc(100% - (164px * 2));height:1px;background-color: #DEE2E6;z-index: -1;}
.recruit .chart-flow [class^=col-]{position: relative;}
.recruit .chart-flow [class^=col-]::before{content: "";position: absolute;top: 4rem;left:50%; width: 1px;height: calc(100% - 4rem - 2rem);background-color: #DEE2E6;z-index: -1;}
.recruit .chart-flow [class^=col-]:first-child:before{height: calc(100% - 10rem - 2rem);;}
.recruit .chart-flow [class^=col-]:nth-child(2)::before{top: 0rem;left:50%; width: 1px;height: calc(100% - 0rem - 2rem)}
.welfare dl{display: flex;flex-direction: column; margin-bottom: 5rem; min-height: 270px;}
.welfare dd {flex: 1;}
.welfare dd i{position: absolute;bottom: 1rem;right: 0;}

/* @media screen and (max-width:1300px){ 
	#hd{width: calc(1300px - 20px);}
} */

@keyframes fadeInUp{
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,50%,0);
        transform: translate3d(0,50%,0);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

/* *****************************
	* 231129 GS 추가 css
***************************** */
.header-util-box{position: absolute; top:24px; right: 30px; display: flex; align-items: center;}
/* Header :: 언어선택 */
.header-util-box .header-lang-list{padding-right: 13px;}
.header-util-box .header-lang-list ul{display: flex; flex-wrap:wrap; align-items: center;}
.header-util-box .header-lang-list li{font-size:13px; letter-spacing:-0.5px; font-weight:400; color:#000; margin-left:13px;}
.header-util-box .header-lang-list li:first-child{margin-left:0}
.header-util-box .header-lang-list li a{display:block; position:relative; opacity:0.4; color:#000; transition:all 0.4s ease-in-out;}
.header-util-box .header-lang-list li a:after{
	position:absolute; bottom:-6px; left:-2px; right:-2px; 
	height:2px; 
	background-color:#f08200; 
	content:""; 
	transform:scaleX(0); 
	transition: all 0.4s ease-in-out;
	transition-property: transform;
	transform-origin:100% 0;
}
.header-util-box .header-lang-list li.cur a,
.header-util-box .header-lang-list li a:hover{color: #f08200; opacity:1.0;}
.header-util-box .header-lang-list li.cur a:after,
.header-util-box .header-lang-list li a:hover:after{transform:scaleX(1); transform-origin:0 0;}
/* 검색창 */
#hd .header-util-box .form-srch{padding: 0; padding-left: 10px; position: static; width: auto; border: 0;}
#hd .form-srch input {display: none;}
#hd .form-srch button i{position: relative; top: 4px; font-size: 24px; color: #000;}

@media screen and (max-width:1720px){ 
    #hd .form-srch{display: block !important;}
}
@media screen and (max-width:1660px){ 
    #gnb {padding: 0; padding-left: 40px; width: calc(100% - 365px) !important;}
}
@media screen and (max-width: 991px){   
	.header-util-box {top: 15px; right: 60px; align-items: center;}
	#hd .header-util-box .form-srch {margin-top: 0; position: static;}
	#gnb {padding: 0; width: 100% !important;}
}