@charset "utf-8";
/****************************************
		一時適用 背景色 ここから

#header{
background-color:#5FABD0;
}
#header h1{
	background-color:#D8ACAC;
}
#gloNav{
	background-color:#39F;
}

li.MmenuList {
  background-color:#9E7C26;
}

		一時適用 背景色 ここまで
*****************************************/
/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 1em; line-height: 1; }
input[type="button"] {  -webkit-appearance: none; }
.fluid {
	clear: both;
	margin-left: 0;
	width: 100%;
	float: left;
	display: block;
}
.gridContainer {
	width: 100%;
	max-width: 1232px;
	margin-right:auto;
	clear: none;
	float: none;
	margin-left: auto;
}

/* =============================================================================
   スタイル
   ========================================================================== */
@media screen  {
	
/* 共通 */

html,body{height:100%;}

#container {
	 position: relative;
	 min-height: 100%; 
	width: 100%;
	height:100%;
	max-width: 1232px;
  color:#8C8C93;
  background-color:#fff;
  text-align:center;
  margin: 0 auto;
  padding: 0;
  border:0;
  font-family: verdana, メイリオ,"ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3", Osaka, 平成角ゴシック, arial, helvetica, sans-serif;
  font-size: 80%;
  
}

a {
  color:#8C8C93;
  text-decoration:none;
}

a:hover {
  color:#C30D21;
  text-decoration:underline;
}

img{
max-width: 100%;
height: auto;
width /***/:auto; /*IE8*/
border:none;
}


/* ヘッダー */
#header{
	width:100%;
	height:10%;
	min-height:2em;
	z-index:3;
	clear:both;
	position: relative;
}
#header h1 ,#gloNav {
	display:inline;
	line-height:1;
}
#header h1 {
	float:left;
	width:100%;
	margin:0;
	padding:0;
}
#foot_gloNav,#gloNav {
	float:left;
	width:100%;
	margin:0;
	padding:0;
	line-height:1;
}
.nav_contest{margin-right:10px;}

img#mButton{
	border-left:1px solid #8C8C93;
	max-height:1;
}
#foot_gloNav li,#gloNav li,#gloNav li img{
	vertical-align: middle;
	display: inline;
	line-height: 1.2;
}

#gloNav li img{
	height: 3%;
}
#foot_gloNavList,#gloNavList{
	margin:0;
	padding:0;
}
img.gloNavImg ,input.gloNavImg{
	vertical-align: middle;
}
.gNavActive{
	color:#C30D21;
}

/* コンテンツエリア */
#mainContents {
	clear:both;
	position:relative;
	margin:0;padding:0;
	width:100%;
	height:65%;
	max-height:65%;
    overflow-y: scroll;
    overflow-x: hidden;
	color:#333333;
	line-height:1.4;
	text-align:left;
	background-size:auto 100% ;
	background-position:right bottom;
	background-repeat:no-repeat;
	z-index:1;
}

#mainContents.index{
    overflow: hidden;
	background-size: 100% auto;
	background-position:right 50%;
	}

#mainContents.contest{
    overflow-y: scroll;
    overflow-x: hidden;
	-moz-background-size:100% 100%;
	background-size:100% 100%;
	}
#mainContents.myroom{
    overflow-y: scroll;
    overflow-x: hidden;


	}
		
#mainContentsInner{
	position:static;
	margin:6%;
	width:88%;
	height:auto;
}
#mainContentsInner.contest{
	margin:0;
	width:100%;
}

.newsContents {
	margin:0 -6% 4% 6%;
	}
.newsContents p{
	padding-right:12%;
	}



#mainContents a{
	width:20%;
}
#mainContents a:hover{
	color:#C30D23;
	text-decoration:underline;
}
#mainContents.news a{
	color:#C30D21;
	text-decoration:none;
}
#mainContents.news a:hover{
	color:#C30D21;
	text-decoration:underline;
}
#mainContents img{
vertical-align: bottom;
}
img.contest_rank_img{
	margin-top:20px;
	width:100%;
	height:auto;
}

/* 段落 */

#mainContents h1 {
	font-size: 120%;
	color:#333;
	line-height:1;
}
#mainContents h2{
	border-left:4px solid #C30D23;
	padding-left:5px;
}
#mainContents h4{
	border-left:4px solid #C30D23;
	border-bottom:1px solid #999;
	padding-left:4px;
}
#mainContents h5{
	border-left:4px solid #999;
	padding-left:4px;
}


/* フッター　メインメニュー */

#footer {
	width:100%;
	height:25%;
	padding-top:7px;
	margin:0 auto;
	background-image: url(../images/share/silhouette_1.png) ,url(../images/share/bg_menu.png);
	background-repeat: no-repeat,repeat-x;
	background-position:bottom right,top;
	background-size:contain,auto;
	z-index:2;
}
p.officialP{
	line-height:0.75;
	}
nav.MainMenu ul {
	width: 100%;
	display: table;
	table-layout: fixed;
	margin:0;
	padding:0;
}
nav.MainMenu ul li {
	display: table-cell;
	overflow: hidden;
	display: inline;
	margin: 0 2%;
	padding: 12px 0;
}
li.MmenuList {
	line-height:1;
  font-family: Arial,Lucida Sans , "HGPゴシックE";
  color:#C30D21;
  list-style-type:none;
}

li.MmenuList a:link ,li.MmenuList a:visited,.MmenuNotLink{
	text-decoration:none;
	color:#414144;
}
li.MmenuList a:hover ,li.MmenuList a:active,li.MmenuActive{
	text-decoration:underline;
	color:#C30D21;
}
.Fletter{
	color:#C30D21; /* 初めの文字だけ赤字に */
}
/* フッター　ログインエリア */
.LoginArea{
	text-align:center;
	border-bottom:1px solid #8C8C93;
	width:80%;}
#logoutdisp{
	margin:0 auto;}
.login_txt{
	width:18%;
	max-width:120px;
}
input#setFontSizeS1,input#setFontSizeS2{
    color:#8C8C93;
    }
/* フッター　グローバルナビ */
.foot_gloNav{
		text-align:center;}		
.navLeftSpace{
	margin-left:6px;
}
.navLeftBorder{
	margin-left:3px;
	padding-left:6px;
	border-left:1px solid #999;
}


/* 装飾 */
.center{
	text-align:center;
}
.right{
	text-align:right;
}
.textbold{
	font-weight:bold;
}

/****************************************
  各コンテンツページ
*****************************************/


/** コンテスト（クローズ） **/
#mainContents.contestClosed {
	background-color:#fff;
}
#mainContents.contestClosed p{
	display:block;
	text-align: center;
	height:100%;
	margin:0 auto;
}
#mainContents.contestClosed  img{
	height: 100%;
}

/** コンテストページ **/
#mainContents.contest,#mainContents.contest_kekka {
	height:100%;
width:100%;
	background-color:#333;
	}
#mainContents.contest {
	background-image:url(../images/sub/contest/bg_contest_ttl.png);
	}
.contestContents {
	width:100%;
	}
.contestContents img{
	display:inline-block;
}

.rank{
	height:80%;
	float:left;
	text-align:center;
}
#rank_prev,#rank_next{
	width:14%;
	height:100%;
	display:inline-block;
	float:left;
	border:0px;
	outline:none;
}
.rank_top,.rank_center,.rank_last{
	width:24%;
	height:100%;
	display:inline-block;
	float:left;
	text-align:center;
}
.rank_data_box{
	text-align:center;
	}
p.rank_link,p.rank_link a{
	margin:0;
	width:100%;
	height:100%;
	float:left;
	display:block;
	cursor: pointer;
}
#rank_prev{
	background:url(../images/sub/contest/btn_prev.png) no-repeat center center;
	background-size:contain;
}

#rank_next{
	background:url(../images/sub/contest/btn_next.png) no-repeat center center;
	background-size:contain;
}
#rank_prev.no_prev,#rank_next.no_next{
	background:none;
}

.rank_chara_box{
	width:80%;
	margin:0 auto;
	background:url(../images/sub/contest/bg_contest_light.png) ,url(../images/sub/contest/bg_contest_stage.png)  ;
	background-repeat: no-repeat,no-repeat;
	background-position: center top,center bottom;
	background-size:auto 100%,contain;
}
.rank_chara_box img{
	width:auto;
	height:auto;
}

.rank_vote_box_pc p{
	margin:3px;
}
.rank_chara img{

}
.rank_chara p,.rank_chara dl{
	margin:0; padding:0;
}
.rank dl{
	display:block;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}
dl.rank_data{
	background-color:#FFFFFF;
}
.rank_chara dl{
	margin-top:4px;
}
dl.rank_data{
	border-top:4px solid #F44268;
	min-height:2.8em;
	max-width:200px;
	border-bottom:2px solid #fff;
	padding-right:4px;
	}
dl.rank_data dt{
	clear:left;
	float:left;	
	color:#F44268;
	margin-top:1px;
	margin-right:4px;
	width:70px;
	border-right:1px solid #333;
	background-color:#fff;
}
dl.rank_data dd{
	padding-left:4px;
	text-align:left;
	border-left:1px solid #333;
	margin-top:2px;
	color:#333333;
	margin-left: 70px;
	background-color:#fff;
	min-height:6.5em;
	}
.rank_rank{
	font-size:120%;
	font-weight:bold;
}
.rank_name{
	font-weight:bold;
}
.rank_id{
	font-size:80%;
	}

/* 国旗 */
.flag_img{
	border:1px solid #000;
	margin-top:2px;
}
dl.usr_data_box img.flag_img{
	height:24px;
	width:37px;
}
dl.rank_data img.flag_img{
	height:33px;
	width:52px;
	margin-bottom:2px;
}

input[type="text"]{
  max-width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/* 投票ボタン */
input.btn_style1 { 
    font-size: 1.2em;
    font-weight: bold;
    padding: 3px 6%;    
    background-color: #F44268;	/* 背景色：ピンク */    
    color: #fff;	/* 文字色：白 */
    border-style: none;
    
    -moz-border-radius: 5px;	/* 角丸にする */
    -webkit-border-radius: 5px;	/* 角丸にする */
    border-radius: 5px;	/* 角丸にする */
	
    /* ボタンの影の指定
     * 影の横幅を2px
     * 縦長を2px
     * ぼかしを3px
     * 広がりを1px
     * 色を#666（グレー）に指定 */	
    box-shadow: 1px 2px 3px 1px #666;
    -moz-box-shadow: 1px 2px 3px 1px #666;
    -webkit-box-shadow: 1px 2px 3px 1px #666;
}

input.btn_style1b { 
    font-size: 1.2em;
    font-weight: bold;
    padding: 3px 6%;    
    background-color: #B4B4B4;	/* 背景色：ピンク */    
    color: #fff;	/* 文字色：白 */
    border-style: none;
    
    -moz-border-radius: 5px;	/* 角丸にする */
    -webkit-border-radius: 5px;	/* 角丸にする */
    border-radius: 5px;	/* 角丸にする */
	
    /* ボタンの影の指定
     * 影の横幅を2px
     * 縦長を2px
     * ぼかしを3px
     * 広がりを1px
     * 色を#666（グレー）に指定 */	
    box-shadow: 1px 2px 3px 1px #666;
    -moz-box-shadow: 1px 2px 3px 1px #666;
    -webkit-box-shadow: 1px 2px 3px 1px #666;
}


input.btn_style1:hover {
    
    background-color: #F8EF02;	/* 背景色：黄色 */    
    color: #4A4445;	/* 文字色：ピンク */
}
input.btn_style1b:hover {
    
    background-color: #B4B4B4;	/* 背景色：グレー */    
    color: #fff;	/* 文字色：白 */
}
.rest {
	color:#13E6F8;
}


/* ID検索フォーム */

#searchWord	{
	width: 12em;
	height: 1.6em;
	border: 1px solid #F44268;
	color:#666;
}
button.SearchIDBtn{
    background-color: #F44268;	/* 背景色：ピンク */    
    color: #fff;	/* 文字色：白 */
    border-style: none;
}
button.SearchIDBtn:hover {
    
    background-color: #666;	/* 背景色：グレー */    
    color: #F8EF02;	/* 文字色：黄色 */
}

/** News **/
p.date{
	font-size:90%;
	color:#8C8C93;
}
/** お問い合わせページ **/
.err{ 
	color:#C30D23;
}

/** MyRoom **/
.usr_data,.usr_img,.room_list{
	float:left;
	height:100%;
}
.usr_data{
	width:36%;


}
.usr_img{
	width:44%;
	text-align:center;
}
.usr_img img{
	height:100%;
	width:auto;
}

.room_list{
	width:20%;
	max-height:100%;
    overflow-y: scroll;
}
.usr_data_box{
	width:90%;
	margin:5%;
	background-color:#fff;
	opacity: 0.9;
}
.usr_data_box,input.btn_style3{
	max-width:260px;
}
.usr_data_box dl,.usr_data_box dt,.usr_data_box dd{
	margin:0; padding:0 10px;
}
.usr_data_box dt{
	font-size:120%;
	background-image:url(../images/sub/myroom/dt_bg.png);
	background-size:100% 100%;
	background-repeat:no-repeat;
}
.usr_data_box dd{
	margin:8px 0;
}

.usr_name{
	 font-size:130%;
	 font-weight:bold;
 }
.contest_title{
	color:#C30D32;
	display:block;
	margin-bottom:6px;
}
.rank_title{
	display:block;
	margin-bottom:6px;
	border-top:1px solid #333;
	line-height:1;
}
.usr_rank{
	display:block;
	font-size:260%;
	color:#C30D32;
	text-align:right;
	line-height:1;
	padding-bottom:6px;
}
/* 参加ボタン */
input.btn_style3 { 
    font-size: 110%;
    font-weight: bold;
    padding: 5px 0;    
    background-color: #333;	/* 背景色：グレー */    
    color: #fff;	/* 文字色：白 */
    border-style: none;
	margin-left:10px;
	margin-right:10px;
	width:90%;
    
	
    /* ボタンの影の指定
     * 影の横幅を2px
     * 縦長を2px
     * ぼかしを3px
     * 広がりを1px
     * 色を#666（グレー）に指定 	
    box-shadow: 1px 2px 3px 1px #666;
    -moz-box-shadow: 1px 2px 3px 1px #666;
    -webkit-box-shadow: 1px 2px 3px 1px #666;
	*/
}

input.btn_style3:hover {
    
    background-color: #C30D32;	/* 背景色：赤 */    
    color: #fff;	/* 文字色：白 */
}
/* 参加ボタン */

.entry_box{
	display:block;
	padding:6px 0;
	margin-bottom:6px;
	border-top:1px solid #333;
	line-height:1;
}

.entry_box p{
	margin:0;
	margin:5px 0;
}
input.btn_style4 { 
    font-size: 110%;
    font-weight: bold;
    padding: 10px 0;    
    background-color: #C30D32;	/* 背景色：グレー */    
    color: #fff;	/* 文字色：白 */
    border-style: none;
	margin-left:6px;
	margin-right:6px;
	width:90%;
	
}

input.btn_style4:hover {   
    background-color: #F8EF02;	/* 背景色：黄色 */    
    color: #4A4445;	/* 文字色：ピンク */
}
.red{
	color:#C30D23;
}
.contest_info{
	padding:0;
	margin-left:1em;
}
.room_list ul{
	list-style:none;
	margin:0;
	padding:0;
}
.room_list li {
	border:8px solid #333;
}
.room_list{
scrollbar-base-color: #C30D21;
scrollbar-track-color:#fff;
scrollbar-fase-color: #C30D21;
scrollbar-arrow-color:#fff;
}

/** 広告 **/
img.banner_index {
  position: absolute;
  bottom: 20px;
  left: 30px;
  padding:2px;
  border:1px solid #666;
  opacity:0.8;
  margin-right:10px;
  max-width:100%;
}
/** よくある質問 **/

.faq_ans p,h3.que{
	padding-left:20px;
	}
h3.que{
	background-image:url(../images/sub/info/que.gif);
	background-position:6px left;
	background-repeat:no-repeat;
	font-size:120%;
	font-weight:bold;
	color:#003674;
	}

p.ans{
	background-image:url(../images/sub/info/ans.gif);
	background-position:6px left;
	background-repeat:no-repeat;
	}
.faq_ans img{
	margin-right:5px;
	margin-bottom:5px;
}
.ansTable01 {
width: 100%;
border-collapse: collapse;
}
.ansTable01 th{
padding: 6px;
text-align: center;
color: #333;
background-color: #eee;
border: 1px solid #b9b9b9;
}
.ansTable01 td{
padding: 6px;
background-color: #fff;
border: 1px solid #b9b9b9;
}

.ansImg img{
width: 90%;
max-width:320px;
padding: 6px;
background-color: #fff;
border: 1px solid #b9b9b9;
}

img.img_middle{
	vertical-align:middle;
}
}
/****************************************
  フォントサイズ設定（メニュー・Myroom）
*****************************************/
@media screen and (min-width: 1px) and (max-width: 372px) {
/* メニュー */
ul#foot_gloNavList,ul#gloNavList{
	font-size:75%;
	}
li.MmenuList{
font-size:80%;
}
#logoutdisp{
font-size:40%;
}
/* MyRoom */
.usr_data{
	    font-size: 80%;
}
input.btn_style3,input.btn_style4 { 
    font-size: 80%;
    font-weight: nomal;
}

}
@media screen and (min-width: 373px) and (max-width: 479px) {
ul#foot_gloNavList,ul#gloNavList{
	font-size:75%;
	}
li.MmenuList{
font-size:100%;
}
#logoutdisp{
font-size:60%;
}
}
@media screen and (min-width: 480px) and (max-width: 767px) {
ul#foot_gloNavList,ul#gloNavList{
	font-size:100%;
	}
li.MmenuList{
font-size:140%;
}
}
@media screen and (min-width: 768px) {

li.MmenuList{
	font-size:180%;
}
}
@media screen and (orientation:landscape) and (max-width: 768px){/*横向き 768px以下*/
ul#foot_gloNavList,ul#gloNavList{
	font-size:75%;
	}
}
/****************************************
  画面サイズごとの設定
*****************************************/

/* 420px以下 */
@media screen and (min-width: 1px) and (max-width: 420px) {
input.gloNavImg{
	 /* 検索ボックスを非表示 */
	}
.rank_data dd{
font-size:80%;
}
.LoginSummary{display: none;
	}	


}
/* 767px以下（iPad・スマホ） */
@media screen and (min-width: 1px) and (max-width: 767px) {

#gloNav li img{
	width: auto;
	height: 2em;
	}

li.MmenuList{
overflow: hidden;
}
input.btn_style4 { 
 min-height:3em;
}
}
@media screen and (min-width: 768px) {
.rank,.rank_chara{
	height:100%;
}
.rank_chara img{
		width:auto;
		height:70%;
}
}
@media screen and (min-width: 959px) {

.LoginSummary{display: none;
	}

}
@media screen and (max-width: 959px) {

.LoginSummary{display: none;
	}



}

@media screen and (orientation:portrait) {/*縦向き*/
.pc_only{display:none;}
.rank_top,.rank_last{display:none;}
.rank_center{width:72%;}
/* ヘッダー */

#header{width:100%;
height:10%;
}
#header h1{
	height:50%;
	text-align:left;
	float:left;
	text-align:left;
}
#header h1 img#logo {
  margin-left:3%;
  vertical-align:bottom;
  height:50%;
}


#gloNav{
	width:100%;
height:50%;
	}
img.searchImg{
	  vertical-align:bottom;
	  }

.gNavItem {
	padding-right:1%;
}

/* コンテンツエリア */


#mainContents {
	width:100%;
	
	
}
#mainContents.sub {

	
}
#mainContents.contest {
height:100%;
}
#searchWord	{
	width: 6em;
}
#mainContents.news img{
	width:100%;
	height:auto;
}
#mainContents.myroom{

	-moz-background-size:100% 100%;
	background-size:100% 100%;
	}
.rank_chara_box{
	width:50%;
	float:left;
}
.rank_chara_box img{

}
.rank_data_box{
	width:50%;
	float:right;

}
.rank_vote_box{
	clear:both;
}

/* rank_data dl */
.rank dl{
	display:block;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	margin-top:25%;

}
dl.rank_data{
	background-color:#4D4D4D;

}
.rank_chara dl{
	margin-top:4px;
}
dl.rank_data{
	border-top:4px solid #F44268;
	min-height:2.8em;
	max-width:200px;
	border-bottom:2px solid #4D4D4D;
	padding-right:4px;
	}
dl.rank_data dt{
	text-align:left;
	clear:left;
	color:#F44268;
	margin-top:1px;
	margin-right:4px;
	border-right:1px solid #fff;
	width:100%;
}
dl.rank_data dd{
	clear:both;
	margin-left:0;
	text-align:left;
	margin-top:2px;
	color:#333333;
	border-left:1px solid #4D4D4D;
	background-color:#4D4D4D;
	}

.rank_rank{
	font-size:200%;
	font-weight:100;
}
.rank_name{
	font-weight:bold;
}
.rank_name,.rank_id,dl.rank_data dd{
	color:#fff;
}
	
/* フッター　メインメニュー */
#footer {
	width:100%;

}
}
@media screen and (min-width: 1px) and (max-width: 420px) and (orientation:portrait) { /* 縦向き 420px以下*/
#header h1 img#logo {
  max-height:50%;
}	
img.contest_rank_img{
	height:auto;}
.min_hidden{display:none;}
}
@media screen and (orientation:landscape) {/*横向き*/
.iPhone_only{display:none;}
#logNavList{padding-left:0;}
#header {width:98%;
height:9%;
padding-left:1%;
padding-right:1%;
margin:0 auto;
}
#header h1 {
  float: left;
  text-align: left;
  width:27%;
padding-top: 1%;
}
#logo{
  width:96%;
}
#gloNav {
	float:left;
  width: 73%;
  padding-top: 1%;
}
dl.rank_data dt{
	line-height:0.96;
}
.rank_chara{
	width:auto;
	float:left;
	padding-left:4px;
}
#mainContents.myroom{

	-moz-background-size:auto 100%;
	background-size:auto 100%;
	background-position:56% 50%;
	}
}
@media screen and (min-width: 480px) and (max-width: 767px)  and (orientation:landscape){
.rank,.rank_chara{
	height:100%;
}
.rank_chara img{
		width:auto;
		height:70%;
}
}
@media screen and (max-width: 767px) and (orientation:landscape) {/*横向き 767px以下*/


#gloNav li img{
	width:1;
	height:1;
	}
}



/* ==============================
   　背景（メインコンテンツ）
   ============================== */

/* HOME (PC)*/
@media screen  {
#mainContents.index{	
	background-image:url(../images/main_bg/bg_index_rosa_1230.png);
	background-color:#ADADB7;
}
}
/* HOME (縦向き) */
@media screen and (orientation:portrait){ 
#mainContents.index{
	background-image:url(../images/main_bg/bg_index_rosa_640.png); 
}
}
/* サブページ */
@media screen  {
.sub{
	background-color: #E6E6E9;
}
.contest{
	background-image:url(../images/sub/contest/bg_contest02.png);
}
.news{	
	background-image:url(../images/main_bg/bg-news_rosa.png);
}

}

/* ==============================
   　Youtube 埋め込み
   ============================== */
.youtube_box{
	max-width:760px;
}
.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
