@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;}
*/

@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
}
@import url('https://webfontworld.github.io/gmarket/GmarketSans.css');
@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://webfontworld.github.io/BMDoHyeon/BMDoHyeon.css');
@import url('https://fonts.googleapis.com/css2?family=Dosis:wght@800&display=swap');
@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: 'GmarketSansMedium',sans-serif; font-weight:300;}


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:#666;}

.gmak { font-family: 'GmarketSansMedium'; font-weight:500; color:#FFF; }
.gmak_tlt { font-family: 'GmarketSansMedium'; font-weight:800; color:#575F81; font-size:34px;}
.gmak_tlt:before{content:"\275D";}
.gmak_tlt:after{content:"\2760";} /* 275E */
.gmak_tlt2 { font-weight:500; color:#575F81; font-size:25px;}
.gmak_tlt3 { font-family: 'GmarketSansMedium'; font-weight:800; color:#575F81; font-size:25px;}

.bg_gray {background:#aaa;}
.bg_sgray  {background:#eee;}
.bg_white {background:#FFF;}
.bg_bage {background:#fdfaf5;}
.bg_red{background:#ff6600;}
.bg_blue{background:#575F81;}
.bg_green{background:#a0bd2d;}

.f_l_3 {float:left; width:3%; height:10px;}

.pd_h_6 {clear:both; height:6px;}
.pd_h_10 {clear:both; height:10px;}
.pd_h_15 {clear:both; height:15px;}
.pd_h_20 {clear:both; height:20px;}
.pd_h_30 {clear:both; height:30px;}
.pd_h_40 {clear:both; height:40px;}
.pd_h_50 {clear:both; height:50px;}
.pd_h_60 {clear:both; height:60px;}
.pd_h_70 {clear:both; height:70px;}
.pd_h_80 {clear:both; height:80px;}
.pd_h_90 {clear:both; height:90px;}
.pd_h_100 {clear:both; height:100px;}
.pd_h_110 {clear:both; height:110px;}
.pd_h_120 {clear:both; height:120px;}
.pd_h_130 {clear:both; height:130px;}
.pd_h_160 {clear:both; height:160px;}
.pd_h_180 {clear:both; height:180px;}
.pd_h_200 {clear:both; height:200px;}

.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;}

.t_c {text-align:center;}
.f_w {font-weight:500;}

.txt_col_wht {color:#fff;}
.txt_col_red {color:#C6534D;}
.txt_col_blue {color: #575F81;}
.txt_col_green {color:#6fb032;}

.h4 {
font-weight:bold; font-size:20px;
}


.npen {
/*font-family: 'Gowun Dodum', sans-serif; font-size:25px; line-height:40px;*/
font-weight:500;
}

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;
} 

.mtlt {
font-size:25px; 
color:#FFF;
font-weight:800;
}

.mtlt2 {
font-size:18px; 
color:#555;
font-weight:500;
}

.mtlt3 {
font-size:20px; 
color:#666;
padding-left:80px;
}

.mtlt4 {
font-size:27px; 
color:#888;
font-weight:500;
}

.mcnt {
font-size:14px; 
line-height:30px;
color:#999;
}

.mcnt2 {
font-size:20px; 
color:#FFF;
}


.mtimg {transition:.2s;}
.mtimg:hover {opacity:.8;}

.mmore {color:#7db548; margin-left:500px;width:100px;  height:30px; line-height:30px; text-align:center;transition: .2s;  font-weight:bold;}

.mmore:hover {  cursor:pointer; border-radius:15px; 
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;}

.mmore2 {  width:100px; height:30px; line-height:30px; text-align:center; 
color:#666; cursor:pointer; font-size:16px; transition:.2s; font-weight:bold;}

.mmore2:hover { border-radius:15px;
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

.mmore3 {position:absolute;background:#6aaf30; border-radius:50px 0  0 0; width:40px; height:40px; line-height:40px; font-size:30px;color:#FFF; font-weight:bold;
left:50%; margin-left:352px; margin-top:109px; opacity:.5; transition:all .2s;  text-align:right; padding:10px 8px 0 0 ;}

.mmore3:hover { opacity:1; width:50px; height:50px; line-height:50px; font-size:45px; border-radius:60px 0  0 0; margin-left:342px; margin-top:99px;}

.mmore4 {position:absolute;background:#6aaf30; border-radius:50px 0  0 0; width:40px; height:40px; line-height:40px; font-size:30px;color:#FFF; font-weight:bold;
left:50%; margin-left:251px; margin-top:274px; opacity:.5; transition:all .2s; text-align:right; padding:10px 8px 0 0 ;}

.mmore4:hover { opacity:1; width:50px; height:50px; line-height:50px; font-size:45px; border-radius:60px 0  0 0; margin-left:241px; margin-top:264px;}

#mlnk:hover {
text-shadow: 1px 1px #ddd;
}

#mlnk2:hover {
text-shadow: 1px 1px #666;
}

#mlnk3:hover {
text-shadow: 1px 1px #bbb;
}


.main_mbox1, .menu1_bg {position:absolute; left:50%; margin-left:90px; margin-top:40px; cursor:pointer;}
.main_mbox2, .menu2_bg {position:absolute; left:50%; margin-left:240px; margin-top:40px; cursor:pointer;}
.main_mbox3, .menu3_bg {position:absolute; left:50%; margin-left:390px; margin-top:40px; cursor:pointer;}
.main_mbox4, .menu4_bg {position:absolute; left:50%; margin-left:540px; margin-top:40px; cursor:pointer;}

.menu1_bg, .menu2_bg, .menu3_bg, .menu4_bg {
opacity:0;
transition:all linear .3s;
z-index:999;
width:145px;
 height:300px; 
}

.menu1_bg {
background:url(/images/ab_1o.jpg);
}

.menu2_bg {
background:url(/images/ab_2o.jpg);
}


.menu3_bg {
background:url(/images/ab_3o.jpg); 
}

.menu4_bg {
background:url(/images/ab_4o.jpg); 
}

.menu1_bg:hover, .menu2_bg:hover, .menu3_bg:hover, .menu4_bg:hover {
opacity:1;
}

.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;}

/* Products */


ul.tabs {
position:relative;
float:left;
list-style: none;
height: 50px;
width: 100%;
-webkit-box-sizing:border-box; 
box-sizing:border-box;
margin:0;
padding: 0;
}

ul.tabs {
float:left;
width:100%;
}

ul.tabs li {
text-align:left;
cursor: pointer;
width:100%;
padding-left: 60px;
line-height: 90px;
height:90px;
-webkit-box-sizing:border-box; 
box-sizing:border-box;
color:#1d519e;
font-size:20px;
font-weight:500;
}

ul.tabs li:first-child {}

ul.tabs li.active {
color:#1d519e;
font-weight:500;
background:#dbe0e6;
}

ul.tabs li.active:before {
position:absolute;
content:"\2014 ";
margin-left:-40px;
}

.tab_container {
position:relative;
float:left;
width:100%;
padding-left:0px;
-webkit-box-sizing:border-box; box-sizing:border-box;
}

.tab_content {

}


/* photo gall*/
.pt_img { transition:.2s;}
.pt_img:hover {
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

.pt_subj { font-size:16px;}

.sub_top_head1 {
position:absolute; z-index:99; 
font-size:35px;  margin:200px 0 0 -650px; left:50%; 
line-height:60px; 
color:#FFF; text-decoration:none; font-size:35px;   font-family: 'GmarketSansMedium';font-weight:500;
}

.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:1300px;
min-height:350px;
margin:0 auto 60px auto;
line-height:30px;
}


#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;
}


.s2_stlt_top {
font-family: 'GmarketSansMedium';font-weight:600;
font-size:40px;
color:#575F81;
}

.s2_line{
width:100%; height:1px; background:#575F81; box-shadow: 2px 1px 3px #c7cad8;
}

.s2_stlt_sbu_t0 {font-size:20px; font-weight:500;}

.s2_stlt_sbu_t {font-size:24px; font-weight:500;}

.stlt_top {
font-size:24px;
font-weight:500;
color:#1a6e3a;
padding-bottom:0px;
}


.stlt_top_s::before{
content: "|";
color:#1a6e3a;
}

.stlt_top_s {
font-size:25px;
font-weight:500;
color:#333;
}

.stlt_top_s2 {
font-size:16px;
font-weight:500;
color:#1a6e3a;
line-height:25px;
padding-bottom:0px;
}

.stlt_top_s3 {
font-size:20px;
font-weight:500;
color:#1a6e3a;
line-height:25px;
padding-bottom:0px;
}

.stlt_top_s4 {
font-size:20px;
color:#333;
text-align:center;
}

.stlt_top_s5 {
font-size:20px;
}

.stlt_top_s6::before{
content: "·";
color:#1a6e3a;
}

.stlt_top_s6 {
font-size:20px;
color:#333;
padding-left:20px;
font-weight:500;
}

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:15px 0;
font-weight:500;
font-size:18px;
background:#8DA6A6;
color:#FFF;
text-align:center;
}

 .tbl2 th {
padding:5px;
font-weight:bold;
font-size:16px;
background:#508D81;
color:#FFF;
text-align:center;
line-height:40px;
}

.tbl td {
padding:10px;
font-size:16px;
text-align:center;
border:solid 1px #EEE;
line-height:25px;
}

.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;
}

.s23_sbox{width:377px;margin:auto;background:#575F81; color:#FFF; font-weight:bold;}
.s23_sbox2{width:1101px;margin:auto;background:#575F81; color:#FFF; font-weight:bold;}
.s23_box_cnt {border:solid 1px #575F81; color:#575F81;background:#FFF; padding:10px 0;}

.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: 10px;
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:#fbf8f8;
line-height:30px;
width:600px;
margin-left:35px;
}

.box_cnt2{
word-break:keep-all;
text-align: justify;
text-justify: inter-word;
font-size:16px;
line-height:30px;
margin-left:30px;
}

.box_img {
box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px;
text-align:center;
padding:20px 0;
}

.box_img2 {
box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px;
text-align:center;
padding:20px 0;
width:92%;
margin-left: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 =======*/

.ctab1, .ctab2, .ctab3{
float:left;
width:19.8%;
text-align:center;
line-height:50px;
color:#FFF;
}

.ctab4, .ctab7{
float:left;
width:49.8%;
text-align:center;
line-height:50px;
color:#FFF;
}

.ctab5, .ctab6{
float:left;
width:33.1%;
text-align:center;
line-height:50px;
color:#FFF;
}

.ct_gab {
float:left;
height:50px;
width:2px;
}

.sub_menu_t {
width:100%; height:50px;
margin-top:-50px;
opacity:.8;
}

.sub_menu {
display:block; width:1300px; margin:auto;
}


.ct_active {
background:#304A8F; 
font-weight:500;
cursor:default;
font-size:18px;
}

.ct_unactive {
background:#FFF;
transition:all .2s;
cursor:pointer;
color:#666;
font-size:18px;
}

.ct_unactive:hover {
box-shadow:inset 4px 4px 4px #CCC;
font-weight:500;
}


/*====================================================================
	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;
}

.video_btn {
transition: all .4s;
}

.video_btn:hover {
margin-top:-10px;
}

.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:400px;
    height: 350px;
    margin: 0 auto;
}

 .zoom:hover {
}

.item {
  position: relative;
  overflow: hidden;
}

/*  Time Line */


	#history {
	  width:100%;
	  margin:auto;
	}


	#history h2 {
	  font-size: 35px;
	  color: #fb8a44;
	  line-height: 1;
	 font-weight:bold;
	 margin-left:20px;
	}

	.hist_y {text-align:right;padding-top:40px; padding-right:80px; width:200px;}
	.hist_m {}

	.list_right {
	  clear:both;
	  display: table;
	  width: 100%;
	  table-layout: fixed;
	  padding-left:30px;
	}

	.list_right span {
	  display: table-cell;
	  vertical-align: top;
	}

	.list_right div {
	  position: relative;
	  display: table-cell;
	  vertical-align: top;
	}

	.list_right .hist_m:before {
	  content: "";
	  position: absolute;
	  left: 0;
	  width: 1px;
	  height: 100%;
	  background: #dfdfdf;
	}

	.list_right .hist_m ul {
	  margin: 40px 0;
	}

	.list_right .hist_m ul li {
	  display: table;
	  position: relative;
	  width: 100%;
	  padding-left: 20px;

	}

	.list_right .hist_m ul li+li {
	  margin-top: 40px;
	}

	.list_right .hist_m ul li:before {
	  content: "";
	  position: absolute;
	  left: -10px;
	  top: 3px;
	  width: 12px;
	  height: 12px;
	  border: 5px solid #fbb285;
	  background:#fb8a44;
	  border-radius: 50%;

	}

	.list_right dl {
	  text-align: left;
	  display: table;
	  width: 100%;
	  margin-left:40px;
	  padding-bottom:20px;
	}

	.list_right dl dt {
	  width: 8%;
	  display: table-cell;
	  vertical-align: middle;
	  font-size: 20px;
	  color: #444;
	  font-weight: bold;
	  text-align: center;
	}

	.list_right dl dd {
	  display: table-cell;
	  vertical-align: middle;
	  font-size: 16px;
	  color: #444;
	  text-align: left;
	  padding-left:40px;
	}


	.list_left {
	  display: table;
	  width: 100%;
	  table-layout: fixed;
	}

	.list_left span {
	  display: table-cell;
	  vertical-align: top;
	}

	.list_left div {
	  position: relative;
	  display: table-cell;
	  vertical-align: top;
	}

	.list_left div:before {
	  content: "";
	  position: absolute;
	  right: -1px;
	  width: 1px;
	  height: 100%;
	  background: #dfdfdf;
	}

	.list_left div ul {
	  margin: 40px 0;
	}

	.list_left div ul li {
	  display: table;
	  position: relative;
	  width: 100%;
	  padding-left: 20px;
	}

	.list_left div ul li+li {
	  margin-top: 40px;
	}

	.list_left div ul li:before {
	  content: "";
	  position: absolute;
	  right: -10px;
	  top: 3px;
	  width: 12px;
	  height: 12px;
	  border: 3px solid #0a4a9f;
	  border-radius: 50%;
	}

	.list_left dl {
	  text-align: right;
	  display: table;
	  width: 100%;
	  padding-right: 20px;
	}

	.list_left dl dt {
	  width: 10%;
	  display: table-cell;
	  vertical-align: middle;
	  font-size: 14px;
	  color: #444;
	  font-weight: bold;
	  text-align: right;
	}

	.list_left dl dd {
	  width: 90px;
	  display: table-cell;
	  vertical-align: middle;
	  font-size: 16px;
	  color: #444;
	  text-align: right;
	}


.s1_tab {float:left; font-size:16px; color:#666;  text-align:center; border:solid 1px #666; padding:8px 0px; width:24.3%; cursor:pointer; transition: .2s;}
.s1_tab:hover {color:#FFF; border:solid 1px #548b21; background:#6eb92b; box-shadow:inset 4px 4px 4px #548b21;}
.s1_tabo {float:left; font-size:16px; color:#FFF;  text-align:center; border:solid 1px #6eb92b; background:#6eb92b;  padding:8px 0px; width:24%; }
.s1_gab {float:left; width:10px; height:10px; text-align:center;}

.s2_nav {padding:0; width:100%;}
.s2_nav li {float:left; text-align:center; padding-bottom:10px;}
.s2_nav_to, .s2_nav_t {width:32%; }
.s2_nav_to {border-bottom: solid 2px #FA9520; font-weight:500; color:#FA9520; font-size:22px;}
.s2_nav_t {border-bottom: solid 2px #EEE;  font-size:20px; cursor:pointer; transition: .2s;}
.s2_nav_t:hover {border-bottom: solid 2px #FA9520; color:#FA9520; font-weight:bold; font-size:22px;}
.s2_nav_gab {width:1%; height:5px;}

.s23_gab {float:left; width:20px; height:10px; text-align:center;}
.s23_gal {float:left; text-align:center; line-height:40px;}

.s24_gab {float:left; width:20px; height:10px; text-align:center;}
.s24_gal {float:left; text-align:center; line-height:40px;}
.s2_bs {box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}

/*
 CSS for the main interaction
*/
.tabset > input[type="radio"] {
  position: absolute;
  left: -200vw;
}

.tabset .tab-panel {
  display: none;
}

/*
.tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
.tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
.tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3),
.tabset > input:nth-child(7):checked ~ .tab-panels > .tab-panel:nth-child(4),
.tabset > input:nth-child(9):checked ~ .tab-panels > .tab-panel:nth-child(5),
.tabset > input:nth-child(11):checked ~ .tab-panels > .tab-panel:nth-child(6) {
  display: block;
}


 Styling
*/


.tabset > label {
  position: relative;
  display: inline-block;
  padding: 15px 25px 25px;
  border: 1px solid transparent;
  border-bottom: 0;
  cursor: pointer;
  font-weight: 300;
  font-size:16px;
}

.tabset > label::after {
  content: "";
  position: absolute;
  left: 25px;
  bottom: 10px;
  width: 22px;
  height: 4px;
  background: #8d8d8d;
  font-weight: 500;
}

.tabset > label:hover,
.tabset > input:focus + label {
  color: #575F81;
}

.tabset > label:hover::after,
.tabset > input:focus + label::after,
.tabset > input:checked + label::after {
  background: #575F81;
}

.tabset > input:checked + label {
  border-color: #ccc;
  border-bottom: 1px solid #fff;
  margin-bottom: -1px;
  color: #575F81;
  font-weight: 500;
}

.stab-panel {
  padding: 50px 0 0 0;
  border-top: 1px solid #ccc;
}

/*=============== s22=============*/

.s22_l,
.s22_r {
float:left;
}

.s22_r {padding-left:30px;  }

