@charset "UTF-8";
/**
 * Foundation for Sites by ZURB
 * Version 6.4.4-rc1
 * foundation.zurb.com
 * Licensed under MIT Open Source
 */
.img-ref {
  position: relative; }

.img-deco {
  position: absolute;
  top: 0;
  left: 0; }

.cloud_area {
  width: 100%;
  overflow-x: hidden;
  background: -webkit-gradient(linear, left top, left bottom, from(#086ac5), to(#fefefe));
  background: linear-gradient(top, #086ac5, #fefefe);
  background: -ms-linear-gradient(top, #086ac5, #fefefe); }
  .cloud_area .main-visual {
    position: relative;
    z-index: 10;
    margin: 105px auto 0;
    max-width: 1920px; }
    .cloud_area .main-visual::before {
      content: "";
      display: block;
      padding-top: 34%; }
  .cloud_area .house1 {
    top: 6%;
    left: 58%;
    max-width: 19%;
    -webkit-animation: houseMove_l 20s linear infinite;
            animation: houseMove_l 20s linear infinite; }
  .cloud_area .house2 {
    top: 26%;
    left: 79%;
    max-width: 13%;
    -webkit-animation: slashMove_rev 20s linear infinite;
            animation: slashMove_rev 20s linear infinite; }
  .cloud_area .house3 {
    top: 33%;
    left: 48%;
    max-width: 14%;
    -webkit-animation: slashMove 20s linear infinite;
            animation: slashMove 20s linear infinite; }
  .cloud_area .house4 {
    top: 28%;
    left: 64%;
    max-width: 18%;
    -webkit-animation: houseMove_l_rev 20s linear infinite;
            animation: houseMove_l_rev 20s linear infinite; }
  .cloud_area .light1 {
    top: -3%;
    left: 18%;
    max-width: 23%;
    -webkit-animation: bling 2s 1s infinite;
            animation: bling 2s 1s infinite; }
  .cloud_area .building1 {
    top: 15%;
    left: 17%;
    max-width: 21%;
    -webkit-animation: buildMove_rev 30s linear infinite;
            animation: buildMove_rev 30s linear infinite; }
  .cloud_area .building2 {
    top: 4%;
    left: 8%;
    max-width: 13%; }
  .cloud_area .cylinder-circle {
    width: 100%; }
    .cloud_area .cylinder-circle::before {
      content: "";
      display: block;
      padding-top: 123%; }
    .cloud_area .cylinder-circle svg {
      max-width: 100%;
      width: 100%;
      height: 100%; }
  .cloud_area .stop1 {
    -webkit-animation: change-color1 2s ease-in-out infinite alternate;
            animation: change-color1 2s ease-in-out infinite alternate; }
  .cloud_area .stop2 {
    -webkit-animation: change-color2 2s ease-in-out infinite alternate;
            animation: change-color2 2s ease-in-out infinite alternate; }
  .cloud_area .cloud3d {
    -webkit-animation: slashMove 20s linear infinite;
            animation: slashMove 20s linear infinite; }
  .cloud_area .dialog {
    top: 28%;
    left: 32%;
    max-width: 12%;
    -webkit-animation: slashMove_rev 20s linear infinite;
            animation: slashMove_rev 20s linear infinite; }
  .cloud_area .box {
    top: 7%;
    left: 41%;
    max-width: 3%;
    -webkit-animation: boxScale 2s infinite;
            animation: boxScale 2s infinite; }
  .cloud_area .light2 {
    top: 9%;
    left: auto;
    right: 0;
    opacity: 0.5;
    max-width: 56%;
    -webkit-animation: bling 2s infinite;
            animation: bling 2s infinite; }
  .cloud_area .light3 {
    top: 34%;
    left: 0;
    max-width: 28%;
    -webkit-animation: bling 2s 3s infinite;
            animation: bling 2s 3s infinite; }
  .cloud_area .cloud {
    background-size: 100%;
    background-repeat: repeat-x;
    height: 100%;
    opacity: .2; }
    .cloud_area .cloud::after {
      content: "";
      display: block;
      margin-top: -1px;
      height: 100%;
      background: #fff; }
    .cloud_area .cloud img {
      opacity: 0; }
  .cloud_area .cloud1 {
    top: 30%;
    background-image: url(../images/service/cloud_1.png);
    -webkit-animation: 480s cloudMove1 linear infinite;
            animation: 480s cloudMove1 linear infinite; }
  .cloud_area .cloud2 {
    top: 37%;
    background-image: url(../images/service/cloud_2.png);
    -webkit-animation: 360s cloudMove2 linear infinite;
            animation: 360s cloudMove2 linear infinite; }
  .cloud_area .cloud3 {
    top: 48%;
    opacity: .3;
    background-image: url(../images/service/cloud_3.png);
    -webkit-animation: 240s cloudMove3 linear infinite;
            animation: 240s cloudMove3 linear infinite; }

.island_area {
  width: 100%;
  margin-top: -150px;
  position: relative;
  z-index: 999; }
  .island_area .island_center_box::before {
    content: "";
    display: block;
    padding-top: 23%; }
  .island_area .island_center_box {
    width: 1280px;
    margin: 0 auto -4px auto;
    position: relative;
    z-index: 999; }

.bread_area {
  padding: 12px 0 0 0; }
  .bread_area .bread_center {
    width: 1320px; }

.page_title {
  position: relative;
  z-index: 20; }
  .page_title.no_top {
    margin: 0 auto;
    padding: 0 0 20px 0;
    margin-top: 20px; }

.page_article {
  width: 100%;
  position: relative;
  z-index: 999; }
  .page_article .article_center {
    width: 1340px;
    margin: 0 auto 0px auto;
    padding: 17px 20px 20px 20px;
    background: #fff;
    border-radius: 10px;
    position: relative; }

.footerbar .footer_top {
  border-top: 1px solid #ccc; }

.gray {
  color: #868686; }

.orange {
  color: #ea5413; }

.f-bold {
  font-weight: bold; }

nav[aria-label="Breadcrumbs"] {
  width: calc(100% - 40px); }

.divide-space-10 {
  height: 10px;
  clear: both;
  width: 100%; }

.divide-space-20 {
  height: 20px;
  clear: both;
  width: 100%; }
  @media screen and (max-width: 63.9375em) {
    .divide-space-20 {
      height: 10px;
      clear: both; } }

.divide-space-30 {
  height: 30px;
  clear: both;
  width: 100%; }
  @media screen and (max-width: 63.9375em) {
    .divide-space-30 {
      height: 20px;
      clear: both; } }

.divide-space-50 {
  height: 50px;
  clear: both;
  width: 100%; }
  @media screen and (min-width: 40em) and (max-width: 63.9375em) {
    .divide-space-50 {
      height: 40px;
      clear: both; } }
  @media screen and (max-width: 39.9375em) {
    .divide-space-50 {
      height: 30px;
      clear: both; } }

.divide-space-80 {
  height: 80px;
  clear: both;
  width: 100%; }
  @media screen and (min-width: 40em) and (max-width: 63.9375em) {
    .divide-space-80 {
      height: 40px;
      clear: both; } }
  @media screen and (max-width: 39.9375em) {
    .divide-space-80 {
      height: 30px;
      clear: both; } }

.page_article .article_center .oil-area .oil-price-box {
  /* border:1px solid blue; */
  height: auto;
  position: relative;
  overflow: hidden; }
  .page_article .article_center .oil-area .oil-price-box .oil-box {
    margin: auto;
    margin-top: 30px;
    margin-bottom: 30px;
    width: 95%;
    overflow: hidden;
    position: relative; }
    @media screen and (min-width: 40em) and (max-width: 63.9375em) {
      .page_article .article_center .oil-area .oil-price-box .oil-box {
        width: calc(50% - 40px);
        float: left;
        margin: 20px; } }
    .page_article .article_center .oil-area .oil-price-box .oil-box img {
      position: absolute;
      left: 0;
      bottom: 0; }
      @media screen and (max-width: 39.9375em) {
        .page_article .article_center .oil-area .oil-price-box .oil-box img {
          -webkit-transform: scale(0.8);
                  transform: scale(0.8); } }
    .page_article .article_center .oil-area .oil-price-box .oil-box .title {
      position: absolute;
      left: 40%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%); }
    .page_article .article_center .oil-area .oil-price-box .oil-box .math span {
      font-size: 35px;
      text-shadow: 1px 0 #fff; }
    .page_article .article_center .oil-area .oil-price-box .oil-box img {
      width: 71px; }
  .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] {
    border: 2px solid #fff;
    border-radius: 20px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    background: #764eac;
    /* Old browsers */
    /* FF3.6-15 */
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-gradient(linear, left top, left bottom, from(#764eac), to(#944eb8));
    background: linear-gradient(to bottom, #764eac 0%, #944eb8 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#764eac', endColorstr='#944eb8',GradientType=0 ); }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .title {
      color: #fff;
      display: inline-block;
      margin: auto;
      margin: 10px 20px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .math {
      color: #fff;
      display: inline-block;
      margin: auto;
      margin: 10px 20px;
      float: right; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .math span {
        margin: 0px 10px;
        text-shadow: 1px 0 #fff; }
  .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] {
    border: 2px solid #fff;
    border-radius: 20px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e8830d+0,f69c31+100 */
    background: #e8830d;
    /* Old browsers */
    /* FF3.6-15 */
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-gradient(linear, left top, left bottom, from(#e8830d), to(#f69c31));
    background: linear-gradient(to bottom, #e8830d 0%, #f69c31 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8830d', endColorstr='#f69c31',GradientType=0 );
    /* IE6-9 */ }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .title {
      color: #fff;
      display: inline-block;
      margin: auto;
      margin: 10px 20px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .math {
      color: #fff;
      display: inline-block;
      margin: auto;
      margin: 10px 20px;
      float: right; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .math span {
        margin: 0px 10px;
        text-shadow: 1.5px 0 #fff; }
  .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] {
    border: 2px solid #fff;
    border-radius: 20px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#51a826+0,61bd33+100 */
    background: #51a826;
    /* Old browsers */
    /* FF3.6-15 */
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-gradient(linear, left top, left bottom, from(#51a826), to(#61bd33));
    background: linear-gradient(to bottom, #51a826 0%, #61bd33 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#51a826', endColorstr='#61bd33',GradientType=0 );
    /* IE6-9 */ }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .title {
      color: #fff;
      display: inline-block;
      margin: auto;
      margin: 10px 20px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .math {
      color: #fff;
      display: inline-block;
      margin: auto;
      margin: 10px 20px;
      float: right; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .math span {
        margin: 0px 10px;
        text-shadow: 1.5px 0 #fff; }
  .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] {
    border: 2px solid #fff;
    border-radius: 20px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1ba1d2+0,32b4e3+100 */
    background: #1ba1d2;
    /* Old browsers */
    /* FF3.6-15 */
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-gradient(linear, left top, left bottom, from(#1ba1d2), to(#32b4e3));
    background: linear-gradient(to bottom, #1ba1d2 0%, #32b4e3 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1ba1d2', endColorstr='#32b4e3',GradientType=0 );
    /* IE6-9 */ }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .title {
      color: #fff;
      display: inline-block;
      margin: auto;
      margin: 10px 20px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .math {
      color: #fff;
      display: inline-block;
      margin: auto;
      margin: 10px 20px;
      float: right; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .math span {
        margin: 0px 10px;
        text-shadow: 1.5px 0 #fff; }

.page_article .article_center .oil-area .image-box {
  /* border:1px solid green; */
  height: auto; }
  @media screen and (min-width: 40em) and (max-width: 63.9375em) {
    .page_article .article_center .oil-area .image-box {
      margin: 30px 0px; } }
  @media screen and (max-width: 39.9375em) {
    .page_article .article_center .oil-area .image-box {
      margin: 20px 0px; } }
  .page_article .article_center .oil-area .image-box .car-box {
    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;
    width: 100%;
    height: 100%; }
    .page_article .article_center .oil-area .image-box .car-box img {
      width: 100%; }

@media screen and (max-width: 63.9375em) {
  .page_article .article_center .prompt-area ul {
    margin: 20px 0px; } }

.page_article .article_center .prompt-area ul li {
  list-style: none;
  padding: 0;
  line-height: 150%;
  letter-spacing: 1px; }
  .page_article .article_center .prompt-area ul li p {
    display: contents;
    color: #868686; }
  .page_article .article_center .prompt-area ul li:before {
    content: " • ";
    display: inline-block;
    margin-left: -1.3em;
    width: 1.3em;
    color: #ea5413;
    position: absolute; }

.page_article .article_center .select-offer-area {
  margin: 20px 0px; }
  .page_article .article_center .select-offer-area .offer-1 .offer_box {
    margin: 0 0 20px 0;
    border-radius: 10px;
    border: 2px solid #fff;
    -webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
    -webkit-transition: 0.3s;
    transition: 0.3s;
    cursor: pointer;
    position: relative;
    overflow: hidden; }
    .page_article .article_center .select-offer-area .offer-1 .offer_box .offer_center {
      width: calc(100% - 30px - 20px);
      margin: 0 auto;
      overflow: hidden;
      padding: 10px;
      position: relative; }
      .page_article .article_center .select-offer-area .offer-1 .offer_box .offer_center .offer_icon {
        width: 60px;
        height: 60px;
        float: left;
        border-radius: 100px;
        -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
                box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
        margin: 8px 0 0 0; }
      .page_article .article_center .select-offer-area .offer-1 .offer_box .offer_center .offer_word {
        width: calc(100% - 80px);
        float: left;
        margin: 0 0 0 20px;
        color: #ea5413; }
        .page_article .article_center .select-offer-area .offer-1 .offer_box .offer_center .offer_word h3 {
          margin: 20px 0px;
          font-weight: 300; }
          .page_article .article_center .select-offer-area .offer-1 .offer_box .offer_center .offer_word h3 span {
            color: #0d3078;
            margin: 0px 10px; }
      .page_article .article_center .select-offer-area .offer-1 .offer_box .offer_center .offer_arrow {
        width: 18px;
        height: 18px;
        right: 5px;
        top: calc(50% - 9px);
        -webkit-transform: rotate(180deg);
                transform: rotate(180deg);
        opacity: 1;
        -webkit-transition: 0.3s;
        transition: 0.3s;
        position: absolute;
        visibility: hidden;
        opacity: 0; }
    .page_article .article_center .select-offer-area .offer-1 .offer_box:hover {
      border: 2px solid #fbae40;
      -webkit-transition: 0.3s;
      transition: 0.3s; }
      .page_article .article_center .select-offer-area .offer-1 .offer_box:hover .offer_center .offer_arrow {
        right: 0;
        -webkit-transition: 0.3s;
        transition: 0.3s;
        visibility: visible;
        opacity: 1; }
    .page_article .article_center .select-offer-area .offer-1 .offer_box .bank_cover {
      width: 110px;
      height: 130px;
      position: absolute;
      -webkit-transform: rotate(45deg);
              transform: rotate(45deg);
      left: -50px;
      top: -60px;
      -webkit-transition: 0.3s;
      transition: 0.3s;
      background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.08)), to(rgba(0, 0, 0, 0)));
      background: linear-gradient(left, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0));
      background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0)); }
  .page_article .article_center .select-offer-area .offer-2 .offer_box {
    margin: 0 0 20px 0;
    border-radius: 10px;
    border: 2px solid #fff;
    -webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
    -webkit-transition: 0.3s;
    transition: 0.3s;
    cursor: pointer;
    position: relative;
    overflow: hidden; }
    .page_article .article_center .select-offer-area .offer-2 .offer_box .offer_center {
      width: calc(100% - 30px - 20px);
      margin: 0 auto;
      overflow: hidden;
      padding: 10px;
      position: relative; }
      .page_article .article_center .select-offer-area .offer-2 .offer_box .offer_center .offer_icon {
        width: 60px;
        height: 60px;
        float: left;
        border-radius: 100px;
        -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
                box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
        margin: 8px 0 0 0; }
      .page_article .article_center .select-offer-area .offer-2 .offer_box .offer_center .offer_word {
        width: calc(100% - 80px);
        float: left;
        margin: 0 0 0 20px;
        color: #ea5413; }
        .page_article .article_center .select-offer-area .offer-2 .offer_box .offer_center .offer_word h3 {
          margin: 20px 0px;
          font-weight: 300; }
          .page_article .article_center .select-offer-area .offer-2 .offer_box .offer_center .offer_word h3 span {
            color: #0d3078;
            margin: 0px 10px; }
      .page_article .article_center .select-offer-area .offer-2 .offer_box .offer_center .offer_arrow {
        width: 18px;
        height: 18px;
        right: 5px;
        top: calc(50% - 9px);
        -webkit-transform: rotate(180deg);
                transform: rotate(180deg);
        opacity: 1;
        -webkit-transition: 0.3s;
        transition: 0.3s;
        position: absolute;
        visibility: hidden;
        opacity: 0; }
    .page_article .article_center .select-offer-area .offer-2 .offer_box:hover {
      border: 2px solid #90c346;
      -webkit-transition: 0.3s;
      transition: 0.3s; }
      .page_article .article_center .select-offer-area .offer-2 .offer_box:hover .offer_center .offer_arrow {
        right: 0;
        -webkit-transition: 0.3s;
        transition: 0.3s;
        visibility: visible;
        opacity: 1; }
    .page_article .article_center .select-offer-area .offer-2 .offer_box .bank_cover {
      width: 110px;
      height: 130px;
      position: absolute;
      -webkit-transform: rotate(45deg);
              transform: rotate(45deg);
      left: -50px;
      top: -60px;
      -webkit-transition: 0.3s;
      transition: 0.3s;
      background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.08)), to(rgba(0, 0, 0, 0)));
      background: linear-gradient(left, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0));
      background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0)); }
  .page_article .article_center .select-offer-area .offer-3 .offer_box {
    margin: 0 0 20px 0;
    border-radius: 10px;
    border: 2px solid #fff;
    -webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
    -webkit-transition: 0.3s;
    transition: 0.3s;
    cursor: pointer;
    position: relative;
    overflow: hidden; }
    .page_article .article_center .select-offer-area .offer-3 .offer_box .offer_center {
      width: calc(100% - 30px - 20px);
      margin: 0 auto;
      overflow: hidden;
      padding: 10px;
      position: relative; }
      .page_article .article_center .select-offer-area .offer-3 .offer_box .offer_center .offer_icon {
        width: 60px;
        height: 60px;
        float: left;
        border-radius: 100px;
        -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
                box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
        margin: 8px 0 0 0; }
      .page_article .article_center .select-offer-area .offer-3 .offer_box .offer_center .offer_word {
        width: calc(100% - 80px);
        float: left;
        margin: 0 0 0 20px;
        color: #ea5413; }
        .page_article .article_center .select-offer-area .offer-3 .offer_box .offer_center .offer_word h3 {
          margin: 20px 0px;
          font-weight: 300; }
          .page_article .article_center .select-offer-area .offer-3 .offer_box .offer_center .offer_word h3 span {
            color: #0d3078;
            margin: 0px 10px; }
      .page_article .article_center .select-offer-area .offer-3 .offer_box .offer_center .offer_arrow {
        width: 18px;
        height: 18px;
        right: 5px;
        top: calc(50% - 9px);
        -webkit-transform: rotate(180deg);
                transform: rotate(180deg);
        opacity: 1;
        -webkit-transition: 0.3s;
        transition: 0.3s;
        position: absolute;
        visibility: hidden;
        opacity: 0; }
    .page_article .article_center .select-offer-area .offer-3 .offer_box:hover {
      border: 2px solid #52abd3;
      -webkit-transition: 0.3s;
      transition: 0.3s; }
      .page_article .article_center .select-offer-area .offer-3 .offer_box:hover .offer_center .offer_arrow {
        right: 0;
        -webkit-transition: 0.3s;
        transition: 0.3s;
        visibility: visible;
        opacity: 1; }
    .page_article .article_center .select-offer-area .offer-3 .offer_box .bank_cover {
      width: 110px;
      height: 130px;
      position: absolute;
      -webkit-transform: rotate(45deg);
              transform: rotate(45deg);
      left: -50px;
      top: -60px;
      -webkit-transition: 0.3s;
      transition: 0.3s;
      background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.08)), to(rgba(0, 0, 0, 0)));
      background: linear-gradient(left, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0));
      background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0)); }

@-webkit-keyframes slashMove {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(5%, -5%);
            transform: translate(5%, -5%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@keyframes slashMove {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(5%, -5%);
            transform: translate(5%, -5%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@-webkit-keyframes slashMove_rev {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(-5%, 5%);
            transform: translate(-5%, 5%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@keyframes slashMove_rev {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(-5%, 5%);
            transform: translate(-5%, 5%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@-webkit-keyframes houseMove_l {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(3%, -3%);
            transform: translate(3%, -3%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@keyframes houseMove_l {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(3%, -3%);
            transform: translate(3%, -3%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@-webkit-keyframes houseMove_l_rev {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(-3%, 3%);
            transform: translate(-3%, 3%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@keyframes houseMove_l_rev {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(-3%, 3%);
            transform: translate(-3%, 3%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@-webkit-keyframes buildMove_rev {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(-10%, 10%);
            transform: translate(-10%, 10%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@keyframes buildMove_rev {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0); }
  50% {
    -webkit-transform: translate(-10%, 10%);
            transform: translate(-10%, 10%); }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0); } }

@-webkit-keyframes boxScale {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  10% {
    -webkit-transform: scale(1.05);
            transform: scale(1.05); }
  20% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  30% {
    -webkit-transform: scale(1.05);
            transform: scale(1.05); }
  50%, 100% {
    -webkit-transform: scale(1);
            transform: scale(1); } }

@keyframes boxScale {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  10% {
    -webkit-transform: scale(1.05);
            transform: scale(1.05); }
  20% {
    -webkit-transform: scale(1);
            transform: scale(1); }
  30% {
    -webkit-transform: scale(1.05);
            transform: scale(1.05); }
  50%, 100% {
    -webkit-transform: scale(1);
            transform: scale(1); } }

@-webkit-keyframes change-color1 {
  0% {
    stop-color: #1ef0e6; }
  100% {
    stop-color: #2d8ddf; } }

@keyframes change-color1 {
  0% {
    stop-color: #1ef0e6; }
  100% {
    stop-color: #2d8ddf; } }

@-webkit-keyframes change-color2 {
  0% {
    stop-color: #2d8ddf; }
  100% {
    stop-color: #1ef0e6; } }

@keyframes change-color2 {
  0% {
    stop-color: #2d8ddf; }
  100% {
    stop-color: #1ef0e6; } }

@-webkit-keyframes bling {
  0% {
    opacity: 0.8; }
  50% {
    opacity: 0.5; }
  100% {
    opacity: 0.8; } }

@keyframes bling {
  0% {
    opacity: 0.8; }
  50% {
    opacity: 0.5; }
  100% {
    opacity: 0.8; } }

@-webkit-keyframes cloudMove1 {
  0% {
    background-position: 0 top; }
  100% {
    background-position: 4052px top; } }

@keyframes cloudMove1 {
  0% {
    background-position: 0 top; }
  100% {
    background-position: 4052px top; } }

@-webkit-keyframes cloudMove2 {
  0% {
    background-position: 0 top; }
  100% {
    background-position: 3850px top; } }

@keyframes cloudMove2 {
  0% {
    background-position: 0 top; }
  100% {
    background-position: 3850px top; } }

@-webkit-keyframes cloudMove3 {
  0% {
    background-position: 0 top; }
  100% {
    background-position: 3842px top; } }

@keyframes cloudMove3 {
  0% {
    background-position: 0 top; }
  100% {
    background-position: 3842px top; } }

@media screen and (max-width: 1500px) and (min-width: 1350px) {
  .island_area .island_center_box {
    width: 1100px; }
  .page_article .article_center {
    width: 1140px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box img {
      position: absolute;
      left: -5px;
      bottom: -5px;
      -webkit-transform: scale(0.8);
              transform: scale(0.8); }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .title {
      margin: 15px 10px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .math {
      margin: 10px 10px 10px 0px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .title {
      margin: 15px 10px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .math {
      margin: 10px 10px 10px 0px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .title {
      margin: 15px 10px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .math {
      margin: 10px 10px 10px 0px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .title {
      margin: 15px 10px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .math {
      margin: 10px 10px 10px 0px; } }

@media screen and (max-width: 1349px) {
  .cloud_area .main-visual {
    margin-top: 140px; } }

@media screen and (max-width: 1349px) and (min-width: 1024px) {
  .island_area .island_center_box {
    width: 900px; }
  .page_article .article_center {
    width: 940px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box img {
      position: absolute;
      left: -5px;
      bottom: -5px;
      -webkit-transform: scale(0.8);
              transform: scale(0.8); }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .title {
      margin: 20px 0px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .math {
      margin: 10px 10px 10px 0px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .title {
      margin: 20px 0px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .math {
      margin: 10px 10px 10px 0px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .title {
      margin: 20px 0px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .math {
      margin: 10px 10px 10px 0px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .title {
      margin: 20px 10px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .math {
      margin: 10px 10px 10px 0px; }
    .page_article .article_center .select-offer-area .offer-1 .offer_box .offer_center .offer_word h3 {
      margin: 10px 0px; }
      .page_article .article_center .select-offer-area .offer-1 .offer_box .offer_center .offer_word h3 span {
        display: block;
        width: 100%;
        margin: 0px; }
    .page_article .article_center .select-offer-area .offer-2 .offer_box .offer_center .offer_word h3 {
      margin: 10px 0px; }
      .page_article .article_center .select-offer-area .offer-2 .offer_box .offer_center .offer_word h3 span {
        display: block;
        width: 100%;
        margin: 0px; }
    .page_article .article_center .select-offer-area .offer-3 .offer_box .offer_center .offer_word h3 {
      margin: 10px 0px; }
      .page_article .article_center .select-offer-area .offer-3 .offer_box .offer_center .offer_word h3 span {
        display: block;
        width: 100%;
        margin: 0px; } }

@media screen and (max-width: 1023px) {
  .cloud_area .main-visual {
    margin-top: 86px; }
  .cloud_area .box {
    left: 38%; }
  .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .title {
    margin: 20px 0px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .title span {
      font-style: italic;
      margin: 0px 10px; }
  .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .math {
    margin: 10px 10px 10px 0px; }
  .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .title {
    margin: 20px 0px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .title span {
      font-style: italic;
      margin: 0px 10px; }
  .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .math {
    margin: 10px 10px 10px 0px; }
  .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .title {
    margin: 20px 0px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .title span {
      font-style: italic;
      margin: 0px 10px; }
  .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .math {
    margin: 10px 10px 10px 0px; }
  .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .title {
    margin: 20px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .title span {
      font-style: italic;
      margin: 0px 10px; }
  .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .math {
    margin: 10px 10px 10px 0px; } }

@media screen and (max-width: 1023px) and (min-width: 960px) {
  nav[aria-label="Breadcrumbs"] {
    width: 100%; }
  .island_area .island_center_box {
    width: calc(100% - 60px); }
  .page_article .article_center {
    width: calc(100% - 0px);
    padding: 15px; } }

@media screen and (max-width: 959px) and (min-width: 700px) {
  nav[aria-label="Breadcrumbs"] {
    width: 100%; }
  .island_area .island_center_box {
    width: calc(100% - 60px); }
  .page_article .article_center {
    width: calc(100% - 0px);
    padding: 15px; } }

@media screen and (max-width: 700px) {
  .cloud_area .main-visual {
    margin-top: 95px; }
  .cloud_area .box {
    left: 35%;
    top: -10%; }
  .cloud_area .cloud1 {
    top: 29vw; }
  .cloud_area .cloud2 {
    top: 33vw; }
  .cloud_area .cloud3 {
    top: 40vw; }
  .cloud_area .house1,
  .cloud_area .house2,
  .cloud_area .house3,
  .cloud_area .house4,
  .cloud_area .light1,
  .cloud_area .building1,
  .cloud_area .stop1,
  .cloud_area .stop2,
  .cloud_area .cloud3d,
  .cloud_area .dialog,
  .cloud_area .box,
  .cloud_area .light2,
  .cloud_area .light3 {
    -webkit-animation-iteration-count: 1;
            animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards; } }

@media screen and (max-width: 700px) and (min-width: 451px) {
  nav[aria-label="Breadcrumbs"] {
    width: 100%; }
  .island_area .island_center_box {
    width: calc(100% - 0px); }
  .page_article .article_center {
    width: calc(100% - 0px);
    padding: 15px; }
  .page_title {
    /* margin:20px auto 30px auto; padding:30px 0 70px 0; */
    margin: 20px auto 80px auto;
    padding: 50px 0; } }

@media screen and (max-width: 450px) {
  .cloud_area .main-visual {
    margin-top: 100px; }
  .cloud_area .box {
    left: 28%;
    top: -25%; }
  .page_article .article_center {
    width: 940px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .title {
      margin: 20px 0px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="92"] .math {
      margin: 10px 10px 10px 0px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .title {
      margin: 20px 0px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="95"] .math {
      margin: 10px 10px 10px 0px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .title {
      margin: 20px 0px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="98"] .math {
      margin: 10px 10px 10px 0px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .title {
      margin: 20px 10px; }
      .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .title span {
        font-style: italic;
        margin: 0px 10px; }
    .page_article .article_center .oil-area .oil-price-box .oil-box[oil-num="super"] .math {
      margin: 10px 10px 10px 0px; } }

@media screen and (max-width: 450px) {
  nav[aria-label="Breadcrumbs"] {
    width: 100%; }
  .island_area .island_center_box {
    width: calc(100% - 0px); }
  .page_article .article_center {
    width: calc(100% - 0px);
    padding: 15px; }
  .page_title {
    /* margin:20px auto 30px auto; padding:30px 0 70px 0; */
    margin: 20px auto 80px auto;
    padding: 50px 0; }
    .page_title.bottom {
      margin: 20px auto 0px auto;
      padding: 50px 0 0 0; } }