﻿@charset "UTF-8";

html, body { height:100%; }
.ec-wrapper { min-height:100%; display: flex; flex-direction: column; }
main, .ec-content { flex-grow: 1; }

@font-face {
	font-family: "Montserrat";
	src: url("/emc/common/util/fonts/Montserrat/Montserrat-Regular.ttf") format("truetype");
}
@font-face {
	font-family: "Roboto";
	src: url("/emc/common/util/fonts/Roboto/Roboto-Regular.ttf") format("truetype");
}

/** header, main */
header.sticky-top { z-index: 1021; }
.ec-page-submenu {
	backdrop-filter: blur(3px);
    background: #ffffffe6;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    max-height: 200px;
    overflow-y: auto;
}

main { z-index:1; }
.ec-heading-area { z-index:0; }
.ec-heading-shape-img { height:200px; }

.ec-heading { padding-top:4rem; padding-bottom:2rem; }
.ec-heading-text { min-height: 200px; display: flex; align-items: center; padding-top: 2rem; padding-bottom: 2rem; }
.ec-heading-bg-img { padding:0; }


body.ec-header-dark .btn.ec-link-header { color: #212529; }
body.ec-header-white .btn.ec-link-header { color: #ffffff; }
body.ec-header-primary .btn.ec-link-header { color: #009944; }
body .btn.ec-link-header { transform: translateZ(0); }


/** menu */
.ec-dpmenu-column { min-width:230px; padding-left: 0.5rem; padding-right: 0.5rem; }
.ec-dpmenu-items { max-height: calc(100vh - 300px); overflow: auto; }
.ec-shadow-sm { box-shadow: 1px 1px 3px 2px #2125294D; }

/* 滑鼠移動，自然向下展開。html要加上pe-none
header .dropdown:hover>.btn.ec-link-header { color: #009944; background-color:#e9ecef; }
header .dropdown:hover>.dropdown-menu { display: block; inset: auto 0px auto auto;  margin: 0px; }
header .dropdown>.dropdown-toggle:active { pointer-events: none; Without this, clicking will make it sticky }
*/

/** footer */
body.ec-footer-fixed-bottom footer { position: fixed; right: 0; bottom: 0; left: 0; z-index: 1030; }

.ec-right-box { z-index:100; position: fixed; bottom:120px; right:15px; }
.js-btn-top { height:45px; width:45px; }

/** common */
.text-justify { text-align: justify!important; }

.rotateY { transform: rotateY(180deg); }
.highcharts-credits { display:none; }/* 移除highcharts浮水印 */ 

.ec-cursor-pointer { cursor: pointer; }
.ec-single-ellipsis {/* 單行文字...效果*/
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ec-multiline-ellipsis-1 { 
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}
.ec-multiline-ellipsis-2 { 
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.ec-multiline-ellipsis-3 { 
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.ec-slim-scrollbar::-webkit-scrollbar {
  width: 5px;
  border-radius: 8px;
  background-color: #e9ecef;
}
.ec-slim-scrollbar::-webkit-scrollbar-thumb {
  border-radius: 8px;
  background: #adb5bd;
}

/** margin padding */
.ec-session-m,.ec-session-mx,.ec-session-ms { margin-right:3rem; }
.ec-session-m,.ec-session-mx,.ec-session-me { margin-left:3rem; }
.ec-session-m,.ec-session-my,.ec-session-mt { margin-top:3rem; }
.ec-session-m,.ec-session-my,.ec-session-mb { margin-bottom:3rem; }
.ec-session-p,.ec-session-px,.ec-session-ps { padding-right:3rem; }
.ec-session-p,.ec-session-px,.ec-session-pe { padding-left:3rem; }
.ec-session-p,.ec-session-py,.ec-session-pt { padding-top:3rem; }
.ec-session-p,.ec-session-py,.ec-session-pb { padding-bottom:3rem; }

.m-6,.mx-6,.ms-6 { margin-left:6rem; }
.m-6,.mx-6,.me-6 { margin-right:6rem; }
.m-6,.my-6,.mt-6 { margin-top:6rem; }
.m-6,.my-6,.mb-6 { margin-bottom:6rem; }
.p-6,.px-6,.ps-6 { padding-left:6rem; }
.p-6,.px-6,.pe-6 { padding-right:6rem; }
.p-6,.py-6,.pt-6 { padding-top:6rem; }
.p-6,.py-6,.pb-6 { padding-bottom:6rem; }

.p-1px,.px-1px,.ps-1px { padding-left:1px; }
.p-1px,.px-1px,.pe-1px { padding-right:1px; }
.p-1px,.py-1px,.pt-1px { padding-top:1px; }
.p-1px,.py-1px,.pb-1px { padding-bottom:1px; }

/** background */
.ec-bg-fixed { background-attachment: fixed; }

.ec-bg-opacity-primary-00 { background-color: #00994400 !important; }
.ec-bg-opacity-primary-01 { background-color: #0099441A !important; }
.ec-bg-opacity-primary-02 { background-color: #00994433 !important; }
.ec-bg-opacity-primary-03 { background-color: #0099444D !important; }
.ec-bg-opacity-primary-04 { background-color: #00994466 !important; }
.ec-bg-opacity-primary-05 { background-color: #00994480 !important; }
.ec-bg-opacity-primary-06 { background-color: #00994499 !important; }
.ec-bg-opacity-primary-07 { background-color: #009944B3 !important; }
.ec-bg-opacity-primary-08 { background-color: #009944CC !important; }
.ec-bg-opacity-primary-09 { background-color: #009944E6 !important; }

.ec-bg-opacity-secondary-00 { background-color: #00AEEF00 !important; }
.ec-bg-opacity-secondary-01 { background-color: #00AEEF1A !important; }
.ec-bg-opacity-secondary-02 { background-color: #00AEEF33 !important; }
.ec-bg-opacity-secondary-03 { background-color: #00AEEF4D !important; }
.ec-bg-opacity-secondary-04 { background-color: #00AEEF66 !important; }
.ec-bg-opacity-secondary-05 { background-color: #00AEEF80 !important; }
.ec-bg-opacity-secondary-06 { background-color: #00AEEF99 !important; }
.ec-bg-opacity-secondary-07 { background-color: #00AEEFB3 !important; }
.ec-bg-opacity-secondary-08 { background-color: #00AEEFCC !important; }
.ec-bg-opacity-secondary-09 { background-color: #00AEEFE6 !important; }

.ec-bg-opacity-body-00 { background-color: #21252900 !important; }
.ec-bg-opacity-body-01 { background-color: #2125291A !important; }
.ec-bg-opacity-body-02 { background-color: #21252933 !important; }
.ec-bg-opacity-body-03 { background-color: #2125294D !important; }
.ec-bg-opacity-body-04 { background-color: #21252966 !important; }
.ec-bg-opacity-body-05 { background-color: #21252980 !important; }
.ec-bg-opacity-body-06 { background-color: #21252999 !important; }
.ec-bg-opacity-body-07 { background-color: #212529B3 !important; }
.ec-bg-opacity-body-08 { background-color: #212529CC !important; }
.ec-bg-opacity-body-09 { background-color: #212529E6 !important; }

.ec-bg-theme-gradient { background: linear-gradient(90deg, #D6F6E3 17.85%, #D6F0FB 82.01%); mix-blend-mode: normal; }
.ec-bd-blur { backdrop-filter: blur(2px); }

/** accordion */
.accordion .accordion-button.d-none-icon::after {
    content: none;
}
/** button */
.btn{
    border-radius: 50rem;
}
.ec-btn-2x {
	padding: 0.875rem 3rem;
}

/** card border-radius: .25rem; */
.card:not(.ec-card-bordered) { border-width: 0; }
.ec-border-box { border-left: 1px solid; border-bottom: 4px solid; border-right: 4px solid; border-top: 1px solid; }

.ec-card-bg-layout,
.card.ec-card-bg-layout { border-radius: .5rem; overflow: hidden; }
.card.ec-card-bg-layout >.card-header,
.card.ec-card-bg-layout >.card-footer,
.card.ec-card-bg-layout >.card-body { padding: 1rem 1rem; }

.card.ec-card-p-0 >.card-header,
.card.ec-card-p-0 >.card-footer,
.card.ec-card-p-0 >.card-body { padding: 0; }

/** nav */
.nav-link:hover { background-color: #e9ecef !important; }
.nav-pills.ec-nav-pills-submenu .nav-link {
    background-color:#e9ecef;
    text-align: center;
}
.nav-pills.ec-nav-pills-default-setting .nav-link {
    background-color:#e9ecef;
    text-align: center;
}


/** z-index */
.z-index-1 { z-index:1; }
.z-index-2 { z-index:2; }
.z-index-3 { z-index:3; }
.z-index-4 { z-index:4; }
.z-index-5 { z-index:5; }

/** radius */
.rounded-4 { border-radius: 0.5rem!important; }
.rounded-5 { border-radius: 1.5rem!important; }

.rounded-top-left-5,.rounded-top-5,.rounded-start-5 { border-top-left-radius: 1.5rem!important; }
.rounded-top-right-5,.rounded-top-5,.rounded-end-5 { border-top-right-radius: 1.5rem!important; }
.rounded-bottom-left-5,.rounded-bottom-5,.rounded-start-5 { border-bottom-left-radius: 1.5rem!important; }
.rounded-bottom-right-5,.rounded-bottom-5,.rounded-end-5 { border-bottom-right-radius: 1.5rem!important; }

/** width height */
.w-10 { width:10%!important; }
.w-20 { width:20%!important; }
.w-30 { width:30%!important; }
.w-40 { width:40%!important; }
.w-60 { width:60%!important; }
.w-70 { width:70%!important; }
.w-80 { width:80%!important; }
.w-90 { width:90%!important; }

.h-10 { height:10%!important; }
.h-20 { height:20%!important; }
.h-30 { height:30%!important; }
.h-40 { height:40%!important; }
.h-50 { height:50%!important; }
.h-60 { height:60%!important; }
.h-70 { height:70%!important; }
.h-80 { height:80%!important; }
.h-90 { height:90%!important; }

.h-30px { height:30px; }
.h-40px { height:40px; }
.h-50px { height:50px; }
.h-80px { height:80px; }
.h-300px { height:300px; }

/** text */
.ec-text-title { font-weight: 700; margin-bottom: 1.5rem; }
.ec-text-subtitle {  }
.ec-text-item { font-weight: 700; margin-bottom: 1rem; }
.ec-text-subitem { font-weight: 700; color: #009944; }

/** list-group */
.list-group.ec-list-group-striped>.list-group-item:nth-of-type(odd) {
    background-color: #2125290d;
}

/** list */
.ec-li-unstyled {list-style: none;}

.ec-list-cjk { list-style-type: cjk-ideographic;}
.ec-list-cjk .ec-list-second>li { counter-increment: item; }
.ec-list-cjk .ec-list-second>li::marker { content: "(" counter(item, cjk-ideographic) ") "; }

.ec-firstlist-cjk { list-style-type: cjk-ideographic; }
.ec-firstlist-cjk>li.ec-marker-primary::marker { color: #009944; }
.ec-secondlist-cjk>li { counter-increment: item; }
.ec-secondlist-cjk>li::marker { content: "(" counter(item, cjk-ideographic) ") "; }

.ec-firstlist-decimal { list-style-type: decimal; }
.ec-firstlist-decimal>li.ec-marker-primary::marker { color: #009944; }
.ec-secondlist-decimal>li { counter-increment: item; }
.ec-secondlist-decimal>li::marker { content: "(" counter(item, decimal) ") "; }

/** hover */
.ec-hover-scale-img:hover .ec-hover-img { transform: scale(1.1); transition: .2s ease-in-out; }


/** carousel */
.carousel-item {
	
}

/** timeline */
.ec-timeline { position: relative; max-width: 1280px; margin: 0 auto; }
.ec-timeline-line {
	position: absolute;
    top: 0; bottom: 0; left: 5%;
    width: 6px;
    margin-left:-3px;
}
.ec-timeline-block { padding: 10px 40px; position: relative; width: 100%; left:5%; }
.ec-timeline-block::before {
	content:"";
	position: absolute;
	border: medium solid #e9ecef;
    border-width: 10px 0 10px 10px;
    border-color: transparent transparent transparent #e9ecef;
}
.ec-timeline-block.left::before {
	top:22px; left:auto; right:30px;
    border-width: 10px 0 10px 10px;
    border-color: transparent transparent transparent #e9ecef;
}
.ec-timeline-block.right::before {
	top:22px; left:30px; right:auto;
    border-width: 10px 10px 10px 0;
    border-color: transparent #e9ecef transparent transparent;
}
.ec-timeline-block::after {
	content: "";
    position: absolute; top: 15px; right: -12px;
    width: 25px; height: 25px;
    background-color: white;
    border: 4px solid #009933;
    border-radius: 50%;
    z-index: 1;
}
.ec-timeline-block.right::after { left: -13px; }



/** multi-carousel */
.ec-multi-carousel { position: relative; }
.ec-multi-carousel .multi-carousel-inner { 
    position: relative;
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
}
.ec-multi-carousel .multi-carousel-inner .multi-carousel-item {
    opacity: 1;
    transition: transform .6s ease-in-out;
    padding: 10px 0.25rem;
}

@media (orientation:landscape) {
}
/** Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
		
	.w-sm-10 { width:10%!important; }
	.w-sm-20 { width:20%!important; }
	.w-sm-30 { width:30%!important; }
	.w-sm-40 { width:40%!important; }
	.w-sm-50 { width:50%!important; }
	.w-sm-60 { width:60%!important; }
	.w-sm-70 { width:70%!important; }
	.w-sm-80 { width:80%!important; }
	.w-sm-90 { width:90%!important; }
	.w-sm-100 { width:100%!important; }
	.w-sm-auto { width:auto!important; }	
	
	.h-sm-10 { height:10%!important; }
	.h-sm-20 { height:20%!important; }
	.h-sm-30 { height:30%!important; }
	.h-sm-40 { height:40%!important; }
	.h-sm-50 { height:50%!important; }
	.h-sm-60 { height:60%!important; }
	.h-sm-70 { height:70%!important; }
	.h-sm-80 { height:80%!important; }
	.h-sm-90 { height:90%!important; }
	.h-sm-100 { height:100%!important; }
	.h-sm-auto { height:auto!important; }
}
/**  Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.ec-heading { padding-top:6rem; padding-bottom:3rem; }
	.ec-heading-shape-img { height:300px; }
	
	.ec-right-box { bottom:80px; right:30px; }
	
	.text-md-justify { text-align: justify!important; }
	
	.ec-card-bg-layout,
	.card.ec-card-bg-layout { border-radius: 1rem; }
	.card.ec-card-bg-layout >.card-header,
	.card.ec-card-bg-layout >.card-footer,
	.card.ec-card-bg-layout >.card-body { padding: 1.5rem 1.5rem; }
		
	.w-md-10 { width:10%!important; }
	.w-md-20 { width:20%!important; }
	.w-md-30 { width:30%!important; }
	.w-md-40 { width:40%!important; }
	.w-md-50 { width:50%!important; }
	.w-md-60 { width:60%!important; }
	.w-md-70 { width:70%!important; }
	.w-md-80 { width:80%!important; }
	.w-md-90 { width:90%!important; }
	.w-md-100 { width:100%!important; }
	.w-md-auto { width:auto!important; }
	
	.h-md-10 { height:10%!important; }
	.h-md-20 { height:20%!important; }
	.h-md-30 { height:30%!important; }
	.h-md-40 { height:40%!important; }
	.h-md-50 { height:50%!important; }
	.h-md-60 { height:60%!important; }
	.h-md-70 { height:70%!important; }
	.h-md-80 { height:80%!important; }
	.h-md-90 { height:90%!important; }
	.h-md-100 { height:100%!important; }
	.h-md-auto { height:auto!important; }
}
/**  Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.container-lg-fluid { max-width:100%; }
	
	.ec-card-bg-layout,
	.card.ec-card-bg-layout { border-radius: 1.5rem; }
	.card.ec-card-bg-layout >.card-header,
	.card.ec-card-bg-layout >.card-footer,
	.card.ec-card-bg-layout >.card-body { padding: 2rem 2rem; }
	
	.ec-timeline-line {
		position: absolute;
	    top: 0; bottom: 0; left: 50%;
	    width: 6px;
	    margin-left:-3px;
	}
	.ec-timeline-block { padding: 10px 40px; position: relative; width: 50%; }
	.ec-timeline-block.left-lg { left:0; }
	.ec-timeline-block.right-lg { left:50%; }
	.ec-timeline-block::before {
		content:"";
		position: absolute;
		border: medium solid #e9ecef;
	    border-width: 10px 0 10px 10px;
	    border-color: transparent transparent transparent #e9ecef;
	}
	.ec-timeline-block.left-lg::before {
		top:22px; left:auto; right:30px;
	    border-width: 10px 0 10px 10px;
	    border-color: transparent transparent transparent #e9ecef;
	}
	.ec-timeline-block.right-lg::before {
		top:22px; left:30px; right:auto;
	    border-width: 10px 10px 10px 0;
	    border-color: transparent #e9ecef transparent transparent;
	}
	.ec-timeline-block.left-lg::after { left: auto; }
	
	.ec-session-m,.ec-session-mx,.ec-session-ms { margin-right:6rem; }
	.ec-session-m,.ec-session-mx,.ec-session-me { margin-left:6rem; }
	.ec-session-m,.ec-session-my,.ec-session-mt { margin-top:6rem; }
	.ec-session-m,.ec-session-my,.ec-session-mb { margin-bottom:6rem; }
	.ec-session-p,.ec-session-px,.ec-session-ps { padding-right:6rem; }
	.ec-session-p,.ec-session-px,.ec-session-pe { padding-left:6rem; }
	.ec-session-p,.ec-session-py,.ec-session-pt { padding-top:6rem; }
	.ec-session-p,.ec-session-py,.ec-session-pb { padding-bottom:6rem; }
	
	.w-lg-10 { width:10%!important; }
	.w-lg-20 { width:20%!important; }
	.w-lg-30 { width:30%!important; }
	.w-lg-40 { width:40%!important; }
	.w-lg-50 { width:50%!important; }
	.w-lg-60 { width:60%!important; }
	.w-lg-70 { width:70%!important; }
	.w-lg-80 { width:80%!important; }
	.w-lg-90 { width:90%!important; }
	.w-lg-100 { width:100%!important; }
	.w-lg-auto { width:auto!important; }
	
	.h-lg-10 { height:10%!important; }
	.h-lg-20 { height:20%!important; }
	.h-lg-30 { height:30%!important; }
	.h-lg-40 { height:40%!important; }
	.h-lg-50 { height:50%!important; }
	.h-lg-60 { height:60%!important; }
	.h-lg-70 { height:70%!important; }
	.h-lg-80 { height:80%!important; }
	.h-lg-90 { height:90%!important; }
	.h-lg-100 { height:100%!important; }
	.h-lg-auto { height:auto!important; }
}
/**  X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	.ec-right-box { bottom:80px; right:60px; }
		
	.w-xl-10 { width:10%!important; }
	.w-xl-20 { width:20%!important; }
	.w-xl-30 { width:30%!important; }
	.w-xl-40 { width:40%!important; }
	.w-xl-50 { width:50%!important; }
	.w-xl-60 { width:60%!important; }
	.w-xl-70 { width:70%!important; }
	.w-xl-80 { width:80%!important; }
	.w-xl-90 { width:90%!important; }
	.w-xl-100 { width:100%!important; }
	.w-xl-auto { width:auto!important; }
	
	.h-xl-10 { height:10%!important; }
	.h-xl-20 { height:20%!important; }
	.h-xl-30 { height:30%!important; }
	.h-xl-40 { height:40%!important; }
	.h-xl-50 { height:50%!important; }
	.h-xl-60 { height:60%!important; }
	.h-xl-70 { height:70%!important; }
	.h-xl-80 { height:80%!important; }
	.h-xl-90 { height:90%!important; }
	.h-xl-100 { height:100%!important; }
	.h-xl-auto { height:auto!important; }
	
}
/**  XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
			
	.w-xxl-10 { width:10%!important; }
	.w-xxl-20 { width:20%!important; }
	.w-xxl-30 { width:30%!important; }
	.w-xxl-40 { width:40%!important; }
	.w-xxl-50 { width:50%!important; }
	.w-xxl-60 { width:60%!important; }
	.w-xxl-70 { width:70%!important; }
	.w-xxl-80 { width:80%!important; }
	.w-xxl-90 { width:90%!important; }
	.w-xxl-100 { width:100%!important; }
	.w-xxl-auto { width:auto!important; }
	
	.h-xxl-10 { height:10%!important; }
	.h-xxl-20 { height:20%!important; }
	.h-xxl-30 { height:30%!important; }
	.h-xxl-40 { height:40%!important; }
	.h-xxl-50 { height:50%!important; }
	.h-xxl-60 { height:60%!important; }
	.h-xxl-70 { height:70%!important; }
	.h-xxl-80 { height:80%!important; }
	.h-xxl-90 { height:90%!important; }
	.h-xxl-100 { height:100%!important; }
	.h-xxl-auto { height:auto!important; }
}
