@font-face {
    font-family: "HGGGothicssi";
    src: url(../font/HGGGothicssi 60g.ttf) format('truetype');
}

@font-face {
    font-family: "NanumBarunGothic";
    src:url(../font/NanumBarunGothic.eot);
    src:url(../font/NanumBarunGothic.woff) format('woff'), url(../font/NanumBarunGothic.ttf) format('truetype');
}

body { font-family: "NanumBarunGothic" }
.wrap { background: url(../images/Background.png) center no-repeat; background-size: cover; overflow:auto; height:1100px;}
.wrap .content_wrap { width: 1100px; margin: 0 auto; height: 980px; position: relative;}
.wrap .main_logo {position: absolute; right:0; top: 43px;margin-left: -357.5px; z-index:10;}
.wrap .content_wrap .imgArea{position: absolute; top: 43px; left:-90px}

.wrap .content_wrap .content_list {
    position: absolute;
    top: 236px;
    right: 0;
    z-index: 999;
    width: 495px;
    border: 5px solid #df3333;
    box-sizing: border-box;
    border-radius: 30px;
    overflow: hidden;
    background: #fff;
}
.wrap .content_wrap .content_list li{float: left; border-bottom: 5px solid #df3333; box-sizing: border-box;}
.wrap .content_wrap .content_list li.left{ border-right: 5px solid #df3333; }
.wrap .content_wrap .content_list li a { display: block; width: 240px; height: 90px;}
.wrap .content_wrap .content_list li.con01 a { background:#fff url(../images/con01.png) center no-repeat; transition: all 0.2s;}
.wrap .content_wrap .content_list li.con02 a { background:#fff url(../images/con02.png)  center no-repeat;transition: all 0.2s; }
.wrap .content_wrap .content_list li.con03 a { background:#fff url(../images/con03.png)  center no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con04 a { background:#fff url(../images/con04.png)  center no-repeat;transition: all 0.2s; }
.wrap .content_wrap .content_list li.con05 a { background:#fff url(../images/con05.png)  center no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con06 a { background:#fff url(../images/con06.png)  center no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con07 a { background:#fff url(../images/con07.png)  center no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con08 a { background:#fff url(../images/con08.png) center no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con09 a { background:#fff url(../images/con09.png) center no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con10 a { background:#fff url(../images/con10.png) center no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con11 a { background:#fff url(../images/con11.png) center no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con12 a { background:#fff url(../images/con12.png) center no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con13 a { background:#fff url(../images/con13.png) center 22px no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con14 a { background:#fff url(../images/con14.png) center no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con15 a { background:#fff url(../images/con15.png) center 25px no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con16 a { background:#fff url(../images/con16.png) center no-repeat; transition: all 0.2s; }
.wrap .content_wrap .content_list li.con15,.wrap .content_wrap .content_list li.con16{border-bottom:none;}

.wrap .content_wrap.pc .content_list li.con01:hover a { background:#fc8800 url(../images/con01_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con02:hover a { background:#359741 url(../images/con02_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con03:hover a { background:#fc8800 url(../images/con03_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con04:hover a { background:#359741 url(../images/con04_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con05:hover a { background:#359741 url(../images/con05_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con06:hover a { background:#a939b0 url(../images/con06_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con07:hover a { background:#a939b0 url(../images/con07_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con08:hover a { background:#a939b0 url(../images/con08_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con09:hover a { background:#a939b0 url(../images/con09_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con10:hover a { background:#359741 url(../images/con10_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con11:hover a { background:#a939b0 url(../images/con11_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con12:hover a { background:#fc8800 url(../images/con12_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con13:hover a { background:#fc8800 url(../images/con13_on.png) center 22px no-repeat;}
.wrap .content_wrap.pc .content_list li.con14:hover a { background:#fc8800 url(../images/con14_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con15:hover a { background:#2d9bb6 url(../images/con15_on.png) center 25px no-repeat;}
.wrap .content_wrap.pc .content_list li.con16:hover a { background:#a939b0 url(../images/con16_on.png) center no-repeat;}

.wrap .content_wrap.pc .content_list li.con01.on a { background:#fc8800 url(../images/con01_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con02.on a { background:#359741 url(../images/con02_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con03.on a { background:#fc8800 url(../images/con03_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con04.on a { background:#359741 url(../images/con04_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con05.on a { background:#359741 url(../images/con05_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con06.on a { background:#a939b0 url(../images/con06_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con07.on a { background:#a939b0 url(../images/con07_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con08.on a { background:#a939b0 url(../images/con08_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con09.on a { background:#a939b0 url(../images/con09_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con10.on a { background:#359741 url(../images/con10_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con11.on a { background:#a939b0 url(../images/con11_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con12.on a { background:#fc8800 url(../images/con12_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con13.on a { background:#fc8800 url(../images/con13_on.png) center 22px no-repeat;}
.wrap .content_wrap.pc .content_list li.con14.on a { background:#fc8800 url(../images/con14_on.png) center no-repeat;}
.wrap .content_wrap.pc .content_list li.con15.on a { background:#2d9bb6 url(../images/con15_on.png) center 25px no-repeat;}
.wrap .content_wrap.pc .content_list li.con16.on a { background:#a939b0 url(../images/con16_on.png) center no-repeat;}

.wrap .content_wrap.pc .apply_box {
    position: absolute;
    top: 743px;
    left: -1px;
}


.wrap .content_wrap .sub_conArea{
    position: absolute;
    top: 851px;
    left: 1px;
}
.wrap .content_wrap .sub_conArea .sub_cont_list {margin-top:25px}
.wrap .content_wrap .sub_conArea .sub_cont_list li.area{width: 127px; height: 50px; text-indent: -9999px; float: left; margin-right: 10px;}
.wrap .content_wrap .sub_conArea .sub_cont_list li.area.list1{background: url(../images/sub_con_area01.png) center no-repeat;background-size:100%;}
.wrap .content_wrap .sub_conArea .sub_cont_list li.area.list2{background: url(../images/sub_con_area02.png) center no-repeat;background-size:100%;}
.wrap .content_wrap .sub_conArea .sub_cont_list li.area.list3{background: url(../images/sub_con_area03.png) center no-repeat;background-size:100%;}
.wrap .content_wrap .sub_conArea .sub_cont_list li.area.list4{background: url(../images/sub_con_area04.png) center no-repeat;background-size:100%;}
.wrap .mobile { width: 520px; margin: 0 auto; display: none; }
.wrap .footer { width: 1120px; margin: 0 auto;}
.wrap .footer.pc{}
.wrap .footer.pc .footer_con{z-index: 999; position:relative; }
.wrap .footer .link {overflow: hidden; position: absolute; top:50px; right:0;}
.wrap .footer .link li { float: left; margin-right: 21px; position: relative; }
.wrap .footer .link li a{display:block;}
.wrap .footer .link > li.first:before { content:""; display: block; width: 1px; height: 18px; background: rgba(0,0,0,0.2); position: absolute; top: 5px; right: -11px; }
.wrap .footer .ad_list {position: absolute;  top:55px; left:0; overflow: hidden; font-size:13px; line-height:21px; }
.wrap .footer .ad_list li { float: left; margin-right: 19px; font-size: 13px; color: #000; position: relative; }
.wrap .footer .ad_list li.last { margin-right: 0; }
.wrap .footer .ad_list li:after { content:""; display: block; width: 1px; height: 12px; background-color:rgba(0,0,0,0.5); position: absolute; top: 3px; right: -10px; }
.wrap .footer .ad_list li.last:after {width:0;}
.wrap .footer.mobile{display:none;}
.wrap .footer.mobile .link > li.first:before{top:10px;}

@media screen and ( max-width:640px ) {
    .wrap { background: url(../images/m_Background.png) center no-repeat; background-size: cover; padding-top: 48px; overflow:hidden; height:auto; }
    .wrap { }
    .wrap .pc { display: none;}
    .wrap .mobile { width: 100%; margin: 0 auto; display: block; padding-bottom: 20px;  height:auto; }
    .wrap .mobile .m_logo{}
    .wrap .mobile .m_logo img{width:80%; float: right; margin-right: 5%; margin-bottom:20px;}

    .wrap .content_wrap.mobile .imgArea{position:static;}
    .wrap .content_wrap.mobile .imgArea img{width:100%;}
	.wrap .content_wrap.mobile .apply_box{position:static; width:90%; margin:auto; padding-bottom:18px;}
	.wrap .content_wrap.mobile .apply_box .apply_date{width:80%; margin:auto;}
	.wrap .content_wrap.mobile .apply_box .apply_date img{width:100%; margin:auto;}
    .wrap .content_wrap.mobile .sub_conArea{position:static; width:90%; margin: auto; }
    .wrap .content_wrap.mobile .sub_conArea .tit{width:80%; margin: auto;}
    .wrap .content_wrap.mobile .sub_conArea .tit img{width: 100%;}
    .wrap .content_wrap.mobile .sub_conArea .sub_cont_list {margin-top:20px; margin-bottom: 25px;height: 50px;}
    .wrap .content_wrap.mobile .sub_conArea .sub_cont_list li.area{width:23.5%; margin-right: 2%;}
    .wrap .content_wrap.mobile .sub_conArea .sub_cont_list li.area:last-child{margin-right: 0;}
    .wrap .content_wrap.mobile .content_list {width:90%; position:static; margin:auto;}
    .wrap .content_wrap.mobile .content_list li{width:50%;}
    .wrap .content_wrap.mobile .content_list li a{width:100%;}
    .wrap .content_wrap.mobile .content_list li a{background-size:80%;}
    .wrap .content_wrap.mobile .content_list li.con01 a{ background-size:60%;}
    .wrap .content_wrap.mobile .content_list li.con02 a{ background-size:75%;}
    .wrap .content_wrap.mobile .content_list li.con03 a{ background-size:70%;}
    .wrap .content_wrap.mobile .content_list li.con04 a{ background-size:90%;}
    .wrap .content_wrap.mobile .content_list li.con05 a{ background-size:85%;}
    .wrap .content_wrap.mobile .content_list li.con07 a{ background-size:65%;}
    .wrap .content_wrap.mobile .content_list li.con09 a{ background-size:60%;}
    .wrap .content_wrap.mobile .content_list li.con12 a{ background-size:75%;}
    .wrap .content_wrap.mobile .content_list li.con13 a{ background-size:90%;background-position-y:center;}
    .wrap .content_wrap.mobile .content_list li.con14 a{ background-size:65%;}
    .wrap .content_wrap.mobile .content_list li.con15 a{ background-size:75%;background-position-y:center;}
    .wrap .content_wrap.mobile .content_list li.con16 a{ background-size:65%;}
    
    .wrap .footer.pc{display:none;}
    .wrap .footer.mobile{display:block;}
    .wrap .footer.mobile { width: 90%; height: auto; overflow: hidden; padding-bottom: 20px; }
    .wrap .footer.mobile .link { float: none; margin-top:20px; position:static; width: 293px; margin: auto; }
    .wrap .footer.mobile .link li { margin-right: 30px; }
    .wrap .footer.mobile .link li img{width:100%}
    .wrap .footer.mobile .link li.first {width:93px;}
    .wrap .footer.mobile .link li.first:before { right: -16px; top:5px;}
    .wrap .footer.mobile .link li.last {width: 170px;margin-right: 0;}    
    .wrap .footer.mobile .ad_list { float: none; margin-top: 20px; position:static;}
    .wrap .footer.mobile .ad_list li{width:100%; text-align: center; margin-bottom:8px; }
}

@media screen and ( max-width:480px ) {
    .wrap .content_wrap.mobile .sub_conArea .sub_cont_list {margin-top:10px; margin-bottom: 15px;}
    .wrap .content_wrap.mobile .content_list li a{height:50px;}

    
}

@media screen and ( max-width:560px ) {
/*    .wrap .m_content { width: 90%; margin: 0 auto; }
    .wrap .m_content .m_logo { width: 100%; }
    .wrap .m_content .m_logo img { width: 100%; }
    .wrap .m_content .m_conlist { width:100%; }
    .wrap .m_content .m_conlist li { width:100%; }
    .wrap .m_content .m_conlist li img { width: 100%; }

    .wrap .footer { width: 90%; }
    .wrap .footer .link .first { }
    .wrap .footer .link .last { margin-right: 0; }
    .wrap .footer .ad_list{width:90%;}
    .wrap .footer .ad_list li.first {margin-bottom: 5px;width: 100%;}*/
    
}

@media screen and ( max-width:385px ) {
/*    .wrap .footer .ad_list li.first { margin-bottom: 5px; }
    .wrap .footer .ad_list li.last { margin-top: 5px; }*/
}