@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic|Nanum+Gothic+Coding&display=swap');
/*font-family: 'Nanum Gothic', sans-serif;
font-family: 'Nanum Gothic Coding', monospace;*/

/* 주황  : #ff8601
   파랑  : #1A59E9
*/

*{margin:0; padding:0}
li{list-style:none}
a{text-decoration:none}
img{border:none}

h1,h2,h3,h4,h5,h6,p,div,td,li,th,body,a{font-family: 'Nanum Gothic', sans-serif; font-weight:normal; font-size:14px} 

.bold_text{font-weight:bold}
.blue_text{color:#1A59E9}
.small_text{font-size:14px; color:#666}

@media all and (min-width:1201px) {

#header{position:fixed; height:80px; background-color:#FFF; width:100%; left:0; top:0;  z-index:9999; border-bottom:1px solid #000}
#header .header_wrap{position:relative;  margin:0 auto; background-color:#FFF}
#header .header_wrap h1{position: relative; height:80px; left:20px; top:10px}
#header .header_wrap #gnb{position:absolute; right:50px; top:0}
#header .header_wrap #gnb>ul{overflow:hidden}
#header .header_wrap #gnb>ul>li{float:left; width:120px; line-height:81px; text-align:center}
#header .header_wrap #gnb>ul>li>a{color:#000}
/*#header .header_wrap #gnb>ul>li:hover{; background-color:#00bbe4; color:#FFF}
#header .header_wrap #gnb>ul>li:hover .sub_gnb{border-left:1px solid #00bbe4; border-right:1px solid #00bbe4}*/
#header .header_wrap #gnb>ul>li>.sub_gnb{height:325px; background-color:#FFF;  display:none; box-sizing:border-box; overflow:hidden}
#header .header_wrap #gnb>ul>li>.sub_gnb>li>a{font-size:13px; line-height:25px; color:#333; display:block}
#header .header_wrap #gnb>ul>li>.sub_gnb>li>a:hover{ font-weight:bold}

#m_gnb{display:none}
.mob_open{display:none}

#sub_top{position:relative; height:400px; margin-top:80px}
#sub_top h2{color:#FFF; font-size:40px; text-align:center; line-height:400px; text-shadow:2px 2px 4px rgba(0,0,0,0.5)}
#contents{position:relative; width:100%; overflow:hidden}
#contents h3{font-size:20px; font-weight:bold; padding:20px 10px}
#contents h4{font-size:28px; margin-bottom:40px}
#contents .history h5{font-size:30px; margin-bottom:30px; margin-top:30px}
#contents p{font-size:16px; line-height:1.6em; text-align:justify; margin-bottom:1.6em}
#contents .about p::first-letter{margin-left:14px}
.lnb{position:relative; width:1200px; margin:0 auto; margin-top:-30px; background-color:#FFF}
.lnb>ul{overflow:hidden}
.lnb>ul>li{float:left; width:25%; border: 1px solid #222; border-left:none; box-sizing:border-box}
.product_lnb>ul>li{float:left; width:7.69%; border: 1px solid #222; border-left:none; box-sizing:border-box}
.lnb>ul>li a.select_lnb {background-color:#222; color:#FFF}
.lnb>ul>li:first-child{border-left:1px solid #222}
.lnb>ul>li>a{display:block; line-height:60px; text-align:center; color:#000}
.lnb>ul>li>a:hover{background-color:#222; color:#FFF}
.about_top{background-image:url(../img/about_top.jpg); background-position:center; background-repeat:no-repeat}
.windows_top{background-image:url(../img/windows_top.jpg); background-position:center; background-repeat:no-repeat}
.door_top{background-image:url(../img/door_top.jpg); background-position:center; background-repeat:no-repeat}
.inner_top{background-image:url(../img/inner_top.jpg); background-position:center; background-repeat:no-repeat}
.product_top{background-image:url(../img/product_top.jpg); background-position:center; background-repeat:no-repeat}
.about{position:relative; width:1200px; margin:50px auto; padding:30px 10px}
.history{position:relative; width:1200px; margin:50px auto; padding:30px 10px}
.history ul li{line-height:40px; border-bottom:1px solid #EEE}
.case{position:relative; width:1200px; margin:50px auto; padding:30px 10px}
.location{position:relative; width:1200px; margin:50px auto; padding:30px 10px}
.location .map{margin-bottom:1.6em}

.product{position:relative; width:1200px; margin:50px auto; padding:30px 10px}
.product_wrap{position:relative}
.product_list{position:relative; overflow:hidden}
.product_list li{float:left; width:32%; margin-left:2%; margin-bottom:2%; border:1px solid #EEE; box-sizing:border-box; cursor:pointer}
.product_list li img{width:100%}
.product_list li:nth-child(3n+1){margin-left:0}
.product_list li h5{text-align:center; line-height:50px }

.product_lightbox h5{  text-align:center; line-height:30px; margin-bottom:10px }
.product_lightbox{ position:fixed; width:100%; height:100%; left:0; top:0; background-color:rgba(0,0,0,0.5); z-index:9999; display:none}
.product_lightbox .light_innerbox{position:absolute; width:800px; height:400px; overflow:hidden; left:50%; top:50%; margin-left:-420px; margin-top:-220px; padding:20px; background-color:#FFF}
.product_lightbox .light_innerbox>li{position:absolute; left:20px; top:20px; width:800px}
.product_lightbox .light_img{width:60%; float:left}
.product_lightbox .light_img img{width:100%}
.product_lightbox .light_text{width:38%; float:right}
.product_lightbox .light_text li{line-height:50px; border-bottom:1px solid #CCC }
.product_lightbox .laminateLi li{line-height:25px; border-bottom:1px solid #CCC }
.product_lightbox .light_text li:first-child{border-top:1px solid #CCC}
.product_lightbox .light_text span{color:#D04A4C; font-weight:bold}
.product_lightbox .prev_btn{position:absolute; left:50%; margin-left:-480px; top:50%; margin-top:-20px; cursor:pointer}
.product_lightbox .next_btn{position:absolute; left:50%; margin-left:440px; top:50%; margin-top:-20px; cursor:pointer}
.product_lightbox .close_btn{position:absolute; left:50%; top:50%; margin-top:-280px ; cursor:pointer}
.product_lightbox .button_wrap{margin-top:30px}
.product_lightbox .email, .product_lightbox .tel{padding:10px; background-color:#ff8601; color:#FFF; border:none;;}
.product_lightbox .tel{display:none}


#contents .win_product_wrap{position:relative}
#contents .product_list li h5 a{ color:#000 }
#contents .sum_img{overflow:hidden; margin-bottom:50px; border:1px solid #CCC}
#contents .sum_img>img{float:left; width:500px}
#contents .sum_img .product_info{position:relative; float:right; width:698px; padding:20px; box-sizing:border-box}
#contents .sum_img .product_info h5{line-height:50px; font-size:1.6em; font-weight:bold; border-bottom:1px solid #cccccc}
#contents .sum_img .product_info p{line-height:50px; font-size:1.4em; border-bottom:1px solid #cccccc}
#contents .sum_img .product_info ul{margin-bottom:30px; border-bottom:1px solid #cccccc}
#contents .sum_img .product_info li{line-height:35px}

#contents .sum_img .product_info li span{color:#D04A4C; font-weight:bold}
#contents .win_img img{width:100%; max-width:1024px; display:block; margin:0 auto}
#contents .sum_img .email,#contents .sum_img .tel{padding:10px; background-color:#ff8601; color:#FFF; border:none;}
#contents .sum_img .tel{display:none}
#contents .list_page_go a{position:absolute; right:0; top:-40px; background-color:#D04A4C; color:#FFF; width:40px; height:40px; text-align:center; line-height:40px; font-size:0.8em}
#contents .sum_img .screen_info{overflow:hidden}
#contents .sum_img .screen_info li{float:left; width:14.28%;text-align:center; font-size:12px}
#contents .sum_img .screen_info li img{ width:100%}
#contents .screen_img img{ display:block; margin:30px auto}

#contents .parthner_list{overflow:hidden}
#contents .parthner_list li{float:left; width:20%;  box-sizing:border-box; overflow:hidden; padding-top:10px}
#contents .parthner_list li img{ display:block; margin:0 auto; border:1px solid #CCC; transition-duration:0.2s}
#contents .parthner_list li:hover img{transform:scale(1.1,1.1)}
#contents .parthner_list li h5 a{text-align:center; line-height:45px; display:block; color:#333; font-weight:bold}

#contents .door_list{position:relative; overflow:hidden}
#contents .door_list li{float:left; width:19.2%; margin-left:1%; margin-bottom:1%; border:1px solid #EEE; box-sizing:border-box; cursor:pointer}
#contents .door_list li img{width:100%}
#contents .door_list li:nth-child(5n+1){margin-left:0}
#contents .door_list li h5{  text-align:center; line-height:50px; }

.door_lightbox h5{text-align:center; line-height:30px; margin-bottom:10px }
.door_lightbox{ position:fixed; width:100%; height:100%; left:0; top:0; background-color:rgba(0,0,0,0.5); z-index:9999; display:none}
.door_lightbox .light_innerbox{position:absolute; width:500px; height:530px; overflow:hidden; left:50%; top:50%; margin-left:-270px; margin-top:-270px; padding:20px; background-color:#FFF}
.door_lightbox .light_innerbox>li{position:absolute; left:20px; top:20px; width:800px}
.door_lightbox .prev_btn{position:absolute; left:50%; margin-left:-480px; top:50%; margin-top:-20px; cursor:pointer}
.door_lightbox .next_btn{position:absolute; left:50%; margin-left:440px; top:50%; margin-top:-20px; cursor:pointer}
.door_lightbox .close_btn{position:absolute; left:50%; top:50%; margin-top:-320px ; cursor:pointer}
.door_lightbox .button_wrap{position:relative; margin-left:40px}
.door_lightbox .email, .door_lightbox .tel{padding:10px; background-color:#ff8601; color:#FFF; border:none;}
 .door_lightbox .tel{display:none}


.contact_wrap{position:relative; width:96%; margin:0 auto}
.contact_wrap span.red_text{color: #F00; font-weight: bold}
.contact_wrap>form{margin-top:20px}
.contact_wrap>form>table{width:95%}
.contact_wrap>form>table td{padding:5px;}
.contact_wrap>form>table td.td_label{width:70px; font-size: 12px; font-weight: bold;  color:#626262}
.contact_wrap>form>table td.td_box>input{width:100%; height: 25px; padding:5px; border:1px solid #CCC}
.contact_wrap>form>table td.td_box>textarea{width:100%; height:100px; padding:5px; border:1px solid #CCC}
.contact_wrap>form>table td.td_box>textarea.info{font-size:11px; color:#626262}
.contact_wrap>form>table td.agree{text-align:center; font-size: 12px}
.contact_wrap>form>table td.agree>input{vertical-align: bottom}
.contact_wrap>form>table td.agree>label{vertical-align: top; margin-left:5px; font-weight: bold}
.contact_wrap>form>table td.send{text-align: center; padding-right:20px}
.contact_wrap>form>table td.send>input{width: 100px; height: 30px; margin-top: 20px; border: 2px solid #2d95f9; background-color:#FFF; border-radius: 5px;}

/*.door_list{overflow:hidden}
.door_list>li{float:left; width:19%; margin-left:1%; margin-bottom:2%; border:1px solid #EEE; box-sizing:border-box; cursor:pointer; padding-top:1%}
.door_list>li:first-child{margin-left:0}
.door_list>li img{width:90%; display:block; margin:0 auto }
.door_list>li h5{  text-align:center; line-height:50px; }
.door_list>li h5 span{font-size:12px; color:#666}

.door_lightbox h5{  text-align:center; line-height:30px; margin-bottom:10px }
.door_lightbox{ position:fixed; width:100%; height:100%; left:0; top:0; background-color:rgba(0,0,0,0.5); z-index:9999; display:none}
.door_lightbox .light_innerbox{position:absolute; width:500px; height:550px; overflow:hidden; left:50%; top:50%; margin-left:-270px; margin-top:-295px; padding:20px; background-color:#FFF}
.door_lightbox .prev_btn{position:absolute; left:50%; margin-left:-480px; top:50%; margin-top:-20px; cursor:pointer}
.door_lightbox .next_btn{position:absolute; left:50%; margin-left:440px; top:50%; margin-top:-20px; cursor:pointer}
.door_lightbox .close_btn{position:absolute; left:50%; top:50%; margin-top:-350px ; cursor:pointer}
.door_lightbox .button_wrap{margin-top:30px}
.door_lightbox .email, .door_lightbox .tel{padding:10px; background-color:#ff8601; color:#FFF; border:none;;}
*/

.inner_gate_wrap{position:relative; }
.inner_gate_wrap .inner_gate_product {position:relative; height:650px}
.inner_gate_wrap .inner_gate_product .inner_bg{position:absolute; width:1200px; height:650px; left:50%; top:0 ; margin-left:-600px}
.inner_gate_wrap .inner_gate_product .inner_bg .inner_img{position:absolute; left:592px; top:16px}
.inner_gate_wrap .inner_gate_product .inner_bg .inner_glass{position:absolute; left:592px; top:16px}
.inner_gate_wrap .inner_gate_product .glass_list{position:absolute; left:50%; margin-left:-250px; bottom:50px; overflow:hidden}
.inner_gate_wrap .inner_gate_product .glass_list li{width:50px; height:50px; line-height:50px; background-color:#FFF; border-radius:30px; text-align:center; margin-right:5px; font-size:12px; float:left; cursor:pointer; box-shadow:0 2px 3px rgba(0,0,0,0.5)}
.inner_gate_wrap .inner_gate_product .glass_list li.select_lnb {background-color:#222; color:#FFF}
.inner_gate_wrap .inner_list_wrap{position:relative; margin-top:-20px}
.inner_gate_wrap .inner_list_wrap ul{overflow:hidden; width:600px; margin:0 auto}
.inner_gate_wrap .inner_list_wrap ul li{float:left; width:120px; border:1px solid #000; line-height:50px; text-align:center; box-sizing:border-box; border-left:0}
.inner_gate_wrap .inner_list_wrap ul li a{ background-color:#FFF; color:#000;  line-height:50px; text-align:center;  display:block}
.inner_gate_wrap .inner_list_wrap ul li:first-child a{border-left:1px solid #000}
.inner_gate_wrap .inner_list_wrap ul li a:hover{ background-color:#000; color:#FFF}
.inner_gate_wrap .inner_list_wrap ul li a.select_lnb {background-color:#222; color:#FFF}
.inner_gate_wrap  .inner_detial img{display:block; margin:0 auto}


.top_btn a{position:fixed; right:100px; bottom:100px; background-color:#00bbe4; color:#FFF; width:40px; height:40px; text-align:center; line-height:40px; border-radius:20px; font-size:0.8em}

#footer{position:relative;background-color:#222222; color:#FFF; padding:50px 0; line-height:30px; font-size:12px}
#footer .footer_wrap{position:relative; width:1200px; margin:0 auto; overflow:hidden}
#footer .footer_left{position:relative; width:50%; float:left} 
#footer .footer_left address{font-style:normal}
#footer #footer_nav{position:relative; float:right; width:50%}
#footer #footer_nav>ul{overflow:hidden}
#footer #footer_nav>ul>li{float:left}
#footer #footer_nav>ul>li a{color:#FFF; line-height:20px; font-size:12px; display:block; text-align:center; padding:0 20px; margin-bottom:10px}
#footer #footer_nav>ul>li a:hover{color:#CCC}
#footer #footer_nav>ul>li>a{font-size:13px; font-weight:bold; line-height:13px; border-left:1px solid #FFF}
#footer #footer_nav>ul>li:first-child>a{border-left:0}
#footer #footer_nav>ul>li>ul>li{height:20px}

}

@media all and (min-width:601px) and (max-width:1200px) {

#header{position:fixed; height:80px; background-color:#FFF; width:100%; left:0; top:0;  z-index:9999; border-bottom:1px solid #000}
#header .header_wrap{position:relative;  margin:0 auto; background-color:#FFF}
#header .header_wrap h1{position: relative; height:80px; left:20px; top:20px}
#header .header_wrap h1 img{height:40px}
#header .header_wrap #gnb{position:absolute; right:50px; top:0}
#header .header_wrap #gnb>ul{overflow:hidden}
#header .header_wrap #gnb>ul>li{float:left; width:100px; line-height:81px; text-align:center}
#header .header_wrap #gnb>ul>li>a{color:#000; font-size:13px}
/*#header .header_wrap #gnb>ul>li:hover{; background-color:#00bbe4; color:#FFF}
#header .header_wrap #gnb>ul>li:hover .sub_gnb{border-left:1px solid #00bbe4; border-right:1px solid #00bbe4}*/
#header .header_wrap #gnb>ul>li>.sub_gnb{height:326px; background-color:#FFF;  display:none; box-sizing:border-box}
#header .header_wrap #gnb>ul>li>.sub_gnb>li>a{font-size:13px; line-height:25px; color:#333; display:block}
#main_top{position:relative; width:100%; height:1080px; overflow:hidden }
#header .header_wrap #gnb>ul>li>.sub_gnb>li>a:hover{ font-weight:bold}

#m_gnb{display:none}
.mob_open{display:none}


#sub_top{position:relative; height:400px; margin-top:80px}
#sub_top h2{color:#FFF; font-size:40px; text-align:center; line-height:400px; text-shadow:2px 2px 4px rgba(0,0,0,0.5)}
#contents{position:relative; width:100%; overflow:hidden}
#contents h3{font-size:20px; font-weight:bold; padding:20px 10px}
#contents h4{font-size:28px; margin-bottom:40px}
#contents .history h5{font-size:30px; margin-bottom:30px; margin-top:30px}
#contents p{font-size:16px; line-height:1.6em; text-align:justify; margin-bottom:1.6em}
#contents .about p::first-letter{margin-left:14px}
.lnb{position:relative; width:96%; margin:0 auto; margin-top:-30px; background-color:#FFF}
.lnb>ul{overflow:hidden}
.lnb>ul>li{float:left; width:25%; border: 1px solid #222; border-left:none; box-sizing:border-box}
.product_lnb>ul{border-top:1px solid #000}
.product_lnb>ul>li{float:left; width:14.28%; border: 1px solid #222; border-left:none; border-top:none; box-sizing:border-box}
.lnb>ul>li a.select_lnb {background-color:#222; color:#FFF}
.lnb>ul>li:first-child,.lnb>ul>li:nth-child(8) {border-left:1px solid #222}
.lnb>ul>li>a{display:block; line-height:60px; text-align:center; color:#000}
.lnb>ul>li>a:hover{background-color:#222; color:#FFF}
.about_top{background-image:url(../img/about_top.jpg); background-position:center; background-repeat:no-repeat}
.windows_top{background-image:url(../img/windows_top.jpg); background-position:center; background-repeat:no-repeat}
.door_top{background-image:url(../img/door_top.jpg); background-position:center; background-repeat:no-repeat}
.inner_top{background-image:url(../img/inner_top.jpg); background-position:center; background-repeat:no-repeat}
.product_top{background-image:url(../img/product_top.jpg); background-position:center; background-repeat:no-repeat}
.about{position:relative; width:98%; margin:50px auto; padding:30px 0px}
.history{position:relative; width:98%; margin:50px auto; padding:30px 0px}
.history ul li{line-height:40px; border-bottom:1px solid #EEE}
.case{position:relative; width:98%; margin:50px auto; padding:30px 0px}
.location{position:relative; width:98%; margin:50px auto; padding:30px 0px}
.location .map{margin-bottom:1.6em}

.product{position:relative; width:96%; margin:50px auto; padding:10px}
.product_wrap{position:relative}
.product_list{position:relative; overflow:hidden}
.product_list li{float:left; width:32%; margin-left:2%; margin-bottom:2%; border:1px solid #EEE; box-sizing:border-box; cursor:pointer}
.product_list li img{width:100%}
.product_list li:nth-child(3n+1){margin-left:0}
.product_list li h5{  text-align:center; line-height:50px; }

.product_lightbox h5{  text-align:center; line-height:30px; margin-bottom:10px }
.product_lightbox{ position:fixed; width:100%; height:100%; left:0; top:0; background-color:rgba(0,0,0,0.5); z-index:9999; display:none}
.product_lightbox .light_innerbox{position:absolute; width:800px; height:400px; overflow:hidden; left:50%; top:50%; margin-left:-420px; margin-top:-220px; padding:20px; background-color:#FFF}
.product_lightbox .light_innerbox>li{position:absolute; left:20px; top:20px; width:800px}
.product_lightbox .light_img{width:60%; float:left}
.product_lightbox .light_img img{width:100%}
.product_lightbox .light_text{width:38%; float:right}
.product_lightbox .light_text li{line-height:50px; border-bottom:1px solid #CCC }
.product_lightbox .laminateLi li{line-height:25px; border-bottom:1px solid #CCC }
.product_lightbox .light_text li:first-child{border-top:1px solid #CCC}
.product_lightbox .light_text span{color:#D04A4C; font-weight:bold}
.product_lightbox .prev_btn{position:absolute; left:50%; margin-left:-480px; top:50%; margin-top:-20px; cursor:pointer}
.product_lightbox .next_btn{position:absolute; left:50%; margin-left:440px; top:50%; margin-top:-20px; cursor:pointer}
.product_lightbox .close_btn{position:absolute; left:50%; top:50%; margin-top:-280px ; cursor:pointer}
.product_lightbox .button_wrap{margin-top:30px}
.product_lightbox .email, .product_lightbox .tel{padding:10px; background-color:#ff8601; color:#FFF; border:none;}
 .product_lightbox .tel{display:none}


#contents .win_product_wrap{position:relative}



#contents .product_list li h5 a{ color:#000 }
#contents .sum_img{overflow:hidden; margin-bottom:50px; border:1px solid #CCC}
#contents .sum_img>img{float:left; width:50%}
#contents .sum_img .product_info{position:relative; float:right; width:50%; padding:20px; box-sizing:border-box}
#contents .sum_img .product_info h5{line-height:50px; font-size:1.6em; font-weight:bold; border-bottom:1px solid #cccccc}
#contents .sum_img .product_info p{line-height:50px; font-size:1.4em; border-bottom:1px solid #cccccc}
#contents .sum_img .product_info ul{margin-bottom:30px; border-bottom:1px solid #cccccc}
#contents .sum_img .product_info li{line-height:35px}

#contents .sum_img .product_info li span{color:#D04A4C; font-weight:bold}
#contents .win_img img{width:100%; max-width:1024px; display:block; margin:0 auto}
#contents .sum_img .email,#contents .sum_img .tel{padding:10px; background-color:#ff8601; color:#FFF; border:none;}
#contents .sum_img .tel{display:none}
#contents .list_page_go a{position:absolute; right:0; top:-40px; background-color:#D04A4C; color:#FFF; width:40px; height:40px; text-align:center; line-height:40px; font-size:0.8em}
#contents .sum_img .screen_info{overflow:hidden}
#contents .sum_img .screen_info li{float:left; width:14.28%;text-align:center; font-size:12px}
#contents .sum_img .screen_info li img{ width:100%}
#contents .screen_img img{ display:block; margin:30px auto}


#contents .parthner_list{overflow:hidden}
#contents .parthner_list li{float:left; width:20%;  box-sizing:border-box; overflow:hidden; padding-top:10px}
#contents .parthner_list li img{ display:block; margin:0 auto; border:1px solid #CCC; transition-duration:0.2s}
#contents .parthner_list li:hover img{transform:scale(1.1,1.1)}
#contents .parthner_list li h5 a{text-align:center; line-height:45px; display:block; color:#333; font-weight:bold}


#contents .door_list{position:relative; overflow:hidden}
#contents .door_list li{float:left; width:19.2%; margin-left:1%; margin-bottom:1%; border:1px solid #EEE; box-sizing:border-box; cursor:pointer}
#contents .door_list li img{width:100%}
#contents .door_list li:nth-child(5n+1){margin-left:0}
#contents .door_list li h5{  text-align:center; line-height:50px; }

.door_lightbox h5{text-align:center; line-height:30px; margin-bottom:10px }
.door_lightbox{ position:fixed; width:100%; height:100%; left:0; top:0; background-color:rgba(0,0,0,0.5); z-index:9999; display:none}
.door_lightbox .light_innerbox{position:absolute; width:500px; height:530px; overflow:hidden; left:50%; top:50%; margin-left:-270px; margin-top:-270px; padding:20px; background-color:#FFF}
.door_lightbox .light_innerbox>li{position:absolute; left:20px; top:20px; width:800px}
.door_lightbox .prev_btn{position:absolute; left:50%; margin-left:-480px; top:50%; margin-top:-20px; cursor:pointer}
.door_lightbox .next_btn{position:absolute; left:50%; margin-left:440px; top:50%; margin-top:-20px; cursor:pointer}
.door_lightbox .close_btn{position:absolute; left:50%; top:50%; margin-top:-320px ; cursor:pointer}
.door_lightbox .button_wrap{position:relative; margin-left:40px}
.door_lightbox .email, .door_lightbox .tel{padding:10px; background-color:#ff8601; color:#FFF; border:none;;}
 .door_lightbox .tel{display:none}
.contact_wrap{position:relative; width:96%; margin:0 auto}
.contact_wrap span.red_text{color: #F00; font-weight: bold}
.contact_wrap>form{margin-top:20px}
.contact_wrap>form>table{width:95%}
.contact_wrap>form>table td{padding:5px;}
.contact_wrap>form>table td.td_label{width:70px; font-size: 12px; font-weight: bold;  color:#626262}
.contact_wrap>form>table td.td_box>input{width:100%; height: 25px; padding:5px; border:1px solid #CCC}
.contact_wrap>form>table td.td_box>textarea{width:100%; height:100px; padding:5px; border:1px solid #CCC}
.contact_wrap>form>table td.td_box>textarea.info{font-size:11px; color:#626262}
.contact_wrap>form>table td.agree{text-align:center; font-size: 12px}
.contact_wrap>form>table td.agree>input{vertical-align: bottom}
.contact_wrap>form>table td.agree>label{vertical-align: top; margin-left:5px; font-weight: bold}
.contact_wrap>form>table td.send{text-align: center; padding-right:20px}
.contact_wrap>form>table td.send>input{width: 100px; height: 30px; margin-top: 20px; border: 2px solid #2d95f9; background-color:#FFF; border-radius: 5px;}


/*.door_list{overflow:hidden}
.door_list>li{float:left; width:19%; margin-left:1%; margin-bottom:2%; border:1px solid #EEE; box-sizing:border-box; cursor:pointer; padding-top:1%}
.door_list>li:first-child{margin-left:0}
.door_list>li img{width:90%; display:block; margin:0 auto }
.door_list>li h5{  text-align:center; line-height:50px; }
.door_list>li h5 span{font-size:12px; color:#666}

.door_lightbox h5{  text-align:center; line-height:30px; margin-bottom:10px }
.door_lightbox{ position:fixed; width:100%; height:100%; left:0; top:0; background-color:rgba(0,0,0,0.5); z-index:9999; display:none}
.door_lightbox .light_innerbox{position:absolute; width:500px; height:550px; overflow:hidden; left:50%; top:50%; margin-left:-270px; margin-top:-295px; padding:20px; background-color:#FFF}
.door_lightbox .prev_btn{position:absolute; left:50%; margin-left:-480px; top:50%; margin-top:-20px; cursor:pointer}
.door_lightbox .next_btn{position:absolute; left:50%; margin-left:440px; top:50%; margin-top:-20px; cursor:pointer}
.door_lightbox .close_btn{position:absolute; left:50%; top:50%; margin-top:-350px ; cursor:pointer}
.door_lightbox .button_wrap{margin-top:30px}
.door_lightbox .email, .door_lightbox .tel{padding:10px; background-color:#ff8601; color:#FFF; border:none;;}
*/

.inner_gate_wrap{position:relative; }
.inner_gate_wrap .inner_gate_product {position:relative; height:650px}
.inner_gate_wrap .inner_gate_product .inner_bg{position:absolute; width:1200px; height:650px; left:50%; top:0 ; margin-left:-600px}
.inner_gate_wrap .inner_gate_product .inner_bg .inner_img{position:absolute; left:592px; top:16px}
.inner_gate_wrap .inner_gate_product .inner_bg .inner_glass{position:absolute; left:592px; top:16px}
.inner_gate_wrap .inner_gate_product .glass_list{position:absolute; left:50%; margin-left:-250px; bottom:50px; overflow:hidden}
.inner_gate_wrap .inner_gate_product .glass_list li{width:50px; height:50px; line-height:50px; background-color:#FFF; border-radius:30px; text-align:center; margin-right:5px; font-size:12px; float:left; cursor:pointer; box-shadow:0 2px 3px rgba(0,0,0,0.5)}
.inner_gate_wrap .inner_gate_product .glass_list li.select_lnb {background-color:#222; color:#FFF}


.inner_gate_wrap .inner_list_wrap{position:relative; margin-top:-20px}
.inner_gate_wrap .inner_list_wrap ul{overflow:hidden; width:600px; margin:0 auto}
.inner_gate_wrap .inner_list_wrap ul li{float:left; width:120px; border:1px solid #000; line-height:50px; text-align:center; box-sizing:border-box; border-left:0}
.inner_gate_wrap .inner_list_wrap ul li a{ background-color:#FFF; color:#000;  line-height:50px; text-align:center;  display:block}
.inner_gate_wrap .inner_list_wrap ul li:first-child a{border-left:1px solid #000}
.inner_gate_wrap .inner_list_wrap ul li a:hover{ background-color:#000; color:#FFF}
.inner_gate_wrap .inner_list_wrap ul li a.select_lnb {background-color:#222; color:#FFF}
.inner_gate_wrap  .inner_detial img{display:block; margin:0 auto}


.top_btn a{position:fixed; right:100px; bottom:100px; background-color:#00bbe4; color:#FFF; width:40px; height:40px; text-align:center; line-height:40px; border-radius:20px; font-size:0.8em}

#footer{position:relative;background-color:#222222; color:#FFF; padding:50px 0; line-height:30px; font-size:12px}
#footer .footer_wrap{position:relative; width:96%; margin:0 auto; overflow:hidden}
#footer .footer_left{position:relative; width:40%; float:left} 
#footer .footer_left address{font-style:normal}
#footer #footer_nav{position:relative; float:right; width:60%}
#footer #footer_nav>ul{overflow:hidden}
#footer #footer_nav>ul>li{float:left}
#footer #footer_nav>ul>li a{color:#FFF; line-height:20px; font-size:12px; display:block; text-align:center; padding:0 20px; margin-bottom:10px}
#footer #footer_nav>ul>li a:hover{color:#CCC}
#footer #footer_nav>ul>li>a{font-size:13px; font-weight:bold; line-height:13px; border-left:1px solid #FFF}
#footer #footer_nav>ul>li:first-child>a{border-left:0}
#footer #footer_nav>ul>li>ul>li{height:20px}

}

@media all and (max-width:600px) {
#header{position:fixed; height:60px; background-color:#FFF; width:100%; left:0; top:0;  z-index:9999; border-bottom:1px solid #000}
#header .header_wrap{position:relative; background-color:#FFF}
#header .header_wrap h1{position: relative; height:60px; width:120px; margin:0 auto; top:11px}
#header .header_wrap h1 img{width:120px}
#header .header_wrap #gnb{ display:none}
#m_gnb{position:fixed; left:-100%; top:0; width:100%; height:100%; background-color:#1A59E9; z-index:9999}
#m_gnb .mob_close{text-align:center; padding:10px 0; color:#FFF; line-height:40px; font-size:20px; border-bottom:1px solid #FFF}
#m_gnb>ul>li>a{display:block; text-align:center; font-size:14px; color:#FFF; line-height:40px;border-bottom:1px solid #578AFD }
#m_gnb>ul>li>ul{background-color:#104DD8; display:none;overflow:hidden}
#m_gnb>ul>li>ul>li>a{display:block; font-size:13px; color:#FFF; text-align:center; line-height:35px; border-bottom:1px solid #2360EB}
#m_gnb>ul>li:nth-child(5)>ul>li{width:50%; float:left}
.mob_open{position:absolute; left:10px; top:15px}



#sub_top{position:relative; height:200px; background-position:center; background-repeat:no-repeat; background-size: auto 200px; margin-top:60px}
#sub_top h2{color:#FFF; font-size:20px; text-align:center; line-height:200px; text-shadow:2px 2px 4px rgba(0,0,0,0.5)}

#contents{position:relative; width:100%; overflow:hidden}
#contents>div{width:96%; position:relative; margin:10px auto}
#contents h3{font-size:15px; font-weight:bold; padding:10px}
#contents h4{ display:none}
#contents .history h5{font-size:30px; margin-bottom:30px; margin-top:30px}
#contents p{font-size:14px; line-height:1.6em; text-align:justify; margin-bottom:1.6em}
#contents .about p::first-letter{margin-left:14px}

.lnb{position:relative; width:96%; margin:0 auto; margin-top:-20px; background-color:#FFF}
.lnb>ul{overflow:hidden}
.lnb>ul>li{float:left; width:25%; border: 1px solid #222; border-left:none; box-sizing:border-box}
.product_lnb>ul{border-top:1px solid #222}
.product_lnb>ul>li{float:left; width:20%; border:1px solid #222; border-top:none; border-left:none; box-sizing:border-box}
.product_lnb>ul>li:nth-child(5n+1){border-left: 1px solid #222}
.lnb>ul>li a.select_lnb {background-color:#222; color:#FFF}
.lnb>ul>li:first-child{border-left:1px solid #222}
.lnb>ul>li>a{display:block; line-height:40px; text-align:center; color:#000; font-size:12px}
.lnb>ul>li>a:hover{background-color:#222; color:#FFF}
.about_top{background-image:url(../img/about_top.jpg)}
.windows_top{background-image:url(../img/windows_top.jpg)}
.door_top{background-image:url(../img/door_top.jpg)}
.inner_top{background-image:url(../img/inner_top.jpg)}
.product_top{background-image:url(../img/product_top.jpg)}
.history ul li{line-height:40px; border-bottom:1px solid #EEE}
.location .map{margin-bottom:1.6em}

.product{position:relative; width:98%; margin:20px auto; padding:10px}
.product_wrap{position:relative}
.product_list{position:relative; overflow:hidden}
.product_list li{float:left; width:32%; margin-left:2%; margin-bottom:2%; border:1px solid #EEE; box-sizing:border-box; cursor:pointer}
.product_list li img{width:100%}
.product_list li:nth-child(3n+1){margin-left:0}
.product_list li h5{  text-align:center; line-height:50px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden }

.win_list{position:relative; overflow:hidden}
.win_list li{float:left; width:49%; margin-left:2%; margin-bottom:2%; border:1px solid #EEE; box-sizing:border-box; cursor:pointer}
.win_list li img{width:100%}
.win_list li:nth-child(3n+1){margin-left:2%}
.win_list li:nth-child(2n+1){margin-left:0}
.win_list li h5{ text-align:center;line-height:25px}
.win_list li h5 span{display:block; font-size:11px; font-weight:bold; text-align:center}
.win_list li a{color:#000}


.product_lightbox h5{  text-align:center; line-height:30px; margin-bottom:10px }
.product_lightbox{ position:fixed; width:100%; height:100%; left:0; top:0; background-color:rgba(0,0,0,0.5); z-index:9999; display:none}
.product_lightbox .light_innerbox{position:absolute; width:96%; height:70%; left:50%; top:10%; margin-left:-48%; padding-bottom:20px; background-color:#FFF; box-sizing:border-box}
.product_lightbox .light_innerbox>li{position:relative; overflow:auto; height:100%}

.product_lightbox .light_img{ padding:10px; box-sizing:border-box}
.product_lightbox .light_img>img{width:100%;display:block}
.product_lightbox .light_text{width:96%; margin:0 auto}
.product_lightbox .light_text li{line-height:50px; border-bottom:1px solid #CCC }
.product_lightbox .laminateLi li{line-height:25px; border-bottom:1px solid #CCC }
.product_lightbox .light_text li:first-child{border-top:1px solid #CCC}
.product_lightbox .light_text span{color:#D04A4C; font-weight:bold}
.product_lightbox .prev_btn{position:absolute; left:50%;bottom:5%; margin-left:-90px; cursor:pointer}
.product_lightbox .next_btn{position:absolute; left:50%; bottom:5%; margin-left:50px; cursor:pointer}
.product_lightbox .close_btn{position:absolute; left:50%; bottom:5%; margin-left:-20px;  cursor:pointer}
.product_lightbox .button_wrap{margin-top:30px}
.product_lightbox .email, .product_lightbox .tel{padding:10px; background-color:#ff8601; color:#FFF; border:none;;}


#contents .win_product_wrap{position:relative;}
#contents .product_list li h5 a{ color:#000 }
#contents .sum_img{overflow:hidden; margin-bottom:50px; border:1px solid #CCC; padding:10px}
#contents .sum_img>img{ width:100% }
#contents .sum_img .product_info{position:relative;  box-sizing:border-box}
#contents .sum_img .product_info h5{line-height:35px; font-size:1.2em; font-weight:bold; border-bottom:1px solid #cccccc}
#contents .sum_img .product_info p{line-height:35px; font-size:1.1em; border-bottom:1px solid #cccccc}
#contents .sum_img .product_info ul{margin-bottom:30px; border-bottom:1px solid #cccccc}
#contents .sum_img .product_info li{line-height:35px; font-size:12px}

#contents .sum_img .product_info li span{color:#D04A4C; font-weight:bold}
#contents .win_img img{width:100%; max-width:1024px; display:block; margin:0 auto}
#contents .sum_img .email,#contents .sum_img .tel{padding:10px; background-color:#ff8601; color:#FFF; border:none;}
#contents .list_page_go a{position:absolute; right:0; top:-40px; background-color:#D04A4C; color:#FFF; width:40px; height:40px; text-align:center; line-height:40px; font-size:0.8em}
#contents .sum_img .screen_info{overflow:hidden;}
#contents .sum_img .screen_info li{float:left; width:33.33%;text-align:center; font-size:12px}
#contents .sum_img .screen_info li img{ width:100%}
#contents .screen_img img{ width:100%}

#contents .parthner_list{overflow:hidden}
#contents .parthner_list li{float:left; width:20%;  box-sizing:border-box; overflow:hidden; padding-top:10px}
#contents .parthner_list li img{ display:block; width:80%; margin:0 auto; border:1px solid #CCC; transition-duration:0.2s}
#contents .parthner_list li:hover img{transform:scale(1.1,1.1)}
#contents .parthner_list li h5 a{text-align:center; line-height:45px; display:block; color:#333; font-weight:bold; font-size:12px}

#contents .door_list{position:relative; overflow:hidden}
#contents .door_list li{float:left; width:32.33%; margin-left:1%; margin-bottom:1%; border:1px solid #EEE; box-sizing:border-box; cursor:pointer}
#contents .door_list li img{width:100%}
#contents .door_list li:nth-child(3n+1){margin-left:0}
#contents .door_list li h5{text-align:center; line-height:50px; font-size:13px }
#contents .door_list li h5 span{font-size:11px}

.door_lightbox h5{text-align:center; line-height:30px; margin-bottom:10px }
.door_lightbox{ position:fixed; width:100%; height:100%; left:0; top:0; background-color:rgba(0,0,0,0.5); z-index:9999; display:none}
.door_lightbox .light_innerbox{position:absolute; width:96%; left:50%; top:50%; margin-left:-48%; margin-top:-48%; padding-bottom:20px; background-color:#FFF; box-sizing:border-box}
.door_lightbox .light_innerbox img{width:100%}
.door_lightbox .prev_btn{position:absolute; left:50%; bottom:5%; margin-left:-90px;  cursor:pointer}
.door_lightbox .next_btn{position:absolute; left:50%; bottom:5%; margin-left:50px; cursor:pointer;}
.door_lightbox .close_btn{position:absolute; left:50%; margin-left:-20px; bottom:5%; cursor:pointer}
.door_lightbox .button_wrap{position:relative; margin-left:40px}
.door_lightbox .email, .door_lightbox .tel{padding:7px; background-color:#ff8601; color:#FFF; border:none; font-size:12px}


.contact_wrap{position:relative; width:96%; margin:0 auto}
.contact_wrap span.red_text{color: #F00; font-weight: bold}
.contact_wrap>form{margin-top:20px}
.contact_wrap>form>table{width:95%}
.contact_wrap>form>table td{padding:5px;}
.contact_wrap>form>table td.td_label{width:70px; font-size: 12px; font-weight: bold;  color:#626262}
.contact_wrap>form>table td.td_box>input{width:100%; height: 25px; padding:5px; border:1px solid #CCC}
.contact_wrap>form>table td.td_box>textarea{width:100%; height:100px; padding:5px; border:1px solid #CCC}
.contact_wrap>form>table td.td_box>textarea.info{font-size:11px; color:#626262}
.contact_wrap>form>table td.agree{text-align:center; font-size: 12px}
.contact_wrap>form>table td.agree>input{vertical-align: bottom}
.contact_wrap>form>table td.agree>label{vertical-align: top; margin-left:5px; font-weight: bold}
.contact_wrap>form>table td.send{text-align: center; padding-right:20px}
.contact_wrap>form>table td.send>input{width: 100px; height: 30px; margin-top: 20px; border: 2px solid #2d95f9; background-color:#FFF; border-radius: 5px;}



/*.door_list{overflow:hidden}
.door_list>li{float:left; width:19%; margin-left:1%; margin-bottom:2%; border:1px solid #EEE; box-sizing:border-box; cursor:pointer; padding-top:1%}
.door_list>li:first-child{margin-left:0}
.door_list>li img{width:90%; display:block; margin:0 auto }
.door_list>li h5{  text-align:center; line-height:50px; }
.door_list>li h5 span{font-size:12px; color:#666}

.door_lightbox h5{  text-align:center; line-height:30px; margin-bottom:10px }
.door_lightbox{ position:fixed; width:100%; height:100%; left:0; top:0; background-color:rgba(0,0,0,0.5); z-index:9999; display:none}
.door_lightbox .light_innerbox{position:absolute; width:500px; height:550px; overflow:hidden; left:50%; top:50%; margin-left:-270px; margin-top:-295px; padding:20px; background-color:#FFF}
.door_lightbox .prev_btn{position:absolute; left:50%; margin-left:-480px; top:50%; margin-top:-20px; cursor:pointer}
.door_lightbox .next_btn{position:absolute; left:50%; margin-left:440px; top:50%; margin-top:-20px; cursor:pointer}
.door_lightbox .close_btn{position:absolute; left:50%; top:50%; margin-top:-350px ; cursor:pointer}
.door_lightbox .button_wrap{margin-top:30px}
.door_lightbox .email, .door_lightbox .tel{padding:10px; background-color:#ff8601; color:#FFF; border:none;;}*/


.inner_gate_wrap{position:relative; }
.inner_gate_wrap .inner_gate_product {position:relative; height:325px}
.inner_gate_wrap .inner_gate_product .inner_bg{position:absolute; width:600px; height:325px; left:50%; top:0 ; margin-left:-350px}
.inner_gate_wrap .inner_gate_product .inner_bg>img{width:600px}
.inner_gate_wrap .inner_gate_product .inner_bg .inner_img{position:absolute; left:296px; top:8px}
.inner_gate_wrap .inner_gate_product .inner_bg .inner_img img{width: 175px}
.inner_gate_wrap .inner_gate_product .inner_bg .inner_glass{position:absolute; left:296px; top:8px}
.inner_gate_wrap .inner_gate_product .inner_bg .inner_glass img{ width:175px}
.inner_gate_wrap .inner_gate_product .glass_list{position:absolute; left:50%; margin-left:-80px; bottom:30px; overflow:hidden}
.inner_gate_wrap .inner_gate_product .glass_list li{width:50px; height:50px; line-height:50px; background-color:#FFF; border-radius:30px; text-align:center; margin-right:5px; font-size:12px; cursor:pointer; box-shadow:0 2px 3px rgba(0,0,0,0.5)}
.inner_gate_wrap .inner_gate_product .glass_list li.select_lnb {background-color:#222; color:#FFF}
.inner_gate_wrap .inner_list_wrap{position:relative; margin-top:-20px}
.inner_gate_wrap .inner_list_wrap ul{overflow:hidden; width:100%; margin:0 auto}
.inner_gate_wrap .inner_list_wrap ul li{ border:1px solid #000; line-height:50px; text-align:center; box-sizing:border-box; border-top:0}
.inner_gate_wrap .inner_list_wrap ul li a{ background-color:#FFF; color:#000;  line-height:30px; text-align:center;  display:block; font-size:13px}
.inner_gate_wrap .inner_list_wrap ul li:first-child a{border-top:1px solid #000}
.inner_gate_wrap .inner_list_wrap ul li a:hover{ background-color:#000; color:#FFF}
.inner_gate_wrap .inner_list_wrap ul li a.select_lnb {background-color:#222; color:#FFF}
.inner_gate_wrap  .inner_detial img{ width:100%}


.top_btn a{position:fixed; right:10px; bottom:100px; background-color:#00bbe4; color:#FFF; width:40px; height:40px; text-align:center; line-height:40px; border-radius:20px; font-size:0.8em}

#footer{position:relative;background-color:#222222; color:#FFF; padding:20px 0; line-height:30px; font-size:12px}
#footer .footer_wrap{position:relative; overflow:hidden}
#footer .footer_left{position:relative; width:90%; margin:0 auto} 
#footer .footer_left address{font-style:normal}
#footer #footer_nav{ display:none}

}