.navbar{border-bottom-color:transparent}body.has--stickysubnav .navbar{border-bottom:1px solid #eeeff1}.navbar:has(~main .tools__progressbar.is--stuck){border-bottom:1px solid #eeeff1}main.q-pt header{background-color:#33a474;position:relative;padding:5px 15px 15px}main.q-pt header h1{text-align:center;color:#fff;margin-bottom:10px;font-size:var(--font-h2-size-bp-sm);line-height:var(--font-h2-line-height-bp-sm);letter-spacing:var(--font-h2-spacing-bp-sm)}main.q-pt header .trademark{font-size:var(--font-p-md-size-bp-sm);line-height:var(--font-p-md-line-height-bp-sm);letter-spacing:var(--font-p-md-spacing-bp-sm);text-align:center;color:#fff}main.q-pt .tips{display:flex;align-items:center;justify-content:space-between;flex-direction:column;position:relative;padding:15px;overflow:hidden;background-color:#33a474}main.q-pt .tips .tip-highlight{display:none;position:absolute;top:70px;height:240px;width:370px;z-index:3;border-radius:10px;mix-blend-mode:hue}main.q-pt .tips .tip-highlight.first{inset-inline-start:calc(50% - 470px);background-color:#4298b4}main.q-pt .tips .tip-highlight.second{inset-inline-start:calc(50% - 150px);background-color:#e4ae3a}main.q-pt .tips .tip-highlight.third{background-color:#583f64;inset-inline-start:calc(50% + 170px)}main.q-pt .tips .tip{display:flex;align-items:center;justify-content:flex-start;flex-direction:row;flex:0 0 100%;width:100%;max-width:550px;margin-bottom:10px;padding:10px;background-color:#fffc;border-radius:10px;position:relative;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{padding-inline-start:10px;max-width:100%}main.q-pt .tips .tip .text .title{display:none;font-family:var(--font-family-titles);font-weight:var(--font-titles-weight);font-size:var(--font-p-lg-size-bp-sm);line-height:var(--font-p-lg-line-height-bp-sm);letter-spacing:var(--font-p-lg-spacing-bp-sm);margin-bottom:5px}main.q-pt .tips .tip .text .subtitle{font-size:var(--font-p-sm-size-bp-sm);line-height:var(--font-p-sm-line-height-bp-sm);letter-spacing:var(--font-p-sm-spacing-bp-sm)}main.q-pt .tips .shape{display:none;background-color:#33a474;position:absolute;inset:-1px 0 0;z-index:2;width:100%;height:230px;clip-path:polygon(0 0,100% 0,100% calc(100% - 15px),81% 100%,46% calc(100% - 32px),19% 100%,0 calc(100% - 15px))}main.q-pt .tips .shadow{display:none;position:absolute;inset:95px 0 0;z-index:1;background-color:#f9f9f9}main.q-pt .progress-wrapper{position:fixed;bottom:0;left:0;right:0;z-index:11;display:flex;align-items:center;justify-content:center;background-color:#576071;padding:15px 0}main.q-pt .progress-wrapper .percentage{font-size:.8em;color:#fff;width:30px;flex:0 0 30px;text-align:end}main.q-pt .progress-wrapper .progress-bar{flex:0 0 calc(100% - 75px);height:4px;border-radius:10px;max-width:1000px;background-color:#fff;margin-inline-start:15px;position:relative;overflow:hidden}main.q-pt .progress-wrapper .progress-bar .filler{position:absolute;left:0;top:0;bottom:0;background-color:#33a474;transition:all .2s ease-in-out}main.q-pt .quiz-wrapper{min-height:600px}main.q-pt .gender.sp-select{margin:20px auto;width:100%;max-width:460px;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:0 15px}main.q-pt .gender.sp-select .input__label{order:0;color:#343c4b;font-weight:var(--font-text-semibold-weight);text-align:center;line-height:1.5;margin-bottom:15px;font-size:1.125rem}main.q-pt .gender.sp-select .input__label span{color:rgb(var(--rgb-gray-10))}main.q-pt .gender.sp-select .input__note{order:1;color:rgb(var(--rgb-gray-10));text-align:center;margin-bottom:17px;margin-top:0;font-size:var(--font-p-md-size-bp-sm);line-height:var(--font-p-md-line-height-bp-sm);letter-spacing:var(--font-p-md-spacing-bp-sm)}main.q-pt .gender.sp-select .group__options{order:3;width:100%;max-width:300px}main.q-pt .action-row{display:flex;align-items:center;justify-content:center;padding:15px 0 90px;margin:0 auto;width:100%;max-width:700px;border-bottom:1px solid #dddfe2}main.q-pt .action-row .sp-button{width:100%;max-width:300px}@media (min-width: 400px){main.q-pt header{padding:15px 30px}}@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-inline-start:15px}}@media (min-width: 768px){main.q-pt header h1{margin-bottom:20px;font-size:var(--font-h1-size-bp-md);line-height:var(--font-h1-line-height-bp-md);letter-spacing:var(--font-h1-spacing-bp-md)}main.q-pt header .trademark{font-size:var(--font-p-md-size-bp-md);line-height:var(--font-p-md-line-height-bp-md)}main.q-pt header .trademark{font-size:var(--font-p-lg-size-bp-md);line-height:var(--font-p-lg-line-height-bp-md);letter-spacing:var(--font-p-lg-spacing-bp-md)}main.q-pt .tips{flex-direction:row;align-items:stretch;justify-content:center;margin-top:-1px;padding:20px 10px 30px;clip-path:polygon(0 0,100% 0,100% 100%,70% calc(100% - 15px),25% 100%,0 calc(100% - 10px))}main.q-pt .tips .tip{flex-direction:column;flex:0 0 calc(100% / 3 - 20px);width:calc(100% / 3 - 20px);max-width:unset;margin:10px 10px 0;padding:25px 0}main.q-pt .tips .tip img{height:75px;width:75px;margin-bottom:15px}main.q-pt .tips .tip .text{padding:0 15px}main.q-pt .tips .tip .text .title{font-size:var(--font-p-lg-size-bp-md);line-height:var(--font-p-lg-line-height-bp-md);letter-spacing:var(--font-p-lg-spacing-bp-md)}main.q-pt .tips .tip .text .title{margin-bottom:10px;display:block;text-align:center}main.q-pt .tips .tip .text .subtitle{font-size:var(--font-p-sm-size-bp-md);line-height:var(--font-p-sm-line-height-bp-md);letter-spacing:var(--font-p-sm-spacing-bp-md);text-align:center}main.q-pt .gender.sp-select .input__label{font-size:1.2em}main.q-pt .gender.sp-select .input__note{font-size:var(--font-p-md-size-bp-md);line-height:var(--font-p-md-line-height-bp-md)}}@media (min-width: 850px){main.q-pt .tips .tip .text{padding:0 30px}}@media (min-width: 992px){main.q-pt header{padding:25px 0}main.q-pt .tips{background-color:#fff;clip-path:none;overflow:unset;padding:0 0 30px}main.q-pt .tips .tip-highlight{display:block;width:300px;top:10px}main.q-pt .tips .tip{width:300px;flex:0 0 300px;margin:10px 10px 0;padding:20px 0}main.q-pt .tips .tip img{margin-bottom:30px;height:60px;width:60px}main.q-pt .tips .tip .text{padding:0 20px}main.q-pt .tips .shape{display:block;height:110px;clip-path:polygon(0 0,100% 0,100% calc(100% - 20px),calc(50% + 320px) 100%,35% calc(100% - 15px),calc(50% - 310px) 100%,0 calc(100% - 15px))}main.q-pt .tips .shadow{display:block;box-shadow:none;bottom:0}main.q-pt .progress-wrapper.initial{padding:15px 0}main.q-pt .progress-wrapper.initial .percentage,main.q-pt .progress-wrapper.initial .progress-bar{display:none}main.q-pt .progress-wrapper{position:relative;margin-top:-30px;padding:25px 0;z-index:4;background-color:#f9f9f9}main.q-pt .progress-wrapper .percentage{color:rgb(var(--rgb-gray-10));font-size:1.2em;width:auto;flex:unset}main.q-pt .progress-wrapper .progress-bar{height:5px;flex:0 0 60%;background-color:#ddd}main.q-pt .gender.sp-select .input__label{font-size:1.3em}main.q-pt .gender.sp-select .group__options{max-width:350px}main.q-pt .action-row{padding:15px 0 60px;max-width:870px}main.q-pt .action-row .sp-button{min-width:350px}}@media (min-width: 992px) and (min-height: 900px){main.q-pt .tips{padding:20px 0 30px}main.q-pt .tips .tip-highlight{top:30px;height:260px}main.q-pt .tips .tip{padding:25px 0}main.q-pt .tips .tip img{height:75px;width:75px}main.q-pt .tips .tip .text{padding:0 30px}main.q-pt .tips .shape{height:140px;clip-path:polygon(0 0,100% 0,100% calc(100% - 30px),calc(50% + 320px) 100%,40% calc(100% - 40px),calc(50% - 310px) 100%,0 calc(100% - 30px))}main.q-pt .progress-wrapper.initial{padding:25px 0}main.q-pt .progress-wrapper{padding:40px 0}main.q-pt .gender.sp-select{padding-right:0;padding-left:0;margin-top:45px;margin-bottom:30px;max-width:900px}main.q-pt .gender.sp-select .input__label{font-size:1.4em}main.q-pt .action-row{padding-bottom:160px}}@media (min-width: 1200px){main.q-pt header{padding:40px 30px}main.q-pt header h1{font-size:var(--font-h1-size-bp-lg);line-height:var(--font-h1-line-height-bp-lg);letter-spacing:var(--font-h1-spacing-bp-lg)}main.q-pt header .trademark{font-size:var(--font-p-md-size-bp-lg);line-height:var(--font-p-md-line-height-bp-lg)}main.q-pt header .trademark{line-height:var(--font-p-lg-line-height-bp-lg)}main.q-pt .tips .tip-highlight{width:350px}main.q-pt .tips .tip-highlight.first{inset-inline-start:calc(50% - 545px)}main.q-pt .tips .tip-highlight.second{inset-inline-start:calc(50% - 175px)}main.q-pt .tips .tip-highlight.third{inset-inline-start:calc(50% + 195px)}main.q-pt .tips .tip{width:350px;flex:0 0 350px}main.q-pt .tips .tip .text .title{line-height:var(--font-p-lg-line-height-bp-lg)}main.q-pt .tips .shape{clip-path:polygon(0 0,100% 0,100% calc(100% - 20px),calc(50% + 320px) 100%,47% calc(100% - 15px),calc(50% - 310px) 100%,0 calc(100% - 15px))}main.q-pt .gender.sp-select .input__note{font-size:var(--font-p-md-size-bp-lg);line-height:var(--font-p-md-line-height-bp-lg)}}@media (min-width: 1200px) and (min-height: 900px){main.q-pt .tips .tip img{height:90px;width:90px;margin-bottom:35px}main.q-pt .tips .shape{height:155px;clip-path:polygon(0 0,100% 0,100% calc(100% - 30px),calc(50% + 370px) 100%,47% calc(100% - 27px),calc(50% - 370px) 100%,0 calc(100% - 30px))}}@media (min-width: 1400px){main.q-pt .tips .tip .text{padding:0 20px}}
