/*baloo Area*/
@font-face {
  font-family: 'Baloo';
  font-style: normal;
  font-weight: 400;
  src: local('Baloo Regular'), local('Baloo-Regular'), url(https://fonts.gstatic.com/s/baloo/v2/SGrMP-s4ZzeXHjeTjbvGSQ.woff2) format('woff2');
  unicode-range: U+02BC, U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200B-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;
}

@font-face {
  font-family: 'Baloo';
  font-style: normal;
  font-weight: 400;
  src: local('Baloo Regular'), local('Baloo-Regular'), url(https://fonts.gstatic.com/s/baloo/v2/cW-kpFu5iuSs19ICXlPI_w.woff2) format('woff2');
  unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Baloo';
  font-style: normal;
  font-weight: 400;
  src: local('Baloo Regular'), local('Baloo-Regular'), url(https://fonts.gstatic.com/s/baloo/v2/DMtQWwnrc1cJLTDDHf1kag.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Baloo';
  font-style: normal;
  font-weight: 400;
  src: local('Baloo Regular'), local('Baloo-Regular'), url(https://fonts.gstatic.com/s/baloo/v2/RFm9MaodarSezi9FSqQmfw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

.baloo {
	font-family: 'Baloo', cursive;
	font-size: 48px;
}
/*baloo Area*/

.DFKai-sb {
	font-family: 'DFKai-sb', serif;
	font-size: 48px;
}

.Segoe {
	font-family: 'Segoe UI', Arial, sans-serif;
	font-size: 48px;
}

/* Background image */
body, html {
    height: 100%;
    line-height: 1.8;
}

.bg {
    background: #DCEEF1;
    min-height: 100%;
	z-index: -1;
}

.bgindex {
    background-attachment: fixed;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url('/assets/img/kt.jpeg');
    min-height: 100%;
	z-index: -1;
}

.bglink {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url('/assets/img/bg/63206435_p0.jpg');
}

.bgamv {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url('/assets/img/bg/63301084_p0');
}

.bgngnl {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url('/assets/img/bg/838543.png');
	/* background-size: contain; */
}

.bgindex2 {
    background-attachment: fixed;
	background-position: center;
    background-repeat: no-repeat;
    background-image: url('/assets/img/bg/index.jpg');
	/* background-size: contain; */
}

.bgindex3 {
  z-index: -1;
  min-height: 100%;
  background: url('/assets/img/saenai/pc/main_bg.png') repeat center top;
}

.bgerror {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url('/assets/img/chara.png');
}
/* Background image */

/* Background image for tablets and phones */
@media only screen and (max-device-width: 1024px) {
    .bgindex {
        background-attachment: scroll;
    }
}
/* Background image for tablets and phones */

/*Div Class*/
#container {
margin:10px; 
padding:70px; 
}

#smallcontainer {
margin:10px; 
padding-top:70px; 
padding-left:20%;
padding-right:20%; 
}

#videocontainer {
padding-top:50px; 
}
/*Div Class*/

/*Loading Screen*/
div.load_screen {
	z-index: 9999999;
	position:fixed;
	width: 100%;
	height: 100%;
	background: white;
	top: 0;
	left:0;
}

img.load_screen {
	z-index: 9999999;
	position: fixed;
	left: 50%;
	top: 50%;
	margin: -27px 0 0 -95px; /* -image-height/2 0 0 -image-width/2 */
	background: white;
}
/*Loading Screen*/

/*Secret Page*/
div.secret {
    background-color: #6699ff;
    color:  #ffffff;
    margin: 20px 0 20px 0;
    padding: 20px;
}
/*Secret Page*/

.indexcontainer {
  padding-right: 0;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 768px) {
  .indexcontainer {
    width: auto;
  }
}
@media (min-width: 992px) {
  .indexcontainer {
    width: auto;
  }
}
@media (min-width: 1200px) {
  .indexcontainer {
    width: auto;
  }
}

.hidescrollbar {
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none;  /* Firefox */
}
.hidescrollbar::-webkit-scrollbar { 
    display: none;  /* Safari and Chrome */
}

.center {
	text-align: center;
}

.left {
	text-align: left;
}

.large {
	font-size: 50px;
}

.medium {
	font-size: 25px;
}

.circleborder {
	border-radius: 8px;
}

.noscroll {
	max-width: 100%;
	overflow-x: hidden;
}

.blue {
	color:#6699ff;
}

.black {
	color:#000000;
}

.white {
	color:#ffffff;
}

a.grey {
	color: #333333;
	text-decoration: none;
}

a.blue {
	color:#6699ff;
	text-decoration: none;
}
   
li {
    border-right: 1px solid #bbb;
    }

li:last-child {
    border-right: none;
    }
	
table, th, td {
    border-collapse: collapse;
}
th, td {
    padding: 5px;
}
th {
    text-align: center;
}

/*Snowfall Effect*/
@charset "UTF-8";

.bg_box{
	position: fixed;
	z-index:-1;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.bg_box{
	position: fixed;
	width:100%;
	height: 100%;
	top: 0;
	left:0;
}

/*************************
Groove
*************************/
.bg_box img{
	opacity: 0.15;
/* keyframes に任意の名前を付ける */
  -moz-animation-name: rot;
  -webkit-animation-name: rot;
  animation-name: rot;
  -goog-ms-animation-name: rot;

 /* 1動作(ここでは1回転)あたりの秒数 */
  -moz-animation-duration: 2s;
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -goog-ms-animation-duration: 2s;
  -moz-animation-direction: normal;
  -webkit-animation-direction: normal;
  animation-direction: normal;
  -goog-ms-animation-direction: normal;

/* 動き方 linear, ease, easein, ease-out, ease-in-out */
  -moz-animation-timing-function: linear;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -goog-ms-animation-timing-function: linear;
  -moz-animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -goog-ms-animation-iteration-count: infinite;
}
@-webkit-keyframes rot{
  from {
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -goog-ms-transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);

    -goog-ms-transform: rotate(360deg);
  }
}
@keyframes rot{
  from {
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -goog-ms-transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -goog-ms-transform: rotate(360deg);
  }
}
@keyframes rumble{
	0%	{transform:rotate(0deg)	translate(0,0);}
	12.5%	{transform:rotate(0.4deg)	translate(1px,-1px);}
	25%	{transform:rotate(0.8deg)	translate(0px,1px);}
	37.5%	{transform:rotate(0.4deg)	translate(-1px,0);}
	50%	{transform:rotate(0deg)	translate(0,0);}
	62.5%	{transform:rotate(-0.4deg)	translate(1px,0);}
	75%	{transform:rotate(-0.8deg)	translate(0,1px);}
	87.5%	{transform:rotate(-0.4deg)	translate(-1px,-1px);}
	100%	{transform:rotate(0deg)	translate(0,0);}
}
/*Snowfall Effect*/
