@charset "UTF-8";
/*--------------------------------------------------------------*/
/*! normalize.scss v0.1.0 | MIT License | based on git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *		user zoom.
 */
/**
 * Remove default margin.
 */
/* HTML5 display definitions
	 @mixin ========================================================================= */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
#suntory_contents article,
#suntory_contents aside,
#suntory_contents details,
#suntory_contents figcaption,
#suntory_contents figure,
#suntory_contents footer,
#suntory_contents header,
#suntory_contents hgroup,
#suntory_contents main,
#suntory_contents menu,
#suntory_contents nav,
#suntory_contents section,
#suntory_contents summary {
  display: block; }

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
#suntory_contents audio,
#suntory_contents canvas,
#suntory_contents progress,
#suntory_contents video {
  display: inline-block;
  vertical-align: baseline; }

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
#suntory_contents audio:not([controls]) {
  display: none;
  height: 0; }

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
 */
#suntory_contents [hidden],
#suntory_contents template {
  display: none; }

/* Links
	 @mixin ========================================================================= */
/**
 * Remove the gray background color from active links in IE 10.
 */
#suntory_contents a {
  background-color: transparent; }

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
#suntory_contents a:active,
#suntory_contents a:hover {
  outline: 0; }

/* Text-level semantics
	 @mixin ========================================================================= */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
#suntory_contents abbr[title] {
  border-bottom: 1px dotted; }

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
#suntory_contents b,
#suntory_contents strong {
  font-weight: bold; }

/**
 * Address styling not present in Safari and Chrome.
 */
#suntory_contents dfn {
  font-style: italic; }

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
#suntory_contents h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/**
 * Address styling not present in IE 8/9.
 */
#suntory_contents mark {
  background: #ff0;
  color: #000; }

/**
 * Address inconsistent and variable font size in all browsers.
 */
#suntory_contents small {
  font-size: 80%; }

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
#suntory_contents sub,
#suntory_contents sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

#suntory_contents sup {
  top: -0.5em; }

#suntory_contents sub {
  bottom: -0.25em; }

/* Embedded content
	 @mixin ========================================================================= */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
#suntory_contents img {
  border: 0; }

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
#suntory_contents svg:not(:root) {
  overflow: hidden; }

/* Grouping content
	 @mixin ========================================================================= */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
#suntory_contents figure {
  margin: 1em 40px; }

/**
 * Address differences between Firefox and other browsers.
 */
#suntory_contents hr {
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  height: 0; }

/**
 * Contain overflow in all browsers.
 */
#suntory_contents pre {
  overflow: auto; }

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
#suntory_contents code,
#suntory_contents kbd,
#suntory_contents pre,
#suntory_contents samp {
  font-family: monospace, monospace;
  font-size: 1em; }

/* Forms
	 @mixin ========================================================================= */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *		Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
#suntory_contents button,
#suntory_contents input,
#suntory_contents optgroup,
#suntory_contents select,
#suntory_contents textarea {
  color: inherit;
  font: inherit;
  margin: 0; }

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
#suntory_contents button {
  overflow: visible; }

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
#suntory_contents button,
#suntory_contents select {
  text-transform: none; }

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *		and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *		`input` and others.
 */
#suntory_contents input[type="reset"],
#suntory_contents input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer; }

/**
 * Re-set default cursor for disabled elements.
 */
#suntory_contents button[disabled],
#suntory_contents html input[disabled] {
  cursor: default; }

/**
 * Remove inner padding and border in Firefox 4+.
 */
#suntory_contents button::-moz-focus-inner,
#suntory_contents input::-moz-focus-inner {
  border: 0;
  padding: 0; }

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
#suntory_contents input {
  line-height: normal; }

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
#suntory_contents input[type="checkbox"],
#suntory_contents input[type="radio"] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0; }

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
#suntory_contents input[type="number"]::-webkit-inner-spin-button,
#suntory_contents input[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
 *		(include `-moz` to future-proof).
 */
#suntory_contents input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box; }

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
#suntory_contents input[type="search"]::-webkit-search-cancel-button,
#suntory_contents input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * Define consistent border, margin, and padding.
 */
#suntory_contents fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
#suntory_contents legend {
  border: 0;
  padding: 0; }

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
#suntory_contents textarea {
  overflow: auto; }

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
#suntory_contents optgroup {
  font-weight: bold; }

/* Tables
	 @mixin ========================================================================= */
/**
 * Remove most spacing between table cells.
 */
#suntory_contents table {
  border-collapse: collapse;
  border-spacing: 0; }

#suntory_contents td,
#suntory_contents th {
  padding: 0; }

/* ---------------------------------------------------------------- */
/* initialize styles */
/* ---------------------------------------------------------------- */
#suntory_contents .color-initial {
  color: #fff; }

#suntory_contents .color-primary {
  color: #1f2c5f; }

#suntory_contents .color-secondary {
  color: #003d7f; }

#suntory_contents .color-tertiary {
  color: #af8a46; }

#suntory_contents .color-quaternary {
  color: #4c4c4c; }

#suntory_contents .bg-initial {
  background-color: #fff; }

#suntory_contents .bg-primary {
  background-color: #1f2c5f; }

#suntory_contents .bg-secondary {
  background-color: #003d7f; }

#suntory_contents .bg-tertiary {
  background-color: #af8a46; }

#suntory_contents .bg-quaternary {
  background-color: #4c4c4c; }

html {
  margin: 0;
  overflow-x: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

body {
  margin: 0;
  overflow-x: hidden; }

@media print {
  html,
  body {
    width: 1024px;
    -webkit-print-color-adjust: exact; } }

@media screen and (max-width: 48em) {
  body {
    font-size: 4vw; } }

@media screen and (orientation: portrait) {
  body {
    background-position-y: top; } }

#suntory_contents img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
  -ms-interpolation-mode: bicubic; }

#suntory_contents a {
  color: #003d7f; }
  @media screen and (min-width: 48em) {
    #suntory_contents a:focus, #suntory_contents a:hover {
      text-decoration: underline; } }

#suntory_contents ol,
#suntory_contents ul {
  list-style: none;
  margin-top: 0;
  padding-left: 0; }
  #suntory_contents ol ol,
  #suntory_contents ol ul,
  #suntory_contents ul ol,
  #suntory_contents ul ul {
    font-size: 90%;
    margin: .5em 0 .5em 1em; }

#suntory_contents ol.list {
  padding-left: 1.5em;
  counter-reset: number; }
  #suntory_contents ol.list li {
    text-indent: -1.5em; }
    #suntory_contents ol.list li::before {
      counter-increment: number;
      content: counter(number);
      display: inline-block;
      width: 2em;
      height: 2em;
      margin-right: 1em;
      border-radius: 50%;
      background-color: #003d7f;
      text-indent: 0;
      text-align: center;
      font-weight: 700;
      font-family: "urw-din-condensed", sans-serif;
      font-size: .5em;
      line-height: 2;
      color: #fff;
      -webkit-transform: translateY(-0.333em);
      -ms-transform: translateY(-0.333em);
      transform: translateY(-0.333em); }

#suntory_contents ul.list {
  padding-left: 1em; }
  #suntory_contents ul.list li {
    text-indent: -1em; }
    #suntory_contents ul.list li::before {
      content: "";
      display: inline-block;
      width: .5em;
      height: .5em;
      margin-right: .5em;
      border-radius: 50%;
      background-color: #003d7f;
      -webkit-transform: translateY(-0.1em);
      -ms-transform: translateY(-0.1em);
      transform: translateY(-0.1em); }
    #suntory_contents ul.list li ul li::before {
      width: .25em;
      height: .25em;
      -webkit-transform: translateY(-0.25em);
      -ms-transform: translateY(-0.25em);
      transform: translateY(-0.25em); }

#suntory_contents .button,
#suntory_contents button,
#suntory_contents dd,
#suntory_contents dt,
#suntory_contents li {
  margin-bottom: .5em; }

#suntory_contents fieldset,
#suntory_contents input,
#suntory_contents select,
#suntory_contents textarea {
  margin-bottom: 1em; }

#suntory_contents blockquote,
#suntory_contents dl,
#suntory_contents figure,
#suntory_contents form,
#suntory_contents ol,
#suntory_contents p,
#suntory_contents pre,
#suntory_contents table,
#suntory_contents ul {
  margin-bottom: 1.5em; }

#suntory_contents b,
#suntory_contents strong {
  font-weight: 700; }

#suntory_contents em {
  font-style: normal;
  color: #003d7f; }

#suntory_contents address {
  font-style: normal; }

#suntory_contents p {
  margin-top: 0; }

#suntory_contents h1,
#suntory_contents h2,
#suntory_contents h3,
#suntory_contents h4,
#suntory_contents h5,
#suntory_contents h6 {
  font-weight: 300;
  margin-bottom: 1em;
  margin-top: 0; }

#suntory_contents h1 {
  font-size: 1.75em;
  line-height: 1.2; }

#suntory_contents h2 {
  font-size: 1.5em;
  line-height: 1.2; }

#suntory_contents h3 {
  font-size: 1.375em;
  line-height: 1.3; }

#suntory_contents h4 {
  font-size: 1.25em;
  line-height: 1.4; }

#suntory_contents h5 {
  font-size: 1.125em;
  line-height: 1.5; }

#suntory_contents h6 {
  font-size: 1em;
  line-height: 1.6; }

@media screen and (min-width: 48em) {
  #suntory_contents .pc-br {
    display: inline; }
  #suntory_contents .sp-br {
    display: none; } }

@media screen and (max-width: 48em) {
  #suntory_contents .pc-br {
    display: none; }
  #suntory_contents .sp-br {
    display: inline; } }

/* ---------------------------------------------------------------- */
/* elements */
/* ---------------------------------------------------------------- */
/* double-border */
#suntory_contents .double-border {
  display: block;
  position: relative;
  padding: 1em 0; }
  #suntory_contents .double-border::before, #suntory_contents .double-border::after {
    content: "";
    display: inline-block;
    position: absolute;
    left: 0;
    width: 100%;
    height: .25em; }
  #suntory_contents .double-border::before {
    top: 0;
    border-top: 0.25em solid #af8a46;
    border-bottom: 1px solid #af8a46; }
  #suntory_contents .double-border::after {
    bottom: 0;
    border-top: 1px solid #af8a46;
    border-bottom: 0.25em solid #af8a46; }

/* bottle-image */
#suntory_contents .bottle-image {
  max-width: 10em; }

/* box */
#suntory_contents .box {
  padding: 1.5em;
  background-color: #f7f6ef;
  border: 1px solid #d7d0ae;
  margin-bottom: 1.5em; }

/* break */
@media screen and (min-width: 48em) {
  #suntory_contents .pc-br {
    display: inline; }
  #suntory_contents .sp-br {
    display: none; } }

@media screen and (max-width: 48em) {
  #suntory_contents .pc-br {
    display: none; }
  #suntory_contents .sp-br {
    display: inline; } }

/* button */
#suntory_contents .button {
  display: inline-block;
  position: relative;
  padding: .55em 2em .45em;
  background: -webkit-gradient(linear, left top, right top, from(#dedede), color-stop(20%, #f8f8f8), color-stop(80%, #f8f8f8), to(#dedede));
  background: -webkit-linear-gradient(left, #dedede 0%, #f8f8f8 20%, #f8f8f8 80%, #dedede 100%);
  background: -o-linear-gradient(left, #dedede 0%, #f8f8f8 20%, #f8f8f8 80%, #dedede 100%);
  background: linear-gradient(to right, #dedede 0%, #f8f8f8 20%, #f8f8f8 80%, #dedede 100%);
  border: 1px solid #fff;
  -webkit-box-shadow: 1px 1px 0 0 rgba(0, 0, 0, 0.1);
  box-shadow: 1px 1px 0 0 rgba(0, 0, 0, 0.1);
  text-decoration: none; }
  #suntory_contents .button .text {
    opacity: .666; }

/* button: hover */
#suntory_contents.isnt-touch .button:hover {
  background: -webkit-gradient(linear, left top, right top, from(#f8f8f8), color-stop(20%, white), color-stop(80%, white), to(#f8f8f8));
  background: -webkit-linear-gradient(left, #f8f8f8 0%, white 20%, white 80%, #f8f8f8 100%);
  background: -o-linear-gradient(left, #f8f8f8 0%, white 20%, white 80%, #f8f8f8 100%);
  background: linear-gradient(to right, #f8f8f8 0%, white 20%, white 80%, #f8f8f8 100%);
  color: #1f2c5f; }
  #suntory_contents.isnt-touch .button:hover .text {
    opacity: 1; }

/* ec-button */
#suntory_contents .ec-button {
  width: 13.125em;
  height: 2.5em; }

/* ec-button: hover */
#suntory_contents.isnt-touch .ec-button img[alt="ご購入はこちら"]:hover {
  opacity: .5; }

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

/* icon */
#suntory_contents .icon {
  display: inline-block; }
  #suntory_contents .icon::before {
    content: "";
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: middle;
    margin-top: -0.2em;
    margin-right: 0.5em;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%; }

/* icon: image */
#suntory_contents .icon.arrow::before {
  background-image: url(../images/common/ico_arrow_01.svg);
  background-position: left center;
  background-size: .75em; }

/* page-top */
#suntory_contents .page-top {
  text-decoration: none;
  font-size: .875em;
  color: #4c4c4c; }
  #suntory_contents .page-top img {
    max-width: 1em;
    margin-right: 1em;
    vertical-align: middle; }
  @media screen and (min-width: 48em) {
    #suntory_contents .page-top:focus, #suntory_contents .page-top:hover {
      text-decoration: underline; } }

/* ---------------------------------------------------------------- */
/* content-navi */
/* ---------------------------------------------------------------- */
/* content-navi: common */
#suntory_contents .content-navi {
  position: relative; }
  #suntory_contents .content-navi .navi-item {
    position: relative;
    overflow: hidden;
    text-align: center; }
    #suntory_contents .content-navi .navi-item::before {
      content: "";
      display: inline-block;
      position: absolute;
      top: 0;
      left: 0; }

/* content-navi: pc */
@media screen and (min-width: 48em) {
  #suntory_contents .content-navi {
    width: 60em;
    margin: 0 auto 1em;
    background-color: #fff; }
    #suntory_contents .content-navi.fixed {
      position: fixed;
      top: 0;
      left: calc(50% - 30em);
      z-index: 10; }
    #suntory_contents .content-navi::before {
      content: "";
      display: inline-block;
      position: absolute;
      top: 100%;
      left: 0;
      width: 100%;
      height: 0;
      border-top: .5em solid #005696;
      border-bottom: .5em solid #e3c838; }
    #suntory_contents .content-navi .navi {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      margin-bottom: 0; }
    #suntory_contents .content-navi .navi-item {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      width: 10.75em;
      height: 3.75em;
      margin: .5em 0; }
      #suntory_contents .content-navi .navi-item::before {
        width: 1px;
        height: 100%;
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #1a2874), color-stop(33.333%, #1a2874), to(#201e3a));
        background: -webkit-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
        background: -o-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
        background: linear-gradient(to bottom, #1a2874 0, #1a2874 33.333%, #201e3a 100%); }
      #suntory_contents .content-navi .navi-item:focus, #suntory_contents .content-navi .navi-item:hover {
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #efefef), color-stop(33.333%, #fff), color-stop(66.666%, #fff), to(#efefef));
        background: -webkit-linear-gradient(top, #efefef 0, #fff 33.333%, #fff 66.666%, #efefef 100%);
        background: -o-linear-gradient(top, #efefef 0, #fff 33.333%, #fff 66.666%, #efefef 100%);
        background: linear-gradient(to bottom, #efefef 0, #fff 33.333%, #fff 66.666%, #efefef 100%); }
      #suntory_contents .content-navi .navi-item.logo {
        width: 6.25em; }
        #suntory_contents .content-navi .navi-item.logo img {
          max-width: 4.666em;
          margin: .125em 0; }
        #suntory_contents .content-navi .navi-item.logo::before {
          content: none; }
      #suntory_contents .content-navi .navi-item a {
        width: 100%;
        font-size: .75em;
        line-height: 1.2; }
      #suntory_contents .content-navi .navi-item .ja {
        display: inline-block; }
      #suntory_contents .content-navi .navi-item .en {
        display: inline-block;
        font-size: 10px;
        white-space: nowrap;
        -webkit-transform: scale(0.8);
        -ms-transform: scale(0.8);
        transform: scale(0.8); }
      #suntory_contents .content-navi .navi-item.dbr .ja {
        letter-spacing: -.1em; } }

/* content-navi: sp */
@media screen and (max-width: 48em) {
  #suntory_contents .content-navi .navi {
    position: absolute;
    top: 0;
    left: 100%;
    z-index: 10;
    width: 100%;
    height: 100vh;
    padding: 1.5em 0;
    background-color: rgba(255, 255, 255, 0.96);
    -webkit-transition: left .2s ease-out;
    -o-transition: left .2s ease-out;
    transition: left .2s ease-out; }
    #suntory_contents .content-navi .navi.open {
      left: 0; }
  #suntory_contents .content-navi .navi-item {
    max-height: 4.6875em;
    margin: 0 auto;
    text-align: center; }
    #suntory_contents .content-navi .navi-item img {
      max-width: 12.5em; }
    #suntory_contents .content-navi .navi-item::before {
      width: 100%;
      height: 1px;
      background-color: #1a2874; }
  #suntory_contents .content-navi .logo {
    max-height: inherit;
    margin-bottom: .5em;
    text-align: center; }
    #suntory_contents .content-navi .logo img {
      max-width: 7.5em; }
  #suntory_contents .content-navi .logo::before,
  #suntory_contents .content-navi .dbr::before {
    content: none; }
  #suntory_contents .content-navi.fixed .navi {
    position: fixed; }
  #suntory_contents .content-navi a {
    display: inline-block;
    text-decoration: none;
    padding: 1em 0;
    line-height: 1.2; }
  #suntory_contents .content-navi .ja br {
    display: none; }
  #suntory_contents .content-navi .en {
    font-size: .625em; }
    #suntory_contents .content-navi .en br {
      display: none; } }

/* navi-trigger */
#suntory_contents .navi-trigger {
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 11;
  width: 4em;
  height: 4em;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #1a2874), color-stop(33.333%, #1a2874), to(#201e3a));
  background: -webkit-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
  background: -o-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
  background: linear-gradient(to bottom, #1a2874 0, #1a2874 33.333%, #201e3a 100%); }
  #suntory_contents .navi-trigger .line {
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 33.333%;
    width: 33.333%;
    height: 2px;
    margin-top: -1px;
    background-color: #fff;
    -webkit-transform: translateY(-0.25em) rotate(0);
    -ms-transform: translateY(-0.25em) rotate(0);
    transform: translateY(-0.25em) rotate(0);
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transition-duration: .2s;
    -o-transition-duration: .2s;
    transition-duration: .2s;
    -webkit-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out; }
    #suntory_contents .navi-trigger .line + .line {
      -webkit-transform: translateY(0.25em) rotate(0);
      -ms-transform: translateY(0.25em) rotate(0);
      transform: translateY(0.25em) rotate(0); }
  #suntory_contents .navi-trigger.close .line {
    -webkit-transform: translateY(0) rotate(-135deg);
    -ms-transform: translateY(0) rotate(-135deg);
    transform: translateY(0) rotate(-135deg); }
    #suntory_contents .navi-trigger.close .line + .line {
      -webkit-transform: translateY(0) rotate(135deg);
      -ms-transform: translateY(0) rotate(135deg);
      transform: translateY(0) rotate(135deg); }
  @media screen and (min-width: 48em) {
    #suntory_contents .navi-trigger {
      display: none; } }
  @media screen and (max-width: 48em) {
    #suntory_contents .navi-trigger {
      display: block; } }

@media screen and (max-width: 48em) {
  #suntory_contents .content-navi.fixed .navi-trigger {
    position: fixed; } }

/* current */
#suntory_contents.dbr-content .content-navi .navi-item.dbr {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #1a2874), color-stop(33.333%, #1a2874), to(#201e3a));
  background: -webkit-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
  background: -o-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
  background: linear-gradient(to bottom, #1a2874 0, #1a2874 33.333%, #201e3a 100%); }
  #suntory_contents.dbr-content .content-navi .navi-item.dbr a {
    color: #fff; }

#suntory_contents.bordeaux-content .content-navi .navi-item.bordeaux {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #1a2874), color-stop(33.333%, #1a2874), to(#201e3a));
  background: -webkit-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
  background: -o-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
  background: linear-gradient(to bottom, #1a2874 0, #1a2874 33.333%, #201e3a 100%); }
  #suntory_contents.bordeaux-content .content-navi .navi-item.bordeaux a {
    color: #fff; }

#suntory_contents.aussieres-content .content-navi .navi-item.aussieres {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #1a2874), color-stop(33.333%, #1a2874), to(#201e3a));
  background: -webkit-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
  background: -o-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
  background: linear-gradient(to bottom, #1a2874 0, #1a2874 33.333%, #201e3a 100%); }
  #suntory_contents.aussieres-content .content-navi .navi-item.aussieres a {
    color: #fff; }

#suntory_contents.losvascos-content .content-navi .navi-item.losvascos {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #1a2874), color-stop(33.333%, #1a2874), to(#201e3a));
  background: -webkit-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
  background: -o-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
  background: linear-gradient(to bottom, #1a2874 0, #1a2874 33.333%, #201e3a 100%); }
  #suntory_contents.losvascos-content .content-navi .navi-item.losvascos a {
    color: #fff; }

#suntory_contents.caro-content .content-navi .navi-item.caro {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #1a2874), color-stop(33.333%, #1a2874), to(#201e3a));
  background: -webkit-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
  background: -o-linear-gradient(top, #1a2874 0, #1a2874 33.333%, #201e3a 100%);
  background: linear-gradient(to bottom, #1a2874 0, #1a2874 33.333%, #201e3a 100%); }
  #suntory_contents.caro-content .content-navi .navi-item.caro a {
    color: #fff; }

/* ---------------------------------------------------------------- */
/* page-navi */
/* ---------------------------------------------------------------- */
#suntory_contents .page-navi .navi {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 0;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #201e3a), color-stop(66.666%, #1a2874));
  background: -webkit-linear-gradient(top, #201e3a 0, #1a2874 66.666%);
  background: -o-linear-gradient(top, #201e3a 0, #1a2874 66.666%);
  background: linear-gradient(to bottom, #201e3a 0, #1a2874 66.666%); }

#suntory_contents .page-navi .navi-item {
  margin-bottom: 0; }
  #suntory_contents .page-navi .navi-item .ja {
    display: inline-block; }
  #suntory_contents .page-navi .navi-item .en {
    display: inline-block;
    font-size: 66.666%; }
  #suntory_contents .page-navi .navi-item a {
    display: inline-block;
    width: 100%;
    text-decoration: none;
    color: #fff; }

@media screen and (min-width: 48em) {
  #suntory_contents .page-navi a:hover {
    opacity: .5; } }

@media screen and (max-width: 48em) {
  #suntory_contents .page-navi {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 9;
    width: 100%; }
    #suntory_contents .page-navi .navi-item {
      font-size: .875em;
      line-height: 1.4; } }

#suntory_contents.brand-content .page-navi .navi {
  padding: .5em 0; }

#suntory_contents.brand-content .page-navi .navi-item {
  position: relative;
  width: 25%;
  text-align: center; }
  #suntory_contents.brand-content .page-navi .navi-item a {
    padding: .5em 0; }
  #suntory_contents.brand-content .page-navi .navi-item + .navi-item::before {
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.25); }

@media screen and (min-width: 48em) {
  #suntory_contents.brand-content .page-navi {
    height: 3em; }
    #suntory_contents.brand-content .page-navi .navi-item {
      line-height: 1; }
      #suntory_contents.brand-content .page-navi .navi-item br {
        display: none; }
      #suntory_contents.brand-content .page-navi .navi-item .en {
        margin-left: 1em; }
    #suntory_contents.brand-content .page-navi.fixed .navi {
      position: fixed;
      top: 5.75em;
      left: calc(50% - 30em);
      z-index: 10;
      width: 60em; } }

@media screen and (min-width: 48em) {
  #suntory_contents.about-content .page-navi {
    position: relative; }
    #suntory_contents.about-content .page-navi .navi {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      position: absolute;
      top: 0;
      left: 2em;
      z-index: 9;
      width: 10em;
      height: 30em; }
    #suntory_contents.about-content .page-navi .navi-item {
      width: 7em;
      margin: 0 auto;
      line-height: 1.2;
      border-bottom: 1px solid rgba(255, 255, 255, 0.25); }
      #suntory_contents.about-content .page-navi .navi-item a {
        padding: .5em 0; }
    #suntory_contents.about-content .page-navi .logo {
      padding: 2em 0;
      text-align: center; }
      #suntory_contents.about-content .page-navi .logo img {
        max-width: 6em; }
    #suntory_contents.about-content .page-navi.fixed .navi {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      position: fixed;
      top: 5.75em;
      left: calc(50% - 30em);
      z-index: 10;
      width: 60em;
      height: inherit;
      padding: .5em 0; }
      #suntory_contents.about-content .page-navi.fixed .navi .navi-item {
        position: relative;
        width: 25%;
        text-align: center;
        line-height: 1;
        border-bottom: 0; }
        #suntory_contents.about-content .page-navi.fixed .navi .navi-item a {
          padding: .5em 0; }
        #suntory_contents.about-content .page-navi.fixed .navi .navi-item br {
          display: none; }
        #suntory_contents.about-content .page-navi.fixed .navi .navi-item .en {
          margin-left: 1em; }
        #suntory_contents.about-content .page-navi.fixed .navi .navi-item + .navi-item::before {
          content: "";
          display: inline-block;
          position: absolute;
          top: 0;
          left: 0;
          width: 1px;
          height: 100%;
          background-color: rgba(255, 255, 255, 0.25); }
    #suntory_contents.about-content .page-navi.fixed .logo {
      display: none; } }

@media screen and (max-width: 48em) {
  #suntory_contents.about-content .page-navi .navi {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    height: inherit;
    padding: .5em 0; }
    #suntory_contents.about-content .page-navi .navi .navi-item {
      position: relative;
      width: 25%;
      text-align: center; }
      #suntory_contents.about-content .page-navi .navi .navi-item + .navi-item::before {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
        left: 0;
        width: 1px;
        height: 100%;
        background-color: rgba(255, 255, 255, 0.25); }
      #suntory_contents.about-content .page-navi .navi .navi-item.brand::before {
        content: none; }
      #suntory_contents.about-content .page-navi .navi .navi-item a {
        padding: .5em 0; }
    #suntory_contents.about-content .page-navi .navi .logo {
      display: none; } }

/* ---------------------------------------------------------------- */
/* brands-container */
/* ---------------------------------------------------------------- */
#suntory_contents .brands-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; }
  #suntory_contents .brands-container .brand-item {
    width: 13.75em;
    text-align: center; }
    @media screen and (max-width: 48em) {
      #suntory_contents .brands-container .brand-item {
        width: 50%; } }
  #suntory_contents .brands-container .bottle {
    max-width: 6em;
    margin-bottom: -2em; }
  #suntory_contents .brands-container .title {
    position: relative;
    width: 13.75em;
    height: 6.875em;
    overflow: hidden;
    background-image: url(../images/home/btn_brand_01.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100%; }
    @media screen and (max-width: 48em) {
      #suntory_contents .brands-container .title {
        width: 100%;
        height: 5.725em; } }
    #suntory_contents .brands-container .title .text {
      position: absolute;
      top: 38%;
      left: 48%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      display: inline-block;
      font-size: .75em;
      line-height: 1.4;
      letter-spacing: -.05em;
      white-space: nowrap; }
      @media screen and (max-width: 48em) {
        #suntory_contents .brands-container .title .text {
          top: 42%;
          font-size: .75em; } }
  @media screen and (min-width: 48em) {
    #suntory_contents .brands-container a:focus .title,
    #suntory_contents .brands-container a:hover .title {
      background-position: left bottom; } }

/* column-container */
@media screen and (min-width: 48em) {
  #suntory_contents .column-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: relative; }
    #suntory_contents .column-container::before {
      content: "";
      display: inline-block;
      position: absolute;
      top: 0;
      left: 50%;
      width: 1px;
      height: 100%;
      background-color: #af8a46; }
    #suntory_contents .column-container .column-item {
      width: 45%; } }

@media screen and (max-width: 48em) {
  #suntory_contents .column-container .column-item {
    padding-top: 1.5em;
    border-top: 1px solid #af8a46; } }

#suntory_contents .column-container .title {
  font-size: 1em; }

#suntory_contents .column-container .read {
  font-size: .875em;
  color: #4c4c4c;
  line-height: 1.8; }

/* ec-container */
#suntory_contents .ec-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 90%;
  max-width: 27em;
  margin: 0 auto; }
  @media screen and (max-width: 48em) {
    #suntory_contents .ec-container {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center; } }
  #suntory_contents .ec-container .image {
    width: 6em; }
  #suntory_contents .ec-container .content {
    width: 20em;
    padding-left: 0; }
    @media screen and (max-width: 48em) {
      #suntory_contents .ec-container .content {
        width: 15em; } }
    #suntory_contents .ec-container .content .lp-title {
      font-size: .875em; }
      @media screen and (max-width: 48em) {
        #suntory_contents .ec-container .content .lp-title {
          margin-top: 1.5em;
          padding-top: 0;
          font-size: .75em; }
          #suntory_contents .ec-container .content .lp-title::before {
            content: none; } }
    #suntory_contents .ec-container .content .ec-button {
      margin-left: 3em; }
      @media screen and (max-width: 48em) {
        #suntory_contents .ec-container .content .ec-button {
          margin-left: 0; } }

/* intro-container */
#suntory_contents .intro-container {
  width: 90%;
  max-width: 50em;
  margin: 0 auto;
  padding: 2em 0; }
  @media screen and (min-width: 48em) {
    #suntory_contents .intro-container {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between; }
      #suntory_contents .intro-container .content {
        width: 56%; }
      #suntory_contents .intro-container .image {
        width: 40%;
        margin-top: 3em; } }
  #suntory_contents .intro-container .catch {
    margin-bottom: 1em;
    font-weight: 700;
    font-size: 1.25em;
    color: #4c4c4c;
    white-space: nowrap; }
  #suntory_contents .intro-container .read {
    line-height: 2;
    color: #4c4c4c; }

/* lineup-container */
#suntory_contents .lineup-container {
  padding: 2em 0; }
  #suntory_contents .lineup-container .lineup-item + .lineup-item {
    margin-top: 2em;
    padding-top: 3em;
    border-top: 1px solid #af8a46; }
  @media screen and (min-width: 48em) {
    #suntory_contents .lineup-container .lineup-item {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between; }
      #suntory_contents .lineup-container .lineup-item .image {
        width: 25%; }
      #suntory_contents .lineup-container .lineup-item .content {
        width: 75%; } }
  #suntory_contents .lineup-container .lineup-item .image {
    text-align: center; }
    @media screen and (max-width: 48em) {
      #suntory_contents .lineup-container .lineup-item .image {
        margin-bottom: 1.5em; } }
    #suntory_contents .lineup-container .lineup-item .image .bottle {
      max-width: 6em; }
  #suntory_contents .lineup-container .lineup-item .name .ja {
    display: inline-block; }
  #suntory_contents .lineup-container .lineup-item .name .en {
    display: inline-block;
    margin-top: .5em;
    font-size: 66.666%; }
  @media screen and (min-width: 48em) {
    #suntory_contents .lineup-container .lineup-item .name {
      max-width: 17em;
      float: left; } }
  @media screen and (max-width: 48em) {
    #suntory_contents .lineup-container .lineup-item .name {
      text-align: center; } }
  @media screen and (min-width: 48em) {
    #suntory_contents .lineup-container .lineup-item .ec-button {
      float: right; } }
  @media screen and (max-width: 48em) {
    #suntory_contents .lineup-container .lineup-item .ec-button {
      margin: 0 auto 1.5em; } }
  #suntory_contents .lineup-container .lineup-item .detail {
    font-size: .875em;
    line-height: 1.8;
    color: #4c4c4c; }
    @media screen and (min-width: 48em) {
      #suntory_contents .lineup-container .lineup-item .detail {
        clear: both; } }
    @media screen and (max-width: 48em) {
      #suntory_contents .lineup-container .lineup-item .detail {
        text-align: center; } }
  #suntory_contents .lineup-container .lineup-item .read {
    font-size: .875em;
    line-height: 1.8;
    color: #4c4c4c; }
  #suntory_contents .lineup-container .lineup-item .taste {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 1.5em; }
    @media screen and (max-width: 48em) {
      #suntory_contents .lineup-container .lineup-item .taste {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center; } }
    #suntory_contents .lineup-container .lineup-item .taste .taste-item {
      text-align: center;
      font-size: .75em;
      line-height: 2;
      color: #4c4c4c;
      border-right: 1px solid #4c4c4c;
      border-bottom: 1px solid #4c4c4c; }
      #suntory_contents .lineup-container .lineup-item .taste .taste-item:first-child {
        border-left: 1px solid #4c4c4c; }
      #suntory_contents .lineup-container .lineup-item .taste .taste-item.current {
        background-color: #9f9d89;
        color: #fff; }
    #suntory_contents .lineup-container .lineup-item .taste.red .taste-item {
      width: 7.2em; }
    #suntory_contents .lineup-container .lineup-item .taste.white .taste-item {
      width: 3em; }

/* ---------------------------------------------------------------- */
/* map-container */
/* ---------------------------------------------------------------- */
#suntory_contents .map-container {
  position: relative;
  height: 25em;
  background-image: url(../images/home/img_visual_01.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%; }
  @media screen and (max-width: 48em) {
    #suntory_contents .map-container {
      min-height: 80em;
      background-image: url(../images/home/img_visual_02.jpg);
      background-position: top; } }
  #suntory_contents .map-container .content-item {
    position: absolute; }
  #suntory_contents .map-container .wrapper {
    display: inline-block;
    max-height: 5.625em;
    overflow: hidden; }
  #suntory_contents .map-container .bottle {
    position: absolute;
    width: 2em; }
    @media screen and (max-width: 48em) {
      #suntory_contents .map-container .bottle {
        width: 3em; } }
  @media screen and (min-width: 48em) {
    #suntory_contents .map-container a:focus .label,
    #suntory_contents .map-container a:hover .label {
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%); } }

#suntory_contents .map-container .bordeaux {
  top: 1em;
  left: 35em;
  width: 25em; }
  @media screen and (max-width: 48em) {
    #suntory_contents .map-container .bordeaux {
      top: 33em;
      left: 0em; } }
  #suntory_contents .map-container .bordeaux .bottle {
    top: 3.5em;
    left: 18.5em; }
    @media screen and (max-width: 48em) {
      #suntory_contents .map-container .bordeaux .bottle {
        top: -10em; } }

#suntory_contents .map-container .aussieres {
  top: 7em;
  left: 32.5em;
  width: 21.25em; }
  @media screen and (max-width: 48em) {
    #suntory_contents .map-container .aussieres {
      top: 38em;
      left: 0; } }
  #suntory_contents .map-container .aussieres .bottle {
    top: 3.5em;
    left: 14.75em; }
    @media screen and (max-width: 48em) {
      #suntory_contents .map-container .aussieres .bottle {
        top: 0;
        left: 21em; } }

#suntory_contents .map-container .losvascos {
  top: 15em;
  left: 10em;
  width: 18.75em; }
  @media screen and (max-width: 48em) {
    #suntory_contents .map-container .losvascos {
      top: 64em;
      left: 0; } }
  #suntory_contents .map-container .losvascos .bottle {
    top: -6.5em;
    left: 15.25em; }
    @media screen and (max-width: 48em) {
      #suntory_contents .map-container .losvascos .bottle {
        top: -10em;
        left: 4em; } }

#suntory_contents .map-container .caro {
  top: 20em;
  left: 13em;
  width: 18.75em; }
  @media screen and (max-width: 48em) {
    #suntory_contents .map-container .caro {
      top: 70em;
      left: 3em; } }
  #suntory_contents .map-container .caro .bottle {
    top: -2.5em;
    left: 18.25em; }

#suntory_contents .map-container .title {
  top: 6em;
  left: 2em;
  width: 8em;
  margin: 0;
  font-size: 1em;
  text-align: center;
  line-height: 1.2;
  color: #052c6c; }
  @media screen and (max-width: 48em) {
    #suntory_contents .map-container .title {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      top: 12em;
      left: 3em;
      width: auto; } }
  @media screen and (min-width: 48em) {
    #suntory_contents .map-container .title .logo {
      margin-bottom: 1em; } }
  @media screen and (max-width: 48em) {
    #suntory_contents .map-container .title .logo {
      width: 9em;
      margin-right: 1em; } }
  #suntory_contents .map-container .title .ja {
    display: inline-block;
    padding: .25em 0;
    font-size: .875em; }
    @media screen and (max-width: 48em) {
      #suntory_contents .map-container .title .ja {
        font-size: 1.125em; } }
  #suntory_contents .map-container .title .en {
    display: inline-block;
    font-size: .625em; }
    @media screen and (max-width: 48em) {
      #suntory_contents .map-container .title .en {
        font-size: .75em; } }

#suntory_contents .map-container .catch {
  left: 2em;
  width: 30em; }
  @media screen and (min-width: 48em) {
    #suntory_contents .map-container .catch {
      top: 1em; }
      #suntory_contents .map-container .catch .sp {
        display: none; } }
  @media screen and (max-width: 48em) {
    #suntory_contents .map-container .catch {
      top: 4em; }
      #suntory_contents .map-container .catch .pc {
        display: none; } }

#suntory_contents .map-container .splash {
  position: relative;
  width: 100%;
  height: 100%;
  background-image: url(../images/common/bgi_content_01.gif);
  background-position: left top;
  background-size: 370px;
  opacity: 1;
  -webkit-transition: opacity 1s linear .5s;
  -o-transition: opacity 1s linear .5s;
  transition: opacity 1s linear .5s; }
  #suntory_contents .map-container .splash .logo {
    position: absolute;
    top: calc(50% - 10em);
    left: calc(50% - 10em);
    max-width: 20em; }

#suntory_contents .map-container.in .splash {
  opacity: 0; }

/* visual-container */
#suntory_contents .visual-container {
  position: relative;
  height: 30em;
  background-color: #000;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }
  #suntory_contents .visual-container > * {
    position: absolute; }
  #suntory_contents .visual-container::before {
    content: "";
    display: inline-block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50%;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.25)));
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.25) 100%);
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.25) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.25) 100%); }
  #suntory_contents .visual-container .logo {
    top: 2em;
    left: 3em;
    max-width: 10em; }
  #suntory_contents .visual-container .bottle {
    top: 2em;
    left: 4.5em;
    max-width: 6em; }
    @media screen and (max-width: 48em) {
      #suntory_contents .visual-container .bottle {
        top: 2em;
        left: calc(50% - 2em);
        max-width: 4em; } }
  #suntory_contents .visual-container .bottles {
    top: 2em;
    left: 4.5em; }
    #suntory_contents .visual-container .bottles .bottle {
      top: auto;
      left: auto; }
    @media screen and (max-width: 48em) {
      #suntory_contents .visual-container .bottles {
        top: 2em;
        left: calc(50% - 4em); } }
  #suntory_contents .visual-container .page-title {
    top: 1em;
    right: 1em;
    width: 23.75em;
    height: 6.25em;
    margin-bottom: 0;
    padding-top: .75em;
    background-image: url(../images/common/ttl_base_01.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100%;
    text-align: center;
    font-size: 1em;
    line-height: 1.2; }
    #suntory_contents .visual-container .page-title .ja {
      display: inline-block;
      font-size: 1.25em; }
    #suntory_contents .visual-container .page-title .en {
      display: inline-block;
      font-size: .75em; }
    @media screen and (max-width: 48em) {
      #suntory_contents .visual-container .page-title {
        top: 14em;
        right: calc(50% - 10.6875em);
        width: 21.375em;
        height: 5.625em; }
        #suntory_contents .visual-container .page-title .ja {
          font-size: 1em; }
        #suntory_contents .visual-container .page-title .en {
          font-size: .625em; } }
  #suntory_contents .visual-container .catch {
    right: 1em;
    bottom: 1em;
    margin-bottom: 0;
    font-weight: 700;
    font-size: 2em;
    color: #fff;
    text-shadow: 0.1em 0.1em 0.1em rgba(0, 0, 0, 0.5); }
    @media screen and (max-width: 48em) {
      #suntory_contents .visual-container .catch {
        right: 0;
        width: 100%;
        text-align: center;
        font-size: 1.4em; } }
  #suntory_contents .visual-container .copyright {
    top: calc(100% + .5em);
    right: 1em;
    font-size: .625em;
    color: #808080; }

/* ---------------------------------------------------------------- */
/* common */
/* ---------------------------------------------------------------- */
/* wineCommonHeader */
#wineCommonHeader {
  padding: 10px 0; }
  #wineCommonHeader p,
  #wineCommonHeader ul,
  #wineCommonHeader li {
    margin: 0; }
  @media screen and (max-width: 48em) {
    #wineCommonHeader {
      display: none; } }

/* content-header */
#suntory_contents .content-header {
  height: 5.75em; }
  @media screen and (max-width: 48em) {
    #suntory_contents .content-header {
      height: inherit; } }

/* suntory_contents */
#suntory_contents {
  max-width: 60em;
  margin: 0 auto;
  background-color: #fff;
  font-family: "Noto Serif JP", serif;
  line-height: 1.6;
  color: #1f2c5f; }
  #suntory_contents *,
  #suntory_contents *:after,
  #suntory_contents *:before {
    -webkit-box-sizing: inherit;
    box-sizing: inherit; }

#suntory_contents .content-wrapper {
  width: 90%;
  max-width: 50em;
  margin: 0 auto; }

#suntory_contents .page-section {
  background-image: url(../images/common/bgi_content_01.gif);
  background-position: left top;
  background-size: 370px; }

#suntory_contents .ws-nw {
  white-space: nowrap; }

/* ---------------------------------------------------------------- */
/* primary-content */
/* ---------------------------------------------------------------- */
/* section: about */
#suntory_contents.primary-content #about .visual-container {
  margin-bottom: 4em;
  background-image: url(../images/dbr/img_visual_01.jpg); }
  #suntory_contents.primary-content #about .visual-container::before {
    content: none; }
  @media screen and (max-width: 48em) {
    #suntory_contents.primary-content #about .visual-container {
      height: 66.666vw; }
      #suntory_contents.primary-content #about .visual-container .logo {
        display: none; } }

@media screen and (min-width: 48em) {
  #suntory_contents.primary-content #about .content-wrapper > .logo {
    display: none; } }

@media screen and (max-width: 48em) {
  #suntory_contents.primary-content #about .content-wrapper > .logo {
    margin-bottom: 3em;
    text-align: center; }
    #suntory_contents.primary-content #about .content-wrapper > .logo img {
      max-width: 10em; } }

#suntory_contents.primary-content #about .catch {
  font-size: 1.75em;
  line-height: 1.8; }

#suntory_contents.primary-content #about .read {
  font-size: 1.25em;
  line-height: 2.4; }

#suntory_contents.primary-content #about .link {
  text-align: center; }
  #suntory_contents.primary-content #about .link .link-item {
    display: inline-block;
    position: relative;
    width: 25em;
    height: 6.25em;
    overflow: hidden;
    background-image: url(../images/home/btn_dbr_01.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100%; }
    #suntory_contents.primary-content #about .link .link-item .text {
      display: inline-block;
      position: absolute;
      top: 1em;
      left: 4em;
      font-size: .875em;
      line-height: 1.4;
      letter-spacing: -.05em;
      white-space: nowrap; }
    @media screen and (min-width: 48em) {
      #suntory_contents.primary-content #about .link .link-item:focus, #suntory_contents.primary-content #about .link .link-item:hover {
        background-position: left bottom; } }

/* section: btands */
#suntory_contents.primary-content #btands {
  padding: 4em 0; }
  #suntory_contents.primary-content #btands .section-title {
    margin-bottom: 2em;
    text-align: center; }

/* ---------------------------------------------------------------- */
/* secondary-content */
/* ---------------------------------------------------------------- */
#suntory_contents.secondary-content .page-section {
  padding-top: 4em; }
  #suntory_contents.secondary-content .page-section:last-child {
    padding-bottom: 4em; }

#suntory_contents.secondary-content .content-wrapper {
  padding: 2em 0; }

#suntory_contents.secondary-content .section-title {
  padding-bottom: .5em;
  border-bottom: 1px solid #af8a46;
  font-size: 1.75em; }
  #suntory_contents.secondary-content .section-title .ja {
    display: inline-block; }
  #suntory_contents.secondary-content .section-title .en {
    display: inline-block;
    margin-left: 1em;
    font-size: 66.666%; }

#suntory_contents.secondary-content .section-footer {
  margin-top: 2em;
  text-align: center; }
  #suntory_contents.secondary-content .section-footer .deco {
    max-width: 25em;
    margin: 1.5em 0; }

/* visual-container */
#suntory_contents.secondary-content.dbr-content .visual-container {
  height: 30em;
  background-image: url(../images/dbr/img_visual_01.jpg); }
  @media screen and (max-width: 48em) {
    #suntory_contents.secondary-content.dbr-content .visual-container {
      height: 100vw;
      background-position: 56% 0;
      background-size: 160%; } }
  #suntory_contents.secondary-content.dbr-content .visual-container::before {
    content: none; }
  #suntory_contents.secondary-content.dbr-content .visual-container .page-title {
    right: 10em;
    width: inherit;
    height: inherit;
    background: none;
    text-align: left;
    color: #fff;
    line-height: 1.6; }
    #suntory_contents.secondary-content.dbr-content .visual-container .page-title .ja {
      font-size: 1.75em; }
      #suntory_contents.secondary-content.dbr-content .visual-container .page-title .ja.small {
        font-size: 1.25em; }
    #suntory_contents.secondary-content.dbr-content .visual-container .page-title .en {
      font-size: 1em; }
    @media screen and (max-width: 48em) {
      #suntory_contents.secondary-content.dbr-content .visual-container .page-title {
        top: 3em;
        right: 1em; }
        #suntory_contents.secondary-content.dbr-content .visual-container .page-title .ja {
          font-size: 1.125em; }
          #suntory_contents.secondary-content.dbr-content .visual-container .page-title .ja.small {
            font-size: .875em; }
        #suntory_contents.secondary-content.dbr-content .visual-container .page-title .en {
          font-size: .625em; } }

#suntory_contents.secondary-content.bordeaux-content .visual-container {
  height: 20em;
  background-image: url(../images/bordeaux/img_visual_01.jpg); }
  @media screen and (max-width: 48em) {
    #suntory_contents.secondary-content.bordeaux-content .visual-container {
      height: 100vw; } }
  #suntory_contents.secondary-content.bordeaux-content .visual-container::before {
    height: 75%;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.75)));
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.75) 100%);
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.75) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.75) 100%); }
  #suntory_contents.secondary-content.bordeaux-content .visual-container .page-title {
    height: 7.5em;
    background-image: url(../images/common/ttl_base_02.png); }
    #suntory_contents.secondary-content.bordeaux-content .visual-container .page-title .ja {
      font-size: 1.125em;
      letter-spacing: -.05em; }
    #suntory_contents.secondary-content.bordeaux-content .visual-container .page-title .en {
      font-size: .625em; }
    @media screen and (max-width: 48em) {
      #suntory_contents.secondary-content.bordeaux-content .visual-container .page-title {
        top: 13em;
        padding-top: .75em; }
        #suntory_contents.secondary-content.bordeaux-content .visual-container .page-title .ja {
          font-size: 1em; }
        #suntory_contents.secondary-content.bordeaux-content .visual-container .page-title .en {
          letter-spacing: -0.02em; } }

#suntory_contents.secondary-content.aussieres-content .visual-container {
  height: 20em;
  background-image: url(../images/aussieres/img_visual_01.jpg); }
  @media screen and (max-width: 48em) {
    #suntory_contents.secondary-content.aussieres-content .visual-container {
      height: 100vw; } }

#suntory_contents.secondary-content.losvascos-content .visual-container {
  height: 20em;
  background-image: url(../images/losvascos/img_visual_01.jpg);
  background-position: right center;
  background-size: 75%; }
  @media screen and (max-width: 48em) {
    #suntory_contents.secondary-content.losvascos-content .visual-container {
      height: 100vw;
      background-position: 150% -10%;
      background-size: 150%; } }
  #suntory_contents.secondary-content.losvascos-content .visual-container::before {
    content: none; }
  #suntory_contents.secondary-content.losvascos-content .visual-container .logo {
    top: 9em;
    max-width: 8em; }
    @media screen and (max-width: 48em) {
      #suntory_contents.secondary-content.losvascos-content .visual-container .logo {
        display: none; } }
  #suntory_contents.secondary-content.losvascos-content .visual-container .page-title {
    right: 35.25em; }
    @media screen and (max-width: 48em) {
      #suntory_contents.secondary-content.losvascos-content .visual-container .page-title {
        right: calc(50% - 11.875em); } }
  #suntory_contents.secondary-content.losvascos-content .visual-container .catch {
    right: 11.5em;
    bottom: 2em; }
    @media screen and (max-width: 48em) {
      #suntory_contents.secondary-content.losvascos-content .visual-container .catch {
        right: 0;
        bottom: 1em; } }

#suntory_contents.secondary-content.caro-content .visual-container {
  height: 20em;
  background-image: url(../images/caro/img_visual_01.jpg); }
  @media screen and (max-width: 48em) {
    #suntory_contents.secondary-content.caro-content .visual-container {
      height: 100vw; } }