/* ===========================================
COMMON
=========================================== */
nav#SPN {
	background-color: #000000;
}
nav#SPN ul {
	margin: 0 auto 30px;
	max-width: 980px;
	width: 90%;
	padding: 2vw 0;
}
nav#SPN_card ul {
	margin: 30px auto;
	max-width: 980px;
	width: 90%;
	padding-top: 100px;
	margin-top: -70px;
}
nav#SPN li,
nav#SPN_card li {
	float: left;
	width: 24.25%;
	margin-right: 1%;
}
nav#SPN li:nth-child(4),
nav#SPN li:nth-child(8),
nav#SPN_card li:nth-child(4) {
	margin-right: 0;
}
nav#SPN li:nth-child(5),
nav#SPN li:nth-child(6),
nav#SPN li:nth-child(7),
nav#SPN li:nth-child(8),
nav#SPN_card li:nth-child(5),
nav#SPN_card li:nth-child(6),
nav#SPN_card li:nth-child(7) {
	margin-top: 1%;
}
@media only screen and (max-width: 750px) {
	nav#SPN ul {
		margin: 0 auto 5%;
		width: 95%;
		display: flex;
		flex-wrap: wrap;
	}
	nav#SPN_card ul {
		margin: 5% auto;
		width: 95%;
		padding-top: 20%;
		margin-top: -15%;
	}
	nav#SPN li {
		margin: 0;
		width: 50%;
		margin-right: 0;
		margin-bottom: 1%;
	}
	nav#SPN_card li {
		margin: 0;
		float: left;
		width: 50%;
		margin-right: 0;
		margin-bottom: 1%;
	}
	nav#SPN li:nth-child(odd),
	nav#SPN_card li:nth-child(odd) {
		margin-right: 0 !important;
	}
	nav#SPN li:nth-child(4),
	nav#SPN li:nth-child(5),
	nav#SPN li:nth-child(6),
	nav#SPN_card li:nth-child(4),
	nav#SPN_card li:nth-child(5),
	nav#SPN_card li:nth-child(6) {
		margin-right: 0 !important;
	}
	nav#SPN li:nth-child(5),
	nav#SPN li:nth-child(6),
	nav#SPN li:nth-child(7),
	nav#SPN li:nth-child(8),
	nav#SPN_card li:nth-child(5),
	nav#SPN_card li:nth-child(6),
	nav#SPN_card li:nth-child(7) {
		margin-top: 0 !important;
	}
}
/* ===========================================
1.TGS2019
=========================================== */
body.TGS .info {
	padding: 50px 0;
	width: 100%;
	background: url(../images/tgs2019/pc/bg.jpg) center top no-repeat;
	background-size: cover;
}


body.TGS .info h2 {
	margin: 0 auto;
	max-width: 676px;
	width:80%;
}
body.TGS .info p.present {
	margin: 0 auto 50px;
	max-width: 764px;
	width:80%;
}
body.TGS .info p.stage {
	margin: 30px auto 0;
	max-width: 870px;
	width:90%;
}
body.TGS .info p.eventDetail {
	margin: 50px auto 0;
	max-width: 797px;
	width:90%;
}

#DLN {
	margin-bottom: 50px;
	color: #fff;
	font-weight: bold;
	font-size: 18px;
}
@media only screen and (max-width: 750px) {
	/* ===========================================
	1.TGS2019
	=========================================== */
	body.TGS .info {
		padding: 0;
		width: 100%;
		background: none;
	}

	body.TGS .info h2 {
		margin: 0 auto;
		width:100%;
		max-width: 100%;
	}
	body.TGS .info p.present {
		margin: 0 auto;
		width:100%;
	}
	body.TGS .info p.stage {
		margin: 0 auto;
		width:100%;
	}
	body.TGS .info p.eventDetail {
		margin: 0 auto;
		width:100%;
	}
	#DLN {
		margin-bottom: 5%;
		color: #fff;
		font-weight: bold;
		font-size: 16px;
	}
	#DLN ul {
		line-height: 2.0 !important;
	}
}

/* ===========================================
2.フィギュア同梱版
=========================================== */
body.SP2 .info {
	padding: 0 0 70px;
	width: 100%;
}
body.SP2 .info h2 {
	margin: 0 auto;
	max-width: 621px;
	width:80%;
}
body.SP2 .info .base {
	margin: 50px auto 0;
	max-width: 980px;
}
body.SP2 .info .base .txt {
	padding: 0 50px;
	background: #fefbe8;
	text-align: left;
}
body.SP2 .info .base .txt .txt2 {
	margin-bottom:30px;
	padding: 2.5% 5% 3%;
	background: #fff1b1;
	font-size: 16px;
	border-radius: 10px;
}
body.SP2 .info .base .txt .txt2 p {
	text-align: center;
}
body.SP2 .info .base .txt .txt2 a {
	margin: 0 auto;
	padding: 1% 5%;
	background: #f2270e;
	color: #fff;
	border-radius: 5px;
}
body.SP2 .info .base .txt .txt2 a:link {
	color:#fff;
	text-decoration: none;
}
body.SP2 .info .base .txt .txt2 a:hover {
	background: #ff982a;
}
body.SP2 .info .base .txt2 ul {
	margin-top: 20px;
}
body.SP2 .info .base .txt2 li {
	padding-top: 5px;
}

body.SP2 .notes li {
	margin-bottom: 5px;
	font-size: 12px;
	line-height: 1.5 !important;
}
body.SP2 .notes li:last-child {
	margin-bottom: 0;
}

@media only screen and (max-width: 750px) {
	body.SP2 .info .base {
		margin: 0 auto 0;
		max-width: 980px;
	}
	body.SP2 .info .base .txt {
		padding: 0 5%;
		background: #fefbe8;
		text-align: left;
	}
	body.SP2 .info .base .txt .txt2 {
		margin-bottom: 3%;
		padding: 5% 2.5%;
		background: #fff1b1;
		font-size: 3vw;
		border-radius: 10px;
	}
	body.SP2 .info .base .txt .txt2 a {
		margin: 0 auto;
		padding: 2% 5%;
		background: #f2270e;
		color: #fff;
		border-radius: 5px;
	}
	body.SP2 .notes li {
		margin-bottom: 1%;
		font-size: 12px;
		line-height: 1.2 !important;
	}
}

/* ===========================================
ダウンロード版予約特典
=========================================== */
.info {
	padding: 0 0 70px;
	width: 100%;
}
.info h2 {
	margin: 0 auto;
	max-width: 621px;
	width:80%;
}
.info .base {
	margin: 50px auto 0;
	max-width: 980px;
	width: 90%;
	position: relative;
}
body.dl_tokuten .info .base .txt {
	padding: 0 50px;
	background: #fefbe8;
	text-align: left;
	position: relative;
}
body.dl_tokuten .info .base .txt p {
	margin: 0 auto 50px;
	max-width: 593px;
	width: 72%;
}
body.dl_tokuten .notes li {
	margin-bottom: 5px;
	font-size: 12px;
	line-height: 1.5 !important;
}
body.dl_tokuten .notes li:last-child {
	margin-bottom: 0;
}

body.dl_tokuten .info .base .grayout {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(128,128,128,0.8);
}
body.dl_tokuten .info .base .grayout p {
	color: white;
	font-size: 30px;
	font-weight: bold;
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}

@media only screen and (max-width: 750px) {
	.info {
		padding: 0 0 10%;
		width: 100%;
	}
	.info h2 {
		margin: 0 auto;
		max-width: 100%;
		width:100%;
	}
	.info .base {
		margin: 0 auto 0;
		max-width: 90%;
		width: 90%;
	}
	body.dl_tokuten .info .base .txt {
		padding: 0 5%;
		background: #fefbe8;
		text-align: left;
	}
	body.dl_tokuten .info .base .txt p {
		margin: 0 auto 10%;
		width: 100%;
	}
	body.dl_tokuten .notes li {
		margin-bottom: 1%;
		font-size: 12px;
		line-height: 1.2 !important;
	}
	body.dl_tokuten .info .base .grayout p {
		font-size: 20px;
	}
}

/* ===========================================
店舗別オリジナル特典
=========================================== */
body.store .info ul {
	margin: 0 auto;
	max-width: 980px;
	width: 90%;
}
body.store .info ul li {
	margin-top: 15px;
	position: relative;
}
body.store .info ul li:first-child {
	margin-top:30px;
}
body.store .info ul li p {
	position: absolute;
	bottom: 12%;
	left: 8%;
	width: 37%;
}
body.store .info ul.chuuibox {
	margin-top:30px;
	text-align: left;
	color:#fff;
}
body.store .info ul.chuuibox li {
	font-size: 12px;
	line-height: 1.5 !important;
	margin-top: 0;
	margin-bottom: 5px;
}

@media only screen and (max-width: 750px) {
	body.store .info ul li {
		margin-top: 2%;
		position:static;
	}
	body.store .info ul li:first-child {
		margin-top:5%;
	}
}

/* ===========================================
早期購入特典
=========================================== */
body.early .info .base .txt {
	padding: 0 50px;
	background: #fefbe8;
	text-align: left;
	position: relative;
}
body.early .info .base .txt p {
	margin: 0 auto 50px;
	width: 593px;
}
body.early .notes li {
	margin-bottom: 5px;
	font-size: 12px;
	line-height: 1.5 !important;
}
body.early .notes li:last-child {
	margin-bottom: 0;
}
body.early ul.storeB {
	margin-bottom:30px;
	position: relative;
}
body.early .storeB li {
	float:left;
	width: 49%;
}
body.early .storeB li:first-child {
	margin-right: 2%;
	margin-bottom: 2%;
}
body.early .info .base .grayout {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(128,128,128,0.8);
}
body.early .info .base .grayout p {
	color: white;
	font-size: 30px;
	font-weight: bold;
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}

@media only screen and (max-width: 750px) {
	body.early .storeB li {
		float:none;
		width: 100%;
	}
	body.early .storeB li:first-child {
		margin-right: 0;
	}
	body.early .info .base .txt {
		padding: 0 5%;
		background: #fefbe8;
		text-align: left;
	}
	body.early .notes ul {
		margin-bottom: 0;
		background: pink;
	}
	body.early .info .base .grayout p {
		font-size: 20px;
	}
}

/* ===========================================
早期購入特典 nsw版
=========================================== */
body.early_nsw .info .base .txt {
	padding: 0 50px;
	background: #fefbe8;
	text-align: left;
}
body.early_nsw .info .base .txt p {
	margin: 0 auto 50px;
	width: 593px;
}
body.early_nsw .info .base .txt p.storeB {
	width: 100%;
	max-width: 600px;
}
body.early_nsw .notes li {
	margin-bottom: 5px;
	font-size: 12px;
	line-height: 1.5 !important;
}
body.early_nsw .notes li:last-child {
	margin-bottom: 0;
}
body.early_nsw ul.storeB {
	width: 74%;
	margin: 0 auto;
	margin-bottom:30px;
}
body.early_nsw .storeB li {
	width: 100%;
	max-width: 600px;
}
body.early_nsw .storeB li:first-child {
	margin-right: 2%;
	margin-bottom: 2%;
}

@media only screen and (max-width: 750px) {
	body.early_nsw .storeB li {
		float:none;
		width: 100%;
	}
	body.early_nsw .storeB li:first-child {
		margin-right: 0;
	}
	body.early_nsw .info .base .txt {
		padding: 0 5%;
		background: #fefbe8;
		text-align: left;
	}
	body.early_nsw .notes ul {
		margin-bottom: 0;
		background: pink;
	}
}

/* ===========================================
ジャンプフェスタ 2020
=========================================== */
.jump {
	padding: 0 0 0;
	width: 100%;
}
.jump .info {
	background: url(../images/jump/pc/bg.png) center top no-repeat;
}
.jump h2 {
	margin: 80px auto 0;
	max-width: 858px;
	width:90%;
}
.jump .jumpDetail {
	margin: 50px auto 0;
	max-width: 623px;
	width:90%;
}

.jump .jfB {
	margin: 50px auto;
	max-width: 700px;
	width: 90%;
}

.jump .booth {
	margin: 0 auto;
	max-width: 900px;
	width: 90%;
	position: relative;
}
.jump #bn {
	margin: 70px auto 0;
}

.jump #db {
	margin: 20px auto 0;
}
.jump .booth p.b {
	position: absolute;
	bottom: 70px;
	left: 20%;
	width: 60%;
}

.jump .Live {
	margin: 0 auto;
	width: 70%;
	position: absolute;
	top:58%;
	left:15%;
}
.jump .Live p.i {
	background: #000;
}
.jump .Live a img {
	border:#fff022 solid 2px;
	-webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
.jump .Live a img {
	transition: 1.0s ;
}

.jump .Live a img:hover {
	opacity: 0.5 ;
}

@media only screen and (max-width: 750px) {
	.jump .info {
		background: none;
	}
	.jump h2 {
		margin: 0 auto 0;
		width:100%;
	}
	.jump .jumpDetail {
		margin: 0 auto;
		width:100%;
	}
	.jump .jfB {
		margin: 0 auto;
		width: 90%;
	}
	.jump .Live {
		margin: 3% auto 8%;
		width: 80%;
		top:70%;
		left:10%;
	}
	.jump #bn {
		margin: 10% auto 0;
	}

	.jump #db {
		margin: 3% auto 0;
	}
	.jump .booth p.b {
		position: absolute;
		bottom: 2%;
		left: 5%;
		width: 90%;
	}
}

/* ===========================================
攻略本
=========================================== */
body.SP2 .txt {
	padding-top: 40px!important;
	font-size: 16px;
}
body.SP2 .txt p {
	line-height: 1.5;
}
body.SP2 .txt p.title {
	margin-bottom: 20px;
	color:#e60012;
	font-weight: bold;
	text-align: center;
}
body.SP2 .txt a:link,
body.SP2 .txt a:visited {
	color:#f2270e;
}
body.SP2 .txt a:hover {
	text-decoration: none;
}

@media only screen and (max-width: 750px) {
	body.SP2 h2 {
		margin: 0 auto 0;
		width:100% !important;
	}
	body.SP2 .txt {
		padding-top: 5%!important;
		font-size: 2.5vw;
	}
	body.SP2 .txt p {
		line-height: 1.5;
	}
	body.SP2 .txt p.title {
		margin-bottom: 3%;
		color:#e60012;
		font-weight: bold;
		text-align: left;
	}
}

#update {
	position: relative;
}
#update p {
	width: 50%;
	position: absolute;
	bottom: 30px;
	left: 25%;
}

@media only screen and (max-width: 750px) {
	#update {
		position: relative;
	}
	#update p {
		width: 70%;
		position: absolute;
		bottom: 2.5%;
		left: 15%;
	}
}

/* ===========================================
PS4 Xbox版 NSW版 ナビ
=========================================== */
#hard_nav {
  width: 90%;
  max-width: 1500px;
  margin: 0 auto 30px;
}

#hard_nav .hard_nav_contents {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.625vw 0;
}

#hard_nav .hard_nav_contents li {
  width: 32.0666%;
}

#hard_nav .hard_nav_contents li span ,
#hard_nav .hard_nav_contents li a {
  display: block;
  width: 100%;
  padding: 12.8898% 0 0;
  overflow: hidden;
  line-height: 0;
  text-indent: 100%;
  white-space: nowrap;
}

#hard_nav .hard_nav_contents li span ,
#hard_nav .hard_nav_contents li a:hover {
  background-position: center bottom !important;
}

#hard_nav .hard_nav_contents li:nth-of-type(1) span ,
#hard_nav .hard_nav_contents li:nth-of-type(1) a {
  background: url(../images/nav/nav_ps4.png) center top / 100% no-repeat;
}

#hard_nav .hard_nav_contents li:nth-of-type(2) span ,
#hard_nav .hard_nav_contents li:nth-of-type(2) a {
  background: url(../images/nav/nav_nsw.png) center top / 100% no-repeat;
}

#hard_nav .hard_nav_contents li:nth-of-type(3) span ,
#hard_nav .hard_nav_contents li:nth-of-type(3) a {
  background: url(../images/nav/nav_ps5.png) center top / 100% no-repeat;
}



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

#hard_nav .hard_nav_contents {
  gap: 1.6vw 0;
}

#hard_nav .hard_nav_contents:after {
  content: "";
  display: block;
  width: 49.3598%;
}

#hard_nav .hard_nav_contents li {
  width: 49.3598%;
}

#hard_nav .hard_nav_contents li span ,
#hard_nav .hard_nav_contents li a {
  padding: 25.6484% 0 0;
}

#hard_nav .hard_nav_contents li:nth-of-type(1) span ,
#hard_nav .hard_nav_contents li:nth-of-type(1) a {
  background: url(../images/nav/sp/nav_ps4.png) center top / 100% no-repeat;
}

#hard_nav .hard_nav_contents li:nth-of-type(2) span ,
#hard_nav .hard_nav_contents li:nth-of-type(2) a {
  background: url(../images/nav/sp/nav_nsw.png) center top / 100% no-repeat;
}

#hard_nav .hard_nav_contents li:nth-of-type(3) span ,
#hard_nav .hard_nav_contents li:nth-of-type(3) a {
  background: url(../images/nav/sp/nav_ps5.png) center top / 100% no-repeat;
}

}


/* ===========================================
RTキャンペーンページ
=========================================== */
#rtcp.info .base {
	margin-top: 20px;
}
#rtcp .campain_bnr,
#rtcp .addition_bnr {
	max-width: 1600px;
	margin: 0 auto;
	margin-top: 30px;
}
#rtcp .fin_title {
	max-width: 900px;
	margin: 0 auto;
	margin-top: 60px;
	margin-bottom: 60px;
}
.finishi {
	position: relative;
}
#rtcp .grayout {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(128,128,128,0.8);
}

#rtcp .grayout p {
	color: white;
	font-size: 48px;
	font-weight: bold;
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}

#rtcp .present {
	position: relative;
}
#rtcp .tweet_btn {
	position: absolute;
	bottom: 6.4%;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

#rtcp a img:hover {
	opacity: 0.75;
}

#rtcp .bnr_area {
	max-width: 920px;
	margin: 0 auto;
	margin-top: 40px;
}

#rtcp .bnr_dokkan,
#rtcp .bnr_legends,
#rtcp .bnr_warriors {
	position: relative;
	margin-top: 20px;
}

#rtcp .store_btn {
	width: 49%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	right: 2%;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}

#rtcp .attention {
	text-align: left;
	color: #ffffff;
	font-weight: normal;
	margin-top: 30px;
	text-indent: -1em;
	margin-left: 1em;
}

#rtcp .attention li {
	margin-bottom: 10px;
}

.pd_right {
	padding-right: 10px;
}

.base h3 {
	color: #ffffff;
	font-size: 24px;
	margin-bottom: 40px;
}

@media only screen and (max-width: 750px) {
	#rtcp .campain_bnr {
		margin-top: 0;
	}
	#rtcp .fin_title {
		max-width: 636px;
		width: 90%;
		margin-top: 4vw;
		margin-bottom: 4vw;
	}
	#rtcp .grayout p {
		font-size: 5vw;
	}
	#rtcp .tweet_btn {
		width: 70%;
		bottom: 14%;
	}
	#rtcp .bnr_area {
		width: 90%;
		margin-top: 6vw;
	}
	#rtcp .bnr_dokkan,
	#rtcp .bnr_legends,
	#rtcp .bnr_warriors {
		margin-top: 3vw;
	}
	#rtcp .store_btn {
		width: 80%;
		top: auto;
		left: auto;
		left: 50%;
		bottom: 6%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
	}

	#rtcp .attention {
		font-size: 12px;
		margin-top: 6vw;
	}
	#rtcp .attention li {
		margin-bottom: 2vw;
	}

	.pd_right {
		padding-right: 7vw;
	}
	.base h3 {
		font-size: 15px;
		margin-bottom: 6vw;
	}
}

/* ===========================================
壁紙ダウンロードページ
=========================================== */
#wp.info .base {
	margin-top: 20px;
}

#wp .present {
	position: relative;
}

#wp .pc_dl_btn_first {
	position: absolute;
	bottom: 310px;
	left: 172px;
}

#wp .pc_dl_btn_second {
	position: absolute;
	bottom: 310px;
	right: 170px;
}

#wp .bnr_area {
	max-width: 920px;
	margin: 0 auto;
	margin-top: 40px;
}

#wp .bnr_dokkan,
#wp .bnr_legends,
#wp .bnr_warriors {
	position: relative;
	margin-top: 20px;
}

#wp .store_btn {
	width: 49%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	right: 2%;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}

#wp .attention {
	text-align: left;
	color: #ffffff;
	font-weight: normal;
	margin-top: 30px;
	text-indent: -1em;
	margin-left: 1em;
}

#wp .attention li {
	margin-bottom: 10px;
}

@media screen and (max-width: 1100px) {
	#wp .pc_dl_btn_first,
	#wp .pc_dl_btn_second {
		display: inline-block;
		width: calc( 300 / 1100 * 100vw);
		bottom: calc( 310 / 1100 * 100vw);
	}
	#wp .pc_dl_btn_first {
		left: calc( 172 / 1100 * 100vw);
	}

	#wp .pc_dl_btn_second {
		right: calc( 170 / 1100 * 100vw);
	}
}

@media only screen and (max-width: 750px) {
	#wp .sp_dl_btn_first,
	#wp .sp_dl_btn_second {
		display: inline-block;
		width: 80%;
		position: absolute;
		left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
		z-index: 10;
	}

	#wp .sp_dl_btn_first {
		top: 144vw;
	}

	#wp .sp_dl_btn_second {
		bottom: 86vw;
	}

	#wp .bnr_area {
		width: 90%;
		margin-top: 6vw;
	}
	#wp .bnr_dokkan,
	#wp .bnr_legends,
	#wp .bnr_warriors {
		margin-top: 3vw;
	}
	#wp .store_btn {
		width: 80%;
		top: auto;
		left: auto;
		left: 50%;
		bottom: 6%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
	}

	#wp .attention {
		font-size: 12px;
		margin-top: 6vw;
	}
	#wp .attention li {
		margin-bottom: 2vw;
	}
}

/*
体験版ページ
*/
#trial {
  margin-top: 2vw;
}

#trial .bg {
  background-color: #000000;
  padding: 1vw 0;
}

#trial .bg .contents {
  position: relative;
  background-image: url(../images/trial/bg_trial.png);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100% auto;
}

#trial .bg .contents h2 {
  max-width: 619px;
  width: calc(619 / 1920 * 100vw);
  padding-top: 5vw;
  padding-left: 7.6vw;
}

#trial .bg .contents h3.head_first {
  max-width: 202px;
  width: calc(202 / 1920 * 100vw);
  padding-top: 2.8vw;
  padding-left: 7.8vw;
}

#trial .bg .contents p.txt_first {
  max-width: 632px;
  width: calc(632 / 1920 * 100vw);
  padding-top: 0.6vw;
  padding-left: 7.4vw;
}

#trial .bg .contents h3.head_second {
  max-width: 382px;
  width: calc(382 / 1920 * 100vw);
  padding-top: 2vw;
  padding-left: 7.8vw;
}

#trial .bg .contents p.txt_second {
  max-width: 60px;
  width: calc(60 / 1920 * 100vw);
  padding-top: 0.6vw;
  padding-left: 7.4vw;
}

#trial .bg .contents .btn {
  max-width: 610px;
  width: calc(610 / 1920 * 100vw);
  padding-top: 1vw;
  padding-left: 7.4vw;
  padding-bottom: 0;
}

#trial .bg .contents .btn li {
  padding-bottom: 1vw;
}

#trial .btn_about {
  max-width: 920px;
  width: calc(920 / 1920 * 100vw);
  margin: 0 auto;
  padding: 2vw 0;
}

@media only screen and (max-width: 750px) {
  #trial {
    margin-top: 8vw;
  }

  #trial .bg {
    padding: 2vw 0;
  }

  #trial .bg .contents {
    background-image: url(../images/trial/sp/bg_trial.png);
  }

  #trial .bg .contents h2 {
    max-width: 531px;
    width: calc(531 / 750 * 100vw);
    padding-top: 10vw;
    padding-left: 4vw;
  }

  #trial .bg .contents h3.head_first {
    width: calc(202 / 750 * 100vw);
    padding-top: 4vw;
    padding-left: 4vw;
  }

  #trial .bg .contents p.txt_first {
    max-width: 463px;
    width: calc(463 / 750 * 100vw);
    padding-top: 1vw;
    padding-left: 4vw;
  }

  #trial .bg .contents h3.head_second {
    width: calc(382 / 750 * 100vw);
    padding-top: 3vw;
    padding-left: 4vw;
  }

  #trial .bg .contents p.txt_second {
    width: calc(60 / 750 * 100vw);
    padding-top: 1vw;
    padding-left: 4vw;
  }

  #trial .bg .contents .btn {
    max-width: 670px;
    width: calc(670 / 750 * 100vw);
    padding-top: 8vw;
    padding-left: 0;
    padding-bottom: 4vw;
    margin: 0 auto;
  }

  #trial .bg .contents .btn li {
    padding-bottom: 3vw;
  }

  #trial .btn_about {
    max-width: 670px;
    width: calc(670 / 750 * 100vw);
    padding: 10vw 0;
  }

  .toppage {
    width: calc(610 / 750 * 100vw);
    margin: 0 auto;
    padding: 8vw 0;
  }
}

/*
twitterキャンペーン
*/
#twittercp .lower {
	padding-bottom: 2vw;
}

#twittercp h2 {
	max-width: 621px;
	width: calc(621 / 1920 * 100vw);
	margin: 2vw auto;
}

#twittercp .content {
	position: relative;
  background-image: url(../images/twittercp/contents_bg.png);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: contain;
	max-width: 980px;
	width: calc(980 / 1920 * 100vw);
	height: calc(1258 / 1920 * 100vw);
	margin: 0 auto;
}

#twittercp h3 {
	max-width: 812px;
	width: calc(812 / 1920 * 100vw);
	margin: 0 auto;
	padding-top: 2vw;
}

#twittercp .header_sub {
	font-weight: bold;
	color: #e60012;
	font-size: calc(30 / 1920 * 100vw);
	padding-top: 3vw;
}

#twittercp .schedule_area {
	width: 80%;
	margin: 0 auto;
	padding-top: 2vw;
}

#twittercp .schedule_txt {
	text-align: left;
	color: #000;
	font-weight: bold;
	line-height: 1.15;
	font-size: calc(24 / 1920 * 100vw);
}

#twittercp .schedule_txt.second {
	padding-top: 2vw;
}

#twittercp .twitter {
	max-width: 469px;
	width: calc(469 / 1920 * 100vw);
	margin: 0 auto;
	padding-top: 3vw;
}

#twittercp .terms {
	max-width: 600px;
	width: calc(600 / 1920 * 100vw);
	margin: 0 auto;
	padding-top: 3vw;
}

#twittercp .application_rules {
	background-color: rgba(0, 0, 0, 0.7);
	max-width: 980px;
	width: calc(980 / 1920 * 100vw);
	height: calc(470 / 1920 * 100vw);
	margin: 0 auto;
	margin-top: 3vw;
	overflow-y: scroll;
	padding: 2vw 0;
}

#twittercp .application_rules p,
#twittercp .sub_terms {
	width: 90%;
	margin: 0 auto;
	text-align: left;
	color: #ffffff;
	line-height: 1.5;
	font-size: calc(16 / 1920 * 100vw);
}

#twittercp .sub_terms {
	max-width: 980px;
	width: calc(980 / 1920 * 100vw);
	margin: 1vw auto;
}

@media only screen and (max-width: 750px) {
	#twittercp .lower {
		padding-bottom: 2vw;
	}

	#twittercp h2 {
		max-width: 525px;
		width: calc(525 / 750 * 100vw);
		margin: 8vw auto 6vw;
	}

	#twittercp .content {
		background-image: url(../images/twittercp/sp/contents_bg.png);
		max-width: 670px;
		width: calc(670 / 750 * 100vw);
		height: calc(1451 / 750 * 100vw);
	}

	#twittercp h3 {
		max-width: 617px;
		width: calc(617 / 750 * 100vw);
		padding-top: 6vw;
	}

	#twittercp .header_sub {
		font-size: calc(34 / 750 * 100vw);
		padding-top: 6vw;
	}

	#twittercp .schedule_area {
		width: 90%;
		margin: 0 auto;
		padding-top: 6vw;
	}

	#twittercp .schedule_txt {
		font-size: calc(26 / 750 * 100vw);
	}

	#twittercp .schedule_txt.second {
		padding-top: 6vw;
	}

	#twittercp .twitter {
		width: calc(469 / 750 * 100vw);
		padding-top: 10vw;
	}

	#twittercp .terms {
		max-width: 600px;
		width: calc(600 / 750 * 100vw);
		padding-top: 8vw;
	}

	#twittercp .application_rules {
		max-width: 670px;
		width: calc(670 / 750 * 100vw);
		height: calc(600 / 750 * 100vw);
		margin-top: 3vw;
		padding: 2vw 0;
	}

	#twittercp .application_rules p,
	#twittercp .sub_terms {
		width: 90%;
		font-size: calc(16 / 750 * 100vw);
	}
	#twittercp .sub_terms {
		margin: 4vw auto 6vw;
	}
}

/* ===========================================
ジャンプフェスタ2022
=========================================== */
#jf2022 {
	padding: 0 0 70px;
	width: 100%;
}
#jf2022 h2 {
	margin: 0 auto;
	max-width: 917px;
	width: 64%;
}
#jf2022 .base {
	margin: 50px auto 0;
	max-width: 980px;
	width: 70%;
	position: relative;
}
#jf2022 .title01 {
	position: absolute;
	top: 3%;
	left: 0;
	z-index: 9;
}
#jf2022 .txt01 {
	position: absolute;
	top: 22.4%;
	left: 0;
	z-index: 9;
}
#jf2022 .btn {
	width: 70%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%);
	z-index: 9;
}
#jf2022 .kakarot {
	position: absolute;
	top: 10%;
	right: -20%;
	z-index: 1;
	max-width: 640px;
	width: 66%;
}
#jf2022 .title02 {
	position: absolute;
	bottom: 25%;
	left: 0;
	z-index: 9;
}
#jf2022 .txt02 {
	position: absolute;
	bottom: 3%;
	left: 0;
	z-index: 9;
}
#jf2022 .finish {
	width: 100%;
	position: relative;
}
#jf2022 .grayout {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(128,128,128,0.8);
	z-index: 10;
}
#jf2022 .grayout p {
	color: white;
	font-size: 48px;
	font-weight: bold;
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}
@media only screen and (max-width: 750px) {
	#jf2022 {
		padding: 0 0 10%;
		width: 100%;
	}
	#jf2022 h2 {
		margin: 0 auto 6%;
		max-width: 100%;
		width: 90%;
	}
	#jf2022 .base {
		margin: 0 auto 0;
		max-width: 90%;
		width: 90%;
	}
	#jf2022 .title01 {
		top: 2.6%;
	}
	#jf2022 .txt01 {
		top: 24%;
	}
	#jf2022 .btn {
		width: 94%;
	}
	#jf2022 .kakarot {
		position: absolute;
		top: 15%;
    right: -5.5%;
    z-index: 1;
    width: 70%;
	}
	#jf2022 .title02 {
		bottom: 23%;
	}
	#jf2022 .grayout p {
		font-size: 20px;
		line-height: 1.5;
	}
}