
*, *:before, *:after {box-sizing: border-box; -webkit-font-smoothing: antialiased;}
body {font-family: -apple-system, "Helvetica", sans-serif;}
ul {margin: 0 0 15px; padding: 0; list-style: none;}
dl, dd, figure {margin: 0;}
figure img {margin-right: 20px; float: left;}
.shopListper:after, section:after, figure:after {content: ""; clear: both; display: block;}

#shop.en #hGlobalNav, #shop.en #footerNav, #shop.en nav.another, #shop.en #shopNav {display: none;}

#main {font-size: 12px; margin-bottom: 0; position: relative;}
#main figure img {width: 100%; height: auto;}

#shopNav ul {text-align: center; border-bottom: 1px solid #eee;}
#shopNav li {font-size: 14px; display: inline-block; position: relative;}
#shopNav li+li {margin-left: 2em;}
#shopNav li a {display: block; padding: 10px 0;}
#shopNav li.current {font-weight: bold; border-bottom: 2px solid #191919;}

.language {position: absolute; top: 0; right: 0; margin-right: 3.5%; z-index: 101; font-size: 13px; height: 32px; line-height: 30px; margin-top: 19px; padding: 0 16px 0 8px;}

#shopNav ul {margin: 0;}
.detail {margin-top: 9px;}
.detail h2 {margin: 0; padding: 0 0 3px; font-size: 16px;}
.title {font-weight: bold; margin: 0;}

#mujiServiceWrap {padding-top: 25px;}

.subCategory {color: #999; font-weight: normal; font-size: 11px; display: none;}

.remodal {text-align: left;}
.remodal-overlay {background: rgba(43, 46, 56, 0.75);}

.serviceList > ul > li {background-color: #fff; border-radius: 0 0 3px 3px;}
.serviceList:first-child h1 {margin-top: 30px;}
.serviceList h1 {text-align: center; margin-bottom: 0;}
.serviceList h3 {font-size: 14px; margin-bottom: 5px;}
.serviceList a {display: block;}
.serviceList img {border-radius: 3px;}
.serviceList .desc {line-height: 1.7;}

h2 span {display: block;}
.serviceList p {margin: 0;}
.serviceList p+p, .serviceList ul, .serviceList dl, .serviceList dd+dt {margin-top: 5px;}
.serviceList dt {font-weight: bold;}
.serviceList .more {margin-top: 5px; background-image: url("/img/feature/sleep2016aw/arrow_down_gr.png"); background-size: 12px 6px; background-position: center center; background-repeat: no-repeat;}
.serviceList .descOpen+.more {background-image: url("/img/feature/sleep2016aw/arrow_up_gr.png");}

.annotation {font-size: 11px; text-indent: -0.75em; padding-left: 0.75em;}

#modalLanguage {text-align: center; padding: 35px 20px;}
#modalLanguage h2 {margin-top: 0;}
#modalLanguage ul {margin-bottom: 0;}
#modalLanguage li {display: inline-block; padding: 5px; font-size: 13px;}

#trademark {position: absolute; top: 0; right: 0;}
#trademark img {height: 20px; margin: 25px 0 0 20px;}

.remodal img {width: 100%; height: auto; float: none;}
.remodal .desc {display: block;}
#modalMujiService {padding: 35px 0;}
#modalMujiService h2 {text-align: center;}
#modalMujiService h3 {font-weight: normal;}

#shopList a {display: block; background-color: #fff; margin-bottom: 0; background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="6" height="12"><line x1="0" y1="0" x2="6" y2="6" stroke="black" stroke-width="1"/><line x1="6" y1="6" x2="0" y2="12" stroke="black" stroke-width="1"/></svg>') no-repeat 95% center;}

.relatedLink a {background: rgba(0, 0, 0, 0) url("/img/common/arrow_right.png") no-repeat scroll 14px 50%; border: 1px solid #ccc; display: inline-block; margin-top: 10px; padding: 10px 20px 10px 35px; text-decoration: none;}

.asterisk {color: #888;}
#main .serviceList > h1 {display: inline-block; margin-right: 20px;}
.serviceList > p {font-size: 15px; margin: 15px 0;}
.serviceList .shopLink {margin-top: 10px;}
.serviceList > .relatedLink {display: inline-block;}
.shopLink a {color: #67affd; font-weight: bold;}
.noLink {color: #999;}
.noLink span {margin-right: 1em; font-weight: bold;}

#notice {text-align: center; width:100%;}

#newsWrap {position: absolute; top: 44px; left: 0; background: #fff; width: 100%; display: none; z-index: 500;}
#newsWrap:after {content: ""; display: block; clear: both;}
#news { margin: 0 auto; max-width: 1200px; padding: 30px 40px 0; width: 100%; border-left: 1px solid #eee; border-right: 1px solid #eee; border-bottom: 1px solid #eee;}
#news h1 {font-size: 20px; font-weight: normal; margin: 0 0 30px;}
#news h2 {font-size: 14px; margin-bottom: 10px;}
#news ul {margin-bottom: 30px;}
#news li {font-size: 12px; margin-bottom: 5px;}
#news li .pref {margin-right: 1em;}
#news li .shopName {margin-right: 1em;}
#news .close {float: right; text-decoration: none; color: #333; margin-top: 3px;}
#news a {color: #333;}
#newsList section {float: left;}
#newsList:after {content: ""; display: block; clear: both;}

.loading { background-image: url(/jp/shop/img/service/loading.gif); background-size: 50px,auto; width: 50px; height: 50px; position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto;z-index: 10;}

.linkName {font-weight: bold; margin-right: 1em;}

a.disable {cursor: default; color: #999;}
a.disable span {margin-left: 1em; font-weight: normal;}

.mujiService {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    padding: 0 40px;
}

.relatedLink a {
    display: inline-block;
    background: url(https://www.muji.com/img/common/arrow_right.png) no-repeat 14px 50%;
    border: 1px solid #ccc;
    padding: 7px 14px 7px 28px;
    text-decoration: none;
    font-weight: bold;
    float: left;
}

@media screen and (min-width : 1061px){
	.language {margin-right: 0; padding-right: 0;} 
}

@media only screen and (min-width: 700px){
	body {content: "min-width:700px";}
	#main h1 {font-size: 24px;}
	#mujiService {max-width: 1200px; width: 100%; margin: 0 auto; padding: 0 40px;}
	.serviceList > ul {display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin: 0; padding: 0 0 30px;}
	.serviceList > ul > li {width: 23%; margin-top: 30px; margin-left: 2.66%;}
	.serviceList > ul > li:nth-child(4n-3) {margin-left: 0;}
	#main section h1 {text-align: left;}
	.subCategory {margin-bottom: 5px;}
	.serviceList .more {height: 20px; display: none;}
	#modalMujiService h2 span {display: inline;}
	#modalMujiService h3 {font-size: 22px; padding: 10px 0; margin-bottom: 0; border-top: 1px solid #eee;}
	#shopListWrap {margin: 0 20px;}
	#shopList h4 {margin: 0; padding: 0 0 5px; width: 7em; text-align: right; float: left; color: #aaa; font-weight: normal;}
	#shopList li {padding: 0 0 5px; margin-left: 8em; overflow: hidden;}
	#shopList a {background: none; padding: 0 0 5px; font-size: 13px;white-space: nowrap;text-overflow: ellipsis;display: block;overflow: hidden;}

	#shopList a:hover {white-space: normal;}

	#news section+section {margin-left:1em;}

}

@media only screen and (max-width: 699px){
	body {content: "max-width:699px";}
	#main h1 {font-size: 22px;}
	#subCategory {text-align: center;}
	.serviceList + .serviceList {margin-top: 20px;}
	.serviceList h1 {text-align: left; margin: 0 1.5% 10px;}
	.serviceList {margin: 0 12.5px;}
	.serviceList > ul {padding: 0 0 20px; letter-spacing: -.40em; overflow-x: scroll; overflow-y: hidden; white-space: nowrap; margin: 0 1.5%; -webkit-overflow-scrolling: touch;}
	.serviceList > ul * {white-space: normal;}
	.serviceList > ul > li {width: 240px; margin-top: 5px; display: inline-block; vertical-align: top; letter-spacing: normal; }
	.serviceList > ul > li {margin-right: 6%;}
	.serviceList > ul > li:last-child {margin-right: 20%;}
	.serviceList > p {margin: 15px 1.5%;}
	.serviceList > .relatedLink {margin: 0 1.5%;}

	.remodal-wrapper.mujiService {padding: 0; bottom: auto; -webkit-overflow-scrolling: touch;}
	.desc {height: 3em; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}

	.descOpen .desc {height: auto; overflow: visible; display: block;}
	.detail.noDesc:after {display: none;}
	.noDesc .desc {display: none;}
	.serviceList .more {height: 30px;}
	#modalMujiService h2 span {display: block;}
	#modalMujiService h3 {font-size: 14px; padding: 15px; margin: 0; border-bottom: 1px solid #eee; background: #f7f7f7 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="6"><line x1="0" y1="0" x2="6" y2="6" stroke="black" stroke-width="1"/><line x1="6" y1="6" x2="12" y2="0" stroke="black" stroke-width="1"/></svg>') no-repeat 95% center;}
	#modalMujiService h3.active {background: #f7f7f7 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="6"><line x1="0" y1="6" x2="6" y2="0" stroke="black" stroke-width="1"/><line x1="6" y1="0" x2="12" y2="6" stroke="black" stroke-width="1"/></svg>') no-repeat 95% center;}
	#shopList a {padding: 15px 7.5% 15px 15px;white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
	#shopList h4 {margin: 0; font-size: 12px; padding: 5px 15px; border-bottom: 1px solid #eee; background-color: #eee; color: #aaa; font-weight: bold;}
	#shopList li {border-bottom: 1px solid #eee;}

	.prefListHide .prefListWrap {display: none;}

	#news section {float: none;}
	#news li .desc {display: block;}

}

@media screen and (max-width: 767px){
	#trademark {padding: 15px 0; position: absolute; left: 50%; top: 10px;}
	#trademark img {height: 16px; margin: 0;}
}

@media screen and (max-width: 480px){
	.language {margin-right: 2%;}   
}

.ua-ios #mujiService {cursor: pointer;}<!--ºÄÊ±1769394435.9894Ãë-->