@charset "utf-8";

/*** Main_Common ***/

/* 모바일비쥬얼 */
.main_wrap{height: 830px !important; overflow: hidden; position: relative;}
.main_wrap ul li ul li img{margin-top: -30px !important;}
.main_wrap ul li:nth-child(2) ul li img{margin-top: -70px !important;}
.mv_sec{}
.mv_list{position: relative;}
.main_wrap .bx_visu li > ul{overflow: hidden;}
.main_wrap .bx_visu > li {position: relative;}
.main_wrap .bx-wrapper .bx-pager.bx-default-pager a {width: 87px; height: 5px; background: #fff; opacity: 1; border: 0;}
.main_wrap .bx-wrapper .bx-pager.bx-default-pager a:hover, .main_wrap .bx-wrapper .bx-pager.bx-default-pager a.active {background: #284d78; border: 0; height: 7px;}
.main_wrap .bx-wrapper .bx-pager { bottom: 10px;}
.twrap{position: absolute; width: 100%; left: 0; top: 0; z-index: 10;}
.twrap > .txt_v{width: 100%; margin: 0 auto; padding-top: 15.5%; text-align: center;}
.twrap > .txt_v2{padding-top: 14.4%; }
.twrap > .txt_v3{width: 100%; margin: 0 auto; padding-top: 16%; text-align: center;}
.twrap > .txt_v4{padding-top: 10%;}
.twrap > .txt_v2 .p_box span{font-size: 20px; color: #333; display: inline-block; padding-right: 18px; position: relative; margin-right: 8px; font-weight: 400;}
.twrap > .txt_v2 .p_box span:after{position: absolute; content:''; width: 12px; height: 15px; background: url(../../images/main/span_sla.png) 0 0 no-repeat; right: 0; bottom: 3px;}
.twrap > .txt_v2 .p_box span:last-child:after{display: none;}
.twrap > .txt_v2 .p_box{margin-bottom: 22px;}
.twrap > .txt_v span{ opacity: 0; transition:1s;}
.twrap > .txt_v.on span{ opacity: 1;}
.twrap > .txt_v h4{transform:scale(1.2); transition:1.2s; opacity: 0; margin-bottom: 25px; }
.twrap > .txt_v.on h4{ transform:scale(1); opacity: 1;}
.twrap > .txt_v.on h4 img, .twrap > .txt_v h4 img{margin: 0 auto;}
.twrap > .txt_v p{font-size: 30px; line-height: 32px; font-weight: 300; opacity: 0; transition:1.5s; font-weight: 400;}
.twrap > .txt_v.on p{opacity: 1;}
.twrap > .txt_v2 .p_box{color: #fff; font-size: 30px; font-weight: 300; transition:1.5s;}
.twrap > .txt_v.on .p_box{opacity: 1;}
.twrap > .txt_v2 .p_box2 {text-shadow:0px 0px 80px #000;}
.main_wrap .bx-wrapper .bx-pager.bx-default-pager a { width: 18px; height: 18px; background: url(../../images/main/m_visu_bt.png) 0 0 no-repeat; transition:.3s; display: inline-block; text-indent: -99999px; font-size: 0px;}
.main_wrap .bx-wrapper .bx-pager.bx-default-pager a:hover, .main_wrap .bx-wrapper .bx-pager.bx-default-pager a.active {width: 18px; height: 18px;  background: url(../../images/main/m_visu_bt_h.png) 0 0 no-repeat; }
.bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item {display: inline-block;}
.bx-pager.bx-default-pager{width: 130px; text-align: center; left: 50%; margin-left: -50px; top:58%; }
.century_main_products{position: relative;}
.owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next {width: 59px; height: 114px; }
.owl-carousel .owl-nav button.owl-prev{background: url(../../images/main/m_intro_prev.png) center no-repeat; left: -130px;}
.owl-carousel .owl-nav button.owl-next{background: url(../../images/main/m_intro_next.png) center no-repeat; right: -130px;}
.bx-controls-auto{display: none;}
.main_wrap .bx_visu > li > ul > li img{width: 100%;}
.main_wrap .bx_visu > li.fir_m_visu ul li img{width: 120%; max-width:120%; margin-left: -20%; margin-top: -20%; transition-duration: 6s;  -webkit-transition-duration: 6s;}
.main_wrap .bx_visu > li.fir_m_visu.on ul li img{width: 100%; margin-top: 0;	margin-left: 0; margin: 0 auto;}

/* 메인노티스 */
.m_notice_wrap{ background: url(../../images/main/noti_bg.png) 0 0 no-repeat; height: 80px; overflow: hidden; width: 100%; max-width:100% !important; transform:scale(1) !important; position: relative; z-index: 1012312300;}


.m_notice{overflow: hidden; margin-bottom: 30px;}
.m_notice_wrap .left_noti{float: left; width: 12.76%;}
.m_notice_wrap .left_noti h4{position: relative; font-size: 16px; line-height: 80px; color: #fff; font-weight: 400; }
.m_notice_wrap .left_noti h4:after{position: absolute; content:''; width: 31px; height: 32px; background: url(../../images/main/m_noti_icon.png) 0 0 no-repeat; left: 70px; top: 50%; margin-top: -16px;}
.m_notice_wrap .bx-wrapper{float: left; width: 87.23%;}
.m_notice_wrap .bx-wrapper .bx-viewport {background: none;}
.bx_noti li{overflow: hidden; width: 90%;}
.bx_noti li a{line-height: 80px; font-size: 16px; font-weight: 400; color: #fff;}
.bx_noti li p{float: left; width: 100%;}
.bx_noti li span{display: block; float: right; width: 14%; opacity: 0.7;}
.m_notice_wrap .bx-controls.bx-has-controls-direction{position: absolute; right: 0; width: 35px; height: 80px; top: 0;}
.m_notice_wrap .bx-controls-direction{position: relative; width: 100%; height: 80px;}
.m_notice_wrap .bx-controls-direction:after{position: absolute; content:''; width: 22px; height: 1px; background: rgba(255,255,255,0.3); bottom: 40px; right: 2px;}
.m_notice_wrap .bx-wrapper .bx-prev {background: url(../../images/main/noti_prev.png) 0 0 no-repeat; width: 26px; height: 15px; right: 0; top: 32px;}
.m_notice_wrap .bx-wrapper .bx-next{background: url(../../images/main/noti_next.png) 0 0 no-repeat; width: 26px; height: 15px; right: -1px; top:auto; bottom: 14px;}

/* 메인공통 */
.m_title_box{position: relative;margin: 60px auto 32px !important; padding: 0px 80px; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; text-align: center;}
.main_title{position: relative;font-size: 36px; line-height: 28px; color: #999; font-weight: 900; text-align: center; display: inline-block; padding: 0px 30px; background: #fff;}
.m_title_box:before{position: absolute; content:''; width: 100%; height: 1px; background: #dbdbdb; left: 0; top: 50%; }

/* 메인 디자인 */
.main_design .m_title_box {margin-top: 80px !important; margin-bottom: 38px !important;}
.main_design .full_box{display: block; overflow: hidden; }
.main_design .full_box > div{float: left; width: 50%; }
.main_design .full_box > div img{width: 100%;}
.m_design_li figure{position: relative; overflow: hidden;}
.m_design_li figure img{transform:scale(1); transition:3s; width: 100%;}
.m_design_li figure:after{position: absolute; content:''; width: 50%; height: 100%; left: 0; top: 0; background: rgba(0,0,0,0.4); transition:.7s;}
.m_design_li figure:before{position: absolute; content:''; width: 50%; height: 100%; right: 0; top: 0; background: rgba(0,0,0,0.4); z-index: 10; transition:.7s;}
.m_design_li:nth-child(2) figure:after{background: rgba(0,0,0,0.5);}
.m_design_li:nth-child(2) figure:before{background: rgba(0,0,0,0.5);}
.m_design_li figure figcaption{position: absolute; width: 100%; height: 73px; text-align: center; color: #fff; top: 50%; margin-top: -36px; z-index: 15;}
.m_design_li figure figcaption p{position: relative; font-size: 26px; line-height: 28px; font-weight: 500; padding-bottom: 35px;}
.m_design_li figure figcaption p span{display: inline-block; font-size: 14px; letter-spacing: 0.5em; padding-left: 10px; font-weight: 300;}
.m_design_li figure figcaption p:after{position: absolute; content:''; width: 49px; height: 10px; background: url(../../images/main/m_design6.png) 0 0 no-repeat; bottom: 0; left: 50%; margin-left: -25px;}
.m_design_li:hover figure img{transform:scale(1.1);}
.m_design_li:hover figure:after{width: 0;}
.m_design_li:hover figure:before{width: 0;}

/* 메인포트폴리오 */
.main_portfolio {max-width:100%; overflow: hidden;}
.main_portfolio .owl-carousel .owl-nav{position: absolute; width: 1300px; left: 50%; margin-left: -650px; top:50%; margin-top: -27px;} 
.main_portfolio .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next {position: absolute; width: 54px; height: 54px; }
.main_portfolio .owl-carousel .owl-nav button.owl-prev{background: url(../../images/main/port_prev.png) center no-repeat; left: -93px; }
.main_portfolio .owl-carousel .owl-nav button.owl-next{background: url(../../images/main/port_next.png) center no-repeat; right: -93px;}
.main_portfolio .owl-nav.disabled{width: 100% !important;position: absolute;max-width:1300px; left: 50%; margin-left: -650px; ; top: 50%; margin-top: -27px; height: 0; }
.main_portfolio .m_pcnt_wrap .item a{position: relative; display: block;}
.main_portfolio .m_pcnt_wrap .item a:after{position: absolute; content:''; width: 100%; height: 100%; background: rgba(0,0,0,0.3); left: 0; top: 0; opacity: 0; transition:.3s;}
.main_portfolio .m_pcnt_wrap .item a:before{position: absolute; content:''; width: 100px; height: 100px; background: url(../../images/main/port_hover.png) 0 0 no-repeat; left: 50%; top: 50%; margin-top: -50px; margin-left: -50px; z-index: 15; transition:.3s; opacity: 0;}
.main_portfolio .m_pcnt_wrap .item:hover a:after{opacity: 1;}
.main_portfolio .m_pcnt_wrap .item:hover a:before{opacity: 1;}
.main_portfolio .owl-dots.disabled{display: none;}


.title_bt{position: absolute; width: 31px; height: 31px; border: 1px solid #dbdbdb; background: #fff;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; right: 0; top: 3px;}
.title_bt a{display: block; background:  url(../../images/main/title_bt.png) center no-repeat; width: 29px; height: 29px; transition:.6s;}  
.title_bt:hover a{transform:rotate(540deg);} 
/* 메인 하단배너 */

.m_bn_wrap {	}
.m_bn_wrap .m_bn:after{display: block; content:''; clear: both;}
.m_bn_wrap .m_bn > ul > li{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; float: left; border: 1px solid #ececec; border-right: 0;}
.m_bn_wrap .m_bn > ul > li:last-child{border-right: 1px solid #ececec;}
.m_bn_wrap .m_bn > ul > li:first-child{border: 0; width: 360px; padding-right: 38px;}

.m_bn_wrap .m_bn > ul > li h4{font-size: 25px; line-height: 25px; color: #999999;	 font-weight: 500; padding-bottom: 13px;}
.m_bn_wrap .m_bn > ul > li .nt_box{border-bottom: 1px solid #dbdbdb; position: relative; margin-bottom: 20px;}

.m_bn_wrap .m_bn > ul > li .nt_box h4{padding-top: 28px;}
.m_bn_wrap .m_bn > ul > li .nt_box span{position: absolute; right: 0; bottom: -1px;display: block; width: 31px; height: 31px; background: #fff; border: 1px solid #dbdbdb; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.m_bn_wrap .m_bn > ul > li .nt_box span a{display: block; width: 29px; height: 29px; background: url(../../images/main/title_bt.png) center no-repeat; }
.center_2{max-width:1024px; margin: 0 auto;} 
.nt_cnt_box ul li {line-height: 30px;}
.nt_cnt_box ul li a {font-size: 15px; color: #999999; font-weight: 400; overflow: hidden;}
.nt_cnt_box ul li a p{width: 240px; float: left; text-overflow: ellipsis; -o-text-overflow: ellipsis;  overflow: hidden; white-space: nowrap; word-wrap: normal !important; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.nt_cnt_box ul li a span{display: block; float: right; width: 77px;}

.m_bn_wrap .m_bn > ul > li:nth-child(2) {background: url(../../images/main/mb_lib1.png) right bottom no-repeat;width: 200px; height: 251px; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; padding-left: 28px; padding-top: 37px;}
.m_bn_wrap .m_bn > ul > li:nth-child(2) ul {margin-top: 8px;}
.m_bn_wrap .m_bn > ul > li:nth-child(2) ul li {margin-bottom: 4px; font-size: 15px; color: #999999; line-height: 26px; }

.m_bn_wrap .m_bn > ul > li:nth-child(2) ul li span{margin-right: 9px;	d;display: inline-block; width: 38px; height: 26px; line-height: 26px; font-size: 14px; color: #fff; text-align: center; background: #32336b; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.m_bn_wrap .m_bn > ul > li:nth-child(2) > span{display: block; width: 139px; height: 36px; 	margin-top: 41px;}
.m_bn_wrap .m_bn > ul > li:nth-child(2) > span a{display: block; transition:.3s;font-weight: 400;text-align: center;background: #878d92; color: #fff; font-size: 14px; line-height: 36px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.m_bn_wrap .m_bn > ul > li:nth-child(2) > span:hover a{background: #32336b;}
.nt_cnt_box ul li:hover a{text-decoration: underline;} 
.nt_cnt_box ul li:hover a p{text-decoration: underline;}

.m_bn_wrap .m_bn > ul > li:nth-child(3){width: 241px;height: 251px; background: url(../../images/main/mb_lib2.png) center no-repeat; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; padding-left: 28px; padding-top: 37px;} 
.m_bn_wrap .m_bn > ul > li:nth-child(3) h5{font-size: 24px; line-height: 24px; color: #d52c29; font-weight: 600;}
.m_bn_wrap .m_bn > ul > li:nth-child(3) ul{margin-top: 20px;}
.m_bn_wrap .m_bn > ul > li:nth-child(3) ul li {margin-bottom: 4px; font-size: 15px; color: #999999; line-height: 26px; }
.m_bn_wrap .m_bn > ul > li:nth-child(3) ul li span{margin-right: 9px;	d;display: inline-block; width: 48px; height: 26px; line-height: 26px; font-size: 14px; color: #fff; text-align: center; background: #d52c29; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.m_bn_wrap .m_bn > ul > li:nth-child(3) > span{display: block; width: 139px; height: 36px; 	margin-top: 33px;}
.m_bn_wrap .m_bn > ul > li:nth-child(3) > span a{display: block; transition:.3s;font-weight: 400;text-align: center;background: #878d92; color: #fff; font-size: 14px; line-height: 36px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.m_bn_wrap .m_bn > ul > li:nth-child(3) > span:hover a{background: #32336b;}
.m_bn_wrap .m_bn > ul > li:nth-child(4){width: 223px; height: 251px;  background: url(../../images/main/mb_lib3.png) center no-repeat; text-align: center; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; }
.m_bn_wrap .m_bn > ul > li:nth-child(4) span{display: block; margin: 0 auto;width: 68px; font-size: 14px;height: 26px; line-height: 26px; color: #fff; background: #006fac; text-align: center; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}  
.m_bn_wrap .m_bn > ul > li:nth-child(4) {padding-top: 88px; }
.m_bn_wrap .m_bn > ul > li:nth-child(4) h5	{font-size: 23px; line-height: 45px; color: #006fac; font-weight: 700;margin-bottom: 6px;	}
.m_bn_wrap .m_bn > ul > li:nth-child(4) p{font-size: 16px; line-height: 20px; color: #999999; margin-top: 8px;}


.nt_cnt_box ul li:hover a span{text-decoration: underline;}
.mr_0{margin-right: 0 !important; padding-right: 0 !important;}
/* scroll */
/* .m_scroll{position: absolute; left: 50%; bottom: 12.5%;width: 100px; height: 40px;text-align: center; z-index: 300; color: #fff; cursor: pointer;}
.m_scroll .sc_m{position: relative;padding-top: 53px; text-align: center; width: 100px; display: block; font-weight: 300;}
.m_scroll .sc_m:before{position: absolute; content:''; width: 35px; height: 50px; background: url(../../images/main/m_scroll.png) center no-repeat; top: 0; left: 50%; margin-left: -17px;}
.m_scroll .sc_m:after{position: absolute; content:''; width: 7px; height: 9px; background: url(../../images/main/m_scroll2.png) center no-repeat; top: 10px; left: 50%; margin-left: -3px; z-index: 10;}
.m_scroll .sc_m:after{animation-name: lolling;animation-duration: 0.9s; animation-iteration-count: infinite;}
@keyframes lolling {0% {opacity: 1; top:10px}to { opacity: 0; top:19px}} */

/*변형메인*/

.main_portfolio .owl-carousel .owl-item img {max-width: 141px; margin: 0 auto; height: auto; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto;	}
.main_portfolio .m_pcnt_wrap .item a {width: 100%; height: 100%;}
.main_portfolio .owl-carousel.owl-drag .owl-item {height: 163px; background: #f9f9f9;} 
.main_portfolio .owl-carousel.owl-drag .owl-item .item{height: 163px;}

/* 메인 디자인 */
.mdesign .md_cate {position: relative; width: 100%;  margin-bottom: 30px;}
.mdesign .md_cate:after{display: block; content:''; clear: both;}
.md_cate_wrap{position: relative;}
/*.mbst{position: absolute; content:''; width: 53px; height: 3px; background: #019fe9; left: 8%; top: -2px; transition:.5s;}*/


.mdesign .md_cate li{width: 20%; height: 53px;float: left; text-align: center; font-size: 16px; line-height: 53px; color: #999999; cursor: pointer; transition:.3s; position: relative; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; border: 1px solid #dbdbdb; border-right: 0;}
.mdesign .md_cate li:last-child{border-right: 1px solid #dbdbdb;}

.mdesign .md_cate li.on, .mdesign .md_cate li:hover{color: #fff; background: #229cc1;}


.md_content{overflow: hidden;}
.md_content ul{margin-bottom: 10px;}
.md_content ul:after{display: block; content:''; clear: both;}
.md_content ul li{float: left; width: 15.83%; margin-right: 1%; text-align: center; margin-bottom: 20px;}



.md_content ul li:nth-child(6n+6){margin-right: 0;}
.md_content ul li img{max-height:252px; width: 100%;}
.md_content ul li figcaption{margin-top: 3px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; width: 100%; line-height: 56px; border: 1px solid #dbdbdb; height: 58px; font-size: 16px; color: #606060;}
.mdc_box{display: none;}
.mdc_box1{display: block;}
.md_more{position: relative;display: block;width: 215px; height: 75px; background: #019fe9; margin: 0 auto; margin-top: 80px; transition:.3s;}
.md_more:before{position: absolute; content:''; width: 30px; height: 3px; background: #019fe9; left: 0; top: 0;}
.md_more:after{position: absolute; content:''; width: 3px; height: 30px; background: #019fe9; left: 0; top: 0;}
.md_more a{position: relative;display: block; line-height: 75px; color: #fff; text-align: center; font-size: 17px; }
.md_more a:before{position: absolute; content:''; width: 30px; height: 3px; background: #019fe9; right: 0; bottom: 0;}
.md_more a:after{position: absolute; content:''; width: 3px; height: 30px; background: #019fe9; right: 0; bottom: 0;}

.md_more:hover{background: #fff;}
.md_more:hover a{color: #019fe9; font-weight: 500;}


.m_bn{margin-top: 25px !important;}
.center_3{max-width:1300px; margin: 0 auto;}


/*
.main_wrap, .header, .m_notice_wrap, .sub_wrap{min-width:1700px; margin: 0 auto;}

.s1, .main_portfolio, .main_design, .bo_gall_wrap2, .s0101, .full_board   {min-width:1300px; margin: 0 auto;}
.m_bn_wrap, .footer {min-width:1024px; margin: 0 auto;} 
*/