.index_popup.popup_back .layer {
	max-width:740px;
	text-align:center;
	padding:1.25rem 2.25rem 0 2.25rem;
	max-height:85%;
}
html.scrollLock,html.scrollLock body {
	overscroll-behavior-y: none;
    -webkit-overflow-scrolling: touch;
}
html.scrollLock body {
	position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
	overflow:hidden;
}

#Index .swiper-button img {
	width:2.75rem;
}
#Index .swiper-button {
	cursor:pointer;
}
#Index section {
	padding:7rem 0;
}
#Index .sec1 {
	position:relative;
	padding:0;
}
#Index .sec1 .scrolldown {
	width:2.75rem;
	margin-top:6rem;
	animation:scrolldown 1.5s ease-in-out infinite;
}
@keyframes scrolldown {
	from {
		transform: translate(0,-40%);
		opacity: 0;
	}
  
	to {
		transform: translate(0,0%);
		opacity: 1;
	}
  }
#Index .sec1 .page_number {
	color:#fff;
	font-size:1rem;
	font-weight:500;
	font-family: 'GmarketSans';
}
#Index .sec1 .page_number b,#Index .sec1 .page_number .total {
	font-weight:500;
	font-family: 'GmarketSans';
}
#Index .sec1 .page_number.green {
	color:#08211A;
}
#Index .sec1 .swiper-navigation {
	display:inline-block;
	margin-left:1.2rem;
}
#Index .sec1 .swiper-navigation button {
	width:0.35rem;
	height:0.7rem;
	background:url(/img/index/ico_prev_arrow.png) no-repeat 50%;
	background-size:cover;
}
#Index .sec1 .swiper-navigation .sec1_next{
	background:url(/img/index/ico_next_arrow.png) no-repeat 50%;
	background-size:cover;
}
#Index .sec1_swiper .text-deco .wrap_1530 span {
	opacity: 0;
}
#Index .sec1_swiper .text-deco.active .wrap_1530 span{
	width: 100%;
    float: left;
    color: #fff;
    -webkit-clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 80%);
    clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 80%);
    transform: translateY(-100%);
    opacity: 0;
    animation-name: titleAnimation;
    animation-timing-function:ease;
    animation-duration: 3s;
	animation-fill-mode: forwards;
}
#Index .sec1_swiper .text-deco.active .wrap_1530 h2 span:first-child {
	animation-delay:0.3s;
}
#Index .sec1_swiper .text-deco.active .wrap_1530 h3 span {
	animation-delay:0.6s;
}
@keyframes titleAnimation {
    0% {
      transform: translateY(-100%);
      opacity: 0;
      -webkit-clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 80%);
      clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 80%);
  }
  20% {
      transform: translateY(0);
      opacity: 1;
      -webkit-clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 0%);
      clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 0%);
  }
  100% {
       transform: translateY(0);
       opacity: 1;
      -webkit-clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 0%);
      clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 0%);
  }
}
#Index .sec1 .sec1_prev {
	margin-right:1rem;
}
#Index .sec1 .battery {
	transform:translate(0,20%);
	margin-right:1rem;
	position: relative;
	width:auto;
}
#Index .sec1 .battery::after{
	content:'';
	display:inline-block;
	height:0.4rem;
	width:0.3rem;
	margin-left:0.1rem;
	border-radius:0 20% 20% 0;
	background:#C1C1C1;
	transform:skew(-15deg) !important;
}
#Index .sec1 .battery.lastSlide::after{
	background:#007C57;
}
/* ------------- 추가 ------------------ */
#Index .sec1 .battery span:last-child::after {
	padding-top:100%;
}
#Index .sec1 .battery span {
	background:#C1C1C1;
	transition:all 0.3s ease;
	height:auto;
	opacity: 1;
	border-radius:0;
	width:1.1rem !important;
}
#Index .sec1 .battery span:first-child,#Index .sec1 .battery span.green,
#Index .sec1 .battery span.swiper-pagination-bullet-active{
	background:#007C57;
}
/* #Index .sec1_swiper.two .battery span:nth-child(2) {
	background:#007C57;
}
#Index .sec1_swiper.three .battery span {
	background:#007C57;
} */
#Index .sec1_swiper.three .swiper-slide h3 ,
#Index .sec1_swiper.three .swiper-slide h2 {
	color:#007C57;
}
#Index .sec1_swiper.three .page_number{
	color:#08211A;
}
#Index .sec1_swiper.three .sec1_prev {
	background:url(/img/index/ico_prev_arrow_on.png) no-repeat 50%;
	background-size:cover;
}
#Index .sec1_swiper.three .sec1_next{
	background:url(/img/index/ico_next_arrow_on.png) no-repeat 50%;
	background-size:cover;
}
#Index .sec1 .swiper-slide h3 {
	font-family: 'GmarketSans';
    color: #fff;
    font-size: 1.5rem;
    font-weight: 500;
    margin-bottom: 1.2rem;
    height: 2rem;
    overflow: hidden;
    max-width: 75%;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#Index .sec1 .swiper-slide h2 {
	font-family: 'GmarketSans';
    font-size: 3rem;
    line-height: 1.2;
    height: 8.3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    max-width: 60%;
    display: -webkit-box;
    word-break: keep-all;
    -webkit-box-orient: vertical;
}
#Index .sec1 .swiper-slide.green h3 ,
#Index .sec1 .swiper-slide.green h2 {
	color:#007C57;
}
#Index .sec1 .swiper-slide.transparent h3 ,
#Index .sec1 .swiper-slide.transparent h2 {
	color:transparent;
}
#Index .page_wrap {
	position:absolute;
	left:50%;
	top:calc(50% + 12rem);
	transform:translate(-50%,-50%);
	/* border:1px solid black; */
	z-index: 2;
	padding-left:0.5rem;
}
#Index button[class*=swiper-button] img {
	width:2.75rem;
}
#Index .sec1 .swiper-slide {
	position:realtive;
}
#Index .sec1 .swiper-slide img {
	width:100%;
	height:100%;
	object-fit: cover;
	object-position: center;
}
#Index .sec1 .swiper-slide .wrap_1530 {
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	color:#fff;
}
#Index .sec2 {
	background:#EBFFF5;
	text-align:center;
}
#Index .sec3 {
	padding:5.75rem 0 7rem;
	text-align:center;
}
#Index .sec3 h4 {
	font-family: 'GmarketSans';
	color:#007C57;
	font-size:2.5rem;
}
#Index .sec3 .battery {
	width:8rem;
}
#Index .sec3 .reverse .battery span {
	transform:skew(0) !important
}
#Index .sec3 .mini_tit {
	font-family:'S-Core Dream';
	font-size:1.2rem;
	font-weight:500;
	color:#08211A;
}
#Index .sec3 .swiper-slide h3 {
	font-family: 'GmarketSans';
	color:#007C57;
	font-size:1.9rem;
}
#Index .sec3 .swiper-slide h3 .text_bor {
	font-family: 'GmarketSans';
	text-shadow: -1px 0px #007C57, 0px 1px #007C57, 1px 0px #007C57, 0px -1px #007C57;
	color:#fff;
}
#Index .sec3 .swiper-slide p.detail {
	font-family:'S-Core Dream';
	font-weight:500;
	color:#08211A;
	font-size:1.2rem;
}
#Index .sec3_swiper {
	/* border:1px solid black; */
	position:relative;
	overflow: visible;
}
#Index .sec3 .sliding_slick {
	transition-timing-function:linear;
}
#Index .sec3_swiper .sec3_prev {
	position:absolute;
	left:0;
	bottom:1rem;
	z-index: 2;
}
#Index .sec3_swiper .sec3_next {
	position:absolute;
	right:0;
	bottom:1rem;
	z-index: 2;
}
#Index .sec3 .marquee{
	font-family: 'Poppins';
	font-size:4.7rem;
	color:#007C57;
	font-weight:900;
	transform:skew(-12deg);
	letter-spacing: 0.7rem;
	position:absolute;
	width:100%;
	top:50%;
	line-height:1.1;
}
#Index .sec3 .marq1 {
	transform:skew(-12deg) translate(0,-120%);
}
#Index .sec3 .marquee .bor {
	color:#fff;
	text-shadow: -1px 0 #007C57, 0 1px #007C57, 1px 0 #007C57, 0 -1px #007C57;
	letter-spacing: 0;
}
.flow_banner .list > li:nth-child(3n+1) {
	background:#CCE5DD;
}
.flow_banner .list > li:nth-child(3n+2) {
	background:#E2F5EC;
}
.flow_banner .list > li:nth-child(3n) {
	background:#FBF2DC;
}
#right_flow .list > li:nth-child(3n+1) {
	background:#E2F5EC;
}
#right_flow .list > li:nth-child(3n+2) {
	background:#FBF2DC;
}
#right_flow .list > li:nth-child(3n) {
	background:#CCE5DD;
}

.flow_banner {
	overflow: hidden;
	display: flex;
}
.flow_banner .list {display: flex;}
.flow_banner .list > li {
	white-space: nowrap;
	width:15rem;
	height:15rem;
	border-radius:1rem;
	margin:0 0.5rem;
	position:relative;
	background:#CCE5DD;
	display:inline-flex;
	display:-webkit-inline-flex;
	align-items: center;
	justify-content: center;
}
.flow_banner .list > li a {
	display:inline-block;
	max-height:90%;
}
.flow_banner .list > li img{
	width:90%;
	max-height:90%;
	max-width:10.8rem;
	transition:all 0.3s ease;
}
.flow_banner .list > li:hover img{
	transform:scale(1.05);
}
#right_flow {
	flex-direction: row-reverse;
}
@keyframes flowRolling {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}
@keyframes flowRolling2 {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(100%);
    }
}

#Index .sec4 {
	text-align:center;
	background:#EBFFF5;
}
#Index .sec4 .sec4_next {
	position:absolute;
	right:0;
	top:50%;
	transform:translate(0,-50%);
	z-index: 2;
}
#Index .sec4 .sec4_prev {
	position:absolute;
	left:calc(50% - 42rem);
	top:50%;
	transform:translate(0,-50%);
	z-index: 2;
}
#Index .sec4 .sec4_next {
	position:absolute;
	right:calc(50% - 42rem);
	top:50%;
	transform:translate(0,-50%);
	z-index: 2;
}
#Index .sec4 .wrap {
	position:relative;
}
#Index .sec4_swiper {
	margin-left:10rem;
	overflow:hidden;
}
#Index .sec4_swiper .swiper-slide{
	border-radius:1rem; 
	width:auto !important;
	overflow:hidden;
}
#Index .sec4_swiper .swiper-slide img {
	max-width:90vw;
	max-height:60vw;
}
#Index .sec5 {
	text-align:center;
}
#Index .sec5 .swiper-slide a img {
	/* width:100%;
	height:100%;
	object-fit: contain; */
}
#Index .sec5 .insta_ico {
	width:2.8rem;
}
#Index .sec5 .wrap_1680 {
	position:relative;
	/* border:1px solid black; */
}
#Index .sec5_swiper {
	max-width:1530px;
	width:90%;
	overflow:hidden;
}
#Index .sec5_swiper .swiper-slide {
	/* border-radius:1rem; */
	overflow:hidden;
}
#Index .sec5 .sec5_prev {
	position:absolute;
	left:0;
	top:50%;
	transform:translate(0,-50%);
}
#Index .sec5 .sec5_next {
	position:absolute;
	right:0;
	top:50%;
	transform:translate(0,-50%);
}
#Index .sec5 .swiper-button img{
	width:2.5rem !important;
}
#Index .sec6 {
	background:url(/img/index/sec6_bg.jpg) no-repeat 50%;
	background-size:cover;
	color:#fff;
}
#Index .sec6 .d-flex {
	align-items:center;
}
#Index .sec6 .d-flex h2 {
	font-size:2.5rem;
	font-family: 'GmarketSans';
}
#Index .d-flex img {
	width:2.94rem;
}
#Index .d-flex p {
	font-size:1.2rem;
	font-weight:500;
}
@media screen and (max-width:1680px) {
	#Index .sec4_swiper {
		margin-left:5%;
	}
	#Index .sec4 .sec4_next {
		right:1rem;
	}
	#Index .sec4 .sec4_prev {
		left:1rem;
	}
}
@media screen and (max-width:1280px) {
	#Index .sec1 .swiper-slide img {
		min-height:34rem;
	}
	#Index .sec1 .scrolldown {
		margin-top:4.5rem;
	}
	#Index .page_wrap {
		top: calc(50% + 10.5rem);
	}
	.flow_banner .list > li img {
		max-height:80%;
		width:70%;
	}
}
@media screen and (max-width:768px) {
	#Index section {
		padding:6rem 0;
	}
	#Index .d-flex p {
		font-size:0.9rem;
	}
	#Index .page_wrap {
		top:auto;
		bottom:6rem;
	}
	#Index .page_wrap .scrolldown {
		display:none;
	}
	#Index .sec1 .swiper-slide .wrap_1530 {
		transform:translate(-50%,0);
		bottom:9rem;
		top:auto;
	}
	#Index .sec1 .swiper-slide h3 {
		max-width:90%;
	}
	#Index .sec1 .swiper-slide h2 {
		font-size:2.75rem;
		height:7.5rem;
		max-width:90%;
	}
	#Index .sec3 .battery {
		width:6.5rem;
	}
	#Index .sec3_swiper .swiper-slide img {
		max-width:55%;
	}
	#Index .sec4 .sec4_prev,
	#Index .sec4 .sec4_next {
		display:none;
	}

	#Index .sec5_swiper .swiper-slide {
		width:auto !important;
	}
	#Index .sec5_swiper .swiper-slide img {
		width:13rem;
	}
	#Index .sec4 .sec4_prev ,
	#Index .sec5 .sec5_prev {
		transform:translate(-50%,-50%)
	}
	#Index .sec4 .sec4_next ,
	#Index .sec5 .sec5_next {
		transform:translate(50%,-50%)
	}
	#Index .sec5 .wrap_1680 {
		width:100%;
		margin-left:5%;
	}
	#Index .sec5_swiper {
		overflow:visible;
	}
	#Index .sec5 .insta {
		width:2rem;
	}
	#Index .sec5 .swiper-navigation {
		display:none;
	}
	#Index .sec6 {
		padding:4.5rem 0;
	}
	#Index .sec6 .d-flex {
		flex-direction: column;
		gap:2rem;
		justify-content: center;
		text-align:center;
	}
	#Index .sec6 .d-flex h2 {
		font-size:2rem;
	}
}