/*放送後30分限定プレゼントクイズ*/
.quiz h2#read {
background-color: #000;
background-repeat: no-repeat;
background-position: center ;
background-image: url(../img/quiz/h2.png);
background-size: contain;
width: 100%;
height: 0;
padding-top: 31.632%;
text-indent: -9999px;
margin: 0 auto;
}

.quizBlock {padding:15px 40px 0px;}

.read { padding: 1em;}
.read p { text-align: center; line-height: 1.5em; font-size: 1.1em; }
.quizBlock h3 { text-align: center; font-size: 1.6em; line-height: 1.5em; padding: 0px 0 0.5em; color: #e40515;}
.quizBlock h4 { text-align: center; font-size: 1.3em; line-height: 1.5em; padding: 1em 0 2em;}

.notes {
    font-size: 0.9em;
    line-height: 1.8em;
}

#quizArea { border: double 3px #d7ac00; padding: 2em 1em; margin: 1em 0; text-align: center; position: relative;}
.quizTxt span {
	background-repeat: no-repeat;
	background-position:center left;
	background-image: url(../img/quiz/icon_q.png);
	text-align: center;
	padding: 15px 0 15px 65px;
	min-height: 44px;
	display: inline-block;
	font-size: 1.5em;
	font-weight: bold;
	line-height: 1.3em;
}
.answerTxt span {
	background-repeat: no-repeat;
	background-position:15px center;
	background-image: url(../img/quiz/icon_a.png);
	text-align: center;
	padding: 10px 25px 5px 85px;
	margin-bottom: 15px;
	min-height: 23px;
	display: inline-block;
	font-size: 1.8em;
	font-weight: bold;
	line-height: 1.2em;
	 border-bottom: dotted 2px #000; 
}

#quiz .epnum { background-repeat: no-repeat; background-size: contain; display: inline-block; vertical-align: middle;  width:50px; height: 50px; text-indent: -9999px; position: absolute; top:-25px; left: 50%; margin-left: -25px;}
.quiz1 .epnum {background-image: url(../img/bkn01.png);}
.quiz2 .epnum {background-image: url(../img/bkn02.png);}
.quiz3 .epnum {background-image: url(../img/bkn03.png);}
.quiz4 .epnum {background-image: url(../img/bkn04.png);}
.quiz5 .epnum {background-image: url(../img/bkn05.png);}
.quiz6 .epnum {background-image: url(../img/bkn06.png);}
.quiz7 .epnum {background-image: url(../img/bkn07.png);}
.quiz8 .epnum {background-image: url(../img/bkn08.png);}
.quiz9 .epnum {background-image: url(../img/bkn09.png);}
.quiz10 .epnum {background-image: url(../img/bkn10.png);}

p.btn a { width: 300px;margin: 0 auto;}
p.btn a span {background-image: url(../img/quiz/btn_quiz.png); height: 60px; background-position: center center; }

.end {text-align: center; line-height: 1.5em; margin-bottom: 2em;}

.quiz #bknm { padding: 30px 0;}
#bknm h3 { margin-bottom: 15px!important;}
#bknm div { padding: 0px 40px;}
#bknm dl {padding: 10px; border-bottom: dotted 2px #000; }
#bknm dl dt, #bknm dl dd { padding: 5px; line-height: 1.6em;}
#bknm dl dt span { 
font-size: 1.1em; 
font-weight: bold;
color: #9f000b; margin-right: 0.4em; display: inline-block;}
#bknm dl dd {font-size: 1.2em; vertical-align: middle;}
#bknm dl dd span { 
font-size: 0.8em; 
font-family: vdl-megag, sans-serif;
font-style: normal;
font-weight: bold;
color:#fff; padding: 0 0.5em; background: #9f000b; text-align: center; margin-right: 0.8em; display: inline-block;}

@media all and (min-width: 768px) {

}


@media all and (max-width: 767px) {
.quizBlock {padding:0 1em;}

.quizBlock h3 {font-size: 1.3em; }
.quizBlock h4 {font-size: 1.1em;}
	
#quizArea {padding: 2em 1em 1em; }
	
p.btn a { width: 100% ; max-width: 330px; margin: 0 auto; height: 60px;}

#bknm div { padding:0 1em;}
}

@media all and (max-width: 500px) {
	.quiz h2#read {
		background-image: url(../img/quiz/h2_sp.png);
		padding-top: 83.333%;
	}
	.quizTxt span {
    font-size: 1.3em;
}
	.answerTxt span {
	font-size: 1.5em;
	padding: 10px 0px 5px 70px;
}
}

@media all and (max-width: 350px) {	
	#quizArea {
    padding: 2em 0.5em 0.5em;
}
	.quizTxt span {
    font-size: 1.2em;
}

	p.btn a span {
		background-size: 90%;
}
	
}