@charset "utf-8";
.pcbr{display:none;}
.ptbr{display:block;}
.tbbr{display:block;}
.tmbr{display: block;}
.mbbr{display:none;}
.dn{display:none;}
.pctb{display:block;}
.mb{display:none;}
.pc_view {display: none;}



.innerwrap{
	width: 92%;
	max-width: 1600px;
	margin: 0 auto;
}


.secWrap{
	position: relative;
	z-index: 1;
	display: flex;
	/* align-items: center; */
	align-items: flex-end;
}
.secWrap .sec_tit{flex-shrink: 1; width: 50%;}
.secWrap .more_btn{flex-shrink: 0;}
.sec_tit{position: relative;}
.sec_tit h2{
	font-size: 20px;
	font-weight: 600;
	color: #35424c;
}

.sec_tit h3{
	font-family: "Shippori Mincho", serif;
	font-size: 45px;
	font-weight: 500;
	color: #35424c;
	line-height: 1.2em;
	margin-top: 30px;
}
.sec_tit h4{
	font-size: 30px;
	font-weight: 600;
	color: #35424c;
	margin-top: 20px;
}

.sec_tit p{
	font-size: 20px;
	line-height: 1.6em;
	color: #666666;
	margin-top: 20px;
}
.sec_tit .more_btn{
	margin-top: 20px;
}

.sec_tit.wh h2{color: #fff;}
.sec_tit.wh h3{color: #fff;}
.sec_tit.wh p{color: #fff;}

.secWrap .right{width: 50%;padding-left: 10%;}
.secWrap .right p{
	font-size: 20px;
	line-height: 1.6em;
	color: #666666;
	margin-bottom: 20px;
}




.more_btn{
	position: relative;
	display: inline-flex;
	align-items: center;
	padding:20px 40px 0px 0;
}
.more_btn span{
	position: relative;
	z-index: 1;
	font-size: 13px;
	font-weight: 600;
	color: #000;
}
.more_btn i{
	position: relative;
	z-index: 1;
	display: block;
	width: 12px;
	height: 12px;
	background: url(/images/main/more_btn_arr.png) no-repeat center / contain;
	transition: all 0.3s;
	margin-left: 7px;
}
.more_btn:hover i{
	transform: translateX(3px);
}
.more_btn.wh{
}
.more_btn.wh span{
	color: #fff;
}
.more_btn.wh i{
	background: url(/images/main/more_btn_arr_wh.png) no-repeat center / contain;
}
.more_btn.bl span{
	color: #444;
}


.more_btn.bl{
	/* background: rgba(255, 255, 255, 0.3);
	backdrop-filter: blur(5px); */
	border: 1px solid #222;
}


.sec1{
	padding: 240px 0 0;
}
.sec1 .txtwrap{
	width: 92%;
	max-width: 1600px;
	margin: 0 auto;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	opacity: 0;
	transform: translateY(40px);
	filter: blur(5px);
}
.sec1 .txtwrap.in-view{
	opacity: 1;
	transform: translateY(0);
	filter: blur(0);
	transition: all 1.4s 0.1s;
}
.sec1 .txtwrap h2 {
  position: relative;
	display: inline-block;
  text-align: center;
}
@keyframes fillText {
  0% {
    background-position: right;
  }
  100% {
    background-position: left;
  }
}

.sec1 .txtwrap h2 > span{
	display: block;
	font-family: "KoPubWorld Batang";
	font-size: 100px;
	font-weight: 300;
	line-height: 1.2em;
	color: #35424c;
	/* background: linear-gradient(to left, #888888 50%, #000000 50%);
	background-size: 200% 100%;
	background-position: left;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent; */
	
}
/* .sec1 .txtwrap h2.delay0 > span{
	animation: fillText 2.5s linear forwards;
	animation-delay: 1.6s;
	animation-fill-mode: backwards;
}

.sec1 .txtwrap h2.delay1 > span{
	animation: fillText 1.9s linear forwards;
	animation-delay: 4.1s;
	animation-fill-mode: backwards;
} */

.sec1 .txtwrap .main_icon{
	position: absolute;
	left: 50%;
	bottom: 110%;
	transform: translateX(-50%);
}

.sec1 .visualWrap{
	width: 100%;
	height: 100vh;
	transform: translateY(-40px);
}
.sec1 .visual{
	position:relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.sec1 .visual .swiper-slide .txts{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	z-index: 10;
	text-align: center;
	display: flex;
	flex-direction: column;
	z-index: 1;
}
.sec1 .visual .swiper-slide .txts h2{
	display: inline-block;
	font-family: "Shippori Mincho", serif;
	font-size: 70px;
	font-weight: 500;
	color: #fff;
	filter: blur(4px);
	opacity: 0;
}
.sec1 .visual .swiper-slide .txts p{
	display: inline-block;
	font-size: 30px;
	color: #fff;
	margin-top: 10px;
	filter: blur(4px);
	opacity: 0;
}
@keyframes fade-in {
  100% {
    opacity: 1;
    filter: blur(0);
  }
}
.sec1 .visual.on .swiper-slide-active .txts h2 {
  animation: fade-in 1s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
}
.sec1 .visual.on .swiper-slide-active .txts p {
  animation: fade-in 1s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
}
.sec1 .visual .swiper-slide .txts.animate h2{
  animation: fade-in 1s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
}
.sec1 .visual .swiper-slide .txts.animate p{
  animation: fade-in 1s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
}
.sec1 .visual .swiper-wrapper{width:100%;height:100%;}
.sec1 .visual .swiper-slide{
	position:relative;
	width:100%; height:100%;
	flex-shrink: 0;
	overflow: hidden;
}
.sec1 .visual .swiper-slide .bg{
	position:absolute;left:0%;top:0%;z-index:-1;
	width:100%;height:100%;	
}




.sec1 .visual .ctr{
	position: absolute;
	left: 50%;
	bottom: 30px;
	transform: translateX(-50%);
	z-index: 1;
	display: flex;
	align-items: center;
	opacity: 0;
	transition: all 0.3s;
}
.sec1 .visual.visible .ctr{
	opacity: 1;
}

.sec1 .visual .ctr .vprev{
	display: block;
	width: 13px;
	height: 23px;
	background: url(/images/main/vprev.png) no-repeat center / contain;
	z-index: 1;
	margin-right: 35px;
	cursor: pointer;
}
.sec1 .visual .ctr .vnext{
	display: block;
	width: 13px;
	height: 23px;
	background: url(/images/main/vnext.png) no-repeat center / contain;
	z-index: 1;
	margin-left: 35px;
	cursor: pointer;
}
.sec1 .visual .ctr .vpaging .swiper-pagination-bullet{
	position: relative;
	width: 10px;
	height: 10px;
	background: unset;
	border: 1px solid #fff;
	margin: 0 10px;
	opacity: 1;
}
.sec1 .visual .ctr .vpaging .swiper-pagination-bullet:after{
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%) scale(0);
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: #399546;
	z-index: -1;
	transition: all 0.4s;
}
.sec1 .visual .ctr .vpaging .swiper-pagination-bullet-active:after{
	transform: translate(-50%, -50%) scale(1);
}

.sec1 .visual .ctr #pause_play { /* added */
	z-index: 1000;
	width: 39px;
	height: 39px;
	overflow: hidden;
	text-indent: -9999px;
}
.sec1 .visual .ctr #pause_play.pause {
	background: url(/images/main/btn_pause.png) no-repeat center;
}
.sec1 .visual .ctr #pause_play.play {
	background: url(/images/main/btn_play.png) no-repeat center;
}








.pin-spacer{overflow-x: hidden !important; width: 100% !important;}

.sec2{
	height: 100vh;
	display: flex;
	align-items: center;
	overflow: hidden;
}
.sec2 .sec_tit p{
	font-size: 20px;
	margin-top: 30px;
}
.sec2 .conwrap{
	position: relative;
	display: flex;
	/* align-items: center; */
	align-items: flex-start;
}
.sec2 .conwrap .sec_tit{
	width: 35%;
	position: relative;
	z-index: 1;
}
.sec2 .conwrap .imgwrap{
	position: relative;
	z-index: 1;
	width: 100%;
	margin-left: 5%;
	height: 77vh;
	max-height: 700px;
	border-radius: 15px;
	overflow: hidden;
	aspect-ratio: 103 / 100;
}
.sec2 .conwrap .imgwrap img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sec2 .conwrap .imgwrap video{
	display:none;
}










.sec3{
	/* padding: 0 0 300px; */
}
:root {
	--cards: 4;
	--cardHeight: 87vh;
	--cardTopPadding: 113px;
	--cardMargin: 370px;
}

#cards {
	list-style: none;
	padding-left: 0;
	position: relative;
	margin-top: 100px;
}

.card {
	/* padding-top: calc(var(--index) * var(--cardTopPadding)); */
	width: 100%;
	
}

#card1 { --index: 1; }
#card2 {
	--index: 2;
}
#card3 {
	--index: 3;
}
#card4 {
	--index: 4;
}

.card-body {
	box-sizing: border-box;
	padding: 150px 0;
	display: flex;
	border-top: 1.5px dashed #b2b2b2;
	background: #fff;
	transition: all 0.5s;

	/* 애니메이션 초기 상태 */
	/* opacity: 0;
	transform: translateY(100vh); */
}
.card-body .left{
	flex-shrink: 0;
	display: flex;
	width: 210px;
}
.card-body .left h2{
	width: 100%;
	font-size: 16px;
	font-weight: 500;
	color: #35424c;
}
.card-body .left .img{
	width: 430px;
	height: 55vh;
	max-height: 500px;
	border-radius: 20px;
	overflow: hidden;
}
.card-body .left .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.card-body .right{
	margin-top: 10px;
	width: calc(100% - 210px);
}
.card-body .right h3{
	font-size: 34px;
	font-weight: 600;
	color: #303e48;
}
.card-body .right h4{
	font-size: 26px;
	font-weight: 600;
	color: #399137;
	margin-top: 45px;
}
.card-body .right p{
	font-size: 20px;
	line-height: 1.5em;
	color: #666;
	margin: 30px 0 40px;
}
.card-body .right .img{
	width: 100%;
	height: 400px;
	border-radius: 20px;
	overflow: hidden;
	margin-top: 30px;
}
.card-body .right .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}


.sec4{
	position: relative;
	padding: 180px 0 200px;
	background: url(/images/main/sec4_bg.jpg) no-repeat center / cover;
	overflow: hidden;
}
.sec4 .boxwrap{
	position: relative;
	z-index: 1;
	margin-top: 120px;
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
}
.sec4 .boxwrap .box{
	overflow:hidden;
	position: relative;
	width: calc((100% - 30px) / 2);
	border-radius: 20px;
	background: #fff;
	box-sizing: border-box;
}
.sec4 .boxwrap .box:nth-child(1){opacity: 0; display: none;}
.sec4 .boxwrap .box:nth-child(3){background: #399546;}
.sec4 .boxwrap .box:nth-child(4){background: #00557b;}
.sec4 .boxwrap .box:after{
	content: "";
	display: block;
	padding-bottom: 100%;
}
.sec4 .boxwrap .box video{
	position:absolute;left:0;top:0;
	width:100%;height:100%;
	object-fit:cover;
}
.sec4 .boxwrap .box .inner{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	position: absolute;
	width: 100%;
	height: 100%;
	padding: 30px;
	box-sizing: border-box;
}
.sec4 .boxwrap .box .inner .tit{
	font-size: 34px;
	font-weight: 600;
	color: #fff;
}
.sec4 .boxwrap .box .inner .con h3{
	font-size: 23px;
	font-weight: 600;
	line-height: 1.4em;
	color: #fff;
}
.sec4 .boxwrap .box .inner .con p{
	font-size: 18px;
	line-height: 1.6em;
	color: rgba(255,255,255,0.8);
	margin: 20px 0;
}
.sec4 .boxwrap .box .inner .con a span{
	font-family: "Open Sans";
	font-size: 12px;
}
.sec4 .boxwrap .box .inner .con a:hover i{
	transform: translateX(3px);
}





.sec5{
	padding: 140px 0 180px;
	background: #37404a;
	overflow: hidden;
}
.sec5 ul{
	margin-top: 120px;
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
	gap: 40px;
}
.sec5 li{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	max-width: 370px;
	max-height: 480px;
	width: calc((100% - 40px) / 2);
	border-radius: 20px;
	transition: all 0.3s;
	box-sizing: border-box;
}
.sec5 li:hover{
	background: #fff;
}
.sec5 li:after{
	content: "";
	display: block;
	padding-bottom: 130%;
}
.sec5 li > div{
	width: 100%;
	height: 100%;
	padding: 50px 40px;
	box-sizing: border-box;
	position: absolute;
	display: flex;
	flex-direction: column;
	/* justify-content: space-between; */
}
.sec5 li .num{
	font-family: "Shippori Mincho", serif;
	font-size: 18px;
	color: #fff;
	transition: all 0.3s;
}
.sec5 li:hover .num{
	color: #000;
}
.sec5 li .txts{margin-top: 110px;}
.sec5 li .txts .icon{
	display: block;
	width: 52px;
	height:52px;
	transition: all 0.3s;
}
.sec5 li:nth-child(1) .txts .icon{
	background: url(/images/main/sec5_icon1.png) no-repeat center / contain;
}
.sec5 li:nth-child(1):hover .txts .icon{
	background: url(/images/main/sec5_icon1_bl.png) no-repeat center / contain;
}
.sec5 li:nth-child(2) .txts .icon{
	background: url(/images/main/sec5_icon2.png) no-repeat center / contain;
}
.sec5 li:nth-child(2):hover .txts .icon{
	background: url(/images/main/sec5_icon2_bl.png) no-repeat center / contain;
}
.sec5 li:nth-child(3) .txts .icon{
	background: url(/images/main/sec5_icon3.png) no-repeat center / contain;
}
.sec5 li:nth-child(3):hover .txts .icon{
	background: url(/images/main/sec5_icon3_bl.png) no-repeat center / contain;
}
.sec5 li:nth-child(4) .txts .icon{
	background: url(/images/main/sec5_icon4.png) no-repeat center / contain;
}
.sec5 li:nth-child(4):hover .txts .icon{
	background: url(/images/main/sec5_icon4_bl.png) no-repeat center / contain;
}

.sec5 li:hover .txts .svg line,
.sec5 li:hover .txts .svg polyline,
.sec5 li:hover .txts .svg circle,
.sec5 li:hover .txts .svg path,
.sec5 li:hover .txts .svg rect,
.sec5 li:hover .txts .svg polygon {
	stroke: #37404a;
	transition: all 0.3s;
}

.sec5 li .txts b{
	display: inline-block;
	font-size: 30px;
	font-weight: 500;
	line-height: 1.6em;
	color: #fff;
	margin: 30px 0 10px;
	transition: all 0.3s;
}
.sec5 li:hover .txts b{
	color: #000;
}
.sec5 li .txts p{
	font-size: 19px;
	line-height: 1.7em;
	color: rgba(255,255,255,0.6);
	transition: all 0.3s;
}
.sec5 li:hover .txts p{
	color: #000;
}

.sec5 li .svg1{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	opacity: 0;
}
.sec5 li .svg2{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	opacity: 0;
}

@keyframes stroke_ani {
    0% {stroke-dashoffset: 1206;}
    100% {stroke-dashoffset: 0;}
}
.sec5 .innerwrap.in-view li .svg1 path{
	animation:stroke_ani 2s ease-in forwards; -webkit-animation:stroke_ani 1.6s ease-in forwards;
	stroke-dasharray:1206;
	stroke-dashoffset:1206;
	animation-delay:0.5s;
}
.sec5 .innerwrap.in-view li .svg2 path{
	animation:stroke_ani 2s ease-in forwards; -webkit-animation:stroke_ani 1.6s ease-in forwards;
	stroke-dasharray:1206;
	stroke-dashoffset:1206;
	animation-delay:0.5s;
}

.sec5 .innerwrap.in-view li .svg1{opacity: 1;}
.sec5 .innerwrap.in-view li .svg2{opacity: 1;}


.sec6{
	position:relative;
	padding: 220px 0 600px;
	background: url(/images/main/sec6_bg.png) no-repeat center bottom / cover;
}
.sec6 .bg{
	position:absolute;left:0;bottom:0;
	width:100%;height:100%;
}
.sec6 .bg video{width:100%;height:100%;object-fit:cover;}
.sec6 .conwrap{
	margin-top: 120px;
}
.sec6 .conwrap .con{
	position: relative;z-index:10;
	padding-left:50%;
	margin-bottom:100px;
}

.sec6 .conwrap .con:last-child{
	margin-bottom:0px;
}

.sec6 .conwrap .con .img{
	overflow:hidden;
	position:absolute;left:0;top:0;
	width:45%;height:100%;
	border-radius:20px;
}
.sec6 .conwrap .con .img img{object-fit:cover;width:100%;height:100%;}
.sec6 .conwrap .con .num{
	font-size: 16px;
	font-weight: 500;
	color: #221b19;
	margin:0 0 40px;
}
.sec6 .conwrap .con .cate{
	display: flex;
	font-family: "Shippori Mincho", serif;
	font-size: 50px;
	font-weight: 500;
	color: #35424c;
	padding-bottom: 20px;
	border-bottom: 1px solid #aaa;
}
.sec6 .conwrap .con p{
	font-size: 20px;
	line-height: 1.6em;
	margin: 40px 0;
	color: #333;
}


.sec7{
	position: relative;
	padding: 180px 0 0;
	overflow: hidden;
}
.sec7 .secWrap{
	justify-content: space-between;
}
.sec7 .sec7Swiper{
	margin-top: 40px;
	padding-bottom: 50px;
}
.sec7 .sec7Swiper .swiper-slide{
	width: 370px;
}
.sec7 .sec7Swiper .swiper-slide a{
	position: relative;
	display: block;
	width: 100%;
	transition: all 0.3s;
}
.sec7 .sec7Swiper .swiper-slide a .thumb{
	width: 100%;
	border-radius: 15px;
	max-height:260px;aspect-ratio:370/260;
	overflow: hidden;
}
.sec7 .sec7Swiper .swiper-slide a .thumb img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.sec7 .sec7Swiper .swiper-slide a .txts{
	margin-top: 30px;
}
.sec7 .sec7Swiper .swiper-slide a .txts .tit{
	font-size: 22px;
	font-weight: 600;
	color: #2f3842;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.sec7 .sec7Swiper .swiper-slide a .txts .con{
	font-size: 18px;
	color: #666666;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	line-height: 1.5em;
	height: 3em;
	margin: 15px 0;
}
.sec7 .sec7Swiper .swiper-slide a .txts .date{
	font-size: 17px;
	color: #666;
}
.sec7 .sec7Swiper .swiper-scrollbar{
	display:block !important;
	width:100%;height:1px;
	left:0;
	background:#c4c4c4;
}
.sec7 .sec7Swiper .swiper-scrollbar .swiper-scrollbar-drag{
	height:2px;
	background:#000;
}


.sec8{padding: 180px 0;}
.sec8 .conwrap{}
.sec8 .conwrap .infowrap{
	width:100%;
	padding-bottom: 5%;
	margin-bottom: 5%;
	border-bottom: 1px solid #ddd;
}
.sec8 .conwrap .infowrap .info{
	margin: 40px 0;
}
.sec8 .conwrap .infowrap .info dl{
	width: 100%;
	padding: 15px 40px;
	border-radius: 20px;
	background: #f4f4f4;
	display: flex;
	justify-content: space-between;
}
.sec8 .conwrap .infowrap .info dl + dl{
	margin-top: 15px;
}
.sec8 .conwrap .infowrap .info dl dt{
	position: relative;
	padding-left: 40px;
	font-size: 18px;
	font-weight: 600;
}
.sec8 .conwrap .infowrap .info dl dt img{
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
.sec8 .conwrap .infowrap .info dl dd{
	font-size: 20px;
	font-weight: 600;
}
.sec8 .conwrap .infowrap .info dl dd .stock.up{
	color: #e60012;
}
.sec8 .conwrap .infowrap .info dl dd .stock.down{
	color: #1575bb;
}
.sec8 .conwrap .imgwrap{
	width:100%;
	border-radius: 20px 190px 190px 20px;
	background: #35424b;
	padding: 50px;
	display: flex;
	align-items: center;
}
.sec8 .conwrap .imgwrap .img{
	width: 70%;
}
.sec8 .conwrap .imgwrap .txts{
	width: 57%;
	padding-left: 7%;
}
.sec8 .conwrap .imgwrap .txts h2{
	margin-bottom: 20px;
	font-size: 20px;
	font-weight: 600;
	color: #fff;
}
.sec8 .conwrap .imgwrap .txts h3{
	font-size: 30px;
	font-weight: 600;
	line-height: 1.4em;
	color: #fff;
}
.sec8 .conwrap .imgwrap .txts p{
	margin: 15px 0 25px;
	font-size: 18px;
	line-height: 1.7em;
	color: rgba(255,255,255,0.7);
}
.sec8 .conwrap .imgwrap .txts .img{
	position: absolute;
	left: -150px;
	top: 50%;
	transform: translateY(-50%);
}

.sec9{padding-bottom: 4%;}
.sec9 .inner{
	width: 92%;
	margin: 0 auto;
	display: flex;
}
.sec9 .inner .txtwrap{
	width: 50%;
	height: 840px;
	padding: 25px;
	border-radius: 20px;
	background: #1f6a3b;
	display: flex;
	align-items: center;
	margin-right: 20px;
}
.sec9 .inner .imgwrap{
	position: relative;
	width: calc(50% - 20px);
	height: 840px;
	border-radius: 15px;
	overflow: hidden;
}
.sec9 .inner .imgwrap .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(/images/main/sec9_imgwrap_bg.jpg) no-repeat center / cover;
}




/* .sec1 .txtwrap h2,.sec1 .txtwrap h3{overflow: hidden;}
.sec1 .txtwrap h2 span{transform: translateY(100%);}
.sec1 .txtwrap h3 span{transform: translateY(100%);}
.sec1.in-view .txtwrap h2 span{transform: translateY(0); transition: all 1.2s 0.2s;}
.sec1.in-view .txtwrap h3 span{ transform: translateY(0); transition: all 1.2s 0.4s;}
 */



@keyframes smokeEffect {
    0% {
        opacity: 0;
        filter: blur(10px);
        transform: translateY(0) scale(1);
    }
    100% {
        opacity: 1;
        filter: blur(0);
        transform: translateY(0) scale(1);
    }
}
/* .sec1 .txtwrap h2 > span{opacity:0;transform-origin:center;}
.sec1 .txtwrap h2 > span.text1{transform:scale(1.1) translate3d(0, 30px, 0) rotateZ(0);}
.sec1 .txtwrap h2 > span.text2{transform:scale(1.1) translate3d(0, 30px, 0) rotateZ(0);}
.sec1 .txtwrap h2 > span.text3{transform:scale(1.1) translate3d(0, 30px, 00) rotateZ(0);}
.sec1 .txtwrap h2 > span span{transform:translateY(0);opacity:0;filter: blur(0);}
.sec1 .txtwrap h2.in-view > span{opacity:1;transform:scale(1) translate(0,0);}
.sec1 .txtwrap h2.in-view > span.text1{transition:all 1.4s ease-in-out;}
.sec1 .txtwrap h2.in-view > span.text2{transition:all 1.4s 0.4s ease-in-out;}
.sec1 .txtwrap h2.in-view > span.text3{transition:all 1.4s 0.8s ease-in-out;}

.sec1 .txtwrap h2 > span.text1 span.show{animation: smokeEffect 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;}
.sec1 .txtwrap h2 > span.text2 span.show{animation: smokeEffect 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s forwards;}
.sec1 .txtwrap h2 > span.text3 span.show{animation: smokeEffect 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.6s forwards;} */


.sec1 .visual{
    opacity: 0;
}