@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap");
/* 初期設定 */
body {
  color: #505050;
  line-height: 1.4; }

div, h1, h2, h3, h4, h5, p, li, dl, dt, dd, th, td, article, header, footer, nav, span, a {
  box-sizing: border-box; }

a {
  color: inherit;
  text-decoration: none; }

img {
  height: auto;
  width: 100%;
  max-width: 100%;
  line-height: 100%;
  vertical-align: bottom; }

em {
  font-style: normal; }

h1, h2, h3, h4, h5 {
  line-height: 1.4;
  margin: 0;
  word-wrap: break-word; }

p, li, td, th, dt, dd {
  font-size: 14px;
  line-height: 1.4;
  margin: 0;
  word-wrap: break-word; }

table {
  width: 100%;
  border-collapse: collapse; }

th,
td {
  text-align: left;
  font-weight: normal;
  vertical-align: top;
  word-break: break-all; }

ul,
ol {
  padding: 0;
  margin: 0; }

@media screen and (min-width: 1099px) {
  .sp {
    display: none !important; } }
@media screen and (max-width: 1100px) {
  .pc {
    display: none !important; } }
/* フォント */
body {
  font-family: 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", azo-sans-web, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  font-style: normal; }

/* ホバー */
@media screen and (min-width: 769px) {
  a {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; }
    a:hover {
      filter: alpha(opacity=60);
      -moz-opacity: 0.6;
      opacity: 0.6;
      cursor: pointer; } }
@media screen and (min-width: 769px) {
  a {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; }
    a:hover {
      filter: alpha(opacity=60);
      -moz-opacity: 0.6;
      opacity: 0.6;
      cursor: pointer; } }
/* 枠内にfitするimg */
.imgFitBox, .imgLinkBox {
  overflow: hidden; }
  .imgFitBox img, .imgLinkBox img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    font-family: 'object-fit: cover; object-position: center;'; }
  .imgFitBox.contain img, .imgLinkBox.contain img {
    object-fit: contain;
    font-family: 'object-fit: contain; object-position: center;'; }

/*	メニューを開くボタン */
.navBtn {
  background: #6baec1;
  border: none;
  cursor: pointer;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  text-align: center;
  transition: all .3s ease-in-out;
  width: 70px;
  height: 240px;
  z-index: 9999; }
  .navBtn a {
    height: 100%;
    display: block; }
  .navBtn, .navBtn span {
    display: inline-block;
    transition: all .3s ease-in-out; }
  .navBtn span {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    width: 30px;
    height: 2px;
    background-color: #fff; }
    .navBtn span:nth-of-type(1) {
      top: 20px; }
    .navBtn span:nth-of-type(2) {
      top: 29px; }
    .navBtn span:nth-of-type(3) {
      top: 38px; }
  .navBtn.close span {
    width: 30px;
    height: 2px;
    background-color: #fff; }
    .navBtn.close span:nth-of-type(1) {
      transform: translateY(8.5px) rotate(-45deg); }
    .navBtn.close span:nth-of-type(2) {
      left: 50%;
      opacity: 0;
      animation: active-menu-bar02 .8s forwards; }
    .navBtn.close span:nth-of-type(3) {
      transform: translateY(-9px) rotate(45deg); }
  .navBtn .sns_list {
    position: absolute;
    top: 90px;
    left: 0;
    right: 0;
    margin: auto;
    width: 38px; }
    .navBtn .sns_list li + li {
      margin-top: 20px; }
    .navBtn .sns_list .item {
      width: 100%; }
    .navBtn .sns_list .mameko {
      background: #fff;
      border-radius: 5px; }
    .navBtn .sns_list .mameko-img {
      padding: 5px 0;
      width: 81%; }
    .navBtn .sns_list .mameko-txt {
      font-size: 10px;
      color: #6BAEC1; }
    .navBtn .sns_list .mameko-insta {
      width: 50%;
      padding: 8px 0; }
  @media screen and (max-width: 768px) {
    .navBtn {
      bottom: auto;
      width: 13vw;
      height: 13vw; }
      .navBtn span {
        width: 6vw;
        height: 2px; }
        .navBtn span:nth-of-type(1) {
          top: 4.5vw; }
        .navBtn span:nth-of-type(2) {
          top: 6.5vw; }
        .navBtn span:nth-of-type(3) {
          top: 8.5vw; }
      .navBtn.close span {
        width: 6vw;
        height: 2px; }
        .navBtn.close span:nth-of-type(1) {
          transform: translateY(1.9vw) rotate(-45deg); }
        .navBtn.close span:nth-of-type(3) {
          transform: translateY(-2.1vw) rotate(45deg); } }

@media screen and (max-width: 768px) {
  #nav .sns_list .item.mameko-item {
    width: 20%; }
  #nav .sns_list .mameko {
    background: #fff;
    border-radius: 15px;
    display: block;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 5px;
    justify-content: space-around; }
  #nav .sns_list .mameko-img {
    width: 32%; }
  #nav .sns_list .mameko-txt {
    font-size: 10px;
    color: #6BAEC1;
    width: 35px; }
  #nav .sns_list .mameko-insta {
    width: 20%;
    padding: 8px 0; } }
@keyframes active-menu-bar02 {
  100% {
    height: 0; } }
#nav {
  display: none;
  background: #6baec1;
  position: fixed;
  top: 0;
  right: 0;
  width: 50%;
  height: 100vh;
  z-index: 9995; }
  #nav .list {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    height: 100vh; }
    #nav .list li + li {
      margin-top: 30px; }
    #nav .list .item {
      color: #fff;
      text-align: center; }
  @media screen and (max-width: 1100px) {
    #nav {
      width: 100%; } }
  @media screen and (max-width: 768px) {
    #nav {
      width: 100%; }
      #nav .list {
        height: auto;
        margin-top: 11vh; }
        #nav .list li + li {
          margin-top: 4vh; }
      #nav .sns_list {
        display: flex;
        justify-content: center;
        margin-top: 11vh; }
        #nav .sns_list li + li {
          margin-left: 3.4%; }
        #nav .sns_list .item {
          width: 9%; } }

@media screen and (max-width: 768px) {
  .list_pc {
    display: none; } }
/* loader */
#loader {
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  background: #fff;
  z-index: 10000; }

#loader div.inner {
  position: absolute;
  width: 225px;
  height: 121px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: op 3s linear 0s infinite; }

#loader div.on .load_line::after {
  width: 100%;
  top: 0;
  left: 0;
  animation: none; }

#load_img {
  position: absolute;
  width: 149px;
  height: 121px;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 9000; }

#load_line {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  overflow: hidden;
  z-index: 9001; }

#load_line::before {
  content: '';
  width: 100%;
  background: #fff;
  position: absolute;
  left: 0;
  animation: loader 3s ease-in-out 0s infinite;
  z-index: 9002; }

#load_line.load_line02::before {
  background: #101010; }

#load_line.load_line03::before {
  background: #fff; }

#load_line::after {
  content: '';
  width: 100%;
  display: block;
  background: #fff;
  animation: loader_img 3s ease-in-out 0s both;
  position: absolute;
  left: 0;
  z-index: 9003px; }

#load_line::before {
  height: 100%;
  top: 0;
  animation: loader 3s ease-in-out 0.5s infinite; }

#load_line::after {
  height: 100%;
  bottom: 0;
  animation: loader_img 3s ease-in-out 1s both; }

@media (max-width: 767px) {
  #loader div.inner {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); } }
@keyframes loader_img {
  0% {
    opacity: 1; }
  10% {
    opacity: 1; }
  11% {
    opacity: 0; }
  100% {
    opacity: 0; } }
@keyframes loader {
  0% {
    transform: scaleX(0);
    transform-origin: top left;
    animation-timing-function: cubic-bezier(0.5, 0, 0.1, 1); }
  24% {
    transform: scaleX(1);
    transform-origin: top left; }
  25% {
    margin-left: 0%;
    animation-timing-function: cubic-bezier(0.5, 0, 0.1, 1); }
  50% {
    margin-left: 100%; }
  100% {
    margin-left: 100%; } }
@media (max-width: 767px) {
  #loader div.inner {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); } }
/*------------------------------------------
  スクロールされたらフェードイン
------------------------------------------*/
.fade-in {
  opacity: 0; }

.fade-in.scrollin {
  opacity: 1;
  transition: opacity 500ms .1s; }

.fade-up {
  transform: translate(0, 80px);
  transition: all 700ms ease-in-out; }

.fade-up.scrollin {
  transform: translate(0, 0);
  transition: all 700ms ease-in-out; }

.wrap {
  position: relative;
  width: 100%;
  height: 100vh; }
  .wrap .mv_log01 {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 149px;
    height: 121px;
    z-index: 1; }
    .wrap .mv_log01 img {
      width: 100%;
      height: auto; }
  .wrap .scroll_box {
    background: transparent;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 40px;
    height: 90px;
    z-index: 100; }
    .wrap .scroll_box::before {
      background: url(../img/ico_scroll_down.png) no-repeat;
      background-size: 100%;
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      margin: auto;
      width: 38px;
      height: 80px; }
  .wrap .arrow_box {
    position: relative; }
    .wrap .arrow_box .arrow01 {
      width: 15px;
      margin: 0 auto;
      animation: arrow01 2s linear 0s infinite normal; }
    .wrap .arrow_box .arrow02 {
      width: 15px;
      margin: 0 auto;
      animation: arrow02 2s linear 0s infinite; }
    .wrap .arrow_box .arrow01 span,
    .wrap .arrow_box .arrow02 span {
      position: relative;
      display: block;
      left: 50%; }
    .wrap .arrow_box .arrow01 span {
      margin-top: 0px; }
    .wrap .arrow_box .arrow01 span:before,
    .wrap .arrow_box .arrow02 span:before {
      content: '';
      width: 15px;
      height: 15px;
      border: 0;
      border-radius: 2px;
      border-top: solid 3px #0a5f7c;
      border-right: solid 3px #0a5f7c;
      transform: rotate(135deg);
      position: absolute;
      top: 115px;
      right: 0;
      bottom: 0;
      left: 0;
      margin: auto;
      box-sizing: border-box; }
  @media screen and (max-width: 1100px) {
    .wrap .mv_log01 {
      position: absolute; }
    .wrap .scroll_box {
      position: absolute; } }
  @media screen and (max-width: 768px) {
    .wrap .scroll_box {
      display: none; } }

/* アニメーション設定 */
@keyframes arrow01 {
  0% {
    transform: translate3d(-50%, 0, 0); }
  20% {
    transform: translate3d(-50%, 0, 0); }
  40% {
    transform: translate3d(-50%, 10px, 0); }
  60% {
    transform: translate3d(-50%, 10px, 0); }
  80% {
    transform: translate3d(-50%, 0, 0); }
  100% {
    transform: translate3d(-50%, 0, 0); } }
@keyframes arrow02 {
  0% {
    transform: translate3d(-50%, 10px, 0); }
  20% {
    transform: translate3d(-50%, 20px, 0); }
  40% {
    transform: translate3d(-50%, 20px, 0); }
  60% {
    transform: translate3d(-50%, 20px, 0); }
  80% {
    transform: translate3d(-50%, 10px, 0); }
  100% {
    transform: translate3d(-50%, 10px, 0); } }
.left {
  position: relative; }
  .left .mv_box_inner {
    position: fixed;
    top: 0;
    left: 0;
    width: 50%;
    height: 100vh; }
    .left .mv_box_inner img {
      width: 100%;
      height: 100vh;
      position: absolute; }
  @media screen and (max-width: 1100px) {
    .left {
      position: initial;
      height: 50%; }
      .left .mv_box {
        width: 100%;
        overflow: hidden; }
        .left .mv_box .mv_box_inner {
          position: initial;
          width: 100%;
          height: 50vh; }
          .left .mv_box .mv_box_inner img {
            width: 700px;
            height: auto;
            top: 0;
            right: 0;
            left: 0;
            margin: auto; }
          .left .mv_box .mv_box_inner video {
            width: 100%;
            height: auto; } }
  @media screen and (max-width: 750px) {
    .left .mv_box .mv_box_inner video {
      width: auto;
      height: 100%; } }

.right {
  margin-left: 50%;
  width: 50%; }
  @media screen and (max-width: 1100px) {
    .right {
      position: initial;
      margin-left: 0;
      width: 100%; } }

/* top */
.section01 {
  position: relative;
  width: 100%;
  height: 100vh; }
  .section01 .mv_box {
    height: 50vh;
    overflow: hidden; }
  .section01 .mv_box02_inner {
    height: 100%;
    overflow: hidden; }
  .section01 .copyright {
    color: #fef8e8;
    font-weight: 400;
    font-size: 12px;
    letter-spacing: .05em;
    position: absolute;
    bottom: 15px;
    right: 35px;
    text-align: right;
    z-index: 9994; }
  @media screen and (max-width: 1100px) {
    .section01 {
      display: flex;
      height: 50vh;
      width: 100%; }
      .section01 .mv_box {
        width: 50%;
        height: 100%; }
      .section01 .copyright {
        position: absolute;
        left: 35px;
        text-align: left; } }
  @media screen and (max-width: 768px) {
    .section01 .mv_box {
      width: 50%;
      height: 50vh; }
    .section01 .copyright {
      display: none; } }

.isPlay {
  animation-name: play;
  animation-duration: .45s;
  animation-fill-mode: forwards;
  animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);
  position: relative;
  opacity: 1 !important;
  overflow: hidden; }

.isPlay:before {
  animation-name: maskOut;
  animation-duration: .45s;
  animation-delay: .45s;
  animation-fill-mode: forwards;
  animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background: #003384; }

.isPlay02 {
  animation-name: play02;
  animation-duration: .45s;
  animation-fill-mode: forwards;
  animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);
  position: relative;
  opacity: 1 !important;
  overflow: hidden; }

.isPlay02:before {
  animation-name: maskOut02;
  animation-duration: .45s;
  animation-delay: .45s;
  animation-fill-mode: forwards;
  animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background: #003384; }

.isPlay03 {
  animation-name: play03;
  animation-duration: .45s;
  animation-fill-mode: forwards;
  animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);
  position: relative;
  opacity: 1 !important;
  overflow: hidden; }

.isPlay03:before {
  animation-name: maskOut03;
  animation-duration: .45s;
  animation-delay: .45s;
  animation-fill-mode: forwards;
  animation-timing-function: cubic-bezier(0.8, 0, 0.5, 1);
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background: #003384; }

@keyframes play {
  from {
    transform: translateY(100%); }
  to {
    transform: translateY(0); } }
@keyframes maskOut {
  from {
    transform: translateY(0); }
  to {
    transform: translateY(-100%); } }
@keyframes play02 {
  from {
    transform: translateX(-100%); }
  to {
    transform: translateX(0); } }
@keyframes maskOut02 {
  from {
    transform: translateX(0); }
  to {
    transform: translateX(100%); } }
@keyframes play03 {
  from {
    transform: translateY(-100%); }
  to {
    transform: translateY(0); } }
@keyframes maskOut03 {
  from {
    transform: translateY(0); }
  to {
    transform: translateY(100%); } }
/* news */
.section02 {
  width: 100%; }
  .section02 .accordion {
    width: 100%; }
    .section02 .accordion .old-news .item .accordion_header {
      cursor: pointer;
      text-align: left;
      font-size: 16px; }
    .section02 .accordion .old-news .item .txt {
      margin: 24px auto 0 auto; }
    .section02 .accordion .old-news .item .date {
      font-size: 16px; }
    .section02 .accordion .old-news .accordion_inner {
      display: none;
      padding-bottom: 24px; }
    .section02 .accordion .old-news .fas {
      margin-left: 10px; }
    .section02 .accordion .old-news .item {
      padding: 16px 10px 16px; }
  .section02 .embed {
    max-width: 640px;
    margin: 0 auto; }
  .section02 .news_list {
    display: flex;
    flex-wrap: wrap;
    overflow-y: scroll; }
    .section02 .news_list .item {
      background: #fef8e8;
      color: #78c814;
      padding: 80px 10px 80px;
      width: 100%;
      text-align: center; }
      .section02 .news_list .item.grn {
        background: #78c814;
        color: #fff; }
      .section02 .news_list .item .date {
        margin-right: 20px;
        font-weight: 400;
        font-size: 18px; }
      .section02 .news_list .item .ttl {
        max-width: 640px;
        margin: 0 auto;
        font-size: 18px; }
        @media (max-width: 1580px) {
          .section02 .news_list .item .ttl {
            width: calc(100% - 170px); } }
        @media screen and (max-width: 768px) {
          .section02 .news_list .item .ttl {
            width: calc(100% - 40px); } }
      .section02 .news_list .item .txt {
        font-weight: 400;
        font-size: 15px;
        line-height: 2.4;
        text-align: left;
        margin: 40px auto 0 auto;
        max-width: 640px; }
        @media (max-width: 1580px) {
          .section02 .news_list .item .txt {
            width: calc(100% - 170px); } }
        @media screen and (max-width: 768px) {
          .section02 .news_list .item .txt {
            width: calc(100% - 40px); } }
        .section02 .news_list .item .txt a {
          text-decoration: underline; }
      .section02 .news_list .item .txt02 {
        font-weight: 400;
        font-size: 15px;
        line-height: 2.4;
        text-align: left;
        max-width: 640px;
        margin: 0 auto; }
        @media (max-width: 1580px) {
          .section02 .news_list .item .txt02 {
            width: calc(100% - 170px); } }
        @media screen and (max-width: 768px) {
          .section02 .news_list .item .txt02 {
            width: calc(100% - 40px); } }
        .section02 .news_list .item .txt02 a {
          text-decoration: underline; }
  .section02 .news-img {
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center; }
    .section02 .news-img img {
      width: 30%; }
      @media screen and (max-width: 768px) {
        .section02 .news-img img {
          width: 40%; } }
    .section02 .news-img img {
      margin-left: 3%; }
    .section02 .news-img img:first-of-type {
      margin-left: 0; }
    .section02 .news-img img.collaboration-img {
      margin-left: 1%; }
  .section02 .collaboration {
    font-size: 50px;
    margin-left: 1%; }
  @media screen and (max-width: 1100px) {
    .section02 .news_list .item {
      padding: 100px 10px; } }
  @media screen and (max-width: 768px) {
    .section02 .news_list .item {
      padding: 80px 3%; }
      .section02 .news_list .item .date {
        font-size: 16px; }
      .section02 .news_list .item .txt {
        font-size: 10px;
        margin-top: 40px; } }

.youtube__wrap {
  width: 100%;
  padding: 0 20px;
  margin-top: 40px; }
  .youtube__wrap iframe {
    max-width: 100%; }

/* about */
.section03 {
  box-sizing: border-box;
  padding: 100px 10px 67px;
  width: 100%; }
  .section03 .section_ttl {
    margin: 0 auto;
    width: 184px; }
  .section03 .img_box {
    margin: 100px auto 0;
    width: 218px; }
  .section03 .txt {
    font-weight: 400;
    font-size: 15px;
    line-height: 2.4;
    margin: 77px auto 0;
    text-align: center; }
    .section03 .txt a {
      text-decoration: underline; }
  .section03 .txt02 {
    background: rgba(110, 200, 0, 0.1);
    color: #505050;
    font-weight: 400;
    font-size: 14px;
    line-height: 2;
    margin: 63px 100px 0;
    padding: 30px 28px; }
    .section03 .txt02 a {
      text-decoration: underline; }
  @media screen and (max-width: 1100px) {
    .section03 .txt02 {
      padding: 30px 25px;
      width: 74%; }
      .section03 .txt02 a {
        text-decoration: underline; } }
  @media screen and (max-width: 768px) {
    .section03 {
      box-sizing: border-box;
      padding: 43px 3% 56px; }
      .section03 .section_ttl {
        margin: 0 auto;
        width: 33.3%; }
      .section03 .img_box {
        margin: 49px auto 0;
        width: 29.1%; }
      .section03 .txt {
        font-size: 10px;
        margin: 38px auto 0; }
      .section03 .txt02 {
        box-sizing: border-box;
        font-size: 10px;
        margin: 22px auto 0;
        padding: 15px 2%;
        width: 100%;
        max-width: 390px; } }

/* cocktail */
.section04 {
  box-sizing: border-box;
  padding: 100px 10px;
  width: 100%; }
  .section04 .section_ttl {
    margin: 0 auto;
    width: 237px; }
  .section04 .cacktail_box {
    border-bottom: solid #505050 1px;
    padding-bottom: 50px;
    display: flex;
    justify-content: center;
    margin: 100px auto 0;
    max-width: 760px; }
    .section04 .cacktail_box .txt_box .ttl {
      color: #78c814;
      font-size: 26px; }
    .section04 .cacktail_box .txt_box .txt {
      font-weight: 400;
      font-size: 16px;
      margin-top: 35px;
      line-height: 1.9; }
    .section04 .cacktail_box .txt_box .ttl02 {
      font-weight: 700;
      font-size: 16px;
      margin-top: 40px; }
    .section04 .cacktail_box .txt_box .item {
      border: solid #505050 1px;
      border-radius: 30px;
      display: block;
      font-weight: 400;
      font-size: 16px;
      margin-top: 18px;
      width: 100px;
      text-align: center; }
    .section04 .cacktail_box .txt_box .txt02 {
      font-weight: 400;
      font-size: 16px;
      margin-top: 2px;
      line-height: 1.9; }
  .section04 .img_box {
    display: flex;
    align-items: flex-end;
    margin-left: 3%;
    width: 260px; }
  @media screen and (max-width: 768px) {
    .section04 {
      padding: 43px 0 68px; }
      .section04 .section_ttl {
        width: 42.1%; }
      .section04 .cacktail_box {
        padding: 0 3% 38px;
        display: flex;
        align-items: center;
        flex-direction: column-reverse;
        justify-content: center;
        margin: 48px auto 0;
        max-width: 100%; }
        .section04 .cacktail_box .txt_box {
          margin-top: 27px; }
          .section04 .cacktail_box .txt_box .ttl {
            font-size: 18px; }
          .section04 .cacktail_box .txt_box .txt {
            font-size: 11px;
            margin-top: 15px; }
          .section04 .cacktail_box .txt_box .ttl02 {
            font-size: 16px;
            margin-top: 27px; }
          .section04 .cacktail_box .txt_box .item {
            font-size: 11px;
            margin-top: 9px;
            padding: 2px 0;
            width: 80px; }
          .section04 .cacktail_box .txt_box .txt02 {
            font-size: 11px;
            margin-top: 5px;
            line-height: 1.9; }
      .section04 .img_box {
        margin-left: 0;
        width: 52%; } }

/* drink! */
.section05 {
  background: #fef8e8;
  box-sizing: border-box;
  padding: 100px 10px;
  width: 100%; }
  .section05 .section_ttl {
    margin: 0 auto;
    width: 140px; }
  .section05 .txt01 {
    color: #78c814;
    font-weight: bold;
    font-size: 18px;
    margin-top: 100px;
    text-align: center; }
  .section05 .txt02 {
    border: solid #78c814 1px;
    color: #78c814;
    font-weight: bold;
    font-size: 15px;
    line-height: 40px;
    margin: 80px auto 0px;
    width: 140px;
    height: 40px;
    text-align: center; }
  .section05 .log_txt_box {
    display: flex;
    justify-content: flex-start;
    margin: 47px auto 0;
    max-width: 640px; }
    .section05 .log_txt_box.box02 {
      margin-top: 100px; }
    .section05 .log_txt_box .log {
      width: 90px;
      min-width: 90px; }
    .section05 .log_txt_box .txt_box {
      margin-left: 3%;
      width: calc(100% - 90px); }
      @media (max-width: 1580px) {
        .section05 .log_txt_box .txt_box {
          width: calc(100% - 170px); } }
      .section05 .log_txt_box .txt_box .tll {
        color: #8bd22e;
        font-weight: bold;
        font-size: 22px; }
        .section05 .log_txt_box .txt_box .tll a {
          text-decoration: underline; }
      .section05 .log_txt_box .txt_box .ttl02 {
        font-weight: 400;
        font-size: 15px;
        margin-top: 20px;
        width: 440px; }
      .section05 .log_txt_box .txt_box .txt {
        font-weight: 400;
        font-size: 14px;
        line-height: 1.8;
        margin-top: 21px; }
        .section05 .log_txt_box .txt_box .txt.txt_lead01 {
          margin-top: 14px; }
        .section05 .log_txt_box .txt_box .txt .video {
          width: 100%; }
  .section05 .map_box {
    margin: 42px auto 0;
    max-width: 640px;
    height: 202px; }
    .section05 .map_box iframe {
      display: block;
      width: 100%;
      height: 100%; }
  @media screen and (max-width: 768px) {
    .section05 {
      padding: 43px 0 61px; }
      .section05 .section_ttl {
        width: 32%; }
      .section05 .txt01 {
        font-size: 14px;
        margin-top: 46px; }
      .section05 .txt02 {
        font-size: 12px;
        line-height: 25px;
        margin: 33px auto 0;
        width: 70px;
        height: 25px; }
      .section05 .log_txt_box {
        display: flex;
        justify-content: center;
        margin: 36px auto 0;
        padding: 0 3%;
        max-width: 100%; }
        .section05 .log_txt_box.box02 {
          margin-top: 44px; }
        .section05 .log_txt_box .log {
          width: 21%;
          min-width: 21%; }
        .section05 .log_txt_box .txt_box {
          margin-left: 3%;
          width: calc(100% - 90px); }
          .section05 .log_txt_box .txt_box .tll {
            font-size: 16px; }
          .section05 .log_txt_box .txt_box .ttl02 {
            font-size: 11px;
            margin-top: 14px;
            width: 100%; }
          .section05 .log_txt_box .txt_box .txt {
            font-weight: 400;
            font-size: 10px;
            line-height: 1.8;
            margin-top: 14px; }
            .section05 .log_txt_box .txt_box .txt.txt_lead01 {
              margin-top: 7px; }
      .section05 .map_box {
        margin: 18px auto 0;
        max-width: 100%;
        height: 14%; } }

/* order/info */
.section06 {
  background: #8bd22e;
  box-sizing: border-box;
  padding: 100px 10px;
  width: 100%; }
  .section06 .attention {
    padding: 5px 20px;
    background: #fbffbf;
    color: #8bd22e; }
  .section06 .info-ttl {
    font-size: 18px; }
  .section06 .product-name {
    font-size: 18px; }
  .section06 .price {
    font-weight: bold; }
  .section06 .product-img {
    max-width: 250px; }
  .section06 .txt-link {
    text-decoration: underline; }
  .section06 .bold {
    font-weight: bold;
    font-size: 16px; }
  .section06 .owabi {
    margin-bottom: 15px;
    font-size: 80%; }
  .section06 .section_ttl {
    margin: 0 auto;
    width: 289px; }
  .section06 .txt01 {
    color: #fff;
    font-weight: 400;
    font-size: 15px;
    line-height: 2.3;
    max-width: 640px;
    margin: 100px auto 0 auto; }
  .section06 .txt02 {
    color: #fff;
    font-weight: 400;
    font-size: 15px;
    margin: 35px auto 0;
    text-align: center; }
  .section06 .txt03 {
    color: #fff;
    font-weight: bold;
    font-size: 16px;
    line-height: 1.9;
    margin: 18px auto 0;
    text-align: center; }
  @media (max-width: 1580px) {
    .section06 .txt01 {
      max-width: calc(100% - 140px); } }
  @media screen and (max-width: 768px) {
    .section06 {
      padding: 42px 0; }
      .section06 .section_ttl {
        margin: 0 auto;
        width: 63%; }
      .section06 .txt01 {
        font-size: 12px;
        margin-top: 49px;
        max-width: calc(100% - 40px); }
      .section06 .txt02 {
        font-size: 10px;
        margin: 22px auto 0; }
      .section06 .txt03 {
        font-size: 11px;
        margin: 12px auto 0; } }

.info_box {
  position: relative;
  margin: 52px auto 0;
  max-width: 600px; }
  .info_box form {
    width: 100%; }
  .info_box .item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 auto 18px; }
    .info_box .item.last {
      margin: 0 auto 12px; }
    .info_box .item .nowrap {
      white-space: nowrap; }
    .info_box .item.item_select {
      position: relative; }
      .info_box .item.item_select::before {
        background: url(../img/ico_arrows01.png) no-repeat;
        background-size: 100%;
        content: "";
        pointer-events: none;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        width: 20px;
        height: 12px; }
  .info_box .label {
    color: #fef8e8;
    display: inline-block;
    font-size: 15px;
    line-height: 1.7;
    letter-spacing: .01em;
    width: 25%; }
  .info_box input {
    background: #fff;
    box-sizing: border-box;
    border: none;
    border-radius: 0;
    color: #8bd22e;
    font-weight: 400;
    font-size: 15px;
    padding: 5px 20px;
    width: 75%;
    height: 44px; }
    .info_box input[type="submit"] {
      background: #fffbc2;
      color: #8bd22e;
      font-size: 15px;
      font-weight: bold;
      margin-top: 20px;
      margin-bottom: 4px;
      width: 48%;
      height: 60px;
      transition: .5s; }
      .info_box input[type="submit"]:hover {
        opacity: .6; }
  .info_box select {
    -webkit-appearance: none;
    appearance: none;
    background: #fff;
    box-sizing: border-box;
    border: none;
    border-radius: 0;
    cursor: pointer;
    color: #8bd22e;
    font-weight: 400;
    font-size: 15px;
    margin-right: auto;
    padding: 5px 20px;
    width: 30%;
    height: 44px; }
  .info_box textarea {
    background: #fff;
    border-radius: 0;
    box-sizing: border-box;
    border: none;
    color: #8bd22e;
    font-weight: 400;
    font-size: 15px;
    padding: 10px 20px;
    width: 75%;
    height: 184px; }
  .info_box .txt {
    color: #fef8e8;
    text-align: right; }
  .info_box .btn_area {
    text-align: center; }
  @media screen and (max-width: 768px) {
    .info_box {
      margin: 40px auto 0;
      padding: 0 3%;
      max-width: 100%; }
      .info_box .item {
        margin: 0 auto 9px; }
        .info_box .item.last {
          margin: 0 auto 9px; }
      .info_box .label {
        font-size: 10px;
        width: 30%; }
      .info_box input {
        font-size: 11px;
        padding: 5px 10px;
        width: 70%;
        height: 32px; }
        .info_box input[type="submit"] {
          font-size: 15px;
          margin-top: 30px;
          width: 52%;
          height: 45px; }
      .info_box select {
        font-size: 11px;
        padding: 5px 15px;
        width: 26%;
        height: 32px; }
      .info_box textarea {
        font-size: 11px;
        padding: 5px 15px;
        width: 70%;
        height: 112px; }
      .info_box .txt {
        font-size: 10px; } }

/* Supported by */
.section08 {
  background: #fef8e8;
  box-sizing: border-box;
  padding: 100px 10px;
  width: 100%; }
  .section08 .tsudapro-img {
    display: flex;
    height: auto;
    justify-content: center;
    margin-top: 10px; }
    .section08 .tsudapro-img img {
      width: 30%;
      align-self: flex-start; }
    .section08 .tsudapro-img img:first-of-type {
      margin-right: 20px; }
  .section08 .section_ttl {
    margin: 0 auto;
    width: 430px; }
  .section08 .coment-ttl {
    font-weight: 900;
    color: #ff8a00; }
  .section08 .txt_lead01 {
    display: flex;
    height: auto;
    align-items: flex-start; }
    .section08 .txt_lead01 img {
      width: 48%; }
  .section08 .senjo-img {
    display: flex;
    justify-content: space-between; }
  .section08 .txt01 {
    color: #78c814;
    font-weight: bold;
    font-size: 18px;
    margin-top: 100px;
    text-align: center; }
  .section08 .txt02 {
    border: solid #78c814 1px;
    color: #78c814;
    font-weight: bold;
    font-size: 15px;
    line-height: 40px;
    margin: 38px auto 0;
    width: 140px;
    height: 40px;
    text-align: center; }
  .section08 .sorappa-link {
    padding: 5px 5%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 30px;
    background: #fff; }
    .section08 .sorappa-link img {
      width: 33%;
      padding-right: 2.5%;
      margin-right: 2.5%;
      flex-shrink: 0;
      border-right: 1px solid #ddd; }
    .section08 .sorappa-link a img {
      width: 100%;
      border: none; }
  .section08 .log_txt_box {
    display: flex;
    justify-content: flex-start;
    margin: 47px auto 0;
    max-width: 640px; }
    .section08 .log_txt_box.box02 {
      margin-top: 100px; }
    .section08 .log_txt_box .log {
      width: 90px;
      min-width: 90px; }
    .section08 .log_txt_box .txt_box {
      margin-left: 3%;
      width: calc(100% - 90px); }
      @media (max-width: 1580px) {
        .section08 .log_txt_box .txt_box {
          width: calc(100% - 170px); } }
      .section08 .log_txt_box .txt_box .tll {
        color: #8bd22e;
        font-weight: bold;
        font-size: 22px; }
        .section08 .log_txt_box .txt_box .tll a {
          text-decoration: underline; }
      .section08 .log_txt_box .txt_box .ttl02 {
        font-weight: 400;
        font-size: 15px;
        margin-top: 20px;
        width: 440px; }
      .section08 .log_txt_box .txt_box .txt {
        font-weight: 400;
        font-size: 14px;
        line-height: 1.8;
        margin-top: 21px; }
        .section08 .log_txt_box .txt_box .txt.txt_lead01 {
          margin-top: 14px; }
  .section08 .map_box {
    margin: 42px auto 0;
    max-width: 640px;
    height: 202px; }
    .section08 .map_box iframe {
      display: block;
      width: 100%;
      height: 100%; }
  @media screen and (max-width: 768px) {
    .section08 {
      padding: 43px 0 61px; }
      .section08 .section_ttl {
        width: 32%; }
      .section08 .txt01 {
        font-size: 14px;
        margin-top: 46px; }
      .section08 .txt02 {
        font-size: 12px;
        line-height: 25px;
        margin: 33px auto 0;
        width: 70px;
        height: 25px; }
      .section08 .log_txt_box {
        display: flex;
        justify-content: center;
        margin: 36px auto 0;
        padding: 0 3%;
        max-width: 100%; }
        .section08 .log_txt_box.box02 {
          margin-top: 44px; }
        .section08 .log_txt_box .log {
          width: 21%;
          min-width: 21%; }
        .section08 .log_txt_box .txt_box {
          margin-left: 3%;
          width: calc(100% - 90px); }
          .section08 .log_txt_box .txt_box .tll {
            font-size: 16px; }
          .section08 .log_txt_box .txt_box .ttl02 {
            font-size: 11px;
            margin-top: 14px;
            width: 100%; }
          .section08 .log_txt_box .txt_box .txt {
            font-weight: 400;
            font-size: 10px;
            line-height: 1.8;
            margin-top: 14px; }
            .section08 .log_txt_box .txt_box .txt.txt_lead01 {
              margin-top: 7px; }
      .section08 .map_box {
        margin: 18px auto 0;
        max-width: 100%;
        height: 14%; } }

/* echos */
.section07 {
  box-sizing: border-box;
  padding: 100px 10px;
  width: 100%; }
  .section07 .section_ttl {
    margin: auto;
    width: 204px; }
  .section07 .img_box {
    margin: 53px auto 0;
    max-width: 630px; }
  .section07 .ttl {
    color: #78c814;
    font-weight: bold;
    font-size: 18px;
    margin: 50px auto 0;
    max-width: 630px; }
    .section07 .ttl.ttl02 {
      margin: 35px auto 0; }
  .section07 .txt {
    font-weight: 400;
    font-size: 15px;
    line-height: 2.3;
    margin: 100px auto 0;
    text-align: center; }
    .section07 .txt a {
      text-decoration: underline; }
  .section07 .txt01 {
    font-weight: 400;
    font-size: 15px;
    line-height: 1.8;
    margin: 15px auto 0;
    max-width: 630px;
    text-align: left; }
    .section07 .txt01 .control {
      display: block;
      margin-top: 20px; }
    .section07 .txt01 a {
      text-decoration: underline; }
  @media screen and (max-width: 768px) {
    .section07 {
      padding: 44px 0; }
      .section07 .section_ttl {
        width: 37%; }
      .section07 .img_box {
        margin: 22px auto 0;
        max-width: 100%; }
      .section07 .ttl {
        font-size: 12px;
        margin: 24px auto 0;
        padding: 0 0 0 6%;
        max-width: 100%; }
        .section07 .ttl.ttl02 {
          margin: 22px auto 0; }
      .section07 .txt {
        font-size: 10px;
        margin: 47px auto 0;
        text-align: center; }
        .section07 .txt a {
          text-decoration: underline; }
      .section07 .txt01 {
        font-size: 10px;
        margin: 12px auto 0;
        padding: 0 0 0 6%;
        max-width: 100%; }
        .section07 .txt01 .control {
          margin-top: 15px; } }

.section09 {
  background: #fef8e8;
  box-sizing: border-box;
  padding: 100px 10px;
  width: 100%; }
  .section09 .shopping_local {
    color: #fff;
    background-color: #7ac828;
    padding: 3px 10px;
    border-radius: 5px;
    margin-left: 12px;
    font-size: 14px;
    font-weight: 500;
    display: inline-block; }
  .section09 .section_ttl {
    margin: 0 auto;
    width: 215px; }
  .section09 .txt01 {
    color: #78c814;
    font-weight: bold;
    font-size: 18px;
    margin-top: 100px;
    text-align: center; }
  .section09 .txt02 {
    border: solid #78c814 1px;
    color: #78c814;
    font-weight: bold;
    font-size: 15px;
    line-height: 40px;
    margin: 80px auto 0px;
    width: 140px;
    height: 40px;
    text-align: center; }
  .section09 .log_txt_box {
    display: flex;
    justify-content: flex-start;
    margin: 47px auto 0;
    max-width: 640px; }
    .section09 .log_txt_box.box02 {
      margin-top: 100px; }
    .section09 .log_txt_box .log {
      width: 300px;
      order: 2;
      min-width: 90px; }
    .section09 .log_txt_box .txt_box {
      margin-left: 3%;
      margin-right: 3%;
      width: calc(100% - 90px); }
      @media (max-width: 1580px) {
        .section09 .log_txt_box .txt_box {
          width: calc(100% - 170px); } }
      .section09 .log_txt_box .txt_box .tll {
        color: #8bd22e;
        font-weight: bold;
        font-size: 22px;
        display: flex;
        align-items: end; }
        .section09 .log_txt_box .txt_box .tll a {
          text-decoration: underline; }
      .section09 .log_txt_box .txt_box .ttl02 {
        font-weight: 400;
        font-size: 15px;
        margin-top: 20px;
        width: 440px; }
      .section09 .log_txt_box .txt_box .txt {
        font-weight: 400;
        font-size: 14px;
        line-height: 1.8;
        margin-top: 21px; }
        .section09 .log_txt_box .txt_box .txt.txt_lead01 {
          margin-top: 14px; }
        .section09 .log_txt_box .txt_box .txt .video {
          width: 100%; }
  .section09 .map_box {
    margin: 42px auto 0;
    max-width: 640px;
    height: 202px; }
    .section09 .map_box iframe {
      display: block;
      width: 100%;
      height: 100%; }
  @media screen and (max-width: 768px) {
    .section09 {
      padding: 43px 0 61px; }
      .section09 .section_ttl {
        width: 32%; }
      .section09 .txt01 {
        font-size: 14px;
        margin-top: 46px; }
      .section09 .txt02 {
        font-size: 12px;
        line-height: 25px;
        margin: 33px auto 0;
        width: 70px;
        height: 25px; }
      .section09 .log_txt_box {
        display: flex;
        justify-content: center;
        margin: 36px auto 0;
        padding: 0 3%;
        max-width: 100%; }
        .section09 .log_txt_box.box02 {
          margin-top: 44px; }
        .section09 .log_txt_box .log {
          width: 37%;
          min-width: 21%; }
        .section09 .log_txt_box .txt_box {
          margin-left: 3%;
          width: calc(100% - 90px); }
          .section09 .log_txt_box .txt_box .tll {
            font-size: 16px; }
          .section09 .log_txt_box .txt_box .ttl02 {
            font-size: 11px;
            margin-top: 14px;
            width: 100%; }
          .section09 .log_txt_box .txt_box .txt {
            font-weight: 400;
            font-size: 10px;
            line-height: 1.8;
            margin-top: 14px; }
            .section09 .log_txt_box .txt_box .txt.txt_lead01 {
              margin-top: 7px; }
      .section09 .map_box {
        margin: 18px auto 0;
        max-width: 100%;
        height: 14%; } }

.footer {
  display: none; }
  @media screen and (max-width: 768px) {
    .footer {
      background: #78c814;
      color: #fef8e8;
      display: block;
      padding: 20px 3% 20px;
      text-align: center;
      width: 100%; } }

.txt_box_width {
  width: 475px; }

@media screen and (max-width: 768px) {
  .txt_box_width {
    width: auto; } }
#pop {
  color: #78c814;
  padding-top: 82px; }
  #pop .wrap {
    margin: 0 auto;
    text-align: center; }
  #pop h2 {
    text-align: center; }
  #pop .flex {
    display: flex; }
    @media screen and (max-width: 1100px) {
      #pop .flex {
        display: block; } }
  #pop .pop-img {
    max-width: 1060px;
    margin: 0 auto;
    justify-content: space-between; }
  #pop .section-ttl {
    width: 300px;
    margin: 0 auto; }
  #pop .m-txt {
    font-weight: bold;
    font-size: 26px;
    margin-top: 20px; }
  #pop .s-txt {
    font-size: 18px;
    display: block; }
  #pop .pdf-img {
    border: 2px solid #cacaca;
    width: 295px; }
  #pop .pdf-link {
    margin-top: 103px;
    display: block; }
  #pop .border-btm {
    padding-bottom: 5px;
    border-bottom: 1px solid #78c814;
    margin-top: 56px;
    display: inline-block;
    font-size: 14px; }
  #pop .print-notice {
    padding: 0 20px;
    margin-top: 50px;
    font-size: 14px; }
  #pop .logo {
    margin-top: 140px; }
  #pop .logo-img {
    width: 149px; }
  #pop .copy {
    margin-top: 21px;
    margin-bottom: 15px; }