@charset "utf-8";
/* CSS Document */
.page_all{
	display: none;
	position: relative;
}
.ans_div{
	margin:15px 0;
}
.ans_div .title{
	font-size: 18px;
	color:#000000;
}
.input_radius{
	width: 150px;
	background-color: #ffffff;
	border-radius: 10px;
	color:#969696;
	font-size: 18px;	
	padding:10px 10px 10px 39px;
	border: 1px solid #785d90;
	cursor: pointer;
}
.input_radius2{
	width: 250px;
	background-color: #ffffff;
	border-radius: 10px;
	color:#969696;
	font-size: 18px;	
	padding:10px 10px 10px 10px;
	border: 1px solid #785d90;
	cursor: pointer;
	margin: 10px 0 0 28px;
}
.input_border{
	position: relative;
	width: 156px;
	height:30px;
	border-bottom:1px #333333 solid; 
	display: inline-block;
	padding-top: 1px;
	margin-bottom:-8px;
	margin-top: 4px;
}
.input_border input{
	position: absolute;
	top:0;
	width: 151px;
	height:27px;
	z-index: 2;
	padding-left:5px;
	background:transparent
}
.input_border2{
	position: relative;
	width: 47px;
	height:30px;
	border-bottom:1px #333333 solid; 
	display: inline-block;
	padding-top: 1px;
	padding-left: 3px;
	margin-bottom:-8px;
	margin-top: 4px;
}
.input_border2 input{
	position: absolute;
	top:0;
	width: 47px;
	height:27px;
	z-index: 2;
	padding-left: 3px;
	background:transparent
}
.input_border3{
	position: relative;
	width: 27px;
	height:30px;
	border-bottom:1px #333333 solid; 
	display: inline-block;
	padding-top: 1px;
	margin-bottom:-8px;
	margin-top: 4px;
	padding-left: 3px;
}
.input_border3 input{
	position: absolute;
	top:0;
	width: 30px;
	height:27px;
	z-index: 2;
	background:transparent;
}
imp_text{
	color:#ffab40;
}
.radio{
	position: relative;
	width: 150px;
	background-color: #ffffff;
	border-radius: 10px;
	color:#969696;
	font-size: 18px;
	margin: 10px 0 0 28px;	
	padding:10px 10px 10px 39px;
	border: 1px solid #785d90;
	cursor: pointer;
}
.radio .img{
	position: absolute;
	top:15px;
	left:15px;
	width: 16px;
	height:16px;
	background-image: url(../img/option.png);
	background-size: 100%;
}
.radio.active{
	background-color: #785d90;
	color:#ffffff;
}
.radio.active .img{
	background-image: url(../img/option_active.png);
}
.checkbox{
	position: relative;
	width: 75px;
	background-color: #ffffff;
	border-radius: 10px;
	color:#969696;
	font-size: 14px;
	margin: 10px 1% 0 1%;	
	padding:10px 0px 10px 28px;
	border: 1px solid #785d90;
	cursor: pointer;
	display: inline-block;
	text-align: left;
}
.checkbox .img{
	position: absolute;
	top:13px;
	left:7px;
	width: 16px;
	height:16px;
	background-image: url(../img/checkbox.png);
	background-size: 100%;
}
.checkbox.active{
	background-color: #785d90;
	color:#ffffff;
}
.checkbox.active .img{
	background-image: url(../img/checkbox_active.png);
}
.checkbox2{
	position: relative;
	background-color: #ffffff;
	border-radius: 10px;
	color:#969696;
	font-size: 14px;
	margin: 10px 0 0 0;	
	padding:10px 9px 10px 28px;
	border: 1px solid #785d90;
	cursor: pointer;
	text-align: left;
}
.checkbox2 .img{
	position: absolute;
	top:13px;
	left:7px;
	width: 16px;
	height:16px;
	background-image: url(../img/checkbox.png);
	background-size: 100%;
}
.checkbox2.active{
	background-color: #785d90;
	color:#ffffff;
}
.checkbox2.active .img{
	background-image: url(../img/checkbox_active.png);
}
.tip{
	font-size: 12px;
	color:#ffab40;
	margin-top: 5px;
}
.e_tip{
	font-size: 12px;
	color:#ff0000;
	margin-top: 5px;
	display: none;
}
.button{
	position: absolute;
	bottom:0;
	width: 100%;
}

.jump_btn{
	background-color:#cccccc;
	color:#ffffff; 
	font-size: 18px;
	padding:6px 11px;
	border-radius:10px; 
	display: block;
}
.jump_btn.active{
	background-color:#434343; 
	cursor: pointer;
}
.jump_btn.next{
	float:right;
	margin:0 15px 30px 0;
}
.jump_btn.before{
	float:left;
	margin:0 0 30px 15px; 
}
.jump_btn.before_p3{
	float:left;
	margin:0 0 15px 15px; 
}
.button .page_num{
	position: absolute;
	width: 100px;
	left:50%;
	margin-left:-50px;
	font-size: 18px;
	color:#595959;
	top:7px;
	text-align: center;
}
.outer_div table{
	border-collapse: collapse;
	border-spacing: 0;	
	width: 100%;
}
.outer_div table .table_up td{
	text-align: center;
}
.table_up{
	font-size: 12px;
	color:#969696;
	line-height: 17px;
}
.table_border{
	width: 100%;
	height:3px;
	margin:10px 0; 
}
.p8_p14 .outer_div{
	margin:auto;
	max-width: 345px;
	width: 100%;
	margin-top: 20px;
}
.score_btn{
	background-color: #f3f3f3;
	font-size: 14px;
	margin:10px auto 20px auto;
	padding:3px 0;
	width: 55px;
	color:#595959;
	text-align: center;
	border-radius: 5px;
	cursor: pointer;
}
/*p1*/
.p1 .content{
	text-align: center;
	min-height: inherit;
	padding-bottom: 30px;
}
.p1 .p1_img1{
	width: 186px;
}
.p1 .p1_img2{
	max-width: 200px;
}
.p1 .p1_title1{
	color:#666666;
	font-weight: bold;
	font-size: 24px;
}
.p1 .p1_title2{
	color:#969696;
	font-weight: bold;
	font-size: 15px;
	margin:5px 0 15px 0;
}
.p1 .start_btn{
	background-color: #785d90;
	border-radius: 10px;
	color:#ffffff;
	font-size: 18px;
	text-align: center;
	/*width: 210px;*/
	width: 145px;
	padding:15px 0; 
	margin:21px auto;
	cursor: pointer; 
}
.p1 .text_div{
	text-align: left;
	font-size: 12px;
	color:#797979;
	margin: 0 auto;
	width: 100%;
	max-width:423px;  
	line-height: 25px !important;
}

.p1 .text_div .title{
	color:#19b0c7;
}
/*p2*/
.p2 .ans_div{
	margin:140px auto 0 auto !important;
	text-align: center !important;
}
.p2 .title{
	text-align: center !important;
	margin-bottom: 10px !important
}
/*p4*/
.date_btn{
	position: absolute;
	width: 20px;
	top:11px;
	right: 2px;
	z-index: 0;
}
/*p5*/
.p5 .outer_div{
	margin:auto;
	max-width: 345px;
	width: 100%;
	text-align: center;
	margin-top: 20px;
}
/*p6*/
.p6 .outer_div{
	margin:auto;
	max-width: 345px;
	width: 100%;
	text-align: center;
	margin-top: 20px;
}
/*p7*/
.p7{
	font-size: 18px;
}
.p7 .title{
	color:#19b0c7;
	margin-bottom: 20px;
}
.p7 .ans_div .no_img { 
	position:relative;
	margin: 10px 0 10px 22px;
}

.p7 .ans_div .no_img  span{
	position:absolute; 
	top:0; 
	left:-1.5em; 
}
.p7 .ans_div .no_img > .no_img{ 
	color:#ffab40;
}
/*p8*/
.p8 .header{
	background-color: #fbc830;
}
.p8 .table_border{
	background-color: #fbc830;
}

.p8 .score_btn{
	border: #fbc830 1px solid;
}
.p8 .score_btn.active{
	background-color: #fbc830;
	color:#ffffff;
}
/*p9*/
.p9 .header{
	background-color: #e74955;
}
.p9 .table_border{
	background-color: #e74955;
}
.p9 .score_btn{
	border: #e74955 1px solid;
}
.p9 .score_btn.active{
	background-color: #e74955;
	color:#ffffff;
}
/*p10*/
.p10 .header{
	background-color: #25a2b2;
}
.p10 .table_border{
	background-color: #25a2b2;
}
.p10 .score_btn{
	border: #25a2b2 1px solid;
}
.p10 .score_btn.active{
	background-color: #25a2b2;
	color:#ffffff;
}
/*p11*/
.p11 .header{
	background-color: #125288;
}
.p11 .table_border{
	background-color: #125288;
}
.p11 .score_btn{
	border: #125288 1px solid;
}
.p11 .score_btn.active{
	background-color: #125288;
	color:#ffffff;
}
/*p12*/
.p12 .header{
	background-color: #f2912a;
}
.p12 .table_border{
	background-color: #f2912a;
}
.p12 .score_btn{
	border: #f2912a 1px solid;
}
.p12 .score_btn.active{
	background-color: #f2912a;
	color:#ffffff;
}
/*p13*/
.p13 .header{
	background-color: #5ec6f2;
}
.p13 .table_border{
	background-color: #5ec6f2;
}
.p13 .score_btn{
	border: #5ec6f2 1px solid;
}
.p13 .score_btn.active{
	background-color: #5ec6f2;
	color:#ffffff;
}
/*p14*/
.p14 .header{
	background-color: #8cc120;
}
.p14 .table_border{
	background-color: #8cc120;
}
.p14 .score_btn{
	border: #8cc120 1px solid;
}
.p14 .score_btn.active{
	background-color: #8cc120;
	color:#ffffff;
}
/*p15*/
.p15 .header{
	background-color: #8e083e;
}
.p15 .table_border{
	background-color: #8e083e;
}
.p15 .score_btn{
	border: #8e083e 1px solid;
}
.p15 .score_btn.active{
	background-color: #8e083e;
	color:#ffffff;
}


.text_div.center{
	text-align: center !important;

}
.p1 .start_btn{
	margin:21px 5px; 
	float: none !important;
	display: inline-block;
	
}
@media screen and (max-width: 500px) {
.p1 .start_btn{
	font-size: 18px;
	width: 135px;
	padding:15px 0; 
	margin:21px 5px; 
	
}
}

.language_ans1 input[type="radio"],.language_ans2 input[type="radio"],.language_ans3 input[type="radio"],.language_ans4 input[type="radio"],.language_ans5 input[type="radio"]{
   font-size: 0;
   -webkit-border-radius: 0px;
    -webkit-appearance: none;  
    -moz-appearance: none;   
    appearance: none;
   border:0; 
   outline:none;
   width: 0;
   height: 0;
   padding:0;
   margin: 0 !important;
   display: block;
   border-radius: 0;
   position:fixed;

}

#personal_div input[type="checkbox"]{
   font-size: 0;
   -webkit-border-radius: 0px;
    -webkit-appearance: none;  /
    -moz-appearance: none;   
    appearance: none;
   border:0; 
   outline:none;
   width: 0;
   height: 0;
   padding:0;
   margin: 0 !important;
   display: block;
   border-radius: 0;
}
.p7 .content ,.p8 .content ,.p9 .content ,.p10 .content ,.p11 .content ,.p12 .content ,.p13 .content ,.p14 .content{
    padding: 20px 4% 120px 4%;
}
.p7 .button ,.p8 .button ,.p9 .button ,.p10 .button ,.p11 .button ,.p12 .button ,.p13 .button ,.p14 .button{
    bottom: 40px;
}
.cover_div{
	width: 100%;
	height:50px;
	overflow: hidden;
}

.bottom_border{
	background-color: #785d90;
	padding:12px 0;  
	color:#FFF;
	text-align:center;
}



