:root{--primary-h:248;--primary-s:57%;--primary-l:60%;--primary-color:#6e5fd3}.banner{background-image:url(/themes/hsk-online/v2/images/banner/bn-introduce.png)}#intro{margin-top:3rem}#intro .title{font-weight:600}#intro .intro-top-1{display:flex;gap:2.8125rem}@media screen and (max-width:640px){#intro .intro-top-1{flex-wrap:wrap}}#intro .intro-top-1 .img-container{flex:0 1 29.375rem}@media screen and (max-width:640px){#intro .intro-top-1 .img-container{flex:1 1 100%}}#intro .intro-top-1 .img-container img{border-radius:.6rem;width:100%}#intro .intro-top-1__overview{flex:1 1 60%;line-height:1.19rem}#intro .intro-top-1__overview h1{margin-bottom:.625rem;text-align:left}#intro .intro-top-1__overview p.bold-600{margin-bottom:1.25rem}#intro .intro-top-2{margin:2.5rem 0 3rem}#intro .intro-top-2 .info-banner{background:#a61f26;border-radius:1rem;display:grid;grid-template-columns:auto auto auto auto auto}@media screen and (max-width:640px){#intro .intro-top-2 .info-banner{gap:.35rem;padding:0 .35rem}}#intro .intro-top-2 .info-banner .banner-item{align-items:center;color:#fff;display:flex;flex-direction:column;justify-content:center;padding:3rem 0;text-align:center}#intro .intro-top-2 .info-banner .banner-item .icon{margin-bottom:.4rem}@media screen and (max-width:640px){#intro .intro-top-2 .info-banner .banner-item .icon{width:60%}#intro .intro-top-2 .info-banner .banner-item .icon img{width:30px}}#intro .intro-top-2 .info-banner .banner-item .banner-number{font-weight:600}#intro .intro-top-2 .info-banner .banner-item .banner-detail{font-size:.675rem;line-height:.7rem}#intro .intro-body{margin-bottom:3rem}#intro .intro-body__group{display:grid;gap:3.125rem;grid-template-columns:auto auto;margin-top:2.5rem}@media screen and (max-width:640px){#intro .intro-body__group{grid-template-columns:100%}}#intro .intro-body__group .content-block{background:#f6f6f6;border-radius:1rem;font-size:1.25rem;line-height:1.49rem;padding:2.5rem}#intro .intro-body__group .content-block .title{margin-bottom:1.2rem}#intro .intro-body__group .content-block .content{line-height:1.49rem}#intro .intro-bottom{margin-bottom:5rem}#intro .intro-bottom-1{display:grid;gap:1.875rem;grid-template-columns:auto auto auto;margin-top:2.5rem}@media screen and (max-width:640px){#intro .intro-bottom-1{grid-template-columns:100%}}#intro .intro-bottom-1 .content-block{background-color:#a61f26;border-radius:1rem;color:#fff;font-size:1.25rem;padding:1.5rem}#intro .intro-bottom-1 .content-block .title{line-height:1.49rem;margin-bottom:1.2rem}#intro .intro-bottom-1 .content-block p.content{line-height:1.2}#intro .intro-bottom-2{margin-top:3.125rem}#intro .intro-bottom-2 .info-banner{align-items:center;display:flex;gap:1.5rem;justify-content:center;width:100%}@media screen and (max-width:640px){#intro .intro-bottom-2 .info-banner{flex-wrap:wrap}}#intro .intro-bottom-2 .info-banner .percent{color:#a61f26;font-size:10rem;font-weight:900;line-height:1}#intro .intro-bottom-2 .info-banner .content{display:flex;font-weight:700;gap:.7rem}#intro .intro-bottom-2 .info-banner .content span{color:#a61f26;font-weight:600}#intro .intro-bottom-2 .info-banner .content span:last-child{align-self:flex-end}#intro .intro-banner{background:#e6e6e6;margin-bottom:3.125rem;padding:3.5rem 0 5rem}#intro .intro-banner-container{display:flex;gap:5.5rem}@media screen and (max-width:640px){#intro .intro-banner-container{flex-wrap:wrap}}#intro .intro-banner-container__left{flex:1 1 50%;padding-top:2rem}#intro .intro-banner-container__left .line{margin-left:0}#intro .intro-banner-container__left h1{text-align:left}#intro .intro-banner-container__left .content{margin:2.5rem 0}
