@charset "utf-8"; /*
16px基準文字サイズ対応表
10px  62.5%
11px  68.75%
12px  75%
13px  81.25%
14px  87.5%
15px  93.75%
16px  100%
17px  106.25%
18px  112.5%
19px  118.75%
20px  125%
21px  131.25%
22px  137.5%
23px  143.75%
24px  150%
25px  156.25%
26px  162.5%
*/

/* reset */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	font-size: 100%;
	vertical-align: baseline;
}
html {
	overflow-y: scroll;
	line-height: 1;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
	vertical-align: middle;
}
q, blockquote {
	quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after {
	content: "";
	content: none;
}
a img {
	border: none;
}
a {
	text-decoration: none;
}
article, aside, details, figcaption, figure, footer, header, menu, nav, section, summary {
	display: block;
}

/*common*/
html {
	height:100%;
}
body {
	width:100%;
	height:100%;
	font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka",Arial,Verdana,Helvetica,sans-serif;
	font-size:16px;
	line-height:20px;
	color:#fff;
	position: relative;
	background: #236214;
}
body:before {
	content: "";
	display: block;
	position: fixed;
	width: 100%;
	height: 100%;
	background-image: url(../img/main_bg.jpg);
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #236214;
	z-index: -1;
}
body.itf:before {
	content: "";
	display: block;
	position: fixed;
	width: 100%;
	height: 100%;
	background: url(../img/special/itf/bg-collabo.jpg) center center / cover no-repeat fixed #000;
	z-index: -1;
}
body.fcbarcelona:before {
	content: "";
	display: block;
	position: fixed;
	width: 100%;
	height: 100%;
	background: url(../img/special/fcbarcelona/bg-collabo.jpg) center center / cover no-repeat fixed #000;
	z-index: -1;
}
body.collabo-shoot-body:before {
	content: "";
	display: block;
	position: fixed;
	width: 100%;
	height: 100%;
	background: url(../img/main_bg-collabo-shoot.jpg) center center / cover no-repeat fixed #236214;
	z-index: -1;
}

@media screen and (max-width:480px) {
    body.sp:before {
        height: 100vh;
        background-image: url(../img/main_bg_sp.jpg);
		background-position: center;
    	background-size: cover;
    	background-repeat: no-repeat;
    	background-color: #236214;
    }
}
body.sp.itf:before {
	height: 100vh;	
	background: url(../img/special/itf/bg-collabo.jpg) center center / cover no-repeat fixed #000;
}
body.sp.fcbarcelona:before {
	height: 100vh;	
	background: url(../img/special/fcbarcelona/bg-collabo.jpg) center center / cover no-repeat fixed #000;
}
a {
	color:#fff;
}
#wrapper {
	position: relative;
	width:100%;
}
#container {
	width:100%;
	height: 100%;
}
.common-header {
	position: relative;
	background: #fff;
	height: 34px;
	animation:indexCommonHeaderAnimeSP 1s ease 1s 1;
	-webkit-animation:indexCommonHeaderAnimeSP 1s ease 1s 1;
	animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	z-index: 500;
}
@keyframes indexCommonHeaderAnimeSP {
	0% {
		opacity: 0;
		transform: translate(0, -34px);
	}
	100% {
		opacity: 1;
		transform: translate(0,0);
	}
}
@-webkit-keyframes indexCommonHeaderAnimeSP {
	0% {
		opacity: 0;
		transform: translate(0,-34px);
	}
	100% {
		opacity: 1;
		transform: translate(0,0);
	}
}
.common-header .konami-logo a {
	position: absolute;
	display: block;
	padding: 6px 10px 8px;
	z-index: 50;
	left: 0;
	top: 0;
}
.common-header .konami-logo a img {
	width: 94px;
	vertical-align: middle;
}
.common-header ul {
	padding: 4px 8px 0 0;
	text-align: right;
}
.common-header ul li {
	display: inline-block;
}
.pc .common-header ul li:nth-child(2) {
	display: none;
}
.common-header ul li a {
	display: inline-block;
}
.common-header ul li a img {
	width: 25px;
	height: 25px;
	vertical-align: bottom;
	border-radius: 3px;
}
.common-header ul li a img:hover {
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	opacity: 0.7;
}

/*index*/
#wrapper.index .main-ttl {
	overflow: hidden;
	margin: -34px 0 0 0;
    position: relative;
}
#wrapper.index .main-ttl .main-visual {
	position: relative;
	overflow: hidden;
	max-width: 980px;
	margin: 0 auto;
	padding: 60% 0 0 0;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
#wrapper.index .main-ttl .main-visual-in {
	max-width: 917px;
	margin: 0 auto;
}
#wrapper.index .main-ttl .main-visual-in .chara-bg {
	position: absolute;
	display: block;
	margin: 13px auto 0;
	width: 100%;
	height: 100%;
	top: 6%;
	background: url(../img/index_main_chara_bg_pc.png?v5) no-repeat top center;
	background-size: 100% auto;
	animation:indexCharaBgAnimeSP .7s ease .3s 1;
	/*通常時	-webkit-animation:indexCharaBgAnimeSP .7s ease .3s 1;*/
	-webkit-animation:indexCharaBgAnimeSP .7s cubic-bezier(0.13, 0.75, 0.49, 0.99) .3s 1;
	z-index: 550;
}
@keyframes indexCharaBgAnimeSP {
	0% {
		opacity: 0;
		transform:translate(0,100px);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
@-webkit-keyframes indexCharaBgAnimeSP {
	0% {
		opacity: 0;
		transform:translate(0,100px);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
/*通常時@keyframes indexCharaBgAnimeSP {
	0% {
		opacity: 0;
		transform:translate(0,-200px);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
@-webkit-keyframes indexCharaBgAnimeSP {
	0% {
		opacity: 0;
		transform:translate(0,-200px);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}*/
#wrapper.index .main-ttl .main-visual-in .pawasakakun {
	position: absolute;
	width: 40%;
	height: 66%;
	top: 0;
	left: 26%;
	background: url(../img/index_main_pawasakakun_pc.png) no-repeat center top;
	background-size: auto 100%;
	animation:indexPawasakaAnimeSP 1s ease 1;
	-webkit-animation:indexPawasakaAnimeSP 1s ease 1;
	animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	z-index: 550;
}
@keyframes indexPawasakaAnimeSP {
	0% {
		opacity: 0;
	}
	20% {
		opacity: 0;
		transform:scale(0.8,0.8) translateY(100px);
	}
	65% {
		transform:scale(1.2,1.2) translateY(-10px);
	}
	100% {
		opacity: 1;
		transform:scale(1,1) translateY(0);
	}
}
@-webkit-keyframes indexPawasakaAnimeSP {
	0% {
		opacity: 0;
	}
	20% {
		opacity: 0;
		transform:scale(0.8,0.8) translateY(100px);
	}
	65% {
		transform:scale(1.2,1.2) translateY(-10px);
	}
	100% {
		opacity: 1;
		transform:scale(1,1) translateY(0);
	}
}
#wrapper.index .main-ttl .main-visual-in .dlcount {
	position: absolute;
    width: 25%;
    height: 15%;
    top: 58%;
    left: 48%;
	background: url(../img/txt_dlcount_pc.png?v8) no-repeat;
	background-size: 100% auto;
	-webkit-animation:indexDLcount .5s ease 1s 1;
	animation:indexDLcount .5s ease 1s 1;
	animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	z-index: 580;
}
@-webkit-keyframes indexDLcount {
	0% {
		opacity: 0;
		transform:scale(1.2,1.2);
	}
	100% {
		opacity: 1;
		transform:scale(1,1);
	}
}
@keyframes indexDLcount {
	0% {
		opacity: 0;
		transform:scale(1.2,1.2);
	}
	100% {
		opacity: 1;
		transform:scale(1,1);
	}
}
#wrapper.index .main-ttl .main-visual h1 {
	position: relative;
	overflow: hidden;

/*	padding: 23% 0 0 0;
	width: 44%;
	height: 0;
	margin: -15% auto 0;*/

	padding: 23% 0 0 0;
    width: 38%;
    height: 0;
    margin: -14% auto 12px;


	background: url(../img/index_pawa_logo.png) no-repeat top center;
	background-size: 100% auto;
	animation:indexPawaLogoAnimeSP .5s ease .3s 1;
	-webkit-animation:indexPawaLogoAnimeSP .5s ease .3s 1;
	z-index: 570;
}
#wrapper.index .main-ttl .main-visual-in .ball {
	position: absolute;
	width: 20%;
	height: 35%;
	top: -7%;
	right: 22%;
	background: url(../img/index_main_ball.png) no-repeat;
	background-size: 100% auto;
	animation:indexBallAnimeSP 1.5s ease 1;
	-webkit-animation:indexBallAnimeSP 1.5s ease 1;
	z-index: 550;
}
@keyframes indexPawaLogoAnimeSP {
	0% {
		transform: translate(0,200px);
		opacity: 0;
	}
	100% {
		transform: translate(0,0);
		opacity: 1;
	}
}
@-webkit-keyframes indexPawaLogoAnimeSP {
	0% {
		transform: translate(0,200px);
		opacity: 0;
	}
	100% {
		transform: translate(0,0);
		opacity: 1;
	}
}
@keyframes indexBallAnimeSP {
	0% {
		opacity: 0;
	}
	35% {
		opacity: 0;
		transform:scale(0,0) translate(-400px,500px);
	}
	55% {
		transform:scale(1,1) translate(0,0);
	}
	100% {
		opacity: 1;
		transform:scale(1,1) translate(0,0);
	}
}
@-webkit-keyframes indexBallAnimeSP {
	0% {
		opacity: 0;
	}
	35% {
		opacity: 0;
		transform:scale(0,0) translate(-400px,500px);
	}
	55% {
		transform:scale(1,1) translate(0,0);
	}
	100% {
		opacity: 1;
		transform:scale(1,1) translate(0,0);
	}
}
#wrapper.index .important-notice {
	max-width: 880px;
	margin: 0 auto;
	padding: 10px;
}
#wrapper.index .important-notice a {
	display: block;
	padding: 4px;
	font-size: 87.5%;
	line-height: 1.4;
	text-align: center;
	border-radius: 6px;
	color: #fff;
	background: #f00;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.index .important-notice a:hover {
	color: #f00;
	background: #fff;
}
#wrapper.index .download,
.app-base-data .download {
	box-sizing: border-box;
	padding: 20px 10px;
}
.app-base-data .download:after {
	content: "";
	display: table;
	clear: both;
	margin-bottom: 16px;
}
#wrapper.index .download > .inner,
.app-base-data .download > .inner
 {
	padding: 10px 10px 4px;
	background: rgba(0,0,0,.5);
	border-radius: 6px;
}
#wrapper.index .download dl, 
.app-base-data .download dl{
	display: table;
	width: 100%;
	margin: 0 0 6px;
}
#wrapper.index .download dl dt,
.app-base-data .download dl dt
 {
	display: table-cell;
	padding: 0 10px 0 0;
	font-size: 75%;
	line-height: 1.4;
	vertical-align: middle;
}
#wrapper.index .download dl dt span,
.app-base-data .download dl dt span {
	display: inline-block;
}
#wrapper.index .download dl dd, 
.app-base-data .download dl dd{
	display: table-cell;
	width: 135px;
	vertical-align: middle;
}
#wrapper.index .download dl dd a,
.app-base-data .download dl dd a
 {
	display: block;
}
#wrapper.index .download dl dd img,
.app-base-data .download dl dd img,
 {
	width: 100%;
	vertical-align: bottom;
}
#wrapper.index .device,
.app-base-data .device
 {
	padding: 10px 0 0;
}
#wrapper.index .device a,
.app-base-data .device a
 {
	display: block;
	position: relative;
	padding: 10px;
	font-size: 75%;
	background: rgba(0,0,0,.5);
	border-radius: 6px;
	-webkit-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.index .device a:after,
.app-base-data .device a:after
 {
	position: absolute;
	content: '';
	right: 8px;
	top: 0;
	bottom: 0;
	width: 8px;
	height: 8px;
	margin: auto;
	border-top: 3px solid #fff;
	border-left: 3px solid #fff;
	-webkit-transform: rotate(135deg) translate(4px,4px);
	-ms-transform: rotate(135deg) translate(4px,4px);
	-o-transform: rotate(135deg) translate(4px,4px);
	transform: rotate(135deg) translate(4px,4px);
}
#wrapper.index .device a:hover,
.app-base-data .device a:hover
 {
	transform: scale(1.05);
}
#wrapper.index .bnr-campaign {
	margin: 10px 0;
	padding: 0 10px;
}
#wrapper.index .bnr-campaign a {
	display: block;
	overflow: hidden;
	border-radius: 6px;
	-webkit-transform:translate3d(0, 0, 0);
	transform:translate3d(0, 0, 0);
}
#wrapper.index .bnr-campaign img {
	width: 100%;
	vertical-align: bottom;
	-webkit-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.index .bnr-campaign a:hover img {
	transform: scale(1.05);
}
#wrapper.index .bnr-scenario {
	margin: 10px 0;
	padding: 0 10px;
}
#wrapper.index .bnr-scenario a {
	display: block;
	overflow: hidden;
    border: 2px solid rgba(255, 255, 255, 0.26);
	border-radius: 6px;
	-webkit-transform:translate3d(0, 0, 0);
	transform:translate3d(0, 0, 0);
}
#wrapper.index .bnr-scenario img {
	width: 100%;
	vertical-align: bottom;
	-webkit-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.index .bnr-scenario a:hover img {
	transform: scale(1.05);
}
#wrapper.index .pre-bnr {
	display: table;
	box-sizing: border-box;
	width: 100%;
	padding: 10px;
}
#wrapper.index .pre-bnr p {
	display: table-cell;
	width: 50%;
	padding: 0 3px 0 0;
} 
#wrapper.index .pre-bnr p+p {
	padding: 0 0 0 3px;
}
#wrapper.index .pre-bnr p a {
	display: block;
	box-sizing: border-box;
	width: 100%;
	padding: 4px;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	border: 7px solid transparent;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.index .pre-bnr .pre a {
	border-image:url("../img/pickup_betatest_bnr_bg.png") 12 12 fill round;
}
#wrapper.index .pre-bnr .twtr a {
	border-image:url("../img/twtr_bnr_bg.png") 12 12 fill round;
}
#wrapper.index .pre-bnr p a img {
	width: 100%;
	vertical-align: bottom;
}
#wrapper.index .pre-bnr p a:hover {
	transform: scale(1.05);
}


/* ――――――――――――――――――――――――――――――――――――――――――――――――――――――――― */
/* top */
/* ――――――――――――――――――――――――――――――――――――――――――――――――――――――――― */


#wrapper.index .top-contents {
	position: relative;
	padding: 0;
	width: 95%;
	margin: 0 auto;
}

#wrapper.index .top-contents-bg {
	width: 100%;
	max-width: 870px;
	height: 102%;
	position: absolute;
	top: 0%;
	left: 50%;
	transform: translateX(-50%);
	border-radius: 11px;
	background: url(../img/index_top_bg.png) center center repeat;
	opacity: 0.6;
}

@media screen and (min-width:768px) {
	#wrapper.index .top-contents-bg {
		height: 91%;
		top: 8%;
	}
}

#wrapper.index .top-contents-main {
	width: 96%;
	max-width: 830px;
    margin: -4% auto 0%;
	position: relative;
	z-index: 1;
}
@media screen and (min-width:1200px) {
	#wrapper.index .top-contents-main {
    margin: -30px auto 44px;
	}
}
#wrapper.index .top-contents-main:after {
	content: '';
	display: block;
	clear: both;
}

#wrapper.index .top-contents-main .top-block_left {
	box-sizing: border-box;
	width: 44%;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}

#wrapper.index .top-contents-main .top-block_left img {
	width: 100%;
}

#wrapper.index .top-contents-main .top-block_right {
	box-sizing: border-box;
	width: 100%;
	font-size: 62.5%;
	padding: 3% 0 4% 44%;
}

#wrapper.index .top-contents-main .top-right-title {
	width: 100%;
	position: relative;
}
#wrapper.index .top-contents-main .top-right-title:after {
	content: '';
	display: block;
	clear: both;
}
#wrapper.index .top-contents-main .top-right-title p {
	float: left;
	width: 45%;
	margin-top: 1%;
}
#wrapper.index .top-contents-main .top-right-title p.logo_pawasaka,
#wrapper.index .top-contents-main .top-right-title p.icon_collabo
 {
	margin-top: 6%;
}
#wrapper.index .top-contents-main .top-right-title p:nth-child(2) {
	width: 8%;
	padding-top: 5%;
	margin: 6% 1% 0 0;
}
#wrapper.index .top-contents-main .top-right-title img {
	width: 100%;
}
#wrapper.index .top-contents-main .top-right-text {
    width: 46vw;
    max-width: 471px;
    margin: 5% auto;
}
#wrapper.index .top-contents-main .top-right-text img {
	width: 100%;
}

#wrapper.index .top-contents-main .top-block_right .top-block-rignt-bodycopy {
    padding: 0 1em 1em;
    box-sizing: border-box;
    line-height: 1.4em;
}

#wrapper.index .top-contents-main .top-block_right .top-right-download {
	width: 95%;
	margin: 3% auto 0;
	background: rgba(0,0,0,.5);
	border-radius: 6px;
}
#wrapper.index .top-contents-main .top-block_right .top-right-download dl {
	padding: 2% 2% 0;
	position: relative;
}
#wrapper.index .top-contents-main .top-block_right .top-right-download dt {
	position: absolute;
	left: 5%;
	top: 50%;
	padding-right: 19vw;
	line-height: 1.5;
	transform: translateY(-50%);
}
#wrapper.index .top-contents-main .top-block_right .top-right-download dt span {
	display: inline-block;
}
#wrapper.index .top-contents-main .top-block_right .top-right-download dd {
	text-align: right;
}
#wrapper.index .top-contents-main .top-block_right .top-right-download a {
	display: block;
	overflow: hidden;
	-webkit-transform:translate3d(0, 0, 0);
	transform:translate3d(0, 0, 0);
}
#wrapper.index .top-contents-main .top-block_right .top-right-download img {
	position: relative;
	width: 16vw;
	min-width: 70px;
	max-width: 135px;
}
@media screen and (max-width:480px) {
	#wrapper.index .top-contents-main .top-block_right .top-right-download img {
		margin: 3% 0;
	}
}
#wrapper.index .top-contents-main .top-block_right .top-right-device {
	width: 95%;
	margin: 2% auto 0;
}
#wrapper.index .top-contents-main .top-block_right .top-right-device a
{
	display: block;
	position: relative;
	padding: 2% 4%;
	background: rgba(0,0,0,.5);
	border-radius: 6px;
	-webkit-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.index .top-contents-main .top-block_right .top-right-device a:after
{
	position: absolute;
	content: '';
	right: 8px;
	top: 0;
	bottom: 0;
	width: 8px;
	height: 8px;
	margin: auto;
	border-top: 3px solid #fff;
	border-left: 3px solid #fff;
	-webkit-transform: rotate(135deg) translate(4px,4px);
	-ms-transform: rotate(135deg) translate(4px,4px);
	-o-transform: rotate(135deg) translate(4px,4px);
	transform: rotate(135deg) translate(4px,4px);
}
#wrapper.index .top-contents-main .top-block_right .top-right-device  a:hover
{
	transform: scale(1.05);
}








/*---------------------outside----------------*/

.top-right-download.autside,
.top-right-device.autside{
	display: none;
}

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

#wrapper.index .top-contents-main .top-block_right .top-right-download,
#wrapper.index .top-contents-main .top-block_right .top-right-device{
	display: none;
}

.top-right-download.autside,
.top-right-device.autside{
	display: block;
}

.top-right-download.autside {
	width: 95%;
    margin: 3% auto 0;
    padding: 2% 0;
    background: rgba(0,0,0,.5);
    border-radius: 6px;
}
.top-right-download.autside dl {
    padding: 0% 2% 0;
    font-size: 90%;
    position: relative;
}
.top-right-download.autside dt {
	position: absolute;
	left: 5%;
	top: 50%;
	padding-right: 19vw;
	line-height: 1.5;
	transform: translateY(-50%);
}
.top-right-download.autside dt span {
	display: inline-block;
}
.top-right-download.autside dd {
	text-align: right;
}
.top-right-download.autside a {
	display: block;
	overflow: hidden;
	-webkit-transform:translate3d(0, 0, 0);
	transform:translate3d(0, 0, 0);
}
.top-right-download.autside img {
	position: relative;
	width: 16vw;
	min-width: 70px;
	max-width: 135px;
}
/*@media screen and (max-width:480px) {
	#wrapper.index .top-contents-main .top-block_right .top-right-download img {
		margin: 3% 0;
	}
}*/
.top-right-device.autside {
	width: 95%;
	font-size: 90%;
	margin: 2% auto 0;
}
.top-right-device.autside a
{
	display: block;
	position: relative;
	padding: 2% 4%;
	background: rgba(0,0,0,.5);
	border-radius: 6px;
	-webkit-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
.top-right-device.autside a:after
{
	position: absolute;
	content: '';
	right: 8px;
	top: 0;
	bottom: 0;
	width: 8px;
	height: 8px;
	margin: auto;
	border-top: 3px solid #fff;
	border-left: 3px solid #fff;
	-webkit-transform: rotate(135deg) translate(4px,4px);
	-ms-transform: rotate(135deg) translate(4px,4px);
	-o-transform: rotate(135deg) translate(4px,4px);
	transform: rotate(135deg) translate(4px,4px);
}
.top-right-device.autside  a:hover
{
	transform: scale(1.05);
}



}






/*---------------------outside----------------*/














@media screen and (min-width:768px) {
	#wrapper.index .top-contents-main .top-block_right {
		font-size: 87.5%;
		padding: 7% 0 6% 44%;
	}

	#wrapper.index .top-contents-main .top-block_right .top-right-download dt {
		padding-right: 0;
	}
}

@media screen and (min-width:1201px) {
    #wrapper.index .top-contents{
    }
}


/* ――――――――――――――――――――――――――――――――――――――――――――――――――――――――― */
/* movie */
/* ――――――――――――――――――――――――――――――――――――――――――――――――――――――――― */


#wrapper.index .main-ttl .movie-contents {
	box-sizing: border-box;
	width: 96%;
	max-width: 870px;
	padding: 2% 0 10px;
	margin: 3% auto 20px;
	border-radius: 8px;
	background: #0041a8;
	border: 7px solid transparent;
	border-image:url("../img/movie_area_boder_img_bg.png") 12 12 round;
    position: relative;
    z-index: 10;
}
#wrapper.index .main-ttl .movie-contents:before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: url(../img/index_movie_bg.png) center top repeat-y;
	background-size: 100% auto;
}

#wrapper.index .movie-contents .movie-top {
	position: relative;
	padding: 0 5%;
	margin-bottom: 1%;
}
#wrapper.index .movie-contents .movie-top-left:after {
	content: '';
	display: block;
	clear: both;
}
#wrapper.index .movie-contents .movie-top-img {
	width: 50%;
	margin: 0 auto 3%;
}
#wrapper.index .movie-contents .movie-top-img img {
	width: 100%;
}
#wrapper.index .movie-contents .movie-top-chara {
	box-sizing: border-box;
	width: 17%;
	float: left;
}
#wrapper.index .movie-contents .movie-top-chara img {
	width: 100%;
}
#wrapper.index .movie-contents .movie-top-ttl img {
	width: 90%;
}
#wrapper.index .movie-contents .movie-top-text {
	box-sizing: border-box;
	width: 81%;
	padding-left: 1%;
	float: right;
}
#wrapper.index .movie-contents .movie-top-text-ttl img {
	width: 90%;
	max-width: 407px;
}
#wrapper.index .movie-contents .movie-top-comment {
	font-size: 81.25%;
	line-height: 1.6;
	padding-left: 2%;
}
@media screen and (max-width:480px) {
	#wrapper.index .movie-contents .movie-top-comment {
		font-size: 62.5%;
	}
}

@media screen and (min-width:768px) {
	#wrapper.index .movie-contents .movie-top-right {
		float: right;
		width: 34%;
	}

	#wrapper.index .movie-contents .movie-top-left {
		box-sizing: border-box;
		float: left;
		width: 66%;
		padding: 3% 4% 0 0;
		display: table-cell;
	}
	#wrapper.index .movie-contents .movie-top {
		padding:  0 2%;
	}
	#wrapper.index .movie-contents .movie-top:after {
		content: '';
		display: block;
		clear: both;
	}
	#wrapper.index .movie-contents .movie-top-img {
		width: 100%;
		margin: 0;
	}
	#wrapper.index .movie-contents .movie-top-ttl img {
		width: 100%;
	}

	#wrapper.index .movie-contents .movie-top-chara {
		width: 19%;
	}

	#wrapper.index .movie-contents .movie-top-comment {
		font-size: 87.5%;
	}
}

@media screen and (min-width:1201px) {
    #wrapper.index .main-ttl .movie-contents {
        margin: 22px auto 20px;
    }
}


#wrapper.index .main-ttl .movie-area:after {
	content: '';
	display: block;
	clear: both;
}
#wrapper.index .main-ttl .movie-area a {
	box-sizing: border-box;
	width: calc(100% / 3 - 1%);
	float: left;
	display: block;
	padding: 1% 2%;
	margin: 0 1% 1% 0;
	font-size: 81.25%;
	border-radius: 8px;
	background: #1022ac;
}
@media screen and (max-width:480px) {
	#wrapper.index .main-ttl .movie-area a {
		font-size: 62.5%;
	}
}

#wrapper.index .main-ttl .movie-area .movie-num {
	color: #05a9e0;
	font-size: 62.5%;
}
#wrapper.index .main-ttl .movie-area dl dt {
	position: relative;
	overflow: hidden;
}
#wrapper.index .main-ttl .movie-area dl dt img {
	width: 100%;
	vertical-align: bottom;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.index .main-ttl .movie-area a:hover dl dt img {
	transform: scale(1.1);
	opacity: 0.5;
}
#wrapper.index .main-ttl .movie-area dl dd {
	position: relative;
	height: 40px;
	/* margin: 10% 0 9%; */
	line-height: 1.4;
}
#wrapper.index .main-ttl .movie-area dl dd span {
	box-sizing: border-box;
	width: 100%;
	padding: 2% 1% 0;
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	text-align: center;
}
#wrapper.index .main-ttl .movie-area dl dd img {
	vertical-align: bottom;
	width: 100%;
}

#wrapper.index .main-ttl .movie-contents .movie-copy {
	margin: 1% 0 2%;
	font-size: 75%;
	text-align: center;
}


@media screen and (min-width:768px) {
	#wrapper.index .main-ttl .movie-area {
		padding: 2% 10px 0;
	}

	#wrapper.index .main-ttl .movie-area a {
		width: calc(100% / 4 - 1%);
		font-size: 87.5%;
	}
}


#wrapper.index .main-ttl .movie-contents .movie-block {
	width: 42%;
	max-width: 330px;
	margin: 5% 2%;
	display: inline-block;
}
@media screen and (min-width:768px) {
	#wrapper.index .main-ttl .movie-contents .movie-block {
		margin: 5% 2% 2%;
	}
}

#wrapper.index .main-ttl .movie-contents .movie-block p {
	overflow: hidden;
	position: relative;
	border: 1px #00b4ff solid;
}

#wrapper.index .main-ttl .movie-contents .movie-block p:after {
	content: "";
	position: absolute;
	display: block;
	width: 40%;
	height: 100%;
	left: 50%;
	top: 63%;
	transform: translateY(-50%) translateX(-50%);
	background: url(../img/movie_play_icon.png) no-repeat;
	background-size: 100% auto;
	z-index: 10;
}

#wrapper.index .main-ttl .movie-contents .movie-promo,
#wrapper.index .main-ttl .movie-contents .movie-event {
	position: relative;
	text-align: center;
}

#wrapper.index .main-ttl .movie-contents .movie-promo:before,
#wrapper.index .main-ttl .movie-contents .movie-event:before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 10;
	opacity: .3;
	border-top: 1px #fff solid;
}

#wrapper.index .main-ttl .movie-contents .movie-promo:after,
#wrapper.index .main-ttl .movie-contents .movie-event:after {
	content: '';
	display: block;
	clear: both;
}

#wrapper.index .main-ttl .movie-contents .movie-block img {
	width: 100%;
	vertical-align: bottom;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.index .main-ttl .movie-contents a:hover img {
	transform: scale(1.1);
	opacity: 0.5;
}


#wrapper.index .main-ttl .movie-contents .movie-promo .movie-ttl-promo,
#wrapper.index .main-ttl .movie-contents .movie-promo .movie-ttl-tvcm {
	width: 38vw;
	max-width: 242px;
	height: 4vw;
	max-height: 43px;
	margin: 2% auto 0;
	background: url(../img/index_movie_promo_ttl_text.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.index .main-ttl .movie-contents .movie-promo .movie-ttl-tvcm {
	background: url(../img/index_movie_tvcm_ttl_text.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.index .main-ttl .movie-contents .movie-event .movie-ttl-miku1 {
	width: 38vw;
	max-width: 245px;
	height: 6vw;
	max-height: 43px;
	margin: 4% auto 0;
	background: url(../img/index_movie_event_ttl_text_1.png) no-repeat;
	background-size: 100% auto;
}

#wrapper.index .main-ttl .movie-contents .movie-event .movie-ttl-miku2 {
	width: 40vw;
	max-width: 269px;
	height: 6vw;
	max-height: 43px;
	margin: 4% auto 0;
	background: url(../img/index_movie_event_ttl_text_2.png) no-repeat;
	background-size: 100% auto;
}

#wrapper.index .main-ttl .movie-contents .movie-block .ttl span {
	display: block;
	height: 0;
	overflow: hidden;
}

#wrapper.index .main-ttl .movie-contents .event-copy {
	font-size: 68.75%;
	position: relative;
}

#wrapper.index .main-ttl .movie-contents .event-copy p {
	display: inline-block;
	position: relative;
}

#wrapper.index .main-ttl .movie-contents .event-copy p:first-child {
	margin-right: 60px;
}

#wrapper.index .main-ttl .movie-contents .event-copy img {
	position: absolute;
	right: 0;
	top: -10px;
}
@media screen and (max-width:480px) {
	#wrapper.index .main-ttl .movie-contents .event-copy p:first-child {
		margin-right: 52px;
	}
	#wrapper.index .main-ttl .movie-contents .event-copy img {
		width: 50px;
	}
}

#wrapper.pre-index .movie-area {
	padding: 15px 13% 10px;
}
#wrapper.pre-index .movie-area a {
	display: block;
	padding: 6px;
    margin: 8px;
	border-radius: 8px;
	background: #0041a8;
	border: 7px solid transparent;
	border-image:url("../img/movie_area_boder_img_bg.png") 12 12 round;
}
#wrapper.pre-index .movie-area dl dt {
	position: relative;
	overflow: hidden;
	background: #000;
}
#wrapper.pre-index .movie-area dl dt:after {
	content:"";
	position: absolute;
	display: block;
	width: 40%;
	height: 150%;
	top: 15%;
	margin: 0 30%;
	background: url(../img/movie_play_icon.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.pre-index .movie-area dl dt img {
	width: 100%;
	vertical-align: bottom;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	opacity: 0.7;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.pre-index .movie-area a:hover dl dt img {
	transform: scale(1.1);
	opacity: 0.5;
}
#wrapper.pre-index .movie-area dl dd {
	text-align: center;
	padding: 2% 12% 0;
	line-height: 1;
}
#wrapper.pre-index .movie-area dl dd img {
	vertical-align: bottom;
	width: 100%;
}
#wrapper.pre-index .movie-area.iniesta dl dd img {
	vertical-align: bottom;
	width: 66%;
	margin-top: 3px;
}



/* ――――――――――――――――――――――――――――――――――――――――――――――――――――――――― */
/* news */
/* ――――――――――――――――――――――――――――――――――――――――――――――――――――――――― */


#wrapper.index .main-ttl .news-area {
	box-sizing: border-box;
	padding: 10px 10px 25px;
}
#wrapper.index .main-ttl .news-area .ttl {
	overflow: hidden;
	margin: 0 0 8px;
}
#wrapper.index .main-ttl .news-area .ttl h2 {
	float: left;
	display: block;
	margin: 3px 0 0 0;
	width: 70px;
	height: 20px;
	overflow: hidden;
	background: url(../img/index_update_ttl_text.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.index .main-ttl .news-area .ttl h2 span {
	display: block;
	height: 0;
	overflow: hidden;
}
#wrapper.index .main-ttl .news-area .ttl ul {
	float: right;
}
#wrapper.index .main-ttl .news-area .ttl ul li {
	display: inline-block;
}
.pc #wrapper.index .main-ttl .news-area .ttl ul li:nth-child(2) {
	display: none;
}
#wrapper.index .main-ttl .news-area .ttl ul li a {
	display: inline-block;
}
#wrapper.index .main-ttl .news-area .ttl img {
	vertical-align: bottom;
	border-radius: 5px;
	transition: all 0.2s ease;
	-webkit-transition: all 0.2s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.index .main-ttl .news-area .ttl img:hover {
	opacity: 0.7;
}
#wrapper.index .main-ttl .news-area .news-detail {
	padding: 10px 10px 5px;
	background: #124d07;
	border-radius: 6px;
    position: relative;
    z-index: 10;
}
#wrapper.index .main-ttl .news-area .news-detail ul {
	position: relative;
	height: 400px;
}
#wrapper.index .main-ttl .news-area .news-detail p.notice a {
	position: relative;
	display: block;
	padding: 3px 8px;
	margin: 0 0 8px;
	font-size: 75%;
	background: rgba(118, 200, 30, 0.4);
	border-radius: 5px;
	transition: all 0.2s ease;
	-webkit-transition: all 0.2s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.index .main-ttl .news-area .news-detail p.notice a:hover {
	background: rgba(118, 200, 30, 0.8);
}
#wrapper.index .main-ttl .news-area .news-detail p.notice a:after {
	position: absolute;
	content:"";
	display: block;
	width: 10px;
	height: 15px;
	top: 50%;
	right: 10px;
	margin: -7px 0 0 0;
	background: url(../img/link_arrow_white.svg) no-repeat;
	background-size: 10px 15px;
}
#wrapper.index .main-ttl .news-area .news-detail dl {
	margin: 0 0 10px;
}
#wrapper.index .main-ttl .news-area .news-detail dl dt {
	display: inline-block;
	padding: 4px 7px 3px;
	background: #fff;
	border-radius: 4px;
	font-size: 56.3%;
	color: #124d07;
	line-height: 1;
	vertical-align: top;
}
#wrapper.index .main-ttl .news-area .news-detail dl .tag {
	display: inline-block;
	font-size: 56.3%;
	vertical-align: top;
}
#wrapper.index .main-ttl .news-area .news-detail dl .tag span {
	display: inline-block;
	width: 6em; /* 最長 (キャンペーン) に合わせる */
	padding: 4px 7px;
	border-radius: 4px;
	line-height: 1;
	text-align: center;
	vertical-align: top;
	color: #fff;
}
#wrapper.index .main-ttl .news-area .news-detail dl .tag.news span {
	background: #4284fe;
}
#wrapper.index .main-ttl .news-area .news-detail dl dd {
	font-size: 75%;
	line-height: 1.333;
}
#wrapper.index .main-ttl .news-area .news-detail dl dd a,
#wrapper.index .main-ttl .news-area .news-detail dl dd span{
	position: relative;
	display: block;
	padding: 8px 15px 8px 0;
}
#wrapper.index .main-ttl .news-area .news-detail dl dd a:after {
	position: absolute;
	content:"";
	display: block;
	width: 10px;
	height: 15px;
	top: 50%;
	right: 0;
	margin: -7px 0 0 0;
	background: url(../img/link_arrow_white.svg) no-repeat;
	background-size: 10px 15px;
}
#wrapper.index .main-ttl .news-area .news-detail .readmore a {
	display: block;
	margin: 10px 0 0;
	padding: 4px 6px;
	font-size: 75%;
	border: 1px solid #fff;
	text-align: center;
	-webkit-transition: background 0.3s ease;
	transition: background 0.3s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.index .main-ttl .news-area .news-detail .readmore a:hover {
	background: rgba(255, 45, 84, 0.4);
}
#wrapper.index .main-ttl .official-account {
	position: relative;
}
#wrapper.index .main-ttl .official-account_bg {
	position: absolute;
	height: 80px;
	width: calc(100% - 20px);
	top: 40px;
	background: #55acee;
	z-index: 1;
}
#wrapper.index .main-ttl .official-account,
#wrapper.index .main-ttl .notice-cesa {
	box-sizing: border-box;
	padding: 10px 10px 0;
	max-width: 540px;
	margin: 0 auto;
}
#wrapper.index .main-ttl .official-account_main {
	position: relative;
    z-index: 10;
}
#wrapper.index .main-ttl .official-account_main a,
#wrapper.index .main-ttl .notice-cesa a{
	display: block;
	padding: 2px;
	border: 7px solid transparent;
	border-image:url("../img/twtr_bnr_bg.png") 12 12 fill round;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
#wrapper.index .main-ttl .official-account_main a:hover,
#wrapper.index .main-ttl .notice-cesa a:hover{
	transform: scale(1.05);
}
#wrapper.index .main-ttl .official-account_main a img {
	width: 12%;
	vertical-align: middle;
}
#wrapper.index .main-ttl .official-account_main a img+img {
	width: 88%;
}
#wrapper.index .main-ttl .notice-cesa a img {
	width: 100%;
	vertical-align: middle;
}
/*app-info*/
#wrapper.index .app-info {
	background: #236716;
	border-top: 1px solid #76c81e;
	
}
#wrapper .common-menu {
	position: fixed;
	z-index: 100;
	bottom: 0;
	width: 100%;
}
#wrapper .common-menu ul {
	display: table;
	table-layout: fixed;
	width: 100%;
	padding: 23px 0 0 0;
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), to(rgba(0,0,0,1)));
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
}
#wrapper .common-menu ul li {
	display: table-cell;
	text-align: center;
}
#wrapper .common-menu ul li a {
	position: relative;
	display: block;
	height: 45px;
	border: 2px solid #295342;
	border-left: none;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #008a6d), color-stop(0.52, #015f37), color-stop(0.49, #028a52), color-stop(0.00, #05bc3c));
	background: -webkit-linear-gradient(top, #05bc3c 0%, #028a52 49%, #015f37 52%, #008a6d 100%);
	background: linear-gradient(to bottom, #05bc3c 0%, #028a52 49%, #015f37 52%, #008a6d 100%);
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
#wrapper .common-menu ul li:last-child a {
	border-right: none;
}
#wrapper .common-menu ul li.on a,
#wrapper .common-menu ul li a:hover{
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #81eb0f), color-stop(0.52, #61b605), color-stop(0.49, #c3ff41), color-stop(0.00, #d3ffa8));
	background: -webkit-linear-gradient(top, #d3ffa8 0%, #c3ff41 49%, #61b605 52%, #81eb0f 100%);
	background: linear-gradient(to bottom, #d3ffa8 0%, #c3ff41 49%, #61b605 52%, #81eb0f 100%);
}
#wrapper .common-menu ul li a:after {
	content:"";
	position: absolute;
	display: block;
	width: 75px;
	height: 70px;
	top:-25px;
	left: 50%;
	margin: 0 0 0 -37px;
	background: #000;
}
#wrapper .common-menu ul li.top a:after {
	background: url(../img/common_menu_top_sp.png) no-repeat 0 0;
	background-size: 75px auto;
}
#wrapper .common-menu ul li.news a:after {
	background: url(../img/common_menu_news_sp.png) no-repeat 0 0;
	background-size: 75px auto;
}
#wrapper .common-menu ul li.about a:after {
	background: url(../img/common_menu_about_sp.png) no-repeat 0 0;
	background-size: 75px auto;
}
#wrapper .common-menu ul li.character a:after {
	background: url(../img/common_menu_chara_sp.png?v2) no-repeat 0 0;
	background-size: 75px auto;
}
#wrapper .common-menu ul li a:hover:after,
#wrapper .common-menu ul li.top.on a:after,
#wrapper .common-menu ul li.about.on a:after,
#wrapper .common-menu ul li.character.on a:after{
	background-position: 0 -70px;
}
#wrapper .common-menu.header ul li.pawasaka-logo {
	display: none;
}
#wrapper .common-menu ul li a em {
	display: block;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
#wrapper.index .app-info .ttl {
	position: relative;
	padding: 18px 10px 5px 10px;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #236716), color-stop(0.00, #1fa505));
	background: -webkit-linear-gradient(#1fa505, #236716);
	background: linear-gradient(#1fa505, #236716);
}
#wrapper.index .app-info .ttl h3 {
	overflow: hidden;
	height: 20px;
	margin: 0 0 60px;
	background: url(../img/index_app_info_ttl_text.svg) no-repeat;
	background-size: auto 100%;
}
#wrapper.index .app-info .ttl h3 span {
	display: block;
	margin: 200px 0 0;
	text-indent: -34em;
}
#wrapper.index .app-info .ttl .yabe p {
	position: absolute;
	right: 0;
	bottom: -15px;
}
#wrapper.index .app-info .ttl .yabe p:before {
	position: absolute;
	content:"";
	width: 159px;
	height: 47px;
	bottom: 24px;
	right: 67px;
	background: url(../img/index_app_info_yabe_comment_sp.png) no-repeat;
	background-size: 159px auto;
	animation:fukidashianime .8s linear infinite alternate;
	-webkit-animation:fukidashianime .8s linear infinite alternate;
}
@keyframes fukidashianime {
	0% {transform: translateY(-5px);}
	100% {transform: translateY(5px);}
}
@-webkit-keyframes fukidashianime {
	0% {transform: translateY(-5px);}
	100% {transform: translateY(5px);}
}
.pc #wrapper.index .app-info .ttl .yabe p:before {
	background-image: url(../img/index_app_info_yabe_comment_pc.png);
}
#wrapper.index .app-info .ttl .yabe p img {
	vertical-align: bottom;
	width: 74px;
}
#wrapper.index .app-info .detail {
	padding: 0 0 50px 10px;
}
#wrapper.index .app-info .detail ul {
	white-space: nowrap;
	width: 100%;
	overflow-x: auto;
	overflow-y:hidden;
	vertical-align: bottom;
}
#wrapper.index .app-info .detail ul li {
	display: inline-block;
	margin: 0 3px 0 0;
	vertical-align: bottom;
}
#wrapper.index .app-info .detail ul li a {
	position: relative;
	display: inline-block;
	vertical-align: bottom;
}
#wrapper.index .app-info .detail ul li a:after {
	content: "";
	position: absolute;
	right: 5px;
	bottom: 5px;
	display: block;
	width: 25px;
	height: 25px;
	background: url(../img/app_ss_expansion_icon.png) no-repeat;
	background-size: 100% auto;
}
.pc #wrapper.index .app-info .detail ul li a {
	overflow: hidden;
	background: #000;
}
.pc #wrapper.index .app-info .detail ul li a:after {
	bottom: -50px;
	z-index: 20;
	transition: all 0.2s ease;
	-webkit-transition: all 0.2s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
.pc #wrapper.index .app-info .detail ul li a:hover:after {
	bottom: 5px;
}
#wrapper.index .app-info .detail ul li a img {
	vertical-align: bottom;
	height: 194px;
	width: 113px;
}
.pc #wrapper.index .app-info .detail ul li a img:hover {
	opacity: 0.7;
}

/*.betatest-info*/

#wrapper .betatest-info .ttl h4,
#wrapper .betatest-info .ttl h4:before,
#wrapper .betatest-info .detail dl dt,
#wrapper .betatest-info .detail dl dd a{
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
#wrapper .betatest-info {
	background: #ff5171;
	padding: 0 17px 20px 17px;
}
#wrapper .betatest-info .ttl {
	position: relative;
	padding: 20px 0 20px 100px;
}
#wrapper .betatest-info .ttl h4 {
	height: 43px;
	overflow: hidden;
	background: url(../img/betatest_info_ttl_text.svg) no-repeat;
	background-size: 178px auto;
}
#wrapper .betatest-info .ttl h4:before {
	content:"";
	position: absolute;
	display: block;
	width: 85px;
	height: 105px;
	left: 0;
	top: 20%;
	margin: -53px 0 0 0;
	background: url(../img/betatest_info_ttl_pawasaka.png) no-repeat;
	background-size: 85px auto;
}
#wrapper .betatest-info .ttl h4 span {
	display: block;
	margin: 200px 0 0;
	text-indent: -34em;
}
#wrapper .betatest-info .detail dl dt {
	margin: 0 0 15px;
	font-size: 68.75%;
	line-height: 1.546;
}
#wrapper .betatest-info .detail dl dd a {
	position: relative;
	display: block;
	padding: 0 13%;
	background: #fff;
	border-radius: 5px;
	text-align: center;
}
#wrapper .betatest-info .detail dl dd a:hover {
	background: #333;
}
#wrapper .betatest-info .detail dl dd a:after {
	position: absolute;
	content:"";
	display: block;
	width: 12px;
	height: 17px;
	top: 50%;
	right: 10px;
	margin: -8px 0 0 0;
	background: url(../img/link_arrow_pink.svg) no-repeat;
	background-size: 12px 17px;
}
#wrapper .betatest-info .detail dl dd a img {
	margin: 10px 0;
	vertical-align: bottom;
	width: 100%;
	max-width: 260px;
}

/*app-base-data*/
#wrapper .app-base-data .detail ol li a,
#wrapper .app-base-data footer p.bnr-pawa a{
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
}
#wrapper .app-base-data {
	padding: 70px 20px 120px;
	background: rgba(0,0,0,0.3);
    position: relative;
}
#wrapper.index .app-base-data:before {
    content: '';
    display: block;
    position: absolute;
    top: -800px;
    left: 0;
    width: 100%;
    height: 800px;
    opacity: .3;
    background: -moz-linear-gradient(top, transparent, #000);
    background: -webkit-linear-gradient(top, transparent, #000);
    background: linear-gradient(to bottom, transparent, #000);
}
body.itf #wrapper .app-base-data {
	padding: 70px 20px 120px;
	background: rgba(0,0,0,0);
}
#wrapper.chara.collabo-shoot .app-base-data {
	padding: 70px 20px 120px;
	background:rgba(0, 0, 0, 0.28) ;
}
#wrapper .app-base-data .ttl {
	margin: 0 0 30px;
}
#wrapper .app-base-data .ttl h4 {
	text-align: center;
	width: 210px;
	height: 20px;
	overflow: hidden;
	margin: 0 auto;
	background: url(../img/app_base_data_title_text.svg) no-repeat;
	background-size: 210px auto;
}
#wrapper .app-base-data .ttl h4 span {
	display: block;
	margin: 200px 0 0;
	text-indent: -34em;
}
#wrapper .app-base-data .detail .app-data-list li dl {
	display: table;
	width: 275px;
	margin: 0 auto;
	font-size: 75%;
	line-height: 1;
}
#wrapper .app-base-data .detail .app-data-list li dt {
	display: table-cell;
	width: 55px;
	padding: 0 12px 20px 0;
	text-align: right;
	border-right: 1px solid rgba(255,255,255,0.5);
}
#wrapper .app-base-data .detail .app-data-list li:first-child dt {
	padding: 25px 12px 20px 0;
}
#wrapper .app-base-data .detail .app-data-list li:last-child dt {
	padding: 0 12px 25px 0;
}
#wrapper .app-base-data .detail .app-data-list li dd {
	display: table-cell;
	text-align: left;
	padding: 0 0 0 12px;
}
#wrapper .app-base-data ol.sns-link {
	margin: 0 0 40px;
	text-align: center;
}
#wrapper .app-base-data ol.sns-link li {
	display: inline-block;
}
.pc #wrapper .app-base-data ol.sns-link li:nth-child(2) {
	/* display: none; */
}
#wrapper .app-base-data ol.sns-link li a {
	display: inline-block;
	border: 3px solid #fff;
	border-radius: 20px;
}
#wrapper .app-base-data ol.sns-link li.twitter a:hover {
	background: #55acee;
}
#wrapper .app-base-data ol.sns-link li.line a:hover {
	background: #00b900;
}
#wrapper .app-base-data ol.sns-link li.facebook a:hover {
	background: #3c5998;
}
#wrapper .app-base-data ol.sns-link li.google a:hover {
	background: #de4d42;
}
#wrapper .app-base-data ol.sns-link li a img {
	vertical-align: bottom;
	width: 35px;
	height: 35px;
}
#wrapper .app-base-data footer ul {
	text-align: center;
	font-size: 62.5%;
}
#wrapper .app-base-data footer ul li {
	display: inline-block;
}
#wrapper .app-base-data footer ul li a:hover {
	text-decoration: underline;
}
#wrapper .app-base-data footer ul li:after {
	content:"|";
	display: inline-block;
	padding: 0 10px;
}
#wrapper .app-base-data footer ul li:last-child:after {
	content:"";
}
#wrapper .app-base-data footer p.bnr-pawa {
	text-align: center;
	margin: 0 0 30px 0;
}
#wrapper .app-base-data footer p.bnr-pawa a {
	display: inline-block;
}
#wrapper .app-base-data footer p.bnr-pawa a:hover {
	opacity: 0.6;
}
#wrapper .app-base-data footer p.bnr-pawa a img {
	width: 200px;
	vertical-align: bottom;
}
#wrapper .app-base-data footer p.copy {
	text-align: center;
	font-size: 62.5%;
}
footer p.copy span{
    display: inline-block;
    margin-right: 1em;
}

/*character*/
#wrapper.chara {
	overflow: hidden;
}
#wrapper.chara .scenario-list {
	position: relative;
	z-index: 5;
	animation:indexCommonHeaderAnimeSP 1s ease 1s 1;
	-webkit-animation:indexCommonHeaderAnimeSP 1s ease 1s 1;
	animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
}
#wrapper.chara .scenario-list input {
	display: none;
}
#wrapper.chara .scenario-list .nav {
	background: #123fa6;
}
#wrapper.chara .scenario-list .nav p {
	max-width: 980px;
	margin: 0 auto;
	text-align: right;
}
#wrapper.chara .scenario-list .nav p label {
	position: relative;
	display: inline-block;
	padding: 10px 50px 10px 10px;
	cursor: pointer;
	-webkit-transition: opacity .2s;
	transition: opacity .2s;
}
#wrapper.chara .scenario-list .nav p label:hover {
	opacity: .8;
}
#wrapper.chara .scenario-list .nav p label:before,
#wrapper.chara .scenario-list .nav p label:after {
	content: '';
	position: absolute;
	width: 4px;
	height: 14px;
	top: 14px;
	right: 18px;
	background: #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	-webkit-transition: all .3s;
	transition: all .3s;
}
#wrapper.chara .scenario-list .nav p label:after {
	right: 26px;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
#wrapper.chara .scenario-list input:checked + .nav p label:before,
#wrapper.chara .scenario-list input:checked + .nav p label:after {
	top: 10px;
	right: 22px;
	height: 22px;
}
#wrapper.chara .scenario-list .nav p label img {
	width: 180px;
	vertical-align: bottom;
	height:24px;
}
#wrapper.chara .scenario-list .list {
	height: 0;
	opacity: 0;
	position: absolute;
	overflow: hidden;
	box-sizing: border-box;
	width: 100%;
	padding: 10px;
	-webkit-transition: opacity .2s ease-in;
	transition: opacity .2s ease-in;
}
#wrapper.chara .scenario-list input:checked + .nav + .list {
	display: block;
	height: auto;
	background: rgba(18, 63, 166, 0.70);
	opacity: 1;
}
#wrapper.chara .scenario-list .list ul {
	max-width: 960px;
	margin: 0 auto;
	text-align: center;
}
#wrapper.chara .scenario-list .list ul li {
	display: inline-block;
	overflow: hidden;
}
#wrapper.chara .scenario-list .list ul li a {
	display: inline-block;
	position: relative;
	transition: border 0.3s ease;
	margin: 6px;
	padding: 8px 12px;
	border-radius: 25px;
	border: 3px solid #24910f;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #e3ffac), color-stop(0.00, #fff));
	background: -webkit-linear-gradient(#fff, #e3ffac);
	background: linear-gradient(#fff, #e3ffac);
	box-shadow:0 5px 0 0 #0c4900;
	-webkit-box-shadow:0 5px 0 0 #0c4900;
}
#wrapper.chara .scenario-list .list ul li a.special,
#wrapper.chara .scenario-list .list ul li a.special-0823 {
    width: 184px;
    margin: 0 0 0 0;
    padding: 0;
    border-radius: 0px;
    background: none;
    border: none;
    box-shadow: none;
}
#wrapper.chara .scenario-list .list ul li a span {
	display: inline-block;
	position: relative;
	overflow: hidden;
	height: 16px;
	width: auto;
	vertical-align: middle;
}
#wrapper.chara .scenario-list .list ul li a img {
	position: relative;
	height: 200%;
	vertical-align: bottom;
}
#wrapper.chara .scenario-list .list ul li a.special-0823 img {
	position: relative;
	height: 39px;
	vertical-align: bottom;
    margin: 7px 0 6px;
}
#wrapper.chara .scenario-list .list ul li a:hover,
#wrapper.chara .scenario-list .list ul li.on a {
	border-color: #f3e500;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #fff6ac), color-stop(0.00, #fff));
	background: -webkit-linear-gradient(#fff, #fff6ac);
	background: linear-gradient(#fff, #fff6ac);
}
#wrapper.chara .scenario-list .list ul li a.special:hover,
#wrapper.chara .scenario-list .list ul li.on a.special,
#wrapper.chara .scenario-list .list ul li a.special-0823 {
	border-color: none;
	background: none;
}
#wrapper.chara .scenario-list .list ul li a.special:hover:after,
#wrapper.chara .scenario-list .list ul li.on a.special {
    content: "";
    position: absolute;
    display: block;
    width: 184px;
    height: 49px;
    top: 6px;
    margin: 0 0 0 0;
    /*background: url(../img/success/icon-special_on.png) no-repeat 0 0;*/
    background: url(../img/success/icon-special_bk-event.png) no-repeat 0 0;
    background-size: 184px auto;
    transition:all 0.3s ease;
}
#wrapper.chara .scenario-list .list ul li a:hover img,
#wrapper.chara .scenario-list .list ul li.on a img{
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
#wrapper.chara .scenario-list .list ul li a.special-0823 img{
	-webkit-transform: translateY(0);
	transform: translateY(0);
}

#wrapper.chara .scenario-list .list ul li a.special:after
{
	content: "";
    position: absolute;
    display: block;
    width: 220px;
    height: 49px;
    top: 0px;
    margin: 0 0 0 0;
    background: url(../img/success/icon-special.png) no-repeat 0 0;
    background-size: 184px auto;
}

#wrapper.simple-page .inner.update h3{
    padding: 20px;
    font-size: 120%;
    background: rgba(45, 186, 255, 0.3);
    border-radius: 7px;
    margin: 20px auto;
}

#wrapper.simple-page .inner.update h4{
    padding: 10px 0;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    font-size: 124%;
}
#wrapper.simple-page.update-pawamatch .inner.update h4 {
    padding: 10px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.79);
    border-bottom: 1px solid rgba(255, 255, 255, 0.79);
    font-size: 124%;
    font-weight: bold;
    clear: both;
}
#wrapper.simple-page.update-pawamatch .inner.update h4{
	text-align: center;
    background-color: rgba(94, 233, 255, 0.19);
}
#wrapper.simple-page .inner.update p{
    margin: 30px 0;
}
#wrapper.simple-page.update-pawamatch .inner.update p.caution {
	margin: 16px 0;
    padding: 12px 0;
    border-top: 1px dotted #ccc;
    border-bottom: 1px dotted #ccc;
}
#wrapper.simple-page.update-pawamatch .inner.update p.col-1{
/*    margin: 24px 0;
    background-image: url(../img/update/update-pawamatch/img-pawamatch-1.jpg);
    background-position: 50% 0%;
    background-size: 261px;
    background-repeat: no-repeat;
    width: 100%;
    height: 500px;
    padding-top: 465px;
    box-sizing: border-box;
    text-align: center;*/
}
#wrapper.simple-page.update-pawamatch .inner.update p.col-2{
    margin: 24px 0;
    background-image: url(../img/update/update-pawamatch/img-pawamatch-2.jpg);
    background-position: 50% 0%;
    background-size: 261px;
    background-repeat: no-repeat;
    width: 100%;
    height: 500px;
    padding-top: 465px;
    box-sizing: border-box;
    text-align: center;
}
#wrapper.simple-page.update-pawamatch .inner.update p.col-3{
    margin: 24px 0;
    background-image: url(../img/update/update-pawamatch/img-pawamatch-3.jpg);
    background-position: 50% 0%;
    background-size: 261px;
    background-repeat: no-repeat;
    width: 100%;
    height: 500px;
    padding-top: 465px;
    box-sizing: border-box;
    text-align: center;
}
#wrapper.simple-page.update-pawamatch .inner.update p.col-4{
    margin: 34px 0 150px;
    background-image: url(../img/update/update-pawamatch/img-pawamatch-4.jpg);
    background-position: 50% 0%;
    background-size: 261px;
    background-repeat: no-repeat;
    width: 100%;
    height: 500px;
    padding-top: 465px;
    box-sizing: border-box;
}




/*---------------collabo-shoot-----------------*/



#wrapper.chara.collabo-shoot section.contents p.leadcopy{
	width:100%;
    padding: 24px 0 18px;
	background-color:#ec0303;
	text-align: center;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy br{
	display: none;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span,
#wrapper.chara.collabo-shoot section.contents p.leadcopy img,
#wrapper.chara.collabo-shoot section.contents .comment h3 img,
#wrapper.chara.collabo-shoot section.contents .comment img,
#wrapper.chara.collabo-shoot section.contents .comment span img{
    display: block;
    font-size: 0;
    margin: 0 auto;
    line-height: 0;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-1-1 img{
    width: 290px;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-1-2 img{
    width: 17px;
	margin:4px auto;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-1-3 img{
    width: 102px;
}

#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-2{
	display: inline-block;
	height: 28px;
    margin: 0px 0 3px;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-3{
    height: 24px;
    margin: 9px 0 5px;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-2 img,
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-3 img{
	height:100%;
}

#wrapper.chara.collabo-shoot section.contents .comment{
    width: 100%;
    padding: 18px 0;
    background-image: url(../img/success/05/bg-comment-sp.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 114%;
    text-align: center;
    text-indent: -9999px;
}
#wrapper.chara.collabo-shoot.diverge-05 section.contents .comment{
    width: 100%;
    padding: 18px 0;
    background-image: url(../img/success/05-diverge/bg-comment-sp.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 114%;
    text-align: center;
    text-indent: -9999px;
}
#wrapper.chara.collabo-shoot section.contents .about{
    width: 100%;
    padding: 18px 0;
    background-color: #fe0000;
    background-image: url(../img/success/05/bg-about.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 1133px;
    text-align: center;
}
#wrapper.chara.collabo-shoot section.contents .comment{
	text-indent: -9999px;
    max-height: 574px;
    border-top: 7px solid #00aeff;
    border-bottom: 7px solid #00aeff;
}
#wrapper.chara.collabo-shoot.diverge-05 section.contents .comment {
    text-indent: -9999px;
    max-height: 574px;
    border-top: 7px solid #beef71;
    border-bottom: 7px solid #beef71;
}

#wrapper.chara.collabo-shoot section.contents .comment h3{
	height: 62px;
    line-height: 0em;
    background-image: url(../img/success/05/comment-hw-sp.svg);
    background-size: 330px auto;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}
#wrapper.chara.collabo-shoot section.contents .comment img{
	display: block;
    height: 178px;
    margin: 14px auto;
}

#wrapper.chara.collabo-shoot section.contents .comment span{
    height: 309px;
    display: block;
    line-height: 0em;
    margin: 10px auto;
    background-image: url(../img/success/05/comment-body-sp.svg);
    background-size: 293px auto;
    background-position: 50% 0%;
    background-repeat: no-repeat;
}
#wrapper.chara.collabo-shoot.diverge-05 section.contents .comment span{
    height: 309px;
    display: block;
    line-height: 0em;
    margin: 10px auto;
    background-image: url(../img/success/05-diverge/comment-body-sp.svg);
    background-size: 293px auto;
    background-position: 50% 0%;
    background-repeat: no-repeat;
}
#wrapper.chara.collabo-shoot section.contents .comment h3 img,
#wrapper.chara.collabo-shoot section.contents .comment span img{
    display: block;
    margin: 0 auto;
    height: 100%;
}
#wrapper.chara.collabo-shoot section.contents .about dl{
	text-align: center;
}
#wrapper.chara.collabo-shoot section.contents .about dl dt{
    width: 92%;
    text-indent: -9999px;
    line-height: 0;
    height: 28px;
    margin: 11px auto 23px;
    padding: 17px 0 11px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
#wrapper.chara.collabo-shoot section.contents .about dl img,
#wrapper.chara.collabo-shoot section.contents .about dl dd{
	line-height: 0;
	height:230px;
}
#wrapper.chara.collabo-shoot section.contents .about dl img,
#wrapper.chara.collabo-shoot section.contents .about dl dd{
	display: block;
	margin:0 auto;
}
#wrapper.chara.collabo-shoot section.contents .about dl dd{
    display: block;
    margin-bottom: 20px;
}
#wrapper.chara.collabo-shoot section.contents .about dl img{
    height: 77%;
}
#wrapper.chara.collabo-shoot section.contents .about dd img{
    height: 100%;
}
#wrapper.chara.collabo-shoot section.contents .about dd.story{
    line-height: 1.6;
    width: 91%;
    text-align: left;
    height: auto;
    font-size: 83%;
}

#wrapper.chara.collabo-shoot div.reproduce-wrap {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 0, 0, 0.83)), color-stop(0.5,rgba(255, 0, 0, 0.83)), to(rgba(0, 84, 144, 0.3)));
    background: -webkit-linear-gradient(top, rgba(255, 0, 0, 0.83) 0%, rgba(255, 0, 0, 0.83) 50%, rgba(0, 84, 144, 0.3) 100%);
    background: linear-gradient(to bottom, rgba(255, 0, 0, 0.83) 0%,rgba(255, 0, 0, 0.83) 50%, rgba(0, 0, 0, 0.3) 100%);
}
#wrapper.chara.collabo-shoot div.reproduce {
    height: 551px;
    width: 95%;
    margin: 0 auto;
    font-size: 85%;
    text-align: center;
    background-image: url(../img/success/05/reproduce-scene-sp.png);
    background-position: 50% 97px;
    background-size: 320px auto;
    background-repeat: no-repeat;
}
#wrapper.chara.collabo-shoot div.reproduce p {
	text-indent: -9999px;
	margin-bottom: 10px;
}
#wrapper.chara.collabo-shoot div.reproduce img {
	display: block;
	margin:0 auto;
	width:100%;
}
#wrapper.chara .profile div.rival-wrap {
    background-color: rgba(6, 119, 25, 0.83);
}
#wrapper.chara .profile div.rival {
    height: 477px;
    width: 95%;
    margin: 0 auto;
    font-size: 85%;
    text-align: center;
    background-image: url(../img/success/05/rival-sp.png);
    background-position: 50% 60px;
    background-size: 221px auto;
    background-repeat: no-repeat;
}
#wrapper.chara.collabo-shoot div.rival p {
	text-indent: -9999px;
	margin-bottom: 10px;
}
#wrapper.chara.collabo-shoot div.rival img {
	display: block;
	margin:6px auto;
	width:100%;
}
#wrapper.chara .profile div#which-wrap {
    background-color: rgba(6, 119, 255, 0.83);
}
#wrapper.chara .profile div.which{
    padding: 33px 0;
    margin: 0 auto;
    max-width: 452px;
}
#wrapper.chara .profile div.which p{
	width:90%;
	margin:0 auto;
	text-align: center;
}
#wrapper.chara .profile div.which p img{
	width:90%;
    display:block;
    margin:0 auto;
}
#wrapper.chara .profile div.which p span{
    display: block;
    padding: 8px;
    margin-bottom: 7px;
    background-color: rgba(243, 243, 243, 0.17);
    border-radius: 13px;
}
#wrapper.chara .profile div.which p span.catchcopy{
    display: block;
    text-align: left;
    padding: 8px;
    margin-bottom: 7px;
    background-color: inherit;
    border-radius: 0;
    line-height: 1.6;
    font-weight: bold;
}
#wrapper.chara.collabo-shoot div.bnr-magapoke {
    width: 77%;
    margin: 41px auto;
}
#wrapper.chara.collabo-shoot div.bnr-magapoke img {
	width:100%;
}
.character-inner .profile a.bonus-chara {
	color: #f9ff00;
	font-weight: bold;
	text-shadow: none;
}


/*-------------itf------------*/


	.pre-index .main-image.itf{
    padding: 0 0 0 0;
    height: 369px;
    width: 100%;
    background: -moz-linear-gradient(top, rgba(0,0,0,1) 73%, rgba(0,0,0,0) 100%);
    background: -webkit-linear-gradient(top, rgba(0,0,0,1) 73%,rgba(0,0,0,0) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,1) 73%,rgba(0,0,0,0) 100%);
    background-size: auto;
    max-width: 9999px;
	}
	.pre-index .main-image.itf .adjust{
    position: relative;
    height: 400px;
    width: 350px;
    margin: 0 auto;
	}
	.pre-index .main-image.itf h3 img,
	.pre-index .main-image.itf p img{
		display: block;
	}
	.pre-index .main-image.itf img.main{
    position: absolute;
    top: 0px;
    left: -69px;
    opacity: 1;
    width: 493px;
	}
	.pre-index .main-image.itf h3{
	position: absolute;
	top: 287px;
    left: 49px;
    width: 257px;
	}
	.pre-index .main-image.itf h3 img{
		width:100%;
	}
	.pre-index .main-image.itf p{
    position: absolute;
    top: 238px;
    left: 0px;
    opacity: 1;
    width: 359px;
	}
	.pre-index .main-image.itf p img{
	width:100%;
	}
	.link-itf-official{
	width: 100%;
    height: 374px;
    margin: 0 auto;
    background-image: url(../img/special/itf/links-deco-sp.png);
    background-repeat: no-repeat;
    background-position: 50% 0px;
    background-size: 924px;
	}
	.link-itf-official .adjust{
	position: relative;
    height: 327px;
    width: 350px;
    margin: 0 auto;
	}
	.link-itf-official .img-itf{
    position: absolute;
    top: 41px;
    left: 37px;
    width: 274px;
	}
	.link-itf-official .text-itf{
    position: absolute;
    top: 226px;
    left: 65px;
    width: 228px;
	}
	.link-itf-official .img-itf img,
	.link-itf-official .text-itf img{
	width:100%;
	}


/*-------------fcbarcelona------------*/


	.pre-index .main-image.fcbarcelona{
    padding: 0 0 0 0;
    height: 452px;
    width: 100%
	}
	.pre-index .main-image.fcbarcelona .adjust{
    position: relative;
    height: 400px;
    width: 350px;
    margin: 0 auto;
	}
	.pre-index .main-image.fcbarcelona h1 img,
	.pre-index .main-image.fcbarcelona p img{
		display: block;
	}
	.pre-index .main-image.fcbarcelona img.main{
    position: absolute;
    top: -41px;
    left: -38px;
    opacity: 1;
    width: 434px;
    z-index: 0;
	}
	.pre-index .main-image.fcbarcelona h1{
    position: absolute;
    top: 322px;
    left: 10px;
    width: 333px;
	}
	.pre-index .main-image.fcbarcelona h1 img{
		width:100%;
	}
	.pre-index .main-image.fcbarcelona p{
    position: absolute;
    top: 362px;
    left: 47px;
    opacity: 1;
    width: 259px;
	}
	.pre-index .main-image.fcbarcelona p img{
	width:100%;
	}
	.link-fcbarcelona-official{
	width: 100%;
    height: 538px;
    margin: 0 auto;
    background-color: rgba(0, 0, 0, 0.7);
	}
	.link-fcbarcelona-official .adjust{
	position: relative;
    height: 327px;
    width: 350px;
    margin: 0 auto;
	}
	.link-fcbarcelona-official .img-fcbarcelona{
    position: absolute;
    top: 17px;
    left: 99px;
    width: 155px;
	}
	.link-fcbarcelona-official .text-fcbarcelona{
    position: absolute;
    top: 187px;
    left: 65px;
    width: 228px;
	}
	.link-fcbarcelona-official .img-fcbarcelona img,
	.link-fcbarcelona-official .text-fcbarcelona img{
	width:100%;
	}
	.link-fcbarcelona-official span{
    display: block;
    position: absolute;
    top: 227px;
    left: 20px;
    width: 90%;
    line-height: 1.5;
    font-size: 80%;
	}





/*-------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------*/

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

#wrapper.chara .scenario-list .list ul li a.special:after,
#wrapper.chara .scenario-list .list ul li.on a.special:after
{
    top: 2px;
    left: 0;
    background-size: 220px auto;
}


}
#wrapper.chara .scenario-list .list ul li a.special:hover img,
#wrapper.chara .scenario-list .list ul li.on a.special img{
    -webkit-transform: translateY(-62%);
    transform: translateY(-62%);
    width: 114px;
}
#wrapper.chara .scenario-list .list ul li a.special:hover img,
#wrapper.chara .scenario-list .list ul li a.special img{
    -webkit-transform: translateY(-51%);
    transform: translateY(-12%);
    width: 114px;
}
#wrapper.chara .scenario-list .list ul li a.special span {
    display: inline-block;
    position: relative;
    overflow: hidden;
    height: 49px;
    width: 184px;
    vertical-align: middle;
}
#wrapper.chara .main-ttl {
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)),to(rgba(0,0,0,0.3)));
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 100%);
}
#wrapper.chara.collabo-shoot .main-ttl {
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(0.3,rgba(0, 149, 255, 0.24)), to(rgba(0, 84, 144, 0.3)));
	background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 149, 255, 0.4) 25%, rgba(0, 84, 144, 0.3) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%,rgba(0, 149, 255, 0.4) 25%, rgba(0, 0, 0, 0.3) 100%);
}
#wrapper .main-ttl .ttl p.logo a {
	position: relative;
	display: block;
	width: 35%;
	padding: 10% 0 0 0;
	margin: 6px 0 0 10px;
	max-width: 164px;
	background: url(../img/common_menu_pawasaka_logo.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.chara .main-ttl h1 {
	width: 90%;
	margin: -10% auto 15px;
	padding: 83% 0 0 0;
	overflow: hidden;
	background: no-repeat;
	background-size: 100% auto;
	animation:characterMainCharaAnime 1s ease 1;
	-webkit-animation:characterMainCharaAnime 1s ease 1;
}
@keyframes characterMainCharaAnime {
	0% {
		opacity: 0;
		transform:translate(0,200px);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
@-webkit-keyframes characterMainCharaAnime {
	0% {
		opacity: 0;
		transform:translate(0,200px);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
#wrapper .main-ttl .ttl p.logo a span,
#wrapper.chara .main-ttl h1 span {
	display: block;
	text-indent: -50em;
}
#wrapper.chara .main-ttl .detail {
	width: 90%;
	margin: 0 auto;
}
#wrapper.chara .main-ttl .detail h2{
	margin: 0 0 13px;
}
#wrapper.chara.collabo-shoot .main-ttl .detail h2 {
    margin: 0 0 13px;
    width: 95%;
}
#wrapper.chara.diverge-05 .main-ttl .detail h2 {
    margin: 0 0 13px;
    width: auto;
}
#wrapper.chara .main-ttl .detail h2 img {
	height: 18px;
}
#wrapper.chara.collabo-shoot .main-ttl .detail h2 img {
	width: 100%;
	height: auto;
}
#wrapper.chara.diverge-05 .main-ttl .detail h2 img {
	width:auto;
}
#wrapper.chara .main-ttl .detail p.lead {
	padding: 0 0 20px;
	font-size: 75%;
	line-height: 1.5;
	text-shadow: 0 0 3px #000;
}
#wrapper.chara .main-ttl .detail p.lead span {
	display: inline-block;
}
#wrapper.chara .main-ttl .detail .special_route_wrap {
	width:100%;
	padding:0 0 34px;
	box-sizing:border-box;
}
#wrapper.chara .main-ttl .detail p.special_route_detail{
	position: relative;
	width: 100%;
    padding: 11px 11px 11px 33px;
    box-sizing:border-box;
    background-color: rgba(255,255,255,0.8);
    border-radius: 7px;
    border: 3px solid #ffda38;
    box-shadow: 1px 1px 10px -3px rgba(0,0,0,0.4) inset;
}
#wrapper.chara .main-ttl .detail p.special_route_detail:after{
    content: "";
    position: absolute;
    display: block;
    width: 13px;
    height: 90%;
    top: 5%;
    left: 6px;
    background-color: #fff;
    border-radius: 11px;
	background-image: url(../img/success/icon-special-for-archive_link.png);
	background-repeat: no-repeat;
	background-size: 90% auto; 
	background-position: 50% 50%;
}
#wrapper.chara .main-ttl .detail p.special_route_detail img{
	display:block;
	width:95%;
	margin:0 auto 8px;

}
#wrapper.chara .main-ttl .detail .special_route_wrap span {
	font-size: 75%;
	line-height: 1.5;
	color:#343434;
}
#wrapper.chara .main-ttl .detail .special_route_wrap.return span {
    font-size: 100%;
    font-weight: bold;
    color: #fff800;
    text-shadow: 0 0 3px #000;
}
#wrapper.chara .character-inner {
	background: rgba(0,0,0,0.3);
}
#wrapper.chara .character-inner.itf.with-sp-skill {
	background: rgba(0,0,0,0);
}
#wrapper.chara.diverge-05 .character-inner {
	background: rgba(0,0,0,0.3);
    padding-bottom: 30px;
}
#wrapper.chara .profile ul {
	padding: 0 15px;
}
#wrapper.chara .profile ul li {
	margin: 0 0 30px;
	text-shadow: 0 0 3px #000;
}
#wrapper.chara .profile ul li:after {
	display: table;
	content: '';
	clear: both;
}
#wrapper.chara .profile ul li .image {
	float: left;
	position: relative;
	width: 40%;
	background: url(../img/success/character_bg.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.chara .profile ul li .image:after {
	content:"";
	position: absolute;
	width: 120%;
	height: 108.41%;
	left: -10%;
	bottom: -1%;
}
#wrapper.chara .profile ul li.on .image:after {
	animation:characterBgStarAnime 2s ease .2s 1;
	-webkit-animation:characterBgStarAnime 2s ease .2s 1;
}
@keyframes characterBgStarAnime {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}
@-webkit-keyframes characterBgStarAnime {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}
#wrapper.chara .profile ul li:nth-child(2n) .image {
	float: right;
}
#wrapper.chara .profile ul li .image img {
	width: 100%;
	position: relative;
	z-index: 50;
	opacity: 0;
}
#wrapper.chara .profile ul li.on:nth-child(odd) .image img,
#wrapper.chara .profile ul li.on:nth-child(even) dl{
	animation:characterMainLAnime .7s ease .3s 1 forwards;
	-webkit-animation:characterMainLAnime .7s ease .3s 1 forwards;
}
#wrapper.chara .profile ul li.on:nth-child(even) .image img,
#wrapper.chara .profile ul li.on:nth-child(odd) dl {
	animation:characterMainRAnime .7s ease .3s 1 forwards;
	-webkit-animation:characterMainRAnime .7s ease .3s 1 forwards;
}
@keyframes characterMainLAnime {
	0% {
		opacity: 0;
		transform:translate(50%,-15%);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
@keyframes characterMainRAnime {
	0% {
		opacity: 0;
		transform:translate(-50%,15%);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
@-webkit-keyframes characterMainLAnime {
	0% {
		opacity: 0;
		transform:translate(50%,-15%);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
@-webkit-keyframes characterMainRAnime {
	0% {
		opacity: 0;
		transform:translate(-50%,15%);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
#wrapper.chara .profile ul li.star1.on p:after {
	background: url(../img/success/character_star1.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.chara .profile ul li.star2.on p:after {
	bottom: 3%;
	background: url(../img/success/character_star2.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.chara .profile ul li.star3.on p:after {
	background: url(../img/success/character_star3.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.chara .profile ul li.star4.on p:after {
	bottom: 6%;
	background: url(../img/success/character_star4.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.chara .profile ul li.star5.on p:after {
	bottom: 6%;
	background: url(../img/success/character_star5.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.chara .profile ul li.star6.on p:after {
	bottom: 6%;
	background: url(../img/success/character_star6.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.chara .profile ul li.star7.on p:after {
	bottom: 6%;
	background: url(../img/success/character_star7.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.chara .profile ul li.star8.on p:after {
	bottom: 6%;
	background: url(../img/success/character_star8.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.chara .profile ul li dl {
	float: left;
	box-sizing: border-box;
	width: 60%;
	padding: 10px 10px 0 10px;
	opacity: 0;
}
#wrapper.chara .character-inner.with-sp-skill .profile ul li dl {
	padding: 0 10px;
}
#wrapper.chara .character-inner.with-sp-skill .profile .sp-skill span,
#wrapper.chara .character-inner.with-sp-skill .profile .sp-skill span.skill-detail,
#wrapper.chara .character-inner.with-sp-skill .profile .sp-skill span.two-sp
{
	display: block;
}

#wrapper.chara .character-inner.with-sp-skill .profile .sp-skill span.two-sp-name-1
{
	display: inline;
}
#wrapper.chara .character-inner.with-sp-skill .profile .sp-skill span.skill-detail
{
	text-align: left;
}

#wrapper.chara .profile ul li:nth-child(even) dl {
	float: right;
}
#wrapper.chara .profile ul li dl dt {
	font-size: 175%;
	line-height: 1.2;
	padding: 10px 0 0 0;
}
#wrapper.chara .profile.mfi ul li dl dt {
    font-size: 158%;
    line-height: 1.2;
    padding: 10px 0 5px 0;
}
#wrapper.chara .profile.mfi ul li dl dt {
    font-size: 158%;
    line-height: 1.2;
    padding: 10px 0 5px 0;
}
#wrapper.chara .character-inner.with-sp-skill .profile.mfi ul li dl dt {
    font-size: 158%;
    line-height: 1.2;
    padding: 0 0 5px 0;
}
#wrapper.chara  .profile ul li .ruby {
	margin: 0 0 10px;
	font-size: 75%;
}
#wrapper.chara .profile ul li .position,
#wrapper.chara .profile ul li .dominant-leg,
#wrapper.chara .profile ul li .sp-skill
 {
	display: inline-block;
	margin: 0 0 6px;
	padding: 4px 6px;
	font-size: 87.5%;
	border: 1px solid #fff;
	border-radius: 6px;
}
#wrapper.chara .profile ul li .sp-skill{
    font-size: 87%;
    font-weight: bold;
    color: #ffee0b;
    text-shadow: 0 0 3px rgba(0, 0, 0, 1);
    border: none;
    padding: 4px 9px;
    text-align: center;
    background: rgba(0, 0, 0, 0.3);
}
#wrapper.chara .profile ul li .sp-skill.s06 span.new{
    display: inline-block;
    background-color: #ff2525;
    color: #fff;
    border-radius: 6px;
    padding: 0 2px;
    text-shadow: none;
    font-size: 80%;
    margin: 5px;
}

#wrapper.chara .profile ul li .girlfriend
 {
    display: inline-block;
    margin: 0 0 6px;
    padding: 4px 6px;
    font-size: 87.5%;
    color: #fff;
    background: rgba(255, 127, 127, 0.8);
    border-radius: 6px;
}
#wrapper.chara .profile ul li .description {
	clear: both;
	box-sizing: border-box;
	font-size: 87.5%;
	padding: 6px 10px 0;
}
#wrapper.chara .profile ul li .description span.caution {
	font-size: 78.5%;
}
#wrapper.chara .tips {
	text-shadow: 0 0 3px #000;
	overflow: hidden;
}
#wrapper.chara .tips h1 {
	padding: 6px 0;
	text-align: center;
	background: #e01a21;
}
#wrapper.chara .tips h1 img {
	height: 24px;
	vertical-align: bottom;
}
#wrapper.chara .tips h2 {
	margin: 0 0 10px;
	padding: 6px 0;
	text-align: center;
	background: url(../img/bg_tips_h2.png) rgba(0,0,0,.2);
	text-shadow: 1px 1px 2px #000;
}
#wrapper.chara .tips.col-2 h2 {
	clear: both;
}
#wrapper.chara .tips > ol,
#wrapper.chara .tips > ul {
	max-width: 800px;
	margin: 0 auto;
	padding: 10px 20px 0px 10px;
}
#wrapper.chara .tips.col-2 ol.col-2-second {
	clear: both;
}
#wrapper.chara .tips.col-2 ul.clear {
	clear: both;
}



#wrapper.chara .tips > ul.align-center{
	text-align: center
}
#wrapper.chara .tips img.img_hints{
	margin:10px 0 20px;
	width:80%;
}
#wrapper.chara .tips > ul.align-center > li dt {
    position: relative;
    padding: 0 0 0 40px;
    width: 178px;
    margin: 0 auto;
}
#wrapper.chara .tips > ul.align-center > li dd {
    margin: 0 0 15px;
    padding: 0 0 0 0px;
    font-size: 87.5%;
    line-height: 1.4;
}



#wrapper.chara .tips > ol > li,
#wrapper.chara .tips > ul > li {
    margin: 0 0 30px;
}
#wrapper.chara .tips.col-2 > ol > li,
#wrapper.chara .tips.col-2 > ul > li {
    margin: 0 0 30px;
}
#wrapper.chara .tips > ol > li dt,
#wrapper.chara .tips > ul > li dt {
	margin: 0 0 6px;
}
#wrapper.chara .tips > ol > li dt {
	padding: 0 0 0 10px;
}
#wrapper.chara .tips > ul > li dt {
	position: relative;
	padding: 0 0 0 40px;
}
#wrapper.chara .tips > ul > li dt:before {
	position: absolute;
	content: "";
	top: -4px;
	left: 4px;
	width: 20px;
	height: 20px;
	border: 2px solid #fff;
	border-radius: 4px;
}
#wrapper.chara .tips > ul > li dt:after {
	position: absolute;
	content: "";
	top: -4px;
	left: 10px;
	width: 18px;
	height: 8px;
	border-left: 4px solid #c3ff41;
	border-bottom: 4px solid #c3ff41;
	-webkit-transform: rotate(-40deg);
	transform: rotate(-40deg);
}
#wrapper.chara .tips > ol > li dd,
#wrapper.chara .tips > ul > li dd {
	margin: 0 0 15px;
	padding: 0 0 0 40px;
	font-size: 87.5%;
	line-height: 1.4;
}
#wrapper.chara .tips table {
	margin: 10px 0;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
}
#wrapper.chara .tips table th,
#wrapper.chara .tips table td {
	padding: 4px 6px;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
}
#wrapper.chara .tips.col-2 .col-2-img,
#wrapper.chara .tips.col-2 .col-2-img {
    width: 60%;
}
#wrapper.chara .tips.col-2 .col-2-img img {
    width: 100%;
}
#wrapper.chara .tips.col-2 .col-2-img.first {
    margin: 0px auto 10px;
}
#wrapper.chara .tips.col-2 .col-2-img.second {
   	margin: 0 auto 20px;
}

/*about*/
#wrapper.about {
	overflow: hidden;
}
#wrapper.about .main-ttl {
	padding: 0 0 40px;
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.3)));
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 100%);
}
#wrapper.about .main-ttl h1 span,
#wrapper.about .main-ttl .topic span{
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
#wrapper.about .main-ttl .topic {
	position: relative;
	margin: -8% 0 0 0;
	padding: 82% 0 0 0;
}
#wrapper.about .main-ttl .topic .topic-success p {
	position: absolute;
	width: 75%;
	padding: 70% 0 0 0;
	top: 17%;
	left: 5%;
	background: url(../img/about_main_ttl_img01.png?v2) no-repeat;
	background-size: 100% auto;
	z-index: 60;
}
#wrapper.about .main-ttl .topic .topic-success p {
	animation:aboutTopicSuccessCharaAnime 1s ease 1;
	-webkit-animation:aboutTopicSuccessCharaAnime 1s ease 1;
}
@keyframes aboutTopicSuccessCharaAnime {
	0% {
		opacity: 0;
		transform:translate(-200px,0);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
@-webkit-keyframes aboutTopicSuccessCharaAnime {
	0% {
		opacity: 0;
		transform:translate(-200px,0);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
#wrapper.about .main-ttl .topic .topic-stadium p {
	animation:aboutTopicStadiumCharaAnime 1s ease 1;
	-webkit-animation:aboutTopicStadiumCharaAnime 1s ease 1;
}
@keyframes aboutTopicStadiumCharaAnime {
	0% {
		opacity: 0;
		transform:translate(200px,0);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
@-webkit-keyframes aboutTopicStadiumCharaAnime {
	0% {
		opacity: 0;
		transform:translate(200px,0);
	}
	100% {
		opacity: 1;
		transform:translate(0,0);
	}
}
#wrapper.about .main-ttl .topic .topic-success dl dt {
	position: relative;
	width: 88%;
	margin: 0 auto;
	padding: 18% 0 0 0;
	background: url(../img/about_main_ttl_text_sp.svg) no-repeat;
	background-size: 100% auto;
	z-index: 80;
}
#wrapper.about .main-ttl .topic .topic-stadium p {
	position: absolute;
	width: 65%;
	padding: 60% 0 0 0;
	right: 2%;
	top: -10%;
	background: url(../img/about_main_ttl_img02.png) no-repeat;
	background-size: 100% auto;
	z-index: 50;
}
#wrapper.about .main-ttl .topic .topic-stadium dl dt {
	display: none;
}
#wrapper.about .main-ttl .topic dl dd {
	margin: 0 0 0 5%;
	width: 45%;
}
#wrapper.about .main-ttl .topic .topic-stadium dl dd {
	width: 100%;
	margin: -40px 0 0;
	padding: 0 5% 0 0;
	overflow: hidden;
	text-align: right;
	box-sizing: border-box;
}
#wrapper.about .main-ttl .topic .topic-stadium dl dd a {
	float: right;
	width: 45%;
	text-align: left;
	white-space: nowrap;
}
#wrapper.about .main-ttl .topic dl dd a {
	position: relative;
	display: block;
	width: 100%;
	padding: 10px 20px 10px 10px;
	background: #fff;
	border-radius: 5px;
	color: #205f13;
	font-size: 81.25%;
	box-sizing: border-box;
	transition: all 0.2s ease;
	-webkit-transition: all 0.2s ease;
}
#wrapper.about .main-ttl .topic dl dd a:hover {
	background: #205f13;
	color: #fff;
}
#wrapper.about .main-ttl .topic dl dd a:after {
	position: absolute;
	content:"";
	display: block;
	width: 10px;
	height: 15px;
	top: 50%;
	right: 10px;
	margin: -7px 0 0 0;
	background: url(../img/link_arrow_green.svg) no-repeat;
	background-size: 10px 15px;
}
#wrapper.about .main-ttl .topic dl dd a:hover:after {
	background: url(../img/link_arrow_white.svg) no-repeat;
	background-size: 10px 15px;
}
#wrapper.about .game-detail {
	background: rgba(0,0,0,0.3);
}
#wrapper.about .game-detail .sub-ttl {
	padding: 15px 0;
	background: rgba(35,71,188,0.7);
	text-align: center;
}
#wrapper.about .game-detail .sub-ttl h2 {
	position: relative;
	margin: 0 auto;
	transform: translate(8px, 0);
}
#wrapper.about .game-detail .sub-ttl h2 span {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
#wrapper.about #success .sub-ttl h2 {
	width: 156px;
	height: 26px;
	background: url(../img/about_sub_ttl_success.svg) no-repeat;
	background-size: 100% auto;
}
#wrapper.about #stadium .sub-ttl h2 {
	width: 168px;
	height: 26px;
	background: url(../img/about_sub_ttl_stadium.svg) no-repeat;
	background-size: 100% auto;
}
#wrapper.about .game-detail .sub-ttl h2:before {
	position: absolute;
	content:"";
	display:block;
	width: 64px;
	height: 78px;
	top: 50%;
	margin: -40px 0 0 -75px;
	background: url(../img/about_sub_ttl_shirase01.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.about #stadium .sub-ttl h2:before {
	margin: -40px 0 0 -70px;
	background: url(../img/about_sub_ttl_shirase02.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.about .game-detail .sub-ttl h2:after {
	position: absolute;
	content:"";
	display:block;
	width: 40px;
	height: 78px;
	top: 50%;
	margin: -40px 0 0 170px;
	background: url(../img/about_sub_ttl_jyon.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.about #stadium .sub-ttl h2:after {
	margin: -40px 0 0 175px;
}
#wrapper.about .game-detail .game-detail-inner {
	padding: 20px;
}
#wrapper.about .game-detail .game-detail-inner.about-success,
#wrapper.about .game-detail .game-detail-inner.about-stadium{
	padding: 30px 20px 20px;
}
#wrapper.about .game-detail .game-detail-inner.about-engine{
	padding: 0 20px 30px;
}
#wrapper.about .game-detail .game-detail-inner.about-homeandaway {
	padding: 0 20px 50px;
}
#wrapper.about .game-detail .game-detail-inner .game-detail-img img {
	width: 100%;
	vertical-align: bottom;
}
#wrapper.about .game-detail .game-detail-inner .game-detail-text h3 {
	margin: 20px 0 10px;
}
#wrapper.about .game-detail p.lead {
	font-size: 75%;
	line-height: 1.5;
	text-shadow: 0 0 3px #000;
}
#wrapper.about .game-detail .game-detail-text h3 span {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
#wrapper.about .game-detail .about-success h3 {
	padding: 10% 0 0 0;
	background: url(../img/about_detail_text_success_2line.svg) no-repeat;
	background-size: 100% auto;
}
#wrapper.about .game-detail .about-story {
	background: #2347bc;
	padding: 0 0 20px;
}
#wrapper.about .game-detail .about-story h3 {
	padding: 4% 0 0 0;
	background: url(../img/about_detail_text_story.svg) no-repeat;
	background-size: 100% auto;
}
#wrapper.about .game-detail .about-story p.lead {
	text-shadow:none;
}
#wrapper.about .game-detail .about-story .game-detail-text .game-detail-text-inner {
	padding: 20px;
}
#wrapper.about .game-detail .about-story .story-img {
	padding: 30% 0 0;
	background: url(../img/about_story_img_sp.jpg) repeat-x;
	background-size: auto 100%;
}
#wrapper.about .game-detail .about-chara h3 {
	padding: 4% 0 0 0;
	background: url(../img/about_detail_text_chara.svg) no-repeat;
	background-size: 100% auto;
}
#wrapper.about .game-detail .about-engine h3 {
	padding: 10% 0 0 0;
	background: url(../img/about_detail_text_engine.svg?v3) no-repeat;
	background-size: 100% auto;
}
#wrapper.about .game-detail .about-stadium h3 {
	padding: 4% 0 0 0;
	background: url(../img/about_detail_text_stadium.svg) no-repeat;
	background-size: 100% auto;
}
#wrapper.about .game-detail .about-homeandaway h3 {
	padding: 4% 0 0 0;
	background: url(../img/about_detail_text_homeandaway.svg) no-repeat;
	background-size: 100% auto;
}

/*cbt-thanks*/
#wrapper.cbt-thanks {
	overflow: hidden;
}
#wrapper.cbt-thanks .thanks .thanks-inner {
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0.1)), to(rgba(0,0,0,0.3)));
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.3) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.3) 100%);
}
#wrapper.cbt-thanks .thanks .thanks-inner .thanks-inner-detail {
	position: relative;
	padding: 75% 20px 30px;
}
#wrapper.cbt-thanks .thanks .thanks-inner .ball {
	position: absolute;
	width:50%;
	right: 5px;
	top:-7%;
	padding: 50% 0 0 0;
	background: url(../img/character_msg_ball.png) no-repeat;
	background-size: 100% auto;
	animation:cbtThanksBallAnime 0.8s ease 1;
	-webkit-animation:cbtThanksBallAnime 0.8s ease 1;
}
@keyframes cbtThanksBallAnime {
	0% {
		transform: translate(0, -150px);
		opacity: 0;
	}
	100% {
		transform: translate(0, 0);
		opacity: 1;
	}
}
@-webkit-keyframes cbtThanksBallAnime {
	0% {
		transform: translate(0, -150px);
		opacity: 0;
	}
	100% {
		transform: translate(0, 0);
		opacity: 1;
	}
}
#wrapper.cbt-thanks .thanks .thanks-inner .pawasaka {
	position: absolute;
	width: 50%;
	left: 3%;
	top: 10%;
	padding: 80% 0 0 0;
	background: url(../img/character_msg_img.png?v2) no-repeat;
	background-size: 100% auto;
	animation:cbtThanksPawasakaAnime 0.8s ease 1;
	-webkit-animation:cbtThanksPawasakaAnime 0.8s ease 1;
}
@keyframes cbtThanksPawasakaAnime {
	0% {
		transform: translate(0, 150px);
		opacity: 0;
	}
	100% {
		transform: translate(0, 0);
		opacity: 1;
	}
}
@-webkit-keyframes cbtThanksPawasakaAnime {
	0% {
		transform: translate(0, 150px);
		opacity: 0;
	}
	100% {
		transform: translate(0, 0);
		opacity: 1;
	}
}
#wrapper.cbt-thanks .thanks .thanks-inner .thanks-msg h1 {
	position: relative;
	padding: 6% 0 0 0;
	max-width: 460px;
	background: url(../img/cbt_thanks_ttl_text.svg) left top no-repeat;
	background-size: 100% auto;
}
#wrapper.cbt-thanks .thanks .thanks-inner .thanks-msg h1 span {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
#wrapper.cbt-thanks .thanks .thanks-inner .thanks-msg p.lead {
	font-size: 75%;
	line-height: 1.5;
	text-shadow: 0 0 3px #000;
}
#wrapper.cbt-thanks .thanks-footer {
	background: rgba(0,0,0,0.3);
}
#wrapper.cbt-thanks .thanks-footer .sne-share {
	padding: 15px 0;
	background: #fff600;
}
#wrapper.cbt-thanks .thanks-footer .sne-share .sne-share-detail {
	position: relative;
	width: 320px;
	margin: 0 auto;
	padding: 0 0 0 150px;
	box-sizing: border-box;
}
#wrapper.cbt-thanks .thanks-footer .sne-share p.yabe:after {
	content:"";
	position: absolute;
	display: block;
	width: 45%;
	height: 200%;
	left: 0;
	top:50%;
	margin: -25% 0 0 0;
	background: url(../img/cbt_thanks_yabe.png) no-repeat;
	background-size: 100% auto;
	animation:cbtThanksYabeAnime .6s ease 1.4s 1;
	-webkit-animation:cbtThanksYabeAnime .6s ease 1.4s 1;
}
@keyframes cbtThanksYabeAnime {
	0% {
		left: -200px;
		opacity: 0;
	}
	100% {
		left: 0;
		opacity: 1;
	}
}
@-webkit-keyframes cbtThanksYabeAnime {
	0% {
		left: -200px;
		opacity: 0;
	}
	100% {
		left: 0;
		opacity: 1;
	}
}
#wrapper.cbt-thanks .thanks-footer .sne-share p.yabe img {
	margin: 0 0 10px -20px;
	width: 165px;
	vertical-align: bottom;
	animation:cbtThanksYabeFukidashiAnime .6s ease 1.4s 1;
	-webkit-animation:cbtThanksYabeFukidashiAnime .6s ease 1.4s 1;
}
@keyframes cbtThanksYabeFukidashiAnime {
	0% {
		transform: translate(-200px, 0);
		opacity: 0;
	}
	100% {
		transform: translate(0, 0);
		opacity: 1;
	}
}
@-webkit-keyframes cbtThanksYabeFukidashiAnime {
	0% {
		transform: translate(-200px, 0);
		opacity: 0;
	}
	100% {
		transform: translate(0, 0);
		opacity: 1;
	}
}
#wrapper.cbt-thanks .thanks-footer ul{
	text-align: left;
	white-space: nowrap;
}
#wrapper.cbt-thanks .thanks-footer ul li,
#wrapper.cbt-thanks .thanks-footer ul li a {
	display: inline-block;
}
#wrapper.cbt-thanks .thanks-footer ul li img {
	vertical-align: bottom;
	border-radius: 3px;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
#wrapper.cbt-thanks .thanks-footer ul li img:hover {
	opacity: 0.7;
}
.pc #wrapper.cbt-thanks .thanks-footer ul li:nth-child(2) {
	display: none;
}
#wrapper .page-back p{
	padding: 35px 0 0 0;
	text-align: center;
}
#wrapper.simple-page.update-pawamatch .page-back p {
    padding: 88px 0 40px 0;
    text-align: center;
}
#wrapper .page-back p a{
	padding: 6px 50px;
	border-radius: 25px;
	border: 3px solid #24910f;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #e3ffac), color-stop(0.00, #fff));
	background: -webkit-linear-gradient(#fff, #e3ffac);
	background: linear-gradient(#fff, #e3ffac);
	box-shadow:0 5px 0 0 rgba(0,0,0,0.3);
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
#wrapper .page-back p a:hover{
	padding: 6px 70px;
	border: 3px solid #f3e500;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #fff6ac), color-stop(0.00, #fff));
	background: -webkit-linear-gradient(#fff, #fff6ac);
	background: linear-gradient(#fff, #fff6ac);
}
#wrapper .page-back p a span{
	display: inline-block;
	vertical-align: middle;
	width: 87px;
	height: 15px;
	background: url(../img/cbt_thanks_back_btn_text.svg) no-repeat;
	background-size: 100% auto;
}
#wrapper .page-back p a:hover span {
	background: url(../img/cbt_thanks_back_btn_text_on.svg) no-repeat;
	background-size: 100% auto;
}

#wrapper.cbt-finish .thanks {
	padding: 20px;
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.3)));
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 100%);
}
#wrapper.cbt-finish .main-ttl {
	max-width: 576px;
	margin: 0 auto;
}
#wrapper.cbt-finish .main-ttl h1 {
	padding: 30% 0 0 0;
	background: url(../img/cbt_finish_main_ttl_text_4line.svg) no-repeat;
	background-size: 100% auto;
	animation:cbtThanksPawasakaAnime 1s ease 1;
	-webkit-animation:cbtThanksPawasakaAnime 1s ease 1;
}
#wrapper.cbt-finish.pre .main-ttl h1 {
	padding: 25% 0 0 0;
	background: url(../img/pre_finish_main_ttl_text_4line.svg) no-repeat;
	background-size: 100% auto;
	animation:cbtThanksPawasakaAnime 1s ease 1;
	-webkit-animation:cbtThanksPawasakaAnime 1s ease 1;
}
#wrapper.cbt-finish .main-ttl .main-chara {
	display: block;
	max-width: 576px;
	max-height: 374px;
	margin: 0 auto;
	padding: 70% 0 0 0;
	background: url(../img/cbt_finish_main_img.png) no-repeat;
	background-size: 100% auto;
	animation:cbtThanksBallAnime 1s ease 1;
	-webkit-animation:cbtThanksBallAnime 1s ease 1;
}
#wrapper.cbt-finish .main-ttl h1 span {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
#wrapper.cbt-finish .main-ttl p.lead {
	font-size: 75%;
	line-height: 1.5;
	text-shadow: 0 0 3px #000;
}
#wrapper.cbt-testflight .common-header {
	z-index: 110;
}
#wrapper.cbt-testflight .howto {
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.3)));
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 50%);
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 50%);
}
#wrapper.cbt-testflight .howto p.lead {
	font-size: 75%;
	line-height: 1.5;
	text-shadow: 0 0 5px #000;
}
#wrapper.cbt-testflight .howto .detail {
	padding: 0 20px 20px;
	animation:cbtTestFlightAnime 1.3s ease 1;
	-webkit-animation:cbtTestFlightAnime 1.3s ease 1;
}
#wrapper.cbt-testflight .howto .detail .attend-list {
	margin: 15px 0 0;
	padding: 15px;
	background: rgba(255,255,255,0.7);
	color: #000;
}
#wrapper.cbt-testflight .howto .detail .attend-list dl {
	font-size: 75%;
	line-height: 1.5;
}
#wrapper.cbt-testflight .howto .detail .attend-list li:first-child {
	margin: 0 0 10px;
}
#wrapper.cbt-testflight .howto .detail .attend-list li:last-child dl dd {
	position: relative;
	padding: 0 0 0 1em;
}
#wrapper.cbt-testflight .howto .detail .attend-list li:last-child dl dd span {
	position: absolute;
	left: 0;
}
#wrapper.cbt-testflight .howto .main-ttl {
	padding: 15px 15px 15px 28%;
	margin: 35px 0;
	background: rgba(35, 71, 188, 0.7);
	animation:cbtTestFlightAnime 1.3s ease 1;
	-webkit-animation:cbtTestFlightAnime 1.3s ease 1;
}
@keyframes cbtTestFlightAnime {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@-webkit-keyframes cbtTestFlightAnime {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

#wrapper.cbt-testflight .howto .main-ttl .main-ttl-inner {
	position: relative;
}
#wrapper.cbt-testflight .howto .main-ttl .main-ttl-inner:after {
	content:"";
	position: absolute;
	display: block;
	width: 35%;
	height: 300%;
	max-width: 164px;
	max-height: 198px;
	left: -35%;
	top: 50%;
	margin: -22% 0 0;
	background: url(../img/cbt_testflight_title_chara.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.cbt-testflight .howto .main-ttl h1 {
	padding: 14% 0 0 0;
	background: url(../img/cbt_testflight_title_txt_sp.svg) no-repeat center center;
	background-size: 100% auto;
}
#wrapper.cbt-testflight .howto .main-ttl h1 span {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
#wrapper.cbt-testflight .flow {
	background: rgba(0,0,0,0.3);
}
#wrapper.cbt-testflight .flow .flow-ttl {
	padding: 20px 0;
	text-align: center;
	background: rgba(35, 71, 188, 0.7);
}
#wrapper.cbt-testflight .flow .flow-ttl h2 {
	position: relative;
	width: 50%;
	max-width: 266px;
	height: 32px;
	margin: 0 auto;
	background: url(../img/cbt_testflight_flow_title.svg) no-repeat center center;
	background-size: 100% auto;
}
#wrapper.cbt-testflight .flow .flow-ttl h2:after {
	display: block;
	position: absolute;
	content:"";
	width: 55px;
	padding: 80% 0 0 0;
	right: -60px;
	top: -63px;
	background: url(../img/about_sub_ttl_jyon.png) no-repeat;
	background-size: 100% auto;
}
#wrapper.cbt-testflight .flow .flow-ttl h2 span {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
#wrapper.cbt-testflight .flow ol {
	padding: 0 20px;
}
#wrapper.cbt-testflight .flow ol li {
	padding: 20px 0 30px;
	border-bottom: 1px solid #fff;
}
#wrapper.cbt-testflight .flow ol li .ttl {
	display: table;
	width: 100%;
	margin: 0 0 10px;
}
#wrapper.cbt-testflight .flow ol li .ttl p {
	display: table-cell;
	width: 35px;
	height: 64px;
	vertical-align: middle;
}
#wrapper.cbt-testflight .flow ol li .ttl p em {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	font-size: 50%;
}
#wrapper.cbt-testflight .flow ol li .ttl h3 {
	display: table-cell;
	padding: 0 5px 0 15px;
	vertical-align: middle;
	font-size: 75%;
	line-height: 1.5;
	text-shadow: 0 0 3px #000;
}
#wrapper.cbt-testflight .flow ol li .ttl h3 span {
	font-size: 9px;
}
#wrapper.cbt-testflight .flow ol li:nth-child(1) .ttl p {
	background: url(../img/cbt_testflight_step1.svg) no-repeat center center;
	background-size: 100% auto;
}
#wrapper.cbt-testflight .flow ol li:nth-child(2) .ttl p {
	background: url(../img/cbt_testflight_step2.svg) no-repeat center center;
	background-size: 100% auto;
}
#wrapper.cbt-testflight .flow ol li:nth-child(3) .ttl p {
	background: url(../img/cbt_testflight_step3.svg) no-repeat center center;
	background-size: 100% auto;
}
#wrapper.cbt-testflight .flow ol li:nth-child(4) .ttl p {
	background: url(../img/cbt_testflight_step4.svg) no-repeat center center;
	background-size: 100% auto;
}
#wrapper.cbt-testflight .flow ol li p.link a{
	position: relative;
	display: block;
	width: 100%;
	margin: 20px 0 0 0;
	padding: 10px 20px 10px 10px;
	background: #fff;
	border-radius: 5px;
	color: #205f13;
	font-size: 81.25%;
	box-sizing: border-box;
	transition: all 0.2s ease;
	-webkit-transition: all 0.2s ease;
}
#wrapper.cbt-testflight .flow ol li p.link a:hover {
	background: #205f13;
	color: #fff;
}
#wrapper.cbt-testflight .flow ol li p.link a:after {
	position: absolute;
	content:"";
	display: block;
	width: 10px;
	height: 15px;
	top: 50%;
	right: 10px;
	margin: -7px 0 0 0;
	background: url(../img/link_arrow_green.svg) no-repeat;
	background-size: 10px 15px;
}
#wrapper.cbt-testflight .flow ol li p.link a:hover:after {
	background: url(../img/link_arrow_white.svg) no-repeat;
	background-size: 10px 15px;
}
#wrapper.cbt-testflight .flow ol li p.thumb {
	text-align: center;
}
#wrapper.cbt-testflight .flow ol li p.thumb img {
	vertical-align: bottom;
}
#wrapper.cbt-testflight .flow ol li p.thumb.ss img {
	width: 150px;
}
#wrapper.cbt-testflight .flow ol li p.thumb.icon img {
	border-radius: 25px;
}

#wrapper.terms .common-header {
	z-index: 110;
}
#pawa-terms {
	text-shadow: 0 0 5px #000;
}
#pawa-terms .main-ttl {
	padding: 0 20px;
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.3)));
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 100%);
}
#pawa-terms .main-ttl h1 {
	padding: 40px 0;
	font-size: 150%;
	line-height: 1.2;
	font-weight: bold;
}
#pawa-terms .main-ttl p.lead {
	font-size: 75%;
}
#pawa-terms .terms-detail {
	padding: 0 20px;
	background: rgba(0, 0, 0, 0.3);
	font-size: 75%;
}
#pawa-terms .terms-detail-inner {
	padding: 30px 0 0;
}
#pawa-terms .terms-detail .ttl {
	padding: 0 0 10px;
}
#pawa-terms .terms-detail-inner p {
	padding: 0 0 10px;
}
#pawa-terms .terms-detail ul li {
	position: relative;
	padding: 0 0 4px 2.5em;
}
#pawa-terms .terms-detail ul li span {
	left: 0;
	position: absolute;
}
#pawa-terms .terms-detail-inner p.last-text {
	padding: 10px 0;
	text-align: right;
}

/*----------------------------------------------------------------------------------------------------------------*/


@media screen and (min-width:300px) and ( max-width:768px) {
	#wrapper .common-menu {
		animation:footermenuanime 2.7s ease 1;
		-webkit-animation:footermenuanime 2.7s ease 1;
	}
	@keyframes footermenuanime {
		0% {
			bottom: -100px;
		}
		70% {
			bottom: -100px;
		}
		100% {
			bottom: 0;
		}
	}
	@-webkit-keyframes footermenuanime {
		0% {
			bottom: -100px;
		}
		80% {
			bottom: -100px;
		}
		100% {
			bottom: 0;
		}
	}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:455px) {
	#wrapper.index .main-ttl .news-area .ttl h2 {
		margin: 1px 0 0 0;
		width: 100px;
		height: 28px;
	}
	#wrapper.index .app-info .ttl h3 {
		margin: 0 0 20px;
	}
	#wrapper.index .app-info .detail ul li a img {
		height: 305px;
		width: 178px;
	}
	#wrapper .app-base-data .ttl h4 {
		width: 300px;
		height: 32px;
		background-size: 300px auto;
	}
	#wrapper .app-base-data .detail .app-data-list li dl {
		width: 330px;
		font-size: 87.5%;
	}
	#wrapper .app-base-data .detail .app-data-list li:first-child dt {
		padding: 30px 16px 20px 0;
	}
	#wrapper .app-base-data .detail .app-data-list li dt {
		width: 60px;
		padding: 0 16px 20px 0;
	}
	#wrapper .app-base-data .detail .app-data-list li:last-child dt {
		padding: 0 16px 30px 0;
	}
	#wrapper .app-base-data .detail .app-data-list li dd {
		padding: 0 0 0 16px;
	}
	#wrapper .app-base-data ol.sns-link li a {
		border-radius: 28px;
		margin: 0 2px;
	}
	#wrapper .app-base-data ol.sns-link li a img {
		width: 42px;
		height: 42px;
	}
	#wrapper.chara .main-ttl .detail h2 img {
		height: 24px;
	}
	#wrapper.chara .main-ttl .detail p.lead {
		font-size: 87.5%;
	}
	#wrapper.about .game-detail p.lead {
		font-size: 87.5%;
	}
	#wrapper.about .game-detail .game-detail-inner.about-success,
	#wrapper.about .game-detail .game-detail-inner.about-stadium{
		padding: 40px 20px 20px;
	}
	#wrapper.about .game-detail .sub-ttl {
		padding: 20px 0;
	}
	#wrapper.about #success .sub-ttl h2 {
		width: 200px;
		height: 32px;
	}
	#wrapper.about #stadium .sub-ttl h2 {
		height: 32px;
		width: 220px;
	}
	#wrapper.about .game-detail .sub-ttl h2:before {
		height: 96px;
		width: 79px;
		margin: -50px 0 0 -86px;
	}
	#wrapper.about #stadium .sub-ttl h2:before {
		margin: -50px 0 0 -85px;
	}
	#wrapper.about .game-detail .sub-ttl h2:after {
		height: 96px;
		width: 49px;
		margin: -48px 0 0 210px;
	}
	#wrapper.about #stadium .sub-ttl h2:after {
		margin: -48px 0 0 225px;
	}
	#wrapper.cbt-thanks .thanks .thanks-inner .thanks-msg p.lead,
	#wrapper.cbt-finish .main-ttl p.lead{
		font-size: 87.5%;
	}
	#wrapper.cbt-thanks .thanks-footer {
		padding: 30px 0 0 0;
	}
	#wrapper.cbt-thanks .thanks-footer .sne-share {
		padding: 20px 0;
	}
	#wrapper.cbt-thanks .thanks-footer .sne-share .sne-share-detail {
		width: 450px;
		padding: 0 0 0 220px;
	}
	#wrapper.cbt-thanks .thanks-footer .sne-share p.yabe img {
		width: 200px;
	}
	#wrapper.cbt-thanks .thanks-footer .sne-share p.yabe:after {
		height: 250%;
	}
	#wrapper.cbt-thanks .thanks-footer ul li img {
		width: 35px;
		height: 35px;
	}
	#wrapper.cbt-thanks .thanks-footer .page-back p,
	#wrapper.cbt-finish .page-back p{
		padding: 50px 0 0;
	}
	#wrapper.cbt-thanks .thanks-footer .page-back p a,
	#wrapper.cbt-finish .page-back p a{
		padding: 10px 50px;
	}
	#wrapper.cbt-thanks .thanks-footer .page-back p a:hover,
	#wrapper.cbt-finish .page-back p a:hover{
		padding: 10px 70px;
	}
	#wrapper.cbt-thanks .thanks-footer .page-back p a span,
	#wrapper.cbt-finish .page-back p a span{
		width: 120px;
		height: 21px;
	}
	#wrapper.cbt-testflight .howto p.lead,
	#wrapper.cbt-testflight .howto .detail .attend-list dl,
	#wrapper.cbt-testflight .flow ol li .ttl h3{
		font-size: 87.5%;
	}
	#wrapper.cbt-testflight .flow ol li .ttl p {
		width: 45px;
		height: 84px;
	}
	#wrapper.cbt-testflight .flow ol li p.thumb.ss img {
		width: 200px;
	}
	#wrapper.cbt-testflight .flow ol li p.thumb.icon {
		padding: 100px 0 0 0;
	}
	#wrapper.cbt-testflight .flow ol li p.link a {
		width: 300px;
		margin: 30px auto 0;
	}
	#pawa-terms .main-ttl p.lead,
	#pawa-terms .terms-detail {
		font-size: 87.5%;
	}
	#wrapper.chara .tips img.img_hints{
		width:240px;
	}
	#wrapper.chara .tips.col-2 .col-2-img {
    	width: 40%;
    	float: left;
	}
	#wrapper.chara .tips.col-2 .col-2-img.first {
	   	margin: 0 0 38px 50px;
	}
	#wrapper.chara .tips.col-2 .col-2-img.second {
	   	margin: 0 0 20px 12px;
	}

}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:490px) {
	#wrapper .betatest-info .ttl {
		padding: 25px 0 25px 100px;
	}
	#wrapper .betatest-info .ttl h4 {
		height: 23px;
		background: url(../img/betatest_info_ttl_text_1line.svg) no-repeat;
		background-size: auto 23px;
	}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:550px) {
	#wrapper.chara .main-ttl h1 {
		width: 490px;
		padding: 460px 0 0 0;
	}
	#wrapper.chara .main-ttl .detail {
		width: 490px;
	}
	#wrapper.chara .main-ttl .detail p.lead {
		font-size: 100%;/*93.75%*/
	}
	#wrapper.chara .profile ul {
		width: 490px;
		margin: 0 auto;
		padding: 0;
	}
	#wrapper.chara .profile ul li dl {
		padding: 10px 20px 0 20px;
	}
	#wrapper.chara .character-inner.with-sp-skill .profile ul li dl {
		padding: 0 20px;
	}
	#wrapper.chara .character-inner.with-sp-skill .profile .sp-skill span {
		display: inline;
	}
	#wrapper.chara .character-inner.with-sp-skill .profile .sp-skill span.skill-detail{
		text-align: left;
		display: block;		
	}
	#wrapper.chara .profile ul li .description {
		clear: none;
		float: left;
		width: 60%;
		padding: 0 20px;
		opacity: 0;
	}
	#wrapper.chara .profile ul li:nth-child(even) .description {
		float: right;
	}
	#wrapper.chara .profile ul li.on:nth-child(odd) .description {
		animation:characterMainRAnime .7s ease .3s 1 forwards;
		-webkit-animation:characterMainRAnime .7s ease .3s 1 forwards;
	}
	#wrapper.chara .profile ul li.on:nth-child(even) .description {
		animation:characterMainLAnime .7s ease .3s 1 forwards;
		-webkit-animation:characterMainLAnime .7s ease .3s 1 forwards;
	}
	#wrapper.about .main-ttl .topic .topic-stadium dl dd {
		margin: -42px 0 0 0;
	}
	#wrapper.about .main-ttl .topic {
		width: 490px;
		margin: -30px auto 0;
		padding: 400px 0 0 0;
	}
	#wrapper.about .main-ttl .topic dl dd a {
		padding: 13px 20px 13px 10px;
		font-size: 100%;
		line-height: 1;
	}
	#wrapper.about .game-detail p.lead {
		font-size: 100%;
	}
	#wrapper.about .game-detail .game-detail-inner {
		width: 490px;
		margin: 0 auto;
		padding: 30px 0;
	}
	#wrapper.about .game-detail .sub-ttl {
		padding: 25px 0;
	}
	#wrapper.about #success .sub-ttl h2 {
		width: 250px;
		height: 38px;
	}
	#wrapper.about #stadium .sub-ttl h2 {
		width: 280px;
		height: 37px;
	}
	#wrapper.about .game-detail .sub-ttl h2:before {
		height: 120px;
		width: 99px;
		margin: -60px 0 0 -105px;
	}
	#wrapper.about #stadium .sub-ttl h2:before {
		margin: -60px 0 0 -110px;
	}
	#wrapper.about .game-detail .sub-ttl h2:after {
		height: 120px;
		width: 61px;
		margin: -58px 0 0 260px;
	}
	#wrapper.about #stadium .sub-ttl h2:after {
		margin: -58px 0 0 285px;
	}
	#wrapper.about .game-detail .about-story {
		padding: 0 0 30px;
	}
	#wrapper.about .game-detail .about-story .game-detail-text .game-detail-text-inner {
		padding: 30px 0;
		width: 490px;
		margin: 0 auto;
	}
	#wrapper.about .game-detail .about-story .story-img {
		padding: 25% 0 0 0;
	}
	#wrapper.cbt-thanks .thanks .thanks-inner .thanks-inner-detail {
		width: 550px;
		margin: 0 auto;
		padding: 410px 20px 30px;
		box-sizing: border-box;
	}
	#wrapper.cbt-thanks .thanks .thanks-inner .thanks-msg p.lead,
	#wrapper.cbt-finish .main-ttl p.lead{
		font-size: 100%;
	}
	#wrapper.cbt-testflight .howto p.lead,
	#wrapper.cbt-testflight .flow ol li .ttl h3{
		font-size: 100%;
	}
	#wrapper.cbt-testflight .flow ol li .ttl h3 span {
		font-size: 11px;
		white-space: nowrap;
	}
	#wrapper.cbt-testflight .howto .main-ttl {
		margin: 55px 0;
		padding: 20px 20px 20px 28%;
	}
	#wrapper.cbt-testflight .flow .flow-ttl {
		padding: 35px 0;
	}
	#wrapper.cbt-testflight .flow .flow-ttl h2:after {
		width: 88px;
		right: -110px;
		top: -110px;
	}
	#pawa-terms .main-ttl p.lead,
	#pawa-terms .terms-detail {
		font-size: 100%;
	}
	.pre-index .lead.iniesta .inner p.tips-caution img{
	width:auto;
	}
	#wrapper.chara.collabo-shoot div.reproduce p,
	#wrapper.chara.collabo-shoot div.rival p
	 {
	    width: 500px;
	    margin: 0 auto 10px;
	}
	#wrapper.chara.collabo-shoot div.reproduce {
    	height: 444px;
    	width: 95%;
    	margin: 0 auto;
    	font-size: 85%;
    	text-align: center;
    	background-image: url(../img/success/05/reproduce-scene-pc.png);
    	background-position: 50% 41px;
    	background-size: 544px auto;
    	background-repeat: no-repeat;
	}
	#wrapper.chara .profile div.rival {
    	height: 339px;
    	width: 95%;
    	margin: 0 auto;
    	font-size: 85%;
    	text-align: center;
    	background-image: url(../img/success/05/rival-pc.png);
    	background-position: 50% 52px;
    	background-size: 515px auto;
    	background-repeat: no-repeat;
	}
	#wrapper.chara .profile ul li .image.fcb {
	    height: 314px;
	}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:620px) {
	#wrapper .betatest-info .ttl {
		padding: 20px 0 20px 120px;
	}
	#wrapper .betatest-info .ttl h4:before {
		width: 110px;
		height: 136px;
		background-size: 110px auto;
		top: 75px;
		left: -4px;
	}
	#wrapper .betatest-info .ttl h4:after {
		content:"";
		position: absolute;
		width: 55px;
		height: 55px;
		display: block;
		right: 10px;
		top: -20px;
		background: url(../img/betatest_info_ball.png) no-repeat;
		background-size: 55px auto;
	}
	#wrapper .betatest-info .detail {
		padding: 0 0 0 120px;
	}
	#wrapper .betatest-info .detail dl dd a {
		box-sizing: border-box;
		max-width: 514px;
	}
	
	#wrapper.cbt-finish .main-ttl h1 {
		padding: 35% 0 0;
	}
	#wrapper.chara.collabo-shoot section.contents .about{
	    width: 100%;
	    padding: 18px 0;
	    background-color: #fe0000;
	    background-image: url(../img/success/05/bg-about.jpg);
	    background-repeat: no-repeat;
	    background-position: 50% 50%;
	    background-size: 1133px;
	    text-align: center;
	}

}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:685px) {
	#wrapper .betatest-info .betatest-info-in {
		width: 650px;
		margin: 0 auto;
	}
	#wrapper.cbt-finish .main-ttl {
		max-width: 790px;
	}
	#wrapper.cbt-finish .main-ttl h1 {
		padding: 10% 0 0 0;
		background: url(../img/cbt_finish_main_ttl_text_2line.svg) no-repeat;
		background-size: 100% auto;
	}
	#wrapper.cbt-finish.pre .main-ttl h1 {
		padding: 12% 0 0 0;
		background: url(../img/pre_finish_main_ttl_text_2line.svg) no-repeat;
		background-size: 100% auto;
	}
	#wrapper.cbt-finish .main-ttl .main-chara {
		padding: 410px 0 0 0;
	}
	#wrapper.cbt-finish .main-ttl p.lead {
		text-align: center;
	}
	#wrapper.cbt-finish.pre .main-ttl p.lead span{
		display: block;
	}
	#wrapper.cbt-testflight .howto .main-ttl {
		padding: 25px 25px 25px 195px;
	}
	#wrapper.cbt-testflight .howto .main-ttl .main-ttl-inner:after {
		margin: -100px 0 0 0;
	}
	#wrapper.cbt-testflight .howto .main-ttl h1 {
		padding: 10% 0 0;
		background: url(../img/cbt_testflight_title_txt_pc.svg) no-repeat center center;
		background-size: 100% auto;
	}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:768px) {
	#wrapper.index .common-header {
		animation:indexCommonHeaderAnime 1s ease 1s 1;
		-webkit-animation:indexCommonHeaderAnime 1s ease 1s 1;
		animation-fill-mode: both;
		-webkit-animation-fill-mode: both;
	}
	#wrapper.about .common-header,
	#wrapper.chara .common-header,
	#wrapper.pre-index .common-header{
		z-index: 110;
	}
	.common-header .konami-logo a {
		position: absolute;
		display: block;
		padding: 10px 10px 14px;
		z-index: 50;
		left: 0;
		top: 0;
	}
	.common-header .konami-logo a img {
		width: 100px;
		vertical-align: middle;
	}
	.common-header {
		height: 44px;
		animation: none;
		-webkit-animation: none;
	}
	.common-header ul {
		padding: 7px 10px 0 0;
	}
	.common-header ul li a img {
		width: 30px;
		height: 30px;
		border-radius: 4px;
	}
	/*index*/
	#wrapper.index .main-ttl {
		margin: -44px 0 0 0;
	}
	#wrapper.index .main-ttl .main-visual {
		padding: 60% 0 0 0;
	}
	#wrapper.index .main-ttl .main-visual-in .chara-bg {
		max-width: 917px;
		max-height: 530px;
		margin: 0 auto;
		top:51px;
		animation:indexCharaBgAnime 1.5s cubic-bezier(0.13, 0.9, 0.49, 0.97) 1;
		animation:indexCharaBgAnime 1.5s ease 1;
		-webkit-animation:indexCharaBgAnime 1.5s ease 1;
		/*-webkit-animation:indexCharaBgAnime 1.5s cubic-bezier(0.13, 0.9, 0.49, 0.97) 1;シュート*/

	}
	#wrapper.index .main-ttl .main-visual-in .pawasakakun {
		height: 70%;
		top:-5px;
		left: 28%;
		transform: translateX(-3%);
		animation:indexPawasakaAnime 1.2s ease 1;
		-webkit-animation:indexPawasakaAnime 1.2s ease 1;
	}
	#wrapper.index .main-ttl .main-visual-in .ball {
		width: 21%;
		height: 67%;
		right: 23%;
		top: -9%;
		animation:indexBallAnime 1s ease 1;
		-webkit-animation:indexBallAnime 1s ease 1;
	}
	#wrapper.index .main-ttl .main-visual-in .dlcount {
		width: 24%;
    	height: 14%;
    	top: 62%;
    	left: 48%;
    	background-image: url(../img/txt_dlcount_pc.png?v8);
    	z-index: 580;
	}
	/*シュート#wrapper.index .main-ttl .main-visual-in .dlcount {
    	width: 25.52%;
    	height: 26%;
    	top: 58%;
    	left: 70%;
    	background-image: url(../img/txt_dlcount_pc.png?v6);
    	z-index: 1;
	}*/
	#wrapper.index .main-ttl .main-visual h1 {
/*		width: 43%;
		max-width: 545px;
		margin: -16% auto 0;
		padding: 18% 0 0 0;*/

		width: 37%;
    	max-width: 545px;
		margin: -17% auto 14px;
    	padding: 20% 0 0 0;

		animation:indexPawaLogoAnime 1s ease 1;
		-webkit-animation:indexPawaLogoAnime 1s ease 1;
	}
	@keyframes indexPawaLogoAnime {
		0% {
			transform: translate(0,200px);
			opacity: 0;
		}
		60% {
			transform: translate(0,200px);
			opacity: 0;
		}
		100% {
			transform: translate(0,0);
			opacity: 1;
		}
	}
	@keyframes indexPawasakaAnime {
		0% {
			margin-top: 100px;
			opacity: 0;
		}
		40% {
			margin-top: 100px;
			opacity: 0;
			transform:scale(0.8,0.8) translateX(-3%);
		}
		65% {
			margin-top: -10px;
			transform:scale(1.2,1.2) translateX(-3%);
		}
		100% {
			margin-top: 0;
			opacity: 1;
			transform:scale(1,1) translateX(-3%);
		}
	}
/*通常時	@keyframes indexCharaBgAnime {
		0% {
			opacity: 0;
		}
		20% {
			margin-top: -100px;
			opacity: 0;
			transform:scale(0.8,0.7);
		}
		63% {
			margin-top: 20px;
			transform:scale(1.1,1);
		}
		80% {
			margin-top: 0;
			transform:scale(1,1);
		}
		100% {
			margin-top: 0;
			opacity: 1;
		}
	}*/
	@keyframes indexCharaBgAnime {
		0% {
			opacity: 0;
		}
		20% {

			opacity: 0;
			transform:scale(0.8,0.8) translateY(100px);
		}
		63% {

			transform:scale(1,1);
		}
		80% {
			transform:scale(1,1);
		}
		100% {
			opacity: 1;
		}
	}
	@keyframes indexBallAnime {
		0% {
			opacity: 0;
		}
		57% {
			opacity: 0;
			transform:scale(0,0) translate(-600px,600px);
		}
		90% {
			transform:scale(1,1) translate(0,0);
		}
		100% {
			opacity: 1;
			transform:scale(1,1) translate(0,0);
		}
	}
	@keyframes indexCommonHeaderAnime {
		0% {
			opacity: 0;
			transform: translate(0,-44px);
		}
		100% {
			opacity: 1;
			transform: translate(0,0);
		}
	}
	@-webkit-keyframes indexPawaLogoAnime {
		0% {
			transform: translate(-25px,200px);
			opacity: 0;
		}
		100% {
			transform: translate(-25px,0);
			opacity: 1;
		}
	}
	@-webkit-keyframes indexPawasakaAnime {
		0% {
			margin-top: 100px;
			opacity: 0;
		}
		20% {
			margin-top: 100px;
			opacity: 0;
			transform:scale(0.8,0.8) translateX(-40px);
		}
		50% {
			margin-top: -10px;
			transform:scale(1.2,1.2) translateX(-40px);
		}
		65% {
			margin-top: 0;
			opacity: 1;
			transform:scale(1,1) translateX(-40px);
		}
		100% {
			margin-top: 0;
		}
	}
/*通常時	@-webkit-keyframes indexCharaBgAnime {
		0% {
			opacity: 0;
		}
		20% {
			margin-top: -100px;
			opacity: 0;
			transform:scale(0.8,0.7);
		}
		63% {
			margin-top: 20px;
			transform:scale(1.1,1);
		}
		80% {
			margin-top: 0;
			transform:scale(1,1);
		}
		100% {
			margin-top: 0;
			opacity: 1;
		}
	}*/
		@-webkit-keyframes indexCharaBgAnime {
		0% {
			opacity: 0;
		}
		20% {
			opacity: 0;
			transform:scale(0.8,0.8) translateY(100px);
		}
		63% {
			transform:scale(1,1);
		}
		80% {
			transform:scale(1,1);
		}
		100% {
			opacity: 1;
		}
	}
	@-webkit-keyframes indexBallAnime {
		0% {
			opacity: 0;
		}
		57% {
			opacity: 0;
			transform:scale(0,0) translate(-1000px,1000px);
		}
		90% {
			transform:scale(1,1) translate(0,0);
		}
		100% {
			opacity: 1;
			transform:scale(1,1) translate(0,0);
		}
	}
	@-webkit-keyframes indexCommonHeaderAnime {
		0% {
			opacity: 0;
			transform: translate(0,-44px);
		}
		100% {
			opacity: 1;
			transform: translate(0,0);
		}
	}
	#wrapper.index .main-ttl .main-ttl-in {
		position: relative;
		overflow: hidden;
		max-width: 900px;
		margin: 0 auto 30px;
        z-index: 10;
	}
	#wrapper.index .important-notice a {
		padding: 8px;
		font-size: 112.5%;
	}
	#wrapper.index .main-ttl .download,
	#wrapper.index .main-ttl .official-account,
	#wrapper.index .main-ttl .notice-cesa,
	#wrapper.index .main-ttl .pre-bnr,
	#wrapper.index .main-ttl .news-area {
		float: left;
		width: 50%;
	}
	#wrapper.index .download dl dt,
	#wrapper.index .device a {
		font-size: 87.5%;
	}

	.app-base-data .download{
    	width: 440px;
    	margin: 0 auto 30px;
	}
	.app-base-data .download dl dt,
	.app-base-data .device a {
		font-size: 87.5%;
	}

	#wrapper.index .main-ttl .news-area {
		padding: 10px 10px 0;
	}
	#wrapper.index .main-ttl .left-wrapper {
		float: left;
		padding: 0 10px 0 0;
		width: 50%;
		box-sizing: border-box;
	}
	#wrapper.index .main-ttl .movie-area a {
		border-width: 12px;
	}
	#wrapper.pre-index .movie-area.iniesta {
		padding: 0 10px;
		margin: 20px auto;
		display: table;
		border-collapse: separate;
		border-spacing: 10px 5px;
		max-width: 980px;
	    /*background: rgba(0,0,0,0.3);*/
	}
	#wrapper.pre-index .movie-area a {
    	border-width: 12px;
    	display: table-cell;
	}
	#wrapper.pre-index .movie-area-iniesta-wrap{
	    background: rgba(26, 196, 206, 0.3);
	    padding: 31px 0 20px;
	}
	#wrapper.index .main-ttl .news-area .ttl {
		/* margin: 0 0 -15px; */
	}
	#wrapper.index .main-ttl .news-area .ttl h2 {
		margin: -1px 0 0 10px;
		width: 107px;
		height: 30px;
	}
	#wrapper.index .main-ttl .news-area .ttl ul {
		padding: 0 10px 0 0;
	}
	#wrapper.index .main-ttl .news-area .news-detail {
		padding: 27px 10px 17px 10px;
		background: rgba(11,67,0,.7);
	}
	#wrapper.index .main-ttl .news-area .news-detail ul {
		height: 350px;
	}
	#wrapper.index .main-ttl .news-area .news-detail dl {
		display: table;
	}
	#wrapper.index .main-ttl .news-area .news-detail dl dt {
		display: table-cell;
		padding: 5px 0 0 0;
		background: none;
		color: #fff;
		font-size: 75%;
	}
	#wrapper.index .main-ttl .news-area .news-detail dl+dl dt {
		color: transparent;
	}
	#wrapper.index .main-ttl .news-area .news-detail dl .tag {
		display: table-cell;
		font-size: 50%;
	}
	#wrapper.index .main-ttl .news-area .news-detail dl .tag span {
		padding: 2px;
	}
	#wrapper.index .main-ttl .news-area .news-detail dl dd {
		display: table-cell;
		padding: 5px 4px 0;
	}
	#wrapper.index .main-ttl .news-area .news-detail dl dd {
		margin: 0 0 10px;
		border:none;
	}
	#wrapper.index .main-ttl .news-area .news-detail dl dd span,
	#wrapper.index .main-ttl .news-area .news-detail dl dd a {
		display: inline;
		padding: 0;
	}
	#wrapper.index .main-ttl .news-area .news-detail dl dd a {
		text-decoration: underline;
	}
	#wrapper.index .main-ttl .news-area .news-detail dl dd a:hover {
		text-decoration: none;
	}
	#wrapper.index .main-ttl .news-area .news-detail dl dd a:after {
		background: none;
	}
	#wrapper.index .main-ttl .news-area .news-chara {
		display: block;
		margin: -20% 0 0 0;
		text-align: center;
	}
	#wrapper.index .main-ttl .news-area .news-chara img {
		width: 100%;
		max-width: 406px;
		vertical-align: bottom;
	}
	#wrapper.index .common-menu {
		background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #236716), color-stop(0.00, #1fa505));
		background: -webkit-linear-gradient(#1fa505, #236716);
		background: linear-gradient(#1fa505, #236716);
	}
	#wrapper.index .app-info .ttl {
		background: none;
	}
	#wrapper.index .app-info .ttl h3 {
		height: 28px;
		background-size: auto 28px;
	}
	#wrapper.index .app-info .ttl .yabe p {
		bottom: -27px;
	}
	.pc #wrapper.index .app-info .ttl .yabe p:before,
	#wrapper.index .app-info .ttl .yabe p:before{
		width: 224px;
		height: 66px;
		background-size: 224px auto;
		right: 88px;
		bottom: 34px;
	}
	#wrapper.index .app-info .ttl .yabe p img {
		width: 100px;
		position: relative;
		z-index: 10;
	}
	#wrapper.index .app-info .detail {
		padding: 0 0 50px 10px;
	}
	#wrapper.index .app-info .detail ul {
		display: table;
		width: 100%;
	}
	#wrapper.index .app-info .detail ul li {
		display: table-cell;
		width: 20%;
		box-sizing: border-box;
		padding: 0 10px 0 0;
	}
	#wrapper.index .app-info .detail ul li a {
		display: block;
		overflow: hidden;
		position: relative;
		padding: 171% 0 0;
	}
	#wrapper.index .app-info .detail ul li a img {
		position: absolute;
		top: 0;
		height: auto;
		max-width: 100%;
		width: 100%;
		transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		backface-visibility: hidden;
		-webkit-backface-visibility: hidden;
	}
	#wrapper.index .app-info .detail ul li a img:hover {
		transform: scale(1.1);
		opacity: 0.8;
	}
	#wrapper .main-ttl .ttl p.logo {
		display: none;
	}
	#wrapper .betatest-info {
		padding: 0;
	}
	#wrapper .betatest-info .betatest-info-in {
		padding: 40px 40px 40px 20px;
		background: #ff5171;
	}
	#wrapper .betatest-info .ttl {
		padding: 0 0 20px 180px;
	}
	#wrapper .betatest-info .ttl h4 {
		height: 32px;
		background-size: auto 32px;
	}
	#wrapper .betatest-info .ttl h4:before {
		width: 170px;
		height: 210px;
		background-size: 170px auto;
		top: 43px;
		left: -10px;
	}
	#wrapper .betatest-info .ttl h4:after {
		width: 85px;
		height: 85px;
		right: -9%;
		top: -80px;
		background-size: 85px auto;
	}
	#wrapper .betatest-info .detail {
		padding: 0 0 0 180px;
	}
	#wrapper .betatest-info .detail dl dt {
		font-size: 87.5%;
	}
	#wrapper .betatest-info .detail dl dd a img {
		margin: 15px 0;
	}
	
	#wrapper .app-base-data {
		padding: 70px 20px;
		clear: both;
	}
	#wrapper .app-base-data .ttl {
		margin: 0 0 35px;
	}
	#wrapper .app-base-data .ttl h4 {
		width: 350px;
		height: 37px;
		background-size: 350px auto;
	}
	#wrapper .app-base-data .detail .app-data-list li dl {
		font-size: 112.5%;
		width: 400px;
	}
	#wrapper .app-base-data .detail .app-data-list li dt {
		width: 80px;
		padding: 0 22px 20px 0;
	}
	#wrapper .app-base-data .detail .app-data-list li:first-child dt {
		padding: 46px 22px 20px 0;
	}
	#wrapper .app-base-data .detail .app-data-list li:last-child dt {
		padding: 0 22px 46px 0;
	}
	#wrapper .app-base-data .detail .app-data-list li dd {
		padding: 0 0 0 22px;
		white-space: nowrap;
	}
	#wrapper .app-base-data ol.sns-link {
		margin: 50px 0 40px;
	}
	#wrapper .app-base-data ol.sns-link li {
		margin: 0 3px;
	}
	#wrapper .app-base-data ol.sns-link li a {
		border-radius: 30px;
	}
	#wrapper .app-base-data ol.sns-link li a img {
		width: 50px;
		height: 50px;
	}
	#wrapper .app-base-data footer {
		position: relative;
		padding: 0 0 0 180px;
		width: 450px;
		margin: 0 auto;
	}
	#wrapper .app-base-data footer p.bnr-pawa {
		position: absolute;
		margin: -22px 0 0 0;
		width: 188px;
		left: 0;
		top:50%;
		text-align: left;
	}
	#wrapper .app-base-data footer p.bnr-pawa a img {
		width: 160px;
	}
	#wrapper .app-base-data footer ul {
		text-align: left;
		font-size: 75%;
		white-space: nowrap;
		margin-bottom: 1em;
	}
	#wrapper .app-base-data footer p.copy {
		text-align: left;
	}
	#wrapper .common-menu {
		position: inherit;
	}
	#wrapper .common-menu ul {
		padding: 25px 0;
		display: block;
		text-align: center;
		background: none;
		white-space: nowrap;
	}
	#wrapper .common-menu ul li {
		display: inline-block;
		vertical-align: bottom;
	}
	#wrapper .common-menu ul li:last-child a {
		border: 3px solid #24910f;
	}
	#wrapper .common-menu ul li a {
		padding: 12px 20px 12px 52px;
		border-radius: 25px;
		height: 20px;
		border: 3px solid #24910f;
		background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #e3ffac), color-stop(0.00, #fff));
		background: -webkit-linear-gradient(#fff, #e3ffac);
		background: linear-gradient(#fff, #e3ffac);
		box-shadow:0 5px 0 0 #0c4900;
		-webkit-box-shadow:0 5px 0 0 #0c4900;
	}
	#wrapper .common-menu ul li a:hover,
	#wrapper .common-menu ul li.on a {
		border: 3px solid #f3e500;
		background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #fff6ac), color-stop(0.00, #fff));
		background: -webkit-linear-gradient(#fff, #fff6ac);
		background: linear-gradient(#fff, #fff6ac);
	}
	#wrapper .common-menu ul li a:before {
		content:"";
		display: block;
		height: 20px;
		width: auto;
	}
	#wrapper .common-menu ul li.top a:before {
		width: 54px;
		background: url(../img/common_menu_top_pc_text_off.svg) no-repeat;
	}
	#wrapper .common-menu ul li.top.on a:before,
	#wrapper .common-menu ul li.top a:hover:before {
		background-image: url(../img/common_menu_top_pc_text_on.svg);
	}
	#wrapper .common-menu ul li.news a:before {
		width: 90px;
		background: url(../img/common_menu_news_pc_text_off.svg) no-repeat;
	}
	#wrapper .common-menu ul li.news.on a:before,
	#wrapper .common-menu ul li.news a:hover:before {
		background: url(../img/common_menu_news_pc_text_on.svg) no-repeat;
	}
	#wrapper .common-menu ul li.about a:before {
		width: 120px;
		background: url(../img/common_menu_about_pc_text_off.svg) no-repeat;
	}
	#wrapper .common-menu ul li.about.on a:before,
	#wrapper .common-menu ul li.about a:hover:before {
		background: url(../img/common_menu_about_pc_text_on.svg) no-repeat;
	}
	#wrapper .common-menu ul li.character a:before {
		width: 120px;
		background: url(../img/common_menu_chara_pc_text_off.svg?v2) no-repeat;
	}
	#wrapper .common-menu ul li.character.on a:before,
	#wrapper .common-menu ul li.character a:hover:before{
		background: url(../img/common_menu_chara_pc_text_on.svg?v2) no-repeat;
	}
	#wrapper .common-menu ul li a:after {
		height: 62px;
		width: 52px;
		left: 0;
		top: -16px;
		margin: 0;
	}
	#wrapper .common-menu ul li.top a:after,
	#wrapper .common-menu ul li.top.on a:after{
		background: url(../img/common_menu_top_pc_icon.png) no-repeat 0 0;
		background-size: 100% auto;
	}
	#wrapper .common-menu ul li.news a:after,
	#wrapper .common-menu ul li.news.on a:after{
		background: url(../img/common_menu_news_pc_icon.png) no-repeat 0 0;
		background-size: 100% auto;
	}
	#wrapper .common-menu ul li.about a:after,
	#wrapper .common-menu ul li.about.on a:after{
		background: url(../img/common_menu_about_pc_icon.png) no-repeat 0 0;
		background-size: 100% auto;
	}
	#wrapper .common-menu ul li.character a:after,
	#wrapper .common-menu ul li.character.on a:after{
		background: url(../img/common_menu_chara_pc_icon.png) no-repeat 0 0;
		background-size: 100% auto;
	}
	#wrapper .common-menu.header {
		border-bottom: 1px solid #76c81e;
		background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #1f9f07), color-stop(0.50, #236816), color-stop(0.49, #065541), color-stop(0.00, #024a38));
		background: -webkit-linear-gradient(top, #024a38 0%, #065541 49%, #236816 50%, #1f9f07 100%);
		background: linear-gradient(to bottom, #024a38 0%, #065541 49%, #236816 50%, #1f9f07 100%);
	}
	#wrapper .common-menu.header {
		animation:commonMenuAnime 1s ease 1;
		-webkit-animation:commonMenuAnime 1s ease 1;
	}
	@keyframes commonMenuAnime {
		0% {
			opacity: 0;
			transform:translate(0,-100px);
		}
		100% {
			opacity: 1;
			transform:translate(0,0);
		}
	}
	@-webkit-keyframes commonMenuAnime {
		0% {
			opacity: 0;
			transform:translate(0,-100px);
		}
		100% {
			opacity: 1;
			transform:translate(0,0);
		}
	}
	#wrapper .common-menu.header ul {
		padding: 12px 0;
	}
	#wrapper .common-menu.header ul li {
		vertical-align: middle;
	}
	#wrapper .common-menu.header ul li.pawasaka-logo {
		display: inline-block;
	}
	#wrapper .common-menu.header ul li.pawasaka-logo a {
		padding: 0;
		width: 207px;
		height: 74px;
		background: url(../img/common_menu_pawasaka_logo.png) no-repeat;
		border:none;
		box-shadow: none;
		border-radius: 0;
	}
	#wrapper .common-menu.header ul li.pawasaka-logo a:after {
		background: none;
	}
	#wrapper.chara .scenario-list {
		animation:commonMenuAnime 1s ease 1;
		-webkit-animation:commonMenuAnime 1s ease 1;
	}
	#wrapper.chara .scenario-list .list ul li a {
		margin: 8px;
		padding: 10px 18px;
	}

	#wrapper.chara .scenario-list .list ul li a.special {
    	width: 220px;
    	margin: 0 11px 0 0;
    	padding: 0;
    	border-radius: 0px;
    	background: none;
    	border: none;
    	box-shadow: none;
	}
	#wrapper.chara .scenario-list .list ul li a span {
		height: 20px;
	}

	#wrapper.chara .scenario-list .nav p label:before,
	#wrapper.chara .scenario-list .nav p label:after {
		height: 16px;
		top: 15px;
		right: 18px;
	}
	#wrapper.chara .scenario-list .nav p label:after {
		right: 27px;
	}
	#wrapper.chara .scenario-list input:checked + .nav p label:before,
	#wrapper.chara .scenario-list input:checked + .nav p label:after {
		top: 9px;
		height: 26px;
	}
	#wrapper.chara .scenario-list .nav p label img {
		width: 220px;
		height:24px;
	}
	#wrapper.chara .main-ttl h1 {
		margin: 15px auto;
	}
	#wrapper.chara .tips.col-2 > ol > li,
	#wrapper.chara .tips.col-2 > ul > li {
	    margin: 0 0 30px;
	    width:60%;
	    float: left;
	}
	#wrapper.chara .tips.col-2 .col-2-img,
	#wrapper.chara .tips.col-2 .col-2-img{
    	width: 17%;
    	float: left;
    	max-width: 200px;
	}
	#wrapper.chara .tips.col-2 .col-2-img img,
	#wrapper.chara .tips.col-2 .col-2-img img {
	    width:100%;
	}
	#wrapper.chara .tips.col-2 .col-2-img.first,
	#wrapper.chara .tips.col-2 .col-2-img.first {
	    margin: 0 0 38px 24px;
	}
	#wrapper.about .main-ttl {
		 padding: 0 0 60px;
	}
	#wrapper.about .main-ttl .topic {
		margin: 0;
		padding: 0;
		width: 100%;
	}
	#wrapper.about .main-ttl .topic .topic-success,
	#wrapper.about .main-ttl .topic .topic-stadium {
		display: inline-block;
		vertical-align: top;
	}
	#wrapper.about .main-ttl .topic .topic-success {
		width: 52%;
		margin: 0 -30px 0 10px; 
	}
	#wrapper.about .main-ttl .topic .topic-stadium {
		width: 48%;
	}
	#wrapper.about .main-ttl .topic .topic-success p,
	#wrapper.about .main-ttl .topic .topic-stadium p{
		position: inherit;
		width: 100%;
		padding: 90% 0 0 0;
	}
	#wrapper.about .main-ttl .topic dl {
		animation:aboutTopicSuccessTextAnime 1s ease 1;
		-webkit-animation:aboutTopicSuccessTextAnime 1s ease 1;
	}
	@keyframes aboutTopicSuccessTextAnime {
		0% {
			opacity: 0;
			transform:translate(0,-200px);
		}
		100% {
			opacity: 1;
			transform:translate(0,0);
		}
	}
	@-webkit-keyframes aboutTopicSuccessTextAnime {
		0% {
			opacity: 0;
			transform:translate(0,-200px);
		}
		100% {
			opacity: 1;
			transform:translate(0,0);
		}
	}
	#wrapper.about .main-ttl .topic .topic-success dl dt {
		width: 100%;
		margin: -45px 0 0 0;
		background: url(../img/about_main_ttl_text_01.png) no-repeat;
		background-size: 100% auto;
	}
	#wrapper.about .main-ttl .topic .topic-stadium dl dt {
		padding: 18% 0 0;
		margin: -13px 0 0 0;
		display: block;
		width: 100%;
		background: url(../img/about_main_ttl_text_02.png) no-repeat;
		background-size: 100% auto;
	}
	#wrapper.about .main-ttl .topic dl dd {
		margin: 0 auto;
		padding: 0;
		width: 220px;
	}
	#wrapper.about .main-ttl .topic .topic-stadium dl dd {
		margin: 0 auto;
		width: 220px;
	}
	#wrapper.about .main-ttl .topic .topic-stadium dl dd a {
		float: none;
		width: auto;
	}
	#wrapper.cbt-testflight .howto .main-ttl {
		margin: 70px 0;
	}
	#wrapper.cbt-testflight .howto .main-ttl .main-ttl-inner {
		width: 535px;
		margin: 0 auto;
	}
	#wrapper.cbt-testflight .howto .detail {
		width: 750px;
		padding: 0 0 45px;
		margin: 0 auto;
	}
	#wrapper.cbt-testflight .howto .detail .attend-list {
		margin: 25px 0 0;
	}
	#wrapper.cbt-testflight .flow ol {
		overflow: hidden;
		padding: 0;
		width: 750px;
		margin: 40px auto 0;
	}
	#wrapper.cbt-testflight .flow ol li {
		position: relative;
		width: 366px;
		height: 615px;
		margin: 0 0 15px;
		padding: 15px 0 30px;
		display: inline-block;
		vertical-align: top;
		min-height: 410px;
		border:1px solid #fff;
	}
	#wrapper.cbt-testflight .flow ol li:nth-child(2n) {
		float: right;
	}
	#wrapper.cbt-testflight .flow ol li .ttl p {
		display: block;
		position: absolute;
		left: 0;
		top: -1px;
		width: 54px;
		height: 101px;
	}
	#wrapper.cbt-testflight .flow ol li .ttl h3 {
		padding: 0 20px 15px 70px;
	}
	#wrapper.cbt-testflight .flow ol li p.thumb.ss img {
		width: 240px;
	}
	#wrapper.cbt-testflight .flow ol li p.link {
		padding: 0 20px;
	}
	#wrapper.cbt-testflight .flow ol li p.link a {
		width: 100%;
		font-size: 100%;
		padding: 12px 20px 12px 12px;
	}
	
	#pawa-terms .terms-detail-inner,
	#pawa-terms .main-ttl h1,
	#pawa-terms .main-ttl p.lead {
		width: 728px;
		margin: 0 auto;
	}
	#pawa-terms .main-ttl h1 {
		padding: 60px 0;
		font-size: 160%;
	}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:768px) and ( max-width:975px) {
	#wrapper .common-menu.header ul li a {
		padding: 12px 14px;
	}
	#wrapper .common-menu.header ul li a:after,
	#wrapper .common-menu.header ul li.character.on a:after,
	#wrapper .common-menu.header ul li.news.on a:after,
	#wrapper .common-menu.header ul li.about.on a:after{
		background: none;
	}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:900px) {
	#wrapper.cbt-testflight .howto .detail,
	#wrapper.cbt-testflight .flow ol{
		width: 790px;
	}
	#wrapper.cbt-testflight .flow ol li {
		width: 386px;
	}
#wrapper.index .top-contents-main .top-block_left {
	width: 365px;
	top: 51%;
}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:920px) {
	#wrapper.chara .main-ttl {
		display: table;
		width: 100%;
	}
	#wrapper.chara .main-ttl .ttl {
		display: table-cell;
		vertical-align: middle;
	}
	#wrapper.chara .main-ttl .detail {
		display: table-cell;
		vertical-align: middle;
		animation:characterMainTextAnime 1s ease 1;
		-webkit-animation:characterMainTextAnime 1s ease 1;
	}
	#wrapper.chara .main-ttl .detail p.special_route_detail {
	    width: 87%;
	    padding: 11px 11px 11px 33px;
	}
	#wrapper.chara .main-ttl .detail .special_route_wrap {
	    padding: 11px 0 0px;
	}
	@keyframes characterMainTextAnime {
		0% {
			opacity: 0;
			transform:translate(200px,0);
		}
		100% {
			opacity: 1;
			transform:translate(0,0);
		}
	}
	@-webkit-keyframes characterMainTextAnime {
		0% {
			opacity: 0;
			transform:translate(200px,0);
		}
		100% {
			opacity: 1;
			transform:translate(0,0);
		}
	}
	#wrapper.chara .main-ttl .detail h2 {
		text-align: left;
		width:480px;
	}
	#wrapper.chara .main-ttl .detail h2 img {
		height: 32px;
	}
	#wrapper.chara.collabo-shoot .main-ttl .detail h2 img {
		height: 123px;
	}
	#wrapper.chara.collabo-shoot.diverge-05 .main-ttl .detail h2 img {
		height: 32px;
	}
	#wrapper.chara .main-ttl .detail p.lead {
		padding: 0 15px 0 0;
		font-size: 112.5%;
		line-height: 1.667;
	}
	#wrapper.chara .profile ul {
		width: 660px;
	}
	#wrapper.chara .profile ul li dl dt {
		padding: 20px 0 0 0;
		font-size: 225%;
	}
	#wrapper.chara .character-inner.with-sp-skill .profile.mfi ul li dl dt {
		padding: 0 0 6px 0;
		font-size: 220%;
	}
	#wrapper.chara .character-inner.with-sp-skill .profile.mfi.fcb ul li dl dt {
	    padding: 0 0 6px 0;
	    font-size: 184%;
	}
	#wrapper.chara .profile.mfi ul li dl dt {
		padding: 20px 0 6px 0;
		font-size: 220%;
	}
	#wrapper.chara .profile ul li .ruby {
		font-size: 87.5%;
	}
	#wrapper.chara .profile ul li .position,
	#wrapper.chara .profile ul li .dominant-leg {
		font-size: 100%;
	}
	#wrapper.chara .profile ul li .description {
		padding: 10px 5px 10px 20px;
		font-size: 100%;
		line-height: 1.6;
	}
	#wrapper.about .main-ttl { 
		padding: 0 0 80px;
	}
	#wrapper.about .main-ttl .topic {
		/*overflow: hidden;*/
	}
	#wrapper.about .main-ttl .topic .topic-success p {
		padding: 0;
		width: 486px;
		height: 430px;
	}
	#wrapper.about .main-ttl .topic .topic-stadium p {
		margin: 10px 0 0 0;
		padding: 0;
		width: 434px;
		height: 380px;
	}
	#wrapper.about .main-ttl .topic .topic-success dl dt,
	#wrapper.about .main-ttl .topic .topic-stadium dl dt{
		width: 490px;
		height: 85px;
		padding: 0;
		margin: -45px 0 20px;
	}
	#wrapper.about .main-ttl .topic .topic-stadium dl dt {
		margin: -5px 0 20px;
	}
	#wrapper.about .game-detail p.lead {
		font-size: 112.5%;
		line-height: 1.667;
	}
	#wrapper.about .game-detail .sub-ttl {
		padding: 28px 0;
	}
	#wrapper.about #success .sub-ttl h2 {
		width: 315px;
		height: 50px;
	}
	#wrapper.about #stadium .sub-ttl h2 {
		width: 375px;
		height: 51px;
	}
	#wrapper.about .game-detail .sub-ttl h2:before {
		height: 172px;
		width: 142px;
		margin: -86px 0 0 -160px;
	}
	#wrapper.about #stadium .sub-ttl h2:before {
		margin: -86px 0 0 -160px;
	}
	#wrapper.about .game-detail .sub-ttl h2:after {
		height: 172px;
		width: 88px;
		margin: -88px 0 0 330px;
	}
	#wrapper.about #stadium .sub-ttl h2:after {
		margin: -88px 0 0 395px;
	}
	#wrapper.about .game-detail .game-detail-inner {
		display: table;
		width: 100%;
		box-sizing: border-box;
	}
	#wrapper.about .game-detail .game-detail-inner.about-success {
		padding: 80px 20px 40px 10px;
	}
	#wrapper.about .game-detail .game-detail-inner.about-chara {
		padding: 30px 20px 30px 10px;
	}
	#wrapper.about .game-detail .game-detail-inner.about-engine {
		display: block;
		position: relative;
		padding: 0 20px 90px;
	}
	#wrapper.about .game-detail .about-engine .game-detail-img {
		position: absolute;
		right: 0;
		top:-220px;
	}
	#wrapper.about .game-detail .about-engine .game-detail-text {
		padding: 0 52% 0 0;
	}
	#wrapper.about .game-detail .game-detail-inner.about-stadium {
		padding: 100px 20px 30px 20px;
	}
	#wrapper.about .game-detail .about-stadium .game-detail-img {
		padding: 0 15px 0 0;
	}
	#wrapper.about .game-detail .game-detail-inner.about-homeandaway {
		position: relative;
		padding: 0 20px 150px;
	}
	#wrapper.about .game-detail .about-homeandaway .game-detail-img {
		position: absolute;
		right: 10px;
		top:-110px;
	}
	#wrapper.about .game-detail .about-homeandaway .game-detail-text {
		padding: 0 53% 0 0;
	}
	#wrapper.about .game-detail .game-detail-img {
		display: table-cell;
		vertical-align: middle;
		width: 50%;
		box-sizing: border-box;
	}
	#wrapper.about .game-detail .game-detail-inner.about-success h3,
	#wrapper.about .game-detail .game-detail-inner.about-chara h3 {
		margin: 20px 15px 10px 0;
	}
	#wrapper.about .game-detail .about-story {
		width:100%;
		overflow:hidden;
		padding: 0;
	}
	#wrapper.about .game-detail .about-story .game-detail-text{
		position:relative;
		width: 980px;
		height:100%;
		margin: 0 auto;
		padding:0;
	}
	#wrapper.about .game-detail .about-story .game-detail-text .game-detail-text-inner{
		width:470px;
		margin: 0;
		padding: 130px 0 131px 20px;
	}
	#wrapper.about .game-detail .about-story .story-img {
		position:absolute;
		top:0;
		left:520px;
		height: 100%;
		width:100%;
		padding:0;
		background: url(../img/about_story_img.jpg) 0 0 repeat-x;
		background-size: auto 100%;
	}
	#wrapper.cbt-thanks .thanks .thanks-inner .thanks-inner-detail {
		width: 100%;
		padding: 160px 20px 40px 370px;
	}
	#wrapper.cbt-thanks .thanks .thanks-inner .ball {
		width: 320px;
		padding: 30% 0 0;
		top:-125px;
	}
	#wrapper.cbt-thanks .thanks .thanks-inner .pawasaka {
		left: 10px;
		width: 355px;
		top:145px;
	}
	#wrapper.cbt-thanks .thanks-footer .sne-share .sne-share-detail {
		transform: translate(150px, 0);
		width: 470px;
		padding: 0 0 0 250px;
	}
	#wrapper.cbt-thanks .thanks-footer .sne-share p.yabe:after {
		width: 50%;
	}
	#wrapper.cbt-thanks .thanks-footer .page-back p,
	#wrapper.cbt-finish .page-back p{
		padding: 90px 0 0;
	}
	
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:1000px) {
	.common-header nav {
		width: 980px;
		margin: 0 auto;
		position: relative;
	}
	#wrapper.index .main-ttl .main-visual {
		padding: 570px 0 0 0;
	}
	#wrapper.index .app-info .ttl {
		width: 960px;
		margin: 0 auto;
	}
	#wrapper.index .app-info .detail {
		width: 980px;
		margin: 0 auto;
		padding: 0 0 50px;
	}
	#wrapper.index .app-info .detail ul {
		position: relative;
		padding: 10px 0 10px 10px;
		border:1px solid #318321;
		box-sizing: border-box;
	}
	#wrapper.index .app-info .detail ul li img {
		position: relative;
		z-index: 9;
	}
	#wrapper .betatest-info {
		background: url(../img/betatest_info_bg.png) #ff5171 repeat;
	}
	#wrapper .betatest-info .betatest-info-in {
		padding: 40px 220px 40px 60px;
		width: 700px;
	}
	#wrapper .betatest-info .ttl {
		padding: 0 0 20px 200px;
	}
	#wrapper .betatest-info .ttl h4:after {
		right: -150px;
		top: 0;
	}
	#wrapper .betatest-info .detail {
		padding: 0 0 0 200px;
	}
	#wrapper.about .main-ttl .topic {
		width: 980px;
		margin: 0 auto;
	}
	#wrapper.chara .main-ttl .main-ttl-inner {
		width: 980px;
		margin: 0 auto;
	}
	#wrapper.chara .main-ttl h1 {
		width: 560px;
		padding: 550px 0 0;
		margin: 15px 10px 0 -10px;
	}
	#wrapper.about .game-detail .game-detail-inner.about-success,
	#wrapper.about .game-detail .game-detail-inner.about-chara,
	#wrapper.about .game-detail .game-detail-inner.about-engine,
	#wrapper.about .game-detail .game-detail-inner.about-stadium,
	#wrapper.about .game-detail .game-detail-inner.about-homeandaway{
		width: 980px;
		margin: 0 auto;
	}
	#wrapper.about .game-detail .game-detail-inner.about-success {
		padding: 80px 0 40px 0;
	}
	#wrapper.about .game-detail .game-detail-inner.about-chara {
		padding: 30px 0 30px 0;
	}
	
	#wrapper.cbt-thanks .thanks .thanks-inner .thanks-inner-detail {
		padding: 160px 0 40px 370px;
		width: 980px;
	}
	#wrapper.cbt-thanks .thanks .thanks-inner .thanks-msg p.lead,
	#wrapper.cbt-finish .main-ttl p.lead{
		font-size: 112.5%;
		line-height: 1.667;
	}
	#wrapper.cbt-thanks .thanks .thanks-inner .thanks-msg p.lead em {
		white-space: nowrap;
	}
	
	#wrapper.cbt-testflight .howto p.lead,
	#wrapper.cbt-testflight .flow ol li .ttl h3{
		font-size: 112.5%;
		line-height: 1.667;
	}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:1046px) {
	#wrapper.index .app-info .detail ul:before {
		content:"";
		position: absolute;
		display: block;
		width: 46px;
		height: 120px;
		border:1px solid #318321;
		left: -24px;
		top:50%;
		margin: -60px 0 0 0;
	}
	#wrapper.index .app-info .detail ul:after {
		content:"";
		position: absolute;
		display: block;
		width: 46px;
		height: 120px;
		border:1px solid #318321;
		right: -24px;
		top:50%;
		margin: -60px 0 0 0;
	}
}

/*pgea-cover*/
#page-cover{
	display:none;
	position: absolute;
	top:0;
	left:0;
	width:100%;
	background-color:rgba(0,0,0,0.7);
	z-index: 9998;
}

/*popup*/
#popup{
	display:none;
	position: absolute;
	top:0;
	left:0;
	width:100%;
	z-index: 9999;
}

#popup p.close {
	text-align: right;
}
#popup p.close a {
	padding: 10px;
	display: inline-block;
}
#popup p.close a span {
	display: block;
	width: 60px;
	height: 12px;
	background: url(../img/popup_close_icon.svg) no-repeat;
	background-size:100% auto;
}
#popup .youtube-popup {
	padding: 10px 10px 20px;
	box-sizing: border-box;
}
#popup .youtube-popup .inner {
	position: relative;
	overflow: hidden;
	padding-top: 55.6%;
	height: 0;
	background: #000;
}
#popup .youtube-popup iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#popup .notice-detail {
	box-sizing: border-box;
	margin: 0 20px;
	padding: 10px 10px 20px;
	color: #444;
}
#popup .notice-detail .inner {
	position: relative;
	max-width: 500px;
	margin: 0 auto;
	padding: 20px;
	border: 3px solid #fff;
	border-radius: 8px;
	background: #fff;
	box-shadow: inset 0 0 16px rgba(123, 123, 123, 0.75);
}
#popup .notice-detail h1 {
	margin: 0 0 10px;
	font-weight: bold;
}
#popup .notice-detail h2 {
	margin: 0 0 8px;
	font-size: 87.5%;
	font-weight: bold;
}
#popup .notice-detail p {
	margin: 0 0 10px;
	font-size: 75%;
	line-height: 1.4;
}
#popup .notice-detail .btn-area {
	margin: 10px 0;
	text-align: center;
}
#popup .notice-detail .btn-area a {
	display: inline-block;
	position: relative;
	width: 70%;
	padding: 10px;
	text-align: center;
	border: 1px solid #ff2850;
	border-radius: 10px;
	background: #ff2850;
	-webkit-transition: background 4s;
	transition: background .4s;
}
#popup .notice-detail .btn-area a:after {
	position: absolute;
	content: '';
	right: 8px;
	top: 0;
	bottom: 0;
	width: 8px;
	height: 8px;
	margin: auto;
	border-top: 3px solid #fff;
	border-left: 3px solid #fff;
	-webkit-transform: rotate(135deg) translate(4px,4px);
	-ms-transform: rotate(135deg) translate(4px,4px);
	-o-transform: rotate(135deg) translate(4px,4px);
	transform: rotate(135deg) translate(4px,4px);
}
#popup .notice-detail .btn-area a:hover {
	background: #fff;
}
#popup .notice-detail .btn-area a:hover:after {
	border-color: #ff2850;
}
#popup .notice-detail .btn-area a span {
	overflow: hidden;
	display: inline-block;
	width: 50px;
	height: 0;
	padding: 20px 0 0 0;
	vertical-align: bottom;
	background: url(../img/pre/btn_close_text_white.svg) no-repeat 50% 50%;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
}
#popup .notice-detail .btn-area.close a:hover span{
	background-image: url(../img/pre/btn_close_text_pink.svg);
}
#popup .reward-popup {
	box-sizing: border-box;
	margin: 0 20px;
	padding: 10px 10px 20px;
	color: #444;
}
#popup .reward-popup .inner {
	position: relative;
	max-width: 340px;
	margin: 0 auto;
	padding: 72px 10px 10px;
	border: 3px solid #fff;
	border-radius: 8px;
	background: #fff;
	box-shadow: inset 0 0 16px rgba(123, 123, 123, 0.75);
}
#popup .reward-popup .inner:before {
	position: absolute;
	content: '';
	top: -100px;
	left: 0;
	right: 0;
	width: 148px;
	height: 180px;
	margin: 0 auto;
	background: url(../img/pre/chara-popup-sp.png) no-repeat;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	-webkit-transform: translateX(20px);
	transform: translateX(20px);
}
#popup .reward-popup .ttl {
	text-align: center;
}
#popup .reward-popup .ttl svg {
	width: 100%;
	max-width:330px;
}
#popup .reward-popup .lead {
	font-size: 87.5%;
	text-align: center;
}
#popup .reward-popup .achieve {
	margin: 10px 0;
}
#popup .reward-popup .achieve .item {
	display: table;
	width: 100%;
	max-width: 220px;
	margin: 0 auto;
}
#popup .reward-popup .achieve .item dt {
	display: table-cell;
	width: 10%;
	padding: 2px 5px 2px 0;
}
#popup .reward-popup .achieve .item dd {
	display: table-cell;
	padding: 0 5px 0 0;
	font-size: 87.5%;
	vertical-align: middle;
}
#popup .reward-popup .achieve .item dt span {
	display: block;
	width: 32px;
	height: 32px;
	padding: 2px;
	background: #ccc;
	border-radius: 6px;
}
#popup .reward-popup .achieve .item dt span img {
	width: 100%;
}
#popup .reward-popup .achieve .card {
	display: table;
	width: 100%;
	max-width: 280px;
	margin: 0 auto;
}
#popup .reward-popup .achieve .card dt {
	display: table-cell;
	vertical-align: middle;
	width: 50%;
	margin: 0 auto;
	padding: 0 10px 0 0;
}
#popup .reward-popup .achieve .card dd {
	display: table-cell;
	vertical-align: middle;
	width: 40%;
}
#popup .reward-popup .achieve .card dt img,
#popup .reward-popup .achieve .card dd img {
	width: 100%;
	vertical-align: bottom;
}
#popup .reward-popup .achieve .note {
	margin: 10px;
	padding: 10px;
	font-size: 87.5%;
	text-align: center;
	color: #ff2850;
	background: #ffe6eb;
	border-radius: 6px;
}
#popup .reward-popup .btn-area {
	margin: 10px 0;
	text-align: center;
}
#popup .reward-popup .btn-area a {
	display: inline-block;
	position: relative;
	width: 70%;
	padding: 10px;
	text-align: center;
	border: 1px solid #ff2850;
	border-radius: 10px;
	background: #ff2850;
	-webkit-transition: background .4s;
	transition: background .4s;
}
#popup .reward-popup .btn-area a:after {
	position: absolute;
	content: '';
	right: 8px;
	top: 0;
	bottom: 0;
	width: 8px;
	height: 8px;
	margin: auto;
	border-top: 3px solid #fff;
	border-left: 3px solid #fff;
	-webkit-transform: rotate(135deg) translate(4px,4px);
	-ms-transform: rotate(135deg) translate(4px,4px);
	-o-transform: rotate(135deg) translate(4px,4px);
	transform: rotate(135deg) translate(4px,4px);
}
#popup .reward-popup .btn-area a:hover {
	background: #fff;
}
#popup .reward-popup .btn-area a:hover:after {
	border-color: #ff2850;
}
#popup .reward-popup .btn-area a span {
	overflow: hidden;
	display: inline-block;
	width: 160px;
	height: 0;
	padding: 20px 0 0 0;
	vertical-align: bottom;
	background: url(../img/pre/btn_confirm_text_white.svg) no-repeat 50% 50%;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
}
#popup .reward-popup .btn-area a:hover span {
	background-image: url(../img/pre/btn_confirm_text_pink.svg);
}
#popup .reward-popup .btn-area.close a span{
	width: 50px;
	background: url(../img/pre/btn_close_text_white.svg) no-repeat 50% 50%;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
}
#popup .reward-popup .btn-area.close a:hover span{
	background-image: url(../img/pre/btn_close_text_pink.svg);
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:520px) {
	#popup .notice-detail p {
		font-size: 87.5%;
	}
	#popup p.close a span {
		display: block;
		width: 88px;
		height: 18px;
		background: url(../img/popup_close_icon.svg) no-repeat;
		background-size:100% auto;
	}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:980px) {
	#popup{
		left:50%;
		max-width: 980px;
		margin-left: -490px;
	}
	#popup .reward-popup .inner {
		min-height: 360px;
		padding: 10px 10px 10px 240px;
	}
	#popup .reward-popup .inner:before {
		top: 25px;
		left: 15px;
		right: 0;
		width: 200px;
		height: 340px;
		margin: 0;
		background-image: url(../img/pre/chara-popup-pc.png);
	}
	#popup .reward-popup .ttl {
		text-align: left;
		margin: 20px 0 10px -5px;
	}
	#popup .reward-popup .lead {
		text-align: left;
	}
	#popup .reward-popup .achieve .item {
		margin: 0;
		max-width: 350px;
	}
	#popup .reward-popup .achieve .item dt span {
		width: 50px;
		height: 50px;
	}
	#popup .reward-popup .achieve .item dt {
		padding: 2px 10px 2px 0;
	}
	#popup .reward-popup .achieve .note {
		margin: 10px 15px 10px 0;
		text-align: left;
	}
	#popup .reward-popup .btn-area {
		padding: 0 10px 0 0;
	}
	#popup .reward-popup .btn-area a {
		margin: 10px 0;
	}
	#popup .reward-popup .achieve .card {
		margin: 0;
		max-width: 290px;
	}
}

/*fullpanel*/
#fullpanel {
	position: relative;
	z-index: 1000;
}
#fullpanel-betatest {
	min-height: 100%;
	background: url(../img/main_bg.jpg) 0 -20px no-repeat #216215;
	background-size:100% auto;
}
#fullpanel-betatest header {
	position: relative;
	overflow: hidden;
	padding: 56px 37% 56px 10px;
}
#fullpanel-betatest header h3 {
	position: relative;
	padding: 35% 0 0 0;
	background: url(../img/fullpanel_betatest_logo.png) no-repeat;
	background-size:100% auto;
	z-index: 1010;
}
#fullpanel-betatest header:after {
	content:"";
	position: absolute;
	width: 45%;
	height: 100%;
	display: block;
	right: -5%;
	top: 5%;
	background: url(../img/character_msg_img.png?v2) no-repeat;
	background-size:100% auto;
}
#fullpanel-betatest header h3 span {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
#fullpanel-betatest header p.close-btn a {
	position: absolute;
	right: 10px;
	top: 10px;
	padding: 5px 5px 7px;
	width: 30px;
	height: 30px;
	background: rgba(0,0,0,0.5);
	z-index: 1015;
	border: 1px solid #fff;
	border-radius: 5px;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
#fullpanel-betatest header p.close-btn a:hover {
	background: rgba(255,51,89,0.5);
}
#fullpanel-betatest header p.close-btn a:before {
	content:"";
	display: block;
	padding: 119% 0 0 ;
	background: url(../img/fullpanel_close_btn_icon.svg) no-repeat top center;
	background-size:100% auto;
}
#fullpanel-betatest .fullpanel-wrap {
	background: #fff;
	color: #444;
}
#fullpanel-betatest .betatest-points {
	padding: 20px 15px 20px;
}
#fullpanel-betatest .ttl {
	margin: 0 0 15px;
}
#fullpanel-betatest .ttl span {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
#fullpanel-betatest .betatest-finish-msg {
	display: none;
}
#fullpanel-betatest.finish .betatest-finish-msg {
	display: block;
	padding: 20px 10px;
	background: #ff496b;
	color: #fff;
	text-align: center;
}
#fullpanel-betatest .betatest-finish-msg p {
	font-size: 87.5%;
}
#fullpanel-betatest .betatest-points .ttl h4 {
	height: 17px;
	background: url(../img/fullpanel_betatest_ttl02.svg) no-repeat;
	background-size:auto 100%;
}
#fullpanel-betatest .betatest-points .main ol li {
	margin: 0 0 15px;
}
#fullpanel-betatest .betatest-points .main ol li dl dt {
	margin: 0 0 5px;
	font-size: 87.5%;
	color: #ff496b;
}
#fullpanel-betatest .betatest-points .main ol li dl dd {
	font-size: 75%;
	line-height: 1.5;
}
#fullpanel-betatest .betatest-points .main ol li dl dd a {
	text-decoration: underline;
	color: #ff496b;
}
#fullpanel-betatest .betatest-points .main ol li dl dd a:hover {
	text-decoration: none;
}
#fullpanel-betatest .betatest-points .main ol li dl dd ul li {
	position: relative;
	padding: 0 0 0 1em;
	margin: 0 0 5px;
}
#fullpanel-betatest .betatest-points .main ol li dl dd ul li:before {
	content:"･";
	position: absolute;
	left: 0;
}
#fullpanel-betatest .betatest-regist {
	padding: 15px 0;
	background: #ededed;
}
#fullpanel-betatest .betatest-regist p {
	text-align: center;
}
#fullpanel-betatest .betatest-regist p a {
	display: inline-block;
	padding: 10px 30px;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #ff2851), color-stop(0.00, #ff5f7d));
	background: -webkit-linear-gradient(#ff5f7d, #ff2851);
	background: linear-gradient(#ff5f7d, #ff2851);
	border: 2px solid #ed046c;
	border-radius: 25px;
	box-shadow:0 5px 0 0 #cecece;
	-webkit-box-shadow:0 5px 0 0 #cecece;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
#fullpanel-betatest .betatest-regist p a:hover {
	padding: 10px 50px;
	border: 2px solid #ff73b2;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #ff2a7b), color-stop(0.00, #ff9ac2));
	background: -webkit-linear-gradient(#ff9ac2, #ff2a7b);
	background: linear-gradient(#ff9ac2, #ff2a7b);
}
#fullpanel-betatest.finish .betatest-regist {
	display: none;
}
#fullpanel-betatest .betatest-regist p a img {
	width: 80px;
	height: 20px;
	vertical-align: bottom;
}
#fullpanel-betatest .fullpanel-footer P {
	padding: 20px 0;
	text-align: center;
}
#fullpanel-betatest .fullpanel-footer P a {
	display: inline-block;
	width: 49px;
	height: 51px;
	background: url(../img/fullpanel_close_btn_icon.svg?v2) no-repeat top center;
	background-size:100% auto;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}
#fullpanel-betatest .fullpanel-footer P a:hover {
	opacity: 0.7;
}
#fullpanel-betatest .fullpanel-footer P a span {
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}

/*----------------------------------------------------------------------------------------------------------------*/

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

	#wrapper.chara .main-ttl .detail p.special_route_detail img{
	width:300px;
	}
	#fullpanel-betatest .betatest-regist p a img {
		width: 90px;
		height: 22px;
	}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:550px) {
	#fullpanel-betatest header h3 {
		padding: 40% 0 0;
	}
	#fullpanel-betatest header:after {
		top:-30px;
		height: 120%;
	}
	#fullpanel-betatest .ttl {
		margin: 0 0 20px;
	}
	#fullpanel-betatest .betatest-points .main ol li {
		margin: 0;
	}
	#fullpanel-betatest .betatest-points .main ol li dl {
		display: table;
		width: 100%;
		box-sizing: border-box;
	}
	#fullpanel-betatest .betatest-points .main ol li dl dt,
	#fullpanel-betatest .betatest-points .main ol li dl dd{
		display: table-cell;
	}
	#fullpanel-betatest .betatest-points .main ol li dl dt {
		width: 95px;
		font-size: 75%;
	}
	#fullpanel-betatest .betatest-points .main ol li dl dd {
		border-left: 1px solid #d8d8d8;
		padding: 10px 0 10px 20px;
	}
	#wrapper.chara.collabo-shoot div.bnr-magapoke {
    	width: 440px;
    	margin: 41px auto;
	}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:780px) {
	#fullpanel-betatest {
		background: url(../img/main_bg.jpg) 0 -100px no-repeat #216215;
		background-size:100% auto;
	}
	#fullpanel-betatest header {
		width: 760px;
		margin: 0 auto;
		padding: 40px 300px 40px 10px;
		box-sizing: border-box;
	}
	#fullpanel-betatest header:after {
		right: 0;
		width: 300px;
	}
	#fullpanel-betatest .fullpanel-wrap {
		width: 760px;
		margin: 0 auto;
		overflow: hidden;
		border-radius: 8px;
		-webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.5);
		box-shadow: 0 0 10px 0 rgba(0,0,0,0.5);
	}
	#fullpanel-betatest .betatest-points {
		padding: 30px 25px 20px;
	}
	#fullpanel-betatest .betatest-finish-msg p {
		font-size: 100%;
	}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:980px) {
	#fullpanel-betatest {
		background: url(../img/main_bg.jpg) 0 -250px no-repeat #216215;
		background-size:100% auto;
	}
}


/*light box*/
/* Preload images */
body:after {
	content: url(../img/ligthbox_close.svg) url(../img/ligthbox_loading.gif) url(../img/ligthbox_prev.png) url(../img/ligthbox_next.png);
	display: none;
}
.lightboxOverlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9999;
	background-color: black;
	opacity: 0.8;
	display: none;
}
.lightbox {
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 10000;
	text-align: center;
	line-height: 0;
	font-weight: normal;
}
.lightbox .lb-image {
	display: block;
	height: auto;
	max-width: inherit;
	border-radius: 3px;
}
.lightbox a img {
	border: none;
}
.lb-outerContainer {
	position: relative;
	background-color: white;
	*zoom: 1;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	border-radius: 4px;
}
.lb-outerContainer:after {
	content: "";
	display: table;
	clear: both;
}
.lb-container {
	padding: 4px;
}
.lb-loader {
	position: absolute;
	top: 43%;
	left: 0;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
.lb-cancel {
	display: block;
	width: 32px;
	height: 32px;
	margin: 0 auto;
	background: url(../img/ligthbox_loading.gif) no-repeat;
}
.lb-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
.lb-container > .nav {
	left: 0;
}
.lb-nav a {
	outline: none;
	background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}
.lb-prev, .lb-next {
	height: 100%;
	cursor: pointer;
	display: block;
}
.lb-nav a.lb-prev {
	width: 34%;
	left: 0;
	float: left;
	background: url(../img/ligthbox_prev.png) left 48% no-repeat;
	opacity: 0;
	-webkit-transition: opacity 0.6s;
	transition: opacity 0.6s;
}
.lb-nav a.lb-prev:hover {
	opacity: 1;
}
.lb-nav a.lb-next {
	width: 64%;
	right: 0;
	float: right;
	background: url(../img/ligthbox_next.png) right 48% no-repeat;
	opacity: 0;
	-webkit-transition: opacity 0.6s;
	transition: opacity 0.6s;
}
.lb-nav a.lb-next:hover {
	opacity: 1;
}
.lb-dataContainer {
	margin: 0 auto;
	padding-top: 5px;
	*zoom: 1;
}
.lb-dataContainer:after {
	content: "";
	display: table;
	clear: both;
}
.lb-data {
	padding: 0 4px;
	color: #ccc;
}
.lb-data .lb-details {
	width: 85%;
	float: left;
	text-align: left;
	line-height: 1.1em;
}
.lb-data .lb-caption {
	font-size: 13px;
	font-weight: bold;
	line-height: 1em;
}
.lb-data .lb-number {
	display: block;
	clear: left;
	padding-bottom: 1em;
	font-size: 12px;
	color: #999999;
	opacity: 0;
}
.lb-data .lb-close {
	display: block;
	float: right;
	width: 30px;
	height: 30px;
	background: url(../img/ligthbox_close.svg) top right no-repeat;
	text-align: right;
	outline: none;
	opacity: 0.7;
	-webkit-transition: opacity 0.2s;
	transition: opacity 0.2s;
}
.lb-data .lb-close:hover {
	cursor: pointer;
	opacity: 1;
}


/* 事前登録 */
.pre-index .main-image {
	max-width: 980px;
	width: 100%;
	height: 0;
	position: relative;
	margin: 0 auto;
	padding: 52% 0 0 0;
}


.pre-index .main-image.twt-iniesta-resize {
	max-width: 980px;
	width: 100%;
	height: 0;
	position: relative;
	margin: 0 auto;
	padding: 0;
}
.pre-index .main-image p {
	position: absolute;
	opacity: 0;
}
.pre-index .main-image p img {
	width: 100%;
	vertical-align: bottom;
}
.pre-index .main-image p.pawasakakun {
	width: 45%;
	top: 11%;
	left: 42%;
	-webkit-animation: appear 0.8s 0s 1;
	-o-animation: appear 0.8s 0s 1;
	animation: appear 0.8s 0s 1;
	-webkit-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
.pre-index .main-image p.iniesta {
	width: 107%;
    top: 0%;
    left: -8%;
    -webkit-animation: appear 0.6s 0s 1;
    -o-animation: appear 0.6s 0s 1;
    animation: appear 0.6s 0s 1;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    z-index: 2;
}
.pre-index .main-image p.iniesta-copy {
	width: 45%;
	top: 11%;
	left: 42%;
	-webkit-animation: appear 0.8s 0s 1;
	-o-animation: appear 0.8s 0s 1;
	animation: appear 0.8s 0s 1;
	-webkit-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}

.pre-index .iniesta-box-main p.twt-iniesta {
	width: 95%;
	margin:16px auto;
}
.pre-index .iniesta-box-main p.twt-iniesta-ttl {
	width: 95%;
	margin:0 auto;
}
.pre-index .iniesta-box-main p.twt-iniesta-yabesaka {
    width: 95%;
    margin: 0 auto 10px;
    text-align: center;
    font-size: 95%;
    text-shadow: 0 0 3px #000;
}
.pre-index .iniesta-box-main p.twt-iniesta-yabesaka span.winner {
    color: #000;
    text-align: center;
    font-size: 95%;
    font-weight: bold;
    text-shadow: 0 0 7px #fff;
}
.pre-index .iniesta-box-main p.date {
	width: 95%;
	margin:10px auto;
}
.pre-index .iniesta-box-main p.leadcopy {
	width: 95%;
	margin:10px auto;
}
.pre-index .iniesta-box-main p.twt-iniesta img {
	width: 100%;
}
.pre-index .iniesta-box-main p.twt-iniesta-ttl img {
	width: 100%;
}
.pre-index .iniesta-box-main p.twt-iniesta-yabesaka img {
	width: 100%;
}
.pre-index .iniesta-box-main p.date img {
	width: 100%;
}
.pre-index .iniesta-box-main p.leadcopy img {
	width: 100%;
}



.pre-index .main-image p.twt-iniesta-ttl {
    width: 100%;
    top: 117%;
    left: 0;
    -webkit-animation: appear 0.6s 0s 1;
    -o-animation: appear 0.6s 0s 1;
    animation: appear 0.6s 0s 1;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    z-index: 2;
}
.pre-index .main-image p.twt-iniesta-yabesaka {
    width: 100%;
    top: 179%;
    left: 0;
    -webkit-animation: appear 0.6s 0s 1;
    -o-animation: appear 0.6s 0s 1;
    animation: appear 0.6s 0s 1;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    z-index: 2;
}
.pre-index .main-image p.kassanin {
	width: 27%;
	top: 11%;
	left: 17%;
	-webkit-animation: appear 0.8s 0.5s 1;
	-o-animation: appear 0.8s 0.5s 1;
	animation: appear 0.8s 0.5s 1;
	-webkit-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
.pre-index .main-image p.yuuru {
	width: 31%;
	top: 4%;
	left: 68%;
	-webkit-animation: appear 0.8s 0.8s 1;
	-o-animation: appear 0.8s 0.8s 1;
	animation: appear 0.8s 0.8s 1;
	-webkit-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
.pre-index .main-image p.kishi {
	width: 22%;
	top: 43%;
	left: 2%;
	-webkit-animation: appear 0.8s 0.3s 1;
	-o-animation: appear 0.8s 0.3s 1;
	animation: appear 0.8s 0.3s 1;
	-webkit-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
.pre-index .main-image p.yabesaka {
	width: 28%;
	top: 5%;
	left: 1%;
	-webkit-animation: appear 0.8s 0.8s 1;
	-o-animation: appear 0.8s 0.8s 1;
	animation: appear 0.8s 0.8s 1;
	-webkit-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
@-webkit-keyframes appear {
	0% {top: 4em;}
	50% {top: 5em;}
	100% {top: 4em;}
}
@keyframes appear {
	0% {
		opacity:0;
		-webkit-transform: translateY(100px);
		transform: translateY(100px);
	}
	80% {
		opacity: 1;
		-webkit-transform: translateY(-10px);
		transform: translateY(-10px);
	}
	100% {
		opacity: 1;
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
}
.pre-index .lead {
	position: relative;
	padding: 10px;
	background: rgba(18, 63, 166, 0.8);
	z-index: 1;
}
.pre-index .lead.twtr {
    background: rgba(85, 172, 238, 0.91);
}
.pre-index .lead.iniesta {
    background: rgba(245, 37, 0, 0.82);
    margin-top: 25%;
}
#wrapper.pre-index .movie-area-iniesta-wrap {
    background: rgba(26, 196, 206, 0.3);
    padding: 31px 0 20px;
}
#wrapper.pre-index .movie-area-iniesta-wrap h3 {
    width: 77%;
    margin: 0 auto;
}
#wrapper.pre-index .movie-area-iniesta-wrap h3 img{
    width: 100%;
    margin: 0 auto;
}


.pre-index .lead > .inner {
    position: relative;
    max-width: 710px;
    margin: 0 auto;
}
.pre-index .lead.iniesta > .inner {
    max-width: 780px;
    margin: 0 auto;
    padding-top: 9%;
}
.pre-index .lead .ttl {
	display: table;
	box-sizing: border-box;
	width: 100%;
}
.pre-index .lead .ttl h1 {
	display: table-cell;
	width: 50%;
	padding: 10px;
	vertical-align: middle;
}
.pre-index .lead.iniesta .ttl h1 {
	display: block;
	width: 95%;
	padding: 10px;
	vertical-align: middle;
}
.pre-index .lead .ttl h1 img {
	width: 100%;
}
.pre-index .lead .ttl p {
	display: table-cell;
	padding: 10px;
	vertical-align: middle;
	text-align: right;
}
.pre-index .lead .ttl p a {
	display: inline-block;
	position: relative;
	width: 80%;
	padding: 5% 30px 5% 10px;
	background: #55acee;
	-webkit-transition: background .4s;
	transition: background .4s;
}
.pre-index .lead .ttl p.pre a {
	background: #123fa6;
}
.pre-index .lead .ttl p a:hover,
.pre-index .lead .ttl p.pre a:hover {
	background: #ff2850;
}
.pre-index .lead .ttl p a:after {
	position: absolute;
	content: '';
	right: 8px;
	top: 0;
	bottom: 0;
	width: 8px;
	height: 8px;
	margin: auto;
	border-top: 3px solid #fff;
	border-left: 3px solid #fff;
	-webkit-transform: rotate(135deg) translate(4px,4px);
	-ms-transform: rotate(135deg) translate(4px,4px);
	-o-transform: rotate(135deg) translate(4px,4px);
	transform: rotate(135deg) translate(4px,4px);
}
.pre-index .lead .ttl p a img {
	width: 100%;
	vertical-align: bottom;
}
.pre-index .lead dl {
	display: table;
	padding: 10px 0;
}
.pre-index .lead.iniesta dl {
	display: block;
    padding: 0;
    position: relative;
}
.pre-index .lead dl dt {
	display: table-cell;
	position: relative;
	width: 140px;
}
.pre-index .lead.twtr dl dt {
	width: 100px;
}
.pre-index .lead.iniesta dl dt {
    width: 100%;
}
.pre-index .lead dl dt > img {
	width: 125px;
	-webkit-transform: rotate(8deg);
	-ms-transform: rotate(8deg);
	-o-transform: rotate(8deg);
	transform: rotate(8deg);
}
.pre-index .lead.twtr dl dt {
	text-align: center;
}
.pre-index .lead.iniesta dl dt {
	display: block;
    text-align: center;
}
.pre-index .lead.twtr dl dt > img {
	width: 60%;
	border: 4px solid rgba(255,255,255,.3);
}
.pre-index .lead.iniesta dl dt > img {
    width: 72%;
    transform: rotate(0deg);
}
.pre-index .lead dl dt .badge {
	position: absolute;
	bottom: 0;
	right: 4px;
	width: 40px;
	height: 40px;
	padding: 8px 10px 12px 10px;
	text-align: center;
	background: #ff2850;
	border-radius: 100px;
}
.pre-index .lead dl dt .badge img {
	width: 85%;
}
.pre-index .lead dl dd {
	display: table-cell;
	font-size: 87.5%;
	vertical-align: middle;
}
.pre-index .lead.iniesta dl dd {
	display: block;
    vertical-align: middle;
    padding: 10px;
}
.pre-index .lead.iniesta p.tips {
	margin: 20px 0 7px;
	font-weight: bold;
}
.pre-index .lead.iniesta ul.tips-ul {
}
.pre-index .lead.iniesta ul.tips-ul li {
	width: 48%;
	line-height: 1.5;
	display: inline-block;
}
.pre-index .lead.iniesta ul.tips-ul li:before {
	content:"・";
}
.pre-index .lead.iniesta p.tips-caution {
	width: 84%;
	background: rgb(255, 255, 255);
	border-radius: 7px;
	color: #444;
	padding: 22px;
	text-align: center;
	margin: 12px auto 14px;
	border: 3px solid #f00;
}
.pre-index .lead.iniesta p.tips-caution  span{
	display:block;
}
.pre-index .lead.iniesta p.tips-caution  span.line-through{
	text-decoration: line-through;
	color:#f00;
}
#wrapper.chara .main-ttl .detail .special_route_wrap span.line-through{
	text-decoration: line-through;
	color:#343434;
	font-size: 105%;
}
.pre-index .lead.iniesta p.tips-caution  span.line-through span{
	color:#444;
}
.pre-index .lead.iniesta p.tips-caution  img{
	display:block;
	margin: 5px auto 0;
	width:100%;
}

.pre-index .lead.iniesta dl dd span {
	font-size: 14px;
	padding-top: 10px;
}
.pre-index .lead dl dd span {
	display: inline-block;
	vertical-align: top;
	font-size: 10px;
}
.pre-index .lead .regist {
	text-align: center;
}
.pre-index .lead .regist a {
	display: inline-block;
	position: relative;
	width: 70%;
	padding: 10px 24px 10px 6px;
	text-align: center;
	border-radius: 10px;
	background: #ff2850;
	-webkit-transition: background .4s;
	transition: background .4s;
}
.pre-index .lead .regist a:after {
	position: absolute;
	content: '';
	right: 8px;
	top: 0;
	bottom: 0;
	width: 8px;
	height: 8px;
	margin: auto;
	border-top: 3px solid #fff;
	border-left: 3px solid #fff;
	-webkit-transform: rotate(135deg) translate(4px,4px);
	-ms-transform: rotate(135deg) translate(4px,4px);
	-o-transform: rotate(135deg) translate(4px,4px);
	transform: rotate(135deg) translate(4px,4px);
}
.pre-index .lead .regist a:hover {
	background: #fff;
}
.pre-index .lead .regist a:hover:after {
	border-color: #ff2850;
}
.pre-index .lead .regist a span {
	overflow: hidden;
	display: inline-block;
	width: 120px;
	height: 0;
	padding: 20px 0 0 0;
	vertical-align: bottom;
	background: url(../img/pre/btn_registration_text_white.svg) no-repeat 50% 50%;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
}
.pre-index .lead .regist a:hover span {
	background-image: url(../img/pre/btn_registration_text_pink.svg);
}
.pre-index .lead.twtr .regist a span {
	overflow: hidden;
	display: inline-block;
	width: 95%;
	height: 0;
	padding: 9% 0 0 0;
	vertical-align: bottom;
	background: url(../img/twitter/btn_follow_sp_white.svg) no-repeat 50% 50%;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
}
.pre-index .lead.twtr .regist a:hover span {
	background-image: url(../img/twitter/btn_follow_sp_pink.svg);
}
.pre-index .lead .notice {
	padding: 15px 0 8px;
	line-height: 1.272;
	font-size: 68.75%;
}
.pre-index .reward {
	background: rgba(0, 0, 0, 0.3);
}
.pre-index .reward.iniesta {
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.3) 100%);
}
.pre-index .reward ul {
	max-width: 980px;
	margin: 0 auto;
	padding: 30px 10px 10px;
}
.pre-index .reward ul li {
	position: relative;
	margin: 0 0 30px;
	padding: 10px;
    border: 3px solid #fee901;
	border-radius: 8px;
	color: #444;
	background: #fff;
	box-shadow: inset 0 0 16px rgba(123, 123, 123, 0.75);
}
.pre-index .reward ul li.current {
	border-color: #ff2850;
	background: url(../img/pre/bg_current.png) #fff repeat;
	box-shadow: inset 0 0 16px rgba(255, 40, 80, 0.75);
	-webkit-animation: prebgAnime 2s linear infinite;
	animation: prebgAnime 2s linear infinite;
}
.pre-index .reward ul li.current.badge:after {
	content: '';
	position: absolute;
	width: 60px;
	height: 38px;
	top: 0;
	right: 0;
	background: url(../img/pre/achieved_text_pink.svg) no-repeat;
	background-size: 100% auto;
}
@keyframes prebgAnime {
	0% {
		background-position: 0 0;
		box-shadow: inset 0 0 16px rgba(255, 40, 80, 0.75);
	}
	50% {
		box-shadow: inset 0 0 25px rgba(255, 40, 80, 1);
	}
	100% {
		background-position: 0 -58px;
		box-shadow: inset 0 0 16px rgba(255, 40, 80, 0.75);
	}
}
@-webkit-keyframes prebgAnime {
	0% {
		background-position: 0 0;
		box-shadow: inset 0 0 16px rgba(255, 40, 80, 0.75);
	}
	50% {
		box-shadow: inset 0 0 25px rgba(255, 40, 80, 1);
	}
	100% {
		background-position: 0 -58px;
		box-shadow: inset 0 0 16px rgba(255, 40, 80, 0.75);
	}
}
.pre-index .reward ul li.completed {
	border-color: #c9f30c;
}
.pre-index .reward ul li.completed:after {
	content: '';
	position: absolute;
	width: 60px;
	height: 38px;
	top: 0;
	right: 0;
	background: url(../img/pre/achieved_text.svg) no-repeat;
	background-size: 100% auto;
}
.pre-index .reward ul li .yabesaka-ballon,
.pre-index .reward ul li .imakoko-ballon {
	position: absolute;
	width: 200px;
	height:57px;
	right: 0;
	top: -40px;
	background: url(../img/pre/chara_yabesaka2.png) no-repeat 100% 0;
	background-size: auto 100%;
	z-index: 1;
}
.pre-index .reward ul li .imakoko-ballon {
	background-image: url(../img/pre/chara_gk2.png);
}
.pre-index .reward ul li .yabesaka-ballon img,
.pre-index .reward ul li .imakoko-ballon img {
	display: block;
	position: absolute;
	width: 160px;
	right: 56px;
	margin: 10px 0 0 0;
	animation:fukidashianime .8s linear infinite alternate;
	-webkit-animation:fukidashianime .8s linear infinite alternate;
}
.pre-index .reward ul li .num {
	position: absolute;
	width: 60px;
	height: 40px;
	padding: 10px 0;
	top: -20px;
	left: -10px;
	background: url(../img/pre/ball_gold.png) no-repeat 50% 50%;
	-webkit-background-size: 100%;
	background-size: 100%;
}
.pre-index .reward ul li.current .num {
	background-image: url(../img/pre/ball_red.png);
}
.pre-index .reward ul li.completed .num {
	background-image: url(../img/pre/ball_green.png);
}
.pre-index .reward ul li .num span {
	position: absolute;
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	height: 0;
}
.pre-index .reward ul li .item-pack-name,
.pre-index .reward ul li .login-bonus-text{
	padding: 8px 10px 8px 30px;
	text-align: center;
}
.pre-index .reward ul li .item-pack-name svg{
	width: 90%;
	max-width: 270px;
	height: auto;
	max-height: 16px;
}
.pre-index .reward ul li .login-bonus-text svg {
	width: 90%;
	max-width: 135px;
	height: auto;
	max-height: 16px;
	text-align: left;
}
.pre-index .reward ul li .login-bonus-text.up svg {
	max-width: 260px;
}

.pre-index .reward ul li .num svg {
	width: 100%;
	height: 100%;
}
.pre-index .reward ul li.current .num svg path {
	fill: #fff;
}
.pre-index .reward ul li .item {
	display: table;
	width: 100%;
	max-width: 220px;
	margin: 0 auto;
}
.pre-index .reward ul li.disable .login-bonus-text,
.pre-index .reward ul li.disable .item {
	opacity: .3;
}
.pre-index .reward ul li .item dt {
	display: table-cell;
	width: 10%;
	padding: 2px 5px 2px 0;
}
.pre-index .reward ul li .item dd {
	display: table-cell;
	padding: 0 5px 0 0;
	font-size: 87.5%;
	vertical-align: middle;
}
.pre-index .reward ul li .item dt span {
	display: block;
	width: 32px;
	height: 32px;
	padding: 2px;
	background: #ccc;
	border-radius: 6px;
}
.pre-index .reward.twtr ul li .item dt span {
	width: 42px;
	height: 42px;
	background: transparent;
}
.pre-index .reward ul li .item dt span img {
	width: 100%;
}
.pre-index .reward ul li.current .total {
	width: 90px;
	height: 90px;
	margin: -10px auto -8px auto;
	background: url(../img/pre/pstar_total.svg) no-repeat;
	background-size: 100%;
}
.pre-index .reward ul li.current .total svg {
	width: 100%;
	height: inherit;
}
.pre-index .reward ul li .card {
	display: table;
	width: 100%;
	max-width: 360px;
	margin: 0 auto;
}
.pre-index .reward ul li .card dt {
	display: table-cell;
	vertical-align: middle;
	width: 50%;
	margin: 0 auto;
	padding: 0 10px 0 0;
}
.pre-index .reward ul li .card dd {
	display: table-cell;
	vertical-align: middle;
	width: 40%;
}
.pre-index .reward ul li .card dt img,
.pre-index .reward ul li .card dd img {
	width: 100%;
	vertical-align: bottom;
}
.pre-index .reward ul li .card dd span {
	display: block;
	margin: 5px 0 0 0;
	font-size: 68.75%;
	line-height: 1;
	color: #777;
}
.pre-index .reward ul li .note {
	margin: 10px;
	padding: 10px;
	font-size: 87.5%;
	text-align: center;
	color: #ff2850;
	background: #ffe6eb;
	border-radius: 6px;
}
.pre-index .reward .ad-reward {
	padding: 10px;
	text-align: center;
	background: rgba(18, 63, 166, 0.8);
}
.pre-index .reward .ad-reward span {
	position: absolute;
	display: block;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	height: 0;
}
.pre-index .reward .ad-reward svg {
	width: 80%;
	max-width: 420px;
	vertical-align: bottom;
}
.pre-index .reward .note {
	max-width: 900px;
	margin: -20px auto 0;
	padding: 0 10px 20px;
	font-size: 75%;
}
.pre-index .reward .regist-now {
	padding: 20px 10px;
	text-align: center;
	background: #ff2850;
}
.pre-index .reward .regist-now > .inner {
	position: relative;
	max-width: 980px;
	margin: 0 auto;
	padding: 10px;
}
.pre-index .reward .regist-now .copy img {
	width: 90%;
}
.pre-index .reward .regist-now .image {
	width: 155px;
	margin: 10px auto;
}
.pre-index .reward .regist-now .image img {
	width: 100%;
}
.pre-index .reward .regist-now .btn-area a {
	display: inline-block;
	position: relative;
	width: 70%;
	padding: 10px;
	border: 1px solid #fff;
	border-radius: 10px;
	background: #fff;
	-webkit-transition: background .4s;
	transition: background .4s;
}
.pre-index .reward .regist-now .btn-area a span {
	overflow: hidden;
	display: inline-block;
	width: 120px;
	height: 0;
	padding: 20px 0 0 0;
	vertical-align: bottom;
	background: url(../img/pre/btn_registration_text_pink.svg) no-repeat 50% 50%;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
}
.pre-index .reward .regist-now .btn-area a:after {
	position: absolute;
	content: '';
	right: 8px;
	top: 0;
	bottom: 0;
	width: 8px;
	height: 8px;
	margin: auto;
	border-top: 3px solid #ff2850;
	border-left: 3px solid #ff2850;
	-webkit-transform: rotate(135deg) translate(4px,4px);
	-ms-transform: rotate(135deg) translate(4px,4px);
	-o-transform: rotate(135deg) translate(4px,4px);
	transform: rotate(135deg) translate(4px,4px);
}
.pre-index .reward .regist-now .btn-area a:hover {
	background: #ff2850;
}
.pre-index .reward .regist-now .btn-area a:hover:after {
	border-color: #fff;
}
.pre-index .reward .regist-now .btn-area a:hover span {
	background-image: url(../img/pre/btn_registration_text_white.svg);
}
.pre-index .reward .regist-now .btn-area a img {
	width: 120px;
	vertical-align: bottom;
}
.pre-index .page-back {
	background: rgba(0, 0, 0, 0.3);
}

/*----------------------------------------------------------------------------------------------------------------*/

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

	#wrapper.chara .main-ttl .detail p.special_route_detail img{
	width:300px;
	}
	.pre-index .lead dl dt {
		width: 50%;
	}
	.pre-index .lead.twtr dl dt {
		width: 40%;
	}
	.pre-index .lead.iniesta dl dt {
		width: 100%;
	}
	.pre-index .lead dl dt > img {
		margin: 0 0 0 20px;
		width: 80%;
		transform: rotate(-8deg);
	}
	.pre-index .lead.iniesta dl dt > img {
		margin: 0 0 0 20px;
    	width: 264px;
		transform: rotate(0deg);
	}
	.pre-index .lead.twtr dl dt > img {
		margin: 0;
		border: 6px solid rgba(255,255,255,.3);
	}
	.pre-index .lead.iniesta dl dt > img {
    	margin: 0;
	}
	.pre-index .lead dl dd {
		font-size: 100%;
	}
	.pre-index .lead .regist {
		margin: -50px 0 30px;
		padding: 0 0 0 50%;
	}
	.pre-index .lead.twtr .regist {
		margin: 0;
		padding: 0;
	}
	.pre-index .reward ul li .num {
		width: 80px;
		height: 60px;
	}
	.pre-index .reward ul li .yabesaka-ballon,
	.pre-index .reward ul li .imakoko-ballon {
		height: 70px;
		top: -55px;
	}
	.pre-index .lead dl dt .badge {
		width: 60px;
		height: 60px;
		padding: 10px 13px 15px;
		border-radius: 110px;
		right: 10px;
	}
	.pre-index .reward .regist-now .image {
		width: 200px;
	}


}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:600px) {
	.pre-index .lead .ttl h1 {
		text-align: center;
	}
	.pre-index .lead .ttl h1 img {
		max-width: 320px;
	}
	.pre-index .lead.iniesta .ttl h1 img {
		max-width: 443px;
	}
	.pre-index .lead dl dd {
		padding: 0 15px 50px 0;
		font-size: 112.5%;
		line-height: 1.333;
	}
	.pre-index .lead dl dd span {
		font-size: 12px;
	}
	.pre-index .lead.iniesta dl dd span {
		font-size: 18px;
		padding-top: 10px;
	}
	.pre-index .lead dl dt .badge {
		width: 80px;
		height: 80px;
		padding: 15px 19px 20px;
		bottom: -5px;
	}
	.pre-index .lead .regist {
		margin: -80px 0 40px;
	}
	.pre-index .lead .notice {
		font-size: 75%;
	}
	.pre-index .reward ul li .num {
		height: 80px;
		width: 100px;
		top: -25px;
	}
	.pre-index .reward .regist-now .image {
		margin: 20px auto;
		width: 300px;
	}
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:768px) {
	.pre-index .main-image {
		padding: 320px 0 0 0;
	}
	.pre-index .main-image.itf{
		padding:0 0 0 0;
    	height: 760px;
		width: 100%;
    	background-size: auto;
	}
	.pre-index .main-image.itf .adjust{
		position: relative;
		height:500px;
		width: 768px;
		margin:0 auto;
	}
	.pre-index .main-image.itf h3 img,
	.pre-index .main-image.itf p img{
		display: block;
	}
	.pre-index .main-image.itf img.main {
	    position: absolute;
	    top: 0px;
	    left: -127px;
	    opacity: 1;
	    width: 1036px;
	}
	.pre-index .main-image.itf h3{
		position: absolute;
    	top: 601px;
    	left: 110px;
    	width: 523px;
	}
	.pre-index .main-image.itf p{
    	position: absolute;
		top: 498px;
    	left: 0px;
    	width: 809px;
    	opacity: 1;
	}


	.link-itf-official{
		width: 100%;
		margin:0 auto;
    	height: 429px;
    	background-image:none;
    	background-image: none;
    	background: -moz-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(0,0,0,1) 38%, rgba(0,0,0,1) 73%, rgba(0,0,0,0) 100%);
    	background: -webkit-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(0,0,0,1) 38%, rgba(0,0,0,1) 73%,rgba(0,0,0,0) 100%);
    	background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,1) 38%, rgba(0,0,0,1) 73%,rgba(0,0,0,0) 100%);
	}
	.link-itf-official .adjust{
    	position: relative;
    	height: 475px;
    	width: 100%;
    	margin: 0 auto;
    	background-image: url(../img/special/itf/links-deco.png);
    	background-repeat: no-repeat;
    	background-position: 50% 0px;
    	background-size: 1115px;
	}
	.link-itf-official .adjust .chanked {
    	display: block;
    	position: relative;
    	width: 768px;
    	height: 468px;
    	margin: 0 auto;;
	}
	.link-itf-official .img-itf{
    	position: absolute;
		top: 96px;
    	left: 11px;
    	width: 408px;
	}
	.link-itf-official .text-itf{
    	position: absolute;
    	top: 158px;
    	left: 441px;
    	width: 304px;
	}




/*----------------------fcbarcelona-----------------------*/
#wrapper .common-menu.header.fcbarcelona {
    position: relative;
    z-index: 100;
    animation: commonMenuAnime 1s ease 1;
    -webkit-animation: commonMenuAnime 1s ease 1;
}
.pre-index .main-image.fcbarcelona {
    height: 682px;
}
.pre-index .main-image.fcbarcelona img.main {
    top: -66px;
    left: -135px;
    opacity: 1;
    width: 642px;
    z-index: 0;
}
.pre-index .main-image.fcbarcelona h1 {
    top: 467px;
    left: -155px;
    width: 678px;
}
.pre-index .main-image.fcbarcelona p {
    top: 555px;
    left: -21px;
    opacity: 1;
    width: 393px;
}
.link-fcbarcelona-official {
    height: 281px;
}
.link-fcbarcelona-official .img-fcbarcelona {
    top: 59px;
    left: -153px;
    width: 170px;
}
.link-fcbarcelona-official .text-fcbarcelona {
    top: 27px;
    left: 65px;
    width: 228px;
}
.link-fcbarcelona-official span {
    top: 69px;
    left: 59px;
    width: 485px;
}



	.pre-index .main-image.twt-iniesta {
		padding: 520px 0 0 0;
	}

	.pre-index .main-image p.pawasakakun {
		width: 28%;
		top: 6%;
		left: 44%;
		z-index: 0;
	}
	.pre-index .main-image p.iniesta {
    	width: 640px;
    	top: -1%;
    	left: 8%;
    	z-index: 2;
	}
	.pre-index .main-image p.twt-iniesta {
		width: 100%;
    	top: 3%;
    	left: 0;
    	z-index: 2;
	}
	.pre-index .main-image p.kassanin {
		width: 19.7%;
		top: 9%;
		left: 25%;
	}
	.pre-index .main-image p.yuuru {
		width: 25.7%;
		top: 9%;
		left: 68%;
	}
	.pre-index .main-image p.kishi {
		width: 16.5%;
		top: 43%;
		left: 10%;
	}
	.pre-index .main-image p.yabesaka {
		width: 23.2%;
		top: 3%;
		left: 4%;
	}
	.pre-index .lead {
		padding: 20px 10px;
	}
	.pre-index .lead .ttl {
		padding: 0 0 0 250px;
	}
	.pre-index .lead .ttl h1 {
		width: 230px;
	}
	.pre-index .lead dl {
    	display: block;
    	position: static;
	}
	.pre-index .lead dl dt {
		display: block;
		position: absolute;
		top: 0;
		left: -10px;
		width: 240px;
		padding: 22px 0 0 0;
	}
	.pre-index .lead.twtr dl dt {
		width: 270px;
	}
	.pre-index .lead.iniesta dl dt {
		width: 264px;
		left:  0;
	}
	.pre-index .lead dl dt > img {
		width: 196px;
	}
	.pre-index .lead dl dt .badge {
		width: 70px;
		height: 70px;
		padding: 12px 16px 20px 16px;
		right: -20px;
		bottom: -10px;
	}
	.pre-index .lead dl dd {
		display: block;
		min-height: 120px;
		padding: 0 0 0 260px;
	}
	.pre-index .lead.iniesta dl dd {
		display: block;
		min-height: 120px;
		padding: 0 0 0 295px;
	}
	.pre-index .lead.iniesta p.tips {
    	margin: 20px 0 7px;
		font-weight: bold;
	}
	.pre-index .lead.iniesta ul.tips-ul {
	}
	.pre-index .lead.iniesta ul.tips-ul li {
    	width: 210px;
    	line-height: 1.5;
    	display: inline-block;
	}
	.pre-index .lead.iniesta ul.tips-ul li:before {
		content:"・";
	}
	.pre-index .lead.iniesta p.tips-caution {
    	width: 714px;
    	background: rgb(255, 255, 255);
    	border-radius: 7px;
    	color: #444;
    	padding: 22px;
    	text-align: center;
    	margin: 27px auto 0;
    	border: 3px solid #f00;
	}
	.pre-index .lead.iniesta p.tips-caution  span{
		display:inline;
	}

	.pre-index .lead .regist {
		text-align: left;
		padding: 0 0 0 260px;
		margin: 0;
	}
	.pre-index .lead.twtr .regist {
		position: absolute;
		top: 195px;
		left: 4%;
	}
	.pre-index .lead .regist a {
		width: 280px;
	}
	.pre-index .lead.twtr .regist a {
		width: 180px;
	}
	.pre-index .lead.twtr .regist a span {
		padding: 24% 0 0 0;
		background-image: url(../img/twitter/btn_follow_pc_white.svg);
	}
	.pre-index .lead.twtr .regist a:hover span {
		background-image: url(../img/twitter/btn_follow_pc_pink.svg);
	}
	.pre-index .lead .notice {
		padding: 60px 0 0;
		text-align: left;
		font-size: 68.75%;
	}
	.pre-index .lead.twtr .notice {
		padding: 10px 0 0 260px;
	}
	.pre-index .lead.iniesta .notice {
		padding: 10px 0 0 260px;
	}
	.pre-index .reward ul {
		box-sizing: border-box;
		padding: 30px 10px 10px 66px;
	}
	.pre-index .reward ul li {
		padding: 5px 10px 5px 80px;
	}
	.pre-index .reward ul li.current:after,
	.pre-index .reward ul li.completed:after,
	.pre-index .reward ul li.current.badge:after {
		width: 90px;
		height: 57px;
	}
	.pre-index .reward ul li.current .total {
		position: absolute;
		width: 110px;
		height: 110px;
		top: 50%;
		left: 350px;
		margin: -55px auto 0;
	}
	.pre-index .reward ul li .yabesaka-ballon,
	.pre-index .reward ul li .imakoko-ballon {
		top: -60px;
		height: 81px;
		padding: 10px 0 0 0;
	}
	.pre-index .reward ul li .yabesaka-ballon img,
	.pre-index .reward ul li .imakoko-ballon img {
		right: 70px;
		width: 210px;
	}
	.pre-index .reward ul li .num {
		width: 125px;
		height: 85px;
		margin: -63px 0 0 0;
		padding: 20px 0;
		top: 50%;
		left: -60px;
	}
	.pre-index .reward ul li .item-pack-name{
		padding: 6px 10px 0 0;
		text-align: left;
	}
	.pre-index .reward ul li .login-bonus-text {
		padding: 10px 10px 0 0;
		margin: 0 0 -5px;
		text-align: left;
	}
	.pre-index .reward ul li .login-bonus-text svg {
		width: auto;
	}
	.pre-index .reward ul li .item-pack {
		overflow: hidden;
		max-width: 808px;
	}
	.pre-index .reward ul li .item-pack .item {
		float: left;
		width: 33.3%;
		max-width: 320px;
	}
	.pre-index .reward ul li .item dt span {
		width: 50px;
		height: 50px;
		margin: 8px 0;
	}
	.pre-index .reward.twtr ul li .item dt span {
		width: 60px;
		height: 60px;
	}
	.pre-index .reward ul li .card {
		margin: 0;
		padding: 5px 0;
		max-width: 808px;
	}
	.pre-index .reward ul li .card dt {
		width: 33.3%
	}
	.pre-index .reward ul li .card dt img {
		max-width: 192px;
	}
	.pre-index .reward ul li .card dd {
		width: 66.7%;
	}
	.pre-index .reward ul li .card dd img {
		width: 140px;
	}
	.pre-index .reward ul li .item-pack .note {
		float: left;
		width: 64%;
		box-sizing: border-box;
		margin: 10px 10px 10px 0;
	}
	.pre-index .reward .additional-reward {
		padding: 20px 10px;
	}
	.pre-index .reward .regist-now {
		text-align: left;
	}
	.pre-index .reward .regist-now .copy {
		padding: 4px 0 4px 352px;
	}
	.pre-index .reward .regist-now .copy img {
		max-width: 520px;
	}
	.pre-index .reward .regist-now .btn-area {
		padding: 4px 0 4px 360px;
	}
	.pre-index .reward .regist-now .btn-area a {
		width: 280px;
	}
	.pre-index .reward .regist-now .image {
		position: absolute;
		width: 310px;
		top: -40px;
		left: 40px;
	}
#wrapper.simple-page.update-pawamatch .inner.update p.col-2,
#wrapper.simple-page.update-pawamatch .inner.update p.col-3 {
	float: left;
    width: 355px;
}

}















.news-list {
	background: rgba(0,0,0,.3);
}
.news-list .main-ttl h1 {
	overflow: hidden;
	height: 0;
}
.news-list .news .ttl img {
	vertical-align: bottom;
	border-radius: 5px;
	transition: all 0.2s ease;
	-webkit-transition: all 0.2s ease;
}
.news-list .news .ttl img:hover {
	opacity: 0.7;
}
.news-list section.news {
	max-width: 800px;
	margin: 0 auto;
	padding: 10px 10px 5px;
}
.news-list .news ul dl {
	margin: 0 0 10px;
}
.news-list .news ul dl dt {
	display: inline-block;
	box-sizing: border-box;
	position: relative;
	padding: 4px 7px 3px;
	border-radius: 4px;
	font-size: 56.3%;
	line-height: 1;
	color: #124d07;
	vertical-align: top;
	background: #fff;
}
.news-list .news ul dl .tag {
	display: inline-block;
	width: 6em; /* 最長 (キャンペーン) に合わせる */
	padding: 4px 7px 3px;
	border-radius: 4px;
	font-size: 56.3%;
	line-height: 1;
	text-align: center;
	color: #fff;
	vertical-align: top;
}
.news-list .news ul dl .tag.news {
	background: #4284fe;
}
.news-list .news ul dl dd {
	box-sizing: border-box;
	font-size: 75%;
	line-height: 1.333;
}
.news-list .news ul dl dd a,
.news-list .news ul dl dd span{
	position: relative;
	display: block;
}
.news-list .news ul dl dd a:after {
	position: absolute;
	content:"";
	display: block;
	width: 10px;
	height: 15px;
	top: 50%;
	right: 0;
	margin: -7px 0 0 0;
	background: url(../img/link_arrow_white.svg) no-repeat;
	background-size: 10px 15px;
}
#wrapper.chara .scenario-list .list ul li a.special:after
{
	content: "";
    position: absolute;
    display: block;
    width: 184px;
    height: 49px;
    top: 0;
    margin: 0 0 0 0;
    /*background: url(../img/success/icon-special.png) no-repeat 0 0;*/
    background: url(../img/success/icon-special_bk-collabo.png) no-repeat 0 0;
    background-size: 184px auto;
	background-position: 0px 6px;
}
#wrapper.chara .scenario-list .list ul li a.special span {
    display: inline-block;
    position: relative;
    overflow: hidden;
    height: 49px;
    width: 184px;
    vertical-align: middle;
}

/*-------------------------------------------------------------------*/
#wrapper.pre-index .iniesta-wrap-main{
    width: 100%;
    margin: 0 auto;
    padding-top: 34px;
}
#wrapper.pre-index .iniesta-box-main {
    width: 95%;
    margin: 0 auto;
}

#wrapper.pre-index .iniesta-wrap-main .date img{
	width:100%;
}

#wrapper.pre-index .iniesta-wrap-main .leadcopy
{
    width: 94%;
    margin: 0 auto 10px;
    padding: 8px;
    text-shadow: 1px 1px 0px #000;
    font-size: 104%;
    line-height: 1.5;
    font-weight: bold;
}

#wrapper.pre-index .official-tweet{
	width:90%;
	margin:0 auto;
}

#wrapper.pre-index .iniesta-wrap-odai{
	width:100%;
    background: rgba(245, 37, 0, 0.82);
}
#wrapper.pre-index .iniesta-box-odai{
    width: 90%;
    margin: 0 auto;
    padding-bottom: 20px;
}
#wrapper.pre-index .iniesta-box-odai img{
    width: 100%;
    margin:15px 0 5px;
}
#wrapper.pre-index .iniesta-box-odai span{
    display: block;
    width: 100%;
    margin: 0 auto;
    padding: 2px 0 10px;
    text-shadow: 1px 1px 3px #000;
    font-size: 90%;
    text-align: center;
}
#wrapper.pre-index .iniesta-box-odai .twt-tl-box{
    height: 300px;
    width: 100%;
    overflow: auto;
    border-radius: 4px;
    border: 2px solid #fff;
}
#wrapper.pre-index .iniesta-box-odai p.btn-twt-iniesta {
    border: 1px solid #fff;
    border-radius: 12px;
    padding: 10px;
    margin: 15px auto;
    box-sizing: border-box;
    background-color: #3ea1ec;
}
#wrapper.pre-index .iniesta-box-odai p.btn-twt-iniesta.howto-link{
    background-color: #ff0606;
    text-align: center;
}
#wrapper.pre-index .iniesta-box-odai p.btn-twt-iniesta.howto-link img{
    width: 76%;
    margin: 0 auto;
}

#wrapper.pre-index .iniesta-box-odai h3.odai-first {
    width: 70%;
    margin: 27px auto -10px;
}

p.twt-tl-box-hw {
    text-align: center;
    margin: 30px auto 17px;
    font-size: 159%;
    font-weight: bold;
    color: #feffff;
    border-top: 1px solid #fff;
    padding-top: 20px;
}

#wrapper.pre-index .iniesta-wrap-prize{
	width:100%;
    background: rgba(0, 12, 255, 0.82);
}
#wrapper.pre-index .iniesta-box-prize{
    width: 100%;
    height: 514px;
    margin: 0 auto;
    background-image: url(../img/twitter/twt-iniesta-prize_img.png);
    background-repeat: no-repeat;
    background-position: 50% 147px;
    background-size: 385px auto;
    text-align: center;
}
#wrapper.pre-index .iniesta-box-prize img{
	width: 288px;
    padding: 19px 0;
}
#wrapper.pre-index .iniesta-wrap-rt{
	width:100%;
}
#wrapper.pre-index .iniesta-box-rt{
	width: 90%;
	position: relative;
    height: 180px;
    margin: 0 auto;
}
#wrapper.pre-index .iniesta-wrap-rt .leadcopy-box{
	width:300px;
	margin:0 auto;
	position: relative;
}
#wrapper.pre-index .iniesta-box-rt p.leadcopy{
	position: absolute;
    top: -39px;
    left: 0;
    width: 100%;
}
#wrapper.pre-index .iniesta-box-rt p.leadcopy img{
    width:100%;
}
#wrapper.pre-index .iniesta-wrap-rt p.add{
    margin: 0 auto;
    padding-top: 14px;
    width: 80%;
}
#wrapper.pre-index .iniesta-wrap-rt p.add-date{
    margin: 0 auto;
    padding-bottom: 20px;
    width: 80%;
}
#wrapper.pre-index .iniesta-wrap-rt p.add img,
#wrapper.pre-index .iniesta-wrap-rt p.add-date img{
    width: 100%;
}
#wrapper.pre-index .iniesta-wrap-about{
	width:100%;
    background: rgba(0, 12, 255, 0.82);
}
#wrapper.pre-index .iniesta-box-about{
	width:90%;
	margin:0 auto;
    font-size: 80%;
}
#wrapper.pre-index .iniesta-box-about{
	width:90%;
	margin:0 auto;
    font-size: 80%;
}
#wrapper.pre-index .iniesta-box-about{
	width:90%;
	margin:0 auto;
    font-size: 80%;
}
#wrapper.pre-index .iniesta-box-about .about-h3-box{
	width: 283px;
    margin: 0 auto;
    padding-top: 22px;
}

#wrapper.pre-index .iniesta-box-about h3.about-h3{
    position: relative;
    height: 52px;
    padding-top: 113px;
}
#wrapper.pre-index .iniesta-box-about h3.caution {
    width: 33%;
    margin: 50px auto 20px;
}
#wrapper.pre-index .iniesta-box-about h3.about-h3 img,
#wrapper.pre-index .iniesta-box-about h3 img
{
	width:100%;
}

#wrapper.pre-index .iniesta-box-about h3.about-h3:before{
    content: "";
    height: 100px;
    width: 96px;
    position: absolute;
    top: 12px;
    left: 33%;
    background: url(../img/twitter/twt-iniesta-yabesaka_icon.png) no-repeat 0 0;
}
#wrapper.pre-index .iniesta-box-about p.detail{
	width:90%;
	margin:15px auto;
}
#wrapper.pre-index .iniesta-box-about ul{
	width:90%;
	margin:0 auto 0;
	padding-bottom: 30px;
    font-size: 80%;
}


.num.iniesta-rt img{
	width: 100%;
    padding-top: 17%;
}

a.official-account_main,
a.notice-cesa
{
	color:#00d8ff;
}
a.twitter-signup,
span.tweetshare{
	color:#ff00de;
}

#wrapper.pre-index .movie-area-iniesta-wrap .link-twt-iniesta{
    width: 95%;
    margin:0 auto;
}
#wrapper.pre-index .movie-area-iniesta-wrap .link-twt-iniesta img{
    width: 100%;
    border-radius: 7px;
}


#wrapper.chara.collabo-shoot .tips.col-2 {
	background: rgba(0,0,0,0.28);
}

/*----------------------------------------------------------------------------------------------------------------*/

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

#wrapper.pre-index .iniesta-wrap-rt .leadcopy-box{
	width:300px;
	margin:0 auto;
	position: relative;
}
.pre-index .main-image p.twt-iniesta-yabesaka {
    width: 78%;
	top: 184%;
    left: 45px;
    -webkit-animation: appear 0.6s 0s 1;
    -o-animation: appear 0.6s 0s 1;
    animation: appear 0.6s 0s 1;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    z-index: 2;
}
#wrapper.chara.collabo-shoot section.contents .comment span {
    height: 323px;
}
#wrapper.chara.collabo-shoot section.contents .about {
    background-size: 980px;
}

}

/*----------------------------------------------------------------------------------------------------------------*/

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

#wrapper.pre-index .iniesta-box-main{
    width: 330px;
    margin: 0 auto;
    position: relative;
}

.pre-index .main-image p.twt-iniesta-yabesaka {
    width: 70%;
    top: 174%;
    left: 75px;
}
#wrapper.pre-index .iniesta-box-main {
    width: 465px;
    margin: 0 auto;
    position: relative;
}
#wrapper.pre-index .iniesta-box-odai{
    width: 390px;
}

#wrapper.pre-index .movie-area-iniesta-wrap .link-twt-iniesta{
    width: 500px;
    margin:30px auto;
}

}

/*----------------------------------------------------------------------------------------------------------------*/


@media screen and (min-width:768px) {
	.news-list .news ul {
		margin: 30px 0;
		padding: 20px 0 10px;
		background: -webkit-linear-gradient(top, #fff 0%,#fff 100%) 15% 0 no-repeat;
		background: linear-gradient(to bottom, #fff 0%,#fff 100%) 15% 0 no-repeat;
		-webkit-background-size: 1px 100%;
		background-size: 1px 100%;
	}
	.news-list .news ul > li {
		margin: 0 0 20px;
	}
	.news-list .news ul dl {
		overflow: hidden;
	}
	.news-list .news ul dl dt {
		display: block;
		float: left;
		width: 17%;
		font-size: 75%;
		color: #fff;
		background: none;
	}
	.news-list .news ul dl dt:after {
		position: absolute;
		top: 0.5em;
		right: 8.5%;
		content: '';
		width: 8px;
		height: 8px;
		border-radius: 8px;
		background: #fff;
	}
	.news-list .news ul dl dd {
		float: left;
		width: 70%;
	}
	.news-list .news ul dl .tag {
		box-sizing: border-box;
		width: 13%;
		font-size: 75%;
	}
	.news-list .news ul dl dd {
		margin: 0 0 6px;
		padding: 0 0 0 10px;
		font-size: 87.5%;
		line-height: 1.5;
	}
	.news-list .news ul dl dd a {
		display: inline;
		padding: 0;
		text-decoration: underline;
	}
	.news-list .news ul dl dd a:hover {
		text-decoration: none;
	}
	.news-list .news ul dl dd a:after {
		background: none;
	}
	.news-list .news ul dl dd span {
		display: inline;
		padding: 0;
	}
}
.simple-page .main-ttl {
	text-shadow: 0 0 5px #000;
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), to(rgba(0,0,0,.3)));
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,.3) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.3) 100%);
}
.simple-page .main-ttl h1 {
	max-width: 728px;
	margin: 0 auto;
	padding: 40px 20px;
	font-size: 150%;
	line-height: 1.2;
	font-weight: bold;
}
#wrapper.simple-page.update-pawamatch .main-ttl h1 {
    padding: 3px 0 10px;
	text-align: center;
	font-size: 100%;
}
#wrapper.simple-page.update-pawamatch .main-ttl .ttl img {
	width:80%;
	margin:0 auto;
	display: block;
}
.simple-page .page-detail {
	padding: 0 20px 10px;
	font-size: 75%;
	text-shadow: 0 0 5px #000;
	background: rgba(0,0,0,.3);
}
.simple-page .page-detail > .inner {
	max-width: 728px;
	margin: 0 auto;
}
.simple-page .page-detail table {
	width: 100%;
	margin: 10px 0;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
}
.simple-page .page-detail table th,
.simple-page .page-detail table td {
	padding: 4px 6px;
	vertical-align: top;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
}
.about_beta{
	display: block;
	padding: 10px;
	box-sizing: border-box;
	border:1px solid #fff;
	margin-bottom: 20px;
}
.device-os{
	font-size: 140%;
	margin: 30px 0 4px;
}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 455px) {
	.simple-page .page-detail {
		font-size: 87.5%;
	}
	.pre-index .main-image p.twt-iniesta-ttl {
		width: 88%;
    	top: 117%;
    	left: 28px;
	}
	#wrapper.pre-index .iniesta-wrap-main .leadcopy{
    	padding: 0%;
		margin: 14px auto 20px;
	}
	#wrapper.pre-index .iniesta-wrap-rt p.add {
    	margin: 14px auto 0;
    	width: 53%;
	}
	#wrapper.simple-page.update-pawamatch .main-ttl .ttl img {
	    width: 478px;
	    margin-top: 15px;
	}
	#wrapper.simple-page.update-pawamatch .main-ttl h1 {
	    font-size: 133%;
	    padding-bottom: 15px;
	}
	#wrapper.simple-page.update-pawamatch .main-ttl h1 span.for-pc br{
	    display: none;
	}


}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 768px) {
	.simple-page .page-detail table {
		margin: 20px 0;
	}
	.simple-page .main-ttl h1 {
		padding: 60px 0;
		font-size: 160%;
	}
	.simple-page.device .page-detail .device-list {
		display: table;
		width: 100%;
	}
	.simple-page.device .page-detail .device-list li {
		display: table-cell;
	}
	.simple-page.device .page-detail .device-list li + li {
		padding: 0 0 0 20px;
	}
	#wrapper.chara .scenario-list .list ul li a.special span {
    display: inline-block;
    position: relative;
    overflow: hidden;
    height: 52px;
    width: 220px;
    vertical-align: middle;
	}
	#wrapper.chara .scenario-list .list ul li a.special:after {
    content: "";
    position: absolute;
    display: block;
    width: 220px;
    height: 49px;
    top: 0px;
    margin: 0 0 0 0;
    /*background: url(../img/success/icon-special.png) no-repeat 0 0;*/
    background: url(../img/success/icon-special_bk-collabo.png) no-repeat 0 0;
    background-size: 220px auto;
	}
	#wrapper.chara .scenario-list .list ul li a.special:hover:after, #wrapper.chara .scenario-list .list ul li.on a.special {
    content: "";
    position: absolute;
    display: block;
    width: 220px;
    height: 49px;
    top: 0px;
    margin: 0 0 0 0;
    /*background: url(../img/success/icon-special_on.png) no-repeat 0 0;*/
    background: url(../img/success/icon-special_bk-collabo.png) no-repeat 0 0;
    background-size: 220px auto;
    transition: all 0.3s ease;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	}
	.pre-index .lead.iniesta {
	    background: rgba(245, 37, 0, 0.82);
	    margin-top: 144px;
    	height: 696px;
	}
	.pre-index .lead.iniesta > .inner {
	    position: relative;
	    max-width: 780px;
	    margin: 0 auto;
	    padding-top: 45px;
	    height: 581px;
	}
	.pre-index .lead.iniesta dl {
	    display: table;
	    padding: 10px 0;
	    position: static;
	}
	.pre-index .lead.iniesta dl dt > img {
	    width: 100%;
	    margin-top: 36px;
	}

	#wrapper.pre-index .movie-area-iniesta-wrap .link-twt-iniesta{
	    width: 580px;
	    margin:0 auto;

	}
	#wrapper.pre-index .movie-area-iniesta-wrap .link-twt-iniesta img{
	    width: 100%;
	    border-radius: 7px;
	}

	#wrapper.pre-index .movie-area-iniesta-wrap h3 {
	    width: 337px;
	    margin: 0 auto;
	}
	.pre-index .main-image.twt-iniesta-resize {
	    max-width: 796px;
	    width: 95%;
	    height: 0;
	    position: relative;
	    margin: 0 auto;
    	padding: 634px 0 0 0;
	}
	#wrapper.pre-index .iniesta-box-main {
	    width: 720px;
	    margin: 0 auto;
	}
	.pre-index .main-image p.twt-iniesta-ttl {
    	width: 76%;
    	top: 417px;
    	left: 82px;
	}
	.pre-index .main-image p.twt-iniesta-yabesaka {
	    width: 444px;
	    top: 191%;
	    left: 128px;
	}
	#wrapper.pre-index .iniesta-box-odai {
	    width: 60%;
	}
	#wrapper.pre-index .iniesta-box-odai .twt-tl-box{
	    height: 500px;
	}
	#wrapper.pre-index .iniesta-wrap-rt p.add {
		margin: 16px auto 0px;
    	padding-top: 11px;
    	width: 41%;
	}
	#wrapper.pre-index .iniesta-wrap-rt p.add-date {
		margin: 16px auto 0px;
    	padding-top: 35px;
    	width: 41%;
	}
	#wrapper.pre-index .official-tweet {
	    width: 65%;
	    margin: 0 auto;
	}
	#wrapper.pre-index .iniesta-box-about h3.caution {
	    width: 17%;
	}
	.pre-index .iniesta-box-main p.twt-iniesta-ttl {
	    width: 66%;
	    margin: 0 auto;
	}
	.pre-index .iniesta-box-main p.twt-iniesta-yabesaka {
    	width: 51%;
    	margin: 11px auto 0;
    	text-align: center;
    	font-size: 110%;
    	text-shadow: 0 0 3px #000;
	}
	.pre-index .iniesta-box-main p.date {
	    width: 77%;
	    margin: 10px auto;
	}
	#wrapper.pre-index .iniesta-wrap-main .leadcopy {
	    padding: 0%;
	    margin: 15px auto;
	    width: 90%;
	}
	#wrapper.pre-index .iniesta-wrap-main .leadcopy {
		padding: 0%;
    	margin: 15px auto 35px;
    	width: 74%;
    	font-size: 119%;

	}


/*----------------------collabo-shoot-----------------------*/


#wrapper.chara.collabo-shoot section.contents p.leadcopy{
	width:100%;
    padding: 24px 0 18px;
	background-color:#ec0303;
	text-align: center;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy br{
	display: inherit;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span,
#wrapper.chara.collabo-shoot section.contents p.leadcopy img,
#wrapper.chara.collabo-shoot section.contents .comment h3 img,
#wrapper.chara.collabo-shoot section.contents .comment img,
#wrapper.chara.collabo-shoot section.contents .comment span img{
    display: block;
    font-size: 0;
    margin: 0 auto;
    line-height: 0;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-1-1{
    height: 26px;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-1-2{
    height: 26px;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-1-3{
    height: 26px;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-1-1 img{
	height:100%;
    width: auto;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-1-2 img{
	height:100%;
    width: auto;
    margin:0;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-1-3 img{
	height:100%;
    width: auto;
}

#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-2{
    height: 42px;
	margin:6px 0 10px;
}
#wrapper.chara.collabo-shoot section.contents p.leadcopy span.lead-3{
	height:32px;
	margin: 5px 0 0;
}

#wrapper.chara.collabo-shoot section.contents p.leadcopy span,
#wrapper.chara.collabo-shoot section.contents p.leadcopy img{
    display:inline-block;
    font-size: 0;
    margin: 0 auto;
}
#wrapper.chara.collabo-shoot section.contents .comment{
	width:100%;
	padding:18px 0;
	background-image:url(../img/success/05/bg-comment.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
    background-size: 1161px;
	text-align: center;
    text-indent: -9999px;
}
#wrapper.chara.collabo-shoot.diverge-05 section.contents .comment{
	width:100%;
	padding:18px 0;
	background-image:url(../img/success/05-diverge/bg-comment.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
    background-size: 1161px;
	text-align: center;
    text-indent: -9999px;
}
#wrapper.chara.collabo-shoot section.contents .about{
    width: 100%;
    padding: 18px 0;
    background-color: #fe0000;
    background-image: url(../img/success/05/bg-about.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 1133px;
    text-align: center;
}

#wrapper.chara.collabo-shoot section.contents .comment{
	text-indent: -9999px;
    max-height: 512px;
    background-color: #fff;
}

#wrapper.chara.collabo-shoot section.contents .comment h3{
    height: 38px;
    line-height: 0em;
    margin: 10px auto;
    background-image: url(../img/success/05/comment-hw.svg);
    background-size: 530px auto;
    background-position: 50% 50%;
}
#wrapper.chara.collabo-shoot section.contents .comment img{
	display: block;
    height: 223px;
    margin: 14px auto;
}

#wrapper.chara.collabo-shoot section.contents .comment span{
    height: 140px;
    display: block;
    line-height: 0em;
    margin: 10px auto;
    background-image: url(../img/success/05/comment-body.svg);
    background-size: 743px auto;
}
#wrapper.chara.collabo-shoot.diverge-05 section.contents .comment span{
    height: 140px;
    display: block;
    line-height: 0em;
    margin: 10px auto;
    background-image: url(../img/success/05-diverge/comment-body.svg);
    background-size: 743px auto;
}
#wrapper.chara.collabo-shoot section.contents .comment h3 img,
#wrapper.chara.collabo-shoot section.contents .comment span img{
    display: block;
    margin: 0 auto;
    height: 100%;
}
#wrapper.chara.collabo-shoot section.contents .about dl{
	text-align: center;
}
#wrapper.chara.collabo-shoot section.contents .about dl dt{
	width:600px;
	text-indent: -9999px;
	line-height: 0;
	height:30px;
	margin:45px auto 23px;
	padding: 17px 0;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
}
#wrapper.chara.collabo-shoot section.contents .about dl img,
#wrapper.chara.collabo-shoot section.contents .about dl dd{
	line-height: 0;
	height:230px;
}
#wrapper.chara.collabo-shoot section.contents .about dl img,
#wrapper.chara.collabo-shoot section.contents .about dl dd{
	display: block;
	margin:0 auto;
}
#wrapper.chara.collabo-shoot section.contents .about dl dd{
	display: block;
	margin-bottom: 27px;
}
#wrapper.chara.collabo-shoot section.contents .about dl img,
#wrapper.chara.collabo-shoot section.contents .about dd img{
    height: 100%;
}
#wrapper.chara.collabo-shoot section.contents .about dd.story{
	line-height: 1.6;
    width: 490px;
    text-align: left;
    height: auto;
	font-size: 100%;
}
#wrapper.chara .scenario-list .list ul li a.special-0823 {
    width: 190px;
}
#wrapper.chara .scenario-list .list ul li a.special-0823 img {
    height: 41px;
    margin: 7px 5px 10px;
}






}

/*----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:900px) {
		.pre-index .main-image p.iniesta {
    	width: 640px;
    	top: -1%;
    	left: 13%;
    	z-index: 2;
	}
	#wrapper.pre-index .iniesta-box-main {
	    width: 796px;
	    margin: 0 auto;
	}
	.pre-index .main-image p.twt-iniesta {
	    top: 6%;
	}
	.pre-index .main-image p.twt-iniesta-ttl {
	    width: 622px;
		top: 452px;
	    left: 82px;
	}
	.pre-index .main-image p.twt-iniesta-yabesaka {
	    width: 444px;
	    top: 659px;
	    left: 162px;
	}
	#wrapper.pre-index .iniesta-wrap-main .leadcopy {
	    padding-top: 2%;
	}
	#wrapper.pre-index .iniesta-box-odai {
	    width: 53%;
	    max-width: 549px;
	}
	#wrapper.pre-index .iniesta-box-about {
    width: 900px;
    margin: 0 auto;
    font-size: 87%;
	}
	#wrapper.pre-index .iniesta-wrap-rt p.add {
    	margin: 17px auto 0px;
    	width: 403px;
	}
	#wrapper.pre-index .official-tweet {
	    width: 56%;
	    margin: 0 auto;
	}
	#wrapper.chara .profile ul li .sp-skill {
	    padding: 4px 49px;
	}
	#wrapper.chara .profile ul li .sp-skill.s06 {
	    padding: 4px 35px;
	}
	#wrapper.chara.collabo-shoot div.reproduce {
    	height: 601px;
    	width: 95%;
    	margin: 0 auto;
    	font-size: 100%;
    	background-position: 50% -11px;
    	background-size: 818px auto;
	}
	#wrapper.chara .profile div.rival {
    	height: 460px;
    	background-position: 50% 56px;
    	background-size: 723px auto;
	}

	#wrapper.chara.collabo-shoot div.reproduce br {
		display: none;
	}

/*----------------------------fcbarcelona*/

.pre-index .main-image.fcbarcelona {
    height: 737px;
}
.pre-index .main-image.fcbarcelona img.main {
    top: -66px;
    left: -182px;
    width: 729px;
}
.pre-index .main-image.fcbarcelona h1 {
    top: 524px;
    left: -156px;
    width: 678px;
}
.pre-index .main-image.fcbarcelona p {
    top: 607px;
    left: -21px;
    width: 393px;
}


}


/*-------------manga--------------*/

	section.manga{
		width: 95%;
		max-width: 870px;
		margin: 20px auto 10px;
		padding: 2% 0 3%;
		text-align: center;
		background-image: url("../img/manga/bg_stripe.png");
		background-repeat: no-repeat;
		background-size: auto;
		background-position: top center,;
		background-color: #fff;
		border-radius: 10px;
		position: relative;
		z-index: 90;
	}

	section.manga img{
		width: 100%;
		display: block;
		margin: 0 auto 20px;
	}

	section.manga .wrap-manga {
		position: relative;
		width: 96%;
		height: 138vw;
		margin: 1% auto;
		background-color: #ffffff;
		overflow: hidden;
	}

	section.manga .wrap-manga img {
		width: 100%;
		display: block;
		margin: 0 auto;
		box-sizing: border-box;
	}

	.wrap-manga:before{
		content: "";
		position: absolute;
		bottom: -3px;
		left: 0;
		width: 100%;
		background-image: url(../img/manga/gradient.png);
		background-repeat: repeat-x;
		background-position: bottom left;
		background-size: auto 100%;
		height: 30%;
	}

	section.manga .manga-title{
		width: 90%;
		max-width: 815px;
		margin: 0 auto;
	}
	section.manga .manga-number{
		width: 33%;
		max-width: 238px;
		margin: 2% auto;
	}
	section.manga a{
		display: block;
	}


	/*full-----------------*/

    section.manga.full{
        width: 95%;
        max-width: 870px;
        margin: 20px auto 10px;
        padding: 2% 0 3%;
        text-align: center;
        background-image: url("../img/manga/bg_stripe.png"),url("../img/manga/bg_stripe_bottom.png");
        background-repeat: no-repeat,no-repeat;
        background-size: auto;
        background-position: top center,bottom center;
        background-color: #fff;
        border-radius: 10px;
        position: relative;
        z-index: 90;
    }

	section.manga.full .wrap-manga{
		position: relative;
		width: 96%;
		height: auto;
		max-height: none;
		margin: 1% auto;
		background-color: #ffffff;
		overflow: inherit;
	}
	section.manga.full .wrap-manga img{
		width: 100%;
		display: block;
		margin: 10px auto;;
		box-sizing: border-box;
	}
	section.manga.full .wrap-manga:before{
		display: none;
	}

	.cotent-manga{
		width: 90%;
		border: 4px solid #96b0b71a;
		border-radius: 11px;
		/*box-shadow: 1px 1px 7px 1px rgb(212 212 212);*/
		margin: 0px auto;
		display: block;
	}

	.wrap-manga .manga-btn{
		width: 36%;
		padding: 2%;
		position: absolute;
		z-index: 100;
		bottom: 0;
		left: 50%;
		transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		background-color: #f50000;
		color: #fff;
		border-radius: 30px;
		font-weight: bold;
		font-size: 120%;
		border: 2px solid #ffb071;
	}

	.nextback{
		width: 90%;
		margin: 5% auto 2%;
		overflow: hidden;
	}

	.nextback .wrap-back{
		/*text-align: center;
		float: left;*/
		text-align: right;
		width: 49%;
		margin: 0 auto;
	}
	.nextback .wrap-next{
		/*text-align: center;
		float: right;*/
		text-align: left;
		width: 49%;
		margin: 0 auto;
	}
	.nextback .wrap-back img,
	.nextback .wrap-next img{
		display: inline-block;
		width: 50%;
		margin: 0;
		vertical-align: middle;
	}
	.nextback .wrap-back img.back-arrow,
	.nextback .wrap-next img.next-arrow{
		width: 24%;
	}
	.nextback .wrap-back img.back-arrow{
		margin-left:10px;
	}
	.nextback .wrap-next img.next-arrow{
		margin-right:10px;
	}

    section.manga.full ul.number{
        width: 90%;
        margin: 4% auto;
        text-align: left;
        display:-webkit-box;
        display:-moz-box;
        display:-ms-flexbox;
        display:-webkit-flex;
        display:-moz-flex;
        display:flex;
        -webkit-box-pack:justify;
        -moz-box-pack:justify;
        -webkit-flex-pack:justify;
        -moz-flex-pack:justify;
        -ms-flex-pack:justify;
        -webkit-justify-content:center;
        -moz-justify-content:center;
        justify-content:center;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap    : wrap;
        flex-wrap        : wrap;
        padding-top: 4%;
        border-top: 2px dotted #e0e0e0;
    }
	section.manga.full ul.number li.current{
		opacity: 0.3;
	}
    section.manga.full ul.number li{
		width: 21%;
		min-width: 71px;
		margin: 0 8px 5px;
    }
    section.manga.full ul.number li img{
        margin: 0 auto 5%;
    }

	#wrapper .app-base-data.footer_manga:before {
		content: '';
		display: block;
		position: absolute;
		top: -800px;
		left: 0;
		width: 100%;
		height: 800px;
		opacity: .3;
		background: -moz-linear-gradient(top, transparent, #000);
		background: -webkit-linear-gradient(top, transparent, #000);
		background: linear-gradient(to bottom, transparent, #000);
	}


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

		/*--------------------top*/


		/*------------------full*/

		section.manga.full .wrap-manga{
			width: 90%;
			height: auto;
			max-height: none;
			margin: 1% auto;
			overflow: inherit;
		}
		section.manga.full .wrap-manga img{
			width: 100%;
			box-sizing: border-box;
		}

		.nextback .wrap-back{
			/*text-align: center;
			float: left;*/
			text-align: right;
			width: 45%;
			margin: 0 auto;
		}
		.nextback .wrap-next{
			/*text-align: center;
			float: right;*/
			text-align: left;
			width: 45%;
			margin: 0 auto;
		}
		section.manga.full ul.number li {
			width: 17%;
			min-width: 88px;
			margin: 0 11px;
		}



	}

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

		section.manga .wrap-manga{
			width: 90%;
			max-height: 1194px;
		}

	}