body{
	font-family:'RobotoMono-VariableFont_wght';
}
/* スマホ向け対応 */
/* .message0_fore .message_outer{
	-webkit-transform: translate3d(0, 0, 0px);
	transform: translate3d(0, 0, 0px);
}
img.fixlayer{
	-webkit-transform: translate3d(0, 0, 1px);
	transform: translate3d(0, 0, 1px);
} */
a{
	color:cyan;
}
/* クリック禁止エリア（最上階） */
#none_click_area{
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 10000000000000000;
	display: none;
}
/* フォント */
@font-face {
	font-family:"makinas";
	src:url("Makinas-4-Flat.otf")format('opentype'),
	url("Makinas-4-Flat.woff")format('woff');
	font-weight:normal;font-style:normal;
}
@font-face {
	font-family:"RobotoMono-VariableFont_wght";
	src:url("RobotoMono-VariableFont_wght.otf")format('opentype'),
	url("RobotoMono-VariableFont_wght.woff")format('woff');
	font-weight:normal;font-style:normal;
}
/* 明朝体 */
.mintyo.message_inner,.mintyo.message_inner span{
	font-family: serif !important;
}
/* ゴシック */
.gothic{
	font-family: "SourceCodePro-Medium","メイリオ", "Meiryo", "Osaka",sans-serif,"游ゴシック体","ＭＳ Ｐゴシック", "MS PGothic","Quicksand",  "Yu Gothic", "YuGothic", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro";
}
/* キャラ名にフォント指定 */
.chara_name_area{
  font-family: 'makinas','sans-serif' !important;
}

.button_graphic {
  padding: 0 !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
}
.button_graphic span.red_mini{
	font-size: 0.7em;
	color: red;
	margin: 0px 5px;
}
/* レイヤー特殊効果 */
/* animがレイヤーにきかんからそのフォロー */
.layer.animation{
	opacity: 1;
	transition: 1.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

/* バックログ */
/* 横長 */
.x .log_body{
	width:70% !important;
	height: 70% !important;
}
/* 縦長 */
.y .log_body{
	width:87% !important;
	height: 76% !important;
}
.y .backlog_gl_title{
	margin-left:-1.5em !important;
}
.y .backlog_chara_name{
	margin-left:-1em !important;
}
.y .img_label_backlog{
	width:450px;
	height: auto;
}
.y .menu_item{
	top:25px !important;
	right: 25px !important;
	width:110px;
	height: auto;
}
.y .menu_item.al{
	/* top:25px !important;
	right: 140px !important;
	width:110px;
	height: auto; */
}
.y .al_help{
	right: 35px !important;
}

.log_body{
	/* margin-top: 130px; */
  font-size: 25px;
  padding-left: 2em ;
  padding-right: 1em ;
  margin-left:auto;
  margin-right:auto;
  background-color: none !important;
  color:#fdeff2 !important;
}
.backlog_text{
  line-height: 2em;
}


.img_label_backlog{
	/* position:absolute;
	top:0px;
	left:0px; */
}
.menu_item{
  position: absolute !important;
  top: 10px;
  right: 100px;
}
.menu_item.al{
  position: absolute !important;
  top: 10px;
  right: 100px;
}
.al_help{
  position: absolute !important;
  top: 30px;
  right: 50px;
}

/* キャラ見出し */
.backlog_chara_name{
  padding-left: 0.8em;
  padding-top: 7px;
  margin: 0.2em;
  margin-left: -1.5em;
  margin-top: 0.5em;
  font-weight: bold;
  font-size: 26px;
  width:400px;
  height: 46px;
  position:relative;
  opacity: 0.9;
}
.backlog_chara_name::before{
  content:'';
  width:407px;
  position:absolute;
  top:0px;
  left:13px;
}
.backlog_chara_name::after{
  content:'';
  width:407px;
  position:absolute;
  top:51px;
  left:0px;
}
.backlog_chara_name.pul{
	background: #192036;
	background: linear-gradient(135deg, transparent 10px, #192036 0) top left,
	linear-gradient(-135deg, transparent 0px, #192036 0) top right,
	linear-gradient(-45deg, transparent 10px, #192036 0) bottom right,
	linear-gradient(45deg, transparent 0px, #192036 0) bottom left;
	background-size: 52% 52%;
	background-repeat: no-repeat;
}
.backlog_chara_name.pul::before{
  border-top: 2px solid #c9da71;
}
.backlog_chara_name.pul::after{
  border-bottom: 2px solid #cb305e;
}
.backlog_chara_name.dom{
	background: #16152f;
	background: linear-gradient(135deg, transparent 10px, #16152f 0) top left,
	linear-gradient(-135deg, transparent 0px, #16152f 0) top right,
	linear-gradient(-45deg, transparent 10px, #16152f 0) bottom right,
	linear-gradient(45deg, transparent 0px, #16152f 0) bottom left;
	background-size: 52% 52%;
	background-repeat: no-repeat;
}
.backlog_chara_name.dom::before{
  border-top: 2px solid #4bc0cc;
}
.backlog_chara_name.dom::after{
  border-bottom: 2px solid #8f2e9c;
}

/* 選択肢見出し */
.backlog_gl_title{
  font-size: 27px;
  text-align: center;
  padding-top: 12px;
    margin-bottom: 1em;
    margin-left: auto;
    margin-right: auto;
    margin-top: 1.5em;
    font-weight: bold;
    width:550px;
    height: 50px;
    position:relative;
    opacity: 0.9;
}
.backlog_gl_title::before{
  content:'';
  width:535px;
  position:absolute;
  top:-2px;
  left:15px;
}
.backlog_gl_title::after{
  content:'';
  width:535px;
  position:absolute;
  top:60px;
  left:0px;
}
.backlog_gl_title.pul{
  	background: #192036;
  	background: linear-gradient(135deg, transparent 10px, #192036 0) top left,
  	linear-gradient(-135deg, transparent 0px, #192036 0) top right,
  	linear-gradient(-45deg, transparent 10px, #192036 0) bottom right,
  	linear-gradient(45deg, transparent 0px, #192036 0) bottom left;
  	background-size: 52% 52%;
  	background-repeat: no-repeat;
}

.backlog_gl_title.pul::before{
  border-top: 4px solid #5edfdb;
}
.backlog_gl_title.pul::after{
  border-bottom: 4px solid #cb305e;
}
.backlog_gl_title.dom{
  	background: #16152f;
  	background: linear-gradient(135deg, transparent 10px, #16152f 0) top left,
  	linear-gradient(-135deg, transparent 0px, #16152f 0) top right,
  	linear-gradient(-45deg, transparent 10px, #16152f 0) bottom right,
  	linear-gradient(45deg, transparent 0px, #16152f 0) bottom left;
  	background-size: 52% 52%;
  	background-repeat: no-repeat;
}

.backlog_gl_title.dom::before{
  border-top: 4px solid #dddf68;
}
.backlog_gl_title.dom::after{
  border-bottom: 4px solid #8f2e9c;
}

/* 選択肢後のbr無効 */
.backlog_gl_title + br{
  display: none;
}
/* キャラ別配色 */
span.NAVIGATOR{
  font-style: italic;;
  color:#99c3d4;
}
/* 現在地アナウンスレイヤー */
#position_anna{
	position: absolute;
	z-index: 9998;
	font-family: serif;
	font-weight:bold;
	display: flex;
	flex-direction:column;
	justify-content: flex-end;
	align-items:flex-start;
	width: 100%;
	height: 100%;

	text-shadow: 0px 0px 10px #eeeeec,0px 0px 3px #eeeeec;
	color:#131312;
}
#position_anna #p_cont{
	opacity: 0;
	transition: 1.2s cubic-bezier(0.22, 1, 0.36, 1);
	display: flex;
	flex-direction:column;
	justify-content: center;
	align-items:flex-start;
}
#position_anna.is-animated #p_cont{
	background: radial-gradient(ellipse, rgba(238,238,236,1) 0%, rgba(238,238,236,0) 50%);
	opacity:1;
}
#position_anna.is-animated{
}
#position_anna .wrap{
	overflow: hidden;
	opacity: 0;
}
#position_anna .area{
	font-size:2em;
	margin:0px 1em;
}
#position_anna .title{
	font-size:3.8em;
	text-align: left;
	margin:0 0 0 0.5em;
}

#position_anna .wrap div::after{
	background: linear-gradient(90deg, rgba(20,20,20,0) 0%, rgba(20,20,20,1) 50%, rgba(20,20,20,0) 100%);
  content: '';
  display: block;
  height: 3px;
  width: 0;
  transform: translateX(-50%);
  transition: 1s cubic-bezier(0.22, 1, 0.36, 1);
  position: absolute;
  bottom: 0;
  left: 50%;
}
#position_anna .wrap div.title::after{
	bottom:12px !important;
}
#position_anna.is-animated2 .wrap div::after{
	width: 100%;
}
#position_anna .wrap div{
	opacity: 0;
	transform: matrix(1, 0, 0, 1, 0, 100);
	transition: 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}
#position_anna.is-animated .wrap{
	opacity: 1;
}
#position_anna.is-animated .wrap div{
	opacity: 1;
	transform: matrix(1, 0, 0, 1, 0, 0);
}



.display_menu{
  background-color: rgba(0,0,0,0.5);
}

/* BACK */
.b_back.hid{
	visibility: hidden !important;
}

/* VOLUME */
.v_block{
  display: block !important;
}
.v_hide{
  display: none;
}
/* スクロールバー */
::-webkit-scrollbar{
  width: 20px;
}
::-webkit-scrollbar-track{
  background: none ;
  border: none;
  border-radius: 0px;
}
::-webkit-scrollbar-thumb{
  background: rgba(189, 188, 196, 0.5);
  border-radius: 15px;
  box-shadow: none;
}

/* ぼかし */
.blur_f{
  -webkit-transition: filter 0.8s ease;
  -moz-transition: filter 0.8s ease;
  -ms-transition: filter 0.8s ease;
  -o-transition: filter 0.8s ease;
  transition: filter 0.8s ease;
  filter: blur(8px);
}

.blur_f.unknown1{
	filter: brightness(25%) saturate(20%) blur(8px) !important;
}
.blur_f.unknown2{
	filter: brightness(30%) blur(8px) !important;
}
.fixlayer,.message0_fore,.m_volume{
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
.fixlayer.blur_f,.message0_fore.blur_f,.m_volume.blur_f{
  opacity: 0 !important;
}
/* ぼかすと変になるから補正 */
.message0_fore{
  z-index: 999;
}

/* スマホ用クローズボタン */
.bl_close.menu_close{

}

/* ////////////////////////////////フラッシュ用アニメ（イベント用） */
.l_flash{
  animation: layer_flash 250ms ease-in 1;
}
@keyframes layer_flash {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
	25%{
    opacity: 1;
	}
	45%{
    opacity: 0;
	}
	55%{
    opacity: 0;
	}
	75%{
    opacity: 1;
	}
	80%{
    opacity: 1;
	}
	100%{
    opacity: 0;
	}
}
.l_flash2{
  animation: layer_flash2 100ms ease-in 1;
}
@keyframes layer_flash2 {
  0% {
    opacity: 0;
  }
  40% {
    opacity: 1;
  }
	ß%{
    opacity: 1;
	}
	100%{
    opacity: 0;
	}
}
.icon_flash{
  animation: icon_flash 1s ease-in 1;
}@keyframes icon_flash {
	0% {
    opacity: 0;
  }
	30% {
		opacity: 1;
	}
  60% {
    opacity: 0;
  }
	70%{
    opacity: 1;
	}
	80%{
    opacity: 0;
	}
	90%{
    opacity: 1;
	}
	95%{
    opacity: 0;
	}
	100%{
    opacity: 1;
	}
}
/* 00opやXXXの時のチュートリアルしか使わないflash */
.fla{
  animation: an_fla 2s linear infinite;
}
@keyframes an_fla {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }
	100% {
		opacity: 1;
	}
}
/* D.O.MエリアのShout時のアニメ。ぴょこぴょこ跳ねる */
.pyoko_jump{
	animation: pyoko_jump 0.8s linear 1;
}
@keyframes pyoko_jump {
	0%{
		margin-bottom: 0px;
	}
	25%{
		margin-bottom: 10px;
	}
	50%{
		margin-bottom: 0px;
	}
	75%{
		margin-bottom: 15px;
	}
	100%{
		margin-bottom: 0px;
	}

}

/* glink */
/* アルバムモード用 */
.button_graphic.notchoice{
	color:gray;
}
/* セーブデータリセットの特殊選択肢 */
.button_graphic.data_reset,.button_graphic.reset_submit,.button_graphic.to_dom,.button_graphic.to_pul,.button_graphic.yes_savedata{
	color:#ff32bc;
}
.glink_c{
  animation: gc_f 1s linear infinite;
}
@keyframes gc_f {
  0%,50%,80% {
    opacity: 1;
  }

  30%,70%,100% {
    opacity: 0;
  }
}
.glink_e{
  animation: gc_e 500ms linear 1;
}
@keyframes gc_e {
  0% {
    opacity: 1;
  }

  100%{
    opacity: 0;
  }
}
.gclick{
  width:100%;
  height:100%;
}
/* checkアイコン */
.check{
  height: 70%;
  width:auto;
}

/* グリッチエフェクト */
.layer_noise{
  animation:skew 3s infinite,flash 1s infinite;
}
.layer_noise img{
  animation:glitch 3s both infinite;
}
@keyframes flash {
  0% {
    opacity: 1;
  }
  100% {
    opacity: .9;
  }
}
@keyframes skew {
  0% {
    transform: none;
  }
  33% {
    transform: none;
  }
  33.3% {
    transform: skewX(30deg);
  }
  33.6% {
    transform: skewX(-30deg);
  }
  33.9% {
    transform: none;
  }
  66% {
    transform: none;
  }
  66.3% {
    transform: skewX(5deg);
  }
  66.6% {
    transform: skewX(-5deg);
  }
  66.9% {
    transform: none;
  }
  77% {
    transform: none;
  }
  77.3% {
    transform: skewX(15deg);
  }
  77.6% {
    transform: skewX(-15deg);
  }
  77.9% {
    transform: none;
  }
}
@keyframes glitch {
  0% {
    transform: translate(0);
  }
  12.5% {
    transform: translate(-1px, 1px);
  }
  37.5% {
    transform: translate(-1px, -1px);
  }
  62.5% {
    transform: translate(1px, 1px);
  }
  87.5% {
    transform: translate(1px, -1px);
  }
  100% {
    transform: translate(0);
  }
}

/* ////////////////////////////ローディング */
#loading_p{
  position: absolute;
  width: 100%;
  height: 100%;
  background: black;
  z-index: 99999999;
}
/* 縦型の場合すべて倍に */
/* 縦長 */
.y div.loader{
	transform: scale(3,3);
	top: calc(50% - 96px) !important;
}
.y div.loading_text{
	font-size: 3em !important;
	left: calc(50% - 100px) !important;
	width: 200px;
}

.loader {
  position: absolute;
  top: calc(50% - 32px);
  left: calc(50% - 32px);
  width: 64px;
  height: 64px;
  border-radius: 50%;
  perspective: 800px;
}

.inner {
  position: absolute;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

.inner.one {
  left: 0%;
  top: 0%;
  animation: rotate-one 1s linear infinite;
  border-bottom: 3px solid #EFEFFA;
}

.inner.two {
  right: 0%;
  top: 0%;
  animation: rotate-two 1s linear infinite;
  border-right: 3px solid #EFEFFA;
}

.inner.three {
  right: 0%;
  bottom: 0%;
  animation: rotate-three 1s linear infinite;
  border-top: 3px solid #EFEFFA;
}

@keyframes rotate-one {
  0% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
  }
}

@keyframes rotate-two {
  0% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
  }
}

@keyframes rotate-three {
  0% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
  }
}
.loading_text{
    font-family: 'RobotoMono-VariableFont_wght','sans-serif' !important;
    position: absolute;
    top: calc(50% - -50px);
    left: calc(50% - 50px);
    width: 100px;
    height: 50px;
    text-align: center;
    font-size: 1em;
    text-align: center;
    line-height: 0.95em;
    color: #FFF;
    text-shadow: 0 0 0.05em #F06292, 0 0 0.1em #F06292, 0 0 0.15em #F06292, 0 0 0.3em #F06292;
    filter: saturate(80%);
}

/* ////////////////////////////////コンフィグ */
#conf_body{
  background-color: rgba(0,0,0,0.5);
  position: absolute;
  z-index: 9999999;
  top:0;
  left:0;
  width:100%;
  height: 100%;
  font-family: 'RobotoMono-VariableFont_wght','sans-serif' !important;
}
.conf_r{
  position: absolute;
  top:17%;
  z-index: 9999999;
  display: flex;
  flex-direction:column;
  align-items:center;
  justify-content:space-between;
  width:100%;
  height: 52%;
  opacity: 0;
}
.pul .conf_r div.label_r{
  font-weight: 600;
  color: white;
	text-shadow:
		0 0 0.05em #37d9ff,
		0 0 0.10em #37d9ff,
		0 0 0.15em #37d9ff,
		0 0 0.30em #37d9ff;
	filter: saturate(80%);
}

.dom .conf_r div.label_r{
  font-weight: 600;
  color: white;
	text-shadow:
		0 0 0.05em #e8a32d,
		0 0 0.10em #e8a32d,
		0 0 0.15em #e8a32d,
		0 0 0.30em #e8a32d;
	filter: saturate(80%);
}

#auto_bar{
  position:absolute;
  z-index: 9999999;
  bottom:10px;
  right: 10px;
  width:100px;
  height: 20px;
  background-color: gray;
}
/* 横長 */
.x .conf_r div.box_r{
	display: flex;
	width:60%;
}
.x input[type=range]:not(#pages_r) {
	-webkit-appearance: none;
	width: 500px !important;
	margin: 7.9px 0;
}
.x .conf_r div.label_r{
	font-size: 1.5em;
	width:100px;
}
/* 縦長 */
.y .conf_r div.box_r{
	display: flex;
	width:95%;
}
.y input[type=range]:not(#pages_r) {
	-webkit-appearance: none;
	width: 350px;
	margin: 7.9px 0;
}
.y .conf_r div.label_r{
	font-size: 1.7em;
	width:120px;
}

input[type=range]:focus {
  outline: none;
}

input{
  background-color:transparent;
  opacity: 1 !important;
}


/* lite_mode */
#lite_r{
  justify-content: flex-end;
}
#lite_r .label_r{
	width: auto;
	margin-right: 20px;
}
#lite_r .switchArea{
	display: inline;
	margin: 0;
}
/* //////////////////////////////////////////pul */
input.pul[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 25.2px;
  cursor: pointer;
  box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
  background:  linear-gradient( 90deg, #d4e6e4 0% 3%, #eceece 5% 10%, #f2a5a7 40% 60%, #e84370 90% 100% );
  border-radius: 7.5px;
  border: 0.6px solid #ac3b52;
}
input.pul[type=range]::-webkit-slider-thumb {
  box-shadow: 1.9px 1.9px 0.7px rgba(0, 0, 0, 0.38), 0px 0px 1.9px rgba(13, 13, 13, 0.38);
  border: 1.3px solid #968886;
  height: 41px;
  width: 26px;
  border-radius: 4px;
  background: #fffff6;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -8.5px;
}
input.pul[type=range]:focus::-webkit-slider-runnable-track {
  background: linear-gradient( 90deg, #dff1ef 0% 3%, #f1f4d3 5% 10%, #fbc4c5 40% 60%, #fa83a4 90% 100% );
}
input.pul[type=range]::-moz-range-track {
  width: 100%;
  height: 25.2px;
  cursor: pointer;
  box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
  background:  linear-gradient( 90deg, #d4e6e4 0% 3%, #eceece 5% 10%, #f2a5a7 40% 60%, #e84370 90% 100% );
  border-radius: 7.5px;
  border: 0.6px solid #ac3b52;
}
input.pul[type=range]::-moz-range-thumb {
  box-shadow: 1.9px 1.9px 0.7px rgba(0, 0, 0, 0.38), 0px 0px 1.9px rgba(13, 13, 13, 0.38);
  border: 1.3px solid #968886;
  height: 41px;
  width: 26px;
  border-radius: 4px;
  background: #fffff6;
  cursor: pointer;
}
input.pul[type=range]::-ms-track {
  width: 100%;
  height: 25.2px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
input.pul[type=range]::-ms-fill-lower {
  background: #ffd2a5;
  border: 0.6px solid #ac3b52;
  border-radius: 15px;
  box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
}
input.pul[type=range]::-ms-fill-upper {
background:  linear-gradient( 90deg, #d4e6e4 0% 3%, #eceece 5% 10%, #f2a5a7 40% 60%, #e84370 90% 100% );
  border: 0.6px solid #ac3b52;
  border-radius: 15px;
  box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
}
input.pul[type=range]::-ms-thumb {
  box-shadow: 1.9px 1.9px 0.7px rgba(0, 0, 0, 0.38), 0px 0px 1.9px rgba(13, 13, 13, 0.38);
  border: 1.3px solid #968886;
  height: 41px;
  width: 26px;
  border-radius: 4px;
  background: #fffff6;
  cursor: pointer;
  height: 25.2px;
}
input.pul[type=range]:focus::-ms-fill-lower {
background:  linear-gradient( 90deg, #d4e6e4 0% 3%, #eceece 5% 10%, #f2a5a7 40% 60%, #e84370 90% 100% );
}
input.pul[type=range]:focus::-ms-fill-upper {
  background: linear-gradient( 90deg, #dff1ef 0% 3%, #f1f4d3 5% 10%, #fbc4c5 40% 60%, #fa83a4 90% 100% );
}

/* //////////////////////////////////////////dom */
input.dom[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 25.2px;
  cursor: pointer;
  box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
  background: linear-gradient( 90deg, #f1e7e9 0% 3%, #f5d6f0 5% 10%, #a68ed9 40% 60%, #504dcf 90% 100% );
  border-radius: 7.5px;
  border: 0.6px solid #5576a2;
}
input.dom[type=range]::-webkit-slider-thumb {
  box-shadow: 1.9px 1.9px 0.7px rgba(0, 0, 0, 0.38), 0px 0px 1.9px rgba(13, 13, 13, 0.38);
  border: 1.2px solid #888894;
  height: 41px;
  width: 26px;
  border-radius: 4px;
  background: #f2ffff;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -8.5px;
}
input.dom[type=range]:focus::-webkit-slider-runnable-track {
  background: #ffffff;
}
input.dom[type=range]::-moz-range-track {
  width: 100%;
  height: 25.2px;
  cursor: pointer;
  box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
  background: linear-gradient( 90deg, #f1e7e9 0% 3%, #f5d6f0 5% 10%, #a68ed9 40% 60%, #504dcf 90% 100% );
  border-radius: 7.5px;
  border: 0.6px solid #5576a2;
}
input.dom[type=range]::-moz-range-thumb {
  box-shadow: 1.9px 1.9px 0.7px rgba(0, 0, 0, 0.38), 0px 0px 1.9px rgba(13, 13, 13, 0.38);
  border: 1.2px solid #888894;
  height: 41px;
  width: 26px;
  border-radius: 4px;
  background: #f2ffff;
  cursor: pointer;
}
input.dom[type=range]::-ms-track {
  width: 100%;
  height: 25.2px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
input.dom[type=range]::-ms-fill-lower {
  background: #ebcbff;
  border: 0.6px solid #5576a2;
  border-radius: 15px;
  box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
}
input.dom[type=range]::-ms-fill-upper {
	background: linear-gradient( 90deg, #f1e7e9 0% 3%, #f5d6f0 5% 10%, #a68ed9 40% 60%, #504dcf 90% 100% );
  border: 0.6px solid #5576a2;
  border-radius: 15px;
  box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
}
input.dom[type=range]::-ms-thumb {
  box-shadow: 1.9px 1.9px 0.7px rgba(0, 0, 0, 0.38), 0px 0px 1.9px rgba(13, 13, 13, 0.38);
  border: 1.2px solid #888894;
  height: 41px;
  width: 26px;
  border-radius: 4px;
  background: #f2ffff;
  cursor: pointer;
  height: 25.2px;
}
input.dom[type=range]:focus::-ms-fill-lower {
	background: linear-gradient( 90deg, #f1e7e9 0% 3%, #f5d6f0 5% 10%, #a68ed9 40% 60%, #504dcf 90% 100% );
}
input.dom[type=range]:focus::-ms-fill-upper {
  background: #ffffff;
}



/* //////////////////////////////////////////disabled_r */
input.disabled_r[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 25.2px;
  cursor: pointer;
  box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
  background: #f0f0f0;
  border-radius: 7.5px;
  border: 0.6px solid #787878;
}
input.disabled_r.disabled_r[type=range]::-webkit-slider-thumb {
  box-shadow: 0.7px 0.7px 0.9px #ffffff, 0px 0px 0.7px #ffffff;
  border: 1.1px solid #ffffff;
  height: 41px;
  width: 26px;
  border-radius: 4px;
  background: #dcdcdc;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -8.5px;
}
input.disabled_r[type=range]:focus::-webkit-slider-runnable-track {
  background: #fdfdfd;
}
input.disabled_r[type=range]::-moz-range-track {
  width: 100%;
  height: 25.2px;
  cursor: pointer;
  box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
  background: #f0f0f0;
  border-radius: 7.5px;
  border: 0.6px solid #787878;
}
input.disabled_r[type=range]::-moz-range-thumb {
  box-shadow: 0.7px 0.7px 0.9px #ffffff, 0px 0px 0.7px #ffffff;
  border: 1.1px solid #ffffff;
  height: 41px;
  width: 26px;
  border-radius: 4px;
  background: #dcdcdc;
  cursor: pointer;
}
input.disabled_r[type=range]::-ms-track {
  width: 100%;
  height: 25.2px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
input.disabled_r[type=range]::-ms-fill-lower {
  background: #e3e3e3;
  border: 0.6px solid #787878;
  border-radius: 15px;
  box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
}
input.disabled_r[type=range]::-ms-fill-upper {
  background: #f0f0f0;
  border: 0.6px solid #787878;
  border-radius: 15px;
  box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
}
input.disabled_r[type=range]::-ms-thumb {
  box-shadow: 0.7px 0.7px 0.9px #ffffff, 0px 0px 0.7px #ffffff;
  border: 1.1px solid #ffffff;
  height: 41px;
  width: 26px;
  border-radius: 4px;
  background: #dcdcdc;
  cursor: pointer;
  height: 25.2px;
}
input.disabled_r[type=range]:focus::-ms-fill-lower {
  background: #f0f0f0;
}
input.disabled_r[type=range]:focus::-ms-fill-upper {
  background: #fdfdfd;
}

/* チェックボックス */
/* === ボタンを表示するエリア ============================== */
.switchArea {
 line-height    : 38px;                /* 1行の高さ          */
 letter-spacing : 0;                   /* 文字間             */
 text-align     : center;              /* 文字位置は中央     */
 font-size      : 20px;                /* 文字サイズ         */

 position       : relative;            /* 親要素が基点       */
 margin-left    : auto;                /* 中央寄せ           */
 width          : 105px !important;               /* ボタンの横幅       */
 /* background     : #fff;                /* デフォルト背景色   */
 margin-top:7px;
}

/* === チェックボックス ==================================== */
.switchArea input[type="checkbox"] {
 display        : none;            /* チェックボックス非表示 */
}

/* === チェックボックスのラベル（標準） ==================== */
.switchArea label {
 display        : block;               /* ボックス要素に変更 */
 box-sizing     : border-box;          /* 枠線を含んだサイズ */
 height         : 42px;                /* ボタンの高さ       */
 border         : 2px solid #999999;   /* 未選択タブのの枠線 */
 border-radius  : 21px;                /* 角丸               */
 position: relative;
 z-index: 10000000;
}

/* === チェックボックスのラベル（ONのとき） ================ */
.pul .switchArea input[type="checkbox"]:checked +label {
 border-color   : #37d9ff;             /* 選択タブの枠線     */
}
.dom .switchArea input[type="checkbox"]:checked +label {
 border-color   : #e8a32d;             /* 選択タブの枠線     */
}

/* === 表示する文字（標準） ================================ */
.switchArea label span:after{
 content        : "Mute";               /* 表示する文字       */
 padding        : 0 0 0 25px;          /* 表示する位置       */
 color          : #999999;             /* 文字色             */
}
#lite_r .switchArea label span:after{
	content        : "OFF";               /* 表示する文字       */
}
/* === 表示する文字（ONのとき） ============================ */
.switchArea  input[type="checkbox"]:checked + label span:after{
 content        : "ON";                /* 表示する文字       */
 padding        : 0 25px 0 0;          /* 表示する位置       */
}
#lite_r .switchArea  input[type="checkbox"]:checked + label span:after{
	content        : "ON";                /* 表示する文字       */
}
.pul .switchArea  input[type="checkbox"]:checked + label span:after{
 color          : #37d9ff;             /* 文字色             */
}
.dom .switchArea  input[type="checkbox"]:checked + label span:after{
 color          : #e8a32d;             /* 文字色             */
}

/* === 丸部分のSTYLE（標準） =============================== */
.switchArea #swImg {
 position       : absolute;            /* 親要素からの相対位置*/
 z-index: 9999999;
 width          : 34px;                /* 丸の横幅           */
 height         : 34px;                /* 丸の高さ           */
 background     : #999999;             /* カーソルタブの背景 */
 top            : 4px;                 /* 親要素からの位置   */
 left           : 4px;                 /* 親要素からの位置   */
 border-radius  : 17px;                /* 角丸               */
 transition     : .2s;                 /* 滑らか変化         */
}

/* === 丸部分のSTYLE（ONのとき） =========================== */
.switchArea input[type="checkbox"]:checked ~ #swImg {
 transform      : translateX(63px);    /* 丸も右へ移動       */
}
.pul .switchArea input[type="checkbox"]:checked ~ #swImg {
 background     : #37d9ff;             /* カーソルタブの背景 */
}
.dom .switchArea input[type="checkbox"]:checked ~ #swImg {
 background     : #e8a32d;             /* カーソルタブの背景 */
}

/* --------------------------メンテンスウィンドウ-------------------------- */
#mainte_window{
	width: 300px;
	height: 100px;
	background-color: white;
	opacity: 0.5;
	font-size: 0.8em;
	position: fixed;
	top:10px;
	left:10px;
	z-index: 9999999999;
}
#mainte_window textarea{
	width: 100%;
	height: 100%;
}

/* --------------------------エントランス・アーカイブ（アルバム）共通-------------------------- */
.cont_show{
	display: block !important;
}
.cont_show_flex{
	display: flex !important;
}

/* --------------------------トップページ-------------------------- */
#lastup{
	position: absolute;
	z-index: 9998;
	color:whitesmoke;
	width: 100%;
	height: 100%;
	text-align: center;
	font-family: serif;
	-moz-text-shadow: 0px 0px 5px rgba(255, 252, 240, 0.8);
	-webkit-text-shadow: 0px 0px 5px rgba(255, 252, 240, 0.8);
	-ms-text-shadow: 0px 0px 5px rgba(255, 252, 240, 0.8);
	text-shadow: 0px 0px 5px rgba(255, 252, 240, 0.8);
}
#vol_caution{
	font-family: serif;
	color: white;
	position: absolute;
	text-align: center;
	width: 100%;
	bottom: 100px;
	font-size: 1.5em;
	text-shadow: 0px 0px 5px rgba(168, 120, 81, 0.8);
}

/* --------------------------エントランス-------------------------- */
/* 初期アナウンス。チュートリアル用案内表示 */
#first_anna{
	position: absolute;
	z-index: 100000030;
	width:100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	mix-blend-mode:multiply;
}
#first_anna div{
	background-color: white;
	position: absolute;
}
.f_a{
	z-index: 100000030;
	position: absolute;
	color: whitesmoke;
	font-size: 35px;
	font-weight: bold;
	border-top: 5px solid #c9da71;
	border-bottom: 5px solid #cb305e;
	background: linear-gradient(to left, rgba(69, 77, 76, 0.8),rgba(25, 32, 54, 0.8));
	padding: 10px;
	/* border-radius: 20px; */
}

#f_obj1{
	transform:scaleY(0) skewX(-45deg);
	width: 1050px;
	height: 620px;
	top: 20px;
	left: 338px;
	opacity: 0;
}
.x #f_obj1{
	animation: ani_f_obj1 0.5s forwards;
}
@keyframes ani_f_obj1 {
	0%{
		transform: scaleY(0) skewX(-45deg);
		opacity: 0;
	}
	100%{
		transform: scaleY(1) skewX(-45deg);
		opacity: 1;
	}
}
.y #f_obj1{
  transform: skewX(0deg);
  width: 640px;
  height: 730px;
  top: 112px;
  left: 0px;
	transform: scaleY(0);
	opacity: 0;
}
.y #f_obj1{
	animation: ani_f_obj1y 0.5s forwards;
}
@keyframes ani_f_obj1y {
	0%{
		transform: scaleY(0);
		opacity: 0;
	}
	100%{
		transform: scaleY(1);
		opacity: 1;
	}
}

#f_text1{
	width:410px;
	top:100px;
	left:-50px;
	opacity: 0;
}
.y #f_text1{
	top: 50px;
}
#f_text1{
	animation: ani_f_text1 1s forwards;
}
@keyframes ani_f_text1 {
	0%{
		opacity: 0;
		left:-50px;
	}
	30%{
		opacity: 0;
		left:-50px;
	}
	100%{
		opacity: 1;
		left:50px;
	}
}


#f_obj2{
	transform: skewX(-45deg);
	width: 639px;
	height: 674px;
	top: -100px;
	left: -438px;
}
.x #f_obj2{
	animation: ani_f_obj2 0.5s forwards;
}
@keyframes ani_f_obj2 {
	0%{
		top:-100px;
		left:-438px;
	}
	100%{
		top:0px;
		left:-338px;
	}
}

.y #f_obj2{
	transform: skewX(0deg);
	width: 640px;
	height: 120px;
	top: 0;
	left: 0px;
	transform: scaleX(0);
}
.y #f_obj2{
	animation: ani_f_obj3 0.5s forwards;
}

#f_text2{
	width:460px;
	top:240px;
	left:520px;
	opacity: 0;
}
.y #f_text2{
	left:135px;
	animation: ani_f_text2y 1s forwards;
}
.x #f_text2{
	animation: ani_f_text2 1s forwards;
}
@keyframes ani_f_text2 {
	0%{
		opacity: 0;
		left:520px;
	}
	30%{
		opacity: 0;
		left:520px;
	}
	100%{
		opacity: 1;
		left:470px;
	}
}
@keyframes ani_f_text2y {
	0%{
		opacity: 0;
		left:135px;
	}
	30%{
		opacity: 0;
		left:135px;
	}
	100%{
		opacity: 1;
		left:85px;
	}
}


#f_obj3{
	width: 480px;
	height: 100px;
	top: 620px;
	left: 405px;
	transform: scaleX(0);
}
.y #f_obj3{
	width: 420px;
	top: 840px;
	left: 110px;
}
#f_obj3{
	animation: ani_f_obj3 0.5s forwards;
}
@keyframes ani_f_obj3 {
	0%{
		transform: scaleX(0);
	}
	100%{
		transform: scaleX(1);
	}
}

#f_text3,#f_text4,#f_text5{
	width: 460px;
	bottom:170px;
	left: 405px;
	opacity: 0;
}
.y #f_text3,.y #f_text4,.y #f_text5{
	left: 75px;
}
#f_text3,#f_text4,#f_text5{
	animation: ani_f_text3 1s forwards;
}
@keyframes ani_f_text3 {
	0%{
		opacity: 0;
		bottom:170px;
	}
	30%{
		opacity: 0;
		bottom:170px;
	}
	100%{
		opacity: 1;
		bottom:120px;
	}
}


#f_obj4{
	width: 100px;
	height: 100px;
	top: 620px;
	left: 735px;
	border-radius: 100%;
	transform: scale(0);
}
.y #f_obj4{
	top:838px;
	left:418px;
}
#f_obj4,#f_obj51,#f_obj52{
	animation: ani_f_obj4 0.5s forwards;
}
@keyframes ani_f_obj4 {
	0%{
		transform: scale(0);
	}
	100%{
		transform: scale(1);
	}
}
#f_obj51,#f_obj52{
	width: 120px;
	height: 120px;
	top: 610px;
	border-radius: 100%;
	transform: scale(0);
}
.y #f_obj51,.y #f_obj52{
	top:828px;
}
#f_obj51{
	left: 160px;
}
.y #f_obj51{
	left:3px;
}
#f_obj52{
	right: 169px;
}
.y #f_obj52{
	right: 6px;
}

/* クリックエリア（アナウンスエリア兼用） */
#bc_area{
	position: absolute;
	z-index: 1000000030;
	width:100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	display: none;
	opacity: 0;
	flex-direction:column;
	justify-content: center;
	align-items:center;
}
#bc_area div{
	display: none;
}
#bc_area .bgm_on{
/* ボタン設定はfooterの.empと一緒に記述 */
}
#bc_area .dont_shout img{
	position:absolute;
	bottom:100px;
	right:110px;
}
.y #bc_area .dont_shout img{
	right:-10px !important;
}
#bc_area #op_cont{
  background-color: #11dce9;
  border-top: 40px double #e72e76;
  border-bottom: 20px solid #e72e76;
  display: flex !important;
  flex-direction: column;
  width: 500px;
  height: 410px;
	color: darkslategray;
}
#op_cont h1{
	width: 350px;
	height: 80px;
	position: relative;
	top: -40px;
	left: -50px;
	font-size: 50px;
	font-family: serif;
	background: #e72e76;
	border-left: 50px double #11dce9;
	font-weight: bold;
	color: whitesmoke;
}
#op_cont h2,#op_cont img,#op_cont span{
	position: relative;
	top: -40px;
}
#op_cont h2 {
  font-size: 25px;
  padding: 0 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#op_cont span{
	text-align: right;
	padding: 0 10px;
	font-size: 20px;
}
/* blogのマーカー */
div#e_blog.up_blog::before {
    content: ' ';
    width: 15px;
    height: 15px;
    background-color: #e72e76;
    display: block;
    border-radius: 10px;
    position: absolute;
}

div.sns{
	padding:10px;
	background: rgba(255,255,255,0.5);
	border-radius: 10px;
	display: block !important;
	text-align: center;
}
#ent_cont{
	position: absolute;
	z-index: 1000000000;
	/* z-index: 999999; */
	top:0;
	left:0;
	width:100%;
	height: 100%;
	display: none;
	background-repeat: no-repeat;
	background-size: cover;

}
.pul_a #ent_cont{
	background-image: url('../image/t_pul/entrance/e_bg.jpg');
	background-position: right;
}
.dom_a #ent_cont{
	background-image: url('../image/t_dom/entrance/e_bg.jpg');
}
#ent_cont.x{
	background-position: 0px 0px;
}
#ent_cont.y{
	background-position: -600px 0px;
}

/* 背景 */
#e_bg1,#e_bg2{
	position: fixed;
	width: 100%;
	z-index: 9999998;
  transition-duration: 0.3s;
	mix-blend-mode: screen;
}
.pul_a #e_bg1{
	background:url('../image/t_pul/entrance/e_bg_e1.png') repeat;
}
.pul_a #e_bg2{
	background:url('../image/t_pul/entrance/e_bg_e2.png') repeat;
}
.dom_a #e_bg1{
	background:url('../image/t_dom/entrance/e_bg_e1.png') repeat;
}
.dom_a #e_bg2{
	background:url('../image/t_dom/entrance/e_bg_e2.png') repeat;
}
.x #e_bg1,.x #e_bg2{
}
/* メニュー */
#e_menu{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 10000000;
}

.x #e_menu{
	width:537px;
	height: 537px;
}
.x #e_menu_button div{
	text-align: right;
}
.x.pul_a #e_menu{
	background: no-repeat url('../image/t_pul/entrance/e_menu.png');
}
.x.dom_a #e_menu{
	background: no-repeat url('../image/t_dom/entrance/e_menu.png');
}


.y #e_menu{
	width:640px;
	height: 111px;
}
.y.pul_a #e_menu{
	background: no-repeat url('../image/t_pul/entrance/e_menu_sp.png');
}
.y.dom_a #e_menu{
	background: no-repeat url('../image/t_dom/entrance/e_menu_sp.png');
}
/* caution_point */
.x img.caution_point{
}
.y img.caution_point{
	position: relative;
	top: 5px;
}
.x #e_menu .search{
	width:540px;
	height:120px;
	background:no-repeat url('../image/entrance_button/e_search.png');
}
.x #e_menu .administrator{
	width:417px;
	height:120px;
}
.x #e_menu .administrator.xxx_admi{
	background:no-repeat url('../image/entrance_button/e_xxx.png');
}
.x #e_menu .administrator.pul_admi{
	background:no-repeat url('../image/entrance_button/e_pul.png');
}
.x #e_menu .administrator.dom_admi{
	background:no-repeat url('../image/entrance_button/e_dom.png');
}
.x #e_menu .archives{
	width:297px;
	height:120px;
	background:no-repeat url('../image/entrance_button/e_archives.png');
}
.x #e_menu .shout{
	width:177px;
	height:88px;
	background:no-repeat url('../image/entrance_button/e_shout.png');
}
.x #e_menu .share{
	width:89px;
	height:89px;
	background:no-repeat url('../image/entrance_button/e_share.png');
}
#e_menu .label{
	opacity: 0.5;
	width:250px;
	height:250px;
	transform:skewX(-45deg);
	position:fixed;
	top:0;
	left:-125px;
	z-index: 10000000;
}


.y #e_menu_button{
	display: flex;
}
.y .label{
	visibility: hidden;
}
.y #e_menu .search{
	width:169px;
	height:111px;
	background:no-repeat url('../image/entrance_button/e_search_sp.png');
}
.y #e_menu .administrator{
	width:175px;
	height:111px;
}
.y #e_menu .administrator.xxx_admi{
	background:no-repeat url('../image/entrance_button/e_xxx_sp.png');
}
.y #e_menu .administrator.pul_admi{
	background:no-repeat url('../image/entrance_button/e_pul_sp.png');
}
.y #e_menu .administrator.dom_admi{
	background:no-repeat url('../image/entrance_button/e_dom_sp.png');
}
.y #e_menu .archives{
	width:190px;
	height:111px;
	background:no-repeat url('../image/entrance_button/e_archives_sp.png');
}
.y #e_menu .shout{
	width:67px;
	height:111px;
	background:no-repeat url('../image/entrance_button/e_shout_sp.png');
}
.y #e_menu .share{
	width:51px;
	height:111px;
	background:no-repeat url('../image/entrance_button/e_share_sp.png');
}

/* アーカイブダミー */
#e_menu .archives.dummy{
	background:none !important;
}
/* 除外メニュー */
#e_menu_button div.nonchoice{
	filter: brightness(50%);
}
/* メニューアニメ */
#e_menu_button div{
	transition-duration: 0.5s;
}
.pc #e_menu_button div:not(.nonchoice):hover{
  opacity: 0.4;
  transition-duration: 0.3s;
}


/* フッター */
#e_bottom{
	width:100%;
	position: fixed;
	bottom: 0;
	left:0;
	z-index: 10000001;
}
#e_footer{
	margin: 5px;
	display: flex;
	align-items: flex-end;
	justify-content: space-evenly;
}
#ef_center0{
	transform:skewX(-45deg);
	overflow: hidden;
}
#ef_center{
	padding:10px 20px;
	transform:skewX(45deg);
	display: flex;
	align-items:center;
}
.pul_a #ef_center{
  border-top: 2px solid #c9da71;
  border-bottom: 2px solid #cb305e;
	background: linear-gradient(to left, rgba(69, 77, 76, 0.8),rgba(25, 32, 54, 0.8));
}
.dom_a #ef_center{
	border-top: 2px solid #4bc0cc;
	border-bottom: 2px solid #8f2e9c;
	background: linear-gradient(to left, rgba(81, 74, 83, 0.8),rgba(22, 21, 47, 0.8));
}
/* DOM用ダミー */
#i_sama_d{
	display: none;
	width:100px;
	height:100px;
}

/* 装飾ボタン */
.label_box,#bc_area .bgm_on,.pd,#bc_area .tx_copy{
	transform:skewX(-45deg);
	overflow: hidden;
}
.pd{
	display: block !important;
	width: 100% !important;
	font-size: 1.5em;
	margin: auto;

}
.label_box p,#bc_area p{
	color:whitesmoke;
	font-weight: bold;
	padding:0.5em 2em;
	transform:skewX(45deg);
}
#bc_area .bgm_on,#bc_area .tx_copy{
	width:200px !important;
	text-align: center;
}
.pul_a .label_box p,.pul_a #bc_area p,.pul_a .pd p{
	margin: 8px;
  border-top: 2px solid #c9da71;
  border-bottom: 2px solid #cb305e;
	background: linear-gradient(to left, rgba(69, 77, 92, 1),rgba(25, 32, 54, 1));
}
.dom_a .label_box p, .dom_a #bc_area p,.dom_a .pd p{
	margin: 10px;
	border-top: 2px solid #4bc0cc;
	border-bottom: 2px solid #8f2e9c;
	background: linear-gradient(to left, rgba(81, 74, 83, 1),rgba(22, 21, 47, 1));
}
#e_footer .e_oth{
	padding: 3px 7px;
}
.e_oth img{
	width:50px;
	height:50px;
}

/* 叫ぶボタン */
input.text_box{
	font-size:50px !important;
	background: #ffffff;
  border: 1px solid #888888;
  border-radius: 5px;
  color: #333333;
}
.shout_form{
	text-align: center;
}
.shout_form input{
	font-size: 20px;
  background: #ffffff;
  border: 1px solid #888888;
  border-radius: 5px;
  color: #333333;
	padding: 5px;
	margin:5px;
}
.shout_form .sw_button{
	padding: 5px;
	font-size: 16px;
	font-weight: bold;
}

.y .shout_form input{
	font-size: 35px;
}
.fshout .shout_form .pd{
	display: none !important;
}
/* 叫んだ時のノイズ */
#tvnoise{
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1000000001;
	background: url("../image/entrance_button/tvnoise.gif");
	mix-blend-mode: overlay;
	display: none;
}

/* ホバーアニメ */
.pc #i_sama_e:hover,.pc #i_chan_e:hover,.pc #i_sans_e:hover{
	transition-duration: 0.3s;
	margin-bottom: 10px;
}
.pc #e_footer .e_oth:hover{
	transition-duration: 0.3s;
	filter: brightness(50%);
}

/* ドキュメント */
#e_doc_list{
	overflow-y:scroll;
	overflow-x: hidden;
	position: absolute;
	z-index: 10000000;
	width: 100%;
	height: 100%;
	flex-direction: column;
	justify-content: center;
}
#e_doc_list div.ndoc p{
background: linear-gradient(to bottom, rgba(255,0,130,0), rgba(255,0,130,0.3));
}
#e_doc_list div.udoc p{
background: linear-gradient(to bottom, rgba(255,0,130,0), rgba(0, 240, 255, 0.3));
}
#e_doc_list .ndoc,#e_doc_list .udoc {
    filter: brightness(100%) !important;
}
.x #e_doc_list{
	top:0;
	left:270px;
	transform:skewX(-45deg);
}
.y #e_doc_list{
  z-index: 9999999 !important;
	margin-left: -50px;
	width: 105%;
}
#e_doc_list p{
	text-shadow:0px 0px 10px #d7e0df;
	color: whitesmoke;
	font-family: serif;
	font-size:3em;
	width:60%;
	padding-left: 0.5em;
}
.y #e_doc_list p{
	font-size: 1.5em !important;
	width:80%;
}
#e_doc_list .e_status{
	border-radius: 5px;
	min-width:120px;
	text-align: center;
	position:relative;
	top:75px;
	left:600px;
}
.y #e_doc_list .e_status{
	left:400px !important;
}
#e_doc_list .e_status.new{
	background-color: #d74e90;
	color:#ffe8d5;
}
#e_doc_list .e_status.updating{
	background-color: #72d9f5;
	color:#e9ffe8;
}
#e_doc_list .e_status.complection{
	background-color: #343655;
	color:#feffe8;
}
#e_doc_list .e_status.normal{
	visibility: hidden;
}
#e_doc_list .doc {
  display: flex;
  align-items: center;
  position: relative;
  z-index: 100000000;
}
.x #e_doc_list .doc {
	filter: brightness(50%);
}
.y #e_doc_list .doc {
  z-index: 99999999 !important;
	margin-top:50px;
}
#e_doc_list .doc:first-child{
	margin-top:150px;
}
#e_doc_list .doc:last-child{
	margin-bottom: 100px;
}
.pc #e_doc_list .doc.before_doc{
	filter: brightness(80%) !important;
}
#e_doc_list .doc.before_doc p{
	color:#aafbfb !important;
}
.pc #e_doc_list .doc:hover{
	filter: brightness(100%);
	-moz-perspective:600;
	-webkit-perspective:600;
	-o-perspective:600;
	-ms-perspective:600;
  transition-duration: 0.8s;
}
#e_doc_list .doc img.doc_ico{
	height: 200px;
	width: auto;
	transition-duration: 0.8s;
	transform: rotateY(0deg);
}
.pc #e_doc_list .doc img.doc_ico.on{
	transform: rotateY(80deg);
	transition-duration: 0.8s;
}
#e_doc_list .doc img.doc_ico.on{
	filter: brightness(100%);
}
#e_doc_list .doc.m_PUL{
	background:url("../image/doc_ico/m_PUL.png") no-repeat center center;
}
#e_doc_list .doc.m_TFK{
	background:url("../image/doc_ico/m_TFK.png") no-repeat center center;
}
#e_doc_list .doc.m_DOM{
	background:url("../image/doc_ico/m_DOM.png") no-repeat center center;
}
#e_doc_list .doc.m_TTD{
	background:url("../image/doc_ico/m_TTD.png") no-repeat center center;
}
.y #e_doc_list .doc{
	background-position:right;
	width:100%;
}
.x #e_doc_list .doc{
	width:80%;
	transform:skewX(45deg) !important;
}
/* ドキュメント用改行 */
#e_doc_list span:not(.e_status){
	display: inline-block;
  white-space: nowrap;
}
/* スクロールバー */
#e_doc_list::-webkit-scrollbar{
  width: 30px;
}
#e_doc_list::-webkit-scrollbar-track{
  background: none ;
  border: none;
  border-radius: 0px;
  box-shadow: inset 0 0 2px transparent;
}
#e_doc_list::-webkit-scrollbar-thumb{
  background: transparent;
  border-radius: 0px;
  box-shadow: none;
}
/* UP DOWN */
.up,.down{
	position:fixed;
	right:10px;
	display: none;
	z-index: 10000001;
	filter: brightness(50%);
}
.pc .up:hover,.pc .down:hover{
	filter: brightness(100%);
  transition-duration: 0.3s;
}
.up{
	top:10px;
}
.down{
	bottom:100px;
}

/* --------------------------アーカイブス-------------------------- */
#archives_back{
	position: absolute;
	z-index: 9999999;
	top:0;
	left:0;
	width:100%;
	height: 100%;
	background: rgb(0,0,0);
	background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(56,46,66,1) 52%, rgba(95,106,140,1) 100%);
	display: none;
}

#archives_cont{
	position: absolute;
	z-index: 10000001;
	top:0;
	left:0;
	width:100%;
	height: 100%;
	display: none;
	flex-direction:column;
	align-items: center;
}
#archives_cont .al_body{
	overflow-y: auto;
	width: 90% !important;
	margin:0 auto;
}
.x #archives_cont .al_body.flex{
	display: flex;
	flex-wrap: wrap;
}
.y #archives_cont .al_body{
	width: 85% !important;
}
#arc_label{
	width: 100%;
	text-align: left;
}
/* アーカイブメニュー */
#archives_menu{
	display: flex;
	/* position:absolute; */
	top:115px;
	height: 55px;
	/* right:100px; */
}
.y #archives_menu{
	/* right:0 !important; */
}

/* ローディング */
.sk-cube-grid {
  width: 100px;
  height: 100px;
  margin: 100px auto;
	position: absolute;
	z-index: 3;
	opacity: 0.8;
}

.sk-cube-grid .sk-cube {
  width: 30%;
  height: 30%;
  background-color: whitesmoke;
	margin: 1%;
  float: left;
  -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
          animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
}
.sk-cube-grid .sk-cube1 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }
.sk-cube-grid .sk-cube2 {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
.sk-cube-grid .sk-cube3 {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s; }
.sk-cube-grid .sk-cube4 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s; }
.sk-cube-grid .sk-cube5 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }
.sk-cube-grid .sk-cube6 {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
.sk-cube-grid .sk-cube7 {
  -webkit-animation-delay: 0s;
          animation-delay: 0s; }
.sk-cube-grid .sk-cube8 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s; }
.sk-cube-grid .sk-cube9 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }

@-webkit-keyframes sk-cubeGridScaleDelay {
  0%, 70%, 100% {
    -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1);
  } 35% {
    -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1);
  }
}

@keyframes sk-cubeGridScaleDelay {
  0%, 70%, 100% {
    -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1);
  } 35% {
    -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1);
  }
}
/* エンカウンター、アイテム表示ウィンドウ */
#archives_win{
	font-family: 'RobotoMono-VariableFont_wght',sans-serif;
	position: absolute;
	z-index: 10000002;
	top:0;
	left:0;
	opacity: 0;
	display: none;
	width:100%;
	height: 100%;
	background: rgba(0,0,0,0.9);
	justify-content: center;
	align-items:center;
}
.arc_button{
	transition: 1.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
	width: 200px;
	color: white;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	filter: brightness(50%);
}
.arc_button:hover ,.arc_button.now{
	filter: brightness(100%);
}


/* ナビ省略 */
#nav-drawer,#top_menu{display: none;
}
@keyframes arc_view {
	0% {
    opacity: 0;
  }
	100%{
    opacity: 1;
	}
}

/* アルバム */
.dlog{
  margin:1em auto;
	animation: arc_view 0.5s ease-in 1;
}
.h_link{
    margin:auto auto 1em auto;
    text-align: center;
}
.dlog div{
  background-color: #2d2b39;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
.pc .dlog div:hover{
  background-color: #6c699c;
}
.dlog p,.h_link a{
  text-shadow:0px 0px 10px #d7e0df,1px 1px 0 rgba(45, 43, 57, 0.3),-1px 1px 0 rgba(45, 43, 57, 0.3),1px -1px 0 rgba(45, 43, 57, 0.3),-1px -1px 0 rgba(45, 43, 57, 0.3);
  color: whitesmoke;
  font-family: serif;
  text-align: center;
  margin:auto 0.5em;
}
.dlog span{
  height: 4em;
  display:flex;
  flex-direction: column;
  justify-content: center;
	color:antiquewhite;
  text-shadow: 1px 1px 0 #2d2b39,
               -1px 1px 0 #2d2b39,
               1px -1px 0 #2d2b39,
               -1px -1px 0 #2d2b39;
}
/* 縦横調整 */
/* ヨコ長 */
.x #bg3{
	margin:8vh 3em;
}
.x .dlog{
	width:48%;
	text-align:right;
}
.x .h_link{
	width:80%;
	font-size: 2em;
}
.x .dlog p{
	font-size: 1.5em;
}
.x .dlog span{
	font-size: 1em;
}
/* タテ長 */
.y #bg3{
	margin:8vh 0.5em;
}
.y .dlog{
	width:95%;
	text-align:left;
}
.y .h_link{
	width:95%;
	font-size: 2em;
}
.y .dlog p{
	font-size: 0.9em;
	text-align:right;
}
.y .dlog span{
	font-size: 1em;
	padding: 0.2em 0.5em;
	width:60%;
	margin-left:auto;
}
.y div #album{
 padding-bottom: 8vh;
}


/* エンカウンター */
div.enc_list{
	display: inline;
	transition: all 300ms 0s ease;
}

.enc_list.now_item{
	filter: drop-shadow(0px 0px 4px white);
}
.enc_list img{
	width:120px;
	height: 120px;
	animation: arc_view 0.5s ease-in 1;
}
.y .enc_list img{
	width:135px !important;
	height: 135px !important;
}
#enc_profile{
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 1;
	display: none;
	opacity: 0;
	/* display: flex; */
	/* justify-content: space-between; */
}
#c_area{
	height: 100%;
	justify-content: center;
	display: flex;
	position: absolute;
	top: 0;
}
.y #c_area{
	left:0 !important;
}
/* zoom(仮) */
#e_zoom{
	position: absolute;
	z-index: 10;
	bottom: 10px;
	left: 25px;
	filter: drop-shadow(5px 1px 3px #176caa);
}
.y #e_zoom{
	left: 560px !important;
	top: 120px;
	bottom:auto !important;
}
#e_image_main_b{
	/* display: flex;
	align-items: flex-start;
	justify-content: center; */
	transition-duration: 0.5s;
	overflow: auto;
	width: 100%;
	height:100%;
	/* firefox用スクロールバー非表示 */
	scrollbar-width: none;
	/* IEとEdge用 */
	-ms-overflow-style: none;
}
#e_image_main_b.zoom{
	overflow: hidden !important;
	display: flex;
	justify-content: center;
	align-items: center;
}

#e_image_main_b::-webkit-scrollbar{
	width:0px !important;
	display: none;
}
#e_image_main{
	position: relative;
}
#e_image_main.unknown1,.layer.unknown1{
	filter: brightness(25%) saturate(20%);
}
#e_image_main.unknown2,.layer.unknown2{
	filter: brightness(30%) blur(5px);
}
#e_image_main img{
}
.e_image2{
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}

#c_data{
	color: white;
	width: 500px;
	height: 100%;
	position: absolute;
	right: 40px;
	display: flex;
	flex-direction:column;
	justify-content: center;
}
.y #c_data{
	justify-content: flex-end;
	width: 550px !important;
	right: 25px !important;
}
/* hideボタン */
#e_hide{
	display: none;
}
.pul_a #e_hide,.pul_a #e_u_turn{
	background:rgba(65, 244, 255, 0.6);
}
.dom_a #e_hide,.dom_a #e_u_turn{
	background:rgba(27, 89, 249, 0.6);
}
.y #e_hide {
	color: white;
	font-weight: bold;
	text-align: center;
	font-size: 50px;
	display: block !important;
	border-radius: 50%;
	line-height: 60px;
	width: 70px;
	height: 70px;
	padding: 0;
	margin-left: auto;
}
#e_u_turn{
	border-radius: 50%;
	width: 80px;
	height: 80px;
	padding: 0;
	text-align: center;
	position: absolute;
	z-index: 10;
	top: 10px;
	right: 10px;
}
#e_u_turn img{
	margin: 6px;
	width: 60px;
	height: 60px;
}


.enc_name{
	height: 240px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 40px;
	font-weight: bold;
	position: relative;
	text-align: center;
}
.y .enc_name{
	height: 380px !important;
	align-items: flex-start;
	margin-top: 30px;
	text-shadow: 1px 1px 0 rgba(45, 43, 57, 0.3),-1px 1px 0 rgba(45, 43, 57, 0.3),1px -1px 0 rgba(45, 43, 57, 0.3),-1px -1px 0 rgba(45, 43, 57, 0.3);
}
.enc_name::before{
	content: attr(eng);
	position: absolute;
	z-index: 0;
	opacity: 0.2;
	font-style: italic;
	font-family: serif;
	top: 65px;
}
.y .enc_name::before{
	top: -15px !important;
}
.enc_text{
	transform: skewX(-45deg);
	margin-left: -140px;
	display: flex;
	overflow: hidden;
	width: 780px;
	justify-content: center;
}
.y .enc_text{
	margin-left: -185px !important;
	width:870px !important;
}
#et{
	font-size:20px;
	padding: 10px;
	height: 350px;
	transform: skewX(45deg);
	width: 450px;
}

.y #et{
	font-size: 25px !important;
	width: 540px;
}
#et div{
	overflow-y: auto;
	height: 94%;
	margin: 2%;
}
.enc_text p{
	padding: 8px 0px;
	text-indent: 1em;
}

.pul_a #et,.pul_a #item_box2{
	margin: 10px;
  border-top: 5px solid #2fe0ff;
  border-bottom: 5px solid #cb305e;
	background: linear-gradient(to left, rgba(69, 77, 92, 1),rgba(25, 32, 54, 0.8));
}
.dom_a #et,.dom_a #item_box2{
	margin: 10px;
	border-top: 5px solid #f7ff55;
	border-bottom: 5px solid #8f2e9c;
	background: linear-gradient(to left, rgba(81, 74, 83, 1),rgba(22, 21, 47, 0.8));
}
/* verバー */
.enc_ver .e_tag{
	transition-duration: 0.5s;
	color:white;
	font-weight: bold;
	font-size: 18px;
	width:155px;
	filter:brightness(50%);
	display: inline-block;
	margin: 2px;
	padding: 3px;
	text-align: center;
}
.enc_ver .e_tag.e_now_view,.enc_ver .e_tag:hover{
	filter:brightness(100%) !important;
}
.pul_a .enc_ver .e_tag{
	background: linear-gradient(135deg, transparent 10px, #192036 0) top left,
	linear-gradient(-135deg, transparent 0px, #192036 0) top right,
	linear-gradient(-45deg, transparent 10px, #192036 0) bottom right,
	linear-gradient(45deg, transparent 0px, #192036 0) bottom left;
	background-size: 52% 52%;
	background-repeat: no-repeat;
}
.dom_a .enc_ver .e_tag{
	background: linear-gradient(135deg, transparent 10px, #16152f 0) top left,
	linear-gradient(-135deg, transparent 0px, #16152f 0) top right,
	linear-gradient(-45deg, transparent 10px, #16152f 0) bottom right,
	linear-gradient(45deg, transparent 0px, #16152f 0) bottom left;
	background-size: 52% 52%;
	background-repeat: no-repeat;
}

/* encounter背景 */
div#eb1,div#eb2{
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 0
	top:0;
	left: 0;
	background-image:url('../image/archives/encounter/enc_border.png');
	background-repeat: no-repeat;
	background-position: top center;
	display: none;
}
div#eb1{

}
div#eb2{
	transform: scale(1,-1);
}
#archives_win.pc div#eb1,#archives_win.pc div#eb2{
	filter: hue-rotate(200deg);
}
#archives_win.spc div#eb1,#archives_win.spc div#eb2{
	filter: hue-rotate(230deg);
}
#archives_win.administrator div#eb1,#archives_win.administrator div#eb2{
	filter: hue-rotate(-30deg);
}

/* item */
#arc_item_box{
	display: flex;
	justify-content: center;
	align-items:flex-start;
	overflow: hidden;
	opacity: 0;
}
.y #arc_item_box{
	flex-direction: column;
}
#item_area{
	width:650px;
	overflow: hidden;
}
.y #item_area{
	width:545px;
}
#item_lists{
	padding: 10px;
	width: 50%;
}
.y #item_lists{
	height: 160px;
	overflow-x: auto;
	display: flex;
	width: 95% !important;
	text-align: center;
}

#item_box{
	transform: skewX(-45deg);
	overflow: hidden;
}
#item_box2{
	transform: skewX(45deg);
}
#item_box{
	width:1030px;
	margin-left: -220px;
	display: flex;
	justify-content: center;
}
.y #item_box{
	width: 990px !important;
}
#item_box2{
	width:590px;
	height:500px;
}
.y #item_box2{
	width: 550px !important;
	height: 550px;
}
#item_lists img{
	width:120px;
	height: 120px;
}
.y #item_lists img{
	width:135px;
	height: 135px;
}
.list_b{
	display: inline-block;
}
.list_b.now_item{
	filter: drop-shadow(0px 0px 7px white);
}

#item_top{
	display: flex;
	justify-content: center;
	align-items: center;
	opacity: 0;
}
#item_top img{
	width:280px;
	height: 280px;
}
.y #item_top img{
	margin-top: 10px;
	margin-left: 10px;
}
#item_top,#item_title{
	width:100%;
}
#item_title{
	color: white;
	font-weight: bold;
	font-size: 3em;
	text-shadow:0px 0px 10px #d7e0df,1px 1px 0 rgba(45, 43, 57, 0.3),-1px 1px 0 rgba(45, 43, 57, 0.3),1px -1px 0 rgba(45, 43, 57, 0.3),-1px -1px 0 rgba(45, 43, 57, 0.3);
	text-align: center;
}
.y #item_title{
	margin-left: -10px !important;
}
#item_bottom{
	color: aliceblue;
	font-size: 18px;
	text-indent: 1em;
	padding:0.5em;
	opacity: 0;
}
.y #item_bottom{
	font-size: 20px !important;
	width:95%;
}
#item_center p {
    width: 180px;
}

#item_center{
	opacity: 0;
	display: flex;
	justify-content: center;
}
#item_center div {
	    display: flex;
    color: white;
    font-weight: bold;
    text-align: center;
    margin: 0 3px;
    height: 30px;
    font-size: 20px;
    transform: skewX(-45deg);
    overflow: hidden;
    width: 200px;
}
#item_center p {
    width: 200px;
    transform: skewX(45deg);
    margin-left: -10px;
}
#item_link p{
	background-color:#f54c93;
}
.dom_a #item_link p{
	background-color:#ec4cf5 !important;
}
#item_copy p{
	background-color:#2cb6d5;
}
.dom_a #item_copy p{
	background-color:#d5962c !important;
}

p.t2{
	font-style: italic;
	color: lightsteelblue;
	font-family: serif;
	font-size: 15px;
	text-align: right;
	width: 88%;
	margin-left: auto;
	margin-top: 1em;
}
.y p.t2{
	font-size:18px !important;
	width: 100% !important;
	text-align: left !important;
}

/* --------------------------カーソル-------------------------- */
#loading_p,#tyrano_base, .notchoice,#none_click_area{
	cursor: url('../image/cursor/cursor_main.png'),default !important;
}
.button_graphic:not(.notchoice),.bb,.m_volume,.m_volume2,.al_help,#e_menu_button div:not(.nonchoice):not(.dummy),.doc,.up,.down,#e_bottom img,#e_bottom .e_oth,.sns_form img,.arc_button,.enc_list,.enc_ver .e_tag:not(.e_now_view),#item_center div,#op_cont{
	cursor: url('../image/cursor/cursor_active.png') 20 0,crosshair !important;
}
.b_back ,.menu_item,#e_u_turn{
	cursor: url('../image/cursor/cursor_back.png') 0 20 ,pointer !important;
}
.shout_word{
	cursor: text;
}

/* --------------------------個別-------------------------- */
.re_out_m_tep2{
	opacity: 0;
}