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,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video
{
font: inherit;font-size: 100%;
margin: 0;padding: 0;vertical-align: baseline;border: 0;;
}article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section
{
display: block;
}body
{
line-height: 1;
}ol,
ul
{
list-style: none;
}blockquote,
q
{
quotes: none;
}blockquote:before,
blockquote:after,
q:before,
q:after
{
content: '' ;content: none;
}table
{
border-spacing: 0;
}body
{
font-family: 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', Arial, Verdana, sans-serif;font-size: 10px;font-weight: 300;line-height: 1;position: relative;overflow-x: hidden;width: 100vw;width: 100%;height: 100vh;letter-spacing: .05em;color: #222;background-color: #f5f5f5;background-color: #03000d;
}img
{
width: 100%;vertical-align: bottom;
}a
{
cursor: pointer;text-decoration: none;
color: #222;;
}*
{
box-sizing: border-box;backface-visibility: hidden;
}.main-container
{
font-family: '游明朝体', 'Yu Mincho', YuMincho, 'ヒラギノ明朝 Pro', 'Hiragino Mincho Pro', 'MS P明朝', 'MS PMincho', serif;overflow-x: hidden;
width: 100vw;;
}.header
{
position: fixed;z-index: 10;top: 0;left: 0;width: 100%;;
}.header .header-twitter
{
position: absolute;z-index: 11;top: 70px;right: 30px;
width: 22px;cursor: pointer;transition: opacity .2s linear;
}@media screen and (max-width: 779px)
{
.header .header-twitter
{
top: 17.1875vw;
right: 5.46875vw;width: 5.46875vw;
}
}.header .header-sound
{
position: absolute;z-index: 11;top: 105px;right: 16px;display: flex;align-items: center;
width: 36px;height: 36px;padding-right: 13px;cursor: pointer;transition: opacity .2s linear;;
}.header .header-sound.is-muted
{
background-image: url(../img/header-sound_off.svg);background-repeat: no-repeat;background-position: left center;background-size: 24px;;
}@media screen and (max-width: 779px)
{
.header .header-sound.is-muted
{
padding-right: 0;background-size: 6vw auto;
}
}.header .header-sound.is-muted img
{
visibility: hidden;
}@media screen and (max-width: 779px)
{
.header .header-sound
{
top: 25vw;right: 2.5vw;width: 8.0625vw;height: 8.0625vw;
padding-right: 2.03125vw;;
}
}.header.is-active .header-sound
{
visibility: visible;
opacity: 1;;
}.header .header-menu
{
position: absolute;z-index: 11;top: 27px;right: 30px;width: 20px;height: 20px;cursor: pointer;
}@media screen and (max-width: 779px)
{
.header .header-menu
{
top: 7.03125vw;
right: 5.46875vw;width: 5.625vw;height: 5.625vw;
}
}.header .header-menu span
{
position: absolute;left: 0;width: 100%;height: 2px;transition: .3s cubic-bezier(.215, .61, .355, 1);background-color: #fff;;
}@media screen and (max-width: 779px)
{
.header .header-menu span
{
height: .625vw;
}
}.header .header-menu span:first-child
{
top: 0;left: 0;
transform: translateY(2px);;
}@media screen and (max-width: 779px)
{
.header .header-menu span:first-child
{
top: .3125vw;
}
}.header .header-menu span:nth-child(2)
{
top: 50%;left: 0;transform: translateY(-50%);
}.header .header-menu span:nth-child(3)
{
right: 0;bottom: 0;
transform: translateY(-2px);;
}@media screen and (max-width: 779px)
{
.header .header-menu span:nth-child(3)
{
bottom: .3125vw;
}
}.header .header-menu.is-active span:first-child
{
transform: translateY(9px) rotate(-45deg);
}@media screen and (max-width: 779px)
{
.header .header-menu.is-active span:first-child
{
transform: translateY(2.1875vw) rotate(-45deg);
}
}.header .header-menu.is-active span:nth-child(2)
{
opacity: 0;
}.header .header-menu.is-active span:nth-child(3)
{
transform: translateY(-9px) rotate(45deg);
}@media screen and (max-width: 779px)
{
.header .header-menu.is-active span:nth-child(3)
{
transform: translateY(-2.1875vw) rotate(45deg);
}
}.header .header-nav
{
position: fixed;z-index: 10;top: 0;left: 0;display: none;width: 100%;height: 100vh;background-color: #020102;;
}.header .header-nav__inner
{
display: flex;
width: 780px;margin: 0 auto;;
}@media screen and (max-width: 779px)
{
.header .header-nav__inner
{
display: block;overflow-y: scroll;
width: 100%;height: 100%;padding: 0 9.375vw 14.0625vw;;
}
}.header .header-nav .header-navList
{
width: 50%;padding-top: 87px;
}@media screen and (max-width: 779px)
{
.header .header-nav .header-navList
{
width: 100%;
padding-top: 0;;
}
}.header .header-nav .header-navList:nth-child(1)
{
padding-left: 176px;background-image: url(../img/gnav-decoLine--pc.png);background-repeat: no-repeat;background-position: 132px 131px;
}@media screen and (max-width: 779px)
{
.header .header-nav .header-navList:nth-child(1)
{
padding-top: 17.5vw;padding-left: 6.875vw;background-image: url(../img/gnav-decoLine--sp.png);background-position: left 27.1875vw;background-size: 4.0625vw;;
}
}.header .header-nav .header-navList.no-bg
{
background-image: none;
}.header .header-nav .header-navList:nth-child(2)
{
padding-left: 140px;
}@media screen and (max-width: 779px)
{
.header .header-nav .header-navList:nth-child(2)
{
padding-left: 6.875vw;
}
}.header .header-nav .header-navList__item
{
margin-bottom: 57px;
}@media screen and (max-width: 779px)
{
.header .header-nav .header-navList__item
{
margin-bottom: 11.875vw;
}
}.header .header-nav .header-navList__item.nav1 a:after
{
background-image: url(../img/gnav-text1_hover.svg);
}.header .header-nav .header-navList__item.nav2 a:after
{
background-image: url(../img/gnav-text2_hover.svg);
}.header .header-nav .header-navList__item.nav3 a:after
{
background-image: url(../img/gnav-text3_hover.svg);
}.header .header-nav .header-navList__item.nav4 a:after
{
background-image: url(../img/gnav-text4_hover.svg);
}.header .header-nav .header-navList__item.nav5 a:after
{
background-image: url(../img/gnav-text10_hover.svg);
}.header .header-nav .header-navList__item.nav6 a:after
{
background-image: url(../img/gnav-text6_hover.svg);
}.header .header-nav .header-navList__item.nav7 a:after
{
background-image: url(../img/gnav-text7_hover.svg);
}.header .header-nav .header-navList__item.nav8 a:after
{
background-image: url(../img/gnav-text8_hover.svg);
}.header .header-nav .header-navList__item.nav9 a:after
{
background-image: url(../img/gnav-text9_hover.svg);
}.header .header-nav .header-navList__item.nav10 a:after
{
background-image: url(../img/gnav-text10_hover.svg);
}.header .header-nav .header-navList__item.nav11 a:after
{
background-image: url(../img/gnav-text11_hover.svg);
}.header .header-nav .header-navList__item a
{
position: relative;
display: block;text-align: left;background-repeat: no-repeat;background-size: auto 33px;
}@media screen and (max-width: 779px)
{
.header .header-nav .header-navList__item a
{
background-size: auto 5.15625vw;
}
}@media screen and (min-width: 780px)
{
.header .header-nav .header-navList__item a:hover:before
{
opacity: 1;
}.header .header-nav .header-navList__item a:hover:after
{
opacity: 1;
}
}.header .header-nav .header-navList__item a:before
{
position: absolute;bottom: 2px;left: -75px;width: 212px;height: 11px;
content: '';transition: .15s .15s linear;opacity: 0;background-image: url(../img/gnav-decoHover.png);;
}@media screen and (min-width: 780px)
{
.header .header-nav .header-navList__item a:after
{
position: absolute;top: 0;left: 0;width: 100%;height: 100%;
content: '';transition: .3s cubic-bezier(.215, .61, .355, 1);opacity: 0;background-repeat: no-repeat;background-size: auto 33px;;
}
}.header .header-nav .header-navList__item a img
{
width: auto;
height: 33px;;
}@media screen and (max-width: 779px)
{
.header .header-nav .header-navList__item a img
{
height: 6.71875vw;
}
}.header .header-nav .header-navList__item.has-arrow span
{
position: relative;display: inline-block;padding-right: 20px;;
}@media screen and (max-width: 779px)
{
.header .header-nav .header-navList__item.has-arrow span
{
padding-right: 3.59375vw;
}
}.header .header-nav .header-navList__item.has-arrow span:after
{
position: absolute;top: 50%;right: 0;display: block;width: 0;height: 0;content: '';transform: translateY(-50%);border-width: 3px 0 3px 6px;border-style: solid;border-color: transparent transparent transparent #fff;
}@media screen and (max-width: 779px)
{
.header .header-nav .header-navList__item.has-arrow span:after
{
border-width: .78125vw 0 .78125vw 1.5625vw;
}
}.header .header-nav .header-navList__item.nav9
{
transform: translateX(-42px);
}@media screen and (max-width: 779px)
{
.header .header-nav .header-navList__item.nav9
{
transform: translateX(-7.1875vw);
}
}@media screen and (max-width: 779px)
{
.header .header-nav .header-navList__item.nav7
{
transform: translateX(0);
}
}@media screen and (max-width: 779px)
{
.header .header-nav .header-navList__item.nav8
{
transform: translateX(-7.1875vw);
}
}.header-lower .header-logo
{
position: absolute;top: 10px;left: 21px;width: 165px;
}@media screen and (max-width: 779px)
{
.header-lower .header-logo
{
top: 1.71875vw;left: 1.875vw;width: 30.3125vw;
}
}.header
{
transition: opacity .6s;
opacity: 0;;
}.is-ready .header
{
opacity: 1;
}.header-lower
{
opacity: 1;
}.footer .footer-nav
{
border-top: 1px solid #35333d;
background-color: #171420;;
}@media screen and (max-width: 779px)
{
.footer .footer-nav
{
border-top: 0;
}
}.footer .footer-nav .footer-nav-list
{
display: flex;align-items: center;justify-content: center;padding: 22px 0 25px;
}
@media screen and (max-width: 779px)
{
.footer .footer-nav .footer-nav-list
{
display: block;padding: 0;
}
}.footer .footer-nav .footer-nav-list__item
{
padding: 0 20px;
}@media screen and (max-width: 779px)
{
.footer .footer-nav .footer-nav-list__item
{
padding: 0;
border-top: 1px solid #35333d;;
}
}.footer .footer-nav .footer-nav-list__item a
{
font-size: 13px;
color: #fff;;
}@media screen and (min-width: 780px)
{
.footer .footer-nav .footer-nav-list__item a
{
transition: opacity .15s linear;
}.footer .footer-nav .footer-nav-list__item a:hover
{
opacity: .4;
}
}
@media screen and (max-width: 908px)
{
.footer .footer-nav .footer-nav-list__item
{
padding: 0 1.5%;
}
.footer .footer-nav .footer-nav-list__item a
{
font-size: 1.5vw;
}
}
@media screen and (max-width: 779px)
{
.footer .footer-nav .footer-nav-list__item a
{
font-size: 3.75vw;display: flex;align-items: center;justify-content: center;
padding: 6.25vw 0;;
}
}.footer .footer-logo
{
display: flex;align-items: center;justify-content: center;padding-top: 40px;padding-bottom: 20px;color: #fff;
background-color: #000;;
}@media screen and (max-width: 779px)
{
.footer .footer-logo
{
padding-top: 9.375vw;padding-bottom: 7.03125vw;
}
}.footer .footer-logo span
{
width: 90px;
}@media screen and (max-width: 779px)
{
.footer .footer-logo span
{
width: 28.125vw;
}
}.footer .footer-bottom
{
padding-bottom: 55px;text-align: center;color: #fff;
background-color: #000;;
}@media screen and (max-width: 779px)
{
.footer .footer-bottom
{
padding: 0 4.6875vw 7.03125vw 4.6875vw;
}
}.footer .footer-bottom p
{
font-size: 12px;line-height: 1.5;text-align: center;;
}@media screen and (max-width: 779px)
{
.footer .footer-bottom p
{
font-size: 3.4375vw;line-height: 1.72727;text-align: left;;
}
}.mv
{
position: relative;z-index: 3;height: 1084px;pointer-events: none;
}@media screen and (max-width: 779px)
{
.mv
{
height: 207.65625vw;
}
}.mv .mv-bg
{
position: absolute;z-index: 0;z-index: 0;top: 0;left: 50%;width: 2000px;height: 100%;
content: '';transform: translateX(-50%);background-image: url(../../assets/img/mv-bg--pc.png);
}@media screen and (max-width: 779px)
{
.mv .mv-bg
{
height: 100vh;padding-top: 5vw;background-size: auto 100vh;
}
}@media screen and (min-width: 780px)
{
.mv .mv-bg
{
background-repeat: no-repeat;
background-position: top center;background-size: 2000px;
}
}.mv .mv-kv
{
position: absolute;z-index: 0;top: 0;left: 50%;
width: 2000px;height: 100%;transform: translateX(-50%);;
}@media screen and (max-width: 779px)
{
.mv .mv-kv
{
width: 100%;
}
}@media screen and (min-width: 780px)
{
.mv img
{
width: auto;
}
}.mv .mv-inner
{
position: relative;z-index: 1;max-width: 1440px;height: 100vh;margin: 0 auto;;
}@media screen and (min-width: 780px)
{
.mv .mv-inner
{
min-height: 720px;
}
}.mv .mv-logo
{
position: absolute;top: 28px;left: 50%;transform: translateX(-50%);
text-align: center;;
}.mv .mv-logo img
{
width: 306px;
}@media screen and (max-width: 779px)
{
.mv .mv-logo img
{
width: 43.75vw;
}
}.mv .mv-copy
{
position: absolute;left: 50%;width: 73px;height: 369px;transform: translate(-50%, 240px);;
}@media screen and (max-width: 779px)
{
.mv .mv-copy
{
width: 13.75vw;height: 75.15625vw;
transform: translateX(-50%) translateY(37vw);;
}
}.mv .mv-copy img
{
width: 100%;
}.mv .mv-copy span
{
position: absolute;top: 0;left: 0;
}.mv .mv-copy .mv-copy-text
{
z-index: 1;
opacity: 0;;
}.mv .mv-copy .mv-copy-reversed
{
z-index: 0;
opacity: 1;;
}.mv .mv-img
{
position: absolute;z-index: 0;top: 0;left: 50%;transform: translateX(-50%);;
}
.mv .mv-btn
{
position: fixed;bottom: 95px;left: 40px;height: auto;pointer-events: none;
}
.mv .mv-btn.mv-twi
{
bottom: 40px;left: 48px;
}
.mv .mv-btn a
{
transition: opacity .3s linear;
}.mv .mv-btn img
{
height: auto;
transition: transform .2s cubic-bezier(.215, .61, .355, 1);
}.mv .mv-btn.inview
{
pointer-events: auto;
}.mv .mv-btn.inview a
{
opacity: 1;
}@media screen and (max-width: 779px)
{
.mv .mv-btn
{
top: auto;bottom: 18vw;left: 4.6875vw;
}
.mv .mv-btn.mv-twi
{
bottom: 4.6875vw;left: 4.6875vw;
}
.mv .mv-btn img
{
width: 34.375vw;height: auto;
}
}@media screen and (min-width: 780px)
{
.mv .mv-btn:hover img
{
transform: scale(1.04);
}
}.mv .mv-arrow
{
position: fixed;z-index: 3;bottom: 40px;left: 50%;width: 36px;height: 28px;transition: opacity .3s linear;transform: translateX(-50%);pointer-events: none;opacity: 0;;
}@media screen and (max-width: 779px)
{
.mv .mv-arrow
{
bottom: 9.375vw;
width: 10vw;height: 7.5vw;;
}
}.mv .mv-arrow img
{
width: 100%;
animation: sdb 1.5s infinite;;
}@media screen and (max-width: 779px)
{
.mv .mv-arrow img
{
animation: sdb-sp 1.5s infinite;
}
}.mv-anim
{
height: 4.6875vw;transition: filter .6s linear;opacity: 0;filter: blur(10px);will-change: filter, opacity;
}.mv-anim.animated
{
filter: blur(0px);
}.anim-completed .mv-arrow
{
opacity: 0;
}.anim-completed .mv-arrow.is-show
{
opacity: 1;
}@keyframes sdb
{
0%
{
transform: translate(0, -10px);opacity: 0;
}50%
{
opacity: 1;
}100%
{
transform: translate(0, 10px);opacity: 0;
}
}@keyframes sdb-sp
{
0%
{
transform: translate(0, -3vw);opacity: 0;
}50%
{
opacity: 1;
}100%
{
transform: translate(0, 3vw);opacity: 0;
}
}.intro
{
position: relative;z-index: 2;
margin-top: -87px;padding-bottom: 120px;text-align: center;
}@media screen and (max-width: 779px)
{
.intro
{
margin-top: -14.0625vw;padding-bottom: 16.40625vw;
}
}.intro:after
{
position: absolute;z-index: 1;bottom: 0;left: 50%;width: 2000px;height: 1338px;
content: '';transform: translateX(-50%);pointer-events: none;background-image: url(../img/intro-bg--pc.png);
}@media screen and (max-width: 779px)
{
.intro:after
{
width: 100%;height: 144.0625vw;
background-image: url(../img/intro-bg--sp.png);background-size: contain;
}
}@media screen and (min-width: 780px)
{
.intro img
{
width: auto;
}
}.intro .intro-inner
{
position: relative;z-index: 2;
}.intro .intro-heading
{
margin-bottom: 52px;
}@media screen and (max-width: 779px)
{
.intro .intro-heading
{
margin-bottom: 5vw;
}.intro .intro-heading img
{
width: 79.84375vw;
}
}.intro .intro-lead1
{
position: relative;z-index: 2;
margin-bottom: 70px;;
}@media screen and (max-width: 779px)
{
.intro .intro-lead1
{
margin-bottom: 17.1875vw;
}.intro .intro-lead1 img
{
width: 76.71875vw;
}
}.intro .intro-lead2
{
position: relative;z-index: 2;
margin-bottom: 60px;;
}@media screen and (max-width: 779px)
{
.intro .intro-lead2
{
margin-bottom: 17.1875vw;
}.intro .intro-lead2 img
{
width: 80vw;
}
}.intro .intro-img
{
position: absolute;z-index: 0;top: 780px;/*top: 718px;top: 530px;*/left: 0;width: 100%;height: 100%;;
}@media screen and (max-width: 779px)
{
.intro .intro-img
{
top: 169.875vw; /*top: 167.875vw;top: 119.875vw;*/
}
}.intro .intro-img__item
{
position: absolute;left: 50%;transform: translateX(-50%);
}.intro .intro-img__item:nth-child(1)
{
top: 0;margin-left: 256px;
}@media screen and (max-width: 779px)
{
.intro .intro-img__item:nth-child(1)
{
right: 0;left: auto;
margin-left: 0;transform: translateX(0%);
}.intro .intro-img__item:nth-child(1) img
{
width: 43.28125vw;
}
}.intro .intro-img__item:nth-child(2)
{
top: 110px;margin-left: -260px;
}@media screen and (max-width: 779px)
{
.intro .intro-img__item:nth-child(2)
{
top: 75vw;left: 0;
margin-left: 0;transform: translateX(0%);;
}.intro .intro-img__item:nth-child(2) img
{
width: 56.09375vw;
}
}.intro .intro-img__item:nth-child(3)
{
top: 366px;right: 0;margin-left: 125.5px;
}@media screen and (max-width: 779px)
{
.intro .intro-img__item:nth-child(3)
{
top: 135.9375vw;right: 0;left: auto;
margin-left: 0;transform: translateX(0%);;
}.intro .intro-img__item:nth-child(3) img
{
width: 46.875vw;
}
}.intro .intro-lead3
{
position: relative;
margin-bottom: 130px;;
}@media screen and (max-width: 779px)
{
.intro .intro-lead3
{
margin-bottom: 20.3125vw;
}.intro .intro-lead3 img
{
width: 91.71875vw;
}
}.intro .intro-thumb
{
display: flex;justify-content: center;margin: 0 auto;
cursor: pointer;;
}@media screen and (max-width: 779px)
{
.intro .intro-thumb
{
display: block;
}
}.intro .intro-thumb__item
{
width: 374px;margin: 0 7px;
}@media screen and (max-width: 779px)
{
.intro .intro-thumb__item
{
width: 100%;margin: 0;
}.intro .intro-thumb__item:first-child
{
margin-bottom: 6.25vw;
}
}.intro .intro-thumb__item .thumb
{
position: relative;
}.intro .intro-thumb__item .thumb img
{
width: 100%;
}@media screen and (max-width: 779px)
{
.intro .intro-thumb__item .thumb
{
width: 100%;
}.intro .intro-thumb__item .thumb img
{
width: 64.6875vw;
}
}.intro .intro-thumb__item .thumb:before
{
position: absolute;z-index: 2;top: 50%;left: 50%;width: 56px;height: 56px;
content: '';cursor: pointer;transform: translate(-50%, -50%);transform-origin: center;background-image: url(../img/intro-playbtn.svg);background-position: center;background-size: contain;;
}.intro .intro-thumb__item .thumb .hover
{
position: absolute;z-index: -1;top: 0;left: 0;;
}@media screen and (max-width: 779px)
{
.intro .intro-thumb__item .thumb .hover
{
display: none;
}
}.intro .intro-thumb__item .thumb picture
{
position: relative;
transition: opacity .3s cubic-bezier(.215, .61, .355, 1);;
}@media screen and (min-width: 780px)
{
.intro .intro-thumb__item .thumb:hover picture
{
opacity: 0;
}
}.intro .intro-thumb__item .caption
{
display: block;
margin-top: 14px;;
}@media screen and (max-width: 779px)
{
.intro .intro-thumb__item .caption
{
margin-top: 2.34375vw;
}.intro .intro-thumb__item .caption img
{
width: auto;
height: 3.4375vw;;
}
}.intro .intro-banner-area
{
padding: 30px 0 150px;text-align: center;
}@media screen and (max-width: 779px)
{
.intro .intro-banner-area
{
padding: 6.25vw 0 23.4375vw;
}
}
/*.intro .intro-banner-area div:nth-of-type(2),
.intro .intro-banner-area div:nth-of-type(3)
{
margin-top: 15px;
}
@media screen and (max-width: 779px)
{
.intro .intro-banner-area div:nth-of-type(2),
.intro .intro-banner-area div:nth-of-type(3)
{
margin-top: 2vw;
}
}*/
@media screen and (max-width: 779px)
{
.intro .intro-banner img
{
width: 81.25vw;
}
}.intro .intro-banner a
{
display: inline-block;transition: opacity .2s linear;
}.intro .intro-banner a:hover
{
opacity: .75;
}.world
{
position: relative;z-index: 1;
text-align: center;;
}@media screen and (min-width: 780px)
{
.world img
{
width: auto;
}
}.world .world-block
{
position: relative;
}.world .world-block:nth-child(1)
{
z-index: 2;padding-top: 105px;padding-bottom: 107px;
background-image: url(../img/world-bg1--pc.jpg);background-repeat: no-repeat;background-attachment: fixed;background-position: center;background-size: cover;;
}@media screen and (max-width: 779px)
{
.world .world-block:nth-child(1)
{
padding-top: 15.3125vw;padding-bottom: 17.5vw;background-image: url(../img/world-bg1--sp.jpg);background-attachment: inherit;background-size: 100%;;
}
}.world .world-block:nth-child(2)
{
padding-top: 106px;
}@media screen and (max-width: 779px)
{
.world .world-block:nth-child(2)
{
padding-top: 20.3125vw;
}
}.world .world-heading
{
margin-bottom: 55px;
}@media screen and (max-width: 779px)
{
.world .world-heading
{
margin-bottom: 12.1875vw;
}.world .world-heading img
{
width: 79.6875vw;
}
}.world .world-lead
{
position: relative;
}.world .world-lead img
{
position: relative;z-index: 1;
}@media screen and (max-width: 779px)
{
.world .world-lead img
{
width: 83.4375vw;
}
}.world .world-text
{
position: relative;z-index: 1;
}@media screen and (max-width: 779px)
{
.world .world-text img
{
width: 85.78125vw;
}
}.world .world-img
{
position: absolute;z-index: 0;top: 0;left: 0;left: 50%;width: 100%;max-width: 1200px;height: 100%;transform: translateX(-50%);
}.world .world-img__item
{
position: absolute;
}.world .world-img__item img
{
width: 100%;
}.world .world-img__item:nth-child(1)
{
z-index: 2;
top: 4%;left: 8.33333%;width: 23.66667%;
}@media screen and (max-width: 779px)
{
.world .world-img__item:nth-child(1)
{
top: 35.3125vw;left: 0;width: 59.375vw;margin-left: 0;transform: translateX(0%);;
}
}.world .world-img__item:nth-child(2)
{
z-index: 1;
top: 9%;left: 50%;width: 58.83333%;transform: translateX(-50%);;
}@media screen and (max-width: 779px)
{
.world .world-img__item:nth-child(2)
{
top: 73.125vw;left: 0;width: 100%;transform: translateX(0%);;
}
}.world .world-img__item:nth-child(3)
{
z-index: 2;
top: 25%;right: 1.66667%;width: 26.66667%;
}@media screen and (max-width: 779px)
{
.world .world-img__item:nth-child(3)
{
top: 147.65625vw;right: 0;left: auto;width: 57.5vw;margin-left: 0;transform: translateX(0%);;
}
}.world .world-visual
{
margin-top: -250px;
}.world .world-visual img
{
width: 100%;
}@media screen and (max-width: 779px)
{
.world .world-visual
{
margin-top: -23.4375vw;
}
}.system
{
position: relative;z-index: 0;padding-bottom: 200px;text-align: center;;
}@media screen and (max-width: 779px)
{
.system
{
padding-bottom: 21.875vw;
}
}@media screen and (min-width: 780px)
{
.system img
{
width: auto;
}
}.system .system-inner
{
position: relative;
}.system .system-deco
{
position: absolute;z-index: 0;top: -630px;left: 50%;margin-left: 7px;transform: translateX(-50%);;
}@media screen and (max-width: 779px)
{
.system .system-deco
{
top: -56.25vw;
width: 80.9375vw;margin-left: 3.90625vw;padding-bottom: 23.4375vw;;
}
}.system .system-deco img
{
position: relative;
z-index: 1;;
}.system .system-deco:after
{
position: absolute;z-index: 0;top: 960px;left: 50%;display: block;width: 492px;height: 301px;margin-left: -7px;
content: '';transform: translateX(-50%);background-image: url(../img/system-bg0--pc.png);background-size: 100%;;
}@media screen and (max-width: 779px)
{
.system .system-deco:after
{
top: 128.125vw;
width: 88.4375vw;height: 54.0625vw;;
}
}.system .system-block
{
position: relative;z-index: 1;
}.system .system-heading
{
margin-bottom: 120px;
padding-top: 110px;;
}@media screen and (max-width: 779px)
{
.system .system-heading
{
margin-bottom: 14.84375vw;
padding-top: 7.8125vw;;
}.system .system-heading img
{
width: 79.6875vw;
}
}.system .system-lead1
{
position: relative;z-index: 2;
margin-bottom: 5px;;
}@media screen and (max-width: 779px)
{
.system .system-lead1
{
margin-bottom: 6.25vw;
}.system .system-lead1 img
{
width: 73.4375vw;
}
}.system .system-img
{
position: relative;max-width: 1200px;height: 415px;margin: 0 auto;margin-top: -80px;
}@media screen and (max-width: 779px)
{
.system .system-img
{
width: 100%;height: 71.875vw;margin-top: 0;
}
}.system .system-img__item
{
position: absolute;
}.system .system-img__item img
{
width: 100%;
}.system .system-img__item:nth-child(1)
{
right: 2.5%;width: 33.58333%;
}@media screen and (max-width: 779px)
{
.system .system-img__item:nth-child(1)
{
z-index: 2;
right: 0;width: 47.96875vw;;
}
}.system .system-img__item:nth-child(2)
{
top: 50px;
left: .16667%;width: 45.66667%;;
}@media screen and (max-width: 779px)
{
.system .system-img__item:nth-child(2)
{
top: 13.4375vw;
left: 0;width: 57.8125vw;;
}
}.system .system-img__item:nth-child(3)
{
top: 240px;
right: 20.83333%;width: 27.25%;;
}@media screen and (max-width: 779px)
{
.system .system-img__item:nth-child(3)
{
top: 50.3125vw;
right: 3.125vw;width: 42.5vw;;
}
}.system .system-img__item:nth-child(4)
{
top: 360px;
left: 19.16667%;width: 29.66667%;;
}@media screen and (max-width: 779px)
{
.system .system-img__item:nth-child(4)
{
top: 61.25vw;
left: 3.75vw;width: 44.0625vw;;
}
}.system .system-img__item:nth-child(5)
{
z-index: -1;top: 187px;
left: 50%;width: 1988px;margin-left: -994px;;
}@media screen and (max-width: 779px)
{
.system .system-img__item:nth-child(5)
{
top: 42.1875vw;
left: 0vw;width: 100vw;margin-left: 0;;
}
}.system .system-block2
{
height: 510px;
margin-top: 170px;margin-bottom: 55px;background-image: url(../img/system-bg1--pc.png);background-repeat: no-repeat;background-position: top center;;
}@media screen and (max-width: 779px)
{
.system .system-block2
{
height: 103.125vw;margin-top: 25vw;margin-bottom: 18.75vw;
background-image: url(../img/system-bg1--sp.png);background-size: 100%;;
}
}.system .system-lead2
{
padding-top: 134px;
}@media screen and (max-width: 779px)
{
.system .system-lead2
{
padding-top: 2.1875vw;
}.system .system-lead2 img
{
width: 41.40625vw;
}
}.system .system-character
{
position: absolute;bottom: 0;left: 50%;width: 100%;
max-width: 1280px;margin: 0 auto;transform: translateX(-50%);;
}.system .system-character__item
{
position: absolute;bottom: 0;
}.system .system-character__item img
{
width: 100%;
}.system .system-character__item:nth-child(1)
{
left: 1.5625%;width: 32.10938%;
}@media screen and (max-width: 779px)
{
.system .system-character__item:nth-child(1)
{
left: 0;
width: 52.34375vw;;
}
}.system .system-character__item:nth-child(2)
{
right: 9.0625%;width: 17.89062%;
padding-top: 20px;;
}@media screen and (max-width: 779px)
{
.system .system-character__item:nth-child(2)
{
right: 0;
width: 35.9375vw;padding-top: 2.34375vw;
}
}.system .system-block3
{
background-image: url(../img/system-bg2--pc.png);background-repeat: no-repeat;background-position: center 120px;
}@media screen and (max-width: 779px)
{
.system .system-block3
{
background-image: url(../img/system-bg2--sp.png);background-position: center 31.25vw;background-size: 100%;;
}
}.system .system-scene
{
position: relative;display: flex;flex-wrap: wrap;
justify-content: center;width: 1200px;margin: 0 auto;;
}@media screen and (max-width: 779px)
{
.system .system-scene
{
display: block;
width: 100%;text-align: center;
}
}@media screen and (min-width: 768px) and (max-width: 1200px)
{
.system .system-scene
{
width: 700px;
}
}.system .system-scene:nth-child(1)
{
margin-bottom: 40px;
}@media screen and (max-width: 779px)
{
.system .system-scene:nth-child(1) .system-scene__item .head img
{
width: 72.96875vw;
}
}.system .system-scene:nth-child(2):after
{
position: absolute;top: 126px;left: 50%;width: 82px;height: 82px;
content: '';transform: translateX(-50%);background-image: url(../img/system-cross.png);;
}@media screen and (min-width: 768px) and (max-width: 1200px)
{
.system .system-scene:nth-child(2):after
{
top: 336px;
}
}@media screen and (max-width: 779px)
{
.system .system-scene:nth-child(2):after
{
top: 50.78125vw;
width: 10.9375vw;height: 10.9375vw;background-size: 100%;;
}
}.system .system-scene:nth-child(2) .system-scene__item:nth-child(1)
{
padding-right: 70px;
}@media screen and (min-width: 768px) and (max-width: 1200px)
{
.system .system-scene:nth-child(2) .system-scene__item:nth-child(1)
{
padding: 0 0 70px 0;
}
}@media screen and (max-width: 779px)
{
.system .system-scene:nth-child(2) .system-scene__item:nth-child(1)
{
margin-bottom: 19.375vw;
padding: 0;;
}.system .system-scene:nth-child(2) .system-scene__item:nth-child(1) .head img
{
width: 76.71875vw;
}
}.system .system-scene:nth-child(2) .system-scene__item:nth-child(2)
{
padding-left: 70px;
}@media screen and (min-width: 768px) and (max-width: 1200px)
{
.system .system-scene:nth-child(2) .system-scene__item:nth-child(2)
{
padding: 0;
}
}@media screen and (max-width: 779px)
{
.system .system-scene:nth-child(2) .system-scene__item:nth-child(2)
{
margin-bottom: 0;
padding: 0;;
}.system .system-scene:nth-child(2) .system-scene__item:nth-child(2) .head img
{
width: 56.875vw;
}
}.system .system-scene__item
{
margin-bottom: 20px;
}@media screen and (max-width: 779px)
{
.system .system-scene__item
{
margin-bottom: 29.6875vw;
}
}.system .system-scene__item .head
{
position: relative;
margin-bottom: 22px;;
}@media screen and (max-width: 779px)
{
.system .system-scene__item .head
{
margin-bottom: 2.34375vw;
}
}.system .system-scene__item .head img
{
position: relative;z-index: 1;
}.system .system-scene__item .head:after
{
position: absolute;z-index: 0;top: 22px;left: 50%;width: 640px;height: 32px;
content: '';transform: translateX(-50%);background-image: url(../img/system-textdeco--pc.png);background-repeat: no-repeat;
}@media screen and (max-width: 779px)
{
.system .system-scene__item .head:after
{
top: auto;bottom: .78125vw;
width: 90.625vw;height: 2.8125vw;background-size: 100%;;
}
}.system .system-scene__item .img
{
width: 530px;
margin-bottom: 22px;;
}.system .system-scene__item .img video
{
width: 100%;
}@media screen and (max-width: 779px)
{
.system .system-scene__item .img
{
width: 100%;margin-bottom: 3.90625vw;
}.system .system-scene__item .img video
{
width: 78.125vw;
}.system .system-scene__item .img img
{
width: 75.78125vw;
}
}@media screen and (max-width: 779px)
{
.system .system-text
{
margin-top: 0vw;
}.system .system-text img
{
width: 75.78125vw;
}
}.character
{
padding-bottom: 65px;
text-align: center;;
}@media screen and (max-width: 779px)
{
.character
{
padding-bottom: 13.28125vw;
}
}@media screen and (min-width: 780px)
{
.character img
{
width: auto;
}
}.character-inner
{
position: relative;z-index: 2;
}@media screen and (max-width: 779px)
{
.character-heading
{
margin-bottom: 8.59375vw;
}.character-heading img
{
width: 79.6875vw;
}
}.character-carousel
{
width: 100%;max-width: 1000px;margin: 0 auto;
}.character-carouselMain .slick-list
{
overflow: visible;
}@media screen and (max-width: 779px)
{
.character-carouselMain .slick-list
{
overflow: visible;
}
}@media screen and (max-width: 779px)
{
.character-carouselMain__item
{
margin-top: -4.6875vw;
padding-top: 9.375vw;;
}
}.character-carouselMain__item .wrapper
{
position: relative;display: inline-block;
width: 680px;;
}@media screen and (max-width: 779px)
{
.character-carouselMain__item .wrapper
{
width: 100%;
}
}.character-carouselMain__item .lead
{
position: absolute;top: 165px;left: 50%;margin-left: -195px;transform: translateX(-50%);;
}@media screen and (max-width: 779px)
{
.character-carouselMain__item .lead
{
position: static;top: 0;
margin-left: 0;transform: translateX(0%);
}.character-carouselMain__item .lead img
{
width: 100vw;
}
}.character-carouselMain__item .img
{
position: relative;z-index: 1;
text-align: center;;
}.character-carouselMain__item .img img
{
display: block;
}.character-carouselMain__item .text
{
position: absolute;z-index: 2;top: 280px;left: 50%;margin-left: 220px;transform: translateX(-50%);;
}@media screen and (max-width: 779px)
{
.character-carouselMain__item .text
{
top: 71.875vw;margin-left: 7.8125vw;
}.character-carouselMain__item .text img
{
width: 39.0625vw;
}
}.character-carouselMain__item .bg
{
position: absolute;bottom: 0;left: 50%;width: 1220px;transform: translateX(-50%);;
}@media screen and (max-width: 779px)
{
.character-carouselMain__item .bg
{
width: 100%;
}
}.character-carouselMain__item .btn
{
position: absolute;z-index: 4;top: 465px;right: -40px;display: block;
}@media screen and (max-width: 779px)
{
.character-carouselMain__item .btn
{
top: 145.3125vw;right: 0;width: 100%;width: 100vw;text-align: center;;
}.character-carouselMain__item .btn a
{
display: inline-block;
width: 43.4375vw;;
}
}.character-carouselMain__item .btn img
{
transition: opacity .3s;
}@media screen and (min-width: 780px)
{
.character-carouselMain__item .btn:hover img
{
opacity: .6;
}
}.character-carouselMain .slick-prev
{
z-index: 5;
left: 20px;width: 25px;height: 36px;cursor: pointer;transition: opacity .3s cubic-bezier(.215, .61, .355, 1);
}@media screen and (min-width: 780px)
{
.character-carouselMain .slick-prev:hover
{
opacity: .6;
}
}@media screen and (max-width: 779px)
{
.character-carouselMain .slick-prev
{
top: 30%;left: 9.375vw;
width: 6.25vw;height: 8.59375vw;;
}
}.character-carouselMain .slick-prev:before
{
display: block;width: 100%;height: 100%;
content: '';transform: rotate(180deg);transform-origin: center;background-image: url(../img/common-arrow-v.svg);background-repeat: no-repeat;background-size: contain;;
}.character-carouselMain .slick-next
{
z-index: 5;
right: 20px;width: 25px;height: 36px;cursor: pointer;transition: opacity .3s cubic-bezier(.215, .61, .355, 1);;
}.character-carouselMain .slick-next:hover
{
opacity: .6;
}@media screen and (max-width: 779px)
{
.character-carouselMain .slick-next
{
top: 30%;right: 9.375vw;width: 6.25vw;height: 8.59375vw;;
}
}.character-carouselMain .slick-next:before
{
display: block;width: 100%;height: 100%;
content: '';background-image: url(../img/common-arrow-v.svg);background-repeat: no-repeat;background-size: contain;;
}.character-carouselNav
{
display: flex;flex-wrap: wrap;width: 600px;margin: 0 auto;margin-top: 20px;;
}@media screen and (max-width: 779px)
{
.character-carouselNav
{
width: 94.6875vw;
margin-top: 0;;
}
}.character-carouselNav__item
{
position: relative;display: flex;align-items: center;justify-content: center;width: 136px;height: 72px;margin: 0 7px 14px;cursor: pointer;
background-color: #000;;
}@media screen and (max-width: 779px)
{
.character-carouselNav__item
{
width: 21.25vw;height: 11.25vw;margin: 0 .9375vw 1.875vw;
}
}.character-carouselNav__item.is-active img
{
opacity: 1;
}.character-carouselNav__item:hover img
{
opacity: 1;
}.character-carouselNav__item:before
{
position: absolute;z-index: 2;top: 0;left: 0;width: 100%;height: 100%;
content: '';background-image: url(../img/character-thumbframe--pc.png);background-repeat: no-repeat;background-size: 100%;;
}@media screen and (max-width: 779px)
{
.character-carouselNav__item:before
{
background-image: url(../img/character-thumbframe--sp.png);
}
}.character-carouselNav__item img
{
position: relative;z-index: 1;transition: opacity .3s cubic-bezier(.215, .61, .355, 1);opacity: .5;;
}@media screen and (max-width: 779px)
{
.character-carouselNav__item img
{
width: 21.25vw;height: 11.25vw;
}
}.character-carouselMain__item
{
text-align: center;
}.character-carouselMain__item .lead,
.character-carouselMain__item .img,
.character-carouselMain__item .text,
.character-carouselMain__item .bg,
.character-carouselMain__item .desc,
.character-carouselMain__item .voices,
.character-carouselMain__item .emblem,
.character-carouselMain__item .btn
{
opacity: 0;filter: blur(5px);
}.character-carouselMain__item .lead
{
transition: .3s cubic-bezier(.55, .085, .68, .53) .3s;transform: translateX(-48%);
}@media screen and (max-width: 779px)
{
.character-carouselMain__item .lead
{
transform: translateX(0%);
}
}.character-carouselMain__item .img
{
transition: .3s cubic-bezier(.55, .085, .68, .53);
}.character-carouselMain__item .text,
.character-carouselMain__item desc,
.character-carouselMain__item .emblem,
.character-carouselMain__item .btn
{
transition: .3s cubic-bezier(.55, .085, .68, .53) .3s;transform: translateX(3%);
}.character-carouselMain__item .bg
{
transition: .6s cubic-bezier(.215, .61, .355, 1) .3s;
}.character-carouselMain__item .voices
{
transition: .6s cubic-bezier(.215, .61, .355, 1) .3s;
}.slick-current .lead,
.slick-current .img,
.slick-current .text,
.slick-current .bg,
.slick-current .desc,
.slick-current .voices,
.slick-current .emblem,
.slick-current .btn
{
opacity: 1;filter: blur(0px);
}.slick-current .lead
{
transform: translateX(-50%);
}@media screen and (max-width: 779px)
{
.slick-current .lead
{
transform: translateX(0%);
}
}.slick-current .text,
.slick-current .btn
{
transform: translateX(0px);
}.pre-registration
{
position: relative;z-index: 2;
padding-top: 280px;padding-bottom: 95px;text-align: center;background-image: url(../img/pre-registration-bg--pc.png);background-repeat: no-repeat;background-position: center center;background-size: cover;;
}@media screen and (max-width: 779px)
{
.pre-registration
{
padding-top: 37.5vw;padding-bottom: 14.84375vw;background-image: url(../img/pre-registration-bg--sp.png);background-position: top center;background-size: 100%;;
}
}@media screen and (min-width: 780px)
{
.pre-registration
{
background-attachment: fixed;
}.pre-registration img
{
width: auto;
}
}@media screen and (max-width: 779px)
{
.pre-registration-heading1 img
{
width: 64.53125vw;
}
} .pre-registration-inner
{
max-width: 1080px;margin: 0 auto;background-color: #03000d;;
}@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-inner
{
width: 81.25vw;padding-bottom: 0;
}
}
.pre-registration-break
{
margin-bottom: 0;
}
@media screen and (max-width: 779px)
{
.pre-registration-break img
{
width: 81.53125vw;
}
}
.pre-registration .pre-registration-lead
{
margin-bottom: 40px;
}@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-lead
{
margin-bottom: 13.4375vw;
}.pre-registration .pre-registration-lead img
{
width: 64.53125vw;
}
}.pre-registration .pre-registration-sns
{
display: flex;align-items: center;flex-wrap: wrap;justify-content: center;margin-bottom: 45px;
}@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-sns
{
margin-bottom: 10.625vw;
}
}.pre-registration .pre-registration-sns__item
{
position: relative;padding: 0 43px;padding-bottom: 60px;
}
.pre-registration .pre-registration-sns div:nth-of-type(3) span
{
bottom: 17px;
}
@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-sns__item
{
padding: 0 7.5vw;padding-bottom: 20.15625vw;
}.pre-registration .pre-registration-sns__item img
{
width: 11.71875vw;
}
.pre-registration .pre-registration-sns div:nth-of-type(3) span
{
bottom: 2.5vw;
}
}@media screen and (min-width: 780px)
{
.pre-registration .pre-registration-sns__item a
{
transition: opacity .15s linear;
}.pre-registration .pre-registration-sns__item a:hover
{
opacity: .4;
}
}.pre-registration .pre-registration-sns__item span
{
position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);
}@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-sns__item span img
{
width: auto;
height: 14.0625vw;
}
.pre-registration .pre-registration-sns div:nth-of-type(3) span img
{
width: auto;
height: 9.375vw;
}
}.pre-registration-app
{
display: flex;align-items: center;align-items: flex-start;flex-wrap: wrap;justify-content: center;margin-top: 30px;margin-bottom: 60px;
}@media screen and (max-width: 779px)
{
.pre-registration-app
{
margin-top: 7.1875vw;
margin-bottom: 14.375vw;
}
}.pre-registration-app__item
{
padding: 0 20px;
}@media screen and (max-width: 779px)
{
.pre-registration-app__item
{
padding: 0 1.5625vw;
}
}@media screen and (min-width: 780px)
{
.pre-registration-app__item a
{
transition: opacity .15s linear;
}.pre-registration-app__item a:hover
{
opacity: .4;
}
}.pre-registration-app__item img
{
width: auto;height: 47px;
}@media screen and (max-width: 779px)
{
.pre-registration-app__item img
{
height: 12.1875vw;
}
}.pre-registration-twitter
{
margin-top: 90px;
}@media screen and (max-width: 779px)
{
.pre-registration-twitter
{
margin-top: 20.3125vw;
}
}.pre-registration .pre-registration-twitter__heading
{
margin-bottom: 12px;
}@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-twitter__heading
{
margin-bottom: 3.125vw;
}
}@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-twitter__heading img
{
width: 51.5625vw;
}
}.pre-registration .pre-registration-twitter__widget
{
width: 550px;height: 575px;margin: 0 auto 30px;border: 1px solid #2f3336;
}@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-twitter__widget
{
width: 81.25vw;height: 114.0625vw;margin-bottom: 6.25vw;
}
}.pre-registration .pre-registration-heading2
{
position: relative;
}.pre-registration .pre-registration-heading2 img
{
position: relative;
}@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-heading2 img
{
width: 100vw;
}
}.pre-registration .pre-registration-heading2 span
{
position: relative;z-index: 1;
display: block;padding-top: 26px;;
}@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-heading2 span
{
padding-top: 5.3125vw;
}.pre-registration .pre-registration-heading2 span img
{
width: 63.28125vw;
}
}.pre-registration .pre-registration-heading2:before
{
position: absolute;top: -40px;left: 50%;display: block;width: 555px;height: 553px;
content: '';transform: translateX(-50%);background-image: url(../img/pre-registration-bg2--pc.png);
}@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-heading2:before
{
top: -9.375vw;
width: 95.78125vw;height: 69.0625vw;background-image: url(../img/pre-registration-bg2--sp.png);background-repeat: no-repeat;background-size: contain;;
}
}.pre-registration .pre-registration-btn
{
position: relative;display: flex;align-items: center;justify-content: center;width: 750px;height: 92px;margin: 50px auto 10px;background-image: url(../img/pre-registration-btn--pc.png);;
}@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-btn
{
width: 92.1875vw;height: 25.3125vw;margin: 14.84375vw auto 1.5625vw;transform: translateX(-5vw);
background-image: url(../img/pre-registration-btn--sp.png);background-size: 100%;;
}.pre-registration .pre-registration-btn img
{
width: 64.0625vw;
}
}.pre-registration .pre-registration-detail
{
position: relative;margin-bottom: 70px;
}@media screen and (max-width: 779px)
{
.pre-registration .pre-registration-detail
{
margin-bottom: 15.625vw;
}.pre-registration .pre-registration-detail img
{
width: 88.75vw;transform: translateX(-3.28125vw);
}
}.cbt
{
position: relative;padding-top: 112px;padding-bottom: 40px;
text-align: center;;
}@media screen and (max-width: 779px)
{
.cbt
{
padding-top: 10.9375vw;padding-bottom: 25vw;
}
}.cbt:after
{
position: absolute;z-index: 0;top: 100px;left: 50%;width: 822px;height: 421px;
content: '';transform: translateX(-50%);background-image: url(../img/cbt-bg--pc.png);background-repeat: no-repeat;;
}.cbt .cbt-inner
{
position: relative;z-index: 1;
}@media screen and (min-width: 780px)
{
.cbt img
{
width: auto;
}
}.cbt .cbt-heading
{
margin-bottom: 31px;
}@media screen and (max-width: 779px)
{
.cbt .cbt-heading
{
margin-bottom: 6.25vw;
}.cbt .cbt-heading img
{
width: 73.4375vw;
}
}.cbt .cbt-lead
{
margin-bottom: 48px;
}@media screen and (max-width: 779px)
{
.cbt .cbt-lead
{
margin-bottom: 7.8125vw;
}.cbt .cbt-lead img
{
width: 98.125vw;
}
}.cbt .cbt-btn a
{
position: relative;display: block;
width: 288px;margin: 0 auto;;
}.cbt .cbt-btn a picture
{
position: relative;
transition: opacity .3s cubic-bezier(.215, .61, .355, 1);;
}.cbt .cbt-btn a .hover
{
position: absolute;z-index: -1;top: 0;left: 0;;
}@media screen and (min-width: 780px)
{
.cbt .cbt-btn a:hover picture
{
opacity: 0;
}
}@media screen and (max-width: 779px)
{
.cbt .cbt-btn a
{
width: 66.40625vw;
}
}.overview
{
font-family: sans-serif;position: relative;padding: 85px 0 0 0;
border-top: 2px solid #4d4c51;;
}@media screen and (max-width: 779px)
{
.overview
{
padding: 15.625vw 0 0vw;
}
}.overview:before
{
position: absolute;z-index: 1;top: 0;left: 0;width: 100%;height: 100%;
content: '';background-color: rgba(0,0,0,.5);
}.overview:after
{
position: absolute;z-index: 0;bottom: 290px;left: 50%;width: 2000px;height: 1338px;content: '';transform: translateX(-50%);
pointer-events: none;background-image: url(../img/overview-bg--pc.png);background-size: 100%;;
}@media screen and (max-width: 779px)
{
.overview:after
{
bottom: 0;width: 100vw;height: 180.625vw;
background-image: url(../img/overview-bg--sp.png);background-size: cover;
}
}.overview .overview-inner
{
position: relative;z-index: 2;overflow: hidden;padding-bottom: 100px;
}@media screen and (max-width: 779px)
{
.overview .overview-inner
{
padding: 0;
}
}.overview .overview-wrapper
{
position: relative;z-index: 2;
}.overview .overview-detail
{
display: flex;align-items: center;flex-wrap: wrap;justify-content: space-between;width: 330px;margin: 0 auto;;
}@media screen and (max-width: 779px)
{
.overview .overview-detail
{
width: 100%;padding: 0 6.25vw;
}
}.overview .overview-detail__img
{
width: 70px;
}@media screen and (max-width: 779px)
{
.overview .overview-detail__img
{
width: 22.65625vw;
}
}.overview .overview-detail__img a
{
display: block;
}@media screen and (min-width: 780px)
{
.overview .overview-detail__img a
{
transition: opacity .15s linear;
}.overview .overview-detail__img a:hover
{
opacity: .4;
}
}.overview .overview-detail__table
{
width: 246px;
}@media screen and (max-width: 779px)
{
.overview .overview-detail__table
{
width: 59.375vw;
}
}.overview .overview-detail__table table
{
width: 100%;
}.overview .overview-detail__table table tr th,
.overview .overview-detail__table table tr td
{
border-top: 1px solid #35333d;
}.overview .overview-detail__table table tr:first-child th,
.overview .overview-detail__table table tr:first-child td
{
border-top: 0;
}.overview .overview-detail__table table th
{
font-size: 12px;padding: 9px 0;padding-left: 10px;text-align: left;
color: #fff;;
}@media screen and (max-width: 779px)
{
.overview .overview-detail__table table th
{
font-size: 3.28125vw;padding: 2.5vw 0;
}
}.overview .overview-detail__table table td
{
font-size: 12px;padding: 9px 0;padding-right: 10px;
text-align: right;color: #fff;;
}@media screen and (max-width: 779px)
{
.overview .overview-detail__table table td
{
font-size: 3.28125vw;padding: 2.5vw 0;
}
}.overview .overview-lead
{
margin-top: 68px;
text-align: center;;
}@media screen and (max-width: 779px)
{
.overview .overview-lead
{
margin-top: 14.84375vw;
}
}.overview .overview-lead img
{
width: auto;
}@media screen and (max-width: 779px)
{
.overview .overview-lead img
{
width: 61.71875vw;
}
}.overview .overview-banner
{
width: 800px;margin: 80px auto 0;padding-top: 80px;border-top: 1px solid #343338;
}@media screen and (max-width: 779px)
{
.overview .overview-banner
{
width: 100%;margin-top: 15.625vw;padding-top: 14.0625vw;padding-bottom: 18.75vw;
}
}.overview .overview-banner__heading
{
margin-bottom: 22px;
text-align: center;;
}@media screen and (max-width: 779px)
{
.overview .overview-banner__heading
{
margin-bottom: 4.6875vw;
}
}.overview .overview-banner__heading img
{
width: auto;
}@media screen and (max-width: 779px)
{
.overview .overview-banner__heading img
{
width: 74.6875vw;
}
}.overview .overview-banner a
{
display: block;width: 440px;margin: 0 auto;
}@media screen and (min-width: 780px)
{
.overview .overview-banner a
{
transition: opacity .15s linear;
}.overview .overview-banner a:hover
{
opacity: .4;
}
}@media screen and (max-width: 779px)
{
.overview .overview-banner a
{
width: 81.25vw;
}
}.staff
{
padding-top: 94px;padding-bottom: 114px;text-align: center;background-position: top center;
background-size: cover;;
}@media screen and (max-width: 779px)
{
.staff
{
padding: 0 9.375vw;
}
}@media screen and (min-width: 780px)
{
.staff img
{
width: auto;
}
}.staff .staff-heading
{
margin-bottom: 64px;
}@media screen and (max-width: 779px)
{
.staff .staff-heading
{
margin-bottom: 12.5vw;
}.staff .staff-heading img
{
width: 73.4375vw;
}
}.staff .staff-lead
{
margin-bottom: 15px;
}@media screen and (max-width: 779px)
{
.staff .staff-lead
{
margin-bottom: 3.125vw;
}.staff .staff-lead img
{
width: 64.53125vw;
}
}.staff .staff-desc
{
margin-top: -20px;
}@media screen and (max-width: 779px)
{
.staff .staff-desc
{
margin-top: 0;
}.staff .staff-desc img
{
width: 85.15625vw;
}
}.staff .staff-list
{
margin-top: 60px;
}@media screen and (max-width: 779px)
{
.staff .staff-list
{
margin-top: 14.0625vw;
}
}.staff .staff-list__row
{
display: flex;align-items: flex-start;flex-wrap: wrap;justify-content: center;margin-bottom: 44px;
}@media screen and (max-width: 779px)
{
.staff .staff-list__row
{
margin-bottom: 12.5vw ;margin-bottom: 15.625vw;
}
}.staff .staff-list__row.row1
{
margin-bottom: 70px;
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row1
{
margin-bottom: 19.375vw;
}
}.staff .staff-list__row.row1 .staff-list__item
{
width: 100%;
}.staff .staff-list__row.row1 .staff-list__item:nth-child(1)
{
margin-bottom: 75px;
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row1 .staff-list__item:nth-child(1)
{
margin-bottom: 14.6875vw;
}
}.staff .staff-list__row.row1 .staff-list__item:nth-child(1) span:nth-child(1)
{
margin-bottom: 42px;
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row1 .staff-list__item:nth-child(1) span:nth-child(1)
{
margin-bottom: 8.4375vw;
}
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row1 .staff-list__item:nth-child(1) span:nth-child(1) img
{
width: 81.25vw;
}
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row1 .staff-list__item:nth-child(1) span:nth-child(2) img
{
width: 69.53125vw;
}
}.staff .staff-list__row.row1 .staff-list__item:nth-child(2) span:nth-child(1)
{
margin-bottom: 42px;
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row1 .staff-list__item:nth-child(2) span:nth-child(1)
{
margin-bottom: 8.4375vw;
}
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row1 .staff-list__item:nth-child(2) span:nth-child(1) img
{
width: 81.25vw;
}
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row1 .staff-list__item:nth-child(2) span:nth-child(2) img
{
width: 32.03125vw;
}
}.staff .staff-list__row.row2
{
margin-bottom: 75px;
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row2
{
margin-top: 14.0625vw;margin-bottom: 17.1875vw;
}
}.staff .staff-list__row.row2 .staff-list__item span:nth-child(1)
{
margin-bottom: 52px;
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row2 .staff-list__item span:nth-child(1)
{
margin-bottom: 8.4375vw;
}
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row2 .staff-list__item span:nth-child(2) img
{
width: 56.40625vw;
}
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row3
{
margin-bottom: 28.125vw;
}
}.staff .staff-list__row.row3 .staff-list__item span:nth-child(1)
{
margin-bottom: 42px;
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row3 .staff-list__item span:nth-child(1)
{
margin-bottom: 8.4375vw;
}
}@media screen and (max-width: 779px)
{
.staff .staff-list__row.row3 .staff-list__item span:nth-child(2) img
{
width: 77.5vw;
}
}.staff .staff-list__item
{
display: flex;flex-direction: column;justify-content: center;;
}.io-ready
{
visibility: hidden;
opacity: 0;will-change: transform, opacity;
}@keyframes slideIn
{
0%
{
transform: translateY(25px);
opacity: 0;@media screen and (max-width: 779px)
{
transform: translateY(2.34375vw);
}
}100%
{
transform: translateY(0);
opacity: 1;;
}
}@keyframes fadeIn
{
0%
{
opacity: 0;
}100%
{
opacity: 1;
}
}.io-ready.is-animated
{
visibility: visible;animation: fadeIn 1s ease forwards;
}.io-ready.is-animated.slidein
{
animation: slideIn 1s ease forwards;
}.particles
{
position: absolute;
width: 1440px;height: 800px;pointer-events: none;
}@media screen and (max-width: 779px)
{
.particles
{
width: 100vw;height: auto;
}
}.particles.reversed img
{
transform: rotate(180deg);
}.mv .particles
{
top: -350px;left: 50%;transform: translateX(-50%);
}@media screen and (max-width: 779px)
{
.mv .particles
{
top: -62.5vw;
}
}#intro .particles
{
bottom: -200px;left: 50%;transform: translateX(-50%);
}@media screen and (max-width: 779px)
{
#intro .particles
{
bottom: -46.875vw;
}
}#world
{
position: relative;
}#world .particles
{
top: -250px;left: 50%;transform: translateX(-50%);
}@media screen and (max-width: 779px)
{
#world .particles
{
bottom: -31.25vw;
}
}#character
{
position: relative;
}#character .particles
{
bottom: -250px;left: 50%;transform: translateX(-50%);
}#overview
{
position: relative;box-sizing: border-box;
}#overview .particles
{
bottom: -350px;left: 50%;transform: translateX(-50%);
}#news .particles
{
z-index: -1;bottom: -300px;
}@media screen and (max-width: 779px)
{
#news .particles
{
bottom: -39.0625vw;
}
}#news
{
position: relative;
background-image: url(../img/news/news-bg1--pc.png);background-repeat: no-repeat;background-position: top center;background-size: 2000px;;
}@media screen and (max-width: 779px)
{
#news
{
background-image: url(../img/news/news-bg1--sp.png);background-size: 100%;
}
}#news .symbol-arrow,
#news .symbol-blank
{
display: none;
}#news .main-container
{
position: relative;overflow: hidden;
padding-bottom: 120px;background-image: url(../img/news/news-bg2--pc.png);background-repeat: no-repeat;background-position: center bottom;background-size: 2000px;;
}@media screen and (max-width: 779px)
{
#news .main-container
{
padding-bottom: 23.4375vw;
background-image: url(../img/news/news-bg2--sp.png);background-size: 100%;;
}
}#news .news-heading
{
margin-bottom: 80px;
padding-top: 110px;text-align: center;
}@media screen and (max-width: 779px)
{
#news .news-heading
{
margin-bottom: 12.5vw;
padding-top: 29.6875vw;;
}
}#news .news-heading img
{
width: auto;
}@media screen and (max-width: 779px)
{
#news .news-heading img
{
width: 67.1875vw;
}
}#news .news-list
{
width: 780px;margin: 0 auto 60px;padding-top: 7px;background-image: url(../img/news/news-line--pc.png);background-repeat: no-repeat;background-position: left top;
}@media screen and (max-width: 779px)
{
#news .news-list
{
width: 90.625vw;margin: 12.5vw auto 14.0625vw;padding-top: 1.25vw;;
}
}#news .news-list .news-item
{
background-image: url(../img/news/news-line--pc.png);background-repeat: no-repeat;background-position: left bottom;
}#news .news-list .news-item a
{
position: relative;display: block;padding: 22px 80px 20px 20px;
color: #fff;;
}@media screen and (max-width: 779px)
{
#news .news-list .news-item a
{
padding: 6.09375vw 14.0625vw 6.25vw 3.125vw;
}
}#news .news-list .news-item a .arrow,
#news .news-list .news-item a .blank
{
position: absolute;top: 50%;right: 20px;width: 11px;transform: translateY(-50%);fill: #fff;
}@media screen and (min-width: 780px)
{
#news .news-list .news-item a:hover .news-item__text
{
text-decoration: underline;
color: #dac684;;
}#news .news-list .news-item a:hover .arrow,
#news .news-list .news-item a:hover .blank
{
transition: fill .3s cubic-bezier(.215, .61, .355, 1);fill: #dac684;
}
}#news .news-list .news-item__head
{
display: flex;align-items: center;flex-wrap: wrap;justify-content: flex-start;
margin-bottom: 10px;;
}@media screen and (max-width: 779px)
{
#news .news-list .news-item__head
{
margin-bottom: 2.34375vw;
}
}#news .news-list .news-item__head .date
{
font-size: 14px;padding-right: 12px;
}@media screen and (max-width: 779px)
{
#news .news-list .news-item__head .date
{
font-size: 3.75vw;padding-right: 3.125vw;
}
}#news .news-list .news-item__head .tag
{
font-size: 13px;line-height: 1;
padding: 3px 7px;border-radius: 3px;
}#news .news-list .news-item__head .tag.tag1
{
color: #fff;
background-color: #3492e8;
}#news .news-list .news-item__head .tag.tag2
{
color: #000;
background-color: #ca6ec8;
}#news .news-list .news-item__head .tag.tag3
{
color: #fff;
background-color: red;
}
@media screen and (max-width: 779px)
{
#news .news-list .news-item__head .tag
{
font-size: 3.4375vw;
padding: .78125vw 1.40625vw;;
}
}#news .news-list .news-item__text
{
font-size: 16px;line-height: 1.5;transition: color .3s cubic-bezier(.215, .61, .355, 1);
}@media screen and (max-width: 779px)
{
#news .news-list .news-item__text
{
font-size: 4.0625vw;
}
}#news .news-btn
{
text-align: center;
}#news .news-btn span
{
cursor: pointer;
}#news .news-btn img
{
width: auto;
}@media screen and (max-width: 779px)
{
#news .news-btn img
{
width: 43.4375vw;
}
}#news .news-article
{
width: 780px;margin: 0 auto 60px;color: #fff;
}@media screen and (max-width: 779px)
{
#news .news-article
{
width: 90.625vw;margin: 0vw auto 14.0625vw;padding-top: 1.25vw;;
}
}#news .news-article .news-article-heading
{
font-size: 20px;line-height: 1.5;margin-bottom: 15px;padding-top: 135px;padding-bottom: 38px;background-image: url(../img/news/news-line--pc.png);background-repeat: no-repeat;background-position: left bottom;background-size: 100%;
}@media screen and (max-width: 779px)
{
#news .news-article .news-article-heading
{
font-size: 5.625vw;padding-top: 34.375vw;
padding-bottom: 7.5vw;background-image: url(../img/news/news-line--sp.png);background-repeat: no-repeat;background-position: left bottom;;
}
}#news .news-article .news-article-head
{
display: flex;align-items: center;flex-wrap: wrap;justify-content: flex-start;
margin-bottom: 40px;;
}@media screen and (max-width: 779px)
{
#news .news-article .news-article-head
{
margin-bottom: 7.8125vw;
}
}#news .news-article .news-article-head .date
{
font-size: 14px;padding-right: 12px;
}@media screen and (max-width: 779px)
{
#news .news-article .news-article-head .date
{
font-size: 3.75vw;padding-right: 3.125vw;
}
}#news .news-article .news-article-head .tag
{
font-size: 13px;line-height: 1;
padding: 3px 7px;border-radius: 3px;
}#news .news-article .news-article-head .tag.tag1
{
color: #fff;
background-color: #3492e8;
}#news .news-article .news-article-head .tag.tag2
{
color: #000;
background-color: #ca6ec8;
}#news .news-article .news-article-head .tag.tag3
{
color: #fff;
background-color: red;
}
@media screen and (max-width: 779px)
{
#news .news-article .news-article-head .tag
{
font-size: 3.4375vw;
padding: .78125vw 1.40625vw;;
}
}#news .news-article .news-article-conts .img
{
margin-bottom: 30px;
}@media screen and (max-width: 779px)
{
#news .news-article .news-article-conts .img
{
margin-bottom: 7.8125vw;
}
}#news .news-article .news-article-conts p
{
font-size: 16px;line-height: 1.5;
}@media screen and (max-width: 779px)
{
#news .news-article .news-article-conts p
{
font-size: 4.375vw;line-height: 1.78571;
}
}#news .news-article .news-article-conts a
{
display: inline-block;text-decoration: underline;color: #dac684;;
}#news .news-article .news-article-conts a:hover
{
text-decoration: none;
}#news .news-article .news-article-conts a:after
{
display: inline-block;width: 10px;height: 14px;margin-left: 7px;content: '';vertical-align: text-bottom;background-image: url(../img/common-arrow-v-colored.svg);background-repeat: no-repeat;background-position: center;background-size: 100%;background-size: contain;;
}@media screen and (max-width: 779px)
{
#news .news-article .news-article-conts a:after
{
width: 2.5vw;height: 3.125vw;vertical-align: -1px;
}
}#news .news-article .news-article-conts a[target='_blank']:after
{
background-image: url(../img/common-icon-blank_colored.svg);
}#news.cbt-page .news-article .news-article-heading
{
font-size: 24px;font-weight: bold;text-align: center;color: #dac684;
}@media screen and (max-width: 779px)
{
#news.cbt-page .news-article .news-article-heading
{
font-size: 5.375vw;
}
}#news.cbt-page .news-article .news-article-conts p
{
margin-top: 14px;
}#news.cbt-page .news-article .news-article-conts .subTitle
{
font-size: 20px;text-align: center;
}@media screen and (max-width: 779px)
{
#news.cbt-page .news-article .news-article-conts .subTitle
{
font-size: 4.375vw;
}
}#news.cbt-page .news-article .news-article-conts .cbtDate
{
font-size: 20px;text-align: center;
}@media screen and (max-width: 779px)
{
#news.cbt-page .news-article .news-article-conts .cbtDate
{
font-size: 3.5vw;
}
}@media screen and (max-width: 779px)
{
#news.cbt-page .news-article .news-article-conts p
{
font-size: 3vw;line-height: 1.78571;
}
}#news.cbt-page .news-article .news-article-conts .text-o
{
font-weight: bold;color: orange;
}#news.cbt-page .news-article .news-article-conts .ss
{
display: block;width: 440px;margin: 0 auto;
}@media screen and (max-width: 779px)
{
#news.cbt-page .news-article .news-article-conts .ss
{
width: 80%;
}
}#news.cbt-page .news-article .news-article-conts .atte
{
font-size: 14px;
}@media screen and (max-width: 779px)
{
#news.cbt-page .news-article .news-article-conts .atte
{
font-size: 2.8vw;
}
}#news.cbt-page .news-article .news-article-conts .cbt-btn-wrap
{
display: flex;justify-content: center;margin: 30px auto;
}@media screen and (max-width: 779px)
{
#news.cbt-page .news-article .news-article-conts .cbt-btn-wrap
{
display: block;margin: 6% auto;
}
}#news.cbt-page .news-article .news-article-conts .cbt-btn-wrap .cbt-btn a
{
position: relative;display: block;width: 288px;margin: 0 auto;
}#news.cbt-page .news-article .news-article-conts .cbt-btn-wrap .cbt-btn a picture
{
position: relative;transition: opacity .3s cubic-bezier(.215, .61, .355, 1);
}#news.cbt-page .news-article .news-article-conts .cbt-btn-wrap .cbt-btn a .hover
{
position: absolute;z-index: -1;top: 0;left: 0;
}#news.cbt-page .news-article .news-article-conts .cbt-btn-wrap .cbt-btn a:hover picture
{
opacity: 0;
}#news.cbt-page .news-article .news-article-conts .cbt-btn-wrap .cbt-btn a:after
{
display: none;
}@media screen and (max-width: 779px)
{
#news.cbt-page .news-article .news-article-conts .cbt-btn-wrap .cbt-btn a
{
width: 66.40625vw;
}
}#news.cbt-page .news-article .news-article-conts .is-textC
{
text-align: center;
}#news.cbt-page .news-article .news-article-conts .textList
{
font-size: 16px;line-height: 2;margin-top: 15px;
}@media screen and (max-width: 779px)
{
#news.cbt-page .news-article .news-article-conts .textList
{
font-size: 2.8vw;line-height: 1.78571;
}
}#news.cbt-page .news-article .news-article-conts .textList li:before
{
position: relative;top: -1px;display: inline-block;width: 5px;height: 5px;margin-right: 5px;content: '';border-radius: 50%;background-color: #dac684;
}#news.cbt-page .news-article .news-article-conts .rule-text
{
font-size: 16px;line-height: 2;margin-top: 15px;
}@media screen and (max-width: 779px)
{
#news.cbt-page .news-article .news-article-conts .rule-text
{
font-size: 2.8vw;line-height: 1.78571;
}
}#news.cbt-page .news-article .news-article-conts .rule-text li
{
margin-bottom: 2%;
}#news.cbt-page .news-article .news-article-conts .atteList
{
font-size: 14px;line-height: 2;margin-top: 15px;
}@media screen and (max-width: 779px)
{
#news.cbt-page .news-article .news-article-conts .atteList
{
font-size: 2.8vw;line-height: 1.78571;
}
}#news.cbt-page .news-article .news-article-conts .atteList li:before
{
position: relative;top: -1px;display: inline-block;width: 2px;height: 2px;margin-right: 5px;content: '';border-radius: 50%;background-color: #fff;
}#page-knights .overview:after
{
display: none;
}#page-character .overview:after
{
display: none;
}.switchingBg span
{
position: absolute;top: 0;left: 50%;
display: block;width: 100%;height: 1928px;transition: opacity .2s;transform: translateX(-50%);pointer-events: none;opacity: 0;background-repeat: no-repeat;background-position: top center;background-size: 2000px;;
}@media screen and (max-width: 779px)
{
.switchingBg span
{
background-size: 100%;
}
}.switchingBg span.is-visible
{
opacity: 1;
}.switchingBg span[data-bg='1']
{
background-image: url(../img/knights_character/knights-bg1--pc.png);
}@media screen and (max-width: 779px)
{
.switchingBg span[data-bg='1']
{
background-image: url(../img/knights_character/knights-bg1--sp.png);
}
}.switchingBg span[data-bg='2']
{
background-image: url(../img/knights_character/knights-bg2--pc.png);
}@media screen and (max-width: 779px)
{
.switchingBg span[data-bg='2']
{
background-image: url(../img/knights_character/knights-bg2--sp.png);
}
}.switchingBg span[data-bg='3']
{
background-image: url(../img/knights_character/knights-bg3--pc.png);
}@media screen and (max-width: 779px)
{
.switchingBg span[data-bg='3']
{
background-image: url(../img/knights_character/knights-bg3--sp.png);
}
}.switchingBg span[data-bg='4']
{
background-image: url(../img/knights_character/knights-bg4--pc.png);
}@media screen and (max-width: 779px)
{
.switchingBg span[data-bg='4']
{
background-image: url(../img/knights_character/knights-bg4--sp.png);
}
}.knights-heading
{
position: relative;z-index: 2;padding-top: 106px;
text-align: center;;
}@media screen and (max-width: 779px)
{
.knights-heading
{
padding-top: 29.6875vw;
}
}.knights-heading img
{
width: auto;
}@media screen and (max-width: 779px)
{
.knights-heading img
{
width: 67.1875vw;
}
}.character-heading
{
padding-top: 106px;
text-align: center;;
}.character-heading img
{
width: auto;
}@media screen and (max-width: 779px)
{
.character-heading img
{
width: 67.1875vw;
}
}.character-localNav-heading
{
margin-bottom: 35px;text-align: center;
}.character-localNav-heading img
{
width: auto;
}@media screen and (max-width: 779px)
{
.character-localNav-heading img
{
width: 67.1875vw;
}
}.character-localNav
{
display: flex;flex-wrap: wrap;width: 600px;margin: 0 auto 140px;margin-top: 20px;;
}@media screen and (max-width: 779px)
{
.character-localNav
{
width: 94.6875vw;
margin-top: 0;margin-bottom: 21.875vw;
}
}.character-localNav__item
{
position: relative;display: flex;align-items: center;justify-content: center;width: 136px;height: 72px;margin: 0 7px 14px;cursor: pointer;
background-color: #000;;
}@media screen and (max-width: 779px)
{
.character-localNav__item
{
width: 21.25vw;height: 11.25vw;margin: 0 .9375vw 1.875vw;
}
}.character-localNav__item:before
{
position: absolute;z-index: 2;top: 0;left: 0;width: 100%;height: 100%;content: '';
pointer-events: none;background-image: url(../img/character-thumbframe--pc.png);background-repeat: no-repeat;background-size: 100%;;
}@media screen and (max-width: 779px)
{
.character-localNav__item:before
{
background-image: url(../img/character-thumbframe--sp.png);
}
}.character-localNav__item img
{
position: relative;z-index: 1;transition: opacity .3s cubic-bezier(.215, .61, .355, 1);
}@media screen and (max-width: 779px)
{
.character-localNav__item img
{
width: 21.25vw;height: 11.25vw;
}
}.character-carouselMain--lower .slick-next,
.character-carouselMain--lower .slick-prev
{
top: 31%;
}@media screen and (max-width: 779px)
{
.character-carouselMain--lower .slick-next,
.character-carouselMain--lower .slick-prev
{
top: 20%;
}
}@media screen and (min-width: 780px)
{
.character-carouselMain--lower .img
{
margin-top: -30px;
}
}@media screen and (max-width: 779px)
{
.character-carouselMain--lower .img
{
margin-top: -11.71875vw;
}
}.character-carouselMain--lower .bg
{
top: -200px;
}@media screen and (max-width: 779px)
{
.character-carouselMain--lower .bg
{
top: -14.0625vw;
}
}.character-carouselMain--lower .emblem
{
position: absolute;top: 220px;left: 66px;
}@media screen and (max-width: 779px)
{
.character-carouselMain--lower .emblem
{
top: 45.9375vw;right: 0;left: auto;
width: 50%;;
}
}.character-carouselMain--lower .text
{
margin-left: 166px;
}.character-carouselMain--lower .voices
{
position: absolute;z-index: 2;top: 454px;right: 30px;;
}@media screen and (max-width: 779px)
{
.character-carouselMain--lower .voices
{
position: static;display: flex;justify-content: space-between;width: 90.625vw;margin: 0 auto 7.8125vw;
}
}.character-carouselMain--lower .voices > *
{
width: 138px;height: 44px;cursor: pointer;background-size: contain;;
}@media screen and (max-width: 779px)
{
.character-carouselMain--lower .voices > *
{
width: 43.4375vw;height: 11.25vw;
}
}.character-carouselMain--lower .voices .voice1
{
background-image: url(../img/knights_character/character-voicebtn1--pc.png);
}@media screen and (max-width: 779px)
{
.character-carouselMain--lower .voices .voice1
{
background-image: url(../img/knights_character/character-voicebtn1--sp.png);
}
}.character-carouselMain--lower .voices .voice2
{
background-image: url(../img/knights_character/character-voicebtn2--pc.png);
}@media screen and (max-width: 779px)
{
.character-carouselMain--lower .voices .voice2
{
background-image: url(../img/knights_character/character-voicebtn2--sp.png);
}
}@media screen and (max-width: 779px)
{
.character-carouselMain--lower .text
{
top: 81.25vw;right: 0;
width: 50%;margin: 0;;
}.character-carouselMain--lower .text img
{
width: 100%;
}
}.character-carouselMain--lower .desc
{
width: 680px;margin: -25px auto 50px;
}@media screen and (max-width: 779px)
{
.character-carouselMain--lower .desc
{
width: 100%;margin-top: .78125vw;margin-bottom: 9.375vw;
}.character-carouselMain--lower .desc img
{
width: 100%;
}
}@media screen and (min-width: 780px)
{
.character-carouselMain--lower .text img
{
width: auto !important;
}
}.character-carouselNav
{
position: relative;padding-bottom: 50px;
}@media screen and (max-width: 779px)
{
.character-carouselNav
{
padding-bottom: 12.5vw;
}
}.character-carouselNav:after
{
position: absolute;bottom: 0;left: 50%;width: 780px;height: 7px;
content: '';transform: translateX(-50%);background-image: url(../img/knights_character/line--pc.png);background-repeat: no-repeat;background-position: center bottom;background-size: auto;
}@media screen and (max-width: 779px)
{
.character-carouselNav:after
{
width: 90.625vw;height: 1.5625vw;
background-image: url(../img/knights_character/line--sp.png);background-size: 100%;;
}
}.knights-desc
{
position: relative;padding-top: 70px;padding-bottom: 85px;
text-align: center;;
}@media screen and (max-width: 779px)
{
.knights-desc
{
padding-top: 12.5vw;padding-bottom: 15.625vw;
}
}.knights-desc img
{
width: auto;
}@media screen and (max-width: 779px)
{
.knights-desc img
{
width: 84.375vw;
}
}.knights-localNav
{
position: relative;display: flex;justify-content: center;margin-bottom: 120px;padding: 40px 0 42px 0;
padding-bottom: 120px;;
}@media screen and (max-width: 779px)
{
.knights-localNav
{
justify-content: space-between;width: 90.625vw;margin: 0 auto 20.3125vw;
padding-top: 8.125vw;padding-bottom: 10.9375vw;;
}
}.knights-localNav.index:before
{
display: none;
}.knights-localNav:before
{
position: absolute;top: 0;left: 50%;width: 780px;height: 7px;
content: '';transform: translateX(-50%);background-image: url(../img/knights_character/line--pc.png);background-repeat: no-repeat;background-position: center bottom;background-size: auto;
}@media screen and (max-width: 779px)
{
.knights-localNav:before
{
width: 90.625vw;height: 1.5625vw;
background-image: url(../img/knights_character/line--sp.png);background-size: 100%;;
}
}.knights-localNav:after
{
position: absolute;bottom: 0;left: 50%;width: 780px;height: 7px;
content: '';transform: translateX(-50%);background-image: url(../img/knights_character/line--pc.png);background-repeat: no-repeat;background-position: center bottom;background-size: auto;
}@media screen and (max-width: 779px)
{
.knights-localNav:after
{
width: 90.625vw;height: 1.5625vw;
background-image: url(../img/knights_character/line--sp.png);background-size: 100%;;
}
}.knights-localNav__item
{
width: 156px;text-align: center;
}@media screen and (max-width: 779px)
{
.knights-localNav__item
{
width: 22.65625vw;margin: 0;
}
}.knights-localNav__item .emblem
{
position: relative;
margin-bottom: 28px;;
}@media screen and (max-width: 779px)
{
.knights-localNav__item .emblem
{
margin-bottom: 3.4375vw;
}
}.knights-localNav__item .emblem:after
{
position: absolute;z-index: 3;top: 0;left: 0;width: 100%;height: 100%;
content: '';transition: opacity .3s;opacity: 0;background-size: contain;;
}@media screen and (max-width: 779px)
{
.knights-localNav__item .emblem:after
{
display: none;
}
}.knights-localNav__item .emblem img
{
position: relative;transition: opacity .3s;
}@media screen and (max-width: 779px)
{
.knights-localNav__item .emblem img
{
width: auto;height: 17.5vw;
}
}.knights-localNav__item .text
{
position: relative;
}.knights-localNav__item .text:after
{
position: absolute;bottom: -20px;display: block;width: 100%;height: 100%;
content: '';transition: .3s;opacity: 0;background-image: url(../img/knights_character/knights-localnav-line--pc.png);;
}.knights-localNav__item .text img
{
height: 15px;
}@media screen and (max-width: 779px)
{
.knights-localNav__item .text img
{
height: 2.34375vw;
}
}.knights-localNav__item:nth-child(1) .emblem::after
{
background-image: url(../img/knights_character/knights-localnav-emblem1_hover--pc.png);
}.knights-localNav__item:nth-child(2) .emblem::after
{
background-image: url(../img/knights_character/knights-localnav-emblem2_hover--pc.png);
}.knights-localNav__item:nth-child(3) .emblem::after
{
background-image: url(../img/knights_character/knights-localnav-emblem3_hover--pc.png);
}.knights-localNav__item:nth-child(4) .emblem::after
{
background-image: url(../img/knights_character/knights-localnav-emblem4_hover--pc.png);
}@media screen and (min-width: 780px)
{
.knights-localNav__item:hover .text:after
{
opacity: 1;
}.knights-localNav__item:hover .emblem:after
{
opacity: 1;
}.knights-localNav__item:hover .emblem img
{
opacity: 0;
}
}@media screen and (min-width: 780px)
{
.knights-localNav__item.is-active .text:after
{
opacity: 1;
}.knights-localNav__item.is-active .emblem:after
{
opacity: 1;
}.knights-localNav__item.is-active img
{
opacity: 0;
}
}.knights-carousel
{
width: 100%;max-width: 1000px;margin: 0 auto;
}.knights-carouselNav
{
position: relative;display: flex;justify-content: center;margin-bottom: 120px;padding: 40px 0 42px 0;
padding-bottom: 120px;;
}@media screen and (max-width: 779px)
{
.knights-carouselNav
{
justify-content: space-between;width: 90.625vw;margin: 0 auto 20.3125vw;
padding-top: 8.125vw;padding-bottom: 10.9375vw;;
}
}.knights-carouselNav:before
{
position: absolute;top: 0;left: 50%;width: 780px;height: 7px;
content: '';transform: translateX(-50%);background-image: url(../img/knights_character/line--pc.png);background-repeat: no-repeat;background-position: center bottom;background-size: auto;
}@media screen and (max-width: 779px)
{
.knights-carouselNav:before
{
width: 90.625vw;height: 1.5625vw;
background-image: url(../img/knights_character/line--sp.png);background-size: 100%;;
}
}.knights-carouselNav:after
{
position: absolute;bottom: 0;left: 50%;width: 780px;height: 7px;
content: '';transform: translateX(-50%);background-image: url(../img/knights_character/line--pc.png);background-repeat: no-repeat;background-position: center bottom;background-size: auto;
}@media screen and (max-width: 779px)
{
.knights-carouselNav:after
{
width: 90.625vw;height: 1.5625vw;
background-image: url(../img/knights_character/line--sp.png);background-size: 100%;;
}
}.knights-carouselNav__item
{
width: 156px;cursor: pointer;text-align: center;;
}@media screen and (max-width: 779px)
{
.knights-carouselNav__item
{
width: 22.65625vw;margin: 0;
}
}.knights-carouselNav__item .emblem
{
position: relative;
margin-bottom: 28px;;
}@media screen and (max-width: 779px)
{
.knights-carouselNav__item .emblem
{
margin-bottom: 3.4375vw;
}
}.knights-carouselNav__item .emblem:after
{
position: absolute;z-index: 3;top: 0;left: 0;width: 100%;height: 100%;
content: '';transition: opacity .3s;opacity: 0;background-size: contain;;
}.knights-carouselNav__item .emblem img
{
position: relative;transition: opacity .3s;
}@media screen and (max-width: 779px)
{
.knights-carouselNav__item .emblem img
{
width: auto;height: 17.5vw;
}
}.knights-carouselNav__item .text
{
position: relative;
}.knights-carouselNav__item .text:after
{
position: absolute;bottom: -20px;display: block;width: 100%;height: 100%;
content: '';transition: .3s;opacity: 0;background-image: url(../img/knights_character/knights-localnav-line--pc.png);background-repeat: no-repeat;background-size: 100%;;
}.knights-carouselNav__item .text img
{
height: 15px;
}@media screen and (max-width: 779px)
{
.knights-carouselNav__item .text img
{
height: 2.34375vw;
}
}.knights-carouselNav__item:nth-child(1) .emblem::after
{
background-image: url(../img/knights_character/knights-localnav-emblem1_hover--pc.png);
}.knights-carouselNav__item:nth-child(2) .emblem::after
{
background-image: url(../img/knights_character/knights-localnav-emblem2_hover--pc.png);
}.knights-carouselNav__item:nth-child(3) .emblem::after
{
background-image: url(../img/knights_character/knights-localnav-emblem3_hover--pc.png);
}.knights-carouselNav__item:nth-child(4) .emblem::after
{
background-image: url(../img/knights_character/knights-localnav-emblem4_hover--pc.png);
}@media screen and (min-width: 780px)
{
.knights-carouselNav__item:hover .text:after
{
opacity: 1;
}.knights-carouselNav__item:hover .emblem:after
{
opacity: 1;
}.knights-carouselNav__item:hover .emblem img
{
opacity: 0;
}
}.knights-carouselNav__item.is-active .text:after
{
opacity: 1;
}.knights-carouselNav__item.is-active .emblem:after
{
opacity: 1;
}.knights-carouselNav__item.is-active .emblem img
{
opacity: 0;
}.knights-carouselMain
{
padding-top: 60px;
}@media screen and (max-width: 779px)
{
.knights-carouselMain
{
padding-top: 3.125vw;padding-bottom: 3.125vw;
}
}.knights-carouselMain .slick-list
{
overflow: visible;
}@media screen and (max-width: 779px)
{
.knights-carouselMain .slick-list
{
overflow: visible;
}
}@media screen and (min-width: 780px)
{
.knights-carouselMain img
{
width: auto;
}
}.knights-carouselMain__item
{
text-align: center;
}@media screen and (max-width: 779px)
{
.knights-carouselMain__item
{
padding-top: 3.125vw;
}
}.knights-carouselMain__item .wrapper
{
position: relative;display: inline-block;
width: 780px;;
}@media screen and (max-width: 779px)
{
.knights-carouselMain__item .wrapper
{
width: 100%;
}
}.knights-carouselMain__item .character
{
position: absolute;top: -150px;left: 50%;transform: translateX(-50%);
}@media screen and (max-width: 779px)
{
.knights-carouselMain__item .character
{
top: -12.5vw;left: 0;
width: 100%;transform: translateX(0);
}
}.knights-carouselMain__item .title
{
text-align: left;
}.knights-carouselMain__item .title img
{
display: inline-block;
}@media screen and (max-width: 779px)
{
.knights-carouselMain__item .title
{
position: absolute;z-index: 3;top: 0;left: 0;
width: 100vw;;
}
}.knights-carouselMain__item .img
{
position: absolute;z-index: 2;top: 50px;left: -30px;;
}@media screen and (max-width: 779px)
{
.knights-carouselMain__item .img
{
position: relative;top: auto;left: auto;
margin-top: 18.75vw;;
}
}.knights-carouselMain__item .img img
{
display: block;
}.knights-carouselMain__item .desc
{
padding-top: 400px;text-align: right;
}@media screen and (max-width: 779px)
{
.knights-carouselMain__item .desc
{
padding-top: 62.5vw;
}
}.knights-carouselMain__item .desc img
{
display: inline-block;
}@media screen and (max-width: 779px)
{
.knights-carouselMain__item .desc
{
position: static;
}.knights-carouselMain__item .desc img
{
display: block;width: 100vw;
}
}.knights-carouselMain .slick-prev
{
z-index: 5;
left: 20px;width: 25px;height: 36px;cursor: pointer;transition: opacity .3s cubic-bezier(.215, .61, .355, 1);
}@media screen and (min-width: 780px)
{
.knights-carouselMain .slick-prev:hover
{
opacity: .6;
}
}@media screen and (max-width: 779px)
{
.knights-carouselMain .slick-prev
{
top: 11.25vw;left: 9.375vw;
width: 6.25vw;height: 8.59375vw;;
}
}.knights-carouselMain .slick-prev:before
{
display: block;width: 100%;height: 100%;
content: '';transform: rotate(180deg);transform-origin: center;background-image: url(../img/common-arrow-v.svg);background-repeat: no-repeat;background-size: contain;;
}.knights-carouselMain .slick-next
{
z-index: 5;
right: 20px;width: 25px;height: 36px;cursor: pointer;transition: opacity .3s cubic-bezier(.215, .61, .355, 1);;
}.knights-carouselMain .slick-next:hover
{
opacity: .6;
}@media screen and (max-width: 779px)
{
.knights-carouselMain .slick-next
{
top: 11.25vw;right: 9.375vw;width: 6.25vw;height: 8.59375vw;;
}
}.knights-carouselMain .slick-next:before
{
display: block;width: 100%;height: 100%;
content: '';background-image: url(../img/common-arrow-v.svg);background-repeat: no-repeat;background-size: contain;;
}.slick-slider
{
position: relative;display: block;box-sizing: border-box;-ms-user-select: none;user-select: none;-webkit-touch-callout: none;touch-action: pan-y;-webkit-tap-highlight-color: transparent;
}.slick-list
{
position: relative;display: block;overflow: hidden;margin: 0;padding: 0;
}.slick-list:focus
{
outline: none;
}.slick-list.dragging
{
cursor: pointer ;cursor: hand;
}.slick-slider .slick-track,
.slick-slider .slick-list
{
transform: translate3d(0, 0, 0);
}.slick-track
{
position: relative;top: 0;left: 0;display: block;margin-right: auto;margin-left: auto;;
}.slick-track:before,
.slick-track:after
{
display: table;
content: '';;
}.slick-track:after
{
clear: both;
}.slick-loading .slick-track
{
visibility: hidden;
}.slick-slide
{
display: none;
float: left;height: 100%;min-height: 1px;;
}[dir='rtl'] .slick-slide
{
float: right;
}.slick-slide img
{
display: block;
}.slick-slide.slick-loading img
{
display: none;
}.slick-slide.dragging img
{
pointer-events: none;
}.slick-initialized .slick-slide
{
display: block;
}.slick-loading .slick-slide
{
visibility: hidden;
}.slick-vertical .slick-slide
{
display: block;height: auto;border: 1px solid transparent;
}.slick-arrow.slick-hidden
{
display: none;
}@font-face
{
font-family: 'slick';font-weight: normal;font-style: normal;
}.slick-prev,
.slick-next
{
font-size: 0;line-height: 0;
position: absolute;top: 50%;display: block;width: 20px;height: 20px;padding: 0;cursor: pointer;transform: translate(0, -50%);color: transparent;border: none;outline: none;background: transparent;;
}.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
opacity: .25;
}.slick-prev:before,
.slick-next:before
{
font-family: 'slick';font-size: 20px;line-height: 1;opacity: .75;color: #fff;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;
}.slick-prev
{
left: -25px;
}[dir='rtl'] .slick-prev
{
right: -25px;
left: auto;;
}.slick-prev:before
{
content: '←';
}[dir='rtl'] .slick-prev:before
{
content: '→';
}.slick-next
{
right: -25px;
}[dir='rtl'] .slick-next
{
right: auto;
left: -25px;;
}.slick-next:before
{
content: '→';
}[dir='rtl'] .slick-next:before
{
content: '←';
}.slick-dotted.slick-slider
{
margin-bottom: 30px;
}.slick-dots
{
position: absolute;bottom: -25px;display: block;width: 100%;margin: 0;padding: 0;list-style: none;text-align: center;;
}.slick-dots li
{
position: relative;display: inline-block;width: 20px;height: 20px;margin: 0 5px;padding: 0;cursor: pointer;
}.slick-dots li button
{
font-size: 0;line-height: 0;display: block;width: 20px;height: 20px;padding: 5px;cursor: pointer;color: transparent;
border: 0;outline: none;background: transparent;;
}.slick-dots li button:before
{
font-family: 'slick';font-size: 6px;line-height: 20px;
position: absolute;top: 0;left: 0;width: 20px;height: 20px;content: '•';text-align: center;opacity: .25;color: #000;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;
}.slick-dots li.slick-active button:before
{
opacity: .75;
color: #000;;
}html.remodal-is-locked
{
touch-action: none;
}.remodal,
[data-remodal-id]
{
display: none;
}.remodal-overlay
{
position: fixed;z-index: 9999;top: -5000px;right: -5000px;bottom: -5000px;left: -5000px;display: none;
}.remodal-wrapper
{
position: fixed;z-index: 10000;top: 0;right: 0;bottom: 0;left: 0;display: none;overflow: auto;text-align: center;-webkit-overflow-scrolling: touch;
}.remodal-wrapper:after
{
display: inline-block;height: 100%;margin-left: -.05em;content: '';
}.remodal-overlay,
.remodal-wrapper
{
backface-visibility: hidden;
}.remodal
{
position: relative;outline: none;text-size-adjust: 100%;
}.remodal-is-initialized
{
display: inline-block;
}.remodal-bg.remodal-is-opening,
.remodal-bg.remodal-is-opened
{
filter: blur(3px);
}.remodal-overlay
{
background: rgba(0,0,0,.84);
}.remodal-overlay.remodal-is-opening,
.remodal-overlay.remodal-is-closing
{
animation-duration: .3s;animation-fill-mode: forwards;
}.remodal-overlay.remodal-is-opening
{
animation-name: remodal-overlay-opening-keyframes;
}.remodal-overlay.remodal-is-closing
{
animation-name: remodal-overlay-closing-keyframes;
}.remodal-wrapper
{
padding: 10px 10px 0;
}.remodal
{
box-sizing: border-box;width: 100%;margin-bottom: 10px;padding: 35px;transform: translate3d(0, 0, 0);vertical-align: middle;color: #2b2e38;background: #fff;;
}.remodal.remodal-is-opening,
.remodal.remodal-is-closing
{
animation-duration: .3s;animation-fill-mode: forwards;
}.remodal.remodal-is-opening
{
animation-name: remodal-opening-keyframes;
}.remodal.remodal-is-closing
{
animation-name: remodal-closing-keyframes;
}.remodal-wrapper:after
{
vertical-align: middle;
}.remodal-close
{
position: absolute;top: 0;left: 0;display: block;overflow: visible;width: 35px;height: 35px;margin: 0;padding: 0;cursor: pointer;transition: color .2s;text-decoration: none;color: #95979c;border: 0;outline: 0;background: transparent;
}.remodal-close:hover,
.remodal-close:focus
{
color: #2b2e38;
}.remodal-close:before
{
font-family: Arial, 'Helvetica CY', 'Nimbus Sans L', sans-serif !important;font-size: 25px;line-height: 35px;position: absolute;top: 0;left: 0;display: block;width: 35px;content: '\00d7';text-align: center;
}.remodal-confirm,
.remodal-cancel
{
font: inherit;display: inline-block;overflow: visible;min-width: 110px;margin: 0;padding: 12px 0;cursor: pointer;transition: background .2s;text-align: center;vertical-align: middle;text-decoration: none;border: 0;outline: 0;
}.remodal-confirm
{
color: #fff;background: #81c784;
}.remodal-confirm:hover,
.remodal-confirm:focus
{
background: #66bb6a;
}.remodal-cancel
{
color: #fff;background: #e57373;
}.remodal-cancel:hover,
.remodal-cancel:focus
{
background: #ef5350;
}.remodal-confirm::-moz-focus-inner,
.remodal-cancel::-moz-focus-inner,
.remodal-close::-moz-focus-inner
{
padding: 0;border: 0;
}@keyframes remodal-opening-keyframes
{
from
{
transform: scale(1.05);opacity: 0;
}to
{
transform: none;opacity: 1;filter: blur(0);
}
}@keyframes remodal-closing-keyframes
{
from
{
transform: scale(1);opacity: 1;
}to
{
transform: scale(.95);opacity: 0;filter: blur(0);
}
}@keyframes remodal-overlay-opening-keyframes
{
from
{
opacity: 0;
}to
{
opacity: 1;
}
}@keyframes remodal-overlay-closing-keyframes
{
from
{
opacity: 1;
}to
{
opacity: 0;
}
}@media only screen and (min-width: 641px)
{
.remodal
{
max-width: 1200px;
}
}.lt-ie9 .remodal-overlay
{
background: #2b2e38;
}.lt-ie9 .remodal
{
width: 700px;
}.remodal.modal
{
position: relative;max-width: 860px;padding: 0;
background: none;;
}.remodal .remodal-cancel.modal-close
{
position: absolute;top: -50px;right: -8px;width: auto;width: 40px;min-width: auto;height: auto;height: 40px;padding: 0;
background: none;;
}@media screen and (max-width: 779px)
{
.remodal .remodal-cancel.modal-close
{
top: -15.625vw;right: -2.5vw;width: 12.5vw;height: 12.5vw;
}
}.remodal .remodal-cancel.modal-close::before,
.remodal .remodal-cancel.modal-close::after
{
position: absolute;top: 50%;left: 50%;width: 30px;height: 1px;
content: '';transform: rotate(45deg) translate(-50%, -50%);transform-origin: 0 50%;background-color: #fff;;
}@media screen and (max-width: 779px)
{
.remodal .remodal-cancel.modal-close::before,
.remodal .remodal-cancel.modal-close::after
{
width: 9.375vw;height: .3125vw;
}
}.remodal .remodal-cancel.modal-close::after
{
transform: rotate(-45deg) translate(-50%, -50%);
}.remodal .modal-item.__movie
{
position: relative;width: 100%;padding-top: 56.25%;
}.remodal .modal-item.__movie iframe
{
position: absolute;top: 0;right: 0;width: 100%;height: 100%;
}.remodal .modal-item.__img
{
max-width: 860px;margin: 0 auto;
}.remodal-bg.remodal-is-opening,
.remodal-bg.remodal-is-opened
{
filter: blur(3px);
}.remodal-overlay
{
background: rgba(43,46,56,.9);
}.remodal-overlay.remodal-is-opening,
.remodal-overlay.remodal-is-closing
{
animation-duration: .3s;animation-fill-mode: forwards;
}.remodal-overlay.remodal-is-opening
{
animation-name: remodal-overlay-opening-keyframes;
}.remodal-overlay.remodal-is-closing
{
animation-name: remodal-overlay-closing-keyframes;
}.remodal-wrapper
{
padding: 10px 10px 0;
}.remodal
{
box-sizing: border-box;width: 100%;margin-bottom: 10px;padding: 35px;transform: translate3d(0, 0, 0);color: #2b2e38;background: #fff;
}.remodal.remodal-is-opening,
.remodal.remodal-is-closing
{
animation-duration: .3s;animation-fill-mode: forwards;
}.remodal.remodal-is-opening
{
animation-name: remodal-opening-keyframes;
}.remodal.remodal-is-closing
{
animation-name: remodal-closing-keyframes;
}.remodal,
.remodal-wrapper:after
{
vertical-align: middle;
}.remodal-close
{
position: absolute;top: 0;left: 0;display: block;overflow: visible;width: 35px;height: 35px;margin: 0;padding: 0;cursor: pointer;transition: color .2s;text-decoration: none;color: #95979c;border: 0;outline: 0;background: transparent;
}.remodal-close:hover,
.remodal-close:focus
{
color: #2b2e38;
}.remodal-close:before
{
font-family: Arial, 'Helvetica CY', 'Nimbus Sans L', sans-serif !important;font-size: 25px;line-height: 35px;position: absolute;top: 0;left: 0;display: block;width: 35px;content: '\00d7';text-align: center;
}.remodal-confirm,
.remodal-cancel
{
font: inherit;display: inline-block;overflow: visible;min-width: 110px;margin: 0;padding: 12px 0;cursor: pointer;transition: background .2s;text-align: center;vertical-align: middle;text-decoration: none;border: 0;outline: 0;
}.remodal-confirm
{
color: #fff;background: #81c784;
}.remodal-confirm:hover,
.remodal-confirm:focus
{
background: #66bb6a;
}.remodal-cancel
{
color: #fff;background: #e57373;
}.remodal-cancel:hover,
.remodal-cancel:focus
{
background: #ef5350;
}.remodal-confirm::-moz-focus-inner,
.remodal-cancel::-moz-focus-inner,
.remodal-close::-moz-focus-inner
{
padding: 0;border: 0;
}@keyframes remodal-opening-keyframes
{
from
{
transform: scale(1.05);opacity: 0;
}to
{
transform: none;opacity: 1;filter: blur(0);
}
}@keyframes remodal-closing-keyframes
{
from
{
transform: scale(1);opacity: 1;
}to
{
transform: scale(.95);opacity: 0;filter: blur(0);
}
}@keyframes remodal-overlay-opening-keyframes
{
from
{
opacity: 0;
}to
{
opacity: 1;
}
}@keyframes remodal-overlay-closing-keyframes
{
from
{
opacity: 1;
}to
{
opacity: 0;
}
}@media only screen and (min-width: 641px)
{
.remodal
{
max-width: 700px;
}
}.lt-ie9 .remodal-overlay
{
background: #2b2e38;
}.lt-ie9 .remodal
{
width: 700px;
}
.footer-banner
{
margin-bottom: 15px;
}