.headerFootercss {
  content: "20260323下午 已含華藝總館+ABCIN-891";
}


/*=====header basic frame*/
header {
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
  height: max-content;
  background: #ffffff;
  height: 3rem;
  border-bottom: 1px var(--G100) solid;
  position: sticky;
  z-index: 500;
  top: 0px;
}

.logo {
  position: absolute;
  width: max-content;
  left: 50%;
  z-index: 300;
  transform: translateX(-50%);
  top: 0.5rem;
  height: 32px;
}

.logo a {
  margin: 0;
  padding: 0;
  width: max-content;
  display: inline-flex;
  justify-content: space-between;
  height: 32px;
  flex-direction: row-reverse;
  column-gap: 10px;
}

.logo img {
  width: 100%;
}

.logo .ireadebooksImg {
  display: flex;
  align-items: center;
  width: 166px;
}

.logo .unitlogoImg {
  display: flex;
  align-items: center;
  width: 140px;
}

.unitlogoImg+.ireadebooksImg {
  width: 116px;
}

/*.unitlogoImg+.ireadebooksImg::after {
      content: "";
    height: 16px;
    width: 1px;
    position: relative;
    bottom: 0;
    left: 2px;
    border-right:1px solid #e0e0e0;
}
*/

header .navPCPart ul.tourMenu>li {
  float: left;
  margin-right: 1.5rem;
  color: var(--G900);
  text-decoration: none;
  position: relative;
}

header .navPCPart ul.tourMenu>li a {
  padding: 0;

  text-decoration: none;
  cursor: pointer;
}

@media (any-hover: hover) {

  .navPCPart summary.dropTrigger:hover .g900-p2-Link>.dropTriggerName,
  .navPCPart summary.dropTrigger:hover .g900-p2-Link>* {
    color: var(--seaBlue);
    text-decoration: none;
  }
}

.navPCPart .tourMenu {
  position: relative;
  top: 22px;
}

.navPCPart .personalMenu .dropPanel .dropPanelOption {
  background: #FFF;
  box-shadow: 0px 3px 8px -1px rgba(0, 0, 0, 0.15);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
}

.personalMenu .dropPanelOption a {
  width: 100%;
  display: inline-block;
  text-align: left;
}

.navPCPart .personalMenu .dropPanel[open] .dropTrigger>* {
  color: var(--seaBlue);
}

/*語系*/
.language .dropPanel summary {
  min-width: 96px;
  height: 100%;
  text-align: center;
}

.language .dropPanelOption {
  width: 96px;
  padding: 0.5rem 0;
}

.language .dropPanel .dropPanelOption>div {
  padding: 0.5rem 1rem;
}

/*會員專區*/
.myMember .dropPanel summary {

  height: 100%;
  text-align: center;
}

.myMember .dropPanelOption {
  width: 320px;
}

.myMember .myMemberLink>div {
  padding: 0.75rem 1rem;
}

.myMember .myMemberTop {
  border-bottom: 1px var(--G300) solid;
}

.myMember .myMemberBottom {
  border-top: 1px var(--G300) solid;
}

.myMember .myMemberTop,
.myMember .myMemberBottom {
  padding: 1rem;
}

.myMemberTop .myMemberName {
  font-size: 1.5rem;
  color: var(--G900);
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;  
}

.myMemberTop .hello {
  font-size: 1rem;
  color: var(--G700);
  display: flex;
  align-items: center;
  gap: 8px;  
}

.myMemberTop .subMemberName{    
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-width: 195px;
}

.myMember .icon-profile_solid {
  display: none;
}

.myMember .icon-profile_outline {
  display: inline-block;
}

.myMember.-active .icon-profile_solid {
  display: inline-block;
}

.myMember.-active .icon-profile_outline {
  display: none;
}


/*通知*/
.notice .dropPanel summary {

  height: 100%;
  text-align: center;
}

.notice .dropPanelOption {
  width: 320px;
}

.notice .noticeLink>div {
  padding: 0rem 1rem;
}

.navPCPart .personalMenu .notice .dropPanelOption .noticeLink a{	
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.navPCPart .personalMenu .notice .dropPanelOption .noticeLink{
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1.5rem 0;
}

.notice .noticeTop {
  border-bottom: 1px var(--G300) solid;
}

.notice .noticeBottom {
  border-top: 1px var(--G300) solid;
}

.notice .noticeTop,
.notice .noticeBottom {
  padding: 1rem;
}

.notice .moreNotice a {
  text-align: center;
}

.noticeTop h3 {
  font-size: 1.5rem;
  color: var(--G900);
}

.notice .noticeBottom a {
  width: 100%;
  display: inline-block;
}

/*我的書櫃*/
.myCase .dropPanel summary {

  height: 100%;
  text-align: center;
}

.myCase .dropPanelOption {
  width: 320px;
}

.myCase .myCaseLink>div {
  padding: 0.75rem 1rem;
}

.myCase .myCaseTop {
  border-bottom: 1px var(--G300) solid;
}

.myCase .myCaseBottom {
  border-top: 1px var(--G300) solid;
}

.myCase .myCaseTop,
.myCase .myCaseBottom {
  padding: 1rem;
}

.myCaseTop h3 {
  font-size: 1.5rem;
  color: var(--G900);
}


header .navMobilePart>ul.personalSheet {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px var(--G300) solid;
  margin-top: -6px;
  padding-left: 1rem;
  padding-right: 1rem;
}

/*===手機 華藝總館前往其他圖書館===*/
header .navMobilePart .otherLibraryBtn .icon-library:before {
  font-size: 1.25rem;
}

/*===手機 會員專區 我的書櫃 通知 切換單位館===*/
header .navMobilePart>ul.personalSheet>li {
  width: calc(100% - 2rem);
  justify-content: space-between;
  font-size: 1rem;
  color: var(--G900);
  padding: 1rem 0;
  column-gap: 1rem;
  margin-left: auto;
  margin-right: auto;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  border-bottom: 1px var(--G300) solid;
  box-sizing: border-box;

}

header .navMobilePart>ul.personalSheet.-active>li {
  width: 50%;
  display: flex;

}

header .navMobilePart>ul.personalSheet>li {
  display: none;
}

header .navMobilePart>ul.personalSheet>li:last-child {
  display: flex;
}

header .navMobilePart>ul.personalSheet>li a {
  text-decoration: none;
  padding: 0px;
  margin: 0;
}

@media (any-hover: hover) {
  header .navMobilePart>ul.personalSheet>li a:hover {
    text-decoration: none;
    padding: 0px;
    margin: 0;
  }
}

/**/

header .navMobilePart>ul.personalSheet.-active>li>a {
  flex: 1;
  border-right: 1px var(--G300) solid;
  padding-right: 1rem;
}

header .navMobilePart>ul.personalSheet.-active>li:nth-child(even)>a {
  padding-right: 0;
  padding-left: 1rem;
  border-right: 1px transparent solid;
}

header .navMobilePart>ul.personalSheet>li>a>div.linkDetail {
  height: 24px;
  display: flex;
  align-items: center;
  column-gap: 0.25rem;
}

.noticeMath {
  display: inline-block;
  border-radius: 100px;
  background: var(--danger);
  width: 8px;
  height: 8px;
  font-size: 1rem;
  color: #fff;
  font-family: Overpass;
  line-height: 24px;
  margin-left: 2px;
  text-align: center;
  position: relative;
  text-indent: -999999px;
}

/*===stateSheet導覽列 第一層按鈕位置和樣式預設方式===*/
header .navMobilePart>.stateSheet .titleTxt {
  font-size: var(--p2FS);
  color: var(--G700);
}

header .navMobilePart>.stateSheet>div {
  padding: 0 1rem;
  text-align: center;
}

header .navMobilePart>.stateSheet {
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
  position: absolute;
  width: 100%;
  bottom: 0;
  padding: 1rem 0;
  border-top: 1px var(--G300) solid;
  bottom: 0;
  background: #fff;
}

header .navMobilePart>.stateSheet>.loginBtn {
  border-top: 1px var(--G300) solid;
  padding-top: 1rem;
}

/*===toursheet導覽列 第一層按鈕位置和樣式預設方式===*/
header .navMobilePart>ul.tourSheet {
  height: calc(100% - 350px);
  overflow-y: scroll;
  /* max-height: 87%; */
  position: absolute;
  width: 100%;
  margin-top: -2px;
  background: #fff;
  border-top: 1px var(--G300) solid;
}

header .navMobilePart>ul.tourSheet>li {
  padding: 0.75rem 1rem;
  display: flex;
  align-items: flex-end;
  width: 100%;
  box-sizing: border-box;
}

header .navMobilePart>ul.tourSheet>li,
header .navMobilePart>ul.tourSheet>li>a,
header .navMobilePart>ul.tourSheet>li>label {
  color: var(--G700);
  text-align: left;
  cursor: pointer;
}

header .navMobilePart>ul.tourSheet>li>a {
  color: var(--G700);
  padding: 0;
  margin: 0;
  height: fit-content;
}

header .navMobilePart>ul.tourSheet>li:hover,
header .navMobilePart>ul.tourSheet>li>a:hover,
header .navMobilePart>ul.tourSheet>li:hover>label {
  color: var(--seaBlue);
  text-decoration: none;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox {
  width: 100%;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox>summary,
.navMobilePart .tourSheet details.sidePanelBtn-ox .seriesBookMobileBtn {
  display: flex;
  width: 100%;
  justify-content: space-between;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox {
  position: relative;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox[open]>summary~.categoryMobile {
  display: block;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox>summary .icon-tip_left {
  display: none;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox>summary .icon-tip_right {
  color: var(--G700);
  font-size: var(--h2FS);
  vertical-align: middle;
  display: inline-block;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox>summary .transIcon {
  position: absolute;
  right: -0.5rem;
  top: 0;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox[open]>summary {
  display: flex;
  width: 320px;
  position: fixed;
  padding: 0.75rem 0rem 0.75rem 2.5rem;
  top: 0px;
  box-sizing: border-box;
  height: 3rem;
  z-index: 300;
  background: #fff;
  color: var(--G700);
  flex-direction: row-reverse;
  justify-content: flex-end;
  left: 0;
  border-bottom: 1px var(--G300) solid;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox[open]>summary .transIcon {
  color: var(--G700);
  font-size: var(--h2FS);
  vertical-align: middle;
  display: inline-flex;
  position: absolute;
  left: 12px;
  top: 12px;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox[open]>summary .icon-tip_right {
  color: var(--G700);
  font-size: var(--h2FS);
  vertical-align: middle;
  display: none;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox[open]>summary .icon-tip_left {
  display: inline-block;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox[open] .sidePanel {
  position: fixed;
  height: calc(100% - 3rem);
  top: 3rem;
  left: 0;
  background: #ffffff;
  width: 320px;
  min-width: initial;
  z-index: 100;
  overflow-y: scroll;
}

.navMobilePart .tourSheet details.sidePanelBtn-ox[open] span.pageRefreshBtn {
  position: fixed;
  height: calc(100% - 3rem);
  top: 3rem;
  left: 0;
  background: #ffffff;
  width: 320px;
  min-width: initial;
  z-index: 600;
  overflow-y: scroll;
}

.navMobilePart details[class$="TreePanel"] summary.treeTrigger>.transIcon {
  position: absolute;
  right: 1rem;
  top: 0.75rem;
}

.navMobilePart details[class$="TreePanel"] .treeTrigger {
  color: var(--G700);
  display: inline-flex;
  padding: 0.75rem 1rem;
  box-sizing: border-box;
  height: 3rem;
  width: 100%;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
}

.navMobilePart details[class$="TreePanel"] .treeItem .icon-noncheck:before {
  font-size: var(--p4Fs);
  display: inline-block;
  position: relative;
  top: -3px;
}

.navMobilePart details[class$="TreePanel"] .treeItem a {
  position: initial;
  display: inline-block;
  text-align: left;
  color: var(--G700);
  text-decoration: none;
}

.navMobilePart details[class$="TreePanel"][open] .treeTrigger {
  color: var(--seaBlue);
}

.navMobilePart details[class$="TreePanel"][open] .treeItem {
  background: var(--G50);
}

.navMobilePart details[class$="TreePanel"][open] .icon-tip_up {
  display: inline-block;
  color: var(--seaBlue);
}

.navMobilePart details[class$="TreePanel"][open] .icon-tip_down {
  display: none;
}

.navTopPCContainer,
.navPCPart {
  display: none;
}

.clientNavMobileContent {
  display: inline-block;
  position: absolute;
  left: 1rem;
  min-height: 1rem;
  width: 260px;
  text-align: left;
  top: 0.75rem;
}

.ipPart .ip {
  color: var(--G700);
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  display: -webkit-box;
}

.navPCPart .tourMenu .dropPanelOption {
  position: fixed;
  min-width: 100%;
  min-height: 340px;
  top: 121px;
  left: 0px;
  max-height: 520px;
  display: none;
  z-index: 100;
  background: #fff;
  padding: 2.5rem 0;
  border-bottom: 1px var(--G700) solid;
  border-top: 1px var(--G100) solid;
}

.navPCPart .tourMenu details[open] .dropPanelOption {
  display: block;
}

.navPCPart .tourMenu details .mask {
  display: none;
  bottom: 0;
  height: calc(100% - 122px);
  top: initial;
  z-index: 100;
}

.navPCPart .tourMenu details[open] summary>* {
  color: var(--seaBlue);
}

.navPCPart .tourMenu details[open] .mask {
  display: block;
}

.navPCPart .tourMenu details[open] .icon-tip_down {
  display: none;
}

.navPCPart .tourMenu details[open] .icon-tip_up {
  display: block;
}

header .dropPanelOption h2 {
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
}

header .suggestBookPC {
  height: 500px;
}

header .categoryMobile,
header .seriesBookMobile,
header .suggestBookMobile {
  position: fixed;
  height: 100%;
  top: 0;
  left: 0;
  display: none;
  background: #ffffff;
  width: 320px;
  min-width: initial;
}


/*******control  -open系列*/
.headerSet .burgerBtn-x {
  display: inline-block;
}


.headerSet {
  display: none;
}

.burgerBtn-ox {
  position: absolute;
  left: 0rem;
  font-size: 1.5rem;

  height: 3rem;
  display: inline-block;
  cursor: pointer;
  top: 0px;
  z-index: 100;
}

.headerSet .burgerBtn-x {
  position: relative;
  left: 1rem;
  top: 0rem;
  width: 100%;
  height: 3rem;
  display: inline-block;
  text-align: right;
  left: 0;
  border-bottom: 1px var(--G300) solid;
}

.burgerBtn-x .icon-close {
  padding: 1rem;
  cursor: pointer;
  position: absolute;
  right: 0px;
  padding: 0.75rem 1rem;
  box-sizing: border-box;
  font-size: 1.5rem;
}

.burgerBtn {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -khtml-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.burgerBtn:checked~.navContainer {
  display: block;
}

.burgerBtn {
  display: inline-block;
  width: 100%;
  height: 2rem;
  position: absolute;
  cursor: pointer;
}

.navLabel {
  display: flex;
  width: 100%;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items: flex-end;
}

.burgerBtn+label {
  display: inline-block;
  padding: 0.75rem 1rem;
  box-sizing: border-box;
  height: 3rem;
  width: 100%;
  line-height: 1;
}

.burgerBtn,
.burgerBtn+label {
  display: block;
  width: max-content;
}

.headermask {
  display: none;
}

.burgerBtn:checked~.headerSet {
  display: block;
  position: fixed;
  width: 320px;
  height: 100%;
  background: #fff;
  /*z-index: 1000; 20260209下午*/
  z-index: 200000;
  top: 0;
  left: 0;
}

.burgerBtn:checked~.headerSet+.headermask {
  display: block;
}

.burgerBtn:checked~.headerSet+.headermask .mask {
  /*z-index: 999; 20260209下午*/
    z-index: 100000;

}

.navMobilePart .sidePanel li>a {
  position: initial;
  display: inline-block;
  text-align: left;
  height: 3rem;
  color: var(--G700);
  text-decoration: none;
  line-height: 3;
  width: 100%;
  padding: 0rem 1.25rem;
}

.seriesBookPCBtn:checked~.seriesBookPC {
  display: block;
  min-height: 500px;
}

.seriesBookMobileBtn:checked~.seriesBookMobile {
  display: block;
}

.suggestBookPC-open:checked~.suggestBookPC {
  display: block;
}

.suggestBookMobile-open:checked~.suggestBookMobile {
  display: block;
}

/*===personalMenu登入後個人化按鈕 第一層按鈕位置和樣式預設方式===*/

/*.categoryMobile 全館分類的學科分類圖書分類收合方式*/
header .categoryPC {
  margin-top: -6px;
}

header .categoryMobile .treeTrigger:checked+label,
header .categoryPCBtn:checked+label,
header>summary:checked+label {
  color: var(--seaBlue);
  cursor: pointer;
}

header .categoryMobile .treeTrigger+label .icon-tip_up,
header .categoryPCBtn+label .icon-tip_up,
header>summary+label .icon-tip_up {
  display: none;
}

header .categoryMobile .treeTrigger+label .icon-tip_down,
header .categoryPCBtn+label .icon-tip_down,
header>summary+label .icon-tip_down {
  display: inline-block;
}

header .categoryMobile .treeTrigger:checked+label .icon-tip_up,
header .categoryPCBtn:checked+label .icon-tip_up,
header>summary:checked+label .icon-tip_up {
  color: var(--seaBlue);
  display: inline-block;
}

header .categoryMobile .treeTrigger:checked+label .icon-tip_down,
header .categoryPCBtn:checked+label .icon-tip_down,
header>summary:checked+label .icon-tip_down {
  display: none;
}

/*推薦閱讀和特色書系書牆收合和被點擊後樣式的對應方式*/
header .seriesBookPC,
header .suggestBookPC {
  margin-top: -6px;
}

header .seriesBookPCBtn:checked+label,
header .seriesBookMobileBtn:checked+label,
header .suggestBookPC-open:checked+label {
  color: var(--seaBlue);
}

header .seriesBookPCBtn+label .icon-tip_up,
header .seriesBookMobileBtn+label .icon-tip_up {
  display: none;
}

header .seriesBookPCBtn+label .icon-tip_down,
header .seriesBookMobileBtn+label .icon-tip_down {
  display: inline-block;
}

header .seriesBookPCBtn:checked+label .icon-tip_up,
header .seriesBookMobileBtn:checked+label .icon-tip_up {
  color: var(--seaBlue);
  display: inline-block;
}

header .seriesBookPCBtn:checked+label .icon-tip_down,
header .seriesBookMobileBtn:checked+label .icon-tip_down {
  display: none;
}

header .categoryMobile .treeTrigger:checked+label .icon-tip_down {
  display: none;
}

header .categoryMobile .treeTrigger+label span:nth-child(1) {
  flex: 1;
}


header .megaContext .hitSub {
  min-height: 150px;
}

header .megaContext .hitSub .toggleMoreBtn {
  width: fit-content;
  margin: 0;
  margin-top: 6px;
  color: inherit;
}

header .megaContext .hitSub .tagMenu {
  flex-wrap: wrap;
  min-width: 100%;
  column-gap: 1rem;
  row-gap: 0.5rem;
}

header .navPCPart .suggestBookGroup {
  flex-direction: row;
}

header .navMobilePart .suggestBookGroup {
  flex-direction: column;
  margin-bottom: 6rem;
}

/*footer*/
footer {
  row-gap: 1rem;
  display: flex;
  flex-direction: column;
  padding: 2.5rem 1rem;
  width: 100%;
  margin: auto;
  box-sizing: border-box;
  border-top: 1px solid var(--G100);

}

footer .row {
  display: flex;
  justify-content: center;
  justify-content: flex-start;
  flex-direction: column;
}

footer .productLink {
  row-gap: 1.5rem;
}

footer .productLink .appMenu {
  display: inline-flex;
  align-items: baseline;

  column-gap: 1rem;
}


footer .divider {
  background: var(--G300);
  width: 1px;
}

footer .footSubTitle {
  color: var(--G700);
  font-size: 0.875rem;
  margin-bottom: 1rem;
}

footer .contact .footSubTitle {
  margin-bottom: 0.25rem;
}

footer .row .col {
  width: 100%;
  text-align: center;
}

footer .airiticopyright .col:nth-child(1),
footer .unitcopyright .col:nth-child(1) {
  width: 100%;
  text-align: center;
  display: inline-flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

footer .airiticopyright .col:nth-child(2),
footer .unitcopyright .col:nth-child(2) {
  width: 100%;

  display: inline-flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}

footer .contactLink .col>div {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  margin-top: 1rem;
  width: 100%;
  margin: auto;
}

footer .row+.row {
  border-top: 1px var(--G300) solid;
  padding-top: 1.5rem;
}

footer .copyright {
  color: var(--G700);
  font-size: 0.875rem;
  line-height: 1.5;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

footer a.ios,
footer a.android,
footer a.pc {
  display: flex;
  color: var(--G900);
  align-items: flex-end;
  column-gap: 0.25rem;
  padding: 0;
  margin: 0;
  line-height: initial;
  height: auto;
}

footer .shareMenu a {
  padding: 0;
  margin: 0;
  width: 2rem;
  height: 2rem;
  box-shadow: none;
}

footer .shareMenu {
  display: inline-flex;
  column-gap: 1rem;
}

footer .shareMenu>* {
  width: 2rem;
  height: 2rem;
}

footer .productLink .appMenu .divider {
  height: 24px;
}

footer .productLink .col+.divider {
  display: inline-block;
  height: 1px;
  width: 100%;
}

footer .productLink .col a span:nth-child(2) {
  display: none;
}

footer .contactLink .divider {
  height: 260px;
}

footer .contactLink .divider {
  width: 100%;
  display: inline-block;
  height: 1px;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

footer .aboutMenu,
footer .serviceMenu,
footer .contact {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  row-gap: 1rem;
  margin-top: 1rem;
  width: 100%;
  margin: auto;
  text-align: center;
}

footer .aboutMenu a,
footer .serviceMenu a,
footer .contact a,
footer .aboutMenu a:link,
footer .serviceMenu a:link,
footer .contact a:link {
  width: 100%;
  text-align: center;
}

  footer .airiticopyright,
  footer .unitcopyright {
    
	row-gap:16px;
  }

@media (min-width: 768px) {
  footer {
    row-gap: 1.5rem;
    display: flex;
    flex-direction: column;
    padding: 2.5rem 68px;
  }

  footer .contactLink .divider {
    width: 1px;
    display: inline-block;
    height: 300px;
    margin-top: 0;
    margin-bottom: 0;
  }

  footer .productLink .col+.divider {
    display: inline-block;
    height: 60px;
    width: 1px;
  }

  footer .productLink .col {
    width: 50%;
    text-align: center;
  }

  footer .contactLink .col {
    width: 33%;
    text-align: left;
    padding: 0 1.5rem;
  }

  footer .row {
    flex-direction: row;
  }

  footer .productLink .col {
    width: 50%;
  }

  footer .airiticopyright,
  footer .unitcopyright {
    justify-content: space-between;
	
  }

  footer .unitcopyright .col:nth-child(1),
  footer .airiticopyright .col:nth-child(1) {
    text-align: left;
    display: inline-flex;
    align-items: flex-start;
    gap: 16px;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-end;
  }

  footer .unitcopyright .col:nth-child(2),
  footer .airiticopyright .col:nth-child(2) {
    text-align: right;
	align-items: flex-end;
  }

  footer .aboutMenu,
  footer .serviceMenu,
  footer .contact {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    row-gap: 1rem;
    margin-top: 1rem;
    width: fit-content;
    margin: auto;
    text-align: left;
  }

  footer .aboutMenu {
    min-width: 160px;
  }

  footer .aboutMenu a,
  footer .serviceMenu a,
  footer .contact a,
  footer .aboutMenu a:link,
  footer .serviceMenu a:link,
  footer .contact a:link {
    width: 100%;
    text-align: left;
  }

  footer .contactLink .col>div {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    margin-top: 1rem;
    width: fit-content;
    margin: auto;
  }
}

@media (min-width: 1260px) {
  header {
    min-height: 3rem;
    height: auto;
  }

  .burgerBtn:checked~.headerSet+.headermask {
    display: none;
  }

  .clientNavPCContent {

    min-height: 48px;
    width: calc(100% - 8rem);
    margin: auto;
    display: flex;
    align-items: center;
    width: 100%;
  }

  .navPCContent {
    height: 72px;
    padding: 0 2rem;
    margin: auto;
  }

  header ul.personalMenu {
    display: flex;
    width: 100%;
    justify-content: center;
    font-size: 1rem;
    color: var(--G900);
  }

  .burgerBtn:checked~.headerSet+.mask {
    display: none;
  }

  .personalMenu .dropPanelOption a,
  .personalMenu .dropPanelOption a:hover {
    text-decoration: none;
    padding: 0px;
    margin: 0;
  }

  /*手機板的四格*/
  header ul.personalMenu>li {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    border-right: 1px var(--G300) solid;
    position: relative;
  }

  header ul.personalMenu>li:last-child {
    margin: 0;
    border: 0;
  }

  header ul.personalMenu>li>a {
    flex: 1;
  }

  header ul.personalMenu>li>a>div {
    height: 24px;
  }

  header ul.personalMenu>li>a>div {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  header ul.personalMenu>li>a+a>div {
    border-left: 1px var(--G300) solid;
  }

  /*手機板的四格 end*/
  
  /*華藝總館前往其他圖書館*/
    .navPCPart .otherLibrary .icon-library:before {
    font-size: 1.25rem;
  }

  .navPCPart .personalMenu .otherLibrary .icon-library {
    margin-right: 0.5rem;
  }

  .navPCPart .personalMenu .otherLibrary .icon-library .btnName {
    height: 28px;
  }
  /* end*/
  
  /*這裡是設定summary感應範圍*/
  header:has(.navPCPart>ul.tourMenu>li>details[open]) {
    position: fixed;
    z-index: 600;
  }

  .navPCPart .personalMenu>li .dropPanel summary,
  .navPCPart .tourMenu>li .dropPanel summary {
    text-align: center;
    min-width: fit-content;
    min-height: 2rem;
  }

  .navPCPart .personalMenu>li>a.g900-p2-Link,
  .navPCPart .tourMenu>li>a.g900-p2-Link,
  .navPCPart .tourMenu>li>.dropPanel .dropTrigger {
    text-align: center;
    min-width: fit-content;
    min-height: 2rem;
    line-height: 2;
  }


  .navPCPart .personalMenu>li summary.dropTrigger>div.g900-p2-Link,
  .navPCPart .tourMenu>li summary.dropTrigger>div.g900-p2-Link {
    z-index: -1;
    height: 0px;
    display: inline-block;
    position: relative;
  }

  /*end*/

  .categoryPC {
    display: none;
  }

  .logo {
    transform: none;
    left: 2rem;
    top: 0.5rem;
  }

  /* .headerSet > div.row:nth-child(3) {
    display: block;
  }
*/
  .headerSet .burgerBtn-x {
    display: none;
  }

  .navPCPart {
    display: block;
  }

  .navPCPart .personalMenu {
    height: 1.5rem;
  }

  .navMobilePart {
    display: none;
  }

  .headerSet {
    display: block;
    position: initial;

    height: 100%;
    display: inline-block;
    width: 100%;
  }

  .headerSet>label .icon-close {
    display: none;
  }

  .burgerBtn,
  .burgerBtn+label {
    display: none;
  }

  .burgerBtn:checked~.headerSet {
    display: block;
    position: initial;
    width: 100%;
    height: 100%;
    background-color: initial;
  }

  .navTopPCContainer {
    display: block;

    margin: auto;
    border-bottom: 1px var(--G100) solid;
    padding: 0 2rem;
  }

  .navTopPCContainer .ipPart {
    flex: 1;
    padding-left: 400px;
    text-align: center;
  }

  footer .productLink .col+.divider {
    height: 60px;
    width: 1px;
  }

  footer .productLink .col a span:nth-child(2) {
    display: inline-block;
  }
}


@media (min-width: 1360px) {
  .logo {
    left: 4rem;
  }

  .navTopPCContainer {
    padding: 0 4rem;
  }

  .navPCContent {
    padding: 0 4rem;
  }
}

.navPCPart .seriesBookContainer {
  text-align: center;
  margin-top: 2.5rem;
}

.seriesBookContent {
  display: inline-block;

}

.seriesBookGroup {
  display: flex;
  flex-wrap: wrap;
  column-gap: 1rem;
  row-gap: 3rem;
  -webkit-box-orient: horizontal;
  box-sizing: border-box;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  width: max-content;
  margin: auto;
}

.navPCPart .suggestBookContainer {
  text-align: center;
  margin-top: 2.5rem;
}

.suggestBookContent {
  display: inline-block;

}

.navMobilePart .Tbaseline .setTitle>span:nth-child(2) {
  display: none;
}

.navMobilePart .Tbaseline .setTitle>span.pageRefreshBtn {
  display: none;
}

.navMobilePart .Tbaseline .setTitle h2 {
  padding: 1rem 1.5rem 2.5rem 1.5rem;
}

.suggestBookGroup {
  display: flex;
  flex-wrap: wrap;
  column-gap: 1rem;
  row-gap: 3rem;
  -webkit-box-orient: horizontal;
  box-sizing: border-box;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  width: max-content;
  margin: auto;
}

.interestBookContainer {
  text-align: center;
}

.interestBookContent {
  display: inline-block;
  padding: 1rem 0;
}

.interestBookGroup {
  display: flex;
  flex-wrap: wrap;
  column-gap: 1.5rem;
  row-gap: 3rem;
  -webkit-box-orient: horizontal;
  box-sizing: border-box;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  width: fit-content;
  margin: auto;
}

.interestBookContainer h2 {
  margin-top: 2.5rem;
  text-align: left;
}

@media (max-width:400px) {

  .logo,
  .logo a {

    width: max-content;
    max-width: 264px;
  }




}


/*==================================▽▽右下角▽▽==================================*/

.assistTop {
  text-align: center;
  font-size: 1rem;
  color: var(--G700);
  padding: 1rem 0;
}

.assistAgile>a {
  height: 3rem;
  display: inline-block;
  line-height: 100%;
  padding: 1rem 0;
  width: 100%;
  text-align: left;
}

.assistTreePanel>.treeTrigger .treeTriggerName {
  height: 3rem;
  display: inline-block;
  line-height: 100%;
  padding: 1rem 0;
  width: 100%;
  text-align: left;
  color: var(--G700);
}

.assistAgile {
  padding: 1rem;
  overflow-y: scroll;
  height: calc(100% - 365px);
}

.assistHead {
  padding: 0.25rem 0;
  background: var(--G100);
  color: var(--G700);
  text-align: center;
}

.contactNow {
  padding: 0 1rem;
  border-top: 1px var(--G500) solid;
}

.contactNow,
.contactBtn {
  text-align: center;
  margin-top: 1rem;
}

.contactThis p {
  margin-top: 1rem;
  font-size: 1rem;
  color: var(--G700);
  line-height: 1.75;
}

.assistTop {
  height: 3.5rem;
}

.assistPanel .mask,
.assistPanel .icon-close {
  display: none;
}

.assistPanel[open] .mask {
  display: block;
}

.assistPanel[open] .icon-close {
  display: block;
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 1050;
  color: var(--G700);
}

.assistTreePanel[open] .treeTriggerName {
  color: var(--seaBlue);
}

.assistPanelOption {
  position: fixed;
  right: 0;
  background: #fff;
  z-index: 300;
  width: 320px;
  height: 100%;
  top: 0;
}

.sideBtnWrap {
  width: 3rem;
  position: fixed;
  right: 20px;
  bottom: 40px;
  z-index: 500;
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
}

.sideBtnContainer>div+div {
  margin-top: 10px;
}

.topBtn p {
  width: 100%;
  border-radius: 100px;
  box-shadow: 0px 3px 8px -1px rgba(0, 0, 0, 0.15);
  background: #fff;
  opacity: 1;
  height: 100%;
  position: absolute;
  top: 0px;
  background: #fff;
}

.sideBtnWrap .topBtn,
.sideBtnWrap .topBtn a:hover,
.sideBtnWrap .topBtn a:active {
  position: relative;
  z-index: 100;
  text-decoration: none;
  color: #fff;
}

.sideBtnWrap .assistTrigger {
  color: var(--seaBlue);
}

.sideBtnWrap .assistTrigger:hover,
.sideBtnWrap .assistTrigger:active {
  text-decoration: none;
  color: #fff;
  background: var(--seaBlue);
}

.sideBtnWrap .topBtn a:hover+p,
.sideBtnWrap .topBtn a:active+p {
  background: var(--seaBlue);
  box-shadow: 0px 3px 8px -1px rgba(0, 0, 0, 0.15);
  opacity: 1;
}

.assistTrigger,
.topBtn {
  width: fit-content;
  position: relative;
}

.topBtn a {
  display: flex;
  padding: 10px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  width: 3rem;
  height: 3rem;
  border-radius: 100px;
  color: var(--seaBlue);
  position: relative;
  z-index: 100;
}

.assistTrigger {
  display: inline-flex;
  padding: 12px;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  -webkit-writing-mode: vertical-lr;
  writing-mode: vertical-lr;
  column-gap: 0.25rem;
  height: fit-content;
  width: 3rem;
  border-radius: 100px;
  color: var(--seaBlue);
  background: #fff;
  box-shadow: 0px 3px 8px -1px rgba(0, 0, 0, 0.15);
}

.assistTrigger>span {
  width: 1.5rem;
  font-size: 0.875rem;
  letter-spacing: 4px;
  position: relative;
  z-index: 100;
  color: var(--seaBlue);
}

.assistTrigger>span:nth-child(2) {
  line-height: 0.875;
  font-size: 0.875rem;
}

.assistTrigger>p {
  width: 100%;
  border-radius: 100px;
  box-shadow: 0px 3px 8px -1px rgba(0, 0, 0, 0.15);
  background: #fff;
  opacity: 1;
  height: 100%;
  position: absolute;
  top: 0px;
  background: #fff;
}

.assistTrigger:hover>p,
.assistTrigger:active>p {
  background: var(--seaBlue);
  box-shadow: 0px 3px 8px -1px rgba(0, 0, 0, 0.15);
  opacity: 1;
}

.assistTrigger .btnName {
  /*-webkit-writing-mode: horizontal-tb;
writing-mode: horizontal-tb;*/
  min-height: 48px;
  display: block;
  width: 1rem;
  writing-mode: vertical-lr;
}

.assistTrigger:hover .btnName,
.assistTrigger:hover .icon-help {
  color: #fff;
}

.appHelper .productLink {
  display: flex;
  row-gap: 1rem;
  flex-direction: column;
  align-items: center;
  padding: 0 1rem;
  border-top: 1px var(--G500) solid;
  padding-top: 1rem;
}

.appHelper .productLink .appMenu {
  display: inline-flex;
  align-items: baseline;
  column-gap: 1rem;
}

.appHelper .productLink .footSubTitle {
  font-size: 0.875rem;
  color: var(--G700);
}

/*以下是過渡期的寫法，實際上工程師會用html對應情境load 對應選單按鈕* 統一於headerfooter預設都關掉．再到該情境分支css寫display block*/
.CorSideControlContainer,
.CusSideControlContainer,
.JrnSideControlContainer,
.MebSideControlContainer {
  display: none;
}

/*==================================△△右下角==================================*/


/*===================================▽▽PC版的導覽頁籤切換▽▽==================================*/
.megaTabBar {
  position: relative;
  margin-bottom: 2.5rem;
}

.megaTabBar .megaContext {
  overflow: hidden;
  width: 100%;
  box-sizing: border-box;
  display: none;
}

.navPCPart .megaTabBar label.megaTabLabel {
  display: flex;
  align-items: center;
  padding-left: 2.5rem;
  box-sizing: border-box;
  height: fit-content;
  width: 250px;
  border-color: transparent;
  text-align: left;
  flex: 1;
  margin-top: -1.25rem;

  padding-left: 4rem;
  position: absolute;
}

.navPCPart .megaTabBar label.megaTabLabel .transIcon{display:none;}

label[for="categoryPC-mega2A"] {
  top: 4rem;
}

label[for="categoryPC-mega3A"] {
  top: 7rem;
}

label[for="seriesBookPC-mega2A"] {
  top: 4rem;
}

label[for="seriesBookPC-mega3A"] {
  top: 7rem;
}

label[for="seriesBookPC-mega4A"] {
  top: 10rem;
}

.navPCPart .megaTabBar .megaTab:checked+label.megaTabLabel {
  border-bottom: 1px solid transparent;
}

.navPCPart .megaTabBar label.megaTabLabel span.megaTabName {

  flex: 1;
}

.navPCPart .megaTabBar .mega+label.megaTabLabel span.icon-tip_right {
  color: var(--G700);
  font-size: var(--h2FS);
}

.navPCPart .megaTabBar .megaTab:checked+label.megaTabLabel span.megaTabName {
  color: var(--seaBlue);
  border-color: transparent;
}

.navPCPart .megaTabBar .megaTab:checked+label.megaTabLabel span.icon-tip_right {
  color: transparent;
  border-color: transparent;
}

.navPCPart .megaContext {
  /* position: absolute;
  top: 0rem;*/
  position: relative;
  top: 0;
  width: calc(100% - 320px);
  right: 0px;
  padding-right: 2rem;
  padding-top: 0px;
  float: right;
  overflow: initial;
}

.navPCPart .megaContext>div {
  padding-left: 2rem;
  border-left: 1px var(--G300) solid;
}

.navPCPart .megaContext {}

.navPCPart .suggestBookPC .megaContext {
  top: 0;
}

/*桌機版分類子層*/
.megaTabBar .megaContext h5 {
  color: var(--tan);
  font-size: 20px;
  font-weight: 400;
}

p.scrolltip {
  color: var(--G700);
  text-align: center;
  width: calc(100% + 352px);
  position: relative;
  height: 72px;
  left: -320px;
  line-height: 2;
  padding: 1rem;
}

.navPCPart .megaContext .fieldSub,
.navPCPart .megaContext .LCSub {
  overflow-y: scroll;
  height: 400px;
}

.navPCPart .megaContext .fieldSub>div,
.navPCPart .megaContext .LCSub>div {
  padding-bottom: 1.5rem;
}

.navPCPart .megaContext h5+hr {
  margin: 0.5rem auto;
}

.navPCPart .megaContext .fieldSub ul,
.navPCPart .megaContext .LCSub ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.navPCPart .megaContext .fieldSub ul li a,
.navPCPart .megaContext .LCSub ul li a {
  padding: 0;
  margin: 0;
}

.navPCPart .megaContext .fieldSub ul li,
.navPCPart .megaContext .LCSub ul li {
  padding: 0 0.5rem;
  border-left: 1px var(--G300) solid;
  height: 1.5rem;
  line-height: 1.5;
}

.navPCPart .megaContext .fieldSub ul li:first-child,
.navPCPart .megaContext .LCSub ul li:first-child {
  border-left: 1px transparent solid;
  margin-left: -0.5rem;
}

.navPCPart .megaContext .fieldSub ul li:last-child,
.navPCPart .megaContext .LCSub ul li:last-child {
  border-right: 1px transparent solid;
}

.navPCPart .megaContext .bookShelfGroup {
  width: fit-content;
}

/*桌機版分類子層*/

#categoryPC-mega1A:checked~#categoryPC-megaContext1A,
#categoryPC-mega2A:checked~#categoryPC-megaContext2A,
#categoryPC-mega3A:checked~#categoryPC-megaContext3A {
  display: block;
}

#seriesBookPC-mega1A:checked~#seriesBookPC-megaContext1A,
#seriesBookPC-mega2A:checked~#seriesBookPC-megaContext2A,
#seriesBookPC-mega3A:checked~#seriesBookPC-megaContext3A,
#seriesBookPC-mega4A:checked~#seriesBookPC-megaContext4A {
  display: block;
}

@media screen and (min-width: 1260px) and (max-width: 1450px) {
  .navPCPart .megaTabBar .megaContext {
    width: calc(100% - 210px);
    padding-left: 0.5rem;
    padding-right: 1rem;
  }

  .navPCPart .megaTabBar label.megaTabLabel {
    padding-left: 2.5rem;

    width: 190px;
  }

  .seriesBookGroup {
    column-gap: 0.5rem;
  }

  .navPCPart .megaContext>div {
    padding-left: 1rem;
  }

  .megaContext .Tbaseline {
    max-width: 1024px;
  }
}

/*===================================△△PC版的導覽頁籤切換△△==================================*/


/*===================================▽▽借閱規則▽▽==================================*/
.libRuleContainer {
  display: inline-block;
  width: 100%;
}

.libRuleContainer>.libCountRuleContent {
  margin-top: 1rem;
}

.libRuleContent,
.libCountRuleContent,
.libBookAmountContent {
  display: flex;
  row-gap: 1rem;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  flex-direction: column;
}

.libRuleSection {
  padding: 1rem;
  border-radius: 1.5rem;
  background: var(--G100);
  margin-top: 1rem;
}

.libBookAmountSection {
  margin-top: 1rem;
}

.libRuleSection>h5,
.libCountRuleSection>h5 {
  color: var(--G900);
  font-size: 1.25rem;
  font-weight: initial;
  padding-bottom: 1rem;
}

.libRuleGroup>h5,
.libCountRuleGroup>h5 {
  color: var(--G900);
  font-size: 0.875rem;
  font-weight: initial;
}

.libBookAmountGroup>h5 {
  color: var(--G900);
  font-size: 1.125rem;
  font-weight: initial;
}

.libRuleContent .libRuleGroup,
.libCountRuleContent .libCountRuleGroup {
  display: flex;
  flex-direction: column;
  height: max-content;
  padding: 0.5rem 1rem;
  gap: 0.5rem;
  border-radius: 1.125rem;
  background: #fff;
  min-height: 132px;
  height: 100%;
}

.libBookAmountContent .libBookAmountGroup {
  display: flex;
  flex-direction: column;
  height: max-content;
  padding: 0.5rem 1rem;
  gap: 0.5rem;
  border-radius: 1.125rem;
  background: #fff;
  min-height: 62px;
  background: var(--G100);
  align-items: center;
  justify-content: center;
}


.libRuleList,
.libCountRuleList {
  color: var(--G900);
  font-size: 0.875rem;
  margin-bottom: 0.5rem;
}

.libRuleList,
.libCountRuleList {
  display: flex;
  width: 100%;
  align-items: baseline;
  flex-wrap: wrap;
  word-wrap: break-word;
  word-break: break-all;
}

.libRuleList .libRuleTitle,
.libCountRuleList .libCountRuleTitle {
  min-width: max-content;
}

.libRuleTip {
  color: var(--G700);
  font-size: 0.875rem;
  text-align: right;
  margin-top: 1rem;
}

/*===================================△△借閱規則△△==================================*/
