/*************** 黒背景 ***************/
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400..900&family=Hina+Mincho&family=League+Script&family=Raleway:ital,wght@0,100..900;1,100..900&family=Pinyon+Script&family=Shippori+Mincho:wght@400;500;600;700;800&family=Zen+Old+Mincho&display=swap');
body {
	background: #000;
	color: #fff;
	font-family: 'Zen Old Mincho', serif;
	font-weight: 400;
	font-style: normal;
}
a {
	color: #fff;
}
footer ul.foot_navi_list a {
	color: #fff;
}
footer small {
	color: #fff;
}
.cont_titile a {
	color: #fff;
}
.contents_header h1,
.cont_titile,
.cont_titile span {
	color: #fff;
}
.global_nav_sp ul li a,
.global_nav_sp a span,
.breadcrumb,
.breadcrumb a {
	color: #fff;
}
.nav_follow {
	background: #000;
}
.toggle span {
	border-bottom: 1px solid #fff;
}
.global_nav_sp {
	background: rgba(0, 0, 0, 0.9);
}
.top_topics {
	background: #000;
	border: 1px solid #bbb;
	box-sizing: border-box;
}
.schedule label {
	color: #000;
}
.therapist-box .guide {
	color: #000;
}
.top_app h3 {
	color: #000;
}
.therapist-single .pickup dt,
.therapist-single .comment.cast dt,
.therapist-single .comment.master dt {
	color: #000;
}
.therapist-single .comment dd {
	background: none;
}
.calendar ul li {
	background: none;
}
.single-cast-calendar .calendar ul li .schedule-castreserve-btn {
	color: #000;
}
.recruit-detail dl dd {
	background: none;
}
.recruit .recruit-point dd h3 {
	color: #000;
}
.recruit-detail dl dt {
	color: #000;
}

.reserve-btn a {
	color: #000;
}
.ccbl-inner p {
	color: #000;
}
.calendar ul .target a {
	color: #000;
}

/*************** 黒背景(end) ***************/

/*************** カスタム ***************/

.top_schedule,
.top_blog,
.top_access {
	/* background: #f4f4f4; */
}
.top_schedule {
	background:
		linear-gradient(to left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 100%), url(../img/schedule-bg.jpg);
	background-size: 75%;
	background-repeat: repeat;
	border-top: 5px solid;
	border-bottom: 5px solid;
	border-image: linear-gradient(135deg, #999, #fff, #aaa);
	border-image-slice: 1;
}
.top_schedule {
	color: #000;
}
.top_schedule .cont_titile span {
	/* -webkit-text-fill-color: #000 !important; */
}
.top_contents .inner {
	width: 100%;
	background-color: rgba(255, 255, 255, 0.9);
	outline: solid 2px rgba(255, 255, 255, 0.9);
	outline-offset: 2px;
	box-sizing: border-box;
	color: #000;
	padding: 2rem 1rem;
}
.top_menu ul li a p,
.contents_header p,
.cont_titile span {
	background-image: linear-gradient(135deg, #999, #fff, #aaa);
	background-image: repeating-linear-gradient(0deg, #757575 0%, #b7b7b7 45%, #fff 70%, #b7b7b7 85%, #757575 90%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.top_schedule.schedule .cont_titile span {
	-webkit-text-fill-color: #3b0f73;
}
.top_topics .sh {
	background: #000 !important;
	color: #fff;
}
.top_schedule .cont_titile {
	color: #000;
}
.therapist-box .profile-icon li,
.therapist-single .profile-icon li {
	background: #3b0f73;
	color: #fff;
}
.btn01 {
	border: 2px solid #3b0f73;
	outline: 3px solid #fff;
	outline-offset: 0px;
	border-radius: 0;
	width: 100%;
	display: flex;
	justify-content: center;
	background: #fff;
	margin-top: 3rem;
}
.btn01 a {
	color: #3b0f73;
	border-radius: 0;
	background: none;
}
.no-schedule {
	font-size: 1rem;
	padding: 1rem 0 2rem;
	font-weight: bold;
	line-height: 1.2;
}
.top_blog .btn01 {
	width: 95%;
	margin: 0 auto;
}
.nav_follow {
	background: rgba(0, 0, 0, 0.8);
	border-bottom: 2px solid;
	border-bottom: none;
	border-image: linear-gradient(34deg, #9e8139 -27%, #f9f1b5 50%, #9e8139 120%);
	border-image-slice: 1;
	background: linear-gradient(
		180deg,
		rgba(0, 0, 0, 0.95) 0%,
		rgba(0, 0, 0, 0.9) 35%,
		rgba(0, 0, 0, 0.52) 69%,
		rgba(0, 0, 0, 0) 100%
	);
	height: 7rem;
	box-sizing: border-box;
}
.toggle {
	top: 18px;
}
.toggle span {
	border-image: linear-gradient(135deg, #999, #fff, #aaa);

	border-image-slice: 1;
	border-bottom: 2px solid #fff;
}
.toggle span:nth-child(1) {
	top: 6px;
	width: 36px;
}

.toggle span:nth-child(2) {
	top: 14px;
	width: 24px;
}

.toggle span:nth-child(3) {
	top: 22px;
	width: 12px;
}
.toggle.active span:nth-child(1) {
}
.toggle.active span:nth-child(2) {
	width: 36px;
	right: 2px;
}
.toggle.active span:nth-child(3) {
	display: none;
}
.therapist-box {
	background: #fff;
	color: #000;
	border: 4px solid;
	border-image: linear-gradient(135deg, #999, #fff, #aaa);
	border-image-slice: 1;
}

.therapist-box .cast_data h3 a {
	color: #000;
}
.therapist-box .cast_data {
	color: #000;
	padding: 0 0.5rem 0;
}
.catch-copy {
	position: absolute;
	top: 15%;
	left: 19%;
	z-index: 2;
	background: rgba(0, 0, 0, 0.5);
	outline: solid 2px rgba(0, 0, 0, 0.5);
	outline-offset: 2px;
	box-sizing: border-box;
	padding: 3rem 1.5rem 2rem 1rem;
	line-height: 1.25;
}
.vertical {
	writing-mode: vertical-rl;
	font-size: 2rem;
}
#text > p:not(.visible) {
	visibility: hidden;
}
.small {
	font-size: 1.5rem;
	font-weight: bold;
	padding-bottom: 1px;
	padding-right: 1px;
}
.nav_follow .logo img {
	width: 100%;
	padding-top: 0.75rem;
	/* filter: drop-shadow(1px 1px 2px #fff); */
}
@media screen and (max-width: 640px) {
	.vertical {
		font-size: 6vw;
		letter-spacing: 1px;
	}
	.small {
		font-size: 1rem;
		font-weight: bolder;
	}
	.mainvisual {
		padding: 6rem 0 10.5rem;
	}
	.mv-info {
		bottom: 8rem;
	}
	.catch-copy {
		top: 9%;
		right: 2%;
		left: unset;
		width: 24%;
	}
	.mainvisual .mainlogo {
		width: 100%;
	}
	.mainvisual .mainlogo img {
		width: 75%;
		margin-right: 23%;
	}
	.nav_follow .logo {
		width: 28%;
	}
}

.character {
	/* アニメーション開始前のスタイルを指定 */
	position: relative;
	top: 10px;
	opacity: 0;
	/* アニメーション設定 */
	--property: top, opacity; /* アニメーションに使用するプロパティ */
	--duration: 300ms; /* 一字あたりの表示に掛ける時間 */
	--delay: -200ms; /* 前の一字のアニメーション終了からの遅延時間 */
	transition-propaty: var(--property);
	transition-timing-function: steps(20, end);
	transition-duration: var(--duration);
	transition-delay: calc((var(--duration) + var(--delay)) * var(--index, 0) + var(--delay));
}

.visible .character {
	/* アニメーション終了時のスタイルを指定 */
	top: 0;
	opacity: 1;
	/* 処理軽減 */
	will-change: var(--property);
}
.foot_navi li a span,
.mainvisual .global-nav a span {
	background-image: repeating-linear-gradient(0deg, #757575 0%, #b7b7b7 45%, #fff 70%, #b7b7b7 85%, #757575 90%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
@media screen and (min-width: 640px) {
	.mv-info {
		bottom: 14rem;
		background: none;
	}
	.mainvisual .mainlogo {
		width: 42%;
		top: -4rem;
		left: 10%;
	}
	.nav_follow .logo img {
		width: 100%;
		padding-top: 0.5rem;
	}
}
section {
	padding-left: 1rem !important;
	padding-right: 1rem !important;
	box-sizing: border-box;
}
.top_information {
	padding: 2rem 2rem 1rem !important;
}
.mainvisual .global-nav {
	z-index: 10;
}
.mainvisual {
	width: 100%;
	box-sizing: border-box;
}
main::before {
	/* background: #000; */
	/* background: #000654; */
}

.mainvisual .global-nav {
	background: #050507;
	border-bottom: 3px solid;
	border-image: linear-gradient(135deg, #999, #fff, #aaa);
	border-image-slice: 1;
}
.mainvisual .global-nav .global-nav_list a,
.mainvisual .global-nav a span {
	background-image: repeating-linear-gradient(0deg, #757575 0%, #b7b7b7 45%, #fff 70%, #b7b7b7 85%, #757575 90%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.schedule .calendar {
	width: 100%;
	max-width: 1100px;
	margin: 0 auto;
}
.schedule .calendar ul {
	display: grid;
	grid-gap: 6px 0;
	grid-template-columns: repeat(auto-fit, 13%);
	justify-content: space-around;
	padding: 0 2%;
}
.schedule .calendar ul li {
	width: unset;
}
.calendar ul a {
	font-size: 0.75rem;
	padding: 2px 0;
}
.calendar ul a span {
	display: unset !important;
	font-size: 0.6rem !important;
	margin-left: 1px;
}
@media screen and (min-width: 640px) {
	.schedule .calendar ul {
		grid-gap: 0.75rem !important;
		justify-content: space-between;
	}
}
.top-ran {
	padding: 0 1rem;
}
.ranking-title {
	text-align: center;
	font-size: 1.25rem;
	font-weight: 600;
	padding-top: 2rem;
}
.ranking .cont_titile {
	padding-bottom: 0.5rem;
}
.ranking-block {
	width: 100%;
	max-width: 1500px;
	margin: 0 auto;
}
.mainvisual::before {
	content: '';
	display: block;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.2) 60%, rgba(0, 0, 0, 0.15) 100%);
	background-size: 100%;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
