﻿.MainBan {  background:url(../index-image/banner-sixteen.jpg) center;}
.MainBan .details { width:1060px; margin:0 auto; padding:0; height:352px;}
.MainBan .details h1 { color:#83d442; text-align:center; font-size:36px; line-height:42px; padding:30px 0 30px;}
.MainBan .details p { font-size:15px; color:#FFF; padding:15px 25px 0; line-height:30px;}

/*****************************/
.MainTab { background:#f5f5fa;}
.MainTab .details { padding:20px 0; width:1060px;}
.MainTab .details .ck { height:35px; background:url(../index-image/ss-icon.png) left bottom no-repeat, url(../index-image/ss.png) right bottom no-repeat; width:350px; float:right; margin-left:10px; padding:10px 0 0;}
.MainTab .details h2 { font-size:21px; color:#979797; padding:20px 0; margin-left:10px;}
.MainTab .details .buttin { width:123px; float:left; height:54px; padding-left:40px; line-height:52px; cursor:pointer; transition:all 0.4s; -webkit-transition:all 0.4s; -moz-transition:all 0.4s; }
.MainTab .details .ripdvd { background:url(../index-image/icon2-select.png) 10px 15px no-repeat #83d442; color:#FFF; }
.MainTab .details .ripdvd:hover { }
.MainTab .details .convideo { background:url(../index-image/icon2.png)10px 15px no-repeat #fff; color:#818181; margin-left:15px; }
.MainTab .details .convideo:hover {  background:url(../index-image/icon2-select.png)10px 15px no-repeat #83d442; color:#fff;} 
.MainTab .details .download { background:url(../index-image/icon3.png)10px 15px no-repeat #fff; color:#818181; margin-left:15px; }
.MainTab .details .download:hover { background:url(../index-image/icon3-select.png)10px 15px no-repeat #83d442; color:#fff;}
.MainTab .details .paly { background:url(../index-image/icon4.png)10px 15px no-repeat #fff; color:#818181; margin-left:15px; }
.MainTab .details .paly:hover { background:url(../index-image/icon4-select.png)10px 15px no-repeat #83d442; color:#fff;}
.MainTab .details .hot { background:url(../index-image/icon5.png)10px 15px no-repeat #fff; color:#818181; margin-left:15px; }
.MainTab .details .hot:hover { background:url(../index-image/icon5-select.png)10px 15px no-repeat #83d442; color:#fff;}
.MainTab .details .tips { background:url(../index-image/icon6.png)10px 15px no-repeat #fff; color:#818181; margin-left:15px;}
.MainTab .details .tips:hover { background:url(../index-image/icon6-select.png)10px 15px no-repeat #83d442; color:#fff;}
/*****************************/
.banner{background-color:#f5f5fa; text-align:center;}
.banner .details{width:auto; display:inline-block; background:url(../index-image/banner_bg2.png) no-repeat center; background-size:100% 100%; padding:0;}
.banner a{display:block; text-decoration:none; padding:0 30px 0 25px;}
.banner .mt_pic, .banner .text{display:table-cell; vertical-align:middle;}
.banner .mt_pic{padding:3px 20px 3px 25px;}
.banner .text{font-size:17px; color:#fff; padding-top:3px;}
.banner .text strong{color:#fff;}
.banner .text img.hot{vertical-align:-1px;}

.banner_bf{background-color:#f5f5fa; text-align:center; position:relative; height:40px;}
.banner_bf .details{width:1062px; height:85px; background:url(../index-image/banner-bg.png) no-repeat center; padding:0; position:absolute; left:50%; top:-45px; margin-left:-531px;}
.banner_bf a{text-decoration:none; font-size:17px; color:#fff; display:block; line-height:35px; height:40px; margin-top:45px; padding-left:23px;}
/*****************************/
.MainPopular {}
.MainPopular .details { width:1060px; margin:0 auto; padding:15px 0;}
.MainPopular .details h3 { font-size:23px; text-align:center; padding:10px 0 20px; color:#70c32e; font-weight:bold;}
.MainPopular .details .popbg { width:1060px; height:170px; background:url(../index-image/ppbg-sixteen.jpg) no-repeat;}
.MainPopular .details ul { list-style:none; color:#595959; font-size:15px; padding:20px 0 0 60px;}
.MainPopular .details ul li { display:block; width:450px; float:left; padding:5px 0 5px 25px;}
.MainPopular .details ul li a { color:#595957; text-decoration:none;}
.MainPopular .details ul li a:hover { color:#F60; text-decoration:underline;}
.MainPopular .details ul li:nth-child(1) { background:url(../index-image/1-sixteen.png) 0 8px no-repeat;}
.MainPopular .details ul li:nth-child(2) { background:url(../index-image/2-sixteen.png) 0 8px no-repeat;}
.MainPopular .details ul li:nth-child(3) { background:url(../index-image/3-sixteen.png) 0 8px no-repeat;}
.MainPopular .details ul li:nth-child(4) { background:url(../index-image/4-sixteen.png) 0 8px no-repeat;}
.MainPopular .details ul li:nth-child(5) { background:url(../index-image/5-sixteen.png) 0 8px no-repeat;}
.MainPopular .details ul li:nth-child(6) { background:url(../index-image/6-sixteen.png) 0 8px no-repeat;}
.MainPopular .details ul li:nth-child(7) { background:url(../index-image/7-sixteen.png) 0 8px no-repeat;}
.MainPopular .details ul li:nth-child(8) { background:url(../index-image/8-sixteen.png) 0 8px no-repeat;}
/*****************************/
.MainLatest {}
.MainLatest .details { width:1060px; margin:0 auto; padding:20px 0;}
.MainLatest .details h3 { font-size:23px; color:#70c32e; padding-bottom:20px; font-weight:bold;}
.MainLatest .details h3 span { display:block; width:50px; height:2px; background:#70c32e;  }
.MainLatest .details .left { width:780px; float:left;}
.MainLatest .details .left .adv { margin-bottom:20px;}
.MainLatest .details .left .adv .box { width:240px; float:left;}
.MainLatest .details .left .adv .txt { width:540px; float:left; height:162px; }
.MainLatest .details .left .adv .txt h4 { font-size:15px; font-weight:800; padding:5px 0 0 15px; }
.MainLatest .details .left .adv .txt p { padding:5px 10px 0 15px;}
.MainLatest .details .left .adv .txt ul { list-style:none; padding:10px 0 0 15px; color:#b3b3b3;}
.MainLatest .details .left .adv .txt ul li { float:left; padding:0 0 0 20px;}
.MainLatest .details .left .adv .txt ul li:nth-child(1) { background:url(../index-image/icon-writer.png) 0 3px no-repeat; width:120px;  }
.MainLatest .details .left .adv .txt ul li:nth-child(2) { background:url(../index-image/icon-time.png) 0 2px no-repeat; width:100px;  }
.MainLatest .details .left .adv .txt ul li:nth-child(3) { background:url(../index-image/icon-tips.png) 0 2px no-repeat; width:100px;  }
/*****************************/
.MainLatest .details .right { width:257px; float:right; border:1px solid #f3f5f6;}
.MainLatest .details .right .tab { height:50px; background:url(../index-image/tiete-sixteen.jpg) no-repeat; line-height:48px; color:#FFF; font-size:17px; padding:0 0 0 10px;}
.MainLatest .details .right ul { list-style:none; padding:15px 15px 0 10px; font-size:12px;}
.MainLatest .details .right ul li { line-height:18px; padding:5px 0 2px 20px; background:url(../index-image/icon-link.png) 0 10px no-repeat;}
.MainLatest .details .right ul li a { color:#1c9cff; text-decoration:none;}
.MainLatest .details .right ul li a:hover { color:#F60;}
/*****************************/
.MainToko { background:url(../index-image/tj-sixteen.jpg) center;}
.MainToko .details { width:1060px; margin:0 auto; padding:0; height:193px;}
.MainToko .details .soft { width:530px; float:left;}
.MainToko .details .soft .box { width:195px; float:left; padding:30px 0 0 50px;}
.MainToko .details .soft .txt { width:250px; float:left; padding:20px 25px 0 10px;}
.MainToko .details .soft .txt h2 { font-size:15px; font-weight:bold;}
.MainToko .details .soft .txt .but { padding:10px 0 0 40px;}
/*****************************/
.MainReview {}
.MainReview .details { width:1060px; margin:0 auto; padding:20px 0;}
.MainReview .details .Review { background:#f5f5fa; border-left:3px solid #83d442; padding:15px; margin-bottom:20px; }
.MainReview .details .Review h4 { font-size:15px; font-weight:800; padding:5px 0 0 15px; }
.MainReview .details .Review p { padding:5px 10px 0 15px;}
.MainReview .details .Review ul { list-style:none; padding:10px 0 0 15px; color:#b3b3b3;}
.MainReview .details .Review ul li { float:left; padding:0 0 0 20px;}
.MainReview .details .Review ul li:nth-child(1) { background:url(../index-image/icon-writer.png) 0 3px no-repeat; width:120px;  }
.MainReview .details .Review ul li:nth-child(2) { background:url(../index-image/icon-time.png) 0 2px no-repeat; width:100px;  }
.MainReview .details .Review ul li:nth-child(3) { background:url(../index-image/icon-tips.png) 0 2px no-repeat; width:100px;  }
.MainReview .details .arcc { text-align:center; padding:10px ; cursor:pointer;}
/*****************************/
.MainPor { background:url(../index-image/resbg-sixteen.jpg) center no-repeat;}
.MainPor .details { width:1060px; margin:0 auto; padding:0; height:320px;}
.MainPor .details .left { width:410px; float:left; height:320px;}
.MainPor .details .left h4 { font-size:15px; font-weight:800; padding:20px 0 0 15px; }
.MainPor .details .left ul { list-style:none; padding:10px 15px 0 20px; font-size:12px;}
.MainPor .details .left ul li { line-height:18px; padding:5px 0 5px 20px; background:url(../index-image/icon-link.png) 0 9px no-repeat;}
.MainPor .details .left ul li a { color:#1c9cff; text-decoration:underline;}
.MainPor .details .left ul li a:hover { color:#F60;}
/*****************************/
.MainPor .details .right { width:650px; float:left;}
.MainPor .details .right p { padding:20px 20px 10px 50px; }
.MainPor .details .right h5 { display:block; width:636px; font-size:13px; font-weight:bold; height:52px; line-height:50px; margin:0 auto; padding-left:10px;  background:#cce9b4; }
.MainPor .details .right h5 b a { color:#F00; text-decoration:none;}
.MainPor .details .right h5 b a:hover { color:#F00; text-decoration:underline;}
/*****************************/
.Mainclassify {}
.Mainclassify .details { width:1060px; margin:0 auto; padding:20px 0;}
.Mainclassify .details .left { width:253px; float:left;}
.Mainclassify .details .left h4 { font-size:15px; text-align:center; padding:10px 0 5px; font-weight:800;}
.Mainclassify .details .left p { padding:0 5px; color:#666;}
.Mainclassify .details .maginleft { margin-left:16px;}
/*****************************/

@media (min-width: 768px) and (max-width: 979px) {
	
.MainBan .details { width:100%; background:url(../index-image/banner-sixteen.jpg) top right #243e4f; height:auto; }
.MainBan .details .left { width:710px; float:none; margin:0 auto; }
.MainBan .details .right { width:710px; float:none; margin:0 auto;}
/*****************************/
.banner .mt_pic{padding-right:10px;}
.banner .text{font-size:15px; padding-top:0;}

.banner_bf{height:auto;}
.banner_bf .details{width:100%; left:0; margin-left:0; background:#FF6956; top:0; position:relative; height:auto; padding-bottom:8px;}
.banner_bf .details a{margin-top:0; padding-left:0; height:auto;}
/*****************************/
.MainTab .details { width:100%;}
.MainTab .details .buttin { width:123px; float:left; height:54px; padding-left:40px; margin:10px 5px; }
/*****************************/
.MainPopular .details { width:100%; }
.MainPopular .details .popbg { width:98%; height:auto; background:#fbfff7; padding-bottom:15px; margin:0 auto; border:1px solid #c5dfaf;}
.MainPopular .details .popbg ul {  padding:20px 0 0 20px;}
.MainPopular .details ul li { display:block; width:320px; float:left; padding:5px 15px 5px 25px;}
/*****************************/
.MainLatest .details { width:100%; margin:0 auto; padding:20px 0;}
.MainLatest .details h3 { font-size:23px; color:#70c32e; padding-bottom:20px; font-weight:bold; text-align:center;}
.MainLatest .details h3 span { background:none;}
.MainLatest .details .left { width:768px; float:none; margin:0 auto;}
.MainLatest .details .left .adv .box { width:240px; float:left;} 
.MainLatest .details .left .adv .txt { width:528px; float:left; height:auto; }
.MainLatest .details .right { float:none; margin:0 auto; width:768px;}
.MainLatest .details .right .tab { background:#40b0fb;}
/*****************************/
.MainToko { background:none;}
.MainToko .details { width:768px; margin:0 auto; height:auto;}
.MainToko .details .soft { width:100%; float:none; padding-bottom:20px; }
.MainToko .details .soft:nth-child(1) {background:#90d952;}
.MainToko .details .soft:nth-child(2) { background:#474b57;}
.MainToko .details .soft .box { width:195px; float:left; margin:0 auto; padding-bottom:10px;}
.MainToko .details .soft .txt { width:450px; float:left; margin:0 auto; padding:30px 0 0 20px;}
.MainToko .details .soft .txt p { padding:0 15px;}
.MainToko .details .soft .txt h2 { font-size:15px; font-weight:bold; padding:0 15px; }
.MainToko .details .soft .txt .but { padding:10px 0 0 40px;}
/*****************************/
.MainReview .details { width:768px; margin:0 auto;}
/*****************************/
.MainPor { background:none;}
.MainPor .details { width:768px; margin:0 auto; padding:0; height:auto; }
.MainPor .details .left { height:auto; background:#f7f7fa; width:100%; padding-bottom:10px; float:none;}
.MainPor .details .right { width:100%; float:none; background:#a6de64; height:auto;}
.MainPor .details .right p { padding:10px; }
.MainPor .details .right h5 { width:758px; height:auto; line-height:30px;}
/*****************************/
.Mainclassify .details { width:768px; margin:0 auto; padding:20px 0;}
.Mainclassify .details .left { float:left; width:253px;  padding:15px 0;}

	
	}
	
	
	
@media (min-width: 480px) and (max-width: 767px) {
	
.MainBan .details { width:100%; background:url(../index-image/banner-sixteen.jpg) top right #243e4f; height:auto; }
.MainBan .details .left { width:100%; }
.MainBan .details .right { width:100%;}
/*****************************/
.banner .mt_pic{padding-right:10px;}
.banner .text{font-size:15px; padding-top:0;}

.banner_bf{height:auto;}
.banner_bf .details{width:100%; left:0; margin-left:0; background:#FF6956; top:0; position:relative; height:auto; padding-bottom:8px;}
.banner_bf .details a{margin-top:0; padding-left:0; height:auto;}
/*****************************/
.MainTab .details { width:100%;}
.MainTab .details .buttin { width:123px; float:left; height:54px; padding-left:40px; margin:10px 5px; }
/*****************************/
.MainPopular .details { width:100%; }
.MainPopular .details .popbg { width:98%; height:auto; background:#fbfff7; padding-bottom:15px; margin:0 auto; border:1px solid #c5dfaf;}
.MainPopular .details .popbg ul {  padding:20px 0 0 20px;}
/*****************************/
.MainLatest .details { width:100%; margin:0 auto; padding:20px 0;}
.MainLatest .details h3 { font-size:23px; color:#70c32e; padding-bottom:20px; font-weight:bold; text-align:center;}
.MainLatest .details h3 span { background:none;}
.MainLatest .details .left { width:480px; float:none; margin:0 auto;}
.MainLatest .details .left .adv .box { width:480px; float:none; text-align:center;} 
.MainLatest .details .left .adv .txt { width:480px; float:none; height:auto; }
.MainLatest .details .right { float:none; margin:0 auto; width:768px;}
.MainLatest .details .right { width:257px; margin:0 0 0 15%; border:1px solid #f3f5f6;}
.MainLatest .details .right .tab { height:50px; background:url(../index-image/tiete-sixteen.jpg) no-repeat; line-height:48px; color:#FFF; font-size:17px; padding:0 0 0 10px;}
/*****************************/
.MainToko { background:none;}
.MainToko .details { width:480px; margin:0 auto; height:auto;}
.MainToko .details .soft { width:480px; float:none;  }
.MainToko .details .soft:nth-child(1) {background:#90d952;}
.MainToko .details .soft:nth-child(2) { background:#474b57;}
.MainToko .details .soft .box { width:195px; float:left; margin:0 auto; padding:40px 0 0 10px;}
.MainToko .details .soft .txt { width:225px; float:left; margin:0 auto; padding:30px 0 20px 10px;}
.MainToko .details .soft .txt p { padding:0 15px;}
.MainToko .details .soft .txt h2 { font-size:15px; font-weight:bold; padding:0 15px; }
.MainToko .details .soft .txt .but { padding:10px 0 0 15px;}
/*****************************/
.MainReview .details { width:100%;}
/*****************************/
.MainPor { background:none;}
.MainPor .details { width:100%; margin:0 auto; padding:0; height:auto; }
.MainPor .details .left { height:auto; background:#f7f7fa; width:100%; padding-bottom:10px; float:none;}
.MainPor .details .right { width:100%; float:none; background:#a6de64; height:auto;}
.MainPor .details .right p { padding:10px; }
.MainPor .details .right h5 { width:100%; height:auto; line-height:30px;}
/*****************************/
.Mainclassify .details { width:480px; margin:0 auto; padding:20px 0;}
.Mainclassify .details .left {  width:253px; margin:0 auto; text-align:center; padding:15px 0;}
.Mainclassify .details .maginleft { margin-left:10px;}
	
	}
	

@media  (max-width: 479px) {
.MainBan .details { width:100%; background:url(../index-image/banner-sixteen.jpg) top right #243e4f; height:auto; }
.MainBan .details .left { width:100%; }
.MainBan .details .right { width:100%;}
/*****************************/
.banner .details{background:#83d442 none;}
.banner a{padding:0;}
.banner .mt_pic{padding-right:5px;}
.banner .text{font-size:13px; padding-top:0; line-height:18px;}

.banner_bf{height:auto;}
.banner_bf .details{width:100%; left:0; margin-left:0; background:#FF6956; top:0; position:relative; height:auto; padding-bottom:8px;}
.banner_bf .details a{margin-top:0; padding-left:0; height:auto; font-size:15px;}
/*****************************/
.MainTab .details { width:100%;}
.MainTab .details .buttin { width:123px; float:left; height:54px; padding-left:40px; margin:10px 5px; }
/*****************************/
.MainPopular .details { width:100%; }
.MainPopular .details .popbg { width:98%; height:auto; background:#fbfff7; padding-bottom:15px; margin:0 auto; border:1px solid #c5dfaf;}
.MainPopular .details ul {  padding:20px 0 0 20px;}
.MainPopular .details ul li { display:block; width:80%; float:left; padding:5px 0 5px 25px;}
/*****************************/
.MainLatest .details { width:100%; margin:0 auto; padding:20px 0;}
.MainLatest .details .left { width:100%; float:left;}
.MainLatest .details .left .adv .box { width:240px; float:none;} 
.MainLatest .details .left .adv .txt { width:100%; float:none; height:auto; }
.MainLatest .details .right { float:left;}
/*****************************/
.MainToko { background:none;}
.MainToko .details { width:100%; height:auto;}
.MainToko .details .soft { width:100%; float:none; padding-bottom:20px; }
.MainToko .details .soft:nth-child(1) {background:#90d952;}
.MainToko .details .soft:nth-child(2) { background:#474b57;}
.MainToko .details .soft .box { width:195px; float:none; margin:0 auto; padding-bottom:10px;}
.MainToko .details .soft .txt { width:100%; float:none; margin:0 auto; padding:0;}
.MainToko .details .soft .txt p { padding:0 15px;}
.MainToko .details .soft .txt h2 { font-size:15px; font-weight:bold; text-align:center;}
.MainToko .details .soft .txt .but { padding:0; text-align:center;}
/*****************************/
.MainReview .details { width:100%;}
/*****************************/
.MainPor { background:none;}
.MainPor .details { width:100%; margin:0 auto; padding:0; height:auto; }
.MainPor .details .left { height:auto; background:#f7f7fa; width:100%; padding-bottom:10px; float:none;}
.MainPor .details .right { width:100%; float:none; background:#a6de64; height:auto;}
.MainPor .details .right p { padding:10px; }
.MainPor .details .right h5 { width:100%; height:auto; line-height:30px;}
/*****************************/
.Mainclassify .details { width:100%; margin:0 auto; padding:20px 0;}
.Mainclassify .details .left { float:none; width:100%; text-align:center; padding:15px 0;}
.Mainclassify .details .maginleft { margin-left:0;}
	}