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

@font-face {
	font-family: 'Noto Sans JP';
	src: url('../../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf') format("opentype");
	font-style: normal;
	font-weight: 100;
}

@font-face {
	font-family: 'Noto Sans JP';
	src: url('../../fonts/Noto_Sans_JP/NotoSansJP-Light.otf') format("opentype");
	font-style: normal;
	font-weight: 300;
}

@font-face {
	font-family: 'Noto Sans JP';
	src: url('../../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf') format("opentype");
	font-style: normal;
	font-weight: 400;
}

@font-face {
	font-family: 'Noto Sans JP';
	src: url('../../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf') format("opentype");
	font-style: normal;
	font-weight: 500;
}

@font-face {
	font-family: 'Noto Sans JP';
	src: url('../../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf') format("opentype");
	font-style: normal;
	font-weight: 700;
}

@font-face {
	font-family: 'Noto Sans JP';
	src: url('../../fonts/Noto_Sans_JP/NotoSansJP-Black.otf') format("opentype");
	font-style: normal;
	font-weight: 900;
}

@font-face {
	font-family: 'Shippori Mincho';
	src: url('../../fonts/Shippori_Mincho/ShipporiMincho-Regular.ttf') format("opentype");
	font-style: normal;
	font-weight: 400;
}

@font-face {
	font-family: 'Shippori Mincho';
	src: url('../../fonts/Shippori_Mincho/ShipporiMincho-Medium.ttf') format("opentype");
	font-style: normal;
	font-weight: 500;
}

@font-face {
	font-family: 'Shippori Mincho';
	src: url('../../fonts/Shippori_Mincho/ShipporiMincho-SemiBold.ttf') format("opentype");
	font-style: normal;
	font-weight: 600;
}

@font-face {
	font-family: 'Shippori Mincho';
	src: url('../../fonts/Shippori_Mincho/ShipporiMincho-Bold.ttf') format("opentype");
	font-style: normal;
	font-weight: 700;
}

@font-face {
	font-family: 'Shippori Mincho';
	src: url('../../fonts/Shippori_Mincho/ShipporiMincho-ExtraBold.ttf') format("opentype");
	font-style: normal;
	font-weight: 900;
}


body {
	margin: 0;
	font-family:'Lucida Grande','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,'ＭＳ ゴシック',Osaka,sans-serif;
}

img {
  border: 0;
}

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

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

div#container {
	width: 100%;
}

div#feat {
	position: relative;
	background-color: #860a25;
	background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/main_bg.png), url(https://image2.b-ch.com/feat/feat_gangsta2026/bg.jpg);
	background-repeat: no-repeat, no-repeat;
	background-position: top center, top center;
	background-attachment: scroll, fixed;
	background-size: 1484px, 2000px;
	width: 100%;
	text-align: center;
	font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", sans-serif;
	font-weight: 300;
	font-size: 12px;
	line-height: 1;
	color: #000;
}

div#feat div {
/*
	font-size: 12px;
	line-height: 16px;
*/
}

div#feat * {
	box-sizing: border-box;
	letter-spacing: normal;
}

div#feat td {
	font-size: 12px;
	line-height: 16px;
	vertical-align: top;
}

div#feat a {
	color: #fff;
	text-decoration: none;
	-webkit-transition: color .4s ease-in-out;
	transition: color .4s ease-in-out;
}

div#feat a:hover {
	color: #fff;
	text-decoration: none;
}

/* TOP */
div#feat p,
div#feat dl,
div#feat dd,
div#feat ul {
  margin: 0;
  padding: 0;
}

div#feat li {
  list-style: none;
}

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

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

div#feat {
	position: relative;
	text-align: center;
}

div#feat *:focus {
	outline: none;
}

#gangsta {
	position: relative;
	margin: 0 auto;
	width: 100%;
}

#gangsta img {
	display: inline;
	vertical-align: baseline;
	width: 100%;
}

#gangsta div,
#gangsta div p {
	margin: 0;
	padding: 0;
}

#gangsta dt, #gangsta th {
	font-weight: normal;
}

#gangsta a.anchor {
	display: block;
	padding-top: 80px;
	margin-top: -80px;
}

#gangsta div.main {
	position: relative;
	margin: 0 auto;
	padding-top: 1px;
	width: 1273px;
	text-align: left;
}

#gangsta div.main div.key {
	position: absolute;
	top: 25px; left : 86px;
	width: 391px;
}

#gangsta div.main ul.sns {
	margin: 35px 88px 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 158px;
	height: 35px;
	font-size: 0; line-height: 0;
}

#gangsta div.main ul.sns li,
#gangsta div.main ul.sns li a,
#gangsta div.main ul.sns li a span {
	display: block;
	width: 35px;
	height: 35px;
}

#gangsta div.main ul.sns li a {
	position: relative;
}

#gangsta div.main ul.sns li a span {
	position: absolute;
	top: 0; left: 0;
	background-repeat: no-repeat;
	-webkit-transition: opacity .4s ease-in-out;
	transition: opacity .4s ease-in-out;
}

#gangsta div.main ul.sns li.line a span:nth-of-type(1) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/sns_line.png); background-size: 100%; }
#gangsta div.main ul.sns li.x a span:nth-of-type(1) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/sns_x.png); background-size: 100%; }
#gangsta div.main ul.sns li.fb a span:nth-of-type(1) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/sns_fb_02.png); background-size: 100%; }
#gangsta div.main ul.sns li a span:nth-of-type(2) { background-color: #fff; border-radius: 18px; opacity: 0; }

#gangsta div.main ul.sns li a:hover span:nth-of-type(2) { opacity: 0.3; }

#gangsta div.main div.title {
	margin: 43px 0 0 546px;
	width: 640px;
}

#gangsta div.main ul.nav {
	display: flex;
	flex-wrap: wrap;
	margin: 33px 0 0 510px;
	width: 720px;
}

#gangsta div.main ul.nav li,
#gangsta div.main ul.nav li a,
#gangsta div.main ul.nav li a span {
	display: block;
}

#gangsta div.main ul.nav li.news { width:  153px; height: 140px; }
#gangsta div.main ul.nav li.streaming { margin: 0 0 0 65px; width:  156px; height: 140px; }
#gangsta div.main ul.nav li.intro { margin: 0 0 0 88px; width:  198px; height: 140px; }
#gangsta div.main ul.nav li.chara { margin: -36px 0 0 39px; width:  176px; height: 140px; }
#gangsta div.main ul.nav li.comment { margin: -36px 0 0 87px; width:  153px; height: 140px; }
#gangsta div.main ul.nav li.present { margin: -36px 0 0 22px; width:  243px; height: 159px; }

#gangsta div.main ul.nav li a,
#gangsta div.main ul.nav li a span {
	width: 100%;
	height: 100%;
}

#gangsta div.main ul.nav li a {
	position: relative;
}

#gangsta div.main ul.nav li a span {
	position: absolute;
	top: 0; left: 0;
	background-repeat: no-repeat;
}

#gangsta div.main ul.nav li.news span:nth-of-type(1) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/nav_bg_news.png); background-size: 100%; }
#gangsta div.main ul.nav li.streaming span:nth-of-type(1) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/nav_bg_streaming.png); background-size: 100%; }
#gangsta div.main ul.nav li.intro span:nth-of-type(1) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/nav_bg_intro.png); background-size: 100%; }
#gangsta div.main ul.nav li.chara span:nth-of-type(1) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/nav_bg_chara.png); background-size: 100%; }
#gangsta div.main ul.nav li.comment span:nth-of-type(1) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/nav_bg_comment.png); background-size: 100%; }
#gangsta div.main ul.nav li.present span:nth-of-type(1),#gangsta div.main ul.nav li.present span:nth-of-type(2) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/nav_bg_present.png); background-size: 100%; }

#gangsta div.main ul.nav li.news span:nth-of-type(2) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/nav_news.png); background-size: 100%; }
#gangsta div.main ul.nav li.streaming span:nth-of-type(2) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/nav_streaming.png); background-size: 100%; }
#gangsta div.main ul.nav li.intro span:nth-of-type(2) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/nav_intro.png); background-size: 100%; }
#gangsta div.main ul.nav li.chara span:nth-of-type(2) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/nav_chara.png); background-size: 100%; }
#gangsta div.main ul.nav li.comment span:nth-of-type(2) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/nav_comment.png); background-size: 100%; }
#gangsta div.main ul.nav li.present span:nth-of-type(3) { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/nav_present.png); background-size: 100%; }

#gangsta div.main ul.nav li a span:nth-of-type(1) {
	opacity: 0;
	-webkit-transition: opacity .4s ease-in-out;
	transition: opacity .4s ease-in-out;
}

#gangsta div.main ul.nav li.present span:nth-of-type(1) {
	background-position: 0 -160px; opacity: 0;
	-webkit-transition: opacity .4s ease-in-out;
	transition: opacity .3s ease-in-out;
}

#gangsta div.main ul.nav li.present span:nth-of-type(2) {
	opacity: 1;
	-webkit-transition: opacity .4s ease-in-out;
	transition: opacity .4s ease-in-out;
}

#gangsta div.main ul.nav li a:hover span:nth-of-type(1) { opacity: 1; }
#gangsta div.main ul.nav li.present a:hover span:nth-of-type(1) { opacity: 1; }
#gangsta div.main ul.nav li.present a:hover span:nth-of-type(2) { opacity: 0; }


#gangsta div.cb {
	margin: 70px auto 0 auto;
	width: 1100px;
}

#gangsta div.cb.news {
	margin-top: 26px;
}

#gangsta div.cb div.cb-h {
	margin-bottom: 20px;
	text-align: left;
}

#gangsta div.cb.news div.cb-h img { width: 144px; }
#gangsta div.cb.streaming div.cb-h img { width: 309px; }
#gangsta div.cb.intro div.cb-h img { width: 394px; }
#gangsta div.cb.chara div.cb-h img { width: 352px; }
#gangsta div.cb.comment div.cb-h img { width: 268px; }
#gangsta div.cb.present div.cb-h img { width: 235px; }

#gangsta div.cb div.cb-h span {
	position: relative;
	bottom: 2px;
	display: inline-block;
	margin: 0 0 0 18px;
	font-weight: 500;
	font-size: 18px;
	line-height: 1;
	color: #d6d5b2;
}

#gangsta div.cb div.cb-f {
	position: relative;
	background-image: linear-gradient(0deg, rgba(214, 213, 178, 0) 95px, rgba(214, 213, 178, 1) 100px 80%, rgba(214, 213, 178, 0) 80%),
	url(https://image2.b-ch.com/feat/feat_gangsta2026/cb_f_t.png),url(https://image2.b-ch.com/feat/feat_gangsta2026/cb_f_b.png);
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: top center, top center, bottom center;
	padding: 1px 0;
}

#gangsta div.cb.comment div.cb-f {
	background-image: linear-gradient(0deg, rgba(214, 213, 178, 0) 95px, rgba(214, 213, 178, 1) 100px 90%, rgba(214, 213, 178, 0) 90%),
	url(https://image2.b-ch.com/feat/feat_gangsta2026/cb_f_t.png),url(https://image2.b-ch.com/feat/feat_gangsta2026/cb_f_b.png);
	background-size: 100%;
	padding-bottom: 40px;
}

#gangsta div.cb.news dl.news-itm {
	margin: 0 auto 15px auto;
	background-repeat: no-repeat;
	width: 1100px;
	padding-top: 24px;
}

#gangsta div.cb.news dl.news-itm-01 { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/news_bg_a.png); background-size: 100%; height: 130px; }
#gangsta div.cb.news dl.news-itm-02 { background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/news_bg_b.png); background-size: 100%; height: 103px; }

#gangsta div.cb.news dl.news-itm dt {
	margin: 0 auto 8px auto;
	width: 100px;
}

#gangsta div.cb.news dl.news-itm dd {
	font-weight: 500;
	font-size: 18px;
	line-height: 1.5;
}

#gangsta div.cb.news dl.news-itm dd a {
	color: #ae0a2e;
	text-decoration: underline;
}

#gangsta div.cb.news dl.news-itm dd a:hover {
	color: #fd688b;
}

#gangsta div.cb.streaming div.txt {
	margin: 55px auto 32px auto;
	font-weight: 900;
	font-size: 24px;
	line-height: 1.2;
}

#gangsta div.cb.streaming div.img {
	margin: 0 auto;
	width: 661px;
}

#gangsta div.cb.streaming div.btn {
	margin: 35px auto 40px auto;
}

#gangsta div.cb.streaming div.btn a {
	display: inline-block;
	margin: 0 auto;
	background: #150301;
	padding: 0.45em 2.5em 0.55em 2.5em;
	font-weight: 700;
	font-size: 24px;
	line-height: 1;
	color: #d6d5b2;
	transition: opacity .4s ease-in-out;
}

#gangsta div.cb.streaming div.btn a:hover {
	opacity: .7;
}

#gangsta div.cb.intro div.txt {
	margin: 50px auto;
	font-weight: 500;
	font-size: 18px;
	line-height: 1.66;
}

#gangsta div.cb.intro div.txt p {
	margin-top: 1em;
}

#gangsta div.cb.intro div.pic {
	display: flex;
	flex-wrap: wrap;
	margin: 0 auto 70px auto;
	width: 960px;
	height: 180px;
}

#gangsta div.cb.intro div.pic ul {
	width: 320px;
	height: 180px;
}

#gangsta div.cb.intro div.pic ul li {
	position: absolute;
	list-style: none;
	visibility: hidden;
	font-size: 0;
	line-height: 0;
	width: 320px;
	height: 180px;
	animation: anime_slider_fade 6s 0s infinite;
}

#gangsta div.cb.intro div.pic ul li img {
	width: 100%;
}

#gangsta div.cb.intro div.pic ul.pic-a li:nth-of-type(1) {animation-delay: 0s;}
#gangsta div.cb.intro div.pic ul.pic-a li:nth-of-type(2) {animation-delay: 3s;}
#gangsta div.cb.intro div.pic ul.pic-b li:nth-of-type(1) {animation-delay: 0.3s;}
#gangsta div.cb.intro div.pic ul.pic-b li:nth-of-type(2) {animation-delay: 3.3s;}
#gangsta div.cb.intro div.pic ul.pic-c li:nth-of-type(1) {animation-delay: 0.6s;}
#gangsta div.cb.intro div.pic ul.pic-c li:nth-of-type(2) {animation-delay: 3.6s;}

@keyframes anime_slider_fade {
	0% {
		visibility: visible;
		opacity: 0;
	}
	25% {
		opacity: 1;
	}
	50% {
		opacity: 1;
	}
	75% {
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}

#gangsta div.cb.chara div.cb-f {
	background: url(https://image2.b-ch.com/feat/feat_gangsta2026/chara_bg.png) no-repeat;
	background-size: 100%;
	min-height: 1728px;
}

#gangsta div.cb.chara dl {
	position: absolute;
	text-align: left;
}

#gangsta div.cb.chara dl.chara-a { top: 65px; left: 422px; }
#gangsta div.cb.chara dl.chara-b { top: 630px; left: 207px; }
#gangsta div.cb.chara dl.chara-c { top: 1196px; left: 423px; }

#gangsta div.cb.chara dl dt {
	font-weight: 900;
	font-size: 30px;
	line-height: 1.4;
	color: #d6d5b2;
}

#gangsta div.cb.chara dl dt span.cv {
	display: block;
	font-weight: 500;
	font-size: 18px;
}

#gangsta div.cb.chara dl dd {
	margin-top: 24px;
	font-weight: 500;
	font-size: 18px;
	line-height: 1.4;
	color: #150301;
}

#gangsta div.cb.comment div.txt {
	margin: 50px auto 30px auto;
	font-weight: 700;
	font-size: 24px;
	line-height: 1.4;
}

#gangsta div.cb.comment div.txt span.fs-p1 {
	font-weight: 900;
	font-size: 36px;
}

#gangsta div.cb.comment dl.cmt-itm {
	margin: 0 auto 25px auto;
	box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2);
	width: 998px;
	text-align: left;
}

#gangsta div.cb.comment dl.cmt-itm dt {
	background: #b5bdbb;
	padding: 13px 50px 16px 50px;
	font-weight: 900;
	font-size: 24px;
	line-height: 1.2;
	color: #6c6a6a;
}

#gangsta div.cb.comment dl.cmt-itm-3 dt {
	color: #974053;
}

#gangsta div.cb.comment dl.cmt-itm-3 dt {
	background: #cebab8;
}

#gangsta div.cb.comment dl.cmt-itm dt span.fs-m1 {
	font-weight: 700;
	font-size: 18px;
}

#gangsta div.cb.comment dl.cmt-itm dd {
	background: #f7f7f7;
	padding: 25px 35px 30px 220px;
	font-family: "Shippori Mincho", '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 1.33;
}

#gangsta div.cb.comment dl.cmt-itm-1 dd {
	background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/comment_img_chara_a.png);
	background-size: 176px;
	background-repeat:  no-repeat;
	background-position: 30px 18px;
}

#gangsta div.cb.comment dl.cmt-itm-2 dd {
	background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/comment_img_chara_b.png);
	background-size: 176px;
	background-repeat:  no-repeat;
	background-position: 30px 18px;
}

#gangsta div.cb.comment dl.cmt-itm-3 dd {
	text-align: center;
	background-image: url(https://image2.b-ch.com/feat/feat_gangsta2026/comment_img_illust.png);
	background-size: 477px;
	background-repeat:  no-repeat;
	background-position: center 128px;
	padding: 25px 35px 310px 35px;
}

#gangsta div.cb.present div.txt {
	margin: 40px auto 33px auto;
	width: 823px;
}

#gangsta div.cb.present div.img {
	position: absolute;
	top: 205px; left: 73px;
	width: 230px;
}

#gangsta div.cb.present dl.present-outline {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	margin: 0 0 0 343px;
	width: 745px;
}

#gangsta div.cb.present dl.present-outline dt {
	margin-bottom: 5px;
	background: #5d5e3a;
	border-radius: 5px;
	padding: 5px 0;
	width: 110px;
	text-align: center;
	font-weight: 700;
	font-size: 18px;
	line-height: 1.2;
	color: #fff;
}

#gangsta div.cb.present dl.present-outline dd {
	margin-bottom: 5px;
	padding-top: 5px;
	width: 617px;
	text-align: left;
	font-weight: 500;
	font-size: 18px;
	line-height: 1.2;
}

#gangsta div.cb.present dl.present-outline dd div.note {
	margin: 10px 0;
	background-color: rgba(93,94,58,.1);
	padding: 15px 20px;
	width: 432px;
	font-weight: 500;
	font-size: 15px;
	line-height: 1.6;
}

#gangsta div.cb.present dl.present-outline dd div.note span.fs-m1 {
	font-size: 12px;
}

#gangsta div.cb.present dl.present-outline dd span.fc-khaki {
	font-weight: 700;
	color: #5d5e3a;
}

#gangsta div.cb.present div.btn {
	margin: 40px auto 45px auto;
}

#gangsta div.cb.present div.btn a {
	display: inline-block;
	margin: 0 auto;
	background: #c11036;
	padding: 0.65em 3.5em 0.75em 3.5em;
	font-weight: 700;
	font-size: 24px;
	line-height: 1;
	color: #fff;
	transition: opacity .4s ease-in-out;
}

#gangsta div.cb.present div.btn a:hover {
	opacity: .7;
}

#gangsta div.cb.present ul.notice {
	margin: 0 auto 25px auto;
	border-top: 1px solid #000;
	padding-top: 25px;
	width: 945px;
}

#gangsta div.cb.present ul.notice li {
	font-weight: 500;
	font-size: 12px;
	line-height: 1.3;
}


#gangsta div.bnr-sbsc {
	margin: 80px auto 0 auto;
	background: #fff;

}

#gangsta div.bnr-sbsc,
#gangsta div.bnr-sbsc a {
	display: block;
	width: 850px; height: 162px;
	font-size: 0; line-height: 0;
}

#gangsta div.bnr-sbsc a {
	-webkit-transition: .4s ease-in-out;
	transition: .4s ease-in-out;
}

#gangsta div.bnr-sbsc a:hover {
	opacity: .7;
}

#gangsta div.copyright {
	margin: 0 auto;
	padding: 65px 0 50px 0;
	width: 100%;
	text-align: center;
	font-weight: 300;
	font-size: 12px;
	transform: rotate(-0.05deg);
	line-height: 1.5;
	color: #fff;
}

/* FOOTER */
.bch-l-wrapper {
	position: relative;
}
