@charset "utf-8";

/* ==================================================
Common CSS
================================================== */

@media(min-width:1000px){

/*STYLE*/
.sp {
display:none;
}

#wrap {
overflow-x:hidden;
}

p,table {
font-size:1em;
line-height:160%;
}


.cts {
width:var(--base-width-pc);
margin:auto;
position:relative;
}

/* COMMON PARTS */
.form_btn {
display:flex;
justify-content:center;
}
.form_btn a {
background: var(--color-btnred);
display:flex;
justify-content:center;
align-items:center;
padding:0.5em 3.5em 0.7em;
line-height:1;
font-size:2.6rem;
-webkit-animation:btn 1s ease infinite alternate;
animation:btn 1s ease infinite alternate;
}
.form_btn a:hover{
	opacity:0.75;
	transition: 0.4s all;
}
.form_btn a p {
color:#fff;
font-weight:400;
}
.form_btn .arrow{
margin-left:0.5em;
width:0;
height:0;
border-style:solid;
border-width: 0.4em 0 0.4em 0.6em;
border-color: transparent transparent transparent #fff;
}

/* start cover*/
.start_cover p {
	width: 300px;
}

/*MV*/
#mv {
	width:100%;
	height:800px;
	background-image: url(../img/mv_bg.webp);
	background-position:left 0% top 0%;
	background-size:cover;
}
#mv .mv_inner{
	height:100%;
	background: linear-gradient(180deg, rgba(34,52,90,0) 75%,rgba(34,52,90,0.9) 85%, rgba(34,52,90,1) 100%)
}
#mv .cts_mv {
	height: 100%;
	position:relative;
}
#mv .text_outer {
	position:absolute;
	top:0;bottom:0;
	left:0;right:0;
	height:100%;
	width:calc(10% + 420px);
	background: linear-gradient(90deg, rgba(34,52,90,1) 0%, rgba(34,52,90,.9) 90%, rgba(34,52,90,0) 100%); 
}
#mv .text {
	position:absolute;
	bottom:50px;
	left:10%;
	top:5%;
	height:75%;
}
#mv .text img{
	width:100%;
	height:100%;
}
#mv h1 {
	width:120px;
	position:absolute;
	bottom:50px;
	left:0;
	right:0;
	margin:auto;
}


#mv2 {
	width:100%;
/*	min-height:900px;*/
	height:100vh;
}
#mv2 .mv_inner{
	height:100%;
}
#mv2 .cts_mv {
	height: 100%;
	display:flex;
	flex-direction: row-reverse;
}
#mv2 .text_outer {
	height:100%;
	width:calc(10% + 420px);
}
#mv2 .text {
	margin:0 auto;
	padding:5% 5%;
	height:100%;
	max-width:95%;
}
#mv2 .text img{
	width:100%;
	height:100%;
}
#mv2 .mv-swiper{
	height:100%;
}
#mv2 .image_outer{
	height:100%;
	width:calc(100% - calc(10% + 420px));

}
#mv2 .image_outer .mv-slide img{
	height:100%;
	width:100%;
	object-fit: cover;
	object-position: 50% 0%;
}
#mv2 .image_outer .mv-slide div{
	background-position:left 50% top 0%;
	background-repeat:no-repeat;
	background-size:cover;
	width:100%;
	height:100%;
}
#mv2 .image_outer .mv-slide.slide-01{
	background-image: url(../img/prize_photo_01.jpg);
}
#mv2 .image_outer .mv-slide.slide-02 > div{
	background-image: url(../img/prize_photo_02.jpg);
}
#mv2 .image_outer .mv-slide.slide-03 > div{
	background-image: url(../img/prize_photo_03.jpg);
}
#mv2 .image_outer .mv-slide.slide-04 > div{
	background-image: url(../img/prize_photo_04.jpg);
}

#mv4{
	background:var(--color-bgblack);
	color:var(--text-color-base);
}
#mv4 .mv_text{
	padding:60px 0;
}
#mv4 .mv_text h2{
	width:80%;
	margin:auto;
}

#mv4 .mv_text p{
	font-size: 1.6rem;
	font-weight:500;
	margin-bottom:0.5em;
	letter-spacing:0.1em;
}
#mv4 .mv_text p.copy{
	font-size: 1.8rem;
	text-align:center;
	margin:20px 0 40px;
}
#mv4 .mv_text .badge{
	background:var(--color-btnred);
	color:#fff;
	font-size:1rem;
	margin-right:1em;
	padding:0.1em 0.75em 0.2em;
}
#mv4 .mv_text .line{
	letter-spacing:-0.1em;
	margin:0 0.5em;
}
#mv4 .mv_text .size-M{
	font-size:0.9em;
}
#mv4 .mv_text .size-L{
	font-size:0.75em;
}
#mv4 .mv_text .sizeM{
	font-size:1.5em;
}
#mv4 .mv_text .sizeL{
	font-size:1.55em;
}


/*PRIZE*/
#prize {
	position:relative;
	padding:0.1px 0 100px;
	background:var(--color-bgblack);
	color:#000;
}
#prize .cts{}
#prize .cts.round{
	padding:20px;
	background:#fff;
	margin-top:30px;
	border-radius: 20px;
}
#prize .tour_detail{
	padding:20px 20px 20px 20px;
}
#prize .tour_detail_one{
	display:flex;
	gap:30px;
	padding-bottom:20px;
	margin:0 0 20px;
	justify-content:space-between;
	align-items:center;
	border-bottom:1px solid #eee;
}
#prize .tour_detail_one:last-child{
	border-bottom:none;
	margin-bottom:0;
}
#prize .tour_detail h3{
	line-height:1.2;
	font-size:2.3rem;
	font-weight:600;
	margin:0.1em 0;
}
#prize .tour_detail h3 small{
	font-size:0.7em;
}

#prize a{
	color:var(--color-red);
}
#prize .tour_detail_one_text{
	width:calc(100% - 260px);
}
#prize .tour_image_badge{
	width:100px;
	min-width:100px;
}
#prize .tour_image{
	width:160px;
	min-width:160px;
}

#prize .tour_schedule_title{
  font-size: 1.4rem;
	margin:0.5em 0 0;
}

#prize .attention{
	text-align:center;
	color:#fff;
	padding:20px 10px 50px;
}

/*CAMPAIGN*/
#campaign {
padding:70px 0 90px;
}

#campaign .campaign_title {
text-align:center;
margin-bottom:40px;
}

#campaign .campaign_title h2 {
font-size:180%;
font-weight:bold;
padding:0 200px 10px;
}
#campaign .campaign_title p.subtitle{
	font-size:2rem;
	margin-bottom:2em;
}
#campaign .campaign_title p{
	font-size:1.4rem;
}
#campaign .overviews {
padding-bottom:40px;
}

#campaign .overviews .overview {
width:1000px;
position:relative;
display:flex;
align-items:center;
margin-bottom:20px;
background:var(--color-bgblack);
}
#campaign .overviews .overview .item{
}
#campaign .overviews .overview:last-child {
margin-bottom:0;
}

#campaign .overviews .overview .item {
width:120px;
display:flex;
justify-content:center;
align-items:center;
color:#fff;
}

#campaign .overviews .overview .details {
	background:#fff;
	color:#000;
	width:calc(100% - 120px);
	padding:18px 25px;
	position:relative;
}

#campaign .overviews .overview .details.flex {
display:flex;
align-items:center;
gap:30px;
}

#campaign .overviews .overview table td{
	padding:0 1em 0.25em 0;
}

#campaign .overviews .overview .details .detail.big{
	font-size:1.1em;
	font-weight:600;
}
#campaign .overviews .overview .details .detail.head{
	margin:0 0 5px 0;
	text-indent:-0.5em;
}
#campaign .overviews .overview .details .shop_btn {
display:flex;
justify-content:center;
}

#campaign .overviews .overview:nth-child(3) .details .shop_btn {
   margin-bottom:8px;
}

#campaign .overviews .overview .details .shop_btn a {
font-size:90%;
border:1px solid #DB0025;
display:flex;
justify-content:center;
align-items:center;
padding:5px 15px;
}

#campaign .overviews .overview .details .shop_btn a p {
color:#DB0025;
margin-right:7px;
font-size:1.1rem;
}

#campaign .overviews .overview .details .shop_btn a .arrow {
width:10px;
height:10px;
border-top:#DB0025 1px solid;
border-right:#DB0025 1px solid;
transform:rotate(45deg);
}

#campaign .overviews .overview .details .attention {
font-size:90%;
display:flex;
padding-left:10px;
}

#campaign .overviews .overview .details .target {
font-size:80%;
}

#campaign .overviews .overview .details .methods {
background:#eee;
padding:20px 25px;
margin:15px 0 5px;
}

#campaign .overviews .overview .details .methods p {
font-size:80%;
letter-spacing:0.5px;
display:flex;
}

#campaign .overviews .overview .details .methods .method_title {
font-size:90%;
font-weight:bold;
}

#campaign .overviews .overview .details .methods .method_btn {
border:#1a1a1a 1px solid;
width:120px;
margin:10px auto 0;
text-align:center;
cursor:pointer;
display:flex;
justify-content:center;
align-items:center;
padding:5px;
}

#campaign .overviews .overview .details .methods .method_btn:hover {
-webkit-animation:hover 0.5s ease forwards;
animation:hover 0.5s ease forwards;
}

#campaign .overviews .overview .details .methods .photo_method {
display:none;
}

#campaign .overviews .overview .details .methods .method_btn:before {
content:"詳細を見る";
}

#campaign .overviews .overview .details .methods .method_btn.open:before {
content:"閉じる";
}

#campaign .overviews .overview .details .shipping {
    width:90px;
    position:absolute;
    right:35px;
    top:30px;
}

#campaign .cta, #prize .cta {
width:750px;
margin:auto;
-webkit-animation:btn 1s ease infinite alternate;
animation:btn 1s ease infinite alternate;
}

#campaign .cta a , #prize .cta a {
width:650px;
margin:auto;
}

#campaign .overviews .overview .details .caution {
font-size:80%;
display:flex;
}

#campaign .steps {
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	margin:20px 0 30px;
	gap:20px;
}
#campaign .step_one{
	width:calc(50% - 10px);
}
#campaign .step_one_label{
	display:flex;
	align-items:center;
  width: 100%;
}
#campaign .step_one_label p{
  position: relative;
	font-size:1.2rem;
	background:var(--color-bgblack);
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 32px;
  width: calc(100% - 20px);
}
#campaign .step_one_label .arrow{
	display:block;
	content:'';
	width:20px;
	height:100%;
	border-top: solid 16px transparent;
	border-bottom: solid 16px transparent;
	border-left: solid 15px  var(--color-bgblack);
}
#campaign .step_one_body{
	display:flex;
	align-items:center;
	gap:20px;
}
#campaign .step_one_body_image{
	width:30%;
}
#campaign .steps h3{
	font-size:1.4rem;
	font-weight:bold;
	margin:0.75em 0;
}

#campaign .shops {
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    margin:0 0 30px;
		gap:15px;
}


#campaign .shops .shop {
   width:calc(25% - calc(60px / 4));
	 box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.45);
}

#campaign .shops .shop:nth-child(5n) {
    margin-right:0;
}

#campaign .shops .shop:nth-child(n+5) {
    margin-bottom:0;
}


/*CONCEPT*/
#concept {
padding:0px 0 20px;
}
#concept .cate_titles {
display:flex;
justify-content:center;
align-items:center;
padding-bottom:0px;
flex-flow: column;
}
#concept .cate_titles h2 {
font-size:2rem;
font-weight:bold;
padding:0 15px;
display:flex;
justify-content:center;
align-items:center;
flex-flow: column;
gap:15px;
}
#concept .cate_titles h2:after {
content:'';
background:#fff;
height:2px;
width:2.5em;
}
#concept .cate_titles p.subtitle{
	font-size:1.6rem;
	margin:1em 0 2em;
}

#concept .concept_copy{
	display:flex;
	justify-content:space-between;
	align-items:center;
	flex-direction: row-reverse;
	margin:60px 0 100px;
}
#concept .concept_copy_text{
	width:45%;
	padding:0 60px 0 50px;
}
#concept .concept_copy_movie{
	width:55%;
}
#concept .concept_copy_movie video{
	width:100%;
	height:auto;
}
.concept_slide .swiper-wrapper{
	transition-timing-function:linear!important; 
}

#concept .concept_one{
	margin-bottom:60px;
}
#concept .concept_one h3{
	background:var(--color-bgblack);
	color:#fff;
	text-align:center;
	padding:0.1em 0 0.1em;
	font-weight:500;
	font-size:1.4rem;
	margin-bottom:1em;
}
#concept .concept_one_body{
display:flex;
justify-content:center;
align-items:center;
gap:30px;
}
#concept .concept_one_image{
	width:calc(33% - calc(30px / 3));
}

#concept .shop_btn {
display:flex;
justify-content:center;
}

#concept .shop_btn {
margin-bottom:8px;
}

#concept .shop_btn a {
font-size:90%;
border:1px solid var(--color-bgblack);
background: var(--color-bgblack);
display:flex;
justify-content:center;
align-items:center;
padding:5px 6em;
}

#concept .shop_btn a p {
color:#fff;
font-size:1.4rem;
}

/*TERMS*/
#terms {
padding:50px 0 0px;
}

#terms .cts {
background:var(--color-bgblack);
padding:40px 50px;
margin-bottom:20px;
display:none;
}

#terms .cate_titles {
display:flex;
justify-content:center;
align-items:center;
padding-bottom:20px;
}


#terms .cate_titles h2 {
font-size:2rem;
font-weight:bold;
padding:0 15px;
}

#terms .terms_btn {
width:200px;
text-align:center;
padding:10px;
font-size:90%;
cursor:pointer;
margin:auto;
border:#fff 1px solid;
display:flex;
justify-content:center;
align-items:center;
}

#terms .terms_btn:hover {
-webkit-animation:hover 0.5s ease forwards;
animation:hover 0.5s ease forwards;
}

#terms .terms_btn .word {
padding:0 15px;
}

#terms .terms_btn .word:before {
content:"応募規約を見る";
}

#terms .terms_btn.open .word:before {
content:"閉じる";
}

#terms .terms_btn .arrow {
width:10px;
height:10px;
border-top:#fff 1px solid;
border-right:#fff 1px solid;
transform:rotate(135deg);
margin-bottom:5px;
display:block;
}

#terms .terms_btn.open .arrow {
width:10px;
height:10px;
border-top:#fff 1px solid;
border-right:#fff 1px solid;
transform:rotate(-45deg);
margin-top:10px;
display:block;
}

#terms .terms {
}

#terms .terms .term {
padding-bottom:15px;
margin-bottom:15px;
}

#terms .terms .term:last-child {
padding-bottom:0;
margin-bottom:0;
}

#terms .terms .term .item {
font-size:90%;
font-weight:bold;
}

#terms .terms .term .space {
padding-right:10px;
}

#terms .terms .term p {
font-size:80%;
line-height:1.8;
}

#terms .terms .term a {
color:#e85471;
font-weight:bold;
}

#terms .terms .term .attention {
font-size:70%;
}


/*CONTACT*/
#contact {
margin:70px 0 50px;
background:var(--color-bgblack);
}

#contact .cts{
padding:30px 0 30px;
width:var(--base-width-pc);
}

#contact .cate_titles {
display:flex;
justify-content:center;
align-items:center;
padding-bottom:15px;
}

#contact .cate_titles h2 {
font-size:1.6rem;
font-weight:bold;
padding:0 15px;
}

#contact .office {
font-size:90%;
text-align:center;
padding-bottom:15px;
}

#contact .mails {
text-align:center;
}

#contact .mails .mail {
display:inline-block;
}

#contact .mails .mail a {
display:flex;
justify-content:center;
align-items:center;
text-decoration:none;
border:#fff 1px solid;
padding:7px 15px;
}

#contact .mails .mail a img {
width:20px;
}

#contact .mails .mail a p {
font-size:80%;
font-weight:bold;
}



/*BACK TO TOP*/
.BackToTop {
position:fixed;
width:40px;
height:40px;
right:15px;
bottom:15px;
z-index:100;
display:none;
}


/*footer*/
footer {
padding-bottom:20px;
}

footer .foot_logo {
width:70px;
margin:0 auto 50px;
}

footer .privacy {
text-align:center;
padding-bottom:30px;
}

footer .privacy a {
font-size:90%;
font-weight:600;
}

footer .copyright {
font-size:70%;
font-weight:300;
text-align:center;
}



}