@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700&subset=korean');
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, 
ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
	font-family: 'Nanum Gothic', sans-serif;
}
a { text-decoration:none; }
body { overflow-x:hidden; position:relative; }
ul li { list-style:none; }
.tem_ul{overflow:hidden; height:100px;}
.tem_ul li{float:left;}
.li01, .li02{display:block; width:102px; height:93px; line-height:93px; color:#fff; font-size:14px; font-weight:bold; text-align:center;}

.li03{display:block; width:102px; height:93px; line-height:93px; color:#f46f21; background:#000; font-size:14px; font-weight:bold; text-align:center;}
.tem_ul li a:hover{color:#f46f21 !important; font-size:14px; font-weight:bold;}

.tem_top_wrap { width:100%; height:74px; background:url('/img/tem-bg.gif') repeat-x; }
.tem_top { width:1020px; height:74px; margin:0 auto; text-align:center; position:relative; }
.tem_top h1 { float:left; color:#fff; font-size:18px; font-weight:normal; text-align:left; margin-top:15px; }
.tem_top h1 img { float:left; margin:3px 17px 0 0; }
.tem_top h1 span { font-size:14px; color:#989898; }

.tem_menu_wrap { width:100%; height:93px; background:#2c2c2c; border-bottom:7px solid #f46f21; margin-bottom:45px; }
.tem_menu { width:1020px; height:93px; margin:0 auto; text-align:center; position:relative; }

.tem_menu_wrap2 { width:100%; height:23px; background:#2c2c2c; border-bottom:7px solid #f46f21; margin-bottom:45px; }
.tem_menu2 { width:1020px; height:93px; margin:0 auto; text-align:center; position:relative; }

.tem_menu_wrap3 { width:100%; height:93px; background:#2c2c2c; border-bottom:7px solid #f46f21; margin-bottom:45px; }
.tem_menu3 { width:1020px; height:93px; margin:0 auto; text-align:center; position:relative; }

.tem_list_wrap { width:100%; background:#fff; }
.tem_list { width:1020px; margin:0 auto; }
.tem_list li { float:left; width:242px; height:260px; position:relative; background-size:100%; background-position:top center; background-repeat:no-repeat; margin:0 17px 17px 0; cursor:pointer;
	-webkit-box-shadow: 2px 2px 13px 0px rgba(0,0,0,0.21);
	-moz-box-shadow: 2px 2px 13px 0px rgba(0,0,0,0.21);
	box-shadow: 2px 2px 13px 0px rgba(0,0,0,0.21);
	transition:all 400ms;
}
.tem_list li:hover { -moz-transform: scale(1.1,1.1); -webkit-transform: scale(1.1,1.1); transform: scale(1.1,1.1); }

.tem_list li:nth-child(4n-8) { margin-right:0; }
.tem_list li div.name-tag { position:absolute; width:216px; height:57px; background-color:#f6f3f1; bottom:0; left:0; padding:15px 13px; }
.tem_list li#moreBtn { text-align:center; line-height:260px; font-size:30px; color:#e7e7e7; }
.tem_list li#moreBtn > i { margin-right:5px; }
.tem_list li.loading { text-align:center; box-shadow:none; transition:none; width:100%; display:none; }
.tem_list li.loading > i { font-size:60px; color:#e7e7e7; line-height:260px; }
.name-tit { font-size:16px; font-weight:bold; color:#000; line-height:26px; }
.name-num { font-size:16px; font-weight:bold; color:#f46f21; line-height:26px; }

.tem_footer_wrap { width:100%; height:174px; background:#2c2c2c; margin-top:20px; }
.tem_footer { width:1020px; height:134px; margin:0 auto; text-align:center; position:relative; padding-top:40px; color:#848484; text-align:center; }
.tem_footer >.gh-btn { display:inline-block; float:none; }
.tem_footer a { color:#848484; text-decoration:underline; }

.bg-btn-box { position:absolute; top:21px; right:0; }
.bg-btn-box > a {display:inline-block;}
.bg-btn { float:left; background:#a3a3a3; color:#fff; font-size:14px; text-align:center; padding:8px 8px; margin-left:5px; border:1px solid #c1c1c1; transition:background-color 300ms ease; cursor:pointer; } 
.bg-btn:hover { transition:background-color 300ms ease; background-color:transparent; } 
.bg-btn02{position:relative; overflow:hidden; float:left; background:#f46f21; color:#000; font-size:14px; font-weight:bold; text-align:center; padding:8px 8px; margin-left:5px; border:1px solid #f46f21; transition:background-color 300ms ease; cursor:pointer; } 
.bg-btn02:hover { color:#f46f21; background-color:transparent; }
.bg-btn02:before{content: "";position: absolute;top: 0px;left: -80px;display: block;width: 30px;height: 120%;-webkit-transform: skew(20deg);-moz-transform: skew(20deg);-o-transform: skew(20deg);background-color: rgba(255,255,255,0.2);transition: all 0.7s;z-index: 999; animation-iteration-count:infinite; animation-delay:1s; animation-duration:2.3s; animation-name: slide_move; animation-direction:alternative;}

@keyframes slide_move{
	to{left:350px;}
}


.gh-btn { border:1px solid #606060; background:transparent; padding:8px 8px; text-align:center; color:#c5c5c5; font-size:14px; transition:all 300ms ease; cursor:pointer; }
.gh-btn:hover { transition:all 300ms ease; background-color:#606060; color:#fff; }


.tem_layer { display:none; position:fixed; top:0; left:0; width:100%; height:100%; overflow-y:auto; cursor:pointer; text-align:center; z-index:102; }
.tem_layer img { -webkit-box-shadow: 2px 2px 13px 0px rgba(0,0,0,0.21); -moz-box-shadow: 2px 2px 13px 0px rgba(0,0,0,0.21); box-shadow: 2px 2px 13px 0px rgba(0,0,0,0.21); margin-bottom:50px; }
.tem_layer_tag { background:rgba(0,0,0,0.6); height:40px; width:600px; line-height:40px; color:#fff; font-weight:bold; font-size:16px; display:block; margin:70px auto 0 auto; }
.tem_layer_tag span { color:#f46f21; }
.bg-layer { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:101; }

/*slider*/
.ca-container{
	position:relative;
	width:100%;
	height:93px;
	background:transparent;
	margin:0 auto;
}
.ca-wrapper{
	width:100%;
	height:100%;
	position:relative;
}
.ca-item{
	position:relative;
	float:left;
	width:10%;
	height:93px;
	line-height:93px;
	text-align:center;
}
.ca-item a {
	color:#fff;
	font-size:14px;
	font-weight:bold;
	transition:all 200ms ease-in-out;
}
.ca-item a:hover {
	color:#f46f21;
	font-size:14px;
	font-weight:bold;
	transition:all 200ms ease-in-out;
}
.ca-nav span{
	width:17px;
	height:93px;
	background:url('/img/arrow.gif') no-repeat center left;
	position:absolute;
	top:0;
	left:-28px;
	text-indent:-9000px;
	cursor:pointer;
	z-index:100;
}
.ca-nav span.ca-nav-next{
	background-position:center right;
	left:auto;
	right:-28px;
}
.ca-nav span:hover{
	opacity:1.0;
}
.ca-item-on { background:#000; color:#f46f21; }
.ca-item-on a { color:#f46f21; }

.tem_menu_ul_wrap { width:1020px; height:93px; position:relative; overflow:hidden; }
.tem_menu_ul_wrap:after {content:" "; display:block; clear:both;}
.tem_menu_ul { width:2000px; position:absolute; margin-left:-102px; padding:0; }
.tem_menu_ul:after {content:" "; display:block; clear:both;}
.tem_menu_ul li { float:left; }
.tem_menu_ul li a { display:block; width:102px; height:93px; line-height:93px; color:#fff; font-size:14px; font-weight:bold; transition:all 200ms ease-in-out; text-align:center; }
.tem_menu_ul li a.tem_menu_on { background:#000; color:#f46f21; }
.tem_menu_ul li a:hover { color:#f46f21; font-size:14px; font-weight:bold; transition:all 200ms ease-in-out; }
.tem_menu_indi { width:17px; height:93px; background:url('/img/arrow.gif') no-repeat center left; position:absolute; top:0; left:-28px; text-indent:-9000px; cursor:pointer; z-index:100; }
.tem_menu_indi.indi_right { background-position:center right; left:auto; right:-28px; }