/******************************************************************************/
/*00_user custom                                                              */
/******************************************************************************/
/*太字*/
.bold{
	font-weight: bold;
}
/*打ち消し線*/
.del{
	text-decoration: line-through;
}
/*文字や画像位置関係*/
.align_r{text-align:right;}
.align_l{text-align:left;}
.align_c{text-align:center;}
/*余白関係*/
.margin_r8{margin-right:    8px;}
.margin_l8{margin-left:     8px;}
.margin_t8{margin-top:      8px;}
.margin_b8{margin-bottom:   8px;}
.margin_r16{margin-right:  16px;}
.margin_l16{margin-left:   16px;}
.margin_t16{margin-top:    16px;}
.margin_b16{margin-bottom: 16px;}
/*色の指定関係*/
.fontc_r{color:#c91e1e;}
.fontc_b{color:#2654c8;}
.fontc_g{color:#22a85e;}
.fontc_link{color:#2c7aee;}

/******************************************************************************/
/*01_common                                                                   */
/******************************************************************************/
html{
	font-size:100%;
	/*24px相当を基準値とする*/
	line-height:0.8em;
}
.font_s {
	font-size: clamp(0.8rem, calc(0.8rem + 1.00vw), 0.8rem);
}

.font_m {
	font-size: clamp(1.2rem, calc(1rem + 1.00vw), 1.7rem);
}

.font_l {
	font-size: clamp(2.4rem, calc(2.2rem + 1.00vw), 2.9rem);
}

body{
	background:#1c1313;
	color:#f9f9f9;
}

hr{
	border:1px solid #b4873c;
	margin:16px 0;
}

img{display:inline;}

/******************************************************************************/
/*02_news list                                                                */
/******************************************************************************/
ul.news_list{
	width:98%;
	margin:16px auto;
}

ul.news_list li{
	border:1px solid #b4873c;
	background:#312a2a;
	margin-bottom:16px;
}

ul.news_list li a{
	padding:10px 16px 16px 16px;
	display:block;
	width:100%;
	height:100%;
	text-decoration: none;
}

ul.news_list li a p.title{
	width:100%;
	margin-bottom:8px;
}
ul.news_list li a p.date{
	width:100%;
	text-align:right;
}

/******************************************************************************/
/*03_article                                                                  */
/******************************************************************************/
div.new_article{
	width:calc(100% - 128px);
	margin:16px auto;
}
div.head,
div.article{
	padding:0 0 0 0;
	width:100%;
	height:100%;
	margin-bottom:24px;
}
div.head p.title{
	width:100%;
	margin-bottom:8px;
}
div.head p.date{
	width:100%;
	text-align:right;
}
div.article p,
div.article ul{
	width:100%;
	margin:0 0 16px 0;
}
div.img_box{
	width:100%;
	margin:0 0 16px 0;
}

div.return{
	position:fixed;
	bottom:8px;
	left:8px;
}
div.return a{
	display:block;
	width:36px;
	height:36px;
	background-image:url("../img/return.png");
	background-repeat:no-repeat;  
	background-size:36px;
}

div.article ul{
	margin-left:24px;
}
div.article ul li{
	list-style-type:disc;
}
div.article ul li.decimal{
	list-style-type:decimal;
}
div.article ul li.circle{
	list-style-type:circle;
}

div.article table{
	margin: 16px 0;
	border-collapse: collapse;
	border: 2px solid #fff;
}
div.article table caption{
	font-weight:bold;
	margin-bottom:8px;
}
div.article table thead th{
	background-color:#b4873c;
}
div.article table th,
div.article table td{
	border: 1px solid #fff;
	padding:16px;
}

/******************************************************************************/
/*04_category                                                                 */
/******************************************************************************/
p.date span{
	display: inline-block;
	margin-left:16px;
	text-align:center;
	width:100px;
	height:100%;
	padding: 4px 0;
	background-image:url("../img/category.png");
	background-size:contain;
}
/*ガチャ*/
p.date span.gacha{
	background-color:#991717;
	
}
p.date span.gacha::after{
	content: "ガチャ";
}
/*イベント*/
p.date span.event{
	background-color:#22a85e;
}
p.date span.event::after{
	content: "イベント";
}
/*不具合*/
p.date span.defect{
	background-color:#eace11;
}
p.date span.defect::after{
	content: "不具合";
	color:#17181d;
}
/*アップデート*/
p.date span.update{
	background-color:#2148ab;
}
p.date span.update::after{
	content: "アップデート";
}
/*その他*/
p.date span.other{
	background-color:#5f5f5f;
}
p.date span.other::after{
	content: "その他";
}


/******************************************************************************/
/*05_sub_content                                                              */
/******************************************************************************/
div.sub_content{
	width:calc(100% - 48px);
	margin: 0 auto;
}
div.sub_content h3{
	margin:0 0 16px 0;
	border-bottom:1px solid #b4873c;
	padding-bottom:4px;
}
div.sub_content table{
	margin: 16px 0;
	border-collapse: collapse;
	border: 2px solid #fff;
}
div.sub_content table caption{
	font-weight:bold;
	margin-bottom:8px;
}
div.sub_content table thead th{
	background-color:#b4873c;
}
div.sub_content table th,
div.sub_content table td{
	border: 1px solid #fff;
	padding:16px;
}

/******************************************************************************/
/*06_document                                                                 */
/******************************************************************************/
body.document{
	width:calc(100% - 128px);
	margin:16px auto;
}
body.document header{
	margin-bottom:16px;
}
body.document h2{
	border-bottom:1px solid #b4873c;
	padding-bottom:8px;
	margin-bottom:16px
}
body.document p{
	margin:0px 16px 16px 16px;
}
body.document ul,ol{margin:0 48px 20px 48px;}
body.document li{margin-bottom:10px;list-style-type:decimal;}
body.document ol.roman li{list-style-type:upper-roman;}

body.document footer p{
	text-align:center;
}
body.document a{ color:#ca8a20;}

body.document .margin-top10{margin-top:10px;}