﻿@charset "utf-8";

*{
	margin:0;
	padding:0;
}
body {
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	background: #ffd1de url(../images/common/bg.png) repeat-x center top;
	overflow-x:hidden;
}

ul,li {
	list-style-type:none;
}

.mouseicon {
	display:inline-block;
	position:absolute;
	left:0px;
	top:0px;
	z-index: 9999;
	pointer-events:none;
}
a {
	color: #E41B8E;
	font-size:15px;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a:focus, *:focus { outline:none; }

#mainArea{
	background: url(../images/common/main_190915.jpg) top center no-repeat;
	height:1640px;
}
#mainArea > div{
	position:relative;
	width:1200px;
	height:1640px;
	margin:0 auto;
}
#mainArea > div h1{
	position:absolute;
	top:828px;
	left:350px;
}
#mainArea > div h2{
	position:absolute;
	top:1159px;
	left:852px;
}
#mainArea > div .btnCampaign{
	position: absolute;
	bottom: 370px;
	left: 0px;
}
#mainArea > div .btnCampaign a:hover{
	opacity:0.7;
}
#mainArea > div .text01{
	position:absolute;
	top:177px;
	left:1054px;
}
#mainArea > div .text02{
	position:absolute;
	top:1240px;
	left:60px;
}
#presentArea{
	margin: 0 auto 60px;
	width: 1110px;
	display: flex;
	justify-content: space-between;
}
#presentArea div:last-child{
	margin: -230px 0 0;
}

footer #billing{
	text-align:center;
	margin:0 auto 60px;
}
footer .bnrArea {
	text-align:center;
	margin-bottom:40px;
}
footer .bnrArea a:hover {
	opacity:0.6;
}
footer #copy{
	text-align:center;
	width: 1222px;
	margin:0 auto 30px;
}
.footer .copyright {
	text-align: center;
}


header {
	width: 1200px;
	margin: 0 auto;
	display: -ms-flex;
	display: flex;
}
header .logo {
	margin: 30px 0 0 0;
}
header .grobalNav {
	margin: 45px 0 0 0;
}
header .grobalNav .nav {
	display: -ms-flex;
	display: flex;
	position:relative;
	margin-left: 26px;
}
header .grobalNav .nav li {
	margin-left: 25px;
}
header .grobalNav .nav li.gameFukidashi {
	position: absolute;
	top: 110px;
	right: -21px;
}
header .logo a:hover {
	opacity: 0.8;
}
header .grobalNav .nav li a {
	display: block;
}
.grobalNav .nav li.news a:hover img,
.grobalNav .nav li.story a:hover img,
.grobalNav .nav li.soon a:hover img,
.grobalNav .nav li.still a:hover img,
.grobalNav .nav li.character a:hover img,
.grobalNav .nav li.game a:hover img,
.grobalNav .nav li.movie a:hover img,
.grobalNav .nav li.howto a:hover img,
.grobalNav .nav li.dance a:hover img,
.grobalNav .nav li.special a:hover img,
.grobalNav .nav li.theater a:hover img,
.grobalNav .nav li.scratch a:hover img,
body.news header .grobalNav .nav li.news a img,
body.story header .grobalNav .nav li.story a img,
body.still header .grobalNav .nav li.still a img,
body.song header .grobalNav .nav li.soon a img,
body.game header .grobalNav .nav li.game a img,
body.movie header .grobalNav .nav li.movie a img,
body.howto header .grobalNav .nav li.howto a img,
body.dance header .grobalNav .nav li.dance a img,
body.special header .grobalNav .nav li.special a img,
body.special header .grobalNav .nav li.special a img ,
body.character header .grobalNav .nav li.character a img {
			opacity: 0;
}
.grobalNav .nav li.news a:hover,
body.news header .grobalNav .nav li.news a {
	background: url(../images/common/btn_news_active.png) no-repeat center top;
}
.grobalNav .nav li.story a:hover,
body.story header .grobalNav .nav li.story a {
	background: url(../images/common/btn_story_active.png) no-repeat center top;
}
.grobalNav .nav li.still a:hover,
body.still header .grobalNav .nav li.still a {
	background: url(../images/common/btn_still_active.png) no-repeat center top;
}
.grobalNav .nav li.character a:hover,
body.character header .grobalNav .nav li.character a {
	background: url(../images/common/btn_character_active.png) no-repeat center top;
}
.grobalNav .nav li.movie a:hover,
body.movie header .grobalNav .nav li.movie a {
	background: url(../images/common/btn_movie_active.png) no-repeat center top;
}
/* .grobalNav .nav li.game a:hover,
body.game header .grobalNav .nav li.game a {
	background: url(../images/common/btn_game_active.png) no-repeat center top;
} */
.grobalNav .nav li.howto a:hover,
body.howto header .grobalNav .nav li.howto a {
	background: url(../images/common/btn_howto_active.png) no-repeat center top;
}
.grobalNav .nav li.dance a:hover,
body.dance header .grobalNav .nav li.dance a {
	background: url(../images/common/btn_dance_active.png) no-repeat center top;
}
.grobalNav .nav li.special a:hover,
body.special header .grobalNav .nav li.special a {
	background: url(../images/common/btn_special_active.png) no-repeat center top;
}
.grobalNav .nav li.theater a:hover {
	background: url(../images/common/btn_theater_active.png) no-repeat center top;
}
.grobalNav .nav li.soon a:hover {
	background: url(../images/common/btn_comingsoon_active.png) no-repeat center top;
}
.grobalNav .nav li.scratch a:hover {
	background: url(../images/common/btn_scratch_active.png) no-repeat center top;
}

body.secondary .contentArea {
	width:1222px;
	margin: 0 auto 70px;
}
body.secondary .contentArea img {
	vertical-align: top;
}


/****************************index ***********************************************/

#mainArea > div .btnArea{
	position:absolute;
	top:30px;
	left:0;
	right:0;
	width:510px;
	margin:0 auto;
}
#mainArea > div .bnrRank{
	position:absolute;
	top:30px;
	width:330px;
}
#mainArea > div .bnrRank img{
	width:100%;
}
#mainArea > div .kansoubtn{
	margin-right:20px;
	float:left;
}
#mainArea > div .specialbtn{
	float:left;
}
/*#mainArea > div .kansoubtn:hover{
	opacity:0.8;
}*/
#mainArea > div .specialbtn:hover{
	opacity:0.8;
}

/****************************index　ナビ******************************************/
#indexNavArea{
	margin:-280px auto 0;
	position: relative;
	z-index: 10;
}
#indexNavArea .grobalNav{
	width:1020px;
	margin: 0 auto;
}
#indexNavArea .grobalNav li{
margin: 0 5px;
}
#indexNavArea .grobalNav .nav {
	display: -ms-flex;
	display: flex;
	position: relative;
}
#indexNavArea .grobalNav .nav li {
	transform: scale(0.9);
	margin-right: -15px;
}
#indexNavArea .grobalNav .nav li.gameFukidashi {
	position: absolute;
	top: 110px;
	right: -4px;
}
#indexNavArea .grobalNav .nav li a {
	display: block;
}


/****************************index　トピックス******************************************/

#topics{
	width: 100%;
	margin: 45px 0 35px;

}
#topics .newsDetail{
	box-sizing: border-box;
	position: relative;
	width: 1212px;
	height: 301px;
	background: url(../images/common/topicsbg.png) no-repeat;
	padding-top: 65px;
	margin:0 auto;

}
#topics .newsDetail h2 {
	position: absolute;
	top: -22px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: 1;
}
#topics .newsDetail #divRss .updates li {
	width: 100%;
}



#topics .newsDetail .container {
    margin: 0px 0 0 70px;
    height: 190px;
    width: 1100px;
    overflow: hidden;
}
#topics .newsDetail .scrollable {
	margin-right: -20px;
	padding-right: 20px;
	height: 190px;
	overflow: hidden;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
}
#topics .newsDetail .scrollable.is-scrollbar {
	/*padding-right: 58px;*/
}
#topics .newsDetail .container {
	position: relative;
}
#topics .newsDetail .adjustment {
	margin-right: 0;
}
#topics .newsDetail .adjustment #divRss {
	padding-right: 20px;
	margin-top:20px;
	margin-bottom:0;
}
#topics .newsDetail .scrollbar {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 14px;
	background-color: #FFE8F7;
	border-radius: 18px;
}
#topics .newsDetail .scrollbar-thumb {
	position: relative;
	min-height: 26px;
	background-color: #FF72CF;
	border-radius: 18px;
	margin: 2px;
}


#divRss {
	padding-bottom: 20px;
}
#divRss .updates li {
	width: 100%;
	margin: 0 auto;
	background: url(../images/common/line.gif) center bottom no-repeat;
}
#divRss .updates li p{
	padding: 0px 0 20px;
}
#divRss .updates li span{
	display: block;
	color: #fe4689;
	font-size: 13px;
	font-weight:normal;
	letter-spacing: 1px;
	margin-bottom: 5px;
}
#divRss .updates li a{
	font-size: 15px;
	color: #fe4689;
	text-decoration:none;
}


#divRss .updates li a:hover{
	text-decoration:underline;
}


.game .title{
	position:relative;
}
.game .title .btn01{
	position:absolute;
	bottom:0;
	left:255px;
}
.game .title .btn02{
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	width:230px;
	margin:0 auto;
}
.game .title .btn03{
	position:absolute;
	bottom:0;
	right:255px;
}
.game .questionArea {
	position:relative;
}
.game .questionArea .btnAnswer{
	position:absolute;
	top:10px;
	right:45px;
}
.game .questionArea .btnAnswer a:hover{
	opacity:0.6;
}


/* 感想追加 */
span.Entry__comment-desc___17fDl, .EntryModal__img-tags___e2BEQ {
	display: none;
}
.MainPage__main-container___2z70_ {
	overflow:hidden!important;
}
.LoadMoreButton__load-more-button___3uRPa {
	background:#FF99CC!important;
	color:#FFFFFF!important;
	font-size:14px!important;
	border-radius: 100px !important;
	padding: 15px 40px !important;
	display: inline-block;
}
.grid-item.Entry__entry___25Jvq {
	position: reltive;
	z-index: 999;             
	border:1px solid red;
	padding:5px;
	box-sizing: border-box;

	border: 3px solid #C0FFEE;
	border-radius:10px;
	box-shadow: 0 0 1px #b3ff51,
							0 0 2px #00d8ff,
							0 0 6px #00d8ff,
							0 0 12px #00d8ff,
							inset 0 0 1px #00d8ff,
							inset 0 0 2px #00d8ff,
							inset 0 0 6px #00d8ff,
							inset 0 0 12px #00d8ff;
}
.Entry__card-caption___AGG2C {
	background:#FFFFFF;
}
.drawFeelingsArea {
	margin: 0 auto 60px;
	width: 1110px;
}
.MasonryWrapper__tab-content___2-Rpm {
	margin:10px 0 0 0;
}
.drawFeelingsAreaIn {
	text-align:center;
}
.drawFeelingsAreaIn ul {
	margin: 0 0 40px 0;
}
.drawFeelingsAreaIn ul li {
	display:inline-block;
	margin: 0 20px;
}
.Modal__modal-wrapper___3Atm3 {
	z-index: 9999!important;
}
.impressionsTitle{
	margin-bottom: 30px;
}
.btn{
	margin-bottom: 30px;
}
.CloseModalButton__close-button___1kgme {
	color: #FE7DAC!important;
	font-size: 42px!important;
	background: #fff!important;
	vertical-align: bottom!important;
	border-radius: 10px!important;
}


/****************************第2階層　共通******************************************/
#docbody {
	max-width: 1206px;
	margin: 0 auto;
}
.ttlBtnArea{
	position:relative;
	z-index: 99;
}
.frameWrap {
	width: 1206px;
	margin: 0 auto 100px;
}
.frameWrap img {
	max-width: 100%;
}
.frameWrap .frame-content {
	position: relative;
	background-image: url(/library/images/common/frame_mid_pc.png);
	background-repeat: repeat-y;
	background-position: center bottom;
	margin-bottom: 38px;
	min-height: 380px;
}
.frameWrap .frame-content:after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	bottom: -38px;
	left: 0;
	z-index: 10;
	background-image: url(/library/images/common/frame_bottom_pc.png);
	background-repeat: no-repeat;
	background-position: center bottom;
}
.frameWrap .frame-content .frame-content-inner {
	position: relative;
	z-index: 100;
	padding: 0 100px 100px;
}
.frameWrap .frame-content .frame-content-inner .btnArea{
	text-align: center;
	margin-top: 25px;
}
.pcNone {
	display: none!important;
}

/****************************news　ニュース******************************************/
body.news .frameWrap .ttlBtnArea {
	width: 100%;
	height: 323px;
	background: url(/library/images/news/bg_ttl_pc.png) no-repeat center top;
	background-size: contain;
	position: relative;
}
body.news .frameWrap .ttlBtnArea .ttl {
	text-align: center;
	padding-top: 115px;	
}
body.news .frameWrap .kiji-list-group li {
	border-bottom: 1px solid #ffb2c9;
}
body.news .frameWrap .kiji-list-group li a {
	display: inline-block;
	text-decoration: none;
	color: #ff5f81;
	font-size: 18px;
	padding: 20px;
	width: -webkit-calc(100% - 40px);
	width: calc(100% - 40px);
	position: relative;
}
body.news .frameWrap .kiji-list-group li a:hover,
body.news .frameWrap .kiji-list-group li a:hover .kiji-date {
	text-decoration: underline;
}
body.news .frameWrap .kiji-list-group li a:before {
	content: "";
	display: inline-block;
	width: 40px;
	height: 39px;
	background: url(/library/images/news/icon_post_title.png) no-repeat center center;
	background-size: contain;
	position: absolute;
	top: 20px;
	left: 0;
	z-index: 10;
}
body.news .frameWrap .kiji-list-group li a .kiji-date,
body.news .frameWrap .kiji-list-group li a .text {
	position: relative;
	z-index: 11;
}
body.news .frameWrap .kiji-list-group li a .kiji-date {
	display: inline-block;
	padding: 16px 0 0 0;
	margin-bottom: 10px;
	font-size: 16px;
}
body.news .frameWrap .entry .title {
	color: #ff5f81;
	font-size: 16px;
	padding: 20px;
	width: -webkit-calc(100% - 40px);
	width: calc(100% - 40px);
	position: relative;
}
body.news .frameWrap .entry .title:before {
	content: "";
	display: inline-block;
	width: 80px;
	height: 78px;
	background: url(/library/images/news/icon_post_title.png) no-repeat center center;
	background-size: contain;
	position: absolute;
	top: 20px;
	left: -25px;
	z-index: 10;
}
body.news .frameWrap .entry .title .kiji-date {
	display: inline-block;
	padding: 40px 0 0 0;
	margin-bottom: 10px;
	font-size: 18px;
}
body.news .frameWrap .entry .title .kiji-date,
body.news .frameWrap .entry .title .title-text {
	position: relative;
	z-index: 11;
}
body.news .frameWrap .entry .title .title-text {
	color: #ff5f81;
	font-weight: normal;
	font-size: 18px;
}
body.news .frameWrap .entry .content {
	padding: 20px;
}

/****************************still スチール******************************************/
body.still .frameWrap .frame-content {
	margin-top: -15px;
}
.still-image {
	text-align: center;
}
.still-image figure {
	margin-bottom: 20px;
}

/****************************movie ムービー******************************************/
body.movie .frameWrap .frame-content,
body.howto .frameWrap .frame-content,
body.dance .frameWrap .frame-content ,
body.works .frameWrap .frame-content  {
	margin-top: -30px;
}
body.movie .frameWrap .frame-content .frame-content-inner {
	padding: 0 50px 100px;
	min-height: 500px;
}
.movie-box {
	display: -ms-flex;
	display: flex;
	flex-wrap: wrap;
}
.movie-box.movieSingle {
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.movie-box .box {
	width: -webkit-calc(50% - 40px);
	width: calc(50% - 40px);
	margin: 0 20px 20px;
}
.movie-box .box .sttl {
	text-align: center;
	margin-bottom: 10px;
}
.movie-box .box .movie {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.movie-box .box .movie iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

/****************************story　ストーリー******************************************/
body.story .frameWrap .frame-content{
	background: none;
}
body.story .frameWrap .frame-content:after{
	content: none;
}
body.story .frameWrap .frame-content .frame-content-inner{
	padding: 0;
}
body.story .frameWrap .frame-content .frame-content-inner > div{
	margin-top: -11px;
}

/****************************character　キャラクター******************************************/
body.character .frameWrap .frame-content .frame-content-inner {
	padding: 0 0 92px;
	height: 1128px;
	background: url(/pc/library/images/character/bg_contents.png) top left no-repeat;
	margin-top: -11px;
}

body.character .linkBtnArea{
	position: absolute;
	top: -20px;
	left: 0;
	right: 0;
	text-align: center;
}
body.character .linkBtnList{
	width: 1000px;
	margin: 0 auto;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
body.character .linkBtnList li{
	width: 50%;
}

body.character .characterImg{
	position: absolute;
	top: 175px;
	left: 0;
}


/**************************** info ***********************************************/
body.info .frameWrap .frame-content .frame-content-inner{
	margin-top: -15px;
}
body.info .ttlA {
	/*color: #e60012;*/
	font-size: 34px;
	font-weight: bold;
	text-align: center;
	margin-bottom: 30px;
}
body.info .fontTypeA {
	font-size: 25px;
	font-weight: bold;
	margin-bottom: 30px;
	text-align: center;
}
body.info .fontTypeB {
	text-align: right;
	margin-bottom: 60px;
	line-height: 2.3;
}
body.info .text{
	margin-bottom: 20px;
	line-height: 2.3;
}
body.info .frameWrap .frame-content:after {
	background-image: url(/pc/library/images/info/frame_bottom_pc.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 100% auto;
}

body.info .tex.mb50 {
	margin-bottom:50px;
}


/**************************** works ***********************************************/
body.works .text{
	text-align: center;
	margin-bottom: 30px;
}
body.works .movie-box{
	margin-bottom: 80px;
}
body.works .movie-box .box{
	margin: 0 20px 20px 0;
}
body.works .movie-box .box:last-child{
	margin: 0 0 20px 0;
}
body.works .movie-box .box .sttl{
	margin-bottom: 0;
}
body.works .ttlA{
	text-align: center;
	margin-bottom: 30px;
}
body.works .movieTable{
	text-align: center;
	margin-bottom: 30px;
}
body.works .movie-box {
	flex-wrap: nowrap;
}


/****************************weekly ******************************************/
body.weekly .frame-content{
	text-align: center;
	margin-top: -10px;
}
body.weekly .frameWrap .frame-content .frame-content-inner{
	padding: 0 0 100px;
}
body.weekly .innerBg {
	margin-top: -12px;
	position: relative;
	padding-bottom: 225px;
}
body.weekly .text01 {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	text-align: center;
}
body.weekly .text02 {
	position: absolute;
	top: 163px;
	left: 0;
	right: 0;
	text-align: center;
}
body.weekly .sttl{
	margin-bottom: 30px;
}
body.weekly .btnArea{
	display: flex;
	justify-content: center;
	margin: 0;
}
body.weekly .btnArea a{
	display: block;
}
body.weekly .btnArea > div{
	margin : 0 15px;
}
body.weekly .category01{
	position: absolute;
	top: 480px;
	left: 0;
	right: 0;
	text-align: center;
}
body.weekly .category02{
	position: absolute;
	top: 755px;
	left: 0;
	right: 0;
	text-align: center;
	z-index: 1;
}

body.weekly .btnArea a:hover img {
	opacity: 0;
}
body.weekly .btnArea .btn01 a {
	background: url(../images/weekly/btn_01_on.png) no-repeat center top;
}
body.weekly .btnArea .btn02 a {
	background: url(../images/weekly/btn_02_on.png) no-repeat center top;
}
body.weekly .btnArea .btn03 a {
	background: url(../images/weekly/btn_03_on.png) no-repeat center top;
}
body.weekly .btnArea .btn04 a {
	background: url(../images/weekly/btn_04_on.png) no-repeat center top;
}
body.weekly .btnArea .btn05 a {
	background: url(../images/weekly/btn_05_on.png) no-repeat center top;
}
body.weekly .btnArea .btn06 a {
	background: url(../images/weekly/btn_06_on.png) no-repeat center top;
}
body.weekly .btnArea .btn07 a {
	background: url(../images/weekly/btn_07_on.png) no-repeat center top;
}
