@charset "utf-8";
/* CSS Document */

html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input,hr {margin:0; padding:0;}
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th {font-weight:normal; font-style:normal;}
ul,ol {list-style:none;}
ul	{list-style-image: url(../images/bullet.png);}
li	{list-style-position: outside;margin-left: 1em;}
fieldset,img,hr {border:none;}
caption,th {text-align:left;}
table {border-collapse:collapse; border-spacing:0;}
td {vertical-align:top;}
*	{	position:relative;	box-sizing: border-box;	-webkit-box-sizing: border-box;	}
.border {border:1px red solid;}
.blockEvent { -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; }
html, body	{height:100%;}

/* ================================================ */

body {font-size:1em;font-family: Verdana, "微軟正黑體", "Microsoft YaHei", "新細明體", sans-serif; background-color:white; color:#313131;}
h1,h2,h3{font-size:1.3em;}
h4,h5,h6{font-size:1em;}
.textColor1, a {color:#3751a7;}
a {text-decoration:none;}
a:hover, a:active{color:#e95377;}
.hide {display:none !important;}

.back-to-top {position:fixed; right:30px; bottom:80px; opacity:0; visibility:hidden; transition:opacity 0.3s ease, visibility 0.3s ease;}
.back-to-top.show {opacity:1; visibility:visible;}
.back-to-top a {opacity:0.7; background:#FFF; color:#666; padding:0 5px; text-decoration:none; font-size:1.3em; border-radius:50%; vertical-align:top; width:30px; height:30px; display:inline-block; border:1px #999 solid;} /*20250917*/
.back-to-top a:hover {opacity:0.7;}

/* ================================================ */

.page_container {margin:0 auto; min-width:974px; max-width:1200px;	min-height: 100%;}
.page_container a {text-decoration:none;}

.top_menu {width:100%; height:36px; position:relative; background-color:#d32027; color:white; border: 0px solid rgb(224, 224, 224); border-top-width: 0px; border-bottom-width: 0px;}
.top_menu>.con {position:absolute; right:0px; top:0px;}

.top_menu>.con>a {float:right; margin:0px; position:relative; height:36px; color:#fff; padding:0px 8px; cursor:pointer; z-index:1;background-color:transparent;}
.top_menu>.con>a:hover {background-color:#ef4b3c;}
.top_menu>.con>a>span {line-height:35px; vertical-align:middle; font-size:0.9em; text-shadow:0px 1px 3px #333;}

.top_menu icon {width:25px; height:34px; position:relative; left:0px; top:0px; display:inline-block;
    vertical-align:middle; line-height:35px;} /*20250909*/
.top_menu icon>.icon {width:25px; height:26px; margin:5px 0px 2px 0px;
    background:url(../images/web_img.png) -930px -270px;}
.top_menu icon>.icon.i_home {background-position: -930px -190px;}
.top_menu icon>.icon.i_media {background-position: -930px -220px;}
.top_menu icon>.icon.i_oweb {background-position: -930px -250px;}
.top_menu>.bgL {position: absolute; top: 0; right:0px; width:1200px; height:36px;
    background:none;}

.logo_bar {width:100%; height:200px; position:relative; background-color:transparent;} /*20250917*/
.logo_bar>.bgR {
    position: absolute;
    right: 0px;
    top: 30px;}
.logo_bar>.bgL {
    width:975px; /*20250917*/
    height: 200px; /*20250917*/
    background-image: url(../images/top_bg.png);
    position: absolute;
    top: 0;
    right: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top right;
}
.logo_bar>.con {position:absolute; left:0px; top:0px; /*background: #FFF; border-radius: 0 102px 102px 0; 20250917*/height: 198px; padding-right: 50px;}
.logo_bar>.con>a {display:inline-block; float:left; }

.logo_bar>.con>.logo_1 {
    width:150px;
    height:170px;
    margin:22px 55px 0px 25px;/*20250917*/
    cursor:pointer;
    vertical-align: top;
    background:url(../images/main_logo_1.png);
    border-radius: 200px;
    background-color: #FFF;
    background-position: left 0px;
    background-repeat: no-repeat;
    background-size: 150px;
}
.logo_bar>.con>.logo_2 {
    width: 285px;
    height: 198px;
    cursor: pointer;
    background: url(../images/main_logo_2.png) 100% 100%;
    position: relative;
    display: inline-block;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
*[lang="zh"] .logo_bar>.con>.logo_2 {background-image: url(../images/main_logo_2_chi.png)} /*20250925*/

.footer_upper {width:100%; height:100px; clear:both; position:relative;}
.footer {width:100%; height:50px; clear:both; position:absolute; bottom:0; font-size:0.9em;}
.footer>.bgA {width:1200px; position:absolute; height:15px; right:0px; bottom:0px; background:#182249;} /*20250917*/
.footer>.bgL {}
.footer>.bgR {}
.footer>.con {padding:11px 0px 0px 10px; position:absolute; left:0px; top:0px;}
.footer>.con>a {display:inline-block; position:relative; cursor:pointer; color:#313131;}
.footer>.con>a:hover {color:#2173b9;}
.footer>.con>a:active {color:#2173b9;}
.footer>.right_con {padding:11px 10px 0px 0px; position:absolute; right:0px; top:0px;}
.footer>.right_con>a {cursor:pointer; color:#4c4c4c; display:inline;}
.footer>.right_con>a:hover {color:#2173b9;}
.footer>.right_con>a:active {color:#2173b9;}

.content_area {width:100%; position:relative;}
.content_area::after
{
    display: block;content:"";
    width:100%;height:0;
    clear:both;visibility: hidden;
}

.content_area>.box_left {
    width:225px;
    height:530px;
    float:left;
    position:relative;
    padding-top: 10px;
    padding-left: 5px;
}
.content_area>.box_left>.menu_line {
    width:17px;
    height:774px;
    position:absolute;
    right:-1px;
    top:10px;
    background:url(../images/menu_line.png);
    background-size:100% 100%;

}
.content_area>.box_left>.main_menu {width:208px;}
.content_area>.box_left>.main_menu>a {
    display:block;
    padding:11px 8px;
    border:0px solid rgb(224, 224, 224);
    border-radius:2px;
    border-top-width:0px;
    border-bottom-width:1px;
    color: #4c4c4c;
    cursor:pointer; /*white-space:nowrap; 20210712*/
}
.content_area>.box_left>.main_menu>a:hover {color:#2173b9;}
.content_area>.box_left>.main_menu>a:active {color:#2173b9;}
.content_area>.box_left>.main_menu>a.selected {font-weight:bold; background-color:#F5F5F5; pointer-events:none;}
.content_area>.box_left>.main_calender {margin-top:35px;}



.ui-datepicker {width:16em; z-index:2;}
.ui-datepicker table {table-layout:fixed;}
.ui-widget-content {border:0px;}
.ui-widget-header {border:0px; background:none; font-size:1.1em; font-weight:normal;}
.ui-datepicker th {text-align:center; font-weight:normal;}
.ui-datepicker td span, .ui-datepicker td a {text-align:center;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    border:0px; background:none; padding-bottom:10px; }
.ui-icon-circle-triangle-e { background-position: -33px 0px; }
.ui-icon-circle-triangle-w { background-position: -97px 0px; }
.content_area>.box_left>.main_calender .act_day {background:url(../images/calender_star.png) no-repeat;}
.ui-datepicker td.ui-datepicker-current-day.ui-datepicker-today {border:1px #CCC solid; padding:0px;}


.content_area>.box_right {
    width:calc(100% - 225px);
    float:left;
    padding:0px 15px;
    min-height:720px;
    padding-top: 10px;
    padding-left:25px!important; /*20250925*/
}
.content_area.index>.box_right {padding:0px; margin:0px;}
.content_area>.box_right>div {padding:15px 15px 0 15px;}

.content_area>.box_right:before
{
    content:"";
    position:absolute; top:-30px; left:0; overflow:hidden; padding:0;
    width:100%; height:142px;
    background:url(../images/top_bgMask.png) no-repeat;
    background-size:975px 142px ;
}

.content_area .date {font-family:sans-serif; letter-spacing:0.5px;}
.content_area .page_top {font-size:1.8em;}
.content_area .page_media .icon,
.content_area .page_result .icon,
.content_area .page_schedule .icon
{width:25px; height:26px; margin:4px; background:url(../images/web_img.png) -930px -270px;}
.content_area .icon.i_datePick {background-position: -930px -40px;}
.content_area .icon.i_pullDown {background-position: -930px -70px;}
.content_area .icon.i_search {background-position: -930px -100px;}
.content_area .icon.i_dlSchedule {background-position: -930px -130px;}
.content_area .icon.i_dlSchedule:hover, .content_area .icon.i_dlSchedule:hover {background-position: -960px -130px;}
.content_area .icon.i_dlMedia {background-position: -930px -160px;}
.content_area .bluebtn, input.button {position:relative; padding:8px 12px; width:120px; cursor:pointer; color:white; text-align:center; margin-top:5px; display:block;
    -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none;  color: rgb(33, 33, 33); color: #333; background-color: #d5b871;} /*20250917*/
.content_area .bluebtn:hover, input.button:hover {
    color: #FFF; border: none; background-color: #d5b871;} /*20250917*/
.content_area .bluebtn:active, input.button:active {
    color: #fff; border: none; background-color: #d5b871;} /*20250917*/

.content_area .bluebtn.alternate {
    background-color: #d5b871;}/*20250917*/
.content_area .bluebtn.alternate:hover,
.content_area .bluebtn.alternate:active {
    background-color: #334d82;}



.content_area .table_base {width:100%!important; /*20210525*/}
.content_area .table_base th, .content_area .table_base td {
    vertical-align:middle; text-align:center;}
.content_area .table_base.blue thead>tr:first-child>th {background-color:#3751a7; border:1px 3751a7 solid;}
.content_area .table_base th {padding:20px 10px; background-color:#334d82; color:white;}
.content_area .table_base.blue th {background-color: #0095e9; border: 1px #0095e9 solid;}
.content_area .table_base td {border:1px #CCC solid; border-top:0px; padding:10px 5px;}
.content_area .table_base tbody td {font-size:0.9em;}
.content_area .table_base.green th {white-space:nowrap; padding-right:20px;}

.content_area .horizontal_table {width:100%;}
.content_area .horizontal_table td {border:1px #CCC solid; padding:8px 15px;}
.content_area .horizontal_table tr td:first-child {background-color:#334d82; color:white; border:1px #2f7683 solid;}


table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc {
    cursor: pointer;
    *cursor: hand;
}
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    background-repeat: no-repeat;
    background-position: center right;
}
table.dataTable thead .sorting {
    background-image: url("../images/sort_both.png");
}
table.dataTable thead .sorting_asc {
    background-image: url("../images/sort_asc.png");
}
table.dataTable thead .sorting_desc {
    background-image: url("../images/sort_desc.png");
}
table.dataTable thead .sorting_asc_disabled {
    background-image: url("../images/sort_asc_disabled.png");
}
table.dataTable thead .sorting_desc_disabled {
    background-image: url("../images/sort_desc_disabled.png");
}




.page_home {width:100%; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between;}
.content_area>.box_right>div.page_home {padding-top:30px;}/*20250925*/
.page_home img {max-width:100%; max-height:300px; cursor:pointer;}/*210730*/
.page_home .info {}
.page_home .info>.title {line-height:23px;	margin-left: 7px;	margin-right: 7px;	}
.page_home .info>.date {font-size:0.9em; margin:5px 7px;	}
.page_home .info>.detail {font-size:0.9em; max-height:60px; overflow:hidden;
    margin:0px 7px 15px 7px; line-height:19px;}
.page_home>.topic_big {width:100%; height:auto; position:relative; margin-bottom:30px; min-height:210px;}/*230606*/
.page_home>.topic_big img {max-height:none; width:100%;}
.page_home>.topic_big>.info {background-color:rgba(0, 0, 0, .75); color:white; padding:30px 10px 0px 10px; position:absolute; bottom:0px; width:100%;}
.page_home>.topic_big .info>.title,	.page_home>.topic_big .info>.date
{	font-weight:bold;	}
.page_home>.topic_big .info>.title,	.page_home>.topic_big .info>.date,	.page_home>.topic_big .info>.detail
{	margin-left: 30px;	margin-right: 30px;	}
.page_home>.topic_small {
    width: calc(50% - 10px);
    position:relative;
    display:flex;
    flex-wrap:wrap;
    flex-direction:column;
    margin-bottom:30px;
    vertical-align:text-top; transition: all 0.3s ease 0s;
    overflow: visible;
    border-radius: 15px;
    position: relative;
    /* box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px 0px; */
    -webkit-box-pack: justify;}
.page_home>.topic_small>a {max-height:300px; text-align:center;}/*210730b*/
.page_home>.topic_small:nth-child(odd) {}/*210730*/
.page_home>.topic_small>.info {padding:22px 16px;;}
.page_home>.topic_small>.info>.title {color:#334d82;}
.page_home .topic_small.home_pr .info .detail table {overflow-wrap:anywhere;} /*20240730*/

.page_topic>.title {color:#333333; line-height:1.5em; font-size:1.3em; font-weight:bold;/*20210601*/}
.page_topic>.date {margin:15px 0px;}
.page_topic>table {width:100%}
.page_topic>table .paragraph {line-height:1.7em; font-size:15px;}
.page_topic>table .paragraph div {min-height:1.2em;} /*20230703*/
.page_topic>table .paragraph img {margin:5px 20px;}
.page_topic>table .paragraph a {display:inline-block; color:#334d82; word-break:break-word;} /*20230914*/
.zh .detail, .zh .paragraph {word-break:break-word;} /*20230914*/
.page_topic>table .paragraph a:hover {color:#e95377;}
.page_topic>table .paragraph a:active {color:#e95377;}
.page_topic>table .pic_column {float:right;}
.page_topic>table .pic_column img {display:block; margin:0px 0px 10px 30px;} /*20230816*/
.attach {margin-top:20px; margin-bottom:30px;} /*20230816*/
.attach h4 {font-size:16px; font-weight:bold; color:#334d82; margin-bottom:10px;} /*20230816*/
.attach li {position:relative; margin-bottom:5px;} /*20230816*/
.attach li:before {position:absolute; content:''; width:16px; height:16px; background-image:url("../images/icon_attach.png"); display:inline-block; top:2px;} /*20230816*/
.attach li a {padding-left:22px; line-height:1.3; text-align:left;} /*20230816*/



.page_press>.item {display:table; padding:20px 0px; border-bottom:1px #EEE solid; cursor:pointer; width:100%; /*20210525*/}
.page_press>.item>img {width:180px;}
.page_press>.item>div {display:table-cell; vertical-align:middle; padding-left:20px; width:100%; /*20210525*/}
.page_press>.item>div>.date {margin-bottom:5px;	color:#313131;}
.page_press>.item>div>.title {color:#334d82; line-height:1.5em;}
.page_press>.item:hover>div>.title {color:#e95377;}
.page_press>.item:active>div>.title {color:#e95377;}

.page_promotion>.item {display:table; padding:20px 0px; border-bottom:1px #EEE solid; cursor:pointer; width:100%;}
.page_promotion>.item>img {width:180px;}
.page_promotion>.item>div {display:table-cell; vertical-align:middle; padding-left:20px; width:100%;}
.page_promotion>.item>div>.date {margin-bottom:5px;	color:#313131;}
.page_promotion>.item>div>.title {color:#3751a7; line-height:1.5em;}
.page_promotion>.item:hover>div>.title {color:#e95377;}
.page_promotion>.item:active>div>.title {color:#e95377;}
.page_promotion .drawing {text-align:center;}
.page_promotion .drawing img {max-width:220px;}
.page_promotion .drawing-name {text-align:center;}

.content_area .tool_box {display:table; width:100%; position:relative; margin:35px 0px;	z-index:1;}
.content_area .tool_box>div {display:table-cell; vertical-align:top;}
.content_area .tool_box>div:nth-child(1) {width:170px; text-align:left;}
.content_area .tool_box>div:nth-child(2) {text-align:left;}
.content_area .tool_box>div:nth-child(3) {text-align:right;}
.content_area .tool_box>div>div {display:inline-block; position:relative; background:white;}
.content_area .tool_box>div>.date_picker_con {padding:8px; border:1px #CCC solid;
    width:160px; border-radius:5px;}
.content_area .tool_box>div>.date_picker_con>input {font-family: Verdana, "微軟正黑體", "Microsoft YaHei", "新細明體", sans-serif;
    font-size:1em; width:105px; border:none;}
.content_area .tool_box>div .icon_con {width:34px; height:34px; position:absolute; right:0px; top:0px; cursor:pointer; border-radius:5px;}
.content_area .tool_box>div .icon_con:hover, .content_area .tool_box>div .icon_con:active,
.content_area .tool_box>div>.pull_down:hover>.icon_con, .content_area .tool_box>div>.pull_down:active>.icon_con
{background-color:#EEE;}
.content_area .tool_box>div>.pull_down {padding:8px; border:1px #CCC solid;
    width:250px; border-radius:5px; cursor:pointer; z-index:1;}
.content_area .tool_box>div>.pull_down>.current {display:inline-block; padding-right:35px;}
.content_area .tool_box>div>.pull_down>.menu {position:absolute; border:1px #CCC solid; width:250px;
    padding:5px 0px; margin:8px 0px 0px -9px; border-radius:5px; background-color:white; display:none;}
.content_area .tool_box>div>.pull_down>.menu>div {padding:7px 10px;}
.content_area .tool_box>div>.pull_down>.menu>div:hover {background-color:#e95377; color:white;}
.content_area .tool_box>div>.search_bar {padding:8px; border:1px #CCC solid; text-align:left;
    width:200px; border-radius:5px;}
.content_area .tool_box>div>.search_bar>input {width:160px; border:0px; font-size:1em; margin:0px;
    padding:0px 0px 0px 5px; outline:none;}
.content_area .more_con {width:100%; text-align:center; margin:10px;}
.content_area .more_con>.bluebtn {display:inline-block;}

.content_area .remark {margin:-15px 0px 5px 0px; font-size: 0.9em; color:#999;}

.content_area .tool_box #scheduleCalendar
{position:absolute;	top:100%;	left:0;	margin-top:-1px;	border:1px solid #CCC;	border-radius:5px;}

.page_schedule .icon_con {}
.page_schedule .icon_con>.icon {display:inline-block; cursor:pointer;}




.page_delegation>.page_top {margin-bottom:30px;}
.content_area>.box_right>div.page_delegation {padding:15px 0 0 15px;}

.page_delegation>.filter-list {display:block;}
.page_delegation>.filter-list.pink-li {margin-bottom:5px;}
.page_delegation>.filter-list.blue-li {margin-bottom:40px; border-bottom:2px #DDD solid; padding-bottom:30px;}
.page_delegation>.filter-list>.item {display:inline-block; font-size:1em; color:#0d2455; width:220px; vertical-align:top; border-radius:4px; padding:5px 10px; margin:2px 0;}
.page_delegation>.filter-list>.item:hover {background-color:#EEE; color:#334d82;}
.page_delegation>.filter-list>.item img {display:table-cell; width:44px; height:44px; vertical-align:middle;}
.page_delegation>.filter-list>.item .item-name {display:table-cell; color:#000000; height:40px; padding:0 0 0 5px; vertical-align:middle;}
.page_delegation>.filter-list>.item:hover .item-name{color:#000000;}
.page_delegation>.filter-list>.item table td:first-child {width:40px;}

.page_delegation>.team {display:block; margin-bottom:10px;}
.page_delegation>.team>.tName {position:relative; padding:0px 0px 3px 10px; font-size:1.5em; color:#3751a7;
    margin:10px 0px 10px 13px; width:96%;}
.page_delegation>.team>.tName::before {
    content: "";
    display: inline-block;
    width: 31px;
    height: 31px;
    background: url(../images/subject.png);
    vertical-align: top;
    margin: 0 10px 0 -15px;
}
.page_delegation>.team>.tName_athlete {position:relative; padding:0px 0px 3px 0px; font-size:1.5em; color:#0d2455;
    margin:0px 0px 15px 0px; vertical-align:middle;}
.page_delegation>.team>.tName_athlete.pink {color:#334d82;}
.page_delegation>.team>.tName_athlete>img {width:50px; height:50px; vertical-align:middle; margin-right:10px; margin-top:-8px;}

.page_delegation>.team>.con {padding:0px 0px 0px 8px;}
.page_delegation>.team>.con>.item {vertical-align:text-top; width:150px; display:inline-block; margin-right:23px; margin-bottom:20px; text-align:center;}
.page_delegation>.team>.con>.item>.photo {position:relative; width:150px; height:179px;
    box-shadow:0px 1px 8px #CCC; border-radius: 6px; overflow: hidden; margin: 0 auto;}
.page_delegation>.team>.con>.item.athlete {cursor:pointer;}
.page_delegation>.team>.con>.item.athlete>.photo::after {
    content: "i";
    position: absolute;
    right: 3px;
    top: 3px;
    width: 26px;
    height: 26px;
    background: none;
    background: #de0000;
    border-radius: 100%;
    border: 4px solid #fff;
    line-height: 26px;
    color: white;
    font-style: italic;
    font-family: Times New Roman, serif;
    font-size: 20px;
    font-weight: bold;
}
.page_delegation>.team>.con>.item>.photo>img {width:100%; }
.page_delegation>.team>.con>.item>.pName {color:#333333; margin:10px 0px 5px 0px;}
.page_delegation>.team>.con>.item>.duty {font-size:0.9em; color:#555;}
.page_delegation>.team>.con>.item.athlete:hover>.photo, .page_delegation>.team>.con>.item.athlete:active>.photo
{outline:1px #61BE9A dotted;}
.page_delegation>.team>.con>.item.athlete:hover>.pName {color:#e95377;}
.page_delegation>.team>.con>.item.athlete:active>.pName {color:#e95377;}



.page_athlete>.bluebtn {float:right;}
.page_athlete>.page_top {margin-bottom:30px;}
.page_athlete>.athlete_table {}
.page_athlete>.athlete_table td {padding:0px 20px 0px 0px;	height:16.66667%;	}
.page_athlete>.athlete_table td:nth-child(1) {white-space:nowrap;}
.page_athlete>.athlete_table img { width:200px;}
.page_athlete>.divide_line {    width: 100%;
    height: 1px;
    background-color: #ffdd32;
    position: relative;
    margin: 20px 0 20px 0px;}
.page_athlete>.divide_line>.head {width:34px; height:14px; position:absolute; left:67px; top:0px;
    background:url(../images/web_img.png) -1000px -40px;}
.page_athlete>.divide_line>.tail {
    width: 93px;
    height: 69px;
    position: absolute;
    right: 0px;
    top: -41px;
    background-color: #ffdd32;
    background-image: url(../images/divider.png);
    background-image: none;
    background-position: top right;
    background-repeat: no-repeat;}
.page_athlete>.subtitle {font-size:1.3em;}
.page_athlete>.table_base.blue {margin:20px 0px 40px 0px; width:100%;}
.page_athlete>.table_base.blue td:nth-child(1) {width:100px;}



.page_about>span, .page_terms>span, .page_privacy>span {line-height:1.7em;}
.page_about, .page_terms, .page_privacy {font-size:15px; line-height:1.7em} /*230703*/
.page_about>.page_top {margin-bottom:20px;}
.page_about>.page_about_left {overflow:hidden; display:block; line-height:1.7em; font-size:15px;} /*230703*/
.page_about .page_about_left {text-align: justify;}
.page_about>.page_about_right {float:right; width:230px; padding:15px; padding-right:0px; margin:0px 10px 0px 30px;}
.page_about>.page_about_right img {width:100%; margin:0;}
.page_about_photo_left{float: left; margin-right: 20px;}
.page_about_photo_left + div{overflow: hidden;}
.page_about h1 {font-size:21px; font-weight:bold; color:#334d82; margin-bottom:15px;} /*230703*/
.page_about ul {list-style-type:circle; list-style-position: inside; margin-left:10px;}
.page_about p {clear:both; margin-bottom:30px; font-size:15px; line-height:1.7em;} /*230703*/
.page_about table {}
.page_about table th, .page_about table td
{border:0px; padding:8px 5px;}
.page_about table th {font-weight:bold; color:white; background:#E17816; border:1px #E17816 solid;}
.page_about table td {border:0;}
.page_about .photo_des {font-size:0.9em;}
.page_about ul {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    list-style-type: disc;
}
.page_about li{
    display: list-item;
    text-align: -webkit-match-parent;
    unicode-bidi: isolate;
}
.page_about ul > li {
    margin-left: 1em;
    padding-left: 0.5rem;
}
.page_about li::marker {
    unicode-bidi: isolate;
    font-variant-numeric: tabular-nums;
    text-transform: none;
    text-indent: 0px !important;
    text-align: start !important;
    text-align-last: start !important;
}


.page_welcome>.page_top {margin-bottom:30px;}
.page_welcome .text {margin:0 10px; line-height:1.7em; font-size:15px;} /*230703*/
.page_welcome .name {color:#334d82; margin:20px 0px 5px 0px; font-size:1.3em;}
.page_welcome .role {color:#334d82; font-size:.9em; line-height:1.5;}
.page_welcome .page_content {display:flex; flex-direction:row; width:100%; flex-wrap:wrap;}
.page_welcome .page_content_left {width:250px;}
.page_welcome .page_content_right {width:calc(100% - 250px); text-align: justify;}

.page_terms h1 {font-size:1.1em; margin:30px 0px 15px 0px;}
.page_privacy h1 {font-size:1.1em; margin:30px 0px 10px 0px;}
.page_privacy>.con {margin-bottom:10px;}
.page_privacy>.con>.blueblock {background-color:#61BE9A; width:5px; height:15px; display:inline-block;
    vertical-align:text-top; margin-top:2px;}
.page_privacy>.con>.point {display:inline-block; width:calc(100% - 50px); vertical-align:text-top;}
.page_privacy ul {list-style-type: square; list-style-position: inside;}
.page_privacy table td {padding-bottom:5px; line-height:1.5em;}



.page_login>span {color:#EF6F5A; line-height:1.5em;}
.page_login>.login_form {margin:15px 0px 0px 50px;}
.page_login>.login_form>table {margin-bottom:8px;}
.page_login>.login_form>table td {padding:8px 15px 10px 0px; vertical-align:middle;}
.page_login>.login_form>table td>input {outline:none; padding:6px 10px; font-size:1em; width:180px;
    border-radius:5px; border:1px #CCC solid;}
.page_login>.login_form>input.button {margin-top:15px;}

.page_login>.login_form p {margin-bottom:18px;}
.page_login>.login_form .login-username label, .page_login>.login_form .login-password label
{    min-width: 110px;	display: inline-block;}
.page_login>.login_form .input {outline:none; padding:6px 10px; font-size:1em; width:170px;
    border-radius:5px; border:1px #CCC solid; margin-left:10px;}
.page_login>.login_form input.button {position:relative; padding:7px 0px; width:108px; cursor:pointer;
    color:white; text-align:center; margin-top:5px; border:none; outline:none;
    -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; font-family: Verdana, "微軟正黑體", "Microsoft YaHei", "新細明體", sans-serif; font-size:1em;}


.page_media>.page_top {margin-bottom:20px;}
.content_area .page_media>.table_base.blue {width:100%; margin-bottom:30px;}
.content_area .page_media>.table_base.blue thead>tr:first-child>th {
    padding:8px 15px; vertical-align:middle; line-height:34px; text-align:left;}
.content_area .page_media>.table_base.blue td {line-height:1.3em; text-align:left; padding:8px 15px;}
.content_area .page_media>.table_base.blue td:first-child {width:43%;}
.page_media .icon_con {width:34px; height:34px; float:right; cursor:pointer; border-radius:5px;}
.page_media .icon_con:hover {background-color:rgba(255, 255, 255, .4);}


/*onetrust 20210721*/
#onetrust-consent-sdk #onetrust-accept-btn-handler, #onetrust-banner-sdk #onetrust-reject-all-handler {background-color:#002163!important; border-color:#002163!important;}
#onetrust-consent-sdk *:focus {outline:none!important;}
#onetrust-consent-sdk #onetrust-pc-btn-handler, #onetrust-consent-sdk #onetrust-pc-btn-handler.cookie-setting-link {color:#002163!important; border-color:#002163!important;}
/*#onetrust-banner-sdk.otFloatingRoundedIcon {left:50%!important; transform:translateX(-50%)!important;} 20210803*/
#onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn), #onetrust-consent-sdk #onetrust-pc-sdk .ot-leg-btn-container .ot-active-leg-btn {background-color:#002163!important; border-color:#002163!important;}
@media only screen and (min-width: 1024px) {
    #onetrust-banner-sdk:not(.vertical-align-content) #onetrust-button-group-parent {margin-left:75%!important;}
    #onetrust-banner-sdk #onetrust-button-group-parent {left:75%!important;}
}
#onetrust-consent-sdk #onetrust-policy-text {font-size:1em!important;} /*20210803*/
#onetrust-consent-sdk #onetrust-button-group {font-size:1em!important;} /*20210803*/
#onetrust-consent-sdk .ot-sdk-row {height:inherit!important;} /*20210803*/
@media only screen and (max-width: 900px) { /*20210803*/
    #onetrust-consent-sdk #onetrust-banner-sdk {
        height:inherit!important;
        max-height:33vh!important;
    }
}

/*20240719*/
.flex{
    display: flex;
    justify-content: center;

}
.flex .page_about_right {
    flex: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-left:30px;
}

.flex .page_about_right img {
    width:220px;
}

.flex .page_about_left {
    flex: 1;
}

/*download page responsive*/
.page_download_qrcode {display:flex; flex-direction:row; width:100%; flex-wrap:wrap;}
.page_download_qrcode > div a, .page_download_qrcode > div span {width:180px; display: block; text-align:center;}


/*responsive css 20250909*/

/* =================================================== */
/* HAMBURGER MENU STYLES */
/* =================================================== */

/* Hamburger button - hidden by default, shown on mobile */
.hamburger-btn {
    display: none;
    position: absolute;
    top: 50%;
    left: 5px;
    transform: translateY(-50%);
    z-index: 1002;
    background: transparent;
    border: none;
    width: 40px;
    height: 40px;
    cursor: pointer;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    transition: all 0.3s ease;
}

.hamburger-btn:hover {
    background: transparent;
    transform: translateY(-50%) scale(1.05);
}

.hamburger-btn span {
    display: block;
    width: 25px;
    height: 3px;
    background: #fff;
    transition: all 0.3s ease;
    border-radius: 2px;
}

/* Hamburger animation when active */
.hamburger-btn.hamburger-active span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}

.hamburger-btn.hamburger-active span:nth-child(2) {
    opacity: 0;
}

.hamburger-btn.hamburger-active span:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
}

/* Sidebar overlay for mobile */
.sidebar-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 999;
}

.sidebar-overlay.active {
    display: block;
}

/* =================================================== */
/* RESPONSIVE DESIGN - MOBILE FIRST APPROACH */
/* =================================================== */

/* Tablet Landscape: 1024px and below */
@media only screen and (max-width: 1024px) {
    .page_container {
        min-width: auto;
        max-width: 100%;
        margin: 0;
    }

    .logo_bar > .con {
        padding-right: 30px;
    }

    .logo_bar > .con > .logo_1 {
        width: 120px;
        height: 140px;
        margin: 30px 20px 0px 20px;/*20250917*/
        background-size: 120px;
    }

    .content_area > .box_left {
        box-shadow: none;
    }

    .content_area > .box_right {
        width: calc(100% - 225px - 10px);
        padding: 0px 10px;
        padding-left: 10px!important;
    }

    #pGallery .cover-item {width:48%!important;}

    .page .page-header {
        height:auto!important;
    }

    /*about page responsive*/
    .page_about .flex {
        flex-wrap:wrap;
    }
    .page_about .flex .page_about_left, .page_about .flex .page_about_right {
        width:100%; flex:none; justify-content: center; /*20250925*/
    }
    .page_about_photo_left {
        float: none; text-align:center;
    }
    .page_about_photo_left img {
        max-width:100%;
    }
}

/* Tablet Portrait: 768px and below */
@media only screen and (max-width: 768px) {

    /* Show hamburger button */
    .hamburger-btn {
        display: flex;
    }

    .top_menu {
        position: fixed;
        top:0;
        left:0;
        z-index:1003;
    }

    /* Header adjustments */
    .top_menu > .con > a {
        padding: 0px 6px;
        font-size: 0.8em;
    }

    /* Logo bar responsive */
    .logo_bar {
        height: 160px;
        margin-top: 50px; /*20250917*/
    }

    .logo_bar > .con {
        height: 160px;
        padding-right: 25px;
    }

    .logo_bar > .con > .logo_1 {
        width: 100px;
        height: 120px;
        margin: 20px 20px 0px 15px;/*20250917*/
        background-size: 100px;
    }

    .logo_bar > .con > .logo_2 {
        width: 230px;
        height: 160px;
    }

    .logo_bar > .bgL {/*20250917*/
        background-size: contain;
        height: 80%;
        bottom: 0;
        top: inherit;
    }

    /* Content area responsive layout */
    .content_area {
        display: block;
        border-top:none;
        background:#fff;
    }

    /* Hide sidebar by default on mobile */
    .content_area > .box_left {
        position: fixed;
        top: 0;
        left: -280px;
        width: 280px;
        height: 100vh;
        background: white;
        z-index: 1000;
        padding: 50px 20px 20px 20px;
        transition: left 0.3s ease;
        overflow-y: auto;
    }

    /* Show sidebar when open */
    .content_area > .box_left.sidebar-open {
        left: 0;
        box-shadow: 2px 0 10px rgba(0,0,0,0.3);
    }

    .content_area > .box_left > .menu_line {
        display: none;
    }

    .content_area > .box_left > .main_menu {
        width: 100%;
        display: block;
    }

    .content_area > .box_left > .main_menu > a {/*20250917*/
        display: block;
        width: 100%;
        text-align: left;
        padding: 12px 15px;
        margin-bottom: 2px;
        font-size: 0.95em;
        transition: all 0.2s ease;
    }

    .content_area > .box_left > .main_menu > a:hover {
        background-color: #f0f0f0;
        color: #334d82;
    }

    .content_area > .box_left > .main_calender {
        margin-top: 30px;
        text-align: center;
    }

    .content_area > .box_right {
        width: 100%;
        float: none;
        border-left: none;
        margin: 0;
        min-height: auto;
        padding:0!important;
    }
    .content_area>.box_right>div.page_home {padding:0;}

    /* Home page topic cards responsive */
    .page_home > .topic_small {
        width: 100%;
        margin-bottom: 20px;
    }
    .page_home>.topic_small>a {max-height:none;}
    .page_home > .topic_small img {width:auto; height:auto; max-width:100%; max-height:none;}

    .page_home > .topic_big {
        margin-bottom: 20px;
        min-height: auto;
    }
    .page_home>.topic_big img {border:none;}

    .page_home > .topic_big > .info {
        padding: 20px 10px 0px 10px;
        position: relative;
        background-color:#f9f9f9;
        bottom:3px;
    }

    .page_home > .topic_big .info > .title,
    .page_home > .topic_big .info > .date,
    .page_home > .topic_big .info > .detail {
        margin-left: 15px;
        margin-right: 15px;
        color:#333;
    }

    /*welcome page responsive*/
    .page_welcome .page_content_left {width:100%; text-align:center;}
    .page_welcome .page_content_right {width:100%; margin-top:20px;}

    /* Table responsive */
    .content_area .table_base {
        font-size: 0.85em;
        overflow-x: auto;
        display: block;
        white-space: nowrap;
    }

    .content_area .table_base table {
        min-width: 600px;
    }

    .content_area .table_base th,
    .content_area .table_base td {
        padding: 8px 5px;
    }

    /* Tool box responsive */
    .content_area .tool_box {
        display: block;
    }

    .content_area .tool_box > div {
        display: block;
        margin-bottom: 10px;
        text-align: left!important;
    }

    .content_area .tool_box > div > .date_picker_con,
    .content_area .tool_box > div > .pull_down,
    .content_area .tool_box > div > .search_bar {
        width: 100%;
        max-width: 300px;
    }

    /* Delegation page responsive */
    .page_delegation > .filter-list > .item {
        width: calc(50% - 15px);
        margin: 5px;
    }

    /*page topic responsive*/
    .page_topic>table .paragraph {
        display:block;
    }

    .page_topic>table .pic_column {
        display:flex; flex-direction:row; width:100%; flex-wrap:wrap;
    }

    .page_topic>table .pic_column img {
        width:48%; margin:10px 10px 0 0;
    }

    /* About page responsive */
    .flex {
        flex-direction: column;
    }

    .flex .page_about_right {
        order: -1;
        width: 100%;
        text-align: center;
        padding: 0;
        margin: 0 0 20px 0;
    }

    .flex .page_about_left {
        width: 100%;
    }

    .page_about > .page_about_right {
        float: none;
        width: 100%;
        text-align: center;
        padding: 0;
        margin: 0 0 20px 0;
    }

    .page .page-header-filter .page-searchBox + .page-sort {display:flex; flex-direction:row; width:100%; padding:6px 10px!important; font-size:0.5em;}
    .page .page-header-filter .page-sort > div:first-child, .page .page-filter > div:not(.page-filter-toggle):nth-child(2n-1) {flex-grow:1;}

    .page_delegation > .team > .con {
        display:flex; flex-direction:row; width:100%; flex-wrap:wrap;
    }

    /* Button optimization */
    .content_area .bluebtn {
        padding: 8px 15px;
        margin:0 auto;
    }

    /* Footer responsive */
    .footer {
        font-size: 0.8em;
        height: auto;
        padding-bottom: 10px;
    }

    .footer > .con {
        position: relative;
        padding: 10px;
        text-align: center;
    }

    .footer > .right_con {
        position: relative;
        padding: 5px 10px;
        text-align: center;
    }
}

/* Mobile Landscape: 640px and below */
@media only screen and (max-width: 640px) {
    /* Further optimize for smaller screens */
    .logo_bar {
        height: 140px;
    }

    .logo_bar > .con {
        height: 140px;
        padding-right: 20px;
    }

    .logo_bar > .con > .logo_1 {
        width: 80px;
        height: 100px;
        margin: 20px 20px 0px 15px;/*20250925*/
        background-size: 80px;
    }

    .logo_bar > .con > .logo_2 {
        width: 201px;
        height: 140px;
    }

    /* Hamburger button adjustment for smaller screens */
    .hamburger-btn {
        left: 10px;
    }

    .page_delegation > .filter-list > .item {
        width: 100%;
        margin: 2px 0;
    }
    /*page topic responsive*/
    .page_topic>table .pic_column img {width:100%;}

    #pGallery .cover-item {width:100%!important;}

}

/* Mobile Portrait: 480px and below */
@media only screen and (max-width: 480px) {
    /* Top menu optimization */
    .top_menu {
        padding: 5px 0;
    }

    .top_menu > .con > a {
        background: transparent;
    }

    /* Logo bar further optimization */
    .logo_bar {
        height: 110px;
    }

    .logo_bar > .bgL {/*20250917*/
        height: 60%;
        bottom: 0;
        top: inherit;
    }

    .logo_bar > .con {
        height: 120px;
        /*border-radius: 0 60px 60px 0; 20250917*/
    }

    .logo_bar > .con > .logo_1 {
        width: 70px;
        height: 80px;
        margin: 20px 0px 0px 15px; /*20250925*/
        background-size: 70px;
    }

    .logo_bar > .con > .logo_2 {
        width: 173px;
        height: 120px;
        float:right;
    }

    /* Content optimization */

    .page_home > .topic_big .info > .title,
    .page_home > .topic_big .info > .date,
    .page_home > .topic_big .info > .detail {
        margin-left: 10px;
        margin-right: 10px;
    }

    .page_home > .topic_big > .info {
        padding: 15px 5px 0px 0px;
    }

    /* Single column layout for delegation items */
    .page_delegation > .team > .con > .item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 15px;
    }

    /* Table further optimization */
    .content_area .table_base {
        font-size: 0.75em;
    }

    .content_area .table_base th,
    .content_area .table_base td {
        padding: 6px 3px;
    }

    /* Form elements optimization */
    .page_login > .login_form {
        margin: 10px 0px 0px 10px;
    }

    .page_login > .login_form > table td > input,
    .page_login > .login_form .input {
        width: 100%;
        max-width: 250px;
    }
    /*press release responsive*/
    .page_press>.item {display:flex; flex-direction:row; width:100%; flex-wrap:wrap;}
    .page_press>.item>div {
        width:100%; padding-left:0; margin-top:20px;
    }
    .page_press>.item>img {
        width:100%;
    }

    /*download page responsive*/
    .content_area .horizontal_table td {
        width: 100%;
        display: block;
        text-align:center;
    }
}

/* Extra small devices: 360px and below */
@media only screen and (max-width: 360px) {
    .page_container {
        padding: 0 1px;
    }

    .logo_bar > .con > .logo_1 {
        width: 60px;
        height: 70px;
        margin: 15px 0px 0px 15px; /*20250925*/
        background-size: 60px;
    }

    .content_area > .box_right {
        padding: 5px!important;
    }

    .page_home > .topic_big .info > .title {
        font-size: 0.95em;
    }

    .page_home > .topic_big .info > .detail {
        font-size: 0.85em;
    }

    .content_area .table_base {
        font-size: 0.7em;
    }
}