@charset "UTF-8";
@media screen and (max-width:480px)  {
  #headerarea,#navi,#navi UL,#opus,#atelier,#landscape,#footer,#landscape,.atelier-info{
  clear: both;
}
#main,#navi,#navi UL LI,#opus,#atelier,#headerarea,.headerarea-box,.headerarea-box2,.headerarea-box3,#landscape,.atelier-info{
  width:100%;
}
#headerarea{
  height: 30px;
  background-color: transparent;
  background: 0% 0% / auto auto scroll padding-box border-box;
}
#navi,#atelier H4{
  font-size: 16px;
}
#navi,#opus,#topic,#brand,#atelier,#footer,#landscape{
  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 : repeat-y;background-attachment : scroll;background-position : center center;background-size : auto auto;background-origin : padding-box;background-clip : border-box;
	
}

           	.headerarea-box{
	
	margin-top: 20px;
	
}

	
            .atelier-info{
                 
                             font-size: 14px;
} 
section table{
	width: 100%;
} section th, section td{
	padding: 10px; border: 1px solid #ddd;
}
section th{
	background: #f4f4f4;
}
 
/*----------------------------------------------------
    .atelier-info
----------------------------------------------------*/
.atelier-info th{
	width: 30%; text-align: left;
}
 
.atelier-info{
	margin: 0 -10px;
}
    .atelier-info th,
    .atelier-info td{
        width: 100%;
        display: block;
        border-top: none;
    }
    .atelier-info tr:first-child th{
	border-top: 1px solid #ddd;
}
}