#sub_banner_box { opacity: 1; }
#sub_banner_box .parallax_bg { margin-bottom: 0; min-height: 450px; opacity: .5; background-position: 50% 60%; }
.webBox .parallax_svg.bann { -webkit-animation: parallax_top 10s linear infinite; animation: parallax_top 10s linear infinite; position: fixed; top: 87px; }
#sub_banner_box { background: var(--primary) }
#wrap { margin-top: 0; z-index: 4; }
#wrap .fullbox{min-height: 350px; }
#wrap .pag_tit { margin-bottom: 10px; line-height: 170%; margin-top: 120px; font-weight: 500; letter-spacing: 2px; z-index: 5; position: relative; color: white; }
.waylink ol { padding: 0px 0; text-align: center; margin-bottom: 0; display: flex; align-items: center; }
.waylink ol li,.waylink ol li a { letter-spacing: .1em; font-weight: 400; font-size: 13px; vertical-align: bottom; color: white; display: flex; align-items: center; }
.waylink ol li:after { margin: 0 10px; display: inline-block; font-weight: 100; font-size: 12px; color: white; content: "/"; }
.waylink ol li:last-child:after { margin: 0; content: ""; }
.waylink ol li.homeicon:after { display: none; }
aside ul li b .fa { transform: rotate(0); -webkit-transform: rotate(0); transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; }
.cotitleinfo { position: relative; display: flex; flex-direction: column; align-items: flex-start; margin-top: -180px; z-index: 9; }
.cotitleinfo .pag_tit { font-size: 2rem; color: white; margin-bottom: 120px; }
.cotitleinfo .waylink { width: 100%; background: #b8d7df; }
.cotitleinfo .workframe { width: min(1200px,90%); display: flex; }
.workframe .homeicon a {background: #f2f2f2;padding: 10px;margin-right: 16px;}
.workframe .homeicon i { color: #b8d7df; font-size: 2.25rem; }
.mb_nav { display: none; }
#content_wrap { padding: 0 0 60px; min-height: 350px; }
#content_wrap .list_box li {margin: 0;vertical-align: top;}
#content_wrap .list_box li a { z-index: 2; }
#content_wrap .img_box { background-color: #f9f9f9; }
#content_wrap .info_box { margin: 15px 0 0; }
#content_wrap .info_box .time { width: 80px; font-weight: 600; font-size: 13px; color: #423a33; font-family: "Montserrat",sans-serif; }
#content_wrap .info_box .more_btn { margin-left: 10px; padding: 2px 15px; max-width: calc(100% - 105px); height: 22px; font-weight: 100; font-size: 13px; z-index: 4; }
#content_wrap .info_box .quote_box * { font-weight: 400; font-size: 13px; }
#content_wrap .info_box .h3 { height: 61px; font-size: 18px; -webkit-line-clamp: 2; margin-top: 10px; }
#content_wrap .info_box>div article { height: 42px; line-height: 140%; font-weight: 300; font-size: 15px; -webkit-line-clamp: 2; }


/*  (#book_list) */
#book_list {display: grid;grid-template-columns: repeat(2 , 1fr);gap: 30px;list-style: none;width: 100%;justify-content: center;padding: 0;margin: 0 0 50px;}
#book_list > li {position: relative;background-color: #ffffff;width: 100%;display: flex;flex-direction: column;overflow: hidden;transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.4s ease;border-radius: 2px;}
#book_list > li:hover {transform: translateY(-8px);}
#book_list .img_box {position: relative;width: 100%;background-color: #eaeaea;overflow: hidden;border-radius: 10px;border: #dedede 1px solid;}
#book_list .img_box svg { display: block; width: 100%; height: auto; }
#book_list .img_box img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
#book_list > li:hover .img_box img { transform: scale(1.06); }
#book_list .h3 {font-size: 15px;color: #666666;font-weight: bold;letter-spacing: 1px;text-align: left;height: auto;}
.info_trext{position:relative;padding: 25px 0 15px;}
.info_trext::after {content: "";display: block;width: 35px;height: 2px;background-color: #999999;margin-top: 12px;transition: all linear 0.3s;}
#book_list li:hover .info_trext::after{width:85px;}
#book_list a.atag_item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; text-decoration: none; }




#album_list { flex-wrap: wrap; }
#album_list>div { margin: 0 1px 1px 0; height: 300px; flex-grow: 1; }
#album_list>div img { width: auto; min-width: 100%; height: 300px; }
#faq_list { margin-bottom: 50px; }
#faq_list * { transition: unset; -webkit-transition: unset; }
#faq_list li { border-bottom: 1px rgba(var(--primary-rgb),.7) dashed; }
#faq_list li .title { padding: 20px 20px 20px 0; }
#faq_list li .title font { vertical-align: top; }
#faq_list li .title .txt { margin-left: 10px; width: calc(100% - 50px); font-size: 20px; }
#faq_list li .title .icon { width: 40px; height: 34px; }
#faq_list li .title .icon:before,#faq_list li .title .icon:after { position: absolute; margin: auto; width: 14px; height: 2px; background: var(--primary); display: block; top: calc((100% - 2px)/2); left: calc((100% - 14px)/2); content: ""; }
#faq_list li .title .icon:after { transform: rotate(90deg); -webkit-transform: rotate(90deg); }
#faq_list li .info { padding: 0 20px 30px 50px; font-size: 15px; }
#faq_list li.current .title .icon:after { transform: rotate(180deg); -webkit-transform: rotate(180deg); }
#pagenav a,#pagenav strong { margin: 0 2px; width: 35px; height: 35px; display: inline-block; text-align: center; line-height: 35px; font-weight: 400; }
#pagenav strong { background: var(--primary); color: var(--white); border-radius: 50%; }
#pagenav p { margin: 0 5px; width: calc(50% - 10px); vertical-align: top; }
#pagenav p a { margin: 15px 0 0; padding: 0 15px; width: auto; height: auto; line-height: initial; font-size: 0; }
#pagenav p a i { margin: 0 5px 0 0; width: 11px; line-height: 23px; font-size: 12px; vertical-align: top; }
#pagenav p a font { max-width: calc(100% - 16px); min-width: auto; font-size: 14px; font-weight: 100; vertical-align: top; }
#pagenav p:last-child a i { margin: 0 0 0 5px; }
#newpagenav { margin-top: 70px; display: grid; grid-template-columns: repeat(2,1fr); gap: 50px; position: relative; }
#newpagenav:before { content: ''; position: absolute; left: 50%; width: 1px; height: 100%; background: #e3e3e3; }
#newpagenav p { margin: 0; width: auto; }
#newpagenav a { margin: 0; padding: 0; }
#newpagenav p a { margin: 15px 0 0; padding: 0; width: auto; height: auto; line-height: initial; font-size: 0; display: inline-flex; align-items: center; gap: 15px; }
#newpagenav p:last-child { text-align: end; }
#newpagenav i { width: 15px; font: normal normal normal 26px/1 FontAwesome; }
#newpagenav font { -webkit-line-clamp: 2; height: auto; font-size: 17px; max-width: max-content; font-weight: 400; }
#newpagenav a:hover font,#newpagenav a:hover i { color: #8f8c89; }
#newpagenav p:last-child font,#newpagenav p:last-child font span { text-align: end }
#newpagenav span { display: block; font-size: 17px; }
#describe { margin: 2em 0 5vw; }
#describe *,.tab_content * { vertical-align: bottom; color: currentcolor; }
#google_shere { margin-top: 30px; }
.form_box p.note {margin-bottom:20px;}
.form_box p.note .red { color: #f00; }
.form_box p.item {padding: 5px 0;}
.form_box p.item label span { font-weight: 500; font-size: 17px; }
.form_box p.item label i {margin-left: 5px;line-height: 20px;font-size: 26px;color: #f00;font-style: normal;}
.form_box p.item font { margin: 5px 0; }
.form_box p.item.check_box { border-bottom: 0; }
.form_box p.send_box { margin: 15px 0 50px; display: flex; flex-direction: column; align-items: center; }
.form_box p.send_box button {display: flex;flex-direction: column;align-items: center;width: min(200px,100%);padding: 10px 15px;}
.form_box input ,.form_box textarea{width: 100%;border: 1px solid #e5e5e5;background: white;}
[data-action="loader"] { width: 100vw; height: 100vh; background: rgba(var(--black-rgb),.3); line-height: 100vh; top: 0; left: 0; opacity: 0; z-index: -1; }
[data-action="loader"] .loader_circle { width: 50px; height: 50px; border: 2px rgba(var(--black-rgb),.6) solid; border-left-color: rgba(var(--white-rgb),.4); border-radius: 50%; }
[data-action="loader"]#lodbg .loader_circle { -webkit-animation: circle infinite 0.75s linear; animation: circle infinite 0.75s linear; }
#lodbg { opacity: 1; z-index: 99999; }
@keyframes circle {
  0% { transform: rotate(0); }
  100% { transform: rotate(360deg); }
}
@-webkit-keyframes circle {
  0% { -webkit-transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); }
}
#content_wrap {display: flex;max-width: 1200px;margin: 50px auto;padding: 0 0px;gap: 55px;color: #444444;}
#content_wrap.fulldown { display: flex; flex-direction: column; }
#content_wrap aside {width: 270px;flex-shrink: 0;}
#content_wrap .poright_box {width: calc(100% - 280px);}
#content_wrap .mb_nav { display: none; }
#content_wrap #category_nav {list-style: none;padding: 0;margin: 0;display: grid;}
#content_wrap #category_nav >ul{margin-bottom:20px;}
#category_nav > li.nav-hidden {display: none;}
#content_wrap #category_nav >li.action {display: flex;flex-direction: column;margin-bottom: 20px;}
#content_wrap .sidebar-title {display: flex;justify-content: space-between;align-items: center;font-size: 18px;color: #888888;padding: 15px 0;border-bottom: 1px solid #cccccc;margin-bottom: 0;letter-spacing: 2px;}
#content_wrap .sidebar-title a { color: #888888; font-weight: bold; }
#content_wrap .sidebar-title b {cursor: pointer;/* display: none; */}
#content_wrap .subUL { list-style: none; padding: 0; margin: 0; }
#content_wrap #category_nav .subUL li {/* border-bottom: 1px solid #eeeeee; */display: flex;flex-direction: column;}
#content_wrap #category_nav .subUL li.book_item a{padding:20px;}
#content_wrap #category_nav .subUL li[data-type="2"]{border-color:#444}
#content_wrap #category_nav .subUL li[data-type="2"] >div {background:#f8f8f8}
#content_wrap #category_nav .subUL li[data-type="2"] >ul{padding:10px 0;background: white;}
#content_wrap #category_nav .subUL li[data-type="2"] >div a{color:#3f4041}
#content_wrap #category_nav .subUL li.product_item a{padding: 15px 20px;font-weight: 400;letter-spacing: .5px;color: #8d8d8d;}
#content_wrap #category_nav .subUL li.product_item a:hover{color:#3f4041}
#content_wrap .subUL li.action { background: #f5f5f5; }
#content_wrap .subULHead, #content_wrap .sub2ULHead {display: flex;align-items: center;justify-content: space-between;padding: 0 20px;}
#content_wrap .subULHead p { margin: 0; }
#content_wrap .subUL li.active a { background-color: #f4f4f4; color: #333333; font-weight: bold; }
#content_wrap #product_list {flex-grow: 1;display: grid;grid-template-columns: repeat(2,1fr);gap: 25px;list-style: none;padding: 0;margin: 0 0 50px;}
#content_wrap .product-item { position: relative; display: flex; flex-direction: column; cursor: pointer; transition: transform 0.3s ease; }
#content_wrap .product-item:hover { transform: translateY(-5px); }
#content_wrap .product-item:hover .product-img { transform: scale(1.08); }
#content_wrap .img-box {aspect-ratio: 3/2;position: relative;display: flex;justify-content: center;align-items: center;overflow: hidden;border-radius: 10px;border: #dedede 1px solid;}
#content_wrap .product-img {max-width: 100%;object-fit: contain;filter: drop-shadow(0 8px 8px rgba(0,0,0,0.05));transition: transform 0.5s cubic-bezier(0.2,0.8,0.2,1);aspect-ratio: 3 / 2;}
#content_wrap .card-badge { position: absolute; top: 25px; left: 25px; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; }
#content_wrap .badge-text-large { font-size: 56px; font-weight: 900; color: #ffffff; line-height: 0.9; margin-bottom: 2px; text-shadow: 4px 4px 0 #5fb0c5; font-family: "Arial Black",Impact,sans-serif; letter-spacing: 2px; }
#content_wrap .badge-box { background-color: #5fb0c5; padding: 8px 14px; display: flex; flex-direction: column; align-items: flex-start; min-width: 90px; }
#content_wrap .badge-series { color: #ffffff; font-size: 13px; line-height: 1.2; margin-bottom: 3px; font-family: Arial,sans-serif; letter-spacing: 0.5px; }
#content_wrap .badge-name { color: #ffffff; font-size: 16px; font-weight: bold; line-height: 1.2; letter-spacing: 2px; }
#content_wrap .product-info { padding: 20px 0; }
#content_wrap .product-name { font-size: 15px; color: #666666; font-weight: bold; letter-spacing: 1px; }
#content_wrap .product-divider { width: 35px; height: 2px; background-color: #999999; margin-top: 12px; }
#content_wrap li:hover .product-divider{width:85px;}

aside { margin-bottom: 60px; z-index: 5; }
aside ul li b {display: flex;cursor: pointer;position: absolute;right: 20px;z-index: 2;}
aside ul li b .fa { transform: rotate(0); -webkit-transform: rotate(0); transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; }
aside ul li b .fa:before { content: "\f105"; }
aside>ul>li { position: relative; display: inline-block; }
aside>ul>li .h4 {display: flex;border-bottom: 1px solid #ccc;align-items: center;justify-content: space-between;padding: 0 20px;}
aside>ul>li .h4 a {padding: 20px 0;color: #747474;font-weight: bold;letter-spacing: 2px;}
aside>ul#category_nav>li .h4 a{font-size:18px}
aside>ul>li.action .h4 a, aside>ul>li.action .h4 i {color: #3f4041;}
aside>ul>li .subUL, .productSubUL {/* margin-top: 10px; */}
aside>ul>li .subUL>li {border-bottom: 1px rgb(0 0 0 / 10%) solid;}
aside>ul>li .subUL>li a {display: block;line-height: 140%;padding: 20px 0;color: #747474;font-weight: 600;letter-spacing: 2px;}
aside>ul>li .subUL>li b {/* display: none; */}
aside>ul>li[data-type="1"] { overflow: hidden; }
aside>ul>li[data-type="1"] .subUL {box-shadow: 0 0 15px rgba(var(--black-rgb), 0);opacity: 0;z-index: -1;height: 0;}
aside .subUL li[data-type="1"] .productSubUL, aside .subUL li[data-type="1"] .bookSubUL {box-shadow: 0 0 15px rgba(var(--black-rgb), 0);opacity: 0;z-index: -1;height: 0;margin: 0;}
aside>ul>li[data-type="2"] { overflow: visible; }
aside>ul>li[data-type="2"] .h4{border-color:#444}
aside>ul>li[data-type="2"] .h4 b .fa:before , aside>ul>li .subUL li[data-type="2"] b .fa:before { content: "\f107"; }
aside>ul>li[data-type="2"] .subUL {opacity: 1;z-index: 1;}

.mb_nav { display: none; }

/* 表單下拉選單區塊專屬樣式 (#form-section) */
#form-section {width: 100%;display: flex;justify-content: space-between;align-items: center;}
#form-section .item {border-radius: 2px;display: flex;align-items: center;gap: 24px;width: 100%;max-width: 100%;justify-content: space-between;}
#form-section font {position: relative;display: block;flex-grow: 1;margin: 0 0 0 6px;}
#form-section font::after { content: ''; position: absolute; top: 50%; right: 18px; transform: translateY(-60%) rotate(45deg); width: 8px; height: 8px; border-bottom: 2px solid #5a8e93; border-right: 2px solid #5a8e93; pointer-events: none; transition: transform 0.3s ease; }
#form-section font:hover::after { transform: translateY(-40%) rotate(45deg); }
#form-section select {width: 100%;appearance: none;-webkit-appearance: none;background: transparent;border: 1px solid #e5e5e5;padding: 14px 40px 14px 18px;font-size: 15px;color: #333333;outline: none;cursor: pointer;transition: border-color 0.4s ease, box-shadow 0.4s ease;border-radius: 2px;}
#form-section select:focus { border-color: #5a8e93; box-shadow: 0 0 0 3px rgba(90, 142, 147, 0.1); }


@media (max-width:992px) {
  #content_wrap {flex-direction: column;padding: 20px 0;margin: 20px auto;gap: 30px;}
  #content_wrap aside { width: 100%; }
  #content_wrap .mb_nav {padding: 15px;background-color: #f9f9f9;text-align: center;border: 1px solid #eeeeee;cursor: pointer;border-radius: 4px;margin-bottom: 15px;display: block;}
  #content_wrap .mb_nav p {margin: 0;display: flex;justify-content: space-between;align-items: center;gap: 10px;font-size: 16px;color: #555555;font-weight: bold;}
    #content_wrap .mb_nav p i{font-size: 12px;font-weight: 400;}
  #content_wrap .sidebar-title { border-bottom: none; padding: 10px 15px; }
  #content_wrap #product_list { grid-template-columns: repeat(2,1fr); gap: 20px; }
  #content_wrap .poright_box { width: 100%; }
	#content_wrap #category_nav {position: absolute;display: flex;flex-direction: column;background: #f3f3f3;width: 100%;height: 0;opacity: 0;display: none;z-index: -1;}
	#content_wrap #category_nav.showme {height: auto;opacity: 100%;z-index: 999;padding: 5px 0;display: block;}
    #content_wrap #category_nav li{display:block;}
}
@media (max-width:768px) {
    #content_wrap #category_nav >li.action{margin:0}
  #book_list { grid-template-columns: repeat(2,1fr); }
  #content_wrap .subUL li { flex: 1 1 50%; }
  #content_wrap .badge-text-large { font-size: 46px; }
  #content_wrap .card-badge { top: 15px; left: 15px; }
}
@media screen and (min-width:1281px) {
  aside>ul>li> .h4:hover, aside>ul>li[data-type="2"] .h4  {background:#f8f8f8}
    aside>ul>li:hover .h4 a,aside>ul>li:hover .h4 i {color: #3f4041;}
}
@media screen and (min-width:980px) {
  #google_shere { margin-top: 6vw; }
}
@media screen and (min-width:761px) {
  .form_box p.item {padding: 15px 0;}
  .form_box p.item label { width: 170px; }
  .form_box p.item font { margin: 0 0 0 30px; width: calc(100% - 200px); }
}
@media screen and (max-width:1460px) {
  #wrap .pag_tit { margin-top: 75px; margin-bottom: 0; }
}
@media screen and (max-width:640px) {
  #form-section font {width: 100%;margin: 0;}
  #form-section .item {flex-direction: column;align-items: flex-start;gap: 12px;}
#content_wrap #product_list { grid-template-columns: 1fr; }
  aside>ul>li .h4 { text-align: center; }
  #sub_banner_box .parallax_bg { min-height: 290px; }
  #album_list>div,#album_list>div img { height: 40vw; }
  .mb_nav,#content_wrap .mb_nav { display: flex; flex-direction: column; align-items: center; border: #79797957 1px solid; padding: 10px 0; }
  .mb_nav p { display: flex; }
  .mb_nav b { margin-left: 10px; display: flex; align-items: center; }
  .soon.mb_nav b .fa { transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); }
  .mb_nav .fa:before { content: "\f107"; }
  #category_nav { position: absolute; display: flex; flex-direction: column; background: #f3f3f3; width: 100%; height: 0; opacity: 0; overflow: hidden; }
  #category_nav.showme { height: auto; opacity: 100%; z-index: 999; overflow-y: scroll; max-height: 500px; }
}
@media screen and (max-width:550px) {
  #wrap .pag_tit { font-size: 22px; }
  #content_wrap .list_box li { display: flex; margin: 0; flex-direction: column; width: 100%; }
  #community { margin-top: 10px; }
  #book_list { display: flex; flex-direction: column; }
  .cotitleinfo .pag_tit {font-size: 1.75rem;margin-bottom: 80px;line-height: 1.25;}
  .cotitleinfo {margin-top: -160px;}
  .workframe .homeicon i{font-size: 1.5rem;}
  .workframe .homeicon a{padding:11px}
}
@media screen and (max-width:450px) {
  #album_list>div,#album_list>div img { height: 50vw; }
  #pagenav a,#pagenav strong { margin: 0; width: 24px; height: 24px; line-height: 24px; font-size: 14px; }
  #pagenav p a { display: block; }
}