@charset "utf-8";
.arti01{position:relative; background-color:#231f20; padding-top:255px; font-family:"GmarketSans" ; color:#fff;}
.arti01 .bf{content:"NEW"; display:block; font-size:550px; font-weight:700; position:absolute; left:0; top:280px; font-family:"GmarketSans"; color:#231f20; text-shadow: -1px 0px rgba(255,255,255,.1), 0px 1px rgba(255,255,255,.1), 1px 0px rgba(255,255,255,.1), 0px -1px rgba(255,255,255,.1);}
.arti01 .bf MARQUEE{line-height:1.2;}
.arti01 .top{margin-bottom:135px;}
.arti01 .top p{/*font-size:80px;*/font-size:90px; font-family:'Gothic A1'; font-weight:800; color:#fff; line-height:1.3;}
.arti01 .top p span{color:#c80000;}
.arti01 .bottom > p{font-family:'AppleSD'; font-weight:500; color:#fff; font-size:30px; margin-bottom:25px; line-height:1.3;}
.arti01 .bottom .info > div{display:inline-block; vertical-align:bottom;}
.arti01 .bottom .left > p{font-size:30px; color:#fff;}
.arti01 .bottom .left > p > span{font-size:160px; color:#c80000; font-weight:700; margin:0 12px;}
.arti01 .bottom .right{width:calc(100% - 32px - 345px);/*width:calc(100% - 32px - 305px);*/ position:relative; margin-left:32px;}
.arti01 .bottom .line{width:0; height:1px; display:block; background:#db1324; position:absolute; left:0; top:82px; opacity:0;}
/* .arti01 .bottom .box{display:inline-block;} */
.arti01 .bottom .box{display:inline-table;}
.arti01 .bottom .box .category{display:inline-block; color:#231f20; /*font-size:60px;*/ font-size:50px;  font-weight:700; text-shadow: -1px 0px #ff333c, 0px 1px #ff333c, 1px 0px #ff333c, 0px -1px #ff333c; }
.arti01 .bottom .box .circle{display:block; width:16px; height:16px; background-color:#c80000; border-radius:50%; margin:25px auto;}
.arti01 .bottom .box > p{font-size:60px; color:#fff; font-weight:700;}
.arti01 .bottom .box > p > span{font-size:30px; color:#fff;}
.arti01 .bottom .box > p > span:nth-child(2){font-weight:500; display:block;}
.arti01 .bottom .box > p > span strong{font-size:25px;}
.arti01 .bottom .box01,.arti01 .bottom .box02{padding-left:0px; /*padding-right:110px*/ padding-right:55px}
.arti01 .visu{position:absolute; bottom:0; right:0;}
.arti01 .visu::before{content:''; width:800px; height:800px; display:block; position:absolute; top:-200px; left:-200px; background:url(/resources/images/safety/main/mainVisu_bg.png) no-repeat right; filter:blur(170px); opacity:0.5; z-index:-1;}


.arti02{padding-top:65px; background-color:#231f20; position:relative; overflow:hidden;}
.arti02 .top > span{display:block; width:260px; height:260px; background:url(/resources/images/safety/main/arti02_deco.png) no-repeat center; float:left; text-align:center; font-family:'Gothic A1'; font-size:30px; padding-top:80px; color:#fff; font-weight:800; line-height:1.2}
.arti02 .top .con{float:right; width:calc(100% - 260px); padding-left:24px; padding-top:70px;}
.arti02 .top .con .desc{margin-bottom:110px;}
.arti02 .top .con .desc > div{font-family:'AppleSD'; border-bottom:1px solid #fff; width:100%; padding-left:55px;}
/*.arti02 .top .con .desc > div:first-child{margin-bottom:40px;}*/
.arti02 .top .con .desc > div:not(:nth-child(n+3)) { margin-bottom: 40px;}
.arti02 .top .con .desc span{padding:6px; background-color:#ffffff; font-size:40px; font-weight:700; color:#231f20; display:inline-block;}
.arti02 .top .con .desc p{display:inline-block; color:#fff; font-size:40px; word-break:keep-all;}
.arti02 .top .con .yt-box{position:relative; z-index:1; width:100%; max-width:670px; height:410px; padding-left:120px;}
.arti02 .bottom{width:100%; max-width:1150px; border-top:1px solid #a1131f; padding:32px 16px 50px;; margin-top:55px;}
.arti02 .bottom > p{font-size:20px; font-family:'Gothic A1'; color:#fff; line-height:1.3; }
.arti02 .deco .circle{width:637px; height:637px; border-radius:50%; position:absolute; bottom:-25px; right:-138px; background:#a1131f; display:block;}
.arti02 .deco .txt{position:absolute; bottom:0; right:24px; font-size:200px; font-family:'GmarketSans'; color:#231f20; font-weight:700; line-height:122px; letter-spacing:-14px;}
.arti02 .deco .txt > span{color:#fff;}

.arti03{padding-top:102px; padding-bottom:68px; background-image:url(/resources/images/safety/main/arti03_bg.png); background-color:#a1131f; background-position:left top, left bottom, right top; background-repeat:no-repeat;}
.arti03 .comment{height:266px; width:100%; background:url(/resources/images/safety/main/arti03_bg02.png) no-repeat; margin-bottom:70px; }
.arti03 .comment p{font-family:'GmarketSans'; color:#fff; font-size:25px; font-weight:700; line-height:1.3; width:50%; max-width:770px; padding-top:96px; word-break:keep-all;}
.arti03 .comment .tit{font-family:'Gothic A1'; font-size:70px; font-weight:200; color:#ffaeb5; top:0px; text-align:right; line-height:1.3; position:absolute; right:12px;}
.arti03 .comment .tit > span{font-weight:800; font-size:60px; color:#ffaeb5;}
.arti03 .noti-box .box{float:left;}
.arti03 .box{position:relative; float:left;}
.arti03 .box .tit{font-family:'Gothic A1'; font-size:35px; color:#fff; margin-bottom:35px; font-weight:500;}
.arti03 .box .more{position:absolute;}
.arti03 .news{width:calc(100% - 400px - 140px); margin-right:140px;}
.arti03 .news .more{top:0; right:0;}
.arti03 .news ul li{float:left; width:calc((100% - 65px) / 2); padding-bottom:40px; border-bottom:1px solid #fff;}
.arti03 .news ul li:first-child{margin-right:65px;}
.arti03 .news .img{width:100%; height:298px; overflow:hidden;}
.arti03 .news .img img{width:100%; height:100%; object-fit:cover; transition: transform .5s; }
.arti03 .news .img:hover img{transform:scale(1.3);
  transition: transform .5s;}
.arti03 .news ul li p{margin-top:30px; padding:0 12px;  font-size:20px; color:#fff; font-family:'Gothic A1';text-overflow: ellipsis;
   overflow: hidden;  word-break: break-word; display: -webkit-box;
   -webkit-line-clamp: 2;  -webkit-box-orient: vertical; line-height:1.3;}
.arti03 .noti-box .photo{width:400px; float:right}
.arti03 .photo .img{width:100%; height:400px; overflow:hidden;}
.arti03 .photo .img img{width:100%; height:100%; object-fit:cover; transition: transform .5s; }
.arti03 .photo .img:hover img{transform:scale(1.3);
  transition: transform .5s;}
.arti03 .photo .more{top:20px; right:33px; z-index:1;}
.arti03 .prof{width:calc(100% - 460px); margin-top:70px}
.arti03 .prof li{float:left; width:20%; padding:0 15px; }
.arti03 .prof .prof_txt{text-align:right}
.arti03 .prof .prof_txt .name{font-size:20px; font-family: 'GmarketSans'; font-weight:700; color:#fff; margin-top:20px; margin-bottom:5px}
.arti03 .prof .prof_txt .grd{font-size:15px; color:#fff; font-weight:500;}
.arti03 .prof .prof_txt .his{font-size:14px; color:#fff; font-weight:300; margin-top:28px; line-height:1.3}

.arti04{position:relative; padding-top:113px; padding-bottom:80px; background-color:#231f20; background-image:url(/resources/images/safety/main/arti04_bg01.png); background-size:cover; background-repeat:no-repeat; background-position:right bottom;}
.arti04 .tit{font-family:'Gothic A1'; font-weight:800; font-size:60px; color:#fff; text-align:center;}
.arti04 .tit span{color:#231f20; background-color:#c80000; padding:14px 16px;}
.arti04 .list{margin-top:110px; position:relative; z-index:0; bottom:-20px}
.arti04 .list .item{float:left; text-align:center; width:calc(100% / 3);}
.arti04 .item .txt{font-family:'GmarketSans'; font-weight:700; font-size:25px; margin-top:14px; margin-bottom:25px;}
.arti04 .item .txt strong{font-size:45px;}
.arti04 .item .desc{font-family:'Gothic A1'; font-size:20px; color:#fff; margin-bottom:25px; line-height:1.2;}
.arti04 .item .mark{padding:14px 20px; border-radius:24px; font-size:20px; font-family:'Gothic A1'; color:#fff;}
.arti04 .list .con{width:404px; height:404px; border-radius:50%; padding-top:20px; margin:0 auto;}
.arti04 .item01 .con{border:1px solid #c80000;}
.arti04 .item01 .txt{color:#c80000;}
.arti04 .item01 .mark{background-color:#c80000;}
.arti04 .item02 .con{background-color:#c80000;}
.arti04 .item02 .txt{color:#fff;}
.arti04 .item02 .mark{background-color:#6f0005;}
.arti04 .item03 .con{background:rgba(0,0,0,.5);}
.arti04 .item03 .txt{color:#c80000;}
.arti04 .item03 .mark{background-color:#c80000;}
.arti04 .gra{text-align:center; position:relative;}

/*반응형시작*/
@media all and (max-width:1860px){
	.arti02 .bottom{max-width:unset;}
	.arti02 .bottom > p{width:calc(100% - 520px); word-break:keep-all;}
	.arti02 .bottom > p br{display:none;}
	.arti02 .deco .txt{right:-25px;}
}
@media all and (max-width:1700px){
	.arti01 .visu{max-width:600px;}
}
@media all and (max-width:1486px){
	.fix-layout{width:100%; max-width:unset;}
	
	.arti01 .top p{font-size:60px;}
	.arti01 .bottom .left > p > span{font-size:100px;}
	.arti01 .bottom .box > p{font-size:50px;}
	.arti01 .bottom .box .category{font-size:50px;}
	.arti01 .bottom .box .circle {margin: 15px auto 25px;}
	.arti01 .bottom .box01{padding:0; margin-right:40px;}
	.arti01 .bottom .box02{padding:0; margin-right:40px;}
	.arti01 .bottom .line{top:73px;}
	
	.arti02 .top .con .desc > div{padding-left:0;}
	.arti02 .top .con .desc span{font-size:30px; margin-right:12px;}
	.arti02 .top .con .desc p{font-size:30px;}
	.arti02 .top .con .yt-box{padding-left:0;}
	
	.arti03{background-size:40% auto;}
	.arti03 .comment .tit{font-size:50px;}
	.arti03 .comment .tit > span{font-size:50px;}
	.arti03 .noti-box{padding-left:0;}
	.arti03 .news{margin-right:50px; width: calc(100% - 400px - 50px);}
	
	.arti04 .list .con{width:350px; height:350px;}
	.arti04 .list .con .ico{display:block; width:90px; height:90px; margin:0 auto;}
	.arti04 .item .txt{margin:16px 0; font-size:20px;}
	.arti04 .item .txt strong{font-size:30px;}
}
@media all and (max-width:1200px){
	.arti01{padding-top:50px;}
	.arti01:before{top:100px;}
	.arti01 .top{margin-bottom:100px;}
	.arti01 .visu{max-width:400px;}
	
	.arti02 .top > span{width:200px; height:200px; font-size:20px; padding-top:65px; background-size:cover;}
	.arti02 .top .con{width:calc(100% - 200px);}
	.arti02 .top .con .desc{margin-bottom:70px;}
	.arti02 .deco .circle{width:500px; height:500px;}
	.arti02 .deco .txt{font-size:150px; line-height:94px;}
	.arti02 .bottom > p{width:calc(100% - 380px);}
	
	.arti03 .comment{width:95% ; border-radius:0 50px 50px 0; }
	.arti03 .news ul li{width: calc((100% - 20px) / 2);}
	.arti03 .news ul li:first-child{margin-right:20px;}
	.arti03 .news ul li p{margin-top:16px;}
	.arti03 .photo .more{width:50px; right:12px;}
	
    .arti04{padding-bottom:0;}
	.arti04 .list{margin-top:50px;}
	
}
@media all and (max-width:1000px){
	.arti01 .top{margin-bottom:50px;}
	.arti01 .bottom > p{font-size:24px;}
	.arti01 .bottom .right{width:100%; margin-left:0; margin-top:30px;}
	
	.arti02 .top .con{padding-top:50px;}
	.arti02 .top .con .desc{margin-bottom:50px;}
	.arti02 .top .con .desc span{font-size:20px;}
	.arti02 .top .con .desc p{display:block; margin-top:12px; padding-bottom:12px; font-size:20px;}
	.arti02 .bottom{padding-bottom:150px; z-index:1; position:relative;}
	.arti02 .bottom > p{width:100%; }
	
	.arti03 .box .tit{font-size:20px;}
	.arti03 .comment{background-position:center; background-size:cover; height:200px; }
	.arti03 .comment p{font-size:20px; width:100%; padding-top:120px;}
	.arti03 .comment .tit{font-size:40px; right:50px; line-height:1.2;}
	.arti03 .comment .tit br{display:none;}
	.arti03 .comment .tit > span{font-size:40px;}
	.arti03 .photo{width:300px;}
	.arti03 .photo .img{height:300px;}
	.arti03 .news{width: calc(100% - 300px - 30px); margin-right:30px;}
	.arti03 .news .img{height:200px;}
	.arti03 .news ul li{padding-bottom:30px;}
	.arti03 .news ul li p{padding:0; font-size:18px;}
	
	.arti04 .tit{font-size:50px;}
	.arti04 .list .con{width:100%; height:auto; border-radius:0; padding:32px 12px; min-height:350px;}
	.arti04 .item .desc{font-size:16px;}
	.arti04 .item .mark{display:inline-block; font-size:16px;}
}
@media all and (max-width:767px){
	.arti01{text-align:center;}
	.arti01 .visu{margin-left:auto; position:unset;}
	.arti01 .bottom .right{margin-bottom:20px;}
	.arti01 .bottom .box{width:32%;}
	.arti01 .bottom .box01{margin-right:0;}
	.arti01 .bottom .box02{margin-right:0;}
	
	.arti02{padding-top:0;}
	.arti02 .fix-layout{padding:0;}
	.arti02 .top > span{float:none; width:unset; height:unset; background:#c80000; padding:16px 12px; }
	.arti02 .top > span br{display:none;}
	.arti02 .top .con{float:none; width:100%; padding:0 16px;}
	.arti02 .top .con .desc{padding:24px; border:1px solid #fff; margin-top:12px; background-color:#111;}
	.arti02 .top .con .yt-box{max-width:unset;}
	
	.arti03 .comment{height:180px;}
	.arti03 .comment p{padding-top:70px; font-weight:500;}
	.arti03 .comment .tit{color:#fff; top:-50px; font-family:'GmarketSans'; left:16px; font-size:32px; text-align:left;}
	.arti03 .comment .tit span{font-size:28px;  display:block; }
	.arti03 .comment .tit br{display:none;}
	.arti03 .news{width:100%; margin-right:0; float:none;}
	.arti03 .noti-box .box{float:none; width:100%; margin-top:30px;}
	
	.arti03 .prof li{width:33%; margin-bottom:30px}
	.arti03 .prof .prof_img{height:200px;}
	.arti03 .prof .prof_img img{width:100%; height:100%; object-fit:cover;}
	
	.arti04{padding-top:50px; }
	.arti04 .tit{font-size:32px;}
	.arti04 .tit span{padding:8px 12px;}
	.arti04 .list{margin-top:50px;}
	.arti04 .list .con .ico{width:70px; height:70px;}
	
}
@media all and (max-width:600px){
	.arti04 .tit span{display:inline-block; margin-top:12px; color:#fff;}
	.arti04 .list .item{float:none; width:100%; margin-bottom:12px; }
	.arti04 .list .con{min-height:unset;  }
}
@media all and (max-width:500px){
	.arti01 .bf{font-size:240px; top:150px;}
	.arti01 .top p{font-size:30px;}
	.arti02 .bottom > p{font-size:14px}
	.arti01 .bottom .box .category{font-size:32px;}
	.arti01 .bottom .box > p{font-size:32px;}
	.arti01 .bottom .box > p > span{font-size:32px;}
	.arti01 .bottom .box > p > span strong{font-size:32px;}
	.arti01 .bottom .line{top:54px;}
	
	.arti02 .deco .circle{width:350px; height:350px; right:-50px;}
	
	.arti03 .comment .tit{font-size:20px}
	.arti03 .comment .tit span{font-size:20px}
	.arti03 .news ul li{float:none; width:100%; margin-bottom:20px; padding-bottom:16px;}
	.arti03 .prof li{padding:0;}
	.arti03 .prof .prof_img{height:125px}
	.arti03 .prof .prof_txt .name{font-size:16px}
	.arti03 .prof .prof_txt .grd{font-size:13px;}
	.arti03 .prof .prof_txt .his{font-size:12px; margin-top:7px}
}

/*애니메이션*/
.obj{
	-webkit-transition: -webkit-transform .6s 0s ease-out,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s 0s ease-out,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s 0s ease-out,opacity 0.6s linear;
    -o-transition: -o-transform .6s 0s ease-out,opacity 0.6s linear;
    transition: transform .6s 0s ease-out,opacity 0.6s linear;
}
.circle-ani{
	-webkit-transition: -webkit-transform .6s 0s linear,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s 0s linear,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s 0s linear,opacity 0.6s linear;
    -o-transition: -o-transform .6s 0s linear,opacity 0.6s linear;
    transition: transform .6s 0s linear,opacity 0.6s linear;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    margin: 0 auto;
}
.circle-ani.effect{
	opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
.arti01 .box02 .circle-ani.effect{
	-webkit-transition: -webkit-transform .6s .3s linear,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s 3s linear,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s 3s linear,opacity 0.6s linear;
    -o-transition: -o-transform .6s 3s linear,opacity 0.6s linear;
    transition: transform .6s .3s linear,opacity 0.6s linear;
}
.arti01 .line{
	-webkit-transition: -webkit-transform .6s 0s inear;
    -moz-transition: -moz-transform .6s 0s linear;
    -ms-transition: -ms-transform .6s 0s linear;
    -o-transition: -o-transform .6s 0s linear;
    transition: width .6s 0s linear;
    opacity: 0;
}
.arti01 .line.effect{
	width:100%;
	opacity: 1;
    filter: alpha(opacity=100);
}
.visu{
	opacity:0;
	filter: alpha(opacity=100);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
}
.visu.effect{
	opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
.arti01 .total{
	display:inline-block;
	-webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    opacity:0;
}
.arti01 .total.effect{
	opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
@media all and (min-width:1200px){
	.arti01 .total.effect{animation-delay: 5s;}
	.arti01 .bottom p.effect{animation-delay: 0s;}
	.arti01 .line.effect{animation-delay: 9s;}
	.arti01 .box01.effect{animation-delay: 12s;}
	.arti01 .box02.effect{animation-delay: 13s;}
}

.up-txt{
	opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px);
    -ms-transform: translateY(30px);
    -o-transform: translateY(30px);
    transform: translateY(30px);
}
.up-txt.effect{opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: -webkit-transform .55s .2s ease-out,opacity 0.55s 0.2s linear;
    -moz-transition: -moz-transform .55s .2s ease-out,opacity 0.55s 0.2s linear;
    -ms-transition: -ms-transform .55s .2s ease-out,opacity 0.55s 0.2s linear;
    -o-transition: -o-transform .55s .2s ease-out,opacity 0.55s 0.2s linear;
    transition: transform .55s .2s ease-out,opacity 0.55s 0.2s linear;}
 .arti03 .news li:nth-child(1).effect{
	-webkit-transition: -webkit-transform .6s 0s ease-out,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s 0s ease-out,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s 0s ease-out,opacity 0.6s linear;
    -o-transition: -o-transform .6s 0s ease-out,opacity 0.6s linear;
    transition: transform .6s 0s ease-out,opacity 0.6s linear;
}
 .arti03 .news li:nth-child(2).effect{
    -webkit-transition: -webkit-transform .6s .3s ease-out,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s .3s ease-out,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s .3s ease-out,opacity 0.6s linear;
    -o-transition: -o-transform .6s .3s ease-out,opacity 0.6s linear;
    transition: transform .6s .3s ease-out,opacity 0.6s linear;
}
.arti03 .prof li:nth-child(1).effect{
	-webkit-transition: -webkit-transform .6s 0s ease-out,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s 0s ease-out,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s 0s ease-out,opacity 0.6s linear;
    -o-transition: -o-transform .6s 0s ease-out,opacity 0.6s linear;
    transition: transform .6s 0s ease-out,opacity 0.6s linear;
}
 .arti03 .prof li:nth-child(2).effect{
    -webkit-transition: -webkit-transform .6s .3s ease-out,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s .3s ease-out,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s .3s ease-out,opacity 0.6s linear;
    -o-transition: -o-transform .6s .3s ease-out,opacity 0.6s linear;
    transition: transform .6s .3s ease-out,opacity 0.6s linear;
}
.arti03 .prof li:nth-child(3).effect{
    -webkit-transition: -webkit-transform .6s .6s ease-out,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s .6s ease-out,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s .6s ease-out,opacity 0.6s linear;
    -o-transition: -o-transform .6s .6s ease-out,opacity 0.6s linear;
    transition: transform .6s .6s ease-out,opacity 0.6s linear;
}
.arti03 .prof li:nth-child(4).effect{
    -webkit-transition: -webkit-transform .6s .9s ease-out,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s .9s ease-out,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s .9s ease-out,opacity 0.6s linear;
    -o-transition: -o-transform .6s .9s ease-out,opacity 0.6s linear;
    transition: transform .6s .9s ease-out,opacity 0.6s linear;
}
.arti03 .prof li:nth-child(5).effect{
    -webkit-transition: -webkit-transform .6s 1.2s ease-out,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s 1.2s ease-out,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s 1.2s ease-out,opacity 0.6s linear;
    -o-transition: -o-transform .6s 1.2s ease-out,opacity 0.6s linear;
    transition: transform .6s 1.2s ease-out,opacity 0.6s linear;
}
.arti03 .photo .img.effect{
	-webkit-transition: -webkit-transform .6s .6s ease-out,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s .6s ease-out,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s .6s ease-out,opacity 0.6s linear;
    -o-transition: -o-transform .6s .6s ease-out,opacity 0.6s linear;
    transition: transform .6s .6s ease-out,opacity 0.6s linear;
}

.arti04 .zoom-txt{
	opacity:0; display:inline-block;
	filter: alpha(opacity=100);
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
}
.arti04 .zoom-txt.effect{
	opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.arti04 .item{
	opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}
.arti04 .item.effect{
	opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
.arti04 .item01.effect{
	-webkit-transition: -webkit-transform .6s 0s ease-out,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s 0s ease-out,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s 0s ease-out,opacity 0.6s linear;
    -o-transition: -o-transform .6s 0s ease-out,opacity 0.6s linear;
    transition: transform .6s 0s ease-out,opacity 0.6s linear;
}
.arti04 .item02.effect{
    -webkit-transition: -webkit-transform .6s .3s ease-out,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s .3s ease-out,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s .3s ease-out,opacity 0.6s linear;
    -o-transition: -o-transform .6s .3s ease-out,opacity 0.6s linear;
    transition: transform .6s .3s ease-out,opacity 0.6s linear;
}
.arti04 .item03.effect{
	-webkit-transition: -webkit-transform .6s .6s ease-out,opacity 0.6s linear;
    -moz-transition: -moz-transform .6s .6s ease-out,opacity 0.6s linear;
    -ms-transition: -ms-transform .6s .6s ease-out,opacity 0.6s linear;
    -o-transition: -o-transform .6s .6s ease-out,opacity 0.6s linear;
    transition: transform .6s .6s ease-out,opacity 0.6s linear;
}