@charset "utf-8";
/* =========================================================
   common style
   =======================================================*/

body, div, dl, dt, dd, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0;
}

body {
	text-align: center;
	background: #ffffff;
	font-size: 100%;
	line-height: 0;
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

img {
  border: 0;
}

a{
    outline: none;
}
a:link    { color: #0084ff; text-decoration: none; }
a:visited { color: #0084ff; text-decoration: none; }
a:hover,
a:focus,
a:active  { text-decoration: underline;}

.clearfix:after {
  content: ".";
  visibility: hidden;
  clear: both;
  display: block;
  height: 0;
}

.clearfix {
 zoom: 1;
 margin-bottom: 0;
}

#feat p,
#feat dl,
#feat dd,
#feat ul {
  margin: 0;
  padding: 0;
}

#feat li {
  list-style: none;
}

#feat table {
  border-collapse: collapse;
  border-spacing: 0;
}

#feat table th,
#feat table td {
  padding: 0;
}

/* ----------------------------
   PC/TAB
------------------------------- */
body {
	background: url(https://image2.b-ch.com/cpn/lovelive-s/bg.jpg) no-repeat center 0;
	background-size: cover;
		width: 100%;
}

@media only screen and (min-width:768px) {
	.sp {
		display: none;
	}
	
	#header {
		margin: 0 auto;
		padding: 11px 0 12px 0;
		width: 960px;
	}
	
	#header .bch-logo {
		float: left;
		margin-top: 3px;
	}
	
	#header .bch-logo img {
		width: 188px;
	}
	
	#header .btn-top {
		float: right;
	}
	
	#header .btn-top img {
		width: 143px;
	}
	
	#feat {
/*
		background: url(https://image2.b-ch.com/cpn/lovelive-s/bg.jpg) no-repeat center top;
		background-size: 1500px;
		width: 100%;
		min-height: 1439px;
*/
	}
	
	#feat-lls {
		margin: 0;
		margin: 0 auto;
/*
		width: 960px;
*/
	}
	
	#feat-lls .main {
		position: relative;
		margin: 0 auto;
		width: 960px;
		text-align: left;
	}
	
	#feat-lls .main .logo {
		padding: 5px 0 9px 0;
	}
	
	#feat-lls .main .logo img {
		width: 192px;
	}
	
	#feat-lls .main .lead {
		position: absolute;
		top: 17px;
		left: 187px;
	}
	
	#feat-lls .main .lead img {
		width: 773px;
	}
	
	#feat-lls .dlvr {
/*
		margin-bottom: 20px;
		margin: 0 auto 20px auto;
*/
		margin: 0 auto;
		padding: 0 40px;
		background: #000000;
/*
		width: 100%;
		max-width: 960px;
*/
	}
	
	#feat-lls .dlvr .player span {
		display: block;
		background: #ccc;
		width: 960px;
		height: 540px;
	}
	
	#feat-lls .dlvr .player {
		position: relative;
		width: 100%;
		padding-top: 56%;
		overflow: hidden;
	}
	
	#feat-lls .dlvr .player iframe {
		position: absolute;
		top: 0;
		left: 0;
		margin: 0;
		border: 0;
		padding: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
		overflow-x: hidden;
		overflow-y: hidden;
	}
	
	#feat-lls .notice {
		background: #000000;
		padding: 15px 0;
		font-size: 12px;
		line-height: 1.2;
		color: #ffffff;
		max-width: 960px;
		margin: 0 auto;
	}
	
	#feat-lls .notice a {
		margin-left: 1em;
	}
	
	#feat-lls .notice a,
	#feat-lls .notice a:hover {
		color: #29bafd;
	}
	
	#feat-lls .copyright {
		padding: 3px 0;
		text-align: left;
		font-size: 9px;
		line-height: 1.2;
		max-width: 960px;
		margin: 0 auto 20px auto;
	}
	
	#feat-lls .bnr {
		margin-bottom: 30px;
	}
	
	#feat-lls .bnr li img {
		width: 960px;
	}
	
	#feat-lls .ttllist {
/*
		margin-bottom: 30px;
*/
		margin: 0 auto 15px auto;
		width: 960px;
	}
	
	#feat-lls .ttllist .ttl {
		margin-bottom: 5px;
		font-size: 22px;
		font-weight: bold;
		line-height: 1.2;
		color: #333333;
	}
	
	#feat-lls .ttllist .ttllist-list {
		background: rgba(255,255,255,0.7);
		padding: 19px 0 13px 19px;
		
	}
	
	#feat-lls .ttllist dl {
		float: left;
		margin-right: 8px;
		width: 226px;
		text-align: left;
	}
	
	#feat-lls .ttllist dl dd {
		position: relative;
	}
	
	#feat-lls .ttllist dl dd img.pic {
		width: 226px;
	}
	
	#feat-lls .ttllist dl dd img.pom {
		position: absolute;
		top: 0;
		left: 0;
		width: 76px;
	}
	
	#feat-lls .ttllist dl dt {
		margin-top: 4px;
		font-size: 15px;
		line-height: 1.2;
		font-weight: bold;
	}
	
	#feat-lls .link {
		margin: 0 auto 5px auto;
		width: 960px;
	}
	
	#feat-lls .gototop {
		font-size: 14px;
		line-height: 1.2;
		text-align: right;
	}
	
	#feat-lls .gototop a {
		background: url(https://image2.b-ch.com/cpn/lovelive-s/sp/icon_b-arrow-top.png) no-repeat;
		background-position: 0 0.2em;
		background-size: 0.8em;
		padding: 0 1em;
		color: #0757a9;
	}
	
	#feat-lls .relativeLists {
		font-size: 14px;
		line-height: 1.2;
	}
	
	#feat-lls .relativeLists {
		font-size: 14px;
		line-height: 1.4;
		text-align: left;
	}
	
	#feat-lls .relativeLists li a {
		background: url(https://image2.b-ch.com/cpn/lovelive-s/sp/icon_b-tri.png) no-repeat;
		background-position: 1.2em 0.3em;
		background-size: 0.6em;
		padding: 0 1em 0 2em;
		color: #0757a9;
	}
	
	
	/* ------------------------------
	   footer
	------------------------------- */
	#footer {
		margin: 0;
		background: #000000;
		padding: 15px 0 20px 0;
		width: 100%;
		text-align: center;
		font-size: 12px;
		line-height: 1.4;
	}
	
	#footer div {
		margin: 0 auto;
		width: 960px;
		text-align: center;
		color: #999999;
	}
	
	#footer div a:link,
	#footer div a:visited {
		color: #ffffff;
	}
	
	#footer p {
		margin: 20px 0 0 0;
	}
	
	#footer ul#footer-notice {
		margin: 2px 0 0 0;
		padding: 0;
	}
	
	#footer ul#footer-notice li {
		list-style: none;
	}
	
}

/* ----------------------------
   SP
------------------------------- */
@media only screen and (max-width:767px) {
	.pc {
		display: none;
	}
	
	#header {
		margin: 0 auto;
		padding: 4% 0 4% 0;
		width: 100%;
	}
	
	#header .bch-logo {
		float: left;
		margin-left: 3%;
		width: 50%;
		text-align: left;
	}
	
	#header .bch-logo img {
		width: 100%;
	}
	
	#header .btn-top {
		float: right;
		margin-right: 3%;
		width: 33%;
		text-align: right;
	}
	
	#header .btn-top img {
		width: 100%;
	}
	
	#feat {
/*
		background: url(https://image2.b-ch.com/cpn/lovelive-s/sp/bg.jpg) no-repeat center top;
		background-size: 100%;
*/
		padding-bottom: 4%;
		width: 100%;
	}
	
	#feat-lls {
		margin: 0 auto;
		width: 100%;
	}
	
	#feat-lls .main {
		position: relative;
		text-align: left;
	}
	
	#feat-lls .main .logo {
		padding: 4% 0 5% 0;
		width: 33%;
	}
	
	#feat-lls .main .logo img {
		width: 100%;
	}
	
	#feat-lls .main .lead {
		position: absolute;
		top: 0;
		left: 33%;
		padding-top: 3%;
		width: 64%;
	}
	
	#feat-lls .main .lead img {
		width: 100%;
	}
	
	#feat-lls .dlvr {
	}
	
	#feat-lls .dlvr .player span {
		display: block;
		background: #ccc;
		width: 100%;
		padding-top: 56%;
	}
	
	#feat-lls .dlvr .player {
		position: relative;
		width: 100%;
		padding-top: 56%;
		overflow: hidden;
	}
	
	#feat-lls .dlvr .player iframe {
		position: absolute;
		top: 0;
		left: 0;
		margin: 0;
		border: 0;
		padding: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
		overflow-x: hidden;
		overflow-y: hidden;
	}
	
	#feat-lls .notice {
		background: #000000;
		padding: 3% 0 2% 0;
		max-height: 100%;
		font-size: 0.5rem;
		font-size: calc(7px + 15 * ((100vw - 320px) / 704));
		line-height: 1.5;
		color: #ffffff;
	}
	
	#feat-lls .notice a {
		background-color:rgba(255,255,255,0.01);
		max-height: 100%;
		font-size: 1rem;
		font-size: calc(10px + 30 * ((100vw - 320px) / 704));
	}
	
	#feat-lls .notice a,
	#feat-lls .notice a:hover {
		color: #29bafd;
	}
	
	#feat-lls .copyright {
		padding: 1% 0 0 2%;
		background-color:rgba(255,255,255,0.01);
		max-height: 100%;
		text-align: left;
		font-size: 0.6rem;
		font-size: calc(7px + 15 * ((100vw - 320px) / 704));
		line-height: 1.2;
		margin-bottom: 3%;
	}
	
	#feat-lls .bnr {
		margin-bottom: 6%;
	}
	
	#feat-lls .bnr li img {
		width: 85%;
	}
	
	#feat-lls .ttllist {
		margin-bottom: 6%;
	}
	
	#feat-lls .ttllist .ttl {
		margin-bottom: 1%;
		background-color:rgba(255,255,255,0.01);
		max-height: 100%;
		font-size: 1.2rem;
		font-size: calc(14px + 30 * ((100vw - 320px) / 704));
		font-weight: bold;
		line-height: 1.2;
		color: #333333;
	}
	
	#feat-lls .ttllist .ttllist-list {
		background: rgba(255,255,255,0.7);
		padding: 6% 0 2% 2%;
		
	}
	
	#feat-lls .ttllist dl {
		float: left;
		margin: 0 6% 3% 4%;
		width: 40%;
		text-align: left;
	}
	
	#feat-lls .ttllist dl dd {
		position: relative;
	}
	
	#feat-lls .ttllist dl dd img.pic {
		width: 100%;
	}
	
	#feat-lls .ttllist dl dd img.pom {
		position: absolute;
		top: 0;
		left: 0;
		width: 34%;
	}
	
	#feat-lls .ttllist dl dt {
		margin-top: 2%;
		background-color:rgba(255,255,255,0.01);
		max-height: 100%;
		font-size: 0.8rem;
		font-size: calc(8px + 20 * ((100vw - 320px) / 704));
		font-weight: bold;
		line-height: 1.2;
	}
	
	#feat-lls .gototop {
		background-color:rgba(255,255,255,0.01);
		max-height: 100%;
		font-size: 0.8rem;
		font-size: calc(9px + 30 * ((100vw - 320px) / 704));
		line-height: 1.2;
		text-align: right;
	}
	
	#feat-lls .gototop a {
		background: url(https://image2.b-ch.com/cpn/lovelive-s/sp/icon_b-arrow-top.png) no-repeat;
		background-position: 0 0.2em;
		background-size: 0.8em;
		padding: 0 1em;
		color: #0757a9;
	}
	
	#feat-lls .relativeLists {
		font-size: 0.8rem;
		font-size: calc(9px + 30 * ((100vw - 320px) / 704));
		line-height: 1.4;
		text-align: left;
	}
	
	#feat-lls .relativeLists li a {
		background: url(https://image2.b-ch.com/cpn/lovelive-s/sp/icon_b-tri.png) no-repeat;
		background-position: 1.2em 0.3em;
		background-size: 0.6em;
		padding: 0 1em 0 2em;
		color: #0757a9;
	}
	
	/* ------------------------------
	   footer
	------------------------------- */
	#footer {
		margin: 0;
		background: #000000;
		max-height: 100%;
		padding: 4% 0 5% 0;
		width: 100%;
		text-align: center;
		font-size: 0.6rem;
		font-size: calc(8px + 20 * ((100vw - 320px) / 704));
		line-height: 1.4;
	}
	
	#footer div {
		margin: 0 auto;
		padding: 0 5%;
		width: 90%;
		text-align: center;
		color: #999999;
	}
	
	#footer div a:link,
	#footer div a:visited {
		color: #ffffff;
	}
	
	#footer p {
		margin: 4% 0 0 0;
	}
	
	#footer ul#footer-notice {
		margin: 1% 0 0 0;
		padding: 0;
	}
	
	#footer ul#footer-notice li {
		list-style: none;
	}
	
}


