@charset "utf-8";html, div, body, p, form, img, dd, h1, h2, h3, h4, input{margin:0 auto;padding:0;font-style:normal;font-family:"Segoe UI", "Arial", "Helvetica", "Verdana", "sans-serif";color:#444;line-height:160%;font-weight:normal;}
ul, li{margin:0;padding:0;list-style:none;}
img{border:none;}
.clear{clear:both;}
#banner h1{display: block;margin:0 auto 29px;font-size: 44px;font-weight: bold;color: #FFFFFF;line-height: 52px;text-align: center;}
#banner .container{position: relative;z-index: 2;}
h2{font-size: 34px;font-weight: bold;color: #222222;line-height: 36px;}
a, a:link, a:visited{text-decoration:none;color:#222;}
a:hover, a:active{text-decoration:underline;color:#222;}
.flex-box,.flex_box{display:-webkit-box;display: -webkit-flex;display: flex;-webkit-box-pack:justify;-webkit-justify-content: space-between;justify-content: space-between;flex-wrap: wrap;}
.container{max-width:1200px;overflow:hidden;box-sizing: border-box;}
.body_img{position: absolute;display: block;}
.body_img1{left: 0;top: 2005px;z-index: -1;}
.body_img2{right: 0;top: 1257px;z-index: -1;}
/* banner */
#banner{width: 100%;margin:0 auto;padding-top: 68px;padding-bottom: 84px;position: relative;background: #3D56C2;}
.banner_left{position: absolute;left: 0;top: 0;}
.banner_right{position: absolute;right: 39px;bottom: 0;}
.select_zoon{margin: 10px auto 0;text-align: center;font-size: 16px;line-height: 24px;color:#fff;}
.select_zoon a{color:#fff;text-decoration: underline;}
.select_zoon a:hover{color:#FAFF00}
/*search*/
#banner #searchcontainer{overflow: hidden;width: 100%;max-width: 710px;}
#banner #search-container{position: relative;}
#banner #search-container input#q{outline: 0;float: none;width: 100%;max-width: 710px;box-sizing: border-box;border-radius: 6px;background-color: #fff;text-indent: 60px;font-size: 14px;color:#666;}
#banner #search-container input#search_btn{position: absolute;background: url(/images/resource/search.svg) no-repeat center;left: 21px;top: 10px;width: 20px;height: 20px;outline: 0;border: 0;}
#banner #search-container input#search_btn:hover{background: url(/images/resource/search.svg) no-repeat center;}

/*topic*/
.topic{margin:20px auto 30px;overflow: visible;}
.topic .info{font-size: 16px;font-weight: 400;color: #333333;line-height: 24px;}
.topic h2{margin-bottom: 35px;}
.topic_left{margin: 0;width: 285px;background: #FFFFFF;box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, 0.25);border-radius: 10px;overflow: hidden;-webkit-align-self: start;align-self: start;}
.topic_left a,.topic_left span{display: block;margin:0;box-sizing: border-box;border-left: 4px solid transparent;width: 100%;height: 50px;font-size: 18px;font-weight: 600;color: #222222;line-height: 50px;text-indent: 31px;text-decoration: none;cursor: pointer;}
.topic_left a.active,.topic_left span.active{border-left: 4px solid #518BFF;background-color: rgba(238,243,255,1);}
.topic_right{width: 100%;max-width: 874px;display: none;margin: 0;}
.topic_right.active{display: block;}
.topic_top{margin:0 0 60px;-webkit-flex-wrap: nowrap;-webkit-align-items: center;flex-wrap: nowrap;align-items: center;}
.topic_top_left{margin: 0;display: block;width: initial;max-width: 100%;}
.topic_top_right{margin: 0;box-sizing: border-box;width: 100%;max-width: 424px;min-height:323px;border-radius: 0 10px 10px 0;border: 1px solid #D5D4D4;border-left: 0px solid #000;padding:69px 36px 0;background: #fff;}
.topic_top_right h3{margin:0 0 18px;font-size: 28px;font-weight: 600;color: #333333;line-height: 33px;text-decoration: none;}
.topic_top_right .info{text-decoration: none;}
.topic_top:hover,.topic_top:hover .topic_top_right h3{color:#4071FF;text-decoration: none;}
.topic_right ul{margin:30px auto 0;font-size: 0;text-align: center;}
.topic_right ul li{display: inline-block;margin:0 17px 0;font-size: 20px;font-weight: 400;color: #333333;line-height: 24px;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;user-select: none;}
.topic_right ul li.active,.topic_right ul li:hover{color:#4071FF}
.topic_right ul li.fit,.topic_right ul li.fit:hover{color:#a7a7a7;cursor: not-allowed;}
.bottom_item{margin: 0 0 20px;width: 100%;position:relative;overflow: hidden;width: 422px;padding:20px 27px 42px;background: #FFFFFF;border-radius: 10px;border: 1px solid #D5D4D4;box-sizing: border-box;}
.topic_bottom.hide{display: none;}
.bottom_item_bg{position: absolute;width: 100%;height: 4px;background: #518BFF;left: 0;top: 0;}
.bottom_item .title{display: block;margin:0 0 27px;font-size: 24px;font-weight: 600;color: #222222;line-height: 28px;padding-left: 0;}
.bottom_item .title::after{display: none;}
.bottom_item a{position: relative;display: block;margin:10px 0;width: 100%;padding-left: 16px;font-size: 16px;font-weight: 400;color: #333333;line-height: 24px;text-decoration: none;box-sizing: border-box;}
.bottom_item a::after{content: '';display: block;position: absolute;left: 0;top: 12px;width: 4px;height: 4px;border-radius: 100%;background: #333;}
.bottom_item a:hover{color:#4071FF}
.bottom_item a:hover::after{background: #4071FF;}
.bottom_item .more{color:#4071FF;font-weight: bold;margin: 17px 0 0;}
.bottom_item a.more::after{display: none;}

/**Hot Tutoriala**/
.hot-toturials{width: 100%;position: relative;padding:80px 0 30px;}
.hot-toturials h2{display:block;margin-bottom: 25px;font-size:34px;text-align: left;}
.hot-toturials ul{overflow: hidden;display: -webkit-flex;display: flex;-webkit-flex-direction: row;-webkit-justify-content: space-between;flex-direction: row;justify-content: space-between;-webkit-flex-wrap: wrap;flex-wrap: wrap;}
.hot-toturials ul>li{width:188px;display: inline-block;}
/* .hot-toturials ul>li:hover{box-shadow: 0 0 10px 0 rgba(0,0,0,.1);} */
.hot-toturials ul>li>a{display:block;width:177px;word-break: break-word;margin-top: 10px;font-size: 14px;line-height: 24px;text-decoration: none;color: #333;position: relative;}
.hot-toturials ul>li>a:hover p,.hot-toturials ul>li>a:hover,.hot-toturials ul>li:hover a{color:#4071FF;}
.hot-toturials ul>li>a>img{display:block;width:100%;}
.hot-toturials ul>li>a>img:nth-child(2){position: absolute;left: 5px;top: 5px;width: 13px;height: 8px;}


/**Hot Solution**/
.hot-solution{position:relative;width:100%;padding-top: 80px;padding-bottom: 70px;overflow: visible;}
.hot-solution .unslider{position:relative;margin:0 auto;max-width:1200px;width:100%;}
.hot-solution .unslider-arrow{top:38%;}
.hot-solution .slide-container{margin:0 auto;max-width:1200px;width:100%;}
.hot-solution .hot-solution-wrap{position: relative;margin:0 auto;}
.hot-solution .prev{display: inline-block;position: absolute;width: 71px;height: 71px;left:-11%;cursor: pointer;border-radius: 100%;box-shadow: 0px 4px 13px 1px rgba(0,0,0,0.2500);}
.hot-solution .prev::after{display:block;content:"";position: absolute;left: 50%;top: 50%;width: 28px;height: 28px;background: url(/images/resource/arrow-before.svg) no-repeat center;-webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-o-transform: translate(-50%,-50%);transform: translate(-50%,-50%);}
.hot-solution .prev:hover::after,.hot-solution .next:hover::after{background: url(/images/resource/arrow-before-h.svg) no-repeat center;}
.hot-solution .next{display: inline-block;position: absolute;width: 71px;height: 71px;right:-11%;cursor: pointer;border-radius: 100%;box-shadow: 0px 4px 13px 1px rgba(0,0,0,0.2500);}
.hot-solution .next::after{display:block;content:"";position: absolute;left: 50%;top: 50%;width: 28px;height: 28px;background: url(/images/resource/arrow-before.svg) no-repeat center;-webkit-transform: translate(-50%,-50%) rotateY(180deg);-moz-transform: translate(-50%,-50%) rotateY(180deg);-o-transform: translate(-50%,-50%) rotateY(180deg);transform: translate(-50%,-50%) rotateY(180deg);}
.hot-solution-wrap>li{position:relative;width: 100%;float:left;border-radius: 25px;overflow: hidden;}
.hot-solution-wrap>li.video-converter-ultimate{background: #C4F1FF;background: -webkit-linear-gradient(270deg, #C4F1FF 0%, #E9E3FF 100%);background: -moz-linear-gradient(270deg, #C4F1FF 0%, #E9E3FF 100%);background: -o-linear-gradient(270deg, #C4F1FF 0%, #E9E3FF 100%);background: linear-gradient(270deg, #C4F1FF 0%, #E9E3FF 100%);}
.hot-solution-wrap>li.fonelab{background: #C8E9FF;background: -webkit-linear-gradient(270deg, #C8E9FF 0%, #E4FDFF 100%);background: -moz-linear-gradient(270deg, #C8E9FF 0%, #E4FDFF 100%);background: -o-linear-gradient(270deg, #C8E9FF 0%, #E4FDFF 100%);background: linear-gradient(270deg, #C8E9FF 0%, #E4FDFF 100%);}
.hot-solution-wrap>li>div{margin:0 auto;box-sizing:border-box;width: 100%;max-width:1200px;min-height:360px;align-items: center;}
.hot-solution-wrap>li>div>img{position: absolute;left: -12px;top: -10px;}
.hot-solution-wrap>li>div>div{max-width:600px;}
.hot-solution-wrap>li>div>div>a{display: block;margin:0 auto;max-width: 360px;width: 100%;}
.hot-solution-wrap>li>div>div>a img{display: block;margin:0 auto;width: initial;max-width: 100%;}
.hot-solution-wrap .slide-container-right{}
.hot-solution-wrap .slide-container-right p:nth-child(1){font-size:30px;color:#222;}
.hot-solution-wrap .slide-container-right p:nth-child(1) a{text-decoration: none;font-weight: bold;}
.hot-solution-wrap .slide-container-right p:nth-child(1) a:hover{color:#4071FF;}
.hot-solution-wrap .slide-container-right p:nth-last-of-type(1){margin:20px 0 30px 0;min-height:50px;font-size:16px;color:#333;line-height: 24px;}
.buy-section{display: -webkit-flex;display:flex;margin:0;max-width:458px;-webkit-flex-direction: row;-webkit-justify-content: space-between;flex-direction: row;justify-content: space-between;flex-wrap: wrap;}
.buy-section >a{display: block;box-sizing:border-box;width: 223px;height: 52px;border-radius: 26px;background-color: #4071FF;color:#fff;text-align: center;line-height: 50px;font-size:20px;text-decoration: none;}
.buy-section >a img{display: inline-block;margin:0 16px 0 0;vertical-align: -4px;}
.buy-section >a:hover{background: #5681FF;}
.unslider-nav{margin:30px auto 0;font-size: 0;text-align: center;display: none;}
.unslider-nav li{display: inline-block;margin:0 10px;width: 15px;height: 15px;border-radius: 15px;background-color: #ccc;transition: all linear .3s;cursor: pointer;}
.unslider-nav li.unslider-active{width: 45px;background: #0282d9;}
.hot-solution.first h2{text-indent: 25px;margin-bottom: 15px;}
.hot-solution.first,.hot-solution.first .slide-container,.hot-solution.first .unslider{max-width: 1250px;}
.hot-solution-wrap>li.hot_one{box-sizing: border-box;padding:20px 15px;max-width: 1250px;}
.hot-solution ul li .hot_item{box-sizing: border-box;padding:16px 16px 30px;width: 100%;max-width: 285px!important;min-height: 280px;background: #FFFFFF;box-shadow: 0px 4px 16px 1px rgba(0, 0, 0, 0.25);border-radius: 10px;position: relative;}
.hot-solution ul li .hot_item .title{margin:20px 0 24px;font-size: 18px;line-height: 21px;font-weight: 600;display: block;}
.hot-solution ul li .hot_item .title:hover{text-decoration: none;color:#0282d9;}
.hot-solution ul li .hot_item .info{font-size: 14px;}
.hot-solution ul li .hot_item a{width: 100%;max-width: 254px;text-decoration: none;border-radius: 0;position: relative;}
.hot-solution ul li .hot_item>a:nth-child(2){width:initial;display: inline-block;position: absolute;top: 16px;right: 16px;font-size: 14px;line-height: 22px;color:#fff;background: rgba(25, 25, 25, .79);padding-left: 10px;padding-right: 10px;}
.hot-solution ul li .hot_item a.author{color:#0282d9;}
.hot-solution ul li .hot_item img{display: block;width: 100%;margin:0 auto;max-width: 254px;}
.hot-solution.first .prev{left: -9%;}
.hot-solution.first .next{right: -9%;}
.hot-solution.first .unslider-nav{margin:0 auto;}

.need{margin: 60px auto 47px;text-align: center;}
.need h2{text-align: center;margin-bottom: 55px;}
.need_item{margin:0 0 30px;box-sizing: border-box;width: 375px;min-height:328px;padding:38px 60px 40px;border-radius: 25px;cursor: pointer;text-decoration: none;}
.need_item:nth-child(1){background: rgba(151,176,255,.2);background: linear-gradient(180deg, rgba(151,176,255,.2) 0%, rgba(48,103,255,.2) 100%);background: linear-gradient(180deg, rgba(151,176,255,.2) 0%, rgba(48,103,255,.2) 100%);background: linear-gradient(180deg, rgba(151,176,255,.2) 0%, rgba(48,103,255,.2) 100%);background: linear-gradient(180deg, rgba(151,176,255,.2) 0%, rgba(48,103,255,.2) 100%);}
.need_item:nth-child(2){background: rgba(134,211,255,.2);background: -webkit-linear-gradient(180deg, rgba(134,211,255,.2) 0%, rgba(32,152,220,.2) 100%);background: -moz-linear-gradient(180deg, rgba(134,211,255,.2) 0%, rgba(32,152,220,.2) 100%);background: -o-linear-gradient(180deg, rgba(134,211,255,.2) 0%, rgba(32,152,220,.2) 100%);background: linear-gradient(180deg, rgba(134,211,255,.2) 0%, rgba(32,152,220,.2) 100%);}
.need_item .title{width: 100%;margin: 35px auto 15px;font-size: 20px;font-weight: 600;color: #333333;line-height: 23px;display: block;text-decoration: none;}
.need_item:hover .title{color:#0282d9;text-decoration: none;}
.need_item:hover .info,.need_item:hover{text-decoration: none;}
.need_item .info{width: 100%;margin: 0 auto;font-size: 16px;font-weight: 400;color: #333333;line-height: 24px;text-decoration: none;}
.item_n{display: block;margin: 0 0 30px;width: 375px;}
.item_n>img{display: block;margin: 0 auto;width: 100%;}
/* share */
#share-list{position:fixed;right:0;top:30%;overflow:hidden;}
#share-list li{width:40px;height:40px;-webkit-transition:0.5s;transition:0.5s;clear: both;display:-webkit-box;display: -webkit-flex;display: flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;cursor: pointer;}
#share-list li img{width: 35px;height: 35px;}
#share-list li.fb{background: rgb(59, 89, 152);}
#share-list li.tw{background:#000}
#share-list li.ln{background:rgb(0,115,177)}
#share-list li.gmail{background:rgb(206,73,59)}
#share-list li.gmail svg,#share-list li.reddit svg,#share-list li.whatsapp svg{width: 25px;height: 25px;}
#share-list li.whatsapp{background:#26cf44;}
#share-list li.reddit{background: rgb(255, 87, 0);}
#share-list li img{-webkit-transition: all .3s linear;transition: all .3s linear;margin-top: 0px;}
#share-list li:hover img{-webkit-transform: scale(1.2);transform: scale(1.2);}
@media screen and (max-width: 1500px){
    .hot-solution .next, .hot-solution .prev{display: none;}
}
    @media screen and (max-width: 1300px){
        .hot-toturials .next, .hot-toturials .prev{display: none;}
    .unslider-nav{display: block;}
    }
@media screen and (max-width: 1180px){
    .body_img{display: none;}
    .container{padding-left: 30px;padding-right: 30px;}
    #banner{padding-top: 48px;padding-bottom: 48px;}
    .banner_left,.banner_right{display: none;}
    .need .container >.flex_box{margin: 0 auto;max-width: 800px;-webkit-justify-content: center;justify-content: center;}
    .need_item,.item_n>img{margin:0 auto 30px;}
    .hot-solution.first h2{text-align: center;}
    .hot-solution{padding-bottom: 30px;}
    .hot-toturials{padding-top: 30px;padding-bottom: 0;}
    .hot-toturials h2{text-align: center;}
    .hot-solution.first h2{text-indent: 0;}
    .hot-toturials ul{max-width:580px;margin:0 auto;}
    .hot-solution.first,.hot-solution.first .slide-container,.hot-solution.first .unslider{max-width: 690px;}
    .hot-solution ul li .hot_item{margin:0 auto 20px;}
    .topic{margin: 10px auto 50px;}
    .topic h2{text-align: center;}
    .topic_left{width: 100%;max-width: 874px;margin:0 auto 20px;box-shadow: none;text-align: center;}
    .topic_left a, .topic_left span{display: inline-block;margin:0 10px 10px;width: initial;height:auto;line-height: 24px;text-align: center;text-indent: 0;border-left: 0;padding:5px 20px;border-radius: 24px;transition: all linear .2s;background: rgba(238,243,255,1);}
    .topic_left a.active, .topic_left span.active{border-left: 0;color:#fff;background: #518BFF;}
    .topic_top{margin: 0 auto 30px;}
    .topic_right ul{margin:10px auto 0;}
    .topic_right{margin:0 auto;}
}
@media screen and (max-width: 850px){
    .topic_top_right{padding:30px 20px 0;}
    .topic_bottom{-webkit-justify-content: center;justify-content: center;}
    .hot-solution .buy-section{margin:0 auto 30px;}
    .hot-solution-wrap .slide-container-right p:nth-last-of-type(1),.hot-solution-wrap .slide-container-right p:nth-child(1){text-align: center;margin:10px auto 20px;}
    #share-list{display: none;}
}
@media screen and (max-width: 780px){
    #banner h1{font-size: 36px;line-height: 48px;margin-bottom: 25px;}
    h2{font-size: 26px;line-height: 30px;}
    .need{margin:50px auto 27px}
    .need h2{margin-bottom: 30px;}
    .need .container >.flex_box{justify-content: center;}
    .need_item{width: 100%;max-width: 375px;padding:30px 30px 20px;}
    .item_n{width: 100%;max-width: 375px;}
    .hot-solution-wrap>li>div>div{max-width:460px;}
    .hot-solution-wrap .slide-container-right p:nth-last-of-type(1){margin: 14px auto 24px;text-align: center;}
    .hot-solution-wrap .slide-container-right p:nth-last-of-type(2){text-align: center;}
    .buy-section{margin: 0 auto 30px;overflow: hidden;}
}
@media screen and (max-width: 640px){
    .hot-solution-wrap>li>div>div{width: 98%;}
    .hot-solution-wrap .slide-container-right p:nth-child(1){font-size:26px;}
    .topic_top_right{padding:20px;box-sizing: border-box;min-height: auto;}
}
@media screen and (max-width: 540px){
    /* .hot-solution-wrap>li.fonelab,.hot-solution-wrap>li.video-converter-ultimate{background: none;} */
    .hot-solution-wrap>li>div>div{float:none;}
    .hot-solution-wrap>li>div>div>img{display: block;margin:0 auto;}
    .hot-solution-wrap .slide-container-right{padding:0;}
    .hot-solution-wrap .slide-container-left{padding:20px 0 0;}
    .hot-solution-wrap .slide-container-right p:nth-child(1) a{font-size: 26px;line-height: 30px;}
    .hot-solution-wrap .slide-container-right p:nth-last-of-type(1){width: 94%}
    .buy-section{margin:0 auto;width: 210px;height: 100px;}
    .topic_top{flex-direction: column;}
    .topic_top_right{padding-top: 30px;border: 1px solid #D5D4D4;border-top: 0px solid #000;border-radius: 0 0 10px 10px;}
    .hot-toturials ul{-webkit-justify-content: center;justify-content: center;}
    .hot-toturials ul>li{display: block;}
    .hot-solution .buy-section{justify-content: center;height:auto;margin:0 auto 20px;}
    .hot-solution .buy-section a{margin:0 auto 10px;}
}
@media screen and (max-width: 375px) {
    .hot-toturials .mobile{flex-direction: column;margin:0 auto;}
    .topic_right ul li{margin:0 5px;}
}