@import url(https://use.fontawesome.com/releases/v5.15.2/css/all.css);
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
@charset "utf-8";

/* Reset CSS  */
html { height: 100%; overflow-y:scroll;}
body { font-size: 13px; color:#000;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, blockquote, th, td, p { margin: 0px; padding:0px;  list-style:none;  font-family:"Pretendard", sans-serif; word-break: keep-all;}
fieldset{ border: 0px; }
a{font-style:normal; text-decoration:none; color:#000;}
hr, legend {height: 0; left: -5000px; line-height: 0; overflow-x: hidden; overflow-y: hidden; position: absolute; visibility: hidden;width: 0;}
caption {font-size: 0; height: 0; line-height: 0; visibility: hidden; width: 0;}
* {-webkit-text-size-adjust:none; font-family:"Pretendard";}
* { margin:0; padding:0; border:0; outline:0;  }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }
img, video { max-width:100%; border:0; height:auto; vertical-align:top; }
table { border-collapse:collapse; border-spacing:0; border: 0px solid #E5E5E5; }
input, select { vertical-align:middle; }
label { cursor:pointer; }
.blind,legend,hr,caption { display:block; overflow:hidden; position:absolute; top:0; left:-1000em; }
i,em,address { font-style:normal; font-weight:normal; }
td,th {vertical-align: middle;line-height: 1.6;}
td strong {font-weight: 100;	font-size: 5px;vertical-align: bottom;}
a:hover{text-decoration:none;}
ul:after{content:""; display:block; clear:both;}

.container { max-width: 1410px; width:100%; margin: 0 auto; position: relative; box-sizing: border-box; padding:0 15px;}
.container:after {content: ""; display: block; clear: both;}

/*formmail*/
#select-form{border:1px solid #ddd; width:100%; padding:15px 10px; font-size:15px}
.fields{position:relative; margin-top:30px; border-top:1px solid #ddd;}
.fields li{display:flex;border-bottom:1px solid #ddd;  align-items:center; padding:15px;}
.fields .lbl{width:200px;font-size:15px; cursor:text}
.fields .desc{width:100%;}
.fields .input{border:1px solid #ddd; padding:15px 10px; box-sizing:border-box; width:100%}
.fields .input.full{width:100%}
.fields .btn-group{margin-top:34px; text-align:center}
.fields .btn-group span{font-size:16px; color:#999;}
.fields .btn-group a{font-size:16px; color:#000; font-weight:bold;}
.fields .btn-group a:hover{text-decoration:underline}
input[id="agree-check"] + label {display: inline-block; width: 20px; height: 20px; border: 1px solid #bbb; cursor: pointer;margin: 0 4px 4px 0;}
input[id="agree-check"]:checked + label {border-color:#0b4ea2; background:url('../img/agree_check.png') no-repeat center center;}
input[id="agree-check"] {display: none;}
.fields .btn-submit{background:#0b4ea2; color:#fff; font-size:16px; font-weight:bold; padding: 15px 47px; border:none; outline:none; margin-top:35px;}

#header.active {background: #fff; transition-duration: 0.5s; transition-timing-function: ease; -webkit-transition-duration:0.4s; -webkit-transition-timing-function:ease;}
#header.deactive {background: transparent; transition-duration: 0.5s; transition-timing-function: ease; -webkit-transition-duration:0.4s; -webkit-transition-timing-function:ease;}

#header {position: absolute; z-index: 9; width: 100%;}
#header .head_wrap {display: flex; justify-content: space-between; max-width: 1600px; margin: 20px auto 0;}
#header .right {display: flex; text-align: all 0.3s;}
#header .right .gnb > ul > li {float: left; margin: 0 20px; box-sizing: border-box; padding: 0 27px 30px; position: relative;}
#header .right .gnb > ul > li > a {font-size: 20px;}
#header .right .gnb > ul > li:last-child > a {color: #fff;}
#header .right .gnb > ul > li:last-child > a.active {color: #2590c8;}
#header .lnb {display: none; position: absolute; top: 50px;}
#header .lnb.active {display: flex;}
#header .lnb li {margin-bottom: 20px;}
#header .lnb li a {font-size: 16px;}
#header .gnb:hover .lnb {display: block;}
#header .lang {margin-left: 37px;}
#header .lang ul li {padding-bottom: 20px; position: relative;}
#header .lang ul li:first-child:after {content: "\25B2"; position: absolute; right: -20px; width: 10px; height: 10px; transition: all 0.3s;}
#header .lang ul li:last-child {display: none; position: absolute;}
#header .lang:hover ul li:last-child {display: block;}
#header .lang:hover ul li:first-child:after {transform: rotate(180deg); transform-origin: 50% 100%;}
#header .lang ul li a {font-size: 16px;}
#header .lnb_back {width: 100%; background: #fff; height: 0px; position: absolute; top: 0; left: 0; z-index: -1; display: none; transition: all 0.3s;}
#header .lnb_back.active {display: block; height: 300px;}

#header .right .gnb > ul > li:last-child {display: none;}
#header .lang a > img {margin-right: 5px;}

#nav_btn{ display: none; cursor: pointer; position: absolute; top: 55px; right:30px;}
#nav_btn span{display: block; width: 40px; height: 2px; background: #fff; margin-bottom:9px;}

#sitemap{position: fixed; top:0; right:-100%; width: 30%; height: 100vh; background: rgba(255,255,255,0.96); padding:15vh 50px 0; box-shadow: -2px 1px 8px #46464640; z-index: 999;}
#sitemap .close{cursor: pointer; position: absolute; top: 55px; right:30px;}
#sitemap .close span{display: block; width: 40px; height: 2px; background: #000;}
#sitemap .close .line01{transform: rotate(45deg);}
#sitemap .close .line02{transform: rotate(-45deg); margin-top: -2px;}
#sitemap .gnb{height: 80vh; overflow-y: auto;}
#sitemap .gnb > li{margin-bottom:30px;}
#sitemap .gnb > li > a{font-size:35px; font-weight: 500; letter-spacing: -1px; border-bottom:1px solid #ddd; display: block; padding-bottom:10px; margin-bottom:10px;}
#sitemap .gnb > li:hover > a{color:#2e5399;}
#sitemap .gnb .lnb li a{font-size: 20px; transition: .5s; display: block; padding:3px 0; color: #999;}
#sitemap .gnb .lnb li:hover a{margin-left:10px; color:#000;}

#sitemap .m_lang {margin-bottom: 20px;}
#sitemap .m_lang a {font-size: 16px;}

#main {overflow: hidden;}
#main .section00 {width: 100%; max-width: 1920px; margin: 0 auto; overflow: hidden; position: relative;}
#main .section00 .swiper-pagination {position: absolute; width: 250px; bottom: 5%; left: 50%; margin-left: -125px; background: rgba(255,255,255,0.4);}
#main .section00 .swiper-pagination-progressbar-fill {background: #fff;}
#main .section00 .swiper-button-prev, .swiper-button-next {color: #fff; text-shadow: 0px 0px 7px #000;}
#main .section00 .swiper-button-next {right: auto; left: 58%;  bottom: 3%;}
#main .section00 .swiper-button-prev {left: 40.5%; bottom: 3%;}
#main .section00 .swiper-button-prev:after, #main .section00 .swiper-button-next:after {font-size: 27px;}
#main .title {position: absolute; top: 30%; left: 8.5%;}
#main .title img { display: block; margin-bottom: 20px; }
#main .title .m_tit {color: #fff; font-size: 72px; font-weight: 700; letter-spacing: -1.5px; margin-bottom: 12px;}
#main .title h4 {font-size: 56px; color: rgba(255, 255, 255, 0.8); line-height: 1.3;}

#main .section01 {margin: 150px 0;}
#main .section01 .container {display: flex; max-width: 1824px;}
#main .section01 .left {width: 51%;}
#main .section01 .right {background: #F2F5F7; width: 50%; color: #333; padding: 3%; position: relative;}
#main .section01 .right b {color: #3F9DCE;}
#main .section01 .right h3 {font-size: 25px;}
#main .section01 .right p {font-size: 18px; line-height: 24px; margin: 20px 0;}
#main .section01 .right p:last-child {margin: 0; font-weight: 500;}
#main .section01 .right .more {position: absolute; right: 95px;}
#main .section01 .right .more:after {content: ""; width: 50px; height: 50px; border-radius: 50px; background: #CFDCE2; position: absolute; right: -20px; bottom: -15px;}
#main .section01 .right .more a {z-index: 1; position: sticky; font-size: 20px; color: #5E5E60;}
#main .section01 .width_1600 {max-width: 1600px; padding: 0;}


#main .section02 {background: url(../img/section02_back.png) no-repeat center center; margin-bottom: 25px;}
#main .section02 .container {padding: 130px 0;}
#main .section02 .container .con {display: flex; justify-content: space-between;}
#main .section02 .left {width: 40%; position: relative;}
#main .section02 .left img {width: 100%;}
#main .section02 .left .more {width: 80px; height: 80px; background: #3E9DCE; position: absolute; bottom: 0; right: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 40px;}
#main .section02 .left .more p {transition: all 0.3s; transform-origin: 50% 53%;}
#main .section02 .left .more:hover p {transform: rotate(180deg);}
#main .section02 .right {width: 58%; display: flex; flex-direction: column; justify-content: space-between;}
#main .section02 .right .mo_name li {width: 19%; display: inline-block; text-align: center; padding: 9px 0; background: #F1F2F2; margin-bottom: 3px; transition: all 0.3s; font-size: 14px;}
#main .section02 .right .mo_name li:hover {background: #3E9DCE; color: #fff;}
#main .section02 .right .text_box p {color: #fff; font-size: 18px; line-height: 36px;}
#main .section02 .right .img_box ul {display: flex;}
#main .section02 .right .img_box ul li {margin-right: 8px;}
#main .section02 .right .img_box ul li:last-child {margin-right: 0;}
#main .section02 .container .con {display: none;}
#main .section02 .container .active {display: flex;}

#about { padding: 150px 0;  }
#about .container { display: flex; }
#about .left { width: 45%; }
#about .left img { background: #000; }
#about .right {background: #F2F5F7; width: 55%; color: #333; padding: 3%; position: relative; transform: translate(-4vw, 4vw); }
#about .right b {color: #3F9DCE;}
#about .right h3 {font-size: 25px;}
#about .right p {font-size: 18px; line-height: 24px; margin: 20px 0;}
#about .right p:last-child {margin: 0; font-weight: 500;}
#about .right .more {position: absolute; right: 40px; bottom: 40px; }
#about .right .more:after {content: ""; width: 50px; height: 50px; border-radius: 50px; background: #CFDCE2; position: absolute; right: -20px; bottom: -15px;}
#about .right .more a {z-index: 1; position: sticky; font-size: 20px; color: #5E5E60;}

#pro {background: url(../img/section02_back.png) no-repeat center center; padding: 150px 0; margin-bottom: 25px;}
#pro .swiper { width: 100%; padding-top: 50px; padding-bottom: 50px; }
#pro .swiper-slide { background-position: center; background-size: cover; width: 500px; height: 500px; }
#pro .swiper-slide img { display: block; width: 100%; }
#pro .swiper-slide P { font-size: 50px; font-weight: bold; position: absolute; left: 20px; bottom: 20px; color: #eee; opacity: 0; transition: all 0.3s; }
#pro .swiper-slide-active p { opacity: 1; }
#pro .swiper-pagination-bullet { background: #fff; }
#pro .more {position: absolute; right: 95px;}
#pro .more:after {content: ""; width: 50px; height: 50px; border-radius: 50px; background: #429fce; position: absolute; right: -20px; bottom: -15px;}
#pro .more a {z-index: 1; position: sticky; font-size: 20px; color: #FFF;}

#main .section03 {max-width: 1920px; margin: 0 auto 25px auto;}
#main .section03 .section03_wrap {display: flex; justify-content: space-between;}
#main .section03 .left {display: flex; width: 71%;}
#main .section03 .left .address_txt {width: 30%; padding: 40px; background: #5f6373; color: #fff;}
#main .section03 .left .address_top {margin-bottom: 55px;}
#main .section03 .left .address_top .article {font-size: 27px;}
#main .section03 .left .address_top .tel {font-size: 42px; line-height: 63px; font-weight: 600;}
#main .section03 .left .address_btm > ul > li { display: flex; gap: 5px;  font-size: 16px; margin-bottom: 15px;}
#main .section03 .left .address_btm a {padding: 10px 15px; background: #fff; display: flex; align-items: center; width: 210px; gap: 5%;}
#main .section03 .left .down {position: absolute; bottom: 73px;}
#main .section03 .left .down a {background: #fff; padding: 16px 28px; font-size: 22px; line-height: 16px;}
#main .section03 .left .down a img {margin-left: 15px;}
#main .section03 .right {width: 32%;}
#main .section03 .right ul {display: flex; justify-content: space-between; flex-direction: column;}
#main .section03 .right ul li {height: 170px; margin-bottom: 25px; padding: 30px; position: relative;}
.cover {position: absolute; width: 100%!important; height: 100%; top: 0; left: 0; z-index: 999; background: transparent!important;}
#main .section03 .right ul li:first-child {background: linear-gradient(90deg, rgba(101,171,207,1) 0%, rgba(62,157,206,1) 100%); color: #fff;}
#main .section03 .right ul li:nth-child(2) {background: linear-gradient(90deg, rgba(186,220,238,1) 0%, rgba(142,192,218,1) 100%);}
#main .section03 .right ul li:last-child {margin-bottom: 0; background: linear-gradient(90deg, rgba(228,234,238,1) 0%, rgba(207,219,226,1) 100%);}
#main .section03 .right ul li p {color: #BAE7FF; font-size: 22px;}
#main .section03 .right ul li b {color: #fff; font-size: 40px;}
/* #main .section03 .right ul li b:before {content: ""; width: 40px; height: 1px; background: #BAE7FF; display: block; margin: 13px 0;} */
#main .section03 .right ul li:nth-child(2) b:before {background: #4B6A7A;}
#main .section03 .right ul li:last-child b:before {background: #7994A4;}
#main .section03 .right ul li:nth-child(2) p {color: #395767;}
#main .section03 .right ul li:nth-child(2) b {color: #395767;}
#main .section03 .right ul li:last-child p {color: #557584;}
#main .section03 .right ul li:last-child b {color: #141a4f;}


#footer {background: #262B3D;}
#footer .ft_wrap {max-width: 1400px; margin: 0px auto; text-align: center; padding: 45px 0;}
#footer .ft_wrap p {color: #dadada; margin-bottom: 15px;}
#footer .ft_wrap p:last-child {margin-bottom: 0;}
#footer .ft_wrap .copy {color: #81879d;}




/*Sub*/
#header.sub_header {position: sticky;}
#header.sub_header .right .gnb > ul > li:last-child > a {color: #2590c8;}

.visual {height: 460px; transition: all 0.3s; }
.visual .container {height: 100%; display: flex; justify-content: center; flex-direction: column; max-width: 1600px;}
.visual .sub_bg {height: 100%; position: relative;}
.visual .bg1 {background-image: url(../img/sub_banner01.png);}
.visual .bg2 {background-image: url(../img/sub_banner02.png);}
.visual .bg3 {background-image: url(../img/sub_banner03.png);}
.visual .bg4 {background-image: url(../img/sub_banner04.png);}
.visual .bg5 {background-image: url(../img/sub_banner05.png);}
.visual .visual-title_tit {font-size: 24px; color: #c5c5c5;}
.visual .visual-title {font-size: 50px; color: #fff;}

#path {position: absolute; left: 0; bottom: 0; width: 100%; border-top: 1px solid #fff; border-bottom: 1px solid #fff; }
#path .home_ico {display: block; width: 23px; height: 20px; background: url("../img/ico_home.png");}
#path .home { padding: 20px; border-left: 1px solid #fff; border-right: 1px solid #fff; }
#path .main { width: 20%; padding: 0 30px; }
#path .sub { width: 20%; padding: 0 30px; }
#path .inner_wrap { display: flex; height: 60px; padding: 0 50px; position: relative; width: 100%; max-width: 1500px; margin: 0 auto;}
#path .sbm{ position: relative; color: #fff; }
#path .sbm::after { content: ""; display: block; position: absolute; right: -1px; top: 50%; width: 1px; height: 100%; background: #fff; transform: translate(0, -50%); }
#path .sbm h2{ position: relative; line-height: 60px; font-size:16px; font-weight:300; cursor: pointer;}
#path .sbm h2::after { content: ""; display: block; position: absolute; right: 0; top: 50%; width: 14px; height: 8px; background: url("../img/ico_down.png"); transform: translate(0, -50%); }
#path .lnb{display: none; position: absolute; top:56px; left:-1px; width:100%; background: #fff;border:1px solid #ddd; z-index: 99; padding:10px 0;}
#path .lnb li a{display: block; color: #888; font-size:16px; padding:5px 24px;}
#path .lnb li a:hover{color: #262b3d; font-weight: 500;}

#path .asd { width: 30%; padding: 0 30px; }
#path .asd h2{ position: relative; line-height: 60px; font-size:16px; font-weight:300; cursor: pointer;}
#path .asd h2::after { content: ""; display: block; position: absolute; right: 0; top: 50%; width: 14px; height: 8px; background: url("../img/ico_down.png"); transform: translate(0, -50%); }
#path .asd{ position: relative; color: #fff; }
#path .asd::after { content: ""; display: block; position: absolute; right: -1px; top: 50%; width: 1px; height: 50%; background: #fff; transform: translate(0, -50%); opacity: 0.5; }


.sub_page .page_title {font-size: 40px; text-align: center;}
.sub_page .page_title:before {content: ""; width: 1px; height: 80px; display: block; background: #14455f; margin: 0 auto 10px;}
.sub_page > div:first-child {margin-top: 100px;}
.sub_page > div:last-child {margin-bottom: 150px;}
.sub_page h4 {font-size: 26px; margin-bottom: 12px; position: relative; padding-left: 15px;}
.sub_page h4:before {content: ""; width: 5px; height: 25px; background: #14455f; position: absolute; left: 0px; top: 7px;}



.con01, .con02, .con03 {margin-top: 150px;}
#sub0101 .con02 .container {display: flex; justify-content: space-between;}
#sub0101 .con02 .left p {font-size: 20px; margin-bottom: 20px;}
#sub0101 .con02 .right {margin-left: 20px;}
#sub0101 .con03 ul li {margin-bottom: 50px; display: flex; align-items: center;}
#sub0101 .con03 ul li b {font-size: 26px; margin-right: 60px;}
#sub0101 .con03 ul li .right p {font-size: 18px; margin-bottom: 10px;}


.history_cont .year_slide {position: relative; max-width: 1260px; height: 120px; margin: 0 auto; padding-right: 200px;}
.history_cont .year_slide .swiper-container {height: 100%;}
.history_cont .year_slide .swiper-container ul li {height: 120px;}
.history_cont .year_slide .sl_year {font-size: 100px; line-height: 100%; color: #262B3D; font-weight: bold;}

.history_cont .history_btn {position: absolute; top: 50px; right: 0; width: 49px; height: 34px; background: no-repeat center; font-size: 0;}
.history_cont .history_prev {right: 70px; background: url('../img/sub0101_icon.png');}
.history_cont .history_next {background: url('../img/sub0101_icon_n.png');}
.history_cont .history_slide {padding-top: 65px; max-width: 1400px; margin: 0 auto; position: relative;}
.history_cont .history_slide .swiper-container {padding-left: 300px;}
.history_cont .history_slide .swiper-slide:before {content: ''; width: 20px; height: 20px; background: #262B3D; border-radius: 50%; position: absolute; left: -6px; top: -10px; opacity: .1; transition: all ease .6s;}
.history_cont .history_slide .swiper-slide.swiper-slide-active:before {width: 40px; height: 40px; top: -20px; left: -14px;}
.history_cont .history_slide .swiper-slide:after {content: ''; width: 8px; height: 8px; background: #262B3D; border-radius: 50%; position: absolute; left: 0; top: -4px;}
.history_cont .history_slide .swiper-slide.swiper-slide-active:after {width: 10px; height: 10px; top: -5px;}
.history_cont .history_slide .swiper-slide {width: 700px; padding-top: 50px; margin-top: 20px; padding-right: 100px; position: relative; border-top: 1px solid #e5e5e5;}
.history_cont .history_list > li {margin-bottom: 12px;}
.history_cont .history_list > li .list_num {font-size: 16px; font-weight: 500;}
.history_cont .history_list > li .list_text {font-size: 14px; line-height: 26px;}

.history_cont {
        width: 80%;
        margin: 0 auto;
    }



#sub0102 .page_title {margin-top: 100px;}
#sub0102 .page_text {font-size: 18px; line-height: 32px;max-width: 1600px; margin: 10px auto; text-align: center;}
.popup_class { overflow: hidden; height: 100%; }
/* 갤러리 스타일 */
.gallery {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

.gallery img {
    width: 168px;
    height: 237px;
    margin: 10px;
    cursor: pointer;
}

/* 모달(팝업)창 스타일 */
.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.9);
    padding-top: 3%;
    z-index: 9999;
    justify-content: center
    align-items: center;

}

.modal-content {
    margin: auto;
    display: block;
    max-width: 80%;
    max-height: 80%;
}

.close {
    color: #fff;
    font-size: 30px;
    position: absolute;
    top: 30px;
    right: 15px;
    cursor: pointer;
}

.slide-button {
    font-size: 30px;
    color: #fff;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    z-index: 9999;
    padding: 20px;
}

.left {
    left: 15px;
}

.right {
    right: 15px;
}

#sub0103 .flex {display: flex; flex-wrap: wrap; align-items: center; gap: 2%;}
#sub0103 .left {width: 68%;}
#sub0103 .right {width: 30%; padding: 30px 0; display: flex; gap: 5%; flex-direction: column;}
#sub0103 .right .title {font-size: 45px; font-weight: 700; margin-bottom: 70px; letter-spacing: -0.5px;}
#sub0103 .right .article {font-size: 16px; line-height: 28px; width: 90%;}
#sub0103 .con01 { position: relative; width: 100%; height: 100vh; background: url("../img/sub0103_bg.png") no-repeat center center / cover; margin-top: 0; padding-top: 100px; }
#sub0103 .page_title:before { display: none; }
#sub0103 .page_title { color: #fff; }


#sub0104 .con03 p {font-size: 20px; margin-bottom: 20px;}

 {margin-top: 150px;}
 #bo_cate {margin:25px 0; display: flex; justify-content: center; margin: 50px 0 150px 0;}
 #bo_cate #bo_cate_ul {display: flex; flex-wrap: wrap; justify-content: CENTER; width: 80%;}
#bo_cate > ul > li {width: 20%; border: 1px solid #262B3D; text-align: center; margin-bottom: 16px; margin-right: 5%;}
 #bo_cate > ul > li > a {display: block; font-size: 18px; padding: 10px; }
 #bo_cate > ul > li > a:hover { background: #262B3D; color: #fff;}

 .pro_all {max-width: 1620px; margin: 0 auto;}
 .gallery_li {text-align: center;}
 .gallery_li > a {font-size: 1.2em; font-weight: bold; font-family: 'Noto Sans KR'; margin: 10px 0; display: block;}



/* #bo_cate h2 {position:absolute;font-size:0;line-height:0;overflow:hidden} */
#bo_cate ul {zoom:1}
#bo_cate ul:after {display:block;visibility:hidden;clear:both;content:""}
#bo_cate li {display:inline-block;padding:2px}
#bo_cate a {display:block;line-height:28px;padding:5px 15px;border:1px solid #262B3D;color:#262B3D}
#bo_cate a:focus, #bo_cate a:hover, #bo_cate a:active {text-decoration:none;background:#262B3D;color:#fff}
#bo_cate #bo_cate_on {z-index:2;background:#262B3D;color:#fff;font-weight:bold;border:1px solid #262B3D;
/* -webkit-box-shadow:inset 0 2px 5px #262B3D;
-moz-box-shadow:inset 0 2px 5px #262B3D;
box-shadow:inset 0 2px 5px #262B3D */}

#sub0102 #bo_cate_ul li {border: 0; padding: 0; }
#sub0102 #bo_cate_ul li a {font-size: 16px;}

#sub0302 {display: flex; align-items: center; flex-direction: column; background: #ebebeb; padding: 60px 0; gap: 50px; }
#sub0302 a { display: inline-block; background: #2790c7; color: #fff; font-size: 16px; font-weight: 600;  padding: 16px 100px;}
#sub0302 img { background: #fff; }


#sub0401 .form_wrap {border-top: 2px solid #2488bd;}
#sub0401 .desc {margin-top: 0;}
#sub0401 .desc input {width: 100%; border: 1px solid #ddd; padding: 5px;}
#sub0401 .desc textarea {width: 100%; border: 1px solid #ddd; padding: 5px;}
#sub0401 .more_btn {padding: 20px 80px; background: #2488bd; color: #fff; border-radius: 50px; font-size: 18px;}
#sub0401 .agree_check {display: flex; align-items: center; margin-top: 10px;}
#sub0401 .agree_check #agree {width: fit-content; margin-right: 8px;}

@media (min-width: 1200px) {
  .sales-network .container:after {
    content: "";
    display: block;
    clear: both;
  }
  .sales-network .container > * {
    float: left;
  }
  .sales-network .container .dxee-table {
    width: 800px;
    margin-left: 40px;
  }
}

.sales-network .area {padding-right: 10px; text-align: center;}
.sales-network .area h2 {font-size: 17px;text-align: left;padding-left: 20px;color: #888;}
.sales-network .area svg {display: inline-block;}
.sales-network .area text {font-size: 5px;pointer-events: none;transition: .3s;position: relative;fill: #666;opacity: 0;}
.sales-network .area text.active {opacity: 1;}
.sales-network .area rect {fill: #fff;width: 20px;height: 7px;opacity: 0;pointer-events: none;stroke: #444;stroke-width: 0.4px;transition: .3s;}
.sales-network .area rect.active {opacity: 1;}
.sales-network .area .region {cursor: pointer;transition: .5s;fill: #fff;stroke: #ccc;}
.sales-network .area .region:hover {fill: #aaa;}
.sales-network .area .region.active {fill: #0d3d8c;}
.sales-network .area .region.t23:hover ~ .mapName.t23,
.sales-network .area .region.t11:hover ~ .mapName.t11,
.sales-network .area .region.t31:hover ~ .mapName.t31,
.sales-network .area .region.t32:hover ~ .mapName.t32,
.sales-network .area .region.t34:hover ~ .mapName.t34,
.sales-network .area .region.t12:hover ~ .mapName.t12,
.sales-network .area .region.t25:hover ~ .mapName.t25,
.sales-network .area .region.t33:hover ~ .mapName.t33,
.sales-network .area .region.t37:hover ~ .mapName.t37,
.sales-network .area .region.t35:hover ~ .mapName.t35,
.sales-network .area .region.t22:hover ~ .mapName.t22,
.sales-network .area .region.t24:hover ~ .mapName.t24,
.sales-network .area .region.t36:hover ~ .mapName.t36,
.sales-network .area .region.t38:hover ~ .mapName.t38,
.sales-network .area .region.t26:hover ~ .mapName.t26,
.sales-network .area .region.t21:hover ~ .mapName.t21,
.sales-network .area .region.t39:hover ~ .mapName.t39 {opacity: 1;}
.sales-network .dxee-table {text-align: left; font-size: 16px; word-break: keep-all;}
.sales-network .dxee-table .data-area {}
.sales-network .dxee-table .data-company {width: 20%}
.sales-network .dxee-table .data-tel {width: 20%}
.sales-network .dxee-table .data-address {}

.sales-network .dxee-table tbody tr:not(.active) {  display: none;}
.sales-network .dxee-table tr:hover td {  background: #f6f9fe;  color: #0d3d8c;}
.sales-network .dxee-table td, .sales-network .dxee-table th {padding: 10px; cursor: pointer;}
.sales-network .dxee-table td:nth-child(4) {  text-align: left;}
.sales-network .maps {  width: 700px;}
.sales-network .maps > div {  display: none;  margin-top: 30px;}
.sales-network .maps > div:first-child {  border: 1px solid #bebebe;  padding: 50px 0;  text-align: center;  font-size: 35px;  background: #f5f5f5;}
.sales-network .maps > div.active {  display: block;}
.sales-network .maps > div h4 {  font-size: 25px;  margin-bottom: 10px;  color: #0d3d8c;}
.sales-network .maps > div h4:after {  content: "";  display: block;  margin: 15px 0;  height: 1px;  background: #ddd;  width: 50px;}
.sales-network .maps > div p {margin-bottom: 15px;}
/* table */
.dxee-table table {border-collapse: collapse;border-spacing: 0;border-top: 2px solid #000;width: 100%;}
.dxee-table th {font-weight: 600; height: 30px;}
.dxee-table td, .dxee-table th {border-bottom: 1px solid #ddd; padding: 25px;}
.dxee-btn.main {background: #1a4987; padding: 15px 70px; color: #fff;}
.padding_200 {padding: 200px 0;}



#s2_img { display: flex; align-items: center; justify-content: center; gap: 2vw; }
#s2_img li { position: relative;  width: 100%; height: 300px; background: #ebebeb; }
#s2_img li a { position: relative; display: block; width: 100%; height: 100%; }
/* #s2_img li a::after { display: block; content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.3); } */
/* #s2_img li img { display: block; width: 100%; height: 100px; object-fit: contain; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
#s2_img li:hover img { filter: brightness(0) saturate(100%) invert(95%) sepia(5%) saturate(0%) hue-rotate(346deg) brightness(105%) contrast(104%); } */

#s2_img li img { display: block; width: 100%; height: 100px; object-fit: contain; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
filter: brightness(0) saturate(100%) invert(56%) sepia(0%) saturate(0%) hue-rotate(185deg) brightness(100%) contrast(92%);}
#s2_img li:hover img {filter:none;}

#s2_img::after { display: none; }