@charset "utf-8";
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 100;
	src: url(./fonts/NotoSansKR-Thin.woff2) format('woff2'), 
	url(./fonts/NotoSansKR-Thin.woff) format('woff'), 
	url(./fonts/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 300;
	src: url(./fonts/NotoSansKR-Light.woff2) format('woff2'), 
	url(./fonts/NotoSansKR-Light.woff) format('woff'), 
	 url(./fonts/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 400;
	src: url(./fonts/NotoSansKR-Regular.woff2) format('woff2'), 
	url(./fonts/NotoSansKR-Regular.woff) format('woff'), 
	url(./fonts/NotoSansKR-Regular.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 500;
	src: url(./fonts/NotoSansKR-Medium.woff2) format('woff2'), 
	url(./fonts/NotoSansKR-Medium.woff) format('woff'), 
	url(./fonts/NotoSansKR-Medium.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 700;
	src: url(./fonts/NotoSansKR-Bold.woff2) format('woff2'), 
	url(./fonts/NotoSansKR-Bold.woff) format('woff'),  
	url(./fonts/NotoSansKR-Bold.otf) format('opentype');
} 


html {width:100%;height:100%;overflow-x:hidden;overflow-y:scroll}
body {padding:0;margin:0;font-size:12px;font-family:'Noto Sans KR', Sans-Serif, Dotum, Gulim, AppleGothic; width:100%;height:100%}
input,select,textarea {font-size:12px;font-family:'Noto Sans KR', Sans-Serif, Dotum, Gulim, AppleGothic; }
img,p {border:0;margin:0;padding:0;}
form {display:inline;margin:0;padding:0;}
select {font-size:12px;font-family:'Noto Sans KR', Sans-Serif, Dotum, Gulim, AppleGothic; }
label {cursor:pointer;}
a {text-decoration:none;color:#000;}
a:hover {color:#666;}
#wrap {width:100%;height:100%;margin:auto;position:relative}
ul li { list-style:none;}

/*헤드영역*/
#headerbg {width:100%;position:absolute;top:0;left:0;z-index:1}
#header {min-width:1280px;position:relative;top:0;left:0;z-index:2;margin:0 auto}
#header .logo {position:absolute;}
#header .logo h1 {margin:0 0 0 3px;padding:0;height:35px;}
#header .logo h1 a {font-weight:bold;color:#555;font-size:22px;font-family:nanumgothic,dotum;}
#header .gnb {position:absolute;padding:0;width:360px;text-align:right; z-index:999}
#header .gnb ul {padding:0;margin:0;letter-spacing:-1px;}
#header .gnb li {list-style-type:none;display:inline;padding:5px 0 5px 10px;font:normal 11px "malgun gothic",dotum;}
#header .gnb .admin a {color:#ff0000;}
#header .headUserHtml {color:#fff}
#lnb {width:100%;position:absolute;margin:0 auto;z-index:2;}
#lnbbg {width:100%;position:relative;margin:0 auto;z-index:1; display:none}
#lnb .lnbWrap {width:1000px;margin:0 auto;}

#content {}
#content .subContent { padding:50px 0; font-size:15px;word-break: keep-all;}
#content .subContent h3.subTitleSubject {margin:0;padding:0; font-size:20px; font-weight:500;padding-bottom:5px;letter-spacing:-1px;margin-bottom:15px;color:#555;}
/*--서브메뉴--*/
#content .snb {float:left;width:184px;padding:0;margin:0;}
#content .snb .snbBottom {padding:0px;margin-top:10px}

#content .snb .mybox {margin-bottom:10px}
#content .snb .mybox {border:#D4D4D4 solid 1px;}
#content .snb .mybox .login .mbrinfo {background:#F4F4F4;padding:0;border-bottom:#dfdfdf solid 1px;position:relative;height:80px;}
#content .snb .mybox .login .symbol {position:absolute;top:5px;left:5px;}
#content .snb .mybox .login .symbol img {width:37px;height:37px;border:1px #c0c0c0 solid}
#content .snb .mybox .login .namel {position:absolute;top:30px;left:55px;width:120px;height:12px;font-weight:bold;color:#454545;}
#content .snb .mybox .login .namer {position:absolute;top:5px;left:55px;width:108px;height:12px;font-weight:bold;color:#454545;}
#content .snb .mybox .login .score {position:absolute;bottom:12px;left:10px;font-size:11px;font-family:verdana;color:#636363;padding-top:3px;letter-spacing:-1px}
#content .snb .mybox .login .tabbox {}
#content .snb .mybox .login .tabbox .tp {float:left;width:60px;height:24px;line-height:24px;background:#F4F4F4;border-top:#ffffff solid 1px;border-bottom:#D4D4D4 solid 1px;text-align:center;font-weight:bold;color:#9E9E9E;cursor:pointer;position:relative}
#content .snb .mybox .login .tabbox .tp span.mcounter {
	font-weight:normal; font-size:11px; color:#F21914;letter-spacing:-1px;position:absolute;top:-10px;right:2px;font-family:arial;
	border-radius:12px;background-color:#ff6000;height:14px;padding:0 5px;color:#fff;line-height:14px;
	box-shadow:1px 1px 3px #ccc;
}
#content .snb .mybox .login .tabbox .tp span.mcounter1 {
	font-weight:normal; font-size:11px; color:#F21914;letter-spacing:-1px;position:absolute;top:-10px;right:2px;font-family:arial;
	border-radius:12px;background-color:#999;height:14px;padding:0 5px;color:#fff;line-height:14px;
	box-shadow:1px 1px 3px #ccc;
}
#content .snb .mybox .login .tabbox .vline {border-right:#D4D4D4 solid 1px;}
#content .snb .mybox .login .tabbox .on {background:#ffffff;border-top:#ffffff solid 1px;border-bottom:#ffffff solid 1px;color:#676767;}
#content .snb .mybox .login .lbody {padding:8px;}
#content .snb .mybox .login .lbody ul {padding:0;margin:0;list-style-type:none;}
#content .snb .mybox .login .lbody li {padding:4px 0;line-height:130%;}
#content .snb .mybox .login .lbody li a {font-family:dotum;font-size:11px;letter-spacing:-1px;line-height:130%}
#content .snb .mybox .login .lbody li .comment {font-family:arial;font-size:11px;color:#E75801;padding-left:3px;}
#content .snb .mybox .login .lbody li .new {font-family:arial;font-size:10px;color:#ff0000;}
#content .snb .mybox .login .lbody li .reply {font-family:dotum;font-size:11px;color:#888888;letter-spacing:-1px}
#content .snb .mybox .login .lbody li .pic {float:left;width:35px;}
#content .snb .mybox .login .lbody li .info {float:left;width:130px;}
#content .snb .mybox .login .lbody li a.lbmore {display:block;text-align:center;border:1px #ddd solid;padding:3px;}
#content .snb .mybox .login .lbody li a.lbmore:hover {color:#ff6000;background:#f0f0f0}
#content .snb .mybox .login .lbody .none {text-align:center;padding-top:40px;}
#content .snb .mybox .login .lbody .none span {display:block;font-weight:bold;font-size:13px;letter-spacing:-1px;} 
#content .snb .mybox .login .lbody .none p {padding:10px 0 40px 0;color:#9C9C9C;line-height:140%;letter-spacing:-1px;font-size:11px}

#content .snb .mybox .logout .tabbox {}
#content .snb .mybox .logout .tabbox .np {padding:10px 0 10px 10px;background:#F4F4F4;border-bottom:#D4D4D4 solid 1px;font-weight:bold;color:#9E9E9E;}
#content .snb .mybox .logout .tabbox .tp {float:left;width:90px;height:22px;background:#F4F4F4;border-bottom:#D4D4D4 solid 1px;text-align:center;font-weight:bold;color:#9E9E9E;padding-top:12px;cursor:pointer;}
#content .snb .mybox .logout .tabbox .vline {width:91px;border-right:#D4D4D4 solid 1px;}
#content .snb .mybox .logout .tabbox .on {background:#ffffff;border-bottom:#ffffff solid 1px;color:#676767;}
#content .snb .mybox .logout .nlog {margin-top:10px;padding:0 0 30px 10px;position:relative;height:65px;}
#content .snb .mybox .logout .i1 {position:absolute;font-size:11px;font-family:dotum;color:#67686A;letter-spacing:-1px;padding-bottom:3px;}
#content .snb .mybox .logout .i1 .input {float:left;width:110px;height:17px;border:#BEBEBE solid 1px;font-size:12px;font-family:tahoma}
#content .snb .mybox .logout .i1 .input:focus {border:#BEBEBE solid 2px;}
#content .snb .mybox .logout .i2 {position:absolute;top:48px;left:8px;font-family:dotum;font-size:11px;letter-spacing:-1px}
#content .snb .mybox .logout .i3 {position:absolute; top:1px;left:127px;}

#content .snb .mybox .logout .rbtm {position:absolute;bottom:4px;left:8px;font-size:11px;font-family:dotum;color:#67686A;letter-spacing:-1px;padding:10px 0 0 3px;}
#content .snb .mybox .logout .rbtm .ipc {color:#67686A}
#content .snb .mybox .logout .rbtm a {color:#313946;}
#content .snb .mybox .logout .rbtm span {padding:0 5px 0 5px;}
#content .snb .mybox .logout .slog {padding:20px 10px 10px 10px;}
#content .snb .mybox .logout .slog .icon {width:160px;padding:0px;text-align:center;}
#content .snb .mybox .logout .slog .icon img {cursor:pointer;margin:0 4px 0 4px;}
#content .snb .mybox .logout .slog .guide {line-height:140%;font-size:11px;font-family:dotum;color:#999;letter-spacing:-1px;padding:10px 0 0 0;}


#content .snb .category {padding:0;}
#content .snb .category h2 {margin:0 0 10px 0;font-family:nanumgothic,dotum;font-size:20px;letter-spacing:-2px;font-weight:bold;color:#222;text-align:center;background:url(./image/sub_title_bg.gif) no-repeat;height:46px;line-height:40px;}
#content .snb .category ul {padding:0;margin:0;}
#content .snb .category li {list-style-type:none;margin:0;border-bottom:1px #ddd solid}

#content .snb .category .m2 {font-size:12px;letter-spacing:-1px;}
#content .snb .category .m2 a {font-family:'돋움';color:#444;display:block;padding-left:23px;height:28px;line-height:28px;background:url(./image/snb_m2_ico.gif) no-repeat 10px 7px;_line-height:29px;}
#content .snb .category .m2 a:hover {text-decoration:none;color:#ff6000;background-color:#efefef}

#content .snb .category .selected2 a {color:#fff;background:url(./image/sub_active_orange.jpg) repeat-x 0 0;font-weight:bold;height:30px;line-height:30px}
#content .snb .category .selected2 a:hover {color:#fff;text-decoration:none;}
#content .snb .category .selected2 span.num {color:#fff}

#content .snb .category .orange a {background:url(./image/sub_active_orange.jpg) repeat-x 0 0;}
#content .snb .category .green a {background:url(./image/sub_active_green.jpg) repeat-x 0 0;}
#content .snb .category .blue a {background:url(./image/sub_active_blue.jpg) repeat-x 0 0;}
#content .snb .category .light_blue a {background:url(./image/sub_active_light_blue.jpg) repeat-x 0 0;}
#content .snb .category .black a {background:url(./image/sub_active_black.jpg) repeat-x 0 0;}
#content .snb .category .grey a {background:url(./image/sub_active_grey.jpg) repeat-x 0 0;}
#content .snb .category .red a {background:url(./image/sub_active_red.jpg) repeat-x 0 0;}

#content .snb .category ul li ul {margin:0px;background:none;background:#f0f0f0 url(./image/submenu_shadow.gif) repeat-x top;padding:10px 0;border-top:none}
#content .snb .category ul li ul li.m3 {font-weight:normal;font-size:12px;border-bottom:none}
#content .snb .category ul li ul li.m3 a {font-weight:normal;font-family:dotum;color:#454545;display:block;padding-left:23px;height:21px;line-height:21px;background:url(./image/snb_m3_ico.gif) no-repeat 16px 8px;letter-spacing:-1px;}
#content .snb .category ul li ul li.m3 a:hover {text-decoration:none;color:#000;background-color:#ddd;}

#content .snb .category ul li ul li.selected3 a {color:#ff6000;font-weight:bold;background:url(./image/snb_m3_ico_open.gif) no-repeat 15px 7px;}
#content .snb .category .spaceLi {height:7px;}
#content .snb .category .new {font:normal 10px arial;color:#ff0000;}
#content .snb .category .num {font:normal 11px arial;color:#999;}

/*하단정보영역*/
#footerInfoWrap .newPhoto {position:absolute;left:0;width:210px}
#footerInfoWrap .newPhoto .tt {padding:0 0 8px 0;font-weight:bold;color:#666;}
#footerInfoWrap .newPhoto .pic {float:left;margin:0 0 8px 5px;padding:3px;background:#fff}
#footerInfoWrap .newPhoto .pic:hover{background:#ff6000}
#footerInfoWrap .newPhoto .pic img {width:54px;height:45px;}
#footerInfoWrap .newPhoto .nomargin {margin:0 0 7px 0;clear:both;}

#footerInfoWrap .newPost {position:absolute;left:250px;width:210px}
#footerInfoWrap .newPost .tt {padding:0 0 8px 0;font-weight:bold;color:#666;}
#footerInfoWrap .newPost ul {padding:0;margin:0;}
#footerInfoWrap .newPost li {list-style-type:none;margin-bottom:5px;}
#footerInfoWrap .newPost li a {font-family:dotum;font-size:11px;color:#ccc;letter-spacing:-1px;line-height:135%;background:url(./image/ico_dot.gif) no-repeat 15px 4px;padding-left:23px;display:block}
#footerInfoWrap .newPost li a:hover {text-decoration:none;color:#ff6000;background-position:15px -41px}
#footerInfoWrap .newPost li .comment {font:normal 11px arial;color:#FC6138;}
#footerInfoWrap .newPost li .trackback {font:normal 11px arial;color:#02ACD6;}
#footerInfoWrap .newPost li .new {font-family:arial;font-size:10px;color:#ff0000;}
#footerInfoWrap .newPost .none {padding:0 0 0 15px;font-size:11px;color:#ddd;letter-spacing:-1px;}

#footerInfoWrap .newComment {position:absolute;left:250px;width:210px}
#footerInfoWrap .newComment .tt {padding:0 0 8px 0;font-weight:bold;color:#666;}
#footerInfoWrap .newComment ul {padding:0;margin:0;}
#footerInfoWrap .newComment li {list-style-type:none;margin-bottom:5px;}
#footerInfoWrap .newComment li a {font-family:dotum;font-size:11px;color:#ccc;letter-spacing:-1px;line-height:135%;background:url(./image/ico_dot.gif) no-repeat 15px 4px;padding-left:23px;display:block}
#footerInfoWrap .newComment li a:hover {text-decoration:none;color:#ff6000;background-position:15px -41px}
#footerInfoWrap .newComment li .comment {font:normal 11px arial;color:#FC6138;}
#footerInfoWrap .newComment li .trackback {font:normal 11px arial;color:#02ACD6;}
#footerInfoWrap .newComment li .new {font-family:arial;font-size:10px;color:#ff0000;}
#footerInfoWrap .newComment .none {padding:0 0 0 15px;font-size:11px;color:#ddd;letter-spacing:-1px;}

#footerInfoWrap .newNotice {position:absolute;left:250px;width:210px}
#footerInfoWrap .newNotice .tt {padding:0 0 8px 0;font-weight:bold;color:#666;}
#footerInfoWrap .newNotice ul {padding:0;margin:0;}
#footerInfoWrap .newNotice li {list-style-type:none;margin-bottom:5px;}
#footerInfoWrap .newNotice li a {font-family:dotum;font-size:11px;color:#ccc;letter-spacing:-1px;line-height:135%;background:url(./image/ico_dot.gif) no-repeat 15px 4px;padding-left:23px;display:block}
#footerInfoWrap .newNotice li a:hover {text-decoration:none;color:#ff6000;background-position:15px -41px}
#footerInfoWrap .newNotice li .comment {font:normal 11px arial;color:#FC6138;}
#footerInfoWrap .newNotice li .trackback {font:normal 11px arial;color:#02ACD6;}
#footerInfoWrap .newNotice li .new {font-family:arial;font-size:10px;color:#ff0000;}
#footerInfoWrap .newNotice .none {padding:0 0 0 15px;font-size:11px;color:#ddd;letter-spacing:-1px;}

#footerInfoWrap .postCalendar,#footerInfoWrap .bottomRss,#footerInfoWrap .bottomCounter {
	-webkit-border-radius: 8px;	-moz-border-radius:8px;	border-radius: 8px;
	-moz-box-shadow:1px 1px 6px rgba(0,0,0,0.5);-webkit-box-shadow:1px 1px 6px rgba(0,0,0,0.5);box-shadow:1px 1px 6px rgba(0,0,0,0.5);behavior: url(./_ie/PIE.htc);
}

#footerInfoWrap .postCalendar {position:absolute;width:184px;left:810px;background:#fff;border:2px #c0c0c0 solid;top:20px;}
#footerInfoWrap .postCalendar .tt {padding:5px 0 5px 0;text-align:center;font-weight:bold;font-family:verdana;color:#666;}
#footerInfoWrap .postCalendar .tt img {position:relative;top:-1px;}
#footerInfoWrap .postCalendar .sunday {color:#2B97D7;}
#footerInfoWrap .postCalendar .week {height:20px;}
#footerInfoWrap .postCalendar .week td {color:#333;background:#f9f9f9;}
#footerInfoWrap .postCalendar table {width:100%;}
#footerInfoWrap .postCalendar td {text-align:center;color:#666;font-family:dotum;font-size:11px;}

#footerInfoWrap .bottomRss {position:absolute;left:810px;width:174px;height:18px;padding:5px;background:#fff url(./image/rss.gif) no-repeat 5px 6px;border:2px #c0c0c0 solid;text-align:right;line-height:18px;}
#footerInfoWrap .bottomRss {font-family:tahoma;font-size:11px;}
#footerInfoWrap .bottomCounter {position:absolute;left:810px;background:#fff url(./image/ico_count.gif) no-repeat 8px 1px;width:114px;padding:5px 5px 5px 65px;border:2px #c0c0c0 solid;font-family:tahoma;font-size:11px;color:#777}
#footerInfoWrap .customerCont {position:absolute;width:200px;height:200px;font-family:dotum;font-size:11px;color:#ddd;letter-spacing:-1px;}
#footerInfoWrap .customerCont a {color:#fff;}
#footerInfoWrap .customerCont a:hover {color:#ff6000;}

/*하단*/
#footer {margin:0;padding:0 0 20px 0;position:absolute;left:0;display:block;width:100%;z-index:2}
#footerbg {margin:0;padding:0 0 20px 0;position:absolute;left:0;display:block;width:100%;z-index:1;}

#footer .footerCont {margin:0 auto;display:block;position:relative;}
#footerWrap .footerMenu {text-align:left;margin-bottom:0px;padding:10px 0px; background:#363642}
#footerWrap .footerMenu a { color:#ddd;letter-spacing:-1px;}
#footerWrap .footerMenu a:hover {color:#ff6000}
#footerWrap .footerMenu .split {font-family:dotum;font-size:9px;color:#c0c0c0;}

#footer .footerCont div.footerSiteInfo { display: inline-block;
vertical-align: top; font-size:14px;color:#999;text-align:left; margin:0 auto}
#footer .footerCont div.footerSiteInfo h5 { margin:0 0 15px 0; padding:0; font-size:16px;}
#footer .footerCont address {  color:#777; margin-top:15px;font-style:italic}
#footer .footerCont .footerContlogo {display: inline-block; vertical-align: top;  margin-right:40px;}
#footer .footerCont .footerLogo {}
#footer .footerCont .qrimage {position:absolute;right:0;top:0}
#footer .footerCont div.footerSiteInfo a{ color:#a6a6a6 !important;}
/*social*/
.social {position:absolute; right:0; top:0}
.social ul {margin:0; padding:0}
.social ul li { display:inline-block;}

/*etc*/
.templatePreview {position:fixed;top:0;left:0;z-index:1000;background:#ff6000;padding:15px;border:3px #000 solid;color:#fff;text-align:center}
.usersavePreview {position:fixed;top:0;left:0;z-index:1000;background:#00ccff;padding:15px;border:3px #000 solid;color:#fff;text-align:center}

/*탭메뉴01*/
.tab01 {background: url("./image/bg_tab.gif") no-repeat scroll 0 top transparent;overflow: hidden;position: relative;}
.tab01 ul {margin:0;padding:0;overflow: hidden;padding-left: 1px;width: 100%;}
.tab01 li {background: url("./image/bg_tab.gif") no-repeat scroll -1px top transparent;display: inline;float: left;margin-left: -1px;padding-left: 5px;}
.tab01 li a {background: url("./image/bg_tab.gif") no-repeat scroll right top transparent;display: inline-block;height: 32px;letter-spacing: -1px;line-height: 32px;padding:0 20px 0 16px;text-decoration: none;vertical-align: top;text-align:Center}
.tab01 li a:hover, .tab01 li a:active {text-decoration: none;}
.tab01 li.selected {background-position: 0 -58px;margin-right: 1px;position: static;z-index: 10;}
.tab01 li.selected a {background-position: right -58px;color: #ff6000;font-weight: bold;}

div.depth5 {list-style:none;height:33px;border-bottom:1px #bbb solid;margin-top:5px;}
div.depth5 a{display:inline-block;padding:8px 15px 5px 15px;letter-spacing:-0.5px;margin-right:10px;background:url('./image/common/bul_arrow1.gif') no-repeat 0 10px;font-weight:bold;}
div.depth5 a.selected5 {background:#ff6000;font-weight:bold;color:#fff;-webkit-border-radius: 3px; -moz-border-radius: 3px;}

#pctomobile {visibility:hidden}
#pctomobile_blueb {position:absolute;bottom:-70px;z-index:10000;display:block;width:100%;border:1px #000 solid;background:#e0e0e0;height:70px;text-align:center;font-family:dotum;font-size:24px;color:#fff;line-height:70px;}


.inner { width:1280px;margin:0 auto;position: relative;}




/*공통*/
.main .cont .title {margin:0 0 30px 0}
.main .cont .title h3 { font-size:24px; margin:0 0 5px 0}
.main .cont .title p { font-size:16px; color:#4e4e4e}



/* ******************  메인 비주얼 ********************** */
#mainVisual{overflow:hidden; width:100%; height:800px; position:relative;}	/* 비주얼높이값 이미지에맞게 수정 */
#mainVisual.full-height{height:1030px;}
.slick-track,
.slick-list {	-webkit-perspective: 2000;	-webkit-backface-visibility: hidden;}
#mainVisual .main-visual-list-con, 
#mainVisual .main-visual-con, 
#mainVisual .slick-list,  
#mainVisual .slick-track, 
.main-visual-item{	height:100%;}
#mainVisual .slick-track {overflow:hidden;}
.main-visual-con{z-index:1;}
/* 메인 비주얼 :: 이미지 */
.main-visual-item{position:relative;}
.main-visual-item .main-visual-pc-img{	width:100%;	height:100%;	background-size:cover !important;	-ms-transform: scale(1.1,1.1);    -o-transform: scale(1.1,1.1);     -moz-transform: scale(1.1,1.1);     -webkit-transform: scale(1.1,1.1);      transform: scale(1.1,1.1);	-webkit-transition:transform 3000ms  ease-in-out ;	-moz-transition:transform 3000ms ease-in-out ;	-o-transition:transform 3000ms ease-in-out ;	-ms-transition:transform 3000ms ease-in-out ;    transition:transform 3000ms ease-in-out;	}
.main-visual-item .main-visual-m-img{display:none;}

/* 메인 비주얼 :: 텍스트 */
.main-visual-item .main-visual-txt-con{position:absolute; top:50%; left:0px; width:100%; text-align:center; margin-top:-80px; color:#fff} /* margin-top은 조정 (텍스트영역 높이의 반) */

.main-visual-item .main-visual-txt-con .main-visual-txt1,
.main-visual-item .main-visual-txt-con .main-visual-txt2,
.main-visual-item .main-visual-txt-con .main-visual-txt3,
.main-visual-item .main-visual-txt-con .main-visual-more-btn{
	opacity:0;filter:Alpha(opacity=0);
	-ms-transform: translateY(-50px); 
    -o-transform: translateY(-50px); 
    -moz-transform: translateY(-50px);
    -webkit-transform: translateY(-50px); 
     transform: translateY(-50px);
	-webkit-transition:opacity 1.0s, transform 1.0s;
	-moz-transition:opacity 1.0s, transform 1.0s;
	-o-transition:opacity 1.0s, transform 1.0s;
	-ms-transition:opacity 1.0s, transform 1.0s;
	transition:opacity 1.0s, transform 1.0s;
}
.main-visual-item .main-visual-txt-con .main-visual-txt1{display:block; font-size:30px; font-weight:200; letter-spacing:-2px; margin-bottom:15px;} 


.main-visual-item .main-visual-txt-con .main-visual-txt2{ font-size:50px;font-weight:500; text-align:center;margin-bottom:20px; -webkit-transition-delay:0.3s;-moz-transition-delay:0.3s;-o-transition-delay:0.3s;-ms-transition-delay:0.3s;transition-delay:0.3s;}

.main-visual-item .main-visual-txt-con .main-visual-txt3{font-size:20px;   letter-spacing:-1px; font-weight:300; line-height:37px; margin-bottom:30px; -webkit-transition-delay:0.5s;-moz-transition-delay:0.5s;-o-transition-delay:0.5s;-ms-transition-delay:0.5s;transition-delay:0.5s;}

.main-visual-item .main-visual-txt-con .main-visual-more-btn{display:inline-block; font-size:16px; font-weight:300; color:#fff;  -webkit-transition-delay:0.8s;-moz-transition-delay:0.8s;-o-transition-delay:0.8s;-ms-transition-delay:0.8s;transition-delay:0.8s;}
.main-visual-item .main-visual-txt-con .main-visual-more-btn a {display:inline-block; width:175px; height:55px; font-size:16px; line-height: 55px; letter-spacing: -1px; color:#fff; border:2px solid #fff; -webkit-transition: all 0.4s cubic-bezier(.5, .24, 0, 1);  transition: all 0.4s cubic-bezier(.5, .24, 0, 1); position:relative; }
.main-visual-item .main-visual-txt-con .main-visual-more-btn a:first-child {margin-right: 15px;}
.main-visual-item .main-visual-txt-con .main-visual-more-btn a:hover{ border-left:2px solid #313A6B; border-right:2px solid #313A6B; text-shadow:1px 1px 3px rgba(0, 0, 0, 0.6);}

.line-btn a::before { content: '';  position: absolute;  left: -2px;  bottom:-2px;  z-index:1;  width: 0%;  height:2px;  background: #313A6B;  box-shadow: inset 0px 0px 0px #313A6B;  display: block; -webkit-transition: all 0.4s cubic-bezier(.5, .24, 0, 1); transition: all 0.4s cubic-bezier(.5, .24, 0, 1)}
.line-btn a:hover::before {  width:calc(100% + 4px);}
.line-btn a::after {  content: '';  position: absolute;  right: -2px;  top:-2px;  z-index:1;  width: 0%; height:2px;  background: #313A6B;  -webkit-transition: all 0.4s cubic-bezier(.5, .24, 0, 1);  transition: all 0.4s ubic-bezier(.5, .24, 0, 1); }
.line-btn a:hover::after { width:calc(100% + 4px);}


/* 메인 비주얼 :: active효과 */
.main-visual-item.active-item .main-visual-pc-img{
	-ms-transform: scale(1.0,1.0) rotate(0.01deg);
    -o-transform: scale(1.0,1.0) rotate(0.01deg);
    -moz-transform: scale(1.0,1.0) rotate(0.01deg);
    -webkit-transform: scale(1.0,1.0) rotate(0.01deg);
     transform: scale(1.0,1.0) rotate(0.01deg);
}
.main-visual-item.active-item .main-visual-txt1,
.main-visual-item.active-item .main-visual-txt2,
.main-visual-item.active-item .main-visual-txt3,
.main-visual-item.active-item .main-visual-more-btn{
	opacity:1.0;filter:Alpha(opacity=100);
	-ms-transform: translateY(0px); 
    -o-transform: translateY(0px); 
    -moz-transform: translateY(0px);
    -webkit-transform: translateY(0px); 
     transform: translateY(0px);
}

/* 메인 비주얼 :: 버튼 */
#mainVisual .slick-dots{position:absolute; width:100%; text-align:center; bottom:3%; z-index:1000; margin: 0; padding: 0}
#mainVisual .slick-dots li{display:inline-block; margin:0 5px ; }
#mainVisual .slick-dots li button{cursor:pointer; margin:0px; padding:0px; background:none; font-size:0; width:15px; height:15px;border: 0; border-radius: 100%; background-color:#000000;opacity:0.5;filter:Alpha(opacity=50);
}
#mainVisual .slick-dots li.slick-active button{background-color:#fff;}		/* 버튼 active */

/* 메인 비주얼 :: 화살표 */
#mainVisual .slick-arrow{	position:absolute; width:29px; height:60px; top:50%; margin-top:-30px; cursor:pointer; border:0; cursor:pointer; z-index:1000; font-size:0;}		/* 버튼이미지에 맞게 크기 수정 */
#mainVisual .slick-arrow.slick-prev{left:90px; background:url(/layouts/bluebDesign/image/main/main_visual_prev.png) no-repeat; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
#mainVisual .slick-arrow.slick-next{right:90px; background:url(/layouts/bluebDesign/image/main/main_visual_next.png) no-repeat; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
#mainVisual .slick-arrow.slick-prev:hover {-webkit-transform: translateX(-10px); -moz-transform: translateX(-10px); -ms-transform: translateX(-10px); -o-transform: translateX(-10px); transform: translateX(-10px);}
#mainVisual .slick-arrow.slick-next:hover {-webkit-transform: translateX(10px); -moz-transform: translateX(10px); -ms-transform: translateX(10px); -o-transform: translateX(10px); transform: translateX(10px);}

/* 메인 비주얼 :: 스크롤아이콘 */
.main-scroll-icon{position:absolute; bottom:55px; left:50%; margin-left:-41px; text-align:center; z-index:9}	/* width값에 맞게 margin-left수정 */
.main-scroll-icon span{display:block; color:#fff; padding-bottom:5px; letter-spacing:-0.5px; font-weight:300; }

.mobileview { display:none}

.s01 { background:#efefef;}
.s01 ul {  padding:20px 0;}
.s01 ul li {display:inline-block; width:calc(100% / 5);margin: 0 -2px;text-align: center;}
.s01 ul li div {display:inline-block;}
.s01 ul li div img { float:left}
.s01 ul li div span { font-size: 15px; color:#4e4e4e;font-weight: 400;height: 68px;line-height: 68px;text-align: left;float: left; margin-left: 15px;} 

.s02 {height:800px; background:url('/layouts/bluebDesign/image/main/connect-bg.png') bottom center no-repeat; display:table; width:100%;}
.s02 .cont { display: table-cell; vertical-align: middle; text-align: center;}
.s02 .cont ul { margin:0; padding:0}
.s02 .cont ul li {margin: 0 .5%; display:inline-block;width:215px; height:295px;cursor: pointer;  vertical-align:top; padding:35px;box-shadow : 2px 2px 5px #ccc;}
.s02 .cont ul li:hover{ z-index:99;}
.s02 .cont ul li img {}
.s02 .cont ul li a {text-align: left;letter-spacing: -.5px;width:100%; height:100%; display: inline-block; }
.s02 .cont ul li a:hover {color:#000}
.s02 .cont ul li a.color-white { color:#fff}
.s02 .cont ul li a.color-white:hover { color:#fff}
.s02 .cont ul li a p {font-size: 14px;width: 70%;word-break: keep-all;}
.s02 .cont ul li a h4 { font-size:18px;font-weight: 500;letter-spacing: -.5px;line-height: 120%;}
.s02 .cont ul li.bg01 {background:url('/layouts/bluebDesign/image/main/li-bg01.jpg') no-repeat;background-size: cover;}
.s02 .cont ul li.bg02 {background:url('/layouts/bluebDesign/image/main/li-bg02.jpg') no-repeat;background-size: cover;}
.s02 .cont ul li.bg03 {background:url('/layouts/bluebDesign/image/main/li-bg03.jpg') no-repeat;background-size: cover;}
.s02 .cont ul li.bg04 {background:url('/layouts/bluebDesign/image/main/li-bg04.jpg') no-repeat;background-size: cover;}
.s02 .cont ul li.bg05 {background:url('/layouts/bluebDesign/image/main/li-bg05.jpg') no-repeat;background-size: cover;}
.s02 .cont ul li.bg06 {background:url('/layouts/bluebDesign/image/main/li-bg06.jpg') no-repeat;background-size: cover;}
.s02 .cont ul li.bg07 {background:url('/layouts/bluebDesign/image/main/li-bg07.jpg') no-repeat;background-size: cover;}
.s02 .cont ul li.bg08 {background:url('/layouts/bluebDesign/image/main/li-bg08.jpg') no-repeat;background-size: cover;}
.s02 .cont ul li.bg09 {background:url('/layouts/bluebDesign/image/main/li-bg09.jpg') no-repeat;background-size: cover;}
.s02 .cont ul li.bg10 {background:url('/layouts/bluebDesign/image/main/li-bg10.jpg') no-repeat;background-size: cover;}

.s03 {height:880px; padding:5% 0; background-color:#f1f1f1;display:table; width:100%;}
.s03 .cont { display: table-cell; vertical-align: middle; text-align: center;}
.s03 .cont .data { display:inline-block} 
.s03 .cont .data .banner .youtube {margin-bottom:25px;display:inline-block; width: 100%;} 

 .ShortcutsBox { display:inline-block; width:25%; padding:3%; margin:.5%;   height:470px;vertical-align: top;   box-shadow : 2px 2px 5px #ccc;}
.s03 .cont .data .notice { background-color:#fff; }
.s03 .cont .data .banner .Shortcuts ul {margin:0; padding:0}
.s03 .cont .data .banner .Shortcuts ul li.bg-color01 {  background:#faaf40;  }
.s03 .cont .data .banner .Shortcuts ul li.bg-color02 {  background:#27aae0;  }
.s03 .cont .data .banner .Shortcuts ul li img { margin-top:150px;}
.s03 .cont .data .banner .Shortcuts ul li h4 {font-size:20px; margin:0; padding:0}
.s03 .cont .data .banner .Shortcuts ul li p {    font-size: 16px; }


.s03 .cont .youtube {margin-bottom:5%; display:inline-block; width:100%;}
.s03 .cont .youtube p { text-align:center; font-size:20px; letter-spacing: -1px;}
.s03 .cont .youtube iframe {box-shadow : 2px 2px 5px #ccc;}

.footer_banner_zone{position:relative; width:100%;  padding:0; }
.footer_banner_zone .bannerWarp{ position:relative;  margin:0 auto;} 
.footer_banner_zone .bannerWarp .flow_banner_box{position:relative;  height:450px; overflow:hidden; margin:auto 0}
.footer_banner_zone .bannerWarp .flow_banner_box .flow_bann_area{position:absolute; top:0px; left:50%; margin-left:-610px;}
.footer_banner_zone .bannerWarp .flow_banner_box .flow_bann_area ul{*zoom:1; margin:0; padding:0;}
.footer_banner_zone .bannerWarp .flow_banner_box .flow_bann_area ul:after{content:""; display:block; clear:both;}
.footer_banner_zone .bannerWarp .flow_banner_box .flow_bann_area ul li{float:left;  list-style-type:none;  display:inline-block; margin:10px; text-align:center;}
.footer_banner_zone .bannerWarp .flow_banner_box .flow_bann_area ul li a{}
.footer_banner_zone .bannerWarp .flow_banner_box .flow_bann_area ul li img{  width:150px; } 
#banner_right { position:absolute; right:-50px; top:150px; cursor:pointer}
#banner_left { position:absolute; left:-50px; top:150px; cursor:pointer} 

.subTitleBg { position: relative;height: 480px;}
.subTitleBg h3 { color:#fff; font-size:40px; position: absolute;width: 1280px;margin: 0 auto;left: 0;right: 0; top: 220px; padding:0 }
.subTitleBg .location {width:1280px; position: absolute; left: 0;
right: 0; bottom: 30px;clear:both;font-size:14px;color:#666;padding:0;text-align:left;margin: 0 auto;}
.subTitleBg .location a {color:#666;letter-spacing:-1px; font-weight:300;}
.subTitleBg .location a:hover {color:#000}
.subTitleBg .location a:last-child	{ color:#ffa800; text-decoration: underline;}
 
    @media only screen and (max-width:1000px){ 
	.inner { width:100%;}
	.subTitleBg { width:100%; background-size: cover !important;}
	.subTitleBg h3 { width:100%; }
	.subTitleBg .location { width:100%; text-align: center;}
	#mainVisual {height: 600px}
	#mainVisual .slick-arrow.slick-prev { left:10px}
	#mainVisual .slick-arrow.slick-next  { right:10px}
	.main-visual-item .main-visual-txt-con {letter-spacing: -2px; text-align: center;word-break: keep-all;}
	.main-visual-item .main-visual-txt-con .main-visual-txt1 {width: 80%; margin: 0 auto; font-size:18px}
	.main-visual-item .main-visual-txt-con .main-visual-txt2 {width: 80%; margin: 20px auto; font-size:24px; line-height: 120%;}
	.main-visual-item .main-visual-txt-con .main-visual-txt3 { width: 60%; margin: 0 auto;font-size:16px; line-height: 140%}

	#footer .footerCont .footerContlogo { display: none}
	
	.s01 ul li { vertical-align: top}
	.s01 ul li div { text-align: center}
	.s01 ul li div span { font-size: 14px;  height: auto;  line-height: inherit;  letter-spacing: -2px; display: block; text-align: center; float: inherit;  margin-left: 0;}
	.s01 ul li div img { float:inherit; width: 50%}

	.s03 { padding:50px 0}
	.s03 .cont .data { width:95%; margin:0 auto} 
	.s03 .cont .data .banner { margin-bottom:50px}

	.social li img { width:50px} 




	}
    @media only screen and (max-width:900px){ 
	
		.inner { width:90%}
		.gnb { display: none}
		
		
		.s02 {padding: 30px 0; height: auto; background: none;}
		.s02 .cont ul li:hover{ -webkit-transform:none; -moz-transform:none; -ms-transform: none; -o-transform:none;	transform: none;	-webkit-box-shadow: 1px 1px 35px 0; gba(0,0,0,0.26); -moz-box-shadow: 1px 1px 35px 0 rgba(0,0,0,0.26); 	-ms-box-shadow: 1px 1px 35px 0 rgba(0,0,0,0.26);	box-shadow:none;	-webkit-transition:none;	-moz-transition:none;	-ms-transition:none;	transition:none;}
	
		.s03 {padding: 30px 0; height: auto; } 
		 
		 .ShortcutsBox { width:80%;margin:3%;padding:5%;}
		.s03 .cont .youtube div { float: inherit !important; width: 100% !important; margin-bottom:2%}
		.s03 .cont .youtube div iframe { height:280px}
		.s03 .cont .data .banner {width: 100%;    float: inherit;} 

		
 .ShortcutsBox {}
		 
		#footerWrap .footerMenu { text-align: center}
		#footer {text-align: center}
		#footer .footerCont .footerContlogo { margin-right: 0; }
		#footer .footerCont div.footerSiteInfo { text-align:left} 


		
		#content .subContent {padding:30px 0}
    }




    @media only screen and (max-width:800px) { 
	.social { top:-10px}
	.social li img { width:35px}

	.s01 ul li div span { font-size: 13px; }
	.subTitleBg { height:250px;}
	.subTitleBg h3 { width:100%; left:0; right:0;font-size: 30px; margin:0 auto; top:110px;text-align: center;}

	#pages_join, #pages_login, #mypage_main, #pages_top, #pages_all, .iframe, #bbslist, #bbsview, #bbswrite, #guidebox, #scraplist, #paperlist, #friendlist, #pointlist, #loglist {min-height:500px}

		 

.s03 .cont .data .banner .Shortcuts ul li.bg-color02 { height:auto;padding:10% 5%}
.s03 .cont .data .banner .Shortcuts ul li.bg-color02 img {margin-top:0; }
    }


    @media only screen and (max-width:639px){ 
 

		.mobileview { display:block}

		.main .cont .title img { width:60px}

		.s03 .cont .data .banner .youtube p { font-size:18px;}
		.s03 .cont .data .banner .youtube div iframe { height:200px} 

		#footer .footerCont div.footerSiteInfo { font-size:13px;line-height: 140%;}
		#footer .footerCont address { display:none}
    }




    @media only screen and (max-width:639px)
	{ 



	#banner_left3 { left: 0}
	#banner_right3 { right:0 } 
 
    }