
/* reset */
html,body,h1,h2,h3,h4,h5,h6,div,ul,ol,dl,li,dt,dd,p,img,a,table,tr,th,td {margin:0;padding:0;border:0;font-size: 100%;vertical-align:baseline;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
article, header, footer, aside, figure, figcaption, nav, section {display:block;}
body {line-height: 1;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;}
ol,ul {list-style:none; list-style-type:none;}
table {border-collapse:collapse;border-spacing:0;}
/* clearfix */
*:after {
  display: block;
  clear: both;
}
.clearfix {
  zoom: 1;
}
.clearfix:after {
  content: "";
}
a {color:#000; text-decoration:underline;}
body {font-family: Arial, Helvetica, Verdana, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
 background-image:url("../img/back_sp.jpg"); background-position:center top; background-attachment:fixed;  background-size:contain; -webkit-background-size:contain;}
#wrap {width:95%;max-width:960px; margin:0 auto;}
#kkpp {margin:20px 0;text-align:center; font-weight:bold; font-size:16px; line-height: 1.7;  color:#fff; text-shadow:0 0 3px #000; }
.top-head {min-height:190px;}
#head { padding:0; background:none; width:100%; min-height:190px;}
.logo {text-align:center;}
.logo img {width:100%;max-width:700px;}
#menu  li {display:inline-block;}
#menu li a {width:60px; padding:10px 5px; font-size:14px; color:#ff0;}
#menu {display:none; position:absolute; top:18px; right:0;}
.about hr {border-bottom:none;border-top:1px solid #ff0; box-shadow:0 0 3px #fff; width:95%; max-width:960px;}
#about p {line-height:1.6; width:95%;  max-width:960px;margin:0 auto; padding:10px 15px; background:rgba(255,255,255,.3)}

.icn img {width:50px; border-radius:5px; margin-top:15px; margin-right:10px;}
.marb50 {margin-bottom:50px;}
.mart30{margin-top:30px;}
.mart60{margin-top:60px;}
.tt {width:90%; max-width:600px; margin:0 auto; background-color:rgba(255,255,255,.2)}
.tt th,.tt td {border:1px solid rgba(255,255,255,.5); padding:10px 15px;}
.tt th {text-align:center;}
.tt td {text-align:left; font-size:20px;}
.tt tr:nth-child(1) td{font-size:16px;}

/* transition */
#head,
.logo,.logo img {
    transition:all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}
/* fixed */
#head.fixed {padding:10px 0; background:rgba(255,255,255,.4); position:fixed; top:0; min-height:50px;}
.fixed .logo {text-align:left;}.fixed img {max-width:120px;}
.fixed .about {display:none;}
.fixed #menu {display:block;}

.panel {margin:100px 0; text-align: center;}
.img-h {width:100%; max-width:960px;}
.img-l {width:90%; max-width:860px;}
.img-m {width:80%; max-width:500px;}

.c {text-align:center;}
h2 {font-size:45px; font-weight:normal; color:#222; margin-bottom:30px; text-shadow:0 0 3px #fff; text-align: center;}
h3 {font-size:28px; border-bottom:1px solid rgba(255,255,255,.5); padding:15px 10px 10px 10px; position: relative }
h3 div {position: absolute; right: 0; bottom: 0;}
h3 img{width: 280px;}

.text-box {line-height:1.3; padding:15px}
.nosmt {display:none;}
.music-wrap {border: 1px solid #222; padding-bottom: 0px;background: #222; color: #fff;}
.music-wrap div:nth-last-of-type(n) {display: inline-block; vertical-align: middle;}
.music { padding: 10px; margin-bottom: 0px; width: 60%}
audio {width: 150px;}
.text-box_info{margin-top: 30px; font-size: 11px; color: #444;}
	
	
@media screen and (min-width: 640px) {/* desktop */
.nosmt {display:inline;}
.nopc {display:none;}
body {background-image:url("../img/back.jpg"); background-size:cover; -webkit-background-size:cover;}
.top-head {min-height:300px;}
#head.fixed {min-height:95px;}
.fixed img {max-width:300px;}
#menu li { padding-top:15px}
#menu li a {font-size:20px; padding:0 10px}
.col30,.col40,.col50,.col60,.col70 { display:inline-block; vertical-align:top;}
.col50 {width:49.5%;}
.marb50 {min-height:333px;}
	
.youtubeWrap{width: 960px!important;
    margin: auto!important;
    margin-top: 40px;
  }
.youtubeWrap ul{ margin: auto;}	
.youtubeWrap li{float: left; margin-right: 40px;}
.youtubeWrap li:last-child{float: left; margin-right: 0px;}	
.youtubeWrap iframe{width: 960px!important; height: 520px; 
  }	

	
 .artistWrap {
    width: 960px!important;
    margin: auto!important;
    margin-top: 40px;
  }
	
	.artist_w{margin-top:20px;}
	
	.artist_w ul{ margin-top: 25px;}
	.artist_w li{ float: left; margin-right: 20px!important; width: 300px;}
	.artist_w li:last-child{margin-right: 0px;}
	.artist_w li img{ width: 300px;}
	.artist_w li h4{font-size:17px;font-weight: bold;padding-top: 10px!important; font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif"; text-align: center; }
	.artist_w li a{text-decoration: none;}
	.artist_w li a:link{text-decoration: none;}
		

}

@media screen and (max-width: 639px) {
 .artistWrap {
    width:95%;
    margin: auto;
    margin-top: 60px;
  }
	  .artistWrap h3 {
    font-size: 18px;
    font-weight: bold;
	  margin-bottom: 5px;
		 text-align: center; 
  }
  
	.artist_w{margin-top:10px;}
	
	.artist_w ul{ width: 95%; margin: auto;}
	.artist_w li{ margin-top: 30px; width: 100%;}
	.artist_w li:last-child{margin-right: 0px;}
	.artist_w li img{ max-width: 420px; width: 100%;}
	.artist_w li h4{font-size:15px;font-weight: bold;padding-top: 10px!important; font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif"; margin: auto; text-align: center;}
	.artist_w li a{text-decoration: none;}
	.artist_w li a:link{text-decoration: none;}
		
.youtubeWrap{width: 100%!important;
    margin: auto!important;
    margin-top: 40px;
  }
.youtubeWrap ul{ margin: auto;}	
.youtubeWrap li{ margin-top: 20px;}
.youtubeWrap li:last-child{margin-right: 0px;}	
.youtubeWrap iframe{width: 95%!important; height: 280px; 
  }	
		
	
	
	}