/* //////////////////////////////////////////////////////////////////////////// */
/* JhuangPing v.1.4.0 [04.11.2020]                                              */
/* Github: https://jhuangping.github.io                                         */
/* //////////////////////////////////////////////////////////////////////////// */
/* Footer ===================================================================== */
.ft { padding-top: 4.94792%; padding-bottom: 2.5rem; background: #F4F3EF; }

.ft_wp { margin-bottom: 5.98958%; }

.ft_ctr { display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; }

.ft_ctr > *:not(:last-child) { margin-right: 4.6875vw; }

.ft_title { font-family: "Noto Serif TC", Arial, "Microsoft JhengHei", sans-serif; font-size: 2.4rem; color: #105e21; padding-bottom: 3rem; margin-bottom: 3.5rem; border-bottom: 1px solid #D8D7D3; max-width: 300px; }

.ft_menu { max-width: 300px; -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; width: 100%; }

.ft_menu_list { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }

.ft_menu_item { max-width: 49%; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: 100%; margin-bottom: 1rem; }

.ft_info { max-width: 300px; -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; width: 100%; }

.ft_info_item { position: relative; padding-left: 25px; }

.ft_info i { position: absolute; top: 2px; left: 0px; font-style: normal; color: #105e21; margin-right: 0.78125vw; }

.ft_contact_list i { font-style: normal; }

.ft_contact_list [data-icon="line"] { color: #03BA00; }

.ft_contact_list [data-icon="messenger"] { color: #2196F3; }

.ft_bg { position: absolute; bottom: 0px; right: 0px; width: 17.21854%; background: url("../img/common/ft-bg_260x523.png") no-repeat center; background-size: contain; }

.ft_bg::before { content: ''; display: block; padding-bottom: 201.15385%; }

@media all and (max-width: 1550px) { .ft_bg { width: 13.24503%; } }

@media all and (max-width: 1440px) { .ft_title { font-size: 2rem; padding-bottom: 2rem; margin-bottom: 2.5rem; }
  .ft_contact_list p:not(:last-child) { margin-bottom: 0.5rem; } }

@media all and (min-width: 993px) and (max-width: 1440px) { .ft { font-size: 1.4rem; } }

@media all and (max-width: 1260px) { .ft_ctr { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
  .ft_contact { margin-right: 0px !important; }
  .ft_bg { display: none; } }

@media all and (max-width: 992px) { .ft_ctr { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
  .ft_ctr > * { max-width: 500px; -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; width: 100%; }
  .ft_ctr > *:not(:last-child) { margin-right: 0px; }
  .ft_info { margin-top: 30px; }
  .ft_contact { margin-top: 30px; } }

.community { margin-bottom: 2.5rem; width: 100%; max-width: 410px; position: relative; margin-left: auto; margin-right: auto; }

.community::before { content: ''; position: absolute; top: 50%; left: 0px; width: 100%; height: 1px; background: #DDDCD8; }

.community_list { max-width: 220px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative; z-index: 1; background: #F4F3EF; margin-left: auto; margin-right: auto; padding-left: 2.5rem; padding-right: 2.5rem; }

.community_item { margin-left: 0.7rem; margin-right: 0.7rem; max-width: 45px; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: 100%; }

.community_link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 45px; height: 45px; border-radius: 100%; border: 1px solid #CDCCC8; color: #9C9B99; font-size: 2rem; line-height: 0; position: relative; }

.community_link::before { -webkit-transform: translate(0px, 2px); transform: translate(0px, 2px); z-index: 3; }

.community_link::after { content: ''; position: absolute; z-index: 2; top: 50%; left: 50%; width: 0px; height: 0px; background: #105e21; border-radius: 100%; -webkit-transition: all 0.5s; transition: all 0.5s; }

.con-mv { position: fixed; right: 8px; bottom: 20px; z-index: 2; }
.con-mv li { margin-bottom: 4px; }
.con-mv li a { display: block; width: 45px; height: 45px; border-radius: 45px; }
.con-mv li.phone a { background: #43cc28 url('../img/footer/ft-phone.png') no-repeat center center; }
.con-mv li.facebook a { background: #1787fb url('../img/footer/ft-fb.png') no-repeat center center; }
.con-mv li.line a { background: #44cb28 url('../img/footer/ft-line.png') no-repeat center center; }
.con-mv li.top a { background: #18634c url('../img/footer/ft-top.png') no-repeat center center; }

@media all and (min-width: 1221px) { .community_link:hover { color: #fff; border-color: transparent; }
  .community_link:hover::after { top: 0px; left: 0px; width: 100%; height: 100%; } }

.copyright { text-align: center; color: #97948b; font-size: 1.4rem; }

@media all and (min-width: 993px) and (max-width: 1440px) { .copyright { font-size: 1.2rem; } }
