/**************************************************** BB Style ****************************************************/ div#fl-builder-settings-section-shapes_container, .fl-compound-field-setting.fl-typography-field-variant{ display: none!important; pointer-events: none!important;} .fl-builder--template-collection-section-header, .fl-builder-blocks-section .fl-builder-blocks-section-header, .fl-builder-settings-section-header{ background-color: #dedede; border-top: 4px solid #dedede;} .fl-builder-settings-fields .fl-builder-settings-title{justify-content: flex-start; padding-left: 20px;} /*.fl-builder-settings-section:not(#fl-builder-settings-section-general) { margin-top: 16px; width: calc(100% - 25px); box-shadow: 3px 3px 5px rgb(0 0 0 / .2), -3px -1px 5px rgb(0 0 0 / 0.3); margin-left: 10px;} .fl-builder-settings-section.fl-builder-settings-section-collapsed:not(#fl-builder-settings-section-general) .fl-builder-settings-section-header *{ color:#fff; fill: #fff;}*/ #fl-field-animation .fl-unit-field-unit-select .fl-field-unit-select{font-size: 0;} #fl-field-animation .fl-unit-field-unit-select .fl-field-unit-select:after { content: '秒'; font-size: 12px;} /*.fl-builder-bar .fl-builder-bar-title button.fl-builder-button{background-color: #daf4eb!important; padding: 0 6px; max-width: 36px; box-shadow: -1px 0px 5px #BBB,1px 1px 8px #eee!important; transition: .3s;} .fl-builder-bar .fl-builder-bar-title button.fl-builder-button:hover{background-color: #d2ffef!important;} */ .fl-builder #titleBarBtn{flex: unset; padding: 0 16px; background-color: #0197C6!important; color: #fff!important;} .fl-contact-form,.fl-builder-content,.fl-slide .fl-slide-title{font-family: Microsoft JhengHei !important;} .fl-module-icon .fl-icon-wrap .fl-icon-text *{font-size:100%;} /**fl-builder begin tour**/ #pageBgTour{pointer-events: none; opacity: 0; position: fixed; width: 100vw; height: 100vh; background-color: rgba(0 , 0 , 0 , 0.4); z-index: 999; transition: .3s; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;} #pageBgTour .box-content{ max-width: 60vw; padding: 22px 24px; height: auto; max-height:90vh; overflow: hidden; background-color: #fff; border-radius: 10px; width: 100%; display: flex; flex-direction: column; transform: translateY(-100vh); transition: .5s;} #pageBgTour.show{ pointer-events: unset; opacity: 1; } #pageBgTour.show .box-content{ transform: translateY(0); } #pageBgTour .box-wrapper{ position: relative; width: 100%; flex: 0 1 100%;} #pageBgTour .slider-wrapper{ display: flex; flex-wrap: wrap; flex-direction: row; max-height: 100%; height: 100%;} #pageBgTour .slider-wrapper .box{ transition: .5s; position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; opacity: 0; transform: scale(.6); cursor: pointer;} #pageBgTour .slider-wrapper .box.active{ opacity: 1; transform: scale(1); } #pageBgTour .slider-wrapper p{margin:0; text-align: center; padding: 0 10%; letter-spacing: 1px; line-height: 2; color: #333; font-weight: 600;} #pageBgTour .slider-wrapper .imp{ color: #0097a7; margin: 0 5px; } #pageBgTour .actions{ flex: 0 1 40px; height: 40px; width: 100%; text-align: center; position: relative; padding-top: 5px;} #pageBgTour .nav-dot{ width: 30px; height: 5px; background-color: #a5a5a5; display: inline-block; margin: 0 5px; transition: .3s; cursor: pointer; } #pageBgTour .nav-dot.active,#pageBgTour .nav-dot:hover{ background-color: #2196f3; } #pageBgTour .actions .close{ display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: space-between; transition: .5s; transform: rotate3d(1, 0, 0, 90deg); opacity: 0; } #pageBgTour .actions .close.pop{ transform:translateY(-16px) rotate3d(1, 0, 0, 0deg); opacity: 1;} #pageBgTour .actions .check-wrapper{ display: inline-flex; flex-wrap: wrap; align-items: center; } #pageBgTour .actions label{ margin: 0; line-height: 1; } #pageBgTour .actions .close-btn{ transition: .3s; cursor: pointer; color: #666; font-weight: 600; } #pageBgTour .actions .close-btn i{margin-left:5px;} #pageBgTour .actions .close-btn:hover { text-decoration: underline; } #pageBgTour .overlay{ position: absolute; width: 100%; height: 100%; left: 0; top: 0; } @media(max-width:1300px){ #pageBgTour .box-content{ max-width: 70vw; } } @media(max-width:1200px){ #pageBgTour .slider-wrapper p{padding: 0 5%;} } /**fix products cloumns**/ @media( min-width:979px ){ .fl-module-content > .fl-woocommerce-products > .woocommerce.columns-6 .product-grid-item{ -ms-flex: 0 0 16.6667%; flex: 0 0 16.6667%; max-width: 16.6667%; } .fl-module-content > .fl-woocommerce-products > .woocommerce.columns-5 .product-grid-item{ -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .fl-module-content > .fl-woocommerce-products > .woocommerce.columns-4 .product-grid-item{ -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .fl-module-content > .fl-woocommerce-products > .woocommerce.columns-3 .product-grid-item{ -ms-flex: 0 0 33.3333%; flex: 0 0 33.3333%; max-width: 33.3333%; } .fl-module-content > .fl-woocommerce-products > .woocommerce.columns-2 .product-grid-item{ -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .fl-module-content > .fl-woocommerce-products > .woocommerce.columns-1 .product-grid-item{ -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } @media(max-width:767px){ .fl-countdown .fl-countdown-unit-label{ min-width: unset; } .fl-col-small:not(.fl-col-small-full-width){max-width:100%;} .fl-builder-content .fl-module-content-slider .fl-slide .fl-slide-content {padding: 0;} .fl-builder-content .fl-module-content-slider .fl-slide .fl-slide-content > *{padding:0 30px; text-align:center;} .fl-builder-content .fl-module-content-slider .fl-slide .fl-slide-content .fl-button-left{ text-align:center; } .fl-builder-content .fl-module-content-slider .fl-slide .fl-slide-content > *:first-child{ padding-top:30px!important; } .fl-builder-content .fl-module-content-slider .fl-slide .fl-slide-content > *:last-child{ padding-bottom:30px; } } /**************************************************** Global ****************************************************/ body,html{font-size:16px;} h1{font-size:2.25rem} /*36px */ h2, /*31px page-title*/ .woocommerce-Tabs-panel .wc-tab-inner>div>h2:first-child{font-size:1.9375rem} h3{font-size:1.625rem} /*26px section-title*/ h4{font-size:1.375rem} /*22px row-title */ h5{font-size:1.125rem} /*18px sub-title */ h6{font-size:1rem} /*16px post-blod*/ p,li:not(.modified-date),td,th{font-size:1rem} /*16px content*/ a{font-size:100%;} @media(min-width:1023px){ .show-tablets,.show-TnM{ display:none!important; } } @media(min-width:767px){ .show-mobile{ display:none!important; } } @media(max-width:1023px){ body,html{font-size:15px;} .show-desk{display:none!important;} } @media(max-width:1023px) and (min-width:767px){ .show-DnM{ display:none!important; } } @media(max-width:767px){ body,html{font-size:14px;} .show-DnT,.show-tablets{ display:none!important; } } body.fl-builder .main-page-wrapper{padding-top:0;} /*.fl-builder-content{margin-top:-40px;}*/ .site-content{margin-bottom:0!important;} .fl-contact-form,.fl-builder-content, .woodmart-blog-holder *{font-family: Microsoft JhengHei !important;} body.blog .main-page-wrapper .container, body.archive.category .main-page-wrapper .container, body.archive.tag .main-page-wrapper .container, body.search .main-page-wrapper .container, body.single-post .main-page-wrapper .container, body.woocommerce-page .main-page-wrapper .container{max-width: 1400px;} /*.fl-module .fl-module-content ul li:before{ content:'•'; margin-right: 10px; }*/ /*.fl-module .fl-module-content ol{ counter-reset:num; }*/ /*.fl-module .fl-module-content ol li:before{ counter-increment:num; content:counter(num) '. '; margin-right: 10px; font-size: 16px; line-height: 22px; }*/ /*.fl-module .fl-module-content ol li,*/ /*.fl-module .fl-module-content ul li{ display: flex; align-items: flex-start; margin-bottom: 1rem; }*/ .fl-module .fl-module-content ol{ list-style: decimal; } .fl-module .fl-module-content ul{ list-style: disc; } .fl-module .fl-module-content ol li,.fl-builder-content ul li{ margin-left:1.2em; margin-bottom: 1rem; } .fl-module .fl-module-content ol li > *, .fl-module .fl-module-content ul li > *{ margin: 0; } .fl-builder-pagination ul.page-numbers{ display: flex; flex-wrap: wrap; align-items: center; justify-content: center; } .fl-builder-pagination ul.page-numbers li:before { display: none; } @media(max-width:1400px) and (min-width:979px){ body.single-post .main-page-wrapper .container{padding: 0 20px;} } @media(max-width:979px){ body.logged-in.admin-bar #wp-admin-bar-top-secondary > li{margin: 0 5px;} .mobile-menu-tab .site-mobile-menu li a{font-size:14px;} } @media(max-width:767px){ body.logged-in.admin-bar #wp-admin-bar-top-secondary #wp-admin-bar-edit-profile, body.logged-in.admin-bar #wp-admin-bar-top-secondary #wp-admin-bar-logout{display:none!important;} } /*************search*************/ body.search.search-no-results .content-layout-wrapper > .site-content{flex: 0 0 100%; max-width: 100%;} body.search.search-no-results .content-layout-wrapper > .sidebar-container, body.search.search-no-results .content-layout-wrapper .woodmart-shop-tools{display:none;} body.search.search-no-results .no-results{display:block;} div.woodmart-search-full-screen .searchform input[type="text"]{ height: 100px; font-size: 34px; } .woodmart-search-full-screen span.woodmart-close-search{top: 0;} @media(max-width:979px){ body.search.search-no-results.woodmart-archive-blog .woodmart-sticky-sidebar-opener{display:none!important;} } @media(max-width:767px){ body.search.search-no-results.woodmart-archive-blog .no-results.not-found .entry-title{font-size: 24px;} } /*********blog*********/ .woodmart-archive-blog .row.content-layout-wrapper{margin: 3vw 0;} .woodmart-archive-blog .woodmart-blog-holder article .woodmart-entry-content >p:first-child{overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;} .woodmart-archive-blog .woodmart-blog-holder article .post-img-wrapp img{height: 24rem; object-fit: cover;} .woodmart-archive-blog .woodmart-blog-holder article .meta-post-categories{width: 15rem;} .woodmart-archive-blog .woodmart-blog-holder article .entry-title.title a{ font-size: 1.42857142857rem!important; margin-top: .8rem; } .woodmart-archive-blog .woodmart-blog-holder article .entry-meta-list > li{margin: 0 .3rem;} .woodmart-archive-blog .woodmart-blog-holder article .woodmart-post-date,.single-post .post-date.woodmart-post-date {width: 3rem; height: 3.5rem; display: flex; flex-wrap: wrap; flex-direction: column-reverse; justify-content: center;} .woodmart-archive-blog .woodmart-blog-holder article .woodmart-post-date *,.single-post .post-date.woodmart-post-date * {font-size:1.14285714286rem; color: #333; font-weight: 500; text-align: left; padding: 0 0 0 13%; line-height: 1.2; display: flex; flex-wrap: wrap; align-items: center;} .single-post .single-post-navigation{margin-bottom: 6rem; border-color: #adadad; border-width: 1px; border-top-style: solid;} .single-post .single-post-navigation .btn-label{display: none;} .single-post .single-post-navigation .post-title{font-size:1.14285714286rem; color: #323232; font-weight: 600; letter-spacing: 0.1em;} .single-post .single-post-navigation .posts-nav-inner a:after{color:#dedede} .single-post .single-post-navigation .blog-posts-nav-btn:hover .post-title, .single-post .single-post-navigation .blog-posts-nav-btn:hover .posts-nav-inner a:after{color:var(--primary-color)} .single-post .single-post-navigation .woodmart-tooltip{position: relative;} .single-post .single-post-navigation .woodmart-tooltip:after{position: absolute; top: 0; left: 0; display: inline-flex; width: 100%; height: 100%; align-items: center; justify-content: center;} .single-post .single-post-navigation .back-to-archive{display: none;} .single-post .comments-area .logged-in-as{font-size:14px;} .single-post .comments-area .logged-in-as>a:not(:last-child){margin-right: 0; padding-right: 0; border-right: 0;} @media(max-width:979px){ .woodmart-archive-blog .woodmart-blog-holder,.single-post .site-content{padding: 0 5%!important;} .woodmart-archive-blog .woodmart-sticky-sidebar-opener,.single-post .woodmart-sticky-sidebar-opener {border-radius: unset; height: auto; width: auto; display: flex!important; flex-wrap: wrap; flex-direction: column; justify-content: center; align-items: center; padding: .8rem .6rem;} .woodmart-archive-blog .woodmart-sticky-sidebar-opener span,.single-post .woodmart-sticky-sidebar-opener span {writing-mode: tb; line-height: 1; padding-right: 6px; margin-bottom: 3px; font-size: 0; font-weight: 600;} .woodmart-archive-blog .woodmart-sticky-sidebar-opener:after,.single-post .woodmart-sticky-sidebar-opener:after {line-height: 1;} .single-post .single-post-navigation .btn-label { display: block; } } @media(max-width:767px){ .woodmart-archive-blog .woodmart-blog-holder{ padding: 0!important; } .woodmart-archive-blog .woodmart-blog-holder article .post-img-wrapp img{ height: 15rem;} .woodmart-archive-blog .woodmart-blog-holder article .entry-title.title a{ font-size: 16px!important;} .woodmart-archive-blog .woodmart-blog-holder article .woodmart-post-date *{ font-size: 14px;} .single-post .site-content{ padding: 0 25px!important; } .single-post .article-inner .entry-title{font-size: 18px!important;} .single-post .single-post-navigation{border: unset;} } /*********header***********/ header .site-logo{ display:var(--logo-show); } header .whb-general-header{background:var(--menu-bgc);} header .whb-primary-menu ul.menu > li > a, header .whb-general-header-inner .wd-tools-element > a, header .whb-primary-menu ul.menu > li.menu-item-has-children > a:after{ color:var(--menu-ftc)!important; letter-spacing: 1.5px; } header .whb-primary-menu ul.menu li.menu-item-has-children div.sub-menu-dropdown, header .whb-primary-menu ul.menu li.menu-item-has-children ul{ background:var(--menu-bg2c); } header .whb-primary-menu ul.menu li.menu-item-has-children .sub-menu a, header .whb-primary-menu ul.menu li.menu-item-has-children .sub-menu a:after{ color:var(--menu-ft2c); } header .whb-primary-menu ul.menu li.menu-item-has-children li:hover > a{ background-color: var(--menu-ft2c); color: var(--menu-bg2c); } header .whb-primary-menu ul.menu li.menu-item-has-children li:hover > a:after{ color: var(--menu-bg2c); } header .woodmart-navigation .item-level-0>a>*{ text-align: center; line-height: 1.2; } header .hasSubTitle >a>.nav-link-text, .site-mobile-menu .hasSubTitle > a > .nav-link-text{ display: flex; flex-wrap: wrap; flex-direction: column; position: relative; } .site-mobile-menu .hasSubTitle > a .menu-item-subTitle{ font-size: 12px; line-height: 1.2; letter-spacing: 1.5px; color: #777; margin-top: 2px; } .hasSubTitle > a .menu-item-subTitle{ text-transform: none; } header .menu-item-subTitle, header .menu-item-title{ transition: .3s; position: relative; } header .menu-item-subTitle{ margin-top: 2px; } header .hasSubTitle.subTitleHover > a .menu-item-subTitle { bottom: -10px; opacity: 0; } header .hasSubTitle.subTitleHover:hover > a .menu-item-subTitle{ bottom: 0.67em; opacity: 1; } header .hasSubTitle.subTitleHover > a .menu-item-title{ bottom: -0.67em; opacity: 1; } header .hasSubTitle.subTitleHover:hover > a .menu-item-title{ bottom: 9px; opacity: 0; } header *,.sgi-topbar .tb-text *{font-family: Microsoft JhengHei ,Lato, Arial, Helvetica, sans-serif,woodmart-font,"Font Awesome 5 Brands","Font Awesome 5 Free"!important;} body.sgi-bgNone:not(.post-type-archive-product):not(.woocommerce-cart):not(.woocommerce-checkout):not(.woodmart-archive-blog):not(.single-post):not(.single-product):not(.woocommerce-account):not(.tax-product_cat):not(.tax-product_tag) header{padding-top:0!important;} body.sgi-bgNone header .whb-general-header, body.sgi-bgNone .whb-sticky-shadow.whb-sticked .whb-main-header{ box-shadow: unset; } body.sgi-header-none header.whb-header{ display:none; } body.sgi-header-none .main-page-wrapper{ margin-top: 0; } body.sgi-header-3 .whb-general-header-inner > .whb-hidden-lg{ display:flex; } body.sgi-header-3 .whb-general-header-inner > .whb-visible-lg{ display:none; } body.sgi-header-3 .whb-mobile-right.whb-hidden-lg .sub-menu-dropdown.menu-item-register{ left: unset; right: 0; } @media(min-width:1025px){ body.sgi-header-3 .wd-tools-icon:before{ font-size:24px; } body.sgi-header-3 .wd-tools-icon.woodmart-cart-icon:before{ font-size:25px; } body.sgi-header-3 .woodmart-burger-icon .woodmart-burger::after{ top: 8px; width: 28px; height: 3px; } body.sgi-header-3 .woodmart-burger-icon .woodmart-burger::before{ top: -8px; width: 28px; height: 3px; } body.sgi-header-3 .woodmart-burger-icon .woodmart-burger{ width: 28px; height: 3px; } body.sgi-header-2 .whb-general-header-inner { height: 160px; flex-wrap: wrap; justify-content: center; } body.sgi-header-2 .whb-column.whb-col-left.whb-visible-lg { width: 100%; justify-content: center; margin: 0; } body.sgi-header-2 .whb-column.whb-col-center.whb-visible-lg { justify-content: center; flex: unset; } body.sgi-header-2 .whb-sticked .whb-general-header-inner { height: 110px; } .whb-header .menu .woodmart-nav-link{ font-size:var(--menu-ftSz); line-height: 1.5; } .whb-header .wd-tools-icon:before{ font-size:calc( var(--menu-ftSz) + 6px ); } .whb-header .wd-tools-icon.woodmart-cart-icon:before{ font-size:calc( var(--menu-ftSz) + 7px ); } } @media(min-width:767px){ .site-logo.logo-control img{ max-width:var(--logo-l); } } @media(max-width:767px){ .site-logo.logo-control img{ width: var(--logo-s); max-width: 50vw; object-fit: contain; object-position: left; } } /*********pgae banner************/ #sgi-page-banner{ position: relative; display: flex; flex-wrap: wrap; align-items: center; min-height: 200px; max-height:31.25vw; overflow: hidden;} #sgi-page-banner .text-wrap{ padding: 15px 2.5%; position: absolute; box-sizing: border-box;width: 100%; height: 100%; left: 0; top: 0; display: flex; flex-wrap: wrap; align-items: center;} #sgi-page-banner .text-wrap .pgae-title-info{ display: flex; flex-wrap: wrap; justify-content: center; width: 100%; padding:0 15px;} #sgi-page-banner .banner-text { width:100%; letter-spacing: 2px; color: #ffffff; margin: 5px 0; padding:0;} #sgi-page-banner .img-wrap img:not([src*='http']) {opacity: 0;} #sgi-page-banner .img-wrap{ width:100%; } .sgi_page_banner_on .main-page-wrapper{padding-top:0;} body.sgi_page_banner_on:not(.page) .main-page-wrapper > .container, body.sgi_page_banner_on.woocommerce-cart .main-page-wrapper > .container, body.sgi_page_banner_on.woocommerce-account .main-page-wrapper > .container, body.sgi_page_banner_on.woocommerce-checkout .main-page-wrapper > .container, body.sgi_page_banner_on.single-product .main-page-wrapper > .container-fluid, body.fl-builder.single-product .main-page-wrapper > .container-fluid{padding-top:40px;} body.error404 .main-page-wrapper > .container{ padding:60px 0!important; } body.sgi_page_banner_on:not(.page):not(.single-product) #sgi-page-banner{margin-bottom:40px;} #sgi-page-banner .img-wrap img{ position: relative; } #sgi-page-banner.type-imgBg.banner-height-auto { max-height: unset; } @media(min-width:767px){ #sgi-page-banner img.pgbBG-mob{display:none;} } @media(max-width:767px){ #sgi-page-banner img.pgbBG-desk{display:none;} #sgi-page-banner img.showInMobile { display: block; height: auto!important; } #sgi-page-banner{ min-height:var(--pgb-mobH)!important; } #sgi-page-banner.type-imgBg.banner-height-auto{ min-height:1px!important; } } /*********top bar***********/ .sgi-topbar {height:40px; display: flex; flex-wrap: wrap; padding: 5px 0; box-sizing: border-box; align-items: center; flex-direction: row; justify-content: flex-end; transition: .3s;} .sgi-topbar .container{ position: relative; } .sgi-topbar .social-icon{display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: flex-end;} .sgi-topbar .social-icon a{max-height: 30px; margin-left: 10px; font-size: 22px; line-height: 1; color: #fff; z-index:9;} .sgi-topbar{background:var(--tbar-bgc);} .sgi-topbar .social-icon a{color:var(--tbar-icnc);} .sgi-topbar .tb-text{ position: absolute; width: 100%; left: 0; bottom: 0; top: 0; text-align: center; display: flex; justify-content: center; align-items: center; margin-left: 0!important; } .sgi-topbar .tb-text *{color:var(--tbar-tclr); font-size: 12px; letter-spacing: 0.2em; line-height: 1; font-family: "acumin-pro", sans-serif , Microsoft JhengHei !important; } @media(max-width:767px){ .sgi-topbar .social-icon a:not(.tb-text){ display: var( --tbar-ifmb ) } } /*********footer*********/ #copyright { text-align: center; padding: 10px 0; border-top: 1px solid #eaeaea; font-family: Microsoft Jhenghei; background-color: #fafafa; } #copyright p{ margin: 0; font-size: 14px; } #copyright a{ text-decoration:none; } #footer{ padding: 50px 0 40px;} #footer *{color:#5a5a5a;} #footer hr{border-top-color:#fff!important;} #footer.light{ background: #fafafa; } #footer.dark{ background: #5a5a5a; } #footer.dark * { color: #fff!important; } #footer.color1 *,#footer.color2 *,#footer.color3 *,#footer.color4 *{color:#fff;} #footer.color5 hr,#footer.color6 hr{border-top-color:#5a5a5a!important;} #footer.color6 i.fab.fa-facebook-square{color: #3a559f;} #footer.color6 i.fab.fa-line {color: #00b900;} #footer.color6 i.fab.fa-twitter{color: #79d4ff;} #footer.color6 i.fab.fa-youtube {color: #ff5252;} #footer.color6 i.fab.fa-twitter-square{color: #50abf1;} #footer.color6 i.fab.fa-weixin{color:#01de6c;} #footer.color6 i.fab.fa-instagram-square{color:#ffac65;} #footer.color1{background:#fcaeae;} #footer.color2{background:#ffcbba;} #footer.color3{background:#aed8fc;} #footer.color4{background:#77dfdb;} #footer.color5{background:#fffdd2;} #footer.color6{background:#fff;} #footer .info-bsnestime, #footer .info-address{ display: flex; flex-wrap: wrap; flex-direction: column; align-items: flex-start; } /*style1*/ #footer.one .social-icon h5 { font-size: 1.8em; font-weight: 200; text-align: center; font-family: Microsoft Jhenghei; letter-spacing: 2px;} #footer.one .sociallinks { text-align: center; } #footer.one .sociallinks a { margin: 0 10px; } #footer.one .sociallinks i { font-size: 32px; } #footer.one hr { margin: 2em auto; } #footer.one .contact-info { text-align: center; } #footer.one .infolist { display: flex; flex-flow: column wrap; justify-content: center; align-items: center; } #footer.one .infoitem { display: flex; margin: 5px 0; } #footer.one .infoitem * { font-size: 16px!important; font-family: Microsoft Jhenghei; } #footer.one .infotitle { margin-right: 5px; word-break: keep-all; } /*style2*/ #footer.two .logo-row img.footerLogo{ max-width: var(--ft-logoD); } #footer.two{ padding: 50px 5% 40px; } #footer.two { display: flex; justify-content: center; flex-wrap: wrap; } #footer.two .footer-row { padding: 0 3%; box-sizing: border-box; } #footer.two .footer-row.menu-row{ padding: 0 0 0 20%; } #footer .footer-heading{font-size: 20px; font-weight: bold; font-family: Microsoft Jhenghei; letter-spacing: 2px; margin-bottom: 14px; line-height: 1;} #footer.two .menu li, #footer.two .infolist .infoitem { margin: 0; line-height: 1.5; margin-bottom: .6em;} #footer.two .footer-logo-text *,#footer.two .custom-menu-class *{font-size: 16px!important; font-family: Microsoft Jhenghei;} #footer.two .footerlogo{ margin-bottom:1rem; } #footer.two .infolist { display: flex; flex-flow: column wrap; justify-content: center; } #footer.two .infoitem { display: flex; margin: 5px 0; } #footer.two .infoitem * { font-size: 16px!important; font-family: Microsoft Jhenghei; } #footer.two .infotitle { margin-right: 5px; word-break: keep-all; } #footer.two .sociallinks a { margin: 10px 15px 0 0; } #footer.two .sociallinks i { font-size: 26px; } #footer.two .social-icon{margin-top:10px;} @media(min-width:1023px){ #footer.two .infoitem { display: grid!important; grid-template-columns: 6rem auto; } } @media(max-width:1023px){ #footer.two{justify-content: flex-start;} #footer.two .footer-row.col-4{ -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; margin-bottom: 5%;} #footer.two .footer-row.menu-row{ padding: 0 3%; } } @media(max-width:767px){ #footer.one .social-icon h5{font-size: 1.5em;} #footer.one .sociallinks i { font-size: 28px;} #footer.one .infoitem * { font-size: 14px!important;} div#copyright * { font-size: 12px;} #copyright{padding: 10px 30px;} #footer { padding: 80px 5% 70px;} /****style-2*******/ #footer.two h5 {font-size:1.3em!important; margin-top: 20px;} #footer.two .footer-logo-text *,#footer.two .custom-menu-class *{ font-size: 14px!important; font-family: Microsoft Jhenghei; } #footer.two .footer-row.col-4{padding:0;margin-bottom: 14px;} #footer.two .infoitem * { font-size: 14px!important;} #footer.two .logo-row img.footerLogo{max-width: var(--ft-logoM) ;} } /********float social icon*************/ a.scrollToTop { bottom: 80px; right: 23px; } body > div[id*='gb-widget'] div[target="_blank"], body > div[id*='gb-widget'] a[type="link"]{display:none!important;} #sgi-float-social{ position: fixed; top: 50%; z-index: 99999; transition: -webkit-transform .3s ease 1s; transition: transform .3s ease 1s; transition: transform .3s ease 1s,-webkit-transform .3s ease 1s; -webkit-transform: translate3d(0,-50%,0); transform: translate3d(0,-50%,0); } #sgi-float-social .icons{ display: flex; flex-direction: column; transition: .15s; transform-origin: bottom; } #sgi-float-social a{ display: flex; align-items: center; flex-wrap: nowrap; overflow: hidden; margin: 0; min-width: var(--social-size); width: auto; height: var(--social-size); color:#fff!important; } #sgi-float-social i{ width: var(--social-size); height: var(--social-size); font-size: var(--social-Isize); line-height: var(--social-size); text-align: center; } #sgi-float-social i.line-box{ display: inline-flex; align-items: center; justify-content: center; } #sgi-float-social i.line-box svg{ width: 50%; } #sgi-float-social .social-title{ overflow: hidden; padding: 0; max-width: 0; white-space: nowrap; font-weight: 600; font-size: var(--social-Fsize); transition: .5s; } #sgi-float-social.style-1{ left:0; } #sgi-float-social.style-1 .icons{ align-items: flex-start; } #sgi-float-social.style-2{ right:0; } #sgi-float-social.style-2 .icons{ align-items: flex-end; } #sgi-float-social.style-2 a{ flex-direction: row-reverse; } #sgi-float-social.style-3 .icons{ align-items: flex-start; } #sgi-float-social.style-3{ top: unset; left: 23px; transform: unset; -webkit-transform: unset; bottom: 21px; } #sgi-float-social.style-3 a{ border-radius: 300px; margin-bottom:8px; transition: .5s; } #sgi-float-social.style-3.collapse a{ position: absolute; margin-bottom:0; left:0; bottom:0; opacity: 0; } #sgi-float-social.style-3.collapse .icons{ margin-bottom: 8px; pointer-events: none; } #sgi-float-social.style-3 .icons{ min-height: var(--social-size); min-width: var(--social-size); position: relative; bottom:0; } #sgi-float-social .collapse-btn { color: #fff; background: radial-gradient(#ff9800, #e28700); border-radius: 200px; cursor: pointer; height: var(--social-size); width: var(--social-size); position: relative; box-shadow: rgb(0 0 0 / 40%) -1px -1px 6px; z-index: 9; } #sgi-float-social .collapse-btn i{ transition: .5s; transform: rotate(0); } #sgi-float-social.collapse .collapse-btn i{ transform: rotate(405deg); } #sgi-float-social.collapse .icons{ bottom: -48px; } #sgi-float-social.style-3:not(.collapse-icons) a:last-child { margin-bottom: 0; } #sgi-float-social .social-address{ background-color: #37aee2; } #sgi-float-social .social-ctmail{ background-color: #1f6ffc; } #sgi-float-social .social-ctphone i:before{ content:'\f095'; } #sgi-float-social .social-ctphone{ background-color: #f9490d; } #sgi-float-social .social-fb i:before{ content:'\f39e'; } #sgi-float-social .social-fb{ background-color: #365493; } #sgi-float-social .social-fbMsg{ background-color: #0080f7; } #sgi-float-social .social-line{ background-color: #2ebd59; } #sgi-float-social .social-twitter i:before{ content:'\f099'; } #sgi-float-social .social-twitter{ background-color: #33ccff; } #sgi-float-social .social-ig i:before{ content:'\f16d'; } #sgi-float-social .social-ig{ background: #f09433; background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); } #sgi-float-social .social-yt{ background-color: #cb2027; } #sgi-float-social .social-wechat{ background-color: #1ebea5; } @media(min-width:767px){ #sgi-float-social.style-1 a:hover span{ max-width:220px; margin-right:10px; } #sgi-float-social.style-2 a:hover span{ max-width:220px; margin-left:10px; } #sgi-float-social.style-3 a:hover span{ max-width: 220px; margin-right: 15px;} } @media(max-width:1024px){ body > div[id*='gb-widget'] a[target="_blank"]{ width: 40px; height: 40px; } a.scrollToTop{ bottom:70px; } } @media(max-width:480px){ #sgi-float-social.style-1, #sgi-float-social.style-2{ top:58%; } #sgi-float-social.style-1 a, #sgi-float-social.style-2 a{ min-width: var(--social-size); height: var(--social-size); } #sgi-float-social.style-1 i, #sgi-float-social.style-2 i{ width: var(--social-size); font-size: var(--social-Isize); line-height: var(--social-size); } } /********date picker********/ .ui-widget *{ font-family: Microsoft JhengHei!important; } .ui-datepicker {background-color: #fff; border-radius: 1rem; padding: 1rem; border: unset; box-shadow: 0 0 5px 3px #e1e1e1;} .ui-datepicker-title{ color: white; font-size: 1.0625rem; } .ui-datepicker table * {font-size: 0.875rem;} .ui-widget-content .ui-state-default { border: 0px; text-align: center; background: #fff; font-weight: normal; color: #000; } .ui-widget-content .ui-state-active { border: 0px; background: #bfbfbf; color: #fff; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next{ top:3px; } .ui-datepicker .ui-datepicker-prev.ui-state-hover, .ui-datepicker .ui-datepicker-next.ui-state-hover{ border: unset; background: #fff; } .ui-datepicker-header {background: #fff; border: unset;} .ui-datepicker-header a.ui-corner-all{display:none;} .ui-datepicker-header .ui-datepicker-title{ margin:0 0 1rem 0; } .ui-datepicker .ui-datepicker-title select { background: #f3f4f6; color: #3c3c3c; width: 47%; box-sizing: border-box; border-radius: 1rem; margin-right: 6%; border: unset; background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right 1rem center; background-size: 1em;} .ui-datepicker .ui-datepicker-title select:last-child { margin-right: 0; } .ui-datepicker .ui-datepicker-buttonpane button { background: #f3f4f6; width: 30%; font-size: 1rem; font-weight: 900; line-height: 1; padding: 0.5rem 0.5rem; border-radius: 0.8rem; letter-spacing: 1px; margin-top: 1rem; } .ui-datepicker .ui-datepicker-buttonpane button:hover{ color:#fff; } .ui-widget-content button.ui-state-default:hover{ background:#03a9f4; } td.ui-datepicker-days-cell-over.ui-datepicker-today a,.ui-widget-content .ui-state-active{ background: #fe374b!important; color: #fff!important; border-radius: .6rem; line-height: 1.8; box-shadow: 1px 1px 3px #d72d3e; } .ui-widget-content td:not(.ui-datepicker-today):not(.ui-state-active) .ui-state-default:hover{ background: transparent; color: #fe374b; position: relative; } td > a.ui-state-default{ font-weight: 900!important; position: relative; line-height: 1.8; } td > a.ui-state-default:after { content: ''; font-size: 100%; width: 0.8em; height: 3px; background-color: #fe374b; position: absolute; border-radius: 3px; left: 0.93em; bottom: 0; transition: .3s; opacity: 0;} .ui-widget-content td:not(.ui-datepicker-today):not(.ui-state-active) .ui-state-default:hover:after{ opacity: 1; }