@charset "UTF-8";


/* mainbottle
---------------------------------------------------------------------------------------------------- */

#mainbottle {
	width: 100%;
	height: 100vh;
	padding: 0 0 80px;
	color: #fff;
	font-size: 100px;
	display: flex;
	align-items: center;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	-ms-flex-pack: end;
	flex-direction: column;
	background: #fff;
/*	background: #d53a30; */
}
#mainbottle img {
	height: 94vh;
	width: auto;
	max-width: 90vx;
}


/* pagetop
---------------------------------------------------------------------------------------------------- */

#pageTop {
	position: relative;
	width: 100%;
	padding: 20px 0 50px;
	text-align: center;
	z-index: 99;
}
#pageTop a {
	font-size: 2.0em;
	color: #e13831;
}




@media only screen and (min-width: 1000px) {


}


@media only screen and (max-width: 750px) {

#mainbottle {
	width: 100%;
	height: auto;
	padding: 80px 0 0;
}
#mainbottle img {
	height: auto;
	width: 100%;
	max-width: 80vx;
}

}

body .fadein{
 animation: fadeIn 2s ease 0s 1 normal;
 -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
 0% {opacity: 0}
 100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
 0% {opacity: 0}
 100% {opacity: 1}
}

.scrollarrow {
  display: flex;
  position:fixed;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  bottom: 40px;
}

.arrow {
  width: 20px;
  height: 20px;
  border-bottom: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: rotate(45deg);
  animation: move 1.8s infinite;
  margin: -3px;
}

@for $i from 1 through 2 {
  .arrow:nth-child(#{$i + 1}) {
    animation-delay: 0.15 * $i + s;
  }
}

@keyframes move {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translateY(40px) rotate(45deg);
  }
}

.site-topics{
    padding: 20px;
    position: absolute;
    bottom: 0;
    right: 0;
    transition: .5s;
    z-index:9;
    font-size: 1.1em;
    font-weight: bold;
    color: #d53a30;
}
 
.site-topics.hide{
    transform: translateY(-300%);
}

@media only screen and (max-width: 480px) {
.site-topics{
    padding: 10px 0 0;
    font-size: 1.02em;
    font-weight: normal;
    line-height: 120%;
    top: 10px;
    left: 10px;
}
.site-topics img {
    max-width: 100%;
}
}

table.weektable {
	width: 100%;
}
.weektable th, .weektable td {
	padding: 10px;
	border: 1px solid #ddd;
	line-height: 140%;
}
.weektable th {
	background: #f4f4f4;
	width: 20%;
}
.weektable th, .weektable td {
	text-align: left;
}
.weektable td {
	width: 80%;
	text-align: left;
	vertical-align: top;
}
.weektable span {
	font-size: 0.8em;
}
.weektable .collabo {
	margin-left: 24px;
	font-size: 0.95em;
}

@media only screen and (max-width: 480px) { 
	.weektable {
		margin: 0;
	}
	.weektable tr {
		display:block;
		margin-bottom: 10px;
	}
	.weektable th {
		display:block;
		width: 100%;
	}
	.weektable td {
		display: list-item;
		width: 90%;
		margin-left: 10%;
		border:none;
	}
	.weektable td.none {
		display: none;
	}
	.weektable .collabo {
		margin-left: 0;
	}
}

.topicsbox {
	display: block;
	width: 300px;
	padding: 3px 5px 3px;
	height: 180px;
	background: #fff;
	border: 1px solid #000;
	line-height: 160%;
}
.topicsbox .topicsbox_ttl {
	font-family: 'GFS Didot', serif;
	font-size: 1.3em;
	font-weight: bold;
}
.topicsbox span {
	font-size: 0.85em;
}
.topicsbox span a {
	color: #d53a30;
}
@media only screen and (max-width: 480px) {
	.topicsbox {
		max-width: 86%;
	}
}

#page_top{
  width: 90px;
  height: 90px;
  position: fixed;
  right: 0;
  bottom: 0;
  opacity: 0.6;
}
#page_top a{
  position: relative;
  display: block;
  width: 90px;
  height: 90px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f102';
  font-size: 25px;
  color: #999;
  position: absolute;
  width: 25px;
  height: 25px;
  top: -40px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
#page_top a::after{
  content: 'PAGE TOP';
  font-size: 13px;
  color: #fff;
  position: absolute;
  top: 45px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  color: #999;
}

#concept #concept_inner h1.csub,
#sns #train_inner h1.csub,
#train #train_inner h1.csub,
#event #event_inner h1.csub {
  font-size: 2.0em;
  font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',Helvetica,Arial,sans-serif;
  border-bottom: 1px solid #d53a30;
  width: 100%;
  padding-bottom: 10px;
  margin-bottom: 30px;
  color: #d53a30;
}
#concept #concept_inner h1.csub span,
#sns #train_inner h1.csub span,
#train #train_inner h1.csub span,
#event #event_inner h1.csub span {
  font-size: 2.0em;
  font-family: 'GFS Didot', serif;
  line-height: 180%;
  color: #d53a30;
}

.topicom .list02 li {
  width: 100%;
  font-size: 1.3em;
  line-height: 200%;
  padding-left: 20px;
}

@media only screen and (max-width: 480px) {
	#concept #concept_inner h1.csub,
	#sns #train_inner h1.csub,
	#train #train_inner h1.csub,
	#event #event_inner h1.csub {
	  font-size: 1.3em;
	}
	#concept #concept_inner h1.csub span,
	#sns #train_inner h1.csub span,
	#train #train_inner h1.csub span,
	#event #event_inner h1.csub span {
	  font-size: 1.5em;
	}
	.topicom .list02 li {
	  font-size: 1.1em;
	  padding-left: 5px;
	}
}