@import url(//fonts.googleapis.com/earlyaccess/notosanstc.css);
body {font-size: 15.5px;}
#siteName {font-size: 2em; line-height: 1;}
figcaption{display: inline-block;}
#visual{
  background-image: url(../img/kv.jpg);
   padding-top: 50.64%; 
  }
#garment{background-image: url(../img/kv_garment.jpg);margin-bottom:40px; padding-top: 66.64%; }
#household{background-image: url(../img/sc-section-9.jpg);margin-bottom:40px;  padding-top: 66.64%; }
#mtg{background-image: url(../img/mtg-kv.jpg);padding-top: 56.64%; }
.wrapper{padding:0 0 15px 0;}
.square:after {
  content: "";
  display: block;
  padding-bottom: 100%;

}
/*.hover-text{background: rgba(0,0,0,0.5);}
.overlay{background: rgba(0,0,0,0.5); width:100%;}
.overlay:after {
  content: "";
  display: block;
  padding-bottom: 100%;

}*/

.kv{background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
   }

.kv h1{ font-size: 2.5em;
    padding: 0 0 22% 7%; }

/*index*/
/*.grid>* {padding:0 7px  !important;}*/
.square h2{color:#fff; text-decoration: none;}
.square h2:hover{color:#fff; text-decoration: none;}
.square .overlay:hover{opacity: 1}
.overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    transition: .5s ease;
    background: rgba(0,0,0, 0.5);
    align-items: center;}
#main a:hover {text-decoration: none;}

  /* item ceard*/
  .card-header{padding:15px;} 
  .card-body {padding:0 15px;}
  .card-footer{padding:15px 0;} 
  .border{border: 1px solid #e6e6e6;}
  /*.uk-grid{    margin-left: 0px;padding-left:0px;}
  .uk-grid>*{    padding:15px;}*/
.bed-slider-height{height:50%;}
.denim-feature{text-align:left;}
.denim-feature figure img{height:auto;}
.col-title {
    font-weight: 700;
    
    display: block;
    margin: 15px 0 5px;}
    .storage img {width: 100%; /* Will shrink image to 30% of its original width */
  height: auto; }
  .storage figure img {width: 100%; /* Will shrink image to 30% of its original width */
  height: auto; }
    .storage figcaption {text-align: center;}

    .item > a > figcaption {margin-top: 0.5em ;}

/*margin*/
.m-vert-lg{margin:50px 0 !important;}

/* terms*/
.terms {
  border: 1px solid #AAAAAA;
}
.terms, h4 {font-size: 1rem;}
.text-small{line-height: 0.3em;}
.terms_content ul {list-style: none}
.terms_content ul li::before {content: "- ";}
.terms h4 {
    margin: 0;
    padding: 5px 15px;
    padding-top: 5px;
    padding-right: 15px;
    padding-bottom: 5px;
    padding-left: 15px;
    cursor: pointer;
}
    .arrow_down img {padding-top:0;}

    .arrow_down {
  float: right;
}

.arrow_down img {
  width: 20px !important;
    padding-top: 5px;
    padding-left: 5px;
}

.arrow_up {
  float: right;
}

.arrow_up img {
  width: 20px !important;
    padding-top: 5px;
    padding-left: 5px;
}

.btn {padding-right:40px;}

/*mobile*/
 @media only screen and (max-width : 767px) {
  .btn {
    position: relative !important;padding-right:0;
}
  #visual{
  background-image: url(../img/kv-m.jpg);
   padding-top: 151.64%; 
  }
#mtg{background-image: url(../img/muji_mtg_sns.jpg);padding-top: 100%; }
 .timeline{ 
    display: block !important;
    max-width:200px; 
    margin:0 auto 50px;
  }
.m_adj {height:200px;}
.square:after {
   content: "";
  display: block;
  padding-bottom: 50%;
}
.kv h1{ font-size: 2em;padding: 0 0 87% 7%;}
.uk-card-body{padding:0; margin:1em 0;}

/*terms*/
.terms, p {font-size: 0.9em;}
  .terms_text{    width: 93%;
    display: inline-block;}
      .arrow_down img,.arrow_up img {padding-top:19px;}
}