@charset "UTF-8";
@media screen and (max-width: 640px)
{
  img
  {
    max-width: 100%;
    height: auto;
    width /***/:auto;
  }
  p
  {
    width : 100% ;
    font-size : 65% ;
    margin : 0 0 1.8em 0 ;
    line-height : 1.7 ;
  }
  ul
  {
    width : 100% ;
    font-size : 65% ;
    margin : 0 0 1.8em 0 ;
    line-height : 1.7 ;
  }
  h1
  {
    width : 100% ;
    font-size : 85% ;
    margin : 0 0 1.8em 0 ;
    line-height : 1.7 ;
  }
  h2
  {
    width : 100% ;
    font-size : 75% ;
    margin : 0 0 1.8em 0 ;
    line-height : 1.7 ;
  }
  .map iframe
  {
    width: 100% !important;
    height: 100% !important;
  }
  body
  {
    color: #A0522D;
  }
  h1
  {
    margin:0.5em 0.5em;
  }
  .logo1
  {
    font-size:0.7em;
    font-weight: bold;
    color: #A0522D; 
  }
  .logo2
  {
    font-size:0.4em;
    color: #A0522D; 
  }
      .line
      {
        background-image:url(onpu.png);
        background-repeat: repeat-x;
        border:0;
        padding:15px 15px 15px 15px;
        width: 100%;
      }
      .banner
      {
        text-align:center;
      }
      .banner a:hover
      {
        background: silver;/*背景色をシルバーに*/
        text-decoration: none;/*下線を消す*/
      }
      .banner a:visited
      {
        color:#FA8072;
      }
      .banner_line
      {
        width: 80%;
      }
      .intro1
      {
        margin-left:8%;
        margin-top: 5%;
        font-weight: bold;
      }
      .intro2
      {
        color: #A0522D;
        border:dotted 2px #A0522D;
        margin-left:10%;
        margin-right:10%;
        margin-bottom:10%;
        padding-left:1%;
        padding-bottom:1%\;
      }
      .news
      {
        color: #A0522D;
        border:dotted 2px #A0522D;
        margin-left:10%;
        margin-right:10%;
        margin-bottom:10%;
        padding-left:1%;
        padding-bottom:1%;
      }
      .topimg
      {
        text-align:center
      }
      .Copyright
      {
        color:black;
        font-size: 80%;
        text-align:center;
      }
      .midashi
      {
        text-align: center;
      }
      .contact
      {
        position: relative;
        left:5%;
        margin-top: 2.5%;
        margin-bottom: 5%;      
      }
      form
      {
        position: relative;
        left:5%;
        padding-bottom: 10%;
      }
      textarea
      {
        resize: none;
        width: 50%;
        height: 100px;
      }
      .labe input
      {
        resize: none;
        width: 50%;
      }
      .lesson
      {
        position: relative;
        left:5%;
        margin-bottom: 2.5%;
        margin-top:2.5%;
      }
      .explain
      {
        position: relative;
        left:5%;
        padding-bottom: 10%;
      }
      .midashi2
      {
        position: relative;
        left:5%;
        margin-top:2.5%;
      }
      .map
      {
        position: relative;
        left:10%;
      }
      .access
      {
        position: relative;
        left:5%;
        padding-bottom: 10%;
      }
      .access ul
      {
        list-style-type: none;
      }
      .profile
      {
        position: relative;
        left:5%;
        padding-bottom: 10%;
        margin-top:2.5%;

      }
      .profile ul
      {
        list-style: none;        
      }
      .QA
      {
        position: relative;
        left:5%;
        padding-bottom: 10%;
        margin-top:2.5%;
      }
      ul
      {
        list-style-type: none;
      }
      .introduce_img
      {
        position: relative;
        left:10%;
        margin-top:2.5%;
      }
    }