@charset "UTF-8";
/*!
 * ress.css • v1.1.1
 * MIT License
 * github.com/filipelinhares/ress
 */
/* # =================================================================
   # Global selectors
   # ================================================================= */
html {
  box-sizing: border-box;
  -webkit-text-size-adjust: 100%; /* iOS 8+ */
  -webkit-font-smoothing: antialiased;
}

html, body {
  width: 100%;
  height: 100%;
}

* {
  box-sizing: border-box;
}

::before,
::after {
  text-decoration: inherit; /* Inherit text-decoration and vertical align to ::before and ::after pseudo elements */
  vertical-align: inherit;
  box-sizing: inherit;
}

/* Remove margin, padding of all elements and set background-no-repeat as default */
* {
  background-repeat: no-repeat; /* Set `background-repeat: no-repeat` to all elements */
  padding: 0; /* Reset `padding` and `margin` of all elements */
  margin: 0;
  backface-visibility: hidden;
}

/* # =================================================================
   # General elements
   # ================================================================= */
/* Add the correct display in iOS 4-7.*/
audio:not([controls]) {
  display: none;
  height: 0;
}

hr {
  overflow: visible; /* Show the overflow in Edge and IE */
}

/*
* 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
*/
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
  display: block;
}

summary {
  display: list-item; /* Add the correct display in all browsers */
}

small {
  font-size: 80%; /* Set font-size to 80% in `small` elements */
}

[hidden],
template {
  display: none; /* Add the correct display in IE */
}

abbr[title] {
  border-bottom: 1px dotted; /* Add a bordered underline effect in all browsers */
  text-decoration: none; /* Remove text decoration in Firefox 40+ */
}

a {
  background-color: transparent; /* Remove the gray background on active links in IE 10 */
  -webkit-text-decoration-skip: objects; /* Remove gaps in links underline in iOS 8+ and Safari 8+ */
}

a:active,
a:hover {
  outline-width: 0; /* Remove the outline when hovering in all browsers */
}

code,
kbd,
pre,
samp {
  font-family: monospace, monospace; /* Specify the font family of code elements */
}

b,
strong {
  font-weight: bolder; /* Correct style set to `bold` in Edge 12+, Safari 6.2+, and Chrome 18+ */
}

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

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

/* https://gist.github.com/unruthless/413930 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* # =================================================================
   # Forms
   # ================================================================= */
input {
  border-radius: 0;
}

/* Apply cursor pointer to button elements */
button,
[type=button],
[type=reset],
[type=submit] [role=button] {
  cursor: pointer;
}

/* Replace pointer cursor in disabled elements */
[disabled] {
  cursor: default;
}

[type=number] {
  width: auto; /* Firefox 36+ */
}

[type=search] {
  -webkit-appearance: textfield; /* Safari 8+ */
}

[type=search]::-webkit-search-cancel-button,
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none; /* Safari 8 */
}

textarea {
  overflow: auto; /* Internet Explorer 11+ */
  resize: vertical; /* Specify textarea resizability */
}

button,
input,
optgroup,
select,
textarea {
  font: inherit; /* Specify font inheritance of form elements */
}

optgroup {
  font-weight: bold; /* Restore the font weight unset by the previous rule. */
}

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

/* Remove inner padding and border in Firefox 4+ */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: 0;
  padding: 0;
}

/* Replace focus style removed in the border reset above */
button:-moz-focusring,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  outline: 1px dotted ButtonText;
}

button,
html [type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button; /* Correct the inability to style clickable types in iOS */
}

button,
select {
  text-transform: none; /* Firefox 40+, Internet Explorer 11- */
}

/* Remove the default button styling in all browsers */
button,
input,
select,
textarea {
  background-color: transparent;
  border-style: none;
  color: inherit;
}

/* Style select like a standard input */
select {
  -moz-appearance: none; /* Firefox 36+ */
  -webkit-appearance: none; /* Chrome 41+ */
}

select::-ms-expand {
  display: none; /* Internet Explorer 11+ */
}

select::-ms-value {
  color: currentColor; /* Internet Explorer 11+ */
}

legend {
  border: 0; /* Correct `color` not being inherited in IE 8/9/10/11 */
  color: inherit; /* Correct the color inheritance from `fieldset` elements in IE */
  display: table; /* Correct the text wrapping in Edge and IE */
  max-width: 100%; /* Correct the text wrapping in Edge and IE */
  white-space: normal; /* Correct the text wrapping in Edge and IE */
}

::-webkit-file-upload-button {
  -webkit-appearance: button; /* Correct the inability to style clickable types in iOS and Safari */
  font: inherit; /* Change font properties to `inherit` in Chrome and Safari */
}

[type=search] {
  -webkit-appearance: textfield; /* Correct the odd appearance in Chrome and Safari */
  outline-offset: -2px; /* Correct the outline style in Safari */
}

/* # =================================================================
   # Specify media element style
   # ================================================================= */
img {
  border-style: none; /* Remove border when inside `a` element in IE 8/9/10 */
}

/* Add the correct vertical alignment in Chrome, Firefox, and Opera */
progress {
  vertical-align: baseline;
}

svg:not(:root) {
  overflow: hidden; /* Internet Explorer 11- */
}

audio,
canvas,
progress,
video {
  display: inline-block; /* Internet Explorer 11+, Windows Phone 8.1+ */
}

/* # =================================================================
   # Accessibility
   # ================================================================= */
/* Hide content from screens but not screenreaders */
@media screen {
  [hidden~=screen] {
    display: inherit;
  }
  [hidden~=screen]:not(:active):not(:focus):not(:target) {
    position: absolute !important;
    clip: rect(0 0 0 0) !important;
  }
}
/* Specify the progress cursor of updating elements */
[aria-busy=true] {
  cursor: progress;
}

/* Specify the pointer cursor of trigger elements */
[aria-controls] {
  cursor: pointer;
}

/* Specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements */
[aria-disabled] {
  cursor: default;
}

/* # =================================================================
   # Selection
   # ================================================================= */
/* Specify text selection background color and omit drop shadow */
::-moz-selection {
  background-color: #b3d4fc; /* Required when declaring ::selection */
  color: #000;
  text-shadow: none;
}

::selection {
  background-color: #b3d4fc; /* Required when declaring ::selection */
  color: #000;
  text-shadow: none;
}

li {
  list-style: none;
}

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

/* ==========================================================================

COLOR

========================================================================== */
/* ==========================================================================

SCREEN

========================================================================== */
/* ==========================================================================

MODULE

========================================================================== */
/* ==========================================================================

BASE

========================================================================== */
* {
  box-sizing: border-box;
}

html {
  font-size: 10px;
}

body {
  font-family: "roboto", sans-serif;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.02em;
}
@media only screen and (max-width: 750px) {
  body {
    font-size: 1.5rem;
  }
}

body {
  background-color: #C0E2DB;
  color: #262626;
}
body.lang-ch {
  background-color: #AC781A;
  background: linear-gradient(90deg, rgb(172, 120, 26) 0%, rgb(216, 175, 83) 20%, rgb(239, 204, 112) 50%, rgb(216, 175, 83) 80%, rgb(172, 120, 26) 100%);
}
body.lang-es {
  background-color: #fff;
}

.pcNone {
  display: none !important;
}
@media only screen and (max-width: 768px) {
  .pcNone {
    display: block !important;
  }
}
@media only screen and (max-width: 750px) {
  .pcNone {
    display: block !important;
  }
}

@media only screen and (max-width: 768px) {
  .tbNone {
    display: none;
  }
}
@media only screen and (max-width: 750px) {
  .tbNone {
    display: block !important;
  }
}

@media only screen and (max-width: 768px) {
  .spNone {
    display: block !important;
  }
}
@media only screen and (max-width: 750px) {
  .spNone {
    display: none !important;
  }
}

a {
  text-decoration: none;
  transition: 0.3s ease-out;
  outline: none;
}
a:hover {
  text-decoration: none;
}
a:visited, a:active {
  outline: none;
}
a img {
  transition: 0.3s ease-out;
  border-style: none;
  border: 0;
}
img {
  -ms-interpolation-mode: bicubic;
  vertical-align: bottom;
  backface-visibility: hidden;
  max-width: 100%;
  height: auto;
}
img.img100 {
  width: 100%;
  height: auto;
}
img.imgMax100 {
  max-width: 100%;
  height: auto;
}
@media only screen and (max-width: 750px) {
  img {
    max-width: 100%;
  }
}

.objfit {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
  font-family: "object-fit: cover;";
}

/* ==========================================================================

MODULE

========================================================================== */
.mt0 {
  margin-top: 0px !important;
}

.pt0 {
  padding-top: 0px !important;
}

.mb0 {
  margin-bottom: 0px !important;
}

.pb0 {
  padding-bottom: 0px !important;
}

.ml0 {
  margin-left: 0px !important;
}

.pl0 {
  padding-left: 0px !important;
}

.mr0 {
  margin-right: 0px !important;
}

.pr0 {
  padding-right: 0px !important;
}

.mt5 {
  margin-top: 5px !important;
}

.pt5 {
  padding-top: 5px !important;
}

.mb5 {
  margin-bottom: 5px !important;
}

.pb5 {
  padding-bottom: 5px !important;
}

.ml5 {
  margin-left: 5px !important;
}

.pl5 {
  padding-left: 5px !important;
}

.mr5 {
  margin-right: 5px !important;
}

.pr5 {
  padding-right: 5px !important;
}

.mt10 {
  margin-top: 10px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.pb10 {
  padding-bottom: 10px !important;
}

.ml10 {
  margin-left: 10px !important;
}

.pl10 {
  padding-left: 10px !important;
}

.mr10 {
  margin-right: 10px !important;
}

.pr10 {
  padding-right: 10px !important;
}

.mt15 {
  margin-top: 15px !important;
}

.pt15 {
  padding-top: 15px !important;
}

.mb15 {
  margin-bottom: 15px !important;
}

.pb15 {
  padding-bottom: 15px !important;
}

.ml15 {
  margin-left: 15px !important;
}

.pl15 {
  padding-left: 15px !important;
}

.mr15 {
  margin-right: 15px !important;
}

.pr15 {
  padding-right: 15px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.pt20 {
  padding-top: 20px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.pb20 {
  padding-bottom: 20px !important;
}

.ml20 {
  margin-left: 20px !important;
}

.pl20 {
  padding-left: 20px !important;
}

.mr20 {
  margin-right: 20px !important;
}

.pr20 {
  padding-right: 20px !important;
}

.mt25 {
  margin-top: 25px !important;
}

.pt25 {
  padding-top: 25px !important;
}

.mb25 {
  margin-bottom: 25px !important;
}

.pb25 {
  padding-bottom: 25px !important;
}

.ml25 {
  margin-left: 25px !important;
}

.pl25 {
  padding-left: 25px !important;
}

.mr25 {
  margin-right: 25px !important;
}

.pr25 {
  padding-right: 25px !important;
}

.mt30 {
  margin-top: 30px !important;
}

.pt30 {
  padding-top: 30px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.pb30 {
  padding-bottom: 30px !important;
}

.ml30 {
  margin-left: 30px !important;
}

.pl30 {
  padding-left: 30px !important;
}

.mr30 {
  margin-right: 30px !important;
}

.pr30 {
  padding-right: 30px !important;
}

.mt35 {
  margin-top: 35px !important;
}

.pt35 {
  padding-top: 35px !important;
}

.mb35 {
  margin-bottom: 35px !important;
}

.pb35 {
  padding-bottom: 35px !important;
}

.ml35 {
  margin-left: 35px !important;
}

.pl35 {
  padding-left: 35px !important;
}

.mr35 {
  margin-right: 35px !important;
}

.pr35 {
  padding-right: 35px !important;
}

.mt40 {
  margin-top: 40px !important;
}

.pt40 {
  padding-top: 40px !important;
}

.mb40 {
  margin-bottom: 40px !important;
}

.pb40 {
  padding-bottom: 40px !important;
}

.ml40 {
  margin-left: 40px !important;
}

.pl40 {
  padding-left: 40px !important;
}

.mr40 {
  margin-right: 40px !important;
}

.pr40 {
  padding-right: 40px !important;
}

.mt45 {
  margin-top: 45px !important;
}

.pt45 {
  padding-top: 45px !important;
}

.mb45 {
  margin-bottom: 45px !important;
}

.pb45 {
  padding-bottom: 45px !important;
}

.ml45 {
  margin-left: 45px !important;
}

.pl45 {
  padding-left: 45px !important;
}

.mr45 {
  margin-right: 45px !important;
}

.pr45 {
  padding-right: 45px !important;
}

.mt50 {
  margin-top: 50px !important;
}

.pt50 {
  padding-top: 50px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.pb50 {
  padding-bottom: 50px !important;
}

.ml50 {
  margin-left: 50px !important;
}

.pl50 {
  padding-left: 50px !important;
}

.mr50 {
  margin-right: 50px !important;
}

.pr50 {
  padding-right: 50px !important;
}

.mt55 {
  margin-top: 55px !important;
}

.pt55 {
  padding-top: 55px !important;
}

.mb55 {
  margin-bottom: 55px !important;
}

.pb55 {
  padding-bottom: 55px !important;
}

.ml55 {
  margin-left: 55px !important;
}

.pl55 {
  padding-left: 55px !important;
}

.mr55 {
  margin-right: 55px !important;
}

.pr55 {
  padding-right: 55px !important;
}

.mt60 {
  margin-top: 60px !important;
}

.pt60 {
  padding-top: 60px !important;
}

.mb60 {
  margin-bottom: 60px !important;
}

.pb60 {
  padding-bottom: 60px !important;
}

.ml60 {
  margin-left: 60px !important;
}

.pl60 {
  padding-left: 60px !important;
}

.mr60 {
  margin-right: 60px !important;
}

.pr60 {
  padding-right: 60px !important;
}

.mt70 {
  margin-top: 70px !important;
}

.pt70 {
  padding-top: 70px !important;
}

.mb70 {
  margin-bottom: 70px !important;
}

.pb70 {
  padding-bottom: 70px !important;
}

.ml70 {
  margin-left: 70px !important;
}

.pl70 {
  padding-left: 70px !important;
}

.mr70 {
  margin-right: 70px !important;
}

.pr70 {
  padding-right: 70px !important;
}

.mt75 {
  margin-top: 75px !important;
}

.pt75 {
  padding-top: 75px !important;
}

.mb75 {
  margin-bottom: 75px !important;
}

.pb75 {
  padding-bottom: 75px !important;
}

.ml75 {
  margin-left: 75px !important;
}

.pl75 {
  padding-left: 75px !important;
}

.mr75 {
  margin-right: 75px !important;
}

.pr75 {
  padding-right: 75px !important;
}

.mt80 {
  margin-top: 80px !important;
}

.pt80 {
  padding-top: 80px !important;
}

.mb80 {
  margin-bottom: 80px !important;
}

.pb80 {
  padding-bottom: 80px !important;
}

.ml80 {
  margin-left: 80px !important;
}

.pl80 {
  padding-left: 80px !important;
}

.mr80 {
  margin-right: 80px !important;
}

.pr80 {
  padding-right: 80px !important;
}

.mt90 {
  margin-top: 90px !important;
}

.pt90 {
  padding-top: 90px !important;
}

.mb90 {
  margin-bottom: 90px !important;
}

.pb90 {
  padding-bottom: 90px !important;
}

.ml90 {
  margin-left: 90px !important;
}

.pl90 {
  padding-left: 90px !important;
}

.mr90 {
  margin-right: 90px !important;
}

.pr90 {
  padding-right: 90px !important;
}

.mt95 {
  margin-top: 95px !important;
}

.pt95 {
  padding-top: 95px !important;
}

.mb95 {
  margin-bottom: 95px !important;
}

.pb95 {
  padding-bottom: 95px !important;
}

.ml95 {
  margin-left: 95px !important;
}

.pl95 {
  padding-left: 95px !important;
}

.mr95 {
  margin-right: 95px !important;
}

.pr95 {
  padding-right: 95px !important;
}

.mt100 {
  margin-top: 100px !important;
}

.pt100 {
  padding-top: 100px !important;
}

.mb100 {
  margin-bottom: 100px !important;
}

.pb100 {
  padding-bottom: 100px !important;
}

.ml100 {
  margin-left: 100px !important;
}

.pl100 {
  padding-left: 100px !important;
}

.mr100 {
  margin-right: 100px !important;
}

.pr100 {
  padding-right: 100px !important;
}

.scrollOriginal::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 5px;
  background-color: #cccccc;
}

.scrollOriginal::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: #666666;
  box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
}

/* ==========================================================================

Layout

========================================================================== */
.innerArea {
  width: 954px;
  margin: 0 auto;
  position: relative;
}
@media only screen and (max-width: 954px) {
  .innerArea {
    width: 100%;
    margin: 0 auto;
    position: relative;
    padding: 0 20px;
  }
}
.innerArea.narrowArea {
  padding: 0 150px;
}
@media only screen and (max-width: 954px) {
  .innerArea.narrowArea {
    padding: 0 80px;
  }
}
@media only screen and (max-width: 750px) {
  .innerArea.narrowArea {
    padding: 0 20px;
  }
}

.center {
  text-align: center;
  margin: 0 auto;
}

#content {
  margin-top: 70px;
}
@media only screen and (max-width: 750px) {
  #content {
    margin-top: 60px;
  }
}

#wrapper {
  overflow: hidden;
}

/* ==========================================================================

modaal

========================================================================== */
body.grafOpen .modaal-image .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-gallery-item {
  padding: 50px;
  background-color: #712200;
}
@media only screen and (max-width: 750px) {
  body.grafOpen .modaal-image .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-gallery-item {
    padding: 20px 10px;
  }
}
body.grafOpen.lang-es .modaal-image .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-gallery-item {
  background-color: #B1830B;
}

.modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper {
  padding: 60px 20px;
}
.modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container {
  padding: 0;
  max-width: 956px;
  background-color: inherit;
  box-shadow: none;
  width: 100%;
}
.modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-content {
  width: 100%;
}
.modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-gallery-item {
  width: 100%;
}
.modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-close {
  position: absolute;
  right: -50px;
  top: -33px;
  color: #000;
  cursor: pointer;
  opacity: 1;
  width: 33px;
  height: 33px;
  background: rgba(255, 255, 255, 0);
  border-radius: 100%;
  transition: all 0.2s ease-in-out;
}
@media only screen and (max-width: 1056px) {
  .modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-close {
    right: 0;
    top: -46px;
  }
}
@media only screen and (max-width: 750px) {
  .modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-close {
    width: 30px;
    height: 30px;
    top: -46px;
  }
}
.modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-close::after, .modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-close::before {
  display: block;
  content: " ";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 2px;
  height: 33px;
  border-radius: 4px;
  background: #fff;
}
@media only screen and (max-width: 750px) {
  .modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-close::after, .modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-close::before {
    height: 30px;
  }
}
.modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-close::after {
  transform: translate(-50%, -50%) rotate(45deg);
}
.modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-close::before {
  transform: translate(-50%, -50%) rotate(-45deg);
}
.modaal-wrapper .modaal-outer-wrapper .modaal-inner-wrapper .modaal-container .modaal-close span {
  position: absolute !important;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  padding: 0 !important;
  border: 0 !important;
  height: 1px !important;
  width: 1px !important;
  overflow: hidden;
}

.modal-opened {
  display: none;
}

.modaal-inline .modaal-content-container {
  padding: 15px;
}

/* ==========================================================================

BASE

========================================================================== */
.t-title {
  font-family: "din-2014", sans-serif;
  font-size: 4rem;
  font-weight: 400;
  line-height: 1.4;
}
@media only screen and (max-width: 750px) {
  .t-title {
    font-size: 2.5rem;
  }
}

.swiper {
  overflow: hidden;
}

.t-mv {
  margin-top: -70px;
  transform: translate3d(0);
  /*
     .vol03 {
         span {
             background: url("../images/top/mv04.jpg") center / 100% no-repeat;
         }
         img {
             @include ANIMATION_TRANS();
         }
         @include breakPoint(not-sp) {
             &:hover {
                 img {
                     opacity: 0;
                 }
             }
         }
     }
     */
}
@media only screen and (max-width: 750px) {
  .t-mv {
    margin-top: 0;
  }
}
.t-mv .swiper-slide {
  overflow: hidden;
}
.t-mv .swiper-slide div {
  background-color: #fff;
}
@media only screen and (max-width: 750px) {
  .t-mv .swiper-slide div {
    position: relative;
    padding-bottom: 58.6666666667%;
  }
}
.t-mv .swiper-slide span {
  display: block;
}
@media only screen and (max-width: 750px) {
  .t-mv .swiper-slide span {
    position: absolute;
    width: 120%;
    bottom: 0;
    left: -10%;
  }
}

.t-intro {
  padding: 160px 0 130px;
  background: url("../images/top/intro_bg01.svg") right -30px top 35px no-repeat, url("../images/top/intro_bg02.svg") left -35px bottom 48px no-repeat;
}
body.lang-ch .t-intro {
  background: url("../images/ch/intro_bg01.svg") right -30px top 35px no-repeat, url("../images/ch/intro_bg02.svg") left -35px bottom 48px no-repeat;
}
@media only screen and (max-width: 750px) {
  body.lang-ch .t-intro {
    background-size: 85px auto, 60px auto;
    background-position: right -34px top 8px, left -10px bottom 52px;
  }
}
body.lang-es .t-intro {
  background: url("../images/es/intro_bg01.svg") right -30px top 35px no-repeat, url("../images/es/intro_bg02.svg") left -35px bottom 48px no-repeat;
}
@media only screen and (max-width: 750px) {
  body.lang-es .t-intro {
    background-size: 85px auto, 60px auto;
    background-position: right -34px top 8px, left -10px bottom 52px;
  }
}
@media only screen and (max-width: 750px) {
  .t-intro {
    padding: 75px 30px 115px;
    background-size: 85px auto, 60px auto;
    background-position: right -34px top 8px, left -10px bottom 52px;
  }
}
.t-intro .innerArea {
  position: relative;
}
.t-intro .innerArea::before, .t-intro .innerArea::after {
  content: " ";
  display: block;
  position: absolute;
  background-color: #b4984c;
}
body.lang-ch .t-intro .innerArea::before, body.lang-ch .t-intro .innerArea::after {
  background-color: #ac781a;
}
.t-intro .innerArea::before {
  width: 470px;
  height: 2px;
  top: -66px;
  left: -44px;
}
@media only screen and (max-width: 750px) {
  .t-intro .innerArea::before {
    width: 110px;
    height: 1px;
    top: -32px;
    left: -10px;
  }
}
.t-intro .innerArea::after {
  width: 2px;
  height: 191px;
  top: -117px;
  left: -2px;
}
@media only screen and (max-width: 750px) {
  .t-intro .innerArea::after {
    width: 1px;
    height: 50px;
    top: -46px;
    left: -1px;
  }
}
.t-intro .textbody {
  max-width: 730px;
  margin: 0 auto;
  line-height: 1.875;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .t-intro .textbody {
    line-height: 1.7333333333;
    position: static;
  }
}
.t-intro .textbody::after {
  content: " ";
  display: block;
  width: 46px;
  height: 68px;
  background: url("../images/top/intro_stamp.svg") center no-repeat;
  position: absolute;
  right: -94px;
  bottom: 12px;
}
@media only screen and (max-width: 750px) {
  .t-intro .textbody::after {
    width: 35px;
    height: 52px;
    background-size: 35px auto;
    right: 10px;
    bottom: -60px;
  }
}
.t-intro .ytblock {
  width: 100%;
  margin-top: 70px;
}

.t-what {
  padding: 117px 0 134px;
  background-color: #88c4bf;
}
body.lang-ch .t-what {
  background: transparent;
  position: relative;
}
body.lang-ch .t-what::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #986a00;
  opacity: 0.4;
  mix-blend-mode: multiply;
  z-index: -2;
}
body.lang-es .t-what {
  background: #e6dfc4;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .t-what {
    padding: 60px 0 50px;
  }
}
.t-what .boxInner {
  max-width: 730px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.t-what .boxInner::before {
  content: " ";
  display: block;
  width: 198px;
  height: 756px;
  background: url(../images/top/what_bg.svg) center no-repeat;
  position: absolute;
  bottom: -70px;
  left: -185px;
  z-index: -1;
}
@media only screen and (max-width: 750px) {
  .t-what .boxInner::before {
    display: none;
  }
}
body.lang-ch .t-what .boxInner::before {
  background: url(../images/ch/what_bg.svg) center no-repeat;
  opacity: 0.9;
  z-index: 0;
}
body.lang-es .t-what .boxInner::before {
  background: url(../images/es/what_bg.svg) center no-repeat;
}
.t-what .t-title {
  margin-bottom: 32px;
  position: relative;
}
body.lang-ch .t-what .t-title {
  color: #fff;
}
@media only screen and (max-width: 750px) {
  .t-what .t-title {
    margin-bottom: 22px;
    padding: 0 10px;
  }
}
.t-what .t-title::before, .t-what .t-title::after {
  content: " ";
  display: block;
  position: absolute;
  background-color: #977a00;
}
body.lang-ch .t-what .t-title::before, body.lang-ch .t-what .t-title::after {
  background-color: #c9941a;
}
.t-what .t-title::before {
  width: 246px;
  height: 2px;
  top: -2px;
  right: -124px;
}
@media only screen and (max-width: 750px) {
  .t-what .t-title::before {
    width: 110px;
    height: 1px;
    top: -17px;
    right: -10px;
  }
}
.t-what .t-title::after {
  width: 2px;
  height: 415px;
  top: -58px;
  right: -82px;
}
@media only screen and (max-width: 750px) {
  .t-what .t-title::after {
    width: 1px;
    height: 50px;
    top: -30px;
    right: -1px;
  }
}
.t-what .list .item {
  margin-bottom: 30px;
  color: #fff;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item {
    margin-bottom: 20px;
  }
}
.t-what .list .item:last-child {
  margin-bottom: 0;
}
.t-what .list .item:nth-child(2) .top::before {
  background-image: url(../images/top/seigaiha_B.jpg);
}
body.lang-ch .t-what .list .item:nth-child(2) .top::before {
  background-image: url(../images/top/seigaiha_R.jpg);
}
body.lang-es .t-what .list .item:nth-child(2) .top::before {
  background-image: url(../images/es/seigaiha.jpg);
}
.t-what .list .item:nth-child(2) .top::after {
  background: linear-gradient(to right, rgba(0, 64, 113, 0) 0%, rgba(0, 64, 113, 0) 32%, #004071 52%, #004071 100%);
}
@media only screen and (max-width: 750px) {
  .t-what .list .item:nth-child(2) .top::after {
    background: linear-gradient(to bottom, rgba(0, 64, 113, 0) 0%, rgba(0, 64, 113, 0) 10%, #004071 35%, #004071 100%);
  }
}
body.lang-ch .t-what .list .item:nth-child(2) .top::after {
  background: linear-gradient(to right, rgba(113, 34, 0, 0) 0%, rgba(113, 34, 0, 0) 32%, #712200 52%, #712200 100%);
}
@media only screen and (max-width: 750px) {
  body.lang-ch .t-what .list .item:nth-child(2) .top::after {
    background: linear-gradient(to bottom, rgba(113, 34, 0, 0) 0%, rgba(113, 34, 0, 0) 10%, #712200 35%, #712200 100%);
  }
}
body.lang-es .t-what .list .item:nth-child(2) .top::after {
  background: linear-gradient(to right, rgba(177, 131, 11, 0.6) 0%, #b1830b 100%);
}
@media only screen and (max-width: 750px) {
  body.lang-es .t-what .list .item:nth-child(2) .top::after {
    background: linear-gradient(to bottom, rgba(177, 131, 11, 0.6) 0%, #b1830b 100%);
  }
}
@media only screen and (max-width: 750px) {
  .t-what .list .item:nth-child(2) .top .title h3 {
    font-size: 1.1rem;
    letter-spacing: 0;
  }
}
.t-what .list .item:nth-child(2) .hide-box .inner::before {
  background-image: url(../images/top/seigaiha_B.jpg);
}
body.lang-ch .t-what .list .item:nth-child(2) .hide-box .inner::before {
  background-image: url(../images/top/seigaiha_R.jpg);
}
body.lang-es .t-what .list .item:nth-child(2) .hide-box .inner::before {
  background-image: url(../images/es/seigaiha.jpg);
}
.t-what .list .item:nth-child(2) .hide-box .inner::after {
  background: linear-gradient(to top, rgba(0, 64, 113, 0.6) 0%, rgba(0, 64, 113, 0.6) 10%, #004071 20%, #004071 100%);
}
body.lang-ch .t-what .list .item:nth-child(2) .hide-box .inner::after {
  background: linear-gradient(to top, rgba(113, 34, 0, 0.6) 0%, rgba(113, 34, 0, 0.6) 15%, #712200 25%, #712200 100%);
}
body.lang-es .t-what .list .item:nth-child(2) .hide-box .inner::after {
  background: linear-gradient(to top, rgba(177, 131, 11, 0.6) 0%, #b1830b 100%);
}
.t-what .list .item:nth-child(3) .top::before {
  background-image: url(../images/top/seigaiha_R.jpg);
}
body.lang-es .t-what .list .item:nth-child(3) .top::before {
  background-image: url(../images/es/seigaiha.jpg);
}
.t-what .list .item:nth-child(3) .top::after {
  background: linear-gradient(to right, rgba(113, 34, 0, 0) 0%, rgba(113, 34, 0, 0) 32%, #712200 52%, #712200 100%);
}
@media only screen and (max-width: 750px) {
  .t-what .list .item:nth-child(3) .top::after {
    background: linear-gradient(to bottom, rgba(113, 34, 0, 0) 0%, rgba(113, 34, 0, 0) 10%, #712200 35%, #712200 100%);
  }
}
body.lang-es .t-what .list .item:nth-child(3) .top::after {
  background: linear-gradient(to right, rgba(177, 131, 11, 0.6) 0%, #b1830b 100%);
}
@media only screen and (max-width: 750px) {
  body.lang-es .t-what .list .item:nth-child(3) .top::after {
    background: linear-gradient(to bottom, rgba(177, 131, 11, 0.6) 0%, #b1830b 100%);
  }
}
.t-what .list .item:nth-child(3) .hide-box .inner::before {
  background-image: url(../images/top/seigaiha_R.jpg);
}
body.lang-es .t-what .list .item:nth-child(3) .hide-box .inner::before {
  background-image: url(../images/top/seigaiha_R.jpg);
}
.t-what .list .item:nth-child(3) .hide-box .inner::after {
  background: linear-gradient(to top, rgba(113, 34, 0, 0.6) 0%, rgba(113, 34, 0, 0.6) 15%, #712200 25%, #712200 100%);
}
body.lang-es .t-what .list .item:nth-child(3) .hide-box .inner::after {
  background: linear-gradient(to top, rgba(177, 131, 11, 0.6) 0%, #b1830b 100%);
}
.t-what .list .item .top {
  padding: 30px 45px 25px;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  z-index: 1;
  cursor: pointer;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .top {
    padding: 20px 10px;
    display: block;
  }
}
.t-what .list .item .top::before {
  content: " ";
  display: block;
  width: 100%;
  height: 100%;
  background: url(../images/top/seigaiha_Y.jpg) -1px -1px/618px auto repeat;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -2;
}
body.lang-ch .t-what .list .item .top::before {
  background: url(../images/top/seigaiha_R.jpg) -1px -1px/618px auto repeat;
}
body.lang-es .t-what .list .item .top::before {
  background-image: url(../images/es/seigaiha.jpg) -1px -1px/618px auto repeat;
}
.t-what .list .item .top::after {
  content: " ";
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(to right, rgba(151, 122, 0, 0) 0%, rgba(151, 122, 0, 0) 32%, #977a00 52%, #977a00 100%);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .top::after {
    background: linear-gradient(to bottom, rgba(151, 122, 0, 0) 0%, rgba(151, 122, 0, 0) 10%, #977a00 35%, #977a00 100%);
  }
}
body.lang-ch .t-what .list .item .top::after {
  background: linear-gradient(to right, rgba(113, 34, 0, 0) 0%, rgba(113, 34, 0, 0) 32%, #712200 52%, #712200 100%);
}
@media only screen and (max-width: 750px) {
  body.lang-ch .t-what .list .item .top::after {
    background: linear-gradient(to bottom, rgba(113, 34, 0, 0) 0%, rgba(113, 34, 0, 0) 10%, #712200 35%, #712200 100%);
  }
}
body.lang-es .t-what .list .item .top::after {
  background: linear-gradient(to right, rgba(177, 131, 11, 0.6) 0%, #b1830b 100%);
}
@media only screen and (max-width: 750px) {
  body.lang-es .t-what .list .item .top::after {
    background: linear-gradient(to bottom, rgba(177, 131, 11, 0.6) 0%, #b1830b 100%);
  }
}
.t-what .list .item .top .title {
  width: 36.25%;
  text-align: center;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .top .title {
    width: auto;
    max-width: 110px;
    margin: 0 auto 25px;
  }
}
.t-what .list .item .top .title h3 {
  font-family: "din-2014", sans-serif;
  font-size: 2.2rem;
  font-weight: 700;
  letter-spacing: 0;
  color: #000;
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  text-align: center;
  margin-top: -17%;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .top .title h3 {
    font-size: 1.5rem;
    margin-top: -20px;
  }
}
.t-what .list .item .top .textbody {
  padding: 20px 0 50px;
  width: 51.5625%;
  line-height: 1.75;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .top .textbody {
    padding: 0 0 35px;
    width: auto;
    font-size: 1.4rem;
    line-height: 1.6428571429;
  }
}
.t-what .list .item .top .textbody button {
  position: absolute;
  bottom: 5px;
  left: 50%;
  margin-left: -22px;
  transition: 0.3s ease-out;
}
@media only screen and (min-width: 751px) {
  .t-what .list .item .top .textbody button:hover {
    opacity: 0.7;
  }
}
.t-what .list .item .top .textbody button.opened {
  transform: rotate(180deg);
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .top .textbody button {
    bottom: 0;
    width: 30px;
    margin-left: -15px;
  }
}
.t-what .list .item .hide-box {
  display: none;
}
.t-what .list .item .hide-box .inner {
  padding: 40px 45px 33px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .hide-box .inner {
    padding: 5px 10px 19px;
  }
}
.t-what .list .item .hide-box .inner::before {
  content: " ";
  display: block;
  width: 100%;
  height: 100%;
  background: url(../images/top/seigaiha_Y.jpg) -1px -1px/618px auto repeat;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -2;
  opacity: 0.8;
}
body.lang-ch .t-what .list .item .hide-box .inner::before {
  background: url(../images/top/seigaiha_R.jpg) -1px -1px/618px auto repeat;
}
body.lang-es .t-what .list .item .hide-box .inner::before {
  background-image: url(../images/es/seigaiha.jpg) -1px -1px/618px auto repeat;
}
.t-what .list .item .hide-box .inner::after {
  content: " ";
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top, rgba(151, 122, 0, 0.6) 0%, rgba(151, 122, 0, 0.6) 10%, #977a00 20%, #977a00 100%);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
body.lang-ch .t-what .list .item .hide-box .inner::after {
  background: linear-gradient(to top, rgba(113, 34, 0, 0.6) 0%, rgba(113, 34, 0, 0.6) 15%, #712200 25%, #712200 100%);
}
body.lang-es .t-what .list .item .hide-box .inner::after {
  background: linear-gradient(to top, rgba(177, 131, 11, 0.6) 0%, #b1830b 100%);
}
.t-what .list .item .hide-box h4 {
  font-size: 1.9rem;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .hide-box h4 {
    font-size: 1.7rem;
  }
}
.t-what .list .item .hide-box p {
  margin-bottom: 40px;
  line-height: 1.875;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .hide-box p {
    margin-bottom: 25px;
    font-size: 1.4rem;
    line-height: 1.6428571429;
  }
}
.t-what .list .item .hide-box p.what_annote {
  font-size: 1rem;
  color: #977a00;
  text-align: right;
  line-height: 1.5;
}
body.lang-es .t-what .list .item .hide-box p.what_annote {
  color: #dbcea8;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .hide-box p.what_annote {
    margin-top: 15px;
  }
}
.t-what .list .item .hide-box .graf {
  padding-bottom: 25px;
  text-align: center;
  background-color: #712200;
  margin-bottom: 30px;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .hide-box .graf {
    padding: 0 5px 12px;
    margin: 0 -5px 10px;
  }
}
body.lang-es .t-what .list .item .hide-box .graf {
  background-color: transparent;
}
.t-what .list .item .hide-box .graf figure {
  margin-bottom: 35px;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .hide-box .graf figure {
    margin-bottom: 20px;
  }
}
.t-what .list .item .hide-box .graf figure:last-child {
  margin-bottom: 0;
}
.t-what .list .item .hide-box .what-icon figure {
  width: 183px;
  margin: 20px auto;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .hide-box .what-icon figure {
    width: 145px;
  }
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .hide-box .swiper {
    margin: 0 -10px;
  }
}
.t-what .list .item .hide-box .swiper-slide {
  width: 201px;
  background-color: #fff;
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .hide-box .swiper-slide {
    width: auto;
  }
}
.t-what .list .item .hide-box .swiper-slide a {
  transition: 0.3s ease-out;
}
@media only screen and (min-width: 751px) {
  .t-what .list .item .hide-box .swiper-slide a:hover {
    opacity: 0.7;
  }
}
.t-what .list .item .hide-box .button {
  margin-top: 33px;
  text-align: center;
  transform: rotate(180deg);
}
@media only screen and (max-width: 750px) {
  .t-what .list .item .hide-box .button {
    margin: 20px auto 0;
    width: 30px;
  }
}
.t-what .list .item .hide-box .button button {
  transition: 0.3s ease-out;
}
@media only screen and (min-width: 751px) {
  .t-what .list .item .hide-box .button button:hover {
    opacity: 0.7;
  }
}

.t-movies {
  padding: 90px 0;
  background: #66a39e;
}
body.lang-es .t-movies {
  background: #b4984c;
}
body.lang-ch .t-movies {
  background: #ac781a;
}
.t-movies .movie-list {
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-flow: row nowrap;
  gap: 40px;
}
@media only screen and (max-width: 750px) {
  .t-movies .movie-list {
    display: block;
  }
}
.t-movies .movie-list > li {
  width: calc(50% - 20px);
}
@media only screen and (max-width: 750px) {
  .t-movies .movie-list > li {
    width: 100%;
    margin-bottom: 20px;
  }
  .t-movies .movie-list > li:last-child {
    margin-bottom: 0;
  }
}

.t-area {
  padding: 186px 0 90px;
  background: url("../images/top/area_bg01.svg") left -19px top 537px no-repeat;
}
body.lang-ch .t-area {
  background: url("../images/ch/area_bg01.svg") left -19px top 537px no-repeat;
}
@media only screen and (max-width: 750px) {
  body.lang-ch .t-area {
    background-size: 85px auto;
    background-position: left -32px top 334px;
  }
}
@media only screen and (max-width: 750px) {
  .t-area {
    padding: 86px 0 50px;
    background-size: 85px auto;
    background-position: left -32px top 334px;
  }
}
.t-area > .innerArea {
  position: relative;
}
.t-area > .innerArea::before, .t-area > .innerArea::after {
  content: " ";
  display: block;
  position: absolute;
  background-color: #b4984c;
}
body.lang-ch .t-area > .innerArea::before, body.lang-ch .t-area > .innerArea::after {
  background-color: #ac781a;
}
.t-area > .innerArea::before {
  width: 192px;
  height: 2px;
  top: -80px;
  left: -44px;
}
@media only screen and (max-width: 750px) {
  .t-area > .innerArea::before {
    width: 70px;
    height: 1px;
    top: -36px;
    left: 10px;
  }
}
.t-area > .innerArea::after {
  width: 2px;
  height: 421px;
  top: -134px;
  left: -2px;
}
@media only screen and (max-width: 750px) {
  .t-area > .innerArea::after {
    width: 1px;
    height: 118px;
    top: -50px;
    left: 19px;
  }
}
.t-area .boxInner {
  max-width: 730px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 750px) {
  .t-area .boxInner {
    padding: 0 20px;
  }
}
.t-area .boxInner::before {
  content: " ";
  display: block;
  width: 198px;
  height: 750px;
  background: url(../images/top/area_bg.svg) center no-repeat;
  position: absolute;
  top: -114px;
  right: -177px;
  z-index: -1;
}
@media only screen and (max-width: 750px) {
  .t-area .boxInner::before {
    width: 60px;
    height: 230px;
    background-size: 60px auto;
    top: -56px;
    right: -10px;
  }
}
body.lang-ch .t-area .boxInner::before {
  background: url(../images/ch/area_bg.svg) center no-repeat;
  opacity: 0.5;
  mix-blend-mode: multiply;
}
@media only screen and (max-width: 750px) {
  body.lang-ch .t-area .boxInner::before {
    width: 60px;
    height: 230px;
    background-size: 60px auto;
    top: -56px;
    right: -10px;
  }
}
body.lang-es .t-area .boxInner::before {
  background: url(../images/es/area_bg.svg) center no-repeat;
}
@media only screen and (max-width: 750px) {
  body.lang-es .t-area .boxInner::before {
    width: 60px;
    height: 230px;
    background-size: 60px auto;
    top: -56px;
    right: -10px;
  }
}
.t-area .t-title {
  margin-bottom: 55px;
}
@media only screen and (max-width: 750px) {
  .t-area .t-title {
    margin-bottom: 25px;
  }
}
.t-area .text01 {
  margin-bottom: 80px;
  max-width: 472px;
  line-height: 1.875;
}
@media only screen and (max-width: 750px) {
  .t-area .text01 {
    margin-bottom: 30px;
    max-width: inherit;
    line-height: 1.7333333333;
  }
}
.t-area .map {
  max-width: 713px;
  margin-left: 6.2893081761%;
  line-height: 0;
}
@media only screen and (max-width: 750px) {
  .t-area .map {
    max-width: inherit;
    margin-left: 0;
  }
}
.t-area .map svg {
  max-width: 100%;
}
.t-area .map svg .cursor {
  cursor: pointer;
  transition: 0.3s ease-out;
}
.t-area .map svg .cursor.current.text {
  fill: #b1830b !important;
}
body.lang-ch .t-area .map svg .cursor.current.text {
  fill: #802600 !important;
}
body.lang-es .t-area .map svg .cursor.current.text {
  fill: #b1830b !important;
}
.t-area .map svg .cursor.current.kenline {
  stroke: #b1830b !important;
}
body.lang-ch .t-area .map svg .cursor.current.kenline {
  fill: #802600 !important;
}
body.lang-es .t-area .map svg .cursor.current.kenline {
  fill: #b1830b !important;
}
.t-area .map svg .cursor.current.ken {
  fill: #b1830b !important;
}
body.lang-ch .t-area .map svg .cursor.current.ken {
  fill: #802600 !important;
}
body.lang-es .t-area .map svg .cursor.current.ken {
  fill: #b1830b !important;
}
.t-area .graf {
  margin: 105px auto 0;
  max-width: 827px;
  text-align: center;
}
@media only screen and (max-width: 750px) {
  .t-area .graf {
    margin-top: 36px;
    max-width: inherit;
  }
}
@media only screen and (max-width: 500px) {
  .t-area .graf {
    margin-top: 0;
  }
}
@media only screen and (max-width: 400px) {
  .t-area .graf {
    margin-top: -10%;
  }
}

.t-cooking {
  padding: 187px 0 134px;
  background-color: #88c4bf;
}
body.lang-ch .t-cooking {
  background: transparent;
  position: relative;
}
body.lang-ch .t-cooking::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #986a00;
  opacity: 0.4;
  mix-blend-mode: multiply;
  z-index: -2;
}
body.lang-es .t-cooking {
  background: #e6dfc4;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .t-cooking {
    padding: 60px 0 50px;
  }
}
.t-cooking .boxInner {
  max-width: 824px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.t-cooking .boxInner::before {
  content: " ";
  display: block;
  width: 198px;
  height: 756px;
  background: url(../images/top/cooking_bg.svg) center no-repeat;
  position: absolute;
  top: -70px;
  left: -145px;
  z-index: -1;
}
@media only screen and (max-width: 750px) {
  .t-cooking .boxInner::before {
    display: none;
  }
}
body.lang-ch .t-cooking .boxInner::before {
  background: url(../images/ch/cooking_bg.svg) center no-repeat;
  opacity: 0.5;
  mix-blend-mode: multiply;
  z-index: 0;
}
body.lang-es .t-cooking .boxInner::before {
  background: url(../images/es/cooking_bg.svg) center no-repeat;
}
.t-cooking .t-title {
  text-align: center;
  margin-bottom: 32px;
  position: relative;
}
body.lang-ch .t-cooking .t-title {
  color: #fff;
}
@media only screen and (max-width: 750px) {
  .t-cooking .t-title {
    margin-bottom: 22px;
    padding: 0 10px;
  }
}
.t-cooking .t-title::before, .t-cooking .t-title::after {
  content: " ";
  display: block;
  position: absolute;
  background-color: #977a00;
}
body.lang-ch .t-cooking .t-title::before, body.lang-ch .t-cooking .t-title::after {
  background-color: #c9941a;
}
.t-cooking .t-title::before {
  width: 246px;
  height: 2px;
  top: -2px;
  right: -124px;
}
@media only screen and (max-width: 750px) {
  .t-cooking .t-title::before {
    width: 110px;
    height: 1px;
    top: -17px;
    right: -10px;
  }
}
.t-cooking .t-title::after {
  width: 2px;
  height: 415px;
  top: -58px;
  right: -82px;
}
@media only screen and (max-width: 750px) {
  .t-cooking .t-title::after {
    width: 1px;
    height: 50px;
    top: -30px;
    right: -1px;
  }
}
.t-cooking .t-lead {
  max-width: 576px;
  margin: 0 auto 80px;
  text-align: left;
}
@media only screen and (max-width: 750px) {
  .t-cooking .t-lead {
    margin-bottom: 40px;
  }
}
body.lang-ch .t-cooking .t-lead {
  color: #fff;
}
.t-cooking .movie-list {
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-flow: row wrap;
}
@media only screen and (max-width: 750px) {
  .t-cooking .movie-list {
    display: block;
  }
}
.t-cooking .movie-list > li {
  flex: 0 0 48%;
  margin-right: 4%;
  margin-bottom: 40px;
}
.t-cooking .movie-list > li:nth-child(2n) {
  margin-right: 0;
}
body.lang-ch .t-cooking .movie-list > li {
  color: #fff;
}
@media only screen and (max-width: 750px) {
  .t-cooking .movie-list > li {
    margin-right: 0;
  }
}
.t-cooking .movie-list > li .movie-title {
  margin-top: 7px;
  text-align: center;
  font-size: 2.2rem;
  margin-bottom: 15px;
}
.t-cooking .movie-list > li .ingredients {
  font-size: 1.4rem;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  padding: 10px 0 7px;
}
body.lang-ch .t-cooking .movie-list > li .ingredients {
  border-color: #fff;
}
.t-cooking .movie-list > li .ingredients .ingredients-title {
  font-weight: 700;
  margin-bottom: 7px;
  line-height: 1;
  position: relative;
}
.t-cooking .movie-list > li .ingredients .ingredients-title::after {
  font-family: "Material Symbols Outlined";
  content: "\e147";
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 48;
  display: block;
  font-size: 1.5em;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  transition: 0.3s ease-out;
}
.t-cooking .movie-list > li .ingredients .ingredients-title.active::after {
  transform: translateY(-50%) rotate(-45deg);
}
.t-cooking .movie-list > li .ingredients .ingredients-title:hover {
  cursor: pointer;
}
.t-cooking .movie-list > li .ingredients .list-text {
  text-align: left;
  display: none;
}
.t-cooking .movie-list > li .ingredients .list-text .col2 {
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-flow: row nowrap;
  gap: 20px;
}

.t-definition {
  padding: 0 0 70px;
}
.t-definition .t-definition_list {
  padding: 103px 0 0;
  background: url("../images/top/area_bg02.svg") right 28px top 52px no-repeat, url("../images/top/area_bg03.svg") left -27px top 540px no-repeat;
}
body.lang-ch .t-definition .t-definition_list {
  background: url("../images/ch/area_bg02.svg") right 28px top 52px no-repeat, url("../images/ch/area_bg03.svg") left -27px top 540px no-repeat;
}
@media only screen and (max-width: 750px) {
  body.lang-ch .t-definition .t-definition_list {
    background-size: 60px auto, 85px auto;
    background-position: right 7px top 36px, left -11px bottom 16px;
  }
}
body.lang-es .t-definition .t-definition_list {
  background: url("../images/es/area_bg02.svg") right 28px top 52px no-repeat, url("../images/es/area_bg03.svg") left -27px top 540px no-repeat;
}
@media only screen and (max-width: 750px) {
  body.lang-es .t-definition .t-definition_list {
    background-size: 60px auto, 85px auto;
    background-position: right 7px top 36px, left -11px bottom 16px;
  }
}
@media only screen and (max-width: 750px) {
  .t-definition .t-definition_list {
    padding: 50px 0 30px;
    background-size: 60px auto, 85px auto;
    background-position: right 7px top 36px, left -11px bottom 16px;
  }
}
.t-definition .t-definition_list .t-area_swiper {
  margin: 0 -20px;
}
@media only screen and (min-width: 751px) {
  .t-definition .t-definition_list .t-area_swiper .swiper-wrapper {
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
  }
}
.t-definition .t-definition_list .t-area_swiper .item {
  flex-shrink: 1;
  width: 31.4465408805%;
  padding: 32px 25px 25px;
  margin-bottom: 30px;
  height: auto;
  background: url("../images/top/main_product_bg.png") center 0/100% auto no-repeat;
  background-color: #fff;
  color: #000;
  box-sizing: border-box;
}
body.lang-es .t-definition .t-definition_list .t-area_swiper .item {
  background: url("../images/es/main_product_bg.png") center 0/100% auto no-repeat;
  background-color: #f4f0e4;
}
@media only screen and (max-width: 750px) {
  .t-definition .t-definition_list .t-area_swiper .item {
    flex-shrink: 0;
    width: 100%;
    padding: 25px 25px 20px;
    margin-bottom: 0;
    background-size: 100% auto;
  }
}
@media only screen and (max-width: 300px) {
  .t-definition .t-definition_list .t-area_swiper .item {
    background-size: 300px auto;
  }
}
.t-definition .t-definition_list .t-area_swiper .item h3 {
  font-size: 2.2rem;
  font-weight: 500;
  text-align: center;
  line-height: 1.35;
  min-height: 2.7em;
  text-transform: uppercase;
}
@media only screen and (max-width: 750px) {
  .t-definition .t-definition_list .t-area_swiper .item h3 .fs {
    font-size: 1.8rem;
  }
}
.t-definition .t-definition_list .t-area_swiper .item figure {
  margin: -15px -25px -5px;
}
.t-definition .t-definition_list .t-area_swiper .item p {
  font-size: 1.4rem;
  letter-spacing: 0.015em;
  line-height: 1.6428571429;
}
.t-definition .t-definition_list .t-area_pagination {
  display: none;
  margin-top: 12px;
  text-align: center;
  line-height: 0;
}
@media only screen and (max-width: 750px) {
  .t-definition .t-definition_list .t-area_pagination {
    display: block;
  }
}
.t-definition .t-definition_list .t-area_pagination span {
  margin: 0 3px;
  width: 7px;
  height: 7px;
  box-sizing: border-box;
  opacity: 1;
  border: 1px solid #b1830b;
  border-radius: 50%;
  background-color: transparent;
}
.t-definition .t-definition_list .t-area_pagination span.swiper-pagination-bullet-active {
  background-color: #b1830b;
}

.t-association {
  padding: 100px 0 90px;
  position: relative;
}
@media only screen and (max-width: 750px) {
  .t-association {
    padding: 45px 0 42px;
  }
}
.t-association::before {
  content: " ";
  display: block;
  width: 100%;
  max-width: 954px;
  height: 2px;
  background-color: #b4984c;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0);
}
@media only screen and (max-width: 750px) {
  .t-association::before {
    width: 86.6666666667%;
    height: 1px;
  }
}
body.lang-ch .t-association::before {
  background-color: #ac781a;
}
.t-association .boxInner {
  max-width: 576px;
  margin: 0 auto;
}
@media only screen and (max-width: 750px) {
  .t-association .boxInner {
    padding: 0 20px;
  }
}
.t-association .t-title {
  margin-bottom: 50px;
  text-align: center;
}
@media only screen and (max-width: 750px) {
  .t-association .t-title {
    margin-bottom: 20px;
  }
}
.t-association p {
  line-height: 1.875;
}
@media only screen and (max-width: 750px) {
  .t-association p {
    line-height: 1.7333333333;
  }
}