@charset "utf-8";

/* main_con01_wrap (main_banner) */
.main_con01_wrap{ width: 1280px; margin: 0 auto; padding: 50px 0; }
.main_con01_wrap .site_wrap{ float: left; width: 760px; height: 260px; overflow: hidden; border-radius: 20px; padding: 40px 50px; background: #C8123B; }
.main_con01_wrap .site_wrap>ul>li{float: left; width:320px; height: 80px; margin-right: 20px; margin-bottom: 20px; position: relative; overflow: hidden; border-radius: 10px; background: #fff; }
.main_con01_wrap .site_wrap>ul>li:nth-child(2n){ margin-right: 0; }
.main_con01_wrap .site_wrap>ul>li:nth-child(3),
.main_con01_wrap .site_wrap>ul>li:nth-child(4){ margin-bottom: 0; }
.main_con01_wrap .site_wrap>ul>li>a{display: block; width: 100%; height: 80px; line-height: 80px; text-align: center; }
.main_con01_wrap .site_wrap>ul>li>a>img{ max-width: 100%; min-height: 80px; object-fit: cover; object-position: center; }


.main_con01_wrap .cs_wrap{ float: right; width: 480px; height: 260px; }
.main_con01_wrap .cs_wrap ul{}
.main_con01_wrap .cs_wrap ul li{ float: left; border-radius: 10px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); }
.main_con01_wrap .cs_wrap ul li.cs_box{ width: 100%; height: 150px; margin-bottom: 20px; background: #EEEEEE; padding: 25px 30px; }
.main_con01_wrap .cs_wrap ul li.cs_box h2{ font-size: 18px; margin-bottom: 5px; }
.main_con01_wrap .cs_wrap ul li.cs_box p.cs_num{ font-size: 52px; font-weight: 700; margin-bottom: 5px; letter-spacing: -0.03em; }
.main_con01_wrap .cs_wrap ul li.cs_box p.cs_p{ font-size: 16px; line-height: 1.6em; }

.main_con01_wrap .cs_wrap ul li.guide_box{ width: 100%; height: 90px; background:#fff url(../images/new_main/bg_guidebox.png) right 20px bottom 10px no-repeat; border: 1px solid #ddd; border-radius: 10px; }
.main_con01_wrap .cs_wrap ul li.guide_box > a{ display: block; width: 100%; height: 90px; padding: 20px 30px; }
.main_con01_wrap .cs_wrap ul li.guide_box h2{ font-size: 24px; margin-bottom: 5px; }
.main_con01_wrap .cs_wrap ul li.guide_box p.guide_p{ font-size: 14px; }


.main_con01_wrap .cs_wrap ul li.cs_sub_box{ width: 230px; height: 90px; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box a{ display: block; padding: 15px 20px; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box h2{ font-size: 20px; font-weight: 700; margin-bottom: 15px; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box span{ font-size: 12px; color: #666; padding-right: 20px; background: url(../images/new_main/btn_arrow.png) right 50% no-repeat; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box.cs_faq{ background: #fff url(../images/new_main/ico_cs_faq.png) 180px 40px no-repeat; margin-right: 20px; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box.cs_sample{ background: #fff url(../images/new_main/ico_cs_sample.png) 180px 40px no-repeat; }




/*main_con02_wrap*/
.main_con02_wrap{ width: 100%; padding: 60px 0; background: #f5f5f5; }
.main_con02_wrap .main_con02_box{ width: 1280px; margin: 0 auto; }
.main_con02_wrap .list_wrap{ float: left; width: 840px; height: 310px;}
.main_con02_wrap .list_wrap .list_tab{  margin-bottom: 20px; }
.main_con02_wrap .list_wrap .list_tab ul li{ float: left; display:block; font-size: 24px; margin-right: 50px; text-align: center; cursor: pointer; }
.main_con02_wrap .list_wrap .list_tab ul li:last-child{ margin-right: 0; }
.main_con02_wrap .list_wrap .list_tab ul li.on,
.main_con02_wrap .list_wrap .list_tab ul li:hover{ font-weight: 700; }

.main_con02_wrap .list_wrap .list_box{ width: 100%; height: 260px; position: relative; }
.main_con02_wrap .list_wrap .list_box li.item{ float: left; }
.main_con02_wrap .list_wrap .list_box li.item .tabcontent{ display:none; position:absolute; top:0; left:0; width:100%; height: 260px; padding: 5px 20px; background: #fff; border-radius: 10px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); }
.main_con02_wrap .list_wrap .list_box li.item.active .tabcontent{ display: block; }
.main_con02_wrap .list_wrap .list_box li.item .tabcontent .formbox{}
.main_con02_wrap .list_wrap .list_box li.item .tabcontent .formbox table{ width: 100%; }
.main_con02_wrap .list_wrap .list_box li.item .tabcontent .formbox table tr td.td_ico{ width: 100px; }
/*.main_con02_wrap .list_wrap .list_box li.item .tabcontent .formbox table tr td.td_tit{ width: ; }*/
.main_con02_wrap .list_wrap .list_box li.item .tabcontent .formbox table tr td.td_order{ width: 200px; }
.main_con02_wrap .list_wrap .list_box li.item .tabcontent .formbox table tr td.date{ width: 70px; text-align: right; }
.main_con02_wrap .list_wrap .list_box li.item .tabcontent .formbox table tr td{ height: 50px; border-bottom: 1px solid #eee; }
.main_con02_wrap .list_wrap .list_box li.item .tabcontent .formbox table tr:last-child td{ border-bottom: 0 none; }
.main_con02_wrap .list_wrap .list_box li.item .tabcontent .formbox table tr td a{ display: inline-block; font-size: 16px; max-width:88%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-left: 10px; }

.main_con02_wrap .notice_wrap{ float: right; width: 400px; height: 200px; margin-bottom: 20px; }
#mnotice h3 { display: inline-block; margin-bottom: 15px; margin-right: 50px; }
#mnotice h3 a{ font-size: 24px; font-weight: 400; }
#mnotice h3 a.on{ font-weight: 700; }
#mnotice .view{ width: 100%; height: 155px; }
#mnotice .view div>ul{ margin-bottom: 15px; }
#mnotice .view div>ul>li{ width: 100%; height: 50px; padding-left: 55px; position: relative; }
#mnotice .view div>ul>li:before{ display: block; content: ""; position: absolute; width: 38px; height: 38px; left: 0; top: 50%; transform: translateY(-50%); background: #fff url(../images/new_main/ico_notice.png) 50% 50% no-repeat; border-radius: 5px; box-shadow: 0 1px 3px rgba(0,0,0,0.2); }
#mnotice .view div>ul>li>a{ display: inline-block; width: 70%; line-height: 50px; border-bottom: 1px solid #ddd; font-size: 16px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#mnotice .view div>ul>li>span{ display:inline-block; width: 30%; line-height: 50px; border-bottom: 1px solid #ddd; text-align: right; font-size: 14px; font-weight: 300; color: #444; }
#mnotice .view div>ul>li:last-child a,
#mnotice .view div>ul>li:last-child span{ border-bottom: 0 none; }
#mnotice .view div .btn_more{ display:block; width: 100%; height: 40px;  }
#mnotice .view div .btn_more a{ display: block; width: 100%; height: 40px; background: #fff; border: 1px solid #ddd; border-radius: 10px; line-height: 40px; font-size: 16px; color: #666; text-align: center; }
.main_con02_wrap .center_wrap{ float: right; width: 400px; margin-right: 0; }
.main_con02_wrap .center_wrap>h2{ font-size: 24px; font-weight: 700; margin-bottom: 10px; }
.main_con02_wrap .center_wrap .btn_wrap{ display: table; width: 100%; height: 48px; border-radius: 10px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); overflow: hidden; }
.main_con02_wrap .center_wrap .btn_wrap a{ display: inline-block; width: 50%; height: 48px; font-size: 18px; font-weight: 500; text-align: center; line-height: 48px; color: #fff; }
.main_con02_wrap .center_wrap .btn_wrap a:nth-child(1){ background: #363636; }
.main_con02_wrap .center_wrap .btn_wrap a:nth-child(2){ background: #C8123B; }


/*main_con03_wrap*/
.main_con03_wrap{ width: 1280px; height: 100px; margin: 0 auto; margin-top: 50px; margin-bottom: 100px; background: #F2F2F2; border-radius: 10px; overflow: hidden; }
.main_con03_wrap h2{ display: inline-block; width: 280px; font-size: 24px; font-weight: 700; text-align: center; line-height: 100px; }
.main_con03_wrap ul{ float: right; width: auto; padding: 20px 40px 20px 0; }
.main_con03_wrap ul>li{ float:left; width: 180px; height: 60px; margin-right: 15px; background: #fff; border-radius: 5px; line-height: 60px; text-align: center; }
.main_con03_wrap ul>li:last-child{ margin-right:0; }
.main_con03_wrap ul>li>a{ display: block; width: 100%; height: 60px; position: relative; }
.main_con03_wrap ul>li>a>img{ max-width: 100%; max-height: 50px; object-fit: cover; }



/* 반응형 설정 ---------------------------------------------------------------------------------------------------------------------------------------------------*/

@media only screen and (max-width:1280px) {

/*main_con01_wrap*/
.main_con01_wrap{ width: 100%; padding: 50px 3%; }
.main_con01_wrap .site_wrap{ width: 55%; }
.main_con01_wrap .site_wrap>ul>li{ width: 48%; margin-right: 4%; }
.main_con01_wrap .site_wrap>ul>li>a>img{ min-height: revert; max-height: 60px; }
.main_con01_wrap .cs_wrap{ width: 42%; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box{ width: 48%;  }
.main_con01_wrap .cs_wrap ul li.cs_sub_box.cs_faq{ background: #fff url(../images/new_main/ico_cs_faq.png) 95% 40px no-repeat; margin-right: 4%; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box.cs_sample{ background: #fff url(../images/new_main/ico_cs_sample.png) 95% 40px no-repeat; }

/*main_con02_wrap*/
.main_con02_wrap{ width: 100%; height: auto; display: table; padding: 50px 3%; }
.main_con02_wrap .main_con02_box{ width: 100%; }
.main_con02_wrap .list_wrap,
.main_con02_wrap .notice_wrap,
.main_con02_wrap .center_wrap{ width: 48%; }
.main_con02_wrap .list_wrap .list_tab ul li{ font-size: 22px; margin-right: 40px; }
#mnotice h3{ margin-right: 40px; }
#mnotice h3 a{ font-size: 22px; }
.main_con02_wrap .center_wrap>h2{ font-size: 22px; margin-bottom: 15px; }



/*main_con03_wrap*/
.main_con03_wrap{ width: 100%; border-radius: 0; margin-top: 0; margin-bottom: 0; background: #b3b3b3; }
.main_con03_wrap h2{ display: none; }
.main_con03_wrap ul{ float: none; padding: 20px 3%; }
.main_con03_wrap ul>li{ width: 19%; margin-right: 1%; }


}

@media only screen and (max-width:1000px) {

/*main_con01_wrap*/
.main_con01_wrap{ padding: 30px 3% 50px 3%; }
.main_con01_wrap .site_wrap{ width: 100%; margin-bottom: 30px; }
.main_con01_wrap .cs_wrap{ width: 100%; height:160px; }
.main_con01_wrap .cs_wrap ul li.cs_box{ width: 60%; height: 160px; margin-bottom: 0; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box{ float: right; width: 36%; height: 70px; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box.cs_faq{ margin-right: 0; margin-bottom: 20px; background: #fff url(../images/new_main/ico_cs_faq.png) 95% 50% no-repeat; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box.cs_sample{ background: #fff url(../images/new_main/ico_cs_sample.png) 95% 50% no-repeat; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box span{ display: none; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box a{ padding: 0 20px; line-height: 70px; }


/*main_con02_wrap*/
.main_con02_wrap .list_wrap,
.main_con02_wrap .notice_wrap,
.main_con02_wrap .center_wrap{ width: 100%; }
.main_con02_wrap .list_wrap{ margin-bottom: 50px; }
.main_con02_wrap .notice_wrap{ margin-bottom: 50px; }
.main_con02_wrap .center_wrap{  }



/*main_con03_wrap*/
.main_con03_wrap .list_wrap .list_tab ul li{ font-size: 20px; }
#mnotice h3 a{ font-size: 20px; }


}

@media only screen and (max-width:720px) {

/*main_con01_wrap*/
.main_con01_wrap{ padding: 0; }
.main_con01_wrap .site_wrap{ height: 200px; border-radius: 0; padding: 30px 40px; }
.main_con01_wrap .site_wrap>ul>li{ height: 60px; }
.main_con01_wrap .site_wrap>ul>li>a{ height: 60px; line-height: 60px; }
.main_con01_wrap .cs_wrap{ height: 140px; padding: 0 3%; margin-bottom: 30px; }
.main_con01_wrap .cs_wrap ul li.cs_box{ height: 140px; padding: 20px 20px; }
.main_con01_wrap .cs_wrap ul li.cs_box p.cs_num{ font-size: 45px; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box{ height: 60px; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box a{ line-height: 60px; }

/*main_con02_wrap*/
.main_con02_wrap .list_wrap .list_tab ul li{ font-size: 20px; }

}

@media only screen and (max-width:580px) {

/*main_con01_wrap*/
.main_con01_wrap .cs_wrap{ height: 220px; }
.main_con01_wrap .cs_wrap ul li.cs_box{ width: 100%; margin-bottom: 20px; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box{ float: left; width: 48%; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box.cs_faq{ margin-bottom: 0; margin-right: 4%; }
.main_con01_wrap .cs_wrap ul li.cs_sub_box h2{ font-size: 18px;  }

/*main_con02_wrap*/
.main_con02_wrap{}
.main_con02_wrap .list_wrap .list_tab{ padding-left: 10px; margin-bottom: 15px; }
.main_con02_wrap .list_wrap .list_tab ul li{ font-size: 18px; margin-right: 20px; }
#mnotice h3{ margin-bottom: 15px; margin-right: 20px; }
#mnotice h3:first-child{ padding-left: 10px; }
#mnotice h3 a{ font-size: 18px; }
#mnotice .view div>ul>li{ display: grid; }
#mnotice .view div>ul>li>a{ width:  100%; font-size: 15px; }
#mnotice .view div>ul>li>span{ display: none; }
.main_con02_wrap .notice_wrap{ margin-bottom: 40px; }
.main_con02_wrap{ height: 140px; padding: 50px 3%; }
.main_con02_wrap .list_wrap{ height: 250px; margin-bottom: 40px; }
.main_con02_wrap .list_wrap .list_tab{ margin-bottom: 15px; padding-left: 10px; }
.main_con02_wrap .list_wrap .list_tab ul li{ font-size: 18px; margin-right: 20px; }
.main_con02_wrap .list_wrap .list_box{ height: 210px; }
.main_con02_wrap .list_wrap .list_box li.item .tabcontent{ height: 210px; padding: 5px 15px; }
.main_con02_wrap .list_wrap .list_box li.item .tabcontent .formbox table tr td{ height: 40px; }
.main_con02_wrap .list_wrap .list_box li.item .tabcontent .formbox table tr td.td_ico{ display:none; }
.main_con02_wrap .list_wrap .list_box li.item .tabcontent .formbox table tr td a{ font-size: 15px; }
.main_con02_wrap .center_wrap>h2{ font-size: 20px; }

/*main_con03_wrap*/
.main_con03_wrap{ height: 150px; padding: 20px 3%; }
.main_con03_wrap ul{ padding: 0; }
.main_con03_wrap ul>li{ width: 32%; height: 50px; line-height: 50px; margin-right: 2%; margin-bottom: 10px; }
.main_con03_wrap ul>li:nth-child(3){ margin-right: 0; }
.main_con03_wrap ul>li:nth-child(4),
.main_con03_wrap ul>li:nth-child(5){ margin-bottom: 0; }

}

@media only screen and (max-width:430px) {

}