@charset "Shift_JIS";


body{width: 900px; text-align: center; font-family:"Verdana", "MS UI Gothic", "ＭＳ Ｐゴシック", "ＭＳ ゴシック", Osaka, sans-serif; font-size: 12px; line-height: 110%; margin: 5px auto; padding: 5px; background-image:url(../418image/bg.jpg);}



div#container{color: #333; text-align: left; margin: 0px; padding: 0px; width: 801px;}
div#container2{color: #333; text-align: left; padding:5px 0px 0px 180px; width: 621px; height: 96px; background-image:url(../418image/p2.jpg);}
div#header{width: 800px; margin: 0px; padding: 0px 0px 5px 0px; color: #333;}
div#header2{width: 800px; margin: 0px; padding: 0px 0px 5px 0px; color: #333;}
div#main{float: left; margin: 0px; padding: 0px; width: 605px;}
div#maincontents{float: left; width: 357px; margin: 0px; padding: 0px; color: #333;}
div#maincontents2{float: left; width: 357px; height:210px; background-image:url(../418image/p6.jpg);}
div#maincontents3{float: left; width: 605px; height:20px; color: #333; background: #fff; padding: 20px 20px 20px 20px; margin:0px 0px 0px 0px;}
div#maincontents4{float: left; width: 357px; height:20px; background: #fff; padding: 2px 0px 2px 0px; text-align: center;}
div#maincontents5{float: left; width: 357px; height:181px; background: #fff; padding: 2px 0px 2px 0px; text-align: center; background-image:url(../418image/ma2.jpg);}
div#maincontents6{font-size: 120%; float: left; width: 357px; height:34px; background: #fff; padding: 12px 0px 2px 30px; text-align: light; background-image:url(../418image/ma4.jpg);}
div#maincontents7{font-size: 98%; float: left; width: 357px; height:34px; background: #fff; padding: 12px 0px 2px 30px; text-align: light;}
div#right{text-align: center; float: right; margin: 0px; padding: 0px; width: 190px; background: #fff;}
/* 左の背景固定してます。例として */
div#left{float: right; width: 190px; background: #fff;}
div#left2{float: left; width: 234px; height:377px; background-image:url(../418image/p4.jpg);}
div#left3{float: left; width: 234px; height:2px;}
div#left4{float: left; width: 234px; height:40px; background-image:url(../418image/a2.jpg);}
div#left5{float: left; width: 234px; height:230px; background-image:url(../418image/a3.jpg);}
div#left6{float: left; width: 234px; height:60px;}
div#footer{clear: both; width: 800px; height:61px; background-image:url(../418image/f.jpg);}
div#footer2{padding: 26px 0px 2px 200px; font-size: 90%; color: #fff;}


/* ここから全ページ共通の基本設定。文字色を指定したら背景色も指定しないとだめです */

h1{width: 620px; font-size: 100%; font-weight: normal; color: #fff; margin:0px 0px 28px 0px;}
h2{font-size: 110%; color: #333;}
h3{font-size: 100%; color: #fff;}
h4{width:350px;
height:14px;
color:#FFFFFF;
background-color:#2462B9;
font-size:14px;
font-weight:bold;
padding:3px 0px 0px 5px;
margin:0px 0px 15px 0px;}


h5{width:500px;
height:26px;
padding:3px 0px 0px 5px;
font-size:17px;
font-weight:bold;
margin:0px 0px 10px 0px;
border-bottom:solid 2px #0055e6;
border-left:solid 5px #0055e6;}

/* 基本Pタグ等でmarginとpaddingを取る。理由はブラウザごとにmarginとpaddingの解釈が微妙に違うから */

p{text-align: left; padding: 3px; margin: 3px; line-height: 120%;}

/* SEO的にstrongタグよりもemタグが有効。font-weight：normalは厳密な意味ではスパムだが大丈夫です */

em{color: #333; font-style: normal; font-weight: normal; background: #fff;}

/* けど表示的に強調したいところもあるからstrongタグも使います */

strong{color: #e00; background: #fff;}

/* リストの先端に画像を背景として表示。ulでマージン等を指定しないと変な空間を取るブラウザーがあるので注意 */

ul{float: right; margin: 0px 5px; padding: 0px 5px; list-style: none;}
li{font-size: 100%; padding-left: 5px; padding-bottom: 1px; padding-top: 3px;}

/* 段落タグは実験的に使用。SEO的には未知数だがなんでもリストタグよりは意味的に正しいはず */

dt{padding-left: 10px;}
dd{padding: 3px; line-height:120%; margin: 10px;}

/* テーブルタグは本当に表を使う時のみに使うこと。table-layout: fixed;にするテーブルの表示が速くなる */


/* 画像のボーダーは当然0px */

img{border: 0px}

/* 区切り線も色つけれますが背景色指定をする */
hr{color: #f90; background-color: #fff;}


/* リンク系の記述はこの順番で書かないと誤動作を起こします */



/* ここからCSSの小技 */

/* 無理やり角○表現
色を変えるときはgifファイル自体を変更すること
この.contの中に本文書いてそのあと全部divで閉じていく。
div.pは周りとのpadding用です。 */

div.p{padding: 5px;}
div.t{background: url(../images/bottom_line.gif) repeat-x 0 0;}
div.r{background: url(../images/side_line.gif) repeat-y 100% 0;}
div.b{background: url(../images/bottom_line.gif) repeat-x 0 100%;}
div.l{background: url(../images/side_line.gif) repeat-y 0 0;}
div.lt{background: url(../images/bg_lt.gif) no-repeat 0 0;}
div.rt{background: url(../images/bg_rt.gif) no-repeat 100% 0;}
div.rb{background: url(../images/bg_rb.gif) no-repeat 100% 100%;}
div.lb{background: url(../images/bg_lb.gif) no-repeat 0% 100%;}
div.cont{padding: 10px; line-height: 150%;}

/* キーボード表現です。
使用時はクラス指定なのでspan class="kbb"とかh4 class="kbb"とか。
display：inlineはPタグ内の文章の中で自然に見せる為に保険として必須。 */

.kbb {font-size:80%; font-weight: bold; color: #333; background-color: white; text-align: center; border-left: 1px solid #cfcfcf; border-top: 1px solid #cfcfcf; border-right: 2px solid #666; border-bottom: 2px solid #666; padding-left: 1px; padding-top: 0px; padding-right: 2px; padding-bottom: 0px; margin-left: 2px; margin-right: 2px; vertical-align: top; font-family: sans-serif; display: inline;}

/* 新着情報表示用 */
div.new{width: 170px; height: 100px; overflow: auto; margin: 5px 0px; padding: 5px 0px; text-align: left; background: #fff; color: #333;}


/* ここから各id属性内の要素
必要によって増やしますがあまり増やさないように考えます
 */

/* ヘッダーid属性内の要素 */

div#header h2{margin: 0px; padding: 0px;}
div#header h3{margin: 0px; padding: 0px;}
div#header ul{list-style: none; margin: 0px 0px 0px 0px; float: right;}
div#header li{font-size: 12px; margin-right: 0px; float: left; text-align: left; padding: 2px 10px 2px 20px; background: url(../images/list.gif) no-repeat 0 50%; font-weight: bold;}

/* 本文id属性内の要素 */

div#maincontents h2{text-align: center; margin: 0px; padding: 0px; background-image:url(../418image/p4.jpg);}

div#maincontents h3{text-align: left; padding-left: 5px;}
div#maincontents h4{text-align: left; padding-left: 10px;}
div#maincontents p{font-size: 1px font-weight: normal; width: 300px; height: 30px; margin: 20px 0px 0px 25px;}
div#maincontents table{font-size: 12px;}





/* 右側id属性内の要素 */

div#right h2{font-size:135%; width: 190px; height: 31px; background: #fff; color: #333333; text-align: center; margin: 0px; padding: 12px 0px 0px 0px;}
/* ブロック要素のものには必要に応じて背景透明指定 */
div#right h3{background: #2EA8E7; 
color: #fff; 
width:190px; 
height: 44px; 
padding:18px 0px 3px 5px;
font-size:18px;
font-weight:bold;
margin:0px 0px 10px 0px;
border-left:solid 10px #F59E35;}

div#right h4{ background: transparent; text-align: left; padding-left: 10px;}

/* 左側id属性内の要素 */

/* ボーダーでの表現例 */
div#left h2{font-size:135%; width: 190px; height: 31px; background: #fff; color: #333333; text-align: center; margin: 0px; padding: 12px 0px 0px 0px;
}
div#left h3{background: #2EA8E7; 
color: #fff; 
width:190px; 
height: 44px; 
padding:18px 0px 3px 5px;
font-size:18px;
font-weight:bold;
margin:0px 0px 10px 0px;
border-left:solid 10px #F59E35;}

div#left h4{text-align: left; margin:65px 0px 0px 100px; padding-left: 10px; font-weight:normal ; background: transparent;}
div#left h5{font-size:14px; color: #fff; text-align: left; margin:14px 0px 0px 8px; padding-left: 10px; background: transparent;}
div#left table{font-size: 12px; color: #fff;}

/* 小技半透明背景 */

/* 下側id属性内の要素 */

div#footer ul{list-style: none; margin: 0px 0px 0px 0px; float: right;}
div#footer li{font-size: 12px; margin-right: 0px; float: left; text-align: left; padding: 2px 10px 2px 20px; background: url(../images/list.gif) no-repeat 0 50%; font-weight: bold; display: inline;}