@charset "utf-8";
/* CSS Document 

@import url('https://fonts.googleapis.com/css2?family=Gowun+Dodum&family=Nanum+Brush+Script&family=Nanum+Pen+Script&family=Single+Day&display=swap');
* {font-family:'Nanum Gothic', sans-serif; src:url('/include/css/NanumGothic.ttf'); font-weight:normal;}
*/
@import url('//cdn.rawgit.com/innks/NanumSquareRound/master/nanumsquareround.min.css');
@import url('https://fonts.googleapis.com/css?family=Nanum+Brush+Script|Nanum+Pen+Script+Stylish&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR');
@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);
/** {font-family:'Nanum Gothic', sans-serif; src:url('/include/css/NanumGothic.ttf'); font-weight:normal;}*/
* {font-family: 'NanumSquareRound',sans-serif; }


input[type="checkbox"]:checked+label, input[type="radiobox"]:checked+label, input[type="text"], input[type="number"], input[type="file"], input[type="password"]{
height:35px;
border-radius:5px;
border:solid 1px #CCC;
text-align:center;
}

body, html{overflow-x:hidden; color:#000;}

.bg_gray {background:#aaa;}
.bg_sgray  {background:#eee;}
.bg_white {background:#FFF;}
.bg_bage {background:#fdfaf5;}
.bg_red{background:#ff6600;}
.bg_blue{background:#264588;}
.bg_green{background:#a0bd2d;}


.h4 {
font-weight:bold; font-size:20px;
}



.npen {
/*font-family: 'Gowun Dodum', sans-serif; font-size:25px; line-height:40px;*/
font-weight:bold;
}

p, body, ul, li, dt, dl, h1, h2, h3, h4, h5,a{margin:0;
padding:0; list-style:none; text-decoration:none; border:0;
}
a:link { color: #323232; }
a:visited { color:#323232; }
a:hover { color:#6f3737; }
a:active { color:#323232; }

body td{
margin:0;
padding:0;
font-size:12px;
color:#000;
} 

.nav_li {font-size:18px; color:#4d683f;}

#mlnk:hover {
text-shadow: 1px 1px #ddd;
}

#mlnk2:hover {
text-shadow: 1px 1px #666;
}

#mlnk3:hover {
text-shadow: 1px 1px #bbb;
}

.gab_t5 {clear:both; height:5px;}
.gab_t10 {clear:both; height:10px;}
.gab_t30 {clear:both; height:30px;}
.gab_t50 {clear:both; height:50px;}
.gab_t80 {clear:both; height:60px;}

.f_w {font-weight:bold;}

.txt_col_wht {color:#fff;}
.txt_col_red {color:#ff3300;}
.txt_col_blue {color: #0066aa;}
.txt_col_green {color:#1e643e;}

.main_mbox1 {position:absolute; left:50%; margin-left:-50px; padding-top:80px;}
.main_mbox2 {position:absolute; left:50%; margin-left:140px; padding-top:150px;}
.main_mbox3 {position:absolute; left:50%; margin-left:330px; padding-top:80px;}
.main_mbox4 {position:absolute; left:50%; margin-left:520px; padding-top:150px;}

.main_bbox1 { float:left; padding-right:19px;}
.main_bbox2 {  float:left; padding-right:18px;}
.main_bbox3 {  float:left;}
.main_bbox4 { float:left; padding-right:19px;}
.main_bbox5 {  float:left; padding-right:18px;}
.main_bbox6 {  float:left;}

.menu1, .menu2, .menu3, .menu4, .menu5, .menu6 {
float:left;  height:110px;
}

.menu1_bg, .menu2_bg, .menu3_bg, .menu4_bg, .menu5_bg, .menu6_bg {
position:absolute; 
width:200px;
height:110px; 
opacity:0;
transition:all linear .3s;
z-index:999;
cursor:pointer;
}

.menu1_bg {background:url(/images/menu_1_c.jpg);}
.menu2_bg {background:url(/images/menu_2_c.jpg); margin-left:200px;}
.menu3_bg {background:url(/images/menu_3_c.jpg);  margin-left:400px;}
.menu4_bg {background:url(/images/menu_4_c.jpg); }
.menu5_bg {background:url(/images/menu_5_c.jpg);  margin-left:200px;}
.menu6_bg {background:url(/images/menu_6_c.jpg);  margin-left:400px;}

.menu1_bg:hover, .menu2_bg:hover, .menu3_bg:hover, .menu4_bg:hover, .menu5_bg:hover, .menu6_bg:hover {
opacity:1;
}

.sub_top_head1 {
position:absolute; font-family: 'Noto Serif KR', serif;z-index:99; 
font-size:35px;  margin:100px 0 0 -600px; left:50%; color:#FFF;
line-height:60px; text-shadow:2px 2px 2px #000;
}

.sub_top_head2 {
position:absolute; font-family: 'Noto Serif KR', serif;z-index:99; 
font-size:35px;  margin:100px 0 0 -600px; left:50%; color:#FFF;
line-height:60px; text-shadow:2px 2px 2px #000;
}

.sub_top_head3 {
position:absolute; font-family: 'Noto Serif KR', serif;z-index:99; 
font-size:35px;  margin:100px 0 0 -600px; left:50%; color:#FFF;
line-height:60px; text-shadow:2px 2px 2px #000;
}

.sub_top_head4 {
position:absolute; font-family: 'Noto Serif KR', serif;z-index:99; 
font-size:35px;  margin:100px 0 0 -600px; left:50%; color:#FFF;
line-height:60px; text-shadow:2px 2px 2px #000;
}

.sub_top_head5 {
position:absolute; font-family: 'Noto Serif KR', serif;z-index:99; 
font-size:35px; margin:100px 0 0 -600px; left:50%; color:#FFF;
line-height:60px; text-shadow:2px 2px 2px #000;
}

.s3_box1 { float:left; width:400px; border:solid 2px #508D81; text-align:center; font-size:18px; font-weight:bold; padding:15px 0; border-radius:10px; box-shadow:inset 6px 6px 6px #EEE;}
.s3_box2 { float:left; width:290px; border:solid 2px #508D81; text-align:center; font-size:18px; font-weight:bold; padding:15px 0; border-radius:10px; box-shadow:inset 6px 6px 6px #EEE;}
.s3_box3 { float:left; width:290px; border:solid 2px #508D81; text-align:center; font-size:18px; font-weight:bold; padding:15px 0; border-radius:10px;background:#53b47e; color:#FFF; 
					box-shadow:inset 6px 6px 6px #31925c;}
.s3_box_pls {float:left; width:50px; text-align:center; font-size:25px; font-weight:bold; padding:15px 0;}
.s3_box_eqr {float:left; width:50px; text-align:center; font-size:25px; font-weight:bold; padding:15px 0;}

.s3_ul {
clear:both;
padding-bottom:50px;
width:550px;
margin:auto;
}

.s3_ul li {
float:left;
font-size:20px;
border-bottom:solid 1px  #EEE;
line-height:50px;
}

.li_l {
width:200px;
text-align:right;
padding-right:40px;
font-weight:bold;
}

.li_r {
width:300px;

}

.pdl {
padding-left:15px;
}

#btn_img:hover {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#footer_contain #footer{
clear:both;
padding-top:20px;
margin:auto;
}

#footer_contain #footer .f_inner{
position:relative;
width:1200px;
margin:auto;
}

.f_inner dl{
overflow:hidden}

.f_logo{
float:left;
margin-top:15px;
width:30%;
text-align:right;
}

.adcopy{
padding-left:20px;
margin-top:0px;
color:#7e8188;
width:65%;
float:left;
text-align:left;
line-height:20px;
}

.add{margin-bottom:5px;line-height:15px;}


.msnv {
float:left;
width:19.5%;
text-align:center;
color:#666;
line-height:40px;
transition:all 0.25s;
cursor:pointer;
font-size:18px;
transition: all 0.5s;
}

.msnvo {
float:left;
width:19.5%;
text-align:center;
color:#666;
border-bottom:solid 2px #2e824e;
line-height:40px;
cursor:pointer;
font-size:18px;
font-weight:bold;
}

.msnv:hover {
border-bottom:solid 2px #2e824e;
font-weight:bold;
color:#666;
}

.msnv2 {
float:left;
width:130px;
text-align:center;
color:#999;
border:solid 1px #eee;
line-height:40px;
transition:all 0.25s;
cursor:pointer;
font-size:14px;
box-shadow:inset 4px 4px 4px #ccc;
font-weight:bold;
}


/* SMS */
#msg_screen	{ text-align:center; position:relative; margin:0px 0 0 0; }
#msg_window	{ border:none; width:160px; height:101px; background:transparent; font:12px/1.4em 굴림체; color:#000000; overflow:hidden; padding:0px;}
#msg_max	{ position:absolute; line-height:17px;left:30px; top:5px; width:303px; height:153px; font-size:11px; color:#000000; text-align:left; cursor:text; }
#max_byte	{ margin:0; padding:8px 0 3px 0; font-size:11px; color:#000000; }
/* SMS */

img {
border:none;
}

#sub_visual img{
width:1000px;
margin:0 auto;
display:block

}



#contents_contain2{
width:1100px;
min-height:350px;
margin:0 auto 60px auto;

}


#left_con{
width:220px;
float:left
}

#left_con h2{ 
border:solid 10px #51a8d7;
height:80px;
font-size:20px;
line-height:80px;
color:#51a8d7;
text-align:center;
font-weight:bold;
}


#left_con ul{
font-size:18px;
text-align:left
}

#left_con ul li{
padding:20px 0 20px 20px;
cursor:pointer;
transition:.2s;
border-bottom:solid 1px #FFF;
}

#left_con ul li:hover{
color:#51a8d7;
font-weight:bold;
border-bottom:solid 1px #51a8d7;
border-right:solid 1px #51a8d7;
box-shadow: 3px 3px 3px #51a8d7;
}

#left_con span img{
margin-top:80px}

#right_con{
width:830px;
float:left;
text-align:left;
margin-left:30px;
}

.right_con_inn{
height:60px;
border-bottom:1px dotted #b5b5b5;}

#contents_contain2 h3{
font-size:30px;
color:#333333;
font-weight:400;
margin-top:20px;
float:left;
line-height:30px;
}

#contents_contain2 .loacation{
float:right;
margin-top:28px;
}

.stlt_top {
font-size:20px;
font-weight:bold;
color:#1a6e3a;
line-height:35px;
padding-bottom:0px;
}

div.polaroid {
  width: 96%;
  background-color: white;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-bottom: 25px;
  transition: font-size 0.1s ease-out;
}

div.polaroid:hover {
  font-size:16px;
}


.tbl th{
padding:5px;
font-weight:bold;
font-size:16px;
background:#DB9D53;
color:#FFF;
text-align:center;
line-height:40px;
}

 .tbl2 th {
padding:5px;
font-weight:bold;
font-size:16px;
background:#508D81;
color:#FFF;
text-align:center;
line-height:40px;
}

.tbl td {
padding:20px 0;
line-height:25px;
font-size:16px;
text-align:center;
border:dashed 1px #aaa;
}

.tbl2 td {
padding:5px;
line-height:25px;
font-size:14px;
border:dashed 1px #aaa;
text-align:center;
}

.tbl  {
width:100%;
margin:auto;
}

.tbl2  {
width:100%;
}


.lbtn {
background:#333; padding:4px; border-radius:3px; color:#FFF; font-size:12px; font-weight:bold;
}


.box_tlt{
font-size:20px;
font-weight:bold;
padding-left:5px;
padding-bottom:5px;
}

.box_tlt2{
font-size:16px;
font-weight:bold;
padding-bottom:5px;
}

.box_cnt{
padding:40px 20px;
word-break:keep-all;
text-align: justify;
text-justify: inter-word;
box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px;
font-size:16px;
background:#f9f5f4;
line-height:30px;
}

.nav_tbl {
width:100%;
background:#FFF;
}

.nav_tbl td {
border-bottom:dashed 1px #eee;
background:#1676c5;
cursor:pointer;
color:#FFF;
text-align:center;
height:30px;
font-size:13px;
letter-spacing:1.2px;
}

.nav_tbl td:hover {
box-shadow:inset 3px 3px 3px #115995;
text-shadow:2px 2px 2px #115995;
font-weight:bold;
}

.s2_box {
text-align:center; border:solid 1px #ddd; width:60%; padding:20px; margin:auto;
border-radius:10px;
box-shadow:4px 4px 4px #ddd;
color:#3f9ccf;
font-weight:bold;
}


.mipt {
width:250px;
height:25px;
border:solid 2px #305253;
}

.mtxt {
width:380px;
height:145px;
border:solid 2px #305253;
}

.mbtn {
width:200px;
height:30px;
background:#305253;
color:#FFF;
font-weight:bold;
border-radius:5px;
border:none;
}

.s2_txt{
float:left; width:33%; text-align:center;
font-weight:bold;
font-size:18px;
color:#333;
}

.s31_box {
float:left;
text-align:center;
width:33.33%;
}

.s31_tlt {
font-weight:bold;
line-height:40px;
font-size:18px;
color:#333;
}

.s31_img {
width:90%; border-radius:10px;
box-shadow:4px 4px 4px #CCC;
}

.s31_price {
color:#ff3300;
font-weight:bold;
line-height:30px;
}

.s31_deli {
color:#0584c0;
font-weight:bold;
line-height:30px;
}

.m_mt {
float:left;
width:25%;
}

.m_mt1 {
background:#2e5252;
line-height:40px;
color:#FFF;
cursor:pointer;
transition:all .2s;
width:265px;
margin:auto;
}

.m_mt1:hover {
box-shadow:inset 3px 3px 3px #1f3838; 
font-weight:bold;
font-size:20px;
}


.m_mt2 {
background:#c4a16b;
line-height:40px;
color:#FFF;
cursor:pointer;
transition:all .2s;
width:265px;
margin:auto;
}

.m_mt2:hover {
box-shadow:inset 3px 3px 3px #836334; 
font-weight:bold;
font-size:20px;
}



.layer {display:none; position:fixed; _position:absolute; top:0; left:0; width:100%; height:100%; z-index:9999;}
.layer .bg {position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:.5; filter:alpha(opacity=50);}
.layer .pop-layer {display:block;}	

.pop-layer {display:none; position: absolute; top: 50%; left: 50%; width: 460px; height:auto;  background-color:#fff; border: 3px solid #2e2e2e; z-index: 9999999;}	
.pop-layer .pop-container {padding: 20px 18px;}

.pop-layer p.ctxt30 {color: #666; line-height: 20px;font-weight:600;margin-bottom:20px; font-size:14px;}
.pop-layer p.ctxt20 {color: #666; line-height: 18px; font-size:12px;}

.pop-layer .btn-r {width: 100%; margin:10px 0 10px; padding-top: 10px;text-align:center;}

.btn-r a.cbtn {display:inline-block; height:25px; padding:3px 14px ;  background-color:#5A5A5A; font-size:13px; color:#fff; line-height:25px;}	
.btn-r a.cbtn:hover { background-color:#000; color:#fff;}

/*견적신청팝업*/
.layer .pop-layer2 {display:block;}
.pop-layer2 {display:none; position: absolute; top: 50%; left: 50%; width: 1200px; height:800px;  background-color:#fff;z-index: 10;    overflow-y: scroll;}
	
.pop-layer2 .pop-container2 {padding: 35px 60px;}
.pop-layer2  h1 {font-size: 40px;color: #0084c4;text-align: left; padding-bottom: 20px;}
.pop-layer2  h2 {font-size: 24px;padding-bottom: 15px;}
.pop-layer2 .txt_agree {padding-bottom: 20px;}
.pop-layer2 .txt_agree a { font-size: 15px;}
.pop-layer2 .txt1 {padding-bottom: 30px;}
.pop-layer2 .txt1 p {font-size: 18px;padding-bottom: 10px;color: #606060;}

.pop-layer2 input[type="radio"] { opacity: 0; position: absolute; width: 16px; cursor: pointer; height: 16px;}
.pop-layer2 input[type="radio"] + label {  cursor: pointer; font-size: 18px;color: #606060;}
.pop-layer2 input[type="radio"] + label span { width: 16px;margin-right: 10px; height: 16px; display: inline-block; background: url(images/radio.png) no-repeat right top;}
.pop-layer2 input[type="radio"]:checked + label span {width: 16px;height: 16px;display: inline-block;  background: url(images/radio.png) no-repeat left top;}
.pop-layer2 .call_con {margin-right: 20px;}
.pop-layer2 .btn-r2 {right: 15px;position: absolute;}
.btn-r2 a.cbtn {display:inline-block;}	

/* clearfix */
.clearfix {
	clear:both;
}


#container{
	position:relative;
	width:800px;
	margin:0 auto 25px;
	padding-bottom: 10px;
	
}
.grid{
	width:500px;
	padding: 15px;
	background:#fff;
	margin:8px;
	font-size:12px;
	float:left;
	box-shadow: 0 1px 3px rgba(34,25,25,0.4);
	-moz-box-shadow: 0 1px 3px rgba(34,25,25,0.4);
	-webkit-box-shadow: 0 1px 3px rgba(34,25,25,0.4);
	
	-webkit-transition: top 1s ease, left 1s ease;
	-moz-transition: top 1s ease, left 1s ease;
	-o-transition: top 1s ease, left 1s ease;
	-ms-transition: top 1s ease, left 1s ease;
}

.strong {
	margin:5px 0;
	display:block;
	padding:5px;
	font-size:17px;
	text-align:center;
}
.grid .meta{
	text-align:right;
	color:#777;
	font-style:italic;
}
.grid .imgholder img{
	max-width:100%;
	display:block;
}

.m_b {
float:left; width:20%; text-align:center;
cursor:pointer;
}

.m_b:hover {
text-shadow:2px 2px 2px #aaa;
}

.mbd_img ul{
padding:0;
}

.mbd_img li{
float:left;
padding-bottom:25px;
}

.ml_10 {
padding-top:15px;
}

.bar {
text-align:center;
border:solid 1px #EEE;
background:#EEE;
color:#555;
line-height:50px;
font-weight:bold;
font-size:20px;
border-radius:10px;
box-shadow:2px 2px 2px #ddd;
}

#ln2 {
color:#bbd2ee;
line-height:50px;
font-weight:bold;
text-shadow:1px 1px 1px #000;
font-size:32px;
}

.s41 ul{
padding-top:30px;
}

.s41 li:nth-child(1) {
font-weight:bold;
}

.mzoom {
    padding: 0px;
    transition: transform .5s; /* Animation */
    margin: 0 auto;
}

.mzoom:hover {
    transform: scale(1.1); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

.mitem {
  position: relative;
  overflow: hidden;
}

.cmp {
position:absolute; color:#FFF; padding-top:350px; margin-left:850px;
cursor:pointer;
transition:.2s;
}

.cmp:hover {
font-weight:bold;
color:#666;
font-size:20px;
text-shadow:1px 1px 1px #999;
}

.pic {
border:2px solid #fff;
box-shadow:4px 4px 4px #CCC;
}

/*======== CTAB =======*/

.ctab2{
float:left;
width:19.8%;
text-align:center;
font-size:16px;
line-height:50px;
color:#FFF;
}

.ctab3, .ctab5{
float:left;
width:49.8%;
text-align:center;
font-size:18px;
line-height:50px;
color:#FFF;
}


.ctab1, .ctab4{
float:left;
width:33.2%;
text-align:center;
font-size:16px;
line-height:50px;
color:#FFF;
}

.ct_gab {
float:left;
height:50px;
border-right:solid 1px #CCC;
}

.sub_menu_t {
background:#FFF; width:100%; height:50px;
border-bottom:solid 1px #CCC;
}

.sub_menu {
display:block; width:1100px; margin:auto;
}


.ct_active {
background:#C62D44; 
font-weight:bold;
cursor:default;
}

.ct_unactive {
background:#FFF;
transition:all .2s;
cursor:pointer;
color:#666;
}

.ct_unactive:hover {
box-shadow:inset 4px 4px 4px #CCC;
font-weight:bold;
}


/*====================================================================
	Board Buttons
============================================================***/

.nw {
border:solid 2px green;padding:5px 10px; width:100px; text-align:center;
cursor:pointer;
color:green;
font-weight:bold;
}

.bl {
border:solid 1px #3d7711;background:#508D81;color:#fff;padding:3px 10px; cursor:pointer;
}

.rpl {
border:solid 2px #1e78ae;padding:5px 10px; width:100px; text-align:center;
cursor:pointer;
color:#1e78ae;
font-weight:bold;
}

.del {
border:solid 2px #ff6600;padding:5px 10px; width:100px; text-align:center;
cursor:pointer;
color:#ff6600;
font-weight:bold;
}

.edt {
border:solid 2px #1e78ae;padding:5px 10px; width:100px; text-align:center;
cursor:pointer;
color:#1e78ae;
font-weight:bold;
}

.nw:hover,  .rpl:hover, .del:hover, .edt:hover{
text-shadow:2px 2px 2px #CCC;
box-shadow:inset 2px 2px 2px #CCC;
font-weight:bold;
}

.bd_arr {
background:#666;
padding:5px 10px;
font-weight:bold;
border-radius:10px;
}

.btn {
padding:5px 30px;
border-radius:5px;
color:#FFF;
font-weight:bold;
font-size:20px;
cursor:pointer;
border:none;
transition:all .2s;
}

.btn:hover {
box-shadow: 3px 3px 3px #999;
}

.brd_btm {
border-bottom:dashed 1px #CCC;
padding-bottom:10px;
}


/*                    HP_BOARD       START               */


#hp_board table {
  border-collapse: collapse;
  margin: 0;
  padding: 0;
  width: 100%;
  table-layout: fixed;
}

#hp_board table caption {
  font-size: 1.5em;
  margin: .5em 0 .75em;
}

#hp_board table th {
  background-color: #f8f8f8;
  border-top: 1px solid #333;
  border-bottom: 1px solid #ddd;
  padding: .35em;
  font-weight:bold;
  font-size:20px;
  letter-spacing: .1em;
  text-transform: uppercase;
   text-align: center;
}

#hp_board table tr:hover {
  background:#FAFAFA;
}

#hp_board table td {
  border-bottom: 1px solid #ddd;
  padding: .35em;
  font-size:16px;
}

#hp_board table th,
#hp_board table td {
  padding: .625em;
 }

.bd_td_tlt {width:40%;}

.bd_tlt_ct {text-align:center;}

.text {padding-left:22px;}
.text-center{ text-align:center;}
.text-right{ text-align:right;}


.gab_10 {
clear:both;
padding-top:10px;
border-top:dashed 1px #ccc;
}


.gt_5 {
clear:both;
height:5px;
}


.gt_10 {
clear:both;
height:10px;
}

.gt_20 {
clear:both;
height:20px;
}

.gt_30 {
clear:both;
height:30px;
}

.gt_50 {
clear:both;
height:50px;
}

.gt_60 {
clear:both;
height:60px;
}

.gt_80 {
clear:both;
height:80px;
}

.gt_100 {
clear:both;
height:100px;
}

.gt_130 {
clear:both;
height:130px;
}

.gt_150 {
clear:both;
height:150px;
}

.gall_brd {
	float:left; width:33.33%;
}

.gall_img_w{
width:360px;margin:auto;'
}
.gall_img_h{
height:300px;
}

div.contain {
  text-align: center;
}

div.contain p {
	padding:10px;
}

.image {
  opacity: 1;
  display: block;
  transition: .5s ease;
  backface-visibility: hidden;
}

.contain:hover .image {
  opacity: 1;
}

.zoom {
    padding: 0px;
    transition: transform .2s; /* Animation */
	width:340px;
    height: 308px;
    margin: 0 auto;
}

 .zoom:hover {
}

.item {
  position: relative;
  overflow: hidden;
}

