@charset "utf-8";

/* reset */
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,#header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,#header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}

/* clearfix */
.clearfix:after,.clearfix:before{display:table;content:" "}.clearfix:after{clear:both}

/* base
==================================== */
* { margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; }
html { height: 100%; }
body {
	min-height: 100%;
	background: no-repeat center center fixed;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	background-size: cover;
	color: #151515;
	font-family: Helvetica, Arial, 'メイリオ', Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
	font-size: 14px;
	line-height: 1.7;
	letter-spacing: 0em;
}
img { max-width: 100%; transition: all .3s ease; }

a { color: inherit; text-decoration: underline; }
a:hover { text-decoration: none; }
a, a::before, a::after { transition: all .3s ease; }
p::selection { background: #000; color: #fff; }
a, input, img { outline: 0; }

#wrap { padding: 0 0 100px; }

/* font */
#header,
#gNav,
#footer,
.pageTit,
.sectionTit,
.new,
.date,
.cat,
.new,
.categoryList,
.num,
.qa .detail .tit::before,
.qa .detail .txt::before,
#bbs h3,
.charset,
.home .scroll{
	font-family: 'Quicksand', sans-serif;
	text-transform: lowercase;
}
.qa .detail .txt::before{text-transform:inherit;}

/* テキスト装飾 */
.bold	{ font-weight:bold; }
.center	{ text-align:center; }
.underline	{ text-decoration: underline; }
.lineThrough{ text-decoration:line-through; }
b {
	font-weight: bold !important;
}
/* 文字カラー */
.rule{ color:#3366cc; font-size:14px;}
.note{ color:#ff3300; }
.red { color:#FF1000; }
.blue{ color:#005BBF; }

/* btn */
.btn { text-align: center; }
.btn a,
.btn input,
.btn button {
	display: inline-block;
	width: auto;
	min-width: 250px;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	border-radius: 23px;
	cursor: pointer;
	padding:10px 15px;
	margin: 0 auto 10px;
	transition: all .3s ease;
}
.btn .main { background:#151515; border:solid 1px #151515; color: #FFF; }
.btn .main:hover { background: #fff; color:#151515; border-color: inherit; }
.btn .sub { background: #fff; color: inherit; border: 1px solid; }
.btn .sub:hover { background: #151515; color: #fff; border-color: #151515; }
.btn button:not(class) { background:#151515; border:solid 1px #151515; color: #FFF; }
.btn button:not(class):hover { background: #fff; color:#151515; border-color: inherit; }

.btn .back {
	width: 120px;
	margin: 30px auto 0;
	padding: 7px 5px;
	font-size: 12px;
}

/* header
------------------------------------ */
#header {
	width: 100%;
	min-width: 1000px;
	height: 75px;
	color: #FFF;
	margin: 0 0 40px;
	position: relative;
	z-index: 100;
}
#header h1 {
	width: 223px;
	background: transparent;
	position: absolute;
	top: 30px;
	left: 30px;
}
#header .userArea {
	font-size: 11px;
	text-shadow: 0 0 3px rgba(0,0,0,0.9);
	position: absolute;
	right: 20px;
	top: 12px;
}
#header .loginNav {
	width: 300px;
	position: absolute;
	right: 20px;
	bottom: 0;
}
#header .loginNav li { width: 140px; float: left; }
#header .loginNav li:first-child { margin: 0 5px 0 0; }
#header .loginNav a {
	display: block;
	height: 32px;
	background: #151515;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	line-height: 30px;
	border-radius: 16px;
	border: solid 1px #151515;
	padding: 0 10px;
}
#header .loginNav a::before{
	color: #fff;
	font-family: 'WebHostingHub-Glyphs';
	font-size: 12px;
	font-weight: normal;
	line-height: 0;
	margin: 0 5px 0 0;
}
#header .loginNav .mypage a::before { content: '\f040'; }
#header .loginNav .logout a::before { content: '\f324'; }
#header .loginNav .join a::before { content: '\f093'; }
#header .loginNav .login a::before { content: '\f0bf'; }
#header .loginNav a:hover { background: #fff; color: #151515; }
#header .loginNav a:hover::before { color: #151515; }

/* メール送信エラー */
.mailerror {
	width: 100%;
	background: #fff78c;
	color: #f00;
	position: relative;
	z-index: 100;
	padding: 5px 160px 5px 20px;
}
.home .mailerror { position: fixed; left: 0; top: 0; }
.mailerror .tit { font-size: 12px; font-weight: bold; }
.mailerror .txt { font-size: 12px; margin: 0; }
.mailerror .btn { margin: 0; }
.mailerror .btn .main {
	min-width: 150px;
	background: #f00;
	border-color: #f00;
	font-size: 12px;
	line-height: 20px;
	position: absolute;
	right: 10px;
	top: 5px;
}
.mailerror .btn .main:hover { background: #fff; color: #f00; }

/* ログインボタン下アイコン */

.formArea .supportList .pw a:before,
.formArea .supportList .faq a:before { display: none; }

/* gNav
------------------------------------ */
#gNav {
	width: 100%;
	text-align: center;
	position: fixed;
	left: 0;
	bottom: 30px;
	z-index: 97;
}
#gNav ul {
	min-width: 1000px;
	background: rgba(0,0,0,0.5);
	padding:15px 0;
}
#gNav li { display: inline-block; padding: 0 25px; }
#gNav a {
	display: inline-block;
	color: #FFF;
	font-size: 16px;
	font-weight: bold;
	text-decoration: none;
	line-height: 30px;
	position: relative;
}
#gNav a::before {
	content: '';
	display: block;
	width: 0;
	height: 2px;
	background: #fff;
	position: absolute;
	left: 0;
	bottom: -5px;
	transition: all .3s ease;
}
#gNav a.current::before,
#gNav a:hover::before { width: 100%; }

/* footer
------------------------------------ */
#footer {
	width: 100%;
	min-width: 1000px;
	height: 38px;
	background: #151515;
	color: #999;
	padding: 0;
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 3;
}
#footer .supportNav { position:absolute; left:30px; }
#footer .supportNav li {
	display: inline-block;
	font-size: 11px;
	line-height: 30px;
	padding: 0;
}
#footer .supportNav li:not(:last-child)::after {
	content: '｜';
	padding: 0 0 0 3px;
	opacity: 0.5;
}
#footer .supportNav li a { text-decoration: none; }
#footer .supportNav li a:hover { color: #fff; }
#footer .copyright {
	font-size: 10px;
	font-weight: bold;
	line-height: 14px;
	position: absolute;
	right: 30px;
	top: 7px;
    float: left;
}

/* 共通パーツ
================================= */
section{
	width:800px;
	background: #fff;
	padding: 50px;
	margin: 0 auto 30px;
	position: relative;
}
.pageTit {
	font-size: 50px;
	font-weight:bold;
	text-align: center;
	text-shadow: 0 0 20px rgba(255,255,255,0.9);
	letter-spacing: -0.02em;
	padding: 0 0 30px;
}
.sectionTit {
	font-size: 30px;
	font-weight: bold;
	line-height: 1;
	padding: 0 0 30px;
	position: relative;
}
.txt { margin: 0 0 10px; }
.subTxt { font-size: 0.8em; }

.goldkey img,
.silverkey img { display: none; }

.goldkey::before,
.silverkey::before {
	content: '\f093';
	font-family: 'WebHostingHub-Glyphs';
	font-size: 10px;
	font-weight: normal;
	padding: 0 2px 0 0;
}
.goldkey	{ color: #cbb159; }
.silverkey	{ color: #abaaaa; }

/* home
======================================= */
.home #wrap { padding: 0; }
.home #header { position: fixed; left: 0; z-index: 100; }
.home #gNav { padding-top: 100vh; margin-bottom: -30px; position: relative; }
.home #gNav ul { width: 100%; position: absolute; bottom: 0; left: 0; }

/* scroll */
.home .scroll {
	width: 30px;
	height: 50px;
	color: #fff;
	border-radius: 15px;
	border: 2px solid;
	margin: 0 0 0 -15px;
	position: fixed;
	left: 50%;
	bottom: 120px;
	z-index: 0;
}
.home .scroll::before {
	content: 'scroll';
	font-size: 10px;
	font-weight: bold;
	letter-spacing: 0.1em;
	position: absolute;
	left: 0;
	top: -22px;
}
.home .scroll::after {
	content: '';
	width: 2px;
	height: 6px;
	background: #fff;
	border-radius: 2px;
	position: absolute;
	left: 13px;
	top: 6px;
	animation: scroll 1.2s ease-out 0s infinite;
}
@keyframes scroll {
	0% { height: 6px; top: 6px; }
	30% { height: 20px; top: 6px; }
	60% { height: 6px; top: 20px }
	80% { height: 6px; top: 6px }
}

/* banner */
.home .flexWrap {
	width: 100%;
	height: 80vh;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 98;
	overflow: hidden;
}
.home .flexslider {
	width: 750px;
	height: 300px;
	margin: 0 auto;

	position: absolute;
    top: 60%;
    left: 150%;
    margin: -150px 0 0 -375px;
    z-index: 2;
	transition: all .5s ease-out;
}
.home .flexslider.visible { left: 50%; }

/* contents */
.home .section {
	width:100%;
	background: url(/static/backnumber/fanclub-pc/cmn/bg_cont.jpg) repeat left top;
	color: #fff;
	padding: 0;
	position: relative;
	z-index: 2;
}
.home .section .inner {
	width: 960px;
	padding: 40px 0 60px;
	margin: 0 auto;
}
.home .section { width: auto; margin: 0; }
.home .sectionTit {
	font-size: 30px;
	font-weight: bold;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
	padding: 0 0 25px;
	position: relative;
}
.home .sectionTit span { font-size:11px; position: relative; top: -4px; }
.home .topics {
    border-bottom: 1px solid rgb(19, 10, 1);
    box-shadow: 0 1px 0 rgb(90, 78, 64);
	padding: 0 0 40px;
	margin: 0 0 30px;
}
.home .news, .home .blog {
	width:460px;
	position:relative;
}
.home .news { float: left; }
.home .blog { float: right; }

/* list */
.home .infoList { border: none; }
.home .infoList dt {
	width: 80px;
	clear: left;
	float: left;
	font-size: 12px;
	color: #fff;
	vertical-align: top;
}
.home .infoList dd {
	font-size:13px;
	line-height: 1.7;
	padding: 0 0 0 80px;
	margin: 0 0 15px;
}
.home .infoList a {
	display: block;
	background: url(/static/backnumber/fanclub-pc/cmn/ico_topic_arrow.png) no-repeat -20px 3px;
	text-decoration: none;
	border: none;
	padding: 0 17px 0 0;
}
.home .infoList a:hover {
	background-color: transparent;
	background-position: 0 3px;
	padding: 0 0 0 17px;
	opacity: 0.6;
}
.home .list .tit { font-size: 13px; }
.home .topics .infoList li a::before { content: none; }
.home .blog .tit { visibility: hidden; }
.home .more a {
	font-size:11px;
	text-align: right;
	padding: 0 10px 0 0;
	position:absolute;
	top: 10px;
	right: 0;
}
.home .more a:hover { padding-right: 0; }


/* information
======================================= */
.list a { display: block; text-decoration: none; }
.list .tit { font-size: 16px; line-height: 1.4; }
.list .date {
	display: inline-block;
	color: #999;
	font-size: 13px;
	letter-spacing: 0.1em;
	margin: 0 0 10px;
}
.list .cat {
	display: inline-block;
	font-size: 10px;
	line-height: 17px;
	border-radius: 2px;
	border: 1px solid;
	padding: 0 5px;
	margin: 0 5px;
}
/* infoList
-------------------------------- */
.infoList { border-top:solid 1px #ddd; }
.infoList li a {
	padding: 25px 50px 25px 0;
	border-bottom: solid 1px #ddd;
	position:relative;
}
.infoList li a::before {
	content: '\f488';
	font-family: 'WebHostingHub-Glyphs';
	font-weight: normal;
	line-height: 0;
	position: absolute;
	top: 50%;
	right: 0;
	opacity: 0;
}
.infoList li a:hover {
	background-color: rgba(90,90,90,0.1);
	padding: 25px 30px 25px 20px;
}
.infoList li a:hover::before { right: 15px; opacity: 0.6; }
.infoList .thumb {
	width: 100px;
	float: left;
	line-height: 0;
	margin: 0 20px 0 0;
}
.nodata { text-align: center; line-height: 100px; }
.new {
	display: inline-block;
	color: #E57F0C;
	margin: 0 0 0 3px;
	padding: 0 2px;
}
/* shareList */
.shareList{
	color: #000;
	font-size: 10px;
	text-align: right;
	margin: 0 auto 20px;
	position: relative;
}
.shareList ul{ display: inline-block; position: relative; }
.shareList li{ display: inline-block; margin-right: 5px;vertical-align: middle;}
.shareList a{
	display: block;
	background: none;
	line-height:30px;
	text-align: center;
	color:#000;
	font-size: 16px;
	position: relative;
	margin-bottom: 3px;
}
.shareList .fa{vertical-align:-2px;}
.shareList .facebook .fa{ position: relative; left: -1px; }
.shareList .line{ display: none; }

/* parts
-------------------------------- */
.loading { 	text-align: center; padding: 30px 0; }

/* more */
.more a {
	font-size: 13px;
	text-decoration: none;
	position: absolute;
	top: 50px;
	right: 50px;
}
.more a::after{
	content: '\f488';
	color: #999;
	font-family: 'WebHostingHub-Glyphs';
	font-size: 0.8em;
	font-weight: normal;
	padding: 0 2px 0 5px;
	vertical-align: -1px;
}
.more a:hover { opacity: 0.6; }
/* back */
.back a,
.bbs .back input.sub {
	display: block;
	width: 150px;
	text-align: center;
	line-height: 40px;
	border-radius: 20px;
	margin: 40px auto 0;
	border: 1px solid;
	text-decoration: none;
}
.bbs .back .sub,
.bbs .back input.sub { background: none; margin: 10px auto 0; }
.back a:hover:hover,
.bbs .back input.sub:hover { background: #151515; color: #FFF; }

/* thumbList
-------------------------------- */
.thumbList {
	display: -webkit-flex;
	display:flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
.thumbList li {
	width: 290px;
	float: left;
	padding: 0;
	margin: 0 15px 15px 0;
}
.thumbList li:nth-child(3n) { margin-right: 0; }
.thumbList li a {
	height: 100%;
	background: #fff;
	border: none;
	padding: 25px;
}
.thumbList li a:hover {
	background: rgba(227,227,227,0.9);
	text-decoration: none;
}
.thumbList li .thumb img {
	width: 100%;
	height: 168px;
	background: #151515 no-repeat center center;
	background-size: contain;
	margin: 0 0 10px;
}

/* categoryList
-------------------------------- */
.categoryList { text-align: center; margin: 0 0 30px; }
.categoryList li { display: inline-block; }
.categoryList li a {
	display: block;
	min-width: 100px;
	background: #fff;
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
	line-height: 38px;
	border-radius: 20px;
	border: 1px solid;
    padding: 0 11px;
    margin: 0px 4px;
	text-transform: initial;
}
.categoryList li.current a,
.categoryList li a:hover { background: #151515; color:#FFF; border: 1px solid #151515; text-transform: initial;}

/* pager
-------------------------------- */
.pageNav { padding: 20px 0 0; }
.pageNav li {
	display: block;
	float: left;
	width: 33.3%;
	width: calc(100% / 3);
	text-align: center;
	line-height: 40px;
}
.pageNav li span,
.pageNav li a {
	display: block;
	position: relative;
}
.pageNav li span { opacity: 0.2; }
.pageNav li a:hover { opacity: 0.6; text-decoration: none; }
.pageNav li span:after,
.pageNav li a:after {
	font: normal normal normal 30px FontAwesome;
	line-height: 0;
	position: absolute;
	top:50%;
}
.pageNav li:first-child span:after,
.pageNav li:first-child a:after { content: "\f104"; left: 0; }
.pageNav li:last-child span:after,
.pageNav li:last-child a:after { content: "\f105"; right: 0; }

/* detail
-------------------------------- */
.detail .date {
	display: inline-block;
	color: #999;
	letter-spacing: 0.1em;
	margin: 0 0 20px;
}
.detail .tit {
	font-size: 22px;
	font-weight:bold;
	margin: 0 0 20px;
}
.detail .cat {
	display: inline-block;
	line-height: 18px;
	border-radius: 3px;
	border: 1px solid;
	padding: 0 5px;
	margin: 0 5px;
}
.detail .txt  { position: relative; }
.detail .ph { text-align: center; margin: 0 0 30px; position: relative; }
.detail .cover {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}
.detail iframe {
	width: 100%;
	height: 393px;
	margin: 30px auto;
}
.section.detail .q::before {
	content: 'Q.';
	color: #ba8a6f;
	text-transform: inherit;
	margin: 0 10px 0 0;
}
.detail .a { padding: 0 0 0 30px; }
.detail .a::before {
	content: 'A.';
	color: #ba8a6f;
	font-weight: bold;
	text-transform: uppercase;
	position: absolute;
	left: 0;
	top: 0;
}

/*movie
======================================= */

/* pulldownBox */
.pulldownBox{ 
	padding: 3px 0;
	position: relative;
	margin: 0 auto 20px;
	width: 280px;
	}
.pulldownBox select{
	-webkit-appearance: none;
	-moz-appearance: none;
	width: 100%;
	background: #fff;
	position: relative;
	margin: 0;
	border-radius: 4px;
	padding: 1em 4em 1em 2em;
	font-size: 16px;
	/* font-weight: bold; */
	text-align: left;
	text-transform: none;
}
.pulldownBox select.categoryList{ margin: 0; }
.pulldownBox::before{
	display: block;
	width: 14px;
	height: 14px;
	content: '\f48b';
	font-family: 'WebHostingHub-Glyphs';
	font-weight: normal;
	line-height: 100%;
	position: absolute;
	top: 50%;
	right: 1em;
	z-index: 10;
	margin-top: -6px;
	text-transform: initial;
}

.movie section:not(.detail) {
	width: 900px;
	background: transparent;
	padding: 0;
}

.movie .thumbList li{
	width: 288px;
}
.movie .thumbList li .thumb img{
	background-size: cover;
	background-color: #fff;
}
.movie .thumbList li .cat {
	display:block;
	color:#4F2210;
	font-size:26px;
	font-weight:bold;
	text-decoration:none;
	letter-spacing:-0.03em;
	line-height:1.3em;
	border: none;
	padding: 0;
	margin: 0 0 10px;
}
.movie .thumbList .cat::before {
	font-family: 'WebHostingHub-Glyphs';
	font-size: 0.8em;
	vertical-align: -3px;
	margin: 0 5px 0 0;
}
.movie .thumbList .comment::before { content: '\f12d'; }
.movie .thumbList .TV::before { content: '\f1a4'; }
.movie .thumbList .staff::before { content: '\f133'; }
.movie .thumbList .challenge::before{ content: '\f13a'; }
.movie .thumbList .challenge::before{ content: '\f13a'; }
.movie .thumbList .cat.category-5::before, .movie .thumbList .cat.category-17::before {
	content:'';
	display: inline-block;
	width: 26px;
	height: 26px;
	vertical-align: -6px;
	background: url('/static/backnumber/fanclub-pc/movie/ico--member-movie.png') no-repeat center;
	background-size: contain;
 }


.flashDL {
	width:620px;
	background: #FFFCE9;
	padding: 10px;
	margin: 0 auto 20px;
}
.flashDL a {
	display: block;
	width: 112px;
	height: 28px;
	float: left;
	margin: 0 5px 0 0;
}
.flashDL p {
	font-size: 11px;
	line-height: 1.3em;
	padding: 0 0 0 120px;
}

body.movie #gNav,
body.movie .cat{
text-transform: initial;
}


.page--movie.new-movie #wrap .section--detail .area--more-info {
    margin: 20px auto;
}

.page--movie.new-movie #wrap .section--detail .area--more-info .block--tab__main .block--more_movies .list--contents li a {
    text-decoration: none;
}

.page--movie.new-movie #wrap .section--detail .area--more-info .block--tab__main .block--more_movies .list--contents li .tit {
    font-size: 15px;
    margin: 0;
    line-height: 1.5;
}

.page--movie.new-movie #wrap .section--detail .area--more-info .block--tab__main .block--more_movies .list--contents li .list__txt {
    width: 70%;
}

.page--movie.new-movie #wrap .section--detail .area--movie .vjs-big-play-centered .vjs-big-play-button {
    margin: 0;
    transform: translate(-50%, -50%);
}

.page--movie.new-movie #wrap .section--detail .comment {
    margin-bottom: 25px;
    font-size: 13px;
}



/* lyrics
======================================= */
/* list */

.lyrics {
	-ms-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}

.lyrics .searchBox {
	width: 560px;
	text-align: center;
	margin: 0 auto 40px;
	border: none;
	background: none;
}
.lyrics .searchBox select { width: 160px; height: 30px; }
.lyrics .searchBox input[type="text"] {
	width: 300px;
	height: 30px;
	border-radius: 5px;
	border: 1px solid #aaa;
	line-height: 1;
	vertical-align: -1px;
}
.bbs section .searchArea .searchBtn,
.lyrics .searchBox .searchBtn {
	background: #151515;
	font-size: 11px;
	color: #FFF;
	line-height: 30px;
	border: 1px solid #151515;
	padding: 0 20px;
	border-radius: 15px;
	cursor: pointer;
	transition: all .3s ease;
	width: auto;
	position: static;
	font-family: Helvetica, Arial, 'メイリオ', Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
}
.bbs section .searchArea .searchBtn:hover,
.lyrics .searchBox .searchBtn:hover { background: #fff; color: #151515; }

/* detail */
.lyrics .sectionTit { font-size: 22px; }
.lyrics .detail .credit { font-size: 12px; margin: 0 0 40px; }



/* room#783
======================================= */
.attentionList { background: rgba(255,250,214,0.8); padding:15px; margin-bottom:20px; }
.attentionList li { margin-bottom: 15px; font-size: 12px; }
/* list */
.qa .sectionTit,
.bbs .sectionTit {
	font-size: 22px;
	border-bottom: solid 1px rgba(60,60,60,0.6);
	padding: 0 0 20px;
}
.qa .box { border: 1px solid; padding: 20px; margin: 30px 0; }
.qa .listTit {
    font-size: 18px;
    font-weight: bold;
	margin-top: 30px;
    padding-bottom: 10px;
}
.qa .infoList .num {
	float: left;
	font-size: 18px;
	font-weight: bold;
	line-height: 1.2;
	margin-right: 10px;
	text-transform: uppercase;
}
.qa .infoList .date,
.qa .infoList .tit { display: block; }
/* detail */
.qa .detail .tit,
.qa .detail .txt { font-size: 18px; }
.qa .qName {
	font-size: 14px;
    display: block;
    text-align: right;
    padding-top: 10px;
}
.qa .pageNav li:last-child {
    float: right;
}



/* blog
======================================= */
.blog .sectionTit { float: left; }
.blog .categoryList { text-align: left; padding: 0 0 0 220px; }
.blog .categoryList li a {
	min-width: 80px;
	font-size: 12px;
	text-align: center;
	line-height: 26px;
    border-radius: 13px;
    padding: 0px 10px;
}
.blog .infoList { clear: left; }
.blog .detail .txt { padding-bottom: 20px; }
.blog .detail .txt div { margin: 0 0 10px; }

.blog .post { margin: 0 0 10px; font-weight: bold; }
.blog form { margin: 0 0 20px;}
.blog #form_body {
	width: 100%;
	height: 180px;
	border-radius: 4px;
	padding: 10px;
	margin: 0 0 20px;
}
.blog .comment { padding: 0 0 10px; border-bottom: 1px solid #ddd; }
.blog .comment p { display: inline-block;; font-weight: bold; }
.blog .commentList .name { margin: 0 0 15px; }
.blog .commentList .commentTxt { margin: 0 0 10px; }
.blog .commentList .date { margin: 0; }
.blog .commentList li { padding: 20px 0; border-bottom: 1px solid #ddd; }
.blog .pageList { padding-top: 20px; text-align: center;}
.blog .formList dt { margin: 0 0 5px; }
.blog .formList dd { margin: 0 0 15px; }
.blog .formList p { margin: 0 0 15px; }
.blog .formList dd:first-of-type { font-weight: bold; }
.blog .completeTxt { margin: 0 0 20px; }

.blog.pageNav{ text-align: center; }
.blog.pageNav li{
	display: inline-block;
	width:30px;
	float: none;
}
.blog.pageNav li a{ color: #999; text-decoration: none;}
.blog.pageNav li span{ opacity: 1; color: #000;}
.blog.pageNav li.prev,
.blog.pageNav li.next{ width: 20px;vertical-align: -5px; }
.blog.pageNav li.prev+li.prev{ margin-right: 15px; }
.blog.pageNav li.next{ margin-left: 15px; }
.blog.pageNav li.next+li.next{ margin-left: 0; }
.blog.pageNav li.prev a,
.blog.pageNav li.next a,
.blog.pageNav li.prev span,
.blog.pageNav li.next span{
	display: block;
	height: 21px;
	line-height: 0;
	vertical-align: bottom;
}
.blog.pageNav li a:after,
.blog.pageNav li span:after{ font-size: 20px;}
.blog.pageNav li.prev span::after,
.blog.pageNav li.next span::after{ color: #ddd; }

.blog.pageNav li.prev a:after,
.blog.pageNav li.prev span:after{ content: "\f100"; }
.blog.pageNav li.prev+ li.prev a:after,
.blog.pageNav li.prev+ li.prev span:after{ content: "\f104"; }

.blog.pageNav li.next a:after,
.blog.pageNav li.next span:after{ content: "\f105"; }
.blog.pageNav li.next+ li.next a:after,
.blog.pageNav li.next+ li.next span:after{ content: "\f101"; }

.blog.pageNav li a:hover{ color: #000; opacity:1; }
.blog.pageNav li a:hover::after{ color: #000; opacity:1; }
.blog .detail .txt *{ word-break: break-all; white-space: normal !important; }


/* question
======================================= */
.questionnaire .subTit {
	font-size: 2em;
	font-weight: bold;
	border-bottom: solid 1px rgba(60,60,60,0.6);
	padding: 0 0 10px;
	margin: 0 0 30px;
	position: relative;
}
.questionnaire .txt,
.questionnaire .lead_txt_box  { margin: 0 0 30px; }


#questionnaire_form .formList { border-top: none; }
#questionnaire_form dt{
	width: auto;
	float: none;
	text-align: left;
	font-size: 13px;
	padding: 0;
	margin: 0 0 10px;
	font-weight: normal;
}
#questionnaire_form dd{
	padding: 0;
	border-bottom: none;
	margin: 0 0 40px;
}
.formList textarea{ border-radius: 4px; }
#questionnaire_form .formList.confirm dt{ font-size: 11px; color: #333; }
#questionnaire_form .formList.confirm dd{ min-height: inherit; }


/* faq
======================================= */
.faq .sectionTit {
	color: #151515;
	text-align: center;
	font-size: 25px;
	font-weight: bold;
	padding-bottom: 20px;
}
/* list */
.faq .faqList { padding: 0 0 30px; border-bottom: 1px solid #666; }

.faq .faqList dt {
	font-weight: bold;
	font-size: 16px;
	padding: 25px 0 0;
}
.faq .faqList a { display: block; text-decoration: none; padding: 8px 0; text-decoration: none;}
.faq .faqList a:hover { opacity: 0.6; }
.faq .faqList .num { margin-right: 5px; float: left; font-weight: bold; text-transform: uppercase; }
.faq .faqList p.num::before {
	counter-increment: count-number;
    content: "Q"counter(count-number)".";
}
dl { counter-reset: count-number; }
.faq .faqList .tit { padding: 0 0 0 30px; }
.searchBox {
	width: 420px;
	position: relative;
	margin:20px auto 20px;
	background: #fff;
	border: solid 1px #aaa;
	border-radius: 5px;
}
.searchBox input {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	outline: none;
	font-size: 15px;
	line-height: 1.4em;
	box-sizing: border-box;
}
.searchBox input[type="text"] {
	width: 90%;
	height: 40px;
	margin: 0;
	padding: 0 10px;
	background: #fff;
	border:none;
	border-radius: 5px;
}
.searchBox input[type="text"]:placeholder-shown { color: #ccc;}
.searchBox input[type="text"]::-webkit-input-placeholder { color: #ccc;}
.searchBox input[type="submit"]{
	position: absolute;
	right: 0;
	top: 0;
	width: 40px;
	line-height: 40px;
	font-size: 20px;
	color: #999;
	background: transparent;
	font-weight: bold;
	border-radius: 30px;
	cursor: pointer;
	border: none;
	z-index: 2;
	font-family: FontAwesome;
}
.searchBox input[type="submit"]:hover { color: #222;}
.searchBox input[type="text"]:placeholder-shown { color: #ccc!important;}


/* detail */
.faq .detail .subTxt { margin: 30px 0; }


/* contact
------------------------------- */
.formArea ul.subTxt li{ text-indent: -1em;padding-left: 1em; margin-bottom: 10px; }
.errorList{
	background: #ffd1d1;
	padding: 20px;
	color: #f00;
	margin-bottom: 30px;
}
.errorList li:not(:last-child){ margin-bottom: 10px;}

/* bbs
------------------------------- */

.comment { margin: 0; }
.comment i { padding: 0 5px; }
.bbs .detail section.bbsInner { padding: 7.5em 0 3.5em; }
.bbs .detail section.bbsInner .contentsList,
.bbs.detail section.bbsInner .commentList,
.bbs .detail section.bbsInner .pagingBox { padding-right: 5%; padding-left: 5%; }
.bbs section .attention { font-size: 0.8em; color: #ddd; }
.bbs section .attention li {
	text-indent: -0.8em;
	padding: 0 0 0.8em 1.5em;
	box-sizing: border-box;
	line-height: 1.4;
}
.bbs section .searchArea {
	width: 100%;
	text-align: center;
	padding: 0 0 40px;
	border-bottom: 1px solid #ddd;
}
.bbs section .threadSearch { display: inline-block; }
.bbs section .threadSearch .searchCat { display: none; margin: 0 0 5px; }
.bbs section .threadSearch .searchForm { display: inline-block; }
.bbs section .threadSearch .searchForm input[type=text]{
	width: 300px;
    height: 30px;
    border-radius: 5px;
	border: 1px solid #aaa;
}
.bbs section .threadSearch .searchForm input[type=submit]{
	font-family: FontAwesome;
	width: 30px;
	padding: 9px 0 0px 0;
	box-sizing: border-box;
	background-color: #fff;
	color: #ddd;
	font-size: 17px;
	border: none;
	float: left;
	cursor: pointer;
}
.bbs section .threadSort { display: inline-block; width: 160px; height: 30px; }
.bbs section .threadSort .select { display: inline-block; position: relative; margin: 0; }
.bbs section .threadSort select { width: 160px; height: 30px; }
.bbs section .contentsList li { margin: 0; box-sizing: border-box; position: relative; }
.bbs section .contentsList li .tit { font-size: 16px; line-height: 1.4; }
.bbs section .contentsList .threadTit li .tit { font-size: 22px; line-height: 1.5; }
.bbs section .contentsList li .date{ color: #999; margin: 0; }
.bbs section .contentsList li a{
	display: block;
	text-decoration: none;
	padding: 20px 0;
	border-bottom: 1px solid #ddd;
	position: relative;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
}
.bbs section.detail .contentsList { margin: 0 0 10px; }
.bbs section.detail .contentsList li .threadTit figure {
	width: 100%;
	line-height: 0;
	margin: 0 0 20px;
	position: relative;
}
.bbs section .contentsList li a:hover { background-color: rgba(90,90,90,0.1); padding: 20px 30px 20px 20px; }
.bbs section .contentsList li a::after {
	content: '\f488';
	font-family: 'WebHostingHub-Glyphs';
	font-weight: normal;
	line-height: 0;
	position: absolute;
	top: 50%;
	right: 0;
	opacity: 0;
}
.bbs section .contentsList li a:hover::after { right: 15px; opacity: 0.6; }
.bbs section.detail .contentsList li .threadTit figure img{
	width: 100%;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}
.bbs section.detail .contentsList li .threadTit .comment{ font-size: 16px; padding: 0 5px 0 0; box-sizing: border-box; }
.bbs section.detail .sortBox { margin: 0 0 10px;}
.bbs section.detail .sortBox li { display: inline-block; font-size: 0.8em; }
.bbs section.detail .sortBox li a,.bbs.detail section .sortBox li .current{
    box-sizing: border-box;
    border-right: 1px solid #999;
    margin: 0 10px 0 0;
    padding: 0 10px 0 0;
}
.bbs section.detail .commentList { display: block; margin: 0 0 3em; }
.bbs section.detail .commentList:first-child { padding-top: 10px; border-top: 1px solid #ddd; }
.bbs section.detail .commentList li {
	padding: 0;
	box-sizing: border-box;
	margin: 0 0 1.5em;
	border-bottom: 1px solid #ddd;
	position: relative;
}

.bbs section.detail .icon img {
	background-image: url('/static/backnumber/fanclub-pc/cmn/icon_user.svg');
	background-size: cover;
	background-position: center;
	width: 100%;
	border: 1px solid #ddd;
	border-radius: 50%;
	box-sizing: border-box;
}
.bbs section.detail .commentTit { padding: 0 0 10px; margin: 0 0 20px; border-bottom: 1px solid #ddd; }
.bbs section.detail .commentTit p { font-weight: bold; }
.bbs section.detail .commentList li .report {
	line-height: 1;
	right: 0;
	top: 0;
	position: absolute;
}
.bbs section.detail .commentList li .report a { color: #999; font-size: 10px; }
.bbs section.detail .commentList li .commentTxt { padding: 0 0 1.5em; margin: 0 0 0 47px; }
.bbs section.detail .commentList li .commentTxt .name { margin: 0 0 10px; line-height: 2; }
.bbs section.detail .commentList li .commentTxt figure { margin: 0 0 1em; line-height: 0; position: relative; }
.bbs section.detail .commentList li .commentTxt .txt { margin: 0 0 5px; line-height: 1.8; word-break: break-all; }
.bbs section.detail .commentList li .commentTxt .date { font-size: 0.8em; text-align: left; color: #999; margin: 0 ; }
.bbs section.detail .commentPost { margin: 0 0 1em; }
.bbs section.detail .commentPost .formList dd.imgSelect { font-size: 12px; }
.bbs section.detail .commentPost .formList dd.imgSelect input { height: auto; -webkit-appearance: none; font-size: 12px; border: none; }
.bbs section.detail .reportName .name { font-size: 1.2em; margin: 0 0 1em; }

.bbs section.detail .commentPost .formList.bbsComment { margin: 0 0 20px; position:relative; }
.bbs section.detail .commentPost .formList .imgSelect { font-size: 12px; }
.bbs section.detail .commentPost .formList label {
	display: block;
	color: #999;
	font-size: 1.8em;
	line-height: 0;
	margin: 0 0 10px;
}
.bbs section.detail .commentPost .formList label i { font-size: 0.6em; }
.bbs section.detailsection .commentPost .formList label .phCapture input { border: none; font-size: 10px; padding: 0; }
.bbs section.detail textarea{
	width: 100%;
	font-size: 14px;
    padding: 5px;
    border: 1px solid #151515;
}
.bbs section.detail .form_box .comment_form .formList dt,
.bbs section.detail .commentPost.confirm dt { margin: 0 0 10px; }
.bbs section.detail .commentPost.confirm dt span { margin-left: 5px; color:#FF0000; }
.bbs section.detail .form_box .comment_form .formList dd,
.bbs section.detail .commentPost.confirm .formList dd { margin: 0 0 15px; word-break: break-all; }
.bbs section.detail .form_box .comment_form .formList dd:first-of-type,
.bbs section.detail .commentPost.confirm .formList dd:first-of-type { font-size: 16px; font-weight: bold; margin: 0 0 15px; }
.blog section.detail .btn .main,
.bbs section.detail .btn .main { margin: 0; }
.blog section.detail .btn + .btn,
.bbs section.detail .btn + .btn { margin-top: 20px; }
.bbs section.detail .commentPost .formList dd input[type=submit]{ margin: 0; }
.bbs section .icon {
	display: block;
    float: left;
    width: 30px;
    height: 30px;
    background: #fff;
    border-radius: 50%;
}
.bbs section .formList .postName{ padding: 4px 0 10px; margin-left: 40px; margin-bottom: 5px; }
.bbs section.detail .formList .postName { font-weight: bold; padding: 4px 0 10px; margin-bottom: 10px; }

.bbs section.detail .threadLead{ margin: 0 0 20px; }

.bbs section.detail .contentsList li .threadTit figure a {
	display: block;
	width: 100%;
	height: 100%;
	bottom: 0;
	position: absolute;
	padding: 0;
}
.bbs section.detail .contentsList li .threadTit figure .circle {
	height: 30px;
	width: 30px;
	background-color: rgba(0, 0, 0, 0.4);
	border-radius: 50%;
	text-align: center;
	position: absolute;
	right: 10px;
	bottom: 10px;
}
.bbs section.detail .contentsList li .threadTit figure .circle:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.bbs section.detail .contentsList li .threadTit figure i {
	font-size: 30px;
	line-height: 30px;
	color: #fff;
	position: relative;
	left: 1px;
}
.bbs section.detail .contentsList li .threadTit .date { margin: 0 0 10px; }
.bbs section.detail .errorTxt,
.bbs section.detail .lead,
.blog section.detail .lead { margin: 0 0 25px; font-weight: bold; }
.bbs .attention .tit { font-size: 14px; }
.bbs .sectionTit{ margin-bottom: 20px; }
.noData{ padding-top: 30px; text-align: center; }

/* support
======================================= */
.support { font-size: 13px; }
.support .sectionTit { text-align: center; border-bottom: 1px solid; margin: 0 0 30px; }
/* 規約 */
.termsList dt {
	font-size: 14px;
	font-weight: bold;
	margin: 40px 0 10px;
}
.termsList dd { margin: 0 0 20px; }
.termsList ol { padding: 0 0 0 20px; margin: 10px 0; }
.termsList ol li { list-style-type: decimal; }
.termsList ul { margin: 10px 0; }
/* 特商法 */
.dealsList th,
.dealsList td { border: 1px solid #ccc; padding: 20px 10px; }
.dealsList th {
	width :230px;
	background: #eee;
	font-weight: bold;
	text-align: left;
	vertical-align: middle;
}
/* プライバシーポリシー */
.privacyList { padding: 0 0 0 20px; margin: 10px 0 30px; }
.privacyList li { list-style-type: decimal; margin: 0 0 10px; }

/* questionnaire
======================================= */

.icoMust::before {
	content: '必須';
	display: inline-block;
	background: #ff2020;
	color: #fff;
	font-size: 9px;
	letter-spacing: 0.3em;
	text-align: center;
	line-height: 100%;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	padding: 3px 2px 2px 6px;
	margin-left: 4px;
	position: relative;
	top: -2px;
}
.questionCnfirm .icoMust{ display:none; }

/* error
======================================= */
.error section.detail .text { margin: 0 0 40px; }
.error section.detail .text span { display: block; font-weight: bold; margin: 0 0 40px; }

/* loading
------------------------------ */
.loading {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(255, 255, 255, 0.5);
	z-index: 99;
  }
  .loading span,
  .loading span:after {
	border-radius: 50%;
	width: 5em;
	height: 5em;
  }
  .loading span {
	display: block;
	font-size: 10px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -2.5em 0 0 -2.5em;
	text-indent: -9999em;
	border-top: 0.75em solid rgba(0, 0, 0, 0.15);
	border-right: 0.75em solid rgba(0, 0, 0, 0.15);
	border-bottom: 0.75em solid rgba(0, 0, 0, 0.15);
	border-left: .75em solid #222;
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-animation: loading 1.1s infinite linear;
	animation: loading 1.1s infinite linear;
  }
  @-webkit-keyframes loading {
	0% {
	  -webkit-transform: rotate(0deg);
	  transform: rotate(0deg);
	}
	100% {
	  -webkit-transform: rotate(360deg);
	  transform: rotate(360deg);
	}
  }
  @keyframes loading {
	0% {
	  -webkit-transform: rotate(0deg);
	  transform: rotate(0deg);
	}
	100% {
	  -webkit-transform: rotate(360deg);
	  transform: rotate(360deg);
	}
  }

.page--lspayment div.note{
	font-size:12px;
}

.page--lspayment div.note p{
	margin-bottom:1em;
}

.page--lspayment div.note ul li{
	padding-left:1em;
	text-indent:-1em;
	font-size:.9em;
}

.page--lspayment .other_payment{
	max-height:0;
	visibility:hidden;
	transition:.5s;
	overflow:hidden;
	opacity:0;
}

.page--lspayment .other-open .other_payment{
	max-height:700px;
	visibility:visible;
	opacity:1;
	transition:.5s max-height ease;
	padding-top:3em;
}

.page--lspayment .other_trigger{
	padding:1.5em 0;
	border-top:solid 1px #00000050;
	border-bottom:solid 1px #00000050;
	text-align:left;
	cursor: pointer;
	position:relative;
}

.page--lspayment .other_trigger:after{
	content:'';
	width:.7em;
	height:.7em;
	border-bottom:solid 1px #00000050;
	border-right:solid 1px #00000050;
	/* rotate: 45deg; */
	transition:.3s;
	display:block;
	position:absolute;
	transform:translate(0, -50%) rotate(45deg);
	transform-origin:center;
	top:calc(50% - .25em);;
	right:.5em;
}

.page--lspayment .other-open .other_trigger:after{
	transform:translate(0, -50%) rotate(-135deg);
	transform-origin:center;
	top:calc(50% + .3em);;
}

.page--lspayment .priceara{
	margin-bottom:1.5em;
	text-align:center;
}

.page--lspayment .priceara h5{
	font-weight:bold;
	font-size:1.1em;
	border-bottom:solid 1px #00000020;
}

.page--lspayment .priceara p{
	font-size:1em;
}

.page--lspayment .priceara p strong{
	font-weight:bold;
	font-size:1.5em;
	margin:0 .2em;
}

.page--lspayment .priceara dl{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	justify-content:center;
	letter-spacing:.05em;
}

.page--lspayment .priceara dl dt,
.page--lspayment .priceara dl dd{
	padding:.5em;
}

.page--lspayment .priceara dl dt{
	display:inline-block;
	text-align:right;
}
.page--lspayment .priceara dl dd{
	display:inline-block;
	text-align:left;
	font-weight:bold;
	font-size:1.2em;
}