.modal_hidden{display:none}

#main-visual{position:relative;width:90%; height:calc(100vh - 100px);overflow:hidden;margin:100px auto 0 auto}
#main-visual .slid-txt{position:absolute;z-index:99;width:80%;font-size:1.3rem;font-weight:200; text-align:center; top:50%; left:10%; color:#fff;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);}
#main-visual .slid-txt p{line-height:1.5}
#main-visual .slid-txt .tit{position:relative;font-size:5rem;font-weight:700;margin-bottom:20px;line-height:1.1;padding-bottom:30px; margin-bottom:30px}
#main-visual .slid-txt .tit:after{content:'';position:absolute;left:50%; margin-left:-6px;width:12px; height:12px;background:#fff;border-radius:500px;bottom:-5px}
#main-visual .slid-txt .tit:before{content:''; position:absolute;left:50%; width:60px; margin-left:-30px; bottom:0;background:#fff;height:1px}
#main-visual .slid-txt .s-tit{font-size:1.6rem;font-weight:500;}
.visual-01{background:url(../images/main/main-visual.png) no-repeat 50% 50%; background-size:cover}
.visual-02{background:url(../images/main/main-visual2.png) no-repeat 50% 50%; background-size:cover}
#main-visual .button-next{background:url(../images/common/roll-prev.png); width:85px; height:85px;position:absolute; top:50%;left:0px;z-index:999;cursor:pointer}
#main-visual .button-prev{background:url(../images/common/roll-next.png); width:85px; height:85px;position:absolute; top:50%;right:0px;z-index:999;cursor:pointer}
#main-visual .swiper-pagination-bullet{background:#fff;width:12px; height:12px;opacity:.5}
#main-visual .swiper-pagination-bullet-active{background:#fff;opacity:1}
#main-visual .swiper-pagination{bottom:30px}

.main-info{display:flex; flex-wrap:wrap;width:90%; max-width:1200px; margin:80px auto;}
.main-info > div{width:50%; padding:70px}
.main-info > div .txt p{margin-bottom:20px;font-size:1.2rem; color:#595959; line-height:1.5}
.main-info > div .txt .tit{font-family:'Noto Serif KR', serif;font-size:3.8rem;font-weight:600;color:#222}
.main-info > div:first-child .txt {margin-bottom:70px}
.main-info > div:last-child .txt {margin-top:50px}
.main-info > div .img{position:relative;}
.main-info > div .img img{width:100%}
.main-info > div .img:after{width:265px; height:265px;background:#0d6fb8;content:'';position:absolute;z-index:-1; left:-70px; bottom:-70px}
.main-info > div:last-child .img:after{left:auto; right:-70px}

.prod-bg{background:url(../images/main/prod-bg.png) no-repeat 50% 50%; background-size:cover; width:100%;padding:100px 0}
.prod-bg h2{font-size:2.8rem; text-align:center; color:#fff;margin-bottom:30px}
.main-prod{position:relative;width:90%; max-width:1200px;overflow:hidden;margin:0 auto}
.main-prod li{background:#fff}
.main-prod li img{width:100%}
.main-prod li span{display:block; padding:15px;text-align:center;font-size:1.1rem}
.prod-bg .btn{text-align:center;margin-top:50px}
.prod-bg .btn a{display:inline-block; line-height:60px; height:60px; width:200px;text-align:center; border:1px solid #fff;color:#fff}
.prod-bg .btn a:hover{background:#fff; color:#333}

.prcenter{padding:100px 0}
.prcenter ul{ width:95%; max-width:1300px;margin:0 auto;display:flex; flex-wrap:wrap;justify-content:space-between}
.prcenter ul li{position:relative;width:calc(25% - 30px);text-align:center;color:#fff;font-size:18px;font-weight:600}
.prcenter ul li:first-child{width:50%;transition: .5s all;font-weight:500}
.prcenter ul li img{max-width:100%}
.prcenter ul li:nth-child(2){background:#00a0e9;}
.prcenter ul li:nth-child(3){background:#58585d;}
.prcenter ul li > a{display:block;width:100%; height:100%;}
.prcenter ul li .over{position:absolute;width:100%;top:50%; left:50%;-webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
.prcenter ul li img{max-width:100%; margin-bottom:15px}
.prcenter ul li:first-child img{margin-bottom:0;width:100%}
.prcenter ul li:first-child .btn a{display:inline-block; height:55px; line-height:55px; padding:0 70px;border:1px solid #fff;margin-top:20px;font-size:14px}
.prcenter ul li strong{display:block;font-size:30px;line-height:1.5}

footer{background:#36393b; padding:50px 0}
footer .f-con{width:90%; max-width:1200px;margin:0 auto; color:#fff;font-size:.85rem;}
footer .f-con .tit{font-size:1.1rem;margin-top:0}
footer .f-con p{margin-top:10px}
footer .f-con .copy{font-size:.75rem}
footer .f-con span{margin-right:20px}


.sub-visual{position:relative;height:450px;width:90%; margin:100px auto;}
.bg-01{background:url(../images/sub/bg-01.png) no-repeat 50% 50%;background-size:cover}
.bg-02{background:url(../images/sub/bg-02.png) no-repeat 50% 50%;background-size:cover}
.bg-03{background:url(../images/sub/bg-03.png) no-repeat 50% 50%;background-size:cover}
.bg-04{background:url(../images/sub/bg-04.png) no-repeat 50% 50%;background-size:cover}
.bg-05{background:url(../images/sub/bg-05.png) no-repeat 50% 50%;background-size:cover}

.sub-visual .sub-tit{position:absolute;top:50%; left:0; width:100%; text-align:center; color:#fff;font-size:24px;font-weight:400;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);text-shadow:5px 5px 5px rgba(0,0,0,.5)}
.sub-visual .sub-tit h2{font-size:50px;font-weight:600;}

#sub-container{width:90%; max-width:1200px;margin:100px auto}
#sub-container h3{position:relative;text-align:center;font-weight:600; font-size:2.5rem; padding-bottom:60px;}
#sub-container h3:after{height:30px; width:1px;left:50%;background:#222;content:'';position:absolute;bottom:0}
#sub-container h4{font-size:2rem; color:#0060b9;margin-top:40px;margin-bottom:10px}
#sub-container h5{font-size:1.3rem;margin-top:30px}

.greeting{text-align:center;}
.greeting .tit{font-size:1.5rem;margin-top:40px; color:#0060b9; font-weight:600;margin-bottom:20px}
.greeting div{line-height:2}

.contact-form{width:100%;margin-top:50px}
.contact-form li {margin-top:10px}
.contact-form li input[type="text"]{height:50px;line-height:50px; background:#fafafa; width:100%; padding:0 10px}
.contact-form li textarea{background:#fafafa;padding:15px;border:0; overflow-y:auto; height:250px; width:100%; color:#666; font-family:"Noto Sans KR", "NanumGothic", dotum ,sans-serif;font-weight:300;font-size:14px}
.btn-submit {margin-top:20px; text-align:center}
.btn-submit a{display:inline-block;background:#333; height:50px; line-height:50px; width:150px; text-align:center; color:#fff; border-radius:5px}
.agree-wrap a{margin-left:15px;border-bottom:1px solid #666; font-weight:500;cursor:pointer}
.privacy{height:1px; opacity:0;margin-top:10px; border:1px solid #ddd; padding:15px; -webkit-box-sizing: border-box;  box-sizing: border-box;  -webkit-transition: all 0.4s ease;  transition: all 0.4s ease;}
.privacy-open{height:auto;opacity:1;display:block}


.tbl-basic{border-top:1px solid #ddd; border-left:1px solid #ddd; width:100%; margin-top:30px;table-layout:fixed}
.tbl-basic thead th{background:#efefef;padding:15px 10px;border-bottom:1px solid #ddd; border-right:1px solid #ddd;}
.tbl-basic tbody th{background:#f6f6f6; border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:15px;text-align:center}
.tbl-basic tbody td{border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:15px;text-align:center}
.tbl-basic tfoot td{background:#efefef;;border-bottom:1px solid #ddd; border-right:1px solid #ddd;padding:15px 10px;text-align:center;font-weight:bold}
.tbl-basic tfoot th{background:#fff;border-bottom:1px solid #ddd; border-right:1px solid #ddd;padding:15px 10px;text-align:center;}

.tbl-basic2{border-top:1px solid #000;border-left:1px solid #ddd;margin-top:30px;width:100%;}
.tbl-basic2 tbody th{background:#f6f6f6; padding:15px;border-bottom:1px solid #ddd; border-right:1px solid #ddd}
.tbl-basic2 tbody td{border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:15px;}


.location-wrap{position:relative;display:flex; flex-wrap:wrap;margin-top:50px;}
.location-wrap iframe{width:calc(100% - 400px)}
.location-wrap .location-info{position:relative;background:#21478d; width:400px;line-height:1.5}
.location-wrap .location-info > div{position:absolute; top:50%; left:5%; width:90%;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);text-align:center; color:#fff}
.location-wrap .location-info > div strong{font-family:'GmarketSans';font-size:1.5em;font-weight:500}
.location-wrap .location-info > div a{display:inline-block; border:1px solid #fff;height:60px; line-height:60px;width:100%; max-width:250px;margin-top:30px;font-weight:600}
.location-wrap .location-info > div a:hover{background:#fff; color:#21478d;}


.organ{position:relative;margin:50px auto;text-align:center}
.organ .ceo{position:relative;display:inline-block; width:100%;max-width:200px; height:60px; background:#21478d;color:#fff;margin:0 auto}
.organ .ceo:after{content:"";position:absolute;z-index:-1;width:1px; height:40px;background:#ddd; left:50%;bottom:-40px}
.organ .ceo span,.organ .depth1 dt span{display:inline-block;position:absolute; width:100%;top:50%;left:0;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);}
.organ .depth1{display:flex; flex-wrap:wrap; justify-content:space-between;margin-top:70px;}
.organ .depth1 dl{position:relative;width:20%;padding:0 10px }
.organ .depth1 dl:before{content:"";position:absolute;z-index:-1;width:100%; height:1px; background:#ddd; top:-35px;left:50%;}
.organ .depth1 dl:last-child:before{left:auto; right:50%}
.organ .depth1 dt{position:relative;background:#85c226; height:60px;color:#fff}
.organ .depth1 dt:before{content:"";position:absolute;z-index:-1;width:1px; height:40px;background:#ddd; left:50%;top:-35px}
.organ .depth1 dd{background:#f6f6f6; padding:15px 10px;margin-top:5px}


/* 연혁 */
.history{width:100%;background:url(../images/sub/history_line.jpg) repeat-y 50% 50%;overflow:hidden;margin-top:50px}
.history li{float:left;width:calc(50% + 4px)}
.history li:nth-child(even){float:right;width:calc(50% + 3px)}
.history li:nth-child(odd){text-align:right}
.history li dt{font-size:35px; color:#0060b9;vertical-align:middle;line-height:150%;font-weight:800}
.history li:nth-child(odd) .year:after{content:'';display:inline-block;background:url(../images/sub/yeat_target.jpg) no-repeat 50% 50%; width:39px; height:7px;vertical-align:middle;margin-left:15px}
.history li:nth-child(even) .year:before{content:'';display:inline-block;background:url(../images/sub/yeat_target2.jpg) no-repeat 50% 50%; width:39px; height:7px;vertical-align:middle;margin-right:15px}
.history li:nth-child(odd) dd{padding-right:55px;}
.history li:nth-child(even) dd{padding-left:55px;}
.history li dd{display:flex; flex-wrap:wrap;margin-top:10px}
.history li dd .month{font-size:19px; color:#555;width:50px;line-height:150%;font-weight:600 }
.history li dd .con{width:calc(100% - 50px);line-height:150%; color:#555}
.history li:nth-child(odd) dd .month{order:2}


.step2{display:flex; flex-wrap:wrap;justify-content:space-between;margin-top:30px}
.step2 li{width:calc(25% - 20px);margin-top:20px;text-align:center;background:#fff;border:1px solid #ddd;padding:20px;color:#333; border-radius:7px;font-weight:600}
.step2 li span{display:block; width:100%;margin-bottom:15px;color:#0060b9;}
.step2 li img{max-width:100%; margin-bottom:20px}


.point,.point2{display:flex; flex-wrap:wrap;border-top:1px solid #ddd; border-left:1px solid #ddd;margin-top:20px}
.point li{width:25%;padding:30px;text-align:center; line-height:1.5;border-right:1px solid #ddd;border-bottom:1px solid #ddd}
.point li span{display:inline-block;width:40px; height:40px; background:#0060b9;text-align:center; line-height:40px; color:#fff;border-radius:500px;margin-bottom:15px}
.point2{margin-bottom:50px}
.point2 li{width:33.3%;text-align:center;padding:30px; line-height:1.5;border-left:1px solid #ddd}
.point2 li:first-child{border-left:0}
.point2{border:none}
.point2 img{margin-bottom:15px}

.ide-txt{background:#f6f6f6;padding:30px; text-align:center;margin-top:20px}
.ide-txt .txt-han{font-size:3rem;font-weight:bold;letter-spacing:-2px;}

.quality{padding:100px;text-align:center;font-size:1.2rem;background:url(../images/sub/qui.png) no-repeat 50% 50%; background-size:cover;color:#fff;}
.quality h4{margin-top:0; color:#fff !important;margin-bottom:30px}

.img-flex{display:flex; flex-wrap:wrap;margin-top:20px}
.img-flex li{width:25%}
.img-flex li img{width:100%}

.ci-wrap{background:url(../images/sub/ci-bg.png) 50% 50%;text-align:center; padding:80px 30px;margin-top:50px;border:1px solid #ddd; margin-bottom:20px}
.ci-wrap img{padding:0 30px;max-width:100%}


@media(max-width:1200px){
.main-info{margin:30px auto 80px auto}
.main-info > div .txt .tit{font-size:3rem}
.main-info > div{padding:50px}
.main-info > div .img:after{bottom:-50px;left:-50px}
.main-info > div:last-child .img:after{right:-50px}
.main-info > div .txt p{font-size:1rem}

.prod-bg h2{font-size:2.2rem}
}


@media(max-width:1024px){

#main-visual{margin-top:80px}
#main-visual .slid-txt {padding:0 30px}
#main-visual .slid-txt .tit{font-size:4rem}
#main-visual .button-next,#main-visual .button-prev{height:50px; width:50px;background-size:cover}

.sub-visual{height:350px;margin:80px auto 50px auto}
.sub-visual .sub-tit h2{font-size:2.7rem}

#sub-container{margin:80px auto}
#sub-container h3{font-size:2rem}
#sub-container h4{font-size:1.7rem}

.point li{width:33.3%}
.ide-txt .txt-han{font-size:2.5rem}

.location-wrap iframe,.location-wrap .location-info{width:100%}
.location-wrap .location-info > div{position:relative;padding:30px}
.location-wrap .location-info > div a{display:block;margin:10px auto 0 auto}

.step2 li{width:calc(33.3% - 10px)}
.ci-wrap{padding:30px}
.ci-wrap img{padding:10px 0;max-width:80%}

}

@media(max-width:768px){

#main-visual .slid-txt .tit{font-size:2.5rem}
#main-visual .slid-txt .s-tit{font-size:1.1rem}
#main-visual .slid-txt p{font-size:.85rem}


.main-info > div{display:flex; flex-wrap:wrap;width:100%;padding:0}
.main-info > div div{width:100%}
.main-info > div .img:after{display:none}
.main-info > div .img{height:300px;overflow:hidden}
.main-info > div:first-child .img{order:1}
.main-info > div:first-child .txt{order:2;margin-top:30px}
.main-info > div .txt .tit{font-size:2rem}
.main-info > div .txt p{font-size:.9rem}

.prod-bg h2{font-size:1.8rem}
.main-prod li span{font-size:.9rem}

.prcenter{padding:50px 0}
.prcenter ul li:first-child{width:100%;font-size:1rem}
.prcenter ul li{width:50%;height:0; padding-bottom:50%}
.prcenter ul li:first-child{padding-bottom:0;height:auto;margin-bottom:1px}
.prcenter ul li strong{font-size:1.5rem}


.sub-visual{height:200px}
.sub-visual .sub-tit{font-size:1rem}
.sub-visual .sub-tit h2{font-size:2rem}

#sub-container{margin:50px auto;font-size:.85rem}
#sub-container h3{font-size:1.5rem}
#sub-container h4{font-size:1.3rem}
#sub-container h5{font-size:1.1rem}

.greeting .tit{font-size:1.2rem}
.point li{width:50%}
.ide-txt .txt-han{font-size:2rem}
.point2 li{width:100%;border-top:1px solid #ddd; border-left:0}
.point2 li:first-child{border-top:0}
.quality{padding:50px 50px 70px 50px;font-size:.9rem}

.history{background:none;margin-top:30px}
.history li{float:left;width:100%;margin-bottom:20px;border-bottom:1px solid #ddd;padding-bottom:20px;}
.history li:nth-child(even){float:left;width:100%}
.history li:nth-child(odd){text-align:left}
.history li dt{font-size:1.5rem;vertical-align:middle;line-height:150%}
.history li:nth-child(odd) .year:after,.history li:nth-child(even) .year:before{display:none}
.history li:nth-child(odd) dd,.history li:nth-child(even) dd{padding:0;}
.history li dd{display:flex; flex-wrap:wrap;}
.history li dd .month{font-size:1rem; color:#555;width:40px;line-height:150% }
.history li dd .con{width:calc(100% - 40px);line-height:150%; color:#555;}
.history li:nth-child(odd) dd .month{order:0}

.organ{margin-top:30px}
.organ .depth1{margin-top:0px}
.organ .depth1 dl{width:50%;margin-top:20px}
.organ .depth1 dl:before{height:calc(100% + 20px); width:1px;top:0; left:auto; right:-1px}
.organ .depth1 dt:before{content:'';width:10px; height:1px;top:50%;left:auto;right:-10px}
.organ .depth1 dl:nth-child(even) dt:before{left:-10px; right:auto}
.organ .depth1 dl:nth-child(even):before{display:none} 
.organ .depth1 dl:last-child:before{left:auto;right:-1px;top:-49px}

.img-flex li{width:50%}
.step2 li{width:calc(50% - 5px);padding:20px 10px;margin-top:10px}

.tbl-basic{ table-layout: auto;}

footer .f-con span{display:block;}



}