diff --git a/assets/javascripts/app.js b/assets/javascripts/app.js index 21c5433..3941b3d 100644 --- a/assets/javascripts/app.js +++ b/assets/javascripts/app.js @@ -1,7 +1,36 @@ ;(function($, win, undefined) { // ECMAScript 5 嚴格模式 'use strict'; + $(function() { + var $signLanguageBox = $('.orbit-bar-search-sign-language'); + var $headerNav = $('.header-nav'); + var $target = $('.header-nav [accesskey="U"], .header-nav [accesskey="W"]'); + // 移除 color: inherit !important + $target.each(function() { + $(this)[0].style.removeProperty('color'); + }); + + function handleNavMove() { + var windowWidth = window.innerWidth; + + if (windowWidth > 768) { + if ($signLanguageBox.length && $signLanguageBox.find('[accesskey="U"], [accesskey="W"]').length === 0) { + $signLanguageBox.prepend($target); + } + } else { + if ($headerNav.length && $headerNav.find('[accesskey="U"], [accesskey="W"]').length === 0) { + $headerNav.append($target); + } + } + } + + handleNavMove(); + + $(window).on('resize', function() { + handleNavMove(); + }); + }); //header fixed在上方 function initdata1() { if ( $('.homebanner').length != 0) { @@ -590,7 +619,7 @@ } }); if (document.documentElement.lang === 'zh_tw') { - document.documentElement.lang = 'zh-Hant'; + document.documentElement.lang = 'zh-Hant-TW'; } //tab鍵按下 $(document).on('keydown', function(e) { @@ -836,7 +865,7 @@ var isLinkImage = $parentA.length > 0 && $parentA.text().replace(/\u00a0/g, '').trim() === ""; // --- 1. 處理「裝飾性圖片」標註 --- - if (currentAlt === "announcement image" || currentAlt === "裝飾圖片" || currentTitle === "裝飾圖片") { + if (currentAlt === "announcement image" || currentAlt === "裝飾圖片" || currentTitle === "裝飾圖片" || currentAlt === "這是一張圖片" || currentTitle === "這是一張圖片") { $img.attr('alt', ''); $img.removeAttr('title'); return; @@ -912,7 +941,7 @@ $(function() { var urlParams = new URLSearchParams(window.location.search); var isEditMode = urlParams.get('editmode') === 'on'; - var pageLang = $('html').attr('lang') || 'zh-Hant'; + var pageLang = $('html').attr('lang') || 'zh-Hant-TW'; var isEn = pageLang.toLowerCase().startsWith('en'); var i18n = { @@ -2059,6 +2088,14 @@ $(document).ready(function() { // if($('.show-announcement').hasClass('show-announcement')) { // $('.').css('', ''); // } + $(function() { + var $headerNav = $('.header-nav'); + $headerNav.contents().each(function() { + if (this.nodeType === 3 && this.nodeValue.trim() === '|') { + $(this).remove(); + } + }); + }); if ($('.fatfooter').length === 0) { $('.btn-fatfooter').hide(); }; @@ -2695,7 +2732,7 @@ $(document).ready(function () { $(document).ready(function () { // 定義文字與顏色對應 var categoryColors = { - "職業安全衛生": "#6a828e", + "職業安全衛生": "#96bccf", "試場專區": "#75c5c2", "健康促進及管理": "#e0c25f", "傳染病宣導": "#75c5c2" @@ -2784,6 +2821,128 @@ $(document).ready(function () { }); }, 1500); }); +//cycle2無障礙 +$(document).ready(function() { + // 取得頁面上所有的 Cycle2 輪播圖 + var $allSlideshows = $('.cycle-slideshow'); + + /** + * 核心無障礙狀態刷新函式 + */ + function refreshCycleA11y($el) { + var $items = $el.find('.w-annc__item, .widget-link__item, .widget-pic, [class*="cycle-slide"]'); + + $items.each(function() { + var $slide = $(this); + var isActive = $slide.hasClass('cycle-slide-active'); + + if (isActive) { + // ✅ li 只設 aria-hidden,不加 tabindex + $slide.attr('aria-hidden', 'false'); + $slide.removeAttr('tabindex'); // ← 確保 li 本身沒有 tabindex + $slide.find('a, button, input, [tabindex]').attr('tabindex', '0'); + } else { + // 隱藏中的投影片:徹底隔離 + $slide.attr('aria-hidden', 'true'); + $slide.removeAttr('tabindex'); + $slide.find('a, button, input, [tabindex]').attr('tabindex', '-1'); + } + }); + + // --- 防鎖死邊界處理 (Shift + Tab) --- + var $container = $el.closest('.w-annc, .widget-link_wrapper, .widget-link'); + var $prevBtn = $container.find('.btn-left, .prev-button'); + + $el.find('.cycle-slide-active a, .cycle-slide-active button').first() + .off('keydown.a11y').on('keydown.a11y', function(e) { + if (e.keyCode === 9 && e.shiftKey) { + if ($prevBtn.length) { + e.preventDefault(); + $prevBtn.focus(); + } + } + }); + } + + /** + * 針對 widget-link 非語意化標籤 (如 i 標籤當按鈕) 的無障礙補強 + */ + function refreshCycleA11y($el) { + var $items = $el.find('.w-annc__item, .widget-link__item, [class*="cycle-slide"]'); + + $items.each(function() { + var $slide = $(this); + var isActive = $slide.hasClass('cycle-slide-active'); + + if (isActive) { + // ✅ li 只設 aria-hidden,不加 tabindex + $slide.attr('aria-hidden', 'false'); + $slide.removeAttr('tabindex'); // ← 確保 li 本身沒有 tabindex + $slide.find('a, button, input, [tabindex]').attr('tabindex', '0'); + } else { + // 隱藏中的投影片:徹底隔離 + $slide.attr('aria-hidden', 'true'); + $slide.removeAttr('tabindex'); + $slide.find('a, button, input, [tabindex]').attr('tabindex', '-1'); + } + }); + + // --- 防鎖死邊界處理 (Shift + Tab) --- + var $container = $el.closest('.w-annc, .widget-link_wrapper, .widget-link'); + var $prevBtn = $container.find('.btn-left, .prev-button'); + + $el.find('.cycle-slide-active a, .cycle-slide-active button').first() + .off('keydown.a11y').on('keydown.a11y', function(e) { + if (e.keyCode === 9 && e.shiftKey) { + if ($prevBtn.length) { + e.preventDefault(); + $prevBtn.focus(); + } + } + }); + } + + // 輔助函式:切換後更新 A11y 狀態並鎖定焦點 + function triggerPostUpdate($el, $activeBtn) { + $el.one('cycle-after', function() { + setTimeout(function() { + refreshCycleA11y($el); + $activeBtn.focus(); + }, 300); + }); + } + + /** + * 舊有按鈕事件相容與整合 + */ + $(document).on('keydown', '.btn-right, .btn-left', function(e) { + if (e.keyCode === 13) { + var $btn = $(this); + var $el = $btn.closest('.w-annc').find('.cycle-slideshow'); + triggerPostUpdate($el, $btn); + } + }); + + /** + * 綁定 Cycle2 核心事件 + */ + $allSlideshows.on('cycle-initialized cycle-after', function() { + var $this = $(this); + setTimeout(function() { + refreshCycleA11y($this); + }, 300); + }); + + // 初始化執行 + patchWidgetLinkElements(); + + $allSlideshows.each(function() { + var $this = $(this); + setTimeout(function() { + refreshCycleA11y($this); + }, 500); + }); +}); //orbitbarlogo無障礙 $(function() { var $logo = $('.orbit-bar-logo'); @@ -2881,6 +3040,92 @@ $(document).ready(function() { }); }); +//萬用表格無障礙 +function fixSortLinkA11y() { + $('a').filter(function () { + return $(this).find('.universal-th-icon').length > 0; + }).each(function () { + var $link = $(this); + + // === Step 1: 移除 display:none 的 span === + $link.find('span').each(function () { + if ($(this).css('display') === 'none' || $(this).attr('style') && $(this).attr('style').indexOf('display: none') !== -1) { + $(this).remove(); + } + }); + + // === Step 2: 取得 aria-label === + var ariaLabel = $link.attr('aria-label') || ''; + + // 若 aria-label 空白或含未替換模板變數,從旁邊 .universal-th-text 補 + if (!ariaLabel || ariaLabel.indexOf('{{') !== -1) { + var $th = $link.closest('th, div[class*="col-"]'); + var colName = $th.find('.universal-th-text').text().trim(); + ariaLabel = colName ? '重新排序' + colName : '排序'; + $link.attr('aria-label', ariaLabel); + } + + // === Step 3: 補上 title 屬性 === + if (!$link.attr('title')) { + $link.attr('title', ariaLabel + '(在本視窗開啟)'); + } + + // === Step 4: 確保圖示有 aria-hidden === + $link.find('.universal-th-icon').attr('aria-hidden', 'true'); + + // === Step 5: 補上 visually-hidden 連結文字 === + if ($link.find('.visually-hidden').length === 0) { + $link.append('' + ariaLabel + ''); + } + }); +} +function fixSearchInputA11y() { + $('input[type="search"], input[type="text"]').each(function () { + var $input = $(this); + + // 已有對應 label 就跳過 + var inputId = $input.attr('id'); + if (inputId && $('label[for="' + inputId + '"]').length) return; + + // 已有 aria-label / aria-labelledby / title 就跳過 + if ($input.attr('aria-label') || $input.attr('aria-labelledby') || $input.attr('title')) return; + + // 從 placeholder 取得說明文字 + var placeholder = $input.attr('placeholder') || ''; + + // 從最近的 th 或欄位標題取得欄位名稱 + var colName = ''; + var $th = $input.closest('th, div[class*="col-"]'); + if ($th.length) { + colName = $th.find('.universal-th-text').text().trim(); + } + + // 組合標籤文字 + var label = ''; + if (colName && placeholder) { + label = colName + '搜尋'; + } else if (colName) { + label = colName + '搜尋'; + } else if (placeholder) { + label = placeholder; + } else { + label = '搜尋關鍵字'; + } + + $input.attr('aria-label', label); + $input.attr('title', label); + }); +} + +$(document).ready(function () { + setTimeout(function () { + fixSortLinkA11y(); + fixSearchInputA11y(); + }, 500); +}); +setTimeout(function() { + $('.internal-page .ad-banner-widget-0 .w-ad-banner__image').attr('alt', ''); +}, 800); // 執行 member等高計算,目前改用flexbox故mark掉 by ika 20160105 // $(window).load(function() { // if ($('.index-member-3').length && $(window).width() > 992) { diff --git a/assets/stylesheets/template/base/_global.scss b/assets/stylesheets/template/base/_global.scss index a238948..ef4aab2 100644 --- a/assets/stylesheets/template/base/_global.scss +++ b/assets/stylesheets/template/base/_global.scss @@ -11,6 +11,9 @@ display: block } } +#orbit-bar .orbit-bar-menu .orbit-bar-logo{ + cursor: unset!important; +} .login-btn:focus { outline: 0.3125em auto -webkit-focus-ring-color !important; diff --git a/assets/stylesheets/template/base/_variables.scss b/assets/stylesheets/template/base/_variables.scss index d7341d6..6adf23f 100644 --- a/assets/stylesheets/template/base/_variables.scss +++ b/assets/stylesheets/template/base/_variables.scss @@ -16,8 +16,8 @@ $theme-red: #d20001; $theme-blue: #003d7e; $theme-color-main: #333333; -$theme-color-second:#00a99d; -$theme-color-third: #00a99d; +$theme-color-second:#008077; +$theme-color-third: #008077; $theme-color-green: #06beb2; $theme-color-hover:#086bce; diff --git a/assets/stylesheets/template/layout/content.scss b/assets/stylesheets/template/layout/content.scss index 391e0b7..97decb4 100644 --- a/assets/stylesheets/template/layout/content.scss +++ b/assets/stylesheets/template/layout/content.scss @@ -346,7 +346,7 @@ td > section { position: relative; padding: 50px 30px 50px; border-radius: 10px; - border: #00a99d36 solid 5px; + border: #00807736 solid 5px; min-height: 28em; h3 { @@ -356,7 +356,7 @@ td > section { transform: translateX(-50%); text-align: center; padding: 2px 25px; - color: #00a99d; + color: #008077; background: #fff; } h4,i { @@ -372,7 +372,7 @@ td > section { padding: 8px 20px; border-radius: 20px; color: #fff!important; - background: #00a99d; + background: #008077; &:hover{ opacity: .8; } diff --git a/assets/stylesheets/template/layout/footer.scss b/assets/stylesheets/template/layout/footer.scss index 3188e24..46da876 100644 --- a/assets/stylesheets/template/layout/footer.scss +++ b/assets/stylesheets/template/layout/footer.scss @@ -140,7 +140,7 @@ .copyright { width: 100%; text-align: center; - color: #afe0dd; + color: #e1fefc; border-top: 1px solid #ffffff66; padding: 15px 20px 0; margin: 20px 0 0; diff --git a/assets/stylesheets/template/layout/wordpress.scss b/assets/stylesheets/template/layout/wordpress.scss new file mode 100644 index 0000000..6727f2c --- /dev/null +++ b/assets/stylesheets/template/layout/wordpress.scss @@ -0,0 +1,2264 @@ +@charset "utf-8"; + +@import "../initial"; + +body { + color: #333; + font-family: "Roboto", Arial, 'Noto Sans TC', "微軟正黑體", sans-serif; + scroll-behavior: smooth; +} + +img { + max-width: 100%; +} + +/*=================== 首頁 ====================*/ + +.lang { + position: absolute; + top: -64px; + right: 30px; +} + +.lang * { + box-sizing: border-box; +} + +@media (max-width: 1239px) { + .lang { + position: static; + top: auto; + right: auto; + background: #008077; + padding: 6px; + } +} + + +.lang ul { + margin: 0; + padding: 0; + list-style: none; +} + +.lang ul li { + display: flex; + flex-flow: wrap; +} + +.lang ul li a, +.lang ul li button { + display: block; + font-size: 14px; + padding: 6px 15px; + margin: 0 5px 0 0; + letter-spacing: 1px; + border-radius: 40px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + color: #fff; + background: #345277; +} + +.lang ul li a:hover, +.lang ul li button:hover { + background: #4771a3; +} + +@media (max-width: 1239px) { + + .lang ul li a, + .lang ul li button { + width: 100%; + color: #fff; + border-radius: 0; + padding: 8px 20px !important; + margin: 0; + } + + .lang input { + width: 100%; + margin: 5px 0; + } +} + + + +.menubg { + background: #008077; + border-bottom: #008077 solid 1px; +} + +@media (max-width: 767px) { + .menubg { + border-bottom: none; + } +} + +.is-sticky .top_bar_left>.container { + padding: 0; +} + + + +.indexswf, +.page { + padding: 145px 0 0; +} + +@media (max-width: 767px) { + + .indexswf, + .page { + padding: 61px 0 0; + } +} + + + + +.relatedlinks { + padding: 0 80px; + background: #204f90; + box-shadow: inset 0px 5px 25px -8px rgba(0, 0, 0, 0.3); +} + +.relatedlinks ul { + display: flex; + flex-flow: wrap; + padding: 80px 0 50px; +} + +.relatedlinks ul li { + width: calc(100% / 5 - 30px); + font-size: 15px; + margin: 0 15px 15px; + text-align: center; +} + +@media (max-width: 1239px) { + .relatedlinks ul li { + width: calc(100% / 4 - 15px); + margin: 0 7.5px 15px; + } +} + +@media (max-width: 959px) { + .relatedlinks ul li { + width: calc(100% / 3 - 15px); + margin: 0 7.5px 15px; + } +} + +@media (max-width: 767px) { + .relatedlinks { + padding: 0 30px; + } + + .relatedlinks ul li { + width: calc(100% / 3 - 15px); + margin: 0 7.5px 15px; + } +} + +@media (max-width: 479px) { + .relatedlinks ul { + padding: 40px 0; + } + + .relatedlinks ul li { + width: calc(100% / 2 - 15px); + margin: 0 7.5px 15px; + } +} + +.relatedlinks ul li a { + display: block; + color: #fff; +} + +.relatedlinks ul li .pic { + padding-top: 40%; + overflow: hidden; + border-radius: 4px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + position: relative; + margin-bottom: 10px; +} + +.relatedlinks ul li .pic img { + width: 100%; + height: 100% !important; + object-fit: cover; + position: absolute; + top: 0; + left: 0; + + transition: all 0.3s; +} + +.relatedlinks ul li:hover .pic img { + transform: scale(1.2, 1.2); +} + + + + + + +.i_featuresbg {} + +.i_features { + display: flex; + flex-flow: wrap; + position: relative; + padding: 60px 0; +} +@media (max-width: 576px) { + .i_features { + padding: 40px 0 60px; + } +} + +.i_features * { + box-sizing: border-box; +} + +.i_features .video { + width: 40%; +} + +.i_features .video .pic { + position: relative; + padding-top: 55.6%; +} +.i_features .video .pic::after { + content: ""; + width: 100%; + height: 100%; + display: block; + position: absolute; + top: 25px; + right: -25px; + background: url(../index_01.png); +} + +.i_features .video .pic iframe { + width: 100%; + height: 100% !important; + + position: absolute; + top: 0; + left: 0; + z-index: 2; +} + + + +@media (max-width: 1499px) { + .i_features .video { + width: 480px; + } + + .i_features .video h3 { + font-size: 32px; + margin-bottom: 10px; + } +} + +@media (max-width: 767px) { + .i_features .video { + grid-template-columns: 1fr; + padding: 0 50px; + } + + .i_features .video .pic { + margin-left: 0; + margin-top: 20px; + } +} + + + + +.i_features section { + flex: 1; + padding-right: 50px; +} + +@media (max-width: 959px) { + .i_features .video { + width: 100%; + padding: 10px 0px; + letter-spacing: 1px; + } + + .i_features section { + padding-right: 0; + margin-bottom: 10px; + } +} + +@media (max-width: 767px) { + .i_features .video { + width: 100%; + margin-left: 0; + } +} + +@media (max-width: 479px) {} + + + + +.i_news{ + display: flex; +} +.i_news .title{ + display: flex; + flex-flow: column; + justify-content: space-between; + margin-right: 30px; +} +.i_news .title > span{ + display: flex; +} +.i_news h2{ + -webkit-writing-mode: vertical-rl; + writing-mode: vertical-rl; + font-weight: 400; + letter-spacing: 5px; +} +.i_news .en{ + -webkit-writing-mode: vertical-rl; + writing-mode: vertical-rl; + color: #999; + padding-top: 3px; + letter-spacing: 3px; +} +.i_news .title a{ + display: block; + text-align: right; + font-size: 13px; + margin-bottom: 10px; + border-bottom: 1px solid #ccc; +} + + +.i_news ul{ + margin: 0; + padding: 0; + list-style: none; + flex: 1; +} +.i_news ul li{ + border-bottom: 1px dashed #cacaca; + margin-bottom: 10px; +} +.i_news ul li a{ + display: flex; + align-items: center; + padding-bottom: 10px; +} +.i_news .date{ + display: inline-block; + font-size: 13px; + padding: 1px 10px; + border: 1px solid #333; + margin: 3px 20px 3px 0; +} +.i_news ul li p{ + flex: 1; + margin: 0; +} +@media (max-width: 767px) { + .i_news .title{ + justify-content: flex-start; + margin-right: 15px; + } + .i_news .title a{ + padding: 3px 6px; + font-size: 12px; + text-align: center; + border: 0px solid #ccc; + background: #eee; + } + + .i_news ul li a{ + flex-flow: wrap; + } + .i_news ul li p{ + flex-basis: 100%; + margin-top: 5px; + } +} + + + +.i_bottom_bg{ + position: relative; + padding: 80px 0; + background: #f5f5f5; + overflow: hidden; +} +@media (max-width: 767px) { + .i_bottom_bg{ + padding: 50px 0; + } +} +.i_bottom_bg::after{ + content: ""; + width: 100%; + height: 100%; + display: block; + opacity: 0.15; + position: absolute; + top: 0; + left: 0; + background: url(../index_09.jpg) no-repeat center; +} +.i_bottom_bg .container{ + position: relative; + z-index: 2; +} + + +.i_bottom{ + display: flex; + flex-flow: wrap; +} +.i_bottom section{ + position: relative; +} +.i_bottom section:nth-of-type(1){ + width: 40%; + padding:25px 20px; + margin-right: 50px; + border: 8px solid #fff; +} +.i_bottom section:nth-of-type(2){ + width:calc(100% - 40% - 50px); +} +@media (max-width: 1239px) { + .i_bottom section:nth-of-type(1){ + width: 100%; + margin: 0 0 30px; + } + .i_bottom section:nth-of-type(2){ + width:100%; + } +} + + +.i_bottom .title{ + display: flex; + justify-content: space-between; + align-items: flex-end; + margin-bottom: 20px; + border-bottom: 1px solid #a0a0a0; +} +.i_bottom .title > h2{ + font-weight: 400; + margin: 0; + letter-spacing: 2px; +} +.i_bottom .title > h2 img{ + position: relative; + top: 7px; + width: 40px; +} +.i_bottom .title > h2 span{ + color: #08aca0; + letter-spacing: 1px; + font-size: 15px; + text-transform: uppercase; +} + +.i_bottom .title a{ + display: inline-block; + padding: 3px 15px; + margin-bottom: 5px; + white-space: nowrap; +} + +@media (max-width: 767px) { + .i_bottom .title > h2 img{ + top: 5px; + width: 30px; + } +} +@media (max-width: 479px) { + .i_bottom .title > h2 img{ + width: 25px; + } +} + + + +.i_bottom .title02{ + color: #008c82; + line-height: 100%; + font-weight: 500; + letter-spacing: 3px; +} +.i_bottom .title02 span{ + display: inline-block; + font-size: 16px; + color: #d07a1e; + letter-spacing: 1px; +} +.i_bottom .more{ + font-size: 14px; + display: inline-block; + padding: 8px 20px; + border-radius: 4px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + color: #fff; + background: #008c82; +} +.i_bottom .more:hover{ + background: #06beb2; +} + + + + + +footer { + color: #fff; + padding: 15px 0; + background: #008077; +} +footer * { + box-sizing: border-box; +} +footer img { + max-width: 100%; + height: auto; +} +footer a { + color: #fff; +} +footer a:hover { + color: #b1fff9; +} + +footer .logo{ + text-align: center; +} +footer .logo img{} +footer ul{ + margin: 0; + padding: 0; + list-style: none; + display: flex; + flex-flow: wrap; + justify-content: center; +} +footer ul li{ + font-size: 16px; + padding: 5px 15px; +} +footer h6{ + font-size: 12px; + text-align: center; + color: #afe0dd; + border-top: 1px solid rgba(255, 255, 255, 0.4); + padding: 15px 20px 0; + margin:20px 0 0; +} +footer h6 a{ + color: #afe0dd; +} +@media (max-width: 479px) { + footer ul{ + justify-content: flex-start; + } +} + + + + +/*================= 內頁 ===================*/ + +.pagination { + display: inline-block; + padding-left: 0; + margin: 20px 0 60px; + border-radius: 4px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); +} + +.pagination>li { + display: inline; +} + +.pagination>li>a, +.pagination>li>span { + position: relative; + float: left; + padding: 6px 12px; + margin-left: -1px; + line-height: 1.42857143; + color: #333; + text-decoration: none; + background-color: #fff; + border: 1px solid #ddd; +} + +.pagination>li:first-child>a, +.pagination>li:first-child>span { + margin-left: 0; + border-top-left-radius: 4px; + border-bottom-left-radius: 4px; +} + +.pagination>li:last-child>a, +.pagination>li:last-child>span { + border-top-right-radius: 4px; + border-bottom-right-radius: 4px; +} + +.pagination>li>a:hover, +.pagination>li>span:hover, +.pagination>li>a:focus, +.pagination>li>span:focus { + z-index: 2; + color: #008077; + background-color: #eee; + border-color: #ddd; +} + +.pagination>.active>a, +.pagination>.active>span, +.pagination>.active>a:hover, +.pagination>.active>span:hover, +.pagination>.active>a:focus, +.pagination>.active>span:focus { + z-index: 3; + color: #fff; + cursor: default; + background-color: #008077; + border-color: #008077; +} + +.pagination>.disabled>span, +.pagination>.disabled>span:hover, +.pagination>.disabled>span:focus, +.pagination>.disabled>a, +.pagination>.disabled>a:hover, +.pagination>.disabled>a:focus { + color: #777; + cursor: not-allowed; + background-color: #fff; + border-color: #ddd; +} + + +.sr-only { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + border: 0; +} + + + + + +.page {} + +.page .swf { + display: flex; + justify-content: center; + align-items: center; + min-height: 250px; +} + +.page h2 { + letter-spacing: 3px; + color: #fff; + margin: 0; +} + +.s01 { + background: url(../pageswf_01.jpg) no-repeat center top; +} + +.s02 { + background: url(../pageswf_02.jpg) no-repeat center top; +} + +.s03 { + background: url(../pageswf_03.jpg) no-repeat center top; +} + +.s04 { + background: url(../pageswf_04.jpg) no-repeat center top; +} + +.s05 { + background: url(../pageswf_05.jpg) no-repeat center top; +} + +.s06 { + background: url(../pageswf_06.jpg) no-repeat center top; +} + +.s07 { + background: url(../pageswf_07.jpg) no-repeat center top; +} + +.s08 { + background: url(../pageswf_08.jpg) no-repeat center top; +} + +.s09 { + background: url(../pageswf_09.jpg) no-repeat center top; +} + +.s10 { + background: url(../pageswf_10.jpg) no-repeat center top; +} + +.s11 { + background: url(../pageswf_11.jpg) no-repeat center top; +} + +.content_wrapper { + padding: 50px 0 0; + letter-spacing: 1px; +} + +.content_wrapper * { + box-sizing: border-box; +} + +.pagtcon_top { + display: flex; + flex-flow: column; + align-items: center; + margin-bottom: 20px; +} + +.pagetitle { + font-size: 30px; + line-height: 150%; + text-align: center; + letter-spacing: 6px; +} + +.pagetitle .en { + display: block; + letter-spacing: 6px; + font-size: 12px; + color: #848484; + margin: 0 5px; + text-transform: uppercase; +} + +.breadcrumbs { + display: flex; + flex-flow: wrap; + font-size: 13px; + letter-spacing: 2px; + color: #848484; + margin: 0 0 15px; +} + +.breadcrumbs a { + color: #008077; +} + +.slider_pagination>a:nth-of-type(1), +.slider_pagination>a:nth-of-type(2), +.slider_pagination>a:nth-of-type(3) { + opacity: 0; +} + +@media (max-width: 767px) { + .testimonials_slider .testimonials_slider_ul li .bq_wrapper { + background: rgba(0, 0, 0, 0.02); + padding: 30px 0 10px; + margin-bottom: 20px; + } + + .testimonials_slider.single-photo .testimonials_slider_ul li .bq_wrapper { + margin: 0 0 20px; + } +} + +.sidemenu_form { + display: flex; + flex-flow: wrap; + gap: 40px; + margin-bottom: 60px; +} +.sidemenu_form > section{ + flex: 1; +} +.sidemenu_form > section.menu { + width: 240px; + flex: none; +} + +.sidemenu_form > section:nth-of-type(2) { + position: relative; + flex: 1; + padding: 40px; + background: #fff; + border-radius: 3px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + border: #eee solid 1px; + box-shadow: 0px 3px 8px -5px rgba(0, 0, 0, 0.2); +} + +.sidemenu_form.one-column > section:nth-of-type(1) { + margin-right: 0; + width: 100%; + background: #fff; + border-radius: 3px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + border: #eee solid 1px; + box-shadow: 0px 3px 8px -5px rgba(0, 0, 0, 0.2); +} + +.sidemenu_form.one-column section:nth-of-type(2) {} + +.sidemenu_form section .edit, +.common_form { + +} + +.edit ul, +.edit ol { + padding-left: 25px; +} + +.edit li { + margin-bottom: 10px; +} + +@media (max-width: 959px) { + .sidemenu_form section.menu { + display: none; + width: 100%; + margin: 0; + } + + .sidemenu_form > section:nth-of-type(2) { + width: 100%; + } +} + +@media (max-width: 767px) { + .sidemenu_form > section .edit, + .common_form { + padding:0; + } + + .sidemenu_form > section:nth-of-type(2) { + padding: 20px; + } +} + + + +/*================= 系所簡介 ===================*/ + +.about {} +.about h4{ + color: #008077; +} + + + + +.subsidylist{ + display: grid; + gap: 60px 40px; + grid-template-columns: 1fr 1fr; +} +.subsidylist > section{ + position: relative; + padding:50px 30px 50px; + border-radius: 10px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + border: #00807736 solid 5px; +} +.subsidylist h3{ + position: absolute; + left: 50%; + top: -20px; + transform: translateX(-50%); + text-align: center; + padding: 2px 25px; + color: #008077; + background: #fff; +} +.subsidylist h4{ + color: #dca43e; +} +.subsidylist p{ + margin-bottom: 30px; +} +.subsidylist a{ + display: inline-block; + padding: 8px 20px; + border-radius: 20px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + color: #fff; + background: #008077; +} +.subsidylist a:hover{ + background: #03bbaf; +} + +@media (max-width: 767px) { + .subsidylist{ + gap: 50px 20px; + } + .subsidylist h3{ + padding: 2px 20px; + } +} +@media (max-width: 479px) { + .subsidylist > section{ + padding:25px 30px; + } + .subsidylist{ + gap: 30px 0; + grid-template-columns: 1fr ; + } + .subsidylist h3{ + top:-15px; + } + .subsidylist h4{ + font-size: 14px; + } +} + + + + + + + + + + + + + +/*===================== 系所成員 =====================*/ + + +.memberlist * { + box-sizing: border-box; +} + +.memberlist ul { + margin: 0; + padding: 0; + list-style: none; +} + +.memberlist ul>li { + position: relative; + display: flex; + flex-flow: wrap; + gap:15px 30px; + align-items: flex-start; + padding: 30px; + border-radius: 5px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + margin-bottom: 10px; + transition: all 0.5s; + background: #f6f6f6; + border: #fff solid 1px; +} + +.memberlist ul>li:hover { + border: #008077 solid 1px; +} + +.memberlist ul>li a { + +} + +.memberlist ul>li .photo { + width: 220px; + height: 250px; + position: relative; + border-radius: 20px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + overflow: hidden; +} + +.memberlist ul>li .photo img { + width: 100%; + height: 100%; + object-fit: cover; + position: absolute; + top: 0; + left: 0; +} + +.memberlist ul>li .con { + flex: 1; + display: flex; + flex-flow: wrap; +} + +.memberlist ul>li .con>span { + width: 100%; + display: flex; + flex-flow: wrap; + align-items: center; + margin-bottom: 5px; + border-bottom: 1px dashed rgb(194, 194, 194); +} + +.memberlist ul>li .con>div { + padding: 8px 0; + word-break: break-all; +} + +.memberlist ul>li .con>div:nth-of-type(1) { + width: 80%; +} + +.memberlist ul>li .con>div:nth-of-type(2) { + width: 100%; +} + +.memberlist ul>li .con>div:nth-of-type(3) { + width: 100%; +} + +.memberlist ul>li h3 { + font-weight: bold; + text-align: center; + margin: 0 10px 5px 0; +} + +.memberlist ul>li p { + margin: 0 0 5px; +} + +.memberlist ul>li .title { + display: block; + font-weight: bolder; + font-size: 14px; + color: #0e4092; + white-space: nowrap; + letter-spacing: 2px; +} + + + + +.memberlist.all ul { + display: grid; + gap: 15px; + grid-template-columns: repeat(3, 1fr); +} + +.memberlist.all ul>li a { + flex-flow: column; + align-items: center; + padding: 20px; +} + +.memberlist.all ul>li .photo { + width: 120px; + height: 150px; + margin-right: 0; + margin-bottom: 15px; +} + +.memberlist.all ul>li .con>div:nth-of-type(1) { + width: 100%; +} + +.memberlist.all ul>li .con>span { + justify-content: center; +} + + +@media (max-width: 1499px) { + .memberlist.all ul { + grid-template-columns: repeat(3, 1fr); + } +} + +@media (max-width: 1239px) { + .memberlist ul>li .con>div:nth-of-type(1) { + width: 100%; + } + + .memberlist ul>li .con>div:nth-of-type(2) { + width: 100%; + } + + .memberlist ul>li .con>div:nth-of-type(3) { + width: 100%; + } + + + .memberlist.all ul { + grid-template-columns: repeat(2, 1fr); + } +} + +@media (max-width: 576px) { + .memberlist ul>li { + justify-content: center; + } + .memberlist ul>li a { + flex-flow: column; + align-items: center; + } + + .memberlist ul>li .photo { + padding-top: 100%; + margin-right: 0; + margin-bottom: 10px; + } + + .memberlist ul>li .con{ + flex-basis: 100%; + } + .memberlist ul>li .con>span { + justify-content: center; + text-align: center; + } + + .memberlist ul>li h3 { + margin: 5px; + } + + + .memberlist.all ul { + grid-template-columns: 1fr; + } +} + + + + + +.morph-button-fixed button.teach { + display: inline-block; + width: 200px; + padding-bottom: 12px; + border-radius: 50px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); +} + + + + + + +.mem_info { + display: flex; + margin-bottom: 30px; +} + +.mem_info .top:nth-of-type(1) { + width: 200px; + position: relative; + margin-right: 20px; + padding: 0; +} + +.mem_info .top:nth-of-type(2) { + width: calc(100% - 220px); + padding: 0; +} + +@media (max-width:991px) { + .mem_info { + flex-flow: wrap; + justify-content: center; + } + + .mem_info .top:nth-of-type(1) { + width: 200px; + margin: 0 0 20px; + } + + .mem_info .top:nth-of-type(2) { + width: 100%; + } +} + + +.mem_info .pic { + width: 100%; + position: relative; + padding-top: 136%; +} + +.mem_info .pic img { + width: 100%; + height: 100%; + object-fit: cover; + position: absolute; + top: 0; + left: 0; +} + +.mem_info .top ul { + width: 100%; + display: block; + margin: 0; + padding: 0; + list-style: none; +} + +.mem_info .top ul li { + display: flex; + align-items: stretch; + + background: rgba(0, 0, 0, 0.04); + margin-bottom: 2px; + padding: 0; +} + +.mem_info .top ul li:nth-of-type(even) { + background: rgba(0, 0, 0, 0.08); +} + +.mem_info .top ul li:last-of-type { + margin-bottom: 0; +} + + +.mem_info .top ul li a { + padding: 0; +} + +.mem_info .top ul li h4 { + width: 120px; + display: flex; + justify-content: center; + align-items: center; + padding: 6px 15px; + font-size: 15px; + margin: 0 0 0 0; + color: #fff; + background: #848484; +} + +.mem_info .top ul li p { + width: calc(100% - 120px); + margin: 0; + font-size: 15px; + padding: 6px 15px; + word-break: break-all; +} + + +@media (max-width:479px) { + .mem_info .top ul li h4 { + width: 100px; + padding: 8px 10px; + font-size: 15px; + } + + .mem_info .top ul li p { + width: calc(100% - 100px); + padding: 6px 10px; + } +} + + + + + + +.editlist {} + +.editlist input[type="radio"] { + width: auto; + display: inline-block; + max-width: none; +} + +.editlist label { + display: inline-block; + width: auto; + margin: 3px 8px; +} + +.editlist input[type="button"] { + max-width: 120px; + color: #333; + background: #f5f5f5; +} + +.editlist input, +.editlist textarea { + margin: 0; + background: #fff; + box-shadow: none; + border-color: #cccccc; +} + +.editlist input { + width: 100%; + max-width: 300px; +} + +.editlist textarea { + width: 100%; +} + +.editlist ul { + margin: 0; + padding: 0; + list-style: none; +} + +.editlist ul li { + display: flex; + align-items: center; + padding: 8px 0; +} + +.editlist ul li:nth-of-type(even) {} + +.editlist ul li .title { + width: 100px; + margin-right: 20px; +} + +.editlist ul li .con { + flex: 1; +} + +@media (max-width:767px) { + .editlist ul li { + flex-flow: wrap; + } + + .editlist ul li .title { + width: 100%; + margin-right: 0px; + margin-bottom: 6px; + } +} + + + + + + + + + + + + + + +/*===================== 最新消息 =====================*/ + +.act_area{ + display: flex; + flex-flow: wrap; +} +.act_area > div{ + display: flex; + flex-flow: column; + position: relative; + margin-bottom: 50px !important; +} +.act_area .icon{ + width: 100%; + position: absolute; + text-align: center; +} +.act_area .con{ + flex: 1; + margin-top: 150px; + padding:40px 30px; + overflow: hidden; + border-radius: 30px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + border: #efefef solid 1px; + box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3); +} +.act_area .con::after{ + content: ""; + width: 30%; + height: 4px; + display: block; + position: absolute; + bottom: 0px; + left: 50%; + transform: translateX(-50%); + background: #36008d; +} +.act_area > div:nth-of-type(2) .con::after{ + background: #00b4b8; +} +.act_area > div:nth-of-type(3) .con::after{ + background: #fcc700; +} +.act_area .pic{ + margin-bottom: 15px; +} +.act_area .pic img{ + border-radius: 15px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); +} +.act_area section{} + +@media (max-width:1239px) { + .act_area .con{ + margin-top: 100px; + padding:30px 25px; + } +} +@media (max-width:959px) { + .act_area .con{ + margin-top: 90px; + } +} +@media (max-width:767px) { + .act_area .con{ + margin-top: 110px; + } +} +@media (max-width:479px) { + .act_area .con{ + margin-top: 125px; + } +} + + + + +.act_list{ + margin:0 0; + padding:0 0; + list-style: none; + + display: grid; + gap: 20px; + grid-template-columns: repeat(3, 1fr); +} +.act_list li{} +.act_list li a{} +.act_list li .pic{ + position: relative; + padding-top: 70%; + margin-bottom: 10px; + overflow: hidden; + border-radius: 4px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); +} +.act_list li .pic img{ + width: 100%; + height: 100%; + object-fit: cover; + position: absolute; + top: 0; + left: 0; +} +.act_list li .date{ + color: #008c82; + font-size: 13px; +} +.act_list li p{} + +.act_title{ +} +.act_title h4{ + color: #008c82; + font-size: 24px; + line-height: 130%; +} +.act_title h6{ + margin: 0; +} +.act_title h5{ + display: inline-block; + position: absolute; + top: -16px; + font-weight: 400; + font-size: 15px; + padding: 4px 20px 4px 15px; + color: #fff; + border-radius: 4px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + background: #00a99e; +} + +@media (max-width:767px) { + .act_list{ + gap: 15px; + grid-template-columns: repeat(2, 1fr); + } + .act_title h4{ + font-size: 20px; + } + .act_title h5{ + position: static; + } +} + + + + + + + + + + + + + + + + + +.back { + text-align: center; + margin-bottom: 80px; +} + +.back a { + display: inline-block; + color: #fff; + padding: 8px 30px; + border-radius: 30px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + background: #008077; + margin: 0 5px 10px; +} + +.back a:hover { + color: #fff; + background: #0055ab; +} + + + + + +/*====================== 學術研究 =========================*/ +.table_s{ + overflow-x: auto; +} + +.research {} + +@media (min-width: 768px) { + .research table { + height: auto !important; + display: block; + margin-bottom: 30px; + } + + .research table thead { + display: block; + } + + .research table tbody { + display: block; + padding: 10px 0; + } + + .research table tr { + display: grid; + grid-template-columns: 2fr 1fr 1fr 1.5fr; + } + + .research table tr th, + .research table tr td { + display: flex; + flex-flow: wrap; + align-items: center; + text-align: left; + } + + .research table tr td:nth-of-type(1) { + text-align: left; + } + + .research table tr td>span, + .research table tr td>.title02 { + display: none; + } + +} + +.research table thead tr { + border-bottom: 2px solid #333; +} + +.research table tbody tr { + border-bottom: 1px solid #f1f1f1; +} + +.research table tbody tr:nth-of-type(2n) { + background: #f7f7f7; +} + +.research table tr th { + font-size: 15px; + line-height: 140%; + padding: 8px 15px; +} + +.research table tr td { + width: auto !important; + height: auto !important; + padding: 10px 15px; + font-size: 14px; + line-height: 150%; + text-align: left; +} + +@media (max-width: 767px) { + .research table { + min-width: 1000px !important; + height: auto !important; + margin-bottom: 30px; + } +} + + + + +@media (min-width: 768px) { + .research.r02 table tr { + grid-template-columns: 10% 20% 10% 40% 20%; + } + .research.r03 table tr { + grid-template-columns: 15% 20% 10% 35% 20%; + } + .research.r04 table tr { + height: auto !important; + grid-template-columns: 10% 10% 20% 30% 15% 15%; + } +} + +.research.r04 table tr td:last-of-type a { + display: inline-block; + padding: 5px 10px; + border-radius: 4px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + border: #ccc solid 1px; + margin: 3px 6px 3px 0; +} + +.research.r04 table tr td:last-of-type a:hover { + color: #000; + border: #999 solid 1px; +} + + + + + + + + + + + + + + +/*====================== 任務推動 =========================*/ + +.tasktitle{ + padding: 8px 15px; + color: #fff; + background: #008077; + border-radius: 4px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + margin-bottom: 30px; +} +.tasktitle i{ + font-weight: bold; +} + +.tasklist{ + margin: 0; + padding: 0; + list-style: none; + + display: flex; + flex-flow: wrap; + gap:15px 20px; +} +.tasklist li{} +.tasklist li img{ + max-height: 55px; +} + + + + + + + + + + + + + + + + + + + + + + + + +/*====================== 課程專區 =========================*/ + +.classlist { + margin-bottom: 40px; +} + +.classlist ul { + margin: 0; + padding: 0; + list-style: none; + + display: grid; + gap: 15px; + grid-template-columns: repeat(4, 1fr); +} + +.classlist.in ul { + grid-template-columns: repeat(5, 1fr); +} + +.classlist ul li { + margin-bottom: 30px; +} + +.classlist ul li a { + background: #f5f5f5; +} + +.classlist ul li .pic { + position: relative; + padding-top: 80%; + margin-bottom: 10px; + overflow: hidden; + border-radius: 3px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); +} + +.classlist ul li .pic img { + width: 100%; + height: 100%; + object-fit: cover; + + position: absolute; + top: 0; + left: 0; + transition: all 0.5s; +} + +.classlist ul li:hover .pic img { + transform: scale(1.2, 1.2); +} + +.classlist ul li p { + font-size: 14px; + line-height: 130%; + margin: 0; + padding: 0 10px; +} + +.classlist ul li h4 { + font-size: 16px; + font-weight: 600; + margin: 0 0 5px; + padding: 0 10px; +} + +.classlist ul li h5 { + margin: 0; + padding: 0 10px; + font-size: 13px; + font-weight: 500; + color: #999; +} + +@media (max-width: 1239px) { + .classlist ul { + grid-template-columns: repeat(3, 1fr); + } +} + +@media (max-width: 767px) { + .classlist ul { + grid-template-columns: repeat(2, 1fr); + } + + .classlist ul li h5 { + font-size: 12px; + } +} + + + + + + + +.albumlist{} +.albumlist ul{ + margin: 0 0 40px; + padding: 0; + list-style: none; + + display: grid; + gap: 20px; + grid-template-columns: repeat(4, 1fr); +} +.albumlist ul li{} +.albumlist ul li a{ + display: block; +} +.albumlist ul li .pic{ + position: relative; + padding-top: 65%; + border-radius: 4px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + overflow: hidden; + margin-bottom: 15px; +} +.albumlist ul li .pic img{ + width: 100%; + height: 100%; + object-fit: cover; + + position: absolute; + top: 0; + left: 0; + transition: all 0.3s; +} +.albumlist ul li:hover .pic img{ + transform: scale(1.1,1.1); +} +.albumlist ul li p{ + margin: 0; +} + + + + + + + + + + + + + + + + +/*====================== 學生專區 =======================*/ + +.studentlist { + margin-bottom: 40px; +} + +.studentlist ul { + margin: 0; + padding: 0; + list-style: none; + +} + +.studentlist ul li { + margin-bottom: 5px; +} + +.studentlist ul li a { + display: flex; + justify-content: space-between; + border: #eee solid 1px; + background: #f5f5f5; +} + +.studentlist ul li p { + flex: 1; + padding: 10px 15px; + margin: 0; +} + +.studentlist ul li h5 { + display: flex; + align-items: center; + margin: 0; + font-size: 14px; + font-weight: 500; + padding: 10px 20px; +} + +.studentlist ul li h5 i { + margin-right: 10px; +} + + + + + + + + + + + + + + + + +/*====================== 法規表單 =======================*/ + +.downloadlist {} + +.downloadlist ul { + margin: 0 0 30px; + padding: 0; + list-style: none !important; +} + +.downloadlist ul li { + display: flex; + justify-content: space-between; + margin: 0 0 6px; + background: #f1f1f1; +} + +.downloadlist ul li a { + display: block; +} + +.downloadlist ul li .pic { + width: 45px; + display: flex; + justify-content: center; + align-items: center; + margin: 0 0 0 2px; + transition: all 0.3s; +} + +.downloadlist .pic.pdf { + background: #ea4c3a; +} + +.downloadlist .pic.odf { + background: #257ec1; +} + +.downloadlist .pic.link { + background: #008077; +} + +.downloadlist ul li p { + flex: 1; + display: flex; + align-items: center; + padding: 12px 20px; + margin: 0; +} + + +.downloadlist.link ul li { + display: block; +} + +.downloadlist.link ul li a { + display: flex; + justify-content: space-between; +} + +@media (max-width: 767px) {} + +.downloadlist ul li a img { + width: 45px; + display: block; + transition: all 0.5s; +} + +.downloadlist ul li .pic:hover { + filter: brightness(1.2); +} + + + + + + + +.cooperate_list{} +.cooperate_list h3{ + font-size: 26px; + border-bottom: 4px double #008077; + padding-bottom: 5px; + margin-bottom: 40px; +} +.cooperate_list h3 i{ + color: #008077; +} +.cooperate_list ul{ + width: 100%; + margin: 0 0 60px; + padding: 0; + list-style: none; + display: grid; +} +.cooperate_list li{ + text-align: center; +} +.cooperate_list li .pic{ + width: 200px; + height: 200px; + position: relative; + overflow: hidden; + margin: 0 auto 10px; + transition: all 0.3s; +} +.cooperate_list li .pic img{ + width: 70%; + height: 70%; + object-fit: contain; + + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%,-50%); + transition: all 0.3s; +} +.cooperate_list li:hover .pic { + transform: scale(0.9,0.9); +} + +.cooperate_list .p1{ + gap: 30px; + grid-template-columns: repeat(4, 1fr); +} +.cooperate_list .p2{ + gap: 30px 6%; + grid-template-columns: repeat(5, 1fr); +} +.cooperate_list .p2 li .pic{ + width: 100%; + height: auto; + padding-top: 100%; +} + +@media (max-width: 767px) { + .cooperate_list h3{ + font-size: 18px; + } + .cooperate_list li .pic{ + width: 100%; + height: auto; + padding-top: 100%; + } + .cooperate_list .p2{ + gap: 20px 6%; + grid-template-columns: repeat(4, 1fr); + } +} +@media (max-width: 479px) { + .cooperate_list .p2{ + grid-template-columns: repeat(3, 1fr); + } +} + + + + + + + + +.newslist{} +.newslist ul{ + margin: 0 0 40px; + padding: 0; + list-style: none; +} +.newslist ul li{ + border-bottom: 1px dashed rgb(209, 209, 209); +} +.newslist ul li a{ + display: flex; + align-items: center; + padding: 12px 0; +} +.newslist ul li .date{ + color: #a0a0a0; + margin-right: 20px; +} +.newslist ul li h4{ + font-size: 17px; + line-height: 150%; + margin: 0 20px 0 0; + padding: 3px; + border-radius: 30px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + border: 1px solid #ccc; +} +.newslist ul li h4 span{ + display: block; + padding: 3px 20px; + border-radius: 30px; + behavior: url("/assets/ie_support/PIE2/PIE.htc"); + +} +.newslist ul li h4.type1{ + color: #fff; + border: 1px solid #72aaef; +} +.newslist ul li h4.type1 span{ + background: #72aaef; +} +.newslist ul li h4.type2{ + color: #fff; + border: 1px solid #46d0e6; +} +.newslist ul li h4.type2 span{ + background: #46d0e6; +} +.newslist ul li h4.type3{ + color: #fff; + border: 1px solid #f3c956; +} +.newslist ul li h4.type3 span{ + background: #f3c956; +} +.newslist ul li p{ + flex: 1; + margin: 0; +} + +@media (max-width: 479px) { + .newslist ul li h4{ + font-size: 14px; + } + .newslist ul li a{ + flex-flow: wrap; + } + .newslist ul li p{ + flex-basis: 100%; + margin: 10px 0 0; + } +} + + + + + + + + + + + + +/*==================== 聯絡我們 =======================*/ + +.contact { + display: flex; + flex-flow: wrap; +} + +@media (max-width: 767px) { + .contact { + display: flex; + flex-flow: wrap; + } +} + +.contact section {} + +.contact section:nth-of-type(1) { + width: 100%; +} + +.contact section:nth-of-type(2) { + width: 100%; + height: 350px; + position: relative; +} + +.contact ul { + max-width: 700px; + margin: 0 auto 40px; + padding: 0; + list-style: none; +} + +.contact ul li {} + +.contact input, +.contact textarea { + width: 100%; + background: #fff; + padding: 12px 15px; + margin-bottom: 6px; + box-shadow: none; +} + +.contact section:nth-of-type(2) iframe { + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; +} + + + + + + +.panel-group {} + +.panel-group table { + border-collapse: collapse; + +} + +.panel-group table tr {} + +.panel-group table thead tr { + border-bottom: 2px solid #6bcbda; +} + +.panel-group table tbody tr:nth-of-type(even) { + background: #f7f7f7; +} + +.panel-group table tr td { + padding: 6px 10px; + border: #e6e6e6 solid 1px !important; +} \ No newline at end of file diff --git a/assets/stylesheets/template/modules/announcement.scss b/assets/stylesheets/template/modules/announcement.scss index 1de1945..ccfd83c 100644 --- a/assets/stylesheets/template/modules/announcement.scss +++ b/assets/stylesheets/template/modules/announcement.scss @@ -2734,7 +2734,7 @@ table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before, tabl padding: 3px 20px; border-radius: 30px; background: #f3c956; - color: #fff!important; + color: #333!important; } } .i-annc__item { diff --git a/assets/stylesheets/template/modules/archives.scss b/assets/stylesheets/template/modules/archives.scss index 466f406..bc3004d 100644 --- a/assets/stylesheets/template/modules/archives.scss +++ b/assets/stylesheets/template/modules/archives.scss @@ -144,18 +144,18 @@ .i-archive-title { @extend .unity-title; } -.link { background-color: #1368d4 !important; } /* 對比 4.6:1 */ -.txt { background-color: #3a8a40 !important; } /* 對比 4.6:1 */ -.xlsx { background-color: #9e3050 !important; } /* 對比 4.6:1 */ -.pdf { background-color: #2a7d36 !important; } /* 對比 4.6:1 */ -.docx { background-color: #5e46a0 !important; } /* 對比 4.6:1 */ -.doc { background-color: #1368d4 !important; } /* 對比 4.6:1 */ -.pptx { background-color: #3d4aa0 !important; } /* 對比 4.6:1 */ -.jpg { background-color: #8f3333 !important; } /* 對比 4.6:1 */ -.zip { background-color: #8a6400 !important; } /* 對比 4.6:1 */ -.rar { background-color: #9e5000 !important; } /* 對比 4.6:1 */ -.xls { background-color: #3a8a40 !important; } /* 對比 4.6:1 */ -.odt { background-color: #767676 !important; } /* 對比 4.6:1 */ +.link { background-color: #1368d4 !important; margin-left: 0.5em; } /* 對比 4.6:1 */ +.txt { background-color: #3a8a40 !important; margin-left: 0.5em; } /* 對比 4.6:1 */ +.xlsx { background-color: #9e3050 !important; margin-left: 0.5em; } /* 對比 4.6:1 */ +.pdf { background-color: #2a7d36 !important; margin-left: 0.5em; } /* 對比 4.6:1 */ +.docx { background-color: #5e46a0 !important; margin-left: 0.5em; } /* 對比 4.6:1 */ +.doc { background-color: #1368d4 !important; margin-left: 0.5em; } /* 對比 4.6:1 */ +.pptx { background-color: #3d4aa0 !important; margin-left: 0.5em; } /* 對比 4.6:1 */ +.jpg { background-color: #8f3333 !important; margin-left: 0.5em; } /* 對比 4.6:1 */ +.zip { background-color: #8a6400 !important; margin-left: 0.5em; } /* 對比 4.6:1 */ +.rar { background-color: #9e5000 !important; margin-left: 0.5em; } /* 對比 4.6:1 */ +.xls { background-color: #3a8a40 !important; margin-left: 0.5em; } /* 對比 4.6:1 */ +.odt { background-color: #767676 !important; margin-left: 0.5em; } /* 對比 4.6:1 */ .table>caption+thead>tr:first-child>td, .table>caption+thead>tr:first-child>th, .table>colgroup+thead>tr:first-child>td, .table>colgroup+thead>tr:first-child>th, .table>thead:first-child>tr:first-child>td, .table>thead:first-child>tr:first-child>th{ // border-top: 0.0625em solid #ddd; } diff --git a/assets/stylesheets/template/widget/breadcrumb.scss b/assets/stylesheets/template/widget/breadcrumb.scss index 635e425..dc9b81e 100644 --- a/assets/stylesheets/template/widget/breadcrumb.scss +++ b/assets/stylesheets/template/widget/breadcrumb.scss @@ -15,10 +15,10 @@ } margin-left: 0; background-color:transparent; - a:link, a:visited { color: #848484; } + a:link, a:visited { color: #616161; } } .breadcrumb>li+li:before { - color: #848484; + color: #616161; } .widget-breadcrumb { &.widget1 { @@ -40,13 +40,13 @@ a { font-size: 0.9rem; letter-spacing: 2px; - color: #848484; + color: #616161; } &:last-child { a { - color: #848484; + color: #616161; pointer-events: none; } } diff --git a/home/index.html.erb b/home/index.html.erb index 42275c0..f20eb53 100644 --- a/home/index.html.erb +++ b/home/index.html.erb @@ -41,13 +41,6 @@ -