@charset "utf-8";

/* #labtop */
#labtop .content {padding-top: 0;}
#labtop .content h1 {float: left;padding-top: 30px;}
#labtop .share {float: right;margin-top: 20px;}
#labtop .share li {overflow: hidden;}
#labtop .share .tw {width: 130px;}
#labtop .share .fb {width: 115px;}
p.lead {clear: both;float: left;padding: 15px 0 20px 0;font-size: 14px;line-height: 1.6;}

.formLink {float: right;width: 264px;padding: 15px 0 30px 0;}
.formLink p {font-size: 11px;line-height: 1.6;}
.formLink a {display: block;float: left;width: 100px;height: 40px;margin-top: 2px;margin-right: 10px;background: url(//www.muji.net/img/lab/global/img/formlink.gif) no-repeat 0 0;font-size: 1px; line-height: 1px;text-indent: -9999px; overflow:hidden; outline:none;}
.formLink a:hover {background: url(//www.muji.net/img/lab/global/img/formlink.gif) no-repeat 0 -40px;}

/* */
.kom {height: 216px;}
.kom ul {margin: 0 20px;padding: 15px 0 0 0;}
.kom ul a {text-decoration: none;}

.kom li.cat {padding-top: 8px;color: #CCC;font-size: 11px;}
.kom li.cat .date {color: #B8B9B3;}
.kom li.cat.new .date {color: #F60;}
.kom li.cat a {color: #999;}
.kom li.cat a:hover, #list_column .itemList li a:hover,
#list_column h2 a:hover, #list_goiken h2 a:hover {color: #7F0019;}

.clmArea, .more {margin: 0 auto;width: 920px;}
.clmArea li.dat a {display: block;height: 200px;overflow: hidden;}
.clmArea li.dat a span {display: block;overflow: hidden;}

/*.colum li.dat a span,*/
.colum li.dat a .image {float: left;}
.colum li.dat a .title, .colum li.dat a .text, .colum li.dat a .date {float: right; width: 340px; padding-bottom: 5px;}
.colum li.dat a .title {font-size: 18px; font-weight: bold;}
.colum li.dat a .text {font-size: 14px;}
.colum li.dat a .date {color: #999;}

.colum li.dat a .image,
.itemList li a span.image,
#topFooter li#contentBanner a,
.top_colum li.dat {background: #000;}

.colum li.dat a:hover span.image img,
.itemList li a:hover span.image img,
#topFooter li#contentBanner a:hover img,
.top_colum li.dat a:hover {filter: alpha(opacity=90);-moz-opacity:0.9;opacity:0.9;}

.itemList li a:link img,
.itemList li a:visited img { border: 1px solid #fff;}
.itemList li a:hover img,
.itemList li a:active img { border: 1px solid #fff;}

.itemList {margin-top: 20px; margin-left: 20px;}
.itemList ul {letter-spacing: -.40em;}
.itemList li {
display: -moz-inline-box; /* Firefox2 */
display: inline-block;
*display: inline; *zoom: 1; /* IE6, IE7 */
width: 155px; padding: 15px 0 10px; margin-right: 25px; vertical-align: top; letter-spacing: normal; text-align: center;}
.itemList a {text-decoration: none;}
.itemList a span {text-align: left; display: block;}
.itemList a span.date {margin-top: 5px;}


#list_column .itemList {margin-top: 0; margin-bottom: 30px;}


#top_banner {background-color: #F8F8F6; left: 0; min-width: 910px; overflow: hidden; padding: 30px 0; width: 100%; margin-bottom: 35px;}

#top_banner .text {font-size: 11px;}
#top_banner .title {font-size: 15px;}

#top_banner .top_colum {width: 512px; float: left;}
#top_banner .top_colum ul {padding-top: 15px;}
#top_banner .top_colum .cat {padding-top: 8px;}
#top_banner .top_colum .dat {position: relative;}
#top_banner .top_colum .columLead {position: absolute; left: 0; bottom: 0; padding: 10px; background-color: rgba(0, 0, 0, 0.5); color: #fff;}
#top_banner .top_colum .dat .title {font-size: 15px; font-weight: bold;}


#top_banner .top_goiken {width: 348px; float: right;}
#top_banner .top_goiken .kom {height: auto;}
#top_banner .top_goiken .kom ul {margin: 0;}
#top_banner .top_goiken .kom1 {width: 144px;}
#top_banner .top_goiken li.kom1 {margin: 0 15px;}

#top_banner_mask {margin: 0 auto; overflow: hidden; width: 880px;}

#top_banner h2 {color: #B8B9B3; font-size: 12px; font-weight: bold; border-top: 1px solid #E1E1DF; padding-top: 8px;}


#list_column h2,
#list_goiken h2 {
    border-top: 1px solid #E1E1DF;
    font-size: 18px;
    font-weight: bold;
    margin: 0 0 8px;
    padding: 12px 15px 0;
    position: relative;
}

#list_column h2 a,
#list_goiken h2 a {
    color: #999999;
    font-size: 12px;
    font-weight: bold;
    position: absolute;
    right: 15px;
    top: 15px;
    text-decoration: none;
}


.kom {float: left;height: 260px;}
.kom1 {width: 184px;}
.kom2 {width: 368px;}
.kom3 {width: 552px;}


.clmArea li.dat a span,
#top_banner li.dat a span {display: block;overflow: hidden;}
#top_banner li.dat a span.type {display: inline-block;}
.clmArea li.dat a,
#top_banner li.dat a {position: relative;display: block;height: 200px;overflow: hidden;background: #000;}


.kom1 li.dat a {width: 144px;}
.kom2 li.dat a {width: 328px;}
.kom3 li.dat a {width: 512px;}

.goiken li.dat a .no {position: absolute;top: 8px;left: 10px;color: #999;font-size: 10px;}
.goiken li.dat a .data {height: 140px;padding: 60px 10px 0 10px;font-weight: bold;}
.goiken li.dat a .type {position: relative;top: -28px;left: 11px;background: #333; color: #fff; font-weight: bold; padding: 2px 4px; display: inline-block; cursor: pointer; text-decoration: none;
-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-size: 10px; text-align: center;}

.type1 li.dat a .data {background: url(//www.muji.net/img/lab/img/type1bg.png);}
.type2 li.dat a .data {background: url(//www.muji.net/img/lab/img/type2bg.png);}
.type3 li.dat a .data {background: url(//www.muji.net/img/lab/img/type3bg.png);}
.type4 li.dat a .data {background: url(//www.muji.net/img/lab/img/type4bg.png);}

.type1 .type:before {content: "商品完成";}
.type2 .type:before {content: "开发中";}
.type3 .type:before {content: "研讨中";}
.type4 .type:before {content: "报告";}

.clmArea ul li a, .top_goiken ul li a {color: #000;}
.clmArea li.dat a:hover span.data, .top_goiken li.dat a:hover span.data {filter: alpha(opacity=90);-moz-opacity:0.9;opacity:0.9;}

/* topFooter */
#topFooter {padding-top: 20px;}
#topFooter li {float: left; width: 154px;}
#topFooter li#contentBanner {float: right; width: 572px;}
#topFooter li#contentBanner ul {width: 572px;}
#topFooter li#contentBanner ul li {display: inline-block; vertical-align: top; width: 274px;}
#topFooter li#contentBanner ul li.fitness80 {margin-right: 20px;}
#topFooter li#contentBanner img {border: 1px solid #ccc; width: 272px;}

#topFooter li ul {padding: 13px 0 20px 0; margin-right: 44px; border-top: 1px solid #E6E6E6;}
#topFooter li li {float: none;padding-top: 7px;font-size: 11px;}
#topFooter li.ttl {padding-bottom: 7px;font-weight: bold;}
#topFooter a {display: block;text-decoration: none;}


/* --------------------------------
clearfix
-------------------------------- */
.clm,
#list_goiken {zoom:1;}

.clm:after,
#list_goiken:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
* html .clm {height:1%;}