#meraviglia {
  font-family: "Microsoft JhengHei","jaf-bernino-sans","Lucida Grande","Lucida Sans Unicode","Lucida Sans",Geneva,Verdana,Arial, Helvetica,sans-serif;
  background-color: #ffffff; }
  #meraviglia .container {
    max-width: 1920px;
    margin: 0 auto;
    padding: 0 80px; }
    @media screen and (max-width: 1440px) {
      #meraviglia .container {
        padding: 0 60px; } }
    @media screen and (max-width: 992px) {
      #meraviglia .container {
        padding: 0 50px; } }
    @media screen and (max-width: 768px) {
      #meraviglia .container {
        padding: 0 20px;
        max-width: 600px; } }
  #meraviglia .nav {
    width: 100%;
    height: 80px;
    background-color: rgba(255, 255, 255, 0.95);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: fixed;
    top: 50px;
    left: 0;
    z-index: 11;
    -webkit-transition: 200ms ease all;
    -o-transition: 200ms ease all;
    transition: 200ms ease all; }
    @media screen and (max-width: 1199px) {
      #meraviglia .nav {
        height: 50px; } }
    @media screen and (max-width: 768px) {
      #meraviglia .nav {
        top: auto;
        bottom: 0;
        font-size: 12px;
        line-height: 1.5;
        letter-spacing: 2px;
        background-color: #002C57; } }
    #meraviglia .nav > div {
      width: 100%;
      height: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      #meraviglia .nav > div > div, #meraviglia .nav > div > a {
        position: relative;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        list-style: none;
        padding: 0 50px;
        color: #002C57;
        font-weight: 350;
        font-size: 18px;
        text-align: center;
        -webkit-transition: 500ms ease all;
        -o-transition: 500ms ease all;
        transition: 500ms ease all;
        cursor: pointer; }
        @media screen and (max-width: 992px) {
          #meraviglia .nav > div > div, #meraviglia .nav > div > a {
            padding: 0 24px; } }
        @media screen and (max-width: 768px) {
          #meraviglia .nav > div > div, #meraviglia .nav > div > a {
            height: 100%;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            padding: 0 10px;
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            font-size: 12px;
            color: #ffffff;
            border-right: 1px solid #707070; } }
        @media screen and (min-width: 769px) {
          #meraviglia .nav > div > div:hover, #meraviglia .nav > div > a:hover {
            color: #ffffff;
            background-color: #002C57; } }
        #meraviglia .nav > div > div:not(:first-child), #meraviglia .nav > div > a:not(:first-child) {
          border-left: 1px solid #002C57; }
          @media screen and (max-width: 768px) {
            #meraviglia .nav > div > div:not(:first-child), #meraviglia .nav > div > a:not(:first-child) {
              border-left: 1px solid #011931; } }
        #meraviglia .nav > div > div:last-child, #meraviglia .nav > div > a:last-child {
          border-right: none; }
      #meraviglia .nav > div span {
        display: inline-block; }
  #meraviglia .wrap {
    margin-top: 80px; }
    @media screen and (max-width: 1199px) {
      #meraviglia .wrap {
        margin-top: 50px; } }
    @media screen and (max-width: 768px) {
      #meraviglia .wrap {
        margin-top: 0; } }
    #meraviglia .wrap img {
      display: block;
      width: 100%;
      height: auto; }
    #meraviglia .wrap .hero {
      position: relative;
      z-index: 1; }
      #meraviglia .wrap .hero-banner {
        width: 100%;
        position: relative;
        overflow: hidden; }
        @media screen and (max-width: 768px) {
          #meraviglia .wrap .hero-banner {
            display: none; } }
        #meraviglia .wrap .hero-banner::before {
          content: "";
          display: block;
          padding-bottom: 57.29167%; }
        #meraviglia .wrap .hero-banner svg {
          width: 100%;
          height: 100%;
          position: absolute;
          top: 0;
          left: 0;
          display: block; }
        @media screen and (min-width: 769px) {
          #meraviglia .wrap .hero-banner-mobile_top, #meraviglia .wrap .hero-banner-mobile_bottom {
            display: none; } }
        #meraviglia .wrap .hero-banner-mobile_bottom {
          position: relative;
          margin-bottom: 30px; }
      #meraviglia .wrap .hero-title {
        position: absolute;
        top: 20%;
        right: 140px;
        width: 29%;
        max-width: 539px; }
        @media screen and (max-width: 1440px) {
          #meraviglia .wrap .hero-title {
            right: 120px; } }
        @media screen and (max-width: 1199px) {
          #meraviglia .wrap .hero-title {
            right: 100px; } }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .hero-title {
            right: 80px; } }
        @media screen and (max-width: 768px) {
          #meraviglia .wrap .hero-title {
            position: static;
            width: 100%;
            max-width: none;
            padding: 20px 0; } }
        #meraviglia .wrap .hero-title-mobile {
          width: 70%;
          margin: 0 auto;
          max-width: 454px;
          min-width: 250px; }
          @media screen and (min-width: 769px) {
            #meraviglia .wrap .hero-title-mobile {
              display: none; } }
        #meraviglia .wrap .hero-title-big {
          width: 100%; }
          @media screen and (max-width: 768px) {
            #meraviglia .wrap .hero-title-big {
              display: none; } }
        #meraviglia .wrap .hero-title-text {
          display: block;
          padding-left: 20px;
          font-size: 30px;
          line-height: 2;
          color: #AFAFAF; }
          @media screen and (max-width: 1440px) {
            #meraviglia .wrap .hero-title-text {
              font-size: 24px; } }
          @media screen and (max-width: 1199px) {
            #meraviglia .wrap .hero-title-text {
              font-size: 18px;
              padding-left: 15px; } }
          @media screen and (max-width: 992px) {
            #meraviglia .wrap .hero-title-text {
              font-size: 14px; } }
          @media screen and (max-width: 768px) {
            #meraviglia .wrap .hero-title-text {
              font-size: 16px;
              padding-left: 0;
              text-align: center;
              line-height: 1.8;
              margin-top: 15px; } }
      #meraviglia .wrap .hero-text {
        width: 13%;
        max-width: 234px;
        min-width: 120px;
        position: absolute;
        top: calc(50% + 120px);
        right: 140px; }
        @media screen and (max-width: 1440px) {
          #meraviglia .wrap .hero-text {
            top: calc(50% + 70px);
            right: 120px; } }
        @media screen and (max-width: 1199px) {
          #meraviglia .wrap .hero-text {
            right: 100px; } }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .hero-text {
            top: calc(50% + 40px);
            right: 80px; } }
        @media screen and (max-width: 768px) {
          #meraviglia .wrap .hero-text {
            display: none; } }
      #meraviglia .wrap .hero-text-mobile {
        width: 100%;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        top: 50%;
        color: #ffffff;
        font-size: 14px;
        text-align: justify;
        line-height: 2;
        margin-top: 15px; }
        @media screen and (min-width: 769px) {
          #meraviglia .wrap .hero-text-mobile {
            display: none; } }
    #meraviglia .wrap .spec {
      margin-top: -14%;
      position: relative;
      z-index: 0; }
      @media screen and (max-width: 1199px) {
        #meraviglia .wrap .spec {
          margin-top: -15%; } }
      @media screen and (max-width: 768px) {
        #meraviglia .wrap .spec {
          display: none; } }
      #meraviglia .wrap .spec-map {
        width: 100%;
        background-image: url("../images/map_noship.png");
        background-position: top;
        background-size: cover;
        background-repeat: no-repeat; }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .spec-map {
            background-size: 115%;
            background-position: 99% 0%; } }
        #meraviglia .wrap .spec-map::before {
          content: "";
          display: block;
          padding-bottom: 67.70833%; }
        #meraviglia .wrap .spec-map .map-ship {
          position: absolute;
          width: 5%;
          top: 60%;
          left: 50%;
          -webkit-transform: translate(-50%, -50%);
          -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
          -webkit-animation: map-ship 3s infinite linear;
          animation: map-ship 3s infinite linear; }
      #meraviglia .wrap .spec-info {
        position: absolute;
        top: calc(14% + 300px);
        left: 130px; }
        @media screen and (max-width: 1440px) {
          #meraviglia .wrap .spec-info {
            top: calc(14% + 200px);
            left: 80px; } }
        @media screen and (max-width: 1199px) {
          #meraviglia .wrap .spec-info {
            top: calc(14% + 100px);
            left: 60px; } }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .spec-info {
            display: none; } }
        #meraviglia .wrap .spec-info-title {
          color: #002C57;
          vertical-align: middle;
          font-size: 22px; }
          @media screen and (max-width: 1440px) {
            #meraviglia .wrap .spec-info-title {
              font-size: 18px; } }
        #meraviglia .wrap .spec-info-icon {
          display: inline-block;
          width: 30px;
          height: 30px;
          background-image: url("../images/spec-icon.png");
          background-position: center;
          background-size: cover;
          background-repeat: no-repeat;
          vertical-align: top;
          margin-right: 10px; }
          @media screen and (max-width: 1440px) {
            #meraviglia .wrap .spec-info-icon {
              margin-right: 5px; } }
          @media screen and (max-width: 1199px) {
            #meraviglia .wrap .spec-info-icon {
              vertical-align: bottom; } }
        #meraviglia .wrap .spec-info-list {
          position: relative;
          padding-left: 40px;
          margin-top: 8px;
          font-size: 18px;
          color: #4D4D4D;
          list-style: none; }
          @media screen and (max-width: 1440px) {
            #meraviglia .wrap .spec-info-list {
              padding-left: 35px;
              font-size: 14px; } }
          #meraviglia .wrap .spec-info-list li + li {
            padding-top: 8px; }
          #meraviglia .wrap .spec-info-list::before {
            content: "";
            width: 1px;
            height: 100%;
            position: absolute;
            top: 0;
            left: 14px;
            background-color: #4D4D4D; }
      #meraviglia .wrap .spec-text {
        margin-top: -200px;
        margin-bottom: 70px;
        color: #AF8656;
        font-size: 20px;
        line-height: 2;
        text-align: center; }
        @media screen and (max-width: 1440px) {
          #meraviglia .wrap .spec-text {
            font-size: 18px;
            margin-top: -170px; } }
        @media screen and (max-width: 1199px) {
          #meraviglia .wrap .spec-text {
            font-size: 15px;
            margin-top: -130px; } }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .spec-text {
            font-size: 14px;
            margin-top: -60px;
            margin-bottom: 40px; } }
        @media screen and (min-width: 993px) {
          #meraviglia .wrap .spec-text .br-hide-m2t {
            display: none; } }
    #meraviglia .wrap .intro {
      background-image: url("../images/intro-bg.png");
      background-position: top;
      background-size: 70px;
      background-repeat: repeat;
      position: relative; }
      @media screen and (max-width: 768px) {
        #meraviglia .wrap .intro {
          background-size: 60px; } }
      #meraviglia .wrap .intro::after {
        content: "";
        width: 100%;
        height: 50px;
        position: absolute;
        bottom: 0;
        left: 0;
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.8)));
        background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8));
        background: -o-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8));
        background: linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8));
        z-index: 0; }
      #meraviglia .wrap .intro .container {
        position: relative;
        z-index: 1; }
      #meraviglia .wrap .intro-item:nth-child(even) {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse; }
      #meraviglia .wrap .intro-item {
        padding: 110px 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
        @media screen and (max-width: 1199px) {
          #meraviglia .wrap .intro-item {
            padding: 75px 0; } }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .intro-item {
            padding: 45px 0; } }
        @media screen and (max-width: 768px) {
          #meraviglia .wrap .intro-item {
            padding: 25px 0; } }
        #meraviglia .wrap .intro-item-inner {
          width: 40%;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center; }
          @media screen and (max-width: 1199px) {
            #meraviglia .wrap .intro-item-inner {
              width: 45%; } }
          @media screen and (max-width: 768px) {
            #meraviglia .wrap .intro-item-inner {
              width: 100%;
              margin-bottom: 20px; } }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .intro-item-content {
            width: 80%; } }
        @media screen and (max-width: 768px) {
          #meraviglia .wrap .intro-item-content {
            width: 100%; } }
        #meraviglia .wrap .intro-item-title {
          color: #002C57;
          background: -webkit-gradient(linear, left top, left bottom, from(#0374b4), to(#003157));
          background: -webkit-linear-gradient(top, #0374b4, #003157);
          background: -o-linear-gradient(top, #0374b4, #003157);
          background: linear-gradient(top, #0374b4, #003157);
          -webkit-background-clip: text;
          -webkit-text-fill-color: transparent;
          font-size: 72px; }
          @media screen and (max-width: 1199px) {
            #meraviglia .wrap .intro-item-title {
              font-size: 60px; } }
          @media screen and (max-width: 992px) {
            #meraviglia .wrap .intro-item-title {
              font-size: 42px; } }
          @media screen and (max-width: 768px) {
            #meraviglia .wrap .intro-item-title {
              font-size: 30px;
              text-align: center; } }
        #meraviglia .wrap .intro-item-text {
          color: #002C57;
          font-size: 23px;
          line-height: 1.8;
          margin-top: 10px; }
          @media screen and (max-width: 1440px) {
            #meraviglia .wrap .intro-item-text {
              font-size: 18px; } }
          @media screen and (max-width: 992px) {
            #meraviglia .wrap .intro-item-text {
              font-size: 16px; } }
          #meraviglia .wrap .intro-item-text span {
            color: #4D4D4D;
            font-size: 18px; }
            @media screen and (max-width: 1440px) {
              #meraviglia .wrap .intro-item-text span {
                font-size: 16px; } }
            @media screen and (max-width: 1199px) {
              #meraviglia .wrap .intro-item-text span {
                font-size: 12px; } }
          @media screen and (max-width: 992px) {
            #meraviglia .wrap .intro-item-text .br-hide-m {
              display: none; } }
        #meraviglia .wrap .intro-item-image {
          max-width: 1000px;
          width: 60%; }
          @media screen and (max-width: 1199px) {
            #meraviglia .wrap .intro-item-image {
              width: 55%; } }
          @media screen and (max-width: 768px) {
            #meraviglia .wrap .intro-item-image {
              width: 100%; } }
          #meraviglia .wrap .intro-item-image .item-image-big {
            width: 100%;
            margin-bottom: 20px; }
            @media screen and (max-width: 1199px) {
              #meraviglia .wrap .intro-item-image .item-image-big {
                margin-bottom: 10px; } }
          #meraviglia .wrap .intro-item-image .item-image-small {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex; }
            #meraviglia .wrap .intro-item-image .item-image-small > div {
              -webkit-box-flex: 1;
              -ms-flex: 1;
              flex: 1; }
              #meraviglia .wrap .intro-item-image .item-image-small > div + div {
                margin-left: 20px; }
                @media screen and (max-width: 1199px) {
                  #meraviglia .wrap .intro-item-image .item-image-small > div + div {
                    margin-left: 10px; } }
    #meraviglia .wrap .spot {
      padding: 110px 0;
      overflow: hidden; }
      @media screen and (max-width: 1199px) {
        #meraviglia .wrap .spot {
          padding: 75px 0; } }
      @media screen and (max-width: 992px) {
        #meraviglia .wrap .spot {
          padding: 45px 0 70px; } }
      @media screen and (max-width: 768px) {
        #meraviglia .wrap .spot {
          padding: 20px 0 50px; } }
      #meraviglia .wrap .spot svg {
        display: block; }
      @media screen and (max-width: 992px) {
        #meraviglia .wrap .spot .container {
          max-width: 970px; } }
      #meraviglia .wrap .spot-title {
        font-size: 72px;
        text-align: center;
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center; }
        @media screen and (max-width: 1199px) {
          #meraviglia .wrap .spot-title {
            font-size: 60px; } }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .spot-title {
            font-size: 42px; } }
        @media screen and (max-width: 768px) {
          #meraviglia .wrap .spot-title {
            font-size: 30px; } }
        #meraviglia .wrap .spot-title span {
          display: inline-block;
          position: relative;
          z-index: 1; }
          #meraviglia .wrap .spot-title span p {
            color: #002C57;
            background: -webkit-gradient(linear, left top, left bottom, from(#0374b4), to(#003157));
            background: -webkit-linear-gradient(top, #0374b4, #003157);
            background: -o-linear-gradient(top, #0374b4, #003157);
            background: linear-gradient(top, #0374b4, #003157);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent; }
        #meraviglia .wrap .spot-title::before, #meraviglia .wrap .spot-title::after {
          content: "";
          display: inline-block;
          position: absolute;
          top: 50%;
          -webkit-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
          transform: translateY(-50%);
          background-size: contain;
          background-repeat: no-repeat;
          width: calc((100% - 620px) / 2);
          padding-bottom: 20px; }
          @media screen and (max-width: 1199px) {
            #meraviglia .wrap .spot-title::before, #meraviglia .wrap .spot-title::after {
              width: calc((100% - 500px) / 2); } }
          @media screen and (max-width: 992px) {
            #meraviglia .wrap .spot-title::before, #meraviglia .wrap .spot-title::after {
              width: calc((100% - 350px) / 2); } }
          @media screen and (max-width: 768px) {
            #meraviglia .wrap .spot-title::before, #meraviglia .wrap .spot-title::after {
              display: none; } }
        #meraviglia .wrap .spot-title::before {
          left: 0;
          background-image: url(../images/title-dot_line_left.png);
          background-position: right; }
        #meraviglia .wrap .spot-title::after {
          right: 0;
          background-image: url(../images/title-dot_line_right.png);
          background-position: left; }
      #meraviglia .wrap .spot-country {
        margin-top: 100px;
        position: relative; }
        @media screen and (max-width: 1199px) {
          #meraviglia .wrap .spot-country {
            margin-top: 60px; } }
        @media screen and (max-width: 768px) {
          #meraviglia .wrap .spot-country {
            margin-top: 20px; } }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .spot-country + .spot-country {
            margin-top: 90px; } }
        @media screen and (max-width: 768px) {
          #meraviglia .wrap .spot-country + .spot-country {
            margin-top: 20px; } }
        #meraviglia .wrap .spot-country-title {
          width: 40%;
          max-width: 755px;
          min-width: 250px;
          margin-bottom: 30px;
          position: relative; }
          @media screen and (max-width: 992px) {
            #meraviglia .wrap .spot-country-title {
              width: 45%; } }
      #meraviglia .wrap .spot-country .country-bg {
        position: absolute; }
        @media screen and (max-width: 768px) {
          #meraviglia .wrap .spot-country .country-bg {
            display: none; } }
      #meraviglia .wrap .spot-country.country-italy .country-bg {
        top: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        width: 75%; }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .spot-country.country-italy .country-bg {
            top: 20%;
            width: 80%; } }
      #meraviglia .wrap .spot-country.country-malta .country-bg {
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-80%, -30%);
        -ms-transform: translate(-80%, -30%);
        transform: translate(-80%, -30%);
        width: 40%; }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .spot-country.country-malta .country-bg {
            top: 57%;
            -webkit-transform: translate(-50%, 0);
            -ms-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
            width: 56%; } }
      #meraviglia .wrap .spot-country.country-spain .country-bg {
        bottom: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        width: 75%; }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .spot-country.country-spain .country-bg {
            bottom: 20%;
            width: 78%; } }
      #meraviglia .wrap .spot-country.country-france .country-bg {
        bottom: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        width: 60%; }
        @media screen and (max-width: 992px) {
          #meraviglia .wrap .spot-country.country-france .country-bg {
            bottom: 20%;
            width: 75%; } }
      #meraviglia .wrap .spot-item:nth-child(odd) {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse; }
      #meraviglia .wrap .spot-country.country-picFirst .spot-item:nth-child(odd) {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row; }
      #meraviglia .wrap .spot-country.country-picFirst .spot-item:nth-child(even) {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse; }
      #meraviglia .wrap .spot-item {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
        #meraviglia .wrap .spot-item + .spot-item {
          padding-top: 30px; }
          @media screen and (max-width: 992px) {
            #meraviglia .wrap .spot-item + .spot-item {
              padding-top: 80px; } }
          @media screen and (max-width: 768px) {
            #meraviglia .wrap .spot-item + .spot-item {
              padding-top: 20px; } }
        #meraviglia .wrap .spot-item-content {
          width: 90%;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-align: stretch;
          -ms-flex-align: stretch;
          align-items: stretch; }
          @media screen and (max-width: 992px) {
            #meraviglia .wrap .spot-item-content {
              width: 100%; } }
          @media screen and (max-width: 768px) {
            #meraviglia .wrap .spot-item-content {
              -ms-flex-wrap: wrap;
              flex-wrap: wrap; } }
        #meraviglia .wrap .spot-item-title {
          color: #002C57;
          font-size: 70px;
          position: relative;
          line-height: 1.2;
          width: 90px;
          max-width: 90px; }
          #meraviglia .wrap .spot-item-title::after {
            content: "";
            width: 2px;
            height: 100%;
            position: absolute;
            top: 0;
            right: -10px;
            background-color: #002C57; }
            @media screen and (max-width: 1199px) {
              #meraviglia .wrap .spot-item-title::after {
                right: -5px; } }
            @media screen and (max-width: 768px) {
              #meraviglia .wrap .spot-item-title::after {
                display: none; } }
          @media screen and (max-width: 1440px) {
            #meraviglia .wrap .spot-item-title {
              width: 60px;
              max-width: 60px;
              font-size: 42px; } }
          @media screen and (max-width: 1199px) {
            #meraviglia .wrap .spot-item-title {
              width: 50px;
              max-width: 50px;
              font-size: 36px; } }
          @media screen and (max-width: 992px) {
            #meraviglia .wrap .spot-item-title {
              line-height: 1; } }
          @media screen and (max-width: 768px) {
            #meraviglia .wrap .spot-item-title {
              width: 100%;
              max-width: none;
              text-align: center;
              margin-bottom: 15px;
              font-size: 30px;
              letter-spacing: 5px; } }
        #meraviglia .wrap .spot-item-text {
          color: #002C57;
          font-size: 30px;
          margin-left: 35px;
          line-height: 1.8;
          width: 100%;
          -ms-flex-item-align: center;
          align-self: center; }
          @media screen and (max-width: 1440px) {
            #meraviglia .wrap .spot-item-text {
              width: calc(100% - 60px);
              font-size: 18px; } }
          @media screen and (max-width: 1199px) {
            #meraviglia .wrap .spot-item-text {
              width: calc(100% - 50px);
              margin-left: 20px;
              font-size: 16px; } }
          @media screen and (max-width: 992px) {
            #meraviglia .wrap .spot-item-text {
              font-size: 18px; } }
          @media screen and (max-width: 768px) {
            #meraviglia .wrap .spot-item-text {
              width: 100%;
              margin-left: 0; } }
        #meraviglia .wrap .spot-item-inner {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          width: 50%; }
          @media screen and (max-width: 992px) {
            #meraviglia .wrap .spot-item-inner {
              width: 100%;
              margin-top: 30px; } }
        #meraviglia .wrap .spot-item-image {
          position: relative;
          width: 50%; }
          @media screen and (max-width: 992px) {
            #meraviglia .wrap .spot-item-image {
              width: 100%; } }
          #meraviglia .wrap .spot-item-image::before {
            content: "";
            display: block;
            padding-bottom: 58.62069%; }
          #meraviglia .wrap .spot-item-image svg {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            display: block; }
    #meraviglia .wrap footer p {
      text-align: center;
      color: #4D4D4D;
      border-top: 1px solid #707070;
      padding: 15px 0 60px; }
      @media screen and (max-width: 992px) {
        #meraviglia .wrap footer p {
          padding: 20px 0 30px;
          font-size: 12px; } }
      @media screen and (max-width: 768px) {
        #meraviglia .wrap footer p {
          padding: 20px 0 100px; } }
  #meraviglia [class*='fadeIn-'] {
    opacity: 0; }
  #meraviglia [class*='fadeIn-top-'] {
    -webkit-transform: translate(40px);
    -ms-transform: translate(40px);
    transform: translate(40px); }
  #meraviglia .runAnimate.fadeIn-stand-slow {
    -webkit-animation: fadeIn-stand 2s ease-in-out forwards;
    animation: fadeIn-stand 2s ease-in-out forwards; }
  #meraviglia .runAnimate.fadeIn-stand-fast {
    -webkit-animation: fadeIn-stand 1.2s ease-in-out forwards;
    animation: fadeIn-stand 1.2s ease-in-out forwards; }
  #meraviglia .runAnimate.fadeIn-top-fast {
    -webkit-animation: fadeIn-top 1.2s ease-in-out forwards;
    animation: fadeIn-top 1.2s ease-in-out forwards; }
  #meraviglia .runAnimate.fadeIn-top-slow {
    -webkit-animation: fadeIn-top 2s ease-in-out forwards;
    animation: fadeIn-top 2s ease-in-out forwards; }

@-webkit-keyframes fadeIn-stand {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes fadeIn-stand {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@-webkit-keyframes fadeIn-top {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    transform: translateY(40px); }
  80% {
    opacity: 1; }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px); } }

@keyframes fadeIn-top {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    transform: translateY(40px); }
  80% {
    opacity: 1; }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px); } }

@-webkit-keyframes map-ship {
  0% {
    -webkit-transform: translate(-50%, -60%);
    transform: translate(-50%, -60%); }
  70% {
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
  100% {
    -webkit-transform: translate(-50%, -60%);
    transform: translate(-50%, -60%); } }

@keyframes map-ship {
  0% {
    -webkit-transform: translate(-50%, -60%);
    transform: translate(-50%, -60%); }
  70% {
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
  100% {
    -webkit-transform: translate(-50%, -60%);
    transform: translate(-50%, -60%); } }

#goTop {
  width: 60px;
  height: 60px;
  position: fixed;
  right: 30px;
  bottom: 60px;
  border-radius: 99em;
  background-color: #1e91cd;
  background-image: url("https://www.besttour.com.tw/e_web/image/gototop.svg");
  display: none;
  z-index: 160;
  -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 3px 10px;
  box-shadow: rgba(0, 0, 0, 0.3) 0 3px 10px;
  cursor: pointer; }
  #goTop:hover {
    background-color: #008ae7; }
  @media screen and (max-width: 768px) {
    #goTop {
      width: 40px;
      height: 40px;
      line-height: 50px;
      right: 20px;
      bottom: 100px;
      font-size: 12px;
      background-size: 40px;
      background-position: center; } }