/* ==========================================================================
  QUIZ PAGE
========================================================================== */


.main {
padding-bottom: 40px;
color: #333;
background: url("/parasports/assets/img/activities/quiz/bg_kv_01.png") no-repeat center top;
}



.iPhone ruby rt {
transform: translateY(0.5em);
}

@media all and (min-width: 2560px) {
.main {
background-size: 100% auto;
}
}

.kv {
max-width: 1366px;
margin: 0 auto;
padding: 40px 0 0;
}

.kv h2 img {
max-width: 100%;
}

.kv .lead {
margin: -130px 0 80px 200px;
font-size: 20px;
line-height: 1.8;
}

.kv__note-txt {
  text-indent: -1em;
  padding-left: 1em;
  display: block;
  font-size: .8em;
  margin-top: 10px;
  line-height: 2;
}

.challenge {
max-width: 1366px;
margin: 0 auto;
padding: 65px 0 0;
background: url("/parasports/assets/img/activities/quiz/ttl_challenge_01.png") no-repeat left top;
}

.challenge h3 {
margin: 0 0 28px;
font-size: 40px;
font-weight: 900;
text-align: center;
}

.challenge .box {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
width: 976px;
margin: 0 auto;
color: #fff;
}

.challenge .box li {
width: 470px;
height: 377px;
display: flex;
flex-direction: column;
justify-content: space-between;
padding: 125px 12px 22px;
background: url("/parasports/assets/img/activities/quiz/bg_challenge_01.png") no-repeat left top;
}

.challenge .box .archery {
background: url("/parasports/assets/img/activities/quiz/bg_challenge_02.png") no-repeat left top;
}

.challenge .box .rugby {
  background: url("/parasports/assets/img/activities/quiz/bg_challenge_03.png") no-repeat left top;
}

.challenge .box .goal-ball {
  background: url("/parasports/assets/img/activities/quiz/bg_challenge_04.png") no-repeat left top;
}

.challenge .box li:nth-of-type(n+3) {
  margin-top: 36px;
}

.challenge .box li h4 {
min-height: 115px;
margin: 0 0 20px 156px;
font-size: 32px;
font-weight: 900;
line-height: 1.2;
}

.challenge .box .archery h4 {
margin: 26px 0 8px 194px;
}

.challenge .box .rugby h4 {
  margin: 26px 0 8px 177px;
}

.challenge .box .goal-ball h4 {
  margin: 26px 0 8px 194px;
}

.challenge .box li h4 span {
display: block;
width: 45px;
margin: 0 0 3px;
padding: 1px 0 3px;
color: #ed362f;
font-size: 22px;
font-weight: 900;
line-height: 1;
text-align: center;
background: #fff;
border-radius: 8px;
}

.challenge .box .archery h4 span {
color: #12c0cd;
}

.challenge .box .rugby h4 span {
  color: #f5588a;
}

.challenge .box .goal-ball h4 span {
  color: #005494;
}

.challenge .box li .btn a {
display: block;
padding: 17px 0;
color: #ed362f;
font-size: 18px;
font-weight: 900;
text-align: center;
background: #fff url("/parasports/assets/img/activities/quiz/ico_arw_01.png") no-repeat right 30px center;
border-radius: 15px;
}

.challenge .box .archery .btn a {
color: #12c0cd;
background: #fff url("/parasports/assets/img/activities/quiz/ico_arw_02.png") no-repeat right 30px center;
}

.challenge .box .rugby .btn a {
  color: #f5588a;
  background: #fff url("/parasports/assets/img/activities/quiz/ico_arw_03.png") no-repeat right 30px center;
}

.challenge .box .goal-ball .btn a {
  color: #005494;
  background: #fff url("/parasports/assets/img/activities/quiz/ico_arw_04.png") no-repeat right 30px center;
}

@-moz-document url-prefix() {
.challenge .box li .btn a {
padding: 10px 0 11px;
}
}

/* IE */
@media all and (-ms-high-contrast: none) {
  .challenge .box li h4 {
    font-size: 34px;
    }
}

@media all and (max-width: 980px) {

.main {
background: url("/parasports/assets/img/activities/quiz/bg_kv_01_sp.png") no-repeat center top;
background-size: 100% auto;
}

.kv {
max-width: inherit;
margin: 0 auto;
padding: 10.666vw 0 0;
}

.kv .lead {
width: 92vw;
margin: 2.6666vw auto 14.6666vw;
font-size: 4.26666vw;
line-height: 2;
}

.challenge {
max-width: inherit;
margin: 0 auto;
padding: 7vw 0 0;
background: url("/parasports/assets/img/activities/quiz/ttl_challenge_01.png") no-repeat left top;
background-size: 98.2666vw auto;
}

.challenge h3 {
margin: 0 0 7vw;
font-size: 6.13333vw;
line-height: 1.6;
}

.challenge .box {
display: block;
width: inherit;
}

.challenge .box li {
width: 92vw;
margin: 0 auto;
padding: 28.8vw 2.933vw 4.2666vw;
background: url("/parasports/assets/img/activities/quiz/bg_challenge_01_sp.png") no-repeat left top;
background-size: 100% auto;
}

.challenge .box .basket {
height: 71.4vw;
padding-top: 24vw;
}

.challenge .box .archery {
height: 69.6vw;
margin: 4.8vw auto 0;
background: url("/parasports/assets/img/activities/quiz/bg_challenge_02_sp.png") no-repeat left top;
background-size: 100% auto;
}

.challenge .box .rugby {
  height: 69.6vw;
  margin: 4.8vw auto 0;
  background: url("/parasports/assets/img/activities/quiz/bg_challenge_03_sp.png") no-repeat left top;
  background-size: 100% auto;
}

.challenge .box .goal-ball {
  height: 69.6vw;
  margin: 4.8vw auto 0;
  background: url("/parasports/assets/img/activities/quiz/bg_challenge_04_sp.png") no-repeat left top;
  background-size: 100% auto;
}

.challenge .box li h4 {
min-height: inherit;
margin: 0 0 0 34.4666vw;
font-size: 6.4vw;
}

.challenge .box li h4 ruby > rt {
font-size: 40%;
}

.iPhone ruby rt {
  font-size: 50%;
  transform: translateY(0.5em);
}

.challenge .box .archery h4 {
margin: 0 0 0 34.4666vw;
}

.challenge .box .rugby h4 {
  margin: 0 0 0 34.4666vw;
}

.challenge .box .goal-ball h4 {
  margin: 0 0 0 34.4666vw;
}

.challenge .box li h4 span {
width: 7.7333vw;
margin: 0 0 1vw;
padding: 0;
font-size: 3.733vw;
line-height: 1.5;
border-radius: 1.33vw;
}

.challenge .box li .btn a {
padding: 3.4666vw 0;
font-size: 4.2666vw;
background: #fff url("/parasports/assets/img/activities/quiz/ico_arw_01.png") no-repeat right 3.733vw center;
background-size: 2.666vw auto;
border-radius: 1.8666vw;
}

.challenge .box .archery .btn a {
background: #fff url("/parasports/assets/img/activities/quiz/ico_arw_02.png") no-repeat right 3.733vw center;
background-size: 2.666vw auto;
}

}

.t-ruby rb{
  position: relative;
  display: inline-block;
}
.t-ruby rb::before{
  content: attr(data-rb);
  position: absolute;
  top: -0.4em;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.5em;
  text-align: center;
  white-space: nowrap;
  line-height: 1;
  text-indent: 0;
}
.t-ruby rt{
  display: none;
}
.challenge ul li .btn .t-ruby rb::before{
  top: -0.8em;
}

/* IE */
@media all and (-ms-high-contrast: none) {
  .t-ruby rb::before{
    /* top: -1em; */
  }
}
/* FB */
@-moz-document url-prefix() {
  .t-ruby rb::before{
    top: -1em;
  }
  .challenge ul li .btn .t-ruby rb::before{
    top: -0.7em;
  }

}
/* SF */
_::-webkit-full-page-media, _:future, :root .t-ruby rb::before {
  top: -0.9em;
}
@media screen and (min-width: 981px) {
  _::-webkit-full-page-media, _:future, :root .result .answerList ul li .lead .t-ruby rb::before {
    top: -1em;
  }
}
@media screen and (max-width: 980px) {
  _::-webkit-full-page-media, _:future, :root .t-ruby rb::before {
    top: -0.5em;
  }
}