/*--------------------------------------------------
テンプレート：Tree

再配布禁止
著作権削除・改変禁止（カスタマイズ後も）
アダルト・違法サイト・宗教的サイト使用禁止

カスタマイズは利用規約の範囲内でお願いします

詳しい規約はサイトで御確認ください
https://masimarock.yokochou.com/
--------------------------------------------------*/


/* ページ全体 */
body{   color:#666;   
margin:0 10px 20px 10px;    

font-size:13px;
*font-size:small;               
font-family: Meiryo, Osaka, "ＭＳ Ｐゴシック", "Lucida Sans Unicode", "Lucida Grande", Arial, Helvetica, "ヒラノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ",  sans-serif;
background:#FFF;}

#contents { max-width: 900px; padding-left:10px; padding-right:10px; }

input,textarea{   
color:#555;
font-size:100%;}

table{
width:100%;}

td{vertical-align:top;}

td,form,h1,h2,ul{
margin:0;
padding:0;}

/* 見出しフォントサイズ */
h2 {font-size:116%;}

/*--------------------------------------------------
   リンク
--------------------------------------------------*/
/* 全体 */
a{
color:#000000;
text-decoration:none;}

a:hover{
color:#94C800;
text-decoration:none;}

a img{
border:none;}

h1 {font-size:80%;margin:0px 0px 0px 10px;color:#666666;font-weight:nomal;}

#navigation td a{
color:#FFF;
display:block;
background:#cccccc;}

#navigation td a:hover{
background:#aad7d0;}

/* フッター */
#footer_ad a,div.copyright a{
color:#999;}

#footer_ad a:hover,div.copyright a:hover{
color:#94C800;
text-decoration:none;}

/*--------------------------------------------------
   レイアウト設定
--------------------------------------------------*/
/* 全体 */
#contents{ 
margin:0 auto;  
text-align:left;}

/* 囲む枠 */
background:#FCFCFC;
border:1px solid #BBB;
margin-bottom:20px;}

div.entry-body{
padding:10px;
line-height:1.6;}

/*--------------------------------------------------
   ヘッダー
--------------------------------------------------*/
#header{
padding:10px 0;}

/* カウンター */
#counter{font-size:80%;color:#555555;text-align:right;margin:20px 0px 0px 0px;}


/* ナビゲーション */
#navigation{
width:100%;
margin-bottom:25px;
text-align:center;
line-height:1.4;}

#navigation td{
text-align:center;}

/*--------------------------------------------------
   投稿フォーム
--------------------------------------------------*/
#formarea{          
margin:70px 0 30px 0;
line-height:1.6;}

/* フォームタイトル */
h2.form-title{      
margin:0 0 15px 0;
padding:1px 0 1px 6px;
line-height:100%;
border-left:5px solid #555;}

td.form-left{
width:30%;
padding-right:25px;}

td.form-right{
width:70%;}

#bbsform label{
display:block;}

/* 入力欄 */
#bbsform input,#bbsform textarea{
width:100%;
background:#FFF;
border:1px solid #BBB;}

#bbsform textarea{
width:99%;
height:100px;
margin-bottom:10px;}

/*Safari3 Google Chrome*/
@media screen and (-webkit-min-device-pixel-ratio:0){
input#image{
border:none;}}

/* 絵文字 動画 */
div.emoji{
float:left;
margin-right:40px;}

div.emoji li{
display:inline;
margin:0 5px;}

div.pre_button{   }

#bbsform .pre_button input{
width:auto;
border:none;
vertical-align:middle;}

td.pass,td.submit{
vertical-align:bottom;}

td.submit{
text-align:right; 
}

/* パスワード */
#bbsform input.form-pass{
width:auto;
font-size:12px;}

/* 入力ボタン */
#bbsform input.button,input.button{
color:#FFF;
width:auto;
background:#555;
border:1px solid #555;}

/* エラーメッセージ */
div.attention p{
color:#FF0000;
margin:0 0 12px 0;}

/*--------------------------------------------------
   スレッド
--------------------------------------------------*/
div.thread{
margin-bottom:30px;}

/* タイトル */
.thread div.title{
line-height:1.4;
margin-bottom:5px;
padding:2px 2px 2px 23px;
background:#EEE url("https://blog-imgs-32.fc2.com/m/a/s/masimarock/memoicon.gif") no-repeat 5px center;}

/* 返信タイトル */
.thread div.res-title{
color:#999;
line-height:1.4;
margin:0 2px 4px 20px;}

span.posted{
font-size:77%;}

.main .title{
color:#FFF;
font-weight:bold;
padding:4px 10px;
background:#aad7d0;}

.main .res-title{
color:#666;
font-weight:bold;
padding:4px 10px; 
background:#EAEAEA;}

/* 日付等 */
ul.date{     
margin-top:15px;}

ul.date li{
color:#888;
font-size:77%;
font-family:Verdana;
list-style:none;
margin-right:8px;
display:inline;}

/* newマーク */
span.new{
font-weight:bold;
color:#FF7700;}


div.text {padding:10px 5px 20px 5px; background-color:#f3fefc;}

/* 絵文字 */
div.text img{
vertical-align:middle;
margin:2px 3px 4px 3px;}

/* 投稿画像 */
img.userimage{
float:right;
margin:10px 0 0 15px;}

.button-body{
clear:both;
padding:18px 0 0 0;
text-align:right;}

/* 編集 削除ボタン */
.button-body input.button{
color:#FFF;
background:#999;
border:1px solid #999;}

.button-body form{
display:inline;}

/*--------------------------------------------------
   プレビュー
--------------------------------------------------*/
table.preview{
margin-bottom:20px;}

.preview th{
width:120px;
color:#888;
text-align:left;
font-weight:normal;
vertical-align:top;}

/* 絵文字 */
.preview td.text img{
vertical-align:middle;
margin:2px 3px 4px 3px;}

div.prev-inp img{
margin:10px 0;}

div.prev-inp .button{
display:block;
margin-top:15px;}

.form-cord{
background:#FFF;
border:1px solid #CCC;}

/* ページリンク */
div.pagelink{
margin-bottom:15px;
text-align:center;}

.pagelink form{
display:inline;}

/* 検索フォーム */
#searchform{
text-align:left;
margin:0 auto;
width:40%;}

#searchform p{
margin:10px 0 0 0;}

.form-text{
background:#FFF;
border:1px solid #CCC;}

/* 使い方ページ */
#help .entry-body{
padding:15px 10px;}

#help h2{
color:#666;
line-height:100%;
padding:1px 0 1px 7px;
border-left:5px solid #555;}

#help ul{
margin:10px 0 30px 30px;}

hr{
color:#DDD;
background:#DDD;
height:5px;
border-width:0;
margin-bottom:10px;}

/* 著作権 */
div.copyright{
color:#666;
font-size:13px;
font-family:Verdana;
margin:0 0 25px 0;
font-weight:bold;
text-align:center;}

#footer_ad{text-align:center;}
#footer_ad center{display:inline;}


@media (max-width: 980px) {
  /* ~980px */
  #container {
    overflow: hidden;
    min-width: 100% !important;
    width: 600px !important;      
  }
#head-img-logo img {width:400px;}
}

@media (max-width: 768px) {
  /* ~768px */
  #container {
    overflow: hidden;
    min-width: 100% !important;
    width: 100% !important;
  }
#head-img-logo img {width:400px;}
}

@media (max-width: 480px) {
  /* ~480px */
  #container {
    overflow: hidden;
    min-width: 100% !important;
    width: 100% !important;
  }
td.form-left{
width:98%;
padding-right:25px; float:left;}

td.form-right{
width:99%; float:left;}
#head-img-logo img {width:100%;}

}
