/* 서브페이지 공통 */
._sub{
	--borderRadius:20px;
}
._sub h2{font-size: 40px; font-weight: 700; letter-spacing: -0.025em; padding-top: 62px; text-align: center;}

._tit{
	font-size: 44px; font-weight: 700; letter-spacing: -0.025em;
	line-height: 1.4; overflow: hidden;
}
._tit > div{overflow: hidden;}
._roboto{font-family: 'Roboto';}


@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {
	._tit{font-size: 40px;}
}
@media screen and (max-width:1024px) {}
@media screen and (max-width:820px) {
	._sub h2{font-size: 36px;}
	._tit{font-size: 36px;}
}
@media screen and (max-width:500px) {
	._sub h2{font-size: clamp(22px,calc(36/500*100vw),34px);}
	._tit{font-size: clamp(22px,calc(36/500*100vw),34px);}
}
@media screen and (max-width:320px) {}

/* 색상 채워지는 모션 할때 */
._filling{
	-webkit-background-clip: text !important;
	-webkit-text-fill-color: transparent;
}



._paging{font-size: 15px; text-align: center;}
._paging > div{
	display: inline-flex; justify-content: center; position: relative;
}
._paging > div .prev,
._paging > div .next{
	display: flex; justify-content: center;
	position: absolute; top: 0; bottom: 0;
}
._paging > div .prev{right: 100%;}
._paging > div .next{left: 100%;}
._paging .arrowDouble{color: #7c7c7c; display: flex; align-items: center; justify-content: center; padding: 0 0.2em;}
html.pc ._paging .arrowDouble:hover{color: #fff;}
._paging .arrowDouble.first{}
._paging .arrowDouble i:nth-child(1){margin-right: -0.7em;}
._paging .arrowDouble.end{}
._paging .arrow{color: #7c7c7c; display: flex; align-items: center; justify-content: center; padding: 0 0.2em;}
html.pc ._paging .arrow:hover{color: #fff;}
._paging .arrow.prev{}
._paging .arrow.next{}
._paging ul{
	display: flex; align-items: center; justify-content: center;
	margin: 0 10px; gap: 2px;
}
._paging ul li{}
._paging ul li a{
	width: 26px; height: 26px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
}
._paging ul li.on a{background-color: var(--green);}



/* 핸드폰안에 비디오 공통 */
.video_in_phone{
	font-size: 1px; width: 322em;
	background-image: url(/asset/img/sub/phone.png); background-position: center;
	background-size: cover; position: relative;
	display: flex; align-items: center; justify-content: center;
}
.video_in_phone::before {
	content:''; display: block;
	/* 프레임 작은거 */
	/* padding-bottom: calc(588/344*100%); */
	/* 프레임 긴거 */
	padding-bottom: calc(714/344*100%);
}
.video_in_phone .videoBx{
	width: 91.5%;
    height: 95%;

	position: absolute;
	border-radius: 42em; overflow: hidden;
}
.video_in_phone .videoBx iframe{width: 100%; height: 100%; position: relative;}
.video_in_phone .phoneImg{}





/* 비디오 플레이버튼 + 커버 */
.video_cover{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%;
	background-color: rgba(0,0,0,0.5); transition: opacity 0.2s; z-index: 2;
	display: none;
}
.videoBx.on .video_cover{opacity: 0;}
.videoBx.on.hover .video_cover{opacity: 1;}

.videoBx .thumb{position: absolute;width: calc(100% - 2px);height: calc(100% - 2px);object-fit: contain;}

.video_ico{
	position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);
	display: flex; align-items: center; justify-content: center;
	width: 57px; height: 57px; transition: opacity 0.2s; z-index: 3;
	display: none
}
.videoBx.on .video_ico{opacity: 0;}
.videoBx.on.hover .video_ico{opacity: 1;}

.video_ico img{position: absolute; opacity: 0; transition: opacity 0.2s;}
.video_ico img:nth-child(1){opacity: 1;}
.videoBx.on .video_ico img:nth-child(1){opacity: 0;}
.videoBx.on .video_ico img:nth-child(2){opacity: 1;}