@charset "utf-8";
/* CSS Document */
.detail{width: 1200px; margin: 0 auto;}
a{color: #30a6ec;}
a:hover{text-decoration: underline;}
img{max-width: 100%;}

.main01{background:url(../images/ratings/bg.jpg) no-repeat center bottom #1e3b58; height:132px;}
.main01 h1{font-size: 30px; font-weight: bold; color: #fff;padding: 40px 0 0;}
.main01 h1 img{ float:left; padding:0 15px 0 75px; margin: -10px 0 0 0;}
.main01 h1 span{font-size: 18px; font-weight: normal; color: #fff;display:block;padding: 20px 0 15px 360px;}
.main01 h1 span a{  color:#78c543;}
.main01 h2{font-size:20px;  color:#ffa128; padding:20px 0 0 390px;}
.Put { text-align: center;padding: 20px 0 0; }
.Put .Down { width: 190px; height: 53px; text-align: left; font-size:21px;  line-height: 25px; 
	padding: 7px 45px 0 30px; display: inline-block; cursor: pointer;  color: #fff; border-radius: 3px; }
.Put .Down em { font-size: 13px; font-weight:400; display: block; font-style: normal; }
.Put .forwin { background:url(../images/ratings/win-nineteen.png) 210px center no-repeat #78c443; margin: 0 35px 0 0;  }
.Put .forwin:hover { background:url(../images/ratings/win-nineteen.png) 210px center no-repeat #5db81d; }
.Put .formac {background:url(../images/ratings/mac-nineteen.png) 210px center no-repeat #78c443; }
.Put .formac:hover { background:url(../images/ratings/mac-nineteen.png) 210px center no-repeat #5db81d; }
/*----------*/
.main02{background:url(../images/ratings/bg2.jpg) no-repeat center top #1a304c; height: 235px;}
.main02 .detail{border-top:1px dashed #2d4b68;}
.main02 .detail > img{float: left;padding: 50px 25px 0 270px;}
.main02 h2{font-size: 24px;font-weight: bold;color: #ffa128;padding: 40px 0 11px;}
.main02 p{font-size: 16px;color: #efefef;padding: 2px 0;}
.main02 p a{color:#78c543;}
.main02 .mess{color: #8d939c;padding-top: 5px;}

.main02 .down_link{ padding-bottom:15px; }
.main02 .down_link span{ display:inline-block; padding-left:20px;}
.main02 .down_link a{ color:#78c543;}
/*----------*/
.main0202{background:url(../images/ratings/bg2.jpg) no-repeat center top #1a304c; height: 235px;}
.main0202 h2{font-size:20px; text-align:center; color:#ffa128; padding:20px 0 0;}
.main0202 .item_box{text-align:center; padding-top:40px; line-height:28px; color:#fff;}
.main0202 ol{display:inline-block; margin:0 25px;}
.main0202 ol li{background:url(../images/ratings/iconr.png) left center no-repeat; padding:0 0 0 20px; text-align:left;}

/*----------*/
.main03{background: url(../images/ratings/bg1.jpg) no-repeat left bottom #3794ec; height: 496px;}
.main03 .left{float: left;text-align: center;width: 37%;}
.main03 .left h2{font-size: 55px;font-weight: bold;color: #fff;padding: 100px 0 40px;}
.main03 .left h2 span{font-size:23px;font-weight: normal;display: inline-block;padding: 35px 0 0;}
.main03 .left .video{}
.main03 .left .video >img{cursor: pointer;}
.main03 .right {background: #3794ec;float: left;width: 63%; height: 100%;color: #fff;}
.main03 .right .icon{padding: 0 0 0 90px;}
.main03 .right .right_qus{border-right:1px solid #1994dc;padding: 0 60px 0 90px;}
.main03 .right .right_qus .qus_one{border-bottom:1px solid #51bdef;padding: 20px 0; position:relative;}
.right_qus .qus_one .t{font-size: 16px;font-weight: bold;padding-bottom: 10px;}
.right_qus .qus_one .ans{font-size: 14px; color:#d5f2ff;}
.right_qus .qus_one .ans input{opacity: 0;}
.right_qus .qus_one .ans label:nth-child(2),.right_qus .qus_one .ans label:nth-child(7){ width: 310px;display: inline-block; }
.right_qus .step1 .ans label[for="d1"]{ width:260px;}
.right_qus .step1 .ans label[for="e3"]{ width:490px;}
.right_qus .qus_one .ans input[type="radio"] + label::before,.right_qus .qus_one .ans input[type="checkbox"] + label::before{background: url(../images/ratings/r2.png) no-repeat left center;content: "\a0"; /*不换行空格*/display: inline-block; width:13px; height:13px; vertical-align:middle; padding:0 5px 0 0;}
.right_qus .qus_one .ans input[type="radio"]:checked + label::before,.right_qus .qus_one .ans input[type="checkbox"]:checked + label::before{background: url(../images/ratings/r1.png) no-repeat left center;}

.right_qus .qus_one .ans .mess{ color:#d5f2ff; padding:5px 0 0 15px;}
.right_qus .qus_one .ans .mess input{ opacity:1; border:none; background:none; color:#d5f2ff;border-bottom:1px dashed #75ccff; font-size:14px; width:70%; line-height:25px;}
.right_qus .qus_one .ans .mess ::-webkit-input-placeholder { font-style:italic; color:#fff;}
.right_qus .qus_one .ans .mess :-moz-placeholder {font-style:italic;  color:#fff;}
.right_qus .qus_one .ans .mess ::-moz-placeholder {font-style:italic;  color:#fff;}
.right_qus .qus_one .ans .mess :-ms-input-placeholder {font-style:italic;  color:#fff;}
.right_qus .step1{}
.right_qus .step1 .qus_one:last-child{border-bottom: none;}
.right_qus .step1 .ans{ line-height:25px;}


.right_qus .step2 .qus_one:last-child{border-bottom: none;}
.right .btn{border-top: 1px dashed #51bdef; margin: 0 40px 0;padding: 20px 0 0 50px; vertical-align: middle;display: block;}
.right .btn input{float: left; width: 235px; border:1px solid #5db81d;line-height: 52px; background: none;border-radius:8px 0 0 8px;color: #fff;font-size: 15px;padding: 0 0 0 10px;}
.right .btn input::-webkit-input-placeholder{ color:#9cd8fe;}
.right .btn input::-moz-placeholder{ color:#b2e1ff;}
.right .btn input:-moz-placeholder{ color:#b2e1ff;}
.right .btn input:-ms-input-placeholder{ color:#9cd8fe;}


.right .check_mess{font-size: 14px; width: 480px; text-align: center;padding: 5px 0 0 90px;}
.right .check_mess a{color: #054a8a;}

.right .success_mess{width:550px;}
.right .success_mess a{color: #89ff76;}

.right .btn_mess{ font-size:17px; color:#f7ff7b; padding:25px 0 0 50px;margin: 0 0 0 40px; border-top: 1px dashed #51bdef;}
.right .btn_mess a{color:#f7ff7b;}
/*.right .btn{border-top: 1px dashed #51bdef; margin: 10px 40px 0;font-size: 18px;font-weight: bold;padding: 25px 0 0; text-align: center;}
.right .btn a{color: #fff;text-decoration: none;cursor: pointer; display: inline-block;background:#74d763;line-height: 60px;padding: 0 30px 0 0;border-radius: 10px;}
.right .btn a >img{margin: -1px 10px 0 -70px;}*/

/*----------*/
.main04 h2{font-size: 28px;text-align: center;font-weight: bold;padding: 80px 0 170px;}
.main04 .screen{background:#f5f6f7; padding:1px 0;}
.main04 .screen .detail{margin:-120px auto 0;}
.main04 .screen .screen_content {position: relative; margin:0 25px;}
.main04 .screen .screen_content .change_left{ position: absolute;left: -20px; top: 108px;cursor: pointer;}
.main04 .screen .screen_content .change_right{ position: absolute;right:-25px;top: 108px;cursor: pointer;}
.main04 .screen .change_border{ overflow: hidden;position: relative; height: 268px;}
.main04 .screen .change_border .change_box{ width: 3000px; height: 238px; position: absolute;left: 0; top: 15px; }
.change_border .change_box >img{ margin: 0 12px;cursor: pointer;box-shadow: 0 3px 14px rgba(0,0,0,.09); }
/*----------*/
.main05{background:#f5f6f7; padding:25px 0 35px 0;}
.main05 h2{font-size: 25px;font-weight: bold; padding-bottom:15px;}
.main05 table.left{ width: 48%; margin: 0 4% 0 0; float: left; }
.main05 table.right{width: 48%;}
.main05 table th{font-size: 13px;padding: 12px 0;border-bottom: 1px solid #e1e1e1; color:#2e2e2e;}
.main05 table tr td{border-bottom: 1px solid #e1e1e1; font-size: 14px;padding: 12px 0;}
.main05 table tr td:nth-child(1){width: 250px; font-size:13px; padding-left:15px;}
.main05 table tr:nth-child(1) td:nth-child(1){ padding-left:0;}
.main05 table tr td b{ color:#2e2e2e;}
.main05 table tr td p{ color:#424242;}
.main05 table.right tr td p{}
.main05 table.right tr td:nth-child(1){width: 150px;}
.main05 table.right tr:last-child td{ border-bottom:none; font-size:15px; color:#424242; padding-left:0;}
.main05 .mess a{color:#00a2ff; text-decoration:none;}
.main05 table tr span{color:#00a2ff; font-size:12px;}

.main05 table tr .os_mess{ color:#2e2e2e; font-weight:bold;}
.main05 table tr .os_mess span {color:#424242;}
.main05 .Put{padding: 35px 0 15px;}
/*----------*/
.main06{padding-bottom: 60px;}
.main06 h2{text-align: center;font-size: 28px;font-weight: bold;padding: 70px 0 50px;}
.main06 .main06_cont{ color:#3e3e3e;}
.main06 .main06_one{width:30%;float:left;}
.main06 .main06_one:nth-child(2){ padding:0 4.5%; }
.main06_one .mech{ color:#00a2ff; font-size:17px;}
.main06_one .mech img{ padding-right:17px;}
.main06_one .t{font-size:15px; padding:15px 0 10px; color:#1f2833;font-weight: bold;}


/*----------*/
.main07{padding-bottom: 70px;}
.main07 .qes_one{border-bottom: 1px solid #e6e6e6;padding: 18px 0 8px;}
.main07 .qes_one .t{font-size: 18px; background: url(../images/ratings/add.png) no-repeat right 3px;cursor: pointer; padding-bottom: 10px;}
.main07 .qes_one .qes_ans{color: #737480;display: none;}
.main07 .qes_one.focus .t{background: url(../images/ratings/min.png) no-repeat right center;}
.main07 .qes_one.focus .t a{color:#000;}
.main07 .qes_one.focus .qes_ans{display: block;}
/*----------*/
.main08{ color:#565c63; padding-bottom:80px;}
.main08 .main08_one{width:20%; padding:0 4%; float:left; text-align:center;}
.main08 .main08_one:nth-child(2){padding:0 9%;}
.main08_one .t{font-size:15px; padding:15px 0 10px; color:#1f2833;font-weight: bold;}
/*----------*/
.big_pic{ width: 940px;display: none;position: relative; }
.big_pic .close{ text-align: right;font-size: 45px; position: relative; color: #fcfcfc; }
.big_pic .close span{cursor: pointer; position: absolute;right: -35px; top: -25px;}
.big_pic .big_content{position: relative; height: 710px; overflow: hidden;}
.big_pic .big_content .big_box{position: absolute; left: 0; top: 0; width: 8000px; height: 710px;}
.big_pic .left{ position: absolute;left: -100px; top: 330px;cursor: pointer; }
.big_pic .right{position: absolute;right: -100px; top: 330px;cursor: pointer; }
.big_content  .big_num{ position:absolute; bottom:20px; left:520px; border-radius:16px; padding:12px;background-color:rgba(0,0,0,.4);}
.big_content  .big_num span{ display:inline-block; width:4px; height:4px; border-radius:50%; margin:0 3px; border:1px solid #fff;}
.big_content  .big_num span.focus{ background:#fff;}
/*----------*/
.video_pop{width:810px; height:410px;}
.video_pop .close{ text-align: right;font-size: 35px; position: relative; color: #fcfcfc; }
.video_pop .close span{cursor: pointer; position: absolute;right: -15px; top: -20px;}

@media (max-width: 979px) {
	.detail{width: auto;}
	.mobileNo{display:none;}
	/*----------*/
	.main01{height: auto;padding-bottom: 20px;}
	.main01 h1{font-size: 30px;}
	.main01 h1 img{padding-left: 0;}
	
	.main01 h1 span{padding-left:0;}
	/*----------*/
	.main02 .detail > img{padding-left: 10%;}
	
	.main0202 ol{ margin:0 15px;}
	/*----------*/
	.main03{height: auto;}
	.main03 .right{width: 100%; height: auto;padding-bottom: 20px;}
	.main03 .right .right_qus{padding: 0 11%;}
	/*----------*/
	.main05 table tr td:nth-child(1){width: 170px;}
	.main05 table.right tr td:nth-child(1){width:70px;}
	/*----------*/
	.main06 .detail,.main07 .detail{padding:0 3px;}
	
	.main06_one{width:32%;float:left;}
	.main06  .main06_one:nth-child(2){ padding:0 2%; }
	/*----------*/
	.main08 .main08_one{width:30%; padding:0 2%;}
	.main08 .main08_one:nth-child(2){padding:0 ;}
	
	
	
}

@media (max-width: 767px) {
	.main01 h1{font-size: 22px;}
	.main01 h1 span{font-size: 16px;}
	.Put .forwin{margin: 0 0 10px;}
	.main02{height: auto; padding-bottom:20px;}
	.main02 .detail > img{padding-left: 0;}
	/*----------*/
	.main02 h2{font-size: 20px;}
	.right .btn{margin: 0 0 0 20px;}
	.right .check_mess{padding-left: 0;}
	.right .btn_mess{margin: 0; padding-left: 0;}
	
	.main0202{height:auto; padding-bottom:20px;}
	.main0202 ol{ margin:0 30px;}
	/*----------*/
	.main03 .right .right_qus{padding:0 7%;}
	.right_qus .qus_one .ans .mess input{ width:100%;}
	.right_qus .step1 .ans label[for="e3"]{width:95%;}
	.right .btn{padding: 25px 0 0;}
	.right .success_mess{width:auto;}
	/*----------*/
	.main05 table.left{ width: auto; margin: 0; float: none; }
	.main05 table.right{width: auto;}
	/*----------*/
	.main07,.main08{padding-bottom:40px;}
	/*----------*/
	.main06 .main06_one{width:auto;float:none;}
	.main06 .main06_one:nth-child(2){ padding:20px 0; }
	/*----------*/
	.main08 .main08_one{width:90%; margin:0 auto; float:none; padding:10px 0;}
}

@media (max-width: 479px) {
	.main01 h1{font-size: 20px;padding: 40px 0 0;}
	
	/*----------*/
	
	.main02 .detail > img{float: none;display: inherit; margin: 0 auto;}
	.main02 .text{padding: 0 5px;}
	.main02 h2{font-size: 18px;}
	.right .btn input{width: 90%; margin: 0 auto;float: none;display: block;border-radius: 8px;}
	.right .btn span{display: block;text-align: center;}
	.right .btn span >img{border-radius: 15px 0 0 10px;}
	.right .check_mess{padding-left: 0; width: auto;}
	.right .btn_mess{width: auto;padding-left: 0;}
	
	.main02 .down_link{ text-align:center;}
	.main02 .down_link span{ display:inline-block;}
	
	.main0202 ol{margin:0 5px;}
	/*----------*/
	.main03 .right .right_qus{padding: 0 6%;}
	.right .btn{font-size: 14px;}
	.right_qus .step1 .ans label[for="d1"]{width:200px;}
	.right_qus .step1 .ans label[for="e3"]{ width:310px;}
	.right_qus .qus_one .ans .mess input{ font-size:13px;}
	.right_qus .qus_one .ans label{clear: right;}
	.right .btn{margin:10px 10px 0;}
	.right .btn_mess{padding: 20px 0 0 20px;}
	/*----------*/
	.main05 table tr td:nth-child(1){ width:140px;}
	/*----------*/
	.main06 .links > img{margin:5px 2%; width:40%;}
	/*----------*/
	
}