#main,
#exhibitor {width: 100%; font-size: 13px;}
#secondary,
#intro {width: 100%;}

#mainLead,
#secondary,
#exhibitor {background: #f7f7f7;}

#first,
#mainLead p,
.wrap,
#exhibition,
#project,
#exhibitor ul,
.share {width: 880px; margin: 0 auto; padding: 30px 0; position: relative; clear: both;}

#first {padding: 10px 0;}

/* reset foundmuji.css */
#main {float: none; }
.content {width: 100%; padding: 0;}
.lead {font-size: 14px;}
#mainLead p.lead.next {padding-top: 0;}
#mainLead p.time {font-size: 18px; padding-top: 0;}
#mainLead p .note {font-size: 14px;}
#mainLead p .note.annotation {color: #999;}
h1#foundMUJILogo.b img {width: 150px; height: 200px; position: absolute; left: 30px; z-index: 100;}
body#index .first article {margin-bottom: 0;}
body#item h1#foundMUJILogo.b {top: 30px; left: 30px;}


/* intro */
#intro {position: relative; margin-top: 20px;}
#intro h1 {margin-left: 25px;}
#intro p {text-align: center; font-size: 15px; padding-top: 40px;}
#intro img {display: block; margin: 0 auto;}

/* itemList */
#itemList .wrap h1 {font-size: 16px; text-align: right; margin-bottom: 10px;}
#secondary aside, #secondary aside#aoyama h1 {padding: 0;}
#itemList img {width: 263px; height: auto;}
#container {clear: both; width: 100%; padding: 0; margin: 0 -30px 0 0; letter-spacing: -.60em;}
.box { margin: 0 30px 60px 0; padding: 0; letter-spacing: normal;}
#container .box img { display: block; width: 263px; height: auto;}
.col1 {width: 263px;}
#container a .box:hover,
#item aside a:hover {
	-webkit-transition: all .2s ease;
  -moz-transition: all .2s ease;
  -o-transition: all .2s ease;
  transition: all .2s ease;
  filter:alpha(opacity=80);
	opacity:0.8;}
#itemList .box span {background: #000;}

#exhibitor h1 {background: none; text-indent: 0; margin: 0 0 8px; height: auto; font-weight: bold;}
#exhibitor li {display: inline-block; width: 152px; margin-right: 20px; line-height: 2;}

#exhibition h1 .date {margin-left: 20px;}
#exhibition img,
#project img {width: 430px; height: 250px; margin-bottom: 10px;}
#exhibition img.first,
#project img.first {margin-right: 20px; float: left;}
#project {border-top: 1px solid #ddd;}
#exhibition .linkAoyama a {background: url(/img/common/arrow_right.png) no-repeat 2px center; padding-left: 10px;}
#exhibition .linkAoyama {text-align: right;}

#secondary aside#about {width: 600px; float: left; margin-right: 20px;}
#secondary aside#aoyama {width: 220px; float: right;}

#itemList .wrap > h1,
#exhibition h1,
#project h1 {text-align: left; font-size: 20px; margin-bottom: 10px;}
#itemList .wrap > h1 {margin-bottom: 40px;}
.share {padding-bottom: 0;}
.share .shareButton li {float: left;}
#about h1 {background: none; height: auto; text-indent: 0; margin: 6px 0 20px;}

/* item page */
#item h1#foundMUJILogo.b img {width: 105px; height: auto;}
#item .content {margin-top: 20px;}
#item .profile {margin: 20px 0; padding: 20px 0; clear: both;}
#item .profile h2 {font-size: 13px; margin-bottom: 10px; font-weight: bold;}
#item .profile h2 .subName {font-size: 11px; margin-bottom: 10px; font-weight: normal; margin-left: 20px;}
#item h2 {font-size: 20px; margin-bottom: 10px;}
#item aside {clear: both;}
#item .lead {width: 640px; margin-right: 40px; float: left; min-height: 100px;}
#item .itemSIze {font: 12px/1.4 "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;}

#item #itemImg {margin: 70px 0 20px 0;}
#item img.mainImg {width: 510px; height: 500px; float: left; margin-right: 20px;}
#item .subImg {padding: 0;}
#item img.secondImg {width: 350px; height: 240px; margin: 0 0 15px 0;}
#item img.thirdImg {width: 350px; height: 240px; margin: 0;}

.btn a {background: #333; color: #fff; font-weight: bold; padding: 2px 5px; display: inline-block; cursor: pointer; text-decoration: none; border-radius: 5px;}
.btn a:hover {background: #7f0019; color: #fff;}
#item .btn a {text-align: center; padding: 20px 10px; width: 180px; font-size: 15px;}

#item .disabled .btn {margin-bottom: 10px;}
.disabled .btn a {background: #ccc; cursor: default !important; pointer-events: none; background: #ccc;}
.disabled .btn a:hover {background: #ccc;}
.disabled .note {display: inline-block; width: 200px; margin-top: 10px;}

#item aside .wrap h1 {font-size: 15px; margin-bottom: 10px;}
#item aside .wrap {padding-bottom: 0; border-top: 1px solid #ddd;}
#item aside .wrap ul {margin-right: -20px; letter-spacing: -.40em;}
#item aside .wrap li {display: inline-block; margin: 0 20px 20px 0; vertical-align: top; letter-spacing: normal; background: #000;}
#item aside .wrap img {width: 160px; height: auto;}

.bx-pager {display: none;}
.bx-wrapper {margin-bottom: 40px;}
.bx-controls-direction a {width: 34px; height: 70px; margin: -13px 0 0; display: block; background: url(/img/foundmuji/flea/arrow.png) no-repeat 0 0; position: absolute; cursor: pointer; text-indent: -9999px;}
a.bx-prev {background-position: 0 9px; left: 0; opacity: 0.5; filter: alpha(opacity=50); -ms-filter: "alpha( opacity=50 )"; margin-left: 30px; margin-top: -200px;}
a.bx-next {background-position: -34px 9px; right: 0; opacity: 0.5; filter: alpha(opacity=50); -ms-filter: "alpha( opacity=50 )"; margin-right: 30px; margin-top: -200px;}
.bx-controls-direction a:hover {opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha( opacity=100 )";}
#slider2 {width: 700px;}
#slider2 img {width: 700px; height: 400px;}

@media only screen and (max-width : 767px){
#first,
#mainLead p,
.wrap,
#exhibition,
#project,
#exhibitor ul,
#secondary,
#intro,
.share {width: 95%; margin: 0 auto; padding: 10px;}
#exhibitor li {width: auto;}
#container {margin: 0; letter-spacing: normal;}
#slider2 img {width: 250px; height: auto;}
.col1,
#container .box img {width: 300px;}
.box { margin: 0 0 60px 0;}
#exhibition img, 
#project img {width: 1%; height: auto; margin-bottom: 10px;}
#exhibition img.first,
#project img.first {margin-right: 0; float: none;}
#secondary aside#about {width: 100%; float: none; margin-right: 0;}
#secondary aside#aoyama {width: 220px; float: none; margin: 0 auto;}

#item .content {margin-top: 0;}
#item #itemImg {margin-top: 40px;}
#item img.mainImg {width: 100%; height: auto; float: none; margin: 0 0 20px 0;}
#item img.secondImg,
#item img.thirdImg {width: 100%; height: auto; margin-bottom: 20px;}
#item .lead {width: 100%; margin-right: 0; float: none; min-height: 20px;}
#item .btn {display: inline; width: 200px; margin: 40px auto;}
.disabled,
.available {text-align: center;}
#item aside .wrap { padding: 10px 20px;}
#item aside .wrap img {width: 132px; height: auto;}

a.bx-prev,
a.bx-next {margin-top: -50px;}

h1#foundMUJILogo.b img,
#item h1#foundMUJILogo.b img {width: 80px; height: auto; position: absolute; left: 20px; z-index: 100;}
.bx-controls {display: none;}
.time .title {display: block;}
}