main{position:relative;z-index:0;-webkit-padding-after:0;padding-block-end:0}@media (min-width: 769px) and (orientation: landscape), (min-width: 960px){main{z-index:20;-webkit-margin-after:calc(-30 / var(--device_font-size) * 1rem);margin-block-end:calc(-30 / var(--device_font-size) * 1rem)}}@media (max-width: 768px) and (orientation: landscape), (min-width: 769px) and (max-width: 959px) and (orientation: portrait) and (orientation: landscape){#characterNav{-webkit-order:1;order:1;position:static;width:100%;margin-inline:auto;padding-inline:calc(120 / var(--device_font-size) * 1rem);-webkit-padding-after:calc(100 / var(--device_font-size) * 1rem);padding-block-end:calc(100 / var(--device_font-size) * 1rem)}}@media (max-width: 768px) and (orientation: portrait), (min-width: 769px) and (max-width: 959px) and (orientation: portrait) and (orientation: portrait){#characterNav{position:absolute;z-index:10;top:0;right:0;width:auto}}@media (min-width: 769px) and (orientation: landscape) and (min-height: 349px), (min-width: 960px) and (min-height: 349px){#characterNav{z-index:10;right:0;width:calc(140 / var(--device_font-size) * 1rem);translate:0 -50%}}@media (min-width: 769px) and (orientation: landscape) and (min-height: 349px) and (orientation: landscape), (min-width: 960px) and (min-height: 349px) and (orientation: landscape){#characterNav{position:fixed;top:50%}}@media (min-width: 769px) and (orientation: landscape) and (min-height: 349px) and (orientation: portrait), (min-width: 960px) and (min-height: 349px) and (orientation: portrait){#characterNav{position:absolute;top:calc(400 / var(--device_font-size) * 1rem)}}@media (min-width: 769px) and (orientation: landscape) and (max-height: 840px), (min-width: 960px) and (max-height: 840px){#characterNav{position:static;grid-column:1/3;width:100%;translate:0 0}}#characterNav ul{display:grid}@media (max-width: 768px), (min-width: 769px) and (max-width: 959px) and (orientation: portrait){#characterNav ul{gap:calc(20 / var(--device_font-size) * 1rem)}}@media (max-width: 768px) and (orientation: landscape), (min-width: 769px) and (max-width: 959px) and (orientation: portrait) and (orientation: landscape){#characterNav ul{grid-template-columns:repeat(3, 1fr)}}@media (min-width: 769px) and (orientation: landscape), (min-width: 960px){#characterNav ul{gap:calc(10 / var(--device_font-size) * 1rem)}}@media (min-width: 769px) and (orientation: landscape) and (max-height: 840px), (min-width: 960px) and (max-height: 840px){#characterNav ul{grid-template-columns:repeat(6, 1fr);gap:calc(30 / var(--device_font-size) * 1rem);width:-webkit-fit-content;width:fit-content;margin-inline:auto;-webkit-margin-after:calc(80 / var(--device_font-size) * 1rem);margin-block-end:calc(80 / var(--device_font-size) * 1rem)}}@media (max-width: 768px) and (orientation: portrait), (min-width: 769px) and (max-width: 959px) and (orientation: portrait) and (orientation: portrait){#characterNav ul li{translate:29.41176% 0}}@media (min-width: 769px) and (orientation: landscape) and (any-hover: hover), (min-width: 960px) and (any-hover: hover){#characterNav ul li span:before{transition:width 0.5s, height 0.5s}#characterNav ul li:hover span:before{width:calc(100% - calc(12 / var(--device_font-size) * 1rem));height:calc(100% - calc(12 / var(--device_font-size) * 1rem))}}@media (min-width: 769px) and (orientation: landscape) and (min-height: 839px), (min-width: 960px) and (min-height: 839px){#characterNav ul li{translate:23.52941% 0}}@media (min-width: 769px) and (orientation: landscape) and (min-height: 839px) and (any-hover: hover), (min-width: 960px) and (min-height: 839px) and (any-hover: hover){#characterNav ul li{transition:translate 0.5s}#characterNav ul li img{transition:translate 0.5s}#characterNav ul li:hover{translate:11.76471% 0}#characterNav ul li:hover img{translate:-5% 0}}#characterNav ul li a{display:block;position:relative;z-index:0;-webkit-filter:drop-shadow(calc(10 / var(--device_font-size) * 1rem) calc(10 / var(--device_font-size) * 1rem) calc(10 / var(--device_font-size) * 1rem) rgba(7,52,56,0.2));filter:drop-shadow(calc(10 / var(--device_font-size) * 1rem) calc(10 / var(--device_font-size) * 1rem) calc(10 / var(--device_font-size) * 1rem) rgba(7,52,56,0.2))}#characterNav ul li a span{position:relative;z-index:0;display:block;background:var(--bg_color)}@media (max-width: 768px) and (orientation: landscape), (min-width: 769px) and (max-width: 959px) and (orientation: portrait) and (orientation: landscape){#characterNav ul li a span{-webkit-mask:url(../images/common/mask_btn_tl.png) no-repeat top left/calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_tr.png) no-repeat top right/calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_bl.png) no-repeat bottom left/calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_br.png) no-repeat bottom right/calc(20 / var(--device_font-size) * 1rem),linear-gradient(to bottom, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem), #000 calc(100% - calc(18 / var(--device_font-size) * 1rem)), transparent calc(100% - calc(18 / var(--device_font-size) * 1rem))),linear-gradient(to right, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem), #000 calc(100% - calc(18 / var(--device_font-size) * 1rem)), transparent calc(100% - calc(18 / var(--device_font-size) * 1rem)));mask:url(../images/common/mask_btn_tl.png) no-repeat top left/calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_tr.png) no-repeat top right/calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_bl.png) no-repeat bottom left/calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_br.png) no-repeat bottom right/calc(20 / var(--device_font-size) * 1rem),linear-gradient(to bottom, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem), #000 calc(100% - calc(18 / var(--device_font-size) * 1rem)), transparent calc(100% - calc(18 / var(--device_font-size) * 1rem))),linear-gradient(to right, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem), #000 calc(100% - calc(18 / var(--device_font-size) * 1rem)), transparent calc(100% - calc(18 / var(--device_font-size) * 1rem)));aspect-ratio:1/1;height:auto}}@media (max-width: 768px) and (orientation: portrait), (min-width: 769px) and (max-width: 959px) and (orientation: portrait) and (orientation: portrait){#characterNav ul li a span{-webkit-mask:url(../images/common/mask_btn_tl.png) no-repeat top left / calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_bl.png) no-repeat bottom left/calc(20 / var(--device_font-size) * 1rem),linear-gradient(to bottom, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem), #000 calc(100% - calc(18 / var(--device_font-size) * 1rem)), transparent calc(100% - calc(18 / var(--device_font-size) * 1rem))),linear-gradient(to right, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem));mask:url(../images/common/mask_btn_tl.png) no-repeat top left / calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_bl.png) no-repeat bottom left/calc(20 / var(--device_font-size) * 1rem),linear-gradient(to bottom, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem), #000 calc(100% - calc(18 / var(--device_font-size) * 1rem)), transparent calc(100% - calc(18 / var(--device_font-size) * 1rem))),linear-gradient(to right, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem));width:calc(170 / var(--device_font-size) * 1rem);height:calc(120 / var(--device_font-size) * 1rem)}}@media (min-width: 769px) and (orientation: landscape), (min-width: 960px){#characterNav ul li a span{height:calc(100 / var(--device_font-size) * 1rem)}}@media (min-width: 769px) and (orientation: landscape) and (min-height: 839px), (min-width: 960px) and (min-height: 839px){#characterNav ul li a span{-webkit-mask:url(../images/common/mask_btn_tl.png) no-repeat top left / calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_bl.png) no-repeat bottom left/calc(20 / var(--device_font-size) * 1rem),linear-gradient(to bottom, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem), #000 calc(100% - calc(18 / var(--device_font-size) * 1rem)), transparent calc(100% - calc(18 / var(--device_font-size) * 1rem))),linear-gradient(to right, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem));mask:url(../images/common/mask_btn_tl.png) no-repeat top left / calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_bl.png) no-repeat bottom left/calc(20 / var(--device_font-size) * 1rem),linear-gradient(to bottom, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem), #000 calc(100% - calc(18 / var(--device_font-size) * 1rem)), transparent calc(100% - calc(18 / var(--device_font-size) * 1rem))),linear-gradient(to right, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem));width:calc(170 / var(--device_font-size) * 1rem)}}@media (min-width: 769px) and (orientation: landscape) and (max-height: 840px), (min-width: 960px) and (max-height: 840px){#characterNav ul li a span{-webkit-mask:url(../images/common/mask_btn_tl.png) no-repeat top left/calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_tr.png) no-repeat top right/calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_bl.png) no-repeat bottom left/calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_br.png) no-repeat bottom right/calc(20 / var(--device_font-size) * 1rem),linear-gradient(to bottom, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem), #000 calc(100% - calc(18 / var(--device_font-size) * 1rem)), transparent calc(100% - calc(18 / var(--device_font-size) * 1rem))),linear-gradient(to right, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem), #000 calc(100% - calc(18 / var(--device_font-size) * 1rem)), transparent calc(100% - calc(18 / var(--device_font-size) * 1rem)));mask:url(../images/common/mask_btn_tl.png) no-repeat top left/calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_tr.png) no-repeat top right/calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_bl.png) no-repeat bottom left/calc(20 / var(--device_font-size) * 1rem),url(../images/common/mask_btn_br.png) no-repeat bottom right/calc(20 / var(--device_font-size) * 1rem),linear-gradient(to bottom, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem), #000 calc(100% - calc(18 / var(--device_font-size) * 1rem)), transparent calc(100% - calc(18 / var(--device_font-size) * 1rem))),linear-gradient(to right, transparent calc(18 / var(--device_font-size) * 1rem), #000 calc(18 / var(--device_font-size) * 1rem), #000 calc(100% - calc(18 / var(--device_font-size) * 1rem)), transparent calc(100% - calc(18 / var(--device_font-size) * 1rem)));width:calc(100 / var(--device_font-size) * 1rem)}}#characterNav ul li a span::before,#characterNav ul li a span:after{content:"";position:absolute;top:50%;left:50%;translate:-50% -50%;width:100%;height:100%}#characterNav ul li a span:before{z-index:0;width:calc(100% - calc(8 / var(--device_font-size) * 1rem));height:calc(100% - calc(8 / var(--device_font-size) * 1rem));border-style:solid;border-width:calc(20 / var(--device_font-size) * 1rem);-o-border-image:url(../images/common/border_frame_white.png) 20 / calc(20 / var(--device_font-size) * 1rem);border-image:url(../images/common/border_frame_white.png) 20 / calc(20 / var(--device_font-size) * 1rem)}#characterNav ul li a span:after{z-index:-10;-webkit-filter:saturate(0);filter:saturate(0);mix-blend-mode:overlay;background:url(../images/common/bg_btn_gradation.webp) no-repeat center/150% 150%}#characterNav ul li a span img{position:absolute;z-index:10;top:0;left:0;translate:0% 0%;height:100%;width:auto;translate:-13% 0}@media (min-width: 769px) and (orientation: landscape) and (max-height: 840px), (min-width: 960px) and (max-height: 840px){#characterNav ul li a span img{translate:-15% 0}}@media (max-width: 768px) and (orientation: portrait), (min-width: 769px) and (max-width: 959px) and (orientation: portrait) and (orientation: portrait){#characterNav ul li.active{translate:17.64706% 0}#characterNav ul li.active img{translate:-10% 0}}@media (min-width: 769px) and (orientation: landscape) and (min-height: 839px), (min-width: 960px) and (min-height: 839px){#characterNav ul li.active{translate:11.76471% 0}#characterNav ul li.active img{translate:-5% 0}}#detailCol{position:relative;display:grid;z-index:0;width:100%}@media (min-width: 769px) and (orientation: landscape), (min-width: 960px){#detailCol{display:grid;grid-template-columns:55% 45%;-webkit-align-items:flex-end;align-items:flex-end;padding-inline:calc(calc(100% - calc(1200 / var(--device_font-size) * 1rem))/2)}#detailCol.alvin,#detailCol.rowen{-webkit-align-items:flex-start;align-items:flex-start}}#detailCol .ill{width:100%}@media (max-width: 768px), (min-width: 769px) and (max-width: 959px) and (orientation: portrait){#detailCol .ill{position:relative;z-index:0;-webkit-order:2;order:2}#detailCol .ill:after{content:"";position:absolute;z-index:-1;bottom:-1px;left:0;background:#FFF;width:100%;height:calc(110 / var(--device_font-size) * 1rem)}#detailCol .ill>img{width:140%;translate:-24% 0}}@media (min-width: 769px) and (orientation: landscape), (min-width: 960px){#detailCol .ill{-webkit-order:2;order:2}#detailCol .ill>img{width:calc(950 / var(--device_font-size) * 1rem);translate:-37.89474% 0}}#detailColInner{display:grid;gap:calc(60 / var(--device_font-size) * 1rem);background:#FFF;max-width:100%;padding-block:calc(40 / var(--device_font-size) * 1rem) calc(100 / var(--device_font-size) * 1rem)}@media (max-width: 768px), (min-width: 769px) and (max-width: 959px) and (orientation: portrait){#detailColInner{-webkit-order:2;order:2}}@media (min-width: 769px) and (orientation: landscape), (min-width: 960px){#detailColInner{position:relative;z-index:1;-webkit-order:1;order:1;-webkit-align-items:flex-start;align-items:flex-start;-webkit-align-content:flex-start;align-content:flex-start;gap:calc(30 / var(--device_font-size) * 1rem);background:none;-webkit-margin-before:0;margin-block-start:0;padding-block:calc(0 / var(--device_font-size) * 1rem) calc(60 / var(--device_font-size) * 1rem)}}#detailCol .serif{position:relative;z-index:0;width:100%}#detailCol .serif:before,#detailCol .serif:after{content:"";position:absolute;z-index:-1;height:auto}@media (max-width: 768px), (min-width: 769px) and (max-width: 959px) and (orientation: portrait){#detailCol .serif:after{bottom:0;right:calc(30 / var(--device_font-size) * 1rem);background:url(../images/character/bg_serif_sp.webp) no-repeat center/contain;aspect-ratio:161/171;width:calc(161 / var(--device_font-size) * 1rem)}}@media (min-width: 769px) and (orientation: landscape), (min-width: 960px){#detailCol .serif{width:100%;margin-inline:auto}#detailCol .serif:before{top:calc(30 / var(--device_font-size) * 1rem);left:calc(30 / var(--device_font-size) * 1rem);background:url(../images/character/bg_serif_pc_tl.webp) no-repeat center/contain;aspect-ratio:49/68;width:calc(49 / var(--device_font-size) * 1rem)}#detailCol .serif:after{bottom:calc(10 / var(--device_font-size) * 1rem);right:calc(20 / var(--device_font-size) * 1rem);background:url(../images/character/bg_serif_pc_br.webp) no-repeat center/contain;aspect-ratio:94/70;width:calc(94 / var(--device_font-size) * 1rem)}}#detailCol .box{display:grid;gap:calc(40 / var(--device_font-size) * 1rem);width:calc(590 / var(--device_width) * 100%);padding:calc(40 / var(--device_font-size) * 1rem)}#detailCol .box hgroup{display:grid;gap:calc(20 / var(--device_font-size) * 1rem);color:var(--color_green);line-height:1}#detailCol .box hgroup h2{margin:0;font-size:calc(42 / var(--device_font-size) * 1rem);line-height:1;text-align:left}#detailCol .box hgroup p{font-size:calc(26 / var(--device_font-size) * 1rem);font-weight:700;letter-spacing:0.04em}#detailCol .box>p{font-weight:400;line-height:2}@media (min-width: 769px) and (orientation: landscape), (min-width: 960px){#detailCol .box{gap:calc(30 / var(--device_font-size) * 1rem);width:calc(540 / 660 * 100%)}#detailCol .box hgroup h2{font-size:calc(36 / var(--device_font-size) * 1rem)}#detailCol .box hgroup p{font-size:calc(20 / var(--device_font-size) * 1rem)}}#detailCol .imgSlider{display:grid}@media (min-width: 769px) and (orientation: landscape), (min-width: 960px){#detailCol .imgSlider{width:calc(540 / var(--device_font-size) * 1rem)}}#bg{overflow:hidden;position:absolute;z-index:-1;top:0;left:0;width:100%}#bg:before,#bg #bgAnime{position:absolute;-webkit-mask:var(--mask_character) no-repeat top left;mask:var(--mask_character) no-repeat top left}@media (max-width: 768px), (min-width: 769px) and (max-width: 959px) and (orientation: portrait){#bg{height:calc(100% + calc(240 / var(--device_width) * 100vw));top:calc(-240 / var(--device_width) * 100vw)}#bg:before,#bg #bgAnime{-webkit-mask-size:calc(2900 / var(--device_width) * 100vw) calc(2900 / var(--device_width) * 100vw);mask-size:calc(2900 / var(--device_width) * 100vw) calc(2900 / var(--device_width) * 100vw);top:0;left:calc(-100 / var(--device_width) * 100vw);width:calc(850 / var(--device_width) * 100vw);height:100%}}@media (min-width: 769px) and (orientation: landscape), (min-width: 960px){#bg{height:calc(100% + calc(280 / var(--device_font-size) * 1rem));top:calc(-280 / var(--device_font-size) * 1rem);-webkit-clip-path:polygon(0 0, 100% 0, 100% calc(100% - calc(30 / var(--device_font-size) * 1rem)), 0 calc(100% - calc(30 / var(--device_font-size) * 1rem)));clip-path:polygon(0 0, 100% 0, 100% calc(100% - calc(30 / var(--device_font-size) * 1rem)), 0 calc(100% - calc(30 / var(--device_font-size) * 1rem)))}#bg:before,#bg #bgAnime{top:0;left:calc(50% + calc(160 / var(--device_font-size) * 1rem));-webkit-mask-size:calc(2900 / var(--device_font-size) * 1rem) calc(2900 / var(--device_font-size) * 1rem);mask-size:calc(2900 / var(--device_font-size) * 1rem) calc(2900 / var(--device_font-size) * 1rem);width:calc(50% + calc(160 / var(--device_font-size) * 1rem));max-width:calc(2900 / var(--device_font-size) * 1rem);height:100%}}

/*# sourceMappingURL=maps/character.css.map */