@charset "shift_jis";

/*---------------------------- 基本設定 ----------------------------*/

* {margin: 0;padding: 0;}

/*-- 全体の基本 --*/
body {
background: url('img/bg.gif') #CC9999; /* 全体の背景（背景画像＋背景色） */
margin: 0;
font-family: Verdana,Chicago,Arial,Helvetica,'ＭＳ Ｐゴシック',Osaka,sans-serif; /* フォント種類 */
font-size: 90%; /* フォントサイズ */
color: #000000; /* フォント色 */
line-height: 1.5; /* 改行 */
}

/*-- 右下の写真画像 --*/
#bg-img {
width: 100%;
background: url('img/bg-photo.png') no-repeat right bottom;
}

/*-- 画像の周りの線 --*/
img {border: none;} /* 線なし */

/*-- htmlで<big>タグを使用した時のサイズ --*/
big {font-size: 110%;}

/*-- htmlで<small>タグを使用した時のサイズ --*/
small {font-size: 90%;}

/*-- リンク共通 --*/
a {text-decoration: none;}
/* 通常、訪問済みのリンク色 */
a:link,a:visited {color: #CC9999;}
/* カーソルを乗せたとき、クリックした瞬間のリンク色*/
a:hover,a:active {color: #008080;}
/* クリックした瞬間の回りの点線 */
a:focus {outline: none;} /* 点線なし（IE無効） */




a.linkr:link {color: #333333; text-decoration: none;}
a.linkr:visited {color: #333333; text-decoration: none;}
a.linkr:active {color: #008080; text-decoration: none;}
a.linkr:hover {color: #008080; text-decoration: none;}












/*-- CSS floatタグのクリアー 
分からない場合は触らないで下さい --*/
.clear {
min-height:0;
display: inline-block;
}
.clear:after {
content: "";
display: block;
height:0; 
clear: both;
}
/* \*/ 
* html .clear {height:0;} 
.clear {display: block;} 
/* */ 

/*---------------------------- 外枠・配置 ----------------------------*/

/* 全体の横幅（メニュー＋メイン＋10px） */
#wrap {
width: 850px;
padding: 10px 0 10px 0;
}

/*-- メインとメニューの高さ合わせと配置 --*/
#box {
overflow: hidden;
height: auto;
width: auto;
background-color: #FAEBD7; /* 右余白(上記の10px部分)の背景色 */
}
#box #main,#box #menu {
padding-bottom: 32767px;
margin-bottom: -32767px;
float: left;
}

/*-- メインの幅と背景 --*/
#main {
background-color: #FFFFFF; /* メインの背景色 */
width: 640px; /* 横幅 */
}
/*-- メニューの幅と背景 --*/
#menu {
background-color: #FAEBD7; /* メニューの背景色 */
width: 200px; /* 横幅 */
}

/*-- メインとメニューの周りの余白 --*/
div.inner {padding: 20px 10px;}

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

#head {
width: auto;
height: 200px;
background: url('img/kado.gif') no-repeat right top; /* ヘッダ右上の丸い角画像 */
}

#head-img {
width: auto;
height: 200px;
margin-right: 25px;
background: url('img/head.jpg') #FFFFFF no-repeat left top; /* ヘッダ写真 */
position: relative;
}

/* サイト名 */
h2#sitename {
position: absolute;right: 0;bottom: 0; /* 配置（右から0、下から0） */
font-style: oblique; /* フォント斜体 */
font-family: 'Times New Roman',Times,'ＭＳ Ｐ明朝',細明朝体,serif; /* フォント種類 */
font-size: 60px; /* フォントサイズ */
color: #999999; /* フォント色 */
font-weight: bold; /* 文字の太さ（太字・通常の太さにする場合はこの行を削除） */
line-height: 1.0;
}

/*-- SEO対策用キャッチコピー --*/
h1#seo {
width: auto;
height: auto;
margin: 0;
margin-left: 235px;
font-size: 13px; /* フォントサイズ */
font-weight: normal; /* 文字の太さ（通常） */
line-height: 13px;
color: #C0C0C0; /* フォント色 */
}

/*---------------------------- ナビ ----------------------------*/

#navi {
background-color: #FAEBD7; /* 背景色 */
border-bottom: 15px solid #808080; /* 下部の区切り線 */
}

/* 上部の余白部分 */
#navi div#margin-ue {height: 20px;}

/* ナビのテキスト */
#navi div#navi-main {
margin: 0 5px;
font-size: 110%; /* フォントサイズ */
}

/* リンク設定 */
#navi div#navi-main a {
background: url('img/ico-01.gif') no-repeat left center; /* アイコン画像 */
padding-left: 18px;
padding-right: 5px;
color: #008080; /* フォント色 */
}

/* カーソルを乗せた時の設定 */
#navi div#navi-main a:hover {
background: url('img/ico-02.gif') no-repeat left center; /* アイコン画像 */
color: #CC9999; /* フォント色 */
}

/*---------------------------- メニュー ----------------------------*/
ul#menu-list {list-style-type: none;}

/*-- メニュー部分の見出し --*/
ul#menu-list li {
font-size: 120%; /* フォントサイズ */
font-family: 'ＭＳ Ｐ明朝',細明朝体,serif; /* フォント種類 */
color: #333333; /* フォントの色 */
line-height: 1.0;
}

/*-- メニュー部分 --*/
ul#menu-list li ul {
margin-left: 10px;
margin-bottom: 10px;
list-style-type: none;
}

ul#menu-list li ul li {
font-size: 100%; /* フォントサイズ */
color: #999999; /* リンクを貼っていないテキストの色 */
line-height: 1.5; /* 改行 */
}

/* 通常、訪問済みリンク */
ul#menu-list li ul li a {color: #333333;} /* リンク色 */

/* カーソルを乗せた時 */
ul#menu-list li ul li a:hover {
background: url('img/ico-02.gif') no-repeat right center; /* 右に表示される画像 */
padding-right: 20px;
color: #CC9999; /* リンク色 */
}

/* メニュー以外のテキスト（Ｐタグ使用時の余白） */
#menu p {padding: 10px;}

/*---------------------------- メイン ----------------------------*/

#main {
background: url('img/pora.jpg') #FFFFFF no-repeat right bottom;
z-index: 1;
}

/* サブタイトル */
#main h1 {
width: auto;
margin: 10px;
background: url('img/title-bgpink.gif'); /* 見出し背景画像 */
line-height: 30px;
font-size: 100%;
color: #999999; /* 見出しのフォント色 */
padding: 0 1em;
}

/* サブタイトル(青バージョン) */
#main h3.blue {background: url('img/title-bgblue.gif');} /* 見出し背景画像 */

/* Ｐタグ使用時の余白 */
#main p {padding: 10px 30px;}

/*---------------------------- フッター（著作権） ----------------------------*/

#footer {
line-height: 15px;
background-color: #808080; /* 背景色 */
font-size: 70%; /* フォントサイズ */
color: #FFFFFF; /* フォント色 */
text-align: right; /* テキストの配置（右寄せ） */
padding: 0 10px;
}

/*---------------------------- メールフォーム ----------------------------*/

#main p#mail {
width: auto;
text-align: right;
}

/*-- フォーム全体の設定 --*/
p#mail input,p#mail textarea,p#mail select{
border: 1px solid #CC9999; /* ボーダー（線の太さ/種類/色の順） */
background-color: #FFFFFF; /* 背景色 */
color: #999999; /* フォーム内のフォント色 */
margin: 5px;
padding: 1px;
}

/*-- 各フォームの設定 --*/
p#mail input {width: 200px;} /* １行フォームの幅 */
p#mail input#btn {
width: 80px; /* 送信ボタンの幅 */
padding: 0;
}
p#mail textarea {
width: 400px; /* テキストエリアの幅 */
height: 120px; /* テキストエリアの高さ */
}