﻿@charset "utf-8";
/* CSS Document */
/* LeadsENV, ChuangYJ*/

/* (無障礙 AA) Tab操作焦點框線，於Chrome更明顯 */
/* 全站表單欄位焦點樣式強化 */
input:focus,
select:focus,
textarea:focus {
    outline: none; /* 移除瀏覽器預設淡色框 */
    border: 2px solid #0000FF; /* 藍色邊框，對比度高 */
    box-shadow: 0 0 3px 2px rgba(0,0,255,0.5); /* 額外藍色光暈，讓焦點更清楚 */
}

/*----主視覺設計-----*/
.visual-title1{
    color: white;
    font-weight: bold;
    font-family: "微軟正黑體","Apple LiGothic";
    text-shadow: 3px 3px 6px #00000095;
}
.visual-title2{
	color: white;
	font-weight: bold;
	font-family:Arial;
	text-shadow: 3px 3px 6px #00000095;
}

/*----頁面選單-----*/
.page-menu{
    background: #A0CB50;
    margin-bottom: 1em;
	text-decoration: none;
}

.page-menu-header{
	padding: 0.75rem 1.25rem;
    margin-bottom: 0;
	background-color:#A0CB50;
    /*background-color: rgba(0, 0, 0, 0.03); */
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

.page-menu-header > a{
    font-weight: bold;
    font-family: Arial, "微軟正黑體";
    color: white !important;
    text-shadow: 1px 1px 2px #005E2580;
    font-size: large;
}

.page-body{
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding: 1.25rem;
  background:#ADD268;
}
.page-body>ul>li{
	font-size: large;
	/*background:#F0FF00;*/
}

.page-body>ul>li>a{
	color: black !important;
	font-family: Arial, "微軟正黑體";
}

/*----內容-----*/
.notice-content > .col-md-12 >.media>.media-body > h5{
    background: #E0E3E6;
    border-radius: 0.5em;
	font-family: Arial, "微軟正黑體";
	font: bold;
}
.news-content > .col-md-12 >.media>.media-body > h5{
    background: #E0E3E6;
    border-radius: 0.5em;
	font-family: Arial, "微軟正黑體";
	font: bold;
}

.contact-content > .col-md-4 > ul > li >.media-body > h5{
    font-weight: bold;
    font-family: Arial, "微軟正黑體";
}

/*----頁尾-----*/
.footer{
    background: #343A40;
    color: white;
	min-height:100px;
}

/*----回到上方----*/
/*----(無障礙 AA) 置底返回箭頭----*/
.toTop-arrow {
    position: relative; /* 偽元素定位基準 */
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 50%;
    opacity: 0.8;
    background: #0000FF; /* 預設藍底 */
    cursor: pointer;
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    display: none;
}

    .toTop-arrow::before,
    .toTop-arrow::after {
        display: block;
        position: absolute;
        top: 50%;
        width: 18px;
        height: 5px;
        border-radius: 3px;
        background: #FFFF00; /* 黃色箭頭，與藍底對比度良好 */
        content: "";
    }

    .toTop-arrow::before {
        transform: rotate(-45deg) translate(0, -50%);
        left: 0.5rem;
    }

    .toTop-arrow::after {
        transform: rotate(45deg) translate(0, -50%);
        right: 0.5rem;
    }

    /* focus 與 hover 狀態：保持藍底 + 顯示粗黑色外框 */
    .toTop-arrow:focus,
    .toTop-arrow:hover,
    .toTop-arrow:active {
        outline: 4px solid #00AA55; /* 粗黑框線，對比度高 */
        outline-offset: 2px; /* 外框與按鈕間距，讓框線更清楚 */
        background-color: #0000FF; /* 保持藍底，不要變白 */
    }

        .toTop-arrow:focus::before,
        .toTop-arrow:focus::after,
        .toTop-arrow:hover::before,
        .toTop-arrow:hover::after,
        .toTop-arrow:active::before,
        .toTop-arrow:active::after {
            background: #FFFF00; /* 保持黃色箭頭，與藍底對比度良好 */
        }

/*----特殊排版用-----*/
 @media only screen and (max-width: 576px) {
	.mobile{display:block}
	.pc{display:none}
}

 @media only screen and (min-width: 576px) {
	.mobile{display:none}
	.pc{display:block}
	
 }
