.quizwpr:before {content:""; display:block; width:100%; height:100vh;
position:absolute; left:0; top:0;    
background-image:url("../images/bg-roofcover.png"); background-repeat:no-repeat;
background-size:100% auto; background-position:center top;
}

.quizwpr .centerwpr {padding-bottom:15px;}

/* ----- pagination ----- */
.swiper-pagination {position:relative; bottom:auto;
margin-bottom:20px; padding-top:120px;
}
.result .swiper-pagination {display:none;}

.swiper-pagination span {font-style:italic; color:#fff; line-height:1;
font-family:"prenton","微軟正黑體", "Microsoft JhengHei", sans-serif;
}
.swiper-pagination .qmark {font-size:50px; font-weight:700}
.swiper-pagination .current {font-size:56px; font-weight:700}
.swiper-pagination .slash {margin:0 5px;
font-size:30px; position:relative; top:-4px;
color:#dcdcdc;
}
.swiper-pagination .total {font-size:36px; font-weight:700; color:#dcdcdc;}

/* ----- quiz ----- */
.quiz {display:flex; flex-direction:column; align-items:center;}

.quiz--question {margin-bottom:30px;
font-size:30px; font-weight:700; color:#fff;
}


/* ----- quiz option ----- */
.quiz--option+.quiz--option {margin-top:10px;}

#result-slide {visibility:hidden;}
.result #result-slide {visibility:visible;}


/* ---------- 測驗結果 ----------*/
.resultwpr {display:flex; flex-direction:column; align-items:center;
padding-top:70px;
}

.resultwpr h2.deco {min-width:320px;}

.result--content {width:100%; margin-bottom:60px;
background-color:#fff;
display:flex; border-radius:4px; overflow:hidden;
}
.result--image {position:relative; width:60%; 
/* padding-top:40%; */
background-size:cover;
}
.result--image img {width:100%; display:none;}

.result--brief {width:40%;
/* display:flex; align-items:center;     */
text-align:left;
max-height:400px; overflow-y:hidden; position:relative;
}
.brief--container {padding:30px 35px 30px 40px;
text-align:justify;
}

.brief--container h4 {margin-bottom:20px; letter-spacing:1px;
font-size:30px; color:#e42137; font-weight:700; text-align:left;
line-height:1;
}
.brief--container p {font-size:17px; line-height:1.6; letter-spacing:1px;}
.brief--container p+p {margin-top:20px;}

/* ----- 人物介紹 ----- */
.result--star {margin-top:30px;}
.result--star h5 {font-size:20px; margin-bottom:5px;}
.result--star li {margin-bottom:2px;}
.result--star .name {font-size:18px; color:#e42137;}

/* .result--extra {width:100%; margin-bottom:60px;}
.result--extra h3.deco {font-style:normal; font-size:30px;
justify-content:center; margin-bottom:20px;
}

.extra--container {width:100%;
display:flex; align-items:center;
}
.extra--portrait {margin:0 20px; flex-shrink:0;}
.extra--brief {color:#fff;}
.extra--brief h4 {color:#fff; font-weight:700; font-size:24px;}
.extra--brief .status {display:inline-block; margin-left:25px;
font-size:16px; color:#2d4262; font-weight:700;
border-top:3px solid #2d4262; border-bottom:3px solid #2d4262;
} */

/* ----- 結果頁按鈕 ----- */
.result--btnwpr {width:100%; display:flex; align-items:center; justify-content:center;
margin-bottom:60px;
}
.result--btnwpr.disabled {pointer-events:none;}

.result--btnwpr .roofbtn {width:280px;}
.result--btnwpr .roofbtn+.roofbtn {margin-top:15px;}
.result--btnwpr .hamivideo {margin-bottom:0; margin-left:30px;
flex-shrink:0;
}

/* ----- 結果頁廣告 ----- */
.resultwpr .advDesktop {margin-bottom:60px;}


/* ---------- 測試用的計分板 ----------*/
.blackboard {display:flex; justify-content:center; align-items:center;
flex-wrap:wrap;
position:fixed; left:0; bottom:0; width:100%; padding:8px 0;
background-color:#2d4262;
display:none;
}
.score-entry {font-size:14px; white-space:nowrap; color:#fff;}
.score-entry+.score-entry:before {content:"/"; margin:0 10px;
color:#ccc;
}

/* -------------------- custom scroll bar -------------------- */
.ps__thumb-y {background-color:transparent;}
.ps__thumb-y:before {content:''; display:block; width:100%; height:calc(100% - 20px);
margin-top:10px;
background-color:#ccc; border-radius:3px;
}

.ps__rail-y {width:10px; right:1px !important;}

.ps__rail-x:hover,
.ps__rail-y:hover,
.ps__rail-x:focus,
.ps__rail-y:focus {
  background-color: transparent;
}

.ps__rail-y:hover > .ps__thumb-y,
.ps__rail-y:focus > .ps__thumb-y {
  background-color: transparent;
  width: 6px;
}



/* -------------------- RWD -------------------- */
@media screen and (max-width: 990px) {
    
    .swiper-pagination {padding-top:60px;}

    .quiz--question {font-size:22px; line-height:1.3;}

    .quiz .roofbtn .text {font-size:18px;}

    .result--content {display:block; margin-bottom:30px;}

    .result--image,.result--brief {width:100%; max-height:none;}
    .result--image {background-image:none !important;}

    .result--image img {display:block;}

    .brief--container {padding:25px 20px;}
    .brief--container h4 {text-align:center; font-size:26px; margin-bottom:10px;}

    .result--star {text-align:center;}

    .result--btnwpr {display:block; margin-bottom:30px;}

    .resultbtn-group {display:flex; justify-content:center; align-items:center;}
    .resultbtn-group+.resultbtn-group {margin-top:30px;}
    .resultbtn-group .roofbtn {width:calc(50% - 29px);}

    .result--btnwpr .roofbtn + .roofbtn {margin-top:0; margin-left:22px;}
    .result--btnwpr .hamivideo {margin:0 auto;}


}




