body{
	overflow:hidden;
	font-family:Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
}
#box{
	width:980px;
	height:645px;
	position:relative;
	margin:auto;
}
.box_img{
	width:100%;
}


#big_box{
	width:980px;
	position:absolute;
	top:0;
	height: 100%;
}
.des_cell{
	width: 482px;
	height: 78px;
}
#questionBox{
	width:602px;
	position:absolute;
	top:138px;
	left:20px;
	z-index:0;
}
#questionBox img{
	width:100%;
}

#dimBox{
	width:980px;
	height:645px;
	position:absolute;
	z-index:12;
}

#show_ansBox{
	width:329px;
	position:absolute;
	top:138px;
	left:642px;
}
#ansBox_bg{
	width:310px;
	height:231px;
	position:absolute;
	top:148px;
	left:652px;
	background:url(../images/ans00.png);
}

.des_cell_a{
}
.des_cell_b{
}
.des_cell_c{
	
}
.des_cell_d{
}
.des_cell_test{
}

.pic_cell{
	width:50px;
	height:50px;
	display:none;
}

#box #pic_container #p0{
	position:absolute;
	left: 363px;
	top: 231px;
	
}
#box #pic_container #p1{
	position:absolute;
	left: 715px;
	top: 238px;
	
}
#box #pic_container #p2{
	position:absolute;
	left: 363px;
	top: 522px;
	
}
#box #pic_container #p3{
	position:absolute;
	left: 715px;
	top: 513px;
	
}
#box #pic_container #p4{
	position:absolute;
	left: 543px;
	top: 360px;
	
}
#box #pic_container #p5{
	position:absolute;
	left: 698px;
	top: 357px;
	
}
#box #pic_container #p6{
	position:absolute;
	left: 332px;
	top: 540px;
	
}
#box #pic_container #p7{
	position:absolute;
	left: 190px;
	top: 647px;
	
}
#box #pic_container #p8{
	position:absolute;
	left: 335px;
	top: 649px;
	
}
#box #pic_container #p9{
	position:absolute;
	left: 558px;
	top: 651px;
	
}
#box #pic_container #p10{
	position:absolute;
	left: 708px;
	top: 546px;
	
}
#box #pic_container #p11{
	position:absolute;
	left: 707px;
	top: 657px;
	
}


.pic_0{
	position:absolute;
	left: 652px;
	top: 148px;
	z-index:10;
}
.pic_1{
	position:absolute;
	left: 652px;
	top: 148px;
	z-index:9;
}
.pic_2{
	position:absolute;
	left: 652px;
	top: 148px;
	z-index:8;
}
.pic_3{
	position:absolute;
	left: 652px;
	top: 148px;
	z-index:7;
}
.pic_4{
	position:absolute;
	left: 652px;
	top: 148px;
	z-index:6;
}
.pic_5{
	position:absolute;
	left: 652px;
	top: 148px;
	z-index:5;
}
.pic_6{
	position:absolute;
	left: 652px;
	top: 148px;
	z-index:5;
}
.pic_7{
	position:absolute;
	left: 652px;
	top: 148px;
	z-index:5;
}
.pic_8{
	position:absolute;
	left: 652px;
	top: 148px;
	z-index:5;
}

.show_ifYou{
	width:170px;
	position:absolute;
	left: 700px;
	top: 395px;
	font-size:20px;
	font-style:italic;
	color: #004A88;
}
.src_cell{
	width:235px;
	height:85px;
	position:absolute;
	left: 690px;
	top: 420px;
	z-index:5;
	font-size:20px;
	text-align:center;
	display:none;
}
.src_temp > div.item, 
.src_cell > div.item {
	width: 100%;
	height: 100%;
	display: table;
}
.src_temp > div.item > div,
.src_cell > div.item > div {
	display: table-cell;
	vertical-align: middle;
	cursor: pointer;
}

#des_container #d0{
	position:absolute;
	top: 497px;
    left: 80px;
	z-index:1;
}
#des_container #d0 img{
	width:100%;
}

#des_container #d1{
	position:absolute;
	left: 20px;
	top: 100px;
	z-index:1;
}
#des_container #d2{
	position:absolute;
	left: 20px;
	top: 100px;
	z-index:1;
}
#des_container #d3{
	position:absolute;
	left: 20px;
	top: 100px;
	z-index:1;
}
#des_container #d4{
	position:absolute;
	left: 20px;
	top: 100px;
	z-index:1;
}
#des_container #d5{
	position:absolute;
	left: 20px;
	top: 100px;
	z-index:1;
}
#des_container #d6{
	position:absolute;
	left: 55px;
	top: 532px;
	z-index:1;
}
#des_container #d7{
	position:absolute;
	left: 155px;
	top: 532px;
	z-index:1;
}
#des_container #d8{
	position:absolute;
	left: 415px;
	top: 532px;
	z-index:1;
}
#des_container #d9{
	position:absolute;
	left: 515px;
	top: 532px;
	z-index:1;
}
#des_container #d10{
	position:absolute;
	left: 164px;
	top: 440px;
}

#speechBox{
	width: 482px;
    height: 52px;
    position: absolute;
    top: 150px;
    left: 80px;
	z-index:2;
	font-size:20px;
	/* padding:5px 10px 0px 0px; */
}
#speechBox:before {
	content: '';
	height: 100%;
    display: inline-block;
    vertical-align: middle;
}
#speechBox > div {
	display: inline-block;
	vertical-align: middle;
}
#speechBox_2{
	width: 482px;
	height: 78px;
	position: absolute;
	top: 497px;
	left: 80px;
	z-index:2;
	font-size:20px;
	/* padding:5px 10px 0 0px; */
}
#speechBox_2.kuang {
	width: 515px;
}
#speechBox_2.kuang2 {
	width: 570px;
	left: 35px;
}
div#speechBox_2_td {
    font-size: 0;
}
div#speechBox_2_td > div {
    font-size: 20px;
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box;
}
div#speechBox_2_td > div:first-child {
    margin-top: -6px; 
}
div#speechBox_2_td > div:last-child {
    width: calc(100% - 34px);
    padding-left: 8px;
}



.left_btn{
	width:66px;
	position:absolute;
	left:635px;
	top:410px;
	cursor:pointer;
}
/*.left_btn:hover{
	background:url(../images/btn/brn_right_2.png);
}*/
.left_btn_dim{
	width:66px;
	position:absolute;
	left:635px;
	top:410px;
}

#xianshi_wenzi{
	width:188px;
	text-align:center;
	position:absolute;
	left:707px;
	top:370px;
	font-size:25px;
}

.right_btn{
	width:66px;
	position:absolute;
	left:912px;
	top:410px;
	cursor:pointer;
}

.right_btn_dim{
	width:66px;
	position:absolute;
	left:912px;
	top:410px;
}


.left_btn_q{
	width:104px;
	position:absolute;
	left:640px;
	top:530px;
	cursor:pointer;
}
/*.left_btn_q:hover{
	background:url(../images/btn/back_s2.png);
}

.left_btn_q:active{
	background:url(../images/btn/back_s3.png);
}*/

.left_btn_q_dim{
	width:104px;
	position:absolute;
	left:640px;
	top:530px;
}

.right_btn_q{
	width:104px;
	position:absolute;
	left:750px;
	top:531px;
	cursor:pointer;
}
/*.right_btn_q:hover{
	background:url(../images/btn/next_s2.png);
}
.right_btn_q:active{
	background:url(../images/btn/next_s3.png);
}*/
.right_btn_q_dim{
	width:104px;
	position:absolute;
	left:750px;
	top:531px;
}

.play_btn{
	width:34px;
	height:34px;
	cursor:pointer;
}
/*.play_btn:hover{
	background:url(../images/btn/v_1_s2.png);
}
.play_btn:active{
	background:url(../images/btn/v_1_s3.png);
}*/


#play_tishi{
	width:34px;
	height:34px;
	position:absolute;
	top:70px;
	left:20px;
	z-index:2;
	cursor: pointer;
}
#play_tishi img{
	width:100%;
}

/* #play_question{
	position: absolute;
	top: 6%;
	left: 3%;
} */
#play_question img, #play_question_1 img{
	width:100%;
}
#play_question_1{
	/* float:left; */
	margin: 0;
	background:url(../images/btn/v_1.png);
}
#play_question_1:hover{
	background:url(../images/btn/v_1_s2.png);
}


#play_biaoti{
	width:34px;
	height:34px;
	position:absolute;
	top:28px;
	left:290px;
	cursor:pointer;
}
#play_biaoti img{
	width:100%;
}

.btn_1{
	width:51px;
	height:51px;
	position:absolute;
	left:860px;
	top:530px;
	cursor:pointer;
}
/*.btn_1:hover{
	background:url(../images/btn/an_r1_c6_s2.png);
}
.btn_1:active{
	background:url(../images/btn/an_r1_c6_s3.png);
}*/
.btn_1_dim{
	width:51px;
	height:51px;s
	position:absolute;
	left:860px;
	top:530px;
}


#test{
	width:1px;
	height:1px;
	position:absolute;
	left:38px;
	top:88px;
}
#cle{
	position:absolute;
	left:210px;
	top:660px;
}

#dim_div{
	width:980px;
	height:645px;
	background:url(../images/dim.png) 70% 70% repeat-x;
	position:absolute;
	z-index:10;
	opacity:.7;
}

#challenge{
	width:980px;
	height:645px;
	position:absolute;
	z-index:11;
}
#yesBtn{
	position:absolute;
	top:325px;
	left:360px;
	cursor:pointer;
}
#yesBtn:hover{
	
}
#yesBtn:active{
	
}
#noBtn{
	position:absolute;
	top:325px;
	left:510px;
	cursor:pointer;
}
#noBtn:hover{
	
}
#noBtn:active{
	
}

#title_div{
	width:980px;
	height:645px;
	position:absolute;
	z-index:999;
}
#title_div img{
	width:100%;
}

#zhishiju{
	width:913px;
	font-size:23px;
	position:absolute;
	top:74px;
	left:65px;
	z-index:10;
}

#startBtn{
	width:200px;
	height:77px;
	
	position:absolute;
	z-index:1000;
	top:420px;
	left:393px;
	cursor:pointer;
}
/*#startBtn:hover{
	background:url(../images/btn/start1_s2.png);	
}
#startBtn:active{
	background:url(../images/btn/start1_s3.png);	
}*/

.challenge_btn{
	width:51px;
	height:51px;
	position:absolute;
	z-index:9;
	top:530px;
	left:920px;
	cursor:pointer;
}
/*.challenge_btn:hover{
	background:url(../images/btn/tz_s2.png);	
}
.challenge_btn:active{
	background:url(../images/btn/tz_s3.png);	
}*/
.challenge_btn_dim{
	width:51px;
	height:51px;
	position:absolute;
	z-index:9;
	top:530px;
	left:920px;
}

#xuanXiang_btn{
	position:absolute;
	z-index:10;
	top:390px;
	left:687px;
}
#xuanXiang_btn img{
	width:100%;
}

.src_temp{
	width:240px;
	height:85px;
	z-index:5;
	font-size:20px;
	text-align:center;
	background-color:#FFF;
}


.zui_1{
	width:30px;
	height:21px;
	position:absolute;
	top: 442px;
    left: 291px;
	background-image:url(../images/zb1.gif);
	background-repeat: no-repeat;
    background-size: contain;
}
.zui_2{
	width:34px;
	height:23px;
	position:absolute;
	top: 444px;
    left: 454px;
	background-image:url(../images/zb2.gif);
	background-repeat: no-repeat;
    background-size: contain;
}
.zui_3{
	width:24px;
	height:15px;
	position:absolute;
	top: 358px;
    left: 144px;
	background-image:url(../images/zb3.gif);
	background-repeat: no-repeat;
    background-size: contain;
}
.zui_4{
	width: 33px;
    height: 23px;
    position: absolute;
    top: 442px;
    left: 467px;
	background-image:url(../images/zb4.gif);
	background-repeat: no-repeat;
    background-size: contain;
}
.zui_5{
	width:27px;
	height:19px;
	position:absolute;
	top: 400px;
	left: 125px;
	background-image:url(../images/zb5.gif);
	background-repeat: no-repeat;
    background-size: contain;
}
.zui_6{
	width:26px;
	height:16px;
	position:absolute;
	top: 430px;
    left: 296px;
	background-image:url(../images/zb6.gif);
	background-repeat: no-repeat;
    background-size: contain;
}
.zui_zy{
	width:20px;
	height:12px;
	position:absolute;
	top: 410px;
	left: 158px;
	background-image:url(../images/zy.gif);
	background-repeat: no-repeat;
    background-size: contain;
}

/* debug */
#startBtn,
#title_div {
	display: ;
}
/** end debug**/

#speechBox_content {
	/* position: absolute;
	left: 13%; */
	width: 85%;
	padding-left: 1.5%;
}

#speechBox_content_w{
	display: table-cell;
	vertical-align: middle;
	height:52px;
}

#btn_1 {
	position: absolute;
}

@media screen and (max-width: 980px) {
	#title_div #startBtn{
		width:100%;
	}
	#startBtn {
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
	}
	
	#startBtn_img {
		width: 21%;
		position: absolute;
		top: 40%;
		right: 0;
		bottom: 0;
		left: 0;
		margin: auto;
	}
	#title_div{
		width:100%;
	}
	#play_biaoti{
		width:3.5%;
		top:4%;
		left:41%;
	}
	#zhishiju{
		width:90%;
		top:11%;
		left:7%;
		font-size: 22px;
	}
	#box{
		width:100%;
		height:100%;
	}
	#big_box{
		width:100%;
		height:100%;
	}
	#questionBox{
		width:61.4%;
	}
	
	#play_tishi{
		width:3.5%;
		top:10.5%;
		left:2%;
	}
	#speechBox_2{
		width: 50%;
		height: 12%;
	    top: 79%;
	    left: 8.5%;
	    font-size: 18px;
	}
	#des_container #d0{
		width: 50%;
		height: 12%;
		top: 79%;
		left: 8.7%;
	}
	
	#show_ansBox {
		top: 23.4%;
		left: 65.5%;
		width: 33.6%;
	}
	
	#questionBox {
		top: 23.4%;
	}
	
	#show_ansBox img {
		width: 100%;
	}
	
	#left_btn {
		top: 64.6%;
		left: 63.8%;
		width: 8%;
	}
	
	#right_btn {
		top: 64.6%;
		left: 93%;
		width: 8%;
	}
	
	#left_btn img,
	#right_btn img {
		width: 100%;
	}
	
	#speechBox {
		top: 25.3%;
		left: 9%;
		width: 49%;
		height: 8%;
	}
	
	#speechBox img {
		width: 100%;
	}
	
	#play_question {
		width: 7.5%;
		height: 76%;
	}
	
	#play_question img {
		width: 100%;
	}

	#play_question_1 {
	    float: left;
	    margin: 0;
	    background: url(../images/btn/v_1.png);
	    width: 28px;
	    height: 28px;
	    background-size: contain;
	    background-repeat: no-repeat;
	}
	
	#speechBox_content {
		font-size: 18px;
	}

	#speechBox_content {
		width: 87%;
		padding-left: 1.5%;
	}

	#speechBox_content_w{
		height: 100%;
	}
	
	.pic_0,
	.pic_1,
	.pic_2,
	.pic_3,
	.pic_4,
	.pic_5,
	.pic_6,
	.pic_7,
	.pic_8 {
		top: 25%;
		left: 66.5%;
		width: 32%;
	}
	
	.pic_0 img,
	.pic_1 img,
	.pic_2 img,
	.pic_3 img,
	.pic_4 img,
	.pic_5 img,
	.pic_6 img,
	.pic_7 img,
	.pic_8 img,
	#left_btn_q img,
	#right_btn_q img,
	#btn_1 img,
	#challenge_btn img {
		width: 100%;
	}
	
	#left_btn_q {
		width: 10.6%;
		top: 82.2%;
		left: 65.3%;
	}
	
	#right_btn_q {
		width: 10.6%;
		top: 82.2%;
		left: 76.5%;
	}
	
	#xuanXiang_btn {
		top: 62.5%;
		left: 89.8%;
		width: 3.5%;
	}
	
	.show_ifYou {
		width: 20.3%;
		top: 63.2%;
		left: 71.4%;
		font-size: 18px;
	}
	
	.src_cell {
		width: 24.5%;
		top: 65.1%;
		left: 70.4%;
		font-size: 18px;
	}
	
	#btn_1 {
		top: 82.2%;
		left: 87.6%;
		width: 5%;
	}
	
	#challenge_btn {
		top: 82.2%;
		left: 93.9%;
		width: 5%;
	}
	
	.zui_1 {
		top: 70.2%;
	    left: 30.5%;
	    width: 3%;
	}

	.zui_2 {
		top: 70.6%;
		left: 46.6%;
		width: 4%;
	}

	.zui_3 {
		top: 57.4%;
	    left: 15.4%;
	    width: 2.5%;
	}
	
	.zui_4 {
		top: 70.5%;
	    left: 48.5%;
	    width: 3.5%;
	} 

	.zui_5 {
		top: 64%;
		left: 13%;
		width: 3%;
	}

	.zui_6 {
		top: 67.6%;
	    left: 30.6%;
	    width: 3%;
	}
	
	.zui_zy {
		top: 64.6%;
		left: 16.1%;
		width: 3%;
	}
	
	#challenge {
		width: 100%;
		height: 100%;
	}
	
	#challenge img {
		width: 100%;
	}
	
	#challenge a img {
		width: 10%;
	}
	
	#dim_div {
		width: 100%;
		height: 100%;
	}
	
	#yesBtn {
		top: 50.3%;
		left: 36.7%;
	}
	
	#yesBtn img,
	#noBtn img {
		width: 10%
	}
	
	#noBtn {
		top: 50.3%;
		left: 52%;
	}
}