@charset "utf-8";
/* CSS Document */

/*===============================================
                    整體設定
=================================================*/

body {
	font-family: "Microsoft JhengHei UI", "Microsoft JhengHei UI Light", "微軟正黑體" !important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Microsoft JhengHei UI", "Microsoft JhengHei UI Light", "微軟正黑體";
}

a, a:hover {
    text-decoration: none;
    transition: all .3s;
}

/*:focus {
    outline: 2px solid #f82626 !important;
}*/

@media (min-width: 1380px){

#wrapper .container {

}

}

/*===============================================
                    上方區塊
=================================================*/

#header {
    border-bottom: 0px solid #F5F5F5;
}

#header-wrap {

}

@media (min-width: 1730px){

#header .container {

}

}

/*===============================================
                  上方logo區塊
=================================================*/

@media (max-width: 1730px){

#logo img {
    height: 70px !important;
}

}

@media (max-width: 480px){

#logo img {
    height: 50px !important;
}

}

/*===============================================
                   RWD按鈕樣式
=================================================*/

#primary-menu-trigger .svg-trigger path {
    stroke: #000;
}

/*===============================================
                   banner選單
=================================================*/

#banner-menu .menu-item:not(:first-child) {

}

/*banner選單-主選單-連結文字樣式*/

.primary-menu > #banner-menu > li > a {
    font-size: 15px;

}

#banner-menu .menu-item:hover > .menu-link, #banner-menu .menu-item.current > .menu-link {

}


#banner-menu .menu-item:hover button, #banner-menu .menu-item.current button {
    color: #fff !important;
}

/*banner選單-子選單-主區塊*/

#banner-menu .sub-menu-container {
    border: none;
    border-top: 2px solid #0784b2;
}

/*banner選單-子選單-連結文字樣式*/

#banner-menu .sub-menu-container .menu-item > .menu-link {
    font-size: 1em;
	color: #333;
}

#banner-menu .sub-menu-container .menu-item > .menu-link:hover {
    color: #0784b2;
    background-color: transparent;
}

@media (min-width: 992px){

.primary-menu .menu-link div > i.icon-angle-down {
    display: initial;
}

/*banner選單-主選單-特殊連結文字樣式*/

#banner-menu .sp-button a {
    color: #fff !important;
    background-color: #0784b2;
    border-radius: 99px;
    padding: 10px 15px!important;
    border: 2px solid #fff;
	transition: all .3s;
}

#banner-menu .sp-button a:hover {
    color: #0784b2 !important;
    background-color: #fff;
    border-color: #0784b2;
}

}

@media (max-width: 1440px){

.primary-menu > #banner-menu > li > a {
    padding-left: 10px;
    padding-right: 10px;

}

}

@media (max-width: 1200px){

.primary-menu > #banner-menu > li > a {
    font-size: 16px;
    padding-left: 4px;
    padding-right: 4px;
}

.primary-menu > #banner-menu > li > a i {
    margin-right: 4px;
}

}

@media (max-width: 991px){

.primary-menu > #banner-menu > li > a {
    font-size: 18px;
}

.primary-menu > #banner-menu > li > a i {
    margin-right: 10px;
}

#banner-menu .sub-menu-container {
    border-top: 1px solid #eee;
    background-color: #fff;
    padding: 0;
}

#banner-menu .sub-menu-container .menu-item > .menu-link {
    color: #000;
}

#banner-menu .sub-menu-container .menu-item > .menu-link:hover {

}

}

/*===============================================
                   內頁banner選單
=================================================*/

/*===============================================
                  上方搜尋區塊
=================================================*/

#top-search a {
    color: #000;
}

@media (max-width: 991px){

#top-search a {
    position: absolute;
    right: 48px;
    top: 26px;
}

}

@media (max-width: 480px){

#top-search a {
    top: 15px;
}

}

/*===============================================
                上方區塊-下滑後之樣式
=================================================*/

#header.sticky-header:not(.static-sticky), #header.sticky-header:not(.static-sticky) #header-wrap {
    height: auto;
}

/*===============================================
                  首頁banner區塊
=================================================*/

/*首頁banner區塊-主標題樣式*/

#index-banner #text-box h1 {
    font-size: 60px;
    color: #333;
}

/*首頁banner區塊-表單群組區塊*/

#index-banner .input-group {
    background-color: #f9f6f7;
    overflow: hidden;
    border-radius: 99px;
}

/*首頁banner區塊-文字輸入框樣式*/

#index-banner .form-control {
    background-color: transparent;
    border: none;
}

/*首頁banner區塊-按鈕樣式*/

#index-banner .btn.btn-danger {
    background-color: #0784b2;
    border-color: #0784b2;
}

/*===============================================
               首頁各區塊主標題共通設定
=================================================*/



/*===============================================
                  首頁-三大特色區塊區塊
=================================================*/

/*首頁-三大特色區塊區塊-主區塊*/

#home-focus {
    background-color: #fff;
}

#home-focus:after {
	width: 100%;
	height: 50%;
	background-color: #0784b2;
	content: "";
	position: absolute;
	bottom: 0;
	background-repeat: no-repeat;
	background-image: url(../image/footer-bg.jpg);
}

#home-focus .container {
    max-width: 900px;
}

/*首頁-三大特色區塊區塊-列表區塊*/

#home-focus .feature-box {
    background-color: #fff;
    box-shadow: 0 -2px 30px rgb(0 0 0 / 15%);
}

/*首頁-三大特色區塊區塊-小標題樣式*/

#home-focus .feature-box h3 {
    font-size: 25px;
}

@media (max-width: 767px){

#home-focus {
    background-color: #0780ae;
}

}

/*===============================================
                首頁-功能與特色區塊
=================================================*/

/*首頁-功能與特色區塊-按鈕樣式*/

#home-feature .button {
    color: #0784b2;
    border-color: #0784b2;
}

#home-feature .button:hover {
    color: #fff;
    background-color: #0784b2;
}

/*===============================================
                首頁-關於我們區塊
=================================================*/

#home-about {
    background-position: top !important;
}

#home-about h2 {
    color: #fff;
}

#home-about p {
    color: #fff;
}

/*===============================================
                首頁-輔助資訊區塊
=================================================*/

#home-sub-introduction {
    background-position: top !important;
}

#home-sub-introduction:before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    display: block;
    content: "";
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 0;
}

#home-sub-introduction h2 {
    color: #fff;
}

/*首頁-輔助資訊區塊-按鈕樣式*/

#home-sub-introduction .button {
    color: #c4ff28;
    border-color: #c4ff28;
}

#home-sub-introduction .button:hover {
    color: #333;
    background-color: #c4ff28;
}

/*===============================================
                內頁-banner區塊
=================================================*/

/*內頁-banner區塊*/

#page-title:before {
    width: 100%;
    height: 100%;
    background-color: rgb(0 0 0 / 0.0);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
}

/*內頁-banner區塊-主標題樣式*/

#page-title.page-banner h2 {
    font-size: 50px;
    color: #fff !important;
}

#page-title.page-banner span {
    font-size: 20px;
    color: #fff !important;
}

/*===============================================
                內頁-子層選單區塊
=================================================*/

#page-menu {
    min-height: 48px;
}

/*===============================================
                內頁-主內容區塊
=================================================*/

#box-center-content {
    background-color: #fff;
}

/*===============================================
                內頁-價格方案頁面
=================================================*/

/*內頁-價格方案頁面-頁籤樣式*/

#program-page .nav-tabs .nav-link {
	color: #333;
    background-color: #a6ddf1;
}

#program-page .nav-tabs .nav-link h4 {
    color: #333;
	text-shadow: none;
}


#program-page .nav-tabs .nav-link.active {
    color: #0784b2;
    background-color: #fff;
}

#program-page .nav-tabs .nav-link.active h4 {
    color: #0784b2;
}

/*內頁-價格方案頁面-表格樣式*/

#program-page table {
    width: 1290px;
}

/*內頁-價格方案頁面-表格文字樣式*/

#program-page .heading-block h2 {
    font-size: 20px;
}

#program-page .heading-block span {
    font-size: 15px;
    color: #000;
    font-weight: normal;
}

#program-page .heading-block::after {
    border-color: #dfe5eb;
    margin-top: 15px;
}

#program-page .pricing-price {
    font-size: 2.5em;
}

/*內頁-價格方案頁面-資訊按鈕樣式*/

#program-page td .btn {
    color: #a5cb40;
    float: right;
}


#program-page #text-box, #program-page #faq-box {
    background-color: #f5f6fd;
}

/*===============================================
                  下方區塊
=================================================*/

#footer {
	color: #fff !important;
	background-color: #0784b2 !important;
	border-top: 0px solid rgba(0,0,0,0.2);
	background-image: url(../image/footer-bg.jpg);
	background-repeat: no-repeat;
}

#footer .footer-widgets-wrap {
    padding: 40px 0;
}

#footer a {
    color: #fff;
}

/*===============================================
                  下方logo區塊
=================================================*/

#footer-logo {
    font-size: 14px;
}

/*===============================================
                  下方主選單區塊
=================================================*/

/*下方主選單區塊-主區塊*/

#footer-memu {

}

/*下方主選單區塊-小標題樣式*/

#footer-menu h4 {
    color: #fff;
}

/*下方主選單區塊-連結文字樣式*/

#footer-memu a {
    color: #fff;
}

/*===============================================
                  下方資訊區塊
=================================================*/

/*下方資訊區塊-表單標題樣式*/

#footrt-information label {
    font-size: 15px;
    color: #fff;
}

/*下方資訊區塊-表單群組樣式*/

#footrt-information .input-group {
    overflow: hidden;
    border-radius: 99px;
}

#footrt-information .form-control {
    background-color: #fff;
}



/*===============================================
                  回最上方按鈕
=================================================*/

#gotoTop {

    border-radius: 99px;
}

#gotoTop:hover {

}