/* cssについては下記のものほど優先される */
/* headerおよびfooterについてはclasss、残りはidで定義した。*/
/* コメントアウトには気をつけること！　*の前後は半角しか受け付けない！！ */



/* 一般事項 */

   /* フォント関係 */
   
      /* 全体のフォントを示す */
         *{font family:meiryo,sans-serif;}
                /* color:blue;} */

      /* クリックできるリンクを示す */
         a:link{color:}

      /* 訪問済みのリンクを示す */
      /*   a:visited{color:white;} */

      /* 訪問できるリンクのうち，カーソルを載せているものを示す */
      /*   a:hover{color:#ffff00;} */

      /* フォントを小さくするときのclass指定 */
         .font-small{font-size:x-small;}
		 
		 span.font80{font-size: 80%; }

	  /* フォントを太くするときのclass指定 */
	     .bold {font-weight: bold;
		        }
				
         h1{
		    margin:1em 0;
			}
		 
		 h2{
		    margin:2em 0 1em;
			}


   /* 背景関係 */
   
      /* 背景の色指定、晴吹のロゴ(透かし)を入れている */
	  /* bodyの前にドットをいれてはイカンみたい */
         body{
		      background-color:#BDBDBD;
			  /* background-image: url("background.png"); */
			  background-repeat: no-repeat;
			  background-position: 50% 50%;
			  background-attachment:fixed;
			  width:100%;
			  text-align:center;
			  }
			 



/* 各ページ共通部分 */

   /* メニューボタンについての記述 */



   /* 各フィールドのサイズおよび背景を定義 */

      /* ページ全体の指定(範囲はbodyと同じ) */
         .contents{
				   width:1200px;
				   margin:0 auto;
				   text-align:left; 
				   }

      /* タイトルをまとめた部分 */
         .header{
                 width:1200;
                 height:150;
                 background-color:rgba(255,255,255,0.8);
				 color:blue;
				 text-align:center;
				 vertical-align:middle;
                 }
				 
				 /* タイトル部分 */
				    .header-left{
					             float:left;
								 width:600px;
								 height:150px;
								 }
								 
				 /* SNSボタン類をまとめて */
				    .header-right{
								  margin-left:0 auto; /* floatの残り部分 */
								  height:150px;
								  }
								  
								  .densetsu{;
											height:150px;
											text-align:center;
											padding-top:35px;
											}
      /* ソーシャルボックス */
	     .social_box{
		             background-color:rgba(255,255,255,0.7);
					 border: 3px royalblue solid;
					 border-radius: 10px;
					 width:450px;
					 padding:5px;
					 margin-left:0px;
					 text-align:center;
					 position:fixed;
					 bottom:25px;
					 list-style-type:none;
					 color:blue;
					 }



/* メニューボタン ぶっちゃけよくわからん */

#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  line-height: 1;
  display: block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#cssmenu {
  clear:both;
  width: 1200px;
  font-family:;
  color: #000000;
}
#cssmenu.align-right ul li {
  float: right;
  border-right: 0;
  border-left: 1px solid rgba(0, 0, 0, 0.22);
}
#cssmenu.align-right ul li a {
  border-right: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.15);
}
#cssmenu ul {
  background: #afeeee;
  /* Old browsers */

  background: -moz-linear-gradient(bottom, #70e1e1 0%, #afeeee 50%, #d9f7f7 51%, #d5f6f6 78%, #ffffff 100%);
  background: -webkit-linear-gradient(bottom, #70e1e1 0%, #afeeee 50%, #d9f7f7 51%, #d5f6f6 78%, #ffffff 100%);
  background: -o-linear-gradient(bottom, #70e1e1 0%, #afeeee 50%, #d9f7f7 51%, #d5f6f6 78%, #ffffff 100%);
  background: -ms-linear-gradient(bottom, #70e1e1 0%, #afeeee 50%, #d9f7f7 51%, #d5f6f6 78%, #ffffff 100%);
  background: linear-gradient(to top, #70e1e1 0%, #afeeee 50%, #d9f7f7 51%, #d5f6f6 78%, #ffffff 100%);
}
#cssmenu:after,
#cssmenu ul:after {
  content: '.';
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
#cssmenu ul li {
  float: left;
  display: block;
  border-right: 1px solid rgba(0, 0, 0, 0.22);
  z-index: 1;
}
#cssmenu ul li::after {
  content: '';
  width: 100%;
  height: 8px;
  position: absolute;
  border-top-left-radius: 50% 4px;
  border-top-right-radius: 50% 4px;
  background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 60%, #afeeee 61%, #afeeee 100%);
  background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 60%, #afeeee 61%, #afeeee 100%);
  background: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 60%, #afeeee 61%, #afeeee 100%);
  background: linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 60%, #afeeee 61%, #afeeee 100%);
  background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  z-index: 2;
  bottom: 10px;
  bottom: 11px;
}
#cssmenu ul li a {
  display: block;
  padding: 10px 30px;
  text-decoration: none;
  font-size: 14px;
  text-transform: uppercase;
  color: #000000;
  border-right: 1px solid rgba(255, 255, 255, 0.15);
  z-index: 3;
}
#cssmenu ul li a:hover,
#cssmenu ul li.active a {
               color: #ffffff;
               }
#cssmenu ul li:hover,
#cssmenu ul li.active {
  background: #0000cd;
  /* Old browsers */
     background: -moz-linear-gradient(bottom, #000081 0%, #0000cd 50%, #0101ff 51%, #0000fb 78%, #9a9aff 100%);
     background: -webkit-linear-gradient(bottom, #000081 0%, #0000cd 50%, #0101ff 51%, #0000fb 78%, #9a9aff 100%);
     background: -o-linear-gradient(bottom, #000081 0%, #0000cd 50%, #0101ff 51%, #0000fb 78%, #9a9aff 100%);
     background: -ms-linear-gradient(bottom, #000081 0%, #0000cd 50%, #0101ff 51%, #0000fb 78%, #9a9aff 100%);
     background: linear-gradient(to top, #000081 0%, #0000cd 50%, #0101ff 51%, #0000fb 78%, #9a9aff 100%);
     }
     #cssmenu ul li:hover::after,
     #cssmenu ul li.active::after {
                    background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 60%, #0000cd 61%, #0000cd 100%);
  background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 60%, #0000cd 61%, #0000cd 100%);
  background: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 60%, #0000cd 61%, #0000cd 100%);
  background: linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 60%, #0000cd 61%, #0000cd 100%);
  background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
}

/* メニューバーここまで */



      /* フッター部分 */
         .footer{
                 clear:both;
				 width:1200px;
				 color:blue;
				 
				 }
				 
				 .copyright{
				            text-align:right;
							}
							
				 .ad{
				     
					 text-align:right;
					 }


/* トップページのみの記述 */

      /* トップの帯に使う写真〜トピックスの記事部分まで */
         #topbody{
		          clear:both;
				  }

	  /* トップの写真のエリア */
	     .photo{
		       width:1200;
			   margin-left: 0px auto;
			   }
	  				
               /* トップの帯に使う写真。使う写真は16:4くらいがよいかと */
                  img.topphoto{
					           width:1200;
					           }
					  
      /* YouTubeとdetailをまとめた部分 */
         .topics{
                 width:1200px;
				 height:750px;
		         background-color:rgba(255,255,255,0.8);
				 text-align:center;
				 }

                 /* YouTube埋め込み部分  YouTubeの埋込初期値　560×315　より */
                    .youtube{
                             float:left;  /* カラム左寄せ */
			                 width:600px; /* 幅指定 */
			                 height:750px;/* 高さ指定 */
				             text-align:center;
							 color:blue;
							 padding-top: 1em;
							 }
							 

                 /* Youtube横の説明の部分 */
                    .detail{
							margin-left:0 auto;  /* 左寄せ残り */
							
							text-align:center;
							color:blue;
							padding-top: 35px;
							}
							
							
/* 晴吹紹介部分 */

   /* メニュー以下、フッター以上の部分 */
      #haresuibody{
	               clear:both;
				   width:1200px;
				   height:600px;
				   color:blue;
				   background-color:rgba(255,255,255,0.8);
				   }
					  
         #haresuiphoto{
		               float:left;
					   width:300px;
					   height:600px;
					   }
					   
		 #haresui{
				  margin-left:0 auto;
				  height:600px;
				  text-align:center;
				  }


/* パート紹介 */

   /* メニュー以下、フッター以上の部分 */
      #partbody{
	            clear:both;
				padding-bottom:1em;
				width:1200px;
				color:blue;
				background-color:rgba(255,255,255,0.8);
				text-align:center;
				}

   /* パート紹介トップ写真 */
      #partphoto{
	             }

   /* パート紹介タイトル部 */
      #parttitle{
	             width:1200px;
				 height:210px;
				 color:blue;
				 }

   /* フルートパート */
      #flute{
	         margin:1em 0;
			 }
			 
	  /* 写真 */
         #flutephoto{
		             
					 }
	  /* コメント */
		 #flutecomment{
		               
					   }
				
   /* クラリネットパート */
      #clarinet{
	            margin:1em 0;
				}
				
      /* 写真 */
	     #clarinetphoto{
		                
						}
						
	  /* コメント */
	     #clarinetcomment{
		                  
						  }

   /* サックスパート */
      #saxophone{
	             margin:1em 0;
				 }
					  
      /* 写真 */
	     #saxophonephoto{
		                 
						 }
	  /* コメント */
	     #saxophonecomment{
		                   
						   }

   /* トランペットパート */
      #trumpet{
	           margin:1em 0;
			   }
			   
	  /* 写真 */
	  #trumpetphoto{
	                
					}
					
	  /* コメント */
		 #trumpetcomment{
		                 
						 }

   /* ホルンパート */
      #horn{
	        margin:1em 0;
			}
			
      /* 写真 */
	     #hornphoto{
		            
					}
					
	  /* コメント */
	     #horncomment{
		              
					  }

   /* トロンボーンパート */
      #trombone{
	            margin:1em 0;
				}
				
      /* 写真 */
	     #trombonephoto{
		                
						}
						
	  /* コメント */
	     #trombonecomment{
		                  
						  }

   /* 低音パート */
      #bass{
	        margin:1em 0;
			}
			
      /* 写真 */
	     #bassphoto{
		            
					}
					
	  /* コメント */
	     #basscomment{
		              
					  }

   /* パーカッションパート */
      #percussion{
	              margin:1em 0;
				  }
				  
      /* 写真 */
	     #percussionphoto{
		                  
						  }
						  
	  /* コメント */
	     #percussioncomment{
		                    
							}

/* 団員募集 */

   /* メニュー以下フッター以上 */
      #recruitbody{
	               clear:both;
				   width:1200px;
				   height:3575px;
				   color:blue;
				   background-color:rgba(255,255,255,0.8);
				   text-align:center;
				   }
				   
	  /* 団員募集部分全体 */
	     #recruit{
		          width:1200;
				  }
				  
		 /* 写真左 */
		    #recruitphotoleft{
			                  float:left;
							  width:200;
							  }
							  
		 /* 写真右 */
		    #recruitphotoright{
			                   float:right;
							   width:200;
							   }
							   
		 /* 募集本文 */
		    #recruitcontents{
			                 float:right;
							 width:800;
							 padding-top:10px;
							 }
		 /* Q&A */
		    .qa{
			    padding-top:1em;
				}