html {
	font-size: 62.5%;
}
body {
	margin: 0;
	padding: 0;
	font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
	font-feature-settings: "palt";
	background-color: #000000;
	font-size: 1.4rem;
	line-height: 1.6;
	letter-spacing: 0.1em;
}
h1 {margin: 0;}
h2 {margin: 0;}
h3 {margin: 0;}
h4 {margin: 0;}
h5 {margin: 0;}
img {
	height: auto;
}

.an_scl{ opacity: 0; }

/*------------------------
    共通
--------------------------*/
.midashi {
	margin: 40px 0 15px;
	font-size: 5rem;
	font-weight: 400;
	font-family: century-gothic, sans-serif;
	text-align: center;
}

/*------------------------
    ヘッダー
--------------------------*/
header {
	margin: 0;
	padding: 0;
	text-align: center;
	width: 100%;
	height: 950px;
	background: #ffffff url("../img/bg_2025.jpg") no-repeat top center;
	background-size:cover;
	display:block;
	position:relative;
	animation: fadeIn 5s cubic-bezier(0.73, 1, 0.88, 1) forwards;
	
	}
@media screen and (min-width: 1100px) {
header {width: 100%; height: 850px;}
}
@media screen and (min-width: 1400px) {
header {width: 100%; height: 1050px;}
}
@media screen and (min-width: 1800px) {
header {width: 100%; height: 1200px;}
}

@media only screen and (max-width: 750px) {
header {
	width: 100%;
	height: 500px;
}
header img {
	width: 70%;
}
}
/*------------------------
    サイトロゴ
--------------------------*/
.myChangeImage {
	width: 770px;
   top: 12%;
   left: 50%;
   -webkit-transform: translate(-50%, -50%);
   transform: translate(-50%, -50%);
   position: relative;
}
@media screen and (min-width: 1400px) {
.myChangeImage {
	width: 890px;
	top: 14%;
}
}
@media screen and (min-width: 1800px) {
.myChangeImage {
	width: 980px;
	top: 20%;
}
}
.myChangeImage img{
    position: absolute;
    top: 0;
    left: 0;
    animation: ChangeImage 5s;
	animation-fill-mode:forwards;/*コレが最後停止*/
    opacity: 0;
	width: 100%;
}

@keyframes ChangeImage{
    0%{ opacity: 0;}
    20%{ opacity: 0;}
    33%{ opacity: 1;}
    66%{ opacity: 1;}
    100%{ opacity: 1;}

}

.myChangeImage img:nth-of-type(1) {
  animation-delay: 0s;
}
.myChangeImage img:nth-of-type(2) {
   animation-delay: 2s;
	
}
.myChangeImage img:nth-of-type(3) {
   animation-delay: 5s;
}
@media only screen and (max-width: 750px) {
.myChangeImage {
	width: 80%;
	top: 18%;
}
}
/*------------------------
    wrapper
--------------------------*/

#wrapper {
	width: 100%;
	margin: 0;
	position: relative;
	text-align: center;
	background-color: #000000;
}

/*------------------------
    section title
--------------------------*/
.section-ttl{
	width: 90%;
	height: 150px;
	display: block;
	background: url("../img/ttl-bg.png") center top no-repeat ;
	background-size: contain;
	margin: 90px auto 10px;
}
@media only screen and (max-width: 950px) {
.section-ttl{
	width: 80%;
	height: 110px;
	transform:initial;
}
}
.section-ttl h2 {
	text-align: center;
	width: 100%;
	letter-spacing: 0.25em;
}
@media only screen and (max-width: 750px) {
.section-ttl h2 {
	width: 100%;
}
}
.section-ttl h2 span.sub {
	display: block;
	margin-bottom: 7px;
	padding-top: 13px;
	font-size: 2.6rem;
	font-family: yu-mincho-pr6n, sans-serif;
	line-height: 1.2;
	color: #fff;
}
@media only screen and (max-width: 750px) {
.section-ttl h2 span.sub {
	margin-bottom: 6px;
	padding-top: 16px;
	font-size: 1.5rem;
	letter-spacing: 0.15em;
}
}
.section-ttl h2 span.main {
	display: block;
	font-size: 6.2rem;
	font-family: yu-mincho-pr6n, sans-serif;
	line-height: 1.0;
	color: #fff;
}
@media only screen and (max-width: 750px) {
.section-ttl h2 span.main {
	font-size: 2.6rem;
}
}
/*------------------------
    youtube
--------------------------*/

#youtube-section {
	width: 1100px;
	margin: 10px auto 20px;
	position: relative;
}

#youtube-section .profile {
	width: 100%;
	margin: 0 auto 0 auto;
    vertical-align: top; /* 上に揃える */
}
#youtube-section .profile p{
	text-align: left;
	padding: 10px;
	line-height: 2;
	font-size: 1.8rem;
}
#youtube-section .profile img{
	width: 40%;
	margin-bottom: 5px;
}
#youtube-section .mv img{
	width: 60%;
	margin: 10px 0 20px;
}
#youtube-section .mv a{
	width: 60%;
	opacity: 0.6;
	transition: all 0.5s;
}

#youtube-section .mv a:hover{
	opacity: 1;
	transition: all 0.5s;
	width: 70%;
}
@media only screen and (max-width: 750px) {
#youtube-section {
	width: 100%;
}
#youtube-section .profile p{
	padding: 10px;
	line-height: 1.8;
	font-size: 1.5rem;
}
#youtube-section .profile img{
	width: 70%;
}
#youtube-section .mv img{
	width: 80%;
	margin: 15px 0;
}
}
/*------------------------
    テーブル
--------------------------*/
#sche{
	width: 1100px;
	margin-top: 10px;
	margin-bottom: 50px;
	margin-left: auto;
    margin-right: auto;
	font-size: 1.6rem;
}
@media only screen and (max-width: 950px) {
#sche{
	width: 98%;
	margin-top: 5px;
	margin-bottom: 30px;
	font-size: 1.1rem;
}
}
#sche table{
	width: 100%;
	border-collapse: collapse;
	border: solid #000000;
	border-width: 1px;
	margin-bottom: 30px;
}
#sche table tr th,
#sche table tr{
	text-align: center;
	vertical-align: middle;
	border-bottom: 1px solid #444444;
}
#sche table td{
	padding: 20px 10px;
	color: #D8D8D8;
	vertical-align: middle;
}
@media only screen and (max-width: 950px) {
#sche table td{
	padding: 10px 5px;
}
}
#sche table td:first-child{
	padding: 20px 10px;
	color: #D8D8D8;
	font-size: 2rem;
}
@media only screen and (max-width: 950px) {
#sche table td:first-child{
	padding: 10px 5px;
	font-size: 1.2rem;
}
}
#sche table td:nth-child(2){
	font-size: 2rem;
}
@media only screen and (max-width: 950px) {
#sche table td:nth-child(2){
	font-size: 1.4rem;
}
}
#sche table tr:last-child{
	border-bottom: 0px;
}

#sche hr{
	height: 1px;
    background-color: #CCC;
    border: none;
	width: 92%;
	margin-left: auto;
    margin-right: auto;
	margin-top: 2px;
	margin-bottom: 5px;
}
#sche .sat{
	color:#5c6eb0;
}
#sche .sun{
	color:#ab4f4f;
}



/*------------------------
   チケット
--------------------------*/

.txt-price {
	margin-top: 15px;
	font-size: 22px;
	font-weight: 400;
	color: #FFFFFF;
	font-family: yu-mincho-pr6n, sans-serif;
}

.txt-gold {
	color: #b8a25f;
}
.txt-gray {
	color: #797568;
}
.txt-tax {
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
	color: #D8D8D8;
}
.txt-small {
	margin-top: 20px;
	font-size: 14px;
	color: #D8D8D8;
}


.ticket-box {
    padding: 40px;
	margin-left: auto;
    margin-right: auto;
	margin-bottom: 50px;
	width: 1100px;
	text-align: left;
	background: #111111;
	color: #D8D8D8;
}
@media only screen and (max-width: 950px) {
.ticket-box {
    padding: 20px;
	margin-bottom: 50px;
	width: 97%;
}
}
.txt-subject {
	font-size: 1.8rem;
	line-height: 1.2;
	font-family: yu-mincho-pr6n, sans-serif;
	color: #FFFFFF;
	text-align: center;
	margin-bottom: 10px;
	color: #b8a25f;
}
@media only screen and (max-width: 950px) {
.txt-subject {
	font-size: 1.6rem;
	margin-bottom: 5px;
	line-height: 1.4;
}
}
.txt-subject-b {
	font-size: 2.8rem;
	line-height: 1.2;
	font-family: yu-mincho-pr6n, sans-serif;
	color: #FFFFFF;
	text-align: center;
	margin-bottom: 10px;
	color: #b8a25f;
}
@media only screen and (max-width: 950px) {
.txt-subject-b {
	font-size: 1.8rem;
	margin-bottom: 5px;
	line-height: 1.4;
}
}
.txt-big {
	margin-top: 20px;
	font-size: 18px;
	color: #D8D8D8;
	text-align: center;
}
@media only screen and (max-width: 950px) {
.txt-big {
	margin-top: 10px;
	font-size: 16px;
}
}
.ticket-box p {
    padding-top: 10px;
}
.ticket-box img  {
	width: 100%;
}

.ticket-box hr{
	height: 1px;
    background:linear-gradient(to left, #56bbe8,#f4c1d0,#b2ceeb);
    border: none;
	width: 98%;
	margin-left: auto;
    margin-right: auto;
	margin-top: 30px;
	margin-bottom: 18px;
}
.ticket-box a:link {
	color:#b8a25f;
	text-decoration: none;
	outline: none;
}	
.ticket-box a:visited {
	color:#b8a25f;
	text-decoration: none;
	outline: none;
}
.ticket-box a:hover{
	color:#AF6667;
	text-decoration: none;
	outline: none;
}
.ticket-box a:focus {
	color:#AF6667;
	text-decoration: none;
	outline: none;
}

.premium-goods img{
	max-width: 85%;
}
@media only screen and (max-width: 950px) {
.premium-goods img{
	max-width: 98%;
}
}

/*------------------------
    intro
--------------------------*/
#intro-section {
	width: 1150px;
	margin: 10px auto 0;
	margin-bottom: 100px;
	font-size: 2.1rem;
	font-family: yu-mincho-pr6n, sans-serif;
	line-height: 1;
	color: #b8a25f;
	letter-spacing: 0.2em;
}	
@media only screen and (max-width: 950px) {
#intro-section {
	width: 96%;
	font-size: 1.8rem;
	letter-spacing: 0.1em;
	line-height: 1.5;
}
}
/*PCでは無効（改行しない）*/
.sma{
    display: none;
}

/*スマートフォンでは有効（改行する）*/
@media screen and (max-width:768px) {
    .sma{
        display: block;
    }
}
.catch_copy span {
  transition: 1s;
  opacity: 0;
  transform: translateY(20px);
  display: block;
}
.catch_copy span:first-child {
  animation: catch_anime 2.8s forwards 4s;　
}
.catch_copy span:nth-child(2) {
  animation: catch_anime 2.8s forwards 6s;
}
.catch_copy span:nth-child(3) {
  animation: catch_anime 2.8s forwards 6s;
}
.catch_copy span:nth-child(4) {
  animation: catch_anime 2.8s forwards 8s;
}
.catch_copy span:nth-child(5) {
  animation: catch_anime 2.8s forwards 8s;
}
@keyframes catch_anime {
  0% {
    transform: translateY(5px);
  }
   100% {
    opacity: 1;
    transform: translateY(0);
  }
}


/*------------------------
    project
--------------------------*/
#project-section {
	width: 1150px;
	margin: 0 auto;
	margin-bottom: 100px;
	display: flex;
    justify-content: space-around;
	flex-wrap: wrap;
}	
@media only screen and (max-width: 950px) {
#project-section {
	width: 99%;
}
}
.project-box{
	margin: 0 auto;
	padding: 10px;
	background: #111111;
	width: 32%;
	text-align: left;
	display: inline-block;
	margin-bottom: 10px;
	
}
@media only screen and (max-width: 950px) {
.project-box{
	width: 98%;
	margin-bottom: 10px;
}
}

a:link {
	font-size: 14px;
	color:#FFFFFF;
	text-decoration: none;
	outline: none;
 transition: color .5s;
}	
a:visited {
	font-size: 14px;
	color:#FFFFFF;
	text-decoration: none;
	outline: none;
}
a:hover{
	font-size: 14px;
	color:#AF6667;
	text-decoration: none;
	outline: none;
 transition: color .5s;
}
a:focus {
	font-size: 14px;
	color:#D1D1D1;
	text-decoration: none;
	outline: none;
}

.entry-image {
	float: left;
	margin-right: 20px;
}
.entry-image img  {
	width: 130px;
}

.topics li {
	display: inline-block;
	height: auto;
	clear: both;
	margin-bottom: 30px;
	width: 100%;
}

.entry-title {
}

.entry-date {
	color:#727272;
}





/*------------------------
    フッター
--------------------------*/

footer {
	margin: 180px auto 10px;
	text-align: center;
	position:relative;
	display: block;
}
.copy {
	margin: 0px;
	padding-bottom: 20px;
	font-size: 13px;
	color: #cccccc;
}
.copy-logo {
	position:relative;
	text-align: center;
	transform: translateY(-50%) ;
	-webkit- transform: translateY(-50%);
}
.copy-logo img {
	width: 200px;
	margin: 0 10px;
	vertical-align: middle;
}
footer a:hover{
	opacity: 0.5;
	transition: all 0.5s;
}
@media only screen and (max-width: 750px) {
footer {
	margin: 100px auto 10px;
}
.copy {
	padding-bottom: 10px;
	font-size: 12px;
}
.copy-logo img {
	width: 30%;
	margin: 0 10px;
}
}

/*------------------------
    PCスマホ画像切り替え
--------------------------*/

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; margin-left: auto; margin-right: auto;}
.sp { display: none !important;  margin-left: auto; margin-right: auto;}
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
.pc { display: none !important; margin-left: auto; margin-right: auto; }
.sp { display: block !important; margin-left: auto; margin-right: auto; }
}

/*------------------------
    Preloder
--------------------------*/
#preloder {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 999999;
  background: #000;
}
.pre-logo {
	position: fixed;
	width: 300px;
	top: 45%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
}
.pre-logo img {
  width: 100%;
}
@media only screen and (max-width: 750px) {
.pre-logo {
	width: 60%;
}
}

.loader {
  width: 30px;
  height: 30px;
  border: 3px solid #000;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -13px;
  margin-left: -13px;
  border-radius: 60px;
  border-left-color: transparent;
  animation: loader 1s linear infinite;
  -webkit-animation: loader 1s linear infinite;
}

@keyframes loader {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@-webkit-keyframes loader {
  0% {
    -webkit-transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(180deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}


/*------------------------
    インラインフレーム
--------------------------*/

.scroller {
  width: 100%;
  height:600px;
  padding: 0 10px;
  overflow:scroll;
  overflow-x:hidden;
  display: flex;
  flex-direction: column-reverse; /* Flexアイテムの配置方向を下から上にする */
}

/*------------------------
    ボタン
--------------------------*/

.btn--orange,
a.btn--orange {
  color: #fff;
  background-color: #510001;
	padding: 10px 40px;
	display: inline-block;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
	font-size: 1.6rem;
	transition: all 0.5s;
	font-weight: 600;
	margin: 15px 0 10px;
	text-align: center;
}
.btn--orange:hover,
a.btn--orange:hover {
  background: #000000;
transition: all 0.5s;
}

a.btn--radius {
   border-radius: 100vh;
}