/* ---------------------------------------------------------------------------------
	大枠
 --------------------------------------------------------------------------------- */
*{
	box-sizing: border-box;
}

html,body{
    background: #000000;
}

html{
	margin:0;
	padding:0;
	font-size: 6.25%; /* rem=pxのサイズとなるように指定 */
	-webkit-text-size-adjust: 100%;
	word-break: break-all;
	word-wrap: break-word;
}

body{
	margin: 0 auto;
	padding:0;
	font-size: 14rem;
	-webkit-text-size-adjust: 100%;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	word-break: break-all;
	word-wrap: break-word;
	overflow: auto;
}

#Nijiyome_SAP_Contents {
	background-color: transparent!important;
}

img {
	vertical-align: bottom;
/* 画像保存禁止 */
	user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-webkit-user-drag: none;
	-khtml-user-drag: none;
	touch-callout:none;
	-webkit-touch-callout:none;
	-moz-touch-callout:none;
}

a{
	text-decoration: none;
}

a:hover,
a:active,
.send_iconset_dialog input[type=submit]:hover,
.send_dialog input[type=submit]:hover,
.boxContainer .box:hover /* ランキングページ切り替えボタン */{
	opacity: 0.7;
	cursor: pointer;
}

.featherlight .featherlight-content{
	color: #ffffff;
}

.header_area,
.footer_area{
	background: #000000;
}

footer li,
.header_area li{
	display: table-cell;
	filter: drop-shadow(-1px 1px 1px #000000);
}
footer ul,
.header_area ul{
	display: table;
	table-layout: fixed;
}

.disp_none{
	display: none !important;
}

#overlay {
	display: none;
	position: fixed;
	z-index: 100;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: #fff;
	opacity: 0.7;
}

.detail_overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 1000;
	background:#fff;
	opacity:0.7;
	display:none;
}

.title_area{
	width: 100%;
}
.title_area h2{
	font-weight: bold;
	font-size: 100%;
	background: url(../img/menu/sub_title_bg.png) no-repeat center;
	background-size: cover;
	color: #ffffff;
	padding: 10px 5px;
	text-align: center;
}

.user_data_area{
	font-weight: bold;
	margin: 5px 0;
	text-align: center;
	background: #000000;
	border: 2px solid #641496;
	border-radius: 5px;
}
.user_data_area dl{
	box-sizing: border-box;
	display: table;
	width: 100%;
	table-layout: fixed;
	border-spacing: 0 2px;
	padding: 5px 5px;
}
.user_data_area dt{
	display: table-cell;
	background: #000000;
	color: #ffffff;
	padding: 5px 0;
	border-radius: 5px;
	border: 2px solid #641496;
}
.user_data_area dd{
	display: table-cell;
	background: #ffffff;
	color: #000000;
	padding: 5px 0;
	border-radius: 5px;
	border: 2px solid #641496;
}

.clearfix:after {
	content: ".";  /* 新しい要素を作る */
	display: block;  /* ブロックレベル要素に */
	clear: both;
	height: 0;
	visibility: hidden;
	overflow: hidden;
}

#container {
	background-image: url(../img/common/common_bg.png);
	background-repeat: repeat-y;
	background-size: contain;
}
.main_area h1{
	width: 100%;
	filter: drop-shadow(-1px 1px 1px #000000);
}

.contents_area {
	width: 95%;
	min-height: 450px;
	margin: 0 auto 10px auto;
	/*
	overflow-y: auto;
	*/
	border: 3px ridge #641496;
	box-sizing: border-box;
	/*
	filter: drop-shadow(-1px 1px 1px #000000);
	*/
	box-shadow: -1px 1px 2px 0px rgba(0,0,0,1.0);
	scroll-behavior: smooth;
	/*
	-webkit-overflow-scrolling: touch;
	*/
	background: rgba(255, 255, 255, 0.3);
}
.contents_area_inner{
	padding: 5px 5px;
}

*::-webkit-scrollbar{
	width: 5px;
}
*::-webkit-scrollbar-track{
	background: #eee;
}
*::-webkit-scrollbar-thumb{
	background: #666;
}
*::-webkit-scrollbar-button:vertical{
	width: 10px;
	height: 10px;
	background: #000000;
}

.contents_area ul {
	width: 100%;
}
.contents_area li {
	position: relative;
}
.contents_area li img:nth-of-type(1) {
    position: relative;
}
.contents_area li img{
	vertical-align: middle;
}
.contents_area li img.display {
	display: block;
}

.yellow{
    color: #ffff00;
}
.red{
	color: #ff00c6;
}

.btn_return{
	width: 100%;
	margin: 0 auto;
	text-align: center;
	padding: 10px 0;
}

#dialog{
	z-index:5000;
}
#dialog .dialog_shop_btn{
}
#dialog .dialog_close_btn{
}
.ui-dialog { z-index: 5000 !important ;}

#dialog_parent{
	position:fixed;
	top:250px;
	left:50%; /* 左から半分 */
	/* 要素の大きさの半分引く（CSS3） */
	-webkit-transform: translate(-50%,0);
	-moz-transform: translate(-50%,0);
	transform: translate(-50%,0);
	
	z-index:5000;
}

.chat_time{
    text-align: center;
    color: #fff;
    font-weight: bolder;
    font-size: large;
    line-height: 20px;
    background: #8d00b6;
    background: -moz-linear-gradient(left,  rgb(109,0,25) 0%, rgb(224,4,180) 51%, rgb(109,0,25) 100%);
	background: -webkit-linear-gradient(left,  rgb(109,0,25) 0%,rgb(224,4,180) 51%,rgb(109,0,25) 100%);
	background: linear-gradient(to right,  rgb(109,0,25) 0%,rgb(224,4,180) 51%,rgb(109,0,25) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6d0019', endColorstr='#6d0019',GradientType=1 );
    margin-top: 7px;
    margin-bottom: 5px;
    padding-top: 3px;
    border-top: 3px solid #29014b;
    border-bottom: 3px solid #29014b;
}

.page_change a,
.error_area_inner a,
.exchange_btn,
.btn_return a,
.gacha_frame #gacha_list,
.gacha_frame #pay_gacha_img,
.input_name_area input[type=button],
.confirm_area input[type=submit],
.collection_event_area input[type=submit],
.buy_area_r input[type=submit],
.button a,
button.button{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#7d12f0+5,611ef2+100 */
	background: #7d12f0; /* Old browsers */
	background: -moz-linear-gradient(top,  #7d12f0 5%, #611ef2 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #7d12f0 5%,#611ef2 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #7d12f0 5%,#611ef2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d12f0', endColorstr='#611ef2',GradientType=0 ); /* IE6-9 */
	-moz-border-radius:42px;
	-webkit-border-radius:42px;
	border-radius:42px;
	border:1px solid #1126f0;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size: 14px;
	font-weight:bold;
	padding:10px 5px;
	text-decoration:none;
	text-shadow:0px -1px 0px #6e6e6e;
	width: 40%;
}
.page_change a :hover,
.error_area_inner a:hover,
.exchange_btn:hover,
.btn_return a:hover,
.gacha_frame #gacha_list:hover,
.gacha_frame #pay_gacha_img:hover,
.input_name_area input[type=button]:hover,
.confirm_area input[type=submit]:hover,
.collection_event_area input[type=submit]:hover,
.buy_area_r input[type=submit]:hover,
.button a:hover
button.button:hover{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#a459f5+5,9162f6+100 */
	background: #a459f5; /* Old browsers */
	background: -moz-linear-gradient(top,  #a459f5 5%, #9162f6 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #a459f5 5%,#9162f6 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #a459f5 5%,#9162f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a459f5', endColorstr='#9162f6',GradientType=0 ); /* IE6-9 */
}
.page_change a:active,
.error_area_inner a:active,
.exchange_btn a:active,
.btn_return a:active,
.gacha_frame #gacha_list:active,
.gacha_frame #pay_gacha_img:active,
.input_name_area input[type=button]:active,
.confirm_area input[type=submit]:active,
.collection_event_area input[type=submit]:active,
.buy_area_r input[type=submit]:active,
.button a:active{
	position:relative;
	top:1px;
}

.collection_event_area input[type=submit]:disabled,
.buy_area_r input[type=submit].disable_class{
	-moz-box-shadow:inset 0px 1px 0px 0px #cccccc;
	-webkit-box-shadow:inset 0px 1px 0px 0px #cccccc;
	box-shadow:inset 0px 1px 0px 0px #cccccc;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #808080), color-stop(1, #f2ab1e));
	background:-moz-linear-gradient(top, #808080 5%, #878787 100%);
	background:-webkit-linear-gradient(top, #808080 5%, #878787 100%);
	background:-o-linear-gradient(top, #808080 5%, #878787 100%);
	background:-ms-linear-gradient(top, #808080 5%, #878787 100%);
	background:linear-gradient(to bottom, #808080 5%, #878787 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#808080', endColorstr='#878787',GradientType=0);
	background-color:#808080;
	-moz-border-radius:42px;
	-webkit-border-radius:42px;
	border-radius:42px;
	border:1px solid #808080;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size: 14px;
	font-weight:bold;
	padding:10px 5px;
	text-decoration:none;
	text-shadow:0px -1px 0px #6e6e6e;
	width: 40%;
}

.button{
	margin: 10px auto;
	text-align: center !important;
}

.gacha_frame #gacha_list a{
	text-decoration: none;
	color: #ffffff;
}

.page_change{
	width: 100%;
	display: table;
	color: #000000;
	text-align: center;
	border-spacing: 5px 10px;
}
.page_change a{
	width: 100%;
}

.page_change li {
	display: table-cell;
	vertical-align: middle;
}
.page_change li:nth-of-type(2){
	width: 20%;
}

.top_banner_list_pc {
	width: 50%;
	margin: 0 auto;
	position: absolute;
	bottom: 10px;
	left:50%; /* 左から半分 */
	/* 要素の大きさの半分引く（CSS3） */
	-webkit-transform: translate(-50%,0);
	-moz-transform: translate(-50%,0);
	transform: translate(-50%,0);
	z-index: 0;
}

@media screen and (min-width: 400px) {
}

@media screen and (min-width: 415px) {
    body {
		/*
        width: 414px;
		*/
    }
}