@import url("reset.css");
:root {
  --transform-right: rotate(15deg) scale(1.01) translateZ(0);
  --transform-left: rotate(-15deg) scale(1.01) translateZ(0);
  --transform-right-sm: rotate(8deg) scale(1.01) translateZ(0);
  --transform-left-sm: rotate(-8deg) scale(1.01) translateZ(0);
  --ui-drop-shadow:0px 8px 24px rgba(0,0,0,.25);
  --ui-drop-shadow-sm:0px 0px 16px rgba(0,0,0,.1);
  --red-text: #e6281c;
  --red-bg: #e6281c;
  --pink-text: #f73e97;
  --pink-bg: #f73e97;
  --orange-bg: #f15018;
  --yellow-bg: #ffa703;
  --lightyellow-bg: #fdff33;
  --blue-bg: #3f5dbb;
  --lightblue-bg: #8cdbff;
  --bluepurple-bg: #4f34c7;
  --one-blue-text: #6d85f2;
  --one-blue-bg: #6d85f2;
  --two-blue-text: #6e63d5;
  --two-blue-bg: #6e63d5;
  --three-blue-text: #4a41c7;
  --three-blue-bg: #4a41c7;
}
html,body,div,span,iframe,h1,h2,h3,h4,h5,h6,p,a,form,img {
	margin: 0px;
	padding: 0px;
	border: 0px;
}
html,body {
  overflow-x: hidden;}
body{
	font-size: 16px;
	font-family: Arial, Helvetica,"微軟正黑體","Microsoft JhengHei", simhei, sans-serif;
	background: #fff;
}
main{
	overflow: hidden;
    background: url("../img/team/001-1bg.jpg") center -1% repeat-y;
    background-size: 150%;
}
.italic{
	font-style: italic;
}
audio, canvas, progress, video{
	width: 250px;
	height: 40px;
}
a {
    color: #3F5DBB;
	text-decoration: none;
	/*font-size:1.125rem;*/
    outline: none; /* for Firefox */                   
    -webkit-transition: .3s all ease; 
	transition: .3s all ease;
}
a,
a:visited,
a:focus,
a:hover,
a.active {
  outline: 0; }
a:hover,
a:focus {
    text-decoration: none; }
a,
a:visited,
a:focus,
a:hover,
a.active {
    outline: 0; }
.ahover p:hover,.ahover p:focus{
	transform: scale(1.05);
	color: #212529;
}
.btn:focus,
.btn:active,
.btn.active,
.btn:active:focus {
    outline: 0;
}
a.btn-bg{
	font-size: 0.75rem;
	color: #f2f2f2;
	font-weight: bold;
    text-align: center;
    line-height: 1.15;
	margin: 2px auto;
	padding:6px 12px 10px;
	border-radius:62px;
    border: #2a56d2 solid 0px;
	background: #2a56d2;
	background: linear-gradient(45deg, rgba(78, 18, 158, 0.9) 13%, rgba(42, 86, 210, 1) 100%);
    -webkit-box-shadow: 0 0 20px -5px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 20px -5px rgba(0, 0, 0, 0.1);
    position: relative;
    display: inline-block;
    z-index: 2;
}
a.btn-bg:hover, a.btn-bg:focus{
	color: #fff;
	background: #2a56d2;
	background: linear-gradient(60deg, rgba(56, 48, 168, 0.9) 13%, rgba(42, 86, 210, 1) 100%);
    border: transparent solid 0px;
}
a.btn-bg:focus{
	color: #fff;
	background: #2a56d2;
	background: linear-gradient(60deg, rgba(56, 48, 168, 0.9) 13%, rgba(42, 86, 210, 1) 100%);
    border: transparent solid 0px;
}
a.btn-bg img.icon-btn{
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
}

.transform-left, img.transform-left {
  transform: var(--transform-right); /* 順時針轉 */
}
.transform-right, img.transform-right {
  transform: var(--transform-left); /* 逆時針轉 */
}
.transform-left-sm, img.transform-left-sm {
  transform: var(--transform-right-sm); /* 順時針轉 */
}
.transform-right-sm, img.transform-right-sm {
  transform: var(--transform-left-sm); /* 逆時針轉 */
}
.flipped-image {
  transform: scaleX(-1); /* 水平翻轉 */
  -webkit-transform: scaleX(-1);
  -moz-transform: scaleX(-1);
}


button {
	margin: 0px;
	padding: 0px;
	border: 0px; }
button:hover {
  outline: none; /* for Firefox */
  hlbr:expression(this.onFocus=this.blur()); /* for IE */ }


.d-flex a{
	margin-left:5px;
	margin-right:5px;
}
.d-none-sm {
  display: inline-block;
}
.shadow{
	-webkit-box-shadow: 0 2px 10px -2px rgb(0 0 0 / 40%);
            box-shadow: 0 2px 10px -2px rgb(0 0 0 / 40%);
}
.box-shadow{
	-webkit-box-shadow: 0 2px 15px -2px rgb(0 0 0 / 30%);
            box-shadow: 0 2px 15px -2px rgb(0 0 0 / 30%);
}
.drop-shadow{
	-webkit-filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.25));
     filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.25));
}
.deep-shadow{
	-webkit-filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.50));
     filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.50));
}
.lg-shadow{
	-webkit-filter: drop-shadow(0 1.125rem 1.125rem rgba(0, 0, 0, 0.25));
     filter: drop-shadow(0 1.125rem 1.125rem rgba(0, 0, 0, 0.25));
}

@media screen and (max-width: 575.98px) {
	.d-none-sm {
		display: none;
	 }
}

/*btn */
.btn{
	background: linear-gradient(0deg, #fafaf6 0%, #e3e2f7 55%, #d8d7f7 72%, #cdcbf8 100%);/*background: #304b98;*/
    -webkit-box-shadow: 0 2px 15px 5px rgb(0 0 0 / 10%);
        box-shadow: 0 2px 15px 5px rgb(0 0 0 / 10%);
	color: #817a9e;
	/*text-shadow: 1px 1px 2px #0b2958;*/
	padding: 5px 6px;
	border-radius:20px;
    border: #fff solid 1px;
	font-size: 0.8125rem;
	font-weight: bold;
}
.btn:visited{
	color: #817a9e;
    border-color: #fff;
}
.btn:hover,.btn:focus{
	color: #817a9e;
    border-color: #fff;
    text-decoration: none;
	text-shadow: none;
	-webkit-box-shadow: 0 2px 10px -2px rgb(0 0 0 / 10%);
        box-shadow: 0 2px 10px -2px rgb(0 0 0 / 10%);
}

p {
    font-size: 1.125rem;
}
p.large {
    font-size: 1.25rem;
}
@media(min-width: 768px) {
.btn {
    font-size: 1.125rem;
    padding: 5px 15px; }
p.large {
    font-size: 1.25rem; }}
@media(min-width: 576px) {
p {
    font-size: 1.25rem; }}

h1,
h3,
h4,
h5,
h6 {
    text-transform: uppercase;
}

b, strong ,.b {
	font-weight: bold;
}
.fs-0{
	font-size: 4.5rem;
}
.fs-1{
	font-size: 4rem;
}
.fs-2{
	font-size: 3.5rem;
}
.fs-3{
	font-size: 3rem;
}
.fs-4{
	font-size: 2.5rem;
}
.fs-5{
	font-size: 2rem;
}
.fs-6{
	font-size: 1.5rem;
}
.fs-s{
	font-size: 0.875rem;
}
.fs-ss{
	font-size: 0.8125rem;
}
div > img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
}
img {
	margin: 0px;
	padding: 0px;
	border: 0px;
}
img.auto {
	margin: 0px auto;
	width: auto;
	height: auto;
    max-width: 100%;
	max-height: 100%;
}
button {
    outline: 0;
}

.text-muted {
	color: #555;
	font-size: 1.125rem;
	text-align: center;
}

.text-muted.left {
	text-align: left;
}

.text-muted.right {
	text-align: right;
}

.text-muted.dplay {
	display: inline-block;
	margin: 5px;
}

.text-primary {
    color:#202020; }

.text-white-shadow {
    font-weight: bold;
    text-shadow: 1px 1px 5px rgb(255, 255, 255); }

.text-white {
    color: rgb(255, 255, 255);
    font-weight: bold;
    text-shadow: 1px 1px 5px rgb(42, 42, 122); }

.text-pink {
    color: #e75297; }
	
.text-deepgray {
    color: #424242; }

.text-yellow {
  color: #ffe564; }
.text-light {
	color: #ffe564; 
	text-shadow: 1px 1px 2px rgb(22, 22, 22); }
.text-org {
    color: #fd4a2c; }
.text-purple{
	color: #891fbb; }
.text-lightpurple {
    color: #cfd7f7; }
.text-lightblue {
    color: #8cdbff; }
.text-skyblue {
    color: #44abe5; }
.text-deepblue {
    color: #102289; }
.text-red {
  color: var(--red-text); }
.text-4u{
    color: #009cb2; }
.text-ap{
    color: #e57977; }
	
.text-blue {
    color: #3F5DBB; }
.text-green{
	color: #afffd3;
	text-shadow: 1px 1px 2px rgb(22, 22, 22); }
.text-lightgreen{
	color: #cdffca;
	text-shadow: 1px 1px 2px rgb(87, 87, 87); }
.text-bluegreen {
    color: #0cbfa9; }
.text-deepgreen {
    color: #0b404b; }
.text-gray{
	color: #666666; }
.text-main {
  color: #212529;
  text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.5); }

.text-yb{
    background: linear-gradient(to top, #8d37c4, #c6fefa, #00fdcf);
    background: -webkit-linear-gradient(to top, #8d37c4, #c6fefa, #00fdcf);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}
.text-pb{
    background: linear-gradient(to top, #5C37C6, #5C37C6, #002599);
    background: -webkit-linear-gradient(to top, #5C37C6, #5C37C6, #002599);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}
.text-pb-left{
    background: linear-gradient(to left, #FF39E0, #5C37C6, #002599);
    background: -webkit-linear-gradient(to left, #FF39E0, #5C37C6, #002599);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

.img-centered {
    margin: 0 auto;
}
.box-line{
	margin: 0 auto;
    background: rgba(255,255,255,0.65);
	/*border: 4px solid #fff;*/
	-webkit-box-shadow: 0 2px 15px -2px rgb(0 0 0 / 30%);
            box-shadow: 0 2px 15px -2px rgb(0 0 0 / 30%);
}
.bg-black {
    background-color: #000; }
.bg-white-50 {
    background-color: rgba(255,255,255,0.50); }
.bg-light-gray {
    background-color: #f2f2f2; }
.bg-darkest-gray {
    background-color: #222; }
.bg-gray {
    background-color: #aa98b4; }
.bg-yellow {
    background-color: #ffa703; }
.bg-light-yellow {
    background-color: #f3fe78; }
.bg-blue {
    background-color: #3f5dbb; }
.bg-light-blue {
    background-color: var(--lightblue-bg); }
.bg-blue-purple {
    background-color: var(--bluepurple-bg); }
.bg-deepblue {
	background-color: #31218f; }	
.bg-purple {
    background-color: #531d73; }
.bg-pink{
	background-color: var(--pink-bg);}	
.bg-orange {
    background-color: #f56148; }
.bg-red {
    background-color: #e60238; }
.bg-green {
    background: rgba(146,224,255,0.50); }
.bg-light-green {
    background-color: #b2d1c5; }
.bg-col-ring {
    background-color: #fdf9f3; }
.bg-col-1 {
    background-color: #bcd61f; }
.bg-col-2 {
    background-color: #f4de20; }
.bg-col-3 {
    background-color: #e5e2e3; }

/* border-color */
.bor-orange {
	border:solid #ff6464;}
.bor-green {
	border:solid #00c2cc;}
.bor-pink {
	border: #a641f9 2px solid;}
/* bg */
.bg-middle {
    background: #09334b; /* Old browsers */
    background: transparent url("../img/team/bg_middle-0.png") center center no-repeat;
	background-size: 100%; }
.bg-sec-buy {
    background: #09334b; /* Old browsers */
    background: transparent url("../img/team/bg_middle_sec-buy.png") 7.5% 2.5% no-repeat;
	background-size: 29%; }
.bg-AI-right {
    background: #09334b; /* Old browsers */
    background: transparent url("../img/team/bg_middle_AI-2.png") 10% 15% no-repeat;
	background-size: 29%; }
.bg-E-right {
    background: #09334b; /* Old browsers */
    background: transparent url("../img/team/service-patern-white.png") right 0% no-repeat;
	background-size: auto; }
.bg-cover {
    background: rgba(255,255,255,0.00) url("../img/team/img_phone.png") center top no-repeat; background-size: contain;
    border-radius: 30px; }
.bg-dialogue-box {
    background: transparent url("../img/team/pic-box.png") center top no-repeat;
	background-size: auto; }
.section-intro {
    overflow: hidden;
	background: rgba(226,226,226,0.5); /* Old browsers #f0f0f0 */
    background: rgba(226,226,226,0.5) url("../img/team/bg-intro.png") center bottom no-repeat; background-size: cover; }
.section-main {
	background: rgba(226,226,226,0.5); /* Old browsers #f0f0f0 */
    background: rgba(226,226,226,0.5) url("../img/team/bg-bottom.png") center bottom no-repeat; background-size: 100%; }
.section-magazine {
	background: rgba(226,226,226,0.85); /* Old browsers #f0f0f0 */
    background: rgba(255,255,255,0.35) url("../img/team/001-2bg.png") center 1% repeat-y; background-size: auto; }


.rounded-phone {
  border-radius: 2rem !important;
}
.rounded-md {
  border-radius: 1rem !important;
}
.bor-ring {
	border-radius: 8px;
}
section .container p.mlf{
	margin-left: -42px;
}
.line-shape.right,
.line-shape {
    width: 200px;
    height: 6px;
    background-color: #fb397d;
    border-radius: 3px;
    margin-top: -5px;
    margin-bottom: 10px;
}

.line-shape.right {
    margin-left: calc(100% - 250px);
}
.line-shape.mag-line {
    margin-left: calc(100%/2 - 100px);
}
.line-shape {
    margin-left: calc(50% - 100px);
}
@media (min-width: 992px) and (max-width: 1199.98px) {
	.bg-sec-buy {
        background: transparent url("../img/team/bg_middle_sec-buy.png") -3rem 5rem no-repeat;
        background-size: 42%; }
	.bg-AI-right {
        background: transparent url("../img/team/bg_middle_AI-2.png") 4% 10% no-repeat;
        background-size: 31%; }
	}
@media (min-width: 768px) and (max-width: 991.98px) {
	.bg-sec-buy {
        background: transparent url("../img/team/bg_middle_sec-buy.png") -2rem 5rem no-repeat;
        background-size: 35%; }
	.bg-AI-right {
        background: transparent url("../img/team/bg_middle_AI-2.png") -8% 10% no-repeat;
        background-size: 37.5%; }
	.section-magazine {
        background: rgba(255,255,255,0.35) url("../img/team/001-2bg.png") center 1% repeat-y;background-size: 125%; }
	}
@media screen and (max-width: 767.98px) {
	.rounded-phone { border-radius: 1.25rem !important; }
    .item .rounded-phone { border-radius: 1.875rem !important; }
	.fs-0,.fs-1,.fs-2,.fs-3,.fs-4,.fs-5{   }
	.fs-1{
        font-size: 2.625rem;
	}
	.bg-sec-buy {
        background-position: -1rem 6rem;
        background-size: 60%; }
	.bg-AI-right {
        /*background: transparent url("../img/team/bg_middle_AI-2.png") -80px 3% no-repeat;*/
        background-position: -68px 3%;
        background-size: 300px; }
	.section-magazine {
        background: rgba(255,255,255,0.35) url("../img/team/001-2bg.png") center 1% repeat-y;background-size: 140%; }
	.section-intro {
        background-image: url("../img/team/bg-intro-sm.png"); }
    .line-shape.right {
        margin-left: calc(100% - 224px);}
}
@media screen and (max-width: 575.98px) {
	.rounded-phone { border-radius: 1rem !important; }
    .item .rounded-phone { border-radius: 1.625rem !important; }
    .fs-3{ font-size: 2.5rem; }
	.fs-4{ font-size: 2rem; }
	.fs-5{ font-size: 1.75rem; }
}



/* TOP navbar */
.site-navbar-top {
  display: block;
  margin-top: -20px; }
  .site-navbar-top a {
    color: #fff; }
  .site-navbar-top .text-with-icon {
    color: rgba(255, 255, 255, 0.5); }

.site-navbar-top, .site-navbar {
  border-bottom: 1px solid rgba(0, 0, 0, 0.0); }
.site-navbar-top .page-scroll {
  border: 0px solid rgba(0, 0, 0, 0.9);
  display: inline-block; }


.site-navbar {
  margin-bottom: 0px;
  width: 100%;
  border-bottom: none;
  background: transparent !important; }
.site-navbar .navbar-brand {
  margin-top: 13px;
  position: absolute; }
.site-navbar .site-navigation {
  margin: 0px 50px 0px 0px;
  text-align: right; }
  .site-navbar .site-navigation .site-menu {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 0;
	line-height: 22px; }
  .site-navbar .site-navigation .site-menu::after {
        content: "";
        display: table;
        clear: both; }
    .site-navbar .site-navigation .site-menu .active > a {
      color: #000; }
    .site-navbar .site-navigation .site-menu a {
      text-decoration: none !important;
      font-size: 1.125rem;
	  line-height: 28px;
      display: inline-block; }
    .site-navbar .site-navigation .site-menu > li {
      display: inline-block;
      padding: 10px 5px; }
      .site-navbar .site-navigation .site-menu > li > a {
        padding: 10px 10px;
        text-transform: uppercase;
        letter-spacing: .05em;
        color: rgba(0, 0, 0, 0.6);
        font-size: 15px;
        text-decoration: none !important; }
        .site-navbar .site-navigation .site-menu > li > a:hover {
          color: #000; }
      .site-navbar .site-navigation .site-menu > li:last-child {
        padding-right: 0; }
        .site-navbar .site-navigation .site-menu > li:last-child > a {
          padding-right: 0; }
    .site-navbar .site-navigation .site-menu .has-children {
      position: relative; }
      .site-navbar .site-navigation .site-menu .has-children > a {
        position: relative;
        padding-right: 10px; }
      .site-navbar .site-navigation .site-menu .has-children .dropdown {
        visibility: hidden;
        opacity: 0;
        top: 100%;
        border-radius: 7px;
        position: absolute;
        text-align: left;
        -webkit-box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.25);
        box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.25);
        padding: 10px 0;
        margin-top: 20px;
        margin-left: 0px;
        background: #000;
        -webkit-transition: 0.2s 0s;
        -o-transition: 0.2s 0s;
        transition: 0.2s 0s; }
        .site-navbar .site-navigation .site-menu .has-children .dropdown.arrow-top {
          position: absolute; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown.arrow-top:before {
            bottom: 100%;
            left: 15%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown.arrow-top:before {
            border-color: rgba(136, 183, 213, 0);
            border-bottom-color: #000;
            border-width: 7px;
            margin-left: -7px; }
        .site-navbar .site-navigation .site-menu .has-children .dropdown a {
          text-transform: none;
          letter-spacing: normal;
          -webkit-transition: 0s all;
          -o-transition: 0s all;
          transition: 0s all;
          color: #fff; }
        .site-navbar .site-navigation .site-menu .has-children .dropdown .active > a {
          color: #000 !important; }
        .site-navbar .site-navigation .site-menu .has-children .dropdown > li {
          list-style: none;
          padding: 0;
          margin: 0;
          min-width: 200px; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown > li > a {
            padding: 5px 20px;
            display: block;
			line-height: 24px;
			white-space: normal; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown > li > a mark {
			padding: 0px;
			background-color: transparent;
			color: #ffe84e; }
            .site-navbar .site-navigation .site-menu .has-children .dropdown > li > a:hover {
              color: #ffe84e;
			  background-color: transparent; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children > a:before {
            content: "\e080";
            right: 20px; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children > .dropdown, .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children > ul {
            left: 100%;
            top: 0; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children:hover > a, .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children:active > a, .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children:focus > a {
            color: #ffe84e;
			background-color: transparent; }
      .site-navbar .site-navigation .site-menu .has-children a {
        text-transform: uppercase; }
      .site-navbar .site-navigation .site-menu .has-children:hover > a, .site-navbar .site-navigation .site-menu .has-children:focus > a, .site-navbar .site-navigation .site-menu .has-children:active > a {
        color: #fff; }
      .site-navbar .site-navigation .site-menu .has-children:hover, .site-navbar .site-navigation .site-menu .has-children:focus, .site-navbar .site-navigation .site-menu .has-children:active {
        cursor: pointer; }
        .site-navbar .site-navigation .site-menu .has-children:hover > .dropdown, .site-navbar .site-navigation .site-menu .has-children:focus > .dropdown, .site-navbar .site-navigation .site-menu .has-children:active > .dropdown {
          -webkit-transition-delay: 0s;
          -o-transition-delay: 0s;
          transition-delay: 0s;
          margin-top: 0px;
          visibility: visible;
          opacity: 1; }


/* mobile-Navbar */
    .navbar-collapse .navbar-nav[data-aos] {
	  opacity: 1 !important;
	  transform: none !important;
	  visibility: visible !important; }
    .navbar-collapse .navbar-nav li {
	  margin: 0px auto;
	  padding: 10px 5px 0px; }
    .navbar-collapse .navbar-nav li a {
      color: #333;
	  font-size: 23px;
	  font-family: Arial, Helvetica,"微軟正黑體","Microsoft JhengHei", simhei, sans-serif;
	  font-weight: bold;
	  width: 160px;
	  border: #fff solid 1px; }
    .navbar-collapse .navbar-nav li a:hover {
      color: #304b98; /*color: #5347a5;*/
	  border: #10676c solid 1px; }
    .navbar-collapse .navbar-nav li ul li {
	  margin: 0px;
	  padding: 2px 5px 0px; }
    .navbar-collapse .navbar-nav li ul li a {
      color: #080808;
	  font-size: 1.125rem;
	  font-family: Arial, Helvetica,"微軟正黑體","Microsoft JhengHei", simhei, sans-serif;
	  font-weight: normal;
	  line-height: 22px;
	  white-space: normal; }
    .navbar-collapse .navbar-nav li ul li a mark {
      padding: 0px;
      background-color: transparent;
      color: #f23a2e; }
    .navbar-collapse .navbar-nav .dropdown-site {
      margin: 0px;
      padding: 0px; }


.site-navbar-wrap {
  background: transparent !important;
  position: fixed;
  z-index: 99;
  width: calc(100% - 0px);
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 50px;
  padding: 0 0 10px;
  left: 0;
  -webkit-transition: .3s all ease;
  -o-transition: .3s all ease;
  transition: .3s all ease; }
  .site-navbar-wrap .site-menu-bar {
    padding: 0px;
	display: inline-block; }

/* Site-mobile-menu */
.site-mobile-menu {
  position: fixed;
  z-index: 2000;
  padding: 15px;
  width: 100%; }


  .site-mobile-menu .navbar-collapse {
    margin: 0;
    padding: 0;
	font-family: Arial, Helvetica,"微軟正黑體","Microsoft JhengHei", simhei, sans-serif;
    list-style: none;
    position: relative; }
    .site-mobile-menu .navbar-collapse a {
      padding: 10px 20px;
      display: block;
      position: relative;
      color: #212529; }
      .site-mobile-menu .navbar-collapse a:hover {
        color: #f23a2e; }
    .site-mobile-menu .navbar-collapse li {
      position: relative;
      display: block; }
      .site-mobile-menu .navbar-collapse li.active > a {
        color: #f23a2e; }
    .site-mobile-menu .navbar-collapse .arrow-collapse {
      position: absolute;
      right: 0px;
      top: 10px;
      z-index: 20;
      width: 36px;
      height: 36px;
      text-align: center;
      cursor: pointer;
      border-radius: 50%; }
      .site-mobile-menu .navbar-collapse .arrow-collapse:hover {
        background: #f8f9fa; }
      .site-mobile-menu .navbar-collapse .arrow-collapse:before {
        font-size: 12px;
        z-index: 20;
        font-family: 'Glyphicons Halflings';
        content: "\e114";
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%) rotate(-180deg);
        -ms-transform: translate(-50%, -50%) rotate(-180deg);
        transform: translate(-50%, -50%) rotate(-180deg);
        -webkit-transition: .3s all ease;
        -o-transition: .3s all ease;
        transition: .3s all ease; }
      .site-mobile-menu .navbar-collapse .arrow-collapse.collapsed:before {
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%); }
    .site-mobile-menu .navbar-collapse > li {
      display: block;
      position: relative;
      float: left;
      width: 100%; }
      .site-mobile-menu .navbar-collapse > li > a {
        padding-left: 20px;
        font-size: 23px; }
      .site-mobile-menu .navbar-collapse > li > ul {
        padding: 0;
        margin: 0;
        list-style: none; }
        .site-mobile-menu .navbar-collapse > li > ul > li {
          display: block; }
          .site-mobile-menu .navbar-collapse > li > ul > li > a {
            padding-left: 40px;
            font-size: 16px; }
          .site-mobile-menu .navbar-collapse > li > ul > li > ul {
            padding: 0;
            margin: 0; }
            .site-mobile-menu .navbar-collapse > li > ul > li > ul > li {
              display: block; }
              .site-mobile-menu .navbar-collapse > li > ul > li > ul > li > a {
                font-size: 16px;
                padding-left: 60px; }
				
@media (max-width: 767.98px) {
  .site-navbar .site-navigation .site-menu {
    display: none; }
  .site-navbar-wrap .navbar-toggler {
    display: block; }
  .site-mobile-menu .navbar-toggler {
    margin: 0;
    padding: 12px 10px;
	top: 0;
	right: -8%;
    position: absolute;
	background-color: rgba(229, 237, 242, 0.70); } }
/* end TOP navbar */



/* Box-bar */
.box-bar-top {
  display: block;
  margin-top: 0px; }
  .box-bar-top a {
    color: #fff; }
  .box-bar-top .text-with-icon {
    color: rgba(255, 255, 255, 0.5); }

.box-bar-top, .box-bar {
  border-bottom: 1px solid rgba(0, 0, 0, 0.0); }
.box-bar-top .page-scroll {
  border: 0px solid rgba(0, 0, 0, 0.9);
  display: inline-block; }


.box-bar {
  margin-bottom: 0px;
  width: 100%;
  border-bottom: none;
  background: transparent !important; }
.box-bar .navbar-brand {
  margin-top: 0px;
  position: absolute; }
.box-bar .site-navigation {
  margin: 0px 0px 0px 0px;
  text-align: center;
  position: absolute; left: calc(100%/2 - 150px); top: calc(100vh/2 + 208px); }
  .box-bar .site-navigation .site-menu {
      padding-top: 30px; }
    .box-bar .site-navigation .site-menu .active > a {
      color: #fff; }
    .box-bar .site-navigation .site-menu a {
      text-decoration: none !important;
      font-size: 1.125rem;
	  line-height: 28px;
      display: inline-block; }
    .box-bar .site-navigation .site-menu > li {
      display: inline-block;
      padding: 5px 5px; }
      .box-bar .site-navigation .site-menu > li > a {
        /*padding: 10px 10px;*/ 
        text-transform: uppercase;
        letter-spacing: .05em;
        color: rgba(0, 0, 0, 0.6);
        font-size: 1rem;
        text-decoration: none !important; }
        .box-bar .site-navigation .site-menu > li > a:hover {
          color: #fff;
          margin-top: 5px; }
        .box-bar .site-navigation .site-menu > li:last-child {
          padding-right: 0; }
        .box-bar .site-navigation .site-menu > li:last-child > a {
          padding-right: 0; }
        .box-bar .site-navigation .site-menu .has-children {
          position: relative; }
      .box-bar .site-navigation .site-menu .has-children > a {
        position: relative;
        padding-right: 10px; }
      .box-bar .site-navigation .site-menu .has-children .dropdown {
        visibility: hidden;
        opacity: 0;
        top: 100%;
        border-radius: 7px;
        position: absolute;
        text-align: left;
        -webkit-box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.25);
        box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.25);
        padding: 10px 0;
        margin-top: 20px;
        margin-left: 0px;
        background: #000;
        -webkit-transition: 0.2s 0s;
        -o-transition: 0.2s 0s;
        transition: 0.2s 0s; }
        .box-bar .site-navigation .site-menu .has-children .dropdown.arrow-top {
          position: absolute; }
          .box-bar .site-navigation .site-menu .has-children .dropdown.arrow-top:before {
            bottom: 100%;
            left: 15%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none; }
          .box-bar .site-navigation .site-menu .has-children .dropdown.arrow-top:before {
            border-color: rgba(136, 183, 213, 0);
            border-bottom-color: #000;
            border-width: 7px;
            margin-left: -7px; }
        .box-bar .site-navigation .site-menu .has-children .dropdown a {
          text-transform: none;
          letter-spacing: normal;
          -webkit-transition: 0s all;
          -o-transition: 0s all;
          transition: 0s all;
          color: #fff; }
        .box-bar .site-navigation .site-menu .has-children .dropdown .active > a {
          color: #000 !important; }
        .box-bar .site-navigation .site-menu .has-children .dropdown > li {
          list-style: none;
          padding: 0;
          margin: 0;
          min-width: 200px; }
          .box-bar .site-navigation .site-menu .has-children .dropdown > li > a {
            padding: 5px 20px;
            display: block;
			line-height: 24px;
			white-space: normal; }
          .box-bar .site-navigation .site-menu .has-children .dropdown > li > a mark {
			padding: 0px;
			background-color: transparent;
			color: #ffe84e; }
            .box-bar .site-navigation .site-menu .has-children .dropdown > li > a:hover {
              color: #ffe84e;
			  background-color: transparent; }
          .box-bar .site-navigation .site-menu .has-children .dropdown > li.has-children > a:before {
            content: "\e080";
            right: 20px; }
          .box-bar .site-navigation .site-menu .has-children .dropdown > li.has-children > .dropdown, .box-bar .site-navigation .site-menu .has-children .dropdown > li.has-children > ul {
            left: 100%;
            top: 0; }
          .box-bar .site-navigation .site-menu .has-children .dropdown > li.has-children:hover > a, .box-bar .site-navigation .site-menu .has-children .dropdown > li.has-children:active > a, .box-bar .site-navigation .site-menu .has-children .dropdown > li.has-children:focus > a {
            color: #ffe84e;
			background-color: transparent; }
      .box-bar .site-navigation .site-menu .has-children a {
        text-transform: uppercase; }
      .box-bar .site-navigation .site-menu .has-children:hover > a, .box-bar .site-navigation .site-menu .has-children:focus > a, .box-bar .site-navigation .site-menu .has-children:active > a {
        color: #fff; }
      .box-bar .site-navigation .site-menu .has-children:hover, .box-bar .site-navigation .site-menu .has-children:focus, .box-bar .site-navigation .site-menu .has-children:active {
        cursor: pointer; }
        .box-bar .site-navigation .site-menu .has-children:hover > .dropdown, .box-bar .site-navigation .site-menu .has-children:focus > .dropdown, .box-bar .site-navigation .site-menu .has-children:active > .dropdown {
          -webkit-transition-delay: 0s;
          -o-transition-delay: 0s;
          transition-delay: 0s;
          margin-top: 0px;
          visibility: visible;
          opacity: 1; }


/* Scroll-box-bar */
.box-bar-wrap {
  background: transparent !important;
  position: fixed;
  z-index: 99;
  width: 100%;
  padding: 10px 0 0;
  -webkit-transition: .3s all ease;
  -o-transition: .3s all ease;
  transition: .3s all ease; }
  .box-bar-wrap .site-menu-bar {
    padding: 0px;
	display: inline-block; }
  .box-bar-wrap .site-menu-toggle {
    display: none; }
  .box-bar-wrap .site-menu-toggle span {
    color: #fff;
	margin: 6px;
	border-radius: 3px;
	border: #fff solid 1px;
	background-color: rgba(0, 0, 0, 0.1); }
  .box-bar-wrap .site-menu-toggle span.icon-bar {
    display: block; width: 28px; height: 1px; border-radius: 1px; border: #fff solid 1px; }
  .box-bar-wrap .site-menu-toggle span.icon-bar + span.icon-bar {
    margin-top: 2px; }
  .box-bar-wrap .box-bar .site-navigation .site-menu > .row {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      width: auto;
      height: 62px;
      color: #fff;
      -webkit-filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.35));
              filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.35));
      display: inline-block; }
  .box-bar-wrap .box-bar .site-navigation .site-menu > li > a {
    font-size: 1.25rem;
	font-weight: bold;
	text-align: center;
	line-height: 1;
    letter-spacing: -0.02em;
    outline: none; /* for Firefox */                   
    -webkit-transition: .3s all ease; 
	transition: .3s all ease;
	/*width: 180px;*/
	margin-top: 0px;
	/*padding: 8px 8px 8px;*/
    border-radius: 35px;
    border: #f7f7f6 solid 2px;
	background: rgba(255,255,255,0.50) linear-gradient(0deg, #fafaf6 0%, #e3e2f7 55%, #d8d7f7 72%, #cdcbf8 100%);
    -webkit-box-shadow: 0 0 30px -5px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 30px -5px rgba(0, 0, 0, 0.1);}
  .box-bar-wrap .box-bar .site-navigation .site-menu > li > a.l-height {
	line-height: 45px;
	height: auto; }
    .box-bar-wrap .box-bar .site-navigation .site-menu > li > a:hover {
      color: #007d8e;
      margin-top: 0px;
      border: #f2f2f2 solid 2px;
      background: rgba(255,255,255,0.85); }
	  
  .box-bar-wrap.scrolled {
    z-index: 99;
    padding: 0px 0 0px;
    -webkit-box-shadow: 0 0 30px -5px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 30px -5px rgba(0, 0, 0, 0.1);
    background: rgba(255, 255, 255, 0.0) !important; }
    .box-bar-wrap.scrolled .box-bar .navbar-brand {
	  top: -1px; }
    .box-bar-wrap.scrolled .box-bar .site-navigation {
	  top: calc(100vh - 98px); }
    .box-bar-wrap.scrolled .site-menu-toggle span {
      color: #000; }
    .box-bar-wrap.scrolled .box-bar .site-navigation .site-menu {
	  margin: 0 auto;
	  padding: 32px 10px 8px 10px;
	  border-radius: 30px 30px 0 0;
	  background-color: rgba(255,255,255,0.50);
	  backdrop-filter: blur(3px);
	  -webkit-box-shadow: 0 -8px 16px -10px rgba(0, 0, 0, 0.42);
	  box-shadow: 0 -8px 16px -10px rgba(0, 0, 0, 0.42);
	  -webkit-transition: .4s all ease;
	  -o-transition: .4s all ease;
	  transition: .4s all ease; }
    .box-bar-wrap.scrolled .box-bar .site-navigation .site-menu > .row {
	  background: linear-gradient(to top, #5C37C6, #5C37C6, #002599);
	  background: -webkit-linear-gradient(to top, #5C37C6, #5C37C6, #002599);
	  background-clip: text;
	  -webkit-background-clip: text;
      -webkit-filter: drop-shadow(0 2px 5px rgba(255, 255, 255, 0.35));
              filter: drop-shadow(0 2px 5px rgba(255, 255, 255, 0.35));
	  color: transparent !important; }
    .box-bar-wrap.scrolled .box-bar .site-navigation .site-menu > li > a {
	  width: auto;
      color: rgba(255, 255, 255, 0.95);
      padding: 2px 20px 6px;
      border: rgba(233, 238, 242, 1.0) solid 2px;
      background: rgba(255,255,255,0.50);
      box-shadow: 0 0px #f0f0f0; }
    .box-bar-wrap.scrolled .box-bar .site-navigation .site-menu > li > a.l-height {
      line-height: 42px;
      display: inline-flex;
      height: auto; }
      .box-bar-wrap.scrolled .box-bar .site-navigation .site-menu > li > a:hover {
        margin-top: 0px !important;
        color: #fff;
        border: #84def2 solid 2px; }
    .box-bar-wrap.scrolled .box-bar .site-navigation .site-menu > li > a.l-height img {
	  -ms-flex: 0 0 60%;
	  flex: 0 0 60%;
	  width: auto;
	  height: auto;
	  max-width: 41px;
	  max-height: 42px; }
    .box-bar-wrap.scrolled .box-bar .site-navigation .site-menu > li > a.l-height img.QR-btn {
        margin-top: 6px;
	  width: 100px;
	  height: 29px;
	  max-width: 100%;
	  max-height: 100%; }
	  
@media (min-width: 768px) and (max-width: 991.98px) {
  .box-bar-wrap .container {
	max-width: 100%; }
}
@media (max-width: 767.98px) {
  .box-bar-wrap.scrolled {
	padding: 10px 0 10px; }
  .box-bar-wrap .container {
	max-width: 100%; }
  .box-bar .col-4 {
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width: 100%; }
  .box-bar .site-navigation {
	/*top: 0!important;*/
    top: 0;
    margin-top: calc(100vh/2 + 128px) !important;}
  .box-bar-wrap.scrolled .box-bar .site-navigation {
    top: 0!important;
    margin-top: 0;}
  .box-bar-wrap.scrolled {
    -webkit-box-shadow: 0 0 30px -5px rgba(0, 0, 0, 0.0);
    box-shadow: 0 0 30px -5px rgba(0, 0, 0, 0.0);
    background: rgba(255, 255, 255, 0.0) !important; }
}
@media (max-width: 575.98px) {
  .box-bar-wrap.scrolled {
	padding: 10px 0 10px; }
  .box-bar-wrap .container {
	max-width: 100%; }
  .box-bar .col-4 {
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width: 100%; }
  .box-bar .site-navigation {
    margin-top: calc(100vh/2 - 27px) !important;} }
@media (max-width: 767.98px) {
  .box-bar .site-navigation .site-menu {
      float: left;
      display: inline-block; }
  .box-bar-wrap {
      height: 1px !important;
      top: calc(0% + 80px); }
  .box-bar-wrap .navbar-toggler {
      display: block; }
  .box-bar-wrap.scrolled .box-bar .site-navigation .site-menu {
      position: fixed;
      width: auto;
      height: 180px;
      top: calc(100vh - 188px);
      left: calc(100vw/2 - 157px);
      margin-left: auto;
      margin-right: auto;}
}
@media (max-width: 575.98px) {
  .box-bar .site-navigation .site-menu {
      float: left;
      display: inline-block;
      border-radius:40px;
      background-color:rgba(56,42,139,0.75);}
  .box-bar-wrap {
      height: 1px !important;
      top: calc(100%/2 - 180px); }
  .box-bar-wrap .navbar-toggler {
      display: block; }
  .box-bar-wrap.scrolled .box-bar .site-navigation .site-menu {
      position: fixed;
      width: auto;
      height: 180px;
      top: calc(100vh/2 + 80px);
      left: calc(100vw/2 - 157px);
      margin-left: auto;
      margin-right: auto;}
}
/* end Box-bar */


.toggle-text {
    transform: translateX(0%) translateZ(0) scaleY(1.0);
    animation: toggle 3s 1;
  }

  @keyframes toggle {
    0% {
      opacity: 0;
        transform: translateX(50%) rotate(-15deg) translateZ(0) scaleY(1.0)
    }
    68% {
      opacity: 1;
        transform: translateX(0%) translateZ(0) scaleY(0.65)
    }
    90% {
      opacity: 0;
        transform: translateX(-50%) rotate(15deg) translateZ(0) scaleY(1.1)
    }
    100% {
      opacity: 0;
        transform: translateX(50%) rotate(-15deg) translateZ(0) scaleY(1.0)
    }
  }




/* Intro Container */
#intro {
	text-align: center;
}
#intro .intro-text {
    margin: 0% auto 0%;
    padding: 0px;
    text-align: center;
	position: relative;
	overflow: hidden;
	width: 100%;
}
#intro .text-title {
    /*margin: 0% auto 0%;
    padding: 0px;*/
    text-align: center;
}
#intro .container-fluid, #intro .container-fluid .row {
    min-height: 640px;
    height: calc(100vh - 27px); }
#intro .intro-text .intro-bg-lg, #intro .intro-text .intro-bg-sm {
    margin: 0px auto;
	padding: 0px;
	bottom: 0px;
}
#intro .intro-text .intro-bg-lg {
	display: block;
}
#intro .intro-text .intro-bg-sm,#intro .intro-text .intro-bg{
	display: none;
}
#intro .intro-text .intro-bg-lg img, #intro .intro-text .intro-bg-sm,#intro .intro-text .intro-bg-sm img {
	width: 100%;
	height: 100%;
}
#intro .intro-text .icon_img{
	background: rgba(255,255,255,0.00) url("../img/team/img_phone_hand.png") center top no-repeat;background-size: contain;
	display: inline-block;
	position: absolute;
    top: calc(100%/3 - 110px);
    bottom: auto;
    left: calc(100%/2 - 180px);
    right: auto;
    width: 300px;
    height: 420px;
    border-radius: 30px;
}
#intro .intro-text .icon_img > .carousel {
	padding-bottom: 20px;
    margin-left: 42px;
}
.carousel-item > img.row-0 {
	padding: 0;
    width: 204px;
    height: 400px;
}
#carousel-phone .carousel-indicators .active {
    background-color: #2b2a2e !important;
    opacity: 1; /* 選取顏色 */
}
#intro .intro-text h1{
	display: inline-block;
	position: absolute;
    top: calc(100%/2 - 200px);
    bottom: auto;
    left: calc(100%/2 - 50%);
    right: auto;
    width: 50%;
    padding-left: 3rem;
	text-align: center;
	font-weight: bolder;
	line-height: 1.35;
	font-size: 3.625rem;
	text-shadow: 3px 3px 5px rgba(14,35,101,0.75);
    z-index: 10;
}
#intro .intro-text .intro-link{
	display: inline-block;
	position: absolute;
    top: calc(100%/2 + 50px);
    left: calc(100%/4 - 221px);
    width: 442px;
    z-index: 11;
}

#intro .intro-text h1 span{
	text-shadow: 3px 3px 5px rgba(14,35,101,0.75);
    margin-left: -2rem;
}
#intro .intro-text h1 sup{
	font-size: 4.25rem;
	font-weight: bold;
    top: -.05em;
}

/* LG */
@media (min-width: 1200px) and (max-width: 2000px) {
    #intro .intro-text {
        margin: 0% auto 0%;
        padding: 0px; }
    #intro .intro-text h1 {
        left: calc(100%/2 - 49%);
        width: 51%; }
    #intro .intro-text .intro-link {
        left: calc(100%/4 - 191px); }
}
@media (max-width: 1199.98px) {
    #intro .intro-text h1{
		font-size: 2.875rem; }
    #intro .intro-text h1 sup {
		font-size: 3.625rem; }
}
/* MD */
@media (min-width: 992px) and (max-width: 1024.98px) {
    #intro .container-fluid, #intro .container-fluid .row {
		min-height: 800px;
		height: calc(100vh - 200px); }
	#intro .intro-text .icon_img {
		top: calc(100%/3 - 156px); }
    #intro .intro-text h1{
        top: 42px;
        left: 0%;
        width: calc(100% - 0px); }
    #intro .intro-text .intro-link {
        top: calc(100%/2 + 150px);
        left: calc(100%/2 - 221px);
        width: 442px; }
}
@media (max-width: 991.98px) {
    #intro .intro-text {
        margin: 0% auto 0%;
        padding: 0px; }
    #intro .intro-text .intro-bg {
        display: block; }
    #intro .intro-text .intro-bg-lg,#intro .intro-text .intro-bg-sm {
        display: none; }
    #intro .intro-text .icon_img > .carousel {
        margin-top: auto; }
    #intro .intro-text h1 {
        font-size: 2.8125rem;
        top: 42px;
        left: 0%;
        width: calc(100% - 0px); }
    #intro .intro-text h1 sup {
        font-size: 3.5rem; }
    #intro .intro-text .intro-link {
        display: inline-block;
        position: absolute;
        top: calc(100%/2 + 150px);
        left: calc(100%/2 - 221px);
        width: 442px; }
}

@media (max-width: 767.98px) {
    #intro .intro-text {
        margin: 0 auto;
        padding: 0px;
        position: relative;
        padding-top: 20px;
        z-index: 10;}
    #intro .container-fluid, #intro .container-fluid .row {
        min-height: 560px;
        height: calc(100vh - 42px); }
    #intro .intro-text .intro-bg{
        display: block;
        position: relative;
        width: 100%;
        height: auto; }
    #intro .intro-text .intro-bg-lg, #intro .intro-text .intro-bg-sm{
        display: none; }
    #intro .intro-text .icon_img {
        top: calc(100%/3 - 120px); }
    #intro .intro-text .icon_img > .carousel {
        margin-top: auto; }
    #intro .intro-text h1 {
        font-size: 2.25rem;
        top: 58px;
        left: 0;
        width: 100%; }
    #intro .intro-text h1 sup {
        font-size: 110%; }
    #intro .intro-text .intro-link{
        top: inherit !important;
        bottom: calc(100%/3 - 75px); }
}
@media (max-width: 575.98px) {
    #intro .container-fluid, #intro .container-fluid .row {
        min-height: 520px;
        height: calc(100vh - 42px); }
    #intro .intro-text .intro-bg-sm{
        display: inline-block;
        position: relative;
        width: 100%;
        height: auto; }
    #intro .intro-text .intro-bg-lg,#intro .intro-text .intro-bg{
        display: none; }
    #intro .intro-text .icon_img {
        top: calc(100%/3 - 110px); }
    #intro .intro-text h1{
        font-size: 1.875rem;
        top: 58px;
        left: 0;
        right: auto;
        width: 100%; }
    #intro .intro-text .intro-link{
        display: none; }
}

@media screen and (max-width: 479.98px) {
    #intro .intro-text .icon_img{
        top: calc(100%/3 - 30px);
        bottom: auto;
        left: calc(100%/2 - 190px);
        right: auto;
        width: 290px;
        height: 320px; }
    #intro .intro-text .icon_img > .carousel {
        padding-bottom: 20px;
        margin-left: 42px; }
    #intro .intro-text .icon_img > .carousel {
        margin-left: 34px;}
    .carousel-item > img.row-0 {
        padding: 0;
        width: 160px;
        height: 320px; }
}  


.hollow-semi-circle {
  width: 380px;
  height: 380px;
  margin-top: -268px;
  left: calc(100%/4 - 50px);
  border-radius: 50%;
  clip-path: inset(268px 0 0 0);
}
.circle-pink {
  background-color: rgba(250, 58, 175, 0.20);
}
.circle-green {
  background-color: rgba(90, 218, 223, 0.5);
}
.circle-yellow {
  background-color: rgba(242, 254, 120, 0.5);
}
.circle-lightblue {
  background-color: rgba(140, 219, 255, 0.5);
}
.circle-white {
  background-color: rgba(255, 255, 255, 0.5);
}




section {
	margin: 0px auto;
	position: relative;
}
section.top-line-white {
	border-top: #fff solid 10px;
}
section .container {
	padding-top: 3rem;
}
section img.service-patern {
	top: 2px;
    margin-left: calc(100%/2 + 285px);
}
section img.position-relative.pic-AI01, section img.position-relative.pic-AI02, section img.position-relative.pic-AI03 {
	margin-top: 1rem;
    border: #f1f1f1 solid 2px;
    width: 180px;
}
section img.position-relative.pic-AI02 {
    margin-top: 0;
    z-index: 2;
}
section img.position-relative.pic-AI03 {
    z-index: 3;
}
img.pic-AI-writing, img.pic-AI-speaking {
    width: 200px;
	-webkit-filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.25));
     filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.25));
}





section .member_top, section .member_bg {
	margin: 0% 0% 0% 0%;
	padding: 0px;
	text-align: center;
	width: 100%;
    left: auto;
    right: auto;
	position: absolute;
}
section .member_top {
	top: 0px;
}
section .member_bg {
	bottom: 0px;
}
section .member_bg.left{
	overflow-x: hidden;
    display: inline;
    left: 0;
	margin-left: -20px;
}

  @media (max-width: 1199.98px) {
    section .member_bg img.member_hand {
      margin-right: 0%; } }
  @media (max-width: 767.98px) {
    section .member_bg img.member_hand {
      margin-right: 0%; } }

section .member_top img.member_group, section .member_top img.member_groupAI {
	display: inline;
}
section .member_top img.member_groupAI {
    margin-top: 300px;
    margin-left: calc(100%/2 - 50px);
}
section .member_bg img.member_group {
	display: inline;
}
section .member_bg img.member_group_s {
	display: none;
}
  @media (min-width: 992px) and (max-width: 1199.98px) {
	section .member_top img.member_groupAI {
      margin-left: calc(100%/2 + 100px);} }
  @media (min-width: 768px) and (max-width: 992.98px) {
	section img.position-relative.pic-AI01, section img.position-relative.pic-AI02, section img.position-relative.pic-AI03 {
      margin-top: 3rem;
      width: 160px;}
	section .member_top img.member_groupAI {
      margin-top: 220px; width: 220px; height: 220px;
      margin-left: calc(100% - 220px);} }
  @media (max-width: 767.98px) {
	section img.position-relative.pic-AI01, section img.position-relative.pic-AI02, section img.position-relative.pic-AI03 {
      margin-top: 1rem;
      width: 110px;}
    section img.service-patern {
      margin-left: calc(100% - 88px); }
    img.pic-AI-writing, img.pic-AI-speaking {
      width: 120px; }
	section .member_top img.member_groupAI {
      margin-top: 200px; width: 140px; height: 140px;
      margin-left: calc(100% - 135px);}
	section .member_bg {
      margin: 0% 0% 0% 0%; }
    section .member_bg img.member_group {
      display: none; } 
    section .member_bg img.member_group_s {
      display: inline-table; }
    .hollow-semi-circle {
        width: 280px;
        height: 280px;
        margin-top: -218px;
        left: calc(100%/4 + 100px);
        clip-path: inset(218px 0 0 0); }
}

section .container p {
	font-size: 1.3125rem;
	font-weight: bold;
    line-height: 1.5;
	margin: 1rem 0;
    padding: 0;
}
section .container p.section-heading-big {
	font-size: 1.4375rem;
    line-height: 1.25;
	margin-top: 1rem;
    margin-bottom: 1.5rem;
}

section .container .moon {
    margin-top: 5px; }
section .container .moon img.position-absolute {
    left: auto;
    right: auto;
    transform: var(--transform-right);
    z-index: 10; }

/* sec-icon 三個 */
section .container .icon.single-icon, section .container .icon-whiter.single-icon {
    margin-top: 0px;
    margin-bottom: 42px;
	margin-left: calc(100%/2 - 36px);
}
/*AI-teacher AI小助教 */
section#sec-AI-teacher .container h2.section-heading {
}
/*閱讀雜誌 h2 */
section#sec-magazine .container h2.section-heading {
}
section#sec-magazine .container h3 {
	font-size: 1.875rem; }
/*數位版*/
section#sec-digital .container h2.section-heading {
}
/*學習流程 h2 */
section#sec-learning-process .container h2.section-heading {
	margin-top: 30px;
    margin-right: 40px;
}
/*學習流程 */
section .container .position-absolute.studylist {
	margin-top: -30px;
    right: 0;
    margin-right: calc(100vw/2 - 658px);
    width: 568px;
}
section .container .learning-process {
    margin-top: 50px;
}
.page-service span.glyphicon {
    font-size: 1.125rem;
}

  @media (min-width: 992px) and (max-width: 1199.98px) {
	section .container .position-absolute.studylist {
      margin-right: calc(100vw/2 - 520px);
      width: 420px;} }
  @media (min-width: 768px) and (max-width: 992.98px) {
	section .container .position-absolute.studylist {
      margin-right: calc(100vw/2 - 420px);
      width: 360px;}}


  @media (max-width: 767.98px) {
	section .container .position-absolute.studylist {
      margin-top: -25px;
      margin-right: calc(100vw/2 - 180px);
      width: 360px; }
	section .container .learning-process {
          margin-top: 220px; }
	section .container .icon.single-icon, section .container .icon-whiter.single-icon {
      margin-top: 20px;
      margin-left: calc(100%/2 - 42px); }}






@media(min-width:768px) and (max-width: 991.98px) {
	section .container {
      padding-top: 3%;
	  padding-bottom: 3%;}
	section .container p{
		font-size: 1.25rem;
		margin: 20px auto;
	}

}
@media screen and (max-width: 767.98px) {
	section .container {
      padding-top:3%;
      padding-bottom: 3%;}
	section .container .pic01::before{
		background-size: 90px 90px;
		width: 90px;
		height: 90px;
		position: absolute; 
		left: 75%;
		top: -30%;
	} 
	section .container .pic02::before{
		background-size: 100px 71px;
		width: 100px;
		height: 71px;
		left: 8%;
		top: -58%;
	} 
	section .container .pic03::after{
		background-size: 60px 60px;
		width: 60px;
		height: 60px;
		left: 80%;
		top: -55%;
	}

	section .container p {
      font-size: 1rem;
	  line-height:1.125;
	  margin-top: 10px;
	}
	section .container p {
      font-size: 1rem;
	  line-height:1.125;
	  margin-top: 10px;
	}

}
@media screen and (max-width: 479.98px) {
	section .container .pic01::before{
		background-size: 90px 90px;
		width: 90px;
		height: 90px;
		position: absolute; 
		left: 5%;
		top: -30px;
	} 
	section .container .pic02::before{
		background-size: 80px 57px;
		width: 80px;
		height: 57px;
		left: 2%;
		top: -40%;
	} 
	section .container .pic03::after{
		background-size: 40px 40px;
		width: 40px;
		height: 40px;
		left: 83%;
		top: -55%;
	}
}

   /* 對話框   h2*/
section .learning-dialog-box {
    position: relative;
	margin-top: -50px;
    height: 160px;
}
section .learning-dialog-box img.position-absolute {
    position: absolute;
	top: -20px;
	left:0%;
}
section .learning-dialog-box h2.section-heading {
    position: absolute;
    top: -0px;
	left: 50px;
    font-size: 2.125rem;
    line-height: 1.1;
}
section .learning-dialog-box h2.section-heading span.text-up {
    font-size: 2.5rem;
}
section .learning-dialog-box h2.section-heading sup {
    font-size: 2.5rem;
}
section .learning-dialog-list {
    margin: 0 auto 50%;
    width: 100%;
    text-align: center;
}
section .learning-dialog-list .col-2 h3 {
    font-size: 0.85rem;
    margin-top: 58%;
}
section .learning-dialog-list .col-2 {
    display: inline-flex;
    float: left;
    margin: 5px 0;
    max-width: 33.33%;
}
@media screen and (max-width: 479.98px) {
  section .learning-dialog-box h2.section-heading {
    left: 25px;
    line-height: 1.05; }}
@media (min-width: 768px) {
    section .learning-dialog-box {
        margin-top: 160px;
        height: 160px;
    }
    section .learning-dialog-box img.position-absolute {
        top: -170px;
        left: calc(100%/2 - 190px);
    }
    section .learning-dialog-box h2.section-heading {
        top: -160px;
        left: calc(100%/2 - 120px);
        font-size: 2.125rem;
        line-height: 1.1;
    }
    section .learning-dialog-list {
        margin-bottom: 0px;
    }
    section .learning-dialog-list .col-2 {
        float: inherit;
        display: inline-block;
        width: 150px;
        margin-left: 5px;
        margin-right: 5px;
    }
    section .learning-dialog-list .col-2 h3 {
        font-size: 1rem;
        position: absolute;
        margin-top: -17.5%;
    }
}
@media (min-width: 992px) {
    section .learning-dialog-box {
        margin-top: 160px;
        height: 160px;
    }
    section .learning-dialog-box img.position-absolute {
        top: -180px;
        left: calc(100%/2 + 20px);
    }
    section .learning-dialog-box h2.section-heading {
        top: -150px;
        left: calc(100%/2 + 80px);
        font-size: 2.125rem;
        line-height: 1.1;
    }
    section .learning-dialog-list {
        margin-bottom: 58px;
        max-width: 1200px;
    }
    section .learning-dialog-list .col-2 {
        width: 140px;
        float: inherit;
    }
    section .learning-dialog-list .col-2 h3 {
        font-size: 1.25rem;
    }
}
@media (min-width: 1200px) {
    section .learning-dialog-list .col-2 {
        width: 165px;
        float: inherit;
    }
}




/*section .topbox {
	margin: 0px calc(100%/2 - 64px) 0px;
    padding: 0px;
	display: inline-block;
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	clear: both;
}
section .topbox:before {
    position: absolute;
    content: ' ';
    width: 128px;
    height: 128px;
	background-color: #fbf9f6;
	border-radius: 100%;
	display: inline;
	top: -28px;
}
section .topbox img {
    position: absolute;
	display: inline;
	margin-top: -17px;
	padding: 15px;
}*/




section h2.section-heading {
    font-size: 3.625rem;
	font-family: Arial, Helvetica,"Microsoft JhengHei", simhei, sans-serif;
	font-weight: bold;
	line-height: 1.45;
}
section h2.section-heading sup{
	font-size: 4rem;
	font-weight: bold;
    top: -.05em;
}
section h2.section-heading span{
	/*padding: 5px;*/
	border-radius: 10px;
}
section h2.section-heading span.position-relative{
	padding: 0 5px;
}
section h2.section-heading span.position-relative::before{
    position: absolute;
    bottom: -2px;
    content: "";
	padding: 0;
    border-bottom: 5px solid var(--lightyellow-bg);
    width: 95%;
}
/* 找對方法 */
section#sec-learning-english h2.section-heading span.quotes-flex {
    display: inline-flex;
}
section#sec-learning-english h2.section-heading span.quotes {
    display: inline;
}
@media screen and (max-width: 767.98px) {
    .study-Main{
        display: block;
        margin-top: 10px;
        margin-bottom: 0px; }
    .study-Main-list {
        background: transparent url("../img/team/bg_middle-main.png") center 20% no-repeat;
        background-size: 75%;
        margin: -10px 15px 42px; }
    section#sec-learning-english h2.section-heading span.quotes-flex {
        display: flex;
        -ms-flex-pack: center !important;
        justify-content: center !important; }
    section#sec-learning-english h2.section-heading span.quotes {
        margin-top: -15px;
        margin-bottom: 25px;
        display: block; }
}



section .pur_box {
	margin: 0px;
	padding: 20px 11px 10px;
	border-radius: 15px;
	background-color: rgba(255,255,255,0.75);
    -webkit-box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.5);
    box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.5);
	display: inline-block;
}
section .pur_box h3 {
	margin-bottom: 8px;
	font-size: 23px;
    font-weight: bold;
	line-height: 33px;
}
section .pur_box h4 {
	padding-bottom: 10px;
	font-size: 21px;
    font-weight: normal;
	line-height: 24px;
	text-transform: none;
	margin-left: 110px;
}
section .pur_box h4 b {
	padding-bottom: 5px;
	margin-left: -110px;
}
section .pur_box h4 b.space {
	letter-spacing: 0.15ex;
}
@media screen and (max-width: 1199px) {
	section .pur_box h4 {
	  font-size: 17px;}}
@media screen and (max-width: 479.98px) {
	section h3.section-heading4 {
		font-size: 1.25rem;}
	section .pur_box h4 {
	  margin-left: 5px;}
	section .pur_box h4 b {
	  margin-left: 5px;}
}


@media (min-width: 768px) and (max-width: 991.98px) {
    section h2.section-heading sup{
        font-size: 3rem;
    }
}
@media screen and (max-width: 767.98px) {
    section h2.section-heading sup{
        font-size: 3rem;
    }
    /*智能方案 h2 */
    section#sec-buy h2.section-heading span {
        margin-top: -10px;
        display: block !important;
	}
}
@media(min-width:992px) and (max-width: 1199.98px) {
    section {
        padding: 0px 0px 0px;
	}
	section h2.section-heading {
		font-size: 3rem;
        line-height: 1.25;
	}
}
@media (min-width: 768px) and (max-width: 991.98px) {
    section {
        padding: 0px 0px 50px;
    }
    section h2.section-heading{
		margin-bottom: 10px;
		font-size: 2.625rem;
		line-height: 1.25;
	}
    section h2.section-heading sup{
        font-size: 3rem;
    }
    /*學習流程 h2 */
    section#sec-learning-process .container h2.section-heading {
		margin-top: 20px;
		margin-right: 10px;
	}
}
@media (min-width: 576px) and (max-width: 767.98px) {
    section {
        padding: 0px 0px 42px;
    }
    section h2.section-heading{
		/*margin-top: 30px;*/
		margin-bottom: 10px;
        font-size: 2.5rem;
        line-height: 1.25;
    }
    section h2.section-heading sup{
        font-size: 3rem;
    }
    /*AI-teacher AI小助教 */
    section#sec-AI-teacher .container h2.section-heading {
		margin-top: 20px;
		margin-bottom: 0px;
        padding: 10px 20px 5px;
        line-height: 1.1;
        display: inline-table;
        background-color: rgba(255,255,255,0.75);
        border-radius: 25px;
	}
    /*閱讀雜誌 h2 */
    section#sec-magazine .container h2.section-heading {
	}
    section#sec-magazine .container h3 {
        font-size: 1.5rem;
	}
    /*數位版*/
    section#sec-digital .container h2.section-heading {
	}
    /*學習流程 h2 */
    section#sec-learning-process .container h2.section-heading {
        margin-top: 20px;
        margin-right: 158px;
	}
}
@media screen and (max-width: 575.98px) {
    section {
        padding: 0px 0px 50px;
    }
    section h2.section-heading{
		margin-bottom: 10px;
        font-size: 2.5rem;
        line-height: 1.25;
	}
    /*AI-teacher AI小助教 */
    section#sec-AI-teacher .container h2.section-heading {
		margin-top: 80px;
		margin-bottom: 0px;
        padding: 10px 20px 5px;
        line-height: 1.15;
        display: inline-table;
        background-color: rgba(255,255,255,0.75);
        border-radius: 25px;
	}
    /*閱讀雜誌 h2 */
    section#sec-magazine .container h2.section-heading {
	}
    /*數位版*/
    section#sec-digital .container h2.section-heading {
	}
    /*學習流程 h2 */
    section#sec-learning-process .container h2.section-heading {
        margin-top: 20px;
        margin-right: calc(100%/2 - 90px);
	}
    section h2.section-heading sup{
        font-size: 3rem;
    }
}
@media screen and (max-width: 479.98px) {
	section h2.section-heading{
		/*margin:15px 0;*/
        font-size: 2.25rem;
        line-height: 1.35;
	}
    section h2.section-heading sup{
        font-size: 115%;
    }
    section#sec-magazine .container h3 {
        font-size: 1.3125rem;
	}
	section h3.section-heading{
        font-size: 1.375rem;
		line-height: 28px;
    }
}




@media screen and (max-width: 767.98px) {
section .container .fea-m1, section .container .fea-m2, section .container .fea-m3, section .container .fea-m4 {
	margin-left: 0%;
	margin-right: 0;
}
section .container .fea-m2 {
	left: 0%;
}
section .container .fea-m3 {
	right: 0%;
}
}
section .container .fea-m1{
	border: 5px solid #7d46a2;
}
section .container .fea-m2{
	border: 5px solid #59c7cf;
}
section .container .fea-m3{
	border: 5px solid #5ab1e1;
}

section .features.col-md-3{
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%;
}

section .features {
	text-align: center;
}

/*@media screen and (max-width: 991.98px) {

}*/
@media screen and (max-width: 767.98px) {
	.mt-4 {
		margin-top: 2%;
	}
}




section .features .magazine-phone {
	border-radius: 35px 35px 0 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
section .features .fe-box-bottom {
    position: relative;
    height: auto;
    background-color: #fff;
	border-radius: 0 0 35px 35px;
    margin-top: -10px;
    padding-bottom: 20px;
}
section .features .fe-box-bottom .zoomInLeft img {
    position: absolute;
    top: -100px;
    left: calc(100%/2 - 134px);
}
section .features .fe-box-bottom span {
    font-size: 0.9375rem;
    line-height: 1.2;
    min-height: 2.25rem;
}
section .features .fe-box-bottom span.sm {
    font-size: 1.125rem;
}
section .features .btn-block.mag-ap, section .features .btn-block.mag-4u, section .features .btn-block.mag-ed {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
	border-radius: 35px;
    font-size: 1.25rem;
    color: #fff;
    padding: 6px;
    background-color: transparent;
}
section .features .btn-block.mag-ap {
    background-color: #fb9d9b;
}
section .features .btn-block.mag-4u {
    background-color: #40c3d7;
}
section .features .btn-block.mag-ed {
    background-color: #f2505f;
}
section .features a.btn{
	background: linear-gradient(90deg, #fff 0%, #efefef 55%, #dcdcdc 100%);
	-webkit-box-shadow: none;
        box-shadow: none;
	color: #7b7b7b;
    margin-left: 5px;
	padding: 6px 28px 2px 10px;
	border-radius:20px;
    border: #fff solid 2px;
	font-size: 1.25rem;
	font-weight: bold;
}
section .features a.btn::after{
    content: "→";
	font-size: 0.75rem;
    margin: 3px;
    position: absolute;
}
section .features a.btn:visited{
	color: #7b7b7b;
    border-color: #fff;
}
section .features a.btn:hover,section .features a.btn:focus, section .features a.btn.btn-4u:hover,section .features a.btn.btn-4u:focus, section .features a.btn.btn-ed:hover,section .features a.btn.btn-ed:focus{
	background: linear-gradient(-90deg, #fff 0%, #ffd2d1 55%, #ffb0ae 100%);
	color: #2a2a2a;
    border-color: #fff;
    text-decoration: none;
	text-shadow: none;
    padding: 6px 20px 2px 10px;
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
}
section .features a.btn.btn-4u:hover,section .features a.btn.btn-4u:focus{
	background: linear-gradient(-90deg, #fff 0%, #c7f4fb 55%, #a8dfe7 100%);
}
section .features a.btn.btn-ed:hover,section .features a.btn.btn-ed:focus{
	background: linear-gradient(-90deg, #fff 0%, #ffd1d0 55%, #ffaeac 100%);
}

/* win-award */
section .win-award {
    margin: 0px auto 0px;
    padding-bottom: 200px;  /*獎品圖*/
   }
.sec-magazine > img.magazine-pic {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    display: flex;
    margin-top: -100px;
    margin-left: -33.333%;
}
.win-award-title {
    width: 85%;
    margin-left: 15%;
    text-align: center; }
.win-award-title h2.section-heading {
    margin-left: 5%;
    margin-top: 10px; }
.win-award-title strong.fs-3 {
    margin-top: -10px;
    margin-left: 5%;
    margin-bottom: 10px; }
section .nav > .features.fe-middle {
    margin: 0px auto;
   }
section .nav > .features.fe-middle > .fe-box > h3 img {
    margin: -60px -50px -25px;
   }
@media screen and (max-width: 1199.98px) {
    .sec-magazine > img.magazine-pic{
        max-width: 80%;
        max-height: 80%;
        margin-top: -100px; }
}
@media screen and (max-width: 767.98px) {
    .sec-magazine > img.magazine-pic{
        max-width: 50%;
        max-height: 50%; 
        margin-top: -68px;
        margin-left: 28%; }
    .win-award-title {
        width: 100%;
        margin-top: 198px;
        margin-left: 0; }
    .win-award-title h2.section-heading {
        margin-left: 0;
        list-style: 1.25; }
    .win-award-title strong.fs-3 {
        margin-left: 0;
        font-size: 2rem; }
}
@media screen and (max-width: 575.98px) {
    .win-award-title strong.fs-3 {
        font-size: 1.6875rem; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
    section .nav {
        width: auto;
        margin-left: -7.5%;
        margin-right: -2.5%; }
    section .nav > .features.col-md-4 {
        margin-left: -0%;
        margin-right: -7%;
        -ms-flex: 0 0 39.666667%;
        flex: 0 0 39.666667%;
        max-width: 39.666667%; }
    section .features .fe-box-bottom {
        -ms-flex: 0 0 230px;
        flex: 0 0 230px;
        max-width: 230px;
        margin-left: 10px;
        margin-right: 10px; }
    section .nav > .features.fe-middle > .fe-box img {
        width: 230px; }
}
@media (max-width: 767.98px) {
    section .features .fe-box {
        display: block; }
    section .features .fe-box-bottom {
        -ms-flex: 0 0 280px;
        flex: 0 0 280px;
        max-width: 280px;
        margin-left: auto;
        margin-right: auto; }
    section .nav > .features.fe-middle > .fe-box img {
        width: 280px; }
}

/*數位版*/
#carousel-digital.carousel {
    margin-bottom: 90px;
}
#carousel-digital .carousel-inner {
    border: #fff solid 5px;
    border-radius: 35px;
    margin-top: 35px;
    padding-top: 25px;
}
#carousel-digital .carousel-inner .carousel-item ul {
    margin: 10px 8px;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: rgba(10,0,42,0.35);
    border-radius: 35px;
    display: inline-flex;
}
#carousel-digital .carousel-inner .carousel-item ul li {
    /*font-size: 1.3125rem;*/
    margin-left: 6px;
    margin-right: 4px;
    padding-top: 0px;
    padding-bottom: 2px;
}
#carousel-digital .carousel-inner .carousel-item ul li::before {
  content: "•";
  margin-right: 6px;
}
@media (min-width: 992px) {
    #carousel-digital .carousel-inner .carousel-item ul li {
        font-size: 1.3125rem; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
    #carousel-digital.carousel {
        margin-bottom: 20px; }
    #carousel-digital .carousel-inner {
        width: calc(742px - 0px);
        margin-left: -26px; }
    #carousel-digital .carousel-inner .carousel-item ul li {
        font-size: 1.0625rem; }
}
@media screen and (max-width: 767.98px) {
    #carousel-digital.carousel {
        margin-bottom: 0px; }
    #carousel-digital .carousel-inner {
        width: inherit;
        margin-left: auto; }
    #carousel-digital .carousel-inner .carousel-item ul {
        border-radius: 28px;
        display: block; }
    #carousel-digital .carousel-inner .carousel-item ul li {
        padding-bottom: 0px;
        font-size: 1.rem; }
}


.study-Main, .study-Main-s {
    margin: 60px auto 20px;
    display: block;
    position: relative;
    z-index: 20;
}
.study-Main-list {
    background: transparent url("../img/team/bg_middle-main.png") center 2% no-repeat;
	background-size: 100%;
}
.study-Main-list h3 {
    display: inline-block;
    width: auto;
    margin-top: 0px;
    margin-bottom: 10px;
    padding: 5px 20px 0px;
}
.study-Main-s{
    display: none;
}
.study-Main > .boxline-le, .study-Main-s > .boxline-le, .study-Main > .boxline-le.main-line{
  height: 4.5rem;
  position: absolute;
  top: 0;
  left: calc(100%/2 + 6px);
  border-left: #fb8bb5 dotted 6px;
  margin-top: -88px;
}
@media screen and (max-width: 767.98px) {
    .study-Main{
        display: block;
        margin-top: 10px;
        margin-bottom: 0px; }
    .study-Main-list {
        background: transparent url("../img/team/bg_middle-main.png") center 20% no-repeat;
        background-size: 75%;
        margin: -10px 15px 42px; }
}
@media screen and (max-width: 575.98px) {
    .study-Main-list {
        background-size: 80%; }
}

.study-T-box {
   position: relative;
   margin-top: 0px;
   padding: 80px 10px 0px;
}
.study-T-box.left, .study-T-box.right, .study-T-box.mainLine {
   margin-top: -290px;
   /*background: linear-gradient(45deg, #b4eee3 0%, #d4edf7 42%, #c4daff 100%);*/
   width: 258px;
   -ms-flex: 0 0 auto;
   flex: 0 0 auto;
   max-width: auto;
}
.study-T-box.mainLine {
   margin: -35px -20px 30px;
}

.study-T-box.left > .boxline-le, .study-T-box.right > .boxline-le{
  width: 128px;
  position: absolute;
  top: 42%;
  left: calc(100%/2 + 142px);
  border-top: #fb8bb5 dotted 6px;
  /*border-top: transparent dotted 6px;*/
}
.study-T-box.right > .boxline-le{
  left: calc(-100%/2 - 12px);
}
.study-T-box.mainLine h3.transform-left-sm{
        transform: rotate(0deg);
}


.study-plan{
   position: relative;
   margin: -70px -15px 0;
   padding: 0px;
   width: calc(100% + 30px);
}
.study-plan a{
   padding: 5px 20px;
   font-size: 16px;
   color: #212529;
}
.study-plan a:hover, .study-plan a:focus {
   color: #212529;
}
.study-plan span.glyphicon {
   margin-left: 3px;
}
.study-plan a:hover span.glyphicon, .study-plan a:focus span.glyphicon {
   margin-left: 8px;
}

.study-plan a.btn-light:hover {
  background-color: #f8f9fa;
  border-color: #f8f9fa;
}
.study-plan h3{
  color: #102289;
  font-weight: bold;
  margin-top: 22px;
}
.study-plan p.text-legend{
  font-size: 1.125rem;
  margin-top: 12px;
  padding: 5px 10px;
  background: linear-gradient(45deg, #fff 0%, #baf5ec 42%, #feffba 100%);
  border-radius: 25px;
}

.study-plan img{
   padding: 6%;
}
.study-plan img.study-picMain{
   padding: 0%;
}



@media (min-width: 768px) and (max-width: 991px) {
	.study-T-box.left, .study-T-box.right, .study-T-box.mainLine {
		width: 228px;
		height: 172px;/*height: 228px;*/
	}

	.study-T-box.left > .boxline-le, .study-T-box.right > .boxline-le{
		width: 68px;
		position: absolute;
		top: 42%;
		left: calc(100%/2 + 88px);
	}
	.study-T-box.right > .boxline-le{
		left: calc(100%/2 - 158px);
	}
    
	.study-plan h3{
		margin-top: -38px;
        font-size: 1.625rem;
	}
	.study-plan p.text-legend{
		font-size: 1rem;
		margin-top: 9px;
	}
}
@media screen and (max-width: 767.98px) {
	.study-T-box.left, .study-T-box.right, .study-T-box.mainLine {
		margin: 30px auto 0;
	}
	.study-T-box.left > .boxline-le, .study-T-box.right > .boxline-le{
		height: 58px;/*width: 188px;*/
		top: 85%; /*top: 25%;*/
		left: calc(100%/2 - 3px);
		border-top: none;
		border-left: #fb8bb5 dotted 6px;
	}
	.study-T-box.mainLine {
		margin-bottom: 25px;
	}
    .study-T-box.mainLine h3.transform-left-sm{
        transform: rotate(8deg);
	}
    .study-Main > .boxline-le.main-line{
        display: none;
	}
    
	.study-plan{
        margin: 0px auto;/*margin: 0px -15px;*/
        padding: 0px;
        width: auto;  /*width: calc(100% + 50px);*/
	}
    .study-plan{
        position: relative;
        margin: -100px -15px 0;
        display: block;
	}
    .study-plan h3.fs-4{
        font-size: 2.625rem;
}
	.study-plan p.text-legend{
		font-size: 1rem;
		margin-top: 12px;
        display: inline-table;
	}
}
@media (max-width: 575.98px) {
	.study-T-box.left, .study-T-box.right, .study-T-box.mainLine {
		width: 320px;
		height: 172px;
	}
	.study-T-box.left > .boxline-le{
		top: 88%;
	}
	.study-T-box.right > .boxline-le{
		top: 78%;
	}
}

 /*學習流程*/
.page-service {
    position: relative;
    margin: 0 auto; }
.page-service h3 {
  margin-left: -50px; }
.page-service .boxline {
  width: 200px;
  position: absolute;
  top: 42%;
  border-top: #102289 dotted 5px; }
  .page-service .boxline.line-first {
    left: 50%;
	margin: 12px 0px 0px 70px; }
  .page-service .boxline.line-second {
    right: 50%;
	margin: 12px 70px 0px 0px; }
  .page-service .boxline.line-third {
    left: 50%;
	margin: 12px 0px 0px 70px; }
.page-service .boxline-le {
  height: 68px;
  position: absolute;
  top: -10%;
  left: calc(100%/2 - 2px);
  border-left: #ff55b5 dotted 6px; }
.page-service .boxline-le.cor-org {
  top: -3%;
  border-color: #f38200; }
.page-service .boxline-le.cor-gre {
  top: -3%;
  border-color: #00a3a0; }
  @media (max-width: 767.98px) {
	.page-service {
	  margin-top: -0.5rem;
      margin-bottom: -1rem;}
	.page-service h3 {
      margin-top: 1.75rem;
	  margin-left: 0px; }
	.page-service .btn strong {
	  font-size: 1.5625rem; }}





/* footer */
footer {
    padding-bottom: 68px;
}



/* Servicess */
.services {
  background-color: #fff;
}
.services .single-head {
  position: relative;
}
.services .single-head .service-patern {
  position: absolute;
  left: -55px;
  bottom: -55px;
}
.single-head .single-service {
  margin: 15px 5px;
}
.single-service {
  padding: 25px 20px;
  background-color: #f6f9fc;
  border-radius: 10px;
  position: relative;
  z-index: 2;
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
}

.single-service h3 {
  line-height: 24px;
}

.single-service h3 a {
  color: #081828;
  font-size: 1.25rem;
  font-weight: bold;
}

.single-service h3 a:hover {
  color: #3F5DBB;
}

.single-service .icon, .icon, .icon-whiter {
  background-color: #3F5DBB;
  display: inline-block;
  height: 88px;
  width: 88px;
  line-height: 88px;
  text-align: center;
  border-radius: 88px 88px 88px 0;
  font-size: 1.5625rem;
  margin: 30px 0 20px;
  position: relative;
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
}

.single-service .icon ::after, .icon ::after, .icon-whiter ::after {
  position: absolute;
  left: 0;
  bottom: -15px;
  height: 2px;
  width: 30px;
  background-color: #3F5DBB;
  content: "";
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  border-radius: 3px;
}

.single-service .icon i, .icon i, .icon-whiter i {
  color: #fff;
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
}
.single-service:hover svg path {
  fill: #3F5DBB;
}

.single-service .icon i.icon-usd, .icon i.icon-usd {
  width: 88px;
  height: 88px;
  position: relative;
  display: block;
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  font-size: 3rem;
}
.single-service .icon i.icon-usd:before, .icon i.icon-usd:before {
  position: absolute;
  content: "\e148";
  top: calc(100%/2 - 1.75rem);
  left: 0.325rem;
}
.single-service .icon i.icon-01, .icon i.icon-01 {
  background: url(../img/team/icon_btn01.svg) center center no-repeat;
  display: block;
  width: 88px;
  height: 88px;
}
.single-service .icon i.icon-02, .icon i.icon-02 {
  background: url(../img/team/icon_btn02.svg) center center no-repeat;
  display: block;
  width: 88px;
  height: 88px;
}
.single-service .icon i.icon-03, .icon i.icon-03 {
  background: url(../img/team/icon_btn03.svg) center center no-repeat;
  display: block;
  width: 88px;
  height: 88px;
}
.single-service:hover .icon i.icon-01, .icon-whiter i.icon-01 {
  background: url(../img/team/icon_btn01_h.svg) center center no-repeat;
  display: block;
  width: 88px;
  height: 88px;
}
.single-service:hover .icon i.icon-02, .icon-whiter i.icon-02 {
  background: url(../img/team/icon_btn02_h.svg) center center no-repeat;
  display: block;
  width: 88px;
  height: 88px;
}
.single-service:hover .icon i.icon-03, .icon-whiter i.icon-03 {
  background: url(../img/team/icon_btn03_h.svg) center center no-repeat;
  display: block;
  width: 88px;
  height: 88px;
}
.icon-whiter i.icon-01, .icon-whiter i.icon-02, .icon-whiter i.icon-03 {
  background-color: #fff;
  display: inline-block;
  height: 88px;
  width: 88px;
  line-height: 88px;
  text-align: center;
  border-radius: 88px 88px 88px 0;
}
.icon-whiter i.icon-01, .icon-whiter i.icon-02, .icon-whiter i.icon-03 {
  background-color: #fff;
  position: relative;
}
.icon-whiter ::after {
  background-color: #fff;
  /*width: 50px;*/
}

.single-icon, .icon-whiter i.icon-03 {
  height: 108px;
  width: 108px;
  line-height: 108px;
  text-align: center;
  border-radius: 108px 108px 108px 0;
}
.single-icon.icon i.icon-01 {
  background: url(../img/team/icon_btn01.svg) center center no-repeat;
  height: 108px;
  width: 108px;
}
.single-icon.icon i.icon-02 {
  background: url(../img/team/icon_btn02.svg) center center no-repeat;
  height: 108px;
  width: 108px;
}
.icon-whiter i.icon-03 {
  background: url(../img/team/icon_btn03_h.svg) center center no-repeat, linear-gradient(to top, #9aaaef, #c6fefa, #00fdcf);
  background: url(../img/team/icon_btn03_h.svg) center center no-repeat, -webkit-linear-gradient(to top, #9aaaef, #c6fefa, #00fdcf);
}
  @media (max-width: 767.98px) {
	.single-icon, .single-icon.icon i.icon-01, .single-icon.icon i.icon-02, .icon-whiter i.icon-03 {
      height: 88px; width: 88px; line-height: 88px; }}

.single-service .box {
  float: right;
  display: inline-block;
  margin: 20px 0 0;
  line-height: 1.1;
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
}
.single-service li, .pricing-plan li {
  font-size: 1.1875rem;
}

.pricing-plan {
  padding-top: 25px;
  background-color: #fff;   /*background-color: #f6f9fc;*/
  border-radius: 0 0 25px 25px;
  position: relative;
  z-index: 2;
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
}
.pricing-icon {
  position: relative;/*background: linear-gradient(45deg, rgba(78, 18, 158, 0.9) 13%, rgba(42, 86, 210, 1) 100%); background-color: rgba(255,255,255,.25);*/
  background-color: #cad0de;
  border-radius: 25px 25px 0 0;
    margin-left: 2px;
    margin-right: 2px;
}
.pricing-icon .icon {
    width: 68px;
    height: 68px;
    margin: 40px 0 18px 38px;
}
.pricing-icon .icon ::after {
  position: absolute;
  left: 0;
  bottom: -8px;
  height: 2px;
  width: 30px;
  background-color: #3F5DBB;
  border-radius: 3px;
}
.pricing-icon .options {
  display: block;
  text-align: right;
  position: absolute;
  margin: 0;
  top: 0px;
  left: calc(100%/2 - 100px);
}
.pricing-icon .options span.d-block {
  margin-top: -10px;
  margin-left: 28px;
    font-weight: bold;
    color: #3F5DBB;   /*color: #edca9d;*/
}
.pricing-icon .options h3 a {
  font-size: 1.25rem;
  color: #fff;
  background-color: #FF0086;
  border-radius: 25px;
  margin-right: 0.75rem;
  padding: 6px 12px 2px 15px;
}
.pricing-icon .options h3 a span.badge {
  color: #FF0086;
  background-color: #fff;
  line-height: 1.25;
  position: absolute;
  top: 2px;
  right: 2px;
  border: #FF0086 solid 2px;
}
.pricing-plan p {
  background-color: #FF0086;
  border-radius: 25px 25px 0 0;
  width: calc(100% - 168px);
  text-align: center;
  color: #fff;
}
.pricing-plan li.line {
  position: relative;
  padding: 4px 0 1px;
}
.pricing-plan li.line .w-auto {
  min-width: 138px;
  margin-right: 0px;
}
.pricing-plan li.line::before {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 1px;
  background-color: rgba(0,0,0,.1);
}

@media(min-width:992px) and (max-width: 1199.98px) {
  .single-service .icon {
      margin-left: -10px; }
  .single-service .box {
      margin-right: -15px; }
}

.single-service h3 a {
  font-size: 1.25rem;
  color: #fff;
  background-color: #FF0086;
  border-radius: 0 25px 25px 0;
  margin-left: -25px;
  padding: 2px 10px 2px 25px;
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
}
.single-service p {
  margin-top: 40px;
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
}
.single-service p.fs-5 {
  font-size: 1.25rem;
}
.single-service li {
  position: relative;
  padding-left: 25px;
  margin-bottom: 8px;
}
.single-service li::before {
  font-family: 'Glyphicons Halflings';
  content: "\e013";
  position: absolute;
  left: 0;
  top: 0;
  color: #FF0086;
}

.single-service::before {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  background-color: #3F5DBB;
  content: "";
  z-index: -1;
  border-radius: 10px;
  -webkit-transform: scale(1);
          transform: scale(1);
  -webkit-transition: all 0.4s cubic-bezier(0.94, 0.05, 0.23, 1.04);
  transition: all 0.4s cubic-bezier(0.94, 0.05, 0.23, 1.04);
  -moz-transition: all 0.4s cubic-bezier(0.94, 0.05, 0.23, 1.04);
  opacity: 0;
  visibility: hidden;
}

.single-service:hover::before {
  opacity: 1;
  visibility: visible;
  -webkit-transform: scale(1.03);
          transform: scale(1.03);
}

.single-service:hover h3 a {
  color: #fff;
}

.single-service:hover p, .single-service:hover li {
  color: #fff;
}

.single-service:hover .box {
  color: #fff;
}
.single-service:hover hr {
  border-color: #fff; 
}
.single-service:hover .icon {
  background-color: #fff;
}

.single-service:hover .icon ::after {
  background-color: #fff;
  width: 50px;
}

.single-service:hover .icon i {
  color: #3F5DBB;
}

.single-service:hover li.line::before {
  background-color: #fff;
}

/* 智能方案 */
section#sec-buy .container-fluid {
    text-align: center;
    margin-top: 68px;
    padding: 50px 0;
    background: rgba(142, 179, 234, 0.35);
}
  section#sec-buy .container-fluid {

  }
  section#sec-buy .container-fluid > .row {
    padding-left: calc(100%/2 - 540px);
    padding-right: calc(100%/2 - 540px);
  }
  section#sec-buy .container-fluid > .row > .col-lg-4 {
    -ms-flex: 0 0 calc(1140px/3 - 10px);
    flex: 0 0 calc(1140px/3 - 10px);
    max-width: calc(1140px/3 - 10px);
  }
.btn-group a.btn {
    display: none;
    cursor: pointer;
    border: #fff solid 3px;
    border-radius: 35px;
    color: #fff;
    background: linear-gradient(60deg, rgba(56, 48, 168, 0.9) 13%, rgba(42, 86, 210, 1) 100%);
    -webkit-box-shadow:  0px 17px 25px rgba(27, 31, 49, 0.1);
            box-shadow:  0px 17px 25px rgba(27, 31, 49, 0.1);
}
.btn-group a.btn:hover {
    color: #fff;
    border-color: var(--lightyellow-bg);
}
.btn-group a.btn:focus, .btn-group a.btn.focus {
    color: #fff;
    background-color: #5a6268;
    border-color: var(--lightyellow-bg);
    box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.0);
}
.btn-group a.btn.disabled, .btn-group a.btn:disabled {
    color: #fff;
    background-color: #6c757d;
    border-color: var(--pink-text);
}
.btn-group a.btn:not(:disabled):not(.disabled):active, .btn-group a.btn:not(:disabled):not(.disabled).active,
.show > .btn-group a.btn.dropdown-toggle {
    color: #fff;
    background-color: #545b62;
    border-color: var(--lightyellow-bg);
}
.btn-group a.btn:not(:disabled):not(.disabled):active:focus, .btn-group a.btn:not(:disabled):not(.disabled).active:focus,
.show > .btn-group a.btn.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.0);
}

.btn-group a.btn span.rounded-circle {
    padding: 2px 4px 1px;
}

@media(min-width:992px) and (max-width: 1199.98px) {
  section#sec-buy .container-fluid > .row {
    padding-left: calc(100%/2 - 466px);
    padding-right: calc(100%/2 - 466px);
  }
  section#sec-buy .container-fluid > .row > .col-lg-4 {
    -ms-flex: 0 0 320px;
    flex: 0 0 320px;
    max-width: 320px;
  }
}
@media screen and (max-width: 991.98px) {
  section#sec-buy .container-fluid > .row {
    padding-left: 15px;
    padding-right: 15px;
  }
  section#sec-buy .container-fluid > .row > .col-lg-4 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    margin-left:calc(100%/2 - 50%);
  }
  .btn-group a.btn {
    display: block;
    margin-top: 20px;
  }
}



/* pricingTable Styles */
.pricingTable {
    text-align: center;
    background: rgba(255,255,255,0.95);
    margin: 40px -5px;
    border: transparent solid 3px;
    padding-bottom: 0px;
    border-radius: 35px;
    color: #cad0de;
    -webkit-box-shadow:  0px 17px 25px rgba(27, 31, 49, 0.1);
            box-shadow:  0px 17px 25px rgba(27, 31, 49, 0.1);
    transform: scale(1);
    transition: all .5s ease 0s;
}
.pricingTable:hover {
    transform: scale(1.05);
    z-index: 1;
}
.pricingTable.mark-box {
    border: solid 5px var(--three-blue-bg);
    margin-top: 34px;
}
.pricingTable .pricingTable-header {
    margin-bottom: 10px;
    padding: 25px 0 15px;
    background: #f5f6f9;
    border-radius: 35px 35px 50% 50%;
    transition: all .5s ease 0s;
}
.pricingTable:hover .pricingTable-header {
    background: #ff9624;
    border-radius: 30px 30px 50% 50%;
}
.pricingTable .pricing-title {
  margin: 0;
  position: absolute;
  top: -16px;
  left: calc(100%/2 - 108px);
}
.pricingTable .pricing-title h3 a {
  font-size: 1.375rem;
  color: #fff;
  background-color: #FF0086;
  border-radius: 25px;
  margin: 0;
  padding: 6px 38px 2px 30px;
  position: relative;
}
.pricingTable .pricing-title h3 a span.badge {
  color: #FF0086;
  background-color: #fff;
  line-height: 1.25;
  position: absolute;
  top: 0px;
  right: 1px;
  border: #FF0086 solid 2px;
}
.pricingTable .pricingTable-header .glyphicon {
    font-size: 3.5rem;
    /*color: #858c9a;*/
    margin-top: 0px;
    transition: all .5s ease 0s;
}
.pricingTable .pricingTable-footer {
    background: #ff9624;
    min-height: 30px;
    margin-bottom: 0px;
    border-radius: 0 0 30px 30px;
}

.pricingTable .price-value {
    font-size: 6rem;
    font-weight: bold;
    color: #ff9624;
    line-height: 1;
    letter-spacing: -3px;
    transition: all .5s ease 0s;
}
.pricingTable .month {
    font-size: 1.75rem;
    color: #fff;
    line-height: 1;
    background: linear-gradient(45deg, rgba(78, 18, 158, 0.9) 13%, rgba(42, 86, 210, 1) 100%);
    padding: 6px 25px 5px;
    border-radius: 35px;
    width: 108px;
    margin-left: calc(100%/2 - 54px);
}
.pricingTable .TWD {
    font-size: 1.5rem;
    color: #cad0de;
}
.pricingTable:hover .month,
.pricingTable:hover .TWD,
.pricingTable:hover .price-value,
.pricingTable:hover .pricingTable-header .glyphicon {
    color: #fff;
}
.pricingTable .heading {
    font-size: 1.5rem;
    color: #ff9624;
    margin-bottom: -12px;
    text-transform: uppercase;
}
.pricingTable .pricing-content ul {
    list-style: none;
    padding: 0px 15px;
    margin-top: -12px;
}
.pricingTable .pricing-content ul li .box {
    padding: 0;
}
.pricingTable .pricing-content ul li {
    line-height: 1.45;
    color: #333; /*color: #a7a8aa;*/
    margin: 2px 0px;
    padding-left: 3px;
    border-bottom: #eef1f2 solid 1px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.pricingTable .pricing-content ul li .fs-ss {
    color: #8c8d8d;
    display: block;
    margin: -2px 0 2px -7px;
}
.pricingTable .pricing-content ul li b {
    font-size: 1rem;
    color: var(--pink-text);
}
.pricingTable .pricing-content ul li span.glyphicon {
    font-size: 0.6875rem;
    color: #fff;
    padding: 5px;
    border-radius: 50%;
    background-color: transparent;
    margin-bottom: 5px;
}
.pricingTable .pricing-content ul li span.glyphicon.glyphicon-ok {
    font-size: 0.8125rem;
    color: #4b64ff;
    background-color: #f5f6f9;
}
.pricingTable .pricing-content ul li span.glyphicon.glyphicon-remove {
    background-color: var(--pink-bg);
}
.pricingTable .pricingTable-signup a {
    display: inline-block;
    font-size: 1.25rem;
    color: #fff;
    padding: 10px 35px;
    border-radius: 35px;
    background: #ffa442;
    text-transform: uppercase;
    transition: all .3s ease 0s;
}
.pricingTable .pricingTable-signup a:hover {
    box-shadow: 0 0 10px #ffa442;
}
.pricingTable.blue .heading,
.pricingTable.blue .price-value {
    color: #4b64ff;
}
.pricingTable.blue .pricingTable-signup a,
.pricingTable.blue .pricingTable-footer,
.pricingTable.blue:hover .pricingTable-header {
    background: #4b64ff;
}
.pricingTable.blue .pricingTable-signup a:hover {
    box-shadow: 0 0 10px #4b64ff;
}
.pricingTable.one-blue .heading,
.pricingTable.one-blue .price-value,
.pricingTable.one-blue:hover .month {
    color: #4ba4ff;
}
.pricingTable.one-blue:hover .month {
    background: #fff;
}
.pricingTable.one-blue .pricingTable-signup a,
.pricingTable.one-blue .pricingTable-footer,
.pricingTable.one-blue:hover .pricingTable-header {
    background: #4ba4ff;
}
.pricingTable.one-blue .pricingTable-signup a:hover {
    box-shadow: 0 0 10px #4ba4ff;
}
.pricingTable.two-blue .heading,
.pricingTable.two-blue .price-value,
.pricingTable.two-blue:hover .month {
    color: var(--two-blue-text);
}
.pricingTable.two-blue:hover .month {
    background: #fff;
}
.pricingTable.two-blue .pricingTable-signup a,
.pricingTable.two-blue .pricingTable-footer,
.pricingTable.two-blue:hover .pricingTable-header {
    background: var(--two-blue-bg);
}
.pricingTable.two-blue .pricingTable-signup a:hover {
    box-shadow: 0 0 10px var(--two-blue-bg);
}
.pricingTable.three-blue .heading,
.pricingTable.three-blue .price-value,
.pricingTable.three-blue:hover .month {
    color: var(--three-blue-text);
}
.pricingTable.three-blue:hover .month {
    background: #fff;
}
.pricingTable.three-blue .pricingTable-signup a,
.pricingTable.three-blue .pricingTable-footer,
.pricingTable.three-blue:hover .pricingTable-header {
    background: var(--three-blue-bg);
}
.pricingTable.three-blue .pricingTable-signup a:hover {
    box-shadow: 0 0 10px var(--three-blue-bg);
}
.pricingTable.red .heading,
.pricingTable.red .price-value {
    color: #ff4b4b;
}
.pricingTable.red .pricingTable-signup a,
.pricingTable.red .pricingTable-footer,
.pricingTable.red:hover .pricingTable-header {
    background: #ff4b4b;
}
.pricingTable.red .pricingTable-signup a:hover {
    box-shadow: 0 0 10px #ff4b4b;
}
.pricingTable.green .heading,
.pricingTable.green .price-value {
    color: #40c952;
}
.pricingTable.green .pricingTable-signup a,
.pricingTable.green .pricingTable-footer,
.pricingTable.green:hover .pricingTable-header {
    background: #40c952;
}
.pricingTable.green .pricingTable-signup a:hover {
    box-shadow: 0 0 10px #40c952;
}
.pricingTable.blue:hover .price-value,
.pricingTable.one-blue:hover .price-value,
.pricingTable.two-blue:hover .price-value,
.pricingTable.three-blue:hover .price-value,
.pricingTable.green:hover .price-value,
.pricingTable.red:hover .price-value {
    color: #fff;
}

@media(min-width:768px) and (max-width: 991.98px) {
    .pricingTable {
        max-width: calc(100% - 10%);
        margin: 20px 5% 50px;
    }
    .pricingTable .pricing-content {
        height: 346px;
    }
    .pricingTable .pricing-content ul li {
        font-size: 0.875rem;
        width: calc(100%/2 - 0px);
        padding-left: 15px;
        padding-right: 15px;
        height: 40px;
        float: left;
        display: inline-flex;
    }
}
@media screen and (max-width: 767.98px) {
  .pricingTable {
    margin: 20px 5% 30px; }
}




/* Table Styles */
.table-wrapper {
  margin: 30px 0px 20px;
}
.table {
  border-collapse: collapse;
  width: 100%;
  /*background-color: white;*/
}
.table thead th {
  vertical-align: bottom;
  border-top: 0px solid #dee2e6;
  border-bottom: 0px solid #dee2e6;
  font-size: 1.3125rem;
  ont-weight: bold;
}
.table td,
.table th {
  text-align: center;
  padding: 10px;
}
.table td {
  border-right: 1px solid rgba(255,255,255,0.0);
  background-color: rgba(255,255,255,0.50);
  -webkit-box-shadow:  0px 35px 50px rgba(27, 31, 49, 0.1);
          box-shadow:  0px 35px 50px rgba(27, 31, 49, 0.1);
  border-radius: 0 0 25px 25px;
}
/*.table td.bor-dashed-left {
  border-right: 4px dashed #b2c6e3;
}*/
.table th.left.d-nome, .table td.left.d-td-none {
    display: none;
}

/*  thead th color
------------------------------- */
.table thead th {
  color: #ffffff;
  background: #66a4ed; /* 指定第一個 */
  border-radius: 25px 25px 0 0;
}
.table thead th:nth-child(2) {
  background: var(--one-blue-bg);
}
.table thead th:nth-child(3) {
  background: #66a4ed;
}
.table thead th:nth-child(4) {
  background: var(--two-blue-bg);
}
.table thead th:nth-child(5) {
  background: #66a4ed;
}
.table thead th:nth-child(6) {
  background: var(--three-blue-bg);
}

.table ul {
  padding: 5px 3px;
  margin: 0;
  text-align: left;
    font-size: 1.25rem;
}
.table ul li {
  border-bottom: 1px solid #e7e7e7;
  padding: 5px;
  position: relative;
  list-style-type: none;
  display: flex;
  align-items: center;
}
.table ul li:last-child {
  border-bottom: none;
}

/*  Responsive
------------------------------- */
@media (min-width: 768px) and (max-width: 1199.98px) {
  .table ul {
    font-size: 1rem;
}
  .table-wrapper {
    width: calc(100% + 50px);
    margin: 20px -25px 0;
  }
}
@media (max-width: 767.98px) {
  .table thead {
    display: none;
  }
  .table ul {
    font-size: 100%;
  }

  .table td {
    display: block;
    padding: 0;
    margin-bottom: 25px;
  }
  .table td.left, .table td.right, .table td.left.d-td-none {
    display: inline;
    width: 129px;
    float: left;
    border-radius: 15px;
  }
  .table td.right {
    width: calc(100% - 129px);
  }

  .table td:before {
    content: attr(data-title); /* 顯示 data-title */
    display: inline-block;
    width: 100%;
    font-size: 1.25rem;
    font-weight: bold;
    padding: 6px 0;
    color: #ffffff;
    background: #66a4ed; /* 指定第一個 */
    border-radius: 15px 15px 0 0;
  }
  .table td:nth-child(2):before {
    background: var(--one-blue-bg);
  }
  .table td:nth-child(3):before {
    background: #66a4ed;
  }
  .table td:nth-child(4):before {
    background: var(--two-blue-bg);
  }
  .table td:nth-child(5):before {
    background: #66a4ed;
  }
  .table td:nth-child(6):before {
    background: var(--three-blue-bg);
  }
}

/*  雜誌數位版  */
.intro-study-area {
  background: #341e81; /* Old browsers */
  background: url("../img/team/digito_bg.png") center top no-repeat, -moz-linear-gradient(top, #341e81 0%, #4754ad 80%, #4a68be 100%); /* FF3.6-15 */
  background: url("../img/team/digito_bg.png") center top no-repeat, -webkit-linear-gradient(top, #341e81 0%,#4754ad 80%,#4a68be 100%); /* Chrome10-25,Safari5.1-6 */
  background: url("../img/team/digito_bg.png") center top no-repeat, linear-gradient(to bottom, #341e81 0%,#4754ad 80%,#4a68be 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#341e81', endColorstr='#4a68be',GradientType=0 ); /* IE6-9 */
  background-size: 100%;
}
@media screen and (max-width: 767.98px) {
  .intro-study-area {
    background-size: 200%; }
}




/* go-top */
.back-go-top, .right-link-icon {
    display: none;
    position: fixed;
    bottom: 80px;
    right: 12px;
	z-index: 1030;
}

.back-go-top i {
    display: block;
    line-height: 48px;
    color: #fff;
    text-align: center;
    background-color: #444;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}
.back-go-top i.glyphicon {
    width: 38px;
    height: 48px;
    border-radius: 48px;
    font-size: 0.6875rem;
}
.right-link-icon {
    right: 3px;
    bottom: calc(100vh/2 + 80px);
}
.right-link-icon a.btn-bg {
    display: block;
    margin: 0 0 8px;
    padding: 0;
    width: 76px;
    height: 66px;
    border-radius: 62px 0 0 62px;
}
.right-link-icon a.btn-bg img.icon-btn {
    width: 68px;
    height: 68px;
}

@media screen and (max-width: 479.98px) {
  .back-go-top {
    bottom: 6rem; }}