@charset "utf-8";

/*공통*/
h2.m-tite{font-size:35px;}
p.m-txt{font-size:25px; color:#555; letter-spacing:-1.2px; line-height:1.2;}


/*mainvisual*/
.img1{background:url("../images/main/main-img01.jpg")no-repeat; background-size:cover; width:100%; height:790px;}
.img2{background:url("../images/main/main-img02.jpg")no-repeat; background-size:cover; width:100%; height:790px;}
.img3{background:url("../images/main/main-img03.jpg")no-repeat; background-size:cover; width:100%; height:790px;}
.img4{background:url("../images/main/main-img04.jpg")no-repeat; background-size:cover; width:100%; height:790px;}

.mtxt{position:absolute; top:25%; left:20%; color:#fff; z-index:1;}
.mtxt div.txt{font-size:35px; letter-spacing:-1.4px; font-family: 'GmarketSansMedium'; color:#fff; text-shadow:7px 7px 7px rgba(0,0,0,0.5);}
.mtxt div.txt span{display:block;}
.mtxt h2{font-size:60px; font-family: 'GmarketSansBold'; color:#fff; text-shadow:7px 7px 7px rgba(0,0,0,0.5); padding-top:1%;}


/*메인수정*/
.container{overflow:hidden;}
.m-slide{z-index:0 !important; width:100%;}
.m-slide .ibox img{width:100%; height:100%;}

/*@-webkit-keyframes zoom {from {-webkit-transform: scale(1.5,1.5);}to {-webkit-transform: scale(1,1);}}
@keyframes zoom {from {transform:scale(1.5,1.5);} to {transform:scale(1,1);}}

.mv_animate {-webkit-animation: zoom 11s infinite; animation: zoom 11s infinite;}
.mv_animate_scale {transform:scale(1.5);}*/
@-webkit-keyframes zoom {from {-webkit-transform: scale(1,1);}to {-webkit-transform: scale(1.5,1.5);}}
@keyframes zoom {from {transform: scale(1,1);} to {transform: scale(1.2,1.2);}}

.mv_animate {-webkit-animation: zoom 11s infinite; animation: zoom 11s infinite;}
.mv_animate_scale { transform: scale(1.0);}

/*회사소개*/
#mcont1{position:relative;}
#mcont1::after{content:""; display:block; clear:both;}
#mcont1 .wrap .left{position:relative;}
#mcont1 .wrap .left::before{content:""; width:0px; height:0px; border-top:solid 50px transparent; border-left:solid 38px #006d4e; position:absolute; right:-38px; top:-50px;}
#mcont1 .wrap .left::after{content:""; display:block; background:url("../images/main/cont1-img01.png")no-repeat #03a678; width:960px; height:250px; position:absolute; top:-50px; right:0;}

#mcont1 .wrap .left .box{position:relative; height:200px; overflow:hidden;}
#mcont1 .wrap .left .box::after{content:""; display:block; background:url("../images/main/cont1-simbol.png")no-repeat; width:199px; height:181px; position:absolute; bottom:0; right:-4%;; z-index:1;}

#mcont1 .wrap .left h4, #mcont1 .wrap .left p, #mcont1 .wrap .left .more-btn,  #mcont1 .wrap .left div{position:relative; z-index:1; color:#fff;}
#mcont1 .wrap .left h4{font-size:25px; font-weight:600;}
#mcont1 .wrap .left p{font-size:22px; font-weight:400; line-height:1.4; letter-spacing:-1.2px; position:relative;}
#mcont1 .wrap .left p::before{content:""; display:block; background:url("../images/ico/quotes-open.png")no-repeat 23% 50%; width:100%; height:16px; padding:0 0 5%;}
#mcont1 .wrap .left p::after{content:""; display:block; background:url("../images/ico/quotes-end.png")no-repeat 23% 50%; width:100%; height:16px; padding:5% 0 0;}

#mcont1 .wrap .left p span{display:block;}

/*#mcont1 .wrap .left .more-btn a{display:block; position:relative;}
#mcont1 .wrap .left .more-btn a::after{content:""; display:block; background:url("../images/btn/arrow-btn.png")no-repeat; width:44px; height:44px; position:absolute; top:20px; left:0;}*/

#mcont1 .wrap .right{}
#mcont1 .wrap .right dl{}
#mcont1 .wrap .right dl dd{width:25%; float:left; text-align:center; font-size:16px; position:relative; padding:8% 5%; box-sizing:border-box; cursor:pointer;}
#mcont1 .wrap .right dl dd::after{content:""; display:block; width:1px; height:100px; background:#ddd; position:absolute; top:30%; right:0;}
#mcont1 .wrap .right dl dd:last-child::after{display:none;}

#mcont1 .wrap .right dl dd:hover{position:relative; color:#03a678;}
#mcont1 .wrap .right dl dd:hover::after{content:""; display:block; border:solid 5px #03a678; background:none; position:absolute; top:0; left:0; width:100%; height:100%; box-sizing:border-box;}

#mcont1 .wrap .right dl dd p.ico{width:86px; height:75px; padding-bottom:5%;}
#mcont1 .wrap .right dl dd:nth-child(1) p.ico{background:url("../images/ico/cont1-ico01.png")no-repeat;}
#mcont1 .wrap .right dl dd:nth-child(2) p.ico{background:url("../images/ico/cont1-ico02.png")no-repeat;}
#mcont1 .wrap .right dl dd:nth-child(3) p.ico{background:url("../images/ico/cont1-ico03.png")no-repeat;}
#mcont1 .wrap .right dl dd:nth-child(4) p.ico{background:url("../images/ico/cont1-ico04.png")no-repeat;}

#mcont1 .wrap .right dl dd:nth-child(1):hover p.ico{background:url("../images/ico/cont1-ico01_on.png")no-repeat;}
#mcont1 .wrap .right dl dd:nth-child(2):hover p.ico{background:url("../images/ico/cont1-ico02_on.png")no-repeat;}
#mcont1 .wrap .right dl dd:nth-child(3):hover p.ico{background:url("../images/ico/cont1-ico03_on.png")no-repeat;}
#mcont1 .wrap .right dl dd:nth-child(4):hover p.ico{background:url("../images/ico/cont1-ico04_on.png")no-repeat;}


/*제품및공정도*/
#mcont2{background:#f7f7f7; position:relative;}
#mcont2::after{content:""; display:block; clear:both;}

#mcont2 .wrap{padding:3% 0; overflow:hidden;}

#mcont2 dl{padding-top:2%;}
#mcont2 dl dd{float:left; width:24%; margin-right:1%; text-align:center; overflow:hidden; cursor:pointer;}
#mcont2 dl dd:last-child{margin-right:0;}
#mcont2 dl dd a{display:block;}
#mcont2 dl dd a:hover{position:relative;}
#mcont2 dl dd a:hover::after{content:""; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5);}

#mcont2 dl dd img{}
#mcont2 dl dd:hover img{transform:scale(1.1);-o-transform:scale(1.1); -moz-transform:scale(1.1);-webkit-transform:scale(1.1); transition: transform .35s;  -o-transition: transform .35s;-moz-transition: transform .35s;-webkit-transition: transform .35s;}
#mcont2 dl dd:hover img::after{content:""; display:block; background-color:rgba(255,204,51,0.7); position:absolute; top:0; left:0; width:100%; height:100%;}

#mcont2 .view-more a{display:block; position:relative;}
#mcont2 .view-more a:after{content:"+"; display:block; position:absolute; width:38px; height:38px; text-align:center; line-height:38px; font-size:18px; font-weight:600; background:#03a678; color:#fff; top:-75px; right:0;}

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

.pro-box h3, .pro-box p{line-height:1.5;}
.pro-box h3{font-size:18px; text-transform:uppercase; position:relative; top:35%; font-family: 'GmarketSansMedium';}
.pro-box h3::after{content:''; display:block; position:absolute; bottom:-10%; left:42%; width:15%; height:1px; background:#03a678;}
.pro-box h3 span{display:block;}

.pro-box:before, .pro-box:after, .pro-box .pro-txt:before, .pro-box .pro-txt:after{position:absolute; content:''; background-color:#f7f7f7; z-index:1; -webkit-transition:all 0.4s ease-in; transition:all 0.4s ease-in; opacity:0.8;}
.pro-box:before, .pro-box:after{height:2px; width:0%;}
.pro-box:before{top:0; left:0;}
.pro-box:after{bottom:0; right:0;}
.pro-box:hover img, .pro-box.hover img{opacity:0.4;}
.pro-box:hover .pro-txt, .pro-box.hover .pro-txt{opacity:1;}
.pro-box:hover .pro-txt:before, .pro-box.hover .pro-txt:before, .pro-box:hover .pro-txt:after, .pro-box.hover .pro-txt:after{height:100%;}
.pro-box:hover:before, .pro-box.hover:before, .pro-box:hover:after, .pro-box.hover:after{width:100%;}
.pro-box:hover:before, .pro-box.hover:before, .pro-box:hover:after, .pro-box.hover:after, .pro-box:hover .pro-txt:before, .pro-box.hover .pro-txt:before, .pro-box:hover .pro-txt:after, .pro-box.hover .pro-txt:after{opacity:0.1;}



/*사업소개*/
#mcont3 .wrap{margin:3% auto;}
#mcont3 .wrap::after{content:""; display:block; clear:both;}
#mcont3 .left{width:240px; margin-right:50px;}

dl.tabs{margin:13% 0 0; padding:0px;}
dl.tabs dd{background:none; cursor:pointer; font-size:18px; padding:6% 5%; border-bottom:solid 1px #ddd;}
dl.tabs dd:nth-child(1){border-top:solid 1px #ddd;}
dl.tabs dd.on{background:#03a678; color:#fff; position:relative; transition: all 0.5s, color 0.3s;}
dl.tabs dd.on:hover{box-shadow:295px 0 0 0 rgb(3,166,120) inset;}
dl.tabs dd.on::after{content:""; display:block; background:url("../images/btn/cont2-arrow-btn.jpg")no-repeat; width:17px; height:17px; position:absolute; top:36%; right:6%;}

#mcont3 .right{width:910px;}
#mcont3 .right .more-btn{position:absolute; bottom:0; right:0;}
#mcont3 .right .more-btn a{display:block; width:150px; height:60px; line-height:60px; text-align:center; background:#03a678; color:#fff; font-size:16px; transition: all 0.5s, color 0.3s;}
#mcont3 .right .more-btn a:hover{box-shadow:295px 0 0 0 rgb(255,255,255) inset; color:#555;}

.tab-cont{display:none;}
.tab-cont.on{display:inherit; position:relative; font-size:0;}


/*공지&뉴스/온라인문의*/
#mcont4{overflow:hidden;}
#mcont4 .left{position:relative; padding:3% 0 2.5%;}
/*#mcont4 .left::after{content:""; display:block; background:#f7f7f7; width:960px; height:470px; position:absolute; top:0; right:0; z-index:-1;}*/

/*notice*/
#mcont4 .left ul{overflow:hidden; margin:20px 90px 0 0;}
#mcont4 .left ul li{border:solid 1px #ddd; overflow:hidden; padding:3% 0; margin:0 0 2% 0; background:#fff;}
#mcont4 .left ul li {cursor:pointer; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: box-shadow;}
.empty_li{text-align:center;}
.new_icon{color:#03a679; font-size:12px;}
#mcont4 .left ul li:hover, #mcont4 .left ul li:focus, #mcont4 .left ul li:active {box-shadow: inset 0 0 0 4px #dddddd, 0 0 1px rgba(0, 0, 0, 0);}

#mcont4 .left ul li .data{width:20%; float:left; text-align:center; border-right:solid 1px #ddd; box-sizing:border-box; color:#555;}
#mcont4 .left ul li .data p.year{font-size:12px;}
#mcont4 .left ul li .data p.day{font-size:24px; font-style:italic;}
#mcont4 .left ul li .txt{width:76%; margin-right:4%; float:left; line-height:3.5; padding-left:3%; box-sizing:border-box; font-size:16px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
#mcont4 .left button{position:absolute; right:90px; top:15%; border:none; font-size:18px; font-weight:500; width:38px; height:38px; line-height:38px; color:#fff; background:#03a678; outline:none;}

#mcont4 .right{position:relative; color:#fff; padding:4% 0 2.5% 5%; box-sizing:border-box;}
#mcont4 .right::after{content:""; display:block; background:#03a678; width:960px; height:470px; position:absolute; top:0; left:0; z-index:-1;}

#mcont4 .right h4{font-size:25px; letter-spacing:-1.2px;}
#mcont4 .right p.txt{font-family: 'GmarketSansMedium'; font-size:15px; line-height:1.4; letter-spacing:-0.5px; padding:1% 0;}
#mcont4 .right p.txt span{display:block;}
#mcont4 .right p.tel{font-family: 'GmarketSansMedium'; font-size:45px; padding:2% 0; font-style:italic;}

#mcont4 .right ul.rest{border-top:solid 1px #00936a; border-bottom:solid 1px #00936a; padding:5% 0; font-family: 'GmarketSansMedium'; font-size:14px;}
#mcont4 .right ul.rest li{position:relative; padding-left:2%; line-height:1.8;}
#mcont4 .right ul.rest li::after{content:"-"; display:block; position:absolute; top:0; left:0;}

#mcont4 .right .mail{padding-top:3%; font-family:'GmarketSansMedium'; font-size:16px;}
#mcont4 .right .mail p:nth-child(2){padding-top:1%;}


/*media*/

/*노트북 해상도 125%일때*/
@media screen and (max-width:1580px){
.img1, .img2, .img3, .img4{width:1580px; height:590px;}

/*메인수정*/
.mtxt{top:29%; left:13%;}
.mtxt h2{font-size:50px;}
.mtxt div.txt{font-size:28px;}


}

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

/*mainvusual*/
.img1, .img2, .img3, .img4{width:100%; height:590px; background-position:50% 50%;}
.mtxt{top:35%; left:9%;}


/*회사소개*/
#mcont1 .wrap .left, #mcont1 .wrap .right{float:none; width:100%; height:auto;}
#mcont1 .wrap .left::after{display:none;}
#mcont1 .wrap .left{background-color:#03a678;}
#mcont1 .wrap .left::before{display:none;}
#mcont1 .wrap .left .box{height:auto; padding:4% 5%;}
#mcont1 .wrap .left .box::after{bottom:2%; right:-3%;}
#mcont1 .wrap .left .box::before{content:""; display:block; background:url("../images/main/cont1-img01.png")no-repeat; width:100%; height:100%; background-size:cover; position:absolute; top:0; left:0;}

#mcont1 .wrap .left p{text-align:center;}
#mcont1 .wrap .left p::before, #mcont1 .wrap .left p::after{background-position:50% 50%;}
#mcont1 .wrap .left p::before{padding:0 0 3%;}
#mcont1 .wrap .left p::after{padding:3% 0 0}

#mcont1 .wrap .right dl dd::after{height:50%;}
#mcont1 .wrap .right dl dd p.ico{background-size:cover !important; width:100%; height:123px;}

/*제품및공정도*/
#mcont2 .wrap{padding:5%; box-sizing:border-box;}
#mcont2 dl{overflow:hidden;}
#mcont2 dl dd{width:47%; margin:0 5% 5% 0;}
#mcont2 dl dd:nth-child(2n){margin:0 0 5% 0;}
#mcont2 dl dd img{width:100%; height:auto;}

#mcont2 .view-more{position:absolute; top:0; right:0;}
#mcont2 .view-more a:after{width:80px; height:80px; line-height:80px; font-size:35px; top:0;}


/*사업소개*/
#mcont3 .left, #mcont3 .right{float:none; width:100%;}
#mcont3 .wrap{padding:5%; box-sizing:border-box;}
dl.tabs{margin:3% 0 0; overflow:hidden;}
dl.tabs dd{float:left; width:20%; box-sizing:border-box; padding:3%; border-top:solid 1px #ddd; border-right:solid 1px #ddd; border-bottom:none; text-align:center; background:#f7f7f7;}
dl.tabs dd:nth-child(1){border-left:solid 1px #ddd;}
dl.tabs dd.on::after{display:none;}

.tab-cont img{width:100%;}

/*공지&뉴스/ 온라인문의*/
#mcont4 .left, #mcont4 .right{float:none; width:100%; padding:5%; box-sizing:border-box;}
#mcont4 .left::after, #mcont4 .right::after{width:100%; height:100%;} 
#mcont4 .left ul{margin:4% 0 0;}
#mcont4 .left button{top:0; right:0; width:80px; height:80px; line-height:80px; font-size:35px;}

#mcont4 .right ul.rest{padding:2% 0;}
#mcont4 .right .mail{padding-top:2%;}
#mcont4 .right p.tel a{color:#fff;}

}
/*E:max-width:1024*/

/*S:max-width:800*/
@media all and (max-width:800px){
h2.m-tite{font-size:30px;}
p.m-txt{font-size:20px;}

/*mainvusual*/
.img1, .img2, .img3, .img4{height:550px;}

.mtxt p{font-size:28px;}
.mtxt h2{font-size:50px; letter-spacing:2px;}

/*회사소개*/
#mcont1 .wrap .left .box{padding:5%;}
#mcont1 .wrap .right dl dd{padding:5%;}
#mcont1 .wrap .right dl dd::after{top:20%;}
#mcont1 .wrap .right dl dd p.ico{background-size:contain !important; padding-bottom:0; height:105px;}

/*제품정보*/
#mcont2 .view-more a:after, #mcont4 .left button{width:50px; height:50px; line-height:50px; font-size:23px;}

/*공지&뉴스/온라인문의*/
#mcont4 .right p.tel{font-size:35px; padding:1% 0 2%;}



}
/*E:max-width:800*/

/*S:max-width:650*/
@media all and (max-width:650px){
h2.m-tite{font-size:23px;}
p.m-txt{font-size:18px;}

/*main-visual*/
.img1, .img2, .img3, .img4{height:330px;}
.img1{background-position:65% 100%;}

.mtxt{text-align:center; top:35%; left:0; width:100%;}
.mtxt div.txt{font-size:18px; line-height:1.2;}
.mtxt h2{font-size:40px;}

/*회사소개*/
#mcont1 .wrap .left h4{font-size:18px;}
#mcont1 .wrap .left p{font-size:17px; text-align:center;}
#mcont1 .wrap .left p::before, #mcont1 .wrap .left p::after{background-position:50% 50%;}
#mcont1 .wrap .left .box{padding:6% 5% 5%;}
#mcont1 .wrap .left .box::after{background-size:contain; width:120px; height:107px; bottom:0;}
#mcont1 .wrap .left .more-btn a::after{background-size:contain; top:8px; width:30px; height:30px;}

#mcont1 .wrap .right dl dd{font-size:13px; padding:8% 3%;}
#mcont1 .wrap .right dl dd::after{top:26%;}
#mcont1 .wrap .right dl dd p.ico{height:55px; width:72%; margin:0 auto;}

/*제품및공정도*/
#mcont2 .view-more a:after, #mcont4 .left button{width:40px; height:40px; line-height:40px; font-size:20px;}
#mcont2 dl{padding-top:5%;}
#mcont3 .right .more-btn a{width:100%; height:auto; line-height:normal; font-size:15px; padding:3%; box-sizing:border-box; margin-top:3%;}

.pro-box h3{font-size:13px; top:30%;}

/*사업소개*/
dl.tabs dd{font-size:15px; padding:3% 0;}

#mcont3 .right .more-btn{position:static;}
#mcont3 .right .more-btn a:hover{border:solid 1px #ddd; background:#fff;}


/*공지&뉴스/ 온라인문의*/
#mcont4 .left ul li{width:99%;}

#mcont4 .right h4{font-size:20px;}
#mcont4 .right p.txt{font-size:13px;}
#mcont4 .right p.tel{font-size:30px;}



}
/*E:max-width:650*/

/*S:max-width:375*/
@media all and (max-width:375px){
/*mainvisual*/
.img1, .img2, .img3, .img4{height:310px;}


.mtxt p{font-size:20px;}
.mtxt h2{font-size:30px;}

/*회사소개*/
#mcont1 .wrap .left p{font-size:16px;}
#mcont1 .wrap .left p::before, #mcont1 .wrap .left p::after{background-size:contain; height:auto;}
#mcont1 .wrap .left p::before{margin-bottom:2%;}
#mcont1 .wrap .left p::after{margin-top:2%;}

#mcont1 .wrap .right dl dd{font-size:12px;}


/*뉴스&공지/온라인문의*/
#mcont4 .left ul li .txt{font-size:15px;}
#mcont4 .left ul li .data p.day{font-size:18px;}
#mcont4 .right .mail{font-size:15px;}

}
/*E:max-width:375*/

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

/*mainvisual*/
.img1, .img2, .img3, .img4{height:300px;}


/*회사소개*/
#mcont1 .wrap .left .box{padding:10% 5%;}
#mcont1 .wrap .left .box::after{width:93px; height:85px;}

#mcont1 .wrap .right dl dd{width:50%; border-bottom:solid 1px #ddd; border-right:solid 1px #ddd; padding:5%;}
#mcont1 .wrap .right dl dd:nth-child(2n){border-right:none;}
#mcont1 .wrap .right dl dd::after{display:none;}
#mcont1 .wrap .right dl dd p.ico{width:50%; margin:0 auto;}

/*제품및공정*/
h2.m-tite{font-size:20px;}
p.m-txt{font-size:16px;}
.pro-box h3{font-size:11px;}

/*사업소개*/
dl.tabs dd{width:33.3%;}
dl.tabs dd:nth-child(3){border-bottom:solid 1px #ddd;}
dl.tabs dd:nth-child(4){border-left:solid 1px #ddd;}

/*공지&뉴스/온라인문의*/
#mcont4 .left ul li{padding:4% 0;}
#mcont4 .left ul li .data{width:25%;}
#mcont4 .left ul li .txt{width:71%; line-height:2.8;}

#mcont4 .right p.txt{font-size:12px;}
#mcont4 .right ul.rest{font-size:14px;}


}
/*E:max-width:320*/