@charset "UTF-8";

/* CSS Document */

.classLink li a {
    padding: 9px 35px;
}

.igBox li .item {
  margin:5px;
  border: 1px solid #eee;
  border-radius:10px;
  overflow:hidden;
  padding:0;
}
.igBox li .item .Img img{
  width:100%;
  display:block;
}
.igBox li .item .Txt{
  padding:10px;
}
.igBox li .item .Txt .like{
  display:inline-block;
}
.igBox li .item .Txt .like i, .igBox li .item .Txt .comm i{
  padding-right:5px;
  font-size:18px;
}
.igBox li .item .Txt .comm{
  display:inline-block;
  margin-left:10px;
}
.igBox li .item .Txt p{
  margin-top:5px;
  width:100%;
  font-size:13px;
}

.lglistbox {

  position: relative; }

  .lglistbox a.arrow {

    position: absolute;

    z-index: 20;

    top: 50%;

    -webkit-transform: translate(0, -50%);

    -ms-transform: translate(0, -50%);

    transform: translate(0, -50%); }

    .lglistbox a.arrow.arrow_next {

      right: -30px; }

    .lglistbox a.arrow.arrow_prev {

      left: -30px; }

    .lglistbox a.arrow img {

      display: block; }



ul.iglist {

  padding: 20px 0 0 0; }

  ul.iglist li .item {

    margin: 0 10px; }

.classNote ul.store_socilabar{
    padding: 10px;
        list-style: none;
}
.classNote ul.store_socilabar li a:hover{
        background-color: #9bba3b;
}

ul.store_socilabar {

  padding: 40px 20px 20px;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -ms-flex-wrap: wrap;

  flex-wrap: wrap;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center; }

  ul.store_socilabar li {

    width: 25%;

    min-width: 140px;

    padding: 10px; }

    ul.store_socilabar li.facebook a:hover {

      background: #3a559f; }

    ul.store_socilabar li.instagram a:hover {

      background: -webkit-gradient(linear, left top, right top, from(#8629af), to(#d68140));

      background: -webkit-linear-gradient(left, #8629af, #d68140);

      background: -o-linear-gradient(left, #8629af, #d68140);

      background: linear-gradient(to right, #8629af, #d68140); }

    ul.store_socilabar li.weibo a:hover {

      background: #e6162d; }

    ul.store_socilabar li.wechat a:hover {

      background: #2dc100; }

    ul.store_socilabar li a {

      display: block;

      text-align: center;

      line-height: 45px;

      border-radius: 5px;

      font-weight: bold;

      color: #666;

      font-family: Arial, 'Noto Sans TC';

      letter-spacing: 1px;

      position: relative;

      overflow: hidden; }

      ul.store_socilabar li a::before {

        content: "";

        display: block;

        position: absolute;

        border: 3px solid #e9e9e9;

        border-radius: 5px;

        top: 0;

        left: 0;

        bottom: 0;

        right: 0;

        z-index: -1; }

      ul.store_socilabar li a:hover {

        color: #fff;

        border: none;

        -webkit-box-shadow: 1px 0px 5px rgba(0, 0, 0, 0.4);

        box-shadow: 1px 0px 5px rgba(0, 0, 0, 0.4); }



.map {

  position: relative; }


.map a.uae {
  top: 43%;
  width: 70px;
  left: 18%; }

  .map a.nsw {
    top: 82%;
    width: 140px;
    left: 47%; }
  
  .map a.singapore {
    top: 64%;
    width: 90px;
    left: 33.5%; }
    
  .map a.russia {
    top: 22%;
    width: 70px;
    left: 24%; }
  
  .map a.hk {
    top: 45%;
    width: 90px;
    left: 28.5%; }
  
  .map a.vietnam {
    top: 51%;
    width: 80px;
    left: 34.5%; }
    
  .map a.taiwan {
    top: 45%;
    width: 70px;
    left: 38.5%; }
  
  .map a.china {
    top: 38%;
    width: 70px;
    left: 35%; }
  
  .map a.indonesia {
    top: 64%;
    width: 90px;
    left: 41.5%; }
    
  .map a.myw {
    top: 58%;
    width: 120px;
    left: 32%; }
  
  .map a.cambodia {
    top: 52.5%;
    width: 90px;
    left: 26.5%; }
  
  .map a.canada {
    top: 22.5%;
    width: 80px;
    left: 71%; }
  
  .map a.california {
    top: 41%;
    width: 90px;
    left: 65.2%; }
    
  .map a.washington {
    top: 32%;
    width: 100px;
    left: 63.5%; }
    
.map a.philippines {
    top: 53%;
    width: 110px;
    left: 44%;
}

.map a.texas{
    top: 41%;
    width: 90px;
    left: 76.2%;
}

.map a.pennsy{
    top: 35%;
    left: 80%;
    width: 100px;
    height: 20px;
}

.map a {

  display: inline-block;

  height: 30px;

  position: absolute;

  z-index: 20; }



.map img {

  position: relative;

  z-index: 10;

  width: 100%; }



#storeMap {

  width: 100%;

  height: 600px; }



.stopinfo {

  color: #000;

  font-size: 13px;

  line-height: 1.5;

  font-family: "Noto Sans TC",Helvetica, Arial, "微軟正黑體", Heiti TC, "メイリオ", sans-serif; }



.stopinfo h3 {

  color: #9bba3b;

  font-size: 15px; }



.stopinfo a.more {

  margin-top: 10px;

  position: relative;

  display: block;

  padding: 5px 10px;

  font-size: 14px;

  color: #fff;

  line-height: 1;

  background: #c4922e;

  border-radius: 2px;

  text-align: center;

  font-family: "Noto Sans TC",Helvetica, Arial, "微軟正黑體", Heiti TC, "メイリオ", sans-serif; }



.titleBox {

  color: #64773d; }



.titleBox h2 {

  display: inline-block;

  font-size: 20px;

  font-weight: normal;

  line-height: 1.4;

  position: relative;

  padding-left: 10px; }



.titleBox h2::before {

  content: "";

  width: 1px;

  height: 100%;

  display: block;

  background: #d9d9d9;

  position: absolute;

  right: 100%;

  top: 50%;

  -webkit-transform: translate(0, -50%);

  -ms-transform: translate(0, -50%);

  transform: translate(0, -50%); }



.titleBox h2::after {

  content: "";

  width: 1px;

  height: 100%;

  display: block;

  background: #d9d9d9;

  position: absolute;

  right: 100%;

  top: 50%;

  -webkit-transform: translate(-4px, -50%);

  -ms-transform: translate(-4px, -50%);

  transform: translate(-4px, -50%); }



.titleBox h2 em {

  line-height: 1;

  display: block;

  font-family: 'Amiri', serif;

  font-size: 30px;

  font-weight: normal;

  letter-spacing: 5px;

  position: relative;

  text-transform: uppercase; }



.titleBox h2 em::before {

  content: "";

  width: 120px;

  height: 65px;

  background: url(../images/location-leaf.png) no-repeat;

  background-size: contain;

  display: block;

  bottom: 100%;

  left: 100%;

  position: absolute;

  -webkit-transform: translate(-105%, -5px);

  -ms-transform: translate(-105%, -5px);

  transform: translate(-105%, -5px); }



.storelist {

  padding-left: 70px;

  padding-top: 30px;

  -webkit-transition: 0.6s;

  -o-transition: 0.6s;

  transition: 0.6s; }



.storelist th {

  color: #6e6e6e;

  font-size: 13px;

  border-bottom: 1px solid #c4922e;

  padding: 15px 20px;

  font-weight: normal;

  text-align: center; }



.storelist td a.storename {

  font-size: 15px; }



.storelist td a.storename:hover {

  color: #c4922e; }



.footable-detail-show, .footable-row-detail {

  opacity: 1 !important; }



.storelist:hover tr {

  opacity: 0.3; }



.storelist:hover tr:hover {

  opacity: 1 !important; }



.storelist td {

  line-height: 35px;

  margin: 0px;

  padding: 10px 20px;

  color: #000;

  font-size: 14px;

  border-bottom: 1px solid #dcceb3;

  position: relative;

  -webkit-transition: 0.6s;

  -o-transition: 0.6s;

  transition: 0.6s; }



.storelist tr {

  -webkit-transition: 0.9s;

  -o-transition: 0.9s;

  transition: 0.9s; }



.storelist tr:hover {

  background: #fff;

  -webkit-box-shadow: 0px -1px 20px rgba(0, 0, 0, 0.1);

  box-shadow: 0px -1px 20px rgba(0, 0, 0, 0.1); }



.storelist td strong {

  line-height: 15px;

  position: absolute;

  top: 0;

  left: 0;

  width: 80px;

  height: 80px;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  -ms-flex-wrap: wrap;

  flex-wrap: wrap;

  color: #fff;

  background: url(../images/tag-yellow.png) no-repeat center center;

  -webkit-transform: translate(-80%, -50%);

  -ms-transform: translate(-80%, -50%);

  transform: translate(-80%, -50%);

  padding: 15px;

  text-align: center;

  letter-spacing: 1px;

  overflow: hidden;

  font-family: 'Amiri',"Noto Sans TC",Helvetica, Arial, "微軟正黑體", Heiti TC, "メイリオ", sans-serif;

  font-weight: 300; }



.storelist td strong.green {

  background: url(../images/tag-green.png) no-repeat center center; }



.storelist td.timetd::before {

  display: none; }



.storelist td::before {

  content: "";

  width: 1px;

  height: 60%;

  position: absolute;

  top: 50%;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  right: 0;

  background: #dbdbdb; }



/******內頁******/

.contentBox .Img img {

  display: block;

  width: 100%;

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden; }



@media (max-width: 1400px) {

  .lglistbox a.arrow.arrow_next {

    right: -10px; }

  .lglistbox a.arrow.arrow_prev {

    left: -10px; } }



@media (max-width: 1180px) {

  .map a {

    display: none; }

  ul.store_socilabar {

    padding: 40px 0px 20px; } }



@media (max-width: 900px) {

  .titleBox {

    -webkit-transform: translate(0, 0%);

    -ms-transform: translate(0, 0%);

    transform: translate(0, 0%);

    padding: 30px 0; } }



@media (max-width: 767px) {

  #storeMap {

    width: 100%;

    height: 400px; }

  .storelist td::before {

    display: none; }

  .storelist {

    padding-left: 40px; }

  .footable-row-detail-name {

    width: 90px; } }

