@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 100;
  src: url(https://fonts.gstatic.com/s/notosanstc/v26/-nFlOG829Oofr2wohFbTp9i9WxEIK_E.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 300;
  src: url(https://fonts.gstatic.com/s/notosanstc/v26/-nFkOG829Oofr2wohFbTp9i9kwMfDNdX.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/notosanstc/v26/-nF7OG829Oofr2wohFbTp9i1OCEJ.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 500;
  src: url(https://fonts.gstatic.com/s/notosanstc/v26/-nFkOG829Oofr2wohFbTp9i9ywIfDNdX.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/s/notosanstc/v26/-nFkOG829Oofr2wohFbTp9i9gwQfDNdX.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans TC';
  font-style: normal;
  font-weight: 900;
  src: url(https://fonts.gstatic.com/s/notosanstc/v26/-nFkOG829Oofr2wohFbTp9i9uwYfDNdX.otf) format('opentype');
}

#promise .promise-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 3em; }
  @media (max-width: 960px) {
    #promise .promise-content {
      display: inherit; } }
  #promise .promise-content .promise-img {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 47%;
            flex: 0 0 47%;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat; }
    @media (max-width: 960px) {
      #promise .promise-content .promise-img {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 100%;
                flex: 0 0 100%;
        padding-bottom: 57.35%; } }
  #promise .promise-content .promise-text {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 53%;
            flex: 0 0 53%;
    background-image: url("../images/promise/bg-promise.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom right;
    padding: 7.5% 0 7.5% 3.3%; }
    @media (max-width: 960px) {
      #promise .promise-content .promise-text {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 100%;
                flex: 0 0 100%;
        padding: 12% 6%;
        margin-top: -4px; } }
    #promise .promise-content .promise-text .promise-title {
      margin-bottom: 18px; }
      @media (max-width: 960px) {
        #promise .promise-content .promise-text .promise-title {
          margin-bottom: 10px; } }
      #promise .promise-content .promise-text .promise-title img {
        display: inline-block;
        vertical-align: middle;
        width: 85px; }
        @media (max-width: 960px) {
          #promise .promise-content .promise-text .promise-title img {
            width: 35px; } }
      #promise .promise-content .promise-text .promise-title h2 {
        color: #00aad2;
        font-size: 3.125rem;
        display: inline-block;
        vertical-align: middle; }
        @media (max-width: 960px) {
          #promise .promise-content .promise-text .promise-title h2 {
            font-size: 1.125rem; } }
    #promise .promise-content .promise-text p {
      width: 63%;
      color: #fff;
      font-size: 1.5625rem;
      padding-left: 30px;
      text-align: justify;
      line-height: 1.6;
      position: relative; }
      @media (max-width: 960px) {
        #promise .promise-content .promise-text p {
          font-size: 0.75rem;
          padding-left: 12px;
          width: 94%; } }
      #promise .promise-content .promise-text p:before {
        content: '';
        display: inline-block;
        vertical-align: middle;
        position: absolute;
        top: 4%;
        bottom: auto;
        right: auto;
        left: 0;
        width: 3px;
        height: 96%;
        background: #00aad2; }
        @media (max-width: 960px) {
          #promise .promise-content .promise-text p:before {
            width: 1px;
            left: 3px; } }
    #promise .promise-content .promise-text .ps {
      width: 63%;
      padding-left: 30px;
      font-size: 1.25rem;
      color: #898989;
      display: block;
      margin-top: 1rem;
      line-height: 1.6; }
      @media (max-width: 960px) {
        #promise .promise-content .promise-text .ps {
          width: 94%;
          font-size: 0.5625rem; } }
  #promise .promise-content .flex_table {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 63%;
    background: rgba(255, 255, 255, 0.7);
    margin: 2rem; }
    @media (max-width: 960px) {
      #promise .promise-content .flex_table {
        width: 100%;
        margin: 2rem 0; } }
    #promise .promise-content .flex_table .item {
      width: 100%;
      text-align: center; }
      #promise .promise-content .flex_table .item li {
        border: 1px solid #002c5f;
        color: #002c5f;
        font-size: 1.5625rem;
        padding: 0.25em 0; }
        @media (max-width: 960px) {
          #promise .promise-content .flex_table .item li {
            font-size: 0.75rem; } }
        #promise .promise-content .flex_table .item li:first-child {
          color: #fefeff;
          background: #00aad2; }
