.fb, #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .name,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .name,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .name,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .name {
  font-weight: 700;
}

.fs12b, #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .tags .area,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .tags .area,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .tags .area,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .tags .area {
  font-size: 1.2rem;
  font-weight: 700;
}

.fs13b {
  font-size: 1.3rem;
  font-weight: 700;
}

.fm16 {
  font-family: "Noto Serif JP", serif;
  font-size: 1.6rem;
}

.fm16b, #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .donation > span.yen,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .donation > span.yen,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .donation > span.yen,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .donation > span.yen {
  font-family: "Noto Serif JP", serif;
  font-size: 1.6rem;
  font-weight: 700;
}

.fm18b, #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .return > span.per,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .return > span.per,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .return > span.per,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .return > span.per {
  font-family: "Noto Serif JP", serif;
  font-size: 1.8rem;
  font-weight: 700;
}

.fm20 {
  font-family: "Noto Serif JP", serif;
  font-size: 2rem;
}

.fm20b {
  font-family: "Noto Serif JP", serif;
  font-size: 2rem;
  font-weight: 700;
}

.headerGuide {
  display: none;
}

#contentsWrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 30px auto;
  padding: 0 40px;
}

main {
  flex: 1;
  margin-bottom: 30px;
}
main > .inner {
  position: relative;
  max-width: 1030px;
  height: 600px;
  margin: 0 auto;
  margin-bottom: 20px;
  padding: 20px 0;
  background: url(../images/area/bg_area.svg) no-repeat left 0 top 80px;
  background-size: 573px 429px;
}
main > .inner .hdg_ttl01.area {
  display: block;
  text-align: center;
  justify-content: center;
  margin-bottom: 10px;
  padding: 0;
  line-height: 1;
}
main > .inner .hdg_ttl01.area > span {
  padding-left: 40px;
  background: url("../images/common/ico_area-g.svg") no-repeat left center;
  background-size: 30px 30px;
}
main > .inner .hdg_ttl01.area > span:first-of-type {
  margin-right: 30px;
  font-size: 2.8rem;
}
main > .inner .hdg_ttl01.area > span:first-of-type span {
  color: #9D312B;
}
main > .inner .areaName {
  text-align: center;
  margin-bottom: 30px;
}
main > .inner .areaName span {
  position: relative;
  font-family: "Noto Serif JP", serif;
  font-size: 2rem;
  font-weight: 700;
}
main > .inner .areaName span:before, main > .inner .areaName span:after {
  position: absolute;
  content: "";
  width: 30px;
  height: 1px;
  background: #707070;
}
main > .inner .areaName span:before {
  left: -40px;
  top: 55%;
}
main > .inner .areaName span:after {
  right: -40px;
  top: 55%;
}
main > .inner .txt {
  width: 350px;
  margin: 90px 0 0 100px;
  font-size: 1.8rem;
  line-height: 1.6;
}
main > .inner .txt span {
  display: block;
  font-size: 1.4rem;
  margin-top: 10px;
}
main > .inner .mapPC {
  display: block;
  position: absolute;
  right: 80px;
  top: 15px;
  max-width: 1200px;
  margin: 0 auto 20px;
  width: 565px;
}
main > .inner .mapSP {
  display: none;
}
main .list {
  display: flex;
  width: 100%;
  max-width: 870px;
  margin: 0 auto 40px;
}
main .list .listWrap {
  width: 100%;
  max-width: 870px;
  padding: 20px;
  border-radius: 19px;
  background: #fff;
  border: 1px solid #b5b5b6;
  box-shadow: 2px 2px 1px #b5b5b5;
}
main .list .listWrap dl {
  display: flex;
}
main .list .listWrap dl dt {
  width: 160px;
  padding: 10px 20px;
  border: 3px solid #fff;
  text-align: center;
  color: #FFF;
  font-weight: 700;
}
main .list .listWrap dl dd {
  flex: 1;
  padding: 10px 20px;
  background: #f8f8f8;
  border: 3px solid #fff;
}
main .list .listWrap dl dd ul {
  display: flex;
}
main .list .listWrap dl dd ul li:not(:last-of-type) {
  margin-right: 15px;
}
main .list .listWrap dl dd ul li a {
  font-weight: 700;
  color: #4397DC;
}
main .list .listWrap dl.area01 dt {
  background: #1b8b77;
}
main .list .listWrap dl.area02 dt {
  background: #49B09E;
}
main .list .listWrap dl.area03 dt {
  background: #ED7954;
}
main .list .listWrap dl.area04 dt {
  background: #9BBD00;
}
main .list .listWrap dl.area05 dt {
  background: #F99900;
}
main .list .listWrap dl.area06 dt {
  background: #8B6CAA;
}
main .list .listWrap dl.area07 dt {
  background: #B06934;
}
main .list .listWrap dl.area08 dt {
  background: #D23C08;
}
main .list .listWrap dl.area09 dt {
  background: #B63886;
}
main .info {
  max-width: 870px;
  margin: 0 auto 20px;
}

#asideWrap {
  width: 100%;
  padding: 40px 0;
  border-top: 3px solid #c1c1c1;
  /* ranking slide */
}
#asideWrap > .inner {
  max-width: 1200px;
  margin: 0 auto;
}
#asideWrap .ranking01,
#asideWrap .ranking02,
#asideWrap .ranking03,
#asideWrap .ranking04 {
  position: relative;
  width: 100%;
  max-width: 1200px;
}
#asideWrap .ranking01 .swiper .swiper-wrapper,
#asideWrap .ranking02 .swiper .swiper-wrapper,
#asideWrap .ranking03 .swiper .swiper-wrapper,
#asideWrap .ranking04 .swiper .swiper-wrapper {
  margin-top: 6px;
  margin-left: 4px;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide {
  width: 182px;
  background: #FFF;
  border: 1px solid #ddd;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:last-of-type,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:last-of-type,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:last-of-type,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:last-of-type {
  margin-right: 80px;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .ph,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .ph,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .ph,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .ph {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 182px;
  height: 182px;
  background: #DDD;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .ph a,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .ph a,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .ph a,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .ph a {
  display: contents;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .ph img,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .ph img,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .ph img,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .ph img {
  max-width: 100%;
  max-height: 100%;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info {
  display: flex;
  flex-wrap: wrap;
  align-content: space-between;
  flex: 1;
  padding: 7px;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info > div,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info > div,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info > div,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info > div {
  display: block;
  width: 100%;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .name,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .name,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .name,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .name {
  line-height: 1.4;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .return,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .return,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .return,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .return {
  padding: 3px 0 6px;
  font-size: 1.2rem;
  text-align: right;
  line-height: 1;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .return > span,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .return > span,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .return > span,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .return > span {
  display: inline-block;
  color: #AB2424;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .return > span.rate,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .return > span.rate,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .return > span.rate,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .return > span.rate {
  font-family: "Noto Serif JP", serif;
  font-size: 2.6rem;
  font-weight: 700;
  padding: 0px 2px 0 8px;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .return > span.per,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .return > span.per,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .return > span.per,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .return > span.per {
  font-weight: 700;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .donation,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .donation,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .donation,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .donation {
  padding: 3px 0 6px;
  font-size: 1.2rem;
  text-align: right;
  line-height: 1;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .donation > span,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .donation > span,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .donation > span,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .donation > span {
  display: inline-block;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .donation > span.price,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .donation > span.price,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .donation > span.price,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .donation > span.price {
  font-family: "Noto Serif JP", serif;
  font-size: 2.6rem;
  font-weight: 700;
  padding: 0px 2px 0 8px;
  color: #AB2424;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .donation > span.yen,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .donation > span.yen,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .donation > span.yen,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .donation > span.yen {
  font-weight: 700;
  color: #AB2424;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .tags .area a,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .tags .area a,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .tags .area a,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .tags .area a {
  display: inline-block;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .tags .area a:not(:last-of-type),
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .tags .area a:not(:last-of-type),
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .tags .area a:not(:last-of-type),
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .tags .area a:not(:last-of-type) {
  margin-right: 5px;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .tags .area span,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .tags .area span,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .tags .area span,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .tags .area span {
  display: inline-block;
  padding: 1px 15px;
  border-radius: 12px;
  background: #e7e0ca;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .tags .genre span,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .tags .genre span,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .tags .genre span,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .tags .genre span {
  color: #4397DC;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(1):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(1):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(1):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(1):before {
  position: absolute;
  content: "1";
  width: 40px;
  height: 50px;
  padding: 3px 3px 0 0;
  top: -7px;
  left: -5px;
  background: url(../images/common/ico_no01.svg) no-repeat center center;
  background-size: contain;
  font-family: "Noto Serif JP", serif;
  font-size: 2.4rem;
  font-weight: 700;
  color: #FFF;
  line-height: 1;
  text-align: center;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(2):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(2):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(2):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(2):before {
  position: absolute;
  content: "2";
  width: 40px;
  height: 50px;
  padding: 3px 3px 0 0;
  top: -7px;
  left: -5px;
  background: url(../images/common/ico_no02.svg) no-repeat center center;
  background-size: contain;
  font-family: "Noto Serif JP", serif;
  font-size: 2.4rem;
  font-weight: 700;
  color: #FFF;
  line-height: 1;
  text-align: center;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(3):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(3):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(3):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(3):before {
  position: absolute;
  content: "3";
  width: 40px;
  height: 50px;
  padding: 3px 3px 0 0;
  top: -7px;
  left: -5px;
  background: url(../images/common/ico_no03.svg) no-repeat center center;
  background-size: contain;
  font-family: "Noto Serif JP", serif;
  font-size: 2.4rem;
  font-weight: 700;
  color: #FFF;
  line-height: 1;
  text-align: center;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(4):before, #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(5):before, #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(6):before, #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(7):before, #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(8):before, #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(9):before, #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(10):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(4):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(5):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(6):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(7):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(8):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(9):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(10):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(4):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(5):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(6):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(7):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(8):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(9):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(10):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(4):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(5):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(6):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(7):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(8):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(9):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(10):before {
  position: absolute;
  content: "";
  width: 40px;
  height: 50px;
  padding: 3px 3px 0 0;
  top: -7px;
  left: -5px;
  background: url(../images/common/ico_no04.svg) no-repeat center center;
  background-size: contain;
  font-family: "Noto Serif JP", serif;
  font-size: 2.4rem;
  font-weight: 700;
  color: #FFF;
  line-height: 1;
  text-align: center;
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(4):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(4):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(4):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(4):before {
  content: "4";
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(5):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(5):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(5):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(5):before {
  content: "5";
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(6):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(6):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(6):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(6):before {
  content: "6";
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(7):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(7):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(7):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(7):before {
  content: "7";
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(8):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(8):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(8):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(8):before {
  content: "8";
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(9):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(9):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(9):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(9):before {
  content: "9";
}
#asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:nth-child(10):before,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:nth-child(10):before,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:nth-child(10):before,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:nth-child(10):before {
  content: "10";
}
#asideWrap .ranking01 .swiper-button-prev,
#asideWrap .ranking02 .swiper-button-prev,
#asideWrap .ranking03 .swiper-button-prev,
#asideWrap .ranking04 .swiper-button-prev {
  position: absolute;
  width: 30px;
  height: 30px;
  top: 50%;
  left: -15px;
  margin-top: -15px;
  background: #D3B763;
  border-radius: 5px;
  z-index: 20;
}
#asideWrap .ranking01 .swiper-button-prev:after,
#asideWrap .ranking02 .swiper-button-prev:after,
#asideWrap .ranking03 .swiper-button-prev:after,
#asideWrap .ranking04 .swiper-button-prev:after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 12px 6px 0;
  border-color: transparent #ffffff transparent transparent;
}
#asideWrap .ranking01 .swiper-button-next,
#asideWrap .ranking02 .swiper-button-next,
#asideWrap .ranking03 .swiper-button-next,
#asideWrap .ranking04 .swiper-button-next {
  position: absolute;
  width: 30px;
  height: 30px;
  top: 50%;
  right: -15px;
  margin-top: -15px;
  background: #D3B763;
  border-radius: 5px;
  z-index: 20;
}
#asideWrap .ranking01 .swiper-button-next:after,
#asideWrap .ranking02 .swiper-button-next:after,
#asideWrap .ranking03 .swiper-button-next:after,
#asideWrap .ranking04 .swiper-button-next:after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 12px;
  border-color: transparent transparent transparent #ffffff;
}
#asideWrap #ranking01,
#asideWrap #ranking02,
#asideWrap #ranking03 {
  margin-bottom: 30px;
}
#asideWrap #ranking02 .ranking02 .swiper .swiper-wrapper .swiper-slide:before {
  display: none;
}
#asideWrap #ranking03 .ranking03 .swiper .swiper-wrapper .swiper-slide:before {
  display: none;
}
#asideWrap #ranking04 {
  margin-bottom: 60px;
}
#asideWrap .swipeGuide {
  display: none;
}
#asideWrap #special {
  margin-bottom: 40px;
}
#asideWrap #special > .inner {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 30px;
  row-gap: 15px;
}
#asideWrap #special > .inner .item {
  display: flex;
}
#asideWrap #special > .inner .item .ph {
  max-width: 160px;
  margin-right: 20px;
}
#asideWrap #special > .inner .item .txt {
  flex: 1;
  font-size: 1.4rem;
}
#asideWrap #special > .inner .item .txt .date {
  display: inline-block;
}
#asideWrap #special > .inner .item .txt .label {
  display: inline-block;
  color: #1A6728;
  font-size: 1.2rem;
  margin-left: 10px;
  font-weight: 500;
}
#asideWrap #special > .inner .item .txt p {
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 5px;
}
#asideWrap #special > .inner .item .txt .tag span {
  display: inline-block;
  padding: 3px 10px;
  margin-right: 10px;
  border-radius: 5px;
  font-size: 1.1rem;
  line-height: 1;
  background: #FFF;
  border: solid 1px #DDD;
  color: #4397DC;
}
#asideWrap .breadclumb {
  display: none;
}

@media (max-width: 767.9px) {
  .headerGuide {
    display: block;
    width: 100%;
  }
  .headerGuide .msg {
    width: 350px;
    height: 25px;
    margin: 5px auto;
    text-align: center;
    border-radius: 3px;
    background: linear-gradient(90deg, #d3b763 0%, #af9548 100%);
  }
  .headerGuide .msg span {
    font-size: 1.3rem;
    font-weight: 700;
    color: #FFF;
  }
  .headerGuide .guideNavi {
    display: flex;
    justify-content: space-around;
    background: #FFF;
  }
  .headerGuide .guideNavi li {
    padding: 5px 0 3px;
  }
  .headerGuide .guideNavi li:not(:last-of-type) {
    margin-right: 0;
  }
  .headerGuide .guideNavi li a {
    display: inline-block;
    padding-top: 23px;
  }
  .headerGuide .guideNavi li a span {
    position: relative;
    display: inline-block;
    padding-left: 0;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
  }
  .headerGuide .guideNavi li a span:before {
    position: absolute;
    content: "";
    width: 23px;
    height: 23px;
    left: 50%;
    top: -25px;
    margin-left: -11px;
  }
  .headerGuide .guideNavi li.beginner a span:before {
    background: url(../images/common/ico_beginner.svg) no-repeat center center;
  }
  .headerGuide .guideNavi li.faq a span:before {
    background: url(../images/common/ico_faq.svg) no-repeat center center;
  }
  .headerGuide .guideNavi li.municipality a span:before {
    background: url(../images/common/ico_municipality.svg) no-repeat center center;
  }
  .headerGuide .guideNavi li.donation a span:before {
    background: url(../images/common/ico_donation-g.svg) no-repeat center center;
  }

  #contentsWrap {
    width: 100%;
    margin: 0;
    padding: 0 20px;
    flex-direction: initial;
  }

  main {
    order: 1;
    margin: 15px 0;
    width: 100%;
    max-width: initial;
  }
  main > .inner {
    position: relative;
    max-width: 1030px;
    height: auto;
    margin: 0 auto;
    padding: 0 0 20px;
    background: url(../images/area/bg_area.svg) no-repeat center top 60px;
    background-size: 266px 197px;
  }
  main > .inner .hdg_ttl01.area {
    justify-content: start;
    display: inline-block;
    text-align: center;
    margin-bottom: 20px;
  }
  main > .inner .hdg_ttl01.area > span {
    padding-left: 30px;
    background: url("../images/common/ico_area-g.svg") no-repeat left center;
    background-size: 25px 25px;
  }
  main > .inner .hdg_ttl01.area > span:first-of-type {
    font-size: 1.6rem;
    margin-right: 20px;
  }
  main > .inner .areaName {
    display: inline-block;
    margin-left: 10px;
  }
  main > .inner .areaName span {
    font-size: 1.1rem;
  }
  main > .inner .areaName span:before, main > .inner .areaName span:after {
    width: 15px;
  }
  main > .inner .areaName span:before {
    left: -20px;
  }
  main > .inner .areaName span:after {
    right: -20px;
  }
  main > .inner .txt {
    width: auto;
    margin: 0 0 20px;
    font-size: 1.4rem;
  }
  main > .inner .txt br {
    display: none;
  }
  main > .inner .txt span {
    font-size: 1.2rem;
    margin-top: 10px;
  }
  main > .inner .mapPC {
    display: none;
  }
  main > .inner .mapSP {
    display: block;
    width: 90%;
    margin: 0 auto;
  }
  main .list {
    display: block;
  }
  main .list .listWrap {
    padding: 20px 15px;
  }
  main .list .listWrap dl {
    display: block;
    font-size: 1.4rem;
  }
  main .list .listWrap dl dt {
    width: 100%;
    padding: 8px 20px;
  }
  main .list .listWrap dl dd {
    width: 100%;
    padding: 10px;
  }
  main .list .listWrap dl dd ul {
    flex-wrap: wrap;
  }
  main .info {
    font-size: 1.4rem;
  }

  #asideWrap {
    order: 2;
    padding-bottom: 15px;
    /* ranking slide */
  }
  #asideWrap .swipeGuide {
    display: block;
    text-align: center;
  }
  #asideWrap .swipeGuide a {
    position: relative;
    display: inline-block;
    padding-right: 1em;
    color: #4397DC;
    font-size: 1.3rem;
    font-weight: 700;
    margin-top: 35px;
  }
  #asideWrap .swipeGuide a:before {
    position: absolute;
    content: "";
    width: 176px;
    height: 21px;
    right: 50%;
    top: -21px;
    margin-right: -88px;
    background: url(../images/common/ico_swipeguide.png) no-repeat right center;
    background-size: contain;
  }
  #asideWrap .swipeGuide a:after {
    position: absolute;
    content: "";
    width: 8px;
    height: 12px;
    right: 0;
    top: 50%;
    margin-top: -6px;
    background: url(../images/common/ico_arrow-link.svg) no-repeat right center;
  }
  #asideWrap .swipeGuide.noicon a {
    margin-top: 15px;
  }
  #asideWrap .swipeGuide.noicon a:before {
    display: none;
  }
  #asideWrap .ranking01 .swiper,
#asideWrap .ranking02 .swiper,
#asideWrap .ranking03 .swiper,
#asideWrap .ranking04 .swiper {
    left: -4px;
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide {
    width: calc(175 / 390 * 100%);
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide:last-of-type,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide:last-of-type,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide:last-of-type,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide:last-of-type {
    margin-right: 30px;
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .ph,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .ph,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .ph,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .ph {
    width: 100%;
    height: initial;
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .name,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .name,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .name,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .name {
    font-size: 1.1rem;
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .return,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .return,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .return,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .return {
    font-size: 1rem;
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .return > span.rate,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .return > span.rate,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .return > span.rate,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .return > span.rate {
    font-size: 2.2rem;
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .return > span.per, #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .return > span.yen,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .return > span.per,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .return > span.yen,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .return > span.per,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .return > span.yen,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .return > span.per,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .return > span.yen {
    font-size: 1.5rem;
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .donation,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .donation,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .donation,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .donation {
    font-size: 1rem;
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .donation > span.price,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .donation > span.price,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .donation > span.price,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .donation > span.price {
    font-size: 2.2rem;
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .donation > span.yen,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .donation > span.yen,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .donation > span.yen,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .donation > span.yen {
    font-size: 1.5rem;
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .tags .area,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .tags .area,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .tags .area,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .tags .area {
    font-size: 1rem;
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .tags .area span,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .tags .area span,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .tags .area span,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .tags .area span {
    padding: 1px 10px;
  }
  #asideWrap .ranking01 .swiper .swiper-wrapper .swiper-slide .info .tags .genre span,
#asideWrap .ranking02 .swiper .swiper-wrapper .swiper-slide .info .tags .genre span,
#asideWrap .ranking03 .swiper .swiper-wrapper .swiper-slide .info .tags .genre span,
#asideWrap .ranking04 .swiper .swiper-wrapper .swiper-slide .info .tags .genre span {
    font-size: 1.1rem;
  }
  #asideWrap .ranking01 .swiper-button-next,
#asideWrap .ranking02 .swiper-button-next,
#asideWrap .ranking03 .swiper-button-next,
#asideWrap .ranking04 .swiper-button-next {
    right: -13px;
  }
  #asideWrap #ranking01 .hdg_ttl01 > span:last-of-type,
#asideWrap #ranking02 .hdg_ttl01 > span:last-of-type,
#asideWrap #ranking03 .hdg_ttl01 > span:last-of-type,
#asideWrap #ranking04 .hdg_ttl01 > span:last-of-type {
    display: none;
  }
  #asideWrap #ranking01 .hdg_ttl01.ic,
#asideWrap #ranking02 .hdg_ttl01.ic,
#asideWrap #ranking03 .hdg_ttl01.ic,
#asideWrap #ranking04 .hdg_ttl01.ic {
    background: url(../images/common/ico_crown.svg) no-repeat left top 4px;
  }
  #asideWrap #special .hdg_ttl01 > span:last-of-type {
    display: none;
  }
  #asideWrap #special .inner {
    grid-template-columns: 1fr;
  }
  #asideWrap #special .inner .item .ph {
    max-width: 140px;
    margin-right: 20px;
  }
  #asideWrap #special .inner .item .txt {
    font-size: 1.2rem;
  }
  #asideWrap #special .inner .item .txt .label {
    font-size: 1.1rem;
  }
  #asideWrap .breadclumb {
    display: block;
    padding: 0;
  }
}