/*sidebar css*/
.search{
    border:2px solid #ffa500;
    border-radius:10px;
    width:100%;
}
.submit{
    border:2px solid #ffa500;
    border-radius:10%;
    background:#ffa500;
    margin-right:10px;
}
.slidebar-title{
    background:blue;
    color:blue;
}

/* 상단 로고 */
#header { position:fixed; left:0; right:0; top:0; width:%; height:93px; background:linear-gradient( rgba(39,60,117,1)30%,rgba(44,62,80,1)100%); z-index:51; }
#header > h1 { position:absolute; right:50%; top:50%; width:241px; height:70px; margin-right:-600px; background:url('/uploads/2c1b3095-a439-41ab-929a-760dcd7550fd.png') no-repeat center center; transform:translateY(-50%); }
#header > h1 > a { display:block; width:100%; height:100%; }
#header > h1 span { position:absolute; left:-9999px; top:-9999px; }
#header .btn_total { display:none; }

.header_sub { position:relative !important; width:100%; min-width:1200px; background:#fff !important; }
.header_sub > h1 { background:url('/uploads/2c1b3095-a439-41ab-929a-760dcd7550fd.png') no-repeat center center !important; }

.down_active { position:fixed !important; }

@media screen and (max-width:1200px){
	#header { }
	#header > h1 { right:0; margin-right:0; }
}
@media screen and (max-width:1024px){
	.header_sub { min-width:100%; }
	#header { height:50px; position:fixed !important }
	#header > h1 {  background-size:auto 100% !important; }
	#header .btn_total { font-family:"FontAwesome"; color:#fff; content:"\f0c9";position:absolute; display:block; right:10px; top:50%; width:30px; height:30px; box-sizing:border-box; transform:translateY(-50%); overflow:hidden; }
	#header .btn_total:after {  position:absolute; left:50%; top:50%; color:#fff; transform:translateX(-50%) translateY(-50%); }
	#header .btn_total > span { position:absolute; left:-9999px; top:-9999px; }

	.header_sub { background:#01AFC7 !important; }
	.header_sub > h1 { background:url('/eng/images/common/logo.png') no-repeat center center !important; }


.top_bar_fix{position:fixed; top:50px; left:0; width:100%; z-index:51;}
.wrap .top_fix_zone{}

}

#gn_area { position:absolute; display:block; box-sizing:border-box; z-index:52; }
#gn_area .side_menu_control { display:none; }
#gn_area .btn_sitemap { position:absolute; display:none; right:0; top:58%; width:22px; height:16px; background:url('/eng/images/common/icon_nav.png') no-repeat center center; }
#gn_area .btn_sitemap > span { position:absolute; left:-9999px; top:-9999px; }

.gn_sub_area .btn_sitemap { background:url('/eng/images/common/icon_nav_sub.png') no-repeat center center !important; }

@media all and (min-width:1024px) {
.gn_sub_area { position:absolute !important; display:block;}
.gn > li > a > span { position:absolute; display:block; width:100%;top:80%; right:-52px; transform:translateX(-50%) translateY(-70%);text-align:center!important;}
#footer .foot_link { position:absolute; height:37px; background:#f04e23;}
.footer_sub { min-width:100%; }
#gn_area { left:50%; margin-left:-500px; top:30px;}
.down-arrow-svgrepo{display:none;}
.para{margin-top:80px;}
.ft-menu{padding-left:10rem;}
.foot_link{width:160px;}
}
@media all and (max-width:1024px) {
.gn_sub_area { position:fixed !important; display:block; }
	.btn_sitemap { display:block; }
}

.top { position:relative; display:block; float:left; height:41px; margin:0; padding:0; z-index:11; }
.top:after { display:block; content:""; clear:both; }
.top > li { position:relative; float:left; height:100%; margin-left:20px; }
.top > li > a { display:block; font-size:75%; color:#fff; font-weight:300; line-height:41px; text-transform:uppercase; }
.top > li:nth-child(1) { }
.top > li:nth-child(2) { width:auto; min-width:70px; }
.top > li:nth-child(2) > span { display:block; width:100%; height:80%; line-height:41px; padding-left:5px; font-size:0.8125em; color:#fff; border-bottom:1px solid #fff; box-sizing:border-box; cursor:pointer; }
.top > li:nth-child(2) > span:after { position:absolute; right:10px; top:50%; transform:translateY(-50%); border-top:4px solid #fff; border-bottom:4px solid none; border-left:4px solid transparent; border-right:4px solid transparent; content:""; }
.top > li:nth-child(2) > ul { display:none; padding:5px; background:#333; overflow:hidden; }
.top > li:nth-child(2) > ul > li { }
.top > li:nth-child(2) > ul > li > a { display:block; padding:6px 0; font-size:0.75em; color:#ccc; }
.top > li:nth-child(2) > ul > li > a:hover { color:#fff; }

.top_sub > li > a { color:#333; }
.top_sub > li:nth-child(2) > span { color:#585857; border-bottom:1px solid #585857; }
.top_sub > li:nth-child(2) > span:after { border-top:4px solid #333; }


/* new     code     in  here  */

.gn > li > .sn > ul {display: none;width:150px;heihgt:400px}
.gn > li:hover > .sn > ul {display: block}
.gn .sn > ul > li:hover {background: #B3E8E5;padding: 3px;border-radius: 5px}

#footer .foot_link:hover {padding:6px; box-shadow:1px 2px 2px 2px #B3E8E5;}

#footer .foot_link:hover > .names {color:red;}


.gn > li:hover {box-shadow:5px 5px 15px 5px black;border-radius:4px}

/*new   code  in  here   */

.gn { clear:both; display:block; height:52px; margin:0; margin-right:80px; padding:0; z-index:10; }
.gn > li { position:relative; float:right; width:145px; height:100%; text-align:center; }
.gn > li > a { position:relative; display:block; width:100%; height:100%; font-size:1.2em; color:#fff;}
.gn > li > a > span { position:absolute; display:block; width:87%;top:68%; transform:translateX(-50%) translateY(-70%); text-align:right;font-weight:bold;}
.gn > li > a > span.main { color:#fff;}

.gn .sn { position:absolute; display:none; right:7px; top:49px; width:100%; height:250px; padding:15px 0; box-sizing:border-box; overflow:hidden }
.gn .sn > ul { }
.gn .sn > ul > li { }
.gn .sn > ul > li > a { display:block; padding:10px 5px; font-size:0.9375em; color:black; text-align:center;font-weight:bold;transition:all 0.5s ease; }
.gn .sn > ul > li > a:hover { color:#ff3300; font-size:1em;}

.gn_sub > li > a { color:#333; }
#gn_bg { position:absolute; display:none; left:0; top:93px; width:100%; height:230px; background:rgba(256,256,256,0.9); z-index:50; }

@media all and (max-width:1024px){
	#gn_area { display:none; right:0; width:auto; min-width:250px; height:100%; margin-right:0; background:#999; border-left:1px solid rgba(256,256,256,0.7); box-shadow:-3px 0 6px rgba(0,0,0,0.1); box-sizing:border-box; }
	#gn_area .side_menu_control { position:relative; display:block; padding:10px; background:#333; overflow:hidden;}
	#gn_area .side_menu_control > .btn_menu_close { position:relative; display:block; width:20px; height:20px; margin:0 0 0 auto; overflow:hidden; }
	#gn_area .side_menu_control > .btn_menu_close:after { position:absolute; left:50%; top:50%; font-family:"FontAwesome"; color:#999; content:"\f00d"; transform:translateX(-50%) translateY(-50%); }
	#gn_area .side_menu_control > .btn_menu_close span { position:absolute; left:-9999px; top:-9999px; }

	#gn_area .btn_sitemap { display:none; }

	.top { float:left; width:100%; height:auto; }
	.top > li { margin-left:0; }
	.top > li > a { line-height:auto; }
	.top > li:nth-child(1) { display:none; }
	.top > li:nth-child(2) { width:100%; min-width:auto; text-align:center; }
	.top > li:nth-child(2) > span { display:none; }
	.top > li:nth-child(2) > ul { display:block; width:100%; padding:0; background:transparent; }
	.top > li:nth-child(2) > ul > li { float:left; width:33.33%; border-right:1px solid rgba(256,256,256,0.5); box-sizing:border-box; }
	.top > li:nth-child(2) > ul > li:nth-last-child(1) { border-right:0; }
	.top > li:nth-child(2) > ul > li > a { display:block; padding:10px 0; font-size:0.75em; color:#fff; }

	.gn { height:auto; margin-right:0; border-top:1px solid rgba(256,256,256,0.5);background:gray; }
	.gn > li { float:none; width:auto; text-align:left; border-bottom:1px solid rgba(256,256,256,0.5); }
	.gn > li > a { padding:16px 10px; font-size:0.9375em; }
	.gn > li > a > span { position:relative; top:auto; color:black !important;font-weight:bold; transform:none;font-size:16px;}

	.gn .sn { position:relative; display:none; right:0; top:auto; height:auto; background:#fff; border-top:1px solid rgba(256,256,256,0.5); }
	.gn .sn > ul > li > a { padding:10px 20px; font-size:0.875em; text-align:right;font-weight:bold; }
	.gn .sn > ul > li a:before { margin-right:8px; content:"\-"; }
	#gn_bg { top:0; height:100%; }
}
/*@media all and (min-width:576px){*/
/*      .foot_btn{display: flex!important;}*/
/*      .logo-footer{display:none;}*/
/*}*/
@media all and (min-width:768px){
        .foot_btn{justify-content: center!important;}  
}
@media all and (max-width:576px){
	#footer .para span{margin-top:30px;}
	.ft-menu{flex: 0 0 auto; width: 100%; padding:1rem;}
	.para{padding:1rem;}
	.foot_link{left:0; margin-left:5px;}
	    #footer .foot_link{left:0;}
}


/* 사이트 중앙 컨텐츠 영역 */
#body { position:relative; display:block; width:100%; height:100%; padding-top:91px; box-sizing:border-box; overflow:hidden; }
#body > .body_left { display:block; float:left; width:71.91%; height:100%; box-sizing:border-box; overflow:hidden; }
#body > .body_right_up { display:block; float:left; width:28.09%; height:50%; box-sizing:border-box; overflow:hidden; }
#body > .body_right_down { display:block; float:left; width:28.09%; height:50%; box-sizing:border-box; overflow:hidden; }
#s_body { min-width:1200px; background:#fff; box-sizing:border-box; overflow:hidden; }
@media all and (max-width:1024px){
	#body { margin:0; padding:0; }
	#s_body { min-width:100%; padding-top:88px; }
	.s_area_1 { padding-top:35px !important; }
	.s_area_2 { padding-top:70px !important; }
	.s_area_3 { padding-top:13px !important; }
	.s_area_4 { padding-top:38px !important; }
}

/* 하단 */
#footer { width:100%; background:linear-gradient( rgba(39,60,117,1)30%,rgba(44,62,80,1)100%); z-index:51; }
#footer > .foot_inner { position:relative; display:block; width:auto; max-width:1200px; margin:0 auto; padding:20px 20.5% 20px 0 ; background:url('/eng/images/common/logo_footer.png') no-repeat; box-sizing:border-box;}
#footer .foot_btn {margin:10px; padding:0; overflow:hidden }
#footer .foot_btn > li { position:relative; float:right; }
#footer .foot_btn > li > a { display:block; width:100%; padding:10px 10px; font-size:81.25%; color:white; font-weight:700;transition:all 0.5s ease; }
#footer .foot_btn > li > a:hover{color:#f04e23;}
#footer .foot_btn > li:after { position:absolute; right:-2px; top:50%; width:2px; height:100%; background:url('/eng/images/common/foot_line.png') no-repeat right 50%; content:""; transform:translateY(-50%); }
#footer .foot_btn > li:nth-child(1) > a { padding-left:0;margin-left:10px; }
#footer .foot_btn > li:nth-last-child(1):after { display:none; }
#footer .foot_btn > li .privacy { color:#004F4F; }

#footer p { font-size:0.8rem; color:white!important; line-height:1.8; }
#footer p span{color:whitesmoke;}

#footer .foot_link { position:absolute; left:10px; top:15%; width:129px; height:37px;border-radius:16px; background:gray; z-index:20; }
#footer .foot_link > .names { position:relative; display:block; height:37px; line-height:37px; padding:0 21px; font-size:0.6rem; color:#fff; box-sizing:border-box; cursor:pointer; }
#footer .foot_link > .names:after { position:absolute; right:5px; top:50%; transform:translateY(-50%); border-top:4px solid #fff; border-bottom:4px solid none; border-left:4px solid transparent; border-right:4px solid transparent; content:""; }
#footer .foot_link > .family_link { position:absolute; display:none; left:0; top:-60px; width:100%; }
#footer .foot_link > .family_link li { position:relative; height:30px; line-height:30px; padding:0 10px; font-size:75%; background:#fff; border:1px solid lightblue; border-bottom:0; box-sizing:border-box; }
#footer .foot_link > .family_link li > a { display:block; width:100%; height:100%; color:black }
#footer .foot_link > .family_link li:hover { color:#333 !important; background:#f4f4f4; }
#footer .foot_link > .family_link li:hover > a { color:#000; }
.footer_sub { position:relative !important; min-width:1200px; border-top:1px solid #ccc !important; }

@media all and (max-width:1024px){
	#footer { clear:both; position:relative; box-shadow:0 -2px 3px rgba(0,0,0,0.1); }
	#footer > .foot_inner { min-width:100%; max-width:100%; padding:5px 10px !important;background-image:none!important; }

#footer .foot_link { position:absolute; height:37px; background:#gray;}
	.footer_sub { min-width:100%; }
}

/* 제품소개에 사용되는 제품 소개 레이어 */
.modal_layer { position:fixed; display:none; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:79; }
.product_layer { position:fixed; display:block; left:50%; top:50%; width:1100px; height:500px; margin:0; background:#fff; box-sizing:border-box; transform:translateX(-50%) translateY(-50%); z-index:-1; }
.product_layer > .btn_close { position:absolute; display:inline-block; right:50%; top:0; margin-top:-37px; margin-right:-475px; padding:10px 20px 10px 10px; font-size:15px; color:#fff; font-weight:400; letter-spacing:-0.02em; background:url('/eng/images/common/icon_close.png') no-repeat right 50%; overflow:hidden; }
.product_layer > .btn_close:hover { color:#e8fcbe; }

.product_layer > .btn_arrow { position:absolute; display:block; width:70px; height:70px; border-radius:50%; transform:translateY(-50%); overflow:hidden; }
.product_layer > .btn_arrow > span { position:absolute; left:-9999px; top:-9999px; }
.product_layer > .btn_arrow_left  { left:50%; top:50%; margin-left:-600px; background:rgba(256,256,256,0.3) url('/eng/images/common/icon_arrow_left.png') no-repeat center center; }
.product_layer > .btn_arrow_right { right:50%; top:50%; margin-right:-600px; background:rgba(256,256,256,0.3) url('/eng/images/common/icon_arrow_right.png') no-repeat center center; }

.layer_inner { position:relative; display:block; width:100%; height:100%; box-sizing:border-box; overflow:hidden; }
.layer_inner .bx-wrapper { height:100%; margin:0; }
.layer_inner .bx-viewport { height:100%; }
.layer_inner .lp_slide { display:block; list-style:none; height:100%; margin:0; padding:0; }
.layer_inner .lp_slide > li { position:relative; width:100%; height:100%; padding:30px; box-sizing:border-box; overflow:hidden; }

.lp_box { position:relative; display:block; width:100%; height:100%; padding-right:50%; box-sizing:border-box; overflow:hidden; }
.lp_box > header { margin-bottom:10px; box-sizing:border-box; }
.lp_box > header > h1 { font-size:1.75em; color:#f04e23; font-weight:500; letter-spacing:-0.02em; }
.lp_box > h2 { margin-bottom:30px; font-size:1.875em; color:#404040; font-weight:500; letter-spacing:-0.02em; box-sizing:border-box; }
.lp_box figure { position:absolute; right:0; top:0; width:55%; height:0; margin:0; padding-bottom:43%; border:1px solid #ddd; box-sizing:border-box; overflow:hidden; }
.lp_box figure > img { position:absolute; left:0; top:0; width:100%; height:100%; }
.lp_box p { line-height:1.7; word-break:keep-all; box-sizing:border-box; overflow:hidden; }

.lp_box p { line-height:1.7; word-break:keep-all; box-sizing:border-box; overflow:hidden;text-align:center;margin-top:10px;margin-right:50px; }
@media all and (max-width:1200px){
	.product_layer > .btn_arrow { width:30px; height:30px; border-radius:0; transform:none; }
	.product_layer > .btn_arrow_left  { left:0; top:-40px; margin:0; background-size:30%; }
	.product_layer > .btn_arrow_right { left:40px; top:-40px; margin:0; background-size:30%; }
}
@media all and (max-width:960px){
	.product_layer { width:90%; height:400px; }
	.product_layer > .btn_close { right:0; top:0; margin-right:0; }
	.lp_box { overflow-x:hidden; overflow-y:scroll; }
}

@media all and (max-width:733px){
	.s_area_4 { padding-top: 52px !important;}
}
@media all and (max-width:728px){
	.product_layer { width:90%; height:350px; }
}
@media all and (max-width:480px){
	.product_layer { width:90%; height:60%; }
	.lp_box { padding-right:0; }
	.lp_box > header > h1 { font-size:1.1em; }
	.lp_box > h2 { margin-bottom:10px; font-size:1.4em; }
	.lp_box figure { position:relative; left:auto; right:auto; top:auto; width:100%; height:auto; padding-bottom:0; }
	.lp_box figure > img { position:relative; left:auto; top:auto; width:auto; height:auto; max-width:100%; }
	.lp_box p { margin-top:20px; font-size:0.875em; line-height:1.7; }
	.foot_link{display:content;}
}

/* 모달 레이어 정의 */
.layer_popup { position:fixed; display:none; margin:0; padding:0 !important; background:#fff; overflow:hidden !important; z-index:1000; }
.layer_popup > iframe { width:100%; height:100%; box-sizing:border-box; overflow:hidden; }

/* 레이어 구성 */
.layer_box { display:block; width:100%; height:100%; box-sizing:border-box; overflow:hidden; }
.layer_box > header { display:none; }
.layer_box > .layer_cnt { display:block; overflow:hidden; }

.layer_box textarea {
	width:100%; height:358px; padding:10px; border:1px solid #ddd; box-sizing:border-box; overflow-y:auto; resize:none; outline:0;
	box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;
}
.layer_box .email_area { display:table; width:100%; height:300px; border-collapse:collapse; border-spacing:0; margin:0; padding:0; overflow:hidden; }
.layer_box .email_area .email_box { display:table-cell; width:100%; padding:30px 0; text-align:center; vertical-align:middle; overflow:hidden; }
.layer_box .email_area .email_box .big_txt { margin:0 5% 5%; font-size:1em; color:#222; font-weight:500; }
.layer_box .email_area .email_box .normal_txt { margin:0 5%; font-size:0.875em; color:#555; line-height:1.5; text-align:left; word-break:keep-all; }

.layer_box .sitemap { display:block; float:left; width:24%; height:auto; margin-right:1%; margin-bottom:1%; border:1px solid #ddd; overflow:hidden; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }
.layer_box .sitemap dt { padding:5px 5px; font-size:0.87em; color:#000; font-weight:700; text-align:left; border-bottom:1px dotted #b7b7b7; }
.layer_box .sitemap dd { margin:0; padding:5px 5px; }
.layer_box .sitemap dd > ul { display:block; list-style:none; margin:0; padding:0; overflow:hidden; }
.layer_box .sitemap dd > ul > li { display:block; margin:0; padding:0; overflow:hidden; }
.layer_box .sitemap dd > ul > li > a { display:block; padding:5px 5px; font-size:0.87em; color:#666; border-bottom:1px dotted #ddd; overflow:hidden; }
.layer_box .sitemap dd > ul > li:nth-last-child(1) a { border-bottom:0; }
.layer_box .sitemap:nth-child(4n+4) { margin-right:0; }

.layer_box .t_depth_menu { padding:7px 5px !important; background:#f4f4f4; }
.layer_box .t_depth_menu > li { display:block; margin:0; padding:0; overflow:hidden; }
.layer_box .t_depth_menu > li > a { display:block; padding:5px 5px; font-size:0.81em; color:#666;  overflow:hidden; }
.layer_box .t_depth_menu > li:nth-last-child(1) > a { border-bottom:0; }

.layer_box .f_depth_menu { padding:5px !important; background:#fff; }
.layer_box .f_depth_menu > li { display:block; margin:0; padding:0; overflow:hidden; }
.layer_box .f_depth_menu > li > a { display:block; padding:5px 5px; border-bottom:1px dotted #ddd; overflow:hidden; }
.layer_box .f_depth_menu > li:nth-last-child(1) > a { border-bottom:0; }

.ui-widget-overlay { background:rgba(0,0,0,0.7); }
@media(max-width:1024px){
 /*.ft-menu{padding:5px 40px;}*/
 /*.para{padding-top:20px;padding-right:50px;}*/
    .foot_btn{width:100%; display:flex;}
    .ft-menu{width:50%;}
    #footer .foot_btn{margin:0;}
}
@media(min-width:1025px){
    .logo-footer{display:none;}
    .roo{display:flex;}
    .foot_btn{width:66.66666667%; display:flex;}
    .footer-info{width:33.33333333%;}
    #footer .foot_link{left:auto;}
}