@media (min-width: 1024px) {
  .pc {
    display: block;
  }
}

@media (max-width: 480px) {
  .pc {
    display: none;
  }
}

@media (min-width: 1024px) {
  .sp {
    display: none;
  }
}

@media (max-width: 480px) {
  .sp {
    display: block;
  }
}

.compareTable {
  background: -webkit-gradient(linear, left top, right top, color-stop(50%, #d1b37f), color-stop(50%, #dcc495));
  background: linear-gradient(to right, #d1b37f 50%, #dcc495 50%);
  background-size: 10px 10px;
  padding-bottom: 1px;
  position: relative;
  padding-top: 100px;
  margin-top: 50px;
}

@media (max-width: 480px) {
  .compareTable {
    max-width: none;
    width: calc(100% + 4vw);
    margin-left: -2vw;
    padding-top: 17vw;
    margin-top: 7vw;
  }
}

.compareTable .table_title {
  position: absolute;
  top: -50px;
  width: 100%;
}

@media (max-width: 480px) {
  .compareTable .table_title {
    top: -7vw;
  }
}

.compareTable table {
  width: 96%;
  margin: 0 auto 1rem;
  background-color: #fff;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

.compareTable table tr th,
.compareTable table tr td {
  text-align: center;
  vertical-align: middle;
  padding: 0.5em 0;
  line-height: 1em;
}

.compareTable table tr th {
  background: -webkit-gradient(linear, left top, left bottom, from(#ffeea7), to(#f8de97));
  background: linear-gradient(#ffeea7, #f8de97);
  color: #333;
  text-shadow: 1px 1px 0 #fff;
}

@media (max-width: 480px) {
  .compareTable table tr th {
    font-size: 3.5vw;
  }
}

.compareTable table tr td {
  font-size: 20px;
}

@media (max-width: 480px) {
  .compareTable table tr td {
    font-size: 4vw;
  }
}

.compareTable table tr td:not(:last-child) {
  border-right: solid 1px #eee;
}

.compareTable table tr td:not(:last-child):first-child {
  background-color: #fffef0;
}

.compareTable table tr td.tableMark {
  padding-top: calc(25px + .7em);
  background-position: center .5em;
  background-repeat: no-repeat;
  background-size: 25px 25px;
}

@media (max-width: 480px) {
  .compareTable table tr td.tableMark {
    padding-top: calc(4vw + .7em);
    background-size: 4vw;
  }
}

.compareTable table tr td.tableMark_4 {
  background-image: url(/wp-content/themes/wakuwaku-work/table/img/mark4.png);
}

.compareTable table tr td.tableMark_3 {
  background-image: url(/wp-content/themes/wakuwaku-work/table/img/mark3.png);
}

.compareTable table tr td.tableMark_2 {
  background-image: url(/wp-content/themes/wakuwaku-work/table/img/mark2.png);
}

.compareTable table tr td.tableMark_1 {
  background-image: url(/wp-content/themes/wakuwaku-work/table/img/mark1.png);
}

.compareTable table tr td .table_safety {
  margin: 0 auto;
  background: #ddd;
  border: solid 2px #999;
  color: #999;
  border-radius: 5px;
  width: 96%;
}

.compareTable table tr td .table_safety:not(:last-child) {
  margin-bottom: .3em;
}

.compareTable table tr td .table_safety_ON {
  border-color: #d9330d;
  color: #fff;
  background: #ff5a5a;
}

.compareTable table tr td .td_bottom {
  font-size: .8em;
  color: #ff5a5a;
}

@media (max-width: 480px) {
  .compareTable table tr td:nth-child(3) {
    border-right: 0px;
  }
}

@media (max-width: 480px) {
  .compareTable table tr td:nth-child(4), .compareTable table tr td:nth-child(5) {
    display: none;
  }
}

.compareTable table tr:first-child td {
  background-color: #62422a !important;
  color: #fff;
}

.compareTable table tr.tr_name td {
  font-size: 15px;
}

@media (max-width: 480px) {
  .compareTable table tr.tr_name td {
    font-size: 4vw;
  }
}

.compareTable table tr.tr_name td:first-child {
  position: relative;
}

.compareTable table tr.tr_name td:first-child::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100px;
  background-image: url(/wp-content/themes/wakuwaku-work/table/img/recommend.png);
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: contain;
  bottom: 2.5em;
  left: -1em;
  -webkit-transform: rotate(-5deg);
          transform: rotate(-5deg);
}

@media (max-width: 480px) {
  .compareTable table tr.tr_name td:first-child::before {
    bottom: auto;
    height: 8vw;
    top: -7vw;
    left: -2vw;
    background-position: top;
  }
}

.compareTable table tr.tr_img td {
  position: relative;
}

.compareTable table tr.tr_img td::before {
  content: '';
  width: 40px;
  height: 55px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left;
  position: absolute;
  top: -5px;
  left: -5px;
}

.compareTable table tr.tr_img td:nth-child(1)::before {
  background-image: url(/wp-content/themes/wakuwaku-work/images/ranking/rank1.png);
}

.compareTable table tr.tr_img td:nth-child(2)::before {
  background-image: url(/wp-content/themes/wakuwaku-work/images/ranking/rank2.png);
}

.compareTable table tr.tr_img td:nth-child(3)::before {
  background-image: url(/wp-content/themes/wakuwaku-work/images/ranking/rank3.png);
}

.compareTable table tr.tr_img td:nth-child(4)::before {
  background-image: url(/wp-content/themes/wakuwaku-work/images/ranking/rank4.png);
}

.compareTable table tr.tr_img td:nth-child(5)::before {
  background-image: url(/wp-content/themes/wakuwaku-work/images/ranking/rank5.png);
}

.compareTable table tr.tr_img td img {
  width: 100%;
}

@media (max-width: 480px) {
  .compareTable table tr.tr_img td img {
    width: 80%;
  }
}

.compareTable table tr.tr_point td {
  padding: 3px;
}

.compareTable table tr.tr_point td::after {
  content: "pt";
  font-size: .7em;
}

.compareTable table tr.tr_point td:first-child {
  font-size: 2em;
  color: #ff5a5a;
}

@media (max-width: 480px) {
  .compareTable table tr.tr_point td:first-child {
    font-size: 1.5em;
  }
}

.compareTable table tr.tr_target td {
  font-size: 15px;
  vertical-align: top;
}

@media (max-width: 480px) {
  .compareTable table tr.tr_target td {
    font-size: 3.3vw;
  }
}

.compareTable table tr.tr_material td {
  font-size: 13px;
}

@media (max-width: 480px) {
  .compareTable table tr.tr_material td {
    font-size: 3vw;
  }
}

.compareTable table tr.tr_place td {
  font-size: 15px;
}

@media (max-width: 480px) {
  .compareTable table tr.tr_place td {
    font-size: 3.3vw;
  }
}

.compareTable table tr.tr_btn td a {
  display: block;
  width: 96%;
  margin: 0 auto;
  background: #8cd691;
  border: #7dbb81 solid 3px;
  border-radius: 10px;
  -webkit-box-shadow: 0px 3px 0px #7dbb81;
          box-shadow: 0px 3px 0px #7dbb81;
  color: #f0f8ff;
  padding: 1em 0;
  text-decoration: none;
}

.compareTable table tr.tr_btn td:first-child a {
  -webkit-animation: table_no1_btn 2.5s infinite;
          animation: table_no1_btn 2.5s infinite;
  background: linear-gradient(-60deg, #8cd691 40%, #acf6b1 50%, #8cd691 60%, #8cd691 100%);
  background-size: 500% 300%;
  background-position: 300% 50%;
}

@media (min-width: 1024px) {
  .compareTable table.table_ranking_3 tr td .table_safety {
    width: 75%;
  }
  .compareTable table.table_ranking_3 tr.tr_name td {
    font-size: 1.2rem;
  }
  .compareTable table.table_ranking_3 tr.tr_name td:first-child::before {
    width: 70%;
  }
  .compareTable table.table_ranking_3 tr.tr_img td img {
    width: 75%;
  }
  .compareTable table.table_ranking_3 tr.tr_btn td a {
    width: 75%;
  }
}

@media (max-width: 480px) {
  #contentArea, #contentArea p, #contentArea a, #contentArea ul {
    font-size: 3.5vw !important;
  }
}
/*# sourceMappingURL=style.css.map */