.wow{animation-name:fadeInDown;-webkit-animation-name:fadeInDown;animation-duration:1.5s;-webkit-animation-duration:1.5s;animation-fill-mode:both;-webkit-animation-fill-mode:both;animation-duration:1s;-webkit-animation-duration:1s}
#articleInfo7{position:relative;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items: flex-start;flex-direction: row-reverse;justify-content: space-between;}
#articleInfo7 .photoBox{width:calc(60% + 220px);animation-name:fadeInLeft;-webkit-animation-name:fadeInLeft;position:relative}
#articleInfo7 .photoBox img{-webkit-transition:opacity 0.35s,-webkit-transform 0.35s;transition:opacity 0.35s,transform 0.35s;object-fit:cover}
#articleInfo7 .photoBox:hover img{-webkit-transform:scale(0.98);transform:scale(0.98)}
#articleInfo7 .info{margin-left:20%}
#articleInfo7 .info h3{position:relative;padding:40px 0;font-size:44px;left:-20%;color:#fff;text-shadow:1px 1px 7px #000000}
#articleInfo7 .info:hover h3{animation:animatedIcon 1s;-webkit-animation:animatedIcon 1s infinite linear;-moz-animation:animatedIcon 1s infinite linear;-ms-animation:animatedIcon 1s infinite linear;-o-animation:animatedIcon 1s infinite linear}
@keyframes animatedIcon{0%{padding:40px 0}
50%{padding:20px 0 60px}
100%{padding:40px 0}
}@-o-keyframes animatedIcon{0%{padding:40px 0}
50%{padding:20px 0 60px}
100%{padding:40px 0}
}@-webkit-keyframes animatedIcon{0%{padding:40px 0}
50%{padding:20px 0 60px}
100%{padding:40px 0}
}@-moz-keyframes animatedIcon{0%{padding:40px 0}
50%{padding:20px 0 60px}
100%{padding:40px 0}
}@-ms-keyframes animatedIcon{0%{padding:40px 0}
50%{padding:20px 0 60px}
100%{padding:40px 0}
}
#articleInfo7 .info p{animation-name:fadeInRight;-webkit-animation-name:fadeInRight;}
#articleInfo7 .info article{margin:30px 0 10px 20px;line-height:180%;animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
section .info .aboutArea{padding-right: 70px;position:relative;display:flex;flex-direction: row-reverse;}
section .Txt{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}
section .topBox h1{font-size:24px;font-weight:400}
section .topBox .enTextBox{margin-right:auto;line-height:160%;letter-spacing:3.5px;font-size: 18px;font-weight: 400;color: #49473e;-webkit-writing-mode:vertical-rl;-ms-writing-mode:tb-rl;writing-mode:vertical-rl;font-family:'Noto Serif TC',serif;padding-right: 20px;}

#aboutWrap section .bottomBox{}
#aboutWrap section .bottomBox .homeTitleBox{padding: 0 0 20px 0;}
#aboutWrap section .bottomBox .homeTitleBox h2{color: #49473e;font-weight: 400;font-size: 19px;}
#aboutWrap section .bottomBox p{padding-right:20px;line-height: 180%;margin-top:5px;padding-top:30px;position:relative;font-size: 16px;color: #79776c;}
#aboutWrap section .bottomBox p:before{content:"";width:20px;height:2px;background-color:#5f616a;position:absolute;top:0;left:0}
#aboutWrap section .bottomBox .btnBox{}
#aboutWrap section .bottomBox .btnBox{margin-top:40px;margin-left: auto;}
#aboutWrap section .bottomBox .btnBox a{position:relative;width:170px;padding:15px;display:inline-block;color:#262626;border-bottom:1px solid rgb(38 38 38 / 50%)}
#aboutWrap section .bottomBox .btnBox font{text-align:left;font-weight:500;text-transform:uppercase;letter-spacing:3px;color:#262626;transition:0.3s}
#aboutWrap section .bottomBox .btnBox a,#aboutWrap section .bottomBox .btnBox font{letter-spacing:2px;font-size:12px;position:relative}
#aboutWrap section .bottomBox .btnBox a:before{content:"";width:0;height:2px;background:#cfcfcf;display:block;position:absolute;bottom:3px;left:0;-webkit-transform:translate(0,5px);-ms-transform:translate(0,5px);transform:translate(0,5px);-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s}
#aboutWrap section .bottomBox .btnBox span{right:30px;position:absolute;width:80px;height:1px;background:#000;display:block;right:0;top:calc((100% - 1px) / 2);z-index:3;-webkit-transition-duration:.2s;transition-duration:.2s}
#aboutWrap section .bottomBox .btnBox:after{width:252px}
#aboutWrap section .bottomBox .btnBox span{position:absolute;width:40px;height:1px;background:#4f3c30;display:block;right:20px;top:calc((100% - 1px) / 2);z-index:3;-webkit-transition-duration:.2s;transition-duration:.2s}
#aboutWrap section .bottomBox .btnBox span:before{position:absolute;width:0;height:0;border-style:solid;border-width:0 16px 7px 0;border-color:transparent transparent #4f3c30 transparent;right:-1px;bottom:50%;content:""}
#aboutWrap section .bottomBox .btnBox a:hover font{color:#918078;letter-spacing:3px}
#aboutWrap section .bottomBox .btnBox a:hover:before{background:#918078;width:100%}

#aboutWrap section .bottomBox .btnBox .more_btn a {padding: 20px 35px;letter-spacing: 3px;text-transform: uppercase;font-size: 13px;left: 0;bottom: 0px;z-index: 3;background: var(--primary);position: relative;width: 120px;}
#aboutWrap section .bottomBox .btnBox .more_btn{position:relative;z-index:1;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;padding:12px 20px;letter-spacing:1px;text-align:center;flex-direction:row;color: #5f4f45;}
#aboutWrap section .bottomBox .btnBox .more_btn::after{background-image:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#fff)),-webkit-gradient(linear,left top,left bottom,from(#fff),to(#fff));background-image: linear-gradient(to bottom,#484545,#484545),linear-gradient(to bottom,#484545,#484545);}
#aboutWrap section .bottomBox .btnBox .more_btn:hover::after{-webkit-transform:rotate(90deg);transform:rotate(90deg);}
#aboutWrap section .bottomBox .btnBox .more_btn::after{content:"";-ms-flex-negative:0;flex-shrink:0;width:11px;height:11px;margin-left:auto;background-position:50%;background-size:1px 100%,100% 1px;background-repeat:no-repeat;transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;}


#aboutWrap section .parallaxImg{right:-468px;bottom:-80px;opacity:.2}

@media (max-width: 1440px) {
			#articleInfo7 .photoBox:before{
    width: 610px;
    height: 610px;
    right: -20px;
    top: 40px;
}

	}

@media (max-width: 1280px) {
	#articleInfo7 .photoBox img{
    /* width: 500px; */
    /* height: 500px; */
    margin: auto;
}
	#articleInfo7 .photoBox:before{
    width: 490px;
    height: 490px;
    right: 30px;
    top: 20px;
}
}

@media (min-width:1181px){

}
@media (max-width: 1180px) {

	#aboutWrap section .bottomBox{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-top: 20px;}
	#aboutWrap section .bottomBox p{padding-top:20px;padding-left:0;font-size:16px;padding-right: 0px;}
	#aboutWrap section .bottomBox .btnBox{margin-right:auto;bottom:10px;right:20px}
	#aboutWrap section .Txt{width:100%;padding-top:30px}
	#aboutWrap section .topBox h1,#articleInfo7 .photoBox:before{display:none}
	#articleInfo7 .titleBox{display:block;text-align:center;padding:10px 0;zoom:80%}
	#articleInfo7{position:relative;display: flex;align-items: flex-start;flex-direction: column-reverse;}
	#aboutWrap section #articleInfo7 .info{padding:0px;padding: 0px 0 20px;width: 100%;}
	section .info .aboutArea{padding-left:0;display: flex;flex-direction: column;padding-right: 0;}
	#articleInfo7 .photoBox{position:relative;padding: 50px 0%;width: 100%;margin:auto;text-align: center;}
	#articleInfo7 .info{position:relative;margin-top:-130px;margin-left:0;padding:50px;background:none}
	#articleInfo7 .info h3{left:0;text-align:right}
}
@media (min-width:769px) and (max-width:1180px){
	#aboutWrap section .Txt{width:50%;padding-left:20px}
	#articleInfo7 .titleBox{display: none;}
}
@media screen and (max-width: 768px) {
	#articleInfo7{
    /* display: flex; */
    /* flex-direction: column; */
    /* align-items: flex-start; */
}
		#aboutWrap section {position: relative;width: 80%;padding: 0px 0 20px 0;}

	#articleInfo7 .photoBox{
    width: 100%;
    padding: 40px 0 10px;
}
	#articleInfo7 .photoBox img{
    /* width: 320px; */
    /* height: 320px; */
}
}

@media screen and (max-width: 480px) {
	#articleInfo7 .info{margin-top:0;padding:50px 20px}
	#articleInfo7 .info h3{padding:20px 0;text-align:left}
	#articleInfo7 .info article{margin-left:0}
	@keyframes animatedIcon{0%{padding:20px 0}
	50%{padding:0 0 40px}
	100%{padding:20px 0}
	}@-o-keyframes animatedIcon{0%{padding:20px 0}
	50%{padding:0 0 40px}
	100%{padding:20px 0}
	}@-webkit-keyframes animatedIcon{0%{padding:20px 0}
	50%{padding:0 0 40px}
	100%{padding:20px 0}
	}@-moz-keyframes animatedIcon{0%{padding:20px 0}
	50%{padding:0 0 40px}
	100%{padding:20px 0}
	}@-ms-keyframes animatedIcon{0%{padding:20px 0}
	50%{padding:0 0 40px}
	100%{padding:20px 0}
	}
}