.wow{animation:fadeIn 2.5s both;-webkit-animation:fadeIn 2.5s both;animation-duration:2s;-webkit-animation-duration:2s}
.delay1{animation-delay:0.5s;-webkit-animation-delay:0.5s}
.delay2{animation-delay:1.0s;-webkit-animation-delay:1.0s}
.delay3{animation-delay:1.5s;-webkit-animation-delay:1.5s}
#articleInfo13 .topBox{overflow:hidden;position:relative;padding:0px 0;}
#articleInfo13 .topBox .articleInfo13bg{width:100%;height:100%;margin-top:90px}
#articleInfo13 .topBox .articleInfo13bg img{width:100%;height:460px;object-fit:cover;object-position:50% 40%}
#articleInfo13 .topBox .img2 img{height:auto}
#articleInfo13 .topBox p,#articleInfo13 .topBox h3{position:relative;text-align:center;font-size:20px;color:#bdad84;z-index:2;animation-name:fadeInDown;-webkit-animation-name:fadeInDown}
#articleInfo13 .topBox p img{width:50px;height:50px;margin-bottom:10px}
#articleInfo13 .topBox p{font-size:16px;color:#474747;font-family:'Noto Serif TC',serif;letter-spacing:1.5px;line-height:230%;width:40%;margin:auto}
#articleInfo13 .topBox p i{width:80px;height:80px;display:inline-block;border:2px #fff solid;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;font-size:40px;line-height:80px}
#articleInfo13 .topBox h3{margin:10px 0;font-size:22px;font-family:'Noto Serif TC',serif;color:#bdad84}
#articleInfo13 .service2Area .service2Item .item{display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;/* position: absolute; */width: 160px;/* right: 50%; *//* bottom: -10px; */align-content: center;}
#articleInfo13 .service2Area .service2Item:nth-child(2n) .item{
    /* right: auto; */
    /* left: 240px; */
    /* top: 50px; */
}

#articleInfo13 .item .row{padding:10px 0;animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#articleInfo13 .item .left article{padding:30px 0 20px 20px;font-size:16px;line-height:200%;text-align:center;margin-bottom:0;display:none}
#articleInfo13 .item .right{padding: 80px 20px 0;animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#articleInfo13 .item .right article{font-size:15px;letter-spacing:0.05em;font-weight:400;line-height:230%;text-align:center;color:#6D6D6D;margin-bottom:0}
.contactArea .btn img,.contactArea .infoBox span::after,.serviceArea .serviceItem .item,.serviceArea .serviceItem,.catalogArea .portfolioBox .btn a,.catalogArea .portfolioBox .imh_detail a::after,.catalogArea .portfolioBox .imh_detail a::before{-webkit-transition:all 0.5s;transition:all 0.5s}
.serviceArea .wrap{position:relative;max-width:100%;margin:5vh;padding: 70px 0 0;}
.serviceArea .serviceList{position:relative;z-index:10}
.serviceArea .box{max-width:1400px;margin:0 auto}
.serviceArea .serviceList{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}
.serviceArea .titleBox{text-align:left;}
.serviceArea .titleBox .titleEn{font-size:16px;letter-spacing:2px}
.serviceArea .titleBox .titleTw{font-size:25px;margin-bottom:40px}
.serviceArea .btn a{display:inline-block;text-align:center;background:rgba(0,0,0,0.3137254902);border:1px solid #bdad84;color:#bdad84;padding:20px 60px;font-size:13px;font-weight:300;letter-spacing:2px}
.serviceArea .btn a:hover{background:#000}
.serviceArea .serviceItem:nth-child(1),.serviceArea .serviceItem:nth-child(2){
    width: calc(( 100% / 2 ) - 95px);
}
.serviceArea .serviceItem{width: calc(( 100% / 3 ) - 90px);color:#bdad84;border-bottom:1px solid #bdad84;border-right:1px solid #bdad84;padding:50px 40px;min-height:190px;animation-name: fadeInDown;-webkit-animation-name: fadeInDown;transition: all linear 0.3s;}
.serviceArea .serviceItem:hover{background:rgba(255,255,255,0.1882352941)}
.serviceArea .serviceItem:hover:first-child{background:none}
.serviceArea .serviceItem:hover .item{-webkit-transform:scale(1.1);transform:scale(1.1)}
.serviceArea .serviceItem .top{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-bottom:20px}
.serviceArea .serviceItem .top .icon{width:50px;height:50px}
.serviceArea .serviceItem .top .num{font-size:30px;font-weight:400;color:#bdad84;opacity:0.8}
.serviceArea .serviceItem .textBox .textTitle{font-size:22px;font-weight:300;letter-spacing:2.5px;padding-bottom:10px}
.serviceArea .serviceItem .textBox .Txt{font-size:16px;letter-spacing:1px;font-weight:300;display: none;}
.serviceArea .serviceItem .textBox .Txt a{color:#888}


/* serviceArea*/
#articleInfo20,.service2Area, .processArea{padding: 60px 0 110px;}
.serviceArea .titleBox{display: flex;flex-direction: column;align-items: center;/* padding: 2vw 0 5vw; */}
.service2Area .titleBox .titleTw, .processArea .titleBox .titleTw, #articleInfo20 .bottomBox h3, #articleInfo20 .bottomBox h3{letter-spacing: 9.5px;font-family: 'Noto Serif TC', serif;color: #bdad84;text-align: center;font-size: 25px;margin-bottom: 60px;}
.service2Area .titleBox .exp{padding-top:20px;padding-bottom: 40px;display: inline-block;font-size: 17px;line-height: 180%;font-weight: 400;color: #474747;font-family: 'Noto Serif TC', serif;text-align: center;width: 100%;}
.service2List{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;width:-webkit-calc(100% + 138px);width:-moz-calc(100% + 138px);width:calc(100% + 138px);position:relative;left:-68px;flex-direction: column;align-items: center;}
.service2List .service2Item  {height: 220px;position:relative;animation-name: fadeInDown;-webkit-animation-name: fadeInDown;transition: all linear 0.3s;display: flex;align-content: center;align-items: center;flex-direction: row-reverse;}
.service2List .service2Item:before{content:"";display:block;width:1px;height:100%;background-color: rgb(0 0 0 / 7%);position:absolute;top:0;left:0;bottom:auto;right:auto;display: none;}

.service2List .service2Item .nextLine {
  position: absolute;
  left: 48%;
  bottom: 60%;
  -webkit-transform: translateY(-50%);
  transform: translatex(-100%);
  width: 100px;
  height: 130px;
  /* border-left: 1px solid rgb(0 0 0 / 7%); */
  border-bottom: 1px solid rgb(0 0 0 / 7%);
  pointer-events: none;
  display: none;
}

.service2List .service2Item .nextLine::before {
  content: "";
  position: absolute;
  bottom: -4px;
  left: -6px;
  right: auto;
  display: block;
  width: 7px;
  height: 7px;
  background: rgb(0 0 0 / 7%);
  border-radius: 100%;
}
.service2List .service2Item:nth-child(even) .nextLine::before {
    right: -4px;
    left: 100px;
}
.service2List .service2Item:not(:first-child) .nextLine {
  /* height: 194px; */
  /* width: 267px; */
  border-left: none;
  /* border-right: 1px solid rgba(0, 0, 0, 0.36); */
}


#articleInfo13 .service2Area .service2Item:nth-child(2n) .nextLine {
  height: 130px;
  width: 100px;
  -webkit-transform: translateY(0%);
  transform: translateY(0%);
}





.service2List .item{display:flex;-webkit-box-align:center;align-items:center;flex-wrap:wrap;padding: 0 48px;}
.service2List .Img{width:50px}
.service2List .Img img{display:block;width:100%}
.service2List .title{color: #bdad84;font-size: 27px;font-weight:500;letter-spacing:3.5px;line-height: 2.25;width: calc(100% - 90px);padding-left: 20px;display: flex;align-items: baseline;}
.service2List .title span{    font-family: 'Cormorant',serif;}
.service2List .exp{color:#6a6a6a;font-weight: 300;padding-top:10px;width:100%;letter-spacing: 1px;}

.service2List .Img {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: relative;
    width: 60px;
}

.service2List .Img .titleNum {
  position: absolute;
  top: -30px;
  left: -75px;
  font-family: "Gloock", serif;
  font-size: 20px;
  color: #897c6b;
}

.service2List .Img .titleNum span {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(30deg);
  transform: translate(-50%, -50%) rotate(30deg);
  display: block;
  width: 110px;
  height: 110px;
  opacity: 1;
  -webkit-transition-delay: 1.5s;
  transition-delay: 1.5s;
}
.service2List .Img .titleNum span b{
    display: none;
}
.service2List .Img .titleNum span::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border: 1px solid #d7ceb7;
  border-right: 1px solid transparent;
  border-radius: 100%;
}








.processArea{
    padding: 140px 0 140px;
}
.processArea .workframe{
    display: flex;
    align-items: center;
}
.processArea .titleBox{
    width: 30%;
}
.processArea .processList{
    margin: auto;
    /* display: flex; */
    /* flex-wrap: wrap; */
}
.processArea .processList .processItem{padding: 0 20px;animation-name: fadeInDown;-webkit-animation-name: fadeInDown;transition: all linear 0.3s;}
.processArea .processItem .step {
  border-radius: 50%;
  border: 1px solid rgb(216 216 216 / 65%);
  background-color: #ffffff;
  font-family: "MyriadPro";
  width: 80px;
  height: 80px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  position: relative;
}
.processArea .processItem .item{
    overflow: hidden;
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    padding-bottom: 40px;
    justify-content: center;
}
.processArea .processItem .step::after {
  content: "";
  background-color: #bcbcbc;
  width: 1px;
  height: 85px;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  bottom: 0;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  z-index: -1;
  display: none;
}

.processArea .processItem .step span:first-child {
  color: #bdad84;
  font-size: 1.8rem;
  line-height: 1;
}

.processArea .processItem .step span:last-child {
  color: #888;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05rem;
}
.processArea .processItem .step::after {
  content: "";
  background-color: #bcbcbc;
  width: 1px;
  height: 84px;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  bottom: -85px;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  z-index: -1;
  display: block;
}
.processArea .processItem .text{width: 65%;margin-left: 20px;}

#articleInfo20 .topBox{
    width: 80%;
    margin: auto;
}
#articleInfo20 .topBox h3{
    text-align: inherit;
}
#articleInfo20 ul{margin-bottom:20px;display:flex;flex-wrap:wrap;justify-content: center;}
#articleInfo20 ul li{padding:45px;width: calc((100%/3) - 120px);margin:10px 0;background:#fff;animation-name:fadeInDown;-webkit-animation-name:fadeInDown;transition:all linear 0.3s;position: relative;margin: 10px;}
#articleInfo20 ul li:after{content:'01';-webkit-text-stroke: 1px #d7ceb747;color: #f6f6f6;font-family: 'Cormorant',serif;font-size: 100px;position: absolute;right: 35px;line-height: 80%;top: 15px;}
#articleInfo20 ul li:nth-child(2):after{content:'02';}
#articleInfo20 ul li:nth-child(3):after{content:'03';}
#articleInfo20 ul li:nth-child(4):after{content:'04';}
#articleInfo20 ul li:nth-child(5):after{content:'05';}
#articleInfo20 ul li:nth-child(6):after{content:'06';}
#articleInfo20 ul li:nth-child(7):after{content:'07';}
#articleInfo20 ul li:nth-child(8):after{content:'08';}
#articleInfo20 ul li:nth-child(9):after{content:'09';}
#articleInfo20 ul li .info{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;margin-bottom:20px;border-bottom:1px solid #ddd;padding-bottom:20px}
#articleInfo20 ul li .info .title{width:calc(100% - 90px)}
#articleInfo20 ul li h3{font-size:20px;color:#c75a22}
#articleInfo20 ul li h5{font-size:16px;color:#bebebc;font-family:'Cormorant Garamond',serif;text-transform: capitalize;}
#articleInfo20 ul li article{font-size:15px;text-align:justify}
#articleInfo20 ul li p.photo{width:60px}
#articleInfo20 .bottomBox p{margin:10px 0 20px;text-align:center;font-size:18px;animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#articleInfo20 .bottomBox article{animation-name:fadeInUp;-webkit-animation-name:fadeInUp}


@media (max-width:1440px){
	.service2List{width:100%;left:0;display: flex;justify-content: center;}
	.service2List .item{padding:0 20px}
	.service2List .title{font-size:30px}
}
@media screen and (max-width:1366px){
	#articleInfo13 .topBox .img2 img{height:100%}
}
@media screen and (max-width:1280px){
	#articleInfo13 .topBox p{width:70%}
}


@media screen and (max-width: 1180px) {
	.service2Area .titleBox .exp{padding-top:12px}
	.service2List .service2Item{/* width:50%; *//* margin:20px 0; */}
	.service2List .title{font-size:26px;font-weight:500;letter-spacing:2px}
	.service2Area .titleBox{
    display: flex;
    flex-direction: column;
    align-items: center;
}
	.service2Area .titleBox .titleTw{margin-top: 0px;font-size: 27px;letter-spacing: 5.5px;}
	#articleInfo20 ul li{
    width: calc((100%/2) - 120px);
}
}
@media (max-width:1180px) and (min-width:769px){
	.service2List .service2Item:nth-child(odd):before{/* opacity:0; */}
}
@media (max-width:1024px){
	.service2Area .wrap{padding:60px 0px;margin:7vh 0}
	.service2Area .service2Item{/* width:calc(( 100% / 2 ) - 90px); */}
	.processArea .workframe{
    display: flex;
    align-items: center;
    flex-direction: column;
}
	.processArea .titleBox,.processArea .processList {
    width: 100%;
}
	.service2Area .titleBox .titleTw, .processArea .titleBox .titleTw, #articleInfo20 .bottomBox h3{
    margin-bottom: 40px;
    margin-top: 20px;
}
	#articleInfo20 ul li:after{font-size: 60px;right: 10px;top: unset;bottom: 10px;}
	#articleInfo20, .service2Area, .processArea {
    padding: 30px 0 30px;
}
}

@media screen and (max-width:768px){
	#articleInfo13 .topBox{padding:0px 0}
	#articleInfo13 .topBox p{padding:5px 0px;width:93%;font-size:15px;line-height:220%}
	#articleInfo13 .topBox .articleInfo13bg{margin:40px 0}
	#articleInfo13 .topBox p i{width:60px;height:60px;font-size:30px;line-height:60px}
	#articleInfo13 .item .row,#articleInfo13 .item .right{float:none;width:100%}
	#articleInfo13 .item .row{padding:0px 0}
	#articleInfo13 .item .left article{padding:30px 20px;text-align:center}
	#articleInfo13 .item .right{padding:0px 0}
	#articleInfo13 .item .right article{margin:0 0px;font-size:15px}
	.service2Area .titleBox{margin-bottom: 0px;}
	.service2Area .titleBox{padding-bottom:0}
	.service2List .service2Item{/* width:100%; *//* margin:0; *//* padding:25px 0; */}
	.service2List .service2Item:before{/* width:100%; *//* height:1px; */}
	.service2List .service2Item:first-child:before{/* opacity:0; */}
	.service2List .item{padding:0}
	#articleInfo20 .buttom a{width: calc((100% / 3) + 1px);}
	#articleInfo20 ul li{width: calc((100%/2) - 15px);}
.serviceArea .serviceItem{
    width: calc(( 100% / 2 ) - 95px);
}
	
	#articleInfo13 .service2Area .service2Item .item{
    width: 171px;
    right: 20px;
    bottom: 10px;
}
	.service2List .service2Item .nextLine,#articleInfo13 .service2Area .service2Item:nth-child(2n) .nextLine{
    width: 20px;
}
	.service2List .service2Item:nth-child(even) .nextLine::before {
    right: -4px;
    left: 20px;
}
	#articleInfo13 .service2Area .service2Item:nth-child(2n) .item{
    left: 120px;
    top: 20px;
}
	.service2List .Img .titleNum span{
    width: 60px;
    height: 60px;
}
	.service2List .Img{
    width: 40px;
}
	.service2List .Img .titleNum{
    left: -35px;
    top: -30px;
}
}
@media screen and (max-width: 680px) {
	.service2Area{padding: 20px 0 0px;}
	.service2List .title{font-size:20px;font-weight:400;letter-spacing:1px}
	#articleInfo20 ul li:first-child, #articleInfo20 ul li{margin-bottom:10px;width:calc(100% - 55px)}


}
@media (max-width:540px){.
	.service2Area .service2Item{width:100%;border-right:none;padding:30px 40px;min-height:240px}
	.service2Area .wrap{padding:20px;margin:2vh 0}
	.service2Area .service2Item{/* width: calc(( 100% / 1 ) - 90px); *//* border-right: 0px solid #bdad84; */height: 150px;}
	#articleInfo20 ul li:after{position: relative;text-align: end;display: block;right: 0;bottom: 0;}
	#articleInfo20 .buttom{display:flex;flex-direction: column;}
	#articleInfo20 .buttom a{text-align: center;margin: 5px 0;width: 100%;padding: 0;}
	#articleInfo20 ul li h3{line-height: 120%;}
	#articleInfo20 ul li h5{line-height: 120%;margin-top: 5px;}
	#articleInfo20 ul li:first-child, #articleInfo20 ul li{width: 100%;padding: 35px;}
.serviceArea .wrap{
    padding: 0px 0 0;
}
.serviceArea .serviceItem,.serviceArea .serviceItem:nth-child(1), .serviceArea .serviceItem:nth-child(2){
    width: calc(( 100% / 1 ) - 90px);
    border-right: 0px solid #bdad84;
}

#articleInfo13 .service2Area .service2Item .item{
    width: 160px;
    right: 10px;
    bottom: 0;
}
#articleInfo13 .service2Area .service2Item:nth-child(2n) .item{
    left: 40px;
    top: 20px;
}
}
@media screen and (max-width: 400px) {	
	.service2List .title{padding-left:10px}

}