/* ------------------------------------------------------------- */
/* ------------------- 공통으로 들어가는 부분  ------------------- */
/* ------------------------------------------------------------- */
html{
    font-size:18px; scroll-behavior:smooth; height: 100%; margin: 0;
}

body{
    position: relative;
    height: 100%;
    font-weight: 400;
	color:#333;
    width:100%;
    letter-spacing: 0px;
	line-height: 1.4;
    font-size: 17px;
    font-family: 'Poppins','Noto Sans KR', sans-serif;
}
/* :lang(cn) body{
    font-family: 'Noto Sans SC','Noto Sans TC', sans-serif;
}  */

/* 전체 */
.wrap{max-width: 1920px; width: 100%; position: relative; overflow: hidden;}
/* clearfix */
.clf::before, .clf::after{display:block; content:''; clear: both;}

/* boundary */
.boundary{margin:0 auto; max-width:100%; width:1200px; box-sizing: border-box; position: relative;}
.boundary2{margin:0 auto; max-width:100%; width:1440px; box-sizing: border-box; position: relative;}
.boundary3{margin:0 auto; max-width:100%; width:1720px; box-sizing: border-box; position: relative;}

/* 마우스긁었을때 */
::selection{background-color: #333; color: white;}

/* button */
.button-wrap{width: 100%;}
/* hidden */
.hidden{display: none;}
/* input */
input:focus, textarea:focus{outline:1px solid #2e3192!important;}

/* ********************************************* *
    header
* ********************************************* */
.header_bg{width:100%; height: 85px; background-color: white;position: absolute; top: 0; left: 0;}
/* .header:hover .header_bg{display: block;} */
/* .nav_inner:hover ul li{color: #232323!important;} */

.header{width: 100%; height:85px; background-color:white; position: fixed; z-index: 999; border-bottom: 1px solid #ddd;}
.header .main_nav{width:1720px; max-width: 100%; margin: 0 auto; background-color: #fff; height: 84px; position: relative;}
.header .logo{width: 132px; height: 37px; position: absolute; top:23px; left:0px; text-indent: -9999px; 
    overflow: hidden; background: url(../img/logo.png)no-repeat; 
    background-size:contain;background-position: center; z-index: 9998;
}
.header .logo a{display: block; width: 100%; height: 100%;}
:lang(en) .header .logo{width: 156px; height: 43px; background: url(../img/logo_en.png)no-repeat; 
    background-size:contain;background-position: center;
}
:lang(vn) .header .logo{width: 156px; height: 43px;  background: url(../img/logo_en.png)no-repeat; 
    background-size:contain;background-position: center;
}
ul.gnb{position: relative;}

.header .nav_inner{position: absolute; width: 60%; left: 50%; top: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); text-align: center;}
.header .nav_inner>ul>li{position: relative; display: inline-block;height: 85px; line-height: 85px; font-weight: 500; vertical-align: top; width: 16.6666%; color: #333; margin-right: -5px;font-size:19px}

.header .nav_inner>ul>li .sub_deph{display: none; width: 100%; position: absolute; top:85px; left: 0;z-index: 999; text-align: center; }
.header .nav_inner>ul>li:hover .sub_deph{display: block;}
.header .nav_inner>ul>li .sub_deph ul>li{font-weight: 400; width:100%; padding: 8px 0; color: #fff; height:auto; line-height: 40px; background-color:#2e3192;z-index: 999; font-size:17px; }
:lang(en) .header .nav_inner>ul>li .sub_deph ul>li{font-size: 15px;}
.header .nav_inner>ul>li .sub_deph ul>li>a{color: #fff; word-break: keep-all;display: inline; padding: 8px;display: inline-block; line-height: 1.2; }
.header .nav_inner>ul>li:hover .sub_deph{display: block;}
.header .nav_inner>ul>li .sub_deph ul>li:hover{background-color:#f2f2f2;}
.header .nav_inner>ul>li .sub_deph ul>li:hover a{color: #333333;}

.header .language{position: absolute; right:0px; top:30px; font-weight: 400;}
.header .language i{display: inline-block;padding-right: 8px;}
.header .language>p{cursor: pointer; position: relative; font-size: 19px; color: #747474;}
.header .language>p::before{content: "";display: inline-block; margin-bottom:-3px; margin-right: 8px; width:18px; height: 18px; background: url(../img/lang_icon.png)no-repeat; background-size: cover; background-position: center;}

.header .language ul{transition-duration: 0.2s; height: 0; overflow: hidden; padding-top: 4px;}
.header .language ul li{cursor: pointer; padding:4px 12px; position: relative; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-top: 1px solid #ddd;
    color: #232323;background-color:rgba(255, 255, 255, 0.5); text-align: center; font-size: 17px;
}
.header .language ul li:last-child{border-bottom: 1px solid #ddd;}
.header .language ul li:hover{background-color:white!important;}
:lang(en) .header .nav_inner{width: 70%;}
:lang(vn) .header .nav_inner{width: 75%;}
:lang(vn) .header .nav_inner>ul>li{font-size: 17px; line-height:inherit; padding: 24px;}

/* header2는 sub페이지 헤더 */
.header2{background-color:white; height: 97px; padding-left: 10.5375%; padding-right: 10.5375%;}
.header2 .logo{background: url(../img/sub/logo2.png)no-repeat; background-position: center; background-size: contain;}
.header2:hover{background-color:white!important;}
.header2 .nav_inner>ul>li{color: #333;}
.header2 .nav_inner>ul>li .sub_deph ul>li{background-color:rgba(6,70,125,0.8);}
.header2 .language>p{color:#333; margin-bottom: 9px;}
.header2 .language>p::before{background: url(../img/sub/lang_icon2.png)no-repeat!important; background-position: center; background-size: cover;}
.header2 .language>p>span{border-top: 6px solid #333333;}
.header2 .nav_inner>ul>li{height: 97px; line-height: 97px;}
.header2 .nav_inner>ul>li .sub_deph{top: 96px;}
.header2 .main_nav{height: 97px;}
.header2 .language{top: 38px;}
.header2 .nav_inner>ul>li .sub_deph ul>li>a{color: white;}
.header2 .nav_inner>ul>li .sub_deph ul>li:hover{background-color: white;}
.header2 .nav_inner>ul>li .sub_deph ul>li:hover a{color: #00427a;}
.header2 .mo_btn_wrap span{background-color: #777777;}

/* 모바일헤더 */
.mobile_ver{width: 100%;}

.mo_btn_wrap{cursor: pointer;position: absolute; right:0px; top:50%; transform: translateY(-50%); width:33px; height: 18px;} 
/* .mo_btn_wrap span{display: block; width: 100%; height: 3px; margin-bottom:7px; background-color: white;} */
.mo_btn_wrap span{position: absolute; width: 100%; height:2px; background-color:#777777 ;z-index: 300;}
.mo_btn_wrap span:nth-child(1){top: 0;}
.mo_btn_wrap span:nth-child(2){top:50%;}
.mo_btn_wrap span:nth-child(3){top: 100%;}
.mo_btn_wrap span:last-child{margin-bottom: 0;}

.show{display: block;}
/* 페이지네이션 */
.pagination{text-align: center; margin: 0 auto; padding: 50px 0;}
.pagination .navi{width: 35px; height: 35px;  cursor: pointer;}
.pagination>.page{overflow: hidden; text-align: center; margin: 0 auto; }
.pagination>.page ul{margin-left:-4px; margin-right: -4px;}
.pagination>.page ul li{display: inline-block; vertical-align: middle; padding: 4px; margin-right: -5px;color: #333; text-align: center;  cursor: pointer;}
.pagination>.page ul li>p{ width: 35px; height: 35px; line-height: 35px; font-size: 15px; color: #999; }
.pagination>.page ul li> .page_on{color: #2e3192; font-weight: 500;}
.pagination>.page ul li> .page_on::after{content: ""; display: block; width: 50%; text-align: center; margin: 0 auto; height: 2px;background-color: #2e3192}

/* ********************************************* *
    swiper
* ********************************************* */

.swiper-container {
    width: 100%;
    height: 100%;
  }

  .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
  }

/* ********************************************* *
    footer
* ********************************************* */
.footer{position: relative; width: 100%; background-color:#393939; color:#cbcbcb; text-align:left; padding:32px 0; }
.footer .footer_text{font-size: 15px; font-weight: 400; word-break: keep-all;}
.footer .footer_text>p{padding: 3px 0; word-break: keep-all;}
.footer .footer_text>p>span{padding-left: 5px;}
.footer .footer_text>p:nth-child(2)>span::before{content: ""; display: inline-block; width: 1px; height: 10px; background-color: #aeaeae; margin-right: 5px;}
.footer .footer_text>p:last-child{color: #666666; padding-top: 8px; font-family: 'Roboto', sans-serif; font-weight: 400;}
.footer .footer_logo{width:160px; overflow: hidden; position: absolute; right: 20px; top: 50%; 
    transform: translateY(-50%);  -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%);
}
/*이북*/
.footer .f-btn {width:150px; height:45px; background: #6F6F6F; text-align: center; color:#fff; position: absolute; top:50%; transform:translateY(-50%); right:200px; line-height: 45px; transition:all 0.5s} 
.footer .f-btn a {display: block; }
.footer .f-btn a span img {width:20px; display: inline-block; margin-left:10px; vertical-align: baseline}

.footer .f-btn:hover {opacity: 0.7; transition:all 0.5s}

/*이북반응형*/
@media screen and (max-width:768px) {
    .footer .f-btn {position: static; top:0; right:0; transform: none; margin-top:10px;}   
}

.footer .footer_logo>img{width: 100%;}
.footer .footer_logo>img:last-child{display: none;}
/* :lang(en) .footer .footer_logo>img{content: url(../img/f_logo_en.png);}
:lang(vn) .footer .footer_logo>img{content: url(../img/f_logo_en.png);} */
:lang(en) .footer .footer_logo>img:first-child{display: none;}
:lang(vn) .footer .footer_logo>img:first-child{display: none;}
:lang(en) .footer .footer_logo>img:last-child{display: block;}
:lang(vn) .footer .footer_logo>img:last-child{display: block;}

.footer .rock{width: 18px; height: 20px; position: absolute; right:18px; bottom: 18px;}
.footer .rock a img{width: 100%;}

/* ********************************************* *
    sub-page 공통
* ********************************************* */
.sub-banner{width: 100%; ;position: relative;  margin-top:85px;}
.sub-banner .sub-location{width: 100%; overflow: hidden; height: 70px;}
:lang(en) .sub-banner .sub-location{height: 66px;}
.sub-banner .sub-location .inner{width:100%; overflow: hidden; }
.sub-banner .sub-location .inner ul li{padding:0 2%; float: left;}
:lang(en) .sub-banner .sub-location .inner ul li{padding: 0 1%;}
:lang(vn) .sub-banner .sub-location .inner ul li{padding: 0;}
.sub-banner .sub-location .inner ul li:first-child{padding: 0;}
.sub-banner .sub-location .inner ul li p{padding: 22px; text-align: center; font-size: 19px;}
:lang(en) .sub-banner .sub-location .inner ul li p{font-size: 17px;}
.sub-banner .sub-img{width: 100%; height: 310px; }
.sub-banner .sub-img .img_wrap{width: 100%; overflow: hidden; height: 100%;}
.sub-banner .sub-img .img_wrap .img_in{width: 100%; height: 100%;}


.title_on{color:#2e3192; font-weight: 500;}
.sub-lo-title{background-color:#2e3192; color: #fff;width: 195px; padding: 0; }
.ceo_banner{width: 100%; background: url(../img/sub/ceo_banner_img.jpg)no-repeat; background-position: top; background-size: cover;}
.product_banner{width: 100%; background: url(../img/sub/product_banner_img.jpg)no-repeat; background-position: center; background-size: cover;}
.process_banner{width: 100%; background: url(../img/sub/process_banner_img3.jpg)no-repeat; background-position: center; background-size: cover;}
.library_banner{width: 100%; background: url(../img/sub/customer_banner_img.jpg)no-repeat; background-position: center; background-size: cover;}
.industry_banner{width: 100%; background: url(../img/sub/industry_banner_img.jpg)no-repeat; background-position: center; background-size: cover;}
.customer_banner{width: 100%; background: url(../img/sub/customer_banner_img2.jpg)no-repeat; background-position: 55%; background-size: cover;}
.sub-body{width: 100%;}
.sub-body>.inner{width: 100%; position: relative; margin-top: -80px; padding: 80px 0 120px 0;}
.sub-body>.inner::before{content: ""; position: absolute; right: 0; top: 0px; width: 50%; height: 30%; background-color:#fff;}
.sub-body>.inner .sub-title{width: 100%; position: relative; }
.sub-body>.inner .sub-title::before{content: ""; position: absolute; left: -120px; top: -80px; width: 100%; height: 80%; background-color:#fff; z-index: 1;}

.sub-body>.inner .sub-title>h2{font-size: 38px; font-weight: 500;position: relative; z-index: 5;}
/* ********************************************* *
    common_banner
* ********************************************* */
 .common_sub_banner{width: 100%; height: 365px; position: relative; margin-top: 97px; }
.common-title{font-size:3.333rem; text-align: center; color: #fff;font-weight: 500; position: absolute; top: calc(50% - 20px); left: 50%; transform: translate(-50%,-50%);}
.common_tab_banner{width: 100%; height: 55px;background-color:#fff; border-bottom: 1px solid #ddd;}
.common_tab_banner .boundary ul li{float: left; position: relative; }
.common_tab_banner .h_btn{display: block; width: 55px; height:55px; text-indent: -9999px; background-color: white;}
.common_tab_banner .h_btn a{display: block; position: relative; width: 100%; height: 100%; position: relative; z-index: 1; padding: 0; border: 0 none;}
.common_tab_banner .h_btn a i{display: block; position: relative; z-index: 1; width: 100%; height: 100%; background: url(../img/sub/h_btn_icon.png)no-repeat; background-size: cover; background-position: center;}
.dropdown{position: relative;}
.common_tab_banner .dropdown{min-width: 255px;}
.common_tab_banner .dropdown>a:hover{background-color: white; color: #232323; }
.common_tab_banner .dropdown a{background-color: #fff; font-size: 17px; display: block; position: relative; text-align: left; width: 100%; height: 55px; padding: 16px 40px 16px 20px; border-bottom: 1px dashed #ddd;}
.common_tab_banner .dropdown a:last-child{border: 0;}
.common_tab_banner .dropdown>a{border-bottom: 1px solid #ddd;}
.common_tab_banner .dropdown a>span::after{content: ""; position: absolute; width: 1px; height: 15px; right: 0;  background-color:#333; opacity: 0.3;
top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%);  }

.common_tab_banner .dropdown .dropdown_menu>a:hover{background-color: #f2f2f2;}
.common_tab_banner .dropdown a>span{position: absolute;width: 55px; height: 55px;  right: 0; top: 0; background: url(../img/sub/plus_btn3.png)no-repeat; background-size: cover; background-position: center;}
.common_tab_banner .dropdown a:hover span{background: url(../img/sub/plus_btn3.png)no-repeat; background-size: cover; background-position: center;}
.dropdown .dropdown_menu{display:none; width: 100%;background-color: white;border-left: 1px solid #aeaeae; border-right: 1px solid #aeaeae; border-bottom: 1px solid #aeaeae; z-index: 100; position: absolute; top:55px;left: 0;}
.dropdown .dropdown_menu .drop_item{display: block;width: 100%; height: 55px; color: #232323;}
:lang(en) .dropdown .dropdown_menu .drop_item{height: auto;}
.dropdown .dropdown_menu .drop_item>a{display: block; } */
/* 
.equipment-tab,.customer-tab,.agent-tab{width: 400px;}
.equipment-tab li,.customer-tab li,.agent-tab li{width:50%;}

.product-tab{width: 500px;}
.product-tab li{width:33.333%;}


.company-bg{background: url(../img/sub/company-bg.jpg)no-repeat; background-size: cover; background-position: center; }
.product-bg{background: url(../img/sub/product-bg.jpg)no-repeat; background-size: cover; background-position: center; }
.facilities-bg{background: url(../img/sub/facilities-bg.jpg)no-repeat; background-size: cover; background-position: center; }
.customer-bg{background: url(../img/sub/customer-bg.jpg)no-repeat; background-size: cover; background-position: center; }
.contact-bg{background: url(../img/sub/contact-bg.jpg)no-repeat; background-size: cover; background-position: center; } */
 */

.page_btn{width: 35px;height: 40px; text-align: center; border-bottom: 2px solid #232323; font-weight: 600; font-size: 19px; margin: 50px auto 0 auto;}
/* ********************************************* *
    common_title
* ********************************************* */
/* .sub-body{padding:95px 0;}
.com-sub-title{padding-bottom: 76px;}
.com-sub-title>p{width: 100%; text-align: center; font-weight: 500; color: #bcbcbc; font-size: 1.1666rem; padding-bottom: 8px;}
.com-sub-title h2{font-size: 2.5rem; line-height: 1; text-align:center; padding-bottom: 15px; font-weight: 500; position: relative;}
.com-sub-title h2::after{content: "";position: absolute; bottom:-3px; left: 50%; z-index: -1; 
    transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%);
    width:50px; height:5px; background:url(../img/sub/title_line.png)no-repeat; background-position: center; background-size: contain; text-align: center; margin:32px auto 0 auto;}
 */
