@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;400;600;700&display=swap");

#hokkaido2022 .mrb0 {
  margin-bottom: 0 !important;
}
#hokkaido2022 .mrb5 {
  margin-bottom: 5px;
}
#hokkaido2022 .w100 {
  width: 100%;
}

#hokkaido2022 .textCenter {
  text-align: center;
}

#hokkaido2022 .textLeft {
  text-align: left;
}

#hokkaido2022 .textRight {
  text-align: right;
}

#hokkaido2022 a:hover {
  text-decoration: none;
}

#hokkaido2022 .block {
  display: block;
}

#hokkaido2022 .clearboth {
  clear: both;
}

#hokkaido2022 .bold {
  font-weight: bold;
}

#hokkaido2022 *,
#hokkaido2022 *:before,
#hokkaido2022 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#hokkaido2022 .brTb {
  display: none;
}

#hokkaido2022 .brXs {
  display: none;
}

#hokkaido2022 .brSp {
  display: none;
}

#hokkaido2022 .hasWebLimited {
  position: relative;
}

#hokkaido2022 .flexColumn3 .hasWebLimited::before {
  transform: scale(0.85);
}

#hokkaido2022 .flexColumn2,
#hokkaido2022 .flexColumn3 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

#hokkaido2022 .flexColumn2 .item {
  width: calc((100% - 70px) / 2);
}

#hokkaido2022 .flexColumn2 .item:not(:nth-child(2n)) {
  margin-right: 20px;
}

#hokkaido2022 .flexColumn2 .item:nth-last-child(n + 3) {
  margin-bottom: 20px;
}

#hokkaido2022 .sectionItem .content {
  padding: 0 60px;
}

#hokkaido2022 .sectionItem .flexColumn3 .item {
  margin-bottom: 25px;
  width: calc((100% - (15px * 2)) / 3);
}

#hokkaido2022 .sectionItem .flexColumn3 .item:not(:nth-child(3n)) {
  margin-right: 15px;
}

#hokkaido2022 .sectionItem .flexColumn3 .item:nth-last-child(n + 5) {
  margin-bottom: 25px;
}

#hokkaido2022 .sectionItem .flexColumn3 {
  margin-bottom: 25px;
}
#hokkaido2022 .highlight .item-r {
  width: 398px;
  margin-left: 20px;
}
#hokkaido2022 .highlight .item a {
  align-items: center;
  display: flex;
  justify-content: flex-start;
}
#hokkaido2022 #tentou .viewAll,
#hokkaido2022 #haisou .viewAll {
  margin-top: 30px;
}

#hokkaido2022 .highlight .itemImg {
  width: calc((560 / 980) * 100%);
}
#hokkaido2022 .highlight .bento-01 {
  position: absolute;
     right: -43px;
    top: 50px;
    width: 763px;
}
#hokkaido2022 .highlight .bento-02 {
  width: 598px;
}
#hokkaido2022 .highlight .bento-03 {
  width: 601px;
}
#hokkaido2022 .highlight .bento-04 {
  left: -24px;
  position: absolute;
  top: 16px;
  width: 580px;
}

#hokkaido2022 .highlight .itemImg img {
  margin: 0 auto;
}

#hokkaido2022 .highlight .item:first-child .itemInfo {
  margin-top: 300px;
  width: 322px;
}

#hokkaido2022 .highlight .item:nth-child(3) .itemInfo {
  width: 330px !important;
}
#hokkaido2022 .highlight .item:nth-child(4) {
  margin-bottom: 108px;
}
#hokkaido2022 .highlight .item:nth-child(4) .itemInfo {
  margin-top: 20px;
}

#hokkaido2022.hokkaido2022 .sectionItem .contentHighlight {
  margin-bottom: 0;
}

#hokkaido2022.hokkaido2022 .sectionHighlight .highlight .itemInfo {
  margin-bottom: 30px;
}

#hokkaido2022 .bgFFF7F1 {
  background-color: #fff7f1;
}

#hokkaido2022 .bgfbf1f4 {
  background-color: #fbf1f4;
}

#hokkaido2022 .bgfcf7e1 {
  background-color: #fcf7e1;
}

#hokkaido2022 .bgc54845 {
  background-color: #c54845;
}

#hokkaido2022 .bgb55501 {
  background-color: #b55501;
}

#hokkaido2022 .bg4B241D {
  background-color: #4b241d;
}

#hokkaido2022 .title .h3 {
  text-align: center;
}

#hokkaido2022 .titleH3 {
  margin-bottom: 38px;
  padding: 38px 0;
  text-align: center;
}
#hokkaido2022 .sectionTentou .titleH3 {
  background-color: #f2e8be;
}
#hokkaido2022 .sectionHaisou .titleH3 {
  background-color: #ffe4e4;
}

#hokkaido2022 .titleH3 .h3 {
  align-items: center;
  color: #a83b59;
  display: flex;
  font-size: 60px;
  font-weight: 600;
  justify-content: center;
  letter-spacing: 0.1em;
  line-height: 1.2;
}

#hokkaido2022 .titleH3 .h3 .small {
  font-size: 30px;
}
#hokkaido2022 .titleH3 p.small {
  font-size: 18px;
  font-weight: 400;
}

#hokkaido2022 .titleH3Item .h3 {
  background-position: left 0 top 80%, right 0 top 80%;
  background-repeat: no-repeat, no-repeat;
  display: inline-block;
  margin-bottom: 6px;
  padding: 0 39px 0 47px;
}
#hokkaido2022 .placeAttention {
  background-image: url(icon_attention.svg);
  background-position: 0 65%;
  background-repeat: no-repeat;
  background-size: 25px 25px;
  color: #4b241d;
  display: inline-block;
  font-size: 25px;
  letter-spacing: inherit;
  line-height: 1.4;
  margin-bottom: 0;
  padding-left: 30px;
}
#hokkaido2022 .sectionTentou .titleH3Item .h3 {
  background-image: url(icon_store.png), url(icon_store.png);
  background-size: 55.6px 40px, 55.6px 40px;
  color: #78461f;
  width: 760px;
}
#hokkaido2022 .sectionHaisou .titleH3Item .h3 {
  background-image: url(icon_track.png), url(icon_track.png);
  background-size: 53.49px 38px, 53.49px 38px;
  color: #df758e;
  width: 760px;
}
#hokkaido2022 .titleH3 p {
  font-size: 24px;
  font-weight: 600;
}
#hokkaido2022 .sectionTentou .titleH3 p {
  color: rgba(120, 70, 31, 0.8);
}
#hokkaido2022 .sectionHaisou .titleH3 p {
  color: rgba(78, 32, 44, 0.8);
}

#hokkaido2022 .button a {
  align-items: center;
  background-color: #bb3939;
  color: #fff;
  display: flex;
  flex-wrap: wrap;
  font-size: 22px;
  height: 60px;
  justify-content: center;
  padding: 0 10px;
  width: 100%;
}

#hokkaido2022 .sectionItem {
  padding-bottom: 40px;
}

#hokkaido2022 .sectionHasInner {
  padding: 10px;
}

#hokkaido2022 .sectionItem {
  background-image: url(bg-stripe01.svg);
  position: relative;
  z-index: 0;
}

#hokkaido2022 .sectionItem::before {
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  display: inline-block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

#hokkaido2022 .sectionHighlight::before {
  background-image: url(bg-section01.png);
}

#hokkaido2022 .sectionItem:nth-child(5)::before {
  background-image: url(bg-section03.png);
}

#hokkaido2022 .sectionItem:nth-child(7)::before {
  background-image: url(bg-section03.png);
}

#hokkaido2022 .sectionItem:nth-child(9)::before {
  background-image: url(bg-section03.png);
}

#hokkaido2022 .sectionItem:nth-child(6)::before {
  background-image: url(bg-section04.png);
}

#hokkaido2022 .sectionItem:nth-child(8)::before {
  background-image: url(bg-section04.png);
}

#hokkaido2022 .navigation {
  background-color: #fcf7e1;
  padding: 25px;
}

#hokkaido2022 .anchorLinks {
  display: flex;
  font-weight: 500;
  letter-spacing: 0.1em;
  margin-bottom: 10px;
}

#hokkaido2022 .anchorLinks .anchorLinkBtn {
  height: 60px;
  width: calc((100% - (15px * 2)) / 3);
}

#hokkaido2022 .anchorLinks .anchorLinkBtn:not(:nth-child(3n)) {
  margin-right: 15px;
}

#hokkaido2022 .anchorLinks .anchorLinkBtn a {
  align-items: center;
  background-color: #5ba49d;
  background-image: url(icon-arrow-anchor-scroll01.svg);
  background-position: calc(100% - 12px) 54%;
  background-repeat: no-repeat;
  background-size: 17.96px 17.96px;
  color: #fff;
  display: flex;
  font-size: 20px;
  font-weight: 400;
  height: 100%;
  justify-content: center;
  line-height: 1.2;
  text-align: center;
}

#hokkaido2022 .sectionInformation {
  margin-bottom: 20px;
}

#hokkaido2022 .sectionInformation .shop {
  margin: 12px 10px 0 0;
}

#hokkaido2022 .sectionInformation .lead {
  margin-bottom: 16px;
  text-align: center;
}

#hokkaido2022 .sectionInformation .lead span {
  align-items: center;
  background-color: #a83b59;
  color: #fff;
  display: inline-flex;
  font-size: 25px;
  font-weight: bold;
  justify-content: center;
  line-height: 1;
  padding: 10px 16px;
}

#hokkaido2022 .sectionInformation .title {
  margin-bottom: 12px;
}

#hokkaido2022 .sectionInformation .h3 {
  color: #4b241d;
  font-size: 45px;
  font-weight: bold;
  letter-spacing: 0.1em;
  line-height: 1.33;
}

#hokkaido2022 .sectionInformation .h3 .small {
  font-size: 35px;
}

#hokkaido2022 .sectionInformation .h4 {
  color: #4b241d;
  font-size: 40px;
  font-weight: bold;
  letter-spacing: 0.05em;
  line-height: 1.2;
  text-align: center;
}

#hokkaido2022 .sectionInformation .h4 .small {
  color: #a83b59;
  font-size: 23px;
  font-weight: 600;
  line-height: 2.09;
  line-height: 1.2;
  margin-left: 7px;
}

#hokkaido2022 .sectionInformation .h4 .large {
  font-size: 35px;
  font-weight: bold;
}

#hokkaido2022 .sectionInformation .car {
  margin: 12px 10px 0 0;
}

#hokkaido2022 .sectionInformation .content {
  display: table;
  margin: 0 auto;
  max-width: 938px;
}

#hokkaido2022 .sectionInformation .content dl {
  display: flex;
}

#hokkaido2022 .sectionInformation .content dl dt {
  border: 1px solid #4b241d;
  color: #4b241d;
  font-size: 18px;
  font-weight: bold;
  height: 32px;
  letter-spacing: 0.03em;
  line-height: 1;
  margin-bottom: 8px;
  margin-right: 8px;
  padding: 5px;
}

#hokkaido2022 .sectionInformation .content dl dd {
  color: #4b241d;
  font-size: 25px;
  letter-spacing: 0.03em;
  line-height: 1.36;
}

#hokkaido2022 .sectionInformation .content dl dd .small {
  font-size: 18px;
}
#hokkaido2022 .campaign-area {
  background-image: url(bg_app.png);
  margin-bottom: 0;
  padding: 160px 24px 40px;
  position: relative;
  text-align: center;
}
#hokkaido2022 .campaign-area::before {
  background-image: url(bg_phone.png);
  background-repeat: no-repeat;
  background-size: 188px 230px;
  bottom: 210px;
  content: "";
  height: 230px;
  position: absolute;
  right: 20px;
  width: 188px;
}
#hokkaido2022 .campaign-area .content {
  margin-bottom: 0;
}
#hokkaido2022 .campaign-area .title {
  font-size: 30px;
  font-weight: 600;
  line-height: 1.3;
  position: relative;
}
#hokkaido2022 .campaign-area .title::before {
  background-image: url(bg_fukidasi.png);
  background-repeat: no-repeat;
  background-size: 620px 124px;
  content: "";
  display: inline-block;
  height: 126px;
  left: -48px;
  position: absolute;
  top: -130px;
  transform: rotate(-1deg);
  width: 620px;
}

#hokkaido2022 .campaign-area .title::after {
  color: #799e00;
  content: "藤崎アプリダウンロードのお客様限定！";
  display: inline-block;
  font-size: 30px;
  font-weight: 600;
  height: 106px;
  left: -40px;
  position: absolute;
  top: -95px;
  transform: rotate(-4.5deg);
  width: 610px;
}
#hokkaido2022 .campaign-area .title span.price-underline {
  background: linear-gradient(transparent 70%, #ff0 70%);
}
#hokkaido2022 .campaign-area .download-btn {
  background-color: #789e00;
  background-image: url(icon-arrow-price01.svg);
  background-position: 90% center;
  background-repeat: no-repeat;
  background-size: 10px 22px;
  color: #fff;
  font-size: 24px;
  font-weight: 600;
  height: 66px;
  margin: 30px calc(50% - 300px) 30px;
  padding: 10px 0;
  text-align: center;
  width: 600px;
}
#hokkaido2022 .campaign-area .download-btn a {
  color: #fff;
}
#hokkaido2022 .campaign-area .text p {
  display: inline-block;
  font-size: 16px;
  text-align: left;
  width: 93%;
}
#hokkaido2022 .campaign-area .date {
  align-items: center;
  display: flex;
  font-size: 30px !important;
  justify-content: center;
  margin-top: 20px;
}

#hokkaido2022 .map-area {
  background-color: #fff;
  border: 4px solid #f2e8be;
  display: flex;
  margin: 73px 30px 22px;
  padding: 28px 28px 28px 114px;
  position: relative;
}
#hokkaido2022 .map-area::before {
  background-color: #f2e8be;
  border-radius: 60px;
  color: #78461f;
  content: "受取場所";
  display: inline-block;
  font-size: 26px;
  font-weight: 600;
  height: 120px;
  left: -18px;
  line-height: 32px;
  padding: 27px 34px;
  position: absolute;
  top: -60px;
  width: 120px;
}
#hokkaido2022 .map-area img {
  width: 420px;
}
#hokkaido2022 .map-area .info-txt {
  padding: 30px 0;
}
#hokkaido2022 .map-area .info-txt dl {
  margin: 15px 0 0;
}
#hokkaido2022 .under-spch {
  margin-bottom: 17px !important;
}
#hokkaido2022 .under-spc1 {
  margin-bottom: 35px !important;
}
#hokkaido2022 .under-spc2 {
  margin-bottom: 35px !important;
}
#hokkaido2022 .highlight .item {
  position: relative;
}
#hokkaido2022 .spMb35 .item:nth-child(2) {
  margin-top: 16px;
}

@media screen and (max-width: 1100px) and (min-width: 768px) {
  #hokkaido2022 .sectionInformation .content h4 {
    display: block;
  }

  #hokkaido2022 .sectionInformation .content .car {
    margin: 12px ​10px 0;
  }
}

@media screen and (max-width: 1100px) {
  #hokkaido2022 .spNoneI.tbNone {
    display: none !important;
  }
}
@media screen and (min-width: 1101px) {
  #hokkaido2022 .pcNoneI {
    display: none !important;
  }
}

#hokkaido2022 .sectionInformation .contentSpan {
  width: 100%;
}

#hokkaido2022 .sectionInformation .contentSpan .text p::before {
  content: "※";
}

#hokkaido2022 .sectionInformation .contentSpan .text p {
  padding-left: 1em;
  text-indent: -1em;
}

#hokkaido2022 .sectionInformation .contentSpan dl {
  justify-content: center;
  margin-bottom: 8px;
}

#hokkaido2022 .sectionInformation .flex {
  align-items: flex-start;
  display: flex;
  justify-content: flex-start;
  width: 100%;
}

#hokkaido2022 .sectionInformation .flex .text {
  padding: 0 0 0 20px;
}

#hokkaido2022 .sectionInformation .flex .text p {
  color: #4b241d;
  font-size: 20px;
  line-height: 1.5;
  margin-bottom: 13px;
}

#hokkaido2022 .sectionInformation .flex .text p .emphasis {
  color: #a83b59;
}

#hokkaido2022 .sectionInformation .flex .text p .small {
  font-size: 18px;
}

#hokkaido2022 .sectionInformation .large {
  font-size: 36px;
}

#hokkaido2022 .sectionInformation .larger {
  font-size: 52px;
  font-weight: bold;
}

#hokkaido2022 .sectionInformation .largest {
  font-size: 60px;
  font-weight: bold;
}

#hokkaido2022 .sectionInformation .flex .text p .nM {
  margin-left: -0.5em;
}

@media screen and (max-width: 1100px) and (min-width: 768px) {
  #hokkaido2022 .sectionInformation .flex .text p br {
    display: none;
  }
}
@media screen and (max-width: 1366px) and (min-width: 768px) {
  #hokkaido2022 .under-spch {
    margin-bottom: 7px !important;
  }
  #hokkaido2022 .highlight .bento-04 {
    width: 560px;
  }
}

#hokkaido2022 .sectionInformation .flex .text .notes li {
  line-height: 22px;
}

#hokkaido2022 .sectionInformation .flex .image {
  padding-top: 6px;
}

#hokkaido2022 .sectionInformation .hr {
  background-image: linear-gradient(
    to right,
    #b39e9a,
    #b39e9a 5px,
    transparent 5px,
    transparent 10px,
    #b39e9a 10px
  );
  background-position: left top;
  background-repeat: repeat-x;
  background-size: 10px 2px;
  border: none;
  height: 2px;
  margin-bottom: 35px;
}

#hokkaido2022 .sectionInformation .contentLast {
  margin-bottom: 0;
}

#hokkaido2022 .sectionInformation .contentLast .lead {
  margin-bottom: 10px;
}

#hokkaido2022 .sectionInformation .contentLast .title {
  margin-bottom: 0;
  text-align: center;
}

#hokkaido2022 .sectionInformation .contentLast .title .h4 {
  background-image: url(icon-decoration01.svg),
    url(icon-decoration01-reverse.svg);
  background-position: 0 55%, 100% 55%;
  background-repeat: no-repeat, no-repeat;
  background-size: 12.508px 17.251px, 12.508px 17.251px;
  display: inline-block;
  margin-bottom: 25px;
  padding: 0 22px;
}

#hokkaido2022 .sectionInformation .contentLast .title .small {
  color: #a83b59;
  font-size: 23px;
  line-height: 1.3;
  margin: 9px 0 0 8px;
}

#hokkaido2022 .sectionInformation .contentLast .title .small .large {
  font-size: 35px;
  font-weight: bold;
}

#hokkaido2022 .sectionItem .contentHighlight {
  margin-bottom: 5px;
}

#hokkaido2022 .highlight .item .itemName {
  margin-bottom: 16px;
}
#hokkaido2022 .item .itemLead {
  font-size: 18px;
  line-height: 1.56;
  margin-bottom: 7px;
}

#hokkaido2022 .highlight .hasWebLimited::before {
  margin-bottom: 21px;
  margin-left: -9px;
  position: relative;
}

#hokkaido2022 .attentionAnchorLink {
  background-color: #fff;
  text-align: center;
}
#hokkaido2022 .anchorLinkBtn:last-child a {
  background-image: none;
  position: relative;
}
#hokkaido2022 .anchorLinkBtn:last-child a::after {
  background-image: url(icon-arrow-anchor-scroll01.svg);
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  height: 17.96px;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%) rotate(-90deg) !important;
  width: 17.96px;
}
#hokkaido2022 .attentionAnchorLink a {
  align-items: center;
  background-image: url(icon-arrow-anchor-scroll02.svg);
  background-position: calc(100% - 25px) 54%;
  background-repeat: no-repeat;
  background-size: 17.96px 17.96px;
  border: 1px solid #5ba49d;
  color: #5ba49d;
  display: flex;
  font-size: 20px;
  font-weight: 400;
  height: 60px;
  justify-content: center;
  letter-spacing: 0.1em;
  line-height: 1.2;
  position: relative;
  white-space: nowrap;
  width: 100%;
}
#hokkaido2022 .attentionAnchorLink a {
  background: none;
  position: relative;
}
#hokkaido2022 .attentionAnchorLink a::after {
  background-image: url(icon-arrow-anchor-scroll02.svg);
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  height: 17.96px;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%) !important;
  width: 17.96px;
}
#hokkaido2022 .flexColumn2 .itemInfo {
  margin: 0 28.5px;
  width: 398px;
}
#hokkaido2022 .flexColumn2 .itemBtn {
  max-width: 420px;
}

#hokkaido2022 .flexColumn3 .itemBtn {
  max-width: 280px;
}

#hokkaido2022 .item a {
  display: block;
}

#hokkaido2022 .item .itemImg {
  margin-bottom: 10px;
  text-align: center;
}

#hokkaido2022 .item .itemBrand {
  color: #000;
  font-size: 18px;
  line-height: 1.56;
  margin-bottom: 1px;
}

#hokkaido2022 .item .itemName {
  color: #000;
  font-size: 23px;
  font-weight: bold;
  line-height: 1.52;
  margin-bottom: 6px;
}

#hokkaido2022 .item .itemName .small {
  font-size: 20px;
}
#hokkaido2022 .item .setPrice {
  align-items: center;
  align-items: flex-end;
  -webkit-box-align: center;
  -webkit-box-align: end;
  -webkit-box-pack: center;
  -webkit-box-pack: end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  display: flex;
  -ms-flex-align: center;
  -ms-flex-align: end;
  -ms-flex-pack: center;
  -ms-flex-pack: end;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: center;
  justify-content: flex-end;
  line-height: 1;
  margin-bottom: 15px;
  padding: 0 6px;
  text-align: center;
}
#hokkaido2022 .item .itemSet {
  align-items: center;
  border: 1px solid #010101;
  -webkit-box-align: center;
  -webkit-box-pack: center;
  color: #010101;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  -ms-flex-pack: center;
  font-size: 12px;
  height: 18px;
  justify-content: center;
  line-height: 1;
  margin-right: 5px;
  padding: 0.5px 5px;
  text-align: center;
}
#hokkaido2022 .item .itemPrice {
  align-items: baseline;
  color: #000;
  display: flex;
  font-size: 25px;
  font-weight: bold;
  justify-content: flex-end;
  line-height: 1;
}
#hokkaido2022 .white-lover {
  display: flex;
  flex-direction: column;
}

#hokkaido2022 .item .itemPrice .small {
  color: #000;
  font-size: 18px;
  font-weight: normal;
  line-height: 1;
}

#hokkaido2022 .item .itemPrice .tax {
  margin-right: 5px;
}

#hokkaido2022 .item .itemBtn {
  align-items: center;
  color: #fff;
  display: flex;
  font-size: 18px;
  height: 50px;
  justify-content: center;
  letter-spacing: 0.05em;
  line-height: 1.2;
  margin: 22px auto 0;
  width: 398px;
}
#hokkaido2022 .sectionTentou .item .itemBtn {
  background-color: #d97014;
}
#hokkaido2022 .sectionHaisou .item .itemBtn {
  background-color: #e26c6a;
  width: 420px;
}
#hokkaido2022 .beer-box {
  display: flex;
}
#hokkaido2022 .beer-box .itemImg {
  margin-right: 38px;
}
#hokkaido2022 .beer-box .itemInfo {
  width: 398px;
}
#hokkaido2022 .viewAll {
  position: relative;
  z-index: 1;
}
#hokkaido2022 .viewAll-all {
  margin: 40px 0 90px;
}
#hokkaido2022 .bgc5ba49d {
  background-color: #5ba49d;
}

#hokkaido2022 .viewAll a {
  align-items: center;
  color: #fff;
  display: flex;
  font-size: 24px;
  height: 80px;
  justify-content: center;
  letter-spacing: 0.05em;
  line-height: 1.15;
  margin: 0 auto;
  max-width: 600px;
  position: relative;
}

#hokkaido2022 .sectionAttention {
  background-color: #f6f6f6;
  padding: 45px 63px 50px;
}

#hokkaido2022 .sectionAttention .title {
  margin-bottom: 28px;
}

#hokkaido2022 .sectionAttention .title .h2 {
  color: #272727;
  font-size: 25px;
  font-weight: bold;
  letter-spacing: 0.1em;
  line-height: 1.4;
  text-align: center;
}

#hokkaido2022 .sectionAttention .title span {
  position: relative;
}

#hokkaido2022 .sectionAttention .title span::before {
  background-color: #7abab5;
  bottom: -12px;
  content: "";
  height: 2px;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  width: 50px;
}

#hokkaido2022 .sectionAttention p,
#hokkaido2022 .sectionAttention dt,
#hokkaido2022 .sectionAttention dd {
  color: #272727;
  font-size: 18px;
  line-height: 1.67;
}

#hokkaido2022 .sectionAttention dl {
  padding-left: 17px;
}

#hokkaido2022 .sectionAttention dt {
  font-size: 20px;
  font-weight: bold;
  margin-left: -12px;
}

#hokkaido2022 .sectionAttention dd:not(:last-child) {
  margin-bottom: 12px;
}

#hokkaido2022 .sectionAttention dd li {
  line-height: 1.6;
  padding-left: 1em;
  position: relative;
}

#hokkaido2022 .sectionAttention dd li .emphasis {
  color: #bb3939;
  font-weight: bold;
}

#hokkaido2022 .sectionAttention dd li .emphasisBlack {
  color: #272727;
}

#hokkaido2022 .sectionAttention dd li::before {
  content: "・";
  display: inline;
  left: 0;
  position: absolute;
}

#hokkaido2022 .sectionAttention dd li li {
  margin-bottom: 1px;
  padding-left: 1em;
  position: relative;
}

#hokkaido2022 .sectionAttention dd li li::before {
  content: "※";
  display: inline;
  left: 0;
  position: absolute;
}

#hokkaido2022 .sectionAttention p {
  margin-bottom: 12px;
}

#hokkaido2022 .sectionAttention .proviso {
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 5px;
}

#hokkaido2022 .bnrWrap {
  align-items: center;
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  margin: 71px auto 5em;
  max-width: 880px;
  width: 100%;
}

#hokkaido2022 .bnrWrap .categoryLink,
#hokkaido2022 .bnrWrap .topBtn {
  width: 100%;
}

#hokkaido2022 .bnrWrap .topBtn {
  margin-right: 10px;
}

#hokkaido2022 .bnrWrap .topBtn a {
  align-items: center;
  border: 1px solid #7a7778;
  color: #7a7778;
  display: flex;
  font-size: 23px;
  height: 70px;
  justify-content: center;
  max-width: 360px;
}

#hokkaido2022 .bnrWrap .categoryLink a {
  align-items: center;
  background-color: #5ba49d;
  color: #fff;
  display: flex;
  font-size: 23px;
  font-weight: bold;
  height: 70px;
  justify-content: center;
  width: 480px;
}
#hokkaido2022 .br-middle {
  display: none;
}

#hokkaido2022 .dateTitle {
  border: 1px solid #010101;
  font-size: 17px;
  font-weight: bold;
  margin-right: 8px;
  margin-top: 5px;
  padding: 0 7px;
}

@media screen and (max-width: 767px) {
  #hokkaido2022 .dateTitle {
    font-size: 14px;
    margin-top: 1px;
    padding: 0 7px;
  }

  #hokkaido2022 .campaign-area .date {
    margin-bottom: 6px;
  }

  #hokkaido2022 .placeAttention {
    background-size: 22px 22px;
    font-size: 17px;
    padding-left: 27px;
  }
  #hokkaido2022 .white-lover {
    flex-direction: row;
  }
  #hokkaido2022 .viewAll-all {
    margin: 40px auto 90px !important;
  }
  #hokkaido2022 .titleH3 p.small {
    font-size: 14px;
    margin-top: 7px;
  }
}
@media screen and (max-width: 1100px) and (min-width: 768px) {
  #hokkaido2022 .brTb {
    display: block;
  }

  #hokkaido2022 .hasWebLimited::before {
    height: 7.86vw;
    width: 8.92vw;
  }

  #hokkaido2022 .anchorLinks .anchorLinkBtn a .brTb {
    display: block;
  }

  #hokkaido2022 .sectionInformation .contentSpan .image {
    width: 40%;
  }

  #hokkaido2022 .highlight .hasWebLimited::before {
    right: 6.73vw;
  }

  #hokkaido2022 .sectionPrice .item a {
    font-size: 2vw;
    height: 5.45vw;
  }

  #hokkaido2022 .sectionPrice .item a .small {
    font-size: 1.45vw;
  }
  #hokkaido2022 .item .itemBtn {
    max-width: 260px;
    width: 100%;
  }
  #hokkaido2022 .sectionHaisou .item .itemBtn {
    width: 100%;
  }
  #hokkaido2022 .map-area {
    flex-direction: column;
    margin: 73px 10% 23px;
    width: 80%;
  }
  #hokkaido2022 .map-area img {
    width: 80%;
  }
  #hokkaido2022 .map-area .info-txt {
    margin: 0;
    padding: 20px 0 0 0;
  }
  #hokkaido2022 .campaign-area .title::before {
    left: -8px;
  }
  #hokkaido2022 .campaign-area .title::after {
    left: 0;
  }
  #hokkaido2022 .br-middle {
    display: inline-block;
  }
  #hokkaido2022 .flexColumn2 .itemInfo,
  #hokkaido2022 .flexColumn3 .itemInfo {
    margin: 0;
    padding: 0 20px;
    width: 100%;
  }
  #hokkaido2022 .highlight .itemImg img {
    /* width: 387px; */
  }
  #hokkaido2022 .sectionHaisou .titleH3Item .h3,
  #hokkaido2022 .sectionTentou .titleH3Item .h3 {
    width: 100%;
  }
}
@media screen and (max-width: 1366px) and (min-width: 1120px) {
  #hokkaido2022 .highlight .bento-01 {
    width: 708px;
  }
}
@media screen and (max-width: 1119px) and (min-width: 1050px) {
  #hokkaido2022 .highlight .bento-01 {
    width: 688px;
  }
}
@media screen and (max-width: 1024px) and (min-width: 768px) {
  #hokkaido2022 {
    /* #######################################################
      TOPページへ
      ####################################################### */
  }

  #hokkaido2022 .bnrWrap {
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
  }

  #hokkaido2022 .bnrWrap .categoryLink a {
    margin: 0 auto;
    max-width: 480px;
    width: 95%;
  }

  #hokkaido2022 .bnrWrap .topBtn a {
    height: 50px;
    margin: 20px auto 0;
    width: 80%;
  }
  #hokkaido2022 .map-area {
    flex-direction: column;
  }
  #hokkaido2022 .map-area .info-txt {
    margin: 0;
    padding: 20px 0 0 0;
  }
}

@media screen and (max-width: 767px) {
  #hokkaido2022 .brSp {
    display: block;
  }

  #hokkaido2022 .alphabet {
    display: inline-block;
    margin-top: 6px;
  }

  #hokkaido2022 .spMb35 {
    margin-bottom: 35px;
  }

  #hokkaido2022 .hasWebLimited {
    position: relative;
  }

  #hokkaido2022 .hasWebLimited::before {
    height: 71.255px;
    left: 5px;
    top: 5px;
    width: 77.98px;
  }

  #hokkaido2022 .flexColumn3 .hasWebLimited::before {
    transform: scale(0.6);
  }

  #hokkaido2022 .flexColumn3 {
    display: block;
  }

  #hokkaido2022 .flexColumn3 .item:not(:nth-child(3n)) {
    margin-right: 0;
  }

  #hokkaido2022 .flexColumn3 .item:nth-last-child(n + 4) {
    margin-bottom: 0;
  }

  #hokkaido2022 .sectionItem .flexColumn3 .item {
    width: 100%;
  }

  #hokkaido2022 .sectionItem .flexColumn3 .item:not(:nth-child(3n)) {
    margin-right: 0;
  }

  #hokkaido2022 .sectionItem .flexColumn3 .item {
    margin-bottom: 30px;
  }

  #hokkaido2022 .sectionItem .flexColumn3 .item a {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  #hokkaido2022 .sectionItem .flexColumn3 .item .itemImg {
    margin-bottom: 0;
    width: 40%;
  }

  #hokkaido2022 .sectionItem .flexColumn3 .item .matchHeight {
    padding-left: 10px;
    width: 60%;
  }

  #hokkaido2022 .sectionItem .flexColumn3 .item .itemInfo {
    padding: 0;
    width: 100%;
  }

  #hokkaido2022 .sectionItem .flexColumn3 .item .itemBtn {
    font-size: 18px;
    margin-top: 12px;
    width: 100%;
    max-width: 260px;
  }

  #hokkaido2022 .flexColumn2 .item {
    width: 100%;
  }

  #hokkaido2022 .flexColumn2 .item:not(:nth-child(2n)) {
    margin-right: 0;
  }

  #hokkaido2022 .flexColumn2 .item:nth-last-child(n + 3) {
    margin-bottom: 0;
  }

  #hokkaido2022 .flexColumn2 .item:not(:last-child) {
    margin-bottom: 35px;
  }

  #hokkaido2022 .sectionItem2nd .flexColumn2 .item {
    width: 100%;
  }

  #hokkaido2022 .sectionItem2nd .flexColumn2 .item:not(:nth-child(3n)) {
    margin-right: 0;
  }

  #hokkaido2022 .sectionItem2nd .flexColumn2 .item:not(:last-child) {
    margin-bottom: 30px;
  }

  #hokkaido2022 .sectionItem2nd .flexColumn2 .item:nth-last-child(n + 4) {
    margin-bottom: 0;
  }

  #hokkaido2022 .sectionItem2nd .flexColumn2 .item a {
    display: block;
  }

  #hokkaido2022 .sectionItem2nd .flexColumn2 .item .itemImg {
    margin-bottom: 0;
    width: 40%;
  }

  #hokkaido2022 .sectionItem2nd .flexColumn2 .item .matchHeight {
    align-items: center;
    display: flex;
    justify-content: center;
    width: 100%;
  }

  #hokkaido2022 .sectionItem2nd .flexColumn2 .item .itemInfo {
    max-width: none;
    padding-left: 10px;
    width: 60%;
  }

  #hokkaido2022 .sectionItem2nd .flexColumn2 .item .itemBtn {
    font-size: 18px;
    margin-top: 12px;
    width: 100%;
    max-width: 260px;
  }

  #hokkaido2022 .sectionItem2nd .hasWebLimited::before {
    left: 5px;
    top: 5px;
    width: 42.98px;
  }

  #hokkaido2022 .highlight .item a {
    display: block;
  }

  #hokkaido2022 .highlight .item:not(:last-child) {
    margin-bottom: 35px;
  }

  #hokkaido2022 .highlight .itemImg {
    width: 100%;
  }
  #hokkaido2022 .highlight .kani img {
    margin: 0 auto;
    width: 90%;
  }
  #hokkaido2022 .highlight .itemInfo {
    width: 100%;
  }

  #hokkaido2022 .titleH3 {
    margin-bottom: 23px;
  }

  #hokkaido2022 .titleH3 .h3 {
    font-size: 30px;
    line-height: 33px;
  }

  #hokkaido2022 .titleH3 .h3 .small {
    font-size: 20px;
  }

  #hokkaido2022 .titleH3 .h3Tohoku {
    width: 88%;
  }

  #hokkaido2022 .titleH3Item .h3 {
    background-position: left 0 top 56%, right 0 top 56%;
    margin-bottom: 6px;
    padding: 0 40px;
  }

  #hokkaido2022 .sectionItem {
    padding: 0 0 30px 0;
  }
  #hokkaido2022 .sectionItem .content {
    padding: 0 20px;
  }
  #hokkaido2022 .sectionHasInner {
    padding: 5px;
  }

  #hokkaido2022 .sectionHasInner .sectionInner {
    padding: 15px;
  }

  #hokkaido2022 .sectionItem {
    background-size: 30px 15px;
  }
  #hokkaido2022 .viewAll {
    margin: 0 auto;
    width: calc(100% - 40px);
  }

  #hokkaido2022 .sectionHighlight::before {
    background-image: url(bg-section01-sp.png);
  }

  #hokkaido2022 .titleH3Item .h3 {
    font-size: 26px;
  }

  #hokkaido2022 .sectionItem:nth-child(5)::before {
    background-image: url(bg-section01-sp.png);
  }

  #hokkaido2022 .sectionItem:nth-child(7)::before {
    background-image: url(bg-section01-sp.png);
  }

  #hokkaido2022 .sectionItem:nth-child(9)::before {
    background-image: url(bg-section01-sp.png);
  }

  #hokkaido2022 .sectionItem:nth-child(6)::before {
    background-image: url(bg-section01-sp.png);
  }

  #hokkaido2022 .sectionItem:nth-child(8)::before {
    background-image: url(bg-section01-sp.png);
  }

  #hokkaido2022 .navigation {
    padding: 25px 10px;
  }

  #hokkaido2022 .anchorLinks {
    flex-wrap: wrap;
    margin-bottom: 10px;
  }

  #hokkaido2022 .anchorLinks .anchorLinkBtn {
    height: 50px;
    width: 100%;
  }

  #hokkaido2022 .anchorLinks .anchorLinkBtn:not(:nth-child(4n)) {
    margin-right: 0;
  }

  #hokkaido2022 .anchorLinks .anchorLinkBtn:not(:last-child) {
    margin-bottom: 10px;
  }

  #hokkaido2022 .anchorLinks .anchorLinkBtn a {
    background-position: calc(100% - 10px) 50%;
    background-size: 12.5px 12.5px;
    font-size: 18px;
  }
  #hokkaido2022 .attentionAnchorLink a {
    background: none;
    position: relative;
  }
  #hokkaido2022 .anchorLinkBtn:last-child a::after {
    background-image: url(icon-arrow-anchor-scroll01.svg);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 12.96px;
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%) rotate(-90deg) !important;
    width: 12.96px;
  }
  #hokkaido2022 .attentionAnchorLink a::after {
    background-image: url(icon-arrow-anchor-scroll02.svg);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 12.96px;
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%) !important;
    width: 12.96px;
  }
  #hokkaido2022 .sectionInformation:nth-child(3) .lead {
    margin-bottom: 8px;
  }

  #hokkaido2022 .sectionInformation:nth-child(3) .summary .title {
    margin-bottom: 15px;
  }

  #hokkaido2022 .sectionInformation:nth-child(3) .detail .content {
    margin-bottom: 12px;
  }

  #hokkaido2022 .sectionInformation .summary .content {
    margin-bottom: 0;
  }

  #hokkaido2022 .sectionInformation .hr {
    margin-bottom: 24px;
  }

  #hokkaido2022 .sectionInformation .shop {
    margin: 10px 6px 0 0;
    width: 38px;
  }

  #hokkaido2022 .sectionInformation .lead {
    margin-bottom: 4px;
    margin-top: 10px;
    text-align: center;
  }

  #hokkaido2022 .sectionInformation .lead span {
    font-size: 15px;
    line-height: 15px;
    padding: 6px 9px;
  }

  #hokkaido2022 .sectionInformation .title {
    margin-bottom: 5px;
  }

  #hokkaido2022 .sectionInformation .h3 {
    font-size: 30px;
    line-height: 1.4;
  }

  #hokkaido2022 .sectionInformation .h3 .small {
    font-size: 20px;
  }

  #hokkaido2022 .sectionInformation .h4 {
    display: block;
    font-size: 25px;
  }

  #hokkaido2022 .sectionInformation .car {
    margin: 4px 10px 0 0;
    width: 47px;
  }

  #hokkaido2022 .sectionInformation .content {
    display: table;
    margin: 0 auto 18px;
  }

  #hokkaido2022 .sectionInformation .content dl dt {
    align-items: center;
    display: flex;
    font-size: 15px;
    height: 32px;
    justify-content: center;
    line-height: 15px;
    margin-bottom: 8px;
    margin-right: 8px;
    padding: 5px;
    white-space: nowrap;
  }

  #hokkaido2022 .sectionInformation .content dl dd {
    font-size: 17px;
    line-height: 1.6;
  }

  #hokkaido2022 .sectionInformation .content dl dd .small {
    font-size: 15px;
  }

  #hokkaido2022 .sectionInformation .contentSpan {
    margin-bottom: 8px;
    width: 100%;
  }

  #hokkaido2022 .sectionInformation .contentSpan dl {
    justify-content: center;
    margin-bottom: 8px;
  }

  #hokkaido2022 .sectionInformation .contentSpan dl dt {
    padding: 4px 5px;
  }

  #hokkaido2022 .sectionInformation .flex {
    display: block;
  }

  #hokkaido2022 .sectionInformation .flex .image {
    margin: 0 auto 15px;
    max-width: 307px;
    padding-top: 0;
  }

  #hokkaido2022 .sectionInformation .flex .text {
    margin-left: auto;
    margin-right: auto;
    max-width: 307px;
    padding: 0;
  }

  #hokkaido2022 .sectionInformation .flex .text p {
    font-size: 15px;
    line-height: 1.4;
    margin-bottom: 13px;
  }

  #hokkaido2022 .sectionInformation .flex .text p .small {
    font-size: 15px;
  }

  #hokkaido2022 .sectionInformation .flex .text p .large,
  #hokkaido2022 .sectionInformation .flex .text p .larger {
    font-size: 20px;
  }

  #hokkaido2022 .sectionInformation .flex .text p .largest {
    font-size: 24px;
  }

  #hokkaido2022 .sectionInformation .flex .text .notes li {
    line-height: 1.5;
  }

  #hokkaido2022 .sectionInformation .contentLast {
    margin-bottom: 2px;
    padding-top: 12px;
  }

  #hokkaido2022 .sectionInformation .contentLast .lead {
    margin-bottom: 10px;
  }

  #hokkaido2022 .sectionInformation .contentLast .title {
    margin-bottom: 8px;
  }

  #hokkaido2022 .sectionInformation .contentLast .title .h4 {
    background-position: 0 45%, 100% 45%;
    margin-bottom: 14px;
    padding: 0 17px;
  }

  #hokkaido2022 .sectionInformation .contentLast .title .h4 .small {
    display: block;
    font-size: 18px;
    margin: 9px 0 0 0;
  }

  #hokkaido2022 .sectionInformation .contentLast .title .h4 .small .large {
    font-size: 24px;
  }
  #hokkaido2022 .sectionItem .contentHighlight {
    margin-bottom: 30px;
  }

  #hokkaido2022 .highlight .itemInfo {
    margin: 0 auto;
    max-width: none;
  }

  #hokkaido2022 .highlight .item:nth-child(3) .itemInfo {
    width: auto !important;
    padding: 0 38px;
  }

  #hokkaido2022 .highlight .hasWebLimited::before {
    float: left;
    margin-bottom: 0;
    margin-right: 10px;
    width: 44px;
  }

  #hokkaido2022 .attentionAnchorLink {
    text-align: center;
  }

  #hokkaido2022 .attentionAnchorLink a {
    background-position: calc(100% - 10px) 50%;
    background-size: 14px 14px;
    font-size: 18px;
    height: 50px;
  }

  #hokkaido2022 .flexColumn2 .itemInfo {
    margin: 0 auto;
    max-width: 260px;
    padding: 0;
  }

  #hokkaido2022 .flexColumn2 .itemBtn {
    margin-left: auto;
    margin-right: auto;
    max-width: 260px;
  }

  #hokkaido2022 .flexColumn3 .itemBtn {
    max-width: 260px;
  }

  #hokkaido2022 .item .itemImg {
    margin-bottom: 8px;
  }

  #hokkaido2022 .item .itemBrand,
  #hokkaido2022 .item .itemName {
    padding: 0;
  }

  #hokkaido2022 .item .itemBrand {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 2px;
  }

  #hokkaido2022 .item .itemName {
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 8px;
  }

  #hokkaido2022 .item .itemName .small {
    font-size: 14px;
  }

  #hokkaido2022 .item .itemPrice {
    font-size: 24px;
    padding-right: 0;
  }

  #hokkaido2022 .item .itemPrice .small {
    font-size: 12px;
    line-height: 12px;
  }

  #hokkaido2022 .item .itemPrice .tax {
    margin-right: 1px;
  }

  #hokkaido2022 .item .itemBtn {
    font-size: 20px;
    line-height: 20px;
    margin: 12px auto 0;
    max-width: none;
    text-align: center;
    width: calc(100% - 78px);
  }

  #hokkaido2022 .viewAll a {
    align-items: center;
    display: flex;
    font-size: 18px;
    height: 60px;
    justify-content: center;
    line-height: 20px;
    max-width: none;
    text-align: center;
  }

  #hokkaido2022 .sectionBrand .sectionInner {
    padding-right: 0;
  }

  #hokkaido2022 .sectionBrand .section:not(:last-child) {
    margin-bottom: 24px;
  }

  #hokkaido2022 .sectionBrand .titleH3 {
    margin-left: -15px;
  }

  #hokkaido2022 .sectionBrand .titleH4 .h4 {
    font-size: 18px;
  }

  #hokkaido2022 .sectionBrand .titleH4 .h4::before {
    background-image: url(icon-heart01.svg);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: inline-block;
    height: 15.138px;
    margin-right: 5px;
    width: 17.177px;
  }

  #hokkaido2022 .sectionBrand .brand li {
    align-items: baseline;
    display: flex;
    margin-bottom: 10px !important;
    width: 50%;
  }

  #hokkaido2022 .sectionBrand .brand li:nth-last-child(n + 5) {
    margin-bottom: auto;
  }

  #hokkaido2022 .sectionBrand .brand li a {
    font-size: 14px;
  }

  #hokkaido2022 .sectionBrand .brand .limited {
    padding-top: 6px;
  }

  #hokkaido2022.hokkaido2022 .sectionBrand .brand .limited {
    padding-top: 0;
  }

  #hokkaido2022.hokkaido2022 .sectionBrand .brand .limited {
    background-position: 0 4.5px;
  }

  #hokkaido2022.hokkaido2022 .sectionBrand .brand li {
    background-position: 0 5px;
  }

  #hokkaido2022 .sectionPrice .item {
    width: 100%;
  }

  #hokkaido2022 .sectionPrice .item a {
    background-size: 7px 16px;
    font-size: 16px;
    height: 43px;
  }

  #hokkaido2022 .sectionPrice .item a span {
    font-size: 14px;
  }

  #hokkaido2022 .sectionPrice .item:not(:last-child) {
    margin-bottom: 20px;
  }

  #hokkaido2022 .sectionPrice .titleH3 .h3 {
    align-items: baseline;
  }

  #hokkaido2022 .sectionPrice .titleH3 .h3::before,
  #hokkaido2022 .sectionPrice .titleH3 .h3::after {
    height: 20.251px;
  }

  #hokkaido2022 .viewAllValentine {
    margin-left: auto;
    margin-right: auto;
    width: calc(100% - 40px);
  }

  #hokkaido2022 .sectionAttention {
    padding: 20px;
  }

  #hokkaido2022 .sectionAttention p,
  #hokkaido2022 .sectionAttention dt,
  #hokkaido2022 .sectionAttention dd {
    font-size: 14px;
    line-height: 25px;
  }

  #hokkaido2022 .sectionAttention dt {
    font-size: 14px;
    margin-left: -9px;
  }

  #hokkaido2022 .sectionAttention dd:not(:last-child) {
    margin-bottom: 5px;
  }

  #hokkaido2022 .sectionAttention dd li {
    line-height: 22px;
    margin-bottom: 4px;
    padding-left: 1em;
    position: relative;
  }

  #hokkaido2022 .sectionAttention p {
    margin-bottom: 3px;
  }

  #hokkaido2022 .sectionAttention .proviso {
    font-size: 12px;
    margin-bottom: 5px;
  }

  #hokkaido2022 .bnrWrap {
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 0;
  }

  #hokkaido2022 .bnrWrap .categoryLink {
    padding: 0 1em;
  }

  #hokkaido2022 .bnrWrap .categoryLink a {
    font-size: 19px;
    margin: 0 auto;
    max-width: 480px;
    width: 95%;
  }

  #hokkaido2022 .bnrWrap .topBtn {
    margin-right: 0;
    padding: 0 1em;
  }

  #hokkaido2022 .bnrWrap .topBtn a {
    font-size: 16px;
    height: 50px;
    line-height: 1.4;
    margin: 20px auto 0;
    text-align: center;
    width: 80%;
  }

  #hokkaido2022 .campaign-area {
    padding: 81px 24px 20px;
  }
  #hokkaido2022 .campaign-area .title::before {
    background-image: url(bg_fukidasi_sp.png);
    background-size: 310px 80px;
    height: 87px;
    left: 5px;
    top: -84px;
    width: 100%;
  }
  #hokkaido2022 .campaign-area .title::after {
    font-size: 15px;
    left: 20px;
    max-width: 280px;
    top: -54px;
  }
  #hokkaido2022 .campaign-area .download-btn {
    background-position: 96% center;
    background-size: 8px 17px;
    font-size: 15px;
    height: 100%;
    line-height: 1.3;
    margin: 10px 0;
    width: 100%;
  }
  #hokkaido2022 .campaign-area .text p {
    font-size: 14px;
    text-align: left;
    width: 100%;
  }
  #hokkaido2022 .campaign-area .date {
    font-size: 16px !important;
    margin-top: 0;
  }
  #hokkaido2022 .titleH3 {
    padding: 20px 0;
  }
  #hokkaido2022 .titleH3Item .h3 {
    background-position: left 0 top 73%, right 0 top 73%;
  }
  #hokkaido2022 .sectionTentou .titleH3Item .h3 {
    background-size: 30px 21.58px, 30px 21.58px;
    font-size: 26px;
    width: 90%;
  }

  #hokkaido2022 .sectionHaisou .titleH3Item .h3 {
    background-size: 30px 21.31px, 30px 21.31px;
    width: 90%;
  }
  #hokkaido2022 .titleH3 p {
    font-size: 18px;
    padding: 0 10px;
    width: 100%;
    line-height: 1.35;
  }

  #hokkaido2022 .map-area {
    flex-direction: column;
    padding: 62px 10px;
  }
  #hokkaido2022 .map-area::before {
    background-color: #f2e8be;
    border-radius: 60px;
    color: #78461f;
    content: "受取場所";
    display: inline-block;
    font-size: 24px;
    font-weight: 600;
    height: 90px;
    left: -18px;
    line-height: 32px;
    padding: 12px 20px;
    position: absolute;
    top: -45px;
    width: 90px;
  }
  #hokkaido2022 .map-area .info-txt {
    margin: 0 10%;
    padding: 20px 0 0 0;
  }
  #hokkaido2022 .item .itemLead {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 6px;
  }
  #hokkaido2022 .campaign-area::before {
    background-size: 80%;
    bottom: 20%;
    height: 52%;

    /* right: -60px; */
    width: 20%;
  }

  #hokkaido2022 .campaign-area .title {
    font-size: 20px;
  }
  #hokkaido2022 .sectionInformation .larger {
    font-size: 30px;
    font-weight: bold;
  }

  #hokkaido2022 .sectionInformation .largest {
    font-size: 36px;
    font-weight: bold;
  }
  #hokkaido2022 .beer-box {
    flex-direction: column;
  }
  #hokkaido2022 .beer-box .itemInfo {
    width: 100%;
  }
  #hokkaido2022 .beer-box .itemBtn {
    max-width: 260px;
    width: 100%;
  }
  #hokkaido2022 .highlight .item-r {
    text-align: left;
    width: 100%;
    margin-left: 0;
  }
  #hokkaido2022 .highlight .item-r .itemInfo {
    margin: 0 auto;
    padding: 0 38px;
  }
  #hokkaido2022 .highlight .item:nth-child(4) {
    margin-bottom: 0;
  }
  #hokkaido2022 .under-spch,
  #hokkaido2022 .under-spc1,
  #hokkaido2022 .under-spc2 {
    margin-bottom: 6px !important;
  }
  #hokkaido2022 .highlight .item:first-child .itemInfo {
    margin-top: 0;
    max-width: none;
    padding: 0 38px;
    width: auto;
  }

  #hokkaido2022 .map-area img {
    margin: 0 10%;
    width: 80%;
  }
}
@media screen and (max-width: 400px) {
  #hokkaido2022 .titleH3Item .h3 {
    width: 70%;
  }
  #hokkaido2022 .map-area img {
    margin: 0;
    width: 100%;
  }
  #hokkaido2022 .map-area .info-txt {
    margin: 0;
  }
}
@media screen and (max-width: 374px) {
  #hokkaido2022 .bnrWrap .categoryLink a {
    font-size: 17px;
  }
}

@media screen and (max-width: 354px) {
  #hokkaido2022 .titleH3 .h3 .small {
    font-size: 15px;
  }

  #hokkaido2022 .viewAll a {
    font-size: 15px;
  }

  #hokkaido2022 .attentionAnchorLink .brXs {
    display: block;
  }
}
@media screen and (max-width: 380px) {
  #hokkaido2022 .titleH3Item .h3 {
    width: 80%;
  }
}

@media screen and (max-width: 767px) {
  .contents {
    padding: 0 !important;
  }
}
@media screen and (min-width: 767px) and (max-width: 1049px) {
  #hokkaido2022 .campaign-area::before {
    background-size: 80%;
    bottom: 20%;
    height: 52%;
    right: -3%;
    width: 20%;
  }
  #hokkaido2022 .titleH3 p.small {
    font-size: 16px;
  }
  #hokkaido2022 .anchorLinks {
    flex-wrap: wrap;
    margin-bottom: 10px;
  }
  #hokkaido2022 .anchorLinks .anchorLinkBtn a {
    background-position: calc(100% - 10px) 50%;
    background-size: 12.5px 12.5px;
    font-size: 18px;
    justify-content: flex-start;
    padding-left: 0.8em;
  }
  #hokkaido2022 .campaign-area .title::before {
    background-image: url(bg_fukidasi_sp.png);
    background-size: 80% 75%;
    left: 5px;
    top: -100px;
    width: 100%;
  }
  #hokkaido2022 .campaign-area .title::after {
    font-size: 21px;
    left: -65px;
    max-width: 100%;
    top: -67px;
  }
  #hokkaido2022 .campaign-area .text p {
    width: 100%;
  }
  #hokkaido2022 .highlight .itemImg img {
    width: auto;
  }
  #hokkaido2022 .highlight .item {
    margin-bottom: 3em;
  }
  #hokkaido2022 .highlight .item:first-child .itemInfo {
    margin-top: 270px;
    width: 322px;
  }
  #hokkaido2022 .item .bento-01 {
    margin-bottom: 50px;
  }
  #hokkaido2022 .highlight .bento-02 {
    width: 100%;
  }
  #hokkaido2022 .highlight .bento-03 {
    width: 50%;
  }
  #hokkaido2022 .highlight .bento-04 {
    left: -24px;
    top: 16px;
    width: 55% !important;
  }
  #hokkaido2022 .sectionTentou .titleH3Item .h3 {
    background-image: url(icon_store.png), url(icon_store.png);
    background-size: 55.6px 40px, 55.6px 40px;
    color: #78461f;
    width: 60%;
  }
  #hokkaido2022 .titleH3 p {
    font-size: 20px;
    font-weight: 600;
  }
  #hokkaido2022 .sectionHaisou .titleH3Item .h3 {
    background-image: url(icon_track.png), url(icon_track.png);
    background-size: 53.49px 38px, 53.49px 38px;
    color: #df758e;
    font-size: 3.8em;
    width: 95%;
  }
  /* #hokkaido2022 .sectionItem .flexColumn3 .item {
    margin-top: 3em;
    width: calc((100% - (10px * 2)) / 2);
  } */
  #hokkaido2022 .sectionTentou .titleH3Item .h3 {
    background-image: url(icon_store.png), url(icon_store.png);
    background-size: 55.6px 40px, 55.6px 40px;
    color: #78461f;
    font-size: 3.8em;
    width: 95%;
  }
  #hokkaido2022 .sectionItem .content {
    padding: 0 30px;
  }
}

@media screen and (min-width: 1020px) and (max-width: 1121px) {
  #hokkaido2022 .highlight .bento-01 {
    right: -26px;
    top: 50px;
    width: 72%;
  }
}

@media screen and (min-width: 920px) and (max-width: 1019px) {
  #hokkaido2022 .highlight .bento-01 {
    position: absolute;
    right: -18px;
    top: 90px;
    width: 70%;
  }
}

@media screen and (min-width: 820px) and (max-width: 919px) {
  #hokkaido2022 .highlight .bento-01 {
    position: absolute;
    right: -18px;
    top: 25px;
    width: 63%;
  }

    #hokkaido2022 .highlight .item:first-child .itemInfo {
    margin-top: 170px;
  }
}

@media screen and (min-width: 767px) and (max-width: 820px) {
  #hokkaido2022 .highlight .bento-01 {
    position: absolute;
    right: -18px;
top: 30px;
    width: 60%;
  }

  #hokkaido2022 .highlight .item:first-child .itemInfo {
    margin-top: 150px;
  }
}