@charset "UTF-8";

/* 全体 */
body	{font-family: 'MS Pゴシック', 'Hiragino Kaku Gothic Pro', 'Helvetica Neue', sans-serif;
		background-color: lavender; margin: 0;}

/* タイトル */
.title a img {vertical-align: bottom; float: left;}
.title { padding: 0px; margin: 0; font-size: 20px; color: blue; text-align: left;}

/* メニューナビゲーション */
/* 768px以上 */
@media (min-width: 768px) {
    #navmenubtn {display: none;}
    #navmenu {
       display: block !important;
    }

    .menu  {
        margin: 0px;
	padding: 0px;    
    }
    
    .menu nav {
        width: 100%;
	padding: 1px;
        margin: 0px;
        overflow: hidden;
        font-size: 16px;
    }

    .menu nav ul {
	padding: 0px;
        margin: 0px;
        display:-webkit-box;
        display:-moz-box;
        display:box;
        display:-webkit-flex;
        display: flex;	
    }

    .menu nav li {
	padding: 1px;
        list-style-type: none;
	 text-align: center;
    }

    .menu nav li:first-child {
        margin-right: auto;
    }

    .menu nav a {
         border-radius: 5px;
         background: #0000c0 url(../images/hor_menu4_back3.gif); /* メニューの背景 */
         color: white;
         display: block;
        padding-top: 4px;
	padding-bottom 2px;
	padding-left: 6px;
	padding-right: 6px;
	margin: auto;
        text-decoration: none;
        text-shadow: 0 1px 0 rgba(255,255,255,.5);
         font: bold 18px 'trebuchet MS', Arial, Helvetica;
	 min-height: 35px;
	 min-width: 50px;
    }

    .menu nav .logo {
        background: #0000c0 url(../images/hor_menu4_back4.gif); /* メニューの背景 */
        padding-top: 4px;
	padding-bottom 2px;
	padding-left: 6px;
	padding-right: 6px;
	margin: 0;
    }

   .menu nav li a:hover, nav ul li a:focus {
       outline: 0;
       color: white;
       text-shadow: 0 1px 0 rgba(0,0,0,.2);
       background: #BD1907;
   }

    .menu nav li a:active {
        box-shadow: 0 0 2px 2px rgba(0,0,0,.3) inset;
    }
}

/* 767px以下 */
@media (max-width: 767px) {
    #navmenu {
       display: none;
    }

    #navmenubtn { padding: 4px  10px; border: solid 1px blue;
        border-radius: 5px; background-color: blue; cursor: pointer;
    }
    #navmenubtn span { display: inline-block; text-indent: -9999px;}
    #navmenubtn i { color: white; font-size: 24px;}
	#navmenubtn hover{ background-color: #BD1907;}

    .menu nav ul { margin: 0; padding: 0; list-style: none;}
    
    .menu nav li a {
    display: block; 
    padding: 5px;
    background: blue;
    color: white; 
    font: bold 18px 'trebuchet MS', Arial, Helvetica;
    text-decoration: none;
    text-shadow: 0 1px 0 rgba(255,255,255,.5);
    }

	.menu nav li a:hover {background-color: #BD1907;} 
}
/* ヘッダ画像 */
.page-photo .bxslider img {margin:0 auto; display: block;}

/* コンテンツタイトル */
.content-title {padding: 0px; border: solid 1px #BD1907; 
	background: #BD1907;}

.content-title h1{font-size: 22px; color: white; text-decoration: underline;
	text-indent: 5px; }

/* お知らせ */
.news	{margin: 10px; padding: 10px; border: solid 5px royalblue; background-color: white; border-radius: 10px;}

.news h1	{ margin-top: 2px; margin-bottom: 5px; margin-left: 5px;
			font-size: 20px; color: #BD1907;}

.news h3	{margin-top: 2px; margin-bottom: 5px; margin-left: 5px;
                         font-size: 16px; color: skyblue;}
			
.news ui 	{margin: 0; padding 0;}

.news li 	{list-style-type: none; margin: -2px; padding 0; line-height: 2.0em}
		
.news li a 	{display: block; font-size: 16px; color: blue;
			padding: 2px; text-decoration: none;}

.news li a:hover	{background-color: lavenderblush;}

.news time {float: left; width: 20px; color: purple; font-weight: bold;}

.news .textaftertime {float: none; width:auto; margin-left: 20px; font-size: 16px; color: blue;}

.news .text {float: none; width:auto; margin-left: 30px; font-size: 16px; color: blue;}

/* 記事 */
.content	{margin: 10px; padding: 10px; border: solid 5px royalblue; background-color: white; border-radius: 10px;}

.content h1	{ margin-top: 2px; margin-bottom: 2px; margin-left: 5px;
	font-size: 20px; color: #BD1907;}

.content h2	{ margin-top: 2px; margin-bottom: 2px; margin-left: 5px;
			font-size: 18px; color: navy;}

.content h3	{font-size: 17px; color: blue;}
			
.content ui 	{margin: 0; padding 0; list-style-type: none;}

.content img  	{float: right; margin: 10px;}
.content img#fullimg  	{float: none; display: block; margin-left: auto; margin-right: auto;}
.content img#contact 	{float: left; margin: 10px;}

.content li {list-style-type: square; margin: 4px; padding 0;  
		   color: black; font-size: 16px; line-height: 1.6em}
.content li#song {list-style-type: none; margin: 0px; padding 0;  
		   color: blue; font-size: 16px; font-weight: bold;}
.content li#soloplayer {list-style-type: none; margin-left: 1px; padding-left: 10px;  
			color: black; font-size: 14px;}


.content p 	{display: block; font-size: 16px; color: blue; line-height: 1.6em;
			padding: 5px; text-decoration: none;  font-weight: bold;}

.content time {float: left; width: 100px; color: purple; font-weight: bold;}

.content table {width: 90%; table-layout: auto; border-collapse: collapse;
font-size: 16px; color: blue;}

.content th {text-align: center;}

.content td {text-align: center;}

.content input, textarea {display: block;}

.content input {width: 30%;}

.content input[type="submit"], 
.content input[type="reset"] ,
.content input[type="button"]
{width: 100px; background: blue; border: solid 1px black; color: white;}

.content textarea {width: 75%; height: 100px;}

/*リンクス */
.links	{margin: 10px; padding: 10px; border: solid 5px royalblue; background-color: white;  border-radius: 10px;}

.links h1	{ margin-top: 2px; margin-bottom: 5px; margin-left: 5px;
			font-size: 20px; color: #BD1907;}

.links a 	{display: block; font-size: 14px; color: blue;
			padding: 2px; text-decoration: none;}

.links a:hover	{background-color: lavenderblush;}

/* フッタ */
.copyright {padding: 10px; margin: 0px; background-color: silver;}

.copyright .linktop {text-align: right; font-size 14px; color: blue;}
.copyright .linktop a {text-decoration: none;}

.copyright p {margin: 0; color: navy; font-size:12px; text-align: center; }