@charset "utf-8";
/* CSS Document */
body { margin:0; padding:0; font:15px/24px tahoma, Arial, sans-serif; color:#&;   -webkit-text-size-adjust:none;
 -moz-text-size-adjust:none;-ms-text-size-adjust:none; }
.clear { clear:both; height:0;}
.Details { width:1080px; margin:0 auto;}
img { max-width: 100%; }
h1, h2, h3, h4, h5, p, h6, ul, li, ol, dd, dl, dt, input { padding:0; margin:0; list-style:none; font-weight:400;}
*{margin:0; padding:0;}
.border-r { border-radius: 5px; -o-border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; transition: all 0.5s; -o-transition: all 0.5s; -moz-transition: all 0.5s;
-webkit-transition: all 0.5s;  }
/* CSS Document */
.DivNav { position: fixed; top: 0; width: 100%; height: 80px; background: #2b2d33; box-shadow: 0px 5px 5px #e5e5e5; -webkit-box-shadow: 0px 5px 5px #e5e5e5; 
	-moz-box-shadow: 0px 5px 5px #e5e5e5; -o-box-shadow: 0px 5px 5px #e5e5e5; z-index: 100; }
.DivNav .Logo { width: 140px; height: 44px; float: left; padding: 10px 0 0; }

.DivNav ul {  float: right; display: block; padding: 23px 0 0; }
.DivNav ul li { padding:0 20px; float: left;  font-size: 19px; color: #babcbd;  }
.DivNav ul li a { color: #babcbd;  text-decoration: none; }
.DivNav ul li:nth-child(1) a{ border-bottom:1px solid #91cd45;}
.DivNav .Download { width: 160px; float: right; height: 40px; z-index: 0; position: relative; overflow: hidden; margin: 18px 0 0; }
.DivNav span {  display: block; width: 160px;  height: 40px; display: block; text-align: center; background: #02acfa; 
	color: #fff; float: right;  border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -o-border-radius: 3px; line-height: 40px; 
	font-size:17px; cursor: pointer; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; -o-transition: 0.5s all; }
.DivNav span a {  text-decoration: none; color: #fff; }
.DivNav .shadow:before {  content:""; width:100px; height:50px; display:block; background-color:rgba(255,255,255,.2); 
transform:rotate(-70deg); position:absolute; top:0; right:-20%;transition:all .5s ease-in-out;-webkit-transition:all .5s ease-in-out;
-moz-transition:all .5s ease-in-out;-o-transition:all .5s ease-in-out; z-index:10; }
.DivNav .shadow:hover:before { width:200px; height:200px; top: -60px; }
.DivNav .m_nav{ float:right;width: 30px; margin:15px 0 0; border-top: 12px double #737373;padding-bottom: 5px;border-bottom: 4px solid #737373; cursor: pointer;border-spacing:5px; display:none;}
/* CSS Document */
.DivMain01 {background: url(../img/record/div01-bg.jpg) center no-repeat #fff9e9;/* margin:80px 0 0; */}
.bg01{background-image:url(../img/record/div01-bg3.jpg);}
.DivMain01 .Details { height: 188px; }
.DivMain01 h1 {font-size: 39px;text-align: center;font-weight: 800;color: #ff6600;line-height: 42px;padding: 30px 0 0;}
.DivMain01 h1 em { font-size: 19px; color: #333; font-style: normal;  font-weight: 400;  display: block; padding: 5px 0 0; }
.DivMain01 h1 b { border-bottom: 1px dotted #ff6600;  }
.DivMain01 h1 a { text-decoration: none; color: #f60; }
/* CSS Document */
.DivMain02 {  background: url(../img/record/div02-bg.jpg) center no-repeat #fff9e9; }
.bg02{background-image:url(../img/record/div01-bg4.jpg);}
.DivMain02 .Details { height: 90px; }
.DivMain02 ul {  display: block; width: 800px; margin: 0 auto; padding: 40px 0 0; color: #6a747d; }
.DivMain02 ul li {float: left;  background: url(../img/record/div02-icon.png) left center no-repeat; padding: 0 0 0 20px; margin: 0 43px 0 0; }
.DivMain02 .item_box{text-align:center; padding-top:25px; line-height:28px; color:#6a747d;}
.DivMain02 ol{display:inline-block; margin:0 25px;}
.DivMain02 ol li{background:url(../img/record/div02-icon.png) left center no-repeat; padding:0 0 0 20px; text-align:left;}

/* CSS Document */
.DivMain03 {  }
.DivMain03 .Details { padding: 30px 0 90px; position: relative; }
.DivMain03 .Bot { text-align: center; }
.DivMain03 .Bot .Win, .DivMain07 .Bot .Win {  width: 200px; height: 65px; padding: 0 70px 0 0px; background:url(../img/record/div03-win.png) 200px 10px no-repeat #00aaff; text-align: center;
color: #fff; font-size: 27px; line-height: 65px; display: inline-block;  }
.DivMain03 .Bot .Mac, .DivMain07 .Bot .Mac {  width: 200px; height: 65px; padding: 0 70px 0 0px; background:url(../img/record/div03-mac.png) 200px 10px no-repeat #4fcc8e; text-align: center;
color: #fff; font-size: 27px; line-height: 65px; display: inline-block; }
.DivMain03 .Magin, .DivMain07 .Magin { margin: 0 50px 0 0; }
.DivMain03 .Bot .Win:hover, .DivMain07 .Bot .Win:hover { background:url(../img/record/div03-win.png) 200px 10px no-repeat #2bb5fa; }
.DivMain03 .Bot .Mac:hover, .DivMain07 .Bot .Mac:hover { background:url(../img/record/div03-mac.png) 200px 10px no-repeat #55dd99; }
.DivMain03 .Try { width: 111px; height: 85px; background: url(../img/record/div03-bg.jpg) no-repeat; position: absolute; top: 15px; left: 100px; }
/* CSS Document */
.DivMain04 {  }
.DivMain04 .Details {  border-bottom: 4px solid #ff6500; text-align: center;  }
.DivMain04 .Left { width: 130px; height: 40px; text-align: center;  display: inline-block;  border-radius:5px 5px 0 0; -o-border-radius:5px 5px 0 0; -moz-border-radius:5px 5px 0 0;
-webkit-border-radius:5px 5px 0 0;  background: #ff6600;  color: #fff; font-size: 19px; line-height: 40px; }
.DivMain04 .Margin {  margin: 0 120px 0 0; }
.DivMain04 .Center { width: 140px; height: 38px; border-top: 2px solid #ff6600; display: inline-block; line-height: 38px; font-size: 19px; color: #00aaff;  }
/* CSS Document */
.DivMain05 {  background: url(../img/record/div05-bg.jpg) bottom repeat-x #fff ; }
.DivMain05 .Details { background: #fffcf5; padding: 80px 0;  }
.DivMain05 h2 { text-align: center; }
.DivMain05 p { padding: 45px 145px 0; }
.DivMain05 p b { color: #ff6600; }
.DivMain05 .Img { width: 780px; margin: 0 auto; padding: 40px 0 0px; }
.DivMain05 .Img02 { width: 901px; margin: 0 auto; padding: 40px 0 0; }
/* CSS Document */
.DivMain06 { background: #fcfcfc; }
.DivMain06 .Details { padding: 60px 0 80px; }
.DivMain06 h3 { font-size: 25px;  text-align: center; font-weight: 800; }
.DivMain06 h4 { font-size: 19px; padding: 40px 0 20px; }
.DivMain06 p {  color: #808080; }
.DivMain06 p em { font-style: normal; color: #f60; }
/* CSS Document */
.DivMain07 {  }
.DivMain07 .Details { padding: 60px 0; }
.DivMain07 h3 {  font-size: 21px; text-align: center; font-weight: 800; }
.DivMain07 .Left { width: 33%; float: left; text-align: center; padding: 60px 0; }
.DivMain07 .Left h4 { font-size: 17px; padding: 30px 0 20px; }
.DivMain07 .Left p { padding: 0 40px; color: #666; }
.DivMain07 .Bot { padding: 30px 0 10px; text-align: center; }
/* CSS Document */
.DivMain08 {  background: #2a2d35; }
.DivMain08 .Details { padding: 40px 0; }
.DivMain08 ul { color: #00aaff; }
.DivMain08 ul li { width: 40%;  float: left; padding: 1% 5%; background: url(../img/record/div08-img01.jpg) 6% center no-repeat; }
.DivMain08 ul li a { text-decoration: none; border-bottom: 1px dotted #00aaff; color: #00aaff; }
/* CSS Document */
.DivMain03 .Bot a { text-decoration: none; }
.DivMain07 .Bot a { text-decoration: none; }
/* CSS Document */


.Top_Nav{background-color:#0f0f0f; line-height:70px; position:fixed; top:0; left:0; width:100%; z-index:99; display:none;}
.Top_Nav .l_ti{float:left; color:#fff; font-size:33px;}
.Top_Nav .l_ti a{color:#fff; text-decoration:none;}
.Top_Nav .r_link{float:right; height:70px;}
.Top_Nav .r_link a{font-size:21px; color:#fff; margin-left:88px; display:inline-block; text-decoration:none;}

@media (max-width: 979px) {

.Details { width:95%; margin:0 auto; }

.DivNav { height: auto; }
.DivNav .Logo{float:none;padding:5px 0 10px;}
.DivNav .m_nav{ display:block; position:relative;}
.DivNav ul{display:none; border-top:1px solid #babcbd; padding:10px 0 20px; margin:10px 0 0; float:none;}
.DivNav ul li{width:100%; padding:5px 0;}
.DivNav .m_nav.on{border:none; height:26px;}
.DivNav .m_nav.on:before,.DivNav .m_nav.on:after { content:""; -webkit-transition: top .3s ease,transform .3s .5s ease; -moz-transition: top .3s ease,transform .3s .5s ease; -o-transition: top .3s ease,transform .3s .5s ease; transition: top .3s ease,transform .3s .5s ease; top:10px;width:30px; height:4px; background:#737373; display:inline-block; position:absolute;}
.DivNav .m_nav.on:before { -webkit-transform: rotate3d(0,0,1,45deg); -moz-transform: rotate3d(0,0,1,45deg); -o-transform: rotate3d(0,0,1,45deg); transform: rotate3d(0,0,1,45deg); }
.DivNav .m_nav.on:after { -webkit-transform: rotate3d(0,0,1,-45deg); -moz-transform: rotate3d(0,0,1,-45deg); -o-transform: rotate3d(0,0,1,-45deg); transform: rotate3d(0,0,1,-45deg);}
/* CSS Document */
.DivMain01 {background: #fff9e9;/* margin:59px 0 0; */}
.DivMain01 .Details { height:auto; padding: 30px 0; }
.DivMain01 h1 { font-size: 31px;  line-height: 34px; padding: 10px 0 0; }

.DivMain02 {  background: #fff9e9; }
.DivMain02 .Details { height: auto; padding: 20px 0; }
.DivMain02 ul {  display: block; width: 95%; margin: 0 auto; padding: 10px 0 0;  }
.DivMain02 ul li {  width: calc(25% - 20px); float: left;  background: url(../img/record/div02-icon.png) left center no-repeat; padding: 0 0 0 20px; }

.DivMain03 .Try {  display: none; }

.DivMain05 .Img { width: 100%; max-width: 780px; }
.DivMain05 .Img02 { width: 100%; max-width: 901px;  }
.DivMain05 p { padding: 45px 15px 0; }


	.Top_Nav .r_link a{margin-left:50px;}

	/*---Footer end----*/
}

@media (max-width: 767px) {
	.DivNav ul li {font-size: 17px; }
	
	.DivMain02 ul li {  width: calc(50% - 20px); float: left;  background: url(../img/record/div02-icon.png) left center no-repeat; padding: 5px 0 5px 20px; }
	.DivMain02 ol{width:100%;}
	.DivMain03 .Bot .Win, .DivMain07 .Bot .Win {   display: block;  margin: 0 auto 20px; }
	.DivMain03 .Bot .Mac, .DivMain07 .Bot .Mac { display: block; margin: 0 auto; }
	.DivMain03 .Magin, .DivMain07 .Magin {   }
	
	.DivMain04 .Margin {  margin: 0 20px 0 0; }
	
	.DivMain07 .Left { width: 50%; float: left; text-align: center; padding: 60px 0; }

	
	.Top_Nav .l_ti{font-size:20px;}
	.Top_Nav .r_link a{margin-left:15px; font-size:17px;}
	
	/*---Subscribe start----*/

	/*---Footer end----*/	
}

@media (max-width: 479px) {
	/*---Subscribe start----*/

	.DivMain04 .Margin {  margin: 0 10px 0 0; }
	.DivMain04 .Left { width: 90px; height: 40px; }
	.DivMain04 .Center { width: 90px; height: 38px;  }

	.DivMain07 .Left { width: 95%; margin: 0 auto; float: left; text-align: center; padding: 60px 0; }

	.DivMain08 ul li { width: 90%;  float: left; padding: 1% 5%; background: url(../img/record/div08-img01.jpg) 2% center no-repeat; }
	
		.Top_Nav .l_ti{font-size:18px;}
	.Top_Nav .r_link a{font-size:15px;}
	
}