main.q-pt.accessible header .note{color:#fff;color:#f5f5f5;margin:-5px 0 20px;text-align:center}main.q-pt.accessible header .trademark{margin-bottom:35px}main.q-pt.accessible .decision{margin-top:30px!important}main.q-pt.accessible select{min-height:50px;width:250px}main.q-pt header{background-color:#33a474;padding:15px;position:relative}main.q-pt header h1{color:#fff;font-size:1.5em;line-height:1.4;margin:20px 0 10px;text-align:center}main.q-pt header .trademark{color:#f5f5f5;font-size:.9em;text-align:center}main.q-pt .tips{align-items:center;background-color:#33a474;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;padding:15px;position:relative}main.q-pt .tips .tip-highlight{border-radius:10px;display:none;height:240px;mix-blend-mode:hue;position:absolute;top:70px;width:370px;z-index:3}main.q-pt .tips .tip-highlight.first{background-color:#4298b4;left:calc(50% - 470px)}main.q-pt .tips .tip-highlight.second{background-color:#e4ae3a;left:calc(50% - 150px)}main.q-pt .tips .tip-highlight.third{background-color:#583f64;left:calc(50% + 170px)}main.q-pt .tips .tip{align-items:center;background-color:rgba(255,255,255,.8);border-radius:10px;display:flex;flex:0 0 100%;flex-direction:row;justify-content:flex-start;margin-bottom:10px;max-width:550px;padding:10px;position:relative;width:100%;z-index:4}main.q-pt .tips .tip.last{margin-bottom:0}main.q-pt .tips .tip img{height:30px;width:30px}main.q-pt .tips .tip .text{max-width:100%;padding-left:10px}main.q-pt .tips .tip .text .title{-webkit-font-smoothing:var(--font-titles-webkit-smoothing);-moz-osx-font-smoothing:var(--font-titles-osx-smoothing);color:#576071;display:none;font-family:var(--font-family-titles);font-size:.8em;font-weight:var(--font-titles-weight);margin-bottom:5px}main.q-pt .tips .tip .text .subtitle{color:#51596a;font-size:.65em;line-height:1.5}main.q-pt .tips .shape{background-color:#33a474;-webkit-clip-path:polygon(0 0,100% 0,100% calc(100% - 15px),81% 100%,46% calc(100% - 32px),19% 100%,0 calc(100% - 15px));clip-path:polygon(0 0,100% 0,100% calc(100% - 15px),81% 100%,46% calc(100% - 32px),19% 100%,0 calc(100% - 15px));height:230px;top:-1px;width:100%;z-index:2}main.q-pt .tips .shadow,main.q-pt .tips .shape{bottom:0;display:none;left:0;position:absolute;right:0}main.q-pt .tips .shadow{background-color:#f9f9f9;top:95px;z-index:1}main.q-pt .progress-wrapper{align-items:center;background-color:#576071;bottom:0;display:flex;justify-content:center;left:0;padding:15px 0;position:fixed;right:0;z-index:11}main.q-pt .progress-wrapper .percentage{color:#fff;flex:0 0 30px;font-size:.8em;text-align:right;width:30px}main.q-pt .progress-wrapper .progress-bar{background-color:#fff;border-radius:10px;flex:0 0 calc(100% - 75px);height:4px;margin-left:15px;max-width:1000px;overflow:hidden;position:relative}main.q-pt .progress-wrapper .progress-bar .filler{background-color:#33a474;bottom:0;left:0;position:absolute;top:0;transition:all .2s ease-in-out}main.q-pt .quiz-wrapper{min-height:600px}main.q-pt .test-questions{padding-top:0}main.q-pt .gender.sp-select{align-items:center;display:flex;flex-direction:column;justify-content:center;margin:20px auto 5px;max-width:460px;padding:0 15px;width:100%}main.q-pt .gender.sp-select .input__label{color:#51596a;font-size:1.125rem;font-weight:600;line-height:1.5;margin-bottom:15px;order:0;text-align:center}main.q-pt .gender.sp-select .input__label span{color:#b5b5b5}main.q-pt .gender.sp-select .input__note{color:#b5b5b5;font-size:var(--font-p-md-size-bp-sm);line-height:var(--font-p-md-line-height-bg-sm);margin-bottom:17px;margin-top:0;order:1;text-align:center}main.q-pt .gender.sp-select .group__options{order:3;width:calc(100% - 30px)}main.q-pt .action-row{align-items:center;border-bottom:1px solid #dddfe2;display:flex;justify-content:center;margin:0 auto;max-width:700px;padding:15px 0 90px;width:100%}main.q-pt .action-row .sp-button{max-width:300px;width:100%}@media (min-width:400px){main.q-pt header{padding:15px 30px}main.q-pt .tips .tip .text .subtitle{font-size:.75em}}@media (min-width:460px){main.q-pt .tips{padding-top:20px}main.q-pt .tips .tip{padding:15px}main.q-pt .tips .tip img{height:40px;width:40px}main.q-pt .tips .tip .text{padding-left:15px}main.q-pt .tips .tip .text .title{display:block}main.q-pt .test-questions{padding:15px}}@media (min-width:550px){main.q-pt header h1{font-size:2.3em;margin:30px 0 15px}}
