@charset "UTF-8";
a,
body { color: #000 }
a,
ins.play-gif { text-decoration: none }
a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
main,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline }
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section { display: block }
body { line-height: 1; font-family: sans-serif, 'Hiragino Kaku Gothic Pro', Meiryo, Osaka, 'MS PGothic', arial, helvetica, BTMono; width: 100%; background: #fff }
ol,
ul { list-style: none }
blockquote,
q { quotes: none }
blockquote:after,
blockquote:before,
q:after,
q:before { content: ''; content: none }
table { border-collapse: collapse; border-spacing: 0 }
* { box-sizing: border-box }
.app-download-container,
.chance__banner,
.chance__list,
.chance__prize,
.chance__text--line01,
.chance__text--line02,
.chance__text--line03,
.chance__text--line04,
.chance__text--red,
.more-container,
.notes__text,
.notes__text--big,
.notes__text--red,
.section__title img,
.share-container { margin: 0 auto }
ins.play-gif { position: absolute; font-family: Arial, sans serif; width: 50px; height: 50px; line-height: 52px; text-align: center; background: #222; font-size: 18px; color: #fff; border-radius: 50%; opacity: .9; border: 4px solid #fff; cursor: pointer; text-indent: 100% }
ins.play-gif:after { display: block; content: ""; position: absolute; top: 50%; left: 50%; margin-left: -6px; margin-top: -10px; width: 0; height: 0; border-style: solid; border-width: 10px 0 10px 17.3px; border-color: transparent transparent transparent #fff }
ins.play-gif:hover { opacity: .5 }
.gifplayer-wrapper { position: relative; display: block }
.spinner { height: 50px; width: 50px; margin: -25px auto 0 -25px; position: absolute; top: 50%; left: 50%; -webkit-animation: rotation .6s infinite linear; animation: rotation .6s infinite linear; border-left: 6px solid rgba(255,255,255,.15); border-right: 6px solid rgba(255,255,255,.15); border-bottom: 6px solid rgba(255,255,255,.15); border-top: 6px solid rgba(255,255,255,.8); border-radius: 100% }
@-webkit-keyframes rotation {
from {
-webkit-transform:rotate(0)
}
to {
-webkit-transform:rotate(359deg)
}
}
@keyframes rotation {
from {
-webkit-transform:rotate(0);
transform:rotate(0)
}
to {
-webkit-transform:rotate(359deg);
transform:rotate(359deg)
}
}
.video { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden }
.video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100% }
.header-container { margin-top: 10px; padding: 0 10px }
.header__logo { height: auto; margin: 0 auto }
.header__logo img { width: 100%; height: auto }
.description-inner { margin-top: 20px }
.description__text--line1,
.description__text--line2,
.description__text--line3,
.description__text--line4 { text-align: center; color: red; font-weight: 700; line-height: 1.4 }
.description__video-container { margin-bottom: 20px; padding: 0 15px }
.description__video-container .video { border-radius: 5px; border: 5px solid #000 }
.description__100peple { display: block; margin: 16px auto 15px; width: 140px; height: 60px }
.description__text,
.description__text--red { line-height: 1.4; margin-bottom: 20px; padding: 0 15px; font-weight: 700; text-align: center }
.description__100peple img,
.howtoplay__image,
.howtoplay__image img,
.howtoplay__subtitle img,
.section__title img { width: 100%; height: auto }
.description__text { color: #000 }
.description__text--red { font-size: 24px; color: red }
.description__text--line1 { font-size: 16px }

@media only screen and (max-width:400px) {
.description__text--line1 { font-size: 12px }
}
.description__text--line2 { font-size: 24px; margin: 16px 0 12px }
.description__text--line3,
.description__text--line4 { font-size: 18px }

@media only screen and (max-width:414px) {
.description__text--line4 { font-size: 16px }
}
.section-container { margin-top: 20px }
.section__title,
.section__title img { display: block }
.howtoplay-container { margin-bottom: 40px }
.howtoplay__subtitle { margin-top: 30px; padding: 0 15px }
.howtoplay__text { font-size: 16px; line-height: 1.5; text-align: center; padding: 0 10px; margin: 20px 0 40px; font-weight: 700 }

@media only screen and (max-width:400px) {
.howtoplay__text { font-size: 12px }
}
.howtoplay__text--big { font-size: 24px; line-height: 1.5; text-align: center; padding: 0 10px; margin: 20px 0; font-weight: 700 }

@media only screen and (max-width:400px) {
.howtoplay__text--big { font-size: 18px }
}
.howtoplay__image--wrapper { margin: 20px auto; padding: 0 10px }
.howtoplay__image { text-align: center; display: block; border: 5px solid #000; overflow: hidden; border-radius: 5px; vertical-align: middle }
.howtoplay__image img { display: block }
.howtoplay__image--01 { margin-bottom: 40px }
.chance__text--line01,
.chance__text--line02,
.chance__text--line03,
.chance__text--line04,
.chance__text--red { line-height: 1.5; color: #000; padding: 0 10px }
.chance__image { display: block; width: 144px; height: 50px; margin: 10px auto 16px }
.chance__image img { width: 100%; height: auto }
.chance__prize { margin-top: 30px }
.chance__prize__item { display: block; min-height: 140px; margin: 10px 0; padding: 0 10px }
.chance__prize__item:after { content: ""; display: block; height: 0; clear: both; visibility: hidden }
.chance__prize__item__block--left { float: left; width: 50%; min-height: 140px; overflow: hidden }
.chance__prize__item__block--right { float: right; width: 50%; padding-left: 10px; min-height: 140px; overflow: hidden }
.chance__list,
.notes__list { padding: 0 10px 0 2em; line-height: 1.5 }
.chance__prize__item__block__image img { width: 100%; height: auto }
.chance__prize__item__block__title { font-size: 18px; font-weight: 700; line-height: 1.5; margin-bottom: 20px }
.chance__prize__item__block__peple { width: 100px; height: 28px }
.chance__prize__item__block__peple img { width: 100%; height: auto }
.chance__text--red { text-align: center; font-size: 18px; font-weight: 700; color: red; margin-top: 30px }
.chance__banner { margin: 15px 0 }
.chance__banner img { width: 100%; height: auto }
.chance__list { color: #000; font-size: 13px; margin: 30px 0 }
.chance__list__item { position: relative; margin: 10px 0 }
.chance__list__item:after { position: absolute; top: 0; left: -1.2em; display: block; content: "※" }
.chance__text--line01 { text-align: center; font-size: 18px; font-weight: 700; margin-top: 30px }

@media only screen and (max-width:400px) {
.chance__text--line01 { font-size: 16px }
}
.chance__text--line02 { text-align: center; font-size: 18px; font-weight: 700 }
.chance__text--line04,
.notes__list,
.notes__text { font-size: 14px }
.chance__text--line03 { font-size: 14px; font-weight: 700; margin-bottom: 10px }
.notes__list__item { margin-top: 30px; margin-bottom: 30px; position: relative }
.notes__list__item:before { position: absolute; left: -1.2em; top: 0; content: "■"; color: #000; display: block }
.notes__text { margin-top: 30px; margin-bottom: 30px; padding: 0 10px; line-height: 1.5 }
.notes__text--big,
.notes__text--red { font-size: 16px; margin-top: 30px; margin-bottom: 30px; padding: 0 10px; font-weight: 700; line-height: 1.5 }
.notes__text--red { color: red; text-align: center }
.app-download-container { position: relative }
.app-download__background img { width: 100%; height: auto }
.app-download__ios-button { width: 33%; left: 27%; top: 71%; position: absolute }
.app-download__ios-button img { width: 100%; height: auto }
.app-download__android-button { width: 33%; left: 63.5%; top: 71%; position: absolute }
.app-download__android-button img { width: 100%; height: auto }
.share-container { position: relative; text-align: right; margin-bottom: 20px; margin-top: 15px; padding: 0 10px }
.share__title { width: 42px; height: 14px; display: block; margin: 0 auto 6px }
.share__title img { width: 100%; height: auto }
.share__items { text-align: center; display: block }
.share__item { width: 30px; height: 30px; display: inline-block; vertical-align: middle; margin: 0 2px }
.banner-container a img,
.footer__copyright img,
.more__image,
.more__image img,
.share__item img { width: 100%; height: auto }
.more-container { position: relative; text-align: center; margin-bottom: 20px; margin-top: 30px; padding: 0 10px }
.more__title { text-align: center; font-weight: 700; font-size: 22px; margin-bottom: 10px }

@media only screen and (max-width:400px) {
.more__title { font-size: 16px }
}
.more__image { display: block }
.more__image img { display: block; vertical-align: middle }
.banner-container a { display: block }
.utme-banner-container { padding: 0 10px }
.app-text,
.common-app-header__copy,
.common-app-header__text { padding: 0 15px; text-align: center }
.utme-banner-container a { display: block; vertical-align: middle }
.utme-banner-container a img { display: block; width: 100%; height: auto }
.app-text { font-size: 16px; line-height: 1.5; margin-bottom: 15px }
.footer-container { background: red; margin-top: 40px }
.footer__copyright { display: block; max-width: 320px; margin: 0 auto; overflow: hidden }
.footer__copyright img { display: block; vertical-align: middle }
.common-app-header { width: 100%; margin: 0 auto 30px }
.common-app-header__logo { text-align: center; width: 90px; height: auto; margin: 15px auto 0 }
.common-app-header__logo img { width: 100% }
.common-app-header__copy { margin-top: 10px; font-size: 16px; margin-left: .5em; font-weight: 700 }
.common-app-header__text { font-size: 10px; margin-top: 5px; line-height: 1.5 }

.common-app-header { width: 100%; background: #fff; color: #000; margin-bottom: 15px; padding-top: 15px; }
.common-app-header__logo { text-align: center; width: 90px; height: auto; margin: 0 auto; }
.common-app-header__logo img { width: 100%; }
.common-app-header__copy { text-align: center; margin-top: 10px; font-size: 16px; margin-left: 0.5em; font-weight: bold; padding: 0 15px; }
.common-app-header__text { text-align: center; font-size: 10px; margin-top: 5px; line-height: 1.5; padding: 0 15px; }
.common-app-header__tab { width: 100%; margin: 0 auto; margin-top: 10px; text-align: center; border-bottom: 4px solid #F0F0F0; font-size: 0; }
.common-app-header__tab__item,
.common-app-header__tab__item--current { height: auto; display: inline-block; text-align: center; width: 33.3%; position: relative; border-bottom: 4px solid #F0F0F0; margin-bottom: -4px; }
.common-app-header__tab__item img,
.common-app-header__tab__item--current img { width: 100%; }
.common-app-header__tab__item--current { border-bottom: 4px solid #f00; }
.common-app-header__tab__item--current:after { content: ""; display: block; background-image: url("../img/funtab_lbl_current@2x.png"); background-size: 100% 100%; background-position: middle middle; width: 8px; height: 4px; position: absolute; bottom: 0; left: 50%; margin-left: -2px; }



/*8/5 campaign*/
.header-container { margin-top: 0px; padding: 0 0 }
.areaDayOfHB { padding: 20px 0 10px; text-align: center;}
.areaDayOfHB h2,
.areaDayOfHB h3,
.areaDayOfHB h2 img,
.areaDayOfHB h3 img {
	width: 100%;
}
.areaDayOfHB h2 {margin: 0 0 0;}
.areaDayOfHB h3 {margin: 0px 0 25px;}

.areaDayOfHB .p1 {
	font-weight: 700;
	font-size: 4.1vw;
	line-height: 1.5;
	padding: 0 10px;
}
.areaDayOfHB .p1 img {
	width: 53vw;
}
.areaDayOfHB .p2 {
	font-weight: 700;
	font-size: 4.1vw;
	line-height: 1.5;
	padding: 0 10px;
}
.areaDayOfHB .p2 strong {
	color: #fe0000;
	font-weight: 700;
	font-size: 5.6vw;
}
.areaDayOfHB .p2 small {
	font-weight: 300;
	font-size: 2.7vw !important;
	font-size: 18px;
}
.areaDayOfHB .p3 {
	font-weight: 700;
	font-size: 4.1vw;
	line-height: 1.6;
	padding: 0 10px;
	color: #fe0000;
}
.areaDayOfHB .p3 span {
	font-size: 4.8vw;
}
.areaDayOfHB .p3 small {
	font-weight: 300;
	font-size: 2.7vw !important;
	line-height: 1;
	vertical-align: middle;
}
.areaDayOfHB .p3 small.vat {
	vertical-align: top;
}
.areaDayOfHB .p4 {
	padding: 0 10px 0;
	font-size: 3.2vw;
	line-height: 1.6;
	text-align: left;
}
.areaDayOfHB .p4 strong {
	font-size: 3.3vw;
	font-weight: bold;
}
.areaDayOfHB .p5 {
	font-weight: 300;
	font-size: 3.2vw;
	line-height: 1.5;
	padding: 20px 20px 0;
	text-align: left;
}
.areaDayOfHB .p5 strong {
	display: block;
	font-weight: 700;
	margin-bottom: .5em;
}
.areaDayOfHB p + p { margin-top: 10px; }

.areaDayOfHB .ul1 {
	padding: 15px 10px;
	font-size: 3.2vw;
	line-height: 1.6;
	text-align: left;
	font-weight: bold;
	line-height: 2;
}
.areaDayOfHB .ul1 a {
	display: inline-block;
	padding-right: 3.8vw;
	position: relative;
}
.areaDayOfHB .ul1 a:after {
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 1.6vw 1.4vw 0 1.4vw;
	border-color: #fe0000 transparent transparent transparent;
	position: absolute;
	right: 0;
	top: 2.2vw;
}
.areaDayOfHB .prsntImg { margin: 30px 0; }
.areaDayOfHB .prsntImg img { width: 100%; height: auto;}
.areaDayOfHB .prsntImg2 { margin: 5px 0 30px; padding: 0 10px; }
.areaDayOfHB .prsntImg2 img { width: calc(100% - 20px); height: auto;}

.areaDayOfHB .btn {
	font-size: 0;
	text-align: center;
	margin-top: 15px;
}
.areaDayOfHB .btn img {
	width: 84.3vw;
	height: auto;
}