@charset"UTF-8";

/*reset*/
body ,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
ul li{list-style-type:none;}
img{margin:0;
    padding:0;
    border:none;
    vertical-align:bottom;}

/*Basic���C�A�E�g*/

#wrapper{
         margin: 0 auto;
         padding: 0 10px;
         max-width: 940px;
}
#main{
      float:right;
      width: 65%;
}
#sidebar{
         float: right;
         margin: 0 3% 0 0;
         width: 32%;
}
footer{clear: both;}

/*header*/
.frame1{border: solid 5px #f0f8ff;
        padding: 10px;
        background-color: #E0FFFF;
        border-radius: 20px;
        box-shadow: 5px 5px 10px #C4C4C4;}

header div img{
               max-width: 100%;
               height: auto;
}
header h1{margin:10px auto 10px;
          padding: 0;
          width: 500px;}
          height: 59px;
          text-indent: 0px;}
header nav ul{overflow:hidden;
              margin: 0 0 30px 0;}
header nav ul li{
                 float:left;
                 width: 25%;
                 background-color: #e6e6e7;}
header nav ul li a{display: block;
                   padding: 5px 0;
                   text-align: center;
                   color: #000000;
                   text-decoration: none;}
header nav ul li a:link{color: #000000;}
/*header nav ul li a:visited{color: pink;}*/
header nav ul li a:hover{color: #ffffff;
                         background-color: #000000;}
header nav ul li a:active{color: red;}

/*main*/


/*sidebar*/
#sidebar ul{margin:20px auto 0px;}
#sidebar ul li{border-top: 1px dotted #cc2128;}
#sidebar ul li:last-child{border-bottom: 1px dotted #cc2128;}
#sidebar ul li a{padding: 10px 0 10px 5px;
                 display: block;
                 color: #000;
                 text-decoration: none;}
#sidebar ul li a:hover{color: #000000;
                       background-color: #c0c0c0;}

/*footer*/
footer{margin: 20px 0 20px 0;
       border-top: 5px solid #4169E1;
       padding-top: 10px;
       text-align: center;}

/*���o���{��*/
h1{font-size: 30px;}
h2{margin: 0 0 10px 0;
   font-size: 20px;
   padding-bottom: 1px;
   border-bottom: 6px solid #4169E1;}
h3{margin: 0 0 10px 0;
   padding-bottom: 1px;
   border-bottom: 2px solid #4169E1;}
h4{margin: 0 0 10px 0;
   padding-bottom: 5px;}
h5{margin: 0 0 -40px 0;
   font-size: 15px;
   padding-bottom: 1px;
   border-bottom: 2px solid #4169E1;}
p{margin: 0 0 20px 0;
  font-size: 13px;
  line-height: 1.5;}

/* CSS���f�B�A�N�G�� */
@media(max-width:768px){

/* Basic���C�A�E�g */

#main{
      float: none;
      width: 100%;
      margin-bottom: 50px;
}
#sidebar{
         float: none;
         width: 100%;
}
/* header */
header h1{
          margin:10px auto 0;
          width: 350px;
          background-size: contain;
}
header nav ul li{
          float: none;
          width: 100%;
}
header nav ul li a{
          padding: 25px 0 25px 0;
}
/* sidebar */
#sidebar ul li a{
          padding:20px 0 20px 5px;
}
}
