@charset "utf-8";
::selection {
background: #000;
color: #fff;
}
::-moz-selection {
background: #000;
color:#fff;
}
* {
outline:none;
}
body {
font-family: sans-serif;
font-weight: 600;
font-size: 24px;
color: #000;
background-color: #fff340;
}
a { color: #000; }
.pc {display:none;}
#fullWrap {
min-width:750px;
overflow:hidden;
}
.index__fullWrap,
.sub__fullWrap {
position:relative;
}
.index__fullWrap:before {
background:#e5006a;
content:'';
height:calc(100% - 650px);
left:0;
position: absolute;
top:0;
width:50%;
}
.index__fullWrap:after {
background:#000;
content:'';
height: calc(100% - 650px);
left:50%;
position: absolute;
right:0;
top:0;
}
.sub__fullWrap:before {
background:#000;
height:calc(100% - 650px);
content:'';
left:0;
position: absolute;
top:0;
width:550px;
}
.sub__fullWrap:after {
background:#e5006a;
height: calc(100% - 650px);
content:'';
left:550px;
position: absolute;
right:0;
top:0;
}
.index__header,
.sub__header {
height:130px;
width:750px;
position: relative;
z-index:500;
}
.index__header--inner,
.sub__header--inner {
height:130px;
position: relative;
}
.index__header--logo {
background: url(../img/sub_logo.png) no-repeat center center / contain;
height:70px;
left:50%;
margin-left:-135px;
margin-top: -35px;
position: absolute;
top:50%;
width:270px;
}
.index__header--logo a {
display: block;
height:70px;
}
.sub__logo {
height:78px;
left:174px;
position: absolute;
top:28px;
width: 298px;
z-index:6;
}
.sub__logo--link {
background:url(../img/sub_logo.png) no-repeat center center;
display: block;
height:78px;
transition: all 0.3s ease;
}
.sub__header--copyright {
display: none;
}
.nav__opener {
height:130px;
position:absolute;
right: 0;
top: 0;
width:200px;
z-index: 500;
}
.nav__opener--button {
background:url(../img/nav_menubtn_ov.png) no-repeat 28px 60px;
display: block;
height:130px;
position: relative;
transition: all 0.3s ease;
}
#sub .nav__opener--button {
background-image:url(../img/nav_menubtn_k.png);
}
.nav__opener--button:before,
.nav__opener--button:after {
background:#E5006A;
content:'';
height: 3px;
left:86px;
position: absolute;
transition: all 0.3s ease;
width: 76px;
}
#sub .nav__opener--button:before,
#sub .nav__opener--button:after {
background:#000;
}
.nav__opener--button:before {
top:55px;
}
.nav__opener--button:after {
top:73px;
}
.nav__opener--button.js-navactive {
background-image:url(../img/nav_menubtn_k.png);
height:130px;
position:fixed;
right: 0;
top: 0;
width:200px;
}
.nav__opener--button.js-navactive:before {
transform:translateY(9px) rotate(30deg);
background:#000;
}
.nav__opener--button.js-navactive:after {
transform:translateY(-9px) rotate(-30deg);
background:#000;
}
.header__nav {
background:#E6006A url(../img/menu_bg.png) no-repeat left top;
bottom:0;
left:0;
padding-top:118px;
position:fixed;
right:0;
transition: all 0.3s ease;
transform:translateX(750px);
top:0;
z-index:5;
}
.header__nav.js-navactive {
transform: translateX(0);
}
.header__nav--nav {
}
.header__nav--lists {
display: flex;
flex-wrap: wrap;
margin:0 35px;
}
.header__nav--list {
height:84px;
width:50%;
}
.nav--link {
display: block;
height:84px;
position: relative;
}
.nav--link:before {
background-position: 55px center;
background-repeat: no-repeat;
bottom:0;
content:'';
left:0;
position: absolute;
right: 0;
top:0;
z-index:50;
}
.nav--news {
order:1;
}
.nav--onair {
order:3;
}
.nav--introduction {
order:5;
}
.nav--story {
order:7;
}
.nav--character {
order:9;
}
.nav--staffcast {
order:11;
}
.nav--bdcd {
order:13;
}
.nav--goods {
order:2;
}
.nav--movie {
order:4;
}
.nav--event {
order:6;
}
.nav--funcontents {
order:8;
}
.nav--first {
order:10;
}
.nav--officialTwitter {
order:12;
}
.nav--top {
order:14;
}
.nav--introduction .nav--link:before {
background-image:url(../img/nav_introduction_k.png);
}
.nav--story .nav--link:before {
background-image:url(../img/nav_story_k.png);
}
.nav--staffcast .nav--link:before {
background-image:url(../img/nav_staffcast_k.png);
}
.nav--character .nav--link:before {
background-image:url(../img/nav_character_k.png);
}
.nav--movie .nav--link:before {
background-image:url(../img/nav_movie_k.png);
}
.nav--news .nav--link:before {
background-image:url(../img/nav_news_k.png);
}
.nav--onair .nav--link:before {
background-image:url(../img/nav_onair_k.png);
}
.nav--bdcd .nav--link:before {
background-image:url(../img/nav_bdcd_k.png);
}
.nav--event .nav--link:before {
background-image:url(../img/nav_event_k.png);
}
.nav--goods .nav--link:before {
background-image:url(../img/nav_goods_k.png);
}
.nav--officialTwitter .nav--link:before {
background-image:url(../img/nav_officialtwitter_k.png);
}
.nav--funcontents .nav--link:before {
background-image:url(../img/nav_funcontents_k.png);
}
.nav--comics .nav--link:before {
background-image:url(../img/nav_comics_k.png);
}
.nav--first .nav--link:before {
background-image:url(../img/nav_first_k.png);
}
.nav--top .nav--link:before {
background-image:url(../img/nav_top_k.png);
}
.nav--link.nav--soon {
opacity:0.5;
pointer-events: none;
}
.header__startdate {
display:none;
}
.header__share {
display: none;
}
.index__main {
flex:1;
position: relative;
z-index: 5;
}
#mainVisual {
display: flex;
height:880px;
}
.mainVisual__catch {
height:880px;
order:1;
width:110px;
}
.mainVisual__catch--inner {
position: sticky;
height:100vh;
min-height:750px;
top:0;
width:100%;
}
.mainVisual__catch--logo {
display:none;
}
.mainVisual__catch--catch {
background:url(../img/top_catch_s.png) no-repeat center center;
height:880px;
left:0;
position:relative;
right: 0;
top:0;
}
.mainVisual__catch--copyright {
display: none;
}
.mainVisual__visual {
display: flex;
align-items: flex-end;
height:880px;
flex:1;
background:url(../img/top_mainvisual_s.jpg) no-repeat center center / cover;
}
.mainVisual__startdate {
background: url(../img/startdate_s.png) no-repeat left center;
height:160px;
margin:0 auto;
width:600px;
}
#pMovie {
background:#000;
margin-left:auto;
position: relative;
width:640px;
}
.pMovie__title {
background: url(../img/pmovie_title.png) no-repeat center center / contain;
height:209px;
left:-96px;
pointer-events:none;
position: absolute;
top:35px;
width:82px;
z-index:600;
}
#sub .pMovie__title {
background-image: url(../img/pmovie_title_p.png);
left:-41px;
top:50%;
transform: translateY(-50%);
}
.pMovie__embed {
height:0;
padding-top:360px;
position: relative;
width: 100%;
}
.pMovie__embed:before {
background: url(../img/movie_layer.png);
content: '';
height:100%;
left:0;
pointer-events: none;
position: absolute;
top:0;
width:100%;
z-index:50;
}
.pMovie__embed:after {
background: url(../img/icon_play.png) no-repeat center center;
border:1px solid #464646;
border-radius:50%;
box-sizing: border-box;
content:'';
height:100px;
left:50%;
margin-left:-50px;
margin-top:-50px;
position: absolute;
top:50%;
width:100px;
z-index:60;
}
@keyframes playRotate {
0% {
transform: rotate(45deg);
}
100% {
transform: rotate(404.9deg);
}
}
.pMovie__embed--link {
background-position: center center;
background-repeat: no-repeat;
background-size:cover;
height:100%;
left:0;
position:absolute;
top:0;
width:100%;
}
.pMovie__embed--link:after {
border:2px solid #FFF;
border-left-color: transparent;
border-radius:50%;
box-sizing: border-box;
content:'';
height:100px;
left:50%;
margin-left:-50px;
margin-top:-50px;
position: absolute;
top:50%;
width:100px;
transform:rotate(45deg);
transition: all 0.3s ease;
z-index:100;
animation:playRotate 10s linear infinite;
}
#pTopics {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
margin-left:auto;
width:640px;
}
#sub #pTopics {
position:relative;
}
.pTopics__titles {
bottom:-100px;
order:1;
position: absolute;
right:0;
}
.pTopics__titles:before {
border-color: transparent #e5006a transparent transparent;
border-style: solid;
border-width: 4px 6.9px 4px 0;
content:'';
height: 0;
left:-40px;
position:absolute;
transform: rotate(90deg);
top:34px;
width: 0;
}
.pTopics__titles--topics {
background:url(../img/topics_title.png) no-repeat right top;
height:80px;
margin-left:auto;
width:215px;
}
.pTopics__titles--pickup {
background:url(../img/pickup_title.png) no-repeat right top;
height:22px;
margin-left:auto;
width:65px;
}
.pTopics__lists {
display: flex;
flex-wrap: wrap;
width:100%;
align-items: flex-start;
}
.pTopics__list {
height:80px;
width:320px;
}
.pTopics__list:first-child {
height:160px;
width:640px;
}
.pTopics__list a {
display: block;
}
.pTopics__list img {
max-width:320px;
display: block;
}
.pTopics__list:first-child img {
max-width:640px;
}
.footer {
height:334px;
position:relative;
z-index:500;
}
.footer__share {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.footer__share--title {
background: url(../img/footer_share_text.png) no-repeat center bottom;
height:53px;
width:100%;
}
.footer__share--links {
height:150px;
width:150px;
}
.footer__share--twitter {
background: url(../img/icon_twitter_p.svg) no-repeat center center / 67px auto;
display: block;
height:150px;
}
.footer__share--facebook {
background: url(../img/icon_facebook_p.svg) no-repeat center center / 26px auto;
display: block;
height:150px;
}
.footer__share--line {
background: url(../img/icon_line_p.svg) no-repeat center center / 56px auto;
display: block;
height:150px;
}
.footer__copyright {
font-size:14px;
padding-top:40px;
text-align: center;
}
.footer__totop {
bottom:0;
height:114px;
position:fixed;
right: 0;
width:114px;
}
.footer__totop--link {
background:#000;
display: block;
height:114px;
position: relative;
z-index:5000;
}
.footer__totop--link:before {
content:'';
border-style: solid;
border-width: 0 10px 32px 10px;
border-color: transparent transparent #e5006a transparent;
height: 0;
left:50%;
position: absolute;
top:50%;
transform: translate(-50%,-50%);
width: 0;
}
.footer__totop--link:after {
content:'';
border-style: solid;
border-width: 0 5px 15px 5px;
border-color: transparent transparent #000000 transparent;
height: 0;
left:50%;
margin-top:4px;
position: absolute;
top:50%;
transform: translate(-50%,-50%);
width: 0;
}
.bg {
left:0;
position: absolute;
top:0;
width:100%;
height:100%;
z-index:4;
}
#scene {
height:100%;
left:0;
overflow: hidden;
position:absolute;
top:0;
width:100%;
}
.layer {
height:100%;
left:0;
position:absolute;
top:0;
width:100%;
}
.layer__inner {
height:100%;
left:-33%;
position: absolute;
top:0;
width:166%;
}
.bg__layer--splash {
background:url(../img/bg_splash_s.png) no-repeat center top / 100% auto;
}
.bg__layer--stone {
background:url(../img/bg_stone_s.png) no-repeat center top / 100% auto;
}
.modal {
background:rgba(0,0,0,0.8);
bottom:0;
left:0;
position:fixed;
right:0;
top:0;
z-index:9999;
overflow: hidden;
display: none;
}
.modal__inner {
align-items: center;
display: flex;
justify-content: center;
left:0;
min-height:100%;
min-width: 100%;
position: absolute;
top:0;
}
.modal__inner iframe {
display: block;
width:750px;
height:422px;
}
.modal__close {
height:80px;
right:0;
position: fixed;
top:0;
width:80px;
z-index:500;
}
.modal__close--button {
background:#fff33f;
display: block;
height:80px;
position:relative;
}
.modal__close--button:before,
.modal__close--button:after {
background:#e5006a;
content:'';
height:2px;
left:0;
margin-top:-1px;
position: absolute;
top:50%;
width:80px;
}
.modal__close--button:before {
transform: rotate(45deg);
}
.modal__close--button:after {
transform: rotate(-45deg);
}
.sub__main {
background: #000 url(../img/sub_bg_s.jpg) no-repeat center top / 100% auto;
color:#FFF;
flex:1;
margin:0 55px 100px;
position: relative;
z-index:6;
}
.sub__main:before {
background: url(../img/sub_catch_s.png) no-repeat right top;
content:'';
height:792px;
position: absolute;
right:-54px;
top:98px;
width:104px;
}
.sub__main--title {
height:170px;
}
.sub__main--inner {
width:580px;
margin:0 auto;
min-height:800px;
padding-bottom:100px;
position:relative;
}
.sub__main--inner.staff {

}
#introduction .sub__main--title {
background:url(../img/introduction_title.png) no-repeat center center;
}
.introduction__text--catch {
font-size: 29px;
font-weight: bold;
line-height:1.7241;
margin-bottom:40px;
}
.introduction__text--main {
font-size:22px;
line-height: 2;
margin-bottom:35px;
}
.introduction__text--large {
display: block;
font-size:30px;
line-height:1.8;
margin-bottom:-20px;
}
#story .sub__main--title {
background:url(../img/story_title.png) no-repeat center center;
}
.staff.sub__main--title {
background: url(../img/staff_title.png) no-repeat center center;
}
.staffcast__wrapper {
width: 100%;
display: flex;
justify-content: flex-start;
}
.staff__lists {
}
.staff__list {
min-height:43px;
padding:6px 0;
display: flex;
align-items: flex-start;
}
.staff__list--title {
font-size:18px;
width:200px;
line-height:2.5;
}
.staff__list--name {
color:#fff33f;
font-size: 26px;
line-height:1.5357;
padding-left:30px;
position:relative;
}
.staff__list--name:before {
bottom:0;
content:':';
color:#FFF;
font-size:18px;
height:43px;
left:0;
line-height:2.5;
position:absolute;
top:0;
transform:translateX(-50%);
}
.cast.sub__main--title {
background: url(../img/cast_title.png) no-repeat center center;
}
.cast__lists {
}
.cast__list {
min-height:43px;
padding:6px 0;
display: flex;
align-items: flex-start;
}
.cast__list--title {
font-size:18px;
width:200px;
line-height:2.5;
padding-left:55px;
}
.cast__list--name {
color:#fff33f;
font-size: 26px;
line-height:1.5357;
padding-left:30px;
position:relative;
}
.cast__list--name:before {
bottom:0;
content:':';
color:#FFF;
font-size:18px;
height:43px;
left:0;
line-height:2.5;
position:absolute;
top:0;
transform:translateX(-50%);
}
.cast1 .cast__list--title {
background: url(../img/cast01image.png) no-repeat left center;
}
.cast2 .cast__list--title {
background: url(../img/cast02image.png) no-repeat left center;
}
.cast3 .cast__list--title {
background: url(../img/cast03image.png) no-repeat left center;
}
.cast4 .cast__list--title {
background: url(../img/cast04image.png) no-repeat left center;
}
.cast5 .cast__list--title {
background: url(../img/cast05image.png) no-repeat left center;
}
.cast6 .cast__list--title {
background: url(../img/cast06image.png) no-repeat left center;
}
.cast7 .cast__list--title {
background: url(../img/cast07image.png) no-repeat left center;
}
.cast8 .cast__list--title {
background: url(../img/cast08image.png) no-repeat left center;
}
.cast9 .cast__list--title {
background: url(../img/cast09image.png) no-repeat left center;
}
.cast10 .cast__list--title {
background: url(../img/cast10image.png) no-repeat left center;
}
#movie .sub__main--title {
background:url(../img/movie_title.png) no-repeat center center;
}
.movie__lists {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.movie__list {
margin-bottom:40px;
width:580px;
}
.movie__list--embed {
height:327px;
margin-bottom:15px;
}
.movie__list--embed iframe,
.movie__list--embed video {
width:580px;
height:327px;
}
.movie__list--title {
font-size:24px;
line-height:2.125;
}
#news .sub__main--title {
background:url(../img/news_title.png) no-repeat center center;
}
.article__lists {
}
.article__list {
margin:0 -85px 10px;
width:750px;
}
.article__list--link {
align-items: center;
background:#000;
border:2px solid #e50069;
color:#FFF;
display: flex;
overflow: hidden;
padding:2px;
position: relative;
text-decoration: none;
}
.article__list--link:before {
background:#e50069;
content:'';
position: absolute;
left:2px;
bottom:2px;
top:2px;
width:140px;
}
.article__list--time {
background: #e50069;
color:#fff33f;
display: flex;
align-items: center;
justify-content: center;
font-size:20px;
line-height: 2.375;
position:relative;
transition: all 0.3s ease;
width: 140px;
height:100%;
}
.article__list--title {
flex:1;
font-size:24px;
line-height:1.7;
padding:10px 30px;
position:relative;
word-break: break-all;
}
.pagingBox {
height: 50px;
text-align: center;
padding-top: 50px;
}
.pagingBox a,
.pagingBox span {
display: inline-block;
height: 50px;
width: 50px;
margin-right: 5px;
margin-bottom: 5px;
box-sizing: border-box;
border: solid 2px #E50069;
text-align: center;
line-height: 48px;
font-weight: bold;
font-size: 24px;
}
.pagingBox a {
background-color: #E50069;
transition: all 0.5s ease;
color: #FFF33F;
text-decoration: none;
}
.pagingBox span {
background-color: #E50069;
position: relative;
color: #FFF33F;
}
.pagingBox span:before {
content: '';
position: absolute;
left: -2px;
top: -7px;
bottom: -7px;
right: -2px;
border-top: 2px solid #E50069;
border-bottom: 2px solid #E50069;
}
.pagingBox .none { display: none; }
.article {
padding-bottom:80px;
}
.article__titles {
margin:0 -85px 30px;
align-items: center;
background:#000;
border:2px solid #e50069;
color:#FFF;
display: flex;
overflow: hidden;
padding:2px;
position: relative;
text-decoration: none;
}
.article__titles:before {
background:#e50069;
content:'';
position: absolute;
left:2px;
bottom:2px;
top:2px;
width:140px;
}
.article__titles--time {
background: #e50069;
color:#fff33f;
display: flex;
align-items: center;
justify-content: center;
font-size:20px;
line-height: 2.375;
position:relative;
transition: all 0.3s ease;
width: 140px;
height:100%;
}
.article__titles--title {
flex:1;
font-size:24px;
line-height:1.7;
padding:10px 30px;
position:relative;
word-break: break-all;
}
.article__main {
color:#FFF;
font-size:24px;
line-height:2.5;
word-break: break-all;
position: relative;
}
.article__main a {
color:#FFF;
}
.article__main iframe,
.article__main img {
max-width: 100%;
height:auto;
}
.article__main iframe {
height:327px;
}
.article__back {
height:60px;
width: 230px;
margin:0 auto;
}
.article__back--link {
border:2px solid #e50069;
color:#e50069;
display: block;
height:60px;
line-height: 2.5;
text-align: center;
text-decoration: none;
transition: all 0.3s ease;
}
.color--y .article__titles {
border:2px solid #fff33f;
}
.color--y .article__titles:before {
background:#fff33f;
}
.color--y .article__titles--time {
background: #fff33f;
color:#e50069;
}
.color--y .article__back--link {
border:2px solid #fff33f;
color:#fff33f;
display: block;
height:60px;
line-height: 2.375;
text-align: center;
text-decoration: none;
transition: all 0.3s ease;
}
.article__boxlists {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin:0 -30px;
width:640px;
position: relative;
}
.article__boxlist {
margin:0 0 12px;
width:310px;
}
.article__boxlist--link {
background:#fff33f;
display: block;
height: 100%;
text-decoration: none;
transition: all 0.3s ease;
}
.article__boxlist--img {
height:310px;
overflow: hidden;
background: #FFF;
}
.article__boxlist--img img {
height: 100%;
object-fit: cover;
width: 100%;
}
#goods .article__boxlist--img,
#bdcd .article__boxlist--img {
display: flex;
justify-content: center;
align-items: center;
}
#goods .article__boxlist--img img,
#bdcd .article__boxlist--img img {
object-fit: fill;
height:auto;
max-height:100%;
max-width: 100%;
width:auto;
}
.article__boxlist--title {
color:#e50069;
line-height:1.5;
padding:20px 28px;
transition: all 0.3s ease;
}
.article__tags {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-bottom:40px;
}
.article__tag {
height: 56px;
margin:0 5px 10px;
}
.article__tag--link {
background:#000;
border:2px solid #fff33f;
color:#fff33f;
display: block;
height:56px;
padding:0 15px;
line-height: 2.25;
text-align: center;
text-decoration: none;
transition:all 0.3s ease;
}
.article__tag--link.tag__current {
background:#fff33f;
color:#000;
}
.color--p .article__boxlist--link {
background:#e50069;
}
.color--p .article__boxlist--title {
color:#fff33f;
}
.color--p .article__tag--link {
border:2px solid #e50069;
color:#e50069;
}
.color--p .article__tag--link.tag__current {
color:#000;
background:#e50069;
}
#onair .sub__main--title {
background:url(../img/onair_title.png) no-repeat center center;
}
.onair__catch {
background: url(../img/onair_catch.png) no-repeat left top;
height:311px;
margin-bottom:70px;
}
.onair__title {
height:39px;
}
.onair__title--tv {
background: url(../img/onair_title_tv.png) no-repeat center center;
}
.onair__title--ondemand {
background: url(../img/onair_title_ondemand.png) no-repeat center center;
}
.onair__table--table {
margin-bottom:60px;
width:100%;
}
.onair__table--title {
background:#000;
border:2px solid #fff33f;
color:#fff33f;
font-size:22px;
font-weight: bold;
padding:8px;
text-align: center;
}
.onair__table--content {
color:#e50069;
font-size:22px;
line-height:1.5;
padding:13px 8px 8px;
position: relative;
text-align: center;
}
.onair__table--content:before {
background: #fff33f;
content: '';
bottom:-1px;
left:-1px;
right:-1px;
position: absolute;
top:5px;
z-index:-1;
}
.otc--small {
font-size:16px;
}
.onair__table--soon {
background: #fff33f;
color:#e50069;
font-size:22px;
line-height:1.5;
padding:8px;
position: relative;
text-align: center;
}
#event .sub__main--title {
background:url(../img/event_title.png) no-repeat center center;
}
#goods .sub__main--title {
background:url(../img/goods_title.png) no-repeat center center;
}
.goods__modal {
background:rgba(0,0,0,.85);
bottom:0;
left:0;
right:0;
overflow: auto;
position: fixed;
top:0;
z-index:9999;
display: none;
}
.goods__detail {
align-items: center;
display: flex;
justify-content: center;
margin:0 auto;
min-height: 100%;
padding:100px 0;
width:580px;
position: relative;
z-index:3;
}
.goods__article {
width: 100%;
}
.goods__article--title {
background: #000;
border:2px solid #e50069;
color:#e50069;
font-size:26px;
font-weight: bold;
line-height:1.65;
margin-bottom: 40px;
padding:10px 20px;
text-align: center;
}
.goods__article--inner {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-bottom:50px;
}
.goods__article--imgs {
display: flex;
flex-wrap: wrap;
align-content: flex-start;
width:580px;
margin-bottom:50px;
}
.goods__article--img {
margin-bottom:1px;
width:580px;
order:1;
}
.goods__article--img img {
width:580px;
height:auto;
}
.goods__article--imglists {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
order:2;
margin-right:-1px;
}
.goods__article--imglist {
margin-bottom:1px;
margin-right:1px;
width:82px;

}
.goods__article--imglist img {
cursor: pointer;
width:82px;
height:auto;
}
.goods__article--imglist img.is__current {
opacity:0.8;
}
.goods__article--description {
color:#FFF;
line-height:2;
width:580px;
word-break: break-all;
}
.goods__article--description a {
color:#FFF;
}
.goods__article--back {
height:60px;
width: 230px;
margin:0 auto;
order:99;
}
.goods__article--backlink {
border:2px solid #e50069;
color:#e50069;
display: block;
height:60px;
line-height: 2.5;
text-align: center;
text-decoration: none;
transition: all 0.3s ease;
}
.goods__closelayer {
bottom:0;
left:0;
position: absolute;
right:0;
top:0;
z-index:1;
}
.goods__article--description h4{
color: #e50069;
border-bottom:2px solid #e50069;
font-size:26px;
font-weight: bold;
padding-top:30px;
margin-bottom:15px;
}
#bdcd .sub__main--title {
background:url(../img/bdcd_title.png) no-repeat center center;
}
.discography__article {
padding-bottom:50px;
}
.discography__article--title {
background: #000;
border:2px solid #e50069;
color:#e50069;
font-size:24px;
font-weight: bold;
line-height:1.65;
margin-bottom: 40px;
padding:10px 20px;
text-align: center;
position: relative;
}
.discography__article--toptext {
border-bottom:1px solid #e50069;
color:#FFF;
line-height:2;
margin-bottom:40px;
padding-bottom:40px;
position: relative;
word-break: break-all;
}
.discography__article--bottomtext {
border-top:1px solid #e50069;
color:#FFF;
line-height:2;
padding-top:40px;
position: relative;
word-break: break-all;
}
.discography__article--toptext a,
.discography__article--bottomtext a {
color:#FFF;
}
.discography__article--toptext img,
.discography__article--toptext iframe,
.discography__article--bottomtext img,
.discography__article--bottomtext iframe {
max-width:100%;
}
.discography__article--inner {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-bottom:40px;
}
.discography__article--left {
position: relative;
width:580px;
margin-bottom:20px;
}
.discography__article--right {
color:#FFF;
width:580px;
}
.discography__article--img {
width:580px;
margin-bottom:30px;
text-align: center;
}
.discography__article--img img {
display: block;
max-width:100%;
margin:0 auto;
}
.discography__article--buttons {
height:60px;
margin-bottom:15px;
}
.discography__article--buttons a {
background:#000;
border:2px solid #e50069;
color:#e50069;
display: block;
font-size:24px;
height:60px;
line-height:2.5;
text-align: center;
text-decoration: none;
transition: all 0.3s ease;
}
.kbn {
background:#e50069;
color:#000;
display: table;
font-size:20px;
font-weight: bold;
height:32px;
line-height:2;
padding:0 15px;
margin-bottom:16px;
}
.discography__article--name {
font-size:26px;
font-weight: bold;
line-height:1.5;
margin-bottom:8px;
}
.discography__article--text {
line-height:2.5;
margin-bottom:2.5em;
}
#shopList { padding: 20px; }
#shopList h1 {
font-size: 28px;
font-weight: bold;
padding-bottom: 30px;
color: #E50069;
text-align: center;
}
#shopList span {
display: inline-block;
margin: 0 0 10px 10px;
;
}
#shopList span a img { transition: all 0.6s ease; }
#shopList .linktext { padding-bottom: 10px; }
#shopList .linktext a {
font-size: 20px;
text-decoration: none;
color:#FFF;
}
#shopList .dlicon { padding-bottom: 15px; }
#shopList .dlicon a img { transition: all 0.6s ease; }
#shopList .qr {
padding-bottom: 30px;
}
.dllist {
display: flex;
flex-wrap: wrap;
}
.dllist .box {
width:246px;
}
.shop__modal {
background:rgba(0,0,0,.85);
bottom:0;
left:0;
right:0;
overflow: auto;
position: fixed;
top:0;
z-index:9999;
display: none;
}
.shop__detail {
align-items: center;
display: flex;
justify-content: center;
margin:0 auto;
min-height: 100%;
padding:100px 0;
width:750px;
position: relative;
z-index:3;
}
.shop__article {
width: 100%;
}
.shop__closelayer {
bottom:0;
left:0;
position: absolute;
right:0;
top:0;
z-index:1;
}
.dl__modal {
background:rgba(0,0,0,.85);
bottom:0;
left:0;
right:0;
overflow: auto;
position: fixed;
top:0;
z-index:9999;
display: none;
}
.dl__detail {
align-items: center;
display: flex;
justify-content: center;
margin:0 auto;
min-height: 100%;
padding:100px 0;
width:800px;
position: relative;
z-index:3;
}
.dl__article {
width: 100%;
}
.dl__closelayer {
bottom:0;
left:0;
position: absolute;
right:0;
top:0;
z-index:1;
}
#character .sub__main--title {
background:url(../img/character_title.png) no-repeat center center;
}
.character__lists {
display: flex;
flex-wrap: wrap;
margin-left:-30px;
margin-right:-30px;
position:relative;
width:640px;
}
.character__list {
height:253px;
width:320px;
}
.character__list--link {
display: flex;
justify-content: center;
height:253px;
position: relative;
text-decoration: none;
transition: all 0.3s ease;
z-index: 1;
}
.character__list--1 .character__list--link {
background: url(../img/character1.jpg) no-repeat center center / cover;
}
.character__list--2 .character__list--link {
background: url(../img/character2.jpg) no-repeat center center / cover;
}
.character__list--3 .character__list--link {
background: url(../img/character3.jpg) no-repeat center center / cover;
}
.character__list--4 .character__list--link {
background: url(../img/character4.jpg) no-repeat center center / cover;
}
.character__list--5 .character__list--link {
background: url(../img/character5.jpg) no-repeat center center / cover;
}
.character__list--6 .character__list--link {
background: url(../img/character6.jpg) no-repeat center center / cover;
}
.character__list--7 .character__list--link {
background: url(../img/character7.jpg) no-repeat center center / cover;
}
.character__list--8 .character__list--link {
background: url(../img/character8.jpg) no-repeat center center / cover;
}
.character__list--9 .character__list--link {
background: url(../img/character9.jpg) no-repeat center center / cover;
}
.character__list--10 .character__list--link {
background: url(../img/character10.jpg) no-repeat center center / cover;
}
.character__list--name {
color:#e50069;
font-size:22px;
opacity:0;
position: relative;
transition: all 0.2s ease;
transition-delay: 0;
transform:translateY(20px);
z-index:20;
}
.character__article {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
position: relative;
}
.character__article--left {
display: flex;
align-items: center;
width:100%;
order:2;
}
.character__article--right {
display:flex;
width:100%;
justify-content: center;
margin-bottom:50px;
order:1;
}
.cal--inner {
display: flex;
flex-wrap: wrap;
position: relative;
width:100%;
}
.character__article--name {
height:144px;
width:100%;
margin-bottom:35px;
}
.character1 .character__article--name {
background:url(../img/character1_name.png) no-repeat center center;
}
.character2 .character__article--name {
background:url(../img/character2_name.png) no-repeat center center;
}
.character3 .character__article--name {
background:url(../img/character3_name.png) no-repeat center center;
}
.character4 .character__article--name {
background:url(../img/character4_name.png) no-repeat center center;
}
.character5 .character__article--name {
background:url(../img/character5_name.png) no-repeat center center;
}
.character6 .character__article--name {
background:url(../img/character6_name.png) no-repeat center center;
}
.character7 .character__article--name {
background:url(../img/character7_name.png) no-repeat center center;
}
.character8 .character__article--name {
background:url(../img/character8_name.png) no-repeat center center;
}
.character9 .character__article--name {
background:url(../img/character9_name.png) no-repeat center center;
}
.character10 .character__article--name {
background:url(../img/character10_name.png) no-repeat center center;
}
.character__article--lists {
display: flex;
flex-wrap: wrap;
left:-60px;
position: absolute;
top:-110px;
width:125px;
}
.character__article--list {
width:54px;
margin-bottom:7px;
margin-right:7px;
}
.character__article--listlink {
display: block;
height:54px;
}
.cnav1 .character__article--listlink {
background: url(../img/character_list1_s.png) no-repeat center center;
}
.cnav2 .character__article--listlink {
background: url(../img/character_list2_s.png) no-repeat center center;
}
.cnav3 .character__article--listlink {
background: url(../img/character_list3_s.png) no-repeat center center;
}
.cnav4 .character__article--listlink {
background: url(../img/character_list4_s.png) no-repeat center center;
}
.cnav5 .character__article--listlink {
background: url(../img/character_list5_s.png) no-repeat center center;
}
.cnav6 .character__article--listlink {
background: url(../img/character_list6_s.png) no-repeat center center;
}
.cnav7 .character__article--listlink {
background: url(../img/character_list7_s.png) no-repeat center center;
}
.cnav8 .character__article--listlink {
background: url(../img/character_list8_s.png) no-repeat center center;
}
.cnav9 .character__article--listlink {
background: url(../img/character_list9_s.png) no-repeat center center;
}
.cnav10 .character__article--listlink {
background: url(../img/character_list10_s.png) no-repeat center center;
}
@keyframes bounce {
0% {
transform: translateY(0px);
}
100% {
transform: translateY(-5px);
}
}
.character__article--listlink.is__current {
opacity:0.5;
pointer-events: none;
}
.character__article--changer {
display: table;
margin: 0px auto 50px;
}
.character__article--changer li {
height: 184px;
width: 144px;
padding-right: 7px;
padding-left: 7px;
display:table-cell;
}
.character__article--changer li a {
display:block;
transition:all 0.3s ease;
padding-top:130px;
height:54px;
text-decoration:none;
background-position:left top;
background-repeat:no-repeat;
}
.character__article--changer li a.active {
background-position:right top;
}
.character__article--changer li a span {
font-size: 20px;
line-height: 54px;
color: #FFF33F;
text-align: center;
display: block;
height: 54px;
transform:skew(-10deg);
}
.character__article--changer li a.active span {
/*color:#E50069;*/
}
.character2 .character__article--changer li:nth-child(1) a { background-image: url(../img/character2_1icon_s.png); }
.character2 .character__article--changer li:nth-child(2) a { background-image: url(../img/character2_2icon_s.png); }
.character2 .character__article--changer li:nth-child(3) a { background-image: url(../img/character2_3icon_s.png); }
.character3 .character__article--changer li:nth-child(1) a { background-image: url(../img/character3_1icon_s.png); }
.character3 .character__article--changer li:nth-child(2) a { background-image: url(../img/character3_2icon_s.png); }
.character3 .character__article--changer li:nth-child(3) a { background-image: url(../img/character3_3icon_s.png); }
.character4 .character__article--changer li:nth-child(1) a { background-image: url(../img/character4_1icon_s.png); }
.character4 .character__article--changer li:nth-child(2) a { background-image: url(../img/character4_2icon_s.png); }
.character4 .character__article--changer li:nth-child(3) a { background-image: url(../img/character4_3icon_s.png); }
.character5 .character__article--changer li:nth-child(1) a { background-image: url(../img/character5_1icon_s.png); }
.character5 .character__article--changer li:nth-child(2) a { background-image: url(../img/character5_2icon_s.png); }
.character5 .character__article--changer li:nth-child(3) a { background-image: url(../img/character5_3icon_s.png); }
.character6 .character__article--changer li:nth-child(1) a { background-image: url(../img/character6_1icon_s.png); }
.character6 .character__article--changer li:nth-child(2) a { background-image: url(../img/character6_2icon_s.png); }
.character6 .character__article--changer li:nth-child(3) a { background-image: url(../img/character6_3icon_s.png); }
.character7 .character__article--changer li:nth-child(1) a { background-image: url(../img/character7_1icon_s.png); }
.character7 .character__article--changer li:nth-child(2) a { background-image: url(../img/character7_2icon_s.png); }
.character7 .character__article--changer li:nth-child(3) a { background-image: url(../img/character7_3icon_s.png); }
.character8 .character__article--changer li:nth-child(1) a { background-image: url(../img/character8_1icon_s.png); }
.character8 .character__article--changer li:nth-child(2) a { background-image: url(../img/character8_2icon_s.png); }
.character8 .character__article--changer li:nth-child(3) a { background-image: url(../img/character8_3icon_s.png); }
.character__article--center {
width: 800px;
color: #FFF33F;
margin-bottom:30px;
padding-top:0px;
order:3;
}
.character__article--center span {
transform: skew(-10deg);
line-height: 66px;
font-weight: bold;
font-size: 24x;
display: inline-block;
}
.character__article--center span:nth-of-type(n + 2) { padding-left: 1em; }
.character__article--center h3 { padding-bottom: 33px; }
.characterSpec1 {
width: 580px;
float: left;
}
.characterSpec1 dt {
height: 66px;
width: 200px;
box-sizing: border-box;
padding-left: 38px;
background-repeat: no-repeat;
background-position: left center;
float: left;
clear: both;
}
.characterSpec1 dd {
width: 380px;
float: left;
min-height: 66px;
}
.characterSpec1 dd:before {
content: '：';
display: inline-block;
transform: skewX(-10deg);
}
.birthday { background-image: url(../img/icon_birthday.png); }
.bloodtype { background-image: url(../img/icon_bloodtype.png); }
.deathdate { background-image: url(../img/icon_deathdate.png); }
.age { background-image: url(../img/icon_age.png); }
.height { background-image: url(../img/icon_height.png); }
.weight { background-image: url(../img/icon_weight.png); }
.threesize { background-image: url(../img/icon_threesize.png); }
.characterSpec2 {
float: left;
width: 580px;
}
.characterSpec2 dt {
height: 66px;
width: 200px;
box-sizing: border-box;
padding-left: 38px;
background-repeat: no-repeat;
background-position: left center;
float: left;
clear: both;
}
.characterSpec2 dd {
width: 380px;
float: left;
min-height:66px;
}
.characterSpec2 dd:before {
content: '：';
display: inline-block;
transform: skewX(-10deg);
}
.favorite { background-image: url(../img/icon_favorite.png); }
.likefood { background-image: url(../img/icon_likefood.png); }
.hatefood { background-image: url(../img/icon_hatefood.png); }
.likecolor { background-image: url(../img/icon_likecolor.png); }
.character__article--center p {
clear: both;
padding-top:40px;
font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
color:#FFF;
line-height: 2.5;
margin-bottom:40px;
}
#loading {
background:#000 url(../img/sub_logo.png) no-repeat center center;
bottom:0;
left:0;
position: fixed;
right:0;
top:0;
z-index:99999;
}
.yellow {
color:#FDFF00;
}
.pink {
color:#FF0074;
}
.adp {
padding-bottom: 40px;
}
.alert {
display: block;
text-align: center;
margin:0 auto 50px;
padding:0;
background:#FDFF00;
}
.alert a {
color:#FF0074;
font-weight: bold;
font-size:26px;
}
.article__mainimg {
text-align: center;
margin-bottom:40px;
}
#af {
position:fixed;
z-index:9999;
left:0;
right:0;
top:0;
bottom:0;
background:rgba(0,0,0,0.6);
}
.af__in {
position: absolute;
left:15px;
top:100px;
right:15px;
bottom:100px;
background:url(../img/visual_0401.jpg) no-repeat center center / contain;
}
.af__close {
position: absolute;
right:0;
top:0;
width:100px;
height:100px;
}
.af__close a {
display: block;
height:100px;
position: relative;
}
.af__close a:before,
.af__close a:after {
content:'';
top:0;
bottom:0;
left:50%;
width:2px;
margin-left:-1px;
background:#fff33f;
position: absolute;
}
.af__close a:before {
transform: rotate(45deg);
}
.af__close a:after {
transform: rotate(-45deg);
}
/*STORY LIST*/
.story__lists {
width:580px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom:40px;
border-bottom:1px solid #FF0074;
padding-bottom:20px;
}
.story__list {
width:580px;
margin-bottom:40px;
}
.story__list--link {
display: block;
height:100%;
text-decoration: none;
}
.story__list--thumb {
height:326px;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
margin-bottom:15px;
}
.story__list--thumb img {
width:580px;
height:auto;
display: block;
}
.story__list--title {
font-size: 24px;
line-height: 2.125;
color:#FFF;
}
.story__article {

}
.story__article--title {
font-weight: bold;
font-size: 28px;
line-height:2;
margin-bottom:30px;
padding-bottom:20px;
border-bottom:1px solid #fff33f;
color:#fff33f;
}
.story__article--content {
line-height: 2;
font-size:24px;
color:#fff33f;
}
.story__article--images {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
padding-top:30px;
}
.story__article--images img {
width:280px;
height: auto;
display: block;
margin-bottom:20px;
}
.mainVisual__banner {
position: absolute;
left:30px;
top:30px;
}
.goodsListTitle {
	background:#fff33f;
	color:#000;
	padding:10px 15px;
	margin:0 -30px 40px;
	font-weight: 700;
	font-size:26px;
	line-height:1.75;
	text-align: center;
}