.page-about{color:#333333;font-family:'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;max-width:100%;overflow-x:hidden} .page-about__hero-section{display:flex;flex-direction:column;align-items:center;background:#f8f9fa;padding-top:10px;padding-bottom:0} .page-about__hero-image-box{width:100%;max-width:1920px} .page-about__hero-image{display:block;width:100%;max-width:1920px;aspect-ratio:1200/350;object-fit:cover;margin:0 auto} .page-about__hero-content{text-align:center;max-width:1000px;width:100%;padding:28px 16px 36px;box-sizing:border-box} .page-about__hero-title{color:#017439;font-size:clamp(1.45rem,2.4vw,2.3rem);font-weight:800;line-height:1.3;letter-spacing:-0.01em;margin:0 0 16px;max-width:900px} .page-about__hero-desc{color:#444444;font-size:1.05rem;line-height:1.7;margin:0 0 26px;max-width:760px;margin-left:auto;margin-right:auto} .page-about__hero-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;width:100%;max-width:100%;box-sizing:border-box;overflow:hidden} .page-about__btn-signup{display:inline-block;padding:13px 34px;border-radius:50px;background:#C30808;color:#FFFF00;font-weight:700;font-size:1rem;text-decoration:none;margin:5px;text-align:center;transition:background .25s,transform .2s} .page-about__btn-signup:hover{background:#a00606;transform:translateY(-2px);color:#FFFF00} .page-about__btn-home{display:inline-block;padding:12px 30px;border-radius:50px;background:#017439;color:#ffffff;font-weight:600;font-size:1rem;text-decoration:none;margin:5px;text-align:center;transition:background .25s,transform .2s} .page-about__btn-home:hover{background:#015c2d;color:#ffffff} .page-about__intro-section{background:#ffffff;padding:60px 16px 50px} .page-about__intro-inner{max-width:1000px;margin:0 auto} .page-about__intro-title{color:#017439;font-size:clamp(1.4rem,2.2vw,2rem);font-weight:800;text-align:center;margin:0 0 20px;line-height:1.3} .page-about__intro-desc,.page-about__intro-desc2{color:#333333;font-size:1rem;line-height:1.8;margin:0 auto 18px;max-width:900px} .page-about__intro-desc2{margin-bottom:24px} .page-about__intro-badges{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:28px} .page-about__intro-badge{background:#eaf6ef;border:1px solid #017439;color:#017439;padding:10px 20px;border-radius:40px;font-weight:600;font-size:.95rem;display:inline-flex;align-items:center;gap:6px} .page-about__vision-section{background:linear-gradient(135deg,#017439 0%,#004d24 100%);padding:65px 16px} .page-about__vision-inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:24px} .page-about__vision-item{background:rgba(255,255,255,.08);border-radius:20px;padding:28px 24px;border:1px solid rgba(255,255,255,.15);transition:transform .25s ease,box-shadow .25s} .page-about__vision-item:hover{transform:translateY(-5px);box-shadow:0 12px 30px rgba(0,0,0,.2)} .page-about__vision-title{color:#ffffff;font-size:1.4rem;font-weight:700;margin:0 0 14px;text-align:center} .page-about__vision-text{color:#f2f2f2;font-size:.95rem;line-height:1.8;margin:0} .page-about__journey-section{background:#ffffff;padding:65px 16px} .page-about__journey-inner{max-width:1000px;margin:0 auto} .page-about__journey-title{color:#017439;font-size:clamp(1.4rem,2.2vw,2rem);font-weight:800;text-align:center;margin:0 0 18px;line-height:1.3} .page-about__journey-desc{color:#333333;font-size:1rem;line-height:1.8;text-align:center;margin:0 auto 45px;max-width:850px} .page-about__timeline{position:relative;padding-left:30px;border-left:3px solid #017439;max-width:800px;margin:0 auto} .page-about__timeline-item{position:relative;margin-bottom:40px} .page-about__timeline-marker{position:absolute;left:-87px;top:-4px;width:112px;background:#017439;color:#ffffff;padding:8px 10px;border-radius:20px;font-weight:700;font-size:.9rem;text-align:center} .page-about__timeline-item:nth-child(even) .page-about__timeline-marker{background:#ffffff;color:#017439;border:2px solid #017439} .page-about__timeline-content{background:#f9f9f9;border-radius:12px;padding:20px 22px;margin-left:10px;border-left:4px solid #017439} .page-about__timeline-heading{color:#017439;font-size:1.2rem;font-weight:700;margin:0 0 8px} .page-about__timeline-text{color:#333333;font-size:.95rem;line-height:1.7;margin:0} .page-about__identity-section{background:#f4f9f6;padding:65px 16px} .page-about__identity-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1.1fr 1fr;gap:45px;align-items:center} .page-about__identity-title{color:#017439;font-size:clamp(1.4rem,2.2vw,2rem);font-weight:800;line-height:1.3;margin:0 0 18px} .page-about__identity-desc{color:#333333;font-size:1rem;line-height:1.8;margin:0 0 24px} .page-about__feature-list{list-style:none;padding:0;margin:0} .page-about__feature-item{display:flex;align-items:flex-start;gap:12px;padding:10px 0;color:#333333;font-size:.95rem;line-height:1.5} .page-about__feature-icon{flex-shrink:0;font-size:1.3rem;line-height:1.4} .page-about__identity-media{width:100%} .page-about__identity-image{width:100%;aspect-ratio:800/600;object-fit:cover;border-radius:16px;box-shadow:0 6px 20px rgba(0,0,0,.1)} .page-about__comparison-section{background:#ffffff;padding:65px 16px} .page-about__comparison-inner{max-width:1000px;margin:0 auto} .page-about__comparison-title{color:#017439;font-size:clamp(1.4rem,2.2vw,2rem);font-weight:800;text-align:center;margin:0 0 18px;line-height:1.3} .page-about__comparison-desc{color:#333333;font-size:1rem;line-height:1.8;text-align:center;margin:0 auto 35px;max-width:800px} .page-about__table-wrapper{overflow-x:auto;border-radius:12px;border:1px solid #e0e0e0} .page-about__comparison-table{width:100%;min-width:600px;border-collapse:collapse;background:#ffffff} .page-about__table-head{background:#017439;color:#ffffff;padding:14px 16px;text-align:left;font-weight:600} .page-about__table-cell{padding:13px 16px;border-bottom:1px solid #ededed;color:#333333;font-size:.95rem;line-height:1.5} .page-about__table-tr:nth-child(even){background:#f8f9fa} .page-about__table-highlight{background:#eaf6ef;font-weight:600;color:#017439} .page-about__team-section{background:#f7f9f8;padding:65px 16px} .page-about__team-inner{max-width:1100px;margin:0 auto} .page-about__team-title{color:#017439;font-size:clamp(1.4rem,2.2vw,2rem);font-weight:800;text-align:center;margin:0 0 18px} .page-about__team-desc{color:#333333;font-size:1rem;line-height:1.8;text-align:center;margin:0 auto 45px;max-width:800px} .page-about__team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px} .page-about__team-card{background:#ffffff;border-radius:16px;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,.06);transition:transform .25s ease,box-shadow .25s;display:flex;flex-direction:column} .page-about__team-card:hover{transform:translateY(-6px);box-shadow:0 10px 25px rgba(0,0,0,.1)} .page-about__team-image{width:100%;aspect-ratio:400/400;object-fit:cover} .page-about__team-name{color:#017439;font-size:1.2rem;font-weight:700;margin:18px 18px 4px} .page-about__team-role{color:#666666;font-size:.85rem;margin:0 18px 10px;letter-spacing:.4px} .page-about__team-bio{color:#333333;font-size:.92rem;line-height:1.6;margin:0;padding:0 18px 22px} .page-about__values-section{background:linear-gradient(135deg,#f4f9f6 0%,#e0efe5 100%);padding:65px 16px} .page-about__values-inner{max-width:1100px;margin:0 auto} .page-about__values-title{color:#017439;font-size:clamp(1.4rem,2.2vw,2rem);font-weight:800;text-align:center;margin:0 0 18px} .page-about__values-desc{color:#333333;font-size:1rem;line-height:1.8;text-align:center;margin:0 auto 45px;max-width:760px} .page-about__values-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 32px} .page-about__value-box{background:#ffffff;border-radius:14px;padding:20px 22px;box-shadow:0 4px 10px rgba(0,0,0,.04)} .page-about__value-text{color:#017439;font-weight:700;font-size:1.1rem;display:flex;align-items:center;gap:10px} .page-about__value-text::before{content:'✔';font-size:1.3rem} .page-about__value-detail{color:#333333;font-size:.92rem;line-height:1.65;margin-top:8px} .page-about__guide-section{background:#ffffff;padding:60px 16px} .page-about__guide-container{max-width:1000px;margin:0 auto} .page-about__guide-title{color:#017439;font-size:clamp(1.4rem,2.2vw,2rem);font-weight:800;text-align:center;margin:0 0 14px} .page-about__guide-desc{color:#333333;font-size:1rem;line-height:1.7;text-align:center;max-width:900px;margin:0 auto 35px} .page-about__guide-step-list{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:900px;margin:0 auto 35px} .page-about__guide-step{background:#f3f7f5;border-radius:16px;padding:24px 20px;display:flex;gap:16px;border-left:5px solid #017439} .page-about__guide-num{font-size:2.2rem;font-weight:800;color:#5cc08a;line-height:1;flex-shrink:0;min-width:50px} .page-about__guide-info{} .page-about__guide-sub-title{color:#017439;font-weight:700;font-size:1rem;margin:0 0 10px} .page-about__guide-text{color:#333333;font-size:.95rem;line-height:1.7;margin:0} .page-about__guide-cta{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;width:100%;max-width:100%;overflow:hidden;box-sizing:border-box} .page-about__btn-cta-primary{display:inline-block;padding:14px 36px;border-radius:50px;background:#C30808;color:#FFFF00;font-weight:700;font-size:1.05rem;text-decoration:none;transition:background .25s,transform .2s;max-width:100%;white-space:normal;word-wrap:break-word;text-align:center} .page-about__btn-cta-primary:hover{background:#a00606;color:#FFFF00;transform:translateY(-2px)} .page-about__btn-cta-secondary{display:inline-block;padding:13px 30px;border-radius:50px;background:#017439;color:#ffffff;font-weight:600;font-size:1rem;text-decoration:none;transition:background .25s,transform .2s;max-width:100%;white-space:normal;word-wrap:break-word;text-align:center} .page-about__btn-cta-secondary:hover{background:#015c2d;color:#ffffff} .page-about__faq-section{background:#f4f9f6;padding:65px 16px} .page-about__faq-inner{max-width:900px;margin:0 auto} .page-about__faq-title{color:#017439;font-size:clamp(1.4rem,2.2vw,2rem);font-weight:800;text-align:center;margin:0 0 18px} .page-about__faq-desc{color:#333333;font-size:1rem;line-height:1.7;text-align:center;max-width:700px;margin:0 auto 40px} .page-about__faq-list{max-width:850px;margin:0 auto} .page-about__faq-item{background:#ffffff;border-radius:14px;margin-bottom:14px;overflow:hidden;border:1px solid #e3ebe6} .page-about__faq-question{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;cursor:pointer;list-style:none;font-weight:600;color:#1b3b2e;font-size:1.05rem;background:#ffffff;transition:background .2s} .page-about__faq-question::-webkit-details-marker{display:none} .page-about__faq-question:hover{background:#f0f6f2} .page-about__faq-icon{flex-shrink:0;font-size:1.4rem;font-weight:700;color:#017439;line-height:1;margin-left:16px;transition:transform .2s} .page-about__faq-item[open] .page-about__faq-icon{transform:rotate(45deg)} .page-about__faq-answer{padding:4px 24px 20px;color:#333333;font-size:.95rem;line-height:1.7;margin:0} @media (max-width:1024px){ .page-about__vision-inner{grid-template-columns:repeat(3,1fr);gap:15px} .page-about__vision-item{padding:22px 18px} .page-about__identity-inner{grid-template-columns:1fr 1fr;gap:30px} .page-about__team-grid{grid-template-columns:repeat(3,1fr);gap:16px} .page-about__team-bio{font-size:.85rem} } @media (max-width:768px){ .page-about{max-width:100%;overflow-x:hidden} .page-about__hero-image{width:100%;max-width:100%;height:auto;aspect-ratio:2/1;object-fit:cover;object-position:center} .page-about__hero-image-box{width:100%;padding:0} .page-about__hero-content{padding:26px 14px 32px} .page-about__hero-title{font-size:clamp(1.25rem,5vw,1.65rem);margin-bottom:14px} .page-about__hero-desc{font-size:.95rem;line-height:1.65} .page-about__btn-signup,.page-about__btn-home{width:100%;max-width:100%;box-sizing:border-box;padding:13px 20px;white-space:normal;word-wrap:break-word;font-size:.95rem} .page-about__hero-actions{width:100%;max-width:100%;overflow:hidden;box-sizing:border-box;gap:8px} .page-about__btn-signup,.page-about__btn-home{margin:4px 0} .page-about__intro-section{padding:45px 16px} .page-about__intro-title{font-size:1.35rem;line-height:1.35} .page-about__intro-desc{font-size:.95rem;line-height:1.75} .page-about__intro-badges{gap:10px} .page-about__intro-badge{font-size:.85rem;padding:8px 16px} .page-about__vision-section{padding:50px 16px} .page-about__vision-inner{grid-template-columns:1fr;gap:20px} .page-about__vision-title{font-size:1.3rem} .page-about__vision-text{font-size:.9rem} .page-about__journey-section{padding:50px 16px} .page-about__journey-title{font-size:1.3rem} .page-about__journey-desc{margin-bottom:30px} .page-about__timeline{padding-left:15px;border-left-width:3px} .page-about__timeline-marker{position:static;display:inline-block;margin-bottom:10px;width:auto;padding:5px 15px;font-size:.85rem} .page-about__timeline-item:nth-child(even) .page-about__timeline-marker{background:#017439;color:#ffffff;border:none} .page-about__timeline-content{margin-left:0;padding:18px} .page-about__identity-section{padding:50px 16px} .page-about__identity-inner{grid-template-columns:1fr;gap:30px} .page-about__identity-image{width:100%;max-width:100%;height:auto} .page-about__comparison-section{padding:50px 16px} .page-about__team-section{padding:50px 16px} .page-about__team-grid{grid-template-columns:1fr;gap:25px} .page-about__team-image{width:100%;max-width:100%;height:auto} .page-about__team-bio{font-size:.9rem} .page-about__values-section{padding:50px 16px} .page-about__values-grid{grid-template-columns:1fr;gap:16px} .page-about__guide-section{padding:50px 16px} .page-about__guide-step-list{grid-template-columns:1fr;gap:18px} .page-about__btn-cta-primary,.page-about__btn-cta-secondary{width:100%;max-width:100%;box-sizing:border-box;white-space:normal;word-wrap:break-word;font-size:.95rem;padding:13px 20px} .page-about__guide-cta{flex-direction:column;align-items:stretch;gap:8px;width:100%;max-width:100%;overflow:hidden;box-sizing:border-box} .page-about__btn-cta-primary,.page-about__btn-cta-secondary{margin:4px 0} .page-about__faq-section{padding:50px 16px} .page-about__faq-title{font-size:1.35rem} .page-about__faq-question{font-size:.95rem;padding:18px 16px} .page-about__faq-answer{font-size:.9rem;line-height:1.65;padding:0 16px 18px} .page-about img{max-width:100% !important;height:auto !important} .page-about__table-wrapper{overflow-x:auto} } @media (max-width:576px){ .page-about__intro-badges{flex-direction:column;align-items:flex-start} .page-about__intro-badge{width:100%} .page-about__btn-home{margin-top:0} .page-about__timeline-item:last-child{margin-bottom:0} .page-about__identity-media{order:2} .page-about__feature-icon{font-size:1.2rem} .page-about__guide-step{flex-direction:column;gap:10px;align-items:flex-start} .page-about__guide-num{font-size:1.8rem;min-width:auto} .page-about__faq-item{border-radius:10px} }