@charset "UTF-8";
@import url('main_content.css');
@import url('animate.css');
/*
主紫色色調：#921b88 副藍色色調：#5166b5
*/

body { font-family: Helvetica, Arial, 'LiHei Pro', '微軟正黑體', '新細明體', sans-serif; overflow-x: hidden; background: #fdfff2; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.accesskey { position: absolute; z-index: 999999999; margin-top: -12px; margin-left: -12px; }
.accesskey a { color: #FFF !important; }
#Header .accesskey { position: absolute; z-index: 999999; left: 0px; top: 0px; margin-top: 0px; margin-left: 0px; }
 @media (max-width: 767px) {
body { padding-top: 0px; overflow-x: hidden !important; }
}
div { /*            outline: 1px solid RED;*/ }
sup { font-size: 16px; font-weight: bold; line-height: 3px !important; margin: 0px; margin-top: 10px; padding: 0px; }
a { text-decoration: none; color: #333; }
a:hover { text-decoration: none; color: #F60; }
.navbar-header { height: 100px; }
@media (max-width: 768px) {
.navbar-header { height: 65px !important; }
}
@media (min-width: 768px) {
.container { width: 100%; max-width: 1100px !important; margin-left: auto; margin-right: auto; padding: 0px; }
}
.navbar { position: fixed; z-index: 99999999; left: 0px; top: 0px; width: 100%; /*box-shadow: 0px 0px 10px #000, 0px 0px 15px #000; */ border-radius: 0px !important; transition: .3s ease-out; }
 @media (max-width: 768px) {
.navbar { min-height: 56px !important; }
}
.Menu .navbar-nav > li > a { color: #333; }
.top-nav-collapse { top: -100px; }
@media (max-width: 768px) {
.top-nav-collapse { top: 0px; }
}
.navbar div { /*    outline: 1px solid blue;*/ }
.Logo { padding: 0px; position: absolute; left: 20px; top: -10px; height: auto; }
.Logo img { margin: 0px; padding: 0px; }
@media (max-width: 858px) {
.Logo::before { content: ""; display: none; }
}
/*search 搜尋設定*/
.Search { clear: both; }
.Search .navbar-form { padding: 0px 0px !important; margin: 5px 0px 0px; }
.Search .btn-default { color: #000; }
.Search .HotKeywords { float: right !important; clear: both; }
.Search .HotKeywords ul { padding: 0px; margin: 0px; display:inline;}
.Search .HotKeywords ul li { display: inline-block;}
.Search .HotKeywords ul li a { color: #F60; display: block; margin-right: 10px; padding: 0px; }
.Search .HotKeywords ul li a:hover, .Search .HotKeywords ul li a:focus { color: #006666; }
.Search .form-control { background: #FFF; box-shadow: none; outline: none; border-radius: 3px 0px 0px 3px; padding-left: 15px; transition: .3s ease-out; color: #222; box-shadow: 2px 2px px #bebebe inset; }
.Search .form-control:focus { box-shadow: none; outline: none; background: #4c4c4c; color: #FFF; }
.Search .btn-default { box-shadow: none; background: #e4e4e4; padding: 7px 18px; }
.Search .btn-default span { }
.gsc-search-box { width: 300px !important; float: right; overflow: hidden; padding-bottom: 3px; }
.gsc-input { font-size: 1em; color: #333; margin: 0px; padding: 0px; border-radius: 3px; height: 30px; }
.gsc-search-box > input.gsc-search-button { }
.btn-warning { border-radius: 5px; }
input.form-control, input[type=text]:hover, input[type=text]:focus, input[type=password]:hover, input[type=password]:focus, input[type=email]:hover, input[type=email]:focus, input[type=number]:hover, input[type=number]:focus, [type=text].form-control:hover, [type=text].form-control:focus, [type=password].form-control:hover, [type=password].form-control:focus, [type=email].form-control:hover, [type=email].form-control:focus, [type=tel].form-control:hover, [type=tel].form-control:focus, [contenteditable].form-control:hover, [contenteditable].form-control:focus, textarea.form-control:hover, textarea.form-control:focus { color: #333; background: #FFF; }
.cse input.gsc-search-button, input.gsc-search-button { color: #FFF !important; padding: 0 8px; height: 30px !important; min-width: 54px; border: 1px solid #DB5700; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; font: bold 13px inherit !important; background: #FF6600 !important; }
 @media (max-width: 767px) {
.Search .HotKeywords { color: #FFF;}
.Search .HotKeywords ul li a { color: #FF3; display: block; margin-right: 10px; padding: 0px; line-height: 2em; }
.Search .HotKeywords ul li a:hover { color: #FC3; }
.Search .form-control { background: #fff; }
.gsc-search-box { width: 100% !important; float: right; overflow: hidden; padding-bottom: 5px; }
}
.Language { clear: both; float: right; margin: 0px -10px 0px 0px; padding: 0px; }
.Language ul { padding: 0px; margin: 0px; }
.Language ul li { display: block; float: left; }
.Language ul li a { color: #002c3b; display: block; margin-right: 10px; padding: 0px; margin-left: 10px; }
.Language ul li a:hover, .Language ul li a:focus { color: #FF6600; }
@media (max-width: 767px) {
.Language ul { padding: 15px 0px 0px; margin: 0px; }
.Language ul li a { color: #FFF; }
.Language ul li a:hover, .Language ul li a:focus { color: #FFFF66; }
}

/*平板*/

@media screen and (min-width: 768px) {
.Logo { position: absolute; width: auto !important; margin: 0 auto !important; padding-top: 28px; }
.Logo img { width: 90%; }
}
 @media (max-width: 767px) {
.Logo { position: absolute; width: auto !important; margin: 0 auto !important; padding: 0px; left: 60px; top: 0px; }
.Logo img { margin: 0px auto 0px 0px; width: 80%; }
}


/*手機*/

@media (max-width: 480px) {
.Logo { position: absolute !important; width: auto; padding-top: 6px; }
.Logo img { margin: 0px auto 0px 0px; width: 75%; }
.navbar-nav { margin: 0px -15px !important; }
}
/*nav 導覽列設定*/

.navbar-default { background: #fdfff2; }
@media (max-width: 767px) {
.navbar-default { background: #fdfff2; }
}
.navbar-nav > li a { padding: 5px 8px; font-size: 13px; }
.navbar-nav > li a:hover { color: #FF6600 !important; }
 @media (max-width: 767px) {
.navbar-nav > li a { padding: 5px 8px; font-size: 13px; color: #FFF !important; background: #32989c; border-bottom: 1px dotted #eee; }
.navbar-nav > li a:hover { color: #FFF !important; background: #333333 !important; }
.megamenu .nav, .megamenu .collapse, .megamenu .dropup, .megamenu .dropdown { background: #32989c; padding-bottom: 10px; }
}
.navbar-nav > li a.taf_login { background: #921b88; padding: 5px 10px; color: #FFF; }
.navbar-nav > li a.taf_login:hover { color: #FFF; }
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus { background: none; color: #FF6600; box-shadow: none; }
.Menu ul>li a { font-size: 1.2em; line-height: 2em; }
/*dropdown-menu menu設定*/

.dropdown { }
.Menu .navbar-nav { background: #32989c; float: none; margin-right: -30px; margin-left: -30px; padding-left: 20px; margin-top: 0px; }
.Menu .navbar-nav > li a { padding: 6px 10px; font-weight: bold; color: #FFF; }
.Menu .navbar-nav > li a:hover { color: #FFFF33 !important; }
.Menu .navbar-nav > .open > a:focus { color: #333 !important; }
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus { background: #FFF url(../images/navbar-nav-open-ov.png) repeat-x left top; color: #333; }
.dropdown-menu { background: #222; background: RGBA(0, 0, 0, .8) !important; width: 200px; padding: 0px; /*控制menu寬度*/ }
.dropdown-submenu>.dropdown-menu { margin-top: 10px !important; }
.dropdown-menu > li > a { white-space: normal !important; line-height: 1.7em !important; border-bottom: 1px dotted #555; }
.dropdown-menu li li a { padding: 10px 20px; }
.dropdown-menu > li > a { color: #FFF; /*控制第二層選單顏色*/ }
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus { color: #FFF !important; background: #FF6600;    /*控制第二層選單hover顏色*/ }
.dropdown-menu { font-size: 13px !important; }
.dropdown-menu a, {
 background: none !important;
 color: #FFF !important;
}
.dropdown-menu a:hover, .dropdown-menu a:focus { background: #ca38be; color: #FFF; }
.dropdown-submenu { position: relative; }
.dropdown-submenu>.dropdown-menu { top: 0; left: 100%; margin-top: -6px; margin-left: -1px; -webkit-border-radius: 0 6px 6px 6px; -moz-border-radius: 0 6px 6px; border-radius: 0 6px 6px 6px; }
.dropdown-submenu:hover>.dropdown-menu { display: block; }
.dropdown-submenu>a:after { display: block; content: " "; float: right; width: 0; height: 0; border-color: transparent; border-style: solid; border-width: 5px 0 5px 5px; border-left-color: #ccc; margin-top: 8px; margin-right: -5px; }
.dropdown-submenu:hover>a:after { border-left-color: #fff; }
.dropdown-submenu.pull-left { float: none; }
.dropdown-submenu.pull-left>.dropdown-menu { left: -100%; margin-left: 10px; -webkit-border-radius: 6px 0 6px 6px; -moz-border-radius: 6px 0 6px 6px; border-radius: 6px 0 6px 6px; }
 @media (max-width: 767px) {
.Menu .navbar-nav { margin-right: -15px; margin-left: -15px; padding-left: 0px; margin-top: 0px; }
.Menu .navbar-nav > li a { padding: 6px 10px; font-weight: bold; color: #FFF; margin: 0px; }
.Menu .navbar-nav > .open > a:focus { color: #FF6 !important; }
.dropdown-submenu>.dropdown-menu { margin-top: 0px !important; background: #FFF; }
.dropdown-menu >ul { margin: 0px 0px 0px 20px; padding: 0px; }
.dropdown-menu >ul > li { margin: 0px; padding: 0px; }
.dropdown-menu > li > a { color: #333 !important; background: #fdfff2; }
.dropdown-menu > li > a:focus { color: #333; }
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus { color: #333 !important;  /*控制第二層選單hover顏色*/ }
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus { background: #333; color: #FFF; }
}
/**/

.mp_banner { padding: 0px; width: 100%; margin-top: 142px; position: relative; margin-bottom: 0px; }
.responsive_banner { position: relative; width: 100%; margin: 0px; padding: 0px; }
.responsive_banner h2 { position: absolute; left: 0px; z-index: 999; color: #FFF; line-height: 1.15em; text-align: left; text-shadow: 0px 0px 15px #000; bottom: 0px; width: 100%; padding: 15px 20px 10px; background: url(../images/responsive_banner_bg.png) repeat left top; margin: 0px; font-size: 2em; display: none; }/*暫隱藏h2*/
.responsive_banner h2 span { font-size: 0.8em; display: block; }
.responsive_banner .slick-slide img { display: block; width: 100%; margin: 0px; padding: 0px; }
 @media (max-width: 767px) {
.mp_banner { margin-top: 65px !important; }
.responsive_banner h2 { font-size: 1.4em; line-height: 1.25em; padding: 10px 10px 5px; position: relative; }
.responsive_banner { position: relative; width: 100%; }
.responsive_banner .slick-slide img { display: block; width: 100%; height: auto; }
.responsive_banner .slick-prev, .responsive_banner .slick-next { display: none !important; }
}
 @media (max-width: 480px) {
.responsive_banner .slick-slide img { height: 150px; }
}
 @media (max-width: 320px) {
.responsive_banner .slick-slide img { height: 130px; }
}
/*身分別identity*/
.identity { width: 100%; clear: both; padding: 40px 0px 80px; background: url(../imagesrwd/identity_bg.jpg) no-repeat left top; background-size: 100% auto; margin: -10px 0px 0px; }
.identity h2 { text-align: center; color: #444444; margin-bottom: 20px; position: relative; padding-bottom: 10px; font-size: 2.5em; letter-spacing: 0em; }
.identity h2 span { font-size: 0.8em; color: #7f2d00; margin-left: 0.5em; }
.identity p { margin: 0%; padding: 0px; }
.identity p img { width: 100%; height: 100%; }
.identity p.btn01 a { background: url(../imagesrwd/identity_01.png) no-repeat left top; background-size: 100% 100%; display: block; }
.identity p.btn01 a:hover, .identity p.btn01 a:focus { background: url(../imagesrwd/identity_01ov.png) no-repeat left top; background-size: 100% 100%; }
.identity p.btn02 a { background: url(../imagesrwd/identity_02.png) no-repeat left top; background-size: 100% 100%; display: block; }
.identity p.btn02 a:hover, .identity p.btn02 a:focus { background: url(../imagesrwd/identity_02ov.png) no-repeat left top; background-size: 100% 100%; }
.identity p.btn03 a { background: url(../imagesrwd/identity_03.png) no-repeat left top; background-size: 100% 100%; display: block; }
.identity p.btn03 a:hover, .identity p.btn03 a:focus { background: url(../imagesrwd/identity_03ov.png) no-repeat left top; background-size: 100% 100%; }
.identity p.btn04 a { background: url(../imagesrwd/identity_04.png) no-repeat left top; background-size: 100% 100%; display: block; }
.identity p.btn04 a:hover, .identity p.btn04 a:focus { background: url(../imagesrwd/identity_04ov.png) no-repeat left top; background-size: 100% 100%; }
.identity p.btn05 a { background: url(../imagesrwd/identity_05.png) no-repeat left top; background-size: 100% 100%; display: block; }
.identity p.btn05 a:hover, .identity p.btn05 a:focus { background: url(../imagesrwd/identity_05ov.png) no-repeat left top; background-size: 100% 100%; }
.identity p.btn06 a { background: url(../imagesrwd/identity_06.png) no-repeat left top; background-size: 100% 100%; display: block; }
.identity p.btn06 a:hover, .identity p.btn06 a:focus { background: url(../imagesrwd/identity_06ov.png) no-repeat left top; background-size: 100% 100%; }
 @media (max-width: 480px) {
.identity h2 { margin-top: 0px; }
.identity h2 span { margin-left: 0em; display: block; margin-top: 5px; }
}
/*service*/
.service { }
.service h2 { color: #516c70; position: relative; font-size: 1.8em; background: #ecf2cc; margin: 15px; padding: 8px 15px 6px; border-style: none; border-radius: 5px; line-height: 150%; }
.service .slick-slide { background: transparent; }
.service .slick-list { margin-right: 60px; margin-left: 60px; }
.service .slick-list img { width: 80%; margin-right: auto; margin-left: auto; clear: both; }
.service .slick-list span { width: 78%; margin-right: auto; margin-left: auto; clear: both; display: block; font-size: 1.25em; line-height: 130%; }
/* Arrows */
.service .slick-prev, .service .slick-next { top: 50%; width: 50px; height: 50px; margin-top: -40px; }
.service .slick-prev { left: 5px; }
.service .slick-next { right: 5px; }
/*cp slider*/
.cp-slider .slick-slide { background: transparent; }
.cp-slider .slick-list { margin-right: 60px; margin-left: 60px; }
.cp-slider .slick-list img { width: 90%; margin-right: auto; margin-left: auto; clear: both; }
.cp-slider .slick-list span { width: 88%; margin-right: auto; margin-left: auto; clear: both; display: block; font-size: 1.25em; line-height: 130%; }
/* Arrows */
.cp-slider .slick-prev, .cp-slider .slick-next { top: 50%; width: 50px; height: 50px; margin-top: -30px; }
.cp-slider .slick-prev { left: 5px; }
.cp-slider .slick-next { right: 5px; }
/*--emphasis--*/

.emphasis { }
.emphasis .container { border-bottom: 1px solid #CCC; padding-bottom: 30px; }
.emphasis h2 { color: #516c70; position: relative; font-size: 1.8em; background: #ecf2cc; margin: 15px 15px 20px; padding: 8px 15px 6px; border-style: none; border-radius: 5px; line-height: 150%; text-align: left; }
.emphasis div { text-align: center; }
.emphasis img { width: 96%; margin: 4% 2%; }
.theme { }
.theme .container { border-bottom: 1px solid #CCC; padding-bottom: 30px; }
.theme h2 { color: #516c70; position: relative; font-size: 1.8em; background: #ecf2cc; margin: 15px 15px 20px; padding: 8px 15px 6px; border-style: none; border-radius: 5px; line-height: 150%; text-align: left; }
.theme h3 { text-align: center; font-size: 1.5em; margin: 0px; padding: 0px; }
.theme img { width: 92%; margin: 4% 4%; }
.theme ul { margin: 0px 15px; padding: 0px; }
.theme ul li { margin: 0px 0px 10px; padding: 0px; list-style: none; width: 20%; display: inline-block; float: left; }
 @media (max-width: 767px) {
.theme ul li { width: 33%; ; }
}
 @media (max-width: 480px) {
.theme ul li { width: 50%; ; }
}
/*link1*/
.link1 { padding: 40px 0px; }
.link1 .slick-slide { background: transparent; }
.link1 .slick-list { margin-right: 35px; margin-left: 35px; }
.link1 .slick-list img { width: 92%; margin-right: auto; margin-left: auto; clear: both; height: 80px; }
/* Arrows */
.link1 .slick-prev, .link1 .slick-next { top: 50%; width: 30px; height: 30px; margin-top: -10px; background-size: 100% }
.link1 .slick-prev { left: 0px; }
.link1 .slick-next { right: 0px; }
.link1 .glyphicon-chevron-right { color: #FFF; background: #ff9900; font-size: 0.75em; line-height: normal; padding: 2px 7px 2px 10px; border-radius: 3px; margin-bottom: 20px; margin-top: 10px; }
.link1 .glyphicon-chevron-right:hover { background: #ac8724; }
/*link2*/
.link2 { padding: 10px 0px; clear: both; width: 190px; position: absolute; top: 45px; right: 0px; }
.link2 div { width: 98%; margin: 2% 1%; }
.link2 div img { width: 100%; }
/*fat footer Start*/

#FatFooter { background: #f0eee7; overflow: hidden; padding-bottom: 30px; clear: both; }
#FatFooter .container { position: relative; min-height: 250px; }
#FatFooter nav { background: none; }
/*footer*/
#footer { background: #32989c !important; color: #FFF; padding: 20px; position: relative; }
#footer .copyright { border-bottom: 1px solid #cccccc; padding-top: 5px; padding-bottom: 5px; }
#footer a { color: #9F9; }
#footer a:hover { color: #FF3; }
#footer { background: #32989c !important; overflow: hidden; color: #FFF; padding: 20px; }
#footer p { margin: 5px 0px; line-height: 160%; }
#footer .qrcode { position: absolute; top: 70px; right: 200px; }
#footer .qrcode ul { margin: 0px; padding: 0px; }
#footer .qrcode ul li { margin: 0px 3px; padding: 0px; display: inline; }
#footer .qrcode ul li img { vertical-align: top; height: 67px; width: 67px; }
#footer .egov { position: absolute; top: 70px; right: 30px; }
#footer .egov ul { margin: 0px; padding: 0px; }
#footer .egov ul li { margin: 0px 3px; padding: 0px; display: inline; }
#footer .egov ul li img { vertical-align: top; }
#footer .visitor { position: absolute; top: 5px; right: 30px; }
#footer .update { position: absolute; top: 5px; right: 200px; }
#footer .visitor em, #footer .update em { font-style: normal; }
 @media (max-width: 960px) {
#footer .qrcode, #footer .egov { display: none; }
}
.rlink { margin: 40px 10px 10px; display: block; clear: both; }
.rlink ul { margin: 0px; padding: 0px; list-style: none; }
.rlink ul > li { margin: 8px !important; padding: 0px; list-style: none; }
.rlink ul > li img { width: 100%; }