@charset "UTF-8";

/* Page Title */
body { width:100%; height:100%; padding:0px; margin:0px; background:#fff;  }
 
/*서브 BG*/
.sub_vi1  { width:100%; min-width:1100px; height:360px; float:left; background:url('/common/img/sub/sub_vi1.png') no-repeat top center; }
.sub_vi2  { width:100%; min-width:1100px; height:360px; float:left; background:url('/common/img/sub/sub_vi2.png') no-repeat top center; }
.sub_vi3  { width:100%; min-width:1100px; height:360px; float:left; background:url('/common/img/sub/sub_vi3.png') no-repeat top center; }
.sub_vi4  { width:100%; min-width:1100px; height:360px; float:left; background:url('/common/img/sub/sub_vi4.png') no-repeat top center; }

#sub_wrap  {width:1100px; margin:0 auto; }

.content_wrap {width:1100px; float:left; padding:70px 0px 30px 0px; box-sizing:border-box;}


.sub_t_line {width:35px; height:1px; background:#333; float:left; margin-left:48.5%; margin-top:-5px; }

#article {width:1200px; float:left; padding:0px 0 90px 0;}

.box_100  {width:100%; float:left;}
.box_20  {width:20% !important; float:left;}
.box_30  {width:30% !important; float:left;}
.box_40  {width:40% !important; float:left; background-color:#fff;}
.box_45  {width:45% !important; float:left;}
.box_50  {width:50% !important; float:left;}
.box_55  {width:55% !important; float:left;}
.box_60  {width:60% !important; float:left;}
.box_65  {width:65% !important; float:left;}
.box_70  {width:70% !important; float:left;}
.box_75  {width:75% !important; float:left;}
.box_80  {width:80% !important; float:left;}

.deco1  {font-size:1.15em; line-height:1.5em; font-weight:500; color:#333;}
.deco2  {font-size:2.2em; line-height:1.5em; font-weight:600; color:#333;}

.text_box  {font-size:16px; line-height:1.35em; font-weight:400; color:#555;}  

.text_box2  {font-size:15px; line-height:1.3em; font-weight:400; color:#555; width:100%; float:left;}  

.color1  {color:#054f98; }
.color2  {color:#777; }
.color3  {color:#ff9009;}
.color_b {color:#005a96;}
.color_r {color:#f00;}
.color_c00{color:#c00;}
.textarea_wrap {text-align:center; background-color:#f9f9f9; padding:14px 10px; box-sizing:border-box;}

.fw_500 {font-weight:500;}
.fw_600 {font-weight:600;}
.h4_tit {color:#333; font-size:17px; font-weight:500;}

.text_under {text-decoration:underline;}
.nomal_t  {font-size:0.95em; line-height:1.3em; font-weight:400; }

.border_bottom  {border-bottom:1px dashed #ddd;  padding-bottom:45px; margin-bottom:40px;  width:100%; float:left;}
.border_top  {border-top:1px dashed #ddd;  padding-top:45px; margin-top:40px;  width:100%; float:left;}

table.img_table  {width:100%; float:left;}
table.img_table td {text-align:center;  border:1px solid #fff;  vertical-align:middle;  }
table.img_table td.t1 {  background-color:#fff;  font-size:0.92em; line-height:1.2em; color:#333;  font-weight:600;  padding:7px 0 13px 0; }

.sub_content {width:760px; float:right; padding:0 0 0 35px; margin-top:-150px;}

.guide {width:100%; float:left; margin-bottom:8px;}
.guide .t1 {float:left;  font-size:30px;  font-weight:500; color:#333;  letter-spacing:-0.5px;}
.guide .t2 {float:right; font-size:17px; font-weight:600; color:#999; padding-top:10px; letter-spacing:0.5px; opacity:0.3;}

.guide_line1 {width:40%; float:left; height:2px; background:#f46f2e; margin-bottom:50px;}
.guide_line2 {width:60%; float:right; height:2px; background:#ddd; margin-bottom:50px;}

.h3_titcir {width:100%; display:flex; color:#333; font-weight:600; font-size:20px; margin-bottom:15px; align-items:center ; line-height:.9 ; gap:5px; float:left}
.h3_titcir:before {width:10px; height:10px; border-radius:50%; border:5px solid #f46f2e; flex-shrink:0; content:''}

.bg_tit {padding: 6px 12px; float:left; background:#333; color:#fff; box-sizing:border-box;}



/* 서브 왼쪽 메뉴 leftmenu */
#leftmenu	{width:260px; color: #fff; float:left; border:1px solid #ddd; box-sizing:border-box;}

.mn_title      		{width:260px; background:#333 url('/common/img/sub/box_pattern.png') no-repeat 0 0; padding:55px 0 15px 30px; box-sizing:border-box;}
.mn_title span		{font-size:16.5px; color:#999; text-align:left; letter-spacing:0.5px;}
.mn_title h2		{font-size:32px; font-weight:500; color:#fff; text-align:left;}
		  
/*#leftmenu ul				{background-color:#f6f6f6; border-top:1px solid #012a7e; border-bottom:1px solid #012a7e; margin-top:20px;}
#leftmenu li				{font-size:14px; color:#585858; line-height:50px; border-bottom:1px solid #e1e1e1; }
#leftmenu a				    {display:block; padding-left:20px;}
#leftmenu a:hover			{background:#012a7e; color:#fff;}
*/

#leftmenu ul,
#leftmenu ul li,
#leftmenu ul li a {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  line-height: 1;
  display: block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


#leftmenu > ul	{ border-bottom:0px solid #012a7e; }
#leftmenu ul ul { display: none;}

#leftmenu > ul > li.active2 > ul {display: block;}
.align-right {float: right;}

#leftmenu > ul > li > a {
  padding: 18px 22px;
  cursor: pointer;
  z-index: 2;
  font-size: 16px;
  letter-spacing:-1px;
  text-decoration: none;
  color: #777;
  background: #fff; 
  border-bottom:1px solid #e1e1e1;
  -webkit-transition: color .2s ease;
  -o-transition: color .2s ease;
  transition: color .2s ease;
}

#leftmenu > ul > li > a:hover {
  color: #fff ;
  background:#f7791d url('/../common/img/sub/left_menu_arr.gif') no-repeat center right 20px;  }

#leftmenu > ul > li >  a:hover		{color:#fff !important; } 
#leftmenu > ul > li >  a:link		{text-decoration:none;  } 
#leftmenu > ul > li >  a:active		{background:#f7791d; text-decoration:none; color:#fff; font-weight:600; }
#leftmenu > ul > li >  a:visited	{text-decoration:none; color:#777; }


#leftmenu > ul > li.ov >  a:hover		{background:#f7791d url('/../common/img/sub/left_menu_arr.gif') no-repeat center right 20px; text-decoration:none; color:#fff; } 
#leftmenu > ul > li.ov >  a:link		{background:#f7791d url('/../common/img/sub/left_menu_arr.gif') no-repeat center right 20px;  text-decoration:none; color:#fff; } 
#leftmenu > ul > li.ov >  a:active		{background:#f7791d; text-decoration:none; color:#fff; font-weight:500; }
#leftmenu > ul > li.ov >  a:visited		{background:#f7791d;text-decoration:none; color:#fff; }


/*
#aside li  a:link		{ color:#5f5f5f;}
#aside li  a:hover		{ background:url('/common/img/sub/mn_ov_bg.gif') no-repeat;     color:#fff; }
#aside li  a:active 	{ background:url('/common/img/sub/mn_ov_bg.gif') no-repeat;     color:#fff; }
#aside li  a:visited	{ color:#5f5f5f;}


#aside li.ov   a {}
#aside li.ov  a:link	{ background:#c00 url('/common/img/sub/mn_ov_bg.gif') no-repeat;     color:#fff; }
#aside li.ov  a:hover	{ background:#c00 url('/common/img/sub/mn_ov_bg.gif') no-repeat;     color:#fff; }
#aside li.ov  a:active	{ background:#c00 url('/common/img/sub/mn_ov_bg.gif') no-repeat;     color:#fff; }
#aside li.ov  a:visited	{ background:url('/common/img/common/mn_ov_bg.gif') no-repeat;     color:#fff; }
*/




#leftmenu ul > li.has-sub2 > a:after {
  position: absolute;
  right: 26px;
  top: 19px;
  z-index: 5;
  display: block;
  height: 10px;
  width: 2px;
  background: #efefef;
  content: "";
  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -ms-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}
#leftmenu ul > li.has-sub2 > a:before {
  position: absolute;
  right: 22px;
  top: 23px;
  display: block;
  width: 10px;
  height: 2px;
  background: #efefef;
  content: "";
  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -ms-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}
#leftmenu ul > li.has-sub2.open > a:after,
#leftmenu ul > li.has-sub2.open > a:before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}


#leftmenu > ul > li.active3 > ul {display: block;}

#leftmenu ul > li.has-sub3 > a:after {
  position: absolute;
  right: 26px;
  top: 19px;
  z-index: 5;
  display: block;
  height: 10px;
  width: 2px;
  background: #ddd;
  content: "";
  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -ms-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}
#leftmenu ul > li.has-sub3 > a:before {
  position: absolute;
  right: 22px;
  top: 23px;
  display: block;
  width: 10px;
  height: 2px;
  background: #ddd;
  content: "";
  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -ms-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}
#leftmenu ul > li.has-sub3.open > a:after,
#leftmenu ul > li.has-sub3.open > a:before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}


#leftmenu ul ul li a {
  padding: 14px 32px;
  cursor: pointer;
  z-index: 2;
  font-size: 14px;
  text-decoration: none;
  border-bottom:1px solid #e2e2e2;
  color: #777;
    background:#fff;
  -webkit-transition: color .2s ease;
  -o-transition: color .2s ease;
  transition: color .2s ease;
}

#leftmenu ul ul ul li a { padding-left: 32px;}

/* 작은 소메뉴 */
#leftmenu > ul  > li > ul > li a:link			{text-decoration:none;  } 
#leftmenu > ul  > li > ul > li a:active			{background:#fdf5e8; text-decoration:none; color:#333; font-weight:600; }
#leftmenu > ul  > li > ul > li a:visited		{text-decoration:none; color:#777; }
               
#leftmenu > ul > li > ul > li.ov  a:hover		{background:#fdf5e8; text-decoration:none; color:#333; } 
#leftmenu > ul > li > ul > li.ov  a:link		{background:#fdf5e8; text-decoration:none; color:#333; } 
#leftmenu > ul > li > ul > li.ov  a:active		{background:#fdf5e8; text-decoration:none; color:#333; font-weight:500; }
#leftmenu > ul > li > ul > li.ov  a:visited		{background:#fdf5e8; text-decoration:none; color:#333; }

#leftmenu ul ul li a:hover {color: #ffffff; background:#fdf5e8;}


/* 인사말 */
.greet_wrap h3{font-size:28px; font-weight:400; color:#333; margin-bottom:15px;}
.greet_wrap p{font-size:16px; color:#666; font-weight:300; line-height:1.65em; margin-bottom:30px;}
.greet_wrap span{font-size:16px; color:#333; font-weight:400; }

/* 회사개요 bg_img */
.info_bg_img	{background:url(/../common/img/sub/info_bg_logo.gif) no-repeat  right bottom; width:100%; float:left;}

/* 오시는길 */
.map_info_wrap {width:100%; float:left; background:#f7f7f7; padding:15px 20px; box-sizing:border-box;}


/* 안전시스템 */
.safety_wrap {width:100%; display:flex; flex-wrap:wrap; gap:30px 1%; }
.safety_wrap .safety_box  {width:49%; display:flex;  border:1px solid #ddd; border-radius:15px; overflow:hidden }

.safety_wrap .safety_box .safety_icon { width:28%;  text-align:center; background:#555; padding:25px 0; box-sizing:border-box; }
.safety_wrap .safety_box .safety_icon img {border-radius:30px; box-sizing:border-box; background:#fff; padding:5px;}
.safety_wrap .safety_box span.txt {width:72%; padding:22.5px;  box-sizing:border-box; color:#555;  display:flex; align-items:center}


.branch_wrap {width:100%; float:left; text-align:center;}
.branch_wrap div {width:31%; float:left; height:135px; padding-top:22px; background:#f7f7f7; margin-right:2%; border:1px solid #ddd;  box-sizing:border-box; }
.branch_wrap div:nth-child(3) {width:31%; float:right; height:135px; padding-top:22px;  background:#f7f7f7;  border:1px solid #ddd;  box-sizing:border-box; }

.branch_wrap div span {font-size:18px; font-weight:500; color:#333; margin-top:10px; display:block; line-height:1.2em;}


/* 설치방법 */
.install_wrap {width:100%; float:left; }

.install_box_wrap {width:100%; float:left; padding:30px 20px; box-sizing:border-box; }
.install_box_wrap span {position:absolute; width:100%; float:left; padding:12px 15px; box-sizing:border-box; background:#fff; color:#333; bottom:0; left:0;}

.install_box {position:relative; width:350px; height:300px; float:left; background:#cdf; }
.install_box li:first-child {position:absolute; width:100%; height:300px; top:0; left:0;  border:1px solid #ddd;}
.install_box li:last-child  {position:absolute; width:45px; line-height:45px; top:0; left:0; background:#333; color:#fff; text-align:center; box-sizing:border-box;}


/* 연기확산탬퍼 필요성 */
.acc_img_wrap{width:100%; float:left; padding:15px 20px; box-sizing:border-box;}
.acc_img_wrap.w33 div{width: 33.33%;padding: 0 10px;box-sizing:border-box;}
.acc_img_wrap.w33 div img{width: 100%;}
.acc_img_wrap div {position:relative; float:left; }
.acc_img_wrap div span{display: block;width:100%;  left:0; background:#f7f7f7; color:#333; font-size:0.95em; padding:12px 10px; box-sizing:border-box;}


.law_wrap {width:100%; float:left;  border:1px solid #ddd; }
.law_wrap>span {width:100%; float:left; font-weight:500; font-size:18px; background:#f7f7f7; color:#333; padding:15px; box-sizing:border-box;}
.law_wrap div {width:100%; float:left; background:#fff; color:#555; padding:15px; box-sizing:border-box; line-height:1.7em;}



/* 회사개요 - 연혁 */ 
.line { width:100%; float:left; border-top: 1px solid #a5a5a5; border-bottom:1px solid #ddd; margin-top: 0px; padding: 15px 2px; }

.com_history{}
.com_history ul li{position:relative; height:100%; margin:0px 0 0 0; padding:0px; list-style:none; }
.com_history ul li:after{content:""; display:block; float:none; clear:both;}

.com_history ul li div.history_y{position:absolute; width:70px; left:0px; font-size: 25px; font-weight: bold; color:#f7791d; margin-top:7px }

.com_history ul li ul {margin:0 0 0 95px; padding:10px 0; border-bottom:1px dotted #a5a5a5;}
.com_history ul li ul li{margin:0; padding:5px 0; line-height:22px; background:none;}

.com_history ul li ul li span.title02{display:inline-block; width:100px; float:left; text-indent:15px; font-weight:bold; font-size: 15px; /}
.com_history ul li ul li span.title03{display:inline-block; width:500px; float:left;   font-size: 15px; margin-bottom:20px;}

.com_history ul li ul li span.con, 
.com_history ul li ul li ul {display:inline-block;   margin:0; padding:0; line-height:22px;}
.com_history ul li ul li span.con{padding-left:0px; border:0;   font-size: 15px;letter-spacing:-0.5pt;}
.com_history ul li ul li ul{width:400px;}
.com_history ul li ul li ul li{margin:0; padding:2px 0 2px 10px; border:0;}


.com_history:last-child ul li ul {border-bottom:none}


/* 자료다운로드 버튼 */
.down_btn {width:100%; padding:18px 0 12px 0; text-align:center; border:1px solid #ddd; margin-bottom:35px; background:#f9f9f9;
		   display:block; float:left; vertical-align:middle; border-radius:7px; }
.down_btn:hover {background:#f0f0f0; display:block;}
.down_btn span {font-size:17px; line-height:1em; margin-left:10px; font-weight:500; color:#555;}



.patent {width:100%; display:flex; flex-wrap:wrap; gap:20px 10px;  }
.patent li {width:calc(33.333% - 8px); box-sizing:border-box;    }
.patent li div {width:100%; height:350px; overflow:hidden;  display:flex; align-items:flex-start; justify-content:center; border:1px solid #ddd; }
.patent li p {width:100%; font-size:16px;  line-height:1.4; color:#555;    box-sizing:border-box; padding:0 10px; margin-top:10px;  text-align:center;   }
.patent li img {width:100%}

.n_product_box {display:flex; width:100%;   justify-content:space-between}
.n_product_box .t { width:48%; }
.n_product_box .t h4 {font-size:1.4em;}
.n_product_box p {color:#f7791d; font-size:1.1em; border-bottom:1px solid #ddd; padding-bottom:16px} 
.n_product_box ul {margin-top:16px}
.n_product_box ul li {color:#555; margin-bottom:2px}
.n_product_box ul li.star {color:#f7791d;}
.n_product_box .img {border:1px solid #ddd; margin-top:5px; width:50%;  padding:20px 0; display:flex;  align-items:center;  justify-content:center}
.n_product_box .img img {max-width:90%}

.company4_flex_box_wrap {width:100%; float:left; margin-top:30px; display:flex; gap:20px; }
.company4_flex_box_wrap > div {width:50%; font-size:1.05em; color:#444;  background-color:#f5f5f5; box-sizing:border-box; padding:30px 25px}
.company4_flex_box_wrap > div b {font-weight:500; color:#222}
 