@charset "utf-8";

/*leyout------------------------*/


#containerInnter{
  width:960px;
  margin:0 auto;
  padding-top:180px;
 }

p{font-size:13px;}

h2{
  width:230px;
  height:65px;
  text-indent:100%;
  white-space:nowrap;
  overflow:hidden; 
  background:url(../img/about.png) no-repeat;
}


#wrapper{
  width:875px;
  height:450px;
  margin:20px auto;
  overflow:hidden;
  }
#navi{
  width:340px;
  float:left;
  }
 #navi ul{
  height:390px;
  overflow:hidden;
}
#navi ul li{
  width:160px;
  margin:5px;
  float:left;
}
/*#navi ul li img{
  border:3px solid #fff;
}*/
#main{
  float:left;
  margin:5px 5px 5px 10px ;
}
#main img{
  position:absolute;
}
#box{
    width:960px;
overflow:hidden;
}

#address{
margin:0 0 0 40px;
width:300px;
float:left;
}

#address h3{ 
    width:250px;
    height:50px;
    margin-bottom:10px;
    text-indent:100%;
    white-space:nowrap;
    overflow:hidden; 
    background:url(../img/about_logo.png) no-repeat;
}

h4{
  font-size: 15px;
  color: #555;
  padding-top:10px;
}

#address p{
    line-height: 1.5;
    font-size: 14px;
    margin:10px;
    margin-left:2em;
    text-indent:-1em;
    color: #555;
}
#character{
    float:left;
    margin-top:20px;
}


/*タブレット部分のスタイル  ーーーーーーーーーーーーーーーーーーーーーーー*/
@media screen and (max-width:959px){
#containerInnter{
  width:640px;
}
#wrapper{
  width:640px;
  margin-left:10px;
  }
#navi{
  width:640px;
    height:90px;
  }
#navi ul li{
  width:100px;
  margin:2px;
  float:left;
}
#navi ul li img{
  width:100px;
}   
    
#main{
  float:left;
}
#main img{
  margin-left:45px;
    height:500px;   
} 
#box{
    margin:0 auto;
    width:640px;
    margin-top:200px;}
    
#address{
margin:0 auto;
float:none;
}
#character{width:640px;
}  
}

    
/*スマホ部分のスタイル  ーーーーーーーーーーーーーーーーーーーーーーー*/
@media screen and (max-width:639px){
#containerInnter{
  width:320px;
}
    #wrapper{
  width:320px;
  margin-left:10px;
  }
#navi{
  width:320px;
    height:90px;
  }
 
#main{
  float:left;
}
#main img{
    height:300px; 
    margin:80px 0 0 -20px;
} 
#box{
    margin:0 auto;
    width:320px;
    margin-top:80px;}
    
#address{
margin:0 auto;
float:none;
}
#character img{width:320px;
       -moz-background-size:50% 50%;
   background-size:50% 50%;  
}  
}