@charset "UTF-8";
@media screen and (max-width:768px)  {

#headerarea,#navi,#navi UL,#topic,#brand,#atelie{
	clear: both;
 }

#main,#navi,#navi ul li,#opus,#topic,#brand,#atelier,#headerarea,
.headerarea-box,.headerarea-box2,.headerarea-box3,.topic-wrap,.topic-ul{
           width:100%;
}
	#headerarea{
	
	height: 30px;
	
	background-color: transparent;
	
	background: url() 0% 0% / auto auto repeat scroll padding-box border-box;
	
}
	#navi,#topic,#brand H3,#atelier H4,#atelie P,#brand P,.topic-li{
	
	font-size: 16px;
	
}
	#navi,#opus,#topic,#brand,#atelie{
	
	padding: 0px;
	
	margin: 5px;
	
}
img{
	max-width: 100%;
height: auto;
}
#counter{
	display: none;
}
	#navi UL LI{
	

    margin-left : auto;
    margin-right : auto;
  margin : 10px;margin-bottom : 10px;
    font-weight : bold;
  
  
  
    width : auto;
    display : block;
  
    height : 40px;
  
    padding-left : 15px;
    padding-right : 5px;
  
  
  
  }	
	#navi UL{
	
	padding-right : 0px;
	

    padding-left : 0px;
  }
	body{
	
	background: url(/image/material/backgraunda.jpg") center center no-repeat;
	
}
}