@charset "UTF-8";
@media screen and (max-width:480px)  {
  #headerarea,#navi,#navi UL,#form,#form ul{
  clear: both;
}
#main,#navi,#navi UL LI,#opus,#headerarea,
.headerarea-box,.headerarea-box2,.headerarea-box3,.topic-wrap,.topic-ul{
  width:100%;
}
#headerarea{
  height: 30px;
  background-color: transparent;
  background: 0% 0% / auto auto scroll padding-box border-box;
}
#navi,#topic,#brand H3,#atelier H4,#atelie P,#brand P,.topic-li,#form{
  font-size: 16px;
}
#navi,#opus,#topic,#brand,#atelie,#footer{
  padding: 0px;
  margin: 10px;
}
IMG{
  max-width: 100%;
  height: auto;
}
#counter{
  display: none;
}
#navi UL LI{
  padding-top: 10px;
}
#navi UL{
  padding-right: 30px;
}
	BODY{
	
	background-color: transparent;
	
	background-image : url(../../image/material/smart.gif);background-repeat : no-repeat;background-attachment : scroll;background-position : center center;background-size : auto auto;background-origin : padding-box;background-clip : border-box;
	
}
#form,#form UL,#fome li,#form LABEL,#form li span,#form li span label,#form p{
 width : 100%;
    }
	

 INPUT.field,#contact TEXTAREA,#TEXTAREA message,#form textarea{

        width : 100%;
}

#form li{

width:90%;

}
}