﻿@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

@charset "utf-8";
:root {
   
}
.header .navbar {
    padding: 0 10px;
}
body,.contentbuilder-box body, .contentbuilder-box table.body, 
.contentbuilder-box h1, .contentbuilder-box h2, .contentbuilder-box h3, 
.contentbuilder-box h4, .contentbuilder-box h5, .contentbuilder-box h6, 
.contentbuilder-box p, .contentbuilder-box td, .contentbuilder-box th, 
.contentbuilder-box a {
    font-family: "Noto Sans TC","Roboto", sans-serif;

}
.editor {
    font-size:18px;
    line-height:1.8;
}

body, .contentbuilder-box body, 
.contentbuilder-box table.body, .contentbuilder-box p,
.contentbuilder-box td, .contentbuilder-box th {
    font-size: 18px;
    letter-spacing:1px;
}
/*.wid-float-section*/
.wid-float-section ul {
    background: none;
}
.wid-float-section ul li a:hover .icon,
.gotop a:hover,
.wid-float-section ul li a:hover {
    color: #fff;
}
.wid-float-section ul li.icon_l .icon::before {
    display:none;
}
.wid-float-section ul li.icon_l .icon {
    width: 40px;
    height: 40px;
    background: url(../images/all/social-01.svg) no-repeat  top -712px center;
    background-size: 130% auto;    
    display: block;

}
.wid-float-section ul li.icon_l a {
    padding: 14px 0;
}
.gotop a:hover,
.wid-float-section ul li a:hover {
    transform:scale(1.1);
}
.wid-float-section ul li {
    padding: 0;
}
    .wid-float-section ul li + li {
        border-top: 0;
        margin-top: 14px;
    }
    .wid-float-section ul li a .icon {
        font-size: 35px;
        line-height: 70px;
    }
    .wid-float-section ul li a {
    width: 70px;
    color: #ffffff;
    transition: all 0.3s ease;
    background: var(--main-color);
    border-radius: 40%;
}
.wid-float-section, body.scroll-down .wid-float-section.mobile-animate {
    bottom: 86px;
    right: 8px;
}
.gotop {
    right: 7px;
    bottom: 7px;
}
.gotop a {
    background: var(--main-color);
    border-radius: 40%;
}
/* navbar */

.nav-item.dropdown.dropdown-left .navbar-nav .nav-item:hover .nav-link.trigger:before {
    border-left: solid 5px currentColor;
}
.header  .nav-brand-wrapper {
    position: relative;
    z-index: 10;
}
.header .navbar .small-btn-box a.btn.btn-primary {
    font-size: 18px;
    background: var(--forth-color);
}
.header .nav-item.dropdown > .navbar-nav {
    width: 160px;
}
.header .btn-group.lang .dropdown-item:hover{
    background-color:#000;
}
.header .btn-group.lang .dropdown-item {
    background-color: #a8b590;
    color: #fff !important;
    padding: 6px 26px;
}
.header .navbar-nav .nav-link {
    padding: 20px 12px 10px 12px;
    position: relative;
}

.header .navbar-nav.nav-1 > .nav-item > .nav-link {
    background: url(../images/all/hover.svg) no-repeat top -30px center;
}

.header .navbar-nav.nav-1 > .nav-item:hover > .nav-link {
    background-position: top -2px center;
    color: var(--second-color);
}
.nav-item.dropdown.dropdown-left .navbar-nav .nav-item .nav-link.trigger:before {
    border-color: transparent transparent transparent currentColor;
}
.nav-item.dropdown.fadeup > .navbar-nav.in  li a{
    color:#000;
}
    .nav-item.dropdown.fadeup > .navbar-nav.in li a:hover {
        background-color: var(--main-color);
        color: #fff;
    }
.nav-item.dropdown > .navbar-nav .nav-item:hover a:before{
    color:#fff;

}
.header .navbar .small-btn-box,
.navbar .navbar-collapse {
    transition: all 0.5s;
}
.navbar .navbar-collapse > .navbar-nav {
    position: relative;
}


body.home .header .navbar.newtop .small-btn-box,
body.home .navbar.newtop .navbar-collapse {
 
}
.header .navbar .navbar-brand {
    width: 320px !important;
    height: 60px !important;
}
body.is_scroll .header .navbar .navbar-brand {
    width: 240px !important;
    height: 50px !important;
}
.header .navbar {
}
.header .navbar .nav-item .caret {
    border-left: solid 5px transparent;
    border-right: solid 5px transparent;
    border-top: solid 8px var(--main-color);
    display: block;
    margin: 3px auto 0;
}
.is_scroll .header .navbar {
    background: rgba(255, 255, 255, 0.9);
    border-bottom: 0;
    box-shadow: rgb(0 0 0 / 15%) 0 0 10px;
}
.kind-info .h2 {
    border-bottom: 0;
    color: #333;
    font-size: 40px;
    font-weight: 600;
    margin-bottom: 50px;
    padding-bottom: 0;
}
.kind-info {
    position: relative;
    padding-left: 60px;
    background: url(../images/all/titleIcon.svg) no-repeat left 0px top 2px;
    background-size: 47px;
}
    .h2 .txt-en, body.home .active .list_item .info {
        display: none;
    }
body.home .active {
    padding: 0 !important;
}
body.home .active .list_item {
    margin: 0;
}
 /* banner */
/* .banner .banner-wrapbox {
    position: relative;
}

body.home .banner .slick{
    position: relative;
    z-index:1;
}
body.home .banner .item > a{
   width:100%;
}
.banner-ani-zoom{
    position:absolute;
    left:0;
    top:0;
    height:100%;
    width:100%;
    z-index:0;
}

body.home .banner .slick-current {
    -webkit-animation-name: csszoomIn;
    -webkit-animation-duration: 6s;
}

@-moz-keyframes csszoomIn {
    0% {
        -moz-transform: scale(1.2);
        transform: scale(1.2);
   
    }

    70% {
        -moz-transform: scale(1);
        transform: scale(1);
       
    }

    100% {
        -moz-transform: scale(1);
        transform: scale(1);
      
     
    }
}

@-webkit-keyframes csszoomIn {
    0% {
        -moz-transform: scale(1.2);
        transform: scale(1.2);
        
    }

    70% {
        -moz-transform: scale(1);
        transform: scale(1);
     
    }

    100% {
        -moz-transform: scale(1);
        transform: scale(1);
     
    }
}

@keyframes csszoomIn {
    0% {
        -moz-transform: scale(1.2);
        transform: scale(1.2);
       
    }

    70% {
        -moz-transform: scale(1);
        transform: scale(1);
       
    }

    100% {
        -moz-transform: scale(1);
        transform: scale(1);
      
    }
}*/

    .banner .slick .slick-dots .slick-active button {
        background: #a1b57b;
    }

    .banner .slick .slick-dots button {
        background: #fff;
    }

.banner .slick-dots {
    bottom: 10px;
    z-index: 100;
}

    .banner {
        position: relative;
    }


/* 首頁區塊 */
/*.breadcrumb:before {
    content: " ";
    display: block;
    position: absolute;
    background-color: #b9c89d;
    left: -999px;
    right: -999px;
    top: 0;
    bottom: 0;
    z-index: -1;
}*/
.breadcrumb li,
.breadcrumb li a {
    color: #333;
}
    .breadcrumb li a   .txt-en{
        display:none;
    }
    .breadcrumb-item + .breadcrumb-item::before {
        color: #333;
    }
.breadcrumb-section {
    position: relative;
    background: none;
    font-size: 14px;
    margin: 0 auto;
}
.breadcrumb {
    background: none;
}
/* faq */
.accordion-list .accordion-list-header .btn-link:hover {
    color: #b9c89d;
}
.accordion-list .accordion-list-cont {
    background: #ffffff;

}
.accordion-list .st.st-a{
    color:#000;
}
.accordion-list .st {
    left: 12px;
    top: 12px;
    font-size: 20px;
    color: #ffffff;
}
.accordion-list .accordion-list-header .btn-link {
    padding: 15px 10px 15px 35px;
    color: #fff;
    border: none;
    background-color: #434343;
    border-radius: 0;
}
/* SID1 */
.side .collapse.navbar-collapse {
    margin-top: 0;
}
.side .filter-content > ul {
    line-height: 29px;
    padding:2px  6px;

}
.side .filter-content ul li {
    position: relative;
    padding-left: 15px;
}
.side .filter-content > ul li:before {
    content: " ";
    display: block;
    position: absolute;
    background-color:#b9c89d;
    left: 0;
    top: 14px;
    width: 7px;
    height: 2px;
}

    .side .filter-content, .side .filter-sidebar.multiple-collapse .collapse-content {
        border: none;
    }
.side .filter-title .collapsed-btn:hover,
.side .filter-sidebar.multiple-collapse .collapsed-btn:hover {
    color: #b9c89d;
}
.side .filter-title .collapsed-btn,
.side .filter-sidebar.multiple-collapse .collapsed-btn {
    padding: 0;
    background: unset;
    border: none;
    color: #000;
    font-size: 18px;
}
.side .h3 .txt-en {
    text-align: left;
    font-family: 'Cormorant Infant', serif;
    font-size: 2.1875rem;
    color: #000;
    margin-bottom: 0;
}
.side .h3 {
    border-bottom: 1px solid #5c5c5c;
    color: #040404;
    padding-bottom: 6px;
    margin-bottom: 20px;

}
    .side .h3 .txt-tw {
        display: block;
        padding: 0px;
        border: oldlace;
        text-align: left;
        font-size: 16px;
        color: #859f55;
        font-weight: 500;
    }
.btn-primary.focus, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-primary.dropdown-toggle:focus {
    background: #b9c89d;
    border-color: #b9c89d;
}
.btn.btn-primary:hover {
    background: #b9c89d;
    border-color: #b9c89d;
}

a:hover {
    color: #b9c89d;
}
.slick .slick-arrow {
    background:url(../images/all/arrow.svg) no-repeat top center;
}
.slick .slick-next {
    background-position: center top -110px;
}
/* 聯絡我們 */
.contact  .btn{
   
}
.contact .radio-inline label {
    margin: 0 12px 0 5px;
}
.btn-secondary {
    background-color: #b8b8b8;
}
.list-creative .list-terms:before {
    width: 3px;
    background: #515151;
   
}
.list-creative > li:nth-child(2n) .list-terms:before {
    background: #cecece;
}
.contact h3 .txt-tw {
    color: #859f55;
    font-size: 18px;
    padding-bottom: 10px;
    font-weight: 500;
}
.contact h3 .txt-en {
    font-family: 'Cormorant Infant', serif;
    font-size: 2.1875rem;
    color: #000;
    font-style: italic;
    display: table;
    margin: 0 auto 0;
    padding-bottom: 0;
    position: relative;
}
.contact h3 {
    position: relative;
    line-height: 28px;
    padding-bottom: 10px;
    margin-bottom: 60px!important;
}
.contact h3:before {
    content: " ";
    display: block;
    position: absolute;
    background-color: #000;
    width: 25px;
    height: 1px;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0 auto;
}
.btn-check:checked + .btn-info, .btn-check:active + .btn-info, .btn-info:active, .btn-info.active, .show > .btn-info.dropdown-toggle {
    background-color: #b9c89d;
    border-color: #b9c89d;
}
.btn-info:hover {
    background-color: #b9c89d;
    border-color: #b9c89d;
}
/* 產品 */
.badge {
    padding: 8px 11px;

}
.anchor-title.scroll-to-fixed-fixed {
    background: #b9c89d;
  
}
    .anchor-title.scroll-to-fixed-fixed   a {
        color: #fff;
    }
.btn.btn-dark:hover,
.btn.btn-light:hover {
    background-color:#b9c89d;
}
.btn.btn-dark {
    background: #b8b8b8;
}
.btn.btn-light{
    background: #1c1c1c;
}
.btn.btn-light, .btn.btn-dark {
    padding: 8px 25px 8px;

}
.product-info-area .item.price .cont {
    color: #abc282;
}
.h5 .sub-txt {
    color:#257830;

}

    .h5 {
    color: #000000;
}
.gallery-list.cover.hov-cart .btn-box .btn {
    background: #b9c89d;
}
.product  .gallery-list .item .info {
    padding: 0;
}
.product  .gallery-list.border-solid .item .item-detail {
    border: none;
}
.product .gallery-list .item .title {
    text-align: left;
    margin-bottom: 0;
    margin-top: 3px;
}
.product .info   .justify-content-center {
    justify-content: unset !important;
    text-align: left;
}
.product .gallery-list p.price {
    margin-top: 0;
    font-size: 0.875rem;
    color: #257830;
}



/* 最新消息 */

.show .page-item a.page-link:before {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    left: 0;
    transition: all .3s ease;
    z-index: -1;
    top: 0;
    bottom: 0;
    height: 0;
    opacity: 0;
}

.show .page-item a.page-link:hover:before {
    height: 100%;
    background-color: var(--forth-color);
    top: 0;
    opacity: 1;
}


.show .page-item a.page-link {
    background-color: #fff;
    border: 1px solid #cacaca;
    display: table;
    margin: 0 auto;
    padding: 12px 30px;
    /* font-size: 0.75rem; */
    color: #000;
    letter-spacing: 1px;
    position: relative;
    border-radius: 20px;
    overflow: hidden;
}
.show .page-item a.page-link:hover {
    color: #fff;
}
.h1 {
    border-bottom: 1px solid #c4c4c4;
    padding-bottom: 10px;
    margin-bottom: 40px;
}
.small-title {
    color: #257830;
}
.item:hover .pic img {
    transform: scale(1);
    opacity:0.7;
}

.article-grid.ar-img .item .info .title,
.article-grid.ar-img .item .info .title a {
    font-weight: bold;
    font-size: 20px;
}
.article-grid.ar-img .item .info .desc,
.article-grid.ar-img .item .info .desc a {
    font-size: 16px;
}
.article-grid .item .info {
    border: none;
    padding:0;

}
.article-grid.ar-img .item .info {
    /* padding: 25px; */
    padding-top: 15px;
}
.article-grid .item .info .kind a {
    font-size: 14px;
    padding: 5px 10px;
    background: unset;
    color: #257830;
    border: 1px solid #257830;
    margin-bottom:10px;
}
.page-link {
    color: #404040;
    border-color: #ffffff;
}
.btn-info {
    background-color: #dadada;
    font-size: 14px;
}
.page-link:hover,
.page-item.active .page-link {
    background: var(--forth-color);
    color: #fff;
    border: 1px solid var(--forth-color);
    border-color: unset;
}

.btn.btn-primary {
    background: #1c1c1c;
    border-color: unset;
    font-size: 14px;
}

.pic   .ratio-4x3 {
    --bs-aspect-ratio: 75%;
    position: relative;
    overflow: hidden;
}

/* 首頁區塊 */
.contentbuilder-box img {
    display: block;
    float: none !important;
}
.home-pagelist-area .title.h2 {
    display: none;
}
.sec01 {
    padding-top: 76px !important;
    padding-bottom: 76px !important;
}
.sec02 {
    padding-top: 120px !important;
    padding-bottom: 120px !important;
}
body.home .h3:empty {
    display: none;
}
.pic img {
    width: 100%;
}
body.home .home_about01 {
    text-align: center;
    /* padding-top: 3rem !important; */
    /* padding-bottom: 3rem !important; */
    padding-bottom: 0 !important;
}
body.home .home_about01 h3,body.about.kind_10 .txt .h2,body.about.kind_7 .txt .h2 {
    font-size: 32px;
    margin-bottom: 60px;
    line-height: 2;
    letter-spacing: 5px;
    color: #333;
}
body.home .home_about01 h3 strong,
body.home .home_about02 h3 strong,
body.home .home_about02 p strong,
body.about .txt   h2 b,b,strong {
    color: #d9a840;
}
body.home .home_about01 h3 strong,
body.home .home_about02 h3 strong{
    font-weight: 600;
}
body.home .home_about01 .home-pagelist-area {
    margin: 0 40px;
    background: #fcf7f5;
    border-radius:10px 10px 0 0;
    padding: 170px 0;
}
body.home .home_about01 p,body.home .home_about04 p {
    line-height: 2.5;
}
body.home .home_about01 .home-pagelist-area .wid-page_unit .deco,
body.about .txt .contactbox .deco{
    content: "";
    width: 225px;
    height: 140px;
    background: url(../images/all/paintA01.png) no-repeat center;
    background-size: 100% auto;
    display: block;
    margin: 75px auto 0;
    position:relative;
}
body.home .home_about01 .home-pagelist-area .wid-page_unit .deco::before,
body.about .txt .contactbox .deco::before{
    content: "";
    background-size: 100% auto;
    display: block;
    width: 33px;
    height: 38px;
    position: absolute;
    background: url(../images/all/paintA01-2.png) no-repeat center;
    background-size: contain;
    right: 0;
    top: -33px;
    opacity:0;
}
 body.home .home_about01 .home-pagelist-area .page-box.aos-animate .wid-page_unit .deco::before,
 body.about .txt .contactbox .deco::before,
 body.about.kind_63 .txt .centerbox .deco:after {
    -webkit-animation: flying 5s steps(5, end) forwards infinite;
    animation: flying 5s steps(5, end) forwards infinite;
    opacity:1;
}
img {
    transition: all 0.5s;

}
body.home .sec01 h3, body.home .sec02 h3, body.home section h6.h3 {
    font-weight: 600;
    font-size: 30px;
    margin-bottom: 30px;
}
body.home .home_about02 h3, body.home .home_about04 h3, body.about .txt .sec03 .infobox .subtitle h3 {
    letter-spacing: 2px;
    line-height: 1.8;
}
body.home .home_about02 p, body.about.kind_63 .txt .text-right {
    text-align: right;
    margin-top: 50px;
    margin-bottom: 0;
}
body.home .home_about02 p strong {
    font-weight: normal;
}

body.home .home_about02 .pic.pos-relative .deco,
body.about.kind_63 .txt .about01 .pic .deco,
body.about.kind_64 .txt .about02 .info .deco2, 
body.about .txt .sec03.about03 .infobox .deco,body.kind_67.about .txt .titlegroup .deco {
    width: 115px;
    height: 110px;
    display: block;
    position: absolute;
    left: -68px;
    bottom: -68px;
}
body.home .home_about02 .pic.pos-relative .deco,
body.about.kind_63 .txt .about01 .pic .deco,
body.about.kind_64 .txt .about02 .info .deco2, 
body.about .txt .sec03.about03 .infobox .deco {
    opacity: 0;
    transition-delay: 0.3s;
    transition: 1s all ease;
}
body.home .home_about02 .aos-animate .pic.pos-relative .deco,
body.about.kind_63 .txt .about01.aos-animate .pic .deco,
body.about.kind_64 .txt .about02.aos-animate .info .deco2,
body.about .txt .sec03.about03.aos-animate .infobox .deco {
    opacity: 1;
}
body.home .home_about02 .pic.pos-relative .deco .flower,
body.about.kind_63 .txt .about01 .pic .deco .flower,
body.about.kind_64 .txt .about02 .info .deco2 .flower,
body.about .txt .sec03.about03 .infobox .deco .flower,body.kind_67.about .txt .titlegroup .deco .flower {
    display: block;
    position: absolute;
}
body.home .home_about02 .pic.pos-relative .deco .flower1,
body.about.kind_63 .txt .about01 .pic .deco .flower1,
body.about.kind_64 .txt .about02 .info .deco2 .flower1,
body.about .txt .sec03.about03 .infobox .deco .flower1,
body.kind_67.about .txt .titlegroup .deco .flower1  {
    width: 72px;
    height: 74px;
    background: url(../images/all/paintA02-1.png) no-repeat left center;
    background-size: 100% auto;
    right: 0;
    top: 0;
    -webkit-animation: flower 2s steps(1, end) infinite;
    animation: flower 2s steps(1, end) infinite;
}
body.home .home_about02 .pic.pos-relative .deco .flower2,
body.about.kind_63 .txt .about01 .pic .deco .flower2,
body.about.kind_64 .txt .about02 .info .deco2 .flower2,
body.about .txt .sec03.about03 .infobox .deco .flower2,body.kind_67.about .txt .titlegroup .deco .flower3{
    width: 32px;
    height: 32px;
    background: url(../images/all/paintA02-3.png) no-repeat left center;
    background-size: 100% auto;
    -webkit-animation: flower2 3s steps(1, end) infinite;
    animation: flower2 3s steps(1, end) infinite;
    left: 0;
    top: 0;
}
body.home .home_about02 .pic.pos-relative .deco .flower3,
body.about.kind_63 .txt .about01 .pic .deco .flower3,
body.about.kind_64 .txt .about02 .info .deco2 .flower3,
body.about .txt .sec03.about03 .infobox .deco .flower3,
body.kind_67.about .txt .titlegroup .deco .flower2{
    width: 45px;
    height: 45px;
    background: url(../images/all/paintA02-2.png) no-repeat left center;
    background-size: 100% auto;
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    -webkit-animation: flower 3s steps(1, end) infinite;
    animation: flower 3s steps(1, end) infinite;
}
body.kind_67.about .txt .titlegroup .deco .flower1 {
    right: 0;
    top: auto;
    bottom: 0;
}
body.kind_67.about .txt .titlegroup .deco .flower2 {
    left: 0;
    bottom: auto;
    top: 0;
}
body.kind_67.about .txt .titlegroup .deco .flower3 {
    left: 0;
    bottom: 0;
    top: auto;
}
body.home .home_about03 {
    background: #fcf7f5;
    padding: 200px 0 !important;
}
body.home .home_about03 .preimg,body.about .txt .about06 .inner2  .preimg{
    transform: rotateY(-90deg);
    transition: 0.5s ease all;
    background: #fff;
    height: 100%;
    border-radius: 10px;
}
body.home .home_about03 .aos-animate .preimg,body.about .txt .about06 .inner2  .preimg.aos-animate {
    transform: rotateY(0deg);
}



body.home .home_about03 .pic img,body.about .txt .about06 .inner2 .pic img{
    margin: 0;
    border-radius: 10px;
    width: 100%;
}
body.home .home_about03 .info, body.about .txt .about06 .inner2 .info {
    /* height: 100%; */
    display: block;
    padding: 30px 20px;
    /* margin-top: 18px; */
    border-radius: 10px;
}
body.home .home_about03 .info p, body.about .txt .about06 .inner2 .info p {
    margin-bottom: 0;
    letter-spacing: 0;
}
body.home .home_about03  .info h5,body.about .txt .about06 .inner2 .info  h5{
   font-weight:500;
}
body.home .home_about03 .row > div:nth-child(3n+1) .info h5,
body.about .txt .about06 .inner2 > .row  > div:nth-child(3n+1) .info  h5 {
    color: var(--main-color);
}
body.home .home_about03 .row > div:nth-child(3n+2) .info h5,
body.about .txt .about06 .inner2 > .row  > div:nth-child(3n+2) .info  h5  {
    color: var(--forth-color);
}
body.home .home_about03 .row > div:nth-child(3n+3) .info h5,body.about .txt .about06 .inner2 > .row  > div:nth-child(3n+3) .info  h5  {
    color: var(--second-color);
}
body.home .home_about03 .wid-page_unit .row + .row {
    margin-top: 90px;
}

/*body.home .home_about04 h3:after, body.home .home_news .h3:after, 
body.about .txt .sec03 .infobox .subtitle h3::after {
    content: "｝";
    margin-left: 6px;
}

body.home .home_about04 h3:before, body.home .home_news .h3:before, 
body.about .txt .sec03 .infobox .subtitle h3:before {
    content: "｛";
    margin-right: 6px;
}
*/

body.home .home_subbanner {
    padding: 0 !important;
}
body.home .home_subbanner .item {
    width: 100%;
    padding: 0;
    margin-bottom: 0;
}
body.home .home_subbanner .item  .pic{
    position:relative;
}
body.home .home_subbanner .item  .pic .ratio{
    --bs-aspect-ratio: 40% !important;
}
.conbanner-list .item .pic:before {
    content:none;
}

body.home .home_about04 p {
    margin-top: 50px;
    margin-bottom: 0;
}
body.home .home_about04 .btn-more, .more {
    display: block;
    width: 280px;
    line-height: 4;
    text-align: center;
    color: #fff;
    background: #4fba79;
    border-radius: 4px;
    text-transform: uppercase;
}
body.home .home_about04 .btn-more:after,.more::after {
    content: "";
    display: inline-block;
    margin-left: 9px;
    height: 10px;
    width: 6px;
    background: url(../images/all/more.svg) no-repeat center;
    vertical-align: baseline;
    margin-bottom: 1px;
    transition:0.3s ease-in all;
}
body.home .home_about04 .btn-more:hover,.more:hover {
    background: var(--main-color);
}
body.home .home_about04 .btn-more:hover:after,more:hover::after {
    margin-left: 15px;
}
body.home .home_about04 .page-box + .page-box {
    margin-top: 85px;
}

body.home .home_about04 .pic:after {
    content: "";
    width: 115px;
    height: 74px;
    display: block;
    position: absolute;
    left: -18%;
    bottom: 0;
    background: url(../images/all/paintA03.png) no-repeat center;
    background-size: contain;
}




body.home .home_about04 .page-box:nth-child(3) .infobox .pic::after {
    left: auto;
    right: -210px;
    background: url(../images/all/paintA04.png) no-repeat center;
    background-size: contain;
    width: 170px;
    height: 150px;
}


body.home .home_about04 .page-box .infobox .pic::after,
.footer .deco li img,
body.home .home_about01 .home-pagelist-area .page-box .wid-page_unit .deco,
.footer .deco2 .flower, body.about.kind_63 .txt .about04 .deco3.pos-relative > .flower,
body.about .txt .about04 .flower, 
body.about.kind_66 .main .infobox .container::before {
    transform: scale(0);
    opacity: 0;
    transition-delay: 0.5s;
    transform-origin: bottom;
    transition: 1s all ease;
}
body.home .home_about04 .page-box.aos-animate .infobox .pic::after,
.footer.aos-animate .deco li img,
body.home .home_about01 .home-pagelist-area .page-box.aos-animate .wid-page_unit .deco,
.footer.aos-animate .deco2 .flower, body.about.kind_63 .txt .about04.aos-animate .deco3.pos-relative > .flower,
body.about .txt .about04.aos-animate .flower,
body.about.kind_66 .main .infobox.aos-animate .container::before {
    transform: scale(1);
    opacity: 1;
}

body.home .home_about04, body.about.kind_66 .main .videobox {
    padding-bottom: 354px !important;
    background: url(../images/all/waves_deco.png) repeat-x bottom center;
    transition: all .3s ease;
    -webkit-animation-name: bg-pan-left;
    -webkit-animation-duration: 4500000s;
    animation-name: bg-pan-left;
    animation-duration: 4500000s;
    animation-iteration-count: infinite;
    animation-fill-mode: forwards;
    animation-direction: alternate;
}

body.home section h6.h3 {
    font-size: 30px;
    text-align: left;
    color: #333;
}
body.home .home_news .item-wrap {
    background: #fdfbfb;
    height: 100%;
}
body.home .home_news .item-wrap .info {
    padding: 40px 40px 20px;
    position:relative;
}
body.home .home_news .item-wrap .info .tag {
    font-size: 16px;
    position: absolute;
    left: 40px;
    top: -18px;
    background: var(--main-color);
    /* color: #fff; */
    right: 40px;
    text-align: center;
    padding: 5px;
    margin:0;
}
body.home .home_news .item-wrap .info .tag a{
   color: #fff; 
}
body.home .home_news .item-wrap .info .date {
    margin-bottom: 20px;
}

body.home .home_news .gallery-list {
    position: relative;
}
body.home .home_news .deco.leaves2 img{
        animation-name: clockwiseSpin;
    animation-duration: 7.00496s;

}
body.home .home_news .deco{
  animation-delay:0.2s;

}
body.home .home_news .deco.leaves{
    right: -77px;
    top: 35px;
    width: 90px;
     animation-name: falling3;
    animation-duration: 10s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-timing-function: linear;
}
body.home .home_news .deco.leaves2 {
    width: 55px;
    left: -50px;
    bottom: -55px;
    animation-name: leaves1;
    animation-duration: 10s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-timing-function: linear;
}
.gallery-list .item .title {
    font-size: 20px;
    font-weight: normal;
}
.gallery-list .item  .pic{
    overflow:hidden;

}
.gallery-list .item:hover .pic img {
    opacity: 0.7;
    transform: scale(1);
}


.article-grid.info-absolute .item a {
    /*font-size: 0.875rem;*/
    color: #000;
    font-weight: bold;
}

.article-grid.info-absolute .item .info .date {
    color: #257830;
    font-size: 0.75rem;
    padding-top: 5px;
}

.article-grid.info-absolute .item .info {
    text-align: left;
    padding-top: 18px;
}

.article-grid.info-absolute .item:hover .pic img {
    opacity: 0.7;
}

.news-sec {
    margin: 30px 0;
    position: relative;
    padding-bottom: 50px
}
 


/* footer */

.footer .deco {
    left: 0;
    top: -152px;
   
}
.footer .deco li:nth-child(2) img,.footer.aos-animate .deco2 .flower2{
    transition-delay:0.5s;

}
.footer .deco li:nth-child(3) img,.footer.aos-animate .deco2 .flower3{
    transition-delay:1s;

}
.footer .deco li:nth-child(4) img{
    transition-delay:1.5s;

}
.footer {
    position: relative;
}
.footer::after {
    content: "";
    position: absolute;
    width: 118px;
    height: 382px;
    display: block;
    top: -370px;
    right: -260px;
    background: url(../images/all/paintB04.png) no-repeat bottom center;
    transition: 2s all ease;
    background-size: contain;
}

body.home .footer {
   margin-top:400px;
}

body.home .footer::after {
    width: 260px;
    height: 310px;
    top: -310px;
    right: -260px;
    background: url(../images/all/paintA082.png) no-repeat bottom center;
    background-size:contain;
}
body.home .footer.aos-animate::after, .footer.aos-animate::after {
    right: 14%;
}
.footer .deco ul li {
    display: inline-block;
    vertical-align: bottom;
    width: calc(100% / 4);
    margin: 0 -3px;
}
.footer .deco ul {
    margin-bottom: 0;
}
.footer .deco img {
    width: 100%;
}
.footer .deco ul li:nth-child(odd) {
    transform-origin:bottom;
     animation: swing2 5s ease infinite;
}
.footer .deco ul li:nth-child(even) {
    transform-origin:bottom;
     animation: swing3 5s ease infinite;
}
.footer .deco2.pos-absolute {
    right: 7%;
    top: -70px;
}
.footer .deco2 .flower {
    display: inline-block;
}
.footer .deco2 .flower1 {
    background: url(../images/all/paintA03-1.png) no-repeat bottom center;
    width: 38px;
    height: 72px;
    background-size: contain;
}
.footer .deco2 .flower2 {
    background: url(../images/all/paintA03-2.png) no-repeat bottom center;
    width: 32px;
    height: 75px;
    background-size: contain;
}
.footer .deco2 .flower3 {
    background: url(../images/all/paintA03-3.png) no-repeat bottom center;
    width: 26px;
    height: 62px;
    background-size: contain;
}
.footer .deco2 .flower + .flower {
    margin-left: 10px;
}
.footer .copyrights-info {
    
    border-top: 0;
}
.footer .footer_content {
    background: url(../images/all/footer_deco.png) repeat-x bottom center #fff;
    padding: 100px 0;
}
.footer-logo {
    max-width: 320px;
}
.footer .footer_content .sitemap > ul {
    display: block !important;
}
.footer .footer_content .sitemap > ul > li {
    display: block;
}
.footer .footer_content .sitemap > ul > li > a,
.footer .footer_content .wid-page_unit .editor > ul > li > a {
    font-weight: normal;
    background: url(../images/all/list_icon.svg) no-repeat left center;
    padding-left: 16px;
    padding-bottom: 0;
    display: block;
}

.footer .footer_content .wid-page_unit ul {
    padding-left: 0;
    list-style-type: none;
}
.footer .footer_content .wid-page_unit ul li a {
    display: block;
    padding-left: 15px;
}
.footer .footer_content .wid-page_unit .editor > ul {
    display: inline-block;
    vertical-align: top;
    width: 49%;
}
.footer .footer_content .wid-page_unit ul li ul {
    margin-left: 16px;
}
.footer .footer_content .wid-page_unit ul li ul li a::before {
    content:"";
    width:10px;
    height:1px;
    background:#333;
    position:absolute;
    left:0;
   top:calc(50% - 1px / 2);
}
.footer .footer-info ul li .icon {
    display: none;
}
.footer .fot_sitemp .d-flex {
    justify-content:center;
}
.footer .copyrights {
    text-align: right;
    padding-right: 16%;
}
.footer-bottom .container {
    width: 69%;
    padding-left: 4%;
}
.footer .footer_content.fc_seperate_bottom {
    padding: 47px 0 0;
}


.footer ul li a, body.about .txt .contactbox li {
    position: relative;
    display: block;
}
.footer .footer-info ul li.tel a, body.about .txt .contactbox li {
    background: url(../images/all/contactIcon-05.svg) no-repeat left -6px top -13px;
    padding-left: 30px;
}

.footer .footer_content.fc_seperate_bottom .footer-bottom {
    background: #fff;
    margin-top: 50px;
}


/*內頁*/

body.about .txt h3.vertical, body.about .txt h3 {
    font-weight: 600;
    font-size: 30px;
}
.content .editor {
    margin-bottom: 0 !IMPORTANT;
}
body:not(.home) .page-content, .main {
    background: #fcf7f5;
}
.main {
    padding-bottom:400px;
}
.ezshare-box,
body.about.kind_7 .kind-info .h2,
body.about.kind_7 .main .side,
body.about.kind_7 .main-content,
body.about.kind_10 .kind-info .h2,
body.about.kind_10 .main .side,
body.about.kind_10 .main-content,
.footer-seo {
    display: none !important;
}
body.about.kind_3 .txt h4 small {
    color: #333;
}
body.about.kind_3 .txt h4 {
    font-size: 30px;
    margin-bottom: 50px;
}

body.about.kind_3 .txt ul, body.about .txt ul {
    list-style: none !important;
    padding-left: 0 !important;
    color: var(--main-color);
    font-size: 20px;
    line-height: 2;
}
body.about.kind_3 .txt ul li:before, body.about .txt ul li:before{
    content:"✿";
    margin-right:5px;
}
body.about .txt .slick li:before, body.about .txt .contactbox li:before {
    content: none;
}
body.about .txt .centerbox {
    margin: 120px 0;
}

body.about .txt .centerbox p {
    position: relative;
    display: table;
    margin: 0 auto;
    padding: 0 25px;
}
body.about .txt .centerbox p::before, body.about .txt .centerbox p::after {
    content: "";
    width: 30px;
    height: 96px;
    display: block;
    position: absolute;
    background: url(../images/all/decoitem.svg) no-repeat top -4px center;
    /* background-size: cover; */
    top: 50%;
    transform: translateY(-50%);
}
body.about  .txt .centerbox p::before{
    left:-30px;
}
body.about  .txt .centerbox p::after {
    right: -30px;
    background-position: top -198px center;
    /* top: 50%; */
}
body.about .txt .circlebox {
    flex-wrap: wrap;
    justify-content: center;
    margin:50px 0;
}

body.about  .txt .circlebox .list_item {
    width: 350px;
    height: 350px;
    text-align: center;
    border-radius: 50%;
    background: rgb(218 169 65 / 80%);
    margin: 0 -13px;
    padding: 37px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
}
body.about .txt .circlebox .list_item:nth-child(2) {
    background: rgb(79 186 121 / 80%);
}
body.about  .txt .circlebox .list_item:nth-child(3) {
    background: rgb(113 206 233 / 80%);
}
body.about  .txt .circlebox .list_item h5{
    font-size:24px;
}
body.about  .txt  .circlebox .list_item p {
    font-size:16px;
}
body.about  .txt .circlebox .list_item h5,body.about  .txt  .circlebox .list_item p {
    color: #fff;
    text-align: center;
}
body.about.kind_7 .main > .container,
body.about.kind_10 .main > .container,
body.about.kind_63 .main > .container,
body.about.kind_64 .main > .container {
    max-width: 100%;
    padding: 0;
}
body.about.kind_7 .slickbox h1, 
body.about.kind_10 .slickbox h1 {
    margin: 0;
    background: url(../images/all/decobg.png) repeat-x bottom var(--main-color);
    color: #fff;
    font-size: 42px;
    padding: 30px;
}
body.about.kind_7 .main > .container,
body.about.kind_10 .main > .container,
body.about.kind_65 .main > .container,
body.about.kind_63 .main > .container,
body.about.kind_64 .main > .container {
    max-width: 100%;
    padding: 0;
}
body.about.kind_7 .slickbox,
body.about.kind_10 .slickbox {
    margin-bottom: 70px;
}

body.about.kind_7 .slickbox .slick,
body.about.kind_10 .slickbox .slick {
    margin-bottom:0;
}
body.about.kind_7 .slickbox .slick img,
body.about.kind_10 .slickbox .slick img{
    width: 100%;
}
body.about.kind_7 .breadcrumb-section,
body.about.kind_10 .breadcrumb-section {
    margin-bottom: 0 !important;
}

body.about.kind_7 .txt .contentbuilder-box h2,
body.about.kind_10 .txt .contentbuilder-box h2 {
    margin-bottom: 40px;
    letter-spacing: 5px;
}
body.about .txt h2 {
    font-weight:bold;
}
body.about .txt .slick, body.about .txt .slick img {
    margin-bottom: 0;
}
body.about .txt .slick {
    padding: 0 35px !important;
}
body.about.kind_7 .txt .slick, body.about.kind_10 .txt .slick {
    padding: 0 !important;
}
body.about .txt .contactbox li + li {
    margin-top: 18px;
}
body.about .txt .contactbox li a, body.about .txt .contactbox li {
    display: block;
    color: #333;
}
body.about .txt .contactbox li.tel {
    background-position: left -6px top -5px;
}
body.about .txt .contactbox li.add {
    background-position: left -6px top -160px;
}
body.about .txt .contactbox li.line {
    background-position: left -6px top -323px;
}
body.about .txt .contactbox li.ig {
    background-position: left -6px top -484px;
}
body.about .txt .contactbox li.fb {
    background-position: left -6px top -634px;
}

body.about .txt .contactbox {
    position:relative;
    margin-bottom:0;
}
body.about.kind_59 .main {
    background: url(../images/all/contactbg-01.png) no-repeat bottom 177px center;
    background-size: 55% auto;
}

body.about  .txt .bgbox:before {
    display:block;
    content:"";
    width:100%;
    height:105px;
    background: url(../images/all/waves_deco.png) repeat-x bottom center;
}
body.about.kind_65 #video_wrap {
    pointer-events: none;
}
body.about .logomean .list {
    padding: 22px 0;
    padding-left: 138px;
    position: relative;
    margin: 36px 0;
}
body.about .logomean .list::before {
    content: "";
    width: 130px;
    height: 130px;
    background: url(../images/all/about03-01.svg) no-repeat center;
    position: absolute;
    left: 0;
    top: 50%;
    transform:translateY(-50%);
}
body.about .logomean .list:nth-child(2)::before {
    background-image: url(../images/all/about03-02.svg);
}

body.about .logomean .list p {
    margin: 0 !IMPORTANT;
}
body.about.kind_65 .txt .bottombox.center {
    text-align: center;
}
body.about .txt .coreValue .circlebox p {
    color: #333;
    font-size: 34px;
    margin-bottom: 0;
}
body.about .txt .coreValue .circlebox .list_item {
    margin: 0;
    position: relative;
    background: #fcf7f5;
    border: 3px solid #e6e6e6;
  
    opacity: 0;
    transition-delay: 0.5s;
         transform-origin: center;
    transition: 1s all ease;
}
body.about .txt .coreValue .circlebox .list_item, 
body.about .txt .coreValue .circlebox .list_item .deco,
body.about .txt .coreValue .circlebox .list_item::before,
body.about .txt .coreValue .circlebox .list_item .deco  {
    opacity: 0;
    transition-delay: 0.5s;
  transform-origin: center;
    transition: 1s all ease;
}
body.about .txt .coreValue .circlebox.aos-animate .list_item,
body.about .txt .coreValue .circlebox.aos-animate .list_item .deco,
body.about .txt .coreValue .circlebox.aos-animate .list_item::before,
body.about .txt .coreValue .circlebox .list_item.aos-animate .deco {
    opacity: 1;
}

body.about .txt .coreValue .circlebox.aos-animate .list_item:nth-child(1) {
    transition-delay:0.5s;
}
body.about .txt .coreValue .circlebox.aos-animate .list_item:nth-child(2) {
    transition-delay:1s;
}
body.about .txt .coreValue .circlebox.aos-animate .list_item:nth-child(3) {
    transition-delay:1.5s;
}

body.about .txt .coreValue .circlebox .list_item::before {
    content: "";
    /* width: 100%; */
    /* height: 185px; */
    background: url(../images/all/circle_stroke-01.svg) no-repeat center top -3px;
    position: absolute;
    left: -10px;
    top: -4px;
    /* transform: translateX(-50%); */
    right: -10px;
    background-size: 100% auto;
    transition-delay: 2s;
      transform: rotate(90deg);
    bottom: 0;
}
body.about .txt .coreValue .circlebox.aos-animate .list_item:before,
body.about .txt .coreValue .circlebox .list_item:nth-child(2)::before  {
    transform: rotate(0);
}
body.about .txt .coreValue .circlebox .list_item:nth-child(2)::before {
     background-image: url(../images/all/circle_stroke-02.svg);
    bottom: -5px;
}
body.about .txt .coreValue .circlebox.aos-animate .list_item:nth-child(2)::before {
  
    transform: rotate(180deg);
}
body.about .txt .coreValue .circlebox .list_item:nth-child(3)::before {
    background-image: url(../images/all/circle_stroke-03.svg);
}
body.about .txt .coreValue .circlebox .list_item .deco {
    width: 30px;
    height: 30px;
    position: absolute;
    border-radius: 50%;
    border: 4px solid #fcf7f5;
    right: -16px;
    z-index: 1;
    display:block;
      transition-delay:2s;
}

body.about .txt .coreValue .circlebox.aos-animate .list_item:nth-child(1) .deco {
    background: var(--forth-color);
}
body.about .txt .coreValue .circlebox.aos-animate .list_item:nth-child(2) .deco {
    background: var(--main-color);
}
body.about .txt .coreValue .circlebox.aos-animate .list_item:nth-child(3) .deco {
    background: var(--second-color);
}

body.about.kind_63 .txt .about01 h3.vertical {
    min-height: 0;
}


body.about.kind_63 .txt .about01 .pic .deco {
    left: auto;
    bottom: auto;
    right: -58px;
    top: -58px;
    /* transform: rotateY(-180deg); */
}
body.about.kind_63 .txt .about01 .pic .deco .flower1 {
    right: auto;
    left: 0;
    bottom: 0;
    top: auto;
}

body.about.kind_63 .txt .about01 .pic .deco .flower2 {
    left: auto;
    bottom: 0;
    right: -14px;
    top: auto;
}
body.about.kind_63 .txt .about01 .pic .deco .flower3  {
   
    left: auto;
    bottom: auto;
    right: 0;
    top: 0;
}
body.about.kind_63 .txt .centerbox .deco {
    width: 273px;
    height: 170px;
    display: block;
    position: relative;
    background: url(../images/all/paintB10-01.png) no-repeat left center;
    background-size: 100% auto;
    margin: 0 auto 100px;
}
body.about.kind_63 .txt .centerbox .deco:after {
    content: "";
    background-size: 100% auto;
    display: block;
    width: 58px;
    height: 44px;
    position: absolute;
    background: url(../images/all/paintB10-02.png) no-repeat center;
    background-size: contain;
    right: 0;
    top: 0;
    /* opacity: 0; */
}

body.about .txt .about02 {
    padding: 200px 0;
    background: #fff;
}
body.about.kind_63 .txt .about02 .logoArea {
    position: relative;
    width: 731px;
    height: 736px;
    background: url(../images/all/curves.png) no-repeat right -20px bottom -16px;
}

body.about.kind_63 .txt .about02 .list {
    padding-left: 210px;
    position: absolute;
}

body.about.kind_63 .txt .about02 .list:before {
    content: "";
    width: 167px;
    height: 167px;
    border-radius: 50%;
    border: 3px solid;
    display: block;
    background: #fff;
    text-align: center;
    font-size: 42px;
    line-height: 167px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
body.about.kind_63 .txt .about02 .list.l1:before {
    content: "01";
    border-color: var(--main-color);
    color: var(--main-color);
}
body.about.kind_63 .txt .about02 .list.l2:before {
    content: "02";
    border-color: var(--forth-color);
    color: var(--forth-color);
}
body.about.kind_63 .txt .about02 .list.l3:before {
    content: "03";
    border-color: var(--second-color);
    color: var(--second-color);
}
body.about.kind_63 .txt .about02 .list.l1 {
    right: -66%;
    top: 135px;
}
body.about.kind_63 .txt .about02 .list.l2 {
    right: -36%;
    top: 50%;
}
body.about.kind_63 .txt .about02 .list.l3 {
    right: -54px;
    bottom: -30px;
}
body.about.kind_63 .txt .about02 .list h4 {
    font-size: 26px;
}

body.about.kind_63 .txt .about02 .list.l1 h4 {
    color: var(--main-color);
}

body.about.kind_63 .txt .about02 .list.l2 h4 {
    color: var(--forth-color);
}

body.about.kind_63 .txt .about02 .list.l3 h4 {
    color: var(--second-color);
}


body.about.kind_63 .txt .about02 .list p {
    margin-left: 0 !important;
}


body.about.kind_63 .txt .about04 {
    padding: 200px 0 300px;
}

body.about.kind_63 .txt .about04 .container.contentbuilder-box {
    margin-right: 0;
    max-width: 85%;
}

body.about.kind_63 .txt .about04 .deco3.pos-relative {
    display: inline-block;
    margin-top: 92px;
}


body.about.kind_63 .txt .about04 .deco3.pos-relative > div {
    display: inline-block;
    vertical-align: bottom;
     background: url(../images/all/paintB11-02.png) no-repeat top -20px left -43px;
}
body.about.kind_63 .txt .about04 .deco3.pos-relative > .flower {
    
    transform-origin:bottom;

}
body.about.kind_63 .txt .about04 .deco3.pos-relative > .flower1 {
    width: 64px;
    height: 56px;
    background-position:top -19px left -40px;
    transition-delay:2s;

}
body.about.kind_63 .txt .about04 .deco3.pos-relative > .flower2 {
    width: 64px;
    height: 56px;
    background-position: top -263px left -39px;
    transition-delay:2.5s;
}
body.about.kind_63 .txt .about04 .deco3.pos-relative > .flower3 {
    width: 69px;
    height: 129px;
    background-position: top -454px left -27px;
   transition-delay:3s;
}
body.about.kind_63 .txt .about04 .deco3.pos-relative > .flower4 {
    width: 54px;
    height: 122px;
    background-position: top -706px left -47px;
     transition-delay:3.5s;
}
body.about.kind_63 .txt .about04 .deco3.pos-relative > .flower5 {
    width: 50px;
    height: 100px;
    background-position: top -1040px left -41px;
   transition-delay:4s;
}
body.about .txt .active .slick {
    padding: 0;
}
body.about .txt .active .slick li::before {
    content:none;
}
/*
body.about.kind_63 .txt .about04 .deco3.pos-relative > .flower1,
body.about.kind_63 .txt .about04 .deco3.pos-relative > .flower3,
body.about.kind_63 .txt .about04 .deco3.pos-relative > .flower5{
animation: swing3 5s ease infinite;

}

body.about.kind_63 .txt .about04 .deco3.pos-relative > .flower2,
body.about.kind_63 .txt .about04 .deco3.pos-relative > .flower4{
animation: swing2 5s ease infinite;

}*/

body.about.kind_63 .txt .about04 .deco3.pos-relative > .item-drip {
    width: 128px;
    height: 100px;
    position: absolute;
    background-position: top -1304px left -5px;
    right: -106px;
    top: -78px;
    animation: drip 5s ease infinite;
}
body.about .txt .sec03 {
    padding: 80px 0;
}
body.about.kind_64 .main-content {
    background: #fff;
    padding: 90px 0;
}

body.about.kind_64 .main-content .h2 {
    margin-bottom: 0;
}
body.about.kind_64 .main .side1 {
    margin-bottom: 0;
}
body.about.kind_64 .txt .sec03.about01 {
    padding-top: 0;
}
body.about.kind_64 .txt .sec03.about02 .info .col-md-6 .list_item {
    height: 100%;
    background: #fff;
    border-radius: 20px;
    border: 1px solid #a5a5a5;
    padding: 20px;
}



body.about.kind_64 .txt .circlebox.d-md-flex {
    position: relative;
    width: 300px;
    height: 300px;
    margin: 220px auto 208px;
    /* background: #000; */
}

body.about.kind_64 .txt .circlebox .list_item {
    background: none;
    border: 4px solid;
    position: absolute;
    margin:0;
}
body.about.kind_64 .txt .circlebox .list_item h5 {
    margin-bottom: 0;
    color: #333;
}
body.about.kind_64 .txt .circlebox .list_item:nth-child(3) {
    border-color: var(--second-color);
    left: -175px;
    bottom: -175px;
}
body.about.kind_64 .txt .circlebox .list_item:nth-child(1) {
    border-color: var(--main-color);
    right: -175px;
    bottom: -175px;
}
body.about.kind_64 .txt .circlebox .list_item:nth-child(2) {
    border-color: var(--forth-color);
    right: calc(50% - 350px / 2);
    top: -136px;
    /* transform: translateX(50%); */
}
body.about.kind_64 .txt .sec03.about02 {
    background: none;
}
body.about.kind_64 .txt .sec03.about02 img {
    width: 100%;
}
body.about.kind_64 .txt .sec03.about02 .info{
    position:relative;
}
body.about.kind_64 .txt .sec03.about02 .info .list_item h5 {
    font-size: 28px;
    margin: 0 auto 14px;
    display: table;
    font-weight: 500;
}
body.about.kind_64 .txt .sec03.about02 .info   .list_item h5:before {
    content: "✿";
    color: var(--main-color);
    margin-right: 7px;
    font-size: 22px;
}
body.about.kind_64 .txt .sec03.about02 .info .row {
    margin-top: 50px;
    gap: 28px 0;
}
body.about.kind_64 .txt .sec03.about02 .info .list_item p {
    margin-bottom: 0;
}

body.about.kind_64 .txt .circlebox .list_item::before {
    content: "";
    display: block;
    width: 92px;
    height: 90px;
    margin: 0 auto 20px;
    background: url(../images/all/abouticonset-02.svg) no-repeat top -20px left -21px;
}
body.about.kind_64 .txt .circlebox .list_item:nth-child(2)::before {
    background-position: top -334px left -21px;
}
body.about.kind_64 .txt .circlebox .list_item:nth-child(3)::before {
    background-position: top -681px left -21px;
}
body.about.kind_64 .txt .about02 .info .deco2 .flower1 {
    right: auto;
    left: 0;
}

body.about.kind_64 .txt .about02 .info .deco2 .flower2 {
    left: auto;
    right: 0;
}

body.about.kind_64 .txt .about02 .info .deco2 .flower3 {
    left: auto;
    right: 0;
}

body.about.kind_64 .txt .about02 .info .deco2 {
    left: -100px;
    bottom: -84px;
}
body.about .txt .sec03.about03 .infobox .deco, body.about .txt .sec03.about05 .infobox .deco {
    left: -18%;
    bottom: 0;
}
body.about .txt .sec03 .infobox .deco {
    position: absolute;
}
body.about .txt .sec03 .infobox .info {
    margin-top: 50px;
}
body.about .txt .sec03 .infobox .info .list:before {
    content: "";
    width: 50px;
    height: 50px;
    line-height: 50px;
    display: block;
    background: var(--forth-color);
    border-radius: 50%;
    color: #fff;
    margin-bottom: 14px;
    text-align: center;
}

body.about .txt .sec03 .infobox .info .list.l1:before {
    content: "01";
}
body.about .txt .sec03 .infobox .info .list.l2:before {
    content: "02";
}
body.about .txt .sec03 .infobox .info .list.l3:before {
    content: "03";
}
body.about .txt .sec03 .infobox .info .list h4 {
    font-size: 30px;
    font-weight: 500;
    letter-spacing: 5px;
    text-decoration: underline;
    color: #333;
}
body.about .txt .sec03 .infobox .info .list p {
    margin-top:20px !important;
    margin-left: 0 !important;
}

body.about .txt .about04 .flower {
    display: inline-block;
    background: url(../images/all/paintB11-02.png) no-repeat top -20px left -43px;
}
body.about .txt .about04 .flower1 {
    width: 48px;
    height: 90px;
    background-position: top -298px left -15px;
    background-size: 190%;
}
body.about .txt .about04 .flower2 {
    width: 40px;
    height: 86px;
    background-position: top -431px left -25px;
    background-size: 213%;
}
body.about .txt .about04 .flower3 {
    width: 34px;
    height: 74px;
    background-position: top -662px left -24px;
    background-size: 260%;
}
body.about .txt .about04 .deco{
    position: absolute;
    right: -18%;
    bottom: -7px;
}

body.about .txt .about05 .infobox .deco {
    width: 103px;
    height: 92px;
    background: url(../images/all/paintB12.png) no-repeat center;
    background-size: 100% auto;
    
}
body.about .txt .about05.aos-animate .infobox .deco {
    -webkit-animation: shootingStar 5s infinite;
    animation: shootingStar 5s infinite;
}
body.about .txt .about06 .deco {
    display: block;
    width: 150px;
    height: 90px;
    background: url(../images/all/paintB15.png) no-repeat center;
    background-size: 100% auto;
    right: -20%;
    bottom: 0px;
}
body.about .txt .about06.aos-animate .deco {
    -webkit-animation: Planet 5s infinite;
    animation: Planet 5s infinite;
}
.title_animate span {
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}
body.about.kind_7 .txt .h2, body.about.kind_10 .txt .h2 {
    margin-bottom: 40px;
    border-bottom: 0;
}
.title_animate:nth-child(2) span:nth-child(4), 
.title_animate:nth-child(2) span:nth-child(5),
.title_animate:nth-child(2) span:nth-child(6),
.title_animate:nth-child(2) span:nth-child(7) {
    color: var(--main-color);
}

.txt .btn-more-join {
    display: block;
    padding: 10px 112px 10px 25px;
    border: 1px solid;
    border-radius: 40px;
    color: var(--main-color);
    background: url(../images/all/more2.svg) no-repeat right 10px center;
    display: table;
    /* padding-right: 112px; */
    margin: 0 auto;
    letter-spacing: 2px;
}
.txt .btn-more-join:hover {
    background-position: right 2px center;
}
body.about.kind_67 .txt .about01{
position:relative;
z-index:1;
}

body.about.kind_67 .txt .about01:before {
    content: "";
    display: block;
    width: 527px;
    height: 230px;
    position: absolute;
    right: 0;
    bottom: 0;
    background: url(../images/all/decoitem2.svg) no-repeat bottom center;
    background-size: contain;
z-index:-1;
}
.txt-mainColor {
    color: var(--main-color);
}

    body.kind_67.about .txt .flex-row-reverse {
        position: relative;
    }
body.about.kind_67 .txt .about01 .pic + .pic {
    margin-top: 42px;
}


body.about.kind_66 .main-content, body.about.kind_66 .main .videobox {
    background-color: #fff;
    padding-top: 60px;
}

body.about.kind_66 .main > .container {
    max-width: 100%;
    padding: 0;
}


body.about.kind_66 .main > .container .side {
    display: none !important;
}

body.about.kind_66 .kind-info,
body.about.kind_66 .main-content .kind-info .h2,
body.kind_66.about .breadcrumb-section {
    margin-bottom: 0 !important;
}

body.about.kind_66 .main .picbox img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}
body.about.kind_66 .main .picbox {
    gap: 24px 0;
}
body.about.kind_66 .main .infobox {
    padding: 250px 0 80px;
}

body.about.kind_66 .main .infobox .info::before {
    content: "";
    position: absolute;
    background: url(../images/all/paintB03-1.png) no-repeat top center;
    display: block;
    width: 127px;
    height: 97px;
    right: 33px;
    top: -110px;
    background-size: contain;
    transform: rotateY(-180deg);
}
body.about.kind_66 .main .infobox .info::after {
    content: "";
    position: absolute;
    width: 97px;
    height: 100px;
    background: url(../images/all/paintB03-2.png) no-repeat left 0px top 0px;
    display: block;
    right: 63px;
    top: -112px;
    background-size: cover;
    -webkit-animation: sun3 3s steps(1, end) infinite;
    animation: sun3 3s steps(1, end) infinite;
    transform: rotateY(-180deg);
}
.txt-green {
    color: var(--forth-color) !important;
}
body.about.kind_66 .main .infobox .info .btn-more-join {
    color: var(--forth-color);
    margin-left: 0;
    margin-top: 70px;
    background-image: url(../images/all/more3.svg);
}

body.about.kind_66 .main .infobox .info ul {
    margin: 36px 0;
}

body.about.kind_66 .main .infobox .container {
    position: relative;
}
body.about.kind_66 .main .infobox .container::before {
    content: "";
    position: absolute;
    background: url(../images/all/tree.png) no-repeat top center;
    display: block;
    width: 150px;
    height: 136px;
    background-size: contain;
    left: -65px;
    bottom: 0;
}
body.about.kind_66 .main .infobox h3 {
    line-height:1.8;
}
body.news .main-content {
    margin-top: 60px;
}
body.news .article-grid .item .info .d-flex .kind a,
body.news .kind-tag-area a {
    margin: 0;
    background: var(--main-color);
    border-radius: 20px;
    border: 0;
    color: #fff;
}

body.news .article-grid.ar-img .item .info .d-flex {
    gap: 6px;
    margin-bottom:20px;
}
body.news .main > .container {
    position: relative;
}
    body.news .main > .container::before {
        content: "";
        position: absolute;
        background: url(../images/all/paintB03-1.png) no-repeat top center;
        display: block;
        width: 127px;
        height: 97px;
        right: 0;
        top: -193px;
        background-size: contain;
    }

    body.news .main > .container::after {
        content: "";
        position: absolute;
        width: 97px;
        height: 100px;
        background: url(../images/all/paintB03-2.png) no-repeat left 0px top 0px;
        display: block;
        right: 0;
        top: -196px;
        background-size: cover;
        -webkit-animation: sun3 3s steps(1, end) infinite;
        animation: sun3 3s steps(1, end) infinite;
    }

body.news.show .main > .container::before,
body.news.show .main > .container::after {
    content: none;
}
.subject-sec h1 {
    font-size: 28px;
}
.subject-sec {
    position: relative;
    padding-left: 138px;
}
body.news .subject-sec h1::before {
    content: "";
    position: absolute;
    width: 128px;
    height: 94px;
    background: url(../images/all/paintB03-1.png) no-repeat top center;
    display: block;
    left: -2px;
    top: -14px;
    background-size: contain;
}

body.news .subject-sec h1::after {
    content: "";
    position: absolute;
    width: 97px;
    height: 96px;
    background: url(../images/all/paintB03-2.png) no-repeat left 0px top 0px;
    display: block;
    background-size: cover;
    -webkit-animation: sun2 3s steps(1, end) infinite;
    animation: sun2 3s steps(1, end) infinite;
    left: 28px;
    top: -15px;
}



@-webkit-keyframes bg-pan-left {
    0% {
        background-position: left bottom;
    }

    50% {
        background-position: -99999999px bottom;
    }

    100% {
        background-position: left bottom;
    }
}

@-webkit-keyframes flying {
    0% {
        right: -30px;
    }

    100% {
        right: 130%;
    }
}

@keyframes flying {
    0% {
        right: -30px;
    }

    100% {
        right: 130%;
    }
}

@-webkit-keyframes flower {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(30deg);
    }

    100% {
        transform: rotate(0);
    }
}

@keyframes flower {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(30deg);
    }

    100% {
        transform: rotate(0);
    }
}

@-webkit-keyframes flower2 {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(-45deg);
    }

    100% {
        transform: rotate(0);
    }
}

@keyframes flower {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(-45deg);
    }

    100% {
        transform: rotate(0);
    }
}

@-webkit-keyframes swing2 {
    0% {
        transform: rotate(-15deg);
    }


    50% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-15deg);
    }
}

@-webkit-keyframes swing3 {
    0% {
        transform: rotate(10deg);
    }


    50% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(10deg);
    }
}

@-webkit-keyframes leaves1 {

    0% {
        opacity: 0;
        transform: translate(-135px, -102px) rotate(295deg) scale(0.8);
    }

    50% {
        opacity: 0.5;
        transform: translate(0, 0) rotate(333deg) scale(1);
    }

    100% {
        opacity: 1;
        transform: translate(0, 0) rotate(359deg) scale(1);
    }
}

@-webkit-keyframes falling3 {
    0% {
        transform: translate(17px, -51px) scale(0.8);
        opacity: 0;
    }

    100% {
        transform: translate(0, 0) scale(1);
        opacity: 1;
    }
}

@-webkit-keyframes counterclockwiseSpinAndFlip {
    /* Flip a leaf and rotate it by 50 degrees in 2D space at the start of the animation */
    0% {
        -webkit-transform: scale(-1, 1) rotate(50deg);
    }
    /* Flip a leaf and rotate it by -50 degrees in 2D space at the end of the animation */
    100% {
        -webkit-transform: scale(-1, 1) rotate(-50deg);
    }
}

@-webkit-keyframes clockwiseSpin {
    /* Rotate a leaf by -50 degrees in 2D space at the start of the animation */
    0% {
        -webkit-transform: rotate(-50deg);
    }
    /*  Rotate a leaf by 50 degrees in 2D space at the end of the animation */
    100% {
        -webkit-transform: rotate(50deg);
    }
}


@-webkit-keyframes sun {
    0% {
        background-position:left 0px top 0px;
    }

    50% {
        background-position:left -307px top 0px;
    }
    100% {
        background-position: left 0px top 0px;
    }

}


@keyframes sun {
    0% {
        background-position: left 0px top 0px;
    }

    50% {
        background-position: left -307px top 0px;
    }

    100% {
        background-position: left 0px top 0px;
    }
}


@-webkit-keyframes sun2 {
    0% {
        background-position: left 0px top 0px;
    }

    50% {
        background-position: left -144px top 0px;
    }

    100% {
        background-position: left 0px top 0px;
    }
}

@keyframes sun2 {
    0% {
        background-position: left 0px top 0px;
    }

    50% {
        background-position: left -144px top 0px;
    }

    100% {
        background-position: left 0px top 0px;
    }
}

@-webkit-keyframes sun3 {
    0% {
        background-position: left 0px top 0px;
    }

    50% {
        background-position: left -150px top 0px;
    }

    100% {
        background-position: left 0px top 0px;
    }
}

@keyframes sun3 {
    0% {
        background-position: left 0px top 0px;
    }

    50% {
        background-position: left -150px top 0px;
    }

    100% {
        background-position: left 0px top 0px;
    }
}

@-webkit-keyframes sun3 {
    0% {
        background-position: left 0px top 0px;
    }

    50% {
        background-position: left -150px top 0px;
    }

    100% {
        background-position: left 0px top 0px;
    }
}

@keyframes sun4 {
    0% {
        background-position: left 0px top 0px;
    }

    50% {
        background-position: left -181px top 0px;
    }

    100% {
        background-position: left 0px top 0px;
    }
}

@-webkit-keyframes drip {
    0% {
        transform: rotate(-28deg);
    }

    50% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(-28deg);
    }
}
@keyframes drip {
    0% {
        transform: rotate(-28deg);
    }

    50% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(-28deg);
    }
}
@-webkit-keyframes flower3 {
    0% {
        transform: scale(0);
    }

    50% {
        transform: scale(1);
    }

    100% {
        transform: scale(0);
    }
}
@keyframes flower3 {
    0% {
        transform: scale(0);
    }

    50% {
        transform: scale(1);
    }

    100% {
        transform: scale(0);
    }
}
@-webkit-keyframes shootingStar {
    0% {
        opacity: 0;
        transform: translate(80px, -50px) scale(0);
    }


    100% {
        opacity: 1;
        transform: translate(0, 0) scale(0);
    }
}
@keyframes shootingStar {
    0% {
        opacity:0;
        transform: translate(80px, -50px) scale(0);
    }


    100% {
        opacity:1;
        transform: translate(0, 0) scale(1);
    }
}


@-webkit-keyframes Planet {
    0%,100% {
        transform: rotate(5deg);
    }


    50% {
        transform: rotate(45deg);
    }
}

@keyframes Planet {
    0%,100% {
        transform: rotate(5deg);
    }


    50% {
        transform: rotate(45deg);
    }
}