@charset "utf-8";
@media screen and (max-width: 780px){
/* 共通ヘッダー用 */
body{ background:none;overflow:hidden; }
#header, #cm_header{ width:100%; height:auto; }
#globalNavi li form{ width:100%; }
#searchtext{ width:80%; }
#sitelogo, #cm_sitelogo{ float:none; width:30%; height:auto; margin-bottom:10px; }
#sitelogo img{ padding-top:10px; margin:0; }
#topbanner{ display:none; }
#globalNavi ul{ width:100%; height:auto; position:inherit; padding:0; }
#globalNavi li{ height:auto; float:none; background:#000; border-bottom:1px solid #484848; }
#globalNavi li:hover{ background-color:#353535; }
#wrapper{ width:100%; padding:0; }
#globalNavi li a { text-indent:0; overflow:inherit; background:none; width:auto; }
#content{ background:none; }
#floatingbar { display: none; }

/* sp */
.pc { display: none; }
.sp { display: block !important; }

#headBlock {
	position:relative;
	padding: 6.5% 0 0 0;
	background-size: 100% auto;
	background-repeat: repeat-y;
}
#headBlock h1 {
	width: 60%;
	height: auto;
	margin: 0 auto 7% auto;
	position: relative;
	background-size: 100% auto !important;
	background: url(/common/special/award/2014/img/index_ttl_mainVisual.gif) left top no-repeat;
}

	#headBlock h1 span {
			position: absolute;
			top:0;
			left:0;
			width: 100%;
			height: 100%;
			display: block;
			text-indent: -9999px;
	}
	#headBlock h1:before {
		content: "";
		display: block;
		padding-top: 63.18%;
	}
#headBlock .linkBtn {
	width: 96%;
	padding: 2%;
	position: static;
	margin: 0;
	background: #ced3da;
}
	#headBlock .linkBtn .btn01 {
		width: 49%;
		height: auto;
		position: relative;
	}
		#headBlock .linkBtn .btn01 a {
			background: url(/common/special/award/2014/img/index_btn_mainVisual_chart_sp.gif) left top no-repeat;
			background-size: 100%;
		}
	#headBlock .linkBtn .btn02 {
		width: 49%;
		height: auto;
		position: relative;
	}
		#headBlock .linkBtn .btn02 a {
			background: url(/common/special/award/2014/img/index_btn_mainVisual_vote_sp.gif) left top no-repeat;
			background-size: 100%;
		}
	#headBlock .linkBtn .btn:before {
		content: "";
		display: block;
		padding-top: 81.96%;
	}
	#headBlock .linkBtn .btn a {
		position: absolute;
		top:0;
		left:0;
		width: 100%;
		height: 100%;
		display: block;
	}

	/* menu */
	#headBlock #menu {
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 999;
	}
		#headBlock #menu #menuBtn {
			width: 45px;
			height: 45px;
			float: right;
			margin-top: 20px;
			margin-right: 2%;
			position: relative;
		}
			#headBlock #menu #menuBtn a {
				width: 100%;
				height: 100%;
				position: absolute;
				top:0;
				left:0;
				display: block;
				text-indent: -9999px;
				background-size: 45px 45px !important;
			}
			#headBlock #menu #menuBtn a.btn_open {
				background: url(/common/special/award/2014/img/index_btn_menu_sp.gif) left top no-repeat;
			}
			#headBlock #menu #menuBtn a.btn_close {
				background: url(/common/special/award/2014/img/index_btn_close_sp.gif) left top no-repeat;
			}
		#headBlock #menu .menuInner {
			width: 96%;
			height: 100%;
			display: none;
			padding: 74px 2% 0 2%;
			background: rgba(255,255,255,0.8);
		}
		#headBlock #menu ul {
			width: 100%;
			padding-top: 9px;
			background: url(/common/special/award/2014/img/index_bg_menu_sp.png) 96% top no-repeat;
			background-size: 12px 9px;
		}
			#headBlock #menu li {
				width: 100% !important;
				float:none;
				margin:0;
				background:none;
			}
			#headBlock #menu li.menu01 {
				border-top: 6px solid #ced3da;
			}
			#headBlock #menu .menu01:before, .menu01:after {
				padding-top: 10px;
			}
			#headBlock #menu li a {
				width: 100% !important;
				-wibkit-box-sizing: border-box;
				-moz-box-sizing: border-box;
				box-sizing: border-box;
				height:50px;
				line-height: 50px;
				display:block;
				color: #fff;
				font-size: 24px;
				text-shadow: none;
				padding: 0 3.2%;
				font-family: Helvetica NeueUI, Helvetica, "Trebuchet MS", Arial, sans-serif;
				overflow:hidden;
				position: relative;
			}
			#headBlock #menu li a:after {
				position: absolute;
				top: 50%;
				right: 3.2%;
				display: block;
				content: '';
				width: 8px;
				height: 8px;
				margin-top: -4px;
				border-top: 3px solid #fff;
				border-right: 3px solid #fff;
				-webkit-transform: rotate(135deg);
				transform: rotate(135deg);
			}
			#headBlock #menu li a.btn_about{ background: url(/common/special/award/2014/img/index_nav_about_sp.gif) 15px 50% no-repeat #f58500; background-size: 81px 18px; }
			#headBlock #menu li a.btn_chart{ background: url(/common/special/award/2014/img/index_nav_chart_sp.gif) 15px 50% no-repeat #1797d4; background-size: 79px 18px; }
			#headBlock #menu li a.btn_vote{ background: url(/common/special/award/2014/img/index_nav_vote_sp.gif) 15px 50% no-repeat #f7c600; background-size: 60px 18px; }
			#headBlock #menu li a.btn_commentary{ background: url(/common/special/award/2014/img/index_nav_crtCommentary_sp.gif) 15px 50% no-repeat #e60027; background-size: 254px 18px; }
			#headBlock #menu li a.btn_archive{ background: url(/common/special/award/2014/img/index_nav_archive_sp.gif) 15px 50% no-repeat #00a33b; background-size: 100px 18px; }

/* maincontent */
#maincontent {
	padding-bottom: 35px;
}
#maincontent .section {
	padding: 2% 0 3.4% 0;
}

#maincontent .inBox {
	width: 96%;
	margin: 0 2%;
	padding: 0 0 3% 0;
	background: #fcfcfc;
}
	#maincontent .inBox h2 {
		width: 100%;
		height: auto;
		position: relative;
		background-size: 100% auto !important;
	}
	#maincontent .inBox h2:before {
		content: "";
		display: block;
		padding-top: 19.19%;
	}
		#maincontent .inBox h2 span {
				position: absolute;
				top:0;
				left:0;
				width: 100%;
				height: 100%;
				display: block;
				text-indent: -9999px;
		}

#maincontent .txtBox {
	width: 93.5%;
	margin: 0 auto;
}

#maincontent .btn_entry {
	width: 100%;
	height: auto;
	margin: 6% auto 0 auto;
	/*background: url(/common/special/award/2014/img/index_btn_about01_sp.gif) left top no-repeat;*/
	background: url(/common/special/award/2014/img/index_btn_about01_sp_end.gif) left top no-repeat;
	background-size: 100% auto;
	position: relative;
}
#maincontent .btn_entry:before {
	content: "";
	display: block;
	padding-top: 12.06%;
}
		#maincontent .btn_entry a {
		position: absolute;
		top:0;
		left:0;
		width: 100%;
		height: 100%;
		display: block;
		text-indent: -9999px;
	}

#maincontent .pageTop {
	position: absolute;
	right: 2%;
	bottom: 8px;
	text-align: center;
}
	#maincontent .pageTop a {
		padding-left: 18px;
		line-height: 1;
		color: #424040;
		background: url(/common/special/award/2014/img/index_btn_pageTop_sp.gif) left center no-repeat;
		background-size: 10px 12px;
	}

#maincontent .bgImg_sp span,
#maincontent .bgImg_sp a {
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	display: block;
	text-indent: -9999px;
}

/* VOTE
========================================================= */
#vote .inBox h2 {
	background: url(/common/special/award/2014/img/index_ttl_vote_sp.gif) left top no-repeat;
}
#vote .inBox .area01 {
	width: 93.5%;
	padding-bottom: 5%;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
#vote .inBox .area01 .btn_entry {
	width: 93.5%;
	margin: 0 auto;
}

/* ABOUT
========================================================= */
#about .inBox h2 {
	background: url(/common/special/award/2014/img/index_ttl_about_sp.gif) left top no-repeat;
}
#about .inBox .txtRead {
	width: 93.5%;
	height: auto;
	margin: 0 auto 4.6% auto;
	background: url(/common/special/award/2014/img/index_txt_about01_sp.gif) left top no-repeat;
	background-size: 100% auto;
	position: relative;
}
#about .inBox .txtRead:before {
	content: "";
	display: block;
	padding-top: 25%;
}
#about .inBox .txtRead span {
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	display: block;
	text-indent: -9999px;
}
	#about .inBox .rowBlock {
			width: 93.5%;
			margin: 0 auto;
	}
		#about .inBox .rowBlock dl {
			width: 100%;
			float: none !important;
		}
			#about .inBox .rowBlock dl dt {
				width: 100%;
				height: auto;
				margin-bottom: 3%;
				position: relative;
				background-size: 100% auto !important;
			}
				#about .inBox .rowBlock dl dt:before {
					content: "";
					display: block;
					padding-top: 13%;
				}
				#about .inBox .rowBlock dl dt span {
					position: absolute;
					top:0;
					left:0;
					width: 100%;
					height: 100%;
					display: block;
				}
			#about .inBox .rowBlock dl dd {
				width: 100%;
				margin:0;
				padding:0;
			}
			#about .inBox .rowBlock .boxL dt {
				background: url(/common/special/award/2014/img/index_txt_about02.gif) left top no-repeat;
			}
			#about .inBox .rowBlock .boxR dt {
				background: url(/common/special/award/2014/img/index_txt_about03.gif) left top no-repeat;
			}
			#about .inBox .rowBlock .boxL dd {
				margin-bottom: 3%;
			}
		/* banner */
		#about .inBox .rowBlock .bnr {
			clear: both;
			width: 100%;
		}
		#about .inBox .rowBlock .bnr > li {
			float: none !important;
			width: 100%;
			height: auto;
			position: relative;
			margin-bottom: 4%;
		}
		#about .inBox .rowBlock .bnr > li:before {
			content: "";
			display: block;
			padding-top: 12.8%;
		}
		#about .inBox .rowBlock .bnr li.bnr01 {
			margin-top: 4%;
			background: url(/common/special/award/2014/img/index_bnr_about01_sp.gif) left top no-repeat;
			background-size: 100% auto;
		}
		#about .inBox .rowBlock .bnr li.bnr02 {
			background: url(/common/special/award/2014/img/index_bnr_about02_sp.gif) left top no-repeat;
			background-size: 100% auto;
			margin-bottom: 8%;
		}
		#about .inBox .rowBlock .bnr li.bnr03 {
			margin-top: 7%;
			background: url(/common/special/award/2014/img/index_bnr_about03_sp.gif) left top no-repeat;
			background-size: 100% auto;
		}
		#about .inBox .rowBlock .bnr li a {
			position: absolute;
			top:0;
			left:0;
			width: 100%;
			height: 100%;
			display: block;
			text-indent: -9999px;
		}

/* CHART
========================================================= */
#chart .inBox h2 {
	background: url(/common/special/award/2014/img/index_ttl_chart_sp.gif) left top no-repeat;
}
	#chart .inBox .txtRead {
		width: 93.5%;
		height: auto;
		margin: 0 auto 4.6% auto;
		background: url(/common/special/award/2014/img/index_txt_chart01_sp.gif) left top no-repeat;
		background-size: 100% auto;
		position: relative;
	}
	#chart .inBox .txtRead:before {
		content: "";
		display: block;
		padding-top: 18.44%;
	}
		#chart .inBox .txtRead span {
			position: absolute;
			top:0;
			left:0;
			width: 100%;
			height: 100%;
			display: block;
			text-indent: -9999px;
		}
	#chart .inBox .iconList {
		width: 100%;
		margin: 0 auto 6% auto;
	}
		#chart .inBox .iconList li {
			width: 50%;
			position: relative;
		}
		#chart .inBox .iconList li:before {
			content: "";
			display: block;
			padding-top: 96.89%;
		}
			#chart .inBox .iconList li span {
				position: absolute;
				top:0;
				left:0;
				width: 100%;
				height: 100%;
				display: block;
			}
			#chart .inBox .iconList li.icon01 {
				background: url(/common/special/award/2014/img/index_img_chart_icon01_sp.gif) left top no-repeat;
				background-size: 100% auto;
			}
			#chart .inBox .iconList li.icon02 {
				background: url(/common/special/award/2014/img/index_img_chart_icon02_sp.gif) left top no-repeat;
				background-size: 100% auto;
			}
			#chart .inBox .iconList li.icon03 {
				background: url(/common/special/award/2014/img/index_img_chart_icon03_sp.gif) left top no-repeat;
				background-size: 100% auto;
			}
			#chart .inBox .iconList li.icon04 {
				background: url(/common/special/award/2014/img/index_img_chart_icon04_sp.gif) left top no-repeat;
				background-size: 100% auto;
			}
			#chart .inBox .iconList li.icon05 {
				margin: 0 25%;
				background: url(/common/special/award/2014/img/index_img_chart_icon05_sp.gif) left top no-repeat;
				background-size: 100% auto;
			}
	#chart .inBox .btn_chart {
		width: 93.5%;
		height: auto;
		margin: 0 auto 8% auto;
		background: url(/common/special/award/2014/img/index_btn_chart01_sp.gif) left top no-repeat;
		background-size: 100% auto;
		position: relative;
	}
	#chart .inBox .btn_chart:before {
		content: "";
		display: block;
		padding-top: 12.06%;
	}
		#chart .inBox .btn_chart a {
			position: absolute;
			top:0;
			left:0;
			width: 100%;
			height: 100%;
			display: block;
			text-indent: -9999px;
		}

#chart .inBox .detail {
	width: 93.5%;
	margin: 0 auto;
}
	#chart .inBox .detail dl {
		width: 100% !important;
		margin: 0 auto;
		float: none;
		margin: 0;
		padding-bottom: 5%;
	}
		#chart .inBox .detail dl dt {
			height: auto;
			margin-bottom: 3%;
			position: relative;
			background-size: 100% auto !important;
		}
			#chart .inBox .detail dl dt:before {
				content: "";
				display: block;
				padding-top: 12.75%;
			}
			#chart .inBox .detail dl dt span {
				position: absolute;
				top:0;
				left:0;
				width: 100%;
				height: 100%;
				display: block;
			}
		#chart .inBox .detail .chart01 dt {
			background: url(/common/special/award/2014/img/index_sttl_chart01_sp_of.gif) left top no-repeat;
		}

		#chart .inBox .detail .chart02 {
			padding-bottom: 0%;
		}


		#chart .inBox .detail .chart02 dt {
			background: url(/common/special/award/2014/img/index_sttl_chart02_sp_of.gif) left top no-repeat;
		}
		#chart .inBox .detail .chart03 dt {
			background: url(/common/special/award/2014/img/index_sttl_chart03_sp_of.gif) left top no-repeat;
		}
		#chart .inBox .detail .chart01 dt.active {
			background: url(/common/special/award/2014/img/index_sttl_chart01_sp_on.gif) left top no-repeat;
		}
		#chart .inBox .detail .chart02 dt.active {
			background: url(/common/special/award/2014/img/index_sttl_chart02_sp_on.gif) left top no-repeat;
		}
		#chart .inBox .detail .chart03 dt.active {
			background: url(/common/special/award/2014/img/index_sttl_chart03_sp_on.gif) left top no-repeat;
		}
			/* table */
			#chart .inBox .detail table {
				width: 100% !important;
				margin-bottom: 3%;
				border-top: 2px solid #e0e5ec;
				border-left: 2px solid #e0e5ec;
			}
				#chart .inBox .detail table th {
					width: 35px;
					border-right: 2px solid #e0e5ec;
					border-bottom: 2px solid #e0e5ec;
					background-color: #ffcad3;
					background-size: 35px 50px !important;
				}
				#chart .inBox .detail table th.rank01 { background: url(/common/special/award/2014/img/index_icon_chart01_sp.gif) left center no-repeat #dc2527; }
				#chart .inBox .detail table th.rank02 { background: url(/common/special/award/2014/img/index_icon_chart02_sp.gif) left center no-repeat #ffcad3; }
				#chart .inBox .detail table th.rank03 { background: url(/common/special/award/2014/img/index_icon_chart03_sp.gif) left center no-repeat #ffcad3; }
				#chart .inBox .detail table th.rank04 { background: url(/common/special/award/2014/img/index_icon_chart04_sp.gif) left center no-repeat #ffcad3; }
				#chart .inBox .detail table th.rank05 { background: url(/common/special/award/2014/img/index_icon_chart05_sp.gif) left center no-repeat #ffcad3; }
				#chart .inBox .detail table td {
					border-right: 2px solid #e0e5ec;
					border-bottom: 2px solid #e0e5ec;
				}
				#chart .inBox .detail table td.tmb,
				#chart .inBox .detail table td.tmb img {
					width: 50px;
					height: 50px;
				}
		#chart .inBox .detail .btn_more {
			float: none;
			width: 100%;
			position: relative;
			margin-bottom: 3%;
		}
		#chart .inBox .detail .btn_more:before {
			content: "";
			display: block;
			padding-top: 12.75%;
		}
			#chart .inBox .detail .btn_more a {
				position: absolute;
				top:0;
				left:0;
				width: 100%;
				height: 100%;
				display: block;
				text-indent: -9999px;
				background: url(/common/special/award/2014/img/index_btn_chart_more_sp.gif) left top no-repeat;
				background-size: 100% auto;
			}

/* COMMENTARY
========================================================= */
#commentary .inBox h2 {
	background: url(/common/special/award/2014/img/index_ttl_commentary_sp.gif) left top no-repeat;
}
#commentary .inBox .bnrList {
	width: 93.5%;
	margin: 0 auto;
}
	#commentary .inBox .bnrList ul {
		width: 100%;
	}
		#commentary .inBox .bnrList li {
			width: 48%;
			margin-right:0;
			margin-bottom: 3% !important;
		}
		#commentary .inBox .bnrList li:nth-child(2n) {
			float: right;
		}
			#commentary .inBox .bnrList li img {
				width: 100%;
				height: auto;
			}

/* ARCHIVE
========================================================= */
	#archive.section {
		padding-top: 4.37%;
	}
	#archive .inBox h2 {
		width: 62% !important;
		margin-bottom: 3.9%;
		background: url(/common/special/award/2014/img/index_ttl_archive_sp.gif) left top no-repeat;
	}
	#archive .inBox h2:before {
		content: "";
		display: block;
		padding-top: 27.42%;
	}
	#archive .inBox {
		background: #00a33b;
	}
		#archive .inBox .linkList {
			width: 100%;
		}
			#archive .inBox .linkList li {
				width: 30%;
				margin-right: 5%;
			}
			#archive .inBox .linkList li:nth-child(3),
			#archive .inBox .linkList li:nth-child(5) {
				margin-right:0;
			}
			#archive .inBox .linkList li:nth-child(4) {
				margin-left: 17.25%;
			}
			#archive .inBox .linkList li:nth-child(4),
			#archive .inBox .linkList li:nth-child(5) {
				margin-top: 2%;
			}
				#archive .inBox .linkList li img {
					width: 100%;
					height: auto;
				}


/* AWARDS
========================================================= */
#headBlock .linkBtn .btn02 a {
	background: url(/common/special/award/2014/img/index_btn_mainVisual_awards_sp.gif) left top no-repeat;
	background-size: 100%;
}

#vote .inBox h2 {
	background: url(/common/special/award/2014/img/index_ttl_awards_sp.gif) left top no-repeat;
}

#vote .inBox {
	background: #FFFFFF;
}

#vote #artist_of_the_year {
        width: 93.5%;
	height: auto;
	margin: 4.6% auto 4.6%;
}
#vote #artist_of_the_year img {
        width: 100%;
	height: auto;
}

/* ナビゲーション */
#headBlock #menu li a.btn_vote{ background: url(/common/special/award/2014/img/index_nav_awards_sp.gif) 15px 50% no-repeat #f7c600; background-size: 92px 18px; }
