@charset "utf-8";
* {
	margin: 0;
	padding: 0;
}

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}
.clearfix {
  min-height: 1px;
}
.pc {
    display: block !important;
}
.sp {
    display: none !important;
}
.rblock {
	position: relative;
}
.ablock {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.rblock img, .ablock img {
	display: block;
}
.pblock img, .bl img {
    display: block;
	width: 100%;
}
h1,h2,h3,h4,h5 {
    margin:0;
    padding:0;
}
li {
	list-style: none;
}
img {
	border: 0;
	vertical-align: top;
}
a {
	color: #0099FF;
}

html {
	width: 100%;
    background-color: #000;
    /* min-height: 100%; */
    font-size: 16px;
}
body {
	width: 100%;
	font-family: -apple-system, BlinkMacSystemFont, "BIZ UDPGothic", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, "Noto Sans JP", "Noto Sans CJK JP", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 1rem;
    background-image: linear-gradient(90deg, #eee0fc 0, #d6c7fb 50%, #eee0fc 100%);
    background-position: center top;
    background-size: 180% auto;
    overflow-x: hidden;
}
.serif {
	font-family: 'Noto Serif JP', YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}
#lovl {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 10000;
    background: #eee0fc;
}
#loadimg {
    position: absolute;
    width: 43px;
    height: 11px;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -5px;
    -webkit-animation: a_load_img 0.5s linear 0s infinite;	
    animation: a_load_img 0.5s linear 0s  infinite;	
}
@-webkit-keyframes a_load_img {
	0%   { opacity: 0.3;}
	50%   { opacity: 1;}
	100% { opacity: 0.3;}
}
@keyframes a_load_img {
	0%   { opacity: 0.3;}
	50%   { opacity: 1;}
	100% { opacity: 0.3;}
}
.contents {
    position: relative;
    width: 1000px;
    margin: 0 auto;
}
#bg {
    position: relative;
    background: url(../images/common/check.png) center top repeat;
}
#wrapper {
    position: relative;
    width: 100%;
    min-width: 1000px;
}
#top #wrapper,
#character #wrapper {
	overflow-x: hidden;
}

#menu {
	position: absolute;
	width: 100%;
    left: 0;
    top: 0;
	background: url("../images/common/menu/menubg.png") center top no-repeat;
	background-size: 100% 100%;
	z-index: 100;
}
#menu ul {
	width: 100%;
	height: 0;
	padding-top: 6.7%;
}
#menu li {
	position: absolute;
	top: 0;
	height: 0;
	padding-top: 6.7%;
}
#menu li a,
#menu li span {
	position: absolute;
	display: block;
	width: 100%;
	padding-top: 54px;
	height: 0;
	left: 0;
	top: 0;
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 100% auto;
	overflow: hidden;
}
#menu li span {
	opacity: 0.2;
}
#m00 a, #m00 span { background-image: url("../images/common/menu/m00.png"); }
#m01 a, #m01 span { background-image: url("../images/common/menu/m01.png"); }
#m02 a, #m02 span { background-image: url("../images/common/menu/m02.png"); }
#m03 a, #m03 span { background-image: url("../images/common/menu/m03.png"); }
#m04 a, #m04 span { background-image: url("../images/common/menu/m04.png"); }
#m05 a, #m05 span { background-image: url("../images/common/menu/m05.png"); }
#m06 a, #m06 span { background-image: url("../images/common/menu/m06.png"); }
#m07 a, #m07 span { background-image: url("../images/common/menu/m07.png"); }
#m08 a, #m08 span { background-image: url("../images/common/menu/m08.png"); }
#m00 { width: 6.3%; left: 2.5%; }
#m02 { width: 13.8%; left: 12.2%; }
#m03 { width: 12.3%; left: 37%; }
#m04 { width: 6.4%; left: 52.7%; }
#m05 { width: 10.3%; left: 75.1%; }
#m06 { width: 4.4%; left: 29.3%; }
#m07 { width: 9.3%; left: 62.5%; }
#m08 { width: 8.7%; left: 88.8%; }

#menu_d .contents .menu_d { padding-top: 6.6%; }

#topheader {
	position: relative;
	width: 100%;
}
.wmax {
	position: relative;
	width: 1800px;
	left: 50%;
	margin-left: -900px;
}
#tp02 { position: absolute; width: 46.5%; left: 27.5%; top: 70.95%; }
#tp03 { position: absolute; width: 53.55%; left: 23.22%; top: 85.24%; }

#maincontents {
	position: relative;
	width: 100%;
}

#bguide #maincontents:before,
#gallery #maincontents:before,
#map #maincontents:before,
#howtoplay #maincontents:before,
#club #maincontents:before,
.c_ch00 #maincontents:before,
.c_sp01 #maincontents:before,
.c_ne01 #maincontents:before {
  content:"";
  display:block;
  position:absolute;
  left: 0;
  top: 0;
  width:100%;
  height:100%;
  height:100vh;
  background: url("../images/common/bgsub.jpg") center top no-repeat;
}
#bguide #maincontents.fixed:before,
#gallery #maincontents.fixed:before,
#map #maincontents.fixed:before,
#howtoplay #maincontents.fixed:before,
#club #maincontents.fixed:before,
.c_ch00 #maincontents.fixed:before,
.c_sp01 #maincontents.fixed:before,
.c_ne01 #maincontents.fixed:before {
  position:fixed;
}
/*
.c_ch00 #wrapper {
    background: url(../images/common/bgsub2.jpg) center top repeat-y;
    background-size: 100% auto;
}
.c_ch00  #maincontents::before {
    position: absolute;
    background-image: url(../images/common/bgsub1.jpg);
}
*/
@media screen and (min-width:1801px) {
	.wmax {
		width: 100%;
		max-width: 1920px;
		left: 0;
		margin-left: auto;
		margin-right: auto;
	}
	#bguide #maincontents:before,
	#gallery #maincontents:before,
	#map #maincontents:before,
	#howtoplay #maincontents:before,
	#club #maincontents:before,
	.c_ch00 #maincontents:before,
	.c_sp01 #maincontents:before,
	.c_ne01 #maincontents:before {
		background-size: 100% auto;
	}
}

#header {
    position: relative;
    width: 100%;
    background-color: rgba(255,255,255,0.42);
    z-index: 2;
}
#mv {
    position: relative;
    width: 100.6%;
    margin: 0 0 0 -0.3%;
}

#header_b {
    position: relative;
    width: 100%;
    background-color: #16087E;
}

.h_b {
    padding-top: 7.4%;
}
#h_y {
    position: absolute;
    width: 180%;
    margin-left: -40%;
    left: 0;
    top: 0;
    z-index: 3;
}
#schedule {
    width: 95.6%;
    margin: 1.7% auto 0 auto;
}
#schedule img {
    box-shadow: 0 0 5px 1px #f89dfb;
}
#schedule img:first-child {
    margin-bottom: 2%;
}
#a_bn {
    width: 95.6%;
    margin: 1% auto;
}
#a_bn a {
    -webkit-transition-duration: 0.2s;
    transition-duration: 0.2s;
}
#a_bn a:hover {
	opacity: 0.7;
}

#info {
    position: relative;
    margin-top: 0.9%;
}
#ltinfo {
    margin-top: 4%;
    position: relative;
    margin-left: 1%;
    width: 100%;
}
#ltinfo_2 h4+div {
	position: relative;
	margin-top: -1.29%;
	width: 85.69%;
}
#ltinfo_3 h4+div {
	position: relative;
	margin-top: -1.18%;
}
#ltinfo_5 {
	padding-bottom: 2%;
}
#ltinfo_5 h4+div {
	position: relative;
	margin-top: -0.5%;
}
#topicsarea {
	position: relative;
	margin-top:5%;
	z-index:3;
}
#topicsarea:empty {
	margin-top: 0;
}
.topics {
	position: relative;
	width: 93.4%;
	margin: 4% auto 0 auto;
	border-radius: 8px;
	border: 8px solid #fff;
}
.topics.t2 {
	width: 95%;
	border-radius: 0;
	border: 3px solid #fff;
}
.b_end {
	display: block;
	text-align: center;
	position: absolute;
	width: 100%;
	font-weight: bold;
	left:0;
	top:50%;
	font-size: 10px;
	transform: translateY(-50%);
}
#btn_eni2_ni { position: absolute; width: 56.74%; left: 40.68%; top: 0; margin-top: 2.56%; }
#btn_eni2_ytl { position: absolute; width: 35.43%; left: 55.78%; top: 0; margin-top: 2.46%; }


#btn_jtr1 { position: absolute; width: 27.73%; left: 56.31%; top: 0; margin-top: 92.29%; }
#btn_jtr2 { position: absolute; width: 93.68%; left: 3.31%; top: 0; margin-top: 161.77%; }

#btn_eni { position: absolute; width: 56.74%; left: 40.04%; top: 0; margin-top: 42.07%; }
#btn_eni2 { position: absolute; width: 35.43%; left: 55.67%; top: 0; margin-top: 149.03%; }

#btn_jf20_ytl { position: absolute; width: 33.1%; left: 56.0%; top: 0; margin-top: 270.4%; }

#btn_ofm { position: absolute; width: 34.84%; left: 57.68%; top: 0; margin-top: 2%; }

#btn_vsc { position: absolute; width: 95.47%; left: 2.63%; top: 0; margin-top: 3.89%; }

#btn_ofm2_link { position: absolute; width: 10.1%; left: 14.21%; top: 0; margin-top: 1.26%; }

#btn_ofm2 { position: absolute; width: 34.84%; left: 57.68%; top: 0; margin-top: 2%; }

#lsc2021_map {
    position: absolute; width: 77.57%; margin: 18.32% 0 0 11.26%; padding-top: 47.55%;
    left: 0; top: 0;
    border: 3px solid #fff;
    border-radius: 3px;
    box-shadow: 3px 3px 7px 0 rgba(0,0,0,0.75);
}
#lsc2021_map iframe {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
#btn_lsc2021 { position: absolute; width: 86.1%; left: 7.47%; top: 0; margin-top: 3.57%; }
#btn_lsc2021_ov { position: absolute; width: 100%; height: 100%; left: 0; top: 0;
    background-color: #000; background-color: rgba(0,0,0,0.8);
    font-size: 40px; color: #fff; font-weight: bold;
    display: none; justify-content: center; align-items: center; }
#btn_lsc2021_ov.end { display: flex; }
#btn_lsc2021_ov span { display: block; }

#btn_lsc2021_yt { position: absolute; width: 34.84%; left: 57.68%; top: 0; margin-top: 58.2%; }


#about1 {
    position: relative;
	/* margin-top: -4.5%; */
    z-index: 2;
}

#h_a { position: absolute; width: 180%; left:50%; top: 0; margin-left: -90%;  }
#about1 h2 {
    position: relative;
    margin: 0 0 0 8.2%;
    padding-top: 5.5%;
    width: 85%;
}
#i_a { position: absolute; width: 39.6%; left: 50%; top: 0;margin-top: 17.1%; opacity: 0.7;}
#y1_2 { position: absolute; width: 54.8%; left: 41.6%; margin-top: 42.2%; opacity: 0.7;}
#y1_1 { position: absolute;  width: 54.5%; left: 35.4%; margin-top: 40.3%; opacity: 0.7;}
.ss {
    position: relative;
    border: 4px solid rgba(172,104,249,0.69);
    box-shadow: 9px 9px 8px 0px rgba(172,104,249,0.32);
}
.ss:after {
    display: block;
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    box-shadow: 0px 0px 0px 4px rgba(0,0,0,0.2) inset;
}
#a_ss1 {
    margin: 4.6% 0 0 1.6%;
    width: 47.8%;
}
#a_ss2 {
    margin: -9.8% 0 0 32.9%;
    width: 32.3%;
}
p.a_tx {
    position: absolute;
    left: 0;
    top: auto;
    width: 45.4%;
    margin: -37.0% 0 0 51.6%;
}
#about2 {
    position: relative;
}
#h_a2 { position: absolute;
    width: 150%; left:-25%; top: 4%;
    background-image: url(../images/top/checka2.png), linear-gradient(90deg, #395d87 0, #395d87 25%, #57409e 75%,#57409e 100%);
    background-repeat: repeat, no-repeat;
    transform-origin:  center top;
    background-size: auto 20%, 100% auto;
    -webkit-transform: perspective(800px) rotateZ(-7.5deg) rotateX(20deg);
    transform: perspective(800px) rotateZ(-7.5deg) rotateX(20deg);
    filter: blur(1px);
}
#h_a2_2 {
    position: absolute;
    width: 81.4%; left: 25.4%; top: 0;margin-top: -30.5%;
}
#a2_c {
    position: absolute;
    width: 62.2%; left: 41.6%; margin-top: -16.8%;
    z-index:5;
}
#h_a2_i { padding-top: 42.0%; }
#i_a2 { position: absolute; width: 39.6%; left: 4.5%; top: 0;margin-top: -3.6%; opacity: 0.9;}
p.a2_tx { position: relative; width: 54.5%; padding-top: 10.4%; margin: 0  0 0 1%; z-index:6;}
#y2_1 { position: absolute; width: 54.5%; left: 10.2%; margin-top: 22.5%; opacity: 0.5;}
#y2_2 { position: absolute; width: 54.5%; left: 3.4%; margin-top: 24.5%; opacity: 0.7;}

#a2_ss1 { width: 45.2%; margin-left: 9.1%; margin-top: 2%;  z-index:6; }
#a2_b { position: absolute; width: 30.4%; left: 60.9%; top: 0; margin-top: 29.5%; z-index:7;}

#about3 {
    position: relative;
    padding-top: 46.6%;
    margin-bottom: 5%;
}
#i_a3 { position: absolute; width: 39.5%; left: 58.4%; top: 0; margin-top: -0.6%; }
p.a3_tx { position: absolute; width: 47.4%; left: 50.6%; top: 0; margin-top: 7.4%; z-index: 3;}
#y3_1 { position: absolute; width: 54.5%; left: 35.4%; top: 0; margin-top: 27.3%; opacity: 0.7;}
#y3_2 { position: absolute; width: 54.8%; left: 41.5%; top: 0; margin-top: 29.2%; opacity: 0.7;}
#a3_ss1 { position: absolute; width: 47.3%; left: 1.6%; top: 0; margin-top: 7.4%; }
#a3_ss2f { position: absolute; width: 34.3%; left: 30.5%; top: 0; margin-top: 24.6%; }
#a3_ss2f .ss {    transform: rotate(-9.4deg); }

#footer {
	position: relative;
    z-index: 6;
    width: 100%;
    background-color: #000;
    color: #fff;
    font-size: 12px;
	overflow: hidden;
}
#commonfooter {
    position: relative;
    background-color: #fff;
}
.cpsns {
    border-top: 1px solid #fff;
    display: flex;
    width: 96%;
    margin: 0 auto;
    justify-content: space-between;
}
#snsset {
    margin-top: 0.8%;
    width: 15.82%;
    padding-left: 1%;
}
#snsset ul {
    display: flex;
    justify-content: space-between;
}
#snsset li {
	width: 26%;
}
#snsset li img {
	display: block;
}
#snsset a:hover { opacity: 0.7; }

#copyright {
    padding: 0.8% 0 1.4% 0;
    line-height: 1.3;
}
#copyright p:first-child {
    margin-bottom: 1%;
}
/* character */
.c_ch00 h2 { width: 44.8%; margin-left: 27.7%; padding-top: 3.3%; }
.c_ch00 h3 { width: 59.1%; margin-left: 20.5%; margin-top: 2.9%; }

.c_ch00 #maincontents ul { width: 98.9%; margin: 3% auto 0 auto; padding-bottom: 7.7%; }
.c_ch00 #maincontents li { width: 50%; margin-bottom: 1.6%; float: left; position: relative; }

.c_ch00 #maincontents li .cnew {
	position: absolute; width: 23.69%; left: 75.7%; top: 0; margin-top: -2.21%;
	display: block;
	height: 0;
	padding-top: 20.28%;
	background: url("../images/character/cnew.png") left top no-repeat;
	background-size: 100% auto;
    pointer-events: none;
}

@media screen and (max-width:999px) {
    #wrapper {
        min-width: unset;
        background-size: 100% auto;
        overflow-x: hidden;
    }
    #bg {
        width: 100%;
        background-size: 4.5% auto;
        min-height: unset;
    }
    .contents {
        width: 100%;
    }
	.wmax {
		width: 180%;
		left: 50%;
		margin-left: -90%;
	}
	#bguide #maincontents:before,
	#gallery #maincontents:before,
	#map #maincontents:before,
	#howtoplay #maincontents:before,
	#club #maincontents:before,
	.c_ch00 #maincontents:before,
	.c_sp01 #maincontents:before,
	.c_ne01 #maincontents:before {
		background-position: center top;
        background-size: 180% auto;
	}
}
@media screen and (max-width:767px) {
    /* common */
    .pc {
        display: none !important;
    }
    .sp {
        display: block !important;
    }
    #wrapper {
        min-width: unset;
        background-size: 100% auto;
        overflow-x: clip;
    }
    #bg {
        width: 100%;
        background-size: 4.5% auto;
        min-height: unset;
    }
    .contents {
        width: 100%;
    }
	#menu {
		width: 100%;
		height: 0;
		padding-top: 16.979%;
		background: url("../images/common/menu/menubg_sp.png") center top no-repeat;
		background-size: 100% auto;
		z-index: 100;
	}
	#menu .contents {
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
	}
	#menu ul {
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		padding-top: 0;
	}
	#menu li {
		position: absolute;
		height: 0;
		padding-top: 6.875%;
	}
	#menu li a {
		display: block;
		padding-top: 32.82%;
	}
	#m00 a { background-image: url("../images/common/menu/m00_sp.png"); }
	#m01 a { background-image: url("../images/common/menu/m01_sp.png"); }
	#m02 a { background-image: url("../images/common/menu/m02_sp.png"); }
	#m03 a { background-image: url("../images/common/menu/m03_sp.png"); }
	#m04 a { background-image: url("../images/common/menu/m04_sp.png"); }
	#m05 a { background-image: url("../images/common/menu/m05_sp.png"); }
	#m06 a { background-image: url("../images/common/menu/m06_sp.png"); }
	#m07 a { background-image: url("../images/common/menu/m07_sp.png"); }
	#m08 a { background-image: url("../images/common/menu/m08_sp.png"); }
	#menu #m00 { width: 20.62%; left: 7.6%; top: 11.04%; }
	#menu #m01 { width: 20.62%; left: 28.75%; top: 11.04%; }
	#menu #m02 { width: 20.62%; left: 50%; top: 11.04%; }
	#menu #m03 { width: 20.62%; left: 7.6%; top: 53.98%; }
	#menu #m04 { width: 20.62%; left: 28.75%; top: 53.98%; }
	#menu #m05 { width: 20.62%; left: 71.14%; top: 53.98%; }
	#menu #m06 { width: 20.62%; left: 71.14%; top: 11.04%; }
	#menu #m07 { width: 20.62%; left: 50%; top: 53.98%; }
	#menu #m00 { width: 20.62%; left: 7.6%; top: 11.04%; }
	#menu #m02 { width: 20.62%; left: 28.75%; top: 11.04%; }
	#menu #m03 { width: 20.62%; left: 71.14%; top: 11.04%; }
	#menu #m04 { width: 20.62%; left: 7.6%; top: 53.98%; }
	#menu #m05 { width: 20.62%; left: 50%; top: 53.98%; }
	#menu #m06 { width: 20.62%; left: 50%; top: 11.04%; }
	#menu #m07 { width: 20.62%; left: 28.75%; top: 53.98%; }
	#menu #m08 { width: 20.62%; left: 71.14%; top: 53.98%; }

	
	#menu_d .contents .menu_d { padding-top: 16.979%; }
	.wmax {
		width: 180%;
		left: 50%;
		margin-left: -90%;
	}
	#bguide #maincontents:before,
	#gallery #maincontents:before,
	#map #maincontents:before,
	#howtoplay #maincontents:before,
	#club #maincontents:before,
	.c_ch00 #maincontents:before,
	.c_sp01 #maincontents:before,
	.c_ne01 #maincontents:before {
		min-width: initial;
		min-width: unset;
	}
	#bguide #maincontents:before,
	#gallery #maincontents:before,
	#map #maincontents:before,
	#howtoplay #maincontents:before,
	#howtoplay.c_htp03 #maincontents:before,
	#club #maincontents:before,
	.c_ch00 #maincontents:before,
	.c_sp01 #maincontents:before,
	.c_ne01 #maincontents:before {
		background-image: none;
	}
	#header .contents,
    #header_b .contents {
        width: 108%;
        margin-left: -4%;
    }
    .ntwf {
        background-color: rgba(255,255,255,0.42);
        border: 2px solid #625d12;
        box-shadow: 0 0 0 3px rgba(198,158,253,0.62) inset, 2px 2px 2px 0 rgba(0,0,0,0.3);
    }
    #schedule {
        width: 82%;
        margin: 2.91% auto 0 auto;
    }
    #schedule img {
        box-shadow: 0 0 3px 1px #f89dfb;
    }
    #a_bn {
        width: 82%;
        margin: 1% auto 2% auto;
    }
    #info {
        margin: 0.83% auto 0 auto;
		/* padding-top: 5.625%; */
    }
    .tn {
    }
	#about1, #about2, #about3 {
		width: 80.4%;
		margin-left: auto;
		margin-right: auto;
	}
    #about1 {
        margin-top: 0%;
    }
    #about1 h2 {
        position: relative;
        margin: 0 0 0 4%;
        padding-top: 5.5%;
        width: 94%;
    }
    .ss {
        border: 2px solid rgba(172,104,249,0.69);
        box-shadow: 4px 4px 4px 0px rgba(172,104,249,0.32);
    }
	.c_ch00 h2 { width: 59.79%; margin-left: 20.31%;  padding-top: 4.58%; }
	.c_ch00 h3 { width: 83.75%; margin-left: 8.22%; margin-top: 2.08%; }
	.c_ch00 #maincontents ul { width: 87.5%; margin: 3% auto 0 auto; padding-bottom: 7.7%; }


	#h_a2 { top: 4%;  }
    #h_a2_i { padding-top: 35.0%; }

    #tf_tx {
        position: relative;
        width: 92%; left: auto; top: auto; margin: 0% auto 0 auto;
		padding-bottom: 4%;
    }
    .cpsns {
        position: static;
        display: block;
    }
    #snsset {
        position: absolute;
        left: 10%;
        top: 0;
		margin-top: 22%;
        width: 42%;
		padding: 0;
        padding: 5% 0 3% 0;
    }
    #snsset li { width: 25%; }
    #snsset li a { display: block; }
    #snsset li img {
        width: 100%;
        height: auto;
        display: block;
    }
    #footer {
        font-size: x-small;
    }
    #btn_gotop {
        width: 80%;
    }
}