/* 対firefoxスクロールバー */
html        {overflow-y:scroll;}

/* marginは対IE6,7 */
body        {margin: 10px;
             background-image: url(../img/back.png);
             background-repeat: repeat-x;
             background-color: #696969;}

/* 対IE6,7 */
img         {vertical-align: bottom;}

#container  {width: 790px;
             margin: auto;}

#header     {width: auto;
             margin-left: auto;
             margin-right: auto;
             background-color: #000000;}

#header h1  {margin: 0;
             padding: 10px;}

#header h1 img {border: 0;}

#header p   {margin: 0;
             border-left: solid 2px #000000;
             border-right: solid 2px #000000;}

.navi       {width: auto;
             height: 66px;
             border-left: solid 2px #000000;
             border-right: solid 2px #000000;
             border-bottom: solid 2px #FFFFFF;}

.navi #link1 a  {background-image: url(../img/navi_info.png);
                 border-right: solid 2px #FFFFFF;}
.navi #link2 a  {background-image: url(../img/navi_works.png);
                 border-right: solid 2px #FFFFFF;}
.navi #link3 a  {background-image: url(../img/navi_blog.png);
                 border-right: solid 2px #FFFFFF;}
.navi #link4 a  {background-image: url(../img/navi_about.png);}

.navi ul    {margin: 0;
             padding: 0;}

.navi li    {list-style-type: none;
             float: left;}

.navi a     {display: block;
             width: 195px;
             line-height: 66px;
             background-repeat: no-repeat;
             text-indent: -9999px;
             overflow: hidden;}

.navi li a:hover    {background-position: 0 -76px;}

.navi .current a {background-position: 0 -152px;}

.navi .current a:hover    {background-position: 0 -228px;}

/* memo */
/* 左右はwrapperでpadding：IE6対策 */
/* overflowが効かないのでwrapperのwidth指定：IE6対策 */
/* 上のマージンはcontent・sidebarでそれぞれ指定 */
/* 横幅：790 */
/* wrapper[border,4 padding,38]*/
/* content[width,520] */
/* sidebar[width,204 border,4] */
/* contentとsidebarの間[20] */

#wrapper    {overflow: hidden;
             padding: 0 18px 0px 20px;
             width: 748px;
             border-left: solid 2px #000000;
             border-right: solid 2px #000000;
             background-color: #FFFFFF;}

#content    {width: 520px;
             float: left;
             margin: 20px 0 0 0;}

#content a:link {color: #489494;
                 text-decoration: none;}

#content a:visited  {color: #489494;
                     text-decoration: none;}

#content a:active   {color: #489494;
                     text-decoration: underline;}

#content a:hover    {color: #489494;
                     text-decoration: underline;}

.post       {width: auto;}

.postblue   {margin: 0 0 30px 0;}

.postorange {margin: 0 0 30px 0;}

.postblue h2    {font-size: 1em;
                 margin: 0;
                 background-image: url(../img/maru_blue.png);
                 background-repeat: no-repeat;
                 border-bottom: solid 2px #489494;
                 padding: 5px 250px 5px 30px;}

.postorange h2  {font-size: 1em;
                 margin: 0;
                 background-image: url(../img/maru_orange.png);
                 background-repeat: no-repeat;
                 border-bottom: solid 2px #ffbb00;
                 padding: 5px 250px 5px 30px;}

.posttext   {font-size: 0.85em;
             line-height: 1.5;
             padding-left: 15px;}

.posttext ul {margin: 0 0 10px 0;}

.posttext2  {font-size: 0.85em;
             margin: 15px 0 0 0;
             line-height: 1.5;
             padding-left: 15px;}

.postinfo   {font-size: 0.75em;
             text-align:right;
             margin-top:-24px;
             margin-bottom:18px;}

.postdate   {font-size: 0.75em;
             text-align:right;
             font-weight:bold;
             padding: 0px 4px;}

.postblue .postinfo span    {background-color: #489494;
                             color: #FFFFFF;
                             padding: 2px 4px;}

.postorange .postinfo span  {background-color: #ffbb00;
                             color: #FFFFFF;
                             padding: 2px 4px;}

#sidebar    {width: 204px;
             float: right;
             border:solid 2px #000000;
             background-color: #000000;
             margin: 20px 0;}

.sidecontent    {width: auto;
                 color: #FFFFFF;}

.sidecontent h3 {margin: 0 0 10px 0;
                 font-size: 0.75em;
                 border-bottom: solid 2px #FFFFFF;
                 padding: 5px;}

.sidecontent p      {margin: 0;
                     padding: 5px;
                     font-size: 0.75em;}

.sidecontent img    {display: block;
                     margin: 0px auto 10px auto;
                     border: 0;}

.sidecontent ul {margin: 5px 0 10px 0;
                 padding-left: 30px;
                 font-size: 0.75em;}

.sidecontent li {line-height: 1.2;
                 margin-bottom: 5px;}

.sidecontent li a:link  {color: #ffbb00;
                         text-decoration: none;}

.sidecontent li a:visited  {color: #ffbb00;
                            text-decoration: none;}

.sidecontent li a:active  {color: #ffbb00;
                           text-decoration: underline;}

.sidecontent li a:hover  {color: #ffbb00;
                          text-decoration: underline;}

#footer     {width: 790px;}

#footer_inner   {padding: 15px;
                 background-color: #000000;
                 overflow: hidden;
                 width: 760px;}

#footer_left    {width: 365px;
                 float: left;}

#footer_right   {width: 365px;
                 float: right;
                 text-align: right;}

#footer p   {color: #c0c0c0;
             font-size: 0.75em;
             margin: 0;
             }

#footer img {margin: 0;
             border: 0;
             vertical-align: text-bottom;}

.bloglink   {margin: 50px 0 0 0;
             height: 100px;
             text-align: center;
             line-height: 1.7;
             font-size: 0.75em;}

/* common */
.imgcenter  {display: block;
             margin: 15px auto 15px auto;
             border: 0;}

.imgnor     {display: block;
             margin: 15px 0 15px 0;
             border: 0;}

span.midashi {font-weight: bold;
              line-height: 2.4;}

span.midashi2 {font-weight: bold;
               line-height: 2.4;
               color: #ffbb00;}

ul.decimallist  {margin: 5px 0 10px 0;
                 padding-left: 45px;}

li.decimallist  {line-height: 1.2;
                 margin-bottom: 5px;
                 list-style-type:decimal-leading-zero;}

/* .decimallist li a:link  {color: #ffbb00;
                         text-decoration: none;}

.decimallist li a:visited  {color: #ffbb00;
                            text-decoration: none;}

.decimallist li a:active  {color: #ffbb00;
                           text-decoration: underline;}

.decimallist li a:hover  {color: #ffbb00;
                          text-decoration: underline;}

*/

/*************************************************
【忍者式メールフォーム自作CSS】
自作CSSを使用するには、HTMLとCSSの知識が必須です。
HTMLやCSSについては参考文献などを参照してください。
*************************************************/

/*メールフォーム全体を囲っているタグのid*/
#Studio-Kurage_top { margin: 0 auto 30px auto;
                     background-color : #489494;
                     color: #ffffff;
                     width: 400px;
                     padding: 20px;
                     font-size: 0.90em;
}

#Studio-Kurage_top a:link  {color: #ffbb00;
                            text-decoration: none;}

#Studio-Kurage_top a:visited  {color: #ffbb00;
                               text-decoration: none;}

#Studio-Kurage_top a:active  {color: #ffbb00;
                              text-decoration: underline;}

#Studio-Kurage_top a:hover  {color: #ffbb00;
                             text-decoration: underline;}

/*メールフォームのパーツや送信ボタンを囲っているタグのclass（タイトル、説明文以外）*/
#Studio-Kurage_top .main { width: 380px;

}

/*メールフォームのタイトルを囲っているタグのclass*/
#Studio-Kurage_top .title{

}

/*メールフォームの説明文を囲っているタグのclass*/
#Studio-Kurage_top .explain {

}

/*『name』パーツの表示名と入力項目を囲っているタグのclass*/
#Studio-Kurage_top .name_top {

}

/*『name』パーツの表示名を囲っているタグのclass（[ 名前 ]の部分）*/
#Studio-Kurage_top .name_left{

}

/*『name』パーツの入力項目を囲っているタグのclass*/
#Studio-Kurage_top .name_right { padding: 3px 0 0 5px;

}

/*『name』パーツの入力項目のclass（inputなどの部分）*/
#Studio-Kurage_top .name_parts { width: 200px;
                                 border: 1px #696969 solid;

}

#Studio-Kurage_top .name_parts:focus { outline: 1px #ffbb00 solid;
                                       border: 1px #ffbb00 solid;
}

/*『mail』パーツの表示名と入力項目を囲っているタグのclass*/
#Studio-Kurage_top .mail_top {

}

/*『mail』パーツの表示名を囲っているタグのclass（[ メールアドレス ]の部分）*/
#Studio-Kurage_top .mail_left{

}

/*『mail』パーツの入力項目を囲っているタグのclass*/
#Studio-Kurage_top .mail_right { padding: 3px 0 0 5px;

}

/*『mail』パーツの入力項目のclass（inputなどの部分）*/
#Studio-Kurage_top .mail_parts { width: 200px;
                                 border: 1px #696969 solid;
}

#Studio-Kurage_top .mail_parts:focus { outline: 1px #ffbb00 solid;
                                       border: 1px #ffbb00 solid;
}

/*『url』パーツの表示名と入力項目を囲っているタグのclass*/
#Studio-Kurage_top .url_top {

}

/*『url』パーツの表示名を囲っているタグのclass（[ ＵＲＬ ]の部分）*/
#Studio-Kurage_top .url_left{

}

/*『url』パーツの入力項目を囲っているタグのclass*/
#Studio-Kurage_top .url_right { padding: 3px 0 0 5px;

}

/*『url』パーツの入力項目のclass（inputなどの部分）*/
#Studio-Kurage_top .url_parts { width: 200px;
                                border: 1px #696969 solid;
}

#Studio-Kurage_top .url_parts:focus { outline: 1px #ffbb00 solid;
                                      border: 1px #ffbb00 solid;
}

/*『title』パーツの表示名と入力項目を囲っているタグのclass*/
#Studio-Kurage_top .title_top {

}

/*『title』パーツの表示名を囲っているタグのclass（[ 件名 ]の部分）*/
#Studio-Kurage_top .title_left{

}

/*『title』パーツの入力項目を囲っているタグのclass*/
#Studio-Kurage_top .title_right { padding: 3px 0 0 5px;

}

/*『title』パーツの入力項目のclass（inputなどの部分）*/
#Studio-Kurage_top .title_parts { width: 200px;
                                  border: 1px #696969 solid;
}

#Studio-Kurage_top .title_parts:focus { outline: 1px #ffbb00 solid;
                                        border: 1px #ffbb00 solid;
}

/*『textarea』パーツの表示名と入力項目を囲っているタグのclass*/
#Studio-Kurage_top .textarea_top {

}

/*『textarea』パーツの表示名を囲っているタグのclass（[ 本文 ]の部分）*/
#Studio-Kurage_top .textarea_left{

}

/*『textarea』パーツの入力項目を囲っているタグのclass*/
#Studio-Kurage_top .textarea_right { padding: 3px 0 0 5px;

}

/*『textarea』パーツの入力項目のclass（inputなどの部分）*/
#Studio-Kurage_top .textarea_parts { width: 380px;
                                     height: 300px;
                                     border: 1px #696969 solid;
                                     font-size: 0.85em;

}

#Studio-Kurage_top .textarea_parts:focus { outline: 1px #ffbb00 solid;
                                           border: 1px #ffbb00 solid;
}

/*メールフォームの送信ボタンを囲っているタグのclass*/
#Studio-Kurage_top .submit { padding-left: 285px;

}

/*メールフォームの送信ボタンのclass*/
#Studio-Kurage_top .submit_button { color: #ffffff;
                                    border: 3px #ffffff solid;
                                    background-color: #489494;
                                    width: 100px;
                                    height: 50px;

}

#Studio-Kurage_top .submit_button:focus { outline: 1px #ffbb00 solid;
                                          border: 3px #ffbb00 solid;
}

/*エラーメッセージを囲っているタグのclass*/
#Studio-Kurage_top .error {

}

/*エラーメッセージのリトライボタンを囲っているタグのclass*/
#Studio-Kurage_top .error_submit {

}

/*エラーメッセージのリトライボタンのclass*/
#Studio-Kurage_top .error_submit_button { color: #ffffff;
                                          border: 3px #ffffff solid;
                                          background-color: #489494;
                                          width: 100px;
}

/*送信完了メッセージを囲っているタグのclaheight: 50px;ss*/
#Studio-Kurage_top .result {

}

/*送信完了メッセージの戻るボタンを囲っているタグのclass*/
#Studio-Kurage_top .result_submit {

}

/*送信完了メッセージの戻るボタンのclass*/
#Studio-Kurage_top .result_submit_button { color: #ffffff;
                                           border: 3px #ffffff solid;
                                           background-color: #489494;
                                           width: 100px;
}