/* =========================================================
　reset
========================================================= */
html, body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, fieldset, input { margin: 0; padding: 0; }
ol, ul { list-style: none; }
fieldset, img { border: none; }
table { border-collapse: collapse; border-spacing: 0; }
td { padding: 0; }


/* =========================================================
　body
========================================================= */
body { font: 12px/20px "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", osaka, Arial, Verdana, sans-serif; color: #444; }
a:link, a:visited { color: #444; text-decoration: underline; }
a:active, a:hover { color: #444; text-decoration: none; }


/* =========================================================
　head
========================================================= */
#head { width: 850px; margin: 0 auto; }
#head span { display: none; }
#head #left { width: 425px; float: left; }
#head #left a { width: 425px; height: 400px; display: block; background: url(image/img_std.jpg) 0 0; }
#head #left a:hover { background-position: 0 -400px; }
#head #right { width: 425px; float: left; }
#head #right a { width: 425px; height: 400px; display: block; background: url(image/img_std2.jpg) 0 0; }
#head #right a:hover { background-position: 0 -400px; }


/* =========================================================
　menu
========================================================= */
#menu { width: 850px; margin: 0 auto; }
#menu span { display: none; }
#menu #left { width: 425px; float: left; }
#menu #left a { width: 425px; height: 50px; display: block; background: url(image/menu-stc.gif) 0 0; }
#menu #left a:hover { background-position: 0 -50px; }
#menu #right { width: 425px; float: left; }
#menu #right a { width: 425px; height: 50px; display: block; background: url(image/menu-mail.gif) 0 0; }
#menu #right a:hover { background-position: 0 -50px; }


/* =========================================================
　message
========================================================= */
#messa { width: 850px; margin: 0 auto 20px auto; padding: 20px 0; background: #DDD; }


/* =========================================================
　conner
========================================================= */
#conner { width: 850px; height: 66px; background: url(image/menu4.jpg) 0 0; }
#conner span { display: none; }
#conner li, #conner a { width: 283px; height: 66px; }
#conner li { float: left; }
#conner a { display: block; background: url(image/menu4.jpg) 0 0; }
#conner1 a:link, #conner1 a:visited { background-position: 0 0; }
#conner1 a:active, #conner1 a:hover { background-position: 0 -66px; }
#conner2 a:link, #conner2 a:visited { background-position: -283px 0; }
#conner2 a:active, #conner2 a:hover { background-position: -283px -66px; }
#conner3 a:link, #conner3 a:visited { background-position: -565px 0; }
#conner3 a:active, #conner3 a:hover { background-position: -565px -66px; }


/* =========================================================
　blog
========================================================= */
#blog { width: 850px; margin: 0 auto; }
#blog span { display: none; }
#blog #left { width: 425px; float: left; }
#blog #left a { width: 425px; height: 154px; display: block; background: url(image/blog-satori.jpg) 0 0; }
#blog #left a:hover { background-position: 0 -154px; }
#blog #right { width: 425px; float: left; }
#blog #right a { width: 425px; height: 154px; display: block; background: url(image/blog-chiduru.jpg) 0 0; }
#blog #right a:hover { background-position: 0 -154px; }


/* =========================================================
　style
========================================================= */
.cl { clear: both; }