/* section */
section {padding: 7vw 0 3vw;}
section .area_title .other_txt {font-size: 18px;font-family: "Sedan SC", serif;color: #ffd99c;letter-spacing: 2.5px;}
section .area_title h2,section .area_title h3 {font-weight: 600;font-size: 40px;font-family: "Noto Serif TC", serif;line-height: 1.3;z-index: 1;position: relative;}
section .area_title p{letter-spacing:.2rem;font-weight:300;font-size:18px}
#service-section .slogan-box .area_title{}
section .area_title .more_btn{padding: 11px 0px 13px 0px;line-height:1;border-radius:30px}
section .area_title .more_btn font{line-height:1;font-size:15px;color:#121212}
section .area_title .more_btn svg{width:12px;height:12px;fill:none;stroke:#fff}
section .arrow_btns_box .arrow{width: 60px;height: 60px;border-radius:50%;margin-left:0;border: 1px solid #747474;}
section .arrow_btns_box .arrow svg{width:100%;height:100%;-webkit-transform: scale(.2);transform: scale(.2);}
section .arrow_btns_box .arrow.next{-webkit-transform:scaleX(-1);transform:scaleX(-1)}

section .fixTxt img {animation: cloudFloat 4.2s ease-in-out infinite;will-change: transform;}

@keyframes cloudFloat{
  0%   { transform: translate(-14px, 0px); }
  50%  { transform: translate(14px, -6px); }
  100% { transform: translate(-14px, 0px); }
}

/* topicArea */
#topicArea{position:relative;padding: 9vw 0 3vw;}
#topicArea::before{position:absolute;top:0;left:0;z-index:-1;content:"";width:100%;height:660px;display:block;background: linear-gradient(180deg, #4a3a2f 10%, transparent 90%);pointer-events:none}
#topicArea::after{position:absolute;top:0;right:0;z-index:-1;content:"";width: calc(100% - 570px);height: 800px;display:block;background: #ffefd4;pointer-events:none}
#imglist{width: 95%;display:flex;justify-content:space-between;}
#imglist .img_nav img{width: 400px;height: 230px;object-fit:cover;position:relative}
#leftinfo #imglist .topicitem2::before{position:absolute;top:0;left:0;z-index:1;content:"";width:100%;height:100%;display:block;background:linear-gradient(0deg,#26272bd4 0%,transparent 100%);pointer-events:none}
#imglist img{height: 540px;width: 70%;object-fit:cover}
#imglist .info_box{width: 24%;margin-top: 5%;}
#imglist .info_box h3{font-size: 27px;padding: 0 0 15px 0;margin-bottom: 7px;border-bottom:1px solid rgb(196 196 196 / 50%);letter-spacing:1.5px;font-weight: 600;font-family: "Noto Serif TC", serif;line-height: 1.4;}
#imglist .info_box .text p{width: 100%;margin-bottom:10px;font-weight:500;letter-spacing:0.5px;line-height:170%;font-size:18px}
#imglist .info_box .text .tit{width: 100%;font-size:15px;line-height: 180%;margin-bottom: 30px;}
#imglist .info_box .text .tit{color:#4e4e4e}
#leftinfo #imglist .info_box h3{font-size:17px;color:#fff;font-weight:200;border-bottom:0px solid rgba(0,0,0,0.5);padding:0;margin:0;overflow: hidden;height: 27px;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;}
#leftinfo #imglist .topicitem2{position:relative;margin: 0 42px 20px 0;}
#topicAreaBox .topicitem a,#leftinfo #imglist .topicitem2 a{z-index:10}
#leftinfo #imglist .info_box{margin-right:0;bottom:0;color:#fff;display:flex;flex-direction:column;height:100%;justify-content:flex-end;left:0;overflow:hidden;position:absolute;width:100%;padding:0px 20px 30px;align-items:flex-start;z-index:10}
#topicAreaBox .area_title .other_txt { position: absolute; top: 0px; right: 70px; font-size: 90px; z-index: 0; width: 580px; }
#topicAreaBox .area_title h2,#topicAreaBox .area_title h3{
    width: 105%;
}
#topicAreaBox{width: 83%;margin: 0 auto;position: relative;}
#topicAreaBox .topicitem{display:flex;flex-direction: row;align-items:center;justify-content:space-between}
#imglist .img_box:before{content:url(/images/39/img-light.png);position: absolute;z-index: 0;top: -120px;left: -5vw;animation: lightRotate 20s linear infinite;}
@keyframes lightRotate {from { transform: rotate(0deg); } to   { transform: rotate(360deg); }}
#rightinfo,#leftinfo{display:flex;justify-content:space-between;align-items: flex-start;margin-bottom:20px;position: relative;}
#leftinfo{display:flex;align-items:flex-start;flex-direction: row-reverse;margin-top: -60px;}
#rightinfo .itemTitleBox{order: 1;z-index: 10;}
#rightinfo .itemTitleBox .area_title {display: flex;flex-direction: column;}
#leftinfo #imglist{width: 81%;}
#leftinfo .infoBox{width:34%;margin:0px 0px 0}
#leftinfo .infoBox em,#product_area .infoBox em{font-family:"Cormorant",serif;color:#5a6bb0;font-size:60px;letter-spacing:0.5px}
#leftinfo .infoBox em.txt1,#product_area .infoBox em.txt1{font-weight:800;margin-right:10px}
#leftinfo .infoBox p{margin-top:40px;line-height:190%;letter-spacing:1.5px}
#topicAreaBox .infoBoxbottom p{width:520px;margin:auto;letter-spacing:1.5px;text-align:center;line-height:190%;margin-top:60px}
#topicAreaBox .infoBoxbottom { position: absolute; bottom: -70px; left: -300px; }

/* service_area */
#service_area { padding-top: 8vw; background: no-repeat 50% -1px / cover; }
#service_area .area_title { margin-bottom: 4vw; }
#service_area .custom_list li { text-align: center; -webkit-transform: scale(.65); transform: scale(.65); }
#service_area .custom_list li >div { border-radius: 10%; }
#service_area .custom_list li img { width: 480px; height: 480px; }
#service_area .custom_list li .info_box { padding: 10px 20px; width: 100%; background: rgb(255 255 255 / 80%); bottom: 10%; left: 0; }
#service_area .custom_list li .info_box h3 { height: 39px; line-height: 1.3; letter-spacing: .2rem; font-weight: 400; font-size: 30px; }
#service_area .custom_list li .info_box p { height: 24px; font-weight: 300; font-size: 14px; }
#service_area .custom_list li.slick-current { -webkit-transform: scale(1); transform: scale(1); }
#service_area .arrow_btns_box .arrow { border: 1px var(--dark) solid; box-shadow: 0 0 5px rgb(125 125 125 / 50%); bottom: 240px; }
#service_area .arrow_btns_box .arrow.prev { left: calc((100% - 520px) / 2); }
#service_area .arrow_btns_box .arrow.next { right: calc((100% - 520px) / 2); }

/* product_area */
#product_area { padding: 2vw 0 8vw; background-image: linear-gradient(rgba(255,255,254,0.2),rgba(255,255,255,0.1)),url(/images/39/img-ad-bg.jpg); background-size: cover; background-position: bottom; }
#product_area .infoBoxbottom { position: absolute; top: 0; right: 0; }
#product_area .workframe {width: 100%;margin-left: auto;margin-right: 0;display: grid;align-items: center;grid-template-columns: 5% 90%;justify-content: space-between;transform: translate(5%, 0%);}
#product_area .productleft { display: flex; gap: 20px; flex-direction: column; align-items: center; }
#product_area .productleft .area_title { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; align-content: space-between; }
#product_area .area_title.left { flex: 1 auto; width: 10%; display: flex; flex-direction: column-reverse; margin-bottom: 0 }
#product_area .area_title h3 { margin-top: 0 }
#product_area .infoBox { margin: auto; text-align: center; width: 100%; }
#product_area .productItem .area_title .text_en { font-size: 38px; color: #3e3a39; -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; line-height: 1.1; margin-top: 30px; }
section .infoBox p{letter-spacing: 1.2px;line-height: 1.3;margin-top:0;margin-bottom: 160px;font-family: 'ChenYuluoyan-Thin', serif;font-size: 35px;font-weight: 300;text-align: center;}
#product_area #product_list .slick-list{overflow:visible;margin-top: 140px;}
#product_area #product_list { overflow: hidden; }
#product_area .bottomBox{position:relative;}
#product_area #product_list li >div{position:relative;border-radius: 30px;}
#product_area #product_list li >div::before{position:absolute;top:0;left:0;z-index:1;content:"";width:100%;height:100%;display:block;background:linear-gradient(0deg,#000000d4 0%,transparent 60%);pointer-events:none}
#product_area #product_list li .txttop{display:block;line-height:120%;letter-spacing:1px;color: #fafdff;position:absolute;top: 20px;left: 30px;z-index:4;font-size: 38px;font-family: "Sedan SC", serif;}
#product_area #product_list li img{width: 100%;height: 510px;aspect-ratio: 4/3;border-radius: 30px;}
#product_area #product_list li .info_box {padding: 0 30px 40px;position: absolute;bottom: 0;width: 100%;z-index: 20;display: flex;align-items: flex-start;}
#product_area #product_list li .info_box p {font-weight: 200;font-size: 17px;color: #fff;letter-spacing: 1.5px;}
#product_area #product_list li .info_box p.old { text-decoration: line-through; }
#product_area #product_list li .info_box h3 {width: 100%;height: auto;font-weight: 400;font-size: 22px;color: #fff;text-align: left;letter-spacing: 1.5px;font-family: "Noto Serif TC", serif;line-height: 1.3;}
#product_area #product_list li .slick-track { padding-top: 30px; }
#product_area #product_list li {margin: 0 20px;}
#product_area #product_list .slick-dots { bottom: -20px; }
#product_area #product_list .slick-dots li button { width: 10px; height: 10px; background: var(--info); border-radius: 50%; }
#product_area #product_list .slick-dots li button:before{content:""}
#product_area .arrow_btns_box{display:flex;flex-direction:column;flex-wrap:wrap;margin-bottom:0px;writing-mode:lr;align-items:flex-start}
.Tarrowbox{display:flex;flex-direction: column;gap: 10px;}
.more_btn{z-index:10;position:relative;margin-top: 30px;}
.more_btn a{position:relative;overflow:hidden;width: 140px;padding: 10px 20px 10px;display:inline-block;border-radius: 9px;display: flex;align-items: center;font-size: 20px;font-weight: 300;line-height: 1.2;letter-spacing: 0.5px;font-family: "Lucida Calligraphy", serif;border: 1px solid;}
.more_btn font{text-align:left;color:#4f3c30;font-weight: 300;line-height: 1.2;letter-spacing: 0.5px;font-family: "Lucida Calligraphy", serif;}
.more_btn.white font{letter-spacing:1px;font-size:12px;position:relative;-webkit-writing-mode:inherit;-ms-writing-mode:inherit;writing-mode:inherit;color:#646464;font-family: "Cormorant", serif;margin-right:10px}
.more_btn.white a:before{content:"";height:100%;width:0;display:block;position:absolute;bottom:0;left:-22px;-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s;background-color:#ec530f;-webkit-transform:skewX(-30deg);-ms-transform:skewX(-30deg);transform:skewX(-30deg)}
.more_btn.white a::after{content:'';position:absolute;height:1px;width:100%;bottom:0;left:0;background-color:#484848;-webkit-transform:skewX(-30deg);-ms-transform:skewX(-30deg);transform:skewX(-30deg);z-index:-1;transform-origin:top left;transition:all 1.1s ease-in-out;-webkit-transition:all 1.1s ease-in-out}
.more_btn a span::after {content: "";position: absolute;display: block;width: 12px;height: 12px;top: 50%;right: 10px;-webkit-transition: all 0.3s linear;transition: all 0.3s linear;border-bottom: 1px solid rgb(46 43 38);border-right: 1px solid rgb(46 43 38);transform: rotate(-45deg) translate(-25%,-100%);}

/* service-section */
#service-section {position: relative;padding: 5vw 0 5vw;background-image: linear-gradient(rgba(255,255,254,0.2),rgba(255,255,255,0.1)),url(/images/39/img-s-bg.jpg);background-size: cover;background-repeat: no-repeat;background-position: top;min-height: 100vh;display: flex;flex-direction: column;align-items: center;}
#service-section::before { position: absolute; top: 0; left: 0; z-index: 0; content: ""; width: 100%; height: 30%; display: block; background: linear-gradient(180deg,#ffffff 10%,transparent 90%); pointer-events: none }
#service-section .container {margin: 0 auto;padding-bottom: 28vw;width: 80%;}
#service-section .top-content { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 50px; flex-wrap: wrap; flex-direction: column; align-content: space-between; }
#service-section .slogan-box { width: 100%; }
#service-section .slogan-box .area_title h2 { font-weight: 400; font-size: 34px; }
#service-section .slogan-text { font-size: 2.2rem; font-weight: 300; line-height: 1.4; letter-spacing: 4px; margin-bottom: 30px; color: #555; }
#service-section .description-box { width: 100%; }
#service-section .description-text { font-size: 1rem; padding-top: 20px; line-height: 1.8; color: #404040; margin-bottom: 20px; letter-spacing: 1px; text-align: end; }
#service-section .features-grid {display: grid;grid-template-columns: repeat(3,1fr);gap: 40px;padding-bottom: 35vw;}
#service-section .feature-item { text-align: center; padding: 20px; }
#service-section .icon-wrapper { width: 80px; height: 80px; margin: 0 auto 30px; display: flex; justify-content: center; align-items: center; }
#service-section .icon-wrapper svg { width: 100%; height: 100%; fill: none; stroke: #333; stroke-width: 1.5; }
#service-section .feature-title {font-size: 1.25rem;font-weight: bold;margin-bottom: 20px;padding-bottom: 15px;position: relative;letter-spacing: 2px;text-align: center;}
#service-section .feature-title::after {content: "";position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);width: 100%;height: 1px;background-color: #ccc;}
#service-section .feature-desc {font-size: 1rem;line-height: 1.6;color: #474747;text-align: left;text-align: center;}

@media (max-width:992px) {
  #service-section .features-grid {grid-template-columns: 1fr;gap: 20px;padding-bottom: 8vw;}
  #service-section .top-content { flex-direction: column; text-align: center; }
  #service-section .description-box { text-align: center; margin-top: 40px; }
  #service-section .feature-desc { text-align: center; }
}
@media (max-width:600px) {
  #service-section .slogan-text { font-size: 1.6rem; }
#service-section{
    background-size: contain;
}
}



/* discount_area */
#discount_area { border-bottom: 0; }
#discount_area .bgs_box >div:nth-child(2) { z-index: 2; }
#discount_area .bgs_box >div:nth-child(3) { z-index: 3; }
#discount_area .bgs_box >div:nth-child(1) img { top: 6%; left: -5%; }
#discount_area .bgs_box >div:nth-child(2) img { top: 5%; right: 5%; }
#discount_area .bgs_box >div:nth-child(3) img { top: auto; right: -2%; bottom: 20%; }
#discount_area .bgs_box >div:nth-child(4) img { top: 8%; right: -5%; }
#discount_area .workframe { z-index: 10; }
#discount_area .area_title .other_txt { -webkit-transform: rotate(-11deg) translate(131%, 1em); transform: rotate(-11deg) translate(131%, 1em); }
#discount_area #discount_list { margin-top: 4vw; grid-template-columns: 1fr 43%; grid-template-rows: repeat(2, 1fr); grid-gap: 0 50px; }
#discount_area .diamond_svg { top: -60px; z-index: 5; }
#discount_area #discount_list .info_box { padding: 30px 20px; width: 240px; background: rgb(255 255 255 / 70%); bottom: 20%; left: 5%; }
#discount_area #discount_list .info_box h3 { height: 42px; font-size: 25px; }
#discount_area #discount_list .info_box p { font-size: 14px; }
#discount_area #discount_list .info_box .more { padding: 5px; border-radius: 20px; }
#discount_area #picture_box { grid-row-start: 1; grid-row-end: 3; }
#discount_area #picture_box >div { border-radius: 30px; }
#discount_area #picture_box img { width: 100%; }
#discount_area #freight_box img { width: 100%; height: 100%; border-radius: 30px; }
#discount_area #slogan_box { padding-bottom: 40px; }
#discount_area #slogan_box:before { position: absolute; width: 65%; height: 1.5px; background: var(--primary); display: block; top: 23%; left: -70px; content: ""; opacity: .5; }
#discount_area #slogan_box .row { padding-left: 130px; background: url(/images/00/img_dis_sub_txt_bg.png) no-repeat 0 50%; }
#discount_area #slogan_box p { letter-spacing: .2rem; font-weight: 300; font-size: 28px; }
#discount_area #slogan_box article { width: 300px; font-weight: 300; font-size: 17px; }

/* book_area */
#book_area { margin-bottom: -1px; padding: 0; border-bottom: 0; }
#book_area .area_title { padding: 5vw 3vw; width: 390px; background: no-repeat right 50% / cover; z-index: 3; }
#book_area .area_title .other_txt { -webkit-transform: rotate(-11deg) translate(101%, 1.2em); transform: rotate(-11deg) translate(101%, 1.2em); }
#book_area .area_title h2 { border-color: var(--light); }
#book_area .area_title p { margin: 0 40px 80px 0; }
#book_area .area_title .more_btn font { border-right-color: #5b616b; color: #5b616b; }
#book_area .area_title .more_btn svg { stroke: #394250; }
#book_area #book_box { width: 1%; flex: 1 auto; -webkit-transform: translateX(5vw); transform: translateX(5vw); }
#book_area #book_box .top_tit { text-transform: uppercase; white-space: nowrap; -webkit-text-stroke: 1px #dbdbdb; text-stroke: 1px #6b6b6b; line-height: 1; letter-spacing: 3rem; font-size: 10vmax; color: transparent; opacity: .5; -webkit-transform: translate(-7vw, -1vmax); transform: translate(-7vw, -1vmax); -webkit-animation: book_element 2.5s linear infinite; animation: book_element 2.5s linear infinite; }
#book_area #book_box #book_list { margin: 7vmax 0 4vw; }
#book_area #book_box #book_list li >div { margin: 0 15px; }
#book_area #book_box #book_list li >div img { width: 100%; border-radius: 20px; }
#book_area #book_box #book_list li >div h3 { height: 34px; font-weight: 300; font-size: 20px; }


/* news_area */
#news_area{padding:5vw 0 5vw 0}
section  .itemTitleBox{padding-top:0px;display:inline-block;animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#news_area .itemTitleBox{display:flex;flex-direction:column;}
#news_area .area_title { margin-bottom: 40px; }
#news_area .arrow_btns_box { margin-bottom: 0; margin-top: 20px; display: flex; justify-content: flex-end; }
#news_area .area_title .other_txt { position: absolute; top: -50px; left: 40px; font-size: 6rem; line-height: 1.1; opacity: .5; }
#news_area .area_title h3 { margin-top: 0 }
#news_area .infoBox p { margin-bottom: 60px; text-align: right; }
#news_area section { padding: 2vmax 0 3vmax; position: relative; display: flex }
#news_area img.dight { position: absolute; left: 150px; z-index: 11; min-width: 100%; margin-top: 0; object-fit: cover; display: none }
#news_area {padding: 9vmin 0 1vmax;overflow: initial;position: relative;background-image: url(/images/39/img-bg.png);background-size: auto;background-repeat: no-repeat;background-position: 50% 50%}
#news_area .workframe { width: min(85%,1660px); }
#news_area #news_txt { top: 2vmax; right: 5vmax }
#news_area .news_box { position: relative; display: flex; z-index: 1; flex-wrap: wrap; justify-content: space-between; }
#news_area .news_box .leftBox,#news_area .news_box .rightBox { position: relative; -ms-flex-negative: 0; flex-shrink: 0; width: 47%; }
#news_area .news_box .rightBox .newsList2 { border: 1px solid #747474; padding: 20px; }
#news_area .news_box .rightBox .newsList2 .Txt { display: flex; flex-direction: row; align-items: center; }
#news_area .news_box .rightBox .newsList2 .Txt .introtext { width: calc(100% - 260px); }
#news_area .news_box .leftBox { width: 45%; }
section  .title_box,#news_area .tabs_box { animation-name: fadeInUp; -webkit-animation-name: fadeInUp }
#news_area .tabs_box { margin-top: 0px }
#news_area .tabs_box .tabs_btn .newsList { display: flex; flex-direction: row; align-items: flex-start; position: relative; margin-bottom: 20px; margin-right: 40px; margin-top: 10px; padding-right: 20px; justify-content: flex-start }
#news_area .tabs_box .tabs_btn li:last-child::after { content: ""; position: absolute; left: 0px; top: 72%; margin-top: -9px; width: 1px; height: 15px; opacity: 0.3; background-color: #383636 }
#news_area .tabs_box .tabs_btn li::after { content: ""; width: 17px; height: 15px; display: block; position: absolute; top: 50%; right: 10px; -webkit-transform: translate(-10px,-50%); transform: translate(-10px,-50%); background: url(/images/39/icon-arrow.png); -webkit-transition: 0.6s; transition: 0.6s; opacity: 0 }
#news_area .tabs_box .tabs_body { width: calc(100% - 0px) }
#news_area .tabs_box .tabs_body .news_list { display: flex; flex-wrap: wrap }
section  .title_box h2 { background: linear-gradient(to right,var(--info) 100%,var(--info) 65%); -webkit-background-clip: text; background-clip: text }
#news_area .tabs_btn a { padding: 0px 20px 0px 0px; font-size: 20px; letter-spacing: 1px; color: #383838; font-weight: 500; display: block }
#news_area .tabs_btn .active a { color: var(--primary) }
#news_area .tabs_body .tab_info { width: 100%; top: 0; left: 0; opacity: 0; pointer-events: none }
#news_area .tabs_body .tab_info.showBox { opacity: 1; pointer-events: auto }
#news_area .tabs_body .tab_info li { width: calc((100%/1) - 0px) }
#news_area .tabs_body .tab_info .items { display: flex; align-items: center; border-bottom: 1px solid #ded6d6 }
#news_area .tabs_body .tab_info .items .Img { padding-bottom: 20px }
#news_area .tabs_body .tab_info .category { padding: 0px 10px; background: #e1e1e1; color: var(--info); line-height: 1; font-size: 18px; line-height: 217%; font-weight: 500 }
#news_area .f_aitems_end { display: flex; align-items: center; margin: 10px 0px 0 }
#news_area .f_aitems_right { position: relative; width: calc(100% - 0px); padding: 14px 0 }
#news_area .tabs_body .tab_info .time { font-size: 14px; display: flex; flex-direction: row }
#news_area .tabs_body .tab_info .time font.m_txt { color: #19a8de; font-weight: 500; font-family: 'Tenor Sans'; margin-right: 10px; line-height: 140%; font-size: 19px }
#news_area .tabs_body .tab_info .time font.d_txt { width: 20px; grid-area: time_d; color: var(--dark) }
#news_area .tabs_body .tab_info h3 { height: auto; font-weight: 500; font-size: 22px; line-height: 140%; width: calc(100% - 60px); -webkit-line-clamp: 1 }
#news_area .tabs_body .tab_info article { height: 50px; font-weight: 300; font-size: 14px; color: #818181; -webkit-line-clamp: 2; margin: 6.5px 0 }
#news_area .btn { position: absolute; right: 10px; bottom: 30px; width: 35px; height: 35px; padding: 0px 0px; width: 35px; height: 35px; margin: 0; border-radius: 50%; display: flex; justify-content: center }
#news_area .tab_info li:hover .btn { scale: 1; translate: 0 -10px; background-color: #0193de }
#news_area .tab_info li:hover .btn svg { fill: #ffffff }
#news_area .tabs_box .tabs_btn .moreBtn a { font-weight: 400; color: #fff; font-size: 14px; line-height: 50px; padding: 0 20px }
#news_area .newsList2 .Img img { width: 100%; height: 420px; object-fit: cover }
#news_area .moreN2 { position: absolute; top: 0; left: 0; z-index: 10; width: 100%; height: 100% }
#news_area .newsList2 .Img { margin-bottom: 20px; position: relative }
#news_area .newsList2 .Txt { position: relative; padding: 10px 20px; z-index: 3; display: flex; align-items: flex-start; flex-direction: column; }
#news_area .newsList2 .Txt .title { margin-bottom: 0px; font-size: 18px; -webkit-line-clamp: 1; height: auto; font-family: "Noto Serif TC",serif; }
#news_area .newsList2 .Txt .text { font-size: 15px; margin-top: 7px; color: #7f7f7f; -webkit-line-clamp: 2; height: 57px }
#news_area .newsList2 .Txt .more_btn { margin-top: 0; position: absolute; right: 0; top: 0; top: 50%; transform: translate(0%,-50%); }
#news_area .newsList2 .Txt .more_btn a { border: 0px solid; width: 100px; padding: 10px 0px 10px; }
#news_area .newsList2 .Txt .top { position: relative; padding-right: 40px; }
#news_area .newsList2 .Txt .top .dateBox { display: flex; -webkit-box-align: end; align-items: flex-start; line-height: 1; font-weight: 600; color: #fff; flex-direction: row; justify-content: center; position: relative }
#news_area .newsList2 .Txt .top .dateBox .date,#news_area .rightBox .newsList2 .Txt .top .dateBox .date { font-size: 24px; line-height: 1.1; font-family: "Sedan SC",serif; font-weight: 400; }
#news_area .newsList2 .Txt .top .dateBox .year,#news_area .rightBox .newsList2 .Txt .top .dateBox .year { font-size: 15px; margin-right: 14px; font-family: "Noto Serif TC",serif; }
#news_area .newsList2 .Txt .top .classTitle,#news_area .rightBox .newsList2 .Txt .top .classTitle { width: 100px; height: 40px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; font-size: 16px; font-weight: 700; color: #393939; background-color: #d4d4d4 }
#news_area .newsList2 .Txt .introtext { width: calc(100% - 100px); }
#news_area .leftBox .newsList2 .Txt { border-bottom: 1px solid #757575; padding: 20px 20px }
#news_area .newsList2 { border-top: 1px solid #757575; }
#news_area .leftBox li,#news_area .rightBox li { position: relative; }
#news_area .arrow_btns_box .Tarrowbox { display: flex; flex-direction: row; }
#news_area .arrow_btns_box .arrow.prev { transform: rotate(0deg); }
#news_area .arrow_btns_box .arrow.next { transform: rotate(180deg); }
#news_area .infoBoxbottom { position: absolute; bottom: 120px; right: -280px; }

/* animation */
@-webkit-keyframes book_element { 0% , 100% { -webkit-transform: translate(-7vw, -1vmax); } 50% { -webkit-transform: translate(-6vw, -1vmax); } }
@keyframes book_element { 0% , 100% { transform: translate(-7vw, -1vmax); } 50% { transform: translate(-6vw, -1vmax); } }

@media screen and (min-width: 1501px) {
	#book_area .area_title { padding: 5vw 40px 6vw calc((100% - 1440px) / 2); width: 650px; }
	#news_area .bg_box { left: 6rem; }
}
@media screen and (max-width: 1500px){
	#service_area .workframe { width: 100vw; }
	section .area_title h3, #topicAreaBox .area_title h3, section .area_title h2,#service-section .slogan-box .area_title h2 {font-size: 2vmax;}
}
@media (max-width:1440px){
	#news_area .itemTitleBox .title_box{margin-bottom:10px}
	#product_area #product_list li img{height: 570px;}
	#product_area .arrow_btns_box{}
	#topicAreaBox{margin-right:40px;width: 90%;}
}

@media screen and (min-width: 1281px){
	#news_area .tabs_body .tab_info .items:hover .more .arrowWrap::before,.infoArea .leftBox:hover .arrowWrap::before, .infoArea .leftBox + .rightBox .infoList li:hover .arrowWrap:before {width: 36px;height: 36px;top: calc(50% - 18px);right: 0px;background-color: rgb(223 223 223 / 70%);border: 1px solid rgb(223 223 223 / 70%);}
	#news_area .tabs_body .tab_info .items:hover .more .arrowWrap .arrow,.infoArea .leftBox:hover .more .arrow, .infoArea .leftBox + .rightBox .infoList li:hover .more .arrow {animation: moreArrow 1s infinite;}
	#news_area .bg_box { width: 860px; }
	section .arrow_btns_box .arrow.prev{transform: rotate(90deg);}
	section .arrow_btns_box .arrow.next { transform: rotate(270deg); }

}
@media screen and (max-width: 1280px){
	#news_area .tabs_box .tabs_btn { width: 100% }
	#news_area .title_box h2:before { left: 50% }
	#news_area .title_box .more_btn { bottom: 30px; left: 50%; padding: 10px 15px; font-size: 13px }
	#news_area .title_box article { margin-top: 1rem; margin-bottom: 1.75rem }
	#news_area .title_box article br { display: none }
	#news_area .tabs_body .tab_info .items { width: auto }
	#news_area:after { display: none }
	#news_area .tabs_body .tab_info .time font.y_txt { font-size: 40px }
	#news_area .tabs_body .tab_info .time font.m_txt { font-size: 13px }
	#news_area .f_aitems_end { margin: 0 }
	#news_area .tabs_body .tab_info .category { font-size: 13px }
	#news_area .tabs_body .tab_info h3 { margin-top: 16px }
	#topicAreaBox { margin: auto; width: 85% }
	#news_area section { display: flex; flex-direction: row; width: 90vw; padding: 4vmax 0 6vmax }
	#topicArea::after { width: calc(100% - 0px); height: 100%; }
	#topicArea::before { height: 640px }
	#rightinfo .itemTitleBox { width: 15% }
	.aboutArea .titleBox { margin: auto auto 46px }
	section .area_title h3,#topicAreaBox .area_title h3,section .area_title h2,section .area_title h3,#service-section .slogan-box .area_title h2 { font-size: 3.2vmax; }
	#topicAreaBox .area_title .other_txt { margin-top: 50px; font-size: 60px; width: 410px; right: 0; }
	#imglist .info_box h3 { font-size: 22px; padding: 0 0 10px 0; margin-bottom: 10px }
	#imglist .info_box .text p,#imglist .info_box .text .tit { width: 100% }
	#product_area #product_list li .info_box h3 { font-size: 22px }
	#product_area #product_list li .info_box { padding: 0 20px 20px }
	#product_area #product_list li .info_box p { font-size: 15px }
	section .area_title { margin-bottom: 20px; }
	#leftinfo .infoBox em,#product_area .infoBox em { font-size: 4.5vmax; }
	#discount_area { padding-bottom: 5vw; }
	#discount_area #discount_list { grid-template-rows: 55% 45%; }
	#discount_area #discount_list .info_box { padding: 20px; }
	#discount_area #slogan_box { padding-bottom: 30px; }
	#discount_area #slogan_box:before { display: none; }
	#discount_area #slogan_box .row { padding-left: 80px; }
	#book_area .area_title { width: 400px; }
	#news_area .tabs_box { display: flex; flex-direction: column; align-items: flex-start; width: 100%; margin-top: 20px }
	#news_area .tabs_box .tabs_btn .newsList { display: flex; justify-content: flex-start }
	#news_area .tabs_box .tabs_body { width: calc(100% - 0px) }
	#news_area .tabs_body .tab_info li { width: calc((100%/1) - 0px) }
	#rightinfo { display: flex; flex-direction: column-reverse; align-items: center }
	#leftinfo .infoBox,#rightinfo .itemTitleBox::before,#topicArea::before,#news_area .rightBox { display: none }
	#leftinfo #imglist,#rightinfo .itemTitleBox,#imglist,#news_area .news_box .leftBox { width: 100% }
	section .fixTxt { display: none; }
	#product_area .workframe { display: flex; flex-direction: column; align-items: flex-start; transform: translate(0,0%); width: 95%; margin: auto; }
	#product_area .productleft,#product_area .bottomBox { width: 100%; }
	section .infoBox p { margin-bottom: 50px; font-size: 31px; }
	#product_area .productItem .area_title .text_en { -webkit-writing-mode: lr; writing-mode: lr; font-size: 32px; margin-top: 20px; }
	#product_area .productleft .area_title { display: flex; flex-direction: column; align-items: center; }
	#product_area .productleft .Tarrowbox { display: flex; flex-direction: row; align-items: center; }
	#product_area #product_list .slick-list { margin-top: 40px; }
	#news_area .area_title .other_txt { font-size: 3rem; top: 0px; left: 40px; }
	#news_area .area_title {margin-bottom: 0;width: 130px;}
	#imglist img { height: 400px; width: 62%; }
	#imglist .info_box { width: 32%; }
	#leftinfo { margin-top: 0; }
}
@media screen and (max-width: 1024px){
	#discount_area .bgs_box >div:nth-child(1) img { width: 19vw; }
	#discount_area .bgs_box >div:nth-child(2) img { width: 8vw; }
	#discount_area .bgs_box >div:nth-child(3) img { width: 9vw; bottom: 0; }
	#discount_area .bgs_box >div:nth-child(4) img { width: 40vw; }
	#discount_area .diamond_svg { width: 6vw; top: -6vw; left: 7vw; }
	#news_area .tabs_box ul{margin-bottom:0.55rem}
}
@media screen and (max-width: 980px){
	#service_area .custom_list li img { width: 45vw; height: 45vw; }
	#service_area .arrow_btns_box .arrow{bottom:20vw}
	#service_area .arrow_btns_box .arrow.prev{left:25vw}
	#service_area .arrow_btns_box .arrow.next{right:25vw}
	#discount_area #discount_list{grid-template-columns:1fr;grid-template-rows:400px 250px;grid-gap:30px 50px;align-content:center}
	#discount_area #picture_box{grid-row-end:inherit}
	#discount_area #picture_box img{height:400px}
	#discount_area #slogan_box,#discount_area .diamond_svg{display:none}
	#news_area:before{display:none}
	#news_area .news_box{display:flex;flex-direction:column}
	#news_area .news_box .leftBox{width:calc(100% - 0px);padding:0}
	#news_area .news_box .rightBox{margin-top:40px;width:calc(100% - 0px)}
	#product_area .arrow_btns_box{display:flex;flex-direction:column;align-items:center;}
	#product_area #product_list{}
	#product_area{padding: 2vw 0 12vw;}
}
@media screen and (max-width: 768px){
	#book_area { flex-wrap: wrap; }
	#book_area .area_title { width: 100%; }
	#news_area{padding:0;background-image:none}
	#news_area img.dight{margin-top:-30px}
	#news_area .f_aitems_end{margin-bottom:5px;width:calc(100% - 50px)}
	#news_area .btn{top:20px;right:0}
	#news_area .tabs_body .tab_info h3{width:calc(100% - 0px)}
	#product_area .Tarrowbox{margin-bottom: 0px;}
	#product_area #product_list li img{height: 440px;}
	#service-section .description-text { text-align: center; letter-spacing: 1px; }
	#topicAreaBox .topicitem { display: flex; flex-direction: column; align-items: center }
	#imglist img { width: 100%; height: 270px; }
	#imglist .info_box { width: 100%; margin-right: 0; margin-top: 20px }
	#imglist .img_nav img { width: 160px; height: 110px; }
	#leftinfo #imglist .topicitem2 { margin: 0 30px 20px 0; }
	#leftinfo { margin-top: 30px }
	#leftinfo #imglist .info_box { padding: 0px 10px 10px }
	#topicAreaBox .infoBoxbottom p { width: 100%; margin-top: 20px }
}
@media (max-width:640px){
	#service_area .custom_list li img{width:60vw;height:60vw}
	#service_area .arrow_btns_box .arrow.prev{left:15vw}
	#service_area .arrow_btns_box .arrow.next{right:15vw}
	#service_area .arrow_btns_box .arrow{bottom:30vw}
	#product_area{padding: 14vw 0 13vw;}
	#news_area .news_box{width:calc(100% - 20px);margin-right:0}
	#news_area .itemTitleBox{width:100%;display:flex;align-items:flex-start;justify-content:center;padding-top:0px;padding-bottom:50px}
	#news_area section{display:flex;flex-direction:column-reverse;align-items:center}
	#imglist .img_box:before{display: none;}
}
@media screen and (max-width: 550px){
	#service_area .custom_list li img { width: 80vw; height: 80vw; }
	#service_area .custom_list li .info_box h3 { height: 1.5em; font-size: 7vw; }
	#service_area .arrow_btns_box .arrow.prev { left: 5vw; }
	#service_area .arrow_btns_box .arrow.next { right: 5vw; }
	#product_area .area_title.left {width: 20%;}
	#topicAreaBox .area_title .other_txt { display: none; }
	#book_area #book_box #book_list li >div img { width: 65vw; }
}