@charset "utf-8";

/* Titanium 1.2 디자인/퍼블리싱 : neostream */ 


/* 웹 폰트설정 */
@font-face { font-family:'DroidSans'; src:url(../font/droidsans-webfont.ttf);} /* Droid */
@font-face { font-family:'DroidSans2'; src:url(../font/droidsans-webfont.eot);} /* Droid IE */
@font-face {
	font-family:ng;
	src:url(../font/NanumGothic.eot);
	src:local(※), url(../font/NanumGothic.eot) format('woff')
}


/* 전체 폰트설정 */
body, input, button, textarea, table {
	font-family: 돋움, Dotum, Tahoma, Geneva, sans-serif;
}
.default-font {
	font-family: Tahoma, 돋움, Dotum, Geneva, sans-serif; 
}
.heve-font { font-family:'Helvetica Neue', Helvetica, 나눔고딕, NanumGothic, ng, '맑은 고딕', Malgun Gothic, 돋움, dotum, sans-serif; }



/* 기타 커스터마이즈 */

#site-columns .boardInformation .infoSum { display:none } 
#site-columns .trans-column .xe_content { color: #ccc; }
#site-columns .bread-column .grid-content { padding:10px 20px 15px 20px;}
#site-columns { min-height: 719px;} 

#widget-columns .project-view .pv-item .pv-cover { margin: 0 16px 7px 0; }
#widget-columns .project-view .pv-item.sulli5 .pv-cover {  margin: 0 0 7px 0;}

#site-columns .trans-column .categoryList li { padding: 0 2px; }
#site-columns .trans-column .webzineList td.title .webzineThumb{float:left;margin-right:25px; margin-left:0} /* 블랙 유림게시판 섬네일조정*/
#site-columns .boardReadBody a { border-bottom: 1px dotted; }


/* 공통class */
html, body {  }
.grid-site { width:990px; margin:0 auto; } 
.grid-content { padding:10px 20px 15px 20px;}
.grid-content-trans { padding:0 17px 15px 17px;} 
.cfix { zoom:1 }
.cfix:after { content: '.'; display:block; clear:both; visibility:hidden; line-height:0; height:0; overflow: hidden; }
.left { float:left}
.right { float:right}
.corner-top {
	-webkit-border-radius: 4px 4px 0 0;
	-moz-border-radius: 4px 4px 0 0;
	-o-border-radius: 4px 4px 0 0;
	border-radius: 4px 4px 0 0;
}
.corner-bottom {
	-webkit-border-radius: 0 0 4px 4px;
	-moz-border-radius: 0 0 4px 4px;
	-o-border-radius: 0 0 4px 4px;
	border-radius: 0 0 4px 4px;
}
.corner-all {
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	border-radius: 4px;
}
.bullet-item:before {
	content: "•";
	left: -14px;
	top: 1px;
	font-family: sans-serif;
	font-size: 12px;
}


/* 레이아웃 최상단 헤더 */
#site-container { 
	min-width:1050px; 
}

#header { width:100%; z-index:99; position:relative; background:url(../img/sprite.png) repeat-x; } 
#header .showcase-bar { height:32px; position:relative; }
#header .header-content { height:82px; position:relative; }
#header .siteLogo { float:left; position:relative; padding:14px 15px 0 0; display:block; }

#sticky-nav { 
	z-index: 999;
	position: fixed; top: 0; right: 0; left: 0; width:100%; 
	background:url(../img/sprite.png) 0 -277px repeat-x;
}
#sticky-nav.ON { top: -67px; }

#sticky-nav .siteLogo { float:left; position:relative; padding:11px 15px 0 0; display:block; }
#sticky-nav.shown {  }
#sticky-nav .grid-site { height:67px; }
#sticky-nav .gnb { padding:0}
#sticky-nav .gnb-item,
#sticky-nav .gnb-item .gnb-link,
#sticky-nav .gnb-item .gnb-link span { height:51px;}
#sticky-nav .sub-wrap { top: 50px; }
#sticky-nav .account .sub-wrap { top: 49px; }
#sticky-nav .search { margin: 6px 0 0 0; float:right; padding:0;}
#sticky-nav .account .profile, 
#sticky-nav .account .signup { padding:13px 0 0 5px; }
#sticky-nav .account .profile { background-position:-650px -224px; }
#sticky-nav .account .signup { background-position:-577px -224px;}
#sticky-nav .account-divider { margin: 11px 10px 0 0;}
#sticky-nav .homeicon { float:left; position:relative; padding:11px 7px 0 8px; display:block; }
#sticky-nav .homeicon a { width:31px; height:31px; background:url(../img/sprite.png) -120px -519px no-repeat; display:block; } 


/* GNB 1 */
.gnb { float:left; position:relative; padding:2px 0 0 0; *z-index:100;/*ie7*/ }

.gnb-badge { position:absolute; z-index:200;}
.gnb-badge img { position:relative; display:block; text-align:center}

.gnb-item { height:53px; float:left; position:relative; display:block; }
.gnb-item .gnb-link { height:53px;  position:relative;  display:block;  }
.gnb-item .gnb-link span { 
	height:53px; display: table-cell; vertical-align: middle; padding:0 22px;
	font-family: Tahoma, 돋움, Dotum, Geneva, sans-serif; 
	font-size:12px; color:#E5E5E5; font-weight:bold;
	text-shadow: 0px 1px #050505;	

}
.gnb-item:hover .gnb-link { background:url(../img/sprite.png) 0 -144px repeat-x; }
.gnb-item:hover .gnb-link span { background:url(../img/sprite.png) right -144px repeat-x; }

/* GNB 2 */
.sub-wrap {
	position: absolute; top: 53px; min-width:199px; z-index:1001; background:url(../img/sprite.png) left bottom; 
	overflow: hidden; padding:0 0 0 5px;
}
.edge-wrap { background:url(../img/sprite.png) right bottom; padding:0 5px 5px 0; }


.sub-wrap ul { background:url(../img/menubg.png) repeat; padding: 10px 0; }
.sub-item { position:relative;  }
.sub-item a {
	position:relative; font-size:12px; font-weight:normal; color:#929293; padding: 6px 12px; display:block; line-height: 14px;  
	font-family: 'Helvetica Neue', Helvetica, 나눔고딕, NanumGothic, ng, '맑은 고딕', Malgun Gothic, 돋움, dotum, sans-serif;
	
}

.gnb-item:hover .sub-wrap { left:-5px;}

.sub-item a:hover {
	color:#eee;
	background: #026ff9;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#008ff9), to(#044ffa));
	background: -webkit-linear-gradient(0% 0%, 0% 100%, from(#008ff9), to(#044ffa));
	background: -moz-linear-gradient(center top, #008ff9, #044ffa);
	background: linear-gradient(#008ff9, #044ffa);
	text-shadow: 0px 1px rgba(43, 43, 43, 0.5);
	background:url(../img/sprite.png) 0 -222px\9; 
}


.gnb .yuki1, .gnb .yuki2, .gnb .yuki3, .gnb .yuki4, .gnb .yuki5, .gnb .yuki6, .gnb .yuki7, .account .sub-wrap,
.gnb .yuki8, .gnb .yuki9, .gnb .yuki10, .gnb .yuki11, .gnb .yuki12, .gnb .yuki13, .gnb .yuki14 {
	left:-999em;
}

.shaco .sub-item-text { padding-left: 24px; position: relative; }
.shaco .sub-item-text:before {
	display: block;
	content: "";
	position: absolute;
	background-image:url(../img/spriteicon.png);	
	width: 18px; height: 18px;
	left: 0; top: -2px;
}

/* 회원 정보 아이콘 설정 */
.i1 .sub-item-text:before { background-position: -148px -159px;}
.i2 .sub-item-text:before { background-position: -8px -584px;}
.i3 .sub-item-text:before { background-position: -8px -402px;}
.i4 .sub-item-text:before { background-position: -9px -121px;}
.i5 .sub-item-text:before { background-position: -8px -419px;}
.i6 .sub-item-text:before { background-position: -8px -548px;}
.i7 .sub-item-text:before { background-position: -8px -347px;}
.i8 .sub-item-text:before { background-position: -8px -402px;}
.admin .sub-item-text:before { background-position: -8px -474px;}
.logout .sub-item-text:before { background-position: -8px -510px;}

 
/*  Search Bar */ 
#header .search { float:right; margin:9px 0 0 0; padding:0 0 0 0; }
#sticky-nav .iText,
#header .iText {
	margin-top: 2px; background:none; zoom: 1; background:url(../img/sprite.png) 0 -344px; 
	width:132px; height:37px; padding: 0 39px 0 12px;
	line-height: 37px\9; line-height:17px; outline: none; font-weight:bold; 
	font-family:'Helvetica Neue', Helvetica, 나눔고딕, NanumGothic, ng, '맑은 고딕', Malgun Gothic, 돋움, dotum, sans-serif;
	color: #919191; font-size:13px; 
	-webkit-appearance: textfield;
	-moz-appearance: textfield; 
}
#sticky-nav .iText:focus,
#header .iText:focus { background:url(../img/sprite.png) 0 -399px; }


.account-divider {
	display: block; width:2px; height:31px; float:right;
	margin: 13px 10px 0 0;
	background:url(../img/sprite.png) -222px -344px;
}


/* 계정정보 */
.account { float:right; position:relative; padding:2px 0 0 0; right:-1px;}

.account .sub-item a { font-size:12px; }
.account .sub-wrap.varus { min-width:144px; }
.account .sub-wrap.rengar { min-width:247px; }

.account .gnb-item .gnb-link span { padding: 0 10px; }

.account .profile, 
.account .signup { 
	width:27px; height:40px; position:relative; padding:15px 0 0 5px;
	background:url(../img/sprite.png);
}
.account .profile { background-position:-650px -222px; }
.account .signup { background-position:-577px -222px;}

.account .gnb-item:hover .sub-wrap.varus { left:-5px;}

.account .account-pannel { width:247px; background:url(../img/menubg.png) repeat; }


/* login form */

.auth-block {
	padding: 22px 32px 22px 32px;
	font-family:'Helvetica Neue', Helvetica, 나눔고딕, NanumGothic, ng, '맑은 고딕', Malgun Gothic, 돋움, dotum, sans-serif;
}

.auth-block .form-text, .form-textarea {
	width: 163px; height: 17px;
	font-weight: normal;
	padding: 10px; margin: 5px 0 5px 0;
	line-height: 17px; 
	background:url(../img/sprite.png) -270px -344px;
	font-size: 13px;
	color: #aaa;
	font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif;
}

.auth-block  input[type=text]:focus,
.auth-block  input[type=password]:focus {
	background:url(../img/sprite.png) -270px -399px;
	outline: none; 
}
.auth-block .form-signup {
	color: #6D6D6D;
	font-size:11px;
	width:181px; padding:2px 0 0 2px;
}
.auth-block .form-signup a { color: #008EF2; }
.auth-block .form-signup a:hover { text-decoration:underline; }

.form-button-login {
	background:url(../img/sprite.png) -725px -233px;
	width: 32px; height: 32px; top:77px; right:39px; position:absolute;
	font-size: 0;
	-webkit-user-select: none;
	-moz-user-select: none;
	white-space: nowrap;
	cursor:pointer;
}

.auth-block .form-signup .register { margin:5px 0 5px 0; }
.auth-block .form-signup .help { margin:0 0 5px 0; }
.auth-block .form-signup .social  {  }


fieldset p.keep{margin:1px 0 5px 0;padding:0 0 0 2px;}
fieldset p.keep input{vertical-align:middle;width:13px;height:13px;margin:0;border:0}
fieldset p.keep label{font:.9em;color:#bbb;vertical-align:middle; padding:0 0 0 2px;}
fieldset p.keep_msg{color:#666}







/* 빵조각 본문 */
#site-columns { margin:0 auto 0 auto; padding:0; width:1020px; position:relative; }
#site-columns .bread-column { }
.bread-column .bread-column-header { background:url(../img/sprite.png) 0 -455px no-repeat; } 

/* 빵조각 */
.breadclumb { width:980px; height:46px; padding:0 5px ; background:url(../img/sprite.png) right -455px no-repeat; }
.breadclumb ul { margin:0 0 0 3px; background:url(../img/sprite.png) right -519px no-repeat; }
.breadclumb ul li { margin:8px 0 0 0; height:31px; position:relative; float:left; background:url(../img/sprite.png) -436px -519px no-repeat;}
.breadclumb ul li a { 
	height:13px; padding: 8px 9px 10px 9px; display:block;
	text-align:center; font-family:Tahoma, 돋움, Arial, Helvetica, sans-serif; 
	font-size:11px; line-height:13px;
	color:#d0d0d0; text-transform:uppercase;
	font-style: inherit; font-weight:400;
 }
.breadclumb ul li.nine a { color:#999 }

.breadclumb .homeSelected { width:31px; background:url(../img/sprite.png) -120px -519px no-repeat; } 
.breadclumb .home { width:37px; background:url(../img/sprite.png) 0 -519px no-repeat; }
.breadclumb .lastDance { width:4px; background:url(../img/sprite.png) right -519px no-repeat;  }

/* 컨텐츠 */
.bread-column .column-content { clear:both; background:white; }

.bread-column .column-content .widgetSide { width:219px;  position:relative; }
.bread-column .column-content .contentSide { width:770px; position:relative;  }

.ec .bread-column .column-content .widgetSide { float:left; }
.ce .bread-column .column-content .widgetSide { float:right; }
.c .bread-column .column-content .widgetSide {  }

.ec .bread-column .column-content .contentSide  { float:right; border-left: 1px solid #E5E5E5;}
.ce .bread-column .column-content .contentSide  { float:left; border-right: 1px solid #E5E5E5; }
.c .bread-column .column-content .contentSide { width:990px;}

.bread-column .column-bottom {
	background: #2E2E2E;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#3D3D3D), to(#202020));
	background: -webkit-linear-gradient(0% 0%, 0% 100%, from(#3D3D3D), to(#202020));
	background: -moz-linear-gradient(center top,#3D3D3D,#202020);
	position:relative; clear:both;
	margin:0 0 30px 0;
	height: 30px;
}

.lnb { position:relative; font-size:12px; font-family:Tahoma, Geneva, 돋움,sans-serif; line-height:normal; background: #FBFBFB; }

.lnb .lnb-item { border-bottom: 1px solid #E1E1E1; border-top: 1px solid white; position:relative; }
.lnb .lnb-item .toggle-icon {
	display: block; position: absolute;
	width: 20px; height: 21px;
	top: 10px; right: 10px;
	text-indent: -10000em;
	background:url(../img/sprite.png) no-repeat; background-position:-840px -346px;
}
.lnb .lnb-item.active .toggle-icon { background-position:-840px -396px;}


.lnb .lnb-item ul { display: block; margin: -7px 0 12px 0; }
.lnb .lnb-link { display:block; padding: 12px 35px 12px 20px; color:#333; font-size:13px; font-weight:bold;}
.lnb .lnb-link:hover { color:#D2344F }
.lnb .lnb-item.active .lnb-link { color:#D2344F }

.lnb .lnb-sub-item { position:relative; font-size: 11px; }
.lnb .lnb-sub-link { 
	border-width: 1px 0!important; display:block; border-style:solid; border-color: transparent; 
	color:#333; line-height:18px; vertical-align: middle;
	padding: 2px 10px 2px 20px;
}
.lnb .lnb-sub-link:hover {
	border-color: #EFEFEF;
	background-color: #FDFDFD;
	color: #D2344F;
}
.lnb .lnb-sub-item.active .lnb-sub-link { color: #D2344F;}



/* 투명 본문 */
#site-columns .trans-column { margin:0 0 0 0 }

.trans-column .trans-column-header { padding:0 0 0 18px; background:url(../img/tsprite.png) 0 0 no-repeat; }
.trans-column .trans-column-header .grid-site { width:984px; height:59px; padding:0 18px 0 0; background:url(../img/tsprite.png) right -60px no-repeat; }

.trans-column .trans-column-header .widgetSide { width:286px; height:47px; margin:7px 0 0 0;  position:relative; }
.trans-column .trans-column-header .contentSide { width:697px; height:47px; margin:7px 0 0 0; position:relative; }
.trans-column .trans-column-header .widgetSide img { margin:19px 0 0 15px }
.trans-column .trans-column-header .contentSide img { margin:19px 0 0 15px }

.ec .trans-column .trans-column-header .widgetSide { float:left; }
.ce .trans-column .trans-column-header .widgetSide { float:right; }
.c .trans-column .trans-column-header .widgetSide {  }

.ec .trans-column .trans-column-header .contentSide  { float:right; border-left: 1px solid #222; }
.ce .trans-column .trans-column-header .contentSide  { float:left; border-right: 1px solid #222; }
.c .trans-column .trans-column-header .contentSide { width:984px; float:left;}

.trans-column .trans-column-content { padding:0 0 0 15px; relative; clear:both; background:url(../img/tbg.png) 0 0 repeat-y; }
.trans-column .trans-column-content .grid-site {  padding:0 15px 0 0; background:url(../img/tbg.png) right 0 repeat-y;  }

.trans-column .trans-column-content .widgetSide { width:289px; position:relative; }
.trans-column .trans-column-content .contentSide { width:700px; position:relative; }

.ec .trans-column .trans-column-content .widgetSide { float:left; }
.ce .trans-column .trans-column-content .widgetSide { float:right; }
.c .trans-column .trans-column-content .widgetSide {  }

.ec .trans-column .trans-column-content .contentSide  { float:right; border-left: 1px solid #222; }
.ce .trans-column .trans-column-content .contentSide  { float:left; border-right: 1px solid #222; }
.c .trans-column .trans-column-content .contentSide { width:990px;}


.trans-column .column-bottom { padding:0 0 0 28px; relative; clear:both; background:url(../img/tsprite.png) 0 -119px no-repeat; }
.trans-column .column-bottom .grid-site { width:964px; height:26px; padding:0 28px 0 0; background:url(../img/tsprite.png) right -149px no-repeat;  }
.trans-column .metadata { line-height: 20px; }




#widget-columns { }
#widget-columns .library-container { position:relative; width:990px; margin:0 auto; padding:0 0 0 7px; overflow:hidden; }
#widget-columns .chemi-container { position:relative; width:990px; margin:0 auto; overflow:hidden; }


/* footer */
#footer-container {
	margin-top:22px; padding-top:5px; width:100%; background:url(../img/sprite.png) 0 -560px repeat-x; font-size:12px;
	font-family:'Segoe UI',Meiryo,'Trebuchet MS','나눔고딕',NanumGothic,ng,'맑은 고딕','Malgun Gothic','돋움',Dotum,AppleGothic,sans-serif;
}

#footer-top { 
	background: black; border-top: 1px solid #e00000; border-bottom: 1px solid #333;
	width:100%; 
}
#footer-top .grid-site { height:32px; }
#footer-top .footer-menu { }
#footer-top .footer-menu li { float:left; }
#footer-top .footer-menu li a { padding:12px 8px 0 8px; color: #767780; text-shadow: 0px 1px #050505; display:block; }

#footer-bottom { width:100%; background: black; padding:0;}
#footer-bottom .grid-site { height:31px; padding:9px 0 0 0; }


#footer-bottom  p { font-size: 11px; color: #777; padding-left:7px;}
#footer-bottom  a { font-size: 11px; color: #777;}

#footer-bottom .site-copyright { color: #e1e1e1; text-shadow: 0px 1px #050505; text-align:right}

#custom { min-height:650px }


/* HTML Reset */
a {
	color: #1769FF;
	text-decoration: underline;
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, 
code, form, fieldset, legend, input, textarea, p, a, blockquote, th, td {
	margin:0; padding:0; border: 0;
}

table {
	border-collapse: separate;
	border-spacing: 0;
}

ol,ul { list-style:none; }

fieldset,img { border:0; }

address, caption, cite, code, dfn, em, th, var {
	font-style:normal;
	/* font-weight:normal; */
}

caption, th, td {
	text-align: left;
	/* font-weight:normal; */
}

h1,h2,h3,h4,h5,h6 { font-size:100%;}

abbr, acronym { border:0; font-variant:normal; }

sup { vertical-align:text-top;}
sub { vertical-align:text-bottom;}

input, textarea, select { font-family:inherit; font-size:inherit; font-weight:inherit; *font-size:100%; }

legend { color:#000; }

blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

a, a:visited { text-decoration: none; }
a:hover,
a:active,
a:focus { text-decoration:none; }
a {
cursor: pointer;

}


/* Button */

.boardInformation .quinn-white {
	background: #fff;
	background-image: -moz-linear-gradient(top,#fff 74%,#f8f8f8 100%);
	background-image: -webkit-linear-gradient(top,#fff 74%,#f8f8f8 100%);
	background-image: linear-gradient(top,#fff 74%,#f8f8f8 100%);
	
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#f8f8f8));
	
	border: 1px solid #1769FF;
	
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	
	-moz-box-shadow: 0 1px 1px rgba(0,0,0,.06);
	-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.06);
	box-shadow: 0 1px 1px rgba(0,0,0,.06);
	
	-webkit-transition: all .2s ease-out;
	-moz-transition: all .1s ease-out;
	transition: all .1s ease-out;
	
	box-shadow: 0 0 1px 1px rgba(255,255,255,1) inset, 0 1px 1px rgba(0,0,0,.06);

}

.boardInformation .quinn-white:hover {
	background-color: #fff;
	border-color: #999;
	text-decoration:none;
}
.boardInformation .quinn-white:active {
	-webkit-box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.2);
	-moz-box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.2);
	box-shadow:inset 0 1px 3px rgba(0,0,0,0.2);
	text-decoration:none;
}

.boardInformation .quinn-white {
	-webkit-user-select: none;
	-moz-user-select: none;
	white-space: nowrap;
	cursor: pointer;
	color: #1769FF;
	font-family: 나눔고딕,'Open Sans','Myriad Pro',Verdana,sans-serif;
	font-size: 12px; 
	font-weight:normal;
	padding: 0 11px; 
	display: inline-block;
	height: 24px;
	line-height: 24px; 
}

.form-button-default:active {
	border-color: #0055a7;
	background: #016bdc;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#008aea), to(#024dcf));
	background: -webkit-linear-gradient(0% 0%, 0% 100%, from(#008aea), to(#024dcf));
	background: -moz-linear-gradient(center top, #008aea, #024dcf);
	background: linear-gradient(#008aea, #024dcf);
}