@charset "UTF-8";
/*-------------------------------------------------------------------------------*/
/*    helpers                                                                                   */
/*-------------------------------------------------------------------------------*/
.layoutContent {
  padding: 1rem;
  line-height: 1.5;
  color: #222222;
  font-family: "Microsoft Jhenghei", "微軟正黑體", "Trebuchet MS", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.layoutContent::after {
  content: "";
  display: table;
  clear: both;
}

.w_line {
  margin: 1.5rem 0;
}
.w_line_s1 {
  border-bottom: 1px solid #b8b8bf;
}
.w_line_s2 {
  border-bottom: 1px dashed #ada6a6;
}

/*-------------------------------------------------------------------------------*/
/*    Grid                                                                                        */
/*-------------------------------------------------------------------------------*/
.w_row {
  margin: 1rem 0;
  text-align: center;
}
.w_row::after {
  content: "";
  display: table;
  clear: both;
}
@media (min-width: 768px) {
  .w_row {
    margin: 1rem -1rem;
  }
}
.w_row_inside_img {
  text-align: center;
  margin-bottom: 1.25rem;
}
.w_row_inside::after {
  content: "";
  display: table;
  clear: both;
}
@media (min-width: 768px) {
  .w_row_inside {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.w_row img {
  text-align: center;
  vertical-align: bottom;
}

.w_baseline {
  -ms-flex-item-align: baseline;
      align-self: baseline;
}

.w_flex-start {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.w_start {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
}

.w_stretch {
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}

.w_half + .w_half {
  margin-top: 1rem;
}
.w_half.w_txt {
  margin-bottom: 0;
}
.w_half .w_txt {
  margin: 1rem 0;
}
@media (min-width: 768px) {
  .w_half {
    width: calc(49% - 2rem);
    margin: 0 1rem;
  }
  .w_half + .w_half {
    margin-top: 0;
  }
  .w_half-right {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}

.w_third .w_txt {
  margin: 1rem 0;
}
@media (min-width: 768px) {
  .w_third {
    width: calc(33% - 2rem);
    margin: 0 1rem 1rem;
  }
}
@media (min-width: 992px) {
  .w_third {
    width: 100%;
  }
}
@media (min-width: 1200px) {
  .w_third {
    width: calc(33% - 2rem);
    margin: 0 1rem 1rem;
  }
}

.w_col-LtxtRSimg,
.w_col-RtxtLSimg {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: 100%;
}

.w_col-LtxtRSimg .w_txt {
  margin-top: 1rem;
}
.w_col-LtxtRSimg .w_row_inside_img {
  width: 100%;
  margin: 0;
}

@media (min-width: 768px) {
  .w_col-LtxtRSimg,
.w_col-RtxtLSimg {
    margin: 1rem;
  }
  .w_col-LtxtRSimg .w_txt,
.w_col-RtxtLSimg .w_txt {
    width: 100%;
    margin-top: 0;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }

  .w_col-LtxtRSimg .w_txt {
    margin-right: 1rem;
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
  }

  .w_col-RtxtLSimg .w_txt {
    margin-left: 1rem;
  }
}
@media (min-width: 1200px) {
  .w_col-LtxtRSimg,
.w_col-RtxtLSimg {
    margin-top: 1rem !important;
  }

  .w_half.w_col-LtxtRSimg {
    width: calc(50% - 2rem);
  }
}
.w_BoxBorder .w_half {
  border: solid 1px #d3d0d0;
  padding: 1rem;
  border-radius: 0.25rem;
}

@media (min-width: 768px) {
  .w_row_inside_img.w_img-md {
    width: 300px;
  }

  .w_row_inside_img.w_img-sm {
    width: 150px;
  }
}
@media (min-width: 992px) {
  .w_row_inside_img.w_img-sm {
    width: 150px;
  }
}
.w_swf {
  position: relative;
  width: 100%;
  padding-bottom: 56%;
}
.w_swf object {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*-------------------------------------------------------------------------------*/
/*    title 標題樣式                                                             */
/*-------------------------------------------------------------------------------*/
.w_tit_h1 {
  font-size: 2.5em;
  color: #222222;
  font-weight: bold;
  line-height: 1.25;
  margin-bottom: 1rem;
}
.w_tit_h1 span {
  position: relative;
  display: inline-block;
  padding: 0.25rem;
  padding-left: 1.5rem;
}
.w_tit_h1 span:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 6px;
  height: 100%;
  border-radius: 1rem;
  background-color: #0069d2;
  background-image: -o-linear-gradient(315deg, #0069d2 0%, #40a1ec 100%);
  background-image: linear-gradient(135deg, #0069d2 0%, #40a1ec 100%);
}

.w_tit_h2 {
  font-size: 2.1875em;
  color: #222222;
  font-weight: bold;
  line-height: 1.35;
  margin-bottom: 1rem;
}
.w_tit_h2 span {
  display: block;
  position: relative;
  padding-bottom: 0.25rem;
  border-bottom: 3px dotted #d3d0d0;
}
.w_tit_h2 span:after {
  content: "";
  width: 100px;
  height: 5px;
  background-color: #0069d2;
  background-image: -o-linear-gradient(315deg, #0069d2 0%, #40a1ec 100%);
  background-image: linear-gradient(135deg, #0069d2 0%, #40a1ec 100%);
  position: absolute;
  left: 0;
  bottom: -5px;
  z-index: 1;
  border-radius: 3px;
}

.w_tit_h3 {
  font-size: 1.5625em;
  font-weight: bold;
  line-height: 1.35;
  margin-bottom: 1rem;
}
.w_tit_h3 span {
  display: inline-block;
  position: relative;
  z-index: 3;
  padding-bottom: 0.5rem;
  padding-left: 0.75rem;
}
.w_tit_h3 span:after {
  content: "";
  position: absolute;
  background: #d6e8ff;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  top: 1rem;
  left: 0;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
      transform: translateY(-50%);
  z-index: -1;
}

.w_tit_h4 {
  font-size: 2.1875em;
  font-weight: bold;
  line-height: 1.35;
  margin-bottom: 1rem;
  font-size: 1.25em !important;
}
.w_tit_h4 span {
  display: inline-block;
  position: relative;
  background: #f5f5f5;
  padding: 0.25rem 1rem 0.25rem 2rem;
  margin-left: 1rem;
  color: #474747;
  border-radius: 0 10px 10px 0;
}
.w_tit_h4 span:after {
  font-family: "FontAwesome";
  content: "\f075";
  display: inline-block;
  line-height: 40px;
  position: absolute;
  padding: 0em;
  color: white;
  background-color: #0069d2;
  background-image: -o-linear-gradient(315deg, #0069d2 0%, #40a1ec 100%);
  background-image: linear-gradient(135deg, #0069d2 0%, #40a1ec 100%);
  font-weight: normal;
  font-size: 1rem;
  width: 40px;
  text-align: center;
  height: 40px;
  line-height: 40px;
  left: -1rem;
  top: 1rem;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
      transform: translateY(-50%);
  border-radius: 50%;
  -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.29);
          box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.29);
}

.w_tit_h5 {
  font-size: 1.4375em;
  font-weight: bold;
  line-height: 1.35;
  margin-bottom: 0.5rem;
}
.w_tit_h5 span {
  display: inline-block;
  position: relative;
  padding-left: 1.5rem;
}
.w_tit_h5 span:before, .w_tit_h5 span:after {
  content: "";
  position: absolute;
  width: 1rem;
  height: 1rem;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}
.w_tit_h5 span:before {
  top: 0.25rem;
  left: 0;
  background: rgba(64, 161, 236, 0.5);
}
.w_tit_h5 span:after {
  top: 0.75rem;
  left: 0;
  background: rgba(77, 48, 152, 0.5);
}

.w_tit_h6 {
  font-size: 1.25em;
  font-weight: bold;
  line-height: 1.35;
  margin-bottom: 1rem;
}
.w_tit_h6 span {
  display: inline-block;
  position: relative;
  padding: 0.25rem 0.75rem;
  margin: 5px;
  background: -o-repeating-linear-gradient(135deg, #eef7ff, #eef7ff 4px, #d6e8ff 3px, #d6e8ff 8px);
  background: repeating-linear-gradient(-45deg, #eef7ff, #eef7ff 4px, #d6e8ff 3px, #d6e8ff 8px);
}

/*-------------------------------------------------------------------------------*/
/*    SubList                                                                                  */
/*-------------------------------------------------------------------------------*/
.w_sublist {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  margin: 1.5rem 0;
  counter-reset: num;
}

.w_sublist li {
  width: 100%;
  margin: 0.5rem;
}
.w_sublist li a {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  padding: 2rem 3rem 2rem 2.5rem;
  font-size: 1.5625em;
  color: white;
  background: url(../../images/wcm/w_sublist_bg.svg) bottom -6rem right -6rem no-repeat, #3c3c3c;
  border-radius: 0.25rem;
  overflow: hidden;
  -webkit-transition: 0.75s;
  -o-transition: 0.75s;
  transition: 0.75s;
  z-index: 1;
}
.w_sublist li a:after {
  counter-increment: num;
  content: counter(num, decimal-leading-zero) "";
  position: absolute;
  bottom: -2rem;
  left: -1rem;
  width: 5rem;
  font-size: 5rem;
  font-family: Arial, sans-serif;
  font-weight: 900;
  color: rgba(255, 255, 255, 0.05);
  z-index: -1;
}
.w_sublist li a:hover, .w_sublist li a:focus {
  background: url(../../images/wcm/w_sublist_bg.svg) bottom -1rem right -1rem no-repeat, #005bb5;
}
@media (min-width: 576px) {
  .w_sublist li {
    float: left;
    width: calc(49.95% - 1rem - 4px);
  }
}
@media (min-width: 1200px) {
  .w_sublist li {
    width: calc(33.3% - 1rem - 4px);
  }
}

/*-------------------------------------------------------------------------------*/
/*    Text                                                                                        */
/*-------------------------------------------------------------------------------*/
.w_txt {
  margin-bottom: 1.5rem;
  line-height: 1.5;
  text-align: left;
}
.w_txt ol, .w_txt ul {
  padding-left: 1.25rem;
  margin: 0.75rem 0;
}
.w_txt ol li, .w_txt ul li {
  line-height: 1.75;
}
.w_txt ol {
  list-style-type: decimal;
}
.w_txt ul {
  word-wrap: break-word;
  word-break: break-all;
}
.w_txt ul li {
  position: relative;
}
.w_txt ul li:before {
  content: "";
  position: absolute;
  top: 10px;
  left: -1rem;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #40a1ec;
}
.w_txt ul ul li {
  list-style-type: inherit;
}
.w_txt ul ul li:before {
  width: 6px;
  height: 6px;
  border: solid 1.5px #40a1ec;
  background: transparent;
}
.w_txt ul ul ul {
  list-style-type: circle;
}
.w_txt ul ol li {
  list-style-type: inherit;
}
.w_txt ul ol li:before {
  display: none;
}
.w_txt a {
  color: #1866bd;
  font-weight: bold;
  background: #d6e8ff;
}
.w_txt a:hover, .w_txt a:focus {
  color: #1e4aae;
  text-decoration: underline;
}
.w_txt hr {
  border: 0;
  border-bottom: 1px solid #b8b8bf;
}
.w_txt table {
  width: 100%;
  margin: 0.5em 0;
  border-collapse: collapse;
  border-spacing: 0;
  -webkit-box-shadow: 0 0.5rem 2rem rgba(0, 0, 0, 0.15);
          box-shadow: 0 0.5rem 2rem rgba(0, 0, 0, 0.15);
  border: solid 0.5px rgba(0, 62, 124, 0.115);
}
.w_txt table caption {
  padding: 0.5rem;
  color: #005bb5;
}
.w_txt table th, .w_txt table td {
  padding: 0.35rem;
  border: 1px solid #005bb5;
  text-align: center;
  vertical-align: middle;
  word-break: break-all;
  word-wrap: break-word;
}
.w_txt table th {
  color: white;
  background-color: #005bb5;
}

.w_txt_bg {
  padding: 1.5rem 1rem;
  background-color: #f5f5f5;
  border-radius: 0.25rem;
}

.w_txt_quoted {
  padding: 1.25rem;
  font-style: italic;
}
.w_txt_quoted span {
  display: block;
  position: relative;
  padding: 1.25rem 2rem 1.25rem 3rem;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-style: italic;
  background: #d6e8ff;
  -webkit-box-shadow: 0 5px 0.5rem rgba(0, 62, 124, 0.25);
          box-shadow: 0 5px 0.5rem rgba(0, 62, 124, 0.25);
  border-radius: 0.25rem;
}
.w_txt_quoted span:before {
  display: inline-block;
  position: absolute;
  top: 10px;
  left: -15px;
  width: 40px;
  height: 30px;
  text-align: center;
  content: "\f10d";
  font-family: FontAwesome;
  color: white;
  font-size: 18px;
  line-height: 30px;
  background: #0069d2;
  -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.14);
          box-shadow: 0 2px 2px rgba(0, 0, 0, 0.14);
  font-weight: 900;
}
.w_txt_quoted span:after {
  position: absolute;
  content: "";
  top: 40px;
  left: -15px;
  border: none;
  border-bottom: solid 8px transparent;
  border-right: solid 15px #003e7c;
}

.w_txt_column2 {
  -webkit-column-count: 1;
     -moz-column-count: 1;
          column-count: 1;
  -webkit-column-gap: 1.5rem;
     -moz-column-gap: 1.5rem;
          column-gap: 1.5rem;
}
@media (min-width: 576px) {
  .w_txt_column2 {
    -webkit-column-count: 2;
       -moz-column-count: 2;
            column-count: 2;
  }
}

.w_photo::after {
  content: "";
  display: table;
  clear: both;
}
.w_photo img {
  margin-bottom: 0.5rem;
}
@media (min-width: 576px) {
  .w_photo img {
    min-width: 35%;
    max-width: 50%;
  }
  .w_photo_right img {
    float: right;
    margin-left: 1rem;
  }
  .w_photo_left img {
    float: left;
    margin-right: 1rem;
  }
}

.w_table_even th, .w_table_even td {
  border: 0px !important;
}
.w_table_even tr:nth-child(even) {
  background-color: #d6e8ff;
}

@media print {
  .w_txt_column2 {
    -webkit-column-count: 2;
       -moz-column-count: 2;
            column-count: 2;
  }

  .w_photo img {
    min-width: 35%;
    max-width: 50%;
  }
  .w_photo_right img {
    float: right;
    margin-left: 0.5rem;
  }
  .w_photo_left img {
    float: left;
    margin-right: 0.5rem;
  }
}
/*-------------------------------------------------------------------------------*/
/*    Video                                                                                      */
/*-------------------------------------------------------------------------------*/
.w_video {
  width: 100%;
  margin: 0.5rem auto;
}
.w_video .templateLongText {
  display: block;
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
}
.w_video .templateLongText iframe, .w_video .templateLongText object, .w_video .templateLongText embed, .w_video .templateLongText video {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*-------------------------------------------------------------------------------*/
/*    btn 按鈕樣式                                                               */
/*-------------------------------------------------------------------------------*/
.w_btn {
  padding: 1rem 0;
  text-align: center;
}
.w_btn::after {
  content: "";
  display: table;
  clear: both;
}
.w_btn span {
  display: inline-block;
}
.w_btn a {
  border-radius: 5px;
  padding: 0.5rem 1rem;
  display: inline-block;
  text-align: center;
  margin: 0.25rem;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.w_btn a:focus {
  outline: 1px dotted #0074d3;
}
.w_btn p {
  display: inline-block;
}

.w_btn_row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.w_btn_row .w_btn {
  margin: 0.125rem;
}

.w_btn_s1 a {
  border: 2px solid #0074d3;
  color: white;
  background: #0074d3;
}
.w_btn_s1 a:hover, .w_btn_s1 a:focus {
  background: #0058a0;
  border: 2px solid #0058a0;
}

.w_btn_s2 a {
  border: 2px solid #0074d3;
  color: #0074d3;
}
.w_btn_s2 a:hover, .w_btn_s2 a:focus {
  color: white;
  background: #0058a0;
  border: 2px solid #0058a0;
}

.w_btn_s3 a {
  color: white;
  background-color: #0069d2;
  background-image: -o-linear-gradient(315deg, #0069d2 0%, #40a1ec 100%);
  background-image: linear-gradient(135deg, #0069d2 0%, #40a1ec 100%);
}
.w_btn_s3 a:hover, .w_btn_s3 a:focus {
  background-color: #40a1ec;
  background-image: -o-linear-gradient(315deg, #40a1ec 0%, #005bb5 100%);
  background-image: linear-gradient(135deg, #40a1ec 0%, #005bb5 100%);
}

.w_btn_s4 a {
  color: #222222;
  background-color: #ffcc02;
  background-image: -o-linear-gradient(315deg, #ffcc02 0%, #ffa350 100%);
  background-image: linear-gradient(135deg, #ffcc02 0%, #ffa350 100%);
}
.w_btn_s4 a:hover, .w_btn_s4 a:focus {
  background-color: #ff8207;
  background-image: -o-linear-gradient(315deg, #ff8207 0%, #ffcc02 100%);
  background-image: linear-gradient(135deg, #ff8207 0%, #ffcc02 100%);
}

.w_sitemap_inner {
  margin-top: 2rem;
}
.w_sitemap_inner a {
  display: block;
}
.w_sitemap_inner a:hover, .w_sitemap_inner a:focus {
  color: #005bb5;
  padding-left: 1rem;
  -webkit-transition: padding 0.5s ease;
  -o-transition: padding 0.5s ease;
  transition: padding 0.5s ease;
}
@media (min-width: 576px) {
  .w_sitemap_inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    margin-left: -0.75rem;
    margin-right: -0.75rem;
  }
}

.site_tit1 {
  font-size: 1.25em;
  font-weight: bold;
  border-bottom: 1px solid #0074d3;
}
.site_tit1 a {
  padding: 0.5rem 0;
  color: #0074d3;
}

.site_item2 {
  margin-top: 0.5rem;
}
.site_item2 a {
  padding: 0.125rem 0;
  color: #404040;
}
.site_item2 a:hover, .site_item2 a:focus {
  padding-left: 1rem;
  -webkit-transition: padding 0.5s ease;
  -o-transition: padding 0.5s ease;
  transition: padding 0.5s ease;
}

@media (min-width: 576px) {
  .site_item1 {
    width: 50%;
    padding: 1rem 0.75rem 0;
  }

  .site_item2 ul {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    padding-left: 1rem;
  }
}
@media print {
  .w_sitemap_inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    margin-left: -0.75rem;
    margin-right: -0.75rem;
  }

  .site_item1 {
    width: 50%;
    padding: 1rem 0.75rem 0;
  }

  .site_item2 ul {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    padding-left: 1rem;
  }
}
/*-------------------------------------------------------------------------------*/
/*    線軸樣式  

01-基本樣式
02-大標題
03-純內文
04-中標加內文
05-圖文-右圖左文
06-圖文-左圖右文
07-icon標題

/*-------------------------------------------------------------------------------*/
.w_LineAxis_row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  padding: 0.5rem 0.25rem 0.5rem 1rem;
  border-left: 3px solid #9e9e9e;
}
.w_LineAxis_title-H1 {
  font-size: 2.1875em;
  color: #222222;
  font-weight: bold;
  line-height: 1.25;
}
.w_LineAxis_title-H1:before {
  content: "";
  position: absolute;
  top: 17px;
  left: -10px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: none repeat scroll 0% 0% white;
  border: 3px solid #40a1ec;
}
.w_LineAxis_title-H2 {
  display: block;
  width: 100%;
  font-size: 1.5625em;
  color: #222222;
  font-weight: bold;
}
.w_LineAxis_col {
  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;
}
.w_LineAxis_col-border {
  padding: 1rem;
  border: solid 1px #b8b8bf;
  border-radius: 0.25rem;
}
.w_LineAxis_col-border:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0px;
  width: 17px;
  height: 1px;
  background: #b8b8bf;
}
.w_LineAxis_col-LtxtRimg {
  width: 100%;
}
.w_LineAxis_col-LtxtRimg .w_row_inside_img {
  margin: 0;
}
.w_LineAxis_col-LtxtRimg .w_txt {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  margin-top: 1rem;
}
@media (min-width: 576px) {
  .w_LineAxis_col-LtxtRimg .w_txt {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
    margin-right: 1rem;
  }
}
.w_LineAxis_col-RtxtLimg {
  width: 100%;
}
.w_LineAxis_col-RtxtLimg .w_row_inside_img {
  margin: 0;
}
.w_LineAxis_col-RtxtLimg .w_txt {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  margin-top: 1rem;
}
@media (min-width: 576px) {
  .w_LineAxis_col-RtxtLimg .w_txt {
    margin-left: 1rem;
  }
}
.w_LineAxis_icon {
  color: white;
  padding: 0.5rem 1rem;
}
.w_LineAxis_icon .w_txt {
  margin: 0;
}
.w_LineAxis_icon a {
  color: white;
  text-decoration: underline;
}
.w_LineAxis_icon a:hover, .w_LineAxis_icon a:focus {
  color: #d6e8ff;
}
.w_LineAxis_icon-i {
  font-size: 2.5em;
  padding-right: 0.5rem;
  margin-top: -0.25rem;
}
.w_LineAxis_col-bg {
  background: #0074d3;
  border-radius: 0.25rem;
}
.w_LineAxis_continued {
  padding-top: 5rem;
  margin-bottom: 2rem;
}
.w_LineAxis_continued:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: -10px;
  width: 18px;
  height: 100px;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(60%, white));
  background: -o-linear-gradient(top, transparent 0, white 60%);
  background: linear-gradient(to bottom, transparent 0, white 60%);
}
.w_LineAxis_end {
  padding-top: 3rem;
  margin-bottom: 2rem;
}
.w_LineAxis_end:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: -10px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: none repeat scroll 0% 0% #40a1ec;
  border: 3px solid #40a1ec;
}

/*-------------------------------------------------------------------------------*/
/*    步驟樣式  

01-基本框架
02-第一樣式

/*-------------------------------------------------------------------------------*/
.w_stepstyle_row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  margin: 1rem 0;
}

.w_stepstyle_style01 .w_stepstyle_num {
  color: #005bb5;
  font-size: 2.5em;
  font-family: Arial, sans-serif;
  font-weight: 900;
  padding-right: 0.75rem;
  margin-top: -0.25rem;
}
@media (min-width: 768px) {
  .w_stepstyle_style01 .w_stepstyle_num {
    font-size: 5.625em;
    padding-right: 1rem;
    margin-top: -1.75rem;
  }
}

/*-------------------------------------------*\
	spring.scss

	Index
  - 1.wrapper
  - 2.owl-dots
  - 3.item
  - 4.hide
\*-------------------------------------------*/
.sp01 {
  text-align: center;
}

.sp-mt {
  margin-top: 4rem;
}

.sp01-tit {
  margin-bottom: -38px;
}

.sp01-content {
  padding: 3.5rem;
  background-image: url(../../images/spring/spbg-angle-top-left.JPG), url(../../images/spring/spbg-angle-top-rigth.JPG), url(../../images/spring/spbg-angle-bottom-left.JPG), url(../../images/spring/spbg-angle-bottom-rigth.JPG), url(../../images/spring/spbg-line-top.JPG), url(../../images/spring/spbg-line-right.JPG), url(../../images/spring/spbg-line-bottom.JPG), url(../../images/spring/spbg-line-left.JPG);
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat-x, repeat-y, repeat-x, repeat-y;
  background-position: top left, top right, bottom left, bottom right, top left, top right, bottom left, top left;
}
.sp01-content .sp-txt-lg {
  margin-top: 1rem;
}
.sp01-content .sp-txt {
  max-width: 540px;
}

.sp-txt {
  margin: 0 auto;
  color: #404040;
  font-size: 1.125em;
  line-height: 1.5;
  text-align: left;
}
.sp-txt + .sp-txt {
  margin-top: 1rem;
}

.sp-txt-lg {
  color: #404040;
  font-weight: bold;
  font-size: 1.4375em;
  line-height: 1.5;
}

.sp-txt-red {
  display: inline-block;
  color: #ff4747;
}
.sp-txt-red-lg {
  font-size: 1.304em;
}
.sp-txt-red-af {
  position: relative;
}
.sp-txt-red-af::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  z-index: -1;
  width: 85%;
  height: 65%;
  background-color: #f9d7dc;
  -webkit-transform: rotate(-2deg);
      -ms-transform: rotate(-2deg);
          transform: rotate(-2deg);
}

.sp02-tit {
  position: relative;
  max-width: 660px;
  margin: 0 auto;
  text-align: center;
  line-height: 1.5;
}
@media (min-width: 768px) {
  .sp02-tit::before, .sp02-tit::after {
    content: "";
    display: inline-block;
    position: absolute;
    z-index: -1;
    top: 50%;
    background-repeat: no-repeat;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  .sp02-tit::before {
    left: 0;
    width: 95px;
    height: 62px;
    background-image: url(../../images/spring/sp02-tit-icon01.png);
    background-position: left center;
  }
  .sp02-tit::after {
    right: 0;
    width: 88px;
    height: 75px;
    background-image: url(../../images/spring/sp02-tit-icon02.png);
    background-position: right center;
  }
}

.sp02-content {
  margin-top: 1rem;
}
@media (min-width: 768px) {
  .sp02-content {
    position: relative;
    margin-top: -4rem;
    padding-top: 6rem;
    padding-left: 300px;
    padding-right: 50px;
    background-image: url(../../images/spring/sp02-pic02.png);
    background-repeat: no-repeat;
  }
}
.sp02-content .sp-txt-lg {
  margin-top: 1.5rem;
}

.sp03 {
  position: relative;
  padding-top: 24%;
  padding-right: 22%;
}
.sp03-pic {
  position: absolute;
  top: 0;
  width: 100%;
}
@media (min-width: 768px) {
  .sp03 {
    padding-bottom: 225px;
  }
  .sp03::before, .sp03::after {
    content: "";
    display: block;
    position: absolute;
    z-index: 1;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .sp03::before {
    left: -3rem;
    bottom: 320px;
    background-image: url(../../images/spring/sp03-pic02.png);
    width: 172px;
    height: 238px;
  }
  .sp03::after {
    bottom: 0;
    right: 7%;
    width: 239px;
    height: 459px;
    background-image: url(../../images/spring/sp03-pic03.png);
  }
}
@media (min-width: 1600px) {
  .sp03::before {
    left: -2rem;
  }
}

.sp03-content {
  padding: 60% 1rem 2rem 10%;
  border: 3px dotted #ff4747;
}
@media (min-width: 768px) {
  .sp03-content {
    padding-right: 90px;
  }
}

.sp04 {
  position: relative;
  padding-top: 30px;
  padding-left: 2rem;
}
.sp04-pic {
  position: absolute;
  top: 0;
  left: 0;
}
@media (min-width: 768px) {
  .sp04-pic {
    width: 50%;
  }
}
@media (min-width: 1600px) {
  .sp04-pic {
    width: 481px;
  }
}
@media (min-width: 768px) {
  .sp04 {
    padding-left: 25%;
    padding-bottom: 500px;
  }
  .sp04::before, .sp04::after {
    content: "";
    display: block;
    position: absolute;
    z-index: 1;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .sp04::before {
    top: -85px;
    right: 2rem;
    width: 172px;
    height: 166px;
    background-image: url(../../images/spring/sp04-pic02.png);
  }
  .sp04::after {
    right: 0;
    top: 320px;
    width: 486px;
    height: 550px;
    background-image: url(../../images/spring/sp04-pic03.png);
  }
}
@media (min-width: 1600px) {
  .sp04 {
    padding-bottom: 450px;
  }
}

.sp04-content {
  padding: 125% 1rem 2rem 10%;
  border: 3px dotted #ff4747;
}
@media (min-width: 768px) {
  .sp04-content {
    padding: 90px 2rem 160px 40%;
  }
}
@media (min-width: 1600px) {
  .sp04-content {
    padding-left: 48%;
  }
}

.sp04-tit {
  margin-top: 2rem;
}
.sp04-tit p {
  display: inline;
}
.sp04-tit p:nth-child(1)::before {
  content: "";
  display: inline-block;
  width: 70px;
  height: 65px;
  background-image: url(../../images/spring/sp04-pic04.png);
}
@media (min-width: 768px) {
  .sp04-tit {
    position: absolute;
    left: 0;
    bottom: 0;
  }
  .sp04-tit p {
    display: inline-block;
  }
  .sp04-tit p:nth-child(2) {
    padding-left: 11em;
  }
}

.sp05-content {
  margin-top: -60px;
  padding-right: 25%;
}
@media (min-width: 576px) {
  .sp05-content {
    margin-top: -100px;
  }
}
@media (min-width: 768px) {
  .sp05-content {
    margin-top: -140px;
  }
}

.sp05-tit {
  position: relative;
  margin-top: 1rem;
  padding-right: 50px;
}
.sp05-tit p {
  display: inline;
}
.sp05-tit::after {
  content: "";
  display: inline-block;
  position: absolute;
  right: 0;
  bottom: 50%;
  width: 70px;
  height: 70px;
  background-image: url(../../images/spring/sp05-pic02.png);
  -webkit-transform: translateY(50%);
      -ms-transform: translateY(50%);
          transform: translateY(50%);
}
@media (min-width: 768px) {
  .sp05-tit {
    max-width: 500px;
  }
  .sp05-tit p {
    display: inline-block;
  }
  .sp05-tit p:nth-child(2) {
    padding-left: 6em;
  }
}
@media (min-width: 1200px) {
  .sp05-tit {
    padding-left: 4em;
    max-width: 580px;
  }
}

.sp06 {
  position: relative;
  margin-bottom: 2rem;
  padding-bottom: 150px;
}
.sp06::after {
  content: "";
  display: inline-block;
  position: absolute;
  left: calc(50% - 40px);
  bottom: 0;
  width: 80px;
  height: 80px;
  background-image: url(../../images/spring/sp06-pic04.png);
}

.sp06-content {
  padding: 1rem;
}
@media (min-width: 992px) {
  .sp06-content {
    width: 80%;
    margin: 0 auto;
  }
}

.sp06-tit {
  position: relative;
  margin-top: 2rem;
  padding-left: 50px;
  padding-right: 70px;
}
.sp06-tit p {
  display: inline;
}
.sp06-tit::before, .sp06-tit::after {
  content: "";
  display: inline-block;
  position: absolute;
  z-index: -1;
  top: 50%;
  background-repeat: no-repeat;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
.sp06-tit::before {
  left: 0;
  width: 95px;
  height: 62px;
  background-image: url(../../images/spring/sp06-pic02.png);
  background-position: left center;
}
.sp06-tit::after {
  right: 0;
  width: 88px;
  height: 75px;
  background-image: url(../../images/spring/sp06-pic03.png);
  background-position: right center;
}
@media (min-width: 992px) {
  .sp06-tit {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media (min-width: 1200px) {
  .sp06-tit p {
    display: block;
  }
  .sp06-tit p:nth-child(2) {
    text-align: right;
  }
}

/*-------------------------Ray 新增wcm 樣式開始---------------------------*/
.layoutContent {
  overflow: hidden;
  padding: 1rem;
  font-family: "Microsoft Jhenghei", "微軟正黑體", "Trebuchet MS", Arial, Helvetica, sans-serif;
  line-height: 1.5;
  color: #555555;
}

/*---------標題樣式設定開始---------*/
.wcm-title {
  float: left;
  width: 100%;
  padding-left: 35px;
  background-repeat: no-repeat;
  font-family: "微軟正黑體";
  font-size: 130%;
  background-position: 5px 4px;
  margin-bottom: 15px;
  line-height: 23px;
}

.wcm-icon-color01 {
  background-image: url(../../../images/wcm-title-icon01.svg);
}

.wcm-icon-color02 {
  background-image: url(../../../images/wcm-title-icon02.svg);
}

.wcm-icon-color03 {
  background-image: url(../../../images/wcm-title-icon03.svg);
}

.wcm-icon-color04 {
  background-image: url(../../../images/wcm-title-icon04.svg);
}

.wcm-icon-color05 {
  background-image: url(../../../images/wcm-title-icon05.svg);
}

.wcm-icon-color06 {
  background-image: url(../../../images/wcm-title-icon06.svg);
}

.wcm-icon-color07 {
  background-image: url(../../../images/wcm-title-icon07.svg);
}

/*---------標題樣式設定結束---------*/
/*---------純文字設定開始-----------*/
.wcm-text-data {
  float: left;
  width: 100%;
  margin-bottom: 20px;
}

/*---------純文字設定結束-----------*/
/*---------編輯器清單設定開始--------*/
.wcm-text-data ol,
.wcm-text-data ul,
.wcm-table ol,
.wcm-table ul {
  padding-left: 1.5em;
}

.wcm-text-data ol,
.wcm-table ol {
  list-style-type: decimal;
}

.wcm-text-data ul,
.wcm-table ul,
.wcm-text-data ol li,
.wcm-text-data ul li,
.wcm-table ol li,
.wcm-table ul li {
  list-style-type: inherit;
}

.wcm-text-data a,
.wcm-table a {
  color: #0099FF;
  text-decoration: underline;
}

.wcm-text-data a:hover,
.wcm-table a:hover {
  color: #0066FF;
}

/*---------編輯器清單設定結束-------*/
/*--------------------------------圖文設定開始----------------------------------*/
/*純圖*/
.wcm-photo {
  float: left;
  width: 100%;
  text-align: center;
  padding-bottom: 2%;
}

.wcm-photo img {
  float: none;
  vertical-align: inherit;
}

/*純圖*/
/*左圖右文+左文右圖*/
.wcm-viewbox {
  float: left;
  width: 100%;
  padding-bottom: 2%;
}

.wcm-photoL,
.wcm-textR,
.wcm-photoR,
.wcm-textL {
  float: left;
  width: 48%;
  padding-right: 1%;
  padding-left: 1%;
}

.wcm-photoL,
.wcm-photoR {
  text-align: center;
}

.wcm-photoL img,
.wcm-photoR img {
  float: none;
}

/*左圖右文+左文右圖*/
/*文繞左、右圖*/
.wcmphotoLr img {
  display: inline-block;
  min-width: 35%;
  max-width: 50%;
  float: left;
  padding-right: 15px;
  padding-bottom: 10px;
}

.wcmphotoRr img {
  display: inline-block;
  min-width: 35%;
  max-width: 50%;
  float: right;
  padding-left: 15px;
  padding-bottom: 10px;
}

/*文繞左、右圖*/
@media only screen and (min-width: 0px) and (max-width: 580px) {
  .wcm-photoL,
.wcm-textR,
.wcm-photoR,
.wcm-textL {
    float: left;
    width: 100%;
    padding-right: 0%;
    padding-left: 0%;
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .wcmphotoLr img,
.wcmphotoRr img {
    min-width: auto;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}
/*------------------------------------圖文設定結束-----------------------------------*/
/*------------表格設定--------------*/
/*基本款*/
.wcm-table table {
  float: left;
  width: 100%;
  margin-bottom: 3%;
}

.wcm-table table caption {
  padding: 5px;
  width: 100%;
  color: #ffffff;
}

.wcm-table table,
.wcm-table td,
.wcm-table th {
  border: solid 1px #585858;
  text-align: center;
  word-wrap: break-word;
  word-break: normal;
}

.wcm-table td,
.wcm-table th {
  padding: 5px;
}

.wcm-table th {
  background-color: rgb(204, 204, 204);
}

.wcm-odd tr:nth-child(odd) {
  background: #f4f4f4;
}

/*基本款*/
/*樣式一(藍)*/
.wcm-table-style01 caption {
  background-color: #62c0ff;
}

.wcm-table-style01 table,
.wcm-table-style01 td,
.wcm-table-style01 th {
  border-color: #c6f2ea;
}

.wcm-table-style01 th {
  background-color: #9ae1eb;
}

/*樣式一*/
/*樣式二(靛)*/
.wcm-table-style02 caption {
  background-color: #788dd8;
}

.wcm-table-style02 table,
.wcm-table-style02 td,
.wcm-table-style02 th {
  border-color: #c0cff5;
}

.wcm-table-style02 th {
  background-color: #abbaeb;
}

/*樣式二*/
/*樣式三(紫)*/
.wcm-table-style03 caption {
  background-color: #b18abf;
}

.wcm-table-style03 table,
.wcm-table-style03 td,
.wcm-table-style03 th {
  border-color: #ead5f2;
}

.wcm-table-style03 th {
  background-color: #ebc1fa;
}

/*樣式三*/
/*樣式四(紅)*/
.wcm-table-style04 caption {
  background-color: #f69aa9;
}

.wcm-table-style04 table,
.wcm-table-style04 td,
.wcm-table-style04 th {
  border-color: #ffe2e7;
}

.wcm-table-style04 th {
  background-color: #ffd5dc;
}

/*樣式四*/
/*樣式五(橙)*/
.wcm-table-style05 caption {
  background-color: #fca164;
}

.wcm-table-style05 table,
.wcm-table-style05 td,
.wcm-table-style05 th {
  border-color: #ffe7d6;
}

.wcm-table-style05 th {
  background-color: #ffd9c1;
}

/*樣式五*/
/*樣式六(黃)*/
.wcm-table-style06 caption {
  background-color: #f7c856;
}

.wcm-table-style06 table,
.wcm-table-style06 td,
.wcm-table-style06 th {
  border-color: #ffefbd;
}

.wcm-table-style06 th {
  background-color: #ffe6aa;
}

/*樣式六*/
/*樣式七(綠)*/
.wcm-table-style07 caption {
  background-color: #b4dd44;
}

.wcm-table-style07 table,
.wcm-table-style07 td,
.wcm-table-style07 th {
  border-color: #e7f8bb;
}

.wcm-table-style07 th {
  background-color: #d5f384;
}

/*樣式七*/
/*------------表格設定--------------*/
/*------------輔助設定--------------*/
/*分隔線*/
.wcm-line {
  float: left;
  height: 1px;
  width: 100%;
  margin-bottom: 3%;
  background-repeat: repeat-x;
  background-position: left center;
}

.wcmlinestyle01 {
  background-image: url(../../../images/wcm-line01.gif);
}

/*(實線)*/
.wcmlinestyle02 {
  background-image: url(../../../images/wcm-line02.gif);
}

/*(虛線)*/
/*分隔線*/
/*------------輔助設定--------------*/
/*------------影片設定--------------*/
.w_video {
  width: 100%;
  margin: 0.5rem auto;
}

.w_video.templateLongText {
  display: block;
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
}

.w_video.templateLongText iframe,
.w_video.templateLongText object,
.w_video.templateLongText embed,
.w_video.templateLongText video {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*------------影片設定--------------*/
/*-------------------------Ray 新增wcm 樣式結束---------------------------*/
.wcm-line,
.wcm-photo,
.wcm-title,
.wcm-text-data,
.wcm-viewbox {
  float: none;
}
.wcm-line::after,
.wcm-photo::after,
.wcm-title::after,
.wcm-text-data::after,
.wcm-viewbox::after {
  content: "";
  display: table;
  clear: both;
}

/*-------------------------------------------------------------------------------*/
/* 引用樣式                                                                       */
/*-------------------------------------------------------------------------------*/
.wcm-BlockQuoteV01 {
  position: relative;
  z-index: 0;
  margin: 1rem 0;
  padding: 1rem 2rem;
  border-left: 3px solid #0074d3;
}
.wcm-BlockQuoteV01:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -4px;
  height: 2em;
  background-color: white;
  width: 5px;
  margin-top: -1em;
}
.wcm-BlockQuoteV01:after {
  content: "\f10e";
  position: absolute;
  top: 50%;
  left: -0.5em;
  color: #0074d3;
  font: normal normal normal 1rem/1 FontAwesome;
  font-style: normal;
  font-weight: 900;
  width: 1em;
  margin-top: -0.75rem;
  -webkit-transition: 0.2s all ease-in-out, 0.4s -webkit-transform ease-in-out;
  transition: 0.2s all ease-in-out, 0.4s -webkit-transform ease-in-out;
  -o-transition: 0.2s all ease-in-out, 0.4s transform ease-in-out;
  transition: 0.2s all ease-in-out, 0.4s transform ease-in-out;
  transition: 0.2s all ease-in-out, 0.4s transform ease-in-out, 0.4s -webkit-transform ease-in-out;
}
.wcm-BlockQuoteV01:active:after {
  -webkit-transform: rotateY(360deg);
          transform: rotateY(360deg);
}

.wcm-BlockQuoteV02 {
  margin: 1rem 0;
  padding: 1rem 2rem;
  background: #f5f5f5;
  border-left: 5px solid #0074d3;
}

.wcm-BlockQuoteV03 {
  position: relative;
  margin: 2rem 1rem;
  padding: 2.5rem 2rem !important;
  border: 2px solid #0074d3;
  border-radius: 0.25rem;
}
.wcm-BlockQuoteV03:before, .wcm-BlockQuoteV03:after {
  content: "\f10d";
  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;
  position: absolute;
  width: 40px;
  height: 40px;
  color: black;
  font: normal normal normal 1rem/1 FontAwesome;
  background: #0074d3;
  border-radius: 50%;
}
.wcm-BlockQuoteV03:before {
  top: -20px;
  left: -20px;
}
.wcm-BlockQuoteV03:after {
  bottom: -20px;
  right: -20px;
  -webkit-transform: rotate(-180deg);
      -ms-transform: rotate(-180deg);
          transform: rotate(-180deg);
}

/*-------------------------------------------------------------------------------*/
/* 步驟樣式                                                                       */
/*-------------------------------------------------------------------------------*/
div[class*=wcm-Step] .wcm-StepNum {
  width: 100%;
  margin-bottom: 0.5rem;
  text-align: center;
}
div[class*=wcm-Step] .kf-det-center {
  width: 100%;
}
@media (min-width: 768px) {
  div[class*=wcm-Step] .wcm-StepNum {
    width: auto;
    margin-bottom: 0;
    margin-right: 1rem;
  }
  div[class*=wcm-Step] .kf-det-center {
    width: auto;
  }
}

.wcm-StepV01 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media (max-width: 767px) {
  .wcm-StepV01 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.wcm-StepV01 .wcm-StepNum {
  font-size: 2.5em;
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
  font-weight: bold;
}

.wcm-StepV02 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media (max-width: 767px) {
  .wcm-StepV02 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.wcm-StepV02 .wcm-StepNum {
  color: white;
  font-weight: bold;
  font-family: Arial, sans-serif;
}
.wcm-StepV02 .wcm-StepNum p {
  display: inline-block;
  padding: 0.25rem 0.75rem !important;
  background: #0074d3;
  border-radius: 2rem;
}

/*-------------------------------------------*\
	ImgText.scss

	Index
  - 1.wrap
\*-------------------------------------------*/
@media (min-width: 768px) {
  .wcm-DiagramText {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.DiagramText-img img {
  vertical-align: bottom;
}
@media (max-width: 767px) {
  .DiagramText-col, .DiagramText-img {
    margin-bottom: 1rem;
  }
}
@media (min-width: 768px) {
  .DiagramText-col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 50%;
  }
  .DiagramText-col [class^=DiagramText] {
    padding: 0.5rem;
  }
  .DiagramText-reverse {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
  }
  .DiagramText-img {
    width: 40%;
  }
  .DiagramText-txt {
    width: 60%;
  }
}