/*! Typography -- Helpers */

.pos-vertical {
  position: relative;
  top: 25%;
  transform: translateY(-25%);
  -webkit-transform: translateY(-25%);
}
@media all and (max-width: 767px) {
  .pos-vertical {
    top: 0;
    transform: none;
    -webkit-transform: none;
  }
}
@media all and (max-height: 600px) {
  .pos-vertical {
    top: 0;
    transform: none;
    -webkit-transform: none;
  }
}

.background-image-holder {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-size: cover !important;
  background-position: 50% 50% !important;
  z-index: 0;
  transition: 0.3s linear;
  -webkit-transition: 0.3s linear;
  -moz-transition: 0.3s linear;
  opacity: 0;
  background: #232323;
}
.background-image-holder.background--bottom {
  background-position: 50% 100% !important;
}
.background-image-holder.background--top {
  background-position: 50% 0% !important;
}
.image--light .background-image-holder {
  background: none;
}
.background-image-holder img {
  display: none;
}
/*! -- Pillar Sliders -- */
section:not(.imagebg):not(.bg--dark):not(.bg--primary):not(.slider) .flex-direction-nav a,
.slider:not(.slider-controls--white) .flex-direction-nav a {
  color: #232323;
}
section:not(.imagebg):not(.bg--dark):not(.bg--primary):not(.slider) .flex-control-nav li a,
.slider:not(.slider-controls--white) .flex-control-nav li a {
  background: #232323;
  opacity: .4;
  backface-visibility: hidden;
}
section:not(.imagebg):not(.bg--dark):not(.bg--primary):not(.slider) .flex-control-nav li a.flex-active,
.slider:not(.slider-controls--white) .flex-control-nav li a.flex-active {
  opacity: 1;
}
.owl-dot {
  transition: 0.2s linear;
  -webkit-transition: 0.2s linear;
  -moz-transition: 0.2s linear;
}
.owl-dot.active {
  transform: scale(1.5);
  -webkit-transform: scale(1.5);
  position: relative;
  bottom: 1px;
}
.owl-prev,
.owl-next {
  opacity: .2;
}
.owl-prev:hover,
.owl-next:hover {
  opacity: 1;
}
@media all and (max-width: 767px) {
  .owl-prev,
  .owl-next {
    display: none !important;
  }
}
.slider:not(section) .slides li {
  padding: 0;
}
.slider--animate div[class*='col-'] {
  transition: 1s ease;
  -webkit-transition: 1s ease;
  -moz-transition: 1s ease;
  transform: translate3d(0, 100px, 0);
  -webkit-transform: translate3d(0, 100px, 0);
  transition-delay: .5s;
  opacity: 0;
}
.slider--animate .active div[class*='col-'] {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
}
.screenshot-slider {
  margin-top: 3.25em;
}
.screenshot-slider img {
  margin-bottom: 1.625em;
}
/*
 *  Owl Carousel - Animate Plugin
 */
section.slider {
  padding: 0 !important;
  overflow: hidden;
  position: relative;
}
section.slider .owl-theme .owl-controls .owl-nav div.owl-prev,
section.slider .owl-theme .owl-controls .owl-nav div.owl-next {
  color: #1a7d85;
  width: 38px;
  height: 72px;
}
.slides {
  margin: 0;
  overflow: hidden;
}
.slides li > [class*='col-']:first-child:last-child:not([class*='offset']) {
  width: 100% !important;
}
.slider {
  position: relative;
  overflow: hidden;
}
.slider .slides li {
  position: relative;
  padding: 6.5em 0;
}
.slider.space--lg .slides li {
  padding: 13em 0;
}
.slider.space--xlg .slides li {
  padding: 26em 0;
}
.slider:hover .flex-direction-nav a {
  opacity: 1;
}
.slider.height-100 {
  height: auto;
}
.slider.height-100 .slides li {
  height: 100vh;
  padding: 0;
}
.slider.slider-controls--white .flex-direction-nav a {
  color: #fff;
}
.slider.slider-controls--white .flex-control-paging a {
  background: #fff;
}
.slider[data-animation="slide"] .slides li {
  -webkit-backface-visibility: hidden;
}
@media all and (max-width: 767px) {
  .slider[class*='height-'] .slides li {
    height: 800px;
    padding: 6.5em 0;
  }
  .slider.space--lg .slides li {
    padding: 9.75em 0;
  }
  .slider.space--xlg .slides li {
    padding: 9.75em 0;
  }
}
.owl-theme .owl-controls {
  margin: 0;
}
.owl-theme .owl-controls .owl-dots {
  position: absolute;
  width: 100%;
  bottom: 1.625em;
  z-index: 99;
  text-align: center;
}
.owl-theme .owl-controls .owl-dots .owl-dot {
  display: inline-block;
  margin: 0 0.40625em;
  overflow: hidden;
}
.owl-theme .owl-controls .owl-dots .owl-dot span {
  display: inline-block;
  height: 6px;
  width: 6px;
  border-radius: 50%;
  background: #b4b4b4;
  border: none;
  box-shadow: none;
  margin: 0;
}
.owl-theme .owl-controls .owl-dots .owl-dot span:hover {
  background: #1a404c;
}
.owl-theme .owl-controls .owl-dots .owl-dot.active span {
  background: #1a404c;
}
.owl-theme .owl-controls .owl-nav {
  position: absolute;
  z-index: 99;
  top: 50%;
  width: 100%;
  transform: translate3d(0, -50%, 0);
  -webkit-transform: translate3d(0, -50%, 0);
}
.owl-theme .owl-controls .owl-nav div {
  transition: 0.3s ease;
  -webkit-transition: 0.3s ease;
  -moz-transition: 0.3s ease;
  position: absolute;
  margin: 0;
  padding: 0;
  background: none;
}
.owl-theme .owl-controls .owl-nav div:before {
  font-family: 'pillar-interface';
  font-size: 2em;
  text-align: center;
}
.owl-theme .owl-controls .owl-nav div.owl-next {
  right: 1.625em;
	background: url(../images/bt_index_next.png) no-repeat center center;
}
.owl-theme .owl-controls .owl-nav div.owl-next:before {

}
.owl-theme .owl-controls .owl-nav div.owl-prev {
  left: 1.625em;
	background: url(../images/bt_index_prev.png) no-repeat center center;
}
.owl-theme .owl-controls .owl-nav div.owl-prev:before {
}
.slider.slider--controlsoutside {
  overflow: visible;
}
.slider.slider--controlsoutside .slides li {
  padding: 0;
}
.slider.slider--controlsoutside[data-paging="true"] .owl-theme .owl-controls .owl-dots {
  position: relative;
  bottom: 0;
}
.slider.slider--controlsoutside[data-paging="true"] .owl-theme .owl-controls .owl-dots .owl-dot {
  display: inline-block;
}
.slider.slider--controlsoutside[data-paging="true"] .owl-theme .owl-controls .owl-dots .owl-dot span {
  background: #232323;
  display: inline-block;
}
.slider.slider--controlsoutside[data-arrows="true"] .owl-theme .owl-controls .owl-nav .owl-next {
  right: -4em;
}
.slider.slider--controlsoutside[data-arrows="true"] .owl-theme .owl-controls .owl-nav .owl-prev {
  left: -4em;
}
.imagebg .slider.slider--controlsoutside[data-paging="true"] .owl-theme .owl-controls .owl-dots,
section.bg--dark .slider.slider--controlsoutside[data-paging="true"] .owl-theme .owl-controls .owl-dots {
  position: relative;
  bottom: 0;
}
.imagebg .slider.slider--controlsoutside[data-paging="true"] .owl-theme .owl-controls .owl-dots .owl-dot span,
section.bg--dark .slider.slider--controlsoutside[data-paging="true"] .owl-theme .owl-controls .owl-dots .owl-dot span {
  background: #fff;
}
.owl-carousel .animated {
  -webkit-animation-duration: 1000ms;
  animation-duration: 1000ms;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.owl-carousel .owl-animated-in {
  z-index: 0;
}
.owl-carousel .owl-animated-out {
  z-index: 1;
}
.owl-carousel .fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

/*
 *  Owl Carousel - Auto Height Plugin
 */
.owl-height {
  -webkit-transition: height 500ms ease-in-out;
  -moz-transition: height 500ms ease-in-out;
  -ms-transition: height 500ms ease-in-out;
  -o-transition: height 500ms ease-in-out;
  transition: height 500ms ease-in-out;
}

/*
 *  Core Owl Carousel CSS File
 */
.owl-carousel {
  display: none;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
  /* position relative and z-index fix webkit rendering fonts issue */
  position: relative;
  z-index: 1;
}
.owl-carousel .owl-stage {
  position: relative;
  -ms-touch-action: pan-Y;
}
.owl-carousel .owl-stage:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
.owl-carousel .owl-stage-outer {
  position: relative;
  overflow: hidden;
  /* fix for flashing background */
  -webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-controls .owl-nav .owl-prev,
.owl-carousel .owl-controls .owl-nav .owl-next,
.owl-carousel .owl-controls .owl-dot {
  cursor: pointer;
  cursor: hand;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.owl-carousel.owl-loaded {
  display: block;
}
.owl-carousel.owl-loading {
  opacity: 0;
  display: block;
}
.owl-carousel.owl-hidden {
  opacity: 0;
}
.owl-carousel .owl-refresh .owl-item {
  display: none;
}
.owl-carousel .owl-item {
  position: relative;
  min-height: 1px;
  float: left;
  width: 100%;
  -webkit-backface-visibility: hidden;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.owl-carousel.owl-text-select-on .owl-item {
  -webkit-user-select: auto;
  -moz-user-select: auto;
  -ms-user-select: auto;
  user-select: auto;
}
.owl-carousel .owl-grab {
  cursor: move;
  cursor: -webkit-grab;
  cursor: -o-grab;
  cursor: -ms-grab;
  cursor: grab;
}
.owl-carousel.owl-rtl {
  direction: rtl;
}
.owl-carousel.owl-rtl .owl-item {
  float: right;
}

/* No Js */
.no-js .owl-carousel {
  display: block;
}

/*
 *  Owl Carousel - Lazy Load Plugin
 */
.owl-carousel .owl-item .owl-lazy {
  opacity: 0;
  -webkit-transition: opacity 400ms ease;
  -moz-transition: opacity 400ms ease;
  -ms-transition: opacity 400ms ease;
  -o-transition: opacity 400ms ease;
  transition: opacity 400ms ease;
}
.owl-carousel .owl-item img {
  transform-style: preserve-3d;
}

/*
 *  Owl Carousel - Video Plugin
 */
.owl-carousel .owl-video-wrapper {
  position: relative;
  height: 100%;
  background: #000;
}
.owl-carousel .owl-video-play-icon {
  position: absolute;
  height: 80px;
  width: 80px;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -40px;
  /*background: url("owl.video.play.png") no-repeat;*/
  cursor: pointer;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  -webkit-transition: scale 100ms ease;
  -moz-transition: scale 100ms ease;
  -ms-transition: scale 100ms ease;
  -o-transition: scale 100ms ease;
  transition: scale 100ms ease;
}
.owl-carousel .owl-video-play-icon:hover {
  -webkit-transition: scale(1.3, 1.3);
  -moz-transition: scale(1.3, 1.3);
  -ms-transition: scale(1.3, 1.3);
  -o-transition: scale(1.3, 1.3);
  transition: scale(1.3, 1.3);
}
.owl-carousel .owl-video-playing .owl-video-tn,
.owl-carousel .owl-video-playing .owl-video-play-icon {
  display: none;
}
.owl-carousel .owl-video-tn {
  opacity: 0;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;
  background-size: contain;
  -webkit-transition: opacity 400ms ease;
  -moz-transition: opacity 400ms ease;
  -ms-transition: opacity 400ms ease;
  -o-transition: opacity 400ms ease;
  transition: opacity 400ms ease;
}
.owl-carousel .owl-video-frame {
  position: relative;
  z-index: 1;
}

.banner_title{
	font-size: 55px;
	color: #1a3f4b;
	padding-bottom: 5px;
  font-weight: 400;
}

.banner_title_s{
	font-size: 36px;
	color: #595757;
	padding-bottom: 30px;
}

.banner_depiction{
	font-size: 20px;
	line-height: 30px;
	color: #7e7e7e;
	padding-bottom: 50px;
}

.banner_link{
	font-size: 22px;
	font-weight: bold;
	color: #1a7d85;
	padding-bottom: 30px;
}

.banner_link a{
	color: #1a7d85;
	background: url(../images/bt_index_to.png) no-repeat right center;
	padding-right: 35px;
}

.banner_search{
	padding-top: 20px
}

.form-search input {
	border: 0;
	background: #fff;
	height: 55px;
	line-height: 55px;
	padding-left: 20px;
	font-size: 16px;
	color: #777777;
}

.form-search input + button[type="search"] {
	margin-left: -4px;
}
.form-search button[type="search"] {
	position: relative;
	margin: 0;
	border: 0;
	background: #1a404c;
	height: 55px;
	line-height: 55px;
	width: 55px;
	font-size: 16px;
	cursor: pointer;
}

/* 1600 x 1200 , 1600 x 1024 , 1600 x 900 */
@media screen and (max-width: 1600px) {
}

/* 1400 x 900 , 1400 x 1050 */
@media screen and (max-width: 1440px) {
}

@media screen and (max-width: 1334px) {
	.banner_title{
		font-size: 55px;
		padding-top: 55px;
    font-weight: 400;
	}

	.banner_title_s{
		font-size: 36px;
		padding-bottom: 30px;
	}

	.banner_depiction{
		font-size: 20px;
		line-height: 30px;
		padding-bottom: 30px;
	}

	.banner_link{
		font-size: 22px;
		padding-bottom: 20px;
	}

	.form-search input {
		font-size: 16px;
		line-height: 55px;
	}

	.form-search button[type="search"] {
		height: 55px;
		line-height: 55px;
		font-size: 16px;
	}
}

@media screen and (max-width: 1136px) {
	.banner_title{
		font-size: 40px;
		padding-top: 35px;
    font-weight: 400;
	}

	.banner_title_s{
		font-size: 25px;
		padding-bottom: 20px;
	}

	.banner_depiction{
		font-size: 16px;
		line-height: 22px;
		padding-bottom: 25px;
	}

	.banner_link{
		font-size: 20px;
		padding-bottom: 10px;
	}

	.banner_link a{
		color: #1a7d85;
		background: url(../images/bt_index_to.png) no-repeat right center;
		padding-right: 35px;
	}

	.banner_search{
		padding-top: 20px
	}
}

@media screen and (min-width: 1001px) and (max-width: 1029px) {
	.form-search input {
		font-size: 14px;
		line-height: 40px;
		height: 40px;
	}

	.form-search button[type="search"] {
		height: 40px;
		width: 40px;
		line-height: 40px;
		font-size: 14px;
	}

	.form-search button[type="search"] img{
		width: 100%;
	}
}


/* 以下切換手機板*/
@media screen and (min-width: 1030px) and (max-width: 1080px) {
	.pos-vertical {
	  position: relative ;
	  top: 90px !important;
	  transform: translateY(-25%);
	  -webkit-transform: translateY(-25%);
	}
	.slider[class*='height-'] .slides li {
		height: 800px;
		padding: 0;
	}
	.slider.space--lg .slides li {
		padding: 0;
	}
	.slider.space--xlg .slides li {
		padding: 0;
	}
	.container .col-4{
		width: 90%;
		padding: 0 5%;
		text-align: center;
	}

	.container .col-9{
		width: 100%;
	}

	.banner_title{
		font-size: 55px;
		padding-top: 0px;
		padding-bottom: 15px;
    font-weight: 400;
	}

	.banner_title_s{
		font-size: 36px;
		padding-bottom: 30px;
	}

	.banner_depiction{
		font-size: 25px;
		line-height: 36px;
		padding-bottom: 25px;
	}

	.banner_link{
		font-size: 26px;
		padding: 0 !important;
		width: 50% !important;
		position: relative;
		top: 300px;
	}

	.banner_link a{
		background: none;
		text-decoration: underline;
		padding-right: 0;
	}

	.banner_search{
		display: none;
	}
}

@media screen and (max-width: 1000px) {
	.pos-vertical {
	  position: relative ;
	  top: 90px !important;
	  transform: translateY(-25%);
	  -webkit-transform: translateY(-25%);
	}
	.slider[class*='height-'] .slides li {
		height: 800px;
		padding: 0;
	}
	.slider.space--lg .slides li {
		padding: 0;
	}
	.slider.space--xlg .slides li {
		padding: 0;
	}
	.container .col-4{
		width: 90%;
		padding: 0 5%;
		text-align: center;
	}

	.container .col-9{
		width: 100%;
	}

	.banner_title{
		font-size: 55px;
		padding-top: 0px;
		padding-bottom: 15px;
    font-weight: 400;
	}

	.banner_title_s{
		font-size: 36px;
		padding-bottom: 30px;
	}

	.banner_depiction{
		font-size: 28px;
		line-height: 36px;
		padding-bottom: 25px;
	}

	.banner_link{
		font-size: 28px;
		padding: 0 !important;
		width: 50% !important;
		position: relative;
		top: 300px;
	}

	.banner_link a{
		background: none;
		text-decoration: underline;
		padding-right: 0;
	}

	.banner_search{
		display: none;
	}
}

@media screen and (max-width: 760px) {
	.pos-vertical {
	  position: relative ;
	  top: 90px !important;
	  transform: translateY(-25%);
	  -webkit-transform: translateY(-25%);
	}
	  .slider[class*='height-'] .slides li {
		height: 800px;
		padding: 0;
	  }
	  .slider.space--lg .slides li {
		padding: 0;
	  }
	  .slider.space--xlg .slides li {
		padding: 0;
	  }
}