@charset "utf-8";
/*------------------------------------------------------------

URL : http://www.jleague.jp/css/sp/special/jleagueking.css
DATE : 2016/05/10

------------------------------------------------------------*/

.ttlNoLink h3,
.ttlNoLink .blockTit{
	background: #29A6F5;
}

.rightMorelLink{
	border: 1px solid #999;
	height: auto;
	margin: 10px 0 0 0;
}
.rightMorelLink a{
	position: relative;
	display: block;
	width: 100%;
	text-align: center;
	box-sizing: border-box;
	top: 0;
    left: 0;
    padding: 13px 0;
}
.rightMorelLink a:after{
	right: 10px;
}




/*-----------------------
KVエリア
-------------------------*/
.kvArea {
    position: relative;
    margin: 0;
}
.kvArea h2 {
    text-align: center;
    border-bottom: 1px solid #fff;
}
.kvArea h2 a {
    width: 100%;
    display: block;
    text-align: center;
    background: #FFD400;
    line-height: 1;
}
.kvArea h2 img{
	width: 100%;
	height: auto;
	max-width: 500px;
	vertical-align: top;
}
.kvArea .navWrap {
    width: 100%;
    background: #005BAD;
}
.kvArea .navList {
    display: block;
    letter-spacing: -0.4em;
    width: 100%;
}
.kvArea .navList li {
    display: inline-block;
    letter-spacing: normal;
    border-right: solid 1px #fff;
    border-bottom: solid 1px #fff;
    vertical-align: top;
    width: 25%;
    box-sizing: border-box;
}

.kvArea .navList li:nth-child(4),
.kvArea .navList li:last-child{border-right:none;}

.kvArea ul.navList li > a,
.kvArea ul.navList li > span {
    font-size: 12px;
    line-height: 1.2em;
    height: 36px;
    display: table-cell;
    color: #fff;
    padding: 3px;
    text-align: center;
    vertical-align: middle;
    width: 500px;
}
body.top .kvArea .navList li#nav_top a,
body.news .kvArea .navList li#nav_news a,
body.photo .kvArea .navList li#nav_photo a,
body.video .kvArea .navList li#nav_video a,
body.yuruchara .kvArea .navList li#nav_yuruchara a{
	background: #fff;
    color: #002F45;
    letter-spacing: -0.05em;
}
/*.kvArea .navList li#nav_yuruchara,
.kvArea .navList li#nav_yuruchara_vote{
    width: 50%;
}*/
.kvArea .navList li#nav_yuruchara{
    width: 100%;
}
body.yuruchara .kvArea .navList li#nav_yuruchara a{
   /* border-bottom: 1px solid #005BAD;*/
}
.kvArea .navList li#nav_yuruchara_vote a{
    background: #b7155b;
}
    

/*-----------------------
コンテンツ
-------------------------*/
.newsArea{
    margin-bottom: 20px;
}
/*newsList*/
.newsList {
    border:none;
}
.newsArea .newsList > li{
	padding: 0 0 10px 0px;
    margin: 0 0 10px;
}
.newsArea .newsList > li a{
	display: block;
	color: #333;
	position: relative;
	min-height: 110px;
}
body.news .newsArea .newsList > li a{min-height: inherit;}

.newsArea .newsList > li a:after{
	position: absolute;
    font-family: 'FontAwesome';
    content: "\f105";
    font-size: 20px;
    font-weight: normal;
    right: 0;
    top: 50%;
    margin-top: -7px;
    color: #ccc;
  }
.newsArea .newsList > li a:hover{
	text-decoration: none;
	opacity: 0.5;
}
.newsArea .newsList li figure {
    width: 110px;
    vertical-align: top;
    position: absolute;
    top: 35px;
}
.newsArea .newsList li figure img{
	width: 110px;
	height: auto;
}
.newsArea .newsList li div{
    vertical-align: top;
    padding-top: 4px;
}
.newsArea .newsList li div .articleTit {
    font-size: 15px;
    padding: 0 15px 0 120px;
    margin-bottom: 5px;
}
body.news .newsArea .newsList li div .articleTit{padding-left: 0;}

.newsArea .newsList li:last-child{
	border-bottom: 1px solid #ccc;
}
.newsArea .newsList li div p.timeStamp {
    color: #e60012;
    display: block;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 10px;
    line-height: 100%;
}
.newsArea .newsList li div p.timeStamp span.new{
	padding: 2px;
	width: 50px;
	text-align: center;
	background: #f00;
	color: #fff;
	font-size: 10px;
	display: inline-block;
	position: relative;
	top: -2px;
}
.newsArea .newsList li div p.timeStamp span.category{
    background: #e5e5e5;
    width: 110px;
    display: inline-block;
    font-size: 12px;
    padding: 5px 0;
    text-align: center;
    border-radius: 3px;
    margin-right: 5px;
    color: #333;
}

.articleTilArea{
    margin: 0 0 20px;
    padding: 0;
}
.articleTilArea .timeStamp{
    font-size: 12px;
}
.articleTilArea .articleTit{
    font-weight: normal;
    padding-top: 5px;
}
.detalArea > p{
    margin: 0 0 25px;
}
.detalArea .backLink {
    text-align: center;
}
.detalArea .backLink a {
    color: #333;
    font-size: 14px;
    padding: 10px 15px;
    position: relative;
    border: 1px solid #ccc;
    border-radius: 3px;
    display: inline-block;
    margin: 0 auto;
}
.detalArea .backLink a:before {
    content: "\f053";
    display: inline-block;
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    margin: 0 .3em;
    text-decoration: none;
    padding-right: 10px;
}
.videoOneArea {
    margin-bottom: 20px;
    background: #4f4f4f;
}
.videoOneArea iframe{
    width: 100%;
    height: auto;
}
.videoOneArea p {
    color: #fff;
    display: block;
    font-size: 12px;
    line-height: 140%;
    padding: 10px;
    margin-bottom: 20px;
    text-align: left;
}



/*photoList*/
.photoArea .photoList {
    display: block;
    letter-spacing: -0.4em;
}
.photoList li {
    width: 50% !important;
    height: auto;
    display: inline-block;
    letter-spacing: normal;
    box-sizing: border-box;
    border: 2px solid #fff;
    vertical-align: top;
}
.photoList li a{
	display: block;
}
.photoList li img {
    width: 100% !important;
    height: auto;
    vertical-align: top;
}





/*lightbox*/
.lb-outerContainer{
	/*background: #000;*/
}
.lb-dataContainer{
    position: absolute;
    bottom: -80px;
    padding: 10px !important;
    box-sizing: border-box;
}
.lb-data .lb-caption{
	display: block;	
    margin-bottom: 5px;
    line-height: 1.5 !important;
    color: #fff;
    font-size: 12px !important;
}
.lb-nav {
    top: 0 !important;
    margin-top: 0 !important;
}
.lb-nav a.lb-prev,
.lb-nav a.lb-next{
	position: relative;
    top: 50%;
}
.lb-data .lb-details{
	font-size: 12px;
	width: 90% !important;
}
.lightboxOverlay{
	opacity: 0.8 !important;
}

.contentArea p.next{
    margin-bottom: 15px;	
}



/*txtArea*/
.txtArea{
    text-align: center;
}
.txtArea p{
    font-size: 14px;
    line-height: 2;
    margin-bottom: 1em;
    padding-top: 20px;
    text-align: left;
}
.txtArea img{
    width: 100%;
    height: auto;
    max-width: 300px;

}

/*aboutYuruchara*/
.aboutYuruchara{
    border:5px solid #ccc;
    padding: 60px 10px 10px;
    position: relative;
    margin-bottom: 40px;
}
.aboutYuruchara dt{
    position: absolute;
    left: -5px;
    top: -15px;
}
.aboutYuruchara dd{
    font-size: 14px;
    line-height: 2;
}


.outlineArea{
    margin-bottom: 40px;
}
.outlineArea dl.fin{
    margin:20px 0;
}
.outlineArea dl.fin dt{
    font-size: 18px;
    color: #e8a900;
    margin-bottom: 0.5em;
}
.outlineArea dl.fin dd{
    font-size: 14px;
    line-height: 1.5;
}

.leftRedTit {
    border-left: 5px solid #e8a900;
    font-size: 14px;
    font-weight: bold;
    line-height: 100%;
    margin-bottom: 16px;
    padding: 5px 10px;
    letter-spacing: -0.05em;
}




/*profileWrap*/
.profileWrap {
    margin-top: 20px;
    padding: 20px;
    position: relative;
    background: #eee;
}
.profileWrap dd {
    line-height: 2;
    font-size: 14px;
}
.profileWrap dd span {
    display: block;
    font-weight: bold;
}
.profileIMG {
    position: absolute;
    bottom: -10px;
    right: 10px;
}
.profileIMG img{
    width: 120px;
    height: auto;
}



.voteBTN{
    margin-bottom: 30px;
    text-align: center;
}

.voteBTN > a{
    padding: 10px;
    display: block;
    background: #b7155b;
    font-size: 15px;
    line-height: 1.5;
    text-align: center;
    font-weight: bold;
    position: relative;
    border: 5px solid #e05993;
    color: #fff;
    margin:0 auto;
}
.voteBTN > a:after{
    position: absolute;
    top: 50%;
    margin-top: -5px;
    right: 15px;
    font-family: 'icomoon3';
    content: "\ec600";
    font-size: 10px;
    text-decoration: none !important;
    color: #fff;
}
.voteBTN > a:hover{
    text-decoration: none;
    opacity: 0.6;
}
.voteBTN > a > span{
    display: block;
    font-weight: bold;
}