@charset "utf-8";

/*** Main_Common ***/

/* 모바일비쥬얼 */
.mv_sec{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; color: #fff; padding-top: 14.5%; text-align: center;}
.twrap > .txt_v span{font-size: 14px; opacity: 0.4; line-height: 58px; font-weight: 300; letter-spacing: 9px; display: block; text-align: center;  text-shadow:1px 1px 3px rgba(0,0,0,1);  opacity: 0; transition:1s;}
.twrap > .txt_v.on span{ opacity: 1;}
.twrap > .txt_v h4{font-size: 55px; line-height: 60px; font-weight: 900; margin-bottom: 35px; text-shadow:1px 1px 3px rgba(0,0,0,1); letter-spacing: 0; transform:scale(1.2); transition:1.2s; opacity: 0;}
.twrap > .txt_v.on h4{font-size: 55px; transform:scale(1); opacity: 1;}
.twrap > .txt_v p{font-size: 18px; line-height: 32px; font-weight: 100;text-shadow:1px 1px 4px rgba(0,0,0,4); opacity: 0; transition:1.5s;}
.twrap > .txt_v.on p{opacity: 0.8;}

.main_wrap .bx-wrapper .bx-pager.bx-default-pager a {display: block; width: 10px; height: 10px;  border: 2px solid #fff; background: 0; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;opacity: 0.5; -webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0; transition:.3s;}
.main_wrap .bx-wrapper .bx-pager.bx-default-pager a:hover, .main_wrap .bx-wrapper .bx-pager.bx-default-pager a.active { background: #fff;opacity: 1; height: 30px;}}
.main_wrap .bx-wrapper .bx-pager {text-align: right;}
.bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item {display: block; margin-bottom: 20px;}
.bx-pager.bx-default-pager{width: 50px; right: 8%; top: 47%;}
.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{overflow: hidden; max-width: 100%;}
.main_wrap .bx_visu > li img{transform:scale(1.2); max-width:120%;}
.main_wrap .bx_visu > li.fir_m_visu img{transform:scale(1.2); max-width:120%; transition:6s; }
.main_wrap .bx_visu > li.fir_m_visu.on img{transform:scale(1); }

/* 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}}


/* m_intro */

.main_product{margin: 115px auto 177px;}

.m_title_box{text-align: center; position: relative; margin-bottom:  58px;}
.m_title_box h3{font-size: 40px; line-height: 34px; color: #333; font-weight: 700; margin-bottom: 25px;}
.m_title_box p{font-size: 18px; color: #505050;line-height: 32px; }
.m_title_box span{position: absolute; right: 0; display: inline-block; width: 92px; text-align: center; height: 36px; bottom: 23px;}
.m_title_box span a{font-size: 14px; line-height: 32px; color: #0c325f; border: 1px solid #0c325f; -webkit-border-radius: 30px;-moz-border-radius: 30px;border-radius: 30px; display: block; font-weight: 500; transition:.3s; background: #fff; -webkit-background-size: 0 100%; background-size: 0 100%;}
.m_title_box span:hover a{background: #0c325f; color: #fff; -webkit-background-size: 100% 100%; background-size: 100% 100%; }
.m_cnt_box{m}
.m_cnt_box ul:after {content:''; display: block; visibility: hidden; clear: both;}
.m_cnt_box ul li{ float: left; width: 23.23%; margin-right: 2.35%; position: relative;}
.m_cnt_box ul li:last-child{margin-right: 0;}
.m_cnt_box ul li .figure_box{position: relative; }
.m_cnt_box ul li .figure_box .h_int{position: absolute; left: 0; top: 0; z-index: 10; opacity: 0; transition:.3s;}
.m_cnt_box ul li:hover .figure_box .h_int{opacity: 1;}

.m_cnt_box ul li .txt_box{position: absolute; width: 80%; left: 10%; bottom: -40px; background: #fff; text-align: center; z-index: 100; padding-top: 20px; -webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px;}
.m_cnt_box ul li .txt_box span{font-size: 14px; line-height: 32px; color: #134886; font-weight: 500;}
.m_cnt_box ul li .txt_box h4{font-size: 20px; line-height: 32px; color: #303030; font-weight: 500;}

.main_intro{background: #e5e8f1; padding: 120px; 0}
.main_intro .item{position: relative; }
.main_intro .item .title_box{position: absolute; overflow: hidden;left: 0; bottom: 0; width: 100%; line-height: 72px; color: #fff; border-top: 1px solid rgba(255,255,255,0.3); transition:.3s;}
.main_intro .item .title_box h3{text-align: left; display: block; color: #fff; opacity: 1; font-size: 20px; font-weight: 300; padding-left: 36px;float: left;}
.main_intro .item .title_box span{float: right;width: 30px; height: 30px; -webkit-border-radius: 50%; -moz-border-radius: 50%;border-radius: 50%; background: #005792 url(../../images/main/m_int_plu.png) center no-repeat; margin-right: 26px; margin-top: 20px;}
.main_intro .item:hover .title_box{background: #012b5d;}

/* PRODUCTS */
.century_main_products{max-width:1300px; margin: 0 auto; text-align: center; }
.century_main_products .title_box span{font-size: 12px; line-height: 20px; font-weight: 400; display: block; transition:.3s;}
.century_main_products .title_box span.cate1{color: #ff6a00;}
.century_main_products .title_box span.cate2{color: #00aba5;}
.century_main_products .title_box h3{font-size: 16px; text-align: center; display: inline-block; color: #666; font-weight: 400; transition:.3s; padding: 0 15px;}
.century_main_products .item figure{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; }
.century_main_products .item figure img{max-width:100%; width: 100%; ; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.century_main_products{}
.main_our{background: 0; padding-top: 110px;}
.main_our .owl-carousel .owl-nav button.owl-prev, .main_our .owl-carousel .owl-nav button.owl-next { width: 47px; height: 95px;}
.main_our .owl-carousel .owl-nav button.owl-prev{ background: url(../../images/main/our_prev.png) center no-repeat;}
.main_our .owl-carousel .owl-nav button.owl-next{ background: url(../../images/main/our_next.png) center no-repeat;}
.main_our .item{padding-bottom: 35px;}
.main_our .item:after {position: absolute; content:''; width: 100%; height: 35px; background: url(../../images/main/our_shadow.png) center no-repeat; -webkit-background-size: 100%; background-size: 100%; bottom: 0px; left: 0;}
.main_our button.owl-dot {display: inline-block; margin: 0px 5px; margin-top: 20px; top:30%}
.main_our button.owl-dot span{display: inline-block;width: 10px; height: 10px; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; border: 2px solid #c4c4c4; }
.main_our button.owl-dot.active span{width: 38px; background: #14457d; border: 2px solid #14457d; -webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px;}
.main_our .owl-carousel .owl-nav button.owl-prev,.main_our .owl-carousel .owl-nav button.owl-next {top:30% !important;}

.bx_2 li{height: 100% ; width: 100%;}
.maybes .bx-viewport{height: 100% !important;}
.maybes_wrap .bx-wrapper{height: 100% ;}
.m_section_wrap{background: #f9f9f9; padding: 120px 0 100px;}
.m_pt2 {margin-top: 0;}
.century_main_products2 .item figure{width: 335px; height: 335px;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%; overflow: hidden; background: #fff; margin-bottom: 30px;}
.century_main_products2 .item figure img{width: 100%; margin: 0 auto; }
.century_main_products2 .item figure {border: 1px solid #dbdbdb;}
.century_main_products2 {margin-bottom: 0;}

.main_loca{height: 742px; width: 100%; background: url(../../images/main/loca_bg.png) center no-repeat; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; padding: 130px 0 0px;}
.main_loca .m_title_box{color: #fff;}
.main_loca .m_title_box h3{color: #fff;}
.main_loca .m_title_box p{color: #fff; opacity: 0.8; font-weight: 300;}
.main_loca .m_title_box span a{border: 1px solid #fff; background: 0; color: #fff; font-weight: 100;}
.main_loca .m_title_box span:hover a{background: #fff; color: #47474f; font-weight: 400;}

.m_loca_cnt:after{content:''; display: block; visibility: hidden; clear: both;}
.m_loca_cnt .left_box {float: left; width: 40.46%; box-shadow:0 0 20px rgba(0,0,0,0.1);}
.m_loca_cnt .left_box > div{position: relative; box-shadow:0 0 40px rgba(0,0,0,0.3); }
.m_loca_cnt .left_box > div:first-child{z-index: 101;}
.m_loca_cnt .left_box > div .txt_box{position: absolute; content:''; color: #fff;top: 0; left: 0; width: 100%; padding-top: 8.5%; padding-left: 4%; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.m_loca_cnt .left_box > div .txt_box h3{font-size: 25px; line-height: 30px; font-weight: 500; padding-bottom: 10px;}
.m_loca_cnt .left_box > div .txt_box p{position: relative; font-size: 16px; opacity: 0.8; line-height: 30px; font-weight: 300;}
.m_loca_cnt .left_box > div .txt_box p:after{position: absolute; content:''; width: 32px; height: 32px; background: url(../../images/main/m_loca_bth.png) center no-repeat; right: 45px; top: 0; cursor: pointer; transition:.3s;}
.m_loca_cnt .left_box > div:hover .txt_box p:after{ background: url(../../images/main/m_loca_bt.png) center no-repeat;}

.m_loca_cnt .right_box{width: 59.54%; float: left; box-shadow:0 0 20px rgba(0,0,0,0.2);}
.m_loca_cnt .right_box iframe{width: 100%; height:333px;}