@charset "utf-8";

/***********메인페이지***********/

/*main css*/
#main{width:100%; height:100%;}
#main img{height:100%;}
#main ul.mainslider{width:100%; height:100%; overflow:hidden;}
#main ul.mainslider li{position:relative; height:100%;}
#main ul.mainslider li img{position:absolute; top:0; left:0; width:100%; height:100%; z-index:-1;}

#main .bx-wrapper{height:100% !important;} 
#main .bx-viewport{height:100% !important;}

/*고정*/
.mbg{width:100%; height:100%; background-size:cover; background-position:50% 50%; background-repeat:no-repeat; position:relative;}

/*이미지 추가시*/
.m01{background-image:url('../images/main/02.jpg');}
.m02{background-image:url('../images/main/04.jpg');}
.m03{background-image:url('../images/main/01.jpg');}
.m04{background-image:url('../images/main/03.jpg');}
.m05{background-image:url('../images/main/06.jpg');}
.m06{background-image:url('../images/main/05.jpg');}
.m07{background-image:url('../images/main/07.jpg');}

.mbg::after{content:""; display:block; position:absolute; top:0; left:0; background:url("../images/main/main-w-logo2.png")no-repeat; width:100%; height:100%; background-position:50% 50%;}


@media all and (max-width:1024px) {
#main ul.mainslider li img{object-fit:cover; object-position:50% 50%;}
}

@media all and (max-width:800px){

}

@media all and (max-width:650px){

.mainslider li:nth-child(1){background-color:#65c4c0;}
.mbg::after{background-size:contain; width:50%; height:12%; top:45%; left:26%;}

}

@media all and (max-width:375px){

}

@media all and (max-width:320px){

}



/***********서브페이지***********/
.wrap{width:1100px; margin:0 auto;}
.wrap::after{content:""; display:block; clear:both;}
.left, .right{float:left; width:50%;}
.sub-tite{font-size:26px; font-weight:600; color:#65c3bf; padding-bottom:2%;}

/*회사소개*/
#sub{overflow:hidden; margin-top:10px; min-height:800px; }
.about-img{position:relative; font-size:0;}
.about-img::before{content:""; display:block; width:100%; height:100%; position:absolute; top:0; right:-100%; background-color:#fff;}
.about-img::after{content:""; display:block; width:100%; height:100%; position:absolute; top:0; left:-100%; background-color:#fff;}
.about-img img{width:100%; height:auto;}
.about-img1 img{width:100%;}


.cont{position:relative;}
.cont .about{margin:-50px 0;}
h2.about-tit{font-size:24px; letter-spacing:0; font-family:'Noto Sans KR', sans-serif; color:#65c3bf;}

.cont .about .box{padding:20px 0 50px; border-bottom:solid 1px #65c4c0;}
.cont .about .box::after{content:""; display:block; clear:both;}

.cont .about .box h4.tite{font-size:32px;  letter-spacing:-0.5px; padding:10px 0; color: #65c4c0; font-family:'Noto Sans KR', sans-serif;}
.cont .about .box .left span{display:block; color:#5fc4be; font-size:30px; line-height:1.4; font-family:'Noto Sans KR', sans-serif; font-weight:600;}

.cont .about .box .left{width:10%;}
.cont .about .box .right{width:90%; margin:9% 0 5%;}
.cont .about .box .right ul.t-list li{font-size:18px; line-height:1.6;}


.cont .about .box1{padding:20px 0 50px; border-bottom:solid 1px #65c4c0;}
.cont .about .box1::after{content:""; display:block; clear:both;}

.cont .about .box1 h4.tite{font-size:32px;  letter-spacing:-0.5px; padding:10px 0; color: #65c4c0; font-family:'Noto Sans KR', sans-serif;}
.cont .about .box1 .left span{display:block; color:#5fc4be; font-size:30px; line-height:1.4; font-family:'Noto Sans KR', sans-serif; font-weight:600;}

.cont .about .box1 .left{width:25%;}
.cont .about .box1 .right{width:75%; margin:9% 0 5%;}
.cont .about .box1 .right ul.t-list li{font-size:16px; line-height:1.6;}


.cont .about.crew .box{border-bottom:none; margin-top:70px;}

.crew-box{overflow:hidden;}
.crew-box dd{float:left; width:30%; margin-right:3.3333%; box-sizing:border-box; text-align:center; margin-bottom:10%;}
.crew-box dd:nth-child(4){clear:both;}

.partner-box{overflow:hidden;}
.partner-box dd{float:left; width:48%; margin-right:2%; box-sizing:border-box; text-align:center; margin-bottom:10%;}


.crew-box dd h4{font-size:18px;color:#65c4c0}
.crew-box dd p.txt{font-size:15px; color:#5b5b5b;line-height:2.0;}

.crew-box dd .ibox{margin:0 0 0px;}
.crew-box dd .ibox img{width:100px;}


@media all and (max-width:1024px){

.wrap{width:100%;}
.sub-tite{padding:1% 5%;}

.cont{padding:2%; box-sizing:border-box;}
.cont .about .box .left{width:20%;}
.cont .about .box .right{width:80%;}
.cont .about .box1 .left{width:25%;}
.cont .about .box1 .right{width:75%;}



}

@media all and (max-width:800px){
.left, .right{float:none; width:100%;}

.cont .about .box .left, .cont .about .box .right{float:none; width:100%;;}
.cont .about .box .left span{font-size:27px;}
.cont .about .box .right{margin:3% 0 0;}

.cont .about .box1 .left, .cont .about .box1 .right{float:none; width:100%;;}
.cont .about .box1 .left span{font-size:27px;}
.cont .about .box1 .right{margin:3% 0 0;}

}

@media all and (max-width:650px){
.sub-tite{font-size:25px;}

.about-img img{width:100%;}
.about-img1 img{width:100%;}
.cont{padding:2% 5%;}
.cont .about{margin:5% 0;}
h2.about-tit{font-size:22px;}

.left, .right{padding:3% 0;}
.cont .about .box .right ul.t-list li{word-break:keep-all; font-size:14px; margin-bottom:2%;}

.cont .about .box{padding:0;}
.cont .about .box h4.tite{margin-top:-30px; padding:1% 0 3%; font-size:20px;}
.cont .about .box ul.t-list li{line-height:1.6;}

.cont .about .box1 .right ul.t-list li{word-break:keep-all; font-size:14px; margin-bottom:2%;}

.cont .about .box1{padding:0;}
.cont .about .box1 h4.tite{margin-top:-30px; padding:1% 0 3%; font-size:20px;}
.cont .about .box1 ul.t-list li{line-height:1.6;}

.crew-box dd{width:96%; margin-right:3%;margin-bottom:80px;}
.crew-box dd .ibox{width:60%; margin:0 auto;}
.crew-box dd .ibox img{width:64%;}
.crew-box dd .tbox .intr{font-size:12px; padding:1% 0 2%;} 

.partner-box{overflow:hidden;}
.partner-box dd .ibox img{width:90%;}
.partner-box dd{float:left; width:100%;  box-sizing:border-box;  margin-bottom:10%;}

.cont .about .box .right{margin:0;}

.cont .about .box1 .right{margin:0;}


}

@media all and (max-width:375px){
}

@media all and (max-width:320px){
}


/*포트폴리오*/
.folio-banner{position:relative; margin:0 0 30px;}
.folio-banner .portfolio-slider img:hover{opacity:0.5;}

.sub-menu{position:relative; margin-bottom:10px;}
.sub-menu h2, .sub-menu ul{float:left;}
.sub-menu h2{width:20%; padding-right:20px; box-sizing:border-box;}
.sub-menu ul{width:80%;}

.folio-menu{margin-top:5px;}
.folio-menu li{float:left; margin-right:20px;  font-size:18px;}
.folio-menu li a{color:#999;}
.folio-menu li a:hover{opacity:0.5;}

/*depth_menu*/
.mm>li a{display:block; transform:skew(-0.001deg);}
.folio-menu li ul.depth{background:#00B094; display:none; width:100%; position:absolute; z-index:9999; top:38px; left:0; box-sizing:border-box;}
.folio-menu li ul.depth li{line-height:40px; margin-right:0; font-size:14px; font-weight:400; width:25%; box-sizing:border-box; border-bottom:solid 1px #2e776e; border-right:solid 1px #2e776e;}
.folio-menu li ul.depth li a{color:#fff; display:block; padding-bottom:0; transform:skew(-0.001deg); padding:5px 10px; box-sizing:border-box;}
.folio-menu li ul.depth li a:hover{background:#2e776e; color:#fff; opacity:1;}

.gall-box{margin:30px 0;}
.gall-box::after{content:""; display:block; clear:both;}

dl.folio-wrap{margin:5% 0 0; cursor:pointer;}
dl.folio-wrap::after{content:""; display:block; clear:both;}

dl.folio-wrap dd{float:left; width:30%; margin: 0 5% 5% 0; position:relative;}
dl.folio-wrap dd:nth-child(3n){margin-right:0;}
dl.folio-wrap .empty_list{width:100%; float:none;}

.folio-box{position:relative; width:100%; color:#000; background-color:#fff;}
.folio-box *{ -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.4s ease-in; transition: all 0.4s ease-in;}
.folio-box img{position:relative; max-width:100%; vertical-align:top;}
.folio-box .tbox{position:absolute; top:0; right:0; width:100%; height:100%; z-index:1; opacity:0; padding:5%; text-align:center;}
.folio-box .tbox:before{right:0; top:0;}
.folio-box .tbox:after{left:0; bottom:0;}

.folio-box h3, .folio-box p{line-height:1.5;}
.folio-box h3{margin:20% 0 0; font-size:18px; font-weight:600; text-transform:uppercase; position:relative;}
.folio-box h3::after{content:''; display:block; position:absolute; bottom:-10%; left:42%; width:15%; height:1px; background:#fff;}

.folio-box p{font-size:15px; font-weight:400;}
.folio-box p span{display:block;}

.folio-box:hover img, .folio-box.hover img{opacity:0.2;}
.folio-box:hover .tbox, .folio-box.hover .tbox{opacity:1;}


@media all and (max-width:1024px){

/*포트폴리오 게시판*/
.sub-menu{margin:2% 5%;}
dl.folio-wrap{margin:3% 0 0;}
dl.folio-wrap dd{margin:0 5% 8% 0;}
.gall-wrap{width:90%; margin:0 5%;}
.folio-box div {height: auto !important; max-height: none !important;}

.folio-banner{margin:2% 5%;}
.p-tite{margin:0 5%;}

.gall-box{margin:0;}
.pg_wrap{margin:3% 0;}


}

@media all and (max-width:800px){

}

@media all and (max-width:650px){
.sub-menu{margin:3% 5% 5%;}
.sub-menu ul{width:100%;}
.sub-menu ul::after{content:""; display:block; clear:both;}
.sub-menu h2, .sub-menu ul{float:none;}
.sub-menu h2{width:100%; text-align:center; padding-right:0;}

.folio-menu li{margin-right:0; width:33.3%; text-align:center;}
.folio-menu li ul.depth{top:74px;}
.folio-menu li ul.depth li a{font-size:13px; padding:2% 0;}


/*포트폴리오 게시판*/
dl.folio-wrap dd{margin:0 4% 5% 0; width:48%}
dl.folio-wrap dd:nth-child(2n){margin-right:0;}
dl.folio-wrap dd:nth-child(3n){margin-right:4%;}
dl.folio-wrap dd:nth-child(6n){margin-right:0;}



.folio-box{background-color:rgba(255,255,255,0)}
.folio-box .tbox{position:relative; padding:0; opacity:1;}

.folio-box h3, .folio-box p{line-height:normal;}
.folio-box h3{margin:3% 0 0; font-size:15px;}
.folio-box p{font-size:13px; color:#666;}

#bo_gall .bo_tit{line-height:normal;}


.calendar{display:none;}
}

@media all and (max-width:375px){
}

@media all and (max-width:320px){
}


/*회사정보*/
.cont .info .box1 .right,
.cont .follow .box1 .right,
.cont .contact .box1 .right{margin:0;}
.cont .info .box1 h4.tite{color:#000; padding:10px 0 30px;}

.cont .info .box1,
.cont .follow .box1,
.cont .contact .box1{border-bottom:none;}

.cont .info .box1 .right ul.t-list li:nth-child(3){padding-top:20px;}

.social{overflow:hidden;}
.social dd{float:left; margin-right:30px;}

.req_box{}

.req_box table.req_table{border-collapse:separate; border-spacing:0; text-align:left;  width:100%;}
.req_box table.req_table th{font-weight:400; vertical-align:middle; width:30%;}
.req_box table.req_table td{vertical-align: middle; width:70%; padding-bottom:20px}
.req_box table.req_table td input{border:solid 1px #5fc4be; height:28px; color:#666; width:100%;}
.req_box table.req_table td input[type="checkbox"]{display:inline-block; height:auto; width:auto; vertical-align:middle; -webkit-appearance:auto;}
.req_box table.req_table td textarea{border:solid 1px #5fc4be; ; height:150px; color:#666; resize: none; width:100%;}

.agree_box li.tite{font-weight:400;}

.req_btn{overflow:hidden; width:100%;}
.req_btn div.btn{background:#5fc4be;}
.req_btn div.btn a{color:#fff; font-size:15px; display:block; padding:5px 20px; text-align:center; letter-spacing:-0.5px; font-weight:400;}

.req_btn div{float:right;}
.req_btn div.re_btn{width:121px; height:50px; background:#26166f; margin:20px 0 0 0; float:left; overflow:hidden; margin-left:10px;}
.req_btn div.re_btn a{color:#fff; font-size:15px; display:block; padding:17px; text-align:center; letter-spacing:-0.5px; font-weight:400;}

.req_box table.req_table td ul{border:solid 1px #5fc4be; padding:2%;}




@media all and (max-width:1024px){


}

@media all and (max-width:800px){

}

@media all and (max-width:650px){

}

@media all and (max-width:375px){
}

@media all and (max-width:320px){
}