@charset "utf-8";



.attention_screenshots{
	display:none!important;
}

.min{
	font-size:90%;
}

/*----------------------------------------
	for PC
----------------------------------------*/


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

	#content_inner{
		padding:50px 0 70px;
		width:1000px;
		margin:0 auto 0;
		z-index:50;
		position:relative;
	}

	#base{
		background:transparent url('../img/trial/base_middle.jpg') center top;
		background-size:100%;
		position:relative;
		margin:30px 0 0;
		box-shadow:2px 2px 3px rgba(0,0,0,0.2),-2px -2px 3px rgba(0,0,0,0.2),-2px 2px 3px rgba(0,0,0,0.2),2px -2px 3px rgba(0,0,0,0.2);
	}

	.base_background::before{
		content:'';
		background:transparent url('../img/steam/main.png') center top no-repeat;
		background-size:100%;
		display:block;
		width:100%;
		padding-top:700px;
		position:absolute;
		top:0;left:0;
		z-index:40;
	}

	#base::after{
		content:'';
		background:transparent url('../img/trial/base_bottom.jpg') center bottom no-repeat;
		background-size:100%;
		display:block;
		width:100%;
		padding-top:300px;
		position:absolute;
		bottom:0;left:0;
		z-index:10;
	}

	#base .base_inner{
		position:relative;
		z-index:45;
		width:83%;
		padding:440px 0 80px;
		margin:0 auto 0;
	}

	#base .base_background{
background-color:rgba(0,0,0,0.9);
z-index:30;
position:relative;
	}

	.date{
		display:block;
		margin:-20px auto 15px;
	}

	.chara{
		display:block;
		position:absolute;
		z-index:25;
		top:210px;
		right:-280px;

	}


	h2{
		display:block;
		text-align:center;
		padding:0px 0 0;
		margin:0 0 0px;
		}

	h2{
		display:block;
		margin:0 0 0px;
	}



	h4{
		text-align:center;
		display:block;
		padding:17px 0 17px;
		margin:70px 0 30px;
		font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
		color:#960808;
		font-weight:800!important;
		font-size:45px;
		text-shadow:2px 2px 0px rgba(0,0,0,0.1);
		line-height:1;
		position:relative;
	}

	h4::before,
	h4::after {
	position: absolute;
	left: 0;
	content: '';
	width: 100%;
	height: 6px;
	box-sizing: border-box;
	}

	h4::before {
		top: 0;
		border-top: 2px solid rgba(50,0,0,0.5);
		border-bottom: 1px solid rgba(50,0,0,0.7);
	}

	h4::after {
		bottom: 0;
		border-top: 1px solid rgba(50,0,0,0.7);
		border-bottom: 2px solid rgba(50,0,0,0.5);
	}



	p{
		display:block;
		text-align:left;
		color:#411;
		line-height:1.7;
		font-size:16.5px;
	}


	.read{
		font-size:16px;
		margin-bottom:0px;
		margin-top:2%;
		color:#fff;
	}

	.read .min{
		color:#999;
	}

	.bold{
		font-size:120%;

	}


 	h3{

		display:inline-block;
		padding:30px 0 0;
		font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
		color:#daa515;
		border-bottom:1px solid #daa515;

		font-weight:800!important;
		font-size:33px;
		padding-bottom:10px;

		padding-top:0;
		margin-bottom:20px;
		margin-top:110px;
		text-align:center;
		text-shadow:2px 2px 2px #rgba(0,0,0,0.9);
	}

	.box_twoline .box{
		display:block;
		width:49%;
		float:left;
	}

	.box_twoline .box img{
		display:block;
		width:100%;
		border:1px solid #846a38;
	}

	.box_twoline.weapon img{
		border:1px solid #846a38;
	}

	.box_twoline .box p{
		color:#eee;
		font-size:14px;
				padding-top:10px;
	}

	p{
		color:#eee;
		font-size:14px;

	}

	.box_twoline .box p .tit{
		color:#fff;
		font-size:23px;
		font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
		color:#daa515;
		display:block;
	}

	.box_twoline .box:nth-of-type(2){
		margin-left:2%;
	}

	.center{
		text-align:center;
	}

	.text_weaponExp{
		padding:30px;
		border:1px solid #312e28;
		margin-top:20px;
		background-color:#000;
		color:#eee;
	}

	.text_weaponExp .tit{
		color:#fff;
		font-size:19px;
		font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
		color:#d8a72f;
	}

	.tokuten{
		border:2px solid #846a38;
		background-color:rgba(0,0,0,0.7);
		border-radius:6px;
		padding:30px;
		margin-top:30px;
		position:relative;
	}

	.tokuten h3{
		margin-top:0px;
		font-size:27px;
		padding-bottom:5px;
	}

	.tokuten .icon{
		display:block;
		position:absolute;
		top:-20px;
		left:-20px;
		transform: rotate(-10deg);
	}

	.btn_reserve_steam{
		display:inline-block;
		padding:2px 42px;
		color:#fff;
		background-color:#d00;
		border-radius:3px;
		border:1px solid #e6615d;
		box-sizing: border-box;
		margin-top:10px;
		font-size:14px;
		width:100%;
		text-align:center;
	}

	.spec{
		border-collapse:collapse;
		width:100%;
		margin:0 auto ;
	}
	.spec th ,.spec td{
		border:1px solid #666;
		padding:8px 20px;
		font-size:14px;
		line-height:1.7;
		background-color:rgba(0,0,0,0.8);
	}

	.spec th{
		width:20%;
	}

	 h5{
		color:#ddd;
		font-size:20px;
		margin-top:40px;
		padding-bottom:9px;
		text-align:center;
	}

	.btn_bottom{
		width:90%;
		display:flex;
		justify-content: space-around;
		margin:50px auto 50px;
	}

	.btn_bottom a{
		width:46%;
		display:block;
		background-color:#33b2b3;
		border:2px solid #88ddde;
		box-sizing:border-box;
		border-radius:6px;
		color:#fff;
		text-align:center;
		padding:20px 0;
	}

	.btn_bottom a.btn_gi{
		background-color:#125688;
		border:2px solid #266fa4;
	}

	.exp{
		font-size:12px;
		line-height:1.7;
		padding-left:1em;
		color:#aaa;
	}
	.exp li{
		display:inline;
		margin-left:-1em;
	}

	.cont .flex{
		display:flex;
		flex-wrap:wrap;
		flex-direction:row;
		justify-content:flex-start;;
	}

	.cont .flex div{
		padding:5px 10px;
	}

	.tokuten_list{
		border:1px solid #666;
		margin-top:20px;
	}

	.tokuten_list .tit{
		width:30%;
		vertical-align:middle;
				display:inline-block;
				text-align:center;

	}

	.tokuten_list .cont{
		width:60%;
		vertical-align:middle;
		display:inline-block;
		border-left:1px solid #666;
		padding:1% 3%;
		line-height:1.3;
		font-size:13px;
		color:#ecedbd;
	}

	.spec_top{
		width:100%;
		padding:30px 0;
		border-top:1px solid #666;
		border-bottom:1px solid #666;
		margin-top:30px;
				margin-bottom:-20px;
	}

	.flex{
		display:flex;
				justify-content: space-between;
	}

	.spec_top .logo{
		width:200px;
		display:flex;
		margin-top:27px;
	}

	.spec_top table{
		font-size:14px;
		/*margin:0 34px;*/
	}

	.spec_top table th{
		text-align:left;
	}

	.info_off{
		background-color:#d90;
		color:#000;
		text-align:center;
		margin-left:1em;
		border-radius:4px;
		font-weight:600;
		padding:0 8px;
		font-size:13px;

	}

	.link_gc{
		display:inline-block;
		padding:12px 0 4px;
		line-height:1;
		border-bottom:1px solid #d00;
	}

}




/*----------------------------------------
	for SP
----------------------------------------*/

@media screen and (max-width: 480px) {


	#content_inner{
		padding:7% 0 7%;
		margin:0 auto 0;
		z-index:50;
		position:relative;
	}

	#base{
		background:transparent url('../img/trial/base_middle.jpg') center top;
		background-size:100%;
		position:relative;
		margin:30px auto 0;
		width:96%;
		box-shadow:2px 2px 3px rgba(0,0,0,0.2),-2px -2px 3px rgba(0,0,0,0.2),-2px 2px 3px rgba(0,0,0,0.2),2px -2px 3px rgba(0,0,0,0.2);
		overflow:hidden;
	}

	.base_background::before{
		content:'';
		background:transparent url('../img/steam/main.png') center top no-repeat;
		background-size:100%;
		display:block;
		width:120%;
		padding-top:700px;
		position:absolute;
		top:0;left:-10%;
		z-index:40;
	}

	#base::after{
		content:'';
		background:transparent url('../img/trial/base_bottom.jpg') center bottom no-repeat;
		background-size:100%;
		display:block;
		width:100%;
		padding-top:300px;
		position:absolute;
		bottom:0;left:0;
		z-index:10;
	}

	#base .base_inner{
		position:relative;
		z-index:45;
		width:88%;
		padding:50% 0 10%;
		margin:0 auto 0;
	}

	#base .base_background{
background-color:rgba(0,0,0,0.9);
z-index:30;
position:relative;
	}

	.date{
		display:block;
		margin:-12% auto 15px;
		width:100%;
	}

	.chara{
		display:block;
		position:absolute;
		z-index:25;
		top:210px;
		right:-280px;

	}


	h2{
		display:block;
		text-align:center;
		padding:0px 0 0;
		margin:0 0 0px;
		}

	h2{
		display:block;
		margin:0 0 0px;
	}



	h4{
		text-align:center;
		display:block;
		padding:17px 0 17px;
		margin:16% 0 20px;
		font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
		color:#960808;
		font-weight:800!important;
		font-size:28px;
		text-shadow:2px 2px 0px rgba(0,0,0,0.1);
		line-height:1.2;
		position:relative;
	}

	h4::before,
	h4::after {
	position: absolute;
	left: 0;
	content: '';
	width: 100%;
	height: 6px;
	box-sizing: border-box;
	}

	h4::before {
		top: 0;
		border-top: 2px solid rgba(50,0,0,0.5);
		border-bottom: 1px solid rgba(50,0,0,0.7);
	}

	h4::after {
		bottom: 0;
		border-top: 1px solid rgba(50,0,0,0.7);
		border-bottom: 2px solid rgba(50,0,0,0.5);
	}



	p{
		display:block;
		text-align:left;
		color:#422;
		line-height:1.7;
		font-size:14px;
		font-weight:normal!important;

	}


	.read{
		font-weight:800;
		font-size:13px;
		margin-bottom:5%;
		font-weight:400!important;
		padding-top:3%;
		color:#ddd;
		text-align:left!important;
	}


	.bold{
		font-size:120%;

	}



	h3{

		display:inline-block;
		padding:7% 0 0;
		font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
		color:#daa515;
		border-bottom:1px solid #daa515;

		font-weight:800!important;
		font-size:19px;
		padding-bottom:5px;
		line-height:1.2;

		margin-bottom:10px;
		margin-top:10%;
		text-align:center;
		text-shadow:2px 2px 2px #rgba(0,0,0,0.9);
	}

	.box_twoline .box{
		display:block;
		width:49%;
		float:left;
	}

	.box_twoline .box img{
		display:block;
		width:100%;
		border:1px solid #846a38;
	}

	.box_twoline.weapon img{
		border:1px solid #846a38;
	}

	.box_twoline .box p{
		color:#eee;
		font-size:12px;
				padding-top:10px;
	}

	p{
		color:#eee;
		font-size:12px;

	}

	.box_twoline .box p .tit{
		color:#fff;
		font-size:16px;
		font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
		color:#daa515;
		display:block;
	}

	.box_twoline .box:nth-of-type(2){
		margin-left:2%;
	}

	.center{
		text-align:center;
	}


	.center.center_nsp{
		text-align:left!important;
	}

	.box_twoline.text_weaponExp .box{
		display:block;
		width:100%;
		float:none;
		font-size:12px;
	}

	.text_weaponExp{
		padding:5%;
		border:1px solid #312e28;
		margin-top:20px;
		background-color:#000;
		color:#eee;
	}

	.text_weaponExp .tit{
		color:#fff;
		font-size:15px;
		font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
		color:#d8a72f;
	}

	.tokuten{
		border:2px solid #846a38;
		box-sizing:border-box;
		background-color:rgba(0,0,0,0.7);
		border-radius:6px;
		padding:5%;
		margin-top:10px;
		position:relative;
	}



	.tokuten h3{
		margin-top:0px;
		padding-top:0;
		font-size:14px;
	}

	.tokuten .icon{
		display:block;
		position:absolute;
		top:-20px;
		left:-10px;
		transform: rotate(-10deg);
		width:45px;
	}

	.btn_reserve_steam{
		display:inline-block;
		padding:2% 4%;
		color:#fff;
		text-align:center;
		background-color:#d00;
		border-radius:3px;
		border:1px solid #e6615d;
		box-sizing: border-box;
		margin-top:5px;
		/*margin-bottom:15px;*/
		width:100%;
	}

	.btn_store{
		margin:10px 0 30px;
	}

	.link_gc{
		display:block;
		text-align:center;
		margin-bottom:20px;
		/*border-bottom:1px solid #d00;*/
	}

	table.spec{
		display:block;
		border-collapse:collapse;
		width:auto;
		margin:0 auto ;
	}

	table.spec tr{
		width:100%;
	}

	table.spec th ,.spec td{
		border:1px solid #666;
		padding:8px 8px;
		font-size:10px;
		line-height:1.7;
		background-color:rgba(0,0,0,0.8);
	}

	table.spec th{
		width:26%;
	}

	table.spec td{
		width:66%;
	}

	 h5{
		color:#ddd;
		font-size:17px;
		margin-top:8%;
		padding-bottom:9px;
		text-align:center;
	}

	.btn_bottom{
		width:100%;
		/*display:flex;*/
		/*justify-content: space-around;*/
		margin:5% auto 10%;
	}

	.btn_bottom a{
		width:100%;
		display:block;
		background-color:#33b2b3;
		border:2px solid #88ddde;
		box-sizing:border-box;
		border-radius:6px;
		color:#fff;
		text-align:center;
		padding:10px 0;
		font-size:13px;
	}

	.btn_bottom a.btn_gi{
		background-color:#125688;
		border:2px solid #266fa4;
		margin-top:8px;
	}

	.exp{
		font-size:10px;
		line-height:1.7;
		padding-left:1em;
		color:#aaa;
	}
	.exp li{
		display:inline;
		margin-left:-1em;
				word-break: break-all;
	}

	.tokuten_list{
		border:1px solid #666;
		margin-top:20px;
	}

	.tokuten_list .tit{
		vertical-align:middle;
		display:block;
		text-align:center;
		padding:3% 5% 0;
	}

	.tokuten_list .cont{
		vertical-align:middle;
		display:block;
		padding:3% 5%;
		line-height:1.7;
		color:#ecedbd;
		font-size:12px;
	}

	.spec_top{
		width:100%;
		padding:15px 0;
		border-top:1px solid #666;
		border-bottom:1px solid #666;
		margin-top:30px;
		margin-bottom:-10px;
	}

	.spec_top .logo{
		width:200px;
		margin-top:10px;
	}

	.spec_top table{
		font-size:12px;
		/*margin:0 34px;*/
	}

	.spec_top table th{
		text-align:left;
	}

	.info_off{
		background-color:#d90;
		color:#000;
		text-align:center;
		margin-left:1em;
		border-radius:4px;
		font-weight:600;
		padding:0 8px;

	}

}

.red{
	color:#d00;
}