/***** system *****/
.topimg{
	font-size: 0;
	line-height: 0;
	margin: 0 0 10px 0;
	text-align: center;
}
.topimg img{
	width:calc(100% - 20px);
	height: auto;
}
.bt_sysmenu{
	padding			: 0 0 0 0;
	height			: 65px;
}
.bt_sysmenu li{
	float			: left;
	width			: 33%;
	height			: 30px;
}
.bt_sysmenu li:nth-child(3n+1){
	float			: left;
	width			: 34%;
	height			: 30px;
}
.bt_sysmenu li span{
	display			: block;
	border			: 1px solid #e2c96b;
	margin			: 0 5px;
}
.bt_sysmenu li a{
	display			: block;
	clear			: both;
	font-size		: 12px;
	color			: #795404;
	border			: 1px solid #fff;
	text-align		: center;
	text-shadow		: 1px 1px 1px rgba(255, 255, 255, 0.5);
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f6efd4+100 */
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top, #ffffff 0%, #f6efd4 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #ffffff 0%,#f6efd4 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #ffffff 0%,#f6efd4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6efd4',GradientType=0 ); /* IE6-9 */
	line-height		: 20px;
}
.sche{}
.sche p{
	font-size: 12px;
	line-height: 22px;
	text-align: left;
	padding: 0 10px 10px 10px;
}
/***** system *****/
.title{
	margin			: 0 0 10px 0;
}
#sysimg{
	text-align		: center;
	margin			: 10px 0;
}
/** sys **/
.sys_title{
	font-size: 16px;
	font-weight: bold;
	line-height: 20px;
	text-align: center;
	padding: 10px 10px;
	color: #fff;
	text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);
	border-top: 1px solid #e1c86a;
	border-bottom: 1px solid #e1c86a;
	box-shadow:0px 1px 0px 0px rgba(0, 0, 0, 0.1) inset,0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow:0px 1px 0px 0px rgba(0, 0, 0, 0.1) inset,0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset;
	-webkit-box-shadow:0px 1px 0px 0px rgba(0, 0, 0, 0.1) inset,0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset;
}
#sys1 .sys_title{
	background: #26c2c0;
	background: -moz-linear-gradient(left,  #26c2c0 0%, #5bd2d1 50%, #26c2c0 100%);
	background: -webkit-linear-gradient(left,  #26c2c0 0%,#5bd2d1 50%,#26c2c0 100%);
	background: linear-gradient(to right,  #26c2c0 0%,#5bd2d1 50%,#26c2c0 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#26c2c0', endColorstr='#26c2c0',GradientType=1 );
}
#sys2 .sys_title{
	background: #7482be;
	background: -moz-linear-gradient(left, #7482be 0%, #96a3cf 50%, #7482be 100%);
	background: -webkit-linear-gradient(left, #7482be 0%,#96a3cf 50%,#7482be 100%);
	background: linear-gradient(to right, #7482be 0%,#96a3cf 50%,#7482be 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7482be', endColorstr='#7482be',GradientType=1 );
}
#sys3 .sys_title{
	background: rgb(216,130,255);
	background: linear-gradient(90deg, rgba(216,130,255,1) 0%, rgba(226,163,255,1) 50%, rgba(216,130,255,1) 100%);
}
#sys1 th{	color: #26c2c0;}
#sys2 th{	color: #7482be;}
#sys3 th{	color: #cb7bef;}
.system th.adv{	color: #6e4416 !important;}
.system th.adv+td{	color: #ff3333;}
.system{
	margin			: 0 0 10px 0;
}
.system table{
	width			: 100%;
	font-size		: 13px;
	line-height		: 18px;
	margin			: 0 0 10px 0;
}
.system tr{
	vertical-align	: top;
}
.system th{
	border-bottom	: 1px solid #ddd;
	padding			: 4px 0 3px 0;
}
.system th p{
	padding			: 0 5px 0 10px;
}
.system td{
	text-align		: left;
	border-bottom	: 1px solid #ddd;
	padding			: 4px 0 3px 0;
}
.system td p{
	font-size		: 13px;
	text-align		: right;
	padding			: 0 10px 0 5px;
}
.system td p i{
	font-style: normal;
	background-image: linear-gradient(20deg,#ff0000, #ff0000);
	background-position: 0 50%;
	background-size: 100% 1px;
	background-repeat: repeat-x;
	text-decoration: none;
}
.system td p span{
	font-size: 10px;
}

.system td p em{
	font-size: 15px;
	font-weight: bold;
	color: #ff0000;
}
.system .boxtxt{
	font-size: 12px;
	line-height: 18px;
	text-align: left;
	padding: 0 10px;
}
.system .boxtxt span{	color: #ff0000;}
#shinkobe td p{
	color			: #ff3333;
}
.system tr:last-child th,
.system tr:last-child td{
	border-bottom	: none;
}
#etc{
	margin-bottom: 10px;
}
.etc{
	display: table;
	width: 100%;
	font-size: 0;
	line-height: 0;
	border-top: 1px solid #ddd;
	padding: 0 0 5px 0;
}
.etc:first-of-type{ border: none;}
.etc_l,
.etc_r{
	display: table-cell;
	vertical-align: middle;
	font-size: 13px;
	line-height: 18px;
}
.etc_l{
	text-align: left;
	color: #27b3b9;
	padding: 5px 0 0 10px;
}
.etc_l span{	font-size: 10px;}
.etc_r{
	text-align: right;
	color: #d3b33a;
	padding: 5px 10px 0 0;
}
.etc_p{
	font-size: 11px;
	line-height: 14px;
	text-align: center;
	padding: 5px 10px 5px 10px;
}
.etc_p.big{
	font-size: 12px;
	font-weight: bold;
	color: #ff0000;
}
.etc_p.big span{
	color: #ffba26;
}
.etc_rule{
	border-top: 1px solid #ddd;
	padding: 10px 10px 0 10px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
			box-sizing: border-box;
}
.etc_rule div{
	font-size: 13px;
	line-height: 20px;
	text-align: center;
	color: #27b3b9;
	margin: 0 0 10px 0;
}
.etc_rule p{
	font-size: 11px;
	line-height: 14px;
	text-align: left;
	margin: 0 0 10px 0;
}
.etc_rule p span{
	font-size: 12px;
	color: #ff0000;
}
.etc_rule p:last-of-type{	margin-bottom: 0;}
.bnr_10th{
	font-size: 0;
	line-height: 0;
	text-align: center;
	margin: 0 0 20px 0;
}
.bnr_10th img{
	width: 100%;
	height: auto;
}
.boxtext{
	color			: #333333;
	font-size		: 11px;
	line-height		: 18px;
	text-align		: center;
	padding			: 0 10px 10px 10px;
}
.boxtext span{
	color			: #ff3333;
}
.boxtext strong{
	color			: #ff3333;
	font-size		: 16px;
	line-height		: 20px;
}
.boxtext2{
	clear			: both;
	color			: #999999;
	font-size		: 11px;
	line-height		: 18px;
	text-align		: left;
	padding			: 0 10px 15px 10px;
}
.boxtext2 span{
	color			: #ff3333;
}
.boxtext2 strong{
	color			: #ff3333;
	font-size		: 16px;
	line-height		: 20px;
}
/** etc **/
#etc th p{
	color			: #cc66ff;	
}
#etc td p span{
	color			: #ff3333;
}
#credit p{
	font-size		: 13px;
	line-height		: 18px;
	text-align		: left;
	margin			: 0 0 10px 0;
	padding			: 0 10px;
}
#credit .bt_crdit span{
	display			: block;
	margin			: 0 10px 20px 10px;
	border			: 1px solid #e1c86a;
}
#credit .bt_crdit span a{
	display			: block;
	color			: #333333;
	font-size		: 14px;
	font-weight		: normal;
	text-align		: center;
	text-decoration	: none;
	text-shadow		: 1px 1px 1px #ffffff;
	border			: 1px solid #ffffff;
	background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#f1f1f1), color-stop(51%,#e1e1e1), color-stop(100%,#f6f6f6));
background: -webkit-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
background: -o-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
background: -ms-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
background: linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 );
	line-height		: 30px;
}
#event{
	text-align		: center;
	margin			: 0 0 20px 0;
}
#op_a em{
	display			: block;
	font-style		: normal !important;
	font-size		: 11px;
	font-weight		: normal;
	line-height		: 12px;
	color			: #333;
	margin-top		: -0px;
}

#op_a em i{
	font-style		: normal !important;
	color			: #ff0000;
}



#op th p span{
	color			: #ff0099;	
}
#op th p i{
	font-style		: normal;
	font-size		: 10px;	
}
#op th p i em{
	color			: #ff0000;	
}
#op td{
	width			: 70px;
}
.play{
	display			: block;
	margin			: 0 0 0 0;
}
.play:after{
	content			: "";
	display			: block;
	clear			: both;
}
.play  li{
	float			: left;
	width			: 33%;
	height			: 37px;
}
.play  li:nth-child(3n+1){
	float			: left;
	width			: 34%;
	height			: 37px;
}
.play  li:last-child{
	margin			: 0 0 5px 0;
}
.play li p{
	position: relative;
	font-size		: 11px;
	line-height		: 30px;
	margin			: 0 2px;
	text-align		: center;
	color			: #333333;
	border			: 1px solid #e1c86a;
	text-align		: center;
	text-shadow		: 1px 1px 1px #ffffff;
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #f5f5f5 50%, #ffffff 99%);
background: -webkit-linear-gradient(top, #ffffff 0%,#f5f5f5 50%,#ffffff 99%);
background: linear-gradient(to bottom, #ffffff 0%,#f5f5f5 50%,#ffffff 99%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 );
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px; 
}
.play li.new_play p:after{
	content: '';
	display: inline-block;
	vertical-align: top;
	width: 18px;
	height: 18px;
	background: url(img/new.png) no-repeat;
	background-size: 18px auto;
	position: absolute;
	top: -5px;
	left: -5px;
}
#play_table{	color: #ba9300;}
#play_table th{	width: 107px;}
#play_table td{	width: auto;}
#op_table th{	width: 80px; color: #ba9300;}
#op_table td{	width: auto;}
#op_table td p:nth-of-type(2){
	font-size: 10px;
	line-height: 12px;
	margin-top: 3px;
}
#op_table td p:nth-of-type(2) i{
	font-style: normal;
	color: #ff0000;
}
#op_table td p em{
	display: inline-block;
	vertical-align: top;
	font-style: normal;
	padding-left: 20px;
	background: url(img/new.png) no-repeat 0 50%;
	background-size: 18px auto;
}
#area h4{
	font-size		: 13px;
	line-height		: 20px;
	color			: #cc0000;
	text-align		: center;
}
#area dl{
	width			: 100%;
	font-size		: 13px;
	line-height		: 18px;
	margin			: 0 0 10px 0;
}
#area dt{
	padding			: 4px 0 3px 0;
}
#area dt p{
	color			: #b68c00;
	padding			: 0 10px 0 20px;
	background		: url(../img/arrow.gif) no-repeat 8px 4px;
}
#area dd{
	padding			: 0 0 3px 0;
	border-bottom		: 1px dotted #dddddd;
}
#area dd:last-child{
	padding			: 0 0 3px 0;
}
#area dd p{
	padding			: 0 10px 0 20px;
}
#area dd p span{
	font-size: 11px;
	line-height: 14px;
}
#area_btext{
	font-size		: 12px;
	line-height		: 18px;
	padding			: 0 10px;
	margin			: 0 0 20px 0;
}
#area_info{
	margin			: 0 0 10px 0;
}
#area_info h3{
	text-align		: center;
	font-size		: 15px;
	font-weight		: bold;
	line-height		: 25px;
	margin			: 0 0 10px 0;
	border-bottom		: 3px double #cccccc;
}
#area_info_text{
	font-size		: 12px;
	line-height		: 18px;
	margin			: 0 0 20px 0;
	padding			: 0 10px;
}
#area_info_text span{
	color			: #ff3333;
}
#area_info h4{
	font-size		: 13px;
	line-height		: 18px;
	margin			: 0 10px 5px 10px;
	padding			: 4px 0 3px 0;
	border-bottom		: 1px dotted #cc9900;
}
#area_info h4 p{
	color			: #996600;
	padding			: 0 0 0 30px;
	background		: url(../img/car.gif) no-repeat 0 2px;
}
#area_info ul{
	font-size		: 12px;
	line-height		: 16px;
	margin			: 0 10px 10px 10px;
}
#area_info li{
	margin			: 0 0 5px 0;
}
#area_info li p{
	padding			: 0 0 0 30px;
	background		: url(../img/i1.gif) no-repeat 15px 2px;
}
.ap {
	font-size: 11px;
	line-height: 18px;
	text-align: left;
	padding: 0 10px 10px 10px;
	color: #ff3333;
}
.ap2{
	font-size: 11px;
	line-height: 18px;
	text-align: left;
	padding: 0 10px 10px 10px;
}
.ap2 span{
	display: inline-block;
	vertical-align: top;
	font-size: 13px;
	color: #cc9900;
}
.inter{
	padding: 10px;
	border-bottom: 1px dotted #ddd;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.inter p{
	font-size: 14px;
	line-height: 18px;
	text-align: left;
	color: #33cccc;
}
.inter div{
	display: table;
	width: 100%;
	font-size: 0;
	line-height: 0;
}
.inter div span,
.inter div em{
	display: table-cell;
	vertical-align: top;
	font-size: 12px;
	line-height: 18px;
}
.inter div span{
	text-align: right;
}
.inter div em{
	width: 60px;
	text-align: right;
	color: #ff0000;
}
/* sbox */
.sbox{
	font-size		: 13px;
	line-height		: 18px;
	margin			: 0 0 10px 0;
	padding			: 0 10px;
}
.sbox p{
	padding			: 0 0 5px 0;
}
.sbox span{	color	: #ff3333;}
.sbox em{	color	: #27b3b9;}
/* caution */
#caution{
	margin			: 0 0 10px 0;
}
.caution_top{
	font-size		: 12px;
	line-height		: 16px;
	margin			: 0 10px 10px 10px;
}
.caution_top2{
	font-size		: 12px;
	line-height		: 16px;
	color			: #27b3b9;
	margin			: 0 10px 10px 10px;
}
#caution h3{
	text-align		: center;
	font-size		: 15px;
	font-weight		: bold;
	line-height		: 25px;
	margin			: 0 0 10px 0;
	border-bottom		: 3px double #cccccc;
}
#caution h4{
	font-size		: 13px;
	line-height		: 18px;
	margin			: 0 10px 5px 10px;
	padding			: 4px 0 3px 0;
	border-bottom		: 3px double #dddddd;
}
#caution h4 p{
	color			: #b99930;
	padding			: 0 0 0 18px;
	background		: url(../img/cau.gif) no-repeat 0px 2px;
}
#caution ul{
	font-size		: 12px;
	line-height		: 16px;
	margin			: 0 10px 10px 10px;
}
#caution li{
	margin			: 0 0 5px 0;
	padding			: 0 0 5px 0;
	border-bottom		: 1px dotted #dddddd;
}
#caution li div{
	padding			: 0 0 0 18px;
	background		: url(../img/i1.gif) no-repeat 1px 2px;
	color			: #bd75ed;
}
#caution li div span{
	color			: #ff3333;
}
#caution li p{
	padding			: 0 0 0 18px;
}
.cation_bottom {
	font-size		: 12px;
	line-height		: 18px;
	color			: #ffffff;
	margin			: 5px 5px 20px 5px;
	padding			: 5px 10px;
	border			: 1px solid #67b5b9;
	background		: url(../img/heart.gif) ;
	border-radius		: 5px;
	-webkit-border-radius	: 5px;
	-moz-border-radius	: 5px; 
}
.cation_bottom span{
	font-size		: 15px;
	line-height		: 25px;
	color			: #ffff00;
	font-weight		: bold;
	text-align		: center;
	margin			: 0 0 10px 0;
}
.res_box{
	margin			: 0 5px 15px 5px;
	line-height		: 18px;
}
.res_box h4{
	color			: #27b3b9;
	padding			: 0 0 0 15px;
	background		: url(../img/arrow.gif) no-repeat 2px 6px;
}
.res_box p{
	font-size		: 12px;
	padding			: 0 0 0 15px;
	margin			: 0 0 10px 0;
}
.res_box span{
	color			: #ff3333;
}
.res_box ul{
	padding			: 0 0 0 15px;
}
.res_box li{
	border-bottom		: 1px dotted #dddddd;
	padding			: 0 0 5px 0;
	margin			: 0 0 5px 0;
}
.res_box .retext01{
	color			: #2bb74e;
}
.res_box .retext02{
	color			: #229eed;
}
.res_box .retext03{
	color			: #cc99ff;
}
.res_box em{
	height			: 20px;
	margin			: 0 0 10px 0;
	display			: block;
	text-align		: center;
	font-size		: 20px;
	color			: #b99930;
}
.res_box h5{
	margin			: 0 0 20px 0;
	display			: block;
	text-align		: center;
	font-size		: 16px;
	color			: #ff3333;
}
.red{
	 color			: #ff0000 !important;
}




/** op_box **/

#op_box{
}
#op_box div{	text-indent: 0; margin: 0;}
#op_box dl{
	display: flex;
	align-items: flex-start;
	align-content: flex-start;
	justify-content: flex-start;
	font-size: 0;
	line-height: 0;
	margin: 0 10px;
	padding: 10px 0 8px 0;
	border-bottom: 1px dotted #ddd;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#op_box dt{
	width: 105px;
	font-size: 15px;
	font-weight: bold;
	line-height: 30px;
	text-align: left;
	color: #b08a00;
	padding: 0 0 0 15px;
	background: url(../../system/img/op_box.gif) no-repeat 1px 9px;
	background-size: 4.5px auto;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#op_box dd{
	width: calc(100% - 105px);
}
#op_box dd button{
	position: relative;
	display: inline-flex;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: calc(100% / 2 - 2px);
	height: 30px;
	font-size: 13px;
	line-height: 13px;
	border: 1px solid #e2ca6e;
	border-radius: 3px;
	margin: 0 2px 2px 0;
	color: #333;
	background: #fff;
	cursor: pointer;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#op_box dd button span{
	display: inline-block;
	vertical-align: top;
	width: 18px;
	height: 18px;
	background: url(../../system/img/op_new.png) no-repeat;
	background-size: 18px auto;
	position: absolute;
	top: -3px;
	left: -4px;
}

#op_box .op_txt{
	font-size: 12px;
	line-height: 20px;
	text-align: left;
	color: #ff3333;
	margin: 10px 0 0 0;
	padding: 0 25px;
}


/** modal **/
.modalArea{
	display: none;
	position: fixed;
	z-index: 100001;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.modalBg{
	width: 100%;
	height: 100%;
	background-color: rgba(30,30,30,0.9);
}

.modalWrapper{
	position: absolute;
	top: 50%;
	left: 50%;
	transform:translate(-50%,-50%);
	width: calc(100% - 20px);
	padding: 10px;
	background-color: #fff;
	border-radius: 10px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.closeModal{
	font-size: 30px;
	line-height: 30px;
	color: #999;
	position: absolute;
	top: -30px;
	right: 0;
	cursor: pointer;
	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	     -o-transform: rotate(45deg);
	        transform: rotate(45deg);
}

.modalContents{	text-align: left;}

.modalContents h4{
	position: relative;
	font-size: 24px;
	font-weight: bold;
	line-height: 30px;
	color: #b08a00;
	margin: 0 0 5px 0;
	padding: 0 0 0 25px;
}
.modalContents h4 span{
	font-size: 22px;
	line-height: 30px;
	position: absolute;
	top: -2px;
	left: 0;
}

.modalContents .modal_p{
	font-size: 15px;
	font-weight: bold;
	line-height: 25px;
}

.modalContents .modal_caution{
	margin: 10px 0 0 0 !important;
	padding: 10px 0 0;
	color: #ff0000;
	border-top: 1px dotted #ddd;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.modalContents .modal_caution p:nth-of-type(1){
	position: relative;
	font-size: 14px;
	font-weight: bold;
	line-height: 20px;
	margin: 0 0 5px 0;
	padding: 0 0 0 25px;
}
.modalContents .modal_caution p:nth-of-type(1) span{
	font-size: 20px;
	line-height: 20px;
	position: absolute;
	top: -2px;
	left: 0;
}

.modalContents .modal_caution p:nth-of-type(2){
	font-size: 13px;
	line-height: 20px;
	margin: 0;
}