@charset "utf-8";
/*-----------------------------------------------
 * Character
-------------------------------------------------*/
#character{
	position: relative;
}

.contentInner{
	width: 100%;
	max-width: min(calc(1920 / var(--vw-min) * 100vw), 1920px);
	padding: 0 min(calc(70 / var(--vw-min) * 100vw), calc(70px * var(--max-percent)));
	margin-top: min(calc(24 / var(--vw-min) * 100vw), 24px);
	position: relative;
	margin-left: auto;
	margin-right: auto;
}
@media screen and (max-width:768px){
	.contentInner{
		padding: 0 calc(20 / var(--vw-min) * 100vw);
		margin-top: calc(32 / var(--vw-min) * 100vw);
		max-width: 100%;
	}
}


.characterLists{
	width: 100%;
    display: grid;
	grid-template-columns: repeat(4, 1fr);
	column-gap: min(calc(20 / var(--vw-min) * 100vw), calc(20px * var(--max-percent)));
	row-gap: min(calc(20 / var(--vw-min) * 100vw), calc(20px * var(--max-percent)));
}
.characterList{
	width: 100%;
}
.characterList__link{
	width: 100%;
	padding-top: 132%;
	display: block;
	border-radius: min(calc(10 / var(--vw-min) * 100vw), calc(10px * var(--max-percent)));
	position: relative;
	overflow: hidden;
}
.characterList__cont{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.characterList__name{
	position: absolute;
	bottom: 0;
	left: 0;
	width: min(calc(42 / var(--vw-min) * 100vw), calc(42px * var(--max-percent)));
	padding: min(calc(12 / var(--vw-min) * 100vw), calc(12px * var(--max-percent))) min(calc(9 / var(--vw-min) * 100vw), calc(9px * var(--max-percent)));
	background-color: #000;
	z-index: 1;
}
.characterList__name img{
	width: 100%;
}
.characteList__img{
	width: 100%;
	height: 100%;
}
.characteList__img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media screen and (max-width:768px){
	.characterLists{
		grid-template-columns: repeat(3, 1fr);
		column-gap: calc(10 / var(--vw-min) * 100vw);
		row-gap: calc(10 / var(--vw-min) * 100vw);
	}
	.characterList__link{
		padding-top: 143.4783%;
	}
	.characteList__img img{
		object-position: 33% 50%;
	}
}

@media screen and (hover:hover) and (pointer: fine){
	.characterList__link{
		transition: filter .3s ease, transform .6s cubic-bezier(.46,.21,.24,1);
	}
	.characteList__img img{
		transition: transform .3s ease;
	}
	.characterList__link:hover{
		filter: brightness(112.5%);
	}
	.characterList__link:hover .characteList__img img{
		transform: scale(120%) rotate(8deg);
	}
}


/**
 * Animation
 */
.characterList{
	perspective: 1200px;
	opacity: 0;
	transition: opacity .3s ease;
}
.characterList__link{
	transform: rotate3d(0, 1, 0, 90deg);
	transition: filter .3s ease, transform .6s cubic-bezier(.46,.21,.24,1);
}

.content.--is-ani .characterList{
	opacity: 1;
}
.content.--is-ani .characterList__link{
	transform: rotate3d(0, 1, 0, 0deg);
}

/* characterList */
.characterList {
  --delay-step: 0.025s;
}

.content.--is-ani .characterList {
  transition-delay: calc(var(--i) * var(--delay-step) + 0.05s);
}

.content.--is-ani .characterList .characterList__link {
  transition-delay: 0s, calc((var(--i) * var(--delay-step)) + var(--delay-step) + 0.05s);
}





/**
* Modal
**/
.characterModal{
	width: 100%;
	min-height: 100vh;
	position: relative;
	color: #FFF;
	display: flex;
	align-items: center;
}
.characterModal[data-txt="black"]{
	color: #000;
}

.characterModal__cont{
	position: relative;
	z-index: 1;
	width: 100%;
}

.characterModal__contIn{
	display: flex;
	align-items: flex-start;
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: 0 min(calc(30 / var(--vw-min) * 100vw), calc(30px * var(--max-percent))) min(calc(40 / var(--vw-min) * 100vw), calc(40px * var(--max-percent)));
	position: relative;
	z-index: 1;
}


.characterImage{
	order: -1;
	width: 50%;/* 570 */
}
.characterImage--img{
	width: 113.1579%;/* 645 */
	margin-top: -40.8772%;/* -233 */
	margin-left: -0.8772%;/* -5 */
}
.characterImage--img img{
	width: 100%;
}

@media screen and (max-width:768px){
	.characterModal{
		align-items: flex-start;
		overflow: hidden;
	}
	.characterModal__cont{
		padding-bottom: calc(48 / var(--vw-min) * 100vw);
	}
	.characterModal__contIn{
		max-width: 100%;
		padding: 0 calc(20 / var(--vw-min) * 100vw);
		flex-direction: column;
	}
	.characterImage{
		width: 100%;
	}
	.characterImage--img{
		position: absolute;
		top: 0;
		left: 0;
		margin-top: calc(-112 / var(--vw-min) * 100vw);
		margin-left: calc(-1 / var(--vw-min) * 100vw);
		width: calc(796 / var(--vw-min) * 100vw);
		height: calc(1029 / var(--vw-min) * 100vw);
	}
}

.characterImage--img{
	opacity: 0;
	transform: scale(88%);
	transition: transform .4s cubic-bezier(.46,.21,.24,1) .6s, opacity .4s ease .6s;
}
.--is-ani .characterImage--img{
	opacity: 1;
	transform: scale(100%);
}



/* detail */
.characterDetail{
	width: 50%;
	padding-top: min(calc(221 / var(--vw-min) * 100vw), calc(221px * var(--max-percent)));
	padding-left: min(calc(20 / var(--vw-min) * 100vw), calc(20px * var(--max-percent)));
	position: relative;
}
.character__name{
	width: 100%;
	height: min(calc(180 / var(--vw-min) * 100vw), calc(180px * var(--max-percent)));
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.character__name-name{
	height: min(calc(60 / var(--vw-min) * 100vw), calc(60px * var(--max-percent)));
}
.character__name-name img{
	display: block;
	height: 100%;
}
.character__name-cv{
	margin-top: min(calc(20 / var(--vw-min) * 100vw), calc(20px * var(--max-percent)));
	line-height: 1;
	font-size: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	font-weight: 700;
	color: #FFF;
}

.character__textArea{
	padding-top: min(calc(20 / var(--vw-min) * 100vw), calc(20px * var(--max-percent)));
	font-size: min(calc(16 / var(--vw-min) * 100vw), calc(16px * var(--max-percent)));
	line-height: 1.875;
	font-weight: 700;
}
.character__dlLists{
	display: flex;
	flex-direction: column;
	gap: min(calc(10 / var(--vw-min) * 100vw), calc(10px * var(--max-percent)));
	margin-bottom: min(calc(20 / var(--vw-min) * 100vw), calc(20px * var(--max-percent)));
}
.character__dlList{
	display: flex;
	align-items: center;
}
.character__dlList > dt{
	flex-shrink: 0;
	min-width: min(calc(180 / var(--vw-min) * 100vw), calc(180px * var(--max-percent)));
	background-color: #000;
	border-radius: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	color: #FFF;
	padding: 0.125em 1em;
	text-align: center;
	margin-right: 1em;
}

@media screen and (max-width:768px){
	.characterDetail{
		width: 100%;
		padding-top: 0;
		padding-left: unset;
		position: relative;
		z-index: 1;
	}
	.character__name{
		height: calc(180 / var(--vw-min) * 100vw);
	}
	.character__name-name{
		height: calc(60 / var(--vw-min) * 100vw);
	}
	.character__name-cv{
		margin-top: calc(20 / var(--vw-min) * 100vw);
		font-size: calc(24 / var(--vw-min) * 100vw);
	}
	.character__textArea{
		padding-top: calc(740 / var(--vw-min) * 100vw);
		padding-left: calc(40 / var(--vw-min) * 100vw);
		padding-right: calc(40 / var(--vw-min) * 100vw);
		font-size: calc(20 / var(--vw-min) * 100vw);
		line-height: 2;
	}

	.character__dlLists{
		line-height: 2;
	}
	.character__dlList > dt{
		min-width: calc(232 / var(--vw-min) * 100vw);
		border-radius: calc(48 / var(--vw-min) * 100vw);
		padding-left: 0.75em;
		padding-right: 0.75em;
	}
}

.character__name-name{
	opacity: 0;
	transform: translateY(50%);
	transition: transform .7s cubic-bezier(.46,.21,.24,1) .7s, opacity .4s ease .7s;
}
.character__name-cv{
	opacity: 0;
	transform: translateY(75%);
	transition: transform .6s cubic-bezier(.46,.21,.24,1) .7s, opacity .4s ease .7s;
}
.character__textArea{
	opacity: 0;
	transition: opacity .6s ease .9s;
}
.--is-ani .character__name-name,
.--is-ani .character__name-cv{
	opacity: 1;
	transform: translateY(0%);
}
.--is-ani .character__textArea{
	opacity: 1;
}




.character__youtube{
	position: absolute;
	top: 0;
	left: 0;
	right: min(calc(60 / var(--vw-min) * 100vw), calc(60px * var(--max-percent)));
	height: min(calc(214 / var(--vw-min) * 100vw), calc(214px * var(--max-percent)));
	aspect-ratio: 16 / 9;
	max-width: 100%;
	margin-top: min(calc(18 / var(--vw-min) * 100vw), calc(18px * var(--max-percent)));
	margin-left: min(calc(20 / var(--vw-min) * 100vw), calc(20px * var(--max-percent)));
}
.character__youtube iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
@media screen and (max-width:768px){
	.character__youtube{
		position: relative;
		right: unset;
		max-width: unset;
		width: calc(100% + calc(40 / var(--vw-min) * 100vw));
		height: auto;
		margin-left: calc(-20 / var(--vw-min) * 100vw);
		margin-top: calc(48 / var(--vw-min) * 100vw);
	}
}

.character__youtube{
	opacity: 0;
	transition: opacity .6s ease .95s;
}
.--is-ani .character__youtube{
	opacity: 1;
}


/* blackLink */
.character__bline{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin-top: min(calc(221 / var(--vw-min) * 100vw), calc(221px * var(--max-percent)));
	height: min(calc(180 / var(--vw-min) * 100vw), calc(180px * var(--max-percent)));
}
.character__bline:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0%;
	bottom: 0;
	background: linear-gradient(rgba(0, 0, 0, 100%), rgba(0, 0, 0, 100%)) right bottom / 0 100% no-repeat;
	transition: background-size 0.6s cubic-bezier(.46,.21,.24,1);
}
.--is-ani .character__bline:before{
	background-size: 100% 100%;
	background-position: left bottom;
}
@media screen and (max-width:768px){
	.character__bline{
		height: calc(180 / var(--vw-min) * 100vw);
		margin-top: unset;
	}
}


/* arrow */
.character__navs{
	position: absolute;
	top: 0;
	left: min(calc(30 / var(--vw-min) * 100vw), calc(30px * var(--max-percent)));
	right: min(calc(30 / var(--vw-min) * 100vw), calc(30px * var(--max-percent)));
	height: min(calc(180 / var(--vw-min) * 100vw), calc(180px * var(--max-percent)));
	margin-top: min(calc(221 / var(--vw-min) * 100vw), calc(221px * var(--max-percent)));
	display: flex;
	align-items: center;
	justify-content: space-between;
	z-index: 1;
}
.character__nav{
	display: block;
	width: min(calc(70 / var(--vw-min) * 100vw), calc(70px * var(--max-percent)));
	height: min(calc(70 / var(--vw-min) * 100vw), calc(70px * var(--max-percent)));
	pointer-events: all;
	position: relative;
}
.character__nav--arrow{
	display: block;
	width: 100%;
	height: 100%;
	-webkit-mask: url(../img/common/arrow_bg.svg) no-repeat center / contain;
	mask: url(../img/common/arrow_bg.svg) no-repeat center / contain;
	background-color: red;
}
.character__nav--arrow:after{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 55.8824%;/* 38 */
	height: 35.2942%;/* 24 */
	-webkit-mask: url(../img/common/arrow.png) no-repeat center / contain;
	mask: url(../img/common/arrow.png) no-repeat center / contain;
	background-color: #FFF;
}
.character__nav.__l{
	transform: scale(-1,-1);
}

@media screen and (max-width:768px){
	.character__navs{
		left: calc(20 / var(--vw-min) * 100vw);
		right: calc(20 / var(--vw-min) * 100vw);
		margin-top: calc(180 / var(--vw-min) * 100vw);
		height: calc(740 / var(--vw-min) * 100vw);
	}
	.character__nav{
		width: calc(70 / var(--vw-min) * 100vw);
		height: calc(70 / var(--vw-min) * 100vw);
	}
	.characterModal .character__nav--arrow{
		background-color: #000!important;
	}
}


.character__navs{
	opacity: 0;
	transform: scale(90%);
	transition: opacity .4s ease .4s, transform .6s ease .4s;
}
.--is-ani .character__navs{
	opacity: 1;
	transform: scale(100%);
}
@media screen and (hover:hover) and (pointer: fine){
	.character__nav--arrow{
		transition: opacity .3s ease, transform .125s ease;
	}
	.character__nav--arrow:hover{
		opacity: 85%;
		transform: scale(105%);
	}
	.character__nav--arrow:after{
		transition: transform .25s ease;
	}
	.character__nav:hover .character__nav--arrow:after{
		transform: translateX(12.5%);
	}
}



/* bg */
.character__bg{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.character__bg img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}


.characterModal__close{
	position: fixed;
	top: 0;
	right: 0;
	width: min(calc(100 / var(--vw-min) * 100vw), calc(100px * var(--max-percent)));
	height: min(calc(100 / var(--vw-min) * 100vw), calc(100px * var(--max-percent)));
	margin-top: min(calc(20 / var(--vw-min) * 100vw), calc(20px * var(--max-percent)));
	margin-right: min(calc(20 / var(--vw-min) * 100vw), calc(20px * var(--max-percent)));
	z-index: 1;
}
.characterModal__close--link{
	display: block;
	width: 100%;
	height: 100%;
	-webkit-mask: url(../img/common/arrow_bg.svg) no-repeat center / contain;
	mask: url(../img/common/arrow_bg.svg) no-repeat center / contain;
	background-color: #fff;
}
.characterModal__close--link:after{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 40%;
	height: 40%;
	-webkit-mask: url(../img/common/icon_close.png) no-repeat center / contain;
	mask: url(../img/common/icon_close.png) no-repeat center / contain;
	background-color: #000;
	margin: auto;
}

@media screen and (hover:hover) and (pointer: fine){
	.characterModal__close--link{
		transition: opacity .3s ease, transform .125s ease;
	}
	.characterModal__close--link:hover{
		opacity: 85%;
		transform: scale(105%);
	}
	.characterModal__close--link:after{
		transition: transform .25s ease;
	}
	.characterModal__close--link:hover::after{
		transform: rotate(90deg);
	}
}



/*-------------------------------------------------------------
* Chracter Setting
*------------------------------------------------------------*/
/**
* 01 -> hinukahime
**/
[data-chara="hinukahime"] .characterList__link{
	background-color: #fec95e;
}
[data-chara="hinukahime"] .character__nav--arrow{
	background-color: #fec95e;
}


/**
* 02 -> sakunahime
**/
[data-chara="sakunahime"] .characterList__link{
	background-color: #af1f1f;
}
[data-chara="sakunahime"] .character__nav--arrow{
	background-color: #5f0702;
}


/**
* 03 -> tamajii
**/
[data-chara="tamajii"] .characterList__link{
	background-color: #639b81;
}
[data-chara="tamajii"] .character__nav--arrow{
	background-color: #639b81;
}


/**
* 04 -> koyomi
**/
[data-chara="koyomi"] .characterList__link{
	background-color: #fdd278;
}
[data-chara="koyomi"] .character__nav--arrow{
	background-color: #e1b66d;
}

[data-chara="koyomi"] .characterImage--img{
	overflow: hidden;
}
[data-chara="koyomi"] .characterImage--img img{
	transform: translateY(min(calc(60 / var(--vw-min) * 100vw), calc(60px * var(--max-percent))));
}



/**
* 05 -> kokorowa
**/
[data-chara="kokorowahime"] .characterList__link{
	background-color: #4e87c9;
}
[data-chara="kokorowahime"] .character__nav--arrow{
	background-color: #4e87c9;
}


/**
* 06 -> kamuhitsuki
**/
[data-chara="kamuhitsuki"] .characterList__link{
	background-color: #77a57c;
}
[data-chara="kamuhitsuki"] .character__nav--arrow{
	background-color: #77a57c;
}
@media screen and (max-width:768px){
	[data-chara="kamuhitsuki"] .characterImage--img img{
		transform: translateX(calc(-24 / var(--vw-min) * 100vw));
	}
	[data-chara="kamuhitsuki"] .character__textArea{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	}
}


/**
* 07 -> omochiyo
**/
[data-chara="omochiyohime"] .characterList__link{
	background-color: #821a76;
}
[data-chara="omochiyohime"] .character__nav--arrow{
	background-color: #821a76;
}


/**
* 08 -> haritoginomikoto
**/
[data-chara="haritoginomikoto"] .characterList__link{
	background-color: #97113c;
}
[data-chara="haritoginomikoto"] .character__nav--arrow{
	background-color: #97113c;
}
@media screen and (max-width:768px){
	[data-chara="haritoginomikoto"] .character__textArea{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	}
}


/**
* 09 -> hihikaka
**/
[data-chara="hihikakahime"] .characterList__link{
	background-color: #7864ba;
}
[data-chara="hihikakahime"] .character__nav--arrow{
	background-color: #7864ba;
}
@media screen and (max-width:768px){
	[data-chara="hihikakahime"] .character__textArea{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	}
}


/**
* 10 -> akuchitatehikonushi
**/
[data-chara="akuchitatehikonushi"] .characterList__link{
	background-color: #553a3e;
}
[data-chara="akuchitatehikonushi"] .character__nav--arrow{
	background-color: #553a3e;
}

[data-chara="akuchitatehikonushi"] .characterImage--img{
	overflow: hidden;
}
[data-chara="akuchitatehikonushi"] .characterImage--img img{
	transform: translateY(min(calc(6 / var(--vw-min) * 100vw), calc(6px * var(--max-percent))));
}
@media screen and (max-width:768px){
	[data-chara="akuchitatehikonushi"] .character__textArea{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	}
}

/**
* 11 -> amehikonomikoto
**/
[data-chara="amehikonomikoto"] .characterList__link{
	background-color: #869b4b;
}
[data-chara="amehikonomikoto"] .character__nav--arrow{
	background-color: #869b4b;
}

[data-chara="amehikonomikoto"] .characterImage--img{
	overflow: hidden;
}
[data-chara="amehikonomikoto"] .characterImage--img img{
	transform: translateY(min(calc(8 / var(--vw-min) * 100vw), calc(8px * var(--max-percent))));
}
@media screen and (max-width:768px){
	[data-chara="amehikonomikoto"] .character__textArea{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	}
}


/**
* 12 -> okurubi
**/
[data-chara="okurubihime"] .characterList__link{
	background-color: #61ffff;
}
[data-chara="okurubihime"] .character__nav--arrow{
	background-color: #61ffff;
}

[data-chara="okurubihime"] .characterImage--img{
	overflow: hidden;
}
[data-chara="okurubihime"] .characterImage--img img{
	transform: translateY(min(calc(26 / var(--vw-min) * 100vw), calc(26px * var(--max-percent))));
}
@media screen and (max-width:768px){
	[data-chara="okurubihime"] .character__textArea{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	}
}


/**
* 13 -> nanafuto
**/
[data-chara="nanafutohime"] .characterList__link{
	background-color: #4b3b5b;
}
[data-chara="nanafutohime"] .character__nav--arrow{
	background-color: #7864ba;
}


/**
* 14 -> karabakinokami
**/
[data-chara="karabakinokami"] .characterList__link{
	background-color: #9c3734;
}
[data-chara="karabakinokami"] .character__nav--arrow{
	background-color: #9c3734;
}

[data-chara="karabakinokami"] .characterImage--img{
	overflow: hidden;
}
[data-chara="karabakinokami"] .characterImage--img img{
	transform: translateY(min(calc(40 / var(--vw-min) * 100vw), calc(40px * var(--max-percent))));
}
@media screen and (max-width:768px){
	[data-chara="karabakinokami"] .character__textArea{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	}
}


/**
* 15 -> kaguchika
**/
[data-chara="kaguchikahime"] .characterList__link{
	background-color: #dd5c88;
}
[data-chara="kaguchikahime"] .character__nav--arrow{
	background-color: #dd5c88;
}


/**
* 16 -> kushinaukehime
**/
[data-chara="kushinaukehime"] .characterList__link{
	background-color: #bdbbbf;
}
[data-chara="kushinaukehime"] .character__nav--arrow{
	background-color: #bdbbbf;
}

[data-chara="kushinaukehime"] .characterImage--img{
	overflow: hidden;
}
[data-chara="kushinaukehime"] .characterImage--img img{
	transform: translateY(min(calc(30 / var(--vw-min) * 100vw), calc(30px * var(--max-percent))));
}

@media screen and (max-width:768px){
	[data-chara="kushinaukehime"] .character__textArea{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	}
}


/**
* 17 -> tachisironokami
**/
[data-chara="tachisironokami"] .characterList__link{
	background-color: #6e84b0;
}
[data-chara="tachisironokami"] .character__nav--arrow{
	background-color: #6e84b0;
}

[data-chara="tachisironokami"] .characterImage--img{
	overflow: hidden;
}
[data-chara="tachisironokami"] .characterImage--img img{
	transform: translateY(min(calc(30 / var(--vw-min) * 100vw), calc(30px * var(--max-percent))));
}
@media screen and (max-width:768px){
	[data-chara="tachisironokami"] .character__textArea{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	}
}


/**
* 18 -> imusubi
**/
[data-chara="imusubihime"] .characterList__link{
	background-color: #e2601f;
}
[data-chara="imusubihime"] .character__nav--arrow{
	background-color: #e2601f;
}


/**
* 19 -> oshiromagami
**/
[data-chara="oshiromagami"] .characterList__link{
	background-color: #303e58;
}
[data-chara="oshiromagami"] .character__nav--arrow{
	background-color: #254684;
}

[data-chara="oshiromagami"] .characterImage--img{
	overflow: hidden;
}
[data-chara="oshiromagami"] .characterImage--img img{
	transform: translateY(min(calc(42 / var(--vw-min) * 100vw), calc(42px * var(--max-percent))));
}

@media screen and (max-width:768px){
	[data-chara="oshiromagami"] .character__textArea{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	}
}


/**
* 20 -> shimefunanokami
**/
[data-chara="shimefunanokami"] .characterList__link{
	background-color: #cec8db;
}
[data-chara="shimefunanokami"] .character__nav--arrow{
	background-color: #cec8db;
}

[data-chara="shimefunanokami"] .characterImage--img{
	overflow: hidden;
}
[data-chara="shimefunanokami"] .characterImage--img img{
	transform: translateY(min(calc(32 / var(--vw-min) * 100vw), calc(32px * var(--max-percent))));
}
@media screen and (max-width:768px){
	[data-chara="shimefunanokami"] .character__textArea{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	}
}


/**
* 21 -> minaorihime
**/
[data-chara="minaorihime"] .characterList__link{
	background-color: #3b6aa2;
}
[data-chara="minaorihime"] .character__nav--arrow{
	background-color: #3b6aa2;
}

[data-chara="minaorihime"] .characterImage--img{
	overflow: hidden;
}
[data-chara="minaorihime"] .characterImage--img img{
	transform: translateY(min(calc(32 / var(--vw-min) * 100vw), calc(32px * var(--max-percent))));
}
@media screen and (max-width:768px){
	[data-chara="minaorihime"] .characterImage--img img{
		transform: translateX(calc(-20 / var(--vw-min) * 100vw));
	}
}



/**
* 22 -> iwatohime
**/
[data-chara="iwatohime"] .characterList__link{
	background-color: #9b2426;
}
[data-chara="iwatohime"] .character__nav--arrow{
	background-color: #9b2426;
}

[data-chara="iwatohime"] .characterImage--img{
	overflow: hidden;
}
[data-chara="iwatohime"] .characterImage--img img{
	transform: translateY(min(calc(26 / var(--vw-min) * 100vw), calc(26px * var(--max-percent))));
}
@media screen and (max-width:768px){
	[data-chara="iwatohime"] .characterImage--img img{
		transform: translateX(calc(-20 / var(--vw-min) * 100vw));
	}
	[data-chara="iwatohime"] .character__textArea{
		margin-top: min(calc(24 / var(--vw-min) * 100vw), calc(24px * var(--max-percent)));
	}
}