.onlymo{ display: none;}
.onlypc{ display: block;}
.zoom:after {content: ""; display: block; height: 0; clear: both; visibility: hidden;}
.ifs-banner{ width: 100%; height: 853px; background:url(../jpg/isf-banner.jpg) top center no-repeat; background-size: cover;}
.container-middle{ width: 1200px; margin-left: auto; margin-right: auto;}
.banner-text{ max-width: 500px; margin-top: 210px;}
.banner-text h1{ font-size: 60px; font-weight: bold; line-height: 1.5; color: #2A2A2A;}
.banner-text p{ font-size: 18px; line-height: 28px; color: #707070; margin-top: 26px; font-family: "Titillium Web",Arial,sans-serif;}
.product-isf .button.btn-freew { padding: 7px 42px; color: #2A2A2A; font-size: 20px; font-family: "Titillium Web",Arial,sans-serif; border-radius: 12px; background: #23FD47;}
.product-isf .button.btn-freew .downloadfreew-icon {margin-right: 12px;background: url(https://www.iobit.com/tpl/images/products/isfree/isf-dlicon.svg) no-repeat;background-size: 11px 14px;}
.banner-text .button.btn-freew{ margin-top: 46px;}
.banner-version{ margin-top: 20px;}
.banner-version span{ font-size: 14px; line-height: 1.5; color: #707070; opacity: 0.8; display: block; font-weight: 500; font-family: "Titillium Web",Arial,sans-serif;}
.banner-img{ width: 722px; height: 450px; background:url(../png/isf-banner-computer.png) top center no-repeat; background-size: cover; margin: 210px -60px 0 0; position: relative;}
.ifs-banner-icon{ position: absolute; z-index: 3; opacity: 0; transform: scale(0);}
.ifs-banner-ico1{ left: 0; top: 100px;}
.ifs-banner-ico2{ right: 30px; top: -45px;}
.ifs-banner-ico3{ left: 208px; top: 210px;}
.ifs-banner-ico1.on{opacity: 1; transform: scale(1); transition: all 1s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);}
.ifs-banner-ico2.on{opacity: 1; transform: scale(1); transition: all 1s 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);}
.ifs-banner-ico3.on{opacity: 1; transform: scale(1); transition: all 1s 0.9s cubic-bezier(0.645, 0.045, 0.355, 1);}
.advantage{ width: 100%; height: 2206px; background:url(../jpg/isf-conbg.jpg) top center no-repeat; background-size: cover; overflow: hidden;}
.advantage-cont{ position: relative;}
.advantage-cont2{ margin-top: 150px;}
.advantage-cont3{ margin-top: 100px;}
.advantage-cont4{ margin-top: 320px;}
.advantage-img,.advantage-text{ visibility: hidden; opacity: 0;}
.advantage-img1,.advantage-img3{ transform: translateX(-200px); transition: transform .8s, opacity .8s ease}
.advantage-text1,.advantage-text3{transform: translate(200px,-50%); transition: transform .8s, opacity .8s ease}
.advantage-img2,.advantage-img4{ transform: translateX(200px); transition: transform .8s, opacity .8s ease}
.advantage-text2,.advantage-text4{transform: translate(-200px,-50%); transition: transform .8s, opacity .8s ease}
.advantage-img.on{transform: translateX(0); visibility: visible; opacity: 1;}
.advantage-text.on{transform: translate(0,-50%); visibility: visible; opacity: 1;}
.advantage-img1 img{ margin-left: -200px;}
.advantage-img2 img{ margin-right: -100px;}
.advantage-img3 img{ margin-left: -25px;}
.advantage-img4 img{ margin-right: -110px;}
.advantage-text{ position: absolute; top: 50%; margin: auto; z-index: 5;}
.advantage-text h4{ font-size: 40px; line-height: 1.5; color: #363636; font-weight: bold; position: relative;}
.advantage-text h4:before{ width: 32px; height: 6px; border-radius: 4px; background: #1F6BD9; content: ""; display: block; position: relative;}
.advantage-text p{ font-size: 18px; line-height: 1.5; color: #777777; margin-top: 23px; font-family: "Titillium Web",Arial,sans-serif;}
.advantage-text1{ width: 600px; right: 0;}
.advantage-text2{ width: 530px; left: 0;}
.advantage-text3{ width: 480px; right: 0;}
.advantage-text4{ width: 480px; left: 0;}
.besttool{ margin-top: 150px; text-align: center;}
.titlebef{ font-size: 40px; line-height: 1.5; color: #363636; font-weight: bold; text-align: center; position: relative; display: inline-block; z-index: 2;}
.titlebef:before{ width: 66px; height: 75px; background:url(../png/isf-tibef.png) top center no-repeat; background-size: cover; content: ""; display: block; left: -37px; top: -30px; position: absolute; z-index: -1;}
.besttool-example{ margin-top: 150px; display: flex; justify-content:space-between; transform: translateY(300px); opacity: 0; visibility: hidden; transition: transform .8s, opacity .8s ease}
.besttool-example.on{ transform: translateY(0); opacity: 1; visibility: visible;}
.besttool-point{ width: 275px; margin-top: 20px;}
.besttool-point h5{ font-size: 22px; line-height: 1.5; color: #363636; margin-top: 12px; font-weight: bold;}
.besttool-point p{ font-size: 18px; line-height: 1.5; color: #777777; margin-top: 24px; font-weight: normal; text-align: left; font-family: "Titillium Web",sans-serif;}
.sysinfo{ width: 100%; background:url(../png/isf-do-befimg.png) #fff top center no-repeat; text-align: center; overflow: hidden; margin-top: 50px;}
.sysinfo-cont{ margin-top: 270px;} 
.sysinfo-example{ width: 100%; height: 597px; margin-top: 142px; background:url(../png/isf-do-cicrle.png) top center no-repeat; position: relative; padding-bottom: 100px;}
.sysinfo-point{ position: absolute; z-index: 3; box-shadow: 3px 2px 10px rgba(153,153,153,0.1); padding: 35px 30px 20px; background: #fff; text-align: left; opacity: 0; transform: scale(0);}
.sysinfo-point1{ width: 263px; border-radius: 35px 35px 0 35px; left: 0; top: 50px;}
.sysinfo-point2{ width: 495px; border-radius: 35px 35px 35px 0; right:55px; top: -30px;}
.sysinfo-point3 { width: 400px; border-radius: 0 35px 35px 35px; right: 0; top: 400px;}
.sysinfo-point1.on{opacity: 1; transform: scale(1); transition: all 1s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);}
.sysinfo-point2.on{opacity: 1; transform: scale(1); transition: all 1s cubic-bezier(0.645, 0.045, 0.355, 1);}
.sysinfo-point3.on{opacity: 1; transform: scale(1); transition: all 1s 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);}
.sysinfo-point>img{position: absolute; top: -25px;}
.sysinfo-point h5{ font-size: 22px; font-weight: bold; line-height: 30px; color: #363636;}
.sysinfo-point p{ font-size: 18px; line-height: 1.5; color: #808080; margin-top: 15px; font-family: "Titillium Web",sans-serif;}
.product-isf .btmarea {width: 100%;margin-top: 116px;height: 388px;text-align: center;background: url(../jpg/isf-base.jpg) #1565d8 center top no-repeat;overflow: hidden;}
.product-isf .btmarea h6 {margin-top: 62px;color: #fff;font-size: 22px;line-height: 32px}
.product-isf .btmarea h6 .btmarea-icon {display: inline-block;margin-right: 8px;width: 25px;height: 25px;text-indent: -9999px;vertical-align: middle;background: url(../png/isf-icon-small.png) left top no-repeat;background-size: 25px;margin-top: -4px;}
.product-isf .btmarea h2 {padding: 0 50px;margin-top: 15px;color: #fff;font-size: 35px;font-weight: 400;line-height: 50px;}
.product-isf .btmarea .downloadinfo .button {min-width: 253px;padding: 6px 42px;margin: 50px auto 0;}
.product-isf .btmarea .downloadinfo .button .downloadfreew-span{font-size: 26px;}
.product-isf .btmarea .downloadinfo .button .downloadfreew-icon{width: 16px;height: 20px;background-size: 16px 20px;}
.product-isf .btmarea .downloadinfo dd {margin-top: 20px;}
.product-isf .btmarea .downloadinfo dd span{color: #fff;font-size: 12px;line-height: 18px;display: block;opacity: 0.8;font-weight: 100;font-family: "Titillium Web",sans-serif;}
.product-isf .floatlayer .downloadpro dt{ float: left; margin-top: 12px;}
.product-isf .floatlayer .downloadpro dd{ float: left; margin-top: 10px;}
.product-isf .floatlayer .downloadpro dd h5 {font-size: 16px;font-weight: 600;line-height: 20px;color: #191920;}
.product-isf .floatlayer .downloadpro dd p {color: #777777;font-size: 12px;line-height: 20px;font-family: "Titillium Web",sans-serif;}
.product-isf .floatlayer .floatlayer-icon {display: inline-block;margin-right: 15px;width: 34px;height: 34px;text-indent: -9999px;vertical-align: middle;background: url(../png/isf-icon-big.png) no-repeat;background-size: 34px}
.product-isf .floatlayer .downloadinfo .button.btn-freew {margin: 14px 6px 0;float: none;padding: 1px 10px;min-width: 180px;background: #23FD47;border-radius: 36px;height: 36px;line-height: 32px;font-weight: 500;}
.product-isf .floatlayer .downloadinfo .button.btn-freew .downloadfreew-span{font-size: 16px; color: #191920; line-height: 36px; font-family: "Titillium Web",Arial,sans-serif;}
.product-isf .floatlayer .downloadinfo .button.btn-freew .downloadfreew-icon{ margin-right: 6px;}
.product-isf .floatlayer .downloadinfo .button.btn-freew.buynow:hover {color: #fff;background: #86839d;border: 2px solid #86839d}

@media screen and (max-width:1620px) {
.banner-img{ width: 600px; height: 374px; margin-right: 50px;}
.ifs-banner-ico3{ width: 464px;}
.easyad,.advantage{ overflow: hidden;}
}
@media screen and (max-width:1620px) {
.banner-img{ width: 500px; height: 312px;}
.ifs-banner-ico1{ width: 180px; top: 69px;}
.ifs-banner-ico2{ width: 171px;}
.ifs-banner-ico3{ width: 387px; left: 143px;}
}
@media screen and (max-width:1220px) {
.container-middle{ width: 92%;}
.advantage-text1{ width: 520px;}
.advantage-text2{ width: 490px;}
}
@media screen and (max-width:1190px) {
.container-middle{ width: 100%;}
.onlymo{ display: block;}
.onlypc{ display: none;}
.ifs-banner{ height: auto; padding-bottom: 80px;}
.bannermoimg{ max-width: 648px; width: 86.4%; margin: 20px auto 0;} 
.banner-text{ float: none; text-align: center; width: 100%; max-width: 100%; margin-top: 100px;}
.banner-text h1{ font-size: 50px;}
.banner-text p{ margin-top: 8px;}
.button.btn-freew .downloadfreew-icon,.button.btn-freew .downloadfreew-span{ display: inline-block;}
.advantage{ height: auto; background: none;}
.advantage-cont{ margin-top: 80px;}
.advantage-cont .advantage-img{ transform: translate(0); text-align: center; float: none;}
.advantage-cont .advantage-img img{ margin: 20px auto 0; max-width: 897px; width: 60%;}
.advantage-cont .advantage-text{ position: relative; width: 86.7%; margin: 0 auto 0; right: auto; left: auto; top: auto; transform: translate(0);}
.advantage-cont .advantage-text p{ color: #2A2A2A;}
.advantage-text1 p,.advantage-text2 p{ margin-top: -30px;}
.advanmot{line-height: 1.5; color: #363636; font-weight: bold; position: relative; font-size: 28px; width: 86.7%; margin: 0 auto; position: relative;}
.advanmot:before{width: 32px; height: 6px; border-radius: 4px; background: #1F6BD9; content: ""; display: block; position: relative;}
.advantage-cont .advantage-img, .advantage-cont .advantage-text,.besttool-example{ opacity: 1; visibility: visible;}
.besttool{ margin-top: 50px; width: 92%;}
.besttool-example{transform: translateY(0); transition: none; margin-top: 50px;}
.besttool-point{ width: 28%;}
.titlebef{ font-size: 28px;}
.sysinfo{ height: auto; padding-bottom: 60px; background: linear-gradient(to bottom,#f5f9ff,#fff); overflow: hidden;}
.sysinfo-cont{ margin-top: 50px;}
.sysinfo-example{ height: auto; background: none; margin-top: 20px; padding-bottom: 0;}
.sysinfo-point{ position: relative; opacity: 1; left: auto; top: auto; right: auto; width: calc(100% - 60px); margin-top: 50px; transform: scale(1);}
.product-isf .btmarea{ width: 100%; height: auto; padding-bottom: 60px; margin-top: 20px;}
.product-isf .btmarea .container{ width: 100%; min-width: 100%;}
.product-isf .floatlayer { display: none;}
}
@media screen and (max-width:767px) {
.product-isf .button.btn-freew,.product-isf .btmarea .downloadinfo .button{ width: calc(80% - 80px); padding: 18px 10px; height: auto; line-height: 1; border-radius: 36px; margin-top: 30px;} 
.ifs-banner{ padding-bottom: 70px; height: auto; background: url(../jpg/isf-banner-mo.jpg) top center no-repeat; background-size: cover;}
.banner-text h1{ font-size: 40px;}
.banner-text p{ max-width: 525px; width: 90%; margin-left: auto; margin-right: auto;}
.advantage-cont{ margin-top: 50px;}
.easyad .advantage-cont{ margin-top: 20px;}
.advantage-cont .advantage-img img{ width: 100%;}
.advantage-text h4{ font-size: 28px;}
.titlebef:before{ left: 5px;}

.besttool{ width: 100%; background: url(../png/besttool-mobg.png) top center no-repeat; background-size: 100% auto; overflow: hidden; position: relative; padding-bottom: 60px;}
.besttool:after{ width: 100%; height: 30vh; background: url(../png/besttool-mobg2.png) bottom center no-repeat; background-size: 100% auto; position: absolute; bottom: 0; left: 0; display: block; content: ""; z-index: -1;}
.besttool .titlebef{margin-top: 100px;}
.besttool-example{width: 78%; margin-left: auto; margin-right: auto; display: block;}
.besttool-point{ width: 100%; text-align: left; margin-top: 40px;}
.besttool-point img{ display: inline-block; vertical-align: middle; margin-right: 10px; width: 50px; height: 50px;}
.besttool-point h5{ display: inline-block; vertical-align: middle; margin-top: 0;}
.titlebef{ font-size: 28px; width: 92%; margin-left: auto; margin-right: auto;}
.titlebef:before{ width: 50px; height: 57px; top: -20px;}
.product-isf .btmarea h2{ font-size: 28px; line-height: 1.5; padding: 0;}
.sysinfo{ background: none; margin-top: 0;}
.sysinfo-example{ margin-top: 80px;}
.sysinfo-point>img{ left: 0; right: 0; margin: auto;}
.sysinfo-point{ max-width: 494px; width: calc(74% - 60px); margin-left: auto; margin-right: auto; box-shadow: 0 0 10px rgb(153 153 153 / 10%);}
.product-isf .btmarea{background: url(../jpg/isf-base-mo.jpg) #1565d8 center top no-repeat;}
}

@media screen and (max-width:375px) {
.besttool-example{ width: 86%;}
.besttool-point h5{ font-size: 20px;}
}

@media screen and (max-width:325px) {
.besttool-point h5{ font-size: 18px;}
}