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

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;
}


/*====================================================
main
====================================================*/
.content {
width: 100%;
height: 100%;
background: url("../images/sp/bg_2.png") no-repeat top center/100% auto, #fa7bc6;
padding-bottom: 10px;
position: relative;
}

.kv {
width: 100%;
max-width: 1600px;
max-height: 970px;
margin: 0 auto;
margin-bottom: -5vh;
text-align: center;
z-index: 5;
}

.tr {
display: none;
}

@media screen and (min-width: 601px) {
.content {
background: url("../images/pc/bg1600_2.png") no-repeat center top/100% auto;
padding-bottom: 10px;
}

.tr {
display: block;
width: 18vw;
max-width: 318px;
max-height: 165px;
position: absolute;
top:55.5%;
left: -6vw;
}
}

@media screen and (min-width: 860px) {
.tr {
left: -9vw;
}
}

@media screen and (min-width: 1200px) {
.tr {
left: -9%;
}
}

@media screen and (min-width: 1600px) {
.content {
background: url("../images/pc/bg_2.png") no-repeat center top/1920px 4431px;
padding-bottom: 10px;
}

.tr {
top:56.5%;
left: 50%;
margin-left: -930px;
}
}



/*====================================================
thankyou
====================================================*/
.thankyou {
width: 100%;
max-width: 626px;
max-height: 366px;
position: relative;
z-index: 1;
text-align: center;
margin: 2% auto 0
}

.msg {
width: 100%;
margin-bottom: -10vh
}


@media screen and (min-width: 601px) {
.thankyou {
max-width: 798px;
max-height: 450px;
margin: 0px auto 0px;
text-align: center;
justify-content: center;
}
}
	

/*====================================================
thankyou text&movie
====================================================*/
.thankyou_text {
width: 100%;
max-width: 1600px;
margin: auto;
padding:0;
position: relative;
z-index: 3;
}

/*
.msg {
width: 100%;
}
*/

.msg2 {
width: 60%;
/*margin: 15% 5.5% 5% 5.5%;*/
margin: 13% auto 5%;
}

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

.msg2 {
width: 60%;
margin: 7% 0% 0% 10%;
/*width: 49%;*/
}

.movie_camlist {
width: 55%;
/*width: 49%;*/
max-width: 737px;
margin: 3% 10% 0% 5%;
}
}

@media screen and (min-width: 1600px) {
.movie_camlist {
	
}
}

/* ▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼　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;
/*margin:3.75vw auto 0;*/
}

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

.inner {
width: calc(100% + 10px);
height: calc((100% + 10px) - 48px);
position: absolute;
left: -5px;
right: 0;
top:-5px;
bottom:0;
background:transparent;
z-index: 10000;
/*border: 5px solid #f492b8;*/
border: 5px solid;
border-image: linear-gradient(to bottom right, #fff7fa, #fe5a9e, #fff7fa) 1;
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: #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;
/*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%;
}
}

/*====================================================
campaign1
====================================================*/

/*
@media screen and (min-width: 1600px) {
.cam1_wrap {
margin: -130px auto 610px;
}
*/
	
.cam1_outer {
width: 100%;
max-width: 1600px;
/*max-height: 750px;
background: url("../images/sp/cam1_bg.png") no-repeat top center/auto 100%;*/
position: relative;
z-index: 2;
margin: auto;
margin-bottom: -5vh;
}

	/*
ul.sec_anniv_cam1 {
list-style: none;
padding: 0 0 0 1%;
margin: 0;
}

ul.sec_anniv_cam1 li {
line-height: 1 !important;
margin-top: 2%;
}
ul.sec_anniv_cam1 li.cs0709 {
line-height: 1 !important;
margin-top: 0px;
}

	*/


.detail {
font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
font-weight: 500;
display: flex;
align-items: center;
justify-content: center;
width: 28.93333333vw;
max-width: 320px;
height: 8vw;
max-height: 48px;
padding-right: 1em;
font-size: 0.7em;
color: #fff;
text-align: center;
overflow-wrap: anywhere;
background-color: transparent;
border: 1px solid #b59ccd;
position: relative;
margin-left: 14.4vw;
margin-top: 2.2666666vw;
}

.detail::before { 
content: "";
margin: auto;
position: absolute;
top: 0;
bottom: 0;
right: 10px;
width: 6px;
height: 6px;
border-top: 1px solid #fff; 
border-right: 1px solid #fff; 
transform: rotate(45deg);
}


@media (any-hover: hover) {
  .detail {
    transition: background-color 0.2s;
  }

  .detail:hover {
    background-color: #3c1c57;
  }
}

@media screen and (min-width: 460px) {
.detail {
font-size: 0.8em;
}
}

@media screen and (min-width: 601px) {
.cam1_outer {
/*background: url("../images/pc/cam1_bg.png") no-repeat top center/100% auto;
display: flex;
flex-direction:row;
justify-content: flex-start;*/
z-index: 1;
position: relative;
/*margin:10px 0 10px 0;*/
}

	
.detail {
margin-left:0;
margin-top: 0.5em;
font-size: 0.7em;
width: 13.5625vw;
max-width: 217px;
height: 5vw;
max-height: 48px;
}
	
ul.sec_anniv_cam1 {
list-style: none;
padding: 50px 0 0 4%;
margin: 50px 0 20px 30px;
width: 50%;
}
}


@media screen and (min-width: 960px) {
.detail {
font-size: 0.9em;

}
}

@media screen and (min-width: 1400px) {
.cam1_outer {
width: 100%;
height: 100%;
/*padding: 5% 0% 5%;*/

}

.detail {
font-size: 1em;
}
}

@media screen and (min-width: 1600px) {
.cam1_outer {
width: 100%;
max-width: 1600px;
height: 100%;
max-height: 724px;
/*background: url("../images/pc/cam1_bg.png") no-repeat top center/auto 100%;*/
z-index: 1;
/*margin: auto*/
}
}

	
/*====================================================
campaign2
====================================================*/
/*.cam2_wrap {
width: 100%;
max-width: 1600px;
margin: 0 auto 0;
}
*/

.cam2_outer {
width: 100%;
max-width: 1600px;
/*background: url("../images/sp/cam2_bg.png") no-repeat top center/auto 100%;
margin-top: -10vw;*/
/*margin-bottom: 102vw; 0801*/
/*padding: 38vw 0 95vw;*/
/*padding: 38vw 0 5vw;*/
position: relative;
z-index: 2;
margin: auto;
}

/*
ul.sec_anniv_cam2 {
line-height: 1;
padding: 0 0 0 1%;
}

ul.sec_anniv_cam2 li {
line-height: 1 !important;
margin-top: 2%;
}
*/


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

/*.cam2_wrap {
display: flex;
margin: 11% auto 0;
}
*/

.cam2_outer {
/*width: 100%;
max-width: 1600px;
height: 100%;*/
/*background: url("../images/pc/cam2_bg.png") no-repeat top center/100% auto;*/
/*display: flex;
flex-direction:row;
justify-content: flex-start;*/
z-index: 1;
position: relative;
/*margin:10px 0 10px 0;*/
}

/*	
ul.sec_anniv_cam2 {
list-style: none;
padding: 50px 0 0 4%;
margin: 50px 0 20px 30px;
width: 50%;
}

ul.sec_anniv_cam2 li {
line-height: 1 !important;
margin-top: 2%;
}*/
	
}

@media screen and (min-width: 1600px) {
/*
	.cam2_wrap {
margin: 12% auto 0;
}*/

.cam2_outer {
	width: 100%;
max-width: 1600px;
height: 100%;
max-height: 724px;
/*padding: 0px 0 30px; */
}
}





/*====================================================
campaign3
====================================================*/
.cam3_outer {
width: 100%;
max-width: 1600px;
/*height: 144vw;
background: url("../images/sp/cam3_bg.png") no-repeat top center/auto 100%;*/
/*padding:30vh 0 30vh;*/
position: relative;
z-index: 2;
margin: auto;
}

	/*
ul.sec_anniv_cam3 {
list-style: none;
padding: 50px 0 0 4%;
margin: 50px 0 20px 30px;
width: 50%;
}

ul.sec_anniv_cam3 li {
line-height: 1 !important;
margin-top: 2%;
}
ul.sec_anniv_cam3 li.cs0812 {
line-height: 1 !important;
margin-top: 0px;
}
*/
	
	
@media screen and (min-width: 601px) {
.cam3_outer {
/*background: url("../images/pc/cam3_bg.png") no-repeat top center/auto 100%;*/
/*margin-top: 0%;*/
margin-bottom: 10%;
/*padding: 20vh 0 20vh;
z-index: 10;*/
position: relative;
}

	/*
.detail {
margin-left:0;
margin-top: 0.5em;
font-size: 0.7em;
width: 13.5625vw;
max-width: 217px;
height: 5vw;
max-height: 48px;
}
	
ul.sec_anniv_cam3 {
list-style: none;
padding: 0 0 0 4%;
margin: 0;
}*/
}



@media screen and (min-width: 1400px) {
.cam3_outer {
/*padding: 30vh 0 100vh;
margin-top: -2%;*/
width: 100%;
height: 100%;
}
}

@media screen and (min-width: 1600px) {
.cam3_outer {
width: 100%;
max-width: 1600px;
height: 100%;
max-height: 724px;
/*background: url("../images/pc/cam3_bg.png") no-repeat top center/auto 100%;*/
margin-bottom: 20%;
/*padding: 19% 7% 0% 10% !important; 
z-index: 10;*/
}
}




/* ▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼　footer　▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼ */

.nogifra_logo {
width: 100%;
padding: 75px 0 48px;
background: #fff;
text-align: center;
}

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


@media screen and (min-width: 601px) {
.nogifra_logo {
padding: 60px 0 80px;
background: #fff;
text-align: center;
}

.nogifra_logo img {
width: 35%;
}
}


@media screen and (min-width: 960px) {
.nogifra_logo {
padding: 130px 0 145px;
background: #fff;
text-align: center;
}
}

@media screen and (max-width: 600px) {
footer .footer-share{
	font-size: calc(100vw * (38 / 750));
	text-indent: calc(100vw * (0 / 750));
}
}

	
@media screen and (min-width: 601px) and (max-width: 1600px) {
		footer .footer-share {
			font-size: calc(100vw * (22 / 1600));
			text-indent: calc(100vw * (0 / 1600));
		}
	}

@media screen and (min-width: 1601px) {
    footer .footer-share {
        font-size: 22px;
        text-indent: 0px;
	}
}