@charset "UTF-8";

.shopping-blc {
  max-width: 1000px;
  width: 100%;
  border: 1px solid #000;
  margin: 0 auto;
}

.shopping-blc > .list {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.shopping-blc > .list > li {
  position: relative;
  width: calc(100% / 3);
  box-sizing: border-box;
}

.shopping-blc > .list > li::after {
  position: absolute;
  top: 0;
  right: 0;
  content: '';
  width: 1px;
  height: 100%;
  display: block;
  background-color: #6f4e22;
}

.shopping-blc > .list > li:nth-child(3n+3)::after {
  display: none;
}

.shopping-blc > .list > li > a {
  position: relative;
  text-decoration: none;
  display: block;
  text-align: center;
  width: 100%;
  background-color: #f7f7f7;
  border-bottom: 1px solid #6f4e22;
  padding: 10px 15px;
  box-sizing: border-box;
}

.shopping-blc > .list > li > a.active {
  font-weight: 800;
  color: #6f4e22;
  background-color: #fff;
  border-bottom: none;
}

.shopping-blc > .cont {
  padding: 40px 4%;
}

.shopping-blc > .cont.hide {
  display: none;
}

.shopping-blc > .cont > .txt-blc {
  margin-bottom: 40px;
}

.shopping-blc > .cont > .txt-blc > .ttl {
  font-size: 120%;
  color: #7f5c2e;
  font-weight: 600;
  margin: 10px auto;
}

.shopping-blc > .cont > .txt-blc > .txt {
  font-size: 100%;
}

.shopping-blc > .cont > .txt-blc > .txt a {
  text-decoration: none;
  color: #7b613f;
  border-bottom: 1px solid #7b613f;
  transition: 300ms ease-in-out all;
}

.shopping-blc > .cont > .txt-blc > .txt a:hover {
  border-bottom: none;
}

.shopping-blc > .cont > .txt-blc > .txt > .tbl {
  max-width: 820px;
  width: 100%;
  border-collapse: collapse;
  margin: 15px auto;
}

.shopping-blc > .cont > .txt-blc > .txt > .tbl tr th,
.shopping-blc > .cont > .txt-blc > .txt > .tbl tr td {
  border-bottom: 1px solid #c9c9c9;
  padding: 8px 20px;
  box-sizing: border-box;
}

.shopping-blc > .cont > .txt-blc > .txt > .tbl tr:nth-last-child(1) th,
.shopping-blc > .cont > .txt-blc > .txt > .tbl tr:nth-last-child(1) td {
  border-bottom: none;
}

.shopping-blc > .cont > .txt-blc > .txt > .tbl tr th {
  text-align: center;
  width: 140px;
  background-color: #f7f7f7;
}

@media screen and (max-width:767px) {
  .shopping-blc > .cont > .txt-blc > .txt > .tbl tr th,
  .shopping-blc > .cont > .txt-blc > .txt > .tbl tr td {
    display: block;
    width: 100%;
  }
  .shopping-blc > .cont > .txt-blc > .txt > .tbl tr:nth-last-child(1) th, 
  .shopping-blc > .cont > .txt-blc > .txt > .tbl tr:nth-last-child(1) td {
    border-bottom: 1px solid #c9c9c9;
  }
  .shopping-blc > .list > li:first-child{
        line-height: 1.3;
        font-size: 85%;
  }
  .shopping-blc > .list > li a{
    padding: 5px 5px;
  }
  
}