@charset "utf-8";

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

@media(max-width:999px){

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

#wrap {
overflow-x:hidden;
}

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

.cts {
width:90%;
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 2em 0.7em;
line-height:1;
font-size:6vw;
-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;
}

/*MV*/
#mv {
	width:100%;
	height:90vh;
	background: linear-gradient(180deg, rgba(34,52,90,0) 40%,rgba(34,52,90,0.9) 50%, rgba(34,52,90,1) 100%), url(../img/mv_bg_sp.webp);
	background-position:right 40% top 0%;
	background-size:cover;
}
#mv .cts_mv {
	height: 100%;
	position:relative;
}
#mv .mv_inner{
	height:100%;
}
#mv .text_outer {
	position:absolute;
	right:0;
	left:0;
	bottom:70px;
	width:85%;
	margin:auto;
}
#mv .text img{
	width:100%;
	height:100%;
}
#mv h1 {
	width:60px;
	position:absolute;
	bottom:35px;
	left:0;
	right:0;
	margin:0 auto;
}

#mv2 .text_outer {
	padding:5vw;
}
#mv3 .text_outer {
	padding:0;
}


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

#mv4 .mv_text p{
	font-size: 4.2vw;
	font-weight:500;
	margin-bottom:1em;
	letter-spacing:0.05em;
}
#mv4 .mv_text p.fromto{
	font-size: 2.6vw;
	margin-bottom:2em;
}
#mv4 .mv_text p.copy{
	font-size: 3.2vw;
	text-align:center;
	margin:20px 0 40px;
}
#mv4 .mv_text .badge{
	background:var(--color-btnred);
	color:#fff;
	font-size:1em;
	padding:0.1em 0.75em 0.2em;
	margin-bottom:0.5em;
	display:inline-block;
}
#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 60px;
	background:var(--color-bgblack);
	color:#000;
}
#prize .cts{
}
#prize .cts.round{
	padding:10px;
	background:#fff;
	margin-top:20px;
	border-radius:20px;
	padding-bottom:20px;
}
#prize .tour_detail_one{
padding:20px 10px 10px;
display: grid;
grid-template-columns: 25vw auto;
grid-template-rows: repeat(2, auto);
grid-column-gap: 10px;
grid-row-gap: 0px;
border-bottom:1px solid #eee;
margin:0 0 20px;
}
#prize .tour_detail_one:last-child{
	border-bottom:none;
	margin-bottom:0;
}
#prize .tour_image_badge 			{ grid-area: 1 / 1 / 2 / 2; }
#prize .tour_detail_one_text 	{ grid-area: 1 / 2 / 2 / 3; }
#prize .tour_image 						{ grid-area: 2 / 1 / 3 / 3; text-align:center;}
#prize .tour_image img{width:60%; margin:auto; }
#prize .tour_detail h3{
	line-height:1.2;
	letter-spacing:0.05em;
	font-size:5vw;
	font-weight:600;
}
#prize .tour_detail h3 small{
	font-size:0.7em;
}

#prize .tour_schedule_title{
  font-size: 3.4vw;
	margin:0 0 0.5em;
}

#prize a{
	color:var(--color-red);
}

#prize .attention{
	font-size:3vw;
	color:#fff;
	padding:20px 10px 50px;
}


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

#campaign .campaign_title {
margin-bottom:20px;
}

#campaign .campaign_title h2 {
font-size:135%;
font-weight:bold;
padding:0;
}
#campaign .campaign_title p.subtitle{
	font-size:4.25vw;
	margin-bottom:1em;
}
#campaign .campaign_title p{
	font-size:3vw;
	text-align:center;
	margin-top:20px;
}

#campaign .titles {
padding-bottom:40px;
}

#campaign .titles h2 {
width:50%;
margin:0 auto 7px;
}

#campaign .titles .subtitle {
display:flex;
justify-content:center;
align-items:center;
}

#campaign .titles .subtitle .kana {
color:#fff;
font-weight:bold;
padding:0 15px;
}

#campaign .overviews {
padding-bottom:40px;
}

#campaign .overviews .overview {
width:100%;
position:relative;
margin-bottom:18px;
background:var(--color-bgblack);
}

#campaign .overviews .overview:last-child {
margin-bottom:0;
}

#campaign .overviews .overview .item {
width:100%;
display:flex;
justify-content:center;
align-items:center;
color:#fff;
background:rgba(255,255,255,0.1);
padding:7px;
}

#campaign .overviews .overview .details {
    background:#fff;
		color:#000;
    width:100%;
    padding:18px 25px;
}

#campaign .overviews .overview:first-child .details {
}
#campaign .overviews .overview table td{
	padding:0 1em 0.25em 0;
}
#campaign .overviews .overview .details .detail {
display:flex;
}
#campaign .overviews .overview .details .prize2-list{
	font-size:3.8vw;
}
#campaign .overviews .overview .details .prize2-list tr{
	display:flex;
	flex-wrap:wrap;
	padding-bottom:1em;
}
#campaign .overviews .overview .details .prize2-list td:nth-child(1){width:100%;}
#campaign .overviews .overview .details .prize2-list td:nth-child(2){width:75%;}
#campaign .overviews .overview .details .prize2-list td:nth-child(3){width:25%;text-align:right;}
#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;
	display:block;
}
#campaign .overviews .overview .details .shop_btn {
margin:15px 0;
display:flex;
justify-content:center;
}

#campaign .overviews .overview:nth-child(5) .details .shop_btn,
#campaign .overviews .overview:nth-child(6) .details .shop_btn {
    display:flex;
    justify-content:center;
    align-items:center;
}

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

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

#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:80%;
display:flex;
}

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

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

#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:200px;
    margin:20px auto 20px;
}

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

#campaign .cta a, #prize .cta a {
width:100%;
margin:auto;
}


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

#campaign .steps {
	display:flex;
	flex-flow: column;
	margin:20px 0 30px;
	gap:20px;
}
#campaign .step_one{}
#campaign .step_one_label{
	display:flex;
	align-items:center;
	flex-flow: column;
  width: 100%;
}
#campaign .step_one_label p{
  position: relative;
	font-size:5vw;
	line-height:1;
	padding:0.2em 0 0.3em;
	background:var(--color-bgblack);
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
	width:100%;
}
#campaign .step_one_label .arrow{
	display:block;
  width: 100%;
  height: 10px;
  background: var(--color-bgblack);
  clip-path: polygon(0 0, 100% 0%, 50% 100%);
}
#campaign .step_one_body{
	display:flex;
	align-items:center;
	gap:15px;
}
#campaign .step_one_body_image{
	width:25%;
}
#campaign .step_one_body_text{
	font-size:3.5vw;
	width:70%;
}
#campaign .steps h3{
	font-size:4.5vw;
	font-weight:bold;
	margin:0.5em 0 0.5em;
}

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

#campaign .shops .shop {
    width:48%;
    margin:0 4% 4% 0;
		box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.45);
}

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

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

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


/*CONCEPT*/
#concept {
padding:50px 0 30px;
}
#concept .cate_titles {
display:flex;
justify-content:center;
align-items:center;
padding-bottom:20px;
flex-flow: column;
}

#concept .cate_titles h2 {
font-size:1.6rem;
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:4vw;
	margin:1em 20px 1em;
}

#concept .concept_copy_text{
	margin-bottom:50px;
	padding:0 20px;
}
#concept .concept_copy_movie{
	margin-bottom:50px;
}
#concept .concept_copy_movie video{
	width:100%;
	height:auto;
}
.concept_slide .swiper-wrapper{
	transition-timing-function:linear!important; 
}
#concept .concept_one{
	margin-bottom:40px;
}
#concept .concept_one h3{
	background:var(--color-bgblack);
	color:#fff;
	text-align:center;
	padding:0.1em 0 0.1em;
	font-weight:500;
	font-size:5vw;
	margin-bottom:10px;
}
#concept .concept_one_body{
display:flex;
justify-content:center;
align-items:center;
gap:10px;
}
#concept .concept_one_image{
	width:calc(33.33% - calc(20px / 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 2em;
}

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

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

#terms .cts {
background:var(--color-bgblack);
padding:20px 20px;
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:1.6rem;
font-weight:bold;
color:#fff;
padding:0 15px;
}

#terms .terms_btn {
width:200px;
color:#fff;
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:20px 0 40px;
background:var(--color-bgblack);
}

#contact .cts{
padding:30px 20px 30px;
}

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

#contact .cate_titles h2 {
font-size:110%;
font-weight:bold;
padding:0 0px;
text-align:center;
}

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



/*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 40px;
}

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

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

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





}