@charset "shift_jis";


body {
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
	font-size: 75%;
	line-height: 2;
	color: #7e6b5a;
	background-color: #ffffff;
	margin: 0px;
	padding: 0px;
	text-align: center;
	background-image: url(../images/body-bg1.jpg);
	background-repeat: no-repeat;
	background-position: left bottom;
	background-attachment:fixed;
}

h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form{
	margin: 0px;
	padding: 0px;
}

ul{
	list-style-type: none;
}

img {
	border: none;
}

input,textarea,select {
	font-size: 1em;
}

form {
	margin: 0px;
}

table {
	border-collapse:collapse;
	font-size: 100%;
	border-spacing: 0;
}



/*リンク設定
---------------------------------------------------------------------------*/
a {
	color: #e8b1bb;		/*リンクの文字色*/
}

a:hover {
	color: #79c06e;		/*カーソルオーバー時の文字色*/
	text-decoration: none;	/*オーバー時に下線を消す設定。入れたままがいいならこの１行削除。*/
}

/*商品テーブル
---------------------------------------------------------------------------------------*/
.box {
	margin: 10px auto 20px;
}
.box img {
	padding: 4px;				/*商品画像とフチ線の間にある白い余白*/
	border: 1px dotted #CCCCCC;	/*ボックスのグレー色のフチ設定。solidは直線という意味。dottedとかにすると可愛くなります。*/
	margin: 2px;
}
.box td {
	vertical-align: top;
	text-align: center;
	font-size: 10px;
	padding-bottom: 0.5em;
}
.box a {
	text-decoration: none;
}
.box a:hover img {
	border: 1px solid #db7093;	/*カーソルオーバー時のボックスのフチ色（桃色）設定*/
}



/*コンテナー（HPを囲むボックス）
---------------------------------------------------------------------------*/
#container {
	width: 943px;
	margin-top: 10px;
	margin-right: auto;
	margin-left: auto;
	text-align: left;
}



/*ヘッダー（右上の写真とh1タグが入ったボックス）
---------------------------------------------------------------------------*/
#header {
	background-image: url(../images/main-img02.jpg);	/*ヘッダー背景画像*/
	background-repeat: no-repeat;
	height: 272px;	/*ヘッダーの高さ。背景画像の高さに2を加えた数字にする。*/
	width: 718px;
	position: relative;
	margin-bottom: 3px;
	border: 1px solid #efd3d6;
	background-position: center center;
	background-color: #FFFFFF;
}

#header h1 {
	font-size: 15px;		/*h1タグの文字サイズ*/
	line-height: 20px;
	position: absolute;
	left: 20px;	/*ヘッダーに対して左から10pxの位置に配置*/
	bottom: 35px;	/*ヘッダーに対して下から10pxの位置に配置*/
}

/*ヘッダー2（右上の写真とh1タグが入ったボックス）
---------------------------------------------------------------------------*/
#header2 {
	background-image: url(../images/h2bg.gif)	/*ヘッダー背景画像*/
	background-repeat: no-repeat;
	height: 58px;	/*ヘッダーの高さ。背景画像の高さに2を加えた数字にする。*/
	width: 718px;
	position: relative;
	margin-bottom: 3px;
	border: 1px solid #efd3d6;
	background-position: center center;
	background-color: #FFFFFF;
}

#header2 h1 {
	font-size: 15px;		/*h1タグの文字サイズ*/
	line-height: 20px;
	position: absolute;
	left: 485px;	/*ヘッダーに対して左から10pxの位置に配置*/
	bottom: 30px;	/*ヘッダーに対して下から10pxの位置に配置*/
}

/* サイトタイトル */
#header .site-title{
	font-size: 26px;
	font-weight: bold;
	color: #db7093;
	line-height: 120%;
	padding: 15px 22px 5px;
	background-image: url(../images/side-mark.gif);
	background-repeat: no-repeat;
	background-position: 15px 25px;
}

/*ロゴ画像
---------------------------------------------------------------------------*/
#logo {
	padding-bottom: 3px;
}


/* ----------------------------------- navi */

/* 枠組み */
#navi{
	background-color: #fff;
	padding: 0px 0px 5px 10px;
	text-align: left;
	font-size: 13px;
	background-image: url(../images/side-mark.gif);
	background-repeat: no-repeat;
	background-position: 0px 1px;
	border-bottom: 1px #666666 dotted;
	line-height: 100%;
	margin: 0px 0px 20px;
}


/*メインコンテンツ（右側）
---------------------------------------------------------------------------*/
#main {
	width: 720px;
	float: right;
	padding-bottom: 50px;
}

#main h2 {
	font-size: 100%;
	background-color: #FFFFFF;
	border-bottom: 4px solid #E8B1BB;		/*h2タグの下線*/
	background-image: url(../images/h2bg.gif);	/*h2タグの背景画像*/
	background-position: bottom;
	background-repeat: repeat-x;
	border-top: 1px solid #F8E7EA;			/*h2タグの上線*/
	padding: 5px 5px 3px 10px;
}

#main p {
	padding: 0.5em 10px 1em;
}

/*メインコンテンツ内のボックス*/
.mainbox {
	background-color: #FFFFFF;	/*背景色*/
	border: 1px solid #efd3d6;	/*枠線色*/
	padding: 5px;				/*余白*/
	margin-bottom: 2em;
}


/* このページのトップへ戻る */
.return-top{
	padding: 0px 5px 0px 10px;
	float: right;
	clear: both;
	background-image: url(../images/side-mark.gif);
	background-repeat: no-repeat;
	background-position: 0px 7px;
	font-size: 13px;
	margin: 10px 0px 20px;
}


/*サイドコンテンツ（左側）
---------------------------------------------------------------------------*/
#side {
	float: left;
	width: 200px;
	padding-bottom: 50px;
}

#side h3 {
	font-size: 100%;				/*h3タグの文字色*/
	background-color: #FFFFFF;	/*h3タグの背景色*/
	padding-left: 20px;
	border: 1px solid #efd3d6;
}

#side p {
	padding-top: 0.5em;
	padding-bottom: 1em;
}



/*メインメニュー
---------------------------------------------------------------------------*/
ul.menu {
	margin-bottom: 1em;
}

ul.menu li {
	margin-bottom: 3px;
}

ul.menu a {
	line-height: 60px;
	color: #7e6b5a;	/*メニューの文字色*/
	text-decoration: none;
	background-image: url(../images/menu_bg.gif);	/*メニューの背景画像*/
	background-repeat: no-repeat;
	display: block;
	height: 60px;
	width: 180px;
	background-position: top;	/*画像の上半分だけを表示させる設定*/
	padding-left: 20px;
	overflow: hidden;
}

ul.menu a:hover {
	background-position: bottom;
}




/*フッター（コピーライトとか入っている最下部ブロック）
---------------------------------------------------------------------------*/
#footer {
	text-align: center;
	clear: both;
	width: 100%;
}



/*トップページの「What's New」部分
---------------------------------------------------------------------------*/
#main dl.new {
	width: 688px;			/*What's Newボックスの幅*/
	height: 185px;			/*What's Newボックスの高さ*/
	overflow: auto;
	padding: 10px;
}

#main dl.new dt {
	font-weight: bold;		/*日付の色を太字にする*/
}

#main dl.new dd {
	border-bottom: 1px solid #F8E7EA;	/*日付ごとに入る下線*/
}



/*テーブル
---------------------------------------------------------------------------*/
.ta1 {
	width: 708px;
}

.ta1, .ta1 td, .ta1 th{
	border: 1px solid #efd3d6;
}

.ta1 td, .ta1 th{
	padding: 10px;	/*テーブル内の余白*/
}

.ta1 td{
	background-color: #FDF8F9;	/*右側tdタグの背景色*/
}

.ta1 th{
	background-color: #FFFFFF;	/*左側thタグの背景色*/
	width: 258px;				/*左側thタグの幅*/
	text-align: center;
}



/*その他
---------------------------------------------------------------------------*/
.color1 {
	color: #000000;/* 黒 */
}
.color2 {
	color: #db7093;/* 桃 */
}
.color3 {
	color: #ff6600;/* オレンジ */
}
.color4 {
	color: #e8b1bb;/* 薄桃 */
}
.color5 {
	color: #3f8c3f;/* グリーン */	
}
.color6 {
	color: #79c06e;/* 薄グリーン */
}
	
.look {
	background-color: #F3F0ED;
}

.mb1em {
	margin-bottom: 1em;
}

/* 
------------------------------ 文字のサイズ */

.fs-10{
	font-size: 10px;
	line-height: 130%;
}	/* フォントサイズ10px */
.fs-12{
	font-size: 12px;
	line-height: 130%;
}	/* フォントサイズ12px */
.fs-14{
	font-size: 14px;
	line-height: 130%;
}	/* フォントサイズ14px */
.fs-16{
	font-size: 16px;
	font-weight: bold;
	line-height: 120%;
}	/* フォントサイズ16px */
.fs-18{
	font-size: 18px;
	font-weight: bold;
	line-height: 120%;
}	/* フォントサイズ18px */
.fs-20{
	font-size: 20px;
	font-weight: bold;
	line-height: 120%;
}	/* フォントサイズ20px */
.fs-22{
	font-size: 22px;
	font-weight: bold;
	line-height: 120%;
}	/* フォントサイズ22px */
.fs-24{
	font-size: 24px;
	font-weight: bold;
	line-height: 120%;
}	/* フォントサイズ24px */
.fs-26{
	font-size: 26px;
	font-weight: bold;
	line-height: 120%;
}	/* フォントサイズ26px */
.fs-28{
	font-size: 28px;
	font-weight: bold;
	line-height: 120%;
}	/* フォントサイズ28px */
.fs-30{
	font-size: 30px;
	font-weight: bold;
	line-height: 120%;
}	/* フォントサイズ30px */
.fs-32{
	font-size: 32px;
	font-weight: bold;
	line-height: 120%;
}	/* フォントサイズ32px */
.fs-36{
	font-size: 36px;
	font-weight: bold;
	line-height: 120%;
}	/* フォントサイズ36px */
.fs-40{
	font-size: 40px;
	font-weight: bold;
	line-height: 120%;
}	/* フォントサイズ40px */


/* 
------------------------------ 文字のポジション */
.p-c{ text-align: center; }
.p-l{ text-align: left; }
.p-r{ text-align: right; }
