@charset "UTF-8";

@media screen and (max-device-width:400px), screen and (max-width:640px) {

body {
  font-size:16px;
  line-height:1.2;
}

/* common.css */

ul.common.posts {
  width:auto;
  padding:20px;
}

ul.common.posts li {
  width:100%;
}

ul.common.posts li a div.img {
  width:100%;
  height:auto;
}

ul.common.posts li p span.title {
  font-size:100%;
}

ul.common.posts li p span.date {
  font-size:100%;
}

ul.common.posts li p span.category {
  font-size:100%;
}

header.common div.bar {
  font-size:50%;
  text-align:center;
}

header.common div.logo {
  float:none;
  text-align:center;
}

header.common nav {
}
 
div.common.mv {
  display:none;
}

footer.common div.buttons a img {
  margin-bottom:20px;
}

footer.common section.contact {
  width:auto;
  padding:20px;
}

footer.common section.contact h2 {
  font-size:100%;
}

footer.common section.contact p {
  font-size:75%;
}


footer.common section.bottom nav a p {
  display:block;
  margin-bottom:10px;
  border-right:0;
}


div.pagetop {
  bottom:25px;
  right:25px;
  width:75px;
  height:75px;
}






/* home.css */

main.home {
  background:none;
  padding:0 20px;
}

main.home::before {
  background:url("../img/media/base_mv.jpg");
  background-size:100% auto;
  display:block;
  position:fixed;
  top:77px;
  left:0;
  width:100%;
  height:100%;
  padding-bottom:108px;
  content:"";
  z-index:-1;
}

main.home section {
  margin-top:20px;
  margin-bottom:40px;
}

main.home section h1 {
  font-size:30px;
}

main.home section h2 {
  font-size:100%;
}
main.home section p {
  font-size:75%;
}

main.home section a.c_morebutton {
  width:75%;
}

main.home wrap1 {
  width:auto;
}

main.home div.wrap1 div.wrap2 {
  width:auto;
}

main.home div.wrap1 div.wrap2 div.left,
main.home div.wrap1 div.wrap2 div.right {
  float:none;
  width:auto;
}



main.home div.wrap1.introduction {
  background:none;
}

main.home section.introduction {
  box-sizing:border-box;
  width:auto;
  margin-top:440px;
  padding:15px;
}

main.home section.introduction p {
}



main.home div.wrap1.service {
  background:none;
}

main.home section.service {
  box-sizing:border-box;
  padding:20px;
  width:auto;
}

main.home section.service ul li {
  clear:left;
  float:none;
  width:100%;
  margin:0;
}

main.home section.service ul li a img {
  float:left;
  margin-right:15px;
  width:50%;
}

main.home section.service ul li a p {
  padding-top:50px;
  font-size:100%;
  text-align:left;
}



main.home div.wrap1.works {
  background:none;
}



main.home section.news {
  box-sizing:border-box;
  margin-top:20px;
  margin-bottom:40px;
  padding:20px;
}

main.home section.news ul {
  width:auto;
  border-top:dotted #000 1px;
}

main.home section.news ul li {
  border-bottom:dotted #000 1px;
}

main.home section.news ul li a {
  font-size:75%;
}

main.home section.news ul li a span.date {
  width:auto;
  margin-right:10px;
}

main.home section.news ul li a span.title {
  width:auto;
}



main.home div.wrap1.shopmaterial {
  background:none;
}

main.home section.shop,
main.home section.material {
  width:auto;
  padding:20px;
}

main.home section.shop a.recent,
main.home section.material a.recent {
  height:200px;
}








 
/* page.css */

header.page h1 p.en,
header.page h1 p.ja {
  margin:5px 0;
}

header.page div.breadcrumb {
  margin:15px;
  width:auto;
}


header.shop {
  width:100%;
}

header.shop nav {
  box-sizing:border-box;
  overflow:hidden;
  width:100%;
  height:auto;
  padding:10px;
}

header.shop nav ul {
  box-sizing:border-box;
  overflow:hidden;
  width:auto;
  text-align:center;
}

header.shop nav ul li {
  float:none;
  display:inline-block;
  width:auto;
  height:auto;
}

header.shop nav ul li a {
  width:100%;
  height:auto;
  line-height:1.5em;
  margin-bottom:10px;
  padding:0 10px;
  border:none;
  border-right:solid #000 1px;
}

header.shop nav ul li:last-child a {
  border-right:none;
}


header.material h1 img {
  width:90%;
}

header.material nav {
  padding:10px;
}

header.material nav ul {
  box-sizing:border-box;
  overflow:hidden;
  width:100%;
  height:auto;
  text-align:center;
}

header.material nav ul li {
  float:none;
  display:inline-block;
  width:auto;
  height:auto;
}

header.material nav ul li a {
  width:100%;
  height:auto;
  line-height:1.5em;
  margin-bottom:10px;
  border:none;
  border-right:solid #000 1px;;
  padding:0 10px;
}

header.material nav ul li:last-child a{
  border-right:none;
}


main.page_common section div.box table tr td:first-child {
  padding-right:2%;
}

main.page_common,
main.works,
main.news,
main.material,
main.shop section.posts {
  box-sizing:border-box;
  width:100%;
  padding:10px;
}

main.shop.page {
  box-sizing:border-box;
  width:100%;
  padding:10px;
}

main.shop.page div.left,
main.shop.page div.right {
  float:none;
  width:100%;
}

main.material section.left,
main.material section.posts {
  width:100%;
}

main.material aside {
  float:none;
  width:100%;
}


main.news section.posts {
  float:none;
  width:100%;
}
  
main.news aside {
  float:none;
  width:100%;
}



main.service section.section1 ul li img {
  float:none;
  width:100%;
}

main.service section.section1 ul li div {
  float:none;
  width:100%;
}

main.service section.section1 ul li h3 {
  margin:15px;
}

main.works_detail section.image div.mainimage div.center {
  box-sizing:border-box;
  max-width:100%;
  padding:15px;
}

main.works_detail section.image div.mainimage div.left {
  left:5px;
  padding:24px 8px;
  border-radius:5px;
  font-size:125%;
  background-color:rgba(255,255,255,0.5);
}

main.works_detail section.image div.mainimage div.right {
  right:5px;
  padding:24px 8px;
  border-radius:5px;
  font-size:125%;
  background-color:rgba(255,255,255,0.5);
}

main.works_detail section.info p {
  width:auto;
}

main.works_detail section.info hr {
  width:auto;
}



}