@charset "utf-8";

@media screen and (min-width:641px){
#siteheader nav ul li:nth-child(4) a:after {background-position: -462px -185px; opacity: 1;}

main {background: url(../images/character/bg.jpg) center top no-repeat fixed; color: #502555; min-height: 962px;}
main .modal{margin-top:30px;}
main .modal a{transition: 0.5s; position: relative; display: block;}
main .modal a:hover {opacity: 0.7;}

/* premium　なし */
.wall-character { min-height: 946px; position: absolute; left: 0; top: 0; width: 100%; min-width: 1200px; opacity: 0; transition:opacity 1s;}
.wall-character.show {opacity: 1;}
.wall-character div a {position: absolute; right: 253px; top: 312px; z-index: 100; transition: 0.5s ease; transform: scale(0,0); transform-origin: left bottom; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}
.wall-character div a.show {transform: scale(1,1); top: 302px;}

.wall-character div a:after{content: ''; background: url(../images/character/icon-plus.png) center center no-repeat; background-size: 100% auto; width: 100%; height: 100%; position: absolute; left: 0; top: -4px; opacity: 0; transition: 0.5s; transform-origin: center top;}
.wall-character div a:before{content: ''; background: url(../images/character/icon-muinus.png) center center no-repeat; background-size: 100% auto; width: 100%; height: 100%; position: absolute; left: 0; top: -4px; transition: 0.5s; opacity: 1; z-index: 100;}

.wall-character div a:hover {transform: scale(0.9,0.9);}

.wall-character .illust{position: absolute; width: 1289px; height: 2179px; left: 50%; margin-left: -464px; transition:opacity 0.5s ,transform 0.5s;}
.wall-character .illust:after{content: ''; background: url(../images/character/01/illust.png); width: 1289px; height: 2179px; position: absolute; left: 0%; top: 70px; margin-left: 0px; opacity: 1; transition: 0.5s ease; background-size: 100% auto !important; transform-origin: center top;}
.wall-character .illust:before{content: ''; width: 1289px; height: 2179px; position: absolute; left: 0%; top: 70px; margin-left: 0px; opacity: 0; transition: 0.5s ease; background-size: 100% auto !important; transform-origin: center top;}
.wall-character .model3d{position: absolute; width: 1289px; height: 2179px; left: 50%; margin-left: -464px; opacity: 0; transition:opacity 0.5s,transform 0.5s; transform: translate(120px, 0);}
.wall-character .model3d:after{content: ''; background: url(../images/character/01/3dmodel.png); width: 1289px; height: 2179px; position: absolute; left: 0%; top: 70px; margin-left: 0px; opacity: 1; transition: 0.5s ease; background-size: 100% auto !important; transform-origin: center top;}
.wall-character .model3d:before{content: ''; width: 1289px; height: 2179px; position: absolute; left: 0%; top: 70px; margin-left: 0px; opacity: 0; transition: 0.5s ease , opacity 0.1s; background-size: 100% auto !important; transform-origin: center top;}

.wall-character .illust:after{ transition: 0.5s ease, opacity 0.1s;}
.wall-character .illust.zoom:after{ transition: 0.5s ease ;}
.wall-character .model3d:after{ transition: 0.5s ease , opacity 0.1s;}
.wall-character .model3d.zoom:after{ transition: 0.5s ease ;}

.wall-character .illust:before{ transition: 0.5s ease;}
.wall-character .illust.zoom:before{ transition: 0.5s ease , opacity 0.1s;}
.wall-character .model3d:before{ transition: 0.5s ease ;}
.wall-character .model3d.zoom:before{ transition: 0.5s ease , opacity 0.1s;}

.wall-character.model .model3d {opacity: 1; transform: translate(0px, 0); z-index: 100;}
.wall-character.model .illust {opacity: 0; transform: translate(-120px, 0); z-index: 0;}

.wall-character .zoom:after,
.wall-character .zoom:before{transform: scale(0.44,0.44) translate(39px, 210px); transform-origin: center top;}
.wall-character .zoom a:after{opacity: 1;}
.wall-character .zoom a:before{opacity: 0;}

p.wall-change {position: absolute; z-index: 1000; right: 0; top: 	705px; width: 100%; opacity: 0; transition:opacity 0.8s, top 0.8s; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}
p.wall-change.show {opacity: 1; top: 685px;}
p.wall-change a{display: inline-block; position: relative; float: right; transition: 0.3s;}
p.wall-change a:after{content: ''; background: url(../images/character/btn-illust.png) left top no-repeat; width: 100%; height: 100%; position: absolute; left: 0; top: 0; transition: 0.5s; opacity: 0;}
p.wall-change a:before{content: ''; background: url(../images/character/btn-model3d.png) left top no-repeat; width: 100%; height: 100%; position: absolute; left: 0; top: 0; transition: 0.5s; z-index: 10;}
p.wall-change a.model:after{opacity: 1;}
p.wall-change a.model:before{opacity: 0;}
p.wall-change a:hover {opacity: 0.7;}



/* premium　あり */
.wall-premium { min-height: 946px; position: absolute; left: 0; top: 0; width: 100%; min-width: 1200px; opacity: 0; transition:opacity 1s;}
.wall-premium.show {opacity: 1;}
.wall-premium div a {position: absolute; right: 302px; top: 312px; z-index: 100; transition: 0.5s ease; transform: scale(0,0); transform-origin: left bottom; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}
.wall-premium div a.show {transform: scale(1,1); top: 302px;}
.wall-premium div a:after{content: ''; background: url(../images/character/icon-plus.png) center center no-repeat; background-size: 100% auto; width: 100%; height: 100%; position: absolute; left: 0; top: -4px; opacity: 0; transition: 0.5s; transform-origin: center top;}
.wall-premium div a:before{content: ''; background: url(../images/character/icon-muinus.png) center center no-repeat; background-size: 100% auto; width: 100%; height: 100%; position: absolute; left: 0; top: -4px; transition: 0.5s; opacity: 1; z-index: 100;}
.wall-premium div a:hover {transform: scale(0.9,0.9);}

.wall-premium .illust{position: absolute; width: 1338px; height: 2187px; left: 50%; margin-left: -464px; transition:opacity 0.5s ,transform 0.5s; opacity: 0; transform: translate(120px, 0);}
.wall-premium .illust:after{content: ''; background: url(../images/character/01/illust.png); width: 1338px; height: 2187px; position: absolute; left: 0%; top: 62px; margin-left: 0px; opacity: 1; transition: 0.5s ease; background-size: 100% auto !important; transform-origin: center top;}
.wall-premium .illust:before{content: ''; width: 1338px; height: 2187px; position: absolute; left: 0%; top: 70px; margin-left: 0px; opacity: 0; transition: 0.5s ease; background-size: 100% auto !important; transform-origin: center top;}
.wall-premium .model3d{position: absolute; width: 1338px; height: 2187px; left: 50%; margin-left: -464px; opacity: 0; transition:opacity 0.5s,transform 0.5s; transform: translate(120px, 0);}
.wall-premium .model3d:after{content: ''; background: url(../images/character/01/3dmodel.png); width: 1338px; height: 2187px; position: absolute; left: 0%; top: 62px; margin-left: 0px; opacity: 1; transition: 0.5s ease; background-size: 100% auto !important; transform-origin: center top;}
.wall-premium .model3d:before{content: ''; width: 1338px; height: 2187px; position: absolute; left: 0%; top: 70px; margin-left: 0px; opacity: 0; transition: 0.5s ease , opacity 0.1s; background-size: 100% auto !important; transform-origin: center top;}
.wall-premium .premium{position: absolute; width: 1338px; height: 2187px; left: 50%; margin-left: -464px; transition:opacity 0.5s ,transform 0.5s; opacity: 1;}
.wall-premium .premium:after{content: ''; background: url(../images/character/01/premium.png); width: 1338px; height: 2187px; position: absolute; left: 0%; top: 62px; margin-left: 0px; opacity: 1; transition: 0.5s ease; background-size: 100% auto !important; transform-origin: center top;}
.wall-premium .premium:before{content: ''; width: 1338px; height: 2187px; position: absolute; left: 0%; top: 70px; margin-left: 0px; opacity: 1; transition: 0.5s ease; background-size: 100% auto !important; transform-origin: center top;}

.wall-premium .illust:after{ transition: 0.5s ease, opacity 0.1s;}
.wall-premium .illust.zoom:after{ transition: 0.5s ease ;}
.wall-premium .model3d:after{ transition: 0.5s ease , opacity 0.1s;}
.wall-premium .model3d.zoom:after{ transition: 0.5s ease ;}
.wall-premium .premium:after{ transition: 0.5s ease , opacity 0.1s;}
.wall-premium .premium.zoom:after{ transition: 0.5s ease ;}

.wall-premium .illust:before{ transition: 0.5s ease;}
.wall-premium .illust.zoom:before{ transition: 0.5s ease , opacity 0.1s;}
.wall-premium .model3d:before{ transition: 0.5s ease ;}
.wall-premium .model3d.zoom:before{ transition: 0.5s ease , opacity 0.1s;}
.wall-premium .premium:before{ transition: 0.5s ease ;}
.wall-premium .premium.zoom:before{ transition: 0.5s ease , opacity 0.1s;}

.wall-premium.change-model .model3d {opacity: 1; transform: translate(0px, 0); z-index: 100;}
.wall-premium.change-model .illust {opacity: 0; transform: translate(120px, 0); z-index: 0;}
.wall-premium.change-model .premium {opacity: 0; transform: translate(120px, 0); z-index: 0;}
.wall-premium.change-illust .model3d {opacity: 0; transform: translate(120px, 0); z-index: 0;}
.wall-premium.change-illust .illust {opacity: 1; transform: translate(0px, 0); z-index: 100;}
.wall-premium.change-illust .premium {opacity: 0; transform: translate(120px, 0); z-index: 0;}
.wall-premium.change-premium .model3d {opacity: 0; transform: translate(120px, 0); z-index: 0;}
.wall-premium.change-premium .illust {opacity: 0; transform: translate(120px, 0); z-index: 0;}
.wall-premium.change-premium .premium {opacity: 1; transform: translate(0px, 0); z-index: 100;}

.wall-premium .zoom:after,
.wall-premium .zoom:before{transform: scale(0.44,0.44) translate(9px, 220px); transform-origin: center top;}
.wall-premium .zoom a:after{opacity: 1;}
.wall-premium .zoom a:before{opacity: 0;}

ul.wall-premiumchange {position: absolute; z-index: 1000; right: 0; top: 655px; width: 100%; opacity: 1; transition:top 0.8s; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}
ul.wall-premiumchange.show {opacity: 1; top: 625px;}
ul.wall-premiumchange li {display: block; clear: both; text-align: center; position: relative; opacity: 0; transition: opacity 0.8s; transition-delay: 0.1s;}
ul.wall-premiumchange.show li {opacity: 1;}
ul.wall-premiumchange.show li:nth-child(2) {transition-delay: 0.25s;}
ul.wall-premiumchange.show li:nth-child(3) {transition-delay: 0.4s;}
ul.wall-premiumchange li a{width: 266px; display: block; position: relative; transition: 0.3s; font-size: 0; margin: 0 auto; left: 567px;}
ul.wall-premiumchange li a::before{content: ''; width: 266px; height: 100%; background: url(../images/character/btn-haspremium-illust-active.png) center top no-repeat; position: absolute; left: 0; top: 0; transition:opacity 0.5s ,transform 0.5s; opacity: 0; transform: translate(0px, 0);}
ul.wall-premiumchange li:nth-child(2) a::before {background-image: url(../images/character/btn-haspremium-model-active.png);}
ul.wall-premiumchange li:nth-child(3) a::before {background-image: url(../images/character/btn-haspremium-premium-active.png);}
ul.wall-premiumchange li a.active::before {opacity: 1; transform: translate(0, 0);}
ul.wall-premiumchange li a img{transition:opacity 0.5s ,transform 0.5s; opacity: 1; transform: translate(0px, 0);}
ul.wall-premiumchange li a.active img {opacity: 0; transform: translate(0px, 0);}
ul.wall-premiumchange li a:hover {opacity: 0.7;}
ul.wall-premiumchange li a.active:hover{opacity: 1;}

/*
.wall-character .illust.change:after{height: 808px; width: 554px; margin-left: -78px; top: 148px;}
*/

/*.wall-character .zoom a:hover {transform: scale(1.1,1.1);}*/

main .wrap {z-index: 100; text-align: left; width: 600px; position: relative; left: -300px; opacity: 0; transition:opacity 0.8s;}
main .wrap.show {opacity: 1;}
main .wrap dl dd { display: inline-block; padding: 0 13px;}
main .wrap dl + dl {margin-top: 10px;}
main .wrap p {font-size: 17px; line-height: 35px; padding-left: 20px; margin-top: 30px; letter-spacing: 0.05em;}

main header {margin: 56px 0 0;}
main .wrap header p {font-size: 22px; line-height: 32px; color: #fff; text-shadow: 0px 1px 1px #8f5189, 1px 0px 1px #8f5189, 0px -1px 1px #8f5189, -1px 0px 1px #8f5189, 0px 0px 8px #8f5189, 0px 0px 8px #8f5189; margin-bottom: 10px; letter-spacing: 0.2em;}
main header { color: #991658; font-family:'Kozuka Mincho Pro', 'Kozuka Mincho Std', '小塚明朝 Pro R', '小塚明朝 Std R', 游明朝, YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E',  HG明朝E, 'HGS明朝E',  HGS明朝E, 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', 'MS PMincho', serif; letter-spacing: 0.26em; font-style: italic;}
main header h1{font-size: 51px; background: -webkit-linear-gradient(-90deg, rgba(182,17,89,1) 0%,rgba(80,36,84,1) 100%); -webkit-text-fill-color: transparent; -webkit-background-clip: text; line-height: 1; font-weight: bold; position: relative; margin-bottom: 58px; white-space: nowrap;}
main header h1:after{content: ''; background: url(../images/character/name.png) left top no-repeat; height: 129px; width: 689px; position: absolute; left:50%; top: -10px; margin-left: -423px;}

main .wrap {z-index: 1010;}
main .wrap dl {font-size: 15px; line-height: 25px; padding-left: 20px;}
main .wrap dl dt {color: #a15982; display: inline-block; font-family:'Kozuka Mincho Pro', 'Kozuka Mincho Std', '小塚明朝 Pro R', '小塚明朝 Std R', 游明朝, YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E',  HG明朝E, 'HGS明朝E',  HGS明朝E, 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', 'MS PMincho', serif;
background: #d4d3e2; /* Old browsers */
background: -moz-linear-gradient(left, #d4d3e2 0%, #efeeee 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #d4d3e2 0%,#efeeee 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #d4d3e2 0%,#efeeee 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4d3e2', endColorstr='#efeeee',GradientType=1 );
letter-spacing: 0.1em; padding: 0 10px; min-width: 57px; text-align: center;}

main .wrap dl.voice {font-size: 0; line-height: 1; margin-top: 36px;}
main .wrap dl.voice dt{background: none; line-height: 31px; padding: 0; min-width: inherit;}
main .wrap dl.voice dt img {height: 17px; width: auto; vertical-align: middle;}
main .wrap dl.voice dd img {height: 31px; width: auto; vertical-align: middle; transition: 0.3s;}
main .wrap dl.voice dd ul,
main .wrap dl.voice dd li {display: inline-block;}
main .wrap dl.voice dd li {padding-left: 10px;}
main .wrap dl.voice dd a.comment {display: inline-block; margin-left: 25px;}
main .wrap dl.voice dd a:hover img {opacity: 0.7;}


.swiper-container {width:360px; position: relative; opacity: 0; transition:opacity 0.5s; margin: 16px 0 0; overflow: hidden; padding-bottom: 68px;}
.windowloaded .swiper-container {opacity: 1;}
.swiper-wrapper {text-align: center; padding-bottom: 26px;}
.swiper-slide {
font-size: 0; line-height: 1;
width: 100%; height: auto;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.swiper-slide .item {display: block; position: relative; z-index: 10;}
.swiper-slide .item img {height: 205px; width: auto; transition: opacity 0.2s; opacity: 0; backface-visibility: hidden;}
.swiper-slide .item a{display: block; z-index: 10; width: 100%; height: 100%; position: absolute; left: 0; top: 0; opacity: 0;}
.swiper-slide .item a:hover + img {opacity: 0.7;}
.swiper-slide .item a:after{content: ''; width: 30px; height: 30px; background: url(../images/common/btn-zoom.png) center center no-repeat; background-size: 100% auto; z-index: 10; position: absolute ; left: 314px; top: 165px;}
.swiper-slide.swiper-slide-active .item img,
.swiper-slide.swiper-slide-active .item a{opacity: 1;}
.swiper-container nav { width: 100%; text-align: center; height: 37px; vertical-align: middle; display: block; padding: 0 0 ;}
.swiper-pagination {position: relative; margin: 0; transition: none; z-index: 100; display: inline-block; width: auto !important; vertical-align: top;}
.swiper-pagination-bullet {background: #e3bd47; width: 9px; height: 9px; margin: 0 3px; opacity: 1; cursor: pointer; vertical-align: top; transition: 0.3s; border-radius: 100%; padding: 0;}
.swiper-pagination-bullet.swiper-pagination-bullet-active{background: #a21558;}
.swiper-button-prev{background: url(../images/common/arr-left.png); width: 25px; height: 37px; position: static; display: inline-block; background-size: 100% auto; vertical-align: middle; margin-right: 17px; transition: 0.3s;}
.swiper-button-next{background: url(../images/common/arr-right.png); width: 25px; height: 37px; position: static; display: inline-block; background-size: 100% auto; vertical-align: middle; margin-left: 17px; transition: 0.3s;}
.swiper-pagination-bullet:hover,
.swiper-button-prev:hover,
.swiper-button-next:hover{opacity: 0.7;}

.pagearr {position:absolute; left: -107px; top: 50%; margin-top: -42px; z-index: 200; width: 60px; margin-left: 0; padding: 0; transition: 0.8s ease; opacity: 0; font-size: 0; line-height: 1;}
.pagearr a {display: block; width: 60px; height: 84px; background:url(../images/common/arr-left.png) left top no-repeat; transition:  0.3s; background-size: 100% auto; position: relative;}
.pagearr a:hover{opacity: 0.5;}
.pagearr.next {left: inherit; right: -107px; margin-left: inherit; margin-right: 0; text-align: right; padding: 0 0 0 0;}
.pagearr.next a{background: url(../images/common/arr-right.png) left top no-repeat; float: right; background-size: 100% auto;}
/*.windowloaded .pagearr {opacity: 1;}*/
.pagearr.show {opacity: 1; left: 7px;}
.pagearr.next.show {opacity: 1; left: inherit; right: 7px;}
.pagearr.end {opacity: 0;}






/* characterlist */
ul.characterlist {font-size: 0; line-height: 1;}
ul.characterlist li{display: inline-block; vertical-align: top; position: relative;}
ul.characterlist.sub {max-width: 1180px; padding-bottom: 150px; margin: 0 auto;}
ul.characterlist.sub li{ padding-right:10px;}
ul.characterlist.sub li:nth-child(6n) {padding-right:0;}
ul.characterlist.sub li:nth-child(n+7) {margin-top: 63px;}
ul.characterlist li a{transition: 0.5s; position: relative; display: block;}
ul.characterlist.sub li a:hover {opacity: 0.7;}
ul.characterlist li.new a::after{content: ''; width: 102px; height: 102px; background: url(../images/common/new.png) left top no-repeat; position: absolute; left: -17px; top: -29px; z-index: 100; background-size: 100% auto;}
ul.characterlist.sub li:nth-child(n+6).new a::after{top: -43px;}
ul.characterlist.main {position: relative; height: 826px; margin-top: 0; margin-bottom: 68px;}

/*
コーディング用
ul.characterlist.main::after{content: ''; background:url(../images/character/top/_characters.png) center top no-repeat; width: 1600px; height: 100%; position: absolute; left: 50%; top: 35px; margin-left: -800px; opacity: 0.3; filter: brightness(10%); z-index:10;}
*/

ul.characterlist.main li.new a::after{left: -28px; top: -30px; width: 87px; height: 87px;}
.characterlist-wrap {position: relative; top: -30px;}
.characterlist-wrap ul.main li a::before{content: ''; background: rgba(255,255,255,0); width: 120%; height:826px; position: absolute; left: -10%; top: 0; z-index: 10;}
.characterlist-wrap ul li{position: absolute; left: 50%; top: 0;}
.characterlist-wrap ul li:nth-child(1) {top: 568px; margin-left: -210px; z-index: 100;}
.characterlist-wrap ul li:nth-child(2) {top: 638px; margin-left: -36px; z-index: 200;}
.characterlist-wrap ul li:nth-child(3) {top: 604px; margin-left: -440px; z-index: 10;}
.characterlist-wrap ul li:nth-child(4) {top: 631px; margin-left: 410px; z-index: 10;}
.characterlist-wrap ul li:nth-child(5) {top: 587px; margin-left: 174px; z-index: 100;}
.characterlist-wrap ul li:nth-child(6) {top: 548px; margin-left: -642px; z-index: 5;}
.characterlist-wrap ul.main li:nth-child(1) a::before {top: -400px; height: 680px;}
.characterlist-wrap ul.main li:nth-child(2) a::before {top: -470px; height: 680px;}
.characterlist-wrap ul.main li:nth-child(3) a::before {top: -530px; height: 760px;}
.characterlist-wrap ul.main li:nth-child(4) a::before {top: -580px; height: 780px;}
.characterlist-wrap ul.main li:nth-child(5) a::before {top: -450px; height: 680px;}
.characterlist-wrap ul.main li:nth-child(6) a::before {top: -450px; height: 680px;}
.characterlist-wrap {position: relative; overflow: hidden; margin-top: -17px;}
.characterlist-wrap .characterlist-illust {position: absolute; left: 50%; top: 30px; margin-left: -924px; width: 1920px; z-index: -1; height: 856px;}
.characterlist-wrap ul li,
.characterlist-wrap ul li::before{transition: 0.4s ease; transition-timing-function:cubic-bezier(.58,-0.05,.47,.87);}
.characterlist-wrap .characterlist-illust li {transform: translate(-40px,0) scale(1,1); opacity: 1; /*filter: brightness(100%) blur(0);*/}
.characterlist-wrap .characterlist-illust li img {width: 1px; height: 1px; position: fixed; left: -7777px; top: 0;}
.characterlist-wrap .characterlist-illust li::before{content: ''; background: rgba(255,255,255,0); width: 0; height: 0; position: absolute; left: 0; top: 0; z-index: -1; overflow: hidden; border: 5px solid rgba(255,255,255,0);}
.characterlist-wrap .characterlist-illust li:nth-child(1)::before{background: url(../images/character/top/character01-illust.png) left top no-repeat; width: 480px; height: 681px; left: -161px; top: -430px;}
.characterlist-wrap .characterlist-illust li:nth-child(2)::before{background: url(../images/character/top/character02-illust.png) left top no-repeat; width: 532px; height: 697px; left: -108px; top: -509px;}
.characterlist-wrap .characterlist-illust li:nth-child(3)::before{background: url(../images/character/top/character03-illust.png) left top no-repeat; width: 626px; height: 801px; left: -235px; top: -583px;}
.characterlist-wrap .characterlist-illust li:nth-child(4)::before{background: url(../images/character/top/character04-illust.png) left top no-repeat; width: 754px; height: 815px; left: -383px; top: -630px;}
.characterlist-wrap .characterlist-illust li:nth-child(5)::before{background: url(../images/character/top/character05-illust.png) left top no-repeat; width: 623px; height: 708px; left: -206px; top: -506px;}
.characterlist-wrap .characterlist-illust li:nth-child(6)::before{background: url(../images/character/top/character06-illust.png) left top no-repeat; width: 337px; height: 586px; left: -60px; top: -377px;}
.characterlist-wrap .characterlist-illust li.hover {opacity: 0.7;}

/* 並び 6 3 1 2 5 4 */
.characterlist-wrap ul li img {transition: opacity 0.3s ease;}
/* リディー */
.characterlist-wrap.hover0 ul li:nth-child(1) {z-index: 300 !important;}
.characterlist-wrap.hover0 ul.characterlist-illust li:nth-child(1) {transform: scale(1.09,1.09) translate(-25px ,0px); transform-origin: center center;}
.characterlist-wrap.hover0 ul li:nth-child(6){transform: translate(-40px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover0 ul li:nth-child(3){transform: translate(-70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover0 ul li:nth-child(2){transform: translate(70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover0 ul li:nth-child(5){transform: translate(70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover0 ul li:nth-child(4){transform: translate(40px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover0 ul li img {opacity: 0;}
.characterlist-wrap.hover0 ul li:nth-child(1) img{opacity: 1;}
/* スール */
.characterlist-wrap.hover1 ul li:nth-child(2) {z-index: 200 !important;}
.characterlist-wrap.hover1 ul.characterlist-illust li:nth-child(2) {transform: scale(1.09,1.09) translate(-25px ,0px); transform-origin: center center;}
.characterlist-wrap.hover1 ul li:nth-child(6){transform: translate(-40px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover1 ul li:nth-child(3){transform: translate(-70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover1 ul li:nth-child(1){transform: translate(-70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover1 ul li:nth-child(5){transform: translate(70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover1 ul li:nth-child(4){transform: translate(40px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover1 ul li img {opacity: 0;}
.characterlist-wrap.hover1 ul li:nth-child(2) img{opacity: 1;}
/* ソフィー */
.characterlist-wrap.hover2 ul li:nth-child(3) {z-index: 200 !important;}
.characterlist-wrap.hover2 ul.characterlist-illust li:nth-child(3) {transform: scale(1.09,1.09) translate(-25px ,15px); transform-origin: center center;}
.characterlist-wrap.hover2 ul li:nth-child(6){transform: translate(-40px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover2 ul li:nth-child(1){transform: translate(70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover2 ul li:nth-child(2){transform: translate(70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover2 ul li:nth-child(5){transform: translate(70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover2 ul li:nth-child(4){transform: translate(40px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover2 ul li img {opacity: 0;}
.characterlist-wrap.hover2 ul li:nth-child(3) img{opacity: 1;}
/* マティアス */
.characterlist-wrap.hover3 ul li:nth-child(4) {z-index: 200 !important;}
.characterlist-wrap.hover3 ul.characterlist-illust li:nth-child(4) {transform: scale(1.09,1.09) translate(-40px ,20px); transform-origin: center center;}
.characterlist-wrap.hover3 ul li:nth-child(6){transform: translate(-40px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover3 ul li:nth-child(3){transform: translate(-70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover3 ul li:nth-child(1){transform: translate(-70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover3 ul li:nth-child(2){transform: translate(-70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover3 ul li:nth-child(5){transform: translate(-70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover3 ul li img {opacity: 0;}
.characterlist-wrap.hover3 ul li:nth-child(4) img{opacity: 1;}
/* フィリス */
.characterlist-wrap.hover4 ul li:nth-child(5) {z-index: 200 !important;}
.characterlist-wrap.hover4 ul.characterlist-illust li:nth-child(5) {transform: scale(1.09,1.09) translate(-25px ,0px); transform-origin: center bottom;}
.characterlist-wrap.hover4 ul li:nth-child(6){transform: translate(-40px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover4 ul li:nth-child(3){transform: translate(-70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover4 ul li:nth-child(1){transform: translate(-70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover4 ul li:nth-child(2){transform: translate(-70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover4 ul li:nth-child(4){transform: translate(40px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover4 ul li img {opacity: 0;}
.characterlist-wrap.hover4 ul li:nth-child(5) img{opacity: 1;}
/* アルト */
.characterlist-wrap.hover5 ul li:nth-child(6) {z-index: 200 !important;}
.characterlist-wrap.hover5 ul.characterlist-illust li:nth-child(6) {transform: scale(1.09,1.09) translate(0px ,0); transform-origin: center center;}
.characterlist-wrap.hover5 ul li:nth-child(3){transform: translate(70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover5 ul li:nth-child(1){transform: translate(70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover5 ul li:nth-child(2){transform: translate(70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover5 ul li:nth-child(5){transform: translate(70px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover5 ul li:nth-child(4){transform: translate(40px,0) scale(0.95,0.95); opacity: 0.55;/* filter: brightness(95%) blur(1px);*/}
.characterlist-wrap.hover5 ul li img {opacity: 0;}
.characterlist-wrap.hover5 ul li:nth-child(6) img{opacity: 1;}




/* cast modal */
.castmask {background: rgba(255,255,255,0.9); position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: -3000; opacity: 0; transition: 0.5s;}
.castmodal{width: 1000px; height: 460px; border: 1px solid #a74d83; background: #fff; position: fixed; left: 50%; top: -100%; margin: 0 0 0 -500px; z-index: 3010; text-align: left; padding-bottom: 50px; transition:opacity 0.3s,transform 0.8s ease; opacity: 0; transform:translate(0,-150%);}
.castmodalopen .castmask {opacity: 1; z-index: 3000;}
.castmodalopen .castmodal {opacity: 1; top: 0;; transform:translate(0,0);}
.castmodal::after{content: ''; background: url(../images/character/ornament-left.png) left top no-repeat; width: 176px; height: 120px; position: absolute; left: -18px; top: -14px;}
.castmodal::before{content: ''; background: url(../images/character/ornament-right.png) left top no-repeat; width: 206px; height: 140px; position: absolute; right: -17px; bottom: -17px;}
.castmodal .close{position: absolute; right: 0; top: 0; z-index: 100;}
.castmodal .close img {width: 40px; height: 40px; transition: 0.3s;}
.castmodal .close a:hover img {opacity: 0.7;}
.castmodal header {margin: 0 ; padding: 70px 0 39px;}
.castmodal header p {font-size: 39px; line-height: 1; color: #fff; text-shadow: 0px 1px 1px #8f5189, 1px 0px 1px #8f5189, 0px -1px 1px #8f5189, -1px 0px 1px #8f5189, 0px 0px 8px #8f5189, 0px 0px 8px #8f5189; margin-bottom: 10px; letter-spacing: 0.2em; padding-left: 270px;}
.castmodal header { color: #991658; font-family:'Kozuka Mincho Pro', 'Kozuka Mincho Std', '小塚明朝 Pro R', '小塚明朝 Std R', 游明朝, YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E',  HG明朝E, 'HGS明朝E',  HGS明朝E, 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', 'MS PMincho', serif; letter-spacing: 0.26em; font-style: italic ; position: relative;}
.castmodal header h2{font-size: 58px; background: -webkit-linear-gradient(-90deg, rgba(182,17,89,1) 0%,rgba(80,36,84,1) 100%); -webkit-text-fill-color: transparent; -webkit-background-clip: text; line-height: 1; font-weight: bold; position: relative; margin-bottom: 58px; white-space: nowrap; padding-left: 270px;}
.castmodal header h2:after{content: ''; background: url(../images/character/title-cast.png) left top no-repeat; height: 111px; width: 860px; position: absolute; left:50%; top: 0px; margin-left: -430px;}
.castmodal header figure {position: absolute; left: 70px; top: 63px;}
.castmodal article {overflow: hidden; width: 870px; margin: 0 60px 0 70px;}
.castmodal article .scroll{overflow: hidden; overflow-y: auto; height: 100%;}
.castmodal article h3 {font-size: 18px; line-height: 27px; min-height: 34px; color: #fff; background: url(../images/character/h3-cast.jpg) left bottom no-repeat #cb5a72; padding: 3px 13px 3px; margin-right: 10px;}
.castmodal article p {font-size: 15px; line-height: 26px; color: #444; padding-right: 10px; margin-right: 10px;}
.castmodal article h3 + p {margin-top: 15px;}
.castmodal article p + h3 {margin-top: 33px;}
.castmodal article .scroll::-webkit-scrollbar{width: 8px;	background: rgba(149,80,135,0.2);}
.castmodal article .scroll::-webkit-scrollbar-thumb{background: rgba(149,80,135,0.8);	border-radius: 8px;	border: 1px solid #fff;}

}

@media screen and (min-width:1401px){
.pagearr {left: -120px; width: 84px;}
.pagearr a {width: 84px; height: 127px;}
.pagearr.next {right: -120px;}
.pagearr.show {opacity: 1; left: 20px;}
.pagearr.next.show {opacity: 1; left: inherit; right: 20px;}
}

@media screen and (min-width:641px) and (max-width:1310px){
main .wrap {left: -260px;}
.wall-character {left: 40px;}
.wall-premium {left: 40px;}
ul.wall-premiumchange li a {left: 500px;}
.pagearr,
.pagearr a{width: 42px;}
}

@media screen and (min-width:1411px){p.wall-change {width: 700px; right: inherit; left: 50%; margin-left: 10px;}}
@media screen and (min-width:1920px){main {background-size: 100% auto;}}

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

/*

		SP site

*******************************************************************************************/


main .modal{margin-top:3.5rem;}
main .modal img{ width:78.125vw; height:12.8125vw!important; margin-left:6vw;}

#spnav ul li:nth-child(4) a:before {opacity: 1;}
#spnav ul li:nth-child(4) a:after {opacity: 0;}

main { color: #502555;}
main:before {content: ''; width: 100%; height: 100%; background: url(../images/character/sp/bg.jpg) center top no-repeat ; background-size: 100% auto; position: fixed; left: 0; top: 0; z-index: -1;}
main .pageheader {z-index: 1000;}

.pageheader p img{height: 1.15rem; display: block;}

/* premium　無し */
.wall-character {height: 100%; position: absolute; left: 0; top: 0; width: 100%; opacity: 0; transition:opacity 1s;}
.wall-character.show {opacity: 1;}
.wall-character div a {position: absolute; right: 0.7rem; top: 14.2rem; z-index: 100; opacity: 0; transition: 0.3s ease; transform: scale(0,0); transform-origin: left bottom; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}
.wall-character div a.show {transform: scale(1,1); top: 13.6rem; opacity: 1;}

.wall-character div a img {width: 5.35rem; height: auto;}
.wall-character div a:after{content: ''; background: url(../images/character/icon-plus.png) center center no-repeat; background-size: 100% auto; width: 100%; height: 100%; position: absolute; left: 0; top: -4px; opacity: 0; transition: 0.5s;}
.wall-character div a:before{content: ''; background: url(../images/character/icon-muinus.png) center center no-repeat; background-size: 100% auto; width: 100%; height: 100%; position: absolute; left: 0; top: -4px; transition: 0.5s; opacity: 1; z-index: 100;}

.wall-character .illust{position: absolute; width: 100%; height:100%; left: 0; margin-left: 0; transition: 0.5s; opacity: 1;}
.wall-character .illust:after{content: ''; background: url(../images/character/01/illust.png) center top no-repeat; width: 100%; height: 100%; position: absolute; left: 0%; top: 0; margin-left: 0px; opacity: 1; transition: 0.5s ease; background-size: 100% auto !important; transform: scale(2.02,2.02) translate(-2.7rem, 0.8rem); transform-origin: center top;}
.wall-character .model3d:after{content: ''; width: 100%; height: 100%; position: absolute; left: 0%; top: 0; margin-left: 0px; opacity: 0; transition: 0.5s ease; background-size: 100% auto !important; transform: scale(2.02,2.02) translate(-2.7rem, 0.8rem); transform-origin: center top;}

.wall-character .model3d{position: absolute; width: 100%; height:100%; left: 0; margin-left: 0; transition: 0.5s; transform: translate(5rem, 0); opacity: 0; z-index: -1;}
.wall-character .model3d:after{content: ''; background: url(../images/character/01/3dmodel.png) center top no-repeat; width: 100%; height: 100%; position: absolute; left: 0%; top: 0; margin-left: 0px; opacity: 1; transition: 0.5s ease; background-size: 100% auto; transform: scale(2.02,2.02) translate(-2.7rem, 0.8rem); transform-origin: center top;}
.wall-character .model3d:before{content: ''; width: 100%; height: 100%; position: absolute; left: 0%; top: 0; margin-left: 0px; opacity: 0; transition: 0.5s ease; background-size: 100% auto; transform: scale(2.02,2.02) translate(-2.7rem, 0.8rem); transform-origin: center top;}

.wall-character .illust:after{ transition: 0.5s ease, opacity 0.1s;}
.wall-character .illust.zoom:after{ transition: 0.5s ease ;}
.wall-character .model3d:after{ transition: 0.5s ease , opacity 0.1s;}
.wall-character .model3d.zoom:after{ transition: 0.5s ease ;}

.wall-character.model .model3d {opacity: 1; transform: translate(0px, 0); z-index: 100;}
.wall-character.model .illust {opacity: 0; transform: translate(-5rem, 0); z-index: 0;}

/*
.wall-character .illust.change:after{height: 808px; width: 554px; margin-left: -78px; top: 148px;}
*/
.wall-character .zoom:after{transform: scale(1,1) translate(-2rem, 4rem);}
.wall-character .zoom a:after{opacity: 1;}
.wall-character .zoom a:before{opacity: 0;}

p.wall-change {position: absolute; z-index: 1000; right: 0; top: 	39.3rem; width: 100%; opacity: 0; transition:opacity 0.8s, top 0.8s; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}
p.wall-change.show {opacity: 1; top: 37.3rem;}
p.wall-change a{display: inline-block; position: relative; transition: 0.3s;}
p.wall-change a img {width: 11.15rem; height: auto;}
p.wall-change a:after{content: ''; background: url(../images/character/btn-illust.png) left top no-repeat; width: 100%; height: 100%; position: absolute; left: 0; top: 0; transition: 0.5s; opacity: 0; background-size: 100% auto;}
p.wall-change a:before{content: ''; background: url(../images/character/btn-model3d.png) left top no-repeat; width: 100%; height: 100%; position: absolute; left: 0; top: 0; transition: 0.5s; z-index: 10; background-size: 100% auto;}
p.wall-change a.model:after{opacity: 1;}
p.wall-change a.model:before{opacity: 0;}

/* premium　あり */
.wall-premium {height: 100%; position: absolute; left: 0; top: 0; width: 100%; opacity: 0; transition:opacity 1s;}
.wall-premium.show {opacity: 1;}
.wall-premium div a {position: absolute; right: 0.7rem; top: 14.2rem; z-index: 100; opacity: 0; transition: 0.3s ease; transform: scale(0,0); transform-origin: left bottom; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);}
.wall-premium div a.show {transform: scale(1,1); top: 13.6rem; opacity: 1;}

.wall-premium div a img {width: 5.35rem; height: auto;}
.wall-premium div a:after{content: ''; background: url(../images/character/icon-plus.png) center center no-repeat; background-size: 100% auto; width: 100%; height: 100%; position: absolute; left: 0; top: -4px; opacity: 0; transition: 0.5s;}
.wall-premium div a:before{content: ''; background: url(../images/character/icon-muinus.png) center center no-repeat; background-size: 100% auto; width: 100%; height: 100%; position: absolute; left: 0; top: -4px; transition: 0.5s; opacity: 1; z-index: 100;}

.wall-premium .illust{position: absolute; width: 100%; height:100%; left: 0; margin-left: 0; transition: 0.5s; opacity: 0; transform: translate(5rem, 0);}
.wall-premium .illust:after{content: ''; background: url(../images/character/01/illust.png) center top no-repeat; width: 100%; height: 100%; position: absolute; left: 0%; top: 0; margin-left: 0px; opacity: 1; transition: 0.5s ease; background-size: 100% auto !important; transform: scale(2.1,2.1) translate(-2.02rem, 0.58rem); transform-origin: center top;}
.wall-premium .model3d:after{content: ''; width: 100%; height: 100%; position: absolute; left: 0%; top: 0; margin-left: 0px; opacity: 0; transition: 0.5s ease; background-size: 100% auto !important; transform: scale(2.02,2.02) translate(-2.7rem, 0.8rem); transform-origin: center top;}

.wall-premium .model3d{position: absolute; width: 100%; height:100%; left: 0; margin-left: 0; transition: 0.5s; transform: translate(5rem, 0); opacity: 0; z-index: -1;}
.wall-premium .model3d:after{content: ''; background: url(../images/character/01/3dmodel.png) center top no-repeat; width: 100%; height: 100%; position: absolute; left: 0%; top: 0; margin-left: 0px; opacity: 1; transition: 0.5s ease; background-size: 100% auto; transform: scale(2.1,2.1) translate(-2.02rem, 0.58rem); transform-origin: center top;}
.wall-premium .model3d:before{content: ''; width: 100%; height: 100%; position: absolute; left: 0%; top: 0; margin-left: 0px; opacity: 0; transition: 0.5s ease; background-size: 100% auto; transform: scale(2.02,2.02) translate(-2.7rem, 0.8rem); transform-origin: center top;}

.wall-premium .premium{position: absolute; width: 100%; height:100%; left: 0; margin-left: 0; transition: 0.5s; opacity: 1;}
.wall-premium .premium:after{content: ''; background: url(../images/character/01/premium.png) center top no-repeat; width: 100%; height: 100%; position: absolute; left: 0%; top: 0; margin-left: 0px; opacity: 1; transition: 0.5s ease; background-size: 100% auto; transform: scale(2.1,2.1) translate(-2.02rem, 0.58rem); transform-origin: center top;}
.wall-premium .premium:before{content: ''; width: 100%; height: 100%; position: absolute; left: 0%; top: 0; margin-left: 0px; opacity: 0; transition: 0.5s ease; background-size: 100% auto; transform: scale(2.02,2.02) translate(-2.7rem, 0.8rem); transform-origin: center top;}

.wall-premium .illust:after{ transition: 0.5s ease, opacity 0.1s;}
.wall-premium .illust.zoom:after{ transition: 0.5s ease ;}
.wall-premium .model3d:after{ transition: 0.5s ease , opacity 0.1s;}
.wall-premium .model3d.zoom:after{ transition: 0.5s ease ;}
.wall-premium .premium:after{ transition: 0.5s ease , opacity 0.1s;}
.wall-premium .premium.zoom:after{ transition: 0.5s ease ;}

.wall-premium .illust:before{ transition: 0.5s ease;}
.wall-premium .illust.zoom:before{ transition: 0.5s ease , opacity 0.1s;}
.wall-premium .model3d:before{ transition: 0.5s ease ;}
.wall-premium .model3d.zoom:before{ transition: 0.5s ease , opacity 0.1s;}
.wall-premium .premium:before{ transition: 0.5s ease ;}
.wall-premium .premium.zoom:before{ transition: 0.5s ease , opacity 0.1s;}

.wall-premium.change-model .model3d {opacity: 1; transform: translate(0px, 0); z-index: 100;}
.wall-premium.change-model .illust {opacity: 0; transform: translate(5rem, 0); z-index: 0;}
.wall-premium.change-model .premium {opacity: 0; transform: translate(5rem, 0); z-index: 0;}
.wall-premium.change-illust .model3d {opacity: 0; transform: translate(5rem, 0); z-index: 0;}
.wall-premium.change-illust .illust {opacity: 1; transform: translate(0px, 0); z-index: 100;}
.wall-premium.change-illust .premium {opacity: 0; transform: translate(5rem, 0); z-index: 0;}
.wall-premium.change-premium .model3d {opacity: 0; transform: translate(5rem, 0); z-index: 0;}
.wall-premium.change-premium .illust {opacity: 0; transform: translate(5rem, 0); z-index: 0;}
.wall-premium.change-premium .premium {opacity: 1; transform: translate(0px, 0); z-index: 100;}

.wall-premium .zoom:after{transform: scale(1,1) translate(-2rem, 4rem);}
.wall-premium .zoom a:after{opacity: 1;}
.wall-premium .zoom a:before{opacity: 0;}


ul.wall-premiumchange {position: absolute; z-index: 1000; right: 0; top: 	39.3rem; width: 100%; opacity: 0; transition:opacity 0.8s, top 0.8s; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); font-size: 0; line-height: 1;}
ul.wall-premiumchange.show {opacity: 1; top: 37.3rem;}
ul.wall-premiumchange li {display: inline-block; vertical-align: top; padding: 0 0.25rem;}
ul.wall-premiumchange li img{width: 9.35rem; height: 4.6rem; opacity: 0;}
ul.wall-premiumchange li a {display: block; position: relative;}
ul.wall-premiumchange li a::after,
ul.wall-premiumchange li a::before {content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-position: center top; background-repeat: no-repeat; background-size: 100% auto; transition: 0.3s;}
ul.wall-premiumchange li a::after {background-image: url(../images/character/btn-haspremium-illust-sp.png);}
ul.wall-premiumchange li a::before {background-image: url(../images/character/btn-haspremium-illust-active-sp.png); z-index: 100; opacity: 0;}
ul.wall-premiumchange li:nth-child(2) a::after {background-image: url(../images/character/btn-haspremium-model-sp.png);}
ul.wall-premiumchange li:nth-child(2) a::before {background-image: url(../images/character/btn-haspremium-model-active-sp.png); z-index: 100; opacity: 0;}
ul.wall-premiumchange li:nth-child(3) a::after {background-image: url(../images/character/btn-haspremium-premium-sp.png);}
ul.wall-premiumchange li:nth-child(3) a::before {background-image: url(../images/character/btn-haspremium-premium-active-sp.png); z-index: 100; opacity: 0;}
ul.wall-premiumchange li a.active::before{opacity: 1;}
ul.wall-premiumchange li a.active::after{opacity: 0;}

main .wrap { margin: 39.5rem 0 0; z-index: 100; text-align: left;}
main .wrap:before{content: ''; background: url(../images/character/sp/mask.png) left top repeat-x; width: 100%; height: 300%; position: absolute; left: 0; top: -10rem; z-index: -1;}

main .wrap dl dd { display: inline-block; padding: 0 0.7rem;}
main .wrap dl + dl {margin-top: 0.65rem;}
main .wrap p {font-size: 1.1rem; line-height: 2.1rem; padding:0 1.5rem; margin-top: 1.75rem; letter-spacing: 0.05em;}

main .wrap header {text-align: center;}
main .wrap header p {font-size: 1.32rem; line-height: 2; color: #fff; text-shadow: 0px 1px 1px #8f5189, 1px 0px 1px #8f5189, 0px -1px 1px #8f5189, -1px 0px 1px #8f5189, 0px 0px 8px #8f5189, 0px 0px 8px #8f5189; margin-bottom: 0.8rem; letter-spacing: 0.1em;}
main .wrap header { color: #991658; font-family:'Kozuka Mincho Pro', 'Kozuka Mincho Std', '小塚明朝 Pro R', '小塚明朝 Std R', 游明朝, YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E',  HG明朝E, 'HGS明朝E',  HGS明朝E, 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', 'MS PMincho', serif; letter-spacing: 0; font-style: italic;}
main .wrap header h1{font-size:3rem; background: -webkit-linear-gradient(-90deg, rgba(182,17,89,1) 0%,rgba(80,36,84,1) 100%); -webkit-text-fill-color: transparent; -webkit-background-clip: text; line-height: 1; font-weight: bold; position: relative; margin-bottom: 3.75rem;}
main .wrap header h1:after{content: ''; background: url(../images/character/sp/name.png) left top no-repeat; height: 7.8rem; width: 100%; position: absolute; left:0; top: -0.6rem; background-size: 100% auto;}


main .wrap dl {font-size: 0.9rem; line-height: 1.75rem; padding-left: 1.9rem;}
main .wrap dl dt {color: #a15982; display: inline-block; font-family:'Kozuka Mincho Pro', 'Kozuka Mincho Std', '小塚明朝 Pro R', '小塚明朝 Std R', 游明朝, YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E',  HG明朝E, 'HGS明朝E',  HGS明朝E, 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', 'MS PMincho', serif;
background: #d4d3e2; /* Old browsers */
background: -moz-linear-gradient(left, #d4d3e2 0%, #efeeee 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #d4d3e2 0%,#efeeee 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #d4d3e2 0%,#efeeee 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4d3e2', endColorstr='#efeeee',GradientType=1 );
letter-spacing: 0.1em; padding: 0 0.7rem; min-width: 3.2rem; text-align: center;}

main .wrap dl.voice {font-size: 0; line-height: 1; margin-top: 1.8rem; padding-left: 1.5rem}
main .wrap dl.voice dt{background: none; line-height: 2.15rem; padding: 0 0.3rem 0 0; min-width: inherit;}
main .wrap dl.voice dt img {height: 1.1rem; width: auto; vertical-align: middle;}
main .wrap dl.voice dd {padding: 0;}
main .wrap dl.voice dd img {height: 2.15rem; width: auto; vertical-align: middle;}
main .wrap dl.voice dd ul,
main .wrap dl.voice dd li {display: inline-block;}
main .wrap dl.voice dd li {padding-left: 0.7rem;}
main .wrap dl.voice dd a.comment {display: inline-block; margin-left: 1.75rem;}


.swiper-container {width:100%; position: relative; opacity: 0; transition: 0.5s; margin: 2rem 0 0; padding-bottom: 3.3rem;}
.windowloaded .swiper-container {opacity: 1;}
.swiper-wrapper {text-align: center; padding-bottom: 2.6rem;}
.swiper-slide {
font-size: 0; line-height: 1;
width: 100%; height: auto;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.swiper-slide .item {display: block; position: relative; z-index: 10;}
.swiper-slide .item img {height: auto; width:100%;}
.swiper-slide .item a{position: relative; display: block; z-index: 10;}
.swiper-container nav { width: 100%; text-align: center; height: 3.7rem; vertical-align: middle; display: block; padding: 0;}
.swiper-pagination {position: relative; margin: 0; transition: none; z-index: 100; display: inline-block; width: auto !important; vertical-align: top;}
.swiper-pagination-bullet {background: #e3bd47; width: 0.8rem; height: 0.8rem; margin: 0 0.35rem; opacity: 1; cursor: pointer; vertical-align: top;}
.swiper-pagination-bullet.swiper-pagination-bullet-active{background: #a21558;}
.swiper-button-prev{background: url(../images/common/arr-left.png); width: 2.4rem; height: 3.7rem; position: static; display: inline-block; background-size: 100% auto; vertical-align: middle; margin-right: 1.4rem;}
.swiper-button-next{background: url(../images/common/arr-right.png); width: 2.4rem; height: 3.7rem; position: static; display: inline-block; background-size: 100% auto; vertical-align: middle; margin-left: 1.4rem;}

.pagearr {position:absolute; left: -4rem; top: 37.6rem; z-index: 1200; width: 3.4rem; transition: 0.8s ease; opacity: 0; font-size: 0; line-height: 1;}
.pagearr.haspremium {top: 30.95rem;}
.pagearr a {display: block; width: 3.4rem; height: 5.4rem; background:url(../images/common/arr-left.png) left top no-repeat; transition:  0.3s; background-size: 100% auto;}
.pagearr.next {left: inherit; right: -4rem; margin-left: inherit; margin-right: 0; text-align: right;}
.pagearr.next a{background: url(../images/common/arr-right.png) left top no-repeat; float: right; background-size: 100% auto;}
/*.windowloaded .pagearr {opacity: 1;}*/
.pagearr.show {opacity: 1; left: 1rem;}
.pagearr.next.show {opacity: 1; left: inherit; right: 1rem;}

/* characterlist */
ul.characterlist {font-size: 0; line-height: 1;}
ul.characterlist li{display: inline-block; vertical-align: top; position: relative;}
ul.characterlist.main {margin: 4rem 0 0;}
ul.characterlist.main li {margin: 0 0.45rem; position: relative; left: -0.1rem;}
ul.characterlist.main li:nth-child(even) {left: -0.2rem;}
ul.characterlist.main li img {width: 12.45rem;}
ul.characterlist.main li:nth-child(n+3) {margin-top: 2.7rem;}
ul.characterlist.sub {padding: 5.5rem 0 5.7rem;}
ul.characterlist.sub li img {width: 9.4rem;}
ul.characterlist.sub li {margin: 0 0.35rem;}
ul.characterlist.sub li:nth-child(n+4) {margin-top: 1.6rem;}

/* イレギュラー配置
ul.characterlist.sub li:nth-child(4) {padding-left: 1.8rem;}
ul.characterlist.sub li:nth-child(5) {padding-right: 1.8rem;} */

ul.characterlist li.new a{position: relative; display: block;}
ul.characterlist li.new a:after{content: ''; width: 5.1rem; height: 5.1rem; background: url(../images/common/new.png) left top no-repeat; position: absolute; left: -0.8rem; top: -0.7rem; z-index: 10; background-size: 100% auto;}
ul.characterlist.sub li.new a:after{left:-0.6rem; top: -1.2rem;}



/* cast modal */
.castmask {background: rgba(255,255,255,0.9); position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: -3000; opacity: 0; transition: 0.5s;}
.castmodal{width: 100%; height: 460px; border: 1px solid #a74d83; background: #fff; position: fixed; left: 0; top: -100%; margin: 0; z-index: 5010; text-align: left; transition:opacity 0.3s,transform 0.8s ease; opacity: 0; transform:translate(0,-150%);}
.castmodalopen .castmask {opacity: 1; z-index: 5000;}
.castmodalopen .castmodal {opacity: 1; top: 0;; transform:translate(0,0);}
.castmodal .close{position: absolute; right: 0; top: 0; z-index: 100;}
.castmodal .close img {width: 3rem; height: 3rem;}
.castmodal header {margin: 0 ; padding: 3rem 0 2rem;}
.castmodal header p {font-size: 1.8rem; line-height: 1; color: #fff; text-shadow: 0px 1px 1px #8f5189, 1px 0px 1px #8f5189, 0px -1px 1px #8f5189, -1px 0px 1px #8f5189, 0px 0px 8px #8f5189, 0px 0px 8px #8f5189; letter-spacing: 0.2em; padding: 0.6rem 0 0.6rem 11.5rem;}
.castmodal header { color: #991658; font-family:'Kozuka Mincho Pro', 'Kozuka Mincho Std', '小塚明朝 Pro R', '小塚明朝 Std R', 游明朝, YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E',  HG明朝E, 'HGS明朝E',  HGS明朝E, 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', 'MS PMincho', serif; letter-spacing: 0.26em; font-style: italic ; position: relative;}
.castmodal header h2{font-size: 2.7rem; background: -webkit-linear-gradient(-90deg, rgba(182,17,89,1) 0%,rgba(80,36,84,1) 100%); -webkit-text-fill-color: transparent; -webkit-background-clip: text; line-height: 1; font-weight: bold; position: relative; margin-bottom: 3.8rem; white-space: nowrap; padding-left: 11.5rem;;}
.castmodal header h2:after{content: ''; background: url(../images/character/title-cast-sp.png) left top no-repeat; height: 5.6rem; width: 100%; position: absolute; left:0%; top: 0px; margin-left: 0; background-size: 100% auto;}
.castmodal header figure {position: absolute; left: 1.5rem; top: 3rem;}
.castmodal header figure img {width: 9.2rem; height: auto;}
.castmodal article {overflow: hidden; width: 100%; padding: 0 1rem 0 1.5rem;}
.castmodal article .scroll{overflow: hidden; overflow-y: auto; height: 100%; /*-webkit-overflow-scrolling: touch; -webkit-transform: translateZ(0px);*/}
.castmodal article h3 {font-size: 1.2rem; line-height: 1.7rem; min-height: 1.7rem; color: #fff; background: url(../images/character/h3-cast-sp.jpg) left bottom no-repeat #cb5a72; padding: 0.1rem 0.5rem 0.1rem; background-size: 100% auto; margin-right: 0.5rem;}
.castmodal article p {font-size: 1rem; line-height: 1.8rem; color: #444; padding:0 0.3rem; margin-right: 0.5rem;}
.castmodal article h3 + p {margin-top: 0.8rem;}
.castmodal article p + h3 {margin-top: 1.6rem}
.castmodal article .scroll::-webkit-scrollbar{width: 0.5rem;background: rgba(149,80,135,0.2);}
.castmodal article .scroll::-webkit-scrollbar-thumb{background: rgba(149,80,135,0.8);border-radius: 0.5rem;	border: 1px solid #fff;}

}
/* bugfix */
.ie .castmodal header,
.android .castmodal header,
.android main header,
.android main .wrap dl dt ,
.ie main .wrap dl dt,
.ie main header {font-family: 'Noto Serif Japanese', serif;}







/*
	リディー
*/
@media screen and (min-width:641px){
}
@media screen and (max-width:640px){
.character01 .wall-premium .premium:after{background-image: url(../images/character/01/premium.png); transform: scale(2.1,2.1) translate(-0.6rem, 1.8rem);}
.character01 .wall-premium .premium.zoom:after{transform: scale(1,1) translate(-1.6rem, 4rem);}
}

/*
	スール・マーレン
*/
@media screen and (min-width:641px){
.character02 .wall-character .illust:after{background: url(../images/character/02/illust.png); width: 1366px; height: 2011px; top:34px; margin-left: 114px;}
.character02 .wall-character .model3d:after{background: url(../images/character/02/3dmodel.png); width: 1366px; height: 2011px;  top: 34px; margin-left: 114px;}
.character02 .wall-character .zoom:after{transform: scale(0.44,0.44) translate(-140px, 210px); transform-origin: center top;}
.character02 .wall-premium .illust:after{background: url(../images/character/02/illust.png); width: 1366px; height: 2011px; top:34px; margin-left: 114px;}
.character02 .wall-premium .premium:after{background: url(../images/character/02/premium.png); width: 1366px; height: 2011px; top:34px; margin-left: 114px;}
.character02 .wall-premium .model3d:after{background: url(../images/character/02/3dmodel.png); width: 1366px; height: 2011px;  top: 34px; margin-left: 114px;}
.character02 .wall-premium .zoom:after{transform: scale(0.44,0.44) translate(-140px, 210px); transform-origin: center top;}

}
@media screen and (max-width:640px){
.character02 .wall-character .illust:after{background-image: url(../images/character/02/illust.png); transform: scale(2.13,2.13) translate(1.5rem, 0.5rem);}
.character02 .wall-character .model3d:after{background-image: url(../images/character/02/3dmodel.png); transform: scale(2.13,2.13) translate(2.1rem, 0.8rem);}
.character02 .wall-character .zoom:after{transform: scale(1,1) translate(1rem, 4rem);}

.character02 .wall-premium .illust:after{background-image: url(../images/character/02/illust.png); transform: scale(2.13,2.13) translate(1.5rem, 0.5rem);}
.character02 .wall-premium .model3d:after{background-image: url(../images/character/02/3dmodel.png); transform: scale(2.13,2.13) translate(2.1rem, 0.8rem);}
.character02 .wall-premium .premium:after{background-image: url(../images/character/02/premium.png); transform: scale(2.13,2.13) translate(2.6rem, 0.8rem);}
.character02 .wall-premium .zoom:after{transform: scale(1,1) translate(1rem, 4rem);}
.character02 .wall-premium .premium.zoom:after{transform: scale(1,1) translate(2.6rem, 4rem);}

}

/*
	マティアス・フェリエ・アダレット
*/
@media screen and (min-width:641px){
main.character03 .wrap header {letter-spacing: -0.2em; font-size: 48px;}
main.character03 .wrap header h1 {width: 900px;}
main.character03 .wrap header h1:after{margin-left: -573px;}
.character03 .wall-character .illust:after{background: url(../images/character/04/illust.png); width: 2491px; height: 2384px; top:107px; margin-left: -976px;}
.character03 .wall-character .model3d:after{background: url(../images/character/04/3dmodel.png); width: 2491px; height: 2384px;  top: 107px; margin-left: -976px;}
.character03 .wall-character .illust.zoom:after,
.character03 .wall-character .illust.zoom:before{transform: scale(0.376,0.376) translate(700px, 28px); transform-origin: center top;}
.character03 .wall-character .model3d.zoom:after,
.character03 .wall-character .model3d.zoom:before{transform: scale(0.351,0.351) translate(776px, 96px); transform-origin: center top;}
.character03 .wall-character .model3d:before{background: url(../images/character/04/3dmodel-full.png); width: 2491px; height: 2384px;  top: 107px; margin-left: -976px; }
.character03 .wall-character .model3d.zoom:before {opacity: 1;}
.character03 .wall-character .model3d.zoom:after {opacity: 0;}
}
@media screen and (max-width:640px){
main.character03 .wrap {margin-top: 40.5rem;}
main.character03 .wrap header h1{font-size:2.0rem; letter-spacing: -0.1em; margin-bottom: 3.55rem;}
main.character03 .wrap header h1:after{background-image: url(../images/character/04/h1-line.png); top: -1.8rem;}
main.character03 .wrap header p {margin-bottom: 0.3rem;}
.character03 .wall-character .illust:after{background-image: url(../images/character/04/illust.png); transform: scale(3.9,3.9) translate(1.5rem,1.2rem); margin-left: -29.2rem;}
.character03 .wall-character .model3d:after{background-image: url(../images/character/04/3dmodel-full.png); transform: scale(3.9,3.9) translate(1.5rem,1.2rem); margin-left: -29.2rem;}
.character03 .wall-character .zoom:after{transform: scale(1.8,1.8) translate(10.3rem, 2.6rem);}
}
/*
	ソフィー・ノイエンミュラー
*/
@media screen and (min-width:641px){
main.character04 .wrap header {letter-spacing: -0.1em; font-size: 45px;}
main.character04 .wrap header h1 {width: 900px;}
main.character04 .wrap header h1:after{margin-left: -573px;}
.character04 .wall-character .illust:after{background: url(../images/character/03/illust.png); width: 2237px; height: 2108px; top:19px; margin-left: -340px;}
.character04 .wall-character .model3d:after{background: url(../images/character/03/3dmodel.png); width: 2237px; height: 2108px;  top: 19px; margin-left: -340px;}
.character04 .wall-character .illust.zoom:after,
.character04 .wall-character .illust.zoom:before{transform: scale(0.43,0.43) translate(-70px, 168px); transform-origin: center top;}
.character04 .wall-character .model3d.zoom:after,
.character04 .wall-character .model3d.zoom:before{transform: scale(0.43,0.43) translate(-190px, 160px); transform-origin: center top;}
.character04 .wall-character .model3d:before{background: url(../images/character/03/3dmodel-full.png); width: 2237px; height: 2108px;  top: 19px; margin-left: -340px;}
.character04 .wall-character .model3d.zoom:before {opacity: 1;}
.character04 .wall-character .model3d.zoom:after {opacity: 0;}
.character04 .wall-character .illust:before{background: url(../images/character/03/illust-full.png); width: 2237px; height: 2108px;  top: 19px; margin-left: -340px;}
.character04 .wall-character .illust.zoom:before {opacity: 1;}
.character04 .wall-character .illust.zoom:after {opacity: 0;}
}
@media screen and (max-width:640px){
main.character04 .wrap {margin-top: 40.5rem;}
main.character04 .wrap header h1{font-size:2.0rem; letter-spacing: -0.1em; margin-bottom: 3.55rem;}
main.character04 .wrap header h1:after{background-image: url(../images/character/03/h1-line.png); top: -1.8rem;}
main.character04 .wrap header p {margin-bottom: 0.3rem;}
.character04 .wall-character .illust:after{background-image: url(../images/character/03/illust-full.png); transform: scale(3.5,3.5) translate(1.0rem,-0.3rem);}
.character04 .wall-character .model3d:after{background-image: url(../images/character/03/3dmodel-sp.png); transform: scale(3.5,3.5) translate(1.0rem,-0.3rem);}
.character04 .wall-character .zoom:after{transform: scale(1.355,1.355) translate(.3rem, 3.5rem);}
}
/*
	フィリス・ミストルート
*/
@media screen and (min-width:641px){
main.character05 .wrap header {letter-spacing: -0.1em; font-size: 45px;}
main.character05 .wrap header h1 {width: 900px;}
main.character05 .wrap header h1:after{margin-left: -573px;}
.character05 .wall-character .illust:after{background: url(../images/character/05/illust.png); width: 2013px; height: 2372px; top:-139px; margin-left: -536px;}
.character05 .wall-character .model3d:after{background: url(../images/character/05/3dmodel.png); width: 2013px; height: 2372px; top:-139px; margin-left: -536px;}
.character05 .wall-character .illust.zoom:after,
.character05 .wall-character .illust.zoom:before{transform: scale(0.40408899579,0.40408899579) translate(476px, 500px); transform-origin: center top;}
.character05 .wall-character .model3d.zoom:after,
.character05 .wall-character .model3d.zoom:before{transform: scale(0.40408899579,0.40408899579) translate(266px, 606px); transform-origin: center top;}
.character05 .wall-character .model3d:before{background: url(../images/character/05/3dmodel-full.png); width: 2013px; height: 2372px; top:-139px; margin-left: -536px;}
.character05 .wall-character .model3d.zoom:before {opacity: 1;}
.character05 .wall-character .model3d.zoom:after {opacity: 0;}
.character05 .wall-character .illust:before{background: url(../images/character/05/illust-full.png); width: 2013px; height: 2372px; top:-139px; margin-left: -536px;}
.character05 .wall-character .illust.zoom:before {opacity: 1;}
.character05 .wall-character .illust.zoom:after {opacity: 0;}
}
@media screen and (max-width:640px){
main.character05 .wrap {margin-top: 40.5rem;}
main.character05 .wrap header h1{font-size:2.4rem; margin-bottom: 4.7rem;}
.character05 .wall-character .illust:after{background-image: url(../images/character/05/illust-full.png); transform: scale(2.88,2.88) translate(1.6rem,-2.4rem); margin-left: -14.2rem;}
.character05 .wall-character .model3d:after{background-image: url(../images/character/05/3dmodel-full.png); transform: scale(2.88,2.88) translate(1.6rem,-2.4rem); margin-left: -14.2rem;}
.character05 .wall-character .zoom:after{transform: scale(1.255,1.255) translate(8.3rem, 1.6rem);}

}
/*
	アルト
*/
@media screen and (min-width:641px){
main.character06 .wrap header h1 {padding-left: 10px;}
.character06 .wall-character .illust:after{background: url(../images/character/06/illust.png); width: 2013px; height: 2372px; top:-139px; margin-left: -536px;}
.character06 .wall-character .model3d:after{background: url(../images/character/06/3dmodel.png); width: 2013px; height: 2536px; top:-139px; margin-left: -536px;}
.character06 .wall-character .illust.zoom:after,
.character06 .wall-character .illust.zoom:before{transform: scale(0.48,0.48) translate(306px, 350px); transform-origin: center top;}
.character06 .wall-character .model3d.zoom:after,
.character06 .wall-character .model3d.zoom:before{transform: scale(0.38,0.38) translate(306px, 496px); transform-origin: center top;}
.character06 .wall-character .model3d:before{background: url(../images/character/06/3dmodel-full.png); width: 2013px; height: 2536px; top:-139px; margin-left: -536px;}
.character06 .wall-character .model3d.zoom:before {opacity: 1;}
.character06 .wall-character .model3d.zoom:after {opacity: 0;}
.character06 .wall-character .illust:before{background: url(../images/character/06/illust-full.png); width: 2013px; height: 2372px; top:-139px; margin-left: -536px;}
.character06 .wall-character .illust.zoom:before {opacity: 1;}
.character06 .wall-character .illust.zoom:after {opacity: 0;}
}
@media screen and (max-width:640px){
main.character06 .wrap {margin-top: 40.5rem;}
main.character06 .wrap header h1{font-size:2.4rem; margin-bottom: 4.7rem;}
.character06 .wall-character .illust:after{background-image: url(../images/character/06/illust-full.png); transform: scale(2.88,2.88) translate(1.6rem,-2.4rem); margin-left: -14.2rem;}
.character06 .wall-character .model3d:after{background-image: url(../images/character/06/3dmodel-full.png); transform: scale(2.88,2.88) translate(1.6rem,-2.4rem); margin-left: -14.2rem;}
.character06 .wall-character .zoom:after{transform: scale(1.255,1.255) translate(8.3rem, 1.6rem);}

}