html {background:#fff;/*background:#c9d4ec;*/}
body {
/*
	width:96%;
	margin:5px auto;
	background:#fff;
*/
}
#container {
	width:100%;
	max-width:1024px;
/*	background:#fff;	*/
	padding-bottom:50px;
	margin:0px auto;
	font-size:16px;
}
/* logo */
.logo {
	width:100%;
	margin:0px auto;
	padding-top:10px;
	text-align:center;
}
.logo img{
	max-width:640px;
	width:95%;
}
/* login */
.loginBox {
	width:90%;
	margin:0px auto;
	padding-top:50px;
}
.stepBox {
	width:90%;
	margin:0px auto;
	padding-top:20px;
}

.top h2{
	width:80%;
	margin:10px auto 0px auto;
	font-size:18px;
	text-align:center;
}
.top .japan{
	text-align:  center;    /* 文字中央寄せ */
	padding:  50px;        /* 余白指定 */
	background: url("../img/common/japan.png") center center no-repeat;
}
.top .title{
	width:80%;
	margin:10px auto 0px auto;
	font-size:40px;
	color:#7399ec;
	text-align:center;
	font-weight:bold;
}

.top .image{
	width:50%;
	margin:0px auto 0px auto;
}
.top .image img{
	max-width:100%;
}


.page h2{
	width:100%;
    border-bottom:2px solid #7399ec;
	padding:5px 0 5px 10px;
	font-size:18px;
	color:#7399ec;
}

.prizeList .selecter {
	margin-top:10px;
}
.prizeList .selecter > ul:after{
  content: "";
  display: block;
  clear: both;
}
.prizeList .selecter > ul > li{
	width:30%;
	float:left;
	margin-left:5px;
	margin-right:5px;
	background:#000;
	color:#fff;
	text-align:center;
	padding:2px;
}

.prizeList .prize {
	margin-top:20px;
}
.prizeList .prize > ul > li:after{
  content: "";
  display: block;
  clear: both;
}
.prizeList .prize > ul > li .photo{
	width:40%;
	float:left;
}
.prizeList .prize > ul > li .photo img{
	max-width:100%;
}
.prizeList .prize > ul > li .comment{
	width:55%;
	float:left;
	padding-left:10px;
}

.prizeOne .text{
	margin:10px auto 0px auto;
	width:90%;
	text-align:left;
	line-height:160%;
}

.prizeOne .photo{
	margin:10px auto 0px auto;
	width:80%;
}
.prizeOne .photo img{
	max-width:100%;
}

.quizChallenge {
	width:90%;
	margin:0px auto;
	padding-top:50px;
	font-size:18px;
	text-align:center;
}

.quizChallenge .confirm {
	width:100%;
	min-height:40px;
	text-align: center;
	margin:10px auto;
	color:#ffff;
	background-color:#0000ff;
	border:0px solid #222;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
	-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
	justify-content: center; /* 横方向中央揃え */
	font-size:16px;
}

.quizChallenge .prize {
	margin-top:5px;
}
.quizChallenge .prize > ul > li:after{
  content: "";
  display: block;
  clear: both;
}
.quizChallenge .prize > ul > li .photo{
	width:40%;
	float:left;
}
.quizChallenge .prize > ul > li .photo img{
	max-width:100%;
}
.quizChallenge .prize > ul > li .comment{
	width:55%;
	float:left;
	padding-left:10px;
}

.quizOne .info{
	margin:0px auto 0px auto;
	padding-top:10px;
	width:90%;
	text-align:left;
	line-height:160%;
}

.quizOne .text{
	margin:10px auto 0px auto;
	width:90%;
	text-align:left;
	line-height:160%;
}

.quizOne .photo{
	margin:10px auto 0px auto;
	width:80%;
	text-align:center;
}
.quizOne .photo img{
	max-width:100%;
	max-height:300px;
}

.quizOne .ans{
	float:left;
	padding:5px;
	width:50%;
}

.quizOne .photoa{
	float:left;
	padding:5px;
	width:50%;
}
.quizOne .photoa img{
	max-width:100%;
	max-height:300px;
}

.quizOne .answer_button {
	width:90%;
	min-height:40px;
	text-align: center;
	margin:10px auto;
	color:#ffff;
	background-color:#ff7100;
	border:0px solid #222;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
	-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
	justify-content: center; /* 横方向中央揃え */
	border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px;
	font-size:16px;
}

.quizOne .bar {
	width:90%;
	min-height:40px;
	text-align: center;
	margin:10px auto;
	color:#ffff;
	background-color:red;
	border:0px solid #222;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
	-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
	justify-content: center; /* 横方向中央揃え */
	font-size:16px;
}
.quizOne .title {
	text-align: center;
}
.quizAnswer .box {
	margin:0 auto;
	width:200px;
	position:relative;
	padding-top:10px;
}
.quizAnswer .circle {
   position:absolute;
   top:20px;
   left:0;
   width: 200px;
   height: 200px;
  align-items: center;
  border-radius: 50%;
  flex-flow: column; 
  color: #000;
  border: 8px solid red;
  z-index:99;
  text-align: center;
  line-height: 200px;
  font-size: 40px;
}

.quizAnswer .textArea{
	margin-top:220px;
}
.quizAnswer .text{
	margin:10px auto 0px auto;
	width:90%;
	text-align:left;
	line-height:160%;
}
.quizAnswer .info{
	margin:0px auto 0px auto;
	padding-top:10px;
	width:90%;
	text-align:left;
	line-height:160%;
}


.userRegist h2{
	width:80%;
	margin:10px auto 0px auto;
	font-size:18px;
	text-align:center;
}

.prizeGet h2{
	width:80%;
	margin:10px auto 0px auto;
	font-size:18px;
	text-align:center;
}

.prizeGet .box{
	margin:10px auto 0px auto;
	width:80%;
	border:1px solid red;
}

.prizeGet .title{
	font-size:16px;
	color:#fff;
	background:red;
	height:30px;
	padding-top:5px;
	width:100%;
	text-align:center;
}

.prizeGet .info{
	margin-top:15px;
	padding-left:5px;
	font-size:16px;
	line-height:160%;
}

.prizeGet .prize {
	margin-top:20px;
}
.prizeGet .prize > ul > li:after{
  content: "";
  display: block;
  clear: both;
}
.prizeGet .prize > ul > li .photo{
	width:40%;
	float:left;
	padding-left:5px;
}
.prizeGet .prize > ul > li .photo img{
	max-width:100%;
}
.prizeGet .prize > ul > li .comment{
	width:55%;
	float:left;
	padding-left:10px;
}
.prizeGet .text{
	margin:10px auto 0px auto;
	width:90%;
	text-align:left;
	line-height:160%;
}

.prizeGet .qr{
	margin:10px auto 0px auto;
	width:100%;
	text-align:center;
}
.prizeGet .qr img{
	max-width:100%;
}

@media screen and (min-width:768px) and ( max-width:1024px) {
	/* for tablet */

}
@media screen and (min-width:1024px) {
	/* for PC */
}

/* ボタン関連 */
.button {
	width:90%;
	min-height:40px;
	text-align: center;
	margin:10px auto;
	color:#222;
	background-color:#d8d8d8;
	border:0px solid #222;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
	-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
	justify-content: center; /* 横方向中央揃え */
	border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px;
	font-size:16px;
}


@media screen and (min-width:1024px) {
	/* for PC */
	.button { width:220px; }
}



/* 色 */
.blue {
	color:#fff;
	background-color : #0000ff;
}
.sky {
	color:#fff;
	background-color : #7bb5f1;
}
.red {
	color:#fff;
	background-color : #ff0000;
}
.green {
	color:#fff;
	background-color : #318008;
}
.violet {
	color:#fff;
	background-color : #b6298b;
}
.orange {
	color:#fff;
	background-color : #ef3910;
}
.pink {
	color:#fff;
	background-color : #ea5da5;
}
.brown {
	color:#fff;
	background-color : #c36b11;
}
.gray {
	color:#fff;
	background-color : #4c4a49;
}
.white {
	color:#222;
	background-color : #e2e4e8;
}

.comment_btn{
	text-align:center;
}

.challenge_title {
	font-weight:bold;
}
.challenge_title2 {
	font-weight:bold;
}
.challenge_title3 {
	text-align:center;
	color:#ff0000;
	margin-top:10px;
}
.quiz_number {
	font-size:16px;
}
.result_point {
	font-size:28px;
}
.result_img {
	width:100%;
}
@media screen and (min-width:520px) {
	.photo_block {
		width:50%;
		float:left;
	}
	.question_block {
		width:50%;
		float:left;
	}
	.comment_btn{
		clear:both;
		width:50%;
		margin:0 auto;
		padding-top:30px;
	}
	.challenge_title {
		font-size:20px;
		padding: 10px 0;
	}
	.challenge_title2 {
		font-size:16px;
		font-weight:normal;
		padding: 10px 0;
	}
	.quizOne .text{
		font-size:18px;
	}
	.quiz_number {
		font-size:20px;
	}
	.result_level {
		color:#ff0000;
	}
	.result_point {
		font-size:32px;
	}
	.movieList_box {
		width:42%;
		margin: 0 auto;
	}
	.movieList_btn {
		width:100% !important;
	}
	.movieList_next {
		width:100% !important;
		float:right !important;
	}
	.movieList_next_space {
		margin-top:80px;
	}
	.movieList_next::after{
		content:"";
		clear:both;
		display:block;
	}
	.movieOne_next {
		width:42% !important;
	}
	/* add 231010 */
	#container {
		max-width:80%;
	}
	.quizOne .photo{
		width:100%;
	}
	.quizOne .photo img{
		max-height:300px;
	}
	.quizCount{
		text-align:center;
	}
	.movieList_title{
		text-align:center !important;
	}
	.quizOne .title {
		font-size:22px;
		margin-bottom:20px;
	}
	.quizOne .correct_next {
		margin-top:40px;
	}
	.quizOne .correct_ans {
		margin-top:40px;
		width:42%;
	}
	.result_img {
		width:70%;
	}


}
