main{padding-bottom:50px;margin-bottom:-50px}main .title-group{display:flex;flex-direction:column;gap:8px}main .title-group .title{font-weight:700;font-size:32px;line-height:40px;margin:unset}main .title-group .description{font-size:18px;color:#545454}main .welcome{margin:0 calc(50% - 50cqw);padding:98px calc(50cqw - 50%) 90px;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:40px}main .welcome::before{content:"";position:absolute;left:0;right:0;top:0;background-image:url(../images/home/bg.png);background-size:cover;background-repeat:no-repeat;aspect-ratio:96/77;pointer-events:none}main .welcome .welcome-description{display:flex;flex-direction:column;align-items:center;gap:12px;font-size:20px;line-height:100%;max-width:635px;position:relative}main .welcome .welcome-description h1{font-weight:700;font-size:56px;line-height:60px;margin:unset;width:100%}main .welcome .welcome-description h1::before{content:"";position:absolute;right:calc(100% - 18px);top:-65px;background-image:url(../images/home/title-coin.png);background-size:contain;background-repeat:no-repeat;aspect-ratio:161/216;height:216px;pointer-events:none}main .welcome .btn-container{display:flex;justify-content:center;gap:12px;width:100%}main .welcome .btn-container .btn{flex:0 1 168.5px;min-width:max-content}main .welcome .trusted-brand{margin-top:24px;width:100%;display:flex;flex-direction:column;gap:12px;font-size:14px;line-height:18px;color:#545454}main .welcome .trusted-brand .logo-container{display:flex;justify-content:center;flex-wrap:wrap;gap:16px}main .welcome .trusted-brand .logo-container .logo{height:24px;margin:4px 0}main .welcome .trusted-brand .logo-container .logo img{height:100%}main .welcome .trusted-brand .logo-container .logo.long{padding:unset;height:48px;flex-basis:100%}main .tutor{display:flex;flex-direction:column;gap:20px;padding-bottom:94px}main .tutor .tutor-step{position:relative;display:flex;flex-direction:column;gap:37.5px;counter-reset:step}main .tutor .tutor-step::before{content:"";position:absolute;top:17.5px;left:0;background-image:url(../images/home/step-bg.png);background-repeat:no-repeat;background-size:cover;aspect-ratio:631/285;width:1260px;pointer-events:none;z-index:0}main .tutor .tutor-step .step{display:flex;gap:16px;padding:12px;background-color:#ffffff;position:relative;z-index:2;max-width:400px;width:100%;counter-increment:step;font-size:18px}main .tutor .tutor-step .step .step-logo{min-width:80px;width:80px;height:80px}main .tutor .tutor-step .step .step-logo img{width:100%;height:100%}main .tutor .tutor-step .step .step-no{text-transform:uppercase;font-weight:700;font-size:16px;line-height:20px;color:#e12726}main .tutor .tutor-step .step:nth-child(even){margin-left:auto}main .tutor .tutor-step .step:nth-child(1){padding-left:unset}main .tutor .tutor-step .step:nth-child(3n+3){margin-left:201px}main .value-props{margin:0 calc(50% - 50cqw);padding:64px calc(50cqw - 50%);background-color:white;background-image:var(--home-bg);background-size:cover;display:flex;justify-content:space-between;gap:24px}main .value-props .title-group{max-width:100%}main .value-props .value-container{display:flex;flex-direction:column;gap:32px}main .value-props .value-container .value{display:flex;align-items:center;gap:24px;max-width:519px;width:100%;line-height:20px}main .value-props .value-container .value .value-logo{min-width:64px;width:64px;height:64px}main .value-props .value-container .value .value-logo img{width:100%;height:100%}main .missions-container{display:flex;flex-direction:column;gap:32px;padding:40px 0}main .missions-container .title-group{flex-direction:row;justify-content:space-between}main .missions-container .mission-swiper{width:100%}main .missions-container .mission-swiper .mission{box-shadow:0px 0px 20px 0px #e8e8e8;border-radius:16px;overflow:hidden;display:flex;flex-direction:column}main .missions-container .mission-swiper::part(container){overflow:visible}main .missions-container .title-group .btn-arrow{padding:unset;width:44px}main .missions-container .title-group .btn-arrow img{width:20px;height:20px}main .missions-container .mission-swiper .mission-banner{display:flex}main .missions-container .mission-swiper .mission-info{padding:16px;display:flex;flex-direction:column;gap:8px;height:128px}main .missions-container .mission-swiper .mission-info .name,main .missions-container .mission-swiper .mission-info .description{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}main .missions-container .mission-swiper .mission-info .name{font-weight:600;font-size:18px;line-clamp:1;-webkit-line-clamp:1;color:#1b1b1b}main .missions-container .mission-swiper .mission-info .description{color:#545454;line-clamp:2;-webkit-line-clamp:2}main .missions-container .mission-swiper .mission-info .reward-points{margin-top:8px;padding:6px 12px;background:linear-gradient(135deg, #0bc2ec 0%, #0891b2 100%);color:white;border-radius:20px;font-weight:600;font-size:14px;text-align:center;width:fit-content}main .why-join{padding:40px 0;display:flex;flex-direction:column;gap:32px}main .why-join .why-join-group{display:flex;gap:12px}main .why-join .why-join-group .why{flex:1;aspect-ratio:1;border-radius:30px 0;overflow:hidden;position:relative}main .why-join .why-join-group .why .name{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg, rgba(228,85,84,0) 60.98%, rgba(228,85,84,0.7) 78.96%);display:flex;align-items:flex-end;padding:20px;filter:drop-shadow(0px 2px 10px rgba(0,0,0,0.25));font-weight:600;font-size:18px;color:#ffffff}main .why-join .why-join-group .why .banner,main .why-join .why-join-group .why .banner img{width:100%;height:100%}main .why-join .why-join-group .why .banner img{object-fit:cover}main .qna{display:flex;flex-direction:column;gap:24px;padding:40px 0}main .qna .qna-container{display:flex;flex-direction:column}main .qna .qna-container .question-group{display:flex;flex-direction:column;gap:12px;border-bottom:1px solid #eaeaea;padding:24px 0}main .qna .qna-container .question-group .question-row{display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-weight:600;font-size:16px;line-height:20px}main .qna .qna-container .question-group .answer{color:#545454}main .qna .qna-container .question-group{cursor:pointer}main .qna .qna-container .question-group .question-row::after{content:"";background-image:url(../images/common/icon-expand.png);width:20px;height:20px;background-size:contain;transition:all 0.2s ease;transform:rotate(90deg)}main .qna .qna-container .question-group .answer{transform:scaleY(0);transform-origin:top;opacity:0;height:0px;transition:all 0.2s ease;text-align:left}main .qna .qna-container .question-group.active .question-row::after{background-image:url(../images/common/icon-collapse.png);transform:rotate(0deg)}main .qna .qna-container .question-group.active .answer{transform:scale(1);opacity:1;height:auto}main .join-promo{display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px;background:linear-gradient(179.11deg, #fff 44.17%, #fcefec 109.24%);padding:54px calc(50cqw - 50%) 0;margin:0 calc(50% - 50cqw)}main .join-promo .backgrounds{position:relative;display:flex}main .join-promo .backgrounds .coin-1{position:absolute;right:calc(100% + 12.2px);top:-22px}main .join-promo .backgrounds .coin-2{position:absolute;bottom:-51.5px;left:calc(100% - 38.5px)}body.portal-page>header.header,body.portal-page>footer.footer{display:none !important}body.portal-page .profile-wrapper{padding:48px 0 64px}body.portal-page .profile-content{display:grid;grid-template-columns:minmax(0, 320px) minmax(0, 1fr);gap:32px}body.portal-page .profile-card{background:#ffffff;border-radius:16px;box-shadow:0 20px 45px rgba(15,23,42,0.08);padding:32px}body.portal-page .profile-card+.profile-card{margin-top:24px}body.portal-page .profile-summary{text-align:center;position:relative;overflow:hidden}body.portal-page .profile-summary::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg, rgba(99,102,241,0.1), rgba(56,189,248,0.08))}body.portal-page .profile-summary .profile-summary-inner{position:relative;z-index:1}body.portal-page .profile-summary h2{font-size:24px;font-weight:700;margin-bottom:8px}body.portal-page .profile-summary p{color:#4b5563;margin-bottom:16px}body.portal-page .profile-summary .meta{display:flex;flex-direction:column;gap:8px;margin-top:16px;color:#1f2937;font-weight:600}body.portal-page .profile-section-title{font-size:20px;font-weight:700;margin-bottom:24px;display:flex;align-items:center;gap:12px}body.portal-page .profile-section-title::before{content:"";width:14px;height:14px;border-radius:999px;background:linear-gradient(135deg, #0bc2ec 0%, #0891b2 100%)}body.portal-page .profile-fields{display:grid;grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));gap:20px}body.portal-page .profile-field-label{font-size:13px;text-transform:uppercase;color:#6b7280;margin-bottom:6px;letter-spacing:0.05em}body.portal-page .profile-field-value{font-size:16px;font-weight:600;color:#111827;word-break:break-word}body.portal-page .profile-details-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));gap:16px}body.portal-page .profile-detail{padding:16px;border-radius:12px;background:#f3f4f6}body.portal-page .profile-detail .profile-field-label{margin-bottom:4px}body.portal-page .profile-avatar{width:96px;height:96px;border-radius:999px;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:700;color:#0f172a;background:linear-gradient(135deg, rgba(11,194,236,0.24), rgba(8,145,178,0.2));border:1px solid rgba(8,145,178,0.2)}body.portal-page .profile-summary-email{color:#1f2937;font-weight:500;margin-bottom:12px}body.portal-page .profile-summary .meta span{font-size:14px;color:#1f2937;font-weight:600}body.portal-page .profile-summary-actions{display:flex;justify-content:center;gap:12px;margin-top:24px}body.portal-page .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}body.portal-page .profile-form .profile-fields{margin-top:24px}body.portal-page .profile-input{width:100%;border:1px solid #d1d5db;border-radius:12px;padding:12px 16px;font-size:16px;font-family:"Inter", sans-serif;color:#111827;background:#ffffff;transition:border-color 0.2s ease, box-shadow 0.2s ease}body.portal-page .profile-input:focus{outline:none;border-color:#0bc2ec;box-shadow:0 0 0 4px rgba(11,194,236,0.18)}body.portal-page .profile-input[disabled]{background:#f9fafb;color:#6b7280}body.portal-page .profile-form textarea.profile-input{min-height:120px;resize:vertical}body.portal-page .profile-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}body.portal-page .profile-checkbox-group{display:flex;flex-direction:column;gap:12px;margin-top:12px}body.portal-page .profile-checkbox{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid #e5e7eb;border-radius:10px;background:#ffffff}body.portal-page .profile-checkbox input{width:16px;height:16px}body.portal-page .required-indicator{color:#ef4444;margin-left:4px}body.portal-page .profile-alert{padding:12px 16px;border-radius:12px;font-size:14px;margin-bottom:16px}body.portal-page .profile-alert-error{background:rgba(248,113,113,0.12);color:#b91c1c}body.portal-page .profile-alert-success{background:rgba(16,185,129,0.12);color:#047857}body.portal-page .profile-history table{width:100%;border-collapse:collapse}body.portal-page .profile-history table thead th{background:#f3f4f6;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:0.05em;color:#6b7280}body.portal-page .profile-history table th,body.portal-page .profile-history table td{padding:12px 16px;border-bottom:1px solid #e5e7eb;text-align:left;font-size:14px;color:#1f2937}body.portal-page .profile-stats{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:16px}body.portal-page .profile-stats .stat{display:flex;align-items:center;gap:16px;padding:16px;border-radius:12px;background:#f9fafb}body.portal-page .profile-stats .stat-icon{width:48px;height:48px;border-radius:12px;background:rgba(11,194,236,0.12);display:flex;align-items:center;justify-content:center;font-weight:700;color:#0bc2ec;font-size:20px}body.portal-page .profile-stats .stat-value{font-size:20px;font-weight:700;color:#111827;margin-bottom:2px}body.portal-page .profile-stats .stat-label{font-size:13px;color:#6b7280;text-transform:uppercase;letter-spacing:0.05em}body.portal-page .profile-history table td small{font-size:13px;color:#6b7280}@media screen and (max-width: 1024px){main .title-group{gap:4px}main .title-group .title{font-size:24px;line-height:28px}main .title-group .description{font-size:16px;color:#5e6366}main .welcome{padding-top:64px;padding-bottom:56px;gap:32px}main .welcome>*{padding:0 8px}main .welcome .welcome-description{font-size:16px;line-height:20px}main .welcome .welcome-description h1{font-size:36px;line-height:40px;width:fit-content;position:relative}main .welcome .welcome-description h1::before{top:-29px;right:calc(100% - 20px);height:70px}main .welcome .btn-container .login-btn{display:flex}main .welcome .trusted-brand{margin-top:32px;gap:10px}main .welcome .trusted-brand .logo-container{gap:12px}main .welcome .trusted-brand .logo-container .logo{height:14px}main .welcome .trusted-brand .logo-container .logo.long{height:32px}main .tutor{gap:24px;padding-bottom:64px}main .tutor .tutor-step .step{padding:8px;gap:12px;max-width:280px;font-size:16px}main .tutor .tutor-step .step .step-logo{min-width:48px;width:48px;height:48px}main .tutor .tutor-step .step .step-info::before{font-size:12px;line-height:100%}main .tutor .tutor-step .step:nth-child(odd){padding-left:unset}main .tutor .tutor-step .step:nth-child(even){padding-right:unset}main .tutor .tutor-step .step:nth-child(3n+3){margin-left:unset}main .value-props{flex-direction:column;padding-top:32px;padding-bottom:32px}main .value-props .value-container{gap:24px}main .value-props .value-container .value{gap:16px;line-height:24px}main .value-props .value-container .value .value-logo{min-width:40px;width:40px;height:40px}main .missions-container{padding:32px 0;gap:16px}main .missions-container .title-group .btn-arrow{width:32px;height:32px}main .missions-container .title-group .btn-arrow img{width:16px;height:16px}main .missions-container .mission-swiper .mission-info{gap:4px}main .missions-container .mission-swiper .mission-info .name{font-size:16px}main .missions-container .mission-swiper .mission-info .description{font-size:14px;line-height:20px}main .why-join{padding-top:32px;padding-bottom:32px}main .why-join .why-join-group{display:grid;grid-template-columns:1fr 1fr}main .why-join .why-join-group .why:nth-child(even){border-radius:0 30px}main .why-join .why-join-group .why .name{padding:16px;font-size:16px;line-height:18px}main .qna{padding:32px 0;gap:16px}main .qna .qna-container .question-group .question-row{font-weight:400}main .join-promo{padding-top:40px;gap:16px}main .join-promo .backgrounds{padding:0 16px}main .join-promo .backgrounds .coin-1{width:74px;right:calc(100% - 31px);top:-15px}main .join-promo .backgrounds .coin-2{bottom:-73.6px;left:calc(100% - 82px);width:165px}body.portal-page .profile-content{grid-template-columns:1fr}body.portal-page .profile-card{padding:24px}body.portal-page .profile-stats{grid-template-columns:1fr}}@media screen and (max-width: 768px){body.portal-page .profile-actions{flex-direction:column;align-items:stretch}body.portal-page .profile-summary-actions{flex-direction:column}}@media screen and (max-width: 440px){main .tutor{padding:0 calc(50cqw - 50%) calc(64px + 101px);margin:0 calc(50% - 50cqw) -101px;overflow:hidden}main .tutor .tutor-step::before{background-image:url(../images/home/step-bg-mb.png);top:105px;aspect-ratio:123/142;width:100cqw}main .value-props{position:relative;z-index:1}}
