@charset "utf-8";

/*▼▼▼全体の設定▼▼▼*/

/*ブラウザごとの初期化*/
* {
	margin: 0px;
	padding: 0px;
}


body {
	background-color: #e8e8e8;/*ウィンド背景の色*/
	font-family: "ヒラギノ角ゴ　Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "MS Pゴシック", sans-serif;/*全体のフォント設定*/
	font-size: 12px;/*全体のフォントサイズ設定*/
	color: #333333;
}

#container {
	width: 980px;/*960px→980px*/
	margin: 30px auto;/*ページコンテンツをセンタリング*/
}


#wrapper {/*ページ縁にドロップシャドウをつけるためのボックス*/
	width: 960px;
	padding: 0px 10px;
	/*▼ページ両縁のドロップシャドウをつけるとき▼*/
	background:url("s1-images/bg-middle.gif") repeat-y;
	float: left;/*背景を表示させるため*/
/*		background-color: #ff0000;*/
}


h1{/*h1にはページタイトルを入れ、見えないように（検索対策）*/
display:none
}

h2{
	font-size: 15px;
	line-height: 20px;
	padding-top: 5px;
	text-indent: 10px;
}

h3{
	font-size: 12px;
	line-height: 18px;
	padding-top: 5px;
	text-indent: 10px;
}

p{
	padding: 5px 10px 5px 10px;
}

#footer{
	clear: both;
	width: 980px;
	height: 50px;
	padding-top: 20px;
	text-align: center;
	/*▼ページの下縁のドロップシャドウをつける場合*/
	background: url("s1-images/bg_bottom.gif") no-repeat center top;
/*		background-color: #ffffff;*/
}


/*▼▼▼content内の設定：リンク時のテキスト設定▼▼▼*/
#content a:link,
#content a:visited{
	text-decoration: none;
	color: #3366cc;
}
#content a:hover,
#content a:active{
	text-decoration: underline;
	color: #333366;
}


#content{
	width: 920px;
	margin: 0px 10px;
	padding: 10px;
	background-color: #ffffff;
}

#pankuzu{
	width: 920px;
	color: #808080;
	
}


/*▼▼▼content内の設定：ヘッダー（ナビページごと）▼▼▼*/

#sample1_header{
	width: 920px;
	height: 50px;
	border-top: 3px solid #3366cc;
}

#sample1_header img{
	margin-left: 20px;
	display: block;
	float:left;
}

#sample1_header #headcomment{
	width: 300px;
	float: right;
	margin: 10px 20px;
	color: #3366cc;
	text-align: right;
}

/*▼▼▼トップナビゲーションのタグ　*/
#sample1_top-navi{
	width: 920px;
	height: 40px;
	border-bottom: 1px solid #333333;
}

ul#s1_navi {
	list-style-type: none; /*p561:マーカーの種類*/
	} 

ul#s1_navi li a{
	width: 183px;
	height: 40px;
	float: left; /*p538:ボタンを横並びにする*/
	display: block;
	border-right: #ffffff solid 1px;
	
/*ボタンの文字を表示させない方法②(新式)*/
	text-indent: 100%; /*p477:*/
	white-space: nowrap; /*p479:折り返しをしない*/
	overflow: hidden; /*p553:はみ出した部分を表示しないようにする*/	
}

 /*ボタン最後の右のボーダーを消す*/
ul#s1_navi li#contact a {
	border-style: none;
}

ul#s1_navi li#home a{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat 0px -40px; /*p444:背景関連の一括指定(背景の色　背景の画像　画像の繰り返し　画像の配置位置:X軸　Y軸)*/
}
ul#s1_navi li#contents a{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -183px -40px;
}
ul#s1_navi li#about a{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -366px -40px;
}
ul#s1_navi li#recruit a{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -549px -40px;
}
ul#s1_navi li#contact a{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -732px -40px;
}


ul#s1_navi li#home a:hover{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat 0px -80px;
}
ul#s1_navi li#contents a:hover{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -183px -80px;
}
ul#s1_navi li#about a:hover{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -366px -80px;
}
ul#s1_navi li#recruit a:hover{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -549px -80px;
}
ul#s1_navi li#contact a:hover{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -732px -80px;
}


ul#s1_navi li#home a:active{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat 0px -120px;
}
ul#s1_navi li#contents a:active{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -183px -120px;
}
ul#s1_navi li#about a:active{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -366px -120px;
}
ul#s1_navi li#recruit a:active{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -549px -120px;
}
ul#s1_navi li#contact a:active{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -732px -120px;
}

/*▼現在のページの時の設定：divにclass*/
#sample1_top-navi.home ul#s1_navi li#home a{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat 0px 0px;
}
#sample1_top-navi.contents ul#s1_navi li#contents a{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -183px 0px;
}
#sample1_top-navi.about ul#s1_navi li#about a{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -366px 0px;
}
#sample1_top-navi.recruit ul#s1_navi li#recruit a{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -549px 0px;
}
#sample1_top-navi.contact ul#s1_navi li#contact a{
	background: url(s1-images/sample1_comp01_navitag.png) no-repeat -732px 0px;
}



/*▼▼▼トップイメージのスライドショーセッティング*/
#sample1_topimg{
	width: 920px;
	height: 250px;
   position: relative;
}

#sample1_topimg img {
   position: absolute; /*「外側のボックスの端」を基準にして絶対配置*/
   top: 0;
   left:0;
   z-index: 8; /*値が大きいほど、上に重なる(＝手前に表示される)*/
   opacity: 0.0; /*値0.0を指定し、透明*/
}
#sample1_topimg img.active {
   z-index: 10;
   opacity: 1.0; /*1.0を指定して「完全に不透明」(＝背後が全く透過しない状態)*/
}
#sample1_topimg img.last-active {
   z-index: 9;
}




/*▼▼▼メイン部分　*/
#sample1_main{
	width: 700px;
	float: right;
	margin-top: 10px;
}

#sample1_main h2{
	height: 30px;
	border-width: 1px 1px 3px 1px;
	border-color: #3366cc;
	border-style: solid;
/*	color: #3366cc;*/
	line-height: 30px;
	clear: both;
}



#sample1_main h2.now{
	background-color: #3366cc;
	border-color: #333366;
	color: #ffffff;
}

/*
#sample1_index #sample1_main h2.now a:link,
#sample1_index #sample1_main h2.now a:visited{
	text-decoration: none;
	color: #ffffff;
}
#sample1_index #sample1_main h2.now a:hover,
#sample1_index #sample1_main h2.now a:active{
	text-decoration: underline;
	color: #ffffff;
}
*/

#sample1_main dl{
	width: 680px;
	margin: 10px 10px 20px 10px;
}


#sample1_main dt{
	width: 10em;
	float: left;
}

#sample1_main dd{
	padding-left: 10em;
	border-bottom: 1px #c0c0c0 dotted;
}

#sample1_main dd.to_list{
	text-align: right;
	border: none;
}

/*▼お問い合わせページ、フォーム枠設定*/
#sample1_contact #sample1_main dt{
	width: 15em;
	float: left;
	padding: 10px 0px;
}

#sample1_contact #sample1_main dd{
	padding-left: 15em;
	border-bottom: 1px #c0c0c0 dotted;
	padding: 10px 0px;
}

.form{
	width: 70px;
	padding: 10px;
	float: left;
}


.center{
	width: 200px;
	height: auto;
	margin: 0px auto;
}




/*▼▼▼サイドナビ部分　*/
#sample1_side{
	width: 200px;
/*	height: 400px;*/
	float: left;
	margin-top: 10px;
}

ul#s1_sidenavi{
	list-style-type: none;
}

ul#s1_sidenavi li a:link,
ul#s1_sidenavi li a:visited{
	width: 178px;
	height: 38px;
	display:block;
	border: 1px solid #333333;
	margin-bottom: 1px;
	color: #333333;
	font-weight: bold;
	text-decoration: none;
	line-height: 38px;
	padding-left: 20px;
	background: url(s1-images/sidenavi02.png) repeat-x; 
}

ul#s1_sidenavi li a:hover{
	color: #333333;
	text-decoration: underline;
	background: url(s1-images/sidenavi03.png) repeat-x; 
}

ul#s1_sidenavi li a:active{
	color: #333333;
	text-decoration: none;
	background: url(s1-images/sidenavi03.png) repeat-x; 
}


/*▼現在のページの時のサイドナビ設定：ulにclass設定して指定*/
#sample1_index #sample1_side #s1_sidenavi.home li#s_home a,
#sample1_index #sample1_side #s1_sidenavi.news li#s_news a,
#sample1_index #sample1_side #s1_sidenavi.topics li#s_topics a,
#sample1_index #sample1_side #s1_sidenavi.event li#s_event a,
#sample1_index #sample1_side #s1_sidenavi.info li#s_info a{
	color: #ffffff;
	background: url(s1-images/sidenavi01.png) repeat-x; 
}

/*▼お問い合わせページ、サイドナビ非表示設定*/
#sample1_contact #sample1_side{
	display: none;
}
#sample1_contact #sample1_main{
	float: none;
	margin: 10px auto;
}




/*▼このページのTOPへの設定*/
#pagetop{
	clear: both;
	text-align: right;
	margin-bottom: 10px;
}

#pagetop a:link,
#pagetop a:visited{
	color: #333333;
	text-decoration: underline;
}



/*▼▼▼フッター部分　*/
#sample1_footer{
	width: 920px;
	height: 30px;
	clear: both;
	border-top: 1px solid #3366cc;
}

#sample1_footer ul{
/*	list-style-type: none;インラインにするといらない？*/
	text-align: center;
	margin-top: 10px;
}
#sample1_footer li{
	display: inline; /*p542:要素をインラインにする*/
	padding: 20px;
}



#s1_copyright{
	color: #333333;
	text-align: center;
	margin-top: 20px;
	font-size: 10px;
}