@charset "UTF-8";
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);

/* 공통 set */
#wrap{width:100%;}

#header{width:100%; height:115px; overflow:hidden; background:url("../images/header_back.jpg") repeat-x; border-bottom:1px solid #d0d0d0;}
#contents{width:100%;}
#footer{width:100%; background:#eaeaea;}

.header{width:1024px; height:115px; overflow:hidden; margin:0 auto; position:relative; background:url("../images/header_back.jpg") repeat-x;}
.footer{width:1024px; height:125px; margin:0 auto; position:relative; background:#eaeaea; padding:50px 0; clear:both;}

#m_gnb{display:none;}

#header .m_menu{display:none; text-indent:-9999px;}
#header .m_close{display:none;}

/* 헤더 user_menu */
.user_menu{width:100%; height:30px;}
.user_menu ul{float:right;}
.user_menu ul li{float:left; line-height:30px; padding:0 20px; background:url("../images/user_menu.jpg") no-repeat right;}
.user_menu ul li:last-child{background:none;}
.user_menu ul li a{color:#a4a4a4;}

/* 헤더 gnb */
.gnb_menu{width:100%; height:85px;}
.gnb_menu h1{padding:14px 0 15px 0; float:left;}
.gnb_menu ul{float:right; padding:34px 0 35px 0;}
.gnb_menu ul li{float:left; font-size:16px; font-weight:600; background:url("../images/gnb_menu.jpg") no-repeat right; padding:0 35px;}
.gnb_menu ul li:last-child{background:none;}
.gnb_menu ul li a{color:#505050;}

/* 푸터 */
.footer h1{float:left; padding:43px 0; margin-right:100px;}
.footer .footer_cite{float:left;}
.footer .footer_cite .footer_menu{display:inline-block; margin-bottom:20px;}
.footer .footer_cite .footer_menu li{float:left; padding:0 15px; background:url("../images/footer_menu.jpg") no-repeat left;}
.footer .footer_cite .footer_menu li:first-child{background:none; padding-left:0;}
.footer .footer_cite .footer_menu li a{color:#686868;}
.footer .footer_cite .footer_add{color:#a1a1a1; font-size:12px;}
.footer .footer_cite .footer_add li{padding:5px 0;}
.footer .footer_cite .footer_add li b{font-weight:400;}

/* 메인 배너 */
.main_banner{width:100%;}
.main_banner .main_banner_box{width:100%; background:#eaeaea;}

.main_banner .main_banner_box .flexslider{width:1024px; margin:0 auto;}
.main_banner .main_banner_box .flexslider ul li{position:relative;}
.main_banner .main_banner_box .flexslider ul li img{width:100%; height:auto;}

.main_banner .main_banner_box .flexslider .flex-control-nav.flex-control-paging{width:100%; text-align:center; padding:30px 0; background:#002a40;}
.main_banner .main_banner_box .flexslider .flex-control-nav.flex-control-paging li{display:inline-block;}
.main_banner .main_banner_box .flexslider .flex-control-nav.flex-control-paging li a{text-indent:101%; display:inline-block; white-space:nowrap; overflow:hidden; width:12px; height:12px; background:url("../images/dot_off.png") no-repeat; margin:0 9px;}
.main_banner .main_banner_box .flexslider .flex-control-nav.flex-control-paging li a.flex-active{background:url("../images/dot_on.png") no-repeat;}

.main_banner .main_banner_box .flexslider .flex-direction-nav{display:none;}

.main_banner_tit{width:340px; height:100%; padding:55px 40px; color:white; box-sizing:border-box; background:rgba(10,42,59,0.6); position:absolute; top:0; right:0;}
.main_banner_tit h3{text-align:center; font-size:20px; padding-bottom:35px;}
.main_banner_tit div{line-height:23px; letter-spacing:-1px;}

/* CONTEST LIST */
.main_contest_list{width:100%; padding:40px 0;}
.main_contest_list .main_contest_list_box{width:1024px; margin:0 auto;}
.main_contest_list .main_contest_list_box h2{font-size:16px; color:#0a2a3b; text-align:center; margin-bottom:24px;}

.contest_list{width:100%; overflow:hidden;}
.contest_list.sub{margin-bottom:80px;}
.contest_list p{width:59px; text-align:center; float:left;}
.contest_list .contest_wrap{width:905px; overflow:hidden; float:left;}
.contest_list .contest_wrap .contest{width:600%;}
.contest_list .contest_wrap .contest .contest_box{width:285px; float:left; margin-right:25px; background:#eaeaea; position:relative;}
.contest_list .contest_wrap .contest .contest_box h4{background:#0a2a3b; color:white; line-height:40px; text-align:center;}
.contest_list .contest_wrap .contest .contest_box img{width:100%; height:147px;}
.contest_list .contest_wrap .contest .contest_box .case{background:rgba(0,0,0,0.5); color:#c8ff07; padding:5px 10px; position:absolute; top:154px; right:10px;}
.contest_list .contest_wrap .contest .contest_box ul{padding:9px 20px; height:105px; text-align:left;}
.contest_list .contest_wrap .contest .contest_box ul li{padding:5px 0;}
.contest_list .contest_wrap .contest .contest_box ul li span{width:55px; height:25px; font-weight:600; text-align:center; line-height:25px; border-radius:10px;}
.contest_list .contest_wrap .contest .contest_box ul li span.info_w{background:white;}
.contest_list .contest_wrap .contest .contest_box ul li span.info_b{background:#0a2a3b; color:white;}
.contest_list .contest_wrap .contest .contest_box ul li input{height:25px;}

.contest_list .contest_wrap .contest .contest_box ul li h5{font-size:14px; color:#0a2a3b; padding:7px 0;}

.contest_list .mobile_contest_btn{display:none;}

.contest_list_main_wrap{width:100%; padding:40px 0;}
.contest_list_main{width:1024px; margin:0 auto; overflow:hidden;}
.contest_list_main .contest_box_main{width:300px; float:left; margin-right:62px; margin-top:34px; background:#eaeaea; position:relative;}
.contest_list_main .contest_box_main:nth-child(3n){margin-right:0;}
.contest_list_main .contest_box_main:first-child,.contest_list_main .contest_box_main:nth-child(2),.contest_list_main .contest_box_main:nth-child(3){margin-top:0;}
.contest_list_main .contest_box_main h4{background:#0a2a3b; color:white; line-height:40px; text-align:center;}
.contest_list_main .contest_box_main img{width:100%; height:147px;}
.contest_list_main .contest_box_main .case{background:rgba(0,0,0,0.5); color:#c8ff07; padding:5px 10px; position:absolute; bottom:132px; right:10px;}
.contest_list_main .contest_box_main ul{padding:9px 20px; height:105px; text-align:left;}
.contest_list_main .contest_box_main ul li{padding:5px 0;}
.contest_list_main .contest_box_main ul li span{width:55px; height:25px; font-weight:600; text-align:center; line-height:25px; border-radius:10px; margin-right:10px;}
.contest_list_main .contest_box_main ul li span.info_w{background:white;}
.contest_list_main .contest_box_main ul li span.info_b{background:#0a2a3b; color:white;}

/* 로그인, 게시판, 랭킹 */
.main_box_01{width:100%; background:#213c4b; padding:20px 0;}
.main_box_01 .main_box_01_wrap{width:1024px; margin:0 auto; overflow:hidden;}

.main_box_01 .main_box_01_wrap .main_box_01_login{width:341px; height:230px; box-sizing:border-box; float:left; padding:25px 0; background:#0a2a3b; color:white;}
.main_box_01 .main_box_01_wrap .main_box_01_notice{width:342px; height:230px; box-sizing:border-box; float:left; padding:25px 15px; background:#eaeaea; color:#0a2a3b;}
.main_box_01 .main_box_01_wrap .main_box_01_ranking{width:341px; height:230px; box-sizing:border-box; float:left; padding:25px 0 0 0; background:#0a2a3b; color:white;}

/* 로그인 */
.main_box_01 .main_box_01_wrap .main_box_01_login h2{font-size:16px; color:white; text-align:center; margin-bottom:24px;}
.main_box_01 .main_box_01_wrap .main_box_01_login div{width:273px; margin:0 auto;}
.main_box_01 .main_box_01_wrap .main_box_01_login div a img{margin-bottom:12px;}
.main_box_01 .main_box_01_wrap .main_box_01_login div p{width:100%; overflow:hidden; padding-top:12px;}
.main_box_01 .main_box_01_wrap .main_box_01_login div p a{color:white;}
.main_box_01 .main_box_01_wrap .main_box_01_login div p a.left{float:left;}
.main_box_01 .main_box_01_wrap .main_box_01_login div p a.right{float:right;}

.main_box_01 .main_box_01_wrap .main_box_01_login div .a_l_member_info{width:100%; overflow:hidden; padding-bottom:12px;}
.main_box_01 .main_box_01_wrap .main_box_01_login div .a_l_member_info div.left{border:1px solid #eaeaea; width:100px; height:100px; float:left;}
.main_box_01 .main_box_01_wrap .main_box_01_login div .a_l_member_info div.left img{width:100px; height:100px;}
.main_box_01 .main_box_01_wrap .main_box_01_login div .a_l_member_info div.right{width:155px; padding-left:16px; float:left;}
.main_box_01 .main_box_01_wrap .main_box_01_login div .a_l_member_info div.right ul li{line-height:34px;}
.main_box_01 .main_box_01_wrap .main_box_01_login div .a_l_member_info div.right ul li.name b{color:#d4b75e;}
.main_box_01 .main_box_01_wrap .main_box_01_login div .a_l_member_info div.right ul li.record_tit span{width:70px; height:26px; box-sizing:border-box; border:1px solid #213c4b; background:#071e2a; text-align:center; border-radius:5px; line-height:26px;}
.main_box_01 .main_box_01_wrap .main_box_01_login div .a_l_member_info div.right ul li.record{font-size:16px;}

.main_box_01 .main_box_01_wrap .main_box_01_login div p.right{text-align:right;}
.main_box_01 .main_box_01_wrap .main_box_01_login div p.right a{color:white;}

/* 게시판 */
.main_box_01 .main_box_01_wrap .main_box_01_notice h2{font-size:16px; color:#0a2a3b; text-align:center; margin-bottom:24px;}
.main_box_01 .main_box_01_wrap .main_box_01_notice table{width:100%;}
.main_box_01 .main_box_01_wrap .main_box_01_notice table tbody tr td{vertical-align:middle; height:28px; table-layout:fixed; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; word-wrap:break-word;}
.main_box_01 .main_box_01_wrap .main_box_01_notice table tbody tr td.tit{text-align:left; padding-left:10px; background:url("../images/notice_dot.png") no-repeat left;}
.main_box_01 .main_box_01_wrap .main_box_01_notice table tbody tr td.date{text-align:right;}

/* 랭킹 */
.main_box_01 .main_box_01_wrap .main_box_01_ranking h2{font-size:16px; color:white; text-align:center; margin-bottom:21px;}
.main_box_01 .main_box_01_wrap .main_box_01_ranking table{width:100%;}
.main_box_01 .main_box_01_wrap .main_box_01_ranking table thead tr th{vertical-align:middle; height:28px; text-align:center;}
.main_box_01 .main_box_01_wrap .main_box_01_ranking table tbody tr{border-top:1px solid black;}
.main_box_01 .main_box_01_wrap .main_box_01_ranking table tbody tr:first-child{border-top:0 none;}
.main_box_01 .main_box_01_wrap .main_box_01_ranking table tbody tr:first-child td{background:#123344; height:28px; color:#ddbe60; font-weight:600;}
.main_box_01 .main_box_01_wrap .main_box_01_ranking table tbody tr td{vertical-align:middle; height:27px; text-align:center; color:#b3b3b3;}

/* 커뮤니티, 보이는 becup, 배너 */
.main_box_02{width:100%; background:#213c4b; padding-bottom:20px;}
.main_box_02 .main_box_02_wrap{width:1024px; margin:0 auto; overflow:hidden;}

.main_box_02 .main_box_02_wrap .main_box_02_notice{width:341px; height:230px; box-sizing:border-box; float:left; padding:25px 15px; background:#eaeaea; color:#0a2a3b;}
.main_box_02 .main_box_02_wrap .main_box_02_media{width:342px; height:230px; box-sizing:border-box; float:left; padding:25px 15px; background:#0a2a3b; color:white;}
.main_box_02 .main_box_02_wrap .main_box_02_banner{width:341px; height:230px; box-sizing:border-box; float:left; padding:0; background:#0a2a3b; color:white;}

/* 커뮤니티 */
.main_box_02 .main_box_02_wrap .main_box_02_notice h2{font-size:16px; color:#0a2a3b; text-align:center; margin-bottom:24px;}
.main_box_02 .main_box_02_wrap .main_box_02_notice table{width:100%;}
.main_box_02 .main_box_02_wrap .main_box_02_notice table tbody tr td{vertical-align:middle; height:28px; table-layout:fixed; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; word-wrap:break-word;}
.main_box_02 .main_box_02_wrap .main_box_02_notice table tbody tr td.tit{text-align:left; padding-left:10px; background:url("../images/notice_dot2.png") no-repeat left;}
.main_box_02 .main_box_02_wrap .main_box_02_notice table tbody tr td.date{text-align:right;}

/* 보이는 becup */
.main_box_02 .main_box_02_wrap .main_box_02_media h2{font-size:16px; color:white; text-align:center; margin-bottom:24px;}
.main_box_02 .main_box_02_wrap .main_box_02_media div{width:100%; height:140px; position:relative;}
.main_box_02 .main_box_02_wrap .main_box_02_media a img{width:100%; height:140px;}
.main_box_02 .main_box_02_wrap .main_box_02_media p{background:rgba(0,0,0,0.7); color:white; position:absolute; bottom:0; left:0; line-height:32px; width:100%; text-align:center; box-sizing:border-box; padding:0 10px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; word-wrap:break-word;}

/* 배너 */
.main_box_02 .main_box_02_wrap .main_box_02_banner img{width:100%; height:230px;}

/* 메인 하단 광고 배너 */
.main_box_03{width:100%; padding:40px 0; clear:both;}
.main_box_03 .main_box_03_wrap{width:1024px; margin:0 auto; text-align:center;}
.main_box_03 .main_box_03_wrap a img{max-width:760px; width:100%; height:auto;}


@media screen and (min-width:720px) and (max-width:1023px){
	.header{width:720px;}
	.footer{width:720px;}
	
	/* 헤더 gnb */
	.gnb_menu{width:100%; height:85px;}
	.gnb_menu ul li{padding:0 24px;}

	/* 푸터 */
	.footer h1{padding:44px 0 45px; margin-right:35px;}
	.footer h1 img{width:180px; height:auto;}

	.footer .footer_cite .footer_add{letter-spacing:-0.5px;}
	
	/* 메인 배너 */
	.main_banner .main_banner_box .flexslider{width:720px;}
	
	.main_banner_tit{width:100%; height:auto; padding:0; background:rgba(10,42,59,0.6); top:auto; bottom:0; left:0;}
	.main_banner_tit h3{text-align:center; font-size:16px; padding:16px 0; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; word-wrap:break-word;}
	.main_banner_tit div{display:none;}
	
	/* CONTEST LIST */
	.main_contest_list .main_contest_list_box{width:720px; margin:0 auto;}

	.contest_list p{width:62.5px; }
	.contest_list .contest_wrap{width:595px;}


	.contest_list_main{width:720px;}
	.contest_list_main .contest_box_main{width:300px; margin-right:30px; margin-left:30px; margin-top:30px;}
	.contest_list_main .contest_box_main:nth-child(3n){margin-right:30px;}
	.contest_list_main .contest_box_main:first-child,.contest_list_main .contest_box_main:nth-child(2){margin-top:0;}
	.contest_list_main .contest_box_main:nth-child(3){margin-top:30px;}
	
	/* 로그인, 게시판, 랭킹 */
	.main_box_01 .main_box_01_wrap{width:720px;}

	.main_box_01 .main_box_01_wrap .main_box_01_login{display:none;}
	.main_box_01 .main_box_01_wrap .main_box_01_notice{width:50%;}
	.main_box_01 .main_box_01_wrap .main_box_01_ranking{width:50%;}

	/* 커뮤니티, 보이는 becup, 배너 */
	.main_box_02 .main_box_02_wrap{width:720px;}

	.main_box_02 .main_box_02_wrap .main_box_02_notice{width:50%; height:auto; padding:29px 15px;}
	.main_box_02 .main_box_02_wrap .main_box_02_media{width:50%; height:auto;}
	.main_box_02 .main_box_02_wrap .main_box_02_media div{width:100%; height:148px;}
	.main_box_02 .main_box_02_wrap .main_box_02_media a img{height:148px;}
	.main_box_02 .main_box_02_wrap .main_box_02_banner{display:none;}

	/* 메인 하단 광고 배너 */
	.main_box_03{width:100%; padding:30px 0; clear:both;}
	.main_box_03 .main_box_03_wrap{width:720px; padding:0 10px; box-sizing:border-box;}
	.main_box_03 .main_box_03_wrap a img{max-width:700px; width:100%; height:auto;}

}

@media screen and (max-width:719px){
	/* 공통 set */
	#header{background:none; height:auto;}
	
	.header{min-width:320px; width:100%; height:auto; background:none; position:relative;}
	.footer{min-width:320px; width:100%; padding:0 10px 30px 10px; height:auto; box-sizing:border-box;}
	
	/* 모바일 헤더 메뉴 */
	#header .m_menu{display:block; text-indent:0px; position:absolute; top:13px; right:10px; z-index:9; }
	#m_gnb .m_close{display:none; position:absolute; top:13px; right:10px; z-index:9; }

	#m_gnb{width:80%; position:absolute; top:0; right:0; display:none; z-index:999; background:#eaeaea;}

	#m_gnb li{line-height:48px; font-size:13px; border-bottom:1px solid #bbb; font-weight:600;}
	#m_gnb li img{width:180px; height:auto;}
	#m_gnb li a{color:#0a2a3b; padding-left:15px; }
	#m_gnb li ul{width:100%; display:none; background:white;}
	#m_gnb li ul li{border-bottom:0 none; font-weight:normal; border-top:1px solid #ccc;}
	#m_gnb li ul li a{display:block; color:#0a2a3b;}
	#m_gnb li.m_gnb_top{padding-left:0; background:#0a2a3b; height:50px; line-height:100%; color:white; border-bottom:none;}
	#m_gnb li.m_gnb_top ol li{font-size:12px; width:auto; padding:0 8px; height:50px; line-height:50px; text-align:center; border-bottom:0; border-right:1px solid #666; float:left;}
	#m_gnb li.m_gnb_top ol li a{padding:0; color:white; font-weight:normal;}
	#m_gnb li.m_gnb_top img{padding-top:8px;}
	#m_gnb li.m_gnb_line{border-bottom:1px solid white;}

	/* 헤더 user_menu */
	.user_menu{display:none;}

	/* 헤더 gnb */
	.gnb_menu{height:auto;}
	.gnb_menu h1{padding:6px 0 6px 20px; float:none;}
	.gnb_menu h1 img{width:80px; height:38px;}
	.gnb_menu ul{display:none;}
	
	/* 푸터 */
	.footer h1{float:none; padding:30px 0; margin-right:0; text-align:center;}

	.footer .footer_cite{float:none;}
	.footer .footer_cite .footer_menu{width:100%; display:inline-block; margin-bottom:20px;}
	.footer .footer_cite .footer_menu li{width:33.33%; float:left; padding:0; text-align:center; margin-bottom:10px;}
	.footer .footer_cite .footer_menu li:first-child{background:none;}
	.footer .footer_cite .footer_menu li:nth-child(4n){background:none;}

	.footer .footer_cite .footer_add li{padding:0; line-height:18px; text-align:center;}
	.footer .footer_cite .footer_add li b{display:block;}
	.footer .footer_cite .footer_add li b span{display:none;}

	/* 메인 배너 */
	.main_banner .main_banner_box .flexslider{min-width:320px; width:100%;}
	
	.main_banner .main_banner_box .flexslider .flex-control-nav.flex-control-paging{padding:18px 0;}

	.main_banner_tit{width:100%; height:auto; padding:0; background:rgba(10,42,59,0.6); top:auto; bottom:0; left:0;}
	.main_banner_tit h3{text-align:center; font-size:15px; padding:15px 0; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; word-wrap:break-word;}
	.main_banner_tit div{display:none;}

	/* CONTEST LIST */
	.main_contest_list .main_contest_list_box{width:320px; margin:0 auto;}

	.contest_list p{display:none;}
	.contest_list .contest_wrap{width:320px;}
	.contest_list .contest_wrap .contest{width:600%;}
	.contest_list .contest_wrap .contest .contest_box{width:320px; float:left; margin-right:25px; background:#eaeaea; position:relative;}
	.contest_list .contest_wrap .contest .contest_box img{width:100%; height:165px;}
	.contest_list .contest_wrap .contest .contest_box .case{top:170px;}

	.contest_list .mobile_contest_btn{display:block; clear:both; padding-top:20px; text-align:center;}
	.contest_list .mobile_contest_btn a img{margin:0 2px;}

	
	.contest_list_main{width:100%; padding:0 10px; box-sizing:border-box;}
	.contest_list_main .contest_box_main{width:100%; margin-right:0; margin-left:0; margin-top:30px;}
	.contest_list_main .contest_box_main:nth-child(3n){margin-right:0;}
	.contest_list_main .contest_box_main:first-child{margin-top:0;}
	.contest_list_main .contest_box_main:nth-child(2),.contest_list_main .contest_box_main:nth-child(3){margin-top:30px;}
	.contest_list_main .contest_box_main img{width:100%; height:auto;}

	/* 로그인, 게시판, 랭킹 */
	.main_box_01{padding:0;}
	.main_box_01 .main_box_01_wrap{width:100%;}

	.main_box_01 .main_box_01_wrap .main_box_01_login{width:100%;}
	.main_box_01 .main_box_01_wrap .main_box_01_notice{width:100%;}
	.main_box_01 .main_box_01_wrap .main_box_01_ranking{width:100%;}

	/* 로그인 */
	.main_box_01 .main_box_01_wrap .main_box_01_login div p.right{text-align:center;}

	/* 커뮤니티, 보이는 becup, 배너 */
	.main_box_02{padding:0;}
	.main_box_02 .main_box_02_wrap{width:100%;}

	.main_box_02 .main_box_02_wrap .main_box_02_notice{width:100%;}
	.main_box_02 .main_box_02_wrap .main_box_02_media{width:100%; height:auto;}
	.main_box_02 .main_box_02_wrap .main_box_02_media div{width:100%; height:auto;}
	.main_box_02 .main_box_02_wrap .main_box_02_media a img{width:100%; height:auto;}
	.main_box_02 .main_box_02_wrap .main_box_02_banner{width:100%; height:auto;}
	.main_box_02 .main_box_02_wrap .main_box_02_banner img{width:100%; height:auto;}

	/* 메인 하단 광고 배너 */
	.main_box_03{width:100%; padding:25px 0; clear:both;}
	.main_box_03 .main_box_03_wrap{width:100%; padding:0 10px; box-sizing:border-box;}
	.main_box_03 .main_box_03_wrap a img{max-width:699px; width:100%; height:auto;}
}