@charset "UTF-8";
/* CSS Document */

@-moz-document url-prefix() {
	section {
		display: block;
	}
}
/*------------------------------
   問題ページ共通
--------------------------------*/
/*--- 問題 ---*/
.secQuestion {
	margin-bottom: 2000px;
}

.boxQuestion {
	background-color: #0e3a2b;
	border: 5px solid #fc3;
	padding: 1em;
}

p.qTitle {
	background: url(../images/ttl_question.png) no-repeat 50% 0;
	margin-bottom: 0.35em;
	text-align: center;
	height: 2.65em;
}

img.imgCommon {
	margin: 1.5em 0 0;
}

img.bkboardDeco {
	position: relative;
	bottom: -22px;
	right: -1em;
}

p.caption {
	font-size: 0.938em; /*15px*/
}

/*選択肢*/
ul.btnChoices,
ul.btnChoices_correct {
	color: #212121;
	margin: 1.5em 0;
    position: relative;
}
ul.btnChoices li,
ul.btnChoices_correct li {
	background: #ffb;
	border: 5px solid;
	border-radius: 65px;
	font-size: 1.250em; /*20px*/
	margin: 0.45em 0;
    behavior: url(../css/PIE.php);
	position: relative;
	-ms-transform: rotate(0.028deg);
}

ul.btnChoices li:hover {
	background: #ffffd5;
}

ul.btnChoices li a,
ul.btnChoices li a:visited {
	display: block;
	color: #212121;
}
ul.btnChoices li a,
ul.btnChoices_correct li {
	padding: 0.5em 0.5em 0.5em 2.75em;
}
ul.btnChoices li a span,
ul.btnChoices_correct li span {
	display: table-cell;
	vertical-align: middle;
	height: 35px;
}

/*2行のとき*/
ul.height60px li a span,
ul.height60px li span {
	height: 60px;
}
/*3行のとき*/
ul.height90px li a span,
ul.height90px li span {
	height: 90px;
}


/*--- 不正解 ---*/
.secWrong {
	margin-bottom: 1500px;
	padding-top: 1.5em;
}

.secWrong .boxQuestion p {
	text-align: center;
}
.secWrong .boxQuestion p img.imgCommon_parts2 {
	margin: 3.5em 0 1em;
}

.btn {
	margin-bottom: 2em;
}
.btn ul li.back {
	float: left;
	width: 49%;
}
.btn ul li.next {
	float: right;
	width: 49%;
}

/*--- 正解 ---*/
.secCorrect {
	padding-top: 1.5em;
}

.blockCommentary {
	margin-bottom: 2em;
}
.blockCommentary .boxCommentary {
	margin: 0;
}

.secCorrect .boxQuestion p {
	text-align: center;
}
.secCorrect .boxQuestion p img.imgCommon_parts2 {
	margin: 2.35em 0 1em;
}

p.commentaryTtl {
	line-height: 0;
	text-align: center;
}

.note {
	background: #fff;
	border-radius: 9px;
	margin: 1em 0 0;
	padding: 0.65em;
    behavior: url(../css/PIE.php);
    position: relative;
}
.note p {
	color: #212121;
	font-size: 0.875em;
}
.exceptionCap {
	font-size: 0.875em;
}


@media all and (max-width: 320px) {
ul.btnChoices li,
ul.btnChoices_correct li {
	font-size: 1.125em; /*18px*/
}
ul.btnChoices li a,
ul.btnChoices_correct li {
	padding-left: 3em;
}

}

/*------------------------------
   認定証
--------------------------------*/
.boxCertification {
	background: #fff;
	border: #fc3 3px solid;
	margin-bottom: 2em;
	padding: 0.7em 1em;
	text-align: center;
}

.certificationTtl {
	margin: 1em 0;
}
.certificationTtl img {
	width: 70%;
}
.certificationTxt {
	color: #212121;
	font-size: 1.250em; /*19px*/
	line-height: 170%;
	margin: auto;
	text-align: left;
	width: 92%;
}
.signKG {
	color: #212121;
	font-size: 1.250em; /*19px*/
	margin: 1em 0;
	padding-right: 1em;
	text-align: right;
}

@media all and (max-width: 320px) {
.certificationTxt,
.signKG {
	font-size: 1.063em; /*17px*/
}
}

/*------------------------------
   安全クイズ
--------------------------------*/
.q-safety ul.btnChoices li,
.q-safety ul.btnChoices_correct li {
	border-color: #2982c6;
}
.q-safety ul.btnChoices li:hover {
	border-color: #5ea6ed;
}

.q-safety ul.btnChoices li.answer01,
.q-safety ul.btnChoices_correct li.answer01 {
	background-image: url(../images/ico_choicesBU1.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-safety ul.btnChoices li.answer01:hover {
	background-image: url(../images/ico_choicesBU1_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-safety ul.btnChoices li.answer02,
.q-safety ul.btnChoices_correct li.answer02 {
	background-image: url(../images/ico_choicesBU2.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-safety ul.btnChoices li.answer02:hover {
	background-image: url(../images/ico_choicesBU2_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-safety ul.btnChoices li.answer03,
.q-safety ul.btnChoices_correct li.answer03 {
	background-image: url(../images/ico_choicesBU3.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-safety ul.btnChoices li.answer03:hover {
	background-image: url(../images/ico_choicesBU3_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-safety ul.btnChoices li.answer04,
.q-safety ul.btnChoices_correct li.answer04 {
	background-image: url(../images/ico_choicesBU4.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-safety ul.btnChoices li.answer04:hover {
	background-image: url(../images/ico_choicesBU4_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}

/*------------------------------
   環境クイズ
--------------------------------*/
.q-environment ul.btnChoices li,
.q-environment ul.btnChoices_correct li {
	border-color: #2da361;
}
.q-environment ul.btnChoices li:hover {
	border-color: #3ac979;
}

.q-environment ul.btnChoices li.answer01,
.q-environment ul.btnChoices_correct li.answer01 {
	background-image: url(../images/ico_choicesGN1.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-environment ul.btnChoices li.answer01:hover {
	background-image: url(../images/ico_choicesGN1_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-environment ul.btnChoices li.answer02,
.q-environment ul.btnChoices_correct li.answer02 {
	background-image: url(../images/ico_choicesGN2.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-environment ul.btnChoices li.answer02:hover {
	background-image: url(../images/ico_choicesGN2_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-environment ul.btnChoices li.answer03,
.q-environment ul.btnChoices_correct li.answer03 {
	background-image: url(../images/ico_choicesGN3.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-environment ul.btnChoices li.answer03:hover {
	background-image: url(../images/ico_choicesGN3_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-environment ul.btnChoices li.answer04,
.q-environment ul.btnChoices_correct li.answer04 {
	background-image: url(../images/ico_choicesGN4.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-environment ul.btnChoices li.answer04:hover {
	background-image: url(../images/ico_choicesGN4_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}

/*------------------------------
   マナークイズ
--------------------------------*/
.q-manners ul.btnChoices li,
.q-manners ul.btnChoices_correct li {
	border-color: #ed85b6;
}
.q-manners ul.btnChoices li:hover {
	border-color: #f4b1d1;
}

.q-manners ul.btnChoices li.answer01,
.q-manners ul.btnChoices_correct li.answer01 {
	background-image: url(../images/ico_choicesPK1.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-manners ul.btnChoices li.answer01:hover {
	background-image: url(../images/ico_choicesPK1_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-manners ul.btnChoices li.answer02,
.q-manners ul.btnChoices_correct li.answer02 {
	background-image: url(../images/ico_choicesPK2.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-manners ul.btnChoices li.answer02:hover {
	background-image: url(../images/ico_choicesPK2_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-manners ul.btnChoices li.answer03,
.q-manners ul.btnChoices_correct li.answer03 {
	background-image: url(../images/ico_choicesPK3.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-manners ul.btnChoices li.answer03:hover {
	background-image: url(../images/ico_choicesPK3_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-manners ul.btnChoices li.answer04,
.q-manners ul.btnChoices_correct li.answer04 {
	background-image: url(../images/ico_choicesPK4.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-manners ul.btnChoices li.answer04:hover {
	background-image: url(../images/ico_choicesPK4_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}

/*------------------------------
   電車の名前クイズ
--------------------------------*/
.q-train ul.btnChoices li,
.q-train ul.btnChoices_correct li {
	border-color: #ff6600;
}
.q-train ul.btnChoices li:hover {
	border-color: #ff8533;
}

.q-train ul.btnChoices li.answer01,
.q-train ul.btnChoices_correct li.answer01 {
	background-image: url(../images/ico_choicesYE1.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-train ul.btnChoices li.answer01:hover {
	background-image: url(../images/ico_choicesYE1_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-train ul.btnChoices li.answer02,
.q-train ul.btnChoices_correct li.answer02 {
	background-image: url(../images/ico_choicesYE2.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-train ul.btnChoices li.answer02:hover {
	background-image: url(../images/ico_choicesYE2_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-train ul.btnChoices li.answer03,
.q-train ul.btnChoices_correct li.answer03 {
	background-image: url(../images/ico_choicesYE3.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-train ul.btnChoices li.answer03:hover {
	background-image: url(../images/ico_choicesYE3_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-train ul.btnChoices li.answer04,
.q-train ul.btnChoices_correct li.answer04 {
	background-image: url(../images/ico_choicesYE4.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-train ul.btnChoices li.answer04:hover {
	background-image: url(../images/ico_choicesYE4_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}

/*------------------------------
   ラグビークイズ
--------------------------------*/
.q-rugby ul.btnChoices li,
.q-rugby ul.btnChoices_correct li {
	border-color: #b41323;
}
.q-rugby ul.btnChoices li:hover {
	border-color: #e43244;
}

.q-rugby ul.btnChoices li.answer01,
.q-rugby ul.btnChoices_correct li.answer01 {
	background-image: url(../images/ico_choicesRD1.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-rugby ul.btnChoices li.answer01:hover {
	background-image: url(../images/ico_choicesRD1_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-rugby ul.btnChoices li.answer02,
.q-rugby ul.btnChoices_correct li.answer02 {
	background-image: url(../images/ico_choicesRD2.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-rugby ul.btnChoices li.answer02:hover {
	background-image: url(../images/ico_choicesRD2_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-rugby ul.btnChoices li.answer03,
.q-rugby ul.btnChoices_correct li.answer03 {
	background-image: url(../images/ico_choicesRD3.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-rugby ul.btnChoices li.answer03:hover {
	background-image: url(../images/ico_choicesRD3_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-rugby ul.btnChoices li.answer04,
.q-rugby ul.btnChoices_correct li.answer04 {
	background-image: url(../images/ico_choicesRD4.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}
.q-rugby ul.btnChoices li.answer04:hover {
	background-image: url(../images/ico_choicesRD4_on.png);
	background-position: 0.3em center;
	background-repeat: no-repeat;
}

/*------------------------------
   個別調整
--------------------------------*/
.number3 {
	display: inline !important;
	font-size: 108%;
	margin: 0 6px;
	vertical-align: baseline !important;
}


/* =================================
   スマホ横向き
================================== */
@media only screen and (max-device-width: 667px) and (orientation: landscape) {
ul.btnChoices li a {
	padding-left: 3em;
}

.boxCommentary p {
	font-size: 1.188em; /*19px*/
	margin: 1em 0;
}

img.certificationDeco {
	width: 95%;
}
.certificationTtl {
	margin-bottom: 2em;
}
.certificationTtl img {
	width: 62%;
}
.signKG {
	margin: 2em 0;
}
}

/* =================================
   タブレット・PC（min-width:768px）
================================== */
@media all and (min-width: 48.000em) {
.secQuestion,
.secWrong {
	margin-bottom: 3000px;
}
.secCorrect {
	margin-bottom: 300px;
}

ul.btnChoices li,
ul.btnChoices_correct li {
	font-size: 26px;
}

p.caption,
.note p,
.exceptionCap {
	font-size: 25px;
}

p.qTitle {
	background: url("../images/ttl_question.png") no-repeat scroll 50% 45% transparent;
}

}