body{
	margin:0;
	padding:0;
	background-color:#00045f;
	text-align: center;
	background-image: url(../examin/images/examBg.jpg);
	background-repeat: repeat-x;
}
#loadingBoard{
	
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 600px;
	background-color: #00045f;
	background-image: url(../images/loadingAnimationW.gif);
	background-repeat: no-repeat;
	background-position: center center;	
	z-index: 22;
}
#index{
	background-image: url(../images/quizBg00.jpg);
	background-repeat: repeat-x;
	background-position: center 0;	
	background-color: #00045F;
}
#index h1{
	position: absolute;
	top: 0px;
	left: 0px;
	display: block;
	width: 820px;
	height: 80px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}
#index h2{
	position: absolute;
	top: 90px;
	left: 0;
	background-image: url(../images/h2.png);
	background-repeat: repeat-x;
	background-position: 0 0;	
	width: 684px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}
#index ul.sns{
	margin: 0 auto 0 auto;
	display: block;
	width: 690px;
	height: 130px;
}
#index ul.sns li{
	float: right;
	display: block;
	width: 32px;
	height: 130px;
	border: 0px solid #333333;
}
#index ul.sns li a{
	display: block;
	width: 32px;
	height: 130px;
	text-indent: -9999px;	
}
#index ul.sns li.tw a{
	background-image: url(../images/indexSnsBtn.gif);
	background-repeat: repeat-x;
	background-position: -32px 92px;	
}
#index ul.sns li.fb a{
	background-image: url(../images/indexSnsBtn.gif);
	background-repeat: repeat-x;
	background-position: 0 92px;	
}
#index ul.sns li.tw a:hover{
	background-position:  -32px 94px;
}
#index ul.sns li.fb a:hover{
	background-position: 0 94px;
}
#index #container{

	position: relative;
	text-align: left;
	color: #ffffff;
	width: 820px;
	height: 380px;
}



#index ul.navi{
	position: absolute;
	top: 307px;
	left: 0px;
	width: 820px;
	height: 270px;
	overflow: hidden;
	z-index: 3;
}
#index ul.navi li{
	display: block;
	float: left;
	width: 60px;
	height: 50px;

	border:0px solid #333333;
	text-indent: 0px;
}
#index ul.navi li.btn00{
	width: 130px;
	height: 50px;
}
#index ul.navi li a{
	display: block;
	width:54px;
	height: 50px;
	background-color: #00045F;
	border-radius: 4px; 
    -webkit-border-radius: 4px; 
    -moz-border-radius: 4px;
    overflow: hidden;
    
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

#index ul.navi li.btn01 a{
	background-image: url(../images/quizBtn01.gif);
	background-repeat: no-repeat;
}
#index ul.navi li.btn02 a{
	background-image: url(../images/quizBtn02.gif);
	background-repeat: no-repeat;
}
#index ul.navi li.btn03 a{
	background-image: url(../images/quizBtn03.gif);
	background-repeat: no-repeat;
}
#index ul.navi li.btn04 a{
	background-image: url(../images/quizBtn04.gif);
	background-repeat: no-repeat;
}
#index ul.navi li.btn05 a{
	background-image: url(../images/quizBtn05.gif);
	background-repeat: no-repeat;
}
#index ul.navi li.btn06 a{
	background-image: url(../images/quizBtn06.gif);
	background-repeat: no-repeat;
}
#index ul.navi li.btn06 a{
	background-image: url(../images/quizBtn06.gif);
	background-repeat: no-repeat;
}
#index ul.navi li.btn07 a{
	background-image: url(../images/quizBtn07.gif);
	background-repeat: no-repeat;
}
#index ul.navi li.btn08 a{
	background-image: url(../images/quizBtn08.gif);
	background-repeat: no-repeat;
}
#index ul.navi li.btn09 a{
	background-image: url(../images/quizBtn09.gif);
	background-repeat: no-repeat;
}
#index ul.navi li.btn10 a{
	background-image: url(../images/quizBtn10.gif);
	background-repeat: no-repeat;
}
#index ul.navi li.btn11 a{
	background-image: url(../images/quizBtn11.gif);
	background-repeat: no-repeat;
}

#index ul.navi li a:hover{
	background-position:-3px 0;
}
#index ul.navi li a:active{
	background-position:0 0;
}

#index ul.navi li.btn00 a{
	display: block;
	width:124px;
	height: 50px;
	background-image: url(../images/quizBtn00.gif);
	background-repeat: no-repeat;	
}
#index ul.navi li.btn00 a:hover{
	background-position:-2px 0;
}
#index ul.navi li.btn00 a:active{
	background-position:6px 0;
}

#index ul.pics{
	position: absolute;
	top: 187px;
	left: 0px;
	width: 820px;
	height: 270px;
	overflow:visible;
	z-index: 2;
}
#index ul.pics li{
	overflow:visible;
	position: absolute;
	width: 100px;
	height: 108px;
	z-index: 1;
}
#index ul.pics li.pic01{
	top:0;
	left: 105px;

}
#index ul.pics li.pic02{
	position: absolute;
	top:0;
	left: 225px;
}
#index ul.pics li.pic03{
	position: absolute;
	top:0;
	left: 345px;
}
#index ul.pics li.pic03{
	position: absolute;
	top:0;
	left: 345px;
}
#index ul.pics li.pic04{
	position: absolute;
	top:0;
	left: 465px;
}
#index ul.pics li.pic05{
	position: absolute;
	top:0;
	left: 585px;
}
#index ul.pics li.pic06{
	position: absolute;
	top:0;
	left: 705px;
}

#index ul.pics li.pic07{
	position: absolute;
	top:180px;
	left: 165px;
}
#index ul.pics li.pic08{
	position: absolute;
	top:180px;
	left: 285px;
}
#index ul.pics li.pic09{
	position: absolute;
	top:180px;
	left: 405px;
}
#index ul.pics li.pic10{
	position: absolute;
	top:180px;
	left: 525px;
}
#index ul.pics li.pic11{
	position: absolute;
	top:180px;
	left:645px;
}
/*-------------*/
#quiz{
	background-image: url(../images/quizBg01.jpg);
	background-repeat: repeat-x;
	background-position: center 0;	
	background-color: #00045F;
}

#quiz #container{

	position: relative;
	text-align: left;
	color: #ffffff;
	
	width: 820px;
	width: 0px;

	height: 380px;
	background-image: url(../images/quizContainerBg.png);
	background-repeat: repeat-x;
	background-position: center 0;
	overflow: hidden;
	
}
*html #quiz #container{
	clear: both;
	margin-top: 110px;
	border: 1px solid #ffffff;
}
#quiz h1{
	display: block;
	height: 110px;
	    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
	border: 0px solid #333333;
}
#quiz h2,h3{
	position: absolute;
	display: block;
	padding: 26px 0 0 40px;
	font-size: 20px;
	line-height: 20px;
	top:0px;
	left: 50px;
	display: block;
	height: 80px;
	width: 720px;
	z-index: 4;
}
#quiz h2.q01{
		background-image: url(../images/quizh2_01.gif);
		background-repeat: no-repeat;
}
#quiz h2.q02{
		background-image: url(../images/quizh2_02.gif);
		background-repeat: no-repeat;
}
#quiz h2.q03{
		background-image: url(../images/quizh2_03.gif);
		background-repeat: no-repeat;
}
#quiz h2.q04{
		background-image: url(../images/quizh2_04.gif);
		background-repeat: no-repeat;
}
#quiz h2.q05{
		background-image: url(../images/quizh2_05.gif);
		background-repeat: no-repeat;
}
#quiz h2.q06{
		background-image: url(../images/quizh2_06.gif);
		background-repeat: no-repeat;
}
#quiz h2.q07{
		background-image: url(../images/quizh2_07.gif);
		background-repeat: no-repeat;
}
#quiz h2.q08{
		background-image: url(../images/quizh2_08.gif);
		background-repeat: no-repeat;
}
#quiz h2.q09{
		background-image: url(../images/quizh2_09.gif);
		background-repeat: no-repeat;
}
#quiz h2.q10{
		background-image: url(../images/quizh2_10.gif);
		background-repeat: no-repeat;
}
#quiz h2.q11{
		background-image: url(../images/quizh2_11.gif);
		background-repeat: no-repeat;
}



#quiz h3{
	display: none;
		padding: 13px 0 0 40px;
		background-image: url(../images/quizh2_01.gif);
		background-repeat: no-repeat;
		background-position: -544px 0;
}
#quiz h3 sub{
	display: block;
	color: #ffff00;
	font-size: 12px;
}
#quiz h3 small{
	display: block;
	font-size: 14px;
}
#quiz .pics{
	display: block;
	position: absolute;
	top:80px;
	left: 50px;
	width: 534px;
	height: 184px;
	overflow: hidden;
	}
#quiz .pics .blind{
	position: relative;
}
/*---------------blind--------------*/
#quiz .pics.q01 .blind .b01,
#quiz .pics.q01 .blind .b02,
#quiz .pics.q02 .blind .b01,
#quiz .pics.q02 .blind .b02,
#quiz .pics.q03 .blind .b01,
#quiz .pics.q03 .blind .b02,
#quiz .pics.q04 .blind .b01,
#quiz .pics.q04 .blind .b02,
#quiz .pics.q05 .blind .b01,
#quiz .pics.q05 .blind .b02,
#quiz .pics.q06 .blind .b01,
#quiz .pics.q06 .blind .b02,
#quiz .pics.q07 .blind .b01,
#quiz .pics.q07 .blind .b02,
#quiz .pics.q08 .blind .b01,
#quiz .pics.q08 .blind .b02,
#quiz .pics.q09 .blind .b01,
#quiz .pics.q09 .blind .b02,
#quiz .pics.q10 .blind .b01,
#quiz .pics.q10 .blind .b02,
#quiz .pics.q11 .blind .b01,
#quiz .pics.q11 .blind .b02{
	position: absolute;
	top:23px;
	left: 160px;
	width: 40px;
	height: 20px;
	background-color: #333333;
	z-index: 3;
		border-radius: 4px; 
    -webkit-border-radius: 4px; 
    -moz-border-radius: 4px;
    
    background-image: url(../images/blindBg.gif);
    background-position: center center;
    background-repeat: no-repeat;
}
#quiz .pics.q01 .blind .b02{
	top:122px;
	left: 130px;
}
#quiz .pics.q02 .blind .b01,
#quiz .pics.q02 .blind .b02{
	top:50px;
	left: 408px;
	width: 30px;
	height: 80px;
}
#quiz .pics.q03 .blind .b01,
#quiz .pics.q03 .blind .b02{
	top:20px;
	left: 180px;
	width: 120px;
	height: 20px;
}
#quiz .pics.q04 .blind .b01,
#quiz .pics.q04 .blind .b02{
	top:54px;
	left: 394px;
	width: 80px;
	height: 20px;
}
#quiz .pics.q05 .blind .b01{
	top:20px;
	left: 180px;
	width: 50px;
	height: 60px;
}
#quiz .pics.q05 .blind .b02{
	top:38px;
	left: 415px;
	width:40px;
	height: 20px;
}
#quiz .pics.q06 .blind .b01,
#quiz .pics.q06 .blind .b02,
#quiz .pics.q07 .blind .b01,
#quiz .pics.q07 .blind .b02,
#quiz .pics.q08 .blind .b01,
#quiz .pics.q08 .blind .b02,
#quiz .pics.q09 .blind .b01,
#quiz .pics.q09 .blind .b02,
#quiz .pics.q10 .blind .b01,
#quiz .pics.q10 .blind .b02,
#quiz .pics.q11 .blind .b01,
#quiz .pics.q11 .blind .b02{
	display: none;
}
/*--------------------------*/
#quiz .hint,
#quiz .knowledge{
	position: absolute;
	top:290px;
	left: 50px;
	padding: 0 0 0 60px;
	width: 660px;
	height: 70px;
	font-size: 12px;
	letter-spacing: 0;
	font-weight: bold;
	line-height: 22px;
	overflow:visible;
	z-index: 3;
	color: #ffffff;
}

#quiz .hint{
	background-image: url(../images/hint.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-color: #00045f;
}
#quiz .knowledge{
	display: none;
	padding: 32px 0 0 10px;
	width:340px;
	top:270px;
		background-image: url(../images/knowledge.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	background-color: #00045f;
}
#quiz ul.select{
	display: block;
	position: absolute;
	top: 80px;
	left: 595px;
	z-index: 6;
}
#quiz ul.select li{
	display: block;
	width: 176px;
	height: 62px;
}
#quiz ul.select li a{
	display: block;
	width: 176px;
	height: 60px;
		font-size: 16px;
	font-weight: bold;
	line-height: 60px;
	color: #ffffff;
	text-indent: 20px;
	background-color: #00ccff;
	
border-top-left-radius: 4px;     /* 左上 */
border-top-right-radius: 0;    /* 右上 */
border-bottom-left-radius: 4px;  /* 左下 */
border-bottom-right-radius: 0; /* 右下 */

-webkit-border-top-left-radius: 4px;     /* 左上 */
-webkit-border-top-right-radius: 0;    /* 右上 */
-webkit-border-bottom-left-radius: 4px;  /* 左下 */
-webkit-border-bottom-right-radius: 0; /* 右下 */

-moz-border-radius-topleft: 4px;     /* 左上 */
-moz-border-radius-topright: 0;    /* 右上 */
-moz-border-radius-bottomleft: 4px;  /* 左下 */
-moz-border-radius-bottomright: 0; /* 右下 */
}
/*-------.long------*/
#quiz ul.select.long{
	display: block;
	position: absolute;
	top: 80px;
	left: 295px;
	z-index: 6;
}
#quiz ul.select.long li{
	display: block;
	width: 476px;
	height: 62px;
}
#quiz ul.select.long li a{
	display: block;
	width: 476px;
}
/*-------/.long------*/
#quiz ul.select li a:hover{
	color: #ffff00;
}
#quiz #answerBoard{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 560px;
	z-index: 20;
	display: none;
	overflow: hidden;
	
	cursor: pointer;
	
}
#quiz #answerBoard .maru{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	width: 0;
	height: 560px;
	background-image: url(../images/maru.gif);
	background-repeat: no-repeat;
	background-position: center 140px;
	z-index: 2;
	overflow: hidden;
}
#quiz #answerBoard .batsu{
	width: 100%;
	width: 0;
	height: 560px;
	position: absolute;
	top: 0;
	left: 0;
	background-image: url(../images/batsu.gif);
	background-repeat: no-repeat;
	background-position: center 140px;
	z-index: 1;
	overflow: hidden;
}

#quiz .top{
	position: absolute;
	top: 0;
	width: 42px;
	height: 75px;
	z-index: 20;
}
#quiz .navi a{
	border-radius: 4px; 
    -webkit-border-radius: 4px; 
    -moz-border-radius: 4px;
    text-indent: -9999px;
}
#quiz .top a{
	display: block;
	width: 42px;
	height: 75px;
	font-size: 6px;
	background-color: #00045f;
	background-image: url(../images/navi_01.png);
	background-repeat: no-repeat;
	background-position: 0 center;
}

#quiz .prev,
#quiz .next{
	position: absolute;
	top: 80px;
	left: 0;
	width: 42px;
	height: 300px;
	z-index: 20;
}
#quiz .next{
	position: absolute;
	top: 80px;
	left: 778px;
	width: 42px;
	height: 300px;

}

#quiz .prev a{
	display: block;
	width: 42px;
	height: 300px;
	font-size: 6px;
	background-color: #00045f;
	background-image: url(../images/navi_02.png);
	background-repeat: no-repeat;
	background-position: 0 center;
}
#quiz .next a{
	display: block;
	width: 42px;
	height: 300px;
	font-size: 6px;
	background-color: #00045f;
	background-image: url(../images/navi_03.png);
	background-repeat: no-repeat;
	background-position: 0 center;
}
#quiz .next a.correct{
	background-color: #00CCFF;
	background-position: -42px center;	
}

#quiz .navi a:hover{
	background-color: #00CCFF;
	background-position: -42px center;	
}

#quiz .submit{
	display: block;
	display: none;
	
	position: absolute;
	top: 280px;
	left: 425px;
	width: 346px;
	height: 86px;
	background-color: #ffffff;
	z-index: 19;
	
	background-image: url(../images/sub.gif);
	background-position: center 3px;
	background-repeat: no-repeat;
	
border-top-left-radius: 4px;     /* 左上 */
border-top-right-radius: 0;    /* 右上 */
border-bottom-left-radius: 4px;  /* 左下 */
border-bottom-right-radius: 0; /* 右下 */

-webkit-border-top-left-radius: 4px;     /* 左上 */
-webkit-border-top-right-radius: 0;    /* 右上 */
-webkit-border-bottom-left-radius: 4px;  /* 左下 */
-webkit-border-bottom-right-radius: 0; /* 右下 */

-moz-border-radius-topleft: 4px;     /* 左上 */
-moz-border-radius-topright: 0;    /* 右上 */
-moz-border-radius-bottomleft: 4px;  /* 左下 */
-moz-border-radius-bottomright: 0; /* 右下 */
	
}
#quiz .fb{
	display: block;
	/*display: none;*/
	
	position: absolute;
	/*top: 28px;
	left: 12px;*/
	top: -308px;
	left: 437px;
	width: 100px;
	height: 24px;
	border-bottom: 1px dotted #999999;
	z-index: 30;

}
#quiz .tw{
	display: block;
	display: none;
	
	position: absolute;
	/*top: 56px;
	left: 12px;*/
	top: 336px;
	left: 437px;
	width: 120px;
	height: 20px;
	z-index: 20;
}
#quiz .subBtn{
	display: block;
	display: none;
	
	position: absolute;
	
	/*top: 20px;
	left: 130px;*/
	top: 300px;
	left: 555px;
	padding: 0 0 0 10px;
	height: 58px;
	z-index: 20;
}
#quiz .subBtn a{
	text-indent: -9999px;
	display:block;	
	width:189px;
	height:60px;
	background-image: url(../images/subBtn.gif);
	background-repeat: no-repeat;
	background-position:0 0;
}
#quiz .subBtn a:hover{
	background-image: url(../images/subBtn.gif);
	background-repeat: no-repeat;
	background-position:0 -60px;
}
#quiz .subBtn a:active{
	background-image: url(../images/subBtn.gif);
	background-repeat: no-repeat;
	background-position:0 -120px;
}

.text{
	font-family: "ＭＳ Ｐ明朝","ＭＳ 明朝","Hiragino Mincho Pro W3","ヒラギノ明朝 Pro W3",serif;
	z-index: 10;
}