/* style5_lightgray efefef 本文用 */


  @charset "utf-8";

  A{text-decoration:none}
  A:link { color:#000000}       
  A:visited { color:#9370db }
  A:hover { color:#ff6699}
  A:active { color:5a9175}
  A.external:link  {color: #000000}
  A.external.external:visited  {color: #000000} 
  A.external:hover { color:#000000} 
  A.external:active { color:#000000} 


  html{
    scroll-behavior: smooth;
    }

  body {
    font-family: sans-serif;
    background-color: #787878;
    }


  header {
    width: 100%;
    background-color: #f5ffea ;
    padding: 2px 0;
    margin: 0 auto;
    text-align: left;
    }

  div#okaoka {
    background-color: #a3a3a3 ;
    padding: 5px 0;
    margin: 0 auto;
    text-align: left;
    display: flex !important;
    justify-content: space-around;
    align-items: flex-end;
    }  

  div#okaoka b {
    color: #f5ffea ;
    font-size : 20 ;
    }



  .logo  {
    border: 2px solid #ccc;
    padding: 4px;
    } 



  #nav {  
    list-style-type: none;
    overflow: hidden;
    background-color: #a3a3a3;
    margin: 0; 
    padding: 0;
    display: flex !important;
    justify-content: center;
    }

  #nav li {

    text-align: center;
    background-color: #a3a3a3;
    float: left;
    height: 25px;
    line-height: 1;
    margin-right: 10px;
    margin-bottom: 10px;
    display: inline-block;
    padding: 5px;
    }
 
  #nav li a {
    display: block ;
    padding:  10px 7px;

    text-decoration: none;
    color: #fff;
    font-size: 15px;
    font-weight: bold;
    }

  #nav li a:hover {
    background-color: #f5ffea;    
    color: #000;
    }


      /* style5_usukiiro2 本文用 */

  div#container {
    background-color: #fafffe ;
    margin-right: auto;
    margin-left: auto;
    width: 740px ;
    padding: 20px;    
    }


  .title_waku {
    width: 700px;
    padding: 20px 20px;
    margin: 0 auto;
    text-align: center;
    } 

  .title {              /* タイトル */
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 20px; 
    width: 700px;
    text-align: center;
    font-family: "ＭＳ 明朝",sans-sherif;
    font-weight: 700;
    font-size: 30px;
    }     

    .top_photo{              /* TOP 大　写真枠 */
      margin: 10px auto;
      border:3px solid #a3a3a3;
      cellPadding:0;
      }



    .photo{              /* 写真＋説明　枠 */
      text-align: center;      
      margin: 3px auto;
      border: 3px solid #a3a3a3;
      cellPadding: 0;
      }

    .photobun{           /* 写真の説明 */
      text-align:justify;
      text-align:center;
      color:#4e4e07;
      font-weight:700;
      font-size:18px;
      font-family: "ＭＳ Ｐゴシック",sans-sherif;
      }


    .midashi{
          text-align: left;      
      }
      
    .img_eki{           /* 駅の写真とMAPの枠 */
      margin: 10 10;
      }

    .img_photo{
      text-align:center;      
      margin: 5px 5px;
      float: left;
      }
 


    .iframe_mail{
      margin: 5 5;
      border:3px solid #efefef;
      }

    .kazari_l{
      text-align:left;
      }

    .kazari_r{
      margin-left: 610px;

      }

    table.kazari{
      width: 100%;
      }

/* TOPへ */

  .gotop{
    display: block;
    width: 60px;
    height: 60px;
    box-sizing: border-box;
    background: #FFF;
    border: 1px solid #999;
    padding-top: 30px;
    text-align: center;
    letter-spacing: -1px;
    font-size: 85%;
    text-decoration: none;
    color: #333;
    opacity: 0.5;
    position: fixed;
    bottom: 30px;
    right: 20px;
    z-index: 10000;

    }
  .gotop::before{
    content: "";
    display: block;
    border-top: 2px solid #333;
    border-right: 2px solid #333;
    width: 25%;
    height: 25%;
    top: 25%;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    transform: rotate(-45deg);
    }
  .gotop:hover{
    opacity: 1;
    }
 

/* OK */