@charset "utf-8";
html, body, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
list-style:none;
font-weight:normal;
font-style:normal;
}

* {
margin:0;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

html,body {
height:100%;
margin:0;
padding:0;
min-height:100%;
box-sizing: border-box;
background:#fbe2eb;
}

html{
height:100%;
margin-bottom:1px;
-webkit-overflow-scrolling: touch;
}

body {
overflow: initial;
}

@-ms-viewport {
width: auto;
}

img {
max-width : 100% ;
height : auto ;
vertical-align:bottom;
}

.main_wrap {
width: 100%;
max-width: 1600px;
max-height: 864px;
margin: 0 auto;
}

.one-half_anniv_main {
width: 100%;
height: 0;
padding-top: 148%;
background: url("../image/main_v2.jpg") center top no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
z-index: 1;
position: relative;
}

h1,h2 {
width: 100%;
position: absolute;
top:0;
left:0;
}



h1 { z-index: 3; }
h2 { z-index: 2; }

@media screen and (min-width: 601px) {
.one-half_anniv_main {
width: 100%;
height: 0;
padding-top: 53.75%;
background: url("../image/main_v2_pc.jpg") center top no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
z-index: 1;
position: relative;
}

}

@media screen and (min-width: 1600px) {
.one-half_anniv_main {
width: 100%;
max-width: 1600px;
margin: 0 auto;
height: 860px;
padding-top: 0;
background: url("../image/main_v2_pc.jpg") center top no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
z-index: 1;
position: relative;
}
}

/* ▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼　movie　▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼ */
.outer {
width: 92%;
max-width: 885px;
margin: 10px auto 0 auto;
box-sizing: border-box;
padding: 5px;
background: #8f249b;
position: relative;
z-index: 1;
}

@media screen and (min-width: 601px) {
.outer {
margin: -3% auto 0 auto;
}
}

.inner {
width: 105%;
height: 57px;
position: absolute;
left: -1px;
bottom: -2px;
background: #fbe2eb;
z-index: -1;
}

.swiper {
width: 100%;
box-sizing: border-box;
padding-bottom: 55px;
}


.swiper-slide {
position: relative;
width: 100%;
padding-top: 56.25%;
background: #fff;

/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
z-index: 10;
}

.swiper-slide img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}


.swiper-slide  iframe {
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
}

.swiper-slide.pv::after {
display: none;
}

.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 var(--swiper-pagination-bullet-horizontal-gap,18px);
}

.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
bottom: 0;
}

:root {
--swiper-theme-color: #fff;
}

.swiper-pagination {
z-index: 100;
}

.swiper-pagination-bullet {
width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,13px));
height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,13px));
/*border: 2px solid #810f95;*/
background: var(--swiper-pagination-bullet-inactive-color,#a1a1a1);
opacity: 1;
}

@media screen and (min-width: 601px) {
.swiper-pagination-bullet {
width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,16px));
height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,16px));
border: 2px solid #810f95;
}
}

.swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background: var(--swiper-pagination-color,var(--swiper-theme-color));
}

@media screen and (min-width: 601px) {
.movie_1st_anniv {
background: none;
}
}

/* ▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼　news　▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼ */
.news_1half_anniv {
width: 100%;
margin-top: 0;
}

.thankyou {
width: 100%;
height: 0;
padding-top: 89.467%;
background: url("../image/thankyou_bg.png") center top no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
position: relative;
}

.thankyou h3 {
position: absolute;
top:0;
}

.thankyou p {
position: absolute;
top:50%;
}

.news_wrap{
width: 100%;
margin-top: 15px;
}

@media screen and (min-width: 601px) {
.news_1half_anniv {
width: 100%;
text-align: center;
margin-top: 35px;
}

.thankyou {
width: 100%;
max-width: 1182px;
margin: 0 auto;
height: 670px;
padding-top: 0;
background: url("../image/thankyou_bg_pc.png") center top no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
position: relative;
}

.thankyou h3 {
max-width: 1182px;
height: auto;
}


.thankyou p {
max-width: 1182px;
height: auto;
top:45%;
}

.sp_cont {
max-width: 818px;
margin: 0 auto 45px;
}

.news_wrap {
width: 98%;
max-width: 1270px;
margin:  0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
flex-direction: row;
align-items: flex-start;
align-content: space-between;
}


.news_wrap section {
width: 24.5%;
}

.news_wrap::after{
  content:"";
  display: block;
width: 24.5%;
}
}

@media screen and (min-width: 1024px) {
.sp_cont {
margin: 60px auto 45px;
}
}

@media screen and (min-width: 1100px) {
.thankyou p {
top:320px;
}

.news_wrap {
margin:  0 auto;
}


}

@media screen and (min-width: 1160px) {
.thankyou p {
top:330px;
}
}

/*----------------------- news1 -----------------------*/
.news1 {
width: 100%;
height: 0;
padding-top: 88%;
background: url("../image/news1_bg.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.news1 h1 {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

.news1 h2 {
width: 100%;
position: absolute;
top: 35%;
left: 0;
z-index: 2;
}


@media screen and (min-width: 601px) {
.news1 {
width: 100%;
height: 0;
padding-top: calc(133.962% / 4);
background: url("../image/news1_bg_pc.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.news1 h1 {
top: 0;
left: 0;
z-index: 1;
}

.news1 h2 {
width: 70%;
max-width: 220px;
top: 23%;
left: 1.7em;
}

}

/*----------------------- news2 -----------------------*/
.news2 {
width: 100%;
height: 0;
padding-top: 128.267%;
background: url("../image/news2_bg.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.news2 h1 {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

.news2 h2 {
width: 100%;
position: absolute;
top: 25%;
left: 0;
}


@media screen and (min-width: 601px) {
.news2 {
width: 100%;
height: 0;
padding-top: calc(136.977% / 4);
background: url("../image/news2_bg_pc.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.news2 h1 {
top: -3px;
left: 0;
}

.news2 h2 {
width: 92.92%;
max-width: 289px;
top: 22.5%;
left: 1em;
}

}

/*----------------------- news3 -----------------------*/
.news3 {
width: 100%;
height: 0;
padding-top: 129.867%;
background: url("../image/news3_bg-0216.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.news3 h1 {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

.news3 h2 {
width: 100%;
position: absolute;
top: 33%;
left: 0;
}

@media screen and (min-width: 601px) {
.news3 {
width: 100%;
height: 0;
padding-top: calc(136.977% / 4);
background: url("../image/news3_bg-0216_pc.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}


.news3 h1 {
top: -7px;
left: 0;
}

.news3 h2 {
width: 92.92%;
max-width: 289px;
top: 30.5%;
left: 1em;
}

}

/*----------------------- news4 -----------------------*/
.news4 {
width: 100%;
height: 0;
padding-top: 129.733%;
background: url("../image/news4_bg.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.news4 h1 {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

.news4 h2 {
width: 100%;
position: absolute;
top: 26%;
left: 0;
}

@media screen and (min-width: 601px) {
.news4 {
width: 100%;
height: 0;
padding-top: calc(136.977% / 4);
background: url("../image/news4_bg_pc.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.news4 h1 {
top:-5px;
}

.news4 h2 {
width: 82.63%;
max-width: 257px;
top: 22.5%;
left: 1em;
}
}

/*----------------------- news5 -----------------------*/
.news5 {
width: 100%;
height: 0;
padding-top: 126.667%;
background: url("../image/news5_bg-0216.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.news5 h1 {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

.news5 h2 {
width: 100%;
position: absolute;
top: 32%;
left: 0;
}

@media screen and (min-width: 601px) {
.news5 {
width: 100%;
height: 0;
padding-top: calc(134.591% / 4);
background: url("../image/news5_bg-0216_pc.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.news5 h1 {
top:2px;
}

.news5 h2 {
width: 81.761%;
max-width: 260px;
top: 30.5%;
left: 2em;
}
}

/*----------------------- news6 -----------------------*/
.news6 {
width: 100%;
height: 0;
padding-top: 129.2%;
background: url("../image/news6_bg.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.news6 h1 {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

.news6 h2 {
width: 100%;
position: absolute;
top: 26%;
left: 0;
}

@media screen and (min-width: 601px) {
.news6 {
width: 100%;
height: 0;
padding-top: calc(138.064% / 4);
background: url("../image/news6_bg_pc.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.news6 h1 {
top:-2px;
}

.news6 h2 {
width: 90.968%;
max-width: 282px;
top: 25%;
left: 1.2em;
}
}



/*----------------------- news7 -----------------------*/
.news7 {
width: 100%;
height: 0;
padding-top: 128.8%;
background: url("../image/news7_bg-0216.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.news7 h1 {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

.news7 h2 {
width: 100%;
position: absolute;
top: 34%;
left: 0;
}

@media screen and (min-width: 601px) {
.news7 {
width: 100%;
height: 0;
padding-top: calc(137.179% / 4);
background: url("../image/news7_bg-0216_pc.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}


.news7 h2 {
width: 92.628%;
max-width: 289px;
top:32%;
left: 1.3em;
}
}



/* ▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼　campaign　▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼ */
.lineup {
margin: 30px auto 0;
}

.campaign_1half_anniv {
width: 100%;
margin-bottom: 70px;
}

.cam1 {
width: 100%;
margin: 0 auto;
height: 0;
padding-top: 125.2%;
background: url("../image/cam1_bg.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.cam1 h2 {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 2;
}

ul.cam1_li {
list-style: none;
width: 100%;
position: absolute;
top:29%;
left:0;
z-index: 3;
}

@media screen and (min-width: 601px) {
.lineup {
margin: 80px auto 0;
max-width: 464px;
}

.campaign_1half_anniv {
margin-bottom: 100px;
}

.cam1 {
width: 100%;
max-width: 790px;
height: 0;
padding-top: 846px;
background: url("../image/cam1_bg_pc.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.cam1 h2 {
width: 100%;
position: absolute;
top: 0;
left: 0;
}

ul.cam1_li {
list-style: none;
width: 100%;
position: absolute;
top: 27%;
left:18%;
}

}

/*----------------------- cam2 -----------------------*/
.cam2 {
margin: -3.5em auto 0;
width: 100%;
height: 0;
padding-top: 157.067%;
background: url("../image/cam2_bg-0211.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.cam2 h2 {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 2;
}

ul.cam2_li {
list-style: none;
width: 100%;
position: absolute;
top:24%;
left:0;
z-index: 3;
}


@media screen and (min-width: 601px) {
.cam2 {
width: 100%;
max-width: 763px;
height: 0;
padding-top: 1029px;
background: url("../image/cam2_bg-0211_pc.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
margin: -4em auto 0;
}

.cam2 h2 {
top: 0;
left: 0;
}

ul.cam2_li {
list-style: none;
width: 100%;
position: absolute;
top: 23%;
left:16.5%;
background: url("../image/cam2_ul_bg_pc.png") left top no-repeat;
}


.cam2_txt {
position: absolute;
bottom: 8px;
left: 18%;
font-size: 0.9em;
}

}

/*----------------------- cam3 -----------------------*/
.cam3 {
margin-top: -1em;
width: 100%;
height: 0;
padding-top: 134.8%;
background: url("../image/cam3_bg-0222.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.cam3 h2 {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 2;
}

ul.cam3_li {
list-style: none;
width: 100%;
position: absolute;
top:26%;
left:0;
z-index: 3;
}

@media screen and (min-width: 601px) {
.cam3 {
margin: -6em auto 0;
width: 100%;
max-width: 732px;
height: 0;
padding-top: 923px;
background: url("../image/cam3_bg-0222_pc.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.cam3 h2 {
top: 0;
left: 0;
}

ul.cam3_li {
top:27%;
left: 18%;
}
}

/*----------------------- cam4 -----------------------*/
.cam4 {
margin-top: -1em;
width: 100%;
height: 0;
padding-top: 131.467%;
background: url("../image/cam4_bg-0307.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.cam4 h2 {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 2;
}

ul.cam4_li {
list-style: none;
width: 100%;
position: absolute;
top:28%;
left:0;
z-index: 3;
}

@media screen and (min-width: 601px) {
.cam4 {
margin: -3.5em auto 0;
width: 100%;
max-width: 760px;
height: 0;
padding-top: 877px;
background: url("../image/cam4_bg-0307_pc.png") top center no-repeat;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
background-position: center top;
position: relative;
}

.cam4 h2 {
top: 0;
left: 0;
}

ul.cam4_li {
top:27%;
left: 20%;
}
}


/* ▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼　footer　▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼ */
.nogifra_logo {
width: 100%;
padding: 75px 0 48px;
background: #fff;
/*background: rgb(231,226,251);
background: linear-gradient(180deg, rgba(244,226,251,1) 0%, rgba(255,255,255,1) 30%);*/
text-align: center;
}

.nogifra_logo img {
width: 75%;
max-width: 476px;
}

.sec-regist {
background: #fff;
}


@media screen and (min-width: 601px) {
.nogifra_logo {
padding: 60px 0 80px;
}

.nogifra_logo img {
width: 35%;
}
}


@media screen and (min-width: 960px) {
.nogifra_logo {
padding: 130px 0 145px;
background: #fff;
/*background: rgb(231,226,251);
background: linear-gradient(180deg, rgba(244,226,251,1) 0%, rgba(255,255,255,1) 20%);*/
text-align: center;
}
}