@charset "UTF-8";
body {
  width: 100%; }

/*スプラッシュ*/
.yt-logos-campbar23-splash {
  width: 100vw;
  height: 200vh;
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
  overflow: hidden; }
  @media only screen and (min-width: 769px) {
    .yt-logos-campbar23-splash {
      width: 100%; } }
  .yt-logos-campbar23-splash-movie {
    position: absolute;
    top: 50vh;
    left: 50%;
    transform: translate(-55%, -50%);
    min-width: 100%;
    min-height: 100vh; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23-splash-movie {
        transform: translate(-50%, -50%); } }

.yt-logos-campbar23 {
  /*キービジュアル*/
  /*いつでも、どこでもアウトドア気分を楽しめる Camp BARへようこそ！*/
  /* Camp BAR ヘッダー */
  /*キャンペーン*/
  /*アウトドアシーンをイメージしたワインカクテル*/
  /*さらにアウトドアカクテルが知りたい方はこちら*/
  /*アウトドアシーンに合わせて
  楽しみたいワインカクテルと
  料理のペアリング インデックスまで*/
  /*アウトドアシーンに合わせて
  楽しみたいワインカクテルと
  料理のペアリング コンテンツ*/
  /*レシピ開発プロフィール*/
  /*LOGOSで楽しむ[イエローテイル]との*/
  /*ラインナップ*/
  /*Camp BAR ギア*/
  /*レシピ詳細*/
  /*モーダル背景*/ }
  .yt-logos-campbar23 h1, .yt-logos-campbar23 h2, .yt-logos-campbar23 h3, .yt-logos-campbar23 div, .yt-logos-campbar23 p, .yt-logos-campbar23 ul, .yt-logos-campbar23 li {
    margin: 0;
    padding: 0;
    box-sizing: border-box; }
  .yt-logos-campbar23 li {
    list-style: none; }
  .yt-logos-campbar23 img {
    max-width: inherit;
    max-height: inherit;
    width: 100%;
    height: auto;
    line-height: 0;
    vertical-align: bottom; }
  @media only screen and (min-width: 769px) {
    .yt-logos-campbar23 a img {
      transition: all 0.3s ease; } }
  @media only screen and (min-width: 769px) {
    .yt-logos-campbar23 a:hover img {
      opacity: 0.7; } }
  .yt-logos-campbar23 sup {
    font-size: 0.7em; }
  .yt-logos-campbar23 .pcOnly {
    display: none; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .pcOnly {
        display: inline; } }
  .yt-logos-campbar23 .spOnly {
    display: inline; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .spOnly {
        display: none; } }
  .yt-logos-campbar23 .fadestart {
    filter: brightness(0.3);
    transition: all 1s ease; }
    .yt-logos-campbar23 .fadestart.active {
      filter: brightness(1); }
  .yt-logos-campbar23 .kv {
    position: relative;
    width: 100vw;
    height: 54.533vw;
    background-image: url("../img/bg_mv_sp.png");
    background-position: top center;
    background-size: 100% auto;
    background-repeat: no-repeat; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .kv {
        width: 1080px;
        height: calc(723/ 1200 * 1080px);
        background-image: url("../img/bg_mv_pc.png");
        background-size: auto 100%; } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .kv {
        width: 100%;
        height: calc(723/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .kv {
        height: 723px;
        background-size: auto; } }
    @media only screen and (min-width: 2000px) {
      .yt-logos-campbar23 .kv {
        background-size: cover; } }
    .yt-logos-campbar23 .kv-inner {
      position: relative;
      width: 100vw;
      /*玉ボケ*/ }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .kv-inner {
          width: 1080px; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .kv-inner {
          width: 100%; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .kv-inner {
          width: 1200px;
          margin: 0 auto; } }
      .yt-logos-campbar23 .kv-inner-neon, .yt-logos-campbar23 .kv-inner-neon2, .yt-logos-campbar23 .kv-inner-lead {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: auto; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .kv-inner-neon, .yt-logos-campbar23 .kv-inner-neon2, .yt-logos-campbar23 .kv-inner-lead {
            width: 1080px; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .kv-inner-neon, .yt-logos-campbar23 .kv-inner-neon2, .yt-logos-campbar23 .kv-inner-lead {
            width: 100%; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .kv-inner-neon, .yt-logos-campbar23 .kv-inner-neon2, .yt-logos-campbar23 .kv-inner-lead {
            width: 1200px; } }
      .yt-logos-campbar23 .kv-inner .lit {
        opacity: 0.5; }
        .yt-logos-campbar23 .kv-inner .lit.active {
          animation: lit 1.75s linear forwards; }
@keyframes lit {
  0% {
    opacity: 0.3; }
  15% {
    opacity: 0.3; }
  20% {
    opacity: 1; }
  25% {
    opacity: 0.3; }
  50% {
    opacity: 0.3; }
  55% {
    opacity: 1; }
  65% {
    opacity: 1; }
  75% {
    opacity: 0.3; }
  80% {
    opacity: 1; }
  100% {
    opacity: 1; } }
      .yt-logos-campbar23 .kv-inner .fluctuation.active {
        animation: fluctuation 2.5s ease infinite; }
@keyframes fluctuation {
  0% {
    filter: blur(0);
    opacity: 1; }
  16.66% {
    filter: blur(3px);
    opacity: 0.8; }
  33.33% {
    filter: blur(3px);
    opacity: 1; }
  50% {
    filter: blur(0);
    opacity: 1; }
  66.66% {
    filter: blur(2);
    opacity: 1; }
  83.32% {
    filter: blur(2);
    opacity: 0.9; }
  100% {
    filter: blur(0);
    opacity: 1; } }
      .yt-logos-campbar23 .kv-inner-title {
        position: absolute;
        top: 16.5vw;
        left: 18.66vw;
        width: 62.1vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .kv-inner-title {
            top: calc(220/ 1200 * 1080px);
            left: calc(170/ 1200 * 1080px);
            width: calc(858/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .kv-inner-title {
            top: calc(220/ 1200 * 100vw);
            left: calc(170/ 1200 * 100vw);
            width: calc(858/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .kv-inner-title {
            top: 220px;
            left: 170px;
            width: 858px; } }
        .yt-logos-campbar23 .kv-inner-title span {
          display: block;
          position: absolute;
          top: 0;
          left: 0; }
      .yt-logos-campbar23 .kv-inner .tamaboke {
        position: absolute;
        width: 100%;
        height: 100%; }
        .yt-logos-campbar23 .kv-inner .tamaboke li {
          position: absolute; }
          .yt-logos-campbar23 .kv-inner .tamaboke li img {
            mix-blend-mode: screen; }
        .yt-logos-campbar23 .kv-inner .tamaboke-01 {
          width: 5.866vw;
          top: 14.8vw;
          left: 9.866vw; }
        .yt-logos-campbar23 .kv-inner .tamaboke-02 {
          width: 4.8vw;
          top: 17.2vw;
          left: 12.93vw; }
        .yt-logos-campbar23 .kv-inner .tamaboke-03 {
          width: 2.666vw;
          top: 14.266vw;
          left: 16.533vw; }
        .yt-logos-campbar23 .kv-inner .tamaboke-04 {
          width: 6.666vw;
          top: 27vw;
          left: 5.466vw; }
        .yt-logos-campbar23 .kv-inner .tamaboke-05 {
          width: 3.733vw;
          top: 26.933vw;
          left: 3.733vw; }
        .yt-logos-campbar23 .kv-inner .tamaboke-06 {
          width: 6.266vw;
          top: 42.8vw;
          left: 35.6vw; }
        .yt-logos-campbar23 .kv-inner .tamaboke-07 {
          width: 3.333vw;
          top: 46.8vw;
          left: 39.066vw; }
        .yt-logos-campbar23 .kv-inner .tamaboke-08 {
          width: 5.866vw;
          top: 26.266vw;
          right: 8.666vw; }
        .yt-logos-campbar23 .kv-inner .tamaboke-09 {
          width: 4.8vw;
          top: 28vw;
          right: 6.666vw; }
        .yt-logos-campbar23 .kv-inner .tamaboke-10 {
          width: 5.466vw;
          top: 46.8vw;
          right: 6vw; }
        .yt-logos-campbar23 .kv-inner .tamaboke-11 {
          width: 3.333vw;
          top: 46.8vw;
          right: 2.4vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .kv-inner .tamaboke-01 {
            width: calc(73/ 1200 * 1080px);
            top: calc(98/ 1200 * 1080px);
            left: calc(76/ 1200 * 1080px); }
          .yt-logos-campbar23 .kv-inner .tamaboke-02 {
            width: calc(58/ 1200 * 1080px);
            top: calc(128/ 1200 * 1080px);
            left: calc(120/ 1200 * 1080px); }
          .yt-logos-campbar23 .kv-inner .tamaboke-03 {
            width: calc(35/ 1200 * 1080px);
            top: calc(87/ 1200 * 1080px);
            left: calc(164/ 1200 * 1080px); }
          .yt-logos-campbar23 .kv-inner .tamaboke-04 {
            width: calc(86/ 1200 * 1080px);
            top: calc(319/ 1200 * 1080px);
            left: calc(21/ 1200 * 1080px); }
          .yt-logos-campbar23 .kv-inner .tamaboke-05 {
            width: calc(47/ 1200 * 1080px);
            top: calc(368/ 1200 * 1080px);
            left: calc(0/ 1200 * 1080px); }
          .yt-logos-campbar23 .kv-inner .tamaboke-06 {
            width: calc(80/ 1200 * 1080px);
            top: calc(572/ 1200 * 1080px);
            left: calc(414/ 1200 * 1080px); }
          .yt-logos-campbar23 .kv-inner .tamaboke-07 {
            width: calc(44/ 1200 * 1080px);
            top: calc(622/ 1200 * 1080px);
            left: calc(460/ 1200 * 1080px); }
          .yt-logos-campbar23 .kv-inner .tamaboke-08 {
            width: calc(72/ 1200 * 1080px);
            top: calc(358/ 1200 * 1080px);
            right: calc(64/ 1200 * 1080px); }
          .yt-logos-campbar23 .kv-inner .tamaboke-09 {
            width: calc(63/ 1200 * 1080px);
            top: calc(379/ 1200 * 1080px);
            right: calc(33/ 1200 * 1080px); }
          .yt-logos-campbar23 .kv-inner .tamaboke-10 {
            width: calc(70/ 1200 * 1080px);
            top: calc(599/ 1200 * 1080px);
            right: calc(45/ 1200 * 1080px); }
          .yt-logos-campbar23 .kv-inner .tamaboke-11 {
            width: calc(43/ 1200 * 1080px);
            top: calc(599/ 1200 * 1080px);
            right: calc(0/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .kv-inner .tamaboke-01 {
            width: calc(73/ 1200 * 100vw);
            top: calc(98/ 1200 * 100vw);
            left: calc(76/ 1200 * 100vw); }
          .yt-logos-campbar23 .kv-inner .tamaboke-02 {
            width: calc(58/ 1200 * 100vw);
            top: calc(128/ 1200 * 100vw);
            left: calc(120/ 1200 * 100vw); }
          .yt-logos-campbar23 .kv-inner .tamaboke-03 {
            width: calc(35/ 1200 * 100vw);
            top: calc(87/ 1200 * 100vw);
            left: calc(164/ 1200 * 100vw); }
          .yt-logos-campbar23 .kv-inner .tamaboke-04 {
            width: calc(86/ 1200 * 100vw);
            top: calc(319/ 1200 * 100vw);
            left: calc(21/ 1200 * 100vw); }
          .yt-logos-campbar23 .kv-inner .tamaboke-05 {
            width: calc(47/ 1200 * 100vw);
            top: calc(368/ 1200 * 100vw);
            left: calc(0/ 1200 * 100vw); }
          .yt-logos-campbar23 .kv-inner .tamaboke-06 {
            width: calc(80/ 1200 * 100vw);
            top: calc(572/ 1200 * 100vw);
            left: calc(414/ 1200 * 100vw); }
          .yt-logos-campbar23 .kv-inner .tamaboke-07 {
            width: calc(44/ 1200 * 100vw);
            top: calc(622/ 1200 * 100vw);
            left: calc(460/ 1200 * 100vw); }
          .yt-logos-campbar23 .kv-inner .tamaboke-08 {
            width: calc(72/ 1200 * 100vw);
            top: calc(358/ 1200 * 100vw);
            right: calc(64/ 1200 * 100vw); }
          .yt-logos-campbar23 .kv-inner .tamaboke-09 {
            width: calc(63/ 1200 * 100vw);
            top: calc(379/ 1200 * 100vw);
            right: calc(33/ 1200 * 100vw); }
          .yt-logos-campbar23 .kv-inner .tamaboke-10 {
            width: calc(70/ 1200 * 100vw);
            top: calc(599/ 1200 * 100vw);
            right: calc(45/ 1200 * 100vw); }
          .yt-logos-campbar23 .kv-inner .tamaboke-11 {
            width: calc(43/ 1200 * 100vw);
            top: calc(599/ 1200 * 100vw);
            right: calc(0/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .kv-inner .tamaboke-01 {
            width: 73px;
            top: 98px;
            left: 76px; }
          .yt-logos-campbar23 .kv-inner .tamaboke-02 {
            width: 58px;
            top: 128px;
            left: 120px; }
          .yt-logos-campbar23 .kv-inner .tamaboke-03 {
            width: 35px;
            top: 87px;
            left: 164px; }
          .yt-logos-campbar23 .kv-inner .tamaboke-04 {
            width: 86px;
            top: 319px;
            left: 21px; }
          .yt-logos-campbar23 .kv-inner .tamaboke-05 {
            width: 47px;
            top: 368px;
            left: 0px; }
          .yt-logos-campbar23 .kv-inner .tamaboke-06 {
            width: 80px;
            top: 572px;
            left: 414px; }
          .yt-logos-campbar23 .kv-inner .tamaboke-07 {
            width: 44px;
            top: 622px;
            left: 460px; }
          .yt-logos-campbar23 .kv-inner .tamaboke-08 {
            width: 72px;
            top: 358px;
            right: 64px; }
          .yt-logos-campbar23 .kv-inner .tamaboke-09 {
            width: 63px;
            top: 379px;
            right: 33px; }
          .yt-logos-campbar23 .kv-inner .tamaboke-10 {
            width: 70px;
            top: 599px;
            right: 45px; }
          .yt-logos-campbar23 .kv-inner .tamaboke-11 {
            width: 43px;
            top: 599px;
            right: 0px; } }
  .yt-logos-campbar23 .welcome {
    width: 100%;
    background-color: #f4f3ea; }
    .yt-logos-campbar23 .welcome-inner {
      overflow: hidden;
      position: relative;
      width: 100%; }
      .yt-logos-campbar23 .welcome-inner-ph {
        width: 100vw;
        height: 49.73vw;
        background: url("../img/scene01_sp.jpg") no-repeat;
        background-size: contain; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .welcome-inner-ph {
            width: 100%;
            height: calc(723/ 1200 * 1080px);
            background: url("../img/scene01_pc.jpg") no-repeat;
            background-size: auto 100%;
            background-position: top center; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .welcome-inner-ph {
            height: calc(723/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .welcome-inner-ph {
            height: 754px;
            background-image: image-set(url("../img/scene01_pc.jpg") 1x, url("../img/scene01_pc@2.jpg") 2x);
            background-image: -webkit-image-set(url("../img/scene01_pc.jpg") 1x, url("../img/scene01_pc@2.jpg") 2x);
            background-size: cover; } }
        @media only screen and (min-width: 2000px) {
          .yt-logos-campbar23 .welcome-inner-ph {
            background-position: center center;
            background-size: cover; } }
      .yt-logos-campbar23 .welcome-inner-catch {
        position: relative;
        width: 42.266vw;
        margin: -4vw 0 0 48vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .welcome-inner-catch {
            width: calc(584/ 1200 * 1080px);
            margin: calc(-95/ 1200 * 1080px) 0 0 49%; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .welcome-inner-catch {
            width: calc(584/ 1200 * 100vw);
            margin: calc(-95/ 1200 * 100vw) 0 0 49%; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .welcome-inner-catch {
            width: 584px;
            margin: -95px 0 0 49%; } }
      .yt-logos-campbar23 .welcome-inner-lead {
        position: relative;
        width: 56.533vw;
        margin: 5.6vw auto 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .welcome-inner-lead {
            width: calc(950/ 1200 * 1080px);
            margin: calc(145/ 1200 * 1080px) auto 0; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .welcome-inner-lead {
            width: calc(950/ 1200 * 100vw);
            margin: calc(145/ 1200 * 100vw) auto 0; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .welcome-inner-lead {
            width: 950px;
            margin: 145px auto 0; } }
      .yt-logos-campbar23 .welcome-inner-photo {
        display: flex;
        position: relative;
        overflow: hidden;
        width: 100vw;
        height: 26.13vw;
        margin: 9.733vw auto 0; }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .welcome-inner-photo {
            width: 100%;
            height: calc(316/ 1200 * 100vw);
            margin: calc(117/ 1200 * 100vw) auto 0; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .welcome-inner-photo {
            height: 316px;
            margin: 117px auto 0; } }
        .yt-logos-campbar23 .welcome-inner-photo img {
          height: 26.13vw;
          width: 254.4vw; }
          @media only screen and (min-width: 1080px) {
            .yt-logos-campbar23 .welcome-inner-photo img {
              height: calc(316/ 1200 * 100vw);
              width: calc(1908/ 1200 * 100vw); } }
          @media only screen and (min-width: 1200px) {
            .yt-logos-campbar23 .welcome-inner-photo img {
              height: 316px;
              width: 1908px; } }
          .yt-logos-campbar23 .welcome-inner-photo img:first-child {
            animation: loop-ph 60s -30s linear infinite; }
            @media only screen and (min-width: 1080px) {
              .yt-logos-campbar23 .welcome-inner-photo img:first-child {
                animation: loop-ph 80s -40s linear infinite; } }
          .yt-logos-campbar23 .welcome-inner-photo img:last-child {
            animation: loop-ph2 60s linear infinite; }
            @media only screen and (min-width: 1080px) {
              .yt-logos-campbar23 .welcome-inner-photo img:last-child {
                animation: loop-ph2 80s linear infinite; } }
@keyframes loop-ph {
  0% {
    transform: translateX(-100%); }
  to {
    transform: translateX(100%); } }
@keyframes loop-ph2 {
  0% {
    transform: translateX(-200%); }
  to {
    transform: translateX(0); } }
      .yt-logos-campbar23 .welcome-inner-suggest {
        position: relative;
        width: 100vw;
        margin: 18.133vw 0 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .welcome-inner-suggest {
            height: calc(974/ 1200 * 1080px);
            margin: calc(92/ 1200 * 1080px) auto 0; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .welcome-inner-suggest {
            width: 100%;
            height: calc(974/ 1200 * 100vw);
            margin: calc(92/ 1200 * 100vw) auto 0; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .welcome-inner-suggest {
            width: 1200px;
            height: 974px;
            margin: 92px auto 0; } }
        .yt-logos-campbar23 .welcome-inner-suggest-text {
          font-size: 3.2vw;
          font-weight: bold;
          line-height: 2.25;
          color: #744E33;
          text-align: center;
          letter-spacing: 0.25em; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .welcome-inner-suggest-text {
              margin: 0 auto;
              padding-top: calc(223/ 1200 * 1080px);
              font-size: calc(24/ 1200 * 1080px); } }
          @media only screen and (min-width: 1080px) {
            .yt-logos-campbar23 .welcome-inner-suggest-text {
              padding-top: calc(223/ 1200 * 100vw);
              font-size: calc(24/ 1200 * 100vw); } }
          @media only screen and (min-width: 1200px) {
            .yt-logos-campbar23 .welcome-inner-suggest-text {
              padding-top: 223px;
              font-size: 24px; } }
        .yt-logos-campbar23 .welcome-inner-suggest-text2 {
          margin: 22.66vw auto 12vw;
          width: 61.73vw; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .welcome-inner-suggest-text2 {
              margin: calc(85/ 1200 * 1080px) auto calc(70/ 1200 * 1080px);
              width: calc(736/ 1200 * 1080px); } }
          @media only screen and (min-width: 1080px) {
            .yt-logos-campbar23 .welcome-inner-suggest-text2 {
              margin: calc(85/ 1200 * 100vw) auto calc(70/ 1200 * 100vw);
              width: calc(736/ 1200 * 100vw); } }
          @media only screen and (min-width: 1200px) {
            .yt-logos-campbar23 .welcome-inner-suggest-text2 {
              margin: 85px auto 70px;
              width: 736px; } }
        .yt-logos-campbar23 .welcome-inner-suggest-illust1 {
          position: absolute;
          top: 17.466vw;
          left: 11.33vw;
          width: 9.2vw; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .welcome-inner-suggest-illust1 {
              top: 0;
              left: calc(19/ 1200 * 1080px);
              width: calc(183/ 1200 * 1080px); } }
          @media only screen and (min-width: 1080px) {
            .yt-logos-campbar23 .welcome-inner-suggest-illust1 {
              left: calc(19/ 1200 * 100vw);
              width: calc(183/ 1200 * 100vw); } }
          @media only screen and (min-width: 1200px) {
            .yt-logos-campbar23 .welcome-inner-suggest-illust1 {
              left: 19px;
              width: 183px; } }
        .yt-logos-campbar23 .welcome-inner-suggest-illust2 {
          position: absolute;
          top: 36vw;
          right: 5.33vw;
          width: 20.6vw; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .welcome-inner-suggest-illust2 {
              top: calc(660/ 1200 * 1080px);
              right: calc(-50/ 1200 * 1080px);
              width: calc(283/ 1200 * 1080px); } }
          @media only screen and (min-width: 1080px) {
            .yt-logos-campbar23 .welcome-inner-suggest-illust2 {
              top: calc(660/ 1200 * 100vw);
              right: calc(-50/ 1200 * 100vw);
              width: calc(283/ 1200 * 100vw); } }
          @media only screen and (min-width: 1200px) {
            .yt-logos-campbar23 .welcome-inner-suggest-illust2 {
              top: 660px;
              right: -50px;
              width: 283px; } }
  .yt-logos-campbar23 .cb-header {
    z-index: 10;
    position: fixed;
    top: -15vw;
    left: 0;
    width: 100vw;
    height: 14.933vw;
    background: url("../img/header_bg.png") no-repeat;
    background-size: 100% auto;
    transition: all 0.5s ease; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .cb-header {
        top: calc(-120/ 1200 * 1080px);
        width: 1080px;
        height: calc(120/ 1200 * 1080px);
        background-size: auto 100%;
        background-repeat: repeat-x;
        background-position: top center; } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .cb-header {
        top: calc(-120/ 1200 * 100vw);
        width: 100%;
        height: calc(120/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .cb-header {
        top: -120px;
        width: 100%;
        height: 120px;
        background-size: auto 100%; } }
    .yt-logos-campbar23 .cb-header.active {
      top: 0; }
      .yt-logos-campbar23 .cb-header.active .cb-header-inner-spot img,
      .yt-logos-campbar23 .cb-header.active .cb-header-inner-drink img {
        filter: brightness(1); }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .cb-header-inner {
        position: relative;
        width: calc(804/ 1200 * 1080px);
        margin: 0 auto; } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .cb-header-inner {
        width: calc(804/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .cb-header-inner {
        width: 804px; } }
    .yt-logos-campbar23 .cb-header-inner-spot, .yt-logos-campbar23 .cb-header-inner-drink {
      position: absolute;
      top: 0;
      left: 0; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .cb-header-inner-spot, .yt-logos-campbar23 .cb-header-inner-drink {
          width: 100%; } }
    .yt-logos-campbar23 .cb-header-inner-spot img {
      filter: brightness(0.5);
      transition: all 0.75s ease 1s; }
    .yt-logos-campbar23 .cb-header-inner-drink img {
      filter: brightness(0.5);
      transition: all 0.5s ease 1.2s; }
    .yt-logos-campbar23 .cb-header-inner-logo {
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 29vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .cb-header-inner-logo {
          width: calc(233/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .cb-header-inner-logo {
          width: calc(233/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .cb-header-inner-logo {
          width: 233px; } }
  .yt-logos-campbar23 .campaign {
    width: 100%;
    background-color: #f4f3ea;
    padding-top: 0;
    position: relative;
    height: 88vw; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .campaign {
        height: calc(880/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .campaign {
        height: calc(880/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .campaign {
        height: 880px; } }
    .yt-logos-campbar23 .campaign-inner {
      width: 100%;
      height: 100%; }
      .yt-logos-campbar23 .campaign-inner-title {
        width: 88.4vw;
        margin: 0 auto; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .campaign-inner-title {
            width: calc(827/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .campaign-inner-title {
            width: calc(827/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .campaign-inner-title {
            width: 827px; } }
      .yt-logos-campbar23 .campaign-inner-banner {
        margin: 0vw auto 0;
        padding-bottom: 5.5vw;
        background-image: url("../img/bg_mv_sp.png");
        background-position: top center;
        background-size: cover;
        background-repeat: no-repeat;
        height: 100%;
        position: relative; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .campaign-inner-banner {
            width: 100%;
            background-image: url("../img/bg_mv_pc.png");
            background-size: auto 100%; } }
        @media only screen and (min-width: 2000px) {
          .yt-logos-campbar23 .campaign-inner-banner {
            background-size: cover; } }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .campaign-inner-banner img {
            display: block;
            width: 100%;
            margin: 0 auto; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .campaign-inner-banner img {
            display: block;
            width: 1200px; } }
      .yt-logos-campbar23 .campaign-inner-note {
        font-size: 2vw;
        color: #fff;
        text-align: center;
        padding: 2vw 0 1vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .campaign-inner-note {
            width: calc(998/ 1200 * 1080px);
            margin: 0 auto;
            text-align: left;
            font-size: calc(11/ 1200 * 1080px);
            line-height: 1.4;
            padding-left: 1em;
            text-indent: -1em; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .campaign-inner-note {
            width: calc(998/ 1200 * 100vw);
            text-align: left;
            font-size: calc(11/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .campaign-inner-note {
            width: 998px;
            font-size: 11px; } }
      .yt-logos-campbar23 .campaign-inner-btn {
        width: 38vw;
        margin: 2vw auto 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .campaign-inner-btn {
            width: calc(306/ 1200 * 1080px);
            margin: 0 auto; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .campaign-inner-btn {
            width: calc(306/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .campaign-inner-btn {
            width: 306px; } }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .campaign-inner-btn img {
            width: calc(306/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .campaign-inner-btn img {
            width: calc(306/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .campaign-inner-btn img {
            width: 306px; } }
      .yt-logos-campbar23 .campaign-inner-close {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        width: 90vw;
        margin: auto auto; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .campaign-inner-close {
            width: calc(1088/ 1200 * 1080px);
            margin: 0 auto; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .campaign-inner-close {
            width: calc(1088/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .campaign-inner-close {
            width: 1088px; } }
        .yt-logos-campbar23 .campaign-inner-close img {
          width: 100%; }
  .yt-logos-campbar23 .outdoorcocktail {
    width: 100%;
    background-color: #f4f3ea; }
    .yt-logos-campbar23 .outdoorcocktail-head {
      position: relative;
      width: 100vw;
      height: 56.53vw;
      background-image: url("../img/bg_cocktail01_sp.png");
      background-size: 100% auto;
      background-position: top center;
      background-repeat: no-repeat;
      padding-top: 35.06vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .outdoorcocktail-head {
          background-image: url("../img/bg_cocktail01_pcl.png");
          background-size: auto 100%;
          background-position: top center;
          background-repeat: no-repeat;
          padding-top: calc(304/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .outdoorcocktail-head {
          padding-top: calc(304/ 1200 * 100vw);
          height: calc(445/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .outdoorcocktail-head {
          padding-top: 304px;
          height: 445px; } }
      .yt-logos-campbar23 .outdoorcocktail-head-title {
        width: 74.66vw;
        margin: 0 auto; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-head-title {
            width: calc(686/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-head-title {
            width: calc(686/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-head-title {
            width: 686px; } }
      .yt-logos-campbar23 .outdoorcocktail-head-visual {
        width: 100vw;
        height: 47.73vw;
        background: url("../img/scene02_sp.jpg") no-repeat;
        background-size: 100% auto; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-head-visual {
            width: 100%;
            height: calc(675/ 1200 * 1080px);
            background: url("../img/scene02_pc.jpg") no-repeat;
            background-size: 100% auto;
            background-position: top center; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-head-visual {
            height: calc(675/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-head-visual {
            height: 675px;
            background-image: image-set(url("../img/scene02_pc.jpg") 1x, url("../img/scene02_pc@2.jpg") 2x);
            background-image: -webkit-image-set(url("../img/scene02_pc.jpg") 1x, url("../img/scene02_pc@2.jpg") 2x);
            background-size: 100% auto;
            background-position: top center; } }
    .yt-logos-campbar23 .outdoorcocktail-cont {
      position: relative;
      width: 100vw;
      padding-top: 18.133vw;
      height: 586.933vw;
      background: url("../img/bg_cocktail02_sp.png") no-repeat;
      background-size: 100% auto;
      background-position: top center; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .outdoorcocktail-cont {
          width: 100%;
          padding-top: calc(105/ 1200 * 1080px);
          height: calc(3878/ 1200 * 1080px);
          background: url("../img/bg_cocktail02_pc.png") no-repeat;
          background-size: auto 100%;
          background-position: top center; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .outdoorcocktail-cont {
          padding-top: calc(105/ 1200 * 100vw);
          height: calc(3878/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .outdoorcocktail-cont {
          padding-top: 105px;
          height: 3878px; } }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .outdoorcocktail-cont-wrap {
          position: relative;
          width: calc(1200/ 1200 * 1080px);
          margin: 0 auto; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .outdoorcocktail-cont-wrap {
          width: 100%; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .outdoorcocktail-cont-wrap {
          width: 1200px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-title {
        width: 88vw;
        margin: 0 auto; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-title {
            width: calc(895/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-title {
            width: calc(895/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-title {
            width: 895px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-lead {
        width: 90vw;
        margin: 7.46vw auto 0;
        font-size: 3.06vw;
        font-weight: bold;
        line-height: 1.95;
        letter-spacing: 0.2em;
        text-align: center;
        color: #805838; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-lead {
            width: 100%;
            margin: calc(48/ 1200 * 1080px) auto 0;
            font-size: calc(24/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-lead {
            margin: calc(48/ 1200 * 100vw) auto 0;
            font-size: calc(24/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-lead {
            margin: 48px auto 0;
            font-size: 24px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont [class^="outdoorcocktail-cont-ph"],
      .yt-logos-campbar23 .outdoorcocktail-cont [class^="outdoorcocktail-cont-illust"] {
        position: absolute; }
      .yt-logos-campbar23 .outdoorcocktail-cont-ph01 {
        top: 87.2vw;
        left: 15.86vw;
        width: 53.86vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph01 {
            top: calc(700/ 1200 * 1080px);
            left: calc(103/ 1200 * 1080px);
            width: calc(448/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph01 {
            top: calc(700/ 1200 * 100vw);
            left: calc(103/ 1200 * 100vw);
            width: calc(448/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph01 {
            top: 700px;
            left: 103px;
            width: 448px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-ph02 {
        top: 156.4vw;
        right: 10.8vw;
        width: 59.06vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph02 {
            top: calc(1083/ 1200 * 1080px);
            right: calc(221/ 1200 * 1080px);
            width: calc(490/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph02 {
            top: calc(1083/ 1200 * 100vw);
            right: calc(221/ 1200 * 100vw);
            width: calc(490/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph02 {
            top: 1083px;
            right: 221px;
            width: 490px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-ph03 {
        top: 229.06vw;
        left: 16.66vw;
        width: 50.66vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph03 {
            top: calc(1558/ 1200 * 1080px);
            left: calc(173/ 1200 * 1080px);
            width: calc(418/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph03 {
            top: calc(1558/ 1200 * 100vw);
            left: calc(173/ 1200 * 100vw);
            width: calc(418/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph03 {
            top: 1558px;
            left: 173px;
            width: 418px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-ph04 {
        top: 300vw;
        right: 14.93vw;
        width: 50.93vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph04 {
            top: calc(1769/ 1200 * 1080px);
            right: calc(119/ 1200 * 1080px);
            width: calc(428/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph04 {
            top: calc(1769/ 1200 * 100vw);
            right: calc(119/ 1200 * 100vw);
            width: calc(428/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph04 {
            top: 1769px;
            right: 119px;
            width: 428px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-ph05 {
        top: 368vw;
        left: 7.46vw;
        width: 67.46vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph05 {
            top: calc(2215/ 1200 * 1080px);
            left: calc(181/ 1200 * 1080px);
            width: calc(564/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph05 {
            top: calc(2215/ 1200 * 100vw);
            left: calc(181/ 1200 * 100vw);
            width: calc(564/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph05 {
            top: 2215px;
            left: 181px;
            width: 564px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-ph06 {
        top: 429.46vw;
        left: 38.2vw;
        width: 47.06vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph06 {
            top: calc(2629/ 1200 * 1080px);
            left: inherit;
            right: calc(156/ 1200 * 1080px);
            width: calc(391/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph06 {
            top: calc(2629/ 1200 * 100vw);
            right: calc(156/ 1200 * 100vw);
            width: calc(391/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph06 {
            top: 2629px;
            right: 156px;
            width: 391px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-ph07 {
        top: 503.33vw;
        left: 13.6vw;
        width: 59.46vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph07 {
            top: calc(2893/ 1200 * 1080px);
            left: calc(86/ 1200 * 1080px);
            width: calc(493/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph07 {
            top: calc(2893/ 1200 * 100vw);
            left: calc(86/ 1200 * 100vw);
            width: calc(493/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-ph07 {
            top: 2893px;
            left: 86px;
            width: 493px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-illust01 {
        top: 117.2vw;
        right: 11.2vw;
        width: 21.33vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust01 {
            top: calc(505/ 1200 * 1080px);
            right: calc(109/ 1200 * 1080px);
            width: calc(277/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust01 {
            top: calc(505/ 1200 * 100vw);
            right: calc(109/ 1200 * 100vw);
            width: calc(277/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust01 {
            top: 505px;
            right: 109px;
            width: 277px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-illust02 {
        top: 137.2vw;
        left: 18.66vw;
        width: 16.26vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust02 {
            top: calc(1192/ 1200 * 100vw);
            left: calc(102/ 1200 * 100vw);
            width: calc(138/ 1200 * 100vw); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust02 {
            top: calc(1192/ 1200 * 100vw);
            left: calc(102/ 1200 * 100vw);
            width: calc(138/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust02 {
            top: 1119px;
            left: 102px;
            width: 138px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-illust03 {
        top: 214.8vw;
        right: 10.13vw;
        width: 23.6vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust03 {
            top: calc(1457/ 1200 * 1080px);
            right: calc(42/ 1200 * 1080px);
            width: calc(203/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust03 {
            top: calc(1457/ 1200 * 100vw);
            right: calc(42/ 1200 * 100vw);
            width: calc(203/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust03 {
            top: 1457px;
            right: 42px;
            width: 203px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-illust04 {
        top: 265.33vw;
        left: 40.4vw;
        width: 22.8vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust04 {
            top: calc(1844/ 1200 * 1080px);
            left: calc(368/ 1200 * 1080px);
            width: calc(188/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust04 {
            top: calc(1844/ 1200 * 100vw);
            left: calc(368/ 1200 * 100vw);
            width: calc(188/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust04 {
            top: 1844px;
            left: 368px;
            width: 188px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-illust05 {
        top: 287.06vw;
        left: 14vw;
        width: 18.4vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust05 {
            top: calc(2106/ 1200 * 1080px);
            left: calc(98/ 1200 * 1080px);
            width: calc(114/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust05 {
            top: calc(2106/ 1200 * 100vw);
            left: calc(98/ 1200 * 100vw);
            width: calc(114/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust05 {
            top: 2106px;
            left: 98px;
            width: 114px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-illust06 {
        top: 475.46vw;
        right: 14.66vw;
        width: 20.4vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust06 {
            top: calc(2937/ 1200 * 1080px);
            right: calc(98/ 1200 * 1080px);
            width: calc(158/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust06 {
            top: calc(2937/ 1200 * 100vw);
            right: calc(98/ 1200 * 100vw);
            width: calc(158/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust06 {
            top: 2937px;
            right: 98px;
            width: 158px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-illust07 {
        display: none; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust07 {
            display: block;
            top: calc(3447/ 1200 * 1080px);
            left: calc(3/ 1200 * 1080px);
            width: calc(282/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust07 {
            top: calc(3447/ 1200 * 100vw);
            left: calc(3/ 1200 * 100vw);
            width: calc(282/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust07 {
            top: 3447px;
            left: 3px;
            width: 282px; } }
      .yt-logos-campbar23 .outdoorcocktail-cont-illust08 {
        display: none; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust08 {
            display: block;
            top: calc(3297/ 1200 * 1080px);
            right: calc(95/ 1200 * 1080px);
            width: calc(419/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust08 {
            display: block;
            top: calc(3297/ 1200 * 100vw);
            right: calc(95/ 1200 * 100vw);
            width: calc(419/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktail-cont-illust08 {
            top: 3297px;
            right: 95px;
            width: 419px; } }
  .yt-logos-campbar23 .outdoorcocktailbar {
    width: 100%;
    background-image: url("../img/wave01_sp.png"), url("../img/bg_yellow_sp.png");
    background-size: 100% auto, 100% auto;
    background-position: top center, top center;
    background-repeat: no-repeat, repeat-y; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .outdoorcocktailbar {
        background-image: url("../img/wave01_pc.png"), url("../img/bg_yellow_pc.png");
        background-size: auto, 100% auto; } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .outdoorcocktailbar {
        background-image: url("../img/wave01_pc.png"), url("../img/bg_yellow_pc.png");
        background-size: auto, 100% auto; } }
    @media only screen and (min-width: 2000px) {
      .yt-logos-campbar23 .outdoorcocktailbar {
        background-image: url("../img/wave01_pc.png"), url("../img/bg_yellow_pcl.png");
        background-size: 100% auto, 100% auto; } }
    .yt-logos-campbar23 .outdoorcocktailbar-inner {
      padding-bottom: 34.8vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .outdoorcocktailbar-inner {
          padding-bottom: calc(280/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .outdoorcocktailbar-inner {
          padding-bottom: calc(280/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .outdoorcocktailbar-inner {
          padding-bottom: 280px; } }
    .yt-logos-campbar23 .outdoorcocktailbar-title {
      width: 64.8vw;
      margin: 0 auto; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .outdoorcocktailbar-title {
          width: calc(876/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .outdoorcocktailbar-title {
          width: calc(876/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .outdoorcocktailbar-title {
          width: 876px; } }
    .yt-logos-campbar23 .outdoorcocktailbar-banner {
      width: 93.2vw;
      margin: 3.2vw auto 0;
      background: url("../img/pairing_ban_arrow.png") no-repeat;
      background-size: 100% auto;
      background-position: center center; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .outdoorcocktailbar-banner {
          width: calc(972/ 1200 * 1080px);
          margin: calc(84/ 1200 * 1080px) auto 0; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .outdoorcocktailbar-banner {
          width: calc(972/ 1200 * 100vw);
          margin: calc(84/ 1200 * 100vw) auto 0; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .outdoorcocktailbar-banner {
          width: 972px;
          margin: 84px auto 0; } }
      .yt-logos-campbar23 .outdoorcocktailbar-banner a {
        display: block;
        width: 73.6vw;
        margin: 0 auto; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .outdoorcocktailbar-banner a {
            width: calc(766/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .outdoorcocktailbar-banner a {
            width: calc(766/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .outdoorcocktailbar-banner a {
            width: 766px; } }
    .yt-logos-campbar23 .outdoorcocktailbar-illust08 {
      width: 49.73vw;
      margin: 22.26vw auto 0; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .outdoorcocktailbar-illust08 {
          display: none; } }
  .yt-logos-campbar23 .pairing {
    width: 100%;
    background-image: url("../img/bg_yellow_sp.png");
    background-size: 100% auto;
    background-position: top center;
    background-repeat: repeat-y;
    padding-bottom: 25vw; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .pairing {
        background-image: url("../img/bg_yellow_pc.png");
        background-size: 100% auto;
        padding-bottom: calc(200/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .pairing {
        padding-bottom: calc(200/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .pairing {
        padding-bottom: 200px; } }
    @media only screen and (min-width: 2000px) {
      .yt-logos-campbar23 .pairing {
        background-image: url("../img/bg_yellow_pcl.png");
        background-size: 100% auto;
        padding-bottom: 200px; } }
    .yt-logos-campbar23 .pairing-inner {
      position: relative; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-inner {
          width: 1200px;
          margin: 0 auto; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-inner {
          width: 1200px; } }
    .yt-logos-campbar23 .pairing-title {
      width: 89.46vw;
      margin: 0 auto; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-title {
          width: calc(928/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-title {
          width: calc(928/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-title {
          width: 928px; } }
    .yt-logos-campbar23 .pairing-lead {
      margin: 43.06vw auto 0;
      width: 90vw;
      font-size: 3.5vw;
      line-height: 1.95;
      text-align: center;
      color: #805838; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-lead {
          margin: calc(345/ 1200 * 1080px) auto 0;
          width: calc(797/ 1200 * 1080px);
          font-size: calc(24/ 1200 * 1080px);
          line-height: 2.5;
          letter-spacing: 0.2em; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-lead {
          margin: calc(345/ 1200 * 100vw) auto 0;
          width: calc(797/ 1200 * 100vw);
          font-size: calc(24/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-lead {
          margin: 345px auto 0;
          width: 797px;
          font-size: 24px; } }
    .yt-logos-campbar23 .pairing-index {
      position: relative;
      margin: 72vw auto 0;
      width: 80.53vw;
      height: 108.8vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-index {
          margin: calc(290/ 1200 * 1080px) auto 0;
          width: calc(754/ 1200 * 1080px);
          height: calc(446/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-index {
          margin: calc(290/ 1200 * 100vw) auto 0;
          width: calc(754/ 1200 * 100vw);
          height: calc(446/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-index {
          margin: 290px auto 0;
          width: 754px;
          height: 446px; } }
      .yt-logos-campbar23 .pairing-index li {
        position: absolute;
        width: 34.26vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .pairing-index li {
            width: calc(194/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .pairing-index li {
            width: calc(194/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .pairing-index li {
            width: 194px; } }
        .yt-logos-campbar23 .pairing-index li:nth-child(1) {
          top: 0;
          left: 0; }
        .yt-logos-campbar23 .pairing-index li:nth-child(2) {
          top: 0;
          right: 0; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .pairing-index li:nth-child(2) {
              top: inherit;
              bottom: 0;
              left: calc(141/ 1200 * 1080px); } }
          @media only screen and (min-width: 1080px) {
            .yt-logos-campbar23 .pairing-index li:nth-child(2) {
              left: calc(141/ 1200 * 100vw); } }
          @media only screen and (min-width: 1200px) {
            .yt-logos-campbar23 .pairing-index li:nth-child(2) {
              left: 141px; } }
        .yt-logos-campbar23 .pairing-index li:nth-child(3) {
          bottom: 0;
          left: 22.66vw; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .pairing-index li:nth-child(3) {
              left: calc(280/ 1200 * 1080px); } }
          @media only screen and (min-width: 1080px) {
            .yt-logos-campbar23 .pairing-index li:nth-child(3) {
              left: calc(280/ 1200 * 100vw); } }
          @media only screen and (min-width: 1200px) {
            .yt-logos-campbar23 .pairing-index li:nth-child(3) {
              left: 280px; } }
        .yt-logos-campbar23 .pairing-index li:nth-child(4) {
          bottom: 0;
          left: 0; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .pairing-index li:nth-child(4) {
              left: calc(420/ 1200 * 1080px); } }
          @media only screen and (min-width: 1080px) {
            .yt-logos-campbar23 .pairing-index li:nth-child(4) {
              left: calc(420/ 1200 * 100vw); } }
          @media only screen and (min-width: 1200px) {
            .yt-logos-campbar23 .pairing-index li:nth-child(4) {
              left: 420px; } }
        .yt-logos-campbar23 .pairing-index li:nth-child(5) {
          bottom: 0;
          right: 0; }
    .yt-logos-campbar23 .pairing-illust li {
      position: absolute; }
      .yt-logos-campbar23 .pairing-illust li:nth-child(1) {
        width: 10.93vw;
        top: 105vw;
        left: 34vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .pairing-illust li:nth-child(1) {
            width: calc(137/ 1200 * 1080px);
            top: calc(310/ 1200 * 1080px);
            left: calc(147/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .pairing-illust li:nth-child(1) {
            width: calc(137/ 1200 * 100vw);
            top: calc(310/ 1200 * 100vw);
            left: calc(147/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .pairing-illust li:nth-child(1) {
            width: 137px;
            top: 310px;
            left: 147px; } }
      .yt-logos-campbar23 .pairing-illust li:nth-child(2) {
        width: 25.73vw;
        top: 106vw;
        right: 27.73vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .pairing-illust li:nth-child(2) {
            width: calc(300/ 1200 * 1080px);
            top: calc(720/ 1200 * 1080px);
            right: calc(69/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .pairing-illust li:nth-child(2) {
            width: calc(300/ 1200 * 100vw);
            top: calc(720/ 1200 * 100vw);
            right: calc(69/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .pairing-illust li:nth-child(2) {
            width: 300px;
            top: 720px;
            right: 69px; } }
      .yt-logos-campbar23 .pairing-illust li:nth-child(3) {
        width: 10.8vw;
        top: 206vw;
        left: 33.33vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .pairing-illust li:nth-child(3) {
            width: calc(163/ 1200 * 1080px);
            top: calc(800/ 1200 * 1080px);
            left: calc(49/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .pairing-illust li:nth-child(3) {
            width: calc(163/ 1200 * 100vw);
            top: calc(800/ 1200 * 100vw);
            left: calc(49/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .pairing-illust li:nth-child(3) {
            width: 163px;
            top: 800px;
            left: 49px; } }
      .yt-logos-campbar23 .pairing-illust li:nth-child(4) {
        width: 24.8vw;
        top: 207vw;
        right: 29.46vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .pairing-illust li:nth-child(4) {
            width: calc(241/ 1200 * 1080px);
            top: calc(1275/ 1200 * 1080px);
            right: calc(-19/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .pairing-illust li:nth-child(4) {
            width: calc(241/ 1200 * 100vw);
            top: calc(1275/ 1200 * 100vw);
            right: calc(-19/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .pairing-illust li:nth-child(4) {
            width: 241px;
            top: 1275px;
            right: -19px; } }
  .yt-logos-campbar23 .pairing-scene01 {
    padding-top: 15vw;
    margin-top: -15vw;
    width: 100%;
    background-image: url("../img/pairing_wave01_sp.png"), url("../img/bg_yellow_sp.png");
    background-size: 100% auto,100% auto;
    background-position: bottom center, top center;
    background-repeat: no-repeat,repeat-y;
    padding-bottom: 14.656vw; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .pairing-scene01 {
        padding-top: calc(120/ 1200 * 1080px);
        margin-top: calc(-120/ 1200 * 1080px);
        background-image: url("../img/pairing_wave01_pc.png"), url("../img/bg_yellow_pc.png");
        background-size: 100% auto,100% auto;
        background-position: bottom center, top center;
        background-repeat: no-repeat,repeat-y;
        padding-bottom: calc(221/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .pairing-scene01 {
        padding-top: calc(120/ 1200 * 100vw);
        margin-top: calc(-120/ 1200 * 100vw);
        background-image: url("../img/pairing_wave01_pcl.png"), url("../img/bg_yellow_pcl.png");
        background-size: auto auto,auto auto;
        background-repeat: no-repeat,repeat;
        padding-bottom: 221px; } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .pairing-scene01 {
        padding-top: 120px;
        margin-top: -120px;
        padding-bottom: 221px; } }
    .yt-logos-campbar23 .pairing-scene01-wrap1 {
      width: 83vw;
      margin: 0 auto; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene01-wrap1 {
          display: flex;
          justify-content: space-between;
          width: calc(1100/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene01-wrap1 {
          width: calc(1100/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene01-wrap1 {
          width: 1100px; } }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .pairing-scene01-title {
        width: calc(407/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .pairing-scene01-title {
        width: calc(407/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .pairing-scene01-title {
        width: 407px; } }
    .yt-logos-campbar23 .pairing-scene01-text {
      width: 83vw;
      margin-top: 3.076vw;
      font-size: 3.53vw;
      line-height: 1.26;
      color: #744e33; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene01-text {
          width: calc(407/ 1200 * 1080px);
          margin-top: calc(44/ 1200 * 1080px);
          font-size: calc(20/ 1200 * 1080px);
          line-height: 1.6; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene01-text {
          width: calc(407/ 1200 * 100vw);
          margin-top: calc(44/ 1200 * 100vw);
          font-size: calc(20/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene01-text {
          width: 407px;
          margin-top: 44px;
          font-size: 20px; } }
    .yt-logos-campbar23 .pairing-scene01-photo {
      margin-top: 3vw;
      box-shadow: 1vw 1vw 0vw #fff; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene01-photo {
          margin-top: calc(80/ 1200 * 1080px);
          width: calc(657/ 1200 * 1080px);
          box-shadow: calc(8/ 1200 * 1080px) calc(8/ 1200 * 1080px) 0 #fff; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene01-photo {
          margin-top: calc(80/ 1200 * 100vw);
          width: calc(657/ 1200 * 100vw);
          box-shadow: calc(8/ 1200 * 100vw) calc(8/ 1200 * 100vw) 0 #fff; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene01-photo {
          margin-top: 80px;
          width: 657px;
          box-shadow: 8px 8px 0 #fff; } }
    .yt-logos-campbar23 .pairing-scene01-wrap2 {
      position: relative;
      width: 100vw;
      height: 114.46vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene01-wrap2 {
          width: 1080px;
          height: calc(327/ 1200 * 1080px);
          margin: calc(-7/ 1200 * 1080px) auto 0; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene01-wrap2 {
          width: 100%;
          height: calc(327/ 1200 * 100vw);
          margin: calc(-7/ 1200 * 100vw) auto 0; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene01-wrap2 {
          width: 1200px;
          height: 327px;
          margin: -7px auto 0; } }
    .yt-logos-campbar23 .pairing-scene01-cocktail {
      position: absolute;
      top: 3.53vw;
      left: 6.37vw;
      width: 85.076vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene01-cocktail {
          top: 0;
          left: calc(8/ 1200 * 1080px);
          width: calc(695/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene01-cocktail {
          left: calc(8/ 1200 * 100vw);
          width: calc(695/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene01-cocktail {
          left: 8px;
          width: 695px; } }
    .yt-logos-campbar23 .pairing-scene01-recipe {
      position: absolute;
      bottom: 0;
      right: 21.53vw;
      width: 63.846vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene01-recipe {
          right: calc(56/ 1200 * 1080px);
          width: calc(403/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene01-recipe {
          right: calc(56/ 1200 * 100vw);
          width: calc(403/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene01-recipe {
          right: 56px;
          width: 403px; } }
      .yt-logos-campbar23 .pairing-scene01-recipe:hover {
        cursor: pointer;
        opacity: 0.8; }
  .yt-logos-campbar23 .pairing-scene02 {
    width: 100%;
    background-image: url("../img/bg_cleam_sp.png");
    background-size: 100% auto;
    background-position: top center;
    background-repeat: repeat-y;
    padding: 9.343vw 0 9.928vw; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .pairing-scene02 {
        background-image: url("../img/bg_cleam_pc.png");
        background-size: 100% auto;
        padding: calc(214/ 1200 * 1080px) 0 calc(132/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .pairing-scene02 {
        background-image: url("../img/bg_cleam_pcl.png");
        background-size: 100% auto;
        padding: calc(214/ 1200 * 100vw) 0 calc(132/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .pairing-scene02 {
        padding: 214px 0 132px; } }
    .yt-logos-campbar23 .pairing-scene02-wrap1 {
      width: 83vw;
      margin: 0 auto;
      position: relative; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene02-wrap1 {
          display: flex;
          flex-direction: row-reverse;
          justify-content: space-between;
          width: calc(1100/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene02-wrap1 {
          width: calc(1100/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene02-wrap1 {
          width: 1100px; } }
    .yt-logos-campbar23 .pairing-scene02-ill {
      width: 37.23vw;
      top: -20vw;
      right: -3vw;
      position: absolute; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene02-ill {
          width: calc(359/ 1200 * 1080px);
          top: calc(-260/ 1200 * 1080px);
          right: 0px; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene02-ill {
          width: calc(359/ 1200 * 100vw);
          top: calc(-260/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene02-ill {
          width: 359px;
          top: -260px; } }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .pairing-scene02-title {
        width: calc(407/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .pairing-scene02-title {
        width: calc(407/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .pairing-scene02-title {
        width: 407px; } }
    .yt-logos-campbar23 .pairing-scene02-text {
      width: 83vw;
      margin-top: 3.076vw;
      font-size: 3.53vw;
      line-height: 1.26;
      color: #744e33; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene02-text {
          width: calc(407/ 1200 * 1080px);
          margin-top: calc(44/ 1200 * 1080px);
          font-size: calc(20/ 1200 * 1080px);
          line-height: 1.6; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene02-text {
          width: calc(407/ 1200 * 100vw);
          margin-top: calc(44/ 1200 * 100vw);
          font-size: calc(20/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene02-text {
          width: 407px;
          margin-top: 44px;
          font-size: 20px; } }
    .yt-logos-campbar23 .pairing-scene02-photo {
      margin-top: 3vw;
      box-shadow: 1vw 1vw 0 #fff; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene02-photo {
          margin-top: calc(0/ 1200 * 1080px);
          width: calc(657/ 1200 * 1080px);
          box-shadow: calc(8/ 1200 * 1080px) calc(8/ 1200 * 1080px) 0 #fff; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene02-photo {
          margin-top: calc(0/ 1200 * 100vw);
          width: calc(657/ 1200 * 100vw);
          box-shadow: calc(8/ 1200 * 100vw) calc(8/ 1200 * 100vw) 0 #fff; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene02-photo {
          margin-top: 0px;
          width: 657px;
          box-shadow: 8px 8px 0 #fff; } }
    .yt-logos-campbar23 .pairing-scene02-wrap2 {
      position: relative;
      width: 100vw;
      height: 122.307vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene02-wrap2 {
          width: 1080px;
          height: calc(360/ 1200 * 1080px);
          margin: calc(-7/ 1200 * 1080px) auto 0; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene02-wrap2 {
          width: 100%;
          height: calc(360/ 1200 * 100vw);
          margin: calc(-7/ 1200 * 100vw) auto 0; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene02-wrap2 {
          width: 1200px;
          height: 360px;
          margin: -7px auto 0; } }
    .yt-logos-campbar23 .pairing-scene02-cocktail {
      position: absolute;
      top: 3.846vw;
      left: 7.538vw;
      width: 82.923vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene02-cocktail {
          top: initial;
          bottom: 0;
          left: calc(41/ 1200 * 1080px);
          width: calc(695/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene02-cocktail {
          left: calc(41/ 1200 * 100vw);
          width: calc(695/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene02-cocktail {
          left: 41px;
          width: 695px; } }
    .yt-logos-campbar23 .pairing-scene02-recipe {
      position: absolute;
      bottom: 0;
      right: 21.076vw;
      width: 64.153vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene02-recipe {
          right: calc(56/ 1200 * 1080px);
          bottom: calc(2/ 1200 * 1080px);
          width: calc(403/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene02-recipe {
          right: calc(56/ 1200 * 100vw);
          bottom: calc(2/ 1200 * 100vw);
          width: calc(403/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene02-recipe {
          right: 56px;
          bottom: 2px;
          width: 403px; } }
      .yt-logos-campbar23 .pairing-scene02-recipe:hover {
        cursor: pointer;
        opacity: 0.8; }
  .yt-logos-campbar23 .pairing-scene03 {
    width: 100%;
    background-image: url("../img/pairing_wave01_sp.png"), url("../img/pairing_wave02_sp.png"), url("../img/bg_yellow_sp.png");
    background-size: 100% auto,100% auto,100% auto;
    background-position: bottom center, top center, top center;
    background-repeat: no-repeat,no-repeat,repeat-y;
    padding: 18.84vw 0 12.809vw; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .pairing-scene03 {
        background-image: url("../img/pairing_wave01_pc.png"), url("../img/pairing_wave02_pc.png"), url("../img/bg_yellow_pc.png");
        background-size: 100% auto,100% auto,100% auto;
        background-repeat: no-repeat,no-repeat,repeat-y;
        padding: calc(336/ 1200 * 1080px) 0 calc(271/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .pairing-scene03 {
        background-image: url("../img/pairing_wave01_pcl.png"), url("../img/pairing_wave02_pcl.png"), url("../img/bg_yellow_pcl.png");
        background-size: auto auto, auto auto, auto auto;
        background-repeat: no-repeat,no-repeat,repeat;
        padding: calc(336/ 1200 * 100vw) 0 calc(271/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .pairing-scene03 {
        padding: 336px 0 271px; } }
    .yt-logos-campbar23 .pairing-scene03-wrap1 {
      width: 83vw;
      margin: 0 auto;
      position: relative; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene03-wrap1 {
          display: flex;
          justify-content: space-between;
          width: calc(1100/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene03-wrap1 {
          width: calc(1100/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene03-wrap1 {
          width: 1100px; } }
    .yt-logos-campbar23 .pairing-scene03-ill {
      width: 27.076vw;
      top: -20vw;
      left: 60vw;
      position: absolute; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene03-ill {
          width: calc(228/ 1200 * 1080px);
          top: calc(-320/ 1200 * 1080px);
          left: calc(20/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene03-ill {
          width: calc(228/ 1200 * 100vw);
          top: calc(-320/ 1200 * 100vw);
          left: calc(20/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene03-ill {
          width: 228px;
          top: -320px;
          left: 20px; } }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .pairing-scene03-title {
        width: calc(407/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .pairing-scene03-title {
        width: calc(407/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .pairing-scene03-title {
        width: 407px; } }
    .yt-logos-campbar23 .pairing-scene03-text {
      width: 83vw;
      margin-top: 3.076vw;
      font-size: 3.53vw;
      line-height: 1.26;
      color: #744e33; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene03-text {
          width: calc(407/ 1200 * 1080px);
          margin-top: calc(44/ 1200 * 1080px);
          font-size: calc(20/ 1200 * 1080px);
          line-height: 1.6; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene03-text {
          width: calc(407/ 1200 * 100vw);
          margin-top: calc(44/ 1200 * 100vw);
          font-size: calc(20/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene03-text {
          width: 407px;
          margin-top: 44px;
          font-size: 20px; } }
    .yt-logos-campbar23 .pairing-scene03-photo {
      margin-top: 3vw;
      box-shadow: 1vw 1vw 0vw #fff; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene03-photo {
          margin-top: calc(80/ 1200 * 1080px);
          width: calc(657/ 1200 * 1080px);
          box-shadow: calc(8/ 1200 * 1080px) calc(8/ 1200 * 1080px) 0 #fff; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene03-photo {
          margin-top: calc(80/ 1200 * 100vw);
          width: calc(657/ 1200 * 100vw);
          box-shadow: calc(8/ 1200 * 100vw) calc(8/ 1200 * 100vw) 0 #fff; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene03-photo {
          margin-top: 80px;
          width: 657px;
          box-shadow: 8px 8px 0 #fff; } }
    .yt-logos-campbar23 .pairing-scene03-wrap2 {
      position: relative;
      width: 100vw;
      height: 114.46vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene03-wrap2 {
          width: 1080px;
          height: calc(325/ 1200 * 1080px);
          margin: calc(0/ 1200 * 1080px) auto 0; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene03-wrap2 {
          width: 100%;
          height: calc(325/ 1200 * 100vw);
          margin: calc(0/ 1200 * 100vw) auto 0; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene03-wrap2 {
          width: 1200px;
          height: 325px;
          margin: 0px auto 0; } }
    .yt-logos-campbar23 .pairing-scene03-cocktail {
      position: absolute;
      top: 4.037vw;
      left: 8.461vw;
      width: 82vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene03-cocktail {
          top: calc(-27/ 1200 * 1080px);
          left: calc(51/ 1200 * 1080px);
          width: calc(649/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene03-cocktail {
          top: calc(-27/ 1200 * 100vw) x;
          left: calc(51/ 1200 * 100vw);
          width: calc(649/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene03-cocktail {
          top: -27px;
          left: 51px;
          width: 649px; } }
    .yt-logos-campbar23 .pairing-scene03-recipe {
      position: absolute;
      bottom: 0;
      right: 20vw;
      width: 64.307vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene03-recipe {
          right: calc(42/ 1200 * 1080px);
          width: calc(447/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene03-recipe {
          right: calc(42/ 1200 * 100vw);
          width: calc(447/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene03-recipe {
          right: 42px;
          width: 447px; } }
      .yt-logos-campbar23 .pairing-scene03-recipe:hover {
        cursor: pointer;
        opacity: 0.8; }
  .yt-logos-campbar23 .pairing-scene04 {
    width: 100%;
    background-image: url("../img/bg_cleam_sp.png");
    background-size: 100% auto;
    background-position: top center;
    background-repeat: repeat-y;
    padding: 16vw 0 13.517vw; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .pairing-scene04 {
        background-image: url("../img/bg_cleam_pc.png");
        background-size: 100% auto;
        padding: calc(242/ 1200 * 1080px) 0 calc(131/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .pairing-scene04 {
        background-image: url("../img/bg_cleam_pcl.png");
        background-size: 100% auto;
        padding: calc(242/ 1200 * 100vw) 0 calc(131/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .pairing-scene04 {
        padding: 242px 0 131px; } }
    .yt-logos-campbar23 .pairing-scene04-wrap1 {
      width: 83vw;
      margin: 0 auto;
      position: relative; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene04-wrap1 {
          display: flex;
          flex-direction: row-reverse;
          justify-content: space-between;
          width: calc(1100/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene04-wrap1 {
          width: calc(1100/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene04-wrap1 {
          width: 1100px; } }
    .yt-logos-campbar23 .pairing-scene04-ill {
      width: 35.692vw;
      top: -18vw;
      left: -6.5vw;
      transform: scale(-1, 1);
      position: absolute; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene04-ill {
          width: calc(407/ 1200 * 1080px);
          top: calc(-395/ 1200 * 1080px);
          left: calc(715/ 1200 * 1080px);
          transform: scale(1, 1); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene04-ill {
          width: calc(407/ 1200 * 100vw);
          top: calc(-395/ 1200 * 100vw);
          left: calc(715/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene04-ill {
          width: 407px;
          top: -395px;
          left: 715px; } }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .pairing-scene04-title {
        width: calc(407/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .pairing-scene04-title {
        width: calc(407/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .pairing-scene04-title {
        width: 407px; } }
    .yt-logos-campbar23 .pairing-scene04-text {
      width: 83vw;
      margin-top: 3.076vw;
      font-size: 3.53vw;
      line-height: 1.26;
      color: #744e33; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene04-text {
          width: calc(407/ 1200 * 1080px);
          margin-top: calc(44/ 1200 * 1080px);
          font-size: calc(20/ 1200 * 1080px);
          line-height: 1.6; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene04-text {
          width: calc(407/ 1200 * 100vw);
          margin-top: calc(44/ 1200 * 100vw);
          font-size: calc(20/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene04-text {
          width: 407px;
          margin-top: 44px;
          font-size: 20px; } }
    .yt-logos-campbar23 .pairing-scene04-photo {
      margin-top: 3vw;
      box-shadow: 1vw 1vw 0 #fff; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene04-photo {
          margin-top: calc(0/ 1200 * 1080px);
          width: calc(657/ 1200 * 1080px);
          box-shadow: calc(8/ 1200 * 1080px) calc(8/ 1200 * 1080px) 0 #fff; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene04-photo {
          margin-top: calc(0/ 1200 * 100vw);
          width: calc(657/ 1200 * 100vw);
          box-shadow: calc(8/ 1200 * 100vw) calc(8/ 1200 * 100vw) 0 #fff; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene04-photo {
          margin-top: 0px;
          width: 657px;
          box-shadow: 8px 8px 0 #fff; } }
    .yt-logos-campbar23 .pairing-scene04-wrap2 {
      position: relative;
      width: 100vw;
      height: 112.923vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene04-wrap2 {
          width: 1080px;
          height: calc(335/ 1200 * 1080px);
          margin: calc(0/ 1200 * 1080px) auto 0; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene04-wrap2 {
          width: 100%;
          height: calc(335/ 1200 * 100vw);
          margin: calc(0/ 1200 * 100vw) auto 0; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene04-wrap2 {
          width: 1200px;
          height: 335px;
          margin: 0px auto 0; } }
    .yt-logos-campbar23 .pairing-scene04-cocktail {
      position: absolute;
      top: 0;
      left: 8vw;
      width: 86.923vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene04-cocktail {
          top: initial;
          bottom: 0;
          left: calc(41/ 1200 * 1080px);
          width: calc(698/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene04-cocktail {
          left: calc(41/ 1200 * 100vw);
          width: calc(698/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene04-cocktail {
          left: 41px;
          width: 698px; } }
    .yt-logos-campbar23 .pairing-scene04-recipe {
      position: absolute;
      bottom: 0;
      right: 18vw;
      width: 69.23vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene04-recipe {
          right: calc(56/ 1200 * 1080px);
          bottom: calc(-5/ 1200 * 1080px);
          width: calc(437/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene04-recipe {
          right: calc(56/ 1200 * 100vw);
          bottom: calc(-5/ 1200 * 100vw);
          width: calc(437/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene04-recipe {
          right: 56px;
          bottom: -5px;
          width: 437px; } }
      .yt-logos-campbar23 .pairing-scene04-recipe:hover {
        cursor: pointer;
        opacity: 0.8; }
  .yt-logos-campbar23 .pairing-scene05 {
    width: 100%;
    background-image: url("../img/pairing_ballon_sp.png"), url("../img/pairing_wave02_sp.png"), url("../img/bg_yellow_sp.png");
    background-size: 100% auto,100% auto,100% auto;
    background-position: bottom center, top center, top center;
    background-repeat: no-repeat,no-repeat,repeat-y;
    padding: 14.307vw 0 22.461vw; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .pairing-scene05 {
        background-image: url("../img/pairing_ballon_pc.png"), url("../img/pairing_wave02_pc.png"), url("../img/bg_yellow_pc.png");
        background-size: 100% auto,100% auto,100% auto;
        background-repeat: no-repeat,no-repeat,repeat-y;
        padding: calc(309/ 1200 * 1080px) 0 calc(330/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .pairing-scene05 {
        background-image: url("../img/pairing_ballon_pcl.png"), url("../img/pairing_wave02_pcl.png"), url("../img/bg_yellow_pcl.png");
        background-size: auto auto, auto auto, auto auto;
        background-repeat: no-repeat,no-repeat,repeat;
        padding: calc(309/ 1200 * 100vw) 0 calc(330/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .pairing-scene05 {
        padding: 309px 0 330px; } }
    .yt-logos-campbar23 .pairing-scene05-wrap1 {
      width: 83vw;
      margin: 0 auto;
      position: relative; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene05-wrap1 {
          display: flex;
          justify-content: space-between;
          width: calc(1100/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene05-wrap1 {
          width: calc(1100/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene05-wrap1 {
          width: 1100px; } }
    .yt-logos-campbar23 .pairing-scene05-ill {
      width: 20vw;
      top: -24vw;
      right: -4.307vw;
      position: absolute; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene05-ill {
          width: calc(215 1200 * 1080px);
          top: calc(-360/ 1200 * 1080px);
          right: calc(432/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene05-ill {
          width: calc(215/ 1200 * 100vw);
          top: calc(-360/ 1200 * 100vw);
          right: calc(432/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene05-ill {
          width: 215px;
          top: -360px;
          right: 432px; } }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .pairing-scene05-title {
        width: calc(407/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .pairing-scene05-title {
        width: calc(407/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .pairing-scene05-title {
        width: 407px; } }
    .yt-logos-campbar23 .pairing-scene05-text {
      width: 83vw;
      margin-top: 3.076vw;
      font-size: 3.53vw;
      line-height: 1.26;
      color: #744e33; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene05-text {
          width: calc(407/ 1200 * 1080px);
          margin-top: calc(44/ 1200 * 1080px);
          font-size: calc(20/ 1200 * 1080px);
          line-height: 1.6; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene05-text {
          width: calc(407/ 1200 * 100vw);
          margin-top: calc(44/ 1200 * 100vw);
          font-size: calc(20/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene05-text {
          width: 407px;
          margin-top: 44px;
          font-size: 20px; } }
    .yt-logos-campbar23 .pairing-scene05-photo {
      margin-top: 3vw;
      box-shadow: 1vw 1vw 0vw #fff; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene05-photo {
          margin-top: calc(80/ 1200 * 1080px);
          width: calc(657/ 1200 * 1080px);
          box-shadow: calc(8/ 1200 * 1080px) calc(8/ 1200 * 1080px) 0 #fff; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene05-photo {
          margin-top: calc(80/ 1200 * 100vw);
          width: calc(657/ 1200 * 100vw);
          box-shadow: calc(8/ 1200 * 100vw) calc(8/ 1200 * 100vw) 0 #fff; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene05-photo {
          margin-top: 80px;
          width: 657px;
          box-shadow: 8px 8px 0 #fff; } }
    .yt-logos-campbar23 .pairing-scene05-wrap2 {
      position: relative;
      width: 100%;
      height: 114.46vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene05-wrap2 {
          width: 1080px;
          height: calc(327/ 1200 * 1080px);
          margin: calc(0/ 1200 * 1080px) auto 0; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene05-wrap2 {
          width: 100%;
          height: calc(327/ 1200 * 100vw);
          margin: calc(0/ 1200 * 100vw) auto 0; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene05-wrap2 {
          width: 1200px;
          height: 327px;
          margin: 0px auto 0; } }
    .yt-logos-campbar23 .pairing-scene05-cocktail {
      position: absolute;
      top: 5.538vw;
      left: 5.23vw;
      width: 87.846vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene05-cocktail {
          top: calc(-34/ 1200 * 1080px) x;
          left: calc(48/ 1200 * 1080px);
          width: calc(688/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene05-cocktail {
          top: calc(-34/ 1200 * 100vw) x;
          left: calc(48/ 1200 * 100vw);
          width: calc(688/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene05-cocktail {
          top: -27px;
          left: 48px;
          width: 688px; } }
    .yt-logos-campbar23 .pairing-scene05-recipe {
      position: absolute;
      bottom: 0;
      right: 22vw;
      width: 63.692vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .pairing-scene05-recipe {
          right: calc(26/ 1200 * 1080px);
          width: calc(419/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .pairing-scene05-recipe {
          right: calc(26/ 1200 * 100vw);
          width: calc(419/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .pairing-scene05-recipe {
          right: 26px;
          width: 419px; } }
      .yt-logos-campbar23 .pairing-scene05-recipe:hover {
        cursor: pointer;
        opacity: 0.8; }
  .yt-logos-campbar23 .profile {
    width: 100%;
    background: url("../img/bg_profile_sp.png") no-repeat;
    background-size: 100% auto;
    background-position: top center; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .profile {
        width: 1080px; } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .profile {
        width: 100vw;
        background: url("../img/bg_profile_pc.png") no-repeat;
        background-size: 100% auto; } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .profile {
        width: 100%;
        background: url("../img/bg_profile_pcl.png") no-repeat;
        background-position: top center;
        background-size: auto auto; } }
    .yt-logos-campbar23 .profile-inner {
      position: relative;
      width: 100%;
      padding: 10.66vw 0; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .profile-inner {
          width: 1080px;
          margin: 0 auto;
          padding: calc(156/ 1200 * 1080px) 0; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .profile-inner {
          width: 100vw;
          margin: 0 auto;
          padding: calc(156/ 1200 * 100vw) 0; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .profile-inner {
          width: 1200px;
          padding: 156px 0; } }
      .yt-logos-campbar23 .profile-inner-title {
        width: 81.33vw;
        margin: 0 auto; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .profile-inner-title {
            width: calc(827/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .profile-inner-title {
            width: calc(827/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .profile-inner-title {
            width: 827px; } }
      .yt-logos-campbar23 .profile-inner-cont {
        width: 100vw;
        margin: 45.33vw auto 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .profile-inner-cont {
            width: calc(712/ 1200 * 1080px);
            margin: calc(663/ 1200 * 1080px) auto 0; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .profile-inner-cont {
            width: calc(712/ 1200 * 100vw);
            margin: calc(663/ 1200 * 100vw) auto 0; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .profile-inner-cont {
            width: 712px;
            margin: 663px auto 0; } }
      .yt-logos-campbar23 .profile-inner-illust {
        position: absolute;
        width: 6.93vw;
        top: -2vw;
        right: 10.66vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .profile-inner-illust {
            width: calc(92/ 1200 * 1080px);
            top: calc(-26/ 1200 * 1080px);
            right: calc(63/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .profile-inner-illust {
            width: calc(92/ 1200 * 100vw);
            top: calc(-26/ 1200 * 100vw);
            right: calc(63/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .profile-inner-illust {
            width: 92px;
            top: -26px;
            right: 63px; } }
  .yt-logos-campbar23 .logoslink {
    width: 100%;
    background-color: #9bc8c4; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .logoslink {
        width: 1080px; } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .logoslink {
        width: 100vw; } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .logoslink {
        width: 100%; } }
    .yt-logos-campbar23 .logoslink-inner {
      width: 100%;
      padding: 8.66vw 0 6vw 0; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .logoslink-inner {
          width: 1080px;
          margin: 0 auto;
          padding: calc(95/ 1200 * 1080px) 0 calc(77/ 1200 * 1080px) 0; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .logoslink-inner {
          width: 100vw;
          margin: 0 auto;
          padding: calc(95/ 1200 * 100vw) 0 calc(77/ 1200 * 100vw) 0; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .logoslink-inner {
          width: 1200px;
          padding: 95px 0 77px 0; } }
      .yt-logos-campbar23 .logoslink-inner-title {
        width: 71.06vw;
        margin: 0 auto; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .logoslink-inner-title {
            width: calc(572/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .logoslink-inner-title {
            width: calc(572/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .logoslink-inner-title {
            width: 572px; } }
      .yt-logos-campbar23 .logoslink-inner-text {
        width: 79.2vw;
        margin: 5.6vw auto 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .logoslink-inner-text {
            width: calc(551/ 1200 * 1080px);
            margin: calc(24/ 1200 * 1080px) auto 0; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .logoslink-inner-text {
            width: calc(551/ 1200 * 100vw);
            margin: calc(24/ 1200 * 100vw) auto 0; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .logoslink-inner-text {
            width: 551px;
            margin: 24px auto 0; } }
      .yt-logos-campbar23 .logoslink-inner-arrow {
        width: 12.8vw;
        margin: 3vw auto 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .logoslink-inner-arrow {
            width: calc(146/ 1200 * 1080px);
            margin: calc(50/ 1200 * 1080px) auto 0; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .logoslink-inner-arrow {
            width: calc(146/ 1200 * 100vw);
            margin: calc(50/ 1200 * 100vw) auto 0; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .logoslink-inner-arrow {
            width: 146px;
            margin: 50px auto 0; } }
      .yt-logos-campbar23 .logoslink-inner-banner {
        width: 67.06vw;
        margin: 4vw auto 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .logoslink-inner-banner {
            width: calc(764/ 1200 * 1080px);
            margin: calc(30/ 1200 * 1080px) auto 0; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .logoslink-inner-banner {
            width: calc(764/ 1200 * 100vw);
            margin: calc(30/ 1200 * 100vw) auto 0; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .logoslink-inner-banner {
            width: 764px;
            margin: 30px auto 0; } }
      .yt-logos-campbar23 .logoslink-inner-date {
        width: 38.93vw;
        margin: 3.6vw auto 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .logoslink-inner-date {
            width: calc(464/ 1200 * 1080px);
            margin: calc(85/ 1200 * 1080px) auto 0; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .logoslink-inner-date {
            width: calc(464/ 1200 * 100vw);
            margin: calc(85/ 1200 * 100vw) auto 0; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .logoslink-inner-date {
            width: 464px;
            margin: 85px auto 0; } }
  .yt-logos-campbar23 .prod {
    position: relative;
    padding: 17.46vw 0;
    background-color: #fff;
    /*slickカスタマイズ*/ }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .prod {
        padding: calc(220/ 1200 * 1080px) 0 calc(210/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .prod {
        padding: calc(220/ 1200 * 100vw) 0 calc(210/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .prod {
        padding: 220px 0 210px; } }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .prod-wrap {
        position: relative;
        width: 1080px;
        height: calc(550/ 1200 * 1080px);
        margin: 0 auto;
        border: 3px solid #000;
        border-radius: calc(26/ 1200 * 1080px); } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .prod-wrap {
        width: calc(1080/ 1200 * 100vw);
        height: calc(550/ 1200 * 100vw);
        border-radius: calc(26/ 1200 * 100vw); } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .prod-wrap {
        width: 1080px;
        height: 550px;
        border-radius: 26px; } }
    .yt-logos-campbar23 .prod-title {
      position: relative;
      width: 100%;
      margin: 0 auto; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .prod-title {
          margin: calc(-23/ 1200 * 1080px) auto 0;
          width: calc(442/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .prod-title {
          margin: calc(-23/ 1200 * 100vw) auto 0;
          width: calc(442/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .prod-title {
          margin: -23px auto 0;
          width: 442px; } }
    .yt-logos-campbar23 .prod-belt {
      position: absolute;
      left: 0;
      bottom: 10vw;
      width: 100%;
      height: 39.86vw;
      background-color: #ffd000; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .prod-belt {
          bottom: calc(41/ 1200 * 1080px);
          height: calc(179/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .prod-belt {
          bottom: calc(41/ 1200 * 100vw);
          height: calc(179/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .prod-belt {
          bottom: 41px;
          height: 179px; } }
    .yt-logos-campbar23 .prod-inner {
      width: 72vw;
      margin: 6.93vw auto 0; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .prod-inner {
          position: absolute;
          z-index: +1;
          display: flex;
          justify-content: space-between;
          flex-wrap: nowrap;
          top: calc(54/ 1200 * 1080px);
          left: calc(15/ 1200 * 1080px);
          width: calc(1050/ 1200 * 1080px);
          margin: calc(54/ 1200 * 1080px) auto 0; } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .prod-inner {
          top: calc(54/ 1200 * 100vw);
          left: calc(15/ 1200 * 100vw);
          width: calc(1050/ 1200 * 100vw);
          margin: calc(54/ 1200 * 100vw) auto 0; } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .prod-inner {
          top: 54px;
          left: 15px;
          width: 1050px;
          margin: 54px auto 0; } }
      .yt-logos-campbar23 .prod-inner li {
        width: 36vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .prod-inner li {
            width: calc(150/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .prod-inner li {
            width: calc(150/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .prod-inner li {
            width: 150px; } }
    .yt-logos-campbar23 .prod .slick-prev {
      left: -14vw;
      top: 45%;
      width: 10.4vw;
      height: 4.4vw;
      background: url("../img/lineup_pre.png") no-repeat;
      background-size: 100% auto;
      background-position: top right; }
    .yt-logos-campbar23 .prod .slick-prev:before {
      content: ''; }
    .yt-logos-campbar23 .prod .slick-next {
      right: -14vw;
      top: 45%;
      width: 10.4vw;
      height: 4.4vw;
      background: url("../img/lineup_next.png") no-repeat;
      background-size: 100% auto;
      background-position: top left; }
    .yt-logos-campbar23 .prod .slick-next:before {
      content: ''; }
  .yt-logos-campbar23 .gear {
    width: 100%;
    background-color: #e1d5d3; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .gear {
        width: 1080px; } }
    @media only screen and (min-width: 1080px) {
      .yt-logos-campbar23 .gear {
        width: 100%; } }
    @media only screen and (min-width: 1200px) {
      .yt-logos-campbar23 .gear {
        width: 100%; } }
    .yt-logos-campbar23 .gear-illust {
      position: absolute;
      width: 39.33vw;
      top: -14.66vw;
      left: 32.66vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .gear-illust {
          width: calc(259/ 1200 * 1080px);
          top: calc(-57/ 1200 * 1080px);
          left: calc(6/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .gear-illust {
          width: calc(259/ 1200 * 100vw);
          top: calc(-57/ 1200 * 100vw);
          left: calc(6/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .gear-illust {
          width: 259px;
          top: -57px;
          left: 6px; } }
    .yt-logos-campbar23 .gear-wrap {
      position: relative;
      width: 100%;
      padding: 30.66vw 0 10.4vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .gear-wrap {
          width: 1080px;
          margin: 0 auto;
          padding: calc(226/ 1200 * 1080px) 0 calc(155/ 1200 * 1080px); } }
      @media only screen and (min-width: 1080px) {
        .yt-logos-campbar23 .gear-wrap {
          width: 100%;
          margin: 0 auto;
          padding: calc(226/ 1200 * 100vw) 0 calc(155/ 1200 * 100vw); } }
      @media only screen and (min-width: 1200px) {
        .yt-logos-campbar23 .gear-wrap {
          width: 1200px;
          padding: 226px 0 155px; } }
      .yt-logos-campbar23 .gear-wrap-title {
        width: 67.86vw;
        margin: 0 auto; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .gear-wrap-title {
            width: calc(888/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .gear-wrap-title {
            width: calc(888/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .gear-wrap-title {
            width: 888px; } }
      .yt-logos-campbar23 .gear-wrap-arrow {
        width: 12.53vw;
        margin: 6.66vw auto 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .gear-wrap-arrow {
            width: calc(95/ 1200 * 1080px);
            margin: calc(55/ 1200 * 1080px) auto 0; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .gear-wrap-arrow {
            width: calc(95/ 1200 * 100vw);
            margin: calc(55/ 1200 * 100vw) auto 0; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .gear-wrap-arrow {
            width: 95px;
            margin: 55px auto 0; } }
      .yt-logos-campbar23 .gear-wrap-logos {
        width: 70.66vw;
        margin: 5.86vw auto 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .gear-wrap-logos {
            width: calc(458/ 1200 * 1080px);
            margin: calc(190/ 1200 * 1080px) auto 0; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .gear-wrap-logos {
            width: calc(458/ 1200 * 100vw);
            margin: calc(190/ 1200 * 100vw) auto 0; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .gear-wrap-logos {
            width: 458px;
            margin: 190px auto 0; } }
      .yt-logos-campbar23 .gear-wrap a {
        text-decoration: none; }
      .yt-logos-campbar23 .gear-wrap-logoline {
        font-size: 4.13vw;
        color: #744e33;
        text-align: center;
        padding-bottom: 2.53vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .gear-wrap-logoline {
            font-size: calc(23/ 1200 * 1080px);
            padding-bottom: calc(16/ 1200 * 1080px); } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .gear-wrap-logoline {
            font-size: calc(23/ 1200 * 100vw);
            padding-bottom: calc(16/ 1200 * 100vw); } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .gear-wrap-logoline {
            font-size: 23px;
            padding-bottom: 16px; } }
      .yt-logos-campbar23 .gear-wrap-lineup {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        width: 82vw;
        margin: 4.53vw auto 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .gear-wrap-lineup {
            justify-content: center;
            width: calc(936/ 1200 * 1080px);
            margin: calc(63/ 1200 * 1080px) auto 0; } }
        @media only screen and (min-width: 1080px) {
          .yt-logos-campbar23 .gear-wrap-lineup {
            width: calc(936/ 1200 * 100vw);
            margin: calc(63/ 1200 * 100vw) auto 0; } }
        @media only screen and (min-width: 1200px) {
          .yt-logos-campbar23 .gear-wrap-lineup {
            width: 936px;
            margin: 63px auto 0; } }
        .yt-logos-campbar23 .gear-wrap-lineup li {
          width: 35vw;
          margin-bottom: 2.5vw; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .gear-wrap-lineup li {
              width: calc(252/ 1200 * 1080px);
              margin-bottom: calc(37/ 1200 * 1080px); } }
          @media only screen and (min-width: 1080px) {
            .yt-logos-campbar23 .gear-wrap-lineup li {
              width: calc(252/ 1200 * 100vw);
              margin-bottom: calc(37/ 1200 * 100vw); } }
          @media only screen and (min-width: 1200px) {
            .yt-logos-campbar23 .gear-wrap-lineup li {
              width: 252px;
              margin-bottom: 37px; } }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(1), .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(2) {
              margin-right: calc(90/ 1200 * 1080px); } }
          @media only screen and (min-width: 1080px) {
            .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(1), .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(2) {
              margin-right: calc(90/ 1200 * 100vw); } }
          @media only screen and (min-width: 1200px) {
            .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(1), .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(2) {
              margin-right: 90px; } }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(4), .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(6) {
              margin: 0 calc(45/ 1200 * 1080px) calc(37/ 1200 * 1080px) calc(171/ 1200 * 1080px); } }
          @media only screen and (min-width: 1080px) {
            .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(4), .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(6) {
              margin: 0 calc(45/ 1200 * 100vw) calc(37/ 1200 * 100vw) calc(171/ 1200 * 100vw); } }
          @media only screen and (min-width: 1200px) {
            .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(4), .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(6) {
              margin: 0 45px 37px 171px; } }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(5), .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(7) {
              margin: 0 calc(171/ 1200 * 1080px) calc(37/ 1200 * 1080px) calc(45/ 1200 * 1080px); } }
          @media only screen and (min-width: 1080px) {
            .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(5), .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(7) {
              margin: 0 calc(171/ 1200 * 100vw) calc(37/ 1200 * 100vw) calc(45/ 1200 * 100vw); } }
          @media only screen and (min-width: 1200px) {
            .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(5), .yt-logos-campbar23 .gear-wrap-lineup li:nth-child(7) {
              margin: 0 171px 37px 45px; } }
          .yt-logos-campbar23 .gear-wrap-lineup li p {
            font-size: 3.06vw;
            line-height: 1.21;
            margin-top: 1vw;
            text-align: center;
            color: #805838; }
            @media only screen and (min-width: 769px) {
              .yt-logos-campbar23 .gear-wrap-lineup li p {
                font-size: calc(14/ 1200 * 1080px);
                line-height: 1.35;
                margin-top: calc(5/ 1200 * 1080px); } }
            @media only screen and (min-width: 1080px) {
              .yt-logos-campbar23 .gear-wrap-lineup li p {
                font-size: calc(14/ 1200 * 100vw);
                line-height: 1.35;
                margin-top: calc(5/ 1200 * 100vw); } }
            @media only screen and (min-width: 1200px) {
              .yt-logos-campbar23 .gear-wrap-lineup li p {
                font-size: 14px;
                margin-top: 5px; } }
          .yt-logos-campbar23 .gear-wrap-lineup li a {
            text-decoration: none; }
  .yt-logos-campbar23 .recipe-detail {
    display: none;
    position: relative;
    opacity: 0;
    width: 84vw;
    margin: 8vw auto 30vw;
    padding-bottom: 6.66vw;
    z-index: 150;
    background-color: #f7f6ed;
    background-image: url("../img/bg_recipe01_sp.png"), url("../img/bg_recipe02_sp.png");
    background-size: 100% auto, 100% auto;
    background-position: top center, bottom center;
    background-repeat: no-repeat, no-repeat; }
    @media only screen and (min-width: 769px) {
      .yt-logos-campbar23 .recipe-detail {
        width: 1070px;
        margin: 30px auto;
        padding-bottom: 30px;
        background-image: url("../img/bg_recipe01_pc.png"), url("../img/bg_recipe02_pc.png");
        background-size: 100% auto, 100% auto;
        background-position: top center, bottom center;
        background-repeat: no-repeat, no-repeat; } }
    .yt-logos-campbar23 .recipe-detail.active {
      display: block;
      animation: fadeIn 0.5s ease both; }
    .yt-logos-campbar23 .recipe-detail .recipe-detail-cont {
      padding: 6.66vw 0 0; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .recipe-detail .recipe-detail-cont {
          display: flex;
          justify-content: space-between;
          width: 1010px;
          padding: 30px 0 0;
          margin: 0 auto; } }
      .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-kv {
        width: 74.4vw;
        margin: 0 2.93vw 0 6.66vw; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-kv {
            width: 524px;
            margin: 0; } }
      .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe {
        width: 70.66vw;
        margin: 0 auto;
        padding-top: 2vw;
        font-size: 2.93vw;
        color: #6d4f37; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe {
            width: 470px;
            padding: 0;
            font-size: 15px;
            margin: 0 0 0 auto; } }
        .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-title {
          margin-top: 5.86vw;
          height: 5.33vw;
          padding: 1vw 0 0 1vw;
          background-color: #fbd400; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-title {
              margin-top: 0;
              height: 29px;
              padding: 5px 0 0 8px; } }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-title.how {
              margin-top: 25px; } }
          .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-title img {
            height: 3.2vw;
            width: auto;
            vertical-align: top; }
            @media only screen and (min-width: 769px) {
              .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-title img {
                height: 20px; } }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt {
            display: flex;
            justify-content: space-between;
            margin-top: 14px; } }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul {
            width: 225px; } }
        .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul:first-child {
          margin-top: 3vw; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul:first-child {
              margin-top: 0; } }
        .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li {
          display: flex;
          flex-flow: row wrap;
          justify-content: space-between;
          font-size: 2.93vw; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li {
              font-size: 18px; } }
          .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li span {
            line-height: 1.5; }
            .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li span.l2 {
              width: 100%; }
              @media only screen and (min-width: 769px) {
                .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li span.l2 {
                  width: 100%; } }
            .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li span.l2-sp {
              width: 100%; }
              @media only screen and (min-width: 769px) {
                .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li span.l2-sp {
                  width: auto; } }
            .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li span.l2-quantity {
              align-self: flex-end; }
              @media only screen and (min-width: 769px) {
                .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li span.l2-quantity {
                  width: auto; } }
          .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li .leader {
            flex: auto; }
          .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li hr.dotline {
            position: relative;
            top: calc(50% - 1px);
            margin: 0 5px;
            border: none;
            border-top: dotted 2px #CCC; }
          .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li hr.dotline_l2 {
            position: relative;
            top: calc(75% - 1px);
            margin: 0 5px;
            border: none;
            border-top: dotted 2px #CCC; }
          .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li.tl2 {
            align-items: flex-end; }
            @media only screen and (min-width: 769px) {
              .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li.tl2 {
                align-items: center; } }
            .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li.tl2 span {
              line-height: 1.2; }
              @media only screen and (min-width: 769px) {
                .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li.tl2 span {
                  line-height: 1.5; } }
            .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li.tl2 .leader {
              padding-bottom: 0.5em; }
              @media only screen and (min-width: 769px) {
                .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul li.tl2 .leader {
                  padding-bottom: 0; } }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-mt ul.clum-1 {
            width: 100% !important; } }
        .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-how {
          margin: 2vw auto 0; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-how {
              margin: 10px auto 20px; } }
          .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-how li {
            padding-left: 1em;
            text-indent: -1em;
            margin-bottom: 0.3em;
            text-align: justify;
            font-size: 2.93vw; }
            @media only screen and (min-width: 769px) {
              .yt-logos-campbar23 .recipe-detail .recipe-detail-cont-recipe-how li {
                font-size: 18px; } }
    .yt-logos-campbar23 .recipe-detail .recipe-detail-reco {
      margin: 10.66vw auto 0; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .recipe-detail .recipe-detail-reco {
          margin: 43px auto 0; } }
      .yt-logos-campbar23 .recipe-detail .recipe-detail-reco-title {
        width: 62.93vw;
        margin: 0 auto; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-reco-title {
            width: 702px; } }
      .yt-logos-campbar23 .recipe-detail .recipe-detail-reco-cont {
        margin: 7.46vw auto 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-reco-cont {
            display: flex;
            justify-content: space-between;
            margin: 10px auto 0; } }
        .yt-logos-campbar23 .recipe-detail .recipe-detail-reco-cont li:nth-child(2) {
          margin-top: 8.26vw; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .recipe-detail .recipe-detail-reco-cont li:nth-child(2) {
              margin-top: 0;
              width: 535px; } }
    .yt-logos-campbar23 .recipe-detail .recipe-detail-gear {
      width: 70.66vw;
      height: 71.33vw;
      margin: 12.13vw auto 0;
      background-color: #fff;
      border-bottom: 2px solid #ab3029;
      background-position: bottom 2.26vw center;
      background-size: 66vw auto;
      background-repeat: no-repeat; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .recipe-detail .recipe-detail-gear {
          width: 1010px;
          height: 240px;
          margin: 31px auto 0;
          border-bottom: 4px solid #ab3029;
          background-position: bottom right;
          background-size: 662px auto; } }
      .yt-logos-campbar23 .recipe-detail .recipe-detail-gear.g01 {
        background-image: url("../img/recipe01_gia_ph_sp.jpg"); }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-gear.g01 {
            background-image: url("../img/recipe01_gia_ph_pc.jpg"); } }
      .yt-logos-campbar23 .recipe-detail .recipe-detail-gear.g02 {
        background-image: url("../img/recipe02_gia_ph_sp.jpg"); }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-gear.g02 {
            background-image: url("../img/recipe02_gia_ph_pc.jpg"); } }
      .yt-logos-campbar23 .recipe-detail .recipe-detail-gear.g03 {
        background-image: url("../img/recipe03_gia_ph_sp.jpg");
        background-position: bottom 2.26vw center;
        background-size: 66vw auto;
        background-repeat: no-repeat; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-gear.g03 {
            background-image: url("../img/recipe03_gia_ph_pc.jpg");
            background-position: bottom right;
            background-size: 662px auto; } }
      .yt-logos-campbar23 .recipe-detail .recipe-detail-gear.g04 {
        background-image: url("../img/recipe04_gia_ph_sp.jpg");
        background-position: bottom 2.26vw center;
        background-size: 66vw auto;
        background-repeat: no-repeat; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-gear.g04 {
            background-image: url("../img/recipe04_gia_ph_pc.jpg");
            background-position: bottom right;
            background-size: 662px auto; } }
      .yt-logos-campbar23 .recipe-detail .recipe-detail-gear.g05 {
        background-image: url("../img/recipe05_gia_ph_sp.jpg");
        background-position: bottom 2.26vw center;
        background-size: 66vw auto;
        background-repeat: no-repeat; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-gear.g05 {
            background-image: url("../img/recipe05_gia_ph_pc.jpg");
            background-position: bottom right;
            background-size: 662px auto; } }
      .yt-logos-campbar23 .recipe-detail .recipe-detail-gear-title {
        text-align: center;
        background-color: #ab3029;
        padding: 0.3em; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-gear-title {
            width: 448px;
            padding: 0.5em; } }
        .yt-logos-campbar23 .recipe-detail .recipe-detail-gear-title img {
          width: 61vw;
          vertical-align: middle; }
          @media only screen and (min-width: 769px) {
            .yt-logos-campbar23 .recipe-detail .recipe-detail-gear-title img {
              width: 387px; } }
      .yt-logos-campbar23 .recipe-detail .recipe-detail-gear-subtitle {
        width: 58vw;
        margin: 5.86vw auto 0; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-gear-subtitle {
            width: 307px;
            margin: 30px 0 0 30px; } }
      .yt-logos-campbar23 .recipe-detail .recipe-detail-gear-text {
        width: 58vw;
        margin: 4vw auto 0;
        font-size: 2.4vw;
        line-height: 1.75; }
        @media only screen and (min-width: 769px) {
          .yt-logos-campbar23 .recipe-detail .recipe-detail-gear-text {
            width: 500px;
            margin: 22px 0 0 30px;
            font-size: 15px; } }
    .yt-logos-campbar23 .recipe-detail .close__btn {
      position: absolute;
      width: 6.4vw;
      top: -3.2vw;
      right: -3.2vw; }
      @media only screen and (min-width: 769px) {
        .yt-logos-campbar23 .recipe-detail .close__btn {
          width: 48px;
          top: -20px;
          right: -20px;
          cursor: pointer; } }
  .yt-logos-campbar23 .modal-wrap {
    position: fixed;
    top: 0;
    left: 0;
    display: none;
    width: 100%;
    height: 100vh;
    overflow-x: hidden;
    overflow-y: scroll;
    z-index: -1; }
    .yt-logos-campbar23 .modal-wrap.active {
      display: block;
      z-index: 9999; }
    .yt-logos-campbar23 .modal-wrap .modal-closer {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      z-index: -2; }
  .yt-logos-campbar23 .modal_bk {
    position: fixed;
    top: 0;
    left: 0;
    display: none;
    width: 100%;
    height: 100vh;
    background-color: #fff;
    opacity: 0.8; }
    .yt-logos-campbar23 .modal_bk.active {
      display: block;
      z-index: 9998; }
  .yt-logos-campbar23 .upin {
    opacity: 0; }
    .yt-logos-campbar23 .upin.active {
      animation: upin 0.2s ease-out 0.5s forwards; }
@keyframes upin {
  from {
    opacity: 0;
    transform: scale(0.25); }
  to {
    opacity: 1;
    transform: scale(1); } }
  .yt-logos-campbar23 .effect-fade-in {
    opacity: 0; }
  .yt-logos-campbar23 .effect-fade-in.active {
    animation: fadeIn 0.5s ease-out forwards; }
  .yt-logos-campbar23 .tamaboke1, .yt-logos-campbar23 .tamaboke2, .yt-logos-campbar23 .tamaboke3, .yt-logos-campbar23 .tamaboke4, .yt-logos-campbar23 .tamaboke5, .yt-logos-campbar23 .tamaboke6, .yt-logos-campbar23 .tamaboke7 {
    opacity: 0; }
  .yt-logos-campbar23 .tamaboke1.active {
    animation: fadeInOut 3.5s ease 3s infinite; }
  .yt-logos-campbar23 .tamaboke2.active {
    animation: fadeInOut 4s ease 7.5s infinite; }
  .yt-logos-campbar23 .tamaboke3.active {
    animation: fadeInOut 5s ease 12s infinite; }
  .yt-logos-campbar23 .tamaboke4.active {
    animation: fadeInOut 5s ease 4s infinite; }
  .yt-logos-campbar23 .tamaboke5.active {
    animation: fadeInOut 5s ease 10.5s infinite; }
  .yt-logos-campbar23 .tamaboke6.active {
    animation: fadeInOut 4.5s ease 6s infinite; }
  .yt-logos-campbar23 .tamaboke7.active {
    animation: fadeInOut 6s ease 9s infinite; }
@keyframes fadeInOut {
  0% {
    opacity: 0; }
  50% {
    opacity: 0.7; }
  60% {
    opacity: 0.8; }
  75% {
    opacity: 0; }
  100% {
    opacity: 0; } }
@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }