@charset "utf-8";
/* CSS Document */
@import"https://fonts.googleapis.com/css2?family=Cormorant+Infant:wght@300;400&family=Noto+Sans+SC:wght@100;400;900&family=Poppins:wght@400;700family=Cascadia+Mono:ital,wght@0,200..700;1,200..700&display=swap";

:root {
    --fz-10px: 10px;
    --fz-12px: 12px;
    --fz-14px: 14px;
    --fz-16px: 16px;
    --fz-18px: 18px;
    --fz-20px: 20px;
    --fz-24px: 24px;
    --fz-28px: 28px;
    --fz-32px: 32px;
    --fz-36px: 36px;
    --fz-56px: 56px;
    --fz-72px: 72px;
    --fz-120px: 120px
}

/* clearfix */

.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    zoom: 1;
}

/* 画像センタリング */

.cr {margin:0 auto;}
.cr5 {margin:10px auto;}
.cr10 {margin:10px auto;}
.cr20 {margin:20px auto;}
.cr30 {margin:30px auto;}

.cr15o {margin:15px auto 0;}
.cr20o {margin:20px auto 0;}

.cr15u {margin:0 auto 15px;}
.cr20u {margin:0 auto 20px;}
.cr50up {margin:0 auto; padding-bottom:50px;}

body.fixed .menu_fix {
	margin-bottom:100px;
}

body.fixed #Menu {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 8888;
}


/* 点滅 */
.blinking{
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 1.5s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}


/* ページトップ */

#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	font-size: 1.4em;
	font-weight:bold;
	z-index:10000;
}
#page-top a {
	background: #eb6d9a;
	text-decoration: none;
	color: #fff;
	width: 100px;
	padding: 30px 0;
	text-align: center;
	display: block;
	border-radius: 10px;
}
#page-top a:hover {
	text-decoration: none;
	background: #ff3980;
}

/* FireFoxFadeブレ防止 */

img { display:block; box-shadow: #000 0 0 0; }


/* 全体・枠作り */

html,body {
  height:100%;
}

img { display:block; }


body {
	font-family: "Poppins", "Noto Sans SC", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	font-size:62.5%;
	text-align:center;
	background-attachment: fixed;
}

#PageWrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	position: relative;
	width:100%;
}

#Mainvisual {
	width:100%;
	min-width:1000px;
	height:838px;
	background:url(../img/mainvisual_bg.jpg) center top no-repeat;
	background-size:cover;
	position:relative;
}

header {
	width:100%;
	height:90px;
	background:url(../img/menu_bg.png) center top repeat-x;
}

.head_wrap {
	width:1000px;
	height:90px;
	margin:0 auto;
}

header h1 {
	background:url(../img/title.png) center center no-repeat;
	width:310px;
	height:80px;
	margin-right:14px;
	float:left;
}

h1 a {
	display:block;
	width:310px;
	height:80px;
	text-indent:-9999px;
	overflow:hidden;
}

#Menu {
	width:676px;
	height:90px;
	float:left;
}

#Menu ul {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	list-style: none;
	padding: 0;
	margin: 0;
}

.mainvisual_illust {
	width:100%;
	min-width:1000px;
	height:838px;
	background:url(../img/mainvisual.jpg) center top no-repeat;
	position:relative;
}

.catch {
	width:885px;
	height:52px;
	background:url(../img/catch_wide.png) center top no-repeat;
	margin:390px auto;
	text-indent:-9999px;
	overflow:hidden;
}

.logo_large {
	background:url(../img/logo_large.png) center top no-repeat;
	width:797px;
	height:214px;
	text-indent:-9999px;
	overflow:hidden;
	position:absolute;
	top:-200px;
	left:50%;
	margin-left:-398px;
}

#Main_line {
	width:100%;
	min-width:1000px;
	height:117px;
	background:url(../img/mainline_00.jpg) center center no-repeat;
	background-size:cover;
	position:relative;
}

.mainline_wrap {
	width:100%;
	height:117px;
	box-shadow:0 3px 3px rgba(0,0,0,0.25) inset, 0 -3px 3px rgba(0,0,0,0.25) inset;
}

.mainline_sellday {
	max-width:1136px;
	min-width:1000px;
	height:117px;
	background:url(../img/days.png) center center no-repeat;
	background-size:100%;
	margin:0 auto;
	text-indent:-9999px;
	overflow:hidden;
}

#Contents {
	width:100%;
	background:url(../img/grand_bg.png) center top no-repeat;
	background-size:100%;
	background-attachment:fixed;
	padding-bottom:340px;
}

#Topics {
	width:1000px;
	padding-top:36px;
	margin:0 auto 0;
}

.topics_block {
	width:330px;
	height:280px;
	background-color:#FFF;
	float:left;
	margin-bottom:5px;
	box-shadow:0 2px 3px rgba(79,155,184,0.5);
	position:relative;
}

.new {
	position:absolute;
	width:25px;
	height:280px;
	left:0;
	top:0;
	z-index:1;
	background:url(../img/new.png) left top repeat-y;
	animation: new 5s linear infinite;
}

@keyframes new {
 0% {background-position: 0 0;}
 100% {background-position: 0 -426px;}
}

.topics_block a {
	color:#01a0e8;
	text-decoration:none;
}

.topics_block figure {
	position: relative;
	overflow: hidden;
	width:330px;
	height:280px;
	margin:0;
}

figcaption {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0.9);
	-webkit-transform: rotateX(-180deg);
	transform: rotateX(-180deg);
	-webkit-transition: .5s;
	transition: .5s;
	opacity: 0;
}

figcaption h3 {
	margin-top:40px;
	color:#01a0e8;
	font-weight:bold;
	font-size:2em;
	line-height:2;
}

figcaption p {
	margin-top:20px;
	color:#7e7e7e;
	font-size:1.6em;
	line-height:2;
}


figure:hover figcaption {
	-webkit-transform: rotateX(0);
	transform: rotateX(0);
	opacity: 1;
}

.mr5 {
	margin-right:5px;
}

.whatsnew_box {
	background:url(../img/rireki_box.jpg) center top no-repeat;
	width:330px;
	height:253px;
	padding-top:27px;
}

.publish_box {
	background:url(../img/publish_box.jpg) center top no-repeat;
	width:330px;
	height:253px;
	padding-top:27px;
}

.logtxt {
	width:278px;
	height:238px;
	margin:0 auto;
	padding:0 10px;
	font-size:1.4em;
	color:#7e7e7e;
	line-height:21px;
	text-align:left;
	overflow:hidden;
	position:relative;
}

.whatsnew_box .logtxt p span{
	color:#ff7477;
}

.publish_box .logtxt p span{
	color:#1b95e0;
}

.whatsnew_box .logtxt p{
	background:url(../img/rireki_line.png) center bottom no-repeat;
	margin-top:10px;
	padding-bottom:5px;
}

.publish_box .logtxt p{
	background:url(../img/publish_line.png) center bottom no-repeat;
	margin-top:10px;
	padding-bottom:5px;
}

footer {
	background:url(../img/footer_block.png) center top no-repeat;
	width:100%;
	min-width:1000px;
	height:265px;
	position: absolute;
	bottom: 0;
	left: -1px;
}

.footer_wrap {
	width:1000px;
	margin:0 auto;
	padding-top:15px;
	position:relative
}

.block01 {
	padding-top:24px;
	width:280px;
	float:left;
}

.block02 {
	padding-top:24px;
	width:280px;
	float:left;
	margin-right:30px;
}

.block03 {
	padding-top:22px;
	width:280px;
	float:left;
}

.block04 {
	width:244px;
	height:249px;
	position:absolute;
	left:756px;
	top:-40px;
}

.banner {
	width:200px;
	height:40px;
	position:absolute;
	left:0;
	top:120px;
	background-color:transparent;
	display:flex;
	justify-content:center;
	align-items:center;
}

.footer_wrap dl {
	width:280px;
	margin-bottom:16px;
	position:relative;
}

.footer_wrap dl dt {
	width:100px;
	height:20px;
	background:#FFF;
	border-radius:10px;
	color:#46d1ff;
	text-align:center;
	font-size:1.3em;
	float:left;
	margin-right:16px;
}

.footer_wrap dl dd {
	height:20px;
	color:#FFF;
	text-align:left;
	font-size:1.3em;
	float:left;
}

.footer_wrap dl dd.wline {
	height:36px;
	color:#FFF;
	text-align:left;
	font-size:1.2em;
	position:absolute;
	left:116px;
	top:-10px;
}

.block03 ul li {
	color:#FFF;
	font-size:1.3em;
	text-align:left;
	margin-bottom:2px;
}

.block03 ul li a {
	color:#FFF;
	text-decoration:none;
}

.block03 ul li a:hover {
	color:#FFF;
	text-decoration:underline;
}

.tweet {
	width:50px;
	height:50px;
	position:absolute;
	left:0;
	top:-48px;
}

.home {
	width:50px;
	height:50px;
	position:absolute;
	left:66px;
	top:-48px;
}

.blog {
	width:170px;
	height:50px;
	position:absolute;
	left:132px;
	top:-48px;
}

.copyright {
	margin-top:40px;
	color:#575757;
	font-size:1.2em;
}

/* IE6 hack - commented out for modern browsers
* html footer {
	bottom:expression(document.getElementById("PageWrapper").offsetHeight % 2 == 0 ? 0 : -1);
}
*/

/* サブページ */

#Subline {
	width:100%;
	height:150px;
	background-size:cover;
	position:relative;
}

.subline_story {	background:url(../img/mainline_01.jpg) center center no-repeat;}
.subline_character {	background:url(../img/mainline_02.jpg) center center no-repeat;}
.subline_gallery {	background:url(../img/mainline_03.jpg) center center no-repeat;}
.subline_download {	background:url(../img/mainline_04.jpg) center center no-repeat;}
.subline_special {	background:url(../img/mainline_05.jpg) center center no-repeat;}
.subline_product {	background:url(../img/mainline_06.jpg) center center no-repeat;}

.subline_wrap {
	width:100%;
	height:150px;
	box-shadow:0 -3px 3px rgba(0,0,0,0.25) inset;
}

.sub_title {
	width:1000px;
	height:60px;
	margin:0 auto;
	text-indent:-9999px;
	overflow:hidden;
}

.sub_story {	background:url(../img/head_story.png) left bottom no-repeat;}
.sub_character {	background:url(../img/head_character.png) left bottom no-repeat;}
.sub_gallery {	background:url(../img/head_gallery.png) left bottom no-repeat;}
.sub_download {	background:url(../img/head_download.png) left bottom no-repeat;}
.sub_special {	background:url(../img/head_special.png) left bottom no-repeat;}
.sub_product {	background:url(../img/head_product.png) left bottom no-repeat;}

#Contents_Sub {
	width:100%;
	background:url(../img/grand_bg.png) center top no-repeat;
	background-size:100%;
	background-attachment:fixed;
	padding-bottom:340px;
	padding-top:36px;
}


#Story {
	background:url(../sub_img/story.png) center top no-repeat;
	width:1000px;
	height:1442px;
	padding-top:48px;
	margin:0 auto 0;
	text-indent:-9999px;
	overflow:hidden;
}

.product_outline {
	width: 760px;
	margin: 36px auto 0;
	color: #5e5e5e;
	font-size: 1.8em;
	line-height: 2;
}

.product_spec {
	width: 760px;
	margin: 60px auto 60px;
	color: #5e5e5e;
	font-size: 1.8em;
	line-height: 2;
}

.product_outline dl, .product_spec dl {
    display: grid;
    grid-template-columns: 10em auto;
    gap: 0 20px;
}

.product_outline dt, .product_spec dt {
    grid-column: 1;
    text-align: right;
    font-weight: bold;
}

.product_outline dt::after, .product_spec dt::after {
    content: ":";
    padding-left: 5px;
}

.product_outline dd{
    grid-column: 2;
    text-align: left;
	font-weight: bold;
}

.product_spec dd {
	grid-column: 2;
	text-align: left;
}

#Gallery {
	width:1000px;
	min-height:550px;
	margin:0 auto;
}

#BGM {
	width:1000px;
	min-height:550px;
	margin:0 auto;
}

#Gallery ul li {
	width:310px;
	height:192px;
	float:left;
	overflow: hidden;
	margin-bottom:36px;
	box-shadow:0 2px 3px rgba(79,155,184,0.5);
	background:#FFF;
	position:relative;
}

.mr35 {
	margin-right:35px;
}

.mr00 {
	margin-right:0;
}

.gallery_thum img {
    -moz-transition: -moz-transform 0.2s linear;
    -webkit-transition: -webkit-transform 0.2s linear;
    -o-transition: -o-transform 0.2s linear;
    -ms-transition: -ms-transform 0.2s linear;
    transition: transform 0.2s linear;
}
.gallery_thum img:hover {
    -webkit-transform: scale(1.25);
    -moz-transform: scale(1.25);
    -o-transform: scale(1.25);
    -ms-transform: scale(1.25);
    transform: scale(1.25);
}

#Chara_select {
	width:100%;
	height:220px;
	background:url(../sub_img/chara/charamenu_bg.png) left top repeat;
}

.charaselect_wrap {
	width:1000px;
	height:220px;
	margin:0 auto;
}

.charaselect_box {
	width:200px;
	height:220px;
	float:left;
	overflow:hidden;
	position:relative;
}

.charaselect_box a {
	width:200px;
	height:220px;
	display:block;
	text-indent:-9999px;
	overflow:hidden;
	position:absolute;
	left:0;
	top:50px;
}

.select_01 {
	background:url(../sub_img/chara/charamenu_bg_kuon.png) left top no-repeat;
}

.select_01 a {
	background:url(../sub_img/chara/charaselect_kuon.png) left top no-repeat;
}

.select_02 {
	background:url(../sub_img/chara/charamenu_bg_rin.png) left top no-repeat;
}

.select_02 a {
	background:url(../sub_img/chara/charaselect_rin.png) left top no-repeat;
}

.select_03 {
	background:url(../sub_img/chara/charamenu_bg_kisara.png) left top no-repeat;
}

.select_03 a {
	background:url(../sub_img/chara/charaselect_kisara.png) left top no-repeat;
}

.select_04 {
	background:url(../sub_img/chara/charamenu_bg_kotone.png) left top no-repeat;
}

.select_04 a {
	background:url(../sub_img/chara/charaselect_kotone.png) left top no-repeat;
}

.select_05 {
	background:url(../sub_img/chara/charamenu_bg_other.png) left top no-repeat;
}

.select_05 a {
	background:url(../sub_img/chara/charaselect_others.png) left top no-repeat;
}

#Chara_area {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_01.png) left top repeat;
	box-shadow:0 5px 3px rgba(79,155,184,0.3);
}

.chara_grad_01 {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_02_grad_01.png) left top repeat-x;
}

.chara_grad_02 {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_02_grad_02.png) left top repeat-x;
}

.chara_grad_03 {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_02_grad_03.png) left top repeat-x;
}

.chara_grad_04 {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_02_grad_04.png) left top repeat-x;
}

.chara_01a {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_03_chara01a.png) center top no-repeat;
	text-indent:-9999px;
	overflow:hidden;
	position:relative;
}

.chara_02a {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_03_chara02a.png) center top no-repeat;
	text-indent:-9999px;
	overflow:hidden;
	position:relative;
}

.chara_03a {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_03_chara03a.png) center top no-repeat;
	text-indent:-9999px;
	overflow:hidden;
	position:relative;
}

.chara_04a {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_03_chara04a.png) center top no-repeat;
	text-indent:-9999px;
	overflow:hidden;
	position:relative;
}

.chara_01b {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_03_chara01b.png) center top no-repeat;
	text-indent:-9999px;
	overflow:hidden;
	position:relative;
}

.chara_02b {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_03_chara02b.png) center top no-repeat;
	text-indent:-9999px;
	overflow:hidden;
	position:relative;
}

.chara_03b {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_03_chara03b.png) center top no-repeat;
	text-indent:-9999px;
	overflow:hidden;
	position:relative;
}

.chara_04b {
	width:100%;
	height:1000px;
	background:url(../sub_img/chara/charalayer_03_chara04b.png) center top no-repeat;
	text-indent:-9999px;
	overflow:hidden;
	position:relative;
}

.phrase {
	width:140px;
	height:755px;
	text-indent:-9999px;
	overflow:hidden;
	position:absolute;
	top:0;
	left:50%;
	margin-left:360px;
}

.phrase_01a {
	background:url(../sub_img/chara/phrase_01a.png) left top no-repeat;
}

.phrase_01b {
	background:url(../sub_img/chara/phrase_01b.png) left top no-repeat;
}

.phrase_02a {
	background:url(../sub_img/chara/phrase_02a.png) left top no-repeat;
}

.phrase_02b {
	background:url(../sub_img/chara/phrase_02b.png) left top no-repeat;
}

.phrase_03a {
	background:url(../sub_img/chara/phrase_03a.png) left top no-repeat;
}

.phrase_03b {
	background:url(../sub_img/chara/phrase_03b.png) left top no-repeat;
}

.phrase_04a {
	background:url(../sub_img/chara/phrase_04a.png) left top no-repeat;
}

.phrase_04b {
	background:url(../sub_img/chara/phrase_04b.png) left top no-repeat;
}

.circle_effect {
	width:250px;
	height:250px;
	position:absolute;
	top:750px;
	left:50%;
	margin-left:250px;
	z-index:3;
    -webkit-animation: spin 5s linear infinite;
    -moz-animation: spin 5s linear infinite;
    -ms-animation: spin 5s linear infinite;
    -o-animation: spin 5s linear infinite;
    animation: spin 5s linear infinite;
}

@-webkit-keyframes spin {
	0% {-webkit-transform: rotate(0deg);}
	100% {-webkit-transform: rotate(360deg);}
}
@-moz-keyframes spin {
	0% {-moz-transform: rotate(0deg);}
	100% {-moz-transform: rotate(360deg);}
}
@-ms-keyframes spin {
	0% {-ms-transform: rotate(0deg);}
	100% {-ms-transform: rotate(360deg);}
}
@-o-keyframes spin {
	0% {-o-transform: rotate(0deg);}
	100% {-o-transform: rotate(360deg);}
}
@keyframes spin {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}

.circle_01a {
	background:url(../sub_img/chara/circle_01a.png) center top no-repeat;
}

.circle_01b {
	background:url(../sub_img/chara/circle_01b.png) center top no-repeat;
}

.circle_02a {
	background:url(../sub_img/chara/circle_02a.png) center top no-repeat;
}

.circle_02b {
	background:url(../sub_img/chara/circle_02b.png) center top no-repeat;
}

.circle_03a {
	background:url(../sub_img/chara/circle_03a.png) center top no-repeat;
}

.circle_03b {
	background:url(../sub_img/chara/circle_03b.png) center top no-repeat;
}

.circle_04a {
	background:url(../sub_img/chara/circle_04a.png) center top no-repeat;
}

.circle_04b {
	background:url(../sub_img/chara/circle_04b.png) center top no-repeat;
}

.change_link {
	width:250px;
	height:250px;
	position:absolute;
	top:750px;
	left:50%;
	margin-left:250px;
	z-index:4;
}

/* DOWNLOAD */

.dl_title {
	font-size:3.5em;
	color:#46d1ff;
	width:940px;
	height:50px;
	line-height:50px;
	margin:0 auto 36px;
	border-bottom:10px dotted #46d1ff;
	font-family: 'Audiowide', cursive;
	text-align:center;
}

.dl_youtube {
	width:853px;
	height:480px;
	margin:0 auto 36px;
	border:5px solid #46d1ff;
	border-radius:20px;
	overflow:hidden;
	box-shadow:0 2px 3px rgba(79,155,184,0.5);
}

.banner_explain {
	background:url(../special/banner_explain.png) center top no-repeat;
	width:100%;
	height:999px;
	text-indent:-9999px;
	margin-top:-36px;
	overflow:hidden;
}

.banner_button {
	width:1000px;
	height:100px;
	margin:0 auto 60px;
}

.banner_title {
	font-size:3.5em;
	color:#46d1ff;
	width:940px;
	height:50px;
	line-height:50px;
	margin:0 auto 36px;
	border-bottom:10px dotted #46d1ff;
	font-family: 'Audiowide', cursive;
	text-align:center;
}

.banner_menu ul {
	width:1000px;
	display:inline-table;
	table-layout: fixed;
	margin:0 0 36px;
}

.banner_menu ul li {
	display:table-cell;
	text-align:center;
	font-family: 'Audiowide', cursive;
	height:40px;
	line-height:40px;
	font-size:1.6em;
	color:#fff;
}

li.jump1 {
	background:#3e96f4;
}

li.jump2 {
	background:#4c5df7;
}

.banner_menu ul li a {
	color:#fff;
	text-decoration:none;
	display:block;
	width:100%;
	height:40px;
}

.banner_menu ul li.jump1 a:hover {
	background:#79b4f2;
	color:#fff;
	text-decoration:none;
}

.banner_menu ul li.jump2 a:hover {
	background:#7d89f5;
	color:#fff;
	text-decoration:none;
}



.urlbox {
	border:0;
	background-color:#ffffff;
	font-size:80%;
	font-family: "Poppins", "Noto Sans SC", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	color:#46d1ff;
}

.banner_wrap_header {
	width:740px;
	margin:0 auto 36px;
}

.banbox_header {
	width:350px;
	padding:10px;
	float:left;
	font-size:1.4em;
	color:#f8c100;
}

.banner_wrap_icon {
	width:880px;
	margin:0 auto 36px;
}

.banbox_icon {
	width:200px;
	padding:10px;
	float:left;
	font-size:1.4em;
	color:#f8c100;
}

.banner_wrap250 {
	width:810px;
	margin:0 auto 36px;
}

.banbox_250 {
	width:250px;
	padding:10px;
	float:left;
	font-size:1.4em;
	color:#f8c100;
}

.banbox_250 textarea {
	width:250px;
	height:80px;
	margin-top:8px;
}

.banner_wrap200 {
	width:660px;
	margin:0 auto 36px;
}

.banbox_200 {
	width:200px;
	padding:10px;
	float:left;
	font-size:1.4em;
	color:#f8c100;
}

.banbox_200 textarea {
	width:200px;
	height:40px;
	margin-top:8px;
}

.banner_wrap600 {
	width:640px;
	margin:0 auto 36px;
}

.banbox_600 {
	width:600px;
	padding:10px;
	float:left;
	font-size:1.4em;
	text-align:center;
	color:#f8c100;
}

.banbox_600 textarea {
	width:600px;
	height:60px;
	margin-top:8px;
}

.banner_wrap150 {
	width:680px;
	margin:0 auto 36px;
}

.banbox_150 {
	width:150px;
	padding:10px;
	float:left;
	font-size:1.4em;
	text-align:center;
	color:#f8c100;
}

.banbox_150 textarea {
	width:150px;
	height:100px;
	margin-top:8px;
}

.banner_wrap800 {
	width:820px;
	margin:0 auto 36px;
}

.banbox_800 {
	width:800px;
	padding:10px;
	float:left;
	font-size:1.4em;
	text-align:center;
	color:#f8c100;
}

.banbox_800 textarea {
	width:800px;
	height:60px;
	margin-top:8px;
}

.twitter_explain {
	background:url(../special/twitter_explain.png) center top no-repeat;
	width:100%;
	height:1115px;
	text-indent:-9999px;
	overflow:hidden;
	margin-top:-36px;
}

.valentine_explain {
	background:url(../special/valentine.png) center top no-repeat;
	width:1000px;
	height:740px;
	text-indent:-9999px;
	overflow:hidden;
	margin:-36px auto 0;
}

.privilege_prologue {
	background:url(../special/privilege_prologue.png) center top no-repeat;
	width:100%;
	height:1115px;
	text-indent:-9999px;
	overflow:hidden;
	margin-top:-36px;
}

.fpb {
	background:url(../special/fpb.png) center top no-repeat;
	width:100%;
	height:1115px;
	text-indent:-9999px;
	overflow:hidden;
	margin-top:-36px;
	margin-bottom:36px;
}

.hatsubai {
	background:url(../special/hatsubai.jpg) center top no-repeat;
	width:100%;
	height:1414px;
	text-indent:-9999px;
	overflow:hidden;
	margin-top:16px;
	margin-bottom:36px;
}

.soundtrack {
	background:url(../special/soundtrack.jpg) center top no-repeat;
	width:100%;
	height:1240px;
	text-indent:-9999px;
	overflow:hidden;
	margin-top:16px;
	margin-bottom:36px;
}

.soundtrackDL {
	background:url(../special/soundtrackDL.jpg) center top no-repeat;
	width:100%;
	height:1800px;
	text-indent:-9999px;
	overflow:hidden;
	margin-top:16px;
	margin-bottom:36px;
}
.tokuten_yoyaku {
	width:1000px;
	height:710px;
	margin:0 auto 60px;
	text-indent:-9999px;
	overflow:hidden;
	background:url(../special/tokuten_yoyaku.png) center top no-repeat;
}

.tokuten_shokai {
	width:1000px;
	height:578px;
	margin:0 auto 60px;
	text-indent:-9999px;
	overflow:hidden;
	background:url(../special/tokuten_shokai.png) center top no-repeat;
}

.tokuten_tenpo {
	width:1000px;
	height:137px;
	margin:0 auto 60px;
	text-indent:-9999px;
	overflow:hidden;
	background:url(../special/tokuten_tenpo.png) center top no-repeat;
}

.tenpo_wrap {
	width:1000px;
	margin:0 auto;
}

.tokubox {
	height:650px;
	float:left;
	margin-bottom:60px;
	position:relative;
	box-shadow:0 2px 3px rgba(79,155,184,0.5);
}

.shoplink {
	width:334px;
	height:43px;
	position:absolute;
	top:604px;
	left:100%;
	margin-left:-337px;
	overflow:hidden;
}

.shoplink a:hover img{
	position:relative;
	left:5px;
	top:0;
}

.toku_sofmap {
	width:1000px;
	background:url(../special/toku_sofmap.jpg) center top no-repeat;
}

.toku_getchu {
	width:1000px;
	background:url(../special/toku_getchu.jpg) center top no-repeat;
}

.toku_official {
	width:1000px;
	background:url(../special/toku_official.jpg) center top no-repeat;
}

.toku_melonbooks {
	width:470px;
	background:url(../special/toku_melonbooks.jpg) center top no-repeat;
	margin-right:60px;
}

.toku_medio {
	width:470px;
	background:url(../special/toku_medio.jpg) center top no-repeat;
}

.toku_goodwill {
	width:470px;
	background:url(../special/toku_goodwill.jpg) center top no-repeat;
	margin-right:60px;
}

.toku_trader {
	width:470px;
	background:url(../special/toku_trader.jpg) center top no-repeat;
}

.toku_original {
	width:310px;
	height:320px;
	float:left;
	margin-bottom:35px;
	position:relative;
	box-shadow:0 2px 3px rgba(79,155,184,0.5);
}

.shoplink2 {
	width:230px;
	height:27px;
	position:absolute;
	bottom:3px;
	right:3px;
	overflow:hidden;
}

.shoplink2 a:hover img{
	position:relative;
	left:5px;
	top:0;
}

.toku_bookmate {	background:url(../special/toku_bookmate.jpg) center top no-repeat;}
.toku_sita {	background:url(../special/toku_sita.jpg) center top no-repeat;}
.toku_takarajima {	background:url(../special/toku_takarajima.jpg) center top no-repeat;}
.toku_famies {	background:url(../special/toku_famies.jpg) center top no-repeat;}
.toku_chukyo {	background:url(../special/toku_chukyo.jpg) center top no-repeat;}
.toku_otachu {	background:url(../special/toku_otachu.jpg) center top no-repeat;}
.toku_mk {	background:url(../special/toku_mk.jpg) center top no-repeat;}
.toku_amazon {	background:url(../special/toku_amazon.jpg) center top no-repeat;}
.toku_seagull {	background:url(../special/toku_seagull.jpg) center top no-repeat;}
.toku_alice {	background:url(../special/toku_alice.jpg) center top no-repeat;}
.toku_prop {	background:url(../special/toku_prop.jpg) center top no-repeat;}
.toku_surugaya {	background:url(../special/toku_surugaya.jpg) center top no-repeat;}
.toku_furukawa {	background:url(../special/toku_furukawa.jpg) center top no-repeat;}
.toku_visco {	background:url(../special/toku_visco.jpg) center top no-repeat;}
.toku_gamers {	background:url(../special/toku_gamers.jpg) center top no-repeat;}



.campaign_listtable {
	width:800px;
	margin:0 auto 48px;
}

.campaign_listtable table th {
	height:24px;
	width:300px;
	background-color:#ffc2ce;
	border:1px solid #ff6282;
	color:#72192b;
	padding-top:3px;
	padding-bottom:3px;
	font-size:1.3em;
	text-align:center;
}

.campaign_listtable table td {
	height:24px;
	width:500px;
	background-color:#fff0f3;
	border:1px solid #ff6282;
	color:#5e5e5e;
	font-size:1.3em;
	padding-top:3px;
	padding-bottom:3px;
	text-align:center;
}

.subchara_01 {
	width:100%;
	height:850px;
	padding:5px 0;
	background:url(../sub_img/chara/subchara_01.png) center top no-repeat;
	margin:24px auto 48px;
	text-indent:-9999px;
	overflow:hidden;
	position:relative;
}

.subchara_02 {
	width:100%;
	height:700px;
	padding:5px 0;
	background:url(../sub_img/chara/subchara_02.png) center top no-repeat;
	margin:0 auto 48px;
	text-indent:-9999px;
	overflow:hidden;
	position:relative;
}

.subchara_03 {
	width:100%;
	height:700px;
	padding:5px 0;
	background:url(../sub_img/chara/subchara_03.png) center top no-repeat;
	margin:0 auto 48px;
	text-indent:-9999px;
	overflow:hidden;
	position:relative;
}

#ImpressionTrial {
	width:1000px;
	height:563px;
	overflow:hidden;
	margin:0 auto 0;
}

.imp_explain {
	width:716px;
	height:391px;
	background:url(../special/impression_explain.png) center top no-repeat;
	margin:32px auto 60px;
	text-indent:-9999px;
	overflow:hidden;
}

.chara_voice {
	width:241px;
	height:48px;
	position:absolute;
	left:50%;
	margin-left:-200px;
	top:212px;
}

.chara_voice ul {
	padding:0 0 0 73px;
}

.chara_voice ul li {
	float:left;
	margin-right:30px;
	margin-top:21px;
}

.chara_voice ul li a:hover {
	position:relative;
	top:2px;
	left:0;
}

.voicewrap_01{background:url(../sub_img/chara/voice_bg_01.png) center top no-repeat;}
.voicewrap_02{background:url(../sub_img/chara/voice_bg_02.png) center top no-repeat;}
.voicewrap_03{background:url(../sub_img/chara/voice_bg_03.png) center top no-repeat;}
.voicewrap_04{background:url(../sub_img/chara/voice_bg_04.png) center top no-repeat;}
.voicewrap_05{background:url(../sub_img/chara/voice_bg_05.png) center top no-repeat;}
.voicewrap_06{background:url(../sub_img/chara/voice_bg_06.png) center top no-repeat;}
.voicewrap_07{background:url(../sub_img/chara/voice_bg_07.png) center top no-repeat;}
.voicewrap_08{background:url(../sub_img/chara/voice_bg_08.png) center top no-repeat;}

.costume_variation {
	background:url(../sub_img/chara/costume_variation.png) center top no-repeat;
	width:378px;
	height:106px;
	position:absolute;
	left:50%;
	margin-left:-150px;
	top:880px;
}

.costume_variation ul {
	margin-top:32px;
}

.costume_variation ul.costume05 {
	padding-left:10px;
}

.costume_variation ul.costume04 {
	padding-left:47px;
}

.costume_variation ul.costume03 {
	padding-left:83px;
}

.costume_variation ul.costume02 {
	padding-left:119px;
}

.costume_variation ul li {
	float:left;
	background:url(../sub_img/chara/costume_variation_icon.png) center top no-repeat;
	width:60px;
	height:60px;
	margin-right:5px;
	padding:3px 5px 5px 3px;
}

.costume_variation_sub {
	background:url(../sub_img/chara/costume_variation.png) center top no-repeat;
	width:378px;
	height:106px;
	position:absolute;
	left:50%;
	margin-left:-475px;
}

.subchara_01 .costume_variation_sub {
	top:650px;
}

.subchara_02 .costume_variation_sub {
	top:530px;
}

.subchara_03 .costume_variation_sub {
	top:500px;
}

.costume_variation_sub ul {
	margin-top:32px;
}

.costume_variation_sub ul.costume02 {
	padding-left:119px;
}

.costume_variation_sub ul.costume04 {
	padding-left:47px;
}

.costume_variation_sub ul li {
	float:left;
	background:url(../sub_img/chara/costume_variation_icon.png) center top no-repeat;
	width:60px;
	height:60px;
	margin-right:5px;
	padding:3px 5px 5px 3px;
}

#World {
	width:1000px;
	margin:0 auto;
}

.bgbox {
	background:#FFF;
	border-radius:10px;
	box-shadow:0 2px 3px rgba(79,155,184,0.5);
	margin-bottom:36px;
}

.bg_image {
	width:100%;
	height:300px;
	overflow:hidden;
	background-size:100%;
	border-radius:10px 10px 0 0 ;
	position:relative;

}

.bg_title {
	width:300px;
	height:35px;
	background-color:rgba(54,199,167,0.8);
	position:absolute;
	left:-5px;
	top:20px;
	color:#FFF;
	font-weight:bold;
	line-height:35px;
	font-size:1.5em;
	box-shadow:5px 5px 0px rgba(79,155,184,0.8);
}

.bg_image a {
	display:block;
	width:100%;
	height:100%;
	text-indent:-9999px;
	overflow:hidden;
	opacity:0;
	background-color:#FFF;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		-ms-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
}

.bg_image a:hover {
	opacity:0.3;
}

.bgbox img {
	width:100%;
}

.bg_txt {
	padding:15px 25px;
	font-size:1.5em;
	text-align:left;
	color:#49526b;
}

.bg_other_image {
	padding-left:25px;
	padding-bottom:15px;
}

.bg_other_image ul li {
		float:left;
		width:128px;
		margin-right:15px;
		padding:4px;
		background:#FFF;
		box-shadow:0 1px 2px rgba(79,155,184,0.35);
}

.bg_other_image ul li img {
		width:100%;
}

.bg01 {	width:1000px;float:left;}
.bg02 {	width:482px;float:left;margin-right:36px;}
.bg03 {	width:482px;float:left;}
.bg04 {	width:1000px;float:left;}
.bg05 {	width:482px;float:left;margin-right:36px;}
.bg06 {	width:482px;float:left;}

.bg01 .bg_image {	background:url(../sub_img/world/birdseye_view.jpg) center center no-repeat;}
.bg02 .bg_image {	background:url(../sub_img/world/bg_school.jpg) center center no-repeat;}
.bg03 .bg_image {	background:url(../sub_img/world/bg_denken.jpg) center center no-repeat;}
.bg04 .bg_image {	background:url(../sub_img/world/bg_login_2.jpg) center center no-repeat;}
.bg05 .bg_image {	background:url(../sub_img/world/bg_multicity.jpg) center center no-repeat;}
.bg06 .bg_image {	background:url(../sub_img/world/bg_arena.jpg) center center no-repeat;}

.trial_table {
	width:840px;
	margin:32px auto 60px;
}

.trial_table table {
	width:840px;
}

.trial_table table th {
	height:24px;
	background-color:#b5edff;
	border:1px solid #46d1ff;
	color:#222222;
	padding-top:3px;
	padding-bottom:3px;
	font-size:1.3em;
	text-align:center;
}

.trial_table table th a {
	color:#FFF;
	text-decoration:none;
}

.trial_table table th a:hover {
	color:#FFF;
	text-decoration:underline;
}

.trial_table table td {
	height:50px;
	background-color:#ffffff;
	border:1px solid #46d1ff;
	color:#5e5e5e;
	font-size:1.3em;
	padding-top:3px;
	padding-bottom:3px;
	text-align:center;
}

.trial_table table td a {
	display:block;
	margin:0 auto;
	width:220px;
	height:30px;
	font-family: "Poppins", "Noto Sans SC", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	background:#46d1ff;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	-khtml-border-radius: 15px;
	border-radius: 15px;
	border-style: none;
	font-weight:bold;
	color:#FFF;
	line-height:30px;
	text-decoration:none;
	font-size:120%;
}

.trial_table table td a.disabled {
	background:#ccc !important;
	color:#999 !important;
	cursor:not-allowed;
	pointer-events:none;
}

/* Team Testimonials Styles */
.team_testimonials {
	width: 853px;
	margin: 36px auto 36px;
	background: rgba(255, 255, 255, 0.95);
	border: 3px solid #46d1ff;
	border-radius: 15px;
	box-shadow: 0 2px 8px rgba(79, 155, 184, 0.3);
	overflow: hidden;
}

.testimonials_title {
	background: linear-gradient(135deg, #46d1ff, #5ee0ff);
	padding: 15px 0;
	text-align: center;
	border-bottom: 2px solid #46d1ff;
}

.testimonials_title h3 {
	color: #ffffff;
	font-size: 1.6em;
	font-weight: bold;
	margin: 0;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
	font-family: "Poppins", "Noto Sans SC", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}

.testimonials_content {
	padding: 20px;
}

.testimonial_item {
	display: flex;
	align-items: flex-start;
	margin-bottom: 20px;
	padding: 15px;
	background: rgba(181, 237, 255, 0.2);
	border-left: 4px solid #46d1ff;
	border-radius: 8px;
	transition: all 0.3s ease;
}

.testimonial_item:hover {
	background: rgba(181, 237, 255, 0.3);
	transform: translateX(5px);
	box-shadow: 0 2px 5px rgba(79, 155, 184, 0.2);
}

.testimonial_item:last-child {
	margin-bottom: 0;
}

.member_info {
	min-width: 150px;
	margin-right: 20px;
	text-align: right;
	padding-top: 2px;
}

.member_name {
	font-weight: bold;
	color: #46d1ff;
	font-size: 1.8em;
	font-family: "Poppins", "Noto Sans SC", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	margin-bottom: 4px;
}

.member_position {
	font-size: 1.2em;
	color: #666;
	font-weight: normal;
	font-family: "Noto Sans SC", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	opacity: 0.8;
}

.member_comment {
	flex: 1;
	color: #333;
	line-height: 1.6;
	font-size: 1.6em;
	text-align: left;
	font-family: "Noto Sans SC", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}

.member_comment code {
    font-family: "Cascadia Mono", "Noto Sans SC", monospace;
}

.countdown_box {
	width:850px;
	height:140px;
	background:#FFF;
	margin:0 auto 24px;
	border-radius:15px;
	box-shadow:0 2px 3px rgba(79,155,184,0.5);
}

.countdown_box img {
	border-radius:15px;
}

a.happylink {
	display:block;
	width:840px;
	height:72px;
	line-height:24px;
	color:#fff;
	margin:24px auto 0;
	background:rgba(0,209,154,1.00);
	border-radius:36px;
	font-size:1rem;
	font-weight:bold;
	text-decoration:none;
	transition:all 0.3s;
}

a:hover.happylink {
	background:rgba(106,239,204,1.00);
}



.soundtrack_banner {
	display: flex;
	justify-content: center;
	padding-bottom: 10px;
}

.soundtrack_banner li {
	padding:0 5px;
	box-sizing:border-box;
}

.soundtrack_banner li img {
	max-width:100%;
	height: auto;
	border:solid 1px #ccc;
}

#BGM {
    width: 1000px;
    margin: 0 auto 20px auto;
    padding: 20px 0;
    background-color: #ffffff00;
    text-align: center;
}

#audio-player {
    width: 960px;
    margin: 0 auto;
    padding: 20px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

#player-controls {
    display: flex;
    justify-content: center;
    align-items: center;
}

#player-controls button {
    background-color: transparent;
    border: none;
    padding: 0;
    margin: 0 10px;
    cursor: pointer;
    line-height: 0;
}

#player-controls button .icon {
    width: 24px;
    height: 24px;
    display: block;
    background-color: #00aaaa;
    -webkit-mask-size: cover;
    mask-size: cover;
}

#player-controls button .icon.icon-prev {
    -webkit-mask-image: url(../svg/skip-backward.svg);
    mask-image: url(../svg/skip-backward.svg);
}
#player-controls button .icon.icon-next {
    -webkit-mask-image: url(../svg/skip-forward.svg);
    mask-image: url(../svg/skip-forward.svg);
}
#player-controls button .icon.icon-play-pause {
    -webkit-mask-image: url(../svg/play-pause.svg);
    mask-image: url(../svg/play-pause.svg);
    mask-position: 0 0;
}
#player-controls button.playing .icon.icon-play-pause {
    mask-position: -24px 0;
}

#player-controls button:hover .icon {
    background-color: #00ffff;
}

#song-info {
    margin-top: 15px;
	font-size: 1.2rem;
}

#playlist {
    width: 960px;
    margin: 20px auto 0;
    padding: 20px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

#playlist h3 {
    text-align: left;
    margin-top: 0;
	font-size: 1.2rem;
}

#playlist ul {
    list-style: none;
    padding: 0;
}

#playlist li {
    padding: 10px;
    cursor: pointer;
    border-bottom: 1px solid #ddd;
    text-align: left;
	font-size: 1.2rem;
}

#playlist li:hover, #playlist li.active {
    background-color: #9fffff;
}

#progress-container {
    width: 100%;
    height: 10px;
    background-color: #e0e0e0;
    border-radius: 5px;
    cursor: pointer;
    margin: 10px 0;
}

#progress-bar {
    width: 0;
    height: 100%;
    background-color: #00aaaa;
    border-radius: 5px;
}

#time-container {
    font-size: 1.1rem;
    margin-bottom: 10px;
}

#volume-container {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0;
    margin-left: 15px;
}

#volume-slider {
    width: 120px;
}

/* Heimu (Black Screen/Spoiler) Effect by moegirl*/
.heimu,
.heimu rt {
    --heimu-color: #1a1a2e;
    --heimu-text-color: #fff;
    --heimu-link-color: #46d1ff;
    --heimu-visited-link-color: #5ee0ff;
    --heimu-new-link-color: #ff6b9d;
    --heimu-new-visited-link-color: #ff8fab;
    --heimu-extiw-visited-link-color: #7c4dff;
    background-color: var(--heimu-color);
    transition: background-color 0.13s linear, color 0.13s linear;
    border-radius: 3px;
    padding: 1px 2px;
}

.heimu,
.heimu a,
a .heimu,
a.new .heimu,
span.heimu a:visited,
span.heimu a.new,
span.heimu a.external,
span.heimu a.external:visited,
span.heimu a.extiw,
span.heimu a.extiw:visited,
span.heimu a.mw-disambig,
span.heimu a.mw-redirect {
    transition: color 0.13s linear;
    color: var(--heimu-color);
    text-shadow: none;
}

span.heimu:hover,
span.heimu:active {
    color: var(--heimu-text-color);
    background-color: var(--heimu-color);
}

span.heimu:hover a,
a:hover span.heimu {
    color: var(--heimu-link-color);
}

span.heimu:hover a:visited,
a:visited:hover span.heimu {
    color: var(--heimu-visited-link-color);
}

span.heimu:hover a.new,
a.new:hover span.heimu {
    color: var(--heimu-new-link-color);
}

span.heimu a.new:hover:visited,
a.new:hover:visited span.heimu {
    color: var(--heimu-new-visited-link-color);
}

span.heimu:hover a.extiw:visited,
a.extiw:visited:hover span.heimu {
    color: var(--heimu-extiw-visited-link-color);
}