.homepage-new *{box-sizing: border-box;}
.homepage-new *{margin: 0px; padding: 0px;}



.homepage-new a{text-decoration: none; color: inherit; transition: color 0.2s, background 0.2s, border-color 0.2s, box-shadow 0.2s, transform 0.2s;}
.homepage-new ul{padding-left: 0px; list-style: none;}
.homepage-new img{max-width: 100%; vertical-align: middle;}
.homepage-new .flexRow{display: flex; flex-direction: row;}
.homepage-new .flexColumn{display: flex; flex-direction: column;}
.homepage-new .flexcenter{align-items: center; justify-content: center;}
.homepage-new .overflowclass{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical;}

.homepage-new .container{width: 100%; margin: 0px auto; padding: 0 var(--page-pad); box-sizing: border-box;}


































































.homepage-new .hero-bg-wrap{position: relative; background: rgb(255, 255, 255);}
.homepage-new .hero{position: relative;}
.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px; background: transparent;}
.homepage-new .hero-inner{min-height: 243px; position: relative; text-align: center; z-index: 1; background: url(../image/home-20261027/icon70.webp) center top / cover no-repeat; overflow: hidden;}
.homepage-new .hero-inner::before,.homepage-new .hero-inner::after{display: none;}
.homepage-new .hero-title{letter-spacing: 6px; font-weight: 400; font-family: FZLTCHK--GBK1, FZLTCHK--GBK1; font-size: 32px; line-height: 42px; margin: 0px 0px 12px; color: rgb(0, 0, 0); position: relative; z-index: 1;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: 5px;}
.homepage-new .hero-title .highlight{margin: 6px auto; letter-spacing: 4px; width: 210px; background: linear-gradient(270deg, rgb(34, 102, 244) 0%, rgb(60, 223, 120) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}
.idx .homepage-new .hero-title .highlight{display: inline; font-size: 28px; margin: 0px; width: auto; letter-spacing: 1px; font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}
.homepage-new .hero-subtitle{font-size: 12px; color: rgb(85, 85, 85); margin-bottom: 15px; letter-spacing: 0.5px; font-weight: 400; position: relative; z-index: 1;}
.homepage-new .hero-btns{display: flex; justify-content: center; gap: 12px; position: relative; z-index: 1;}
.homepage-new .btn-primary{width: 153px; gap: 4px; height: 32px; display: flex; align-items: center; justify-content: center; background: linear-gradient(270deg, rgb(57, 196, 145) 0%, rgb(40, 168, 120) 100%); color: rgb(255, 255, 255); border-radius: 22px; font-size: 12px; transition: 0.3s;}
.homepage-new .btn-primary:active{background: linear-gradient(270deg, rgb(25, 137, 95) 0%, rgb(0, 191, 121) 100%);}
.homepage-new .btn-outline{--border-width: 1px; --border-radius: 44px; position: relative; isolation: isolate; width: 107px; height: 32px; display: flex; align-items: center; justify-content: center; background: rgb(255, 255, 255); color: rgb(8, 117, 76); border-radius: 26px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; font-size: 12px; transition: color 0.3s, box-shadow 0.3s;}
.homepage-new .btn-outline::after{--m-i: linear-gradient(#000, #000); --m-o: content-box, padding-box; content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; padding: var(--border-width); border-radius: 26px; background-image: linear-gradient(120deg, rgb(60, 224, 121), rgb(36, 169, 121)); mask-image: var(--m-i), var(--m-i); mask-origin: var(--m-o); mask-clip: var(--m-o); mask-composite: exclude; z-index: -1; pointer-events: none; filter: hue-rotate(0deg);}
.homepage-new .section-header{display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px;}
.homepage-new .section-title{font-size: 18px; font-weight: 500; color: rgb(51, 51, 51);}
.homepage-new .section-more{font-size: 14px; color: rgb(40, 168, 120); display: flex; align-items: center; flex-shrink: 0;}
.homepage-new .section-more b{background: url(../image/home-20261027/icon15.png) 0% 0% / contain no-repeat; width: 8px; height: 8px; margin: 0px 0px 0px 3px;}
.homepage-new .curriculum-scroll{overflow: auto hidden; margin: 0 calc(-1 * var(--page-pad)); padding: 0 var(--page-pad) 4px; scrollbar-width: none;}
.homepage-new .curriculum-scroll::-webkit-scrollbar{display: none;}
.homepage-new .curriculum-grid{display: flex; gap: 10px; width: max-content;}
.homepage-new .curriculum-card{box-shadow: rgba(203, 203, 203, 0.42) 0px 0px 4px 0px; height: auto; min-height: 0px; border-radius: 8px; overflow: hidden; width: 194px; flex-shrink: 0; display: flex; flex-direction: column; background: rgb(255, 255, 255);}
.homepage-new .products{margin: 25px 0px 0px;}
.homepage-new .card-cover{display: block; width: 100%; line-height: 0;}
.homepage-new .card-cover img{width: 100%; height: auto; aspect-ratio: 388 / 158; object-fit: cover; display: block;}
.homepage-new .card-body{display: flex; flex-direction: column; flex: 1 1 0%; padding: 10px 12px 12px; min-width: 0px;}
.homepage-new .card-title-row{display: flex; align-items: center; justify-content: space-between; gap: 6px;}
.homepage-new .card-title-row h3{flex: 1 1 0%; min-width: 0px; margin: 0px; font-size: 14px; font-weight: 500; color: rgb(51, 51, 51); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.homepage-new .card-badge{flex-shrink: 0; padding: 1px 8px; font-size: 10px; color: rgb(152, 162, 176); background: rgb(243, 245, 247); border-radius: 10px; line-height: 16px;}
.homepage-new .card-desc{margin: 4px 0px 8px; font-size: 12px; color: rgb(102, 102, 102); line-height: 1.4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.homepage-new .card-links{display: flex; flex-direction: column; margin: 0px 0px 8px; flex: 1 1 0%; gap: 2px;}
.homepage-new .card-links li{min-width: 0px;}
.homepage-new .card-links a{display: flex; align-items: center; gap: 5px; width: 100%; min-width: 0px; padding: 4px 0px; font-size: 12px; color: rgb(119, 119, 119); border-radius: 4px;}
.homepage-new .card-links a span{flex: 1 1 0%; min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.homepage-new .card-links a b{flex-shrink: 0; width: 10px; height: 10px; background: url(../image/home-20261027/icon100.png) center center / contain no-repeat;}
.homepage-new .card-links li:hover a{background: rgb(241, 249, 243);}
.homepage-new .card-links li:hover a b{background: url(../image/home-20261027/icon99.png) center center / contain no-repeat;}
.homepage-new .card-cta{display: flex; align-items: center; justify-content: center; gap: 4px; height: 30px; margin-top: auto; border-radius: 15px; font-size: 12px; color: rgb(40, 168, 120); background: rgb(241, 249, 243);}
.homepage-new .card-cta b{width: 8px; height: 8px; flex-shrink: 0; background: url(../image/home-20261027/icon15.png) center center / contain no-repeat;}
.homepage-new .card-cta:hover{color: rgb(255, 255, 255); background: linear-gradient(270deg, rgb(57, 196, 145) 0%, rgb(40, 168, 120) 100%);}
.homepage-new .card-cta:hover b{background-image: url(../image/home-20261027/icon90.png);}
.homepage-new .curriculum-dots{display: flex; justify-content: center; gap: 4px; margin-top: 12px;}
.homepage-new .curriculum-dots .dot{width: 4px; height: 4px; border-radius: 50%; background: rgb(217, 217, 217); transition: 0.2s;}
.homepage-new .curriculum-dots .dot.active{width: 20px; border-radius: 2px; background: rgb(40, 168, 120);}
.homepage-new .hot-tags{padding: 14px 0px 0px;}


.homepage-new .hot-tags-header{display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px;}
.homepage-new .tags-list{display: flex; flex-wrap: wrap; gap: 8px;}
.homepage-new .tag{display: inline-block; max-width: 100%; padding: 4px 16px; background: rgb(255, 255, 255); border: 1px solid rgb(231, 231, 231); border-radius: 16px; font-size: 14px; color: rgb(51, 51, 51); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.homepage-new .tag:active{border-color: rgb(40, 168, 120); color: rgb(40, 168, 120);}

.homepage-new .products-grid{display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px;}


.homepage-new .swiper-container.products-swiper{overflow: hidden; width: 100%;}
.homepage-new .swiper-container.products-swiper .swiper-slide{height: auto; box-sizing: border-box; padding: 4px;}
.homepage-new .swiper-container.products-swiper .products-grid{display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; width: 100%;}

.homepage-new .swiper-container.products-swiper .product-card{width: 100%; height: 100%; box-sizing: border-box;}
.homepage-new .products-pagination{margin-top: 16px; display: flex; justify-content: center; align-items: center; gap: 6px; position: static !important;}


.homepage-new .product-card{position: relative; display: block; padding: 10px; background: rgb(255, 255, 255); min-width: 0px; border-radius: 8px; box-shadow: rgba(203, 203, 203, 0.42) 0px 0px 4px 0px; width: auto; height: auto;}
.homepage-new .product-card:active{border-color: rgb(40, 168, 120);}
.homepage-new .product-tags{border-radius: 10px; flex-wrap: nowrap; position: absolute; top: 8px; left: 10px; z-index: 2; gap: 3px; max-width: calc(100% - 36px); pointer-events: none;}
.homepage-new .tagsa{padding: 1px 5px; font-size: 10px; color: rgb(255, 255, 255); border-radius: 8px; white-space: nowrap;}

.homepage-new .tag-blue{background: linear-gradient(270deg, rgb(90, 114, 250) 0%, rgb(68, 136, 246) 100%);}
.homepage-new .tag-purple{background: linear-gradient(270deg, rgb(164, 131, 255) 0%, rgb(144, 118, 245) 100%);}
.homepage-new .tag-green{background: linear-gradient(270deg, rgb(62, 196, 160) 0%, rgb(64, 197, 197) 100%);}
.homepage-new .tag-origin{background: linear-gradient(270deg, rgb(248, 154, 118) 0%, rgb(246, 111, 94) 100%);}
.homepage-new .product-thumb{width: 100%; height: auto; aspect-ratio: 1 / 1; border-radius: 8px; overflow: hidden; margin: 24px 0px 0px;}
.homepage-new .product-thumb img{width: 100%; height: 100%; object-fit: cover; background: rgb(238, 238, 238); transition: transform 0.3s;}
.homepage-new .product-thumb:hover img{transform: scale(1.1);}
.homepage-new .product-name{font-weight: 400; font-size: 16px; color: rgb(0, 0, 0); margin: 7px 0px 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.homepage-new .product-meta{font-size: 12px; color: rgb(153, 153, 153); margin-bottom: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.homepage-new .product-rating{display: flex; width: 100%; min-width: 0px; font-size: 11px; align-items: center; color: rgb(153, 153, 153); line-height: 1.3; overflow: hidden;}
.homepage-new .product-rating b{flex-shrink: 0; display: inline-block; background: url(../image/home-20261027/icon16.png) 0% 0% / contain no-repeat; width: 10px; height: 10px; margin: 0px 2px 0px 0px;}
.homepage-new .product-rating span{min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.homepage-new .product-rating span:nth-of-type(1){flex-shrink: 0; color: rgb(250, 173, 20); margin: 0px 3px;}
.homepage-new .product-rating span:nth-of-type(2){flex: 1 1 0%; min-width: 0px;}
.homepage-new .feed-layout{display: flex; flex-direction: column; gap: 24px; margin: 32px auto;}
.homepage-new .feed-main{flex: 1 1 0%; min-width: 0px; width: 100%;}
.homepage-new .feed-sidebar{width: 100%; box-shadow: none; border-radius: 0px;}
.homepage-new .feed-tabs{position: relative; display: flex; flex-wrap: nowrap; gap: 10px; max-height: none; overflow: auto hidden; scrollbar-width: none; margin: 0 calc(-1 * var(--page-pad)); padding: 0 var(--page-pad) 2px;}
.homepage-new .feed-tabs::-webkit-scrollbar{display: none;}

.homepage-new .feed-tabs .tab{width: 98px; padding: 0px 24px; height: 32px; border-radius: 16px; font-size: 14px; color: rgb(28, 28, 28); border: 1px solid rgb(229, 229, 229); display: flex; align-items: center; justify-content: center; flex-shrink: 0; white-space: nowrap;}
.homepage-new .feed-tabs .tab.active{background: linear-gradient(270deg, rgb(57, 196, 145) 0%, rgb(40, 168, 120) 100%); color: rgb(255, 255, 255); border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .feed-tabs .tab.more{position: static;}




.homepage-new .sidiv{margin: 0px; background: rgb(255, 255, 255);}
.homepage-new .sidiv .tajx-swiper{overflow: hidden; width: 100%;}
.homepage-new .sidiv .tajx-swiper .swiper-slide{height: auto;}
.homepage-new .sidiv .sidebar-list{display: flex; flex-direction: column; gap: 16px; margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: 34px; border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; border-radius: 4px; overflow: hidden;}
.homepage-new .sidiv .sidebar-list li.is-hot{background: linear-gradient(270deg, rgba(254, 240, 240, 0) 0%, rgb(254, 238, 239) 100%); border-radius: 4px;}
.homepage-new .sidiv .sidebar-list li.is-new{background: linear-gradient(270deg, rgba(254, 248, 240, 0) 0%, rgb(254, 249, 238) 100%); border-radius: 4px;}
.homepage-new .sidiv .sidebar-list a{display: flex; align-items: center; justify-content: space-between; gap: 8px; height: 34px; padding: 0px 0px 0px 7px; font-size: 16px; line-height: 34px; color: rgb(68, 68, 68);}
.homepage-new .sidiv .sidebar-icon{width: 18px; height: 18px; margin: 0px 6px 0px 0px; vertical-align: -4px; object-fit: contain;}
.homepage-new .sidiv .sidebar-text{flex: 1 1 0%; min-width: 0px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-line-clamp: unset;}
.homepage-new .sidiv .sidebar-text > span{display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.homepage-new .sidiv .sidebar-views{flex-shrink: 0; display: inline-flex; align-items: center; gap: 4px; font-size: 16px; color: rgb(210, 157, 107); padding-top: 0px; line-height: 1;}
.homepage-new .sidiv .sidebar-views .views-icon{width: 11px; height: 14px; object-fit: contain; display: block;}
.homepage-new .sidiv .products-pagination{margin-top: 16px;}



.homepage-new .article-list{display: flex; flex-direction: column; gap: 0px; margin: 4px 0px 0px;}


.homepage-new .article-item{display: flex; gap: 12px; padding: 10px 0px; border-bottom: 1px solid rgb(240, 240, 240);}
.homepage-new .article-body{flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column;}
.homepage-new .article-title{font-size: 16px; margin-bottom: 2px; line-height: 1.4; overflow: hidden;}
.homepage-new .article-title a{display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; color: rgb(34, 34, 34); white-space: nowrap; font-weight: 500;}
.homepage-new .article-title a:active{color: rgb(40, 168, 120);}

.homepage-new .article-summary{font-size: 14px; color: rgb(85, 85, 85); height: auto; max-height: 20px; line-height: 18px; margin-bottom: 3px; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; word-break: break-all;}
.homepage-new .article-tags{display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px;}
.homepage-new .article-tag{padding: 1px 8px; background: rgb(246, 251, 245); border-radius: 11px; font-size: 10px; color: rgb(20, 98, 69); border: 1px solid transparent;}
.idx .homepage-new .article-tag{background: rgb(246, 251, 245); color: rgb(20, 98, 69); padding: 1px 8px;}

.homepage-new .article-tag{background: rgb(246, 251, 245); color: rgb(20, 98, 69);}
.homepage-new .article-info{font-size: 12px; color: rgb(153, 153, 153); gap: 10px; flex-wrap: wrap;}
.homepage-new .article-info div{display: flex; align-items: center;}
.homepage-new .article-thumb{width: 148px; height: 88px; flex-shrink: 0; border-radius: 6px; overflow: hidden; align-self: flex-start; margin-top: 2px;}
.homepage-new .article-thumb img{width: 100%; height: 100%; object-fit: cover; background: rgb(238, 238, 238);}
.homepage-new .article-thumb-small{width: 88px; height: 88px;}
.homepage-new .btn-more-info{display: flex; align-items: center; justify-content: center; gap: 6px; height: 38px; width: 100%; margin-top: 16px; border-radius: 21px; font-size: 16px; color: rgb(102, 102, 102); background: rgb(242, 242, 242);}
.homepage-new .btn-more-info:active{color: rgb(40, 168, 120); background: rgb(241, 249, 243);}
.homepage-new .icon-more{background: url(../image/home-20261027/icon23.png) 0% 0% / contain no-repeat; width: 16px; height: 16px;}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{display: inline-block; background-size: contain; background-repeat: no-repeat; margin: 0px 3px 0px 0px; width: 12px; height: 12px; flex-shrink: 0;}
.homepage-new .info-name b{background-image: url(../image/home-20261027/icon19.png);}
.homepage-new .info-time b{background-image: url(../image/home-20261027/icon20.png);}
.homepage-new .info-watch b{background-image: url(../image/home-20261027/icon22.png);}
.homepage-new .sidebar-title{font-size: 17px; font-weight: 500; color: rgb(51, 51, 51);}
.homepage-new .sidebar-list li{border-bottom: 1px solid rgb(246, 246, 246); padding: 0px;}
.homepage-new .sidebar-list li:last-child{border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor;}
.homepage-new .sidebar-list a{display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 12px 0px; font-size: 14px; line-height: 1.45; color: rgb(68, 68, 68);}
.homepage-new .sidebar-list a:active{color: rgb(40, 168, 120);}
.homepage-new .sidebar-icon{display: inline-block; width: 16px; height: 16px; object-fit: cover; margin: 0px 4px 0px 0px; vertical-align: -2px;}
.homepage-new .sidebar-text{flex: 1 1 0%; min-width: 0px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; word-break: break-word;}
.homepage-new .sidebar-text > span{display: inline;}
.homepage-new .sidebar-views{flex-shrink: 0; font-size: 12px; color: rgb(153, 153, 153); padding-top: 2px;}
































































































































.homepage-new .info-name,.homepage-new .info-time,.homepage-new .info-watch{align-items: center;}












































































































































































































































































































































@media screen and (max-width: 751px){
.homepage-new *{margin: 0px; padding: 0px;}

.homepage-new ul{padding-left: 0px;}














































.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px;}
.homepage-new .hero-inner{min-height: calc(var(--width750) * 243px);}
.homepage-new .hero-title{letter-spacing: calc(var(--width750) * 6px); font-size: calc(var(--width750) * 32px); line-height: calc(var(--width750) * 42px); margin: 0 0 calc(var(--width750) * 12px); font-weight: 400;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: calc(var(--width750) * 5px);}
.homepage-new .hero-title .highlight{margin: calc(var(--width750) * 6px) auto; letter-spacing: calc(var(--width750) * 4px); width: calc(var(--width750) * 210px);}
.homepage-new .hero-subtitle{font-size: calc(var(--width750) * 12px); margin-bottom: calc(var(--width750) * 15px); letter-spacing: calc(var(--width750) * 0.5px);}
.homepage-new .hero-btns{gap: calc(var(--width750) * 12px);}
.homepage-new .btn-primary{height: calc(var(--width750) * 32px); border-radius: calc(var(--width750) * 22px); font-size: calc(var(--width750) * 12px); width: calc(var(--width750) * 153px); gap: calc(var(--width750) * 4px);}
.homepage-new .btn-outline{--border-radius: 44px; width: calc(var(--width750) * 107px); height: calc(var(--width750) * 32px); border-radius: calc(var(--width750) * 26px); font-size: calc(var(--width750) * 12px);}
.homepage-new .btn-outline::after{left: 0px; top: 0px; border-radius: calc(var(--width750) * 26px);}
.homepage-new .section-header{margin-bottom: calc(var(--width750) * 12px);}
.homepage-new .section-title{font-size: calc(var(--width750) * 18px);}
.homepage-new .section-more{font-size: calc(var(--width750) * 14px);}
.homepage-new .section-more b{width: calc(var(--width750) * 8px); height: calc(var(--width750) * 8px); margin: 0 0 0 calc(var(--width750) * 3px);}
.homepage-new .curriculum-scroll{padding: 0 var(--page-pad) calc(var(--width750) * 4px);}
.homepage-new .curriculum-grid{gap: calc(var(--width750) * 10px);}
.homepage-new .curriculum-card{box-shadow: 0 0 calc(var(--width750) * 4px) 0 rgba(203,203,203,0.42); min-height: 0px; border-radius: calc(var(--width750) * 8px); width: calc(var(--width750) * 194px);}
.homepage-new .products{margin: calc(var(--width750) * 25px) 0 0 0;}
.homepage-new .card-body{padding: calc(var(--width750) * 10px) calc(var(--width750) * 12px) calc(var(--width750) * 12px);}
.homepage-new .card-title-row{gap: calc(var(--width750) * 6px);}
.homepage-new .card-title-row h3{font-size: calc(var(--width750) * 14px);}
.homepage-new .card-badge{padding: calc(var(--width750) * 1px) calc(var(--width750) * 8px); font-size: calc(var(--width750) * 10px); border-radius: calc(var(--width750) * 10px); line-height: calc(var(--width750) * 16px);}
.homepage-new .card-desc{margin: calc(var(--width750) * 4px) 0 calc(var(--width750) * 8px); font-size: calc(var(--width750) * 12px);}
.homepage-new .card-links{margin: 0 0 calc(var(--width750) * 8px); gap: calc(var(--width750) * 2px);}
.homepage-new .card-links a{gap: calc(var(--width750) * 5px); min-width: 0px; font-size: calc(var(--width750) * 12px); padding: calc(var(--width750) * 4px) 0;}
.homepage-new .card-links a b{width: calc(var(--width750) * 10px); height: calc(var(--width750) * 10px);}
.homepage-new .card-cta{height: calc(var(--width750) * 30px); border-radius: calc(var(--width750) * 15px); font-size: calc(var(--width750) * 12px); gap: calc(var(--width750) * 4px);}
.homepage-new .card-cta b{width: calc(var(--width750) * 8px); height: calc(var(--width750) * 8px);}
.homepage-new .curriculum-dots{gap: calc(var(--width750) * 4px); margin-top: calc(var(--width750) * 12px);}
.homepage-new .curriculum-dots .dot{width: calc(var(--width750) * 4px); height: calc(var(--width750) * 4px);}
.homepage-new .curriculum-dots .dot.active{width: calc(var(--width750) * 20px); border-radius: calc(var(--width750) * 2px);}
.homepage-new .hot-tags{padding: calc(var(--width750) * 14px) 0 0;}


.homepage-new .hot-tags-header{margin-bottom: calc(var(--width750) * 8px);}
.homepage-new .tags-list{gap: calc(var(--width750) * 8px);}
.homepage-new .tag{padding: calc(var(--width750) * 4px) calc(var(--width750) * 16px); border-radius: calc(var(--width750) * 16px); font-size: calc(var(--width750) * 14px);}

.homepage-new .products-grid{gap: calc(var(--width750) * 16px);}

.homepage-new .swiper-container.products-swiper .swiper-slide{padding: calc(var(--width750) * 4px);}
.homepage-new .swiper-container.products-swiper .products-grid{gap: calc(var(--width750) * 12px);}

.homepage-new .products-pagination{margin-top: calc(var(--width750) * 16px); gap: calc(var(--width750) * 6px);}


.homepage-new .product-card{padding: calc(var(--width750) * 10px); min-width: 0px; border-radius: calc(var(--width750) * 8px); box-shadow: 0 0 calc(var(--width750) * 4px) 0 rgba(203,203,203,0.42);}
.homepage-new .product-tags{flex-wrap: nowrap; border-radius: calc(var(--width750) * 10px); top: calc(var(--width750) * 8px); left: calc(var(--width750) * 10px); gap: calc(var(--width750) * 3px); max-width: calc(100% - calc(var(--width750) * 36px));}
.homepage-new .tagsa{padding: calc(var(--width750) * 1px) calc(var(--width750) * 5px); font-size: calc(var(--width750) * 10px); border-radius: calc(var(--width750) * 8px); white-space: nowrap;}

.homepage-new .product-thumb{border-radius: calc(var(--width750) * 8px); margin: calc(var(--width750) * 24px) 0 0 0;}
.homepage-new .product-name{font-size: calc(var(--width750) * 16px); margin: calc(var(--width750) * 7px) 0 calc(var(--width750) * 3px) 0;}
.homepage-new .product-meta{font-size: calc(var(--width750) * 12px); margin-bottom: calc(var(--width750) * 4px);}
.homepage-new .product-rating{min-width: 0px; font-size: calc(var(--width750) * 11px);}
.homepage-new .product-rating b{width: calc(var(--width750) * 10px); height: calc(var(--width750) * 10px); margin: 0 calc(var(--width750) * 2px) 0 0;}
.homepage-new .product-rating span{min-width: 0px;}
.homepage-new .product-rating span:nth-of-type(1){margin: 0 calc(var(--width750) * 3px);}
.homepage-new .product-rating span:nth-of-type(2){min-width: 0px;}
.homepage-new .feed-layout{gap: calc(var(--width750) * 24px); margin: calc(var(--width750) * 32px) auto calc(var(--width750) * 32px);}
.homepage-new .feed-main{min-width: 0px;}
.homepage-new .feed-sidebar{border-radius: 0px;}
.homepage-new .feed-tabs{gap: calc(var(--width750) * 10px); padding: 0 var(--page-pad) calc(var(--width750) * 2px);}
.homepage-new .feed-tabs .tab{width: calc(var(--width750) * 98px); padding: 0 calc(var(--width750) * 24px); height: calc(var(--width750) * 32px); border-radius: calc(var(--width750) * 16px); font-size: calc(var(--width750) * 14px);}



.homepage-new .sidiv{margin: 0px;}
.homepage-new .sidiv .sidebar-list{gap: calc(var(--width750) * 16px); margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: calc(var(--width750) * 34px); border-radius: calc(var(--width750) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-hot{border-radius: calc(var(--width750) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-new{border-radius: calc(var(--width750) * 4px);}
.homepage-new .sidiv .sidebar-list a{gap: calc(var(--width750) * 8px); height: calc(var(--width750) * 34px); padding: 0 0 0 calc(var(--width750) * 7px); font-size: calc(var(--width750) * 16px); line-height: calc(var(--width750) * 34px);}
.homepage-new .sidiv .sidebar-icon{width: calc(var(--width750) * 18px); height: calc(var(--width750) * 18px); margin: 0 calc(var(--width750) * 6px) 0 0;}
.homepage-new .sidiv .sidebar-text{min-width: 0px;}
.homepage-new .sidiv .sidebar-views{gap: calc(var(--width750) * 4px); font-size: calc(var(--width750) * 16px); padding-top: 0px;}
.homepage-new .sidiv .sidebar-views .views-icon{width: calc(var(--width750) * 11px); height: calc(var(--width750) * 14px);}
.homepage-new .sidiv .products-pagination{margin-top: calc(var(--width750) * 16px);}

.homepage-new .article-list{gap: 0px; margin: calc(var(--width750) * 4px) 0 0 0;}
.homepage-new .article-item{gap: calc(var(--width750) * 12px); padding: calc(var(--width750) * 10px) 0;}
.homepage-new .article-body{min-width: 0px;}
.homepage-new .article-title{font-size: calc(var(--width750) * 16px); margin-bottom: calc(var(--width750) * 2px);}
.homepage-new .article-summary{font-size: calc(var(--width750) * 14px); max-height: calc(var(--width750) * 20px); line-height: calc(var(--width750) * 18px); margin-bottom: calc(var(--width750) * 3px);}
.homepage-new .article-tags{gap: calc(var(--width750) * 6px); margin-top: calc(var(--width750) * 4px);}
.homepage-new .article-tag{padding: calc(var(--width750) * 1px) calc(var(--width750) * 8px); border-radius: calc(var(--width750) * 11px); font-size: calc(var(--width750) * 10px);}
.idx .homepage-new .article-tag{padding: calc(var(--width750) * 1px) calc(var(--width750) * 8px);}

.homepage-new .article-info{font-size: calc(var(--width750) * 12px); gap: calc(var(--width750) * 10px);}
.homepage-new .article-thumb{width: calc(var(--width750) * 148px); height: calc(var(--width750) * 88px); border-radius: calc(var(--width750) * 6px); margin-top: calc(var(--width750) * 2px);}
.homepage-new .article-thumb-small{width: calc(var(--width750) * 88px); height: calc(var(--width750) * 88px);}
.homepage-new .btn-more-info{gap: calc(var(--width750) * 6px); height: calc(var(--width750) * 38px); margin-top: calc(var(--width750) * 16px); border-radius: calc(var(--width750) * 21px); font-size: calc(var(--width750) * 16px);}
.homepage-new .icon-more{width: calc(var(--width750) * 16px); height: calc(var(--width750) * 16px);}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{margin: 0 calc(var(--width750) * 3px) 0 0; width: calc(var(--width750) * 12px); height: calc(var(--width750) * 12px);}
.homepage-new .sidebar-title{font-size: calc(var(--width750) * 17px);}
.homepage-new .sidebar-list li{padding: 0px;}
.homepage-new .sidebar-list a{gap: calc(var(--width750) * 10px); padding: calc(var(--width750) * 12px) 0; font-size: calc(var(--width750) * 14px);}
.homepage-new .sidebar-icon{width: calc(var(--width750) * 16px); height: calc(var(--width750) * 16px); margin: 0 calc(var(--width750) * 4px) 0 0;}
.homepage-new .sidebar-text{min-width: 0px;}
.homepage-new .sidebar-views{font-size: calc(var(--width750) * 12px); padding-top: calc(var(--width750) * 2px);}













































































































































































































































































































































.idx .homepage-new .hero-title .highlight{display: inline; font-size: calc(var(--width750) * 28px); margin: 0px; width: auto; letter-spacing: calc(var(--width750) * 1px); font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}


}
@media screen and (max-width: 561px){
.homepage-new *{margin: 0px; padding: 0px;}

.homepage-new ul{padding-left: 0px;}














































.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px;}
.homepage-new .hero-inner{min-height: calc(var(--width560) * 243px);}
.homepage-new .hero-title{letter-spacing: calc(var(--width560) * 6px); font-size: calc(var(--width560) * 32px); line-height: calc(var(--width560) * 42px); margin: 0 0 calc(var(--width560) * 12px); font-weight: 400;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: calc(var(--width560) * 5px);}
.homepage-new .hero-title .highlight{margin: calc(var(--width560) * 6px) auto; letter-spacing: calc(var(--width560) * 4px); width: calc(var(--width560) * 210px);}
.homepage-new .hero-subtitle{font-size: calc(var(--width560) * 12px); margin-bottom: calc(var(--width560) * 15px); letter-spacing: calc(var(--width560) * 0.5px);}
.homepage-new .hero-btns{gap: calc(var(--width560) * 12px);}
.homepage-new .btn-primary{height: calc(var(--width560) * 32px); border-radius: calc(var(--width560) * 22px); font-size: calc(var(--width560) * 12px); width: calc(var(--width560) * 153px); gap: calc(var(--width560) * 4px);}
.homepage-new .btn-outline{--border-radius: 44px; width: calc(var(--width560) * 107px); height: calc(var(--width560) * 32px); border-radius: calc(var(--width560) * 26px); font-size: calc(var(--width560) * 12px);}
.homepage-new .btn-outline::after{left: 0px; top: 0px; border-radius: calc(var(--width560) * 26px);}
.homepage-new .section-header{margin-bottom: calc(var(--width560) * 12px);}
.homepage-new .section-title{font-size: calc(var(--width560) * 18px);}
.homepage-new .section-more{font-size: calc(var(--width560) * 14px);}
.homepage-new .section-more b{width: calc(var(--width560) * 8px); height: calc(var(--width560) * 8px); margin: 0 0 0 calc(var(--width560) * 3px);}
.homepage-new .curriculum-scroll{padding: 0 var(--page-pad) calc(var(--width560) * 4px);}
.homepage-new .curriculum-grid{gap: calc(var(--width560) * 10px);}
.homepage-new .curriculum-card{box-shadow: 0 0 calc(var(--width560) * 4px) 0 rgba(203,203,203,0.42); min-height: 0px; border-radius: calc(var(--width560) * 8px); width: calc(var(--width560) * 194px);}
.homepage-new .products{margin: calc(var(--width560) * 25px) 0 0 0;}
.homepage-new .card-body{padding: calc(var(--width560) * 10px) calc(var(--width560) * 12px) calc(var(--width560) * 12px);}
.homepage-new .card-title-row{gap: calc(var(--width560) * 6px);}
.homepage-new .card-title-row h3{font-size: calc(var(--width560) * 14px);}
.homepage-new .card-badge{padding: calc(var(--width560) * 1px) calc(var(--width560) * 8px); font-size: calc(var(--width560) * 10px); border-radius: calc(var(--width560) * 10px); line-height: calc(var(--width560) * 16px);}
.homepage-new .card-desc{margin: calc(var(--width560) * 4px) 0 calc(var(--width560) * 8px); font-size: calc(var(--width560) * 12px);}
.homepage-new .card-links{margin: 0 0 calc(var(--width560) * 8px); gap: calc(var(--width560) * 2px);}
.homepage-new .card-links a{gap: calc(var(--width560) * 5px); min-width: 0px; font-size: calc(var(--width560) * 12px); padding: calc(var(--width560) * 4px) 0;}
.homepage-new .card-links a b{width: calc(var(--width560) * 10px); height: calc(var(--width560) * 10px);}
.homepage-new .card-cta{height: calc(var(--width560) * 30px); border-radius: calc(var(--width560) * 15px); font-size: calc(var(--width560) * 12px); gap: calc(var(--width560) * 4px);}
.homepage-new .card-cta b{width: calc(var(--width560) * 8px); height: calc(var(--width560) * 8px);}
.homepage-new .curriculum-dots{gap: calc(var(--width560) * 4px); margin-top: calc(var(--width560) * 12px);}
.homepage-new .curriculum-dots .dot{width: calc(var(--width560) * 4px); height: calc(var(--width560) * 4px);}
.homepage-new .curriculum-dots .dot.active{width: calc(var(--width560) * 20px); border-radius: calc(var(--width560) * 2px);}
.homepage-new .hot-tags{padding: calc(var(--width560) * 14px) 0 0;}


.homepage-new .hot-tags-header{margin-bottom: calc(var(--width560) * 8px);}
.homepage-new .tags-list{gap: calc(var(--width560) * 8px);}
.homepage-new .tag{padding: calc(var(--width560) * 4px) calc(var(--width560) * 16px); border-radius: calc(var(--width560) * 16px); font-size: calc(var(--width560) * 14px);}

.homepage-new .products-grid{gap: calc(var(--width560) * 16px);}

.homepage-new .swiper-container.products-swiper .swiper-slide{padding: calc(var(--width560) * 4px);}
.homepage-new .swiper-container.products-swiper .products-grid{gap: calc(var(--width560) * 12px);}

.homepage-new .products-pagination{margin-top: calc(var(--width560) * 16px); gap: calc(var(--width560) * 6px);}


.homepage-new .product-card{padding: calc(var(--width560) * 10px); min-width: 0px; border-radius: calc(var(--width560) * 8px); box-shadow: 0 0 calc(var(--width560) * 4px) 0 rgba(203,203,203,0.42);}
.homepage-new .product-tags{flex-wrap: nowrap; border-radius: calc(var(--width560) * 10px); top: calc(var(--width560) * 8px); left: calc(var(--width560) * 10px); gap: calc(var(--width560) * 3px); max-width: calc(100% - calc(var(--width560) * 36px));}
.homepage-new .tagsa{padding: calc(var(--width560) * 1px) calc(var(--width560) * 5px); font-size: calc(var(--width560) * 10px); border-radius: calc(var(--width560) * 8px); white-space: nowrap;}

.homepage-new .product-thumb{border-radius: calc(var(--width560) * 8px); margin: calc(var(--width560) * 24px) 0 0 0;}
.homepage-new .product-name{font-size: calc(var(--width560) * 16px); margin: calc(var(--width560) * 7px) 0 calc(var(--width560) * 3px) 0;}
.homepage-new .product-meta{font-size: calc(var(--width560) * 12px); margin-bottom: calc(var(--width560) * 4px);}
.homepage-new .product-rating{min-width: 0px; font-size: calc(var(--width560) * 11px);}
.homepage-new .product-rating b{width: calc(var(--width560) * 10px); height: calc(var(--width560) * 10px); margin: 0 calc(var(--width560) * 2px) 0 0;}
.homepage-new .product-rating span{min-width: 0px;}
.homepage-new .product-rating span:nth-of-type(1){margin: 0 calc(var(--width560) * 3px);}
.homepage-new .product-rating span:nth-of-type(2){min-width: 0px;}
.homepage-new .feed-layout{gap: calc(var(--width560) * 24px); margin: calc(var(--width560) * 32px) auto calc(var(--width560) * 32px);}
.homepage-new .feed-main{min-width: 0px;}
.homepage-new .feed-sidebar{border-radius: 0px;}
.homepage-new .feed-tabs{gap: calc(var(--width560) * 10px); padding: 0 var(--page-pad) calc(var(--width560) * 2px);}
.homepage-new .feed-tabs .tab{width: calc(var(--width560) * 98px); padding: 0 calc(var(--width560) * 24px); height: calc(var(--width560) * 32px); border-radius: calc(var(--width560) * 16px); font-size: calc(var(--width560) * 14px);}



.homepage-new .sidiv{margin: 0px;}
.homepage-new .sidiv .sidebar-list{gap: calc(var(--width560) * 16px); margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: calc(var(--width560) * 34px); border-radius: calc(var(--width560) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-hot{border-radius: calc(var(--width560) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-new{border-radius: calc(var(--width560) * 4px);}
.homepage-new .sidiv .sidebar-list a{gap: calc(var(--width560) * 8px); height: calc(var(--width560) * 34px); padding: 0 0 0 calc(var(--width560) * 7px); font-size: calc(var(--width560) * 16px); line-height: calc(var(--width560) * 34px);}
.homepage-new .sidiv .sidebar-icon{width: calc(var(--width560) * 18px); height: calc(var(--width560) * 18px); margin: 0 calc(var(--width560) * 6px) 0 0;}
.homepage-new .sidiv .sidebar-text{min-width: 0px;}
.homepage-new .sidiv .sidebar-views{gap: calc(var(--width560) * 4px); font-size: calc(var(--width560) * 16px); padding-top: 0px;}
.homepage-new .sidiv .sidebar-views .views-icon{width: calc(var(--width560) * 11px); height: calc(var(--width560) * 14px);}
.homepage-new .sidiv .products-pagination{margin-top: calc(var(--width560) * 16px);}

.homepage-new .article-list{gap: 0px; margin: calc(var(--width560) * 4px) 0 0 0;}
.homepage-new .article-item{gap: calc(var(--width560) * 12px); padding: calc(var(--width560) * 10px) 0;}
.homepage-new .article-body{min-width: 0px;}
.homepage-new .article-title{font-size: calc(var(--width560) * 16px); margin-bottom: calc(var(--width560) * 2px);}
.homepage-new .article-summary{font-size: calc(var(--width560) * 14px); max-height: calc(var(--width560) * 20px); line-height: calc(var(--width560) * 18px); margin-bottom: calc(var(--width560) * 3px);}
.homepage-new .article-tags{gap: calc(var(--width560) * 6px); margin-top: calc(var(--width560) * 4px);}
.homepage-new .article-tag{padding: calc(var(--width560) * 1px) calc(var(--width560) * 8px); border-radius: calc(var(--width560) * 11px); font-size: calc(var(--width560) * 10px);}
.idx .homepage-new .article-tag{padding: calc(var(--width560) * 1px) calc(var(--width560) * 8px);}

.homepage-new .article-info{font-size: calc(var(--width560) * 12px); gap: calc(var(--width560) * 10px);}
.homepage-new .article-thumb{width: calc(var(--width560) * 148px); height: calc(var(--width560) * 88px); border-radius: calc(var(--width560) * 6px); margin-top: calc(var(--width560) * 2px);}
.homepage-new .article-thumb-small{width: calc(var(--width560) * 88px); height: calc(var(--width560) * 88px);}
.homepage-new .btn-more-info{gap: calc(var(--width560) * 6px); height: calc(var(--width560) * 38px); margin-top: calc(var(--width560) * 16px); border-radius: calc(var(--width560) * 21px); font-size: calc(var(--width560) * 16px);}
.homepage-new .icon-more{width: calc(var(--width560) * 16px); height: calc(var(--width560) * 16px);}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{margin: 0 calc(var(--width560) * 3px) 0 0; width: calc(var(--width560) * 12px); height: calc(var(--width560) * 12px);}
.homepage-new .sidebar-title{font-size: calc(var(--width560) * 17px);}
.homepage-new .sidebar-list li{padding: 0px;}
.homepage-new .sidebar-list a{gap: calc(var(--width560) * 10px); padding: calc(var(--width560) * 12px) 0; font-size: calc(var(--width560) * 14px);}
.homepage-new .sidebar-icon{width: calc(var(--width560) * 16px); height: calc(var(--width560) * 16px); margin: 0 calc(var(--width560) * 4px) 0 0;}
.homepage-new .sidebar-text{min-width: 0px;}
.homepage-new .sidebar-views{font-size: calc(var(--width560) * 12px); padding-top: calc(var(--width560) * 2px);}













































































































































































































































































































































.idx .homepage-new .hero-title .highlight{display: inline; font-size: calc(var(--width560) * 28px); margin: 0px; width: auto; letter-spacing: calc(var(--width560) * 1px); font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}


}
@media screen and (max-width: 541px){
.homepage-new *{margin: 0px; padding: 0px;}

.homepage-new ul{padding-left: 0px;}














































.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px;}
.homepage-new .hero-inner{min-height: calc(var(--width540) * 243px);}
.homepage-new .hero-title{letter-spacing: calc(var(--width540) * 6px); font-size: calc(var(--width540) * 32px); line-height: calc(var(--width540) * 42px); margin: 0 0 calc(var(--width540) * 12px); font-weight: 400;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: calc(var(--width540) * 5px);}
.homepage-new .hero-title .highlight{margin: calc(var(--width540) * 6px) auto; letter-spacing: calc(var(--width540) * 4px); width: calc(var(--width540) * 210px);}
.homepage-new .hero-subtitle{font-size: calc(var(--width540) * 12px); margin-bottom: calc(var(--width540) * 15px); letter-spacing: calc(var(--width540) * 0.5px);}
.homepage-new .hero-btns{gap: calc(var(--width540) * 12px);}
.homepage-new .btn-primary{height: calc(var(--width540) * 32px); border-radius: calc(var(--width540) * 22px); font-size: calc(var(--width540) * 12px); width: calc(var(--width540) * 153px); gap: calc(var(--width540) * 4px);}
.homepage-new .btn-outline{--border-radius: 44px; width: calc(var(--width540) * 107px); height: calc(var(--width540) * 32px); border-radius: calc(var(--width540) * 26px); font-size: calc(var(--width540) * 12px);}
.homepage-new .btn-outline::after{left: 0px; top: 0px; border-radius: calc(var(--width540) * 26px);}
.homepage-new .section-header{margin-bottom: calc(var(--width540) * 12px);}
.homepage-new .section-title{font-size: calc(var(--width540) * 18px);}
.homepage-new .section-more{font-size: calc(var(--width540) * 14px);}
.homepage-new .section-more b{width: calc(var(--width540) * 8px); height: calc(var(--width540) * 8px); margin: 0 0 0 calc(var(--width540) * 3px);}
.homepage-new .curriculum-scroll{padding: 0 var(--page-pad) calc(var(--width540) * 4px);}
.homepage-new .curriculum-grid{gap: calc(var(--width540) * 10px);}
.homepage-new .curriculum-card{box-shadow: 0 0 calc(var(--width540) * 4px) 0 rgba(203,203,203,0.42); min-height: 0px; border-radius: calc(var(--width540) * 8px); width: calc(var(--width540) * 194px);}
.homepage-new .products{margin: calc(var(--width540) * 25px) 0 0 0;}
.homepage-new .card-body{padding: calc(var(--width540) * 10px) calc(var(--width540) * 12px) calc(var(--width540) * 12px);}
.homepage-new .card-title-row{gap: calc(var(--width540) * 6px);}
.homepage-new .card-title-row h3{font-size: calc(var(--width540) * 14px);}
.homepage-new .card-badge{padding: calc(var(--width540) * 1px) calc(var(--width540) * 8px); font-size: calc(var(--width540) * 10px); border-radius: calc(var(--width540) * 10px); line-height: calc(var(--width540) * 16px);}
.homepage-new .card-desc{margin: calc(var(--width540) * 4px) 0 calc(var(--width540) * 8px); font-size: calc(var(--width540) * 12px);}
.homepage-new .card-links{margin: 0 0 calc(var(--width540) * 8px); gap: calc(var(--width540) * 2px);}
.homepage-new .card-links a{gap: calc(var(--width540) * 5px); min-width: 0px; font-size: calc(var(--width540) * 12px); padding: calc(var(--width540) * 4px) 0;}
.homepage-new .card-links a b{width: calc(var(--width540) * 10px); height: calc(var(--width540) * 10px);}
.homepage-new .card-cta{height: calc(var(--width540) * 30px); border-radius: calc(var(--width540) * 15px); font-size: calc(var(--width540) * 12px); gap: calc(var(--width540) * 4px);}
.homepage-new .card-cta b{width: calc(var(--width540) * 8px); height: calc(var(--width540) * 8px);}
.homepage-new .curriculum-dots{gap: calc(var(--width540) * 4px); margin-top: calc(var(--width540) * 12px);}
.homepage-new .curriculum-dots .dot{width: calc(var(--width540) * 4px); height: calc(var(--width540) * 4px);}
.homepage-new .curriculum-dots .dot.active{width: calc(var(--width540) * 20px); border-radius: calc(var(--width540) * 2px);}
.homepage-new .hot-tags{padding: calc(var(--width540) * 14px) 0 0;}


.homepage-new .hot-tags-header{margin-bottom: calc(var(--width540) * 8px);}
.homepage-new .tags-list{gap: calc(var(--width540) * 8px);}
.homepage-new .tag{padding: calc(var(--width540) * 4px) calc(var(--width540) * 16px); border-radius: calc(var(--width540) * 16px); font-size: calc(var(--width540) * 14px);}

.homepage-new .products-grid{gap: calc(var(--width540) * 16px);}

.homepage-new .swiper-container.products-swiper .swiper-slide{padding: calc(var(--width540) * 4px);}
.homepage-new .swiper-container.products-swiper .products-grid{gap: calc(var(--width540) * 12px);}

.homepage-new .products-pagination{margin-top: calc(var(--width540) * 16px); gap: calc(var(--width540) * 6px);}


.homepage-new .product-card{padding: calc(var(--width540) * 10px); min-width: 0px; border-radius: calc(var(--width540) * 8px); box-shadow: 0 0 calc(var(--width540) * 4px) 0 rgba(203,203,203,0.42);}
.homepage-new .product-tags{flex-wrap: nowrap; border-radius: calc(var(--width540) * 10px); top: calc(var(--width540) * 8px); left: calc(var(--width540) * 10px); gap: calc(var(--width540) * 3px); max-width: calc(100% - calc(var(--width540) * 36px));}
.homepage-new .tagsa{padding: calc(var(--width540) * 1px) calc(var(--width540) * 5px); font-size: calc(var(--width540) * 10px); border-radius: calc(var(--width540) * 8px); white-space: nowrap;}

.homepage-new .product-thumb{border-radius: calc(var(--width540) * 8px); margin: calc(var(--width540) * 24px) 0 0 0;}
.homepage-new .product-name{font-size: calc(var(--width540) * 16px); margin: calc(var(--width540) * 7px) 0 calc(var(--width540) * 3px) 0;}
.homepage-new .product-meta{font-size: calc(var(--width540) * 12px); margin-bottom: calc(var(--width540) * 4px);}
.homepage-new .product-rating{min-width: 0px; font-size: calc(var(--width540) * 11px);}
.homepage-new .product-rating b{width: calc(var(--width540) * 10px); height: calc(var(--width540) * 10px); margin: 0 calc(var(--width540) * 2px) 0 0;}
.homepage-new .product-rating span{min-width: 0px;}
.homepage-new .product-rating span:nth-of-type(1){margin: 0 calc(var(--width540) * 3px);}
.homepage-new .product-rating span:nth-of-type(2){min-width: 0px;}
.homepage-new .feed-layout{gap: calc(var(--width540) * 24px); margin: calc(var(--width540) * 32px) auto calc(var(--width540) * 32px);}
.homepage-new .feed-main{min-width: 0px;}
.homepage-new .feed-sidebar{border-radius: 0px;}
.homepage-new .feed-tabs{gap: calc(var(--width540) * 10px); padding: 0 var(--page-pad) calc(var(--width540) * 2px);}
.homepage-new .feed-tabs .tab{width: calc(var(--width540) * 98px); padding: 0 calc(var(--width540) * 24px); height: calc(var(--width540) * 32px); border-radius: calc(var(--width540) * 16px); font-size: calc(var(--width540) * 14px);}



.homepage-new .sidiv{margin: 0px;}
.homepage-new .sidiv .sidebar-list{gap: calc(var(--width540) * 16px); margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: calc(var(--width540) * 34px); border-radius: calc(var(--width540) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-hot{border-radius: calc(var(--width540) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-new{border-radius: calc(var(--width540) * 4px);}
.homepage-new .sidiv .sidebar-list a{gap: calc(var(--width540) * 8px); height: calc(var(--width540) * 34px); padding: 0 0 0 calc(var(--width540) * 7px); font-size: calc(var(--width540) * 16px); line-height: calc(var(--width540) * 34px);}
.homepage-new .sidiv .sidebar-icon{width: calc(var(--width540) * 18px); height: calc(var(--width540) * 18px); margin: 0 calc(var(--width540) * 6px) 0 0;}
.homepage-new .sidiv .sidebar-text{min-width: 0px;}
.homepage-new .sidiv .sidebar-views{gap: calc(var(--width540) * 4px); font-size: calc(var(--width540) * 16px); padding-top: 0px;}
.homepage-new .sidiv .sidebar-views .views-icon{width: calc(var(--width540) * 11px); height: calc(var(--width540) * 14px);}
.homepage-new .sidiv .products-pagination{margin-top: calc(var(--width540) * 16px);}

.homepage-new .article-list{gap: 0px; margin: calc(var(--width540) * 4px) 0 0 0;}
.homepage-new .article-item{gap: calc(var(--width540) * 12px); padding: calc(var(--width540) * 10px) 0;}
.homepage-new .article-body{min-width: 0px;}
.homepage-new .article-title{font-size: calc(var(--width540) * 16px); margin-bottom: calc(var(--width540) * 2px);}
.homepage-new .article-summary{font-size: calc(var(--width540) * 14px); max-height: calc(var(--width540) * 20px); line-height: calc(var(--width540) * 18px); margin-bottom: calc(var(--width540) * 3px);}
.homepage-new .article-tags{gap: calc(var(--width540) * 6px); margin-top: calc(var(--width540) * 4px);}
.homepage-new .article-tag{padding: calc(var(--width540) * 1px) calc(var(--width540) * 8px); border-radius: calc(var(--width540) * 11px); font-size: calc(var(--width540) * 10px);}
.idx .homepage-new .article-tag{padding: calc(var(--width540) * 1px) calc(var(--width540) * 8px);}

.homepage-new .article-info{font-size: calc(var(--width540) * 12px); gap: calc(var(--width540) * 10px);}
.homepage-new .article-thumb{width: calc(var(--width540) * 148px); height: calc(var(--width540) * 88px); border-radius: calc(var(--width540) * 6px); margin-top: calc(var(--width540) * 2px);}
.homepage-new .article-thumb-small{width: calc(var(--width540) * 88px); height: calc(var(--width540) * 88px);}
.homepage-new .btn-more-info{gap: calc(var(--width540) * 6px); height: calc(var(--width540) * 38px); margin-top: calc(var(--width540) * 16px); border-radius: calc(var(--width540) * 21px); font-size: calc(var(--width540) * 16px);}
.homepage-new .icon-more{width: calc(var(--width540) * 16px); height: calc(var(--width540) * 16px);}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{margin: 0 calc(var(--width540) * 3px) 0 0; width: calc(var(--width540) * 12px); height: calc(var(--width540) * 12px);}
.homepage-new .sidebar-title{font-size: calc(var(--width540) * 17px);}
.homepage-new .sidebar-list li{padding: 0px;}
.homepage-new .sidebar-list a{gap: calc(var(--width540) * 10px); padding: calc(var(--width540) * 12px) 0; font-size: calc(var(--width540) * 14px);}
.homepage-new .sidebar-icon{width: calc(var(--width540) * 16px); height: calc(var(--width540) * 16px); margin: 0 calc(var(--width540) * 4px) 0 0;}
.homepage-new .sidebar-text{min-width: 0px;}
.homepage-new .sidebar-views{font-size: calc(var(--width540) * 12px); padding-top: calc(var(--width540) * 2px);}













































































































































































































































































































































.idx .homepage-new .hero-title .highlight{display: inline; font-size: calc(var(--width540) * 28px); margin: 0px; width: auto; letter-spacing: calc(var(--width540) * 1px); font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}


}
@media screen and (max-width: 516px){
.homepage-new *{margin: 0px; padding: 0px;}

.homepage-new ul{padding-left: 0px;}














































.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px;}
.homepage-new .hero-inner{min-height: calc(var(--width516) * 243px);}
.homepage-new .hero-title{letter-spacing: calc(var(--width516) * 6px); font-size: calc(var(--width516) * 32px); line-height: calc(var(--width516) * 42px); margin: 0 0 calc(var(--width516) * 12px); font-weight: 400;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: calc(var(--width516) * 5px);}
.homepage-new .hero-title .highlight{margin: calc(var(--width516) * 6px) auto; letter-spacing: calc(var(--width516) * 4px); width: calc(var(--width516) * 210px);}
.homepage-new .hero-subtitle{font-size: calc(var(--width516) * 12px); margin-bottom: calc(var(--width516) * 15px); letter-spacing: calc(var(--width516) * 0.5px);}
.homepage-new .hero-btns{gap: calc(var(--width516) * 12px);}
.homepage-new .btn-primary{height: calc(var(--width516) * 32px); border-radius: calc(var(--width516) * 22px); font-size: calc(var(--width516) * 12px); width: calc(var(--width516) * 153px); gap: calc(var(--width516) * 4px);}
.homepage-new .btn-outline{--border-radius: 44px; width: calc(var(--width516) * 107px); height: calc(var(--width516) * 32px); border-radius: calc(var(--width516) * 26px); font-size: calc(var(--width516) * 12px);}
.homepage-new .btn-outline::after{left: 0px; top: 0px; border-radius: calc(var(--width516) * 26px);}
.homepage-new .section-header{margin-bottom: calc(var(--width516) * 12px);}
.homepage-new .section-title{font-size: calc(var(--width516) * 18px);}
.homepage-new .section-more{font-size: calc(var(--width516) * 14px);}
.homepage-new .section-more b{width: calc(var(--width516) * 8px); height: calc(var(--width516) * 8px); margin: 0 0 0 calc(var(--width516) * 3px);}
.homepage-new .curriculum-scroll{padding: 0 var(--page-pad) calc(var(--width516) * 4px);}
.homepage-new .curriculum-grid{gap: calc(var(--width516) * 10px);}
.homepage-new .curriculum-card{box-shadow: 0 0 calc(var(--width516) * 4px) 0 rgba(203,203,203,0.42); min-height: 0px; border-radius: calc(var(--width516) * 8px); width: calc(var(--width516) * 194px);}
.homepage-new .products{margin: calc(var(--width516) * 25px) 0 0 0;}
.homepage-new .card-body{padding: calc(var(--width516) * 10px) calc(var(--width516) * 12px) calc(var(--width516) * 12px);}
.homepage-new .card-title-row{gap: calc(var(--width516) * 6px);}
.homepage-new .card-title-row h3{font-size: calc(var(--width516) * 14px);}
.homepage-new .card-badge{padding: calc(var(--width516) * 1px) calc(var(--width516) * 8px); font-size: calc(var(--width516) * 10px); border-radius: calc(var(--width516) * 10px); line-height: calc(var(--width516) * 16px);}
.homepage-new .card-desc{margin: calc(var(--width516) * 4px) 0 calc(var(--width516) * 8px); font-size: calc(var(--width516) * 12px);}
.homepage-new .card-links{margin: 0 0 calc(var(--width516) * 8px); gap: calc(var(--width516) * 2px);}
.homepage-new .card-links a{gap: calc(var(--width516) * 5px); min-width: 0px; font-size: calc(var(--width516) * 12px); padding: calc(var(--width516) * 4px) 0;}
.homepage-new .card-links a b{width: calc(var(--width516) * 10px); height: calc(var(--width516) * 10px);}
.homepage-new .card-cta{height: calc(var(--width516) * 30px); border-radius: calc(var(--width516) * 15px); font-size: calc(var(--width516) * 12px); gap: calc(var(--width516) * 4px);}
.homepage-new .card-cta b{width: calc(var(--width516) * 8px); height: calc(var(--width516) * 8px);}
.homepage-new .curriculum-dots{gap: calc(var(--width516) * 4px); margin-top: calc(var(--width516) * 12px);}
.homepage-new .curriculum-dots .dot{width: calc(var(--width516) * 4px); height: calc(var(--width516) * 4px);}
.homepage-new .curriculum-dots .dot.active{width: calc(var(--width516) * 20px); border-radius: calc(var(--width516) * 2px);}
.homepage-new .hot-tags{padding: calc(var(--width516) * 14px) 0 0;}


.homepage-new .hot-tags-header{margin-bottom: calc(var(--width516) * 8px);}
.homepage-new .tags-list{gap: calc(var(--width516) * 8px);}
.homepage-new .tag{padding: calc(var(--width516) * 4px) calc(var(--width516) * 16px); border-radius: calc(var(--width516) * 16px); font-size: calc(var(--width516) * 14px);}

.homepage-new .products-grid{gap: calc(var(--width516) * 16px);}

.homepage-new .swiper-container.products-swiper .swiper-slide{padding: calc(var(--width516) * 4px);}
.homepage-new .swiper-container.products-swiper .products-grid{gap: calc(var(--width516) * 12px);}

.homepage-new .products-pagination{margin-top: calc(var(--width516) * 16px); gap: calc(var(--width516) * 6px);}


.homepage-new .product-card{padding: calc(var(--width516) * 10px); min-width: 0px; border-radius: calc(var(--width516) * 8px); box-shadow: 0 0 calc(var(--width516) * 4px) 0 rgba(203,203,203,0.42);}
.homepage-new .product-tags{flex-wrap: nowrap; border-radius: calc(var(--width516) * 10px); top: calc(var(--width516) * 8px); left: calc(var(--width516) * 10px); gap: calc(var(--width516) * 3px); max-width: calc(100% - calc(var(--width516) * 36px));}
.homepage-new .tagsa{padding: calc(var(--width516) * 1px) calc(var(--width516) * 5px); font-size: calc(var(--width516) * 10px); border-radius: calc(var(--width516) * 8px); white-space: nowrap;}

.homepage-new .product-thumb{border-radius: calc(var(--width516) * 8px); margin: calc(var(--width516) * 24px) 0 0 0;}
.homepage-new .product-name{font-size: calc(var(--width516) * 16px); margin: calc(var(--width516) * 7px) 0 calc(var(--width516) * 3px) 0;}
.homepage-new .product-meta{font-size: calc(var(--width516) * 12px); margin-bottom: calc(var(--width516) * 4px);}
.homepage-new .product-rating{min-width: 0px; font-size: calc(var(--width516) * 11px);}
.homepage-new .product-rating b{width: calc(var(--width516) * 10px); height: calc(var(--width516) * 10px); margin: 0 calc(var(--width516) * 2px) 0 0;}
.homepage-new .product-rating span{min-width: 0px;}
.homepage-new .product-rating span:nth-of-type(1){margin: 0 calc(var(--width516) * 3px);}
.homepage-new .product-rating span:nth-of-type(2){min-width: 0px;}
.homepage-new .feed-layout{gap: calc(var(--width516) * 24px); margin: calc(var(--width516) * 32px) auto calc(var(--width516) * 32px);}
.homepage-new .feed-main{min-width: 0px;}
.homepage-new .feed-sidebar{border-radius: 0px;}
.homepage-new .feed-tabs{gap: calc(var(--width516) * 10px); padding: 0 var(--page-pad) calc(var(--width516) * 2px);}
.homepage-new .feed-tabs .tab{width: calc(var(--width516) * 98px); padding: 0 calc(var(--width516) * 24px); height: calc(var(--width516) * 32px); border-radius: calc(var(--width516) * 16px); font-size: calc(var(--width516) * 14px);}



.homepage-new .sidiv{margin: 0px;}
.homepage-new .sidiv .sidebar-list{gap: calc(var(--width516) * 16px); margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: calc(var(--width516) * 34px); border-radius: calc(var(--width516) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-hot{border-radius: calc(var(--width516) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-new{border-radius: calc(var(--width516) * 4px);}
.homepage-new .sidiv .sidebar-list a{gap: calc(var(--width516) * 8px); height: calc(var(--width516) * 34px); padding: 0 0 0 calc(var(--width516) * 7px); font-size: calc(var(--width516) * 16px); line-height: calc(var(--width516) * 34px);}
.homepage-new .sidiv .sidebar-icon{width: calc(var(--width516) * 18px); height: calc(var(--width516) * 18px); margin: 0 calc(var(--width516) * 6px) 0 0;}
.homepage-new .sidiv .sidebar-text{min-width: 0px;}
.homepage-new .sidiv .sidebar-views{gap: calc(var(--width516) * 4px); font-size: calc(var(--width516) * 16px); padding-top: 0px;}
.homepage-new .sidiv .sidebar-views .views-icon{width: calc(var(--width516) * 11px); height: calc(var(--width516) * 14px);}
.homepage-new .sidiv .products-pagination{margin-top: calc(var(--width516) * 16px);}

.homepage-new .article-list{gap: 0px; margin: calc(var(--width516) * 4px) 0 0 0;}
.homepage-new .article-item{gap: calc(var(--width516) * 12px); padding: calc(var(--width516) * 10px) 0;}
.homepage-new .article-body{min-width: 0px;}
.homepage-new .article-title{font-size: calc(var(--width516) * 16px); margin-bottom: calc(var(--width516) * 2px);}
.homepage-new .article-summary{font-size: calc(var(--width516) * 14px); max-height: calc(var(--width516) * 20px); line-height: calc(var(--width516) * 18px); margin-bottom: calc(var(--width516) * 3px);}
.homepage-new .article-tags{gap: calc(var(--width516) * 6px); margin-top: calc(var(--width516) * 4px);}
.homepage-new .article-tag{padding: calc(var(--width516) * 1px) calc(var(--width516) * 8px); border-radius: calc(var(--width516) * 11px); font-size: calc(var(--width516) * 10px);}
.idx .homepage-new .article-tag{padding: calc(var(--width516) * 1px) calc(var(--width516) * 8px);}

.homepage-new .article-info{font-size: calc(var(--width516) * 12px); gap: calc(var(--width516) * 10px);}
.homepage-new .article-thumb{width: calc(var(--width516) * 148px); height: calc(var(--width516) * 88px); border-radius: calc(var(--width516) * 6px); margin-top: calc(var(--width516) * 2px);}
.homepage-new .article-thumb-small{width: calc(var(--width516) * 88px); height: calc(var(--width516) * 88px);}
.homepage-new .btn-more-info{gap: calc(var(--width516) * 6px); height: calc(var(--width516) * 38px); margin-top: calc(var(--width516) * 16px); border-radius: calc(var(--width516) * 21px); font-size: calc(var(--width516) * 16px);}
.homepage-new .icon-more{width: calc(var(--width516) * 16px); height: calc(var(--width516) * 16px);}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{margin: 0 calc(var(--width516) * 3px) 0 0; width: calc(var(--width516) * 12px); height: calc(var(--width516) * 12px);}
.homepage-new .sidebar-title{font-size: calc(var(--width516) * 17px);}
.homepage-new .sidebar-list li{padding: 0px;}
.homepage-new .sidebar-list a{gap: calc(var(--width516) * 10px); padding: calc(var(--width516) * 12px) 0; font-size: calc(var(--width516) * 14px);}
.homepage-new .sidebar-icon{width: calc(var(--width516) * 16px); height: calc(var(--width516) * 16px); margin: 0 calc(var(--width516) * 4px) 0 0;}
.homepage-new .sidebar-text{min-width: 0px;}
.homepage-new .sidebar-views{font-size: calc(var(--width516) * 12px); padding-top: calc(var(--width516) * 2px);}













































































































































































































































































































































.idx .homepage-new .hero-title .highlight{display: inline; font-size: calc(var(--width516) * 28px); margin: 0px; width: auto; letter-spacing: calc(var(--width516) * 1px); font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}


}
@media screen and (max-width: 501px){}
@media screen and (max-width: 431px){
.homepage-new *{margin: 0px; padding: 0px;}

.homepage-new ul{padding-left: 0px;}














































.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px;}
.homepage-new .hero-inner{min-height: 243px;}
.homepage-new .hero-title{letter-spacing: 6px; font-size: 32px; line-height: 42px; font-weight: 400; margin: 0px 0px 12px;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: 5px;}
.homepage-new .hero-title .highlight{margin: 6px auto; letter-spacing: 4px; width: 210px;}
.homepage-new .hero-subtitle{font-size: 12px; margin-bottom: 15px; letter-spacing: 0.5px;}
.idx .homepage-new .hero-title .highlight{display: inline; font-size: 28px; margin: 0px; width: auto; letter-spacing: 1px; font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}
.homepage-new .hero-btns{gap: 12px;}
.homepage-new .btn-primary{width: 153px; gap: 4px; height: 32px; border-radius: 22px; font-size: 12px;}
.homepage-new .btn-outline{--border-radius: 44px; width: 107px; height: 32px; border-radius: 26px; font-size: 12px;}
.homepage-new .btn-outline::after{left: 0px; top: 0px; border-radius: 26px;}
.homepage-new .section-header{margin-bottom: 12px;}
.homepage-new .section-title{font-size: 18px;}
.homepage-new .section-more{font-size: 14px;}
.homepage-new .section-more b{width: 8px; height: 8px; margin: 0px 0px 0px 3px;}
.homepage-new .curriculum-scroll{padding: 0 var(--page-pad) 4px;}
.homepage-new .curriculum-grid{gap: 10px;}
.homepage-new .curriculum-card{box-shadow: rgba(203, 203, 203, 0.42) 0px 0px 4px 0px; min-height: 0px; border-radius: 8px; width: 194px;}
.homepage-new .products{margin: 25px 0px 0px;}
.homepage-new .card-cover img{aspect-ratio: 388 / 158;}
.homepage-new .card-body{padding: 10px 12px 12px;}
.homepage-new .card-title-row{gap: 6px;}
.homepage-new .card-title-row h3{font-size: 14px;}
.homepage-new .card-badge{padding: 1px 8px; font-size: 10px; border-radius: 10px; line-height: 16px;}
.homepage-new .card-desc{margin: 4px 0px 14px; font-size: 12px;}
.homepage-new .card-links{margin: 0px 0px 8px; gap: 2px;}
.homepage-new .card-links a{gap: 5px; line-height: 14px; padding: 6px 0px; font-size: 12px;}
.homepage-new .card-links a b{width: 10px; height: 10px;}
.homepage-new .card-cta{height: 30px; border-radius: 15px; font-size: 12px; gap: 4px;}
.homepage-new .card-cta b{width: 8px; height: 8px;}
.homepage-new .curriculum-dots{gap: 4px; margin-top: 12px;}
.homepage-new .curriculum-dots .dot{width: 4px; height: 4px;}
.homepage-new .curriculum-dots .dot.active{width: 20px; border-radius: 2px;}
.homepage-new .hot-tags{padding: 14px 0px 0px;}


.homepage-new .hot-tags-header{margin-bottom: 8px;}
.homepage-new .tags-list{gap: 8px;}
.homepage-new .tag{padding: 4px 16px; border-radius: 16px; font-size: 14px;}

.homepage-new .products-grid{gap: 16px;}

.homepage-new .swiper-container.products-swiper .swiper-slide{padding: 4px;}
.homepage-new .swiper-container.products-swiper .products-grid{gap: 12px;}

.homepage-new .products-pagination{margin-top: 16px; gap: 6px;}


.homepage-new .product-card{padding: 10px; min-width: 0px; border-radius: 8px; box-shadow: rgba(203, 203, 203, 0.42) 0px 0px 4px 0px;}
.homepage-new .product-tags{flex-wrap: nowrap; border-radius: 10px; top: 8px; left: 10px; gap: 3px; max-width: calc(100% - 36px);}
.homepage-new .tagsa{padding: 1px 5px; font-size: 10px; border-radius: 8px; white-space: nowrap;}

.homepage-new .product-thumb{border-radius: 8px; margin: 24px 0px 0px;}
.homepage-new .product-name{font-size: 16px; margin: 7px 0px 3px;}
.homepage-new .product-meta{font-size: 12px; margin-bottom: 4px;}
.homepage-new .product-rating{min-width: 0px; font-size: 11px;}
.homepage-new .product-rating b{width: 10px; height: 10px; margin: 0px 2px 0px 0px;}
.homepage-new .product-rating span{min-width: 0px;}
.homepage-new .product-rating span:nth-of-type(1){margin: 0px 3px;}
.homepage-new .product-rating span:nth-of-type(2){min-width: 0px;}
.homepage-new .feed-layout{gap: 24px; margin: 32px auto;}
.homepage-new .feed-main{min-width: 0px;}
.homepage-new .feed-sidebar{border-radius: 0px;}
.homepage-new .feed-tabs{gap: 10px; padding: 0 var(--page-pad) 2px;}
.homepage-new .feed-tabs .tab{width: 98px; padding: 0px 24px; height: 32px; border-radius: 16px; font-size: 14px;}



.homepage-new .sidiv{margin: 0px;}
.homepage-new .sidiv .sidebar-list{gap: 16px; margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: 34px; border-radius: 4px;}
.homepage-new .sidiv .sidebar-list li.is-hot{border-radius: 4px;}
.homepage-new .sidiv .sidebar-list li.is-new{border-radius: 4px;}
.homepage-new .sidiv .sidebar-list a{gap: 8px; height: 34px; padding: 0px 0px 0px 7px; font-size: 16px; line-height: 34px;}
.homepage-new .sidiv .sidebar-icon{width: 18px; height: 18px; margin: 0px 6px 0px 0px;}
.homepage-new .sidiv .sidebar-text{min-width: 0px;}
.homepage-new .sidiv .sidebar-views{gap: 4px; font-size: 16px; padding-top: 0px;}
.homepage-new .sidiv .sidebar-views .views-icon{width: 11px; height: 14px;}
.homepage-new .sidiv .products-pagination{margin-top: 16px;}

.homepage-new .article-list{gap: 0px; margin: 4px 0px 0px;}
.homepage-new .article-item{gap: 12px; padding: 10px 0px;}
.homepage-new .article-body{min-width: 0px;}
.homepage-new .article-title{font-size: 16px; margin-bottom: 2px;}
.homepage-new .article-summary{font-size: 14px; max-height: 20px; line-height: 18px; margin-bottom: 3px;}
.homepage-new .article-tags{gap: 6px; margin-top: 4px;}
.homepage-new .article-tag{padding: 1px 8px; border-radius: 11px; font-size: 10px;}
.idx .homepage-new .article-tag{padding: 1px 8px;}

.homepage-new .article-info{font-size: 12px; gap: 10px;}
.homepage-new .article-thumb{width: 148px; height: 88px; border-radius: 6px; margin-top: 2px;}
.homepage-new .article-thumb-small{width: 88px; height: 88px;}
.homepage-new .btn-more-info{gap: 6px; height: 38px; margin-top: 16px; border-radius: 21px; font-size: 16px;}
.homepage-new .icon-more{width: 16px; height: 16px;}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{margin: 0px 3px 0px 0px; width: 12px; height: 12px;}
.homepage-new .sidebar-title{font-size: 17px;}
.homepage-new .sidebar-list li{padding: 0px;}
.homepage-new .sidebar-list a{gap: 10px; padding: 12px 0px; font-size: 14px;}
.homepage-new .sidebar-icon{width: 16px; height: 16px; margin: 0px 4px 0px 0px;}
.homepage-new .sidebar-text{min-width: 0px;}
.homepage-new .sidebar-views{font-size: 12px; padding-top: 2px;}















































































































































































































































































































































}
@media screen and (max-width: 415px){
.homepage-new *{margin: 0px; padding: 0px;}

.homepage-new ul{padding-left: 0px;}














































.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px;}
.homepage-new .hero-inner{min-height: calc(var(--width415) * 243px);}
.homepage-new .hero-title{letter-spacing: calc(var(--width415) * 6px); font-size: calc(var(--width415) * 32px); line-height: calc(var(--width415) * 42px); margin: 0 0 calc(var(--width415) * 12px); font-weight: 400;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: calc(var(--width415) * 5px);}
.homepage-new .hero-title .highlight{margin: calc(var(--width415) * 6px) auto; letter-spacing: calc(var(--width415) * 4px); width: calc(var(--width415) * 210px);}
.homepage-new .hero-subtitle{font-size: calc(var(--width415) * 12px); margin-bottom: calc(var(--width415) * 15px); letter-spacing: calc(var(--width415) * 0.5px);}
.homepage-new .hero-btns{gap: calc(var(--width415) * 12px);}
.homepage-new .btn-primary{height: calc(var(--width415) * 32px); border-radius: calc(var(--width415) * 22px); font-size: calc(var(--width415) * 12px); width: calc(var(--width415) * 153px); gap: calc(var(--width415) * 4px);}
.homepage-new .btn-outline{--border-radius: 44px; width: calc(var(--width415) * 107px); height: calc(var(--width415) * 32px); border-radius: calc(var(--width415) * 26px); font-size: calc(var(--width415) * 12px);}
.homepage-new .btn-outline::after{left: 0px; top: 0px; border-radius: calc(var(--width415) * 26px);}
.homepage-new .section-header{margin-bottom: calc(var(--width415) * 12px);}
.homepage-new .section-title{font-size: calc(var(--width415) * 18px);}
.homepage-new .section-more{font-size: calc(var(--width415) * 14px);}
.homepage-new .section-more b{width: calc(var(--width415) * 8px); height: calc(var(--width415) * 8px); margin: 0 0 0 calc(var(--width415) * 3px);}
.homepage-new .curriculum-scroll{padding: 0 var(--page-pad) calc(var(--width415) * 4px);}
.homepage-new .curriculum-grid{gap: calc(var(--width415) * 10px);}
.homepage-new .curriculum-card{box-shadow: 0 0 calc(var(--width415) * 4px) 0 rgba(203,203,203,0.42); min-height: 0px; border-radius: calc(var(--width415) * 8px); width: calc(var(--width415) * 194px);}
.homepage-new .products{margin: calc(var(--width415) * 25px) 0 0 0;}
.homepage-new .card-body{padding: calc(var(--width415) * 10px) calc(var(--width415) * 12px) calc(var(--width415) * 12px);}
.homepage-new .card-title-row{gap: calc(var(--width415) * 6px);}
.homepage-new .card-title-row h3{font-size: calc(var(--width415) * 14px);}
.homepage-new .card-badge{padding: calc(var(--width415) * 1px) calc(var(--width415) * 8px); font-size: calc(var(--width415) * 10px); border-radius: calc(var(--width415) * 10px); line-height: calc(var(--width415) * 16px);}
.homepage-new .card-desc{margin: calc(var(--width415) * 4px) 0 calc(var(--width415) * 8px); font-size: calc(var(--width415) * 12px);}
.homepage-new .card-links{margin: 0 0 calc(var(--width415) * 8px); gap: calc(var(--width415) * 2px);}
.homepage-new .card-links a{gap: calc(var(--width415) * 5px); min-width: 0px; font-size: calc(var(--width415) * 12px); padding: calc(var(--width415) * 4px) 0;}
.homepage-new .card-links a b{width: calc(var(--width415) * 10px); height: calc(var(--width415) * 10px);}
.homepage-new .card-cta{height: calc(var(--width415) * 30px); border-radius: calc(var(--width415) * 15px); font-size: calc(var(--width415) * 12px); gap: calc(var(--width415) * 4px);}
.homepage-new .card-cta b{width: calc(var(--width415) * 8px); height: calc(var(--width415) * 8px);}
.homepage-new .curriculum-dots{gap: calc(var(--width415) * 4px); margin-top: calc(var(--width415) * 12px);}
.homepage-new .curriculum-dots .dot{width: calc(var(--width415) * 4px); height: calc(var(--width415) * 4px);}
.homepage-new .curriculum-dots .dot.active{width: calc(var(--width415) * 20px); border-radius: calc(var(--width415) * 2px);}
.homepage-new .hot-tags{padding: calc(var(--width415) * 14px) 0 0;}


.homepage-new .hot-tags-header{margin-bottom: calc(var(--width415) * 8px);}
.homepage-new .tags-list{gap: calc(var(--width415) * 8px);}
.homepage-new .tag{padding: calc(var(--width415) * 4px) calc(var(--width415) * 16px); border-radius: calc(var(--width415) * 16px); font-size: calc(var(--width415) * 14px);}

.homepage-new .products-grid{gap: calc(var(--width415) * 16px);}

.homepage-new .swiper-container.products-swiper .swiper-slide{padding: calc(var(--width415) * 4px);}
.homepage-new .swiper-container.products-swiper .products-grid{gap: calc(var(--width415) * 12px);}

.homepage-new .products-pagination{margin-top: calc(var(--width415) * 16px); gap: calc(var(--width415) * 6px);}


.homepage-new .product-card{padding: calc(var(--width415) * 10px); min-width: 0px; border-radius: calc(var(--width415) * 8px); box-shadow: 0 0 calc(var(--width415) * 4px) 0 rgba(203,203,203,0.42);}
.homepage-new .product-tags{flex-wrap: nowrap; border-radius: calc(var(--width415) * 10px); top: calc(var(--width415) * 8px); left: calc(var(--width415) * 10px); gap: calc(var(--width415) * 3px); max-width: calc(100% - calc(var(--width415) * 36px));}
.homepage-new .tagsa{padding: calc(var(--width415) * 1px) calc(var(--width415) * 5px); font-size: calc(var(--width415) * 10px); border-radius: calc(var(--width415) * 8px); white-space: nowrap;}

.homepage-new .product-thumb{border-radius: calc(var(--width415) * 8px); margin: calc(var(--width415) * 24px) 0 0 0;}
.homepage-new .product-name{font-size: calc(var(--width415) * 16px); margin: calc(var(--width415) * 7px) 0 calc(var(--width415) * 3px) 0;}
.homepage-new .product-meta{font-size: calc(var(--width415) * 12px); margin-bottom: calc(var(--width415) * 4px);}
.homepage-new .product-rating{min-width: 0px; font-size: calc(var(--width415) * 11px);}
.homepage-new .product-rating b{width: calc(var(--width415) * 10px); height: calc(var(--width415) * 10px); margin: 0 calc(var(--width415) * 2px) 0 0;}
.homepage-new .product-rating span{min-width: 0px;}
.homepage-new .product-rating span:nth-of-type(1){margin: 0 calc(var(--width415) * 3px);}
.homepage-new .product-rating span:nth-of-type(2){min-width: 0px;}
.homepage-new .feed-layout{gap: calc(var(--width415) * 24px); margin: calc(var(--width415) * 32px) auto calc(var(--width415) * 32px);}
.homepage-new .feed-main{min-width: 0px;}
.homepage-new .feed-sidebar{border-radius: 0px;}
.homepage-new .feed-tabs{gap: calc(var(--width415) * 10px); padding: 0 var(--page-pad) calc(var(--width415) * 2px);}
.homepage-new .feed-tabs .tab{width: calc(var(--width415) * 98px); padding: 0 calc(var(--width415) * 24px); height: calc(var(--width415) * 32px); border-radius: calc(var(--width415) * 16px); font-size: calc(var(--width415) * 14px);}



.homepage-new .sidiv{margin: 0px;}
.homepage-new .sidiv .sidebar-list{gap: calc(var(--width415) * 16px); margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: calc(var(--width415) * 34px); border-radius: calc(var(--width415) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-hot{border-radius: calc(var(--width415) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-new{border-radius: calc(var(--width415) * 4px);}
.homepage-new .sidiv .sidebar-list a{gap: calc(var(--width415) * 8px); height: calc(var(--width415) * 34px); padding: 0 0 0 calc(var(--width415) * 7px); font-size: calc(var(--width415) * 16px); line-height: calc(var(--width415) * 34px);}
.homepage-new .sidiv .sidebar-icon{width: calc(var(--width415) * 18px); height: calc(var(--width415) * 18px); margin: 0 calc(var(--width415) * 6px) 0 0;}
.homepage-new .sidiv .sidebar-text{min-width: 0px;}
.homepage-new .sidiv .sidebar-views{gap: calc(var(--width415) * 4px); font-size: calc(var(--width415) * 16px); padding-top: 0px;}
.homepage-new .sidiv .sidebar-views .views-icon{width: calc(var(--width415) * 11px); height: calc(var(--width415) * 14px);}
.homepage-new .sidiv .products-pagination{margin-top: calc(var(--width415) * 16px);}

.homepage-new .article-list{gap: 0px; margin: calc(var(--width415) * 4px) 0 0 0;}
.homepage-new .article-item{gap: calc(var(--width415) * 12px); padding: calc(var(--width415) * 10px) 0;}
.homepage-new .article-body{min-width: 0px;}
.homepage-new .article-title{font-size: calc(var(--width415) * 16px); margin-bottom: calc(var(--width415) * 2px);}
.homepage-new .article-summary{font-size: calc(var(--width415) * 14px); max-height: calc(var(--width415) * 20px); line-height: calc(var(--width415) * 18px); margin-bottom: calc(var(--width415) * 3px);}
.homepage-new .article-tags{gap: calc(var(--width415) * 6px); margin-top: calc(var(--width415) * 4px);}
.homepage-new .article-tag{padding: calc(var(--width415) * 1px) calc(var(--width415) * 8px); border-radius: calc(var(--width415) * 11px); font-size: calc(var(--width415) * 10px);}
.idx .homepage-new .article-tag{padding: calc(var(--width415) * 1px) calc(var(--width415) * 8px);}

.homepage-new .article-info{font-size: calc(var(--width415) * 12px); gap: calc(var(--width415) * 10px);}
.homepage-new .article-thumb{width: calc(var(--width415) * 148px); height: calc(var(--width415) * 88px); border-radius: calc(var(--width415) * 6px); margin-top: calc(var(--width415) * 2px);}
.homepage-new .article-thumb-small{width: calc(var(--width415) * 88px); height: calc(var(--width415) * 88px);}
.homepage-new .btn-more-info{gap: calc(var(--width415) * 6px); height: calc(var(--width415) * 38px); margin-top: calc(var(--width415) * 16px); border-radius: calc(var(--width415) * 21px); font-size: calc(var(--width415) * 16px);}
.homepage-new .icon-more{width: calc(var(--width415) * 16px); height: calc(var(--width415) * 16px);}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{margin: 0 calc(var(--width415) * 3px) 0 0; width: calc(var(--width415) * 12px); height: calc(var(--width415) * 12px);}
.homepage-new .sidebar-title{font-size: calc(var(--width415) * 17px);}
.homepage-new .sidebar-list li{padding: 0px;}
.homepage-new .sidebar-list a{gap: calc(var(--width415) * 10px); padding: calc(var(--width415) * 12px) 0; font-size: calc(var(--width415) * 14px);}
.homepage-new .sidebar-icon{width: calc(var(--width415) * 16px); height: calc(var(--width415) * 16px); margin: 0 calc(var(--width415) * 4px) 0 0;}
.homepage-new .sidebar-text{min-width: 0px;}
.homepage-new .sidebar-views{font-size: calc(var(--width415) * 12px); padding-top: calc(var(--width415) * 2px);}













































































































































































































































































































































.idx .homepage-new .hero-title .highlight{display: inline; font-size: calc(var(--width415) * 28px); margin: 0px; width: auto; letter-spacing: calc(var(--width415) * 1px); font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}


}
@media screen and (max-width: 401px){
.homepage-new *{margin: 0px; padding: 0px;}

.homepage-new ul{padding-left: 0px;}














































.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px;}
.homepage-new .hero-inner{min-height: calc(var(--width400) * 243px);}
.homepage-new .hero-title{letter-spacing: calc(var(--width400) * 6px); font-size: calc(var(--width400) * 32px); line-height: calc(var(--width400) * 42px); margin: 0 0 calc(var(--width400) * 12px); font-weight: 400;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: calc(var(--width400) * 5px);}
.homepage-new .hero-title .highlight{margin: calc(var(--width400) * 6px) auto; letter-spacing: calc(var(--width400) * 4px); width: calc(var(--width400) * 210px);}
.homepage-new .hero-subtitle{font-size: calc(var(--width400) * 12px); margin-bottom: calc(var(--width400) * 15px); letter-spacing: calc(var(--width400) * 0.5px);}
.homepage-new .hero-btns{gap: calc(var(--width400) * 12px);}
.homepage-new .btn-primary{height: calc(var(--width400) * 32px); border-radius: calc(var(--width400) * 22px); font-size: calc(var(--width400) * 12px); width: calc(var(--width400) * 153px); gap: calc(var(--width400) * 4px);}
.homepage-new .btn-outline{--border-radius: 44px; width: calc(var(--width400) * 107px); height: calc(var(--width400) * 32px); border-radius: calc(var(--width400) * 26px); font-size: calc(var(--width400) * 12px);}
.homepage-new .btn-outline::after{left: 0px; top: 0px; border-radius: calc(var(--width400) * 26px);}
.homepage-new .section-header{margin-bottom: calc(var(--width400) * 12px);}
.homepage-new .section-title{font-size: calc(var(--width400) * 18px);}
.homepage-new .section-more{font-size: calc(var(--width400) * 14px);}
.homepage-new .section-more b{width: calc(var(--width400) * 8px); height: calc(var(--width400) * 8px); margin: 0 0 0 calc(var(--width400) * 3px);}
.homepage-new .curriculum-scroll{padding: 0 var(--page-pad) calc(var(--width400) * 4px);}
.homepage-new .curriculum-grid{gap: calc(var(--width400) * 10px);}
.homepage-new .curriculum-card{box-shadow: 0 0 calc(var(--width400) * 4px) 0 rgba(203,203,203,0.42); min-height: 0px; border-radius: calc(var(--width400) * 8px); width: calc(var(--width400) * 194px);}
.homepage-new .products{margin: calc(var(--width400) * 25px) 0 0 0;}
.homepage-new .card-body{padding: calc(var(--width400) * 10px) calc(var(--width400) * 12px) calc(var(--width400) * 12px);}
.homepage-new .card-title-row{gap: calc(var(--width400) * 6px);}
.homepage-new .card-title-row h3{font-size: calc(var(--width400) * 14px);}
.homepage-new .card-badge{padding: calc(var(--width400) * 1px) calc(var(--width400) * 8px); font-size: calc(var(--width400) * 10px); border-radius: calc(var(--width400) * 10px); line-height: calc(var(--width400) * 16px);}
.homepage-new .card-desc{margin: calc(var(--width400) * 4px) 0 calc(var(--width400) * 8px); font-size: calc(var(--width400) * 12px);}
.homepage-new .card-links{margin: 0 0 calc(var(--width400) * 8px); gap: calc(var(--width400) * 2px);}
.homepage-new .card-links a{gap: calc(var(--width400) * 5px); min-width: 0px; font-size: calc(var(--width400) * 12px); padding: calc(var(--width400) * 4px) 0;}
.homepage-new .card-links a b{width: calc(var(--width400) * 10px); height: calc(var(--width400) * 10px);}
.homepage-new .card-cta{height: calc(var(--width400) * 30px); border-radius: calc(var(--width400) * 15px); font-size: calc(var(--width400) * 12px); gap: calc(var(--width400) * 4px);}
.homepage-new .card-cta b{width: calc(var(--width400) * 8px); height: calc(var(--width400) * 8px);}
.homepage-new .curriculum-dots{gap: calc(var(--width400) * 4px); margin-top: calc(var(--width400) * 12px);}
.homepage-new .curriculum-dots .dot{width: calc(var(--width400) * 4px); height: calc(var(--width400) * 4px);}
.homepage-new .curriculum-dots .dot.active{width: calc(var(--width400) * 20px); border-radius: calc(var(--width400) * 2px);}
.homepage-new .hot-tags{padding: calc(var(--width400) * 14px) 0 0;}


.homepage-new .hot-tags-header{margin-bottom: calc(var(--width400) * 8px);}
.homepage-new .tags-list{gap: calc(var(--width400) * 8px);}
.homepage-new .tag{padding: calc(var(--width400) * 4px) calc(var(--width400) * 16px); border-radius: calc(var(--width400) * 16px); font-size: calc(var(--width400) * 14px);}

.homepage-new .products-grid{gap: calc(var(--width400) * 16px);}

.homepage-new .swiper-container.products-swiper .swiper-slide{padding: calc(var(--width400) * 4px);}
.homepage-new .swiper-container.products-swiper .products-grid{gap: calc(var(--width400) * 12px);}

.homepage-new .products-pagination{margin-top: calc(var(--width400) * 16px); gap: calc(var(--width400) * 6px);}


.homepage-new .product-card{padding: calc(var(--width400) * 10px); min-width: 0px; border-radius: calc(var(--width400) * 8px); box-shadow: 0 0 calc(var(--width400) * 4px) 0 rgba(203,203,203,0.42);}
.homepage-new .product-tags{flex-wrap: nowrap; border-radius: calc(var(--width400) * 10px); top: calc(var(--width400) * 8px); left: calc(var(--width400) * 10px); gap: calc(var(--width400) * 3px); max-width: calc(100% - calc(var(--width400) * 36px));}
.homepage-new .tagsa{padding: calc(var(--width400) * 1px) calc(var(--width400) * 5px); font-size: calc(var(--width400) * 10px); border-radius: calc(var(--width400) * 8px); white-space: nowrap;}

.homepage-new .product-thumb{border-radius: calc(var(--width400) * 8px); margin: calc(var(--width400) * 24px) 0 0 0;}
.homepage-new .product-name{font-size: calc(var(--width400) * 16px); margin: calc(var(--width400) * 7px) 0 calc(var(--width400) * 3px) 0;}
.homepage-new .product-meta{font-size: calc(var(--width400) * 12px); margin-bottom: calc(var(--width400) * 4px);}
.homepage-new .product-rating{min-width: 0px; font-size: calc(var(--width400) * 11px);}
.homepage-new .product-rating b{width: calc(var(--width400) * 10px); height: calc(var(--width400) * 10px); margin: 0 calc(var(--width400) * 2px) 0 0;}
.homepage-new .product-rating span{min-width: 0px;}
.homepage-new .product-rating span:nth-of-type(1){margin: 0 calc(var(--width400) * 3px);}
.homepage-new .product-rating span:nth-of-type(2){min-width: 0px;}
.homepage-new .feed-layout{gap: calc(var(--width400) * 24px); margin: calc(var(--width400) * 32px) auto calc(var(--width400) * 32px);}
.homepage-new .feed-main{min-width: 0px;}
.homepage-new .feed-sidebar{border-radius: 0px;}
.homepage-new .feed-tabs{gap: calc(var(--width400) * 10px); padding: 0 var(--page-pad) calc(var(--width400) * 2px);}
.homepage-new .feed-tabs .tab{width: calc(var(--width400) * 98px); padding: 0 calc(var(--width400) * 24px); height: calc(var(--width400) * 32px); border-radius: calc(var(--width400) * 16px); font-size: calc(var(--width400) * 14px);}



.homepage-new .sidiv{margin: 0px;}
.homepage-new .sidiv .sidebar-list{gap: calc(var(--width400) * 16px); margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: calc(var(--width400) * 34px); border-radius: calc(var(--width400) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-hot{border-radius: calc(var(--width400) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-new{border-radius: calc(var(--width400) * 4px);}
.homepage-new .sidiv .sidebar-list a{gap: calc(var(--width400) * 8px); height: calc(var(--width400) * 34px); padding: 0 0 0 calc(var(--width400) * 7px); font-size: calc(var(--width400) * 16px); line-height: calc(var(--width400) * 34px);}
.homepage-new .sidiv .sidebar-icon{width: calc(var(--width400) * 18px); height: calc(var(--width400) * 18px); margin: 0 calc(var(--width400) * 6px) 0 0;}
.homepage-new .sidiv .sidebar-text{min-width: 0px;}
.homepage-new .sidiv .sidebar-views{gap: calc(var(--width400) * 4px); font-size: calc(var(--width400) * 16px); padding-top: 0px;}
.homepage-new .sidiv .sidebar-views .views-icon{width: calc(var(--width400) * 11px); height: calc(var(--width400) * 14px);}
.homepage-new .sidiv .products-pagination{margin-top: calc(var(--width400) * 16px);}

.homepage-new .article-list{gap: 0px; margin: calc(var(--width400) * 4px) 0 0 0;}
.homepage-new .article-item{gap: calc(var(--width400) * 12px); padding: calc(var(--width400) * 10px) 0;}
.homepage-new .article-body{min-width: 0px;}
.homepage-new .article-title{font-size: calc(var(--width400) * 16px); margin-bottom: calc(var(--width400) * 2px);}
.homepage-new .article-summary{font-size: calc(var(--width400) * 14px); max-height: calc(var(--width400) * 20px); line-height: calc(var(--width400) * 18px); margin-bottom: calc(var(--width400) * 3px);}
.homepage-new .article-tags{gap: calc(var(--width400) * 6px); margin-top: calc(var(--width400) * 4px);}
.homepage-new .article-tag{padding: calc(var(--width400) * 1px) calc(var(--width400) * 8px); border-radius: calc(var(--width400) * 11px); font-size: calc(var(--width400) * 10px);}
.idx .homepage-new .article-tag{padding: calc(var(--width400) * 1px) calc(var(--width400) * 8px);}

.homepage-new .article-info{font-size: calc(var(--width400) * 12px); gap: calc(var(--width400) * 10px);}
.homepage-new .article-thumb{width: calc(var(--width400) * 148px); height: calc(var(--width400) * 88px); border-radius: calc(var(--width400) * 6px); margin-top: calc(var(--width400) * 2px);}
.homepage-new .article-thumb-small{width: calc(var(--width400) * 88px); height: calc(var(--width400) * 88px);}
.homepage-new .btn-more-info{gap: calc(var(--width400) * 6px); height: calc(var(--width400) * 38px); margin-top: calc(var(--width400) * 16px); border-radius: calc(var(--width400) * 21px); font-size: calc(var(--width400) * 16px);}
.homepage-new .icon-more{width: calc(var(--width400) * 16px); height: calc(var(--width400) * 16px);}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{margin: 0 calc(var(--width400) * 3px) 0 0; width: calc(var(--width400) * 12px); height: calc(var(--width400) * 12px);}
.homepage-new .sidebar-title{font-size: calc(var(--width400) * 17px);}
.homepage-new .sidebar-list li{padding: 0px;}
.homepage-new .sidebar-list a{gap: calc(var(--width400) * 10px); padding: calc(var(--width400) * 12px) 0; font-size: calc(var(--width400) * 14px);}
.homepage-new .sidebar-icon{width: calc(var(--width400) * 16px); height: calc(var(--width400) * 16px); margin: 0 calc(var(--width400) * 4px) 0 0;}
.homepage-new .sidebar-text{min-width: 0px;}
.homepage-new .sidebar-views{font-size: calc(var(--width400) * 12px); padding-top: calc(var(--width400) * 2px);}













































































































































































































































































































































.idx .homepage-new .hero-title .highlight{display: inline; font-size: calc(var(--width400) * 28px); margin: 0px; width: auto; letter-spacing: calc(var(--width400) * 1px); font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}


}
@media screen and (max-width: 395px){
.homepage-new *{margin: 0px; padding: 0px;}

.homepage-new ul{padding-left: 0px;}














































.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px;}
.homepage-new .hero-inner{min-height: calc(var(--width395) * 243px);}
.homepage-new .hero-title{letter-spacing: calc(var(--width395) * 6px); font-size: calc(var(--width395) * 32px); line-height: calc(var(--width395) * 42px); margin: 0 0 calc(var(--width395) * 12px); font-weight: 400;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: calc(var(--width395) * 5px);}
.homepage-new .hero-title .highlight{margin: calc(var(--width395) * 6px) auto; letter-spacing: calc(var(--width395) * 4px); width: calc(var(--width395) * 210px);}
.homepage-new .hero-subtitle{font-size: calc(var(--width395) * 12px); margin-bottom: calc(var(--width395) * 15px); letter-spacing: calc(var(--width395) * 0.5px);}
.homepage-new .hero-btns{gap: calc(var(--width395) * 12px);}
.homepage-new .btn-primary{height: calc(var(--width395) * 32px); border-radius: calc(var(--width395) * 22px); font-size: calc(var(--width395) * 12px); width: calc(var(--width395) * 153px); gap: calc(var(--width395) * 4px);}
.homepage-new .btn-outline{--border-radius: 44px; width: calc(var(--width395) * 107px); height: calc(var(--width395) * 32px); border-radius: calc(var(--width395) * 26px); font-size: calc(var(--width395) * 12px);}
.homepage-new .btn-outline::after{left: 0px; top: 0px; border-radius: calc(var(--width395) * 26px);}
.homepage-new .section-header{margin-bottom: calc(var(--width395) * 12px);}
.homepage-new .section-title{font-size: calc(var(--width395) * 18px);}
.homepage-new .section-more{font-size: calc(var(--width395) * 14px);}
.homepage-new .section-more b{width: calc(var(--width395) * 8px); height: calc(var(--width395) * 8px); margin: 0 0 0 calc(var(--width395) * 3px);}
.homepage-new .curriculum-scroll{padding: 0 var(--page-pad) calc(var(--width395) * 4px);}
.homepage-new .curriculum-grid{gap: calc(var(--width395) * 10px);}
.homepage-new .curriculum-card{box-shadow: 0 0 calc(var(--width395) * 4px) 0 rgba(203,203,203,0.42); min-height: 0px; border-radius: calc(var(--width395) * 8px); width: calc(var(--width395) * 194px);}
.homepage-new .products{margin: calc(var(--width395) * 25px) 0 0 0;}
.homepage-new .card-body{padding: calc(var(--width395) * 10px) calc(var(--width395) * 12px) calc(var(--width395) * 12px);}
.homepage-new .card-title-row{gap: calc(var(--width395) * 6px);}
.homepage-new .card-title-row h3{font-size: calc(var(--width395) * 14px);}
.homepage-new .card-badge{padding: calc(var(--width395) * 1px) calc(var(--width395) * 8px); font-size: calc(var(--width395) * 10px); border-radius: calc(var(--width395) * 10px); line-height: calc(var(--width395) * 16px);}
.homepage-new .card-desc{margin: calc(var(--width395) * 4px) 0 calc(var(--width395) * 8px); font-size: calc(var(--width395) * 12px);}
.homepage-new .card-links{margin: 0 0 calc(var(--width395) * 8px); gap: calc(var(--width395) * 2px);}
.homepage-new .card-links a{gap: calc(var(--width395) * 5px); min-width: 0px; font-size: calc(var(--width395) * 12px); padding: calc(var(--width395) * 4px) 0;}
.homepage-new .card-links a b{width: calc(var(--width395) * 10px); height: calc(var(--width395) * 10px);}
.homepage-new .card-cta{height: calc(var(--width395) * 30px); border-radius: calc(var(--width395) * 15px); font-size: calc(var(--width395) * 12px); gap: calc(var(--width395) * 4px);}
.homepage-new .card-cta b{width: calc(var(--width395) * 8px); height: calc(var(--width395) * 8px);}
.homepage-new .curriculum-dots{gap: calc(var(--width395) * 4px); margin-top: calc(var(--width395) * 12px);}
.homepage-new .curriculum-dots .dot{width: calc(var(--width395) * 4px); height: calc(var(--width395) * 4px);}
.homepage-new .curriculum-dots .dot.active{width: calc(var(--width395) * 20px); border-radius: calc(var(--width395) * 2px);}
.homepage-new .hot-tags{padding: calc(var(--width395) * 14px) 0 0;}


.homepage-new .hot-tags-header{margin-bottom: calc(var(--width395) * 8px);}
.homepage-new .tags-list{gap: calc(var(--width395) * 8px);}
.homepage-new .tag{padding: calc(var(--width395) * 4px) calc(var(--width395) * 16px); border-radius: calc(var(--width395) * 16px); font-size: calc(var(--width395) * 14px);}

.homepage-new .products-grid{gap: calc(var(--width395) * 16px);}

.homepage-new .swiper-container.products-swiper .swiper-slide{padding: calc(var(--width395) * 4px);}
.homepage-new .swiper-container.products-swiper .products-grid{gap: calc(var(--width395) * 12px);}

.homepage-new .products-pagination{margin-top: calc(var(--width395) * 16px); gap: calc(var(--width395) * 6px);}


.homepage-new .product-card{padding: calc(var(--width395) * 10px); min-width: 0px; border-radius: calc(var(--width395) * 8px); box-shadow: 0 0 calc(var(--width395) * 4px) 0 rgba(203,203,203,0.42);}
.homepage-new .product-tags{flex-wrap: nowrap; border-radius: calc(var(--width395) * 10px); top: calc(var(--width395) * 8px); left: calc(var(--width395) * 10px); gap: calc(var(--width395) * 3px); max-width: calc(100% - calc(var(--width395) * 36px));}
.homepage-new .tagsa{padding: calc(var(--width395) * 1px) calc(var(--width395) * 5px); font-size: calc(var(--width395) * 10px); border-radius: calc(var(--width395) * 8px); white-space: nowrap;}

.homepage-new .product-thumb{border-radius: calc(var(--width395) * 8px); margin: calc(var(--width395) * 24px) 0 0 0;}
.homepage-new .product-name{font-size: calc(var(--width395) * 16px); margin: calc(var(--width395) * 7px) 0 calc(var(--width395) * 3px) 0;}
.homepage-new .product-meta{font-size: calc(var(--width395) * 12px); margin-bottom: calc(var(--width395) * 4px);}
.homepage-new .product-rating{min-width: 0px; font-size: calc(var(--width395) * 11px);}
.homepage-new .product-rating b{width: calc(var(--width395) * 10px); height: calc(var(--width395) * 10px); margin: 0 calc(var(--width395) * 2px) 0 0;}
.homepage-new .product-rating span{min-width: 0px;}
.homepage-new .product-rating span:nth-of-type(1){margin: 0 calc(var(--width395) * 3px);}
.homepage-new .product-rating span:nth-of-type(2){min-width: 0px;}
.homepage-new .feed-layout{gap: calc(var(--width395) * 24px); margin: calc(var(--width395) * 32px) auto calc(var(--width395) * 32px);}
.homepage-new .feed-main{min-width: 0px;}
.homepage-new .feed-sidebar{border-radius: 0px;}
.homepage-new .feed-tabs{gap: calc(var(--width395) * 10px); padding: 0 var(--page-pad) calc(var(--width395) * 2px);}
.homepage-new .feed-tabs .tab{width: calc(var(--width395) * 98px); padding: 0 calc(var(--width395) * 24px); height: calc(var(--width395) * 32px); border-radius: calc(var(--width395) * 16px); font-size: calc(var(--width395) * 14px);}



.homepage-new .sidiv{margin: 0px;}
.homepage-new .sidiv .sidebar-list{gap: calc(var(--width395) * 16px); margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: calc(var(--width395) * 34px); border-radius: calc(var(--width395) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-hot{border-radius: calc(var(--width395) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-new{border-radius: calc(var(--width395) * 4px);}
.homepage-new .sidiv .sidebar-list a{gap: calc(var(--width395) * 8px); height: calc(var(--width395) * 34px); padding: 0 0 0 calc(var(--width395) * 7px); font-size: calc(var(--width395) * 16px); line-height: calc(var(--width395) * 34px);}
.homepage-new .sidiv .sidebar-icon{width: calc(var(--width395) * 18px); height: calc(var(--width395) * 18px); margin: 0 calc(var(--width395) * 6px) 0 0;}
.homepage-new .sidiv .sidebar-text{min-width: 0px;}
.homepage-new .sidiv .sidebar-views{gap: calc(var(--width395) * 4px); font-size: calc(var(--width395) * 16px); padding-top: 0px;}
.homepage-new .sidiv .sidebar-views .views-icon{width: calc(var(--width395) * 11px); height: calc(var(--width395) * 14px);}
.homepage-new .sidiv .products-pagination{margin-top: calc(var(--width395) * 16px);}

.homepage-new .article-list{gap: 0px; margin: calc(var(--width395) * 4px) 0 0 0;}
.homepage-new .article-item{gap: calc(var(--width395) * 12px); padding: calc(var(--width395) * 10px) 0;}
.homepage-new .article-body{min-width: 0px;}
.homepage-new .article-title{font-size: calc(var(--width395) * 16px); margin-bottom: calc(var(--width395) * 2px);}
.homepage-new .article-summary{font-size: calc(var(--width395) * 14px); max-height: calc(var(--width395) * 20px); line-height: calc(var(--width395) * 18px); margin-bottom: calc(var(--width395) * 3px);}
.homepage-new .article-tags{gap: calc(var(--width395) * 6px); margin-top: calc(var(--width395) * 4px);}
.homepage-new .article-tag{padding: calc(var(--width395) * 1px) calc(var(--width395) * 8px); border-radius: calc(var(--width395) * 11px); font-size: calc(var(--width395) * 10px);}
.idx .homepage-new .article-tag{padding: calc(var(--width395) * 1px) calc(var(--width395) * 8px);}

.homepage-new .article-info{font-size: calc(var(--width395) * 12px); gap: calc(var(--width395) * 10px);}
.homepage-new .article-thumb{width: calc(var(--width395) * 148px); height: calc(var(--width395) * 88px); border-radius: calc(var(--width395) * 6px); margin-top: calc(var(--width395) * 2px);}
.homepage-new .article-thumb-small{width: calc(var(--width395) * 88px); height: calc(var(--width395) * 88px);}
.homepage-new .btn-more-info{gap: calc(var(--width395) * 6px); height: calc(var(--width395) * 38px); margin-top: calc(var(--width395) * 16px); border-radius: calc(var(--width395) * 21px); font-size: calc(var(--width395) * 16px);}
.homepage-new .icon-more{width: calc(var(--width395) * 16px); height: calc(var(--width395) * 16px);}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{margin: 0 calc(var(--width395) * 3px) 0 0; width: calc(var(--width395) * 12px); height: calc(var(--width395) * 12px);}
.homepage-new .sidebar-title{font-size: calc(var(--width395) * 17px);}
.homepage-new .sidebar-list li{padding: 0px;}
.homepage-new .sidebar-list a{gap: calc(var(--width395) * 10px); padding: calc(var(--width395) * 12px) 0; font-size: calc(var(--width395) * 14px);}
.homepage-new .sidebar-icon{width: calc(var(--width395) * 16px); height: calc(var(--width395) * 16px); margin: 0 calc(var(--width395) * 4px) 0 0;}
.homepage-new .sidebar-text{min-width: 0px;}
.homepage-new .sidebar-views{font-size: calc(var(--width395) * 12px); padding-top: calc(var(--width395) * 2px);}













































































































































































































































































































































.idx .homepage-new .hero-title .highlight{display: inline; font-size: calc(var(--width395) * 28px); margin: 0px; width: auto; letter-spacing: calc(var(--width395) * 1px); font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}


}
@media screen and (max-width: 391px){
.homepage-new *{margin: 0px; padding: 0px;}

.homepage-new ul{padding-left: 0px;}














































.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px;}
.homepage-new .hero-inner{min-height: calc(var(--width390) * 243px);}
.homepage-new .hero-title{letter-spacing: calc(var(--width390) * 6px); font-size: calc(var(--width390) * 32px); line-height: calc(var(--width390) * 42px); margin: 0 0 calc(var(--width390) * 12px); font-weight: 400;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: calc(var(--width390) * 5px);}
.homepage-new .hero-title .highlight{margin: calc(var(--width390) * 6px) auto; letter-spacing: calc(var(--width390) * 4px); width: calc(var(--width390) * 210px);}
.homepage-new .hero-subtitle{font-size: calc(var(--width390) * 12px); margin-bottom: calc(var(--width390) * 15px); letter-spacing: calc(var(--width390) * 0.5px);}
.homepage-new .hero-btns{gap: calc(var(--width390) * 12px);}
.homepage-new .btn-primary{height: calc(var(--width390) * 32px); border-radius: calc(var(--width390) * 22px); font-size: calc(var(--width390) * 12px); width: calc(var(--width390) * 153px); gap: calc(var(--width390) * 4px);}
.homepage-new .btn-outline{--border-radius: 44px; width: calc(var(--width390) * 107px); height: calc(var(--width390) * 32px); border-radius: calc(var(--width390) * 26px); font-size: calc(var(--width390) * 12px);}
.homepage-new .btn-outline::after{left: 0px; top: 0px; border-radius: calc(var(--width390) * 26px);}
.homepage-new .section-header{margin-bottom: calc(var(--width390) * 12px);}
.homepage-new .section-title{font-size: calc(var(--width390) * 18px);}
.homepage-new .section-more{font-size: calc(var(--width390) * 14px);}
.homepage-new .section-more b{width: calc(var(--width390) * 8px); height: calc(var(--width390) * 8px); margin: 0 0 0 calc(var(--width390) * 3px);}
.homepage-new .curriculum-scroll{padding: 0 var(--page-pad) calc(var(--width390) * 4px);}
.homepage-new .curriculum-grid{gap: calc(var(--width390) * 10px);}
.homepage-new .curriculum-card{box-shadow: 0 0 calc(var(--width390) * 4px) 0 rgba(203,203,203,0.42); min-height: 0px; border-radius: calc(var(--width390) * 8px); width: calc(var(--width390) * 194px);}
.homepage-new .products{margin: calc(var(--width390) * 25px) 0 0 0;}
.homepage-new .card-body{padding: calc(var(--width390) * 10px) calc(var(--width390) * 12px) calc(var(--width390) * 12px);}
.homepage-new .card-title-row{gap: calc(var(--width390) * 6px);}
.homepage-new .card-title-row h3{font-size: calc(var(--width390) * 14px);}
.homepage-new .card-badge{padding: calc(var(--width390) * 1px) calc(var(--width390) * 8px); font-size: calc(var(--width390) * 10px); border-radius: calc(var(--width390) * 10px); line-height: calc(var(--width390) * 16px);}
.homepage-new .card-desc{margin: calc(var(--width390) * 4px) 0 calc(var(--width390) * 8px); font-size: calc(var(--width390) * 12px);}
.homepage-new .card-links{margin: 0 0 calc(var(--width390) * 8px); gap: calc(var(--width390) * 2px);}
.homepage-new .card-links a{gap: calc(var(--width390) * 5px); min-width: 0px; font-size: calc(var(--width390) * 12px); padding: calc(var(--width390) * 4px) 0;}
.homepage-new .card-links a b{width: calc(var(--width390) * 10px); height: calc(var(--width390) * 10px);}
.homepage-new .card-cta{height: calc(var(--width390) * 30px); border-radius: calc(var(--width390) * 15px); font-size: calc(var(--width390) * 12px); gap: calc(var(--width390) * 4px);}
.homepage-new .card-cta b{width: calc(var(--width390) * 8px); height: calc(var(--width390) * 8px);}
.homepage-new .curriculum-dots{gap: calc(var(--width390) * 4px); margin-top: calc(var(--width390) * 12px);}
.homepage-new .curriculum-dots .dot{width: calc(var(--width390) * 4px); height: calc(var(--width390) * 4px);}
.homepage-new .curriculum-dots .dot.active{width: calc(var(--width390) * 20px); border-radius: calc(var(--width390) * 2px);}
.homepage-new .hot-tags{padding: calc(var(--width390) * 14px) 0 0;}


.homepage-new .hot-tags-header{margin-bottom: calc(var(--width390) * 8px);}
.homepage-new .tags-list{gap: calc(var(--width390) * 8px);}
.homepage-new .tag{padding: calc(var(--width390) * 4px) calc(var(--width390) * 16px); border-radius: calc(var(--width390) * 16px); font-size: calc(var(--width390) * 14px);}

.homepage-new .products-grid{gap: calc(var(--width390) * 16px);}

.homepage-new .swiper-container.products-swiper .swiper-slide{padding: calc(var(--width390) * 4px);}
.homepage-new .swiper-container.products-swiper .products-grid{gap: calc(var(--width390) * 12px);}

.homepage-new .products-pagination{margin-top: calc(var(--width390) * 16px); gap: calc(var(--width390) * 6px);}


.homepage-new .product-card{padding: calc(var(--width390) * 10px); min-width: 0px; border-radius: calc(var(--width390) * 8px); box-shadow: 0 0 calc(var(--width390) * 4px) 0 rgba(203,203,203,0.42);}
.homepage-new .product-tags{flex-wrap: nowrap; border-radius: calc(var(--width390) * 10px); top: calc(var(--width390) * 8px); left: calc(var(--width390) * 10px); gap: calc(var(--width390) * 3px); max-width: calc(100% - calc(var(--width390) * 36px));}
.homepage-new .tagsa{padding: calc(var(--width390) * 1px) calc(var(--width390) * 5px); font-size: calc(var(--width390) * 10px); border-radius: calc(var(--width390) * 8px); white-space: nowrap;}

.homepage-new .product-thumb{border-radius: calc(var(--width390) * 8px); margin: calc(var(--width390) * 24px) 0 0 0;}
.homepage-new .product-name{font-size: calc(var(--width390) * 16px); margin: calc(var(--width390) * 7px) 0 calc(var(--width390) * 3px) 0;}
.homepage-new .product-meta{font-size: calc(var(--width390) * 12px); margin-bottom: calc(var(--width390) * 4px);}
.homepage-new .product-rating{min-width: 0px; font-size: calc(var(--width390) * 11px);}
.homepage-new .product-rating b{width: calc(var(--width390) * 10px); height: calc(var(--width390) * 10px); margin: 0 calc(var(--width390) * 2px) 0 0;}
.homepage-new .product-rating span{min-width: 0px;}
.homepage-new .product-rating span:nth-of-type(1){margin: 0 calc(var(--width390) * 3px);}
.homepage-new .product-rating span:nth-of-type(2){min-width: 0px;}
.homepage-new .feed-layout{gap: calc(var(--width390) * 24px); margin: calc(var(--width390) * 32px) auto calc(var(--width390) * 32px);}
.homepage-new .feed-main{min-width: 0px;}
.homepage-new .feed-sidebar{border-radius: 0px;}
.homepage-new .feed-tabs{gap: calc(var(--width390) * 10px); padding: 0 var(--page-pad) calc(var(--width390) * 2px);}
.homepage-new .feed-tabs .tab{width: calc(var(--width390) * 98px); padding: 0 calc(var(--width390) * 24px); height: calc(var(--width390) * 32px); border-radius: calc(var(--width390) * 16px); font-size: calc(var(--width390) * 14px);}



.homepage-new .sidiv{margin: 0px;}
.homepage-new .sidiv .sidebar-list{gap: calc(var(--width390) * 16px); margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: calc(var(--width390) * 34px); border-radius: calc(var(--width390) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-hot{border-radius: calc(var(--width390) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-new{border-radius: calc(var(--width390) * 4px);}
.homepage-new .sidiv .sidebar-list a{gap: calc(var(--width390) * 8px); height: calc(var(--width390) * 34px); padding: 0 0 0 calc(var(--width390) * 7px); font-size: calc(var(--width390) * 16px); line-height: calc(var(--width390) * 34px);}
.homepage-new .sidiv .sidebar-icon{width: calc(var(--width390) * 18px); height: calc(var(--width390) * 18px); margin: 0 calc(var(--width390) * 6px) 0 0;}
.homepage-new .sidiv .sidebar-text{min-width: 0px;}
.homepage-new .sidiv .sidebar-views{gap: calc(var(--width390) * 4px); font-size: calc(var(--width390) * 16px); padding-top: 0px;}
.homepage-new .sidiv .sidebar-views .views-icon{width: calc(var(--width390) * 11px); height: calc(var(--width390) * 14px);}
.homepage-new .sidiv .products-pagination{margin-top: calc(var(--width390) * 16px);}

.homepage-new .article-list{gap: 0px; margin: calc(var(--width390) * 4px) 0 0 0;}
.homepage-new .article-item{gap: calc(var(--width390) * 12px); padding: calc(var(--width390) * 10px) 0;}
.homepage-new .article-body{min-width: 0px;}
.homepage-new .article-title{font-size: calc(var(--width390) * 16px); margin-bottom: calc(var(--width390) * 2px);}
.homepage-new .article-summary{font-size: calc(var(--width390) * 14px); max-height: calc(var(--width390) * 20px); line-height: calc(var(--width390) * 18px); margin-bottom: calc(var(--width390) * 3px);}
.homepage-new .article-tags{gap: calc(var(--width390) * 6px); margin-top: calc(var(--width390) * 4px);}
.homepage-new .article-tag{padding: calc(var(--width390) * 1px) calc(var(--width390) * 8px); border-radius: calc(var(--width390) * 11px); font-size: calc(var(--width390) * 10px);}
.idx .homepage-new .article-tag{padding: calc(var(--width390) * 1px) calc(var(--width390) * 8px);}

.homepage-new .article-info{font-size: calc(var(--width390) * 12px); gap: calc(var(--width390) * 10px);}
.homepage-new .article-thumb{width: calc(var(--width390) * 148px); height: calc(var(--width390) * 88px); border-radius: calc(var(--width390) * 6px); margin-top: calc(var(--width390) * 2px);}
.homepage-new .article-thumb-small{width: calc(var(--width390) * 88px); height: calc(var(--width390) * 88px);}
.homepage-new .btn-more-info{gap: calc(var(--width390) * 6px); height: calc(var(--width390) * 38px); margin-top: calc(var(--width390) * 16px); border-radius: calc(var(--width390) * 21px); font-size: calc(var(--width390) * 16px);}
.homepage-new .icon-more{width: calc(var(--width390) * 16px); height: calc(var(--width390) * 16px);}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{margin: 0 calc(var(--width390) * 3px) 0 0; width: calc(var(--width390) * 12px); height: calc(var(--width390) * 12px);}
.homepage-new .sidebar-title{font-size: calc(var(--width390) * 17px);}
.homepage-new .sidebar-list li{padding: 0px;}
.homepage-new .sidebar-list a{gap: calc(var(--width390) * 10px); padding: calc(var(--width390) * 12px) 0; font-size: calc(var(--width390) * 14px);}
.homepage-new .sidebar-icon{width: calc(var(--width390) * 16px); height: calc(var(--width390) * 16px); margin: 0 calc(var(--width390) * 4px) 0 0;}
.homepage-new .sidebar-text{min-width: 0px;}
.homepage-new .sidebar-views{font-size: calc(var(--width390) * 12px); padding-top: calc(var(--width390) * 2px);}













































































































































































































































































































































.idx .homepage-new .hero-title .highlight{display: inline; font-size: calc(var(--width390) * 28px); margin: 0px; width: auto; letter-spacing: calc(var(--width390) * 1px); font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}


}
@media screen and (max-width: 379px){
.homepage-new *{margin: 0px; padding: 0px;}

.homepage-new ul{padding-left: 0px;}














































.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px;}
.homepage-new .hero-inner{min-height: calc(var(--width375) * 243px);}
.homepage-new .hero-title{letter-spacing: calc(var(--width375) * 6px); font-size: calc(var(--width375) * 32px); line-height: calc(var(--width375) * 42px); margin: 0 0 calc(var(--width375) * 12px); font-weight: 400;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: calc(var(--width375) * 5px);}
.homepage-new .hero-title .highlight{margin: calc(var(--width375) * 6px) auto; letter-spacing: calc(var(--width375) * 4px); width: calc(var(--width375) * 210px);}
.homepage-new .hero-subtitle{font-size: calc(var(--width375) * 12px); margin-bottom: calc(var(--width375) * 15px); letter-spacing: calc(var(--width375) * 0.5px);}
.homepage-new .hero-btns{gap: calc(var(--width375) * 12px);}
.homepage-new .btn-primary{height: calc(var(--width375) * 32px); border-radius: calc(var(--width375) * 22px); font-size: calc(var(--width375) * 12px); width: calc(var(--width375) * 153px); gap: calc(var(--width375) * 4px);}
.homepage-new .btn-outline{--border-radius: 44px; width: calc(var(--width375) * 107px); height: calc(var(--width375) * 32px); border-radius: calc(var(--width375) * 26px); font-size: calc(var(--width375) * 12px);}
.homepage-new .btn-outline::after{left: 0px; top: 0px; border-radius: calc(var(--width375) * 26px);}
.homepage-new .section-header{margin-bottom: calc(var(--width375) * 12px);}
.homepage-new .section-title{font-size: calc(var(--width375) * 18px);}
.homepage-new .section-more{font-size: calc(var(--width375) * 14px);}
.homepage-new .section-more b{width: calc(var(--width375) * 8px); height: calc(var(--width375) * 8px); margin: 0 0 0 calc(var(--width375) * 3px);}
.homepage-new .curriculum-scroll{padding: 0 var(--page-pad) calc(var(--width375) * 4px);}
.homepage-new .curriculum-grid{gap: calc(var(--width375) * 10px);}
.homepage-new .curriculum-card{box-shadow: 0 0 calc(var(--width375) * 4px) 0 rgba(203,203,203,0.42); min-height: 0px; border-radius: calc(var(--width375) * 8px); width: calc(var(--width375) * 194px);}
.homepage-new .products{margin: calc(var(--width375) * 25px) 0 0 0;}
.homepage-new .card-body{padding: calc(var(--width375) * 10px) calc(var(--width375) * 12px) calc(var(--width375) * 12px);}
.homepage-new .card-title-row{gap: calc(var(--width375) * 6px);}
.homepage-new .card-title-row h3{font-size: calc(var(--width375) * 14px);}
.homepage-new .card-badge{padding: calc(var(--width375) * 1px) calc(var(--width375) * 8px); font-size: calc(var(--width375) * 10px); border-radius: calc(var(--width375) * 10px); line-height: calc(var(--width375) * 16px);}
.homepage-new .card-desc{margin: calc(var(--width375) * 4px) 0 calc(var(--width375) * 8px); font-size: calc(var(--width375) * 12px);}
.homepage-new .card-links{margin: 0 0 calc(var(--width375) * 8px); gap: calc(var(--width375) * 2px);}
.homepage-new .card-links a{gap: calc(var(--width375) * 5px); min-width: 0px; font-size: calc(var(--width375) * 12px); padding: calc(var(--width375) * 4px) 0;}
.homepage-new .card-links a b{width: calc(var(--width375) * 10px); height: calc(var(--width375) * 10px);}
.homepage-new .card-cta{height: calc(var(--width375) * 30px); border-radius: calc(var(--width375) * 15px); font-size: calc(var(--width375) * 12px); gap: calc(var(--width375) * 4px);}
.homepage-new .card-cta b{width: calc(var(--width375) * 8px); height: calc(var(--width375) * 8px);}
.homepage-new .curriculum-dots{gap: calc(var(--width375) * 4px); margin-top: calc(var(--width375) * 12px);}
.homepage-new .curriculum-dots .dot{width: calc(var(--width375) * 4px); height: calc(var(--width375) * 4px);}
.homepage-new .curriculum-dots .dot.active{width: calc(var(--width375) * 20px); border-radius: calc(var(--width375) * 2px);}
.homepage-new .hot-tags{padding: calc(var(--width375) * 14px) 0 0;}


.homepage-new .hot-tags-header{margin-bottom: calc(var(--width375) * 8px);}
.homepage-new .tags-list{gap: calc(var(--width375) * 8px);}
.homepage-new .tag{padding: calc(var(--width375) * 4px) calc(var(--width375) * 16px); border-radius: calc(var(--width375) * 16px); font-size: calc(var(--width375) * 14px);}

.homepage-new .products-grid{gap: calc(var(--width375) * 16px);}

.homepage-new .swiper-container.products-swiper .swiper-slide{padding: calc(var(--width375) * 4px);}
.homepage-new .swiper-container.products-swiper .products-grid{gap: calc(var(--width375) * 12px);}

.homepage-new .products-pagination{margin-top: calc(var(--width375) * 16px); gap: calc(var(--width375) * 6px);}


.homepage-new .product-card{padding: calc(var(--width375) * 10px); min-width: 0px; border-radius: calc(var(--width375) * 8px); box-shadow: 0 0 calc(var(--width375) * 4px) 0 rgba(203,203,203,0.42);}
.homepage-new .product-tags{flex-wrap: nowrap; border-radius: calc(var(--width375) * 10px); top: calc(var(--width375) * 8px); left: calc(var(--width375) * 10px); gap: calc(var(--width375) * 3px); max-width: calc(100% - calc(var(--width375) * 36px));}
.homepage-new .tagsa{padding: calc(var(--width375) * 1px) calc(var(--width375) * 5px); font-size: calc(var(--width375) * 10px); border-radius: calc(var(--width375) * 8px); white-space: nowrap;}

.homepage-new .product-thumb{border-radius: calc(var(--width375) * 8px); margin: calc(var(--width375) * 24px) 0 0 0;}
.homepage-new .product-name{font-size: calc(var(--width375) * 16px); margin: calc(var(--width375) * 7px) 0 calc(var(--width375) * 3px) 0;}
.homepage-new .product-meta{font-size: calc(var(--width375) * 12px); margin-bottom: calc(var(--width375) * 4px);}
.homepage-new .product-rating{min-width: 0px; font-size: calc(var(--width375) * 11px);}
.homepage-new .product-rating b{width: calc(var(--width375) * 10px); height: calc(var(--width375) * 10px); margin: 0 calc(var(--width375) * 2px) 0 0;}
.homepage-new .product-rating span{min-width: 0px;}
.homepage-new .product-rating span:nth-of-type(1){margin: 0 calc(var(--width375) * 3px);}
.homepage-new .product-rating span:nth-of-type(2){min-width: 0px;}
.homepage-new .feed-layout{gap: calc(var(--width375) * 24px); margin: calc(var(--width375) * 32px) auto calc(var(--width375) * 32px);}
.homepage-new .feed-main{min-width: 0px;}
.homepage-new .feed-sidebar{border-radius: 0px;}
.homepage-new .feed-tabs{gap: calc(var(--width375) * 10px); padding: 0 var(--page-pad) calc(var(--width375) * 2px);}
.homepage-new .feed-tabs .tab{width: calc(var(--width375) * 98px); padding: 0 calc(var(--width375) * 24px); height: calc(var(--width375) * 32px); border-radius: calc(var(--width375) * 16px); font-size: calc(var(--width375) * 14px);}



.homepage-new .sidiv{margin: 0px;}
.homepage-new .sidiv .sidebar-list{gap: calc(var(--width375) * 16px); margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: calc(var(--width375) * 34px); border-radius: calc(var(--width375) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-hot{border-radius: calc(var(--width375) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-new{border-radius: calc(var(--width375) * 4px);}
.homepage-new .sidiv .sidebar-list a{gap: calc(var(--width375) * 8px); height: calc(var(--width375) * 34px); padding: 0 0 0 calc(var(--width375) * 7px); font-size: calc(var(--width375) * 16px); line-height: calc(var(--width375) * 34px);}
.homepage-new .sidiv .sidebar-icon{width: calc(var(--width375) * 18px); height: calc(var(--width375) * 18px); margin: 0 calc(var(--width375) * 6px) 0 0;}
.homepage-new .sidiv .sidebar-text{min-width: 0px;}
.homepage-new .sidiv .sidebar-views{gap: calc(var(--width375) * 4px); font-size: calc(var(--width375) * 16px); padding-top: 0px;}
.homepage-new .sidiv .sidebar-views .views-icon{width: calc(var(--width375) * 11px); height: calc(var(--width375) * 14px);}
.homepage-new .sidiv .products-pagination{margin-top: calc(var(--width375) * 16px);}

.homepage-new .article-list{gap: 0px; margin: calc(var(--width375) * 4px) 0 0 0;}
.homepage-new .article-item{gap: calc(var(--width375) * 12px); padding: calc(var(--width375) * 10px) 0;}
.homepage-new .article-body{min-width: 0px;}
.homepage-new .article-title{font-size: calc(var(--width375) * 16px); margin-bottom: calc(var(--width375) * 2px);}
.homepage-new .article-summary{font-size: calc(var(--width375) * 14px); max-height: calc(var(--width375) * 20px); line-height: calc(var(--width375) * 18px); margin-bottom: calc(var(--width375) * 3px);}
.homepage-new .article-tags{gap: calc(var(--width375) * 6px); margin-top: calc(var(--width375) * 4px);}
.homepage-new .article-tag{padding: calc(var(--width375) * 1px) calc(var(--width375) * 8px); border-radius: calc(var(--width375) * 11px); font-size: calc(var(--width375) * 10px);}
.idx .homepage-new .article-tag{padding: calc(var(--width375) * 1px) calc(var(--width375) * 8px);}

.homepage-new .article-info{font-size: calc(var(--width375) * 12px); gap: calc(var(--width375) * 10px);}
.homepage-new .article-thumb{width: calc(var(--width375) * 148px); height: calc(var(--width375) * 88px); border-radius: calc(var(--width375) * 6px); margin-top: calc(var(--width375) * 2px);}
.homepage-new .article-thumb-small{width: calc(var(--width375) * 88px); height: calc(var(--width375) * 88px);}
.homepage-new .btn-more-info{gap: calc(var(--width375) * 6px); height: calc(var(--width375) * 38px); margin-top: calc(var(--width375) * 16px); border-radius: calc(var(--width375) * 21px); font-size: calc(var(--width375) * 16px);}
.homepage-new .icon-more{width: calc(var(--width375) * 16px); height: calc(var(--width375) * 16px);}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{margin: 0 calc(var(--width375) * 3px) 0 0; width: calc(var(--width375) * 12px); height: calc(var(--width375) * 12px);}
.homepage-new .sidebar-title{font-size: calc(var(--width375) * 17px);}
.homepage-new .sidebar-list li{padding: 0px;}
.homepage-new .sidebar-list a{gap: calc(var(--width375) * 10px); padding: calc(var(--width375) * 12px) 0; font-size: calc(var(--width375) * 14px);}
.homepage-new .sidebar-icon{width: calc(var(--width375) * 16px); height: calc(var(--width375) * 16px); margin: 0 calc(var(--width375) * 4px) 0 0;}
.homepage-new .sidebar-text{min-width: 0px;}
.homepage-new .sidebar-views{font-size: calc(var(--width375) * 12px); padding-top: calc(var(--width375) * 2px);}













































































































































































































































































































































.idx .homepage-new .hero-title .highlight{display: inline; font-size: calc(var(--width375) * 28px); margin: 0px; width: auto; letter-spacing: calc(var(--width375) * 1px); font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}


}
@media screen and (max-width: 361px){
.homepage-new *{margin: 0px; padding: 0px;}

.homepage-new ul{padding-left: 0px;}














































.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px;}
.homepage-new .hero-inner{min-height: calc(var(--width360) * 243px);}
.homepage-new .hero-title{letter-spacing: calc(var(--width360) * 6px); font-size: calc(var(--width360) * 32px); line-height: calc(var(--width360) * 42px); margin: 0 0 calc(var(--width360) * 12px); font-weight: 400;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: calc(var(--width360) * 5px);}
.homepage-new .hero-title .highlight{margin: calc(var(--width360) * 6px) auto; letter-spacing: calc(var(--width360) * 4px); width: calc(var(--width360) * 210px);}
.homepage-new .hero-subtitle{font-size: calc(var(--width360) * 12px); margin-bottom: calc(var(--width360) * 15px); letter-spacing: calc(var(--width360) * 0.5px);}
.homepage-new .hero-btns{gap: calc(var(--width360) * 12px);}
.homepage-new .btn-primary{height: calc(var(--width360) * 32px); border-radius: calc(var(--width360) * 22px); font-size: calc(var(--width360) * 12px); width: calc(var(--width360) * 153px); gap: calc(var(--width360) * 4px);}
.homepage-new .btn-outline{--border-radius: 44px; width: calc(var(--width360) * 107px); height: calc(var(--width360) * 32px); border-radius: calc(var(--width360) * 26px); font-size: calc(var(--width360) * 12px);}
.homepage-new .btn-outline::after{left: 0px; top: 0px; border-radius: calc(var(--width360) * 26px);}
.homepage-new .section-header{margin-bottom: calc(var(--width360) * 12px);}
.homepage-new .section-title{font-size: calc(var(--width360) * 18px);}
.homepage-new .section-more{font-size: calc(var(--width360) * 14px);}
.homepage-new .section-more b{width: calc(var(--width360) * 8px); height: calc(var(--width360) * 8px); margin: 0 0 0 calc(var(--width360) * 3px);}
.homepage-new .curriculum-scroll{padding: 0 var(--page-pad) calc(var(--width360) * 4px);}
.homepage-new .curriculum-grid{gap: calc(var(--width360) * 10px);}
.homepage-new .curriculum-card{box-shadow: 0 0 calc(var(--width360) * 4px) 0 rgba(203,203,203,0.42); min-height: 0px; border-radius: calc(var(--width360) * 8px); width: calc(var(--width360) * 194px);}
.homepage-new .products{margin: calc(var(--width360) * 25px) 0 0 0;}
.homepage-new .card-body{padding: calc(var(--width360) * 10px) calc(var(--width360) * 12px) calc(var(--width360) * 12px);}
.homepage-new .card-title-row{gap: calc(var(--width360) * 6px);}
.homepage-new .card-title-row h3{font-size: calc(var(--width360) * 14px);}
.homepage-new .card-badge{padding: calc(var(--width360) * 1px) calc(var(--width360) * 8px); font-size: calc(var(--width360) * 10px); border-radius: calc(var(--width360) * 10px); line-height: calc(var(--width360) * 16px);}
.homepage-new .card-desc{margin: calc(var(--width360) * 4px) 0 calc(var(--width360) * 8px); font-size: calc(var(--width360) * 12px);}
.homepage-new .card-links{margin: 0 0 calc(var(--width360) * 8px); gap: calc(var(--width360) * 2px);}
.homepage-new .card-links a{gap: calc(var(--width360) * 5px); min-width: 0px; font-size: calc(var(--width360) * 12px); padding: calc(var(--width360) * 4px) 0;}
.homepage-new .card-links a b{width: calc(var(--width360) * 10px); height: calc(var(--width360) * 10px);}
.homepage-new .card-cta{height: calc(var(--width360) * 30px); border-radius: calc(var(--width360) * 15px); font-size: calc(var(--width360) * 12px); gap: calc(var(--width360) * 4px);}
.homepage-new .card-cta b{width: calc(var(--width360) * 8px); height: calc(var(--width360) * 8px);}
.homepage-new .curriculum-dots{gap: calc(var(--width360) * 4px); margin-top: calc(var(--width360) * 12px);}
.homepage-new .curriculum-dots .dot{width: calc(var(--width360) * 4px); height: calc(var(--width360) * 4px);}
.homepage-new .curriculum-dots .dot.active{width: calc(var(--width360) * 20px); border-radius: calc(var(--width360) * 2px);}
.homepage-new .hot-tags{padding: calc(var(--width360) * 14px) 0 0;}


.homepage-new .hot-tags-header{margin-bottom: calc(var(--width360) * 8px);}
.homepage-new .tags-list{gap: calc(var(--width360) * 8px);}
.homepage-new .tag{padding: calc(var(--width360) * 4px) calc(var(--width360) * 16px); border-radius: calc(var(--width360) * 16px); font-size: calc(var(--width360) * 14px);}

.homepage-new .products-grid{gap: calc(var(--width360) * 16px);}

.homepage-new .swiper-container.products-swiper .swiper-slide{padding: calc(var(--width360) * 4px);}
.homepage-new .swiper-container.products-swiper .products-grid{gap: calc(var(--width360) * 12px);}

.homepage-new .products-pagination{margin-top: calc(var(--width360) * 16px); gap: calc(var(--width360) * 6px);}


.homepage-new .product-card{padding: calc(var(--width360) * 10px); min-width: 0px; border-radius: calc(var(--width360) * 8px); box-shadow: 0 0 calc(var(--width360) * 4px) 0 rgba(203,203,203,0.42);}
.homepage-new .product-tags{flex-wrap: nowrap; border-radius: calc(var(--width360) * 10px); top: calc(var(--width360) * 8px); left: calc(var(--width360) * 10px); gap: calc(var(--width360) * 3px); max-width: calc(100% - calc(var(--width360) * 36px));}
.homepage-new .tagsa{padding: calc(var(--width360) * 1px) calc(var(--width360) * 5px); font-size: calc(var(--width360) * 10px); border-radius: calc(var(--width360) * 8px); white-space: nowrap;}

.homepage-new .product-thumb{border-radius: calc(var(--width360) * 8px); margin: calc(var(--width360) * 24px) 0 0 0;}
.homepage-new .product-name{font-size: calc(var(--width360) * 16px); margin: calc(var(--width360) * 7px) 0 calc(var(--width360) * 3px) 0;}
.homepage-new .product-meta{font-size: calc(var(--width360) * 12px); margin-bottom: calc(var(--width360) * 4px);}
.homepage-new .product-rating{min-width: 0px; font-size: calc(var(--width360) * 11px);}
.homepage-new .product-rating b{width: calc(var(--width360) * 10px); height: calc(var(--width360) * 10px); margin: 0 calc(var(--width360) * 2px) 0 0;}
.homepage-new .product-rating span{min-width: 0px;}
.homepage-new .product-rating span:nth-of-type(1){margin: 0 calc(var(--width360) * 3px);}
.homepage-new .product-rating span:nth-of-type(2){min-width: 0px;}
.homepage-new .feed-layout{gap: calc(var(--width360) * 24px); margin: calc(var(--width360) * 32px) auto calc(var(--width360) * 32px);}
.homepage-new .feed-main{min-width: 0px;}
.homepage-new .feed-sidebar{border-radius: 0px;}
.homepage-new .feed-tabs{gap: calc(var(--width360) * 10px); padding: 0 var(--page-pad) calc(var(--width360) * 2px);}
.homepage-new .feed-tabs .tab{width: calc(var(--width360) * 98px); padding: 0 calc(var(--width360) * 24px); height: calc(var(--width360) * 32px); border-radius: calc(var(--width360) * 16px); font-size: calc(var(--width360) * 14px);}



.homepage-new .sidiv{margin: 0px;}
.homepage-new .sidiv .sidebar-list{gap: calc(var(--width360) * 16px); margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: calc(var(--width360) * 34px); border-radius: calc(var(--width360) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-hot{border-radius: calc(var(--width360) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-new{border-radius: calc(var(--width360) * 4px);}
.homepage-new .sidiv .sidebar-list a{gap: calc(var(--width360) * 8px); height: calc(var(--width360) * 34px); padding: 0 0 0 calc(var(--width360) * 7px); font-size: calc(var(--width360) * 16px); line-height: calc(var(--width360) * 34px);}
.homepage-new .sidiv .sidebar-icon{width: calc(var(--width360) * 18px); height: calc(var(--width360) * 18px); margin: 0 calc(var(--width360) * 6px) 0 0;}
.homepage-new .sidiv .sidebar-text{min-width: 0px;}
.homepage-new .sidiv .sidebar-views{gap: calc(var(--width360) * 4px); font-size: calc(var(--width360) * 16px); padding-top: 0px;}
.homepage-new .sidiv .sidebar-views .views-icon{width: calc(var(--width360) * 11px); height: calc(var(--width360) * 14px);}
.homepage-new .sidiv .products-pagination{margin-top: calc(var(--width360) * 16px);}

.homepage-new .article-list{gap: 0px; margin: calc(var(--width360) * 4px) 0 0 0;}
.homepage-new .article-item{gap: calc(var(--width360) * 12px); padding: calc(var(--width360) * 10px) 0;}
.homepage-new .article-body{min-width: 0px;}
.homepage-new .article-title{font-size: calc(var(--width360) * 16px); margin-bottom: calc(var(--width360) * 2px);}
.homepage-new .article-summary{font-size: calc(var(--width360) * 14px); max-height: calc(var(--width360) * 20px); line-height: calc(var(--width360) * 18px); margin-bottom: calc(var(--width360) * 3px);}
.homepage-new .article-tags{gap: calc(var(--width360) * 6px); margin-top: calc(var(--width360) * 4px);}
.homepage-new .article-tag{padding: calc(var(--width360) * 1px) calc(var(--width360) * 8px); border-radius: calc(var(--width360) * 11px); font-size: calc(var(--width360) * 10px);}
.idx .homepage-new .article-tag{padding: calc(var(--width360) * 1px) calc(var(--width360) * 8px);}

.homepage-new .article-info{font-size: calc(var(--width360) * 12px); gap: calc(var(--width360) * 10px);}
.homepage-new .article-thumb{width: calc(var(--width360) * 148px); height: calc(var(--width360) * 88px); border-radius: calc(var(--width360) * 6px); margin-top: calc(var(--width360) * 2px);}
.homepage-new .article-thumb-small{width: calc(var(--width360) * 88px); height: calc(var(--width360) * 88px);}
.homepage-new .btn-more-info{gap: calc(var(--width360) * 6px); height: calc(var(--width360) * 38px); margin-top: calc(var(--width360) * 16px); border-radius: calc(var(--width360) * 21px); font-size: calc(var(--width360) * 16px);}
.homepage-new .icon-more{width: calc(var(--width360) * 16px); height: calc(var(--width360) * 16px);}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{margin: 0 calc(var(--width360) * 3px) 0 0; width: calc(var(--width360) * 12px); height: calc(var(--width360) * 12px);}
.homepage-new .sidebar-title{font-size: calc(var(--width360) * 17px);}
.homepage-new .sidebar-list li{padding: 0px;}
.homepage-new .sidebar-list a{gap: calc(var(--width360) * 10px); padding: calc(var(--width360) * 12px) 0; font-size: calc(var(--width360) * 14px);}
.homepage-new .sidebar-icon{width: calc(var(--width360) * 16px); height: calc(var(--width360) * 16px); margin: 0 calc(var(--width360) * 4px) 0 0;}
.homepage-new .sidebar-text{min-width: 0px;}
.homepage-new .sidebar-views{font-size: calc(var(--width360) * 12px); padding-top: calc(var(--width360) * 2px);}













































































































































































































































































































































.idx .homepage-new .hero-title .highlight{display: inline; font-size: calc(var(--width360) * 28px); margin: 0px; width: auto; letter-spacing: calc(var(--width360) * 1px); font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}


}
@media screen and (max-width: 331px){
.homepage-new *{margin: 0px; padding: 0px;}

.homepage-new ul{padding-left: 0px;}














































.homepage-new .curriculum{padding-top: 0px; padding-bottom: 0px;}
.homepage-new .hero-inner{min-height: calc(var(--width330) * 243px);}
.homepage-new .hero-title{letter-spacing: calc(var(--width330) * 6px); font-size: calc(var(--width330) * 32px); line-height: calc(var(--width330) * 42px); margin: 0 0 calc(var(--width330) * 12px); font-weight: 400;}
.homepage-new .hero-title span:nth-child(1){letter-spacing: calc(var(--width330) * 5px);}
.homepage-new .hero-title .highlight{margin: calc(var(--width330) * 6px) auto; letter-spacing: calc(var(--width330) * 4px); width: calc(var(--width330) * 210px);}
.homepage-new .hero-subtitle{font-size: calc(var(--width330) * 12px); margin-bottom: calc(var(--width330) * 15px); letter-spacing: calc(var(--width330) * 0.5px);}
.homepage-new .hero-btns{gap: calc(var(--width330) * 12px);}
.homepage-new .btn-primary{height: calc(var(--width330) * 32px); border-radius: calc(var(--width330) * 22px); font-size: calc(var(--width330) * 12px); width: calc(var(--width330) * 153px); gap: calc(var(--width330) * 4px);}
.homepage-new .btn-outline{--border-radius: 44px; width: calc(var(--width330) * 107px); height: calc(var(--width330) * 32px); border-radius: calc(var(--width330) * 26px); font-size: calc(var(--width330) * 12px);}
.homepage-new .btn-outline::after{left: 0px; top: 0px; border-radius: calc(var(--width330) * 26px);}
.homepage-new .section-header{margin-bottom: calc(var(--width330) * 12px);}
.homepage-new .section-title{font-size: calc(var(--width330) * 18px);}
.homepage-new .section-more{font-size: calc(var(--width330) * 14px);}
.homepage-new .section-more b{width: calc(var(--width330) * 8px); height: calc(var(--width330) * 8px); margin: 0 0 0 calc(var(--width330) * 3px);}
.homepage-new .curriculum-scroll{padding: 0 var(--page-pad) calc(var(--width330) * 4px);}
.homepage-new .curriculum-grid{gap: calc(var(--width330) * 10px);}
.homepage-new .curriculum-card{box-shadow: 0 0 calc(var(--width330) * 4px) 0 rgba(203,203,203,0.42); min-height: 0px; border-radius: calc(var(--width330) * 8px); width: calc(var(--width330) * 194px);}
.homepage-new .products{margin: calc(var(--width330) * 25px) 0 0 0;}
.homepage-new .card-body{padding: calc(var(--width330) * 10px) calc(var(--width330) * 12px) calc(var(--width330) * 12px);}
.homepage-new .card-title-row{gap: calc(var(--width330) * 6px);}
.homepage-new .card-title-row h3{font-size: calc(var(--width330) * 14px);}
.homepage-new .card-badge{padding: calc(var(--width330) * 1px) calc(var(--width330) * 8px); font-size: calc(var(--width330) * 10px); border-radius: calc(var(--width330) * 10px); line-height: calc(var(--width330) * 16px);}
.homepage-new .card-desc{margin: calc(var(--width330) * 4px) 0 calc(var(--width330) * 8px); font-size: calc(var(--width330) * 12px);}
.homepage-new .card-links{margin: 0 0 calc(var(--width330) * 8px); gap: calc(var(--width330) * 2px);}
.homepage-new .card-links a{gap: calc(var(--width330) * 5px); min-width: 0px; font-size: calc(var(--width330) * 12px); padding: calc(var(--width330) * 4px) 0;}
.homepage-new .card-links a b{width: calc(var(--width330) * 10px); height: calc(var(--width330) * 10px);}
.homepage-new .card-cta{height: calc(var(--width330) * 30px); border-radius: calc(var(--width330) * 15px); font-size: calc(var(--width330) * 12px); gap: calc(var(--width330) * 4px);}
.homepage-new .card-cta b{width: calc(var(--width330) * 8px); height: calc(var(--width330) * 8px);}
.homepage-new .curriculum-dots{gap: calc(var(--width330) * 4px); margin-top: calc(var(--width330) * 12px);}
.homepage-new .curriculum-dots .dot{width: calc(var(--width330) * 4px); height: calc(var(--width330) * 4px);}
.homepage-new .curriculum-dots .dot.active{width: calc(var(--width330) * 20px); border-radius: calc(var(--width330) * 2px);}
.homepage-new .hot-tags{padding: calc(var(--width330) * 14px) 0 0;}


.homepage-new .hot-tags-header{margin-bottom: calc(var(--width330) * 8px);}
.homepage-new .tags-list{gap: calc(var(--width330) * 8px);}
.homepage-new .tag{padding: calc(var(--width330) * 4px) calc(var(--width330) * 16px); border-radius: calc(var(--width330) * 16px); font-size: calc(var(--width330) * 14px);}

.homepage-new .products-grid{gap: calc(var(--width330) * 16px);}

.homepage-new .swiper-container.products-swiper .swiper-slide{padding: calc(var(--width330) * 4px);}
.homepage-new .swiper-container.products-swiper .products-grid{gap: calc(var(--width330) * 12px);}

.homepage-new .products-pagination{margin-top: calc(var(--width330) * 16px); gap: calc(var(--width330) * 6px);}


.homepage-new .product-card{padding: calc(var(--width330) * 10px); min-width: 0px; border-radius: calc(var(--width330) * 8px); box-shadow: 0 0 calc(var(--width330) * 4px) 0 rgba(203,203,203,0.42);}
.homepage-new .product-tags{flex-wrap: nowrap; border-radius: calc(var(--width330) * 10px); top: calc(var(--width330) * 8px); left: calc(var(--width330) * 10px); gap: calc(var(--width330) * 3px); max-width: calc(100% - calc(var(--width330) * 36px));}
.homepage-new .tagsa{padding: calc(var(--width330) * 1px) calc(var(--width330) * 5px); font-size: calc(var(--width330) * 10px); border-radius: calc(var(--width330) * 8px); white-space: nowrap;}

.homepage-new .product-thumb{border-radius: calc(var(--width330) * 8px); margin: calc(var(--width330) * 24px) 0 0 0;}
.homepage-new .product-name{font-size: calc(var(--width330) * 16px); margin: calc(var(--width330) * 7px) 0 calc(var(--width330) * 3px) 0;}
.homepage-new .product-meta{font-size: calc(var(--width330) * 12px); margin-bottom: calc(var(--width330) * 4px);}
.homepage-new .product-rating{min-width: 0px; font-size: calc(var(--width330) * 11px);}
.homepage-new .product-rating b{width: calc(var(--width330) * 10px); height: calc(var(--width330) * 10px); margin: 0 calc(var(--width330) * 2px) 0 0;}
.homepage-new .product-rating span{min-width: 0px;}
.homepage-new .product-rating span:nth-of-type(1){margin: 0 calc(var(--width330) * 3px);}
.homepage-new .product-rating span:nth-of-type(2){min-width: 0px;}
.homepage-new .feed-layout{gap: calc(var(--width330) * 24px); margin: calc(var(--width330) * 32px) auto calc(var(--width330) * 32px);}
.homepage-new .feed-main{min-width: 0px;}
.homepage-new .feed-sidebar{border-radius: 0px;}
.homepage-new .feed-tabs{gap: calc(var(--width330) * 10px); padding: 0 var(--page-pad) calc(var(--width330) * 2px);}
.homepage-new .feed-tabs .tab{width: calc(var(--width330) * 98px); padding: 0 calc(var(--width330) * 24px); height: calc(var(--width330) * 32px); border-radius: calc(var(--width330) * 16px); font-size: calc(var(--width330) * 14px);}



.homepage-new .sidiv{margin: 0px;}
.homepage-new .sidiv .sidebar-list{gap: calc(var(--width330) * 16px); margin: 0px;}
.homepage-new .sidiv .sidebar-list li{height: calc(var(--width330) * 34px); border-radius: calc(var(--width330) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-hot{border-radius: calc(var(--width330) * 4px);}
.homepage-new .sidiv .sidebar-list li.is-new{border-radius: calc(var(--width330) * 4px);}
.homepage-new .sidiv .sidebar-list a{gap: calc(var(--width330) * 8px); height: calc(var(--width330) * 34px); padding: 0 0 0 calc(var(--width330) * 7px); font-size: calc(var(--width330) * 16px); line-height: calc(var(--width330) * 34px);}
.homepage-new .sidiv .sidebar-icon{width: calc(var(--width330) * 18px); height: calc(var(--width330) * 18px); margin: 0 calc(var(--width330) * 6px) 0 0;}
.homepage-new .sidiv .sidebar-text{min-width: 0px;}
.homepage-new .sidiv .sidebar-views{gap: calc(var(--width330) * 4px); font-size: calc(var(--width330) * 16px); padding-top: 0px;}
.homepage-new .sidiv .sidebar-views .views-icon{width: calc(var(--width330) * 11px); height: calc(var(--width330) * 14px);}
.homepage-new .sidiv .products-pagination{margin-top: calc(var(--width330) * 16px);}

.homepage-new .article-list{gap: 0px; margin: calc(var(--width330) * 4px) 0 0 0;}
.homepage-new .article-item{gap: calc(var(--width330) * 12px); padding: calc(var(--width330) * 10px) 0;}
.homepage-new .article-body{min-width: 0px;}
.homepage-new .article-title{font-size: calc(var(--width330) * 16px); margin-bottom: calc(var(--width330) * 2px);}
.homepage-new .article-summary{font-size: calc(var(--width330) * 14px); max-height: calc(var(--width330) * 20px); line-height: calc(var(--width330) * 18px); margin-bottom: calc(var(--width330) * 3px);}
.homepage-new .article-tags{gap: calc(var(--width330) * 6px); margin-top: calc(var(--width330) * 4px);}
.homepage-new .article-tag{padding: calc(var(--width330) * 1px) calc(var(--width330) * 8px); border-radius: calc(var(--width330) * 11px); font-size: calc(var(--width330) * 10px);}
.idx .homepage-new .article-tag{padding: calc(var(--width330) * 1px) calc(var(--width330) * 8px);}

.homepage-new .article-info{font-size: calc(var(--width330) * 12px); gap: calc(var(--width330) * 10px);}
.homepage-new .article-thumb{width: calc(var(--width330) * 148px); height: calc(var(--width330) * 88px); border-radius: calc(var(--width330) * 6px); margin-top: calc(var(--width330) * 2px);}
.homepage-new .article-thumb-small{width: calc(var(--width330) * 88px); height: calc(var(--width330) * 88px);}
.homepage-new .btn-more-info{gap: calc(var(--width330) * 6px); height: calc(var(--width330) * 38px); margin-top: calc(var(--width330) * 16px); border-radius: calc(var(--width330) * 21px); font-size: calc(var(--width330) * 16px);}
.homepage-new .icon-more{width: calc(var(--width330) * 16px); height: calc(var(--width330) * 16px);}

.homepage-new .info-name b,.homepage-new .info-time b,.homepage-new .info-watch b{margin: 0 calc(var(--width330) * 3px) 0 0; width: calc(var(--width330) * 12px); height: calc(var(--width330) * 12px);}
.homepage-new .sidebar-title{font-size: calc(var(--width330) * 17px);}
.homepage-new .sidebar-list li{padding: 0px;}
.homepage-new .sidebar-list a{gap: calc(var(--width330) * 10px); padding: calc(var(--width330) * 12px) 0; font-size: calc(var(--width330) * 14px);}
.homepage-new .sidebar-icon{width: calc(var(--width330) * 16px); height: calc(var(--width330) * 16px); margin: 0 calc(var(--width330) * 4px) 0 0;}
.homepage-new .sidebar-text{min-width: 0px;}
.homepage-new .sidebar-views{font-size: calc(var(--width330) * 12px); padding-top: calc(var(--width330) * 2px);}













































































































































































































































































































































.idx .homepage-new .hero-title .highlight{display: inline; font-size: calc(var(--width330) * 28px); margin: 0px; width: auto; letter-spacing: calc(var(--width330) * 1px); font-style: normal; background: linear-gradient(90deg, rgb(60, 223, 120) 0%, rgb(34, 102, 244) 100%) text; -webkit-text-fill-color: transparent; color: transparent;}


}
.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: 28px 0px 24px; background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: 16px; margin-bottom: 20px; padding: 0px 8px;}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: 22px;}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: 8px; height: 8px;}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: 5px; height: 7px;}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: 2px;}
.idx .homepage-new .hero-playground{margin: 0px 16px 4px; border-radius: 5px; overflow: hidden; background: rgb(18, 29, 48); box-shadow: rgba(26, 29, 46, 0.18) 0px 8px 24px; text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: 8px; height: 40px; border-bottom: 1px solid rgb(34, 47, 68); padding: 0px 12px; background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: 5px; flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: 8px; height: 8px; border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: 14px; color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: 78px; height: 22px; background: rgb(37, 53, 75); border-radius: 2px; border: 1px solid rgb(52, 67, 87); display: inline-flex; align-items: center; gap: 4px; padding: 0px 8px; color: rgb(155, 169, 188); font-size: 12px; flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: 8px; height: 10px;}
.idx .homepage-new .pg-code{padding: 14px 0px 10px 12px; max-height: 126px; overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: 12px; line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: 135px; padding: 0px 0px 14px; background: rgb(12, 23, 39); margin: 20px 10px 10px; display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: 37px; border-bottom: 1px solid rgb(34, 47, 68); padding: 0px 14px; display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: 12px; color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: 6px;}
.idx .homepage-new .pg-badges span{display: inline-flex; width: 78px; height: 22px; align-items: center; padding: 0px 7px; border-radius: 4px; font-size: 12px; font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: 8px; height: 10px; margin: 0px 4px 0px 0px;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: 8px; height: 10px; margin: 0px 4px 0px 0px;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0px 14px; overflow: auto; font-size: 10px; color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: 10px; color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: 2px; width: 2px;}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: 1px;}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: 10px; padding: 25px 0px 12px;}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: 10px;}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) 4px;}

@media screen and (max-width: 751px){.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: calc(var(--width750) * 28px) 0 calc(var(--width750) * 24px); background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: calc(var(--width750) * 16px); margin-bottom: calc(var(--width750) * 20px); padding: 0 calc(var(--width750) * 8px);}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: calc(var(--width750) * 22px);}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: calc(var(--width750) * 8px); height: calc(var(--width750) * 8px);}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: calc(var(--width750) * 5px); height: calc(var(--width750) * 7px);}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: calc(var(--width750) * 2px);}
.idx .homepage-new .hero-playground{margin: 0 calc(var(--width750) * 16px) calc(var(--width750) * 4px) calc(var(--width750) * 16px); border-radius: calc(var(--width750) * 5px); overflow: hidden; background: rgb(18, 29, 48); box-shadow: 0 calc(var(--width750) * 8px) calc(var(--width750) * 24px) rgba(26, 29, 46, 0.18); text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: calc(var(--width750) * 8px); height: calc(var(--width750) * 40px); border-bottom: calc(var(--width750) * 1px) solid #222F44; padding: 0 calc(var(--width750) * 12px); background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: calc(var(--width750) * 5px); flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: calc(var(--width750) * 8px); height: calc(var(--width750) * 8px); border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: calc(var(--width750) * 14px); color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: calc(var(--width750) * 78px); height: calc(var(--width750) * 22px); background: rgb(37, 53, 75); border-radius: calc(var(--width750) * 2px); border: calc(var(--width750) * 1px) solid #344357; display: inline-flex; align-items: center; gap: calc(var(--width750) * 4px); padding: 0 calc(var(--width750) * 8px); color: rgb(155, 169, 188); font-size: calc(var(--width750) * 12px); flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: calc(var(--width750) * 8px); height: calc(var(--width750) * 10px);}
.idx .homepage-new .pg-code{padding: calc(var(--width750) * 14px) 0 calc(var(--width750) * 10px) calc(var(--width750) * 12px); max-height: calc(var(--width750) * 126px); overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: calc(var(--width750) * 12px); line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: calc(var(--width750) * 135px); padding: 0 0 calc(var(--width750) * 14px); background: rgb(12, 23, 39); margin: calc(var(--width750) * 20px) calc(var(--width750) * 10px) calc(var(--width750) * 10px) calc(var(--width750) * 10px); display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: calc(var(--width750) * 37px); border-bottom: calc(var(--width750) * 1px) solid #222F44; padding: 0 calc(var(--width750) * 14px); display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(var(--width750) * 8px); flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: calc(var(--width750) * 12px); color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: calc(var(--width750) * 6px);}
.idx .homepage-new .pg-badges span{display: inline-flex; width: calc(var(--width750) * 78px); height: calc(var(--width750) * 22px); align-items: center; padding: 0 calc(var(--width750) * 7px); border-radius: calc(var(--width750) * 4px); font-size: calc(var(--width750) * 12px); font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: calc(var(--width750) * 8px); height: calc(var(--width750) * 10px); margin: 0 calc(var(--width750) * 4px) 0 0;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: calc(var(--width750) * 8px); height: calc(var(--width750) * 10px); margin: 0 calc(var(--width750) * 4px) 0 0;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0 calc(var(--width750) * 14px); overflow: auto; font-size: calc(var(--width750) * 10px); color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: calc(var(--width750) * 10px); color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: calc(var(--width750) * 2px); width: calc(var(--width750) * 2px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: calc(var(--width750) * 1px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: calc(var(--width750) * 10px); padding: calc(var(--width750) * 25px) 0 calc(var(--width750) * 12px);}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: calc(var(--width750) * 10px);}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) calc(var(--width750) * 4px);}
}
@media screen and (max-width: 561px){.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: calc(var(--width560) * 28px) 0 calc(var(--width560) * 24px); background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: calc(var(--width560) * 16px); margin-bottom: calc(var(--width560) * 20px); padding: 0 calc(var(--width560) * 8px);}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: calc(var(--width560) * 22px);}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: calc(var(--width560) * 8px); height: calc(var(--width560) * 8px);}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: calc(var(--width560) * 5px); height: calc(var(--width560) * 7px);}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: calc(var(--width560) * 2px);}
.idx .homepage-new .hero-playground{margin: 0 calc(var(--width560) * 16px) calc(var(--width560) * 4px) calc(var(--width560) * 16px); border-radius: calc(var(--width560) * 5px); overflow: hidden; background: rgb(18, 29, 48); box-shadow: 0 calc(var(--width560) * 8px) calc(var(--width560) * 24px) rgba(26, 29, 46, 0.18); text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: calc(var(--width560) * 8px); height: calc(var(--width560) * 40px); border-bottom: calc(var(--width560) * 1px) solid #222F44; padding: 0 calc(var(--width560) * 12px); background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: calc(var(--width560) * 5px); flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: calc(var(--width560) * 8px); height: calc(var(--width560) * 8px); border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: calc(var(--width560) * 14px); color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: calc(var(--width560) * 78px); height: calc(var(--width560) * 22px); background: rgb(37, 53, 75); border-radius: calc(var(--width560) * 2px); border: calc(var(--width560) * 1px) solid #344357; display: inline-flex; align-items: center; gap: calc(var(--width560) * 4px); padding: 0 calc(var(--width560) * 8px); color: rgb(155, 169, 188); font-size: calc(var(--width560) * 12px); flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: calc(var(--width560) * 8px); height: calc(var(--width560) * 10px);}
.idx .homepage-new .pg-code{padding: calc(var(--width560) * 14px) 0 calc(var(--width560) * 10px) calc(var(--width560) * 12px); max-height: calc(var(--width560) * 126px); overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: calc(var(--width560) * 12px); line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: calc(var(--width560) * 135px); padding: 0 0 calc(var(--width560) * 14px); background: rgb(12, 23, 39); margin: calc(var(--width560) * 20px) calc(var(--width560) * 10px) calc(var(--width560) * 10px) calc(var(--width560) * 10px); display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: calc(var(--width560) * 37px); border-bottom: calc(var(--width560) * 1px) solid #222F44; padding: 0 calc(var(--width560) * 14px); display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(var(--width560) * 8px); flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: calc(var(--width560) * 12px); color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: calc(var(--width560) * 6px);}
.idx .homepage-new .pg-badges span{display: inline-flex; width: calc(var(--width560) * 78px); height: calc(var(--width560) * 22px); align-items: center; padding: 0 calc(var(--width560) * 7px); border-radius: calc(var(--width560) * 4px); font-size: calc(var(--width560) * 12px); font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: calc(var(--width560) * 8px); height: calc(var(--width560) * 10px); margin: 0 calc(var(--width560) * 4px) 0 0;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: calc(var(--width560) * 8px); height: calc(var(--width560) * 10px); margin: 0 calc(var(--width560) * 4px) 0 0;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0 calc(var(--width560) * 14px); overflow: auto; font-size: calc(var(--width560) * 10px); color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: calc(var(--width560) * 10px); color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: calc(var(--width560) * 2px); width: calc(var(--width560) * 2px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: calc(var(--width560) * 1px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: calc(var(--width560) * 10px); padding: calc(var(--width560) * 25px) 0 calc(var(--width560) * 12px);}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: calc(var(--width560) * 10px);}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) calc(var(--width560) * 4px);}
}
@media screen and (max-width: 541px){.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: calc(var(--width540) * 28px) 0 calc(var(--width540) * 24px); background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: calc(var(--width540) * 16px); margin-bottom: calc(var(--width540) * 20px); padding: 0 calc(var(--width540) * 8px);}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: calc(var(--width540) * 22px);}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: calc(var(--width540) * 8px); height: calc(var(--width540) * 8px);}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: calc(var(--width540) * 5px); height: calc(var(--width540) * 7px);}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: calc(var(--width540) * 2px);}
.idx .homepage-new .hero-playground{margin: 0 calc(var(--width540) * 16px) calc(var(--width540) * 4px) calc(var(--width540) * 16px); border-radius: calc(var(--width540) * 5px); overflow: hidden; background: rgb(18, 29, 48); box-shadow: 0 calc(var(--width540) * 8px) calc(var(--width540) * 24px) rgba(26, 29, 46, 0.18); text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: calc(var(--width540) * 8px); height: calc(var(--width540) * 40px); border-bottom: calc(var(--width540) * 1px) solid #222F44; padding: 0 calc(var(--width540) * 12px); background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: calc(var(--width540) * 5px); flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: calc(var(--width540) * 8px); height: calc(var(--width540) * 8px); border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: calc(var(--width540) * 14px); color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: calc(var(--width540) * 78px); height: calc(var(--width540) * 22px); background: rgb(37, 53, 75); border-radius: calc(var(--width540) * 2px); border: calc(var(--width540) * 1px) solid #344357; display: inline-flex; align-items: center; gap: calc(var(--width540) * 4px); padding: 0 calc(var(--width540) * 8px); color: rgb(155, 169, 188); font-size: calc(var(--width540) * 12px); flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: calc(var(--width540) * 8px); height: calc(var(--width540) * 10px);}
.idx .homepage-new .pg-code{padding: calc(var(--width540) * 14px) 0 calc(var(--width540) * 10px) calc(var(--width540) * 12px); max-height: calc(var(--width540) * 126px); overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: calc(var(--width540) * 12px); line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: calc(var(--width540) * 135px); padding: 0 0 calc(var(--width540) * 14px); background: rgb(12, 23, 39); margin: calc(var(--width540) * 20px) calc(var(--width540) * 10px) calc(var(--width540) * 10px) calc(var(--width540) * 10px); display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: calc(var(--width540) * 37px); border-bottom: calc(var(--width540) * 1px) solid #222F44; padding: 0 calc(var(--width540) * 14px); display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(var(--width540) * 8px); flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: calc(var(--width540) * 12px); color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: calc(var(--width540) * 6px);}
.idx .homepage-new .pg-badges span{display: inline-flex; width: calc(var(--width540) * 78px); height: calc(var(--width540) * 22px); align-items: center; padding: 0 calc(var(--width540) * 7px); border-radius: calc(var(--width540) * 4px); font-size: calc(var(--width540) * 12px); font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: calc(var(--width540) * 8px); height: calc(var(--width540) * 10px); margin: 0 calc(var(--width540) * 4px) 0 0;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: calc(var(--width540) * 8px); height: calc(var(--width540) * 10px); margin: 0 calc(var(--width540) * 4px) 0 0;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0 calc(var(--width540) * 14px); overflow: auto; font-size: calc(var(--width540) * 10px); color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: calc(var(--width540) * 10px); color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: calc(var(--width540) * 2px); width: calc(var(--width540) * 2px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: calc(var(--width540) * 1px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: calc(var(--width540) * 10px); padding: calc(var(--width540) * 25px) 0 calc(var(--width540) * 12px);}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: calc(var(--width540) * 10px);}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) calc(var(--width540) * 4px);}
}
@media screen and (max-width: 516px){.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: calc(var(--width516) * 28px) 0 calc(var(--width516) * 24px); background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: calc(var(--width516) * 16px); margin-bottom: calc(var(--width516) * 20px); padding: 0 calc(var(--width516) * 8px);}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: calc(var(--width516) * 22px);}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: calc(var(--width516) * 8px); height: calc(var(--width516) * 8px);}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: calc(var(--width516) * 5px); height: calc(var(--width516) * 7px);}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: calc(var(--width516) * 2px);}
.idx .homepage-new .hero-playground{margin: 0 calc(var(--width516) * 16px) calc(var(--width516) * 4px) calc(var(--width516) * 16px); border-radius: calc(var(--width516) * 5px); overflow: hidden; background: rgb(18, 29, 48); box-shadow: 0 calc(var(--width516) * 8px) calc(var(--width516) * 24px) rgba(26, 29, 46, 0.18); text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: calc(var(--width516) * 8px); height: calc(var(--width516) * 40px); border-bottom: calc(var(--width516) * 1px) solid #222F44; padding: 0 calc(var(--width516) * 12px); background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: calc(var(--width516) * 5px); flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: calc(var(--width516) * 8px); height: calc(var(--width516) * 8px); border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: calc(var(--width516) * 14px); color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: calc(var(--width516) * 78px); height: calc(var(--width516) * 22px); background: rgb(37, 53, 75); border-radius: calc(var(--width516) * 2px); border: calc(var(--width516) * 1px) solid #344357; display: inline-flex; align-items: center; gap: calc(var(--width516) * 4px); padding: 0 calc(var(--width516) * 8px); color: rgb(155, 169, 188); font-size: calc(var(--width516) * 12px); flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: calc(var(--width516) * 8px); height: calc(var(--width516) * 10px);}
.idx .homepage-new .pg-code{padding: calc(var(--width516) * 14px) 0 calc(var(--width516) * 10px) calc(var(--width516) * 12px); max-height: calc(var(--width516) * 126px); overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: calc(var(--width516) * 12px); line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: calc(var(--width516) * 135px); padding: 0 0 calc(var(--width516) * 14px); background: rgb(12, 23, 39); margin: calc(var(--width516) * 20px) calc(var(--width516) * 10px) calc(var(--width516) * 10px) calc(var(--width516) * 10px); display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: calc(var(--width516) * 37px); border-bottom: calc(var(--width516) * 1px) solid #222F44; padding: 0 calc(var(--width516) * 14px); display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(var(--width516) * 8px); flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: calc(var(--width516) * 12px); color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: calc(var(--width516) * 6px);}
.idx .homepage-new .pg-badges span{display: inline-flex; width: calc(var(--width516) * 78px); height: calc(var(--width516) * 22px); align-items: center; padding: 0 calc(var(--width516) * 7px); border-radius: calc(var(--width516) * 4px); font-size: calc(var(--width516) * 12px); font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: calc(var(--width516) * 8px); height: calc(var(--width516) * 10px); margin: 0 calc(var(--width516) * 4px) 0 0;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: calc(var(--width516) * 8px); height: calc(var(--width516) * 10px); margin: 0 calc(var(--width516) * 4px) 0 0;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0 calc(var(--width516) * 14px); overflow: auto; font-size: calc(var(--width516) * 10px); color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: calc(var(--width516) * 10px); color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: calc(var(--width516) * 2px); width: calc(var(--width516) * 2px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: calc(var(--width516) * 1px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: calc(var(--width516) * 10px); padding: calc(var(--width516) * 25px) 0 calc(var(--width516) * 12px);}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: calc(var(--width516) * 10px);}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) calc(var(--width516) * 4px);}
}
@media screen and (max-width: 501px){}
@media screen and (max-width: 431px){.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: 28px 0px 24px; background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: 16px; margin-bottom: 20px; padding: 0px 8px;}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: 22px;}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: 8px; height: 8px;}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: 5px; height: 7px;}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: 2px;}
.idx .homepage-new .hero-playground{margin: 0px 16px 4px; border-radius: 5px; overflow: hidden; background: rgb(18, 29, 48); box-shadow: rgba(26, 29, 46, 0.18) 0px 8px 24px; text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: 8px; height: 40px; border-bottom: 1px solid rgb(34, 47, 68); padding: 0px 12px; background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: 5px; flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: 8px; height: 8px; border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: 14px; color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: 78px; height: 22px; background: rgb(37, 53, 75); border-radius: 2px; border: 1px solid rgb(52, 67, 87); display: inline-flex; align-items: center; gap: 4px; padding: 0px 8px; color: rgb(155, 169, 188); font-size: 12px; flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: 8px; height: 10px;}
.idx .homepage-new .pg-code{padding: 14px 0px 10px 12px; max-height: 126px; overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: 12px; line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: 135px; padding: 0px 0px 14px; background: rgb(12, 23, 39); margin: 20px 10px 10px; display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: 37px; border-bottom: 1px solid rgb(34, 47, 68); padding: 0px 14px; display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: 12px; color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: 6px;}
.idx .homepage-new .pg-badges span{display: inline-flex; width: 78px; height: 22px; align-items: center; padding: 0px 7px; border-radius: 4px; font-size: 12px; font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: 8px; height: 10px; margin: 0px 4px 0px 0px;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: 8px; height: 10px; margin: 0px 4px 0px 0px;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0px 14px; overflow: auto; font-size: 10px; color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: 10px; color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: 2px; width: 2px;}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: 1px;}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: 10px; padding: 25px 0px 12px;}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: 10px;}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) 4px;}
}
@media screen and (max-width: 415px){.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: calc(var(--width415) * 28px) 0 calc(var(--width415) * 24px); background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: calc(var(--width415) * 16px); margin-bottom: calc(var(--width415) * 20px); padding: 0 calc(var(--width415) * 8px);}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: calc(var(--width415) * 22px);}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: calc(var(--width415) * 8px); height: calc(var(--width415) * 8px);}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: calc(var(--width415) * 5px); height: calc(var(--width415) * 7px);}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: calc(var(--width415) * 2px);}
.idx .homepage-new .hero-playground{margin: 0 calc(var(--width415) * 16px) calc(var(--width415) * 4px) calc(var(--width415) * 16px); border-radius: calc(var(--width415) * 5px); overflow: hidden; background: rgb(18, 29, 48); box-shadow: 0 calc(var(--width415) * 8px) calc(var(--width415) * 24px) rgba(26, 29, 46, 0.18); text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: calc(var(--width415) * 8px); height: calc(var(--width415) * 40px); border-bottom: calc(var(--width415) * 1px) solid #222F44; padding: 0 calc(var(--width415) * 12px); background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: calc(var(--width415) * 5px); flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: calc(var(--width415) * 8px); height: calc(var(--width415) * 8px); border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: calc(var(--width415) * 14px); color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: calc(var(--width415) * 78px); height: calc(var(--width415) * 22px); background: rgb(37, 53, 75); border-radius: calc(var(--width415) * 2px); border: calc(var(--width415) * 1px) solid #344357; display: inline-flex; align-items: center; gap: calc(var(--width415) * 4px); padding: 0 calc(var(--width415) * 8px); color: rgb(155, 169, 188); font-size: calc(var(--width415) * 12px); flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: calc(var(--width415) * 8px); height: calc(var(--width415) * 10px);}
.idx .homepage-new .pg-code{padding: calc(var(--width415) * 14px) 0 calc(var(--width415) * 10px) calc(var(--width415) * 12px); max-height: calc(var(--width415) * 126px); overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: calc(var(--width415) * 12px); line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: calc(var(--width415) * 135px); padding: 0 0 calc(var(--width415) * 14px); background: rgb(12, 23, 39); margin: calc(var(--width415) * 20px) calc(var(--width415) * 10px) calc(var(--width415) * 10px) calc(var(--width415) * 10px); display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: calc(var(--width415) * 37px); border-bottom: calc(var(--width415) * 1px) solid #222F44; padding: 0 calc(var(--width415) * 14px); display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(var(--width415) * 8px); flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: calc(var(--width415) * 12px); color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: calc(var(--width415) * 6px);}
.idx .homepage-new .pg-badges span{display: inline-flex; width: calc(var(--width415) * 78px); height: calc(var(--width415) * 22px); align-items: center; padding: 0 calc(var(--width415) * 7px); border-radius: calc(var(--width415) * 4px); font-size: calc(var(--width415) * 12px); font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: calc(var(--width415) * 8px); height: calc(var(--width415) * 10px); margin: 0 calc(var(--width415) * 4px) 0 0;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: calc(var(--width415) * 8px); height: calc(var(--width415) * 10px); margin: 0 calc(var(--width415) * 4px) 0 0;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0 calc(var(--width415) * 14px); overflow: auto; font-size: calc(var(--width415) * 10px); color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: calc(var(--width415) * 10px); color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: calc(var(--width415) * 2px); width: calc(var(--width415) * 2px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: calc(var(--width415) * 1px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: calc(var(--width415) * 10px); padding: calc(var(--width415) * 25px) 0 calc(var(--width415) * 12px);}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: calc(var(--width415) * 10px);}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) calc(var(--width415) * 4px);}
}
@media screen and (max-width: 401px){.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: calc(var(--width400) * 28px) 0 calc(var(--width400) * 24px); background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: calc(var(--width400) * 16px); margin-bottom: calc(var(--width400) * 20px); padding: 0 calc(var(--width400) * 8px);}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: calc(var(--width400) * 22px);}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: calc(var(--width400) * 8px); height: calc(var(--width400) * 8px);}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: calc(var(--width400) * 5px); height: calc(var(--width400) * 7px);}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: calc(var(--width400) * 2px);}
.idx .homepage-new .hero-playground{margin: 0 calc(var(--width400) * 16px) calc(var(--width400) * 4px) calc(var(--width400) * 16px); border-radius: calc(var(--width400) * 5px); overflow: hidden; background: rgb(18, 29, 48); box-shadow: 0 calc(var(--width400) * 8px) calc(var(--width400) * 24px) rgba(26, 29, 46, 0.18); text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: calc(var(--width400) * 8px); height: calc(var(--width400) * 40px); border-bottom: calc(var(--width400) * 1px) solid #222F44; padding: 0 calc(var(--width400) * 12px); background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: calc(var(--width400) * 5px); flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: calc(var(--width400) * 8px); height: calc(var(--width400) * 8px); border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: calc(var(--width400) * 14px); color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: calc(var(--width400) * 78px); height: calc(var(--width400) * 22px); background: rgb(37, 53, 75); border-radius: calc(var(--width400) * 2px); border: calc(var(--width400) * 1px) solid #344357; display: inline-flex; align-items: center; gap: calc(var(--width400) * 4px); padding: 0 calc(var(--width400) * 8px); color: rgb(155, 169, 188); font-size: calc(var(--width400) * 12px); flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: calc(var(--width400) * 8px); height: calc(var(--width400) * 10px);}
.idx .homepage-new .pg-code{padding: calc(var(--width400) * 14px) 0 calc(var(--width400) * 10px) calc(var(--width400) * 12px); max-height: calc(var(--width400) * 126px); overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: calc(var(--width400) * 12px); line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: calc(var(--width400) * 135px); padding: 0 0 calc(var(--width400) * 14px); background: rgb(12, 23, 39); margin: calc(var(--width400) * 20px) calc(var(--width400) * 10px) calc(var(--width400) * 10px) calc(var(--width400) * 10px); display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: calc(var(--width400) * 37px); border-bottom: calc(var(--width400) * 1px) solid #222F44; padding: 0 calc(var(--width400) * 14px); display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(var(--width400) * 8px); flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: calc(var(--width400) * 12px); color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: calc(var(--width400) * 6px);}
.idx .homepage-new .pg-badges span{display: inline-flex; width: calc(var(--width400) * 78px); height: calc(var(--width400) * 22px); align-items: center; padding: 0 calc(var(--width400) * 7px); border-radius: calc(var(--width400) * 4px); font-size: calc(var(--width400) * 12px); font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: calc(var(--width400) * 8px); height: calc(var(--width400) * 10px); margin: 0 calc(var(--width400) * 4px) 0 0;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: calc(var(--width400) * 8px); height: calc(var(--width400) * 10px); margin: 0 calc(var(--width400) * 4px) 0 0;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0 calc(var(--width400) * 14px); overflow: auto; font-size: calc(var(--width400) * 10px); color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: calc(var(--width400) * 10px); color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: calc(var(--width400) * 2px); width: calc(var(--width400) * 2px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: calc(var(--width400) * 1px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: calc(var(--width400) * 10px); padding: calc(var(--width400) * 25px) 0 calc(var(--width400) * 12px);}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: calc(var(--width400) * 10px);}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) calc(var(--width400) * 4px);}
}
@media screen and (max-width: 395px){.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: calc(var(--width395) * 28px) 0 calc(var(--width395) * 24px); background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: calc(var(--width395) * 16px); margin-bottom: calc(var(--width395) * 20px); padding: 0 calc(var(--width395) * 8px);}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: calc(var(--width395) * 22px);}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: calc(var(--width395) * 8px); height: calc(var(--width395) * 8px);}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: calc(var(--width395) * 5px); height: calc(var(--width395) * 7px);}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: calc(var(--width395) * 2px);}
.idx .homepage-new .hero-playground{margin: 0 calc(var(--width395) * 16px) calc(var(--width395) * 4px) calc(var(--width395) * 16px); border-radius: calc(var(--width395) * 5px); overflow: hidden; background: rgb(18, 29, 48); box-shadow: 0 calc(var(--width395) * 8px) calc(var(--width395) * 24px) rgba(26, 29, 46, 0.18); text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: calc(var(--width395) * 8px); height: calc(var(--width395) * 40px); border-bottom: calc(var(--width395) * 1px) solid #222F44; padding: 0 calc(var(--width395) * 12px); background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: calc(var(--width395) * 5px); flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: calc(var(--width395) * 8px); height: calc(var(--width395) * 8px); border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: calc(var(--width395) * 14px); color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: calc(var(--width395) * 78px); height: calc(var(--width395) * 22px); background: rgb(37, 53, 75); border-radius: calc(var(--width395) * 2px); border: calc(var(--width395) * 1px) solid #344357; display: inline-flex; align-items: center; gap: calc(var(--width395) * 4px); padding: 0 calc(var(--width395) * 8px); color: rgb(155, 169, 188); font-size: calc(var(--width395) * 12px); flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: calc(var(--width395) * 8px); height: calc(var(--width395) * 10px);}
.idx .homepage-new .pg-code{padding: calc(var(--width395) * 14px) 0 calc(var(--width395) * 10px) calc(var(--width395) * 12px); max-height: calc(var(--width395) * 126px); overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: calc(var(--width395) * 12px); line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: calc(var(--width395) * 135px); padding: 0 0 calc(var(--width395) * 14px); background: rgb(12, 23, 39); margin: calc(var(--width395) * 20px) calc(var(--width395) * 10px) calc(var(--width395) * 10px) calc(var(--width395) * 10px); display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: calc(var(--width395) * 37px); border-bottom: calc(var(--width395) * 1px) solid #222F44; padding: 0 calc(var(--width395) * 14px); display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(var(--width395) * 8px); flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: calc(var(--width395) * 12px); color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: calc(var(--width395) * 6px);}
.idx .homepage-new .pg-badges span{display: inline-flex; width: calc(var(--width395) * 78px); height: calc(var(--width395) * 22px); align-items: center; padding: 0 calc(var(--width395) * 7px); border-radius: calc(var(--width395) * 4px); font-size: calc(var(--width395) * 12px); font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: calc(var(--width395) * 8px); height: calc(var(--width395) * 10px); margin: 0 calc(var(--width395) * 4px) 0 0;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: calc(var(--width395) * 8px); height: calc(var(--width395) * 10px); margin: 0 calc(var(--width395) * 4px) 0 0;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0 calc(var(--width395) * 14px); overflow: auto; font-size: calc(var(--width395) * 10px); color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: calc(var(--width395) * 10px); color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: calc(var(--width395) * 2px); width: calc(var(--width395) * 2px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: calc(var(--width395) * 1px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: calc(var(--width395) * 10px); padding: calc(var(--width395) * 25px) 0 calc(var(--width395) * 12px);}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: calc(var(--width395) * 10px);}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) calc(var(--width395) * 4px);}
}
@media screen and (max-width: 391px){.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: calc(var(--width390) * 28px) 0 calc(var(--width390) * 24px); background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: calc(var(--width390) * 16px); margin-bottom: calc(var(--width390) * 20px); padding: 0 calc(var(--width390) * 8px);}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: calc(var(--width390) * 22px);}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: calc(var(--width390) * 8px); height: calc(var(--width390) * 8px);}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: calc(var(--width390) * 5px); height: calc(var(--width390) * 7px);}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: calc(var(--width390) * 2px);}
.idx .homepage-new .hero-playground{margin: 0 calc(var(--width390) * 16px) calc(var(--width390) * 4px) calc(var(--width390) * 16px); border-radius: calc(var(--width390) * 5px); overflow: hidden; background: rgb(18, 29, 48); box-shadow: 0 calc(var(--width390) * 8px) calc(var(--width390) * 24px) rgba(26, 29, 46, 0.18); text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: calc(var(--width390) * 8px); height: calc(var(--width390) * 40px); border-bottom: calc(var(--width390) * 1px) solid #222F44; padding: 0 calc(var(--width390) * 12px); background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: calc(var(--width390) * 5px); flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: calc(var(--width390) * 8px); height: calc(var(--width390) * 8px); border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: calc(var(--width390) * 14px); color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: calc(var(--width390) * 78px); height: calc(var(--width390) * 22px); background: rgb(37, 53, 75); border-radius: calc(var(--width390) * 2px); border: calc(var(--width390) * 1px) solid #344357; display: inline-flex; align-items: center; gap: calc(var(--width390) * 4px); padding: 0 calc(var(--width390) * 8px); color: rgb(155, 169, 188); font-size: calc(var(--width390) * 12px); flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: calc(var(--width390) * 8px); height: calc(var(--width390) * 10px);}
.idx .homepage-new .pg-code{padding: calc(var(--width390) * 14px) 0 calc(var(--width390) * 10px) calc(var(--width390) * 12px); max-height: calc(var(--width390) * 126px); overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: calc(var(--width390) * 12px); line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: calc(var(--width390) * 135px); padding: 0 0 calc(var(--width390) * 14px); background: rgb(12, 23, 39); margin: calc(var(--width390) * 20px) calc(var(--width390) * 10px) calc(var(--width390) * 10px) calc(var(--width390) * 10px); display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: calc(var(--width390) * 37px); border-bottom: calc(var(--width390) * 1px) solid #222F44; padding: 0 calc(var(--width390) * 14px); display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(var(--width390) * 8px); flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: calc(var(--width390) * 12px); color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: calc(var(--width390) * 6px);}
.idx .homepage-new .pg-badges span{display: inline-flex; width: calc(var(--width390) * 78px); height: calc(var(--width390) * 22px); align-items: center; padding: 0 calc(var(--width390) * 7px); border-radius: calc(var(--width390) * 4px); font-size: calc(var(--width390) * 12px); font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: calc(var(--width390) * 8px); height: calc(var(--width390) * 10px); margin: 0 calc(var(--width390) * 4px) 0 0;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: calc(var(--width390) * 8px); height: calc(var(--width390) * 10px); margin: 0 calc(var(--width390) * 4px) 0 0;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0 calc(var(--width390) * 14px); overflow: auto; font-size: calc(var(--width390) * 10px); color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: calc(var(--width390) * 10px); color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: calc(var(--width390) * 2px); width: calc(var(--width390) * 2px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: calc(var(--width390) * 1px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: calc(var(--width390) * 10px); padding: calc(var(--width390) * 25px) 0 calc(var(--width390) * 12px);}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: calc(var(--width390) * 10px);}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) calc(var(--width390) * 4px);}
}
@media screen and (max-width: 379px){.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: calc(var(--width375) * 28px) 0 calc(var(--width375) * 24px); background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: calc(var(--width375) * 16px); margin-bottom: calc(var(--width375) * 20px); padding: 0 calc(var(--width375) * 8px);}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: calc(var(--width375) * 22px);}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: calc(var(--width375) * 8px); height: calc(var(--width375) * 8px);}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: calc(var(--width375) * 5px); height: calc(var(--width375) * 7px);}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: calc(var(--width375) * 2px);}
.idx .homepage-new .hero-playground{margin: 0 calc(var(--width375) * 16px) calc(var(--width375) * 4px) calc(var(--width375) * 16px); border-radius: calc(var(--width375) * 5px); overflow: hidden; background: rgb(18, 29, 48); box-shadow: 0 calc(var(--width375) * 8px) calc(var(--width375) * 24px) rgba(26, 29, 46, 0.18); text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: calc(var(--width375) * 8px); height: calc(var(--width375) * 40px); border-bottom: calc(var(--width375) * 1px) solid #222F44; padding: 0 calc(var(--width375) * 12px); background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: calc(var(--width375) * 5px); flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: calc(var(--width375) * 8px); height: calc(var(--width375) * 8px); border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: calc(var(--width375) * 14px); color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: calc(var(--width375) * 78px); height: calc(var(--width375) * 22px); background: rgb(37, 53, 75); border-radius: calc(var(--width375) * 2px); border: calc(var(--width375) * 1px) solid #344357; display: inline-flex; align-items: center; gap: calc(var(--width375) * 4px); padding: 0 calc(var(--width375) * 8px); color: rgb(155, 169, 188); font-size: calc(var(--width375) * 12px); flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: calc(var(--width375) * 8px); height: calc(var(--width375) * 10px);}
.idx .homepage-new .pg-code{padding: calc(var(--width375) * 14px) 0 calc(var(--width375) * 10px) calc(var(--width375) * 12px); max-height: calc(var(--width375) * 126px); overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: calc(var(--width375) * 12px); line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: calc(var(--width375) * 135px); padding: 0 0 calc(var(--width375) * 14px); background: rgb(12, 23, 39); margin: calc(var(--width375) * 20px) calc(var(--width375) * 10px) calc(var(--width375) * 10px) calc(var(--width375) * 10px); display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: calc(var(--width375) * 37px); border-bottom: calc(var(--width375) * 1px) solid #222F44; padding: 0 calc(var(--width375) * 14px); display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(var(--width375) * 8px); flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: calc(var(--width375) * 12px); color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: calc(var(--width375) * 6px);}
.idx .homepage-new .pg-badges span{display: inline-flex; width: calc(var(--width375) * 78px); height: calc(var(--width375) * 22px); align-items: center; padding: 0 calc(var(--width375) * 7px); border-radius: calc(var(--width375) * 4px); font-size: calc(var(--width375) * 12px); font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: calc(var(--width375) * 8px); height: calc(var(--width375) * 10px); margin: 0 calc(var(--width375) * 4px) 0 0;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: calc(var(--width375) * 8px); height: calc(var(--width375) * 10px); margin: 0 calc(var(--width375) * 4px) 0 0;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0 calc(var(--width375) * 14px); overflow: auto; font-size: calc(var(--width375) * 10px); color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: calc(var(--width375) * 10px); color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: calc(var(--width375) * 2px); width: calc(var(--width375) * 2px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: calc(var(--width375) * 1px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: calc(var(--width375) * 10px); padding: calc(var(--width375) * 25px) 0 calc(var(--width375) * 12px);}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: calc(var(--width375) * 10px);}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) calc(var(--width375) * 4px);}
}
@media screen and (max-width: 361px){.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: calc(var(--width360) * 28px) 0 calc(var(--width360) * 24px); background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: calc(var(--width360) * 16px); margin-bottom: calc(var(--width360) * 20px); padding: 0 calc(var(--width360) * 8px);}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: calc(var(--width360) * 22px);}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: calc(var(--width360) * 8px); height: calc(var(--width360) * 8px);}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: calc(var(--width360) * 5px); height: calc(var(--width360) * 7px);}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: calc(var(--width360) * 2px);}
.idx .homepage-new .hero-playground{margin: 0 calc(var(--width360) * 16px) calc(var(--width360) * 4px) calc(var(--width360) * 16px); border-radius: calc(var(--width360) * 5px); overflow: hidden; background: rgb(18, 29, 48); box-shadow: 0 calc(var(--width360) * 8px) calc(var(--width360) * 24px) rgba(26, 29, 46, 0.18); text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: calc(var(--width360) * 8px); height: calc(var(--width360) * 40px); border-bottom: calc(var(--width360) * 1px) solid #222F44; padding: 0 calc(var(--width360) * 12px); background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: calc(var(--width360) * 5px); flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: calc(var(--width360) * 8px); height: calc(var(--width360) * 8px); border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: calc(var(--width360) * 14px); color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: calc(var(--width360) * 78px); height: calc(var(--width360) * 22px); background: rgb(37, 53, 75); border-radius: calc(var(--width360) * 2px); border: calc(var(--width360) * 1px) solid #344357; display: inline-flex; align-items: center; gap: calc(var(--width360) * 4px); padding: 0 calc(var(--width360) * 8px); color: rgb(155, 169, 188); font-size: calc(var(--width360) * 12px); flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: calc(var(--width360) * 8px); height: calc(var(--width360) * 10px);}
.idx .homepage-new .pg-code{padding: calc(var(--width360) * 14px) 0 calc(var(--width360) * 10px) calc(var(--width360) * 12px); max-height: calc(var(--width360) * 126px); overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: calc(var(--width360) * 12px); line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: calc(var(--width360) * 135px); padding: 0 0 calc(var(--width360) * 14px); background: rgb(12, 23, 39); margin: calc(var(--width360) * 20px) calc(var(--width360) * 10px) calc(var(--width360) * 10px) calc(var(--width360) * 10px); display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: calc(var(--width360) * 37px); border-bottom: calc(var(--width360) * 1px) solid #222F44; padding: 0 calc(var(--width360) * 14px); display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(var(--width360) * 8px); flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: calc(var(--width360) * 12px); color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: calc(var(--width360) * 6px);}
.idx .homepage-new .pg-badges span{display: inline-flex; width: calc(var(--width360) * 78px); height: calc(var(--width360) * 22px); align-items: center; padding: 0 calc(var(--width360) * 7px); border-radius: calc(var(--width360) * 4px); font-size: calc(var(--width360) * 12px); font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: calc(var(--width360) * 8px); height: calc(var(--width360) * 10px); margin: 0 calc(var(--width360) * 4px) 0 0;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: calc(var(--width360) * 8px); height: calc(var(--width360) * 10px); margin: 0 calc(var(--width360) * 4px) 0 0;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0 calc(var(--width360) * 14px); overflow: auto; font-size: calc(var(--width360) * 10px); color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: calc(var(--width360) * 10px); color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: calc(var(--width360) * 2px); width: calc(var(--width360) * 2px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: calc(var(--width360) * 1px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: calc(var(--width360) * 10px); padding: calc(var(--width360) * 25px) 0 calc(var(--width360) * 12px);}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: calc(var(--width360) * 10px);}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) calc(var(--width360) * 4px);}
}
@media screen and (max-width: 331px){.homepage-new .curriculumcon{width: 100%; height: auto; background: transparent; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.homepage-new .curriculumcons{margin: 0px;}
.idx .homepage-new .hero{background: rgb(243, 248, 250);}
.idx .homepage-new .hero-inner{min-height: auto; padding: calc(var(--width330) * 28px) 0 calc(var(--width330) * 24px); background: url(../image/home-20261027/icon70.webp) center top / 100% no-repeat;}
.idx .homepage-new .hero-btns{gap: calc(var(--width330) * 16px); margin-bottom: calc(var(--width330) * 20px); padding: 0 calc(var(--width330) * 8px);}
.idx .homepage-new .hero-btns .btn-outline::after{border-radius: calc(var(--width330) * 22px);}
.idx .homepage-new .hero-btns .ico-arrow{background: url(../image/home-20261027/icon71.png) center top / contain no-repeat; width: calc(var(--width330) * 8px); height: calc(var(--width330) * 8px);}
.idx .homepage-new .hero-btns .ico-run{background: url(../image/home-20261027/icon72.png) center top / contain no-repeat; width: calc(var(--width330) * 5px); height: calc(var(--width330) * 7px);}
.idx .homepage-new .hero-btns .ico-arrow,.idx .homepage-new .hero-btns .ico-run{font-style: normal; margin-left: calc(var(--width330) * 2px);}
.idx .homepage-new .hero-playground{margin: 0 calc(var(--width330) * 16px) calc(var(--width330) * 4px) calc(var(--width330) * 16px); border-radius: calc(var(--width330) * 5px); overflow: hidden; background: rgb(18, 29, 48); box-shadow: 0 calc(var(--width330) * 8px) calc(var(--width330) * 24px) rgba(26, 29, 46, 0.18); text-align: left;}
.idx .homepage-new .pg-hd{display: flex; align-items: center; gap: calc(var(--width330) * 8px); height: calc(var(--width330) * 40px); border-bottom: calc(var(--width330) * 1px) solid #222F44; padding: 0 calc(var(--width330) * 12px); background: rgb(35, 38, 58);}
.idx .homepage-new .pg-dots{display: flex; gap: calc(var(--width330) * 5px); flex-shrink: 0;}
.idx .homepage-new .pg-dots i{width: calc(var(--width330) * 8px); height: calc(var(--width330) * 8px); border-radius: 50%; display: block;}
.idx .homepage-new .pg-dots i:nth-child(1){background: rgb(255, 95, 87);}
.idx .homepage-new .pg-dots i:nth-child(2){background: rgb(254, 188, 46);}
.idx .homepage-new .pg-dots i:nth-child(3){background: rgb(40, 200, 64);}
.idx .homepage-new .pg-title{flex: 1 1 0%; font-size: calc(var(--width330) * 14px); color: rgb(155, 169, 188); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.idx .homepage-new .pg-run{width: calc(var(--width330) * 78px); height: calc(var(--width330) * 22px); background: rgb(37, 53, 75); border-radius: calc(var(--width330) * 2px); border: calc(var(--width330) * 1px) solid #344357; display: inline-flex; align-items: center; gap: calc(var(--width330) * 4px); padding: 0 calc(var(--width330) * 8px); color: rgb(155, 169, 188); font-size: calc(var(--width330) * 12px); flex-shrink: 0;}
.idx .homepage-new .pg-run b{background: url(../image/home-20261027/icon73.png) center top / contain no-repeat; width: calc(var(--width330) * 8px); height: calc(var(--width330) * 10px);}
.idx .homepage-new .pg-code{padding: calc(var(--width330) * 14px) 0 calc(var(--width330) * 10px) calc(var(--width330) * 12px); max-height: calc(var(--width330) * 126px); overflow: auto;}
.idx .homepage-new .pg-code pre{margin: 0px; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: calc(var(--width330) * 12px); line-height: 1.7; color: rgb(230, 232, 239); white-space: pre;}
.idx .homepage-new .pg-code .c-kw{color: rgb(199, 146, 234);}
.idx .homepage-new .pg-code .c-str{color: rgb(195, 232, 141);}
.idx .homepage-new .pg-code .c-cm{color: rgb(103, 110, 149);}
.idx .homepage-new .pg-result{max-height: calc(var(--width330) * 135px); padding: 0 0 calc(var(--width330) * 14px); background: rgb(12, 23, 39); margin: calc(var(--width330) * 20px) calc(var(--width330) * 10px) calc(var(--width330) * 10px) calc(var(--width330) * 10px); display: flex; flex-direction: column; overflow: hidden;}
.idx .homepage-new .pg-result-hd{height: calc(var(--width330) * 37px); border-bottom: calc(var(--width330) * 1px) solid #222F44; padding: 0 calc(var(--width330) * 14px); display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(var(--width330) * 8px); flex-shrink: 0;}
.idx .homepage-new .pg-result-label{font-size: calc(var(--width330) * 12px); color: rgb(155, 169, 188);}
.idx .homepage-new .pg-badges{display: flex; gap: calc(var(--width330) * 6px);}
.idx .homepage-new .pg-badges span{display: inline-flex; width: calc(var(--width330) * 78px); height: calc(var(--width330) * 22px); align-items: center; padding: 0 calc(var(--width330) * 7px); border-radius: calc(var(--width330) * 4px); font-size: calc(var(--width330) * 12px); font-style: normal;}
.idx .homepage-new .badge-fail{background: rgb(75, 37, 37); color: rgb(245, 34, 45);}
.idx .homepage-new .badge-fail b{background: url(../image/home-20261027/icon75.png) 0% 0% / contain no-repeat; width: calc(var(--width330) * 8px); height: calc(var(--width330) * 10px); margin: 0 calc(var(--width330) * 4px) 0 0;}
.idx .homepage-new .badge-ok{background: rgb(37, 75, 66); color: rgb(40, 168, 120);}
.idx .homepage-new .badge-ok b{background: url(../image/home-20261027/icon74.png) 0% 0% / contain no-repeat; width: calc(var(--width330) * 8px); height: calc(var(--width330) * 10px); margin: 0 calc(var(--width330) * 4px) 0 0;}
.idx .homepage-new .pg-output{flex: 1 1 0%; min-height: 0px; padding: 0 calc(var(--width330) * 14px); overflow: auto; font-size: calc(var(--width330) * 10px); color: rgb(159, 187, 179);}
.idx .homepage-new .pg-output p{font-size: calc(var(--width330) * 10px); color: rgb(159, 187, 179); font-family: "SF Mono", Menlo, Consolas, monospace; white-space: nowrap;}
.idx .homepage-new .pg-code::-webkit-scrollbar,.idx .homepage-new .pg-output::-webkit-scrollbar{height: calc(var(--width330) * 2px); width: calc(var(--width330) * 2px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-thumb,.idx .homepage-new .pg-output::-webkit-scrollbar-thumb{background: rgb(34, 47, 68); border-radius: calc(var(--width330) * 1px);}
.idx .homepage-new .pg-code::-webkit-scrollbar-track,.idx .homepage-new .pg-output::-webkit-scrollbar-track{background: transparent;}
.idx .homepage-new .curriculum .curriculumcon{background: rgb(255, 255, 255); border-radius: calc(var(--width330) * 10px); padding: calc(var(--width330) * 25px) 0 calc(var(--width330) * 12px);}
.idx .homepage-new .curriculum .curriculumcons{margin: 0px;}
.idx .homepage-new .curriculum .section-header{padding: 0 var(--page-pad); margin-bottom: calc(var(--width330) * 10px);}
.idx .homepage-new .curriculum .curriculum-scroll{margin: 0px; padding: 0 var(--page-pad) calc(var(--width330) * 4px);}
}
@media (min-width: 431px){
}
.homepage-new .product-card-detail-link{position:absolute;inset:0;z-index:1}.homepage-new .product-tags{position:relative;z-index:2}
body.idx .homepage-new .hero-btns .btn-primary{width:calc(152 / 430 * 100vw);max-width:none;flex:0 0 auto;white-space:nowrap}
body.idx .homepage-new .hero-btns .btn-outline{width:calc(106 / 430 * 100vw);max-width:none;flex:0 0 auto;white-space:nowrap}
body.idx .homepage-new .pg-run{white-space:nowrap;width:calc(86 / 430 * 100vw)}