﻿/*-----------------------------------------------------------------------------
 [TABLE OF CONTENTS]
    +content
        +content-main
		    =pedia-title
            =top-msg
            =pedia-box
            	=test-box
            	=refueling
            =pedia-box-max
            	=refueling-max
            =wall-title
            =wall-box
            	=tab-box
            	=pedia-box
            	=info-box
            	=refueling-max
            =ftbtn
        +content-sidebar
        	=case
        		=pedia-box
-----------------------------------------------------------------------------*/
/* +content
*----------------------------------------------------------------------------*/
/* +content-main
*----------------------------------------------------------------------------*/
/**
 *
 * =pedia-title
 *
 **/
#content-main .pedia-title {
	width: 640px;
	height: 55px;
	background: url(../../i/bg-content-hd-dot.gif) no-repeat;
	margin: 0 auto;
}
#content-main .pedia-title .pedia-main {
	float: left;
	margin: 0 10px 0 0;
}
#content-main .pedia-title .pedia-sub {
	float: left;
	height: 26px;
	margin: 14px 0 0 0;
	background: url(../../i/bg-content-bd-second-left.gif) no-repeat left;
}
#content-main .pedia-title .pedia-sub span {
	float: left;
	height: 26px;
	padding: 0 5px 0 15px;
	background: url(../../i/bg-content-bd-second-right.gif) no-repeat right;
	font: bold 13px/26px Verdana;
	color: #fff;
}
/**
 *
 * =top-msg
 *
 **/
#content-main .top-msg {
	width: 640px;
	margin: 0 auto;
	padding: 10px 0 0 0;
	overflow: hidden;
    clear : both;
}
#content-main .top-msg .mascot {
    float: left;
	width: 500px;
    padding: 10px 0 10px 60px;
    margin: 0 0 0 60px;
	background: url(../../i/icon-pedia-mascot.jpg) no-repeat;
	color: #31bfed;
	font: 13px/26px Verdana;
	display: inline;
}
#content-main .top-msg .mascot p {
	color: #bbb;
}
#content-main .top-msg .mascot p.title {
	font: bold 17px/28px Verdana;
	color: #31bfed;
}
#content-main .top-msg .btn {
    float: right;
	width: 240px;
	height: 65px;
}
/**
 *
 * =pedia-box
 *
 **/
#content-main .pedia-box {
	position: relative;
	width: 640px;
	margin: 0 auto;
	padding: 15px 0 0 0;
	overflow: hidden;
   clear : both;
   background: url(../../i/bg-drop.gif);
}
#content-main .pedia-box h2 {
	padding: 0 0 0px 35px;
	font: 15px/28px Verdana;
	color: #30C0EE;
	background: url(../../i/icon-content-box-title.gif) no-repeat 0px 8px;
}
#content-main .pedia-box .btnmain {
	position: absolute;
	top: 0;
    right: 0;
    _right: 20px;
    width: 125px;
    height: 64px;
    display: block;
}
/**
 *
 * =test-box
 *
 **/
#content-main .pedia-box .test-box {
	width: 640px;
    background: url(../../i/bg-pedia-bd.gif) repeat-y;
}
#content-main .pedia-box .test-hd {
	width: 600px;
	padding: 20px;
    background: url(../../i/bg-pedia-hd.gif) no-repeat top;
}
#content-main .pedia-box .test-hd .blackboard {
	width: 600px;
    background: url(../../i/bg-pedia-blackboard-hd.jpg) no-repeat top;
}
#content-main .pedia-box .test-hd .blackboard-ft {
	position: relative;
	width: 520px;
	padding: 110px 40px 20px 40px;
    background: url(../../i/bg-pedia-blackboard-ft.gif) no-repeat bottom;
}
#content-main .pedia-box .test-hd .blackboard-ft .decide1 {
	position: absolute;
	top: -50px;
	left: 0;
	width: 300px;
	height: 155px;
    background: url(../../i/bg-decide.png) !important; 
    background: url("goflower.css");
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/bg-decide.png');
}
#content-main .pedia-box .test-hd .blackboard-ft .decide2 {
	position: absolute;
	top: 60px;
	left: 60px;
	width: 200px;
	height: 170px;
    background: url(../../i/bg-decide2.png) !important; 
    background: url("goflower.css");
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/bg-decide2.png');
}
#content-main .pedia-box .test-hd .blackboard-ft .decide3 {
	position: absolute;
	top: 60px;
	left: 40px;
	width: 200px;
	height: 170px;
    background: url(../../i/bg-decide3.png) !important; 
    background: url("goflower.css");
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/bg-decide3.png');
}
#content-main .pedia-box .test-hd .blackboard-ft div {
    width: 520px;
    margin: 0 0 10px 0;
    display: block;
    clear: both;
    overflow: hidden;
    zoom: 1;
    font: 20px/28px Verdana;
}
#content-main .pedia-box .test-hd .blackboard-ft .txt {
    width: 520px;
    font: 17px/28px Verdana;
    color: #fff;
    text-align: center;
}
#content-main .pedia-box .test-hd .blackboard-ft .txt p.win {
    margin: 0 auto;
    width: 175px;
    height: 175px;
    background: url(../../i/icon-win.png) !important; 
    background: url("goflower.css");
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/icon-win.png');
}
#content-main .pedia-box .test-hd .blackboard-ft .txt p.lose {
    margin: 0 auto;
    width: 175px;
    height: 175px;
    background: url(../../i/icon-lose.png) !important; 
    background: url("goflower.css");
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/icon-lose.png');
}
#content-main .pedia-box .test-hd .blackboard-ft label {
    width: 45px;
    margin: 0 10px 0 0;
}
#content-main .pedia-box .test-hd .blackboard-ft label.b {
    position: relative;
    top: -5px;
    top: -10px\9;  /* for ie8.0 */
    float: left;
    width: 45px;
    margin: 0 10px 0 0;
    font: bold 36px/46px Verdana;
    color: #25b9e4;
}
#content-main .pedia-box .test-hd .blackboard-ft label.y {
    position: relative;
    top: -5px;
    top: -10px\9;  /* for ie8.0 */
    float: left;
    width: 45px;
    margin: 0 10px 0 0;
    font: bold 36px/46px Verdana;
    color: #f38b3f;
}
#content-main .pedia-box .test-hd .blackboard-ft span {
    float: right;
    width: 465px;
    display: block;
    color: #fff;
}
#content-main .pedia-box .test-hd .blackboard-ft span label {
    cursor: pointer;
}
#content-main .pedia-box .test-hd .blackboard-ft span samp {
    font: 18px/28px Verdana;
    color: #fff;
}
#content-main .pedia-box .test-hd .blackboard-ft span samp a {
    color: #fff;
}
#content-main .pedia-box .test-hd .blackboard-ft .btn {
    width: 520px;
    text-align: center;
}
#content-main .pedia-box .test-hd .blackboard-ft button.btnstyle1 {
    background: url(../../i/btn-decide.png) !important; 
    background: url("goflower.css");
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/btn-decide.png');
    cursor: pointer;
    height: 76px;
    width: 180px;
	border: 0px solid #fff;
	color: #0085ec;
}
#content-main .pedia-box .test-hd .blackboard-ft button.btnstyle2 {
    background: url(../../i/btn-challenge.png) !important; 
    background: url("goflower.css");
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/btn-challenge.png');
    cursor: pointer;
    height: 76px;
    width: 180px;
	border: 0px solid #fff;
	color: #0085ec;
}
#content-main .pedia-box .test-hd .blackboard-ft button.btnstyle3 {
    background: url(../../i/btn-again.png) !important; 
    background: url("goflower.css");
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/btn-again.png');
    cursor: pointer;
    height: 76px;
    width: 180px;
	border: 0px solid #fff;
	color: #0085ec;
}
#content-main .pedia-box .test-hd .blackboard-ft button.btnstyle4 {
    background: url(../../i/btn-next-question.png) !important; 
    background: url("goflower.css");
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/btn-next-question.png');
    cursor: pointer;
    height: 76px;
    width: 210px;
	border: 0px solid #fff;
	color: #0085ec;
}
#content-main .pedia-box .test-ft {
	width: 600px;
	height: 70px;
	padding: 20px;
	text-align: center;
    background: url(../../i/bg-pedia-ft.gif) no-repeat bottom;
}
/**
 *
 * =refueling
 *
 **/

#content-main .pedia-box .refueling {
    width: 500px;
    margin: 0 auto;
    padding: 15px 10px 0 70px;    
    background: url(../../i/bg-refueling-hd.gif) no-repeat top;
}
#content-main .pedia-box .refueling-hd {
    width: 580px;
    height: 20px;
    margin: 0 auto 10px auto;
    background: url(../../i/bg-refueling-ft.gif) no-repeat bottom;
}
#content-main .pedia-box .refueling p {
    color: #00a4c2;
}
#content-main .pedia-box .refueling p.header {
    position: relative;
    font: 13px/28px Verdana;
    color: #466a00;
    margin: 0 0 12px 0;
}
#content-main .pedia-box .refueling p.header span {
    position: absolute;
    top: 0;
    _top: -5px;
    right: 10px;
    font: 11px/28px Verdana;
    color: #464646;
}
#content-main .pedia-box .refueling p.header samp {
    font: 11px/28px Verdana;
    color: #1d8598;
}
#content-main .pedia-box p.more {
    float: right;
    width: 100px;
    height: 30px;
    font: 11px/28px Verdana;
    color: #1d8598;
    padding: 0 0 0 15px;
    background: url(../../i/icon-arrow.gif) no-repeat 0 7px;
}
/**
 *
 * =pedia-box-max
 *
 **/

#content-main .pedia-box-max {
	position: relative;
	width: 900px;
	margin: 0 auto;
	padding: 15px 0 0 0;
	overflow: hidden;
   clear : both;
   background: url(../../i/bg-drop.gif);
}
#content-main .pedia-box-max h2 {
	padding: 0 0 0px 35px;
	font: 15px/28px Verdana;
	color: #30C0EE;
	background: url(../../i/icon-content-box-title.gif) no-repeat 0px 8px;
}
#content-main .pedia-box-max .btnmain {
	position: absolute;
	top: 0;
    right: 150px;
    width: 173px;
    height: 63px;
    display: block;
}
/**
 *
 * =refueling-max
 *
 **/
#content-main .pedia-box-max .refueling-max {
    width: 500px;
    margin: 0 auto;
    padding: 15px 10px 0 70px;    
    background: url(../../i/bg-refueling-hd.gif) no-repeat top;
}
#content-main .pedia-box-max .refueling-hd-max {
    width: 580px;
    height: 20px;
    margin: 0 auto 10px auto;
    background: url(../../i/bg-refueling-ft.gif) no-repeat bottom;
}
#content-main .pedia-box-max .refueling-max p {
    color: #00a4c2;
}
#content-main .pedia-box-max .refueling-max p.header {
    position: relative;
    font: 13px/28px Verdana;
    color: #466a00;
    margin: 0 0 12px 0;
}
#content-main .pedia-box-max .refueling-max p.header span {
    position: absolute;
    top: 0;
    *top: -5px;
    _top: -5px;
    right: 10px;
    font: 11px/28px Verdana;
    color: #464646;
}
#content-main .pedia-box-max .refueling-max p.header samp {
    font: 11px/28px Verdana;
    color: #1d8598;
}
#content-main .pedia-box-max p.more {
    float: right;
    width: 100px;
    height: 30px;
    font: 11px/28px Verdana;
    color: #1d8598;
    padding: 0 0 0 15px;
    background: url(../../i/icon-arrow.gif) no-repeat;
}
/**
 *
 * =wall-title
 *
 **/
#content-main .wall-title {
	width: 900px;
	height: 55px;
	background: url(../../i/bg-content-hd-dot.gif) no-repeat;
	margin: 0 auto;
}
#content-main .wall-title .title-main {
	float: left;
	margin: 0 10px 0 0;
}
#content-main .wall-title .title-sub {
	float: left;
	height: 26px;
	margin: 14px 0 0 0;
	background: url(../../i/bg-content-bd-second-left.gif) no-repeat left;
}
#content-main .wall-title .title-sub span {
	float: left;
	height: 26px;
	padding: 0 5px 0 15px;
	background: url(../../i/bg-content-bd-second-right.gif) no-repeat right;
	font: bold 13px/26px Verdana;
	color: #fff;
}
/**
 *
 * =wall-box
 *
 **/
#content-main .wall-box {
	width: 900px;
	margin: 0 auto;
	padding: 10px 0 0 0;
	overflow: hidden;
    clear : both;
    background: url(../../i/bg-drop.gif);
}
#content-main .wall-box h2 {
	padding: 0 0 0px 35px;
	font: 15px/28px Verdana;
	color: #30C0EE;
	background: url(../../i/icon-content-box-title.gif) no-repeat 0px 8px;
}
#content-main .wall-box p.msg {
	font: 15px/28px Verdana;
	text-align: center;
    color: #00a4c2;
}
#content-main .wall-box .completion {
    width: 600px;
    margin: 0 auto;
}
#content-main .wall-box .completion span {
	color: #E30086;
	font: 15px/28px Arial, Helvetica, sans-serif;
}
#content-main .wall-box .completion span.b {
    color: #30C0EE;
    font: 15px/28px Arial, Helvetica, sans-serif;
}
/**
 *
 * =tab-box
 *
 **/
#content-main .wall-box .tab-box {
    width: 584px;
    padding: 8px;
    margin: 0 auto;
}
#content-main .wall-box .tab-box p {
    position: relative;
}

#content-main .wall-box .tab-box p span {
    position: absolute;
    top: -42px;
    *top: -44px;
    _top: -44px;
    right: 10px;
    _right: -10px;
    width: 125px;
    height: 64px;
    display: block;
}
/**
 *
 * =pedia-box
 *
 **/
#content-main .wall-box .pedia-box {
    width: 600px;
    padding: 0 0 0 0;
    margin: 0 auto 20px auto;
	background: url(../../i/bg-member-box-max-ft.gif) no-repeat bottom;
}
#content-main .wall-box .box-hd2 {
    width: 584px;
    padding: 8px;
	background: url(../../i/bg-member-box-max-hd2.gif) no-repeat top;
}
#content-main .wall-box .box-hd2 table.tab-rank {
    width: 584px;
    font: 13px/28px Verdana;
}
#content-main .wall-box .box-hd2 table.tab-rank th {
    color: #31bfed;
}

#content-main .wall-box .box-hd2 table.tab-rank td {
    color: #0094e1;
    text-align: center;
}
#content-main .wall-box .box-hd2 table.tab-rank td a {
    color: #627b99;
}
#content-main .wall-box .box-hd1 {
    width: 584px;
    padding: 8px;
	background: url(../../i/bg-member-box-max-hd1.gif) no-repeat top;
}
#content-main .wall-box .box-hd1 table.tab-rank {
    width: 584px;
    font: 13px/28px Verdana;
}
#content-main .wall-box .box-hd1 table.tab-rank th {
    color: #31bfed;
}
#content-main .wall-box .box-hd1 table.tab-rank td {
    color: #0094e1;
    text-align: center;
}
#content-main .wall-box .box-hd1 table.tab-rank td a {
    color: #627b99;
}
/* =box-hd1 */
#content-main .wall-box .box-hd1 div {
    width: 584px;
    margin: 10px 0 10px 0;
    display: block;
    clear: both;
    overflow: hidden;
    zoom: 1;
}
#content-main .wall-box .box-hd1 label {
    float: left;
    width: 200px;
    margin: 0 10px 0 0;
    text-align: right;
    color: #25b9e4;
}
#content-main .wall-box .box-hd1 span {
    float: right;
    width: 370px;
    display: block;
}
#content-main .wall-box .box-hd1 span p {
    margin: 5px 0 0 0;
}
#content-main .wall-box .box-hd1 span.b {
    color: #30C0EE;
    font: 15px/28px Arial, Helvetica, sans-serif;
}
#content-main .wall-box .box-hd1 samp {
	color: #E30086;
	font: 15px/28px Arial, Helvetica, sans-serif;
}
#content-main .wall-box .box-hd1 samp.b {
	color: #30C0EE;
}
#content-main .wall-box .box-hd1 span img {
	vertical-align: middle;
}
#content-main .wall-box .box-hd1 input {
	vertical-align: middle;
}
#content-main .wall-box .box-hd1 span button.btnstyle1 {
    padding: 3px 5px 2px 5px;
    margin: 0 3px;
	background: url(../../i/bg-button.gif) repeat-x;
	border: 1px solid #ccc;
	color: #0085ec;
	vertical-align: middle;
}
#content-main .wall-box .box-hd1 span button.btnstyle1:hover {
	padding: 3px 5px 2px 5px;
	background: url(../../i/bg-button.gif) repeat-x 0 -30px;
	border: 1px solid #aaa;
	color: #0085ec;
}
#content-main .wall-box .box-hd1 table.rule-table {
    width: 800px;
	border:3px dotted #FF9A09;	
	padding:10px;
	background: url(../../i/bg001.gif);
	margin: 10px;
}
#content-main .wall-box .box-hd1 table.rule-table td {
	padding:10px;
}
/**
 *
 * =info-box
 *
 **/
#content-main .wall-box .info-box {
	width: 380px;
	height: 90px;
	margin: 0 auto 20px auto;
	padding: 40px 20px 20px 20px;
    background: url(../../i/bg-info-box.gif) no-repeat;
    color: #627b99;
}
#content-main .wall-box .info-box h2 {
	position: relative;
	padding: 0 0 0px 25px;
	font: 13px/28px Verdana;
	color: #30C0EE;
	background: url(../../i/icon-content-box-title-s.gif) no-repeat 0 12px;
	background: url(../../i/icon-content-box-title-s.gif) no-repeat 0 8px\9;
}
/**
 *
 * =refueling-max
 *
 **/
#content-main .wall-box .refueling-max {
    width: 500px;
    margin: 0 auto;
    padding: 15px 10px 0 70px;    
    background: url(../../i/bg-refueling-hd.gif) no-repeat top;
}
#content-main .wall-box .refueling-hd-max {
    width: 580px;
    height: 20px;
    margin: 0 auto 10px auto;
    background: url(../../i/bg-refueling-ft.gif) no-repeat bottom;
}
#content-main .wall-box .refueling-max p {
    color: #00a4c2;
}
#content-main .wall-box .refueling-max p.header {
    position: relative;
    font: 13px/28px Verdana;
    color: #466a00;
    margin: 0 0 12px 0;
}
#content-main .wall-box .refueling-max p.header span {
    position: absolute;
    top: 0;
    *top: -5px;
    _top: -5px;
    right: 10px;
    font: 11px/28px Verdana;
    color: #464646;
}
#content-main .wall-box .refueling-max p.header samp {
    font: 11px/28px Verdana;
    color: #1d8598;
}
#content-main .wall-box .refueling-max samp {
    font: 11px/28px Verdana;
    color: #1d8598;
}
#content-main .wall-box p.more {
    float: right;
    width: 100px;
    height: 30px;
    font: 11px/28px Verdana;
    color: #1d8598;
    padding: 0 0 0 15px;
    background: url(../../i/icon-arrow.gif) no-repeat;
}
/**
 *
 * =ftbtn
 *
 **/

#content-main .ftbtn {
    padding: 10px 0 0 0;
    text-align: center;
    background: #fff;
}
#content-main .ftbtn button {
    margin: 0 3px;
    font: 13px/30px Verdana;
}
#content-main .ftbtn button.btnstyle1 {
    height: 30px;
	background: url(../../i/bg-button.gif) repeat-x;
	border: 1px solid #ccc;
	color: #0085ec;
}
#content-main .ftbtn button.btnstyle1:hover {
	height: 30px;
	background: url(../../i/bg-button.gif) repeat-x 0 -30px;
	border: 1px solid #aaa;
	color: #0085ec;
}
/* +content
*----------------------------------------------------------------------------*/
/* +content-sidebar
*----------------------------------------------------------------------------*/
/**
 *
 * =case
 *
 **/
#content-sidebar .case {
	width: 227px;
	margin: 0 0 10px 3px;
}
#content-sidebar .case h2 {
	position: relative;
	padding: 0 0 0px 25px;
	font: 13px/28px Verdana;
	color: #30C0EE;
	background: url(../../i/icon-content-box-title-s.gif) no-repeat 0 12px;
	background: url(../../i/icon-content-box-title-s.gif) no-repeat 0 8px\9;
}
#content-sidebar .case h2 span {
    position: absolute;
    right: 5px;
    top: 10px;
    *top: 5px;
    _top: 5px;
	width: 37px;
	height: 11px;
}
/**
 *
 * =pedia-box
 *
 **/
#content-sidebar .case .pedia-box {
    width: 227px;
	background: url(../../i/bg-member-box-ft.gif) no-repeat bottom;
}
#content-sidebar .case .box-hd1 {
    width: 211px;
    padding: 8px;
	background: url(../../i/bg-member-box-hd1.gif) no-repeat top;
}
#content-sidebar .case .box-hd1 p {
    color: #627b99;
    padding: 5px;
}
#content-sidebar .case .box-hd1 a {
    padding: 0 0 0 15px;
	background: url(../../i/icon-arrow.gif) no-repeat 0 4px;
	*background: url(../../i/icon-arrow.gif) no-repeat 0 1px;
	_background: url(../../i/icon-arrow.gif) no-repeat 0 1px;
}
#content-sidebar .case .box-hd2 {
    width: 211px;
    padding: 8px;
	background: url(../../i/bg-member-box-hd2.gif) no-repeat top;
}
#content-sidebar .case .box-hd2 table.tab-rank {
    width: 211px;
    font: 13px/28px Verdana;
}
#content-sidebar .case .box-hd2 table.tab-rank th {
    color: #31bfed;
}
#content-sidebar .case .box-hd2 table.tab-rank td {
    color: #0094e1;
    text-align: center;
}
#content-sidebar .case .box-hd2 table.tab-rank td a {
    color: #627b99;
}

