@charset "UTF-8";

/***   btn   ***/
.kasteras_contents .btn {
	--color: #421500;
	--bg-color:  #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: auto;
	margin-right: auto;
	background: var(--bg-color);
	border: 0.28rem solid transparent;
	border-radius: 1rem;
	color: var(--color);
	font-size: 1.8rem;
	font-weight: 700;
	cursor: pointer;
	transition: 0.36s;
}
.kasteras_contents .btn:hover,.btn:hover a {
	text-decoration: none;
	color: inherit;
}
.kasteras_contents .btn.btn_reverse_color:hover{
	background: var(--color);
	color: var(--bg-color);
	border: 0.22rem solid var(--bg-color);
	opacity: 1;
}

@media screen and (min-width: 768px) {
	.kasteras_contents .btn {
		height: 70px;
		width: 180px;
	}
}
@media screen and (max-width: 768px) {
	.kasteras_contents .btn {
		height: 5.4rem;
		width: 13rem;
	}
}

.kasteras_contents .btn2 {
	position: relative;
	display: flex;
	align-items: center;
	/*justify-content: center;*/
	margin: 1.6rem auto 0.4rem;
	padding: 0 2.4rem 0 1.6rem;
	/*width: 24rem;*/
	width: 100%;
	height: 5rem;
	background: #FFE4A0;
	color: var(--color-brown);
	border: 0.28rem solid var(--color-brown);
	border-radius: 0.2rem;
	font-size: 1.8rem;
	transition: 0s;
}

.kasteras_contents .btn2::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 1.6rem;
	transform: translateY(-50%);
	width: 1.8rem;
	height: 1.5rem;
	background: url(/brand/kasteras/assets/img/download/ic_dl.png) no-repeat 0 0;
	background-size: 100% auto;
}

@media screen and (max-width: 768px) {
	.kasteras_contents .btn2  {
		width: 100%;
		height: 4rem;
		font-size: 1.2rem;
		margin-top: .8rem;
		padding: 0 1.6rem 0 .8rem;
	}

	.kasteras_contents .btn2::after {
		right: .8rem;
		width: 1.2rem;
		height: 1rem;
	}
}



/***   スクロールバー   ***/
::-webkit-scrollbar {
	width: 1rem;
	height: 1rem;
}
::-webkit-scrollbar-track {
	background-color: var(--color-ivory);
	margin: 0;
}
::-webkit-scrollbar-thumb {
	background-color: var(--color-brown);
}


/***********************
   parts
***********************/
/***   slick slider   ***/
.slick-slider .slick-arrow {
	--width: 80px;
	--center-size: 711.9px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	font-size: 0;
	width: var(--width);
	height: calc(var(--width) * (70/80));
	background-image: url(/brand/kasteras/assets/img/deco/slider_arrow_left.svg);
	background-repeat: no-repeat;
	background-size: contain;
	z-index: 100;
	transition: 0.5s ease-in-out;
}
.slick-slider .slick-arrow.slick-prev {
	right: calc(50% + var(--center-size) /2);
	background-image: url(/brand/kasteras/assets/img/deco/slider_arrow_left.svg);
}
.slick-slider .slick-arrow.slick-next {
	left: calc(50% + var(--center-size) /2);
	transform: translateY(-50%) rotate(180deg);
}


@media screen and (max-width: 768px){
	.slick-slider .slick-arrow {
		--width: 4rem;
	}
}


/* ------------------------------
	kasteras_loading
------------------------------ */
.kasteras_loading {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-ivory);
	z-index: 9998;
	-webkit-animation: fade_out_loading 0.44s linear 1.4s forwards;
	        animation: fade_out_loading 0.44s linear 1.4s forwards;
	pointer-events: none;
}


.kasteras_loading__inner {
	max-width: 350px;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	margin-top: -2.2rem;
}

.kasteras_loading__inner .loading_progress {
	position: relative;
	width: 86%;
	height: 41px;
	padding: 2px;
	margin: 20px auto;
	border: 3px solid var(--color-brown);
	border-radius: 1000px;
}
.kasteras_loading__inner .loading_progress .progress_bar {
	width: 0%;
	height: 100%;
	background: var(--color-brown);
	border-radius: 1000px;
	-webkit-animation: anime_progress_bar 1.4s linear -0.2s forwards;
	        animation: anime_progress_bar 1.4s linear -0.2s forwards;
}
.kasteras_loading__inner .loading_text {
	line-height: 1;
	text-align: center;
}

@-webkit-keyframes fade_out_loading {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
		pointer-events: none;
		z-index: -100;
	}
}

@keyframes fade_out_loading {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
		pointer-events: none;
		z-index: -100;
	}
}
@-webkit-keyframes anime_progress_bar {
	0% {
		width: 0%;
	}
	100% {
		width: 100%;
	}
}
@keyframes anime_progress_bar {
	0% {
		width: 0%;
	}
	100% {
		width: 100%;
	}
}


@media screen and (max-width: 768px){
	.kasteras_loading__inner  .loading_illust {
		width: 86%;
		margin-left: auto;
		margin-right: auto;
	}
	.kasteras_loading__inner .loading_progress {
		height: 3.5rem;
		max-height: 40px;
	}
	.kasteras_loading__inner .loading_text img {
		width: 10rem;
	}
}

/* ------------------------------
	kasteras_nav
------------------------------ */
.kasteras_nav {
	display: flex;
	position: absolute;
	top: 40px;
	right: 20px;
	flex-direction: column;
	font-family: var(--font-skia);
	font-weight: 700;
	z-index: 9990;
}
.kasteras_nav p,.kasteras_nav a {
	font-family: var(--font-skia);
	font-weight: 700;
}

.kasteras_nav .link_menu {
	display: flex;
}


@media screen and (min-width: 768px){
	.kasteras_nav{
		position: fixed;
	}
	.kasteras_nav .link_menu {
		flex-direction: column;
	}

	.kasteras_nav .link_menu__item a {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		flex-direction: row-reverse;
		margin-bottom: 20px;
	}
	.kasteras_nav .link_menu__item a .link_text {
		position: absolute;
		color: var(--color-brown);
		top: 50%;
		right: calc(100%);
		transform: translateY(-50%);
		display: flex;
		height: 100%;
		opacity: 0;
		pointer-events: none;
	}
	.kasteras_nav .link_menu__item a .link_text img {
		max-width: 9999px;
		padding:0 12px;
		box-sizing: content-box;
		transform: scale(1.1);
		transform-origin: center right;
	}
	.kasteras_nav .link_menu__item a:hover {
		opacity: 0.9;
	}
	.kasteras_nav .link_menu__item a:hover .link_text {
		opacity: 1;
		pointer-events: all;
	}
}

@media screen and (max-width: 768px){
	/*****   hamburger   *****/
	.sp_menu_btn {
		position: fixed;
		top: 1.5rem;
		right: 1.5rem;
		cursor: pointer;
		z-index: 9994;
	}
	.hamburger_btn {
		position: relative;
		width: 4rem;
		height: 4rem;
		border: 0.3rem solid var(--color-brown);
		border-radius: 0.66rem;
		background: #FFE4A0;
		margin-bottom: 0.28rem;
	}
	.hamburger_btn span,
	.hamburger_btn::before,
	.hamburger_btn::after {
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translateX(-50%) translateY(-50%);
		width: 2rem;
		height: 0.3rem;
		background: var(--color-brown);
		border-radius: 0.08rem;
		pointer-events: none;
		transition: top 0.28s 0.28s, transform 0.28s, opacity 0.1s 0.1s;
	}
	.hamburger_btn::before {
		top: calc(50% + 0.66rem);
	}
	.hamburger_btn::after {
		top: calc(50% - 0.66rem);
	}

	.sp_menu_active .hamburger_btn span {
		opacity: 0;
	}
	.sp_menu_active .hamburger_btn::before,
	.sp_menu_active .hamburger_btn::after {
		top: 50%;
		transition: top 0.28s, transform 0.28s 0.28s;
	}
	.sp_menu_active .hamburger_btn::before {
		transform: translateX(-50%) translateY(-50%) rotate(45deg);
	}
	.sp_menu_active .hamburger_btn::after {
		transform: translateX(-50%) translateY(-50%) rotate(-45deg);
	}

	.kasteras_nav {
		position: fixed;
		top: 0;
		right: 0;
		width: 100%;
		height: 100%;
		padding: 8rem 0 7rem 0.4rem;
		overflow: auto;
		background: repeating-linear-gradient(
			90deg,
			#DCAF6B,
			#DCAF6B 7.8%,
			#E6C484 7.8%,
			#E6C484 13.26%
		);
		text-align: center;
		-ms-overflow-style: none;
		opacity: 0;
		pointer-events: none;
		transform: translateY(-100%);
		transition:opacity 0.7s ,transform 0.86s ease-in-out;
	}
	.sp_menu_active .kasteras_nav {
		opacity: 1;
		pointer-events: all;
		transform: translateY(0);
	}
	.kasteras_nav::-webkit-scrollbar {
		display: none;
	}
	.kasteras_nav__tit {
		margin: 0 auto 5rem;
		width: 21rem;
	}

	.kasteras_nav .anker_menu__item {
		margin-bottom: 4.1rem;
	}
	.kasteras_nav .anker_menu__item a img {
		height: 1.62rem;
		width: auto;
	}

	.kasteras_nav .link_menu {
		width: 18rem;
		margin: 1.9rem auto 0.2rem;
		align-items: center;
		justify-content: space-between;
	}
	.kasteras_nav .link_icon img {
		width: 4rem;
	}
}

/* ------------------------------
	.sns_link.sp_onliy
------------------------------ */
@media screen and (max-width: 768px) {
	.kasteras_contents .sns_link {
		display: block;
		margin: -8rem 0 4rem 2.8rem;
	}
	.kasteras_contents .sns_link ul {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 15rem;
	}
	.kasteras_contents .sns_link img {
		width: 4rem;
	}
}

/* ------------------------------
	.mv
------------------------------ */
.kasteras_contents .mv {
	text-align: center;
	min-height: 100vh;
}
.kasteras_contents .mv_wrapper {
	position: relative;
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin-right: auto;
	margin-left: auto;
}

.kasteras_contents .mv .nighttime_illust,
.kasteras_contents .mv.nighttime .daytime_illust {
	display: none;
}
.kasteras_contents .mv.nighttime .nighttime_illust {
	display: inline;
}

.kasteras_contents .mv .anime_illust {
	margin-bottom: 3.2rem;
}
.kasteras_contents .mv .anime_illust img{
	max-width: 450px;
}



/*   clock   */
.kasteras_contents .mv_clock {
	position: relative;
	z-index: 100;
	width: 96px;
}
.kasteras_contents .clock_hand_base {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 0;
	height: 0;
	opacity: 0;
}
.kasteras_contents .clock_hand_base .clock_hand {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%) rotate(0deg);
	transform-origin: center bottom;
	z-index: 1000;
	background: var(--color-brown);

}
.kasteras_contents .clock_hand_base.clock_hour_hand {
	transform: rotate(150deg);
}
.kasteras_contents .clock_hand_base.clock_hour_hand .clock_hand {
	--width: 4.6px;
	width: var(--width);
	height: calc(var(--width) * (22/4.6));
}
.kasteras_contents .clock_hand_base.clock_hour_hand.real_time .clock_hand {
	-webkit-animation: rotate_clock_hand 43200s linear 0s infinite;
	        animation: rotate_clock_hand 43200s linear 0s infinite;
}
.kasteras_contents .clock_hand_base.clock_minute_hand .clock_hand {
	--width: 2.7px;
	width: var(--width);
	height: calc(var(--width) * (23.2/2.2));
}
.kasteras_contents .clock_hand_base.clock_minute_hand.real_time .clock_hand {
	-webkit-animation: rotate_clock_hand 3600s linear 0s infinite;
	        animation: rotate_clock_hand 3600s linear 0s infinite;
}

@-webkit-keyframes rotate_clock_hand {
	0% {
		transform: translateX(-50%) rotate(0deg);
	}

	50% {
		transform: translateX(-50%) rotate(180deg);
	}

	100% {
		transform: translateX(-50%) rotate(360deg);
	}
}

@keyframes rotate_clock_hand {
	0% {
		transform: translateX(-50%) rotate(0deg);
	}

	50% {
		transform: translateX(-50%) rotate(180deg);
	}

	100% {
		transform: translateX(-50%) rotate(360deg);
	}
}


.kasteras_contents .mv_illust_post {
	position: relative;
	cursor: pointer;
}

.kasteras_contents .mv_illust_post .huki {
	--width: 7rem;
	position: absolute;
	font-size: var(--width);
	top: 4.46rem;
	left: 1.56rem;
	transform: translateX(100%) translateY(-100%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--width);
	height: var(--width);
}
.kasteras_contents .mv_illust_post .huki::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(/brand/kasteras/assets/img/illust_post_huki.png);
	background-repeat: no-repeat;
	background-size: cover;
	z-index: -1;
}
.kasteras_contents .mv_illust_post:hover .huki {
	opacity: 0.8;
}


.kasteras_contents .anime-rotate_huki::before {
	--scale: 1.1;
	-webkit-animation: rotate_huki 6s ease 0s infinite alternate;
	        animation: rotate_huki 6s ease 0s infinite alternate;
}


.kasteras_contents .mv .show_scroll {
	text-align: center;
	margin-top: 9rem;
}
.kasteras_contents .mv .show_scroll .show_scroll_text {
	display: block;
	margin-bottom: 0.44rem;
	font-size: 1.8rem;
	line-height: 1;
	white-space: nowrap;
}
.kasteras_contents .mv .show_scroll .show_scroll_img {
	display: block;
	-webkit-animation: show_scroll_arrow_anime 1.6s ease-out 1s infinite;
	        animation: show_scroll_arrow_anime 1.6s ease-out 1s infinite;
}

@-webkit-keyframes show_scroll_arrow_anime {
	0% {
		transform: translateY(0);
		opacity: 1;
	}
	14% {
		opacity: 1;
	}

	90% {
		transform: translateY(38px);
		opacity: 0;
	}
	100% {
		transform: translateY(38px);
		opacity: 0;
	}
}

@keyframes show_scroll_arrow_anime {
	0% {
		transform: translateY(0);
		opacity: 1;
	}
	14% {
		opacity: 1;
	}

	90% {
		transform: translateY(38px);
		opacity: 0;
	}
	100% {
		transform: translateY(38px);
		opacity: 0;
	}
}




@media screen and (min-width: 768px){
	.kasteras_contents .mv {
		position: relative;
		padding: 34.3vh 0 8.6vh;
		margin-bottom: 2rem;
	}

	.kasteras_contents .mv .mv_content {
		margin-bottom: 76px;
	}

	.kasteras_contents .mv_illust1 img {
		position: absolute;
		top: -4rem;
		right: 104%;
		z-index: 100;
	}

	.kasteras_contents .mv_clock {
		position: absolute;
		bottom: calc(100% + 8.2rem);
		left: 0;
		z-index: 100;
	}

	.kasteras_contents .mv_illust_post {
		position: absolute;
		bottom: 0;
		left: calc(100% + 120px);
		width: 92px;
	}
	.kasteras_contents .mv_illust_post > img {
		width: 100%;
	}

	.kasteras_contents .mv .show_scroll {
		position: absolute;
		bottom: 0;
		left: 50%;
		transform: translateX(-50%);
	}
	.kasteras_contents .mv .show_scroll .show_scroll_img  {
		margin-bottom: 56px;
	}
}

@media screen and (max-width: 768px){
	.kasteras_contents .mv {
		padding: 9.6rem 0 5.6rem;
	}

	.kasteras_contents .mv .anime_illust {
		width: 26rem;
		margin-bottom: 4rem;
	}
	.kasteras_contents .mv .mv_tit {
		width: 30rem;
		margin-bottom: 4.4rem;
	}

	.kasteras_contents .mv_illust1 {
		width: 17rem;
		margin-bottom: 3.8rem;
		margin-left: -1.5rem;
	}

	.kasteras_contents .mv_clock {
		margin-left: auto;
		margin-right: 1.4rem;
		margin-bottom: -1rem;
		width: 6.6rem;
	}

	.kasteras_contents .clock_hand_base.clock_hour_hand .clock_hand {
		--width: 0.43rem;
		width: var(--width);
		height: calc(var(--width) * (15/4.17));
	}
	.kasteras_contents .clock_hand_base.clock_minute_hand .clock_hand {
		--width: 0.228rem;
		width: var(--width);
		height: calc(var(--width) * (17.4/2.17));
	}

	.kasteras_contents .mv_illust_post {
		position: relative;
		width: 6rem;
		margin-left: auto;
		margin-right: 1.1rem;
	}


	.kasteras_contents .mv_illust_post .huki {
		--width: 4.6rem;
		top: 2.6rem;
		left: 0.84rem;
	}

	.kasteras_contents .mv_illust_post .huki img {
		width: 2.8rem;
	}

	.kasteras_contents .mv .show_scroll {
		text-align: center;
		margin-top: 2rem;
		margin-bottom: 2.8rem;
	}
	.kasteras_contents .mv .show_scroll .show_scroll_text {
		font-size: 1.7rem;
	}
	.kasteras_contents .mv .show_scroll .show_scroll_img {
		width: 5.4rem;
		margin-right: auto;
		margin-left: auto;
	}

}


/* ------------------------------
	.introduction
------------------------------ */
.kasteras_contents .introduction {
	text-align: center;
	margin-bottom: 18rem;
}

.kasteras_contents .introduction .contents_wrapper {
	position: relative;
}

.kasteras_contents .introduction .anime_illust {
	margin: 6.6rem auto 1rem;
	max-width: 600px;
}


.kasteras_contents .introduction .img_wrapper img {
	position: absolute;
}


@media screen and (min-width: 768px){
	.kasteras_contents .introduction .img_wrapper {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 10;
	}

	.kasteras_contents .introduction .img_wrapper .img_box:nth-of-type(1) img {
		top: 52px;
		left: 145px;
	}
	.kasteras_contents .introduction .img_wrapper .img_box:nth-of-type(2) img {
		top: 325px;
		left: 24px;
	}
	.kasteras_contents .introduction .img_wrapper .img_box:nth-of-type(3) img {
		top: 550px;
		left: 156px;
	}
	.kasteras_contents .introduction .img_wrapper .img_box:nth-of-type(4) img {
		top: 178px;
		right: 90px;
	}
	.kasteras_contents .introduction .img_wrapper .img_box:nth-of-type(5) img {
		top: 468px;
		right: 134px;
	}
}

@media screen and (max-width: 768px){
	.kasteras_contents .introduction {
		margin-bottom: 11rem;
	}
	.kasteras_contents .introduction .contents_wrapper {
		padding: 0;
	}

	.kasteras_contents .introduction .text {
		white-space: nowrap;
		margin-bottom: 4.4rem;
	}

	.kasteras_contents .introduction .img_wrapper {
		position: relative;
		width: 100%;
		height: 41rem;
	}
	.kasteras_contents .introduction .img_wrapper img {
		width: 18rem;
	}
	.kasteras_contents .introduction .img_wrapper .img_box:nth-of-type(1) img {
		top: 0;
		left: 4.8rem;
	}
	.kasteras_contents .introduction .img_wrapper .img_box:nth-of-type(2) img {
		top: 14.4rem;
		left: -6rem;
	}
	.kasteras_contents .introduction .img_wrapper .img_box:nth-of-type(3) img {
		bottom: 0;
		left: 0.096rem;
	}
	.kasteras_contents .introduction .img_wrapper .img_box:nth-of-type(4) img {
		top: 8.2rem;
		right: -5.4rem;
	}
	.kasteras_contents .introduction .img_wrapper .img_box:nth-of-type(5) img {
		top: 22.8rem;
		right: -0.76rem;
	}

	.kasteras_contents .introduction .anime_illust {
		margin-top: 2.2rem;
	}
}


/* ------------------------------
	.character
------------------------------ */
.kasteras_contents .character {
	padding-bottom: 21rem;
}

.kasteras_contents .character .contents_wrapper {
	padding: 0 0.1rem;
}

.kasteras_contents .character .name {
	font-size: 3.2rem;
	margin-bottom: 2.7rem;
}


.kasteras_contents .character .manga_illust_block img:nth-of-type(n+2) {
	margin-top: 1rem;
}

.kasteras_contents .character .introduction_text {
	text-align: left;
	line-height: 1.8;
}

.kasteras_contents .character .slick-dots {
	position: absolute;
	width: 32rem;
	margin: 0 auto;
	bottom: -7.5rem;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}
.kasteras_contents .character .slick-dots li {
	margin: 0 1.5rem;
}
.kasteras_contents .character .slick-dots li:nth-of-type(n+5) {
	margin-top: 1.5rem;
}
/*.kasteras_contents .character .slick-dots li:nth-of-type(n+2) {
	margin-left: 3rem;
}
.kasteras_contents .character .slick-dots li:nth-of-type(n+2) {

}*/
.kasteras_contents .character .slick-dots button {
	position: relative;
	--width: 5rem;
	width: var(--width);
	height: calc(var(--width) * (1/1));
	font-size: 0;
	background: #fff;
	border-radius: 0.5rem;
	border: 0.34rem solid #FFF;
}
.kasteras_contents .character .slick-dots .slick-active button {
	border-color: #AE6731;
}
.kasteras_contents .character .slick-dots button::before {
	--size: 30px;
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	width: var(--size);
	height: var(--size);
	background-repeat: no-repeat;
	background-size: cover;
}
.kasteras_contents .character .slick-dots li:nth-of-type(1) button::before {
	background-image: url(/brand/kasteras/assets/img/character_Niichan_icon.svg);
}
.kasteras_contents .character .slick-dots li:nth-of-type(2) button::before {
	background-image: url(/brand/kasteras/assets/img/character_Otouto_icon.png);
}
.kasteras_contents .character .slick-dots li:nth-of-type(3) button::before {
	background-image: url(/brand/kasteras/assets/img/character_Meringue_icon.png);
}
.kasteras_contents .character .slick-dots li:nth-of-type(4) button::before {
	background-image: url(/brand/kasteras/assets/img/character_Madeleine_icon.svg);
}
.kasteras_contents .character .slick-dots li:nth-of-type(5) button::before {
	background-image: url(/brand/kasteras/assets/img/character_Madeleine_niisan_icon.png);
}
.kasteras_contents .character .slick-dots li:nth-of-type(6) button::before {
	background-image: url(/brand/kasteras/assets/img/character_Ginger_icon.png);
}
.kasteras_contents .character .slick-dots li:nth-of-type(7) button::before {
	background-image: url(/brand/kasteras/assets/img/character_Ryoshin_icon.png);
}
.kasteras_contents .character .slick-dots li:nth-of-type(8) button::before {
	background-image: url(/brand/kasteras/assets/img/character_Niichan_otouto_icon.png);
}
.kasteras_contents .character .slick-dots li:nth-of-type(9) button::before {
	background-image: url(/brand/kasteras/assets/img/character_Otouto_haha_icon.png);
}
.kasteras_contents .character .slick-dots li:nth-of-type(10) button::before {
	background-image: url(/brand/kasteras/assets/img/character_Otouto_kyodai_icon.png);
}
.kasteras_contents .character .slick-dots li:nth-of-type(11) button::before {
	background-image: url(/brand/kasteras/assets/img/character_Sakura_icon.png);
}
.kasteras_contents .character .slick-dots li:nth-of-type(12) button::before {
	background-image: url(/brand/kasteras/assets/img/character_Canele_couple_icon.svg);
}

.kasteras_contents .character .slick-slider .slick-arrow {
	--center-size: 480px;
	top: 22%;
}
.kasteras_contents .character .slick-prev.slick-arrow.slick-disabled,
.kasteras_contents .character .slick-next.slick-arrow.slick-disabled {
	display: none !important;
}

.kasteras_contents .character .character_block {
	position: relative;
}
.kasteras_contents .character .character_illust_block {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 620px;
}
.kasteras_contents .character .character_illust_block .character_illust {
	padding-top: 7.6rem;
}
.kasteras_contents .character .character_illust_block .character_illust img {
	margin: auto;
	transform-origin: center bottom;
}

.kasteras_contents .character .character_illust.change_illust {
	position: relative;
	cursor: pointer;
}

.kasteras_contents .character .character_illust.change_illust::before {
	content: "";
	position: absolute;
	top: 0;
	left: calc(50% + 9.5px);
	transform: translateX(-50%);
	width: 164px;
	height: 80px;
	background: url(/brand/kasteras/assets/img/character_click_icon.gif) no-repeat center center;
	background-size: 100% auto;
}

.kasteras_contents .character .character_illust.change_illust.change::before {
	background: url(/brand/kasteras/assets/img/character_click_icon_off.gif) no-repeat center center;
	background-size: 100% auto;
}

.kasteras_contents .character .character_illust.change_illust img.sub-img {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}

.kasteras_contents .character .character_illust.change_illust img.off {
	opacity: 0;
}

.kasteras_contents .character .character_illust_block .character_illust[data-character="Niichan"] img {
	transform: translateY(0.56rem);
}
.kasteras_contents .character .character_illust_block .character_illust[data-character="Niichan"] img.sub-img {
	transform: translateY(-1.44rem);
}
.kasteras_contents .character .character_illust_block .character_illust[data-character="Otouto"] img {
	transform: translateY(3.5rem);
}
.kasteras_contents .character .character_illust_block .character_illust[data-character="Otouto"] img.sub-img {
	transform: translateY(-1.5rem);
}
.kasteras_contents .character .character_illust_block .character_illust[data-character="Madeleine"] img {
	transform: translateY(-1.18rem);
}
.kasteras_contents .character .character_illust_block .character_illust[data-character="Madeleine"] img.sub-img {
	transform: translateY(-2.18rem);
}
.kasteras_contents .character .character_illust_block .character_illust[data-character="Madeleine_niisan"] img {
	transform: translateY(-1.18rem);
}
.kasteras_contents .character .character_illust_block .character_illust[data-character="Ryoshin"] img {
	transform: translateY(-1.18rem);
}
.kasteras_contents .character .character_illust_block .character_illust[data-character="Canele_couple"] img {
	transform: translateY(-0.66rem);
}

.kasteras_contents .character .character_illust_block .slick-slide {
	opacity: 0;
	transition: 0.6s;
}
.kasteras_contents .character .character_illust_block .slick-slide.slick-active,
.kasteras_contents .character .character_illust_block .slick-slide.slick-clone-center {
	opacity: 1;
}
.kasteras_contents .character .character_illust_block .plate_illust {
	position: absolute;
	bottom: 3.7rem;
	left: 50%;
	transform: translateX(-50%) translateY(50%);
	width: 420px;
	z-index: -1;
}

.kasteras_contents .character .character_detail .detail_change {
	position: relative;
}

.kasteras_contents .character .character_detail .detail_change .detail_a {
	transition: 0.5s all;
}

.kasteras_contents .character .character_detail .detail_change .detail_a.off {
	opacity: 0;
}

.kasteras_contents .character .character_detail .detail_change .detail_b {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: 0.5s all;
}

.kasteras_contents .character .character_detail .detail_change .detail_b.off {
	opacity: 0;
}

@media screen and (min-width: 768px){
	.kasteras_contents .character .character_slider__inner {
		width: 1340px!important;
		margin: auto;
	}
	.kasteras_contents .character .manga_illust_block {
		width: 360px;
	}
	.kasteras_contents .character .character_detail {
		width: 460px;
		margin-top: 44rem;
	}

	.kasteras_contents .character .slick-slider .slick-arrow {
		--center-size: 410px;
		top: 21.2%;
	}

	.character_illust_block {

	}
}

@media screen and (max-width: 768px){
	.kasteras_contents .character {
			padding-bottom: 18.5rem;
	}

	.kasteras_contents .character .character_slider__inner {
		position: relative;
		width: 100%;
		display: grid;
		grid-template-columns: 12rem 1fr 12rem;
		grid-template-areas:
        " left ...... right "
        " bottom bottom bottom";
	}
	.kasteras_contents .character .manga_illust_block.left {
		grid-area: left;
	}
	.kasteras_contents .character .manga_illust_block.right {
		grid-area: right;
	}
	.kasteras_contents .character .character_detail {
		grid-area: bottom;
		margin-top: 3rem;
	}

	.kasteras_contents .character .name {
		font-size: 2.6rem;
		margin-bottom: 1.8rem;
	}
	.kasteras_contents .character .introduction_text {
		line-height: 1.76;
		margin-bottom: 6.6rem;
	}

	.kasteras_contents .character .manga_illust_block {
		width: 12rem;
	}
	.kasteras_contents .character .character_detail {
		width: 90%;
		margin-right: auto;
		margin-left: auto;
	}

	.kasteras_contents .character .slick-dots {
		bottom: -10rem;
	}
	.kasteras_contents .character .slick-dots button {
		--width: 4rem;
	}
	.kasteras_contents .character .slick-dots button::before {
		--size: 2.4rem;
	}
	/*.kasteras_contents .character .slick-dots li:nth-of-type(n+2) {
		margin-left: 2rem;
	}*/

	.kasteras_contents .character .slick-slider .slick-arrow {
		--center-size: 4.28rem;
		top: 41.7%;
	}

	/*.kasteras_contents .character .character_illust_block {
		top: 6.6rem;
	}*/

	.kasteras_contents .character .character_illust_block .character_illust {
		padding-top: 8.6rem;
	}

	.kasteras_contents .character .character_illust.change_illust::before {
		content: "";
		left: calc(50% + 5px);
		width: 12.3rem;
		height: 6rem;
	}

	.kasteras_contents .character .character_illust img {
		width: 13rem;
	}
	.kasteras_contents .character .character_illust_block .character_illust[data-character="Niichan"] img {
		transform: translateY(0.25rem);
	}
	.kasteras_contents .character .character_illust_block .character_illust[data-character="Niichan"] img.sub-img {
		transform: translateY(-0.44rem);
	}
	.kasteras_contents .character .character_illust_block .character_illust[data-character="Otouto"] img {
		transform: translateY(1.5rem);
	}
	.kasteras_contents .character .character_illust_block .character_illust[data-character="Otouto"] img.sub-img {
		transform: translateY(-0.5rem);
	}
	.kasteras_contents .character .character_illust_block .character_illust[data-character="Madeleine"] img {
		transform: scale(1.06) translateY(-0.26rem);
	}
	.kasteras_contents .character .character_illust_block .character_illust[data-character="Madeleine"] img.sub-img {
		transform: scale(1.06) translateY(-0.58rem);
	}
	.kasteras_contents .character .character_illust_block .character_illust[data-character="Ryoshin"] img {
		transform: translateY(-0.5rem);
	}
	.kasteras_contents .character .character_illust_block .character_illust[data-character="Canele_couple"] img {
		transform: translateY(-0.26rem);
	}

	.kasteras_contents .character .character_illust_block .plate_illust {
		bottom: 1.6rem;
	}
	.kasteras_contents .character .character_illust_block .plate_illust img {
		width: 17rem;
	}
}


/* ------------------------------
	.story
------------------------------ */
.kasteras_contents .story {
	position: relative;
}

.kasteras_contents .story .story_list {
	position: relative;
	z-index: 10;
	height: 198px;
}

.kasteras_contents .story .slick-track {
	--slider-adjust: 64px;
	will-change: left;
	transition: 0.16s linear;
}
.kasteras_contents .story .story_list .slick-list {
	overflow: inherit;
}

.kasteras_contents .story .story_list__item .story_number img {
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0.44rem;
	height: 26px;
}

.kasteras_contents .story .slick-slide,
.kasteras_contents .story .slick-cloned,
.kasteras_contents .story .going-to-clone .slick-slide.slick-center {
	width: 292px;
	transform: translateY(5.6rem);
	margin: 0 0.56rem;
	will-change: width, transform;
	transition:width 0.5s ease-in-out,transform 0.5s ease-in-out;
}
.kasteras_contents .story .slick-slide.slick-center,
.kasteras_contents .story .slick-cloned.slick-clone-center {
	width: 420px;
	transform: translateY(0);
}
.kasteras_contents .story .slick-cloned.slick-center {
	width: 292px!important;
	transform: translateY(5.6rem)!important;
}
.kasteras_contents .story .slick-cloned.slick-clone-center {
	width: 420px!important;
	transform: translateY(0)!important;
}
.kasteras_contents .story .story_list__item .story_thumb {
	cursor: pointer;
}
.kasteras_contents .story .slick-slide .story_thumb img {
	width: 100%;
	will-change: width;
}



.kasteras_contents .story .slick-slider .slick-arrow {
	--center-size: 418px;
	transform: translateY(60%);
}
.kasteras_contents .story .slick-slider .slick-arrow.slick-next {
	transform: translateY(60%) rotate(180deg);
}


.kasteras_contents .story .story_block {
	position: relative;
	background: #FFEBBE;
	padding-top: 5rem;
	padding-bottom: 7rem;
	margin-top: 6.6rem;
}
.kasteras_contents .story .story_block .illust {
	margin-bottom: 3.8rem;
}

.kasteras_contents .story .signboard_block {
	margin-left: auto;
	margin-right: auto;
}
.kasteras_contents .signboard_wrapper {
	position: relative;
}
.kasteras_contents .signboard {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: url(/brand/kasteras/assets/img/deco/deco_story_signboard_left.svg);
	background-repeat: no-repeat;
	background-size: contain;
	color:#fff;
	font-size: 1.8rem;
	font-weight: 700;
	width: 100%;
	height: 100%;
	z-index: 100;
	cursor: pointer;
	transform-origin: top center;
	transition: 0.06s ;
}
.kasteras_contents  .signboard_wrapper:hover .signboard {
	opacity: 0.76;
}

.kasteras_contents .signboard_wrapper::before {
	--size: 22px;
	content: "";
	position: absolute;
	top: calc(100% - 2px);
	left: 50%;
	transform: translateX(-50%);
	width: var(--size);
	height: calc(var(--size) * (48/22));
	background: #AE6731;
	pointer-events: none;
	transition: 0.06s;
}
.kasteras_contents .signboard_wrapper:hover::before {
	opacity: 0.8;
}

.kasteras_contents .story_block .signboard_right .signboard {
	background-image: url(/brand/kasteras/assets/img/deco/deco_story_signboard_right.svg);
}

.kasteras_contents .signboard a {
	color: #fff;
	text-decoration: none;
}
.kasteras_contents .signboard_wrapper a:hover {
	text-decoration: none;
}

.kasteras_contents .story_block .signboard_wrapper:hover .signboard {
	transform: rotateY(180deg);
	opacity: 0.92;
}
.kasteras_contents .story_block .signboard_wrapper .signboard,
.kasteras_contents .story_block .signboard_wrapper .signboard span {
	transition: 0.32s ease-in-out;
}
.kasteras_contents .story_block .signboard_wrapper:hover .signboard span {
	transform: rotateY(180deg);
}

@media screen and (min-width: 768px){

	.kasteras_contents .story .slick-slide,
	.kasteras_contents .story .slick-cloned,
	.kasteras_contents .story .going-to-clone .slick-slide.slick-center {
		margin: 0 clamp(0.56rem, 0.44vw , 1.4rem);
	}

	.kasteras_contents .signboard_block {
		width: 540px;
		height: 70px;
	}

	.kasteras_contents .signboard_wrapper {
		width: 230px;
		height: 70px;
	}

	.kasteras_contents .story_block .signboard_right.signboard_wrapper {
		width: 256px;
	}

}

@media screen and (max-width: 768px){

	.kasteras_contents .story .slick-track {
		--slider-adjust: 2rem;
	}

	.kasteras_contents .story .slick-slider .slick-arrow {
		--center-size: 23.8rem;
		transform: translateY(18%);
	}
	.kasteras_contents .story .slick-slider .slick-arrow.slick-next {
		transform: translateY(18%) rotate(180deg);
	}
	.kasteras_contents .story .story_list__item .story_number img {
		height: 1.8rem;
		width: auto;
	}

	.kasteras_contents .story .story_list {
		height: 14.24rem;
	}

	.kasteras_contents .story .slick-slide {
		transform: translateY(1.4rem);
		width: 20rem;
	}
	.kasteras_contents .story .slick-cloned.slick-center {
		width: 20rem!important;
		transform: translateY(1.4rem)!important;
	}
	.kasteras_contents .story .slick-cloned.slick-clone-center {
		width: 24rem!important;
		transform: translateY(0)!important;
	}
	.kasteras_contents .story .slick-slide.slick-center,
	.kasteras_contents .story .slick-slide.slick-clone-center {
		transform: translateY(0rem);
		width: 24rem;
	}


	.kasteras_contents .story .story_block {
		margin-top: 1.44rem;
	}

	.kasteras_contents .signboard_block {
		width: 90%;
	}

	.kasteras_contents .story .story_block .illust {
		width: 28rem;
	}

	.kasteras_contents .signboard {
		font-size: 1.38rem;
	}
	.kasteras_contents .signboard_wrapper {
		width: 15rem;
		height: 4.62rem;
	}
	.kasteras_contents .story_block .signboard_right.signboard_wrapper {
		width: 16.6rem;
		height: 4.62rem;
	}
	.kasteras_contents .story_block .signboard_right .signboard {
		font-size: 1.18rem;
	}
	.kasteras_contents .signboard_wrapper::before {
		--size: 1.8rem;
	}
}



/* ------------------------------
	.gallery
------------------------------ */
.kasteras_contents .gallery {
	position: relative;
	padding: 20rem 0 18rem;
	background: #D7EEF1;
}
.kasteras_contents .gallery .contents_wrapper {
	position: relative;
}
.kasteras_contents .gallery .contents_wrapper .illust {
	position: absolute;
	top: -14.4rem;
	left: 12rem;
}
.kasteras_contents .gallery .contents_wrapper::before,
.kasteras_contents .gallery .contents_wrapper::after {
	content: "";
	position: absolute;
	background-repeat: no-repeat;
	background-size: contain;
}
.kasteras_contents .gallery .contents_wrapper::before {
	--width: 486px;
	width: var(--width);
	height: calc(var(--width) * (173/486));
	top: -14rem;
	right: 5.6rem;
	background-image: url(/brand/kasteras/assets/img/deco/deco_gallery_cloud1.svg);
}
.kasteras_contents .gallery .contents_wrapper::after {
	--width: 458px;
	width: var(--width);
	height: calc(var(--width) * (177/458));
	top: 47rem;
	left: 6rem;
	background-image: url(kasteras/assets/img/deco/deco_gallery_cloud2.svg);
}



@media screen and (min-width: 768px){
	.kasteras_contents .gallery .gallery_liet__item .img_box {
		margin: 0 20px;
	}
}

@media screen and (max-width: 768px){
	.kasteras_contents .gallery  {
		padding-top: 14rem;
	}

	.kasteras_contents .gallery .gallery_liet__item .img_box img {
		width: auto;
		height: 16.8rem;
		margin: 0 0.5rem;
	}
	.kasteras_contents .gallery .slick-slider .slick-arrow {
		--center-size: 30rem;
	}
	.slick-slider .slick-arrow.slick-prev {
		transform: translateY(-50%) translateX(34%);
	}
	.slick-slider .slick-arrow.slick-next {
		transform: translateY(-50%) translateX(-34%) rotate(180deg);
	}

	.kasteras_contents .gallery .contents_wrapper .illust {
		width: 11rem;
		top: -9.4rem;
		left: -1rem;
	}
	.kasteras_contents .gallery .contents_wrapper::before {
		--width: 26rem;
		top: -9.6rem;
		right: -7.6rem;
	}
	.kasteras_contents .gallery .contents_wrapper::after {
		--width: 26rem;
		top: 25.6rem;
		left: -9rem;
	}

}



/* ------------------------------
	.anime_running_character
------------------------------ */
.kasteras_contents .anime_running_character {
	position: relative;
	width: 100%;
	height: clamp(846px,58.75vw,3000px);
	background: #D7EEF1;
}
.kasteras_contents .anime_running_character::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 0;
	height: 0;
	border-top: 58.75vw solid transparent;
	border-right: 100vw solid var(--color-grass);
	border-bottom: 58.75vw solid var(--color-grass);;
	border-left: 100vw solid transparent;
}
.kasteras_contents .anime_running_character .anime_illust {
	position: absolute;
	top: 0;
	right: 0;
}


@media screen and (min-width: 768px){
	.kasteras_contents .anime_running_character .anime_illust {
		width: 700px;
	}
}

@media screen and (max-width: 768px){
	.kasteras_contents .anime_running_character .anime_illust {
		width: 28rem;
	}
	.kasteras_contents .anime_running_character {
		height: 58.75vw;
	}
}


/* ------------------------------
	.goods
------------------------------ */
.kasteras_contents .goods {
	position: relative;
	background: #000;
	color: #fff;
	padding-bottom: 18.2rem;
	background: var(--color-grass);
}

.kasteras_contents .goods .contents_wrapper {
	position: relative;
}
.kasteras_contents .goods .heading {
	margin-bottom: 70px;
}

.kasteras_contents .goods .goods_list {
	margin: 0 auto;
}
.kasteras_contents .goods .goods_list__box {
	position: relative;
	padding: 12px;
}
.kasteras_contents .goods .goods_list .yellow_pin_box::after,
.kasteras_contents .goods .goods_list .red_pin_box::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: contain;
	pointer-events: none;
}
.kasteras_contents .goods .goods_list .yellow_pin_box::after {
	background-image: url(/brand/kasteras/assets/img/deco/deco_4pin_yellow.svg);
}
.kasteras_contents .goods .goods_list .red_pin_box::after {
	background-image: url(/brand/kasteras/assets/img/deco/deco_4pin_red.svg);
}
.kasteras_contents .goods .goods_list__box .contents_box {
	position: relative;
	background: #fff;
	padding: 16px;
	width: 100%;
	height: 100%;
	box-shadow: 0.6rem 0.6rem 0.6rem rgba(0, 0, 0, 0.2);
}
.kasteras_contents .goods .goods_list__box .contents_inner {
	position: relative;
	width: 100%;
	height: 100%;
	padding: 0.8rem;
	border-radius: 0.1rem;
	background: var(--color-ivory);
}

.kasteras_contents .goods .goods_btn {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 300px;
	height: 70px;
	margin: 0 auto;
	background-image: url(/brand/kasteras/assets/img/deco/deco_btn_bg.svg);
	background-size: contain;
	background-repeat: no-repeat;
	color: #421500;
	white-space: nowrap;
}

/* poster */
.kasteras_contents .goods .goods_list__box.poster_box {
	position: relative;
	padding: 0;
	box-shadow: none;
	cursor: pointer;
}
.kasteras_contents {
	background: var(--color-ivory);
}
.preload_img {
	position: fixed!important;
	top: 0;
	left: 0;
	width: 1px;
	z-index: -9999!important;
	pointer-events: none;
}
.kasteras_contents .goods .goods_list__box.poster_box .poster_bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}

.kasteras_contents .goods .goods_list__box.poster_box img {
	width: 100%;
	position: relative;
	z-index: 10;
}
.kasteras_contents .goods .goods_list__box.poster_box .poster_img {
	display: none;
}
.kasteras_contents .goods .goods_list__box.poster_box .anime-setting_up .poster_img {
	display: inherit;
}

.kasteras_contents .goods .goods_list__box.poster_box .poster_anime,.kasteras_contents .goods .goods_list__box.poster_box .ff-container {
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.kasteras_contents .goods .goods_list__box.poster_box .anime-active .ff-container{
	pointer-events: none;
}
.kasteras_contents .goods .goods_list__box.poster_box .poster > img {

}



@media screen and (min-width: 768px){
	.kasteras_contents .goods .goods_list {
		width: 1000px;
	}
	.kasteras_contents .goods .contents_wrapper {
		top: -110px;
	}

	.kasteras_contents .goods .goods_list__box {
		width: 460px;
		height: 560px;
		margin-bottom: 56px;
	}

	.kasteras_contents .goods .goods_list__box:nth-of-type(1) img {
		margin-top: 1.8rem;
	}
	.kasteras_contents .goods .goods_list__box:nth-of-type(4) img {
		margin-top: 0.2rem;
	}

	.kasteras_contents .goods .goods_list__box .contents_box {
		padding: 16px;
	}

	.kasteras_contents .goods .goods_list__box .contents_inner {
		padding: 40px;
	}

	.kasteras_contents .goods .goods_btn {
		bottom: 50px;
	}
}

@media screen and (max-width: 768px){
	.kasteras_contents .goods {
		padding-top: 0.66rem;
		padding-bottom: 16rem;
	}
	.kasteras_contents .goods .heading {
		margin-bottom: 5.6rem;
	}

	.kasteras_contents .goods .goods_list__box {
		width: 17.37rem;
		height: 21.15rem;
		margin-bottom: 0.8rem;
		padding: 0.5rem;
	}

	.kasteras_contents .goods .goods_list__box:nth-of-type(1) img {
		width: 5.2rem;
		margin-top: 1.8rem;
	}
	.kasteras_contents .goods .goods_list__box:nth-of-type(4) img {
		width: 11.8rem;
		margin-top: 1rem;
	}

	.kasteras_contents .goods .goods_list__box .contents_box {
		padding: 0.6rem;
	}

	.kasteras_contents .goods .goods_list__box .contents_inner {
		padding: 0 0.8rem;
	}

	.kasteras_contents .goods .goods_btn {
		bottom: 0.8rem;
		width: 90%;
		font-size: 1.3rem;
		height: 0;
		padding: 13.7% 0;
		background-image: url(/brand/kasteras/assets/img/deco/deco_btn_bg-sp.svg);
	}
}



/* ------------------------------
	.fixed_bottom_illust
------------------------------ */
.kasteras_contents .fixed_bottom_illust {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 9990;
	pointer-events: none;
}

.kasteras_contents .fixed_bottom_illust .illust_wrapper {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	justify-content: space-between;
}

.kasteras_contents .fixed_bottom_illust .illust_box {
	width: clamp(10rem,20vw,28rem);
}
.kasteras_contents .fixed_bottom_illust img {
	position: relative;
	opacity: 0;
	transition: 0.5s ease-in-out;
}

.kasteras_contents .fixed_bottom_illust .left_illust img {
	transform: translateX(-100px) rotateZ(50deg);
	transform-origin: top left;
}
.kasteras_contents .fixed_bottom_illust .right_illust img {
	transform: translateX(100px) rotateZ(-50deg);
	transform-origin: top right;
}


.kasteras_contents .fixed_bottom_illust[data-fixed_current="introduction"] [data-fixed_type="introduction"] img,
.kasteras_contents .fixed_bottom_illust[data-fixed_current="character"] [data-fixed_type="character"] img,
.kasteras_contents .fixed_bottom_illust[data-fixed_current="story"] [data-fixed_type="story"] img,
.kasteras_contents .fixed_bottom_illust[data-fixed_current="gallery"] [data-fixed_type="story"] img,
.kasteras_contents .fixed_bottom_illust[data-fixed_current="goods"] [data-fixed_type="goods"] img
{
	opacity: 1;
	transform: translateX(0);
	transition: 0.66s ease-out;
	transition-delay: 0.1s;
}


@media screen and (max-width: 768px){

}


/* ------------------------------
	.kasteras_footer
------------------------------ */
.kasteras_contents .kasteras_footer {
	position: relative;
}

.kasteras_contents .kasteras_footer .illust_wrapper {
	position: relative;
	width: 100%;
	height: 224px;
	background-image: url(/brand/kasteras/assets/img/deco/footer_illust_bg@2x.png);
	background-size: cover;
	background-repeat: no-repeat;
}

.kasteras_contents .kasteras_footer .illust_wrapper .img_block {
	position: relative;
	left: -0.4rem;
	width: 90%;
	max-width: 850px;
	margin-left: auto;
	margin-right: auto;
}
.kasteras_contents .kasteras_footer .illust_wrapper .img_box {
	position: relative;
}
.kasteras_contents .kasteras_footer .illust_wrapper .img_box:nth-of-type(1) {
	top: -4.5rem;
}
.kasteras_contents .kasteras_footer .illust_wrapper .img_box:nth-of-type(2) {
	top: -13.2rem;
}
.kasteras_contents .kasteras_footer .illust_wrapper .img_box:nth-of-type(3) {
	top: -4.4rem;
}
.kasteras_contents .kasteras_footer .illust_wrapper .img_box .return_top_btn {
	position: absolute;
	width: 130px;
	top: -4.2rem;
	right: -7.5rem;
	cursor: pointer;
	z-index: 100;
}
.kasteras_contents .kasteras_footer .illust_wrapper .img_box .return_top_btn:hover {
	opacity: 0.86;
}
.kasteras_contents .kasteras_footer .illust_wrapper .img_box .return_top_btn::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(/brand/kasteras/assets/img/deco/return_top_btn_bg@2x.png);
	background-size: contain;
	background-repeat: no-repeat;
	z-index: -1;
}
.kasteras_contents .kasteras_footer .illust_wrapper .anime-rotate_huki::before {
	--scale: 1.04;
}


.kasteras_contents .return_top_anime {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/*background: var(--color-ivory);*/
	z-index: 9997;
	opacity: 0;
	pointer-events: none;
	transition: 0.34s;
}
.kasteras_contents .return_top_anime.active {
	opacity: 1;
}
.kasteras_contents .return_top_anime .ff-container {
	width: 100%;
	height: 100%;
}
.kasteras_contents .return_top_anime img,
.kasteras_contents .return_top_anime .ff-canvas {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
}


.kasteras_contents .kasteras_footer .copyright {
	background: #FDFBE7;
}
.kasteras_contents .kasteras_footer .copyright p {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.4rem;
	height: 8rem;
}

@media screen and (min-width: 768px){

}

@media screen and (max-width: 768px){
	.kasteras_contents .kasteras_footer .illust_wrapper {
		height: 10rem;
	}

	.kasteras_contents .kasteras_footer .illust_wrapper .img_box:nth-of-type(1) {
		width: 7.2rem;
		top: -1.7rem;
	}
	.kasteras_contents .kasteras_footer .illust_wrapper .img_box:nth-of-type(2) {
		width: 13.6rem;
		top: -5.4rem;
	}
	.kasteras_contents .kasteras_footer .illust_wrapper .img_box:nth-of-type(3) {
		width: 8.5rem;
		top: -1.6rem;
	}

	.kasteras_contents .kasteras_footer .illust_wrapper .img_box .return_top_btn {
		width: 6.2rem;
		top: -3.9rem;
		right: -2.8rem;
	}
}


/* ------------------------------
	.modal
------------------------------ */
.modal {
}

.modal .modal_wrapper {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9996;
	pointer-events: none;
	opacity: 0;
}
.modal .modal_wrapper.active {
	pointer-events: all;
	opacity: 1;
}

.modal .modal_wrapper .modal_inner {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
}

.modal .modal_wrapper .modal_inner .modal_cancel_btn {
	--size: 4rem;
	position: absolute;
	top: 1rem;
	right: 1rem;
	width: var(--size);
	height: var(--size);
	border: 0.28rem solid var(--color-brown);
	border-radius:0.6rem;
	cursor: pointer;
}
.modal .modal_wrapper .modal_inner .modal_cancel_btn::before,
.modal .modal_wrapper .modal_inner .modal_cancel_btn::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 66%;
	height: 0.3rem;
	background: var(--color-brown);
}
.modal .modal_wrapper .modal_inner .modal_cancel_btn::before {
	transform: translateX(-50%) translateY(-50%) rotate(45deg);
}
.modal .modal_wrapper .modal_inner .modal_cancel_btn::after {
	transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}


/********   modal news   ********/
.modal .modal_news .modal_inner {
	height: auto;
	padding: 3.2rem 1rem 1rem 4rem;
	background: #fff;
	border: 3px solid var(--color-brown);
	box-shadow: 0px 10px 0px rgba(0, 0, 0, 0.2);
	border-radius: 1rem;
}

.modal .modal_news .news_list {
	overflow-y: auto;
	padding-top: 0.66rem;
}

.modal .modal_news .news_list::-webkit-scrollbar-track {
	background-color: #fff;
	margin-top: 1rem;
}


.modal .modal_news .news_item {
	padding: 1.6rem 1rem 1.8rem 0;
	text-align: left;
	font-size: 1.8rem;
	line-height: 1.76;
	border-top: 3px solid var(--color-brown);
	-o-border-image: url(/brand/kasteras/assets/img/deco/deco_dotted_border.svg) 60;
	   border-image: url(/brand/kasteras/assets/img/deco/deco_dotted_border.svg) 60;
	margin-right: 1.4rem;
}
.modal .modal_news .news_item:last-of-type {
	border-bottom: 3px solid var(--color-brown);
}

.modal .modal_news .heading {
	margin-bottom: 0.44rem;
}

.modal .modal_news .time {
	display: block;
}

@media screen and (min-width: 768px){
	.modal .modal_news .modal_inner {
		width: 712px;
	}
	.modal .modal_news .news_list {
		max-height: 22rem;
	}
}

@media screen and (max-width: 768px){
	.modal .modal_news {
		background: var(--color-ivory);
	}

	.modal .modal_news .heading img {
		height: 1.6rem;
	}

	.modal .modal_news .modal_inner {
		width: 33rem;
		padding: 3.4rem 1rem 1.4rem 2.6rem;
	}

	.modal .modal_news .news_list {
		max-height: calc(90vh - 10rem);
	}
	.modal .modal_news .news_item {
		font-size: 1.8rem;
	}
}


/********   modal story   ********/
.modal .modal_story {
	transform: translateY(-100%);
	-webkit-animation: modal_fade_out 0.8s linear 0s forwards;
	        animation: modal_fade_out 0.8s linear 0s forwards;
}
.modal .modal_story.active {
	transform: translateY(0);
	-webkit-animation: modal_fade_in 1.14s linear 0s forwards;
	        animation: modal_fade_in 1.14s linear 0s forwards;
}
@-webkit-keyframes modal_fade_out {
	0% {
		transform: translateY(0);
		opacity: 1;
	}

	100% {
		transform: translateY(-100%);
		opacity: 0;
	}
}
@keyframes modal_fade_out {
	0% {
		transform: translateY(0);
		opacity: 1;
	}

	100% {
		transform: translateY(-100%);
		opacity: 0;
	}
}
@-webkit-keyframes modal_fade_in {
	0% {
		transform: translateY(-100%);
	}

	50% {
		transform: translateY(0);
	}

	66% {
		transform: translateY(-12%);
	}

	75% {
		transform: translateY(-12%);
	}

	98% {
		transform: translateY(0);
	}
}
@keyframes modal_fade_in {
	0% {
		transform: translateY(-100%);
	}

	50% {
		transform: translateY(0);
	}

	66% {
		transform: translateY(-12%);
	}

	75% {
		transform: translateY(-12%);
	}

	98% {
		transform: translateY(0);
	}
}

.modal .modal_story::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	min-width: 5540px;
	height: 100%;
	background: repeating-linear-gradient(
		90deg,
		#DCAF6B,
		#DCAF6B 116px,
		#E6C484 116px,
		#E6C484 202px
	);
	z-index: -10;
}

.modal .modal_story .modal_inner {
	background: #fff;
	width: 780px;
	height: 680px;
	max-height: 92vh;
	border-radius: 2rem;
}

.modal .modal_story .signboard {
	background-image: url(/brand/kasteras/assets/img/deco/deco_modal_signboard_left.svg);
}
.modal .modal_story .signboard_right .signboard {
	background-image: url(/brand/kasteras/assets/img/deco/deco_modal_signboard_right.svg);
}

.modal .modal_story .modal_inner .modal_contents {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	opacity: 0;
	pointer-events: none;
	transition: 0.8s;
}
.modal .modal_story.active .modal_inner .modal_contents {
	transition: 0s;
}

.modal .modal_story .modal_inner .modal_contents:first-of-type.current ~ .signboard_block .signboard_left {
	opacity: 0;
	pointer-events: none;
}
.modal .modal_story .modal_inner .modal_contents:last-of-type.current ~ .signboard_block .signboard_right {
	opacity: 0;
	pointer-events: none;
}
.modal .modal_story .modal_inner .modal_contents.current {
	opacity: 1;
	pointer-events: all;
	transition: 0s;
}

.modal .modal_story .modal_inner .signboard_block {
	position: absolute;
}


/*10*/
.modal .modal_story #modal_story010 .contents_box {
	display: block;
	text-align: center;
	border: 0.3rem solid var(--color-brown);
	border-radius: 0.3rem;
	width: 41.4rem;
	height: 54rem;
	padding: 17% 15.6% 4%;
	margin: 1.6rem auto 0.4rem;
}
.modal .modal_story #modal_story010 .contents_box .lead {
	line-height: 1.63;
	font-size: 1.8rem;
	font-weight: 700;
	margin-bottom: 8%;
}
.modal .modal_story #modal_story010 .contents_box .illust {
	width: 60%;
	margin-bottom: 8.6%;
}
.modal .modal_story #modal_story010 .contents_box .logo {
	width: 70%;
	margin-bottom: 16%;
}
.modal .modal_story #modal_story010 .contents_box .link_btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 11.9%;
	border-radius: 10rem;
	border: 0.2rem solid var(--color-brown);
	background: var(--color-brown);
	color: #fff;
	font-size: 1.48rem;
	transition: 0s;
}
.modal .modal_story #modal_story010 .contents_box span.link_btn {
	pointer-events: none;
}
.modal .modal_story #modal_story010 .contents_box .link_btn:hover {
	text-decoration: none;
	opacity: 1;
	background: #fff;
	color: var(--color-brown);
}


@media screen and (min-width: 768px){
	.modal .modal_story .modal_inner .modal_contents {
		width: 440px;
	}
	.modal .modal_story .modal_inner .modal_contents .img_box,
	.modal .modal_story .modal_inner .modal_contents .img_box img {
		width: 100%;
	}

	.modal .modal_story .modal_inner .signboard_block {
		top: 50%;
		left: 50%;
		transform: translateX(-50%) translateY(-50%);
		width: 730px;
	}
	.modal .modal_story .modal_inner .signboard_wrapper {
		width: 122px;
		height: 44px;
	}
	.modal .modal_story .modal_inner .signboard_wrapper::before {
		--size: 17px;
	}
}

@media screen and (max-width: 768px){
	.modal .modal_story .modal_inner {
		width: 96%;
		height: 140vw;
		max-height: 94vh;
	}

	.modal .modal_story .modal_inner .modal_contents {
		width: 100%;
		top: calc(50% - 4rem);
		height: 68%;
	}

	.modal .modal_story .modal_inner .signboard_block {
		width: 25rem;
		top: auto;
		bottom: 6.6rem;
		left: 50%;
		transform: translateX(-50%);
	}
	.modal .modal_story .modal_inner .signboard_wrapper {
		width: 11rem;
		height: 3.9rem;
	}
	.modal .modal_story .modal_inner  .signboard_wrapper::before {
		--size: 1.9rem;
	}

	.modal .modal_story .modal_inner .number img{
		height: 1.8rem;
		width: auto;
	}

	.modal .modal_story .modal_inner .img_box {
		height: 90%;
		margin-left: auto;
		margin-right: auto;
	}
	.modal .modal_story .modal_inner .img_box img{
		width: 100%;
		height: 100%;
		-o-object-fit:contain;
		   object-fit:contain;
	}

	/*10*/
.modal .modal_story #modal_story010 .contents_box {
	width: auto;
	height: 86%;
	aspect-ratio: 400/540;
	padding: 5% 6% 4%;
}
.modal .modal_story #modal_story010 .contents_box .lead {
	font-size: 1.44rem;
	white-space: nowrap;
}
.modal .modal_story #modal_story010 .contents_box .link_btn {
	font-size: 1.19rem;
}
}

@media screen and (max-width: 768px) and (min-aspect-ratio: 16/16) {
	.modal .modal_story .modal_inner .modal_contents {
		top: 50%;
	}

	.modal .modal_story .modal_inner .signboard_block {
		width: 34rem;
		top: 50%;
	}
	.modal .modal_story .modal_inner .signboard_wrapper {
		width: 8.2rem;
		height: 2.98rem;
	}
	.modal .modal_story .modal_inner .signboard_wrapper::before {
		--size: 1.4rem;
	}

	/*10*/
	.modal .modal_story #modal_story010 .contents_box {
		padding: 3.2% 3.4% 2%;
		border-width: 2px;
	}

	.modal .modal_story #modal_story010 .contents_box .lead {
		font-size: 30%;
	}
	.modal .modal_story #modal_story010 .contents_box .link_btn {
		font-size: 22%;
	}
}





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

	お問い合わせページ

------------------------------ */
/* ------------------------------
	contact
------------------------------ */
.kasteras_contents.contact_group {
	position: relative;
	min-height: 100vh;
}
.kasteras_contents.contact_group .page_tit {
	font-size: 3.4rem;
	line-height: 1.2;
	margin-bottom: 3rem;
}

.kasteras_contents.contact_group {
	padding-top: 8rem;
	padding-bottom: 22rem;
}
.kasteras_contents.contact_group p {
	line-height: 1.76;
}
.kasteras_contents.contact_group .contents_wrapper {
	max-width: 732px;
}
.kasteras_contents.contact_group .kasteras_footer {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}

.kasteras_contents.contact_group .lead {
	margin-bottom: 4rem;
}

.kasteras_contents.contact_group .attention_text {
	margin: 2.8rem auto 1rem;
	font-size: 1.3rem;
}

.kasteras_contents #contactForm .form-wrap {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	margin-bottom: 2.8rem;
}
.kasteras_contents #contactForm .form-wrap dd {
	width: 470px;
}


.kasteras_contents #contactForm .form-contents_title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	font-size: 1.8rem;
	padding-top: .86em;
}
.kasteras_contents #contactForm .required .form-contents_title::after {
	content: "必須";
	position: relative;
	display: inline-block;
	padding: 0.5rem 0.66rem 0.4rem;
	border-radius: 0.28rem;
	background: #E57A58ee;
	color: #2f0f00;
	font-size: 1.4rem;
	font-weight: 700;
	margin-left: 1.3rem;
}

.kasteras_contents #contactForm input[type="text"],#contactForm textarea {
	width: 100%;
	padding-left: 1rem;
	padding-right: 0.8rem;
	font-size: 1.8rem;
	font-weight: 700;
	outline: none;
	border: 0.3rem solid #421500;
	border-radius: 1rem;
	box-shadow: 0px 1rem 0px rgba(0, 0, 0, 0.2);
	color: #421500;
	font-family: var(--font-sans-serif);
}

.kasteras_contents #contactForm textarea {
	height: 140px;
	padding-top: 1rem;
	line-height: 1.5;
	font-family: var(--font-sans-serif);
}


.kasteras_contents.contact_group .form_btn_block {
	max-width: 590px;
	margin-top: 4rem;
	margin-left: auto;
	margin-right: auto;
}

.kasteras_contents.contact_group .contact_btn {
	--color: #421500;
	--bg-color:  #fff;
	border-color: var(--color);
	transition: border-radius 0.2s ease-in-out;
}
.kasteras_contents.contact_group .contact_btn:hover {
	opacity: 0.76;
	border-radius: 2rem;
	text-decoration: none;
	color: inherit;
}

.kasteras_contents.contact_group .contact_btn.submit_btn {
	--bg-color: #FFE4A0;
}

.kasteras_contents #contactForm .formError {
	position: static!important;
	margin: 0!important;
	pointer-events: none;
}
.kasteras_contents #contactForm .formErrorContent {
	font-size: 1.7rem;
	margin: 1rem auto 0.62rem;
	color: #ff2600;
}
.kasteras_contents #contactForm .formError ~ input ,
.kasteras_contents #contactForm .formError ~ textarea {
	margin-bottom: 1rem;
}
.kasteras_contents #contactForm .form-mail .formErrorContent span {
	display: none;
}
.kasteras_contents #contactForm .form-mail .formErrorContent span:last-of-type{
	display: inherit;
}


@media screen and (min-width: 768px){
	.kasteras_contents #contactForm input[type="text"] {
		height: 50px;
	}

	.kasteras_contents.contact_group .contact_btn.return_btn {
		width: 184px;
	}
	.kasteras_contents.contact_group .contact_btn.submit_btn {
		width: 384px;
	}
}

@media screen and (max-width: 768px){
	.kasteras_contents.contact_group {
		padding-top: 5.6rem;
	}
	.kasteras_contents.contact_group .page_tit img {
		width: 20rem;
	}

	.kasteras_contents.contact_group .lead {
		margin-bottom: 2.2rem;
	}

	.kasteras_contents #contactForm .form-wrap {
		flex-direction: column;
		margin-bottom: 1.2rem;
	}
	.kasteras_contents #contactForm .form-wrap dd {
		width: 100%;
	}

	.kasteras_contents #contactForm .form-contents_title {
		margin-bottom: 0.8rem;
	}

	.kasteras_contents #contactForm input[type="text"] {
		height: 4.4rem;
	}

	.kasteras_contents.contact_group .contact_btn.return_btn {
		width: 14rem;
	}
	.kasteras_contents.contact_group .contact_btn.submit_btn {
		width: 19rem;
	}

	.kasteras_contents #contactForm .form-mail .formErrorContent {
		font-size: 1.6rem;
	}
}

/*****   contfirm   *****/

.confirm #contactForm input[type="text"],
.confirm #contactForm textarea {
	background: transparent;
	border: none;
	outline: none;
	box-shadow: none;
}

.confirm #contactForm .required .form-contents_title::after {
	display: none;
}


/*****   thanks   *****/
.thanks .text {
	margin-bottom: 5rem;
}




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

	ダウンロードページ

------------------------------ */
/* ------------------------------
	download
------------------------------ */
.kasteras_contents .download {
	position: relative;
	padding: 9.6rem 0 11rem;
	text-align: center;
}
.kasteras_contents .downloadb .contents_wrapper {
	position: relative;
	z-index: 10;
}

.kasteras_contents .download .logo {
	width: 328px;
	margin: 0 auto 3.2rem;
}
.kasteras_contents .download .page_tit {
	text-align: center;
	margin: 0 auto 3.7rem;
}
.kasteras_contents .download .page_lead {
	text-align: center;
	margin-bottom: 5.6rem;
	line-height: 1.66;
}

.kasteras_contents .download .btn {
	--color: #fff;
	--bg-color:  var(--color-brown);
}

.kasteras_contents .download .wallpaper_list {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	display: grid;
}

.kasteras_contents .download .ic-new {
	position: relative;
}

.kasteras_contents .download .ic-new::after {
	content: "";
	position: absolute;
	top: -4.6rem;
	right: 0;
	width: 9.4rem;
	height: 9.2rem;
	background: url(/brand/kasteras/assets/img/download/ic_new.png) no-repeat 0 0;
	background-size: 100% auto;
}

.kasteras_contents .download .wallpaper_list_item .title {
	display: flex;
	justify-content: center;
	align-items: center;
	padding-bottom: .8rem
}

.kasteras_contents .download .wallpaper_list_item .title p {
	margin: 0 .4rem;
	font-size: 2rem;
	line-height: 1;
}

.kasteras_contents .download .wallpaper_list_item .title img {
	width: 6.4rem;
}


@media screen and (min-width: 768px){
	.kasteras_contents .download::before {
		content: "";
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
		width: 100%;
		min-width: 5540px;
		height: 100%;
		background: repeating-linear-gradient(
			90deg,
			#DCAF6B,
			#DCAF6B 116px,
			#E6C484 116px,
			#E6C484 202px
		);
		z-index: 0;
	}

	.kasteras_contents .download .wallpaper_list {
		grid-template-columns: 30% 30% 30%;
		-moz-column-gap: 5%;
		     column-gap: 5%;
		row-gap: 6rem;
		margin-bottom: 6.2rem;
	}

	.kasteras_contents .download .wallpaper_list_item {

	}
}
@media screen and (max-width: 768px){
	.kasteras_contents .download {
		padding: 7rem 0 9.2rem;
		background: repeating-linear-gradient(
			90deg,
			#DCAF6B,
			#DCAF6B 7.8%,
			#E6C484 7.8%,
			#E6C484 13.26%
		);
	}

	.kasteras_contents .download .logo {
		width: 21rem;
		margin-bottom: 2.6rem;
	}
	.kasteras_contents .download .page_tit {
		width: 20rem;
		margin-bottom: 2rem;
	}
	.kasteras_contents .download .page_lead {
		text-align: center;
		margin-bottom: 3.8rem;
	}

	.kasteras_contents .download .wallpaper_list {
		grid-template-columns: 47.1% 47.1%;
		-moz-column-gap: 5.8%;
		     column-gap: 5.8%;
		row-gap: 3.8rem;
		margin-bottom: 3.8rem;
	}

	.kasteras_contents .download .ic-new::after {
		top: 0;
		right: 0;
		width: 6.2rem;
		height: 6rem;
	}

	.kasteras_contents .download .wallpaper_list_item .title p {
		font-size: 1.8rem;
	}

	.kasteras_contents .download .wallpaper_list_item .title img {
		width: 4.2rem;
	}

}