@charset "utf-8";

html { margin: 0; }
body { margin: 0; padding: 0; text-align: center; _font-size: 10pt; min-width: 980px; }
a { position: relative; text-decoration: none; }
.png24 { _tmp:expression(setPng24(this)); }
*:focus { outline: none; }
.clearboth { clear: both; width: 0;	height: 0; margin: 0; font-size: 1px; }

#skin { position: relative; margin: auto; text-align: left; width: 980px; min-width: 980px; height: 1308px; min-height: 1308px; }

#doc { margin: auto; text-align: left; width: 980px; min-width: 980px; height: 1308px; min-height: 1308px; }

#header { position: relative; left: 0; top: 0; *zoom: 1; height: 132px; }

	#logo { position: absolute; left: 15px; top: 45px; width: 200px; height: 40px; }
	#logo a { display: block; width: 100%; height: 100%; text-indent: -10000px; }

	#section { position: absolute; left: 220px; top: 55px; width: 37px; height: 27px; }
	#section a { display: block; width: 100%; height: 100%; text-indent: -10000px; }

	#utility { position: absolute; right: 13px; top: 11px; font-size: 93%; font-family: 'Dotum', '돋움', 'Verdana'; color: #636567; }
	#utility:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
		#utility li { float: left; margin-left: 10px; }
		#utility li.logout { margin-left: 20px; }
			#utility li a { text-decoration: none; color: #636567; }
			#utility li a:hover { text-decoration: underline; }

	#navigation { position: absolute; left: 3px; top: 100px; height: 32px; }
	#navigation:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
		#navigation li { float: left; width: 69px; height: 32px; }
		#navigation li#toHome { background-position: 0 0; }
		#navigation li#toEntrance { background-position: -69px 0; }
		#navigation li#toStudy { background-position: -138px 0; }
		#navigation li#toExam { background-position: -207px 0; }
		#navigation li#toLibrary { background-position: -276px 0; }
		#navigation li#toLife { background-position: -345px 0; }
		#navigation li#toClub { background-position: -414px 0; }
		#navigation li#toFakeBook { background-position: -483px 0; }
		#navigation li#toRanking { background-position: -483px 0; }
		#navigation li#navigationMore { background-position: -552px 0; }
		#navigation li#shortcutMore { background-position: -621px 0; }
		#navigation li.selected { background: url('./_common/navigation-selected.png'); }

			#navigation li a { display: block; width: 100%; height: 100%; text-indent: -10000px; }
			#navigation li a:hover { background-image: url('./_common/navigation-hover.png'); }
			#navigation li.selected a:hover { background-image: none; }

			#navigation li#toHome a { background-position: 0 0; }
			#navigation li#toEntrance a { background-position: -69px 0; }
			#navigation li#toStudy a { background-position: -138px 0; }
			#navigation li#toExam a { background-position: -207px 0; }
			#navigation li#toLibrary a { background-position: -276px 0; }
			#navigation li#toLife a { background-position: -345px 0; }
			#navigation li#toClub a { background-position: -414px 0; }
			#navigation li#toRanking a { background-position: -483px 0; }
			#navigation li#toFakeBook a { background-position: -483px 0; }
			#navigation li#navigationMore a { background-position: -552px 0; }
			#navigation li#shortcutMore a { background-position: -621px 0; }

	#search { position: absolute; right: 0; top: 102px; width: 172px; height: 32px; }
		#search .text { position: absolute; left: 5px; top: 5px; width: 112px; height: 15px; border: 0; background: transparent; padding: 3px 5px 1px; font-size: 93%; font-family: 'Dotum', '돋움', 'Verdana'; color: #999; }
		#search .submit { position: absolute; left: 137px; top: 3px; width: 20px; height: 20px; border: 0; background: transparent; display: block; text-indent: -10000px; z-index: 100; cursor: pointer; *color: transparent; *text-transform: capitalize; }

#memberPopup { position: absolute; top: 0; left: 0; z-index: 10000; width: 80px; border: 1px solid #ccc; text-align: left; background: #fff; font-size: 93%; font-family: 'Dotum', '돋움', 'Verdana'; }
#memberPopup li a { display: block; padding: 3px 6px; color: #999; text-decoration: none; }
#memberPopup li a:hover { background: #edf5ff; color: #333; }

/* sub popup menu */
.frame120Top { height: 4px; background: url('/image/xiii/frame-120-top.png') no-repeat; 
				_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/frame-120-top.png');}
.frame120Mid { height: 100%; background: url('/image/xiii/frame-120-mid.png') repeat-y; padding: 4px;
				_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/frame-120-mid.png', sizingMethod='scale');}
.frame120Bot { height: 4px; background: url('/image/xiii/frame-120-bot.png') no-repeat; 
				_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/frame-120-bot.png');}
.frame120 { position: relative; _height: 1%; width: 120px; }

.submenuPopup { position: absolute; top: 0; left: 0; z-index: 20000; width: 120px; text-align: left; color: #222222; font-size: 93%; font-family: 'Dotum', '돋움', 'Verdana'; }
	.submenuPopup a { position: relative; }
	.submenuPopup .utility { text-align: right; font-size: 93%; padding: 2px; }
		.submenuPopup .utility a { color: #666666; text-decoration: none; }
		.submenuPopup .utility a:hover { text-decoration: underline; }
	
	.submenuPopup li a { display: block; padding: 3px 5px; color: #222222; text-decoration: none; }
	.submenuPopup li a:hover { background: #8b42a5; color: #fff; font-weight: bold; text-decoration: none; }

.submenu { position: absolute; top: 130px; z-index: 10000; display: none; }
	.submenu .content { position: absolute; left: 0; top: 0; padding: 8px 10px 16px 12px; }
		.submenu ul { display: block; float: left; font-size: 93%; font-family: 'Dotum', '돋움', 'Verdana'; color: #222222; }
			.submenu li { }
				.submenu li a { display: block; height: 14px; padding: 2px 3px; margin: 0 1px 1px 0; text-decoration: none; color: #222222; overflow: hidden; }
				.submenu li a:hover { background: #9952b0; color: #ffffff; font-weight: bold; text-decoration: none; }
				.submenu li a.selected { background: #9952b0; color: #ffffff; font-weight: bold; text-decoration: none; }

#submenuClub { left: 415px; width: 344px; height: 135px; }
	#submenuClub .background { width: 344px; height: 135px; background: url('/image/xiii/submenu-club.png') no-repeat; 
								_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/submenu-club.png'); }
	#submenuClub ul.col1 li a { width: 55px; }
	#submenuClub ul.col2 li a { width: 80px; }
	#submenuClub ul.col3 li a { width: 85px; }
	#submenuClub ul.col4 li a { width: 70px; }

#submenuExam { left: 208px; width: 147px; height: 153px; }
	#submenuExam .background { width: 147px; height: 153px; background: url('/image/xiii/submenu-exam.png') no-repeat; 
								_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/submenu-exam.png'); }
	#submenuExam ul.col1 li a { width: 113px; }

#submenuLife { left: 346px; width: 512px; height: 154px; }
	#submenuLife .background { width: 512px; height: 154px; background: url('/image/xiii/submenu-life.png') no-repeat; 
								_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/submenu-life.png'); }
	#submenuLife ul.col1 li a { width: 83px; }
	#submenuLife ul.col2 li a { width: 113px; }
	#submenuLife ul.col3 li a { width: 83px; }
	#submenuLife ul.col4 li a { width: 93px; }
	#submenuLife ul.col5 li a { width: 73px; }

#submenuEntrance { left: 70px; width: 387px; height: 174px; }
	#submenuEntrance .background { width: 387px; height: 174px; background: url('/image/xiii/submenu-entrance.png') no-repeat; 
								_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/submenu-entrance.png'); }
	#submenuEntrance ul.col1 li a { width: 112px; }
	#submenuEntrance ul.col2 li a { width: 117px; }
	#submenuEntrance ul.col3 li a { width: 108px; }

#submenuStudy { left: 139px; width: 456px; height: 154px; }
	#submenuStudy .background { width: 456px; height: 154px; background: url('/image/xiii/submenu-study.png') no-repeat; 
								_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/submenu-study.png'); }
	#submenuStudy ul.col1 li a { width: 90px; }
	#submenuStudy ul.col2 li a { width: 100px; }
	#submenuStudy ul.col3 li a { width: 120px; }
	#submenuStudy ul.col4 li a { width: 90px; }

#submenuRanking { left: 485px; width: 161px; }
	#submenuRanking .background { width: 161px; height: 121px; background: url('/image/xiii/submenu-ranking.png') no-repeat; 
								_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/submenu-ranking.png'); }
	#submenuRanking ul.col1 li a { width: 126px; }

#submenuMore { left: 553px; width: 107px; height: 101px; }
	#submenuMore .background { width: 107px; height: 101px; background: url('/image/xiii/submenu-more.png') no-repeat; 
								_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/submenu-more.png'); }
	#submenuMore ul.col1 li a { width: 73px; }

#submenuShortcut { left: 620px; width: 123px; _height: 1%; }
	#submenuShortcut div.shortcutTop { width: 123px; height: 3px; background: url('/image/xiii/submenu-shortcut-top.png') no-repeat; 
										_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/submenu-shortcut-top.png'); }
	#submenuShortcut div.shortcutMid { width: 113px; height: 100%; background: url('/image/xiii/submenu-shortcut-mid.png') repeat-y; padding: 5px;
										_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/submenu-shortcut-mid.png', sizingMethod='scale'); }
	#submenuShortcut div.shortcutBot { width: 123px; height: 9px; background: url('/image/xiii/submenu-shortcut-bot.png') no-repeat; 
										_background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/image/xiii/submenu-shortcut-bot.png'); }
	#submenuShortcut li a { position: relative; width: 103px; color: #ffffff; }
	#submenuShortcut li a:hover { background: #ffffff; color: #9952b0; font-weight: bold; text-decoration: none; }
	#submenuShortcut li a.selected { background: #ffffff; color: #9952b0; font-weight: bold; text-decoration: none; }
	#submenuShortcut li.edit { border-top: 1px dashed #aaa; padding-top: 5px; font-weight: bold; }