@charset "UTF-8";


.sec01 {position: relative;}
.sec01 .bg_box {position: relative; padding-bottom: 47.8%; overflow: hidden;}
.sec01 .bg_box .bg_inner {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%;}
.sec01 .bg_box .bg_inner video {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover;}
.sec01 .text_area {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); padding: 105px 0 0; width: 943px;}
.sec01 .text_area .logo_box {}
.sec01 .text_area .logo_box img {}
.sec01 .text_area .text_box {display: flex; margin: 25px 0 0;}
.sec01 .text_area .text_box .left_box {width: 280px;}
.sec01 .text_area .text_box .right_box {}
.sec01 .text_area .text_box .right_box .text {font-family: "Montserrat"; font-weight: 500; font-size: 24px; line-height: 30px; color: #ffffff;}
.sec01 .text_area .text_box .right_box .btn_box {display: flex; gap: 0 45px; margin: 45px 0 0;}
.sec01 .text_area .text_box .right_box .btn_box .youtube_btn {display: block; }
.sec01 .text_area .text_box .right_box .btn_box .app_btn {display: block; width: 225px; border-radius: 10px; background-color: #fff; text-align: center;}
.sec01 .text_area .text_box .right_box .btn_box .app_btn .txt {display: inline-block; padding: 0 85px 0 0; background: url("/kor/images/main/sec01_arrow.png") no-repeat right center; font-weight: 500; font-size: 18px; line-height: 48px; color: #000000; transition: all 0.5s;}
.sec01 .text_area .text_box .right_box .btn_box .app_btn:hover .txt, .sec01 .text_area .text_box .right_box .btn_box .app_btn:focus .txt {background-position: right 5px center;}
.sec01 .text_area .text_box .right_box .logo_list {display: flex; gap: 0 35px; margin: 65px 0 0;}
.sec01 .text_area .text_box .right_box .logo_list li {}
.sec01 .text_area .text_box .right_box .logo_list li img {}


.sec02 {padding: 60px 0 100px;}
.sec02 .title_area {text-align: center;}
.sec02 .title_area .title {font-family: "Montserrat"; font-weight: 600; font-size: 40px; line-height: 44px; color: #040000;}
.sec02 .info_box {display: flex; gap: 0 65px; margin: 65px 0 0;}
.sec02 .info_box .img_slide_area {position: relative; width: 42.1875%; flex-shrink: 0;}
.sec02 .info_box .img_slide_area .img_btn_box {position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; z-index: 99;}
.sec02 .info_box .img_slide_area .img_btn_box .img_btn {position: absolute; top: 0;}
.sec02 .info_box .img_slide_area .img_btn_box .img_btn.prev {left: 22px;}
.sec02 .info_box .img_slide_area .img_btn_box .img_btn.next {right: 22px;}
.sec02 .info_box .img_slide_area .img_btn_box .img_btn img {}
.sec02 .info_box .img_slide_area .img_slide {overflow: hidden;}
.sec02 .info_box .img_slide_area .img_slide .list {}
.sec02 .info_box .img_slide_area .img_slide .list li {}
.sec02 .info_box .img_slide_area .img_slide .list li .img_box {}
.sec02 .info_box .img_slide_area .img_slide .list li .img_box img {}
.sec02 .info_box .text_box {display: flex; flex-direction: column;}
.sec02 .info_box .text_box .text_top {}
.sec02 .info_box .text_box .text_top .title {font-weight: 600; font-size: 21px; line-height: 30px; color: #040000;}
.sec02 .info_box .text_box .text_top .text {margin: 35px 0 0; font-weight: 400; font-size: 18px; line-height: 26px; color: #040000;}
.sec02 .info_box .text_box .text_mid {margin: 40px 0 0;}
.sec02 .info_box .text_box .text_mid .info_list {}
.sec02 .info_box .text_box .text_mid .info_list .list {}
.sec02 .info_box .text_box .text_mid .info_list .list li {margin: 10px 0 0;}
.sec02 .info_box .text_box .text_mid .info_list .list li:first-child {margin: 0;}
.sec02 .info_box .text_box .text_mid .info_list .list li .box {display: flex; gap: 0 15px; align-items: start;}
.sec02 .info_box .text_box .text_mid .info_list .list li .box .title {width: 80px; background-color: #5fb3e5; border-radius: 15px; font-weight: 400; font-size: 16px; line-height: 28px; color: #ffffff; text-align: center;}
.sec02 .info_box .text_box .text_mid .info_list .list li .box .text {font-weight: 600; font-size: 21px; line-height: 28px; color: #040000;}
.sec02 .info_box .text_box .text_mid .info_list .list li .box .text.ft_s {font-weight: 400; font-size: 18px; line-height: 26px; color: #040000;}

.sec02 .info_box .text_box .text_btm {margin: 70px 0 0;}
.sec02 .info_box .text_box .text_btm .view_btn {display: block; width: 160px; background-color: #3256af; border: 1px solid #3256af; border-radius: 5px; font-weight: 600; font-size: 16px; line-height: 38px; color: #ffffff; text-align: center;}
.sec02 .info_box .text_box .text_btm .view_btn:hover, .sec02 .info_box .text_box .text_btm .view_btn:focus {background-color: #fff; color: #3256af;}





.sec03 {padding: 90px 0 100px; background: url("/kor/images/main/sec03_bg.png") no-repeat center / cover;}
.sec03 .icon_area {}
.sec03 .icon_area .list {display: flex; gap: 0 200px; justify-content: center;}
.sec03 .icon_area .list li {width: 100%; max-width: 245px;}
.sec03 .icon_area .list li .box {display: block;}
.sec03 .icon_area .list li .box .img_box {display: flex; align-items: center; justify-content: center; width: 150px; height: 150px; margin: 0 auto; border-radius: 50%; background-color: #fff;}
.sec03 .icon_area .list li .box .img_box img {;}
.sec03 .icon_area .list li .box:hover .img_box img, .sec03 .icon_area .list li .box:focus .img_box img {animation: scrollani 500ms 0ms infinite ease;}
.sec03 .icon_area .list li .box .text_box {margin: 20px 0 0; text-align: center;}
.sec03 .icon_area .list li .box .text_box .title {font-weight: 700; font-size: 24px; line-height: 30px; color: #ffffff;}
.sec03 .icon_area .list li .box .text_box .text {margin: 10px 0 0; font-weight: 300; font-size: 16px; line-height: 20px; color: #ffffff;}


@keyframes scrollani {
	0% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(4px);
	}

	100% {
		transform: translateY(0);
	}
}




@media screen and (max-width: 1600px) {
	.sec01 .text_area {width: 700px;}
	.sec01 .text_area .text_box .left_box {width: 209px}
	.sec01 .text_area .text_box .right_box .logo_list {margin: 40px 0 0;}
}

@media screen and (max-width: 1400px) {
	

	.sec01 .text_area {width: 540px; padding: 90px 0 0;}
	.sec01 .text_area .text_box .left_box {width: 200px}
	.sec01 .text_area .text_box .right_box .logo_list {margin: 40px 0 0;}
	.sec01 .text_area .text_box .right_box .text {font-size: 20px; line-height: 26px;}

	.sec01 .text_area .text_box .right_box .btn_box {gap: 0 30px; margin: 30px 0 0;}
	.sec01 .text_area .text_box .right_box .btn_box .youtube_btn img {height: 38px;}
	.sec01 .text_area .text_box .right_box .btn_box .app_btn {width: 180px;}
	.sec01 .text_area .text_box .right_box .btn_box .app_btn .txt {padding: 0 60px 0 0; font-size: 16px; line-height: 38px;}

	


	.sec01 .text_area .text_box .right_box .logo_list {margin: 30px 0 0; gap: 0 20px;}

	.sec02 {padding: 40px 0 60px;}
	.sec02 .title_area .title {font-size: 30px; line-height: 34px;}
	.sec02 .info_box {gap: 0 30px; margin: 40px 0 0; align-items: start;}
	.sec02 .info_box .text_box .text_top .title {font-size: 18px; line-height: 26px;}
	.sec02 .info_box .text_box .text_top .text {margin: 20px 0 0; font-size: 16px; line-height: 24px;}
	.sec02 .info_box .text_box .text_mid {margin: 30px 0 0;}
	.sec02 .info_box .text_box .text_mid .info_list .list li .box .text {font-size: 18px; line-height: 26px;}
	.sec02 .info_box .text_box .text_mid .info_list .list li .box .text.ft_s { font-size: 16px; line-height: 24px;}
	.sec02 .info_box .text_box .text_btm {margin: 30px 0 0;}



	.sec03 {padding: 60px 0 70px;}
	.sec03 .icon_area .list {gap: 0 100px;}
	.sec03 .icon_area .list li .box .img_box {width: 120px; height: 120px;}
	.sec03 .icon_area .list li .box .img_box img {height: 70px;}
	.sec03 .icon_area .list li .box .text_box .title {font-size: 20px; line-height: 24px;}
	.sec03 .icon_area .list li .box .text_box .text {font-size: 14px; line-height: 18px;}

}

@media screen and (max-width: 1280px) {

}
@media screen and (max-width: 1080px) {
	.sec01 .text_area {width: 420px; padding: 56px 0 0;}
	.sec01 .text_area .text_box {margin: 15px 0 0;}
	.sec01 .text_area .text_box .left_box {width: 190px}
	.sec01 .text_area .text_box .right_box .logo_list {margin: 30px 0 0;}
	.sec01 .text_area .text_box .right_box .text {font-size: 16px; line-height: 22px;}

	.sec01 .text_area .text_box .right_box .btn_box {gap: 0 20px; margin: 20px 0 0;}
	.sec01 .text_area .text_box .right_box .btn_box .youtube_btn img {height: 34px;}
	.sec01 .text_area .text_box .right_box .btn_box .app_btn {width: 130px; }
	.sec01 .text_area .text_box .right_box .btn_box .app_btn .txt {padding: 0 40px 0 0; font-size: 14px; line-height: 34px;}
	.sec01 .text_area .text_box .right_box .logo_list {margin: 20px 0 0; gap: 0 10px;}	
	

	.sec02 {padding: 30px 0 40px;}
	.sec02 .title_area .title {font-size: 24px; line-height: 30px;}
	.sec02 .info_box {gap: 0 20px; margin: 30px 0 0;}
	.sec02 .info_box .text_box .text_top .title {font-size: 16px; line-height: 24px;}
	.sec02 .info_box .text_box .text_top .text {margin: 10px 0 0; font-size: 14px; line-height: 20px;}
	.sec02 .info_box .text_box .text_mid {margin: 20px 0 0;}
	.sec02 .info_box .text_box .text_mid .info_list .list li {margin: 6px 0 0;}
	.sec02 .info_box .text_box .text_mid .info_list .list li .box {gap: 0 5px;}
	.sec02 .info_box .text_box .text_mid .info_list .list li .box .title {width: 60px; font-size: 14px; line-height: 24px;}
	.sec02 .info_box .text_box .text_mid .info_list .list li .box .text {font-size: 16px; line-height: 24px;}
	.sec02 .info_box .text_box .text_mid .info_list .list li .box .text.ft_s {font-size: 14px; line-height: 20px;}
	.sec02 .info_box .text_box .text_btm {margin: 20px 0 0;}
	.sec02 .info_box .text_box .text_btm .view_btn {width: 120px; font-size: 14px; line-height: 30px;}



	.sec03 {padding: 40px 0;}
	.sec03 .icon_area .list {gap: 0 50px;}
	.sec03 .icon_area .list li .box .img_box {width: 100px; height: 100px;}
	.sec03 .icon_area .list li .box .img_box img {height: 55px;}
	.sec03 .icon_area .list li .box .text_box {margin: 10px 0 0;}
	.sec03 .icon_area .list li .box .text_box .title {font-size: 18px; line-height: 20px;}
	.sec03 .icon_area .list li .box .text_box .text {margin: 6px 0 0;}






}


@media screen and (max-width: 767px) {
	.sec01 .bg_box {padding-bottom: 0;}
	.sec01 .bg_box .bg_inner {position: inherit; left: inherit; top: inherit; transform: translate(0, 0); height: 450px; }
	.sec01 .bg_box .bg_inner video {position: inherit; left: inherit; top: inherit; transform: translate(0, 0)}
	
	.sec01 .text_area {width: 100%; padding: 56px 10px 0;}
	.sec01 .text_area .logo_box {text-align: center;}
	.sec01 .text_area .logo_box img {width: 300px;}
	.sec01 .text_area .text_box {margin: 10px 0 0;}
	.sec01 .text_area .text_box .left_box {display: none;}
	.sec01 .text_area .text_box .right_box {width: 100%; text-align: center;}
	.sec01 .text_area .text_box .right_box .logo_list li img {height: 30px;}

	.sec01 .text_area .text_box .right_box .btn_box {gap: 0 10px; margin: 15px 0 0; justify-content: center;}
	.sec01 .text_area .text_box .right_box .btn_box .youtube_btn img {height: 30px;}
	.sec01 .text_area .text_box .right_box .btn_box .app_btn .txt {padding: 0 20px 0 0; line-height: 30px;}
	.sec01 .text_area .text_box .right_box .logo_list {justify-content: center; margin: 15px auto 0;}
	
	.sec02 .info_box {flex-direction: column; gap: 10px; margin: 10px 0 0;}
	.sec02 .info_box .img_slide_area {width: 100%; max-width: 540px; margin: 0 auto;}
	.sec02 .info_box .img_slide_area .img_slide .list li .img_box {text-align: center;}
	.sec02 .info_box .img_slide_area .img_btn_box .img_btn.prev {left: 10px;}
	.sec02 .info_box .img_slide_area .img_btn_box .img_btn.next {right: 10px;}
	.sec02 .info_box .img_slide_area .img_btn_box .img_btn img {width: 12px;}
	.sec02 .info_box .text_box .text_mid {margin: 10px 0 0;}
	.sec02 .info_box .text_box .text_mid .info_list .list li .box .text {font-size: 14px; line-height: 20px;}
	.sec02 .info_box .text_box .text_mid .info_list .list li .box .text.ft_s br {display: none;}
	.sec02 .info_box .text_box .text_btm {margin: 10px 0 0;}

	.sec03 {padding: 30px 0;}
	.sec03 .icon_area .list {gap: 0 20px;}
	.sec03 .icon_area .list li .box .img_box {width: 80px; height: 80px;}
	.sec03 .icon_area .list li .box .img_box img {height: 45px;}
	.sec03 .icon_area .list li .box .text_box {margin: 6px 0 0;}
	.sec03 .icon_area .list li .box .text_box .title {font-size: 16px; line-height: 18px;}
}


@media screen and (max-width: 480px) {
	.sec03 .icon_area {width: 100%; max-width: 290px; margin: 0 auto;}
	.sec03 .icon_area .list {flex-direction: column; gap: 10px;}
	.sec03 .icon_area .list li {max-width: 100%}
	.sec03 .icon_area .list li .box {display: flex; align-items: center; gap: 10px;}
	.sec03 .icon_area .list li .box .img_box {flex-shrink: 0; width: 60px; height: 60px;}
	.sec03 .icon_area .list li .box .img_box img {height: 34px;}
	.sec03 .icon_area .list li .box .text_box {width: 100%; margin: 0; text-align: left;}

	.sec02 .info_box .text_box .text_top .title {font-size: 14px; line-height: 20px;}
	.sec02 .info_box .text_box .text_top .title  br {display: none;}
	.sec02 .info_box .text_box .text_mid .info_list .list li .box .title {flex-shrink: 0; width: 45px;}
	.sec02 .info_box .text_box .text_btm .view_btn {width: 100px; line-height: 28px;}





	
}




