@charset "utf-8";
/* CSS Document */
.banner {position: relative; z-index: 2;}

.scroll_down {width: 200px; position: absolute; left: calc(50% - 100px); bottom: 16px; z-index: 99; color: #484c48;}
.scroll_down a {text-decoration:none!important; color: #484c48!important; letter-spacing: 0.8px; font-family: 'Noto Serif TC', serif; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.scroll_down a::after {content: ''; width: 14px; height: 8px; background: url("../images/arrow_a.png") no-repeat center / cover; display: block; margin-top: 13px;}

.share_btn {position: absolute; bottom: 51px; right: 22px; z-index: 99; display: flex; flex-direction: column; align-items: center; width: 55px; font-family: 'Noto Serif TC', serif;}
.share_btn > div.txt {color: #383b37; letter-spacing: 1.3px; line-height: 25px; writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; *display: inline; *writing-mode: tb-rl;}
.share_btn > ul li {margin-top: 19px; line-height: 0;}
#share_btn {position: absolute; top: -80px; left: 0; z-index: -11;}
.share_btn_change {top: 80px!important; bottom: auto!important; position: fixed!important; text-shadow: -1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff;}
.share_btn_new {display: flex; flex-flow: column; padding: 10px 0 0 0;}
.share_btn_new > div {text-align: center; margin-top: 10px;}
.share_btn_new > div > .img {line-height: 0; font-size: 0; width: 44px; height: 44px; border-radius: 44px; padding: 2px 0 0 0; display: flex; flex-flow: wrap; justify-content: center; align-items: center; transform: scale(1, 1); transition: all 0.5s ease 0s;}
.share_btn_new > div > .img:hover {transform: scale(0.9, 0.9); transition: all 0.5s ease 0s;}
.share_btn_new > div.shop > .img {background: #d5b55c;}
.share_btn_new > div.line > .img {background: #44cb28;}


.ind_A {position: relative; z-index: 1; padding: 4.047% 0 52px 0;}
.paint_01 {position: absolute; top: 0; right: -47px; z-index: -1;}
.paint_02 {position: absolute; top: 682px; left: -40px; z-index: -2;}
.ind_AS {font-family:'Microsoft JhengHei', sans-serif; text-align: center; letter-spacing: 0.9px;}

.ind_B {position: relative; z-index: 1; padding: 2.628% 0;}
.ind_BA {display: flex; flex-wrap: wrap; align-items: center; padding: 11.25% 0; position: relative; z-index: 1;}
.ind_BA > div:nth-child(1) {width: calc(100% - 400px); line-height: 0; position: relative; z-index: 1;}
.ind_BA > div:nth-child(1) img {position: absolute; right: 93px; top: calc(50% - 345px);}
.ind_BA > div:nth-child(2) {width: 400px; padding: 0 10px 0 0; color: #646664; font-family:'Microsoft JhengHei', sans-serif; position: relative; z-index: 10;}
.ind_BA > div:nth-child(2) > p {padding: 0 0 0 1px; margin-bottom: 36px;}
.ind_BA > div:nth-child(2) > .btn_a {margin: 0 0 0 4px;}
.paint_03 {position: absolute; top: -18.24%; right: 5px; z-index: -1;}
.ind_BB {display: flex; flex-wrap: wrap; align-items: center; padding: 7.97% 0; position: relative; z-index: 1;}
.ind_BB > div:nth-child(1) {width: 405px; padding: 0 0 0 29px; color: #646664; font-family:'Microsoft JhengHei', sans-serif;}
.ind_BB > div:nth-child(1) > p {padding: 0 0 0 1px; margin-bottom: 33px;}
.ind_BB > div:nth-child(1) > .btn_a {margin: 0 0 0 4px;}
.ind_BB > div:nth-child(2) {width: calc(100% - 405px); line-height: 0; position: relative; z-index: 1;}
.ind_BB > div:nth-child(2) img {position: absolute; left: 62px; top: calc(50% - 274px);}
.paint_04 {position: absolute; bottom: -25px; left: 192px; z-index: -1;}

.ind_C {position: relative; z-index: 1; padding: 4.94% 0 96px 0;}
.ind_C::before {content: ''; height: 59.443%; width: 100%; background: #e2eae4; position: absolute; bottom: 0; left: 0; z-index: -10;}
.ind_C > div.frame_1280 {position: relative; z-index: 10;}
.ind_CL {display: flex; flex-wrap: wrap; padding: 5.547% 0 3.047% 0;}
.ind_CL > div {width: 31.015625%; margin: 0 3.4765625% 20px 0; max-width: 397px; font-weight: 200; letter-spacing: 0.2px; line-height: 1.5; position: relative; z-index: 1; border: 1px solid #e0e0e0; background: #fff; transition: all 0.5s ease 0s;}
.ind_CL > div:nth-child(3n+3) {margin: 0 0 20px 0;}
.ind_CL > div > div.photo {overflow: hidden; height: 0; padding-bottom: 65.823%; line-height: 0; position: relative; z-index: 1; transition: all 0.5s ease 0s;}
.ind_CL > div > div.photo img {transform: scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.ind_CL > div > div.text {font-family:'Microsoft JhengHei', sans-serif; color: #7c7e7c; letter-spacing: 0.5px; padding: 29px 20px 58px 26px;}
.ind_CL > div > div.text > h3 {font-weight: 300; color: #383b37; letter-spacing: 0; font-family: 'Noto Serif TC', serif; padding: 0 20px 0 0; margin-bottom: 35px; transition: all 0.5s ease 0s; position: relative; z-index: 1;}
.ind_CL > div > div.text > h3::after {content: ''; background: #91ca83; width: 33px; height: 2px; position: absolute; top: calc(100% + 18px); left: 0; z-index: -1; transition: all 0.5s ease 0s;}
.ind_CL > div > div.text > p {line-height: 2; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;}
.ind_CL > div:hover {border: 1px solid #cfaa45;}
.ind_CL > div:hover > div.photo img {transform: scale(1.1, 1.1);}
.ind_CL > div:hover > div.text > h3 {color: #cfaa45;}
.ind_CL > div:hover > div.text > h3::after {width: 100%;}
.ind_C .btn_a {margin: auto;}
.paint_05 {line-height: 0; position: absolute; bottom: -244px; right: 0px; z-index: 1;}

.ind_D {position: relative; z-index: 1; padding: 64px 0 4.099% 0;}
.ind_D .btn_a {margin: auto;}
.ind_DL {display: flex; flex-wrap: wrap; padding: 3.516% 0 4.22% 0;}
.ind_DL > div {width: 50%; display: flex; flex-wrap: wrap; align-items: center; padding: 18px 32px 0 6px; margin: 0 0 30px 0; position: relative; z-index: 1;}
.ind_DL > div::after {content: ''; width: 1px; height: 100%; background: #e9e9e9; position: absolute; top: 0; right: 0; z-index: -1;}
.ind_DL > div:nth-child(2n+2)::after {content: none;}
.ind_DL > div:nth-child(2n+2) {padding: 18px 0 0 38px;}
.ind_DL > div > div.photo {width: 47.675%; position: relative; z-index: 1;}
.ind_DL > div > div.photo::before {content: ''; border: 1px solid #e5e5e5; width: calc(100% + 2.5px); height: calc(100% + 2.5px); position: absolute; left: -21px; top: -18px; z-index: 10; transition: all 0.5s ease 0s;}
.ind_DL > div:hover > div.photo::before {top: -7px!important; left: -7px!important; width: calc(100% + 12.5px); height: calc(100% + 12.5px); border: 1px solid #cfaa45;}
.ind_DL > div > div.photo img {transform: scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.ind_DL > div:hover > div.photo img {transform: scale(1.1, 1.1); transition: all 0.5s ease 0s;}
.ind_DL > div > div.photo > div {position: relative; z-index: 1; height: 0; overflow: hidden; padding-bottom: 100%;}
.ind_DL > div > div.text {width: 52.325%; padding: 11px 0 0 48px; color: #7c7e7c; line-height: 1.6;}
.ind_DL > div > div.text > div {color: #7c7e7c; font-family: 'Noto Serif TC', serif; letter-spacing: 0.9px; line-height: 1; position: relative; z-index: 1; padding: 0 0 0 24px; margin: 0 0 13.11% 0;}
.ind_DL > div > div.text > div > span {font-weight: 300; letter-spacing: 0.5px; position: absolute; left: 0; top: 62%; -moz-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; *display: inline; *writing-mode: tb-rl;}
.ind_DL > div > div.text > h3 {color: #383b37; font-family: 'Noto Serif TC', serif; line-height: 1.5; padding: 0 0 0 2px; margin: 0 0 8.62% 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; transition: all 0.5s ease 0s;}
.ind_DL > div:hover > div.text > h3 {color: #cfaa45; transition: all 0.5s ease 0s;}
.ind_DL > div > div.text > p {padding: 0 7px 0 0; color: #7c7e7c; line-height: 1.6; font-family:'Microsoft JhengHei', sans-serif; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;}
.ind_DL > div:nth-child(2n+2) > div.photo::before {top: 17px; left: 16px;}
.paint_06 {position: absolute; top: 23px; right: 363px; z-index: -1;}
.paint_07 {position: absolute; bottom: 21px; left: 27.694%; z-index: -2;}

.hotNews {position: fixed;right: calc(100% - 31px);top: 15%;z-index: 999;height: auto;width: 100%;max-width: 490px;display: flex;flex-wrap: wrap;align-items: center;justify-content: flex-start;transition: all 0.5s ease 0s;}
.hotNewsC{width: calc(100% - 35px);max-height: 75vh; overflow: auto; border-right: 15px solid #7CA571;background-color: #fff;padding: 20px 20px 60px 20px;box-shadow: 3px 3px 10px rgb(0 0 0 / 50%);font-family: 'Microsoft JhengHei', sans-serif;}
.hotNewsC > p:nth-child(2){font-size: 26px;background: #CFAA45;color: #fff;padding: 6px 4px;margin: 20px 0 0 0;}
.hotNewsS {position: absolute;bottom: 15px;left: 20px;width: calc(100% - 95px);z-index: 10;display: flex;flex-wrap: wrap;align-items: center;}
.social-icons{margin: 0px;padding: 0;display: flex;flex-wrap: wrap;justify-content: flex-start;align-items: flex-start;color: #666;}
.social-icons li {display: flex;margin: 10px 15px 0px 0px;padding: 0;width: auto;}
.hotNewsB {width: 35px;height: 90px;font-size: 14px;letter-spacing: 1px;writing-mode: tb-rl;-webkit-writing-mode: vertical-rl;writing-mode: vertical-rl;*display: inline;*writing-mode: tb-rl;color: #fff;background-color: #7CA571;display: flex;flex-flow: row-reverse;justify-content: center;align-items: center;text-align: center;-moz-transform: rotate(0deg);-webkit-transform: rotate(0deg);-o-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg);cursor: pointer;border-radius: 0 8px 8px 0;/*border-bottom-left-radius: 8px;border-top-left-radius: 8px;*/}
.hotNewsB::after {content: '';height: 0;width: 0;border-color: transparent transparent #fff transparent;border-style: solid solid solid solid;border-width: 6px 4px;margin: 3px -6px 4px 0;-moz-transform: rotate(90deg);-webkit-transform: rotate(90deg);
-o-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg);}
.hotNews-back {right: calc(100% - 490px);transition: all 0.5s ease 0s;}
.hotNews-back .hotNewsB::after {border-color: #fff transparent transparent transparent; margin: 3px 0 4px -6px;}

/*@media only screen and (max-width:485px){
    .hotNews-back {left: -435px;transition: all 0.5s ease 0s;}
}
@media only screen and (max-width:450px){
    .hotNews-back {left: -415px;transition: all 0.5s ease 0s;}
}
@media only screen and (max-width:430px){
    .hotNews-back {left: -380px;transition: all 0.5s ease 0s;}
}
@media only screen and (max-width:405px){
    .hotNews-back {left: -330px;transition: all 0.5s ease 0s;}
}*/