@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Work+Sans");

a, a img {
  transition-duration: 0.5s;
}
a:hover, a img:hover {
  transition-duration: 0.5s;
}
a img:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}
#page-body {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fadeIn {
  animation-name: fadeIn;
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.fadeInUp {
  animation-name: fadeInUp;
}
@keyframes fadeInLeft {
  0% {
    opacity: 0;
    transform: translateX(-20px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
.fadeInLeft {
  animation-name: fadeInLeft;
}
@keyframes slideInDown {
  0% {
    opacity: 0;
    transform: translateY(-2000px);
  }
  100% {
    transform: translateY(0);
  }
}
.slideInDown {
  animation-name: slideInDown;
}
.p-main * {
  box-sizing: border-box;
}

@keyframes auto-fade_kf {
  0% {
    opacity: 1;
  }
  20% {
    opacity: 0;
  }
  60% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* Utility */
.u-none {
  display: none;
}
@media screen and (min-width: 980px) {
  .u-md-block {
    display: block;
  }
}
@media screen and (min-width: 768px) {
  .u-sm-block {
    display: block;
  }
}
@media screen and (min-width: 768px) {
  .u-sm-inline {
    display: inline;
  }
}
@media screen and (min-width: 980px) {
  .u-md-inline {
    display: inline;
  }
}
.u-table {
  display: table;
}
@media screen and (min-width: 980px) {
  .u-md-table {
    display: table;
  }
}
@media screen and (min-width: 480px) {
  .u-xs-none {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  .u-sm-none {
    display: none;
  }
}
@media screen and (min-width: 980px) {
  .u-md-none {
    display: none;
  }
}

/* PageDesign */
.p-main {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "palt";
  margin: 0 auto;
  padding: 0;
  color: #333333;
  font-smoothing: antialiased;
  font-family: noto-sans-cjk-jp, sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: 14px;
  line-height: 1.8 !important;
  letter-spacing: 0.05em;
}
@media screen and (min-width: 980px) {
  .p-main {
    font-size: 20px;
  }
}
.p-main * {
  box-sizing: border-box;
}
.p-main h2 {
  margin: 0;
  text-align: center;
}
.p-main h2 img {
  width: 100%;
  max-width: 1440px;
}
.contents_wrap {
  width: 90%;
  max-width: 1170px;
  margin: 9% auto 0;
}
@media screen and (min-width: 980px) {
  .contents_wrap {
    width: 100%;
  }
}
.contents_wrap p {
  margin: 3% auto;
}
.page_navi {
  margin-top: 6%;
}
.p-in-page-navi {
  width: 100%;
  list-style: none;
  margin: 6% auto 6%;
  overflow: hidden;
}
.dummy {
  display: none;
}
.fixed {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  z-index: 9999;
  margin-top: 0;
}
.p-in-page-navi.fixed {
  background: #ffffff;
}
#fixedbox {
  width: 90%;
  max-width: 940px;
  margin: 0.7% auto 0.2%;
  transition: 0.7s;
}
.p-in-page-navi ul {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
     -ms-flex-pack: center;
   justify-content: center;
  width: 100%;
  max-width: 1170px;
}
.p-in-page-navi li {
  width: 32%;
  margin-right: 2%;
  margin-bottom: 2%;
}
.p-in-page-navi li:nth-of-type(3n),
.p-in-page-navi li:last-of-type {
  margin-right: 0;
}
.fixed #fixedbox ul li img {
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-in-page-navi {
    margin: 0 auto 11%;
  }
  .p-in-page-navi ul {
    -webkit-box-pack: justify;
       -ms-flex-pack: justify;
     justify-content: space-between;
  }
  .p-in-page-navi li {
    width: 19.5%;
    max-width: 225px;
    margin-right: 0;
    margin-bottom: 0;
  }
}
@media (min-width: 768px) {
  #fixedbox {
    margin-top: 0;
  }
  #fixedbox,
  .fixed #fixedbox {
    width: 100%;
    min-width: auto;
  }
  .p-in-page-navi {
    width: 100%;
    margin: 5% auto;
  }
  .p-in-page-navi.fixed{
    width: 70%;
    background: transparent;
    margin: 0 auto;
  }
  .p-in-page-navi ul {
    padding: 0 0;
    margin: 0 auto;
  }
  #fixedbox ul {
    background: #ffffff;
    padding-bottom: 0.5%;
  }
}
.contents_wrap.item_list h3 {
  width: 100%;
  max-width: 850px;
  margin: 0 auto 4%;
}
.contents_wrap.item_list ul {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.contents_wrap.item_list ul li {
  position: relative;
  width: 47%;
  margin: 0 0 25%;
  text-align: center;
  line-height: 1.5em;
}
.contents_wrap.item_list ul li .item_bg {
  width: 96%;
  max-width: 340px;
}
.contents_wrap.item_list ul li .item {
  width: 85%;
  max-width: 300px;
  position: relative;
  z-index: 1;
  margin-top: -18%;
  margin-left: 15%;
  margin-bottom: 8%;
}
.contents_wrap.item_list ul li .item img:hover{
  transform: scale(1.1,1.1);
  opacity: 1;
}
.contents_wrap.item_list ul li .price_btn {
  position: absolute;
  bottom: -14%;
  display: block;
  width: 100%;
  margin-top: 7%;
  padding: 4.3% 0;
  background: #004909;
  color: #c8bc44;
  text-align: center;
  font-size: 0.7em;
}
.contents_wrap.item_list ul li .price_btn::after {
  content: '';
  width: 6px;
  height: 6px;
  border-top: solid 2px #c8bc44;
  border-right: solid 2px #c8bc44;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 39%;
  right: 4%;
}
.contents_wrap.item_list ul li .price_btn:hover {
  background: #c8bc44;
  color: #004909;
  text-decoration: none;
}
.contents_wrap.item_list ul li .price_btn:hover::after {
  border-top: solid 2px #004909;
  border-right: solid 2px #004909;
}
@media screen and (min-width: 768px) {
  .contents_wrap.item_list ul li {
    width: 32%;
    max-width: 355px;
    margin: 0 0 17%;
  }
  .contents_wrap.item_list ul li .price_btn::after {
    top: 43%;
  }
}
.contents_wrap .btn_area {
  width: 80%;
  max-width: 700px;
  margin: 0 auto;
}
.contents_wrap .btn_area a {
  display: block;
  position: relative;
  margin-bottom: 3%;
  padding: 5% 0;
  background: #c7ba44;
  color: #004909;
  text-align: center;
  font-size: 1em;
}
.contents_wrap .btn_area a:last-of-type {
  margin-bottom:0;
}
.contents_wrap .btn_area a::after {
  content: '';
  width: 6px;
  height: 6px;
  border-top: solid 2px #ffffff;
  border-right: solid 2px #ffffff;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 43%;
  right: 3%;
}
.contents_wrap .btn_area a:hover {
  background: #004909;
  color: #fff;
  text-decoration: none;
}
@media screen and (min-width: 980px) {
  .contents_wrap .btn_area a {
    padding: 3.8% 0;
  }
  .contents_wrap .btn_area a::after {
    top: 46%;
  }
}
.bnr_area {
  width: 100%;
  margin-top: 9.5%;
  text-align: center;
}
.bnr_area h3 {
  width: 80%;
  max-width: 500px;
  margin: 0 auto 2%;
}
.bnr_area .btn_area {
  width: 80%;
  max-width: 1000px;
}
.bnr_area .btn_area a {
  width: 100%;
  padding: 2.7% 0;
  background: #004909;
  color: #c7ba44;
}
.bnr_area .btn_area a::after {
  border-top: solid 2px #c7ba44;
  border-right: solid 2px #c7ba44;
}
.bnr_area .btn_area a:hover {
  background: #c7ba44;
  color: #004909;
}
.bnr_area .btn_area a:hover::after {
  border-top: solid 2px #004909;
  border-right: solid 2px #004909;
}
@media screen and (min-width: 980px) {

}