/*
  date 20180508
*/
/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body {
  background: #fff;
  color: #666666;
  /*font-family: "Open Sans", sans-serif;*/
  font-size:18px;
  font-family: ProximaNova,\\5FAE\8EDF\6B63\9ED1\9AD4,Microsoft JhengHei,Helmet,Freesans,sans-serif;
  overflow-x: hidden;
  padding: 0px;
  margin:0px;
}

a {
  color: #3C68EA;
  transition: 0.5s;
}

a:hover, a:active, a:focus {
  color: #1dc9ce;
  outline: none;
  text-decoration: none;
}
:focus {
    outline-width:0px;
}
p {
  padding: 0;
  margin: 0 0 30px 0;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  margin: 0 0 20px 0;
  padding: 0;
}

img{
	max-width:100%;
}

/* Back to top button */
.back-to-top {
  position: fixed;
  display: none;
  background: linear-gradient(45deg, #666, #999);
  color: #fff;
  padding: 2px 20px 8px 20px;
  font-size: 16px;
  border-radius: 4px 4px 0 0;
  right: 15px;
  bottom: 0;
  transition: none;
}

.back-to-top:focus {
  background: linear-gradient(45deg, #444, #5e5e5e);
  color: #fff;
  outline: none;
}

.back-to-top:hover {
  background: #444;
  color: #fff;
}
select, option{
    font-size:14px !important; 
    color:#495057 !important;
    padding: .375rem .75rem !important;
    min-height: auto !important;
}
.marqueeArea{
  padding: 5px 0 5px 0;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  font-size:16px;
  line-height:16px;
}
.cursorPoint{
	cursor:pointer;
}
/*----------------------------
.container
----------------------------*/
.container iframe{
	max-width:100% !important;
}
@media (min-width: 576px){
.container {
    max-width: 98%;
}
}
@media (min-width: 768px){
    .container {
        max-width: 99%;
    }
}
@media (min-width: 992px){
    .container {
        max-width: 960px;
    }
}
@media (min-width: 1200px){
    .container {
        max-width: 1140px;
    }
}
/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.relative_header
{
	position:relative;
	width:100%;
	height:100%;
}
.header_mabso_logo
{
	position:absolute;
	right:40%;
	bottom:-16px;
	z-index:99;
	max-width:230px;
}
@media (max-width: 768px){
	.header_mabso_logo
	{
		opacity:0.2;
		right:0px;
	}
}
#header {
  position: fixed;
  left: 0;
  top: 25px;
  right: 0;
  z-index: 997;
    
  /* background: linear-gradient(45deg, #3C68EA, #1dc8cd); */
  background-color:#fff;
  padding: 16px 0;
  height: 64px;
  transition: all 0.5s;
}

#header #logo {
  float: left;
  z-index:100;
}

#header #logo h1 {
  font-size: 30px;
  margin: -4px 0 0 0;
  padding: 0;
  line-height: 1;
  display: inline-block;
  font-family: "Montserrat", sans-serif;
  font-weight: 300;
  letter-spacing: 3px;
}

#header #logo h1 a, #header #logo h1 a:hover {
  color: #fff;
}

#header #logo img {
  padding: 0;
  margin: 0;
  max-height: 45px;
  margin-top: -10px;
}
.myNavOther{
     display: none;
}
.myHeaderOtherNav{
   position: fixed;
   top:0px;
   left:0px;
   width:100%;
   background-color: #ffecef;
   height:25px;
   font-size: 12px;
   text-align: right;
   z-index: 997;
   padding-top:2px;
}
.myHeaderOtherNav a{
    color:#757575;
    font-size: 10px;
}
.myHeaderOtherNav_sign, .myHeaderOtherNav_history
{
	background-color: #f7f7f7;
}
.myFixedHeight{
    height:89px;
}

@media (max-width: 768px) {
  #header #logo h1 {
    font-size: 28px;
    margin-top: 0;
  }
    
    #header #logo{
        width: 100%;
        text-align: center;
    }
    #header #logo img{
        float: none;
    }
    
    .myCart_member{
        display: none;
    }
    .myNavOther{
     display: block;
    }
    .myHeaderOtherNav{
        display: none;
    }
    #header {
        top:0px;
    }
    .myFixedHeight{
        height:64px;
    }
}
/*--------------------------------------------------------------
# nivo slider
--------------------------------------------------------------*/
/* The Nivo Slider styles */

#nivo-slider {
  position: relative;
}

#featured #nivo-slider .row, #featured #nivo-slider .row-fluid {
  margin-bottom: 0;
}

.nivo-slider {
  background: #fbfbfb;
}

.slides {
  margin: 0;
  overflow: hidden;
}

.slides li {
  list-style-type: none;
}

.nivoSlider, .nivo-slider {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
  margin: 0;
}

.nivo-slider img {
  position: absolute;
  top: 0px;
  left: 0px;
  max-width: none;
}

.nivo-main-image {
  display: block !important;
  position: relative !important;
  width: 100% !important;
}

/* If an image is wrapped in a link */

.nivoSlider a.nivo-imageLink {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0;
  margin: 0;
  z-index: 6;
  display: none;
  background: white;
  filter: alpha(opacity=0);
  opacity: 0;
}

/* The slices and boxes in the Slider */

.nivo-slice {
  display: block;
  position: absolute;
  z-index: 5;
  height: 100%;
  top: 0;
}

.nivo-box {
  display: block;
  position: absolute;
  z-index: 5;
  overflow: hidden;
}

.nivo-box img {
  display: block;
}
/* Direction nav styles (e.g. Next & Prev) */

.nivo-directionNav a {
  position: absolute;
  bottom: 0px;
  z-index: 9;
  cursor: pointer;
}

.nivo-prevNav {
  right: 0px;
}

.nivo-nextNav {
  right: 0px;
}

/* Control nav styles (e.g. 1,2,3...) */

.nivo-controlNav {
  text-align: center;
  padding: 20px 0;
}

.nivo-controlNav a.active {
  background-position: 0 -22px;
}

.nivo-directionNav a {
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  /* sprites.less reset */
  display: inline;
  line-height: normal;
  vertical-align: baseline;
  background-image: none;
  background-position: 0% 0%;
  background-repeat: repeat;
  margin-top: 0;
  margin: 0;
  display: inline-block !important;
  text-align: center !important;
  color: #fff;
  width: 30px;
  height: 24px;
  padding: 2px;
  font-size: 24px;
  line-height: 18px;
  text-shadow: none;
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.4);
  right: 15px;
}

.nivo-directionNav a {
  opacity: 1;
}

a.nivo-nextNav {
  right: 5px;
  bottom:5px;
}

a.nivo-nextNav:before {
  content: "\f105";
  color: #fff;
}

a.nivo-prevNav {
  right: 40px;
  bottom:5px;
}

a.nivo-prevNav:before {
  content: "\f104";
  color: #fff;
}

.nivo-controlNav.nivo-thumbs-enabled {
  width: 100%;
}

.nivo-controlNav.nivo-thumbs-enabled a {
  width: auto;
  height: auto;
  background: none;
  margin-bottom: 5px;
}

.nivo-controlNav.nivo-thumbs-enabled img {
  display: block;
  width: 120px;
  height: auto;
}

.nivo-controlNav a {
  display: inline-block;
  width: 22px;
  height: 22px;
  background: url(../img/nivo-bullets.png) no-repeat;
  text-indent: -9999px;
  border: 0;
  margin: 0 2px;
}

.nivo-control.active {
  background-position: 0 0;
}
/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/* Nav Menu Essentials */
.nav-menu, .nav-menu * {
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav-menu ul {
  position: absolute;
  display: none;
  top: 100%;
  left: 0;
  z-index: 99;
}

.nav-menu li {
  position: relative;
  white-space: nowrap;
}

.nav-menu > li {
  float: left;
}

.nav-menu li:hover > ul,
.nav-menu li.sfHover > ul {
  display: block;
}

.nav-menu ul ul {
  top: 0;
  left: 100%;
}

.nav-menu ul li {
  min-width: 180px;
}

/* Nav Menu Arrows */
.sf-arrows .sf-with-ul {
  padding-right: 30px;
}

.sf-arrows .sf-with-ul:after {
  content: "\f107";
  position: absolute;
  right: 15px;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
}

.sf-arrows ul .sf-with-ul:after {
  content: "\f105";
}

/* Nav Meu Container */
#nav-menu-container {
  float: right;
  margin: 0;
}
.nav_textcolor_sign .nav-menu a
{
	color:#8CD9D6 !important;
}
.nav_textcolor_history .nav-menu a
{
	color:#3296FF !important;
}

@media (max-width: 768px) {
  #nav-menu-container {
    display: none;
  }
}

/* Nav Meu Styling */
.nav-menu a {
  padding: 5px 8px 5px 8px;
  text-decoration: none;
  display: inline-block;
 /*  color: #fff; */
  color:#666;
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 14px;
  outline: none;
  
  transition: all .15s ease-in-out;
}
.nav-menu a:hover {
	color:#a1a1a1;
}

.nav-menu > li {
  margin-left: 10px;
}

.nav-menu ul {
  margin: 4px 0 0 0;
  padding: 10px;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  background: #fff;
}

.nav-menu ul li {
  transition: 0.3s;
}

.nav-menu ul li a {
  padding: 10px;
  color: #333;
  transition: 0.3s;
  display: block;
  font-size: 13px;
  text-transform: none;
}

.nav-menu ul li:hover > a {
  color: #1dc8cd;
}

.nav-menu ul ul {
  margin: 0;
}

/* Mobile Nav Toggle */
#mobile-nav-toggle {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 999;
  margin: 12px 0 0 12px;
  border: 0;
  background: none;
  font-size: 24px;
  display: none;
  transition: all 0.4s;
  outline: none;
  cursor: pointer;
}

#mobile-nav-toggle i {
  color: #ff97a7;
}

.mobile_body_sign #mobile-nav-toggle i {
  color: #8CD9D6 !important;
}
.mobile_body_history #mobile-nav-toggle i {
  color: #3296FF !important;
}

#mobile-nav-member, #mobile-nav-cart{
    display: none;
}
.notLogin{
	display: none;
}
@media (max-width: 768px) {
  #mobile-nav-toggle {
    display: inline;
  }
    
  #mobile-nav-member{
      display: inline;
      color:#ffffff;
      position: fixed;
      right: 40px;
      top: 0;
      z-index: 999;
      margin: 12px 12px 0 0;
      border: 0;
      background: none;
      font-size: 24px;
      transition: all 0.4s;
      outline: none;
      cursor: pointer;
    }
    #mobile-nav-cart
    {
      display: inline;
      color:#ffffff;
      position: fixed;
      right: 0;
      top: 0;
      z-index: 999;
      margin: 12px 12px 0 0;
      border: 0;
      background: none;
      font-size: 24px;
      transition: all 0.4s;
      outline: none;
      cursor: pointer; 
    }
}

/* Mobile Nav Styling */
#mobile-nav {
  position: fixed;
  top: 64px;
  padding-top: 18px;
  bottom: 0;
  z-index: 998;
  background: #fff;
  left: -260px;
  width: 260px;
  overflow-y: auto;
  transition: 0.4s;
  border-right:1px solid #e5e5e5;
}

#mobile-nav ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

#mobile-nav ul li {
  position: relative;
  border-bottom:1px solid #ededed;
}

#mobile-nav ul li a {
  color: #757575;
  font-size: 16px;
  overflow: hidden;
  padding: 10px 22px 10px 15px;
  position: relative;
  text-decoration: none;
  width: 100%;
  display: block;
  outline: none;
  text-align:center;
}

#mobile-nav ul li a:hover {
  color: #9f9f9f;
}

#mobile-nav ul li li {
  padding-left: 30px;
}

#mobile-nav ul .menu-has-children i {
  position: absolute;
  right: 0;
  z-index: 99;
  padding: 15px;
  cursor: pointer;
  color: #fff;
}

#mobile-nav ul .menu-has-children i.fa-chevron-up {
  color: #1dc8cd;
}

#mobile-nav ul .menu-item-active {
  color: #1dc8cd;
}

#mobile-body-overly {
  width: 100%;
  height: 100%;
  z-index: 997;
  top: 64px;
  left: 0;
  position: fixed;
  display: none;
  background-color: rgba( 0, 0, 0, 0.5 );
}

/* Mobile Nav body classes */
body.mobile-nav-active {
  overflow: hidden;
}

body.mobile-nav-active #mobile-nav {
  left: 0;
}

body.mobile-nav-active #mobile-nav-toggle {
  color: #fff;
}

/*--------------------------------------------------------------
# Sections
--------------------------------------------------------------*/
/* Sections Header
--------------------------------*/
.section-header .section-title {
  font-size: 32px;
  color: #111;
  text-align: center;
  font-weight: 400;
}

.section-header .section-description {
  text-align: center;
  color:#333f48;
  font-weight: 400;
  
  width:70%;
  margin:0 auto;
  padding-bottom: 40px;
}

.section-header .section-divider {
  display: block;
  width: 60px;
  height: 3px;
  background: #3C68EA;
  background: linear-gradient(0deg, #3C68EA 0%, #6a8cef 100%);
  margin: 0 auto;
  margin-bottom: 20px;
}

/* Section with background
--------------------------------*/
.section-bg {
  background: #eff5f5;
}

/* About Us Section
--------------------------------*/

#about .content i {
  font-size: 20px;
  padding-right: 4px;
  color: #1dc8cd;
}

#about .content ul {
  list-style: none;
  padding: 0;
}

#about .content ul li {
  padding-bottom: 10px;
}

/* Product Featuress Section
--------------------------------*/
#features {
  background: #fff;
  padding: 60px 0 0 0;
  overflow: hidden;
}

#features .features-img {
  text-align: center;
  padding-top: 20px;
}

@media (min-width: 769px) {
  #features .features-img {
    padding-top: 120px;
    margin-top: -200px;
  }
}

#features .features-img img {
  max-width: 100%;
}

#features .box {
  margin-bottom: 15px;
  text-align: center;
}

#features .icon {
  margin-bottom: 10px;
}

#features .icon i {
  color: #666666;
  font-size: 40px;
  transition: 0.5s;
}

#features .icon i:before {
  background: #1dc8cd;
  background: linear-gradient(45deg, #1dc8cd 0%, #55fabe 100%);
  background-clip: border-box;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#features .title {
  font-weight: 300;
  margin-bottom: 15px;
  font-size: 22px;
}

#features .title a {
  color: #111;
}

#features .description {
  font-size: 14px;
  line-height: 24px;
  margin-bottom: 10px;
}

#features .section-description {
  padding-bottom: 10px;
}

/* Call To Action Section in contact
--------------------------------*/
#seven-section-contact {
  overflow: hidden;
  background: linear-gradient(rgba(102, 102, 102, 0.65), rgba(29, 205, 89, 0.2)), url(../img/glass-ball-2391786_1280.jpg) fixed center center;
  background-size: cover;
  padding: 125px 0;
}
#seven-section-in {
  overflow: hidden;
  background: linear-gradient(rgba(102, 102, 102, 0.65), rgba(29, 205, 89, 0.2)), url(../img/bakery-1209446_1280.jpg) center center;
  background-size: cover;
  position:relative;
}
.positionCenter{
  margin: auto;
  position: absolute;
  top: 35%; 
  left: 0; 
  bottom: 0; 
  right: 0;
}

#seven-section-in .cta-title, #seven-section-contact .cta-title {
  color: #fff;
  font-size: 33px;
  font-weight: 700;
}

#seven-section-in .cta-text, #seven-section-contact .cta-text{
  color: #fff;
}

/* More Features Section
--------------------------------*/
#more-features {
  position:relative;
  padding: 20px 0 60px 0;
  overflow: hidden;
  -webkit-background-size: 100% 100%;
     background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url(../images/20201120/bg1_20201120.png);
}
#more-features_sign {
  position:relative;
  padding-top: 10px;
  overflow: hidden;
}
.more-features_history
{
	position:relative;
	
	-webkit-background-size: 100% 100%;
     background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("../images/20201120/background center_change in erlin.png");
	
	padding-bottom:60px;
}

#more-features .box, #more-features_sign .box {
  padding: 40px;
  margin-bottom: 30px;
  border:1px solid #e5e5e5;
  background: #fff;
  transition: 0.5s;
  cursor:pointer;
}

#more-features .box:hover, #more-features_sign .box:hover
{
	box-shadow: 0px 0px 30px rgba(73, 78, 92, 0.15);
}

#more-features .icon, #more-features_sign .icon {
  float: left;
}

#more-features .icon img, #more-features_sign .icon img{
    width:90px;
}

#more-features .icon i, #more-features_sign .icon i {
  color: #666666;
  font-size: 80px;
  transition: 0.5s;
  line-height: 0;
}

#more-features .icon i:before, #more-features_sign .icon i:before {
  background: #3c68ea;
  background: linear-gradient(45deg, #3c68ea 0%, #55fabe 100%);
  background-clip: border-box;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#more-features h4, #more-features_sign h4 {
  margin-left: 110px;
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 18px;
  word-wrap:break-word;
}

#more-features h4 a, #more-features_sign h4 a {
  color: #111;
}

#more-features p, #more-features_sign p {
  font-size: 14px;
  /* margin-left: 110px; */
  margin-bottom: 0;
  line-height: 24px;
}

#more-features .myClock, #more-features_sign .myClock {
  color: #111;
  font-size: .8em;
  margin-top:-20px;
  margin-bottom:15px;
}

@media (max-width: 767px) {
  #more-features .box, #more-features_sign .box {
    margin-bottom: 20px;
  }
  #more-features .icon, #more-features_sign .icon {
    float: none;
    text-align: center;
    padding-bottom: 15px;
  }
    
  #more-features .icon img, #more-features_sign .icon img{
    width:90%;
  }

    
  #more-features h4, #more-features p, #more-features_sign h4, #more-features_sign p {
    margin-left: 0;
    text-align: center;
  }
}

#more-features .box_img, #more-features_sign .box_img {
  -webkit-filter: drop-shadow(-1px 1px 2px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(-1px 1px 2px rgba(0, 0, 0, 0.2));
}

/* Clients Section
--------------------------------*/
#clients {
  padding: 30px 0;
  background: #fff;
  overflow: hidden;
}

#clients img {
  max-width: 100%;
  opacity: 0.5;
  transition: 0.3s;
  padding: 15px 0;
}

#clients img:hover {
  opacity: 1;
}

/* shopShow Section
--------------------------------*/
#shopShow {
  padding: 60px 0 0 0;
  overflow: hidden;
}
/* ===============================
12. Portfolio
================================ */

.work-nav #filters {
  margin: 0;
  padding: 0;
  list-style: none;
}

.work-nav #filters li {
  margin: 0 10px 30px 0;
  padding: 0;
  float: left;
}

.work-nav #filters li a {
  color: #7F8289;
  font-size: 16px;
  display: block;
}

.work-nav #filters li a:hover {}

.work-nav #filters li a.selected {
  color: #DE5E60;
}
ul{
 -webkit-padding-start: 0px !important;
}
#thumbs {
  margin: 0;
  padding: 0;
  
  display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
}

#thumbs li {
  list-style-type: none;
  border: 1px solid #e5e5e5;
  background: #fff;
  
  display: flex;
flex-direction: column;
}

.item-thumbs {
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
  cursor: pointer;
}

.item-thumbs a+img {
  width: 100%;
}

.item-thumbs .hover-wrap {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: all 450ms ease-out 0s;
  -moz-transition: all 450ms ease-out 0s;
  -o-transition: all 450ms ease-out 0s;
  transition: all 450ms ease-out 0s;
  -webkit-transform: rotateY(180deg) scale(0.5, 0.5);
  -moz-transform: rotateY(180deg) scale(0.5, 0.5);
  -ms-transform: rotateY(180deg) scale(0.5, 0.5);
  -o-transform: rotateY(180deg) scale(0.5, 0.5);
  transform: rotateY(180deg) scale(0.5, 0.5);
}

.item-thumbs:hover .hover-wrap, .item-thumbs.active .hover-wrap {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transform: rotateY(0deg) scale(1, 1);
  -moz-transform: rotateY(0deg) scale(1, 1);
  -ms-transform: rotateY(0deg) scale(1, 1);
  -o-transform: rotateY(0deg) scale(1, 1);
  transform: rotateY(0deg) scale(1, 1);
}


.item-thumbs .hover-wrap .overlay-img {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0.80;
  filter: alpha(opacity=80);
  background: linear-gradient(45deg, #3c68ea 0%, #55fabe 100%);
}

.item-thumbs .hover-wrap .overlay-img-thumb {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -16px 0 0 -16px;
  color: #fff;
  font-size: 32px;
  line-height: 1em;
  opacity: 1;
  filter: alpha(opacity=100);
}

/*loading*/
@keyframes lds-spinner {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes lds-spinner {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.lds-spinner {
  position: relative;
}
.lds-spinner div {
  left: 94px;
  top: 48px;
  position: absolute;
  -webkit-animation: lds-spinner linear 2.3s infinite;
  animation: lds-spinner linear 2.3s infinite;
  background: #0e63ab;
  width: 12px;
  height: 24px;
  border-radius: 40%;
  -webkit-transform-origin: 6px 52px;
  transform-origin: 6px 52px;
}
.lds-spinner div:nth-child(1) {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-animation-delay: -2.108333333333333s;
  animation-delay: -2.108333333333333s;
}
.lds-spinner div:nth-child(2) {
  -webkit-transform: rotate(30deg);
  transform: rotate(30deg);
  -webkit-animation-delay: -1.916666666666667s;
  animation-delay: -1.916666666666667s;
}
.lds-spinner div:nth-child(3) {
  -webkit-transform: rotate(60deg);
  transform: rotate(60deg);
  -webkit-animation-delay: -1.725s;
  animation-delay: -1.725s;
}
.lds-spinner div:nth-child(4) {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  -webkit-animation-delay: -1.533333333333333s;
  animation-delay: -1.533333333333333s;
}
.lds-spinner div:nth-child(5) {
  -webkit-transform: rotate(120deg);
  transform: rotate(120deg);
  -webkit-animation-delay: -1.341666666666667s;
  animation-delay: -1.341666666666667s;
}
.lds-spinner div:nth-child(6) {
  -webkit-transform: rotate(150deg);
  transform: rotate(150deg);
  -webkit-animation-delay: -1.15s;
  animation-delay: -1.15s;
}
.lds-spinner div:nth-child(7) {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  -webkit-animation-delay: -0.958333333333333s;
  animation-delay: -0.958333333333333s;
}
.lds-spinner div:nth-child(8) {
  -webkit-transform: rotate(210deg);
  transform: rotate(210deg);
  -webkit-animation-delay: -0.766666666666667s;
  animation-delay: -0.766666666666667s;
}
.lds-spinner div:nth-child(9) {
  -webkit-transform: rotate(240deg);
  transform: rotate(240deg);
  -webkit-animation-delay: -0.575s;
  animation-delay: -0.575s;
}
.lds-spinner div:nth-child(10) {
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
  -webkit-animation-delay: -0.383333333333333s;
  animation-delay: -0.383333333333333s;
}
.lds-spinner div:nth-child(11) {
  -webkit-transform: rotate(300deg);
  transform: rotate(300deg);
  -webkit-animation-delay: -0.191666666666667s;
  animation-delay: -0.191666666666667s;
}
.lds-spinner div:nth-child(12) {
  -webkit-transform: rotate(330deg);
  transform: rotate(330deg);
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}
.lds-spinner {
  width: 88px !important;
  height: 88px !important;
  -webkit-transform: translate(-44px, -44px) scale(0.44) translate(44px, 44px);
  transform: translate(-44px, -44px) scale(0.44) translate(44px, 44px);
}
/*loading*/

/* --- Portolio filter --- */

ul.portfolio-categ {
  margin: 10px 0 30px 0;
  padding: 0;
  float: left;
  list-style: none;
}

ul.portfolio-categ li {
  margin: 0;
  padding: 0 20px 0 0;
  float: left;
  list-style: none;
  font-size: 13px;
  font-weight: 600;
}

ul.portfolio-categ li a {
  display: block;
  padding: 35x 0 35x 0;
  color: #353535;
}

ul.portfolio-categ li.active a:hover, ul.portfolio-categ li a:hover, ul.portfolio-categ li a:focus, ul.portfolio-categ li a:active {
  text-decoration: none;
  outline: 0;
}

/* --- portfolio detail --- */

.top-wrapper {
  margin-bottom: 20px;
}

.myShopName{
    font-size: 0.8em;
    color:#757575;
    margin-top:10px;
    margin-left: 8px;
}
.myPrice{
    font-size: 0.8em;
    color:#F03C02;
    margin-top:5px;
    margin-left: 8px;
    margin-bottom:10px;
}

.span3 {
        width: 24%;
    }
@media (min-width: 767px){
    [class*="span"] {
        float: left;
        min-height: 1px;
        margin-left: 1%;
    }
}

@media (max-width: 767px){
.row, .thumbnails {
    margin-left: 0;
    margin-right: 0;
    }
    
    .span3 {
        width: 100%;
    }
}


/* map Section
--------------------------------*/
#map {
  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.1);
  padding: 60px 0;
  overflow: hidden;
}
#map h3{
	color:#666;
    font-size: 1em;
    line-height: 1em;
    cursor: pointer;
}
/* Frequently Asked Questions Section
--------------------------------*/
#faq {
  padding: 60px 0;
  overflow: hidden;
}

#faq #faq-list {
  padding: 0;
  list-style: none;
}

#faq #faq-list li {
  border-bottom: 1px solid #ddd;
}

#faq #faq-list a {
  padding: 18px 0;
  display: block;
  position: relative;
  font-family: "Montserrat", sans-serif;
  font-size: 22px;
  line-height: 1;
  font-weight: 300;
  padding-right: 20px;
}

#faq #faq-list i {
  font-size: 24px;
  position: absolute;
  right: 0;
  top: 16px;
}

#faq #faq-list p {
  margin-bottom: 20px;
}

@media (max-width: 768px) {
  #faq #faq-list a {
    font-size: 18px;
  }
  #faq #faq-list i {
    top: 13px;
  }
}

#faq #faq-list a.collapse {
  color: #1dc8cd;
}

#faq #faq-list a.collapsed {
  color: #000;
}

#faq #faq-list a.collapsed i::before {
  content: "\f2c7" !important;
}
/* Contact Section
--------------------------------*/
#contact {
 /*  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.1); */
  padding: 60px 0;
  overflow: hidden;
}

#contact .contact-about h3 {
  font-size: 36px;
  margin: 0 0 10px 0;
  padding: 0;
  line-height: 1;
  font-weight: 300;
  letter-spacing: 3px;
  color: #3C68EA;
}

#contact .contact-about p {
  font-size: 14px;
  line-height: 24px;
  color: #888;
}

#contact .social-links {
  padding-bottom: 20px;
}

#contact .social-links a {
  font-size: 18px;
  display: inline-block;
  background: #fff;
  color: #3C68EA;
  line-height: 1;
  padding: 8px 0;
  margin-right: 4px;
  border-radius: 50%;
  text-align: center;
  width: 36px;
  height: 36px;
  transition: 0.3s;
  border: 1px solid #3C68EA;
  transition: all .2s ease-in-out;
  font-weight: bold;
}

#contact .social-links a:hover {
  background: #3C68EA;
  color: #fff;
  transform: translateY(-4px);
}
.line{
   border: 1px solid rgb(0, 195, 0) !important; 
   color:rgb(0, 195, 0) !important;
}
.line:hover
{
    color:#ffffff !important;
    background-color: rgb(0, 195, 0) !important;
}
.twitter{
   border: 1px solid #1DA1F2 !important; 
   color:#1DA1F2 !important;
}
.twitter:hover
{
    color:#ffffff !important;
    background-color: #1DA1F2 !important;
}
.google{
   border: 1px solid #DC4E41 !important; 
   color:#DC4E41 !important;
}
.google:hover
{
    color:#ffffff !important;
    background-color: #DC4E41 !important;
}
.google{
   border: 1px solid #EA423B !important; 
   color:#EA423B !important;
}
.google:hover
{
    color:#ffffff !important;
    background-color: #DC4E41 !important;
}

#contact .info {
  color: #333333;
}

#contact .info i {
  font-size: 32px;
  color: #3C68EA;
  float: left;
  line-height: 1;
}

#contact .info p {
  padding: 0 0 10px 42px;
  line-height: 28px;
  font-size: 14px;
}

#contact .form #sendmessage {
  color: #3c68ea;
  border: 1px solid #3c68ea;
  display: none;
  text-align: center;
  padding: 15px;
  font-weight: 600;
  margin-bottom: 15px;
}

#contact .form #errormessage {
  color: red;
  display: none;
  border: 1px solid red;
  text-align: center;
  padding: 15px;
  font-weight: 600;
  margin-bottom: 15px;
}

#contact .form #sendmessage.show, #contact .form #errormessage.show, #contact .form .show {
  display: block;
}

#contact .form .validation {
  color: red;
  display: none;
  margin: 0 0 20px;
  font-weight: 400;
  font-size: 13px;
}

#contact .form input, #contact .form textarea {
  border-radius: 0;
  box-shadow: none;
  font-size: 14px;
}

.sendMessageBtn {
  background: linear-gradient(45deg, #3C68EA, #6a8cef);
  border: 0;
  border-radius: 3px;
  padding: 8px 30px;
  color: #fff;
  font-size:14px;
}

.sendMessageBtn:hover {
  background: linear-gradient(45deg, #2d5ce8, #89a3f2);
  cursor: pointer;
}
.sendMessageBtn_v1 {
  background: #e8e4e4;
  border: 0;
  border-radius: 20px;
  padding: 5px 20px;
  color: #a69d9d;
  font-size:14px;
  cursor: pointer;
  border:1px solid #a69d9d;
}

.sendMessageBtn_v1:hover {
  background: #d8d2d2;
}

.sendBigBtn{
  padding: 15px 35px;
  color: #fff;
  font-size:18px;
  margin-bottom:10px;
}

.sendBigBtn1{
  padding: 10px 25px;
  color: #fff;
  font-size:16px;
  margin-bottom:10px;
}

.sendMessageBtn_out {
  background: #ffffff;
  border: 1px solid #3C68EA;
  border-radius: 3px;
  padding: 8px 30px;
  color: #3C68EA;
  font-size:14px;
}

.sendMessageBtn_out:hover {
  border: 1px solid #89a3f2;
  color:#89a3f2;
  cursor: pointer;
}

.sendMessageBtn_noItem {
  background: linear-gradient(45deg, #909090, #a1a1a1);
  border: 0;
  border-radius: 3px;
  padding: 8px 30px;
  color: #fff;
  font-size:14px;
}

.sendMessageBtn_noItem:hover {
  background: linear-gradient(45deg, #aaa, #bbb);
  cursor: pointer;
}

.necessaryColor{
	color:#FF3333;
}
.errorBorder{
	border:1px solid #FF3333;
}
/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer {
  position:relative;
  background: #666666;
  /* box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.1); */
  padding: 15px 0;
  color: #fff;
  font-size: 14px;
}
.footer_information
{
	margin-bottom:5px;
	cursor:pointer;
}
.footer_abso_logo
{
	position:absolute;
	top:20%;
	right:10px;
	width:80px;
}
.footer_abso_logo_v1
{
	position:absolute;
	top:17%;
	right:10px;
	width:60px;
}
.footer_abso_logo img, .footer_abso_logo_v1 img
{
	max-width:100%;
}

@media (max-width: 667px) {
	.footer_abso_logo, .footer_abso_logo_v1
	{
		display:none;
	}
}
/*--------------------------------------------------------------
# 20180512
--------------------------------------------------------------*/
.myContactCon
{
 /* background-color:#f4f5f7; */
 background-color:#fff;
}

/*--------------------------------------------------------------
# newsContent
--------------------------------------------------------------*/
/*list*/
#more-features .myNavArea, #more-features_sign .myNavArea, #shopShow .myNavArea, #cartShow .myNavArea, #more-question .myNavArea{
    font-size:15px;
    position: relative;
    margin-top:10px;
    margin-bottom:30px;
}
#more-features .myNavArea a, #more-features_sign .myNavArea a, #shopShow .myNavArea a, #cartShow .myNavArea a, #more-question .myNavArea a
{
  color: #222;   
}
#more-features .myNavArea a:hover, #more-features_sign .myNavArea a:hover, #shopShow .myNavArea a:hover, #cartShow .myNavArea a:hover, #more-question .myNavArea a:hover
{
   color: #757575;  
}
/*Con*/
.shareArea
{
    margin-top:10px;
    font-size:.8em;
}
#myNewCon{
    /* padding: 0 15px 0 15px; */
}
#myNewCon .myNavArea{
    font-size:15px;
    position: relative;
}
#myNewCon .myNavArea a
{
  color: #222;   
}
#myNewCon .myNavArea a:hover
{
   color: #757575;  
}
#myNewCon .clockRight{
    float: right;
}

#myNewCon .blockContent {
    clear: both;
    background: #fff;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-top: 20px;
    margin-bottom: 30px;
}

#myNewCon .myNewTitle {
    font-size:1.6em;
    padding: .8rem;
    margin-top: .8rem;
    margin-bottom: .8rem;
	word-wrap:break-word;
}

#myNewCon .myNewDetialCon {
    font-size:1em;
    padding: .8rem;
}

#myNewCon .myRightAdTitle{
    background: #3C68EA;
    background: linear-gradient(45deg, #3c68ea, #7997f1);
    color:#ffffff;
    padding: .4rem;
}

#myNewCon .myList{
    clear: both;
    counter-reset: myli 0;
}
#myNewCon .myList h3{
    margin-bottom: 10px;
    margin-top: 10px;
}
.myMaybeSee{
    color:#757575;
    font-size: 18px !important;
	word-wrap:break-word;
}
.myMaybeSee img{
    max-width:100%;
    margin-top: 15px;
}
#myNewCon .myList h3 a{
    color:#757575;
    font-size: 18px !important;
	word-wrap:break-word;
}
#myNewCon .myList h3 a:hover{
    color:#a1a1a1;
    font-size: 18px !important;
}
#myNewCon .myList h3 a::before {
    display: inline-block;
    width: 18px;
    height: 18px;
    line-height: 18px;
    background: #e94c15;
    font-size: 13px;
    color: #fff;
    text-align: center;
    font-style: normal;
    margin-right: 5px;
    content: counter(myli);
    counter-increment: myli 1;
}
.facebookBtn{
    background-color: #3B5998;
}
.twitterBtn {
    background-color: #1DA1F2;
}
.googleBtn {
    background-color: #DC4E41;
}
.plurkBtn {
    background-color: #EA423B;
}
.LineBtn {
    background-color: #00C300;
}
.facebookBtn, .twitterBtn, .googleBtn, .plurkBtn, .LineBtn{
    color:#ffffff;
    transition: all .2s ease-in-out;
}
.facebookBtn:hover, .twitterBtn:hover, .googleBtn:hover, .plurkBtn:hover, .LineBtn:hover {
  transform: translateY(-4px);
}

@media (max-width: 767px) {
#myNewCon .myRightAdTitle{
    font-size:16px;
}
.myMaybeSee{
    font-size: 14px !important;
}
#myNewCon .myList h3 a{
    font-size: 14px !important;
}
#myNewCon .myList h3 a:hover{
    font-size: 14px !important;
}
}
/*--------------------------------------------------------------
# shop
--------------------------------------------------------------*/
.mySelectArea{
    float:right;
}
/*-- 分類 --*/
.part_menu_area
{
	clear: both;
    background: linear-gradient(45deg, #c6d3f9, #d5dffa);
    border-top: 4px solid #2d5ce8;
    padding: 10px;
	margin-bottom:20px;
}
.part_menu_area li {
	font-size: 15px;
    display: block;
    height: 20px;
    float: left;
    margin: 0px 8px 10px 0px;
}
.part_menu_area li .isAtive{
    color: #e94c15;
}
.clearfix:after {
    content: ".";
    display: block;
    overflow: hidden;
    height: 0;
    clear: both;
    visibility: hidden;
}
.blockContent
{
	clear: both;
    background: #fff;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-top: 20px;
    margin-bottom: 30px;
}
.newToTitle
{
	color:#333;
	font-size:21px;
	font-weight:600;
	padding:6px 0 6px 10px;
	border-left:5px solid #666;
	margin-bottom:15px;
}
/*Con*/
#myShopCon{
    padding: 0 15px 0 15px;
}
#myShopCon .myNavArea{
    font-size:15px;
    position: relative;
}
#myShopCon .myNavArea a
{
  color: #222;   
}
#myShopCon .myNavArea a:hover
{
   color: #757575;  
}
#myShopCon .clockRight{
    float: right;
}

#myShopCon .blockContent {
	width:100%;
    clear: both;
    background: #fff;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-top: 20px;
    margin-bottom: 30px;
}
.imgArea
{
    width:100%;
	position:relative;
	-webkit-background-size:cover;
	background-size:cover;
	background-color:#F0EFEF;
	background-repeat:no-repeat;
	background-position: center;
}
#myShopCon h1 {
    margin-top: 10px;
    font-size: 30px;
    font-weight: 200;
}
#myShopCon h2 {
    font-size: 18px;
    margin-top: 5px;
}
.specialPrice{
	color:#ed5565 !important;
}
.todo-completed {
  text-decoration: line-through;
}
.btn-white {
    color: inherit;
    background: white;
    border: 1px solid #e7eaec;
}
.myBtnArea{
    text-align: right;
    margin-top:20px;
    margin-bottom:20px;
}
.mySizeUl
{
  margin: 0;
  padding: 0;
  list-style: none;
}
.mySizeUl li
{
    font-size: .8em;
    float: left;
    cursor: pointer;
    border-radius: 3px;
    /*border: 1px solid rgba(0,0,0,.09);*/
    border: 1px solid rgba(0,0,0,.5);
    margin: .4rem;
    padding: .4rem;
    color: rgba(0,0,0,.5);
}
.mySizeUl li:hover, .mySizeUlHover
{
    color:#3C68EA !important;
    border: 1px solid #3C68EA !important;
}
/*問與答*/
.product-comment{
    border-bottom: 1px solid rgba(0,0,0,.09);
    padding: .8rem 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
.product-comment-noBottom{
    border-bottom-width: 0px;
}
.PcommentItemSection1 {
    width: 4rem;
    margin-right: 1rem;
    text-align: center;
}
.PcommentItemSection1 .my-avatar {
    width: 4rem;
    height: 4rem;
}
.my-avatar {
    display: inline-block;
    width: 3rem;
    height: 3rem;
    position: relative;
    border-radius: 50%;
    border: .1rem solid rgba(0,0,0,.09);
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.my-avatar-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 50%;
}
.PcommentItemSection2{
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.product-comment-item-author-name {
    text-decoration: none;
    color: rgba(0,0,0,.8);
    color: rgba(0,0,0,.87);
    font-size: 0.8em;
}
.product-comment-item__content{
    font-size: 1em;
    margin-top: 0.4rem;
    color: rgba(0,0,0,.8);
}
.product-comment-item__comment-time{
    margin-top: .9rem;
    font-size: 0.6em;
    color: rgba(0,0,0,.54);
}
.PcommentItemSection3{
    color:#3C68EA;
    font-size: .9em;
}
.myboxEditArea{
    margin-top: .8rem;
    width:100%;
    padding: 10px;
}
.mytoTitleGo
{
    font-size:1.2em;
    color:#757575;
    margin: 4rem 0 1rem 0;
    border-bottom:2px solid #3C68EA;
    padding-bottom: 10px;
}
.jcarousel-skin-tango .jcarousel-prev-horizontal:hover, .jcarousel-skin-tango .jcarousel-prev-horizontal:focus, .jcarousel-skin-tango .jcarousel-next-horizontal:hover, .jcarousel-skin-tango .jcarousel-next-horizontal:focus {
    background: #3C68EA;
}
.jcarousel-skin-tango .jcarousel-next-horizontal {
    top: -45px !important;
    line-height: 14px !important;
}
.jcarousel-skin-tango .jcarousel-prev-horizontal {
    top: -45px !important;
    line-height: 14px !important;
}
.jcarousel-skin-tango li {
    position: relative;
    float: left;
    margin: 0;
    width: auto;
    padding: 0;
    border: 4px solid #e9e9e9;
}
ul.clients li:hover {
    border: 4px solid #3C68EA;
}
.jcarousel-skin-tango li img{
    max-width: 290px;
}
.jcarousel-skin-tango .jcarousel-item{
	margin-right:5px !important;
}
.myShop-TabsTitle{
	position:relative;
	text-align:left;
	margin-top:10px;
	margin-bottom:10px;
	border-left: 4px solid #89a3f2;
	padding-left:5px;
}
.NoItemBuy{
	position:absolute;
	text-align:center;
	color:#ffffff;
	background-color: rgba(0, 0, 0, 0.4);
	top: calc( 50% - 40px);
    left: calc( 50% - 40px);
	
	-webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
	width:80px;
	height:80px;
	line-height:80px;
	
	-moz-transform:rotate(0.785rad);
	-webkit-transform:rotate(0.785rad);
	-o-transform:rotate(0.785rad);
	-ms-transform:rotate(0.785rad);
	transform:rotate(0.785rad);
}
#NoMessageArea{
	text-align:center;
	width:100%;
}
.redSecret{
	color:#ff5000;
}
.myMsgForRe {
    background-color: #FCFCFC;
    width: calc( 100% - 60px );
    border: 1px solid;
    border-color: #e5e6e9 #dfe0e4 #d0d1d5;
    border-radius: 3px;
    margin-bottom: 15px;
    padding: 10px;
	margin-left:60px;
}
.editA1{
	cursor:pointer;
}
/*--------------------------------------------------------------
# cart
--------------------------------------------------------------*/
/*step*/
.checkout-nav{
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
}
.checkout-nav .step {
    display: inline-block;
    vertical-align: top;
    width: 240px;
    max-width: 33%;
    margin-left: -2px;
    margin-right: -2px;
    color: black;
}
.checkout-nav .step .badge {
    position: relative;
    background-color: transparent;
    height: 50px;
    line-height: 50px;
    padding: 0;
}
.checkout-nav .step span {
    display: block;
    padding: 0 5px;
}
.checkout-nav .step:first-child .badge::before {
    width: 50%;
    left: 50%;
}
.checkout-nav .step .badge::before {
    content: " ";
    background-color: #cccccc;
    height: 2px;
    width: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -1px;
    z-index: 0;
}
.checkout-nav .step .badge .text {
    position: absolute;
    width: 100%;
    z-index: 1;
}
.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #777;
    border-radius: 10px;
}
.checkout-nav .step span {
    display: block;
    padding: 0 5px;
}
.checkout-nav .step.visited .badge::after, .checkout-nav .step.active .badge::after {
    background-color: #9daab2;
}
.checkout-nav .step .badge::after {
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    border-radius: 15px;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    content: " ";
    background-color: #cccccc;
    height: 30px;
    width: 30px;
    left: 50%;
    top: 50%;
    position: absolute;
    z-index: 0;
}
.checkout-nav .step:last-child .badge::before {
    width: 50%;
    right: 50%;
}
/*step*/
/*content*/
.cart-content{
    padding: .8rem;
}
.cart-items{
    font-size: .8em;
}
.mySectionShowData{
	max-width:800px;
	margin:0 auto;
}
.shopping-cart{
    padding: 0;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -ms-border-radius: 0px;
    border-radius: 0px;
    border: 1px solid #ededed;
    margin-bottom: 30px;
    padding: 0 15px;
    background-color: white;
}
.cart-content .section-header{
    padding: 10px 15px;
    margin: 0 -15px;
    font-weight: 500;
    background-color: #F6F6F6;
    line-height: 26px;
}
.cart-content .section-header h3{
    padding: 2px 0;
    font-weight: 500;
    margin: 0;
    font-size: 18px;
    line-height: 22px;
}
.myCartHeaderTitle{
    padding: 15px;
}
.myShopNumsToShow{
    font-size: .8em;
}
.myCartShopCon{
    border-top: 1px solid #ededed;
    border-bottom: none;
}
.myCartShopCon img{
    float:left;
    margin-right: 10px;
    max-width: 100%;
    width:120px;
    padding: 10px;
}
.description{
    word-wrap: break-word;
    margin-bottom: 5px;
    text-align: left;
    padding-top: 10px;
}
.myShowCartCon{
    padding-top: 10px;
    padding-bottom: 10px;
}
.mycartTrash{
    font-size: 1.5em;
}
.hidden-this{
    display: none;
}
@media (max-width: 767px){
    .hidden-xs {
        display: none !important;
    }
    .hidden-this{
        display: inline;
    }
    
    .myCartShopCon img{
        float:none;
        width:200px;
    }
    .description{
        text-align: center;
    }
    .myAddrJs .col-sm-6,.myAddrJs .col-sm-12{
        padding: 0px;
    }
    #cartRowBottom .col-md-6{
        padding:0px;
    }
}
.cart-others-items{
    padding: 10px;
}
.form-control:focus {
    background-color: #fff !important;
    border-color: #ccc;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 2px rgba(102,175,233,0.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 2px rgba(102,175,233,0.6);
}
.myCartArea{
    position: relative;
    font-size: .9em;
    margin-bottom:1rem;
}
.myOptionMsg{
    color:#ccc;
    font-size: .8em;
}
.myPriceColor{
    color:#F03C02;
}
.confirm-message{
    padding-left: 0;
    margin-left: 0;
    transform: initial;
    width: 100%;
    display: block;
}
.mySuccessCircle{
    margin:0 auto;
    line-height: 100px;
    color: green;
    text-align: center;
    font-size: 38px;
    font-weight: 300;
    border: 5px solid green;
    line-height: 51px;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    margin-top:20px;
    margin-bottom:15px;
}
.myErrorCircle{
    margin:0 auto;
    line-height: 100px;
    color: #FF5511;
    text-align: center;
    font-size: 38px;
    font-weight: 300;
    border: 5px solid #FF5511;
    line-height: 51px;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    margin-top:20px;
    margin-bottom:15px;
}
.successFonts{
    font-size: 1.2em;
    text-align: center;
    margin-bottom:15px;
}
.successFontsInfo{
    color:#757575;
    font-size: .9em;
    margin-bottom: 15px;
}
/*content*/
/*--------------------------------------------------------------
# member
--------------------------------------------------------------*/
#myMemberCon{
    padding: 20px 15px 30px 15px;
    min-height: 735px;
}
.blockMemberContent {
    clear: both;
    background: #fff;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
}
.MyBoxListTitle {
    -webkit-box-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px solid #dedede;
}
.MyBoxListTabGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
}
.myBoxListTitle{
    color:#dbdbdb;
    min-width:100px;
    text-align: center;
    font-size: 1em;
    line-height: 1em;
    padding: 1rem 0 1rem 0;
    cursor: pointer;
    transition: all .2s ease-in-out;
}
.myBoxListTitle_active,.myBoxListTitle:hover{
    border-bottom:2px solid #1dc8cd;
    background-color: #fefefe;
    color:#757575;
}
.MyBoxListCon{
    padding: 20px;
    color:#757575;
}
.myMemberEditT{
    font-size: .9em;
    color:#333;
}
.myMemberEditCon{
    font-size: .9em;
    color:#757575;
}
.showMyPass{
    color:#1dc8cd;
    font-size:.9em;
}
.editMyMemberData{
    color:#1dc8cd;
    text-align: right;
}
/*訂單管理*/
#myTabsMsgCont3 .box {
  margin-bottom: 30px;
  border:1px solid #e5e5e5;
  background: #fff;
  transition: 0.5s;
}

#myTabsMsgCont3 .box:hover
{
	box-shadow: 0px 0px 30px rgba(73, 78, 92, 0.15);
}
.myorderSection
{
    margin: .8em .8em 1.667em;
}
.dInline_block
{
    display: inline-block;
    width:18.9%;
    text-align: center;
    padding: .4rem 0 .4rem 0;
}
.orderHover
{
    color:#224ac4;
    border-bottom: 1px solid #224ac4;
}
.orderStatus
{
    float: right;
    color:#224ac4;
    font-size: 0.9em;
}
.myWrapper
{
    position: relative;
    background: #fff;
    padding: .8rem;
}
.myWrapperMore
{
    position: relative;
    background: #fff;
    padding: .2rem 0 .2rem 0;
}
.myProdNumsMore
{
    text-align: right;
    color:#bdbdbd;
    margin-top: .2rem;
    font-size: .8em;
}
.myProdName
{
    font-size: .9em;
}
.otherBg
{
    background-color: #fbfbfc;
}
.prodImgLeft
{
    float: left;
    margin: 0 .8em 0 0;
}
.imgWHi {
    box-sizing: border-box;
    width: 60px;
    height: 60px;
}
.clearx
{
    clear: both;
}
.orderctocMsg
{
   font-size: .8em;
   color:#224ac4; 
}
.myorderHr
{
    border-bottom:1px solid #eef2fa;
    padding-bottom: .4rem;
}
.myorderHrNoPadding
{
    border-bottom:1px solid #eef2fa;
}
.myOrderAllNums
{
    color:#bdbdbd;
    font-size: .8em;
    padding: .4rem 0 .4rem 0;
}
.AllTotal
{
    float: right;
    color:#212121;
    font-size: 1.1em;
}
.AllTotalMoney
{
    color:#ff5000;
}
.myOrderOtherInfo
{
    font-size: .9em;
    padding: .4rem 0 .4rem 0;
}
.myTruckArea
{
    padding: .6rem 0 .6rem 0;
}
.moreRight
{
    float: right;
}
.myOrderStarToBtn
{
    float: right;
    width:50%;
    text-align: center;
    color:#ffffff;
     padding: .4rem .8rem .4rem .8rem;
    border-top-left-radius: 3px;
	-moz-border-top-left-radius: 3px;
	-webkit-border-top-left-radius: 3px;
    
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#597be2+0,3c64dd+53,224ac4+100 */
    background: rgb(89,123,226); /* Old browsers */
    background: -moz-linear-gradient(-45deg, rgba(89,123,226,1) 0%, rgba(60,100,221,1) 53%, rgba(34,74,196,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, rgba(89,123,226,1) 0%,rgba(60,100,221,1) 53%,rgba(34,74,196,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, rgba(89,123,226,1) 0%,rgba(60,100,221,1) 53%,rgba(34,74,196,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#597be2', endColorstr='#224ac4',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    
    max-width:100px;
}
.myOrderNumsStatus{
  display: inline-block;
  background-color: #F03C02;
  border-radius:50%; 
  width:7px;
  height:7px;
}
.myOrderRow .box{
    text-align: center;
    padding: 10px;
    margin: 10px;
    font-size:.9em;
}
.myOrderRow .box:hover, .myOrderRow .boxhover{
    border:2px solid #1dc8cd;
    color:#1dc8cd;
}
.slick-slider {
    margin-bottom: 0px;
}
.slick-arrow{
    display: none !important;
}
/* TABLES */
.table-bordered {
  border: 1px solid #EBEBEB;
}
.table-bordered > thead > tr > th,
.table-bordered > thead > tr > td {
  background-color: #F5F5F6;
  border-bottom-width: 1px;
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
  border: 1px solid #e7e7e7;
}
.table > thead > tr > th {
  border-bottom: 1px solid #DDDDDD;
  vertical-align: bottom;
}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
  border-top: 1px solid #e7eaec;
  line-height: 1.42857;
  padding: 8px;
  vertical-align: top;
}
/*ibox*/
.ibox {
    clear: both;
    margin-bottom: 25px;
    margin-top: 0;
    padding: 0;
}
.ibox-title {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: #ffffff;
    border-color: #e7eaec;
    border-image: none;
    border-style: solid solid none;
    border-width: 2px 0 0;
    color: inherit;
    margin-bottom: 0;
    padding: 15px 15px 7px;
    min-height: 48px;
}
.ibox-content {
    background-color: #ffffff;
    color: inherit;
    padding: 15px 20px 20px 20px;
    border-color: #e7eaec;
    border-image: none;
    border-style: solid solid none;
    border-width: 1px 0;
	clear:both;
}
.priceStyle {
    color: #fa1229;
}

/*
通知管理
*/
.myMsgToSection
{
    margin: .8em .8em 1em;
    border:1px solid #dbdbdb;
    padding: .5em;
}
.myMsgTitle
{
    color:#212121;
    font-size: .9em;
}
.myMsgInSection
{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f8f9fe+0,e9eefb+100 */
    background: rgb(248,249,254); /* Old browsers */
    background: -moz-linear-gradient(-45deg, rgba(248,249,254,1) 0%, rgba(233,238,251,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, rgba(248,249,254,1) 0%,rgba(233,238,251,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, rgba(248,249,254,1) 0%,rgba(233,238,251,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f9fe', endColorstr='#e9eefb',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
    
    margin-top:.5rem;
}
.myStarFlex
{
    display: flex;
}
.myStarImgSection
{
    border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
    
    width:60px;
}
.myStarSection
{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff8b66+0,ff7e55+50,ff5722+100 */
    background: rgb(255,139,102); /* Old browsers */
    background: -moz-linear-gradient(-45deg, rgba(255,139,102,1) 0%, rgba(255,126,85,1) 50%, rgba(255,87,34,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, rgba(255,139,102,1) 0%,rgba(255,126,85,1) 50%,rgba(255,87,34,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, rgba(255,139,102,1) 0%,rgba(255,126,85,1) 50%,rgba(255,87,34,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff8b66', endColorstr='#ff5722',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    padding: .6rem;
    
    border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
    
    width:60px;
}
.myStarCircle
{
    color:#ff5722;
    text-align: center;
    font-size: 1.7em;
    width:40px;
    height:40px;
    background-color: #ffffff;
     border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
    
    padding-top: 0px;
    box-shadow: 1px 1px 7px #ffd8cc; 
    -webkit-box-shadow: 1px 1px 7px #ffd8cc; 
    -moz-box-shadow: 1px 1px 7px #ffd8cc; 
    
}
.myStarTalkSection
{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ab2cd4+0,a028c7+50,721d8e+100 */
    background: rgb(171,44,212); /* Old browsers */
    background: -moz-linear-gradient(-45deg, rgba(171,44,212,1) 0%, rgba(160,40,199,1) 50%, rgba(114,29,142,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, rgba(171,44,212,1) 0%,rgba(160,40,199,1) 50%,rgba(114,29,142,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, rgba(171,44,212,1) 0%,rgba(160,40,199,1) 50%,rgba(114,29,142,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ab2cd4', endColorstr='#721d8e',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    padding: .6rem;
    
    border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
    
    width:60px;
}
.myStarTalkCircle
{
    color:#721D8E;
    text-align: center;
    font-size: 1.7em;
    width:40px;
    height:40px;
    background-color: #ffffff;
     border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
    
    padding-top: 0px;
    box-shadow: 1px 1px 7px #d28fe8; 
    -webkit-box-shadow: 1px 1px 7px #d28fe8; 
    -moz-box-shadow: 1px 1px 7px #d28fe8; 
    
}
.myStarSysSection
{
   /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#dbdbdb+0,b1b1b1+50,979797+100 */
    background: rgb(219,219,219); /* Old browsers */
    background: -moz-linear-gradient(-45deg, rgba(219,219,219,1) 0%, rgba(177,177,177,1) 50%, rgba(151,151,151,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, rgba(219,219,219,1) 0%,rgba(177,177,177,1) 50%,rgba(151,151,151,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, rgba(219,219,219,1) 0%,rgba(177,177,177,1) 50%,rgba(151,151,151,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dbdbdb', endColorstr='#979797',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    padding: .6rem;
    
    border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
    
    width:60px;
}
.myStarSysCircle
{
    color:#979797;
    text-align: center;
    font-size: 1.7em;
    width:40px;
    height:40px;
    background-color: #ffffff;
     border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
    
    padding-top: 0px;
    box-shadow: 1px 1px 7px #f4f4f4; 
    -webkit-box-shadow: 1px 1px 7px #f4f4f4; 
    -moz-box-shadow: 1px 1px 7px #f4f4f4; 
    
}
.myStarSecMsg
{
    padding: .4rem;
}
.myStarFonts
{
    color:#6786e5;
}
/*--------------------------------
民意中心
--------------------------------*/
#more-question {
  padding: 60px 0 60px 0;
  overflow: hidden;
}
#more-question .box {
  padding: 25px;
  margin-bottom: 30px;
  border:1px solid #e5e5e5;
  background: #fff;
  transition: 0.5s;
  cursor:pointer;
}
#more-question .box:hover
{
	box-shadow: 0px 0px 30px rgba(73, 78, 92, 0.15);
}
.question-img{
    max-width: 100%;
}
.question_subtitle{
    line-height: 0.5;
    text-align: center;
    font-size: 16px;
    margin-top: 40px;
    color: #818181;
}
.question_subtitle span {
    display: inline-block;
    position: relative;
}
.question_subtitle span:before {
    right: 100%;
    margin-right: 5px;
}
.question_subtitle span:after {
    left: 100%;
    margin-left: 5px;
}
.question_subtitle span:before, .question_subtitle span:after {
    content: "";
    margin-top: 1px;
    position: absolute;
    height: 5px;
    border-top: 1px solid #dedede;
    top: 0;
    width: 60%;
}
.question_desc{
    padding: 20px 0 20px 0;
}
.question-MyBoxListTitle {
    -webkit-box-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 2px solid #b2c65b;
	margin-top:10px;
}
.question-MyBoxListTabGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
	width:100%;
}
.question-myBoxListTitle{
    color:#b2c65b;
    min-width:120px;
    text-align: center;
    font-size: 1em;
    line-height: 1em;
    padding: 1rem 0 1rem 0;
    cursor: pointer;
	border:2px solid #b2c65b;
	border-bottom-width:0px;
	font-weight:bold;
}
.question-sendMessageBtn {
  background: linear-gradient(45deg, #b2c65b, #becf74);
  border: 0;
  border-radius: 3px;
  padding: 8px 30px;
  color: #fff;
  font-size:14px;
  margin-top:15px;
  width:100%;
}

.question-sendMessageBtn:hover {
  background: linear-gradient(45deg, #90a439, #a6bd42);
  cursor: pointer;
}
/*--------------------------------
網誌刊物
--------------------------------*/
.elect-section{
	padding:0 1% 0 1% !important; 
}
.custom-table{
    display: table;
    width:100%;
}
.electbox {
  padding: 5px;
  margin-bottom: 30px;
  border:1px solid #e5e5e5;
  background: #fff;
  transition: 0.5s;
  cursor:pointer;
}

.electbox:hover
{
	box-shadow: 0px 0px 30px rgba(73, 78, 92, 0.15);
}
.add-srvc-img {
    left: 0;
    top: 0;
    bottom: 0;
}
.add-srvc-detail {
    display: table-cell;
    vertical-align: middle;
    padding-left: 10px;
    background-color: #f9f9f9;
    color: #969595;
    font-size: 13px;
    padding-right: 30px;
}
.elect-MyBoxListTitle {
    -webkit-box-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px solid #ed5565;
	margin-top:10px;
}
.elect-MyBoxListTabGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
	width:100%;
}
.elect-myBoxListTitle{
	position:relative;
	background-color:#ed5565;
    color:#ffffff;
    min-width:50px;
    text-align: center;
    font-size: 1em;
    line-height: 1em;
    padding: 1rem 0 1rem 0;
    cursor: pointer;
	padding-right:10px;
}
.elect-myBoxListTitle:after{
	content:'';
	border:3px solid #ffffff;
	position: absolute;
    top: 0px;
	right: 6px;
    height: 100%;
}
.elect-myBoxListTitle-2{
    color:#ed5565;
    width:100%;
    text-align: center;
    font-size: 1em;
    line-height: 1em;
    padding: 1rem 0 1rem 0;
    cursor: pointer;
}
@media (max-width: 767px) {
.elect-myRightAdTitle{
    font-size:16px;
}
}
.elect-block{
	margin:0 10px 0 10px;
	min-height:467px;
}
.lightBoxGallery img{
	margin: 5px;
	display:inline-block !important;
}
/*--------------------------------
會員專區
--------------------------------*/
.menu-heading
{
	background-color: #1c84c6;
    color: #ffffff;
	text-align:center;
	padding: 10px 15px;
}
.folder-list li a
{
	padding: 10px 0;
}
.selectBox
{
    display: inline-block;
    margin: 1%;
}
.inmodal .modal-body {
    background: #f8fafb;
}
.inmodal .modal-header {
    padding: 10px 10px;
	text-align:center;
}
.modal-header {
    border-bottom: 1px solid #e5e5e5;
}
.modal.fade{
	top: 0px !important;
}
.LoginBtn1
{
	color:#352C94;
	border:1px solid #352C94;
	background-color:#ffffff;
	padding:5px;
	text-align:center;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	font-size:18px;
	cursor:pointer;
}
.LoginBtn1:hover
{
	color:#533c0f;
	border:1px solid #533c0f;
}
.LoginBtn2
{
	color:#ffffff;
	border:1px solid #8780d9;
	background-color:#352C94;
	padding:5px;
	text-align:center;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	font-size:18px;
	cursor:pointer;
}
.LoginBtn2:hover
{
	background-color:#7b73d5;
}
/*Linker會員*/
.linkerTime_area_1
{
	position:relative;
	border:1px solid #352e84;
	padding:20px;
	margin:20px;
}
.linkerTime_area_fonts
{
	color:#352e84;
	position:absolute;
	top:-15px;
	left:0px;
	margin-left:10px;
	background-color:#ffffff;
	padding-left:5px;
	padding-right:5px;
	font-size:20px;
}
.btnStyle
 {
	 max-width: 304px;
    width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    color: #fff;
    font-size: 16px;
    height: 54px;
    line-height: 50px;
    border-radius: 5px;
    border: 0;
    -webkit-appearance: none;
	background-color:#1ab394;
	
}
 
.btnStyle:hover {
	background-color: #4ee5c7;
}
.btn-linkerLife {
    color: #ffffff;
    background-color: #817ad1;
    border-color: #817ad1;
}
.btn-linkerLife:hover, .btn-linkerLife-hover {
    color: #ffffff;
    background-color: #5148bf;
    border-color: #5148bf;
}
/*會員*/
/*--------------------------------
預訂報名
--------------------------------*/
.sign-section {
    background-color: #fff;
    padding-bottom: 40px;
    box-shadow: 0 0 3px #ccc;
    padding: 30px;
    cursor: pointer;
    margin-bottom:10px;
}
.sign-section .mySignFonts {
    padding-top: 5px;
    color: #777;
    text-align: center;
    font-size: .9em;
}
.signborder {
    border-top: 1px solid #999;
    border-bottom: 1px solid #999;
    margin: 0 45%;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.sign-section:hover .signborder {
    border-color: #34C364;
    margin: 0 40%;
}
.sign-section .mySignTags{
    margin-top: 5px;
    font-size:14px;
    background-color: #dbdbdb;
    width:70px;
    text-align: center;
}
.sign-section .signOtherdec {
    padding-top: 20px;
    color: #999;
    font-size: .8em;
}
.sign-section:hover .mySignFonts {
    color: #34C364;
}
.sign-section:hover .mySignTags{
    background-color: #34C364;
    color:#ffffff;
}
.sign-MyBoxListTitle {
    -webkit-box-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 2px solid #34C364;
	margin-top:10px;
}
.sign-MyBoxListTabGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
	width:100%;
}
.sign-myBoxListTitle{
    color:#34C364;
    min-width:120px;
    text-align: center;
    font-size: 1em;
    line-height: 1em;
    padding: 1rem 0 1rem 0;
    cursor: pointer;
	border:2px solid #34C364;
	border-bottom-width:0px;
	font-weight:bold;
}
@media (max-width: 767px) {
.sign-myRightAdTitle{
    font-size:16px;
}
}
.sign-sendMessageBtn {
  background: linear-gradient(45deg, #34c364, #4acf77);
  border: 0;
  border-radius: 3px;
  padding: 8px 30px;
  color: #fff;
  font-size:14px;
  margin-top:15px;
  width:100%;
}

.sign-sendMessageBtn:hover {
  background: linear-gradient(45deg, #2da856, #30b65d);
  cursor: pointer;
}
.myRightArea-fixed{
	position:fixed;
	top:89px;
	right:0px;
	transition: all 0.5s;
}
/* @media (max-width: 768px) {
  .myRightArea-fixed{
	top:64px;
	}
}
@media (max-width: 576px){
	.myRightArea-fixed{
	position: static;
	}
} */

@media (max-width: 767px){
	.myRightArea-fixed{
	position: static;
	}
}

/*電子憑證*/
.stampForIn {
  border: 1px solid;
  border-color: #ffdacc #ffb599 #ffa888;
  border-radius:3px;
-moz-border-radius: 3px; /* Firefox */
-webkit-border-radius: 3px; /* Safari, Chrome */
  width: 100px;
  height: 40px;
  padding: 0 10px;
  position: relative;
  overflow: hidden;
  margin:2% 0 2% 0;
  background: #FF7744;
}

.stampForIn:before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 10px;
  right: 10px;
  z-index: -1;
}

.stampForIn:after {
  content: '';
  position: absolute;
  left: 10px;
  top: 10px;
  right: 10px;
  bottom: 10px;
  z-index: -2;
  background: red;
}

.stampForIn i {
  position: absolute;
  left: 20%;
  top: -30%;
  height: 100px;
  width: 200px;
  background-color: rgba(255, 255, 255, .15);
	-ms-transform: rotate(-30deg);
	-webkit-transform: rotate(-30deg);
	transform: rotate(-30deg);
}

.stampForIn .parForIn {
  float: left;
  padding: 0 15px 0 20px;
  width: 60px;
  height: 40px;
  border-right: 2px dashed rgba(255, 255, 255, .3);
  text-align: left;
  position:relative;
}
.showNameForStampForIn1
{
	color:#ffffff;
	font-size:14px;
	position:absolute;
	width:100px;
	right: -38px;
    top: 9px;
}
.ForFontSize
{
	color:red;
	font-weight:normal;
}
.NewsStoreStyleImg
{
	width:60px;
	height:60px;
	-webkit-background-size:cover;
	background-size:cover;
	background-repeat:no-repeat;
	background-position: center;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.stamp {
  border: 1px solid;
  border-color: #ffdacc #ffb599 #ffa888;
  border-radius:3px;
-moz-border-radius: 3px; /* Firefox */
-webkit-border-radius: 3px; /* Safari, Chrome */
  width: 600px;
  height: 180px;
  padding: 0 10px;
  position: relative;
  overflow: hidden;
  margin:2% 0 2% 0;
}

.stamp:before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 10px;
  right: 10px;
  z-index: -1;
}

.stamp:after {
  content: '';
  position: absolute;
  left: 10px;
  top: 10px;
  right: 10px;
  bottom: 10px;
  z-index: -2;
  background: red;
}

.stamp i {
  position: absolute;
  left: 20%;
  top: 45px;
  height: 250px;
  width: 600px;
  background-color: rgba(255, 255, 255, .15);
	-ms-transform: rotate(-30deg);
	-webkit-transform: rotate(-30deg);
	transform: rotate(-30deg);
}

.stamp .par {
  float: left;
  padding: 0 15px 0 20px;
  width: 400px;
  height: 200px;
  border-right: 2px dashed rgba(255, 255, 255, .3);
  text-align: left;
}

.stamp .par p {
  color: #fff;
}

.stamp .par sub {
  position: relative;
  top: -5px;
  color: rgba(255, 255, 255, .8);
}

.stamp .copy {
  display: inline-block;
  vertical-align: text-bottom;
  font-size: 30px;
  color: rgb(255, 255, 255);
  margin: 0 auto;
}

.stamp .copy p {
  font-size: 16px;
  margin-top: 1%;
}

.stamp01 {
  background: #FF7744;
}

.stamp01:before {
  background-color: #FF7744;
}

.showNameForStamp, .showNameForStamp1, .showNameForStamp2
{
	color:#ffffff;
	margin-top:2%;
}
.showNameForStamp1
{
	text-align:right;
}
.BigFontSize
{
  font-size: 45px;
  color: #fff;
  margin-right: 5px;
}
.simleFontSize
{
	color:#ffffff;
}
.sign {
  font-size: 34px;
  color:#ffffff;
}
.showMiddleMsg
{
	margin-top:2%;
}
.haveUsed
{
	position:absolute;
	color:red;
	left:37%;
	top:31%;
	
	font-size: 50px;
}
.MyUsedArea
{
	position:relative;
	width:600px
}
/*電子憑證*/
@media screen and (min-width: 768px) {
	/*如果使用者之視窗寬度 >= 768px，將會再載入這裡的 CSS。  */  
	/*行動交易憑證*/

	.showNameForStamp, .showNameForStamp1, .showNameForStamp2
	{
		font-size:20px;
		line-height:24px;
	}
	.simleFontSize
	{
		font-size:22px;
		line-height:26px;
		color:#ffffff;
	}
	.stamp .copy
	{
		width:178px;
	}
}
@media screen and (max-width: 767px) {

	/*行動交易憑證*/
	.stamp {
	  width: 550px;
	  height: 180px;
	  padding: 0 10px;
	}
	
	.stamp i {
	  left: 20%;
	  top: 45px;
	  height: 250px;
	  width: 550px;
	}

	.stamp .par {
	  padding: 0 15px 0 20px;
	  width: 380px;
	  height: 200px;
	}
	.MyUsedArea
	{
		position:relative;
		width:550px
	}

	.BigFontSize
	{
	  font-size: 45px;
	  margin-right: 5px;
	}
	.sign {
	  font-size: 34px;
	}
	.haveUsed
	{
		left:37%;
		top:40%;
		font-size: 50px;
	}
	.stamp .copy 
	{
	  font-size: 30px;
	}
	.stamp .copy p {
	  font-size: 16px;
	}
	.stamp .copy
	{
		width:148px;
	}
}
@media screen and (max-width: 600px) {
	/* 如果使用者之視窗寬度 <= 600px，將會再載入這裡的 CSS。  */ 
	
	/*行動交易憑證*/
	.stamp {
	  width: 450px;
	  height: 120px;
	  padding: 0 10px;
	}
	
	.stamp i {
	  left: 20%;
	  top: 45px;
	  height: 250px;
	  width: 450px;
	}

	.stamp .par {
	  padding: 0 15px 0 20px;
	  width: 320px;
	  height: 120px;
	}
	.MyUsedArea
	{
		position:relative;
		width:450px
	}
	.BigFontSize
	{
	  font-size: 30px;
	  margin-right: 5px;
	}
	.sign {
	  font-size: 24px;
	}
	.haveUsed
	{
		left:33%;
		top:39%;
		font-size: 40px;
	}
	.stamp .copy 
	{
	  font-size: 20px;
	}
	.stamp .copy p {
	  font-size: 14px;
	}
	.stamp .copy
	{
		width:108px;
	}
}
@media screen and (max-width: 480px) {
	/* 如果使用者之視窗寬度 <= 480px，將會再載入這裡的 CSS。  */ 
	
	/*行動交易憑證*/
	.stamp {
	  width: 350px;
	  height: 120px;
	  padding: 0 10px;
	}
	
	.stamp i {
	  left: 20%;
	  top: 45px;
	  height: 250px;
	  width: 350px;
	}

	.stamp .par {
	  padding: 0 15px 0 20px;
	  width: 220px;
	  height: 120px;
	}
	.MyUsedArea
	{
		position:relative;
		width:350px
	}
	.BigFontSize
	{
	  font-size: 30px;
	  margin-right: 5px;
	}
	.sign {
	  font-size: 24px;
	}
	.haveUsed
	{
		left:33%;
		top:39%;
		font-size: 40px;
	}
	.stamp .copy 
	{
	  font-size: 20px;
	}
	.stamp .copy p {
	  font-size: 14px;
	}
}
@media screen and (max-width: 380px) {
	/* 如果使用者之視窗寬度 <= 380px，將會再載入這裡的 CSS。  */ 
	/*行動交易憑證*/
	.stamp {
	  width: 300px;
	  height: 120px;
	  padding: 0 10px;
	}
	
	.stamp i {
	  left: 20%;
	  top: 45px;
	  height: 250px;
	  width: 300px;
	}

	.stamp .par {
	  padding: 0 5px 0 5px;
	  width: 200px;
	  height: 120px;
	}
	.MyUsedArea
	{
		position:relative;
		width:300px
	}
	.BigFontSize
	{
	  font-size: 23px;
	  margin-right: 5px;
	}
	.sign {
	  font-size: 19px;
	}
	.haveUsed
	{
		left:31%;
		top:37%;
		font-size: 38px;
	}
	.stamp .copy 
	{
	  font-size: 18px;
	}
	.stamp .copy p {
	  font-size: 12px;
	}
	.stamp .copy
	{
		width:78px;
	}
}
@media screen and (max-width: 330px) {
	/* 如果使用者之視窗寬度 <= 320px，將會再載入這裡的 CSS。  */ 
	/*行動交易憑證*/
	.stamp {
	  width: 260px;
	  height: 90px;
	  padding: 0 10px;
	}
	
	.stamp i {
	  left: 30%;
	  top: 10px;
	  height: 250px;
	  width: 260px;
	}

	.stamp .par {
	  padding: 0 5px 0 10px;
	  width: 170px;
	  height: 90px;
	}
	.MyUsedArea
	{
		position:relative;
		width:260px
	}
	.BigFontSize
	{
	  font-size: 24px;
	  margin-right: 5px;
	}
	.sign {
	  font-size: 18px;
	}
	.haveUsed
	{
		left:30%;
		top:36%;
		font-size: 34px;
	}
	.stamp .copy 
	{
	  font-size: 14px;
	}
	.stamp .copy p {
	  font-size: 10px;
	}
}
/*--------------------------------
抽獎區
--------------------------------*/
.lottery-item {
    margin: 0 0 30px;
    cursor: pointer;
}
.lottery-imglink {
    display: block;
    position: relative;
    margin: 0 auto;
}
.lottery-imglink-hover {
    background: #e95b8d;
    position: absolute;
    top:0px;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: all ease 0.5s;
    -webkit-transition: all ease 0.5s;
    -moz-transition: all ease 0.5s;
}
.lottery-item:hover .lottery-imglink-hover  {
    opacity: 0.8;
}
.myLastTime{
    margin-bottom: 10px;
    background-color: #dbdbdb;
    padding: 5px;
    color:#333;
}
.myLastTimeHave{
    background-color: #f197b7;
	color:#ffffff;
}
.lottery-caption {
    /* max-width: 400px; */
    margin: 0 auto;
    background-color: white;
    text-align: center;
    padding: 25px;
    box-shadow: 0 1px 10px rgba(0,0,0,0.15);
}
.lottery-item:hover .lottery-caption{
    color:#e95b8d;
}
.lottery-item:hover .myLastTime{
    background-color:#e95b8d;
    color:#ffffff;
    opacity: 0.8;
}
.lottery-MyBoxListTitle {
    -webkit-box-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 2px solid #e95b8d;
	margin-top:10px;
}
.lottery-MyBoxListTabGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
	width:100%;
}
.lottery-myBoxListTitle{
    color:#e95b8d;
    min-width:120px;
    text-align: center;
    font-size: 1em;
    line-height: 1em;
    padding: 1rem 0 1rem 0;
    cursor: pointer;
	border:2px solid #e95b8d;
	border-bottom-width:0px;
	font-weight:bold;
}
.lottery-sendMessageBtn {
  background: linear-gradient(45deg, #e95b8d, #ed79a2);
  border: 0;
  border-radius: 3px;
  padding: 8px 30px;
  color: #fff;
  font-size:14px;
  margin-top:15px;
  width:100%;
  cursor: pointer;
}

.lottery-sendMessageBtn:hover {
  background: linear-gradient(45deg, #e53d78, #e74c83);
}
.lottery-myProdNumsMore
{
    color:#bdbdbd;
    margin-top: .2rem;
    font-size: .8em;
}
.mylotteryImgbtn{
  background: linear-gradient(45deg, #e95b8d, #ed79a2);
  border: 0;
  border-radius: 3px;
  padding: 4px 14px;
  color: #fff;
  font-size:13px;
  cursor: pointer;
}
.mylotteryImgbtn:hover {
  background: linear-gradient(45deg, #e53d78, #e74c83);
}
/*--------------------------------
粉絲專欄
--------------------------------*/
.myTalkBlock ul {
    padding-top: 40px;
}
.myTalkBlock ul li{
   overflow: hidden;
    width: 50%;
    float: left;
    background: #fff;
    text-align: center;
    color: #959595;
    transform: 1s;
    border: 3px solid #dbdbdb;
	margin-bottom:10px;
	cursor:pointer;
}
.myTalkBlock ul li .blog-img {
    float: left;
    width: 50%;
    height: 100%;
    overflow: hidden;
    z-index: 2;
}
.myTalkBlock ul li .blog-img {
    -webkit-transition: all 0.8s ease-out;
    -o-transition: all 0.8s ease-out;
    transition: all 0.8s ease-out;
}

.myTalkBlock ul li:hover .blog-img {
    transform: scale(1.2) rotate(10deg);
}
.myTalkBlock ul li .content-right {
    padding: 20px;
    font-size: 16px;
    line-height: 26px;
    float: right;
    width: 50%;
    height: 100%;
    position: relative;
    background-color: #ffffff;
    min-height: 207px;
    z-index: 3;
}
.myTalkBlock ul li .myTalkFonts {
    color: #323232;
    line-height: 26px;
    position: relative;
}
.myTalkBlock ul li .content-right:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    top: 50%;
    width: 30px;
    height: 30px;
    margin-top: -15px;
    background: #fff;
    transform: rotate(45deg);
    margin-left: -15px;
}
.myTalkBlock ul li .blog-img2 {
    float: right;
    width: 50%;
    height: 100%;
    overflow: hidden;
    z-index: 2;
}
.myTalkBlock ul li .blog-img2 {
    -webkit-transition: all 0.8s ease-out;
    -o-transition: all 0.8s ease-out;
    transition: all 0.8s ease-out;
}

.myTalkBlock ul li:hover .blog-img2 {
    transform: scale(1.2) rotate(10deg);
}
.myTalkBlock ul li .content-left {
    padding: 20px;
    font-size: 16px;
    line-height: 26px;
    float: left;
    width: 50%;
    height: 100%;
    position: relative;
    background-color: #ffffff;
    min-height: 207px;
    z-index: 3;
}
.myTalkBlock ul li .content-left:after {
   content: "";
    position: absolute;
    right: -15px;
    top: 50%;
    width: 30px;
    height: 30px;
    margin-top: 0px;
    background: #fff;
    transform: rotate(45deg);
}
@media only screen and (max-width: 991px) and (min-width: 768px){
    .myTalkBlock ul li {
        width: 100%;
    }
    .myTalkBlock ul li .content-right,.myTalkBlock ul li .content-left {
        min-height: 295px;
    }
}
@media only screen and (max-width: 767px){
    .myTalkBlock ul li {
        float: none;
        width: 100%;
        height: 100%;
    }
    .myTalkBlock ul li .blog-img, .myTalkBlock ul li .blog-img2 {
        float: none;
        width: 100%;
    }
    .myTalkBlock ul li .content-right,.myTalkBlock ul li .content-left {
    float: none;
    width: 100%;
    padding: 20px 35px;
        min-height: auto;
    }
}
/*--------------------------------
求職網
--------------------------------*/
.people_well {
    min-height: 20px;
    padding: 15px;
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 3px;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.2);
}
.page-job-list{
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.2);
    border-radius: 3px;
    overflow: hidden;
}
.page-job-list .well-list-item {
    padding: 20px;
    background-color: #fff;
    position: relative;
    border-bottom: 1px solid #eee;
    word-wrap: break-word;
    cursor: pointer;
}
.page-job-list .well-list-item:hover{
    background-color: #fbfbfb;
}
.job_title{
    color:#805a45;
    font-size: 20px;
}
.job_in_title{
	color:#805a45;
    font-size: 30px;
	text-align:center;
	margin-bottom:10px;
}
.job_title_bottom{
	font-size: 13px;
	margin-top:10px;
}
.job_Con_title{
    color:#757575;
    font-size: 18px;
    margin-top: 10px;
	font-weight:bold;
}
.job_Con{
    color:#757575;
    font-size: 16px;
    margin-top: 10px;
}
.job_muted_title{
    color:#333;
    font-size:15px;
}
.job_muted{
    color:#aaa;
    margin: 10px 0 10px;
    font-size: 13px;
}
.job_label{
    border: 1px solid #ccc;
    font-weight: 400;
    font-size: 12px;
    line-height: 1;
    color: #333;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 5px;
    padding: 2px;
}
.job_label:hover {
    color: #000;
    border-color: #555;
}
.middot:before {
    content: "\00b7";
    padding: .8em;
}
.page-job-list-comment{
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.2);
    border-radius: 3px;
    overflow: hidden;
	padding:10px;
	margin-top:10px;
}
/*fastselect*/
.fstMultipleMode .fstControls {
    box-sizing: border-box !important;
    padding: 0px !important;
    overflow: hidden !important;
    width: 100% !important;
}
.fstElement {
    font-size: 12px !important;
    width:100% !important;
}
.fstChoiceItem {
    font-size: 12px !important;
    margin: 5px 5px 0 !important;
    padding: 5px 5px 5px 18px !important;
}
.fstResultItem {
    font-size: 12px !important;
    padding: 5px 5px !important;
}
.fstResults {
    max-height: 200px !important;
}


/* 20180725 add */
.talk-noResult {
    width: 100%;
    text-align: center;
    color: #ff9e39;
    font-size: 24px;
    font-weight: bold;
    padding: 20px 0 20px 0;
}

.talk-footCircleFonts-1 {
    font-size: 14px;
    margin: 0 auto;
    margin-top: 10px;
    color: #ff9e39;
    padding-bottom: 3px;
    text-align: center;
    cursor: pointer;
}

/*上傳樣式*/
.file2 {
    position: relative;
    display: inline-block;
    border: 1px solid #F0F0F0;
    background-color: #FCFCFC;
    border-radius: 4px;
    overflow: hidden;
    color: #ccc;
    text-decoration: none;
    text-indent: 0;
	text-align:center;
}
.file2 input {
    position: absolute;
    font-size: 100px;
    right: 0;
    top: 0;
    opacity: 0;
}
.file2:hover {
    border-color: #286090;
    color: #286090;
    text-decoration: none;
}
.file2BackImg
{
	-webkit-background-size:cover;
	background-size:cover;
	background-color:#F0EFEF;
	background-repeat:no-repeat;
	background-position: center;
}
.divInline {
    display: inline-block;
}

/*--------------------------------
語系切換
--------------------------------*/
.myLanguage{
	display:inline-block;
	cursor:pointer;
	padding:5px;
	border:1px solid #e5e5e5;
	background: #fff;
	color:#333;
	transition: 0.5s;
	-webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}
.myLanguage:hover{
	box-shadow: 0px 0px 30px rgba(73, 78, 92, 0.15);
	background:#e5e5e5;
}
.myLangBtn{
	display:inline-block;
	padding:4px;
	border:1px solid #e5e5e5;
	background: #fff;
	transition: 0.5s;
	-webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
	margin:4px;
	cursor:pointer;
}
.myLangBtn:hover{
	box-shadow: 0px 0px 30px rgba(73, 78, 92, 0.15);
}
.slick-slide img{
	display: inline !important;
}

.myMasonry{
	margin-bottom:2px;
	width:160px;
}
#lightBoxGallery{
	margin: 0 auto;
	max-width:100%;
	text-align:center;
}
#lightBoxGallery:after{
  content: '';
  display: block;
  clear: both;
}

/*--------------------------------
20180914 add search
--------------------------------*/
.noResult {
    width: 100%;
    text-align: center;
    color: #666;
    font-size: 26px;
    font-weight: bold;
    padding: 20px 0 20px 0;
}
.searchNumsShow {
    color: #666;
    font-size: 12px;
    height: 35px;
    line-height: 46px;
}
.searchDiv
{
	margin:0 auto;
    background-color: #fff;
    width: 90%;
    border: 1px solid;
    border-color: #e5e6e9 #dfe0e4 #d0d1d5;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
	margin-bottom:10px;
	font-size: 13px;
}
.searchFonts
{
	width: 90%;
	margin:0 auto;
	font-size:25px;
}
.searchDataStyle
{
	border-bottom:1px solid #e3e3e3;
	padding:10px 5px 10px 0;
	cursor:pointer;
}
.searchNumsShow
{
	color:#666;
	font-size:12px;
	height:35px;
	line-height:46px;
}
.newsHidden, .shopHidden, .questionHidden, .signHidden, .lotteryHidden, .electHidden, .peopleHidden, .talkHidden
{
	display:none;
}
.searchDataStyle:hover
{
	background-color:#e3e3e3;
}
.peopleColor
{
	color:#805a45;
}
.peopleColor:hover
{
	color:#5f4333;
}
.lotteryColor
{
	color:#e95b8d;
}
.lotteryColor:hover
{
	color:#e32e6e;
}
.questionColor
{
	color:#9bb03e;
}
.questionColor:hover
{
	color:#7a8a31;
}
.electColor
{
	color:#e7494f;
}
.electColor:hover
{
	color:#e01d25;
}
.newsColor
{
	color:#3998dc;
}
.newsColor:hover
{
	color:#227ec0;
}
.signColor
{
	color:#47c973;
}
.signColor:hover
{
	color:#32ab5b;
}
.shopColor
{
	color:#a493da;
}
.shopColor:hover
{
	color:#846dcd;
}
.talkColor
{
	color:#ff9e39;
}
.talkColor:hover
{
	color:#ff8506;
}
/*--------------------------------
20190130 add
--------------------------------*/
.no-images{
	width:90px;
	height:68px;
	background-color:#ededed;
	border:4px solid #f6f6f6;
}
/*--------------------------------
20190502 add
--------------------------------*/
.tags_style
{
	background-color:#FF5511;
	width:30px;
	height:15px;
	margin-left:5px;
	position:absolute;
	
	-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.33);
	-moz-box-shadow: 0 0 5px rgba(0,0,0,0.33);
	box-shadow: 0 0 5px rgba(0,0,0,0.33);

}
.tags_style:before
{
	content:'';
	position:absolute;
	top:15px;
	left:0px;
	width:0;
    border-width:15px;
    border-style:solid;
    border-color:#FF5511 transparent transparent transparent; /* transparent 设置边框颜色透明 */
}

.myShop_con
{
	overflow-y:auto;
}
.myShop_con table
{
	max-width:100% !important;
}

/*-------------20201120 add-------------------*/
.blue-bg,
.bg-success {
  background-color: #fe8a8a;
  color: #ffffff;
}

/* New Timeline style */
.vertical-container {
  /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */
  width: 90%;
  max-width: 1170px;
  margin: 0 auto;
}
.vertical-container::after {
  /* clearfix */
  content: '';
  display: table;
  clear: both;
}
#vertical-timeline {
  position: relative;
  padding: 0;
  margin-top: 2em;
  margin-bottom: 2em;
}
#vertical-timeline::before {
  content: '';
  position: absolute;
  top: 0;
  left: 18px;
  height: 100%;
  width: 3px;
  background: #999;
}
.vertical-timeline-content .btn {
  float: right;
}
#vertical-timeline.light-timeline:before {
  background: #e7eaec;
}
/* 
.dark-timeline .vertical-timeline-content:before {
  border-color: transparent #f5f5f5 transparent transparent;
}
.dark-timeline.center-orientation .vertical-timeline-content:before {
  border-color: transparent transparent transparent #f5f5f5;
}
.dark-timeline .vertical-timeline-block:nth-child(2n) .vertical-timeline-content:before,
.dark-timeline.center-orientation .vertical-timeline-block:nth-child(2n) .vertical-timeline-content:before {
  border-color: transparent #fff transparent transparent;
} */
.dark-timeline .vertical-timeline-content,
.dark-timeline.center-orientation .vertical-timeline-content {
 
  background-color: #fff;
  box-shadow: 0 0 3px #ccc;
}
@media only screen and (min-width: 1170px) {
  #vertical-timeline.center-orientation {
    margin-top: 3em;
    margin-bottom: 3em;
  }
  #vertical-timeline.center-orientation:before {
    left: 50%;
    margin-left: -2px;
  }
}
@media only screen and (max-width: 1170px) {
  .center-orientation.dark-timeline .vertical-timeline-content:before {
    border-color: transparent #f5f5f5 transparent transparent;
  }
}
.vertical-timeline-block {
  position: relative;
  margin: 2em 0;
}
.vertical-timeline-block:after {
  content: "";
  display: table;
  clear: both;
}
.vertical-timeline-block:first-child {
  margin-top: 0;
}
.vertical-timeline-block:last-child {
  margin-bottom: 0;
}
@media only screen and (min-width: 1170px) {
  .center-orientation .vertical-timeline-block {
    margin: 4em 0;
  }
  .center-orientation .vertical-timeline-block:first-child {
    margin-top: 0;
  }
  .center-orientation .vertical-timeline-block:last-child {
    margin-bottom: 0;
  }
}
.vertical-timeline-icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  font-size: 16px;
  text-align: center;
}
.vertical-timeline-icon i {
  display: block;
  width: 24px;
  height: 24px;
  position: relative;
  left: 50%;
  top: 50%;
  margin-left: -12px;
  margin-top: -9px;
}
@media only screen and (min-width: 1170px) {
  .center-orientation .vertical-timeline-icon {
    width: 50px;
    height: 50px;
    left: 50%;
    margin-left: -25px;
    -webkit-transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    font-size: 19px;
  }
  .center-orientation .vertical-timeline-icon i {
    margin-left: -12px;
    margin-top: -10px;
  }
  .center-orientation .cssanimations .vertical-timeline-icon.is-hidden {
    visibility: hidden;
  }
}
.vertical-timeline-content {
  position: relative;
  margin-left: 60px;
  background: white;
  
  padding: 1em;
  
  transition: all .15s ease-in-out;
}
.vertical-timeline-content:hover {
	box-shadow: 0 0 10px #ccc !important;
}
.vertical-timeline-content:after {
  content: "";
  display: table;
  clear: both;
}
.vertical-timeline-content h2 {
  font-weight: 400;
  margin-top: 4px;
}
.vertical-timeline-content p {
  margin: 1em 0;
  line-height: 1.6;
}
.vertical-timeline-content .vertical-date {
  float: left;
  font-weight: 500;
  padding-top:14px;
  
  letter-spacing:2px;
  color:#666;
  font-weight:bold;
  
}
.index1_number
{
	font-size:23px;
}
.vertical-date small {
  color: #1ab394;
  font-weight: 400;
}
/* .vertical-timeline-content::before {
  content: '';
  position: absolute;
  top: 16px;
  right: 100%;
  height: 0;
  width: 0;
  border: 7px solid transparent;
  border-right: 7px solid white;
} */
@media only screen and (min-width: 768px) {
  .vertical-timeline-content h2 {
    font-size: 18px;
  }
  .vertical-timeline-content p {
    font-size: 13px;
  }
}
@media only screen and (min-width: 1170px) {
  .center-orientation .vertical-timeline-content {
    margin-left: 0;
    padding: .5em;
    width: 45%;
  }
  /* .center-orientation .vertical-timeline-content::before {
    top: 24px;
    left: 100%;
    border-color: transparent;
    border-left-color: white;
  } */
  .center-orientation .vertical-timeline-content .btn {
    float: left;
  }
  .center-orientation .vertical-timeline-content .vertical-date {
    position: absolute;
    width: 100%;
    left: 122%;
    top: 2px;
    font-size: 14px;
  }
  .center-orientation .vertical-timeline-block:nth-child(even) .vertical-timeline-content {
    float: right;
  }
  /* .center-orientation .vertical-timeline-block:nth-child(even) .vertical-timeline-content::before {
    top: 24px;
    left: auto;
    right: 100%;
    border-color: transparent;
    border-right-color: white;
  } */
  .center-orientation .vertical-timeline-block:nth-child(even) .vertical-timeline-content .btn {
    float: right;
  }
  .center-orientation .vertical-timeline-block:nth-child(even) .vertical-timeline-content .vertical-date {
    left: auto;
    right: 122%;
    text-align: right;
  }
  .center-orientation .cssanimations .vertical-timeline-content.is-hidden {
    visibility: hidden;
  }
}
.v20201120_timelinetitle
{
	width:100%;
	position:absolute;
	bottom:0px;
	left:0px;
	background-color:rgba( 0,0,0, 0.5 );
	color:#fff;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	padding:10px;
}

/*20201121 add*/
.blockContent_v1
{
	position:relative;
	
	clear: both;
    background: #fff;
    padding: 20px;
    padding-bottom: 30px;
	
	background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url( "../images/20201120/background center_step by step.png" );
}
#myNewCon .clockRight_v1{
    float: right;
	font-size:20px !important;
	font-weight:600;
}
.myNewTitle_v1 {
	
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	
    font-size:1.6em;
    padding: .8rem;
    margin-top: .8rem;
    margin-bottom: .8rem;
	word-wrap:break-word;
}

.mv1_left
{
	background-image:url( "../images/20201120/title big circle_step by step.png" );
	background-repeat:no-repeat;
	background-position:0px -1px;
	width:96px;
	height:90px;
}
.mv1_middle
{
	position:relative;
	width:calc( 100% - 96px );
	background-image:url( "../images/20201120/title line circle_step by step.png" );
	background-repeat:repeat-x;
	background-position:left bottom;
	padding-left:5px;
}
.mv1_middle .mv1_txt
{
	width:100%;
	position:absolute;
	left:5px;
	bottom:10px;
}
.mv1_right
{
	/* background-image:url( "../images/20201120/title samll circle_step by step.png?ts=1" );
	background-repeat:no-repeat;
	background-position:0px -1px;
	width:32px;
	height:90px; */
}
.con_log
{
	position:absolute;
	bottom:15px;
	right:15px;
	width:100px;
}
.con_log img
{
	max-width:100%;
}
.sign_area
{
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
}
.sign_area_al
{
	position:relative;
	width:50%;
	text-align:center;
	height:140px;
}
.sign_area_img
{
	width:100%;
	position:absolute;
	bottom:0px;
	left:25%;
}
.sign_area_img1
{
	width:100%;
	position:absolute;
	bottom:0px;
	left:0px;
}
.sign_area_bottom
{
	width:100%;
	height:50px;
	background-image:url( "../images/20201120/thick line_activiti in erlin.png?ts=2" );
	background-repeat:repeat-x;
}

.repeat_img_logo
{
   position:absolute;
   width:100%;
   height:100%;
   left:0px;
   top:0px;
   background-image: url(../images/20201120/bg_20201120.png);
  background-repeat: repeat;
}

.sign_bgimg_logo1
{
   position:absolute;
   left:0px;
   top:200px;
   width:81px;
   height:162px;
   background-image: url("../images/20201120/background left 1_activiti in erlin.png" );
  background-repeat: no-repeat;
}

.sign_bgimg_logo2
{
   position:absolute;
   left:0px;
   bottom:0px;
   width:72px;
   height:162px;
   background-image: url("../images/20201120/background left 2_activiti in erlin.png" );
  background-repeat: no-repeat;
}
.sign_bgimg_logo3
{
   position:absolute;
   right:0px;
   top:250px;
   width:81px;
   height:162px;
   background-image: url("../images/20201120/background right 1_activiti in erlin.png" );
  background-repeat: no-repeat;
}
.sign_bgimg_logo4
{
   position:absolute;
   right:0px;
   bottom:0px;
   width:438px;
   height:529px;
   background-image: url("../images/20201120/background right 2_activiti in erlin.png" );
  background-repeat: no-repeat;
}
.sign_bgimg_logo5
{
   position:absolute;
   right:0px;
   bottom:100px;
   width:250px;
   height:301px;
   background-image: url("../images/20201120/background right 2_activiti in erlin.png" );
  background-repeat: no-repeat;
  background-size: cover;
}
.sbloago5_relative
{
	position:relative;
	width:100%;
	height:100%;
}
.sblogo5_run
{
    margin: auto;
  position: absolute;
  top: 0; left: 0; bottom: 0; right: 0;
   width:80px;
   height:87px;
   background-image: url("../images/20201120/background right 3_activiti in erlin.png" );
  background-repeat: no-repeat;
  background-size: cover;
}
/*-----報名-----*/
.sign-section_v1 {
	position:relative;
    background-color: #fff;
    cursor: pointer;
    margin-bottom:30px;
	
	transition: all .15s ease-in-out;
}
.sign-section_v1_left
{
	position:absolute;
	top:-18px;
	left:-19px;
	width:60px;
	height:60px;
	background-image:url( "../images/20201120/angle 1_activiti in erlin.png" );
	background-size: cover;
	background-repeat: no-repeat;
}
.sign-section_v1_right
{
	position:absolute;
	bottom:-18px;
	right:-19px;
	width:60px;
	height:60px;
	background-image:url( "../images/20201120/angle 2_activiti in erlin.png" );
	background-size: cover;
	background-repeat: no-repeat;
}
.sign-section_v1:hover {
	box-shadow: 0 0 3px #ccc;
}
.sign_textbg
{
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	background-image:url( "../images/20201120/picturecover_activitinerlin.png" );
	background-size: cover;
	background-repeat: no-repeat;
}
.sign_textbg_relative
{
	position:relative;
	width:100%;
	height:100%;
}
.s_textbg_al
{
	position:absolute;
	width:40%;
	bottom:0px;
	right:0px;
}
.s_textbg_title
{
	text-align:right;
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
	padding-right:5px;
}
.s_textbg_time
{
	text-align:right;
	font-size:12px;
	margin-bottom:5px;
	padding-right:5px;
}


.history_area_bottom
{
	width:100%;
	height:50px;
	background-image:url( "../images/20201120/think line_change in erlin.png?ts=2" );
	background-repeat:repeat-x;
}
.history_bgimg_logo1
{
   position:absolute;
   left:0px;
   bottom:0px;
   width:129px;
   height:131px;
   background-image: url("../images/20201120/background left_change in erlin.png" );
   background-size: cover;
  background-repeat: no-repeat;
}

.history_bgimg_logo2
{
   position:absolute;
   right:0px;
   top:0px;
   width:129px;
   height:212px;
   background-image: url("../images/20201120/background right_change in erlin.png" );
  background-repeat: no-repeat;
}

.history_bgimg_in_logo2
{
  position:absolute;
   right:0px;
   top:100px;
   width:129px;
   height:212px;
   background-image: url("../images/20201120/background right_change in erlin.png" );
  background-repeat: no-repeat;
}

.blockContent_v2
{
	position:relative;
	
	clear: both;
    background: #fff;
    padding: 20px;
    padding-bottom: 30px;
}

.myNewTitle_v2 {
	
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	
    font-size:1.6em;
    padding: .8rem;
    margin-top: .8rem;
    margin-bottom: .8rem;
	word-wrap:break-word;
}

.mv1_left_v2
{
	background-image:url( "../images/20201120/titlebigcircle_activitiinerlin.png" );
	background-repeat:no-repeat;
	background-position:0px 1px;
	width:96px;
	height:90px;
}
.mv1_middle_v2
{
	position:relative;
	width:calc( 100% - 96px );
	background-image:url( "../images/20201120/titlelinecircle_activitiinerlin.png" );
	background-repeat:repeat-x;
	background-position:left bottom;
	padding-left:5px;
}
.mv1_middle_v2 .mv1_txt
{
	width:100%;
	position:absolute;
	left:5px;
	bottom:10px;
}
.mv1_right_v2
{
	/* background-image:url( "../images/20201120/title samll circle_step by step.png?ts=1" );
	background-repeat:no-repeat;
	background-position:0px -1px;
	width:32px;
	height:90px; */
}

.blockContent_v3
{
	position:relative;
	
	clear: both;
    background: #fff;
}

.myNewTitle_v3 {
	
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	
    font-size:1.6em;
    padding: .8rem;
    margin-top: .8rem;
    margin-bottom: .8rem;
	word-wrap:break-word;
}
.mv1_left_v3
{
	background-image:url( "../images/20201120/title big circle_change in erlin.png" );
	background-repeat:no-repeat;
	background-position:0px 1px;
	width:96px;
	height:90px;
}
.mv1_middle_v3
{
	position:relative;
	width:calc( 100% - 96px );
	background-image:url( "../images/20201120/title line_change in erlin.png" );
	background-repeat:repeat-x;
	background-position:left bottom;
	padding-left:5px;
}
.mv1_middle_v3 .mv1_txt
{
	width:100%;
	position:absolute;
	left:5px;
	bottom:10px;
}
.mv1_right_v3
{
	/* background-image:url( "../images/20201120/title samll circle_step by step.png?ts=1" );
	background-repeat:no-repeat;
	background-position:0px -1px;
	width:32px;
	height:90px; */
}

#myNewCon .myNavArea_history{
	padding:20px 20px 0 20px;
    font-size:15px;
    position: relative;
}
#myNewCon .myNavArea_history a
{
  color: #222;   
}
#myNewCon .myNavArea_history a:hover
{
   color: #757575;  
}
.history_padding
{
	padding:0px 20px 0px 20px;
}
.history_padding_v2
{
	padding:0px 20px 30px 20px;
}
.sbloago5_relative_v2
{
	position:relative;
	width:100%;
	height:100%;
	
	-webkit-background-size: 100% 100%;
     background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("../images/20201120/background center_change in erlin.png");
}
.history_bgimg_logo3
{
	position: absolute;
    bottom: 15px;
    right: 80px;
    width: 100px;
}
@media (max-width: 768px){
	.history_bgimg_logo3
	{
		right: 50px;
		width: 80px;
	}
}
@media (max-width: 600px){
	.history_bgimg_logo3
	{
		right: 20px;
		width: 80px;
	}
	.mv1_middle_v3 .mv1_txt, .mv1_middle .mv1_txt, .mv1_middle_v2 .mv1_txt
	{
		font-size:18px;
	}

}
@media (max-width: 480px){
	.history_bgimg_logo3
	{
		right: 15px;
		width: 70px;
	}
	.mv1_left_v3, .mv1_left, .mv1_left_v2
	{
		width:0px;
	}
	.mv1_middle_v3, .mv1_middle, .mv1_middle_v2
	{
		width:100%;
	}
	.mv1_middle_v3 .mv1_txt, .mv1_middle .mv1_txt, .mv1_middle_v2 .mv1_txt
	{
		font-size:16px;
	}

}

.history_list
{
	position:relative;
	width:100%;
}
.history_listinv1
{
	position:relative;
	width:100%;
	height:100%;
	
	-webkit-background-size: 100% 100%;
     background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("../images/20201120/imformation board 3_change in erlin.png");
}
.history_title
{
	
	background-color: #ffffff;
	
	padding:10px;
	min-height:45%;
	width:100%;
	color: #757575;
	
}
.history_middle
{
	background-color:#fff;
	font-size:14px;
	padding:10px;
	color: rgba(0,0,0,.6);
	width:100%;
	text-align:left;
	line-height:1.8;
	
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
}
.history_footer
{
	cursor:pointer;
	position:absolute;
	bottom:10px;
	right:10px;
	font-size:14px;
	color:rgba( 0,0,0, 0.54 );
	padding:5px;
	border: 1px solid #e5e5e5;
    background-color: #f7f8f8;
}
.history_list_section_v1
{
	cursor:pointer;
	position: relative;
    background-color: #fff;
    
	border-bottom: 1px dashed #e5e5e5;
	
	padding-top: 5px;
	padding-bottom: 5px;
	
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
.history_list_section_v1:hover
{
	box-shadow: 0 1px 5px rgba(0,0,0,.15);
}
.history_list_section_v1:hover .history_title
{
	color:#3296FF;
}
.history_list_section_v1:hover .history_footer
{
	color:#fff;
	background-color: #3296FF;
}
.flex_img
{
	width:30%;
}
.flex_text
{
	position:relative;
	width:70%;
}

.history_tag
{
	position:absolute;
	top:0px;
	left:0px;
	height:100%;
	color:#fff;
	letter-spacing: 2px;
	padding-top:30%;
	padding-left:20px;
	padding-right:20px;
	-webkit-writing-mode:vertical-lr;
	writing-mode:vertical-lr;
}
.history_tag_hr
{
	position:absolute;
	top:0px;
	left:70px;
	width:10px;
	height:100%;
}
.history_tag_bg1
{
	background-color:rgba( 0, 0, 0, 0.45 );
}
.history_tag_bg2
{
	background-color:rgba( 255, 81, 81, 0.45 );
}
.history_tag_bg3
{
	background-color:rgba( 106, 106, 255, 0.45 );
}

@media (max-width: 768px) {
	.history_list_section_v1
	{
		display:block;
	}
	.flex_img
	{
		width:100%;
	}
	.flex_text
	{
		position:relative;
		width:100%;
	}
	.history_footer
	{
		position:relative;
		float:right;
	}
}