﻿@charset "utf-8";

/* =============================================
 TOP 準決勝進出29 -- 201711 --
============================================= */
.cent_wrap {
  margin: 20px auto 0;
  width: 100%;
  max-width: 800px;
}
.cent_wrap .sponsor-cap { width: 100%;}

#semifinal{
	position: relative;
  background-color: #212020;
  text-align: center;
  padding: 20px 0 10px;
  width: 100%;
  margin: 0 auto 50px;
}
#semifinal h2{
  width: 100%;
  margin-bottom: 15px;
}
#semifinal ul{
  width: 98%;
  max-width: 1008px;
  margin: 0 auto;
  box-sizing: border-box;
  text-align: left;
  font-size: 0;
	position:relative;
	z-index:2;
}
#semifinal .semifinal_title_pc{
	position:relative;
    margin-top: 22px;
    margin-bottom: 20px;
}
#semifinal .semifinal_title_pc:before{
	content:"";
	display:block;
	position:absolute;
	top:-42px;
	left:0;
	right:0;
	margin:auto;
	width:1000px;
	height:190px;
	background:url(/img/top2019/semifinal/ttl_semifina_dec_bk.png) no-repeat center center;
	background-size:100% auto;
	padding: -5px 0;

}
#semifinal ul li {
display: inline-block;
width: calc(100% / 7);
padding: 0 0.5% 2% 0.5%;
vertical-align: top;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#semifinal .done li {
  opacity:0.3;
}
#semifinal ul li a {
  display: block;
}

#semifinal ul li a:hover {
  opacity:0.7;
	filter: alpha(opacity=70);        /* ie lt 8 */
	-ms-filter: "alpha(opacity=70)";  /* ie 8 */
	-moz-opacity:0.7;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.7;              /* Safari 1.x */
}
#semifinal ul li.wildcard {
  position: relative;
  width: calc(100% / 7 * 3);
}
/*#semifinal ul li.wildcard img {
  width: 100%;
}*/

/* win */
#semifinal ul li.semi_win {
  position: relative;
  opacity: 1;
}
#semifinal ul li.semi_win a {
  position: relative;
  padding-bottom: 6%;
  overflow: visible;
}
#semifinal ul li.semi_win a:before {
  position: absolute;
  top: 0;
  left: 0;
  
  content: '';
  display: inline-block;
/*  width: 115px;
  height: 107px;*/
  width: 100%;
  height: auto;
  padding-top: 93%;
  
  background: url(../img/top2019/semifinal/pho_wrap.png) 0 0 no-repeat transparent;
  background-size: 100% auto;
  vertical-align: middle;
  z-index: 30;
}
#semifinal ul li.semi_win a:after {
  position: absolute;
  top: -10px;
  left: -10px;
  
  content: '';
  display: inline-block;
/*  width: 40px;height: 55px;*/
  width: 25%;
  height: 50%;
  background: url(../img/top2019/semifinal/ico_emblem.png) 0 0 no-repeat transparent;
  background-size: contain;
  vertical-align: middle;
  z-index: 35;
}


/* =============================================
 TOP 決勝進出コンビ決定 -- 201711 --
============================================= */
#semifinal.semifina_dec {
  background: url(../img/top2019/semifinal/ttl_semifina_dec_bk.png) center 0 no-repeat #212020;
}
#semifinal.semifina_dec h2{
  margin-top: 15px 0 20px;
}
/*#semifinal.semifina_dec ul li {
  opacity: 0.5;
}
#semifinal.semifina_dec ul li.semi_win {
  opacity: 1;
}*/


/* =============================================
 TOP 決勝進出 GYAO!生配信バナー　-- 20171115 --
============================================= */
.gyao_distribution {
	text-align: center;
	margin: 0 auto 50px;
}
.gyao_distribution img {
	width: 90%;
	max-width: 580px;
}
.gyao_distribution a:hover {
	opacity:0.8;
	filter: alpha(opacity=80);        /* ie lt 8 */
	-ms-filter: "alpha(opacity=80)";  /* ie 8 */
	-moz-opacity:0.8;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.8;              /* Safari 1.x */
}


@media screen and (min-width: 0px) and (max-width: 640px) {
#semifinal ul{
  width: 92%;
margin: 0 auto;
}
#semifinal ul li {
  width: 23%;
  margin: 0 1% 3%;
}
#semifinal ul li.wildcard {
 width: 73%;
 text-align: center;
  margin: 0 1%;
}
  
/* 決勝進出コンビ決定 title */
#semifinal.semifina_dec { background-image: none;}
#semifinal.semifina_dec h2 { margin-bottom: 0;}

}

@media screen and (min-width: 640px) and (max-width: 1000px) {
  

.cent_wrap {
  margin: 10px auto 0;
  width: auto;
}
#semifinal ul { width: 90%;}
  
#semifinal ul li {
  width: 18.45%;
  margin: 0 1% 20px 0px;
}
  
#semifinal ul li.wildcard {
  width: 97%;
  text-align: center;
}
#semifinal ul li.wildcard img {
  width: 70%;
}
}


@media only screen and  (max-width: 1000px) {
.cent_wrap .sponsor-cap { width: auto; margin-left: 2.5%;}

#semifinal{  padding: 1.5% 0;
margin-bottom: 5%;
}

/* win */
#semifinal ul li.semi_win a:before {
  width: 100%;
  height: 100%;
  padding-top: 6%;
}


}

.annotation{
	width: 95%;
	max-width: 986px;
	text-align: right;
	display: block;
	margin: 0 auto;
	font-size: 0.7rem;
	position: relative;
	top: -20px;
}
@media only screen and  (max-width: 640px) {
	.annotation{
		top: -10px;
	}
	.gyao_distribution {
	margin: 0 auto 4%;
}
}

.sponsor_wrap{
  margin: 0;
  padding: 11px 0;
  background: #000;
}
.sponsor_wrap .sponsor {
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
  padding: 0;
  background: #000;
}





.semifinal_bnr{
  display: block;
  text-align: center;
  padding: 0 0 20px;
}
.semifinal_bnr a{
  display:inline-block;
  width:90%;
  max-width:580px;
}
.semifinal_bnr a:hover{
  opacity: 0.6;
}