@charset "utf-8";
/* character color */
:root{
	--color-c1:#6ca07e;
	--color-c2:#6c6196;
	--color-c3:#4b5674;
	--color-c4:#8ac1c0;
	--color-c5:#c4a548;
	--color-c6:#606060;
	--color-c7:#006b7f;
	--color-c8:#767e48;
	--color-c9:#b99380;
	--color-c10:#a3a3ab;
	--color-c11:#deaa6b;
	--color-c12:#2c4d63;
	--color-c13:#325da2;
	--color-c14:#6681ae;
	--color-c15:#4a5054;
	--color-c16:#8f332a;
	--character-accent:var(--color-c1);
}
.character.c1{ --character-accent:var(--color-c1); }
.character.c2{ --character-accent:var(--color-c2); }
.character.c3{ --character-accent:var(--color-c3); }
.character.c4{ --character-accent:var(--color-c4); }
.character.c5{ --character-accent:var(--color-c5); }
.character.c6{ --character-accent:var(--color-c6); }
.character.c7{ --character-accent:var(--color-c7); }
.character.c8{ --character-accent:var(--color-c8); }
.character.c9,
body.c9{ --character-accent:var(--color-c9); }
.character.c10{ --character-accent:var(--color-c10); }
.character.c11{ --character-accent:var(--color-c11); }
.character.c12{ --character-accent:var(--color-c12); }
.character.c13,
body.c13{ --character-accent:var(--color-c13); }
.character.c14{ --character-accent:var(--color-c14); }
.character.c15{ --character-accent:var(--color-c15); }
.character.c16{ --character-accent:var(--color-c16); }
.fullRight {
    width: calc(100vw - 200px);
}
@media screen and (max-width:768px){
	.fullRight {
		width:100%;
	}
}
.fullRight-left{
	overflow:hidden;
	position: relative;
}
.fullRight-left::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: min(calc(90 / var(--vw-min) * 100vw), 90px);
    width: min(calc(37 / var(--vw-min) * 100vw), 37px);
    height: min(calc(39 / var(--vw-min) * 100vw), 39px);
    display: block;
    background: url(../img/common/goods_point.png) no-repeat center center / contain;
    margin-left: max(calc(-18 / var(--vw-min) * 100vw), -18px);
}

.fullRight-leftCont{
	--left-cont-base:750;
	container-type:inline-size;
	container-name:left-cont;
	width:100%;
	padding:min(calc(50 / var(--vw-min) * 100vw),50px) min(calc(40 / var(--vw-min) * 100vw),40px) min(calc(200 / var(--vw-min) * 100vw),200px) min(calc(40 / var(--vw-min) * 100vw),40px);
}
.fullRight-leftCont.--chart{
  padding-left: 0;
}
@media screen and (max-width:768px){
	.fullRight-leftCont{
		width:100%;
		padding:calc(20 / var(--vw-min) * 100vw) calc(12 / var(--vw-min) * 100vw) calc(120 / var(--vw-min) * 100vw);
	}
	.fullRight-leftCont.--chart {
		padding-left: 0;
		padding-right: 0;
	}
}
.character{
	position:relative;
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}
@media screen and (max-width:768px){
	.character{
		position:relative;
		padding:0;
	}
}

.character__innerWrap{
	position:relative;
	display: flex;
	flex-direction: column;
	width: 100%;
}
.character__inner{
	max-width: min(calc(652 / var(--vw-min) * 100vw),652px);
}
.character__title{
	font-size:min(calc(48 / var(--vw-min) * 100vw),48px);
	font-weight:500;
	font-family:var(--font-figtree);
	color:#99966D;
	line-height:1;
	margin-bottom: min(calc(32 / var(--vw-min) * 100vw),32px);
}
@media screen and (max-width:768px){
	.character__title{
		font-size:calc(40/ var(--vw-min) * 100vw);
		margin-bottom: calc(34 / var(--vw-min) * 100vw);
	}
}

.characterBoxWrap{
	padding: min(calc(8 / var(--vw-min) * 100vw),8px) min(calc(8 / var(--vw-min) * 100vw),8px) min(calc(8 / var(--vw-min) * 100vw),8px) min(calc(32 / var(--vw-min) * 100vw),32px);
	background: var(--character-accent);
	position: relative;
	margin-top: calc(126px * 100cqw / 982px + 48px);
}
@media screen and (max-width:768px){
	.characterBoxWrap{
		margin-top:0;
		padding:0;
	}
}
.characterBoxWrap__bg{
	position: absolute;
    inset: 0;
	pointer-events: none;
    background: color-mix(in srgb, var(--character-accent) 80%, #fff);
    -webkit-mask: url(../img/common/bg_pt_mask.svg) 0 0 / min(calc(80 / var(--vw-min) * 100vw), 80px) auto repeat;
    mask: url(../img/common/bg_pt_mask.svg) 0 0 / min(calc(80 / var(--vw-min) * 100vw), 80px) auto repeat;
}

.characterBoxWrap__deco{
	width: min(calc(24 / var(--vw-min) * 100vw),24px);
	height: 100%;
	position: absolute;
    left: 0;
	top: 0;
	pointer-events: none;
	background: var(--character-accent);
	z-index: 1;
}
.characterBoxWrap__deco::before{
	content: '';
	position: absolute;
    inset: 0;
	pointer-events: none;
	box-shadow: -4px 0 6px 0 rgba(0, 0, 0, 0.20) inset;
	z-index: 2;
}

.characterBoxWrap__deco__bg{
	position: absolute;
    inset: 0;
	pointer-events: none;
    background: color-mix(in srgb, var(--character-accent) 80%, #fff);
    -webkit-mask: url(../img/common/bg_pt_mask.svg) 0 0 / min(calc(80 / var(--vw-min) * 100vw), 80px) auto repeat;
    mask: url(../img/common/bg_pt_mask.svg) 0 0 / min(calc(80 / var(--vw-min) * 100vw), 80px) auto repeat;
}
.characterBoxWrap::after{
	width: min(calc(12 / var(--vw-min) * 100vw),12px);
	height: calc(100% + 12px);
	content: '';
	position: absolute;
	left: min(calc(6 / var(--vw-min) * 100vw),6px);
	top: -6px;
	bottom: -6px;
	margin:auto;
	pointer-events: none;
	border-radius: 1px;
	background: #99966D;
	box-shadow: -4px 0 6px 0 rgba(0, 0, 0, 0.10) inset;
	z-index: 0;
}
@media screen and (max-width:768px){
	.characterBoxWrap{
		padding:0;
		overflow:visible;
		background:transparent;
	}
	.characterBoxWrap__deco{
		width:calc(24 / var(--vw-min) * 100vw);
		height:calc(504 / var(--vw-min) * 100vw);
		left:0;
		top:0;
	}
	.characterBoxWrap__deco::before{
		box-shadow:calc(-3 / var(--vw-min) * 100vw) 0 calc(5 / var(--vw-min) * 100vw) 0 rgba(0, 0, 0, 0.20) inset;
	}
	.characterBoxWrap::after{
		width:calc(12 / var(--vw-min) * 100vw);
		height:calc(516 / var(--vw-min) * 100vw);
		left:calc(6 / var(--vw-min) * 100vw);
		top:calc(-6 / var(--vw-min) * 100vw);
		bottom:unset;
		right:unset;
		margin:auto 0;
		box-shadow:calc(-3 / var(--vw-min) * 100vw) 0 calc(4 / var(--vw-min) * 100vw) 0 rgba(0, 0, 0, 0.10) inset;
	}
}

.characterBox{
	position:relative;
	background-color:#FEFDF9;
	background-image:
		url(../img/character/charabox_deco_lt.svg),
		url(../img/character/charabox_deco_rt.svg),
		url(../img/character/charabox_deco_lb.svg),
		url(../img/character/charabox_deco_rb.svg);
	background-repeat:no-repeat;
	background-size:
		min(calc(44 / var(--vw-min) * 100vw),44px),
		min(calc(44 / var(--vw-min) * 100vw),44px),
		min(calc(44 / var(--vw-min) * 100vw),44px),
		min(calc(44 / var(--vw-min) * 100vw),44px);
	background-position:
		left min(calc(5 / var(--vw-min) * 100vw),5px) top min(calc(5 / var(--vw-min) * 100vw),5px),
		right min(calc(5 / var(--vw-min) * 100vw),5px) top min(calc(5 / var(--vw-min) * 100vw),5px),
		left min(calc(5 / var(--vw-min) * 100vw),5px) bottom min(calc(5 / var(--vw-min) * 100vw),5px),
		right min(calc(5 / var(--vw-min) * 100vw),5px) bottom min(calc(5 / var(--vw-min) * 100vw),5px);
	border:1px solid #99966D;
	overflow:hidden;
}
@media screen and (max-width:768px){
	.characterBox{
		background-color:transparent;
		border:none;
		background-image:none;
		overflow:visible;
	}
}

.character__name img{
	width:100%;
	height:auto;
	pointer-events:none;
}
.character__inner{
	position:relative;
	margin-top:max(calc(-152 / var(--vw-min) * 100vw),-152px);
	padding-bottom:min(calc(60 / var(--vw-min) * 100vw),60px);
}
@media screen and (max-width:768px){
	.character__inner{
		position:relative;
		margin-top:max(calc(-120 / var(--vw-min) * 100vw),-120px);
		padding-bottom:calc(30 / var(--vw-min) * 100vw);
	}
}

/*---------- nav ----------*/
.character__navs{
	position:absolute;
	top:min(calc(80 / var(--vw-min) * 100vw),80px);
	left:50%;
	right:auto;
	z-index:55;
	display:flex;
	flex-direction:row;
	align-items:flex-start;
	justify-content:center;
	gap:10px;
	width:max-content;
	height:126px;
	transform:translateX(-50%) scale(calc(100cqw / 982px));
	transform-origin:top center;
}
.character__nav{
	position:relative;
	display:flex;
	flex-wrap:nowrap;
	height:126px;
	margin:0;
	width:auto;
	justify-content:center;
}
.character__nav li{
	position:relative;
	flex-shrink:0;
	width:84px;
	height:84px;
	margin:0;
	overflow:hidden;
	display:flex;
	justify-content:center;
	align-items:center;
}
.character__nav li:not(:last-child){
	margin-right:-40px;
}
.character__nav li.is-gap{
	margin-right:10px;
}
.character__nav li:nth-child(even){
	top:42px;
}
.character__nav li a{
	display:flex;
	position:relative;
	width:58px;
	height:58px;
	justify-content:center;
	align-items:center;
	background:#000;
	border:4px solid #000;
	overflow:hidden;
	transform:rotate(45deg);
	transition:border-color 0.3s ease, background 0.3s ease;
}
.character__nav li a:after{
	content:'';
	position:absolute;
	inset:0;
	box-sizing:border-box;
	border:1.5px solid #fff;
	z-index:3;
}
.character__nav li a span{
	display:block;
	width:84px;
	height:84px;
	flex-shrink:0;
	transform:rotate(-45deg);
}
.character__nav li a span img{
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}
@media screen and (max-width:768px){
	.character__nav li a span{
		width:calc(80 / var(--vw-min) * 100vw);
		height:calc(80 / var(--vw-min) * 100vw);
	}
}
.character__nav li a.c1{ --nav-accent:var(--color-c1); }
.character__nav li a.c2{ --nav-accent:var(--color-c2); }
.character__nav li a.c3{ --nav-accent:var(--color-c3); }
.character__nav li a.c4{ --nav-accent:var(--color-c4); }
.character__nav li a.c5{ --nav-accent:var(--color-c5); }
.character__nav li a.c6{ --nav-accent:var(--color-c6); }
.character__nav li a.c7{ --nav-accent:var(--color-c7); }
.character__nav li a.c8{ --nav-accent:var(--color-c8); }
.character__nav li a.c9{ --nav-accent:var(--color-c9); }
.character__nav li a.c10{ --nav-accent:var(--color-c10); }
.character__nav li a.c11{ --nav-accent:var(--color-c11); }
.character__nav li a.c12{ --nav-accent:var(--color-c12); }
.character__nav li a.c13{ --nav-accent:var(--color-c13); }
.character__nav li a.c14{ --nav-accent:var(--color-c14); }
.character__nav li a.c15{ --nav-accent:var(--color-c15); }
.character__nav li a.c16{ --nav-accent:var(--color-c16); }
.character__nav li a.is-active{
	border-color:var(--nav-accent);
	background:var(--nav-accent);
}
@media screen and (hover:hover){
	.character__nav li a:hover{
		border-color:var(--nav-accent);
		background:var(--nav-accent);
	}
}

@media screen and (max-width:768px){
	.character__navs{
		position:relative;
		left:unset;
		right:unset;
		top:unset;
		flex-direction:column;
		align-items:center;
		width:100%;
		height:auto;
		gap:calc(8 / var(--vw-min) * 100vw);
		margin:calc(32 / var(--vw-min) * 100vw) auto 0;
		transform:none;
	}
	.character__nav{
		width:100%;
		height:calc(78 / var(--vw-min) * 100vw);
		justify-content:center;
	}
	.character__nav li{
		width:calc(52 / var(--vw-min) * 100vw);
		height:calc(52 / var(--vw-min) * 100vw);
		overflow:visible;
		pointer-events:none;
	}
	.character__nav li:not(:last-child){
		margin-right:calc(-24 / var(--vw-min) * 100vw);
	}
	.character__nav li.is-gap{
		margin-right:calc(-7 / var(--vw-min) * 100vw);
	}
	.character__nav li:nth-child(even){
		top:calc(26 / var(--vw-min) * 100vw);
	}
	.character__nav li a{
		width:calc(36 / var(--vw-min) * 100vw);
		height:calc(36 / var(--vw-min) * 100vw);
		border-width:calc(3 / var(--vw-min) * 100vw);
		pointer-events:auto;
	}
	.character__nav li a span{
		width:calc(52 / var(--vw-min) * 100vw);
		height:calc(52 / var(--vw-min) * 100vw);
	}
}
/*---------- /nav ----------*/

.characterBoxInner{
	display: flex;
	justify-content: center;
	align-items: center;
}
.characterBoxInner::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	pointer-events: none;
	background-color: var(--character-accent);
	-webkit-mask: url(../img/character/charaimg_deco.svg) no-repeat top left calc(272 / var(--vw-min) * 100vw) / calc(64 / var(--vw-min) * 100vw) calc(180 / var(--vw-min) * 100vw);
	mask: url(../img/character/charaimg_deco.svg) no-repeat top left calc(272 / var(--vw-min) * 100vw) / calc(64 / var(--vw-min) * 100vw) calc(180 / var(--vw-min) * 100vw);
}
@media screen and (max-width:768px){
	.characterBoxInner{
		flex-direction:column;
		align-items:stretch;
	}
	.characterBoxInner::before{
		z-index: 2;
		-webkit-mask: url(../img/character/charaimg_deco.svg) no-repeat top right calc(38 / var(--vw-min) * 100vw) / calc(56 / var(--vw-min) * 100vw) calc(158 / var(--vw-min) * 100vw);
		mask: url(../img/character/charaimg_deco.svg) no-repeat top right calc(38 / var(--vw-min) * 100vw) / calc(56 / var(--vw-min) * 100vw) calc(158 / var(--vw-min) * 100vw);
	}
}

/* character > img */
.characterBox__imgWrap{
	width:50%;
	padding-block:min(calc(56 / var(--vw-min) * 100vw),56px);
}
.characterBox__img{
	display: flex;
    width: calc(374 / var(--vw-min) * 100vw);
    align-items: center;
    justify-content: center;
	position: relative;
}
.characterBox__img img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	position: relative;
	z-index: 5;
	display:block;
}

@media screen and (max-width:768px){
	.characterBox__imgWrap{
		position:relative;
		padding: calc(10 / var(--vw-min) * 100vw)  calc(10 / var(--vw-min) * 100vw)  calc(10 / var(--vw-min) * 100vw) calc(34 / var(--vw-min) * 100vw);
		width:100%;
		height:calc(504 / var(--vw-min) * 100vw);
	}
	.characterBox__img__bg{
		position:absolute;
		top:0;
		right:0;
		bottom:0;
		left:0;
		pointer-events:none;
		z-index:0;
		background-color:var(--character-accent);
	}
	.characterBox__img__bg::before{
		content:'';
		position:absolute;
		inset:0;
		pointer-events:none;
		background:color-mix(in srgb, var(--character-accent) 80%, #fff);
		-webkit-mask:url(../img/common/bg_pt_mask.svg) 0 0 / calc(40 / var(--vw-min) * 100vw) auto repeat;
		mask:url(../img/common/bg_pt_mask.svg) 0 0 / calc(40 / var(--vw-min) * 100vw) auto repeat;
	}
	.characterBox__img{
		position:relative;
		z-index:1;
		width:100%;
		height:100%;
		overflow:hidden;
		background-color:#FEFDF9;
		border:1px solid #99966D;
		background-image:
			url(../img/character/charabox_deco_lt.svg),
			url(../img/character/charabox_deco_rt.svg),
			url(../img/character/charabox_deco_lb.svg),
			url(../img/character/charabox_deco_rb.svg);
		background-repeat:no-repeat;
		background-size:
			calc(44 / var(--vw-min) * 100vw),
			calc(44 / var(--vw-min) * 100vw),
			calc(44 / var(--vw-min) * 100vw),
			calc(44 / var(--vw-min) * 100vw);
		background-position:
			left calc(5 / var(--vw-min) * 100vw) top calc(5 / var(--vw-min) * 100vw),
			right calc(5 / var(--vw-min) * 100vw) top calc(5 / var(--vw-min) * 100vw),
			left calc(5 / var(--vw-min) * 100vw) bottom calc(5 / var(--vw-min) * 100vw),
			right calc(5 / var(--vw-min) * 100vw) bottom calc(5 / var(--vw-min) * 100vw);
	}
}

/* character > bg name */
.characterBox__bg__name{
	position: absolute;
	display: flex;
	justify-content: center;
	height: 100%;
	bottom: 0;
	top: 0;
	left:calc(16 / var(--vw-min) * 100vw);
	margin: auto;
	z-index: 1;
	color: var(--character-accent);
	font-size: calc(144 / var(--vw-min) * 100vw);
	font-weight: 500;
	line-height: calc(152 / var(--vw-min) * 100vw);
	opacity: 0.3;
	writing-mode: vertical-rl;
	text-orientation: upright;
}
@media screen and (max-width:768px){
	.characterBox__bg__name{
		top:calc(18 / var(--vw-min) * 100vw);
		bottom:auto;
		left:calc(40 / var(--vw-min) * 100vw);
		height:auto;
		margin:0;
		justify-content:flex-start;
		font-size:calc(72 / var(--vw-min) * 100vw);
		line-height:calc(76 / var(--vw-min) * 100vw);
		z-index:2;
	}
}

/* character > text */
.characterBox__textWrap{
	padding: calc(45 / var(--vw-min) * 100vw) calc(60 / var(--vw-min) * 100vw) calc(45 / var(--vw-min) * 100vw)  0;
}
@media screen and (max-width:768px){
	.characterBox__textWrap{
		padding: 0;
	}
}
.characterBox__text{
	position:relative;
	/*width: calc(398 / var(--vw-min) * 100vw);*/
	padding: calc(32 / var(--vw-min) * 100vw);
}
.characterBox__text > *{
	position:relative;
	z-index:2;
}
.characterBox__text::before{
	content:'';
	position:absolute;
	inset:0;
	pointer-events:none;
	z-index:1;
	background-color:var(--character-accent);
	-webkit-mask-image:
		url(../img/character/charatxt_deco_lt.svg),
		url(../img/character/charatxt_deco_rt.svg),
		url(../img/character/charatxt_deco_lb.svg),
		url(../img/character/charatxt_deco_rb.svg);
	mask-image:
		url(../img/character/charatxt_deco_lt.svg),
		url(../img/character/charatxt_deco_rt.svg),
		url(../img/character/charatxt_deco_lb.svg),
		url(../img/character/charatxt_deco_rb.svg);
	-webkit-mask-repeat:no-repeat;
	mask-repeat:no-repeat;
	-webkit-mask-size:
		min(calc(36 / var(--vw-min) * 100vw),36px),
		min(calc(36 / var(--vw-min) * 100vw),36px),
		min(calc(36 / var(--vw-min) * 100vw),36px),
		min(calc(36 / var(--vw-min) * 100vw),36px);
	mask-size:
		min(calc(36 / var(--vw-min) * 100vw),36px),
		min(calc(36 / var(--vw-min) * 100vw),36px),
		min(calc(36 / var(--vw-min) * 100vw),36px),
		min(calc(36 / var(--vw-min) * 100vw),36px);
	-webkit-mask-position:
		left min(calc(5 / var(--vw-min) * 100vw),5px) top min(calc(5 / var(--vw-min) * 100vw),5px),
		right min(calc(5 / var(--vw-min) * 100vw),5px) top min(calc(5 / var(--vw-min) * 100vw),5px),
		left min(calc(5 / var(--vw-min) * 100vw),5px) bottom min(calc(5 / var(--vw-min) * 100vw),5px),
		right min(calc(5 / var(--vw-min) * 100vw),5px) bottom min(calc(5 / var(--vw-min) * 100vw),5px);
	mask-position:
		left min(calc(5 / var(--vw-min) * 100vw),5px) top min(calc(5 / var(--vw-min) * 100vw),5px),
		right min(calc(5 / var(--vw-min) * 100vw),5px) top min(calc(5 / var(--vw-min) * 100vw),5px),
		left min(calc(5 / var(--vw-min) * 100vw),5px) bottom min(calc(5 / var(--vw-min) * 100vw),5px),
		right min(calc(5 / var(--vw-min) * 100vw),5px) bottom min(calc(5 / var(--vw-min) * 100vw),5px);
}
@media screen and (max-width:768px){
	.characterBox__text{
		margin-top: calc(30 / var(--vw-min) * 100vw);
		margin-left:0;
		width:100%;
		padding:calc(40 / var(--vw-min) * 100vw) calc(28/ var(--vw-min) * 100vw);
	}
	.characterBox__text::before{
		-webkit-mask-size:
			calc(36 / var(--vw-min) * 100vw),
			calc(36 / var(--vw-min) * 100vw),
			calc(36 / var(--vw-min) * 100vw),
			calc(36 / var(--vw-min) * 100vw);
		mask-size:
			calc(36 / var(--vw-min) * 100vw),
			calc(36 / var(--vw-min) * 100vw),
			calc(36 / var(--vw-min) * 100vw),
			calc(36 / var(--vw-min) * 100vw);
	}
}
.character__name{
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	width: 100%;
}
.character__nameText{
	font-size: min(calc(48 / var(--vw-min) * 100vw),48px);
	font-weight: 500;
	color: var(--character-accent);
	line-height: min(calc(56 / var(--vw-min) * 100vw),56px);
	letter-spacing: min(calc(4 / var(--vw-min) * 100vw),4px);
}
.character__nameText ruby{
	ruby-align:center;
}
.character__nameText rt{
	font-size:min(calc(14 / var(--vw-min) * 100vw),14px);
	font-weight:500;
	line-height:1.2;
	margin-bottom: min(calc(10 / var(--vw-min) * 100vw),10px);
}
.character__cv{
	font-size: min(calc(18 / var(--vw-min) * 100vw),18px);
	font-weight: 500;
	line-height: min(calc(28 / var(--vw-min) * 100vw),28px);
}
.character__innerText .character__cv{
	display: flex;
	align-items: center;
	gap: min(calc(6 / var(--vw-min) * 100vw),6px);
	margin-bottom: min(calc(8 / var(--vw-min) * 100vw),8px);
}
.character__innerText .staffComment{
	display: inline-flex;
	flex-shrink: 0;
	line-height: 1;
	transition: opacity 0.3s ease;
	background-color: var(--character-accent);
	-webkit-mask-image: url(../img/common/icon_comment.png);
	mask-image: url(../img/common/icon_comment.png);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}
@media screen and (hover:hover){
	.character__innerText .staffComment:hover{
		opacity: 0.7;
	}
}
.character__innerText .staffComment img{
	display: block;
	width: min(calc(18 / var(--vw-min) * 100vw),18px);
	height: auto;
	opacity: 0;
}
.modal__commentNames--position{
	color: var(--character-accent);
}
.character__innerText .character__cv:empty{
	display: none;
}
.character__innerText{
	font-size: min(calc(15 / var(--vw-min) * 100vw),15px);
	font-weight: 500;
	line-height: min(calc(32 / var(--vw-min) * 100vw),32px);
	letter-spacing: min(calc(0.64 / var(--vw-min) * 100vw),0.64px);
	margin-top: calc(24 / var(--vw-min) * 100vw);
}
@media screen and (max-width:768px){
	.character__nameText{
		font-size:calc(32 / var(--vw-min) * 100vw);
		line-height:calc(40 / var(--vw-min) * 100vw);
		letter-spacing:calc(4 / var(--vw-min) * 100vw);
	}
	.character__nameText rt{
		font-size:calc(12 / var(--vw-min) * 100vw);
		margin-bottom:calc(4 / var(--vw-min) * 100vw);
	}
	.character__cv{
		font-size:calc(15 / var(--vw-min) * 100vw);
		line-height:calc(28 / var(--vw-min) * 100vw);
	}
	.character__innerText .character__cv{
		margin-bottom:calc(6 / var(--vw-min) * 100vw);
		gap:calc(6 / var(--vw-min) * 100vw);
	}
	.character__innerText .staffComment img{
		width:calc(12 / var(--vw-min) * 100vw);
	}
	.character__innerText{
		padding:0;
		font-size:calc(13 / var(--vw-min) * 100vw);
		line-height:calc(26 / var(--vw-min) * 100vw);
		margin-top:calc(16 / var(--vw-min) * 100vw);
	}
}

/**/

.character__line{
	display: none;
}
/*
.character__line{
	position:absolute;
	left:min(calc(170 / var(--vw-min) * 100vw),170px);
	top:min(calc(220 / var(--vw-min) * 100vw),220px);
	height:min(calc(389 / var(--vw-min) * 100vw),389px);
	width:100vw;
	border-radius:min(calc(20 / var(--vw-min) * 100vw),20px);
	padding-left:min(calc(252 / var(--vw-min) * 100vw),252px);
}
@media screen and (max-width:768px){
	.character__line{
		position:absolute;
		left:calc(11 / var(--vw-min) * 100vw);
		top:calc(63 / var(--vw-min) * 100vw);
		height:calc(243 / var(--vw-min) * 100vw);
		border-radius:calc(10 / var(--vw-min) * 100vw);
		padding-left:calc(180 / var(--vw-min) * 100vw);
		background-size:calc(48 / var(--vw-min) * 100vw) !important;
	}
}
*/
.character__line.c1{
	background:url(../img/character/character1_pattern.png) repeat center center;
}
@media screen and (max-width:768px){
	.character__line.c1{
		padding-left:calc(140 / var(--vw-min) * 100vw);
	}
}
.character__line.c2{
	background:url(../img/character/character2_pattern.png) repeat center center;
}
@media screen and (max-width:768px){
	.character__line.c2{
		padding-left:calc(140 / var(--vw-min) * 100vw);
	}
}
.character__line.c3{
	background:url(../img/character/character3_pattern.png) repeat center center;
}

@media screen and (max-width:768px){
	.character__line.c3{
		padding-left:calc(160 / var(--vw-min) * 100vw);
	}
}
.character__line.c4{
	background:url(../img/character/character4_pattern.png) repeat center center;
}
@media screen and (max-width:768px){
	.character__line.c4{
		padding-left:calc(150 / var(--vw-min) * 100vw);
	}
}
.character__line.c5{
	background:url(../img/character/character5_pattern.png) repeat center center;
}
@media screen and (max-width:768px){
	.character__line.c5{
		padding-left:calc(140 / var(--vw-min) * 100vw);
	}
}
.character__line.c6{
	background:url(../img/character/character6_pattern.png) repeat center center;
}
@media screen and (max-width:768px){
	.character__line.c6{
		padding-left:calc(130 / var(--vw-min) * 100vw);
	}
}
.character__line.c7{
	background:url(../img/character/character7_pattern.png) repeat center center;
	padding-left:min(calc(200 / var(--vw-min) * 100vw),200px);
}
@media screen and (max-width:768px){
	.character__line.c7{
		padding-left:calc(120 / var(--vw-min) * 100vw);
	}
}
.character__line.c8{
	background:url(../img/character/character8_pattern.png) repeat center center;
	padding-left:min(calc(220 / var(--vw-min) * 100vw),220px);
}
@media screen and (max-width:768px){
	.character__line.c8{
		padding-left:calc(140 / var(--vw-min) * 100vw);
	}
}
.character__line.c9{
	background:url(../img/character/character9_pattern.png) repeat center center;
}
@media screen and (max-width:768px){
	.character__line.c9{
		padding-left:calc(150 / var(--vw-min) * 100vw);
	}
}
.character__line.c10{
	background:url(../img/character/character10_pattern.png) repeat center center;
}
@media screen and (max-width:768px){
	.character__line.c10{
		padding-left:calc(140 / var(--vw-min) * 100vw);
	}
}
.character__line.c11{
	background:url(../img/character/character11_pattern.png) repeat center center;
	padding-left:min(calc(140 / var(--vw-min) * 100vw),140px);
}
@media screen and (max-width:768px){
	.character__line.c11{
		padding-left:calc(70 / var(--vw-min) * 100vw);
	}
}
.character__line.c12{
	background:url(../img/character/character12_pattern.png) repeat center center;
}
@media screen and (max-width:768px){
	.character__line.c12{
		padding-left:calc(95 / var(--vw-min) * 95vw);
	}
}
.character__line img{
	height:100%;
	width:auto;
}
.character__innerText{
	font-size:min(calc(16 / var(--vw-min) * 100vw),16px);
	line-height:2;
	font-weight:500;
}
@media screen and (max-width:768px){
	.character__innerText{
		font-size:calc(13 / var(--vw-min) * 100vw);
	}
}
.characterChart{
	position:relative;
	padding: 0;
  width: min(calc(750 / var(--vw-min) * 100vw), 750px);
  margin: 0 auto;
}
@media screen and (max-width:768px){
	.characterChart{
		position:relative;
    padding: 0 0 calc(50 / var(--vw-min) * 100vw);
		width: 100%;
		margin: 0 auto;
	}
}
.characterChart .character__title {
	position: absolute;
	left:max(calc(-4 / var(--vw-min) * 100vw),-4px);
	top:min(calc(14 / var(--vw-min) * 100vw),14px);
}
@media screen and (max-width:768px){
	.characterChart .character__title {
		left:calc(8 / var(--vw-min) * 100vw);
		top:calc(8 / var(--vw-min) * 100vw);
		font-size:calc(23 / var(--vw-min) * 100vw);
	}
}

.character__chartBase {
	width: min(calc(750 / var(--vw-min) * 100vw),750px);
  margin: 0 auto;
}
@media screen and (max-width:768px){
	.character__chartBase {
		width: 100%;
		margin: 0 auto;
	}
}
.character__chartBase img {
	display: block;
	width:100%;
	height:auto;
}
.character__chartClickable {
	position: absolute;
}
.character__chartClickable a {
	display: block;
	transition: all 0.3s ease;
}
@media screen and (hover:hover){
	.character__chartClickable a:hover {
		transform:scale(1.1);
	}
}
.character__chartClickable a.--disabled {
	pointer-events: none;
}
#c1 {
	left:min(calc(34 / var(--vw-min) * 100vw),34px);
	top:min(calc(162.8 / var(--vw-min) * 100vw),162.8px);
}
#c1 a {
  aspect-ratio: 250 / 322;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c1.png) no-repeat center center / contain;
}
#c2 {
	left:min(calc(303 / var(--vw-min) * 100vw),303px);
	top:min(calc(167.3 / var(--vw-min) * 100vw),167.3px);
}
#c2 a {
  aspect-ratio: 250 / 321;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c2.png) no-repeat center center / contain;
}
#c3 {
	left:min(calc(34 / var(--vw-min) * 100vw),34px);
	top:min(calc(327 / var(--vw-min) * 100vw),327px);
}
#c3 a {
  aspect-ratio: 250 / 321;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c3.png) no-repeat center center / contain;
}
#c4 {
  left: min(calc(569 / var(--vw-min) * 100vw), 569px);
  top: min(calc(167.3 / var(--vw-min) * 100vw), 168.3px);
}
#c4 a {
  aspect-ratio: 250 / 320;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c4.png) no-repeat center center / contain;
}
#c5 {
	left:min(calc(33 / var(--vw-min) * 100vw),33px);
  top: min(calc(541.3 / var(--vw-min) * 100vw), 543.3px);
}
#c5 a {
  aspect-ratio: 250 / 318;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c5.png) no-repeat center center / contain;
}
#c6 {
	left:min(calc(33 / var(--vw-min) * 100vw),33px);
	top:min(calc(739.3 / var(--vw-min) * 100vw),739.3px);
}
#c6 a {
  aspect-ratio: 250 / 316;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c6.png) no-repeat center center / contain;
}
#c7 {
	left:min(calc(33 / var(--vw-min) * 100vw),33px);
	top:min(calc(898.3 / var(--vw-min) * 100vw),898.3px);
}
#c7 a {
  aspect-ratio: 250 / 316;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c7.png) no-repeat center center / contain;
}
#c8 {
  left: min(calc(33 / var(--vw-min) * 100vw), 33px);
  top: min(calc(1054.3 / var(--vw-min) * 100vw), 1053.3px);
}
#c8 a {
  aspect-ratio: 250 / 312;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c8.png) no-repeat center center / contain;
}
#c9 {
	left: min(calc(33 / var(--vw-min) * 100vw), 33px);
	top:min(calc(1267.3 / var(--vw-min) * 100vw),1267.3px);
}
#c9 a {
  aspect-ratio: 250 / 312;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c9.png) no-repeat center center / contain;
}
#c10 {
	left:min(calc(233 / var(--vw-min) * 100vw),233px);
	top:min(calc(377.3 / var(--vw-min) * 100vw),377.3px);
}
#c10 a {
  aspect-ratio: 250 / 318;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c10.png) no-repeat center center / contain;
}
#c11 {
	left:min(calc(364 / var(--vw-min) * 100vw),364px);
	top:min(calc(377.3 / var(--vw-min) * 100vw),377.3px);
}
#c11 a {
  aspect-ratio: 250 / 318;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c11.png) no-repeat center center / contain;
}
#c12 {
  left: min(calc(250.5 / var(--vw-min) * 100vw), 250.5px);
  top: min(calc(615 / var(--vw-min) * 100vw), 615px);
}
#c12 a {
  aspect-ratio: 250 / 323;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c12.png) no-repeat center center / contain;
}
#c13 {
	left:min(calc(345 / var(--vw-min) * 100vw),345px);
	top:min(calc(689.3 / var(--vw-min) * 100vw),689.3px);
}
#c13 a {
  aspect-ratio: 250 / 322;
	width:min(calc(129 / var(--vw-min) * 100vw),129px);
	background:url(../img/character/chart_c13.png) no-repeat center center / contain;
}
#c14 {
	left:min(calc(230 / var(--vw-min) * 100vw),230px);
	top:min(calc(855.3 / var(--vw-min) * 100vw),855.3px);
}
#c14 a {
  aspect-ratio: 250 / 318;
	width:min(calc(135 / var(--vw-min) * 100vw),135px);
	background:url(../img/character/chart_c14.png) no-repeat center center / contain;
}
#c15 {
	left:min(calc(360 / var(--vw-min) * 100vw),360px);
	top:min(calc(854.3 / var(--vw-min) * 100vw),854.3px);
}
#c15 a {
  aspect-ratio: 250 / 318;
	width:min(calc(135 / var(--vw-min) * 100vw),135px);
	background:url(../img/character/chart_c15.png) no-repeat center center / contain;
}
#c16 {
	left:min(calc(294 / var(--vw-min) * 100vw),294px);
	top:min(calc(963.3 / var(--vw-min) * 100vw),963.3px);
}
#c16 a {
  aspect-ratio: 250 / 318;
	width:min(calc(135 / var(--vw-min) * 100vw),135px);
	background:url(../img/character/chart_c16.png) no-repeat center center / contain;
}
@media screen and (max-width:768px){
	#c1 {
		left:calc(17 / var(--vw-min) * 100vw);
		top:calc(82.4 / var(--vw-min) * 100vw);
	}
	#c1 a {
		width:calc(63.5 / var(--vw-min) * 100vw);
	}
	#c2 {
		left:calc(151.5 / var(--vw-min) * 100vw);
		top:calc(84.65 / var(--vw-min) * 100vw);
	}
	#c2 a {
		width:calc(62.5 / var(--vw-min) * 100vw);
	}
	#c3 {
		left:calc(17 / var(--vw-min) * 100vw);
		top:calc(164.5 / var(--vw-min) * 100vw);
	}
	#c3 a {
		width:calc(63.5 / var(--vw-min) * 100vw);
	}
	#c4 {
		left:calc(284.5 / var(--vw-min) * 100vw);
		top:calc(84.65 / var(--vw-min) * 100vw);
	}
	#c4 a {
		width:calc(63.5 / var(--vw-min) * 100vw);
	}
	#c5 {
		left:calc(16.5 / var(--vw-min) * 100vw);
		top:calc(271.65 / var(--vw-min) * 100vw);
	}
	#c5 a {
		width:calc(63.5 / var(--vw-min) * 100vw);
	}
	#c6 {
		left:calc(16.5 / var(--vw-min) * 100vw);
		top:calc(370.65 / var(--vw-min) * 100vw);
	}
	#c6 a {
		width:calc(63.5 / var(--vw-min) * 100vw);
	}
	#c7 {
		left:calc(16.5 / var(--vw-min) * 100vw);
		top:calc(450.15 / var(--vw-min) * 100vw);
	}
	#c7 a {
		width:calc(63.5 / var(--vw-min) * 100vw);
	}
	#c8 {
		left:calc(16.5 / var(--vw-min) * 100vw);
		top:calc(528.15 / var(--vw-min) * 100vw);
	}
	#c8 a {
		width:calc(63.5 / var(--vw-min) * 100vw);
	}
	#c9 {
		left:calc(16.5 / var(--vw-min) * 100vw);
		top:calc(634.65 / var(--vw-min) * 100vw);
	}
	#c9 a {
		width:calc(63.5 / var(--vw-min) * 100vw);
	}
	#c10 {
		left:calc(117 / var(--vw-min) * 100vw);
		top:calc(189 / var(--vw-min) * 100vw);
	}
	#c10 a {
		width:calc(63.5 / var(--vw-min) * 100vw);
	}
	#c11 {
		left:calc(182.5  / var(--vw-min) * 100vw);
		top:calc(189 / var(--vw-min) * 100vw);
	}
	#c11 a {
		width:calc(63.5 / var(--vw-min) * 100vw);
	}
	#c12 {
		left:calc(126.25 / var(--vw-min) * 100vw);
		top:calc(308.5 / var(--vw-min) * 100vw);
	}
	#c12 a {
		width:calc(63.5 / var(--vw-min) * 100vw);
	}
	#c13 {
		left:calc(172.5 / var(--vw-min) * 100vw);
		top:calc(345.65 / var(--vw-min) * 100vw);
	}
	#c13 a {
		width:calc(63.5 / var(--vw-min) * 100vw);
	}
	#c14 {
		left:calc(115 / var(--vw-min) * 100vw);
		top:calc(428.65 / var(--vw-min) * 100vw);
	}
	#c14 a {
		width:calc(66.5 / var(--vw-min) * 100vw);
	}
	#c15 {
		left:calc(180 / var(--vw-min) * 100vw);
		top:calc(428.15 / var(--vw-min) * 100vw);
	}
	#c15 a {
		width:calc(66.5 / var(--vw-min) * 100vw);
	}
	#c16 {
		left:calc(147 / var(--vw-min) * 100vw);
		top:calc(482.65 / var(--vw-min) * 100vw);
	}
	#c16 a {
		width:calc(66.5 / var(--vw-min) * 100vw);
	}
}
.character__description {
	position: absolute;
	left:min(calc(1 / var(--vw-min) * 100vw),1px);
	top:min(calc(65 / var(--vw-min) * 100vw),65px);
	font-size:min(calc(14 / var(--vw-min) * 100vw),14px);
}
@media screen and (max-width:768px){
	.character__description {
		left:calc(9.5 / var(--vw-min) * 100vw);
		top:calc(33.5 / var(--vw-min) * 100vw);
		font-size:calc(6 / var(--vw-min) * 100vw);
	}
}
.loading{
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	z-index:12000;
	background:#fff;
	display:flex;
	justify-content:center;
	align-items:center;
	overflow: hidden;
}
.loading__logo{
	width:40%;
	height:40%;
	background:url(../img/common/logo.png) no-repeat center center / contain;
	max-height:665px;
	opacity:0;
	transition:all 0.9s ease;
	transform:scale(1.1);
	margin-left:min(calc(30 / var(--vw-min) * 100vw),30px);
}
#leaf {
	border: 0;
	overflow: hidden;
	position: fixed;
	top: 0;
	height:max(100vh,56.25vw);
	width:max(100vw,177.7777vh);
	pointer-events: none;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
}
@media screen and (max-width:768px){
	#leaf {
		top:0;
		left:50%;
		transform:translateX(-50%);
		height:max(200vh,112.5vw);
		width:max(200vw,355.5555vh);
	}
}
.loading.an .loading__logo{
	opacity:1;
	transform:scale(1);
}