@charset "euc-kr";
/* CSS Document */

body{padding:0; margin:0;}
div, ul, li, dl, dt, dd, h1, p, th, td, span{padding:0; margin:0}
ul li{list-style:none}
.mgt0{margin-top:0 !important}
.mgt10{margin-top:10px !important}
.mgt20{margin-top:20px !important}
.mgt30{margin-top:30px !important}
.clear{clear:both}

/* À¥Áø¸ÞÀÎ */
.w_wrap{font-family:dotum,'µ¸¿ò'; overflow:hidden; width:740px; line-height:24px; margin-top:30px}
.w_wrap .w_main li{float:left; position:relative; cursor:pointer; margin-left:10px; margin-bottom:10px}
.w_wrap .w_main li.Cboth{clear:both}
.w_wrap .w_main li:first-child{margin-left:0}
.w_wrap .w_main li:nth-child(even){margin-left:0}
.w_wrap .w_main li a{height:243px}
.w_wrap .w_main li a h1{position:absolute; left:25px; top:20px; font-size:22px}
.w_wrap .w_main li a p{position:absolute; left:25px; bottom:25px; font-size:18px}
.w_wrap .w_main li a img.m_img{display:none}
.w_wrap .w_main li.white a{color:#ffffff !important}
.w_wrap .w_main li.black a{color:#000}

@media only screen and ( min-width:601px ) and ( max-width:739px ){
.w_wrap{width:100%; line-height:1.7; margin-top:2%; font-family:notokr, MalgunGothic, NanumGothic, dotum, sans-serif;}
.w_wrap .w_main li{width:100%; clear:left; margin-left:0; margin-bottom:0}
.w_wrap .w_main li:first-child{display:none}
.w_wrap .w_main li a{height:25%}
.w_wrap .w_main li a h1{position:absolute;  left:4%; top:8%; font-size:1.6em}
.w_wrap .w_main li a p{position:absolute; left:4%; bottom:8%; font-size:1.4em}
.w_wrap .w_main li a img.m_img{width:100%; display:block}
.w_wrap .w_main li a img.w_img, .w_wrap .w_main li.w_ctn{display:none}
.w_wrap .w_main li.white a{color:#fff}
.w_wrap .w_main li.black a{color:#000}
}

@media only screen and ( min-width:481px ) and ( max-width:600px ){
.w_wrap{width:100%; line-height:1.7; margin-top:2%; font-family:notokr, MalgunGothic, NanumGothic, dotum, sans-serif;}
.w_wrap .w_main li{width:100%; clear:left; margin-left:0; margin-bottom:0}
.w_wrap .w_main li:first-child{display:none}
.w_wrap .w_main li a{height:25%}
.w_wrap .w_main li a h1{position:absolute;  left:4%; top:8%; font-size:1.4em}
.w_wrap .w_main li a p{position:absolute;  left:4%; bottom:8%; font-size:1.2em}
.w_wrap .w_main li a img.m_img{width:100%; display:block}
.w_wrap .w_main li a img.w_img, .w_wrap .w_main li.w_ctn{display:none}
.w_wrap .w_main li.white a{color:#fff}
.w_wrap .w_main li.black a{color:#000}
}

@media only screen and ( min-width:320px ) and ( max-width:480px ){
.w_wrap{width:100%; line-height:1.7; margin-top:2%; font-family:notokr, MalgunGothic, NanumGothic, dotum, sans-serif;}
.w_wrap .w_main li{width:100%; clear:left; margin-left:0; margin-bottom:0}
.w_wrap .w_main li:first-child{display:none}
.w_wrap .w_main li a{height:25%}
.w_wrap .w_main li a h1{position:absolute;  left:4%; top:8%; font-size:1.2em}
.w_wrap .w_main li a p{position:absolute;  left:4%; bottom:8%; font-size:1em}
.w_wrap .w_main li a img.m_img{width:100%; display:block}
.w_wrap .w_main li a img.w_img, .w_wrap .w_main li.w_ctn{display:none}
.w_wrap .w_main li.white a{color:#fff}
.w_wrap .w_main li.black a{color:#000}
}


/* À¥ÁøÄÁÅÙÃ÷ */
.w_content{font-family:dotum,'µ¸¿ò'; font-size:14px; width:740px; font-weight:200; line-height:1.6;}
.w_content h1{font-size:1.4em; color:#000; font-weight:600; margin-top:30px;}
.w_content h2{font-size:1.2em;}
.w_content ul li{margin-top:10px}
.w_content ul li img{width:100%}
.w_content ul li .w_Q{color:#3386e2; font-weight:400;}
.w_content ul li .w_A{color:#f14b23;font-weight:400;}
.w_content ul li .s_txt{color:#999;}
.w_content .txtC{text-align:center}
.w_content .txtR{text-align:right}
.w_content .txtBlue{color:#3386e2}
.w_content .txtRed{color:#ef4c23}
.w_content .titblue{color:#3386e2; font-weight:300; font-size:14px}/*201505*/
.w_content .titRed{background:#ef4c23; text-align:center; color:#fff; border-radius:50px; width:180px;}
.w_content .left{float:left; width:50%}
.w_content .visual_box{width:740px; font-size:36px; margin:30px 0; font-weight:200; line-height:1.3}
.w_content .visual_box img{width:100%; display:block}
.w_content .visual_box span{position:absolute; left:30px; top:250px}
.w_content .visual_box span.titR{position:absolute; text-align:right; left:390px; top:275px}
.w_content .visual_box span.black{color:#000}
.w_content .visual_box span.white{color:#fff}
.w_content .tableBox{margin-top:30px; border-top:2px solid #3386e2; width:100%; border-collapse:collapse;}
.w_content .tableBox th{padding:10px 0; text-align:center;  border:1px solid #ccc}
.w_content .tableBox td{padding:10px; border:1px solid #ccc}
.app .app_box{display:block; overflow:hidden; margin-bottom:30px}
.app .app_box img{background:#eaf3fc; padding:15px; border-radius:10px; vertical-align:middle; width:70px; margin-right:3%}
.app .app_box .app_btn{margin-left:10px; background:#f6f7f9; border:1px solid #e6e7e9; font-family:dotum; padding:2px;}
.app .app_box .app_line{color:#e6e7e9}
.app .app_box dl dt{padding-top:3%}
.app ul li.w100{width:100% !important}
.app ul li.w50{width:100% !important}
.app ul li.w50 img{width:50% !important}
.app ul li.w30{width:33% !important}
.app ul li{float:left; width:50%;text-align:center}
.app ul li:last-child{clear:both !important; width:100%; text-align:left; margin-top:20px}
/*201605*/
.w_content .listbox_01{margin-top:30px; border:1px solid #ccc; padding:20px;}
.w_content .arrow{max-width:42px; margin:10px auto;}
.w_content .iconbox_01 h1{font-weight:300; font-size:14px; color:#3386e2}
.w_content .iconbox_01 h3{font-size:14px; font-weight:400}
.w_content .iconbox_01 .icon{margin-top:10px; overflow:hidden; border:1px solid #ccc; padding:20px}
.w_content .iconbox_01 .icon li{float:left; width:140px; text-align:center}
.w_content .iconbox_01 .icon li:nth-child(odd){width:19%}
.w_content .iconbox_01 .icon li img.icon_img{width:80px;}
.app .iconbox {border:1px solid #ccc; overflow:hidden; padding:20px 30px; margin:30px 0;}
.app .iconbox ul li{text-align:left; clear:left; width:100%}
.app .iconbox ul li img{vertical-align:middle; width:10% !important; margin-right:20px}
.w_content .w_w70{width:70%;}

@media only screen and ( min-width:601px ) and ( max-width:739px ){
.w_content{width:100%; font-weight:200; line-height:1.7; font-family:notokr, MalgunGothic, NanumGothic, dotum, sans-serif;}
.w_content ul{margin-top:2%}
.w_content h1{font-size:1.2em;  color:#000; font-weight:600; margin-top:30px;}
.w_content .titRed{background:#ef4c23; text-align:center; color:#fff; border-radius:50px; width:25%;}
.w_content .visual_box{width:100%; font-size:1.8em; margin-bottom:30px; font-weight:200; line-height:1.3}
.w_content .visual_box span{position:absolute; left:7%; top:8%}
.w_content .visual_box span.titR{position:absolute; text-align:right; left:50%; top:9%}
.app .app_box img{background:#eaf3fc; padding:2.02%; width:14%; margin-right:3%}
.app ul li{width:100%; text-align:center}
.culture img{position:relative !important;}
.culture span{position:absolute !important; top:4.5% !important;}
.w_content .iconbox_01 h1{font-weight:400; font-size:1em; color:#3386e2}
.w_content .iconbox_01 h3{font-size:0.9em; font-weight:400}
.w_content .iconbox_01{width:100%;}
.w_content .iconbox_01 .icon{width:100%; margin:10px auto; border:1px solid #ccc; padding:0}
.w_content .iconbox_01 .icon li{clear:both !important; width:100% !important;}
.w_content .iconbox_01 .icon li:nth-child(odd){width:100%}
.w_content .iconbox_01 .icon li img.icon_img{width:50%; }
.w_content .iconbox_01 .icon li:nth-child(even){margin:30px 0; transform:rotate(90deg); -ms-transform:rotate(90deg); -webkit-transform:rotate(90deg)}
.app ul li.w50{width:100% !important}
.app ul li.w50 img{width:100% !important}
.w_content img.m_w100{width:100%}
.w_content p{font-size:0.9em}
}

@media only screen and ( min-width:481px ) and ( max-width:600px ){
.w_content{width:100%; font-weight:200; line-height:1.7; font-family:notokr, MalgunGothic, NanumGothic, dotum, sans-serif;}
.w_content ul{margin-top:2%}
.w_content h1{font-size:1.2em;  color:#000; font-weight:600; margin-top:30px;}
.w_content .titRed{background:#ef4c23; text-align:center; color:#fff; border-radius:50px; width:30%;}
.w_content .visual_box{width:100%; font-size:1.8em; margin-bottom:30px; font-weight:200; line-height:1.3}
.w_content .visual_box span{position:absolute; left:7%; top:8%}
.w_content .visual_box span.titR{position:absolute; text-align:right; left:50%; top:9%}
.app .app_box img{background:#eaf3fc; padding:2.02%; width:14%; margin-right:3%}
.app ul li{width:100%; text-align:center}
.culture img{position:relative !important;}
.culture span{position:absolute !important; top:4.5% !important;}
.w_content .iconbox_01 h1{font-weight:400; font-size:1em; color:#3386e2}
.w_content .iconbox_01 h3{font-size:0.9em; font-weight:400}
.w_content .iconbox_01{width:100%;}
.w_content .iconbox_01 .icon{width:100%; margin:10px auto; border:1px solid #ccc; padding:0}
.w_content .iconbox_01 .icon li{clear:both !important; width:100% !important; text-align:center}
.w_content .iconbox_01 .icon li:nth-child(odd){width:100%}
.w_content .iconbox_01 .icon li img.icon_img{width:50%; }
.w_content .iconbox_01 .icon li:nth-child(even){margin:30px 0; transform:rotate(90deg); -ms-transform:rotate(90deg); -webkit-transform:rotate(90deg)}
.app ul li.w50{width:100% !important}
.app ul li.w50 img{width:100% !important}
.app ul li.w30{width:100% !important}
.w_content .visual_box span.fin_tit{position:absolute; left:10%; top:1.7%}
.w_content img.m_w100{width:100%}
.w_content p{font-size:0.9em}
}

@media only screen and ( min-width:321px ) and ( max-width:480px ){
.w_content{width:100%; font-weight:200; line-height:1.7; font-family:notokr, MalgunGothic, NanumGothic, dotum, sans-serif;}
.w_content ul{margin-top:2%}
.w_content h1{font-size:1.2em;  color:#000; font-weight:600; margin-top:30px;}
.w_content .titRed{background:#ef4c23; text-align:center; color:#fff; border-radius:50px; width:35%;}
.w_content .visual_box{width:100%; font-size:1.4em; margin-bottom:30px; font-weight:200; line-height:1.3}
.w_content .visual_box span{position:absolute; left:10%; top:3.5%}
.w_content .visual_box span.titR{position:absolute; text-align:right; left:49%; top:7.1%}
.app .app_box img{background:#eaf3fc; padding:2.02%; width:14%; margin:2% 3%}
.app ul li{width:100%; text-align:center}
.culture img{position:relative !important;}
.culture span{position:absolute !important; top:4.5% !important;}
.w_content .iconbox_01 h1{font-weight:400; font-size:1em; color:#3386e2}
.w_content .iconbox_01 h3{font-size:0.9em; font-weight:400}
.w_content .iconbox_01{width:100%;}
.w_content .iconbox_01 .icon{width:100%; margin:10px auto; border:1px solid #ccc; padding:0}
.w_content .iconbox_01 .icon li{clear:both !important; width:100% !important; text-align:center}
.w_content .iconbox_01 .icon li:nth-child(odd){width:100%}
.w_content .iconbox_01 .icon li img.icon_img{width:50%; }
.w_content .iconbox_01 .icon li:nth-child(even){margin:30px 0; transform:rotate(90deg); -ms-transform:rotate(90deg); -webkit-transform:rotate(90deg)}
.app ul li.w50{width:100% !important}
.app ul li.w50 img{width:100% !important}
.app ul li.w30{width:100% !important}
.w_content .visual_box span.fin_tit{position:absolute; left:10%; top:2.1%}
.w_content .visual_box span.cul_tit{position:absolute; text-align:right; left:48%; top:1.6%}
.w_content img.m_w100{width:100%}
.w_content p{font-size:0.9em}
}

@media only screen and ( max-width:320px ){
.w_content{width:100%; font-weight:200; line-height:1.7; font-family:notokr, MalgunGothic, NanumGothic, dotum, sans-serif;}
.w_content ul{margin-top:2%}
.w_content h1{font-size:1em;  color:#000; font-weight:600; margin-top:30px;}
.w_content .titRed{background:#ef4c23; text-align:center; color:#fff; border-radius:50px; width:40%;}
.w_content .visual_box{width:100%; font-size:1.2em; margin-bottom:30px; font-weight:200; line-height:1.3}
.w_content .visual_box span{position:absolute; left:10%; top:3.2%}
.w_content .visual_box span.titR{position:absolute; text-align:right; left:50%; top:6.5%}
.app .app_box img{background:#eaf3fc; padding:2.02%; width:14%; margin:1% 2%}
.app ul li{width:100%; text-align:center}
.culture img{position:relative !important;}
.culture span{position:absolute !important; top:4.5% !important;}
.w_content .iconbox_01 h1{font-weight:400; font-size:1em; color:#3386e2}
.w_content .iconbox_01 h3{font-size:0.9em; font-weight:400}
.w_content .iconbox_01{width:100%;}
.w_content .iconbox_01 .icon{width:100%; margin:10px auto; border:1px solid #ccc; padding:0}
.w_content .iconbox_01 .icon li{clear:both !important; width:100% !important; text-align:center}
.w_content .iconbox_01 .icon li:nth-child(odd){width:100%}
.w_content .iconbox_01 .icon li img.icon_img{width:50%; }
.w_content .iconbox_01 .icon li:nth-child(even){margin:30px 0; transform:rotate(90deg); -ms-transform:rotate(90deg); -webkit-transform:rotate(90deg)}
.app ul li.w50{width:100% !important}
.app ul li.w50 img{width:100% !important}
.app ul li.w30{width:100% !important}
.app .iconbox {border:1px solid #ccc; overflow:hidden; padding:3% 4%;}
.app .iconbox ul li{text-align:left; clear:left; width:100%}
.app .iconbox ul li img{vertical-align:middle; width:10% !important; margin-right:20px}
.w_content .visual_box span.fin_tit{position:absolute; left:10%; top:1.9%}
.w_content .visual_box span.cul_tit{position:absolute; text-align:right; left:50%; top:1.4%}
.w_content img.m_w100{width:100%}
.w_content p{font-size:0.9em}