@charset "utf-8";





body {
	font-size: 1.0rem;
      background: #000;
   color: #fff;
}
html, body {
/*	height: 100%;*/
}
body {
	padding-top: 0;
	letter-spacing: 0;
/*	color: #333;*/
	line-height: 1.6;
}

img {
	max-width: 100%;
   height: auto;
}
.fix{
   position: fixed;
   left: 0;
   right: 0;
   overflow: hidden;
   max-width: 960px;
   width: 95%;
/*    height: 100vh;*/
   height: 100%;
   padding: 5em 4em 2.5em;
   box-sizing: border-box;
   display: -webkit-flex;
   display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
   margin: 0 auto;
   text-align: center;
}
.dn{
   display: none;
}
.db{
   display: block;
}


#wapper {
	margin: 0 auto;
}
header{
max-width: 960px;
   width: 95%;
   height: auto;
   padding: 5em 4em 2.5em;
   box-sizing: border-box;
   text-align: center;
   margin: 0 auto;
     display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
   
}
header h1{
/*font-size: 5em;*/
   line-height: 0.5;
   font-weight: bold;
   margin-bottom: 25px;
   letter-spacing: 20px
}
p.submain{font-size: 7em;padding-top: 15px;}





a:hover {
	filter: alpha(opacity=80);
	-moz-opacity: 0.80;
	opacity: 0.80;
	-webkit-transition: 0.2s ease-in-out;
	-moz-transition: 0.2s ease-in-out;
	-o-transition: 0.2s ease-in-out;
	transition: 0.2s ease-in-out;
}


.res355{display: none}
.pad{display: none;}
.res767{display: none;}
.res479{display: none;}
.res979{display: none;}
.pc {
	display: block !important;
}
.sp {
	display: none !important;
}
/*↑ここまで共通部分*/
#maincontents-sp{
display: none !important;
}


.dpnone{display: none;}



.comment_area{
   width: 100%;
   background: rgba(255,255,255,0.4);
   padding: 20px 2em 0em;
   box-sizing: border-box;
   margin-bottom: 5rem;
}
.comment{
width: 100%;
/*   margin-right: 2%;*/
   margin-bottom: 5%;
   background:rgba(0,0,0,0.3);
   box-sizing: border-box;
   padding: 3%
}
/*
.comment_area #comment{
   width: 80%;
   margin: 0 auto;
   padding-bottom: 1em;
}
*/
.comment_in{
   width: 49%;
}
.comment-left{float: left;}
/*.comment-right{float: right; margin-top: 2.5%}*/
.comment-right{float: right;}
.comment_h3{
   font-size: 2em;
   text-align: center;
   padding: 0.3em 0;
   width: 35%;
   margin: 0 auto;
   border-top: 3px solid #fff;
   border-bottom: 3px solid #fff;
   margin-bottom: 20px;
}
.comment_in .comment h2.artist_name{
font-size: 2em;
   text-align: center;
   font-weight: bold;
   border-top: 2px solid #fff;
   border-bottom: 2px solid #fff;
   margin-bottom: 2%;
   
}
/*
.comment_in .comment .comment_text{
margin-bottom: 1.5em;
}
*/
.comment_in .comment .comment_text{
margin-bottom: 3em;
}
.comment_in .comment .comment_text p{
   font-size: 1.5em;
   letter-spacing: 1px;
}
.comment_in .comment .plofile_area{
   width: 100%;
   border-top: 1px dotted #d4d4d4;
   color: #d4d4d4
/*   padding-top: 0.5em;*/
}
.comment_in .comment .plofile_area h3.name{
   font-size: 1.5em;
   text-align: left;
   padding: 0.5em 0;
}
.comment_in .comment .plofile_area h3.name span.kana{
   font-size: 0.85em;
}
.comment_in .comment .plofile_area .plofile{
   font-size: 1.1em;
width: 62%;
   float: left;
}
.comment_in .comment .plofile_area .artist{
width: 35%;
   float: right;
}

.text-center {
text-align: center;
}


.comment_in img{
   max-width: 100%;
   width: 100%;
}
.comment_place{
font-size: 1.4em;
   line-height: 1.2;
   text-align: center;
   padding: 0.5em 0 0.1em;
   position: relative;
   z-index: 110;
}
.return-btn{
   width: 40%;
   margin: 0 auto 5rem;
}
.return-btn a{
   display: block;
   width: 100%;
   padding: 0.5em;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
    color: #333;
    font-size: 2rem;
    font-family: Georgia, serif;
    text-decoration: none;
    vertical-align: middle;
    position: relative;
    overflow: hidden;
   background: #fff;
   color: #333;
   text-align: center;
}


.youtube_box{ width:90%; max-width:600px; margin:0 auto 10px;}
.youtube {
  position: relative;
  width:100%;
   height: 0;
  padding-top: 56.25%;
   margin-bottom: 3rem;
   
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

.video_container{padding: 20%;}





@media screen and (max-width: 979px) {
/* 979px以下用（タブレット用）の記述 */
/*.title{margin: 70% auto 0;}*/
/*.arrival{margin-top:0rem;}*/
   #contents{padding: 0}
    
/*    .section_out{padding-left: 3em;padding-right: 3em;}*/
   

   .res979{display: block;}



.comment{
width: 100%;
/*   float: left;*/
   margin-right: 0;
/*   margin-bottom: 4em;*/
   position: relative;
   margin-left: 0;
/*   background: #fff;*/
}



}

@media screen and (max-width: 812px) {
/* 812px以下用（iPad）の記述 */
.pc {
	display: none !important;
}
.sp {
	display: block !important;
}
   .pad{display: block;}

	

		

	
.wrapper_in {
/*   background-image: url(../images/bg_pattern_pad.jpg);*/
   padding-bottom: 0;
}


#contents {
	margin: 0 auto;
	padding: 0 0rem;
}
.return-btn{
   width: 60%;
   margin: 0 auto 5rem;
}
.video_container{padding: 18%;}


}



@media screen and (max-width: 767px) {
/* 767px以下用の記述 */
   .res768{display: none;}
   .res767{display: block;}
   #maincontents-pc{
display: none !important;
}
   #maincontents-sp{
display: block!important;
}
.comment_in{
   width: 100%;
}
   #pagetop{display: none;}
   
header h1 {
    font-size: 13vw;
   margin-bottom: 30px;
   line-height: 0.55;
   }
p.submain{font-size: 5em;padding-top: 15px;}


   .comment_area{
   width: 96.845%;
   margin: 0 auto;
   background: rgba(255,255,255,0.4);
   padding: 2em 1em 2em;
   box-sizing: border-box;
   margin-bottom: 5em;
}
      .comment_h3{
   width: 50%;
      padding: 0;
}
   .comment_area #comment{
   width: 90%;
}

   .comment{
width: 100%;
   float: none;
   margin-right: 0%;
   margin-bottom: 2em;
   position: relative;
   margin: 0 auto 2em;
/*   background: #fff;*/
}


}




@media screen and (max-width: 479px) {
/* 479px以下用（スマートフォン用）の記述 */

   
   
   header h1{
/*font-size: 3.5em;*/
   line-height: 0.5;
   font-weight: bold;
/*   margin-bottom: 50px;*/
   letter-spacing: 2px
}

   body{
   background: none;
   }
   body:after {
          content: "";
/*      background: url(../images/main_bg.jpg) no-repeat center/cover;*/
   color: #fff;
      display: block;
      position: fixed;
      top: 0;
    left: 0;
   width: 100vw;
/*    height: 100vh;*/
    z-index: -1;
}
   #pagetop{width: 0px;height: 0px;display: none;border:none;}
   .pad{display: none;}
    .res480{display: none;}
   .res479{display: block;}
   .space{display: inline-block;}
   #wrapper{overflow: hidden;width: 100%;}
.wrapper_in{
   background: #000;
}

   .section_out{padding: 0;}


   .comment_area{
   width: 100%;
   margin: 0 auto;
   background: rgba(255,255,255,0.4);
   padding: 2em 1em 2em;
   box-sizing: border-box;
   margin-bottom: 5em;
}

 
   .comment_h3{
   width: 90%;
      padding: 0;
}
   .comment_place{
   font-size: 1.4em;
   }
   .comment_place .livehouse{font-size: 1.5em;line-height: 2}
   .comment:last-child{margin-bottom: 0;}

.return-btn{
   width: 100%;
   margin: 0 auto 5rem;
}
   
}

@media screen and (max-height: 375px) {
	
body{
}

.title {
	margin: 61.5% auto 0;
}

}
@media screen and (max-width: 375px) {
p.submain{font-size: 4.5em;padding-top: 0px;}
}
   @media screen and (max-width: 370px) {

      header h1 {
    font-size: 11.2vw;
   margin-bottom: 30px;
   line-height: 0.55;
   }
      p.submain{font-size: 11vw;padding-top: 0px;}
}

   @media screen and (max-width: 365px) {
/*      .music_txt p,.music_txt ul li{font-size: 90%;}*/
      .res365{display: none;}
}
      @media screen and (max-width: 355px) {
         .space,.spacebr{display: none;}
         .res355{display: block}
}

b.bold{font-weight: bold;}