@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,700;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,700;1,700&display=swap');

html,body,section,article,header,footer,nav,div,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dd,dt,img,a,form,input,select,option,fieldset,textarea,button,label,figure,video {
	margin:0;
	padding:0;
	border:0;
	background-repeat:no-repeat;
	background-position:center;
	line-height:1;
	text-decoration:none;
	font-family:'Open Sans','Noto Sans KR','맑은 고딕',돋움,'Apple SD Gothic Neo',sans-serif;
	font-size:15px;
	font-weight:500;
	color:#191919;
	letter-spacing:-0.3px;
	box-sizing:border-box;
	text-size-adjust:none;
	list-style:none;
}
a:link, a:visited,
a:hover, a:focus, a:active {
	text-decoration:none;
}

table {width:100%; border-spacing:0; border-collapse:collapse;}

/* 폼초기화 */
select,button,input[type=text],input[type=submit],textarea	{
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	border-radius:0;
}

select	{	box-sizing:border-box;}
/*크롬사라피*/
@media screen and (-webkit-min-device-pixel-ratio:0){
	select	{	padding-right:22px !important;	background:url(../images/bg_select.png) no-repeat right center; background-size:contain;}
}
/*파이어폭스*/
@-moz-document url-prefix(){
	select	{	padding-right:22px !important;	background:url(../images/bg_select.png) no-repeat right center; background-size:contain;}
}

/*========= input ===========*/
.ip_comm	{display:block; width:100%; height:44px; padding:0 10px; border:0; background-color:transparent;  box-sizing:border-box; outline:none;}
.ip_comm.tel	{float:left; width:30%;}
.ip_comm.tel+.bar	{float:left; width:5%; text-align:center; line-height:44px; }
.set_tel	{overflow:hidden;}
select.ip_comm	{padding-right:0;}
textarea.ip_comm	{height:150px; padding:10px; line-height:1.5;}
.btn_sm	{display:block; height:46px; margin:0 auto; border:0; color:#fff;}

.cont_center	{width:1180px; margin:0 auto;}
.cont_center::after	{content:""; display:block; clear:both;}
.txt_hidden {position:absolute; left:-100%; top:-100%; overflow:hidden; width:0; height:0; font-size:0; text-indent:-9999%; line-height:0;}

#btn_nav{display:none; }
.btn_hbg {position:relative; display:block; width:24px; height:30px;}
.btn_hbg span {position:absolute; left:0; top:50%; display:block; width:100%; height:1px; background-color:#333; text-indent:-999%; font-size:0; line-height:0; transition:all 0.3s }
.btn_hbg span:before,
.btn_hbg span:after {content:""; position:relative; display:block; width:100%; height:1px; background-color:#333; transition:all 0.3s}
.btn_hbg span:before {top:-6px;}
.btn_hbg span:after {top:5px;}
.on .btn_hbg span {background-color:transparent;}
.on .btn_hbg span:before {top:0px; transform:rotate(45deg);}
.on .btn_hbg span:after {top:-1px; transform:rotate(-45deg);}

#wrapper {width:100%; position:relative; overflow:hidden; }


/*========= header ===========*/
#header .hd_top{height:100px; }
#header .hd_top h1{padding-top:20px; }

#nav {position:absolute; left:50%; top:0; }
#nav .nav_list	{text-align:center;}
#nav .nav_list>li	{display:inline-block; position:relative; margin-left:50px; }
#nav .nav_list>li .dep1	{position:relative; display:block; padding:40px 0;  font-size:20px; font-weight:600; color:#191919;}
#nav .nav_list>li .dep1:after	{content:""; display:block; position:absolute; left:50%; bottom:0; width:0; height:2px; background-color:#fd0000; transform: translate(-50%,0); transition:all 0.3s}
#nav .nav_list>li:hover .dep1{color:#fd0000; }
#nav .nav_list>li:hover .dep1:after	{width:100%;}
#nav .nav_list>li .dep2 {overflow:hidden; position:absolute; left:50%; top:100px; width:200px;  background-color:rgba(255,255,255,0.95); transform:translate(-50%,0); z-index:300; height:0; transition:all 0.5s;}
#nav .nav_list>li:hover .dep2 {height:auto; padding:12px 0;}
#nav .nav_list>li .dep2 li {}
#nav .nav_list>li .dep2 li a {display:block; padding:6px 0; text-align:center; font-size:14px; color:#666; letter-spacing:0; z-index: -1;}
#nav .nav_list>li .dep2 li a:hover {color:#fd0000; }

/*========= main ===========*/
#visual {position:relative; overflow:hidden;}
#visual .swiper-slide{height:600px; position:relative; }
#visual .v01 {background:url(/images/visual.jpg) no-repeat center;}
#visual .visu_txt{width: 100%; text-align: center; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); }
#visual .visu_txt h3{color:#fff; font-size: 45px; font-weight:700; font-family: 'Poppins', noto sans kr; font-style: italic; line-height: 1.45;}
#visual .visu_txt h3 span{margin-left: 5px; position: relative;}
#visual .visu_txt h3 span:before{content: ''; position: absolute; width: 104%; height: 50px; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fd0000; z-index: -1;}
#visual .visu_txt p{margin-top: 15px; text-align: center; font-size: 17px; color: #fff; font-weight: 400;}



#main01 {padding:90px 0; }
#main01 ul {display:flex; justify-content: space-between; align-items: flex-start; }
#main01 ul li {width:290px; }
#main01 ul li .img{width:100%; position:relative; height:120px; }
#main01 ul li .img .back{position:absolute; left:0; top:0; }
#main01 ul li .img .front{position:absolute; right: 5px; top:40px; height: 140px;}
/* #main01 ul li .img .front{position:absolute; right:0; top:20px; } */
#main01 ul li .img h3{position:absolute; left:30px; top:50px; font-size:24px; color:#fff; font-weight:700; text-shadow:0 0 10px rgba(0,0,0,0.4);  }
#main01 ul li a{display:inline-block; margin-top:30px; font-size:15px; color:#888; padding-bottom:10px; position:relative;  }
#main01 ul li a:after {content:""; display:block; width:100%; height:1px; background:#888; position:absolute; left:0; bottom:0; }

#main02 {background:url(/images/main_center_bg.jpg) no-repeat center; height:310px; }
#main02 .cont_center{height:310px; display:flex; justify-content: space-between; align-items: center; }
#main02 .left h3{font-size:26px; line-height:1.4; font-weight:700; }
#main02 .left a{font-size:15px; line-height:1.4; font-weight:500; color:#444; display:inline-block; margin-top:40px; position:relative; padding-bottom:10px; }
#main02 .left a:after {content:""; width:100%; height:1px; background:#444; position:absolute; left:0; bottom:0; }

#main02 .right .line{display:flex; justify-content: flex-start; align-items: flex-start;}
#main02 .right .line:first-child{margin-bottom:24px;  }
#main02 .right .line h5 {font-size:20px; color:#666; font-weight:700; margin-right:10px; padding-top:7px;  }
#main02 .right .line .info h4{font-size:32px; font-weight:700; font-family: 'Roboto', sans-serif; }
#main02 .right .line .info h6{font-size:17px; font-weight:400; margin-top:10px;  }
#main02 .right .line .info_btn{display:flex; justify-content: flex-start; align-items: flex-start;   }
#main02 .right .line .info_btn a{margin-right:5px;    }
#main02 .right .line .info_btn .kakao{ height:60px; background:#fbf823; width:220px; border-radius:5px; display:flex; justify-content: center; align-items: center;   }
#main02 .right .line .info_btn .kakao img{width:25px; margin-right:10px; }
#main02 .right .line .info_btn .kakao h3{font-size:18px; color:#3e2723; font-weight:600;  }

#main03 {text-align:center; padding:80px 0; }
#main03 h4{font-size: 28px; line-height:1.7; margin:24px 0; }
#main03 h4 span{font-weight:700;}
#main03 a{display:inline-block; height:60px; width:220px; background:#fd0000; line-height:60px; color:#fff; font-size:18px; font-weight:600; border-radius:5px; }


/*========= footer ===========*/
#footer {padding:60px 0; background-color:#000;}
#footer .info {text-align:left;}
#footer .info li {display:inline-block; margin-right:15px; line-height:22px; font-size:15px; color:#fff; font-weight:400;  }
#footer h2 { margin-bottom:10px; font-size:17px; color:#fff; font-weight:500; }
#footer .copyright {margin-top:14px; font-size:14px; font-weight:400; color:#888; }
#footer .copyright a {font-size:inherit; font-weight:inherit; color:inherit;}


/*========= sub ===========*/

#sub_visual { background:url(/images/sub_visual01.jpg) no-repeat center; height:300px; position:relative;}
#sub_visual .sub_menu_li {position:absolute; left:50%; bottom:0; transform:translateX(-50%); display:flex; justify-content: center; align-items: center; }
#sub_visual .sub_menu_li li {margin:0 30px; }
#sub_visual .sub_menu_li li a{font-size:20px; color:#fff; font-weight:400; padding-bottom:20px; display:block; }
#sub_visual .sub_menu_li li a.on{font-weight:700; position:relative;}
#sub_visual .sub_menu_li li a.on:after{ position:absolute; content:""; display:block; width:100%; height:3px; background:#fff; left:0; bottom:0;  }
#sub_visual h2{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); color:#fff; font-size:42px; font-weight:700; }

#sub_contents {padding:80px 0; }
#sub_menu {display:flex; justify-content: space-between; align-items: center; margin-bottom:70px; }
#sub_menu h2{font-size:32px; color:#191919; font-weight:600; }
#sub_menu .location{}
#sub_menu .location li{}

#sub_menu .location {display:flex; justify-content:flex-end; align-items: center; }
#sub_menu .location li {margin-left:5px; font-size:15px; color:#555; font-weight:400;  }
#sub_menu .location li::after {content:"-"; display: inline-block; margin:0 2px;}
#sub_menu .location li:last-child::after {display: none;}


.greet_tit {position:relative; padding:20px 0; }
.greet_tit h2{font-size:26px; color:#191919; font-weight:700; }
.greet_tit h4{font-size:40px; color:rgba(0,0,0,0.1); font-weight:700; font-family: 'Roboto', sans-serif; font-style: italic; position:absolute; left:40px; top:-10px; }
.greet_txt p {font-size:17px; color:#191919; line-height:1.8; margin-top:20px; }


/*연혁 sub0102*/
.hstr{position: relative; padding-left: 50px;}
.hstr:after{content: ''; position: absolute; left: 4px; top: 0; width: 1px; height: 100%; background: #f5f5f5; z-index: -1; }
.hstr>li{margin-bottom: 80px;}
.hstr li:last-child{margin-bottom: 0;}
.hstr h4{position: relative; font-size: 28px; font-weight: bold;}
.hstr h4:after{content: ''; position: absolute; top: 10px; left: -50px; width: 8px; height: 8px; background: #fd0000; border-radius: 25px;}
.hstr .dep{margin-top: 20px;}
.hstr .dep>li{display: flex; justify-content: flex-start; align-items: baseline;; margin-bottom: 15px;}
.hstr .dep .mth{margin-right: 20px; font-weight: 800; }
.hstr .dep p{line-height: 1.4; color: #444;}
.hstr .dep p span{font-weight: 700;}


.map_info {display:flex; justify-content: space-between; align-items: flex-start; margin-top:25px;}
.map_info ul{width:49%;  }
.map_info li{display:flex; justify-content:flex-start; align-items: flex-start; margin-bottom:5px; }
.map_info li h2{width:100px; height:50px; background:#fd0000; text-align:Center; color:#fff; font-size:17px; border-radius:6px;line-height:50px; }
.map_info li h5{width:calc(100% - 100px); height:50px; background:#f4f4f4; color:#191919; font-size:17px; border-radius:6px;line-height:50px; padding-left:20px; }

/*제품소개 tab 버튼 sub0201*/
.tab_list{display: flex; justify-content: center; align-items: center; margin: -16px -2px 40px;}
.tab_list a{display: flex; justify-content: center; align-items: center; margin: 0 2px; padding: 18px 22px; background: #f5f5f5; color: #aaa;}
.tab_list a.on{background: #fd0000; color: #fff;}


/* 제품소개 - 리스트 */
.pd_list {display:flex; flex-wrap:wrap;}
.pd_list > li {width:360px; margin-right:50px; margin-bottom:50px; border:1px solid #ddd; box-shadow:2px 2px 5px rgba(0,0,0,0.3); transition:0.3s}
.pd_list > li:hover {box-shadow:5px 5px 10px rgba(0,0,0,0.4);}
	.pd_list > li:nth-child(3n) {margin-right:0;}
.pd_list a {display: block;}
.pd_list img {display: block; width:100%; height:auto; border-bottom:1px solid #eee;}
.pd_list div {padding:30px 20px;}
.pd_list .tit {line-height:1.3; font-size: 17px; font-weight: 700; color: #222;}
.pd_list .ex {margin-top:10px; line-height:1.5; font-size: 13px; font-weight:400; color:#666;}
.pd_list .btn_more {padding:17px; background-color:#f4f4f4;  text-align: center; font-size: 14px; font-weight: 600; color:#222;}


/* 제품소개 - 뷰 */
.pd_view {display:flex; }
.pd_view .thumb {width:400px; height:400px; display:flex; align-items: center; justify-content: center; border:1px solid #ddd;}
.pd_view .thumb img {width:100%; height:auto;}
.pd_view article {width:calc(100% - 400px); padding-left:80px; padding-top:20px; }
.pd_view article h4 {font-size: 26px; font-weight: 700; color: #222;}
.pd_view .spec {}
.pd_view .spec li {position: relative; margin-bottom:12px; padding-left:25px; line-height:1.5; font-size: 16px; word-break: keep-all;}
.pd_view .spec li::before {position: absolute; left:0; top:0; content:"\f046"; font-family: 'FontAwesome'; color: #fd0000;}
.pd_view dl {margin-top:40px;}
.pd_view dl dt {margin-bottom:20px; font-size: 17px; font-weight: 700; color: #222;}
.pd_view dl dd{line-height: 1.4;}
.pd_view dl.download dd {display:flex; align-items: center;}
.pd_view dl.download dd a {display:inline-flex; align-items: center;  margin-right:5px; padding:15px 20px ; border-radius:5px; background-color:#222; font-weight: 600; color: #fff; box-shadow:1px 1px 3px rgba(0,0,0,0.4); transition:0.6s;}
.pd_view dl.download dd a:hover {box-shadow:1px 1px 5px rgba(0,0,0,0.5); transition:0.6s;}
.pd_view dl.download dd .down_catalog {background-color:#715CF3;}
.pd_view dl.download dd .down_spec {background-color:#00760C ;}
.pd_view dl.download dd .down_guide {background-color:#FF8F80 ;}
.pd_view dl.download dd i {margin-right:8px;}
#bo_v_atc p{line-height: 1.3;}


@media screen and (max-width: 1200px){
	#visual .visu_txt h3{font-size: 40px;}
}

/* 모달팝업 */
#modal-content {display:none;width:600px;max-width:90%;height:500px;box-shadow:0 5px 15px rgba(0, 0, 0, 0.5);background-color: #fff;border: 1px solid rgba(0, 0, 0, 0.2);border-radius: 0;outline: 0 none}
#modal-content .modal-header {height:20px;border-bottom:1px solid #e5e5e5;padding:15px}
#modal-content .modal-header h4 {margin:0;font:bold 18px 'Malgun Gothic';color:#5d5d5d}
#modal-content .modal-body {padding:15px}
#modal-content .modal-body .b-iframe {width:570px;max-width:100%;height:430px}
#modal-content .b-close{float:right;font:bold 21px Arial;line-height:1;color:#000;text-shadow:0 1px 0 #fff;opacity:.2;filter:alpha(opacity=20);padding:0;cursor:pointer;background:transparent;border:0;-webkit-appearance:none}
#modal-content .b-close:hover, #modal-content .b-close:focus{color:#000;text-decoration:none;cursor:pointer;opacity:.5;filter:alpha(opacity=50)}
p.modal-frame-content{width:550px;max-width:100%;height:400px;padding-right:5px;overflow-x:hidden;overflow-y:auto;font:normal 12px 'Malgun Gothic';color:#555;line-height:1.65em}
/*.popbtn {text-decoration:none;cursor:pointer;margin:0 5px}*/
.b-modal __b-popup1__ {max-width:100%}
#modal-content .modal-header,#modal-content .modal-body{box-sizing:content-box !important}

#modal-content2 {display:none; width:400px; height:560px; background:rgba(54,54,54,0.9); border-radius:4px; border:0px;}
#modal-content2 .modal-header {position:relative; height:28px;}
#modal-content2 .modal-body2 {padding:0;}
#modal-content2 .b-close{position:absolute;top:0;right:16px;font-size:40px;font-weight:900;font-family:Tahoma;color:#fff;opacity:.5;filter:alpha(opacity=50);padding:0;cursor:pointer;background:transparent;border:0;-webkit-appearance:none}
#modal-content2 .b-close:hover, #modal-content .b-close:focus{cursor:pointer;opacity:1;filter:alpha(opacity=100)}
#modal-content2 .modal-body2 .b-iframe {width:400px;height:560px;}