Template Name : Pranayama - Yoga Studio and Meditation Template Author : HasnaaDesign Version : 1.0 Primary Use : Yoga, Company -----------------------------------------------------------------*/ /*-----------------------------------------------------------------
Table Of Contents
--------------------------------
 1. Global Styles
 2. Loading
 3. Upperbar
 4. Navbar
 5. Side Menu
 6. Home
 7. Services
 8. About Us
 9. Schedule
 10. Call To Action
 11. Events
 12. Our Team
 13. Pricing
 14. Testimonials
 15. Blog
 16. Contact
 17. Newsletter
 18. Footer
 19. Scroll To Top
 20. Media Queries
-----------------------------------------------------------------*/
/* --------------------------------------
   1. Global Styles
-----------------------------------------*/
* {
  -webkit-transition: all .4s ease-in-out;
  -moz-transition: all .4s ease-in-out;
  -o-transition: all .4s ease-in-out;
  -ms-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
}
body {
  font-family: Microsoft JhengHei, Arial Black, LiHei Pro;
  background-color: #fff;
  overflow-x: hidden;
}
h1, h2, h3, h4, h5, h6 {
  font-family: Microsoft JhengHei, Arial Black, LiHei Pro;
  margin: 0;
  padding: 0;
}
a, a:active {
  color: #2e2e2e;
  text-decoration: none;
}
a:hover, a:focus {
  color: #1aa1a9;
  text-decoration: none;
}
ul {
  margin-bottom: 0;
  list-style: none;
}
/*=========== Typography ============*/
h1 {
  font-size: 3.75rem;
  font-weight: 800;
}
h2 {
  font-size:1.64rem;
  font-weight: 700;
}
h3 {
  font-size: 1.4rem;
  font-weight: 600;
}
h4 {
  font-size: 1.15rem;
  font-weight: 400;
}
h5 {
  font-size: 1rem;
  font-weight: 400;
}
h6 {
  font-size: 0.95rem;
  font-weight: 400;
}
p.en {
  color: #329791;
  line-height: 1.14rem;
  text-align: left;
}

/*=========== My Classes (首頁大多共用)============*/
.main-title {
  text-align: center;
  position: relative;
}
.main-title .separator {
  position: relative;
  width: 160px;
  display: inline-block;
}
.main-title .separator:before, .main-title .separator:after {
  content: '';
  position: absolute;
  top: 50%;
  margin-top: -1px;
  height: 2px;
  width: 50px;
  background: #7b6cd5;
}
.main-title .separator:before {
  left: 3px;
}
.main-title .separator:after {
  right: 3px;
}
.main-title .separator .flaticon-chakra:before {
  font-size: 40px;
  color: #7b6cd5;
  margin-left: 0;
}
/*標題*/
.main-title h2 {
  text-align: left;
  font-size: 1.88rem;
  font-weight: 700;
  margin: 0;
  text-transform: capitalize;
}
.display-table {
  display: table;
  width: 100%;
}
.display-table-cell {
  display: table-cell;
  vertical-align: middle;
  min-height: 100%;
  height: 100vh;
  text-align: center;
}
.main-btn {
  position: relative;
  background: #7b6cd5;
  color: #fff;
  display: inline-block;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 1.1px;
  text-align: center;
  padding: 15px 20px;
  outline: none;
  cursor: pointer;
  margin-right: 14px;
  overflow: hidden;
}
.main-btn span {
  position: relative;
  z-index: 2;
}
.main-btn:before {
  content: '';
  background-color: #f49d06;
  color: #fff;
  position: absolute;
  top: 0;
  left: -25%;
  height: 104%;
  width: 0;
  -webkit-transform: skew(-22deg);
  -moz-transform: skew(-22deg);
  -ms-transform: skew(-22deg);
  -o-transform: skew(-22deg);
  transform: skew(-22deg);
  transition-duration: .6s;
  z-index: 1;
}
.main-btn:hover:before {
  width: 190%;
}
.main-btn:hover, .custom-btn:hover {}
.custom-btn {
  background: transparent;
  color: #fff;
  border: 2px solid #fff;
  margin-right: 0;
}
#particles-js {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: transparent;
}
/* --------------------------------------
   0. Loading
-----------------------------------------*/
.loading {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 9999999;
  background-color: #fff;
}
.loading .loading-content {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 50px;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.loading .loading-content .inner-item {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  width: 50px;
  height: 50px;
  background-color: #40aaaf;
  border-radius: 50%;
  -webkit-transform: scale(.1);
  -moz-transform: scale(.1);
  -ms-transform: scale(.1);
  -o-transform: scale(.1);
  transform: scale(.1);
  -webkit-transform-origin: center left;
  -moz-transform-origin: center left;
  -ms-transform-origin: center left;
  -o-transform-origin: center left;
  transform-origin: center left;
  -webkit-animation: loading 4s infinite;
  animation: loading 4s infinite;
}
.loading .loading-content .inner-item:nth-of-type(2) {
  -webkit-animation-delay: .3s;
  animation-delay: .3s;
}
.loading .loading-content .inner-item:nth-of-type(3) {
  -webkit-animation-delay: .6s;
  animation-delay: .6s;
}
.loading .loading-content .inner-item:nth-of-type(4) {
  -webkit-animation-delay: .9s;
  animation-delay: .9s;
}
.loading .loading-content .inner-item:nth-of-type(5) {
  -webkit-animation-delay: 1.2s;
  animation-delay: 1.2s;
}
@-webkit-keyframes loading {
  0% {
    -webkit-transform: scale(.1);
    -moz-transform: scale(.1);
    -ms-transform: scale(.1);
    -o-transform: scale(.1);
    transform: scale(.1);
  }
  45% {
    left: 120px;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  90% {
    left: 294px;
    -webkit-transform: scale(.1);
    -moz-transform: scale(.1);
    -ms-transform: scale(.1);
    -o-transform: scale(.1);
    transform: scale(.1);
  }
}
@keyframes loading {
  0% {
    -webkit-transform: scale(.1);
    -moz-transform: scale(.1);
    -ms-transform: scale(.1);
    -o-transform: scale(.1);
    transform: scale(.1);
  }
  45% {
    left: 120px;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  90% {
    left: 294px;
    -webkit-transform: scale(.1);
    -moz-transform: scale(.1);
    -ms-transform: scale(.1);
    -o-transform: scale(.1);
    transform: scale(.1);
  }
}
/* --------------------------------------
   1-1. Upperbar (header頁頭)
-----------------------------------------*/
.header-inner {
  background: #fff;
  z-index: 999;
}
/*================= 1-1(1) (top選單) =================*/
.upper-bar {
  background-color: #fff;
}
.upper-bar .inner-bar {
  color: #f1f3f1;
  padding: 5px 0;
  border-radius: 0 0 8px 8px;
}
.upper-bar .inner-bar .row {
  align-items: center;
  flex-direction: inherit;
}
.list-unstyled {
}


.upper-bar .inner-bar .contact-bar li {
  display: inline-block;
  font-size: 14px;
  margin-right: 15px;
}
.upper-bar .inner-bar .contact-bar li a {
  color: #f1f3f1;
}
.upper-bar .inner-bar .contact-bar li i {
  margin-right: 5px;
}
.upper-bar .inner-bar .social-media-bar li {
  display: inline-block;
  margin-right: 15px;
}
.upper-bar .inner-bar .social-media-bar li.login {
  display: none
}
.upper-bar .inner-bar .social-media-bar li a {
  color: #2e2e2e;
}
/*===== nav-search(TOP搜尋) =====*/
.header-inner .nav-search {
  float: right;
  margin-left: 10px;
  padding-left: 0;
}
.header-inner .nav-search li {
  display: inline-block;
  margin-right: 10px;
}
.header-inner .nav-search li:last-child {
  margin-right: 0;
}
.header-inner .nav-search li a {
  color: #323232;
  font-size: 1.4rem;
  font-weight: 700;
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  -ms-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}
.header-inner .nav-search li a.fa-search {
  font-weight: 400;
}
/*=== 彈開搜尋視窗 ===*/
.header-inner .search-form {
  position: absolute;
  top: 42px;
  right: 2rem;
  width: 295px;
  padding: 12px;
  background: #fff;
  border-top: 2px solid #1aa1a9;
  box-shadow: 0 0 10px rgba(0, 0, 0, .1);
  -webkit-transform: scaleY(0);
  -moz-transform: scaleY(0);
  -ms-transform: scaleY(0);
  -o-transform: scaleY(0);
  transform: scaleY(0);
  opacity: 0;
  visibility: hidden;
  z-index: 9999;
}
.header-inner .search-form.active {
  -webkit-transform: scaleY(1);
  -moz-transform: scaleY(1);
  -ms-transform: scaleY(1);
  -o-transform: scaleY(1);
  transform: scaleY(1);
  opacity: 1;
  visibility: visible;
}
.header-inner .search-form input[type="search"] {
  background: #f7f7fb;
  color: #353535;
  width: 100%;
  height: 50px;
  padding: 0 50px 0 18px;
  border: none;
  outline: none;
  font-size: 14px;
  font-weight: 600;
}
.header-inner .search-form .search-btn {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 50px;
  height: 50px;
  background: #1aa1a9;
  color: #fff;
  cursor: pointer;
  outline: none;
  border: none;
}
.header-inner .search-form .search-btn:hover {
  background: #604dd6;
}
/*===== 右側開闔 =====*/
.header-inner .nav-search li.bar-icon {
  display: none;
}
/*===== rwd開闔top選單版 =====*/
.header-inner .menu-toggle {
  background: #1aa1a9;
  float: right;
  padding: 10px;
  margin: 20px 0.8em 20px 0;
  border: none;
  outline: none;
  cursor: pointer;
  display: none;
  z-index: 2;
}
.header-inner .menu-toggle .bar {
  display: block;
  width: 25px;
  height: 2px;
  background-color: #fff;
}
.header-inner .menu-toggle .bar:nth-child(2) {
  margin: 6px 0;
}
.header-inner.menu-active .menu-toggle .bar:nth-child(2) {
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
}
.header-inner.menu-active .menu-toggle .bar:first-child {
  -webkit-transform: translateY(8px) rotate(45deg);
  -moz-transform: translateY(8px) rotate(45deg);
  -ms-transform: translateY(8px) rotate(45deg);
  -o-transform: translateY(8px) rotate(45deg);
  transform: translateY(8px) rotate(45deg);
}
.header-inner.menu-active .menu-toggle .bar:last-child {
  -webkit-transform: translateY(-8px) rotate(-45deg);
  -moz-transform: translateY(-8px) rotate(-45deg);
  -ms-transform: translateY(-8px) rotate(-45deg);
  -o-transform: translateY(-8px) rotate(-45deg);
  transform: translateY(-8px) rotate(-45deg);
}
/*================= ///END1-1(1) (top選單) =================*/
/*================= 1-1(2) Navbar(主選單) =================*/
.header-inner .main-menu {
  position: relative;
  background: #1aa1a9;
}
.header-inner .my-logo {
  position: relative;
  color: #323232;
  font-size: 22px;
  font-weight: 700;
  display: inline-block;
}
.header-inner .nav-search li a:hover {
  color: #7b6cd5;
}
.header-inner .navbar {
  padding: 0;
}
.header-inner .navbar .nav > li {
  position: relative;
  margin-right: 15px;
}
.header-inner .navbar .nav li:last-child {
  margin-right: 0;
}
.header-inner .navbar .nav li a {
  display: block;
  color: #fff;
  padding: 1rem 4rem;
  font-size: 1.26rem;
  font-weight: 700;
  text-transform: uppercase;
}
.header-inner .navbar .nav li.active a, .header-inner .navbar .nav li:hover a {
	color: #d3f9fb;
}

.navbar.navbar-expand-lg   .navbar-collapse .nav .navbar-nav li:hover a{
	color: #333;
}


.header-inner .navbar .nav li a:before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px;
  background: #9cd443;
  -moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.header-inner .navbar .nav li:hover a:before, .header-inner .navbar .nav li.active a:before {
  width: 100%;
}
.header-inner .navbar .nav li a i {
  margin-left: 5px;
  font-weight: 600;
  padding-left: 4px;
  font-size: .6rem;
}
.header-inner .navbar .nav .dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  width: 225px;
  padding: 0;
  background: #fff;
  border-bottom: 3px solid #9cd443;
  list-style: none;
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: scaleY(0);
  -moz-transform: scaleY(0);
  -ms-transform: scaleY(0);
  -o-transform: scaleY(0);
  transform: scaleY(0);
  transform-origin: 0 0;
}
.header-inner .navbar .nav li:hover .dropdown {
  opacity: 1;
  visibility: visible;
  -webkit-transform: scaleY(1);
  -moz-transform: scaleY(1);
  -ms-transform: scaleY(1);
  -o-transform: scaleY(1);
  transform: scaleY(1);
}
.header-inner .navbar .nav li .dropdown li a {
  background: transparent;
  color: #2e2e2e;
  padding: 12px 15px;
  border-bottom: 1px solid #e0e0e0;
  font-size: 1rem;
  font-weight: 500;
  text-transform: capitalize;
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  -ms-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}
.header-inner .navbar .nav li .dropdown li a:hover {
  background: #1aa1a9ba;
  padding-left: 18px;
  color: #fff;
}
.header-inner .navbar .nav li .dropdown li a:before {
  display: none;
}
.header-inner .navbar .nav li::after {
  position: absolute;
  content: " / ";
  right: 0;
  top: 1.2rem;
  color: #b0f3f799;
}
.header-inner .navbar .nav li:last-child::after, .header-inner .navbar .nav .dropdown li::after {
  display: none;
}
/*================= ///END-1-1(2) Navbar(主選單) =================*/
/* --------------------------------------
   1-2. Side Menu (右側邊選單)暫時隱藏
-----------------------------------------*/
.side-menu {
  position: fixed;
  top: 0;
  right: -100%;
  width: 320px;
  height: 100vh;
  padding: 30px 20px;
  background-color: #fff;
  color: #323232;
  box-shadow: 0 0 10px rgba(0, 0, 0, .2);
  z-index: 99999;
  -webkit-transition: all .5s ease-in-out;
  -moz-transition: all .5s ease-in-out;
  -o-transition: all .5s ease-in-out;
  -ms-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}
.side-menu.open {
  right: 0;
}
.side-menu .side-menu-close {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 32px;
  height: 32px;
  line-height: 31px;
  text-align: center;
  border-radius: 50%;
  font-size: 17px;
  background: transparent;
  color: #7b6cd5;
  border: 1px solid #7b6cd5;
  -webkit-transition: all .01s ease-in-out;
  -moz-transition: all .01s ease-in-out;
  -o-transition: all .01s ease-in-out;
  -ms-transition: all .01s ease-in-out;
  transition: all .01s ease-in-out;
}
.side-menu .side-menu-close:hover {
  background: #7b6cd5;
  color: #fff;
  border: 1px solid #7b6cd5;
}
.side-menu .my-logo {
  color: #323232;
  font-size: 22px;
  font-weight: 700;
  display: inline-block;
  padding-top: 30px;
}
.side-menu .my-logo .flaticon-chakra:before {
  margin-left: 0;
  font-size: 40px;
  color: #7b6cd5;
  margin-right: 8px;
  position: relative;
  top: 8px;
}
.side-menu .side-nav {
  margin: 30px 0;
}
.side-menu .side-nav li a {
  display: block;
  padding: 8px 0;
  color: #323232;
  font-size: 15px;
  font-weight: 500;
  border-bottom: 1px solid #f3f1f1;
  -webkit-transition: all .3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  -ms-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}
.side-menu .side-nav li a:hover, .side-menu .side-nav li a.active {
  color: #7b6cd5;
}
.side-menu .side-info h4 {
  font-size: 17px;
  font-weight: 600;
}
.side-menu .side-info p {
  font-size: 14px;
  line-height: 1.8;
  margin: 30px 0;
}
.side-menu .social-icons li {
  display: inline-block;
  margin-right: 10px;
}
.side-menu .social-icons li:last-child {
  margin-right: 0;
}
.side-menu .social-icons li a {
  display: inline-block;
  width: 32px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  border-radius: 50%;
  font-size: 16px;
  font-weight: 600;
  background: transparent;
  color: #7b6cd5;
  border: 1px solid #7b6cd5;
  -webkit-transition: all .01s ease-in-out;
  -moz-transition: all .01s ease-in-out;
  -o-transition: all .01s ease-in-out;
  -ms-transition: all .01s ease-in-out;
  transition: all .01s ease-in-out;
}
.side-menu .social-icons li a:hover {
  background: #7b6cd5;
  color: #fff;
}
/* --------------------------------------
   1-3. Home (banner)輪播選單
-----------------------------------------*/
.home {
  position: relative;
  overflow: hidden;
  height: 100vh;
  height: 54vh;
}
.home .owl-carousel {
  height: 100vh;
  height: 54vh;
}
.home .bg-cover {
  -webkit-background-size: auto;
  -moz-background-size: auto;
  -ms-background-size: auto;
  -o-background-size: auto;
  background-size: auto;
  background-position: center top;
  background-repeat: no-repeat;
  height: 100%;
  height: auto;
  width: 100%;
}
.home .owl-carousel .animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}
.home .owl-carousel .owl-nav .owl-next, .home .owl-carousel .owl-nav .owl-prev {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 24px;
  color: #fff;
  width: 45px;
  height: 45px;
  line-height: 36px;
  text-align: center;
  background-color: rgba(23, 24, 25, .5);
  border-radius: 3px;
  outline: none;
  z-index: 999;
}
.home .owl-carousel .owl-nav .owl-next {
  right: 10px;
}
.home .owl-carousel .owl-nav .owl-prev {
  left: 10px;
}
.home .owl-carousel .owl-nav .owl-next:hover, .home .owl-carousel .owl-nav .owl-prev:hover {
  /*background-color: #7b6cd5;*/
}
.home .overlay {
  background-color: rgba(0, 0, 0, .0);
  height: 100%;
}
.home .home-content h5 {
  color: #7b6cd5;
  font-size: 22px;
  font-weight: 600;
  text-transform: capitalize;
  margin-bottom: 5px;
}
.home .home-content p {
  color: #fff;
  line-height: 1.6;
  letter-spacing: .3px;
  margin-bottom: 30px;
}
.home .home-content h1 {
  color: #e0dede;
  font-size: 65px;
  font-weight: 700;
  text-transform: capitalize;
  margin-bottom: 25px;
  line-height: 1.2;
}
.home .home-content .custom-btn {
  margin-right: 14px;
}
/* --------------------------------------
   4-1. Footer(頁底)
-----------------------------------------*/
.footer {
  background-color: #fff;
}
/*頁底選單*/
.footer .footer-top {
  position: relative;
  padding: 2rem 0 1.5rem 0;
}
/*內頁用*/
.page .footer .footer-top {
  border-top: 1px solid #f2f2f2;
  background: #c2c2c230;
}
.footer .flaticon-lotus:before {
  margin-left: 0;
  position: absolute;
  top: 28%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #585353;
  opacity: .05;
  font-size: 27em;
  z-index: 0;
  height: 300px;
}
.footer .footer-top .footer-menu {
  position: relative;
  z-index: 1;
  overflow: hidden;
}
/*開闔按鍵*/
.footer .footer-top .footer-header {
  text-align: center;
}
.footer .footer-top .footer-header button.btn-link {
  text-decoration: none;
  color: #fff;
  background: #40aaaf;
  border-radius: 25px;
  padding: .25rem 1rem;
}
/*開闔選單內容*/
.footer .footer-top .card-body {
  overflow: hidden;
  padding-bottom: 0;
}
.footer .footer-top .footer-item {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: space-around;
  justify-content: space-around;
  align-items: stretch;
  width: 19.7%;
}
.footer .footer-top ul h4 {
  background: #e2e9d4;
  display: inline-block;
  border-radius: 3px;
  padding: .5rem;
}
.footer .footer-top ul li {
  margin-bottom: 0.2rem
}
.footer .footer-top ul li:last-of-type {
  margin-bottom: 10px;
}
.footer .footer-top .social-media {
  margin-right: 0;
}
.footer .footer-top .social-media li {
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 0;
}
.footer .footer-top .social-media li i {
  display: inline-block;
  width: 38px;
  height: 38px;
  line-height: 36px;
  text-align: center;
  font-size: 17px;
  background: transparent;
  color: #7b6cd5;
  border: 1px solid #7b6cd5;
  border-radius: 50%;
}
.footer .footer-top .social-media li i:hover {
  background: #7b6cd5;
  border: 1px solid #7b6cd5;
  color: #fff;
}
.footer .footer-top .footer-item h4 {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: .7px;
  margin-bottom: 20px;
  text-transform: capitalize;
}
.footer .footer-top .footer-item ul li a {
  padding-left: 10px;
}
.footer .footer-top .footer-item ul li a:hover {
  color: #1aa1a9;
  padding-left: 14px;
}
.footer .footer-top .footer-item ul li a:before {
  content: '\f105';
  font-family: 'FontAwesome';
  position: relative;
  left: -10px;
}
/*頁底Copyright*/
.footer .footer-bottom {
  background: #1aa1a9;
  padding-top: 20px;
  padding-bottom: 20px;
}
.footer .copyright {
  overflow: hidden;
}
.footer .footer-bottom .rq {
  float: left;
  display: inline-block;
  margin-right: 1rem;
}
.footer .footer-bottom .copyright p {
  color: #fff;
  margin: 0;
  width: auto;
  text-align: left;
  float: left;
  display: inline-block;
  margin-left: 1.5rem;
}
.footer .footer-bottom .copyright p a {
  color: #fff;
}
.footer .footer-bottom .copyright p a:hover {
  color: #d4f8ff;
}
.footer .footer-bottom .copyright p span {
}
.footer .footer-bottom .logo {
  float: right;
}
/* --------------------------------------
   4-2. Scroll To Top(回到最上端)
-----------------------------------------*/
.scroll-top {
  position: fixed;
  bottom: 107%;
  right: 25px;
  width: 52px;
  height: 52px;
  line-height: 48px;
  font-size: 17px;
  text-align: center;
  color: #fff;
  background: #147f85;
  border: 2px solid #208389;
  border-radius: 4px;
  z-index: 999;
  -webkit-transition: all .7s linear;
  -moz-transition: all .7s linear;
  -o-transition: all .7s linear;
  -ms-transition: all .7s linear;
  transition: all .7s linear;
  overflow: hidden;
}
.scroll-top.active {
  bottom: 25px;
}
.scroll-top:hover {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  transform: translateY(-2px);
  border: 2px solid #208389;
}
.scroll-top span {
  position: relative;
  z-index: 2;
}
.scroll-top:before {
  content: '';
  background-color: #208389;
  position: absolute;
  top: 0;
  left: -25%;
  height: 104%;
  width: 0;
  -webkit-transform: skew(-22deg);
  -moz-transform: skew(-22deg);
  -ms-transform: skew(-22deg);
  -o-transform: skew(-22deg);
  transform: skew(-22deg);
  transition-duration: .6s;
  z-index: 1;
}
.scroll-top:hover:before {
  width: 190%;
}

.scroll-top i.fa{
	margin: 15px 0 0 0 ; 
}

/* --------------------------------------------------------------------------------------------
////////////////////////////////////////// 首頁用 /////////////////////////////////////////////
-----------------------------------------------------------------------------------------------*/
/* --------------------------------------
   2-1. Events(電子認證系統+相關連結+最新消息)
-----------------------------------------*/
.announcement {
  overflow: hidden;
  padding: 2.5rem 0 3rem 0;
  background: #f9f9f9 url("../images/announcement.jpg") no-repeat right top;
}
/*================= 2-1(1) Newsletter(登入專區) + 相關連結 =================*/
.newsletter {
  padding-left: 0;
  max-width: 400px;
  padding-right: 0;
}
.newsletter .newsletter-inner {
  background: #549eb1 url("../images/newsletter-inner.png") no-repeat left top;
  padding: 0;
  position: relative;
  z-index: 1;
  width: 100%;
  background-size: cover;
}
/*頁頭標題*/
.newsletter .newsletter-inner .newsletter-head {
  background: url("../images/newsletter-head.png") no-repeat -55px -50px;
}
.newsletter .newsletter-inner .main-title {
      padding: 1.5rem 0;
    margin: 0 5% 0 20%;
}
.newsletter .newsletter-inner h2 {
  color: #fff;
}
.newsletter .newsletter-inner p.en {
  color: #b6e0ea;
  font-weight: 600;
  font-size: 1.14rem;
  margin: 0;
}
/*輸入框*/
.newsletter .newsletter-inner .newsletter-content {
  padding: .7rem 2.5rem .8rem .7rem;
  background: url("../images/newsletter-content.png") no-repeat 10% 105%;
      min-height: 265px;
}
.newsletter-form {
  margin: 0 0 0 10%;
}
.newsletter .newsletter-inner .form-group {
  overflow: hidden;
  margin-bottom: .5rem;
}
.newsletter .newsletter-inner .form-group label.grlabel {
  float: left;
  width: 30%;
  font-weight: 600;
  color: #fff;
  margin: 0;
  font-size: 0.98rem;
  text-align: right;
  padding-right: 1rem;
  font-size: 1.26rem;
  padding-left: 1.5rem;
}
.newsletter .newsletter-inner .form-group label.uns {
  background: url("../images/uns.png") no-repeat left 5px;
}
.newsletter .newsletter-inner .form-group label.pwds {
  background: url("../images/pwds.png") no-repeat left 5px;
}
.newsletter .newsletter-inner .form-control {
  float: left;
  width: 70%;
  color: #777;
  outline: none;
  border: none;
  border-radius: 3px;
  padding: 0.4rem 1rem;
  background: #ffff;
}

/*選擇按鈕*/
.newsletter .newsletter-inner .form-group.la label.grlabel{
	color: #3d626d;
	    font-size: 1.36rem;
}
.form-group .rdobutton {
float: left;
    width: 70%;
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
}
.form-group .rdobutton .rdobutton_label { /* 主外框 */
    position: relative;
    display:inline-block;
    float: left;
    width: 20px;
    height: 20px;
    margin: 0 5px 0;
    cursor: pointer;
    border: 1px solid #5eadb2;
    background: #fff;
    border-radius: 25px;
    -moz-transition: background-color 0.2s ease-in;
    -webkit-transition: background-color 0.2s ease-in;
    -o-transition: background-color 0.2s ease-in;
    transition: background-color 0.2s ease-in;
}

.form-group .rdobutton .rdobutton_label::before {
        content: "";
        position: absolute;
        top: 4px;
        left: 4px;
        width: 10px;
        height: 10px;
        background-color:#fff;
        border-radius: 25px;
        opacity: 0;
        -moz-transition: opacity 0.2s ease-in;
        -webkit-transition: opacity 0.2s ease-in;
        -o-transition: opacity 0.2s ease-in;
        transition: opacity 0.2s ease-in;
    }

.form-group .rdobutton input:checked + .rdobutton_label { /* 當check時 按鈕顏色改變 */
    background-color: #efd225;
}

.form-group .rdobutton .rdobutton_radio:checked + .rdobutton_label::before { /* 當check時 打勾消失 */
    opacity: 1;
}
.form-group .rdobutton span{
	float: left;
		color: #3d626d;
	    font-size: 1.2rem;
	    font-weight: 600;
	    margin-right: 10px;
}
.form-group .rdobutton .rdobutton_radio {
    display: none;
}

/*2登入登出*/
.form-group.login{
	overflow: hidden;
    margin-bottom: 0.5rem;
    font-size: 1.6rem;
    color: #3d626d;
}
.form-group.login span{
	    font-weight: 600;
    color: #cae9f1;
}
.form-group.loout{
	    padding: 1rem 0;

}
.form-group.loout a{
	background: #4492aa;
    padding: 0.25rem 1rem;
    border-radius: 30px;
    color: #fff;
    display: inline-block;
}
.form-group.loout a:hover{
	background: #42ae9b;
}

/*忘記密碼*/
.newsletter .newsletter-inner ul.member-link-cell {
  width: auto;
  float: right;
}
.newsletter .newsletter-inner ul.member-link-cell li {
  padding: 0 1rem .5rem 0;
  float: left;
  display: inline-block;
}
.newsletter .newsletter-inner ul.member-link-cell li a {
  color: #414d50;
  font-size: .92rem;
}
.newsletter .newsletter-inner ul.member-link-cell li a:hover {
  text-decoration: underline;
}
/*登入按鈕*/
.newsletter .newsletter-inner .main-btn {
  background: #3ea996;
  padding: 0.25rem 4rem;
  border: none;
  border-radius: 3px;
  margin: 0 0 0 30%;
  width: 70%;
  font-size: 1.2rem;
}
.newsletter .newsletter-inner .main-btn:hover {
  border-color: #3ea996;
}
/*===== 相關連結 =====*/
.link-boxe {
  background: #fff;
  overflow: hidden;
  padding: 0.5rem .25rem;
  margin: 1rem 0 0 0;
  box-shadow: rgba(0, 0, 0, 0.08) 0px 3px 12px;
  display: none;
}
.link-boxe ul.contact-box {
  list-style: none;
  padding: 0;
  display: flex;
  align-content: space-around;
  justify-content: space-between;
  flex-direction: row;
  width: 100%;
  flex-wrap: nowrap;
}
.link-boxe ul.contact-box li {}
.link-boxe ul.contact-box li span {
  display: none;
}
/*================= ///END-2-1(1) Newsletter(登入專區) + 相關連結 =================*/
/*================= 2-1(2) events最新消息 =================*/
.events {
  padding-right: 0;
  padding-left: 0;
  /*改變寬度RWD要改回*/
  -webkit-box-flex: 0;
  -ms-flex: 0 0 66.666667%;
  flex: 0 0 66.666667%;
  max-width: 66.666667%;
}
/*頁頭*/
.events-head {
  overflow: hidden;
  position: relative;
  width: 100%;
}
/*標題*/
.events-head .main-title {
  overflow: hidden;
  background: url("../images/events_h2.png") no-repeat 2rem top;
  padding: .25rem 0 .5rem 5.5rem;
}
.events-head .main-title h2, .events-head .main-title p.en {
  float: left;
  display: inline-block;
  width: auto;
}
.events-head .main-title p.en {
  margin: .6rem 0 0 .25rem;
  font-weight: 600;
}
/*MORE*/
.events-head .pricing-btn {
  position: absolute;
  top: 0;
  right: 0;
}
.events-head .pricing-btn a {
  background: #1aa1a9;
  margin: 0;
  padding: 0.3rem 1rem;
  border-radius: 3px
}
.events-head .pricing-btn a:hover {
  color: #fff;
}
/*消息框*/
.events .event-content {
  position: relative;
  background: #fff;
  padding: .5rem 1.2rem 1rem 1.2rem;
  overflow: hidden;
  width: 100%;
  box-shadow: rgba(0, 0, 0, 0.07) 0px 3px 12px;
  margin: 1rem 0 0 1rem;
}
/*列表*/
.events .event-content .event-info {}
.events .event-content .event-info li {
  display: inline-block;
  color: #888;
  letter-spacing: .4px;
  border-bottom: 1px solid #d8d8d8;
  padding: 0.6rem 0 .6rem 0;
  width: 100%;
  font-size: 1.14rem;
}
/*類型(四種顏色類型)*/
.events .event-content .event-info li span.type {
  display: inline-block;
  padding: .25rem .6rem;
  float: left;
  width: 8%;
  color: #fff;
  text-align: center;
  border-radius: 3px;
  margin-right: 1%;
}
.events .event-content .event-info li span.cer {
  background: #1aa1a9;
}
.events .event-content .event-info li span.act {
  background: #6eb548;
}
.events .event-content .event-info li span.oth {
  background: #c3b182;
}
.events .event-content .event-info li span.new {
  background: #f49d06;
}
.events .event-content .event-info li a {
  color: #434343;
  width: 70%;
  margin-right: 4%;
  float: left;
  margin-top: 5px;
  overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  white-space: normal;
}
.events .event-content .event-info li a:hover {
  color: #40aaaf;
}
/*日期*/
.events .event-content .event-info li span.event-date {
  display: inline-block;
  width: 15%;
  float: right;
  color: #869195;
  font-size: 1rem;
  text-align: right;
  padding: 5px 0.5rem 0 0;
  font-weight: 600;
}
/*================= ///END-2-1(2) events最新消息 =================*/
/* --------------------------------------
   2-2. Services(標單下載專區+活動錦集+認證公告)
-----------------------------------------*/
.informationarea {
  background: url("../images/informationarea.jpg") no-repeat center bottom;
  padding: 3rem 0;
}
/*================= 2-2(1)services表單下載專區 =================*/
.services {
  position: relative;
  overflow: hidden;
  background: #fff;
  padding: 0;
}
.services .row {
  margin-left: 0;
}
.services .col-lg-6 {
  padding: 0;
}
/*下載四塊外框*/
.services .service {
  background-color: #fff;
  text-align: center;
  padding: 0;
  position: relative;
  overflow: hidden;
  border-bottom: 4px solid #78a29f;
  padding: 0.89rem;
}
.services .service::after {
  position: absolute;
  content: "";
  display: block;
  background: #73a29426;
  width: 112px;
  height: 112px;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  margin-top: -40px;
  margin-left: -60px
}
.services .service .service-item {
  padding: 13px 0 10px 0;
  position: relative;
}
.services .service.on {
  margin-left: -15px;
}
.services .service.on p {
  text-align: center;
}
.services .service.tw .service-item::after {
  position: absolute;
  content: "";
  top: 0;
  height: 160px;
  right: 0;
  display: block;
  border-right: 3px #78a29f dashed;
}
/*== 滑過去出現的塊面顏色 ==*/
.services .service .service-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: rgba(123, 108, 213, .9);
  z-index: 1;
  opacity: 0;
  -webkit-transition: all .8s ease-in-out;
  -moz-transition: all .8s ease-in-out;
  -o-transition: all .8s ease-in-out;
  -ms-transition: all .8s ease-in-out;
  transition: all .8s ease-in-out;
}
.services .service:hover .service-bg, .services .service.two .service-bg {
  opacity: 1;
}
.services .service .service-bg .flaticon-lotus:before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 146px;
  color: #fff;
  opacity: .1;
  margin-left: 0;
}
.services .service .service-item {
  position: relative;
  z-index: 2;
}
.services .service .service-icon {
  text-align: center;
}
.services .service .service-icon i {
  background: #73a29426;
  display: inline-block;
  width: 70px;
  height: 70px;
  color: #fff;
  line-height: 70px;
  text-align: center;
  border-radius: 50%;
  -webkit-transition: all .2s cubic-bezier(.47, 0, .745, .715);
  transition: all .2s cubic-bezier(.47, 0, .745, .715);
  -webkit-animation: pulse 2s infinite cubic-bezier(.66, 0, 0, 1);
  animation: pulse 2s infinite cubic-bezier(.66, 0, 0, 1);
  -webkit-box-shadow: 0 0 0 0 rgba(123, 108, 213, .6);
  box-shadow: 0 0 0 0 rgba(123, 108, 213, .6);
}
@-webkit-keyframes pulse {
  to {
    -webkit-box-shadow: 0 0 0 9px rgba(123, 108, 213, 0);
    box-shadow: 0 0 0 9px rgba(123, 108, 213, 0);
  }
}
@keyframes pulse {
  to {
    -webkit-box-shadow: 0 0 0 9px rgba(123, 108, 213, 0);
    box-shadow: 0 0 0 9px rgba(123, 108, 213, 0);
  }
}
.services .service:hover .service-icon i, .services .service.two .service-icon i {
  background: transparent;
  -webkit-animation: none;
  animation: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.services .service .service-icon i:before {
  color: #fff;
  font-size: 45px;
  margin-left: 0;
}
/*標題*/
.services .service .service-item h3 {
  color: #2e2e2e;
  line-height: 1.4;
  font-weight: 600;
  text-transform: capitalize;
  margin: 0.5rem 0 0.2rem 0;
}
.services .service .service-item h3 a:hover {
  color: #e6794e;
}
.services .service .service-item h3 i.fa {
  color: #5da19c;
  margin-left: 5px;
}
.services .service p {
  min-height: 36px;
  margin: 0;
}
/*================= ///END-2-2(1) services表單下載專區 =================*/
/*================= ///END-2-2(2) Testimonials(活動花絮) =================*/
.testimonials {
  overflow: hidden;
  position: relative;
  margin: 0 auto;
  padding: 0;
  height: 100%;
}
.testimonials .flaticon-lotus:before {
  margin-left: 0;
  position: absolute;
  top: 25%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #585353;
  opacity: .05;
  font-size: 30em;
  z-index: 0;
  height: 368px;
  display: none;
}
/*左右(上下張)按鈕*/
.owl-theme .owl-nav {
  top: 50%;
  margin-top: -1rem;
  position: absolute;
  width: 100%;
  left: 0;
}
.testimonials .owl-carousel .owl-nav .owl-next, .testimonials .owl-carousel .owl-nav .owl-prev {
  font-size: 24px;
  color: #fff;
  width: 45px;
  height: 45px;
  line-height: 36px;
  text-align: center;
  background-color: transparent;
  border-radius: 3px;
  outline: none;
  z-index: 999;
  margin: 0 7px;
}
.testimonials .owl-carousel .owl-nav .owl-next:hover, .testimonials .owl-carousel .owl-nav .owl-prev:hover {
  background-color: #7b6cd5;
}
.testimonials .owl-carousel .owl-nav .owl-next {
  float: right;
  margin-right: .999rem;
}
.testimonials .owl-carousel .owl-nav .owl-prev {
  float: left;
  margin-left: .999rem;
}
.testimonials .owl-carousel .owl-nav i.fa{}

/*圖片框架*/
.testimonials .testimonial-box {
  background: transparent;
  padding: 0;
  text-align: center;
  width: 100%;
  margin: auto;
  overflow: hidden;
  position: relative;
}
.testimonials .testimonial-box .client-info {
  background: transparent;
}
/*輪播圖片*/
.testimonials .testimonial-box .client-pic {
  margin: auto;
  position: relative;
  z-index: 1;
}
.testimonials .testimonial-box .client-pic img {
  width: auto;
  height: auto;
  display: inline-block;
}
/*輪播圖片內文字*/
.testimonials .client-details {
  background: #00000080;
  padding: .5rem 1rem;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
  text-align: left;
  width: 100%;
  min-height: 60px;
}
.testimonials .client-details span.ico {
  color: #dcdbdb;
  float: left;
  position: relative;
  z-index: 1;
  display: inline-block;
  width: 5%;
}
.testimonials .client-details span.ico i.fa {
  font-size: 1.4rem;
}
.testimonials .client-details h4 {
  width: 80%;
  width: 95%;
  /*margin-right: 10%;*/
  display: inline-block;
  float: left;
  color: #fff;
  letter-spacing: .5px;
  text-transform: capitalize;
  font-weight: 600;
  position: relative;
  z-index: 1;
  line-height: 140%;
}

.testimonials .client-details h4 a{
  color: #fff;
}
.testimonials .client-details h4 a:hover{
  color: #a0e7eb;
}

/*more*/
.testimonials .pricing-btn {
  position: absolute;
  bottom: 0;
  right: 0;
  width: auto;
  display: inline-block;
  z-index: 2;
  display: none;
}
.testimonials .pricing-btn .main-btn {
  background: #e6794e;
  border: none;
  padding: .8rem 0.5rem;
}
.testimonials .pricing-btn .main-btn:hover {
  color: #fff;
}
.testimonials .pricing-btn .main-btn span {
  display: block;
}
/*================= ///END-2-2(2) Testimonials(活動花絮) =================*/
/*================= 2-2(3)  Pricing(認證公告) =================*/
.pricing {
  background: #40aaaf url("../images/pricing.png") no-repeat 110% 101%;
  overflow: hidden;
  padding: 0;
  position: relative;
}
.pricing::after, .pricing::before {
  position: absolute;
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.pricing::after {
  background: url("../images/pricing-plans-tr.png") no-repeat 101% -27%;
}
.pricing::before {
  background: url("../images/pricing-plans-lb.png") no-repeat -90% 102%;
}
/*主要外框*/
.pricing .pricing-plans {
  text-align: center;
  position: relative;
  z-index: 2;
  padding: 0 1.5rem;
}
/*標題頁頭*/
.pricing .pricing-plans .pricing-head {
  border-bottom: 1px solid #389e9e;
  position: relative;
  padding: 2rem 0 1.2rem 0;
}
.pricing .pricing-plans .pricing-head::after {
  position: absolute;
  content: "";
  display: block;
  border-radius: 50%;
  background: #30a3a3;
  width: 105px;
  height: 105px;
  top: 1rem;
  left: 0;
}
.pricing .pricing-plans .main-title {
  text-transform: capitalize;
  background: url("../images/pricing-title.png") no-repeat 20px center;
  position: relative;
  z-index: 1;
  overflow: hidden;
  padding: 0.5rem 0 0 120px;
}
/*主要標題*/
.pricing .pricing-plans .main-title h2 {
  color: #fff;
  margin-bottom: .25rem;
  position: relative;
}
.pricing .pricing-plans .main-title p.en {
  color: #83e1e1;
  font-size: 1.14em;
}
/*編輯器內容*/
.pricing .pricing-plans .pricing-price {
  border-top: 1px solid #5bcccc;
  position: relative;
  z-index: 1;
  padding: 1.5rem
}
.pricing .pricing-plans .pricing-price p {
  color: #fff;
  margin: 0;
  padding: 0;
  font-size: 1.2rem;
}
/*UL*/
.pricing .pricing-plans .pricing-features {
  margin: 0 auto;
  padding: 1.2rem 1rem;
  width: auto;
  display: inline-block;
}
.pricing .pricing-plans .pricing-features li {
  margin-bottom: 10px;
  text-align: left;
  color: #aaf9f9;
  font-weight: 600;
  font-size: 1.13rem;
}
.pricing .pricing-plans .pricing-features li i.fa {
  color: #dbf5f9;
  font-size: 1.5rem;
  margin-right: 2px;
}
/*more*/
.pricing .pricing-plans .pricing-btn {
  position: absolute;
  right: 2.5rem;
  top: 2.5rem;
  z-index: 2;
}
.pricing .pricing-plans a.main-btn {
  background: transparent;
  border: none;
  padding: 0;
  min-width: inherit;
  color: #fff;
  transition: color .1s;
  margin: 0;
  display: inline-block;
}
.pricing .pricing-plans .main-btn:hover {
  color: #fff !important;
  background: none;
}
.pricing .pricing-plans a.main-btn i.fa {
  font-size: 1.4rem;
  color: #ffff;
  font-weight: lighter;
}
.pricing .pricing-plans a.main-btn:before {
  background: none;
}
.pricing .pricing-plans a.main-btn span {
  font-size: 0;
}
/*================= ///END-2-2(3)  Pricing(認證公告) =================*/
/* --------------------------------------------------------------------------------------------
////////////////////////////////////////// 內頁用 /////////////////////////////////////////////
-----------------------------------------------------------------------------------------------*/
.innerpage {
  padding: 2rem 0;
  overflow: hidden;
}
.base-page {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
  margin: 0;
}
/*================= 指引導覽列 =================*/
.guidelist {
  margin: 0 0 0.5rem 0;
  letter-spacing: 1px;
  background: #f0f0f0;
  padding: 0.5rem 1rem;
  border-radius: 3px;
  width: 100%;
}
/*================= 主標題 =================*/
h2.h2_title {
  border-left: 15px solid #1aa1a9c4;
  padding: 0 0.5rem;
  margin: 1rem 0;
}
/*================= 內容區域 =================*/
.main_wrap {
  width: 100%;
  overflow: hidden;
}
.main_content {
  font-size: 1rem;
  line-height: 160%;
  padding: 1rem 1.5rem;
}
.main_content p {
  margin-bottom: .5rem;
}
.main_content iframe {
  width: 100%;
}
.main_content ul {
  padding: 0;
  margin: 0;
}
.main_content ul li {
  border-bottom: 1px #4c626340 dashed;
  padding: 0.4rem 0.25rem;
}
.main_content ul li i.fa,
.certification_instructions i.fa{
  font-size: .98rem;
  margin-right: 5px;
  color: #51ab79;
}
.main_content ul li a {}

/*需要下載圖式*/
.main_content ul.form_link{}
.main_content ul.form_link li{}
.main_content ul.form_link li a{
    /*background: url("../images/sheets.png") no-repeat left 2px;
    padding: 0 0 0 1.2rem;*/
}

/*================= 相簿頁面 =================*/
.album{
width: 100%;
overflow: hidden;
}
.album .pic_box{

}
.album .pic_list{
height: auto;
    width: 100%;
    bottom: 10px;
    margin: 0;
}

.album .list_s{
    width: auto;
    margin: 0;
}
.album .list_s:hover {
    border: 2px #a8f4f9 solid;

}

/*================= 搜尋後的內頁頁面 =================*/
.search_page {
  width: 100%;
  overflow: hidden;
}
.search_results {
  border: 1px solid #dfe1e5;
  border-radius: 3px;
  padding: 0.5rem 1rem;
}
/*標題*/
.search_results .en_title {}
.search_content {}
.search_content ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.search_content ul li {
  border-bottom: 1px dotted #ccc;
  overflow: hidden;
  padding: .5rem;
}
.search_content ul li span {
  float: left;
  display: inline-block;
  margin: .35rem .5rem 0 0;
}
.search_content ul li a {
  float: left;
  display: inline-block;
  display: block;
  font-size: 1rem;
}
.search_content ul li a:hover {
  color: #1aa1a9;
}

/*================= 更多more的內頁頁面 =================*/
.news_results{
 padding: 1rem;
    width: 100%;
    font-weight: 600;
    font-size: 1.26rem;
}

.news_results .kind{
  float: right;
}

.news_content{
  width: 100%;
}

.news_content table{
  width: 98%;
  margin: 0 1%;
}
.news_content table tr:nth-last-child(odd){
  background:#e7edec;
}
.news_content table th{
  font-weight: 600;
  padding:.8rem;
  color: #fff;
  text-align: center;
  font-size:1.12rem;
  background: #1fbba6;
}
.news_content table td{
  padding: .5rem;
}

.page_tab tr{
  background: #fff!important;
      line-height: 160%;
}

/*================= 認證說明 =================*/
.certification_instructions{
	width: 100%;
	overflow: hidden
	
	}

.certification_instructions .box{
	margin-bottom:2rem;
}
.certification_instructions p{}
.certification_instructions p.pad1{
	padding-left:1.2rem; 
}
.certification_instructions p.pad2{
		padding-left:3rem; 
}
.certification_instructions p.pad3{
			padding-left:4rem; 
}
.certification_instructions p.pad4{
			padding-left:5.5rem; 
}

/*================= 認證名冊 =================*/
.certification_list.box {
  overflow: hidden;
  width: 100%;
}
.certification_list.box span,
.certification_list.box li{
  display: inline-block;
  float: left;
 width: 14.28%;
}
.certification_list.box span a,
.certification_list.box li a{
margin: 1% 1% 5% 1%;
    display: block;
    background: #d4e0e263;
    border-radius: 25px;
    padding: 0.25rem 1rem;
    
}
.certification_list span a:hover,
.certification_list.box li a:hover{
	background: #40aaaf;
	color: #fff;
}


/*~~~~~~~~~~~~~~ 剩下的(還沒用到的section) ~~~~~~~~~~~~~~* /


/* --------------------------------------
   8. About Us
-----------------------------------------*/
.about-us {
  background-color: #f7f6f6;
  padding-top: 100px;
  padding-bottom: 100px;
  overflow: hidden;
}
.about-us .about-info h3 {
  font-size: 17px;
  letter-spacing: .4px;
  color: #7b6cd5;
  text-transform: capitalize;
  margin-bottom: 10px;
}
.about-us .about-info h4 {
  font-size: 25px;
  color: #323232;
  font-weight: 600;
  line-height: 1.3;
  text-transform: capitalize;
  margin-bottom: 20px;
}
.about-us .about-info p {
  font-size: 15px;
  line-height: 1.7;
  color: #888;
  margin-bottom: 25px;
}
.about-us .about-info p:first-of-type {
  margin-bottom: 10px;
}
.about-us .about-info .progress-container {
  position: relative;
  margin-bottom: 30px;
}
.about-us .about-info .progress-container .percent {
  position: absolute;
  top: -12px;
  width: 42px;
  height: 29px;
  line-height: 29px;
  text-align: center;
  background-color: transparent;
  color: #7b6cd5;
  font-size: 14px;
  font-weight: 600;
  border: 1px solid #7b6cd5;
  border-radius: 3px;
}
.about-us .about-info .progress-container .percent:before {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 50%;
  background-color: #f7f6f6;
  padding: 4px;
  display: block;
  border: 1px solid #7b6cd5;
  border-width: 0 1px 1px 0;
  transform: translateX(-50%) rotate(45deg);
}
.about-us .about-info .progress-container h4 {
  color: #323232;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .3px;
  text-transform: capitalize;
  margin-bottom: 10px;
}
.about-us .about-info .progress-container .progress {
  height: 1px;
  background: #e8e6f2;
}
.about-us .about-info .progress-container .progress-bar {
  width: 0;
  background: #7b6cd5;
  -webkit-transition: all 1.2s ease-in-out;
  -moz-transition: all 1.2s ease-in-out;
  -o-transition: all 1.2s ease-in-out;
  -ms-transition: all 1.2s ease-in-out;
  transition: all 1.2s ease-in-out;
}
.about-us .about-image {
  position: relative;
}
.about-us .about-image .about-bg {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.about-us .about-image .about-bg .flaticon-lotus:before {
  margin-left: 0;
  position: absolute;
  top: -42%;
  right: 0;
  font-size: 40em;
  width: 96%;
  height: 50%;
  color: #7b6cd5;
  opacity: .075;
}
.about-us .about-image img {
  position: relative;
  display: block;
  max-width: 100%;
  height: auto;
  z-index: 2;
}
/* --------------------------------------
   9. Schedule
-----------------------------------------*/
.class-schedule {
  padding-top: 100px;
  padding-bottom: 100px;
}
.class-schedule .filter-menu {
  text-align: center;
  margin-bottom: 50px;
}
.class-schedule .filter-menu .list-filter li {
  display: inline-block;
  margin: 0 10px 4px 0;
  padding: 8px 20px;
  background-color: transparent;
  color: #7b6cd5;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .2px;
  border: 1px solid #7b6cd5;
  border-radius: 4px;
  cursor: pointer;
}
.class-schedule .filter-menu .list-filter li:last-child {
  margin-right: 0;
}
.class-schedule .filter-menu .list-filter li.active {
  background-color: #7b6cd5;
  color: #fff;
}
.class-schedule .timetable table {
  width: 100%;
}
.class-schedule .timetable tr {
  border: 1px solid #e5e5e5;
  box-shadow: 0 0 2px rgba(0, 0, 0, .05);
}
.class-schedule .timetable tr td {
  border-right: 1px solid #e5e5e5;
  padding: 20px 10px;
  color: #888;
  font-size: 15px;
  box-shadow: 0 0 2px rgba(0, 0, 0, .05);
}
.class-schedule .timetable tr td.time, .class-schedule .timetable tr.table-head td {
  font-weight: 500;
}
.class-schedule .timetable tr td h4 {
  color: #7b6cd5;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 8px;
  text-transform: capitalize;
}
.class-schedule .timetable tr td span {
  font-size: 14px;
  letter-spacing: .5px;
}
.class-schedule .timetable tr td h5 {
  font-size: 14px;
  letter-spacing: .5px;
  margin-top: 8px;
  text-transform: capitalize;
}
.class-schedule .timetable-small .group-list {
  margin-bottom: 35px;
}
.class-schedule .timetable-small h3 {
  color: #323232;
  font-size: 17px;
  letter-spacing: .4px;
  margin-bottom: 20px;
  text-transform: capitalize;
}
.class-schedule .timetable-small ul li {
  display: block;
  background: #7b6cd5;
  color: #fff;
  padding: 10px 15px;
  position: relative;
  margin-bottom: 10px;
}
.class-schedule .timetable-small ul li h4 {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .4px;
  text-align: left;
  text-transform: capitalize;
}
.class-schedule .timetable-small ul li span {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 15px;
  font-size: 14px;
  letter-spacing: .4px;
}
/* --------------------------------------
   10. Call To Action
-----------------------------------------*/
.call-to-action {
  background: #7b6cd5;
  color: #fff;
  padding: 65px 0;
  position: relative;
}
.call-to-action .flaticon-lotus:before {
  margin-left: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: .06;
  font-size: 15em;
  z-index: 1;
}
.call-to-action .content {
  position: relative;
  z-index: 2;
}
.call-to-action h3 {
  font-size: 35px;
  margin-bottom: 20px;
  text-transform: capitalize;
}
.call-to-action p {
  color: #f1f3f1;
  font-size: 15px;
  font-weight: 400;
  margin-bottom: 0;
}
.call-to-action .main-btn {
  margin-top: 25px;
}
/* --------------------------------------
   12. Our Team
-----------------------------------------*/
.team {
  padding-top: 100px;
  padding-bottom: 100px;
  overflow: hidden;
  background-color: #f7f6f6;
}
.team .member .member-img {
  border-radius: 8px;
  position: relative;
  overflow: hidden;
}
.team .member .member-img img {
  display: block;
  max-width: 100%;
  height: auto;
}
.team .member .member-img:hover img {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
}
.team .member .member-img .overlay {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(0, 0, 0, .5);
  transform: scaleX(0);
  -webkit-transition: all .5s ease-in-out;
  -moz-transition: all .5s ease-in-out;
  -o-transition: all .5s ease-in-out;
  -ms-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}
.team .member .member-img:hover .overlay {
  transform: scaleX(1);
}
.team .member .member-img .overlay .social-media {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
.team .member .member-img .social-media i {
  display: inline-block;
  width: 35px;
  height: 35px;
  line-height: 35px;
  text-align: center;
  border-radius: 50%;
  font-size: 16px;
  font-weight: 600;
  background: #7b6cd5;
  color: #fff;
  margin-right: 6px;
  transform: translateY(40px);
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all .5s ease-in-out;
  -moz-transition: all .5s ease-in-out;
  -o-transition: all .5s ease-in-out;
  -ms-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}
.team .member .member-img .social-media i:hover {
  background: #604dd6;
}
.team .member .member-img:hover .social-media i {
  transform: translateY(0);
  visibility: visible;
  opacity: 1;
}
.team .member .member-img:hover .social-media .fa-facebook {
  -webkit-transition-delay: 0s;
  -o-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;
}
.team .member .member-img:hover .social-media .fa-twitter {
  -webkit-transition-delay: .15s;
  -o-transition-delay: .15s;
  -moz-transition-delay: .15s;
  -o-transition-delay: .15s;
  transition-delay: .15s;
}
.team .member .member-img:hover .social-media .fa-google-plus {
  -webkit-transition-delay: .3s;
  -o-transition-delay: .3s;
  -moz-transition-delay: .3s;
  -o-transition-delay: .3s;
  transition-delay: .3s;
}
.team .member .member-img:hover .social-media .fa-instagram { 
  -webkit-transition-delay: .45s;
  -o-transition-delay: .45s;
  -moz-transition-delay: .45s;
  -o-transition-delay: .45s;
  transition-delay: .45s;
}
.team .member .member-info .member-name {
  color: #323232;
  font-size: 20px;
  line-height: 1;
  letter-spacing: .3px;
  margin-top: 20px;
  margin-bottom: 6px;
  text-align: center;
  font-weight: 600;
  text-transform: capitalize;
}
.team .member .member-info span {
  display: block;
  color: #7b6cd5;
  font-weight: 400;
  text-align: center;
}
/* --------------------------------------
   15. Blog
-----------------------------------------*/
.blog {
  padding-top: 100px;
  padding-bottom: 100px;
  background: #fff;
}
.blog .post {
  background-color: #f7f6f6;
  border: 1px solid #e8e5f5;
  border-radius: 4px;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, .05);
  margin-bottom: 30px;
}
.blog .post-img img {
  display: block;
  max-width: 100%;
  height: auto;
}
.blog .post .post-content {
  padding: 20px 0;
  position: relative;
}
.blog .post .post-content .post-title h4 {
  color: #3e3e3e;
  letter-spacing: .5px;
  margin-bottom: 15px;
  font-weight: 600;
  padding: 0 20px;
}
.blog .post .post-content:hover .post-title h4 {
  color: #7b6cd5;
}
.blog .post .post-content .post-text p {
  line-height: 1.8;
  font-weight: 400;
  padding: 0 20px;
  margin-bottom: 0;
  color: #888;
  font-size: 15px;
}
.blog .post .post-content .post-info {
  margin-bottom: 0;
  padding: 15px 20px 0;
  overflow: hidden;
}
.blog .post .post-content .post-info li {
  display: inline-block;
  color: #888;
  letter-spacing: .3px;
  font-weight: 500;
  font-size: 15px;
  line-height: 1;
}
.blog .post .post-content .post-info li .post-more {
  color: #7b6cd5;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 13px;
}
.blog .post .post-content .post-info li .post-more i {
  margin-left: 4px;
}
.blog .post .post-content .post-date {
  position: absolute;
  top: -60px;
  right: 0px;
  width: 50px;
  height: 60px;
  background: #7b6cd5;
  border: 1px solid #7b6cd5;
  color: #fff;
  border-radius: 4px 0 0 4px;
  text-align: center;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .3px;
}
.blog .post .post-content .post-date span {
  display: block;
  line-height: 1;
  margin-top: 12px;
}
.blog .my-btn {
  text-align: center;
  margin-top: 20px;
}
/* --------------------------------------
   16. Contact
-----------------------------------------*/
.contact {
  position: relative;
  padding-top: 100px;
  padding-bottom: 100px;
  overflow: hidden;
  background-color: #f7f6f6;
}
.contact .flaticon-lotus:before {
  margin-left: 0;
  position: absolute;
  top: 41%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #7b6cd5;
  opacity: .027;
  font-size: 26em;
  z-index: 0;
}
.contact .contact-form {
  position: relative;
}
.contact .contact-form .form-group {
  position: relative;
  margin-bottom: 40px;
}
.contact .contact-form .form-group .form-control {
  background-color: transparent;
  color: #666;
  border: 0;
  border-bottom: 1px solid #bcb4ef;
  outline: none;
  box-shadow: none;
  border-radius: 0;
  height: 46px;
  padding: 12px;
}
.contact .contact-form .form-group textarea.form-control {
  height: 120px;
  resize: none;
  padding-top: 18px;
}
.contact .contact-form .form-group label {
  position: absolute;
  top: 13px;
  left: 12px;
  width: 100%;
  margin-bottom: 0;
  font-weight: 400;
  cursor: text;
  color: #888;
  font-size: 15px;
}
.contact .contact-form .form-group .form-control:focus ~ label, .contact .contact-form .form-group input:not([value=""]) ~ label, .contact .contact-form .form-group textarea:not([data-value=""]) ~ label {
  top: -16px;
  left: 0;
  font-size: 14px;
  letter-spacing: .5px;
  font-weight: 500;
}
.contact .contact-form .form-group .form-control:focus ~ label {
  color: #7b6cd5;
}
.contact .contact-form .form-group .input-border {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #7b6cd5;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -o-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
}
.contact .contact-form .form-group .form-control:focus ~ .input-border {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.contact .contact-form .contact-btn {
  float: right;
  margin: 0;
}
.contact .contact-form .form-message {
  position: absolute;
  left: 0;
  bottom: -153px;
  width: 100%;
  color: #fff;
  border-radius: 5px;
  font-size: 15px;
  padding: 12px;
  text-transform: uppercase;
}
.contact .contact-form .form-message.success {
  background-color: #37983b;
}
.contact .contact-form .form-message.error {
  background-color: #f54033;
}
/* --------------------------------------
   20. Media Queries
-----------------------------------------*/
/* Extra Large Devices */
@media (min-width: 1200px) {}
/* Large devices (desktops, less than 1200px) */
@media (min-width: 992px) and (max-width: 1199.98px) {
  /*=========== Navbar ============*/
  .header-inner .navbar .nav > li {
    margin-right: 10px;
  }
  /*==================== 新增加 =====================*/
  /*== 主選單 ==*/
  .header-inner .navbar .nav li a {
    padding: 1rem 2.6rem;
  }
  /*==  搜尋視窗 ==*/
  .header-inner .search-form {
    top: 62px;
  }
  /*首頁內容*/
  .container .row {
    padding: 0 15px;
  }
  .container .row .row {
    padding: 0;
  }

  /*== 電子化認證系統 ==*/
  .newsletter{
  	    max-width: 380px;
  }
.newsletter .newsletter-inner .main-title {
    margin: 0 5% 0 5%;
}

  /*== 最新消息 ==*/
  .events {
    -ms-flex: 0 0 60.333333%;
    flex: 0 0 60.333333%;
    max-width: 60.333333%;
  }
  .events .event-content .event-info li span.type {
      width: 10%;
    padding: 0.25rem 0.5rem;
  }
  /*== 公告認證 ==*/
  .pricing .pricing-plans {
    padding: 0 1rem;
  }
  .pricing .pricing-plans .pricing-price {
    padding: 1.5rem .5rem 0 .5rem;
  }
  .pricing .pricing-plans .pricing-features {
    padding: 1rem;
  }
  /*== 表單下載專區 ==*/
  .services .service.tw .service-item::after {
    right: -0.7rem;
  }
  .services .service p {
    letter-spacing: -1px;
  }
  /*== 頁底開闔選單內容 ==*/
  .footer .footer-top .card-body {
    padding: 1.2rem 0;
  }
  .footer .footer-top .card-body .container {
    padding: 0;
  }
  .footer .footer-top .footer-item {
    width: 19%;
  }
  .footer .footer-bottom .copyright p {
    width: 76%;
  }
  /*====================================================*/

/*================= 認證名冊 =================*/
.certification_list span,
.certification_list.box li{  
 width: 16.666%;
}



}
/* Medium devices (tablets, less than 992px) */
@media (min-width: 768px) and (max-width: 991.98px) {
  /*取消手機按鈕樣式*/
  input, select {
    -webkit-appearance: none; /* Safari 和 Chrome，常用於iOS下移除內建樣式 */
    -moz-appearance: none; /* FireFox */
    appearance: none;
  }
  .upper-bar .container {
    padding: 0;
  }
  /*== LOGO ==*/
  .upper-bar .inner-bar .col-lg-8.col-12 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .header-inner .my-logo {
    float: left;
  }
  /*== TOP選單 ==*/
  .upper-bar .inner-bar .col-lg-4.col-12 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
    padding: 0;
  }
  .header-inner .search-form {
    top: 69px;
  }
  /*== banner輪播 ==*/
  .home {
    height: 48vh;
  }
  /*=========== Navbar ============*/
  .header-inner .main-menu {}
  .header-inner .navbar {
    float: left;
  }
  .header-inner .navbar-nav {
    flex-direction: row;
  }
  .header-inner .navbar .nav li a {
    padding: 1rem 1.1rem;
  }
  .header-inner .main-menu .container {
    padding: 0;
  }
  /*=========== Footer ==========*/
  /*====== 首頁模組 ======*/
  .row {
    flex-direction: column;
  }
  /*== 電子認證系統+相關連結+最新消息 ==*/
  .announcement {
    padding: 2.5rem 0 1rem 0;
    background-position: left center;
  }
  .newsletter, .events {
    width: 100%;
    max-width: 100%;
    margin-bottom: 2rem;

  }
    .newsletter{
    	display: flex;
    }
.newsletter .newsletter-inner .main-title {
    margin: 0 20% 0 20%;
}

.newsletter .newsletter-inner .newsletter-content{
	padding: 0 15%;
	background-size: 16%;
}
.newsletter-form{
	margin: 0;
}
.newsletter .newsletter-inner .form-group label.grlabel{
	    width: 25%;
    background-position: 30% 5px;
}

.newsletter .newsletter-inner .main-btn {
margin: 0 0 0 25%;
    width: 70%;
}

  .newsletter .newsletter-inner {
    background-size: cover;
    width: 68%;
    float: left;
  }
  .link-boxe {
    width: 30%;
    padding: 1rem;
    float: right;
    margin: 0 0 0 2%;
  }
  .link-boxe ul.contact-box {
    flex-direction: column;
  }
  .link-boxe ul.contact-box li {
    margin: 0.5rem 0;
  }
  .events .event-content {
    margin: 1rem 0 0 0;
  }
  .events .event-content .event-info li span.type {
    width: 10%;
  }
  /*====== 表單下載專區 ======*/
  .informationarea {
    background-color: #e3eeec;
  }
  .informationarea .row {
    flex-direction: initial;
  }
  .services {
    margin-bottom: 2rem;
  }
  .services .col-lg-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  /*====== 活動花絮 ======*/
  .testimonials {
    margin-bottom: 2rem;
  }
  .testimonials .client-details {
    min-height: 66px;
  }
  .testimonials .testimonial-box .client-pic img {
    width: 100% !important;
    min-height: 656px;
  }
  /*====== Pricing(認證公告) ======*/
  .pricing .pricing-plans .pricing-features {
    width: 100%;
  }
  /*====== 頁底選單 ======*/
  .footer .footer-top .container {
    padding: 0;
  }
  .footer .footer-top .footer-menu {
    padding: 0;
  }
  .footer .footer-top .card-body {
    padding: 1.25rem 0;
  }
  .footer .footer-top .footer-item {
    width: 19.4%;
  }
  .footer .footer-bottom .copyright p {
    width: 65%;
  }
  /*===== footer頁底 =====*/


.main_content p img{
  width: 100%!important;
  max-width: 100%!important;
  height:auto!important ;
}


/*================= 認證名冊 =================*/
.certification_list span,
.certification_list.box li{  
 width: 25%;
}


}
/* Small Devices  (暫時用不到)*/
@media (max-width: 767.98px) {
  /*=========== Upper bar ============*/
  .upper-bar .inner-bar .col-12.col-lg-4 {
    background-color: #1aa1a9;
    padding: 0.8rem 0 0.5rem 0;
    order: -1;
  }
  .upper-bar .inner-bar .social-media-bar li {
    margin: 0 0.5rem;
    position: relative;
  }

  .upper-bar .inner-bar .social-media-bar li::after {
    content: "";
    background: #fff;
    width: 5px;
    height: 5px;
    position: absolute;
    top: 0.6rem;
    right: -0.8rem;
    z-index: 2;
    display: block;
    border-radius: 50%;
  }
  .upper-bar .inner-bar .social-media-bar li:last-child::after {
    display: none;
  }
  .upper-bar .inner-bar .social-media-bar li a {
    color: #fff;
  }
  .header-inner .nav-search li a {
    color: #fff;
  }
  .upper-bar .inner-bar .social-media-bar li.login {
  display: inline-block;
  }
  /*=========== Navbar ============*/
  .header-inner .menu-toggle {
    display: block;
  }
  .header-inner .nav-search {}
  .header-inner .navbar {
    float: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
    z-index: 99999;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: scaleY(0);
    -moz-transform: scaleY(0);
    -ms-transform: scaleY(0);
    -o-transform: scaleY(0);
    transform: scaleY(0);
    transform-origin: 0 0;
  }
  .header-inner.menu-active .navbar {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    transform: scaleY(1);
    max-height: 543px;
    overflow-y: auto;
    overflow-x: hidden;
  }
  .header-inner .navbar .nav > li {
    margin-right: 0;
  }
  .header-inner .navbar .nav li a {
    padding: 1rem 3rem;
    border-bottom: 1px solid #d5d5d5;
    font-weight: 600;
    color: #2e2e2e;
  }
  .header-inner .navbar .nav li a:before {
    content: none;
  }
  .header-inner .navbar .nav li a i {
    position: absolute;
    right: 30px;
    top: 10px;
    font-size: 15px;
    line-height: 44px;
  }
  .header-inner .navbar .nav .dropdown {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    opacity: 1;
    visibility: visible;
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    transform: scaleY(1);
    display: none;
    transition: none;
  }
  .header-inner .navbar .nav li .dropdown li {
    position: relative;
  }
  .header-inner .navbar .nav li .dropdown li a {
    padding-left: 3.5rem;
  }
  .header-inner .navbar .nav li .dropdown li::after {
    content: "";
    position: absolute;
    display: block;
    border-radius: 50%;
    width: 2px;
    height: 2px;
    background: #1fa3ab;
    left: 5px;
    top: 5px;
    z-index: 2;
  }
  .header-inner .navbar .nav li .dropdown li a:hover {
    padding-left: 3.5rem;
  }
  /*=========== Footer ============*/
  .footer .footer-top {
    padding-top: 160px;
    padding-bottom: 40px;
  }
  .footer .footer-top .footer-menu {
    margin-bottom: 30px;
  }
}
/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
  /*=========== Upper bar ============*/
  .upper-bar .col-12 {
    padding: 0;
  }
  .header-inner .container {
    padding: 0;
  }
  .upper-bar .inner-bar {
    border-radius: 0;
    padding: 0 1.5rem;
  }
  .upper-bar .inner-bar .col-12 {
    padding: 0;
    margin: 0;
  }
  /*=========== Navbar ============*/
  .header-inner .my-logo {
    padding: 1rem 0.8rem 1rem 0.8rem;
    width: 82%;
  }
  .header-inner .my-logo img {
    width: 100%;
    height: auto;
  }
  .navbar-nav {
    border-top: 1px solid #d0eced;
  }
  /*=========== Home ============*/
  .home {
    height: 15vh;
  }
  .home .bg-cover {
    background-size: contain
  }
  .home .home-content .custom-btn {
    margin-top: 12px;
  }
  /*===== 認證系統+頁底選單隱藏 =====*/
  .announcement {
    padding: 2rem 0 2rem 0;
    padding: 0;
  }
  .newsletter .newsletter-inner, .footer-top {
    display: none;
  }
  .newsletter {
    order: 2;
    /*order: 1;*/

  }
  .link-boxe {
    padding: 1rem .5rem;
    box-shadow: none;
  }
  .link-boxe ul.contact-box li {
    padding: .5rem;
  }
  .link-boxe ul.contact-box li img {
    width: 100%;
  }
  .informationarea {
    background: #e3eeec;
  }
  .events {
    order: 1;
    width: 100%;
    flex: 0 0 100%;
    max-width: 100%;
    position: relative;
    margin-bottom: 3rem;
  }
  .events-head {
    position: unset;
  }
  .events .event-content {
    margin: 0 auto;
    margin-top: 1rem;
    margin-bottom width: 90%;
    box-shadow: none;
  }
  .events .event-content .event-info li {
    display: flex;
    flex-wrap: wrap;
  }
  .events .event-content .event-info li span.type {
    width: 20%;
    order: 1;
  }
  .events .event-content .event-info li span.event-date {
    order: 2;
    width: auto;
    margin: 2px 0 0 0.25rem;
  }
  .events .event-content .event-info li a {
    width: 100%;
    display: block;
    order: 3;
    margin: 0;
    padding: 5px;
  }
  .events-head .pricing-btn {
    top: inherit;
    bottom: -2.5rem;
    z-index: 3;
    width: 100%;
    text-align: center;
  }
  .events-head .pricing-btn a {
    padding: 0.3rem 3rem;
  }
  /*====== 表單下載專區 ======*/
  .informationarea {
    padding: 2rem 0.8rem;
  }
  .informationarea .container {
    padding: 0;
  }
  .informationarea .row {
    flex-direction: initial;
  }
  .services {
    margin: 0 1rem;
  }
  .services .col-lg-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  /*====== 活動花絮 ======*/
  .testimonials {
    padding: 1.5rem 0 0 0;
    margin-bottom: 1.5rem;
  }
  .owl-carousel.owl-loaded {}
  .testimonials .testimonial-box .client-pic img {
    width: 100% !important;
    height: 300px !important;
  }
  /*====== 認證公告 ======*/
  .pricing {
    margin: 0 1rem;
  }
  .pricing .pricing-plans {
    padding: 0 1rem;
  }
  .pricing .pricing-plans .pricing-price {
    padding: 1.5rem .25rem;
  }
  .pricing .pricing-plans .pricing-features {
    padding: 1rem 1rem 1rem 1rem;
    float: none;
  }
  /*=========== Footer ============*/
  .footer .copyright {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .footer .footer-bottom .copyright p {
    margin-left: 0;
    margin-bottom: .5rem;
    font-size: .95rem;
    letter-spacing: -.5px;
  }
  .footer .footer-bottom .rq {
    order: 2;
  }
  .footer .footer-bottom .logo {
    order: 3;
  }

  .footer .footer-bottom .copyright p span{
        display: block;
    margin-bottom: 10px;
    line-height: 120%;
  } 
    .footer .footer-bottom .copyright p br{
      display: none;
    }

  /*====== 內頁 ======*/
  .innerpage {
    padding:1rem 0;
}
  h2.h2_title {
    font-size: 1.8rem;
  }
  /*消息內頁用*/
  h2.h2_title.new{
        font-size: 1.4rem;
  }


  .main_wrap {
    padding: 0;
  }
  .main_content {
    padding: 0;
  }

.main_content p img{
  width: 100%!important;
  max-width: 100%!important;
  height:auto!important ;
}

/*================= 認證名冊 =================*/
.certification_list span
.certification_list.box  li{  
 width:50%;
}


}

@media only screen and (max-width:414px) {
  .home {
    height: 12vh;
}

/*登入*/
.main_content .card-body{
	padding: 1.25rem .5rem; 
}
.main_content .card-body .form-group{
	margin: 0 5%;
	width: 90%;
}

.main_content .card-body .form-group .btn-primary{
	margin: 0 auto;
	margin-top: 1rem ;
	width: 100%;
}
.main_content .card-body .form-group .btn-link{
	width: 49%;
}


}



@media only screen and (max-width:375px) {
   .home {
    height: 14vh;
}
}