/*---全体のレイアウト-----------------------------------*/
*{
 margin: 0px;
 padding: 0px;
}


img{border: 0;}

a {outline: none;}

html{
 height: 100%;
 }

* html .png a, .png ,#footer{
behavior: expression(IEPNGFIX.fix(this));
} 

A:link{color:#002AA1;text-decoration:underline;}
A:visited{color:#002AA1;text-decoration:underline;}
A:active{color:#002AA1;text-decoration:none;}
A:hover{color:#000000;text-decoration:none;}

body{
 background: url(../img/common/background.gif) repeat-y;
 color: #2C2C2C;
 height: 100%;
 }

#wrapper{
 width: 900px;
 margin: 0 ;
 background-color: #FFFFFF;
 height: 100%;
 min-height: 100%;
 }
/*firefox*/
#wrapper:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}
/*\*/
*html #wrapper{
    height: 1em;
}
/*firefox*/

body > #wrapper{
 height: auto;
 }
@media screen and (min-width: 769px) {/*pc*/
.sp{
	display: none !important;
}
.button.menu-button-left{
	display: none;
}
}


@media screen and (max-width: 768px) {
#wrapper{
 width: 100%;
 margin: 0 ;
 background-color: #FFFFFF;
 height: auto;
 min-height: auto;
 overflow: hidden;
 }
 body{
	 font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 }
}
/*---header-----------------------------------------------------------------*/
#header{
 background: url(../img/common/header.gif) no-repeat;
 width: 900px;
 height: 50px;
 }

/*logo*/
#header h1 a{
 display: block;
 text-indent: -9999px;
 width: 460px;
 height: 50px;
 }


@media screen and (max-width: 768px) {
#header{
	background: url(../img/sp/site_ttl.png) no-repeat center;
 width: 100%;
 height: 80px;
 }

/*logo*/
#header h1 a{
 display: block;
 text-indent: -9999px;
 width: 100%;
 height: 80px;
 }
}
@media screen and (max-width: 620px){
#header{
	background: url(../img/sp/site_ttl.png) no-repeat center center;
 width: 100%;
 height: 80px;
 }
}
/*---グローバルメニュー-----------------------------------------------------------------*/
#menuGrobal{
 background-color: #E7E9F9;
 width: 206px;
 height: auto;
 float: left;
 padding-bottom: 5px;
 }
/*firefox*/
#menuGrobal:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}
/*\*/
* html #menuGrobal{
    height: 1em;
}
/*firefox*/

#menuGrobal ul{
 list-style: none;
 }

#menuGrobal li{
 width: 200px;
 margin: 1px auto 0 auto;
 list-style: none;
 }

/*----メニュータイトル--------*/
#menuGrobal li.title01{
 width: 200px;
 height: 35px;
 background: url(../img/menu/title01.gif) no-repeat;
 display: block;
 text-indent: -9999px;
 margin: 3px auto 2px auto;
 }
#menuGrobal li.title02{
 width: 200px;
 height: 35px;
 background: url(../img/menu/title02.gif) no-repeat;
 display: block;
 text-indent: -9999px;
 margin: 15px auto 2px auto;
 }
#menuGrobal li.title03{
 width: 200px;
 height: 35px;
 background: url(../img/menu/title03.gif) no-repeat;
 display: block;
 text-indent: -9999px;
 margin: 15px auto 2px auto;
 }
#menuGrobal li.title04{
 width: 200px;
 height: 35px;
 background: url(../img/menu/title04.gif) no-repeat;
 display: block;
 text-indent: -9999px;
 margin: 15px auto 2px auto;
 }


/*----各部からの資料とお知らせ--------*/
#menuGrobal li.menu01-1 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-1_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-1 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-1_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-2 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-2_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-2 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-2_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-3 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-3_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-3 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-3_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-4 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-4_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-4 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-4_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-5 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-5_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-5 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-5_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-6 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-6_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-6 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-6_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-7 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-7_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-7 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-7_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-8 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-8_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-8 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-8_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-9 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-9_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-9 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-9_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-10 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-10_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu01-10 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu01-10_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }


/*----掲示板--------*/
#menuGrobal li.menu02-1 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu02-1_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu02-1 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu02-1_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu02-2 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu02-2_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu02-2 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu02-2_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }

/*----支部予定・研修会--------*/
#menuGrobal li.menu03-1 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu03-1_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu03-1 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu03-1_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu03-2 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu03-2_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu03-2 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu03-2_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu03-3 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu03-3_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu03-3 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu03-3_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu03-4 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu03-4_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu03-4 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu03-4_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }


/*----会員情報関連--------*/
#menuGrobal li.menu04-1 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu04-1_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu04-1 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu04-1_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu04-2 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu04-2_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu04-2 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu04-2_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu04-3 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu04-3_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu04-3 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu04-3_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu04-4 a{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu04-4_out.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }
#menuGrobal li.menu04-4 a:hover{
 width: 200px;
 height: 24px;
 background: url(../img/menu/menu04-4_on.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 }

/*----ログアウト--------*/
#menuGrobal li.logout a{
 width: 200px;
 height: 35px;
 background: url(../img/menu/menu_logout.gif) no-repeat center;
 display: block;
 text-indent: -9999px;
 margin: 15px auto 2px auto;
 }
@media screen and (max-width: 768px) {
#menuGrobal{
	display: none;
}
}

/*---mainBody-----------------------------------------------------------------*/
#mainBody{
 float: right;
 width: 680px;
 margin-right: 5px;
 }

@media screen and (max-width: 768px) {
	#mainBody{
		float: none;
		width: 96%;
		margin: 0 auto;
	}
}
/*---footer-----------------------------------------------------------------*/
#footer{
 background: url(../img/common/footer.gif) no-repeat;
 width: 680px;
 height: 31px;
 text-indent: -9999px;
 display: block;
 clear: both;
 }

@media screen and (max-width: 768px) {
#footer{
 background: none;
 width: 100%;
 height: auto;
 text-indent: 0;
 display: block;
 clear: both;
 font-size: 10px;
 text-align: center;
 padding: 10px 0;
 }

}