/*プレゼントクイズ*/
h2{height:auto; margin: 0 auto 0;}
h2.title span {
  display: block;
  position: relative;
background-size: 100%; background-repeat: no-repeat;
}

#quizBlock {padding:30px 40px 0;}

.read {color: #e50505; font-weight: bold; line-height: 2.0em; padding: 0.5em 0;}
#quizBlock h4 { text-align: center; font-size: 1.3em; line-height: 1.5em; padding:0.5em 1em 1em;}

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

#quizArea { border: solid 3px #000; padding:1.5em 1em 1em; margin: 1em 0; text-align: center; position: relative;}
.quizTxt span {
	background-repeat: no-repeat;
	background-position:top left;
	background-image: url(../img/quiz/icon_q.png);
	text-align: center;
	display: inline-block;
	font-size: 1.6em;
	font-weight: bold;
	line-height: 1.5em;
}
.answerTxt {
	text-align: center;
	 margin:0; padding: 2em 0;
font-size: 1.2em; font-weight: bold;
	line-height: 1.2em;
	background-color: #fefd02;
}
.answerTxt span {
	font-size: 1.6em;
	font-family: tbudgothic-std, sans-serif;
font-style: normal;
font-weight: 900;
	line-height: 1.4em;
}

#quiz .epnum { background-repeat: no-repeat; background-size: contain; display: inline-block; vertical-align: middle;  width:97px; height: 97px; text-indent: -9999px; position: absolute; top:-3px; left: -3px;}
.quiz1 .epnum {background-image: url(../img/ep01.png);}
.quiz2 .epnum {background-image: url(../img/ep02.png);}
.quiz3 .epnum {background-image: url(../img/ep03.png);}
.quiz4 .epnum {background-image: url(../img/ep04.png);}
.quiz5 .epnum {background-image: url(../img/ep05.png);}
.quiz6 .epnum {background-image: url(../img/ep06.png);}
.quiz7 .epnum {background-image: url(../img/ep07.png);}
.quiz8 .epnum {background-image: url(../img/ep08.png);}
.quiz9 .epnum {background-image: url(../img/ep09.png);}
.quiz10 .epnum {background-image: url(../img/ep10.png);}

#quiz {}
#quiz div {
background-color: #eaeaea; margin:5px 0 20px; padding: 1em 0.1em;
}

#quiz div ul { display: inline-block;text-align: left;}
#quiz div ul li {background-repeat: no-repeat; background-position: left center; min-height: 28px; font-size: 1.4em; font-weight: bold; padding-left: 45px; margin: 10px 0; }
#quiz div ul li.aswA {background-image:url(../img/quiz/icon_a.png);}
#quiz div ul li.aswB {background-image:url(../img/quiz/icon_b.png);}
#quiz div ul li.aswC {background-image:url(../img/quiz/icon_c.png);}

p.btn a {
display: block;
border: solid 4px #000; background-color: #fff;
width: 314px;
height: 65px;
margin: 0 auto;
}
p.btn a span {
  display: block;
background-position: center center;
background-size: contain;
background-repeat: no-repeat;
background-image: url(../img/quiz/btn_quiz.png);
width: 314px;
height: 65px;
text-indent: -9999px;
}

.end {text-align: center; line-height: 1.5em; margin: 2em 0; color: #e60012; font-weight: bold;}

.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.2em; 
font-family: tbudgothic-std, sans-serif;
font-style: normal;
font-weight: 900;
margin-right: 0.4em; display: inline-block;}
#bknm dl dd {font-size: 1.2em; vertical-align: middle; font-weight: bold;}
#bknm dl dd span { 
font-size: 0.8em; 
font-family: tbudgothic-std, sans-serif;
font-style: normal;
font-weight: 900;
color:#000; padding: 0 0.5em; background: #fefd02; text-align: center; margin-right: 0.8em; display: inline-block;}


@media all and (min-width: 768px) {
	h2.title,
	h2.title span {
    width: 972px;
    height: 300px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
  }
	h2.title span.sp { display: none;}
	
.read { font-size: 1.1em;}
	
	.quizTxt span {
	padding: 5px 0 0px 70px;
	margin-bottom: 20px;
	min-height: 54px;
}
}

@media all and (max-width: 767px) {
	#contents {
    padding-top: 2.4%;
}
	.low div.wrap {
    margin: 0 2.4% 2.4%;
}

#quizBlock {padding:1em 1em 0;}
#quizBlock h4 {padding: 0.5em 0em; font-size: 1.1em;}
#quizArea { padding:1em 0.5em 0.5em;}
	
#quiz .epnum { width:60px; height: 60px;}
	
.quizTxt span {
	background-position:top center;
	padding: 50px 0 15px 0;
	display: block;
	font-size: 1.3em;
	line-height: 1.3em;
}
	
	.answerTxt { padding: 1.0em 0.5em;}
	.answerTxt span { display: block; padding-top: 0.2em;}
	
	#quiz div ul li { font-size: 1.1em; padding-left: 40px; line-height: 1.8em;}
	
	

p.btn a {
width:210px; height: 50px;
margin: 0 auto 1em;}
p.btn a span {
background-image: url(../img/quiz/btn_quiz_sp.png);
width:210px; height: 50px;}
	
#bknm div { padding:0 1em;}
}

@media all and (min-width: 501px)  and (max-width: 767px) {

	h2.title span img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
	h2.title span { height: 0;
    padding: 30.864% 0 0;
    position: relative;
  }
	h2.title span.sp { display: none;}
}

@media all and (max-width: 500px) {
	h2{height:auto;
		margin: 0 auto 0;}
	h2.title span img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
	h2.title span { height: 0;
    padding: 72.559% 0 0;
    position: relative;
  }
	h2 span.pc { display: none;}
	
	.answerTxt span { font-size: 1.4em;}
	
	#quiz div  { padding: 0.5em 0.1em;}
	#quiz div ul li { background-size: 24px 24px; min-height: 24px; padding-left: 30px;}
	
}