@charset "utf-8";
@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+HK:wght@100;300;400;500;700;900&family=Noto+Sans+JP:wght@100;200;300;400;500;600;700;800;900&family=Noto+Sans+KR:wght@100;300;400;500;700;900&family=Noto+Sans+SC:wght@100;300;400;500;700;900&family=Noto+Sans+TC:wght@100;300;400;500;700;900&family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
@import url('https://cdn.jsdelivr.net/npm/remixicon@3.4.0/fonts/remixicon.css');




/* Reset CSS  */
* {font-family:'Noto Sans KR','Noto Sans', 'Noto Sans SC','Noto Sans JP','Noto Sans TC', "Pretendard",'Noto Sans', 'rotunda-variable','Poppins', serif, -apple-system,BlinkMacSystemFont, "Lato", "Malgun Gothic","맑은 고딕", "Dotum", helvetica,"Apple SD Gothic Neo",sans-serif;}
html { height: 100%; overflow-y:scroll; scroll-behavior: smooth; font-size:14px }
body {font-size: 13px; color:#171717; position: relative; height: 100%;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, blockquote, th, td, p, header, section, footer, nav, small, span, a, img, fieldset, legend { margin: 0px; padding:0px;  list-style:none;  font-family:"Pretendard",  sans-serif; border: 0;}
fieldset{ border: 0px; }
a{font-style:normal; text-decoration:none; color:inherit;}
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;}
* { 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; }
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;} */
small {font-size: inherit;}
img {vertical-align: top;}
address {font-size: inherit;}
h1,h2,h3,h4,h5,h6 {font-weight: inherit; font-size: inherit;}
.container {max-width: 1680px; width:100%; margin: 0 auto; position: relative; box-sizing: border-box; padding: 0 4%;}
/* .container:after {content: ""; display: none; clear: both;} */
.main-container {max-width: 1740px; width:100%; margin: 0 auto; position: relative; box-sizing: border-box; height: 100%; z-index: 5}
.sub-container {max-width: 1440px; width:100%; margin: 0 auto; position: relative; box-sizing: border-box; padding: 0 2%}

.wide{position: relative;}
.wide::before , .wide::after{content: ""; width: 200%; height: 100%; position: absolute; top:0; left:-50%; z-index: -1;}
.material-symbols-outlined {font-variation-settings:'FILL' 0,  'wght' 200, 'GRAD' 0,'opsz' 40}


.blind {position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; top: 0; left: 0;}
::selection {background-color: #72c8f1; color: white;}

.br_mo {display: none;}


/*formmail 폼메일*/
.contact{padding-left:30px;}
.fields{position:relative; margin:0 auto;}
.fields li:not(:last-child){margin-bottom:25px; padding-bottom: 25px; border-bottom: 1px solid #ddd}
.fields li:last-child{margin-bottom:0;}
.fields .lbl{font-size:18px; cursor:text; font-weight: 600; font-family:'Noto Sans KR'; }
.fields .desc{width:100%; margin-top:10px;  font-size: 16px;}
.fields .desc.flex {display: flex;  gap:10px; align-items: center;}
.sub04_01 .desc.flex {display: flex; gap: 30px; flex-direction: row; align-items: center;}
.sub04_01 .desc.flex > div {display: flex; flex-direction: row; align-items: center; gap: 8px;}
.fields .input{background:#fff; box-sizing:border-box; }
.fields input:not([type="file"]) {border-radius: 10px;}
.fields input::placeholder {font-size:16px; color:#999; font-weight: 500;}
.fields input[type="text"] { height: auto; line-height: normal; padding: 10px 25px; color:#000; font-size:17px; border:1px solid #ddd; background:#fff;}
.fields input[type="text"]:disabled {background-color: #eee}
.fields input[type="email"] { height: auto; line-height: normal; padding: 10px 25px; color:#000; font-size:17px; border:1px solid #ddd; background:#fff;}
.fields input[type="tel"] { height: auto; line-height: normal; padding: 10px 25px; color:#000; font-size:17px; border:1px solid #ddd; background:#fff;}
.fields textarea{border:1px solid #ddd !important; padding:10px 20px; border-radius: 10px; resize: none;}
.fields textarea::placeholder {font-size:16px; color:#999; font-weight: 500;}
.fields textarea[type="text"] { height: auto; line-height: normal; padding: 10px 25px; color:#000; font-size:17px;}
.fields .input.full{width:100%}
.fields .input[type="checkbox"] {width: unset;}
.fields .input.check:not(:first-child) {margin-left: 5%;}
.fields .input[type="radio"] {width: unset; }
.fields .btn-group{margin-top:34px; text-align:center}
.fields .btn-group span{font-size:16px; color:#999;}
.fields .btn-group p {font-size: 13px; word-break: keep-all;}
.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:#000; background:url('../img/agree_check.png') no-repeat center center;}
input[id="agree-check"] {display: none;}
.fields .btn-submit{background:#0061a1; color:#fff; font-size:20px; font-weight:bold; padding: 15px 47px; border:none; outline:none; margin-top:35px; transition: background .3s; border-radius: 100px;}
.fields .btn-submit:hover {background:#144d98;}
.privacy-agree{margin-top:7px;}
.privacy-agree span{font-size:15px;}
.fields .required,
.fields textarea.required{background-position: right -3px top 0px !important; padding-right: 10px; }

/************* css ******************/
body::-webkit-scrollbar {width: 10px;}
body::-webkit-scrollbar-thumb {background:#666; ;border-radius: 10px;}
body::-webkit-scrollbar-track {background: #f5f5f5;}

.mobr {display: none;}



/* 헤더 header */
#header {height: fit-content; display: flex; position: absolute; z-index: 1; width: 100%;}
#header .header_wrap {display: flex; justify-content: space-between; align-items: center; padding: 0 0 0 30px; height: 90px; width: calc(100% - 90px); color: #171717; gap:48px; position: relative;}
#header .header_wrap .head_logo {padding: 20px 0; height: 90px; flex-basis: 10%; min-width: 149px; flex-shrink: 0;}
#header .header_wrap .head_logo h1 {transition: display .3s;}
#header .header_wrap .head_logo .logo_w {display: none;}
.fp-viewing-section-page1 #header .header_wrap .head_logo .logo_w {display: inline-block;}
.fp-viewing-section-page1 #header .header_wrap .head_logo .logo_b {display: none;}
.fp-viewing-section-page5 #header .header_wrap .head_logo .logo_w {display: inline-block;}
.fp-viewing-section-page5 #header .header_wrap .head_logo .logo_b {display: none;}
#header .header_wrap .head_menu {display: flex; align-items: center; height: 100%; flex: 1 1 auto; justify-content: flex-end;}
#header .header_wrap .head_gnb {display: flex; align-items: flex-start;font-family: 'Poppins'; font-size: 20px; font-weight: 600; letter-spacing: 0.5px; gap:50px;}
/* hover 시 gap은 미디어 쿼리에서 각각 관리 */
#header .header_wrap .head_gnb > li {display: inline-block; text-align: center; position: relative;}
/* 기본 메뉴 너비는 미디어 쿼리에서 관리 */
#header .header_wrap .head_menu .head_gnb > li > a {display: inline-block; padding: 33px 0; position: relative;}
#header .header_wrap .head_menu .head_gnb > li > a::after {content: ""; position: absolute; height: 4px; bottom: 0; background-color: #1a4691; left: 0; right: 0; transform-origin: bottom right; transform: scaleX(0); transition: transform 0.5s ease;}
#header .header_wrap .head_menu .head_gnb > li:hover > a::after
 {transform: scaleX(1); transform-origin: bottom left}

/* .header .header_wrap .head_menu .head_gnb > li > a::after {transition: all .3s; position: absolute; top: 87.5px; right: 0; left: 0; z-index: 2; content: ""; display: inline-block; width: 0%; border-bottom: 3px solid transparent; }
.header .header_wrap .head_menu .head_gnb > li:hover > a::after {border-bottom: 3px solid #1a4691; width: 100%;} */

main #main_01 {overflow: hidden}
#header .header_wrap .head_gnb .topmenu .lnb {font-size: 16px; color: #5a5a5a; padding: 15px 0; display: none; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); background: rgba(255,255,255,0.95); backdrop-filter: blur(4px); box-shadow: 0 4px 12px rgba(0,0,0,0.15); border-radius: 8px; min-width: 200px; z-index: 100;}
#header .header_wrap .head_gnb .topmenu:hover .lnb {display: block;}
#header .header_wrap .head_gnb .topmenu .lnb > li {text-align: center; padding: 12px 0;}
#header .header_wrap .head_gnb .topmenu .lnb > li:hover {color:#1a4691;}
#header .header_wrap .head_gnb .topmenu .lnb > li a {display: inline-block; position: relative; padding: 0 10px;}

/* .header .header_wrap .head_gnb .topmenu .lnb > li a:after {content: ""; display: inline-block; position: absolute; width: 0; border-bottom: 1px  solid #1a4691; bottom:-5px; left: 0; right: 0; transition: width .3s}
.header .header_wrap .head_gnb .topmenu .lnb > li:hover a:after {width: 100%;} */
#header .header_wrap .head_gnb .topmenu .lnb > li a:after {content: ""; position: absolute; height: 1px; bottom: -5px; background-color: #1a4691; left: 0; right: 0; transform-origin: bottom right; transform: scaleX(0); transition: transform 0.5s ease;}
#header .header_wrap .head_gnb .topmenu .lnb > li:hover a:after {transform: scaleX(1); transform-origin: bottom left}

#header .global_nav {width: 90px; position: relative;}
#header .header_wrap .head_nav {display: flex; align-items: center; height: 100%;}
#header .header_wrap .head_nav .global {position: relative;}

#header .header_wrap .head_nav .global .country {font-size: 15px; color: #5a5a5a; padding: 15px 0; display: none; position: absolute; top: 100%; right: 0; background: rgba(255,255,255,0.95); backdrop-filter: blur(4px); box-shadow: 0 4px 12px rgba(0,0,0,0.15); border-radius: 8px; min-width: 120px; z-index: 100;}
#header .header_wrap .head_nav .global:hover .country {display: block;}
#header .header_wrap .head_nav .global > a {display: inline-block; padding: 26px 0;}
#header .header_wrap .head_nav .global > a img {width: 32px; height: 24px; vertical-align: middle; margin-top: 5px;}
#header .header_wrap .head_nav .global .country li {padding: 12px 0; text-align: center;}
#header .header_wrap .head_nav .global .country li:hover {color:#1a4691;}
#header .header_wrap .head_nav .global .country li a {display: inline-block; position: relative; }
/* .header .header_wrap .head_nav .global .country li a:after {content: ""; display: inline-block; position: absolute; width: 0; border-bottom: 1px  solid #1a4691; bottom:-5px; left: 0; right: 0; transition: width .3s}
.header .header_wrap .head_nav .global .country li:hover  a:after {width: 100%;} */
#header .header_wrap .head_nav .global .country li a:after {content: ""; position: absolute; height: 1px; bottom: -5px; background-color: #1a4691; left: 0; right: 0; transform-origin: bottom right; transform: scaleX(0); transition: transform 0.5s ease;}
#header .header_wrap .head_nav .global .country li:hover  a:after {transform: scaleX(1); transform-origin: bottom left}


/* 사이트맵메뉴 */
#sitemap {position: fixed; z-index: 800; width: 100%; height: 100%; display: none; overflow: hidden; background-color: #f0f3f6; }
#sitemap .sitemap {display: flex; justify-content: space-between; width: 100%; height: 100%; }
#sitemap .sitemap .sitemap_left {height: 100%; background-color: #fff; width: 40%; display: flex; flex-direction: column; justify-content: space-between;}
#sitemap .sitemap .sitemap_left h1 {height: 90px; display: flex; align-items: center;}
#sitemap .sitemap .sitemap_left .site_left_txt h2 {font-size: 35px; font-weight: 700; letter-spacing: 1px; line-height: 1.2; word-break: keep-all;}
#sitemap .sitemap .sitemap_left .site_left_txt p {color: #5a5a5a; font-size: 28px; font-weight: 300; padding-top: 20px;  letter-spacing: 1px; word-break: keep-all;}
#sitemap .sitemap .sitemap_left .site_left_add {color: #969696; padding-bottom: 50px;}
#sitemap .sitemap .sitemap_left .site_left_add p {font-size: 18px;}
#sitemap .sitemap .sitemap_left .site_left_add small {font-size: 15px;}
#sitemap .sitemap .sitemap-middle {width: calc(100% - 695px); background-color: #f0f3f6; position: relative; }
#sitemap .sitemap .sitemap-middle::before {content: ""; display: inline-block; position: absolute; bottom:0; right: 0; background-image: url(../img/site_back_logo.png); width: 910px; height: 277px; background-repeat: no-repeat; background-position: bottom right; pointer-events: none;}
#sitemap .sitemap .sitemap-middle .global_nav {height: 90px; display: flex; align-items: center; justify-content: flex-end;}
#sitemap .sitemap .sitemap-middle .global_nav .head_gnb .global {display: flex; font-size: 20px; font-weight: 700; align-items: center; gap:15px;}
#sitemap .sitemap .sitemap-middle .global_nav .head_gnb .global > a > i {font-size: 45px;}
#sitemap .sitemap .sitemap-middle .global_nav .head_gnb .global .country {display: flex; gap:15px; color: #999;}
#sitemap .sitemap .sitemap-middle .global_nav .head_gnb .global .country li a {transition: color .3s; position: relative;}
#sitemap .sitemap .sitemap-middle .global_nav .head_gnb .global .country li a.active, #sitemap .sitemap .sitemap-middle .global_nav .head_gnb .global .country li a:hover {color:#171717;}
#sitemap .sitemap .sitemap-middle .global_nav .head_gnb .global .country li a::before {content: ""; position: absolute; height: 3px; bottom: -2px; background-color: #171717; left: 0; right: 0; transform-origin: bottom right; transform: scaleX(0); transition: transform 0.5s ease;}
#sitemap .sitemap .sitemap-middle .global_nav .head_gnb .global .country li a.active::before,#sitemap .sitemap .sitemap-middle .global_nav .head_gnb .global .country li a:hover::before {transform: scaleX(1); transform-origin: bottom left}
#sitemap .sitemap .sitemap-middle #map-nav {height: calc(100% - 90px); display: flex; flex-direction: column; justify-content: center; padding-bottom: 5vw}
/* #sitemap .sitemap .sitemap-middle #map-nav #map-gnb {display: flex; flex-direction: column; position: relative;} */
#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu {padding-left: 50px;}
#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu .map_wrap  {display: inline-block;}
#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu .map_wrap > a {font-size: 40px; font-weight: 700; position: relative;  display: inline-block; color: #aeb1b4; padding: 25px 0;}
#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu:first-child a{padding-top: 0}
#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu.active .map_wrap > a {color: #171717;}
#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu:hover .map_wrap > a {color: #171717;}
#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu .map_wrap > a::before {content: ""; position: absolute; height: 4px; bottom: 20px; background-color: #171717; left: 0; right: 0; transform-origin: bottom right; transform: scaleX(0); transition: transform 0.5s ease;}

#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu.active .map_wrap > a::before,#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu:hover .map_wrap > a::before {transform: scaleX(1); transform-origin: bottom left}


#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu .lnb_two {font-size: 20px;/* position: absolute; left: 700px; top:0; height: 100%;*/ display: flex; flex-wrap: wrap;}
#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu .lnb_two li {}
#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu .lnb_two li a {color: #5a5a5a; padding:5px 20px; display: inline-block; transition: all .3s;}
/* #sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu .lnb_two li:first-child a {padding-top: 0;}
#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu .lnb_two li:last-child a{padding-bottom: 0;} */
#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu .lnb_two li:hover a {color: #171717; font-weight: 700; }
#sitemap .sitemap .sitemap-middle #map-nav #map-gnb .map_menu.active .lnb_two {display: inline-block;}
#sitemap .sitemap .sitemap-right {height: 100%; width: 90px; display: flex; flex-direction: column; align-items: center;  background-color: #171717; }
#sitemap .sitemap .sitemap-right .site_close {font-size: 50px; width: 90px; height: 90px;color: #fff; display: flex; justify-content: center; align-items: center; cursor: pointer;}
#sitemap .sitemap .sitemap-right .site_map_txt {font-size: 20px; color: #fff; font-family: 'poppins'; font-weight: 500;  display: flex; justify-content: center; align-items: center;  flex-basis: calc(100% - 90px);}
#sitemap .sitemap .sitemap-right .site_map_txt span {transform: rotateZ(90deg); white-space: nowrap;}


.fp-viewing-section-page1 header .header_wrap {color: #fff;}

/* 햄버거 */
.m-gnb {height: 100%; width: 90px;}
.m-gnb .m-nav {width: 100%; height: 90px; display: table; position: relative; text-align: center;}
.m-gnb .m-nav .burger-menu {display: table-cell; vertical-align: middle; background-color: transparent; transition: background-color .4s;}
.m-gnb .m-nav .burger-menu .burger {width: 30px; height: 25px; vertical-align: middle; right: 0; display: inline-block;z-index: 600; cursor: pointer; transition: all .3s; position: relative;}
.m-gnb .m-nav .burger-menu .burger .burger-line {position: absolute; width: 100%; height: 3px; background-color: #fff; transition: all 0.3s;}
.m-gnb .m-nav .burger-menu .burger .burger-line:nth-of-type(1) {top: 0; left: 0; transform-origin: left center;}
.m-gnb .m-nav .burger-menu .burger .burger-line:nth-of-type(2) {top: 0; right: 0; bottom: 0; margin: auto; width: 70%;}
.m-gnb .m-nav .burger-menu .burger .burger-line:nth-of-type(3) {left: 0; bottom: 0; margin: auto; transform-origin: left center;}
.m-gnb .m-nav .burger-menu:hover .burger .burger-line:nth-of-type(2) {width: 100%;}
.burger_back {background-color: #171717; height: 90px;width: 90px; position: absolute; top: 0; right: 0; transition: all ease .7s; z-index: -2;}

.fp-viewing-section-page1 .m-gnb .m-nav .burger-menu .burger .burger-line {background-color: #171717;}
.fp-viewing-section-page1 .burger_back {height: 100vh; background-color:#fff;}


/* 캐러셀 */
.page_anchor_wrap {width: 90px; height: calc(100% - 90px); position: fixed; transition: all 0.4s; bottom: 0;  right:0; z-index: 1;}
.fp-viewing-section-page1 .page_anchor_wrap {z-index: 1;}
.main-page-anchor {position: fixed;right: 0;bottom: 0; height: calc(100% - 90px); width: 90px; z-index: 1}
.main-page-anchor ul {display: flex; flex-direction: column; justify-content: center; height: 100%; align-items: center; padding-bottom: 100px}
.main-page-anchor li{text-align: right; width: 30px; padding: 3px 0;}
.main-page-anchor a {width: 20px;height: 3px;border-radius: 100px;background: #171717; display: inline-block; transition: width 0.3s; position: relative; }
.main-page-anchor li.active>a {background: #171717; border: none;width: 30px;height: 3px; }

.page_anchor_wrap .scroll-down {position: absolute; bottom:50px; right: 0; z-index: 1; width: 90px;  flex-direction: column;align-items: center; gap:20px; justify-content: center; animation: .5s ease infinite alternate scrollDown; display: none; transition: all .7s;}
@keyframes scrollDown {from {bottom:50px;} to {bottom:60px;}}
.page_anchor_wrap .scroll-down p {writing-mode: vertical-rl}
.page_anchor_wrap .scroll-down .scroll-txt { font-family: 'poppins'; font-size:18px; }
.fp-viewing-section-page1 .page_anchor_wrap .scroll-down {display: flex;}

/* 메인 공통사항 */
.main main h3 {font-family: 'rotunda-variable'; font-size: 60px; font-weight: bold;}


/* 2섹션 이후 메인 버튼 */
.main_button {width: 210px;}
.main_button a {font-size: 19px; font-weight: 600; padding: 20px 0; background-color: transparent; border-radius: 100px; box-shadow: inset 0 0 0 2px #171717; transition: color .5s; position:relative; overflow:hidden; font-family: 'poppins'; letter-spacing: 1px; display:flex; align-items:center; gap:10px; justify-content: center; color:#fff;}
.main_button a:hover{color:#171717; }
.main_button a::after {content: ""; position: absolute; height: 100%; top:0; background-color: #171717; left: 0; right: 0; transform-origin: bottom left; transform: scaleX(1); transition: transform 0.5s ease; border-radius: 100px; z-index:-1; }
.main_button a:hover::after {transform: scaleX(0); transform-origin: bottom right}
.main_button a i {font-size: 30px; line-height: 0}

/* 1섹션 메인 버튼 */

.main main #main_01 .swiper-container .swiper-wrapper .swiper-slide .vi_txt_wrap .main_button {width: 210px; margin-top: 25px;}
.main_button.button_white a {font-size: 19px; font-weight: 600; padding: 20px 0; background-color: transparent; border-radius: 100px; box-shadow: inset 0 0 0 2px #fff; transition: color .5s; position:relative; overflow:hidden; font-family: 'poppins'; letter-spacing: 1px; display:flex; align-items:center; gap:10px; justify-content: center;}
.main_button.button_white a:hover{color:#171717;}
.main_button.button_white a::after {content: ""; position: absolute; height: 100%; top:0; background-color: #fff; left: 0; right: 0; transform-origin: bottom right; transform: scaleX(0); transition: transform 0.5s ease; border-radius: 100px; z-index:-1; border: 2px solid #fff;}
.main_button.button_white a:hover::after {transform: scaleX(1); transform-origin: bottom left}
.main_button.button_white a i {font-size: 30px; line-height: 0}

/* main 메인 비주얼 */
.main main  #main_01 {background-image: url(../img/vi_bg01.png); background-position: right top; background-repeat: no-repeat; background-size: cover; height:100%;}
.main main  #main_01 .swiper-container {height:100%; position: relative;}
.main main  #main_01 .swiper-container .swiper-wrapper {width:100%; height:100%; padding-top: 30px;}
.main main  #main_01 .swiper-container .swiper-wrapper .swiper-slide {width:100%; height:100%;}
.main main  #main_01 .swiper-container .swiper-wrapper .swiper-slide {height:100%; background-position: 82% 90%; background-repeat: no-repeat;}
.main main  #main_01 .swiper-container .swiper-wrapper .sl01 {background-image: url(../img/vi_img01.png);}
.main main  #main_01 .swiper-container .swiper-wrapper .sl02 {background-image: url(../img/main_pro_img02.png);}
.main main  #main_01 .swiper-container .swiper-wrapper .sl03 {background-image: url(../img/main_pro_img03.png);}
.main main  #main_01 .swiper-container .swiper-wrapper .sl04 {background-image: url(../img/main_pro_img04.png);}
.main main  #main_01 .swiper-container .swiper-wrapper .swiper-slide .vi_txt_po {position: absolute; bottom: 50%; transform: translateY(50%); padding: 0 2%; width: 100%;}
.main main  #main_01 .swiper-container .swiper-wrapper .swiper-slide .vi_txt_wrap {color: #fff; display: flex; flex-direction: column; gap: 20px;  box-sizing: border-box; width: fit-content; white-space: nowrap;}


.main main  #main_01 .swiper-container .swiper-wrapper .swiper-slide .vi_txt_wrap h2 {font-size: 70px; font-weight: 700; font-family: 'poppins'; line-height: 1; letter-spacing: -1px; text-shadow: 0 0 10px rgba(116, 124, 130, 0.35);}
.main main  #main_01 .swiper-container .swiper-wrapper .swiper-slide .vi_txt_wrap h2 .vi_small {font-size: 55px;}
.main main  #main_01 .swiper-container .swiper-wrapper .swiper-slide .vi_txt_wrap .vi_txt  {color: #f3f3f7; font-size: 20px; font-weight: 200; text-shadow: 0 0 5px rgba(52, 57, 61, 0.8); line-height: 1.5;}



/* 메인 페이지네이션 */
.main main  #main_01 .swiper-container .arrow {position: absolute; bottom: 75%; transform: translateY(-50%); z-index: 1000; padding:0 2%; width: 100%;}
.main main  #main_01 .swiper-container .arrow .arrow-wrap {width: 100%; max-width: 1720px;  font-size: 22px; font-family: 'poppins'; color: #fff; font-weight: 500; display:flex; align-items:center; gap:20px; margin: 0 auto;}
.main main  #main_01 .swiper-container .arrow .arrow-wrap .swiper-pagination-fraction {bottom: 0; top:0; left:0; width: fit-content; position:unset; color: #bbb;}
.main main  #main_01 .swiper-container .arrow .swiper-pagination .swiper-pagination-current {color: #fff;}
.main main  #main_01 .swiper-container .arrow .arrow-wrap .swiper-button-next, .main main  #main_01 .swiper-container .arrow .arrow-wrap .swiper-button-prev { margin-top: 0; color:#fff; position:unset; }
.main main  #main_01 .swiper-container .arrow .arrow-wrap .swiper-button-next:after, .main main  #main_01 .swiper-container .arrow .arrow-wrap .swiper-button-prev:after {font-size: 22px; font-weight: bold}
.main main  #main_01 .swiper-container .arrow-bottom {width: 100%;  bottom: 10%; transform: translateY(-50%); position: absolute; z-index: 1000;  padding: 0 2%;}
.main main  #main_01 .swiper-container .swiper-pagination2 {width: 100%; max-width: 1720px; margin: 0 auto;}
.main main  #main_01 .swiper-container .swiper-pagination2 .swiper-pagination-bullet{width: 45px; height: 4px; background-color: #fff; border-radius: 0;}

/* 메인 2,3section 2,3섹션 공통 */
.main main  .main_pro_section{overflow: hidden; background-color: #dfe2e5; position: relative;}
.main main  .main_pro_section .m_pro_wrap {position: relative;}
.main main  .main_pro_section .scene {overflow: hidden; width: 100%; height: 100%; position: absolute!important;}
.main main  .main_pro_section .scene .fp-tableCell {overflow: hidden; width: 100%;}
.main main  .main_pro_section .scene .sec02_bg01 {background-image: url(../img/sec02_bg01.png); width: 125%; height: 125%; background-position: center center; background-size: cover; background-repeat: no-repeat; left:unset!important;top:unset!important; bottom:13%; right:5%; transform-origin: 50% 50%}
.main main  .main_pro_section .main_product {display: table; width: 100%; height: 100%; }
.main main  .main_pro_section .main_product .main_product_table {display: table-cell; width: 100%; height: 100%; vertical-align: middle; padding: 2vw 0;}
.main main  .main_pro_section .main_product .main_product_table h3 {text-align: center; padding-bottom: 120px;}
.main main  .main_pro_section .main_product .main_product_table .main_product_wrap {display: flex; position: relative; background-color: rgba(105, 115, 123, 0.25); backdrop-filter:blur(5px); padding: 70px 20px; border-radius: 60px; gap:30px; max-width: 1440px; margin: 0 auto; align-items: center;}
.main main  .main_pro_section .main_product .main_product_table .main_product_wrap .main_pro_img {position: relative; width: 50%; height: 100%; top:0; left:0;}
.main main  .main_pro_section .main_product .main_product_table .main_product_wrap .main_mark {position: absolute; top: 0; right: 20px; z-index: -1}
.main main  .main_pro_section .main_product .main_product_table .main_product_wrap .main_pro_img img {display: inline-block; position: absolute; left: 50%; transform: translate(-50%,-50%);}
.main main  .main_pro_section .main_product .main_product_table .main_product_wrap .main_pro_txt {display: flex; flex-direction: column; gap: 20px; padding: 0 2%;}
.main main  .main_pro_section .main_product .main_product_table .main_product_wrap .main_pro_txt h4 {font-size: 42px; font-weight: 700; word-break: keep-all;}
.main main  .main_pro_section .main_product .main_product_table .main_product_wrap .main_pro_txt .main_pro_info {font-size: 20px; font-weight: 300; line-height: 1.5; word-break: keep-all;}
.main main  .main_pro_section .main_product .main_product_table .main_product_wrap .main_pro_txt .main_pro_info .info_small {font-weight: 600; font-size: 14px; word-break: keep-all;}
.main main  .main_pro_section .main_product .main_product_table .main_product_wrap .main_pro_txt .main_button {margin-top: 30px;}

/* 메인 3section 3섹션 */
.main main #main_03:not(first-child) .main_product .main_product_table .main_product_wrap {padding: 85px 20px; flex-direction: row-reverse;}
.main main #main_03 .main_product .main_product_table .main_product_wrap .main_pro_img img{transform: translate(-50%,-50%);}


/* 메인 4section 4섹션 */
.main main #main_04 {width: 100%}
.main main #main_04 .main_partner {/*display: table; */display: flex; height: 100%; width: 100%; align-items: center; justify-content: center}
.main main #main_04 .main_partner .main_partner_wrap {/*display: table-cell; height: 100%; vertical-align: middle; */width: 100%; }
.main main #main_04 .main_partner_txt {text-align: center;}
.main main #main_04 .main_partner_txt p {font-size: 22px; color: #6a6a6a; padding: 20px 0 70px; word-break: keep-all;}
.main main #main_04 .main_partner .main_partner_wrap .main_partner_content {position: relative;}
.main main #main_04 .main_partner_content::before {content: ""; background: linear-gradient(to right, rgba(255,255,255,1) 80%, rgba(255,255,255,0) 100%); width: 325px; height: 375px; position: absolute; top: 50%; left: 0; transform: translate(0, -50%); z-index: 10;}
.main main  #main_04 .main_partner .main_partner_wrap .main_partner_content::after {content: ""; background: linear-gradient(to left, rgba(255,255,255,1) 80%, rgba(255,255,255,0) 100%); width: 325px; height: 375px; position: absolute; top: 50%; right: 0; transform: translate(0, -50%);  z-index: 10;}
.main main  #main_04 .main_partner .main_partner_wrap .main_button {margin: 0 auto; padding-top: 100px}
/* .main main  #main_04 .main_partner .main_partner_wrap .container .main_button {display: flex; justify-content: center; align-items: center;} */
.main main  #main_04 .main_partner .main_partner_wrap .container .main_button a {display: flex; justify-content: center; align-items: center; margin-bottom:20px;}

/* 메인 5section 5섹션 history 관련 css는 latest histpry_basic*/
.main main #main_05 .main_history {display: flex; justify-content: space-between; height: 100%;}
.main main #main_05 .main_history_30 {flex-basis: 50%; overflow: hidden; background-image: url('../img/hi_31_bg.png'); background-repeat: no-repeat; background-size: cover;}
.main main #main_05 .main_history_30 #scene3 {height: 100%; width: 100%}
.main main #main_05 .main_history_30 #scene3 .layer {position: relative; width: 100%; height: 100%;}

.main main #main_05 .main_history_30 #scene3 .layer img {display: inline-block; width: 95%; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: inherit;}
/* .main main #main_05 .main_history_30 #scene3 .layer:nth-of-type(2) img { width: 70%; } */
.main main #main_05 .main_history_30 #scene3 .layer:nth-of-type(2) img { width: 60%; }
.main main #main_05 .main_history_30 #scene3 .layer:nth-of-type(1) img{
width: 170%; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(1.5px);
}

.main main #main_05 .main_history_content {flex-basis: 50%; display: table; background-image: url('../img/hi_map.png'); background-repeat: no-repeat; background-position: center 80%; background-color: #f0f3f6; height: 100%; padding: 0 90px 0 4%;}
.main main #main_05 .main_history_content .main_history_wrap {display: table-cell; width: 100%; height: 100%; vertical-align: middle;}
.main_history_wrap .main_history_flex {display: grid; height: 100%; justify-content: space-between; grid-template-columns: repeat(1, 1fr); grid-auto-rows: minmax(100px, auto); align-content: end; justify-content: center; grid-gap: 55px}

.main main #main_05 .main_history_content .main_history_wrap h3 {font-size: 60px; text-align: center; align-self: end}
.main main #main_05 .main_history_content .main_history_wrap .main_history_info {overflow-y: scroll; width: 100%; max-height: 550px}
.main main #main_05 .main_history_content .main_history_wrap .main_history_info::-webkit-scrollbar {width: 10px;}
.main main #main_05 .main_history_content .main_history_wrap .main_history_info::-webkit-scrollbar-thumb {background:#666; ;border-radius: 10px;}
.main main #main_05 .main_history_content .main_history_wrap .main_history_info::-webkit-scrollbar-track {background: #f5f5f5;}

/* 메인 6 section 6섹션 */
.main main #main_06 {width: 100%; height: 100%; background-color: #eef0f3;}
.main main #main_06 .fp-tableCell {width: 100%; height: 100%;}
.main main #main_06 .main_cert { height: 100%;/*  padding: 0!important; */}

.main main #main_06 .main_cert .main_cert_wrap {width: 100%; display: flex; align-items: center; height: 100%; justify-content: center; flex-direction: column; gap: 30px;}
.main main #main_06 .main_cert_content {display: flex; justify-content: space-between; width: 100%; gap:30px; align-items: center;}
.main main #main_06 .main_cert_content .main_cert_bond {overflow: hidden}
.main main #main_06 .main_cert_content .main_cert_txt{text-align: right; max-width: 415px; width: 100%; display: flex; flex-direction: column; justify-content: space-between; height: 100%; gap:0 0}
.main main #main_06 .main_cert_content .main_cert_txt h3 {position: relative; }
.main main #main_06 .main_cert_content .main_cert_txt h3::before {display: inline-block; content: ""; width: 100%; border-top: 1px solid #171717; position: absolute; max-width: 200px; top:50%; right: 50%;}
.main main #main_06 .main_cert_content .main_cert_bond .pic_lt .swiper-container {overflow: hidden}
.main main #main_06 .main_cert_content .main_cert_txt .main_cert_txt_con {font-size: 18px; color: #6a6a6a; line-height: 1.5; word-break: keep-all;}
.main main #main_06 .main_cert_certification {flex-direction: row-reverse;}
.main main #main_06 .main_cert_certification .main_cert_txt {text-align: left}

.main main #main_06 .main_cert_certification .main_cert_txt h3::before {left: 50%;}
.main main #main_06 .main_cert_content .main_cert_txt .arrow-wrap {display: flex; gap:20px; }
.main main #main_06 .main_cert_content .main_cert_txt .main_cert_button a {font-size: 22px;font-weight: 600; font-family: 'Poppins'; margin: 20px 0 40px; display: flex; position: relative; color: #5a5a5a; align-items: center; width: fit-content; word-break: keep-all; text-align: center;}
.main main #main_06 .main_cert_content .main_cert_txt .main_cert_button {display: flex; justify-content: flex-start;}
.main main #main_06 .main_cert_patent .main_cert_txt .main_cert_button { justify-content: flex-end;}
.main main #main_06 .main_cert_content .main_cert_txt .main_cert_button a i {font-size: 30px;}
.main main #main_06 .main_cert_content .main_cert_txt .main_cert_button a::before {content: ""; position: absolute; height: 4px; bottom: 0; background-color: #5a5a5a; left: 0; right: 0; transform-origin: bottom right; transform: scaleX(0); transition: transform 0.5s ease;}
.main main #main_06 .main_cert_content .main_cert_txt .main_cert_button a:hover::before {transform: scaleX(1); transform-origin: bottom left}
.main main #main_06 .main_cert_content .main_cert_txt .arrow-wrap .main_cert_arrow {border: 1px solid #5a5a5a; font-size: 45px; color: #5a5a5a; cursor: pointer; transition: background .3s;}
.main main #main_06 .main_cert_content .main_cert_txt .arrow-wrap .main_cert_arrow:hover {background: #fff}
.main main #main_06 .main_cert_content.up .main_cert_txt .arrow-wrap {justify-content: flex-end;}

/* 메인 7 section 7섹션 */
.main main #main_07 {width: 100%; height: 100%;}
.main main #main_07 .main_contact {width: 100%; height: 100%; padding: 0;}
.main main #main_07 .main_contact .main_contact_wrap {width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; gap:65px}
.main main #main_07 .main_contact .main_contact_wrap .main_contact_txt {flex-basis: 30%;}
.main main #main_07 .main_contact .main_contact_wrap .main_contact_info {border-top:3px solid #171717; border-bottom:3px solid #171717; padding: 30px 0; margin:55px 0}
.main main #main_07 .main_contact .main_contact_wrap .main_contact_info h4 {font-size: 28px; color:#4a4a4a; font-family: 'rotunda-variable'; font-weight: 500; padding-bottom: 10px;}
.main main #main_07 .main_contact .main_contact_wrap .main_contact_info li {word-break: keep-all;}
.main main #main_07 .main_contact .main_contact_wrap .main_contact_info li:not(:first-child)::before {content: ""; display: inline-block; width: 100%; border-top: 1px solid #ccc; padding-bottom: 25px; margin-top: 25px;}
.main main #main_07 .main_contact .main_contact_wrap .main_contact_info p {font-size: 18px; color:#5a5a5a; font-weight: 400; line-height: 1.3; padding: 2px 0; display: flex; gap:15px; align-items: center; transition: color .3s;}
.main main #main_07 .main_contact .main_contact_wrap .main_contact_info p.main_map_link:hover {color:#1a4691}
.main main #main_07 .main_contact .main_contact_wrap
.main main #main_07 .main_contact .main_contact_wrap .main_contact_info p > * {display: flex; gap:15px; align-items: center;}
.main main #main_07 .main_contact .main_contact_wrap .main_contact_info p.i_color i {color: #5679ba; font-size: 25px; }
.main main #main_07 .main_contact .main_contact_wrap .main_contact_map {max-width: 800px; flex-basis: 70%; padding: 20px;}
.main main #main_07 .main_contact .main_contact_wrap .main_contact_map iframe {max-width: 800px; width: 100%; height: 500px; border-radius: 0 90px 0 90px; box-shadow:-3px 0px 15px rgba(47,55,68,0.2)}

/* 메인 8section 8섹션 */
.main main #main_08 {width: 100%}
.main main #main_08 .main_partner {/*display: table; */display: flex; height: 100%; width: 100%; align-items: center; justify-content: center}
.main main #main_08 h3 { margin-bottom: 50px; text-align: center; }
.main main #main_08 ul { margin-bottom: 20px; }
.main main #main_08 ul li { display: flex; gap: 1vw; align-items: center; font-size: 24px; font-weight: 600; line-height: 2; margin-bottom: 20px; }
.main main #main_08 ul li span:first-of-type { display: inline-block; width: 58px; height: 58px; background: #92b4e1; color: white; text-align: center; line-height: 58px; border-radius: 100%; }
.main main #main_08 ul li span:last-of-type { display: inline-block; width: 100%; padding: 5px 15px; background: none; border-radius: 10px; }

.main main #main_08 p { font-size: 24px; line-height: 1.5; }
.main main #main_08 p span { color: #003f7e; font-weight: 600; }

/* main_08 기본 스타일: 태블릿/모바일용 */
.main main #main_08 { height: auto !important; }
.main main #main_08 .fp-tableCell { height: auto !important; display: flex; align-items: center; justify-content: center; }
.main main #main_08 .main_partner_wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding: 60px 4%; }
.main main #main_08 .main_partner_txt.container { max-width: 100%; }

/* 중간 크기 화면에서 헤더 메뉴 최적화 (1151px~1400px) */
@media (min-width: 1151px) and (max-width: 1300px) {
  #header .header_wrap .head_gnb {font-size: 18px; gap: 35px;}
  #header .header_wrap .head_gnb .topmenu .lnb {font-size: 14px;}
  #header .header_wrap {padding: 0 0 0 10px; gap: 15px;}
  #header .global_nav {width: 70px;}
  #header .header_wrap .head_logo {min-width: 120px;}
}

@media (min-width: 1301px) and (max-width: 1400px) {
  #header .header_wrap .head_gnb {font-size: 19px; gap: 40px;}
  #header .header_wrap .head_gnb .topmenu .lnb {font-size: 15px;}
  #header .header_wrap {padding: 0 0 0 15px;}
  #header .global_nav {width: 75px;}
  #header .header_wrap .head_logo {min-width: 130px;}
}


@media (max-width: 1200px) {
  .main main #main_08 { height: auto !important; }
  .main main #main_08 .fp-tableCell { height: auto !important; }
  .main main #main_08 .main_partner { align-items: flex-start; }
  .main main #main_08 .main_partner_wrap { padding: 60px 4%; }
  .main main #main_08 .main_partner_txt.container { margin-bottom: 24px; }
}

@media (max-width: 950px) {
  .main main #main_08 { height: auto !important; }
  .main main #main_08 .fp-tableCell { height: auto !important; }
  .main main #main_08 .main_partner_wrap { padding: 50px 6%; }
  .main main #main_08 h3 { margin-bottom: 36px; }
  .main main #main_08 ul li { font-size: 20px; line-height: 1.8; }
  .main main #main_08 p { font-size: 20px; }
}

@media (max-width: 768px) {
  .main main #main_08 { height: auto !important; }
  .main main #main_08 .fp-tableCell { height: auto !important; }
  .main main #main_08 .main_partner_wrap { padding: 40px 5%; }
  .main main #main_08 h3 { margin-bottom: 30px; }
  .main main #main_08 ul li { font-size: 18px; line-height: 1.7; }
  .main main #main_08 p { font-size: 18px; }
}

/* Desktop: 100vh 적용 및 세로 중앙 정렬 */
@media (min-width: 1201px) {
  .main main #main_08 { height: 100vh !important; }
  .main main #main_08 .fp-tableCell { height: 100vh !important; display: flex; align-items: center; justify-content: center; }
  .main main #main_08 .main_partner { align-items: center; }
  .main main #main_08 .main_partner_wrap { padding: 0 4%; }
}


/*sub*/
/* 서브 공통 헤더 */
.sub-hd .header_wrap {color: #fff!important;}
.sub-hd .header_wrap .head_logo .logo_b {display: none!important;}
.sub-hd .header_wrap .head_logo .logo_w {display: inline-block!important;}
.sub-hd:hover .header_wrap .head_logo .logo_w {display: none!important;}
.sub-hd:hover .header_wrap .head_logo .logo_b {display: inline-block!important;}

#s_top{position: relative; padding-top: 240px}
#s_top.bg01{background: url(../img/s_top_bg01.png) no-repeat center center / cover;}
#s_top.bg02{background: url(../img/s_top_bg02.png) no-repeat center center / cover;}
#s_top.bg03{background: url(../img/s_top_bg03.png) no-repeat center center / cover;}
#s_top.bg04{background: url(../img/s_top_bg04.png) no-repeat center center / cover;}
#s_top.bg05{background: url(../img/s_top_bg04.png) no-repeat center center / cover;}
#s_top.rndbg{background: url(../img/rndbg.png) no-repeat center center / cover;}

#s_top .s_top_h2_wrap {padding-bottom: 140px}
#s_top .s_top_h2_wrap::before {content: ""; display: inline-block; border-left: 2px solid rgba(255,255,255,0.7); height: 100%; top: 0; left: 0; position: absolute;}
#s_top h2 {color: #fff; font-weight: 500;}
#s_top .s_top_h2_wrap::after {content: ""; display: inline-block; border-left: 2px solid #fff; height: 30px; top: 0; left: 0; position: absolute; animation: 1s ease infinite sub-line; }
@keyframes sub-line {
from {
    top: 0;
}

to {
    top: 320px;
}
}
#s_top .tit{font-family: 'poppins'; font-size: 32px; line-height: 1;}
#s_top .tit-p {font-size: 80px; font-family: 'Noto Sans KR'; line-height: 1.3}
#sub-wrap{padding:50px 0;}
#sub-section{padding:50px 0;}
#sub-wrap{padding:120px 0; overflow: hidden; position: relative;}
#snb_wrap{border-bottom:1px solid #ddd;}
#snb_wrap.exception{display: none;}
#snb{padding: 0;display: flex; flex-wrap: wrap; align-items: center;}
#snb > li{font-family: 'Noto Sans KR'; font-weight: 500;font-size: 16px; color: #5a5a5a;  padding: 15px 30px; cursor: pointer; position: relative; justify-content: space-between; display: flex; transition: color .3s; align-items: center;}
#snb > li:hover {color: #1a4691; font-weight: 700; letter-spacing: -.21px;}
#snb > li::after {border-right: 1px solid #ddd; content: ""; display: inline-block; height: 25px; position: absolute; right: 0; top: 50%; transform: translate(0, -50%);}
#snb > li i{font-size: 25px; font-weight: 500}
#snb > li:nth-child(2){width: 280px;}
#snb > li:nth-child(3){width: 280px;}


#snb .lnb{display: none; margin-left:-1px; position: absolute;  width: calc(100% + 2px);padding: 15px 0; z-index: 99; border: 1px solid #e4e4e4; background: #fff; transition: all .3s; left:0; top:100%;}

#snb .lnb li {display: block; padding: 8px 30px; }
#snb .lnb li a{display: block; font-family: 'Noto Sans KR'; font-weight: 500;font-size: 16px;  color: #999; position: relative;width: fit-content}
#snb .lnb li a:hover{color:#1a4691;}
#snb .lnb li a::after {content: ""; position: absolute; height: 1px; bottom: -5px; background-color: #1a4691; left: 0;right: 0;transform-origin: bottom right; transform: scaleX(0); transition: transform 0.5s ease;}
#snb .lnb li a:hover::after{transform-origin: bottom left; transform: scaleX(1);}

/* sub 서브페이지 */
#sub{padding: 100px 30px;}
#sub .subtitle_wrap {letter-spacing: -1px; font-weight: 700; padding-bottom: 80px;}
#sub .subtitle_wrap .eng_title {font-size: 30px; color: #144d98;}
#sub .subtitle_wrap .sub_title {display: flex; align-items: center; gap:80px;}
#sub .subtitle_wrap .sub_title h3 {font-size: 60px;}
#sub .subtitle_wrap .sub_title .sub_description {color: #666; font-size: 20px; font-weight: 200; word-break: keep-all;}
#sub_wrap .sub-section {word-break: keep-all;}
#sub_wrap .sub-section:not(:last-child) {padding-bottom: 100px;}
#sub_wrap .sub-section .sub_content_tit {position: relative; padding: 50px 0;}
#sub_wrap .sub-section .sub_content_tit span {position: relative;}
#sub_wrap .sub-section .sub_content_tit span::after {content: ''; position: absolute; top: -20px; left: -25px; width: 50px; height:50px; background:#1a4691; z-index: -1}
#sub_wrap .sub-section .sub_content_tit span::before {position: absolute; content: ''; top: 0px; left: 0px;content: attr(data-split);color: #fff; overflow: hidden; font-size: 45px; width: 25px; height:30px; z-index: 1}
#sub_wrap .sub-section .sub_content_tit h5 {font-size: 45px; font-weight: 700; position: relative; }



/* sub01_01 회사소개 */
.sub01_01 .section01 {display: flex; align-items: center; justify-content: space-between;}
.sub01_01 .section01 .sub-content-img {flex-basis:48%; border-radius: 10px;}
.sub01_01 .section01 .sub-content-img img {border-radius: 10px;}
.sub01_01 .section01 .sub-content-txt {flex-basis: 50%; max-width: 100%;}
.sub01_01 .section01 .sub-content-txt h4 {font-size:35px; letter-spacing: -1px; padding-bottom: 30px; line-height: 1.3; word-break: auto-phrase;}
.sub01_01 .section01 .sub-content-txt h4 span {font-weight: 700;}
.sub01_01 .section01 .sub-content-txt .sub-content-intro {font-size: 18px; color: #5a5a5a; font-weight: 400; line-height: 1.5; word-break: auto-phrase;}
.sub01_01 .section01 .sub-content-txt .sub-content-intro .txt_right {text-align: right;}
.sub01_01 .section01 .sub-content-txt .sub-content-intro .txt_right .sub_corp {font-size: 20px; font-weight: 700; color: #aaa; word-break: keep-all;}
.sub01_01 .section01 .sub-content-txt .sub-content-intro .ceo {display: flex; gap: 20px; align-items: center; justify-content: right;}
.sub01_01 .section01 .sub-content-txt .sub-content-intro .txt_right .sub_ceo {font-size: 25px; font-weight:800; color: #171717;}
.sub01_01 .section02 ul {display: flex; flex-wrap: wrap; gap:1vw 1%; }
.sub01_01 .section02 ul li {flex-basis: 24%; border: 1px solid #ddd; border-radius: 10px; padding: 20px; position: relative;}
.sub01_01 .section02 ul li p {display: flex; flex-direction: column;}
.sub01_01 .section02 ul li .overview_tit {font-size: 25px; font-weight: 600}
.sub01_01 .section02 ul li .overview_txt {font-size: 16px; font-weight: 400; color: #666; padding: 10px 0 100px;word-break: keep-all;}
.sub01_01 .section02 ul li p:last-child {position: absolute; font-size: 35px; font-weight: 200; color:#666; bottom: 20px; right: 20px; color: #144d98}
.sub01_01 .section03 .sub_directions {padding-top: 50px;}
.sub01_01 .section03 .sub_directions > ul {display: flex; justify-content: center; gap:1vw 1%}
.sub01_01 .section03 .sub_directions > ul > li {flex-basis: 32%; border: 1px solid #ddd; border-radius: 10px; padding: 20px; position: relative;}
.sub01_01 .section03 .sub_directions > ul > li h6 {font-size: 25px; font-weight: 600; padding-bottom: 10px;}
.sub01_01 .section03 .sub_directions > ul > li > span {position: absolute; font-size: 35px; font-weight: 200; bottom: 20px; right: 20px; color: #144d98;}
.sub01_01 .section03 .sub_directions > ul > li ul li {display: flex; align-items: center; gap:10px; padding-bottom: 10px}
.sub01_01 .section03 .sub_directions > ul > li ul li a {display: flex; align-items: center; gap:10px; font-size: 16px; color: #666; transition: color .3s;}
.sub01_01 .section03 .sub_directions > ul > li ul li a:hover {color: #144d98}
.sub01_01 .section03 .sub_directions > ul > li ul li p:first-child {font-size: 17px; }
.sub01_01 .section03 .sub_directions > ul > li ul li p:last-child {font-size: 16px; color: #666; word-break: keep-all;}
.sub01_01 .section03 .sub_directions .curcle {border-radius: 100px; width: fit-content; height: fit-content; display: inline-block; background-color: red; padding: 5px 12px; color: #fff; font-weight: 600}
.sub01_01 .section03 .sub_directions > ul > li:nth-of-type(1) .curcle {background-color: #7CA8D5}
.sub01_01 .section03 .sub_directions > ul > li:nth-of-type(2) ul li:nth-of-type(1) .curcle {background-color: #00afbd}
.sub01_01 .section03 .sub_directions > ul > li:nth-of-type(2) ul li:nth-of-type(2) .curcle {background-color: #0068b7}
.sub01_01 .section03 .sub_directions > ul > li:nth-of-type(2) ul li:nth-of-type(3) .curcle {background-color: #53b332}
.sub01_01 .section03 .sub_directions > ul > li:nth-of-type(2) ul li:nth-of-type(4) .curcle {background-color: #e60012}
.sub01_01 .section03 .sub_directions > ul > li:nth-of-type(2) ul li:nth-of-type(4) .curcle {background-color: #800000}
.sub01_01 .section03 .sub_map {max-width: 1380px; padding: 20px; margin: 0 auto;}

.sub-section .sub_content.ready {font-size: 20px; text-align: center;}

/* sub01_06 R&D */
.sub01_06 .img_box { display: flex; justify-content: space-between; gap: 2vw; }
.sub01_06 .img_box li { width: calc(100% / 3); }
.sub01_06 .img_box li img { display: block; width: 100%; border-radius: 7px;}
.sub01_06 .section02 ul {display: flex; gap:1vw 2vw; }
.sub01_06 .section02 ul li {display: flex; flex-direction: column-reverse;flex-basis: calc(100% / 3); border: 1px solid #ddd; border-radius: 10px; padding: 20px; position: relative;  gap: 2vw;}
.sub01_06 .section02 ul li .overview_tit {font-size: 25px; font-weight: 600}
.sub01_06 .section02 ul li .overview_txt {font-size: 16px; font-weight: 400; color: #666; padding: 10px 0 100px;word-break: keep-all;}
.sub01_06 .section02 ul li p:first-of-type { text-align: right; }
.sub01_06 .section02 ul li p:last-of-type {font-size: 35px; font-weight: 200; color:#666; color: #144d98}
.sub01_06 .section03 img { display: block; margin: 0 auto; }
.sub01_06 .section04 .flex_wrap { display: flex; justify-content: space-between; }
.sub01_06 .section04 ul li { position: relative; padding-left: 30px; font-size: 25px; font-weight: 600; line-height: 2; }
.sub01_06 .section04 ul li::after { content: ""; display: block; width: 8px; height: 8px; background: #000; opacity: 0.6; position: absolute; left: 0; top: 50%; transform: translate(0, -50%); border-radius: 100%; }
.sub01_06 .section04 img { width: 60%; }

/* sub01_05 윤리경영 */
.sub01_05 .sub-section .sub_content_tit p {font-size: 20px; font-weight: 400; color: #144d98}
.sub01_05 .sub-section .philosophy_top h6 {font-size: 25px; font-weight: 700; word-break: keep-all;}
.sub01_05 .sub-section .philosophy_top p {font-size: 17px; font-weight: 300; color: #5a5a5a; line-height: 1.5; padding: 10px 0 25px; word-break: keep-all;}
.sub01_05 .sub-section .philosophy_content ul li {border-bottom: 1px solid #ddd; padding: 15px 0;}
.sub01_05 .sub-section .philosophy_content ul li .list_num {font-size: 22px; color: #888; font-weight: 500; position: relative; width: fit-content; margin-bottom: 20px;}
.sub01_05 .sub-section .philosophy_content ul li .list_num::after {content: ""; display: inline-block; width: 100%; height: 3px; background-color: #144d98; position: absolute; bottom: -5px; left: 0;}
.sub01_05 .sub-section .philosophy_content ul li .phil_wrap {display: flex; justify-content: space-between; font-size: 20px; align-items: center; gap:2vw 2%}
.sub01_05 .sub-section .philosophy_content ul li .phil_wrap .plil_txt {word-break: keep-all;}
.sub01_05 .sub-section .philosophy_content ul li .phil_wrap .phil_img span {font-size: 50px; color:#144d98}
.sub01_05 .sub-section .attatch {background-image: url(../img/sub01_05back.png); background-repeat: no-repeat; background-position: top; background-size: cover; background-attachment: fixed; height: 330px; border-radius: 10px;}
.sub01_05 .sub-section.section02 .philosophy_content p:first-child {font-size: 20px; padding: 20px 0 10px; }
.sub01_05 .sub-section.section02 .philosophy_content p:last-child {font-size:16px; color: #5a5a5a; font-weight: 400; line-height: 1.5}


/* sub02 비지니스 인더스트리 */
#sub_wrap .sub_content h2 {font-size:35px; font-weight: 500; letter-spacing: -2px; margin-bottom:20px;}
#sub_wrap .sub_content .img_list_box {display: flex; align-items: center; gap:5% 1vw; }
#sub_wrap .sub_content .sub_img {flex-basis: 45%; border-radius: 7px;}
#sub_wrap .sub_content .sub_img img {border-radius: 7px;}
#sub_wrap .sub_content .list_wrap {display: flex; justify-content: space-between; align-items: center; border-top:2px solid #171717; border-bottom: 1px solid #ddd; max-height: 350px; height: 26vw; flex-basis: 50%; font-size: 20px; color: #5a5a5a; font-weight: 400}
#sub_wrap .sub_content .list_wrap .list {display: flex; flex-direction: column; justify-content: space-evenly; height: 100%; padding: 2vw 0; }


/* sub03 공통사항 */
#sub_wrap.sub03_02 .sub_content section:not(:last-child) {padding-bottom: 100px;}
#sub_wrap.sub03_03 .sub_content section:not(:last-child) {padding-bottom: 100px;}
#sub_wrap .list_flex {display: flex; gap:2vw 2%; justify-content: space-between;}
#sub_wrap .list_flex h6 {flex-basis: 20%; border-top: 3px solid #144d98; padding-top: 25px; color: #144d98; font-size: 25px; font-weight: 700; line-height: 1.1}
#sub_wrap .list_flex h6 p {font-size: 18px; font-weight: 500; word-break: keep-all;}
#sub_wrap .list_flex .info_list_box {flex-basis: 78%; border-top: 3px solid #4D75B9; padding-top: 25px;}
#sub_wrap .list_flex .info_list_box .list_txt {}
#sub_wrap .list_flex .info_list_box .list_txt li {font-size: 18px; position: relative; padding-left: 20px; line-height: 1.5;}
#sub_wrap .list_flex .info_list_box .list_txt li:not(:last-child) {padding-bottom: 15px;}
#sub_wrap .list_flex .info_list_box .list_txt li p { word-break: keep-all;}
#sub_wrap .list_flex .info_list_box .list_txt li span {font-size: 16px}
#sub_wrap .list_flex .info_list_box .list_txt li::before {content: "•"; position: absolute; left: 0; color: #144d98; font-weight: 700;}
#sub_wrap .list_flex .info_list_box .list_img {display: grid; gap:2vw 10%}
#sub_wrap .list_flex .info_list_box .list_img img {border-radius: 7px;}
#sub_wrap .list_flex .info_list_box .list_img.basis_2 {grid-template-columns: repeat(2, 1fr);}
#sub_wrap .list_flex .info_list_box .list_img.basis_3 {grid-template-columns: repeat(3, 1fr);}
#sub_wrap .list_flex .info_list_box .list_img li {display: flex; flex-direction: column; align-items: center; gap: 1vw 4%; text-align: center; font-size: 20px; font-weight: 700; line-height: 1.1; }
#sub_wrap .list_flex .info_list_box .list_img li p {word-break: keep-all;}
#sub_wrap .list_flex .info_list_box .list_img li span {font-size: 16px; font-weight: 500; word-break: keep-all;}

/* sub03_02 웹크리너 */
#sub_wrap.sub03_02 .sub_content_tit p {font-size: 20px; word-break: keep-all; padding: 10px 0 20px; color: #555}
#sub_wrap.sub03_02 .list_flex .info_list_box .subscript {text-align: right; font-size: 14px; color:#144d98; padding-top: 50px;}
#sub_wrap.sub03_02 .section02 li {color: #144d98}

/* sub03_03 피닝시스템 */
#sub_wrap.sub03_03 .section02 .list_txt {padding-bottom: 50px}
#sub_wrap.sub03_03 .section06 .list_table_wrap {display: flex; width: 100%;}
#sub_wrap.sub03_03 .section06 .list_table_wrap .list_table {flex-basis: 50%;}
#sub_wrap.sub03_03 .section06 .list_table_wrap .list_table_01 thead {border-right: 1px solid #fff;}
#sub_wrap.sub03_03 .section06 .list_table_wrap .list_table thead tr th {color: #fff; background-color: #144d98; font-size: 20px; padding: 10px 0;}
#sub_wrap.sub03_03 .section06 .list_table_wrap .list_table tbody tr {border-bottom: 1px solid #ddd}
#sub_wrap.sub03_03 .section06 .list_table_wrap .list_table_01 tbody tr {border-right: 1px solid #ddd}
#sub_wrap.sub03_03 .section06 .list_table_wrap .list_table tbody tr td {font-size: 16px; text-align: center; padding: 10px 0}
#sub_wrap.sub03_03 .section06 .list_table_wrap .list_table .border_right {border-right: 1px solid #ddd; word-break: keep-all;}

/* sub03_04 파트너사*/
#sub_wrap.sub03_04 .sub_content_tit {display: none;}
#sub_wrap.sub03_04 .sub_content_tit.active {display: block}
#sub_wrap.sub03_04 .snb_button {}
#sub_wrap.sub03_04 .snb_button ul {display: flex; gap: 2vw 3%; padding: 50px 0; word-break: keep-all;}
#sub_wrap.sub03_04 .snb_button ul li {cursor: pointer; font-size: 25px; font-weight: 700; color:#A5A5A5; transition: color .3s; position: relative;}
#sub_wrap.sub03_04 .snb_button ul li.active,#sub_wrap.sub03_04 .snb_button ul li:hover {color:#144d98;}
#sub_wrap.sub03_04 .snb_button ul li::before {content: ""; display: block;  position: absolute; top: -15px; left: 50%; transform: translate(-50%, -50%); width: 0; height: 0; border-radius: 100px; background-color: tranperant; transition: all .3s;}
#sub_wrap.sub03_04 .snb_button ul li:hover::before, #sub_wrap.sub03_04 .snb_button ul li.active::before {background-color: #144d98; width: 10px; height: 10px;}
#sub_wrap.sub03_04 .section_wrap {display: none;}
#sub_wrap.sub03_04 .section_wrap.active {display: block;}
#sub_wrap.sub03_04 .section_wrap section:not(:last-child) {padding-bottom: 100px;}
#sub_wrap.sub03_04 .wc .info_list_box .list_img {padding-bottom: 50px;}

#sub_wrap.sub03_04 .basis_3 {align-items: center;}
#sub_wrap.sub03_04 .section01 .list_txt {padding-bottom: 50px}
#sub_wrap.sub03_04 .section04 .list_table_wrap {display: flex; width: 100%;}
#sub_wrap.sub03_04 .section04 .list_table_wrap .list_table {flex-basis: 100%;}
#sub_wrap.sub03_04 .section04 .list_table_wrap .list_table_01 thead tr th:first-child {border-right: 1px solid #fff;}
#sub_wrap.sub03_04 .section04 .list_table_wrap .list_table thead tr th {color: #fff; background-color: #144d98; font-size: 20px; padding: 10px 0;}
#sub_wrap.sub03_04 .section04 .list_table_wrap .list_table tbody tr {border-bottom: 1px solid #ddd}
#sub_wrap.sub03_04 .section04 .list_table_wrap .list_table tbody tr td {font-size: 16px; text-align: center; padding: 10px 0}
#sub_wrap.sub03_04 .section04 .list_table_wrap .list_table tbody tr td:first-child {border-right: 1px solid #ddd}
#sub_wrap.sub03_04 .section04 .list_table_wrap .list_table tbody tr .align_left {text-align: left; padding: 10px 0 10px 20%}
#sub_wrap.sub03_04 .section04 .list_table_wrap .list_table .border_right {border-right: 1px solid #ddd; word-break: keep-all;}

/*footer 푸터*/
#footer {height: auto!important; background-color: #171717;}
#footer .fp-tableCell {height: auto!important;}
#footer .footer .footer_wrap {display: flex; color:#fff; justify-content: space-between; width: 100%; padding: 50px 0}
#footer .footer .footer_wrap .footer_left {display: flex; gap:7%; flex-basis: 70%;}
#footer .footer .footer_wrap .footer_left .logo_w {flex-basis: 23%;}
#footer .footer .footer_wrap .footer_left .logo_w a {display: inline-block; height: fit-content;}
#footer .footer .footer_wrap .footer_left .logo_w a img {display: inline-block;}
#footer .footer .footer_wrap .footer_left .footer_info {flex-basis: 70%;}
#footer .footer .footer_wrap .footer_left .logo_w img {filter: opacity(0.8);}
#footer .footer .footer_wrap .footer_left .footer_info address {display: block;}
#footer .footer .footer_wrap .footer_left .footer_info address ul li {font-size: 15px; font-weight: 300; line-height: 1.5; color: #dedede;}
#footer .footer .footer_wrap .footer_left .footer_info address ul li a {color: #dedede; text-decoration: none; transition: color .3s;}
#footer .footer .footer_wrap .footer_left .footer_info address ul li a:hover {color: #45b5ff;}
#footer .footer .footer_wrap .footer_left .footer_info small {font-size: 14px; font-weight: 300; padding-top: 25px;display: inline-block; color: #c5c5c5}
#footer .footer .footer_wrap .footer_left .footer_info small a {color: #c5c5c5; text-decoration: none; transition: color .3s;}
#footer .footer .footer_wrap .footer_left .footer_info small a:hover {color: #45b5ff;}
#footer .footer .footer_wrap .footer_link {display: flex; justify-content: space-between; flex-direction: column; align-items: flex-end;}
#footer .footer .footer_wrap .footer_link .footer_link_list {display: flex; gap:15px; align-items: center;}

#footer .footer .footer_wrap .footer_link > a {display: inline-block; height: fit-content; font-size: 18px; font-weight: 500; color: #fff; text-decoration: none;}
#footer .footer .footer_wrap .footer_link > a:hover {color: #45b5ff;}
#footer .footer .footer_wrap .footer_link .footer_link_list >li > a {display: inline-block; height: fit-content; padding: 10px 0; color: #fff; text-decoration: none;}
#footer .footer .footer_wrap .footer_link .footer_link_list >li > a:hover {color: #45b5ff;}
#footer .footer .footer_wrap .footer_link .footer_link_list >li > a > i {font-size: 35px; color: #fff;}
#footer .footer .footer_wrap .footer_link .footer_link_list .ft_global {text-align: center; position: relative; cursor: pointer;}

#footer .footer .footer_wrap .footer_link .footer_link_list .ft_global ul { position: absolute;bottom: 50px; left: 50%; transform: translate(-50%, 0); border: 1px solid rgba(255,255,255,0.2); box-shadow: 0px 0px 5px rgba(25,25,25,0.5);}
#footer .footer .footer_wrap .footer_link .footer_link_list .ft_global ul li {display: block; font-size: 16px; background-color: #171717; position: relative; transition: all .3s;}
#footer .footer .footer_wrap .footer_link .footer_link_list .ft_global ul li a {padding: 6px 22px; display: block; color: #fff; text-decoration: none;}
#footer .footer .footer_wrap .footer_link .footer_link_list .ft_global ul li a:hover {color: #45b5ff;}
#footer .footer .footer_wrap .footer_link .footer_link_list .ft_global ul li:hover {color: #1387d3; background-color: #fff;}
#footer .footer .footer_wrap .footer_link .footer_link_list .ft_global ul li:not(:last-child)::after {content: ""; width: 100%; height: 1px; background-color: rgba(255,255,255,0.2); position: absolute; bottom:0; left:0;}
#footer .footer .footer_wrap .footer_link .footer_link_list li .ft_global_list {display: none;}
#footer .footer .footer_wrap .footer_link .pt_pri {transition: color .3s; color: #fff; text-decoration: none;}
#footer .footer .footer_wrap .footer_link .pt_pri:hover {color: #45b5ff;}

/* ========================================
   이미지 팝업 스타일
   ======================================== */
.popup_layer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
}

.popup_content {
    background: none;
    border-radius: 10px;
    max-width: 500px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    position: relative;
}

.popup_header {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 100000;
}

.popup_close {
    background: rgba(0, 0, 0, 0.5);
    border: none;
    font-size: 25px;
    cursor: pointer;
    color: #fff;
    padding: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background 0.3s;
}

.popup_close:hover {
    background: rgba(0, 0, 0, 0.7);
}

.popup_image_container {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.popup_image {
    width: 100%;
    height: auto;
    object-fit: contain;
    display: block;
}

.popup_footer {
    padding: 7px 20px;
    background: #f8f9fa;
    border-top: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.popup_checkbox_wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}

.popup_checkbox {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.popup_checkbox_label {
    font-size: 14px;
    color: #666;
    cursor: pointer;
    user-select: none;
}

.popup_buttons {
    display: flex;
    gap: 10px;
}

.popup_close_btn {
    background: #1a4691;
    color: #fff;
    border: none;
    padding: 3px 16px;
    border-radius: 4px;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.3s;
}

.popup_close_btn:hover {
    background: #144d98;
}

/* 팝업 모바일 반응형 */
@media (max-width: 768px) {
    .popup_content {
        width: 95%;
        margin: 20px;
    }
    
    .popup_close {
        width: 35px;
        height: 35px;
        font-size: 20px;
    }
}

@media (max-width: 480px) {
    .popup_content {
        width: 98%;
        margin: 10px;
    }
    
    .popup_close {
        width: 30px;
        height: 30px;
        font-size: 18px;
    }
    
    .popup_footer {
        padding: 12px 15px;
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    
    .popup_checkbox_wrap {
        justify-content: center;
    }
    
    .popup_buttons {
        justify-content: center;
    }
}