<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">
@media screen and (min-width:641px)
{
*  { 
          padding : 0px ; 
          margin : 0px ;
          }
          
#site-box {
          width : 800px;
          height:auto;
          margin : 0px auto;
          
          }
          
/*-------------------ヘッダー部ＩＤ　ＣＳＳ--------------------------*/

#a-box {
       width:780px;
       height:180px;
       border:solid 10px green;
       background-color:yellow;
       }
       

.a1box {    /*---------自然の館ロゴ配置 CLASS ---------*/
         width:180px;
         height:160px;
         text-align:center;
         
         padding-right: 20px;
         float:right;
         }
         

.a2box{    /*---------海人写真配置 CLASS ---------*/
         
         width:160px;
         height:160px;
         text-align: center;
         
         padding: 0px;
         float:left;
         }
         

.a3box {    /*-------表題配置　CLASS -----------*/
         
         width:420px;
         height:160px;
         text-align: center;
         padding-top: 40px;
         float:left;
         }
        

img {
     margin-top:20px;
     }
     
.kage {
      color:#ff8c00;
      font-size:140%;
      text-shadow:1px 2px 2px #000000;
      }
      
/*------------------------------------------------------*/

/*---------------中段　b-box --------------------------*/

.b-box {
        clear: both;
        width:100%;
        margin: 0px;
        padding: 0px;
        float: left;
        }
        
.layout01 {
          text-align: right;
          padding-right: 50px;
          }
          
.gazou {
       width:300px;
       margin:20px;
       float:right;
       clear:both;
       }
       

/*----------------------　フッター部　ＣＳＳ----------------*/
#d-box {
          clear: both;
          width: 100%;
          height:auto;
          
          }
.d1box {  /*----表示案内ＢＯＸ-------*/
        width: 100%;
        height:auto;
        text-align: center;
        }
        
.d2box {  /*---リンクボタンＢＯＸ----*/
          width: 100%;
          height:auto;
          font-size: 15px;
          padding: 10px 0px;
          text-align: center;
          }
          
/*--------ボタンの型式-------------*/
input[type="button"],button{
         cursor:pointer;
         cursor:hand;
         }
         
/*------フッターリンクボタンの規格-----*/
.linkbotton {
             
             margin-bottom: 0px;
             text-align:center;     /*--ボタン内の文字を中央に--*/
             display: inline-block; /*--横に並べる----*/
             padding: 0.2em 1em;    /*--上下0.2em、左右1em　ボタンの大きさを変える---*/
             
             text-decoretion: none; /*---aタグの下線を消す--*/
             background: #dcdcdc;   /*---ボタンの色---*/
             color: black;          /*---文字の色-----*/
             border-bottom: solid 4px #627295; /*---ボタン下部の影の大きさと影の色-----*/
             border-radius: 3px;    /*---角を丸く表示する----*/
             }
             
/*------ボタンを押した時動きを加える------*/
.linkbotton:active {
                  -ms-transform: translateY(4px);   /*---影の大きさ4pxは合せること----*/
                  -webkit-transform: translateY(4px);
                  transform: translateY(4px);
                  box-shadow: 0px 0px 1px rgba(0,0,0,0.2); /*---ボタンを押した時影は1pxになる--*/
                  border-bottom: none;
                  }

a { 
  text-decoration:none; /*---下線を消す----*/
  }
  
/*------文字規格・その他規格設定----------*/

      
h1 {  /*-----タイトルに使用------*/
          font-size: 22px;
   }

h2 {  /*----中段、ボタン文字、フッターで使用-------*/
          font-size:17px;
          color:#ff4500;
          
          padding: 0px 10px;
          margin: 1em;
          }

h3 {    /*----フッターボタンに使用---------*/
          font-size: 16px;
          margin: 0px;
   }

p {
          font-size: 16px;
          padding: 0px 30px;
          line-height: 1.5em;
  }

} /*----PC設定　終了------*/


/*=======================================================================
-------------スマホ用ＣＳＳ------------------------------
=========================================================================-*/

@media screen and (max-width:640px)
{
/*-----------基本設定--------------------*/
*  { 
          padding : 0px ; 
          margin : 0px ;
          }

#site-box {
          width : 100%;
          height:auto;
          background-color:#87cefa;
          margin : 0px auto;
          }
          
body{
    -webkit-text-size-adjust:100%; /*--スマホを横にしても文字サイズを変えない--*/
    }
    
html{
    box-sizing:border-box; /*---パディング寸法を無視する----*/
    }
          
img{
   margin-top: 20px;
   max-width:50%;  /*--画面に合わせて縮小する、拡大は原寸まで--*/
   width/***/:auto;
   }
   

/*-------------------ヘッダー部ＩＤ　ＣＳＳ--------------------------*/

#a-box {
       width:100%;
       height: auto;
       background-color:#87cefa;
       }
       

.a1box {    /*---------自然の館ロゴ配置 CLASS ---------*/
         clear:both;
         width:100%;
         height:auto;
         text-align:center;
         
         padding-right: 0px;
         float:right;
         }
         

.a2box{    /*---------海人写真配置 CLASS ---------*/
         
         width:100%;
         height:auto;
         text-align: center;
         
         padding: 0px;
         float:left;
         }
         

.a3box {    /*-------表題配置　CLASS -----------*/
         
         width:100%;
         height:auto;
         text-align: center;
         padding-top: 50px;
         float:left;
         }
        

img {
     margin-top:20px;
     }
     
.kage {
      color:#ff8c00;
      font-size:140%;
      text-shadow:1px 2px 2px #000000;
      }
      
/*------------------------------------------------------*/

/*---------------中段　b-box --------------------------*/

.b-box {
        clear: both;
        width:100%;
        margin: 0px;
        padding: 0px;
        float: left;
        }
        
.layout01 {
          text-align: center;
          padding: 30px 0px;
          }
          
.gazou {
       width:100%;
       margin: 0px 0px 30px 0px;
       text-align: center;
       clear:both;
       }
       

/*---------フッター部　ＣＳＳ----------------*/
#d-box {
          clear: both;
          width: 100%;
          height:auto;
          
          }
.d1box {
        width: 100%;
        height:auto;
        text-align: center;
        }
        
.d2box {   /*------リンクボタン----------*/
          width: 100%;
          height:auto;
          font-size: 15px;
          
          padding: 10px 0px;
          
          }
          
/*--------ボタンの型式-------------*/
input[type="button"],button{
         cursor:pointer;
         cursor:hand;
         }
         
/*------フッターリンクボタンの規格-----*/
.linkbotton {
             width: 30%;
             margin: 0px 0px 4px 30px;
             text-align:center;
             display: inline-block; /*--横に並べる----*/
             padding: 0.2em 1em;    /*--上下0.2em、左右1em　ボタンの大きさを変える---*/
             
             text-decoretion: none;
             background: #dcdcdc;   /*---ボタンの色---*/
             color: black;          /*---文字の色-----*/
             border-bottom: solid 4px #627295; /*---ボタン下部の影の大きさと影の色-----*/
             border-radius: 3px;    /*---角を丸く表示する----*/
             }
             
/*------ボタンを押した時動きを加える------*/
.linkbotton:active {
                  -ms-transform: translateY(4px);   /*---影の大きさ4pxは合せること----*/
                  -webkit-transform: translateY(4px);
                  transform: translateY(4px);
                  box-shadow: 0px 0px 1px rgba(0,0,0,0.2); /*---ボタンを押した時影は1pxになる--*/
                  border-bottom: none;
                  }

a { 
  text-decoration:none; /*---下線を消す----*/
  }

/*--------------文字規格・その他規格設定----------------------*/

h1 {  /*--ヘッダーページ表題-----*/
          font-size: 16px;
   }

h2 {  /*----中段、ボタン文字、フッターで使用-------*/
          font-size:17px;
          color:#ff4500;
          text-align:center;
          padding: 0px;
          
          }

h3 {  /*----フッターボタンに使用---------*/
          font-size: 15px;
          margin: 0px;
   }

h4 {  /*----未使用---------*/
          font-size: 30px;
          margin: 0px;
   }
   
p {
          font-size: 15px;
          padding:0px 20px;
          margin: 0px;
  }


} /*----スマホ設定　終了------*/

</pre></body></html>