@charset "utf-8";
/* CSS Document */


/* ====== font ======================================================================================================= */
/* cereal */
@font-face {
  font-family: 'cereal';
  font-style: normal;
  font-weight: 100;
  src: url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Light.eot) format('eot'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Light.woff) format('woff'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Light.otf) format('opentype');
}
@font-face {
  font-family: 'cereal';
  font-style: normal;
  font-weight: 200;
  src: url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Book.eot) format('eot'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Book.woff) format('woff'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Book.otf) format('opentype');
}
@font-face {
  font-family: 'cereal';
  font-style: normal;
  font-weight: 300;
  src: url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Medium.eot) format('eot'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Medium.woff) format('woff'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Medium.otf) format('opentype');
}
@font-face {
  font-family: 'cereal';
  font-style: normal;
  font-weight: 400;
  src: url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Bold.eot) format('eot'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Bold.woff) format('woff'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Bold.otf) format('opentype');
}
@font-face {
  font-family: 'cereal';
  font-style: normal;
  font-weight: 500;
  src: url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-ExtraBold.eot) format('eot'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-ExtraBold.woff) format('woff'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-ExtraBold.otf) format('opentype');
}
@font-face {
  font-family: 'cereal';
  font-style: normal;
  font-weight: 600;
  src: url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Black.eot) format('eot'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Black.woff) format('woff'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/AirbnbCereal-Black.otf) format('opentype');
}


/* Noto Sans */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 100;
  src:
       url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Thin.woff2) format('woff2'),
	   url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Thin.woff) format('woff'),
	   url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Thin.otf.eot) format('eot'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 200;
  src:
       url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Light.woff2) format('woff2'),
	   url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Light.woff) format('woff'),
	   url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Light.otf.eot) format('eot'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 300;
  src:
       url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Regular.woff2) format('woff2'),
	   url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Regular.woff) format('woff'),
	   url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Regular.otf.eot) format('eot'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Regular.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src:
       url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Medium.woff2) format('woff2'),
	   url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Medium.woff) format('woff'),
	   url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Medium.otf.eot) format('eot'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Medium.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 500;
  src:
       url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Bold.woff2) format('woff2'),
	   url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Bold.woff) format('woff'),
	   url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Bold.otf.eot) format('eot'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Bold.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 600;
  src:
       url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Black.woff2) format('woff2'),
	   url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Black.woff) format('woff'),
	   url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Black.otf.eot) format('eot'),
       url(//static.heraldcorp.com/wbazic/basic/fonts/NotoSansKR-Black.otf) format('opentype');
}


/* common ================================================================================================================================================ */
#back_top{position:fixed; bottom:40px; right:20px; z-index:2}
#back_top a{width:40px; height:40px; display:block; font-size:0; background:url(../img/top.png) center center no-repeat rgba(0,0,0,0.3); background-size:15px; -webkit-transition:0.2s ease-in-out; transition:0.2s ease-in-out; border-radius:50%}
#back_top a:hover{background:url(../img/top.png) center center no-repeat rgba(0,0,0,0.8); background-size:15px}
input, select, textarea{-webkit-appearance:none; border-radius:0; box-sizing:border-box}


/* header ================================================================================================================================================ */
.header{position:fixed; overflow:hidden; top:0; left:0; height:50px; width:100%; background:#fff; z-index:10; transition:all 0.5s ease-out, background 1s ease-out; transition-delay:.2s; text-align:right; box-shadow:0 0 15px rgba(0,0,0,0.1)}
.header .burger-container{position:relative; display:inline-block; height:50px; width:50px; cursor:pointer; -webkit-transform:rotate(0deg); transform:rotate(0deg); transition:all 0.3s cubic-bezier(0.4, 0.01, 0.165, 0.99); -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-tap-highlight-color:transparent}
.header .burger-container #burger{width:18px; height:8px; position:relative; display:block; margin:-4px auto 0; top:50%}
.header .burger-container #burger .bar{width:100%; height:1px; display:block; position:relative; background:#000; transition:all 0.3s cubic-bezier(0.4, 0.01, 0.165, 0.99); transition-delay:0s}
.header .burger-container #burger .bar.topBar{-webkit-transform: translateY(0px) rotate(0deg); transform: translateY(0px) rotate(0deg)}
.header .burger-container #burger .bar.btmBar{-webkit-transform: translateY(6px) rotate(0deg); transform: translateY(6px) rotate(0deg)}
.header ul.menu{position:relative; display:block; padding:0px 30px; margin-top:50px; text-align:left}
.header ul.menu li.menu-item{border-bottom:1px solid #f3f3f3; -webkit-transform: scale(1.15) translateY(-30px); transform: scale(1.15) translateY(-30px); opacity: 0;
transition: opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99), -webkit-transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99);
transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99), -webkit-transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99)}
.header ul.menu li.menu-item:nth-child(1){transition-delay:0.28s}
.header ul.menu li.menu-item:nth-child(2){transition-delay:0.21s}
.header ul.menu li.menu-item:nth-child(3){transition-delay:0.14s}
.header ul.menu li.menu-item:nth-child(4){transition-delay:0.07s}
.header ul.menu li.menu-item a{display:block; position:relative; color:#333; font-weight:400; font-size:15px; line-height:4; width:100%; letter-spacing:-0.5px}
.header ul.menu li.menu-item a.on{color:#1ba2da}
.header.menu-opened{height:100%; transition:all 0.3s ease-in, background 0.5s ease-in; transition-delay:0.25s}
.header.menu-opened .burger-container{-webkit-transform:rotate(90deg); transform:rotate(90deg)}
.header.menu-opened .burger-container #burger .bar{transition:all 0.4s cubic-bezier(0.4, 0.01, 0.165, 0.99); transition-delay:0.2s}
.header.menu-opened .burger-container #burger .bar.topBar{-webkit-transform:translateY(4px) rotate(45deg); transform:translateY(4px) rotate(45deg)}
.header.menu-opened .burger-container #burger .bar.btmBar{-webkit-transform:translateY(3px) rotate(-45deg); transform:translateY(3px) rotate(-45deg)}
.header.menu-opened ul.menu li.menu-item{-webkit-transform: scale(1) translateY(0px); transform: scale(1) translateY(0px); opacity:1}
.header.menu-opened ul.menu li.menu-item:nth-child(1){transition-delay:0.27s}
.header.menu-opened ul.menu li.menu-item:nth-child(2){transition-delay:0.34s}
.header.menu-opened ul.menu li.menu-item:nth-child(3){transition-delay:0.41s}
.header.menu-opened ul.menu li.menu-item:nth-child(4){transition-delay:0.48s}
.header_logo{position:absolute; overflow:hidden; display:block; top:11px; left:20px; width:81px; height:28px; background:url(../img/logo.png) center center no-repeat; background-size:cover; transition:.1s}


/* main ================================================================================================================================================ */
.main_img{margin-top:50px; position:relative; overflow:hidden; padding: 60px 0 70px; margin-bottom:10px; transition:.3s}
.main_img img{display:block; margin:0 auto; max-width:100%; width:300px}
.main_img .btn_area{position:absolute;bottom:8%;left:0;right:0;font-size:0;text-align: center;}
.main_img .btn_area .btn_main{display:inline-block;width:40%;padding:5px 10px;color:#fff;font-size:12px;line-height:20px;text-align:center;border-radius:20px; background:#1ba2da}
.main_img .btn_area .btn_main span{display:block;font-size:11px}
.main_img .btn_area .btn_main+.btn_main{margin-left:10px}
.main_bg{position:relative; overflow:hidden}
.main_tit{position:relative; font:600 30px/29px 'cereal'; letter-spacing:-0.7px; color:#000; margin:20px 20px}
.sub_tit{margin-bottom:25px; font:400 18px/17px 'Noto Sans'; letter-spacing:-0.7px; color:#000; text-align:center}
.main_tit+.sub_tit{margin-top:50px}
.main_t{position:relative; overflow:hidden; margin:10px 20px 30px; font-size:14px; font-weight:200; line-height:23px; letter-spacing:-0.7px; color:#333}
.main_t_tit{display:block; font-size:16px; font-weight:400; line-height:21px; color:#000; padding:10px 0 25px; text-align:center}
.main_t_img{padding-bottom:20px}
.main_t_img img{width:100%}
.main_t b{font-weight:300; color:#000}
.main_t p{text-align:left;transition:.3s}
.btn_bg{position:relative; overflow:hidden; font-size:0; text-align:center; margin:25px 0}
.btn1{position:relative; overflow:hidden; display:inline-block;  font-size:13px; font-weight:400; line-height:42px; letter-spacing:-0.7px; color:#1ba2da; border:1px solid #1ba2da; padding:0 40px; border-radius:22px}
.btn1 img{vertical-align:middle; margin:-3px 15px 0 0; width:18px}
.main_tb_bg{position:relative; overflow:hidden; margin:20px 20px 30px}
.main_tb1{position:relative; width:100%}
.main_tb1 th, .main_tb1 td{line-height:21px; letter-spacing:-0.7px; vertical-align:top; border-bottom:1px solid #eee; padding:20px 0}
.main_tb1 th{font-weight:400; color:#000; font-size:14px; width:20%; text-align:left; padding-right:15px}
.main_tb1 td{font-weight:200; color:#333; font-size:13px;}
.main_tb1 td b{font-weight:400; color:#000; font-size:14px; padding-bottom:3px; display:inline-block}
.main_tb1 .break{background:#eee; text-align:center; padding:10px 0}
.main_t_entry{position:relative; overflow:hidden; margin:40px 0 0; background:#f3f3f3; padding:18px 20px; font-size:13px; font-weight:200; line-height:23px; letter-spacing:-0.3px; color:#444}
.main_t_entry_tb{position:relative; width:100%; margin-bottom:15px}
.main_t_entry_tb th, .main_t_entry_tb td{vertical-align:middle; padding:18px 0}
.main_t_entry_tb th{width:45%; background:#fff; border:1px solid #ddd; font-size:13px; font-weight:300; line-height:18px; letter-spacing:-1px; color:#444}
.main_t_entry_tb td{background:url(../img/arrow_right.png) center center no-repeat; background-size:15px}
/* tab */
.tab1{display:block; clear:both; *zoom:1; margin:0 15px}
.tab1:after{display:block; height:0; content:"."; font-size:0; visibility:hidden; clear:both}
.tab1>.tab_menu{overflow:hidden; padding:15px 2px 30px}
.tab1>.tab_menu.tab_menu4{padding-bottom:15px}
.tab1>.tab_menu>li{float:left; margin:0 3px; text-align:center}
.tab1>.tab_menu.tab_menu4>li{width:calc(33.33333% - 6px)}
.tab1>.tab_menu .tit{display:block; padding:0 10px; font-weight:400; color:#777; cursor:pointer; font-size:13px; line-height:36px; border:1px solid #ddd; letter-spacing:-0.5px}
.tab1>.tab_menu.tab_menu4 .tit{padding:0}
.tab1>.tab_menu .on{position:relative}
.tab1>.tab_menu .on .tit{color:#1ba2da; border-color:#1ba2da}
.tab1>.tab_cont{float:left; width:100%; clear:both}
/* main_li1_bg */
.main_li1, .main_li1 li, .main_li1 li a{position:relative; overflow:hidden; display:block}
.main_li1 li{float:left; width:calc(33.33% - 10px); margin:0 5px 10px; transition:.3s}
.main_li1 li:nth-child(3n+1){clear:both}
.main_li1_img{display:block; width:100%}
.main_li1_t{text-align:center; font-size:12px; font-weight:200; line-height:16px; color:#555; letter-spacing:-1px; margin-bottom:5px; word-break:keep-all}
.main_li1_t b{display:block; color:#000; padding:10px 0 5px; font:400 13px/16px 'Noto Sans','cereal'; letter-spacing:-0.5px}
/*가로리스트*/
.main_tb2_top{position:relative; overflow:hidden; text-align:center; font-size:15px; line-height:24px; font-weight:400; letter-spacing:-1px; padding:10px 0; color:#333}
.main_tb2_bg{position:relative; overflow:hidden; margin:0 20px 30px}
.main_tb2{position:relative; width:100%}
.main_tb2 th, .main_tb2 td{padding:15px 0}
.main_tb2 tr:last-child th, .main_tb2 tr:last-child td{border-bottom:none}
.main_tb2 th{width:30%; vertical-align:top}
.main_tb2 th img{width:100%; max-width:120px}
.main_tb2 td{vertical-align:middle}
.main_tb2 .main_tb2_t_sub_bg{padding:0; border-bottom:1px solid #f2f2f2}
.main_tb2_t{font-size:14px; font-weight:400; line-height:22px; color:#000; letter-spacing:-0.5px; padding:5px 20px 15px; word-break:keep-all}
/*
.main_tb2_t b{display:block; padding:0 0 5px; font:400 15px/24px 'Noto Sans','cereal'}
*/
.main_tb2_t span{font-weight:200; color:#555}
.main_tb2_t_sub{position:relative; overflow:hidden; background:#f4f4f4; padding:11px 14px; font-size:11px; line-height:18px; letter-spacing:-1px; font-weight:200; color:#444; border-bottom:1px solid #f2f2f2; margin-bottom:15px}
.main_tb2_t_sub b{font-weight:400; margin-top:7px; display:inline-block}

.main_notice{padding:10px 0}
.main_notice .main_t p{text-align:left}


/* footer ================================================================================================================================================ */
.footer{position:relative; overflow:hidden; padding:20px; border-top:1px solid #eee}
.footer_tb{position:relative; width:100%; margin-bottom:25px}
.footer_tb th, .footer_tb td{vertical-align:top}
.footer_tb th{width:15%; text-align:left; font-size:13px; line-height:20px; letter-spacing:-0.7px; font-weight:300; color:#777; padding:6px 0}
.footer_tb td a{display:block; float:left; width:100px; margin:5px 20px 5px 0}
.footer_tb td a img{display:block; width:100%}
.footer_copy{position:relative; overflow:hidden; text-align:center; font:100 11px/15px 'cereal'; color:#bbb}

.footer_tb td a:nth-child(3n){width:64px}
.footer_tb td a:nth-child(3n) img{display:block;object-fit:contain;height:32px}



@media screen and (min-width:979px) {
body, .header ul.menu{max-width:979px}
body{margin:0 auto}
.header ul.menu{margin:50px auto 0}
.header_logo{left:50%; margin-left:-40px}
.main_t p{text-align:center}
.main_img{transition:.3s}
.main_img .btn_area .btn_main{width:25%;font-size:14px}
.main_img .btn_area .btn_main span{font-size:12px}
.main_img .btn_area .btn_main+.btn_main{margin-left:15px}
.main_img img{width:400px}
.main_li1 li{width:calc(20% - 10px); transition:.3s}
.main_li1 li:nth-child(3n+1){clear:inherit}
.main_li1 li:nth-child(5n+1){clear:both}
.main_notice .main_t{padding-left:185px}
.footer_tb td a:nth-child(2n){margin-right:20px}
}
@media screen and (max-width:374px) {
.main_li1_t{word-break:break-all}
}




.sponsor_li{font-size:0; margin:10px 20px 70px}
.sponsor_li li{display:inline-block; vertical-align:middle; width:25%}
.sponsor_li li a{display:block; margin:20px 10px; text-align:center; vertical-align:middle; position:relative; padding-bottom:17%}
.sponsor_li li a img{position:absolute; top:50%; left:50%; max-width:73%; max-height:100%; transform: translate(-50%, -50%);}





@media screen and (max-width:500px) {
.sponsor_li li{width:50%}
}
