@charset "UTF-8";

*,
*:before,
*:after {
  -webkit-font-smoothing:antialiased;
  -moz-font-smoothing:antialiased;
  font-smoothing:antialiased;
  -webkit-box-sizing:border-box; 
  -moz-box-sizing:border-box; 
  -ms-box-sizing:border-box; 
  box-sizing:border-box;
}
figure {margin:0;}
figure img {width:100%; height:auto; margin-right:0; float:initial;}

h1 {line-height:1.0;}

#main-contents {
  min-height:250px; 
  margin:0 auto 40px; 
  overflow:hidden; 
  font-size:14px; 
  line-height:1.9; 
  color:#191919;
}
#topContents {
  height:660px;
  background:url(/jp/event/shop/special-events/170519/img/main.jpg) no-repeat center center;
  background-size:cover;
  position:relative;
}

/*実施店舗・開催期間*/
#shop h1,
#period h1 {font-size:20px;}

#shop {width:700px; margin:25px auto 40px; text-align:center;}
#shop:before {width:100px; margin:0 auto; padding-bottom:20px; display:block; content:""; border-top:1px solid #ddd;}
#shop ul {width:850px; margin:0; padding:0; overflow:hidden; letter-spacing:-.40em;}
#shop li {width:270px; margin-right:20px; display:inline-block; letter-spacing:normal; font-size:16px; text-align:left;}
#shop li.last {width:100px; margin-right:0;}
#shop li a {text-decoration:none; color:#666; line-height:2.0;}
#shop li a:hover {color:#191919;}

#period {width:700px; margin:80px auto 40px; text-align:center;}
#period p {font-size:16px;}
/*実施店舗・開催期間*/

article .lead {max-width:800px; margin:80px auto 0;}
article .lead  p {font-size:16px; text-align:left; margin:0;}

/*コンテンツ*/
#contents {max-width:980px; display:block; overflow:hidden; width:80%; margin:0 auto; box-sizing:border-box;}
#contents section.notice {margin-bottom:20px;}

/*bring*/
#contents #bring_campaign h1 {text-align:center; font-size:35px;}
#contents #bring_campaign p.bring_cam_lead {line-height:1.8;}
#contents #bring_campaign .bring_campaign_summary {margin-bottom:30px; border:1px solid #ddd; padding:30px; box-sizing:border-box; border-radius:8px;}
#contents #bring_campaign .bring_campaign_summary h1 {text-align:center; font-size:26px; line-height:1.5; margin:0;}
#contents #bring_campaign .bring_campaign_summary h1 span {font-size:60%; display:block;}
#contents #bring_campaign .bring_campaign_summary h1 span:first-child {font-size:55%; margin-bottom:10px;}
#contents #bring_campaign .bring_campaign_summary div {
  display:-webkit-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:flex;
  align-items:center;
}
#contents #bring_campaign .bring_campaign_summary div section {width:70%; padding:15px;}
#contents #bring_campaign .bring_campaign_summary div div#bringImg {width:30%; padding:15px;}
#contents #bring_campaign .bring_campaign_summary div div#bringImg img {width:100%;}
#contents #bring_campaign .bring_campaign_summary div#bringImg_ticket {width:300px; margin:20px auto 0;}
#contents #bring_campaign .bring_campaign_summary div#bringImg_ticket img {width:100%;}
#contents #bring_campaign div.object {background:#e6e6e6; padding:15px 20px; border-radius:7px; margin:40px 0;}
#contents #bring_campaign div.object p {line-height:1.6; margin:0;}
#contents #bring_campaign .bring_cam_flow {
  display:-webkit-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:flex;
}
#contents #bring_campaign .bring_cam_flow section {width:25%; padding:10px;}
#contents #bring_campaign .bring_cam_flow section figure img {width:100%; height:auto; margin-right:0;}
#contents #bring_campaign .counter {text-align:center; font-size:116%; margin:0 0 50px 0;}
#contents #bring_campaign .counter p {margin:0;}
/*bring*/

/*限定商品_バスタイム*/
#contents #limited_recommend_item {margin-bottom:80px;}
#contents #limited_recommend_item h1 {text-align:center; font-size:35px;}
#contents #limited_recommend_item h2 {text-align:center; margin:50px 0 0 0;}
#contents #limited_recommend_item h2 span.sub {font-size:80%; display:block;}
#contents #limited_recommend_item .lead {margin-top:0;}
#contents #limited_recommend_item .lead p {text-align:center; margin-bottom:30px;}
#contents #limited_recommend_item .recommend_text {width:100%;}
#contents #limited_recommend_item .recommend_text p.recommend_lead {margin:20px 0 0 0;}
#contents #limited_recommend_item .recommend_text .price_list {padding-top:20px; text-align:center;} 
#contents #limited_recommend_item .recommend_text .price_list .price_card {margin-top:30px;}
#contents #limited_recommend_item .recommend_text .price_list .price_card:first-child {margin-top:20px;}
#contents #limited_recommend_item .recommend_text .price_list .price_card p {margin:0;}
#contents #limited_recommend_item .recommend_text .price_list .price_card p:first-child {margin-bottom:10px;}
#contents #limited_recommend_item .recommend_text .price_list .price_card p.itemName {font-weight:bold; font-size:16px;}

.recommend_item .recommend_img {
	width:100%; 
	margin-top:0; 
	padding-bottom:calc(100%*600/980); 
	padding-bottom:-webkit-calc(100%*600/980); 
	background-size:100% auto; 
	position:relative;
}
.recommend_item .recommend_img .background {
	position:absolute; 
	top:0; 
	left:0; 
	bottom:0; 
	right:0; 
	z-index:-2; 
	background-size:contain; 
	background-position:center center; 
	background-repeat:no-repeat; 
	margin:0; 
	display:none;
}
.recommend_item .recommend_img .background.background1 {background-image:url(/jp/event/shop/special-events/180907/img/recommend_img_01.jpg); display:block;}
.recommend_item .recommend_img .background.background2 {background-image:url(/jp/event/shop/special-events/180907/img/recommend_img_02.jpg); display:block;}
.recommend_item:first-child {margin-bottom:20px;}

#contents .limited_items {
  display:-webkit-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:flex;
  flex-wrap:wrap;
}
#contents .limited_items .item {width:25%; padding:5px 15px;}
#contents .limited_items .item figure ,
#contents .limited_items .item figure img {width:100%; height:auto;}
/*限定商品_バスタイム*/

/*限定商品*/
#contents #limited_item {margin-bottom:80px;}
#contents #limited_item h1 {text-align:center; font-size:35px;}
#contents #limited_item .lead {margin-top:0;}
#contents #limited_item .lead p {text-align:center; margin-bottom:30px;}

#contents #limited_item .recommend_item {
  display:-webkit-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:flex;
  justify-content:space-between;
}

#contents #limited_item .recommend_img {
  display:-webkit-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:flex;
  justify-content:space-between;
  width:48%
}
#contents #limited_item .recommend_img figure {width:80%; margin-right:15px;}
#contents #limited_item .recommend_img figure.sub {width:20%; margin-right:0;}
/*限定商品*/

/*特別企画*/
#contents #planning {margin-bottom:80px;}
#contents #planning h1 {text-align:center; font-size:35px;}
#contents #planning h2 {
  font-size:20px;
  font-weight:bold;
  margin-bottom:20px;
  border-left:8px solid #e9c398;
  padding-left:10px;
  line-height:1.4;
}
#contents #planning .planning_events {
  display:-webkit-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:flex;
  justify-content:space-between;
  margin-bottom:20px;
}
#contents #planning .planning_events .event {width:50%; padding:0 15px;}
.consultation {display:block;}
.privilegeIcon {
  width:40px; 
  height:18px;
  margin-right:10px; 
  margin-bottom:4px;
  padding:4px; 
  font-weight:bold; 
  background-color:#333; 
  -moz-border-radius:5px; 
  -webkit-border-radius:5px; 
  border-radius:5px; 
  vertical-align:middle; 
  color:#fff; 
  text-align:center; 
  font-size:13px; 
}
span.sannka {
  padding:5px 0;  
  margin-bottom:20px; 
  font-weight:bold; 
  display:block; 
  border-top:solid 1px #333; 
  border-bottom:solid 1px #333; 
  text-align:center;
}
.privilege {margin-bottom:50px;}
.privilege_l {margin-bottom:100px;}
.interior {margin-bottom:20px;}
.privilege li {margin-bottom:10px;}
dl {margin:0 0 20px 0; padding:0; overflow:hidden;}
dt {line-height:1.5em; margin:0; padding:0;}
dd {line-height:1.5em; margin-top:-1.5em; padding:0 0 7px 3.5em;}
/*特別企画*/

/*店舗イベント*/
#contents #shopEvent {margin-bottom:80px;}
#contents #shopEvent h1 {text-align:center; font-size:35px;}
#contents #shopEvent .lead {margin-top:0;}
#contents #shopEvent .lead p {text-align:center; margin-bottom:30px;}

#contents #shopEvent div.event {padding:20px; background:#f5f2e9; border:1px solid #ccc; border-radius:7px;}
#contents #shopEvent div.event p {margin:0;}
#contents #shopEvent div.event figure a {text-decoration:none;}
#contents #shopEvent div.event figure img {width:100%; height:auto; float:none;}
#contents #shopEvent div.event .congruence {
  margin:0;
  padding:30px 0;
  display:-webkit-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:flex; 
  justify-content:space-between;
  border-bottom:1px solid #ddd; 
}
#contents #shopEvent div.event .congruence:first-child {padding-top:15px;}
#contents #shopEvent div.event .congruence figure {width:25%;}
#contents #shopEvent div.event .congruence section {width:70%;}
#contents #shopEvent div.event .congruence section h3 {margin:0 0 20px;}
#contents #shopEvent div.event .congruence dl {margin:0 0 20px 0; padding:0; overflow:hidden;}
#contents #shopEvent div.event .congruence dt {line-height:1.5em; margin:0; padding:0;}
#contents #shopEvent div.event .congruence dd {line-height:1.5em; margin-top:-1.5em; padding:0 0 7px 7em;}
#contents #shopEvent div.event .congruence dd section {margin-bottom:15px;}
#contents #shopEvent div.event .congruence dd:last-child {padding-bottom:0;}
#contents #shopEvent div.event .congruence dd section:last-child {margin-bottom:0;}

#contents #shopEvent div.event #otherEvent {margin:0; padding:30px 0 15px;}
#contents #shopEvent div.event #otherEvent h2 {margin:0 0 15px 0; padding:0; text-align:center; line-height:1.0;}
#contents #shopEvent div.event #otherEvent ul {margin:0; padding:0;}
#contents #shopEvent div.event #otherEvent ul li {width:17%; margin:0 20px 0 0; display:inline-block; letter-spacing:normal; vertical-align:top; }
#contents #shopEvent div.event #otherEvent ul a {text-decoration:none; color:#666; line-height:2.0;}
#contents #shopEvent div.event #otherEvent ul a:hover {color:#191919;}

@media screen and (max-width :767px) {
 #contents #shopEvent div.event #otherEvent ul li {width:100%; display:block; text-align:center;}
}
@media screen and (max-width:420px) {
 #contents #shopEvent div.event .congruence {display:block;}
 #contents #shopEvent div.event .congruence figure {width:100%;}
 #contents #shopEvent div.event .congruence section {width:100%;}
}
/*店舗イベント*/

/*topics*/
.notice .topics_summary {margin-bottom:30px; border:1px solid #ddd; padding:30px; box-sizing:border-box; border-radius:8px;}
#contents #planning .topics_summary h1#topicTtl {text-align:center; font-size:26px; line-height:1.5; margin:0;}
.notice .topics_summary p {margin:0;}
.notice .topics_summary p.topics_summary_lead {line-height:1.8;}
.notice .topics_summary div {
  display:-webkit-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:flex;
  align-items:flex-start;
}
.notice .topics_summary div#topicsInfo section {width:70%; padding:15px 0 15px 15px;}
.notice .topics_summary div#topicsInfo div#topicsImg {width:30%; padding:20px 40px;}
.notice .topics_summary div#topicsInfo div#topicsImg img {width:100%;}

.notice .topics_summary div#topicsImg_02 {
  display:-webkit-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:flex;
  justify-content:space-between;
}
.notice .topics_summary div#topicsImg_02 figure {width:48%;}
.notice .topics_summary div#topicsImg_02 figure img {width:100%;}

#contents #planning .topics_summary .muji_suppoert--flow h1.flowTtl {font-size:18px; background-color:#e6e6e6; color:#333; margin-bottom:30px; line-height:2.0;}
#contents #planning .topics_summary .muji_suppoert--flow p {text-align:center; font-size:18px; line-height:2.0;}

#contents #planning .topics_summary .muji_suppoert--flow .muji_suppoert--service {margin-top:40px;}
#contents #planning .topics_summary .muji_suppoert--flow .muji_suppoert--service section {width:50%;}
#contents #planning .topics_summary .muji_suppoert--flow .muji_suppoert--service section.interiorService {margin-right:5px;}
#contents #planning .topics_summary .muji_suppoert--flow .muji_suppoert--service section p {text-align:left; font-size:14px; line-height:2.0;}
#contents #planning .topics_summary .muji_suppoert--flow .muji_suppoert--service section p span {display:block;}
#contents #planning .topics_summary .muji_suppoert--flow .muji_suppoert--service section p span b {font-size:16px;}
#contents #planning .topics_summary .muji_suppoert--flow .muji_suppoert--service section figure {width:80px; float:left; margin-right:20px;}

@media screen and (max-width:767px) {
.notice .topics_summary div {display:block; align-items:initial;}
.notice .topics_summary div#topicsInfo section {width:100%; padding:0;}
.notice .topics_summary div#topicsInfo div#topicsImg {width:70%; margin:0 auto; padding:20px 0;}
#contents #planning .topics_summary .muji_suppoert--flow .muji_suppoert--service section {width:100%;}
#contents #planning .topics_summary .muji_suppoert--flow .muji_suppoert--service section.interiorService {margin:0 0 15px 0;}
}
@media screen and (max-width:420px) {
 .notice .topics_summary {padding:15px 10px 10px;}
 .notice .topics_summary div#topicsImg_02 {display:block; justify-content:initial;}
 .notice .topics_summary div#topicsImg_02 figure {width:100%;}
}
/*topics*/

/*各タイトル_スマホ処理*/
@media screen and (max-width:420px) {
  #contents #planning h1,
  #contents #bring_campaign h1,
  #contents #limited_recommend_item h1,
  #contents #limited_item h1,
  #contents #shopEvent h1 {font-size:25px;}
  #contents #planning .topics_summary h1#topicTtl {font-size:22px;}
}
/*各タイトル_スマホ処理*/

/*コンテンツ*/

.emphasis {font-weight:bold;}
.txt_element {display:block; line-height:1.6;}
.txt_element_size83 {font-size:83%;}
.clearance_mt10 {margin-top:10px;}
.clearance_mb10 {margin-bottom:10px;}
.annotaition {color:#555;}
.price, 
.price2 {font-size:11px;}
.price del {color:#666; text-decoration:none;}
.price del:after {content:" → ";}
.price ins {color:#7f0019;}
.price2 ins {color:#191919;}
.price .num, 
.price2 .num {
  font-size:16px; 
  font-weight:bold; 
  margin:0 2px; 
  font-family:"Helvetica","Lucida Grande","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W6","ＭＳ Ｐゴシック" ,sans-serif;
}
.price del .num {font-size:12px;}
.smartphone_r {display:none;}
.priceBefore {font-size:9px;}
.priceBefore ins {color:#666;}
.priceBefore ins:after {content:" → ";}
.priceBefore .num {font-size:12px; font-weight:bold;}
ins {text-decoration:none;}

.sankaku {
  width:0; 
  height:0; 
  margin:15px auto 0;
  border-top:15px solid #e6e6e6; 
  border-right:20px solid transparent; 
  border-bottom:15px solid transparent; 
  border-left:20px solid transparent;
}

/*sns*/
aside.share {text-align:center; color:#999; font-size:12px; margin:40px auto 20px;}
aside.share a {width:22px; height:auto; display:inline-block; margin:0 0 0 10px;}
aside.share a img {width:100%; vertical-align:middle; opacity:.6;}
aside.share a img.fbBtn {width:85%;}
aside.share span {margin-right:0; color:#999; font-size:small;}
/*sns*/
/*横跳びリンク*/
.relatedLink {
font-size:12px;
text-align:right;
display:block;
margin:20px 0 0;
}
.relatedLink a {
display:inline-block;
background:url(//www.muji.net/img/common/arrow_right.png) no-repeat 14px 50%;
border:1px solid #ccc;
padding:7px 14px 7px 28px;
text-decoration:none;
font-weight:bold;
background-color:#fff;
color:#333;
}
.relatedLink a:hover {border:1px solid #191919;}
/*横跳びリンク*/


@media screen and (max-width :1224px) {
 .event li {width:20%;}
}
@media screen and (max-width:1223px) {
 .overflow-scrolling {overflow:scroll; -webkit-overflow-scrolling:touch;}
}
@media screen and (max-width :874px) {
 .consultation {height:auto;}
}
@media screen and (max-width :767px) {
 #topContents {
   background:url(/jp/event/shop/special-events/170519/img/main_sp.jpg) no-repeat center center;
   background-size:cover;
   margin-top:-50px;
   height:760px;
 }
 article .lead {width:90%;}
 #contents {width:90%;}
 #shop,
 #period {width:100%;}
 #shop ul {width:100%;}
 #shop li {width:100%;}
 #shop li {text-align:center;}
 #contents #bring_campaign .bring_campaign_summary div {display:block; align-items:initial;}
 #contents #bring_campaign .bring_campaign_summary div section, 
 #contents #bring_campaign .bring_campaign_summary div div#bringImg {width:100%; padding:0;}
}
@media screen and (max-width:640px) {
 .event li {width:38%;}
 .congruence {display:block;}
 .congruence figure {width:50%; margin:0 auto}
 .congruence section {width:100%;}
 .smartphone_r {display:block;}
}
@media screen and (max-width :414px) {
 .congruence dd {padding:0 0 7px 3em;}
}
@media screen and (max-width:535px) {
 #contents #mycitybag h1 img {width:100%; height:auto;}
 #contents #limited_item .limited_recommend_item {padding-bottom:50px;}
 #contents #limited_item .recommend_item {display:block; justify-content:initial;}
 #contents #limited_item .recommend_text {width:100%; margin-top:-60px;}
 #contents #limited_item .recommend_img {width:100%;}
}
@media screen and (min-width:414px) and (max-width:767px) {
 #contents #bring_campaign .bring_cam_flow {flex-wrap:wrap;}
 #contents #bring_campaign .bring_cam_flow section {width:50%;}
 #contents .limited_items .item {width:50%; padding:5px 15px;}
 #contents #planning .planning_events {flex-wrap:wrap;}
 #contents #planning .planning_events .event {width:50%; padding:5px 15px;}
}
@media screen and (max-width:420px) {
 #topContents {height:390px; margin-top:0;}
 #contents #bring_campaign .bring_campaign_summary h1 {font-size:24px;}
 #contents #bring_campaign .bring_campaign_summary {padding:15px 10px 10px;}
 #contents #bring_campaign .bring_campaign_summary div#bringImg_ticket {width:100%;}
}
@media screen and (max-width:413px) {
 #contents #bring_campaign .bring_cam_flow {flex-wrap:wrap;}
 #contents #bring_campaign .bring_cam_flow section {width:100%; padding-right:0;}
 #contents .limited_items .item {width:100%; padding:0;}
 #contents #mycitybag .mycitybag section.mybags figure {width:100%; padding:0 0 30px 0;}
 #contents #planning .planning_events {display:block; justify-content:initial; margin-bottom:0;}
 #contents #planning .planning_events .event {width:100%; margin-bottom:30px; padding:5px 0;}
}
@media screen and (max-width:320px){
 #topContents {height:315px;}
}