@charset "utf-8";

/* RESET */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{*font-size:100%;}
/* RESET HTML5 */
article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;font:inherit;vertical-align:baseline;}
/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}


/* IE6 PNG FIX */
p#tagline a,
#main header h1,
#main header h2,
#myMUJI h1,
#myMUJI p,
#productSearch h1,
img {_behavior: url(/css/iepngfix.htc);}
#productSearch h1 {_zoom: 1;}


/* FLOAT CLEAR */

.systemInformation ul,
#pageHeader,
.content,
#SNS,
#SNS ul,
#bannerMujiPassport,
#satelite ul,
#misc ul,
#footerNav {zoom: 1;}
.systemInformation ul:after,
#pageHeader:after,
.content:after,
#SNS:after,
#SNS ul:after,
#bannerMujiPassport:after,
#satelite ul:after,
#misc ul:after,
#footerNav:after {content: ""; display: block; clear: both;}


/* GENERAL */
body {color:#333; font: 12px/1.5 "Helvetica","Lucida Grande","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;}
a {text-decoration: none;}
a:link, a:visited {color:#333;}
a:active, a:hover {color:#7F0019;}
a img {vertical-align: bottom;}


/* SYSTEM INFORMATION */

.systemInformation {width: 850px; background:#f3f3f3; margin: 0 auto 15px; padding:10px 15px 2px;}
.systemInformation dt {font-weight: bold; margin-bottom: 10px; margin-right: 10px; font-size: 12px;}
.systemInformation dd {font-size: 12px; line-height: 1.5em; margin-top: -2.4em; padding: 0 0 0 19em;}
.systemInformation p {margin-bottom: 10px;}
.systemInformation li {float: left; margin-right: 15px;}
.systemInformation a {text-decoration: underline; font-weight: bold;}


/* GLOBAL NAVIGATION */

#globalNav {width: 880px; margin: 0 auto; position: relative; z-index: 1;}
#globalNav ul {position: absolute; top: 4px; _top: 8px; right: 10px;}
#globalNav li {float: left; margin-left: 13px; font-size: 10px; font-weight: bold; line-height: 10px; margin-top: 4px;}
#globalNav #gnHome a {color: #888;}
#globalNav #gnGS {_margin-top: 0; _padding: 3px 5px; font-weight: normal;}
#globalNav ul.w a {color: #fff;}
#globalNav ul.b a {color: #333;}
#globalNav ul.w #gnGS {_border: 1px solid #fff;}
#globalNav ul.b #gnGS {_border: 1px solid #666;}

#globalNav li a {text-indent: -9999px; height: 18px; background-image: url(/portal/img/sprite.png); background-repeat: none; overflow: hidden; display: block; padding: 0 2px;}
#globalNav li a {_text-indent: 0; _height: auto; _background-image: none; _display: inline; _width: auto !important;}

#globalNav #gnHome a {width: 28px; background-position: 0 -40px;}
#globalNav #gnStore a {width: 50px;}
#globalNav #gnShop a {width: 38px;}
#globalNav #gnLab a {width: 86px;}
#globalNav #gnMymuji a {width: 40px;}
#globalNav #gnContact a {width: 62px;}
#globalNav #gnGS a {width: 59px;}

#globalNav ul.b #gnStore a {background-position: -47px 0;}
#globalNav ul.b #gnShop a {background-position: -116px 0;}
#globalNav ul.b #gnLab a {background-position: -173px 0;}
#globalNav ul.b #gnMymuji a {background-position: -278px 0;}
#globalNav ul.b #gnContact a {background-position: -333px 0;}
#globalNav ul.b #gnGS a {background-position: -410px 0;}

#globalNav ul.w #gnStore a {background-position: -47px -20px;}
#globalNav ul.w #gnShop a {background-position: -116px -20px;}
#globalNav ul.w #gnLab a {background-position: -173px -20px;}
#globalNav ul.w #gnMymuji a {background-position: -278px -20px;}
#globalNav ul.w #gnContact a {background-position: -333px -20px;}
#globalNav ul.w #gnGS a {background-position: -410px -20px;}

#globalNav ul #gnStore a:hover {background-position: -47px -40px;}
#globalNav ul #gnShop a:hover {background-position: -116px -40px;}
#globalNav ul #gnLab a:hover {background-position: -173px -40px;}
#globalNav ul #gnMymuji a:hover {background-position: -278px -40px;}
#globalNav ul #gnContact a:hover {background-position: -333px -40px;}
#globalNav ul #gnGS a:hover {background-position: -410px -40px;}
#globalNav ul.b #gnGS a:hover {background-position: -410px -60px;}


/* MAIN VISUAL */

#mainvisual {position: relative; width: 880px; height: 370px; margin: 0 auto;}
#mvPanel li {position: absolute; top:0; left:0; display: none;}
#mvPanel li.active, #mvPanel li:first-child {display: block;}
#mvThumbnail{position: absolute; right:11px; bottom: 16px;}
#mvThumbnail li {float: left; margin-right: 5px; border: 1px solid #fff; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;}
#mvThumbnail li a{background: #000; display: block;}
#mvThumbnail li.active img {-ms-filter: "alpha( opacity=80 )"; filter: alpha( opacity=80 ); opacity: 0.8;}
#mainvisual li img {vertical-align: bottom;}


/* HEADER */

#pageHeader {width: 880px; margin: 0 auto; padding: 10px 10px 15px;}
#pageHeader h1 {float: left;}
p#tagline {float: right;}
p#tagline a {display: block; width: 145px; height: 32px; background-image: url(/portal/img/sprite.png); background-repeat: no-repeat; background-position: 0 -100px; text-indent: -9999px; overflow: hidden;}
p#tagline a:hover {background-position: 0 -136px;}


/* CONTENT */

.content {width: 880px; margin: 0 auto;}


/* MAIN */

#main {float: left; width: 700px;}

#netstore,
#shop,
#lab {float: left; border-top: 1px solid #666; width: 220px; margin: 0 20px 25px 0; padding-top: 5px;}
#lab {margin-right: 0;}
#main header a {display: block;}
#main header h1 {background-image: url(/portal/img/sprite.png); text-indent: -9999px; margin: 5px 0 0; height: 20px; overflow: hidden;}
#main #netstore h1 {background-position: 0 -200px;}
#main #shop h1 {background-position: -220px -200px;}
#main #lab h1 {background-position: -440px -200px;}
#main #netstore a:hover h1 {background-position: 0 -220px;}
#main #shop a:hover h1 {background-position: -220px -220px;}
#main #lab a:hover h1 {background-position: -440px -220px;}
#main header h2 {display: block; background-image: url(/portal/img/sprite.png); background-repeat: no-repeat; padding-bottom: 15px; border-bottom: 1px solid #e8e8e8; text-indent: -9999px; margin-top: -20px; height: 120px; overflow: hidden;}
#main #netstore header h2 {background-position: 0px -240px;}
#main #shop header h2 {background-position: -220px -240px;}
#main #lab header h2 {background-position: -440px -240px;}
#main header time {color: #999; font-weight: bold; font-size: 10px; margin: 5px 0; display: block;}
#main article li a {padding-left: 50px; margin-bottom: 15px; *zoom: 1; position: relative; min-height: 40px; _height: 40px; vertical-align:bottom; display: block;}
#main article li a:after {width: 42px; height: 42px; background:#000; position: absolute; content:" "; top: 0; left: 0; z-index:-1;}
#main article li img {margin-left: -50px; float: left; border: 1px solid #ccc;
	-webkit-transition: all .2s ease;
	   -moz-transition: all .2s ease;  
	     -o-transition: all .2s ease;  
	        transition: all .2s ease; 
}
#main article li a:hover img {
	filter: alpha(opacity=80); opacity:0.8;
	-webkit-transition: 0;
	   -moz-transition: 0;
		 -o-transition: 0;
			transition: 0;
}


/* SNS */
#SNS {margin-top: 25px auto 0; width: 880px; }
#SNS ul {float: right; margin: 5px 0 5px 5px; padding-left: 3px;}
#SNS li {float: left;}
#SNS li a {padding: 5px; display: block;
	-webkit-transition: all .2s ease;
	   -moz-transition: all .2s ease;
	     -o-transition: all .2s ease;
	        transition: all .2s ease;
	}
#SNS li a:hover {background: #e6e6e6; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}

/* bannerMujiPassport */
#bannerMujiPassport {clear: both;}
#bannerMujiPassport a {display: block; background:#000;}
#bannerMujiPassport img {border: 1px solid #ccc; vertical-align: bottom;
	-webkit-transition: all .2s ease;
	   -moz-transition: all .2s ease;
	     -o-transition: all .2s ease;
	        transition: all .2s ease;
}
#bannerMujiPassport a:hover img {
	filter: alpha(opacity=80); opacity:0.8;
	-webkit-transition: 0;
	   -moz-transition: 0;
		 -o-transition: 0;
			transition: 0;
}

/* ASSOCIATED */

#associated {width: 700px; border-top: 1px solid #333; padding-top: 15px; margin-top: 25px; overflow: hidden;}
#associated div {margin-right: -20px; letter-spacing: -.40em;}
#associated article {letter-spacing: normal; width: 220px; margin: 0 20px 15px 0; vertical-align: top;
	display: -moz-inline-box; /* Firefox2 */
	display: inline-block;
	*display: inline; *zoom: 1; /* IE6, IE7 */
	}
#associated article a {display: block; position: relative;}
#associated article a:after {width: 220px; height: 55px; background:#000; position: absolute; top: 0; left: 0; content:" "; z-index:-1;}
#associated h1 {width: 220px; margin-bottom: 5px;}
#associated h1 img {border: 1px solid #ccc; vertical-align: bottom;
	-webkit-transition: all .2s ease;
	   -moz-transition: all .2s ease;  
	     -o-transition: all .2s ease;  
	        transition: all .2s ease; 
}
#associated a:hover h1 img {
	filter: alpha(opacity=80); opacity:0.8;
	-webkit-transition: 0;
	   -moz-transition: 0;
		 -o-transition: 0;
			transition: 0;
}

#SNS li a,
#satelite li a,
#misc li a,
a img {
	-webkit-transition: all .2s ease;
	   -moz-transition: all .2s ease;  
	     -o-transition: all .2s ease;  
	        transition: all .2s ease; 
}

/* SATELITE & MISC */

#satelite {width: 696px; margin-top: 10px; padding: 5px 1px; border: 1px solid #ccc; margin-top: 25px;}
#satelite li {width: 90px; float: left; padding: 0 12px; text-align: center; border-left: 1px solid #e8e8e8;}

#misc {width: 698px; padding: 5px 0; border: 1px solid #ccc; margin-top: 25px;}
#misc li {width: 128px; float: left; padding: 0 5px; text-align: center; border-left: 1px solid #e8e8e8;}

#satelite li:first-child,
#misc li:first-child {border: 0;}
#satelite li a,
#misc li a {display: block; padding: 5px 0;
	-webkit-transition: all .2s ease;
	   -moz-transition: all .2s ease;  
	     -o-transition: all .2s ease;  
	        transition: all .2s ease; 
	}
#satelite li a:hover,
#misc li a:hover {background: #e8e8e8; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}


/* ATTENTION */

#attention {margin-top: 25px; background: #f5f5f5; padding: 15px;}
#attention h1 {font-size: 12px; font-weight: bold; margin-bottom: 5px;}
#attention h1 .backnumber {font-size: 10px; font-weight: normal;}
#attention #safety h1 {margin-top: 10px; padding-top: 10px; border-top: 1px solid #ccc;}
#attention ul li { padding-left: 78px; margin-bottom: 5px;}
#attention ul li time {font-weight: bold; color: #999; float: left; width: 68px; margin-left: -78px;}


/* SECONDARY */

#secondary {float: right; width: 155px;}
#secondary section {margin-bottom: 25px;}
#secondary li {margin-bottom: 5px; *zoom: 1;}
#secondary a {display: block; position: relative;}
#secondary .lSize a:after {width: 155px; height: 95px; background:#000; position: absolute; content:" "; top: 0; left: 0; z-index:-1;}
#secondary a:after {width: 155px; height: 45px; background:#000; position: absolute; content:" "; top: 0; left: 0; z-index:-1;}
#secondary img {border: 1px solid #ccc;
	-webkit-transition: all .2s ease;
	   -moz-transition: all .2s ease;  
	     -o-transition: all .2s ease;  
	        transition: all .2s ease; 
}
#secondary a:hover img {
	filter: alpha(opacity=80); opacity:0.8;
	-webkit-transition: 0;
	   -moz-transition: 0;
		 -o-transition: 0;
			transition: 0;
}

#secondary .borderNone a img {border: 1px solid #fff;}
#secondary .borderNone a:hover img {border: 1px solid #ccc;}


/* PRODUCT SEARCH */

#productSearch {border: 1px solid #ccc;}
#productSearch h1 {background: url(/portal/img/sprite.png) no-repeat -530px 0; text-indent: -9999px;
margin: 10px 10px 5px; line-height: 13px;
}
#productSearch p {color: #555; font-size: 10px; margin: 0 10px 5px;}
#search {background: #f3f3f3; padding: 10px;}
#query {width: 87px; border: 1px solid #ccc; line-height: 15px; padding: 2px; vertical-align: middle;}
button {width: 34px; margin-left: 5px; text-align: center; background: #333; color: #fff; font-weight: bold; display: inline-block; cursor: pointer; text-decoration: none; border: 0; font-size: 10px; letter-spacing: 2px; padding-left: 2px;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; vertical-align: middle; height: 20px; line-height: 15px;
	}
button::-moz-focus-inner { 
    border: 0;
    padding: 0;
}
button:hover {background: #7f0019;}


/* FOOTER */

#footer {width: 880px; margin: 0 auto; line-height: 16px;}
#footerNav {margin: 0 0 10px; padding-top: 10px; border-top: 1px solid #666;}
#footerNav li {float:left; margin-right: 12px; padding-right: 12px; border-right:1px solid #CCC; line-height:13px;}
#footerNav li#fnSitemap {border: none;}
#footerNav li#fnJob {float: right;}
#footerNav li#fnCorporate {float: right; margin-right: 0; padding-right: 0; border: none;}
#copyright {margin-bottom: 20px; padding-top: 5px; border-top: 1px solid #E6E6E6;}
#copyright small {font-size: 10px; font-family: "Lucida Grande","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",Arial,sans-serif;}