img {
  display: block;
  width: 100%;
  height: auto;
}
/*商品清單*/
.l-list{
  list-style-type: none;
  max-width:740px;
}
.l-list .card {
  margin: 0 0 20px 20px;
  width:350px;
}
@media all and (min-width: 768px) and (max-width: 991px)  { /*ipad*/
    .l-list .card {
        margin: 0 0 20px 10px;
    }
 }
@media all and (max-width: 480px) {
    .l-list .card {
        margin: 0 0 20px 0px;
    }
}
.l-list .card__img {
  position: relative; 
  height:200px;
  width:350px;
}
.l-list .card__img img{
    height:120px;
    width:120px;
}
.l-list .card__img .label {
  position: absolute;
  left: 20px;
  top: 0;
  color: #eaf0ed;
  font-weight: bold;
  letter-spacing: 5px;
  writing-mode: vertical-lr;
  text-align: center;
  padding: 10px;
}
.l-list .card__img .favorite {
  position: absolute;
  width: 165px;
  bottom: 0px;
  left: 0px;
}
/*.l-list .card__img .favorite:hover {
  opacity: 0.6;
}*/
.l-list .card__body {
  color: var(--c-base);
  text-align: center;
}
.l-list .card__body > * {
  border: solid 1px #eaf0ed;
  border-collapse: collapse;
}
.l-list .card__title {
  font-size: 20px;
  font-weight: bold;
  padding: 14px 0;
}
.l-list .card__price {
  width: 125px;
  font-size: 20px;
  font-weight: bold;
  padding: 10px 0px;
  color: var(--c-third);
  text-align:center;
}
.l-list .card__triangle {
  height: 0;
  width: 0;
  border-width: 47px 0 0 40px ;
  border-style: solid;
  border-color: transparent transparent transparent var(--c-eighth);
}
.l-list .card__content {
  font-size: 16px;
  line-height: 24px;
  padding: 14px 0px;
  white-space:pre;
}
.l-list .card .addcart {
  font-size: 24px;
  color: var(--c-third);
  padding: 16px 0px;
  display: block;
  text-decoration: none;
  font-weight: bold;
  text-align: center;
}
.l-list .card .addcart:hover {
  background: var(--c-eighth);
}
/*modal*/
.modal-title{
    font-size: 20px;
    color: var(--c-base);
}
.table .tab__head{
    font-weight: bold;
    color: white;
}
.table .tab__content{
    font-size: 16px;
    vertical-align:middle;
    white-space:pre-line;
}
.table .tab__content .tab__img{
  height:50px;
  width:90px;
}
.table .tab__content .tab__img img{
    height:30px;
    width:30px;
}
.table .tab__border-bottom td{
    border-top: 0px;
    border-bottom:1px solid var(--c-fifteenth);
}
.table .tab__footer td{
    border-top: 0px;
    background: var(--c-eighth);
}

/*form*/
.form__title{
    font-weight: bold;
    color: var(--c-base);
    text-align: center;
    padding:10px;
    font-size: 24px;
}
.form__group{
    margin-bottom: 15px;
    width:320px;
    display:flex;
    flex-direction:row;
    align-items:center;
}
.form__group .group_title{
    width:30%;
}
.form__group .group_content{
    width:70%;
}
.form__group .group_title_txt{
    font-weight: bold;
    color: var(--c-base);
    font-size: 18px;
}
.form_btn{
    display:flex;
    flex-direction:row;
    justify-content:center;

}
.t-list{
    margin-bottom:50px;
}
.t-list li{
  list-style-type: none;
}
.t-list .list-header{
    height:40px;
}
.t-list .list-body{
    line-height:35px;
}
.t-list .shadow{
    box-shadow:5px 5px 5px var(--c-fifteenth);
}
.t-list .border{
    border-bottom:1px solid var(--c-fifteenth);
}
.t-list .list-card{
    height: auto;
    margin: 10px 0 20px 0;
    border-bottom:1px solid var(--c-fifteenth);
}
.t-list .list-card img{
    height:50px;
    width:50px;
}
.t-list .list-col li{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.t-list .list-title{
    font-weight: bold;
    color: white;
    font-size: 20px;
}
.t-list .list-content{
    color: var(--c-base);
    font-size: 16px;
}
.t-list .list-card .list-card_title{
    font-weight: bold;
    color:var(--c-third);
}
.t-list .col-5{
    width:5%;
}
.t-list .col-10{
    width:10%;
}
.t-list .col-20{
    width:20%;
}
.t-list .col-25{
    width:25%;
}
.t-list .col-30{
    width:30%;
}
.t-list .col-35{
    width:35%;
}
.t-list .col-50{
    width:50%;
}
.t-list .col-60{
    width:60%;
}
.t-list a{
  text-decoration: none;
  color: var(--c-primary);
  font-size: 25px;
}

/*側邊商品分類菜單*/
.asideMenu {
  text-align: center;
  font-weight: bold;
  font-size: 24px;
  width:250px;
  margin-bottom:20px;
}

@media all and (min-width: 992px) and (max-width: 1199px) {
    .asideMenu{
        width:200px;
    }
}
@media all and (min-width: 768px) and (max-width: 991px)  { /*ipad*/
    .asideMenu{
        width:200px;
    }
 }

.asideMenu > * {
  border: solid 1px #eaf0ed;
  border-collapse: collapse;
}
.asideMenu__title {
  color: white;
  padding: 16px 0px;
}
.asideMenu a {
  text-decoration: none;
  color: var(--c-third);
  padding: 16px 0;
  display: block;
}
.asideMenu a:hover {
  background: var(--c-eighth);
}
.asideMenu li{
    list-style-type: none;
}
.asideMenu--focus{
    background: var(--c-fifth);
}
/*tab分頁*/
.tab-pagination li{
  display:flex;  
  flex-direction:column;
  justify-content:center;  
  border-top-left-radius:20px;
  border-top-right-radius:20px; 
  width:200px;
  height:40px;  
  text-align:center;
  align-items:center;
}
.tab-pagination a{
    text-decoration:none;
    color:#333;
  display:flex;  
  flex-direction:column;
  justify-content:center;   
  width:180px;
  height:25px;
  font-weight:bold;
  font-size:20px;
  border-radius:30px;
  background:#ffff;  
}