@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:#281d3e;
}

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

body {
overflow: initial;
min-width: auto!important;
}

@-ms-viewport {
width: auto;
}

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



/*====================================================
kv
====================================================*/

.kv {
width: 100%;
margin: 0 auto;
text-align: center;
z-index: 5;
position: fixed;
}

.fade-container {
position: relative;
max-width: 1920px;
margin: 0 auto;
}

.fade-container::before {
content : "";
display : block;
padding-top : 57%;
}

.fade-container div.base {
position: absolute;
top : 0;
margin: 0 auto;
max-width : 100%;
max-height : 100%;
}

.fade-container div.item {
position: absolute;
top : 0;
margin: 0 auto;
max-width : 100%;
max-height : 100%;
opacity : 0;
animation : itmFade3-chg-itm-anim 15s infinite;
}

.fade-container div.item:nth-of-type( 1 ) {
animation-delay : 0s;
}

.fade-container div.item:nth-of-type( 2 ) {
animation-delay : 5s;
}

.fade-container div.item:nth-of-type( 3 )  {
animation-delay : 10s;
}


/* animation_2images ver */
@keyframes itmFade1-chg-itm-anim {
0% {
    opacity : 0;
    z-index : 7;
  }
	
12%{
    opacity : 1;
  }

50%{
    opacity : 1;
  }

68%{
    opacity : 0;
    z-index : 6;
  }

100% {
    opacity : 0;
  }
}


/* animation_3images ver */
@keyframes itmFade3-chg-itm-anim {
  0% {
    opacity : 0;
  }
  10%{
    opacity : 1;
    z-index : 3;
  }
  33%{
    opacity : 1;
  }
  50%{
    opacity : 0;
    z-index : 1;
  }
  100% {
    opacity : 0;
  }
}

/*====================================================
contents
====================================================*/
.content {
max-width: 1461px;
backdrop-filter: blur(12px);
background-color: rgba(40, 29, 62, 0.8);
border: solid 3px #a38b46;
margin: 320px 5vw 20px;
padding-bottom: 1vh;
position: relative;
z-index: 10;
}


@media screen and (min-width: 321px) {
.content {
border: solid 2px #a38b46;
margin: 400px 3vw 10px;
}
}

@media screen and (min-width: 451px) {
.content {
border: solid 2px #a38b46;
margin: 540px 3vw 10px;
}
}

@media screen and (min-width: 601px) {
.content {
border: solid 2px #a38b46;
margin: 360px 5vw 10px;
padding-bottom: 3vh;
}
}

@media screen and (min-width: 701px) {
.content {
margin: 420px 5vw 10px;
padding-bottom: 3.5vh;
}
}

@media screen and (min-width: 901px) {
.content {
margin: 550px 5vw 10px;
padding-bottom: 4vh;
}
}

@media screen and (min-width: 1101px) {
.content {
margin: 650px 5vw 10px;
padding-bottom: 4.5vh;
}
}

@media screen and (min-width: 1301px) {
.content {
margin: 770px 5vw 10px;
}
}


@media screen and (min-width: 1500px) {
.content {
border: solid 3px #a38b46;
margin: 800px auto 10px;
}
}



/*====================================================
thankyou
====================================================*/
.thankyou {
width: 90%;
max-width: 1300px;
margin: 0 auto;
}

.msg2 {
width: 100%;

}

.movie_camlist {
margin: 0% auto 4%;
}

@media screen and (min-width: 601px) {
.thankyou {
margin: 0 auto 0;
display: flex;
justify-content: center;
align-items: center
}

.msg2 {
margin: auto 8px auto -3vw;
}

.movie_camlist {
width: 55%;
max-width: 700px;
margin: 4% auto 2%;
}
}


/* ▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼　movie　▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼ */
.outer {
width: 88%;
max-width: 620px;
margin: 0 auto;
box-sizing: border-box;
padding: 0;
position: relative;
z-index: 1;
}

@media screen and (min-width: 601px) {
.outer {
width: 38.75vw;
max-width: 620px;
margin:0 auto 0;
}

.swiper {
padding-bottom: 30px;
}
}

.inner {
width: calc(100% + 2px);
height: calc((100% + 2px) - 48px);
position: absolute;
left: -1px;
right: 0;
top:-1px;
bottom:0;
background:transparent;
z-index: 10000;
border: 2px solid #a38b46;
border-radius: 0px;
pointer-events: none;
}


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


.swiper-slide {
position: relative;
width: 100%;
height: 0;
padding-bottom:56.25%;
background: #a38b46;

/* 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;
/*border: 5px solid #a4b4d2;
box-sizing: border-box;*/
}

.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-pagination {
z-index: 100;
}

.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,15px);
}

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


.swiper-pagination-bullet {
margin: 0 var(--swiper-pagination-bullet-horizontal-gap,9px);
background-color: transparent;
background-image: url("../images/triangle_non.svg");
background-repeat: no-repeat;
background-size: contain;
border-radius: unset;
width: 11px;
height: 13px;
opacity: 1;
}

.swiper-pagination-bullet-active {

background-image: url("../images/triangle.svg");
width: 11px;
height: 13px;
}

.swiper-slide img {
height: auto;
width: 100%;
}


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

@media screen and (min-width: 1600px) {
.outer {
width: 100%;
}
}


/*====================================================
measure
====================================================*/

.measure {
width: 100%;
text-align: center;
background-color: rgba(40, 29, 62, 0);
}




/*====================================================
footer
====================================================*/


.nogifra_logo {
width: 100%;
padding: 65px 0 0;
text-align: center;
}

.nogifra_logo img {
width: 50%;
}


@media screen and (min-width: 601px) {
.nogifra_logo img {
width: 40%;
max-width: 350px;
}
}


.sec-regist {
color: white;
border-top: 0px solid #e5e5e5;
margin-bottom: -35px;
}

.regist-line-0 {
  background-color:white !important;
}

.regist-line-1 {
  background-color:white !important;
}


footer .Copyright {
color: white;
background-color: rgba(255,255,255,0.00)
}

@media screen and (min-width: 451px) {
footer .Copyright  {
font-size: 12px;
}
}


footer .footer-share {
text-indent: calc(100vw * (0 / 1600));
}



