@charset "UTF-8";
/*------------------------------------*\
    $CONTENTS
\*------------------------------------*/
/**
 * CONTENTS............You're reading it!
 * TYPOGRAPHY..........Including global settings, headings, body text, lists, and more
 * COLOR...............Font color & background color
 * RESET...............Set our reset defaults
 */
/*------------------------------------*\
    $TYPOGRAPHY
\*------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100;300;400;500;700&family=Roboto:wght@300;400;500;700&display=swap");
.papiin_heading01 {
  font-size: 58px;
  line-height: 1.3;
  font-weight: 700;
}

.papiin_heading02 {
  font-size: 46px;
  line-height: 1.3;
  font-weight: 700;
}

.papiin_heading03 {
  font-size: 36px;
  line-height: 1.3;
  font-weight: 700;
}

.papiin_body1_bold {
  font-size: 20px;
  line-height: 1.3;
  font-weight: 700;
}

/*------------------------------------*\
    $COLOR
\*------------------------------------*/
/*------------------------------------*\
    $RESET
\*------------------------------------*/
html, body {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 560px;
  font-size: 16px;
  font-family: Roboto, "Noto Sans TC", "Century Gothic", Helvetica, Arial, Verdana, 新細明體;
}

img {
  width: 100%;
}

.clearfix::after {
  display: block;
  clear: both;
  content: "";
}

ul {
  -webkit-padding-start: 1rem;
          padding-inline-start: 1rem;
}

li {
  margin-bottom: 1rem;
  margin-left: 1.5rem;
}

hr {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

button,
button:active,
button:focus,
button:hover,
.btn,
.btn:active,
.btn:focus,
.btn:hover {
  outline: none !important;
  -webkit-box-shadow: none;
          box-shadow: none;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  margin-bottom: 0;
}

/*------------------------------------*\
    $SECTION
\*------------------------------------*/
@media all and (max-width: 767px) {
  .papiin_heading01 {
    font-size: 46px;
    line-height: 1.3;
    font-weight: 700;
  }
}

@media all and (max-width: 767px) {
  .papiin_heading02 {
    font-size: 28px;
    line-height: 1.3;
    font-weight: 700;
  }
}

@media all and (max-width: 767px) {
  .papiin_heading03 {
    font-size: 24px;
    line-height: 1.3;
    font-weight: 700;
  }
}

@media all and (max-width: 767px) {
  .papiin_body1_bold {
    font-size: 15px;
    line-height: 1.5;
    font-weight: 700;
  }
}

section {
  padding-top: 64px;
  padding-bottom: 64px;
}
@media all and (max-width: 767px) {
  section {
    padding-top: 32px;
    padding-bottom: 64px;
  }
}

.section__inner {
  position: relative;
  margin: 0 auto;
  padding-left: 32px;
  padding-right: 32px;
  max-width: 1024px;
}
@media all and (max-width: 767px) {
  .section__inner {
    padding-left: 20px;
    padding-right: 20px;
  }
}

.papiin_chatitem {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  margin-bottom: 20px;
}
.papiin_chatitem .papiin_chatitem__inner {
  padding: 20px;
  border: 2px solid #0A111A;
  background: #FFFFFF;
}
@media all and (max-width: 767px) {
  .papiin_chatitem .papiin_chatitem__inner {
    width: 100%;
  }
}
.papiin_chatitem .papiin_chattail {
  -ms-flex-preferred-size: 20px;
      flex-basis: 20px;
}

.about_sec_title {
  position: relative;
  margin-bottom: 40px;
}
@media all and (max-width: 767px) {
  .about_sec_title {
    margin-bottom: 24px;
  }
}

.p-button_sec {
  border-radius: 50px;
  color: #FFFFFF;
  padding: 12px 20px;
  border: 2px solid #FFFFFF;
}
.p-button_sec:hover {
  color: #FAFAFA;
  border: 2px solid #FAFAFA;
}

.p-button {
  background-color: #FFFFFF;
  border-radius: 50px;
  color: #F1341C;
  padding: 12px 20px;
}
.p-button:hover {
  background-color: #FAFAFA;
  color: #F1341C;
}

.about__num_bg_r {
  position: absolute;
  right: 0;
  bottom: 0;
  margin-bottom: -400px;
}
@media all and (max-width: 767px) {
  .about__num_bg_r {
    width: 40%;
  }
}

.about__num_bg_l {
  position: absolute;
  left: 0;
  bottom: 0;
  margin-bottom: -200px;
}
@media all and (max-width: 767px) {
  .about__num_bg_l {
    width: 40%;
  }
}

/*------------------------------------*\
    $SECTION
\*------------------------------------*/
.about__header .about__header__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 190px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-image: url(../images/web/about/img_header_bg.jpg);
  background-position: center center;
  background-size: cover;
  color: #FFFFFF;
}

.about__whatis {
  position: relative;
}
.about__whatis span {
  color: #0096FF;
}
.about__whatis .about_sec_title {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.about__whatis .papiin_logo {
  width: 274px;
  margin-bottom: 20px;
}
@media all and (max-width: 767px) {
  .about__whatis .papiin_logo {
    width: 158px;
  }
}
.about__whatis .papiin_logoimg {
  position: absolute;
  right: 0;
  top: 0;
}
@media all and (max-width: 1023px) {
  .about__whatis .papiin_logoimg {
    display: none;
  }
}
.about__whatis .papiin_chatlist {
  position: relative;
}
.about__whatis .title_img {
  display: none;
}
@media all and (max-width: 1023px) {
  .about__whatis .title_img {
    display: block;
    -ms-flex-preferred-size: 140px;
        flex-basis: 140px;
  }
}
.about__whatis .title_text {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
@media all and (max-width: 1023px) {
  .about__whatis .papiin_chatitem__inner {
    width: 100%;
  }
}

.about__num {
  position: relative;
}
.about__num .papiin_numitem {
  padding-top: 56px;
  padding-bottom: 56px;
  width: 33.3%;
}
@media all and (max-width: 767px) {
  .about__num .papiin_numitem {
    padding-top: 32px;
    padding-bottom: 32px;
    width: 100%;
  }
}
.about__num .numimg {
  width: 30%;
  margin: 0 auto;
  margin-bottom: 12px;
}

.about__identity {
  background-image: url(../images/web/about/img_identity_bg.jpg);
  overflow: hidden;
}
.about__identity .papiin_chatitem__inner {
  max-width: 410px;
}
@media all and (max-width: 767px) {
  .about__identity .papiin_chatitem__inner {
    max-width: none;
  }
}
.about__identity .about_sec_content {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 50%;
}
@media all and (max-width: 767px) {
  .about__identity .about_sec_content {
    width: 100%;
  }
}
.about__identity .about_sec_title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 535px;
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  -ms-flex-negative: 1;
      flex-shrink: 1;
}
@media all and (max-width: 767px) {
  .about__identity .about_sec_title {
    width: 100%;
    height: auto;
    padding-top: 57%;
    margin-bottom: 48px;
  }
}
.about__identity .identity_title {
  padding: 8px 12px;
  background-color: #0A111A;
  color: #FFFFFF;
}
.about__identity .identityicon {
  -ms-flex-negative: 1;
      flex-shrink: 1;
}
@media all and (max-width: 767px) {
  .about__identity .identityicon {
    -ms-flex-preferred-size: 48px;
        flex-basis: 48px;
  }
}
.about__identity .identity_subtitle {
  padding: 8px 12px;
  background-color: #FFFFFF;
}
.about__identity .identitytext {
  position: relative;
  margin-bottom: -12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.about__identity .identityimg {
  position: absolute;
}
.about__identity .papiin_chatitem {
  margin-bottom: 48px;
}
@media all and (max-width: 767px) {
  .about__identity .papiin_chatitem {
    width: 100%;
    margin-bottom: 20px;
  }
}
.about__identity .papiin_agents {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media all and (max-width: 767px) {
  .about__identity .papiin_agents {
    margin-bottom: 48px;
  }
}
.about__identity .papiin_agents .identityimg {
  width: 1000px;
  top: 0;
  right: 0;
}
@media all and (max-width: 767px) {
  .about__identity .papiin_agents .identityimg {
    width: 150%;
    margin-right: 9%;
  }
}
.about__identity .papiin_client {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.about__identity .papiin_client .identityimg {
  width: 1000px;
  top: 0;
  left: 0;
  margin-left: 24px;
}
@media all and (max-width: 767px) {
  .about__identity .papiin_client .identityimg {
    width: 150%;
    margin-left: 9%;
  }
}

.about__vision {
  overflow: hidden;
  background-image: url(../images/web/about/img_vision2_bg.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1920px;
}
.about__vision .about_sec_content {
  background-image: url(../images/web/about/img_vision_bg.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 768px;
  padding: 120px 0;
}
@media all and (max-width: 767px) {
  .about__vision .about_sec_content {
    background-image: none;
    padding: 0;
    background-image: url(../images/web/about/img_vision_bg_m.jpg);
    background-position: right;
    background-repeat: repeat-y;
    background-size: 48px;
  }
}
.about__vision .vision_content_now {
  margin-bottom: 40px;
}
.about__vision .vision_content_now .visionlist_title {
  color: #F1341C;
}
.about__vision .vision_content_now .visionlist_text {
  background-color: #F1341C;
  border-top-left-radius: 80px;
}
@media all and (max-width: 767px) {
  .about__vision .vision_content_now .visionlist_text {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 80px;
  }
}
.about__vision .vision_content_now .visionimg_inner {
  position: absolute;
  top: 0;
  right: 0;
}
.about__vision .vision_content_short {
  margin-bottom: 40px;
}
.about__vision .vision_content_short .visionlist_title {
  color: #0096FF;
}
.about__vision .vision_content_short .visionlist_text {
  background-color: #0096FF;
  border-top-right-radius: 80px;
}
@media all and (max-width: 767px) {
  .about__vision .vision_content_short .visionlist_text {
    border-top-right-radius: 0px;
    border-bottom-left-radius: 80px;
  }
}
.about__vision .vision_content_short .visionimg_inner {
  position: absolute;
  top: 0;
  left: 0;
}
@media all and (max-width: 767px) {
  .about__vision .vision_content_short .visionlist_icon {
    -webkit-transform: scaleX(-1);
            transform: scaleX(-1);
  }
}
.about__vision .vision_content_long .visionlist_title {
  color: #252B33;
}
.about__vision .vision_content_long .visionlist_text {
  background-color: #252B33;
  border-bottom-left-radius: 80px;
}
@media all and (max-width: 767px) {
  .about__vision .vision_content_long .visionlist_text {
    border-bottom-left-radius: 0px;
    border-bottom-left-radius: 80px;
  }
}
.about__vision .vision_content_long .visionimg_inner {
  position: absolute;
  top: 0;
  right: 0;
}
.about__vision .visionimg {
  position: relative;
  width: 50%;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
.about__vision .visionlist_icon {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
@media all and (max-width: 767px) {
  .about__vision .visionlist_icon {
    -ms-flex-preferred-size: 48px;
        flex-basis: 48px;
  }
}
.about__vision .visionlist_content {
  position: relative;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
@media all and (max-width: 767px) {
  .about__vision .visionlist_content {
    width: 100%;
  }
}
.about__vision .visionlist {
  position: relative;
  -ms-flex-negative: 1;
      flex-shrink: 1;
  -ms-flex-preferred-size: 640px;
      flex-basis: 640px;
}
@media all and (max-width: 767px) {
  .about__vision .visionlist {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
  }
}
.about__vision .visionlist_text {
  padding: 48px 48px 40px 48px;
  margin-bottom: 0;
  color: #FFFFFF;
}
@media all and (max-width: 767px) {
  .about__vision .visionlist_text {
    padding: 32px 32px 16px 32px;
  }
}
.about__vision .visionlist_title {
  background-color: #F2F2F2;
  position: absolute;
  top: 0;
  left: 0;
  padding: 8px 16px;
  margin-top: -2rem;
}

.about__contact {
  position: relative;
  padding-bottom: 0;
  background-image: url(../images/web/about/img_contact_bg.jpg);
}
.about__contact .contact_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(255, 255, 255)), to(rgba(255, 255, 255, 0.3)));
  background-image: linear-gradient(to bottom, rgb(255, 255, 255), rgba(255, 255, 255, 0.3));
}
.about__contact .papiin_sns {
  gap: 16px;
  margin-bottom: 180px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.about__contact .papiin_groupimg {
  width: 60%;
  margin: 0 auto;
}
@media all and (max-width: 639px) {
  .about__contact .papiin_groupimg {
    width: 100%;
  }
}

.about__footer {
  position: sticky;
  bottom: 0;
}
.about__footer .papiin_footertext {
  color: #FFFFFF;
}
.about__footer .about__footer__inner {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #F1341C;
  padding: 16px;
}/*# sourceMappingURL=all.css.map */
