#game.inside_content .content .full_area {
    width: 875px;
    margin: 0 auto;
    margin-top: 20px;
}

#game.inside_content .content .full_area button.btn-default{
	background: #00477b;
	font-size: 18px;
    padding: 10px;
    width: 200px;
}

#game.inside_content .content .full_area button.btn-back{
	background: #54585a;
	font-size: 18px;
    padding: 10px;
    width: 200px;
    margin-right: 20px;
}

#game.inside_content .content .full_area .image_banner {
    text-align: center;
}

#game.inside_content .content .full_area .image_banner img {
    max-width: 875px;
    height: auto;
    margin: 0 auto;
}

#game.inside_content .content .full_area .demand {
    text-align: center;
    color: #ed8b00;
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 20px;
}

#game.inside_content .content .full_area .form_border {
    border: 1px solid #d8d8d8;

    min-height: 300px;
}

#game.inside_content .content .full_area .form_border .txt {
	text-align:center; 
	color: #4d7aa7;
	line-height:300px;
	font-size:21px;
}

#game.inside_content .content .full_area .form_border .disclaimer_area .txt {
	line-height:1.2; text-align:left; font-size:13px; color:#54585a;
}

#game.inside_content .content .full_area .form_border .col-two{
    display: flex;
}

#game.inside_content .content .full_area .form_border .col-one .center{
	width:100%;
	padding:0;
}
#game.inside_content .content .full_area .form_border .col-one .center img {
    width: 100%;
}
#survey_info{ text-align:center;}
@media only screen and (max-width: 767px){
#survey_info{ padding:0 30px 20px 30px; }
#game.inside_content .content .full_area .form_border .col-one .center img {
	padding:20px 30px;
	box-sizing: border-box;
}
}

#game.inside_content .content .full_area .form_border .left {
    width: 50%;

}

#game.inside_content .content .full_area .form_border .left img {
    width: 100%;
}

#game.inside_content .content .full_area .form_border .center{
	 width: 100%;
    text-align: center;
    padding: 110px 5px;
	box-sizing: border-box;
}

#game.inside_content .content .full_area .form_border .center h3{
	color: #54585a;
}

#game.inside_content .content .full_area .form_border .right {
    width: 50%;
    text-align: center;
    padding: 110px 5px;
	box-sizing: border-box;
}

#game.inside_content .content .full_area .form_border .right h3{
	color: #54585a;
}

#game.inside_content .content .full_area .form_border .form-header{
	background-color: #fff;
	padding: 20px 30px;
}

#game.inside_content .content .full_area .form_border .form-header p.search button{ background:#00477b; color:#fff; padding:3px 10px;}

#game.inside_content .content .full_area .form_border .form-body{
	padding: 30px;
	background-color: #f7f7f7;
	overflow: hidden;
	border-top: 1px solid #d8d8d8;
}
#game.inside_content .content .full_area .form_border #result_area .form-body,
#game.inside_content .content .full_area#closed .form_border .form-body {
	background-color: #fff;
	border-top: none;
	text-align: center;
}


#game.inside_content .content .full_area .form_border .form-body .tl { font-size:24px; font-weight: bold;}
#game.inside_content .content .full_area .form_border .form-body .disclaimer_area{ font-size:14px;}
#game.inside_content .content .full_area .form_border .form-body .disclaimer_area a{ color:#54585a; text-decoration:underline;}

#game.inside_content .content .full_area .form_border .form-body .form-sm{
	width: 300px;
	display: block;
	margin: 0 auto;
}

#game.inside_content .content .full_area .form_border .form-body .information, 
#game.inside_content .content .full_area .form_border .form-body .verify_code{
	margin-bottom: 20px;
}

#game.inside_content .content .full_area .form_border .form-body .information label, 
#game.inside_content .content .full_area .form_border .form-body .verify_code label{
	display: block;
	margin-bottom: 10px;
}

#game.inside_content .content .full_area .form_border .form-body .information input[type="text"], 
#game.inside_content .content .full_area .form_border .form-body .information select,
#game.inside_content .content .full_area .form_border .form-body .information textarea,
#game.inside_content .content .full_area .form_border .form-body .verify_code input{
	border-radius: 5px;
	width: 100%;
	height: 40px;
}

#game.inside_content .content .full_area .form_border .form-body .fill{
	overflow: hidden;
}

#game.inside_content .content .full_area .form_border .form-body .fill a{
	margin-top: 50px;
	    float: left;
		color:#54585a;
}

#game.inside_content .content .full_area .form_border .form-body .fill img{
	display: block;
	margin-top: 10px;
	margin-right: 10px;
	float: left;
}

.col-three.que-title{
	color: #979898;
	font-size: 24px;
	font-weight: bold;
	/*padding-top: 40px;*/
}

.col-three.que-list{
	color: #979898;
	font-size: 24px;
	font-weight: bold;
	/*padding-top: 40px;*/
}

.col-three.que-list div{
	float: right;
	text-align: center;
	display: flex;
    align-items: center;
}

.col-three.que-list div small{
	display: block;
	font-size: 18px;
}

.col-three.que-list span{
	color: #00477b;
}

.form-body .question-area{
	
}

.form-body .question-area .row{
		display: flex;	
		margin-top: 20px;
}

.form-body .question{
	background-color: #fff;
	border-radius: 5px;
	padding: 15px;
	box-shadow: 0 0 5px #0000004d;
	color: #54585a;
	border:2px solid #ffffff;
	/*font-size: 20px;*/
}

.form-body .game-result {
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 5px #0000004d;
    color: #54585a;
    border: 2px solid #ffffff;
    width: 100%;
}

.form-body .game-result ul{
	display: flex;
}

.text-center{
	text-align: center;
}

.form-body .game-result ul li{
	width: 33.3333333%;
	text-align: center;
	border-right: 1px solid #ddd;
}

.form-body .game-result ul li:last-child{
	border-right: none;
}

.form-body .game-result ul li.rank span{
	font-size:20px;	
}

.form-body .game-result ul li div{
	font-size: 34px;
	color: #00477b;
	font-weight: bold;
	margin-bottom: 30px;
}

.form-body .game-result ul li div img{
	margin-right: 5px;
	vertical-align: bottom;
}

.form-body .question{
	width: 100%;

}

.form-body .question input{
	border-radius: 5px;
    width: 100%;
    height: 40px;
   	margin-top: 20px;
}


.form-body .two-col .question{
	width: 44%;
	margin-right: 3%;	
}

.form-body .two-col .question.input{ padding:6px 15px 6px 15px; display:flex; align-items:center;}
.form-body .two-col .question.input input{ margin-top:0; height:39px; /*font-size:20px;*/}

.form-body .question:nth-child(2){
	margin-right: 0;
}

.form-body .question.active{
	border:2px solid #00477b;	
}

#qa_area .form-footer {}

.form-footer{
	padding: 30px;
	border-top: 1px solid #d8d8d8;
}

.form-footer .row{ 
	display: flex;
    justify-content: space-between;
    align-items: center;
}

.form-footer:after{
	content: "";
	display:table;
	clear:both;
}
.form-footer a.back-btn{
	color: #55595b;
	font-size: 17px;
	background: url(/home/images/game-back.png) center left no-repeat;
		padding-left: 20px;
}

.form-footer a.next-btn{
	float: right;
	color: #00477b;
	padding-right: 20px;
	background: url(/home/images/game-next.png) center right no-repeat;
}

.form-header .row{
	overflow: hidden;
	display: flex;
    align-items: center;
}

.col-three{
	float: left;
    width: 33.333333%;
}


.timer-group {
  height: 10px;
  margin: 0 auto;
  position: relative;
  width: 100px;
}

.timer {
  border-radius: 50%;
  height: 50px;
  overflow: hidden;
  position: absolute;
  width: 50px;
}

.timer:after {
  background: #fff;
  border-radius: 50%;
  content: "";
  display: block;
  height: 80px;
  left: 10px;
  position: absolute;
  width: 80px;
  top: 10px;
}

.timer .hand {
  float: left;
  height: 100%;
  overflow: hidden;
  position: relative;
  width: 50%;
}

.timer .hand span {
  border: 50px solid #00477b;
  border-bottom-color: transparent;
  border-left-color: transparent;
  border-radius: 50%;
  display: block;
  height: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform: rotate(225deg);
  width: 0;
}

.timer .hand:first-child {
  transform: rotate(180deg);
}

.timer .hand span {
  animation-duration: 4s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

.timer .hand:first-child span {
  animation-name: spin1;
}

.timer .hand:last-child span {
  animation-name: spin2; 
}


.timer.minute {
      background: rgba(0, 0, 0, .2);
    height: 100px;
    width: 100px;
}

.timer.minute .hand span {
  animation-duration: 60s;
  border-top-color: #00477b;
  border-right-color: #00477b;
  border-width: 52px;
}

.timer.minute:after {
  height: 80px;
    left: 10px;
    width: 80px;
    top: 10px;
}

.timer.second {
  background: rgba(0, 0, 0, .2);
  height: 300px;
  left: 50px;
  width: 300px;
  top: 50px;
}

.timer.second .hand span {
  animation-duration: 1s;
  border-top-color: rgba(255, 255, 255, .15);
  border-right-color: rgba(255, 255, 255, .15);
  border-width: 150px;
}

.timer.second:after {
  height: 296px;
  left: 2px;
  width: 296px;
  top: 2px;
}

.face {
  left: 20px;
  position: absolute;
  text-align: center;
  top: 45px;
}

.face h2 {
  font-weight: 300; 
}

.face p {
    font-size: 24px;
    color: #00477b;
}

@keyframes spin1 {
  0% {
    transform: rotate(225deg);
  }
  50% {
    transform: rotate(225deg);
  }
  100% {
    transform: rotate(405deg);
  }
}

@keyframes spin2 {
  0% {
    transform: rotate(225deg);
  }
  50% {
    transform: rotate(405deg);
  }
  100% {
    transform: rotate(405deg);
  }
}

@media only screen and (max-width: 767px){
	#game.inside_content .content .full_area{
		width: 100%;
	}
	#game.inside_content .content .full_area{
		margin-top: 0;
	}
	#game.inside_content .content .full_area .form_border .col-two {
	    display: block;
	}
	#game.inside_content .content .full_area .form_border .left {
	    width: 100%;
	}
	#game.inside_content .content .full_area .form_border .right {
	    width: 100%;
	    padding: 20px 0;
	}
	
	#game.inside_content .content .full_area .form_border .center {
		width: 100%;
	    padding: 20px 0;
	}
	
	.form-body .question-area .row{
		display: block;
	}
	.form-body .two-col .question{
		margin-right: 0;
		margin-bottom: 20px;
		display: block;
		width: 90%;
	}
	.form-body .question {
	    width: 90%;
	}
	#game.inside_content .content .full_area .form_border .form-header{
		padding: 20px 30px;
	}
	.timer {
	     margin-left: 0; 
	     margin-top: 0;
	}
	.face{
		    top: 36px;
	}
	#game.inside_content .content .full_area button.btn-back, #game.inside_content .content .full_area button.btn-default{
		width: 140px;
	}
	.form-body .game-result ul li{
		width: 100%;
		display: block;
		float: inherit;
		border-right: none;
		border-bottom: 1px solid #ddd;
	}
	.form-body .game-result ul {
	   display: block;
	}
	.form-body .game-result ul li:last-child {
	    border-bottom: none;
	}
	#game.inside_content .content .full_area .form_border .form-body{
		    padding: 15px 30px;
	}
	#game.inside_content .content .full_area .form_border .form-header h2{
		font-size: 18px;
	}
	.form-body .game-result ul li div{
		margin-bottom: 20px;
	}

}