.home-page{padding-top:120px}.home-page section[name=top] .container{justify-content:flex-start;align-items:center}.home-page section[name=top] .star-icon{background-image:url(/images/star-green.png);background-position:50%;background-repeat:no-repeat;background-size:contain;width:52px;height:52px;display:inline-block}.home-page section[name=top] .title{text-align:center;margin-top:10px;margin-bottom:0;font-size:48px}.home-page section[name=top] .arrow{background-image:url(/images/home-arrow.png);background-position:50%;background-repeat:no-repeat;background-size:contain;width:26px;height:90px;display:inline-block}.home-page section[name=top] .button-row{flex-direction:row;justify-content:center;align-items:center;width:100%;margin-top:20px;margin-bottom:45px;display:inline-flex}.home-page section[name=top] .button{cursor:pointer;background-position:50%;background-repeat:no-repeat;background-size:contain;width:266px;height:87px;margin:0 15px}.home-page section[name=top] .button[name=ios]{background-image:url(/images/app-ios.png)}.home-page section[name=top] .button[name=android]{background-image:url(/images/app-android.png)}.home-page section[name=top] .desc{text-align:center;font-size:26px;position:relative}.home-page section[name=top] .desc span{z-index:1;position:relative}.home-page section[name=top] .desc .circle{z-index:0;background-image:url(/images/home-title-ellipse-purple.png);background-position:50%;background-repeat:no-repeat;background-size:contain;width:120px;height:75px;display:inline-block;position:absolute;top:-20px;right:15%}.home-page section[name=top] .rotate{transform-origin:50%;background-image:url(/images/home-slogan.png);background-position:50%;background-repeat:no-repeat;background-size:contain;width:105px;height:105px;margin-top:45px;animation:10s linear infinite rotate;display:inline-block}.home-page section[name=feature] .title{text-align:center;align-self:center;width:auto;font-size:48px;position:relative}.home-page section[name=feature] .title .star-icon{background-image:url(/images/star-green.png);background-position:50%;background-repeat:no-repeat;background-size:contain;width:52px;height:52px;display:inline-block;position:absolute;top:-20px;left:-60px}.home-page section[name=feature] .feature{width:380px;height:730px;display:inline-flex;position:relative}.home-page section[name=feature] .feature img{object-fit:contain;z-index:1;width:100%;height:100%}.home-page section[name=feature] .feature .feature-item{z-index:0;background-position:50%;background-repeat:no-repeat;background-size:contain;flex-direction:column;justify-content:center;align-items:center;display:inline-flex;position:absolute}.home-page section[name=feature] .feature .feature-item.one{background-image:url(/images/home-step-1.png);width:615px;height:507px;top:0;right:200px}.home-page section[name=feature] .feature .feature-item.two{background-image:url(/images/home-step-2.png);width:673px;height:560px;top:240px;left:240px}.home-page section[name=feature] .feature .feature-item.three{background-image:url(/images/home-step-3.png);width:500px;height:416px;padding-top:50px;bottom:-60px;right:240px}.home-page section[name=feature] .feature .feature-item .desc{text-align:center;font-family:FontTitle;font-size:28px}.home-page section[name=feature] .more{align-self:center;margin-top:45px;font-size:26px}.home-page section[name=feature] .arrow{background-image:url(/images/home-arrow.png);background-position:50%;background-repeat:no-repeat;background-size:contain;width:26px;height:90px;margin-top:10px;display:inline-block}section[name=blog] .title{align-self:center;width:auto}section[name=blog] .bubble{background-color:#fff;border-radius:90px;flex-direction:column;justify-content:flex-start;align-items:flex-start;width:100%;padding:90px;display:inline-flex;position:relative;box-shadow:0 0 2px #00000040}section[name=blog] .slider{flex-direction:column;justify-content:center;align-items:center;width:100%;height:auto;display:inline-flex;position:relative}section[name=blog] .slider .slides{white-space:nowrap;width:100%;height:auto;font-size:0;display:inline-block;overflow:hidden}section[name=blog] .slider .slide{vertical-align:top;white-space:normal;cursor:pointer;background-position:50%;background-repeat:no-repeat;background-size:cover;flex-direction:row;justify-content:flex-start;align-items:flex-start;width:100%;height:auto;display:inline-flex}section[name=blog] .slider .arrow{cursor:pointer;z-index:5;background-position:50%;background-repeat:no-repeat;background-size:auto 26px;width:30px;height:30px;transition:all .2s ease-in-out;display:inline-block;position:absolute;top:calc(50% - 15px)}section[name=blog] .slider .arrow.left{background-image:url(/images/slider-left.png);left:-45px}section[name=blog] .slider .arrow.right{background-image:url(/images/slider-right.png);right:-45px}section[name=blog] .blog-slide{cursor:pointer;flex-direction:row;justify-content:flex-start;align-items:flex-start;width:100%;display:inline-flex;position:relative}section[name=blog] .blog-slide .cover-bg{background-color:var(--theme-color-green);object-fit:cover;aspect-ratio:1.5;width:600px;height:auto;margin-top:20px}section[name=blog] .blog-slide .cover-bg .cover{object-fit:cover;width:100%;height:100%;transform:translate(-15px,-15px)}section[name=blog] .blog-slide .detail{flex-direction:column;flex:1;justify-content:flex-start;align-items:flex-start;width:auto;padding-right:30px;display:inline-flex}section[name=blog] .blog-slide a{text-decoration:none}section[name=blog] .blog-slide .name{color:#000;text-align:left;-webkit-line-clamp:2;text-overflow:ellipsis;-webkit-box-orient:vertical;font-family:FontTitle;font-size:24px;font-weight:600;display:-webkit-box;overflow:hidden}section[name=blog] .blog-slide .name:hover{text-decoration:underline}section[name=blog] .blog-slide .attr{color:#000;text-align:left;letter-spacing:1px;margin-top:15px;font-size:12px}section[name=blog] .blog-slide .desc{color:#000;text-align:left;-webkit-line-clamp:12;text-overflow:ellipsis;-webkit-box-orient:vertical;width:100%;margin-top:15px;font-size:16px;line-height:1.6em;display:-webkit-box;overflow:hidden}section[name=blog] .blog-slide a{width:100%;height:100%;display:inline-block;position:absolute;top:0;left:0}section[name=blog] .blog-categories{flex-direction:row;justify-content:flex-start;align-items:flex-start;width:100%;margin-top:90px;display:inline-flex}section[name=blog] .blog-category{flex-direction:column;justify-content:flex-start;align-items:center;width:31%;margin-right:3.5%;display:inline-flex;position:relative}section[name=blog] .blog-category:nth-child(3n){margin-right:0}section[name=blog] .blog-category .thumbnail{aspect-ratio:1.56;background-position:50%;background-repeat:no-repeat;background-size:cover;width:100%;box-shadow:0 0 2px #00000040}section[name=blog] .blog-category .name{text-align:center;margin-top:15px;font-family:FontTitle;font-size:25px;font-weight:500}section[name=blog] .blog-category .desc{text-align:left;-webkit-line-clamp:3;-webkit-box-orient:vertical;margin-top:10px;font-size:16px;display:-webkit-box;overflow:hidden}section[name=blog] .blog-category a{width:100%;height:100%;display:inline-block;position:absolute;top:0;left:0}section[name=blog] .more{cursor:pointer;align-self:flex-end;width:auto;margin-top:60px;font-family:FontTitle;font-size:25px;font-weight:500;text-decoration:underline}section[name=blog] .hot{color:#fff;background-image:url(/images/home-title-hot.png);background-position:50%;background-repeat:no-repeat;background-size:contain;flex-direction:column;justify-content:center;align-items:center;width:126px;height:126px;font-family:FontTitle;font-size:36px;display:inline-flex;position:absolute;top:-63px;left:120px;transform:rotate(-24deg)}section[name=press]{padding:15px 0}section[name=press] .title{align-self:center;width:auto;margin-bottom:45px;font-size:48px;position:relative}section[name=press] .title .star-icon{background-image:url(/images/star-green.png);background-position:50%;background-repeat:no-repeat;background-size:contain;width:52px;height:52px;display:inline-block;position:absolute;top:-20px;left:-60px}section[name=press] .list{flex-direction:row;justify-content:center;align-items:center;width:100%;display:inline-flex}section[name=press] .press-item{width:auto;height:65px;margin:0 30px 45px}section[name=press] .press-item img{width:auto;height:100%}section[name=signup] .title{align-self:center;width:auto;position:relative}section[name=signup] .title span{z-index:1;position:relative}section[name=signup] .title .circle{z-index:0;background-image:url(/images/home-title-ellipse-blue.png);background-position:50%;background-repeat:no-repeat;background-size:contain;width:148px;height:112px;display:inline-block;position:absolute;top:calc(50% - 57px);right:-48px}section[name=signup] .desc{text-align:center;font-size:26px}section[name=signup] .steps{flex-direction:row;justify-content:flex-start;align-items:flex-start;width:100%;max-width:480px;margin-top:30px;display:inline-flex}section[name=signup] .steps .step{flex-direction:column;justify-content:flex-start;align-items:center;width:52px;display:inline-flex}section[name=signup] .steps .step .number{color:#fff;text-align:center;background-image:url(/images/star-black.png);background-position:50%;background-repeat:no-repeat;background-size:contain;justify-content:center;align-items:center;width:52px;height:52px;font-family:FontTitle;font-size:18px;display:inline-flex}section[name=signup] .steps .step .name{text-align:center;width:400%;margin-top:3px;font-size:16px}section[name=signup] .steps .connector{background-color:#000;flex:1;width:auto;height:1px;margin:25px -2px 0;display:inline-flex}section[name=signup] .form{flex-direction:column;justify-content:flex-start;align-items:center;width:100%;max-width:640px;margin-top:30px;display:inline-flex}section[name=signup] .form input{text-align:left;background-color:#0000;border:none;border-bottom:1px solid #000;border-radius:0;width:100%;height:60px;margin-bottom:0;padding:0;font-size:16px}section[name=signup] .form input::placeholder{color:#5e5e5e;opacity:1}section[name=signup] .form input:-ms-placeholder-shown{color:#5e5e5e}section[name=signup] .form input::-moz-placeholder{color:#5e5e5e}section[name=signup] .form button{color:#fff;border-radius:34px;width:auto;height:68px;margin-top:45px;padding:0 1.2em;font-family:FontTitle;font-size:28px}section[name=signup] .login{text-align:center;align-self:center;margin-top:15px;font-size:16px}section[name=app] .title{align-self:center;width:auto;font-size:48px;position:relative}section[name=app] .title .star-icon{background-image:url(/images/star-green.png);background-position:50%;background-repeat:no-repeat;background-size:contain;width:52px;height:52px;display:inline-block;position:absolute;top:-20px;right:-60px}section[name=app] .desc{text-align:center;font-size:26px;line-height:1.6em}section[name=app] .feature-row{flex-direction:row;justify-content:center;align-items:flex-start;width:100%;margin-top:45px;display:inline-flex}section[name=app] .feature-item{flex-direction:column;justify-content:flex-start;align-items:center;width:250px;margin:0 30px;display:inline-flex}section[name=app] .feature-item .icon{object-fit:contain;width:45px;height:45px;display:inline-block}section[name=app] .feature-item .desc{text-align:center;height:3em;margin-top:10px;font-family:FontTitle;font-size:20px;line-height:1em}section[name=app] .feature-item .screen{width:180px;height:auto;margin-top:30px}section[name=app] .try-row{flex-direction:row;justify-content:center;align-items:flex-start;width:100%;margin-top:45px;display:inline-flex}section[name=app] .try-row .app-item{flex-direction:column;justify-content:flex-start;align-items:center;width:260px;padding-top:15px;display:inline-flex}section[name=app] .try-row .app-item .arrow{object-fit:contain;width:100%;height:26px}section[name=app] .try-row .app-item .button{object-fit:contain;width:100%;height:88px;margin-top:15px}section[name=app] .try-row .try-icon{color:#fff;text-align:center;background-image:url(/images/home-title-hot.png);background-position:50%;background-repeat:no-repeat;background-size:contain;flex-direction:column;justify-content:center;align-items:center;width:215px;height:215px;margin:0 30px;font-family:FontTitle;font-size:40px;display:inline-flex;transform:rotate(10deg)}@media only screen and (max-width:800px){section[name=tagline] .title{font-size:36px}section[name=tagline] .row{flex-direction:column;padding:0 20px}section[name=tagline] img{width:85%;height:auto}section[name=tagline] .desc{text-align:center;margin-top:30px;padding:0;font-size:16px}section[name=iceberg] .row{flex-direction:column}section[name=iceberg] .row .col{width:100%}section[name=iceberg] .row .col:first-child{padding:0 20px}section[name=iceberg] .row .col:first-child .title{width:100%;margin:10px 0;font-size:18px}section[name=iceberg] .row .col:last-child{padding-top:30px}section[name=iceberg] .iceberg{width:100%;transform:none}section[name=top] .star-icon{width:40px;height:40px}section[name=top] .title{font-size:32px}section[name=top] .arrow{width:20px;height:75px}section[name=top] .button{width:150px;height:55px;margin:0 5px}section[name=top] .desc{padding:0 15px;font-size:20px}section[name=top] .desc .circle{top:-30px;right:2%}section[name=feature]{display:none}section[name=feature] .title{font-size:36px}section[name=feature] .feature{width:140px;height:270px}section[name=blog] .container{padding:0 15px}section[name=blog] .title{font-size:36px}section[name=blog] .bubble{border-radius:30px;margin-top:45px;padding:45px 30px 30px}section[name=blog] .hot{top:-75px;left:25px}section[name=blog] .slider .slide{flex-direction:column-reverse}section[name=blog] .slider .arrow.left{left:-30px}section[name=blog] .slider .arrow.right{right:-30px}section[name=blog] .blog-slide .cover-bg{width:100%;margin-top:0;margin-bottom:15px}section[name=blog] .blog-slide .cover-bg .cover{transform:unset}section[name=blog] .blog-slide .desc{-webkit-line-clamp:4}section[name=blog] .blog-categories{flex-direction:column;margin-top:0}section[name=blog] .blog-category{width:100%;margin-bottom:20px;margin-right:0}section[name=blog] .more{align-self:center}section[name=press] .title{font-size:36px}section[name=press] .press-item{height:45px;margin:0 10px 20px}section[name=signup] .title{font-size:32px}section[name=signup] .desc{font-size:20px}section[name=signup] .steps{width:80%}section[name=signup] .steps .step .name{font-size:11px}section[name=signup] .form{padding:0 15px}section[name=app] .title{text-align:center;font-size:36px}section[name=app] .desc{font-size:20px}section[name=app] .feature-row{flex-direction:column;padding:0 15px}section[name=app] .feature-item{flex-flow:wrap;justify-content:center;width:100%;margin:0 0 15px}section[name=app] .feature-item .desc{text-align:left;margin-top:19px;margin-left:15px}section[name=app] .feature-item .screen{margin-top:5px}section[name=app] .try-row{padding:0 15px}section[name=app] .try-row .try-icon{margin:0 5px;font-size:20px}}
