@charset "utf-8";
select{font-family: inherit}
#skipToContent a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden; -webkit-transition: height .3s ease-in-out; -ms-transition: height .3s ease-in-out; -o-transition: height .3s ease-in-out; transition: height .3s ease-in-out}
#skipToContent a:focus,
#skipToContent a:active {width:100%;height:100px;background:#45597d;color:#fff;font-size:1.2857em;font-weight:bold;text-align:center;text-decoration:none;line-height:100px}

html{font-size:16px;}
select{-webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0px; -moz-border-radius: 0px; -webkit-border-radius: 0px; background-image: url(../images/common/ico_select.png); background-position: center right 15px; background-repeat: no-repeat;}
select::-ms-expand {
    display: none;
}
#wrap{min-width:1220px; }
.inner{max-width: 1200px; margin:0 auto;}
.inner:after{content: ""; display: block; clear: both;}

/*HEADER*/
header{}
header .headline{height: 3px; background-color: #0075bc; border-top: 1px solid #1b84c3; border-bottom: 1px solid #1b84c3;}
/*header .inner{position: relative;}*/
header h1{padding:17px 0 18px 0; display: inline-block; float: left;}
header h1 a{display: inline-block;}
header h1 img{width: 100%;}
header .nav_wrap{float:right; max-width: 980px; width: calc(100% - 140px);}
header .nav_wrap .gnb{padding:15px 0 11px 0; text-align: right;}
header .nav_wrap .gnb a{font-size: 0.813em; color: #0075bc; font-weight: 400;}
header .nav_wrap .gnb span{display: inline-block; width: 1px; height: 9px; background-color: #ccc; margin:0 5px;}
header .nav_wrap .lnb{position: relative;}
header .nav_wrap .lnb > ul{width: 100%;}
header .nav_wrap .lnb ul:after{content: ""; clear: both; display: block;}
header .nav_wrap .lnb > ul > li{float: left; width: 25%; height: 61px; display: table; position: relative; text-align:center;}
header .nav_wrap .lnb > ul > li > a{width: 100%; display: inline-block; font-size: 1.125em; color: #333; font-weight: 400; display: table-cell; vertical-align: middle;  padding-left: 10%; box-sizing: border-box;font-weight: 500;letter-spacing: -0.06em}
header .nav_wrap .lnb .submenu{position: absolute; left: 0; top: 61px; width: 100%; padding:0 0; height:200px; z-index: 1; display: none; opacity: 0; }
header .nav_wrap .lnb .submenu ul{}
header .nav_wrap .lnb .submenu li{width: 100%; height:35px}
header .nav_wrap .lnb .submenu li a{color: #666; font-size: 0.875em; display: inline-block; padding:3px 0 3px 10%; line-height:1.2em; box-sizing: border-box;}
header .nav_wrap .lnb .submenu li a:hover{color: #58af4c;}
header .nav_wrap .lnb .lang_wrap{width: 100px; font-size: 0.813em; font-weight: 300; color: #666; position: absolute; right: 0; top: 16px;}
header .nav_wrap .lnb .lang_wrap select{width: 100%; height: 2.5em; border: none; border-bottom: 3px solid #000; padding: 0 0 0 5px; background-position: center right 8px;}
#wrapper .m_lnb{display:none;height:calc(100vh - 13.88vw);background: #FFF;position: relative;width: 91.66vw;margin-left:30px}
#wrapper .m_lnb .m_bg{}
#wrapper .m_lnb > ul{width: 100vw;display: inline-block}
#wrapper .m_lnb > ul > li{padding:2.22vw 0 2.22vw;height:auto;font-size:5.4vw;font-weight: bold;font-stretch: normal;font-style: normal;line-height: normal;letter-spacing: normal;text-align: left;color: #070707;cursor: pointer}
#wrapper .m_lnb .submenu{display: none;}
#wrapper .m_lnb .submenu ul{padding: 0;list-style: none;display: none}
#wrapper .m_lnb .submenu li{height:auto;margin-top:2.77vw;font-size:4.4vw;font-weight: normal;font-stretch: normal;font-style: normal;line-height: 1.43;letter-spacing: -0.35vw;text-align: left;color: #3365ae;}
/*#wrapper .m_lnb .submenu li:last-child{border-bottom:0;}*/
#wrapper .m_lnb .submenu li a{color: #999;text-decoration: none;}
#wrapper .m_lnb .submenu li a:hover{color: #3365ae;}
#wrapper .m_lnb .submenu li a:active{color: #3365ae;}
header .lnb_bg{position: absolute; width: 100%; height: 0; background-color: #fff; left: 0; top: 100px; z-index: 1;}
header .lnb_bg .inner{height: 100%;background-color: #fff;}

/* ¸Þ´º º¯°æ Ãß°¡°Ç s */

header.bg_opacity .nav_wrap{float:right; max-width: 980px; width: calc(100% - 200px);}
header.bg_opacity .nav_wrap .lnb .lang_wrap select{width: 100%; height: 2.5em; color: #FFF;border: none; padding: 0 0 0 5px; background-position: center right 8px;background-color: transparent;background-image: url(../images/common/lang.png);}
header.bg_opacity .nav_wrap .lnb .lang_wrap select>option{color: #666;}
header.bg_opacity .lnb_bg{position: absolute; width: 100%; height: 0; background: rgba(25,25,30,.5); left: 0; top: 100px; z-index: 1;}
header.bg_opacity .lnb_bg .inner{height: 100%;background-color: initial;}
header.bg_opacity .nav_wrap .lnb > ul > li > a{width: 100%; display: inline-block; font-size: 1.125em; color: #FFF; display: table-cell; vertical-align: middle;  padding-left: 10%; box-sizing: border-box;letter-spacing: -0.06em;font-family:poppins}
header.bg_opacity .nav_wrap .lnb .submenu li a{color: #FFF; font-size: 0.875em; display: block; padding:7px 0 7px 10%; box-sizing: border-box;}

header.bg_opacity.active {background: #FFF!important;}
header.bg_opacity.active .nav_wrap .lnb .lang_wrap select{width: 100%; height: 2.5em; color: #666;border: none; padding: 0 0 0 5px; background-position: center right 8px;background-color: transparent;background-image: url(../images/common/ico_select.png);}
header.bg_opacity.active .nav_wrap .lnb .lang_wrap select>option{color: #666;}
header.bg_opacity.active .lnb_bg{position: absolute; width: 100%; height: 0; background: #FFF; left: 0; top: 100px; z-index: 1;}
header.bg_opacity.active .lnb_bg .inner{height: 100%;background-color: initial;}
header.bg_opacity.active .nav_wrap .lnb > ul > li > a{width: 100%; display: inline-block; font-size: 1.125em; color: #666; font-weight: 400; display: table-cell; vertical-align: middle;  padding-left: 10%; box-sizing: border-box;font-weight: 500;letter-spacing: -0.06em}
header.bg_opacity.active .nav_wrap .lnb .submenu li a{color: #666; font-size: 0.875em; font-weight: 300; display: block; padding:7px 0 7px 10%; box-sizing: border-box;}

/* ¸Þ´º º¯°æ Ãß°¡°Ç e */


.mbtn_wrap{display: none; position: absolute; top:50%; transform: translateY(-50%);}
.mbtn_wrap a{display: block; width: 38px; border: 1px solid #333; text-align: center;}
.mbtn_wrap span{display: block; width: 22px; height: 1px; background-color: #333; margin:8px auto 0;}
.mbtn_wrap span.bar_fst{}
.mbtn_wrap span.bar_snd{}
.mbtn_wrap span.bar_trd{margin-bottom: 8px;}

/*MAIN VISUAL*/
article.visual{}
article.visual .slide_wrap{}
article.visual .slide_wrap ul{}
article.visual .slide_wrap ul li.slick-slide{position: relative; /*padding-bottom: 6%;*/ padding-bottom: 599px; overflow: hidden;}
article.visual .slide_wrap ul li img{position: absolute; left: 50%; top: 0;height: 100%; max-width: none; transform: translateX(-50%); width: auto;}
article.visual .slide_wrap ul li .m{ display:none; }
article.visual .slide_wrap .slick-dots{margin: -50px 0 20px 0;}
article.visual .slide_wrap .slick-dots li{position: relative; margin:0 7px;}
article.visual .slide_wrap .slick-dots li button{width: 15px; height: 15px;}
article.visual .slide_wrap .slick-dots li button:before{border-radius: 0;}
article.visual .slide_wrap .slick-dots li.slick-active button:before{background-color: #0075bc;}
article.visual .slide_wrap .slick-dots li button:before{background-color: #e4e4e4;}

#container .main h2{font-size: 1.875em; color: #333; text-align: center; padding:55px 0 50px 0;letter-spacing: -0.03em;line-height: 1}

article.product{ background-color: #fff;}
article.product .prd_li_wrap{}
article.product .prd_li_wrap ul{}
article.product .prd_li_wrap ul:after{content: ""; clear: both; display: block;}
article.product .prd_li_wrap li{float: left; width: 33.3333%; text-align: center; border-top: 1px solid #dadada; border-right: 1px solid #dadada; border-bottom: 1px solid #dadada; box-sizing: border-box; transition: all .3s;}
article.product .prd_li_wrap li:first-child{border-left: 1px solid #dadada;}
article.product .prd_li_wrap li:hover{background-color: #f4f4f4;}
article.product .prd_li_wrap li .img{position: relative; padding-bottom: 55.141%; overflow: hidden;}
article.product .prd_li_wrap li .img img{position: absolute; top: 30%; left: 50%; transform: translateY(-50%) translateX(-50%);}
article.product .prd_li_wrap li .txt{}
article.product .prd_li_wrap li .txt .tit_prod{font-size: 1.125em; color: #333; font-weight: 400; margin-bottom: 25px;}
article.product .prd_li_wrap li .txt .desc_prod{font-size: 0.875em; color: #666; font-weight: 300; line-height: 1.51em; height: 80px;}
article.product .prd_li_wrap li .btn{margin-bottom: 10.5%;}
article.product .prd_li_wrap li .btn a{font-size: 0.875em; color: #666; font-weight: 300; display: inline-block; width: 174px; padding:10px 0; background-color: #fff; border: 1px solid #e4e4e4; transition: all .3s;}
article.product .prd_li_wrap li .btn a:hover{color: #fff; background-color: #0075bc; border: 1px solid #0075bc;}

article.rndcenter{padding-bottom:70px;}
article.rndcenter .rnd_con_wrap{background-image: url(../images/main/mainlabImg2.jpg); background-repeat: no-repeat; background-position: left; color: #333; height: 360px; margin-bottom: 20px;overflow: hidden;}
article.rndcenter .rnd_l_area{width: 66%; float: left; padding-right: 20px; box-sizing: border-box; overflow: hidden;}
article.rndcenter .rnd_r_area{width: 34%; float: right;}
article.rndcenter .rnd_tile{color: #fff; box-sizing: border-box;}

article.rndcenter .rnd_t2{background-color: #017863; height: 260px; background-image: url(../images/main/img_rnd02.png); background-position: right 30px bottom 30px; background-repeat: no-repeat;margin-bottom: 20px;}
article.rndcenter .rnd_t3{background-color: #333; height: 260px;  background-image: url(../images/main/img_rnd03.png); background-position: right 30px bottom 30px; background-repeat: no-repeat;}
article.rndcenter .rnd_t4{background-color: #3598c1; height: 260px; margin-bottom: 20px; background-image: url(../images/main/img_rnd04.png); background-position: right 30px bottom 30px; background-repeat: no-repeat;}

article.rndcenter .mov{}
article.rndcenter .mov iframe{ width:100%;height:440px; }


article.rndcenter .rnd_tile a{display: block; height: 100%; padding:20px 30px; box-sizing: border-box;letter-spacing: -0.06em}
article.rndcenter .rnd_tile .tit_rnd{font-size: 1.625em; font-weight: 400; position: relative; padding:18px 0;}
article.rndcenter .rnd_tile .tit_rnd:before{content: ""; width: 50px; height: 1px; background-color: #fff; position: absolute; bottom: 0; left: 0;}
article.rndcenter .rnd_t1 .tit_rnd:before{background-color: #333;}
article.rndcenter .rnd_tile .desc_rnd{font-size: 0.875em; font-weight: 300; line-height: 		1.643em; margin-top: 15px; word-break: keep-all;}
/*article.rndcenter .rnd_t1 .tit_rnd{width: 50%;}*/
article.rndcenter .rnd_t1 .desc_rnd{width: 50%;}

article.prcenter{padding-bottom: 70px; background-color: #fff;}
article.prcenter .pr_li_wrap{}
article.prcenter .pr_li_wrap:after{content: ""; display: block; clear: both;}
article.prcenter .pr_li_wrap .prgal_wrap{width: 50%; float: right; padding-left: 10px; box-sizing: border-box;}
article.prcenter .pr_li_wrap .prgal{width: 50%;float: left; box-sizing: border-box;padding-left: 10px;}
article.prcenter .pr_li_wrap .prgal_wrap .prgal:first-child{padding-left: 0; padding-right: 10px;}
article.prcenter .pr_li_wrap .prgal > a{display: block; box-shadow: 0px 1px 5px #efefef; border:1px solid #efefef;}
article.prcenter .pr_li_wrap .prgal .img{height: 235px; position: relative; overflow: hidden;}
article.prcenter .pr_li_wrap .prgal .img img{position: absolute; height: 100%; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%);}
article.prcenter .pr_li_wrap .prgal .txt{padding:20px;}
article.prcenter .pr_li_wrap .prgal .txt .tit_pr{font-size:1.125em; font-weight: 400; color: #3661ba; line-height: 1.389em; margin-bottom: 10px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; height: 50px;}
article.prcenter .pr_li_wrap .prgal .txt .desc_pr{color: #777; font-weight: 400;font-size: 0.875em; line-height:	1.643em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical; height: 134px;}
article.prcenter .pr_li_wrap .prgal .date{padding:0 20px 20px 20px;}
article.prcenter .pr_li_wrap .prgal .date p{font-size:0.938em; font-weight: 400; line-height:	1.533em; color: #999; overflow: hidden;text-overflow: ellipsis; white-space: nowrap; padding-left: 20px; background-image: url(../images/common/ico_clock.png); background-repeat: no-repeat; background-position: left center;}
article.prcenter .pr_li_wrap .prmov_wrap{width: 50%; float: left; padding-right: 10px; box-sizing: border-box;}
article.prcenter .pr_li_wrap .prmov_wrap > div{box-shadow: 0px 1px 5px #efefef; border:1px solid #efefef;}
article.prcenter .pr_li_wrap .prmov_wrap .mov{height: 393px;}
article.prcenter .pr_li_wrap .prmov_wrap .mov iframe{width: 100%; height: 100%;}
article.prcenter .pr_li_wrap .prmov_wrap .txt{padding:20px; box-sizing: border-box;}
article.prcenter .pr_li_wrap .prmov_wrap .txt .tit_pr{font-size:1.125em; font-weight: 400; color: #333; line-height: 1.389em; margin-bottom: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
article.prcenter .pr_li_wrap .prmov_wrap .txt .desc_pr{color: #777; font-weight: 400;font-size: 0.875em; line-height:	1.643em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; height: 44px;}

footer{}
footer .link_wrap{background-color: #f4f4f4; border-top: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4;}
footer .inner{position: relative;}
footer .privacy_wrap{height: 50px; display: table;}
footer .privacy_wrap a{font-size: 0.875em; font-weight: 400; color: #333; padding:0 20px; position: relative; display: table-cell; vertical-align: middle;}
footer .privacy_wrap a:first-child{padding-left: 0;}
footer .privacy_wrap a:before{content: ""; width: 1px; height: 12px; background-color: #ddd; position: absolute; left: 0; top: 19px;}
footer .privacy_wrap a:first-child:before{display: none;}
footer .famsite_wrap{display: inline-block; position: absolute;right: 0; top: 0;}
footer .famsite_wrap select{height: 50px; border: 1px solid #e4e4e4; border-top: 0; border-bottom: 0; font-size:0.875em; color: #333; font-weight: 400; width: 155px; padding-left: 18px; box-sizing: border-box; cursor: pointer;}
footer .famsite_wrap option{font-size: 1.3em;}
footer .foot_wrap{padding:30px 0; background-color: #fff;}
footer .foot_wrap:after{content: ""; display: block; clear: both;}
footer .foot_wrap .flogo_wrap{float: left; display: inline-block;}
footer .foot_wrap .flogo_wrap img{}
footer .address_wrap{float: left; padding-left: 5%; box-sizing: border-box;width: calc(100% - 270px);}
footer .address_wrap .row{font-size:0.875em; font-weight: 300; color: #666; margin-bottom: 6px;}
footer .address_wrap .row b{font-weight: 400; color: #333; width: 130px; display: inline-block;}
footer .address_wrap .copyright{color:#666; font-size:0.875em; font-weight: 300;margin-top: 13px; word-break: keep-all;}
footer .address_wrap .copyright span{font-weight: 500;}
footer .kosdaq_wrap{position: absolute;right: 0; top: 0;}
footer .kosdaq_wrap img{}
footer .btn_top_wrap{position: absolute; bottom: 40px; right: 0; display: none;}
footer .btn_top_wrap .btn_top{width: 63px; height: 63px; background-color: #000; background-image: url(../images/common/ico_top.png); background-repeat: no-repeat; background-position: center;}


.main{letter-spacing: -0.015em}

.companyintro{background-color:#4c75bf; cursor: pointer;}

.productintro{background-color:#84a33a; cursor: pointer;}

.qnaStyle{background-color:#474747; cursor: pointer;}

.point{cursor:pointer;}


