.index-info-border-left1,
.index-info-border-right1,
.index-info-border-left2,
.index-info-border-right2{
	transform: scale(1,0);

}
.index-info-border-top,
.index-info-border-bottom,
.index-info-title-line{
	transform: scale(0,1);
}

.index-info-title1,
.index-info-title2{
	opacity: 0;
}



.index-info-border-top{
	transform-origin: left;
}
.index-info-border-right1{
	transform-origin: right;
}
.index-info-border-left1{
	transform-origin: bottom;
}
.index-info-border-left2,
.index-info-border-right2,
.index-info-title-line{
	transform-origin: top;
}
.index-info-border-bottom{
	transform-origin: right;
}
.index-info-border-left2{
	transform-origin: bottom;
}
.index-info-box.active .index-info-border-left1,
#about .index-info-border-left1{
	animation: line2 .3s linear 0s 1 forwards;
}
.index-info-box.active .index-info-border-top,
#about .index-info-border-top{
	animation: line 1s linear .3s 1 forwards;
}
.index-info-box.active .index-info-border-right1
{
	animation: line .3s linear 1.3s 1 forwards;
}
#about .index-info-border-right1{
	animation: line2 .3s linear 1.3s 1 forwards;
}
.index-info-box.active .index-info-border-right2,
#about .index-info-border-right2{
	animation: line2 .3s linear 1.6s 1 forwards;
}
.index-info-box.active .index-info-border-bottom,
#about .index-info-border-bottom{
	animation: line  1s linear 1.9s 1 forwards;
}
.index-info-box.active .index-info-border-left2,
#about .index-info-border-left2{
	animation: line2 .3s linear 2.9s 1 forwards;
}

.index-info-box.active .index-info-title-line,
#about .index-info-title-line{
	animation: line .5s linear 0s 1 forwards;
}
.index-info-box.active .index-info-title1{
	animation: fadeInRight .8s linear .2s 1 forwards;
}

.index-info-box.active .index-info-title2{
	animation: fadeInRight .8s linear .4s 1 forwards;
}


.works-box .index-works-list-box{
	opacity: 1;
}
.works-class-title{
	animation: fade .8s linear 0s 1 both;
}
.works-class-list-box{
	animation: fadeInRight .8s linear 0s 1 both;
}
.works-class-border-left{
	transform-origin: top;
	animation: line2 .3s  linear 0s 1 both;
}
.works-class-border-bottom{
	transform-origin: left;
	animation: line .8s linear .3s 1 both;
}
.works-class-border-right{
	transform-origin: bottom;
	animation: line2 .3s  linear 1.1s 1 both;
}
.works-class-border-box .works-class-border-left{
	animation: line2 .3s  linear 1s 1 both;
}
.works-class-border-box .works-class-border-bottom{
	transform-origin: left;
	animation: line .8s linear 1.3s 1 both;
}
.works-class-border-box .works-class-border-right{
	transform-origin: bottom;
	animation: line2 .3s  linear 2.1s 1 both;
}
.works-page-img-box{
	animation: fade .8s linear 0s 1 both;
}
.works-page-info-box{
	animation: fade .8s ease 0s 1 both;
}
.works-page-info-line{
	transform-origin: left;
	animation: line .8s linear .3s 1 both;
}
.works-page-info-title2{
	animation: fade .8s ease .5s 1 both;
}
.works-page-more-box{
	animation: fadeInUp .8s linear .5s 1 both;
}

.about-info-left-box{
	animation: fadeInUp .8s linear 0s 1 both;
}
.about-info-img-box{
	animation: fadeInRight .8s linear 0s 1 both;
}
.about-info-img-box2{
	animation: fadeInLeft .8s linear 0s 1 both;
}


#works-info .index-works-list:nth-child(1) .production-list-title,
.index-info-box.active .index-works-list:nth-child(1) .production-list-title{
	animation: index-works-list .5s ease 0s 1 both;
}
#works-info .index-works-list:nth-child(2) .production-list-title,
.index-info-box.active .index-works-list:nth-child(2) .production-list-title{
	animation: index-works-list .5s ease .1s 1 both;
}
#works-info .index-works-list:nth-child(3) .production-list-title,
.index-info-box.active .index-works-list:nth-child(3) .production-list-title{
	animation: index-works-list .5s ease .2s 1 both;
}
#works-info .index-works-list:nth-child(4) .production-list-title,
.index-info-box.active .index-works-list:nth-child(4) .production-list-title{
	animation: index-works-list .5s ease .3s 1 both;
}
#works-info .index-works-list:nth-child(5) .production-list-title,
.index-info-box.active .index-works-list:nth-child(5) .production-list-title{
	animation: index-works-list .5s ease .4s 1 both;
}
#works-info .index-works-list:nth-child(6) .production-list-title,
.index-info-box.active .index-works-list:nth-child(6) .production-list-title{
	animation: index-works-list .5s ease .5s 1 both;
}
#works-info .index-works-list:nth-child(7) .production-list-title,
.index-info-box.active .index-works-list:nth-child(7) .production-list-title{ 
	animation: index-works-list .5s ease .6s 1 both;
}
#works-info .index-works-list:nth-child(8) .production-list-title,
.index-info-box.active .index-works-list:nth-child(8) .production-list-title{
	animation: index-works-list .5s ease .7s 1 both;
}
#works-info .index-works-list:nth-child(9) .production-list-title,
.index-info-box.active .index-works-list:nth-child(9) .production-list-title{
	animation: index-works-list .5s ease .8s 1 both;
}
#works-info .index-works-list:nth-child(10) .production-list-title,
.index-info-box.active .index-works-list:nth-child(10) .production-list-title{
	animation: index-works-list .5s ease .9s 1 both;
}
#works-info .index-works-list:nth-child(11) .production-list-title,
.index-info-box.active .index-works-list:nth-child(11) .production-list-title{
	animation: index-works-list .5s ease 1s 1 both;
}
#works-info .index-works-list:nth-child(12) .production-list-title,
.index-info-box.active .index-works-list:nth-child(12) .production-list-title{
	animation: index-works-list .5s ease 1.1s 1 both;
}
#works-info .index-works-list:nth-child(13) .production-list-title,
.index-info-box.active .index-works-list:nth-child(13) .production-list-title{ 
	animation: index-works-list .5s ease 1.2s 1 both;
}
#works-info .index-works-list:nth-child(14) .production-list-title,
.index-info-box.active .index-works-list:nth-child(14) .production-list-title{
	animation: index-works-list .5s ease 1.3s 1 both;
}

#works-info .index-works-list:nth-child(15) .production-list-title,
.index-info-box.active .index-works-list:nth-child(15) .production-list-title{
	animation: index-works-list .5s ease 1.4s 1 both;
}
#works-info .index-works-list:nth-child(16) .production-list-title,
.index-info-box.active .index-works-list:nth-child(16) .production-list-title{
	animation: index-works-list .5s ease 1.5s 1 both;
}
#works-info .index-works-list:nth-child(17) .production-list-title,
.index-info-box.active .index-works-list:nth-child(17) .production-list-title{
	animation: index-works-list .5s ease 1.6s 1 both;
}
#works-info .index-works-list:nth-child(18) .production-list-title,
.index-info-box.active .index-works-list:nth-child(18) .production-list-title{
	animation: index-works-list .5s ease 1.7s 1 both;
}
#works-info .index-works-list:nth-child(19) .production-list-title,
.index-info-box.active .index-works-list:nth-child(19) .production-list-title{
	animation: index-works-list .5s ease 1.8s 1 both;
}
#works-info .index-works-list:nth-child(20) .production-list-title,
.index-info-box.active .index-works-list:nth-child(20) .production-list-title{
	animation: index-works-list .5s ease 1.9s 1 both;
}
#works-info .index-works-list:nth-child(21) .production-list-title,
.index-info-box.active .index-works-list:nth-child(21) .production-list-title{
	animation: index-works-list .5s ease 2.0s 1 both;
}
#works-info .index-works-list:nth-child(22) .production-list-title,
.index-info-box.active .index-works-list:nth-child(22) .production-list-title{
	animation: index-works-list .5s ease 2.1s 1 both;
}
#works-info .index-works-list:nth-child(23) .production-list-title,
.index-info-box.active .index-works-list:nth-child(23) .production-list-title{
	animation: index-works-list .5s ease 2.2s 1 both;
}
#works-info .index-works-list:nth-child(24) .production-list-title,
.index-info-box.active .index-works-list:nth-child(24) .production-list-title{
	animation: index-works-list .5s ease 2.3s 1 both;
}
#works-info .index-works-list:nth-child(25) .production-list-title,
.index-info-box.active .index-works-list:nth-child(25) .production-list-title{
	animation: index-works-list .5s ease 2.4s 1 both;
}
#works-info .index-works-list:nth-child(26) .production-list-title,
.index-info-box.active .index-works-list:nth-child(26) .production-list-title{
	animation: index-works-list .5s ease 2.5s 1 both;
}
#works-info .index-works-list:nth-child(27) .production-list-title,
.index-info-box.active .index-works-list:nth-child(27) .production-list-title{
	animation: index-works-list .5s ease 2.6s 1 both;
}
#works-info .index-works-list:nth-child(28) .production-list-title,
.index-info-box.active .index-works-list:nth-child(28) .production-list-title{
	animation: index-works-list .5s ease 2.7s 1 both;
}
#works-info .index-works-list:nth-child(29) .production-list-title,
.index-info-box.active .index-works-list:nth-child(29) .production-list-title{
	animation: index-works-list .5s ease 2.8s 1 both;
}
#works-info .index-works-list:nth-child(30) .production-list-title,
.index-info-box.active .index-works-list:nth-child(30) .production-list-title{
	animation: index-works-list .5s ease 2.9s 1 both;
}
#works-info .index-works-list:nth-child(31) .production-list-title,
.index-info-box.active .index-works-list:nth-child(31) .production-list-title{
	animation: index-works-list .5s ease 3.0s 1 both;
}
.index-info-box.active .index-works-list:nth-child(32) .production-list-title{
	animation: index-works-list .5s ease 3.1s 1 both;
}
.index-info-box.active .index-works-list:nth-child(33) .production-list-title{
	animation: index-works-list .5s ease 3.2s 1 both;
}
.index-info-box.active .index-works-list:nth-child(34) .production-list-title{
	animation: index-works-list .5s ease 3.3s 1 both;
}
.index-info-box.active .index-works-list:nth-child(35) .production-list-title{
	animation: index-works-list .5s ease 3.4s 1 both;
}

.index-info-box.active .index-works-list:nth-child(36) .production-list-title{
	animation: index-works-list .5s ease 3.5s 1 both;
}
.index-info-box.active .index-works-list:nth-child(37) .production-list-title{
	animation: index-works-list .5s ease 3.6s 1 both;
}
.index-info-box.active .index-works-list:nth-child(38) .production-list-title{
	animation: index-works-list .5s ease 3.7s 1 both;
}
.index-info-box.active .index-works-list:nth-child(39) .production-list-title{
	animation: index-works-list .5s ease 3.8s 1 both;
}
.index-info-box.active .index-works-list:nth-child(40) .production-list-title{
	animation: index-works-list .5s ease 3.9s 1 both;
}
.index-info-box.active .index-works-list:nth-child(41) .production-list-title{
	animation: index-works-list .5s ease 4.0s 1 both;
}
.index-info-box.active .index-works-list:nth-child(42) .production-list-title{
	animation: index-works-list .5s ease 4.1s 1 both;
}
/*縮小淡入*/
@keyframes index-works-list {
 from {
    opacity: 0;
    transform: translateY(100px);
  }

  to {
    opacity: 1;
    transform: translateY(0px);
  }
}