* {margin:0;padding:0}
.teaser {overflow:hidden;position:relative}
.teaser .centerBox {width:1080px;margin:0 auto}

/* Áö³­È£º¸±â */
.topNavi {position:absolute;top:0;left:50%;z-index:10;width:1080px;margin-left:-540px}
.topNavi .centerBox {position:relative;height:110px;}
.topNavi .centerBox .btn_news {display:block;position:absolute;top:50%;right:0;margin-top:-8px}
.cnt_top .centerBox {position:relative;height:307px}

/* °Ô½ÃÆÇ ´ñ±Û */
.comment_write {width:1080px;margin:0 auto;padding:0 0 55px 0;box-sizing:border-box;background-color:#fff}
.comment_list {padding:0 0 50px 0;box-sizing:border-box;background-color:#fff}
.comment_area table{width: 100%; border-spacing:0}
.comment_area table th{font-size: 26px; font-weight: bold; color:#2a2a30; text-align: center;  border-top: 2px solid #000; border-bottom: 1px solid #ccc; padding: 25px 0px;}
.comment_area table td{font-size: 26px;  color:#2a2a30; text-align: center; border-bottom: 1px solid #ccc; padding: 25px 0px; font-family: 'Noto Sans CJK KR', NotoSans; letter-spacing:-0.03em;}
.comment_area table td:nth-child(4){text-align: left;}
.comment_area form {overflow:hidden;width:1080px;margin:0 auto;border: 1px solid #000;box-sizing:border-box}
.comment_area textarea{float:left; background-color: #f4f4f4; height: 80px; border: none; font-size: 20px; outline: 0 none; width: 940px; padding: 10px; box-sizing: border-box; font-family: 'Noto Sans CJK KR', NotoSans; color:#111; resize:none}
.comment_area input[type="button"]{width:138px; background-color: #000; height: 80px; border: none; font-size: 26px; outline: 0 none; vertical-align: bottom; line-height:80px; color:#fff; font-family:"Malgun Gothic";}

/* °Ô½ÃÆÇ ´ñ±Û ÆäÀÌ¡ */
.pg_wrap{clear: both; margin-top:50px; text-align: center;}
.pg_wrap .pg > strong{font-size: 26px; color:#2a2a30; margin: 0px 10px; font-weight: bold; vertical-align: middle;}
.pg_wrap .pg > a {font-size: 26px; color:#2a2a30; margin: 0px 10px; vertical-align: middle;}
.pg_start, .pg_end{width: 30px; height: 30px; border: 1px solid #ccc; display: inline-block; text-indent:-9999px}
.pg_start {background:url('../images/btn_pg_nav.jpg')no-repeat left top;}
.pg_end {background:url('../images/btn_pg_nav.jpg')no-repeat right top;}


/* cnt_1 : ºñÁÖ¾ó */
.cnt_1 {position:relative;height:1014px;}
.cnt_1 .bg {overflow:hidden;}
.cnt_1 .bg .left {overflow:hidden;float:left;position:relative;width:50%;height:1014px;background-color:#0fa132}
.cnt_1 .bg .left img {position:absolute;top:0;right:440px;margin-right:-1080px;transition:0.8s}
.cnt_1 .bg .right {overflow:hidden;float:right;position:relative;width:50%;height:1014px;background-color:#ffc501}
.cnt_1 .bg .right img {position:absolute;top:0;left:490px;margin-left:-1080px;transition:0.8s}
.cnt_1 .bg .left.ani img {margin:0}
.cnt_1 .bg .right.ani img {margin:0}

.cnt_1 .centerBox {position:absolute;top:0;left:50%;width:1080px;height:1014px;margin-left:-540px}
.cnt_1 .box_title {overflow:hidden;height:470px}
.cnt_1 .box_title .left {float:left;margin-top:-1000px;transition:0.6s}
.cnt_1 .box_title .right {float:right;margin-top:1000px;transition:0.6s}
.cnt_1 .box_title .left.ani {margin:0}
.cnt_1 .box_title .right.ani {margin:0}

.cnt_1 .box_item {height:245px;position:relative}
.cnt_1 .box_item .item_01 {position:absolute;top:0;left:0;transform:scale(1.1);opacity:0;}
.cnt_1 .box_item .item_01.ani {animation:item01_ani 0.8s ease-in-out forwards}
.cnt_1 .box_item .item_thumb {display:none;position:absolute;top:20px;right:156px}
.cnt_1 .box_item .item_thumb {animation:thumb_ani 0.5s steps(2) infinite}
.cnt_1 .box_item .item_txt {display:none;position:absolute;bottom:0;left:0}

.cnt_1 .btn_quick {display:block;position:relative;width:742px;margin:0 auto;opacity:0;transition:0.2s}
.cnt_1 .btn_quick:after {display:block;position:absolute;bottom:47px;right:111px;z-index:9;width:22px;height:22px;border-radius:50%;background-color:#1cda51;content:''}
.cnt_1 .btn_quick:after {animation:rnd_ani 0.8s linear infinite}
.cnt_1 .btn_quick .item_finger {position:absolute;bottom:15px;right:100px;z-index:10}
.cnt_1 .btn_quick .item_finger {animation:click_ani 0.4s ease-in-out infinite alternate}
.cnt_1 .btn_quick.ani {opacity:1}

.cnt_1 .box_airplane {position:absolute;top:311px;left:-325px;width:402px;height:285px}
.cnt_1 .box_airplane .item_dot {opacity:0}
.cnt_1 .box_airplane .item_dot.ani {animation:blink_ani 1s ease-in-out infinite alternate}
.cnt_1 .box_airplane .item_airplane {position:absolute;top:105px;right:28px;;transform:rotate(-10deg);opacity:0}
.cnt_1 .box_airplane .item_airplane.ani {animation:airplane_ani 0.3s linear forwards}

.cnt_1 .tab_list {position:absolute;bottom:0;left:0;}
.cnt_1 .tab_list:after {display:block;clear:both;content:''}
.cnt_1 .tab_list li {float:left;}
.cnt_1 .tab_list li a {display:block;position:relative;width:540px;height:114px}
.cnt_1 .tab_list li img.on {position:absolute;top:0;left:0;opacity:0;transition:0.2s}
.cnt_1 .tab_list li.active img.on {opacity:1}


/* cnt_2 */
.cnt_2 .tab_cont {display:none}
.cnt_2 .tab_cont#tabCont1 {display:block}

/* cnt_2:2022Çг⵵ ÀÓ¿ë½ÃÇèÀ» ÁغñÇÑ´Ù¸é? */
#tabCont1 .box_1 .centerBox {position:relative}
#tabCont1 .box_1 .deco {position:absolute;bottom:330px;right:34px}
#tabCont1 .box_1 .deco {animation:deco_ani 0.5s steps(2) infinite}
#tabCont1 .box_1 .btn_link {position:absolute;bottom:170px;right:170px;border-radius:30px;background-color:#323934;box-shadow:11px 5px 13px rgba(0,0,0,0.32);transition:0.2s}
#tabCont1 .box_1 .btn_link:hover {margin:0 0 -5px 0;box-shadow:10px 3px 10px rgba(0,0,0,0.5);background-color:#111}
#tabCont1 .box_2 {padding-bottom:107px;background-color:#599e6c}
#tabCont1 .box_2 .centerBox {position:relative}
#tabCont1 .box_2 .deco {position:absolute;top:1106px;right:180px}
#tabCont1 .box_2 .deco {animation:blink_ani 0.6s linear infinite alternate}
#tabCont1 .box_2 .btn_link {display:block;position:relative;width:847px;height:130px;margin:0 auto}
#tabCont1 .box_2 .btn_link:after {display:block;position:absolute;bottom:35px;right:48px;width:22px;height:22px;border-radius:50%;background-color:#1cda51;content:''}
#tabCont1 .box_2 .btn_link:after {animation:rnd_ani 0.8s linear infinite}
#tabCont1 .box_2 .btn_link img {position:absolute;top:0;left:0}
#tabCont1 .box_2 .btn_link:before {display:block;position:absolute;bottom:2px;right:38px;z-index:10;width:32px;height:45px;background:url(../images/visual_item_finger.png) 0 0 no-repeat;content:'';opacity:0;transition:0.3s}
#tabCont1 .box_2 .btn_link:before {animation:click_ani 0.4s ease-in-out infinite alternate}
#tabCont1 .box_2 .btn_link:hover:before {opacity:1}
#tabCont1 .box_2 .list {position:absolute;top:267px;left:0;width:1081px}
#tabCont1 .box_2 .list li {height:137px;border-radius:10px;margin-bottom:20px;font-size:0;background:rgba(0,0,0,0.1);transition:0.2s}
#tabCont1 .box_2 .list li:nth-child(1) {margin-bottom:22px}
#tabCont1 .box_2 .list li:nth-child(2) {margin-bottom:17px}
#tabCont1 .box_2 .list li:nth-child(4) {margin-bottom:22px}
#tabCont1 .box_2 .list li:hover {box-shadow:0px 0px 20px #284330}
#tabCont1 .box_3 {padding-bottom:111px;background-color:#fffcef}
#tabCont1 .box_3 .btn_link {display:block;position:relative;width:847px;height:130px;margin:0 auto}
#tabCont1 .box_3 .btn_link:after {display:block;position:absolute;bottom:33px;right:242px;width:22px;height:22px;border-radius:50%;background-color:#dfc131;content:''}
#tabCont1 .box_3 .btn_link:after {animation:rnd_ani 0.8s linear infinite}
#tabCont1 .box_3 .btn_link img {position:absolute;top:0;left:0}
#tabCont1 .box_3 .btn_link:before {display:block;position:absolute;bottom:2px;right:232px;z-index:10;width:32px;height:45px;background:url(../images/visual_item_finger.png) 0 0 no-repeat;content:'';opacity:0;transition:0.3s}
#tabCont1 .box_3 .btn_link:before {animation:click_ani 0.4s ease-in-out infinite alternate}
#tabCont1 .box_3 .btn_link:hover:before {opacity:1}

/* cnt_2:2021Çг⵵ 2Â÷½ÃÇèÀ» ÁغñÁßÀ̶ó¸é? */
#tabCont2 .box_1 .centerBox {position:relative;height:1310px}
#tabCont2 .box_1 .centerBox:before {display:block;position:absolute;top:841px;left:256px;width:239px;height:43px;background-color:rgba(255,209,0,0.7);content:''}
#tabCont2 .box_1 .centerBox:before {animation:line_ani 2s ease-in-out infinite}
#tabCont2 .box_1 .cnt {position:absolute;top:0;left:0;}
#tabCont2 .box_1 .star {position:absolute;top:282px;right:116px}
#tabCont2 .box_1 .star {animation:deco_ani 0.5s steps(2) infinite}
#tabCont2 .box_1 .heart {position:absolute;top:561px;left:53px}
#tabCont2 .box_1 .heart {animation:thumb_ani 0.5s steps(2) infinite}
#tabCont2 .box_2 {background-color:#c6e0cd}
#tabCont2 .box_3 {padding-bottom:108px;background-color:#fffcef}
#tabCont2 .box_3 .list_keyword {margin-bottom:71px}
#tabCont2 .box_3 .list_keyword:after {display:block;clear:both;content:''}
#tabCont2 .box_3 .list_keyword li {float:left;width:356px;height:563px;margin:0 6px 17px 0;border-radius:24px;line-height:0;background-color:#bcb181}
#tabCont2 .box_3 .list_keyword li:nth-child(3n) {margin-right:0}
#tabCont2 .box_3 .list_keyword li img {transition:0.2s}
#tabCont2 .box_3 .list_keyword .keyword {display:block;border-radius:22px;background-color:#FFFDF4;transition:0.2s}
#tabCont2 .box_3 .list_keyword li:hover .keyword {margin:-10px 0 0 0;background-color:#fff}
#tabCont2 .box_3 .btn_link {display:block;position:relative;width:847px;height:130px;margin:0 auto;border-radius:10px;background-color:#282828}
#tabCont2 .box_3 .btn_link:after {display:block;position:absolute;bottom:35px;right:208px;z-index:9;width:22px;height:22px;border-radius:50%;background-color:#bfa62f;content:''}
#tabCont2 .box_3 .btn_link:after {animation:rnd_ani 0.8s linear infinite}
#tabCont2 .box_3 .btn_link:before {display:block;position:absolute;bottom:2px;right:198px;z-index:10;width:32px;height:45px;background:url(../images/visual_item_finger.png) 0 0 no-repeat;content:'';opacity:0;transition:0.3s}
#tabCont2 .box_3 .btn_link:before {animation:click_ani 0.4s ease-in-out infinite alternate}
#tabCont2 .box_3 .btn_link:hover:before {opacity:1}
#tabCont2 .box_3 .btn_link img {position:absolute;top:0;left:0}


/* cnt_3 : ´ñ±Û */
.cnt_3 {padding-bottom:50px;background-color:#fff}
.cnt_3 .centerBox {position:relative}
.cnt_3 .centerBox .deco {position:absolute;top:76px;right:-180px}
.cnt_3 .centerBox .deco {animation:deco_ani 0.5s steps(2) infinite}


/* cnt_4 : 12¿ù, Èñ¼Ò¿¡¼­ ÁøÇàÇÏ´Â À̺¥Æ®´Â? */
.cnt_4 {overflow:hidden;padding-bottom:90px;background:#f7dc6d url(../images/bg_cnt_04.jpg) 50% 0 no-repeat}
.cnt_4 .list:after {display:block;clear:both;content:''}
.cnt_4 .list li {float:left;width:528px;height:148px;margin:0 23px 19px 0}
.cnt_4 .list li:nth-child(2n) {margin-right:0}
.cnt_4 .list li a {display:block;position:relative;width:528px;height:148px;border-radius:10px;background-color:#333;transition:0.2s}
.cnt_4 .list li a:after {display:block;position:absolute;bottom:32px;right:30px;width:77px;height:33px;background:url(../images/img_cnt_04_arr.png) 0 0 no-repeat;content:''}
.cnt_4 .list li a:after {animation:cnt4_ani 0.4s ease-in-out infinite alternate}
.cnt_4 .list li a img {transition:0.2s}
.cnt_4 .list li a:hover {box-shadow:inset 5px 5px 5px rgba(0,0,0,0.8);background-color:#222}
.cnt_4 .list li a:hover img {transform:scale(0.98)}


/* @keyframes */
@keyframes item01_ani{
	0% {transform:rotate(0);opacity:0}
	10% {transform:scale(1.1);opacity:1}
	20% {transform:scale(1.1) rotate(3deg)}
	30% {transform:scale(1.1) rotate(-3deg)}
	40% {transform:scale(1.1) rotate(3deg)}
	50% {transform:scale(1.1) rotate(-3deg)}
	60% {transform:scale(1.1) rotate(3deg)}
	70% {transform:scale(1) rotate(0);opacity:1}
	100% {transform:scale(1) rotate(0);opacity:1}
}
@keyframes thumb_ani{
	0% {transform:rotate(3deg)}
	100% {transform:rotate(-3deg)}
}
@keyframes airplane_ani{
	0% {top:105px;right:28px;transform:rotate(-10deg)}
	100% {top:65px;right:-48px;transform:rotate(0);opacity:1}
}
@keyframes click_ani{
	0% {transform:scale(0.9)}
	50% {transform:scale(1)}
	100% {transform:scale(1)}
}
@keyframes blink_ani{
	0% {opacity:0.2}
	100% {opacity:1}
}
@keyframes line_ani{
	0% {width:0}
	80% {width:239px}
	100% {width:239px}
}
@keyframes rnd_ani{
	0% {transform:scale(1);opacity:0.8}
	100% {transform:scale(2.5);opacity:0}
}
@keyframes deco_ani{
	0% {transform:rotate(-3deg)}
	100% {transform:rotate(3deg)}
}
@keyframes cnt4_ani{
	0% {margin:0;}
	100% {margin:0 -5px 0 0}
}