@charset "UTF-8";

.clearfix:after {
  content: "　";
  font-size:1px;  
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}


html,body{ height:100%; }

body{
	margin:0;
	line-height:1.5;
	background-image:url(../images/master_bg.jpg);
}


#content{
	background-image:url(../images/content_bg.jpg);
	width:800px;/*100%;*/
	max-width:800px;
	margin:0 auto;
	min-height:100%;
	padding-bottom:0px;
	position:relative;
}

#head{
	width:100%;
}

#snsapi{
	position:absolute;
	top:220px;
	right:30px;
}

#snsapi .api{
	float:left;
}

#snsapi iframe{
	width:100px !important;
	overflow:hidden;
}


.section{
	width:95%;
	border:1px #bbb solid;
	background-color:rgba(255,255,255,0.8);
	box-shadow:5px 5px 0px rgba(0,0,0,0.35);
	margin:20px auto;
	padding-top:3%;
	padding-bottom:3%;
	position:relative;
}

.section_body{
	width:92%;
	margin:0 auto;
}

#attention{
	width:90%;
	font-size:80%;
	color:#333;
	margin:20px auto;
	padding-top:3%;
	padding-bottom:3%;
}

#attention .item{
	margin-left:1em;
	text-indent:-1em;
}


#copyright{
	position:absolute;
	bottom:0;
	left:50%;
	margin-left:-183px;
}

/*-----Init-----*/

#parsing,
#result,
#pr{
	display:none;
}


/*-----INput----*/
#input .screenname{
	border:1px #aaa solid;
	font-size:190%;
	color:#ccc;
	width:78%;
	height:40px;
	float:left;
}

#input a#button_check{
	border:1px #aaa solid;
	width:20%;
	height:42px;
	background-image:url(../images/button_check_bg.jpg);
	text-align:center;
	margin-left:-1px;
	float:left;
}



/*----Parsing---*/
#parsing{
	text-align:center;
}


/*-----Result----*/
#result #result_p{
	height:49px;
	display:table-cell;
	font-size:170%;
}
#result #result_p img{
	vertical-align:-30%;
	margin-right:5px;
}

#result #percent{
	margin-top:20px;
	text-align:center;
}
#result #percent img{
	/*height:100px;*/
}

#result #button_tweet,
#result #message{
	display:block;
	width:100%;
	margin-top:10px;
}

#result #detail{
	width:98%;
	margin:0 auto;
	padding:1%;
	max-height:none;/*150px;*/
	font-size:90%;
	background-color:#CCC;
	border:1px #aaa solid;
	overflow-y:auto;
	overflow-x:hidden;
}

#result #detail b{
	font-size:120%;
}

#result #detail .list_check{
	vertical-align:-2px;
	margin-right:2px;
}


#result #alert{
	width:92%;
	margin:0 auto;
	color:#900;
	text-align:center;
	display:none;
}


/*------PR----*/
#pr #terence{
	position:absolute;
	top:-15px;
	right:30px;
	z-index:1;
}

#pr #banner{
	position:relative;
	z-index:2;
}


@media screen and (max-width:640px){
	#result #detail{
		max-height:none;
		overflow:hidden;
	}

}