@charset "UTF-8";
* {box-sizing: border-box;}
html {font-size: 62.5%;}
body {
	padding-top: 0!important;
	line-height: 1.4;
	transition: .5s;
	display: block;
	height: 100vh;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-image: linear-gradient(135deg, #f1bb7b, #df718a 50%, #975f9f);
	min-width: 320px;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
}
.p-header-container{padding-bottom: 30px!important;}
.c-side-navi__inner{background: #fff;}
.c-side-navi__inner{padding-top: 115px!important;}
.c-side-navi__inner__search-btn{margin-bottom: 50px!important;}
.c-side-navi__inner__logo{top: 40px!important;}
.l-footer{background: #fff; position: relative; z-index: 5;}


body.after_load {
	opacity: 1;
}
body * {
	color: #000;
	font-weight: 400;
}
.bold {font-weight: 700;}

a, a:hover, a::after, a:hover::after, a img, a:hover img, a::before, a:hover::before {transition: 0.3s;}
a, a:focus {outline:none;}
a{
	font-family: "Noto Sans JP", sans-serif;
}
img {width: 100%;}
.relative{
	position: relative;
}
section{
	padding-bottom: 5%;
}
.absolute{
	position: absolute;
}
  
  @keyframes infinite-rotate {
	0% {
	  transform: translate(-50%, -50%) rotate(0deg);
	}
	100% {
	  transform: translate(-50%, -50%) rotate(360deg);
	}
  }

.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

h2 {
	font-size: 4rem;
	text-align: center;
	margin-bottom: 5%;
	padding-top: 30px;
	color: #fff;
	font-weight: bold;
}
/* header */
header{display: none;}
/* .inner section {
	padding: 3% 20px 20% 20px;
} */
.txt-center{
	text-align: center;
}
.pd-side{
	padding: 0 14px;
}
.red{
	color: #E60012!important;
	font-weight: 600;
}
.mb{margin-bottom: 5%;}

.page-top{
	position: fixed;
	right: 5%;
	bottom: 5%;
	z-index: 10;
}
.page-top a{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: end;
	height: 100%;
	width: 120px;
	height: 120px;
	background: #E60012;
	border-radius: 60px;
	z-index: 1;
}
.page-top a .chikuwa{
	position: absolute;
	top: -15%;
	left: 50%;
	transform: translateX(-50%);
	transition: .3s;
	width: 60px;
	height: 100px;
	background-image: url(../images/chikuwa_01.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}
.page-top a p{
	font-size: 1.2rem;
	color: #fff;
	margin-bottom: 20px;
	font-weight: 500;
}
.page-top .shadow{
	width: 100%;
	height: 100%;
	background: #9C0000;
	position: absolute;
	bottom: -5px;
	right: -5px;
	border-radius: 60px;
	z-index: -1;
}
.bg-grid{
	background-image: url(../images/video_bg.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

/* menu -----------------------------------------------------------------------------------*/
.menu {
	top: 46%;
  right: 4.5vw;
  position: fixed;
  width: 20%;
  transform: translateY(-50%);
}
#top-logo {
	width: 250px;
	margin-inline: auto;
	margin-bottom: 10px;
	mix-blend-mode: multiply;
}
.nav_list li{
	width: 80%;
	margin-bottom: 0px;
}

.btn.cta-btn{
	display: block;
	margin-bottom: 10px;
	z-index: 5;
}
.btn.cta-btn:last-of-type{
	margin-bottom: 0;
}
.menu .btn.cta-btn .btn-inner{
	background: #fff;
}
.menu .btn img{
	transition: .3s;
}
.btn.cta-btn .btn-inner{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 80px;
	background-image: linear-gradient(135deg, rgba(255, 233, 130, 1), rgba(232, 173, 0, 1));
	border-radius: 50px;
	bottom: 0;
	right: 0;
	border: solid 2px #000;
	transition: .2s;
}
.btn.cta-btn .btn-inner > div{
	margin-top: 4px;
}

.fs0{font-size: 0;}

.contents {
	width: 400px;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	overflow-y: auto;
	-ms-overflow-style: none;
	 scrollbar-width: none;
	scroll-behavior: smooth;
	z-index: 10;
}
.contents::-webkit-scrollbar {
	display: none;
}

h2.ttl{
	width: 70%;
	margin-inline: auto;
}

.left-area{
	width: calc((100vw - 400px - 6.944vw) / 2);
	height: 100%;
	position: fixed;
	bottom: 0;
	left: 6.944vw;
}

/* FV -----------------------------------------------------------------------------------*/
.FV {
	background: #fff;
}
.FV .visual{
	display: none;
}
.FV .bg-grade{
	background-image: linear-gradient(135deg, #f1bb7b73, #df718a73);
	position: relative;
	height: 100%;
}
.FV .ttl{
	padding-top: 25%;
	margin-bottom: 10%;
}
.FV .txt{
	width: 82%;
	margin-inline: auto;
	padding-bottom: 50%;
}
.FV .wave{
	bottom: -1px;
	left: 0;
}
.fv-ttl{
	position: absolute;
	width: 70%;
	top: 25%;
	left: 51%;
	transform: translateX(-50%);
	z-index: 3;
}

.FV .btn {
    width: 22%;
    bottom: 12%;
    right: 10%;
    animation: scaleLoop 1.5s ease-in-out infinite;
}
@keyframes scaleLoop {
	0% {
		transform: scale(1);
	}
	50% {
		transform: scale(1.1);
	}
	100% {
		transform: scale(1);
	}
}

.pc-chara {
	position: absolute;
	width: 14%;
	bottom: 0;
	left: 51%;
	transform: translateX(-51%);
	height: 35%;
	z-index: 3;
	pointer-events: none;
}

.pc-chara img {
	position: absolute;
	bottom: -110%; 
	left: 50%;
	transform: translateX(-50%);
	width: auto;
	height: 100%;
	opacity: 0;
	transition: bottom 0.4s ease-in, opacity 0.4s ease-in;
	display: block;
}

.pc-chara img.is-active {
	bottom: 0;
	opacity: 1;
	transition: bottom 0.5s ease-out, opacity 0.4s ease-out;
}

.scroll-guide {
	position: fixed;
	top: 20px;
	right: 20px;
	background: rgba(0,0,0,0.7);
	color: white;
	padding: 10px 20px;
	border-radius: 30px;
	font-size: 14px;
	z-index: 100;
}


@media (max-width: 768px) {
	.pc-chara {display: none;}
}

.pc-train {
	position: fixed;
	bottom: 0;
	right: 0;
	width: 33.333%;
	height: 200px;
	overflow: hidden;
	pointer-events: none;
  }

  .pc-train::after{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	bottom: 50px;
	right: 0;
	background: #fff;
  }
  
  /* 電車 */
  .pc-train .train {
	position: absolute;
	bottom: 50px;
	right: 0%;
	animation: train-move 8s linear infinite;
  }

  .pc-train .train img{
	width: 200px;
  }
  
  @keyframes train-move {
	0% {
	  transform: translateX(-250%);
	}
	100% {
	  transform: translateX(100%);
	}
  }

  
/* episode -----------------------------------------------------------------------------------*/
.episode{
	background: #fff;
	padding: 15% 0 0 0;
}
.episode .ttl{
	margin-bottom: 30px;
}
.epi-ttl{
	width: 92%;
	margin-inline: auto;
	margin-top: 5px;
	margin-bottom: 25px;
}
.epi-txt{
	width: 95%;
	margin-inline: auto;
	margin-bottom: 50px;
}

 .episode-area {
	padding-bottom: 40px;
	position: relative;
}
.episode-area.white:first-of-type.is-active{
	padding-top: 0;
}
 .episode-area.white.is-active{
	padding: 0% 0 25% 0;
	margin-bottom: 10%;
}
/* .episode-02.episode-area.white.is-active, .episode-05.episode-area.white.is-active{
	padding-bottom: 2.5%;
} */
.episode-02.wave-none .wave-bottom, .episode-05.wave-none .wave-bottom{
	display: none;
}
.episode-area.white.episode-02.is-active.wave-none, .episode-area.white.episode-05.is-active.wave-none{
	padding-bottom: 12.5%;
	margin-bottom: 0%;
}
.episode-area.white.episode-02.wave-none::after, .episode-area.white.episode-05.wave-none::after{
	content:"";
	width: 100%;
	height: 30vw;
	background-image: linear-gradient(0deg, #ebe4ee 14%, transparent 70%);
	position: absolute;
	bottom: -1px;
	z-index: 0;
}
.episode-area.pink .asirai{
	top: -30px;
    left: -45px;
    width: 35%;
}
.episode-area.white .wave-bottom{
	opacity: 0;
	bottom: 0px; /* 少しずらすと動きが分かりやすい */
	transition: opacity 0.4s ease, bottom 0.4s ease;
}

.episode-area.white.is-active .wave-bottom{
	opacity: 1;
	bottom: 0;
	z-index: 0;
}
.episode-area.pink .wave-bottom{
	bottom: -1px;
}
.episode-area.pink.is-active{
	background: #c95770;
	position: relative;
	padding: 30% 0;
	/* margin-top: 10%; */
	transition: background-color 0.5s ease, padding 0.5s ease;
}
.episode-area.pink.episode-03.is-active{
	margin-bottom: 12%;
}
.episode-area.pink.is-active .wave-top{
	top: -1px;
}

/* アコーディオンボタンの設定 */
.accordion-btn {
	position: relative;
	width: 250px;
	margin-inline: auto;
	cursor: pointer;
	transition: opacity 0.3s;
	z-index: 2;
}

.accordion-btn:hover {
	opacity: 0.8;
}

.accordion-btn img {
	width: 100%;
	display: block;
}

.accordion-btn::after {
	content: "";
	display: inline-block;
	vertical-align: middle;
	color: #000;
	line-height: 1;
	width: 12px;
	height: 12px;
	border: 2px solid currentColor;
	border-left: 0;
	border-bottom: 0;
	box-sizing: border-box;
	position: absolute;
	top: 50%;
	right: 30px;
	transform: translateY(-50%) rotate(135deg); /* デフォルト：下向き */
	transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.episode-area.pink .accordion-btn::after {
	color: #fff;
}

/* アクティブ時の矢印の向き（上向き） */
.accordion-btn.is-active::after {
	transform: translateY(-20%) rotate(-45deg);
}

.accordion_comtents {
	display: block;
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease, padding 0.5s ease;
}

.accordion_comtents.is-open {
	max-height: 100%; /* 動画が表示される十分な高さ */
	opacity: 1;
	padding-top: 20px;
}

.accordion_comtents figure{
	width: 80%;
	margin-inline: auto;
}
.movie_thumb{
background: none!important;
}
.movie_thumb figure{
	mix-blend-mode: normal!important;
}

.episode .blog-ttl{
	width: 70%;
	margin-inline: auto;
	margin-bottom: 10px;
}

.episode .blog{
	position: relative;
	overflow-x: auto;
	z-index: 1;
	cursor: grab;
}
.episode .blog a{
	transition: .3s;
}
.episode .blog ul{
	width: max-content; 
	padding: 0 10px 25px 10px;
}
.episode-06.episode-area{
	margin-bottom: 0;
	padding-bottom: 15%;
}
/* .episode-06.episode-area .blog ul{
	width: 1280px;
	padding: 0 10px 25px 10px;
} */
.episode .blog ul li{
	width: 48%;
	margin-right: 15px;
	max-width: 280px;  /* ← PCでの上限 */
	min-width: 200px;  /* ← SPでの下限（任意） */
}
.episode-06.episode-area.pink.is-active{
	padding-bottom: 15%;
}
.episode-06.episode-area.pink .wave-bottom{
	bottom: -46px;
	z-index: 2;
}

.episode .blog ul li .blog-thum{
	font-size: 0;
	margin-bottom: 5px;
}
.episode .blog ul li .txt{
	width: 85%;
}
.episode .blog ul li p{
	font-size: 1.6rem;
}
.episode .movie_thumb{
	margin-bottom: 15px;
}
.episode .episode-area.pink .blog ul li p{
	color: #fff;
}
.episode .scroll-txt{
	text-align: center;
	font-size: 1.4rem;
	margin: 10px 0;
	font-weight: bold;
}
.episode .episode-area.pink .scroll-txt{
	color: #fff;
}

.fancybox-slide{
	padding: 20px!important;
}

.episode .video{
	width: 80%;
	margin-inline: auto;
	margin-bottom: 15px;
}

.episode .video video{
	width: 100%;
}
/* character --------------------------------------------------------------------------------------*/
.character{
	position: relative;
	padding: 30% 0 30% 0;
	background: #fff;
	background-image: 
    linear-gradient(to right, #e5e7eb 1px, transparent 1px),
    linear-gradient(to bottom, #e5e7eb 1px, transparent 1px);
    background-size: 20px 20px;
}
.character h2{
	margin-bottom: 30px;
}
.character .intro{
	width: 60%;
	margin-inline: auto;
	margin-bottom: 30px;
}
.character .intro-txt{
	width: 65%;
	margin-inline: auto;
	margin-bottom: 50px;
}
.character .index{
	width: 80%;
	margin-inline: auto;
}
.character .index.old{
	margin-bottom: 50px;
}
.character .wave-bottom{
	bottom: 0;
}

.character .wave-top{
	top: 0;
	width: 100%;
}

.character.is-active .wave-top{
	display: none;
}

/* chart -----------------------------------------------------------------------------------*/
.chart{
	position: relative;
	background: #fff;
}
.chart .bg-grade{
	padding: 10% 0 30% 0;
	background-image: linear-gradient(175deg, #f1bb7b73, #df718a73);
}
.chart .ttl{
	margin-bottom: 30px;
}
.chart .chart-img{
	width: 90%;
	margin-inline: auto;
}
.chart .wave-bottom{
	bottom: -1px;
}

/* sns --------------------------------------------------------------------------------------*/
#sns{
	padding-top: 20px;
	background: #4d4b4c;
	padding: 8% 10px;
}
.sns h3{
	width: 60%;
	margin-inline: auto;
	margin-bottom: 50px;
}
.sns ul{
	width: 300px;
	margin-inline: auto;
	justify-content: center;
	align-items: center;
	margin-bottom: 20px;
}
.sns ul li{
	width: 14%;
	margin: 0 5%;
	transition: .3s;
}
.sns ul li a{
	display: block;
	width: 100%;
}


.btn_block {
	width: 100%;
	margin: auto;
  display: block;
  background-color: #c74947;
  font-weight: bold;
  padding: 14px 10px;
  box-sizing: border-box;
  text-align: center;
  border-radius: 8px;
  box-shadow: 0 4px 0 rgb(0 0 0 / 20%);
  transition: .3s;
  cursor: pointer;
	position: relative;
}
.btn_block:hover {
	box-shadow: none;
	transform: translate(0, 5px);
}
.btn_block span {
	color: #fff;
	font-weight: bold;
	line-height: 1;
}
.btn_block::after {
	content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 0 7px 8px;
  border-color: transparent transparent transparent #fff;
  position: absolute;
  top: 50%;
  right: 6%;
  margin-top: -7px;
}



.video-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 20px;
	max-width: 1200px;
}

.video-card {
	cursor: pointer;
	transition: transform 0.3s, box-shadow 0.3s;
}

.video-thumbnail {
	width: 80%;
	margin-inline: auto;
	position: relative;
	margin-bottom: 15px;
}

.thumbnail-content {
	/* position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center; */
}

.play-icon {
	width: 60px;
	height: 60px;
	background: rgba(255,255,255,0.9);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24px;
}

.video-info {
	padding: 15px;
}

.video-title {
	font-size: 1.1em;
	font-weight: bold;
	color: #333;
	margin-bottom: 5px;
}

.video-description {
	font-size: 0.9em;
	color: #666;
}

/* モーダルスタイル */
.modal {
	display: none;
	position: fixed;
	z-index: 1000;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,0.9);
	animation: fadeIn 0.3s;
}

@keyframes fadeIn {
	from { opacity: 0; }
	to { opacity: 1; }
}

.modal-content {
	position: relative;
	margin: auto;
	top: 50%;
	transform: translateY(-50%);
	max-width: 90%;
	max-height: 90vh;
	width: 350px; /* スマホ幅 */
}

.close-btn {
	position: absolute;
	top: -40px;
	right: 0;
	color: 000;
	font-size: 35px;
	font-weight: bold;
	cursor: pointer;
	transition: color 0.3s;
	z-index: 1001;
}

.close-btn:hover {
	color: #667eea;
}

video {
	width: 100%;
	aspect-ratio: 9 / 16; /* スマホ縦長比率 */
	border-radius: 8px;
	background: black;
}

.modal-title {
	color: white;
	margin-top: 15px;
	font-size: 1.3em;
	text-align: center;
}

/* --------------------- */
@media screen and (min-width: 751px) {
	.menu .btn.cta-btn:hover::after{right: 5px;}
	.btn.cta-btn:hover::after{right: 15px;}

	.menu a:hover img{opacity: .5;}
	.cta-area .btn a:hover img{opacity: .5;}
	.button a:hover{background: #522151; color: #fff;}
	.button a:hover::after{color: #fff;}

	.episode .blog a:hover{opacity: 0.7;}
	.sns ul li:hover{transform: scale(1.1);}
}

/* --------------------- */

@media screen and (min-width: 1441px) {
	.left-area{left: 100px; width: calc((100vw - 28vw - 100px) / 2);}
	.contents{width: 28vw;}
	.FV .ttl{margin-bottom: 15%;}
	.pc-train {width: 45%;}
	.FV .btn {bottom: 11.5%; right: 10%;}
	.accordion-btn{width: 300px;}
	.accordion_comtents.is-open{max-height: 50%;}
	/* .episode .blog ul li{width: 450px;}
	.episode .blog ul{width: 950px;} */
	/* .episode-06.episode-area .blog ul{width: 1900px;} */
	.episode-06.episode-area.pink .wave-bottom{bottom: -90px;}
	.episode .scroll-txt{font-size: 1.8rem;}
	@keyframes train-move {
		0% {
		  transform: translateX(-450%);
		}
		100% {
		  transform: translateX(100%);
		}
	  }

	  .episode .blog ul li{max-width: 380px;}
	
}
@media screen and (max-width: 1200px) {
	.contents{right: 0; width: 38%;}
	.left-area{width: calc((100vw - 35% - 6.944vw) / 2);}
	.menu {right: 2vw; width: 20%;}
	.sns ul{width: 100%;}
	.sns h3{width: 70%; margin-bottom: 30px;}
	/* .episode .blog ul li{width: 280px;}
	.episode .blog ul li .txt{width: 24vw;} */
	/* .episode .blog ul{width: 610px;} */
	/* .episode-06.episode-area .blog ul{width: 1200px;} */
	.episode .blog ul li{
		width: 20%;
		max-width: 250px;  /* ← PCでの上限 */
	}
	.episode .blog ul li .txt{width: 95%;}
}

@media screen and (max-width: 900px) {
	.tel-area .item .icon{width: 2.5vw;}
	.tel-area .item a{font-size: 2.8vw;}
	.btn.cta-btn p{font-size: 2.2rem;}
	.pc-chara{height: 30%;}
	/* .episode .blog ul{width: 470px;}
	.episode .blog ul li{width: 210px;} */
	/* .episode-06.episode-area .blog ul {width: 920px;} */
	.episode-area.pink .asirai {top: -20px; left: -20px; width: 25%;}
	.accordion-btn{width: 75%;}
}/* 900px */

@media screen and (max-width: 768px) {
	.FV .visual{display: block;}
	.FV .ttl{padding-top: 15%;}
	.FV .btn{
		top: 35.5%;
		bottom: inherit;
		right: 20px;
	}
	.FV .txt{padding-bottom: 30%;}
	.menu{display: none;}
	.fv-ttl{display: none;}
	.c-side-navi__inner{padding-top: 0!important;}
	.c-side-navi__inner__search-btn{margin-bottom: 0!important;}
	.c-side-navi__inner{background: transparent;}
	.c-side-navi__inner__search-btn a{display: flex!important;}
	body { display: block; background-image: none;}
	p{font-size: 1.8rem;}
	.contents {position: static; background-color: #fff; width: 100%; height: auto; transform: translate(0, 0); padding-top: 18.667vw;}
	.pd {padding: 0 15px 12% 15px;}

	.btn.cta-btn p{font-size: 1.8rem;}
	.btn.cta-btn span {font-size: 1.6rem; margin-bottom: 5px;}


	.nav_list li {width: 100%; height: 100%; margin: 0 0 2rem 0;}
	.menu {width: 350px; position: fixed; top: 0; left: inherit; right: -350px; z-index: 101; transform: translate(0, 0); transition: 1s cubic-bezier(0.16, 1, 0.3, 1);}
	#top-logo {width: 70%; padding-top: 60px;}
	.menu nav {
		background-image: url(../images/bg_hirai.jpg) ;
		background-position: center center;
		background-size: cover;
		background-repeat: no-repeat;
		background-attachment: fixed;
		position: static;
		background-attachment: fixed;
		height: 100vh;
		padding: 20px;
		box-sizing: border-box;
		background: rgba(255, 255, 255, .8);
	}
	.menu.open {right: 0;}
	.menu nav > ul li {transition: 1s cubic-bezier(0.16, 1, 0.3, 1); margin-bottom: 24px;}
	.menu nav > ul li:last-child {margin-bottom: 0;}
	.menu.open > ul li a {
		transform: translateX(0px);
		opacity: 1;
		transition-delay: .2s;
	}
	.menu.open > ul li:nth-child(2) a {transition-delay: .35s;}
	.menu.open > ul li:nth-child(3) a {transition-delay: .4s;}
	.menu.open > ul li:nth-child(4) a {transition-delay: .45s;}
	.menu.open > ul li:nth-child(5) a {transition-delay: .5s;}

	.btn.cta-btn.cta-item-on{display: flex; justify-content: center;}
	.cta-item-on.btn.cta-btn p{font-size: 2rem;}
	.cta-item-on.btn.cta-btn span{font-size: 1.4rem; margin-bottom: 0;}
	.cta-item-on.btn.cta-btn.btn.cta-btn .btn-item{width: 40px; left: 10px;}

	.sp-logo{display: block; width: 130px; position: absolute; top: 12px; z-index: 2; left: 20px;}

	.page-top{bottom: 2%;}
	.page-top a{width: 80px; height: 80px;}
	.page-top a .chikuwa{top: -50%; width: 50px; height: 80px;}
	.page-top p{font-size: 1rem;}
	h2{font-size: 3rem;}

	.pd-side{padding: 0 10px;}
	.cta-area{padding: 5% 3%;}
	.tel-area .item .icon{width: 3.5vw; display: flex; justify-content: center; align-items: center; margin-top: 3px;}
	.tel-area .item a{font-size: 5.5vw;}

	.treatment{top: -1px;}
	
	.episode .blog ul{width: 550px;}
	.episode-06.episode-area .blog ul{width: 1080px;}
	.episode .blog ul li{width: 250px;}
	.episode-06.episode-area.pink .wave-bottom{bottom: -15vw;}
	.episode .blog ul li .txt{width: 85%;}
	
}/* 650px */

@media screen and (max-width: 520px) {
	.menu { width: 100%; right: -100%;}
	.cta-item-on.btn.cta-btn.btn.cta-btn .btn-item{width: 15vw;}
	.page-top{bottom: 15%;}
	/* .episode-06.episode-area.pink .wave-bottom{bottom: -48px;} */
}/* 520px */

@media screen and (max-width: 480px) {
	.button a{width: 280px;}
	.fancybox-inner .fancybox-stage{max-width: inherit!important;}
    .fancybox-slide{padding: 20px!important;
}
}/* 480px */

@media screen and (max-width: 400px) {
	.menu { width: 100vw; right: -100vw;}
	.nav_list li span{font-size: 1.4rem;}
	.message .pd{padding-top: 70px;}
	
}/* 400px */


@media screen and (max-width: 350px) {
	.ca_btn-area ul li a{font-size: 1.4rem;}
	.ca_btn-area ul li a::after{right: 8px;}
	/* .copy{padding-bottom: 32vw;} */
}/* 370px */