
/**
 *
 * UNIQLO L4 Store Inventory
 *
 */


/*** フォント関連 ***/
@font-face {
  font-family: "DIN Next W01 Bold";
  src: url("http://www.uniqlo.com/uk/store/css/fonts/b32ab78b-6c51-4bd3-bc37-4edcec0331f8.eot?iefix") format("eot");
}

@font-face {
  font-family: "DIN Next W01 Bold";
  src: url("http://www.uniqlo.com/uk/store/css/fonts/b32ab78b-6c51-4bd3-bc37-4edcec0331f8.eot?iefix"),
       url("http://www.uniqlo.com/uk/store/css/fonts/9949035f-6226-4080-a14a-bf7d94ffb1e1.woff") format("woff"),
       url("http://www.uniqlo.com/uk/store/css/fonts/6241bd09-15c2-485e-9796-9db8d0aa6974.ttf") format("truetype"),
       url("http://www.uniqlo.com/uk/store/css/fonts/af94da3e-4232-416a-b6bc-f39f85dd5db6.svg#af94da3e-4232-416a-b6bc-f39f85dd5db6") format("svg");
}

@font-face {
  font-family:"DIN Next W01 Regular";
  src:url("http://www.uniqlo.com/uk/store/css/fonts/da088ecc-a53c-4831-a95b-6fd81b5b338a.eot?iefix") format("eot");
}

@font-face {
  font-family: "DIN Next W01 Regular";
  src: url("http://www.uniqlo.com/uk/store/css/fonts/da088ecc-a53c-4831-a95b-6fd81b5b338a.eot?iefix"),
       url("http://www.uniqlo.com/uk/store/css/fonts/c5a7f89e-15b6-49a9-8259-5ea665e72191.woff") format("woff"),
       url("http://www.uniqlo.com/uk/store/css/fonts/868c94b5-ca49-46b7-b62b-297f8d861125.ttf") format("truetype"),
       url("http://www.uniqlo.com/uk/store/css/fonts/e3145f65-29b5-4f7f-8c6e-2dc135021b6a.svg#e3145f65-29b5-4f7f-8c6e-2dc135021b6a") format("svg");
}

@font-face{
  font-family:"DIN Next W02 Medium";
  src:url("http://www.uniqlo.com/uk/store/css/fonts/2cf657c7-a3a0-4365-8704-c88d1e7e7e59.eot?iefix") format("eot");
}

@font-face{
  font-family: "DIN Next W02 Medium";
  src: url("http://www.uniqlo.com/uk/store/css/fonts/2cf657c7-a3a0-4365-8704-c88d1e7e7e59.eot?iefix"),
       url("http://www.uniqlo.com/uk/store/css/fonts/97b0cc11-9afb-4a2f-93b7-e1b5c40d80a6.woff") format("woff"),
       url("http://www.uniqlo.com/uk/store/css/fonts/2cfb9022-3dc0-4b24-8e91-2df7bd55dd37.ttf") format("truetype"),
       url("http://www.uniqlo.com/uk/store/css/fonts/7c8e4086-96df-4b91-905e-3b25c81d55a9.svg#7c8e4086-96df-4b91-905e-3b25c81d55a9") format("svg");
}



/*** Magnific Popup ***/
.mfp-bg {
  z-index: 20000;
}

.mfp-wrap {
  z-index: 20100;
}

.mfp-content {
  z-index: 20200;
}

.mfp-close-btn-in .mfp-close {
  font-size: 40px;
  font-weight: bold;
  top: 10px;
  right: 10px;
}



/*** 画面レイアウト関連 ***/
#findInStore {
  background-color: #e6e6e6;
  padding: 20px 0px 0px 0px;
}

#findInStore img {
  cursor: pointer;
}

#storeAvailability {
  font-family: "DIN Next W02 Medium";
  font-size: 10px;
  font-style: normal;
  color: #000000;
  background-color: #ffffff;
  border: 2px solid #000000;
  height: 300px;
  width: 740px;
  padding: 10px;
  margin: 0px auto;
  display: table;
  position: relative;
  box-sizing: border-box;
}

#storeAvailability ul {
  list-style: none;
  padding: 0px;
  margin: 0px;
}

#storeAvailability p.title {
  font-family: "DIN Next W01 Bold";
  font-size: 30px;
  text-align: center;
  padding: 0px;
  margin: 10px;
}

#storeAvailability div.goodsInfo {
  margin: 0px auto 0px auto;
  display: table;
}

#storeAvailability div.goodsInfo:after {
  clear: both;
}

#storeAvailability div.goodsInfo div.goodsImage {
  width: 68px;
  left: 68px;
  display: table-cell;
}

#storeAvailability div.goodsInfo div.goodsDetailInfo {
  height: 68px;
  margin: 0px 0px 0px 10px;
  display: table-cell;
  float: left;
}

#storeAvailability div.goodsInfo div.goodsDetailInfo ul li.goodsName,
#storeAvailability div.goodsInfo div.goodsDetailInfo ul li.itemCode,
#storeAvailability div.goodsInfo div.goodsDetailInfo ul li.salesPrice {
  font-size: 12px;
  padding: 2px;
  margin: 0px;
}

#storeAvailability div.goodsInfo div.selectChipInfo {
  height: 68px;
  display: table-cell;
  float: left;
  margin: 0px 0px 0px 20px;
}

#storeAvailability div.chipInfo {
  border-top: solid 1px #000000;
  border-bottom: solid 1px #000000;
  width: 100%;
  display: table;
  padding: 20px 0px;
  margin: 20px 0px 0px 0px;
}

#storeAvailability div.chipInfo:after {
  clear: both;
}

#storeAvailability div.chipInfo div.colorArea,
#storeAvailability div.chipInfo div.sizeArea,
#storeAvailability div.chipInfo div.lengthArea {
  clear: both;
  width: 500px;
  display: block;
}

#storeAvailability div.chipInfo div.colorArea {
  height: 38px;
  margin: 0px auto 0px auto;
}

#storeAvailability div.chipInfo div.sizeArea,
#storeAvailability div.chipInfo div.lengthArea {
  height: 48px;
  margin: 20px auto 0px auto;
}

#storeAvailability div.chipInfo div.colorArea div.colorTitle,
#storeAvailability div.chipInfo div.sizeArea div.sizeTitle,
#storeAvailability div.chipInfo div.lengthArea div.lengthTitle {
  font-size: 16px;
  font-weight: normal;
  width: 200px;
  float: left;
}

#storeAvailability div.chipInfo div.colorArea div.colorTitle {
  line-height: 40px;
}

#storeAvailability div.chipInfo div.sizeArea div.sizeTitle,
#storeAvailability div.chipInfo div.lengthArea div.lengthTitle {
  line-height: 48px;
}

#storeAvailability div.chipInfo div.colorArea div.colorChip,
#storeAvailability div.chipInfo div.sizeArea div.sizeChip,
#storeAvailability div.chipInfo div.lengthArea div.lengthChip {
  width: 300px;
  float: left;
}

#storeAvailability div.chipInfo div.colorChip ul li {
  background-image: url(http://im.uniqlo.com/images/uk/pc/img/material/bgr_listchip.gif);
  box-sizing: border-box;
  position: relative;
  margin: 2px;
  cursor: pointer;
  float: left;
}

#storeAvailability div.chipInfo div.colorArea div.colorChip ul li div {
  width: 34px;
  height: 34px;
  position: relateive;
  z-index: 10;
}

#storeAvailability div.chipInfo div.colorArea div.colorChip ul li div img {
  margin: 6px 0px 0px 6px;
}

#storeAvailability div.chipInfo div.colorArea div.colorChip ul li.select {
  background-position: -34px 0px;
}

#storeAvailability div.chipInfo div.sizeArea div.sizeChip ul li,
#storeAvailability div.chipInfo div.lengthArea div.lengthChip ul li {
  background-image: url(http://im.uniqlo.com/images/uk/pc/img/material/chip/bgr_listchip-size_v3.gif);
  background-position: -46px 0px;
  cursor: pointer;
  box-sizing: border-box;
  margin: 2px;
  position: relative;
  float: left;
}

#storeAvailability div.goodsInfo div.selectChipInfo ul li {
  float: left;
  margin: 2px;
}

#storeAvailability div.goodsInfo div.selectChipInfo ul li.sizeChip div,
#storeAvailability div.goodsInfo div.selectChipInfo ul li.lengthChip div {
  border: solid 1px #999999;
}

#storeAvailability div.chipInfo div.sizeArea div.sizeChip ul li div,
#storeAvailability div.chipInfo div.lengthArea div.lengthChip ul li div,
#storeAvailability div.goodsInfo div.selectChipInfo ul li.sizeChip div,
#storeAvailability div.goodsInfo div.selectChipInfo ul li.lengthChip div {
  width: 43px;
  height: 43px;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  position: relateive;
  z-index: 10;
}

#storeAvailability div.chipInfo div.sizeArea div.sizeChip ul li.select,
#storeAvailability div.chipInfo div.lengthArea div.lengthChip ul li.select {
  background-position: 0px 0px;
}

#storeAvailability div.chipInfo div.sizeArea div.sizeChip ul li em,
#storeAvailability div.chipInfo div.lengthArea div.lengthChip ul li em,
#storeAvailability div.goodsInfo div.selectChipInfo ul li.sizeChip div em,
#storeAvailability div.goodsInfo div.selectChipInfo ul li.lengthChip div em {
  font-family: arial;
  font-size: 11pt;
  font-style: normal;
  font-weight: normal;
  width: 43px;
  display: block;
}

#storeAvailability div.searchInfo {
  width: 580px;
  margin: 20px auto 30px auto;
}

#storeAvailability div.searchInfo div.annotation {
  font-size: 13px;
  width: 240px;
  float: left;
}

#storeAvailability div.searchInfo div.searchKeyword input {
  font-family: "DIN Next W02 Medium";
  font-size: 16px;
  width: 160px;
  height: 38px;
  margin: 0px 0px 0px 30px;
  padding: 0px 10px;
  float: left;
}

#storeAvailability div.searchInfo div.searchButton {
  font-size: 16px;
  color: #ffffff;
  background-color: #000000;
  height: 38px;
  line-height: 38px;
  padding: 0px 20px;
  margin: 0px 0px 0px 10px;
  display: inline-block;
  cursor: pointer;
}

#storeAvailability div.searchInfo:after {
  clear: both;
}

#storeAvailability div.storeMapInfo {
  clear: both;
  border-top: solid 1px #000000;
  padding: 20px 0px 0px 0px;
  display: inline-block;
  width: 100%;
}

#storeAvailability p.searchError {
  color: #ff0000;
  background-color: #ffdddd;
  font-size: 16px;
  font-weight: normal;
  padding: 10px;
  text-align: center;
  display: none;
}

#storeAvailability div.footer {
  clear: both;
  width: 550px;
  margin: 0px auto 0px auto;
  padding: 20px 0px 0px 0px;
}

#storeAvailability div.footer div.goBackButton {
  text-align: center;
  margin: 10px 0px 0px 0px;
}

#storeAvailability div.footer div.goBackButton span {
  font-size: 16px;
  color: #ffffff;
  background-color: #000000;
  height: 38px;
  line-height: 38px;
  padding: 0px 20px;
  display: inline-block;
  cursor: pointer;
}

#storeAvailabilityMap {
  background-color: #aaaaaa;
  width: 280px;
  height: 280px;
  float: left;
}

#storeAvailabilityList {
  background-color: #fafafa;
  width: 420px;
  height: 280px;
  margin: 0px 0px 0px 10px;
  overflow-y: scroll;
  float: left;
}

#storeAvailabilityList li {
  margin-bottom: 16px;
}

#storeAvailabilityList li p {
  font-size: 11px;
  margin: 4px;
  padding: 0px;
}

#storeAvailabilityList li p.storeName {
  font-size: 13px;
  font-weight: normal;
}

#storeAvailabilityList .storeInfo {
  display: table;
  width: 100%;
}

#storeAvailabilityList .storeDetailInfo,
#storeAvailabilityList .stockInfo {
  display: table-cell;
}

#storeAvailabilityList .storeDetailInfo {
  width: 320px;
}

#storeAvailabilityList .stockInfo {
  vertical-align: middle;
}

#storeAvailabilityList .stockInfo p {
  font-weight: normal;
}

#storeAvailabilityList .storeDetailInfo span.viewOnMap {
  font-weight: normal;
  text-decoration: underline;
  padding: 4px;
  cursor: pointer;
}

#storeAvailabilityList .stockInfo p.inStock {
  color: #22cc66;
}

#storeAvailabilityList .stockInfo p.lowInStock {
  color: #ff4444;
}

#storeAvailabilityList .stockInfo p.outOfStock {
  color: #aaaaaa;
}

#storeAvailabilityList .stockInfo p.notApplicable {
  color: #aaaaaa;
}



