@charset "UTF-8";

ul li {
	font-size: 0.8rem;
}
span {
	display: block;
	padding: 5px 0 0 0;
  text-indent: 10px;
  font-weight: normal;
}
label {
  display: block;
}
input, select {
  margin: 0 0 0 10px;
	padding: 5px;
  font-size: 0.8rem;
}
/*-----------------------------------------*/
#mainImg {
  display: block;
  margin: 0 0 15px 0;
  width: 796px;
}
/*-----------------------------------------*/
#bookIntro {
  margin: 0 0 30px 0;
  padding: 20px 21px 0 21px;
  width: 756px;
  background-color: #f9e9d1;
	color: #000;
}
#bookIntro p {
  display: block;
  margin: 20px 0 30px 0;
  width: 736px;
  font-size: 0.9rem;
  line-height: 1.6rem;
}
#bookIntro span {
  display: block;
  margin: 30px 0 15px 0;
  padding: 0;
  text-indent: 0;
  font-size: 1.0rem;
  line-height: 1.6rem;
}
#bookIntro table {
  font-size: 1.0rem;
  line-height: 1.6rem;
}
#bookIntro table th, #bookIntro table td {
  height: 1.6em;
}
.bookFloatLeft {
  float: left;
  margin: 20px 0 0 0;
}
.bookFloatRight {
  float: right;
  margin: 20px 0 0 0;
}
/*-----------------------------------------*/
#formContentArea {
	display: block;
	margin: 0 0 30px 0;
  padding: 30px 21px 10px 21px;
  width: 756px;
  background-color: #fff;
}

#quizCheckArea {
	display: none;
}

#answerContentArea {
	display: block;
	margin: 0 0 30px 0;
  padding: 30px 21px;
  width: 756px;
  background-color: #fff;
}
#answerContentArea span {
	color: #fff;
}

.formContents {
  display: block;
  margin: 0 auto 30px auto;
	width: 656px;
}


.formContents label {
	display: block;
	cursor: pointer;
}
.formContents label input {
	margin: 0 5px 0 10px;
	padding: 0;
	line-height: 0;
}
.formContents p {
	display: block;
	color: #334e69;
  font-weight: bold;
  font-size: 1.0rem;
}
.formContentsAnswer {
  font-weight: normal !important;
  font-size: 0.9rem !important;
}

.formRadio {
	display: block;
	float: left;
	margin: 0 2% 2% 0;
	padding: 20px 10px;
	width: 44%;
	background-color: #99a7b4;
	color: #fff !important;
	font-size: 1.0rem;
}
.formRadioLong {
	margin: 0 2% 2% 0;
	padding: 20px 10px;
	width: 94%;
	background-color: #99a7b4;
	color: #fff !important;
	font-size: 1.0rem;
}

.formRadioGray {
  float: left;
	margin: 0 2% 2% 0;
	padding: 20px 10px;
	width: 44%;
	background-color: #bbb;
	color: #fff !important;
	font-size: 1.0rem;
}
.formRadioLongGray {
  margin: 0 2% 2% 0;
	padding: 20px 10px;
	width: 94%;
	background-color: #bbb;
	color: #fff !important;
	font-size: 1.0rem;
}

.formRadioOrange {
  float: left;
	margin: 0 2% 2% 0;
	padding: 20px 10px;
	width: 44%;
	background-color: #e29317;
	color: #fff !important;
	font-size: 1.0rem;
}
.formRadioLongOrange {
  margin: 0 2% 2% 0;
	padding: 20px 10px;
	width: 94%;
	background-color: #e29317;
	color: #fff !important;
	font-size: 1.0rem;
}

#answerImg1, #answerImg2, #answerImg3 {
	display: none;
	width: 100%;
	margin: 0 auto;
	text-align: center;
}
#answerImg1 p, #answerImg2 p, #answerImg3 p {
	display: block;
	margin: 0 0 0 0;
	padding:  100px 90px 0 0;
	font-size: 3rem;
	font-weight: bold;
	color: #334e69;
}
#answerImg1 {
	background: url("../img/img_answer01.png") no-repeat 0 0;
	height: 228px;
}
#answerImg2 {
	background: url("../img/img_answer02.png") no-repeat 0 0;
	height: 228px;
}
#answerImg3 {
	background: url("../img/img_answer03.png") no-repeat 0 0;
	height: 228px;
}
/*-----------------------------------------*/
#btnArea {
	margin: 0 auto 0 auto;
	width: 100%;
  height: auto;
	text-align: center;
}
.btnSubmit {
  display: block;
  margin: 0 auto;
  padding: 20px 60px;
	border: solid 3px #334e69;
  border-radius: 5px;
  background-color: #334e69;
  color: #fff;
  font-size: 1.2em;
  line-height: 1em;
  cursor: pointer;
}
.btnSubmit:hover {
	border: solid 3px #0b3c89;
  background-color: #fff !important;
  color: #0b3c89;
  font-weight: bold;
}