.linknav {
  padding: 20px 0 5px;
  background-image: url(/coffee/images/bg-linknav-sp.jpg);
}
.linknav h2 {
  margin: 0 27px;
  font-size: 20px;
  color: #502515;
}
.linknav .latestTopic {
  margin: 0 27px 15px;
  font-size: 12px;
}
.linknav .latestTopic a {
  color: #502515;
}
.linknav .latestTopic a::after {
  content: "＞";
  padding-left: 3px;
}

.linknav ul {
  margin: 0 27px;
}
.linknav li {
  display: table;
  margin: 0 0 18px;
}
.linknav li a {
  display: block;
}
.linknav .linknavImg,
.linknav .linknavInfo {
  display: table-cell;
  vertical-align: top;
}
.linknav .linknavImg img {
  height: 70px;
  width: 70px;
}
.linknav .linknavDate,
.linknav .linknavTitle {
  margin: 0 0 5px 18px;
  line-height: 1.4;
  color: #502515;
}
.linknav .linknavDate {
  font-size: 10px;
}
.linknav .linknavTitle {
  font-size: 13.5px;
}
@media screen and (min-width: 910px) { /* PC用スタイル */
  .linknav {
    background-image: url(/coffee/images/bg-linknav.jpg);
  }
  .linknav h2,
  .linknav .latestTopic a {
    font-weight: bold;
  }
  .linknav h2 {
    margin: 0 60px 10px;
  }
  .linknav .latestTopic {
    font-size: 13px;
    margin: 0 60px 36px;
  }
  .linknav ul {
    margin: 0 45px;
  }
  .linknav ul::after {
    content: "";
    display: block;
    clear: both;
  }
  .linknav li {
    float: left;
    width: 33.333%;
    margin-bottom: 45px;
  }
  .linknav li a {
    margin: 0 15px;
  }
  .linknav .linknavImg img {
    height: 116px;
    width: 116px;
  }
  .linknav .linknavDate {
    font-size: 11px;
    margin-top: 15px;
  }
  .linknav .linknavTitle {
    font-size: 14px;
  }
}

/* ページ追加ごとにスタイルを追記する*/
/* body に付与された data-category 属性を用いて制御 */

/* 170111版 */
body[data-category="17Winter2_coffee_verona"] .linknav {
  background-image: url(/coffee/images/bg-linknav-sp-170111.png);
  background-size: 100% auto;
}
body[data-category="17Winter2_coffee_verona"] .linknav h2 {
  color: #742908;
}
@media screen and (min-width: 910px) { /* PC用スタイル */
  body[data-category="17Winter2_coffee_verona"] .linknav {
    background-image: url(/coffee/images/bg-linknav-170111.png);
  }
}

/* 161101版 */
body[data-category="17hoP1_coffee"] .linknav {
  background-image: url(/coffee/images/bg-linknav-sp-161101.jpg);
}
body[data-category="17hoP1_coffee"] .linknav h2 {
  color: #c8112f;
}
@media screen and (min-width: 910px) { /* PC用スタイル */
  body[data-category="17hoP1_coffee"] .linknav {
    background-image: url(/coffee/images/bg-linknav-161101.jpg);
  }
}

/* 161101版 */
body[data-category="17Spring1_coffee"] .linknav {
  background-image: url(/coffee/images/bg-linknav-sp-01.jpg);
}
@media screen and (min-width: 910px) { /* PC用スタイル */
  body[data-category="17Spring1_coffee"] .linknav {
    background-image: url(/coffee/images/bg-linknav-01.jpg);
  }
}

/* 161101版 */
body[data-category="17Summer2_iced_coffee"] .linknav {
  background-image: url(/coffee/images/bg-linknav-sp-01.jpg);
}
@media screen and (min-width: 910px) { /* PC用スタイル */
  body[data-category="17Summer2_iced_coffee"] .linknav {
    background-image: url(/coffee/images/bg-linknav-01.jpg);
  }
}

/* 170510 */
body[data-category="17Summer2_shaker"] .linknav {
  background-image: url(/coffee/images/bg-linknav-sp-01.jpg);
}
@media screen and (min-width: 910px) { /* PC用スタイル */
  body[data-category="17Summer2_shaker"] .linknav {
    background-image: url(/coffee/images/bg-linknav-01.jpg);
  }
}

/* 170714 */
body[data-category="17Summer4_coffee"] .linknav {
  background-image: url(/coffee/images/bg-linknav-170714-sp.jpg);
}
@media screen and (min-width: 910px) { /* PC用スタイル */
  body[data-category="17Summer4_coffee"] .linknav {
    background-image: url(/coffee/images/bg-linknav-170714.jpg);
  }
}

/* 170901 */
body[data-category="17Fall1_coffee"] .linknav {
  background: none;
}
@media screen and (min-width: 910px) { /* PC用スタイル */
  body[data-category="17Fall1_coffee"] .linknav {
    background: none;
  }
}