html, div, body, p, form, img, dd, h1, h2, h3, h4, input { margin:0 auto; padding:0; font:12px/1.8 'Meiryo',"MS PGothic", Verdana, Arial, Helvetica, sans-serif; color:#222222; }
body{font-size:62.5%;}
p{line-height:20px;}
dl, dd, dt{margin:0;padding:0;}
ul{margin:0;padding:0;list-style:none;}
li{margin:0;list-style:none;padding:0;}
img{border:none;}
a, a:link, a:visited{text-decoration:none;}
a:hover, a:active{text-decoration:underline;color:#222;}
input{font-size:1.2em;float:left;}
table{border-collapse:collapse;}
dl, dt, dd{text-align:left;}
.container{max-width:1000px;overflow:hidden;padding-top: 25px;text-align: center;}
.botlink a:link, .botlink a:visited, #footer .container p a, #footer .container p{font-size:14px;color:#ccc8c8;}
/*top menu*/
#header{width:100%;height:72px;position:relative;}
#header .container{padding-top: 0;}
#logo{width:20%;float:left;margin-top:18px;}
.menu{z-index:90;float:right;margin-top:25px;}
.menu li{float:left;display:block;text-align:center;padding:3px 15px 0 10px;font-size:16px;z-index:1;color:#222;font-family:Meiryo,Arial, Helvetica, sans-serif;height:44px;line-height:20px;}
.menu li a:hover{color:#21b3e4;text-decoration:none;}
.menu li.store:hover, .menu li.sale:hover {background:none;}
.menu ul li .submenu {left:0px;overflow:hidden;position:absolute;top:72px;z-index:100;font-size:15px;display:none;background:rgba(255, 255, 255, 0.95);padding:1% 0 1.5% 0;margin-right:0;border-top:#d3d3d3 1px solid;border-bottom:#d3d3d3 2px solid;width:100%;}
.menu ul li:hover .submenu{display:block;}
.menu ul li .submenu ul{width:50%;float:left;}
.menu ul li .submenu ul li{width:45%;float:left;text-align:left;font:normal 12px/40px Meiryo,arial, sans-serif !important;color:#999;margin:0;height:auto;padding:0;    border-top:1px rgba(255, 255, 255, 0) solid;}
.menu ul li .submenu ul li:nth-child(2n){margin-right:5%;}
.menu ul li .submenu ul .version{width:90%;}
.menu ul li .submenu li span {color:#21b3e4;font-size:20px;line-height:30px;background:url(/new-style/images/index/win.png) no-repeat 0 0;padding-left:31px;}
.menu ul li .submenu li.mac span{background:url(/new-style/images/index/mac.png) no-repeat 0 0;}
.menu ul li .submenu .first{border-top:1px #d3d3d3 solid;box-sizing:border-box;}
.menu ul li .submenu li a.more {color:#21b3e4;font-size:14px;text-decoration:none;}
.menu ul li .submenu li img{vertical-align:top;max-width:28px;}
.menu ul li .submenu li a{line-height:160%;font-size:15px;color:#666;display:inline-block;padding:0;}
.menu ul li .submenu li a:hover{color:#21b3e4;text-decoration:none;}
.menu ul li:hover ul.submenu{display:block;}
#lookfor{float:right;margin-top:3px;}
.toggle-nav{display:none;}
#search-box{float:right;margin-top:0;}
#search{margin:0;}
#lookfor{float:right;margin-top:3px;}
.toggle-nav{display:none;}
.bot_title{color:#fff;font-size:24px;margin-bottom:20px;}
/*banner*/
#banner{background:url(/new-style/images/index/banner.png) no-repeat 50% 0;height:392px;}
#banner a{display:block;width:100%;float:left;height:392px;}
/*main product*/
.main{width:100%; max-width:1000px; margin:25px auto; overflow:hidden; }
.pro{width:50%; margin:15px auto; overflow:hidden; float:left; }
.pro .img{float:left; width:15%; }
.pro .pro-info{float:right; width:66%; margin-right:2%;}
.pro-info h3{font-size:24px; }
.pro-info p{font-size:14px; line-height:25px; margin:15px auto; }
.pro-info p a.down{background:url(/new-style/images/index/btn.jpg) no-repeat; width:87px; height:22px; display:block; margin-right:10px; float:left;}
.pro-info p a.down:hover{background-position:0 -22px;}
.pro-info p a.buy{background:url(/new-style/images/index/btn.jpg) no-repeat 0 -44px; width:87px; height:22px; display:block; margin-right:5px; float:left; }
.pro-info p a.buy:hover{background-position:0 -66px;}
/*hot product*/
.hot-pro{background:#f4f4f4; width:100%; }
.hot-pro .container {overflow: hidden;padding:0 10px 40px; }
.hot-pro .container h2{font-size:36px; margin:20px auto 15px; text-align:center;}
.hot-pro-1,.hot-pro-2,.hot-pro-3{width:30.6%; margin:0 10px; overflow:hidden; float:left; }
.hot-pro-top{background:#feca26; height:22px; border:1px solid #feca26; border-bottom: none; border-radius: 5px 5px 0 0;}
.hot-pro-info{background:#FFF; border:1px solid #e4e4e4; border-top:none; border-radius: 0 0 5px 5px; overflow:hidden; padding-bottom:15px;  }
.hot-pro-2 .hot-pro-top{background:#01b286; height:22px; border:1px solid #01b286; border-bottom: none; border-radius: 5px 5px 0 0;}
.hot-pro-3 .hot-pro-top{background:#4289b3; height:22px; border:1px solid #4289b3; border-bottom: none; border-radius: 5px 5px 0 0;}
.hot-pro .hot-pro-info ul li img{padding-left:3%; }
.hot-pro .hot-pro-info ul li.title{font-size:20px; text-align:center; padding:25px 0 10px;}
.hot-pro .hot-pro-info p{font-size:14px; padding:10px 10%; line-height:25px; }
.hot-pro .hot-pro-info p a.down{background:url(/new-style/images/index/btn.jpg) no-repeat 0 -88px; width:118px; height:39px; display:block; float:left; margin-right:6px;}
.hot-pro .hot-pro-info p a.down:hover{background-position:0 -127px;}
.hot-pro .hot-pro-info p a.buy{background:url(/new-style/images/index/btn.jpg) no-repeat 0 -166px; width:118px; height:39px; display:block; float:left; }
.hot-pro .hot-pro-info p a.buy:hover{background-position:0 -205px;}
/*reviews*/
.btm{max-width:1000px;overflow:hidden;margin:0 auto 20px;}
.btm h2{font-size:36px; margin:20px auto 15px; text-align:center;}
.btm ul{overflow:hidden;}
.btm ul li{width:20%;float:left;border-bottom:5px solid #12aff2;padding:2.5%;font-size:14px;color:#21262a;}
.btm ul li.blue{background:#f5f9fd;border-bottom:5px solid #1f82c8;}
.btm ul li dl dd.date{color:#8f8f8f;font-size:12px;}
.btm ul li dl dt{text-align:center;padding-bottom:15px;}
.btm ul li dl dd{line-height:2;}
/*hot topics*/
.botlink{width:100%; margin-bottom:20px;}
.botlink .container{padding:20px 10px 0;overflow:hidden;}
.botlink .box{width:30%;float:left;margin-right:3%;_margin-right:3%;}
.botlink .box .popular-pro{overflow:hidden; margin:0 auto 15px;}
.botlink .box .popular-pro img{float:left; margin: 10px 15px 0 0; }
.botlink .box .popular-pro h4{font-size: 18px; padding: 5px 0 5px; font-weight:normal;}
.botlink .box .popular-pro p{font-size:1.2em; width:70%; padding-left:60px;}
.botlink .box1, .botlink .box2{width:32%;float:left;}
.botlink .box1 ul, .botlink .box2 ul{background-color:#f8f8f8; padding:15px 15px; border:1px solid #ececec;}
.botlink .box2 span{color:#686e7a;display:block;font-size:14px;padding-top: 7px;}
.botlink ul li{line-height:16px;margin:11px 0;font-size:1.2em;}
.botlink .box1 ul li a, .botlink .box2 ui li a{font-size:14px;line-height:25px;}
.botlink .box2{padding-left:10px;}
 .botlink .box2 ul li{margin:15px 0;}
.botlink h3{font-size:1.8em;margin:10px auto;}
/*footer*/
#footer{background:#333333;}
.footer{display:flex;display:-webkit-flex;justify-content:space-between;max-width:1200px;margin:0 auto;}
.footer a.icon{display:block;flex:1;margin:40px auto 20px;}
.footer dl{flex:1;}
.footer dl dt{color:#fff;}
.footer dl dd a{color:#d1cdcd;}
.footer dl dt{margin:40px auto 20px;font-size:17px;}
.footer dl dd{line-height:24px;font-size:13px;}
#footer .footer-line{margin:20px auto 0;padding:10px 0;background-color:#282828;overflow:hidden;}
.footer-line div{max-width:860px;margin:0 auto;}
.footer-line p{color:#7f7f7f;text-align:center;float:left;}
.footer-line p a{color:#fff;font-size:12px;}
.footer-line div p:nth-child(2){ float: right;font-size:12px;}
a#subscribe{background:url(/new-style/images/index/subscribe.png) no-repeat;width:264px;height:28px;display:block;color:#fff;font-size:14px;padding:10px 0 0 25px;margin-bottom:15px;}
a#subscribe:hover{text-decoration:none;background:url(/new-style/images/index/subscribe.png) no-repeat 0 -38px;}
/*aside recommand*/
#aside_recommand{display:block;position:fixed;right:10px;top:50%;width: 270px;height: 300px;}
#aside_recommand>img{display: block;}
#aside_recommand .off_animate{display: block;position: absolute;left: 34px;top: 140px;animation: off_animate 2s ease-in-out 0s infinite;}
#aside_recommand .aisde_close{position: absolute;width: 12px;height: 12px;right: 10px;top: 10px;}
#aside_recommand .aisde_close span{display: block;position: absolute;width: 14px;height: 2px;background-color: #444;-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg)}
#aside_recommand .aisde_close span:nth-child(2){-moz-transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg)}
#aside_recommand .aisde_close:hover span{background-color: #fb541f;}
@keyframes off_animate {0%{transform: scale(1)}50%{transform: scale(1.1)}100%{transform: scale(1)}}
@media screen and (max-width: 1500px){
#aside_recommand{display: none;}
}

@media (max-width: 1118px){
.menu ul li#support{display:none;}
#banner{background:url(/new-style/images/index/banner.png) no-repeat 50% 0;height:392px;}
.pro{width:49.9%; }
.pro img{width:30.7%; }
.hot-pro-1,.hot-pro-2,.hot-pro-3{ width:30.6%; margin-bottom:15px;}
.hot-pro .hot-pro-info ul li img{width:90%;}
#footer .container{width:auto; overflow:hidden;}
#footer .container ul.why-choose li{width:auto;}
}
@media (max-width: 1018px){
#banner{background:url(/new-style/images/index/banner-1200.jpg) no-repeat 50% 0;height:392px;}
#banner a{height:392px;}
}
@media screen and (max-width:956px) {
.menu li{display:none;}
.menu #menu li:first-child{display:inline-block;}
.menu #menu li:first-child a{border:1px solid #000;border-radius:25px;padding:3px 10px;}
.menu #menu li:first-child a:hover{border-color:#21b3e4;}
}
@media screen and (max-width: 798px){
#banner{background:url(/new-style/images/index/banner-1200.jpg) no-repeat 50% 0;height:392px;}
#banner a{height:392px;}
.pro{width:50%; }
.pro-info h3{font-size:20px; }
.pro img{width:30.7%; }
.hot-pro-1,.hot-pro-2,.hot-pro-3{ width:45%; margin-bottom:15px;}
.hot-pro .hot-pro-info ul li img{width:90%;}
.btm ul li{width:45%;height:263px;}
.botlink .box, .botlink .box1, .botlink .box2{width:45%; }
.botlink .box2{width:100%; margin-left:-10px; margin-right:10px; }
.botlink .box .popular-pro p{font-size:1.1em; width:70%; padding-left:60px;}
.botlink h3{font-size:2.4em;margin:10px auto;}
#footer .container{width:auto; overflow:hidden;}
#footer .container ul.why-choose li{width:50%;}
#footer .container p{color:#fff;text-align:center; line-height:30px;}
}
@media screen and (max-width: 679px){
#banner{background:url(/new-style/images/index/banner-650.jpg) no-repeat 50% 0;height:255px;}
#banner a{height:255px;}
}
@media screen and (max-width: 480px){
#banner{background:url(/new-style/images/index/banner-480.jpg) no-repeat 50% 0;height:188px;}
#banner a{height:188px;}
.pro{width:auto; }
.pro img{width:30.7%; }
.hot-pro-1,.hot-pro-2,.hot-pro-3{width:90%; margin-bottom:15px;}
.hot-pro .hot-pro-info ul li img{width:90%;}
.btm ul li{width:100%;height:auto;padding:20px 0 20px 5px;}
.botlink .box, .botlink .box1, .botlink .box2{width:100%; }
.botlink h3{font-size:2.1em;margin:10px auto;}
.btm h2{font-size:21px;}
#footer .container{width:auto; overflow:hidden;}
#footer .container ul.why-choose li{width:60%;}
#footer .container p{color:#fff;text-align:center; line-height:30px;}

}