@charset "utf-8";
/***********************************************************************
 @ filename         : QA.css
 @ author           : twin lin
 @ description      : 基本版型
 @ media            : screen
 @ modified         : 2015-6-19
**********************************************************************/
/************basic************/
body {margin:0; padding:0; background:#FFF; color:#FFF; text-align:center;}
html, body {
	color: #000;
	font-size:100%;
	font-family:Microsoft JhengHei, Arial, Helvetica, sans-serif, PMingLiU, "微軟正黑體","黑體";
	text-align: justify;
}
a {
	color: #313131;
	text-decoration: none;
}
a:hover {
	color: #313131;
	text-decoration: none;
}
/* 黑幕 */
div.black_face{
width:100%;
height:100%;
position:fixed;
background:#000;
filter:alpha(opacity=80);/* for IE */
opacity:.8;
-webkit-opacity:.8;
-moz-opacity:.8;
-o-opacity:.8;
}
/* 底 */
div.QA_back{
	width:990px;
	height:520px;
	position: absolute;
	top:50%;
	left:50%;
	margin-left:-495px;
	margin-top:-260px;
	background:url(../images/QA/QA_bg.png) 0 0 no-repeat;
}

div.fb_log{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
}
a.btn_fb_login{
	display:none;
	width: 126px;
	height: 32px;
	background: url(../images/QA/btn_fb_login.png) 0 0 no-repeat;
	top: 463px;
	left: 370px;
	}
a.btn_fb_login:hover{
	background: url(../images/QA/btn_fb_login_hover.png) 0 0 no-repeat;
	transform:scale(1,1);
	 -ms-transform:scale(1,1); 	/* IE 9 */
	 -moz-transform:scale(1,1);	/* Firefox */
	 -webkit-transform:scale(1,1);/* Safari 和 Chrome */
	 -o-transform:scale(1,1); 	/* Opera */
	}
a.btn_fb_out{
	width: 126px;
	height: 32px;
	background: url(../images/QA/btn_fb_out.png) 0 0 no-repeat;
	top: 29px;
	right: 157px;
	}
a.btn_fb_out:hover{
	background: url(../images/QA/btn_fb_out_hover.png) 0 0 no-repeat;
	 transform:scale(1,1);
	 -ms-transform:scale(1,1); 	/* IE 9 */
	 -moz-transform:scale(1,1);	/* Firefox */
	 -webkit-transform:scale(1,1);/* Safari 和 Chrome */
	 -o-transform:scale(1,1); 	/* Opera */
	}

/**** 測驗步驟 ****/
/* 開始頁 */
div.Question_page{
	/*background:url(../images/QA/start_bg.png) 0 0 no-repeat;
	background:url(../images/QA/Ans_bg.png) 0 0 no-repeat;*/
	width:100%;
	height:100%;
}
div.Question_page div.tc{
	width: 560px;
	height: 270px;
	position: absolute;
	top: 98px;
	left: 132px;
	background: url(../images/QA/tc.png) 0 0 no-repeat;
	}
div.Question_page img.tc_pic{
	position: absolute;
	top: 126px;
	left: 703px;
	}
div.Question_page a.btn_start{
	width: 344px;
	height: 106px;
	background: url(../images/QA/btn_start.gif) no-repeat 0 0;
	top: 355px;
	right: 391px;
	}
div.Question_page a.btn_start:hover{
	 background:url(../images/QA/btn_start_hover.png) no-repeat 0 0;
	 transform:scale(1.02,1.02);
	 -ms-transform:scale(1.02,1.02); 	/* IE 9 */
	 -moz-transform:scale(1.02,1.02);	/* Firefox */
	 -webkit-transform:scale(1.02,1.02);/* Safari 和 Chrome */
	 -o-transform:scale(1.02,1.02); 	/* Opera */
	}

/* 問題頁 */
div.Q_num{
	width: 137px;
	height: 26px;
	position: absolute;
	top: 110px;
	right: 110px;
	z-index:100;
	}
span.num{
	margin-left:35px;
	display:block;
	width:70px;
	height:23px;
	background:#a6907a;
	border-radius: 50px;
	-moz-border-radius: 50px; /* 老的 Firefox */	
	color:#FFF;
	text-align: center;
	letter-spacing:0.3em;
	font-size:18px;
	font-weight:200;
	padding-top:3px;
	}
a.arr_left{
	width: 26px;
	height: 26px;
	background: url(../images/QA/arr_left.png) no-repeat 0 0;
	top: 0;
	left: 0;
	}
a.arr_left:hover{
	background: url(../images/QA/arr_left_hover.png) no-repeat 0 0;
	}
a.arr_right{
	width: 26px;
	height: 26px;
	background: url(../images/QA/arr_right.png) no-repeat 0 0;
	top: 0;
	right: 0;
	}
a.arr_right:hover{
	background: url(../images/QA/arr_right_hover.png) no-repeat 0 0;
	}
/*圖片*/
div.Question_pic{
	position: absolute;
	top: 0px;
	left: 0px;
	width:528px;
	height:520px;
	}
img.QA_pic{
	position: absolute;
	top: 0px;
	left: -10px;
	}
/*題目*/
i.radio_icon {
  float: left;
  display: inline;
  width: 15px;
  height: 15px;
  background: url(../images/QA/radio_btn.png) 0 0 no-repeat;
  margin-top: 5px;
  margin-left: 5px;
/*  border:1px solid #000;*/
}
.selected  i.radio_icon{
	background-position:0  100%;
}
ul.Q_chooose{
	position: absolute;
	top: 205px;
	left: 65px;
	}
ul.Q_ch_6{
	top: 255px;
	}
ul.Q_chooose li{
	display: block;
	margin-bottom: 0px;
	padding: 4px 10px 6px;
	font-size:105%;
	letter-spacing:0.1em;
	/*border:1px solid #000;*/
	
}
ul.Q_chooose li span{
  float: left;
  display: block;
  margin-left:8px;
}
ul.Q_chooose li a{
	display:block;
	padding: 4px 10px 6px;
	 zoom:1; /*IE6, IE7*/
}
 /*clear float*/
ul.Q_chooose li a:before, ul.Q_chooose li a:after {
	  content: "";
	  display: table;
  }
ul.Q_chooose li a:after {
	  clear: both;
  }

 ul.Q_chooose li a:hover{
	background:#83d839;
	border-radius: 10px;
	-moz-border-radius: 10px; /* 老的 Firefox */	
	filter:alpha(opacity=70);/* for IE */
	opacity:.7;
	-webkit-opacity:.7;
	-moz-opacity:.7;
	-o-opacity:.7;
}
ul.Q_chooose li input{
	width:15px;
	height:15px;
	vertical-align:middle;
	margin-right:10px;
	visibility:hidden;
}
div.Question_frame{
	width:480px;
	height:520px;
	position: absolute;
	top:0;
	right:20px;
	/*border:1px solid #000;*/
	overflow:hidden;
		
}
/*div.Question_page div.QA_t{
	width:500px;
	height:520px;
	position: absolute;
	top:0;
	right:0;
	}*/
div.Question_list{
	width:3000px;
	height:520px;
	position: absolute;
	z-index: 99;
	left: 0;
}
div.Question_list div.QA_t{
	width:500px;
	height:520px;
	float:left;
	position:relative;
/*	border:1px solid #000;*/	
	}
div.Question_list div.Q_t1{
	background:url(../images/QA/Q1_an.png) no-repeat 0 0;		
	}
div.Question_list div.Q_t2{
	background:url(../images/QA/Q2_an.png) no-repeat 0 0;		
	}
div.Question_list div.Q_t3{
	background:url(../images/QA/Q3_an.png) no-repeat 0 0;		
	}
div.Question_list div.Q_t4{
	background:url(../images/QA/Q4_an.png) no-repeat 0 0;		
	}
div.Question_list div.Q_t5{
	background:url(../images/QA/Q5_an.png) no-repeat 0 0;		
	}
div.Question_list div.Q_t6{
	background:url(../images/QA/Q6_an.png) no-repeat 0 0;		
	}


 /*clear float*/
  .clear:before, .clear:after {
	  content: "";
	  display: table;
  }
  .clear:after {
	  clear: both;
  }
  .clear {
	  zoom:1; /*IE6, IE7*/
  }


/* 分析按鈕 */
a.btn_screen {
	width: 265px;
	height: 85px;
	background: url(../images/QA/btn_screen.gif) no-repeat 0 0;
	top: 415px;
	right: 120px;
    }
 a.btn_screen:hover {
        background:url(../images/QA/btn_screen_hover.png) no-repeat 0 0;
		transform:scale(1.02,1.02);
		-ms-transform:scale(1.02,1.02); 	/* IE 9 */
		-moz-transform:scale(1.02,1.02);	/* Firefox */
		-webkit-transform:scale(1.02,1.02);/* Safari 和 Chrome */
		-o-transform:scale(1.02,1.02); 	/* Opera */
		
    }

/* 結果頁 */
div.Question_page div.A_t{
	width:500px;
	height:520px;
	position: absolute;
	top:0;
	right:0;
	}
/* 菜單上 */
div.menu_show_top{
	width: 440px;
	height: 210px;
	position: absolute;
	top: 95px;
	left: 15px;
	}
div.menu_show_top img{
	position:absolute;
	top:0;
	left:0;
}
div.menu_show_top h3{
	color:#b48753;
	letter-spacing:0.1em;
	font-size:18px;
	font-weight:500;
	position:absolute;
	top:36px;
	left:225px;
}
div.menu_show_top p{
	text-align:left;
	width:200px;
	color:#2b2b2b;
	letter-spacing:0.1em;
	position:absolute;
	top:65px;
	left:225px;
	font-size:90%;	
}
/* 分享按鈕 */
a.btn_share_top {
	width: 135px;
	height: 40px;
	background: url(../images/QA/btn_share.gif) no-repeat 0 0;
	top: 130px;
	right: 80px;
    }
 a.btn_share_top:hover {
        background:url(../images/QA/btn_share_hover.png) no-repeat 0 0;
		transform:scale(1.02,1.02);
		-ms-transform:scale(1.02,1.02); 	/* IE 9 */
		-moz-transform:scale(1.02,1.02);	/* Firefox */
		-webkit-transform:scale(1.02,1.02);/* Safari 和 Chrome */
		-o-transform:scale(1.02,1.02); 	/* Opera */
	}

/* 菜單下 */
div.menu_show_down{
	width: 440px;
	height: 210px;
	position: absolute;
	bottom: 30px;
	left: 14px;
	}
div.menu_show_down img{
	position:absolute;
	top:0;
	right:0;
}
div.menu_show_down h3{
	color: #b48753;
	letter-spacing: 0.1em;
	font-size: 18px;
	font-weight: 500;
	position: absolute;
	top: 40px;
	right: 225px;
}
div.menu_show_down p{
	text-align: right;
	width: 200px;
	color: #2b2b2b;
	letter-spacing: 0.1em;
	position: absolute;
	top: 68px;
	right: 225px;
	font-size: 90%;
}

div.menu_show_top h3 a,div.menu_show_down h3 a{
	color:#b48753;
}
div.menu_show_top h3 a:hover,div.menu_show_down h3 a:hover{
	color: #BF996F;
}

/* 分享按鈕 */
a.btn_share_down {
	width: 135px;
	height: 40px;
	background: url(../images/QA/btn_share.gif) no-repeat 0 0;
	top: 135px;
	right: 220px;
    }
 a.btn_share_down:hover {
        background:url(../images/QA/btn_share_hover.png) no-repeat 0 0;
		transform:scale(1.02,1.02);
		-ms-transform:scale(1.02,1.02); 	/* IE 9 */
		-moz-transform:scale(1.02,1.02);	/* Firefox */
		-webkit-transform:scale(1.02,1.02);/* Safari 和 Chrome */
		-o-transform:scale(1.02,1.02); 	/* Opera */
	}

/* 重玩按鈕 */
a.btn_again {
	width: 170px;
	height: 80px;
	background: url(../images/QA/btn_again.png) no-repeat 0 0;
	top: 411px;
	right: 637px;
    }
 a.btn_again:hover {
        background:url(../images/QA/btn_again_hover.png) no-repeat 0 0;
		transform:scale(1.02,1.02);
		-ms-transform:scale(1.02,1.02); 	/* IE 9 */
		-moz-transform:scale(1.02,1.02);	/* Firefox */
		-webkit-transform:scale(1.02,1.02);/* Safari 和 Chrome */
		-o-transform:scale(1.02,1.02); 	/* Opera */
		
    }


/**** 關閉按鈕 ****/
/*a.btn_close {
	width: 70px;
	height: 85px;
	background: url(../images/QA/btn_close.png) no-repeat 0 0;
	top: -40px;
	right: 25px;
    }
 a.btn_close:hover {
        background:url(../images/QA/btn_close_hover.png) no-repeat 0 0;
		
    }*/

/**** 按鈕reset ****/
a.btn_reset {
	position: absolute;
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	z-index: 9999;
	text-indent:-200em;
	overflow:hidden;
    }
 a.btn_reset:hover {
		transform:scale(1.05,1.05);
		-ms-transform:scale(1.05,1.05); 	/* IE 9 */
		-moz-transform:scale(1.05,1.05);	/* Firefox */
		-webkit-transform:scale(1.05,1.05);/* Safari 和 Chrome */
		-o-transform:scale(1.05,1.05); 	/* Opera */
		
    }