@charset "UTF-8";
@import url(common.css);
@import url(textsettings.css);

/* ---------------------------------------------------------------- *
	ドキュメント全体に関する設定
 * ---------------------------------------------------------------- */

body {
	color: #333333;
	background-color: #FFFFFF;
	background-repeat: repeat;
}


#container {
	width: 900px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-color: #FFFFFF;
	background-repeat: no-repeat;
}

/* ---------------------------------------------------------------- *
	ヘッダ
 * ---------------------------------------------------------------- */

#header {
	height: 50px;
	width: 890px;
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 10px;
	background-repeat: no-repeat;
}


/* ---------------------------------------------------------------- *
	メニュー
 * ---------------------------------------------------------------- */

#menu {
	height: 22px;
	width: 880px;
	padding: 0px;
	margin-right: 10px;
	margin-left: 10px;
	background-color: transparent;
	background-image: url(../imgs/menu_bg.png);
	background-repeat: no-repeat;
}

#menu ul {
	padding: 0px;
	margin: 0px;
}
#menu li {
	display: inline;
	list-style-type: none;
}
#menu li a {
	float: left;
	height: 22px;
	overflow: hidden;
	text-decoration: none;
	display: block;
	text-indent: -9999em;
}
/*------off*/
#menu li.menu01 a {
	width: 88px;
	background-image: url(../imgs/menu.png);
	background-position: 0px 0px;
	background-repeat: no-repeat;
}
#menu li.menu02 a {
	width: 88px;
	background-image: url(../imgs/menu.png);
	background-position: -88px 0px;
	background-repeat: no-repeat;
}
#menu li.menu03 a {
	width: 88px;
	background-image: url(../imgs/menu.png);
	background-position: -176px 0px;
	background-repeat: no-repeat;
}
#menu li.menu04 a {
	width: 88px;
	background-image: url(../imgs/menu.png);
	background-position: -264px 0px;
	background-repeat: no-repeat;
}
#menu li.menu05 a {
	width: 88px;
	background-image: url(../imgs/menu.png);
	background-position: -352px 0px;
	background-repeat: no-repeat;
}
#menu li.menu06 a {
	width: 88px;
	background-image: url(../imgs/menu.png);
	background-position: -440px 0px;
	background-repeat: no-repeat;
}
#menu li.menu07 a {
	width: 88px;
	background-image: url(../imgs/menu.png);
	background-position: -528px 0px;
	background-repeat: no-repeat;
}
#menu li.menu08 a {
	width: 88px;
	background-image: url(../imgs/menu.png);
	background-position: -616px 0px;
	background-repeat: no-repeat;
}
#menu li.menu09 a {
	width: 88px;
	background-image: url(../imgs/menu.png);
	background-position: -704px 0px;
	background-repeat: no-repeat;
}
/*------hover*/
#menu li.menu01 a:hover {
	background-image: url(../imgs/menu.png);
	background-position: 0px -22px;
	background-repeat: no-repeat;
}
#menu li.menu02 a:hover {
	background-image: url(../imgs/menu.png);
	background-position: -88px -22px;
	background-repeat: no-repeat;
}
#menu li.menu03 a:hover {
	background-image: url(../imgs/menu.png);
	background-position: -176px -22px;
	background-repeat: no-repeat;
}
#menu li.menu04 a:hover {
	background-image: url(../imgs/menu.png);
	background-position: -264px -22px;
	background-repeat: no-repeat;
}
#menu li.menu05 a:hover {
	background-image: url(../imgs/menu.png);
	background-position: -352px -22px;
	background-repeat: no-repeat;
}
#menu li.menu06 a:hover {
	background-image: url(../imgs/menu.png);
	background-position: -440px -22px;
	background-repeat: no-repeat;
}
#menu li.menu07 a:hover {
	background-image: url(../imgs/menu.png);
	background-position: -528px -22px;
	background-repeat: no-repeat;
}
#menu li.menu08 a:hover {
	background-image: url(../imgs/menu.png);
	background-position: -616px -22px;
	background-repeat: no-repeat;
}
#menu li.menu09 a:hover {
	background-image: url(../imgs/menu.png);
	background-position: -704px -22px;
	background-repeat: no-repeat;
}

/*------on*/
#menu li.menu01_on a {
	width: 94px;
	background-image: url(../imgs/menu.png);
	background-position: 0px -80px;
	background-repeat: no-repeat;
}
#menu li.menu02_on a {
	width: 94px;
	background-image: url(../imgs/menu.png);
	background-position: -94px -80px;
	background-repeat: no-repeat;
}
#menu li.menu03_on a {
	width: 94px;
	background-image: url(../imgs/menu.png);
	background-position: -188px -80px;
	background-repeat: no-repeat;
}
#menu li.menu04_on a {
	width: 94px;
	background-image: url(../imgs/menu.png);
	background-position: -282px -80px;
	background-repeat: no-repeat;
}
#menu li.menu05_on a {
	width: 94px;
	background-image: url(../imgs/menu.png);
	background-position: -376px -80px;
	background-repeat: no-repeat;
}
#menu li.menu06_on a {
	width: 94px;
	background-image: url(../imgs/menu.png);
	background-position: -470px -80px;
	background-repeat: no-repeat;
}
#menu li.menu07_on a {
	width: 94px;
	background-image: url(../imgs/menu.png);
	background-position: -564px -80px;
	background-repeat: no-repeat;
}
#menu li.menu08_on a {
	width: 94px;
	background-image: url(../imgs/menu.png);
	background-position: -658px -80px;
	background-repeat: no-repeat;
}
#menu li.menu09_on a {
	width: 98px;
	background-image: url(../imgs/menu.png);
	background-position: -752px -80px;
	background-repeat: no-repeat;
}


/* ---------------------------------------------------------------- *
	カテゴリー
 * ---------------------------------------------------------------- */

#catarea {
	height: 35px;
	width: 850px;
	padding: 0px;
	margin-top: 8px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-image: url(../img/cat_navi_bg.png);
}


#cat {
	height: 25px;
	width: 850px;
	padding-top: 10px;
	padding-bottom: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	display: block;
	background-color: transparent;
	background-repeat: no-repeat;
}

#cat em {
	float: left;
	text-indent: -9999px;
	list-style: none;
}

#cat a{
	height: 25px;
	width: 106px;
	text-decoration: none;
	display: block;
	background-image: url(../img/cat_navi.png);
	background-position: left top;
}

#cat a{
	height: 25px;
	width: 106px;
}

#cat01 a{ background-position: 0px 0px }

#cat02 a{ background-position: -106px 0px }

#cat03 a{ background-position: -212px 0 }

#cat04 a{ background-position: -318px 0 }

#cat05 a{ background-position: -424px 0 }

#cat06 a{ background-position: -530px 0 }

#cat07 a{ background-position: -636px 0 }

#cat08 a{ background-position: -742px 0 }


#cat01 a:hover{ background-position: 0px -25px }

#cat02 a:hover{ background-position: -106px -25px }

#cat03 a:hover{ background-position: -212px -25px }

#cat04 a:hover{ background-position: -318px -25px }

#cat05 a:hover{ background-position: -424px -25px }

#cat06 a:hover{ background-position: -530px -25px }

#cat07 a:hover{ background-position: -636px -25px }

#cat08 a:hover{ background-position: -742px -25px }


/* ---------------------------------------------------------------- *
	コンテンツコンテナの設定
 * ---------------------------------------------------------------- */

#main {
	width: 900px;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	background: transparent;
}

/* ---------------------------------------------------------------- *
	コンテンツ部分の設定
 * ---------------------------------------------------------------- */

.contents {
	width: 840px;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 2em;
	padding-left: 0em;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
	border-top-style: none;
	border-top-width: 0px;
	border-right-style: none;
	border-right-width: 0px;
	border-bottom-style: none;
	border-bottom-width: 0px;
	border-left-style: none;
	border-left-width: 0px;
}

.contentsC {
	clear: both;
	width: 830px;
	padding-right: 10px;
	padding-left: 10px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	text-align: right;
}

.contentsHome {
	height: 398px;
	width: 878px;
	padding: 0px;
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 30px;
	margin-left: 10px;
	border: 1px solid #E8E8E8;
	background-image: url(../imgs/top.png);
	background-repeat: no-repeat;
}

.contentsbethlem09 {
	height: 198px;
	width: 378px;
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 30px;
	margin-left: 10px;
	border: 1px solid #E8E8E8;
	background-image: url(../imgs/bethlehem09.png);
	background-repeat: no-repeat;
	padding-top: 200px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 500px;
	color: #FFF;
}

.contentsbethlem09 a {
	color: #FFF;
}



.contentsbethlem09_1 {
	height: 248px;
	width: 608px;
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 30px;
	margin-left: 10px;
	border: 1px solid #E8E8E8;
	background-repeat: no-repeat;
	padding-top: 150px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 270px;
	color: #FFF;
	background-color: #C00;
	background-image: url(../bethlehem09/top.png);
}

.contentsbethlem09_1 a {
	color: #FFF;
}


.contentsabout {
	height: 398px;
	width: 878px;
	padding: 0px;
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 30px;
	margin-left: 10px;
	border-top-color: #FFF;
	border-top-style: solid;
	border-top-width: 1px;
	border-right-color: #FFF;
	border-right-style: solid;
	border-right-width: 1px;
	border-bottom-color: #E8E8E8;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-left-color: #FFF;
	border-left-style: solid;
	border-left-width: 1px;
	background-image: url(../about/bg.png);
	background-repeat: no-repeat;
}

.contentsinfo {
	float: left;
	height: 400px;
	width: 850px;
	padding: 10px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 50px;
	border-top-style: none;
	border-top-width: 0px;
	border-right-style: none;
	border-right-width: 0px;
	border-bottom-style: none;
	border-bottom-width: 0px;
	border-left-style: none;
	border-left-width: 0px;
	background-image: url(../information/bg.png);
	background-position: 550px 50px;
	background-repeat: no-repeat;
}

.contentspeco {
	height: 368px;
	width: 478px;
	padding-top: 30px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 400px;
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 30px;
	margin-left: 10px;
	border: 1px solid #FFF;
	color: #FFF;
	background-image: url(../peco_folder/bg.png);
	background-repeat: no-repeat;
}

.contentspeco h2 {
	padding-bottom: 10px;
	margin-top: 0px;
	margin-bottom: 10px;
	font-size: 120%;
	color: #FFF;
}

.contentshtc {
	height: 368px;
	width: 478px;
	padding-top: 30px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 400px;
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 30px;
	margin-left: 10px;
	border: 1px solid #FFF;
	color: #FFF;
	background-image: url(../htc/bg.png);
	background-repeat: no-repeat;
}

.contentsluca {
	float: left;
	height: 650px;
	width: 800px;
	padding-top: 10px;
	padding-right: 25px;
	padding-bottom: 10px;
	padding-left: 25px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	border-top-style: none;
	border-top-width: 0px;
	border-right-style: none;
	border-right-width: 0px;
	border-bottom-style: none;
	border-bottom-width: 0px;
	border-left-style: none;
	border-left-width: 0px;
	background-color: #FFCC18;
	background-image: url(../peco/bg.png);
	background-position: 650px 50px;
	background-repeat: no-repeat;
}


.contentsweb {
	height: 368px;
	width: 478px;
	padding-top: 30px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 400px;
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 30px;
	margin-left: 10px;
	border: 1px solid #FFF;
	color: #FFF;
	background-image: url(../webdesign/bg.png);
	background-repeat: no-repeat;
}

.contentshowto {
	float: left;
	width: 850px;
	padding: 10px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 50px;
	border-top-style: none;
	border-top-width: 0px;
	border-right-style: none;
	border-right-width: 0px;
	border-bottom-style: none;
	border-bottom-width: 0px;
	border-left-style: none;
	border-left-width: 0px;
	background-image: url(../howto/bg.png);
	background-position: 550px 50px;
	background-repeat: no-repeat;
}

.contentslink {
	height: 368px;
	width: 848px;
	padding-top: 30px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 30px;
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 30px;
	margin-left: 10px;
	border: 1px solid #FFF;
	color: #FFF;
	background-image: url(../link/bg.png);
	background-repeat: no-repeat;
}

.contentsmail {
	height: 368px;
	width: 848px;
	padding-top: 30px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 30px;
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 30px;
	margin-left: 10px;
	border: 1px solid #FFF;
	color: #FFF;
	background-image: url(../mailform/bg.png);
	background-repeat: no-repeat;
}

.contentssolo {
	float: left;
	width: 850px;
	padding: 10px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 50px;
	border-top-style: none;
	border-top-width: 0px;
	border-right-style: none;
	border-right-width: 0px;
	border-bottom-style: none;
	border-bottom-width: 0px;
	border-left-style: none;
	border-left-width: 0px;
	background-image: url(../solo/bg.png);
	background-position: 550px 50px;
	background-repeat: no-repeat;
}

.contents_info {
	float: left;
	height: 220px;
	width: 410px;
	padding-top: 0px;
	padding-right: 30px;
	padding-left: 10px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 30px;
	margin-left: 0px;
	border-top-style: none;
	border-top-width: 0px;
	border-right-style: none;
	border-right-width: 0px;
	border-bottom-style: none;
	border-bottom-width: 0px;
	border-left-style: none;
	border-left-width: 0px;
}

.contents_info_r {
	float: left;
	height: 220px;
	width: 410px;
	padding-top: 0px;
	padding-right: 10px;
	padding-left: 25px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 30px;
	margin-left: 0px;
	border-top-style: none;
	border-top-width: 0px;
	border-right-style: none;
	border-right-width: 0px;
	border-bottom-style: none;
	border-bottom-width: 0px;
	border-left-style: none;
	border-left-width: 0px;
}

.contentsI {
	float: left;
	width: 400px;
	padding: 0px;
	margin: 10px;
	border: 0px none #CC9966;
}

.contentsJ {
	float: right;
	width: 400px;
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	margin-top: 50px;
	margin-right: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	border-top-style: none;
	border-top-width: 0px;
	border-right-style: none;
	border-right-width: 0px;
	border-bottom-style: none;
	border-bottom-width: 0px;
	border-left-style: none;
	border-left-width: 0px;
}



/* ---------------------------------------------------------------- *
	コンテンツ画像の設定
 * ---------------------------------------------------------------- */

.contents_info img.fig {
	float: left;
	margin-top: 5px;
	margin-right: 10px;
	margin-bottom: 10px;
	margin-left: auto;
}

.contents img.fig2 {
	float: left;
	clear: none;
	padding-top: 0px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 0px;
}

/* ---------------------------------------------------------------- *
	画像のみのボックスを作る場合の設定です
 * ---------------------------------------------------------------- */

.imgbox {
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	background: #FFFFFF;
}

/* ---------------------------------------------------------------- *
	サムネイルリストの設定
 * ---------------------------------------------------------------- */
#main2 {
	width: 840px;
	padding-top: 10px;
	padding-right: 5px;
	padding-bottom: 10px;
	padding-left: 5px;
	margin-top: 20px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	border: 1px solid #330000;
	background-color: #333333;
	background-repeat: repeat;
}

ul#thumbslist {
  /* ★--- マージンを設定してください --- */
  margin: 0;
  /* ★--- パディングを設定してください --- */
  padding: 0;
}

ul#thumbslist li {
	/* --- 背景を設定してください（短縮プロパティでの設定です） --- */
  background: #FFFFFF;
	/* Note:サムネイルのリストアイテム（サムネイルとキャプションを囲むボックス）に関する設定です。 */
  /* ★--- マージンを設定してください --- */
  /* Note:float:left;をすでに設定しているため、左方向のマージンは0にし、右方向のマージンでリスト同士の間隔を調整してください */
  margin-right: 5px;
	margin-bottom: 15px;
	/* ★--- パディングを設定してください --- */
  /* Note:このオブジェクトはフロートさせるため、0と設定し、余白はさらに内側のボックスで設定いただくことをおすすめします */
  padding: 0;
	/* ★--- ボックスの幅と高さを設定してください --- */
  /* Note：ボックスからはみ出す分は出力されません；内容の量にに対して
           余裕をもって設定してください */
  width: 200px;
	/* ★--- 枠線の幅・線種・色を設定してください（短縮プロパティでの設定です）--- */
  border: 0px none #EEEEEE;
	margin-left: 5px;/* ★Note:（このボックスの幅[width]＋左右線幅[border]＋右マージン[margin]）x １列のボックスの数　で算出される寸法が、#mainの横幅以内に収まるように設計してください */
	height: 245px;
}

/* ---------------------------------------------------------------- *
	サムネイル画像についての設定
 * ---------------------------------------------------------------- */
div.thumbnail {
	/* --- 背景を設定してください --- */
  /* Note：パディングと組み合わせると，縁取りなどの効果が期待
           できます */
  background: transparent;
	/* --- 上下マージンを設定してください --- */
  margin-top: 0px;
	margin-bottom: 7px;
	padding: 0;
}

/* ---------------------------------------------------------------- *
	説明キャプションについての設定
 * ---------------------------------------------------------------- */

ul#thumbslist li p {
	/* マージンを設定してください */
  margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 7px;
	margin-left: 5px;
	padding: 0px;
}


#counter {
	position: relative;
	clear: both;
	width: 810px;
	padding-top: 5px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 20px;
	margin-top: 30px;
	margin-bottom: 30px;
	margin-left: 25px;
	border-top-color: #FFFFFF;
	border-top-style: none;
	border-right-color: #FFFFFF;
	border-right-style: none;
	border-bottom-color: #FFFFFF;
	border-bottom-style: none;
	border-left-color: #FFFFFF;
	border-left-style: none;
	text-align: center;
	background-color: #FFFFFF;
}


#link {
	position: relative;
	clear: both;
	width: 825px;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 25px;
	margin-top: 20px;
	margin-bottom: 10px;
	border-top-color: #F6F6F6;
	border-top-style: solid;
	border-top-width: 1px;
	border-right-color: #F6F6F6;
	border-right-width: 1px;
	border-bottom-color: #F6F6F6;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-left-color: #F6F6F6;
	border-left-width: 1px;
	color: #333333;
	text-align: right;
	background-color: #FFFFFF;
}

/* ---------------------------------------------------------------- *
	フッタ部分の設定です
 * ---------------------------------------------------------------- */

#footer {
	width: 900px;
	padding-top: 2em;
	padding-right: 0px;
	padding-bottom: 1em;
	padding-left: 0px;
	margin-top: 0;
	margin-right: 0px;
	margin-bottom: 0;
	margin-left: 0px;
	text-align: center;
	background: #FFFFFF;
}

#footer ul {
	padding: 0;
	margin-bottom: 4px;
	border-left: 1px solid #CCCCCC;
}

#footer ul li {
	padding: 0 5px;
	margin: 0;
	border-right: 1px solid #CCCCCC;
	background-image: none;
}
