@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/* base
================================ */
::selection {
  background: #8f7654;
  color: #ffffff;
}
::-moz-selection {
  background: #8f7654;
  color: #ffffff;
}

#wrap{ position: relative; padding-top: 90px;}
#wrap.page--home{ padding-top: 0;}

/* title */

h2 {
	font-size: 40px;
	margin-bottom: 30px;
	text-align: center;
	letter-spacing: 3px;
}
h2.sectionTit {
    font-size: 4.2vw;
    position: relative;
    color: #8f7654;
    font-family: 'Barlow Condensed', sans-serif;
    line-height: 1.5;
    font-weight: 300;
}

/* more */
.more,.backLink { display: block; text-align: center; margin: 0 auto; }
.more a{
  display: inline-block;
  width: auto;
  font-weight: bold;
  color: #8f7654;
  background: #fff;
  text-align: center;
  font-size: 14px;
  line-height: 48px;
  text-decoration: none;
  border-radius: 40px;
  box-sizing: border-box;
  padding: 0 2em;
  transition: .3s;
  box-shadow: 0px 2px 8px 0px rgba(143, 118, 84, 0.1);
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 500;
}
.more a:hover{
    box-shadow: 0px 10px 30px 0px rgba(143, 118, 84, 0.2);
}
.backLink{ margin-top: 40px}
.backLink a {
  display: inline-block;
  width: auto;
  font-weight: bold;
  color: #8f7654;
  text-align: center;
  font-size: 15px;
  line-height: 48px;
  text-decoration: none;
  border-radius: 40px;
  box-sizing: border-box;
  padding: 0 2em;
font-family: 'Barlow Condensed', sans-serif;
}



/* entry */
ul.entry { max-width: 780px; min-height: 170px; padding: 0 20px; margin: 0 auto 40px; }
#news ul.entry{ padding:70px 20px 40px; }
ul.entry li {
	overflow: hidden;
	zoom: 1;
	margin-bottom: 20px;
	display: table;
	width: 100%;
	font-size:16px;
	line-height:1.6em;
}
ul.entry li p.entryTtl { display: table-cell; }
ul.entry li p.date {
	display: table-cell;
	width: 130px;
	font-size: 13px;
	font-style: italic;
	color: #fddd36;
	text-align: right;
	padding-right: 5px;
}
ul.entry li a { color: #fff; text-decoration: none;}
ul.entry li a:hover { color: #fddd36; text-decoration: none;}
#svg{ display: none; }


/* clearfix
================================ */
.clearfix:after,.clearfix:before{display:table;content:" "}.clearfix:after{clear:both}


/* header
================================ */
#header {
	width: 96%;
	height: 80px;
	position: fixed;
	top: 30px;
	left: 2%;
	z-index: 101;
    background: #fff;
}
#header > h1{display:none;}

/* home */

#header h1 img{ width: 100%; height: auto; }
#header h1 a{ display: block;}
#header h1 ul{
    display: -webkit-flex;
    display: flex;
    flex-flow: row wrap;
}

#header h1 ul li{
    display: block!important;
	margin-right: 0!important;  
    padding: 3px;	  
}
#header h1 ul li img{
display: none;
}
#header h1 ul li:nth-child(1){
	width: 12vw;
}
#header h1 ul li:nth-child(2){
    width: 3vw;
}
#header h1 ul li:nth-child(2) img{

}

#header #menu{
	width: 100%;
	text-align: right;
	position: absolute;
	left: 0;
	top: 20px;
}
#header #menu ul{
	margin-right: 2%;
}
#header #menu li{
	display: inline-block;
	margin-right: 0.5vw;
}
#header #menu li a{
	display: block;
	color: #222222;
    font-weight: 600;
	font-size: min(17px, 1.2vw);
	text-decoration: none;
	letter-spacing: 0.02em;
    font-family: 'Barlow Condensed', sans-serif;
}
#header #menu li.pc{
	display: inline-block !important;
}
#header #menu li a:hover{
	color: #8f7654;
}
#header #menu li.mail{
	vertical-align: -2px;
	margin-left: -10px;
	margin-right: 0;
}
#header #menu li.mail a{
	font-size: 10px;
	line-height: 10px;
	text-align: center;
	text-decoration: none;
	font-weight: 700;
  transform: scale(0.8);
}
#header #menu li.mail img{
	width: 2vw;
	vertical-align: -3px;
}
#header #menu li.twitter a{
	font-size:1vw; 
}

#header #menu li.twitter img{
	width:12px; 
}

#header #menu li.instagram a{
	font-size:1vw; 
}
#header #menu li a svg{
	width: 1vw;
	height: 1vw;
	fill: #222222;
	vertical-align: -3px;
	transition: .3s;
}
#header #menu li a:hover svg{
	fill:#8f7654;
}
.page--home #header #menu li:first-child{ display: none;}

#header #menu li.tikTok svg{
position: relative;
    top: -2px;
}
#header #menu li.youtube a{
	font-size: 1vw;
    position: relative;
    top: -1px;
    left: -2px;
}



#header #subMenu #snsList{ display: none;}
@media screen and (min-width:960px){
	.menu--mag,
	.menu--twitter{ display: none !important;}
}

/* footer
================================ */
#footer{ padding: 0 0 40px;}
.pageTop {
  width: 100px;
  height: 100px;
  position: fixed;
  bottom: 20px;
  right: 2%;
  z-index: 100;
  transition: .3s;
  transform: translate3d(0,200px,0);
    display: none;  
}
.pageTop a {
  display: block;
  width: 100%;
  height: 100%;
  background: no-repeat url(/image/img/1907/ico_pagetop.gif) center;
  background-size: contain;
  transition: 0.3s cubic-bezier(0.29, 10, 0.41, 1.93);
}
.pageTop a:hover{
  transform: scale(1.05);
}
.headerFixed .pageTop {
  transform: translate3d(0,0,0);
}

.copyright { text-align: center; font-size: 12px; opacity: 0.4; margin-top: 5px; }
.logoId{ */width: 70px;*/ margin: 0 auto 20px; }
.logoId a{ display: block; width: 100%; -webkit-transition: .3s; transition: .3s;  }
.logoId a:hover{ opacity: 0.5; -webkit-transition: .3s; transition: .3s; }
.logoId img{ width: 100%; }

#google_translate_element{
    position: fixed;
    bottom: 0;
    left: 0;
    padding: 10px 20px;
    overflow: hidden;
    background: #8f7653;
    border-radius: 0 3px 0 0;
}



/* home
================================ */
/* common
-------------------------------- */
#svg-animation{
    width: 80%;
    height:160px;
}
#header #menu h1{
	width: 18%;
	top: 60%;
    transform: translateY(-50%);
    left: 2%;
    position: absolute;
    transition:0.3s;
}
#header h1 a {
    line-height: 0;
}

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


}



#header #subMenu{
  top: 14px;
}
/*
section:not(:last-child){
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-align-items: center;
	-webkit-align-items: center;
	align-items: center;
	-ms-flex-pack: justyify;
	-webkit-justify-content: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	color: #222222;
    padding: 30px 0;
    margin-bottom: 0px;
	position: relative;
}

.home section:last-child{
	width: 100%;
	height: 100%;
	color: #222222;
	padding: 120px 0 30px;
	position: relative;
}
*/
.page--home section:not(:last-child){
    margin: 0 auto 60px;

}
#other{ padding-top: 0; }

section .inner{ width: 70%; box-sizing: border-box; -webkit-box-sizing: border-box; position: relative; }
section a{ color: #222222; text-decoration: none;}
section .infoList{
	margin-bottom: 20px;
}
.infoList li {

}
.infoList li a{
  display: block;
  transition: .3s;
  padding: 12px 20px;
  border-radius: 10px;
}
.infoList .title{ font-size: 16px; word-break: break-all;}
.infoList .date{
  display: inline-block;
  font-size: 14px;
  font-weight: 500;
  position: relative;
    font-family: 'Barlow Condensed', sans-serif;
}
.detail .infoList .date{
  float: left;
}
.page--home #live .infoList .date:not(.event),
.page--home #media .infoList .date:not(.event){color: #999}
#live .infoList li .title span.new::after,
#infoDetail .date.new::after,
.infoList li.new .date::after{
    margin-left: 1em;
  content: 'New!';
  font-weight: normal;
  font-size: 18px;
  color: #c61010;
}
#infoDetail .date.event.new::after,
.infoList li.new .event.date::after{
  display: none;
}
.detail #media .infoList li.new .event.date::after{
  display: block;
}

#infoDetail .date.new::after{ top: -18px; right: -42px; }
.infoList .event.date{ font-size: 24px; font-weight: 500; text-align: center;}
.infoList li a:hover{
  background: #fff;
 box-shadow: 0px 10px 30px 0px rgba(143, 118, 84, 0.2);
}
 

/* hero
-------------------------------- */
#hero{
	height: 100%;
	padding:0;
	margin: 0 auto 20px;
    min-height: 1000px;	
}
#hero figure{
	position: relative;
}
#hero img{
	display: block;
	width: 100%;
}
#hero img.cover{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
/* scroll */
.scroll {
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 1px;
	height: 70px;
	z-index: 1;
}
.scroll:after {
	content: " ";
	width: 100%;
	position: absolute;
	height: 100%;
	display: block;
	content: "";
	top: 0px;
	background: #222222;
	-webkit-animation: scroll 1.2s linear 0s infinite;
	animation: scroll 1.2s linear 0s infinite;
}
.hero{ height: 100%; height: 100vh; position:relative; }
@-webkit-keyframes scroll {
	0%{ height: 0; top: 0; bottom: auto; }
	46% { height: 100%; top: 0; bottom: auto; }
	50% { height: 100%; bottom: 0; top: auto; }
	54% { height: 100%; bottom: 0; top: auto; }
	100% { height: 0; bottom: 0; top: auto;}
}
@keyframes scroll {
	0%{ height:0%; top:0px; bottom:auto; }
	46% { height: 100%; top: 0; bottom: auto; }
	50% { height: 100%; bottom: 0; top: auto;}
	54% { height: 100%; bottom: 0; top: auto;}
	100% { height: 0; bottom: 0; top: auto; }
}


/* keyVisual
-------------------------------- */
.home #keyVisual{ padding:0;background: #fff; }
.home #keyVisual img{
	display:block;
	width: 100%;
	height: 100%;
	height: 100vh;
	background: no-repeat center top;
	background-size: contain;
}



/* bnrArea
-------------------------------- */
#bnrArea{
    position: relative;
    overflow: hidden;
    width: 100%;   
}
#bnrArea .slick-slider li{
  margin: 0 10px;
}
#bnrArea .slick-slider a{
  display: block;
  margin: 0;
  line-height: 0;
}
#bnrArea .slick-slider img{
  width: 100%;
  box-shadow: 0px 2px 8px 0px rgba(143, 118, 84, 0.1);
}
#bnrArea .slick-dots{ bottom:-50px;}
#bnrArea #arrows{
    position: absolute;
    width: 80%;
    left: 10%;
    bottom: 60px;
}
#bnrArea .slick-prev,
#bnrArea .slick-next{
    width: 35px;
}
#bnrArea .slick-prev::before,
#bnrArea .slick-next::before{display: none;}
#bnrArea .slick-dots li button::before{
    width: 20px;
    height: 20px;
    opacity: 1;
    background: url(/image/img/1907/dot.png) no-repeat 50% 50%;
    background-size: contain;
    transition: .3s all;
}
#bnrArea .slick-dots li button:hover::before,
#bnrArea .slick-dots li.slick-active button::before{
    background-image: url(/image/img/1907/dot_current.png);
}
.btmBnr{
  width:100%;
}

.btmBnr ul{
  margin: 0 auto;
  width:84%;
  text-align:center;
  line-height:0;
}
.btmBnr ul li{
  display:inline-block;
  width: 29%;
  margin: 0 2%;
}


.btmBnr ul{
  margin: 0 auto;
  width:96%;
}
.btmBnr ul li{
  width: 22%;
  margin: 0 1%;
}

.btmBnr ul li a{ display:block;line-height:0; transition: .3s;}
.btmBnr{
  margin-bottom: 80px;
}


/* movie
-------------------------------- */
.home #movie { overflow: hidden; position: relative;}
.home #movie .inner{ width:100%; }
#movieMain{ width: 70%; margin: 0 auto 100px; }
#movieList{ width: 100%; }
.movieInner{
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	background: #222222;
	overflow: hidden;
	margin-bottom: 10px;
}
.movieInner iframe,
.movieInner object,
.movieInner embed {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.movieThumb::after {
	content: '';
	display: block;
	width: 35px;
	height: 35px;
	background: url(/image/img/1907/ico_play.png) no-repeat center;
	background-size: contain;
	-webkit-background-size: contain;
	margin-left: -32.5px;
	margin-top: -32.5px;
	position: absolute;
	bottom: 20px;
	right: 5%;
	z-index: 50;
}
.movieThumb::before{
    content: '';
	display: block;
    width: 100%;
    height: 120px;
      background-image: -moz-linear-gradient( 90deg, rgba(0,0,0,0.90196) 0%, rgba(0,0,0,0) 100%);
      background-image: -webkit-linear-gradient( 90deg, rgba(0,0,0,0.90196) 0%, rgba(0,0,0,0) 100%);
      background-image: -ms-linear-gradient( 90deg, rgba(0,0,0,0.90196) 0%, rgba(0,0,0,0) 100%);
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 49;
}
.movieThumb a{ display: block;}
.movieThumb a img,
.movieThumb > img{
	display: block;
	position: relative;
	top: -6.45vw;
}

#movieList .movieThumb > img,
#movieList .movieThumb a img{ top: -4.4vw; }

#movieList li{ position: relative; margin-right: 20px; }
#movieList li .tit{ 
    font-weight: bold;
    position: absolute;
    width: 60%;
    color: #fff;
    bottom: 20px;
    left: 5%;
    z-index: 50;
}

#movie .sectionTit{ text-align: left; margin-bottom: 40px;padding: 0 3%;}
/* slick */
#arrows2{
    position: absolute;
    width: 170px;
    right: 5%;
    top: 100px;
}
#movie .slick-list{ overflow: visible; }
#movie .slick-track { left: 12%}
#movie .slick-prev,
#movie .slick-next{
    width: 35px;
}
#movie .slick-prev::before,
#movie .slick-next::before{display: none;}
.slick-disabled{ opacity: 0.3}
.slick-prev{ left: auto; right: 0;}
.slick-next{ right: auto; left: 85px}
.slick-counter{ position: absolute; top:-30px;left: 0; width: 60px; height: 50px; font-family: brandon-grotesque, sans-serif; font-weight: bold;line-height:50px;text-align: center;}
.slick-counter span{ position: relative; display: inline-block;width: 30px;text-align: center;    font-family: 'Barlow Condensed', sans-serif;}
.slick-counter::after{position: absolute; left: 15px;top:50%; content:'';display: inline-block;height: 1px;width:30px;background: #333;-webkit-transform: rotate(-60deg);transform: rotate(-60deg)}
.slick-counter .current{ top:-10px;}
.slick-counter .total{ top:10px;}

/*
#movieList:hover .slick-next.slick-arrow{ display: block; left: 10%; opacity: 1;}
#movieList:hover .slick-prev.slick-arrow{ display: block; right: 10%; opacity: 1;}
*/

/* info
-------------------------------- */
.list--tabs{
    width: 94%;
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    -ms-flex-align: stretch;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    align-items: stretch;
}
#info h2.sectionTit{ width: 100%; text-align: left;margin: 0;}
.list--tabs > li{
    position: relative;
    padding: 0 3%;
    width: 33%;
}
.block--info .more{
    position: absolute;
    top: 35px;
    right: 3%;
}

/* live
-------------------------------- */
.liveBtn{ text-align: center; margin-bottom: 20px; }
.liveBtn a{ display: inline-block; border: 1px solid #222; font-size: 14px; padding: 10px 40px; }
.liveBtn a i{ display-inline-block; font-size: 14px; margin-left: 5px; }




/* media
-------------------------------- */
#media .infoList .event.date{ text-align: left; margin-bottom: 0; }


/* profile
-------------------------------- */
#profile ul {
    width: 75%;
    margin: 0 auto;
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    -ms-flex-align: stretch;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    align-items: stretch;
}
#profile .txt{ width: 60%;margin: 50px auto 140px;}
#profile ul li {
    -webkit-transition: .3s all;
    transition: .3s all;
    position: relative;    
    top:0;
}
#profile ul li:nth-child(2),
#profile ul li:nth-child(4) { margin-top: 20px;}
#profile ul li:not(:last-child){ margin-right: 3%}
#profile ul li img{ border-radius: 10px;box-shadow:0px 2px 8px 0px rgba(143, 118, 84, 0.2); -webkit-transition: .3s all; transition: .3s all;}
#profile ul li .twitter img{ border-radius: 10px;box-shadow:none;width:17px; -webkit-transition: .3s all; transition: .3s all;}
#profile ul li .twitter a{ padding-top:4px;}
#profile ul li:hover { top: -10px;cursor: pointer;}
#profile ul li:hover img{ box-shadow: 0px 10px 30px 0px rgba(143, 118, 84, 0.4);}
#profile ul li h4 {
    position: absolute;
    top: 40px;
    left: 5%;
    font-size: 2vw;
    color: #fff;
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
}

.block--profile{
 display: none;
    position: fixed;
    top:0;
    width: 100%;
    height: 100%;
    left: 0;
    margin: 0 auto;
    background: #fff;
    z-index: 999;
    box-shadow: 0px 18px 59px 0px rgba(143, 118, 84, 0.4);
    color: #8f7654;
}
.block--profile .ph{
    width: 50%;
    line-height: 0;
    overflow: hidden;
}
.block--profile .name{ font-size: 40px;margin: 0 0 1em}
.block--profile .data{
    width: 40%;
    position: absolute;
    top:50%;
    right: 0;
    font-size: 18px;
    -webkit-_ransform: translateY(-50%);
    transform: translateY(-50%);
}
.block--profile .prof_detail{
    line-height: 3em;
}
.block--profile .prof_detail a{ 
display: inline-block;
width: 40px;
height: 40px;
margin: 30px 10px 0 0;
line-height: 40px;
font-size: 22px;
text-align: center;
border-radius: 50px;
background: #8f7654;
color: #fff;
}
.block--profile .prof_detail a:hover{ transform: scale(1.2); -webkit-transform: scale(1.2;color:#;)}
.block--profile .modal--close{ 
    position: absolute;
    right: 20px;
    top:20px;
    width: 80px;
    height: 80px;
    cursor: pointer;
    -webkit-transition: .3s all;
    transition: .3s all;
}
.block--profile .modal--close:hover{
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    
}
.block--profile .modal--close::before,
.block--profile .modal--close::after{
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -35px;
    content:'';
    display:block;
    width: 70px;
    height: 2px;
    background: #8f7654;
}
.block--profile .modal--close::before{
    -webkit-_ransform: rotate(45deg);
    transform: rotate(45deg); 
}
.block--profile .modal--close::after{
    -webkit-_ransform: rotate(-45deg);
    transform: rotate(-45deg); 
}

/* other
-------------------------------- */
.home #other{
    width: 90%;
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    -ms-flex-align: stretch;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    align-items: stretch;
}
.home #other > div{
    position: relative;
    width: 48%;
}
.home #other .twitterArea{ margin-right: 4%;}
.home #other .sectionTit{
    position: absolute;
    top:-60px;
    left: -10px;
    text-align: left;
}

.fanArea{
	background: #fff;
	padding: 40px;
	margin: 0 auto;
}
.letterTit{ font-size: 18px; font-weight: bold; text-align: center; margin: 40px 0 20px; }

/* DISCO
--------------------------------------------------------------------*/
#disco { position: relative;padding-bottom: 150px;}
#disco .discoInr { width: 80%; border-bottom: 1px solid rgba(53, 53, 53, 0.35); margin: 50px auto 0; z-index: 99; }
#disco .discoInr:last-of-type{ border-bottom: none; }
#disco .discoInr::after,
#disco .discoInr::before{display:table;content:" "}
#disco .discoInr::after{clear:both}
#disco dl dt { float: left; width: 36%; padding-right: 5%; margin-bottom: 50px; }
#disco dl dt img{ width: 100% !important; }
#disco dl dd {line-height: 200%;  padding: 0 0 40px 0; overflow: hidden; }
#disco .single,
#disco .album,
#disco .dvd,
#disco .blu-ray{
	display: inline-block;
	color: #222222;
	font-size: 10px;
	letter-spacing: 0.08em;
	line-height: 1;
	text-align: center;
	border: 1px solid;
	padding: 3px 12px 2px;
	margin-bottom: 10px;
}
#disco dl dd .title { font-size: 24px; line-height: 140%; margin: 0 0 18px; }
#disco dl dd .data { font-size: 13px; }
#disco .price{ font-size: 13px; }
#disco .subTxt{ font-size: 10px; }
#disco dl dd .lead { font-size: 12px; line-height: 1.6em; letter-spacing: 0.04em; margin-top: 30px;}

/* top */
#disco .more{
    position: absolute;
    top: 40px;
    right: 5%;
}
.page--home #disco h2.sectionTit{ text-align: left;margin-bottom: 40px;    padding: 0 3%;}
.top_disco{
    width: 90%;
    margin: 0 auto;
    padding-left: 5%;
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    -ms-flex-align: stretch;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    align-items: stretch;
}
.top_disco li{
    position: relative;
    width: 45%;
    margin-right: 3%;
}
.top_disco li:last-child{margin-right: 0;}
.top_disco .data{ 
    position: absolute;
    right: 2.5%;
    top: 0;
    font-weight: 600;
      -webkit-writing-mode: vertical-rl;
          -ms-writing-mode: tb-rl;
              writing-mode: vertical-rl;
}
.top_disco .title{ font-weight: bold; margin-top: 10px}
.top_disco .jacket{
    position: relative;
    width: 88%;
    line-height: 0;
    box-shadow:0px 2px 8px 0px rgba(143, 118, 84, 0.2);
    -webkit-transition: .3s all;
    transition: .3s all;
}
.top_disco a:hover .jacket{
    box-shadow: 0px 18px 59px 0px rgba(143, 118, 84, 0.4);
}

.top_disco .jacket::after{
    z-index: -1;
    position: absolute;
    top: 14%;
    right: -14%;
    content:'';
    display: block;
    width: 100%;
    height: 100%;
    background: #ede4d8;
}

/* popUp
-------------------------------- */
#popUp{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 5000;
}
.popUpInner{
	width: 800px;
	margin-top: -240px;
	margin-left: -400px;
	position: fixed;
	top: 50%;
	left: 50%;
}
#popUp .cover{
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.9);
	position: relative;
	top: 0;
	left: 0;
	cursor: pointer;
}

#popUp .bnrArea{ display:none; }
#popUp .movieArea{ width: 800px; height: 450px; margin: 0 auto 100px; overflow: hidden;}
#popUp .movieInner{ width: 800px; height: 450px; }
#popUp .movieInner iframe,
#popUp .movieInner .movieInner object,
#popUp .movieInner embed{
	width: 800px;
	height: 450px;
	position: static;
}
#popUp .close{
	width: 50px;
	height: 50px;
	position: absolute;
	top: -50px;
	right: -50px;
	-webkit-transition: .3s;
	transition: .3s;
}
#popUp .close::before{
	display: block;
	content:'';
	width: 100%;
	height: 1px;
	background: #fff;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	position: absolute;
	top: 24px;
	left: 0;
}
#popUp .close::after{
	display: block;
	content:'';
	width: 100%;
	height: 1px;
	background: #fff;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	position: absolute;
	top: 24px;
	left: 0;
}
#popUp .close:hover{ opacity: 0.5; cursor: pointer; -webkit-transition: .3s; transition: .3s; }


/* entry list
-------------------------------- */
#entryList { background-color: #222222; padding: 0 0 140px;}
#entryList h2 { padding-top:30px; font-size: 28px; }
#entryList ul.entry { margin-bottom: 100px; }

.pageNav{ text-align: center; margin:50px auto; position:relative; }
.pageNav li { display: inline-block; margin-right: 5px;font-weight: bold;}
ul.pageNav li a{
    display: block;
    width: 40px;
    height: 40px;
    text-decoration: none;
    color: #222222;
    text-align: center;
    line-height: 40px;
    box-sizing: border-box;
    transition: .3s;
    border-radius: 40px;
}
ul.pageNav li.current{
  color:#fff;
  background: #222222;
  border-radius: 40px;
  width: 40px;
  height: 40px;
  line-height: 40px;
}
ul.pageNav li a:hover{background:#fff}
ul.pageNav li:last-child{ margin-right: 0px; }


/* entry detail
--------------------------------------------------------------------*/

#infoDetail { word-break: break-all;}
#infoDetail h2{ padding-top:30px; font-size: 28px; }
#infoDetail h3 { font-size: 18px; line-height: 30px; text-align: center; margin-bottom: 15px; }
#infoDetail p { font-size: 14px; line-height: 30px; margin-bottom: 20px; }
#infoDetail table{ color: #fff; }
#infoDetail a { color:#222222; text-decoration: underline; }
#infoDetail a:hover { text-decoration: none; opacity: 0.8;}
#infoDetail .date.event{ font-size: 20px; margin-bottom: 20px;}
#infoDetail .title{ font-size: 28px; line-height: 150%; margin-bottom: 10px; }
#infoDetail .date{ display: inline-block; font-size: 14px;margin-bottom: 60px; position: relative;}
#infoDetail .textArea{ line-height: 190%; font-size: 14px; }
.twitterArea{
  padding: 40px 40px 30px;
  background: #fff;
}
iframe.timeline .stream { width:100% !important; }
iframe.timeline{ width:100% !important; max-width:100% !important; }
iframe#twitter-widget-0 { width:100% !important; max-width:100% !important; }
#moviePopup {
	display: none;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.8);
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 9996;
}
#moviePopup #bg {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
}
#moviePopup #close {
	width: 80px;
	height: 80px;
	position: absolute;
	top: 0px;
	right:10px;
	z-index:999;
	cursor:pointer;

}
#moviePopup #close:before,
#moviePopup #close:after {
	content: '　';
	display: block;
	width: 80px;
	height: 80px;
	-webkit-transition: .3s;
	transition: .3s;
	position: absolute;
	left: 0;
	top: 0;
}
#moviePopup #close:before { background: url(/image/btn_close.png) no-repeat center center; }
#moviePopup #close:after { background: url(/image/btn_close_hover.png) no-repeat center center; opacity: 0; }
#moviePopup #close:hover::before { opacity: 0; }
#moviePopup #close:hover::after { opacity: 1; }
#moviePopup #inner { width: 100%; height: 100%; position: relative; z-index:99; }

.buyBnr{ overflow:hidden; margin-top:15px;  }
.buyBnr li{ width:110px; float:left; margin-right:10px; }
.buyBnr li:last-child{ margin:0; }

/* detail
================================ */

#container.detail{ padding-top: 40px; position:relative;}
.detail section{ color: #222222; padding: 60px 0 ; margin-bottom: 80px; }

.detail h1{ height: 100px; background: #fff; padding: 50px 0;}
.detail h1 a{ display: inline-block; -webkit-transition: .3s; transition: .3s;}
.detail h1 a:hover{ opacity: 0.4; -webkit-transition: .3s; transition: .3s;}
.detail h1 svg{ width: 200px; height: 90px;}

.detail section:not(:last-child),
.detail section .infoList{ display: block; box-sizing: border-box; -webkit-box-sizing: border-box; }
.detail section .inner{ width: 60%; margin: 0 auto; }
.detail section .infoList{ width: 100%; margin: 0 auto; }

.detail .infoList li{ margin:0; }
.detail #live .infoList li{ margin-bottom: 20px; }
.detail .infoList a{ color: #222222; }
.detail .infoList .title{
  padding-left: 154px;
  margin-bottom: 0;
}
.detail .infoList .event.date{
	float: left;
	font-size: 24px;
	text-align: left;
	letter-spacing: 0.02em;
  line-height: 1.2;
	margin-bottom: 0;
	margin-right: 40px;
}
.detail #mainBnr{
  box-sizing: border-box;
  text-align: center;
  padding: 0 15% 170px;
  margin-bottom: 0;
}
.detail #mainBnr ul li{ display:inline-block; width: 22.5%; width: calc(100%/4 - 2.7%); margin: 0 3% 0 0; }
.detail #mainBnr ul li:last-child{ margin:0; }
.detail #mainBnr ul li a{ display:block; }
.detail #mainBnr:after,
.detail #mainBnr:before{display:table;content:" "}
.detail #mainBnr:after{clear:both}

.detail + #footer{ padding-bottom: 20px; }



body {
    background: #fff;
}
.artistImg {
    position: relative;
}
.artistImg img.cover {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
#hero {
    height: 100vh;
    position: relative;
}
#cover {
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.loaded .blur.mainLogo{
}
.page--home #header {
    opacity: 0;	
	-webkit-animation: blurAnim 2s linear 1.5s forwards;
	animation:blurAnim 2s linear 1.5s forwards;
}
.loaded #header{


}

.logo{
    width: 800px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    opacity: 0;    
}

.loaded .logo{
  -webkit-animation: upIn 0.5s ease 0.5s 1 forwards;
  animation: upIn 0.5s ease 0.5s 1 forwards;
}

@keyframes upIn {
	0% {
		-webkit-transform: translate(-50%, -30%);
		transform: translate(-50%, -30%);
	}
	100% {
		opacity: 1;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
	}
}

.logoArea .scrollArea{
	position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-animation: flash 3s ease 1.6s infinite forwards;
    animation: flash 3s ease 1.6s infinite forwards;  
    opacity: 0;      
    transform: translate(-50%,0);
    -webkit-transform: translate(-50%,0);
    -ms-transform: translate(-50%,0);    
}
.logoArea .scrollArea .scrollTxt{
    text-align: center;
    display: block;
    margin: auto;
    font-size: 15px;    
    font-family: 'Barlow Condensed', sans-serif;
}
.logoArea .scrollArea .scroll {
	display: block;
    width: 50px;
    height: 60px;
    z-index: 10;
    text-decoration: none;
    text-align: center;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-animation: logoFade 0.3s ease 1.4s 1 forwards;
    animation: logoFade 0.3s ease 1.4s 1 forwards;
    position: relative;
    left: auto;    
}
.logoArea .scrollArea .scroll:after {
    content: "";
    position: absolute;
    height: 100%;
    width: 1px;
    top: 0px;
    left: 0;
    right: 0;
    margin: auto;
    display: block;
    background: #000;
    -webkit-animation: scroll 2s linear 0s infinite;
    animation: scroll 2s linear 0s infinite;
}
  @-webkit-keyframes scroll {
    0%{ height: 0; top: 0; bottom: auto; opacity: 0; }
    35%{ opacity: 1; }
    46% { height: 100%; top: 0; bottom: auto; }
    50% { height: 100%; bottom: 0; top: auto; }
    54% { height: 100%; bottom: 0; top: auto; }
    100% { height: 0; bottom: 0; top: auto;}
  }
  @keyframes scroll {
    0%{ height: 0; top: 0; bottom: auto; opacity: 0; }
    35%{ opacity: 1; }
    46% { height: 100%; top: 0; bottom: auto; }
    50% { height: 100%; bottom: 0; top: auto;}
    54% { height: 100%; bottom: 0; top: auto;}
    100% { height: 0; bottom: 0; top: auto; }
  }

@keyframes flash {
	0%{ opacity: 0;}
	30%{ opacity:1;}
	70%{ opacity:1;}
	100%{ opacity: 0;}
}  



/* patternA
-------------------------------- */

.logoArea.pattern_a .mainLogo{
	width: 600px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    opacity: 0;
    z-index: -1;  
	-webkit-animation: blurAnim 2s linear 1.5s forwards;
	animation:blurAnim 2s linear 1.5s forwards;     
}
.logoArea.pattern_a #cover.show {
  visibility: visible;
}
.logoArea.pattern_a #cover .panel {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 30;  
}
.logoArea.pattern_a.opening #cover{
    visibility: visible;
  z-index: 30;    
}

.logoArea.pattern_a.opening #cover .panel {
  height: 14.5%;
  background: #0f0f0f;

}
.logoArea.pattern_a.opening #cover .panel:nth-child(1) {
  top: 0%;
  -webkit-animation: anime1 0.8s ease 0.5s 1 forwards;
  animation:anime1 0.8s ease 0.5s 1 forwards;     
}
.logoArea.pattern_a.opening #cover .panel:nth-child(2) {
  top: 14.29%;
  -webkit-animation: anime1 0.5s ease 1s 1 forwards;
  animation:anime1 0.5s ease 1s 1 forwards;     
}
.logoArea.pattern_a.opening #cover .panel:nth-child(3) {
  top: 28.58%;
  -webkit-animation: anime1 1s ease 0.7s 1 forwards;
  animation:anime1 1s ease 0.7s 1 forwards;       
}
.logoArea.pattern_a.opening #cover .panel:nth-child(4) {
  top: 42.87%;
  -webkit-animation: anime1 0.8s ease 0.9s 1 forwards;
  animation:anime1 0.8s ease 0.9s 1 forwards;       
}
.logoArea.pattern_a.opening #cover .panel:nth-child(5) {
  top: 57.16%;
  -webkit-animation: anime1 0.5s ease 0.6s 1 forwards;
  animation:anime1 0.5s ease 0.6s 1 forwards;     
}
.logoArea.pattern_a.opening #cover .panel:nth-child(6) {
  top: 71.45%;
  -webkit-animation: anime1 0.8s ease 0.5s 1 forwards;
  animation:anime1 0.8s ease 0.5s 1 forwards;    
}
.logoArea.pattern_a.opening #cover .panel:nth-child(7) {
  top: 85.74%;
  -webkit-animation: anime1 0.5s ease 0.8s 1 forwards;
  animation:anime1 0.5s ease 0.8s 1 forwards;   
}
.logoArea.pattern_a.opening #cover .panel:first-child {
  border-top: none;
}
.logoArea.pattern_a #cover.floating {
  z-index: 30;
  visibility: visible;
}
.logoArea.pattern_a #cover.floating .panel {
  background: rgba(0, 0, 0, 0.88);
}


@keyframes anime1 {
	0% {
    height: 150px;
	}
	100% {
    height: 0;
	}
}


@-webkit-keyframes blurAnim {
0% {
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px);
	-ms-filter: blur(5px);
	filter: blur(5px);
    opacity: 0;	
}
100% {
	-webkit-filter: blur(0);
	-moz-filter: blur(0);
	-ms-filter: blur(0);
	filter: blur(0);
    opacity: 1;
}
}
@keyframes blurAnim {
0% {
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px);
	-ms-filter: blur(5px);
	filter: blur(5px);
    opacity: 0;		
}
100% {
	-webkit-filter: blur(0);
	-moz-filter: blur(0);
	-ms-filter: blur(0);
	filter: blur(0);
    opacity: 1;	
}
}



/* patternB
-------------------------------- */

.logoArea.pattern_b .mainLogo{
    width: 600px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    opacity: 0;    
}
.loaded .logoArea.pattern_b .mainLogo{
  -webkit-animation: upIn 2s ease 2s 1 forwards;
  animation: upIn 2s ease 2s 1 forwards;
}

.logoArea.pattern_b #cover_b {
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
}
.logoArea.pattern_b #cover_b.show {
  visibility: visible;
}
.logoArea.pattern_b #cover_b .panel {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.logoArea.pattern_b.opening #cover_b{
    z-index: 30;
    visibility: visible;
}
.logoArea.pattern_b.opening #cover_b .panel {
  height: 14.5%;
  background: #0f0f0f;

}
.logoArea.pattern_b.opening #cover_b .panel:nth-child(1) {
  top: 0%;
  -webkit-animation: anime2 1.2s ease 0.4s 1 forwards;
  animation:anime2 1.2s ease 0.4s 1 forwards;     
}
.logoArea.pattern_b.opening #cover_b .panel:nth-child(2) {
  top: 14.29%;
  -webkit-animation: anime2 1.2s ease 0.6s 1 forwards;
  animation:anime2 1.2s ease 0.6s 1 forwards;       
}
.logoArea.pattern_b.opening #cover_b .panel:nth-child(3) {
  top: 28.58%;
  -webkit-animation: anime2 1.2s ease 0.8s 1 forwards;
  animation:anime2 1.2s ease 0.8s 1 forwards;         
}
.logoArea.pattern_b.opening #cover_b .panel:nth-child(4) {
  top: 42.87%;
  -webkit-animation: anime2 1.2s ease 1s 1 forwards;
  animation:anime2 1.2s ease 1s 1 forwards;         
}
.logoArea.pattern_b.opening #cover_b .panel:nth-child(5) {
  top: 57.16%;
  -webkit-animation: anime2 1.2s ease 1.2s 1 forwards;
  animation:anime2 1.2s ease 1.2s 1 forwards;         
}
.logoArea.pattern_b.opening #cover_b .panel:nth-child(6) {
  top: 71.45%;
  -webkit-animation: anime2 1.2s ease 1.4s 1 forwards;
  animation:anime2 1.2s ease 1.4s 1 forwards;         
}
.logoArea.pattern_b.opening #cover_b .panel:nth-child(7) {
  top: 85.74%;
  -webkit-animation: anime2 1.2s ease 1.6s 1 forwards;
  animation:anime2 1.2s ease 1.6s 1 forwards;         
}
.logoArea.pattern_b.opening #cover_b .panel:first-child {
  border-top: none;
}
.logoArea.pattern_b #cover_b.floating {
  z-index: 30;
  visibility: visible;
}
.logoArea.pattern_b #cover_b.floating .panel {
  background: rgba(0, 0, 0, 0.88);
}

@keyframes anime2 {
	0% {
    width:100%;
	}
	100% {
    width: 0;
	}
}



.logoArea.pattern_b.re .mainLogo {
    width: 850px;
    }


/* patternC
-------------------------------- */

.logoArea.pattern_c .mainLogo{
    width: 600px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
  
}
.loaded .logoArea.pattern_c .mainLogo{

}

.logoArea.pattern_c #cover_b {
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
}
.logoArea.pattern_c #cover_b.show {
  visibility: visible;
}
.logoArea.pattern_c #cover_b .panel {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.logoArea.pattern_c.opening #cover_b{
    z-index: 30;
    visibility: visible;
}
.logoArea.pattern_c.opening #cover_b .panel {
  height: 14.5%;
  background: #0f0f0f;

}
.logoArea.pattern_c.opening #cover_b .panel:nth-child(1) {
  top: 0%;
  -webkit-animation: anime2 1.2s ease 0.4s 1 forwards;
  animation:anime2 1.2s ease 0.4s 1 forwards;     
}
.logoArea.pattern_c.opening #cover_b .panel:nth-child(2) {
  top: 14.29%;
  -webkit-animation: anime2 1.2s ease 0.6s 1 forwards;
  animation:anime2 1.2s ease 0.6s 1 forwards;       
}
.logoArea.pattern_c.opening #cover_b .panel:nth-child(3) {
  top: 28.58%;
  -webkit-animation: anime2 1.2s ease 0.8s 1 forwards;
  animation:anime2 1.2s ease 0.8s 1 forwards;         
}
.logoArea.pattern_c.opening #cover_b .panel:nth-child(4) {
  top: 42.87%;
  -webkit-animation: anime2 1.2s ease 1s 1 forwards;
  animation:anime2 1.2s ease 1s 1 forwards;         
}
.logoArea.pattern_c.opening #cover_b .panel:nth-child(5) {
  top: 57.16%;
  -webkit-animation: anime2 1.2s ease 1.2s 1 forwards;
  animation:anime2 1.2s ease 1.2s 1 forwards;         
}
.logoArea.pattern_c.opening #cover_b .panel:nth-child(6) {
  top: 71.45%;
  -webkit-animation: anime2 1.2s ease 1.4s 1 forwards;
  animation:anime2 1.2s ease 1.4s 1 forwards;         
}
.logoArea.pattern_c.opening #cover_b .panel:nth-child(7) {
  top: 85.74%;
  -webkit-animation: anime2 1.2s ease 1.6s 1 forwards;
  animation:anime2 1.2s ease 1.6s 1 forwards;         
}
.logoArea.pattern_c.opening #cover_b .panel:first-child {
  border-top: none;
}
.logoArea.pattern_c #cover_b.floating {
  z-index: 30;
  visibility: visible;
}
.logoArea.pattern_c #cover_b.floating .panel {
  background: rgba(0, 0, 0, 0.88);
}

@keyframes anime2 {
	0% {
    width:100%;
	}
	100% {
    width: 0;
	}
}


/* patternD
-------------------------------- */

.logoArea.pattern_d .mainLogo{
    width: 600px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    display: -webkit-flex;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
  
}
.logoArea.pattern_d .mainLogo p{
    width: 30%;
    -webkit-transform: translate(0, -100%); 
    transform: translate(0, -100%);    
	opacity: 0;
}
.logoArea.pattern_d .mainLogo p:nth-child(1){
 
} 
.logoArea.pattern_d .mainLogo p:nth-child(2){
  
}
.logoArea.pattern_d .mainLogo p:nth-child(3){
  
}
.loaded .logoArea.pattern_d .mainLogo p{

}
.loaded .logoArea.pattern_d .mainLogo p:nth-child(1){
  -webkit-animation: logoAnimeD_01 1.5s ease 3s 1 forwards;
  animation:logoAnimeD_01 1.6s ease 3s 1 forwards;  
}
.loaded .logoArea.pattern_d .mainLogo p:nth-child(2){
  -webkit-animation: logoAnimeD_05 1.2s ease 2.5s 1 forwards;
  animation:logoAnimeD_02 1.5s ease 2.5s 1 forwards; 
}
.loaded .logoArea.pattern_d .mainLogo p:nth-child(3){
  -webkit-animation: logoAnimeD_03 1.5s ease 2s 1 forwards;
  animation:logoAnimeD_03 1.5s ease 2s 1 forwards; 
}

.logoArea.pattern_d #cover_b {
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
}
.logoArea.pattern_d #cover_b.show {
  visibility: visible;
}
.logoArea.pattern_d #cover_b .panel {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.logoArea.pattern_d.opening #cover_b{
    z-index: 30;
    visibility: visible;
}
.logoArea.pattern_d.opening #cover_b .panel {
  height: 14.5%;
  background: #0f0f0f;

}
.logoArea.pattern_d.opening #cover_b .panel:nth-child(1) {
  top: 0%;
  -webkit-animation: anime2 1.2s ease 0.4s 1 forwards;
  animation:anime2 1.2s ease 0.4s 1 forwards;     
}
.logoArea.pattern_d.opening #cover_b .panel:nth-child(2) {
  top: 14.29%;
  -webkit-animation: anime2 1.2s ease 0.6s 1 forwards;
  animation:anime2 1.2s ease 0.6s 1 forwards;       
}
.logoArea.pattern_d.opening #cover_b .panel:nth-child(3) {
  top: 28.58%;
  -webkit-animation: anime2 1.2s ease 0.8s 1 forwards;
  animation:anime2 1.2s ease 0.8s 1 forwards;         
}
.logoArea.pattern_d.opening #cover_b .panel:nth-child(4) {
  top: 42.87%;
  -webkit-animation: anime2 1.2s ease 1s 1 forwards;
  animation:anime2 1.2s ease 1s 1 forwards;         
}
.logoArea.pattern_d.opening #cover_b .panel:nth-child(5) {
  top: 57.16%;
  -webkit-animation: anime2 1.2s ease 1.2s 1 forwards;
  animation:anime2 1.2s ease 1.2s 1 forwards;         
}
.logoArea.pattern_d.opening #cover_b .panel:nth-child(6) {
  top: 71.45%;
  -webkit-animation: anime2 1.2s ease 1.4s 1 forwards;
  animation:anime2 1.2s ease 1.4s 1 forwards;         
}
.logoArea.pattern_d.opening #cover_b .panel:nth-child(7) {
  top: 85.74%;
  -webkit-animation: anime2 1.2s ease 1.6s 1 forwards;
  animation:anime2 1.2s ease 1.6s 1 forwards;         
}
.logoArea.pattern_d.opening #cover_b .panel:first-child {
  border-top: none;
}
.logoArea.pattern_d #cover_b.floating {
  z-index: 30;
  visibility: visible;
}
.logoArea.pattern_d #cover_b.floating .panel {
  background: rgba(0, 0, 0, 0.88);
}

@keyframes anime2 {
	0% {
    width:100%;
	}
	100% {
    width: 0;
	}
}


@keyframes logoAnimeD_01 {
	0% {
		-webkit-transform: translate(0, -100%);
		transform: translate(0, -100%);
	}
	100% {
		opacity: 1;
		-webkit-transform:translate(0, 50%);
		transform: translate(0, 50%);
	opacity: 1;		
	}
}
@keyframes logoAnimeD_02 {
	0% {
		-webkit-transform: translate(0, -100%);
		transform: translate(0, -100%);
	}
	100% {
		opacity: 1;
		-webkit-transform:translate(0, 10%);
		transform: translate(0, 10%);
	opacity: 1;		
	}
}
@keyframes logoAnimeD_03 {
	0% {
		-webkit-transform: translate(0, -100%);
		transform: translate(0, -100%);
	}
	100% {
		opacity: 1;
		-webkit-transform:translate(0, -30%);
		transform: translate(0, -30%);
	opacity: 1;		
	}
}


ul.catBtn li,.linkbtn a{
    font-family: 'Barlow Condensed', sans-serif!important;
}


/* pc only
============================== */
@media screen and (min-width:960px) {
	.movieThumb{ cursor: pointer; background: #fff; }
	.movieThumb img{ transition: .3s; }
	.movieThumb:hover img{ opacity: 0.7; }
}
@media screen and (min-width:960px) and (max-width:1100px) {
  .detail section .inner { width: 80%; }
  .detail .infoList .title { width: calc(100% - 154px); }
}