﻿html,body {background-color: #FFCA1C;}
#container, #wrapper {width:100%; height:100%; background-color: #FFCA1C; position: relative;}
.cont-wrap {width:100%; margin:auto; background-color: #FFCA1C; text-align: center;;}
.cont-header {position: relative; width:95%; margin:auto; text-align: left; padding:1vh 0;}
.cont-header img:nth-child(1) {width: 7vh; margin-top: 2vh;}
.cont-header img:nth-child(2) {position: absolute; right: 0; width: 6vh; top: 3.5vh;}

.start-info {font-size:2.5vh; margin-top:1.5vh;}
.start-info span {font-size:3.5vh;}

.pos-05 {width:40vh;}
.test-counting {font-size:2vh;}
.test-counting span {font-size:2.5vh;}

.go-test {display: inline-block; border-radius: 50px; margin-top: 4vh; width:37vh;}
.go-test .btn-title {font-size: 2.5vh; display: inline-block; padding: 1.5vh 10vh 1.5vh 6vh; background-image: url(../img/common/go_arrow.png); background-repeat: no-repeat; background-size: 5vh; background-position: right 4vh top 0.96vh;}

.main-cont {position: absolute; width: 100%; top: 50%; margin-top: -35vh;}

.start-footer {position: absolute; bottom: 0; left: 0; width: 95%; padding: 0 2.5%; display: flex; background-color: #AE4CC5; align-items: center; color: #fff; height: 45px; font-size: 13px;}
.start-footer img {width: 26px; margin-right: 10px; vertical-align: top; margin-top: 3px; }
.start-footer a {border: 3px solid #fff; padding: 4px 10px; border-radius: 5px; color: #fff; position: absolute; right: 3%; top: 6px; display: inline-block;}

.modal .modal-top { background-color: #BF65D4; color: #fff; padding: 20px 30px; border-radius: 10px 10px 0 0; }
.modal .modal-top .modal-title {font-size:23px;}
.modal .modal-top .close-modal-custom {width: 25px; height: 25px; display: inline-block; background-image: url(../img/common/close_white.png); background-size: 100%; position: absolute; right: 30px; top: 26px; cursor: pointer;}
.modal .modal-cont-box { padding: 20px 30px; min-height: 100px; background-color: #fff; border-radius: 0 0 10px 10px; max-height: 500px; overflow-y: auto; font-size: 16px; }
.modal a.close-modal {display: none;}

@media(max-width:750px) {
    .pos-05 {width:32.5vh;}
    .cont-header {width:88%; padding:2vh 0;}
    .main-cont {margin-top: -30vh;}
    
    .modal .modal-top {background-color: #BF65D4; color: #fff; padding: 3vw 3.5vw; border-radius: 3vw 3vw 0 0;}
    .modal .modal-top .modal-title {font-size:4vw;}
    .modal .modal-top .close-modal-custom {width: 4vw; height: 4vw; display: inline-block; background-image: url(../img/common/close_white.png); background-size: 100%; position: absolute; right: 3.5vw; top: 4vw; cursor: pointer;}
    .modal .modal-cont-box {padding: 3vw 3.5vw; min-height: 100px; background-color: #fff; border-radius: 0 0 3vw 3vw; max-height: 300px; overflow-y: auto; font-size:4vw;}
    .modal a.close-modal {display: none;}
}