@charset "utf-8";
/*******************************************************************************
 * Version 1.0 Release 2015.12.23;
 * Copyright 2015, "ryan"<ryan@dotmore.com.tw>. All rights reserved.
 ******************************************************************************/
/*推薦產品內容*/
.SurveyQaIntro{
	background: #fff;
	border: 1px solid #c1cace;
	-webkit-box-shadow: 0px 2px 2px rgba(69, 90, 100, .2);/*safari、chrome*/
	-moz-box-shadow: 0px 2px 2px rgba(69, 90, 100, .2);/*firefox*/
	box-shadow: 0px 2px 2px rgba(69, 90, 100, .2);
	position: relative;
	vertical-align: top;
	margin: 0 0 1.875em 0;/*30/16*/
}
/*圖片區*/
.SurveyQaIntro > .ImgBoxWrap{
	position: relative;
}
/*圖片*/
.SurveyQaIntro > .ImgBoxWrap > .ImgBox{
}
.SurveyQaIntro > .ImgBoxWrap > .ImgBox > img{
}
/*Q幣*/
.SurveyQaIntro > .ImgBoxWrap > .TagMoney{
	width: 52px;
	height: 52px;
	background: #ffc107;
	border: 1px solid #fff;
	color: #fff;
	-webkit-border-radius: 50%;/*safari、chrome*/
	-moz-border-radius: 50%;/*firefox*/
	border-radius: 50%;
	text-align: center;
	font-size: 0.875em;/*14/16*/
	padding: 6px 0;
	position: absolute;
	right: 15px;
	top: 15px;
	z-index: 1;
	display: none;
}
.SurveyQaIntro > .ImgBoxWrap > .TagMoney.Show{
	display: block;
}
/*Q幣-數字*/
.SurveyQaIntro > .ImgBoxWrap > .TagMoney > span{
	font-size: 1.28em;/*18/14*/
	display: block;
	line-height: 1;
}
.SurveyQaIntro > .ImgBoxWrap > .TagGift{
	width: 52px;
	height: 52px;
	background: #ffc107;
	border: 1px solid #fff;
	color: #fff;
	-webkit-border-radius: 50%;/*safari、chrome*/
	-moz-border-radius: 50%;/*firefox*/
	border-radius: 50%;
	text-align: center;
	padding: 10px 0;
	position: absolute;
	right: 15px;
	top: 15px;
	z-index: 1;
	display: none;
}
.SurveyQaIntro > .ImgBoxWrap > .TagGift.Show{
	display: block;
}
.SurveyQaIntro > .ImgBoxWrap > .TagGift > i{
	font-size: 26px;
}
/*資訊*/
.SurveyQaIntro > .Info{
	padding: 0 5.2% 0.9375em;/*15/16, 15/288*/
	/*position: relative;*/
}
/*案件名*/
.SurveyQaIntro > .Info > h1{
	font-size: 1.25em;/*20/16*/
	color: #455a64;
	line-height: 1.2;/*24/20*/
	margin: 0 -5.2%;/*8/20*/
	overflow: hidden;
	padding: 0.9375em 5.2%;
}
/*描述*/
.SurveyQaIntro > .Info > .Desc{
	margin: 0 -5.2% 20px;/*8/20*/
	padding: 0 5.2% 0.9375em;
	border-bottom:1px solid #e6f0f5;
}
/*mircodata(隱藏)*/
.SurveyQaIntro > .Info > .Location,
.SurveyQaIntro > .Info > .Offers{
	display: none;
}
/*答題區*/
.BoxSurveyPkReply{
	width: 100%;
	border: none;
}
/*答題區-標題*/
.BoxSurveyPkReply > .BoxTitle{
	display: none;
}
/*統一控制顯示與否*/
.SurveyQaWrap,
.SurveyQaResult,
.SurveyWinner{
	display: none;
}
.SurveyQaWrap.Show,
.SurveyQaResult.Show,
.SurveyWinner.Show{
	display: block;
}
/*問卷*/
.SurveyQaWrap{
	margin: 0 auto 0.625em;/*10/16*/
}
/*進度條*/
.SurveyQaWrap > .TargetBarWrap {
	padding: 0.75em 0;/*12px/16px 15px/320px*100*/
}
.SurveyQaWrap > .TargetBarWrap > .TargetBar {
}
/*進度條-文字*/
.SurveyQaWrap > .TargetBarWrap > .TargetBar > .TargetPrompt {
	font-size: 0.875em;/*14px/16px*/
	margin: 0 0 0.35em;/*5/14*/
}
/*進度條-醒目文字*/
.SurveyQaWrap > .TargetBarWrap > .TargetBar > .TargetPrompt > span{
	color: #00bcbe;
	margin: 0 5px;
}
/*進度條-進度條底*/
.SurveyQaWrap > .TargetBarWrap > .TargetBar > .Target {
	position: relative;
	height: 0.625em;/*10px/16px*/
	background:#cfd8dc;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	overflow: hidden;
	-webkit-transition: all .25s;
	-moz-transition: all .25s;
	transition: all .25s;
}
/*進度條-進度條-完成條*/
.SurveyQaWrap > .TargetBarWrap > .TargetBar > .Target > .TargetConnect {
	background:#45c8ab;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	/*-webkit-transition: background 450ms;*/
	/*transition: background 450ms;*/
	position: absolute;
	/*right: 0;*/
	top: 0;
	left: 0;
	bottom: 0;
}
/*題目*/
.SurveyQaWrap .BoxQa{
	width: 100%;
	border: none;
}
/*題目-標題*/
.SurveyQaWrap .BoxQa > .BoxTitle{
	display: none;
}
/*題目-內容*/
.SurveyQaWrap .BoxQa > .BoxBody{

}
/*題目-一項*/
.SurveyQaWrap .BoxQa > .BoxBody > .Row{
	background: #fff;
	border: 1px solid #d8e1e6;
	padding: 10px 10px 60px;
	overflow: hidden;
	display: none;
	min-height: 360px;
	position: relative;
}
/*題目-一項*/
.SurveyQaWrap .BoxQa > .BoxBody > .Row.Show{
	display: block;
}
/*題目-一項*/
.SurveyQaWrap .BoxQa > .BoxBody > .Row > label{
	font-size: 1.125em;/*18/16*/
	font-weight: bold;
	margin: 0.55em 0;/*10/18*/
	display: block;
}
/*題目-題號*/
.SurveyQaWrap .BoxQa > .BoxBody > .Row > label > span{

}
/*題目-填寫處*/
.SurveyQaWrap .BoxQa > .BoxBody > .Row > .FillIn{
}
/*題目-選項列表*/
.SurveyQaWrap .BoxQa > .BoxBody > .Row > .FillIn > .RadioBtn{
}

/*題目-按鈕區*/
.SurveyQaWrap .BoxQa > .BoxBody > .Row > .BtnBox{
	margin: 0;
	position: absolute;
	left: 10px;
	right: 10px;
	bottom: 0px;
}
.SurveyQaWrap .BoxQa > .BoxBody > .Row > .BtnBox.Half{
	margin: 0 -5px;
}
.SurveyQaWrap .BoxQa > .BoxBody > .Row > .BtnBox.Half > .Btn{
	width: 45.4%;
	margin: 0.625em 5px;
}
/*數據統計Wrap*/
.SurveyQaWrapResultWrap{
}
/*數據統計Wrap-頁籤*/
.SurveyQaWrapResultWrap > .Tab{
	display: -ms-flexbox;
	display: flex;
}
.SurveyQaWrapResultWrap > .Tab > li{
	width: 50%;
}
.SurveyWinner{
	margin-top: -0.875em;
}
/*問卷結果*/
.SurveyQaResult{

}
/*結果-一題*/
.SurveyQaResult > .BoxQa{
	width: 100%;
	background: #fff;
	border: 1px solid #d8e1e6;
	-webkit-box-shadow: 0px 1px 1px rgba(69, 90, 100, .1);/*safari、chrome*/
	-moz-box-shadow: 0px 1px 1px rgba(69, 90, 100, .1);/*firefox*/
	box-shadow: 0px 1px 1px rgba(69, 90, 100, .1);
	margin: 20px 0;/*14/16*/
	position: relative;
	padding: 15px;
}
.SurveyQaResult > .BoxQa:first-child{
	margin-top: 0;
}
/*結果-題目*/
.SurveyQaResult > .BoxQa > .BoxTitle{
	font-size: 1.125em;/*18/16*/
	color: #455a64;
	font-weight: bold;
	padding: 0.2em 0;/*5/18*/
	line-height: 1.2;
	margin: 5px 0;
}
/*結果-題目*/
.SurveyQaResult > .BoxQa > .BoxBody{

}
/*結果-圖表*/
.SurveyQaResult > .BoxQa > .BoxBody > .Chart{
	text-align: center;
	margin: 20px 0;
}
/*結果-圓餅文字列表*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList{
	overflow: hidden;
}
/*結果-圓餅文字列表-單項*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li{
	padding: 0 0 0 22px;
	margin: 10px 0;
	position: relative;
}
/*結果-圓餅文字列表-單項*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li > div{
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;
	margin: 0 10px 0 0;
	position: absolute;
	left: 0;
	top: 3px;
}
/*結果-圓餅文字列表-單項*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li:nth-child(1) > div{
	background: #fba30a;
}
/*結果-圓餅文字列表-單項*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li:nth-child(2) > div{
	background: #016b88;
}
/*結果-圓餅文字列表-單項*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li:nth-child(3) > div{
	background: #f55443;
}
/*結果-圓餅文字列表-單項*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li:nth-child(4) > div{
	background: #ffcc33;
}
/*結果-圓餅文字列表-單項*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li:nth-child(5) > div{
	background: #10a5ba;
}
/*結果-圓餅文字列表-單項*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li:nth-child(6) > div{
	background: #96bd2c;
}
/*結果-圓餅文字列表-單項*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li:nth-child(7) > div{
	background: #eb1c12;
}
/*結果-圓餅文字列表-單項*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li:nth-child(8) > div{
	background: #f543bc;
}
/*結果-圓餅文字列表-單項*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li:nth-child(9) > div{
	background: #588c08;
}
/*結果-圓餅文字列表-單項*/
.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li:nth-child(10) > div{
	background: #42d5ea;
}
/*結果-橫條圖-佔比文字*/
.SurveyQaResult > .BoxQa.ChartBar > .BoxBody > .ChartTips{
}
/*結果-橫條圖-佔比文字*/
.SurveyQaResult > .BoxQa.ChartBar > .BoxBody > .ChartTips:before{
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;
	margin: 0 10px 0 0;
	background: #fba30a;
}
/*得獎名單標題*/
.SurveyWinner > .Box.BoxHeader > .BoxTitle{
	display: none;
}
/*得獎名單*/
.PrizeList{

}
/*得獎名單-獎項*/
.PrizeList > .PrizeItem{
	margin: 0.625em 0;/*10/16*/
}
/*得獎名單-獎項名稱*/
.PrizeList > .PrizeItem > .PrizeTitle{
	font-size: 1.125em;/*18/16*/
	margin: 0.27em 0;/*5/18*/
}
/*得獎名單-得獎者列表*/
.PrizeList > .PrizeItem > .WinnerList{
	color: #869197;
}
/*得獎名單-得獎者列表-單項*/
.PrizeList > .PrizeItem > .WinnerList > li{
	font-size: 1.25em;/*20/16*/
	padding: 0 0 0 25px;
	position: relative;
	margin: 5px 0;
}
.PrizeList > .PrizeItem > .WinnerList > li > .Mail{
	display: block;
}
/*得獎名單-得獎者列表-單項*/
.PrizeList > .PrizeItem > .WinnerList > li > i{
	color: #ffc107;
	font-size: 20px;
	margin: 0 10px 0 0;
	position: absolute;
	left: 0;
	top: 6px;
}
/*fb區塊*/
.SurveyQaIntro > .ImgBoxWrap > .FbWrap{
	position: relative;

}
/*fb區塊*/
.SurveyQaIntro > .ImgBoxWrap > .FbWrap > .FbGood{
	width: 80px;
	position: absolute;
	right: 15px;
    bottom: 5px;
}
/*fb區塊-聯播廣告用*/
.SurveyQaIntro.EventAd > .ImgBoxWrap > .FbWrap > .FbGood{
}
/*活動辦法文字連結*/
.SurveyQaIntro > .ImgBoxWrap > .FbWrap > .LinkWay{
	display: none;
}
/*如果使用者之視窗寬度>=568px，將會再載入這裡的 CSS。*/
@media screen and (min-width: 568px) {
}
/*如果使用者之視窗寬度>=768px，將會再載入這裡的 CSS。*/
@media screen and (min-width: 768px) {
	/*推薦商品內容*/
	.SurveyQaIntro{
		overflow: hidden;
		padding: 30px;
	}
	/*圖片區*/
	.SurveyQaIntro > .ImgBoxWrap{
		width: 300px;/*355/646*/
		padding: 0;
		float: left;
	}
	/*圖片*/
	.SurveyQaIntro > .ImgBoxWrap > .ImgBox{
	}
	/*資訊*/
	.SurveyQaIntro > .Info{
		padding: 0 0 0 325px;/*376/268*/
	}
	/*案件名*/
	.SurveyQaIntro > .Info > h1{
		font-size: 2.5em;/*40/16*/
		margin: 0 0 0.2em;/*10/40*/
		padding: 0;
		border: none;
	}
	.SurveyQaIntro > .Info > .Desc {
	    margin: 0 0 10px;
	    padding: 0;
	    border-bottom: none;
	    max-height: 72px;
	    overflow: hidden;
	}
	/*進度條*/
	.SurveyQaWrap > .TargetBarWrap {
		padding: 1.125em 0;/*18px/16px*/
	}
	/*進度條-文字*/
	.SurveyQaWrap > .TargetBarWrap > .TargetBar > .TargetPrompt {
		font-size: 1em;/*14px/16px*/
	}
	/*題目-一項*/
	.SurveyQaWrap .BoxQa > .BoxBody > .Row{
		padding: 30px;
		min-height: 700px;
	}
	/*題目-一項*/
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > label{
		font-size: 1.875em;/*30/16*/
		font-weight: 300;
		margin: 0.23em 0 0.83em;/*25/30*/
		line-height: 1.3;
	}
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > .FillIn > .InputLg{
		width: 100%;
	}
	/*題目-填寫處*/
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > .FillIn > ul.RadioBtn > li{
		width: 100%;
		display: block;
	}
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > .FillIn > ul.RadioBtn > li > label{
		border: none;
		font-size: 1.25em;/*20/16*/
	}
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > .FillIn > ul.RadioBtn > li > input + label:before{
		top: 25px;
	}
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > .FillIn > ul.RadioBtn > li > input[type=radio] + label:after{
		top: 19px;
	}
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > .FillIn > ul.RadioBtn > li > input[type=checkbox] + label:after{
		top: 26px;
	}
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > .FillIn > ul.RadioBtn > li > input:checked + label{
		/*border: none;*/
	}
	/*選擇[其他]*/
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > .FillIn > ul.RadioBtn > li.RadioOther > input + label:before{
		top: 26px;
	}
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > .FillIn > ul.RadioBtn > li.RadioOther > input[type=radio] + label:after{
		top: 20px;
	}
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > .FillIn > ul.RadioBtn > li.RadioOther > input[type=checkbox] + label:after{
		top: 27px;
	}
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > .BtnBox.Half > .Btn{
		width: 190px;
	}
	/*頁籤*/
	.SurveyQaWrapResultWrap > .Tab > li{
		width: auto;
	}
	.SurveyQaResult{
	}
	/*結果-一題*/
	.SurveyQaResult > .BoxQa{
		margin: 1.875em 0;
		padding: 30px;
	}
	.SurveyQaResult > .BoxQa:first-child{
		margin-top: 0;
	}
	/*結果-題目*/
	.SurveyQaResult > .BoxQa > .BoxTitle{
		font-size: 1.375em;/*22/16*/
		font-weight: bold;
		padding: 0.2em 0;/*5/18*/
		margin: 10px 0;
	}
	/*結果-題目*/
	.SurveyQaResult > .BoxQa > .BoxBody{
		margin: 40px 0;
	}
	.SurveyQaResult > .BoxQa > .BoxBody:after{
		content: " ";
		display: block;
		clear: both;
		line-height: 0;
		height: 0;
		visibility: hidden;
	}
	/*結果-圖表*/
	.SurveyQaResult > .BoxQa > .BoxBody > .Chart{
		margin: 0;
		float: left;
		width: 320px;
	}
	/*結果-圓餅文字列表*/
	.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList{
		padding: 0 0 0 410px;
		overflow: visible;
	}
	/*結果-圓餅文字列表-單項*/
	.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li{
		width: 100%;
		float: none;
		margin: 10px 0;
		padding: 0 0 0 25px;
		font-size: 1.25em;/*20/16*/
		top: 4px;
	}
	/*結果-圓餅文字列表-單項*/
	.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li > div{
		width: 20px;
		height: 20px;
	}
	/*結果-橫條圖-佔比文字*/
	.SurveyQaResult > .BoxQa.ChartBar > .BoxBody > .ChartTips{
		padding: 0 0 0 450px;
		font-size: 1.25em;/*20/16*/
	}
	/*結果-橫條圖-佔比文字*/
	.SurveyQaResult > .BoxQa.ChartBar > .BoxBody > .ChartTips:before{
		width: 20px;
		height: 20px;
		margin: 0 15px -2px 0;
	}
	/*得獎名單-獎項名稱*/
	.PrizeList > .PrizeItem > .PrizeTitle{
		font-size: 1.75em;/*28/16*/
	}
	/*fb區塊*/
	.SurveyQaIntro > .ImgBoxWrap > .FbWrap{
		margin: 25px 0 0 0;
	}
	/*fb區塊*/
	.SurveyQaIntro > .ImgBoxWrap > .FbWrap > .FbGood{
		float: left;
		position: static;
	}
	/*活動辦法文字連結*/
	.SurveyQaIntro > .ImgBoxWrap > .FbWrap > .LinkWay{
		display: none;
		display: inline;
		float: right;
		color: #63bea9;
		cursor: pointer;
	}
}
/*如果使用者之視窗寬度>=1024px，將會再載入這裡的 CSS。*/
@media screen and (min-width: 1024px) {
	/*推薦商品內容*/
	.SurveyQaIntro{
		margin: 10px;
		margin: 0 auto 30px;
	}
	/*圖片區*/
	.SurveyQaIntro > .ImgBoxWrap{
		width: 320px;
	}
	/*資訊*/
	.SurveyQaIntro > .Info{
		padding: 0 0 0 350px;
	}
	/*題目-一項*/
	.SurveyQaWrap .BoxQa > .BoxBody > .Row{
		padding: 30px 30px 70px;
		min-height: 400px;
	}
	.SurveyQaWrap .BoxQa > .BoxBody > .Row > .BtnBox{
		bottom: 10px;
	}
	/*結果-圖表*/
	.SurveyQaResult > .BoxQa > .BoxBody > .Chart{
		margin: 0 0 0 50px;
	}
	/*結果-圓餅文字列表*/
	.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList{
		padding: 0 0 0 600px;
	}
	/*結果-圓餅文字列表-單項*/
	.SurveyQaResult > .BoxQa.ChartPie > .BoxBody > .PieList > li{
		width: 100%;
		float: none;
	}
	/*結果-橫條圖-佔比文字*/
	.SurveyQaResult > .BoxQa.ChartBar > .BoxBody > .ChartTips{
		padding: 0 0 0 600px;
	}
	/*得獎名單-得獎者列表-單項*/
	.PrizeList > .PrizeItem > .WinnerList > li{
		width: 49%;
		display: inline-block;
	}
}