@charset "utf-8"; 
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@800&display=swap');


.enter_btn					{width:180px; height:52px; line-height:50px; background:url("../image/main/acc_enterbtn.png") no-repeat 40px center #4290ff; 
							background-size:25px; color:#fff; font-size:1.1em; text-align:center; letter-spacing:-1px; font-weight:500; text-indent:20px; border-radius:50px; cursor:pointer; z-index:999999; transition:all 0.2s;} 
.enter_btn:hover			{background-color:#000;}

/* 상단 ===================================================================================== */
.main_top						{position:relative; border-top:1px solid #dedede; padding:60px 0 40px 0; background:linear-gradient(#f5f7fd, #fff);}
.main_top .wrap:after			{content:''; display:block; clear:both;}
.main_top .lt					{position:relative; z-index:1; float:left; width:750px; box-shadow: 0 0 12px 0 rgba(0,0,0,0.2); margin-bottom:40px;}
.main_top .rt					{float:right; width:calc(100% - 790px);}

.searchzone						{margin-bottom:25px;}
.searchzone .box				{position:relative; width:100%; border:5px solid #2f68c2; box-sizing:border-box; }
.searchzone .search_input		{width:calc(100% - 55px); padding-left:15px; height:50px; border:0; box-sizing:border-box; font-size:0.9em; letter-spacing:-0.75px; background:#fff;}
.searchzone .search				{position:absolute; top:0; right:0; width:55px; height:50px; background:#2f68c2; cursor:pointer;}
.searchzone .search_img			{width:25px; margin:12px 0 0 17px;}
.searchzone ul					{overflow:hidden; margin-top:15px;}
.searchzone ul li				{display:inline-block; zoom:1; *display:inline; color:#333; font-size:0.9em; padding:1px 15px; border:1px solid #e0e0e0; border-radius:15px; background:#fff; letter-spacing:-1px; cursor:pointer;}
.searchzone ul li:hover			{border-color:#2f68c2; color:#2f68c2;}
.searchzone .tit				{letter-spacing:-1px; font-weight:500; border:0; background:none; font-size:16px; padding:0 15px 0 0; color:#333;}

.popupzone						{position:relative; height:250px; overflow:hidden; border:1px solid #eaeaea;}
.popupzone img					{width:100%; height:100%; object-fit:cover;}
.popupzone .control_btns		{position:absolute; right:0; bottom:0; z-index:9999;}
.popupzone .control_btns p		{position:relative; display:inline-block; cursor:pointer;}
.popupzone .count				{color:#fff; cursor:default !important; line-height:26px; font-size:0.9em; padding:0 5px; background:rgba(0, 0, 0, 0.3);}
.popupzone .count span			{margin:0 7px;}
.popupzone .btn					{display:inline-block; height:26px; padding:0 10px; background:rgba(0, 0, 0, 0.3); height:26px; }
.popupzone .arr					{content:''; border: solid #fff; border-width:0 2px 2px 0; border-radius:1px; padding: 5px; }
.popupzone .prev				{transform: rotate(135deg); -webkit-transform: rotate(135deg);}
.popupzone .next				{transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}
.popupzone .stop				{width:2px; height:13px; background:#fff; margin:0 7px 0 3px ; }
.popupzone .stop:after			{margin-left:4px; content:''; display:block; width:2px; height:13px; background:#fff; }
.popupzone .play				{width:0; height:0; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-left: 10px solid #fff; margin-left:2px;}
#popupzone_now_number			{font-weight:500;}

.main_top .cont2				{margin-top:40px;}
.main_top .lt2					{float:left; width:calc(100% - 460px); display:flex; justify-content:space-between;}
.main_top .lt2	dl				{padding-left:65px; background:url("../image/main/acc01.png") no-repeat center left; background-size:50px;}
.main_top .lt2	dl:nth-child(2)	{background-image:url("../image/main/acc06.png"); background-size:52px;}
.main_top .lt2	dl:nth-child(3)	{display:none; background-image:url("../image/main/acc02.png");}
.main_top .lt2	dl:nth-child(4)	{background-image:url("../image/main/acc03.png");}
.main_top .lt2	dl:last-child	{background-image:url("../image/main/acc04.png");}
.main_top .lt2	dl dt			{font-size:1.25em; font-weight:500; color:#333; letter-spacing:-1.5px; margin-bottom:12px;}
.main_top .lt2	dl dd			{font-size:1.1em; font-weight:500; color:#333;}
.main_top .lt2 em				{font-family: 'Jost', sans-serif; color:#2f68c2; font-size:2em; font-style:normal; margin-right:5px; letter-spacing:-2px;}

.main_top .rt2					{position:relative; float:right; width:410px; padding-left:40px; border-left:1px solid #ddd;}
.main_top .rt2:after			{position:absolute;bottom:0; right:-10px; content:''; display:block; width:100px; height:80px; background:url("../image/main/acc05.png") no-repeat center bottom; background-size:contain;}
.main_top .rt2 dt				{display:inline-block; font-size:1.4em; letter-spacing:-1.5px; font-weight:700; color:#333;  padding:0 38px 10px 0; cursor:pointer; background:url("../image/main/acc_more.png") no-repeat 88px 1px; transition:all 0.2s ease;}
.main_top .rt2 dd				{color:#888; line-height:1.5;}
.main_top .rt2:hover dt			{background-position:right 1px;}


/* 제안  ===================================================================================== */
.mainTitle						{text-align:Center; font-size:2em; color:#111; line-height:1.2; margin-bottom:40px; letter-spacing:-2px; font-weight:100;}
.mainTitle span					{display:block; color:#2f68c2; font-size:23px; font-weight:700; margin-bottom:10px;}
.mainTitle strong				{font-weight:700;}
.main_btm						{position:relative; padding:60px 0;} 
.main_btm:after					{content:''; display:block; clear:both;}
.main_youth						{background:#f3f5f7;}
.youthCnt						{position:relative; padding:0 0 40px 0; display:flex; justify-content:center; gap:0 40px;}
.youthCnt dl					{padding-left:90px; position:relative;}
.youthCnt dl dt					{font-size:1.2em; font-weight:500; color:#333; letter-spacing:-1.5px; margin-bottom:10px;}
.youthCnt dl dd					{font-size:1.1em; font-weight:500; color:#333;}
.youthCnt dl dd	 em				{font-family: 'Jost', sans-serif; color:#000; font-size:2em; font-style:normal; margin-right:5px; letter-spacing:-2px;}
.youthCnt dl:after				{position:absolute; left:0; top:0; content:''; display:block; width:72px; height:72px; background:url("../image/main/acc07.png") no-repeat center 50% #0cc6d7; background-size:35px; border-radius:100%; }
.youthCnt dl:last-child:after	{background-image:url("../image/main/acc08.png"); background-color:#345ea8;}
.youthCnt:after					{content:''; display:block; position:absolute; left:-50px; bottom:0; width:400px; height:200px; background:url("../image/common/acc_top01.png") no-repeat center bottom; background-size:contain;}
.youthCnt:before				{content:''; display:block; position:absolute; right:-60px; bottom:0; width:400px; height:180px; background:url("../image/common/acc_top02.png") no-repeat center bottom; background-size:contain;}

.main_btm .tab					{position:relative; margin-bottom:25px;}
.main_btm .tab:after			{content:''; display:block; clear:both;}
.main_btm .tab li				{position:relative; float:left; width:calc(32.77% - 10px);text-align:center; cursor:pointer;}
.main_btm .tab li a				{display:block; color:#fff; background:#7e8a9b; padding:0 5px; font-size:1.1em; letter-spacing:-1px; line-height:50px; height:52px; border-right:1px solid #bfc5cd;}
.main_btm .tab .on a			{background:#2264bf; border-color:#2264bf; font-weight:500;}
.main_btm .tab .on:after		{display:block; content:'';  position:absolute; z-index:1; bottom:-8px; left:50%; transform:translate(-50%); border-top:8px solid #2264bf; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 0 solid transparent;}
.main_btm .tab .more			{display:block; position:absolute; right:0; top:0; width:50px; height:52px; cursor:pointer; background:#7e8a9b;}
.main_btm .tab .more:after		{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); width:17px; height:2px; background:#fff;}
.main_btm .tab .more:before		{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); width:2px; height:17px; background:#fff;}
.main_btm .tab .more:hover		{background:#2264bf;}

.main_btm .suggest_list			{margin-top:0px !important;}
.main_btm .suggest_list li		{margin:0 10px !important; background:#fff; border-color:#e5e5e5;}

.main_btm .arrow				{position:absolute; top:38%; width:100%; z-index:999;}
.main_btm .arrow p				{position:absolute; background:#fff; border:1px solid #ddd; width:60px; height:60px; cursor:pointer;}
.main_btm .arrow span			{display:inline-block; border:solid #bbb; padding:8px;}
.main_btm .arrow .prev			{left:-90px;}
.main_btm .arrow .prev span		{margin:20px 0 0 24px; border-width:0 2px 2px 0; transform:rotate(135deg);}
.main_btm .arrow .next			{right:-90px;}
.main_btm .arrow .next span		{margin:20px 0 0 17px;  border-width:2px 2px 0 0; transform:rotate(45deg);}
.main_btm .arrow p:hover		{background:#2264bf; border-color:#2264bf;}
.main_btm .arrow p:hover span	{border-color:#fff;}	


/* 메인뉴스 ===================================================================================== */
.main_news						{position:relative; padding:0 0 60px 0; overflow:hidden;}				

.news_zone						{float:left; width:calc(100% - 410px); overflow:hidden;}
.news_zone>div					{float:left; width:47.5%;}
.news_zone>div:last-child		{float:right;}
.main_tit						{position:relative; border-bottom:1px solid #ddd; padding-bottom:15px; margin-bottom:20px;}
.main_tit a						{position:relative; font-size:1.4em; letter-spacing:-2px; color:#333; font-weight:500;}
.main_tit a:after				{position:absolute; left:0px; bottom:-15px; content:''; display:block; width:100%; height:3px; background:#476ccd; border-radius:50px;}
.main_tit .more					{display:block; position:absolute; right:0; top:0; width:30px; height:30px; cursor:pointer; background:#fff; border:1px solid #ccc;}
.main_tit .more:after			{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); width:15px; height:2px; background:#ccc;}
.main_tit .more:before			{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); width:2px; height:15px; background:#ccc;}
.main_tit:hover	.more			{background:#476ccd; border-color:#476ccd;}
.main_tit:hover	.more:after,
.main_tit:hover .more:before	{background:#fff;}

.news_list						{overflow:hidden; }
.news_list li					{position:relative; overflow:hidden; padding:0 0 7px 12px;} 
.news_list li:last-child		{padding-bottom:0;}
.news_list li:after				{position:absolute; content:''; display:block; top:10px; left:0; width:3px; height:3px; border-radius:100%; background:#2f68c2;}
.news_list p					{position:relative; float:left; width:calc(100% - 80px); color:#555; letter-spacing:-1px; overflow: hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap;}
.news_list em					{font-style:normal; float:right; color:#b1b1b1; font-size:0.9em; letter-spacing:0;}
.news_list li:hover p			{text-decoration:underline;}

.main_news .rt					{float:right; width:30%;}
.main_news .rt .main_tit			{border:0; padding:0;}
.main_news .rt .main_tit a:after	{display:none;}
.main_news .rt .main_tit .more:after	{display:block;}
.rank_zone						{position:relative; border:1px solid #eaeaea; height:210px;}
.rank_zone .wrap				{padding:20px 25px;}
.rank_zone .tit					{display:none; font-size:1.1em; letter-spacing:-1px; font-weight:700; text-align:center;}
.rank_zone ul					{overflow:hidden;}
.rank_zone .ranking1			{float:left; width:48%;}
.rank_zone .ranking2			{float:right; width:48%; text-align:left;}
.rank_zone li					{margin:1px 0; display:inline-block; line-height:20px;}
.rank_zone li p					{padding-left:50px; font-size:0.9em; letter-spacing:-0.75px;}
.rank_zone li p span			{font-size:11px; color:green; letter-spacing:0;}
.rank_zone	em					{float:left;width:20px; height:20px; line-height:20px; font-size:0.8em; color:#fff; text-align:center; font-style:normal; border-radius:2px; margin-right:5px;}			
.rank_zone .more				{position:absolute; bottom:0; right:0; color:#fff; width:110px; height:28px; line-height:26px; font-size:0.85em; letter-spacing:-1px; padding-left:28px; border-radius:2px 0 0 0;}
.rank_zone .Lv1					{background:url('../image/common/rank_lv01.png') no-repeat 23px 2px; background-size:22px;}
.rank_zone .Lv2					{background:url('../image/common/rank_lv02.png') no-repeat 23px 2px; background-size:22px;}
.rank_zone .Lv3					{background:url('../image/common/rank_lv03.png') no-repeat 23px 2px; background-size:22px;}
.rank_spring					{background:url('../image/common/rank_bg01.png') no-repeat 20% bottom #fff2f1; background-size:130px;}
.rank_spring .tit				{color:#d10039;}
.rank_spring em					{background:#e7898c; }
.rank_spring .more				{background:url('../image/common/rank_acc.png') no-repeat 8px 6px #d10039;  background-size:15px;}
.rank_summer					{background:url('../image/common/rank_bg02.png') no-repeat 20% bottom #ebfaff; background-size:130px;}
.rank_summer .tit				{color:#2485b2;}
.rank_summer em					{background:#24c0fe; }
.rank_summer .more				{background:url('../image/common/rank_acc.png') no-repeat 8px 6px #2485b2;  background-size:15px;}
.rank_autumn					{background:url('../image/common/rank_bg03.png') no-repeat 20% bottom #ffe6cb; background-size:130px;}
.rank_autumn .tit				{color:#634630;}
.rank_autumn em					{background:#f15a29; }
.rank_autumn .more				{background:url('../image/common/rank_acc.png') no-repeat 8px 6px #9d7c62;  background-size:15px;}
.rank_winter					{background:url('../image/common/rank_bg04.png') no-repeat 20% bottom #f7f7f7; background-size:130px;}
.rank_winter .tit				{color:#454b54;}
.rank_winter em					{background:#777; }
.rank_winter .more				{background:url('../image/common/rank_acc.png') no-repeat 8px 6px #454b54;  background-size:15px;}


/* FT_BANNER    ================================================================================== */
.foot_bn							{position:relative; height:120px; line-height:120px; overflow:hidden; border-top:1px solid #eaeaea;}
.foot_bn .bn_list					{margin-left:100px;}

.more_arrow							{ position: absolute; top: 40%;}		                    
.more_arrow p						{width:25px; height:25px; border: 1px solid #ddd; display: inline-block; float: left;box-sizing: border-box;}
.more_arrow p:nth-child(2)			{border-left:0; border-right:0;}
.more_arrow .arrow_lt				{cursor:pointer; content: ""; display: block; width: 9px; height: 9px; border-left: 2px solid #858585; border-bottom: 2px solid #858585; -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; left:12%; top: 32%;}    
.more_arrow .arrow_stop				{cursor:pointer; content: ""; display: block; width: 8px; height: 9px; border-left: 2px solid #858585; border-right: 2px solid #858585; position: absolute; left:44%; top: 32%; }
.more_arrow .arrow_play				{display:block;position:absolute;cursor:pointer; width:10px; height:10px; margin-left:8px; margin-right:3px; border-style:solid; border-width:5px 0 5px 10px; border-color:transparent transparent transparent #7c8082; left:33%;top:30%;}
.more_arrow .arrow_rt				{cursor:pointer; content: ""; display: block; width: 9px; height: 9px; border-top: 2px solid #858585; border-right: 2px solid #858585; -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; left:76%; top: 32%;}


@media screen and (max-width:1400px) {
	.main_btm .suggest_list			{padding:0 30px;}
	.main_btm .suggest_list li		{margin:0 5px !important;}
	.main_btm .arrow .prev			{left:-10px;}
	.main_btm .arrow .next			{right:-10px;}
}


@media screen and (max-width:1200px) {
	.main_top, .main_btm			{padding:60px 20px;}
	.main_top .lt2					{float:none; width:100%;}
	.main_top .rt2					{float:none; width:100%; border:1px solid #2f68c2; background:#f9faff; padding:25px 20px; margin:20px 0 0 0;}
	.main_top .rt2:after			{right:10px; bottom:20px; height:80px;}
	.main_top .rt2 dd				{width:calc(100% - 80px);}
	.main_top .rt2 dd br			{display:none;}

	.main_news						{padding:0 20px 60px 20px;}
	.foot_bn						{padding:0 20px;}

}

@media screen and (max-width:1024px) {
	.main_top						{border:0; padding:0;}
	.main_top .lt					{float:none; width:100%; margin-bottom:20px;}
	.main_top .lt ul li img			{width:100%; height:100%;}
	.main_top .rt					{float:none; width:100%; overflow:hidden; padding:0 20px;}
	.searchzone						{margin-bottom:20px;}
	.searchzone ul					{margin-top:10px;}
	.popupzone						{height:100%;}

	.main_top .lt2					{padding:20px; justify-content:space-between;}
	.main_top .lt2 dl				{padding:65px 0 0 0; text-align:center;}
	.main_top .lt2 dl,				
	.main_top .lt2	dl:nth-child(2),
	.main_top .lt2	dl:nth-child(3),
	.main_top .lt2	dl:last-child	{background-position:center top;}
	.main_top .lt2 dl dt			{font-size:1.1em; margin-bottom:5px;}
	.main_top .wrap2				{padding:0 20px;}
	.main_top .lt2 em				{font-size:1.6em;}
	.main_top .rt2					{margin:0 0 20px 0;}
	.main_top .rt2 dt				{font-size:1.25em; background-position:75px 1px;}

	.main_youth						{padding:40px 20px !important;}
	.mainTitle						{font-size:1.6em; margin-bottom:20px;}
	.mainTitle span					{font-size:17px; letter-spacing:-1px; margin-bottom:7px;}
	.youthCnt						{padding-bottom:20px;}
	.youthCnt dl					{padding-left:75px;}
	.youthCnt dl dt					{font-size:1.05em; margin-bottom:5px;}
	.youthCnt dl dd em				{font-size:1.6em;}
	.youthCnt dl:after				{width:60px; height:60px; background-size:25px;}
	.youthCnt:after, .youthCnt:before	{width:300px; height:120px;}

	.main_btm						{padding:40px 20px 0 20px;}
	.main_btm .tab					{margin-bottom:20px;}
	.main_btm .tab li				{width:calc(33.25% - 13px);}
	.main_btm .tab li a				{height:42px; line-height:40px; font-size:0.95em;}
	.main_btm .tab .more			{height:42px; width:40px;}
	.main_btm .suggest_list			{padding:0 10px;}
	.main_btm .arrow				{margin-top:15px;}
	.main_btm .arrow p				{width:42px; height:42px;}
	.main_btm .arrow span			{padding:6px;}
	.main_btm .arrow .prev span		{margin:13px 0 0 17px;}
	.main_btm .arrow .next span		{margin:13px 0 0 11px;}

	.main_news 						{padding:20px;}
	.main_tit						{padding-bottom:12px; margin-bottom:15px;}
	.main_tit a						{font-size:1.25em;}
	.main_tit a:after				{bottom:-12px;}
	.main_tit .more					{width:26px; height:26px;}
	.news_zone>div					{width:48%;}
	.news_zone						{float:none; width:100%; margin-bottom:20px;}
	.news_list li					{padding-bottom:5px;}
	.news_list li:nth-child(6)		{display:none;}
	.main_news .rt					{float:none; width:100%;}
	.rank_zone						{background-position:center bottom; height:200px;}
	.rank_zone .wrap				{padding:20px;}
	.rank_zone .ranking2			{text-align:left;}
	.rank_zone li					{display:block;}
	.rank_zone .more				{bottom:10px; right:10px;}

	.foot_bn						{height:100px; line-height:100px;}
	.foot_bn li img					{width:90%;}
}



@media screen and (max-width:768px) {
	.youthCnt:after, .youthCnt:before	{display:none;}

	.news_zone>div					{float:none; width:100%;}
	.news_zone>div:last-child		{float:none; margin-top:20px;}
	.rank_zone						{height:auto;}
	.rank_zone .ranking1,
	.rank_zone .ranking2			{float:none; width:100%;}
}



@media screen and (max-width:580px) {
	.main_btm .suggest_list li		{float:left !important;}
}