@charset "UTF-8";
/*! sanitize.css | CC0 Public Domain | github.com/jonathantneal/sanitize.css */
/* Normalization */
:root { -ms-overflow-style: -ms-autohiding-scrollbar; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; }

audio:not([controls]) { display: none; }

details { display: block; }

input[type="number"] { width: auto; }

input[type="search"] { -webkit-appearance: textfield; }

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

main { display: block; }

summary { display: block; }

pre { overflow: auto; }

progress { display: inline-block; }

small { font-size: 75%; }

template { display: none; }

textarea { overflow: auto; }

[hidden] { display: none; }

[unselectable] { -webkit-user-select: none; -ms-user-select: none; user-select: none; }

/* Universal inheritance */
*, ::before, ::after { box-sizing: inherit; }

* { font-size: inherit; line-height: inherit; }

::before, ::after { text-decoration: inherit; vertical-align: inherit; }

/* Opinionated defaults */
*, ::before, ::after { border-style: solid; border-width: 0; }

* { margin: 0; padding: 0; }

:root { box-sizing: border-box; cursor: default; font: 16px / 1.5 sans-serif; text-rendering: optimizeLegibility; }

html { background-color: #FFFFFF; }

a { text-decoration: none; }

audio, canvas, iframe, img, svg, video { vertical-align: middle; }

button, input, select, textarea { background-color: transparent; }

button, input, select, textarea { color: inherit; font-family: inherit; font-style: inherit; font-weight: inherit; }

button, [type="button"], [type="date"], [type="datetime"], [type="datetime-local"], [type="email"], [type="month"], [type="number"], [type="password"], [type="reset"], [type="search"], [type="submit"], [type="tel"], [type="text"], [type="time"], [type="url"], [type="week"], select, textarea { min-height: 1.5em; }

code, kbd, pre, samp { font-family: monospace, monospace; }

nav ol, nav ul { list-style: none; }

select { -moz-appearance: none; -webkit-appearance: none; }

select::-ms-expand { display: none; }

select::-ms-value { color: currentColor; }

table { border-collapse: collapse; border-spacing: 0; }

textarea { resize: vertical; }

::selection { background-color: #B3D4FC; text-shadow: none; }

@media screen { [hidden~="screen"] { display: inherit; }
  [hidden~="screen"]:not(:active):not(:focus):not(:target) { clip: rect(0 0 0 0) !important; position: absolute !important; } }

.clearfix:after { content: " "; display: block; clear: both; }

/* Slider */
.slick-loading .slick-list { background: #fff url("./../images/ajax-loader.gif") center center no-repeat; }

/* Icons */
@font-face { font-family: "slick"; src: url("../lib/fonts/slick.eot"); src: url("../lib/fonts/slick.eot?#iefix") format("embedded-opentype"), url("../lib/fonts/slick.woff") format("woff"), url("../lib/fonts/slick.ttf") format("truetype"), url("../lib/fonts/slick.svg#slick") format("svg"); font-weight: normal; font-style: normal; }

/* Arrows */
.slick-prev, .slick-next { position: absolute; display: block; height: 20px; width: 20px; line-height: 0px; font-size: 0px; cursor: pointer; background: transparent; color: transparent; top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); padding: 0; border: none; outline: none; }

.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { outline: none; background: transparent; color: transparent; }

@media screen and (min-width: 768px) { .slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; } }

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; }

.slick-prev:before, .slick-next:before { font-family: "slick"; font-size: 20px; line-height: 1; color: white; opacity: 0.75; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-prev { left: -25px; }

[dir="rtl"] .slick-prev { left: auto; right: -25px; }

.slick-prev:before { content: "←"; }

[dir="rtl"] .slick-prev:before { content: "→"; }

.slick-next { right: -25px; }

[dir="rtl"] .slick-next { left: -25px; right: auto; }

.slick-next:before { content: "→"; }

[dir="rtl"] .slick-next:before { content: "←"; }

/* Dots */
.slick-dots { position: absolute; bottom: -25px; list-style: none; display: block; text-align: center; padding: 0; margin: 0; width: 100%; }

.slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0 5px; padding: 0; cursor: pointer; }

.slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0px; font-size: 0px; color: transparent; padding: 5px; cursor: pointer; }

.slick-dots li button:hover, .slick-dots li button:focus { outline: none; }

@media screen and (min-width: 768px) { .slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; } }

.slick-dots li button:before { position: absolute; top: 0; left: 0; content: "•"; width: 20px; height: 20px; font-family: "slick"; font-size: 6px; line-height: 20px; text-align: center; color: black; opacity: 0.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-dots li.slick-active button:before { color: black; opacity: 0.75; }

/*
#styleguide
基本スタイル

```
<p>特に何も指定しないときの状態</p>
```
*/
body { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-smoothing: antialiased; text-rendering: auto; font-size: 14px; font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; color: #333; background-color: #fff; box-sizing: border-box; min-width: 960px; }

@media screen and (max-width: 767px) { body { min-width: auto; } }

.top .row { box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; }

.top .col-lg-1 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 8.33333%; flex-basis: 8.33333%; max-width: 8.33333%; }

@media screen and (max-width: 768px) { .top .col-md-1 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 8.33333%; flex-basis: 8.33333%; max-width: 8.33333%; } }

@media screen and (max-width: 767px) { .top .col-sm-1 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 8.33333%; flex-basis: 8.33333%; max-width: 8.33333%; } }

.top .col-lg-2 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 16.66667%; flex-basis: 16.66667%; max-width: 16.66667%; }

@media screen and (max-width: 768px) { .top .col-md-2 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 16.66667%; flex-basis: 16.66667%; max-width: 16.66667%; } }

@media screen and (max-width: 767px) { .top .col-sm-2 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 16.66667%; flex-basis: 16.66667%; max-width: 16.66667%; } }

.top .col-lg-3 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; }

@media screen and (max-width: 768px) { .top .col-md-3 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; } }

@media screen and (max-width: 767px) { .top .col-sm-3 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; } }

.top .col-lg-4 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 33.33333%; flex-basis: 33.33333%; max-width: 33.33333%; }

@media screen and (max-width: 768px) { .top .col-md-4 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 33.33333%; flex-basis: 33.33333%; max-width: 33.33333%; } }

@media screen and (max-width: 767px) { .top .col-sm-4 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 33.33333%; flex-basis: 33.33333%; max-width: 33.33333%; } }

.top .col-lg-5 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 41.66667%; flex-basis: 41.66667%; max-width: 41.66667%; }

@media screen and (max-width: 768px) { .top .col-md-5 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 41.66667%; flex-basis: 41.66667%; max-width: 41.66667%; } }

@media screen and (max-width: 767px) { .top .col-sm-5 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 41.66667%; flex-basis: 41.66667%; max-width: 41.66667%; } }

.top .col-lg-6 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; }

@media screen and (max-width: 768px) { .top .col-md-6 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; } }

@media screen and (max-width: 767px) { .top .col-sm-6 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; } }

.top .col-lg-7 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 58.33333%; flex-basis: 58.33333%; max-width: 58.33333%; }

@media screen and (max-width: 768px) { .top .col-md-7 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 58.33333%; flex-basis: 58.33333%; max-width: 58.33333%; } }

@media screen and (max-width: 767px) { .top .col-sm-7 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 58.33333%; flex-basis: 58.33333%; max-width: 58.33333%; } }

.top .col-lg-8 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 66.66667%; flex-basis: 66.66667%; max-width: 66.66667%; }

@media screen and (max-width: 768px) { .top .col-md-8 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 66.66667%; flex-basis: 66.66667%; max-width: 66.66667%; } }

@media screen and (max-width: 767px) { .top .col-sm-8 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 66.66667%; flex-basis: 66.66667%; max-width: 66.66667%; } }

.top .col-lg-9 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; }

@media screen and (max-width: 768px) { .top .col-md-9 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; } }

@media screen and (max-width: 767px) { .top .col-sm-9 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; } }

.top .col-lg-10 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 83.33333%; flex-basis: 83.33333%; max-width: 83.33333%; }

@media screen and (max-width: 768px) { .top .col-md-10 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 83.33333%; flex-basis: 83.33333%; max-width: 83.33333%; } }

@media screen and (max-width: 767px) { .top .col-sm-10 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 83.33333%; flex-basis: 83.33333%; max-width: 83.33333%; } }

.top .col-lg-11 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 91.66667%; flex-basis: 91.66667%; max-width: 91.66667%; }

@media screen and (max-width: 768px) { .top .col-md-11 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 91.66667%; flex-basis: 91.66667%; max-width: 91.66667%; } }

@media screen and (max-width: 767px) { .top .col-sm-11 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 91.66667%; flex-basis: 91.66667%; max-width: 91.66667%; } }

.top .col-lg-12 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; }

@media screen and (max-width: 768px) { .top .col-md-12 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } }

@media screen and (max-width: 767px) { .top .col-sm-12 { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } }

.top .flex { box-sizing: border-box; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; }

.top .flex:before, .top .flex:after { content: none; }

.top .flex-wrap { -ms-flex-wrap: wrap; flex-wrap: wrap; }

.top .flex-fill { width: 100%; height: 100%; }

.top .flex-horizontal { box-orient: horizontal; box-direction: normal; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }

.top .flex-vertical { box-orient: vertical; box-direction: normal; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }

.top .flex-space-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; flex-pack: justify; box-pack: justify; }

.top .flex-space-around { -ms-flex-pack: distribute; justify-content: space-around; flex-pack: justify; box-pack: justify; }

.top .flex-start { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; flex-pack: start; box-pack: start; }

.top .flex-end { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; flex-pack: end; box-pack: end; }

.top .flex-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; flex-pack: center; box-pack: center; }

.top .flex-align-start { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; flex-align: start; box-align: start; }

.top .flex-align-end { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; flex-align: end; box-align: end; }

.top .flex-align-center { -webkit-box-align: center; -ms-flex-align: center; align-items: center; flex-align: center; box-align: center; }

.top .flex-align-baseline { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; flex-align: baseline; box-align: baseline; }

.top .flex-align-stretch { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; flex-align: stretch; box-align: stretch; }

.top .flex-inline { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }

.top .l-container, 
.about .l-container, 
.event-page .l-container, 
.enjoy .l-container, 
.ad-gallery .l-container, 
.synchro .l-container .story .l-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

@media screen and (max-width: 767px) { .top .l-container, 
  .about .l-container, 
  .event-page .l-container, 
  .enjoy .l-container, 
  .ad-gallery .l-container, 
  .synchro .l-container, 
  .story .l-container { width: 100%; max-width: unset; padding: 0 10px; } }

@media screen and (max-width: 767px) { .top .l-container-subheader, 
  .about .l-container-subheader, 
  .event-page .l-container-subheader, 
  .enjoy .l-container-subheader, 
  .ad-gallery .l-container-subheader, 
  .synchro .l-container-subheader, 
  .story .l-container-subheader { padding: 0; } }

.top .l-main, 
.ad-gallery .l-main { display: block; background-color: #00456e; min-width: 960px; overflow: hidden; }

@media screen and (max-width: 767px) { .top .l-main, 
  .ad-gallery .l-main { width: 100%; min-width: 0; } }

.top .l-main-bottom, 
.ad-gallery .l-main-bottom { position: relative; background: #00456e; z-index: 0; }

.ad-gallery .l-main-bottom { position: relative; }

.ad-gallery .l-main-bottom:after { content: ""; position: absolute; background: #00456e; width: 920px; height: 920px; right: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); background-size: cover; z-index: -1; }

@media screen and (max-width: 767px) { .ad-gallery .l-main-bottom:after { width: 460px; height: 460px; right: -147px; } }

.top .l-section-blend:before { display: none; }

.top .l-main-bottom { position: relative; background-image: none; background-color: #00456e; z-index: 2;}

.top .l-main-bottom::before { content: ""; position: absolute; background-image: url(../../assets/images/blend-bg01.png); width: 837px; height: 932px; left: 0px; top: 359px; background-size: cover; z-index: -1; }

@media screen and (max-width: 767px) { .top .l-main-bottom:before { content: none; } }

.top .l-main-bottom:after { content: ""; position: absolute; background-image: url(../../assets/images/blend-bg02.png); width: 705px; height: 954px; right: 0; bottom: -214px;  background-size: cover; z-index: -1;}

@media screen and (max-width: 767px) { .top .l-main-bottom:after { content: none; } }

.top .footer-block {
  z-index: 1;
}

/* Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; }

.slick-list:focus { outline: none; }

.slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-track { position: relative; left: 0; top: 0; display: block; margin-left: auto; margin-right: auto; }

.slick-track:before, .slick-track:after { content: ""; display: table; }

.slick-track:after { clear: both; }

.slick-loading .slick-track { visibility: hidden; }

.slick-slide { float: left; height: 100%; min-height: 1px; display: none; }

[dir="rtl"] .slick-slide { float: right; }

.slick-slide img { display: block; }

.slick-slide .mv-item-whisky img {
  display: inline-block;
  width: 100%;
  height: auto;
}

.slick-slide.slick-loading img { display: none; }

.slick-slide.dragging img { pointer-events: none; }

.slick-initialized .slick-slide { display: block; }

.slick-loading .slick-slide { visibility: hidden; }

.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-arrow.slick-hidden { display: none; }


/* main-visual */
.top .main-visual { 
  width: 100%; 
  height: calc(700*100vw/1920); 
  overflow: hidden; 
  min-height: 350px; 
}
@media screen and (max-width: 767px) { 
  .top .main-visual { 
    height: calc(1508*100vw/750); 
  } 
}
.top .main-visual-inner { position: relative; height: 100%; }

.top .main-visual-content, .top .main-visual-list { height: 100%; }

.top .main-visual-list { opacity: 0; -webkit-transition: opacity 0.6s ease-out; transition: opacity 0.6s ease-out; }

.top .main-visual-list-inner { position: relative; height: 100%; }

.top .main-visual-list-inner .slick-list, .top .main-visual-list-inner .slick-track, .top .main-visual-list-inner .slick-slide > div { height: 100%; }

.top .main-visual-list-inner .slick-dots { position: absolute; bottom: 10px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }

@media screen and (max-width: 767px) { 
  .top .main-visual-list-inner .slick-dots { bottom: 0; }
}

.top .main-visual-list-inner .slick-dots li { height: 10px; width: 10px; margin: 3px; }

.top .main-visual-list-inner .slick-dots li button:before { top: 0; left: 0; font-size: 12px; color: #aea46f; line-height: 5px; }


.top .main-visual-list-inner .slick-arrow { opacity: 1; -webkit-transition: opacity 0.35s ease-in-out 0s; transition: opacity 0.35s ease-in-out 0s; }

.top .main-visual-list-inner .slick-arrow.slick-disabled { opacity: 0; display: none !important; }

.top .main-visual-list-inner .slick-prev, .top .main-visual-list-inner .slick-next { display: block; cursor: pointer; position: absolute; top: calc(50% - 32px); -webkit-transform: scale(0.5) translateY(-50%); -ms-transform: scale(0.5) translateY(-50%); transform: scale(0.5) translateY(-50%); z-index: 2; width: 80px; height: 128px; outline: none; }

@media screen and (max-width: 767px) { .top .main-visual-list-inner .slick-prev, .top .main-visual-list-inner .slick-next { top: calc(50% - 50px); -webkit-transform: scale(0.25) translateY(-50%); -ms-transform: scale(0.25) translateY(-50%); transform: scale(0.25) translateY(-50%); } }

.top .main-visual-list-inner .slick-prev:before, .top .main-visual-list-inner .slick-next:before { display: none; }

.top .main-visual-list-inner .slick-prev img, .top .main-visual-list-inner .slick-next img { max-width: 100%; }

.top .main-visual-list-inner .slick-prev { left: 0; }

@media screen and (max-width: 767px) { .top .main-visual-list-inner .slick-prev { left: -20px; } }

.top .main-visual-list-inner .slick-next { right: 0; }

@media screen and (max-width: 767px) { .top .main-visual-list-inner .slick-next { right: -20px; } }

.top .main-visual-list-item { height: 100%; display: table-cell; vertical-align: middle; }

.is-load .main-visual-list { opacity: 1; }

.top .mv-item { display: block; position: relative; height: 100%; }

.top .mv-item-inner { height: 100%; }

.top .mv-item-content { display: block; text-align: center; position: relative; }

@media screen and (max-width: 767px) { .top .mv-item-youtube .mv-item-inner { padding-left: 10px; padding-right: 10px; } }

.top .mv-item-youtube .mv-item-content { 
  position: relative; 
  width: calc(889*100vw/1920); 
  min-width: 445px; 
  height: calc(500*100vw/1920); 
  min-height: 250px; 
  margin: 0 auto; 
  top: 50%;
  -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); 
  transform: translateY(-50%);
}

@media screen and (max-width: 767px) { .top .mv-item-youtube .mv-item-content { position: relative; padding-top: 56.25%; height: auto; min-height: auto; width: 100%; min-width: 100%; } }

.top .mv-item-youtube iframe { width: 100%; height: 100%; }


/* about */
.top .about-ec-button { 
  text-align: center; 
  margin-top: 10px; 
}

@media screen and (max-width: 767px) { 
  .top .about-ec-button { 
    width: 94%; 
    margin: 10px auto 0; 
  } 
}

.top .about-ec-button img { width: 100%; height: 100%; }

@media screen and (max-width: 767px) { .top .about-ec-button iframe.fixed { top: 110px !important; } }

.top .about-ec-button_inner { margin: auto; }

.top .about { display: block; width: 100%; text-align: center; color: #fff; font-family: "Noto Serif JP", serif; }

.top .about-intro { padding-top: 65px;}

@media screen and (max-width: 767px) { 
  .top .about-intro { 
    padding-top: 30px; 
    padding-left: 10px; 
    padding-right: 10px; 
  } 
}
  
.top .about-intro p { 
  font-size: 46px; 
  letter-spacing: 0.06em; 
  line-height: 1.65; 
  margin-bottom: 60px; 
}
@media screen and (max-width: 767px) { 
  .top .about-intro p { 
    font-size: 23px; 
    margin-bottom: 20px; 
  }
}
.top .about-intro p.about-intro-txt2 { 
  font-size: 26px; 
  letter-spacing: 0; 
  line-height: 1; 
  margin-bottom: 90px; 
}
@media screen and (max-width: 767px) {
  .top .about-intro p.about-intro-txt2 { 
    font-size: 13px; 
    margin-bottom: 50px;
  }
}
.top .about-content { 
  background-image: url(../../assets/images/top-about-bg.jpg); 
  background-size: cover; 
  background-position: top center; 
  height: 535px; 
  box-sizing: border-box;
}
@media screen and (max-width: 767px) {
  .top .about-content { 
    background-image: url(../../assets/images/top-about-bg-sp.jpg); 
    background-size: cover; background-position: center; 
    height: auto;
  }
}
.top .about-content-inner {
  width: 950px;
  height: 535px; 
  box-sizing: border-box;
  margin: 0 auto;
  padding-top: 88px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .top .about-content-inner {
    width: 100%;
    height: auto;
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
.top .about .about-head {
  margin-bottom: 43px;
  font-size: 46px; 
  font-weight: 500; 
  letter-spacing: 0.06em;
  line-height: 1;
  color: #00456e;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .top .about .about-head {
    margin-bottom: 30px;
    font-size: 23px;
    line-height: 1.3;
  }
}
.top .about-read { 
  font-size: 26px; 
  letter-spacing: 0.08em; 
  line-height: 1.76; 
  color: #000000;
}
@media screen and (max-width: 767px) { 
  .top .about-read { 
    font-size: 17px; 
    margin-bottom: 25px;
  } 
}
.top .about-img { 
  position: absolute;
  right: 30px;
  bottom: 61px;
}
@media screen and (max-width: 767px) {
  .top .about-img { 
    position: static;
    width: 218px;
    margin: auto;
  }
}


/* highball */
.top .l-section-highball {
  padding-top: 90px;
  background: #00456e url(../../assets/images/top-highball-bg.jpg) no-repeat top center;
  background-size: 1920px auto;
  padding-bottom: 90px;
}
@media screen and (max-width: 767px) {
  .top .l-section-highball {
    position: relative;
    padding-top: 0;
    padding-bottom: 50px;
    background: #00456e url(../../assets/images/top-highball-bg-sp.jpg) no-repeat center top;
    background-size: 100% auto;
  }
}
@media screen and (max-width: 767px) {
  .top .highball .highball-head {
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    text-align: center;
  }
}
.top .highball .highball-head p {
  font-size: 24px;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .top .highball .highball-head p {
    font-size: 13px;
    letter-spacing: 0.06em;
  }
}
.top .highball .highball-head h3 {
  font-size: 46px;
  font-weight: 500;
  margin: 25px 0 0;
  line-height: 1;
  letter-spacing: 0.06em;
}
@media screen and (max-width: 767px) {
  .top .highball .highball-head h3 {
    font-size: 23px;
    margin: 15px 0;
  }
}
.top .highball .highball-img {
  margin-top: 53px;
}
@media screen and (max-width: 767px) {
  .top .highball .highball-img {
    width: calc(684*100vw/750);
    margin-top: 0;
    padding-top: calc(262*100vw/750);
  }
}
.top .highball .highball-img img {
  max-width: 100%;
  height: auto;
}
.top .highball .highball-button {
  margin-top: -57px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .top .highball .highball-button {
    margin-top: 3px;
  }
}
.top .highball .highball-button a{
  opacity: 1; 
  -webkit-transition: opacity .2s linear; 
  transition: opacity .2s linear;
  display: block;
  width: 356px;
  margin: auto;
}
@media screen and (min-width: 768px) { 
  .top .highball .highball-button a:hover {
    opacity: 0.5; 
  } 
}
@media screen and (max-width: 767px) {
  .top .highball .highball-button a{
    width: calc(558*100vw/750);
  }
  .top .highball .highball-button a img{
    width: 100%;
  }
}
.top .highball .highball-cm {
  margin-top: 79px;
  text-align: center;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .top .highball .highball-cm {
    margin-top: 45px;
  }
}
.top .highball .highball-cm-subtxt {
  font-size: 24px;
  line-height: 1;
  letter-spacing: 0.2em;
}
@media screen and (max-width: 767px) {
  .top .highball .highball-cm-subtxt {
    font-size: 13px;
    letter-spacing: 0.06em;
  }
}
.top .highball .highball-cm-txt {
  margin-top: 20px;
  font-size: 46px;
  line-height: 1;
  letter-spacing: 0.06em;
}
@media screen and (max-width: 767px) {
  .top .highball .highball-cm-txt {
    margin-top: 15px;
    font-size: 21px;
    letter-spacing: 0.05em;
  }
}
.top .highball .highball-youtube {
  position: relative;
  margin: 40px auto 0;
  width: calc(934*100vw/1920);
  min-width: 598px;
  height: calc(525*100vw/1920);
  min-height: 336px;
}
@media screen and (max-width: 767px) {
  .top .highball .highball-youtube {
    margin: 25px auto 0;
    width: 100%;
    height: calc(392*100vw/750);
    min-width: auto;
    min-height: auto;
  }
}
.top .highball .highball-youtube-inner {
  margin: 0 auto; 
}
.top .highball .highball-youtube iframe { width: 100%; height: 100%; }


/* recipe */
.recipe .recipe-content {
  width: 100%;
  background: url(../images/top-recipe-bg.jpg) no-repeat center; 
  background-size: cover;
  height: 912px;
  padding-top: 90px;
}
@media screen and (max-width: 767px) {
  .recipe .recipe-content {
    background: url(../images/top-recipe-bg-sp.jpg) no-repeat center; 
    background-size: cover;
    height: auto;
    padding: 50px 0 50px;
  }
}
.recipe-content-inner {
  width: 100%;
  max-width: 988px;
  min-width: 950px;
  box-sizing: border-box;
  margin: 0 auto;
  position: relative;
}
@media screen and (max-width: 767px) {
  .recipe-content-inner {
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    height: auto;
  }
}
.recipe .recipe-head {
  margin-bottom: 65px;
  font-size: 46px; 
  font-weight: 500; 
  letter-spacing: 0.06em;
  line-height: 1;
  color: #00456e;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .recipe .recipe-head {
    margin-bottom: 35px;
    font-size: 23px;
    line-height: 1.3;
  }
}
.recipe .recipe-list {
  width: 100%;
  max-width: 988px;
  min-width: 950px;
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .recipe .recipe-list {
    display: block;
    width: calc(604*100vw/750);
    max-width: calc(604*100vw/750);
    min-width: calc(604*100vw/750);
  }
}
.recipe .recipe-list-txt {
  font-size: 16px;
  color: #000000;
  line-height: 2.5;
  letter-spacing: 0.16em;
}
@media screen and (max-width: 767px) {
  .recipe .recipe-list-txt {
    font-size: 12px;
    line-height: 1.6;
    letter-spacing: 0.13em;
  }
}
.recipe-list-rock .recipe-list-img {
  margin-top: 166px;
  width: 42.2%;
}
@media screen and (max-width: 767px) {
  .recipe-list-rock .recipe-list-img {
    margin-top: 43px;
    width: calc(604*100vw/750);
  }
}
.recipe-list-rock .recipe-list-txt {
  margin-top: -46px;
  margin-left: 35px;
}
@media screen and (max-width: 767px) {
  .recipe-list-rock .recipe-list-txt {
    margin-top: -33px;
    margin-left: calc(55*100vw/750);
  }
}
.recipe-list-highball .recipe-list-txt {
  margin-top: -21px;
  margin-left: 13px;
}
@media screen and (max-width: 767px) {
  .recipe-list-highball .recipe-list-txt {
    margin-top: -25px;
    margin-left: calc(16*100vw/750);
  }
}
@media screen and (max-width: 767px) {
  .recipe .recipe-list-img img{
    width: 100%;
  }
}
.recipe-read { 
  margin-top: 109px;
  width: 15.6%;
}
@media screen and (max-width: 767px) { 
  .recipe-read { 
    width: 100%;
    margin-top: 40px;
    margin-bottom: 43px;
    font-size: 20px; 
    color: #00456e;
    font-weight: 500; 
    line-height: 1;
    letter-spacing: 0.16em;
    text-align: center;
  } 
}


/* whiskies */
.top .l-section-whiskies {
  padding: 100px 0 90px;
  background: #00456e;
}
@media screen and (max-width: 767px) {
  .top .l-section-whiskies {
    padding: 50px 0;
  }
}
.top .whiskies .whiskies-head {
  margin-bottom: 95px;
  font-size: 46px; 
  font-weight: 500; 
  letter-spacing: 0.06em;
  line-height: 1;
  color: #fff;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .top .whiskies .whiskies-head {
    margin-bottom: 40px;
    font-size: 23px;
  }
}
.top .whiskies .whiskies-list img{
  width: 100%;
}
.top .whiskies-content {
  width: 100%;
  background: url(../images/top-whiskies-bg.jpg) no-repeat center; 
  background-size: cover;
  height: 595px;
  padding-top: 70px;
}
@media screen and (max-width: 767px) {
  .top .whiskies-content {
    background: url(../images/top-whiskies-bg-sp.jpg) no-repeat center; 
    background-size: cover;
    height: auto;
    padding: 40px 0 50px;
  }
}
.top .whiskies-content-inner {
  width: 100%;
  max-width: 990px;
  padding: 0 20px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .top .whiskies-content-inner {
    width: 80%;
    padding: 0;
  }
}
.top .whiskies-content-inner .whiskies-read {
  font-size: 16px; 
  line-height: 2.25;
}
@media screen and (max-width: 767px) {
  .top .whiskies-content-inner .whiskies-read {
    font-size: 12px; 
    line-height: 1.9;
  }
}
.top .whiskies .whiskies-btn-group { 
  display: -webkit-box; 
  display: -ms-flexbox; 
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center; 
  align-items: center; 
}
@media screen and (max-width: 767px) { 
  .top .whiskies .whiskies-btn-group { display: block; } 
}
.top .whiskies .whiskies-btn { 
  margin-top: 65px;
  padding: 0 35px; 
  text-align: center; 
  -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; 
  transition: opacity .5s ease-out, -webkit-transform .8s ease-out; 
  transition: opacity .5s ease-out, transform .8s ease-out; 
  transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; 
}
@media screen and (max-width: 767px) { 
  .top .whiskies .whiskies-btn {
    margin-top: 20px;
  }
}
.top .whiskies .whiskies-btn.is-scroll-animation-active { 
  -webkit-transform: translateY(0); 
  -ms-transform: translateY(0); 
  transform: translateY(0); 
}
.top .whiskies .btn { display: inline-block; padding: 18px 0 0 0; width: 320px; height: 62px; letter-spacing: 0.15em; text-align: center; background-repeat: no-repeat; background-position: 0 0; background-size: 100% 100%; -webkit-transition: opacity .2s linear; transition: opacity .2s linear; }

@media screen and (max-width: 767px) { .top .whiskies .btn { padding: 12px 0 0 0; width: 180px; height: 45px; } }

.top .whiskies .btn.btn-black { background-image: url(../images/about/btn-black.png); }

.top .whiskies .btn.btn-black .btn-text { color: #000; }

.top .whiskies .btn.btn-black .btn-text::after { background-image: url(../images/about/ico-arrow-right-black.png); }

.top .whiskies .btn .btn-text { display: inline-block; position: relative; font-size: 18px; }

@media screen and (max-width: 767px) { .top .whiskies .btn .btn-text { line-height: 1; font-size: 12px; } }

.top .whiskies .btn .btn-text::after { position: absolute; top: calc(50% - -1px); right: -17px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 8px; height: 16px; background-size: 100%; background-repeat: no-repeat; background-position: 0 0; content: ''; }

@media screen and (max-width: 767px) { .top .whiskies .btn .btn-text::after { top: calc(50% - -2px); right: -15px; width: 6px; height: 14px;} }


/* キャンペーンバナー */
.top .top_campaign_banner a{
  display: block;
  width: 750px;
  margin: 0 auto;
}
.top .top_campaign_banner a img{
  width: 100%;
}
@media screen and (max-width: 767px) {
  .top .top_campaign_banner a{
    width: calc(710*100vw/750);
    margin: 0 auto;
  }
}

.top .link { display: inline-block; position: relative; min-width: 252px; max-height: 62px; font-family: "Noto Serif JP", serif; color: #fff; opacity: 1; -webkit-transition: opacity .2s linear; transition: opacity .2s linear; }

@media screen and (min-width: 768px) { .top .link:hover { opacity: 0.5; } }

@media screen and (max-width: 767px) { .top .link { min-width: 251px; max-height: 46px; } }

.top .link:before { position: absolute; content: ""; top: 0; right: 0; bottom: 0; left: 0; background-image: url(./../images/button-border.png); background-size: cover; background-position: center; background-repeat: no-repeat; }

@media screen and (max-width: 767px) { .top .link:before { background-size: contain; } }

.top .link-text { display: block; text-align: center; font-size: 18px; font-weight: 900; padding: 16px 0; }

@media screen and (max-width: 767px) { .top .link-text { padding: 8px 0; } }

.top .link-icon { display: inline-block; -webkit-transform: translateY(-1px) scale(0.5); -ms-transform: translateY(-1px) scale(0.5); transform: translateY(-1px) scale(0.5); }

.top .link-icon img { max-width: 100%; }

.top .enjoy { font-family: "Noto Serif JP", serif; color: #fff; }

.top .enjoy-title { font-family: "Noto Serif JP", serif; font-size: 46px; font-weight: 500; margin: 10px 0 27px; text-align: center; }

@media screen and (max-width: 767px) { .top .enjoy-title { font-size: 24px; margin: 0 0 16px; } }

.top .enjoy-content { font-size: 18px; text-align: center; letter-spacing: 0.05em; line-height: 1.8; }

@media screen and (max-width: 767px) { .top .enjoy-content { font-size: 12px; text-align: left; line-height: 1.45; letter-spacing: 0.18em; } }

.top .enjoy-media { display: block; margin-top: 56px; padding: 0 10px; }

@media screen and (max-width: 767px) { .top .enjoy-media { margin-top: 35px; padding: 0; } }

.top .enjoy-img { display: block; padding: 0; }

.top .enjoy-img img { max-width: 100%; }

.top .enjoy-footer { margin-top: 22px; }

@media screen and (max-width: 767px) { .top .enjoy-footer { margin-top: 15px; } }

.top .enjoy-article { font-family: "Noto Serif JP", serif; position: relative; color: #000; background-image: url(../../assets/images/whisky-bg.jpg); background-size: cover; background-position: center; min-height: 380px; opacity: 1; -webkit-transition: opacity .2s linear; transition: opacity .2s linear; }

@media screen and (min-width: 768px) { .top .enjoy-article:hover { opacity: 0.5; } }

@media screen and (max-width: 767px) { .top .enjoy-article { min-height: 130px; display: -webkit-box; display: -ms-flexbox; display: flex; overflow: hidden; padding: 0; } }

.top .enjoy-article-inner { position: relative; }

@media screen and (max-width: 767px) { .top .enjoy-article-inner { display: table-cell; vertical-align: middle; width: 100%; font-size: 0; letter-spacing: 0; } }

.top .enjoy-article-media { position: relative; display: block; text-align: center; margin: 0 auto; min-height: 264px; }

.top .enjoy-article-media img { max-width: 100%; }

@media screen and (max-width: 767px) { .top .enjoy-article-media { display: inline-block; vertical-align: middle; min-height: unset; width: 40%; height: auto; padding: 0; overflow: hidden; } }

.top .enjoy-article-thumb { text-align: center; margin: 0 auto; }

.top .enjoy-article-description { font-size: 18px; padding: 0 40px; text-align: center; }

@media screen and (max-width: 767px) { .top .enjoy-article-description { display: inline-block; vertical-align: middle; bottom: 0; width: 60%; padding: 0; } }

.top .enjoy-article-text { font-size: 18px; font-weight: bold; letter-spacing: 0.1em; min-height: 56px; }

@media screen and (max-width: 767px) { .top .enjoy-article-text { position: static; font-size: 15px; min-height: unset; } }

@media screen and (max-width: 767px) { .top .enjoy-article-1 .enjoy-article-media { -webkit-transform: translateX(19px) translateY(5px); -ms-transform: translateX(19px) translateY(5px); transform: translateX(19px) translateY(5px); } }

.top .enjoy-article-1 .enjoy-article-inner { padding-top: 48px; }

@media screen and (max-width: 767px) { .top .enjoy-article-1 .enjoy-article-inner { padding-top: 0; } }

.top .enjoy-article-1 .enjoy-article-thumb { width: 145px; height: 247px; }

@media screen and (max-width: 767px) { .top .enjoy-article-1 .enjoy-article-thumb { width: 74px; height: auto; } }

.top .enjoy-article-2 .enjoy-article-inner { padding-top: 80px; }

@media screen and (max-width: 767px) { .top .enjoy-article-2 .enjoy-article-inner { padding-top: 0; } }

.top .enjoy-article-2 .enjoy-article-media { min-height: 210px; }

@media screen and (max-width: 767px) { .top .enjoy-article-2 .enjoy-article-media { min-height: unset; -webkit-transform: translateX(19px) translateY(22px); -ms-transform: translateX(19px) translateY(22px); transform: translateX(19px) translateY(22px); } }

.top .enjoy-article-2 .enjoy-article-thumb { width: 156px; height: 183px; }

@media screen and (max-width: 767px) { .top .enjoy-article-2 .enjoy-article-thumb { width: 78px; height: auto; } }

@media screen and (max-width: 767px) { .top .enjoy-article-2 .enjoy-article-description { margin-top: 38px; } }

.top .enjoy-article-3 .enjoy-article-inner { padding-top: 40px; }

@media screen and (max-width: 767px) { .top .enjoy-article-3 .enjoy-article-inner { padding-top: 0; } }

.top .enjoy-article-3 .enjoy-article-media { min-height: 272px; }

@media screen and (max-width: 767px) { .top .enjoy-article-3 .enjoy-article-media { min-height: unset; -webkit-transform: translateX(16px) translateY(4px); -ms-transform: translateX(16px) translateY(4px); transform: translateX(16px) translateY(4px); } }

.top .enjoy-article-3 .enjoy-article-thumb { width: 145px; height: 264px; }

@media screen and (max-width: 767px) { .top .enjoy-article-3 .enjoy-article-thumb { width: 72px; height: auto; } }

.top .top-button { margin-top: 30px; }

.top .top-button-link { background: url("/assets/images/button-border.png") no-repeat; background-size: 100% 100%; display: block; width: 232px; padding: 17px 25px 17px 10px; font-size: 24px; margin: 0 auto; text-align: center; color: #fff; text-decoration: none; position: relative; }

@media screen and (max-width: 767px) { .top .top-button-link { padding: 10px 25px 10px 10px; font-size: 20px; } }

.top .top-button-link:after { content: url("/assets/images/button-arrow.png"); left: 10px; position: relative; }

.top .menu, .about .menu, .event-page .menu , .enjoy .menu, .ad-gallery .menu, .synchro .menu, .story .menu { display: block; position: relative; width: 25px; max-width: 25px; max-height: 16px; outline: none; cursor: pointer; }

.top .menu.is-open .menu-bar:first-child, .about .menu.is-open .menu-bar:first-child, .event-page .menu.is-open .menu-bar:first-child, .enjoy .menu.is-open .menu-bar:first-child, .ad-gallery .menu.is-open .menu-bar:first-child, .synchro .menu.is-open .menu-bar:first-child, .story .menu.is-open .menu-bar:first-child { left: 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }

.top .menu.is-open .menu-bar:nth-child(2), .about .menu.is-open .menu-bar:nth-child(2), .event-page .menu.is-open .menu-bar:nth-child(2), .enjoy .menu.is-open .menu-bar:nth-child(2), .ad-gallery .menu.is-open .menu-bar:nth-child(2), .synchro .menu.is-open .menu-bar:nth-child(2), .story .menu.is-open .menu-bar:nth-child(2) { background-color: transparent; }

.top .menu.is-open .menu-bar:last-child, .about .menu.is-open .menu-bar:last-child, .event-page .menu.is-open .menu-bar:last-child, .enjoy .menu.is-open .menu-bar:last-child, .ad-gallery .menu.is-open .menu-bar:last-child, .synchro .menu.is-open .menu-bar:last-child, .story .menu.is-open .menu-bar:last-child { bottom: 2px; left: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }

.top .menu-bar, .about .menu-bar, .event-page .menu-bar, .enjoy .menu-bar, .ad-gallery .menu-bar, .synchro .menu-bar, .story .menu-bar { position: absolute; left: 0; height: 2px; width: 100%; background-color: #fff; -webkit-transform-origin: top right; -ms-transform-origin: top right; transform-origin: top right; -webkit-transition: background-color 0.35s ease-in-out 0s, -webkit-transform 0.35s ease-in-out 0s; transition: background-color 0.35s ease-in-out 0s, -webkit-transform 0.35s ease-in-out 0s; transition: transform 0.35s ease-in-out 0s, background-color 0.35s ease-in-out 0s; transition: transform 0.35s ease-in-out 0s, background-color 0.35s ease-in-out 0s, -webkit-transform 0.35s ease-in-out 0s; }

.top .menu-bar:first-child, .about .menu-bar:first-child, .event-page .menu-bar:first-child, .enjoy .menu-bar:first-child, .ad-gallery .menu-bar:first-child, .synchro .menu-bar:first-child, .story .menu-bar:first-child { top: 0; -webkit-transform-origin: top right; -ms-transform-origin: top right; transform-origin: top right; }

.top .menu-bar:nth-child(2), .about .menu-bar:nth-child(2),  .event-page .menu-bar:nth-child(2), .enjoy .menu-bar:nth-child(2), .ad-gallery .menu-bar:nth-child(2), .synchro .menu-bar:nth-child(2), .story .menu-bar:nth-child(2) { top: calc(50% - 0.5px); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }

.top .menu-bar:last-child, .about .menu-bar:last-child, .event-page .menu-bar:last-child, .enjoy .menu-bar:last-child, .ad-gallery .menu-bar:last-child, .synchro .menu-bar:last-child, .story .menu-bar:last-child { -webkit-transform-origin: bottom right; -ms-transform-origin: bottom right; transform-origin: bottom right; bottom: 1px; }

.top .loader { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 12; background-image: url(../../assets/images/loader-bg.jpg); background-size: cover; background-color: #000; background-position: center; opacity: 0; -webkit-transition: opacity 1s ease-in-out 0s; transition: opacity 1s ease-in-out 0s; }

.top .loader.is-active { opacity: 1; }

.top .loader-inner { position: relative; height: 100%; top: 0; left: 0; }

.top .loader-contents { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); text-align: center; min-width: 250px; }

.top .loader-contents p { font-family: "Noto Serif JP", serif; color: #fff; font-size: 30px; }

@media screen and (max-width: 767px) { .top .loader-contents p { font-size: 18px; } }

.top .loader-contents p span { display: block; line-height: 2.25; }

.top .loader-btn { display: inline-block; text-align: center; outline: none; cursor: pointer; margin-top: 140px; }

@media screen and (max-width: 767px) { .top .loader-btn { margin-top: 80px; } }

.top .loader-btn-text, .top .loader-btn-icon { display: inline-block; vertical-align: middle; }

.top .loader-btn-text { display: inline-block; vertical-align: middle; font-family: "Noto Serif JP", serif; color: #fff; font-size: 18px; letter-spacing: 0.15em; }

@media screen and (max-width: 767px) { .top .loader-btn-text { font-weight: bold; font-size: 18px; } }

.top .loader-btn-icon { margin-top: 3px; position: relative; -webkit-transform: scale(0.5); -ms-transform: scale(0.5); transform: scale(0.5); }

.top .loader-text span { opacity: 0; }

.top .loader-text span:first-child { -webkit-transition: opacity 1s ease 0s; transition: opacity 1s ease 0s; }

.top .loader-text span:nth-child(2) { -webkit-transition: opacity 2.5s ease 1s; transition: opacity 2.5s ease 1s; }

.top .loader-text span:last-child { -webkit-transition: opacity 4s ease 2.5s; transition: opacity 4s ease 2.5s; }

.top .loader-text.is-show span { opacity: 1; }

.badge {
  position: fixed;
  z-index: 10;
  right: 0px;
  bottom: 0;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease-in-out 0s;
  transition: opacity 0.35s ease-in-out 0s;
  pointer-events: none;
}

@media screen and (max-width: 767px) {
  .badge {
    bottom: 0;
    right: 0;
    left: auto;
    width: 30%;
  }
}
.badge.is-active {
  opacity: 1;
  pointer-events: auto;
  z-index: 999;
}

.badge.is-overlap { opacity: 0; pointer-events: none; }

.badge-inner { padding: 0; }


.ad-gallery .mv-heading { display: table; width: 100%; min-height: 300px; }

.ad-gallery .mv-heading-inner { position: relative; display: table-cell; vertical-align: middle; }

.ad-gallery .mv-heading-title span { font-family: "Noto Serif JP", serif; font-size: 42px; font-weight: 500; }

.ad-gallery .yt-media { display: block; margin-bottom: 33px; }

.ad-gallery .yt-media + .yt-media{
  margin-top: 65px;
}
@media screen and (max-width: 767px) {
  .ad-gallery .yt-media + .yt-media{
    margin-top: 20px;
  }
}


.ad-gallery .yt-media-block:not(:last-child) {
  margin-bottom: 80px;
}
@media screen and (max-width: 767px) {
  .ad-gallery .yt-media-block:not(:last-child) {
    margin-bottom: 40px;
  }
}

.ad-gallery .yt-media-block__heading {
  width: 600px;
  max-width: 65%;
  margin: 0 auto 30px;
}
.ad-gallery .yt-media-block__heading img {
  max-width: 100%;
  height: auto;
}
@media screen and (max-width: 767px) { .ad-gallery .yt-media { margin-bottom: 8px; } }

.ad-gallery .yt-media-text { font-family: "Noto Serif JP", serif; font-size: 42px; font-weight: 500; letter-spacing: 0.11em; border-bottom: 1px solid #fff; padding-bottom: 17px; }

@media screen and (max-width: 767px) { .ad-gallery .yt-media-text { font-size: 24px; padding-bottom: 13px; } }

/* .ad-gallery .yt-media-desc { margin-top: 66px; } */

@media screen and (max-width: 767px) { .ad-gallery .yt-media-desc { margin-top: 33px; } }

.ad-gallery .yt-media-content { position: relative; height: 525px; }

@media screen and (max-width: 767px) { .ad-gallery .yt-media-content { padding-top: 56.25%; height: auto; margin-top: 5px; } }

.ad-gallery .gallery-media { display: block; margin-bottom: 20px; }

.ad-gallery .gallery-media-title { margin: 20px auto 33px; }

@media screen and (max-width: 767px) { .ad-gallery .gallery-media-title { margin-bottom: 0; } }

.ad-gallery .gallery-media-title span { font-family: "Noto Serif JP", serif; font-weight: 500; }

.ad-gallery .gallery-media-title-sm, .ad-gallery .gallery-media-title-lg, .ad-gallery .gallery-media-title-last { display: block; }

.ad-gallery .gallery-media-title-sm { font-size: 30px; letter-spacing: 0.11em; }

@media screen and (max-width: 767px) { .ad-gallery .gallery-media-title-sm { font-size: 15px; } }

.ad-gallery .gallery-media-title-lg { font-size: 42px; letter-spacing: 0.11em; margin-top: 4px; }

@media screen and (max-width: 767px) { .ad-gallery .gallery-media-title-lg { font-size: 24px; margin-top: 0; } }

.ad-gallery .gallery-media-title-last { font-weight: bold; margin-top: 5px; padding-bottom: 17px; letter-spacing: 0.11em; font-size: 17px; }

@media screen and (max-width: 767px) { .ad-gallery .gallery-media-title-last { font-size: 12px; margin-top: 8px; letter-spacing: 0.08em; line-height: 1.8; } }

/* .ad-gallery .gallery-media-content { margin-top: 46px; } */

@media screen and (max-width: 767px) { .ad-gallery .gallery-media-content { margin-top: 15px; } }

.ad-gallery .gallery-media-desc { margin: 0 auto 77px; font-size: 16px; max-width: 960px; padding: 0 44px; line-height: 2; text-align: justify; letter-spacing: 0.17em; }

@media screen and (max-width: 767px) { .ad-gallery .gallery-media-desc { margin: 20px auto 23px; font-size: 12px; padding: 0; line-height: 1.8; letter-spacing: 0.06em; } }

.ad-gallery .gallery-media-links { display: block; width: 100%; font-size: 0; letter-spacing: 0; padding-bottom: 45px; }

@media screen and (max-width: 767px) { .ad-gallery .gallery-media-links { position: relative; padding-bottom: 15px; }
  .ad-gallery .gallery-media-links:before { position: absolute; content: ""; top: 5px; right: 50%; height: 80%; width: 1px; background-image: url(../../assets/images/separator.png); background-size: cover; z-index: 1; } }

.ad-gallery .gallery-media-links-left, .ad-gallery .gallery-media-links-right { display: inline-block; vertical-align: top; width: 50%; text-align: center; }

.ad-gallery .gallery-media-links-left { position: relative; text-align: right; padding-right: 10px; }

@media screen and (max-width: 767px) { .ad-gallery .gallery-media-links-left { padding-right: 0; } }

.ad-gallery .gallery-media-links-right { text-align: left; padding-left: 30px; }

@media screen and (max-width: 767px) { .ad-gallery .gallery-media-links-right { padding-left: 0; } }

.ad-gallery .gallery-media-title-mid { margin: 0 auto 30px; }

@media screen and (max-width: 767px) { .ad-gallery .gallery-media-title-mid { margin: 21px auto 20px; } }

.cmn-subheader { display: block; font-family: "Noto Serif JP", serif; background-color: #041931; z-index: 9999; }

.cmn-subheader-inner { position: relative; }

.cmn-subheader-site { float: left; padding: 12px 0; }

@media screen and (max-width: 767px) { .cmn-subheader-site { position: relative; float: none; display: block; padding: 7px 13px 10px; width: 100%; max-width: 100%; z-index: 11; background-color: #091d37; } }

.cmn-subheader-site-link { display: block; }

@media screen and (max-width: 767px) { .cmn-subheader-site-link { display: inline-block; } }

.cmn-subheader-logo, .cmn-subheader-menu-list-link { display: block; color: #fff; }

@media screen and (max-width: 767px) { .cmn-subheader-logo svg { width: 215px; height: 39px; } }

@media screen and (max-width: 767px) { .cmn-subheader-nav { display: inline-block; position: absolute; top: calc(50% + 2px); right: 10px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } }

.cmn-subheader-menu-pc { display: inline-block; vertical-align: top; float: right; max-width: 601px; }

@media screen and (max-width: 1120px) { .cmn-subheader-menu-pc { width: 68%; max-width: unset; }
  .cmn-subheader-menu-pc .cmn-subheader-menu-list { width: 100%; -ms-flex-pack: distribute; justify-content: space-around; }
  .cmn-subheader-menu-pc .cmn-subheader-menu-list-item { width: auto; -ms-flex-line-pack: center; align-content: center; padding: 0 12px; } }

@media screen and (max-width: 767px) { .cmn-subheader-menu-pc { display: none; position: absolute; top: 55px; left: 0; z-index: 10; width: 100%; max-width: 100%; background-color: #021125; } }

.cmn-subheader-menu-sp { display: none; }

@media screen and (max-width: 767px) { .cmn-subheader-menu-sp { display: inline-block; position: absolute; top: 0; left: 0; z-index: 10; width: 100%; height: 56px; max-width: 100%; padding-top: 55px; overflow: hidden; -webkit-transition: height 0.35s ease-in-out 0s; transition: height 0.35s ease-in-out 0s; }
  .cmn-subheader-menu-sp .cmn-subheader-menu-list { -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: -webkit-transform 0.35s ease-in-out 0s; transition: -webkit-transform 0.35s ease-in-out 0s; transition: transform 0.35s ease-in-out 0s; transition: transform 0.35s ease-in-out 0s, -webkit-transform 0.35s ease-in-out 0s; }
  .cmn-subheader-menu-sp .cmn-subheader-menu-list.is-open { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } }

.cmn-subheader-menu-sp.is-open { height: 324px; }

.cmn-subheader-menu-list { display: -webkit-box; display: -ms-flexbox; display: flex; width: 601px; list-style-type: none; }

@media screen and (max-width: 767px) { .cmn-subheader-menu-list { display: block; width: 100%; max-width: 100%; background-color: #021125; } }

.cmn-subheader-menu-list-item { position: relative; width: 37%; }
.cmn-subheader-menu-list-item:first-child { width:30%; }
.cmn-subheader-menu-list-item:nth-child(3) { width: 33%; }

@media screen and (max-width: 767px) { .cmn-subheader-menu-list-item, .cmn-subheader-menu-list-item:first-child, .cmn-subheader-menu-list-item:nth-child(3) { width: 100%; border-bottom: 1px solid #242f3e; } }

.cmn-subheader-menu-list-item:before { position: absolute; content: ""; top: 50%; left: 0; width: 1px; height: 14px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); background-color: #fff; }

@media screen and (max-width: 767px) { .cmn-subheader-menu-list-item:before { display: none; } }

.cmn-subheader-menu-list-item:last-child:after { position: absolute; content: ""; top: 50%; right: 0; width: 1px; height: 14px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); background-color: #fff; }

@media screen and (max-width: 767px) { .cmn-subheader-menu-list-item:last-child:after { display: none; } }

@media screen and (max-width: 767px) { .cmn-subheader-menu-list-item:last-child { border-bottom: 1px solid transparent; } }

.cmn-subheader-menu-list-link { display: block; width: 100%; text-align: center; text-decoration: none; font-size: 13px; letter-spacing: 0.28em; padding: 28px 0; }

.cmn-subheader-menu-list-link.is-current span { color: #1c99d9; }

@media screen and (min-width: 768px) { .cmn-subheader-menu-list-link:hover span { color: rgba(255, 255, 255, 0.2); } }

.cmn-subheader-menu-list-link span { color: #fff; -webkit-transition: color .2s linear; transition: color .2s linear; }

@media screen and (max-width: 767px) { .cmn-subheader-menu-list-link span { display: block; padding: 0 24px; } }

@media screen and (max-width: 767px) { .cmn-subheader-menu-list-link { display: inline-block; text-align: left; font-size: 15px; padding: 22px 0; } }

.cmn-page-top { background-color: #041931; }

.cmn-page-top-inner { display: block; width: 100%; text-align: center; margin: 0 auto; padding: 0; }

.cmn-page-top-btn { width: 100%; min-height: 70px; outline: none; }

.cmn-page-top-btn span { display: block; position: relative; font-family: "Noto Serif JP", serif; font-size: 10px; margin: 0; padding: 39px 0 17px; cursor: pointer; text-align: center; text-transform: uppercase; color: #fff; }

.cmn-page-top-btn span:after { position: absolute; top: 50%; left: 50%; margin-top: -17px; margin-left: -12px; content: url(../../assets/images/arrow-up.png); }

.about .hero { padding: 130px 0; background-color: #030102; }

@media screen and (max-width: 767px) { .about .hero { padding: 65px 0; } }

.enjoy .hero-ttl, .about .hero-ttl { font-size: 42px; font-weight: 500; color: #fff; letter-spacing: 4.2px; text-align: center; }

@media screen and (max-width: 767px) { .enjoy .hero-ttl, .about .hero-ttl { font-size: 21px; letter-spacing: 2.1px; } }

.enjoy .hero-ttl span, .about .hero-ttl span { display: block; opacity: 0; -webkit-transform: translate(-10px, 10px); -ms-transform: translate(-10px, 10px); transform: translate(-10px, 10px); -webkit-transition: opacity .5s linear, -webkit-transform .6s linear; transition: opacity .5s linear, -webkit-transform .6s linear; transition: opacity .5s linear, transform .6s linear; transition: opacity .5s linear, transform .6s linear, -webkit-transform .6s linear; }

.enjoy.is-load .hero-ttl span, .about.is-load .hero-ttl span { opacity: 1; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); }

.clearfix { zoom: 1; }

.clearfix:before, .clearfix:after { content: " "; display: table; }

.clearfix:after { clear: both; }

.u-hidden-pc { display: none !important; }

@media screen and (max-width: 767px) { .u-hidden-pc { display: block !important; } }

.u-hidden-sp { display: block !important; }

@media screen and (max-width: 767px) { .u-hidden-sp { display: none !important; } }

.icon { display: inline-block; background-repeat: no-repeat; }

.icon.icon-web-navigation-line-craft-1-109681 { background-image: url("../images/icon.png"); background-position: 0px 0px; background-size: 1540px 1026px; width: 512px; height: 512px; }

.icon.icon-web-navigation-line-craft-2-109682 { background-image: url("../images/icon.png"); background-position: -514px 0px; background-size: 1540px 1026px; width: 512px; height: 512px; }

.icon.icon-web-navigation-line-craft-3-109688 { background-image: url("../images/icon.png"); background-position: 0px -514px; background-size: 1540px 1026px; width: 512px; height: 512px; }

.icon.icon-web-navigation-line-craft-4-109689 { background-image: url("../images/icon.png"); background-position: -514px -514px; background-size: 1540px 1026px; width: 512px; height: 512px; }

.icon.icon-web-navigation-line-craft-5-109690 { background-image: url("../images/icon.png"); background-position: -1028px 0px; background-size: 1540px 1026px; width: 512px; height: 512px; }

.top .l-section, .ad-gallery .l-section { display: block; width: 100%; }

.top .l-section-inner, .ad-gallery .l-section-inner { position: relative; text-align: center; color: #fff; }

.ad-gallery .l-section-about { position: relative;  padding-bottom: 70px; }

.ad-gallery .l-section-about:before { content: ""; position: absolute; bottom: 30px; right: 25px; width: 643px; height: 767px; background-image: url(../../assets/images/glass-bg.png); background-size: cover; background-position: top center; background-repeat: no-repeat; }

@media screen and (max-width: 767px) { .ad-gallery .l-section-about:before { bottom: -5px; right: -25px; width: 258px; height: 308px; } }

@media screen and (max-width: 767px) { .top .l-section-about .l-section-inner, .ad-gallery .l-section-about .l-section-inner { padding: 0; } }

.top .l-section-book, .ad-gallery .l-section-book { padding-top: 102px; padding-bottom: 70px; }

@media screen and (max-width: 767px) { .top .l-section-book, .ad-gallery .l-section-book { padding-top: 25px; } }

.top .l-section-chief, .ad-gallery .l-section-chief { position: relative; padding-top: 188px; padding-bottom: 76px; }

.top .l-section-chief:before, .ad-gallery .l-section-chief:before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-image: url(../../assets/images/chief-bg.jpg); background-size: 100% 90%; background-position: bottom center; background-repeat: no-repeat; }

@media screen and (max-width: 767px) { .top .l-section-chief:before, .ad-gallery .l-section-chief:before { background-image: url(../../assets/images/chief-bg-sp.jpg); background-size: cover; } }

@media screen and (max-width: 767px) { .top .l-section-chief, .ad-gallery .l-section-chief { padding-top: 90px; } }

.top .l-section-blend, .ad-gallery .l-section-blend { position: relative; padding-top: 79px; padding-bottom: 57px; }

.top .l-section-blend:before, .ad-gallery .l-section-blend:before { content: ""; position: absolute; background-image: url(../../assets/images/blend-bg.png); width: 919px; height: 919px; right: 0; bottom: -385px; background-size: cover; }

@media screen and (max-width: 767px) { .top .l-section-blend:before, .ad-gallery .l-section-blend:before { bottom: -119px; width: 459px; height: 459px; } }

@media screen and (max-width: 767px) { .top .l-section-blend, .ad-gallery .l-section-blend { padding-top: 25px; } }

.top .l-section-enjoy, .ad-gallery .l-section-enjoy { padding-top: 95px; padding-bottom: 80px; }

@media screen and (max-width: 767px) { .top .l-section-enjoy, .ad-gallery .l-section-enjoy { padding-top: 25px; padding-bottom: 22px; } }

.top .l-section-gallery-yt { padding-top: 5px; padding-bottom: 52px; }

@media screen and (max-width: 767px) { .top .l-section-gallery-yt { padding-bottom: 1px; } }

.top .l-section-gallery-yt:not(:last-child){ padding-top: 77px; padding-bottom: 65px; }

@media screen and (max-width: 767px) { .top .l-section-gallery-yt:not(:last-child) { padding-top: 16px; padding-bottom: 19px; } }

.ad-gallery .l-section-gallery-yt { padding-top: 77px; padding-bottom: 65px; }

@media screen and (max-width: 767px) { .ad-gallery .l-section-gallery-yt{ padding-top: 16px; padding-bottom: 19px; } }


@media screen and (max-width: 767px) { .top .l-section-gallery-yt:last-child, .ad-gallery .l-section-gallery-yt:last-child { padding-bottom: 25px; } }

.top .l-container, .about .l-container, .event-page .l-container, .enjoy .l-container, .ad-gallery .l-container, .synchro .l-container, .story .l-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

@media screen and (max-width: 767px) { .top .l-container, .about .l-container, .event-page .l-container, .enjoy .l-container, .ad-gallery .l-container, .synchro .l-container, .story .l-container { width: 100%; max-width: unset; padding: 0 10px; } }

@media screen and (max-width: 767px) { .top .l-container-subheader, .about .l-container-subheader, .event-page .l-container-subheader, .enjoy .l-container-subheader, .ad-gallery .l-container-subheader, .synchro .l-container-subheader, .story .l-container-subheader { padding: 0; } }



.top .l-section-story {
  padding: 100px 0 30px;
}

@media screen and (max-width: 767px) {
  .top .l-section-story {
    padding: 50px 0 20px;
  }
}
.top .top-story .top-story-head {
  margin-bottom: 120px;
}
@media screen and (max-width: 767px) {
  .top .top-story .top-story-head {
    margin-bottom: 50px;
  }
}
.top .top-story .top-story-head-txt {
  font-size: 46px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.06em;
}
@media screen and (max-width: 767px) {
  .top .top-story .top-story-head-txt {
    font-size: 23px;
  }
}
.top .story-lead {
  font-size: 16px;
}
@media screen and (max-width: 767px) {
  .top .story-lead {
    font-size: 12px;
  }
}
.top .readmore {
  margin-top: 20px;
}
.top .other-stories-list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.top .other-stories-content {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.about { font-family: "Noto Serif JP", serif; }

.about #suntory_contents { z-index: 10; position: relative; }

.about .wrapper { position: relative; z-index: 1; }

.about .content { background: url(../images/about/bg.png) no-repeat 0 0; background-size: cover; }

.about .catch { padding-top: 80px; }

@media screen and (max-width: 767px) { .about .catch { padding-top: 24px; } }

.about .catch .catch-main { line-height: 1.4; text-align: center; font-size: 42px; color: #fff; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; letter-spacing: 0.12em; }

@media screen and (max-width: 767px) { .about .catch .catch-main { line-height: 1.3; font-size: 24px; } }

.about .catch .catch-main.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .catch .catch-read { margin-top: 60px; text-align: center; font-size: 18px; color: #fff; line-height: 2; letter-spacing: 0.18em; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .catch .catch-read { margin-top: 23px; font-size: 12px; line-height: 1.8; } }

.about .catch .catch-read.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .hero { background-image: url(../images/about/hero-bg.png); background-repeat: no-repeat; background-position: center center; background-size: cover; }

@media screen and (max-width: 767px) { .about .hero { background-image: url(../images/about/hero-bg-sp.png); } }

.about .sec1 { margin: 123px 11.33333vw 0; }

@media screen and (max-width: 767px) { .about .sec1 { margin: 41px 10px 0; }
  .units-polyfill .about .sec1 { margin: 41px 10px 0; } }

.about .sec1-contents { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }

@media screen and (max-width: 767px) { .about .sec1-contents { display: block; } }

.about .sec1-image { width: calc((100% - 40px) / 2); opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .sec1-image { width: 100%; padding-top: 68%; position: relative; } }

.about .sec1-image.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .sec1-image img { width: 100%; }

@media screen and (max-width: 767px) { .about .sec1-image img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; font-family: "object-fit: cover; object-position: center center"; } }

.about .sec1-description { width: calc((100% - 58px) / 2); margin-top: -17px; }

@media screen and (max-width: 767px) { .about .sec1-description { width: 100%; margin-top: 13px; } }

.about .sec1-ttl { font-size: 42px; color: #fff; letter-spacing: 0.1em; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .sec1-ttl { line-height: 1.3; font-size: 24px; text-align: center; } }

.about .sec1-ttl.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .sec1-read { font-size: 16px; margin-top: 28px; line-height: 2; letter-spacing: 0.2em; color: #fff; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 768px) { .about .sec1-read { margin-top: 20px; line-height: 1.8; font-size: 12px; } }

.about .sec1-read.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .sec1-btn-group { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

@media screen and (max-width: 960px) { .about .sec1-btn-group { display: block; } }

.about .sec1-btn { margin-top: 45px; padding: 0 20px; width: 320px; text-align: center; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .sec1-btn { width: 100%; height: 46px; } }

@media screen and (max-width: 767px) { .about .sec1-btn ~ .sec1-btn { margin-top: 17px; } }

.about .sec1-btn.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .sec1-btn.sec1-btn--large { width: 520px; }

@media screen and (max-width: 767px) { .about .sec1-btn.sec1-btn--large { line-height: inherit; width: 100%; height: 60px; } }

@media screen and (max-width: 767px) { .about .sec1-btn.sec1-btn--large .btn { padding: 7px 10px 0 0; } }

@media screen and (max-width: 767px) { .about .sec1-btn.sec1-btn--large .btn .btn-text { font-size: 12px; line-height: inherit; } }

@media screen and (max-width: 960px) { .about .sec1-btn { margin-left: auto; margin-right: auto; } }

@media screen and (max-width: 767px) { .about .sec1-btn { margin-top: 25px; padding: 0; } }

.about .sec1-btn .btn { width: 100%; letter-spacing: 0.02em; }

@media screen and (max-width: 767px) { .about .sec1-btn .btn { height: 100%; } }

@media screen and (max-width: 767px) { .about .sec1-btn .btn .btn-text { font-size: 16px; } }

@media screen and (max-width: 767px) { .about .sec1-btn-newline-text { font-size: 18px; } }

.about .main-block { margin: 160px 11.33333vw 0; background-image: url(../images/about/main-block-bg.png); background-position: center top; background-repeat: repeat; }

@media screen and (max-width: 767px) { .about .main-block { margin: 54px 10px 0; }
  .units-polyfill .about .main-block { margin: 54px 10px 0; } }

.about .main-block .main-block-inner { margin: 0 6.66667vw; padding: 71px 0 94px; letter-spacing: 0.3em; }

@media screen and (max-width: 767px) { .about .main-block .main-block-inner { margin: 0 10px; padding: 25px 0 60px; line-height: 1.3; }
  .units-polyfill .about .main-block .main-block-inner { margin: 0 10px; } }

.about .main-block .main-block-ttl { text-align: center; font-size: 42px; color: #000; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .main-block .main-block-ttl { font-size: 24px; letter-spacing: 0.1em; } }

.about .main-block .main-block-ttl.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .main-block .main-block-read { padding-top: 58.5%; font-size: 16px; letter-spacing: 0.15em; line-height: 2; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .main-block .main-block-read { padding-top: 50%; font-size: 12px; letter-spacing: 0.09em; line-height: 1.8; } }

.about .main-block .main-block-read.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .main-block .main-block-btn-group { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

@media screen and (max-width: 767px) { .about .main-block .main-block-btn-group { display: block; } }

.about .main-block .main-block-btn { margin-top: 20px; padding: 0 20px; text-align: center; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

.about .main-block .main-block-btn.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

@media screen and (max-width: 767px) { .about .main-block .main-block-distillery { padding-top: 20px; } }

.about .main-block .main-block-distillery-ttl { margin: 0 -40px; text-align: center; font-size: 38px; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .main-block .main-block-distillery-ttl { margin: 0; font-size: 24px; letter-spacing: 0.1em; line-height: 1.3; } }

.about .main-block .main-block-distillery-ttl.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .main-block .main-block-distillery-btn { margin-top: 60px; text-align: center; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

.about .main-block .main-block-distillery-btn.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

@media screen and (max-width: 767px) { .about .main-block .main-block-distillery-btn { margin-top: 32px; } }

.about .distillery-sec { margin-top: 30px; }

@media screen and (max-width: 767px) { .about .distillery-sec { margin-top: 15px; } }

.about .distillery-sec ~ .distillery-sec { margin-top: 106px; }

@media screen and (max-width: 767px) { .about .distillery-sec ~ .distillery-sec { margin-top: 52px; } }

.about .distillery-sec-name { padding-bottom: 13px; background: url(../images/about/distillery-sec-name-line.png) repeat-x bottom center; background-size: 100% auto; letter-spacing: 0.5em; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

.about .distillery-sec-name.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .distillery-sec-name .distillery-sec-name-en { display: block; text-align: center; font-size: 36px; font-weight: normal; font-family: "Times New Roman"; letter-spacing: 0.25em; }

@media screen and (max-width: 767px) { .about .distillery-sec-name .distillery-sec-name-en { font-size: 27px; } }

.about .distillery-sec-name .distillery-sec-name-jp { display: block; margin-top: -11px; text-align: center; font-size: 14px; letter-spacing: 0.08em; }

@media screen and (max-width: 767px) { .about .distillery-sec-name .distillery-sec-name-jp { margin-top: -4px; font-size: 10px; } }

.about .distillery-sec-contents { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 37px; }

@media screen and (max-width: 767px) { .about .distillery-sec-contents { display: block; margin-top: 20px; } }

.about .distillery-sec-contents.distillery-sec-contents--reverse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }

.about .distillery-sec-contents ~ .distillery-sec-contents { margin-top: 17px; }

.about .distillery-sec-image { width: calc((100% - 30px) / 2); opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .distillery-sec-image { width: 100%; } }

.about .distillery-sec-image.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .distillery-sec-image img { width: 100%; }

.about .distillery-sec-description { margin-top: -22px; width: calc((100% - 30px) / 2); }

@media screen and (max-width: 767px) { .about .distillery-sec-description { margin-top: 0; width: 100%; } }

.about .distillery-sec-ttl { margin-top: 20px; letter-spacing: 0.1em; font-size: 20px; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .distillery-sec-ttl { margin-top: 7px; font-size: 15px; } }

.about .distillery-sec-ttl.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .distillery-sec-read { margin-top: 11px; font-size: 16px; line-height: 2; letter-spacing: 0.2em; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .distillery-sec-read { margin-top: 4px; font-size: 12px; line-height: 1.8; } }

.about .distillery-sec-read.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .distillery-sec-btn { margin-top: 36px; text-align: center; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .distillery-sec-btn { margin-top: 36px; } }

.about .distillery-sec-btn.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .distillery-sec-btn .btn { letter-spacing: 0.05em; }

.about .introduction { margin: 90px 21vw 0; }

@media screen and (max-width: 767px) { .about .introduction { margin: 60px 10px 0; }
  .units-polyfill .about .introduction { margin: 60px 10px 0; } }

.about .introduction-ttl { font-size: 42px; letter-spacing: 0.1em; color: #fff; text-align: center; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .introduction-ttl { font-size: 24px; line-height: 1.3; } }

.about .introduction-ttl.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .introduction-image { margin-top: 35px; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

.about .introduction-image.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

@media screen and (max-width: 767px) { .about .introduction-image { margin-top: 23px; } }

.about .introduction-image img { width: 100%; }

.about .introduction-read { margin-top: 13px; line-height: 2; letter-spacing: 0.16em; font-size: 16px; color: #fff; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

.about .introduction-read.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

@media screen and (max-width: 767px) { .about .introduction-read { font-size: 12px; letter-spacing: 0.08em; line-height: 1.8; } }

.about .feature { margin: 84px 0 0; }

@media screen and (max-width: 960px) { .about .feature { margin: 50px 21vw 0; }
  .units-polyfill .about .feature { margin: 50px 21vw 0; } }

@media screen and (max-width: 767px) { .about .feature { margin: 50px 10px 0; }
  .units-polyfill .about .feature { margin: 50px 10px 0; } }

.about .feature-contents { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

@media screen and (max-width: 960px) { .about .feature-contents { display: block; } }

.about .feature-contents.feature-contents--glass { padding-left: 32.66667vw; }

@media screen and (max-width: 960px) { .about .feature-contents.feature-contents--glass { padding-left: 0; }
  .units-polyfill .about .feature-contents.feature-contents--glass { padding-left: 0; } }

.about .feature-contents.feature-contents--bottle { margin-top: 115px; padding-right: 2.66667vw; }

@media screen and (max-width: 960px) { .about .feature-contents.feature-contents--bottle { margin-top: 2.60417vw; padding-right: 0; }
  .units-polyfill .about .feature-contents.feature-contents--bottle { margin-top: 2.60417vw; } }

.about .feature-contents.feature-contents--reverse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }

.about .feature-description { color: #fff; }

.about .feature-description.feature-description--glass { width: 38.8vw; }

@media screen and (max-width: 960px) { .about .feature-description.feature-description--glass { width: 100%; }
  .units-polyfill .about .feature-description.feature-description--glass { width: 100%; } }

.about .feature-description.feature-description--bottle { width: 43.86667vw; }

@media screen and (max-width: 960px) { .about .feature-description.feature-description--bottle { width: 100%; }
  .units-polyfill .about .feature-description.feature-description--bottle { width: 100%; } }

.about .feature-ttl { font-size: 42px; line-height: 1.4; letter-spacing: 0.1em; color: #fff; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 1279px) { .about .feature-ttl { font-size: 30px; } }

@media screen and (max-width: 960px) { .about .feature-ttl { font-size: 24px; text-align: center; } }

@media screen and (max-width: 767px) { .about .feature-ttl { line-height: 1.3; letter-spacing: 0.1em; } }

.about .feature-ttl.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .feature-read { margin-top: 17px; line-height: 2; letter-spacing: 0.12em; font-size: 16px; color: #fff; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 1279px) { .about .feature-read { font-size: 14px; } }

@media screen and (max-width: 960px) { .about .feature-read { margin-top: 20px; font-size: 12px; } }

@media screen and (max-width: 767px) { .about .feature-read { margin-top: 18px; line-height: 1.8; letter-spacing: 0.1em; } }

.about .feature-read.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .feature-image { opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

.about .feature-image.feature-image--glass { width: 21.46667vw; }

@media screen and (max-width: 960px) { .about .feature-image.feature-image--glass { margin-top: -3.125vw; padding: 0 14.58333vw; width: 100%; } }

@media screen and (max-width: 767px) { .about .feature-image.feature-image--glass { margin-top: -0.26667vw; padding: 0 21.33333vw; width: 100%; } }

.about .feature-image.feature-image--bottle { width: 43.33333vw; margin-top: -27.33333vw; }

@media screen and (max-width: 960px) { .about .feature-image.feature-image--bottle { margin-top: 0.83333vw; padding: 0 4vw; width: 100%; } }

@media screen and (max-width: 767px) { .about .feature-image.feature-image--bottle { margin-top: 2.13333vw; padding: 0 4vw; width: 100%; } }

.about .feature-image.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.about .feature-image-inner.feature-image-inner--glass { position: relative; padding-top: 119.2546583850932%; }

@media screen and (max-width: 960px) { .about .feature-image-inner.feature-image-inner--glass { padding-top: 119.2546583850932%; } }

.about .feature-image-inner.feature-image-inner--glass img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; font-family: "object-fit: contain; object-position: center bottom"; }

.about .feature-image-inner.feature-image-inner--bottle { position: relative; right: 30px; padding-top: 140.3983739837398%; }

@media screen and (max-width: 960px) { .about .feature-image-inner.feature-image-inner--bottle { right: 0; padding-top: 100.8766233766234%; } }

@media screen and (max-width: 767px) { .about .feature-image-inner.feature-image-inner--bottle { right: 0; width: 100%; height: 46px; } }

.about .feature-image-inner.feature-image-inner--bottle img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; font-family: "object-fit: cover; object-position: center top"; }

.about .feature-btn { position: relative; z-index: 1; margin-top: 45px; width: 320px; text-align: center; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .about .feature-btn { width: 100%; height: 46px; } }

.about .feature-btn.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

@media screen and (max-width: 960px) { .about .feature-btn { margin-left: auto; margin-right: auto; } }

@media screen and (max-width: 767px) { .about .feature-btn { margin-top: 25px; padding: 0; } }

.about .feature-btn .btn { width: 100%; letter-spacing: 0.02em; }

@media screen and (max-width: 767px) { .about .feature-btn .btn { height: 100%; } }

@media screen and (max-width: 767px) { .about .feature-btn .btn .btn-text { font-size: 16px; } }

.footer-block { position: relative; background-color: #000; }

.footer-block-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: center; margin: 0 11.33333vw; padding: 96px 0 72px; }

.footer-block-inner ~ .footer-block-inner{
  padding-top: 0;
}

@media screen and (max-width: 767px) { .footer-block-inner { display: block; margin: 0 10px; padding: 10.66667vw 0 44px; }
  .units-polyfill .footer-block-inner { padding: 10.66667vw 0 44px; } }

.footer-block-detail { display: -webkit-box; display: -ms-flexbox; display: flex; width: 620px; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .footer-block-detail { display: block; width: 100%; } }

.footer-block-detail.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.footer-block-image { width: 220px; margin-top: -18px; position: relative; }

@media screen and (max-width: 767px) { .footer-block-image { width: auto; margin: 0 92px; } }

.footer-block-image .new-badge { position: absolute; top: 20px; left: -34px; }

@media screen and (max-width: 767px) { .footer-block-image .new-badge { top: 10px; left: -34px; width: 50px; } }

.footer-block-image .new-badge img { max-width: 100%; height: auto; }

.footer-block-image-inner img { width: 100%; }

.footer-block-status { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding-left: 30px; }

@media screen and (max-width: 767px) { .footer-block-status { margin-top: 6.13333vw; padding-left: 0; }
  .units-polyfill .footer-block-status { margin-top: 6.13333vw; } }

.footer-block-status-ttl { letter-spacing: 0.2em; padding-bottom: 10px; color: #fff; font-size: 26px; background: url(../images/about/footer-block-status-ttl-line.png) repeat-x bottom center; background-size: 100% auto; }

@media screen and (max-width: 767px) { .footer-block-status-ttl { padding-bottom: 6px; font-size: 18px; background-size: auto 1px; } }

.footer-block-status-list { margin-top: 20px; }

@media screen and (max-width: 767px) { .footer-block-status-list { margin-top: 8px; } }

.footer-block-status-list dt { width: 61px; line-height: 1.7; letter-spacing: 0.2em; color: #fff; font-size: 14px; }

@media screen and (max-width: 767px) { .footer-block-status-list dt { width: 50px; line-height: 2; letter-spacing: 0.09em; font-size: 12px; } }

.footer-block-status-list dd { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; line-height: 1.7; letter-spacing: 0.2em; color: #fff; padding-left: 1em; text-indent: -1em; font-size: 14px; }

@media screen and (max-width: 767px) { .footer-block-status-list dd { line-height: 2; letter-spacing: 0.09em; font-size: 12px; } }

.footer-block-status-group { display: -webkit-box; display: -ms-flexbox; display: flex; }

.footer-block-status-group ~ .footer-block-status-group { margin-top: 3px; }

.footer-block-ability { width: 400px; margin-left: 55px; }

@media screen and (max-width: 767px) { .footer-block-ability { width: 100%; margin-top: 22px; margin-left: 0; } }

.footer-block-ability-ttl { color: #fff; letter-spacing: 0.02em; font-size: 26px; }

.footer-block-ability-ttl .small{
  font-size: 22px;
}
@media screen and (max-width: 767px) {
  .footer-block-ability-ttl {
    font-size: 17px;
    text-align: left;
  }
  .footer-block-ability-ttl .small{
    font-size: 14px;
  }
}

.footer-block-ability-list { margin-top: 10px; line-height: 1.7; letter-spacing: 0.1em; color: #fff; font-size: 20px; }

@media screen and (max-width: 767px) { .footer-block-ability-list { margin-top: 10px; font-size: 12px; } }

.footer-block-ability-btn { margin-top: 10px; }

.footer-block-ability-btn img { width: 100%; height: 100%; }

  .footer-block-ability-btn iframe.fixed { top: 100px !important; }

.about .btn { display: inline-block; padding: 17px 12px 0 0; width: 250px; height: 62px; font-weight: bold; letter-spacing: 0.15em; text-align: center; background-repeat: no-repeat; background-position: 0 0; background-size: 100% 100%; -webkit-transition: opacity .2s linear; transition: opacity .2s linear; }

@media screen and (max-width: 767px) { .about .btn { padding: 12px 10px 0 0; height: 45px; } }

.about .btn.btn-white { background-image: url(../images/story/btn-white.png); }

.about .btn.btn-white.btn-white--large { width: 36vw; background-image: url(../images/about/btn-white-large.png); }

@media screen and (max-width: 767px) { .about .btn.btn-white.btn-white--large { width: 100%; }
  .units-polyfill .about .btn.btn-white.btn-white--large { width: 100%; } }

.about .btn.btn-white .btn-text { color: #fff; }

.about .btn.btn-white .btn-text::after { background-image: url(../images/story/ico-arrow-right-white.png); }

.about .btn.btn-black { background-image: url(../images/about/btn-black.png); }

.about .btn.btn-black .btn-text { color: #000; }

.about .btn.btn-black .btn-text::after { background-image: url(../images/about/ico-arrow-right-black.png); }

.about .btn .btn-text { display: inline-block; position: relative; font-size: 18px; }

@media screen and (max-width: 767px) { .about .btn .btn-text { line-height: 1; } }

.about .btn .btn-text::after { position: absolute; top: calc(50% - -1px); right: -17px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 8px; height: 16px; background-size: 100%; background-repeat: no-repeat; background-position: 0 0; content: ''; }

@media screen and (max-width: 767px) { .about .btn .btn-text::after { top: calc(50% - -2px); right: -15px; } }

@media screen and (min-width: 768px) { .desktop .about .btn:hover { opacity: 0.5; } }

.about .modal { visibility: hidden; position: fixed; top: 0; left: 0; right: 0; bottom: 0; -webkit-transform: translate3d(0, 0, 1px); transform: translate3d(0, 0, 1px); -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 9999; overflow-x: hidden; overflow-y: auto; opacity: 0; background-color: rgba(34, 73, 107, 0.8); pointer-events: none; -webkit-overflow-scrolling: touch; -webkit-transition: opacity .3s ease-out, visibility .3s ease-out; transition: opacity .3s ease-out, visibility .3s ease-out; }

.about .modal.is-modal-active { visibility: visible; pointer-events: auto; opacity: 1; }

.about .modal ul { list-style: none; }

.about .modal-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 100px 0; text-align: center; min-height: 100%; }

.about .modal-footer-close { margin-top: 60px; position: relative; color: #fff; font-size: 18px; text-align: center; }

.about .modal-footer-close-text { position: relative; padding-left: 30px; -webkit-transition: opacity .2s linear; transition: opacity .2s linear; }

@media screen and (min-width: 768px) { .desktop .about .modal-footer-close-text:hover { opacity: 0.5; } }

.about .modal-footer-close-icon { display: block; position: absolute; z-index: 1; top: 0; left: 0; width: 30px; height: 30px; }

.about .modal-footer-close-icon:before, .about .modal-footer-close-icon:after { content: ''; display: block; position: absolute; top: 50%; left: 50%; width: 22px; height: 1px; background-color: #fff; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; }

.about .modal-footer-close-icon:before { -webkit-transform: translate(-50%, -50%) rotate(45deg); -ms-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); }

.about .modal-footer-close-icon:after { -webkit-transform: translate(-50%, -50%) rotate(-45deg); -ms-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); }

.about .modal-close-wrap { position: relative; }

.about .modal-close { display: block; position: absolute; z-index: 1; top: 60px; right: 0; width: 30px; height: 30px; }

@media screen and (max-width: 960px) { .about .modal-close { top: -35px; } }

@media screen and (max-width: 767px) { .about .modal-close { top: -35px; } }

.about .modal-close:before, .about .modal-close:after { content: ''; display: block; position: absolute; top: 50%; left: 50%; width: 30px; height: 1px; background-color: #fff; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; }

.about .modal-close:before { -webkit-transform: translate(-50%, -50%) rotate(45deg); -ms-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); }

.about .modal-close:after { -webkit-transform: translate(-50%, -50%) rotate(-45deg); -ms-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); }

.about .modal-slick { padding: 100px 0; min-height: 100%; width: 58.66667vw; }

@media screen and (max-width: 960px) { .about .modal-slick { width: calc(100vw - 40px); padding: 5px; background-image: none; }
  .units-polyfill .about .modal-slick { width: calc(100vw - 40px); } }

.about .modal-slick .slick-dots { position: absolute; bottom: 50px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }

.about .modal-slick .slick-dots li { height: 10px; width: 10px; margin: 3px; }

.about .modal-slick .slick-dots li button:before { font-size: 34px; color: #aea46f; }

.about .modal-slick .slick-arrow { opacity: 1; -webkit-transition: opacity 0.35s ease-in-out 0s; transition: opacity 0.35s ease-in-out 0s; }

.about .modal-slick .slick-arrow.slick-disabled { opacity: 0; display: none !important; }

.about .modal-slick .slick-prev, .about .modal-slick .slick-next { display: block; cursor: pointer; position: absolute; top: calc(50% - 32px); -webkit-transform: scale(0.5) translateY(-50%); -ms-transform: scale(0.5) translateY(-50%); transform: scale(0.5) translateY(-50%); z-index: 2; width: 80px; height: 128px; outline: none; }

@media screen and (max-width: 960px) { .about .modal-slick .slick-prev, .about .modal-slick .slick-next { -webkit-transform: scale(0.25) translateY(-100%); -ms-transform: scale(0.25) translateY(-100%); transform: scale(0.25) translateY(-100%); } }

@media screen and (max-width: 767px) { .about .modal-slick .slick-prev, .about .modal-slick .slick-next { -webkit-transform: scale(0.25) translateY(-50%); -ms-transform: scale(0.25) translateY(-50%); transform: scale(0.25) translateY(-50%); } }

.about .modal-slick .slick-prev:before, .about .modal-slick .slick-next:before { display: none; }

.about .modal-slick .slick-prev img, .about .modal-slick .slick-next img { max-width: 100%; }

.about .modal-slick .slick-prev { left: -70px; }

@media screen and (max-width: 960px) { .about .modal-slick .slick-prev { left: -46px; } }

.about .modal-slick .slick-next { right: -70px; }

@media screen and (max-width: 960px) { .about .modal-slick .slick-next { right: -46px; } }

.about .modal-slick-cont { position: relative; width: 58.66667vw; padding: 10px; overflow: hidden; background-color: #000; background-image: url(../images/enjoy/bg-logo.png); background-repeat: no-repeat; background-position: 120% center; background-size: 39.6vw auto; color: #fff; }

@media screen and (max-width: 960px) { .about .modal-slick-cont { width: calc(100% - 40px); padding: 5px; background-image: none; }
  .units-polyfill .about .modal-slick-cont { width: calc(100% - 40px); } }

.about .modal-slick-item { position: relative; }

.about .modal-slick-item:before, .about .modal-slick-item:after { content: ''; display: block; position: absolute; top: 0; z-index: 1; width: 1px; height: 100%; background: url(../images/enjoy/line-repeat-thick-white-v.png) repeat-y 0 0; }

.about .modal-slick-item:before { left: 0; }

.about .modal-slick-item:after { right: 0; }

.about .modal-slick-item-inner.modal-slick-item-inner--horizontal { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; }

@media screen and (max-width: 960px) { .about .modal-slick-item-inner.modal-slick-item-inner--horizontal { display: block; } }

.about .modal-slick-item-inner:before, .about .modal-slick-item-inner:after { content: ''; display: block; position: absolute; left: 0; z-index: 1; width: 100%; height: 1px; background: url(../images/enjoy/line-repeat-thick-white-h.png) repeat-x 0 0; }

.about .modal-slick-item-inner:before { top: 0; }

.about .modal-slick-item-inner:after { bottom: 0; }

.about .modal-slick-item-img { position: relative; overflow: hidden; }

.about .modal-slick-item-img img { position: relative; width: 100%; height: auto; }

.about .modal-slick-item-img.modal-slick-item-img--1 { height: 34vw; width: 58.66667vw; top: -10px; left: -10px; }

@media screen and (max-width: 960px) { .about .modal-slick-item-img.modal-slick-item-img--1 { top: -5px; left: -5px; height: auto; width: calc(100% + 10px); margin: -5px -5px 0 -5px; }
  .units-polyfill .about .modal-slick-item-img.modal-slick-item-img--1 { height: auto; width: calc(100% + 10px); } }

.about .modal-slick-item-img.modal-slick-item-img--2 { height: 34vw; width: 58.66667vw; top: -10px; left: -10px; }

@media screen and (max-width: 960px) { .about .modal-slick-item-img.modal-slick-item-img--2 { top: -5px; left: -5px; height: auto; width: calc(100% + 10px); }
  .units-polyfill .about .modal-slick-item-img.modal-slick-item-img--2 { height: auto; width: calc(100% + 10px); } }

.about .modal-slick-item-img.modal-slick-item-img--3 { height: 38.66667vw; width: 58.66667vw; top: -10px; left: -10px; }

@media screen and (max-width: 960px) { .about .modal-slick-item-img.modal-slick-item-img--3 { top: -5px; left: -5px; height: auto; width: calc(100% + 10px); }
  .units-polyfill .about .modal-slick-item-img.modal-slick-item-img--3 { height: auto; width: calc(100% + 10px); } }

.about .modal-slick-item-img.modal-slick-item-img--4 { height: 23.33333vw; width: 30vw; margin: -12px 0 -8px -12px; padding: 12px; }

@media screen and (max-width: 960px) { .about .modal-slick-item-img.modal-slick-item-img--4 { top: -5px; left: -5px; margin: auto; padding: 0; height: auto; width: calc(100% + 10px); }
  .units-polyfill .about .modal-slick-item-img.modal-slick-item-img--4 { height: auto; width: calc(100% + 10px); } }

.about .modal-slick-item-cont { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 33px 30px; }

@media screen and (max-width: 960px) { .about .modal-slick-item-cont { padding: 0 6.45833vw 0 2.8125vw; }
  .units-polyfill .about .modal-slick-item-cont { padding: 0 6.45833vw 0 2.8125vw; } }

@media screen and (max-width: 767px) { .about .modal-slick-item-cont { width: 100%; padding: 20px 15px 25px; } }

.about .modal-slick-item-cont.modal-slick-item-cont--horizontal { padding: 20px 27px; }

.about .modal-slick-item-cont.modal-slick-item-cont--horizontal .modal-slick-item-read { margin-top: 14px; letter-spacing: 0.05em; }

.about .modal-slick-item-ttl { font-size: 24px; font-weight: bold; letter-spacing: 0.1em; }

@media screen and (max-width: 1279px) { .about .modal-slick-item-ttl { font-size: 22px; } }

@media screen and (max-width: 960px) { .about .modal-slick-item-ttl { font-size: 24px; } }

@media screen and (max-width: 767px) { .about .modal-slick-item-ttl { text-align: center; } }

.about .modal-slick-item-read { margin-top: 28px; font-size: 16px; letter-spacing: 0.15em; line-height: 2; text-align: left; }

@media screen and (max-width: 1279px) { .about .modal-slick-item-read { font-size: 14px; } }

@media screen and (max-width: 767px) { .about .modal-slick-item-read { margin-bottom: 15px; font-size: 12px; line-height: 1.8; letter-spacing: 0.1em; } }

.about .modal-slick-item-btn { margin-top: 28px; text-align: center; }

@media screen and (max-width: 767px) { .about .modal-slick-item-btn { text-align: center; } }

.about .modal-slick-item-btn .btn { width: 16.66667vw; }

@media screen and (max-width: 960px) { .about .modal-slick-item-btn .btn { width: 250px; }
  .units-polyfill .about .modal-slick-item-btn .btn { width: 250px; } }

@media screen and (max-width: 767px) { .about .modal-slick-item-btn .btn { width: 250px; }
  .units-polyfill .about .modal-slick-item-btn .btn { width: 250px; } }

@media screen and (max-width: 374px) { .about .modal-slick-item-btn .btn { width: 66.84492vw; }
  .units-polyfill .about .modal-slick-item-btn .btn { width: 66.84492vw; } }


.badge-about-link {
  font-family: "Noto Serif JP", serif;
  color: #fff;
  text-decoration: none;
}

.badge-about-img {
  width: 218px;
  max-width: 100%;
}

.badge-about-img img { max-width: 100%; }

.badge-leave { position: relative; top: -150px; }
@media screen and (max-width: 767px){
  .badge-leave { top: -80px; }
}
.enjoy .container { font-family: "Noto Serif JP", serif; }

.enjoy .content { position: relative; overflow: hidden; padding: 0 0 110px; background-image: url(../images/enjoy/bg-repeat.png); background-size: 30px; background-color: #1D385D; }

@media screen and (max-width: 767px) { .enjoy .content { padding: 0 0 45px; } }

.enjoy .content:before { content: ''; display: block; position: absolute; top: 33%; right: -60px; width: 61.26667vw; height: 61.26667vw; background: url(../images/enjoy/bg-logo.png) no-repeat 0 0; background-size: cover; }

@media screen and (max-width: 767px) { .enjoy .content:before { display: none; } }

.enjoy .content-inner { position: relative; z-index: 1; }

.enjoy .hero img { width: 100%; height: auto; }

@media screen and (max-width: 767px) { .enjoy .hero { background-size: auto 55%; } }

.enjoy .modal { visibility: hidden; position: fixed; top: 0; left: 0; right: 0; bottom: 0; -webkit-transform: translate3d(0, 0, 1px); transform: translate3d(0, 0, 1px); -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 9999; overflow-x: hidden; overflow-y: auto; opacity: 0; background-color: rgba(34, 73, 107, 0.8); pointer-events: none; -webkit-overflow-scrolling: touch; -webkit-transition: opacity .3s ease-out, visibility .3s ease-out; transition: opacity .3s ease-out, visibility .3s ease-out; }

.enjoy .modal.is-modal-active { visibility: visible; pointer-events: auto; opacity: 1; }

.enjoy .modal ul { list-style: none; }

.enjoy .modal-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 100px 0; min-height: 100%; }

.enjoy .modal-cont { position: relative; width: 58.66667vw; padding: 10px; background-color: #000; background-image: url(../images/enjoy/bg-logo.png); background-repeat: no-repeat; background-position: 120% center; background-size: 39.6vw auto; color: #fff; }

@media screen and (max-width: 960px) { .enjoy .modal-cont { width: calc(100% - 40px); padding: 5px; background-image: none; }
  .units-polyfill .enjoy .modal-cont { width: calc(100% - 40px); } }

.enjoy .modal-footer-close { margin-top: 60px; position: relative; color: #fff; font-size: 18px; text-align: center; }

.enjoy .modal-footer-close-text { position: relative; padding-left: 30px; -webkit-transition: opacity .2s linear; transition: opacity .2s linear; }

@media screen and (min-width: 768px) { .desktop .enjoy .modal-footer-close-text:hover { opacity: 0.5; } }

.enjoy .modal-footer-close-icon { display: block; position: absolute; z-index: 1; top: 0; left: 0; width: 30px; height: 30px; }

.enjoy .modal-footer-close-icon:before, .enjoy .modal-footer-close-icon:after { content: ''; display: block; position: absolute; top: 50%; left: 50%; width: 22px; height: 1px; background-color: #fff; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; }

.enjoy .modal-footer-close-icon:before { -webkit-transform: translate(-50%, -50%) rotate(45deg); -ms-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); }

.enjoy .modal-footer-close-icon:after { -webkit-transform: translate(-50%, -50%) rotate(-45deg); -ms-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); }

.enjoy .modal-close { display: block; position: absolute; top: -50px; right: 0; width: 30px; height: 30px; }

@media screen and (max-width: 767px) { .enjoy .modal-close { top: -35px; } }

.enjoy .modal-close:before, .enjoy .modal-close:after { content: ''; display: block; position: absolute; top: 50%; left: 50%; width: 30px; height: 1px; background-color: #fff; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; }

.enjoy .modal-close:before { -webkit-transform: translate(-50%, -50%) rotate(45deg); -ms-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); }

.enjoy .modal-close:after { -webkit-transform: translate(-50%, -50%) rotate(-45deg); -ms-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); }

.enjoy .modal-item { position: relative; }

.enjoy .modal-item:before, .enjoy .modal-item:after { content: ''; display: block; position: absolute; top: 0; width: 1px; height: 100%; background: url(../images/enjoy/line-repeat-thick-white-v.png) repeat-y 0 0; }

.enjoy .modal-item:before { left: 0; }

.enjoy .modal-item:after { right: 0; }

.enjoy .modal-item-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; }

@media screen and (max-width: 767px) { .enjoy .modal-item-inner { display: block; } }

.enjoy .modal-item-inner:before, .enjoy .modal-item-inner:after { content: ''; display: block; position: absolute; left: 0; width: 100%; height: 1px; background: url(../images/enjoy/line-repeat-thick-white-h.png) repeat-x 0 0; }

.enjoy .modal-item-inner:before { top: 0; }

.enjoy .modal-item-inner:after { bottom: 0; }

.enjoy .modal-item-img { position: relative; overflow: hidden; width: 42%; padding: 30px 4vw 0; }

@media screen and (max-width: 767px) { .enjoy .modal-item-img { overflow: visible; width: 100%; padding: 30px 26.66667vw 0; }
  .units-polyfill .enjoy .modal-item-img { padding: 30px 26.66667vw 0; } }

.enjoy .modal-item-img img { position: relative; width: 100%; height: auto; margin-bottom: -6.66667vw; }

.enjoy .modal-item-cont { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 30px 9vw 30px 0; }

@media screen and (max-width: 767px) { .enjoy .modal-item-cont { margin-top: -5.33333vw; padding: 10px 20px 30px; }
  .units-polyfill .enjoy .modal-item-cont { padding: 10px 20px 30px; } }

.enjoy .modal-item-ttl { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; margin-bottom: 20px; padding-bottom: 5px; }

@media screen and (max-width: 767px) { .enjoy .modal-item-ttl { display: block; margin-bottom: 20px; padding-bottom: 15px; text-align: center; } }

.enjoy .modal-item-ttl:after { content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background: url(../images/enjoy/line-repeat-thick-white-h.png) repeat 0 0; }

@media screen and (max-width: 767px) { .enjoy .modal-item-ttl:after { left: 50%; width: 30px; height: 1px; margin-left: -15px; } }

.enjoy .modal-item-label { margin-right: 8px; font-size: 16px; letter-spacing: 1.6px; }

@media screen and (max-width: 767px) { .enjoy .modal-item-label { display: block; margin-right: 0; font-size: 12px; letter-spacing: 1.2px; } }

.enjoy .modal-item-txt { font-size: 24px; font-weight: bold; letter-spacing: 2.4px; }

@media screen and (max-width: 767px) { .enjoy .modal-item-txt { display: block; font-size: 18px; letter-spacing: 1.8px; } }

.enjoy .modal-item-list { font-size: 16px; font-weight: 300; letter-spacing: 3.2px; line-height: 1.7; counter-reset: order; list-style: none; }

@media screen and (max-width: 767px) { .enjoy .modal-item-list { font-size: 12px; letter-spacing: 2.4px; } }

.enjoy .modal-item-list li { position: relative; padding-left: 25px; }

@media screen and (max-width: 767px) { .enjoy .modal-item-list li { padding-left: 20px; } }

.enjoy .modal-item-list li:before { counter-increment: order; content: counter(order) "."; position: absolute; top: 0; left: 0; }

.enjoy .modal-item-glass { margin-top: 60px; font-size: 16px; letter-spacing: 1.6px; }

@media screen and (max-width: 767px) { .enjoy .modal-item-glass { margin-top: 30px; font-size: 12px; letter-spacing: 1.2px; } }

.enjoy .modal-item-glass-label { display: block; margin-bottom: 5px; font-weight: bold; }

.enjoy .modal-item-glass-txt { display: block; }

.enjoy .nav { margin: 0 11.33333vw 120px; }

@media screen and (max-width: 767px) { .enjoy .nav { margin: 0 10px 30px; }
  .units-polyfill .enjoy .nav { margin: 0 10px 30px; } }

.enjoy .nav-list { display: -webkit-box; display: -ms-flexbox; display: flex; margin: 0 -1.33333vw; list-style: none; }

@media screen and (max-width: 960px) { .enjoy .nav-list { margin: 0; }
  .units-polyfill .enjoy .nav-list { margin: 0; } }

.enjoy .nav-list-item { display: -webkit-box; display: -ms-flexbox; display: flex; width: calc(100% / 3); padding: 0 1.33333vw; }

@media screen and (max-width: 1279px) { .enjoy .nav-list-item { padding: 0 0.66667vw; }
  .units-polyfill .enjoy .nav-list-item { padding: 0 0.66667vw; } }

@media screen and (max-width: 960px) { .enjoy .nav-list-item { width: calc(100% / 3); padding: 0; }
  .units-polyfill .enjoy .nav-list-item { padding: 0; } }

.enjoy .nav-list-item a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; width: 100%; height: 80px; background-color: white; color: #000; -webkit-transition: background-color .2s ease-out; transition: background-color .2s ease-out; }

@media screen and (max-width: 960px) { .enjoy .nav-list-item a { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: auto; padding: 10px 5px 30px; } }

@media screen and (max-width: 960px) { .enjoy .nav-list-item a:after { content: ''; display: block; position: absolute; top: 50%; right: 0; width: 1px; height: 80%; background: url(../images/enjoy/line-repeat-nav.png) repeat-y 0 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } }

@media screen and (min-width: 768px) { .desktop .enjoy .nav-list-item a:hover { background-color: rgba(255, 255, 255, 0.9); } }

@media screen and (max-width: 960px) { .enjoy .nav-list-item:last-of-type a:after { display: none; } }

.enjoy .nav-list-item-img { margin-right: 5px; }

@media screen and (max-width: 960px) { .enjoy .nav-list-item-img { margin: 0; } }

.enjoy .nav-list-item-img img { width: 50px; height: auto; }

.enjoy .nav-list-item-txt { position: relative; top: -0.2em; font-size: 18px; font-weight: bold; text-align: center; line-height: 1.33; letter-spacing: 1.8px; }

@media screen and (max-width: 1279px) { .enjoy .nav-list-item-txt { font-size: 16px; letter-spacing: 1px; } }

@media screen and (max-width: 960px) { .enjoy .nav-list-item-txt { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; font-size: 10px; letter-spacing: 1px; } }

.enjoy .nav-list-item-txt:after { content: ''; display: block; position: absolute; top: 100%; left: 50%; width: 16px; height: 8px; margin-top: 3px; margin-left: -8px; background: url(../images/enjoy/ico-arrow-bottom-black.png) no-repeat 0 0; background-size: contain; }

@media screen and (max-width: 960px) { .enjoy .nav-list-item-txt:after { margin-top: 10px; } }

.enjoy .sec { margin: 0 11.33333vw; }

@media screen and (max-width: 767px) { .enjoy .sec { margin: 0; }
  .units-polyfill .enjoy .sec { margin: 0; } }

.enjoy .sec + .sec { margin-top: 120px; }

.enjoy .main-ttl { text-align: center; color: #fff; margin-bottom: 30px; }

.enjoy .main-ttl-txt { font-size: 46px; font-weight: 400; }

@media screen and (max-width: 767px) { .enjoy .main-ttl-txt { font-size: 24px; } }

.enjoy .main-ttl-subtxt { font-size: 24px; margin-top: 5px; }

@media screen and (max-width: 767px) { .enjoy .main-ttl-subtxt { font-size: 12px; } }

@media screen and (max-width: 767px) { .enjoy .sec + .sec { margin-top: 75px; } }

.enjoy .sec-inner { margin-top: -100px; padding-top: 100px; }

@media screen and (max-width: 767px) { .enjoy .sec-inner { margin-top: -56px; padding-top: 56px; } }

.enjoy .sec-ttl { position: relative; margin-bottom: 40px; padding-bottom: 20px; text-align: center; }

@media screen and (max-width: 767px) { .enjoy .sec-ttl { margin: 0 10px 45px; } }

.enjoy .sec-ttl:after { content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color: #fff; }

.enjoy .sec-ttl span { display: inline-block; color: #fff; font-size: 36px; font-weight: 500; line-height: 1.43; letter-spacing: 4.2px; }

@media screen and (max-width: 767px) { .enjoy .sec-ttl span { font-size: 20px; line-height: 1.25; letter-spacing: 2.4px; } }

.enjoy .unit { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; margin-top: -4vw; color: #fff; text-align: center; }

@media screen and (max-width: 767px) { .enjoy .unit { display: block; margin: 0; }
  .units-polyfill .enjoy .unit { margin: 0; } }

.enjoy .unit-1, .enjoy .unit-2 { margin-right: 16.66667vw; margin-left: 16.66667vw; }

@media screen and (max-width: 960px) { .enjoy .unit-1, .enjoy .unit-2 { margin: 0; }
  .units-polyfill .enjoy .unit-1, .units-polyfill .enjoy .unit-2 { margin: 0; } }

.enjoy .unit-3 { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-right: 8.33333vw; margin-left: 8.33333vw; }

@media screen and (max-width: 960px) { .enjoy .unit-3 { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; margin: 0; }
  .units-polyfill .enjoy .unit-3 { margin: 0; } }

.enjoy .unit-item { overflow: hidden; padding-top: 4vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item { padding-top: 45px; }
  .units-polyfill .enjoy .unit-item { padding-top: 45px; } }

.enjoy .unit-item-1, .enjoy .unit-item-2 { padding-top: 9.33333vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-1, .enjoy .unit-item-2 { padding-top: 0; }
  .units-polyfill .enjoy .unit-item-1, .units-polyfill .enjoy .unit-item-2 { padding-top: 0; } }

@media screen and (max-width: 767px) { .enjoy .unit-item-2 { padding-top: 32vw; }
  .units-polyfill .enjoy .unit-item-2 { padding-top: 32vw; } }

.enjoy .unit-1 .unit-item, .enjoy .unit-2 .unit-item { width: 50%; }

@media screen and (max-width: 767px) { .enjoy .unit-1 .unit-item, .enjoy .unit-2 .unit-item { width: auto; } }

.enjoy .unit-3 .unit-item { width: 33.3%; }

@media screen and (max-width: 1279px) { .enjoy .unit-3 .unit-item { width: 50%; } }

@media screen and (max-width: 767px) { .enjoy .unit-3 .unit-item { width: auto; } }

.enjoy .unit-item-img { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }

@media screen and (max-width: 767px) { .enjoy .unit-item-img { display: block; margin: 0 108px; } }

.enjoy .unit-item.is-scroll-animation-active .unit-item-img { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.enjoy .unit-item-1 .unit-item-img, .enjoy .unit-item-2 .unit-item-img { height: 21.33333vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-1 .unit-item-img, .enjoy .unit-item-2 .unit-item-img { height: auto; }
  .units-polyfill .enjoy .unit-item-1 .unit-item-img, .units-polyfill .enjoy .unit-item-2 .unit-item-img { height: auto; } }

.enjoy .unit-item-3 .unit-item-img, .enjoy .unit-item-4 .unit-item-img { height: 23.3vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-3 .unit-item-img, .enjoy .unit-item-4 .unit-item-img { height: auto; }
  .units-polyfill .enjoy .unit-item-3 .unit-item-img, .units-polyfill .enjoy .unit-item-4 .unit-item-img { height: auto; } }

.enjoy .unit-item-5 .unit-item-img, .enjoy .unit-item-6 .unit-item-img { height: 23.46667vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-5 .unit-item-img, .enjoy .unit-item-6 .unit-item-img { height: auto; }
  .units-polyfill .enjoy .unit-item-5 .unit-item-img, .units-polyfill .enjoy .unit-item-6 .unit-item-img { height: auto; } }

.enjoy .unit-item-7 .unit-item-img, .enjoy .unit-item-8 .unit-item-img, .enjoy .unit-item-9 .unit-item-img { height: 23.53333vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-7 .unit-item-img, .enjoy .unit-item-8 .unit-item-img, .enjoy .unit-item-9 .unit-item-img { height: auto; }
  .units-polyfill .enjoy .unit-item-7 .unit-item-img, .units-polyfill .enjoy .unit-item-8 .unit-item-img, .units-polyfill .enjoy .unit-item-9 .unit-item-img { height: auto; } }

.enjoy .unit-item-10 .unit-item-img, .enjoy .unit-item-11 .unit-item-img { height: 23.2vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-10 .unit-item-img, .enjoy .unit-item-11 .unit-item-img { height: auto; }
  .units-polyfill .enjoy .unit-item-10 .unit-item-img, .units-polyfill .enjoy .unit-item-11 .unit-item-img { height: auto; } }

.enjoy .unit-item-img-inner { position: relative; width: 100%; }

.enjoy .unit-item-img-inner img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; font-family: "object-fit: contain; object-position: center bottom"; }

.enjoy .unit-item-1 .unit-item-img-inner { height: 21.33333vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-1 .unit-item-img-inner { height: auto; padding-top: 172.89719626168225%; }
  .units-polyfill .enjoy .unit-item-1 .unit-item-img-inner { height: auto; } }

.enjoy .unit-item-2 .unit-item-img-inner { height: 21.33333vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-2 .unit-item-img-inner { height: auto; padding-top: 172.89719626168225%; }
  .units-polyfill .enjoy .unit-item-2 .unit-item-img-inner { height: auto; } }

.enjoy .unit-item-2 .unit-item-img-inner:before { content: ''; display: block; position: absolute; top: -6.66667vw; right: 6vw; width: 5.33333vw; height: 5.33333vw; background: url(../images/enjoy/unit-img-02-02.png) no-repeat 0 0; background-size: contain; }

@media screen and (max-width: 960px) { .enjoy .unit-item-2 .unit-item-img-inner:before { left: 50%; }
  .units-polyfill .enjoy .unit-item-2 .unit-item-img-inner:before { right: auto; } }

@media screen and (max-width: 767px) { .enjoy .unit-item-2 .unit-item-img-inner:before { top: -26.66667vw; left: 50%; width: 21.33333vw; height: 21.33333vw; }
  .units-polyfill .enjoy .unit-item-2 .unit-item-img-inner:before { right: auto; } }

.enjoy .unit-item-3 .unit-item-img-inner { height: 19.33333vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-3 .unit-item-img-inner { height: auto; padding-top: 152.9595015576324%; }
  .units-polyfill .enjoy .unit-item-3 .unit-item-img-inner { height: auto; } }

.enjoy .unit-item-4 .unit-item-img-inner { height: 28.53333vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-4 .unit-item-img-inner { height: auto; padding-top: 225.85669781931466%; }
  .units-polyfill .enjoy .unit-item-4 .unit-item-img-inner { height: auto; } }

.enjoy .unit-item-5 .unit-item-img-inner { height: 23.46667vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-5 .unit-item-img-inner { height: auto; padding-top: 185.04672897196262%; }
  .units-polyfill .enjoy .unit-item-5 .unit-item-img-inner { height: auto; } }

.enjoy .unit-item-6 .unit-item-img-inner { height: 21.33333vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-6 .unit-item-img-inner { height: auto; padding-top: 172.89719626168225%; }
  .units-polyfill .enjoy .unit-item-6 .unit-item-img-inner { height: auto; } }

.enjoy .unit-item-7 .unit-item-img-inner { height: 23.53333vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-7 .unit-item-img-inner { height: auto; padding-top: 198.75389408099688%; }
  .units-polyfill .enjoy .unit-item-7 .unit-item-img-inner { height: auto; } }

.enjoy .unit-item-8 .unit-item-img-inner { height: 19.53333vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-8 .unit-item-img-inner { height: auto; padding-top: 178.50467289719627%; }
  .units-polyfill .enjoy .unit-item-8 .unit-item-img-inner { height: auto; } }

.enjoy .unit-item-9 .unit-item-img-inner { height: 22.26667vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-9 .unit-item-img-inner { height: auto; padding-top: 208.41121495327104%; }
  .units-polyfill .enjoy .unit-item-9 .unit-item-img-inner { height: auto; } }

.enjoy .unit-item-10 .unit-item-img-inner { height: 23.2vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-10 .unit-item-img-inner { height: auto; padding-top: 205.29595015576323%; }
  .units-polyfill .enjoy .unit-item-10 .unit-item-img-inner { height: auto; } }

.enjoy .unit-item-11 .unit-item-img-inner { height: 21.66667vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-11 .unit-item-img-inner { height: auto; padding-top: 187.85046728971964%; }
  .units-polyfill .enjoy .unit-item-11 .unit-item-img-inner { height: auto; } }

.enjoy .unit-item-cont { position: relative; z-index: 1; margin-top: -3.66667vw; }

@media screen and (max-width: 767px) { .enjoy .unit-item-cont { margin-top: -16vw; } }

.enjoy .unit-item-label { margin-bottom: 5px; font-size: 14px; letter-spacing: 1.4px; }

@media screen and (max-width: 767px) { .enjoy .unit-item-label { font-size: 11px; letter-spacing: 1.1px; } }

.enjoy .unit-item-ttl { font-size: 18px; font-weight: bold; line-height: 1.44; letter-spacing: 1.8px; }

@media screen and (max-width: 767px) { .enjoy .unit-item-ttl { font-size: 15px; letter-spacing: 1.5px; } }

.enjoy .unit-item-txt { margin-top: 15px; font-size: 14px; line-height: 2.14; letter-spacing: 2.5px; }

@media screen and (max-width: 767px) { .enjoy .unit-item-txt { font-size: 12px; line-height: 1.75; letter-spacing: 2.2px; } }

.enjoy .unit-item-btn { display: block; position: relative; width: 250px; max-width: 250px; margin: 20px auto 0; color: #fff; height: 50px; -webkit-transition: opacity .2s linear; transition: opacity .2s linear; }

@media screen and (max-width: 767px) { .enjoy .unit-item-btn { width: 250px; max-width: none; height: 45px; } }

.enjoy .unit-item-btn:before, .enjoy .unit-item-btn:after { content: ''; display: block; position: absolute; top: 0; width: 1px; height: 100%; background: url(../images/enjoy/line-repeat-v.png) repeat-y 0 0; }

.enjoy .unit-item-btn:before { left: 0; }

.enjoy .unit-item-btn:after { right: 0; }

@media screen and (min-width: 768px) { .desktop .enjoy .unit-item-btn:hover { opacity: 0.5; } }

.enjoy .unit-item-btn-inner { position: absolute; top: 0; left: 0; width: 100%; line-height: 50px; }

@media screen and (max-width: 767px) { .enjoy .unit-item-btn-inner { line-height: 45px; } }

.enjoy .unit-item-btn-inner:before, .enjoy .unit-item-btn-inner:after { content: ''; display: block; position: absolute; left: 0; width: 100%; height: 1px; background: url(../images/enjoy/line-repeat-h.png) repeat-x 0 0; }

.enjoy .unit-item-btn-inner:before { top: 0; }

.enjoy .unit-item-btn-inner:after { bottom: 0; }

.enjoy .unit-item-btn-inner span { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; font-size: 18px; font-weight: 900; letter-spacing: 1.8px; }

.enjoy .unit-item-btn-inner span:after { content: ''; display: block; width: 8px; height: 16px; margin-left: 5px; background: url(../images/enjoy/ico-arrow-right-white.png) no-repeat 0 0; background-size: contain; }

.enjoy .recipe {
  margin-bottom: 160px;
}
@media screen and (max-width: 767px) {
  .enjoy .recipe {
    margin-bottom: 105px;
  }
}

.recipe .recipe-illust {
  position: relative;
}
@media screen and (max-width: 767px) {
  .recipe .recipe-illust {
    position: relative;
  }
}

.recipe .recipe-illust img {
  max-width: 100%;
  height: auto;
}
.enjoy .recipe .recipe-inner {
  width: 1020px;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}
@media screen and (max-width: 767px) {
  .enjoy .recipe .recipe-inner {
    width: 80%;
  }
}
.enjoy .recipe .recipe-ttl {
  font-size: 46px;
  font-weight: 400;
  text-align: center;
  color: #fff;
  margin-bottom: 70px;
}
@media screen and (max-width: 767px) {
  .enjoy .recipe .recipe-ttl {
    font-size: 24px;
    margin-bottom: 35px;
  }
}
.enjoy .recipe .recipe-list {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .enjoy .recipe .recipe-list {
    display: block;
  }
}
.enjoy .recipe .recipe-list li {
  list-style: none;
  position: relative;
  max-width: 29%;
}
@media screen and (max-width: 767px) {
  .enjoy .recipe .recipe-list li {
    max-width: none;
  }
}
@media screen and (max-width: 767px) {
  .enjoy .recipe .recipe-list li:not(:last-child) {
    margin-bottom: 50px;
  }
}
.enjoy .recipe .recipe-list li:not(:last-child)::after {
  content: url(../../assets/images/enjoy/recipe-arrow.png);
  position: absolute;
  line-height: 0;
  top: calc(50% - 19px);
  right: -40px;
}
@media screen and (max-width: 767px) {
  .enjoy .recipe .recipe-list li:not(:last-child)::after {
    top: auto;
    right: auto;
    bottom: -20px;
    transform: rotate(90deg);
    transform-origin: bottom;
    margin-left: calc(50% - 19px);
  }
}
.enjoy .recipe .recipe-list .recipe-num {
  display: block;
  text-align: center;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .enjoy .recipe .recipe-list .recipe-num {
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 767px) {
  .enjoy .recipe .recipe-list .recipe-num img {
    max-width: 85px;
  }
}
.enjoy .recipe .recipe-list .recipe-img img {
  width: 100%;
}
.enjoy .recipe .recipe-list .recipe-txt {
  height: 110px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  background: #fff;
  color: #133a5c;
  font-size: 16px;
  font-weight: 700;
}
.enjoy .recipe .recipe-list .recipe-txt p:not(:last-child) {
  margin-bottom: 10px;
}
.enjoy .recipe .recipe-list .recipe-txt p.small {
  font-size: 14px;
}
.enjoy .recipe .recipe-list .recipe-txt p.small span {
  font-size: 16px;
}

.ad-gallery .header { padding: 130px 0; text-align: center; background: url(../images/brandmovie/hero-bg.jpg) no-repeat 0 center; background-size: cover; }

@media screen and (max-width: 767px) { .ad-gallery .header { padding: 56px 0; background-image: url(../images/brandmovie/hero-bg-sp.jpg); } }

.ad-gallery .header .header-ttl { font-size: 42px; color: #fff; }

@media screen and (max-width: 767px) { .ad-gallery .header .header-ttl { font-size: 24px; } }

.ad-gallery .internal-btn { display: inline-block; text-decoration: none; background-color: #fff; padding: 20px 0; width: 360px; text-align: center; }

@media screen and (max-width: 767px) { .ad-gallery .internal-btn { width: 100%; padding: 22px 0 26px; } }

.ad-gallery .internal-btn-text { font-size: 20px; color: #000; font-weight: 500; letter-spacing: 0.08em; }

@media screen and (max-width: 767px) { .ad-gallery .internal-btn-text { font-size: 16px; letter-spacing: 0.1em; } }

.ad-gallery .internal-btn-icon { display: block; position: relative; text-align: center; width: 16px; margin: 3px auto 0; }

.ad-gallery .internal-btn-icon img { max-width: 100%; margin-top: 7px; }

.ad-gallery .yt-media-title-wrapper{
  text-align: center;
  color: #fff;
  letter-spacing: 0.18em;
  padding:24px 0;
}
.ad-gallery .yt-media-content + .yt-media-title-wrapper{
  padding-top:48px;
}
.ad-gallery .yt-media-subtitle{
  font-size: 24px;
  margin-right:16px;
}
.ad-gallery .yt-media-title{
  font-size: 36px;
}
@media screen and (max-width: 767px){
  .ad-gallery .yt-media-title-wrapper{
    padding:16px 0;
  }
  .ad-gallery .yt-media-content + .yt-media-title-wrapper{
    padding-top:36px;
  }
  .ad-gallery .yt-media-subtitle{
    font-size: 16px;
    margin-right:0;
    display: block;
  }
  .ad-gallery .yt-media-title{
    font-size: 24px;
  }
}


/* --------------------------
event
-------------------------- */
/* common */
.event-page {
  font-family: "Noto Serif JP", serif;
  box-sizing:border-box;
}

.event-page #suntory_contents { z-index: 10; position: relative; }

.event-page .wrapper { position: relative; z-index: 1; }

.event-page .font-setting{
  /* font-feature-settings: "palt";
  -webkit-font-feature-settings: "palt"; */
  letter-spacing: 0.02em;
}

.event-page .transform-setting{
  opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out;
}
.event-page .transform-setting.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

/* hero */
.event-page .hero { padding-top: 33px; background-color:#ffffff; }

@media screen and (max-width: 767px) { .event-page .hero { padding-top: 15px; } }

.event-page .hero-ttl { text-align: center; }

.event-page .hero-ttl img{
  max-width:100%;
}

.event-page .hero-ttl span { display: block; opacity: 0; -webkit-transform: translate(-10px, 10px); -ms-transform: translate(-10px, 10px); transform: translate(-10px, 10px); -webkit-transition: opacity .5s linear, -webkit-transform .6s linear; transition: opacity .5s linear, -webkit-transform .6s linear; transition: opacity .5s linear, transform .6s linear; transition: opacity .5s linear, transform .6s linear, -webkit-transform .6s linear; }

.event-page.is-load .hero-ttl span { opacity: 1; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); }

.event-page .hero-subttl{
  overflow: hidden;
  padding:25px 0 31px;
}
.event-page .hero-subttl p{
  display: block;
  width: 50%;
  float: left;
  font-size: 28px;
  color:#133c5d;
}
.event-page .hero-img-logo{
  float: right;
}
.event-page .hero-img-logo img{
  max-width: 100%;
}

@media screen and (max-width: 767px){
  .event-page .hero-subttl{
    padding:9px 0 13px;
  }
  .event-page .hero-subttl p{
    width: 100%;
    float: none;
    font-size: 20px;
    font-size: 5.3vw;
  }
  .event-page .hero-img-logo{
    float: none;
    max-width: 42vw;
  }
}

/* event-main */
.event-page .event-main { 
  background: url(../images/dk/bg_main.png) no-repeat center;
  background-size: cover;
  padding:120px 0 54px;
}
.event-page .event-main-text{
  color: #ffffff;
  font-size: 60px;
  margin-bottom: 38px;
  letter-spacing: -0.02em;
  line-height: 1.6;
}
.event-page .event-main-text .font-kerning{
  letter-spacing: -0.5em;
}
.event-page .event-main-img{
  opacity: 1;
  -webkit-transition: opacity .2s linear;
  transition: opacity .2s linear;
}
.event-page .event-main-img:hover{
  opacity: 0.5;
}
.event-page .event-main-img img{
  max-width: 100%;
}
@media screen and (max-width: 767px){
  .event-page .event-main { 
    background: url(../images/dk/bg_main_sp.png) no-repeat center;
    background-size: cover;
    padding:26px 0 13px;
  }
  .event-page .event-main-text{
    font-size: 27px;
    font-size: 7.3vw;
    margin-bottom: 89vw;
    text-align: center;
  }
  .event-page .event-main-img{
    text-align: center;
  }
}
/* content banner*/
.event-page .content { 
  background: url(../images/dk/bg_content.png) repeat center;
  padding-bottom:100px;
}
.event-page .content .content-bnr{
  background:url(../images/dk/bg_bnr.png) no-repeat left center ;
  background-size: cover;
  padding:20px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  margin:0 0 100px;
  flex-wrap: wrap;

}
.event-page .content .bnr-text{
  color:#113e6b;
  line-height: 1.2;
  margin:0 45px 0 0;
}
.event-page .content .bnr-text-sub{
  font-family: "Times New Roman", "Noto Serif JP", serif;
  font-size: 30px;
  letter-spacing: 0.04em;
}
.event-page .content .bnr-text-main{
  font-size: 40px;
  font-weight: bold;
  letter-spacing: 0.3em;
}
.event-page .content .bnr-text-main span{
  color:#7e0015;
}
@media screen and (max-width: 767px){
  .event-page .content { 
    padding-bottom:40px;
  }
  .event-page .content .content-bnr{
    background:url(../images/dk/bg_bnr_sp.png) no-repeat left center ;
    padding:9px 0 0;
    margin:0 0 28px;
  }
  .event-page .content .bnr-text{
    margin:0 0 8px 0 ;
    text-align: center;
  }
  .event-page .content .bnr-text-sub{
    font-size: 18px;
    font-size: 4.8vw;
    letter-spacing: 0.04em;
    display: inline-block;
  }
  .event-page .content .bnr-text-main{
    font-size: 20px;
    font-size: 5.3vw;
    letter-spacing: 0.04em;
    display: inline-block;
  }
}

/* EC BUTTON */

.event-page .about-ec-button { text-align: center; margin-top: 0px; max-width: 100%;}

@media screen and (max-width: 767px) { 
  .event-page .about-ec-button { 
    margin: 0 auto 0;
  }
  .event-page .about-ec-button iframe.fixed{
    top:110px !important;
  }
}
.event-page .about-ec-button img {
  max-width: 100%; height: auto;
}

.event-page .about-ec-button_inner {
  margin: auto;
}
@media screen and (max-width: 767px) {
  .event-page .about-button_inner {
    padding:0 9.8vw;
    box-sizing: border-box;
  }
}
/* content about*/
.event-page .catch { padding-top: 102px; }
.event-page .catch .catch-main { 
  font-family: "Times New Roman", "Noto Serif JP", serif;
  line-height: 1.3; text-align: center; font-size: 42px; color: #fff; 
  letter-spacing: 0.12em; 
}
.event-page .catch .catch-main span{
  font-size: 45px;
}
.event-page .catch .catch-main::after{
  content: '';
  background:url(../images/dk/line_title.png) no-repeat center;
  width: 100%;
  max-width: 100%;
  height:2px;
  display:block;
  margin-top:40px;
}

.event-page .catch .catch-read { margin-top: 16px; text-align: center; font-size: 22px; color: #fff; line-height: 2.5; letter-spacing: 0.08em; }

@media screen and (max-width: 767px){
  .event-page .catch { padding-top: 15px; }
  .event-page .catch .catch-main { 
    font-size: 23px;
    font-size: 6vw;
    letter-spacing: 0.06em;
  }
  .event-page .catch .catch-main span{
    font-size: 23px;
    font-size: 6vw;
  }
  .event-page .catch .catch-main::after{
    margin-top:20px;
  }
  .event-page .catch .catch-read {
    margin-top: 16px;
    font-size: 12px;
    line-height: 2.5;
  }
}

.event-page .sec1 { margin-top: 102px; }

@media screen and (max-width: 767px) {
  .event-page .sec1 { margin: 28px 0 0; }
  /* .units-polyfill .event-page .sec1 { margin: 41px 10px 0; }  */
}

.event-page .sec1-contents { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.event-page .sec1-contents:nth-child(2n){
  flex-direction: row-reverse;
  margin-top:120px;
}
@media screen and (max-width: 767px) {
  .event-page .sec1-contents {
    display: block;
  }
  .event-page .sec1-contents:nth-child(2n){
    margin-top:24px;
  }
}

.event-page .sec1-image { width: calc((100% - 40px) / 2);  }

@media screen and (max-width: 767px) { .event-page .sec1-image { width: 100%; padding-top: 68%; position: relative; } }

.event-page .sec1-image img { width: 100%; }

@media screen and (max-width: 767px) { .event-page .sec1-image img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; font-family: "object-fit: cover; object-position: center center"; } }

.event-page .sec1-description { width: calc((100% - 30px) / 2); }

@media screen and (max-width: 767px) { .event-page .sec1-description { width: 100%;} }

.event-page .sec1-read { 
  margin-top:-24px;
  font-size: 22px; line-height: 2.9; letter-spacing: 0.2em; color: #fff; 
}

@media screen and (max-width: 767px) { .event-page .sec1-read { margin-top: 20px; line-height: 2.0; font-size: 12px; } }

/* content kit*/
.event-page .sec1-img-kit-wrapper{
  text-align: center;
}
.event-page .sec1-img-kit{
  max-width: 100%;
  margin-top:170px;
  box-shadow: 0px 0px 15px 0px rgba(0, 61, 95, 0.004);
  width: 100%;
}
.event-page .sec1-img-kit-text{
  color:#ffffff;
  text-align: right;
  margin:20px 0 0;
  line-height: 1;
  font-size:20px;
}
@media screen and (max-width: 767px) {
  .event-page .sec1-img-kit{
    margin-top:40px;
  }
  .event-page .sec1-img-kit-text{
    margin:8px 0 0;
    font-size:10px;
  }
}

/* main-block */
.event-page .content-02{
  background: url(../images/dk/bg_content_02.png) repeat center;
  padding-top:110px;
  position: relative;
  color:#2e1a04;
  overflow: hidden;
}
.event-page .content-02::before , .event-page .content-02::after{
  content:'';
  background:url(../images/dk/bg_content_symbol.png) no-repeat center;
  background-size: contain;
  position: absolute;
  display: block;
  top:20px;
  left:-120px;
  width: 1110px;
  height: 1110px;
}
.event-page .content-02::after{
  position: absolute;
  top:auto;
  left:auto;
  bottom:20px;
  right:-120px;
}
.event-page .main-block {
  background-image: url(../images/dk/bg_main-block.png);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  margin-bottom: 137px;
  position: relative;
  z-index:1;
}

@media screen and (max-width: 767px) {
  .event-page .content-02{
    padding:6px 3.3vw 40px;
  }
  .event-page .content-02::before , .event-page .content-02::after{
    position: absolute;
    top:0;
    left:-100vw;
    width: 148vw;
    height: 148vw;
  }
  .event-page .content-02::after{
    position: absolute;
    top:auto;
    left:auto;
    bottom:0px;
    right:-100vw;
  }
  .event-page .main-block { 
    margin: 34px 0 0;
  }
  /* .units-polyfill .event-page .main-block { margin: 54px 10px 0; }  */
}

.event-page .main-block .main-block-inner {
  margin: 0 100px;
  padding: 86px 0 134px;
  letter-spacing: 0.3em;
}

@media screen and (max-width: 767px) {
  .event-page .main-block .main-block-inner {
    margin: 0 10px; padding: 35px 0 38px; line-height: 1.3;
  }
  /* .units-polyfill .event-page .main-block .main-block-inner { margin: 0 10px; }  */
}

.event-page .main-block .main-block-subttl{
  text-align: center; font-size: 30px; 
}

.event-page .main-block .main-block-ttl { 
  text-align: center;
  font-size: 41px;
  margin:16px 0 0;
  letter-spacing: -0.01em;
  font-family: "Times New Roman", "Noto Serif JP", serif;
}
.event-page .main-block .main-block-ttl span{
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .event-page .main-block .main-block-subttl{
    font-size: 12px;
    letter-spacing: 0.03em;
  }
  .event-page .main-block .main-block-ttl {
    font-size: 18px;
    font-size: 4.6vw;
    margin:9px 0 0;
    letter-spacing: 0.03em;
  }
}

.event-page .main-block .main-block-distillery { margin-top: 75px; }

@media screen and (max-width: 767px) { .event-page .main-block .main-block-distillery { margin-top: 39px; } }


.event-page .main-block .main-block-distillery-btn { margin-top: 60px; text-align: center; }

@media screen and (max-width: 767px) { .event-page .main-block .main-block-distillery-btn { margin-top: 32px; } }

.event-page .distillery-sec { margin-top: 30px; }

@media screen and (max-width: 767px) { .event-page .distillery-sec { margin-top: 15px; } }

.event-page .distillery-sec ~ .distillery-sec { margin-top: 86px; }

@media screen and (max-width: 767px) { .event-page .distillery-sec ~ .distillery-sec { margin-top: 52px; } }

.event-page .distillery-sec-name { 
  text-align: center;
  padding-bottom: 13px;
  letter-spacing: 0.5em;
}
.event-page .distillery-sec-name::after{
  content: '';
  background: url(../images/dk/line_title_02.png) no-repeat center;
  max-width: 100%;
  display: block;
  height:2px;
}

.event-page .distillery-sec-name .distillery-sec-name-main { display: block; font-size: 36px; font-weight: normal; letter-spacing: 0.1em; }

@media screen and (max-width: 767px) { .event-page .distillery-sec-name .distillery-sec-name-main { font-size: 18px; } }

.event-page .distillery-sec-name .distillery-sec-name-sub { 
  display: block;
  font-size: 20px;
  letter-spacing: 0.08em;
  font-family: "Times New Roman";
  padding-bottom: 10px;
  font-weight:normal;
}

@media screen and (max-width: 767px) { .event-page .distillery-sec-name .distillery-sec-name-sub { font-size: 10px; } }

.event-page .distillery-sec-contents { 
  overflow: hidden;
  margin-top: 51px; }

.event-page .distillery-sec-contents ~ .distillery-sec-contents { margin-top: 17px; }

.event-page .distillery-sec-contents-inner{
  float: right;
  list-style: none;
  width: calc((100% ) / 10 * 6);
  padding:0 44px 0 0;
}
.event-page .distillery-sec-contents-inner:first-child{
  width: calc((100% ) / 10 * 4 );
  padding:0 0 0 24px;
}

.event-page .distillery-sec-image img { width: 100%; }

.event-page .distillery-sec-read {
  font-size: 20px;
  line-height: 2;
  letter-spacing: 0.02em;
  margin-bottom: 28px;
}

@media screen and (max-width: 767px) {
  .event-page .distillery-sec-contents {
    display: block; margin-top: 20px;
    }
    .event-page .distillery-sec-contents-inner{
      float: none;
      width: 100%;
      padding:0;
    }
    .event-page .distillery-sec-contents-inner:first-child{
      width: 100%;
      padding:0;
      margin-bottom: 20px;
    }
    .event-page .distillery-sec-read { 
      font-size: 12px;
      margin-bottom: 18px;
    }
}
.event-page .distillery-sec-date{
  border:2px solid #030000;
  position: relative;
  padding:20px 29px;
  font-size: 18px;
  letter-spacing: 0;
  margin-bottom:26px;
}
.event-page .distillery-sec-date::before {
	content: '';
	width: calc(100% - 8px);
	height: calc(100% - 8px);
	border: 1px solid #030000;
	position: absolute;
	top: 4px;
	left: 4px;
}
.event-page .distillery-sec-date .date-list{
  font-size: 24px;
  overflow: hidden;
}
.event-page .distillery-sec-date .date-ttl{
  float: left;
  width:26%;
}
.event-page .distillery-sec-date .date-txt{
  float: left;
  width: 74%;
}
.event-page .distillery-sec-date .date-subtxt{
  padding-bottom:10px;
}
.event-page .distillery-sec-date  .date-read{
  padding-top: 10px;
}
.event-page .distillery-sec-date  .date-read-list{
  padding-left:20px;
  list-style-type: none;
  position: relative;
}
.event-page .distillery-sec-date  .date-read-list::before{
  content:'※';
  position: absolute;
  left:0;
}
.event-page .step{
  display: flex;
}
.event-page .step-list{
  text-align: center;
  list-style: none;
  width: 33.33%;
  box-sizing: border-box;
  margin:0 10px;
  position: relative;
}
.event-page .step-icon{
  max-width: 100%;
}
.event-page .step-list::after{
  content: url(../images/dk/step_icon_arrow.png);
  position: absolute;
  top:35%;
  right:-10%;
}
.event-page .step-list:last-child::after{
  content:none;
}
.event-page .step-title{
  font-size: 30px;
  font-family: "Times New Roman", "Noto Serif JP", serif;
  background: url(../images/dk/step_button.png) no-repeat center;
  background-size: contain;
  line-height: 62px;
}
.event-page .step-read{
  font-size: 18px;
  letter-spacing: 0.02em;
  margin-bottom: 20px;
  line-height:1.7;
}
.event-page .step-read-small{
  font-size: 14px;
}
.event-page .step-table{
  table-layout: fixed;
  width: 100%;
}
.event-page .step-table td{
  width: 33.33%;
  text-align: center;
}
.event-page .u-hidden-sp-1024{
  display: block;
}
.event-page .u-hidden-pc-1024{
  display: none;
}
.event-page .archive-read{
  text-align: center;
  font-size: 26px;
  line-height:1.76;
  letter-spacing: 0.1em;
}

.event-page .yt-media-content { 
  position: relative;
  padding-top: 44.6058%;
  height: auto;
  margin-top: 40px;
  background: #cccccc;
  position: relative;
}
.event-page .yt-media-text{
  text-align: center;
  position: absolute;
  top:50%;
  left: 50%;
  transform: translate(-50%,-50%);
  font-size: 20px;
}
.event-page .movie-text{
  text-align: center;
  padding: 60px 0 16px 0;
  font-size: 26px;
  letter-spacing: 0.1em;
}
.event-page .movie-subtext{
  text-align: center;
  font-size: 20px;
  padding:10px 0 0 0;
  letter-spacing: 0.1em;
}
.event-page .movie-button-wrapper{
  text-align: center;
}
.event-page .movie-button{
  display: inline-block;
  margin:0 auto;
}
.event-page .movie-button img{
  max-width: 100%;
}
@media screen and (max-width: 767px) {
  .event-page .distillery-sec-date{
    padding:15px;
    font-size: 10px;
    margin-bottom:13px;
  }
  .event-page .distillery-sec-date .date-list{
    font-size: 14px;
    padding-left:0;
    margin-bottom:8px;
  }
  .event-page .distillery-sec-date .date-read-list{
    font-size:12px;
    line-height: 1.5;
  }
  .event-page .distillery-sec-date .date-subtxt{
    font-size:12px;
    line-height: 1.5;
  }
  .event-page .archive-read{
    font-size: 12px;
  }
  .event-page .yt-media-content {
    margin-top: 20px; 
  }
  .event-page .yt-media-text{
    font-size: 16px;
  }
  .event-page .movie-text{
    padding: 24px 0 8px 0;
    font-size: 13px;
  }
  .event-page .movie-subtext{
    font-size: 10px;
    padding:4px 0 0 0;
  }
}
@media screen and (max-width: 1024px) {
  .event-page .u-hidden-sp-1024{
    display: none;
  }
  .event-page .u-hidden-pc-1024{
    display: block;
  }
  .event-page .step{
    display: block;
  }
  .event-page .step-list{
    width: 100%;
    margin: 0 0 90px 0;
    padding:0;
  }
  .event-page .step-list::after{
    content:'' ;
    background: url(../images/dk/step_icon_arrow_sp.png) no-repeat center;
    background-size:contain ;
    position: absolute;
    top:auto;
    bottom:-60px;
    right:auto;
    left:50%;
    width: 30px;
    height:44px;
    display: block;
    -webkit-transform:translate(-50%, 0);
    transform:translate(-50%, 0);
  }
  .event-page .step-list:last-child{
    margin-bottom:0;
  }
  .event-page .step-list:last-child::after{
    content:none;
  }
  .event-page .step-icon{
    max-width: 50%;
  }
  .event-page .step-title{
    font-size: 15px;
    line-height: 30px;
  }
  .event-page .step-read{
    font-size: 12px;
    margin-bottom: 10px;
  }
  .event-page .step-read-small{
    font-size: 12px;
  }
}

/* EC BUTTON step*/
.event-page .step-button{
  text-align: center;
}
.event-page .step-button img { 
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .event-page .step-button{
    margin:0 auto 0;
  }
  .event-page .step-button iframe.fixed{
    top:110px !important;
  }
}
.event-page .step-button_inner { margin: auto; }

/* content-03,content-04  */
.event-page .content-03{
  background: #061a39;
  position: relative;
}
.event-page .content-04{
  background: url(../images/dk/footer_bnr_bg.png) no-repeat center center;
  background-size:cover ;
}
.event-page .footer-bnr-wrapper{
  justify-content: space-between;
  align-items: center;

  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 100%;
}
.event-page .footer-bnr-img , .event-page .footer-bnr-btn{
  max-width: 100%;
  box-sizing:border-box;
  margin:auto;
  padding:16px 0;
}
.event-page .footer-bnr-btn-inner{
  margin:auto;
}
.event-page .footer-bnr-img img , .event-page .footer-bnr-btn img{
  max-width: 100%;
  margin: 0 auto;
  height: auto;
}

@media screen and (max-width: 767px){
  .event-page .content-04{
    padding-bottom: 10px;
  }
  .event-page .footer-bnr-wrapper{
    display: block;
    padding: 10px 0;
  }
  .event-page .footer-bnr-img , .event-page .footer-bnr-btn{
    line-height: 1;
  }
  .event-page .footer-bnr-btn{
    padding:0;
  }
  .event-page .footer-bnr-img {
    padding: 0 0 6px;
  }
  .event-page .footer-bnr-wrapper iframe.fixed{
    top:110px !important;
  }
}

/* ボタンの非活性 */
.button-inactiv-subtext{
  text-align: center;
  font-size: 13px;
  letter-spacing: -0.5px;
}
.button-inactiv-subtext.color-wht{
  color: #ffffff;
}
@media screen and (max-width: 767px){
  .button-inactiv-subtext{
    font-size: 12px;
    margin:8px 0;
  }
}

/* --------------------------
synchro
-------------------------- */
.synchro {
  font-family: "Noto Serif JP", serif;
}
.synchro .hero {
  overflow: hidden;
}
.synchro .hero img {
  max-width: 100%;
  height: auto;
}
.synchro .content {
  background: #060819 url(../images/synchro/bg.png) no-repeat center top;
  background-size: cover;
  padding-bottom: 140px;
}
@media screen and (max-width: 767px) {
  .synchro .content {
    background: #060819 url(../images/synchro/bg-sp.png) no-repeat center top;
    background-size: cover;
    padding-bottom: 70px;
  }
}
.synchro .catch {
  padding-top: 100px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .synchro .catch {
    padding-top: 50px;
  }
}
.synchro .content .js-scroll-animation {
  opacity: 0;
  -webkit-transform: translateY(30px);
  -ms-transform: translateY(30px);
  transform: translateY(30px);
  -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out;
  transition: opacity .5s ease-out, -webkit-transform .8s ease-out;
  transition: opacity .5s ease-out, transform .8s ease-out;
  transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out;
}
.synchro .content .js-scroll-animation.is-scroll-animation-active {
  opacity: 1;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
}
@media screen and (max-width: 767px) {
  .synchro .catch .catch-main {
    padding: 0 4%;
  }
}
.synchro .catch .catch-main img {
  max-width: 100%;
  height: auto;
}
.synchro .catch .catch-read {
  text-align: center;
  font-size: 18px;
  color: #fff;
  line-height: 2;
  letter-spacing: 0.18em;
  margin-top: 55px;
}
@media screen and (max-width: 767px) {
  .synchro .catch .catch-read {
    font-size: 12px;
    line-height: 1.8;
    margin: 30px 10px 0;
  }
}
.synchro .movie {
  max-width: 762px;
  margin: 80px auto 0;
}
@media screen and (max-width: 767px) {
  .synchro .movie {
    margin: 30px 10px 0;
  }
}
.synchro .movie .movie-block:not(:last-child) {
  margin-bottom: 80px;
}
@media screen and (max-width: 767px) {
  .synchro .movie .movie-block:not(:last-child) {
    margin-bottom: 30px;
  }
}
.synchro .movie .movie-wrapper {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%;
}
.synchro .movie .movie-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.synchro .movie .movie-txt {
  font-size: 16px;
  color: #fff;
  line-height: 2;
  margin-top: 30px;
  text-align: center;
}
.synchro .movie .movie-txt-strong{
  font-size: 18px;
}
.synchro .movie .movie-txt a{
  color: #fff;
  text-decoration: underline;
}
@media screen and (max-width: 767px) {
  .synchro .movie .movie-txt {
    font-size: 12px;
  }
  .synchro .movie .movie-txt-strong{
    font-size: 14px;
  }
}
.synchro .movie-title-wrapper{
  text-align: center;
  color: #fff;
  letter-spacing: 0.18em;
  padding-bottom:24px;
}
.synchro .movie-subtitle{
  font-size: 24px;
  margin-right:16px;
}
.synchro .movie-title{
  font-size: 36px;
}
@media screen and (max-width: 767px){
  .synchro .movie + .movie{
    margin-top:45px;
  }
  .synchro .movie-title-wrapper{
    padding-bottom:16px;
  }
  .synchro .movie-subtitle{
    font-size: 16px;
    margin-right:0;
    display: block;
  }
  .synchro .movie-title{
    font-size: 24px;
  }
}

.synchro .feature-btn { position: relative; z-index: 1; margin: 45px auto 0; width: 320px; text-align: center; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, -webkit-transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out; transition: opacity .5s ease-out, transform .8s ease-out, -webkit-transform .8s ease-out; }
.synchro .feature-btn.mt { margin-top: 90px; }
@media screen and (max-width: 767px) {
  .synchro .feature-btn.mt {
    margin-top: 50px;
  }
}
.synchro .feature-btn.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
.synchro .btn { display: inline-block; padding: 17px 12px 0 0; width: 100%; height: 62px; font-weight: bold; letter-spacing: 0.15em; text-align: center; background-repeat: no-repeat; background-position: 0 0; background-size: 100% 100%; -webkit-transition: opacity .2s linear; transition: opacity .2s linear; position: relative; }
@media screen and (min-width: 768px) { .desktop .synchro .btn:hover { opacity: 0.5; } }
.synchro .btn.btn-white { background-image: url(../images/story/btn-white.png); }
.synchro .btn.btn-white .btn-text { color: #fff; }
.synchro .btn .btn-text { display: inline-block; font-size: 18px; }
.synchro .btn .btn-text::after { position: absolute; top: calc(50% - -1px); right: 30px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 8px; height: 16px; background-size: 100%; background-repeat: no-repeat; background-position: 0 0; content: ''; }
.synchro .btn.btn-white .btn-text::after { background-image: url(../images/story/ico-arrow-right-white.png); }

.synchro .btn[target="_blank"] i {
  width: 12px;
  height: 9px;
  display: inline-block;
  position: relative;
  margin-left: 0.5em;
  border: 1px solid #fff;
}
.synchro .btn[target="_blank"] i::after {
  display: block;
  position: absolute;
  top: -4px;
  left: 2px;
  /* outline: 1px solid #fff; */
  border: 1px solid #fff;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  background: #060819;
  content: "";
}

.synchro .prof{
  color: #fff;
  margin-top: 80px;
}
.synchro .prof-imgbox{
  width: 180px;
  margin: 0 auto 30px;
}
.synchro .prof-imgbox img{
  max-width: 100%;
}
.synchro .prof-name-wrapper{
  text-align: center;
}
.synchro .prof-name{
  font-size: 36px;
  font-weight: bold;
  border-bottom: 1px solid #fff;
  display: inline-block;
  padding-bottom: 6px;
  margin-bottom: 6px;
}
.synchro .prof-name-sub{
  text-align: center;
  font-size: 18px;
}
.synchro .prof-textbox{
  width: 760px;
  margin: 30px auto 0;
  border:1px solid #fff;
  padding: 40px;
  line-height: 2;
}
@media screen and (max-width: 767px){
.synchro .prof{
  margin: 40px 10px 0;
}
.synchro .prof-imgbox{
  width: 140px;
  margin: 0 auto 20px;
}
.synchro .prof-name{
  font-size: 24px;
  padding-bottom: 6px;
  margin-bottom: 6px;
}
.synchro .prof-name-sub{
  font-size: 16px;
}
.synchro .prof-textbox{
  width: 100%;
  margin: 20px auto 0;
  padding: 20px;
  font-size: 12px;
}
}
/* --------------------------
Ao購入ボタン
-------------------------- */
.buy-ao {
  border-top: 1px solid #1e1f29;
  background: #010101;
  height: 180px;
}
@media screen and (max-width: 767px) {
  .buy-ao {
    height: auto;
  }
}
.buy-ao-inner {
  max-width: 1160px;
  max-height: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .buy-ao-inner {
    display: block;
    margin: 0 40px;
    padding-bottom: 10px;
  }
}
.buy-ao-block {
  flex: 1;
}
@media screen and (max-width: 767px) {
  .buy-ao-block:last-child {
    margin-top: -20px;
  }
}
.buy-ao-block.wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.buy-ao-bottle {
  -webkit-transform: translateY(-30px);
  -ms-transform: translateY(-30px);
  transform: translateY(-30px);
}
@media screen and (max-width: 767px) {
  .buy-ao-bottle {
    width: 80px;
  }
}
.buy-ao-bottle img {
  max-width: 100%;
  height: auto;
}
.buy-ao-txt {
  text-align: center;
  color: #fff;
  font-size: 30px;
  margin-right: 100px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .buy-ao-txt {
    margin-right: 0;
    font-size: 20px;
    padding-right: 30px;
  }
}
.buy-ao-txt::after {
  position: absolute;
  top: calc(50% - -1px);
  right: -100px;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 8px;
  height: 16px;
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: 0 0;
  content: '';
  background-image: url(../images/story/ico-arrow-right-white.png);
}
@media screen and (max-width: 767px) {
  .buy-ao-txt::after {
    right: 0;
    -webkit-transform: translateY(-50%) rotate(90deg);
    -ms-transform: translateY(-50%) rotate(90deg);
    transform: translateY(-50%) rotate(90deg);
  }
}
.buy-ao-button {
  text-align: right;
}
.buy-ao-button img {
  max-width: 100%;
  height: auto;
}

/* --------------------------
碧Ao購入バッジ
-------------------------- */
.badge-buyao {
  position: fixed;
  z-index: 10;
  right: -30px;
  bottom: 35px;
}
@media screen and (max-width: 767px) {
  .badge-buyao {
    right: auto;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 8px 0;
    text-align: center;
    background: #041931 url(../images/about/badge-about-bg.png) no-repeat 1px -11px;
    background-size: 82px 82px;
    color: #fff;
  }
}
.badge-buyao-txt {
  display: none;
  font-size: 20px;
  letter-spacing: 0.06em;
}
@media screen and (max-width: 767px) {
  .badge-buyao-txt {
    display: block;
  }
  .badge-buyao-txt::after {
    content: '';
    display: inline-block;
    background: url(../../assets/images/button-next-icon.png) no-repeat center;
    background-size: cover;
    width: 8px;
    height: 16px;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
  }
}
@media screen and (max-width: 767px) {
  .badge-buyao img {
    display: none;
  }
}

/* --------------------------
story
-------------------------- */
.story {
  font-family: "Noto Serif JP", serif;
}
.story-gothic {
  font-family: '游ゴシック体',YuGothic,'游ゴシック Medium','Yu Gothic Medium','游ゴシック','Yu Gothic','メイリオ',sans-serif;
}
.story .wrapper {
  background: #1D385D url(../../assets/images/story/bg-repeat.png) repeat;
  background-size: 30px;
  padding-bottom: 120px;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .story .wrapper {
    padding-bottom: 80px;
  }
}
.story .content {
  position: relative;
}
.story .cmn-hero {
  background: #010101;
  height: 150px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .story .cmn-hero {
    height: 80px;
    justify-content: flex-start;
    padding-left: 20px;
    position: relative;
  }
}

@media screen and (min-width: 768px) {
  .story .cmn-hero {
    height: calc(150px + 7.320644216691069vw);
    margin-top: -7.320644216691069vw;
    padding-top: 7.320644216691069vw;
  }
}
@media screen and (min-width: 768px) and (max-width: 960px) {
  .story .cmn-hero {
    height: calc(150px + 70.27818448023426px);
    margin-top: -70.27818448023426px;
    padding-top: 70.27818448023426px;
  }
}
@media screen and (max-width: 767px) {
  .story .cmn-hero {
    height: calc(80px + 20.533333333333335vw);
    margin-top: -20.533333333333335vw;
    padding-top: 20.533333333333335vw;
  }
}


.story .cmn-hero-inner {
  position: relative;
}
@media screen and (max-width: 767px) {
  .story .cmn-hero-inner {
    position: static;
  }
}
.story .cmn-hero .story-num {
  position: absolute;
  top: -20px;
  right: -210px;
  width: 172px;
}
@media screen and (max-width: 767px) {
  .story .cmn-hero .story-num {
    width: 70px;
    top: calc(20px + 20.533333333333335vw);
    right: 20px;
  }
}
.story .cmn-hero .story-num img {
  max-width: 100%;
  height: auto;
}
.story .cmn-hero-ttl {
  color: #fff;
  font-size: 42px;
  font-weight: 400;
}
@media screen and (max-width: 767px) {
  .story .cmn-hero-ttl {
    font-size: 26px;
  }
}
.story .story-article {
  max-width: 1160px;
  margin: 0 auto;
  padding: 80px 0;
}
@media screen and (max-width: 767px) {
  .story .story-article {
    padding: 40px 0;
  }
}
.story .story-article-inner {
  width: 865px;
  margin: 0 auto;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .story .story-article-inner {
    width: auto;
    margin: 0 10px;
  }
}
.story .story-head {
  margin-bottom: 60px;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .story .story-head {
    margin-right: 10px;
    margin-left: 10px;
  }
}
.story-date {
  font-size: 16px;
  font-weight: 700;
}
.story .story-ttl {
  font-size: 46px;
  font-weight: 400;
  margin: 20px 0;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .story .story-ttl {
    font-size: 28px;
    margin: 10px 0;
  }
}
.story .story-subttl {
  font-size: 28px;
  font-weight: 700;
  margin: -20px 0 20px;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .story .story-subttl {
    margin: -10px 0 10px;
    font-size: 22px;
  }
}
.story-lead {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .story-lead {
    font-size: 16px;
  }
}
.story .story-info {
  margin: 30px 0;
  border-bottom: 1px dashed #536e86;
}
.story .story-info .story-info-item {
  border-top: 1px dashed #536e86;
  display: flex;
  align-items: center;
  height: 50px;
  font-weight: 700;
  padding-left: 15px;
}
@media screen and (max-width: 767px) {
  .story .story-info .story-info-item {
    padding-left: 0;
  }
}
.story .story-info .story-info-talk {
  display: flex;
  align-items: center;
}
.story .story-info .story-info-talk-label {
  white-space: nowrap;
}
.story .story-info .story-info-sign {
  display: flex;
  margin-left: 10px;
}
.story .story-info .story-info-sign-item span {
  font-size: 18px;
}
.story .story-info .story-info-sign img {
  max-width: 100%;
}
.story .story-info .story-info-sign .story-info-sign-item:not(:first-child) {
  margin-left: 30px;
}
.story .story-info .story-info-about {
  display: flex;
  line-height: 1;
}
.story .story-info .story-info-photo {
  padding-left: 20px;
  margin-left: 20px;
  border-left: 1px solid #536e86;
}
.story .story-info .story-info-support {
  display: flex;
}
.story .c-share-button__list {
  display: flex;
  flex-wrap: wrap;
}
.story .c-share-button__list .c-share-button__item {
  list-style: none;
  height: 20px;
  overflow: hidden;
  border-radius: 2px;
}
.story .c-share-button__list .c-share-button__item:not(:first-child) {
  margin-left: 9px;
}
.story .c-share-button__list .c-share-button__item.r-facebook-count {
  width: 68px;
  background: #4267b2;
}
.story .c-share-button__list .c-share-button__item.r-facebook-good {
  width: 61px;
  background: #4267b2;
}
.story .c-share-button__list .c-share-button__item.r-twitter {
  width: 75px;
  background: #1a94e0;
}
.story .c-share-button__list .c-share-button__item.r-hatena-bookmark {
  width: 86px;
  background: #01a4dd;
}
.story .story-mv {
  margin-top: 60px;
  position: relative;
}
.story .story-mv img {
  width: 100%;
  height: auto;
}
.story .story-mv.pick::after {
  content: '';
  width: 53px;
  height: 227px;
  background: url(../../assets/images/story/pick.png) no-repeat center;
  background-size: cover;
  position: absolute;
  top: -20px;
  right: 30px;
}
@media screen and (max-width: 767px) {
  .story .story-mv.pick::after {
    width: 40px;
    height: 171px;
    right: 10px;
  }
}
.story .story-heading {
  font-size: 46px;
  line-height: 1.5;
  padding-left: 100px;
  margin-top: 30px;
  font-weight: 400;
  position: relative;
  background-repeat: no-repeat;
  background-position: left 18px;
}
@media screen and (max-width: 767px) {
  .story .story-heading {
    font-size: 24px;
    padding-left: 60px;
    background-position: left 9px;
    background-size: 45px;
  }
}
.story .story-heading.sharp01 {
  background-image: url(../../assets/images/story/sharp01.svg);
}
.story .story-heading.sharp02 {
  background-image: url(../../assets/images/story/sharp02.svg);
}
.story .story-heading.sharp03 {
  background-image: url(../../assets/images/story/sharp03.svg);
}
.story .story-heading.sharp04 {
  background-image: url(../../assets/images/story/sharp04.svg);
}
.story .story-heading.sharp05 {
  background-image: url(../../assets/images/story/sharp05.svg);
}
.story .story-heading.sharp06 {
  background-image: url(../../assets/images/story/sharp06.svg);
}
.story .story-heading.sharp07 {
  background-image: url(../../assets/images/story/sharp07.svg);
}
.story .story-text {
  line-height: 2.2;
  font-size: 16px;
  font-weight: 700;
  margin-top: 30px;
}
@media screen and (max-width: 767px) {
  .story .story-text {
    font-size: 14px;
  }
}
.story .story-img {
  margin-top: 110px;
}
@media screen and (max-width: 767px) {
  .story .story-img {
    margin-top: 50px;
  }
}
.story .story-img img {
  width: 100%;
  height: auto;
}
.story .story-img .story-ima-caption {
  line-height: 1.5;
}
.story .story-article-info {
  margin-top: 80px;
  background: url("../../assets/images/story/line-top.svg") center top,url("../../assets/images/story/line-bottom.svg") center bottom;
  background-repeat: repeat-x;
  background-size: auto 5px;
  padding: 30px 0 0;
}
.story .story-article-info.pt0 {
  padding-top: 0;
}
.story .story-article-info-name {
  display: flex;
  align-items: center;
}
.story .story-article-info-name.mt {
  margin-top: 40px;
}
.story .story-article-info-thumb {
  max-width: 124px;
}
@media screen and (max-width: 767px) {
  .story .story-article-info-thumb {
    width: 80px;
  }
}
.story .story-article-info-thumb img {
  max-width: 100%;
  height: auto;
}
.story .story-article-info-name-txt {
  margin-left: 30px;
}
@media screen and (max-width: 767px) {
  .story .story-article-info-name-txt {
    margin-left: 10px;
    flex: 1;
  }
}
.story .story-article-info-position {
  font-size: 12px;
  letter-spacing: 1px;
}
.story .story-article-info-sign img {
  max-width: 100%;
  height: auto;
}
.story .story-article-info-profile-txt {
  font-weight: 700;
  margin-top: 30px;
  line-height: 1.5;
}
.story .story-article-info-share {
  display: flex;
  align-items: center;
  margin-top: 20px;
  border-top: 1px solid #aedafe;
}
.story .story-article-info-share-label {
  width: 160px;
  height: 60px;
  display: flex;
  align-items: center;
  border-right: 1px solid #aedafe;
}
@media screen and (max-width: 767px) {
  .story .story-article-info-share-label {
    width: 120px;
    height: 80px;
  }
}
.story .story-article-info-share .c-share-button__list {
  margin-left: 22px;
}
@media screen and (max-width: 767px) {
  .story .story-article-info-share .c-share-button__list {
    margin-bottom: -5px;
  }
}
@media screen and (max-width: 767px) {
  .story .story-article-info-share .c-share-button__list .c-share-button__item {
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 767px) {
  .story .story-article-info-share .c-share-button__list .c-share-button__item.r-hatena-bookmark {
    margin-left: 0;
  }
}
.other-stories-large {
  margin-top: 120px;
}
@media screen and (max-width: 767px) {
  .other-stories-large {
    margin-top: 60px;
  }
}
.other-stories-ttl {
  width: 341px;
  margin-bottom: 40px;
}
@media screen and (max-width: 767px) {
  .other-stories-ttl {
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 767px) {
  .other-stories-ttl img {
    width: 70%;
  }
}
.other-stories-img {
  min-height: 0%;
}
.other-stories-img img {
  width: 100%;
  height: auto;
}
.other-stories-content {
  width: 500px;
  max-width: 100%;
  background: #fff;
  padding: 20px 30px 30px;
  margin: -50px auto 0;
  position: relative;
}
@media screen and (max-width: 767px) {
  .other-stories-content {
    width: 94%;
    padding: 10px 10px 15px;
    margin: -30px auto 0;
  }
}
.other-stories-content .story-head {
  color: #222;
  margin-bottom: 10px;
}
.other-stories-content .story-ttl {
  font-size: 24px;
  font-weight: 700;
  margin: 10px 0;
}
.other-stories-content .story-ttl-link {
  color: #133b5d;
  transition: all .2s;
}
.other-stories-content .story-ttl-link:hover {
  opacity: 0.5;
}
.other-stories-content .story-info {
  border-bottom: 0;
  margin: 20px 0 0;
}
.other-stories-content .story-info .story-info-item {
  border-top: 1px dashed #e8e9ec;
}
.other-stories-content .story-info .story-info-talk {
  color: #446079;
  height: 100%;
}
.other-stories-content .story-info .story-info-sentence span {
  font-size: 18px;
}
.other-stories-content .story-info .story-info-sign-item span {
  font-size: 18px;
}
@media screen and (max-width: 767px) {
  .other-stories-content .story-info .story-info-sign-item span {
    font-size: 14px;
  }
}
.other-stories-num {
  position: absolute;
  top: -40px;
  right: -20px;
}
.other-stories-num img {
  width: 100%;
  height: auto;
}
.other-stories-num.vol01 {
  width: 181px;
}
.other-stories-num.vol02 {
  width: 181px;
}
@media screen and (max-width: 767px) {
  .other-stories-num.vol02 {
    width: 160px;
  }
}
.other-stories-num.vol03 {
  width: 181px;
}
@media screen and (max-width: 767px) {
  .other-stories-num.vol03 {
    width: 150px;
  }
}
.other-stories-num.vol04 {
  width: 164px;
}
@media screen and (max-width: 767px) {
  .other-stories-num.vol04 {
    width: 140px;
  }
}
.other-stories-num.vol05 {
  width: 171px;
}
@media screen and (max-width: 767px) {
  .other-stories-num.vol05 {
    width: 140px;
  }
}
.other-stories-num.vol06 {
  width: 172px;
}
@media screen and (max-width: 767px) {
  .other-stories-num.vol06 {
    width: 140px;
  }
}
.other-stories-large .other-stories-content {
  width: 720px;
}
@media screen and (max-width: 767px) {
  .other-stories-large .other-stories-content {
    width: 94%;
  }
}
.other-stories-large .other-stories-content .story-ttl {
  font-size: 30px;
  letter-spacing: 1px;
}
@media screen and (max-width: 767px) {
  .other-stories-large .other-stories-content .story-ttl {
    font-size: 24px;
  }
}
.other-stories-large .story-lead {
  font-size: 14px;
}
.other-stories-large .other-stories-num {
  right: -40px;
}
@media screen and (max-width: 767px) {
  .other-stories-large .other-stories-num {
    right: -15px;
  }
}
.other-stories-list {
  width: 1180px;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  .other-stories-list {
    width: auto;
    margin: 0 10px;
    display: block;
  }
}

.other-stories-list li {
  max-width: 48%;
  width: 560px;
  margin-bottom: 60px;
  list-style: none;
}
@media screen and (max-width: 767px) {
  .other-stories-list li {
    margin-bottom:35px;
    max-width: none;
    width: auto;
  }
}
.readmore {
  display: block;
  transition: all .2s;
}
.readmore:hover {
  opacity: 0.5;
}
@media screen and (max-width: 767px) {
  .readmore {
    width: 60%;
  }
}
.readmore img {
  width: auto;
  max-width: 100%;
  height: auto;
}
.story .feature-btn {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  width: 320px;
  text-align: center;
}
.story .feature-btn.mt { margin-top: 90px; }
@media screen and (max-width: 767px) {
  .story .feature-btn.mt {
    margin-top: 50px;
  }
}
.story .feature-btn.is-scroll-animation-active { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
.story .btn { display: inline-block; padding: 17px 12px 0 0; width: 100%; height: 62px; font-weight: bold; letter-spacing: 0.15em; text-align: center; background-repeat: no-repeat; background-position: 0 0; background-size: 100% 100%; -webkit-transition: opacity .2s linear; transition: opacity .2s linear; position: relative; }
@media screen and (min-width: 768px) { .desktop .story .btn:hover { opacity: 0.5; } }
.story .btn.btn-white { background-image: url(../images/story/btn-white.png); }
.story .btn.btn-white .btn-text {
  color: #fff;
  line-height: 1.5;
}
.story .btn .btn-text { display: inline-block; font-size: 18px; }
.story .btn .btn-text::after { position: absolute; top: calc(50% - -1px); right: 30px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 8px; height: 16px; background-size: 100%; background-repeat: no-repeat; background-position: 0 0; content: ''; }
.story .btn.btn-white .btn-text::after { background-image: url(../images/story/ico-arrow-right-white.png); }

.story .bg-logo {
  position: absolute;
  width: 919px;
  height: 919px;
  background: url(../../assets/images/story/bg-logo.png) no-repeat center;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .story .bg-logo {
    display: none;
  }
}
.story .bg-logo.bg-logo01 {
  top: 14.6%;
  left: -335px;
}
.story .bg-logo.bg-logo02 {
  top: 65.6%;
  right: -65px;
}
.story .story-tasting-comment {
  margin: 60px 0;
}
.story .story-tasting-comment li {
  padding-bottom: 30px;
  border-bottom: 1px solid #fff;
  list-style: none;
}
.story .story-tasting-comment li:not(:last-child) {
  margin-bottom: 30px;
}
.story .story-tasting-comment .story-tasting-comment-num {
  letter-spacing: 2px;
  line-height: 1.5;
}
.story .story-tasting-comment .story-tasting-comment-head {
  font-size: 32px;
  font-weight: 700;
  position: relative;
  padding-left: 40px;
  margin: 10px 0;
  display: inline-block;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .story .story-tasting-comment .story-tasting-comment-head {
    font-size: 22px;
    padding-left: 20px;
  }
}
.story .story-tasting-comment .story-tasting-comment-head::before, .story .story-tasting-comment .story-tasting-comment-head::after {
  content: '';
  position: absolute;
  top: 3px;
  width: 23px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .story .story-tasting-comment .story-tasting-comment-head::before, .story .story-tasting-comment .story-tasting-comment-head::after {
    width: 11px;
    height: 10px;
  }
}
.story .story-tasting-comment .story-tasting-comment-head::before {
  background-image: url(../../assets/images/story/img_quotation_01.svg);
  left: 0;
}
.story .story-tasting-comment .story-tasting-comment-head::after {
  background-image: url(../../assets/images/story/img_quotation_02.svg);
  right: -40px;
}
@media screen and (max-width: 767px) {
  .story .story-tasting-comment .story-tasting-comment-head::after {
    right: -20px;
  }
}
.story .story-tasting-comment .story-tasting-comment-txt {
  padding-left: 40px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
}
.story .story-profile {
  margin: 30px 0;
}
.story .story-profile .story-profile-head {
  display: flex;
}
.story .story-profile .story-profile-head-img {
  width: 124px;
}
@media screen and (max-width: 767px) {
  .story .story-profile .story-profile-head-img {
    width: 24%;
  }
}
.story .story-profile .story-profile-head-img img {
  max-width: 100%;
  height: auto;
}
.story .story-profile .story-profile-name {
  flex: 1;
  margin-left: 30px;
}
@media screen and (max-width: 767px) {
  .story .story-profile .story-profile-name {
    margin-left: 10px;
  }
}
.story .story-profile .story-profile-name-position {
  letter-spacing: 2px;
  line-height: 1.5;
}
.story .story-profile .story-profile-name-txt {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .story .story-profile .story-profile-name-txt {
    font-size: 20px;
  }
}
.story .story-profile .story-profile-message {
  font-weight: 700;
  font-size: 16px;
  line-height: 2.2;
  position: relative;
  padding: 0 40px;
  margin-top: 20px;
}
@media screen and (max-width: 767px) {
  .story .story-profile .story-profile-message {
    padding: 0 20px;
  }
}
.story .story-profile .story-profile-message::before, .story .story-profile .story-profile-message::after {
  content: '';
  position: absolute;
  width: 23px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .story .story-profile .story-profile-message::before, .story .story-profile .story-profile-message::after {
    width: 11px;
    height: 10px;
  }
}
.story .story-profile .story-profile-message::before {
  background-image: url(../../assets/images/story/img_quotation_01.svg);
  top: -5px;
  left: 0;
}
.story .story-profile .story-profile-message::after {
  background-image: url(../../assets/images/story/img_quotation_02.svg);
  right: 0;
  bottom: -5px;
}
.story .story-fb {
  margin: 60px 0;
}
.story .story-fb-head {
  display: flex;
  align-items: center;
}
.story .story-fb-head-img {
  width: 55px;
}
.story .story-fb-head-img img {
  max-width: 100%;
  height: auto;
}
.story .story-fb-head-txt {
  font-size: 28px;
  font-weight: 700;
  margin-left: 15px;
  flex: 1;
}
@media screen and (max-width: 767px) {
  .story .story-fb-head-txt {
    font-size: 20px;
  }
}
.story .story-fb .story-fb-message {
  font-weight: 700;
  font-size: 16px;
  line-height: 2.2;
  position: relative;
  padding: 0 40px;
  margin-top: 40px;
}
@media screen and (max-width: 767px) {
  .story .story-fb .story-fb-message {
    padding: 0 20px;
  }
}
.story .story-fb .story-fb-message::before, .story .story-fb .story-fb-message::after {
  content: '';
  position: absolute;
  width: 23px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .story .story-fb .story-fb-message::before, .story .story-fb .story-fb-message::after {
    width: 11px;
    height: 10px;
  }
}

.story .story-fb .story-fb-message::before {
  background-image: url(../../assets/images/story/img_quotation_01.svg);
  top: -5px;
  left: 0;
}
.story .story-fb .story-fb-message::after {
  background-image: url(../../assets/images/story/img_quotation_02.svg);
  right: 0;
  bottom: -5px;
}
.story .story-tasting-note {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  margin: 60px 0;
  padding: 30px 0;
}
.story .story-tasting-note .story-tasting-note-heading {
  letter-spacing: 2px;
}
.story .story-tasting-note-list {
  margin-top: 10px;
  font-size: 16px;
}
.story .story-tasting-note-list .story-tasting-note-list-wrap {
  display: flex;
}
.story .story-tasting-note-list .story-tasting-note-list-wrap:not(:last-child) {
  margin-bottom: 10px;
}
.story .story-tasting-note-list .story-tasting-note-list-label {
  width: 55px;
}
.story .story-tasting-note-list .story-tasting-note-list-value {
  padding-left: 1em;
  text-indent: -1em;
  flex: 1;
  line-height: 1.5;
}
.story .story-article-info-store .story-article-info-store-img img {
  width: 100%;
  height: auto;
}
.story .story-article-info-store .story-article-info-store-heading {
  font-size: 40px;
  font-weight: 400;
  margin: 30px 0;
  letter-spacing: 2px;
}
@media screen and (max-width: 767px) {
  .story .story-article-info-store .story-article-info-store-heading {
    font-size: 24px;
    margin: 10px 0;
  }
}
.story .story-article-info-store .story-article-info-store-content {
  display: flex;
  justify-content: space-between;
  line-height: 2.2;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  .story .story-article-info-store .story-article-info-store-content {
    display: block;
  }
}
.story .story-article-info-store .story-article-info-store-content > * {
  width: 45%;
}
@media screen and (max-width: 767px) {
  .story .story-article-info-store .story-article-info-store-content > * {
    width: 100%;
  }
}
.story .story-article-info-store .story-article-info-store-box {
  margin-top: 10px;
}
.story .story-article-info-store .story-article-info-store-basicinfo .story-article-info-store-basicinfo-wrap {
  display: flex;
}
.story .story-article-info-store .story-article-info-store-basicinfo .story-article-info-store-basicinfo-label {
  width: 75px;
}
.story .story-article-info-store .story-article-info-store-basicinfo .story-article-info-store-basicinfo-txt {
  flex: 1;
}

/*============
popup
============*/
.popup {
  display: none;
  height: 100vh;
  width: 100%;
  background: rgba(45, 45, 45, 0.7);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
}

.popup.is-active {
  display: block;
}

.popup-close {
  position: absolute;
  display: block;
  background: url(/whisky/ao/assets/images/popup-button.png) no-repeat center center;
  background-size: contain;
  width: 40px;
  height: 40px;
  cursor: pointer;
  top: -20px;
  right: -20px;
}
@media screen and (max-width: 767px){
  .popup-close{
    top: -20px;
    right: 20px;
  }
}

.popup-content {
  width: 800px;
  max-width: 100%;
  padding: 20px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.popup .yt-media { display: block;}

.popup .yt-media-content {
  position: relative;
  padding-top: 56.25%;
}

@media screen and (max-width: 767px) {
  .popup .yt-media-content {
    margin-top: 5px;
  }
}


/* top modal */
.top .modal { visibility: hidden; position: fixed; top: 0; left: 0; right: 0; bottom: 0; -webkit-transform: translate3d(0, 0, 1px); transform: translate3d(0, 0, 1px); -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 9999; overflow-x: hidden; overflow-y: auto; opacity: 0; background-color: rgba(34, 73, 107, 0.8); pointer-events: none; -webkit-overflow-scrolling: touch; -webkit-transition: opacity .3s ease-out, visibility .3s ease-out; transition: opacity .3s ease-out, visibility .3s ease-out; }

.top .modal.is-modal-active { visibility: visible; pointer-events: auto; opacity: 1; }

.top .modal ul { list-style: none; }

.top .modal-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 100px 0; text-align: center; min-height: 100%; }

.top .modal-footer-close { margin-top: 60px; position: relative; color: #fff; font-size: 18px; text-align: center; }

.top .modal-footer-close-text { position: relative; padding-left: 30px; -webkit-transition: opacity .2s linear; transition: opacity .2s linear; }

@media screen and (min-width: 768px) { .desktop .top .modal-footer-close-text:hover { opacity: 0.5; } }

.top .modal-footer-close-icon { display: block; position: absolute; z-index: 1; top: 0; left: 0; width: 30px; height: 30px; }

.top .modal-footer-close-icon:before, .top .modal-footer-close-icon:after { content: ''; display: block; position: absolute; top: 50%; left: 50%; width: 22px; height: 1px; background-color: #fff; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; }

.top .modal-footer-close-icon:before { -webkit-transform: translate(-50%, -50%) rotate(45deg); -ms-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); }

.top .modal-footer-close-icon:after { -webkit-transform: translate(-50%, -50%) rotate(-45deg); -ms-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); }

.top .modal-close-wrap { position: relative; }

.top .modal-close { display: block; position: absolute; z-index: 1; top: 60px; right: 0; width: 30px; height: 30px; }

@media screen and (max-width: 960px) { .top .modal-close { top: -35px; } }

@media screen and (max-width: 767px) { .top .modal-close { top: -35px; } }

.top .modal-close:before, .top .modal-close:after { content: ''; display: block; position: absolute; top: 50%; left: 50%; width: 30px; height: 1px; background-color: #fff; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; }

.top .modal-close:before { -webkit-transform: translate(-50%, -50%) rotate(45deg); -ms-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); }

.top .modal-close:after { -webkit-transform: translate(-50%, -50%) rotate(-45deg); -ms-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); }

.top .modal-slick { padding: 100px 0; min-height: 100%; width: 58.66667vw; }

@media screen and (max-width: 960px) { .top .modal-slick { width: calc(100vw - 40px); padding: 5px; background-image: none; }
  .units-polyfill .top .modal-slick { width: calc(100vw - 40px); } }

.top .modal-slick .slick-dots { position: absolute; bottom: 50px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }

.top .modal-slick .slick-dots li { height: 10px; width: 10px; margin: 3px; }

.top .modal-slick .slick-dots li button:before { font-size: 34px; color: #aea46f; }

.top .modal-slick .slick-arrow { opacity: 1; -webkit-transition: opacity 0.35s ease-in-out 0s; transition: opacity 0.35s ease-in-out 0s; }

.top .modal-slick .slick-arrow.slick-disabled { opacity: 0; display: none !important; }

.top .modal-slick .slick-prev, .top .modal-slick .slick-next { display: block; cursor: pointer; position: absolute; top: calc(50% - 32px); -webkit-transform: scale(0.5) translateY(-50%); -ms-transform: scale(0.5) translateY(-50%); transform: scale(0.5) translateY(-50%); z-index: 2; width: 80px; height: 128px; outline: none; }

@media screen and (max-width: 960px) { .top .modal-slick .slick-prev, .top .modal-slick .slick-next { -webkit-transform: scale(0.25) translateY(-100%); -ms-transform: scale(0.25) translateY(-100%); transform: scale(0.25) translateY(-100%); } }

@media screen and (max-width: 767px) { .top .modal-slick .slick-prev, .top .modal-slick .slick-next { -webkit-transform: scale(0.25) translateY(-50%); -ms-transform: scale(0.25) translateY(-50%); transform: scale(0.25) translateY(-50%); } }

.top .modal-slick .slick-prev:before, .top .modal-slick .slick-next:before { display: none; }

.top .modal-slick .slick-prev img, .top .modal-slick .slick-next img { max-width: 100%; }

.top .modal-slick .slick-prev { left: -70px; }

@media screen and (max-width: 960px) { .top .modal-slick .slick-prev { left: -46px; } }

.top .modal-slick .slick-next { right: -70px; }

@media screen and (max-width: 960px) { .top .modal-slick .slick-next { right: -46px; } }

.top .modal-slick-cont { position: relative; width: 58.66667vw; padding: 10px; overflow: hidden; background-color: #000; background-image: url(../images/enjoy/bg-logo.png); background-repeat: no-repeat; background-position: 120% center; background-size: 39.6vw auto; color: #fff; }

@media screen and (max-width: 960px) { .top .modal-slick-cont { width: calc(100% - 40px); padding: 5px; background-image: none; }
  .units-polyfill .top .modal-slick-cont { width: calc(100% - 40px); } }

.top .modal-slick-item { position: relative; }

.top .modal-slick-item:before, .top .modal-slick-item:after { content: ''; display: block; position: absolute; top: 0; z-index: 1; width: 1px; height: 100%; background: url(../images/enjoy/line-repeat-thick-white-v.png) repeat-y 0 0; }

.top .modal-slick-item:before { left: 0; }

.top .modal-slick-item:after { right: 0; }

.top .modal-slick-item-inner.modal-slick-item-inner--horizontal { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; }

@media screen and (max-width: 960px) { .top .modal-slick-item-inner.modal-slick-item-inner--horizontal { display: block; } }

.top .modal-slick-item-inner:before, .top .modal-slick-item-inner:after { content: ''; display: block; position: absolute; left: 0; z-index: 1; width: 100%; height: 1px; background: url(../images/enjoy/line-repeat-thick-white-h.png) repeat-x 0 0; }

.top .modal-slick-item-inner:before { top: 0; }

.top .modal-slick-item-inner:after { bottom: 0; }

.top .modal-slick-item-img { position: relative; overflow: hidden; }

.top .modal-slick-item-img img { position: relative; width: 100%; height: auto; }

.top .modal-slick-item-img.modal-slick-item-img--1 { height: 34vw; width: 58.66667vw; top: -10px; left: -10px; }

@media screen and (max-width: 960px) { .top .modal-slick-item-img.modal-slick-item-img--1 { top: -5px; left: -5px; height: auto; width: calc(100% + 10px); margin: -5px -5px 0 -5px; }
  .units-polyfill .top .modal-slick-item-img.modal-slick-item-img--1 { height: auto; width: calc(100% + 10px); } }

.top .modal-slick-item-img.modal-slick-item-img--2 { height: 34vw; width: 58.66667vw; top: -10px; left: -10px; }

@media screen and (max-width: 960px) { .top .modal-slick-item-img.modal-slick-item-img--2 { top: -5px; left: -5px; height: auto; width: calc(100% + 10px); }
  .units-polyfill .top .modal-slick-item-img.modal-slick-item-img--2 { height: auto; width: calc(100% + 10px); } }

.top .modal-slick-item-img.modal-slick-item-img--3 { height: 38.66667vw; width: 58.66667vw; top: -10px; left: -10px; }

@media screen and (max-width: 960px) { .top .modal-slick-item-img.modal-slick-item-img--3 { top: -5px; left: -5px; height: auto; width: calc(100% + 10px); }
  .units-polyfill .top .modal-slick-item-img.modal-slick-item-img--3 { height: auto; width: calc(100% + 10px); } }

.top .modal-slick-item-img.modal-slick-item-img--4 { height: 23.33333vw; width: 30vw; margin: -12px 0 -8px -12px; padding: 12px; }

@media screen and (max-width: 960px) { .top .modal-slick-item-img.modal-slick-item-img--4 { top: -5px; left: -5px; margin: auto; padding: 0; height: auto; width: calc(100% + 10px); }
  .units-polyfill .top .modal-slick-item-img.modal-slick-item-img--4 { height: auto; width: calc(100% + 10px); } }

.top .modal-slick-item-cont { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 33px 30px; }

@media screen and (max-width: 960px) { .top .modal-slick-item-cont { padding: 0 6.45833vw 0 2.8125vw; }
  .units-polyfill .top .modal-slick-item-cont { padding: 0 6.45833vw 0 2.8125vw; } }

@media screen and (max-width: 767px) { .top .modal-slick-item-cont { width: 100%; padding: 20px 15px 25px; } }

.top .modal-slick-item-cont.modal-slick-item-cont--horizontal { padding: 20px 27px; }

.top .modal-slick-item-cont.modal-slick-item-cont--horizontal .modal-slick-item-read { margin-top: 14px; letter-spacing: 0.05em; }

.top .modal-slick-item-ttl { font-size: 24px; font-weight: bold; letter-spacing: 0.1em; }

@media screen and (max-width: 1279px) { .top .modal-slick-item-ttl { font-size: 22px; } }

@media screen and (max-width: 960px) { .top .modal-slick-item-ttl { font-size: 24px; } }

@media screen and (max-width: 767px) { .top .modal-slick-item-ttl { text-align: center; } }

.top .modal-slick-item-read { margin-top: 28px; font-size: 16px; letter-spacing: 0.15em; line-height: 2; text-align: left; }

@media screen and (max-width: 1279px) { .top .modal-slick-item-read { font-size: 14px; } }

@media screen and (max-width: 767px) { .top .modal-slick-item-read { margin-bottom: 15px; font-size: 12px; line-height: 1.8; letter-spacing: 0.1em; } }

.top .modal-slick-item-btn { margin-top: 28px; text-align: center; }

@media screen and (max-width: 767px) { .top .modal-slick-item-btn { text-align: center; } }

.top .modal-slick-item-btn .btn { width: 16.66667vw; }

@media screen and (max-width: 960px) { .top .modal-slick-item-btn .btn { width: 250px; }
  .units-polyfill .top .modal-slick-item-btn .btn { width: 250px; } }

@media screen and (max-width: 767px) { .top .modal-slick-item-btn .btn { width: 250px; }
  .units-polyfill .top .modal-slick-item-btn .btn { width: 250px; } }

@media screen and (max-width: 374px) { .top .modal-slick-item-btn .btn { width: 66.84492vw; }
  .units-polyfill .top .modal-slick-item-btn .btn { width: 66.84492vw; } }

.top .btn { display: inline-block; padding: 17px 12px 0 0; width: 250px; height: 62px; font-weight: bold; letter-spacing: 0.15em; text-align: center; background-repeat: no-repeat; background-position: 0 0; background-size: 100% 100%; -webkit-transition: opacity .2s linear; transition: opacity .2s linear; }

@media screen and (max-width: 767px) { .top .btn { padding: 12px 10px 0 0; height: 45px; } }

.top .btn.btn-white { background-image: url(../images/story/btn-white.png); }

@media screen and (max-width: 767px) { .top .btn.btn-white.btn-white--large { width: 100%; }
  .units-polyfill .top .btn.btn-white.btn-white--large { width: 100%; } }

.top .btn.btn-white .btn-text { color: #fff; }

.top .btn.btn-white .btn-text::after { background-image: url(../images/story/ico-arrow-right-white.png); }