@charset "utf-8";
@import url("NotoKR.css");
/*************************************************************************************************
 
 *  Web Font
 
 *************************************************************************************************/

/*---------------------------------------------------------------------------------------------------------------------------
 *  Notosans Web Font 300,400,500,700
 *--------------------------------------------------------------------------------------------------------------------------*/

/*@font-face {
	
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/NotoSansKR-Light-Hestia.eot') format('eot'),
        url('fonts/NotoSansKR-Light-Hestia.eot?#iefix') format('embedded-opentype'),
        url('fonts/NotoSansKR-Light-Hestia.woff') format('woff'),
        url('fonts/NotoSansKR-Light-Hestia.otf') format('opentype');
		
}

@font-face {
	
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/NotoSansKR-Regular-Hestia.eot') format('eot'),
        url('fonts/NotoSansKR-Regular-Hestia.eot?#iefix') format('embedded-opentype'),
        url('fonts/NotoSansKR-Regular-Hestia.woff') format('woff'),
        url('fonts/NotoSansKR-Regular-Hestia.otf') format('opentype');
		
}

@font-face {
	
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/NotoSansKR-Medium-Hestia.eot') format('eot'),
        url('fonts/NotoSansKR-Medium-Hestia.eot?#iefix') format('embedded-opentype'),
        url('fonts/NotoSansKR-Medium-Hestia.woff') format('woff'),
        url('fonts/NotoSansKR-Medium-Hestia.otf') format('opentype');
		
}

@font-face {
	
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/NotoSansKR-Bold-Hestia.eot') format('eot'),
        url('fonts/NotoSansKR-Bold-Hestia.eot?#iefix') format('embedded-opentype'),
        url('fonts/NotoSansKR-Bold-Hestia.woff') format('woff'),
        url('fonts/NotoSansKR-Bold-Hestia.otf') format('opentype');
		
}*/

/*---------------------------------------------------------------------------------------------------------------------------
 *  Gotham Web Font 200,500,400,700
 *--------------------------------------------------------------------------------------------------------------------------*/

@font-face {
	
	font-family: 'GothamBook';
	font-style: normal;
	font-weight: 500;
	src: url('fonts/Gotham-Book.eot');
	src: url('fonts/Gotham-Book.eot?#iefix') format('embedded-opentype'),
	url('fonts/Gotham-Book.woff') format('woff'),
	url('fonts/Gotham-Book.ttf') format('truetype');
	   
}

@font-face {
	
	font-family: 'GothamLight';
	font-style: normal;
	font-weight: 200;
	src: url('fonts/Gotham-Light.eot');
	src: url('fonts/Gotham-Light.eot?#iefix') format('embedded-opentype'),
	url('fonts/Gotham-Light.woff') format('woff'),
	url('fonts/Gotham-Light.ttf') format('truetype');
	   
}

@font-face {
	
	font-family: 'GothamMedium';
	font-style: normal;
	font-weight: 400;
	src: url('fonts/Gotham-Medium.eot');
	src: url('fonts/Gotham-Medium.eot?#iefix') format('embedded-opentype'),
	url('fonts/Gotham-Medium.woff') format('woff'),
	url('fonts/Gotham-Medium.ttf') format('truetype');
	   
}

@font-face {
	
	font-family: 'GothamBold';
	font-style: normal;
	font-weight: 700;
	src: url('fonts/Gotham-Bold.eot');
	src: url('fonts/Gotham-Bold.eot?#iefix') format('embedded-opentype'),
	url('fonts/Gotham-Bold.woff') format('woff'),
	url('fonts/Gotham-Bold.ttf') format('truetype');
	   
}

/*************************************************************************************************
 
 *  Reset Css
 
 *************************************************************************************************/

html {width:100%;height:100%;overflow-y:scroll;-webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none;font-size: 14px; line-height: 20px;}

html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var,
b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;list-style:none;font-family:'Noto Sans Regular', verdana, sans-serif;font-style:normal; line-height: 20px; color: #656565;}
sup {vertical-align:top;font-size:0.6em;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}
h1,h2,h3,h4,h5,h6,em,address {font-style:normal;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none;}
table{width:100%;border-collapse:collapse;border-spacing:0;word-break:break-all;border:0;}
table th, table td{vertical-align:middle;}
caption{visibility:hidden;width:0;height:0;font-size:0;line-height:0;zoom:1;}
fieldset{margin:0;padding:0;border:0 none;}
legend{display:none; overflow:hidden; width:0; height:0; font-size:0; visibility:visible; line-height:0;}
select, img, input, textarea,button {font-family:'Noto Sans Regular', verdana, sans-serif;color:#888;}
label {vertical-align:middle;cursor:pointer;}
input[type=checkbox], input[type=radio] {/*float:left;*/margin-right:8px;vertical-align:middle;}
button {background:none; margin:0; padding:0; border:0 none; cursor:pointer;}
img {border:none; -ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop')"; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop');}



/*************************************************************************************************
 
 *  Link Style
 
 *************************************************************************************************/

a {text-decoration:none;color:#777;-webkit-transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;-moz-transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;-ms-transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;-o-transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;transition: background .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out, outline .3s ease;outline:none;}
a:hover {text-decoration:none;color:#000;}

/*************************************************************************************************
 
 *  Etc Style
 
 *************************************************************************************************/

.clearfix {clear:both;height:40px;}
hr.border {width:14px;height:1px;display:inline-block;text-align:center;margin:20px 0;background:#036;}
.blind {visibility:hidden;position:absolute;top:0;left:0;width:0;height:0;font-size:0;line-height:0;}
.accessibilityWrap dd a {display:block;position:absolute;top:-10000px;left:0;z-index:500;width:100%;}
.center {text-align:center;}

.clear:after	{content: "."; display: block; height:0px; clear:both; visibility:hidden}
.clear  {display: inline-block}
.clear	{display: block}
* html	.clear	{height:1%} /* Hides from IE-mac */
.clear	{zoom:1} /*for IE 5.5-7*/
a:link {	text-decoration: none;}
a:visited {	text-decoration: none;}
a:hover {	text-decoration: none;}
a:active {	text-decoration: none;}
html, body {height: auto; min-height: 100%;}
body {background-color: #FFFFFF; margin: 0; padding: 0;width: 100%; height: 100%; min-width: 1150px;font-family: 'Noto Sans Bold';font-size: 14px;}
.endline {clear: both; float: none;}

.topContainer {background:rgba(0,0,0,0.3); border-bottom:1px solid #666; /*background: url(../images/topline.png) repeat-x bottom;*/}
.topBox {width: 1100px; margin: auto;}
h1 { width: 216px; height: 60px; background: url(../images/logo.png) no-repeat center center; float: left; text-indent: -1000px;margin: 0;padding: 0;}
ul#topnav {
	/*float: right;
	width: 655px;*/
	list-style: none;
	font-size: 14px;
	position: relative;
	padding-top: 5px;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
}
ul#topnav li {
	float: left;
	margin: 0; padding: 0;
}
ul#topnav li a {
	display: block; letter-spacing: -1px;
	color: #ffffff;
	text-decoration: none;
	padding-top: 15px;
	padding-right: 24px;
	padding-bottom: 20px;
	/*padding-left: 25px;*/
	font-size: 17px;font-family:'Noto Sans Medium';
}
ul#topnav li a:hover { color: #ffffff;/*background: #1376c9 url (images/topnav_a.gif) repeat-x*/ }
ul#topnav li span {
	margin-top:25px;
	padding-top:8px; padding-bottom: 10px;
	float: left;
	position: absolute;
	left: 0; top:35px;
	display: none;/* background: url(../images/sub_menu_bg.png) bottom;*/
	color: #fff;
	-moz-border-radius-bottomright: 5px;
	-khtml-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-khtml-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
}
ul#topnav li:hover span { display: block; }
ul#topnav li span a { display: inline; 
	font-size: 15px; padding: 0 5px; color: #ffffff; }
ul#topnav li span a:hover {text-decoration: underline;}
ul#topnav li span div.submenu01 {margin-left: 262px;}
ul#topnav li span div.submenu02 {margin-left: 343px;}
ul#topnav li span div.submenu03 {margin-left: 427px;}
ul#topnav li span div.submenu04 {margin-left: 510px;}
ul#topnav li span div.submenu05 {margin-left: 590px;}
ul#topnav li span div.submenu06 {margin-left: 550px;}
ul#topnav li span div.submenu07 {margin-left: 338px;}


#mainContainer {width: 1150px; margin: 0 auto;}
#mainContainer .topContainer .logoBox {width: 328px; display: table-cell; text-align: left;}
#mainContainer .topContainer .topBanner {width: 512px; display: table-cell; text-align: center;}
#mainContainer .topContainer .memBox {width: 310px; display: table-cell; text-align: right; vertical-align: middle;}
.topMembers {float: right; padding-top: 10px;}
.topMembers li {display: table-cell; padding: 4px 15px 4px 17px; text-align: right; font-size: 12px;}
.topMembers li a {color: #EFEFEF;}


.topMembers li.icon01 {background: url(../images/top_icon_01.png) left center no-repeat;}
.topMembers .icon02 {background: url(../images/top_icon_02.png) left center no-repeat;}
.topMembers .icon03 {background: url(../images/top_icon_03.png) left center no-repeat;}
.topMembers .icon04 {background: url(../images/top_icon_04.png) left center no-repeat; font-size: 17px; padding-right: 20px; font-family: 'Noto Sans Medium';}
.topMembers .icon04 a { color: #8fc31f;}
.topMembers .icon05 {background: url(../images/top_icon_05.png) left center no-repeat;font-size: 17px; padding-right: 20px; font-family: 'Noto Sans Medium';}
.topMembers .icon05 a { color: #8fc31f;}
