@charset "UTF-8";
/* Scss Document */
.topContent01 {
  margin-top: 30px;
  display: flex; }
  @media screen and (max-width: 767px) {
    .topContent01 {
      display: block;
      margin-top: 10px; } }
  .topContent01 .topLeft01 {
    width: 70%; }
    @media screen and (max-width: 767px) {
      .topContent01 .topLeft01 {
        float: none;
        width: 100%;
        margin-bottom: 30px; } }
  .topContent01 .topRight01 {
    width: 27%;
    margin-left: 3%; }
    @media screen and (max-width: 767px) {
      .topContent01 .topRight01 {
        float: none;
        width: 100%;
        margin-left: 0; } }
  .topContent01 .mainVisual01 {
    margin-bottom: 10px; }
    .topContent01 .mainVisual01 .slick-next {
      width: 35px;
      height: 35px;
      background: url(../../images/common/top/ico_index02.png) no-repeat center center/contain;
      right: -10px;
      z-index: 100; }
    .topContent01 .mainVisual01 .slick-prev {
      width: 35px;
      height: 35px;
      background: url(../../images/common/top/ico_index01.png) no-repeat center center/contain;
      left: -10px;
      z-index: 100; }
    .topContent01 .mainVisual01 .slick-dots li {
      margin: 0 2px; }
      .topContent01 .mainVisual01 .slick-dots li button:before {
        content: "";
        width: 10px;
        height: 10px;
        background: #fff;
        border: 2px solid #6f574d;
        border-radius: 50%;
        opacity: 1; }
      .topContent01 .mainVisual01 .slick-dots li.slick-active button:before {
        background: #6f574d;
        border: 2px solid #fff; }
    .topContent01 .mainVisual01 .slick-dots {
      bottom: 15px; }
  .topContent01 .spMenu01 {
    display: none; }
    @media screen and (max-width: 767px) {
      .topContent01 .spMenu01 {
        display: block;
        margin-bottom: 10px; }
        .topContent01 .spMenu01 ul {
          display: flex;
          flex-wrap: wrap; } }
    .topContent01 .spMenu01 li {
      width: 25%;
      padding: 0;
      text-align: center;
      margin-bottom: 14px; }
      .topContent01 .spMenu01 li a {
        display: block;
        padding: 40px 0 0;
        font-weight: bold;
        color: #53382e; }
        @media screen and (max-width: 1000px) {
          .topContent01 .spMenu01 li a {
            font-size: 11px; } }
      .topContent01 .spMenu01 li:first-child a {
        background: url(../../images/common/ico_common01.png) no-repeat center top; }
        .topContent01 .spMenu01 li:first-child a:hover {
          background: url(../../images/common/ico_common01on.png) no-repeat center top;
          color: #f0760e; }
      .topContent01 .spMenu01 li:first-child.current a {
        background: url(../../images/common/ico_common01on.png) no-repeat center top;
        color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(2) a {
        background: url(../../images/common/ico_common02.png) no-repeat center top; }
        .topContent01 .spMenu01 li:nth-child(2) a:hover {
          background: url(../../images/common/ico_common02on.png) no-repeat center top;
          color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(2).current a {
        background: url(../../images/common/ico_common02on.png) no-repeat center top;
        color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(3) a {
        background: url(../../images/common/ico_common03.png) no-repeat center top; }
        .topContent01 .spMenu01 li:nth-child(3) a:hover {
          background: url(../../images/common/ico_common03on.png) no-repeat center top;
          color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(3).current a {
        background: url(../../images/common/ico_common03on.png) no-repeat center top;
        color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(4) a {
        background: url(../../images/common/ico_common09.png) no-repeat center top; }
        .topContent01 .spMenu01 li:nth-child(4) a:hover {
          background: url(../../images/common/ico_common09on.png) no-repeat center top;
          color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(4).current a {
        background: url(../../images/common/ico_common09on.png) no-repeat center top;
        color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(5) a {
        background: url(../../images/common/ico_common04.png) no-repeat center top; }
        .topContent01 .spMenu01 li:nth-child(5) a:hover {
          background: url(../../images/common/ico_common04on.png) no-repeat center top;
          color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(5).current a {
        background: url(../../images/common/ico_common04on.png) no-repeat center top;
        color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(6) a {
        background: url(../../images/common/ico_common05.png) no-repeat center top; }
        .topContent01 .spMenu01 li:nth-child(6) a:hover {
          background: url(../../images/common/ico_common05on.png) no-repeat center top;
          color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(6).current a {
        background: url(../../images/common/ico_common05on.png) no-repeat center top;
        color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(7) a {
        background: url(../../images/common/ico_common06.png) no-repeat center top; }
        .topContent01 .spMenu01 li:nth-child(7) a:hover {
          background: url(../../images/common/ico_common06on.png) no-repeat center top;
          color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(7).current a {
        background: url(../../images/common/ico_common06on.png) no-repeat center top;
        color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(8) a {
        background: url(../../images/common/ico_common07.png) no-repeat center top; }
        .topContent01 .spMenu01 li:nth-child(8) a:hover {
          background: url(../../images/common/ico_common07on.png) no-repeat center top;
          color: #f0760e; }
      .topContent01 .spMenu01 li:nth-child(8).current a {
        background: url(../../images/common/ico_common07on.png) no-repeat center top;
        color: #f0760e; }
  .topContent01 .yellowBtn01 {
    background: #fcee74;
    border-radius: 10px;
    margin-bottom: 10px; }
    @media screen and (max-width: 767px) {
      .topContent01 .yellowBtn01 {
        float: left;
        width: 32%;
        margin-right: 2%; }
        .topContent01 .yellowBtn01:last-child {
          margin-right: 0; } }
    @media screen and (max-width: 767px) {
      .topContent01 .yellowBtn01 {
        float: none;
        width: 100%;
        margin-bottom: 10px;
        margin-right: 0; } }
    .topContent01 .yellowBtn01 a {
      color: #53382e;
      display: block;
      font-size: 20px;
      font-weight: bold;
      padding: 40px 5px;
      text-align: center; }
      @media screen and (max-width: 1000px) {
        .topContent01 .yellowBtn01 a {
          font-size: 15px; } }
      @media screen and (max-width: 767px) {
        .topContent01 .yellowBtn01 a {
          font-size: 12px; } }
      @media screen and (max-width: 600px) {
        .topContent01 .yellowBtn01 a {
          font-size: 14px;
          padding: 20px 5px; } }
      .topContent01 .yellowBtn01 a img {
        margin-left: 10px;
        vertical-align: -5px; }
        @media screen and (max-width: 1000px) {
          .topContent01 .yellowBtn01 a img {
            width: 18px; } }
    .topContent01 .yellowBtn01.searchBtn01 p:nth-of-type(n + 2) {
      border-top: 2px dashed #dccb5f; }
    .topContent01 .yellowBtn01.searchBtn01 a {
      padding: 25px 10px; }
  .topContent01 .newsArea01 {
    margin-top: -28px; }
    @media screen and (max-width: 767px) {
      .topContent01 .newsArea01 {
        margin-top: -5px; } }
    .topContent01 .newsArea01 .tit {
      color: #53382e;
      font-size: 18px; }
      @media screen and (max-width: 767px) {
        .topContent01 .newsArea01 .tit {
          font-size: 16px; } }
      .topContent01 .newsArea01 .tit a:hover {
        text-decoration: underline; }
    .topContent01 .newsArea01 ul {
      background: #ededed;
      border-radius: 10px;
      padding: 8px 13px; }
      .topContent01 .newsArea01 ul li a {
        display: block;
        padding: 5px 5px 5px 20px;
        position: relative;
        border-bottom: 1px dashed #ddd;
        color: #696969;
	}
      .topContent01 .newsArea01 ul li a span{
        text-decoration:underline;
        color:#71932a
        }
        .topContent01 .newsArea01 ul li a:before {
          content: "■";
          position: absolute;
          left: 0;
          top: 5px;
          font-size: 13px;
          color: #cccccc; }
      .topContent01 .newsArea01 ul li:last-child a {
        border-bottom: none; }
  .topContent01 .slick-dotted.slick-slider.spOnly {
    margin-bottom: 10px; }

.animalArea01 {
  margin: 60px auto 50px; }
  @media screen and (max-width: 767px) {
    .animalArea01 {
      margin: 30px auto; } }
  .animalArea01 h2 {
    font-size: 34px;
    color: #53382e;
    text-align: center;
    margin-bottom: 30px; }
    @media screen and (max-width: 767px) {
      .animalArea01 h2 {
        font-size: 18px; } }
    .animalArea01 h2 span {
      display: inline-block;
      padding: 0 20px 5px;
      background: linear-gradient(transparent 60%, #e8f295 60%);
      line-height: 1.2; }
  .animalArea01 .animalList {
    margin: 0 auto 30px;
    max-width: 1000px; }
    @media screen and (max-width: 1000px) {
      .animalArea01 .animalList {
        max-width: 610px; } }
    @media screen and (max-width: 700px) {
      .animalArea01 .animalList {
        max-width: 400px; } }
    @media screen and (max-width: 480px) {
      .animalArea01 .animalList {
        max-width: 250px; } }
    .animalArea01 .animalList ul li {
      max-width: 190px;
      border: 2px solid #e1e1e1;
      position: relative;
      background: #fff;
      text-align: center; }
      @media screen and (max-width: 480px) {
        .animalArea01 .animalList ul li {
          max-width: 120px; } }
          
      .animalArea01 .animalList ul li .icoNew01 {
        position: absolute;
        top: -4px;
        left: -4px;
        display: inline;
        width: auto; }
      .animalArea01 .animalList ul li .ico02 {
        position: absolute;
		top: -2px;
		right: -2px;
		display: inline;
		width: auto; }
        
        @media screen and (max-width: 480px) {
          .animalArea01 .animalList ul li .icoNew01 {
            top: -2px;
            left: -2px; } }
      .animalArea01 .animalList ul li .whiteArea01 {
        padding: 10px; }
        @media screen and (max-width: 480px) {
          .animalArea01 .animalList ul li .whiteArea01 {
            padding: 5px; } }
      .animalArea01 .animalList ul li .thumb01 {
        border: 1px solid #e1e1e1;
        padding: 2px; }
        .animalArea01 .animalList ul li .thumb01 img {
          display: block; }
      .animalArea01 .animalList ul li .name01 {
        font-size: 15px;
        font-weight: bold; }
        @media screen and (max-width: 480px) {
          .animalArea01 .animalList ul li .name01 {
            font-size: 12px; } }
      .animalArea01 .animalList ul li .animalInfo01 {
        font-size: 12px; }
        @media screen and (max-width: 480px) {
          .animalArea01 .animalList ul li .animalInfo01 {
            font-size: 10px; } }
        .animalArea01 .animalList ul li .animalInfo01 img {
          margin-bottom: -4px;
          margin-left: 10px;
          display: inline;
          width: auto; }
          @media screen and (max-width: 480px) {
            .animalArea01 .animalList ul li .animalInfo01 img {
              width: 14px; } }
      .animalArea01 .animalList ul li .animalNumber01 {
        font-size: 12px;
        background: #ffff97;
        padding: 8px 10px; }
        @media screen and (max-width: 480px) {
          .animalArea01 .animalList ul li .animalNumber01 {
            font-size: 11px; } }
    .animalArea01 .animalList .slick-prev {
      left: -35px;
      background: #fff;
      width: 25px;
      height: 222px;
      border: 3px solid #dacebd;
      position: absolute; }
      @media screen and (max-width: 767px) {
        .animalArea01 .animalList .slick-prev {
          height: 180px; } }
      @media screen and (max-width: 480px) {
        .animalArea01 .animalList .slick-prev {
          width: 20px;
          top: 43%; } }
      .animalArea01 .animalList .slick-prev:after {
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 10.5px 12px 10.5px 0;
        border-color: transparent #f0780e transparent transparent;
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left: -6px;
        margin-top: -10px; }
        @media screen and (max-width: 480px) {
          .animalArea01 .animalList .slick-prev:after {
            border-width: 6px 8px 6px 0;
            margin-left: -3px;
            margin-top: -4px; } }
    .animalArea01 .animalList .slick-next {
      right: -35px;
      background: #fff;
      width: 25px;
      height: 222px;
      border: 3px solid #dacebd;
      position: absolute; }
      @media screen and (max-width: 767px) {
        .animalArea01 .animalList .slick-next {
          height: 180px; } }
      @media screen and (max-width: 480px) {
        .animalArea01 .animalList .slick-next {
          width: 20px;
          top: 43%; } }
      .animalArea01 .animalList .slick-next:after {
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 10.5px 0 10.5px 12px;
        border-color: transparent transparent transparent #f0780e;
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left: -6px;
        margin-top: -10px; }
        @media screen and (max-width: 480px) {
          .animalArea01 .animalList .slick-next:after {
            border-width: 6px 0 6px 8px;
            margin-left: -3px;
            margin-top: -4px; } }
  .animalArea01 .btnArea01 {
    text-align: center;
    margin-top: 50px;
    margin-bottom: 50px; }
    .animalArea01 .btnArea01 p {
      display: inline-block;
      width: 48%;
      margin: 0 1%;
      max-width: 340px; }
      @media screen and (max-width: 767px) {
        .animalArea01 .btnArea01 p {
          display: block;
          margin: 0 auto 20px;
          width: 100%; } }
      .animalArea01 .btnArea01 p a {
        display: block;
        padding: 11px 5px;
        background: #ffe574;
        font-size: 18px;
        font-weight: bold;
        color: #53382e;
        text-align: center;
        border-radius: 10px; }
        .animalArea01 .btnArea01 p a span {
          margin: 0 10px; }
        .animalArea01 .btnArea01 p a img {
          vertical-align: -9px; }
          .animalArea01 .btnArea01 p a img.arrow01 {
            vertical-align: -6px; }

.yellowArea01 {
  background: url("../../images/common/top/bg_stripe.png") repeat left top;
  padding: 50px 0 80px; }
  @media screen and (max-width: 767px) {
    .yellowArea01 {
      padding: 30px 0; } }
  .yellowArea01 .yellowContent01 {
    display: flex;
    justify-content: space-around; }
    @media screen and (max-width: 767px) {
      .yellowArea01 .yellowContent01 {
        display: block; } }
  .yellowArea01 .contentSide01 {
    flex-basis: 72%; }
  .yellowArea01 .contentSide01 .bigBnr02
    {
		text-align:center;
		overflow:auto;
    }
    @media screen and (max-width: 767px) {
      .yellowArea01 .contentSide01 {
        float: none;
        width: 100%;
        margin-bottom: 30px; } }
  .yellowArea01 .bnrSide01 {
    flex-basis: 23%;
    margin-left: 5%; }
  .yellowArea01 .bnrSide01 img{
		width:100%;
   }
    @media screen and (max-width: 767px) {
      .yellowArea01 .bnrSide01 {
        float: none;
        width: 100%;
        display: flex;
        margin-left: 0;
        flex-wrap: wrap; } }
    .yellowArea01 .bnrSide01 p {
      margin-bottom: 10px;
      text-align: right; }
      @media screen and (max-width: 767px) {
        .yellowArea01 .bnrSide01 p {
          text-align: center;
          width: 50%;
          padding: 0 1%; } }
      @media screen and (max-width: 400px) {
        .yellowArea01 .bnrSide01 p {
          width: 100%;
          margin-bottom: 10px; } }
      @media screen and (max-width: 767px) {
        .yellowArea01 .bnrSide01 p img {
          display: block;
          margin: 0 auto; } }
  .yellowArea01 .eventTitle01 {
    background: #fff;
    border-radius: 10px;
    padding: 15px;
    margin-top: 20px;
    display: flex;
    position: relative; }
    @media screen and (max-width: 500px) {
      .yellowArea01 .eventTitle01 {
        display: block; } }
    .yellowArea01 .eventTitle01 .icoEvent01 {
      position: absolute;
      left: 5px;
      top: 5px; }
    .yellowArea01 .eventTitle01 h2 {
      font-size: 21px;
      font-weight: bold;
      padding-left: 10px;
      width: calc(100% - 180px); }
      .yellowArea01 .eventTitle01 h2 span {
        font-size: 17px;
        color: #a8a8a8;
        margin-left: 10px; }
        @media screen and (max-width: 500px) {
          .yellowArea01 .eventTitle01 h2 span {
            font-size: 12px; } }
      @media screen and (max-width: 500px) {
        .yellowArea01 .eventTitle01 h2 {
          font-size: 16px;
          text-align: center;
          width: 100%; } }
    .yellowArea01 .eventTitle01 .toList01 {
      width: 170px; }
      @media screen and (max-width: 500px) {
        .yellowArea01 .eventTitle01 .toList01 {
          font-size: 13px;
          text-align: center;
          margin: 10px auto 0; } }
      .yellowArea01 .eventTitle01 .toList01 a {
        display: block;
        color: #757474;
        border: 2px solid #bdcf26;
        border-radius: 6px;
        padding: 5px;
        text-align: center;
        font-weight: bold; }
        .yellowArea01 .eventTitle01 .toList01 a img {
          margin-left: 8px;
          vertical-align: -3px; }
  @media screen and (max-width: 767px) {
    .yellowArea01 .toList01 {
      color: #757474;
      border: 2px solid #bdcf26;
      border-radius: 6px;
      padding: 5px;
      text-align: center;
      font-weight: bold;
      width: 80%;
      max-width: 170px;
      margin: -10px auto 20px;
      background: #fff; }
      .yellowArea01 .toList01 a img {
        margin-left: 8px;
        vertical-align: -3px; } }
  .yellowArea01 ul {
    margin-bottom: 30px; }
  .yellowArea01 ul li {
    border-bottom: 1px dashed #53382e;
    }
    .yellowArea01 ul li a {
      display: block;
      padding: 20px 0;
      font-size: 15px;
      border-bottom: 1px dashed #fdf384;
      }
    .yellowArea01 ul li a span.title {
		text-decoration:underline;
		font-size:1.1em;
		color:#71932a
      }
    .yellowArea01 ul li a:hover span.title {
		text-decoration:none;
      }
      @media screen and (max-width: 767px) {
        .yellowArea01 ul li a {
          font-size: 13px; } }
/*
    .yellowArea01 ul li .area01 {
      display: inline-block;
      background: #f0760e;
      color: #fff;
      text-align: center;
      width: 90px;
      padding: 3px;
      font-weight: bold;
      border-radius: 4px;
      margin: 0 10px; }
*/
    .yellowArea01 ul li .area01 {
      display: inline-block;
      background: #fff;
      color: #53382e;
      text-align: center;
      width: 90px;
      padding: 3px;
      font-weight: bold;
      border-radius: 4px;
      margin: 0 10px;
      border: 1px solid #bdcf26;
      }
      @media screen and (max-width: 767px) {
        .yellowArea01 ul li .area01 {
          font-size: 13px;
          width: 70px; } }