@charset "utf-8";


/* CMS Template(CSS編集はCMS管理画面から)

/activity/precure-wakuwaku-land/detective/css/detective.css

Update:  2026-03-02 AM 10:43

====================*/



/* ----------------------------------------------------
Media query All
---------------------------------------------------- */
/* common */
#pre_wp{
	margin-bottom: 30px;
}
.fallback .mainvs{
	background: url("/activity/precure-wakuwaku-land/detective/img/bg_brick-top.jpg") repeat-x center top,url("/activity/precure-wakuwaku-land/detective/img/bg.jpg") no-repeat center top 66px;
}
.webp .mainvs{
  background: url("/activity/precure-wakuwaku-land/detective/img/bg_brick-top.jpg") repeat-x center top,url("/activity/precure-wakuwaku-land/detective/img/bg.webp") no-repeat center top 66px;
}
.avif .mainvs{
	background: url("/activity/precure-wakuwaku-land/detective/img/bg_brick-top.jpg") repeat-x center top,url("/activity/precure-wakuwaku-land/detective/img/bg.avif") no-repeat center top 66px;
}
.mainvs .wrapper{
  max-width: 1700px;
  margin: 0 auto 0;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
	align-items: center;
}
.mainvs .logo{
  width: 32%;
}
.mainvs .img{
  width: 68%;
	max-width: 1180px;
  padding: 10px 0 50px;
	z-index: 10;
}
.pre_box{
	position: relative;
  margin: -128px auto 0;
	padding: 70px 0 70px 0;
	background: url("/activity/precure-wakuwaku-land/detective/img/icon_leaf01.webp") no-repeat left top,url("/activity/precure-wakuwaku-land/detective/img/icon_leaf02.webp") no-repeat right bottom,url("/activity/precure-wakuwaku-land/detective/img/bg_line.jpg") repeat-x center top,
	url("/activity/precure-wakuwaku-land/detective/img/icon_jewelry01.png") no-repeat calc(50% - 600px) 50%	,
	url("/activity/precure-wakuwaku-land/detective/img/icon_jewelry02.png") no-repeat calc(50% + 550px) 80%,
	url("/activity/precure-wakuwaku-land/detective/img/icon_clock.png") no-repeat calc(50% - 600px) 5%,
	url("/activity/precure-wakuwaku-land/detective/img/icon_loupe.png") no-repeat calc(50% + 390px) 4%,
	url("/activity/precure-wakuwaku-land/detective/img/icon_footprints02.png") no-repeat calc(50% + 770px) 15%,
	url("/activity/precure-wakuwaku-land/detective/img/icon_footprints01.png") no-repeat calc(50% - 600px) 100%,url("/activity/precure-wakuwaku-land/detective/img/bg_line.jpg") repeat-x center bottom,url("/activity/precure-wakuwaku-land/detective/img/bg_brick.jpg") center top;
}
.pre_box .cat00{
	max-width: 970px;
	margin: 0 auto 35px;
	align-items: flex-end;
}
.pre_box .cat00 .symbol{
	width: 17.9%;
}
.pre_box .cat00 h2{
	width: 48%;
}
.pre_box .cat00 .fee{
	width: 25.5%;
	padding-bottom: 40px;
}
.pre_box .wrapper.cat01{
	position: relative;
  max-width: 1190px;
  margin: 0 auto 40px;
  display: flex;
  flex-wrap: wrap;
	position: relative;
  flex-direction:row-reverse;
}
.pre_box .wrapper.cat01 .set{
	width: 31%;
	margin: 0 1% 25px;
}
.pre_box .wrapper.cat01 .set img{
	border-radius: 8px;
}
.pre_box .wrapper.cat01::after {
  position: absolute;content: "";
  bottom: -60%;right: -30%;
  margin: 0px 0 0 0;
  background:url("/activity/precure-wakuwaku-land/detective/img/bg_symbol02.png") no-repeat;
  width: 590px;height: 690px;
  background-size: 590px 690px;
	z-index: -1;
}
.pre_box h2{
	width: 43%;
  max-width: 460px;
  margin: 0 auto 0;
}
.pre_box .cat00 .fee{
	width: 29%;
	text-align: right;
}
.js-fade {
  opacity: 0;
  transition: opacity 1.2s, transform .8s;
	transform: scale(0.6, 0.62);
}
.js-fade.is-inview {
  opacity: 1;
  transition-delay: .8s;
	transform: scale(1, 1);
}
.js-fadeUp {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 1.5s, transform .8s;
}
.js-fadeUp.is-inview {
  opacity: 1;
  transform: translateY(0);
  transition-delay: .5s;
}
.pre_box .wrapper.cat02{
	max-width: 608px;
	margin: 0 auto 50px;
}
.pre_box #room{
	position: relative;
	max-width: 800px;
	margin: 0 auto 0;
	padding: 0 10px;
	z-index: 5;
}
.pre_box #room img{
	border-radius: 15px;
}
.bn_area{
  position: relative;
  width: 100%;
  max-width: 650px;
  margin: 0 auto 40px;
  padding: 120px 10px 0;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
  z-index: 900;
}
.bn_area .img{
  width: 55%;
}
.bn_area .text{
  width: 40%;
}
/* All END */

/* ----------------------------------------------------
- 520px (Smartphone layout Only)
---------------------------------------------------- */
@media (max-width: 520px) {



/* - 520px (Smartphone layout Only) END */
}

/* ----------------------------------------------------
- 960px (Smartphone Tablet layout Only)
---------------------------------------------------- */
@media (max-width: 960px) {
	.mainvs h1{
		margin: 0 auto 0 !important;
	}
	.fallback .mainvs{
	background: url("/activity/precure-wakuwaku-land/detective/img/bg_brick-top.jpg") repeat-x center top,url("/activity/precure-wakuwaku-land/detective/img/bg.jpg") no-repeat left bottom;
}
.webp .mainvs{
  background: url("/activity/precure-wakuwaku-land/detective/img/bg_brick-top.jpg") repeat-x center top,url("/activity/precure-wakuwaku-land/detective/img/bg.webp") no-repeat left bottom;
}
.avif .mainvs{
	background: url("/activity/precure-wakuwaku-land/detective/img/bg_brick-top.jpg") repeat-x center top,url("/activity/precure-wakuwaku-land/detective/img/bg.avif") no-repeat left bottom;
}
	.mainvs .wrapper{
		display:flex;
		flex-direction:column;
	}
	.mainvs .logo{
		width: 80%;
		margin: 0 auto 0;
		padding-top: 10px;
		text-align: center;
	}
	.mainvs .img{
		width: 99%;
		margin: 0 auto 0;
		padding-top: 0;
		z-index: 10;
	}
	.pre_box{
	position: relative;
  margin: -60px auto 0;
	padding: 70px 0 70px 0;
	background: url("/activity/precure-wakuwaku-land/detective/img/icon_leaf01.webp") no-repeat left top/30%,url("/activity/precure-wakuwaku-land/detective/img/icon_leaf02.webp") no-repeat right bottom/30%,url("/activity/precure-wakuwaku-land/detective/img/bg_line.jpg") repeat-x center top,
	url("/activity/precure-wakuwaku-land/detective/img/icon_jewelry01.png") no-repeat calc(50% - 120px) 65%/30%	,
	url("/activity/precure-wakuwaku-land/detective/img/icon_jewelry02.png") no-repeat calc(50% + 150px) 65%/30%,
	url("/activity/precure-wakuwaku-land/detective/img/icon_clock.png") no-repeat calc(50% - 150px) 12%/60%,
	url("/activity/precure-wakuwaku-land/detective/img/icon_loupe.png") no-repeat calc(50% + 390px) 4%,
	url("/activity/precure-wakuwaku-land/detective/img/icon_footprints02.png") no-repeat calc(50% + 180px) 3%/30%,
	url("/activity/precure-wakuwaku-land/detective/img/icon_footprints01.png") no-repeat calc(50% - 400px) 15%/30%,url("/activity/precure-wakuwaku-land/detective/img/bg_line.jpg") repeat-x center bottom,url("/activity/precure-wakuwaku-land/detective/img/bg_brick.jpg") center top;
}
.pre_box .cat00{
	margin-bottom: 0;
}
	.pre_box .cat00 .symbol{
		display: none;
	}
	.pre_box .cat00 h2{
		width: 75%;
		margin: 0 auto 20px;
	}
	.pre_box .cat00 .fee{
		width: 40%;
		max-width: 300px;
		margin: 0 10px 0 auto;
	}
	.pre_box .wrapper.cat01 .set{
		width: 48%;
		margin: 0 1% 18px;
	}
	.pre_box #room img{
		border-radius: 10px;
	}
  .bn_area{
    position: relative;
    margin: 0 auto 40px;
    padding: 70px 10px 0;
    z-index: 9999;
  }
  .bn_area .img{
    width: 90%;
    margin: 0 auto 20px;
  }
  .bn_area .text{
    width: 100%;
  }

/* - 960px (Smartphone Tablet layout Only) END*/
}

/* ----------------------------------------------------
メディアクエリ設定  520～960px
---------------------------------------------------- */
@media only screen and (min-width: 521px) and (max-width: 960px) {
	.fallback .mainvs{
		background: url("/activity/precure-wakuwaku-land/detective/img/bg_score.png") no-repeat center bottom -3px,url("/activity/precure-wakuwaku-land/detective/img/bg.jpg") no-repeat center top;
		background-size: 200% auto,cover;
	}
	.webp .mainvs{
		background: url("/activity/precure-wakuwaku-land/detective/img/bg_score.webp") no-repeat center bottom -3px,url("/activity/precure-wakuwaku-land/detective/img/bg.webp") no-repeat center top;
		background-size: 200% auto,cover;
	}
	.avif .mainvs{
		background: url("/activity/precure-wakuwaku-land/detective/img/bg_score.avif") no-repeat center bottom -3px,url("/activity/precure-wakuwaku-land/detective/img/bg.avif") no-repeat center top;
		background-size: 200% auto,cover;
	}
}

/* ----------------------------------------------------
メディアクエリ設定  769～1200px
---------------------------------------------------- */
@media only screen and (min-width: 769px) and (max-width: 1200px) {

}

/* ----------------------------------------------------
961px- (Pc layout Only)
---------------------------------------------------- */
@media (min-width: 961px) {




/* 961px - END*/
}
/* ----------------------------------------------------
- 1200px (Pc layout Only コンテンツ内 基本幅)
---------------------------------------------------- */
@media (max-width: 1200px) {


/* - 1200px (Pc layout Only) END*/
}

/* ----------------------------------------------------
- 1920px (Pc layout Only)
---------------------------------------------------- */
@media (max-width: 1920px) {



/* - 1920px - END*/
}

/* ----------------------------------------------------
1921px- (Pc layout Only Wide)
---------------------------------------------------- */
@media (min-width: 1921px) {
.fallback .mainvs{
	background: url("/activity/precure-wakuwaku-land/detective/img/bg_brick-top.jpg") repeat-x center top,url("/activity/precure-wakuwaku-land/detective/img/bg.jpg") no-repeat center top 66px;
	background-size: auto auto,cover;
}
.webp .mainvs{
  background: url("/activity/precure-wakuwaku-land/detective/img/bg_brick-top.jpg") repeat-x center top,url("/activity/precure-wakuwaku-land/detective/img/bg.webp") no-repeat center top 66px;
	background-size: auto auto,cover;
}
.avif .mainvs{
	background: url("/activity/precure-wakuwaku-land/detective/img/bg_brick-top.jpg") repeat-x center top,url("/activity/precure-wakuwaku-land/detective/img/bg.avif") no-repeat center top 66px;
	background-size: auto auto,cover;
}


/* 1921px - END*/
}