@charset "UTF-8";
@-webkit-keyframes blink_animation {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes blink_animation {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/*
リセット
/***********************/
.beer-contents ol, .beer-contents ul {
  list-style: none;
}

.beer-contents table {
  border-collapse: collapse;
  border-spacing: 0;
}

.beer-contents caption, .beer-contents th, .beer-contents td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

.beer-contents q, .beer-contents blockquote {
  quotes: none;
}

.beer-contents q:before, .beer-contents q:after, .beer-contents blockquote:before, .beer-contents blockquote:after {
  content: "";
  content: none;
}

.beer-contents a, .beer-contents a:hover {
  text-decoration: none;
}

.beer-contents a img {
  border: none;
}

.beer-contents a {
  cursor: pointer;
  text-decoration: none;
  color: #000;
}

.beer-contents article, .beer-contents aside, .beer-contents details, .beer-contents figcaption, .beer-contents figure, .beer-contents footer, .beer-contents header, .beer-contents hgroup, .beer-contents main, .beer-contents menu, .beer-contents nav, .beer-contents section, .beer-contents summary {
  display: block;
}

.beer-contents button {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  border: none;
  padding: 0;
}

.clearfix:after {
  font-size: 0;
}

.clearfix {
  zoom: 1;
}

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

html.show {
  overflow-y: visible !important;
}

body {
  position: absolute;
  background-color: #000;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

body * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.sp {
  display: none !important;
}

@keyframes blink_animation {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

body.noscroll {
  overflow: hidden;
}

.wrapper {
  position: relative;
  overflow: hidden;
  width: 100%;
  background-color: #fff;
  -webkit-transition: opacity 0.5s ease-out;
  -o-transition: opacity 0.5s ease-out;
  transition: opacity 0.5s ease-out;
}

.scroll-area {
  -webkit-transition: opacity 0.5s ease-out;
  -o-transition: opacity 0.5s ease-out;
  transition: opacity 0.5s ease-out;
  opacity: 0;
}

.scroll-area.show {
  opacity: 1;
}

main.beer-contents {
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-size: 1.4vw;
  background-color: #f8f5ea;
  overflow: hidden;
  position: relative;
}

main.beer-contents div, main.beer-contents span, main.beer-contents applet, main.beer-contents object, main.beer-contents iframe,
main.beer-contents h1, main.beer-contents h2, main.beer-contents h3, main.beer-contents h4, main.beer-contents h5, main.beer-contents h6, main.beer-contents p, main.beer-contents blockquote, main.beer-contents pre,
main.beer-contents a, main.beer-contents abbr, main.beer-contents acronym, main.beer-contents address, main.beer-contents big, main.beer-contents cite, main.beer-contents code,
main.beer-contents del, main.beer-contents dfn, main.beer-contents em, main.beer-contents img, main.beer-contents ins, main.beer-contents kbd, main.beer-contents q, main.beer-contents s, main.beer-contents samp,
main.beer-contents small, main.beer-contents strike, main.beer-contents strong, main.beer-contents sub, main.beer-contents sup, main.beer-contents tt, main.beer-contents var,
main.beer-contents b, main.beer-contents u, main.beer-contents i, main.beer-contents center,
main.beer-contents dl, main.beer-contents dt, main.beer-contents dd, main.beer-contents ol, main.beer-contents ul, main.beer-contents li,
main.beer-contents fieldset, main.beer-contents form, main.beer-contents label, main.beer-contents legend,
main.beer-contents table, main.beer-contents caption, main.beer-contents tbody, main.beer-contents tfoot, main.beer-contents thead, main.beer-contents tr, main.beer-contents th, main.beer-contents td,
main.beer-contents article, main.beer-contents aside, main.beer-contents canvas, main.beer-contents details, main.beer-contents embed,
main.beer-contents figure, main.beer-contents figcaption, main.beer-contents footer, main.beer-contents header, main.beer-contents hgroup,
main.beer-contents menu, main.beer-contents nav, main.beer-contents output, main.beer-contents ruby, main.beer-contents section, main.beer-contents summary,
main.beer-contents time, main.beer-contents mark, main.beer-contents audio, main.beer-contents video {
  font: inherit;
}

main.beer-contents h1, main.beer-contents h2, main.beer-contents h3, main.beer-contents h4, main.beer-contents h5 {
  line-height: 1;
}

main.beer-contents ul, main.beer-contents ol, main.beer-contents li, main.beer-contents dl, main.beer-contents dt, main.beer-contents dd {
  list-style: none;
}

main.beer-contents img,
main.beer-contents a img {
  border: none;
  display: inline-block;
}

main.beer-contents img {
  width: 100%;
  height: auto;
}

main.beer-contents .beer-main-contents.show {
  margin-top: 4.167em;
}

main.beer-contents .beer-contents-nav {
  background-color: #f3be00;
  width: 100%;
  height: 4.167em;
  position: relative;
  z-index: 5;
  min-width: 1080px;
}

main.beer-contents .beer-contents-nav.fixed {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 205;
}

main.beer-contents .beer-contents-nav__inner {
  background-color: #f3be00;
  position: relative;
  height: 100%;
}

main.beer-contents .beer-contents-nav__btn {
  position: absolute;
  left: 50px;
  top: 50%;
  cursor: pointer;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}

main.beer-contents .beer-contents-nav__btn.active .beer-contents-nav-btn__area > div:nth-child(1) {
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
  top: 50%;
}

main.beer-contents .beer-contents-nav__btn.active .beer-contents-nav-btn__area > div:nth-child(2) {
  -webkit-transform: scaleX(0);
      -ms-transform: scaleX(0);
          transform: scaleX(0);
}

main.beer-contents .beer-contents-nav__btn.active .beer-contents-nav-btn__area > div:nth-child(3) {
  -webkit-transform: rotate(-45deg) translateX(0);
      -ms-transform: rotate(-45deg) translateX(0);
          transform: rotate(-45deg) translateX(0);
  bottom: 39%;
}

main.beer-contents .beer-contents-nav-btn__area {
  width: 2.23em;
  height: 1.445em;
  position: relative;
}

main.beer-contents .beer-contents-nav-btn__area > div {
  width: 100%;
  height: 2px;
  -webkit-transition: top 0.5s ease-out,bottom 0.5s ease-out,-webkit-transform 0.5s ease-out;
  transition: top 0.5s ease-out,bottom 0.5s ease-out,-webkit-transform 0.5s ease-out;
  -o-transition: transform 0.5s ease-out,top 0.5s ease-out,bottom 0.5s ease-out;
  transition: transform 0.5s ease-out,top 0.5s ease-out,bottom 0.5s ease-out;
  transition: transform 0.5s ease-out,top 0.5s ease-out,bottom 0.5s ease-out,-webkit-transform 0.5s ease-out;
  background-color: #000;
  position: absolute;
  top: 0;
}

main.beer-contents .beer-contents-nav-btn__area > div:nth-child(2) {
  -webkit-transform-origin: right center;
      -ms-transform-origin: right center;
          transform-origin: right center;
  top: 0.7em;
}

main.beer-contents .beer-contents-nav-btn__area > div:nth-child(3) {
  top: auto;
  bottom: 0;
}

main.beer-contents .beer-contents-nav-btn__text {
  font-size: 0.88em;
  position: absolute;
  left: 4.4em;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  line-height: 1;
}

main.beer-contents .beer-contents-nav__logo {
  width: 3.16em;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

main.beer-contents .beer-contents-nav__logo a img {
  display: block !important;
}

main.beer-contents .beer-contents-nav__link {
  float: right;
  margin-right: 50px;
}

main.beer-contents .beer-contents-nav-link__item {
  display: inline-block;
  margin-right: 1.65em;
  line-height: 4.167em;
}

main.beer-contents .beer-contents-nav-link__item:last-child {
  margin-right: 0;
}

main.beer-contents .beer-contents-menu {
  width: 27.45em;
  background-color: #fff;
  position: absolute;
  left: 0;
  top: 4.18em;
  -webkit-transition: height 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.63, 0, 0.45, 1);
  transition: height 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.63, 0, 0.45, 1);
  -o-transition: transform 0.5s cubic-bezier(0.63, 0, 0.45, 1), height 0.5s ease-out;
  transition: transform 0.5s cubic-bezier(0.63, 0, 0.45, 1), height 0.5s ease-out;
  transition: transform 0.5s cubic-bezier(0.63, 0, 0.45, 1), height 0.5s ease-out, -webkit-transform 0.5s cubic-bezier(0.63, 0, 0.45, 1);
  -webkit-transform: translateY(-102%);
      -ms-transform: translateY(-102%);
          transform: translateY(-102%);
  z-index: -1;
  padding: 2.47em 3.4em 6.2em 50px;
  padding: 2.47em 1em 2.47em 50px !important;
}

main.beer-contents .beer-contents-menu.show {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}

main.beer-contents .beer-contents-menu.scroll .beer-contents-menu__inner {
  height: 100%;
  overflow: scroll;
}

main.beer-contents .beer-contents-menu__item {
  cursor: pointer;
  margin-bottom: 1.27em;
  height: 1.5em;
  -webkit-transition: height 0.5s ease-out;
  -o-transition: height 0.5s ease-out;
  transition: height 0.5s ease-out;
  overflow: hidden;
}

main.beer-contents .beer-contents-menu__item:last-child {
  margin-bottom: 0;
}

main.beer-contents .beer-contents-menu__item.active dt {
  font-weight: bold;
}

main.beer-contents .beer-contents-menu__item dt {
  position: relative;
}

main.beer-contents .beer-contents-menu__item dt.pulldown {
  margin-bottom: 0.9em;
}

main.beer-contents .beer-contents-menu__item dt.pulldown.active:before {
  background-image: url(/beer/common/img/navi-pull-close.png);
}

main.beer-contents .beer-contents-menu__item dt.pulldown:before {
  content: " ";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-image: url(/beer/common/img/navi-pull-open.png);
  background-repeat: no-repeat;
  background-size: 0.5em auto;
  background-position: right center;
}

main.beer-contents .beer-contents-menu__item dt a, main.beer-contents .beer-contents-menu__item dt a:link, main.beer-contents .beer-contents-menu__item dt a:visited {
  text-decoration: none;
  color: #000;
}

main.beer-contents .beer-contents-menu__item dd {
  font-size: 0.88em;
  line-height: 1.6;
  padding-left: 0.84em;
  margin-bottom: 0.76em;
}

main.beer-contents .beer-contents-menu__item dd a, main.beer-contents .beer-contents-menu__item dd a:link, main.beer-contents .beer-contents-menu__item dd a:visited {
  text-decoration: none;
  color: #000;
  display: block;
}

main.beer-contents .beer-contents-menu__item dd.active {
  font-weight: bold;
}

main.beer-contents .beer-contents-title {
  width: 100%;
  height: 13.9em;
  background-color: #000;
  color: #e7b205;
  margin-bottom: 7.25em;
  line-height: 1.5 !important;
  padding: 0 2.93em;
}

main.beer-contents .beer-contents-title__inner {
  max-width: 1280px;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  position: relative;
}

main.beer-contents .beer-contents-title__pic {
  position: absolute;
  width: 29.61em;
  left: 61.17%;
  top: 0;
}

main.beer-contents .beer-contents-title-text {
  position: absolute;
  left: 0;
  top: 53.8%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}

main.beer-contents .beer-contents-title__subtext {
  font-size: 1.11em;
  letter-spacing: 0.05em;
  line-height: 1;
  margin-bottom: 0.2em;
}

main.beer-contents .beer-contents-title__maintext {
  font-size: 2.77em;
  letter-spacing: 0.05em;
}

main.beer-contents .beer-contents-area {
  margin-bottom: 8.3em;
  padding: 0 2.93em;
  -webkit-transition: opacity 0.5s ease-out;
  -o-transition: opacity 0.5s ease-out;
  transition: opacity 0.5s ease-out;
  opacity: 0;
}

main.beer-contents .beer-contents-area.show {
  opacity: 1;
}

main.beer-contents .beer-contents-bottom .beer-contents__inner {
  background-color: transparent;
  padding: 0;
}

main.beer-contents .beer-bottom-link-area {
  margin-bottom: 4.45em;
}

main.beer-contents .beer-bottom-link-area__item {
  width: 47.65%;
  float: left;
}

main.beer-contents .beer-bottom-link-area__item:last-child {
  float: right;
}

main.beer-contents .beer-link-btn {
  font-size: 1em;
  text-align: center;
  width: 14.45em;
  height: 4.45em;
  line-height: 4.45em;
  margin: 0 auto;
  border: 1px solid #e7b205;
  letter-spacing: 0.03em;
  position: relative;
  -webkit-transition: background-color 0.5s ease-out;
  -o-transition: background-color 0.5s ease-out;
  transition: background-color 0.5s ease-out;
}

main.beer-contents .beer-link-btn a, main.beer-contents .beer-link-btn a:link, main.beer-contents .beer-link-btn a:visited {
  width: 100%;
  height: 100%;
  color: #e7b205;
  text-decoration: none;
  display: block;
  position: relative;
  -webkit-transition: color 0.5s ease-out;
  -o-transition: color 0.5s ease-out;
  transition: color 0.5s ease-out;
}

main.beer-contents .beer-link-btn .beer-link__arrow {
  position: absolute;
  width: 0.42em;
  left: 10.4%;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}

main.beer-contents .beer-link-btn .beer-link__arrow img {
  display: block;
  -webkit-transition: opacity 0.5s ease-out;
  -o-transition: opacity 0.5s ease-out;
  transition: opacity 0.5s ease-out;
}

main.beer-contents .beer-link-btn .beer-link__arrow img.rev {
  opacity: 0;
  position: absolute;
  left: 0;
  top: 0;
}

main.beer-contents .beer-whitespace {
  width: 100%;
  height: 5.8em;
  background-color: #fff;
}

@media screen and (min-width: 769px) {
  .sp_only {
    display: none !important;
  }
  main.beer-contents {
    line-height: 1.5;
  }
  main.beer-contents .beer-contents-nav__logo:hover {
    -webkit-animation: blink_animation 0.6s ease-out;
            animation: blink_animation 0.6s ease-out;
  }
  main.beer-contents .beer-contents-nav-link__item:hover {
    -webkit-animation: blink_animation 0.6s ease-out;
            animation: blink_animation 0.6s ease-out;
  }
  main.beer-contents .beer-contents-menu__inner {
    padding-right: 2.4em;
  }
  main.beer-contents .beer-contents-menu__item dt a:hover, main.beer-contents .beer-contents-menu__item dt a:link:hover, main.beer-contents .beer-contents-menu__item dt a:visited:hover {
    -webkit-animation: blink_animation 0.6s ease-out;
            animation: blink_animation 0.6s ease-out;
  }
  main.beer-contents .beer-contents-menu__item dd a:hover, main.beer-contents .beer-contents-menu__item dd a:link:hover, main.beer-contents .beer-contents-menu__item dd a:visited:hover {
    -webkit-animation: blink_animation 0.6s ease-out;
            animation: blink_animation 0.6s ease-out;
  }
  main.beer-contents .beer-bottom-link-area__item:hover {
    -webkit-animation: blink_animation 0.6s ease-out;
            animation: blink_animation 0.6s ease-out;
  }
  main.beer-contents .beer-link-btn:hover {
    background-color: #e7b205;
  }
  main.beer-contents .beer-link-btn:hover a, main.beer-contents .beer-link-btn:hover a:link, main.beer-contents .beer-link-btn:hover a:visited {
    color: #000;
  }
  main.beer-contents .beer-link-btn:hover img {
    opacity: 0;
  }
  main.beer-contents .beer-link-btn:hover img.rev {
    opacity: 1;
  }
}

@media screen and (min-width: 1281px) {
  main.beer-contents {
    font-size: 18px;
  }
}

@media screen and (max-width: 768px) {
  body {
    font-size: 3.73vw;
  }
  .pc_only {
    display: none !important;
  }
  html.sp_scroll {
    overflow: hidden !important;
  }
  body {
    font-size: 3.73vw;
  }
  .pc {
    display: none !important;
  }
  .sp {
    display: block !important;
  }
  main.beer-contents {
    font-size: 4.26vw;
    -webkit-text-size-adjust: 100%;
  }
  main.beer-contents .beer-main-contents.show {
    margin-top: 13.3vw;
  }
  main.beer-contents .beer-contents-nav {
    min-width: inherit;
    height: 13.3vw;
  }
  main.beer-contents .beer-contents-nav.fixed .beer-contents-menu {
    height: calc(100vh - 13.3vw) !important;
  }
  main.beer-contents .beer-contents-nav__btn {
    left: 5.33%;
  }
  main.beer-contents .beer-contents-nav-btn__area {
    width: 6.13vw;
    height: 4vw;
  }
  main.beer-contents .beer-contents-nav-btn__area > div {
    height: 2px;
  }
  main.beer-contents .beer-contents-nav-btn__area > div:nth-child(2) {
    top: 1.7vw;
  }
  main.beer-contents .beer-contents-nav-btn__text {
    font-size: 3.55vw;
    left: 10vw;
  }
  main.beer-contents .beer-contents-nav__logo {
    width: 10.13%;
  }
  main.beer-contents .beer-contents-menu {
    width: 100%;
    top: 13.2vw;
    padding: 7vw 5.33% 7vw 5.33% !important;
    -webkit-overflow-scrolling: touch;
  }
  main.beer-contents .beer-contents-menu__inner {
    height: 100%;
    overflow: scroll;
  }
  main.beer-contents .beer-contents-menu__item {
    height: 4.75vw;
    margin-bottom: 4.4vw;
  }
  main.beer-contents .beer-contents-menu__item dt {
    font-size: 3.55vw;
  }
  main.beer-contents .beer-contents-menu__item dt.pulldown {
    margin-bottom: 3.4vw;
  }
  main.beer-contents .beer-contents-menu__item dt.pulldown:before {
    background-size: 3.3vw auto;
  }
  main.beer-contents .beer-contents-menu__item dd {
    font-size: 3.55vw;
    padding-left: 2.5vw;
    margin-bottom: 2.5vw;
  }
  main.beer-contents .beer-contents-title {
    height: 29.3vw;
    margin-bottom: 10.7vw;
    padding: 0;
  }
  main.beer-contents .beer-contents-title__inner {
    max-width: inherit;
    padding: 0 5.33%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  main.beer-contents .beer-contents-title__pic {
    width: 43.45%;
    left: auto;
    right: 0;
  }
  main.beer-contents .beer-contents-title-text {
    left: 5.33%;
  }
  main.beer-contents .beer-contents-title__subtext {
    font-size: 3.8vw;
    margin-bottom: 1.6vw;
  }
  main.beer-contents .beer-contents-title__maintext {
    font-size: 6.65vw;
    letter-spacing: -0.055em;
  }
  main.beer-contents .beer-contents-title__maintext span {
    margin-left: -0.1em;
    letter-spacing: -0.15em;
  }
  main.beer-contents .beer-contents-area {
    padding: 0 5.33%;
    margin-bottom: 21vw;
  }
  main.beer-contents .beer-contents-bottom .beer-contents__inner {
    margin-bottom: 0;
  }
  main.beer-contents .beer-bottom-link-area {
    margin-bottom: 13.3vw;
  }
  main.beer-contents .beer-bottom-link-area__item {
    width: 100%;
    float: none;
    margin-bottom: 5vw;
  }
  main.beer-contents .beer-bottom-link-area__item:last-child {
    float: none;
    margin-bottom: 0;
  }
  main.beer-contents .beer-link-btn {
    border: 0.3vw solid #e7b205;
    font-size: 3.2vw;
    width: 50.5vw;
    height: 10.67vw;
    line-height: 10.67vw;
  }
  main.beer-contents .beer-link-btn .beer-link__arrow {
    width: 1.6vw;
    left: 7.4%;
  }
  main.beer-contents .beer-whitespace {
    height: 18vw;
  }
}
/*# sourceMappingURL=common.css.map */