@charset "UTF-8";
.mv {
  margin-top: 117px;
  margin-bottom: 100px; }
  .mv .catch {
    width: 100%;
    text-align: center;
    color: white;
    font-size: 6rem; }
  .mv .swiper-slide {
    text-align: center; }
  .mv .titles {
    text-align: center;
    display: inline-block;
    position: relative;
    padding-top: 25px;
    box-sizing: border-box;
    top: -15px;
    margin: 0 30px; }
    .mv .titles:before {
      content: "”";
      position: absolute;
      line-height: 1;
      top: -31px;
      left: -30px;
      font-size: 6rem;
      color: #1f777e;
      font-family: Serif;
      transform: rotate(180deg);
      transition: all 0.3s ease; }
    .mv .titles:after {
      content: "”";
      position: absolute;
      line-height: 1;
      top: 0;
      right: -30px;
      font-size: 6rem;
      color: #1f777e;
      font-family: Serif;
      transition: all 0.3s ease; }
    .mv .titles .sub {
      font-size: 1.4rem; }
    .mv .titles .ttl {
      font-size: 2rem;
      padding-bottom: 10px;
      box-sizing: border-box;
      font-weight: bold;
      color: #1f777e;
      font-family: Serif;
      border-bottom: 1px dotted #1f777e;
      box-sizing: border-box; }

.sld {
  width: 100%; }
  .sld a {
    transition: all .3s ease;
    position: relative; }
    .sld a:hover .titles .sub {
      color: #1f777e; }
    .sld a:hover .titles:before {
      top: -21px; }
    .sld a:hover .titles:after {
      top: 10px; }
  .sld .img {
    height: 650px; }

.new_bxw {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  align-items: center;
  margin-top: 30px; }
  .new_bxw a {
    display: block;
    height: 320px;
    width: 33.2%;
    position: relative; }
    .new_bxw a:after {
      content: "";
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 2;
      background: linear-gradient(to top, rgba(31, 119, 126, 0.9), rgba(31, 119, 126, 0.4) 50%, rgba(31, 119, 126, 0) 75%);
      background-size: auto 150%;
      background-repeat: no-repeat;
      background-position: top center;
      transition: all .3s ease; }
  .new_bxw a:hover:after {
    background-position: bottom center; }
  .new_bxw .n1 {
    background: url("../images/tn1.jpg") center center/cover; }
  .new_bxw .n2 {
    background: url("../images/tn2.jpg") center center/cover; }
  .new_bxw .n3 {
    background: url("../images/tn3.jpg") center center/cover; }
  .new_bxw .ymd {
    font-family: 'cassemi', serif;
    background: #d97e28;
    width: 70px;
    height: 70px;
    color: white;
    font-size: 2.4rem;
    border-radius: 100%;
    padding: 15px 0px;
    text-align: center;
    position: absolute;
    top: -10px;
    left: 0;
    z-index: 5; }
  .new_bxw .txt {
    position: absolute;
    width: 100%;
    bottom: 0;
    padding: 15px;
    color: white;
    z-index: 5;
    text-shadow: 0 0 4px #333; }

.whats_new {
  position: relative;
  top: -75px; }

.tx_center {
  text-align: center !important; }

.tx_right {
  text-align: right !important; }

.tx_left {
  text-align: left !important; }

.swiper-slide {
  width: 100%;
  height: 100%; }

/*------------------------------------------------------------
media
------------------------------------------------------------*/
@media screen and (max-width: 1200px) {
  .sld .img {
    height: 500px; } }
@media screen and (max-width: 695px) {
  .whats_new {
    top: 0;
    margin-bottom: 40px; }

  .new_bxw {
    display: block; }
    .new_bxw a {
      height: 200px;
      width: 100%;
      margin-bottom: 20px; }
    .new_bxw .ymd {
      width: 55px;
      height: 55px;
      font-size: 1.8rem; }

  .mv {
    margin-bottom: 0;
    margin-top: 59px; }
    .mv .titles .ttl {
      font-size: 1.5rem;
      margin-top: 5px; }
    .mv .titles .sub {
      font-size: 1.2rem; }

  .mv .titles:before {
    top: -14px;
    left: -20px;
    font-size: 4rem; }

  .mv .titles:after {
    top: 6px;
    right: -20px;
    font-size: 4rem; }

  .sld .img {
    height: 300px; } }
/*--media_end--*/

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