@charset "UTF-8";
/* CSS Document */
/* -------------------------------------------------

Reset.css

------------------------------------------------- */
@media print {
  html, body {
    zoom: 0.8; } }
html, body, div, p, span, address, h1, h2, h3, h4, h5, h6, header, hgroup, footer, section, article, aside, nav, figure, figcaption {
  margin: 0;
  padding: 0;
  font-style: normal;
  font-weight: normal;
  line-height: 160%; }

ul, ol, li, dl, dt, dd {
  margin: 0;
  padding: 0;
  font-style: normal;
  font-weight: normal;
  line-height: 180%;
  list-style: none; }

body {
  color: #aa841f;
  font-size: 1.2em;
  font-family: yu-mincho-pr6n, sans-serif;
  font-style: normal;
  -webkit-text-size-adjust: 100%; }

a {
  color: #aa841f;
  outline: none;
  text-decoration: none;
  transition: 0.3s; }

a:hover {
  opacity: 0.7; }

a:active {
  text-decoration: under-line; }

a img {
  border-style: none;
  transition: 0.3s; }

div, p, span, address, header, hgroup, footer, section, article, aside, nav, ul, ol, li, dl, dt, dd, figure, figcaption {
  box-sizing: border-box; }

.tt,
.tt5 {
  display: none; }

/* PC */
/* Tablet */
/* SP縦以外 */
@media screen and (min-width: 641px) {
  /*SP縦以外を表示*/
  .ta {
    display: block; } }
/* iphone5 */
@media screen {
  .fade00 {
    opacity: 0;
    transition: 1s; }

  .fade01 {
    opacity: 0;
    transition: 1s;
    transform: translate(0, 30px); }

  .fade00a {
    opacity: 1.0;
    transform: translate(0, 0); } }
body {
  color: #000; }

header {
  background-image: url("../images/main_bg_pc.png");
  background-size: cover;
  background-position: top center; }
  @media all and (max-width: 1000px) {
    header {
      background-image: url("../images/main_bg_sp.png"); } }
  header .box {
    height: 100vh;
    position: relative; }
    header .box .logo {
      top: 20px;
      left: 20px;
      position: absolute; }
      @media all and (max-width: 480px) {
        header .box .logo img {
          width: 200px;
          height: auto; } }
    header .box h1 {
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      position: absolute; }
      header .box h1 img {
        width: 800px;
        height: auto; }
      @media all and (max-width: 1000px) {
        header .box h1 {
          top: 55%;
          left: 0;
          transform: translate(0%, -55%);
          -webkit-transform: translate(0%, -55%);
          -ms-transform: translate(0%, -55%); }
          header .box h1 img {
            width: 90%;
            height: auto;
            padding: 0 5%; } }
    header .box .present {
      top: 20px;
      right: 20px;
      position: absolute; }
      @media all and (max-width: 1000px) {
        header .box .present {
          left: 20px; }
          header .box .present img {
            width: 100%;
            height: auto; } }

@media all and (max-width: 896px) {
  main {
    padding: 0 20px; } }
@media all and (max-width: 480px) {
  main {
    padding: 0 25px; } }
main h2 {
  padding: 100px 0 0;
  text-align: center; }
  @media all and (max-width: 896px) {
    main h2 {
      font-size: 20px; } }
  @media all and (max-width: 480px) {
    main h2 {
      padding: 50px 0 0;
      text-align: left; } }
  main h2::before {
    content: '';
    width: 100%;
    height: 200px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    background-image: url("../images/main_illust_left.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    position: absolute;
    display: block; }
    @media all and (max-width: 1000px) {
      main h2::before {
        width: 95%;
        height: 100px;
        top: 40%;
        left: 5%; } }
    @media all and (max-width: 896px) {
      main h2::before {
        width: 100%;
        height: 100px;
        top: 30%;
        left: 0%; } }
    @media all and (max-width: 480px) {
      main h2::before {
        display: none; } }
  main h2::after {
    content: '';
    width: 100%;
    height: 200px;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    background-image: url("../images/main_illust_right.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
    position: absolute;
    display: block; }
    @media all and (max-width: 1000px) {
      main h2::after {
        width: 95%;
        height: 100px;
        top: 40%;
        right: 5%; } }
    @media all and (max-width: 896px) {
      main h2::after {
        width: 100%;
        height: 100px;
        top: 30%;
        left: 0%; } }
    @media all and (max-width: 480px) {
      main h2::after {
        display: none; } }
  main h2 .spnone {
    display: block; }
    @media all and (max-width: 480px) {
      main h2 .spnone {
        display: none; } }
  main h2 span {
    color: #991c54;
    font-size: 20px; }
main .banner {
  max-width: 1000px;
  margin: 50px auto 0;
  position: relative; }
  main .banner img {
    width: 100%;
    height: auto; }
  @media all and (max-width: 480px) {
    main .banner {
      margin: 25px auto 0; } }
main ul {
  margin: 50px 0 80px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  position: relative; }
  @media all and (max-width: 480px) {
    main ul {
      margin: 25px 0 30px; } }
  main ul li {
    max-width: 393px; }
    main ul li a img {
      width: 100%;
      height: auto; }

.inner {
  max-width: 1000px;
  margin: auto; }
  @media all and (max-width: 1000px) {
    .inner {
      width: 90%; } }

.pconly {
  display: block; }
  @media all and (max-width: 1000px) {
    .pconly {
      display: none; } }

.sponly {
  display: none; }
  @media all and (max-width: 1000px) {
    .sponly {
      display: block; } }

#campaign {
  padding: 100px 0;
  background: #FCF2A3; }
  @media all and (max-width: 480px) {
    #campaign {
      padding: 50px 0; } }
  #campaign h3 {
    margin: 0 auto; }
    #campaign h3 img {
      width: 100%;
      height: auto; }
  #campaign h4 {
    max-width: 300px;
    margin: 0 auto;
    padding: 10px;
    color: #FFFFFF;
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-weight: bold;
    text-align: center;
    border-radius: 10px;
    background: #991D54; }
  #campaign .box {
    margin: 50px 0 0; }
    @media all and (max-width: 1000px) {
      #campaign .box {
        margin: 25px 0 0; } }
    #campaign .box:nth-of-type(1) p {
      margin: 50px 0 0;
      color: #991D54;
      font-size: 25px;
      font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
      font-weight: bold;
      text-align: center;
      position: relative; }
      @media all and (max-width: 1000px) {
        #campaign .box:nth-of-type(1) p {
          margin: 25px 0 0; } }
      @media all and (max-width: 480px) {
        #campaign .box:nth-of-type(1) p {
          font-size: 20px; } }
      #campaign .box:nth-of-type(1) p::after {
        content: '';
        width: 251px;
        height: 121px;
        top: -33px;
        right: 0;
        background-image: url("../images/campaign_illust.png");
        background-repeat: no-repeat;
        background-position: right;
        position: absolute;
        display: block; }
        @media all and (max-width: 896px) {
          #campaign .box:nth-of-type(1) p::after {
            width: 135px;
            height: 65px;
            top: 40px;
            background-size: 100% auto; } }
        @media all and (max-width: 480px) {
          #campaign .box:nth-of-type(1) p::after {
            display: none; } }
      #campaign .box:nth-of-type(1) p span {
        font-size: 20px; }
        @media all and (max-width: 480px) {
          #campaign .box:nth-of-type(1) p span {
            font-size: 15px; } }
    #campaign .box:nth-of-type(2) ul {
      margin: 0 auto; }
      #campaign .box:nth-of-type(2) ul li {
        margin: 50px 0 0;
        text-align: center; }
        @media all and (max-width: 1000px) {
          #campaign .box:nth-of-type(2) ul li {
            margin: 25px 0 0; } }
        #campaign .box:nth-of-type(2) ul li img {
          width: 100%;
          height: auto; }
    #campaign .box:nth-of-type(2) .txt {
      margin: 50px 0 0;
      font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; }
      @media all and (max-width: 1000px) {
        #campaign .box:nth-of-type(2) .txt {
          margin: 25px 0 0; } }
      @media all and (max-width: 896px) {
        #campaign .box:nth-of-type(2) .txt {
          font-size: 15px; } }
    #campaign .box:nth-of-type(2) .img {
      max-width: 800px;
      margin: 50px auto 0; }
      @media all and (max-width: 1000px) {
        #campaign .box:nth-of-type(2) .img {
          margin: 25px 0 0; } }
      #campaign .box:nth-of-type(2) .img img {
        width: 100%;
        height: auto; }

#prize {
  padding: 100px 0;
  background: #CBE3AE; }
  @media all and (max-width: 480px) {
    #prize {
      padding: 50px 0; } }
  #prize h3 {
    max-width: 588px;
    margin: 0 auto; }
    #prize h3 img {
      width: 100%;
      height: auto; }
  #prize .box {
    margin: 50px 0 0; }
    @media all and (max-width: 1000px) {
      #prize .box {
        margin: 25px 0 0; } }
    #prize .box:nth-of-type(1) dl {
      max-width: 1000px;
      display: flex;
      flex-wrap: wrap;
      justify-content: center; }
      #prize .box:nth-of-type(1) dl dd {
        margin: 0 0 0 50px; }
        @media all and (max-width: 1000px) {
          #prize .box:nth-of-type(1) dl dd {
            margin: 25px 0 0; } }
        #prize .box:nth-of-type(1) dl dd img {
          width: 100%;
          height: auto; }
    #prize .box:nth-of-type(1) p {
      margin: 25px 0 0;
      font-size: 25px;
      text-align: center; }
      @media all and (max-width: 1000px) {
        #prize .box:nth-of-type(1) p {
          margin: 25px 0 0; } }
    #prize .box:nth-of-type(2) dl {
      max-width: 1000px;
      display: flex;
      flex-wrap: wrap;
      justify-content: center; }
      #prize .box:nth-of-type(2) dl dd {
        margin: 0 0 0 50px; }
        @media all and (max-width: 1000px) {
          #prize .box:nth-of-type(2) dl dd {
            margin: 25px 0 0; } }
        #prize .box:nth-of-type(2) dl dd img {
          width: 100%;
          height: auto; }
    #prize .box:nth-of-type(2) p {
      margin: 50px 0 0;
      font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; }
      @media all and (max-width: 1000px) {
        #prize .box:nth-of-type(2) p {
          margin: 25px 0 0;
          text-align: left; } }
      @media all and (max-width: 896px) {
        #prize .box:nth-of-type(2) p {
          font-size: 15px; } }
    #prize .box:nth-of-type(3) p {
      max-width: 800px;
      margin: 0 auto; }
      #prize .box:nth-of-type(3) p img {
        width: 100%;
        height: auto; }
    #prize .box:nth-of-type(4) dl {
      max-width: 1000px;
      display: flex;
      flex-wrap: wrap;
      justify-content: center; }
      #prize .box:nth-of-type(4) dl dd {
        margin: 50px 0 0 50px;
        color: #991D54;
        font-size: 25px;
        font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
        font-weight: bold;
        text-align: center;
        position: relative; }
        @media all and (max-width: 1000px) {
          #prize .box:nth-of-type(4) dl dd {
            margin: 25px 0 0; } }
        @media all and (max-width: 896px) {
          #prize .box:nth-of-type(4) dl dd {
            font-size: 20px;
            text-align: left;
            line-height: 1.5em; } }
        #prize .box:nth-of-type(4) dl dd span {
          font-size: 20px; }
          @media all and (max-width: 896px) {
            #prize .box:nth-of-type(4) dl dd span {
              font-size: 15px; } }
    #prize .box .bg {
      padding: 20px;
      text-align: center;
      background: #FFF; }
      @media all and (max-width: 480px) {
        #prize .box .bg {
          text-align: left; } }

#contact {
  padding: 100px 0; }
  @media all and (max-width: 480px) {
    #contact {
      padding: 50px 0; } }
  #contact h1 {
    font-size: 40px;
    text-align: center;
    line-height: 1.0em; }
    #contact h1 span {
      font-size: 20px; }
  #contact .ok {
    margin: 100px 0 0;
    padding: 20px;
    text-align: center;
    border: 1px solid #CCCCCC;
    background: #EFEFEF; }
    @media all and (max-width: 480px) {
      #contact .ok {
        margin: 50px 0 0; } }
  #contact dl dt {
    margin: 50px 0 0;
    font-size: 16px; }
    @media all and (max-width: 480px) {
      #contact dl dt {
        margin: 25px 0 0; } }
  #contact dl dd {
    margin: 10px 0 0; }
    #contact dl dd input[type="text"],
    #contact dl dd input[type="date"],
    #contact dl dd input[type="number"],
    #contact dl dd input[type="email"],
    #contact dl dd input[type="tel"],
    #contact dl dd select, #contact dl dd textarea {
      width: calc(100% - 22px);
      background-color: #FFFFFF;
      appearance: none;
      -webkit-appearance: none;
      -moz-appearance: none;
      border: 1px solid #CCCCCC;
      padding: 15px 10px;
      border-radius: 3px; }
    #contact dl dd span {
      font-size: 13px; }
  #contact .form_btn {
    margin: 50px 0 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap; }
    @media all and (max-width: 896px) {
      #contact .form_btn {
        margin: 25px 0 0; } }
    #contact .form_btn ul {
      display: flex;
      flex-wrap: wrap;
      justify-content: center; }
      #contact .form_btn ul li input {
        width: 150px;
        margin: 0 10px;
        padding: 20px 10px;
        color: #FFFFFF;
        font-size: 18px;
        border-style: none;
        border-radius: 3px;
        background: #8E2D55;
        display: block;
        cursor: pointer; }

footer {
  max-width: 478px;
  margin: 0 auto;
  padding: 20px;
  text-align: center; }
  footer .logo {
    max-width: 270px;
    margin: 0 auto;
    text-align: center; }
    @media all and (max-width: 480px) {
      footer .logo img {
        width: 200px;
        height: auto; } }
  footer img {
    width: 100%;
    height: auto; }

.gotop {
  position: fixed;
  right: 20px;
  bottom: 0;
  padding-bottom: 30px; }
  .gotop a {
    color: #fff;
    font-weight: bold;
    text-align: center;
    display: block;
    border-radius: 50%;
    margin-top: 10px;
    background-color: #aa841f;
    width: 50px;
    line-height: 50px; }
    @media all and (-ms-high-contrast: none) {
      .gotop a {
        padding-top: 15px;
        line-height: 35px; } }
    .gotop a:hover {
      transform: translate(0, -5px); }

@media print {
  .gotop {
    display: none; } }