@charset "utf-8";
::selection {color: #ff8400; background-color: rgb(255, 255, 255);}

 /* 스킵 내비게이션  */
 #skip {position: relative; z-index: 999;}
 #skip a {position: absolute; left: 0px; top: -35px; border: 1px solid #fff; color: #fff; background: #333; line-height: 30px; width: 140px; text-align: center;}
 #skip a:active,
 #skip a:focus {top: 0;}

 /* 전체레이아웃 */
 body {width: 100%; min-height: 1000px; background: linear-gradient(#000, #000, #393535); font-family: 'Noto Sans KR', sans-serif; position: relative;}
 body.substyle {background: #fff;}
 .container {width: 1700px; margin: 0 auto;}
 @media all and (max-width: 1700px) {
    .container {width: 95%; margin: 0 auto;}
 }
 @media all and (max-width: 1200px) {
    .container {width: 98%; margin: 0 auto;}
 }
 

/* header */
header {width: 100%; height: 90px; background: #000; display: block; position: relative; z-index: 100;} 
header h1 {width: 240px; height: 90px; float: left; display: flex; align-items: center;}
header h1 img {width: 100%;}
header nav {float: right; height: 90px; line-height: 90px; }
header nav > ul > li {display: inline-block; position: relative;}
header nav > ul > li > a {display: block; padding: 10px 50px; line-height: 40px; font-size: 22px; font-weight: 500; color: #eaeaea; transition: all .3s;} 
header nav > ul > li:hover > a {color: rgb(255, 157, 0);}
header nav li ul {display: none; position: absolute; width: 100%; box-shadow: 0 0 2px rgba(0,0,0,0.1);}
header nav li li a {display: block; line-height: 38px; text-align: center; font-weight: 400; font-size: 16px; background-color: #ffffffe9; color: #666; transition: all .3s; padding: 3px 10px;}
header nav li:hover ul {display: block;}
header nav li li a:hover {background-color: #f4f4f4; color: #ff9900;}

/* 모바일 메뉴 */
#mobile_header {width: 100%;  position: fixed; z-index: 1000; background: #ffffff; border-bottom: 1px solid #ececec41; padding: 15px 20px; height: 70px; display: none;}
.mobile_logo {float: left;}
.mobile_logo a {display: block;margin-top: 4px;}
.mobile_logo img {width: 160px;}
.ham_btn {float: right;}
.ham_btn a {display: block; width: 30px; height: 22px; position: relative; margin-top: 9px;}
.ham_btn i {display: block; width: 30px; height: 3px; background: #fff; position: absolute;}
.ham_btn i:nth-of-type(1) {top: 0;}
.ham_btn i:nth-of-type(2) {top: 50%; transform: translateY(-50%);}
.ham_btn i:nth-of-type(3) {bottom: 0;}

.mo_top_util {background: #000;}
.mo_top_util ul li {display: inline-block; padding-left: 15px;}
.mo_top_util ul li a {display: inline-block; padding: 24px 10px; color: #fff;}

#mobile_header nav {width: 350px; height: 100vh; border-right: 1px solid #c1c1c1; background-color: rgba(255, 255, 255); position: fixed; left: -100%; top: 0;}

.close  {position: absolute; width: 30px; height: 30px;  top: 35px; right: 30px; cursor: pointer; z-index: 999;}
.close i {display: block; width: 30px; height: 2px; background: #fff; position: absolute;}
.close i:nth-of-type(1) {transform: rotate(45deg);}
.close i:nth-of-type(2) {transform: rotate(-45deg);}

*{box-sizing: border-box; }
.que:first-child{border-top: 1px solid black;}
.que{position: relative;padding: 17px 20px;cursor: pointer; font-size: 16px;border-bottom: 1px solid #dddddd;}
.que::before{display: inline-block;content: ''; width: 3px; height: 3px; background: #656565; margin: 3px 5px;}
.que.on > span{ font-weight: bold;color: #dd7c15; }
.anw { display: none; overflow: hidden; font-size: 14px; background-color: #f7f7f7; padding: 10px 30px;} 
.anw li:hover a {color: #0b0757;}
.anw a {display: block; padding: 8px 0;}

.arrow-wrap { position: absolute; top:50%; right: 30px; transform: translate(0, -50%);}
.que .arrow-top { display: none; transition: all .3s;}
.que .arrow-bottom { display: block;transform: rotate(-90deg);}
.que.on .arrow-bottom { display: none; transition: all .3s;}
.que.on .arrow-top { display: block; ;transform: rotate(90deg);}

.modal_site {display: none;}



@media all and (max-width: 1300px) {
    header nav > ul > li > a {font-size: 18px;} 
}
@media all and (max-width: 1200px) {
    header {display: none;}

    #mobile_header {display: block; background: #000000;}

    /* 모달컨테이너 사이트맵 */
    .modal_site {display: none; width: 100%; height: 100%; background-color: rgb(255, 255, 255); position: absolute; z-index: 10;}
    .modal_site .modal_content {width: 90%; margin: 20px auto; background: #fff; position: relative;}
    .modal_site .modal_content .close {width: 50px; height: 50px; position: relative; float: right; margin: 10px; right: -26px;}
    .modal_site .modal_content .close a {display: block; width: 100%; height: 100%; position: relative;}
    .modal_site .modal_content .close i {width: 50px; height: 3px; border-radius: 5px; background: #000; display: block; position: absolute; top: 20px; right: 0px;}
    .modal_site .modal_content .close i:nth-of-type(1) {transform: rotate(-45deg);}
    .modal_site .modal_content .close i:nth-of-type(2) {transform: rotate(45deg);}
    .modal_site .modal_content .sitemap_box {font-size: 20px;}
    .modal_site .modal_content .sitemap_box > ul { display: flex; flex-wrap: wrap; justify-content: space-between; padding-top: 150px;}
    .modal_site .modal_content .sitemap_box > ul > li {display: inline-block; width: 30%;}
    .modal_site .modal_content .sitemap_box > ul > li > a {font-size: 30px; display: inline-block; width: 100%; height: 60px; line-height: 60px; border-bottom: 3px solid #ff9900; margin-bottom: 10px;}
    .modal_site .modal_content .sitemap_box > ul > li li > a {display: block; padding: 15px 0;}
    .hidden {display : block;}
}

@media all and (max-width: 860px) {
    .modal_site .modal_content .close {width: 40px; height: 40px; position: relative; float: right; margin: 20px;}
    .modal_site .modal_content .close a {display: block; width: 100%; height: 100%; position: relative;}
    .modal_site .modal_content .close i {width: 40px; height: 3px; border-radius: 5px; background: #000; display: block; position: absolute; top: 20px; right: 0px;}

    .modal_site .modal_content .close {margin: 10px;}
    .modal_site .modal_content .sitemap_box {font-size: 16px;}
    .modal_site .modal_content .sitemap_box > ul > li {width: 48%;}
    .modal_site .modal_content .sitemap_box > ul > li > a {font-size: 24px;}
    .modal_site .modal_content .sitemap_box > ul > li li > a {padding: 5px 0;}
}
@media all and (max-width: 600px) {
    .modal_site .modal_content .sitemap_box > ul {padding-top: 50px;}
    .modal_site .modal_content .sitemap_box > ul > li {width: 100%;}
    .modal_site .modal_content .sitemap_box > ul > li > a {margin-top: 30px;}

    #mobile_header nav {width: 100%;}
}

/* 메인페이지 메인 배너 */
section#main_banner {width: 100%; height: 820px; background: transparent; color: #f3f3f3; position: relative; top: 90px;}
section#main_banner .main_visual {width: 100%; height: 100%; position: relative;}
section#main_banner .main_visual img {position: absolute; top: 42%; transform: translateY(-50%);}
section#main_banner .main_visual img:nth-of-type(1) {left: 8%;}
section#main_banner .main_visual img:nth-of-type(2) {right: 12%;}
section#main_banner .main_visual .text_box {text-align: center; position: absolute; top: 38%; left: 50%; transform: translate(-50%, -50%);}
section#main_banner .main_visual .text_box p:nth-of-type(1) {width: 873px; height: 45px; background: url(../images/main_text_re3.png) no-repeat center; display: inline-block;}
section#main_banner .main_visual .text_box p:nth-of-type(2) {font-family: "cheoeumcheoreom-210", sans-serif; font-size: 32px; font-weight: 700; padding: 34px 0 40px;}
section#main_banner .main_visual .text_box p:nth-of-type(3) {font-size: 20px; line-height: 1.8;}

@media all and (max-width: 1700px) {
    section#main_banner .main_visual img:nth-of-type(1) {left: 8%; width:432px;}
    section#main_banner .main_visual img:nth-of-type(2) {right: 12%;width:282px;}
    section#main_banner .main_visual .text_box p:nth-of-type(1) {width: 673px; background-size: 100%;}
    section#main_banner .main_visual .text_box p:nth-of-type(2) {font-family: "cheoeumcheoreom-210", sans-serif; font-size: 26px; font-weight: 700; padding: 34px 0 40px;}
    section#main_banner .main_visual .text_box p:nth-of-type(3) {font-size: 18px; line-height: 1.8;}
}

@media all and (max-width: 1200px) {
    section#main_banner {width: 100%; height: 700px; background: rgb(0, 0, 0); color: #f3f3f3;}
    section#main_banner .main_visual img:nth-of-type(1) {left: 8%; width:332px;}
    section#main_banner .main_visual img:nth-of-type(2) {right: 14%;width:182px;}
    section#main_banner .main_visual .text_box {text-align: center; position: absolute; top: 40%;}
    section#main_banner .main_visual .text_box p:nth-of-type(1) {width: 573px; background-size: 100%;}
    section#main_banner .main_visual .text_box p:nth-of-type(2) {font-size: 22px; font-weight: 700; padding: 24px 0 30px;}
    section#main_banner .main_visual .text_box p:nth-of-type(3) {font-size: 16px; line-height: 1.8;}
}
@media all and (max-width: 920px) {
    section#main_banner .main_visual img:nth-of-type(1) {left: 6%; width:332px;}
    section#main_banner .main_visual img:nth-of-type(2) {right: 10%;width:182px;}
}
@media all and (max-width: 860px) {
    section#main_banner {width: 100%; height: 750px; background: rgb(0, 0, 0); color: #f3f3f3;}
    section#main_banner .main_visual {width: 100%; height: 100%; position: relative;}
    section#main_banner .main_visual img {position: absolute; top: 76%; transform: translateY(-50%);}
    section#main_banner .main_visual img:nth-of-type(1) {left: 6%; width:332px;}
    section#main_banner .main_visual img:nth-of-type(2) {right: 10%;width:182px; display: none;}
    section#main_banner .main_visual .text_box {text-align: left; position: absolute; top: 5%; left: 5%; transform: none;}
    section#main_banner .main_visual .text_box p:nth-of-type(1) {width: 280px; height: 200px;  background: url(../images/main_text_mobile.png) no-repeat center; display: inline-block; background-size: 100%;}
    section#main_banner .main_visual .text_box p:nth-of-type(2) {font-size: 24px; font-weight: 500; padding: 4px 0 20px;}
    section#main_banner .main_visual .text_box p:nth-of-type(3) {font-size: 16px; line-height: 1.8;}

}
@media all and (max-width: 460px) {
    section#main_banner {width: 100%; height: 100vh; background: rgb(0, 0, 0); color: #f3f3f3;}
    section#main_banner .main_visual {width: 100%; height: 100%; position: relative;}
    section#main_banner .main_visual img {position: absolute; top: 70%; transform: translateY(-50%);}
    section#main_banner .main_visual img:nth-of-type(1) {left: 6%; width:282px;}
    section#main_banner .main_visual img:nth-of-type(2) {right: 10%;width:182px; display: none;}
    section#main_banner .main_visual .text_box {text-align: left; position: absolute; top: 5%; }
    section#main_banner .main_visual .text_box p:nth-of-type(1) {width: 260px; height: 180px;  background: url(../images/main_text_mobile.png) no-repeat center; display: inline-block; background-size: 100%;}
    section#main_banner .main_visual .text_box p:nth-of-type(2) {font-size: 20px; font-weight: 500; padding: 10px 0 20px;}
    section#main_banner .main_visual .text_box p:nth-of-type(3) {font-size: 14px; line-height: 1.8;}

}
/* 메인 사업안내  */
section#main_solution {width: 100%; height: 975px; margin: 100px 0 0; padding: 100px 0;}
section#main_solution ul {width: 100%; overflow: hidden;}
section#main_solution p.section_title {font-size: 42px; color: #f3f3f3; font-weight: 700; position: relative; z-index: 1;}
section#main_solution p.section_title::before {position: absolute; display: block; content: ""; width: 267px; height: 30px; background: linear-gradient(90deg,#f08200, #844501, #1f1828, #000); z-index: -1; bottom: 13px; left: 127px;}

section#main_solution ul li {height: 352px; float: left; margin-right: 4%; margin-bottom: 70px; border-radius: 7px; transition: all .3s;}
section#main_solution ul li:nth-of-type(2n) {margin-right: 0;}
section#main_solution ul li:nth-of-type(1) {width: 34%; background: transparent;}
section#main_solution ul li:nth-of-type(2) {width: 62%; background: url(../images/main_btn01.png) no-repeat center; background-size: cover;}
section#main_solution ul li:nth-of-type(3) {width: 44%; background: url(../images/main_btn02.png) no-repeat center; background-size: cover; margin-bottom: 0px;}
section#main_solution ul li:nth-of-type(4) {width: 52%; background: url(../images/main_btn03.png) no-repeat center; background-size: cover; margin-bottom: 0px;}
section#main_solution ul li a {display: inline-block; width: 100%; height: 100%; position: relative;}
section#main_solution ul li a > div {position: absolute; color: #f3f3f3; font-size: 20px; top: 47px; left: 54px;}
section#main_solution ul li a > div p:first-child {font-size: 36px; font-weight: 700; margin-bottom: 10px;}

@media all and (max-width: 1700px) {
    section#main_solution {width: 100%; height: 780px; margin: 100px 0; padding: 0;}
    section#main_solution p.section_title {font-size: 32px; color: #f3f3f3; font-weight: 700; position: relative; z-index: 1;}
    section#main_solution p.section_title::before {position: absolute; display: block; content: ""; width: 267px; height: 30px; background: linear-gradient(90deg,#f08200, #844501, #1f1828, #000); z-index: -1; bottom: 7px; left: 97px;}
    section#main_solution ul li a > div {font-size: 18px; top: 20px; left: 20px;}
    section#main_solution ul li a > div p:first-child {font-size: 30px; }
}
@media all and (max-width: 1300px) {
    section#main_solution {width: 100%; height: fit-content;}
    section#main_solution .container {width: 94%;}
    section#main_solution p.section_title {font-size: 26px;font-weight: 500;}
    section#main_solution p.section_title::before {width: 100%; height: 30px; bottom: 3px; left: 0;}
    section#main_solution ul li {height: 352px; float: left; margin-right: 0; margin-bottom: 50px;}
    section#main_solution ul li:nth-of-type(1) {width: 100%; height: 150px; text-align: center;}
    section#main_solution ul li:nth-of-type(2) {width: 100%;}
    section#main_solution ul li:nth-of-type(3) {width: 100%; margin-bottom: 50px;}
    section#main_solution ul li:nth-of-type(4) {width: 100%; margin-bottom: 50px;}
}

@media all and (max-width: 860px) {
    section#main_solution {width: 100%; margin: 100px 0 0; padding: 100px 0;}
    section#main_solution p.section_title {font-size: 24px;}

    section#main_solution ul li:nth-of-type(1) {width: 100%; height: 105px; text-align: center;}
    section#main_solution ul li:nth-of-type(2) {width: 32%; margin-right: 1.5%; height: 150px;}
    section#main_solution ul li:nth-of-type(3) {width: 32%; margin-bottom: 0px;margin-right: 1.5%; height: 150px;}
    section#main_solution ul li:nth-of-type(4) {width: 32%; margin-bottom: 0px; height: 150px;}

    section#main_solution ul li a > div {font-size: 14px; top: 50%; left: 50%; transform: translate(-50%, -50%);  width: max-content;}
    section#main_solution ul li a > div p:first-child {font-size: 18px;}
    section#main_solution ul li a > div p:last-child {display: none;}
}

@media all and (max-width: 460px) {
    section#main_solution {width: 100%; margin: 100px 0; padding: 0;}

    section#main_solution p.section_title {font-size: 20px;}
    section#main_solution p.section_title::before {bottom: 0px;}
    section#main_solution ul li:nth-of-type(1) {width: 100%; margin-bottom: 20px; height: 105px; text-align: center;}
    section#main_solution ul li:nth-of-type(2) {width: 100%; margin-bottom: 20px; margin-right: 0; height: 150px;}
    section#main_solution ul li:nth-of-type(3) {width: 100%; margin-bottom: 20px; margin-right: 0; height: 150px;}
    section#main_solution ul li:nth-of-type(4) {width: 100%; margin-bottom: 20px; height: 150px;}
}

/* 메인 클라이언트 */
section#main_sponsor {width: 100%; height: fit-content; background: transparent; margin: 100px 0;}
section#main_sponsor h2.main_title {width: 100%; font-size: 42px; font-weight: 700; color: #fff; text-align: center; position: relative;}
section#main_sponsor h2.main_title::before {position: absolute; display: block; content: ""; width: 175px; height: 24px; background: linear-gradient(90deg,#f08200, #844501, #1f1828, #181616); left: 50%; top: 55%; transform: translate(-50%, -50%); z-index: -1;}

@media all and (max-width: 1700px) {
    section#main_sponsor h2.main_title {font-size: 32px;}
    section#main_sponsor h2.main_title::before { width: 130px; height: 20px;}
}

@media all and (max-width: 1300px) {
    section#main_sponsor .container {width: 94%;}
    section#main_sponsor h2.main_title {font-size: 26px;}
    section#main_sponsor h2.main_title::before { width: 110px; height: 16px;}
    
}

@media all and (max-width: 860px) {
    section#main_sponsor {margin: 0;}
    section#main_sponsor h2.main_title {font-size: 24px;}
    section#main_sponsor h2.main_title::before { width: 100px; height: 14px;}
}

@media all and (max-width: 460px) {
    section#main_sponsor h2.main_title {font-size: 20px;}
    section#main_sponsor h2.main_title::before { width: 80px; height: 10px; top: 52%;}
}


/* 메인 클라이언트 - list */
section#main_sponsor .flow_banner {overflow: hidden; display: flex; max-width: 100%; margin: 80px auto;}
section#main_sponsor .flow_banner .list {display: flex;}
section#main_sponsor .flow_banner .list > li {white-space: nowrap; color: #fff; padding: 20px;}
section#main_sponsor .flow_banner .list > li img  {width: 200px;}
@keyframes flowRolling {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}

/* 반응형 스타일 */
@media (max-width: 1280px) {
    .flow_banner .list > li {padding: 10px;}
    section#main_sponsor .flow_banner .list > li img  {width: 150px;}
}

@media (max-width: 860px) {
    .flow_banner .list > li {padding: 5px;}
    section#main_sponsor .flow_banner {margin: 20px auto;}
    section#main_sponsor .flow_banner .list > li img  {width: 120px;}
}

@media (max-width: 460px) {
    section#main_sponsor .flow_banner .list > li img  {width: 100px;}
}

/* footer */
footer {width: 100%; height: fit-content; background: transparent;  padding: 50px 0 50px; color: #f3f3f3; line-height: 1.8; font-size: 16px;}
footer .container {width: 94%;}
footer span {color: #f08200;}

.substyle footer {color: #737373; font-weight: 400; border-top: 1px solid #f2eeee; box-sizing: border-box;}

/*shh 추가 */
footer p a {
    color: #f3f3f3 !important; /* 강제로 흰색 적용 */
    text-decoration: none; /* 밑줄 제거 */
}

footer p a:visited,
footer p a:active {
    color: #f3f3f3 !important;
}


@media (max-width: 860px) {
    footer {text-align: center; font-size: 14px; padding: 80px 0 50px;}
}


.top_btn {position: fixed; bottom: 100px; right: 100px;}
.top_btn a {width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background: #ffffff31;}
.top_btn a i {color: #fff; font-size: 30px;}

/* 서브페이지 */
    /* 서브페이지 레이아웃 */
.inner {width: 1200px; margin: 0 auto;}

@media (max-width: 1200px) {
    .inner {width: 100%;}
}

/* header */
body.substyle header {background: #212121;} 
body.substyle #mobile_header {background: #212121;} 


#sub_cont_wrap {width: 100%; min-height: 1000px;}
#sub_cont_wrap .top_banner {width: 100%; height: 275px; overflow: hidden; display: flex; justify-content: center; align-items: center; }
#sub_cont_wrap .top_banner h2 {font-size: 36px; color: #fff; font-weight: 700; filter: drop-shadow(3px 3px 3px #00000096);}
#sub_cont_wrap .top_banner.sub01 {background: url(../images/sub_top_banner.jpg) no-repeat center;}

#sub_cont_wrap .sub_menu_onepage {width: 100%; height: 70px; line-height: 70px; background: #212121; font-size: 20px;}
#sub_cont_wrap .sub_menu_onepage ul.onepage {overflow: hidden;}
#sub_cont_wrap .sub_menu_onepage ul.onepage li {float: left; width: 20%; text-align: center;}
#sub_cont_wrap .sub_menu_onepage ul.onepage li a {color: #fff; transition: all .3s;}
#sub_cont_wrap .sub_menu_onepage ul.onepage li:hover a {color: #f08200;}
#sub_cont_wrap .sub_menu_onepage ul.onepage li.active a {color: #f08200;}

#sub_cont_wrap .sub_menu {width: 100%; height: 70px; line-height: 70px; background: #212121; font-size: 20px;}
#sub_cont_wrap .sub_menu .inner > ul.submenu_nav {display: inline-block; position: relative; width: 100%;}
#sub_cont_wrap .sub_menu .inner > ul.submenu_nav > li {float: left; position: relative; width: 25%; border-left: 1px solid #535151; box-sizing: border-box; text-align: center;}
#sub_cont_wrap .sub_menu .inner > ul.submenu_nav > li:last-child {border-right: 1px solid #535151;}
#sub_cont_wrap .sub_menu .inner > ul.submenu_nav > li::after {position: absolute; display: block; content: "\f0d7"; display: inline-block; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 18px; color: #fff; top: 0; right: 0;}
#sub_cont_wrap .sub_menu .inner > ul.submenu_nav > li.active::after {content: "\f0d8";}
#sub_cont_wrap .sub_menu .inner > ul.submenu_nav > li:first-child {width: 90px;}
#sub_cont_wrap .sub_menu .inner > ul.submenu_nav > li:first-child::after {display: none;}
#sub_cont_wrap .sub_menu .inner > ul.submenu_nav > li > a {display: block; padding: 15px 32px; line-height: 40px; font-size: 20px; font-weight: 500; color: #fff;} 
#sub_cont_wrap .sub_menu .inner > ul.submenu_nav > li:hover > a {color: #f08200;}
#sub_cont_wrap .sub_menu .inner  li ul {position: absolute; width: 100%; box-shadow: 0 0 2px rgba(0, 0, 0, 0.273); transition: all .3s; display: none;}
#sub_cont_wrap .sub_menu .inner  li li a {display: block; line-height: 38px; text-align: center; font-weight: 400; font-size: 16px; background-color: #fff; color: #666; transition: all .3s; padding: 8px 0;}
#sub_cont_wrap .sub_menu .inner  li.active ul {display: block;} 
#sub_cont_wrap .sub_menu .inner  li li a:hover {background-color: #f4f4f4;}

.sub_cont h3 {font-size: 32px; font-weight: 700; text-align: center; margin-top: 100px;}

.sub_cont.about h3 {font-size: 32px; font-weight: 700; text-align: center; margin: 100px auto; position: relative;}
.sub_cont.about h3::before {display: block; content: ""; position: absolute; width: 2px; height: 30px; top: 80px; left: 50%; transform: translateX(-5%); background: #333;}

.sub_cont.business h3 {font-size: 26px; color: #dd7c15; font-weight: 700; text-align: left; margin: 100px auto 20px; position: relative;}
.sub_cont.business h3::before {display: block; content: ""; position: absolute; width: 10px; height: 5px; top: -8px; left: 0px; background: #A25A00; z-index: 99;}
.sub_cont.business h3::after {display: block; content: ""; position: absolute; width: 50px; height: 5px; top: -8px; left: 0px; background: #F08200;}

@media (max-width: 1200px) {
    #sub_cont_wrap {padding-top: 0px;}

    #sub_cont_wrap .top_banner h2 {font-size: 30px;}

    #sub_cont_wrap .sub_menu_onepage {font-size: 16px;}

    #sub_cont_wrap .sub_menu .inner > ul > li {float: left; position: relative; width: 30%;}
    #sub_cont_wrap .sub_menu .inner > ul > li > a {font-size: 18px;}

    .sub_cont h3 {font-size: 26px; margin-top: 50px;}
    
    .sub_cont.about h3 {font-size: 26px; margin: 50px auto 80px;}
    .sub_cont.about h3::before {width: 1px; height: 20px; top: 60px; background: #6c6c6c;}

    .sub_cont.business .inner {width: 96%;}
    .sub_cont.business h3 {font-size: 26px; margin: 50px auto 20px;}
}

@media (max-width: 605px) {

    #sub_cont_wrap{padding-top: 0px;}
    #sub_cont_wrap .top_banner {width: 100%; height: 185px; }
    #sub_cont_wrap .top_banner h2 {font-size: 28px;}

    #sub_cont_wrap .sub_menu_onepage {font-size: 14px;}

    #sub_cont_wrap .sub_menu {width: 100%; height: 50px; line-height: 50px;}
    #sub_cont_wrap .sub_menu .inner > ul > li {width: 40%;} 
    #sub_cont_wrap .sub_menu .inner > ul > li:first-child {width: 82px;}
    #sub_cont_wrap .sub_menu .inner > ul > li > a {padding: 5px 32px; font-size: 15px;} 
    #sub_cont_wrap .sub_menu .inner  li li a {font-size: 14px; padding: 3px 0;}
    
    .sub_cont h3 {font-size: 24px;}
    
    .sub_cont.about h3 {font-size: 24px; margin: 50px auto;}
    .sub_cont.about h3::before {width: 1px; height: 15px; top: 50px;}

    .sub_cont.business h3 {font-size: 24px; margin: 50px auto 20px;}
}

@media (max-width: 532px) {
    #sub_cont_wrap .sub_menu_onepage {display: none;}
    #sub_cont_wrap .sub_menu .inner > ul > li:nth-of-type(2) {display: none;} 
    #sub_cont_wrap .sub_menu .inner > ul > li:last-child {width: 220px;}
}

/* 포트폴리오 */
    /* 갤러리 게시판 - 탭메뉴 */
    .sub_cont .tab_list {width: 100%; margin: 80px auto 20px; overflow: hidden;}
    .sub_cont .tab_list li {float: left; margin-right: 20px;}
    .sub_cont .tab_list li a {display: block; border: 1px solid rgb(222, 219, 215); padding: 7px 22px; border-radius: 25px; font-size: 16px; font-weight: 500; color: #666;}
    .sub_cont .tab_list li.active a, .sub_cont .tab_list li:hover a {background: #fff3ea; color: #dd7c15; border: 1px solid #e4af64;}

    /* 갤러리 게시판 */
    .sub_cont .gallery_list {width: 100%; height: auto; overflow: hidden; margin: 50px auto 150px;}
    .sub_cont .gallery_list li {width: 30%; float: left; margin-right: 5%; margin-bottom: 80px;}
    .sub_cont .gallery_list li:nth-of-type(3n) {margin-right: 0;}
    .sub_cont .gallery_list li a {width: 100%; height: 100%; display: block;}
    .sub_cont .gallery_list li a div {width: 100%; height: 300px; display: flex; align-items: center; justify-content: center; overflow: hidden;  border: 1px solid #eeeaea;}
    .sub_cont .gallery_list li a div img {width: 100%; transition: all .3s;}
    .sub_cont .gallery_list li:hover a div img {width: 105%;}
    .sub_cont .gallery_list li a p.ttl { font-size: 20px; font-weight: 700; color: #333; padding: 10px 0; text-align: center;}
    .sub_cont .gallery_list li a p.date {font-size: 16px; text-align: center;}

    /* 세부페이지 */
    .sub_cont .sub_cont_detail {width: 100%; margin: 0 auto;}
    .sub_cont .sub_cont_detail h4 {width: 100%;  font-size: calc(0.26vw + 19.08px); font-weight: 600; color: #333; border-top: 1px solid #d4d4d4;border-bottom: 1px solid #d4d4d4; padding: 10px 0; margin: 50px auto 0px;}
    .sub_cont .sub_cont_detail img {width: 100%; text-align: center; margin: 0 auto; display: block; }

    @media (max-width: 1200px) {
        /* 갤러리 게시판 - 탭메뉴 */
        .sub_cont .tab_list {width: 96%;}
        .sub_cont .tab_list li {margin-right: 10px;}
        /* 갤러리 게시판 */
        .sub_cont .gallery_list {width: 96%;}
        .sub_cont .gallery_list li {margin-right: 4.9%;}
        .sub_cont .gallery_list li a div {width: 100%; height: 240px;}

        /* 세부페이지 */
        .sub_cont .sub_cont_detail {width: 96%;}
    }

    @media (max-width: 870px) {
        /* 갤러리 게시판 - 탭메뉴 */
        .sub_cont .tab_list li a {font-size: 14px; padding: 5px 12px;}
        /* 갤러리 게시판 */
        .sub_cont .gallery_list li:nth-of-type(3n) {margin-right: 5.7%;}
        .sub_cont .gallery_list li {width: 47%; margin-right: 5.7%;}
        .sub_cont .gallery_list li:nth-of-type(2n) {margin-right: 0;}
        .sub_cont .gallery_list li a div {height: 240px; }
        .sub_cont .gallery_list li a p.ttl { font-size: 16px;}
        .sub_cont .gallery_list li a p.date {font-size: 14px;}
    }

    @media (max-width: 640px) {
        /* 갤러리 게시판 - 탭메뉴 */
        .sub_cont .tab_list li {width: 50%; margin-right: 0px;}
        .sub_cont .tab_list li a {font-size: 14px; padding: 5px 12px; border-radius: 0px; text-align: center;}
        /* 갤러리 게시판 */
        .sub_cont .gallery_list li a div {height: 180px; }
    }

    @media (max-width: 500px) {
        .sub_cont .gallery_list li {width: 100%; margin-right: 0px; margin-bottom: 40px;}
        .sub_cont .gallery_list li a div {height: auto; }
    }


    /*프로젝트 의뢰*/
    .request {padding: 70px 2% 20px;max-width: 1200px;}
    .request h4 {font-size: 26px; font-weight: 500; margin-bottom: 10px;}

    .request .copy {font-size:200%;margin-bottom:50px;line-height:120%;text-align: center;}
    .request .copy i {color:#f39704;}
    .request .submit_btn {width: 100%; display: flex;}
    .request .submit_btn button {background:#444; width:200px;height:50px;line-height: 50px;color:#fff;font-size: 120%;border-radius: 5px; margin: 30px auto;}
    .request .request_form {border-top:2px solid #3b3b3b; padding: 25px 0;}

    .request .form_list {width: 100%; overflow: hidden; box-sizing: border-box;}
    .request .form_list li {width: 50%; margin-bottom: 30px; float: left; border-bottom: 1px solid #d9d9d9; padding-bottom: 30px;} 
    .request .form_list li:nth-of-type(5), .request .form_list li:nth-of-type(6), .request .form_list li:nth-of-type(7) {width: 100%;}
    .request .form_list li label {width: 100px; display: inline-block; font-size: 20px; color: #444;}
    .request .form_list li input {padding: 10px; width: 200px; border: 1px solid #d9d9d9;}
    .request .form_list li span {color: #dd7c15;}

    .request .form_list li:nth-of-type(5) input {width: 98%; margin-top: 15px;}
    .request .form_list li:nth-of-type(6) p {font-size: 20px; color: #444;}
    .request .form_list li:nth-of-type(6) textarea {margin-top: 15px; border: 1px solid #d9d9d9; width: 99%;}
    .request .form_list li:nth-of-type(7) p {font-size: 20px; color: #444;}
    .request .form_list li:nth-of-type(7) input {margin-top: 15px; border: 1px solid #d9d9d9; width: 98%;}
    
    .privacy .priv_inner {margin:20px; overflow-y:scroll; height:120px; padding:22px 2.9%; border:1px solid #d9d9d9; background:#fafafa; font-size: 15px;}
    .privacy .privacy_check {font-size: 15px;}
    

    @media (max-width: 870px) {
        .request .form_list li {width: 100%;} 
        .request .form_list li label {font-size: 16px; font-weight: 500;}
        .request .form_list li:nth-of-type(5) input {width: 95%;}
        .request .form_list li:nth-of-type(6) p {font-size: 16px; font-weight: 500;}
        .request .form_list li:nth-of-type(6) textarea {width: 95%;}
        .request .form_list li:nth-of-type(7) p {font-size: 16px; font-weight: 500;}
        .request .form_list li:nth-of-type(7) input {width: 95%;}
        
    }

    @media (max-width: 500px) {
        /* .request .form_list li label {font-size: 16px;} */
        .request .form_list li:nth-of-type(5) input {width: 93%;}
        .request .form_list li:nth-of-type(6) textarea {width: 93%;}
        .request .form_list li:nth-of-type(7) input {width: 93%;}
    }
    

    /* 회사소개 */
    .about_box {text-align: center; width: 100%; margin: 0 auto; color: #666666; line-height: 1.6;}
    .about_box .title { font-size: calc(0.26vw + 25.08px); color: #f08200; font-weight: 900; margin-bottom: 30px;}
    .about_box .cont { font-size: calc(0.26vw + 15.08px); margin-bottom: 150px;}
    /* 오시는길 */
    .location_box {width: 100%; margin: 0 auto;}
    .location_box .map_area {width: 100%; height: 400px; background: url(../images/map_img.png) no-repeat center;}
    .location_box .map_info {display: flex; justify-content: space-between; width: 100%; height: 240px; margin: 20px auto 150px;}
    .location_box .map_info .logo {width: 30%; height: 100%; display: flex; justify-content: center; align-items: center; border-right: 1px solid #ccc;}
    .location_box .map_info .logo img {width: 200px;}
    .location_box .map_info .text {width: 70%; height: 100%; display: flex; flex-direction: column; justify-content: space-around;}
    .location_box .map_info .text li {padding-left: 30px;}
    .location_box .map_info .text li span {display: inline-block; font-size: 16px; color: #333;}
    .location_box .map_info .text li span:nth-of-type(1) {width: 54px; height: 54px; line-height: 54px; border-radius: 30px; background: #f4a537; color: #fff; text-align: center; font-size: 24px;}
    .location_box .map_info .text li span:nth-of-type(2) {margin-left: 20px;}
    /* 인증서 */
    .certificate_box {width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto 150px;}
    .certificate_box li {flex: 1 1 33%; text-align: center; margin-bottom: 50px;}
    .certificate_box li img {display: block;
        margin: 0 auto;
        margin-bottom: 35px;
        border: 1px solid #efecec;}
    .certificate_box li strong {background: #3b3b3b;
        color: #fff;
        padding: 5px 20px;
        border-radius: 3px;
        font-weight: 400;
        font-size: 1.1em;
        display: inline-block;
        line-height: 1.3;}
    /* 파트너 */
    .partner_box {width: 100%; margin: 0 auto 150px; display: flex; box-sizing: border-box; flex-wrap: wrap;}
    .partner_box li {width: 20%; text-align: center;  margin-right: 6.4%; margin-bottom: 50px; border: 1px solid #efecec;}
    .partner_box li:nth-of-type(4n) {margin-right: 0;}
    .partner_box li img {width: 100%;}


    @media (max-width: 1200px) {
        .about_box {width: 96%;}

        .location_box {width: 96%;}

        .certificate_box {width: 96%;}
        
        .partner_box {width: 96%;}
    }
    @media (max-width: 1053px) {
        .partner_box li {width: 28%; }
        .partner_box li:nth-of-type(4n) {margin-right: 6.4%;}
        .partner_box li:nth-of-type(3n) {margin-right: 0;}
    }
    @media (max-width: 930px) {
        .location_box .map_info .logo {display: none;}
        .location_box .map_info .text {width: 100%;}
    }
    @media (max-width: 682px) {
        .location_box .map_info .text {width: 100%;}
        .location_box .map_info .text li {padding-left: 0px; display: flex; align-items: center; flex-direction: column;}
        .location_box .map_info .text li span {font-size: 14px;}
        .location_box .map_info .text li span:nth-of-type(1) {width: 36px; height: 34px; line-height: 34px; font-size: 16px; border-radius: 3px; margin-bottom: 10px;}
        .location_box .map_info .text li span:nth-of-type(2) { margin-left: 0px; text-align: center;}
    

        .partner_box li {width: 46%;}
        .partner_box li:nth-of-type(4n) {margin-right: 6.4%;}
        .partner_box li:nth-of-type(3n) {margin-right: 6.4%;}
        .partner_box li:nth-of-type(2n) {margin-right: 0;}
    }

/* 사업소개 - 영상감시장치 */
    .business_cont {font-size: 18px; line-height: 1.8;}
    .business_cont .main_service {margin: 30px auto 200px; border-top: 1px solid #dd7c15;}
    .business_cont .main_service li {border-bottom: 1px solid #dcdcdc; padding: 20px 0; display: flex; align-items: center; }
    .business_cont .main_service li .icon_area { display: flex; flex-direction: column; justify-content: center; align-items: center;  width: 192px; margin-right: 20px; padding: 10px;}
    .business_cont .main_service li .icon_area i {font-size: 40px; color: #9c9c9c;}
    .business_cont .main_service li .icon_area span {font-size: 14px; font-weight: 500; color: #333; display: inline-block; margin-top: 10px; text-align: center;}
    .business_cont .main_service li .text_area {width: 80%;}


    @media (max-width: 1200px) {
        .business_cont {font-size: 16px;}
    }

    @media (max-width: 720px) {
        .business_cont {font-size: 15px;}
        .business_cont .main_service li {flex-direction: column; text-align: center;}
        .business_cont .main_service li .text_area  {margin: 30px 0 10px;}
        /* .business_cont .main_service li .icon_area i  {display: none;} */
    }


    @media (max-width: 532px) {
        .business_cont {font-size: 15px;}
    }


	.file-img {
		width: 14px;
		height: 14px;
		margin: 0 0 0 10px;
	}