@charset "UTF-8";
/*--------------------------------------
　バナー
--------------------------------------*/
@keyframes downUp {
  50% {
    top: 0; }
  100% {
    top: 5px; } }
.bnr {
  background: url("../assets/images/bnr_pc.png") no-repeat center top;
  position: relative;
  margin: 10px auto;
  width: 840px;
  height: 515px;
  padding: 370px 30px 0;
  text-align: center;
  box-sizing: border-box; }
  @media screen and (max-width: 768px) {
    .bnr {
      background-image: none;
      width: auto;
      height: auto;
      padding: 0; } }
  .bnr .img {
    position: relative;
    z-index: 1;
    display: none; }
    @media screen and (max-width: 768px) {
      .bnr .img {
        display: block;
        padding: 0;
        margin: 0 auto; } }
  .bnr .inBox {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: baseline !important;
    width: 100%; }
    @media screen and (max-width: 768px) {
      .bnr .inBox {
        position: absolute;
        bottom: 20px;
        left: 0;
        width: 100%;
        margin: 0 auto; } }
    .bnr .inBox .in {
      position: relative;
      width: 50%;
      text-align: center; }
      @media screen and (max-width: 768px) {
        .bnr .inBox .in .pc {
          display: none; } }
      .bnr .inBox .in .sp {
        display: none; }
        @media screen and (max-width: 768px) {
          .bnr .inBox .in .sp {
            display: block; } }
      .bnr .inBox .in img {
        width: auto !important; }
      @media screen and (max-width: 768px) {
        .bnr .inBox .in {
          width: 49%; }
          .bnr .inBox .in img {
            width: 97% !important;
            padding: 0; }
          .bnr .inBox .in:last-child {
            right: -3px;
            text-align: right; }
            .bnr .inBox .in:last-child img {
              width: 100%; } }
      .bnr .inBox .in a {
        display: flex;
        justify-content: center;
        align-items: baseline;
        position: relative;
        top: 5px; }
        .bnr .inBox .in a:hover {
          animation-name: downUp;
          animation-duration: 0.5s;
          animation-iteration-count: infinite;
          animation-timing-function: ease;
          opacity: 1; }