@charset "UTF-8";
/* 768px
=================================================================== */
@media only screen and (max-width: 768px) {
  /* common
  =================================================================== */
  /* layout
  =================================================================== */
  /* background
  =================================================================== */
  /* flex
  =================================================================== */
  /* animation delay
  =================================================================== */
  /* 3d
  =================================================================== */
  /* font
  =================================================================== */
  /* vw
  =================================================================== */
  /* form
  =================================================================== */
  /* animation
  =================================================================== */
  .taittinger {
    /*================================================================================================================= top */
    /* スライド
    =================================================================== */
    /*ーーーーーーーーーーーーーーーーーーーー */ }
  @keyframes slideAnime2 {
    0% {
      transform: translate3d(0, 0, 0); }
    100% {
      transform: translate3d(-801px, 0, 0); } }
  @-webkit-keyframes slideAnime2 {
    0% {
      -webkit-transform: translate3d(0, 0, 0); }
    100% {
      -webkit-transform: translate3d(-801px, 0, 0); } }
    .taittinger.t_brandStory {
      /*ーーーーーーーーーーーーーーーーーーーー common */
      /*ーーーーーーーーーーーーーーーーーーーー kv */
      /*ーーーーーーーーーーーーーーーーーーーー section */
      /*ーーーーーーーーーーーーーーーーーーーー modal */ }
      .taittinger.t_brandStory .t_brandStory--title {
        margin-bottom: 24px; }
        .taittinger.t_brandStory .t_brandStory--title span {
          height: 16px; }
      .taittinger.t_brandStory .t_brandStory--dlText {
        padding: 0 35px; }
        .taittinger.t_brandStory .t_brandStory--dlText > dt {
          font-size: 15px; }
        .taittinger.t_brandStory .t_brandStory--dlText > dd {
          font-size: 12px; }
          .taittinger.t_brandStory .t_brandStory--dlText > dd > aside {
            font-size: 10px; }
      .taittinger.t_brandStory .t__wrapper .t__wrapper--contents .t__wrapper--contents--main--contents {
        height: 100%; }
        .taittinger.t_brandStory .t__wrapper .t__wrapper--contents .t__wrapper--contents--main--contents .t_brandStory__main--contents {
          width: calc(100% - 70px);
          text-align: center; }
          .taittinger.t_brandStory .t__wrapper .t__wrapper--contents .t__wrapper--contents--main--contents .t_brandStory__main--contents .t_brandStory__main--text {
            margin-bottom: 31px; }
            .taittinger.t_brandStory .t__wrapper .t__wrapper--contents .t__wrapper--contents--main--contents .t_brandStory__main--contents .t_brandStory__main--text dt {
              width: 250px;
              margin: 0 auto 20px; }
            .taittinger.t_brandStory .t__wrapper .t__wrapper--contents .t__wrapper--contents--main--contents .t_brandStory__main--contents .t_brandStory__main--text dd {
              font-size: 14px; }
          .taittinger.t_brandStory .t__wrapper .t__wrapper--contents .t__wrapper--contents--main--contents .t_brandStory__main--contents .btn.btn--frame.btn--play {
            width: 170px; }
            .taittinger.t_brandStory .t__wrapper .t__wrapper--contents .t__wrapper--contents--main--contents .t_brandStory__main--contents .btn.btn--frame.btn--play:before {
              left: 20px; }
            .taittinger.t_brandStory .t__wrapper .t__wrapper--contents .t__wrapper--contents--main--contents .t_brandStory__main--contents .btn.btn--frame.btn--play > span {
              padding-left: 22px; }
      .taittinger.t_brandStory .t_brandStory--section {
        padding-bottom: 70px;
        /*ーーーーーーーーーーーーーーーーーーーー concept */
        /*ーーーーーーーーーーーーーーーーーーーー comtes */
        /*ーーーーーーーーーーーーーーーーーーーー family */
        /*ーーーーーーーーーーーーーーーーーーーー history */
        /*ーーーーーーーーーーーーーーーーーーーー history */
        /*ーーーーーーーーーーーーーーーーーーーー art */
        /*ーーーーーーーーーーーーーーーーーーーー art */ }
        .taittinger.t_brandStory .t_brandStory--section.t_brandStory--family, .taittinger.t_brandStory .t_brandStory--section.t_brandStory--history, .taittinger.t_brandStory .t_brandStory--section.t_brandStory--gastronomes {
          padding-left: 0;
          padding-right: 0; }
        .taittinger.t_brandStory .t_brandStory--section.t_brandStory--concept .t_brandStory--concept--slide {
          margin-bottom: 40px; }
          .taittinger.t_brandStory .t_brandStory--section.t_brandStory--concept .t_brandStory--concept--slide .t_brandStory--concept--slide--contents > ul {
            width: 801px;
            -webkit-animation: slideAnime2 15s linear infinite;
            animation: slideAnime2 15s linear infinite; }
            .taittinger.t_brandStory .t_brandStory--section.t_brandStory--concept .t_brandStory--concept--slide .t_brandStory--concept--slide--contents > ul > li {
              width: 242px;
              margin-right: 25px; }
        .taittinger.t_brandStory .t_brandStory--section.t_brandStory--comtes {
          padding-top: 45px;
          padding-bottom: 100px;
          margin-bottom: 80px; }
          .taittinger.t_brandStory .t_brandStory--section.t_brandStory--comtes .t_brandStory--comtes--text {
            padding: 0 35px;
            font-size: 12px; }
          .taittinger.t_brandStory .t_brandStory--section.t_brandStory--comtes .t_brandStory--comtes--bg {
            background-image: url("../img/contents/brandstory/comtes--bg--sp.jpg"); }
        .taittinger.t_brandStory .t_brandStory--section.t_brandStory--family .t_youtube {
          margin-bottom: 30px; }
        .taittinger.t_brandStory .t_brandStory--section.t_brandStory--family .t_brandStory--family--main {
          padding: 0 35px;
          flex-direction: column; }
          .taittinger.t_brandStory .t_brandStory--section.t_brandStory--family .t_brandStory--family--main > img {
            width: 100%;
            margin-bottom: 15px; }
          .taittinger.t_brandStory .t_brandStory--section.t_brandStory--family .t_brandStory--family--main .t_brandStory--dlText {
            width: 100%;
            padding: 0; }
            .taittinger.t_brandStory .t_brandStory--section.t_brandStory--family .t_brandStory--family--main .t_brandStory--dlText > dt {
              text-align: center;
              font-size: 15px; }
            .taittinger.t_brandStory .t_brandStory--section.t_brandStory--family .t_brandStory--family--main .t_brandStory--dlText > dd {
              font-size: 12px; }
        .taittinger.t_brandStory .t_brandStory--section.t_brandStory--history {
          padding-left: 35px;
          padding-right: 35px; }
          .taittinger.t_brandStory .t_brandStory--section.t_brandStory--history > dl {
            flex-direction: column;
            margin-bottom: 35px; }
            .taittinger.t_brandStory .t_brandStory--section.t_brandStory--history > dl > dt {
              width: 100%;
              font-size: 14px;
              margin-bottom: 15px;
              padding-bottom: 12px;
              border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
            .taittinger.t_brandStory .t_brandStory--section.t_brandStory--history > dl > dd {
              width: 100%; }
              .taittinger.t_brandStory .t_brandStory--section.t_brandStory--history > dl > dd > div {
                width: 105px;
                margin-right: 20px;
                position: relative;
                top: 7px; }
                .taittinger.t_brandStory .t_brandStory--section.t_brandStory--history > dl > dd > div img {
                  margin-bottom: 15px; }
              .taittinger.t_brandStory .t_brandStory--section.t_brandStory--history > dl > dd p {
                font-size: 12px; }
        .taittinger.t_brandStory .t_brandStory--section.t_brandStory--chardnnay {
          padding-top: 45px;
          padding-bottom: 45px;
          margin-bottom: 70px; }
        .taittinger.t_brandStory .t_brandStory--section.t_brandStory--art .t_brandStory--art--slide {
          margin-bottom: 40px; }
          .taittinger.t_brandStory .t_brandStory--section.t_brandStory--art .t_brandStory--art--slide .slick-prev {
            left: 23%; }
          .taittinger.t_brandStory .t_brandStory--section.t_brandStory--art .t_brandStory--art--slide .slick-next {
            left: 77%; }
        .taittinger.t_brandStory .t_brandStory--section.t_brandStory--art .t_brandStory--art--product > dl > dt {
          width: 140px;
          margin: 0 auto 10px; }
        .taittinger.t_brandStory .t_brandStory--section.t_brandStory--art .t_brandStory--art--product > dl > dd {
          font-size: 11px; }
        .taittinger.t_brandStory .t_brandStory--section.t_brandStory--gastronomes .t_brandStory--gastronomes--img {
          padding: 0 35px;
          margin: 40px auto 35px; }
      .taittinger.t_brandStory .btn--close {
        top: 8px;
        right: 10px; }
        .taittinger.t_brandStory .btn--close:before, .taittinger.t_brandStory .btn--close:after {
          height: 1px;
          width: 25px; }
      .taittinger.t_brandStory .modal .modal__contents .modal__contents--main {
        width: calc(100% - 70px); } }