.rd-navbar-wrap, .rd-navbar, .rd-navbar-dropdown, .rd-navbar-megamenu, .rd-navbar-nav, .rd-navbar-panel, .rd-navbar-static .rd-navbar-dropdown, .rd-navbar-static .rd-navbar-megamenu, .rd-navbar-fullwidth .rd-navbar-dropdown, .rd-navbar-fullwidth .rd-navbar-megamenu, .rd-navbar-fixed .rd-navbar-nav-wrap, .rd-navbar-fixed .rd-navbar-submenu, .rd-navbar-sidebar .rd-navbar-sidebar-toggle, .rd-navbar-sidebar .rd-navbar-sidebar-inner, .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-submenu { transition: .35s all ease-out; list-style: none; margin: 0; padding: 0; } .rd-navbar, .rd-navbar.rd-navbar--is-clone { display: none } .rd-navbar-fixed, .rd-navbar-static, .rd-navbar-fullwidth, .rd-navbar-sidebar { display: block } .rd-navbar--no-transition, .rd-navbar--no-transition * { transition: none !important } .rd-navbar-wrap { position: absolute; top: 0; left: 0; right: 0; z-index: 9999; } .rd-navbar-collapse-toggle { position: relative; width: 48px; height: 48px; line-height: 48px; cursor: pointer; color: #fff; display: none } .rd-navbar-collapse-toggle span { top: 50%; margin-top: -3px } .rd-navbar-collapse-toggle span, .rd-navbar-collapse-toggle span:before, .rd-navbar-collapse-toggle span:after { position: absolute; width: 6px; height: 6px; line-height: 6px; text-align: center; background: #000; left: 50%; margin-left: -3px; border-radius: 50%; transition: .3s all ease } .rd-navbar-collapse-toggle span:before, .rd-navbar-collapse-toggle span:after { content: '' } .rd-navbar-collapse-toggle span:before { bottom: 100%; margin-bottom: 3px } .rd-navbar-collapse-toggle span:after { top: 100%; margin-top: 3px } .rd-navbar-collapse-toggle.active span { transform: scale(.7) } .rd-navbar-collapse-toggle.active span:before { transform: translateY(18px) } .rd-navbar-collapse-toggle.active span:after { transform: translateY(-18px) } .rd-navbar--is-stuck { box-shadow: 0 0 22px -4px rgba(0, 0, 0, .17) } .rd-navbar.rd-navbar-fixed + .rd-navbar.rd-navbar--is-clone, .rd-navbar.rd-navbar-sidebar + .rd-navbar.rd-navbar--is-clone { display: none } .rd-navbar { display: none } .rd-navbar-toggle, .rd-navbar-sidebar-toggle { position: relative; width: 48px; height: 48px; line-height: 48px; cursor: pointer; color: #fff; background-color: transparent; border: none; display: none } .rd-navbar-toggle span, .rd-navbar-sidebar-toggle span { position: relative; display: block; margin: auto; transition: .3s all ease } .rd-navbar-toggle span:after, .rd-navbar-toggle span:before, .rd-navbar-sidebar-toggle span:after, .rd-navbar-sidebar-toggle span:before { content: ""; position: absolute; left: 0; top: -8px; transition: .3s all ease } .rd-navbar-toggle span:after, .rd-navbar-sidebar-toggle span:after { top: 8px } .rd-navbar-toggle span:after, .rd-navbar-toggle span:before, .rd-navbar-toggle span, .rd-navbar-sidebar-toggle span:after, .rd-navbar-sidebar-toggle span:before, .rd-navbar-sidebar-toggle span { width: 24px; height: 4px; background-color: #000; backface-visibility: hidden; border-radius: 2px } .rd-navbar-toggle span, .rd-navbar-sidebar-toggle span { transform: rotate(180deg) } .rd-navbar-toggle span:before, .rd-navbar-toggle span:after, .rd-navbar-sidebar-toggle span:before, .rd-navbar-sidebar-toggle span:after { transform-origin: 1.71429px center } .rd-navbar-toggle.active span, .rd-navbar-sidebar-toggle.active span { transform: rotate(360deg) } .rd-navbar-toggle.active span:before, .rd-navbar-toggle.active span:after, .rd-navbar-sidebar-toggle.active span:before, .rd-navbar-sidebar-toggle.active span:after { top: 0; width: 15px } .rd-navbar-toggle.active span:before, .rd-navbar-sidebar-toggle.active span:before { -webkit-transform: rotate3d(0, 0, 1, -40deg); transform: rotate3d(0, 0, 1, -40deg) } .rd-navbar-toggle.active span:after, .rd-navbar-sidebar-toggle.active span:after { -webkit-transform: rotate3d(0, 0, 1, 40deg); transform: rotate3d(0, 0, 1, 40deg) } .rd-navbar-toggle:focus, .rd-navbar-sidebar-toggle:focus { outline: none } .rd-navbar-brand a { display: inline-block } .rd-navbar-dropdown { display: none } .rd-navbar-static .rd-navbar-nav > li, .rd-navbar-fullwidth .rd-navbar-nav > li { display: inline-block; transition: .25s } .rd-navbar-static .rd-navbar-nav > li > a, .rd-navbar-fullwidth .rd-navbar-nav > li > a { position: relative; display: inline-block; color: #000; /* 選單顏色 */ /* font-size: 12px;*/ font-weight: 400; text-transform: uppercase; transition: .25s } .rd-navbar-static .rd-navbar-nav > li > a:hover, .rd-navbar-fullwidth .rd-navbar-nav > li > a:hover { color: #222b42; } .rd-navbar-static .rd-navbar-nav > li > .rd-navbar-submenu-toggle, .rd-navbar-fullwidth .rd-navbar-nav > li > .rd-navbar-submenu-toggle { margin-left: 4px; font-family: 'Font Awesome 5 free'; font-weight: 900; font-size: 0.8rem; cursor: pointer; color: #fff; } .rd-navbar-static .rd-navbar-nav > li > .rd-navbar-submenu-toggle:hover, .rd-navbar-fullwidth .rd-navbar-nav > li > .rd-navbar-submenu-toggle:hover { color: #222b42; } .rd-navbar-static .rd-navbar-nav > li > .rd-navbar-submenu-toggle:before, .rd-navbar-fullwidth .rd-navbar-nav > li > .rd-navbar-submenu-toggle:before { content: '\f236'; } .rd-navbar-static .rd-navbar-nav > li.focus > a, .rd-navbar-static .rd-navbar-nav > li.opened > a, .rd-navbar-fullwidth .rd-navbar-nav > li.focus > a, .rd-navbar-fullwidth .rd-navbar-nav > li.opened > a { color: #222b42; background: 0 0; } .rd-navbar-static .rd-navbar-nav > li.focus > .rd-navbar-submenu-toggle, .rd-navbar-static .rd-navbar-nav > li.opened > .rd-navbar-submenu-toggle, .rd-navbar-fullwidth .rd-navbar-nav > li.focus > .rd-navbar-submenu-toggle, .rd-navbar-fullwidth .rd-navbar-nav > li.opened > .rd-navbar-submenu-toggle { color: #222b42; } .rd-navbar-static .rd-navbar-nav > li.active > a, .rd-navbar-fullwidth .rd-navbar-nav > li.active > a { color: #222b42; background: 0 0; } .rd-navbar-static .rd-navbar-nav > li.active > .rd-navbar-submenu-toggle, .rd-navbar-fullwidth .rd-navbar-nav > li.active > .rd-navbar-submenu-toggle { color: #222b42; } .rd-navbar-static .rd-navbar-inner, .rd-navbar-fullwidth .rd-navbar-inner { position: relative; transition: .35s ease-in-out; max-width: 1800px; padding-left: 15px; padding-right: 15px; margin-left: auto; margin-right: auto } .rd-navbar-static .rd-navbar-nav > li > .rd-navbar-dropdown, .rd-navbar-fullwidth .rd-navbar-nav > li > .rd-navbar-dropdown { /* 電腦版下拉第一層選單設定 */ position: absolute; left: 0; width: 210px; background: #fff; z-index: 5; } .rd-navbar-static .rd-navbar-nav li.focus > .rd-navbar-dropdown, .rd-navbar-static .rd-navbar-nav li.focus > .rd-navbar-megamenu, .rd-navbar-static .rd-navbar-nav li.opened > .rd-navbar-dropdown, .rd-navbar-static .rd-navbar-nav li.opened > .rd-navbar-megamenu, .rd-navbar-fullwidth .rd-navbar-nav li.focus > .rd-navbar-dropdown, .rd-navbar-fullwidth .rd-navbar-nav li.focus > .rd-navbar-megamenu, .rd-navbar-fullwidth .rd-navbar-nav li.opened > .rd-navbar-dropdown, .rd-navbar-fullwidth .rd-navbar-nav li.opened > .rd-navbar-megamenu { opacity: 1; visibility: visible; transform: translateY(0) } .rd-navbar-static .rd-navbar-nav > li > .rd-navbar-dropdown, .rd-navbar-static .rd-navbar-nav > li > .rd-navbar-megamenu, .rd-navbar-fullwidth .rd-navbar-nav > li > .rd-navbar-dropdown, .rd-navbar-fullwidth .rd-navbar-nav > li > .rd-navbar-megamenu { z-index: 15 } .rd-navbar-static .rd-navbar-nav > li > .rd-navbar-dropdown .rd-navbar-dropdown, .rd-navbar-fullwidth .rd-navbar-nav > li > .rd-navbar-dropdown .rd-navbar-dropdown { left: 100%; top: 0; margin-top: -8px; margin-left: 8px; z-index: 2; transform: translate(30px, 0); } .rd-navbar-static .rd-navbar-nav > li > .rd-navbar-dropdown > li.focus > .rd-navbar-dropdown, .rd-navbar-static .rd-navbar-nav > li > .rd-navbar-dropdown > li.opened > .rd-navbar-dropdown, .rd-navbar-fullwidth .rd-navbar-nav > li > .rd-navbar-dropdown > li.focus > .rd-navbar-dropdown, .rd-navbar-fullwidth .rd-navbar-nav > li > .rd-navbar-dropdown > li.opened > .rd-navbar-dropdown { opacity: 1; visibility: visible; transform: translate(0, 0) } .rd-navbar-static .rd-navbar-dropdown, .rd-navbar-static .rd-navbar-megamenu, .rd-navbar-fullwidth .rd-navbar-dropdown, .rd-navbar-fullwidth .rd-navbar-megamenu { position: absolute; display: block; padding: 8px 0; margin-top: 30px; transform: translateY(30px); visibility: hidden; opacity: 0; text-align: left; box-shadow: 0 0 22px -4px rgba(0, 0, 0, .17) } .rd-navbar-static .rd-navbar-dropdown li > a, .rd-navbar-static .rd-navbar-megamenu li > a, .rd-navbar-fullwidth .rd-navbar-dropdown li > a, .rd-navbar-fullwidth .rd-navbar-megamenu li > a { transition: .15s ease-in-out } .rd-navbar-static .rd-navbar-dropdown li > a:before, .rd-navbar-static .rd-navbar-megamenu li > a:before, .rd-navbar-fullwidth .rd-navbar-dropdown li > a:before, .rd-navbar-fullwidth .rd-navbar-megamenu li > a:before { content: '\f054'; font-family: 'Font Awesome 5 free'; font-weight: 900; margin-left: -10px; margin-right: 6px; transition: opacity .15s ease-in-out, .15s margin ease-in-out; opacity: 0; font-size: 0.8rem; } .rd-navbar-static .rd-navbar-dropdown li.focus > a:before, .rd-navbar-static .rd-navbar-dropdown li.opened > a:before, .rd-navbar-static .rd-navbar-dropdown li > a:hover:before, .rd-navbar-static .rd-navbar-megamenu li.focus > a:before, .rd-navbar-static .rd-navbar-megamenu li.opened > a:before, .rd-navbar-static .rd-navbar-megamenu li > a:hover:before, .rd-navbar-fullwidth .rd-navbar-dropdown li.focus > a:before, .rd-navbar-fullwidth .rd-navbar-dropdown li.opened > a:before, .rd-navbar-fullwidth .rd-navbar-dropdown li > a:hover:before, .rd-navbar-fullwidth .rd-navbar-megamenu li.focus > a:before, .rd-navbar-fullwidth .rd-navbar-megamenu li.opened > a:before, .rd-navbar-fullwidth .rd-navbar-megamenu li > a:hover:before { margin-left: 0; opacity: 1 } .rd-navbar-static .rd-navbar-dropdown, .rd-navbar-fullwidth .rd-navbar-dropdown { /* 電腦版下拉第二層選單設定 */ width: 200px; background: #fff } .rd-navbar-static .rd-navbar-dropdown > li > a, .rd-navbar-fullwidth .rd-navbar-dropdown > li > a { display: block; padding: 4px 20px; color: #333; background: 0 0; font-size: 0.9rem; /* border-bottom: 1px dashed #ededed;*/ } .rd-navbar-static .rd-navbar-dropdown > li > a:hover, .rd-navbar-fullwidth .rd-navbar-dropdown > li > a:hover { color: #fff; background: #55b2cc } .rd-navbar-static .rd-navbar-dropdown > li.focus > a, .rd-navbar-static .rd-navbar-dropdown > li.opened > a, .rd-navbar-fullwidth .rd-navbar-dropdown > li.focus > a, .rd-navbar-fullwidth .rd-navbar-dropdown > li.opened > a { color: #fff; background: #55b2cc } .rd-navbar-static .rd-navbar-megamenu, .rd-navbar-fullwidth .rd-navbar-megamenu { left: 10px; display: flex; width: 98%; max-width: 1800px; padding: 30px 40px; background: #fff } .rd-navbar-static .rd-navbar-megamenu > li, .rd-navbar-fullwidth .rd-navbar-megamenu > li { width: 25% } .rd-navbar-static .rd-navbar-megamenu > li > ul li + li, .rd-navbar-fullwidth .rd-navbar-megamenu > li > ul li + li { margin-top: 5px } .rd-navbar-static .rd-navbar-megamenu > li > ul a, .rd-navbar-fullwidth .rd-navbar-megamenu > li > ul a { display: inline-block; color: #333; background: 0 0 } .rd-navbar-static .rd-navbar-megamenu > li > ul a:hover, .rd-navbar-fullwidth .rd-navbar-megamenu > li > ul a:hover { color: #ab8c6b; background: 0 0 } .rd-navbar-static .rd-navbar-megamenu > li + li, .rd-navbar-fullwidth .rd-navbar-megamenu > li + li { padding-left: 20px } .rd-navbar-static.rd-navbar--is-clone, .rd-navbar-fullwidth.rd-navbar--is-clone { display: block; transform: translateY(-100%) } .rd-navbar-static.rd-navbar--is-clone.rd-navbar--is-stuck, .rd-navbar-fullwidth.rd-navbar--is-clone.rd-navbar--is-stuck { transform: translateY(0%) } .rd-navbar-static.rd-navbar--is-stuck, .rd-navbar-static.rd-navbar--is-clone, .rd-navbar-fullwidth.rd-navbar--is-stuck, .rd-navbar-fullwidth.rd-navbar--is-clone { position: fixed; left: 0; top: 0; right: 0; z-index: 999; background: #fff; } .rd-navbar-static.rd-navbar--is-stuck .rd-navbar-top-panel, .rd-navbar-static.rd-navbar--is-clone .rd-navbar-top-panel, .rd-navbar-fullwidth.rd-navbar--is-stuck .rd-navbar-top-panel, .rd-navbar-fullwidth.rd-navbar--is-clone .rd-navbar-top-panel { display: none } .rd-navbar-static .rd-navbar--has-dropdown, .rd-navbar-fullwidth .rd-navbar--has-dropdown { position: relative } .rd-navbar-fixed .rd-navbar-nav-wrap, .rd-navbar-sidebar .rd-navbar-sidebar-inner { width: 240px; height: 100%; left: 0; top: 0; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; font-size: 16px; line-height: 34px; color: #fff; background: #333; box-shadow: 0 0 12px 1px rgba(0, 0, 0, .25); z-index: 998 } .rd-navbar-fixed .rd-navbar-nav-wrap:before, .rd-navbar-fixed .rd-navbar-nav-wrap:after, .rd-navbar-sidebar .rd-navbar-sidebar-inner:before, .rd-navbar-sidebar .rd-navbar-sidebar-inner:after { content: ''; display: block; height: 56px } .rd-navbar-fixed .rd-navbar-nav-wrap::-webkit-scrollbar, .rd-navbar-sidebar .rd-navbar-sidebar-inner::-webkit-scrollbar { width: 4px } .rd-navbar-fixed .rd-navbar-nav-wrap::-webkit-scrollbar-thumb, .rd-navbar-sidebar .rd-navbar-sidebar-inner::-webkit-scrollbar-thumb { background: #fff; border: none; border-radius: 0; opacity: .2 } .rd-navbar-fixed .rd-navbar-nav-wrap::-webkit-scrollbar-track, .rd-navbar-sidebar .rd-navbar-sidebar-inner::-webkit-scrollbar-track { background: #ab8c6b; border: none; border-radius: 0 } .rd-navbar-fixed .rd-navbar-nav .rd-navbar-dropdown > li > a, .rd-navbar-sidebar .rd-navbar-nav .rd-navbar-dropdown > li > a { padding-left: 20px } .rd-navbar-fixed .rd-navbar-nav .rd-navbar-dropdown ul > li > a, .rd-navbar-sidebar .rd-navbar-nav .rd-navbar-dropdown ul > li > a { padding-left: 25px } .rd-navbar-static { display: block } .rd-navbar-static .rd-navbar-inner { display: flex; align-items: center; justify-content: space-between; padding-top: 40px; padding-bottom: 20px } .rd-navbar-static .rd-navbar-aside-right { display: flex } .rd-navbar-static .rd-navbar-top-panel { text-align: left } .rd-navbar-static .rd-navbar-nav > li + li { margin-left: 14px } .rd-navbar-static.rd-navbar--is-stuck .rd-navbar-inner, .rd-navbar-static.rd-navbar--is-clone .rd-navbar-inner { padding-top: 10px; padding-bottom: 10px } .rd-navbar-fullwidth { display: block } .rd-navbar-fullwidth .rd-navbar-inner { padding-top: 20px; padding-bottom: 20px } .rd-navbar-fullwidth .rd-navbar-button { display: none } .rd-navbar-fullwidth .rd-navbar-aside-right { display: flex; align-items: center; justify-content: center; margin-top: 20px; margin-bottom: 20px } .rd-navbar-fullwidth .rd-navbar-nav > li + li { margin-left: 20px } .rd-navbar-fullwidth.rd-navbar--is-stuck .rd-navbar-inner, .rd-navbar-fullwidth.rd-navbar--is-clone .rd-navbar-inner { padding-top: 10px; padding-bottom: 10px } .rd-navbar-fullwidth.rd-navbar--is-stuck .rd-navbar-aside-right, .rd-navbar-fullwidth.rd-navbar--is-clone .rd-navbar-aside-right { margin-top: 0; margin-bottom: 0 } .rd-navbar-fullwidth.rd-navbar--is-stuck .rd-navbar-panel, .rd-navbar-fullwidth.rd-navbar--is-stuck .rd-navbar-button, .rd-navbar-fullwidth.rd-navbar--is-clone .rd-navbar-panel, .rd-navbar-fullwidth.rd-navbar--is-clone .rd-navbar-button { display: none } .rd-navbar-fixed { display: block } .rd-navbar-fixed .rd-navbar-toggle { display: inline-block } .rd-navbar-fixed .rd-navbar-button { position: fixed; top: 7px; right: 4px; z-index: 999; display: none } @media(min-width:400px) { .rd-navbar-fixed .rd-navbar-button { display: block } } .rd-navbar-fixed .rd-navbar-button .button { padding: 12px 29px 9px } .rd-navbar-fixed .rd-navbar-brand { position: relative; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: left; font-size: 22px; top: -44px; left: 50px; } @supports (-webkit-touch-callout: none) { .rd-navbar-fixed .rd-navbar-brand { top: -40px; } } .rd-navbar-fixed .rd-navbar-brand img { max-height: 40px; } .rd-navbar-fixed .rd-navbar-panel { display: flex; align-items: center; position: fixed; left: 0; top: 0; right: 0; padding: 4px; height: 56px; color: #fff; z-index: 999 } .rd-navbar-fixed .rd-navbar-panel:before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; right: 0; box-shadow: 0 0 12px 1px rgba(0, 0, 0, .25); background: #fff; } .rd-navbar-fixed .rd-navbar-panel > * { z-index: 1 } .rd-navbar-fixed .rd-navbar-search { position: fixed; right: 46px; top: 4px; display: inline-flex; z-index: 1000 } .rd-navbar-fixed .rd-navbar-search .rd-search { position: absolute; right: 4px; top: calc(100% + 12px); width: 240px; opacity: 0; visibility: hidden; transition: .3s; transform: translateX(-10px) } .rd-navbar-fixed .rd-navbar-search .rd-search-results-live { display: none } .rd-navbar-fixed .rd-navbar-search .form-input { padding-right: 50px } .rd-navbar-fixed .rd-navbar-search .rd-search-form-submit { position: absolute; top: 0; bottom: 0; right: 0; width: 50px; padding: 0; border: none; background-color: transparent; color: #000 } .rd-navbar-fixed .rd-navbar-search .rd-search-form-submit:hover { color: #ab8c6b } .rd-navbar-fixed .rd-navbar-search.active .rd-search { opacity: 1; visibility: visible; transform: none } .rd-navbar-fixed .rd-navbar-search-toggle { display: inline-flex; color: #fff } .rd-navbar-fixed .rd-navbar-search-toggle:hover { color: #ab8c6b } .rd-navbar-fixed .rd-navbar-search-toggle span { display: inline-block; position: relative; width: 48px; height: 48px; font-size: 26px; line-height: 48px; text-align: center; cursor: pointer; background: 0 0; border: none; outline: none; padding: 0 } .rd-navbar-fixed .rd-navbar-search-toggle span, .rd-navbar-fixed .rd-navbar-search-toggle span:before, .rd-navbar-fixed .rd-navbar-search-toggle span:after { transition: .3s all ease-in-out } .rd-navbar-fixed .rd-navbar-search-toggle span:before, .rd-navbar-fixed .rd-navbar-search-toggle span:after { position: absolute; top: 0; left: 0; right: 0; bottom: 0 } .rd-navbar-fixed .rd-navbar-search-toggle span:before { content: "\f002"; transform: rotate(0deg) scale(1); opacity: 1; visibility: visible; font-family: 'Font Awesome 5 free'; font-weight: 900; } .rd-navbar-fixed .rd-navbar-search-toggle span:after { content: "\f002"; transform: rotate(-90deg) scale(.4); opacity: 0; visibility: hidden; font-family: 'Font Awesome 5 free'; font-weight: 900; } .rd-navbar-fixed .rd-navbar-search-toggle.active span:before { opacity: 0; visibility: hidden; transform: rotate(90deg) scale(.4) } .rd-navbar-fixed .rd-navbar-search-toggle.active span:after { transform: rotate(0deg) scale(1); opacity: 1; visibility: visible } .rd-navbar-fixed .rd-navbar-nav-wrap { position: fixed; left: 0; bottom: 0; top: 0; color: #111; background: #fff; transform: translateX(-120%); padding-bottom: 40px; } .rd-navbar-fixed .rd-navbar-nav-wrap.active { transform: translateX(0) } .rd-navbar-fixed .rd-navbar-nav { display: block; font-size: 16px; line-height: 26px; text-align: left } .rd-navbar-fixed .rd-navbar-nav:before, .rd-navbar-fixed .rd-navbar-nav:after { content: ''; display: block; height: 8px } .rd-navbar-fixed .rd-navbar-nav li > a { /* 手機版下拉第一層選單設定 */ display: block; /* padding: 11px 56px 11px 16px;*/ padding: 8px 56px 8px 16px; color: #111; font-weight: bold; border-bottom: 1px solid #ededed; } .rd-navbar-fixed .rd-navbar-nav li > a:first-letter { text-transform: uppercase } .rd-navbar-fixed .rd-navbar-nav li:hover > a, .rd-navbar-fixed .rd-navbar-nav li.active > a, .rd-navbar-fixed .rd-navbar-nav li.opened > a { background: #55b2cc; color: #fff } .rd-navbar-fixed .rd-navbar-nav li:hover > .rd-navbar-submenu-toggle, .rd-navbar-fixed .rd-navbar-nav li.active > .rd-navbar-submenu-toggle, .rd-navbar-fixed .rd-navbar-nav li.opened > .rd-navbar-submenu-toggle { color: #fff } .rd-navbar-fixed .rd-navbar-nav li.opened > .rd-navbar-submenu-toggle:after { transform: rotate(180deg) } .rd-navbar-fixed .rd-navbar-nav li + li { margin-top: 4px } .rd-navbar-fixed .rd-navbar-nav .rd-navbar-submenu-toggle { position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 1; width: 100%; height: 42px; cursor: pointer; color: #000 } .rd-navbar-fixed .rd-navbar-nav .rd-navbar-submenu-toggle::after { /* 手機版下拉第一層右側小圖示 */ content: '\f078'; position: absolute; top: 18px; right: 0; margin-top: -18px; width: 65px; height: 42px; font-family: 'Font Awesome 5 free'; font-weight: 900; line-height: 42px; text-align: center; transition: .3s transform ease; z-index: 2 } .rd-navbar-fixed .rd-navbar-dropdown, .rd-navbar-fixed .rd-navbar-megamenu { /* 手機版下拉第二層框架設定 */ display: none; margin-top: 0; background-color: #e5f1f5; font-size: 0.9rem; } .rd-navbar-fixed .rd-navbar-dropdown .rd-navbar-submenu-toggle::after { /* 手機版下拉第二層右側小圖示 */ top: 16px; } .rd-navbar-fixed .rd-navbar-submenu { position: relative; } .rd-navbar-fixed .rd-navbar-submenu .rd-navbar-dropdown > li > a { /* 下拉第二層選單設定*/ padding-left: 32px; padding-top: 5px; padding-bottom: 5px; font-weight: normal; } .rd-navbar-fixed .rd-navbar-submenu .rd-navbar-dropdown li li > a, .rd-navbar-fixed .rd-navbar-submenu .rd-navbar-megamenu ul li li > a { /* 下拉第三層選單的間距 */ padding-left: 48px; } .rd-navbar-fixed .rd-navbar-submenu.opened > .rd-navbar-dropdown, .rd-navbar-fixed .rd-navbar-submenu.opened > .rd-navbar-megamenu { display: block } .rd-navbar-fixed .rd-navbar-collapse { position: fixed; right: 4px; top: 64px; transform: translateX(-10px); padding: 5px 10px; width: 160px; border-radius: 3px; background-color: #333; box-shadow: 0 0 22px -4px rgba(0, 0, 0, .17); text-align: left; font-size: 14px; opacity: 0; visibility: hidden; z-index: 999; transition: .3s } .rd-navbar-fixed .rd-navbar-collapse.active { transform: none; opacity: 1; visibility: visible } .rd-navbar-fixed .rd-navbar-collapse-toggle { position: fixed; right: 4px; top: 4px; display: inline-block; z-index: 1000 } .rd-navbar-fixed .rd-navbar-collapse, .rd-navbar-fixed .rd-navbar-collapse a { color: #fff } .rd-navbar-fixed .rd-navbar-collapse a:hover { text-decoration: underline } .rd-navbar-fixed.active .rd-navbar-nav { transform: translateX(0) } .rd-navbar-fixed.rd-navbar--is-clone { display: none } .rd-navbar-fixed .rd-navbar-fixed--visible { display: block } .rd-navbar-fixed .rd-navbar-fixed--hidden { display: none } html.rd-navbar-fixed-linked .page { padding-top: 55px } .rd-navbar-sidebar { display: block } .rd-navbar-sidebar .rd-navbar-sidebar-toggle { position: fixed; top: 8px; left: 8px; display: block; z-index: 999 } .rd-navbar-sidebar .rd-navbar-sidebar-inner { position: fixed; display: flex; flex-direction: column; padding-top: 40px; padding-bottom: 40px; transform: translateX(-100%); box-shadow: none } .rd-navbar-sidebar .rd-navbar-sidebar-inner.active { transform: translateX(0); box-shadow: 0 0 12px 1px rgba(0, 0, 0, .25) } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-top-panel { order: 1; padding: 0 20px; text-align: left } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-brand { margin-bottom: 30px } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-search { display: inline-flex; margin-top: 10px; padding: 0 10px } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-search .rd-search { position: relative } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-search .form-input { padding-right: 50px } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-search .rd-search-form-submit { position: absolute; top: 0; bottom: 0; right: 0; width: 50px; padding: 0; border: none; background-color: transparent; color: #000 } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-search .rd-search-form-submit:hover { color: #ab8c6b } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-search .rd-search-results-live { display: none } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav { display: block; font-size: 16px; line-height: 26px; text-align: left } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav:before, .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav:after { content: ''; display: block; height: 8px } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav li > a { display: block; padding: 11px 56px 11px 16px; color: #fff } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav li > a:first-letter { text-transform: uppercase } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav li:hover > a, .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav li.active > a, .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav li.opened > a { background: #ab8c6b; color: #fff } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav li:hover > .rd-navbar-submenu-toggle, .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav li.active > .rd-navbar-submenu-toggle, .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav li.opened > .rd-navbar-submenu-toggle { color: #fff } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav li.opened > .rd-navbar-submenu-toggle:after { transform: rotate(180deg) } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav li + li { margin-top: 4px } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav .rd-navbar-submenu-toggle { cursor: pointer; color: #fff } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-nav .rd-navbar-submenu-toggle::after { content: '\f236'; position: absolute; top: 22px; right: 0; margin-top: -22px; width: 65px; height: 48px; font: 400 28px Material Design Icons; line-height: 48px; text-align: center; transition: .3s transform ease; z-index: 2 } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-dropdown, .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-megamenu { display: none; margin-top: 4px } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-submenu { position: relative } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-submenu .rd-navbar-dropdown > li > a { padding-left: 30px } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-submenu .rd-navbar-dropdown li li > a, .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-submenu .rd-navbar-megamenu ul li li > a { padding-left: 48px } .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-submenu.opened > .rd-navbar-dropdown, .rd-navbar-sidebar .rd-navbar-sidebar-inner .rd-navbar-submenu.opened > .rd-navbar-megamenu { display: block } ul ul, ul ol, ol ul, ol ol { padding-left: 0 } .rd-parallax-light h1, .rd-parallax-light h2, .rd-parallax-light h3, .rd-parallax-light h4, .rd-parallax-light h5, .rd-parallax-light h6, .rd-parallax-light .heading-1, .rd-parallax-light .heading-2, .rd-parallax-light .heading-3, .rd-parallax-light .heading-4, .rd-parallax-light .heading-5, .rd-parallax-light .heading-6, .rd-parallax-light p { color: #fff } .parallax-container { position: relative; overflow: hidden } .material-parallax { position: absolute; top: 0; left: -1px; right: -1px; bottom: 0 } .ipad .material-parallax, .iphone .material-parallax { background-attachment: scroll !important } .material-parallax img { display: none; position: absolute; left: 50%; bottom: 0; min-width: 101%; min-height: 101%; transform: translate3d(-50%, 0, 0); max-width: none } .parallax-content { position: relative; z-index: 1 } .rd-google-map__model { color: #000; height: 200px } .rd-google-map__model img { max-width: none !important } @media(min-width:576px) { .rd-google-map__model { height: 250px } } @media(min-width:992px) { .rd-google-map__model { height: 450px } } .map_locations { display: none } .search_list { text-align: left; padding-left: 20px; font-size: 18px; list-style-type: none; counter-reset: li; overflow: hidden } .search_list li + li { margin-top: 25px } .search_list h5 + * { margin-top: 8px } .search_list p + p { margin-bottom: 8px } .search_list li:only-child::before { display: none } .search_list .result-item + .result-item { margin-top: 40px } .result-item { color: #333 } .result-item .search_title { color: #000 } .result-item .search_title:before { content: counter(li, decimal) ". "; counter-increment: li } .match { font-size: 14px; text-transform: uppercase; letter-spacing: .08em; color: #ab8c6b } .match em { font-style: normal } .search { color: #fff } #rd-search-results-live { position: absolute; top: 100%; left: 0; right: 0; margin-top: 5px; text-align: left } #rd-search-results-live #search-results { background: #fff; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .15); padding: 20px; opacity: 0; visibility: hidden; transition: .35s ease-in; max-height: calc(100vh - 200px); overflow-y: auto } #rd-search-results-live #search-results.active { visibility: visible; opacity: 1 } #rd-search-results-live #search-results .search_title { font-size: 18px } #rd-search-results-live #search-results p.match { display: none } #rd-search-results-live #search-results .result-item + .result-item { margin-top: 20px } #rd-search-results-live #search-results .search_all { margin-top: 20px } #rd-search-results-live #search-results .search_all a { display: block; padding: 2px 4px; background-color: #f2f2f2; text-align: center } #rd-search-results-live #search-results .search_all a:hover { text-decoration: underline } #rd-search-results-live #search-results .search_list { margin-top: 10px; padding-left: 0; padding-bottom: 10px; font-size: 16px }