@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap');

.award {
  font-family: "Noto Serif JP", serif;
  --gold : #9B832F;
  --sans : "Noto Sans JP", sans-serif;
  --yumin : "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
.award a {
  text-decoration: none;
}
.award a img:hover {
  opacity: initial;
}
.section_inner {
  width: min(100%, 1260px);
  margin: 0 auto;
  padding-inline: 30px;
}
.kotei_btn a {
  display: flex;
  flex-flow: column wrap;
  align-content: center;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
  background: #9D1616;
  border-radius: 300px;
  position: fixed;
  right: 16px;
  bottom: 100px;
  z-index: 3;
}
.kotei_btn a::before {
  content: "";
  display: inline-block;
  width: 72px;
  height: 72px;
  border: 1px solid #DDCD97;
  border-radius: 300px;
  position: absolute;
  right: 50%;
  bottom: 50%;
  translate: 50% 50%;
}
.kotei_btn a::after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  rotate: 45deg;
}
.kotei_img {
  width: 40px;
  margin-bottom: 5px;
}
.kotei_text {
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}
#mv img {
  width: 100%;
}

#lead {
  position: relative;
}
#lead::before,
#lead::after {
  content: "";
  display: inline-block;
  border-top: 60px solid #E2D178;
  border-left: 300px solid #E2D178;
  border-bottom: 60px solid transparent;
  border-right: 300px solid transparent;
  position: absolute;
  opacity: .43;
}
#lead::before {
  left: 0;
  top: 0;
}
#lead::after {
  rotate: 180deg;
  right: 0;
  bottom: 0;
}
.lead_inner {
  padding: 80px 30px 104px;
  text-align: center;
}
.lead_inner::before,
.lead_inner::after {
  content: "";
  display: inline-block;
  border-top: 112px solid #E2D178;
  border-left: 140px solid #E2D178;
  border-bottom: 112px solid transparent;
  border-right: 140px solid transparent;
  position: absolute;
  opacity: .43;
}
.lead_inner::before {
  left: 0;
  top: 0;
}
.lead_inner::after {
  rotate: 180deg;
  right: 0;
  bottom: 0;
}
.lead_title {
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 16px;
  padding-top: 100px;
  background: url(/img/usr/freepage/award2025/bar_short.png) no-repeat center top / 578px auto;
}
.lead_text {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 24px;
  .red_m {
    color: var(--accColor);
    font-size: 20px;
  }
  .red_l {
    color: var(--accColor);
    font-size: 24px;
  }
}
.lead_text p + p {
  margin-top: 24px;
}
.lead_note {
  color: #898989;
  font-size: 14px;
}

#campaign {
  padding-block: 72px 80px;
  background: url(/img/usr/freepage/award2025/bg02.jpg) no-repeat center / cover;
}
#campaign .section_inner {
  background: #fffd;
  padding: 40px;
  text-align: center;
}
.campaign_title {
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 24px;
  padding-top: 100px;
  background: url(/img/usr/freepage/award2025/bar_short.png) no-repeat center top / 578px auto;
}
.campaign_text {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 32px;
}
.campaign_content {
  font-family: var(--yumin);
  color: var(--gold);
  font-weight: 900;
  border-image: url(/img/usr/freepage/award2025/frame.jpg) 100 fill / 50px / 0 stretch;
  padding-block: 40px 20px;
  width: min(100%, 800px);
  margin-inline: auto;
  margin-bottom: 20px;
}
.campaign_content_wap1 {
  font-size: 36px;
}
.campaign_content_wap2 {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
}
.campaign_content_wap2_1 {
  font-size: 203px;
  line-height: 1;
}
.campaign_content_wap2_1 .unit {
  font-size: 132px;
  margin-right: -16px;
}
.campaign_content_wap2_2_1 {
  font-size: 103px;
  line-height: 1;
}
.campaign_content_wap2_2_2 {
  font-size: 45px;
}
.campaign_content_wap3 {
  font-size: 54px;
  line-height: 1;
}
.campaign_note {
  color: #868686;
  font-size: 14px;
  margin-bottom: 20px;
  display: flex;
  flex-flow: row wrap;
  align-content: center;
  justify-content: center;
  align-items: flex-start;
  gap: 8px 24px;
  width: min(100%, 800px);
  margin-inline: auto;
}
.campaign_btn {
  margin-bottom: 24px;
}
.campaign_btn a {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  width: min(68%, 472px);
  background: #9F1A1A;
  border-radius: 300px;
  margin-inline: auto;
  padding-block: 20px;
  color: #fff;
  font-family: var(--sans);
  font-size: 20px;
  font-weight: 700;
  gap: 12px;
}
.campaign_btn a::after {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  rotate: 45deg;
}
.campaign_link a {
  color: #426486;
  font-family: var(--sans);
  font-size: 18px;
  font-weight: 700;
  text-decoration: underline;
}


#content {
  background: url(/img/usr/freepage/award2025/bg01.png) repeat-y center top / contain;
  padding-top: 98px;
}
.content_title {
  text-align: center;
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 32px;
  padding-top: 100px;
  background: url(/img/usr/freepage/award2025/bar_long.png) no-repeat center top / 1200px auto;
}
.content_nav {
  margin-bottom: 16px;
}
.content_nav ul {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: stretch;
  gap: 8px;
}
.content_nav li {
  flex: 1;
}
.content_nav li a {
  display: flex;
  flex-flow: column wrap;
  align-content: center;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  border: 3px solid var(--gold);
  padding-block: 28px;
  color: var(--gold);
  font-size: 20px;
  font-weight: 800;
}
.content_nav li a::after {
  content: "部門賞";
}
.nav_icon {
  height: 48px;
  margin-bottom: 12px;
}
.nav_icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.nav_text {
  font-size: 32px;
}
.content_wrap {
  padding-block: 80px 56px;
  position: relative;
  text-align: center;
}
.content_wrap::before {
  content: "";
  display: inline-block;
  width: 100vw;
  height: calc(100% - 344px);
  background: #F8F6E9;
  opacity: .8;
  position: absolute;
  right: 50%;
  bottom: 0;
  translate: 50% 0%;
}
.content_wrap_title {
  margin-bottom: 32px;
  padding-inline: 88px;
  display: inline-block;
  border-image: url(/img/usr/freepage/award2025/deco02.png) 42 128 fill / 21px 64px / 0 stretch;
  height: 42px;
  font-size: 40px;
  font-weight: 700;
  line-height: 42px;
}
.content_item {
  position: relative;
  text-align: left;
  font-family: var(--sans);
}
.content_item ul {
  gap: 16px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(288px, 1fr));
}
.content_item li {
  flex: 1;
  background: #fff;
  border: 1px solid #F4F4F4;
  padding: 12px 12px 20px;
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 2;
}
.content_item li a {
  position: relative;
  display: flex;
  flex-flow: column wrap;
  justify-content: flex-start;
  align-content: center;
  align-items: flex-start;
}
.item_num {
  color: var(--gold);
  font-size: 20px;
  font-weight: bold;
  font-style: normal;
  line-height: 1;
  width: 40px;
  height: 38px;
  position: absolute;
  top: 0;
  left: 0;
  background: #FFF;
  border-radius: 0 0 12px 0;
  text-shadow: none;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: center;
  align-items: center;
}
.item_img {
  margin-bottom: 12px;
}
.item_review {
  display: inline-block;
  font-size: 16px;
  color: #CCCCCC;
  position: relative;
}
.item_review[score="3.0"],.item_review[score="3"] {--score:3;}
.item_review[score="3.1"] {--score:3.1;}
.item_review[score="3.2"] {--score:3.2;}
.item_review[score="3.3"] {--score:3.3;}
.item_review[score="3.4"] {--score:3.4;}
.item_review[score="3.5"] {--score:3.5;}
.item_review[score="3.6"] {--score:3.6;}
.item_review[score="3.7"] {--score:3.7;}
.item_review[score="3.8"] {--score:3.8;}
.item_review[score="3.9"] {--score:3.9;}
.item_review[score="4.0"],.item_review[score="4"] {--score:4;}
.item_review[score="4.1"] {--score:4.1;}
.item_review[score="4.2"] {--score:4.2;}
.item_review[score="4.3"] {--score:4.3;}
.item_review[score="4.4"] {--score:4.4;}
.item_review[score="4.5"] {--score:4.5;}
.item_review[score="4.6"] {--score:4.6;}
.item_review[score="4.7"] {--score:4.7;}
.item_review[score="4.8"] {--score:4.8;}
.item_review[score="4.9"] {--score:4.9;}
.item_review[score="5.0"] {--score:5;}
.item_review[score="0"],.item_review[score=""] {opacity: 0;}

.item_review::before {
  content: "★★★★★";
  display: inline-block;
  width: calc(20% * var(--score));
  white-space: nowrap;
  overflow: hidden;
  color: #C7A276;
  position: absolute;
  left: 0;
  top:50%;
  translate: 0% -50%;
}
.item_review::after {
  content: "（" attr(count) "）";
  color: #000;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  position: absolute;
  left: 100%;
  top: 50%;
  translate: 0% -50%;
}
.item_brand {
  width: 100%;
  color: #909090;
  font-size: 14px;
  font-weight: 700;
  border-bottom: 1px solid #909090;
  margin-bottom: 10px;
  padding-bottom: 2px;
}
.item_name {
  color: #000;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 8px;
}
.item_price {
  color: #000;
  font-size: 18px;
  font-weight: 700;
  margin-top: auto;
}
.item_price::after {
  content: "円(税込)";
  font-size: 12px;
  margin-left: 2px;
}
.comment_title {
  display: inline-block;
  background: #B79C3F;
  padding: 3px 10px;
  color: #fff;
  font-size: 12px;
  position: relative;
}
.comment_title::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 100%;
  background: #B79C3F;
  position: absolute;
  left: 100%;
  top: 0;
  transform: skewX(34deg);
  translate: -50% 0%;
}
.comment_content {
  border-top: 1px solid #B79C3F;
  padding-top: 12px;
  margin-top: -1px;
}
.comment_content dl {
  background: #FFFBEB;
  padding: 8px 12px 12px;
}
.comment_content dl + dl {
  margin-top: 8px;
}
.comment_content dt {
  color: #C1A135;
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 4px;
}
.comment_content dd {
  color: var(--gold);
  font-size: 12px;
  font-weight: 600;
}


#desc {
  position: relative;
  background: #FAFAFA;
}
#desc::before,
#desc::after {
  content: "";
  display: inline-block;
  border-top: 60px solid #E2D178;
  border-left: 300px solid #E2D178;
  border-bottom: 60px solid transparent;
  border-right: 300px solid transparent;
  position: absolute;
  opacity: .43;
}
#desc::before {
  left: 0;
  top: 0;
}
#desc::after {
  rotate: 180deg;
  right: 0;
  bottom: 0;
}
.desc_inner {
  padding: 88px 30px 160px;
}
.desc_inner::before,
.desc_inner::after {
  content: "";
  display: inline-block;
  border-top: 112px solid #E2D178;
  border-left: 140px solid #E2D178;
  border-bottom: 112px solid transparent;
  border-right: 140px solid transparent;
  position: absolute;
  opacity: .43;
}
.desc_inner::before {
  left: 0;
  top: 0;
}
.desc_inner::after {
  rotate: 180deg;
  right: 0;
  bottom: 0;
}
.desc_title {
  text-align: center;
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 40px;
  padding-top: 94px;
  background: url(/img/usr/freepage/award2025/bar_short.png) no-repeat center top / 578px auto;
}
.desc_content {
  display: flex;
  flex-flow: column wrap;
  gap: 24px;
  width: min(100%, 880px);
  margin: 0 auto;
  background: #fff;
  border: 1px solid var(--gold);
  padding: 40px;
  font-family: var(--sans);
}
.desc_content dl {
  padding-inline: 14px;
}
.desc_content dt {
  font-size: 24px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 8px;
  position: relative;
}
.desc_content dt::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 24px;
  background: #B79C40;
  position: absolute;
  left: -14px;
  top: 50%;
  translate: 0 -50%;
}
.desc_content dd {
  font-size: 16px;
  font-weight: 500;
}
.desc_wrap {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: flex-start;
  padding-right: 56px;
}
.desc_btn {
  margin-top: 16px;
}
.desc_btn a {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  width: 100%;
  background: #9F1A1A;
  border-radius: 300px;
  margin-inline: auto;
  padding-block: 20px;
  color: #fff;
  font-family: var(--sans);
  font-size: 20px;
  font-weight: 700;
  gap: 12px;
}
.desc_btn a::after {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  rotate: 45deg;
}
.desc_innote {
  font-size: 14px;
}
.desc_note p {
  color: #6A6A6A;
  font-size: 14px;
}

html[data-browse-mode=P] .desc_btn2 a {
  transition: .3s;
}
html[data-browse-mode=P] .desc_btn2 a:hover {
  opacity: .7;
}


html[data-browse-mode=S] #lead::before,
html[data-browse-mode=S] #lead::after,
html[data-browse-mode=S] #desc::before,
html[data-browse-mode=S] #desc::after {
    border-inline-width: 94px;
    border-block-width: 18px;
}
html[data-browse-mode=S] .lead_inner::before,
html[data-browse-mode=S] .lead_inner::after,
html[data-browse-mode=S] .desc_inner::before,
html[data-browse-mode=S] .desc_inner::after{
    border-inline-width: 48px;
    border-block-width: 28px;
}
html[data-browse-mode=S] .section_inner {
    padding-inline: 20px;
}
html[data-browse-mode=S] .lead_inner {
    padding: 40px 20px 77px;
}

html[data-browse-mode=S] .lead_title {
    font-size: 22px;
    margin-bottom: 19px;
    padding-top: 57px;
    background-size: min(100%, 335px) auto;
}
html[data-browse-mode=S] .lead_text {
    font-size: 14px;
    margin-bottom: 21px;
}
html[data-browse-mode=S] .lead_text .red_l {
    font-size: 18px;
}
html[data-browse-mode=S] .lead_text .red_m {
    font-size: 16px;
}
html[data-browse-mode=S] .lead_text p + p {
    margin-top: 21px;
}
html[data-browse-mode=S] .lead_note {
    text-align: left;
    font-size: 11px;
}


html[data-browse-mode=S] section#campaign {
    padding-block: 32px 40px;
}
html[data-browse-mode=S] #campaign .section_inner {
    padding: 20px;
}
html[data-browse-mode=S] h2.campaign_title {
font-size: 22px;
margin-bottom: 16px;
padding-top: 57px;
background-size: min(100%, 335px) auto;
}
html[data-browse-mode=S] .campaign_text {
    font-size: 13px;
    margin-bottom: 22px;
}
html[data-browse-mode=S] .campaign_content {
    padding: 28px 22px 20px;
    margin-bottom: 11px;
    border-image-width: 40px;
}
html[data-browse-mode=S] .campaign_content_wap1 {
    font-size: 20px;
}
html[data-browse-mode=S] .campaign_content_wap2_1 {
    font-size: 90px;
}
html[data-browse-mode=S] .campaign_content_wap2_1 .unit {
    font-size: 44px;
    margin-right: -12px;
}
html[data-browse-mode=S] .campaign_content_wap2_2_1 {
    font-size: 43px;
}
html[data-browse-mode=S] .campaign_content_wap2_2_2 {
    font-size: 18px;
}
html[data-browse-mode=S] .campaign_content_wap3 {
    font-size: 26px;
}
html[data-browse-mode=S] .campaign_note {
  font-size: 10px;
  line-height: 1;
}
html[data-browse-mode=S] .campaign_btn {
    margin-bottom: 15px;
}
html[data-browse-mode=S] .campaign_btn a {
    padding-block: 12px;
    font-size: 16px;
    gap: 6px;
}
html[data-browse-mode=S] .campaign_link a {
    font-size: 12px;
}
html[data-browse-mode=S] #content {
    padding-top: 40px;
}

html[data-browse-mode=S] .content_title {
    font-size: 22px;
    margin-bottom: 24px;
    padding-top: 57px;
    background-image: url(/img/usr/freepage/award2025/bar_short.png);
    background-size: min(100%, 335px) auto;
}

html[data-browse-mode=S] .content_nav {
    margin-bottom: 8px;
}

html[data-browse-mode=S] .content_nav ul {
    gap: 16px;
}
html[data-browse-mode=S] .content_nav li {
    flex: initial;
    width: calc(50% - 8px);
}
html[data-browse-mode=S] .content_nav li a {
  padding-block: 16px;
  border-width: 2px;
  font-size: 20px;
}
html[data-browse-mode=S] .nav_icon {
    height: 42px;
    margin-bottom: 0;
}
html[data-browse-mode=S] .nav_text {
    font-size: 28px;
    line-height: 1.4;
}
html[data-browse-mode=S] .content_wrap {
    padding-block: 54px 40px;
}
html[data-browse-mode=S] .content_wrap::before {
    height: calc(100% - 257px);
}
html[data-browse-mode=S] .content_wrap_title {
    font-size: 24px;
    margin-bottom: 20px;
    padding-inline: 55px;
    border-image-width: 12px 37px;
    height: 24px;
    line-height: 24px;
}
html[data-browse-mode=S] .content_item ul {
    flex-wrap: nowrap;
    overflow: auto;
    justify-content: flex-start;
    margin-right: -20px;
    padding-bottom: 24px;
    scrollbar-color: #C4B16D #EAE2C9;
    scrollbar-width: thin;
    grid-auto-flow: column;
}
html[data-browse-mode=S] .content_item li {
    flex: none;
    width: min(296px, 100vw - 40px);
}

html[data-browse-mode=S] .desc_inner {
    padding: 40px 20px 64px;
}
html[data-browse-mode=S] .desc_title {
    font-size: 22px;
    margin-bottom: 20px;
    padding-top: 57px;
    background-size: min(100%, 335px) auto;
}
html[data-browse-mode=S] .desc_content {
    padding: 20px 16px 45px;
    gap: 20px;
}
html[data-browse-mode=S] .desc_content dl {
    padding-inline: 8px;
    width: 100%;
}
html[data-browse-mode=S] .desc_content dt {
    font-size: 14px;
    margin-bottom: 6px;
}
html[data-browse-mode=S] .desc_content dt::before {
    width: 4px;
    height: 14px;
    left: -8px
}
html[data-browse-mode=S] .desc_content dd {
    font-size: 12px;
}
html[data-browse-mode=S] .desc_wrap {
    gap: 20px;
    padding: 0;
}
html[data-browse-mode=S] .desc_btn a {
    width: calc(100% + 16px);
    margin-inline: -8px;
    padding-block: 13px;
    font-size: 14px;
    gap: 8px;
}
html[data-browse-mode=S] .desc_note p {
    font-size: 11px;
}