.toolbar .title { background-image: url(img/title.png); }

.page-nav {
  width: 1.2rem;
  height: 1.2rem;
  bottom: .75rem;
  z-index: 2;
  border-radius: 50%;
  background: center / .76rem auto url(img/page-nav-arrow.png) #008cc2 no-repeat;
}
.page-nav:disabled { background-color: #b5b5b6; }

.page-nav[data-action="prev"] {
  right: .88rem;
  transform: scale(-1, 1);
}
.page-nav[data-action="next"] {
  left: .58rem;
}
.text { background-image: url(img/text.png); }

.sentence {
  top: .25rem;
  border: .04rem solid transparent;
}
[data-answer-shown] .sentence {
  border-color: #000;
  background-color: #fff;
}

.number {
  display: none;
  width: .54rem;
  height: .54rem;
  right: 5.55rem;
  z-index: 1;
  background: center / cover no-repeat;
}
[data-page][data-answer-shown] .number,
[data-page][data-state="cleared"] .number,
.number[data-order-passed] { display: block; }
.number[data-order-correct="1"] { background-image: url(img/number-1.png); }
.number[data-order-correct="2"] { background-image: url(img/number-2.png); }
.number[data-order-correct="3"] { background-image: url(img/number-3.png); }
.number[data-order-correct="4"] { background-image: url(img/number-4.png); }
.number[data-order-correct="5"] { background-image: url(img/number-5.png); }
.number[data-order-correct="6"] { background-image: url(img/number-6.png); }
.number[data-order-correct="7"] { background-image: url(img/number-7.png); }
.number[data-order-correct="8"] { background-image: url(img/number-8.png); }

.order {
  width: 2.5rem;
  height: 1.8rem;
  right: 3rem;
  background: #000;
  opacity: 0;
}
[data-page][data-state="cleared"] .order,
[data-page][data-state="retry"] .order,
[data-page][data-answer-shown] .order { pointer-events: none; }

[data-page][data-state="cleared"] .cleared {
  width: 2.08rem;
  height: 2.22rem;
  left: .32rem;
  top: .54rem;
  z-index: 1;
  background-image: url(img/circle.png);
}
[data-page]:not([data-state="cleared"]) .cleared { display: none; }

.sentence {
  width: 6.38rem;
  right: 1.46rem;
  background-size: 2.33rem auto;
  background-position: 2.2rem .38rem;
}

.large .number {
  width: .71rem;
  height: .71rem;
  right: 5.66rem;
}
.large .number[data-order-correct="1"] { background-image: url(img/number-l-1.png); }
.large .number[data-order-correct="2"] { background-image: url(img/number-l-2.png); }
.large .number[data-order-correct="3"] { background-image: url(img/number-l-3.png); }
.large .number[data-order-correct="4"] { background-image: url(img/number-l-4.png); }
.large .order {
  width: 2.8rem;
  height: 2.8rem;
  right: 2.8rem;
}
.large .sentence {
  width: 5.7rem;
  right: 1.68rem;
  background-size: 3.03rem auto;
  background-position: 1.5rem .54rem;
}

.small .number {
  width: .47rem;
  height: .47rem;
  right: 5.45rem;
}
.small .number[data-num="1"] { top: 1.95rem; }
.small .number[data-num="2"] { top: calc(1.95rem + 1.65rem); }
.small .number[data-num="3"] { top: calc(1.95rem + 1.65 * 2rem); }
.small .number[data-num="4"] { top: calc(1.95rem + 1.65 * 3rem); }
.small .number[data-num="5"] { top: calc(1.95rem + 1.65 * 4rem); }
.small .number[data-num="6"] { top: calc(1.95rem + 1.65 * 5rem); }
.small .number[data-num="7"] { top: calc(1.95rem + 1.65 * 6rem); }
.small .number[data-num="8"] { top: calc(1.95rem + 1.65 * 7rem); }
.small .number[data-order-correct="1"] { background-image: url(img/number-s-1.png); }
.small .number[data-order-correct="2"] { background-image: url(img/number-s-2.png); }
.small .number[data-order-correct="3"] { background-image: url(img/number-s-3.png); }
.small .number[data-order-correct="4"] { background-image: url(img/number-s-4.png); }
.small .number[data-order-correct="5"] { background-image: url(img/number-s-5.png); }
.small .number[data-order-correct="6"] { background-image: url(img/number-s-6.png); }
.small .number[data-order-correct="7"] { background-image: url(img/number-s-7.png); }
.small .number[data-order-correct="8"] { background-image: url(img/number-s-8.png); }
.small .number[data-order-correct="9"] { background-image: url(img/number-s-9.png); }
.small .number[data-order-correct="10"] { background-image: url(img/number-s-10.png); }
.small .number[data-order-correct="11"] { background-image: url(img/number-s-11.png); }
.small .number[data-order-correct="x"] { background-color: #c83c7c; }
[data-answer-shown] .number[data-order-correct2],
.small [data-order-correct2][data-order-passed="2"] {
  width: .86rem;
  height: .48rem;
  right: calc(5.78rem - .19rem);
  background-position: .46rem 0, 0 0;
  background-size: .4rem auto, .4rem auto;
}
[data-answer-shown] .number[data-order-correct="1"][data-order-correct2="6"],
.number[data-order-correct="1"][data-order-correct2="6"][data-order-passed="2"] {
  background-image: url(img/number-h-1.png), url(img/number-h-6.png);
}
[data-answer-shown] .number[data-order-correct="1"][data-order-correct2="5"],
.number[data-order-correct="1"][data-order-correct2="5"][data-order-passed="2"] {
  background-image: url(img/number-h-1.png), url(img/number-h-5.png);
}
[data-answer-shown] .number[data-order-correct="3"][data-order-correct2="6"],
.number[data-order-correct="3"][data-order-correct2="6"][data-order-passed="2"] {
  background-image: url(img/number-h-3.png), url(img/number-h-6.png);
}
[data-answer-shown] .number[data-order-correct="7"][data-order-correct2="9"],
.number[data-order-correct="7"][data-order-correct2="9"][data-order-passed="2"] {
  background-image: url(img/number-h-7.png), url(img/number-h-9.png);
}
[data-answer-shown] .number[data-order-correct="6"][data-order-correct2="11"],
.number[data-order-correct="6"][data-order-correct2="11"][data-order-passed="2"] {
  background-image: url(img/number-h-6.png), url(img/number-h-11.png);
}
[data-answer-shown] .number[data-order-correct="2"][data-order-correct2="5"],
.number[data-order-correct="2"][data-order-correct2="5"][data-order-passed="2"] {
  background-image: url(img/number-h-2.png), url(img/number-h-5.png);
}
[data-answer-shown] .number[data-order-correct="4"][data-order-correct2="8"],
.number[data-order-correct="4"][data-order-correct2="8"][data-order-passed="2"] {
  background-image: url(img/number-h-4.png), url(img/number-h-8.png);
}
[data-answer-shown] .number[data-order-correct="5"][data-order-correct2="8"],
.number[data-order-correct="5"][data-order-correct2="8"][data-order-passed="2"] {
  background-image: url(img/number-h-5.png), url(img/number-h-8.png);
}

.small .order {
  width: 2.2rem;
  height: 1.56rem;
  right: 3.24rem;
}
.small .order[data-num="1"] { top: 1.57rem; }
.small .order[data-num="2"] { top: calc(1.57rem + 1.65rem); }
.small .order[data-num="3"] { top: calc(1.57rem + 1.65 * 2rem); }
.small .order[data-num="4"] { top: calc(1.57rem + 1.65 * 3rem); }
.small .order[data-num="5"] { top: calc(1.57rem + 1.65 * 4rem); }
.small .order[data-num="6"] { top: calc(1.57rem + 1.65 * 5rem); }
.small .order[data-num="7"] { top: calc(1.57rem + 1.65 * 6rem); }
.small .order[data-num="8"] { top: calc(1.57rem + 1.65 * 7rem); }

.s1-1 .sentence {
  height: 6.7rem;
  top: 2.74rem;
  background-image: url(img/1-1-sentence.png);
}
.s1-1 .number[data-num="1"] { top: 3.78rem; }
.s1-1 .number[data-num="2"] { top: calc(3.78rem + 3.32rem); }

.s1-1 .order[data-num="1"] { top: 3rem; }
.s1-1 .order[data-num="2"] { top: calc(3rem + 3.32rem); }

.s1-2 .sentence {
  height: 10.22rem;
  top: 2.04rem;
  background-image: url(img/1-2-sentence.png);
}
.s1-2 .number[data-num="1"] { top: 3.12rem; }
.s1-2 .number[data-num="2"] { top: calc(3.12rem + 3.36rem); }
.s1-2 .number[data-num="3"] { top: calc(3.12rem + 3.36 * 2rem); }
.s1-2 .order[data-num="1"] { top: 2.4rem; }
.s1-2 .order[data-num="2"] { top: calc(2.4rem + 3.36rem); }
.s1-2 .order[data-num="3"] { top: calc(2.4rem + 3.36 * 2rem); }

.s1-3 .sentence {
  height: 13.48rem;
  top: 1.02rem;
  background-image: url(img/1-3-sentence.png);
}
.s1-3 .number[data-num="1"] { top: 2.1rem; }
.s1-3 .number[data-num="2"] { top: calc(2.1rem + 3.36rem); }
.s1-3 .number[data-num="3"] { top: calc(2.1rem + 3.36 * 2rem); }
.s1-3 .number[data-num="4"] { top: calc(2.1rem + 3.36 * 3rem); }
.s1-3 .order[data-num="1"] { top: 1.38rem; }
.s1-3 .order[data-num="2"] { top: calc(1.38rem + 3.36rem); }
.s1-3 .order[data-num="3"] { top: calc(1.38rem + 3.36 * 2rem); }
.s1-3 .order[data-num="4"] { top: calc(1.38rem + 3.36 * 3rem); }

.s2-1 .sentence {
  height: calc(.6rem + 13.97rem);
  background-image: url(img/2-1-sentence.png);
}
.s2-1 .number[data-num="1"] { top: 1rem; }
.s2-1 .number[data-num="2"] { top: calc(1rem + 2.02rem); }
.s2-1 .number[data-num="3"] { top: calc(1rem + 2.02 * 2rem); }
.s2-1 .number[data-num="4"] { top: calc(1rem + 2.02 * 3rem); }
.s2-1 .number[data-num="5"] { top: calc(1rem + 2.02 * 4rem); }
.s2-1 .number[data-num="6"] { top: calc(1rem + 2.02 * 5rem); }
.s2-1 .number[data-num="7"] { top: calc(1rem + 2.02 * 6rem); }
.s2-1 .order[data-num="1"] { top: .6rem; }
.s2-1 .order[data-num="2"] { top: calc(.6rem + 2.02rem); }
.s2-1 .order[data-num="3"] { top: calc(.6rem + 2.02 * 2rem); }
.s2-1 .order[data-num="4"] { top: calc(.6rem + 2.02 * 3rem); }
.s2-1 .order[data-num="5"] { top: calc(.6rem + 2.02 * 4rem); }
.s2-1 .order[data-num="6"] { top: calc(.6rem + 2.02 * 5rem); }
.s2-1 .order[data-num="7"] { top: calc(.6rem + 2.02 * 6rem); }

.s2-2 .sentence {
  height: calc(.6rem + 9.93rem);
  top: 1.86rem;
  background-image: url(img/2-2-sentence.png);
}
.s2-2 .number[data-num="1"] { top: 2.61rem; }
.s2-2 .number[data-num="2"] { top: calc(2.61rem + 2.02rem); }
.s2-2 .number[data-num="3"] { top: calc(2.61rem + 2.02 * 2rem); }
.s2-2 .number[data-num="4"] { top: calc(2.61rem + 2.02 * 3rem); }
.s2-2 .number[data-num="5"] { top: calc(2.61rem + 2.02 * 4rem); }
.s2-2 .order[data-num="1"] { top: 2.21rem; }
.s2-2 .order[data-num="2"] { top: calc(2.21rem + 2.02rem); }
.s2-2 .order[data-num="3"] { top: calc(2.21rem + 2.02 * 2rem); }
.s2-2 .order[data-num="4"] { top: calc(2.21rem + 2.02 * 3rem); }
.s2-2 .order[data-num="5"] { top: calc(2.21rem + 2.02 * 4rem); }

.s2-3 .sentence {
  height: calc(.6rem + 13.97rem);
  background-size: 2.72rem auto;
  background-image: url(img/2-3-sentence.png);
}
.s2-3 .number[data-num="1"] { top: 1rem; }
.s2-3 .number[data-num="2"] { top: calc(1rem + 2.02rem); }
.s2-3 .number[data-num="3"] { top: calc(1rem + 2.02 * 2rem); }
.s2-3 .number[data-num="4"] { top: calc(1rem + 2.02 * 3rem); }
.s2-3 .number[data-num="5"] { top: calc(1rem + 2.02 * 4rem); }
.s2-3 .number[data-num="6"] { top: calc(1rem + 2.02 * 5rem); }
.s2-3 .number[data-num="7"] { top: calc(1rem + 2.02 * 6rem); }
.s2-3 .order[data-num="1"] { top: .6rem; }
.s2-3 .order[data-num="2"] { top: calc(.6rem + 2.02rem); }
.s2-3 .order[data-num="3"] { top: calc(.6rem + 2.02 * 2rem); }
.s2-3 .order[data-num="4"] { top: calc(.6rem + 2.02 * 3rem); }
.s2-3 .order[data-num="5"] { top: calc(.6rem + 2.02 * 4rem); }
.s2-3 .order[data-num="6"] { top: calc(.6rem + 2.02 * 5rem); }
.s2-3 .order[data-num="7"] { top: calc(.6rem + 2.02 * 6rem); }

.s2-4 .sentence {
  height: calc(.6rem + 16rem);
  background-image: url(img/2-4-sentence.png);
}
.s2-4 .number[data-num="1"] { top: 1rem; }
.s2-4 .number[data-num="2"] { top: calc(1rem + 2.02rem); }
.s2-4 .number[data-num="3"] { top: calc(1rem + 2.02 * 2rem); }
.s2-4 .number[data-num="4"] { top: calc(1rem + 2.02 * 3rem); }
.s2-4 .number[data-num="5"] { top: calc(1rem + 2.02 * 4rem); }
.s2-4 .number[data-num="6"] { top: calc(1rem + 2.02 * 5rem); }
.s2-4 .number[data-num="7"] { top: calc(1rem + 2.02 * 6rem); }
.s2-4 .number[data-num="8"] { top: calc(1rem + 2.02 * 7rem); }
.s2-4 .order[data-num="1"] { top: .6rem; }
.s2-4 .order[data-num="2"] { top: calc(.6rem + 2.02rem); }
.s2-4 .order[data-num="3"] { top: calc(.6rem + 2.02 * 2rem); }
.s2-4 .order[data-num="4"] { top: calc(.6rem + 2.02 * 3rem); }
.s2-4 .order[data-num="5"] { top: calc(.6rem + 2.02 * 4rem); }
.s2-4 .order[data-num="6"] { top: calc(.6rem + 2.02 * 5rem); }
.s2-4 .order[data-num="7"] { top: calc(.6rem + 2.02 * 6rem); }
.s2-4 .order[data-num="8"] { top: calc(.6rem + 2.02 * 7rem); }

.s2-5 .sentence {
  height: calc(.6rem + 16rem);
  background-image: url(img/2-5-sentence.png);
}
.s2-5 .number[data-num="1"] { top: 1rem; }
.s2-5 .number[data-num="2"] { top: calc(1rem + 2.02rem); }
.s2-5 .number[data-num="3"] { top: calc(1rem + 2.02 * 2rem); }
.s2-5 .number[data-num="4"] { top: calc(1rem + 2.02 * 3rem); }
.s2-5 .number[data-num="5"] { top: calc(1rem + 2.02 * 4rem); }
.s2-5 .number[data-num="6"] { top: calc(1rem + 2.02 * 5rem); }
.s2-5 .number[data-num="7"] { top: calc(1rem + 2.02 * 6rem); }
.s2-5 .number[data-num="8"] { top: calc(1rem + 2.02 * 7rem); }
.s2-5 .order[data-num="1"] { top: .6rem; }
.s2-5 .order[data-num="2"] { top: calc(.6rem + 2.02rem); }
.s2-5 .order[data-num="3"] { top: calc(.6rem + 2.02 * 2rem); }
.s2-5 .order[data-num="4"] { top: calc(.6rem + 2.02 * 3rem); }
.s2-5 .order[data-num="5"] { top: calc(.6rem + 2.02 * 4rem); }
.s2-5 .order[data-num="6"] { top: calc(.6rem + 2.02 * 5rem); }
.s2-5 .order[data-num="7"] { top: calc(.6rem + 2.02 * 6rem); }
.s2-5 .order[data-num="8"] { top: calc(.6rem + 2.02 * 7rem); }

.s2-6 .sentence {
  height: calc(.6rem + 11.94rem);
  top: 1.86rem;
  background-image: url(img/2-6-sentence.png);
}
.s2-6 .number[data-num="1"] { top: 2.61rem; }
.s2-6 .number[data-num="2"] { top: calc(2.61rem + 2.02rem); }
.s2-6 .number[data-num="3"] { top: calc(2.61rem + 2.02 * 2rem); }
.s2-6 .number[data-num="4"] { top: calc(2.61rem + 2.02 * 3rem); }
.s2-6 .number[data-num="5"] { top: calc(2.61rem + 2.02 * 4rem); }
.s2-6 .number[data-num="6"] { top: calc(2.61rem + 2.02 * 5rem); }
.s2-6 .order[data-num="1"] { top: 2.21rem; }
.s2-6 .order[data-num="2"] { top: calc(2.21rem + 2.02rem); }
.s2-6 .order[data-num="3"] { top: calc(2.21rem + 2.02 * 2rem); }
.s2-6 .order[data-num="4"] { top: calc(2.21rem + 2.02 * 3rem); }
.s2-6 .order[data-num="5"] { top: calc(2.21rem + 2.02 * 4rem); }
.s2-6 .order[data-num="6"] { top: calc(2.21rem + 2.02 * 5rem); }

.s2-7 .sentence {
  height: calc(.6rem + 16rem);
  background-image: url(img/2-7-sentence.png);
}
.s2-7 .number[data-num="1"] { top: 1rem; }
.s2-7 .number[data-num="2"] { top: calc(1rem + 2.02rem); }
.s2-7 .number[data-num="3"] { top: calc(1rem + 2.02 * 2rem); }
.s2-7 .number[data-num="4"] { top: calc(1rem + 2.02 * 3rem); }
.s2-7 .number[data-num="5"] { top: calc(1rem + 2.02 * 4rem); }
.s2-7 .number[data-num="6"] { top: calc(1rem + 2.02 * 5rem); }
.s2-7 .number[data-num="7"] { top: calc(1rem + 2.02 * 6rem); }
.s2-7 .number[data-num="8"] { top: calc(1rem + 2.02 * 7rem); }
.s2-7 .order[data-num="1"] { top: .6rem; }
.s2-7 .order[data-num="2"] { top: calc(.6rem + 2.02rem); }
.s2-7 .order[data-num="3"] { top: calc(.6rem + 2.02 * 2rem); }
.s2-7 .order[data-num="4"] { top: calc(.6rem + 2.02 * 3rem); }
.s2-7 .order[data-num="5"] { top: calc(.6rem + 2.02 * 4rem); }
.s2-7 .order[data-num="6"] { top: calc(.6rem + 2.02 * 5rem); }
.s2-7 .order[data-num="7"] { top: calc(.6rem + 2.02 * 6rem); }
.s2-7 .order[data-num="8"] { top: calc(.6rem + 2.02 * 7rem); }

.s3-1 .sentence {
  height: calc(.6rem + 14.86rem);
  background-size: 2.34rem auto;
  background-position: 2.32rem .38rem;
  background-image: url(img/3-1-sentence.png);
}
.s3-1 .number[data-num="1"] { top: 1rem; }
.s3-1 .number[data-num="2"] { top: calc(1rem + 1.65rem); }
.s3-1 .number[data-num="3"] { top: calc(1rem + 1.65 * 2rem); }
.s3-1 .number[data-num="4"] { top: calc(1rem + 1.65 * 3rem); }
.s3-1 .number[data-num="5"] { top: calc(1rem + 1.65 * 4rem); }
.s3-1 .number[data-num="6"] { top: calc(1rem + 1.65 * 5rem); }
.s3-1 .number[data-num="7"] { top: calc(1rem + 1.65 * 6rem); }
.s3-1 .number[data-num="8"] { top: calc(1rem + 1.65 * 7rem); }
.s3-1 .number[data-num="9"] { top: calc(1rem + 1.65 * 8rem); }
.s3-1 .order[data-num="1"] { top: .62rem; }
.s3-1 .order[data-num="2"] { top: calc(.62rem + 1.65rem); }
.s3-1 .order[data-num="3"] { top: calc(.62rem + 1.65 * 2rem); }
.s3-1 .order[data-num="4"] { top: calc(.62rem + 1.65 * 3rem); }
.s3-1 .order[data-num="5"] { top: calc(.62rem + 1.65 * 4rem); }
.s3-1 .order[data-num="6"] { top: calc(.62rem + 1.65 * 5rem); }
.s3-1 .order[data-num="7"] { top: calc(.62rem + 1.65 * 6rem); }
.s3-1 .order[data-num="8"] { top: calc(.62rem + 1.65 * 7rem); }
.s3-1 .order[data-num="9"] { top: calc(.62rem + 1.65 * 8rem); }

.s3-2 .sentence {
  height: calc(.1rem + 16.61rem);
  background-size: 2rem auto;
  background-position: 2.4rem .08rem;
  background-image: url(img/3-2-sentence.png);
}
.s3-2 .number[data-num="1"] { top: .7rem; }
.s3-2 .number[data-num="2"] { top: calc(.7rem + 1.51rem); }
.s3-2 .number[data-num="3"] { top: calc(.7rem + 1.51 * 2rem); }
.s3-2 .number[data-num="4"] { top: calc(.7rem + 1.51 * 3rem); }
.s3-2 .number[data-num="5"] { top: calc(.7rem + 1.51 * 4rem); }
.s3-2 .number[data-num="6"] { top: calc(.7rem + 1.51 * 5rem); }
.s3-2 .number[data-num="7"] { top: calc(.7rem + 1.51 * 6rem); }
.s3-2 .number[data-num="8"] { top: calc(.7rem + 1.51 * 7rem); }
.s3-2 .number[data-num="9"] { top: calc(.7rem + 1.51 * 8rem); }
.s3-2 .number[data-num="10"] { top: calc(.7rem + 1.51 * 9rem); }
.s3-2 .number[data-num="11"] { top: calc(.7rem + 1.51 * 10rem); }
.s3-2 .order { height: 1.4rem; }
.s3-2 .order[data-num="1"] { top: .35rem; }
.s3-2 .order[data-num="2"] { top: calc(.35rem + 1.51rem); }
.s3-2 .order[data-num="3"] { top: calc(.35rem + 1.51 * 2rem); }
.s3-2 .order[data-num="4"] { top: calc(.35rem + 1.51 * 3rem); }
.s3-2 .order[data-num="5"] { top: calc(.35rem + 1.51 * 4rem); }
.s3-2 .order[data-num="6"] { top: calc(.35rem + 1.51 * 5rem); }
.s3-2 .order[data-num="7"] { top: calc(.35rem + 1.51 * 6rem); }
.s3-2 .order[data-num="8"] { top: calc(.35rem + 1.51 * 7rem); }
.s3-2 .order[data-num="9"] { top: calc(.35rem + 1.51 * 8rem); }
.s3-2 .order[data-num="10"] { top: calc(.35rem + 1.51 * 9rem); }
.s3-2 .order[data-num="11"] { top: calc(.35rem + 1.51 * 10rem); }

.s3-3 .sentence {
  height: calc(.6rem + 13.21rem);
  top: 1.2rem;
  background-size: 2.12rem auto;
  background-position: 2.32rem .38rem;
  background-image: url(img/3-3-sentence.png);
}

.s3-4 .sentence {
  height: calc(.1rem + 16.53rem);
  background-size: 2.34rem auto;
  background-position: 2.322rem .08rem;
  background-image: url(img/3-4-sentence.png);
}
.s3-4 .number[data-num="1"] { top: .7rem; }
.s3-4 .number[data-num="2"] { top: calc(.7rem + 1.65rem); }
.s3-4 .number[data-num="3"] { top: calc(.7rem + 1.65 * 2rem); }
.s3-4 .number[data-num="4"] { top: calc(.7rem + 1.65 * 3rem); }
.s3-4 .number[data-num="5"] { top: calc(.7rem + 1.65 * 4rem); }
.s3-4 .number[data-num="6"] { top: calc(.7rem + 1.65 * 5rem); }
.s3-4 .number[data-num="7"] { top: calc(.7rem + 1.65 * 6rem); }
.s3-4 .number[data-num="8"] { top: calc(.7rem + 1.65 * 7rem); }
.s3-4 .number[data-num="9"] { top: calc(.7rem + 1.65 * 8rem); }
.s3-4 .number[data-num="10"] { top: calc(.7rem + 1.65 * 9rem); }
.s3-4 .order[data-num="1"] { top: .35rem; }
.s3-4 .order[data-num="2"] { top: calc(.35rem + 1.65rem); }
.s3-4 .order[data-num="3"] { top: calc(.35rem + 1.65 * 2rem); }
.s3-4 .order[data-num="4"] { top: calc(.35rem + 1.65 * 3rem); }
.s3-4 .order[data-num="5"] { top: calc(.35rem + 1.65 * 4rem); }
.s3-4 .order[data-num="6"] { top: calc(.35rem + 1.65 * 5rem); }
.s3-4 .order[data-num="7"] { top: calc(.35rem + 1.65 * 6rem); }
.s3-4 .order[data-num="8"] { top: calc(.35rem + 1.65 * 7rem); }
.s3-4 .order[data-num="9"] { top: calc(.35rem + 1.65 * 8rem); }
.s3-4 .order[data-num="10"] { top: calc(.35rem + 1.65 * 9rem); }

.s3-5 .sentence {
  height: calc(.6rem + 11.68rem);
  top: 1.2rem;
  background-size: 2.13rem auto;
  background-position: 2.32rem .38rem;
  background-image: url(img/3-5-sentence.png);
}

.s4-1 .sentence {
  height: calc(.6rem + 10.1rem);
  top: 1.2rem;
  background-size: 2.28rem auto;
  background-position: 2.22rem .38rem;
  background-image: url(img/4-1-sentence.png);
}
.s4-1 .number { right: 5.78rem;}

.s4-2 .sentence {
  height: calc(.6rem + 6.9rem);
  top: 1.2rem;
  background-size: 2.28rem auto;
  background-position: 2.22rem .38rem;
  background-image: url(img/4-2-sentence.png);
}
.s4-2 .number { right: 5.78rem;}

.s4-3 .sentence {
  height: calc(.6rem + 8.29rem);
  top: 1.2rem;
  background-size: 2.28rem auto;
  background-position: 2.22rem .38rem;
  background-image: url(img/4-3-sentence.png);
}
.s4-3 .number { right: 5.78rem;}

.s4-4 .sentence {
  height: calc(.1rem + 16.52rem);
  background-size: 2.28rem auto;
  background-position: 2.22rem .08rem;
  background-image: url(img/4-4-sentence.png);
}
.s4-4 .number { right: 5.78rem;}
.s4-4 .number[data-num="1"] { top: .7rem; }
.s4-4 .number[data-num="2"] { top: calc(.7rem + 1.65rem); }
.s4-4 .number[data-num="3"] { top: calc(.7rem + 1.65 * 2rem); }
.s4-4 .number[data-num="4"] { top: calc(.7rem + 1.65 * 3rem); }
.s4-4 .number[data-num="5"] { top: calc(.7rem + 1.65 * 4rem); }
.s4-4 .number[data-num="6"] { top: calc(.7rem + 1.65 * 5rem); }
.s4-4 .number[data-num="7"] { top: calc(.7rem + 1.65 * 6rem); }
.s4-4 .number[data-num="8"] { top: calc(.7rem + 1.65 * 7rem); }
.s4-4 .number[data-num="9"] { top: calc(.7rem + 1.65 * 8rem); }
.s4-4 .number[data-num="10"] { top: calc(.7rem + 1.65 * 9rem); }
.s4-4 .order[data-num="1"] { top: .35rem; }
.s4-4 .order[data-num="2"] { top: calc(.35rem + 1.65rem); }
.s4-4 .order[data-num="3"] { top: calc(.35rem + 1.65 * 2rem); }
.s4-4 .order[data-num="4"] { top: calc(.35rem + 1.65 * 3rem); }
.s4-4 .order[data-num="5"] { top: calc(.35rem + 1.65 * 4rem); }
.s4-4 .order[data-num="6"] { top: calc(.35rem + 1.65 * 5rem); }
.s4-4 .order[data-num="7"] { top: calc(.35rem + 1.65 * 6rem); }
.s4-4 .order[data-num="8"] { top: calc(.35rem + 1.65 * 7rem); }
.s4-4 .order[data-num="9"] { top: calc(.35rem + 1.65 * 8rem); }
.s4-4 .order[data-num="10"] { top: calc(.35rem + 1.65 * 9rem); }

.s4-5 .sentence {
  height: calc(.6rem + 8.29rem);
  top: 1.2rem;
  background-size: 2.28rem auto;
  background-position: 2.22rem .38rem;
  background-image: url(img/4-5-sentence.png);
}
.s4-5 .number { right: 5.78rem;}

.s4-6 .sentence {
  height: calc(.1rem + 16.52rem);
  background-size: 2.28rem auto;
  background-position: 2.22rem .08rem;
  background-image: url(img/4-6-sentence.png);
}
.s4-6 .number { right: 5.78rem;}
.s4-6 .number[data-num="1"] { top: .7rem; }
.s4-6 .number[data-num="2"] { top: calc(.7rem + 1.65rem); }
.s4-6 .number[data-num="3"] { top: calc(.7rem + 1.65 * 2rem); }
.s4-6 .number[data-num="4"] { top: calc(.7rem + 1.65 * 3rem); }
.s4-6 .number[data-num="5"] { top: calc(.7rem + 1.65 * 4rem); }
.s4-6 .number[data-num="6"] { top: calc(.7rem + 1.65 * 5rem); }
.s4-6 .number[data-num="7"] { top: calc(.7rem + 1.65 * 6rem); }
.s4-6 .number[data-num="8"] { top: calc(.7rem + 1.65 * 7rem); }
.s4-6 .number[data-num="9"] { top: calc(.7rem + 1.65 * 8rem); }
.s4-6 .number[data-num="10"] { top: calc(.7rem + 1.65 * 9rem); }
.s4-6 .order[data-num="1"] { top: .35rem; }
.s4-6 .order[data-num="2"] { top: calc(.35rem + 1.65rem); }
.s4-6 .order[data-num="3"] { top: calc(.35rem + 1.65 * 2rem); }
.s4-6 .order[data-num="4"] { top: calc(.35rem + 1.65 * 3rem); }
.s4-6 .order[data-num="5"] { top: calc(.35rem + 1.65 * 4rem); }
.s4-6 .order[data-num="6"] { top: calc(.35rem + 1.65 * 5rem); }
.s4-6 .order[data-num="7"] { top: calc(.35rem + 1.65 * 6rem); }
.s4-6 .order[data-num="8"] { top: calc(.35rem + 1.65 * 7rem); }
.s4-6 .order[data-num="9"] { top: calc(.35rem + 1.65 * 8rem); }
.s4-6 .order[data-num="10"] { top: calc(.35rem + 1.65 * 9rem); }

.s4-7 .sentence {
  height: calc(.1rem + 16.52rem);
  background-size: 2.28rem auto;
  background-position: 2.22rem .08rem;
  background-image: url(img/4-7-sentence.png);
}
.s4-7 .number { right: 5.78rem;}
.s4-7 .number[data-num="1"] { top: .7rem; }
.s4-7 .number[data-num="2"] { top: calc(.7rem + 1.65rem); }
.s4-7 .number[data-num="3"] { top: calc(.7rem + 1.65 * 2rem); }
.s4-7 .number[data-num="4"] { top: calc(.7rem + 1.65 * 3rem); }
.s4-7 .number[data-num="5"] { top: calc(.7rem + 1.65 * 4rem); }
.s4-7 .number[data-num="6"] { top: calc(.7rem + 1.65 * 5rem); }
.s4-7 .number[data-num="7"] { top: calc(.7rem + 1.65 * 6rem); }
.s4-7 .number[data-num="8"] { top: calc(.7rem + 1.65 * 7rem); }
.s4-7 .number[data-num="9"] { top: calc(.7rem + 1.65 * 8rem); }
.s4-7 .number[data-num="10"] { top: calc(.7rem + 1.65 * 9rem); }
.s4-7 .order[data-num="1"] { top: .35rem; }
.s4-7 .order[data-num="2"] { top: calc(.35rem + 1.65rem); }
.s4-7 .order[data-num="3"] { top: calc(.35rem + 1.65 * 2rem); }
.s4-7 .order[data-num="4"] { top: calc(.35rem + 1.65 * 3rem); }
.s4-7 .order[data-num="5"] { top: calc(.35rem + 1.65 * 4rem); }
.s4-7 .order[data-num="6"] { top: calc(.35rem + 1.65 * 5rem); }
.s4-7 .order[data-num="7"] { top: calc(.35rem + 1.65 * 6rem); }
.s4-7 .order[data-num="8"] { top: calc(.35rem + 1.65 * 7rem); }
.s4-7 .order[data-num="9"] { top: calc(.35rem + 1.65 * 8rem); }
.s4-7 .order[data-num="10"] { top: calc(.35rem + 1.65 * 9rem); }

.s4-8 .sentence {
  height: calc(.6rem + 8.29rem);
  top: 1.2rem;
  background-size: 2.28rem auto;
  background-position: 2.22rem .38rem;
  background-image: url(img/4-8-sentence.png);
}
.s4-8 .number { right: 5.78rem;}

.s4-9 .sentence {
  height: calc(.6rem + 11.73rem);
  top: 1.2rem;
  background-size: 2.28rem auto;
  background-position: 2.22rem .38rem;
  background-image: url(img/4-9-sentence.png);
}
.s4-9 .number { right: 5.78rem;}

.s4-10 .sentence {
  height: calc(.6rem + 11.73rem);
  top: 1.2rem;
  background-size: 2.28rem auto;
  background-position: 2.22rem .38rem;
  background-image: url(img/4-10-sentence.png);
}
.s4-10 .number { right: 5.78rem;}
