@charset "UTF-8";
main#container {
  /* 共通 */
  font-size: 1.8rem;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-font-feature-settings: "palt";
  font-feature-settings: "palt";
  background-color: #000;
  color: #fff;
  /* MV */
  /* CX-80 */ }
  @media screen and (max-width: 768px) {
    main#container {
      font-size: 4vmin; } }
  @media (max-width: 1199px) {
    main#container {
      /* clamp( 最小値px, 中間値{ 最小値 + ( 現在の画面幅 - TBブレイクポイント幅 ) / ( PC-TBブレイクポイント幅差 ) * ( 最大値 - 最小値 ) }, 最大値px )*/
      font-size: clamp(14px, 14px + (100vw - 600px) / 600px * 4, 18px); } }
  @media print {
    main#container {
      font-size: 9pt; } }
  main#container img {
    width: 100%;
    height: auto; }
  main#container a {
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
    text-decoration: none; }
    main#container a:hover {
      opacity: .7;
      transition: .3s;
      -webkit-transition: .3s;
      -moz-transition: .3s;
      -ms-transition: .3s;
      -o-transition: .3s; }
  main#container .inner {
    max-width: 1000px;
    margin: 0 auto; }
  main#container .flex {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2em; }
  main#container .center {
    text-align: center;
    margin: auto; }
  main#container .grid_wrap {
    display: grid;
    grid-template-rows: max-content max-content;
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    color: #231815; }
  @media screen and (max-width: 768px) {
    main#container .flex {
      flex-direction: column; }
    main#container .grid_wrap {
      display: flex;
      flex-direction: column; } }
  main#container .mv {
    background-image: linear-gradient(125deg, #dc010c, #641824);
    padding: 6vw 0 6vw 0; }
    main#container .mv h1 {
      width: 90%;
      max-width: 760px;
      margin: 0 auto 3vw auto;
      padding: 0 0 0 0; }
    main#container .mv .period {
      width: 90%;
      max-width: 680px;
      margin: 0 auto;
      padding: 0 0 0 0; }
    @media screen and (max-width: 768px) {
      main#container .mv .period {
        width: 80%; } }
    main#container .mv .present .clms {
      display: flex;
      justify-content: center;
      align-items: center;
      column-gap: 2em;
      width: 90%;
      max-width: 1000px;
      margin: 6vw auto 0 auto;
      padding: 1em 1em 1em 2em;
      background-image: linear-gradient(#dea44f, #f6e78b 20%, #f8ed90);
      position: relative; }
      main#container .mv .present .clms .clm {
        display: flex;
        justify-content: space-between;
        align-content: center;
        align-items: center;
        column-gap: 1em;
        color: #000; }
        main#container .mv .present .clms .clm h2 {
          font-size: 3.8rem;
          font-weight: bold;
          line-height: 1.4;
          letter-spacing: 0.1em; }
        @media screen and (max-width: 768px) {
          main#container .mv .present .clms .clm h2 {
            font-size: 3rem;
            margin-bottom: 0.5em; } }
        main#container .mv .present .clms .clm p {
          font-size: 2.4rem;
          font-weight: bold;
          line-height: 1.4; }
        @media screen and (max-width: 768px) {
          main#container .mv .present .clms .clm p {
            font-size: 2rem; } }
        main#container .mv .present .clms .clm .remarks {
          font-size: 1.6rem;
          font-weight: 500;
          line-height: 1.4;
          margin-top: 0.5em; }
        @media screen and (max-width: 768px) {
          main#container .mv .present .clms .clm .remarks {
            font-size: 1.2rem; } }
        main#container .mv .present .clms .clm .inclm img {
          max-width: 107px; }
        @media screen and (max-width: 768px) {
          main#container .mv .present .clms .clm .inclm img {
            max-width: 60px;
            position: absolute;
            top: 0;
            right: -0.3em; } }
      @media screen and (max-width: 768px) {
        main#container .mv .present .clms .clm {
          column-gap: 0; } }
    @media screen and (max-width: 768px) {
      main#container .mv .present .clms {
        flex-direction: column;
        padding: 2em 1em 2em 1em; } }
    main#container .mv .present .lottery .arrow {
      max-width: 184px;
      margin: 2vw auto 4vw auto; }
    @media screen and (max-width: 768px) {
      main#container .mv .present .lottery .arrow {
        max-width: 122px; } }
    main#container .mv .present .award_clms {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      width: 90%;
      max-width: 1000px;
      margin: 0 auto 0 auto; }
      main#container .mv .present .award_clms .clm {
        width: 48%;
        background: #FFF;
        padding: 1.25em;
        border: solid 2px #DEA44F;
        position: relative;
        z-index: 0; }
        main#container .mv .present .award_clms .clm .inclm {
          display: flex;
          flex-wrap: wrap;
          color: #000; }
          main#container .mv .present .award_clms .clm .inclm .imges {
            width: 65%; }
            main#container .mv .present .award_clms .clm .inclm .imges img {
              max-width: 260px;
              margin-bottom: 0.5em; }
            main#container .mv .present .award_clms .clm .inclm .imges p {
              font-size: 1.6rem;
              font-weight: 500;
              line-height: 1.4; }
            @media screen and (max-width: 768px) {
              main#container .mv .present .award_clms .clm .inclm .imges p {
                font-size: 1.2rem; } }
          @media screen and (max-width: 768px) {
            main#container .mv .present .award_clms .clm .inclm .imges {
              padding-right: 1em;
              width: 60%; } }
          main#container .mv .present .award_clms .clm .inclm .txt {
            width: 35%;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            column-gap: normal; }
            main#container .mv .present .award_clms .clm .inclm .txt p {
              font-size: 2rem;
              font-weight: bold;
              line-height: 1.4; }
            @media screen and (max-width: 768px) {
              main#container .mv .present .award_clms .clm .inclm .txt P {
                font-size: 1.6rem; } }
            main#container .mv .present .award_clms .clm .inclm .txt p.pt2 {
              padding-top: 2em; }
            main#container .mv .present .award_clms .clm .inclm .txt img {
              max-width: 120px; }
            main#container .mv .present .award_clms .clm .inclm .txt .quantity {
              text-align: right;
              font-size: 2.4rem;
              color: #DC010C; }
              main#container .mv .present .award_clms .clm .inclm .txt .quantity span.number {
                font-size: 4.8rem; }
              @media screen and (max-width: 768px) {
                main#container .mv .present .award_clms .clm .inclm .txt .quantity span.number {
                  font-size: 3rem; } }
            @media screen and (max-width: 768px) {
              main#container .mv .present .award_clms .clm .inclm .txt .quantity {
                font-size: 1.6rem; } }
          @media screen and (max-width: 768px) {
            main#container .mv .present .award_clms .clm .inclm .txt {
              width: 40%; } }
      @media screen and (max-width: 768px) {
        main#container .mv .present .award_clms .clm {
          width: 100%;
          margin-bottom: 3em; } }
      main#container .mv .present .award_clms .award_a::before, main#container .mv .present .award_clms .award_b::before {
        display: block;
        content: "";
        width: 17%;
        max-width: 80px;
        height: 45%;
        max-height: 103px;
        position: absolute;
        top: -1.75em;
        left: -1.75em;
        z-index: 1; }
      @media screen and (max-width: 768px) {
        main#container .mv .present .award_clms .award_a::before, main#container .mv .present .award_clms .award_b::before {
          left: -1em; } }
      main#container .mv .present .award_clms .award_a::before {
        background: url("../image/ribon_a.svg") no-repeat;
        background-position: 0 0;
        background-size: 100%; }
      main#container .mv .present .award_clms .award_b::before {
        background: url("../image/ribon_b.svg") no-repeat;
        background-position: 0 0;
        background-size: 100%; }
    @media screen and (max-width: 768px) {
      main#container .mv .present .award_clms {
        flex-direction: column; } }
  main#container .grad_line {
    width: 100%;
    height: 10px;
    background-image: linear-gradient(90deg, #dea44f, #f7ea8e 50%, #dea44f); }
  main#container .cx80 .inner {
    padding: 5vw 0; }
    main#container .cx80 .inner h2 {
      text-align: center;
      font-size: 4.4rem;
      margin-bottom: 2vw; }
    @media screen and (max-width: 768px) {
      main#container .cx80 .inner h2 {
        font-size: 3.4rem; } }
    main#container .cx80 .inner p {
      width: 90%;
      max-width: 550px;
      margin: 0 auto;
      font-size: 2.4rem;
      font-weight: bold;
      line-height: 1.5; }
    @media screen and (max-width: 768px) {
      main#container .cx80 .inner p {
        font-size: 1.6rem; } }
    main#container .cx80 .inner p.remarks {
      width: 90%;
      max-width: 550px;
      margin: 4vw auto 0 auto;
      text-align: left;
      font-size: 1.4rem;
      font-weight: bold;
      line-height: 1.4; }
    @media screen and (max-width: 768px) {
      main#container .cx80 .inner p.remarks {
        font-size: 1.2rem;
        font-weight: 100; } }
  main#container .cx80 .spec {
    display: flex;
    justify-content: flex-start;
    column-gap: 2em;
    margin-top: 3vw; }
    main#container .cx80 .spec .ph {
      width: 50%; }
    @media screen and (max-width: 768px) {
      main#container .cx80 .spec .ph {
        width: 100%; } }
    main#container .cx80 .spec .list a.more_btn {
      width: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      text-decoration: none;
      color: #FFF;
      background: #DC010C;
      padding: 1em 0;
      font-size: 2rem;
      font-weight: 400;
      line-height: 1;
      box-shadow: 0px 3px 6px 0px rgba(255, 255, 255, 0.26);
      margin-top: 1em; }
      main#container .cx80 .spec .list a.more_btn span {
        display: inline-block;
        position: relative; }
      main#container .cx80 .spec .list a.more_btn span::before {
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-top: 6px solid transparent;
        border-bottom: 6px solid transparent;
        border-left: 8px solid #FFF;
        border-right: 0;
        position: absolute;
        top: 50%;
        right: -1em;
        z-index: 1;
        margin-top: -5px;
        transition: 0.3s; }
    main#container .cx80 .spec .list a:hover {
      opacity: 1; }
      main#container .cx80 .spec .list a:hover span::before {
        right: -1.25em;
        transition: 0.3s; }
    main#container .cx80 .spec .list a:active {
      box-shadow: 0px 3px 6px 0px rgba(255, 255, 255, 0); }
    @media screen and (max-width: 768px) {
      main#container .cx80 .spec .list {
        width: 90%;
        margin: 5vw auto; } }
  @media screen and (max-width: 768px) {
    main#container .cx80 .spec {
      flex-direction: column;
      column-gap: 0; } }
  main#container .cx80 .photos {
    display: flex;
    justify-content: flex-start;
    column-gap: 2em;
    padding: 3vw 0; }
  @media screen and (max-width: 768px) {
    main#container .cx80 .photos {
      flex-direction: column;
      gap: 1em; } }
  main#container .cx60 {
    background-image: linear-gradient(#c3c3c3, #e1e1e1 19% 84%, #c3c3c3);
    padding: 4vw 0; }
    main#container .cx60 .spec {
      display: flex;
      justify-content: flex-end;
      column-gap: 2em;
      margin-top: 3vw; }
      main#container .cx60 .spec .ph {
        width: 50%; }
      @media screen and (max-width: 768px) {
        main#container .cx60 .spec .ph {
          width: 100%; } }
      main#container .cx60 .spec .list {
        display: flex;
        flex-direction: column; }
        main#container .cx60 .spec .list .speclist {
          max-width: max-content; }
        main#container .cx60 .spec .list .ph {
          width: 300px;
          margin-top: 4vw; }
        @media screen and (max-width: 768px) {
          main#container .cx60 .spec .list .ph {
            width: 100%; } }
        main#container .cx60 .spec .list a.more_btn {
          width: 100%;
          display: flex;
          justify-content: center;
          align-items: center;
          text-decoration: none;
          color: #FFF;
          background: #DC010C;
          padding: 1em 0;
          font-size: 2rem;
          font-weight: 400;
          line-height: 1;
          box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.26);
          margin-top: 1em; }
          main#container .cx60 .spec .list a.more_btn span {
            display: inline-block;
            position: relative; }
          main#container .cx60 .spec .list a.more_btn span::before {
            content: "";
            width: 0;
            height: 0;
            border-style: solid;
            border-top: 6px solid transparent;
            border-bottom: 6px solid transparent;
            border-left: 8px solid #FFF;
            border-right: 0;
            position: absolute;
            top: 50%;
            right: -1em;
            z-index: 1;
            margin-top: -5px;
            transition: 0.3s; }
        main#container .cx60 .spec .list a:hover {
          opacity: 1; }
          main#container .cx60 .spec .list a:hover span::before {
            right: -1.25em;
            transition: 0.3s; }
        main#container .cx60 .spec .list a:active {
          box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0); }
      @media screen and (max-width: 768px) {
        main#container .cx60 .spec .list {
          width: 90%;
          margin: 5vw auto; } }
    @media screen and (max-width: 768px) {
      main#container .cx60 .spec {
        flex-direction: column-reverse;
        column-gap: 0; } }
  main#container .others {
    background: #FFF;
    padding: 4vw 0 10vw 0; }
    main#container .others .inner {
      width: 90%;
      max-width: 1000px;
      margin: 0 auto; }
      main#container .others .inner .spec {
        display: flex;
        justify-content: flex-start;
        column-gap: 2em;
        margin-top: 3vw; }
        main#container .others .inner .spec .main {
          width: 58%; }
          main#container .others .inner .spec .main .list {
            padding: 2vw 0 0 1vw;
            max-width: max-content; }
          @media screen and (max-width: 768px) {
            main#container .others .inner .spec .main .list {
              padding: 2vw 0 0 0;
              width: 100%; } }
        @media screen and (max-width: 768px) {
          main#container .others .inner .spec .main {
            width: 100%; } }
        main#container .others .inner .spec .sub {
          width: 42%; }
          main#container .others .inner .spec .sub img {
            margin-bottom: 1vw; }
          @media screen and (max-width: 768px) {
            main#container .others .inner .spec .sub img {
              margin-bottom: 2vw; } }
          main#container .others .inner .spec .sub a.more_btn {
            width: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            text-decoration: none;
            color: #FFF;
            background: #DC010C;
            padding: 1em 0;
            font-size: 2rem;
            font-weight: 400;
            line-height: 1;
            box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.26); }
            main#container .others .inner .spec .sub a.more_btn span {
              display: inline-block;
              position: relative; }
            main#container .others .inner .spec .sub a.more_btn span::before {
              content: "";
              width: 0;
              height: 0;
              border-style: solid;
              border-top: 6px solid transparent;
              border-bottom: 6px solid transparent;
              border-left: 8px solid #FFF;
              border-right: 0;
              position: absolute;
              top: 50%;
              right: -1em;
              z-index: 1;
              margin-top: -5px;
              transition: 0.3s; }
          main#container .others .inner .spec .sub a:hover {
            opacity: 1; }
            main#container .others .inner .spec .sub a:hover span::before {
              right: -1.25em;
              transition: 0.3s; }
          main#container .others .inner .spec .sub a:active {
            box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0); }
        @media screen and (max-width: 768px) {
          main#container .others .inner .spec .sub {
            width: 100%;
            margin-top: 4vw; } }
      @media screen and (max-width: 768px) {
        main#container .others .inner .spec {
          flex-direction: column; } }
      main#container .others .inner .spec + .spec {
        margin-top: 6vw; }
      @media screen and (max-width: 768px) {
        main#container .others .inner .spec + .spec {
          margin-top: 10vw; } }
  main#container .banner {
    padding: 12vw 0 0 0; }
    main#container .banner a {
      display: flex;
      flex-direction: column;
      justify-content: center;
      width: 90%;
      max-width: 832px;
      margin: 0 auto;
      padding: 2em;
      border: solid 2px #000; }
      main#container .banner a .title {
        margin-bottom: 1em; }
      @media screen and (max-width: 768px) {
        main#container .banner a .title {
          margin-bottom: 0.5em; } }
      main#container .banner a p {
        text-align: center;
        font-size: 2rem;
        font-weight: bold;
        line-height: 1.4;
        color: #000; }
      @media screen and (max-width: 768px) {
        main#container .banner a p {
          font-size: 1.4rem; } }
    @media screen and (max-width: 768px) {
      main#container .banner a {
        padding: 1em; } }

/* footer */
@media screen and (max-width: 1019px) {
  #footer .bnr .pc {
    display: none; }
  #footer .bnr .sp {
    display: block !important; }
  #footer .bnr ul {
    display: flex;
    justify-content: center;
    gap: 1em; }
  #footer .bnr li {
    float: none;
    width: auto; } }

/*# sourceMappingURL=style.css.map */