@charset "utf-8";

/* =================================================

         UVERworld オフィシャル+ファンクラブ
         common

================================================= */
@import url('https://fonts.googleapis.com/earlyaccess/notosansjp.css');
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700');

/* base */
html,body {height:100%;min-height:100%;}
body {background: #fff;color: #000;}
a {
	color: #000;
	outline: none;
	text-decoration: none;
}
img {
	background: no-repeat center center;
	background-size: cover;
	line-height: 0;
}


.bold{font-weight: bold;}
.subTxt{font-size: 0.85em;}
.red{color: #c00;}
.center{text-align: center;}

#wrapper{position: relative;}

/* header
-------------------------------- */

#header #gNavi li{ font-weight: 700;}

/* footer
-------------------------------- */
#footer { position:absolute;bottom:0;width:100%;background: #202020;color: #fff;}
#footer a{color: #fff;}
#footer p.copyright{font-size: 10px;color: #555}

/* contents
-------------------------------- */
.btn a,
.new,
.sectionTit,
.subTit{
  font-weight: 700;
}
.bold{font-weight: bold;}
.subtxt{font-size: 0.85em;}

.sectionTit,
.subTit,
.date,
.tit,
.faq dt p,
.articleTit{
font-feature-settings : "palt";
letter-spacing:0.05em;
}


#loading{
	position: fixed;
	width: 100%;
	height: 100%;
	top:0;
	left:0;
	background: #fff;
	z-index: 999;
}

/* PROFILE */
.mfp-fade.mfp-bg {
  opacity: 0;
  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
.mfp-fade.mfp-bg.mfp-ready { opacity: 1;}
.mfp-fade.mfp-bg.mfp-removing { opacity: 0;}
.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;
  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
.mfp-fade.mfp-wrap.mfp-ready .mfp-content { opacity: 1;}
.mfp-fade.mfp-wrap.mfp-removing .mfp-content { opacity: 0;}
.mfp-container{ padding:0 6%!important;}
.popup-modal-dismiss{
position:fixed;
right:30px;
top:30px;
width:50px;
height:50px;
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;
cursor:pointer;
z-index:2;
}
.popup-modal-dismiss:hover{
-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.popup-modal-dismiss span{
top:25px;
width:50px;
height:2px;
position:absolute;
background:#ccc;
}
.popup-modal-dismiss .top{
position:absolute;
-moz-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.popup-modal-dismiss .bottom{
position:absolute;
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.page .mfp-bg{ background: #000;color: #fff;}
.photoPopup .box,
.profPopup .box{ color:#fff;}
.photoPopup .ph img,
.profPopup .ph img{	width: 100%;}
.profPopup .ph img{background-position: center top;}
.profPopup .detail{font-size: 13px}
.profPopup .name{margin-bottom: 10px;font-size: 22px;}
.profPopup .part{margin-bottom: 10px;color: #999;font-size: 12px}
.photoPopup .ph img{background-size: contain}

/* memberblog slick
--------------------------------- */
.page.memberblog .slick-prev:before,
.page.memberblog .slick-next:before {
  color: #000 !important;
}

.page.memberblog .slick-dots  {
  background: #fafafa;
  display: flex;
  justify-content: center;
  margin-top: 10px;
}


.page.memberblog .slick-dots li button {
 border: 0;
  text-align: center;
  transition: all 300ms ease;
  background: #000;
  border-radius: 50%;
  opacity: 0.25;
  color: transparent;
}
.page.memberblog .slick-dots .slick-active button{opacity: 1;}

.page.memberblog .buttons .button:hover {
  cursor: pointer;
  background-color: #000;
  color: #fff;
  transition: all 300ms ease;
}

/* blog コメント返信
--------------------------------- */
.page.blog .commentList .wrap--action .reply-form textarea{
width: 100%;
padding: 8px;
border-radius: 1px;
border-color: #888;
}


/* DISCOGRAPHY */
.disco.detail ol{margin-top: 20px;text-align: left;}
.disco.detail ol li{margin-bottom:20px;}
.disco.detail ol li h2{margin-bottom:10px;padding-bottom: 5px;border-bottom: 1px solid #ddd;}
.disco.detail ol ol{margin: 0;}
.disco.detail ol li li{margin-bottom:2px;}
.disco.detail ol li li span{margin-right:8px;}
.disco.detail a:hover{opacity: 0.6}
.disco.detail ol a{text-decoration: none;}
.disco.detail .tieup{padding-left: 1.5em;color: #999;font-size: 0.8em;line-height: 1.4em;}


.spinner {
  margin: 20px auto 0;
  width: 70px;
  text-align: center;
}

.spinner > div {
  width: 18px;
  height: 18px;
  background-color: #333;

  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

.ph{position: relative;}

.ph .dummy{
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top:0;
  left: 0;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% {
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}