@import url('/css/fontawesome-all.css');
@import url('/css/font-awesome.min.css');
@import url('/css/fontawesome.min.css');
@import url('/css/all.min.css');
@import url('/css/SeoJump.css');
@import url('/css/contentBuilder.css');
@import url('root.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100;300;400;500;700;900&family=Noto+Sans+TC:wght@100;300;400;500;700;900&family=Noto+Sans:wght@400;700&family=Noto+Serif+SC:wght@200;300;400;500;600&family=Noto+Serif+TC:wght@200;300;400;500;600&family=Noto+Serif:wght@400;700&family=Frank+Ruhl+Libre:wght@300;400;500;700;900&family=Quicksand:wght@300;400;500;600;700&display=swap');

/* main.less */
.webBox *,.webBox:before,.webBox:after{transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;}.webBox header #menubtn[data-type="2"] a span:nth-child(1){transform:rotate(45deg);-webkit-transform:rotate(45deg);}.webBox header #menubtn[data-type="2"] a span:nth-child(3){transform:rotate(-45deg);-webkit-transform:rotate(-45deg);}@media (min-width:1281px){.webBox header #webmenu li .menu_body{transform:translate(0,30px);-webkit-transform:translate(0,30px);}.webBox header #webmenu li .menu_body .subOption li .sub2Option{transform:translate(-30px,0);-webkit-transform:translate(-30px,0);}.webBox header #webmenu li .menu_body .subOption li .sub2Option li .sub3Option{transform:translate(-30px,0);-webkit-transform:translate(-30px,0);}.webBox header #webmenu li .menu_body .subOption li .sub2Option li:hover .sub3Option{transform:translate(0,0);-webkit-transform:translate(0,0);}.webBox header #webmenu li .menu_body .subOption li:hover .sub2Option{transform:translate(0,0);-webkit-transform:translate(0,0);}.webBox header #webmenu li:hover .menu_body{transform:translate(0,0);-webkit-transform:translate(0,0);}.webBox header #webmenu li:last-child .menu_body .subOption li .sub2Option{transform:translate(30px,0);-webkit-transform:translate(30px,0);}.webBox header #webmenu li:last-child .menu_body .subOption li .sub2Option li .sub3Option{transform:translate(30px,0);-webkit-transform:translate(30px,0);}.webBox header #webmenu li:last-child .menu_body .subOption li .sub2Option li:hover .sub3Option{transform:translate(0,0);-webkit-transform:translate(0,0);}.webBox header #webmenu li:last-child .menu_body .subOption li:hover .sub2Option{transform:translate(0,0);-webkit-transform:translate(0,0);}}.webBox header #search_box #openform{width:45px;height:45px;border-radius:50%;}.webBox header #search_box form{transform:translate(30px,0);-webkit-transform:translate(30px,0);}.webBox header #search_box[data-type="2"] form{transform:translate(0,0);-webkit-transform:translate(0,0);}.webBox .img_scale img{transform:scale(1);-webkit-transform:scale(1);}@media (min-width:1281px){.webBox .img_scale:hover img{transform:scale(1.1);-webkit-transform:scale(1.1);}}.webBox #SeoStarRating font{margin-right:5px;display:inline-block;line-height:110%;vertical-align:text-bottom;color:#ffc107;}.webBox #SeoStarRating font *{color:#ffc107;}.webBox #SeoStarRating font:first-child{font-weight:bold;font-size:18px;}.webBox #SeoStarRating font:last-child{color:#cb0244;}.webBox #webSeo .seo{-webkit-animation:marquee 200s linear infinite;animation:marquee 200s linear infinite;}.webBox #footer_btn a{width:45px;height:45px;border-radius:50%;}@media (max-width:550px){.webBox #footer_btn a{width:40px;height:40px;border-radius:50%;}}

* { margin: 0; padding: 0; box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;}
*:focus { outline: none; }

body { margin: 0; }
body ::selection { background: var(--gray); text-shadow: none; color: var(--white); }
body::-webkit-scrollbar { width: 5px; }
body::-webkit-scrollbar-track { background: rgba(var(--gray-rgb), .4); }
body::-webkit-scrollbar-thumb { background: var(--primary); }

header, footer, div, nav, article, h2, h3, h4, h5, h6, hr, p, form, label, input, textarea, ul, li, img, svg, span, font, strong, b, a, i { text-align: left; vertical-align: middle; word-wrap: break-word; word-break: break-word; line-height: 170%; border-width: 0; font-family: var(--font-family), sans-serif; font-size: 16px; color:  var(--info); }

ul , ol { list-style: none; }

fieldset { border: 0; }

input , button , select , textarea { padding: 5px 15px; width: calc(100% - 32px); border: 1px rgba(var(--black-rgb), .15) solid; border-radius: 0; background: none; box-shadow: none; outline: none; font-size: 16px; color: var(--gray); -webkit-appearance: none; -moz-appearance: none; appearance: none; }
select { padding: 10px 15px; width: 100%; }
input#Checknum { margin-right: 15px; width: 70px; max-width: calc(100% - 97px); }
input::-webkit-input-placeholder , textarea::-webkit-input-placeholder { font-weight: 400; color: rgba(var(--black-rgb), .6); }
input::-moz-placeholder , textarea::-moz-placeholder { font-weight: 400; color: rgba(var(--black-rgb), .6); }
input:-ms-input-placeholder , textarea:-ms-input-placeholder { font-weight: 400; color: rgba(var(--black-rgb), .6); }
input:-moz-placeholder , textarea:-moz-placeholder { font-weight: 400; color: rgba(var(--black-rgb), .6); }

html.loading_lock{overflow:hidden;}
body.loading_lock{position:fixed;left:0;width:100%;overflow:hidden;}

/* img */
img { max-width: 100%; }
.img_cover { width: 100%; object-fit: cover; }
.img_contain { width: 100%; object-fit: contain; }

a , a:link , a:visited , a:hover { text-decoration: none; white-space: pre-wrap; }
a.masklink{position:absolute;width: 100%;height: 100%;top: 0;left: 0;z-index: 6;}
/* general class set */
.txt_clamp { overflow: hidden; height: 27px; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
.d_inblock.txt_clamp { display: -webkit-inline-box; }
.atag_item { width: 100%; height: 100%; top: 0; left: 0; }
.nowrap_box { font-size: 0; }
.txt_num { font-family: 'Quicksand', sans-serif; }

/* btn */
.btn , .btn_outline { padding: 2px 10px; }
.more_btn { padding: 10px 35px; text-transform: capitalize; }
.more_btn:before { position: absolute; width: 100%; height: 100%; background: var(--white); top: 0; left: 0; opacity: .3; z-index: 9; content: ""; -webkit-transition: -webkit-transform .6s; transition: -webkit-transform .6s; transition: transform .6s; transition: transform .6s, -webkit-transform .6s; -webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,180deg) translate3d(0,100%,0); transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,180deg) translate3d(0,100%,0); }

/* badge  */
.badge { padding: 2px 10px; box-shadow: none; }
.badge_lighten { padding: 0 4px; min-width: 22px; border-radius: 3px; font-weight: 400; text-align: center; font-size: 12px; vertical-align: text-bottom; }

/* photo,bgBox */
a.photo , .bgBox { overflow: hidden; background: no-repeat 50% / cover; display: block; }

/* fancybox */
[class^="fancybox-"] , [class^="fancybox-"] * , .slick-track , .fa , .fas , .fa:before , .fas:before , .fa:after , .fas:after , .trans_none_box { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }
[class^="fancybox-"], [class^="fancybox-"] * { font-family: inherit; color: currentColor; }

/* webBox */
.webBox { overflow: hidden; position: relative; width: 100%; }
.webBox .pageh1 { position: absolute; top: 0; z-index: 1; }
.webBox .wrapper { position: relative; background: var(--white); z-index: 2; }
.webBox .slick-slider { margin-bottom: 0; }

/* workframe */
.workframe{width:min(1440px,calc(100% - 120px));margin-left:auto;margin-right:auto;}


/* ==================== Common ==================== */
.workframe{width:min(1440px,calc(100% - 120px));margin-left:auto;margin-right:auto;}
.title_box{position:relative;margin-bottom: clamp(20px,1vw,50px);}
.sub_title{position:relative;display:flex;margin:0 0 15px;align-items:center;justify-content:center;gap:13px;color:var(--primary);font-size:clamp(11px,.8vw,14px);font-weight:600;line-height:1.3;letter-spacing:.24em;text-transform:uppercase;}
.sub_title:before,.sub_title:after{content:"";display:block;width:38px;height:1px;flex:none;}
.sub_title:before{background:linear-gradient(90deg,rgba(195,154,92,0) 0%,var(--primary) 100%);}
.sub_title:after{background:linear-gradient(90deg,var(--primary) 0%,rgba(195,154,92,0) 100%);}
.area_title{position:relative;margin:0;padding-bottom:28px;color:var(--secondary);font-size:clamp(34px,3vw,52px);font-weight:600;line-height:1.25;letter-spacing:.08em;}
.area_title:before{content:"";position:absolute;z-index:2;bottom: 1px;left:50%;width:6px;height:6px;background:var(--primary);transform:translate(-50%,2px) rotate(45deg);}
.area_title:after{content:"";position:absolute;bottom:2px;left:50%;width:94px;height:1px;background:linear-gradient(90deg,rgba(21,40,68,0) 0%,rgba(21,40,68,.4) 25%,var(--primary) 43%,var(--primary) 57%,rgba(21,40,68,.4) 75%,rgba(21,40,68,0) 100%);transform:translateX(-50%);}
.title_box.title_left .sub_title{justify-content:flex-start;}
.title_box.title_left .sub_title:before{display:none;}
.title_box.title_left .sub_title:after{width:50px;background:linear-gradient(90deg,var(--primary) 0%,rgba(195,154,92,0) 100%);}
.title_box.title_left .area_title{text-align:left;}
#about_area .title_box.title_left .area_title:after{display:none;}
.title_box.title_left .area_title:before{left: auto;transform:translate(0,2px) rotate(45deg);display: none;}
.title_box.title_left .area_title:after{left:0;width:94px;background:linear-gradient(90deg,var(--primary) 0%,rgba(195,154,92,.45) 44%,rgba(21,40,68,0) 100%);transform:none;}
.txt_primary_5{color:var(--primary);}
.txt_secondary_5{color:var(--secondary);}

@media screen and (max-width:1470px){
	.workframe{width: min(1440px, calc(90% - 120px));}
}
@media screen and (max-width:1199px){
.workframe{width:calc(100% - 70px);}
}
@media screen and (max-width:767px){
:root{--section-space:80px;}
.workframe{width:calc(100% - 40px);}
.title_box{margin-bottom:40px;}
.sub_title{margin-bottom:11px;gap:10px;font-size:11px;letter-spacing:.2em;}
.sub_title:before,.sub_title:after{width:28px;}
.area_title{padding-bottom:22px;font-size:clamp(30px,7.5vw,40px);}
.area_title:after{width:76px;}
.title_box.title_left .sub_title:after{width:40px;}
.title_box.title_left .area_title:after{width:76px;}
}
@media screen and (max-width:480px){
:root{--section-space:65px;}
.workframe{width:calc(100% - 32px);}
.title_box{margin-bottom:36px;}
.sub_title{font-size:11px;letter-spacing:.18em;gap:8px;}
.sub_title:before,.sub_title:after{width:22px;}
.area_title{padding-bottom:20px;font-size:30px;letter-spacing:.06em;}
.area_title:after{width:68px;}
.title_box.title_left .sub_title:after{width:34px;}
.title_box.title_left .area_title:after{width:68px;}
}

.section_transition { position: relative; z-index: 5; height: 110px; margin-top: -1px; pointer-events: none; overflow: hidden; }
.section_transition:before,.section_transition:after { content: ""; position: absolute; left: 0; width: 100%; height: 100%; }
.section_transition span { position: absolute; z-index: 3; left: 0; top: 48%; width: 100%; height: 1px; background: linear-gradient(90deg,transparent 3%,#b78b42 20%,#d5b46d 53%,#8c672d 82%,transparent 98%); transform: rotate(-3deg) scaleX(1.05); transform-origin: center; }
.transition_light_dark { background: #11181d; }
.transition_light_dark:before { top: -1px; background: #f5f4f0; clip-path: polygon(0 0,100% 0,100% 8%,69% 45%,35% 72%,0 34%); }
.transition_light_dark:after { top: 0; background: rgba(183,139,66,.1); clip-path: polygon(0 34%,35% 72%,69% 45%,100% 8%,100% 11%,69% 49%,35% 76%,0 39%); }
.transition_dark_light { background: #f5f4f0; }
.transition_dark_light:before { top: 0; background: #11181d; clip-path: polygon(0 0,100% 0,100% 25%,76% 58%,48% 29%,19% 73%,0 48%); }
.transition_dark_light:after { top: 0; background: rgba(183,139,66,.12); clip-path: polygon(0 47%,19% 72%,48% 28%,76% 57%,100% 24%,100% 28%,76% 62%,48% 34%,19% 78%,0 53%); }
.section_transition{position:relative;z-index:5;height:110px;margin-top:-110px;pointer-events:none;overflow:hidden;background:transparent;}
.transition_banner_product{background:transparent;}
.transition_banner_product:before{content:"";position:absolute;z-index:2;left:0;bottom:-1px;width:100%;height:82px;background: #ececea;clip-path: polygon(0 100%,0% 100%,28% 3%,100% 43%,100% 0,100% 100%,0 100%);}
.transition_banner_product:after{content:"";position:absolute;z-index:3;left:-2%;top:52px;width:104%;height:1px;background:#b78b42;transform:rotate(-2.3deg);transform-origin:center;}
.transition_banner_product span{position:absolute;z-index:4;left:0;bottom: 0;margin-top: -18px;width:100%;height: 86px;border-top:1px solid rgba(183,139,66,.22);clip-path: polygon(0 30%,19% 60%,48% 2%,46% 43%,100% 0,100% 100%,0 100%);z-index: 1;transform: rotate(-1deg) scaleX(2.05);}
#product_area{position:relative;z-index:2;}

.product_application_transition{position:relative;z-index: 6;height:78px;margin-bottom:-78px;pointer-events:none;overflow:visible;background:transparent;}
.product_application_transition:before{content:"";position:absolute;z-index:2;left:0;top: -1px;width:100%;height: 136px;background: #ebebeb;clip-path: polygon(0 0,100% 0,100% 1%,84% 48%,0 0%);}

.product_application_transition span{position:absolute;z-index:4;right:-1%;bottom: 39px;width: 103%;height:1px;background:linear-gradient(90deg,transparent,#b78b42 20%,#d3ad65 65%,#9d7538);transform: rotate(
361deg);transform-origin:right center;}

.application_about_transition{position:relative;z-index:5;height:90px;margin-top:-90px;pointer-events:none;overflow:hidden;background:transparent;}
.application_about_transition:before{content:"";position:absolute;z-index:2;right:0;top:0;width: 54%;height:100%;background:#f5f4f0;clip-path: polygon(64% 0%,100% 50%,100% 100%,0% 100%);}
.application_about_transition span{position:absolute;z-index:3;left: 66%;bottom:0;width: 79%;height:1px;background:linear-gradient(90deg,#b78b42,#d4ad63 65%,transparent);transform: rotate(
0deg);transform-origin:left center;opacity: 0;}
#about_area{position:relative;z-index:4;}


@media screen and (max-width:768px) {
.transition_banner_product:before{clip-path: polygon(0 100%, 0% 100%, 68% 35%, 100% 43%, 100% 0, 100% 100%, 0 100%);}
 .transition_banner_product:after{
    top: 85px;
}
	.product_application_transition:before{
    clip-path: polygon(0 0, 100% 0, 100% 1%, 84% 25%, 0 0%);
}
	.product_application_transition span{
    top: 12px;
}
	.section_transition span {transform: rotate(-4deg) scaleX(1.08);display: none;}
  .application_about_transition {height: 50px;margin-top: -50px;display: none;}
  .application_about_transition:before { width: 62%; clip-path: polygon(75% 0,100% 0,100% 100%,0 100%); }
  .application_about_transition span { left: 38%; bottom: 0; width: 48%; transform: rotate(-5deg); }
}



/* header */
header {z-index: 999;backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px); /* 兼容 Safari 浏览器 */background: rgb(0 0 0 / 70%);}
header .item {padding: 0 2%;display: flex;align-items: center;gap: 2%;}
header .laug_box{display: flex;}
header .laug_box a{color:white;}
header .top_btn {width: 96%;top: 0;left: 0;display: none;}
header .top_btn svg { margin: 10px; width: 19px; height: 19px; }
header #cis { z-index: 5; }
header #cis img{width:min(250px , 100%)}
header #menubtn { height: 70px; top: 0; right: 0; z-index: 1000; }
header #menubtn a {margin: auto 0 auto auto;width: 25px;height: 18px;}
header #menubtn a span {position: absolute;width: 100%;height: 2px;background: var(--white);display: block;top: 0;right: 0;}
header #menubtn[data-type="1"] a span { transition: transform .4s cubic-bezier(.215,.61,.355,1),opacity .4s cubic-bezier(.215,.61,.355,1), -webkit-transform .4s cubic-bezier(.215,.61,.355,1); }
header #menubtn[data-type="1"] a span:nth-child(2) { top: calc(50% - .5px); }
header #menubtn[data-type="1"] a span:nth-child(3) { top: calc(100% - 1px); }
header #menubtn[data-type="2"] a span { transition: .4s cubic-bezier(.645,.045,.355,1); }
header #menubtn[data-type="2"] a span:nth-child(1) , header #menubtn[data-type="2"] a span:nth-child(3) { top: 50%; }
header #menubtn[data-type="2"] a span:nth-child(2) { opacity: 0; }
header #webmenu nav >ul >li >p a {padding: 14px 10px;font-size: 18px;color: var(--white);}
header #webmenu nav ul li b {position: absolute;padding: 0 5px 0 15px;width: 50px;height: 41px;display: inline-block;text-align: center;line-height: 41px;top: calc((100% - 41px) / 2);right: 18px;}
header #webmenu nav >ul >li .subOption li >div a { padding: 7px 10px; display: block; }
header #webmenu nav >ul >li >p a:hover{color: #c59c5d;}
header.scroll {background: var(--white);box-shadow: 0 0 20px rgba(var(--black-rgb), .3);background: var(--secondary-deep);}
header.scroll .item.menu { padding-top: 0; border-bottom: 0; }

/* search_box */
#openform { background: var(--secondary); line-height: 45px; }
#search_box svg { width: 18px; height: 18px; }
#search_box form { width: 240px; box-shadow: 0 0 10px rgba(var(--black-rgb), .3); right: 0; bottom: -55px; opacity: 0; }
#search_box[data-type="2"] form { opacity: 1; }
#search_box form input { width: calc(100% - 65px); border: 0; }

/* menubg */
#menubg { width: 100vw; height: 100vh; top: 0; left: 0; }
#menubg[data-type="1"] { background: rgba(var(--black-rgb), 0); z-index: -998; }
#menubg[data-type="2"] { background: rgba(var(--black-rgb), .5); z-index: 998; }

/* footer */

/* ==================== Footer ==================== */
footer{position:relative;overflow:hidden;background:#11171c;color:#9da4a8;background: url(/images/40/footer_bg.jpg);}
footer *{
    color: #dedede;
}
footer .row{margin-right: 0;margin-left: 0;}
footer:before{content:"";position:absolute;top:0;right:0;width:46%;height:100%;background:linear-gradient(135deg,rgba(195,154,92,0) 20%,rgba(195,154,92,.04) 100%);pointer-events:none;}
footer:after{content:"SU PRO";position:absolute;left: 4%;top: 20px;color:rgba(255,255,255,.018);font-size:clamp(110px,12vw,220px);font-weight:700;line-height:1;letter-spacing:-.055em;white-space:nowrap;pointer-events:none;}
footer a{color:inherit;text-decoration:none;}
#flogo{position:relative;padding:56px 0 36px;border-bottom:1px solid rgba(255,255,255,.08);}
#flogo:before{content:"";position:absolute;bottom:-1px;left:0;width:32%;height:1px;background:linear-gradient(90deg,#c39a5c 0%,rgba(195,154,92,0) 100%);}
#flogo .footer_brand{position:relative;display:flex;align-items:center;}
#flogo .footer_brand>a{position:relative;}
#flogo .footer_brand>a:after{content:"";position:absolute;right:-18px;top:50%;width:4px;height:4px;border-radius:50%;background:#c39a5c;box-shadow:0 0 10px rgba(195,154,92,.4);transform:translateY(-50%);}
#flogo img{display:block;width:auto;max-width:290px;max-height:78px;object-fit:contain;}
#flogo .footer_brand_deco{display:flex;margin-left:38px;align-items:center;}
#flogo .footer_brand_line{display:block;width:52px;height:1px;background:#c39a5c;}
#flogo .footer_brand_text{margin-left:15px;color:rgba(195,154,92,.6);font-size:10px;font-weight:500;line-height:1;letter-spacing:.25em;white-space:nowrap;}
#f_info{position:relative;padding-top:56px;padding-bottom:36px;}
#f_info>.workframe{position:relative;align-items:flex-start;margin: 0 auto;}
#f_contact{position:relative;padding-right:70px;}
#f_contact .tit{position:relative;margin:0 0 35px;padding-bottom:17px;color:#fff;}
#f_contact .tit>span{display:block;margin-bottom:8px;color:#c39a5c;font-size:10px;font-weight:500;line-height:1.2;letter-spacing:.24em;}
#f_contact .tit>div{color:#fff;font-size:clamp(25px,2vw,34px);font-weight:500;line-height:1.2;letter-spacing:.025em;}
#f_contact .tit:after{content:"";position:absolute;bottom:0;left:0;width:48px;height:1px;background:#c39a5c;}
#f_contact p{position:relative;margin:0 0 28px;padding-right:30px;vertical-align:top;}
#f_contact p:before{content:"";position:absolute;top:2px;left:-14px;width:1px;height:calc(100% - 4px);background:linear-gradient(180deg,#c39a5c,rgba(195,154,92,0));opacity:0;transition:opacity .3s;}
#f_contact p:hover:before{opacity:1;}
#f_contact p font:first-child{margin-bottom:8px;color:#c39a5c;font-size: 13px;font-weight:500;line-height:1.3;letter-spacing:.16em;text-transform:uppercase;}
#f_contact p font:last-child{color:#b8bec2;font-size: 15px;font-weight:400;line-height:1.75;}
#f_contact p a{color:#b8bec2;transition:color .3s;font-size: 16px;}
#f_contact p a:hover{color:#fff;}
#f_nav{position:relative;padding-left:62px;border-left:1px solid rgba(255,255,255,.09);}
#f_nav .footer_nav_title{width:100%;margin-bottom:25px;}
#f_nav .footer_nav_title>span{display:block;margin-bottom:7px;color:#c39a5c;font-size:9px;font-weight:500;line-height:1.2;letter-spacing:.22em;}
#f_nav .footer_nav_title>div{color:#fff;font-size:18px;font-weight:500;line-height:1.5;letter-spacing:.06em;}
#f_nav>a{position:relative;display:flex;width:100%;min-height:40px;padding:9px 28px 9px 18px;align-items:center;color:#adb3b7;font-size:14px;line-height:1.4;transition:color .3s,padding-left .3s;}
#f_nav>a:before{content:"";position:absolute;top:50%;left:0;width:6px;height:1px;background: var(--primary);transform:translateY(-50%);transition:width .3s;}
#f_nav>a i{position:absolute;top:50%;right:4px;width:16px;height:1px;background:rgba(255,255,255,.14);transform:translateY(-50%);transition:width .3s,background .3s;}
#f_nav>a i:after{content:"";position:absolute;top:-3px;right:0;width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg);}
#f_nav>a:hover{padding-left:27px;color:#fff;}
#f_nav>a:hover span{color: var(--primary);}
#f_nav>a:hover:before{width:15px;}
#f_nav>a:hover i{width:22px;background: var(--primary);}
#f_nav>a:hover i:after{
    border-color: var(--primary);
}
#f_other{position:relative;margin-top:34px;padding-top:27px;border-top:1px solid rgba(255,255,255,.08);align-items:center;color:#71797e;font-size:12px;line-height:1.75;}
#copyright{padding-left:0;font-size: 14px;}
#copyright a{color:#858c91;transition:color .3s;}
#copyright a:hover{color:#c39a5c;}
#web_footer{text-align:center;}
#web_footer a{color:#858c91;transition:color .3s;font-size: 14px;}
#web_footer a:hover{color:#c39a5c;}
#extra{overflow:visible;text-align:right;}
#more_extra{position:relative;display:inline-flex;min-width:132px;height:42px;padding:0 16px 0 18px;border:1px solid rgba(255,255,255,.13);align-items:center;justify-content:space-between;gap:22px;color:#9ba2a6;background:transparent;font-size:12px;line-height:1;letter-spacing:.08em;transition:border-color .3s,color .3s,background .3s;}
#more_extra>span{position:relative;z-index:2;}
#more_extra>i{position:relative;display:block;width:12px;height:12px;}
#more_extra>i:before,#more_extra>i:after{content:"";position:absolute;top:50%;left:50%;background:#c39a5c;transform:translate(-50%,-50%);transition:.3s;}
#more_extra>i:before{width:12px;height:1px;}
#more_extra>i:after{width:1px;height:12px;}
#more_extra:hover{border-color:#c39a5c;color:#fff;background:rgba(195,154,92,.05);}
#more_extra[data-type="1"]>i:after{height:0;}
#extra ul{z-index:20;right:0;bottom:50px;width:310px;margin:0;padding:16px 20px;background:#171e24;border:1px solid rgba(195,154,92,.18);box-shadow:0 20px 45px rgba(0,0,0,.3);}
#extra ul:after{content:"";position:absolute;right:18px;bottom:-6px;width:11px;height:11px;background:#171e24;border-right:1px solid rgba(195,154,92,.18);border-bottom:1px solid rgba(195,154,92,.18);transform:rotate(45deg);}
#extra ul li{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.06);color:#969da2;font-size:12px;line-height:1.65;}
#extra ul li:last-child{border-bottom:0;}
#extra ul li font:first-child{display:block;margin-bottom:3px;color:#c39a5c;font-size: 15px;letter-spacing:.08em;}
#extra ul li font:last-child{color:#969da2;}
#webSeo{position:relative;height:42px;padding:0 25px;border-top:1px solid rgba(255,255,255,.045);background:#090e12;}
#webSeo:before{content:"";position:absolute;top:0;left:0;width:125px;height:1px;background:linear-gradient(90deg,#c39a5c,rgba(195,154,92,0));}
#webSeo .seo{position:relative;white-space:nowrap;color:#555e64;font-size:11px;line-height:42px;letter-spacing:.03em;}
@media screen and (max-width:1400px){
#f_contact{padding-right:45px;}
#f_nav{padding-left:45px;}
}
@media screen and (max-width:1199px){
#flogo{padding:46px 0 30px;}
#f_info{padding-top:46px;}
#f_contact{padding-right:35px;}
#f_nav{padding-left:35px;}
#f_contact p{padding-right:18px;}
}
@media screen and (max-width:991px){
#f_contact,#f_nav{width:100%;}
#f_contact{padding-right:0;}
#f_nav{margin-top:28px;padding:30px 0 0;border-top:1px solid rgba(255,255,255,.08);border-left:0;}
#f_nav>a{width:33.333%;}
#f_other{margin-top:30px;}
#flogo .footer_brand_text{display:none;}
}
@media screen and (max-width:767px){
#flogo{padding:38px 0 26px;}
#flogo img{max-width:240px;max-height:65px;}
#flogo .footer_brand_deco{margin-left:26px;}
#flogo .footer_brand_line{width:38px;}
#f_info{padding:38px 0 28px;}
#f_contact .tit{margin-bottom:28px;}
#f_contact p{margin-bottom:22px;padding-right:15px;}
#f_nav>a{width:50%;padding-top:9px;padding-bottom:9px;}
#f_other{display:block;padding-top:22px;text-align:left;}
#copyright,#web_footer,#extra{width:100%;padding:0;text-align:left;}
#web_footer{margin-top:8px;}
#extra{margin-top:18px;}
#extra ul{right:auto;left:0;}
#webSeo{height:38px;}
#webSeo .seo{line-height:38px;}
}
@media screen and (max-width:480px){
	header #cis img{width: min(160px , 100%);}
#flogo .footer_brand{display:block;}
#flogo .footer_brand>a:after{display:none;}
#flogo .footer_brand_deco{margin:18px 0 0;}
#flogo .footer_brand_line{width:42px;}
#f_contact p{width:100%;padding-right:0;}
#f_nav>a{width:100%;}
#extra ul{width:280px;max-width:calc(100vw - 32px);}
}

/* footer_btn */
#footer_btn {right: 15px;bottom: 15px;z-index: 2000;display: flex;flex-direction: column;align-items: center;gap: 10px;}
#footer_btn a {position: relative;margin-top: 0;background: #12b508;line-height: 40px;}
#footer_btn a svg { width: 60%; height: 60%; }
#footer_btn a.phone {background: var(--primary);}
#footer_btn a.gotop {background: var(--primary-dark);border: 1px var(--primary) solid;}

@-webkit-keyframes marquee { 0% { -webkit-transform: translate(0, 0); } 100% { -webkit-transform: translate(-100%, 0); } }
@keyframes marquee { 0% { transform: translate(0, 0); } 100% { transform: translate(-100%, 0); } }

@media screen and (min-width: 1441px){
	.workframe {width: var(--width-xxl);}
	header .item { padding: 0 5%; }
	header .top_btn { width: 90%; }
    header #webmenu nav >ul >li { margin-left: 15px; }
}
@media screen and (min-width: 1281px){
	.more_btn:hover:before { -webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,180deg) translate3d(0,-100%,0); transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,180deg) translate3d(0,-100%,0); }
	header .menu {padding-top: 0;}
	header #webmenu nav ul li b { display: none; }
	header #webmenu nav ul{display:flex;justify-content: flex-end;}
	header #webmenu nav ul li { position: relative; }
	header #webmenu nav ul li .bo { position: relative; background: var(--white); z-index: 1; }
	header #webmenu nav >ul >li >p a { padding: 25px 10px; }
	header #webmenu li .menu_body , header #webmenu li .subOption ul { position: absolute; width: 170px; right: calc(50% - 85px); z-index: -1; opacity: 0; }
	header #webmenu li .menu_body ul {background: var(--white);box-shadow: 0 0 10px rgba(var(--black-rgb), .3);display: flex;flex-direction: column;}
	header #webmenu li .subOption li { overflow: hidden; }
	header #webmenu li .subOption li >div a { padding: 6px 15px; border-bottom: 1px rgba(var(--black-rgb), .1) solid; line-height: 150%; font-weight: 300; }
	header #webmenu li .subOption li:last-child >div a { border-color: none; }
	header #webmenu li .subOption li >div a:hover { color: var(--primary) }
	header #webmenu li .subOption .sub2Option , header #webmenu li .subOption .sub3Option { top: 0; right: -170px; }
	header #webmenu nav >ul >li:hover , header #webmenu li .subOption li:hover { overflow: visible; }
	header #webmenu nav >ul >li:hover .menu_body , header #webmenu li .subOption li:hover >ul { z-index: 2; opacity: 1; }
	header #webmenu li:last-child .subOption .sub2Option , header #webmenu li:last-child .subOption .sub3Option { right: auto; left: -170px; }
	header.scroll .top_btn { top: -55px; opacity: 0; }
	header.scroll #webmenu nav >ul >li >p a { padding: 15px 10px; }
}
@media screen and (max-width: 1280px){
	header #webmenu {padding: 15px 0;width: 350px;height: 100vh;background: var(--secondary-deep);box-shadow: 0 10px 10px rgba(var(--black-rgb), .5);right: calc(-1 * var(--width-xs));z-index: 999;top: 0;}
	header #webmenu .top_btn a { margin: 0 5px; }
	header #webmenu nav { overflow-y: scroll; margin-top: 15px; padding: 0 10px; height: calc(100% - 65px); }
	header #webmenu nav::-webkit-scrollbar { width: 0; }
	header #webmenu nav >ul {padding-bottom: 200px;display: flex;flex-direction: column;height: 100%;}
	header #webmenu nav >ul >li >p a { color: var(--white); }
	header #webmenu li .menu_body , header #webmenu li .menu_body .subOption li ul { position: relative; display: none; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }
	header #webmenu li .menu_body ul { margin-left: 20px; }
	header #webmenu li .menu_body .subOption .bo { position: relative; }
	header #webmenu li .menu_body .subOption a { padding: 7px 45px 7px 10px; color: var(--primary); }
	header #webmenu li .menu_body .sub2Option a { font-weight: 300; color: rgba(var(--white-rgb), .5); }
	header #webmenu li .menu_body .sub3Option a { color: rgba(var(--triadic1-rgb), .8); }
}
@media screen and (max-width: 760px){
	.webBox .wrapper_lines .center_box >div { border-width: 0 0 0 1px; }
}
@media screen and (max-width: 550px){
	header .item { padding: 0 5%; }
	header .top_btn { width: 90%; }
	header #webmenu {width: 320px;top: 0;padding-top: 60px;}
	#search_box form { right: 2%; bottom: -35px; }
	
	#footer_btn {right: 0;bottom: 30px;}
	#footer_btn a { margin: 0 10px; line-height: 35px; }
	#footer_btn a.gotop { right: 0; bottom: 0; }
}