/*전체 레이아웃*/
#conWrap{width:100%; margin:0 auto; background-color:#fff; }
#conWrap02{width:1280px; margin:0 auto; background-color:#f8f8f8;}
#contents{width:auto; margin:150px auto 0; overflow:hidden;}
#contentTop{width:100%; margin:0 auto; position:relative; }
.desktop{display:block;}
.tablet{display:none;}
.mobile{display:none;}

/* visual */
.visual{width:100%; position:relative; left:0; top:24px; overflow:hidden; margin:0 auto;}/*width:659px; height:259px; float:left; 수정*/
.visual .pic{width:100%; height:350px; }
.visual .pic ul{}
.visual .pic ul li{height:350px; position:absolute; top:0; left:-100%; width:100%; text-indent:-9999px;}
.visual .pic ul li.ch{left:0;}
.visual .pic ul li a img {width:100%; height:auto;}
/* .visual .pic ul li:nth-child(1){background:url("/img/main/visual01.jpg") no-repeat center bottom; }
.visual .pic ul li:nth-child(2){background:url("/img/main/visual01.jpg") no-repeat center bottom; }
.visual .pic ul li:nth-child(3){background:url("/img/main/visual01.jpg") no-repeat center bottom; } */
.visual .pic ul li a img{display:block; position:absolute; left:0; width:100%; height:auto; margin:0 auto; }

.visual .btn {position:absolute; left:140px; top:60px; width:120px; text-align:left; z-index:30;}
.visual .btn div{display:inline-block;text-indent:-9999px;width:14px;height:14px; background:url("/img/main/visualBtn_off.png") no-repeat; margin:0 3px; cursor:pointer;}
.visual .btn div.ch{width:14px;height:14px; background:url("/img/main/visualBtn_on.png") center no-repeat;}
.visual .btn div span{display:block;width:100%;height:100%;}
.visual .btn a{margin:0 4px; cursor:pointer;display:inline-block; width:9px; height:9px;}
.visual .btn .gogo{background:url("/img/main/visualBtn_play.png") center no-repeat; width:12px; height:13px;}
.visual .btn .stop{background:url("/img/main/visualBtn_stop.png") center no-repeat; width:12px; height:13px;}
.visual .btn *{vertical-align:middle;}

.visual .dir{}
.visual .dir div{cursor:pointer;position:absolute;left:50%;top:190px;width:23px;height:36px;}
.visual .dir span{display:block;text-indent:-9999px;width:100%;height:100%;}
.visual .prev{background:url("/img/main/btn_prev.png") no-repeat; margin-left:-467px;}
.visual .next{background:url("/img/main/btn_next.png") no-repeat; margin-left:445px;}



/* partner 파트너기업 슬라이드배너 */
.partner{height:80px;position:relative;overflow:hidden; width: 450px;float: left; margin-bottom:20px;}
.partner .pic{}
.partner .pic ul{}
.partner .pic ul li{height:80px;position:absolute;top:0;left:-100%;width:100%;}
.partner .pic ul li.ch{left:0;}
/* .visual .pic ul li:nth-child(1){background:url("/img/main/visual01.jpg") no-repeat center bottom; }
.visual .pic ul li:nth-child(2){background:url("/img/main/visual01.jpg") no-repeat center bottom; }
.visual .pic ul li:nth-child(3){background:url("/img/main/visual01.jpg") no-repeat center bottom; } */
.partner .pic ul li .bottom{position: absolute;display:block; color:#424242; font-size: 12px; line-height: 20px;}

.partner .btn{position:absolute;left:12px;top:15px;width:100%;text-align:left;z-index:30;}
.partner .btn div{display:inline-block;text-indent:-9999px;width:9px;height:9px;background:url("/img/main/on.png") no-repeat;margin:0 4px;cursor:pointer;}
.partner .btn div.ch{width:9px;height:9px; background:url("/img/main/off.png") center no-repeat;}
.partner .btn div span{display:block;width:100%;height:100%;}
.partner .btn a {margin:0 4px; cursor:pointer; display:inline-block; width:9px; height:9px; display:none;}
.partner .btn .gogo{background:url("/img/main/visual_play.png") center no-repeat;}
.partner .btn .stop{background:url("/img/main/visual_stop.png") center no-repeat;}
.partner .btn *{vertical-align:middle;}

.partner .dir{}
.partner .dir div{cursor:pointer;position:absolute;left:50%;top:190px;width:23px;height:36px;}
.partner .dir span{display:block;text-indent:-9999px;width:100%;height:100%;}
.partner .prev{background:url("/img/main/btn_prev.png") no-repeat;margin-left:-467px;}
.partner .next{background:url("/img/main/btn_next.png") no-repeat;margin-left:445px;}

.quickBanner{position:absolute; left:50%; top:107%; transform:translate(-50%,-50%); overflow:hidden;  width:1000px; height:162px; margin:0 auto; background:#fff; border-radius:30px; box-shadow:0px 0px 30px gray;}
.quickBanner ul {display:block;width:980px;height:162px;margin:0 auto;}
.quickBanner ul li {margin:25px 10px;width:70px;font-weight:600;}
.quickBanner ul li a{color:#3d3d3d; display:inline-block; padding-top:75px; text-align:center; width:120%; line-height:18px;}
.quickBanner ul li.quickBanner01 a{background: url("/img/main/icon01.png") center top no-repeat;}
.quickBanner ul li.quickBanner02 a{background: url("/img/main/icon02.png") center top no-repeat;}
.quickBanner ul li.quickBanner03 a{background: url("/img/main/icon03.png") center top no-repeat;}
.quickBanner ul li.quickBanner04 a{background: url("/img/main/icon04.png") center top no-repeat;}
.quickBanner ul li.quickBanner05 a{background: url("/img/main/icon05.png") center top no-repeat;}
.quickBanner ul li.quickBanner06 a{background: url("/img/main/icon06.png") center top no-repeat;}
.quickBanner ul li.quickBanner07 a {background: url(/img/main/icon07.png) center top no-repeat;}
.quickBanner ul li:hover a{color:#0055bb;font-weight: 600;}
.quickBanner ul li.quickBanner01 a:hover{background: url("/img/main/icon01_on.png") center top no-repeat;}
.quickBanner ul li.quickBanner02 a:hover{background: url("/img/main/icon02_on.png") center top no-repeat;}
.quickBanner ul li.quickBanner03 a:hover{background: url("/img/main/icon03_on.png") center top no-repeat;}
.quickBanner ul li.quickBanner04 a:hover{background: url("/img/main/icon04_on.png") center top no-repeat;}
.quickBanner ul li.quickBanner05 a:hover{background: url("/img/main/icon05_on.png") center top no-repeat;}
.quickBanner ul li.quickBanner06 a:hover{background: url("/img/main/icon06_on.png") center top no-repeat;}
.quickBanner ul li.quickBanner07 a:hover{background: url("/img/main/icon07_on.png") center top no-repeat;}

/* infoTab 인력지원,파트너기업,개방형실험실 */
.infoTab{float: left; overflow: hidden; width: 659px; margin:0 11px 10px 0;}
.infoTab #tabs{margin:0 auto; height:50px;}
.infoTab #tabs li{ background-color:#454545; margin-left:1px; float:left; width:219px; height: 50px;}
.infoTab #tabs li:first-child{margin: 0;}
.infoTab #tabs li a{width: 100%; line-height: 50px; display:inline-block; color:#fff; text-align: center; font-size: 14px; font-weight:600;}
.infoTab #tabs li a.active{background-color:#0055bb no-repeat center bottom; }
 a.active{background-color:#0055bb; }
.infoTab #tabBox{width: 623px;height: 177px;padding:12px 16px 11px 20px; background-color:#fff; }
.infoTab #tabBox div > p{color:#0055bb; font-weight: 600; line-height: 31px;}
.infoTab #tabBox div .btn{float: right;min-width: 49px; height: 31px; background-color: #454545; color:#fff; text-align: center; display: inline-block; margin-right: 4px; padding: 0 15px; font-size:13px;}
.infoTab #tabBox div .con{float: left ;width: 457px; margin-top: 9px;}
.infoTab #tabBox div .img{float: left; width: 149px; height: 137px; margin-right: 17px; margin-top: 9px;}
.infoTab #tabBox div .img img{width: 149px; height: 137px; }
.infoTab #tabBox .infoTab01 .con .top {background: url("/img/main/infoTab01.png") no-repeat left center;}
.infoTab #tabBox .infoTab02 .con .top {background: url("/img/main/infoTab01.png") no-repeat left center;}
.infoTab #tabBox .infoTab03 .con .top {background: url("/img/main/infoTab03.png") no-repeat left center;}
.infoTab #tabBox div .con .top{height: 34px; padding:10px 0 20px 55px;}
.infoTab #tabBox div .con .top p{color:#494949; font-weight: 600; font-size: 13px; line-height: 22px;max-height:54px;display:block;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}
.infoTab #tabBox div .con .top p .point{color:#e25545;}
.infoTab #tabBox div .con .bottom{height: 67px; background-color:#f4f4f4; padding:3px 10px; position: relative;}
.infoTab #tabBox div .con .bottom ul li{color:#424242; font-size: 12px; line-height: 20px;}
.infoTab #tabBox div .con .bottom ul li strong{color:#5b5c5c; width: 72px; display: inline-block;}
.infoTab #tabBox div .con .bottom .btn{position: absolute; bottom: 10px; right: 4px; line-height: 31px; font-size:13px;}

.infoTab #tabBox div.infoTab03 .con .bottom{padding: 0; background-color: #fff}
.infoTab #tabBox div .con .bottom dl dt{color:#0660a3; font-size: 13px; font-weight: 600; width: 111px;float: left; text-align: center; margin-right:2px; display: inline-block; height: 35px; margin-bottom: 3px; background-color: #f4f4f4;line-height: 35px;}
.infoTab #tabBox div .con .bottom dl dd{float: left;width: 334px; color:#4d4d4d; font-size: 12px; padding-left: 10px; display: inline-block; height: 35px;margin-bottom: 3px; background-color: #f4f4f4;line-height: 35px;}
.infoTab #tabBox > div{display: none;} /*숨김*/
.infoTab #tabBox > div.active{display: block;}

/* pLink KITECH 자료안내 */
.pLink{float:left; width:330px; margin-bottom:10px; background-color:#218fe5;}
.pLink .top{height:50px; text-align:center;}
.pLink .top p{color:#fff; font-size:19px; font-weight:bold; line-height:50px;}
.pLink ul li{border-bottom: 1px solid #e7e7e7; height:66px;}
.pLink ul li dl {display:block; width:296px; margin:0 auto; padding:11px 0;}
.pLink ul li dl dt a{width:296px; color:#fff; font-size:14px; font-weight:bold; background: url("/img/main/btn_pLink.png") no-repeat right; display:inline-block;}
.pLink ul li dl dd{color:#fff; font-size:13px; font-weight:bold;}
.pLink ul li:nth-child(3){border: 0}

/* bbs 공지사항,사업안내 */
.bbs{width:1000px; overflow:hidden; height:160px; }
.bbs > div{float:left; width:492px; height:170px; background-color:#fff;  border:1px solid #f4f4f4;}
.bbs > div.bbs02{margin-right:10px;}
.bbs:first-child(2) > div{margin: 0;}
.bbs > div > p {height:50px; line-height: 42px; padding-left:11px; color:#232323; font-size: 15px; font-weight:bold;}
.bbs > div > p a{display:inline-block; float:right; margin-right:11px; width:12px; height:12px;}
.bbs > div > ul li{padding:0 10px; height:34px; border-bottom: 1px solid #e7e7e7; margin:0 auto;}
.bbs > div > ul li a{color:#242424; line-height:32px; font-size: 12px; width:230px; overflow:hidden; text-overflow:ellipsis;white-space:nowrap;word-wrap:normal; display: inline-block;}
.bbs > div > ul li a:hover{color:#0055bb; text-decoration: underline;}
.bbs > div > ul li span{display: inline-block; float:right; color:#919191; line-height: 32px}
.bbs > div > ul li:nth-child(3){border-bottom: 0;}

.banner{float: left; width: 323px; height: 182px;}
.banner ul li{width: 158px; height: 104px; float: left;}
.banner ul li dl dt{font-size: 18px; color:#fff;}
.banner ul li dl dd{font-size: 12px; color:#fff;}
.banner .banner01{margin-right: 7px;}
.banner .banner02{background: url("/img/main/banner02.png") #fff no-repeat right 97px;}


/* banner 하단배너 */
.banner{width:100%; height:123px; margin:10px auto;}/*height:123px*/
.banner ul li{width:24%; height:123px; float:left; border:1px solid #f4f4f4; background-color:#fff;}
.banner ul li a img {width:100%; height:100%;}
.banner .banner01{ margin-right:9px;}




@media only screen and (max-width: 1023px){	
	.visual{width: 100%; margin: 0;}
	.quickBanner{width: 100%;}
	.quickBanner ul{margin: 0;}
	.quickBanner ul li{margin: 0; width: 16.66%;}
	.infoTab{width: 100%;}
	.infoTab #tabs li{width: 33.2%;}
	.infoTab #tabBox{width: 96%; padding: 2%;}
	.infoTab #tabBox div .img{width: 20%;}
	.infoTab #tabBox div .con{width: 77%; float: right;}
	.pLink{width: 100%;}
	.pLink .top{width: 100%;  background: url("/img/main/pLinkTop.png") #3860a3 no-repeat right center;}
	.pLink ul li dl dd{font-size: 13px; font-style: bold;}
	.bbs{width: 100%; margin-bottom: 20px;}	
	.bbs > div{width: 49%; margin-right: 2%;}
	.bbs > div:nth-child(2){margin-right: 0;}
	.bbs > div > ul li a{width: 70%;}
	.bbs > div > ul li span{margin-right: 20px;}
	.banner{/* display: none; */ width: 100%;}
	.banner ul li{width: 24%;}
	.banner ul li img{width: 100%; height: 115%;}
	.banner .banner01{margin-left: 7px;}
	.bottom_banner{display: none;}
}


@media screen and (min-width:1025px){
    
    .desktop{   display:block !important;  }
    .tablet,.mobile{   display:none !important; }
}
@media screen and (max-width:1024px){   
    
    .tablet{   display:block !important;   }
    .desktop,.mobile{   display:none !important;   }
    
    .headerWrap{min-width:inherit; width:100%;}
    .logoWrap{width:100%;}
    
    #conWrap{width:100%; overflow: hidden;}
    #m_lnb{width:100%; float:right;}
    #conWrap02 {width:100%; overflow:hidden;}
    #contentTop {width:100%;}
    #contents {width:98%;}
    
    .gnbWrap {width:100%;}
    .gnbWrap > div {width:100%; margin:0 auto;}
    .gnbWrap .rightMenu {margin-right:5px;}
    .gnbWrap .leftMenu {overflow:hidden;}
    .lnbWrap .inner {width:100%;}
    .lnbWrap #lnb {margin-right:5px;}
    
    
    .visual .pic ul li {left:-130%;}
    .visual .pic ul li a img {width:100%;}
    .visual .btn {top:48px;left:118px;}
    
    .quickBanner {width:90%;}
    .quickBanner ul{width:90%; margin:0 auto; text-align: center;}
    .quickBanner ul li{width:16%; margin:25px 0; height:auto;}
    
    .infoTab{width: 100%;}
    .infoTab #tabs li{width: 33.2%;}
    .infoTab #tabBox{width: 96%; padding: 2%;}
    .infoTab #tabBox div .img{width: 20%;}
    .infoTab #tabBox div .con{width: 77%; float: right;}
    
    .pLink {width:100%;}
    .pLink .top {width:100%; text-align:left; margin:0 10px;}
    .pLink ul li {margin:0 10px;}
    .pLink ul li dl {width:100%; text-align:left;}
    .pLink ul li dl dt a {width:99%;}
    
    .bbs{width:100%;}   
    .bbs > div{width: 49%; overflow:hidden;}
    .bbs > div:nth-child(2){margin-right: 0;}
    .bbs > div > ul li a{width: 70%;}
    .bbs > div > ul li span{margin-right: 20px;}
    
    .banner ul li a {display:block; width:100%;}
    .banner ul li a img{width:100%;}
    .bottom_banner{display:none;}
    

    /* .bannerArea .banner_zone {position:relative; width:100%; height:100px; margin:0 auto; overflow:hidden;} */
    
    /*css01*/
    
}
@media screen and (max-width:869px){
    
    .tablet {   display:block !important;   }
    .desktop,.mobile{   display:none !important;  }
    
    #contents {margin:85px auto 0;}
    
    .gnbWrap .leftMenu {display:none;}
    .lnbWrap {height:60px;}
    .lnbWrap #lnb {display:none;}
    .lnbWrap button.btn_mobileMenu {display:block; background: url("/img/main/btn_mbMenu.png") no-repeat 10px center;border: 0; padding:20px 12px 20px 30px; position: absolute; right: 0;}
    .lnbWrap h1 {margin:5px;}
    .lnbWrap .menuBox {display:none;}

    .lnbWrap #m_lnb{display:none;}
    .lnbWrap #m_lnb ul{margin-top: 0;}
    .lnbWrap #m_lnb ul li{width: 100%; line-height: 46px; margin: 0;border-top: 1px solid #4371bd;  border-bottom: 1px solid #34568f; background: url("/img/main/ico_mbArrow_down.png") 93% 17px #3860a3 no-repeat; cursor:pointer; } /*3860a3*/
    .lnbWrap #m_lnb ul li.is-active{ background: url("/img/main/ico_mbArrow_up.png") 93% 17px #3860a3 no-repeat;}
    .lnbWrap #m_lnb ul li a{color:#fff;}
    .lnbWrap #m_lnb ul li > a:hover{color:#fff;}
    .lnbWrap #m_lnb ul li ul {display: none; position: static; height: auto; overflow: hidden;}
    .lnbWrap #m_lnb ul li ul li {line-height: 46px; padding-left: 50px; background-color: #fff; border-top: 0; border-bottom: 1px solid #ebebeb; cursor:pointer;}
    .lnbWrap #m_lnb ul li ul li a {line-height:46px; color:#333; font-weight:normal; background: #fff !important; display:block; padding-left:0; font-size: 13px}
    .lnbWrap #m_lnb ul li ul li a:hover{color:#fd763a; font-weight: 600;}
    .lnbWrap #m_lnb > ul > li:first-child > a {padding: 0 0 0 7%;}
    .lnbWrap #m_lnb ul li > a {padding: 0 0 0 7%; width: 87%;}
    .lnbWrap #m_lnb.nav-open{display: block;}
    .lnbWrap #m_lnb ul li ul.is-visible{display: block;}
    
    .visual .btn {top:34px; left:95px;}
    
    .bbs {width:100%; height:auto;}
    .bbs > div{width:100%; margin: 0 auto;}
    .bbs > div > ul li a{width: 66%;}
    
    .quickBanner {top:90%;}

    .banner {width:100%; margin:10px 0;}
    .banner ul {width:100%; text-align: center;}
    .banner ul li {width:48%; height:100px; margin:0 auto 10px; }
    .banner ul li a {}
    .banner ul li a img {display:block; width:200px; height:100px; margin:0 auto;}

    .footerWrap .foot {width:100%;}
    .footerWrap .footLine .inner {width:100%;}
    
}
@media screen and (max-width:767px){
    
    .tablet {   display:block !important;   }
    .mobile,.desktop{   display:none !important;   }
    
    #contents {margin:40px auto 0;}
    
    .visual .btn {top:30px; left:80px;}
    
    .quickBanner {top:80%;}
    
    .infoTab {width:100%; margin:0 0 10px 0;}
    .infoTab #tabBox{float: left; width:100%; height:auto;}
    .infoTab #tabBox div .btn {margin-right:25px;}
    .infoTab #tabBox div .img {width:100%; margin:15px 0; text-align:center;}
    .infoTab #tabBox div .con {width:100%;}
    .infoTab #tabBox div .con .top{height:auto; padding:0; background:none !important}
    .infoTab #tabBox div .con .bottom{height:auto;}
    .infoTab #tabBox div .con .bottom .btn{position:static; float: none; width: 100%; padding: 0; margin: 5px 0;}
    .infoTab #tabBox div .con .bottom dl dt{width: 100%;}
    .infoTab #tabBox div .con .bottom dl dd{width: 100%; padding: 0; text-align: center;}

    
}

@media screen and (max-width: 640px){
    
    .tablet {   display:block !important;   }
    .desktop,.mobile{   display:none !important;   }
    
    #contents {margin:70px auto 0;}
    
    .gnbWrap .leftMenu {display:none;}
    .lnbWrap #lnb {display:none;}
    .visual .btn {top:30px; left:20px;}
    
    .quickBanner {top:85%;}
    .quickBanner ul li a {width:130%;line-height: 18px;}
    
    .visual .pic {width:100%; height:280px;}
    .visual .pic ul li a img {width:100%;}
    .visual .btn {top:20px; left:60px;}
    
    .banner {width:100%; margin:10px 5px;}
    .banner ul li {width:100%; height:100px; margin:0 auto 10px;}
    
}

@media screen and (max-width:530px){
    .mobile {   display:block !important;   }
    .desktop,.tablet{   display:none !important;   }
    
    #contents{margin:160px auto 0;}
    
    .quickBanner {width:90%; top:110%;  margin:0 auto; height:220px; box-shadow: 0px 0px 15px grey;}
    .quickBanner ul li {width:30%; margin:0 auto; }
    .quickBanner ul li a {width:130%; line-height:15px; font-size:12px; height:30px;}
    .quickBanner ul li.quickBanner01 a{background: url("/img/main/icon01.png") center 10px no-repeat; background-size:60px;}
    .quickBanner ul li.quickBanner02 a{background: url("/img/main/icon02.png") center 10px no-repeat; background-size:60px;}
    .quickBanner ul li.quickBanner03 a{background: url("/img/main/icon03.png") center 10px no-repeat; background-size:60px;}
    .quickBanner ul li.quickBanner04 a{background: url("/img/main/icon04.png") center 10px no-repeat; background-size:60px;}
    .quickBanner ul li.quickBanner05 a{background: url("/img/main/icon05.png") center 10px no-repeat; background-size:60px;}
    .quickBanner ul li.quickBanner06 a{background: url("/img/main/icon06.png") center 10px no-repeat; background-size:60px;}
    .quickBanner ul li:hover a{color:#0055bb;font-weight: 600;}
    .quickBanner ul li.quickBanner01 a:hover{background: url("/img/main/icon01_on.png") center 10px no-repeat; background-size:60px;}
    .quickBanner ul li.quickBanner02 a:hover{background: url("/img/main/icon02_on.png") center 10px no-repeat; background-size:60px;}
    .quickBanner ul li.quickBanner03 a:hover{background: url("/img/main/icon03_on.png") center 10px no-repeat; background-size:60px;}
    .quickBanner ul li.quickBanner04 a:hover{background: url("/img/main/icon04_on.png") center 10px no-repeat; background-size:60px;}
    .quickBanner ul li.quickBanner05 a:hover{background: url("/img/main/icon05_on.png") center 10px no-repeat; background-size:60px;}
    .quickBanner ul li.quickBanner06 a:hover{background: url("/img/main/icon06_on.png") center 10px no-repeat; background-size:60px;}
    
    .visual .btn {top:40px; left:15px;}
    
    .infoTab #tabs {width:100%; margin-bottom:10px; text-align:center;}
    .infoTab #tabs li {width:33%; }
    .infoTab #ta li a{ margin:0 auto;}
    
    .footerWrap .footLine ul {width:90%; margin:0 auto; text-align:center;}
    .footerWrap .footLine ul li {width:50%; margin:0 auto;}
    
    
}

@media screen and (max-width: 375px){
    .mobile {   display:block !important;   }
    .desktop,.tablet{   display:none !important;   }
    
    #contents{margin:100px auto 0;}
    
    .visual .btn {top:25px; left:5px;}
    .quickBanner {top:90%;}
}