@charset "UTF-8";
/* keyvisual
--------------------------------------------------*/
.keyvisual {
  position: relative; }
  .keyvisual .mv_bg {
    position: absolute;
    z-index: -2;
    bottom: -18%;
    width: 100%;
    height: 0;
    padding-bottom: 42.75%;
    background: #eeeeee; }
    @media screen and (max-width: 768px) {
      .keyvisual .mv_bg {
        background: none; } }
  .keyvisual .bg_line_02 {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 9;
    box-sizing: border-box; }
    .keyvisual .bg_line_02 ul {
      width: 100%;
      position: relative;
      height: 100%;
      overflow: hidden; }
    .keyvisual .bg_line_02 li {
      position: relative;
      box-sizing: border-box;
      width: 100%;
      border-bottom: 1px solid rgba(229, 229, 229, 0.4); }
      .keyvisual .bg_line_02 li:first-of-type {
        height: 18%; }
      .keyvisual .bg_line_02 li:nth-of-type(2) {
        height: 60%; }
  .keyvisual .search {
    position: absolute;
    display: flex;
    align-items: center;
    bottom: -7%;
    right: 0;
    z-index: 100;
    width: 75%;
    height: 116px; }
    @media screen and (max-width: 768px) {
      .keyvisual .search {
        flex-wrap: wrap;
        align-items: flex-start;
        align-content: flex-start;
        width: 80%;
        height: 163px; } }
    .keyvisual .search .ttl_search {
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 20px 0 32px;
      max-width: 216px;
      width: 100%;
      height: 56px;
      border: 1px solid #fff; }
      @media screen and (max-width: 768px) {
        .keyvisual .search .ttl_search {
          justify-content: flex-start;
          margin: 15px 5% 5px;
          padding: 0 0 0 3%;
          height: 40px;
          max-width: none; } }
      .keyvisual .search .ttl_search .ttl_search_img {
        max-width: 175px;
        max-height: 13px; }
        @media screen and (max-width: 768px) {
          .keyvisual .search .ttl_search .ttl_search_img {
            max-width: 135px;
            max-height: 10px; } }
    .keyvisual .search .keyword_wrap {
      display: flex;
      margin: 0 20px 0 0;
      padding: 0;
      max-width: 730px;
      width: 100%; }
      @media screen and (max-width: 768px) {
        .keyvisual .search .keyword_wrap {
          flex-direction: column;
          max-width: none;
          margin: 0 3% 1% 5%;
          width: 62%; } }
    .keyvisual .search .keyword {
      box-sizing: border-box;
      outline: none;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      padding: 0 0 0 2%;
      margin: 0 20px 0 0;
      width: 45%;
      height: 56px;
      border: 0;
      border-radius: 0;
      color: #000; }
      @media screen and (max-width: 768px) {
        .keyvisual .search .keyword {
          padding: 0 0 0 3%;
          margin: 0 0 5px;
          max-width: none;
          width: 100%;
          height: 40px;
          font-size: 11px; } }
    .keyvisual .search .category {
      box-sizing: border-box;
      margin: 0;
      border: none;
      border-radius: 0;
      outline: none;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      cursor: pointer;
      display: flex;
      align-items: center;
      padding: 0 0 0 2%;
      width: 55%;
      height: 56px;
      background: #fff;
      font-size: 13.333px;
      color: #000; }
      @media screen and (max-width: 768px) {
        .keyvisual .search .category {
          padding: 0 0 0 3%;
          margin: 0;
          max-width: none;
          width: 100%;
          height: 40px;
          font-size: 11px; } }
    .keyvisual .search .btn_search {
      box-sizing: border-box;
      border: none;
      border-radius: 0;
      outline: none;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      margin: 0 20px 0 0;
      max-width: 95px;
      width: 100%;
      height: 56px;
      background: #cdb77d;
      text-align: center;
      color: #000;
      cursor: pointer; }
      @media screen and (max-width: 768px) {
        .keyvisual .search .btn_search {
          margin: 0 0 1% 0;
          max-width: none;
          width: 24.5%;
          height: 85px; } }
  .keyvisual .bg_search {
    position: absolute;
    bottom: -7%;
    right: 0;
    z-index: 99;
    width: 75%;
    height: 116px;
    background: #313131;
    mix-blend-mode: multiply;
    /* 乗算 */ }
    @media screen and (max-width: 768px) {
      .keyvisual .bg_search {
        width: 80%;
        height: 163px; } }
  .keyvisual div.bg_line {
    z-index: 9; }
  .keyvisual .keyvisual_inner {
    width: 80.1667%;
    height: auto;
    max-height: 1000px;
    padding: 0 8.75% 0 11.0833%;
    position: relative;
    overflow: hidden; }
    @media screen and (max-width: 768px) {
      .keyvisual .keyvisual_inner {
        width: 83.3334%;
        height: 75vh;
        padding: 0 0 0 16.6666%; } }
  .keyvisual .keyvisual_text {
    position: absolute;
    top: calc(50% - 19%);
    left: 7.25%;
    width: 40%;
    z-index: 99;
    opacity: 0.8; }
    @media screen and (max-width: 768px) {
      .keyvisual .keyvisual_text {
        width: 85%; } }
    .keyvisual .keyvisual_text.sp_only {
      left: 6%; }
    .keyvisual .keyvisual_text img {
      width: 100%; }
  .keyvisual video {
    width: 100%;
    height: 100%;
    object-fit: cover; }

/* about_area
--------------------------------------------------*/
.about_area {
  padding-top: 230px; }
  @media screen and (max-width: 768px) {
    .about_area {
      padding-top: 35%; } }
  .about_area .layout_box_01 {
    max-width: 1600px;
    margin: 0 auto; }

/* info_area
--------------------------------------------------*/
.info_area {
  position: relative;
  padding-top: 6.5%; }
  @media screen and (max-width: 1024px) {
    .info_area {
      padding-top: 0; }
      .info_area div.bg_line li:nth-of-type(2) {
        border: none; }
      .info_area div.bg_line li:nth-of-type(3) {
        width: 59%; } }
  .info_area div.bg_line {
    z-index: -1; }
  .info_area .info_inner {
    margin-left: 13.7500%; }
    @media screen and (max-width: 1024px) {
      .info_area .info_inner {
        margin-left: 0;
        margin-bottom: 40px; } }
  .info_area .ttl_area_01 {
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-end;
    justify-content: space-between;
    border-bottom: 1px solid #d8caa4;
    padding: 0 10.2% 20px 12%; }
    @media screen and (max-width: 768px) {
      .info_area .ttl_area_01 {
        padding: 10% 5% 3%; } }
    .info_area .ttl_area_01 .round_01 {
      float: right;
      font-size: 16px; }
      @media screen and (max-width: 768px) {
        .info_area .ttl_area_01 .round_01 {
          width: 33%;
          max-width: none;
          font-size: 2.5vw; } }
    @media screen and (max-width: 768px) {
      .info_area .ttl_area_01 h2 {
        width: 60%; } }
    @media screen and (max-width: 768px) {
      .info_area .ttl_area_01 h2 img {
        display: block;
        width: 100%; } }
  .info_area .info_box {
    display: flex;
    flex-direction: column;
    width: 100%; }
    .info_area .info_box .info_box_innr {
      box-sizing: border-box;
      display: flex;
      width: 100%;
      padding: 0 10.2% 0 0;
      border-bottom: 1px solid #f2f2f2; }
      @media screen and (max-width: 1024px) {
        .info_area .info_box .info_box_innr {
          flex-direction: column;
          padding: 0;
          margin: 0 auto;
          width: 92%; } }
    .info_area .info_box .sub_ttl {
      box-sizing: border-box;
      width: 29.5%;
      min-height: 77px;
      padding: 25px 0 25px 13%; }
      @media screen and (max-width: 1024px) {
        .info_area .info_box .sub_ttl {
          width: 100%;
          min-height: 0;
          padding: 15px 5%;
          border-bottom: 1px solid #f2f2f2; }
          .info_area .info_box .sub_ttl.tab_only {
            display: none; } }
      .info_area .info_box .sub_ttl h4 {
        font-size: 17px;
        font-weight: bold; }
        @media screen and (max-width: 1024px) {
          .info_area .info_box .sub_ttl h4 {
            font-size: 12px; } }
    .info_area .info_box .info_list {
      display: flex;
      align-items: center;
      width: 70.75%;
      padding: 15px 0; }
      @media screen and (max-width: 1024px) {
        .info_area .info_box .info_list {
          box-sizing: border-box;
          width: 100%;
          padding: 15px 5%; } }
      .info_area .info_box .info_list a {
        display: block;
        width: 100%;
        box-sizing: border-box;
        color: #080404;
        text-decoration: none; }
      .info_area .info_box .info_list dl {
        display: flex;
        align-items: center; }
        @media screen and (max-width: 1024px) {
          .info_area .info_box .info_list dl {
            flex-direction: column; } }
      .info_area .info_box .info_list dt {
        width: 260px;
        margin: 0 50px 0 70px;
        font-size: 14px;
        font-weight: bold; }
        @media screen and (max-width: 1024px) {
          .info_area .info_box .info_list dt {
            margin: 0 0 10px 0;
            width: 100%;
            font-size: 11px; } }
        .info_area .info_box .info_list dt span {
          display: inline-block; }
        .info_area .info_box .info_list dt .date {
          margin-right: 20px; }
        .info_area .info_box .info_list dt .category {
          display: inline-block;
          color: #ffffff;
          font-size: 13px;
          width: 130px;
          background: #080404;
          text-align: center; }
          @media screen and (max-width: 1024px) {
            .info_area .info_box .info_list dt .category {
              font-size: 11px; } }
      .info_area .info_box .info_list dd {
        width: calc(100% - 245px);
        font-size: 14px;
        font-weight: bold; }
        @media screen and (max-width: 1024px) {
          .info_area .info_box .info_list dd {
            width: 100%;
            font-size: 11px; } }
  @media screen and (max-width: 1024px) {
    .info_area .shape.b {
      display: none; } }

/* live_camera_area
--------------------------------------------------*/
.live_camera_area {
  padding-bottom: 8%; }
  .live_camera_area .shape.extend.delighter.started {
    height: 70%; }

/* travel_feature_area
--------------------------------------------------*/
.travel_feature_area {
  padding-top: 5%;
  padding-bottom: 2%; }
  @media screen and (max-width: 768px) {
    .travel_feature_area .shape.r {
      width: 40%; } }
  .travel_feature_area .travel_feature {
    position: absolute;
    z-index: -1;
    bottom: 0;
    width: 100%;
    height: 0;
    padding-bottom: 28%;
    background: #000000; }
    @media screen and (max-width: 768px) {
      .travel_feature_area .travel_feature {
        padding-bottom: 60%; } }
  .travel_feature_area div.bg_line {
    z-index: -1; }
  .travel_feature_area .ttl_area_01 {
    position: relative;
    border-bottom: 1px solid #d8caa4;
    padding: 0 8.8% 10px;
    text-align: center; }
    @media screen and (max-width: 768px) {
      .travel_feature_area .ttl_area_01 {
        padding: 0 5% 5%; } }
    .travel_feature_area .ttl_area_01 h2 {
      margin: 0	auto;
      width: 45%;
      max-width: 500px; }
      @media screen and (max-width: 768px) {
        .travel_feature_area .ttl_area_01 h2 {
          margin: 0; } }
      .travel_feature_area .ttl_area_01 h2 img {
        display: block;
        width: 100%; }
  .travel_feature_area .round_01 {
    position: absolute;
    top: 5%;
    right: 9%;
    font-size: 16px; }
    @media screen and (max-width: 768px) {
      .travel_feature_area .round_01 {
        top: auto;
        bottom: 25%;
        font-size: 2.5vw;
        max-width: none;
        width: 23%; } }
  .travel_feature_area .sub_ttl {
    padding: 1% 0;
    text-align: center;
    font-weight: bold; }
    @media screen and (max-width: 768px) {
      .travel_feature_area .sub_ttl {
        padding: 12px 5%;
        text-align: left;
        font-size: 12px; } }
    .travel_feature_area .sub_ttl img {
      vertical-align: bottom; }
  .travel_feature_area .travel_feature_inner {
    width: 94.75%;
    margin: 0 auto 8%; }
  .travel_feature_area .travel_feature_slid {
    display: none; }
    .travel_feature_area .travel_feature_slid.slick-initialized {
      display: block; }
    .travel_feature_area .travel_feature_slid .item_box {
      width: 30.7827%; }
      .travel_feature_area .travel_feature_slid .item_box a {
        display: block;
        color: #080404;
        text-decoration: none; }
      .travel_feature_area .travel_feature_slid .item_box .img_area {
        overflow: hidden;
        position: relative;
        margin: 0 6%;
        padding-bottom: 66.6667%;
        z-index: 1; }
        @media screen and (max-width: 768px) {
          .travel_feature_area .travel_feature_slid .item_box .img_area {
            margin: 0 2%; } }
        .travel_feature_area .travel_feature_slid .item_box .img_area img {
          position: absolute;
          top: 50%;
          left: 50%;
          width: 120%;
          max-width: none;
          transform: translate(-50%, -50%); }
      .travel_feature_area .travel_feature_slid .item_box .text_box {
        position: relative;
        background: rgba(255, 255, 255, 0.9);
        transform: rotate(360deg);
        width: 78.5714%;
        box-sizing: border-box;
        padding: 4.2857% 5.7142%;
        margin: -40px auto 0;
        z-index: 3; }
        .travel_feature_area .travel_feature_slid .item_box .text_box > div:first-of-type {
          padding-bottom: 5px;
          margin-bottom: 10px;
          position: relative; }
          .travel_feature_area .travel_feature_slid .item_box .text_box > div:first-of-type:after {
            content: "";
            display: block;
            position: absolute;
            left: 0;
            bottom: -5px;
            width: 30px;
            height: 1px;
            border-bottom: 1px solid #000000; }
        .travel_feature_area .travel_feature_slid .item_box .text_box img {
          width: auto;
          height: 10px; }
          @media screen and (max-width: 768px) {
            .travel_feature_area .travel_feature_slid .item_box .text_box img {
              height: 2vw; } }
        .travel_feature_area .travel_feature_slid .item_box .text_box .ttl {
          padding-right: 25px;
          font-size: 16px;
          font-weight: bold;
          display: block;
          margin-bottom: 10px;
          text-decoration: none;
          color: #080404;
          background: url(../../images/common/icon_arrow.svg) no-repeat right center;
          background-size: 15px;
          line-height: 1.5; }
        .travel_feature_area .travel_feature_slid .item_box .text_box .en {
          display: flex;
          flex-wrap: wrap;
          justify-content: space-between;
          align-items: center;
          font-family: 'Montserrat', sans-serif; }
          .travel_feature_area .travel_feature_slid .item_box .text_box .en .cat {
            color: #dbcda7;
            font-size: 15px;
            line-height: 1.2; }
            @media screen and (max-width: 768px) {
              .travel_feature_area .travel_feature_slid .item_box .text_box .en .cat {
                font-size: 10px; } }
          .travel_feature_area .travel_feature_slid .item_box .text_box .en .date span {
            display: block;
            padding: 2px 10px;
            color: #fff;
            font-size: 11px;
            background-color: #000;
            border-radius: 20px; }
            @media screen and (max-width: 768px) {
              .travel_feature_area .travel_feature_slid .item_box .text_box .en .date span {
                padding: 1px 5px;
                font-size: 8px; } }
        .travel_feature_area .travel_feature_slid .item_box .text_box p {
          font-size: 14px; }
          @media screen and (max-width: 768px) {
            .travel_feature_area .travel_feature_slid .item_box .text_box p {
              font-size: 11px; } }
    .travel_feature_area .travel_feature_slid .list-prev,
    .travel_feature_area .travel_feature_slid .list-next {
      position: absolute;
      bottom: -18%;
      z-index: 999; }
      @media screen and (max-width: 768px) {
        .travel_feature_area .travel_feature_slid .list-prev,
        .travel_feature_area .travel_feature_slid .list-next {
          bottom: -6%; } }
    .travel_feature_area .travel_feature_slid .list-prev {
      left: 30%; }
      @media screen and (max-width: 768px) {
        .travel_feature_area .travel_feature_slid .list-prev {
          left: 20%; } }
    .travel_feature_area .travel_feature_slid .list-next {
      right: 30%; }
      @media screen and (max-width: 768px) {
        .travel_feature_area .travel_feature_slid .list-next {
          right: 20%; } }
    .travel_feature_area .travel_feature_slid .slick-dots {
      bottom: -20%; }
      @media screen and (max-width: 768px) {
        .travel_feature_area .travel_feature_slid .slick-dots {
          bottom: -8%; }
          .travel_feature_area .travel_feature_slid .slick-dots li {
            margin: 0; } }
    .travel_feature_area .travel_feature_slid .slick-dots li button:before {
      color: #888888;
      font-size: 1px; }
      @media screen and (max-width: 768px) {
        .travel_feature_area .travel_feature_slid .slick-dots li button:before {
          font-family: inherit;
          font-size: 20px;
          margin: 0; } }
    .travel_feature_area .travel_feature_slid .slick-dots li.slick-active button:before {
      color: #ffffff; }

/* event_area
--------------------------------------------------*/
.event_area {
  padding-top: 10%;
  padding-bottom: 3.3333%;
  border-right: 1px solid rgba(229, 229, 229, 0.4); }
  @media screen and (max-width: 768px) {
    .event_area {
      border-bottom: 1px solid rgba(229, 229, 229, 0.4);
      margin-bottom: 0; }
      .event_area div.bg_line li:nth-of-type(2) {
        border: none; }
      .event_area div.bg_line li:nth-of-type(3) {
        width: 59%; } }
  @media screen and (max-width: 768px) {
    .event_area .shape.g {
      background-color: #fff; } }
  .event_area .ttl_area_01 {
    position: relative;
    border-bottom: 1px solid #d8caa4;
    padding: 0 8.8% 18px;
    text-align: center; }
    @media screen and (max-width: 768px) {
      .event_area .ttl_area_01 {
        padding: 0 5% 5%; } }
    @media screen and (max-width: 768px) {
      .event_area .ttl_area_01 h2 {
        width: 30%; } }
    @media screen and (max-width: 768px) {
      .event_area .ttl_area_01 h2 img {
        display: block;
        width: 100%; } }
  .event_area .round_01 {
    position: absolute;
    top: 5%;
    right: 9%;
    font-size: 16px; }
    @media screen and (max-width: 768px) {
      .event_area .round_01 {
        top: auto;
        bottom: 50%;
        font-size: 2.5vw;
        max-width: none;
        width: 35%; } }
  .event_area .sub_ttl {
    text-align: center;
    font-weight: bold;
    padding: 1% 0; }
    @media screen and (max-width: 768px) {
      .event_area .sub_ttl {
        padding: 12px 5%;
        text-align: left;
        font-size: 12px; } }
    .event_area .sub_ttl img {
      vertical-align: bottom; }
  .event_area .event_inner {
    width: 92%;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      .event_area .event_inner {
        width: 92%; } }
  .event_area .event_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; }
    @media screen and (max-width: 768px) {
      .event_area .event_list {
        flex-direction: column; } }
    .event_area .event_list li {
      position: relative;
      width: 30.2%;
      margin: 0 1.566% 70px;
      box-shadow: 0 2.3px 40px #eaeaea; }
      @media screen and (max-width: 768px) {
        .event_area .event_list li {
          width: 100%;
          margin: 0 2.3% 5% 0; } }
      .event_area .event_list li a {
        position: relative;
        height: 100%;
        display: block;
        color: #080404;
        text-decoration: none;
        background-color: #fff; }
      .event_area .event_list li img {
        width: 100%; }
      .event_area .event_list li .img_area {
        overflow: hidden;
        position: relative;
        padding-bottom: 51.8605%; }
        .event_area .event_list li .img_area img {
          position: absolute;
          top: 50%;
          left: 50%;
          display: block;
          width: auto;
          height: auto;
          min-width: 103%;
          min-height: 103%;
          transform: translate(-50%, -50%); }
      .event_area .event_list li .text_box {
        background: #ffffff; }
        .event_area .event_list li .text_box > p {
          position: relative;
          display: block;
          width: 75%;
          font-size: 12px;
          margin-bottom: 10px;
          padding: 0 4%; }
          @media screen and (max-width: 768px) {
            .event_area .event_list li .text_box > p {
              padding: 0 6%; } }
          .event_area .event_list li .text_box > p:after {
            content: '';
            position: absolute;
            top: 0;
            right: -15%;
            display: block;
            width: 14px;
            height: 14px;
            background: url(../../images/common/icon_arrow.svg) no-repeat center center/cover; }
            @media screen and (max-width: 768px) {
              .event_area .event_list li .text_box > p:after {
                right: -9%; } }
      .event_area .event_list li .event_details {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 10px;
        padding: 3.3003% 4% 0; }
        @media screen and (max-width: 768px) {
          .event_area .event_list li .event_details {
            padding: 3.3003% 6% 0; } }
        .event_area .event_list li .event_details p {
          width: calc(100% - 90px);
          color: #cdb77d;
          font-size: 16px;
          font-weight: bold; }
        .event_area .event_list li .event_details div {
          float: right;
          width: 60px;
          background: #e5e5e5;
          font-size: 11px;
          font-weight: bold;
          width: 80px;
          text-align: center;
          border-radius: 15px; }
      .event_area .event_list li .event_tag {
        display: flex;
        align-items: center;
        border-top: 1px solid #e8e8e8;
        padding: 2% 4%;
        font-size: 11px; }
        @media screen and (max-width: 768px) {
          .event_area .event_list li .event_tag {
            padding: 2% 6%; } }
        .event_area .event_list li .event_tag:before {
          content: '';
          display: block;
          margin-right: 5px;
          width: 10px;
          height: 10px;
          background: url(../../images/common/icon_tag.svg) no-repeat center center/cover; }

/* sns_area
--------------------------------------------------*/
.sns_area {
  padding-top: 5%;
  padding-bottom: 100px;
  border-right: 1px solid rgba(229, 229, 229, 0.4); }
  @media screen and (max-width: 768px) {
    .sns_area div.bg_line li:nth-of-type(2) {
      border: none; }
    .sns_area div.bg_line li:nth-of-type(3) {
      width: 59%; } }
  @media screen and (max-width: 768px) {
    .sns_area .shape.g {
      background-color: #fff; } }
  .sns_area .ttl_area_01 {
    margin-bottom: 60px;
    border-bottom: 1px solid #d8caa4;
    padding: 0 8.8% 15px;
    text-align: center; }
    @media screen and (max-width: 768px) {
      .sns_area .ttl_area_01 {
        margin-bottom: 0; }
        .sns_area .ttl_area_01 h2 {
          margin: 0 auto;
          width: 20%; }
          .sns_area .ttl_area_01 h2 img {
            width: 100%; } }
  .sns_area .inner {
    position: relative;
    max-width: 1170px;
    width: 90%;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      .sns_area .inner {
        width: 100%; } }
    .sns_area .inner .facebook .ttl.pc_only {
      position: absolute;
      left: -4%;
      top: 40%; }
    .sns_area .inner .facebook .ttl.sp_only {
      margin: 8px auto;
      width: 25%;
      height: auto; }
    .sns_area .inner .instagram .ttl.pc_only {
      position: absolute;
      right: -4%;
      top: 40%;
      width: 32px;
      height: auto; }
    .sns_area .inner .instagram .ttl.sp_only {
      margin: 8px auto;
      width: 25%;
      height: auto; }
  .sns_area .btn {
    padding: 15px 0;
    width: 60%; }

/* banner_area
--------------------------------------------------*/
.banner_area {
  padding-bottom: 80px; }
  @media screen and (max-width: 768px) {
    .banner_area div.bg_line li:nth-of-type(2) {
      border: none; }
    .banner_area div.bg_line li:nth-of-type(3) {
      width: 59%; } }
  .banner_area .banner_inner + .banner_inner {
    margin-top: 100px; }
  @media screen and (max-width: 768px) {
    .banner_area .shape.g {
      background-color: #fff; } }
  .banner_area .ttl_area_01 {
    margin-bottom: 40px;
    border-bottom: 1px solid #e2e2e2;
    padding: 0 8.8% 10px;
    text-align: center; }
    .banner_area .ttl_area_01 img {
      width: 15%;
      height: auto; }
      @media screen and (max-width: 768px) {
        .banner_area .ttl_area_01 img {
          width: 30%; } }
  .banner_area .slick-slide {
    margin: 0  auto; }
    .banner_area .slick-slide div {
      margin: 0; }
    .banner_area .slick-slide img {
      margin: 0 auto;
      width: 90%; }
  .banner_area .slick-dots {
    bottom: -50px; }
    .banner_area .slick-dots li button {
      margin: 0 3px; }
      .banner_area .slick-dots li button:before {
        font-family: inherit;
        font-size: 20px;
        margin: 0; }
    @media screen and (max-width: 768px) {
      .banner_area .slick-dots li {
        margin: 0; }
        .banner_area .slick-dots li button:before {
          font-family: inherit;
          font-size: 20px;
          margin: 0; } }
  .banner_area .list-prev {
    left: 20%;
    position: absolute;
    bottom: -38px;
    z-index: 9999; }
    @media screen and (max-width: 768px) {
      .banner_area .list-prev {
        left: 5%;
        width: 7%; } }
  .banner_area .list-next {
    right: 20%;
    position: absolute;
    bottom: -38px;
    z-index: 10000; }
    @media screen and (max-width: 768px) {
      .banner_area .list-next {
        right: 5%;
        width: 7%; } }

/* layout_box
--------------------------------------------------*/
.layout_box_01 {
  position: relative; }
  .layout_box_01 .text_wrap {
    width: 65.4166%;
    background: #eeeeee; }
    @media screen and (max-width: 768px) {
      .layout_box_01 .text_wrap {
        width: 100%; } }
    .layout_box_01 .text_wrap h2 {
      border-bottom: 1px solid #d8caa4;
      padding: 60px 31.2101% 0 16.5605%; }
      @media screen and (max-width: 768px) {
        .layout_box_01 .text_wrap h2 {
          padding: 60% 5% 0; } }
      .layout_box_01 .text_wrap h2 span {
        vertical-align: bottom;
        font-size: 17px;
        line-height: 17px;
        margin-left: 30px;
        display: inline-block;
        font-weight: bold; }
        @media screen and (max-width: 768px) {
          .layout_box_01 .text_wrap h2 span {
            font-size: 12px;
            line-height: 12px; } }
      .layout_box_01 .text_wrap h2 img {
        display: inline-block; }
        @media screen and (max-width: 768px) {
          .layout_box_01 .text_wrap h2 img {
            vertical-align: bottom;
            width: 30%; } }
    .layout_box_01 .text_wrap .text_item {
      padding: 3.8216% 31.2101% 21% 16.5605%; }
      @media screen and (max-width: 768px) {
        .layout_box_01 .text_wrap .text_item {
          padding: 5% 5% 10%; } }
      .layout_box_01 .text_wrap .text_item .item_copy {
        font-size: 24px;
        margin-bottom: 20px;
        font-weight: bold;
        line-height: 1.4; }
        @media screen and (max-width: 768px) {
          .layout_box_01 .text_wrap .text_item .item_copy {
            margin-bottom: 5%;
            font-size: 18px; } }
      .layout_box_01 .text_wrap .text_item p {
        font-size: 13px;
        line-height: 2;
        margin-bottom: 25px; }
        @media screen and (max-width: 768px) {
          .layout_box_01 .text_wrap .text_item p {
            font-size: 12px;
            margin-bottom: 5%; } }
    .layout_box_01 .text_wrap .btn {
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 25px 0;
      max-width: 240px; }
      @media screen and (max-width: 768px) {
        .layout_box_01 .text_wrap .btn {
          padding: 5% 0;
          max-width: 150px; } }
      .layout_box_01 .text_wrap .btn img {
        width: 45%; }
        @media screen and (max-width: 768px) {
          .layout_box_01 .text_wrap .btn img {
            width: 55%; } }
  .layout_box_01 .img_wrap {
    position: absolute;
    top: -70px;
    right: 0;
    width: 53%;
    height: 34vw;
    min-height: 600px;
    background: url(../../images/top/img_about.jpg) no-repeat center center/cover; }
    @media screen and (max-width: 768px) {
      .layout_box_01 .img_wrap {
        margin: 30px 0 0 0;
        left: 4%;
        width: 96%;
        height: 62vw;
        min-height: inherit; }
        .layout_box_01 .img_wrap img {
          width: 100%;
          height: auto;
          object-fit: contain; } }

.layout_box_02 {
  padding-top: 10%;
  position: relative; }
  @media screen and (max-width: 768px) {
    .layout_box_02 {
      padding: 0 0 23%;
      background: #dbcda7 url(../../images/top/bg_live_camera.png) no-repeat left bottom/115%; } }
  .layout_box_02 .ttl_area_01 {
    border-bottom: 1px solid #d8caa4;
    padding: 0 8.8% 10px 60%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end; }
    @media screen and (max-width: 768px) {
      .layout_box_02 .ttl_area_01 {
        display: none; } }
  .layout_box_02 .ttl_area_02 {
    display: none;
    border-bottom: 1px solid #e0d9bd;
    background: #dbcda7;
    padding: 5%; }
    @media screen and (max-width: 768px) {
      .layout_box_02 .ttl_area_02 {
        display: flex;
        justify-content: space-between;
        align-items: flex-end; } }
    .layout_box_02 .ttl_area_02 h2 {
      width: 60%; }
      .layout_box_02 .ttl_area_02 h2 img {
        display: block;
        width: 100%;
        height: auto; }
    .layout_box_02 .ttl_area_02 .btn {
      max-width: none;
      font-size: 2.5vw; }
  .layout_box_02 .sub_ttl {
    padding: 22px 8.9420% 0 60%;
    margin-bottom: 22px;
    font-size: 18px;
    font-weight: bold; }
    .layout_box_02 .sub_ttl.sp_only {
      padding: 12px 5%;
      margin: 0;
      background: #dbcda7;
      font-size: 12px; }
  .layout_box_02 .img_wrap {
    position: absolute;
    width: 42.3333%;
    height: 566px;
    left: 13.75%;
    top: 12%;
    overflow: hidden;
    background: url(../../images/top/img_live_camera.jpg) no-repeat center center/cover; }
    @media screen and (max-width: 768px) {
      .layout_box_02 .img_wrap {
        position: static;
        width: 100%;
        height: 75vw; } }
    .layout_box_02 .img_wrap img {
      margin: 0 auto;
      width: 100%;
      height: auto;
      object-fit: cover; }
  .layout_box_02 .text_wrap {
    margin-left: 7%;
    padding: 30px 10% 220px 53%;
    background: #dbcda7;
    background-image: url(../../images/top/bg_live_camera.png);
    background-size: 60%;
    background-repeat: no-repeat;
    background-position: bottom 50px right; }
    @media screen and (max-width: 768px) {
      .layout_box_02 .text_wrap {
        padding: 0 5%;
        margin: 0;
        border-bottom: 1px solid #e0d9bd;
        background-image: none; } }
    .layout_box_02 .text_wrap p {
      font-size: 14px;
      line-height: 2.0; }
      @media screen and (max-width: 768px) {
        .layout_box_02 .text_wrap p {
          font-size: 11px;
          font-weight: normal; } }
    .layout_box_02 .text_wrap .place {
      margin-top: 25px;
      box-sizing: border-box;
      font-size: 17px;
      font-weight: bold; }
      @media screen and (max-width: 768px) {
        .layout_box_02 .text_wrap .place {
          margin-top: 20px;
          font-size: 11px; } }
      .layout_box_02 .text_wrap .place span {
        display: inline-block;
        padding: 8px 30px;
        background: #ffffff; }
        @media screen and (max-width: 768px) {
          .layout_box_02 .text_wrap .place span {
            padding: 5px 20px; } }

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