﻿@charset "UTF-8";

/* -------共通------- */

/* bodyの上下のpaddingの設定 既存 */
body {

  padding-top: 20px;

  padding-bottom: 20px;

}



/* ヘッダーとフッターの左右paddingの設定 　既存 */

.header,

.footer {

  padding-right: 15px;

  padding-left: 15px;

}

 

/* ヘッダー下のpadding設定　既存　ヘッダー下の線を青に */

.header {

  padding-bottom: 20px;

  border-bottom: 1px solid #0000ff;

}

/* ヘッダーの下マージン(下線下）にマージンを設定する */
  
.header {

    margin-bottom: 30px;

  }




/* フッターの設定　既存　フッター上の線を青に */

.footer {

  padding-top: 19px;

  color: #777;

  border-top: 1px solid #0000ff;
  text-align: center;
}



/* パソコン画面での幅を広めに指定 */
@media screen and (min-width:1200px){
 .container {
 max-width: 900px;
}}


/*ここから要検討　marginやpaddeingが複雑 Responsive: Portrait tablets and up
スマホ/タブレット利用時　ヘッダー、フッター、top下の左右paddingをゼロにする　既存 */
@media screen and (min-width: 768px) {

  /* Remove the padding we set earlier */
  
.header,
   
.footer {

    padding-right: 0;

    padding-left: 0;

  }}
 

 


/* -------ナビ関係------- */

/* ナビの設定 */
.nav {
 margin: 3px;
 color: ;
 background: ;
}

/* ナビにカーソルがのったとき緑にする */
 .nav > li > a:hover {
 background: #F5FFFA;
 color: #228B22 
}


/* -------トップに戻るボタン関連------- */

/* トップに戻るボタンの表示位置  */
#topbtn {
 position: fixed;
 bottom: 60px;
 right: 40px;
}

/* トップに戻るボタンの設定　黄丸*/
#topbtn a {
 display: block;
 border-radius: 50%;
 width: 50px;
 height: 50px;
 background-color: #FFFF00;
 text-align: center;
 padding-top: 15px;
 background-color: rgba( 255, 255, 0, 0.5 ); /* ボタンを半透明にする */
}

/* トップに戻るボタンの設定　緑丸
#topbtn a {
 display: block;
 border-radius: 50%;
 width: 50px;
 height: 50px;
 background-color: #d6ffd6;
 text-align: center;
 padding-top: 15px;
 background-color: rgba( 214, 255, 214, 0.6 ); 
}*/


/* トップに戻るボタン　訪問前　リンクの下線を消す */
#topbtn a:link {
    text-decoration: none;
}

/* トップに戻るボタン　訪問後　リンクの下線を消す */
#topbtn a:visited {
    text-decoration: none;
}

/* トップに戻るボタン　マウスが乗るとさらに半透明にする 下線を消す */
#topbtn a:hover {
 text-decoration: none;
 opacity: 0.7;
}


/*  -------その他色のカスタマイズ関係------- */

/* 文字色を濃紺に設定する */
 .deepblue {
 color: #0000ff;
}

/* 文字色を赤に設定する */
 .red {
 color: #ff0000;
}

/* 壁紙の背景色を薄青に設定 */
 .well-blue {
 background: #F0FFFF;
}

/* 壁紙の背景色をを薄緑に設定 */
 .well-green {
 background: #F5FFFA;
}


/* -------トップページの設定------- */


/* topmain　topﾍﾟｰｼﾞの下の内容部分の上下のマージンの指定 */
.topmain {

  margin: 40px 0;

}





.topmain p + h4 {

  margin-top: 28px;

}



/* トップページの連絡先のボタンの色を薄黄にする */ 
 .btn {
 background: #FFFACD;
}



/* test  ナビボタンにマウスが乗った時、薄黄に色を変えるand
スマホ時メニューボタンホバー緑色、字も緑色*/


 .navbutton>.open>a:focus {
background: #c3ede7;
}

 .navbutton:hover  {
background: #ffffe0;
}

.dropdown-menu>li>a:focus,
.dropdown-menu>li>a:hover {
color: #26534c;
background: #F5FFFA; 
}
 
