@charset "utf-8";

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/noto-sans-kr-v7-latin_korean-100.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans KR Thin'), local('NotoSansKR-Thin'),
       url('../fonts/noto-sans-kr-v7-latin_korean-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v7-latin_korean-100.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v7-latin_korean-100.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v7-latin_korean-100.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/noto-sans-kr-v7-latin_korean-300.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans KR Light'), local('NotoSansKR-Light'),
       url('../fonts/noto-sans-kr-v7-latin_korean-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v7-latin_korean-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v7-latin_korean-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v7-latin_korean-300.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/noto-sans-kr-v7-latin_korean-regular.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans KR Regular'), local('NotoSansKR-Regular'),
       url('../fonts/noto-sans-kr-v7-latin_korean-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v7-latin_korean-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v7-latin_korean-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v7-latin_korean-regular.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/noto-sans-kr-v7-latin_korean-500.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans KR Medium'), local('NotoSansKR-Medium'),
       url('../fonts/noto-sans-kr-v7-latin_korean-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v7-latin_korean-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v7-latin_korean-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v7-latin_korean-500.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/noto-sans-kr-v7-latin_korean-700.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans KR Bold'), local('NotoSansKR-Bold'),
       url('../fonts/noto-sans-kr-v7-latin_korean-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v7-latin_korean-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v7-latin_korean-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v7-latin_korean-700.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/noto-sans-kr-v7-latin_korean-900.eot'); /* IE9 Compat Modes */
  src: local('Noto Sans KR Black'), local('NotoSansKR-Black'),
       url('../fonts/noto-sans-kr-v7-latin_korean-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v7-latin_korean-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v7-latin_korean-900.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v7-latin_korean-900.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'GmarketSans';
  font-style: normal;
  font-weight: 200;
  src: local("?"),
       url('../fonts/GmarketSansTTFLight.woff') format('woff');
}
@font-face {
  font-family: 'GmarketSans';
  font-style: normal;
  font-weight: 400;
  src: local("?"),
       url('../fonts/GmarketSansTTFMedium.woff') format('woff');
}
@font-face {
  font-family: 'GmarketSans';
  font-style: normal;
  font-weight: 600;
  src: local("?"),
       url('../fonts/GmarketSansTTFBold.woff') format('woff');
}
@font-face {
  font-family: 'Pretendard-Regular';
  src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Paperlogy';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-1Thin.woff2') format('woff2');
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: 'Paperlogy';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-2ExtraLight.woff2') format('woff2');
  font-weight: 200;
  font-style: normal;
}

@font-face {
  font-family: 'Paperlogy';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-3Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Paperlogy';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-4Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Paperlogy';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-5Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Paperlogy';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-6SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Paperlogy';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-7Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Paperlogy';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-8ExtraBold.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'Paperlogy';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-9Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
}


*{ font-family: 'Pretendard-Regular'}/* 모든 폰트 프리텐다드로 변경 */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, b, u, i, center,dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: inherit; /*vertical-align: baseline; */}
.wrap{width: 100%;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}
ol, ul { list-style: none;}
blockquote, q { quotes: none;}
blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none;}
table { border-collapse: collapse; border-spacing: 0;}
table caption {overflow: hidden; width: 0; height: 0; font-size: 0; line-height: 0;}
a {color: #000000; text-decoration: none;}
label, img { vertical-align:middle;}
/*html { -webkit-text-size-adjust: none; -webkit-font-smoothing: aliased;}*/
html {-webkit-text-size-adjust: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: hidden;}
input {-webkit-border-radius: 0; -webkit-appearance: none;}
div, label { box-sizing: border-box;}
select {background: #f2f5f9; border: 1px solid #d0d5da; vertical-align: middle; height: 30px; color: #4f4f4f; font-size: 12px;}
input::-webkit-input-placeholder {color: #999 !important; font-weight: 200; font-size: 15px; letter-spacing: 0 !important;}
input:-ms-input-placeholder {color: #999 !important; font-weight: 200; font-size: 15px; letter-spacing: 0 !important;}
textarea { border:1px solid #d0d5da; border-radius: 2px; min-height: 90px;}
textarea::-webkit-input-placeholder {color: #ccc !important; font-weight: 200; letter-spacing: 0;}
textarea:-ms-input-placeholder {color: #ccc !important; font-weight: 200; letter-spacing: 0;}
select {padding: 0 20px 0 10px; border: 1px solid #d0d5da; font-family: inherit; background: url('../images/icon_select.jpg') #fff no-repeat calc(100% - 10px) 50%; border-radius: 2px; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
select::-ms-expand {display: none;}
input[type=radio] {width: 20px; height: 20px; border: 1px solid #dddddd; border-radius: 12px; vertical-align: middle; background: #fff; margin-right: 3px; position: relative; box-sizing: border-box;}
input[type=radio]::after {content: ''; background: #cccccc; display: block; box-sizing: border-box; width: 12px; height:  12px; position: absolute; left: 3px; top: 3px; border-radius: 10px;}
input[type=radio]:checked {border:1px solid  #888888;}
input[type=radio]:checked::after {content: ''; background: #41a338; display: block; box-sizing: border-box; width: 12px; height: 12px; position: absolute; left: 3px; top: 3px; border-radius: 10px;}
input[type=checkbox] {width: 20px; height: 20px; display: inline-block; vertical-align: middle; margin-right: 3px; margin-top: -4px !important; background: #fff; border: 1px solid #777777; margin-top: 0; box-sizing: border-box; position: relative; overflow: hidden; z-index: 1; vertical-align: middle;}
input[type=checkbox]:checked {border: 0;}
input[type=checkbox]:checked::before {content: ''; width: 20px; height: 20px; display: block; background: url(../images/ico_checkbox.png) 0 0 no-repeat #41a338; border: 2px solid #41a338;  position: absolute; left: 0; top: 0; z-index: 2;}

.f-clear:after {content: " "; height: 0; display: block; visibility: hidden; clear: both;}
* html .f-clear {height: 1%;}
.f-clear {display: block; min-height: 1%;}
.clear {clear: both;}
.f-left {float: left;}
.f-right {float: right;}
.astbl {display: table; width: 100%; height: 100%; overflow: hidden;}

h3, h4, h5, h6 {font-weight: 500;}

.w100p {width: 100% !important;}
.w90p {width: 90% !important;}
.w80p {width: 80% !important;}
.w70p {width: 70% !important;}
.w60p {width: 60% !important;}
.w50p {width: 49% !important;}
.w40p {width: 40% !important;}
.w35p {width: 35% !important;}
.w30p {width: 30% !important;}
.w20p {width: 20% !important;}
.w10p {width: 10% !important;}

.w50 {width: 50px !important;}
.w60 {width: 60px !important;}
.w80 {width: 80px !important;}
.w100 {width: 100px !important;}
.w200 {width: 200px !important;}
.w300 {width: 300px !important;}
.w400 {width: 400px !important;}
.w500 {width: 500px !important;}

.h100 {height: 100px !important;}
.h200 {height: 200px !important;}
.h300 {height: 300px !important;}
.h400 {height: 400px !important;}
.h500 {height: 500px !important;}

.mt2 {margin-top: 2px !important;}
.mt5 {margin-top: 5px !important;}
.mt8 {margin-top: 8px !important;}
.mt10 {margin-top: 10px !important;}
.mt12 {margin-top: 12px !important;}
.mt15 {margin-top: 15px !important;}
.mt20 {margin-top: 20px !important;}
.mt25 {margin-top: 25px !important;}
.mt30 {margin-top: 30px !important;}
.mt40 {margin-top: 40px !important;}
.mt50 {margin-top: 50px !important;}

.mb2 {margin-bottom: 2px !important;}
.mb5 {margin-bottom: 5px !important;}
.mb8 {margin-bottom: 8px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb12 {margin-bottom: 12px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb25 {margin-bottom: 25px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb40 {margin-bottom: 40px !important;}
.mb50 {margin-bottom: 50px !important;}

.ml2 {margin-left: 2px !important;}
.ml5 {margin-left: 5px !important;}
.ml8 {margin-left: 8px !important;}
.ml10 {margin-left: 10px !important;}
.ml12 {margin-left: 12px !important;}
.ml15 {margin-left: 15px !important;}
.ml20 {margin-left: 20px !important;}
.ml25 {margin-left: 25px !important;}
.ml30 {margin-left: 30px !important;}
.ml40 {margin-left: 40px !important;}
.ml50 {margin-left: 50px !important;}

.mr2 {margin-right: 2px !important;}
.mr5 {margin-right: 5px !important;}
.mr8 {margin-right: 8px !important;}
.mr10 {margin-right: 10px !important;}
.mr12 {margin-right: 12px !important;}
.mr15 {margin-right: 15px !important;}
.mr20 {margin-right: 20px !important;}
.mr25 {margin-right: 25px !important;}
.mr30 {margin-right: 30px !important;}
.mr40 {margin-right: 40px !important;}
.mr50 {margin-right: 50px !important;}

.p0 {padding: 0 !important;}
.p10 {padding: 10px !important;}
.p15 {padding: 15px !important;}
.p20 {padding: 20px !important;}
.p30 {padding: 30px !important;}
.p40 {padding: 40px !important;}
.p50 {padding: 50px !important;}
.p1em {padding: 1em !important;}

.pt3 {padding-top: 3px !important;}
.pt5 {padding-top: 5px !important;}
.pt10 {padding-top: 10px !important;}
.pt15 {padding-top: 15px !important;}
.pt20 {padding-top: 20px !important;}

.pb3 {padding-bottom: 3px !important;}
.pb5 {padding-bottom: 5px !important;}
.pb10 {padding-bottom: 10px !important;}
.pb15 {padding-bottom: 15px !important;}
.pb20 {padding-bottom: 20px !important;}

.pl3 {padding-left: 3px !important;}
.pl5 {padding-left: 5px !important;}
.pl6 {padding-left: 6px !important;}
.pl10 {padding-left: 10px !important;}
.pl15 {padding-left: 15px !important;}
.pl20 {padding-left: 20px !important;}

.pr3 {padding-right: 3px !important;}
.pr5 {padding-right: 5px !important;}
.pr6 {padding-right: 6px !important;}
.pr10 {padding-right: 10px !important;}
.pr15 {padding-right: 15px !important;}
.pr20 {padding-right: 20px !important;}

.t-left {text-align: left !important;}
.t-right {text-align: right !important;}
.t-center {text-align: center !important;}

.c-red {color: #d63434 !important;}
.c-blue {color: #0793e9 !important;}
.c-green {color: #40a23a !important;}
.c-orange {color: #f26c4f !important;}
.c-pupple {color: #9028b6 !important;}
.c-black {color: #262626 !important;}
.c-skyblue {color: #00a0e4 !important;}
.c-mint {color: #37b59c !important;}

.font12 {font-size: 12px !important;}
.font13 {font-size: 13px !important;}
.font14 {font-size: 14px !important;}
.font16 {font-size: 16px !important;}
.font18 {font-size: 18px !important;}
.font20 {font-size: 20px !important;}

/* 공통 */
/* 여백 */
.blank1{ height:50px;}
.blank2{ height:80px;}
.blank3{ height:150px;}
.blank4{ height:200px;}


html, body {font-size: 10px;}
@media screen and (max-width: 1000px){
  html, body {font-size: 8px;}
}


body {color: #000; background: #fff; line-height: 1; margin: 0; }

/* header */

.headerfixed{position: sticky; z-index: 1000000; width: 100%; background: #fff; top: 0;}
.header {position: relative; z-index: 3; background: #fff; height: 120px; width: 100%; max-width: 1800px; margin: 0 auto; text-align: right }
.btn-menu {display: none !important; width: 80px; height: 80px; background: url(../images/btn_menu.png) no-repeat center transparent;  position: fixed; top: 40px; right: 0; transition: none !important; border: 0; cursor: pointer;}

.header .h1 {position: absolute; left: 0; top: 50%; transform: translateY(-50%); z-index: 5;}
.header .h1 img {width: 220px;}
.nav-wrap {height: 100%; margin: 0; text-align: right; background: #fff; position: relative; z-index: 2; display: flex;}

/*.nav-wrap > ul + .box {display: block; height: 0; position: fixed; top: 90px; right: 0; width: 100%; z-index: 1; background: #f9f9f9; border-bottom: 0 solid #ddd; box-shadow: 0 5px 5px rgb(0 0 0 / 0%); transition: all .3s ease;}
.nav-wrap > ul.active + .box {height: 180px; box-shadow: 0 5px 5px rgb(0 0 0 / 8%); border-bottom: 1px solid #ddd; box-sizing: border-box;}*/
.nav-subbg {display: block; height: 0; position: absolute; top: 120px; right: 0; width: 100%; z-index: 2; background: #f9f9f9; border-bottom: 0 solid #ddd; box-shadow: 0 5px 5px rgb(0 0 0 / 0%); transition: all .3s ease;}
.nav-subbg.active {height: 180px; box-shadow: 0 5px 5px rgb(0 0 0 / 8%); border-bottom: 1px solid #ddd; box-sizing: border-box;}

.nav-wrap > ul {display: inline-block; margin:0 0 0 auto; font-size: 0; position: relative; z-index: 2; overflow: hidden; height: 100%; transition: height .3s ease; text-align: right; transform: translateX(-50px);}
.nav-wrap > ul.active {height: 300px;}
.nav-wrap > ul > li {display: inline-block; vertical-align: top;height: 100%;}
.nav-wrap > ul > li > a {color: #000; font-weight: 500; padding: 0 20px; display: block; font-size: 18px; width: 100%; height: 120px; line-height: 120px; text-align: center; letter-spacing: 0;}

.nav-wrap > ul > li > ul {padding: 20px 0; border-right: 1px solid #ededed; height: 100%; display: block; transition: all .3s ease;}
.nav-wrap > ul > li:first-child > ul {border-left: 1px solid #ededed;}		
.nav-wrap > ul > li > ul > li {line-height: 1; text-align: left; margin-bottom: 1px;}
.nav-wrap > ul > li > ul > li:first-child {margin-top: 5px;}
.nav-wrap > ul > li > ul > li:last-child {margin-bottom: 10px;}
.nav-wrap > ul > li > ul > li > a {font-size: 14px; font-weight: 300; line-height: 1.1; display: block; padding: 5px 15px;}
.nav-wrap > ul > li > ul > li > a:hover, .nav-wrap > ul > li > ul > li > a.active {color: #41a338 !important; font-weight: 500;}
.nav-wrap > ul > li > ul > li > ul {display: none; padding: 0 15px 8px 25px;}
.nav-wrap > ul > li > ul > li > ul > li {margin-bottom: 1px;}
.nav-wrap > ul > li > ul > li > ul > li > a {padding: 3px 0; display: block; font-size: 13px; font-weight: 300; color: #555; padding-left: 6px;}
.nav-wrap > ul > li > ul > li > ul > li > a::before {display: inline-block; content: '-'; margin-right: 3px; vertical-align: middle; color: #555; margin-left: -6px;}
.nav-wrap > ul > li:hover > a {color: #41a338; background: #fff; box-sizing: border-box; font-weight: 600;}
.nav-wrap > ul > li > a.active {color: #41a338; background: #fff;box-sizing: border-box; font-weight: 600;}
.nav-wrap > ul > li:hover > ul, .nav-wrap > ul > li.active > ul {background: #41a338; color: #fff;}
.nav-wrap > ul > li:hover > ul > li a {color: #fff;}
.nav-wrap > ul > li:hover > ul > li > a:hover {color: #fff000 !important; font-weight: 300;}
.nav-wrap > ul > li:hover > ul > li > a.active {color: #fff000 !important; font-weight: 400;}

.header .member {position: relative; display: flex; height: 100%; justify-content: center; align-items: center; display: none;}
.header .member > a {display: inline-block; height: 30px; line-height: 30px; font-size: 14px; letter-spacing: 0; padding: 0 10px;  font-weight: 300;}
.header .member > a strong {font-weight: 400; }
.header .member > select {display: inline-block; border: 0; font-size: 14px; color: #000;  letter-spacing: 0; cursor: pointer; font-weight: 300;}
.header .member > .header-search {display: inline-block; width: 115px; height: 35px; line-height: 35px; border-radius: 35px;  background: #eee; overflow: hidden; vertical-align: middle;}
.header .member > .header-search input#sch_stx {background: transparent !important; height: 35px !important; line-height: 34px; width: 75px !important; display: inline-block; border: 0; padding-left: 10px !important; box-sizing: border-box; font-size: 14px !important; color: #333 !important; border-radius: 30px 10px 10px 30px !important;}
.header .member > .header-search input:focus {outline: none;}
.header .member > .header-search button {width: 35px !important; height: 35px !important; border: 0 !important; vertical-align: top; background: transparent !important;}
.header .member > .header-search button > img { margin-top: -4px; vertical-align: middle;}

/* footer */
.footer-wrap {background: #3E3E3E;  color:#fff}
.footer-wrap .footer {   font-size: 0; display: flex; flex-direction: column;}
.footer-con01 {width: 100%;  display: inline-block; font-size: 16px; padding: 30px calc(max(3vw, 50vw - 750px)); border-bottom: 1px solid #fff;}
.footer-con01 > img {width: 100%; max-width: 220px;}
.footer-con01 > ul {}
.footer-con01 > ul li {display: inline-block; position: relative;}
.footer-con01 > ul li:nth-child(1)::after {content:''; position: absolute; right: -1px; top: 5px; width: 1px; height: 10px;  background: #999}
.footer-con01 > ul li:nth-child(1){padding-right: 10px;}
.footer-con01 > ul li:nth-child(2){padding-left: 10px;}
.footer-con01 > ul li a {font-size: .875em; color: #fff;}
.footer-con02 {display: flex; font-size: 1.5rem; color: #fff; width: 100%; padding: 45px calc(max(3vw, 50vw - 750px)); gap: 5vw; align-items: flex-start;}
.footer-con02 .copyright{margin-top: 30px;}
.footer-con02 img{max-height: 66px; }
.footer-con02 p {display: block; }
.footer-con02 ul {margin: 10px 0;}
.footer-con02 ul li {font-size: .925em; font-weight: 300; display: inline-block; letter-spacing: 0; padding: 0 20px 0 0; position: relative;}
.footer-con02 ul li::after {content:''; position: absolute; right: 8px; top: 0; width: 1px; height: 12px; background: #999}
.footer-con02 ul li:last-child::after {display: none;}

/* button */
button[type=button], input[type=submit] input[type=button] {cursor: pointer; transition: all .2s;}
button[type=button]:hover, input[type=submit]:hover, input[type=button]:hover {opacity: .9;}
button[type=button]:hover.slick-next, button[type=button]:disabled.slick-next, button[type=button]:active.slick-next, button[type=button]:focus.slick-next {background: url(../images/subpoint_r.svg) no-repeat center center;}
button[type=button]:hover.slick-prev, button[type=button]:disabled.slick-prev, button[type=button]:active.slick-prev, button[type=button]:focus.slick-prev  {background: url(../images/subpoint_l.svg) no-repeat center center;}
button[type=button]:disabled, input[type=submit]:disabled, input[type=button]:disabled {opacity: .2; color: rgba(255,255,255,.7); cursor: default;}
.btn i {margin: -1px 5px 0 -5px;}
.btn i img {vertical-align: middle; width: 17px; height: 17px;}
.btn-round {border-radius: 60px !important;}
.btn-small {height: 24px; line-height: 24px; padding: 0 1em; font-size: 13px; box-shadow: inset 0px -12px 0 0 rgba(0,0,0,0.1);}
.btn-medium {height: 28px; line-height: 28px; padding: 0 1em; font-size: 14px; box-shadow: inset 0px -14px 0 0 rgba(0,0,0,0.1);}
.btn-nogra {box-shadow: none !important;}
.btn-red {background: #d63434 !important;}
.btn-blue {background: #0793e9 !important;}
.btn-green {background: #58a000 !important;}
.btn-mint {background: #00c1b6 !important;}
.btn-orange {background: #ff8400 !important;}
.btn-gray {background: #96a2b0 !important;}
.btn-darkred {background: #871717 !important;}
.btn-darkblue {background: #085f98 !important;}
.btn-darkgreen {background: #2e7300 !important;}
.btn-darkgray {background: #52585f !important;}
.btn-black {background: #333 !important; color: #fff !important; box-shadow: inset 0px -17px 0 0 rgba(0,0,0,.5) !important;}
.btn-white {background: #fff !important; border: 1px solid #96a2b0 !important; color: #333 !important; font-weight: 500 !important;}
.btn-search {border: 0; display: inline-block; border-radius: 3px; vertical-align: middle; height: 28px; line-height: 28px; width: 28px; background: url(../images/icon_search_w.png) no-repeat 50% 55% /55% 55% #96a2b0; box-shadow: inset 0px -17px 0 0 rgba(0,0,0,0.1);}

/* pop */
.pop {position:fixed; top: 0; left: 0; width: 100%; height: 100%; text-align: center; z-index: 100; display: none; background: rgba(0,0,0,.7);}
.pop .pop-inner {display: inline-block; vertical-align: middle; margin: 0; background: transparent; height: auto; position: relative; width: 80%; max-width: 1000px;}
.pop::after {content: ''; width: 0; height: 100%; display: inline-block; vertical-align: middle;}
.pop .btn-close {width: 24px; height: 24px; padding: 0px; background: url(../images/btn_close_wh.png) no-repeat transparent; background-size: 100% auto; border: 0; cursor: pointer; font-size: .7em; position: absolute; right: 15px; top: 0;}
.pop-wrap { width: 100%; padding: 3em 0; font-size: 1em;}

/* video */

/* main */
.main-visual {width: 100%; margin: 0px auto; padding: 0; box-sizing: border-box; position: relative; overflow: hidden; z-index: 1; transition: height .3s ease; height: 850px;}
.main-visual .main-swiper {width: 100%; height: 100%;}
.main-visual .main-swiper .swiper-wrapper {width: 100%; height: 100%;}
.main-visual .main-swiper .swiper-wrapper .swiper-slide {background-position: center top; background-repeat: no-repeat; background-size: cover; width: 100%; height: 100%;}
.main-visual .swiper-navigation {position: absolute; top: 45%; width: 100%; left: 0; z-index: 3;}
.main-visual .swiper-button-prev, .main-visual .swiper-button-next {background-size: auto; width: 60px; height: 60px; top: 0; background-color: rgba(255,255,255,.3); }
.main-visual .swiper-button-prev:hover, .main-visual .swiper-button-next:hover { background-color: rgba(255,255,255,.5);}
.main-visual .swiper-button-prev {background-image: url(../images/icon_mainslider_prev.png);}
.main-visual .swiper-button-next {background-image: url(../images/icon_mainslider_next.png);}
.main-visual .swiper-pagination-bullet {width: 20px; height: 20px; text-align: center; line-height: 20px; font-size: 14px; color: rgba(255,255,255,.3); background: none; font-family: 'GmarketSans';  letter-spacing: 0; font-weight: 400;}
.main-visual .swiper-pagination-bullet-active {color: rgba(255,255,255,1); border: 0; font-weight: 600;}
.main-visual .swiper-pagination-bullet::before {content: '0'}
.main-visual .swiper-pagination-fraction, .main-visual .swiper-pagination-custom, .main-visual .swiper-container-horizontal>.swiper-pagination-bullets {bottom: 30px;}
.main-visual .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 10px;}
.main-visual .swiper-button-next, .main-visual .swiper-container-rtl .swiper-button-prev {right: 0;}
.main-visual .swiper-button-prev, .main-visual .swiper-container-rtl .swiper-button-next {left: 0;}
.main-visual .main-text {position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; z-index: 2;color: #fff; text-align: center;}
.main-visual .main-text > img {max-width: 300px; display: block; margin: 0 auto 25px; transition: width .3s ease-in-out;}
.main-visual .main-text > p {font-size: 1.8rem; line-height: 1.5; font-weight: 400; margin-top: 20px;}
.main-visual .main-text > p > b {font-weight: 600;}
.main-visual .main-list {display:none;position: absolute; left: calc(50% - 600px); bottom: 60px; z-index: 2; width: 1200px; font-size: 0; background: rgba(255,255,255,1);  border-top-right-radius: 85px; border-bottom-left-radius: 85px; overflow: hidden;}
.main-visual .main-list > li {display: inline-block; width: 20%; text-align: center; border-right: 1px solid #f1f1f1; box-sizing: border-box; vertical-align: top;}
.main-visual .main-list > li:last-child {border-right: 0;}
.main-visual .main-list > li a {font-size: 17px; font-weight: 500; color: #000; display: block; padding: 30px 0 40px;  box-sizing: border-box; letter-spacing: 0; }
.main-visual .main-list > li a img {display: block; margin: 0 auto; transition: all .3s ease-in-out;}
.main-visual .main-list > li a:hover {color: #ff7620; transition: all .3s ease-in-out;}
.main-visual .main-list > li a:hover img {transform: scale(1.05);}
.up-on-scroll {transition: transform .7s, opacity 1s;}
.main-content {width: 100%; overflow:hidden; }

.main-content h2 {font-size: 4rem; color: #909090; font-weight: 500; position: relative; padding: 0;}
.main-content h2.right{text-align: right;}
.main-content h2.white{color: #fff;}
.main-content h2.white .comment1{color: #fff;}
.main-content .comment1 {font-size: 5.2rem; color: #0A8E39; font-weight: 800; line-height: 1.3; margin-top: 15px; letter-spacing: -0.1vw;}
.main-content .comment2 {font-size: 1.25em; line-height: 1.4; color: #6f6f6f; font-weight: 400; margin: 2.5em 0; }
.main-product {width: 100%;  max-width: 1500px; margin: 0 auto;}
.main-product.full{max-width: none; padding: 0 2.08vw; height:39.58vw;}
.main-product > ul {font-size: 0; margin-top: 30px; gap: .26vw; display: flex; height: 100%;}

.main-product > ul li {position: relative; flex: 1 1 0%; font-size: 16px; vertical-align: top; text-align: center; border-radius: 1.25vw; box-shadow: 10px 20px 20px rgba(0,0,0,.15); overflow: hidden; height: 100%; transition: all .5s ease; padding: 20px 0;}
.main-product .logos{height: 3vw;}
.main-product > ul li:nth-child(1) {background-image: url(../images/main1.jpg); background-size: cover; background-position: center;}
.main-product > ul li:nth-child(2) {background-image: url(../images/main2.jpg); background-size: cover; background-position: center;}
.main-product > ul li:nth-child(3) {background-image: url(../images/main3.jpg); background-size: cover; background-position: center;}
.main-product > ul li:nth-child(4) {background-image: url(../images/main4.jpg); background-size: cover; background-position: center;}

.main-product > ul li:nth-child(1):hover {flex: 6.5 1 0%;}
.main-product > ul li:nth-child(2):hover {flex: 6.5 1 0%;}
.main-product > ul li:nth-child(3):hover {flex: 6.5 1 0%;}
.main-product > ul li:nth-child(4):hover {flex: 6.5 1 0%;}

.main-product > ul li a {color: #fff; display: block;}
.main-product > ul li a span {font-family: 'GmarketSans'; font-size: 1.25em; margin-top: 2em; display: block;}
.main-product > ul li a h3 {text-align: left; position: relative; max-width: 10vw; font-size: 1vw; border: 3px solid #5CA545; display: block;  border-radius: 40px; background-color: #fff; color: #000; padding: 1vw 1.5vw; font-weight: 700; }
.main-product > ul li a h3 img{height: 1vw; position: absolute; right: 1.5vw;}
.main-product > ul li a p {font-size: 2.5vw; font-weight: 700; line-height: 1.3; display: block; white-space: nowrap; margin-bottom: 2.6vw;}

.displaynone{display : none;}
.mainbox{position: relative;}
.mainbox a{opacity: 1; transition: 0.5s all;  text-align: left; height: 100%;}
.mainbox a div{position: absolute; bottom: 2.6vw; left: 2.6vw;}
.mainbox a .logos{position: absolute; top: 2.6vw; left: 2.6vw;}
.mainbox a.opacity0{opacity: 0; transition: 0.5s all;}


@media screen and (max-width:1050px) {
  .main-product > ul li a p{font-size: 2.3vw;}
  .mainbox a div{width: 100%;}
  .main-product > ul li a h3{font-size: 1vw; width: 100%; max-width: 15vw;}
  .main-product > ul li a h3 img{height: 1vw;}
  }
  
  @media screen and (max-width:600px) {
  .main-product > ul{flex-direction: column;}
  .main-product.full{height: auto;}
  .main-product > ul li a p{font-size: 8vw; }
  .main-product > ul li a h3{font-size: 3.5vw; width: 100%; max-width: 30vw; padding: 1.5vw 3vw;}
  .main-product > ul li a h3 img{height: 3.7vw; right: 3vw;}
  .main-product > ul li{min-height: 70vw;}
  .mainbox a div{bottom: 5vw; left: 5vw;}
  .mainbox a .logos{top: 5vw; left: 5vw; height: 10vw;}
  }


.main-rnd {padding: 10em 0; position: relative;}
.main-rnd > div {max-width: 1500px;font-size: 0; }
.main-rnd > div > img {display: inline-block; width: 100%; }
.main-rnd > div > div {display: inline-block; font-size: 16px; vertical-align: top; box-sizing: border-box;}
.main-rnd > div > div ul li { display: block; font-size: 1.25em; color: #000; font-weight: 500; margin-bottom: 1vw;}
.main-rnd > div > div ul li img {margin-right: 15px;}
.main-etc { padding: 30px 0; z-index: 1; position: relative;}
.main-etc > div {width:100%;padding: 0 2.08vw; max-width: calc(1500px + 4.16vw); margin: 0 auto; font-size: 0; position: relative;}
.main-board {display: inline-block; width: calc(45% - 40px); margin-right: 40px; font-size: 16px; vertical-align: top;}
.main-board h2 {font-size: 1.5625em; position: relative; margin-bottom: 1em;}
.main-board h2 > a {position: absolute; right: 0; top: 0;}
.main-notice {margin-top: 2em;}
.main-notice ul li {font-size: 1.0625em; margin-bottom: 1em;}
.main-notice ul li a {width: calc(100% - 100px); margin-right: 10px; display: inline-block; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden; color: #000; vertical-align: middle;}
.main-notice ul li a:hover {color: #ea5b05;}
.main-notice ul li span {width: 80px; display: inline-block; color: #aaa; font-size: .9375em; font-weight: 300;}
.main-video {margin-top: 5em;}
.main-video ul li {width: 48%; position: relative;}
.main-video ul li a:hover::after {content:''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(59,175,149,.5); }
.main-video ul li img {width: 100%;}
.main-video ul li:nth-child(1) {float: left;}
.main-video ul li:nth-child(2) {float: right;}
.main-quick {display: inline-block; width: calc(55% - 40px); margin-left: 40px; font-size: 16px; vertical-align: top;}
.main-quick > div {width: 100%;text-align: center; color: #fff; padding: 3em 0;}
.main-quick > div > p {display: block; width: 90%; margin: 0 auto; font-size: 1.0625em; line-height: 1.4; word-break: keep-all;}
.main-quick > div > a {display: block; background: #fff; height: 50px; line-height: 50px; border-radius: 25px; width: 50%; max-width: 170px; margin: 1em auto 0; font-size: 1.125em; font-weight: 600; transition: all .3s ease-in-out;}
.main-quick > div > a img {margin-top: -4px; margin-right: 5px;}
.main-quick > div > a:hover {transform: scale(1.05); box-shadow: 5px 5px 10px rgba(0,0,0,.2);}
.main-quick > div:nth-child(1) { background: #39af98; margin-bottom: 2em;}
.main-quick > div:nth-child(2) { background: #e79c26;}
.main-quick > div:nth-child(1) > a {color: #39af98}
.main-quick > div:nth-child(2) > a {color: #e79c26}

/* sub common */
.sub-visual {background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; width: 100%; height: 300px; overflow: hidden; display:table; position:relative;}
.sub01 {background-image: url(../images/img_subvisual01.jpg);}
.sub02 {background-image: url(../images/img_subvisual02.jpg);}
.sub03 {background-image: url(../images/img_subvisual03.jpg);}
.sub04 {background-image: url(../images/img_subvisual04.jpg);}
.sub05 {background-image: url(../images/img_subvisual05.jpg);}
.sub06 {background-image: url(../images/img_subvisual06.jpg);}

.sub-visual > div {display:table-cell;vertical-align:middle;}
.sub-visual > div > h2 { text-align: center; font-family: 'GmarketSans'; font-size: 3.125em; letter-spacing: 0; color: #fff;}
.sub-gnb {height: 60px; border-bottom: 1px solid #ddd; box-sizing:border-box ;}
.sub-gnb-container {max-width: 1200px; margin: 0 auto; font-size: 14px; color: #666; background: #fff; line-height: 1.5em; padding: 0; height: 100%; position: relative; z-index: 2;}
.sub-gnb-list {display: inline-block; height: 100%; font-size: 0; float: left; width: 100%;}
.sub-gnb-list > li {display: inline-block; vertical-align: top; border-right: 1px solid #ddd; height: 100%; font-size: 1rem; width: 250px; cursor: pointer; box-sizing: border-box;}
.sub-gnb-list > li:first-child {width: 50px; border-left: 1px solid #ddd;}
.sub-gnb-list > li:first-child a {background: none; box-shadow: none !important; border: none !important;}
.sub-gnb-list > li img {width: 13px; margin: -4px 0 0 0;}
.sub-gnb-list > li > a {display: block; width: 100%; height: 100%; padding: 0 1em; text-align: left; box-sizing: border-box; line-height: 58px; color: #333; font-weight: 300; background: url(../images/icon_select2.png) no-repeat 95% 50%; white-space: nowrap; overflow: hidden;}
.sub-gnb-list > li:hover > a { background: url(../images/icon_select2.png) no-repeat 95% 50% #f9f9f9;}
.sub-gnb-list > li:nth-child(1):hover > a { background:#f9f9f9;}
.sub-gnb-list li .depth {background: #fff; border: 1px solid #ddd;box-sizing: border-box; visibility: hidden; opacity: 0; transition: opacity .5s;  box-sizing: border-box;}
.sub-gnb-list li:hover .depth {visibility: visible; opacity: 1;}
.sub-gnb-list li .depth li {display: block;}
.sub-gnb-list li .depth li a {display: block; box-sizing: border-box; padding: .3em 1em; color: #555; font-weight: 300; font-size: .9em;}
.sub-gnb-list li .depth li a:hover {background: rgba(0,0,0,.05); color: #333; font-weight: 400;}
.sub-gnb-list li .depth li a.active {background: #ddd; color: #fff;}
.sub-content {width: 100%; max-width: 1500px; word-break: keep-all;  justify-content: space-between; }
.sub-content.me1_1{display: flex;}
.sub-content .ceo-message{width: 35%;}
@media screen and (max-width:1540px) {
  .sub-content.me1_1{flex-direction: column-reverse;}
  .sub-content .ceo-message{width: 100%; text-align: center;}
  .sub-content .ceo-message img{max-width: 413px;}
}
.sub-content h3 {text-align: center; font-size: 2.625em; color: #262626; margin: 2em 0; display: block; font-family: 'GmarketSans'; }
.sub-content h4 {text-align: left; font-size: 2.6rem; color: #262626; margin: 3em 0 1em; display: block; font-family: 'GmarketSans'; position: relative; padding-left:55px; text-transform: uppercase;}
.sub-content h4::before {content: '';display: inline-block;line-height:3rem; position: absolute; left: 6px; top:0; transform: translateY(-50%); width: 39px; height: 39px; overflow: visible; background: url(../images/bullet01.svg) 0 0 no-repeat;}
.sub-content h5 {text-align: left; font-size: 1.3em; color: #262626; margin: 2em 0 1em; position: relative; padding-left: 15px;}
.sub-content h5::before {content:''; position: absolute; left: 0; top: 9px; width: 5px; height: 5px; background: #262626;}
.img_pc {display: block; width: 100%;}
.img_m {display: none; width: 100%;}
.tab_menu{width: 100%; display: flex; gap:12px; flex-direction: row; margin-bottom: 2em; align-items: center;}
.tab_menu ul {position: relative; width: 100%;}
.tab_menu li{float: left; width: 50%; display: block; padding: .5px; box-sizing: border-box;}
.tab_menu ul.w3 li {width: 300px;height:60px; }
.tab_menu ul.w4 li {width: 25%;}
.tab_menu ul.w5 li {width: 20%;}
.tab_menu ul.w6 li {width: 16.6%;}
.tab_menu li a{width: 100%; display: block; text-align: center; padding: 30px 0; color: #fff; font-size: 2.6rem ; font-weight: 400; background: #ccc; box-sizing: border-box; letter-spacing: 0; border-radius: 20px 0px;
  background: #C0C0C0;}
.tab_menu li a:hover, .tab_menu li.current a, .tab_menu2 li.current a { background-color: #329D37; }
.tab_menu li ul{display: none}
.tab_menu li.current ul {display: block; clear: both; width: 768px; background: #898989; position: absolute; left: 0;}
.tab_menu li.current ul li{width: auto;padding: 0 10px;}
.tab_menu li.current ul li a{width: auto; background: #898989; border: 1px solid #898989;}
.tab_menu li.current ul li.current a {color: #000;}

/* 서브 탭 메뉴 */
.tab_wr{
  width:100%; display: flex; align-items: center; flex-direction: row; gap:12px; justify-content: center; margin-bottom:40px;
}
.tab_wr li{ cursor: pointer;;
  width: 280px; height:auto; padding:20px 0; text-align: center; border-radius: 20px 0px; background: #C0C0C0; font-size: 2rem; font-weight: 700; color:#fff;
}

.tab_wr li:hover{
  background-color:#329D37;
}

.tab_wr li.active{
  background-color:#329D37;
}



/* table */
.tbl-basic {border-collapse: collapse; border: 0; padding: 0; margin: 0 0 1em; border-top: 2px solid #353143; border-bottom: 1px solid #bbbbbb; width: 100%; background:#fff; font-size: 1.6rem;}
.tbl-basic th {background: #f2f4f7; color: #333; font-weight: 400; letter-spacing: -0.1em; border-right: 1px solid #e2e3e5; vertical-align: middle; padding: .7em 1em; border-bottom: 1px solid #bbbbbb;}
.tbl-basic .titbg {background: #e4f3fb !important;}
.tbl-basic .whitebg {background: #fff !important;}
.tbl-basic .whitebg2 {background: #fafafa !important;}
.tbl-basic tbody tr:nth-child(1) {border-top: 0;}
.tbl-basic tbody th { border-right: 1px solid #ebeced; border-bottom: 1px solid #dadbdd; line-height: 1.4;}
.tbl-basic td {background: #fff; color: #666; border-right: 1px solid #ebeced; border-bottom: 1px solid #dadbdd; vertical-align: middle; text-align: left; padding: .4em .6em; line-height: 1.4;}
.tbl-basic td.sl {white-space: nowrap;}
.tbl-basic td.whitebg {background: #fff !important;}
.tbl-basic td a:hover {color: #3f83e4;}
.tbl-basic th:last-child, .tbl-basic td:last-child {border-right: 0;}
.tbl-basic tbody tr:last-child td, .tbl-basic tbody tr:last-child th {border-bottom: 0;}
.tbl_list {border: 0; border-collapse: collapse; margin: 0; padding: 0; width: 100%; table-layout: fixed; border-top: 2px solid #262626;}
.tbl_list caption {font-size: 1.5em; margin: 0 }
.tbl_list tr {border-bottom: 1px solid #e5e5e5; padding: .35em; }
.tbl_list thead th {background: #f4f4f4; color: #262626; }
.tbl_list th, .tbl_list td {padding: 1em .625em; text-align: center; font-size: 1em; vertical-align: middle; letter-spacing: 0;}
.tbl_list th {font-weight: 500; text-align: center;}
.tbl_list td {color: #666; font-size: 1em; letter-spacing: -.04em; font-weight: 300; line-height: 1.4;}
.tbl_list td a {color: #666; display: inline-block;}
.tbl_list td a:hover {color: #ea5b05; text-decoration: underline;}
.tbl_list tr:hover td {background: #f9f9f9;}
.tbl_list .title {width: 45%}
.tbl_view { border-collapse: collapse; margin: 0; padding: 0; width: 100%;  border-top: 2px solid #262626; background: #fff;}
.tbl_view thead th {padding: 1em; text-align: left; font-size: 1em; color: #262626; background: #f9f9f9; border-bottom: 1px solid #e5e5e5; line-height: 1.4;}
.tbl_view tbody th {padding: 1em; text-align: left; font-size: 1em; color: #262626; border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; vertical-align: middle; width: 100px;}
.tbl_view tbody td {padding: 1em; text-align: left; font-size: 1em; color: #666; border-bottom: 1px solid #e5e5e5; line-height: 1.4; letter-spacing: 0;}
.tbl_view .tbl_img {width: 100%; max-width: 1100px;}
.tbl_view .tbl_content {padding: 30px !important;}
.tbl_view .file_download a:hover {text-decoration: underline; color: #329D37; }
.tbl_view .file_download span { display: inline-block; margin-left: 5px; font-size: .95em; color: #666;}
.tbl_view .file_download b {display: inline-block; font-size: .8em; font-weight: 500; color: #999;}
.tbl_nav {border-top: 1px solid #ddd; background: #fff; text-align: left;}
.search-warp {background: #f9f9f9; padding: 20px; font-size: 0; margin: 30px 0;}
.search-warp > select {font-size: 18px; height: 45px; line-height: 45px; display: inline-block; width: calc(30% - 10px); border: 1px solid #dddddd; box-sizing: border-box; vertical-align: top; padding: 0 20px; margin-right: 10px; background: url(../images/icon_select.jpg) calc(100% - 15px) 50% no-repeat #ffffff;;}
.search-warp > input {font-size: 18px; height: 45px; line-height: 45px; display: inline-block; width: calc(55% - 10px); border: 1px solid #dddddd; box-sizing: border-box; vertical-align: top; padding: 0 20px; margin-right: 10px; }
.search-warp > button {font-size: 18px; height: 45px; line-height: 45px; display: inline-block; width: 15%; border: 0; vertical-align: top; background: #41a338; color: #fff;}


@media screen and (max-width:422px) {
  .tbl-basic tbody th{padding: 0.4em;}
  .tbl-basic td{padding: 0.4em;}
}

/* page */
.page {text-align: center; margin: 30px 0;}
.page li {display: inline-block; vertical-align: top;}
.page li a {display: block; width: 40px; height: 40px; line-height: 38px; padding: 0; text-decoration: none; color: #333; background: #fff; font-size: 1em; box-sizing: border-box;  margin: 0; cursor: pointer; border: 1px solid #e1e1e1; border-radius: 100%;}
.page li a:hover, .page li a.active {display: inline-block; width: 40px; height: 40px; line-height: 38px; padding: 0; background: #41a338; color: #fff; box-sizing: border-box; vertical-align: bottom; margin: 0; border: 1px solid #41a338;}
.page li img {vertical-align: middle; margin-top: -4px;}
.page li a.img {border: 1px solid #e1e1e1;}
.page li a.img:hover {background: #f6f6f6;}

/* sub01-01*/
.ceo-message {width: 100%; position: relative;}
.ceo-message img {width: 100%;margin }
.ceo-text { margin-top: 2em; text-align:left }
.ceo-text>div {margin-bottom: 100px; line-height: 1.5; color: #222; font-weight: 500; font-size: 2rem; text-align: left;}
.ceo-text>div:first-child span{color:#40a23a; font-family: 'Paperlogy';font-weight: 700; }
.ceo-text div p {font-family: 'Paperlogy'; font-size: 3.5rem; font-weight: 700; color:#000; text-align: left; letter-spacing: -1px; line-height: 1.2;}
.ceo-text div div span { color:#40a23a;}
.ceo-text .ceo_sign{ display:flex; justify-content: space-between; flex-direction: column; font-size:2rem; max-width: 800px; margin: 0 auto;}
.ceo-text .ceo_sign img{width: 250px;}
.ceo-text .ceo_sign>div{font-size:2.4rem; font-weight: 700; display: flex; align-items: center; gap: 20px;}
.ceo-text .ceo_sign .sign{ width:166px; height:auto; }
.ceo-text .ceo .name{font-size:2rem; font-weight: 500; color: #A1A1A1; font-family: 'pretendard';}

@media screen and (max-width:1540px){
  .ceo-text div p, .ceo-text div{text-align: center;}
  .ceo-text .ceo_sign{max-width: none; justify-content: center; align-items: center;}
}

@media screen and (max-width:600px) {
  .ceo-text .ceo_sign{flex-direction: column; align-items: center;}

}


/* sub01-02 */
.company01 {width: 100%; display:flex; flex-direction: column; /*background: url(../images/img_sub0103.jpg) 0 0 no-repeat; */margin: 2em 0 0; justify-content: center; align-items: center;}
.company01>img{ width:100%; border-radius: 60px 0 60px 0; }
.company01 p {/*font-size: 2.5em; line-height: 1.4; color: #262626; font-weight: 600; margin: 0 0 1em;*/}
.company01 .green{font-weight: 600; color:#059646;}
.company01-1{position: absolute; text-align: center; line-height: 1.3;}

.company01-1, .company01-1 span{font-size: 4.2rem; font-family: 'paperlogy'; font-weight: 700; color: #fff; }
.company01-1 p{font-family: 'pretendard'; font-size: 2.4rem; margin-top: 20px;}
.company01-1 span{color: #94E34F;}

.sub0102-list {width: 100%; font-size: 0; display: flex; flex-direction:row; gap:20px;}
.sub0102-list li {font-size: 22px; text-align: center; color: #fff; position:relative;}
.sub0102-list li p{ position:absolute; top:50%; left:50%; transform: translate(-50%, -50%);word-break: keep-all; line-height: 1.5;}
/*.sub0102-list li:nth-child(1) {background: url(../images/sub1_2_1.png) center no-repeat;}
.sub0102-list li:nth-child(2) {background: url(../images/sub1_2_2.png) center no-repeat;}
.sub0102-list li:nth-child(3) {background: url(../images/sub1_2_3.png) center no-repeat;}
.sub0102-list li:nth-child(4) {background: url(../images/sub1_2_4.png) center no-repeat;}*/
.account-tt {font-size: 2.5em; font-weight: 400; line-height: 1.4; text-align: center; margin: 1em 0;}
.img010202 {width: 100%; max-width: 758px; margin: 0 auto; display: block;}
.account-list {font-size: 0}
.account-list li {width: calc(20% - 10px); border: 1px solid #ddd; box-sizing: border-box; padding: 1em; margin: 5px; font-size: 18px; display: inline-block; text-align: center; color: #262626; font-weight: 300;}
.sub0102-list li img{width: 100%;}
.sub0103-list img{width: 100%;}

@media screen and (max-width:720px) {
  .sub0102-list{display: grid; grid-template-columns: repeat(2, 1fr);}
  .company01-1, .company01-1 span{
    font-size:3.4rem;
  }
  .company01-1 p {
    font-size:1.6rem;
  }
}

@media screen and (max-width:500px) {
  .company01-1, .company01-1 span{
    font-size:2.4rem;
  }
  .company01-1 p {
    font-size:1.2rem;
  }
} 

/* sub01-03 */
.ci-text {position: relative; padding: 2.5em 1em 2.5em 350px; background: url(../images/icon_logo.png) 2em 3.5em no-repeat #f9f9f9; font-size: 1.25em;}
.ci-text::before {content:''; width: 100%; height: 8px; background: linear-gradient(90deg, rgba(115,178,84,1) 0%, rgba(57,175,152,1) 100%); position: absolute; left: 0; top: 0;}
.ci-text dl dt {font-size: 1.25em; color: #262626; font-weight: 600; line-height: 1; margin-bottom: .5em; margin-top: 1em;}
.ci-text dl dd { font-size: 1em; color: #666; font-weight: 300; line-height: 1.4;}
.ci-tt {text-align: center; font-size: 1.625em; font-weight: 600; color: #41a338; margin: 2em 0; display: block; font-family: 'GmarketSans'; position: relative;}
.visivon-img {display: block; margin: 2em auto; width: 100%; max-width: 520px;}
.vision-list {text-align: center; font-size: 0; margin: 50px 0 0;}
.vision-list li {display: inline-block; margin: 0 auto 1em; font-size: 16px; width: 20%; vertical-align: top}
.vision-list li div {margin: 0 auto 1em; background: #009944; width: 110px; height: 110px; border-radius: 100%; box-shadow: 5px 5px 0 rgba(0,0,0, .1);}
.vision-list li div img {margin-top: 22px;}
.vision-list li:nth-child(even) div {background: #7dba46 !important;}
.vision-list li p {display: block; color: #666; line-height: 1.4; font-weight: 300; padding: 0 10px}
.vision-list li p b {display: block; margin: 0 auto 10px; font-weight: 600;  font-family: 'GmarketSans'; font-size: 1.25em; color: #262626; line-height: 1.2;}


.sub0103-list > ul {width: 90%; margin: 0 auto; border-top: 1px solid #ddd; padding: 50px 0;}
.sub0103-list li {display: inline-block; width: calc(25% - 20px); height: 250px; margin: 10px 10px 50px;  padding: 1em; transition: all .3s ease;}
.sub0103-list li div {width: 100%; height: 100%; border-top-right-radius: 15px; border-bottom-left-radius: 15px; overflow: hidden; display:table; position:relative;  box-sizing: border-box; }
.sub0103-list li div > div { display: table-cell; vertical-align: middle; border-top-right-radius: 0; border-bottom-left-radius: 0;}
.sub0103-list li div > div > img {display: block; margin: 0 auto; width: 70%; max-width: 224px;}
.sub0103-list li p {font-size: 16px; color: #262626;  line-height: 1.4; text-align: center; font-weight: 600; display: block; margin: .5em 0;}
.sub0103-list.ci-list .type-h {background: #fff; border: 1px solid #eee;}
.sub0103-list.ci-list .type-a {background: #fff; border: 1px solid #eee;}
.sub0103-list.ci-list .type-b {background: #069646;}
.sub0103-list.ci-list .type-c {background: #58585a;}
.sub0103-list.ci-list .type-d {background: #d1d2d4;}
.sub0103-list.ci-list .type-e {background: #a8a9ad;}
.sub0103-list.ci-list .type-f {background: #818286;}
.sub0103-list.ci-list .type-g {background: #231f20;}

.bi-text01 {background: url(../images/icon_biocan.png) 5em 3.5em no-repeat #f9f9f9 !important;}
.sub0103-list.bi-list-01 div > div > img {max-width: 150px !important;}
.sub0103-list.bi-list-01 .type-a {background: #fff; border: 1px solid #eee;}
.sub0103-list.bi-list-01 .type-b {background: #fff; border: 1px solid #eee;}
.sub0103-list.bi-list-01 .type-c {background: #7fba42;}
.sub0103-list.bi-list-01 .type-d {background: #009347;}
.sub0103-list.bi-list-01 .type-e {background: #49494a;}
.sub0103-list.bi-list-01 .type-f {background: #231f20;}

.bi-text02 {background: url(../images/icon_pruday.png) 5em 3.5em no-repeat #f9f9f9 !important; margin-top: 50px;}
.sub0103-list.bi-list-02 div > div > img {max-width: 150px !important;}
.sub0103-list.bi-list-02 .type-a {background: #fff; border: 1px solid #eee;}
.sub0103-list.bi-list-02 .type-b {background: #fff; border: 1px solid #eee;}
.sub0103-list.bi-list-02 .type-c {background: #129c8d;}
.sub0103-list.bi-list-02 .type-d {background: #7dbb42;}
.sub0103-list.bi-list-02 .type-e {background: #49494a;}
.sub0103-list.bi-list-02 .type-f {background: #231f20;}


.bi-text03 {background: url(../images/icon_greensoon.png) 6em 3.5em no-repeat #f9f9f9 !important; margin-top: 50px;}
.sub0103-list.bi-list-03 div > div > img {max-width: 150px !important;}
.sub0103-list.bi-list-03 .type-a {background: #fff; border: 1px solid #eee;}
.sub0103-list.bi-list-03 .type-b {background: #fff; border: 1px solid #eee;}
.sub0103-list.bi-list-03 .type-c {background: #129c8d;}
.sub0103-list.bi-list-03 .type-d {background: #7dbb42;}
.sub0103-list.bi-list-03 .type-e {background: #49494a;}
.sub0103-list.bi-list-03 .type-f {background: #231f20;}


/*비전 및 ci*/
.con_wr .sub_title{  display:block; color: #000; font-size: 3.2rem; font-weight: 600;}
.sub_title.white{color: #fff; font-size: 7.2rem;}
.vision{
 padding:30px 0;display: flex; align-items: center; justify-content: center; color: #fff;
  font-size:2.4rem; font-weight:700; padding-bottom: 100px;}

.visiontab{padding: 50px 0; position: relative; background-color: transparent;}
.visiontab::before{background: url(../images/vision.jpg); content: ''; z-index: -1; height: 100%; display: block; position: absolute; left: min(0px, calc(750px - 50vw)); top:0; right: min(0px, calc(750px - 50vw)); background-size: cover; background-repeat: no-repeat; background-attachment: fixed; background-position: 50%;}

.visiontab .ellipse{position: absolute;width: 100%; aspect-ratio: 1 / 1;  object-fit: contain; z-index: 0; top: 0; left: 0;}
.mission_con_wr{width:100%; display: flex; justify-content: center; align-items: flex-start; gap:20px; margin:80px auto;}

.mision{width: 100%; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap:20px; text-align: center;}
@media screen and (max-width : 1240px) {
  .mission_con_wr{flex-wrap: wrap;}
  .mision{width: 23%;}
}
@media screen and (max-width : 1000px) {
  .mision{width: 30%;}
}
@media screen and (max-width : 800px) {
  .mision{width: 40%;}
}
.mision div{position: relative;  width: 100%;aspect-ratio: 1 / 1; display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 10px;}
.mision div img, .mision div p{z-index: 1;}
.mision div img.ellipse{z-index: -1;}
.mision img:nth-child(1){z-index: 1;}
.mision p{  font-size: 1.6rem; line-height: 1.25; z-index: 1;}
.mision>p{color: #fff;}
.mision p b{  font-size: 3rem; font-weight: 700;}
.ci_wr{  display: flex; align-items: center; column-gap: 80px; margin: 0 auto; justify-content: center;}
.ci_wr img{  height:auto;}
.info_wr{position: relative; background-color: #fff;
  border-radius: 20px 0px;  padding:30px 60px; margin:40px auto; 
  display: flex; flex-direction: column; align-items: flex-start; justify-content: center; max-width: 830px;
  font-size:2rem; font-weight:400; line-height: 1.4;}
.info_wr::after{content: ''; background: linear-gradient(180deg, #94E34F 0%, #0A8E39 100%); position: absolute; top:-3px; left: -3px; right: -3px; bottom: -3px; border-radius: 22px 0; z-index: -1;}
.info_wr .green{  font-size: 2.4rem; font-weight: 700;}
.ci_wr2 {display: flex; flex-direction: column; align-items: center;}
.ci_wr2 ul{display: flex; flex-direction: row; gap:12px; justify-content: center; max-width: 1200px; width: 100%; flex-wrap: wrap;}
.ci_wr2 ul li{max-width:250px; width: 100%;}
.ci_wr2 ul li .ci{ 
  border-radius: 20px 0px; 
  width: 100%; aspect-ratio: 1 / 1; overflow: hidden;max-width: 250px;
  display:flex; flex-shrink: 0; align-items: center; justify-content: center;}
.ci_wr2 ul li .ci.border{ border: 1px solid #DDD; }
.ci_title{  font-size: 2.4rem; font-weight: 600; line-height: 1.3; text-align: center; padding:30px 0;  }




/* 첫번쨰 ci */
.ci_wr2 ul li .ci.not{align-items:flex-start; justify-content: flex-start; flex-direction: column; gap:10px;}
.ci .gradation {  width:100%; height:60px; background: linear-gradient(90deg, #7DB941 0%, #059646 100%);}
.ci p{  font-size: 1.6rem; line-height: 1.3; padding: 0 20px;}
.ci p:nth-child(2) span{  color:#7DB941; font-weight: 700;}
.ci p:nth-child(3) span{  color:#059646; font-weight: 700;}
.ci img{width: 60%;}
.ci.not img{width: 100%;}


.ci_wr2 ul li:nth-child(3) .ci{
  background-color:#069646;
}
.ci_wr2 ul li:nth-child(4) .ci{
  background-color:#58585A;
}
.ci_wr2 ul li:nth-child(5) .ci{
  background-color:#D1D2D4;
}
.ci_wr2 ul li:nth-child(6) .ci{
  background-color:#A8A9AD;
}
.ci_wr2 ul li:nth-child(7) .ci{
  background-color:#818286;
}
.ci_wr2 ul li:nth-child(8) .ci{
  background-color:#231F20;
}


.ci_wr2.bi ul li:nth-child(3) .ci{
  background-color:#7FBA42;
}
.ci_wr2.bi ul li:nth-child(4) .ci{
  background-color:#009347;
}
.ci_wr2.bi ul li:nth-child(5) .ci{
  background-color:#49494A;
}
.ci_wr2.bi li:nth-child(6) .ci{
  background-color:#231F20;
}

.ci_wr2.bi3 ul li:nth-child(3) .ci{
  background-color:#20973A;
}
.ci_wr2.bi3 ul: li:nth-child(4) .ci{
  background-color:#349B47;
}
.ci_wr2.bi3 ul li:nth-child(5) .ci{
  background-color:#49494A;
}


@media screen and (max-width: 1360px ){
.ci_wr2 ul li .ci{ border-radius: 2vw 0}
.ci p{font-size: 1.6rem;}
.ci .gradation{height: 4vw;}
.ci.not{gap: 1vw;}
#ctt_con .ci img{max-width: 70%;}
}

@media screen and (max-width: 1200px ){
  .ci_wr{flex-direction: column; align-items: center; width: 100%;}
  .ci_wr>div{width: 100%;}

}

@media screen and (max-width: 880px ) {
  .vision{width: 100%; display: block; line-height: 1.3; text-align: center;word-break: keep-all;}
  .vision .green{display: inline; }
  .info_wr{width: 100%;}
}

@media screen and (max-width: 720px ) {
  .ci_wr2 ul li .ci{width: 100%;}
}

/* 농업용필름 */
.sub_title{
  color: #059646; font-size: 4.5rem; font-weight: 600; text-align: center;
}
.con_wr{
  display:flex; flex-direction: column; 
}
.con_wr.me2_1{padding: 0 20px;}
.con_txt{
  font-size: 2.4rem; line-height: 1.5;padding: 0 20px;
}
.con_txt span{
  font-size:2rem; font-weight:600;
}
.con_wr .info_wr{
  width:100%; padding:20px 30px;
}
.info_wr .info_txt{
  font-weight: 700;
}
.con_wr ul{
  display: flex; flex-wrap: wrap; gap:20px;
}
.con_wr ul li{
  width:49%; display:flex; padding:30px; gap:30px;
  border-radius: 10px; box-shadow: 3px 4px 11px 5px rgba(0, 0, 0, 0.10);
  justify-content: center;
}

.con_wr ul li img{
  width:50%; object-fit: scale-down;
}

@media screen and (max-width:1015px) {
  .con_wr ul li{width: 100%;}
}

@media screen and (max-width: 720px) {
  .con_wr ul li{flex-direction: column;}
  .con_wr img{width: 100%;}
}


.con{
  display: flex; flex-direction: column; gap:20px;
}
.con .con_title{
  font-size:3.2rem; font-weight: 600; line-height: 0.7;
}
.con .con_title .gray{
  font-size: 1.4rem; color:#B6B6B6; line-height: 2;
}
.con p{
  font-size:1.4rem; line-height: 1.5;
}
.con p span{
  font-size: 1.6rem; font-weight:600;
}
.con_wr2{
  display:flex; flex-direction: column; gap:80px; overflow: hidden;
}
.con_wr2 .sub_title{
  color: #000; font-size: 3.2rem; font-weight: 600; margin:20px 0;
}
.con_wr2 .con_wr{
  padding-left:0;
}
.con_wr2 .slider{
  padding:0 104px;
}
@media screen and (max-width: 600px) {
  .con_wr2 .slider{padding: 0;}
}
.slide .sub_title{
  font-size:3.2rem; font-weight: 600; color:#000; text-align: left; margin:0; padding:10px 0;
}
.slide .sub_txt{
  font-size: 1.6rem; line-height: 1.5;
}
.sub_txt .line2 {
  margin-bottom:10px;
}

@media screen and (max-width: 1050px) {
  .con_wr ul {
    flex-direction: column;
  }
  .con_wr ul li {
    width: 100%;
  }
}

@media screen and (max-width: 720px) {
  .con_wr ul li {
    flex-direction: column;
  }
  .con_wr ul li img {
    width: 100%;
    object-fit: contain;
  }
}


/*공업용 필름 */

.con_wr .full li{
  width:100%; height:660px; display:flex; flex-wrap: wrap; gap:10px; justify-content: space-around;
}
.con_wr .film_title{
  width:100%; 
}
.con_wr .full li .con{
  display: flex; flex-direction: column; width:49%; justify-items: flex-start;
}
.con_wr .full img{
width: auto;
}

/* 향균비닐제조공정 */

.process_wr{
  width:100%; display: flex; flex-direction: row; align-items: center; gap:10px; justify-content: space-between; margin-top:40px;
}
.process {
  display:flex; flex-direction: column; text-align: center; gap:20px; flex:1; height:600px;
}
.process div{
  font-size:2.6rem; font-weight:700; line-height: 1.3; color:#329D37; 
  display:flex; flex-direction: column; gap:10px; margin:5px; justify-content: center; align-items: center;
  padding:10px;
}
.process .line3{
  padding:0;
}
.process div span{
  font-size: 2rem;
}
.process div p{
  color:#000; font-size:1.8rem; font-weight:400; padding:5px;
}
.sub-content .sub_title2{
  color: #329D37;font-size: 3.2rem; font-weight: 600;}







/* sub02-01 */
.pro-text {margin: 1em 0; background: #fff; padding: 4em 2em; box-sizing: border-box; border: 6px solid #35b582; margin-bottom: 30px;}
.pro-text > p {text-align: center; color: #262626; font-size: 1.5em; line-height: 1.4; word-break: keep-all;}
.pro-text > ul { text-align: left; margin: 1.5em 0 0 0;}
.pro-text > ul li {display: block; margin-bottom: 1em; font-size: 1.125em; color: #666; line-height: 1.4; font-weight: 300; letter-spacing: 0;}
.pro-text > ul li b {font-weight: 400; font-size: 1.25em; color: #00a10b; display: block; margin-bottom: 5px;}
.pro-text > ul li b span {font-weight: 600; display: inline-block; margin-right: 5px;}
.pro-list > li {margin-bottom: 30px;}
.pro-con {font-size: 0; background: #f9f9f9;}
.pro-con > img {width: 50%; display: inline-block; vertical-align: top; transition: width .3s ease-in-out; max-height:463px}
.pro-con > div {width: 50%; display: inline-block; padding: 40px; box-sizing: border-box; font-size: 18px; }
.pro-con h5 {font-size: 1.5em; display: block; line-height: 1.4;  font-family: 'GmarketSans'; letter-spacing: 0; font-weight: 400; margin: 0; padding-left: 0;}
.pro-con h5::before {display: none;}
.pro-con h5 > small {font-size: .65em; color: #999; font-weight: 300; display: block; text-transform: uppercase; letter-spacing: 0;}
.pro-con > div > dl { margin: 20px 0 0; font-size: 1em;}
.pro-con > div > dl dt { display: block; font-weight: 600; margin: 15px 0 5px; color: #444; font-size: 1.125em; padding-left: 10px;}
.pro-con > div > dl dt::before {content:'- ';}
.pro-con > div > dl dd { display: block; font-weight: 300; line-height: 1.4; color: #666; padding-left: 20px; font-size: .95em;}
.pro-con > div > ul { margin: 20px 0 0; font-size: 1em;}
.pro-con > div > ul li{  display: block; font-weight: 300; line-height: 1.4; color: #666; padding-left: 10px; font-size: .95em; margin-bottom: 10px; position: relative;}
.pro-con > div > ul li::before {content:'- '; display: block; left: 0; top: 0; width: 10px; height: 10px; position: absolute;}

.pro-con > div > p {  display: block; font-weight: 300; line-height: 1.4; color: #666; font-size: 1.125em; margin-top: 10px; position: relative;}
.pro-con > div > button, .pro-con > div > .btn-pro-detail {border: 0; background: transparent;  color: #ff9c00; font-size: 16px; font-weight: 600; margin: 20px 0 0 20px; display: inline-block;}
.pro-con > div > button::after, .pro-con > div > .btn-pro-detail::after {width: 16px; height: 16px; display: inline-block; margin: -2px 0 0 5px; vertical-align: middle; content:''; background: url(../images/btn_more.png) 0 0 no-repeat;}
.pro-con > div > button.active::after, .pro-con > div > .btn-pro-detail.active::after {transform: rotate(90deg)}
.pro-detail {display: none; width: 100%; padding: 0;}
.pro-detail.active {display: block; }
.pro-detail img {width: 100%;}

.pro-list .q {cursor: pointer; }
.pro-list .a {display: none;}

/* sub02-02 */
.pro-list2 { margin: 20px 0 0; font-size: 1em;}
.pro-list2 li{  display: block; font-weight: 300; line-height: 1.4; color: #666; padding-left: 10px; font-size: 1em; margin-bottom: 10px; position: relative;}
.pro-list2 li::before {content:'- '; display: block; left: 0; top: 0; width: 10px; height: 10px; position: absolute;}
.pro-swiper {position: relative; overflow: hidden;}
.pro-swiper .swiper-pagination-fraction, .pro-swiper .swiper-pagination-custom, .pro-swiper .swiper-container-horizontal>.swiper-pagination-bullets {bottom: 30px;}
.pro-swiper .swiper-pagination-bullet {width: 6px; height: 6px;}
.pro-swiper .swiper-pagination-bullet-active {width: 12px; height: 12px;}
.pro-swiper .swiper-slide img {width: 100%;}



.pro-swiper .swiper-navigation {position: absolute; top: 45%; width: 100%; left: 0; z-index: 3;}
.pro-swiper .swiper-button-prev, .pro-swiper .swiper-button-next {background-size: auto; width: 60px; height: 60px; top: 0; background-color: rgba(255,255,255,.3); }
.pro-swiper .swiper-button-prev:hover, .pro-swiper .swiper-button-next:hover { background-color: rgba(255,255,255,.5);}
.pro-swiper .swiper-button-prev {background-image: url(../images/icon_mainslider_prev.png);}
.pro-swiper .swiper-button-next {background-image: url(../images/icon_mainslider_next.png);}
.pro-swiper .swiper-button-next, .pro-swiper .swiper-container-rtl .swiper-button-prev {right: 0;}
.pro-swiper .swiper-button-prev, .pro-swiper .swiper-container-rtl .swiper-button-next {left: 0;}

/* sub02-03 */
.img0235 {width: 100%; background: url(../images/img_sub0235.jpg) 0 0 no-repeat #f9f9f9; padding:  4em 2em 6em 600px; margin: 2em 0 0;}
.img0235 p {font-size: 1.5em; line-height: 1.4; color: #555; font-weight: 600; margin: 0 0 1em; font-weight: 500; word-break: keep-all;}

/* sub02-05 */
.img0205 {width: 100%; max-width: 1200px;}
/* sub03-01 */
.research-text {width: 100%; background: url(../images/img_sub0326.jpg) 0 0 no-repeat; padding:  2em 0 2em 600px; margin: 2em 0 0;}
.research-text p {font-size: 1.35em; line-height: 1.6; color: #666; font-weight: 300;}
.research-text p b {font-size: 1.25em; line-height: 1.4; color: #262626; font-weight: 600; margin: 0 0 1em; display: block;}
.operate-text {width: 100%; background: url(../images/img_sub0327.jpg) 0 0 no-repeat; padding: 5em 0 5em 600px; margin: 2em 0 0;}
.operate-text p {font-size: 1.35em; line-height: 1.6; color: #666; font-weight: 300;}

/* sub03-02 */
.research-list2 {font-size: 0;}
.research-list2 li {display: inline-block; vertical-align: top; width: 33.3333%; padding: 0 1em; font-size: 16px; box-sizing: border-box; text-align: center;}
.research-list2 li > h5 {font-size: 1.25em; line-height: 1.4; color: #262626; font-family: 'GmarketSans'; font-weight: 600; display: block; margin: 2em 0 1em; text-align: center;}
.research-list2 li > h5::before {display: none;}
.research-list2 li > img {width: 100%;}
.research-list2 li > p {font-size: 1em; line-height: 1.4; color: #666; font-weight: 300;}

/* sub03-03 */
.gallery_wrap2 {font-size: 0; margin-top: 30px;}
.gallery_wrap2 > ul > li {width: calc(33.3333% - 20px); margin: 0 10px 20px; padding: 10px; display: inline-block; vertical-align: top; box-sizing: border-box; border: 1px solid #ddd; background: #f9f9f9; letter-spacing: 0;}
.gallery_wrap2 > ul > li .img {position: relative; border: 1px solid #ededed; }
.gallery_wrap2 > ul > li .img > img { width: 100%; max-height:460.98px}
.gallery_wrap2 > ul > li p {text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; width:100%; overflow:hidden; margin: 20px 0 0; font-size: 20px; line-height: 1.4; font-family: 'GmarketSans'; color: #262626;}
.gallery_wrap2 > ul > li span {font-size: 16px; line-height: 1.4; color: #666; margin-bottom: 10px; display: block; min-height: 50px;}

/* sub01-04 */

.research-list > ul {background: url(../images/img_sub0328.jpg) left top no-repeat;}
.sub4-list {font-size: 0; margin-bottom: 100px;}
.sub4-list > h4 {width: 150px; display: inline-block; vertical-align: top; position: relative; font-size: 30px; line-height: 1.2; margin: 0; padding: 20px 0 0 0;}
.sub4-list > h4::before {content: ""; position: absolute; left: 0; top: 0; width: 20px; height: 5px;background: #41a338; }
.sub4-list > ul {display: inline-block; vertical-align: top; width: calc(100% - 170px); padding-left: 20px;}
.sub4-list > ul > li {margin-bottom: 10px; line-height: 1.4; font-size: 20px; color: #666; font-weight: 300; padding-left: 15px; position: relative;}
.sub4-list > ul > li::before {content:''; position: absolute; left: 0; top: 10px; width: 5px; height: 5px; background: #ff7620;}
.sub4-list > ul > li b{font-weight: 400; color: #262626; margin-right: 5px;}

/* sub01-05 */
.ctt_me1_3{display: flex; gap: 20px; }
.locationwr{display: flex; flex-wrap: wrap; width: 100%; row-gap: 110px;}
.location_map{width: 50%; border-radius: 10px; border: 1px solid #dadada; overflow: hidden; display: inline-block;}
.location_map > div {width: 100%; min-height: 600px; z-index: 1;}
.location_map .root_daum_roughmap .wrap_map{height: 600px;}
.location_map .wrap_controllers {display: none;}
.location_map .list {display: block; margin-top: 20px;}
.location_map .list li {color: #777777; display: block; margin-bottom: 10px; font-size: 1.0625em; font-weight: 300}
.location_map.green{height: 600px; background-color: #059646; display: flex; justify-content: center; align-items: center; border: none;}
.location-con{display: flex; height: auto; flex-direction: column; justify-content: flex-end; width: 50%;}
.location-con h1{padding-left: 120px; font-size: 3rem; margin-bottom: 20px; position: relative; margin-top: 30px;}
.location-con h1::before{content: '';display: inline-block;line-height:3rem; position: absolute; left: 65px; top:52%; transform: translateY(-50%); width: 39px; height: 39px; overflow: visible; background: url(../images/bullet01.svg) 0 0 no-repeat;}

.location-box{padding: 20px 0; padding-left: 120px;  font-size: 20px; display: flex; gap: 10px;}
.location-box .location-text{text-align: left; line-height: 40px;  word-break: keep-all;}
.location-box .location-text img{width: 24px;}
.location-box .location-text div{display: inline-block; width: 70px; font-weight: 700;}

.location_txt{
  font-size: 1.8rem; line-height: 1.5;
}

@media screen and (max-width: 1055px) {
  #ctt.ctt_me1_3{flex-direction: column; padding: 0 20px;}
  .location_map{width: 100%;}
  .location-con{width: 100%;}
  .location-box{padding: 20px 30px;}
}
/* sub05-01 */
.gallery_wrap {font-size: 0; margin-top: 30px;}
.gallery_wrap > ul > li { font-size: 16px;  margin: 0 10px 20px; padding: 10px; display: inline-block; vertical-align: top; box-sizing: border-box; transform: scale(1); transition: all .3s ease-in-out;  box-shadow: 5px 5px 5px rgba(0,0,0,.15);}

.gallery_wrap > ul > li p a {width: 100%; display: block; color: #333; font-size: 1.1em;}
.gallery_wrap > ul > li:hover {transform: scale(1.05); box-shadow: 0 10px 10px rgba(0,0,0,.25); border: 0;}
.gallery_wrap > ul > li .img {width: 100%; position: relative; overflow: hidden; height: 0; padding-bottom: 56.25%; background-position: 0 50% ; background-size: 100% auto; background-repeat: no-repeat; }
.gallery_wrap > ul > li .img > a {display: block; width: 100%; height: 0; position: relative; padding-bottom: 56.25%;}
.gallery_wrap > ul > li .img > img { width: 100%;}
.gallery_wrap > ul > li p a{text-overflow:ellipsis; word-wrap:normal; width:100%; overflow:hidden; margin: 20px 0 10px;}
.gallery_youtube {position: relative; height:0; padding-bottom: 56.25%;}
.gallery_youtube > iframe {position: absolute; width:100%; height:100%;}

/* member */
.login-wrap {border: 1px solid #dddddd; padding: 60px 0; text-align: center;}
.login-wrap .id-box, .login-wrap .pw-box {width: 90%; max-width: 500px; margin: 0 auto 10px; border: 1px solid #dddddd; box-sizing: border-box; display: block; font-size: 1.125em; background-color: #f9f9f9; position: relative;}
.login-wrap input[type=text], .login-wrap input[type=password] {width: 100%; height: 60px; line-height: 60px; padding: 0 0 0 40px; margin: 0; border: none; box-sizing: border-box; display: block; font-size: 1em; color: #333; background: #f9f9f9;}
.login-wrap .id-box::before {content: ''; width: 18px; height: 100%; background: url(../images/img_login01.png) center no-repeat; position: absolute; top: 0; left: 10px; z-index: 2;}
.login-wrap .pw-box::before {content: ''; width: 18px; height: 100%; background: url(../images/img_login02.png) center no-repeat; position: absolute; top: 0; left: 10px; z-index: 2;}
 input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {transition: background-color 5000s ease-in-out 0s; -webkit-transition: background-color 9999s ease-out; -webkit-text-fill-color: #333 !important;}

.login-wrap input::-webkit-input-placeholder {color: #aaa !important; font-size: 1em !important;}
.login-wrap input:-ms-input-placeholder {color: #aaa !important; font-size: 1em !important;}
.login-wrap button {width: 90%; max-width: 500px; height: 60px; line-height: 60px; border: 0; background: #41a338; color: #ffffff; font-size: 1.125em; font-weight: 400; margin-bottom: 30px; cursor: pointer;}
.login-wrap button:hover {background: #41a338; opacity: .9;}
.login-wrap label {display: block; text-align: left; width: 90%; max-width: 500px; margin: 0 auto 20px;color: #666; font-size: .95em;}
.login-wrap label > input {margin-right: 5px;}
.login-wrap ul {text-align: center; font-size: 1em;}
.login-wrap ul > li {display: inline-block;}
.login-wrap ul > li > a { color: #777777; display: inline-block; margin: 0 20px; position: relative;}
.login-wrap ul > li > a:hover {color: #333333;}
.login-wrap ul > li > a::after {content:''; position: absolute; right: -21px; top: 2px; width: 1px; height: 15px; background: #999999;}
.login-wrap ul > li:last-child > a::after {display: none;}
.terms-wrap h3 {color: #333333; text-align: left; margin-top: 65px; font-size: 20px;}
.terms-con {text-align: left; border: 1px solid #dddddd; background: #f9f9f9; padding: 30px; height: 375px; overflow: hidden; overflow-y: scroll; margin: 20px 0 0;}
.terms-con .tt {font-size: 16px; color: #555; margin-top: 30px; line-height: 1.4; font-weight: 400;}
.terms-con h5 {font-size: 16px; color: #555; margin-top: 18px; line-height: 1.4; font-weight: 400;}
.terms-con > p {font-size: 15px; color: #666; margin-top: 10px; line-height: 1.4;}
.terms-con > ul {margin: 10px 0;}
.terms-con > ul > li { font-size: 14px; color: #666; line-height: 1.4; margin-bottom: 7px;}
.terms-con > ul > li > ul { margin: 10px 0; padding-left: 15px;}
.terms-con > ul > li > ul > li {font-size: 14px; color: #666; line-height: 1.6; margin-bottom: 5px;}
.terms-con > ul > li > b {display: block;}
.terms-con2 {text-align: left; border: 1px solid #dddddd; background: #f9f9f9; padding: 30px; margin: 20px 0 0;}
.terms-con2 p {font-size: 15px; color: #666; line-height: 1.4;}
.terms-check {width: 100%; margin: 20px auto; display: block; text-align: left;  color: #777777; font-size: 1em;}
.terms-check input[type=checkbox] {width: 25px; height: 25px; border: 1px solid #dddddd;  vertical-align: middle; margin-top: -4px; border-radius: 4px !important;}
.terms-check input[type=checkbox]:checked::before {content: ''; width: 100%; height: 100%; display: block; background: url(../images/ico_checkbox.png) 50% 50% no-repeat #41a338;}
.btn-join {width: 100%; max-width: 500px; height: 60px; line-height: 60px; border: 0; background: #41a338; color: #ffffff; font-size: 1.125em; font-weight: 400; margin: 30px auto;  display: block;}

.privacy {height: auto !important; overflow: auto !important;}
.tbl_join { border-collapse: collapse; margin: 0; padding: 0; width: 100%;  border-top: 2px solid #262626; background: #fff;}
.tbl_join tbody th {padding: .5em 1em; text-align: center; font-size: 1em; color: #262626; background: #f9f9f9; border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; line-height: 1.4; width: 150px;}
.tbl_join tbody td {padding: .5em 1em; text-align: left; font-size: 1em; color: #666; border-bottom: 1px solid #e5e5e5; line-height: 1.4; letter-spacing: 0;}

.btn-add {display: inline-block; width: 120px; background: #6fab38; color: #fff; height: 45px; line-height: 45px; margin-left: 5px; text-align: center; vertical-align: top}

.join-input {height: 45px; line-height: 45px; margin: 0; padding: 0 0 0 20px; border: 1px solid #dddddd; box-sizing: border-box; display: inline-block; font-size: 1em; color: #333; }
.join-input2 {height: 45px; line-height: 45px; margin: 0; padding: 0 0 0 20px; border: 1px solid #dddddd; box-sizing: border-box; display: inline-block; font-size: 1em; color: #333; width: calc(50% - 125px); min-width: 160px;}
.join-select {height: 45px; line-height: 45px; margin: 0; padding: 0 0 0 20px; border: 1px solid #dddddd; box-sizing: border-box; display: inline-block; font-size: 1em; color: #333;}
.find-text {text-align: center; font-size: 1em; color: #666; line-height: 1.4; margin-bottom: 20px;}

.js-video-button {cursor: pointer;}

#google_translate_element {vertical-align: middle !important; display: inline-block; margin-top: -2px;}
.goog-te-gadget-simple {border: none !important;}
.goog-te-gadget-simple .goog-te-menu-value span {border: none !important;}
.goog-te-gadget-simple .goog-te-menu-value span:nth-last-of-type(1) {font-size: 0; width: 15px; height: 15px; background: url(../images/icon_select.jpg) #fff no-repeat center; display: inline-block; vertical-align: middle;}
.goog-te-gadget-simple .goog-te-menu-value img:nth-last-of-type(1) {display: none;}

.goog-te-menu-frame {box-shadow: 3px 3px 8px 0 rgb(0 0 0 / 20%) !important; border: 1px solid #ccc !important; border-radius: 10px;}

/*************************************************** Responsive ***************************************************/

@media screen and (max-width: 1800px) {
  .header .h1 {left: 2.5%;}
  .header .member {right: 2.5%;}
}
@media screen and (max-width: 1600px) {
  .header .member > a, .header .member > select {padding: 0 5px;}
}

@media screen and (max-width: 1360px) {
  .header { width: 100%; left: 0; top: 0; box-shadow: 0 5px 5px rgba(0,0,0,.15);}
	.btn-menu {display: block !important;}
	.header .h1 {left: 2.5%;}	
  .header .member { z-index: 101; left: 10px;}
	.nav-wrap {width: 430px; height: 100%; position: fixed; top: 0; right: -80%; text-align: left; padding: 0; background: #fff; box-shadow: 0 0 0 rgba(0,0,0,.2); transition: right .3s ease; z-index: 10;flex-direction: column;}
	.nav-wrap ul{flex: 5;}
  .nav-wrap .member{flex: 1;}
  .nav-wrap .link {display: block; position: fixed; top: 20px; right: -80%; z-index: 101; width: 80%; text-align: center; line-height: 40px;  transition: right .3s ease;}
	.nav-wrap .link img {vertical-align: middle; display: inline-block; margin: -4px 5px 0 0;}
	.nav-wrap .link a:hover {color: #00a0e4;}
	.header .btn-menu {display: block; z-index: 11; top: 0; }
	.header .btn-menu.on {background-image: url(../images/btn_menu_close.png);  top: -1px;}
	.header .btn-menu.on + .nav-wrap {right: 0; box-shadow: 0 0 10px rgba(0,0,0,.2); border-top: 0;}
	.dim {display: none; content: ''; position: fixed; top: 0; right: 0; width: 100%; height: 100%; z-index: 9; background: rgba(0,0,0,.5);}
	.header .btn-menu.on ~ .dim {display: block !important;}
	.nav-wrap > ul {height: 100%; overflow: auto; background: #ffffff; z-index: 100; max-width: 100%; transform: translateX(0);}
	.nav-wrap > ul.active {height: 100%;}
	/*.nav-wrap > ul + .box {display: none !important;}*/
	.nav-subbg {display: none !important;}
	.nav-wrap > ul > li > a {padding: 0 20px; box-sizing: border-box; border-bottom: 1px solid #ddd; }
	.nav-wrap > ul > li {height: auto; min-height: 40px; line-height: 40px; position: relative; width: 100%;}
	.nav-wrap > ul > li:nth-child(1) {margin-top: 80px; border-top: 1px solid #ddd;}
	.nav-wrap > ul > li > ul, .nav-wrap > ul > li > ul {position: static; width: 100%; padding: 0 20px; box-sizing: border-box; height: 0; overflow: hidden;}
	.nav-wrap > ul > li:hover > ul{display: none;}
  .nav-wrap > ul > li > ul.active {height: auto; display: block; }
	.nav-wrap > ul > li > ul li a {padding: 10px;}
	.nav-wrap > ul > li > ul > li > ul {display: block;}
	.nav-wrap > ul > li > a {height: 60px; line-height: 60px;}
	.nav-wrap > ul > li > ul > li {text-align: center;}  

  .sub-visual {margin-top: 90px; height: 230px;}

}

@media screen and (max-width: 1300px) {
  .main-visual {height: 550px;}
 
  .main-visual .main-list {width: 80%; left: 10%; }
  .main-visual .main-list > li a {padding: 1em 0;}
  .main-visual .main-list > li a img {width: 50%;}
  .main-visual .main-text > img {width: 35%; max-width: 250px;}
  .main-visual .main-text > p {font-size: 1.6rem;}
  .main-rnd::before {height: 250px;}
  .main-rnd > div > div {width: 40%;}
  .main-board {width: calc(50% - 20px); margin-right: 20px;}
  .main-quick {width: calc(50% - 20px); margin-left: 20px;}
  .research-text {padding:  0 0 2em 400px;  background-size: 380px;}
  .operate-text {padding:  0 0 10em 400px;  background-size: 380px;}
  .sub0102-list li {font-size: 18px;}

  .research-list > ul {padding-left: 450px; background: url(../images/img_sub0328.jpg) left top no-repeat; background-size: 450px auto;}
  .sub0103-list li {height: 180px;}
  .pro-con > img {width: 40%;}
  .pro-con > div {width: 60%; padding: 20px; font-size: 15px;}
  .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal>.swiper-pagination-bullets {top: auto;}
}




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

  .main-content h2 {font-size: 3rem; }
  .main-content .comment1 {font-size: 5.9vw; position: relative; left: auto; bottom: auto; margin-top: 0;}

  .main-rnd {padding: 10% 0; }
  .main-rnd::before {display: none;}
  .main-rnd > div > div {width: 100%; display: block; background: url(../images/icon_main_12.jpg) 0 0 no-repeat; background-size: cover; }
  .main-rnd > div > div > ul li {display: inline-block; margin: 0 2% ; font-size: 1em;}
  .main-rnd > div > div ul li img {margin-right: 0; margin: 0 auto 10px; display: block;}
  .main-content {margin: 3em auto 0;}
  .main-content .comment2 {margin: 0 0 2em;}
  .footer-con01 {display: block; width: 100%;}
  .footer-con01 > ul {text-align: left; margin-bottom: 15px;}
  .footer-con01 > ul li {padding: 0 20px 0 0;}
  .footer-con01 > ul li:nth-child(1)::after {right: 5px;}
  .footer-con02 {flex-direction: column; width: 100%; margin-left: 0;}  
  .account-list li {width: calc(25% - 10px);}
  .research-text {background: url(../images/img_sub0326.jpg) 0% -10vw no-repeat; padding: 68% 0 0 0; background-size: 100% auto;}
  .research-text p b {font-size: 1.1em;}
  .operate-text {background: url(../images/img_sub0327.jpg) 0% 0 no-repeat; padding: 52% 0 0 0; background-size: 100% auto; }
  .vision-list li {width: calc(33.333% - 20px);  margin: 0 10px 20px}
  .img0235 {padding: 2em 2em 2em 400px; background-size: 380px;}
  .img0235 p {font-size: 1.2em;}
}

@media screen and (max-width: 720px) {
  .header {height: 60px;}
  .header .h1 img {width: 200px;}
  .btn-menu {width: 60px; height: 60px;}
  .header .btn-menu.on {top: 0;}
  .header .member {top: 18px;}
  .main-visual { width: 100%;} 
  .main-visual .main-text > img {width: 50%;}
  .main-sivual .swiper-navigation {display: none;}
  .swiper-pagination-bullet {font-size: 12px;}
  .main-visual .main-text > p {font-size: 1.5rem; line-height: 1.5;}
  .main-visual .main-text > p br{display: none;}
  .main-visual .main-list {bottom: 0; width: 100%; left: 0; border-top-right-radius: 0; border-bottom-left-radius: 0; border-bottom: 1px solid #ddd;}
  .main-visual .main-list > li a  {font-size: 12px;}
  .main-visual .main-swiper .swiper-wrapper .swiper-slide {background-position: 80% top;}
  .main-etc {padding: 3em 0;}
  .main-board {width: 100%; margin-right: 0; margin-bottom: 2em;}
  .main-notice ul li {font-size: 1em;}
  .main-notice {margin-top: 0;}
  .main-video {margin-top: 2em;}
  .main-quick {width: 100%; margin-left: 0;}
  .sub-visual {margin-top: 60px; height: 120px;}
  .sub-visual > div > h2 {font-size: 2em;}
  .sub-gnb {height: 40px;}
  .sub-gnb-list > li > a {line-height: 38px;}
  .sub-content > h3 {margin: 1em 0; font-size: 2.25em;}
  .ceo-message::after {height: 5px;}
  .sub0102-list li {width: 100%;}
  .sub0102-list li:nth-child(1) {border-bottom: 5px solid #fff;}
  .sub0102-list li:nth-child(2) {border-right: 0; border-bottom: 5px solid #fff;}
  .pro-swiper .swiper-pagination {display: none;}
  .pro-swiper .swiper-navigation {top: 42.5%}
  .pro-swiper .swiper-button-prev, .pro-swiper .swiper-button-next {width: 40px; height: 40px;}
  .account-tt {font-size: 1.865em; margin: 0 0 1em }
  .account-tt br {display: none;}
  .account-list li {width: calc(33.3333% - 10px); font-size: 14px;}
  .tbl_list {border: 0; width: 100%;}
	.tbl_list caption {font-size: 1.3em;}
	.tbl_list thead {border: none; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
	.tbl_list tr {border-bottom: 0; display: block;  margin-bottom: .625em; background: #f6f6f6; padding: 1em .5em; border: 1px solid #ededed;}
	.tbl_list td {border-bottom: 0; display: block; text-align: left; }
	.tbl_list td a {width: 80%;line-height: 1.4;}
	.tbl_list .subject {width: calc(100% - 70px); line-height: 1.4;}
	.tbl_list .notice .title a {font-weight: 400;}
	.tbl_list td::before {content: attr(data-label); float: left; font-weight: bold; text-transform: uppercase; margin-right: 10px; min-width: 50px;}
	.tbl_list td:last-child {border-bottom: 0;}
	.tbl_list .title {width: auto;}
	.tbl_list th, .tbl_list td {padding: .25em .65em;}
	.tbl_list .notice td {background: transparent}
	.tbl_list .section {font-size: .95em; color: #444}
	.tbl_list td.sction::before {color: #262626}
	.tbl_list.tbl_reservation td::before {content: attr(data-label); float: left; font-weight: bold; text-transform: uppercase; margin-right: 10px; min-width: 100px;}
	.tbl_list.tbl_reservation td br {display: none;}
  .search-warp > select, .search-warp > input, .search-warp > button {height: 40px; line-height: 40px; font-size: 16px;}
	.search-warp > select, .search-warp > input {padding: 0 10px}
  .tbl_view tbody th {width: 70px;}
	.tbl_view tbody th, .tbl_view tbody td {padding: .625em 1em; font-size: .9em;}
  .ci-text {position: relative; padding: 5em 1em 2.5em; background: url(../images/icon_logo.png) 2em 2em no-repeat #f9f9f9; font-size: 1.25em;}
  .ci-text dl{margin-left: 1em;}
  .ci-text dl dt {margin-top: .5em;}
  .ci-tt {margin: 1em 0; }
  .sub0103-list li {width: calc(50% - 20px);}
  .sub0103-list li div {    border-top-right-radius: 0; border-bottom-left-radius: 0;}
  .bi-list-01 li{height: 230px !important;}
  .bi-text01 {background: url(../images/icon_biocan.png) 2em 2em no-repeat #f9f9f9 !important;}
  .bi-list-02 li {height: 250px !important;}
  .bi-text02 {background: url(../images/icon_pruday.png) 2em 2em no-repeat #f9f9f9 !important;}
  .bi-list-03 li {height: 250px !important;}
  .bi-text03 {background: url(../images/icon_greensoon.png) 2em 2em no-repeat #f9f9f9 !important;}
  .bi-text03 dl {margin-top: 2em;}
  .research-list2 li {width: 100%; margin-bottom: 50px;}
  .research-list2 li > p {display: inline-block;}
  .research-list2 li > h5 {margin:  1em 0 .5em;}
  .pro-con h5 {text-align: center; font-weight: 600;}
  .pro-con > img {width: 100%; display: block;}
  .pro-con > div {width: 100%; display: block;}
  .login-wrap > input {height: 45px; line-height: 45px;}
	.login-wrap > button {height: 45px; line-height: 45px;}
  .sub-content h4 {margin: 2em 0 1em;}
  .sub-content h4::before {}
  .img_pc {display: none;}
  .img_m {display: block;}

  .img0235 {background: url(../images/img_sub0235.jpg)  50% 0 no-repeat #f9f9f9; padding: 52% 0 5% 0 ; background-size: 108% auto;}
  .img0235 p {font-size: 1.25em; width: 90%; margin: 0 auto; }
  .img0235 p br {display: none;}
  .gallery_wrap {margin-top: 10px;}
  .gallery_wrap > ul > li p a {font-size: .9em; margin: 10px 0 2px;}
  .gallery_wrap2 > ul > li {width: 100%; margin: 0 0 20px;} 
  .sub-content {margin: 2em auto 2em; font-size: .85em;}
  .sub-content h3 {font-size: 2.5em; margin: 1em 0;}
}

@media screen and (max-width: 560px) {
  .main-rnd > div > div > ul li {width: 100%; display: block; text-align: left;}
  .main-rnd > div > div ul li img {display: inline-block; margin-right: 15px;}
  .sub-visual { background-attachment: scroll; background-size: cover; height: 90px;}
  .header .btn-menu.on + .nav-wrap {width: 85%; }
  .header .member {width: 100%}
  .header .member > .header-search {display: block; width: 90%; margin-top: 10px;}
  .header .member > .header-search > input {width: calc(100% - 45px);}
  .nav-wrap {right: -100%; width: 100%;}
  .nav-wrap > ul > li:nth-child(1) {margin-top: 110px;}
  .sub-gnb-list > li {width: 50%;}
  .sub-gnb-list > li:first-child {display: none;}
  .sub-gnb-list > li:last-child {border-right: 0;}
  .account-list li {width: calc(50% - 10px); font-size: 13px;}

  .search-warp > select, .search-warp > input, .search-warp > button {width: 100%; margin-right: 0; margin-bottom: 10px;}
  .page li a, .page li a:hover, .page li a.active {width: 30px; height: 30px; line-height: 28px;}
  .sub4-list > h4 {font-size: 20px; width: 100%; margin-bottom: 15px; padding: 15px 0 0 0;}
  .sub4-list > h4::before {width: 40px; height: 3px;}
  .sub4-list > ul {width: 100%; padding-left: 0;}
  .sub4-list > ul > li {font-size: 16px;}
  .vision-list li {width: calc(50% - 20px);}
  .vision-list li div {width: 90px; height: 90px;}
  .vision-list li div img {margin-top: 20px; width: 60%;}
  .tbl_join tbody th {width: 95px;}
  .btn-join {height: 45px; line-height: 45px;}
  .terms-con .tt, .terms-con > p, .terms-con h5 {font-size: 14px;}
  .terms-con {padding: 15px;}
  .header .member > .header-search input#sch_stx {width: calc( 100% - 45px ) !important;}
  .footer-con01 > img {max-width: 180px;}
  .footer-con02 {font-size: 13px;}
  .login-wrap {border: none;}
  .login-wrap input[type=text], .login-wrap input[type=password] {height: 50px; line-height: 50px;}
  .login-wrap button {height: 50px; line-height: 50px;}
  .login-wrap {padding: 30px 0; font-size: 1.2em;}
}

.video-wrap iframe {
  position:absolute; top:50%; left:50%;
  width: 177.77vh;
  height: 56.25vw;
  min-width: 100vw; /* 뷰포트 너비에 맞춤 */
  min-height: 100vh; /* 최소 높이를 뷰포트 높이에 맞춤 */
  transform: translate(-50%, -50%); /* 중앙 정렬 */
}
.video-wrap iframe video{
  position: absolute; top:0;
  width: 100%;
  height: 100%;
}


@media screen and (max-width: 1300px) {
}

/*연혁*/
.content .logo{width: 324px;}
.content .logo-wr{width: 100%;text-align: center;}
.bar3{width: 1px; height: 100%; position: absolute; background-color:#B7B6B6; left: 50%; transform: translateX(-50%);}
.progress {width: 3px;  height: 0;  position: absolute;  background-color: #0A8E39;  left: 50%;  transform: translateX(-50%);}
.content .history{width: 100%;position: relative;}
.content .history .flex{display: flex; flex-direction:column;}
.row .box{ color:#333333;}
.row .O2{width: 17px; height: 17px; position: absolute;
  left: 50%; top:7px; transform: translateX(-50%);border-radius: 50%; background: linear-gradient(90deg, #7FBF40 0%, #0A8E39 100%); 
  display: flex; justify-content: center; align-items: center;}
.row .O2::before{content: ''; width: 11px; height: 11px; background-color: #fff; border-radius: 50%;}
.content .history .row{display: flex; position: relative; margin-top: 70px;}
.row .box.year{padding: 0 20px; text-align: right; font-size: 42px; font-weight: 700; width: 50%; line-height: 30px;}
.row .box.num{text-align: center; font-family: 'noto sans KR'; font-size: 18px; font-weight: 700; width: 7%; line-height: 30px;}
.row .box.content{text-align: left; font-size: 18px; font-weight: 500; width: 43%;line-height: 30px; letter-spacing: -0.27px;/*white-space: nowrap; */white-space:normal; padding: 0 20px;}
.row:nth-child(even){flex-direction: row-reverse;}
.row:nth-child(even) .box.year{text-align: left;}
.row:nth-child(even) .box.content{direction: rtl; text-align: right; /* 실제로는 오른쪽 정렬 효과 */}

@media screen and (max-width:1200px) {
.row:nth-child(even){flex-direction: row;}
.row:nth-child(even) .box.year{text-align: right; font-size: 32px;}
.row:nth-child(even) .box.content{text-align: left;}
.row .box.year{width:140px; font-size: 32px;}
.bar3, .row .O2, .progress{left: 140px;}
.row .box.num{width: 100px;}
.row .box.content{width: auto;}
}

@media (max-width: 800px) {
  .row:nth-child(even) .box.content {
    direction: ltr;
}
.row .box.content{width: 80%;}
}

@media screen and (max-width:600px) {
.row .box.content, .row .box.num{font-size: 14px;}
.row:nth-child(even) .box.year, .row .box.year{width:80px; padding: 0; font-size: 24px; text-align: left;}
.bar3, .row .O2{left: 80px;}
.row .box.content, .row .box.num, .row .box.year{line-height: 24px;}
.row .O2{top: 3px;}
.history .row .box.content.act.visible{
  text-wrap: wrap;
}

}




.blocker{background-color: transparent; position: absolute; top:0; bottom: 0; left: 0; right: 0; z-index: 2;}
.bggray{background-color: #F4F4F4;}
.bg7FBF40{background-color: #7FBF40; position: relative;}
.mainbglogo{position: absolute; width: 40%; bottom: 0; right: 0; z-index: 0;}

.mainmap, .mainmapwr .main-product{ width: 50%; position: relative;}
.mainmap .mainmap2{position: absolute; bottom: 0;}
.mainmapwr .main-product{display: inline-block; padding-left: 3vw; font-size: 3.5rem; line-height: 1.5; font-weight: 400; margin: 160px 0;}
.mainmapwr .main-product span{ font-weight: 700 ;}
.mainmap{justify-content: flex-end;}
.mainmapwr .mainmap{display: inline-flex; }
.mainmap .mainmap2{display: flex; width: calc(100% - 50vw + 750px); height: 550px;  overflow: hidden; justify-content: center; align-items: center; border-radius: 2vw; border: 1px solid #DADADA;}
.mainmap .mainmap2 > div{ height: 100%;}

@media screen and (max-width: 1540px) {
  .mainmap .mainmap2{width: calc(100% - 3vw); }
  .blank4{height: 10vw;}
  .main-content .mainmapwr  h2{padding: 0}
  .main-content .mainmapwr .main-product p{font-size: 3rem;}
}
@media screen and (max-width: 1163px) {
  .mainmapwr .main-product{font-size: 3rem;}
}
@media screen and (max-width: 720px) {
  .mainmapwr{display: flex; flex-direction: column;}
  .mainmap, .mainmapwr .main-product{width: 100%;}
  .mainmap .mainmap2{position: relative;height: 450px; width: calc(100% - 6vw); margin: 0 auto;}
  .mainmap .mainmap2>div{border-radius: 20px;}
  .blank4{display: none;}
  .mainmapwr .main-product{margin: 50px 0;}
  .main-content .mainmapwr .main-product p{font-size: 5vw;}
}

.main-rnd > div{display: flex;}
.main-rnd > div > div ul{position: absolute; right: calc(50vw - 750px); top: 50%; transform: translateY(-50%); gap: 2vw;}
.main-rnd > div > div ul li{background: linear-gradient(90deg, #7FBF40 0%, #0A8E39 100%); border-radius: 2vw 0px;  position: relative; transition: 0.2s all;}
.main-rnd > div > div ul li a{height: 100%; display: block; color: #fff; font-size: 2vw; text-align: right;padding: 3.5vw 2vw 3.5vw 10vw; font-weight: 700; white-space: nowrap;}  
.main-rnd > div > div ul li:hover{transform: translate(-20px); transition: 0.2s all;}
.main-rnd > div > div ul li a img{height: 6vw; position: absolute; bottom: 0; left:2vw;}



.green{color:#059646;}

.line1{
  width:100%; height:1px; background: linear-gradient(180deg, #94E34F 0%, #059646 100%);
}
.line2{
  width:100%; height:3px; background: linear-gradient(90deg, #329D37 0%, #7DB941 50%, #94E34F 100%);
}
.line3{
  width:30px; height:2px; background-color:#329D37;
}
.ctt_admin{
  display:none;
}
.ctt_me1_3 h3{
  display: none;
}




/* 슬라이더 */
/*.slick-prev:before, .slick-next:before{
  font-size:4rem !important;
  color:#267E2A !important;
}*/
.slider .slick-prev, .slider .slick-next{width: 40px; height: 40px;}

.slider {
  width: 100%;
}
.slick-list{
  width:100%;
}
.sub-slider .slide {
  margin:10px;
  padding: 20px 10px; border-radius: 10px; border: 1px solid #DDD; 
  box-sizing: border-box;
  min-height: 580px;
}
.sub-slider .slick-prev {
  background: url('../images/subpoint_l.svg') no-repeat center center;
  background-size: contain;
  width: 70px;
  height: 70px;
}

.sub-slider .slick-next {
  background: url('../images/subpoint_r.svg') no-repeat center center;
  background-size: contain;
  width: 70px;
  height: 70px; 
}
.sub-slider .slick-prev::before,
.sub-slider .slick-next::before {
  display: none;
}

.sub-slider img {
  width: 100%; height: auto;
}
.sub-slider .slick-prev{
  left:-106px;
}
.sub-slider .slick-next{
  right:-104px;
}


.sub-slider2 .slick-prev{ left:9px; z-index:99; }
.sub-slider2 .slick-next{
right:28px;
}

@media screen and (max-width:1600px) {
  .slider{width: calc(100% - 50px); margin: 0 auto;}
  .slick-prev:before, .slick-next:before{font-size: 3rem!important;}
}

@media screen and (max-width:1200px){
  .sub-slider .slick-arrow{
    visibility: hidden;
  }
  .con_wr2 .slider{
    padding:0;
  }
}



  /* 기업 부설 연구소 소개 */

  .company01 .tab-content .mission_wr{
    width:100%; overflow: hidden; max-width: 1500px;
  }
  .lab_wr{
    display:flex; flex-direction: column;
  }
  .lab{
    display:flex; flex-direction: row;
  }
  .lab.right{
    display:flex; flex-direction: row-reverse;
  }
  .lab img{
    width: 50%;
  }
  .lab_txt{
    font-size:1.6rem; line-height:1.5; font-weight: 300; text-align: center; 
    width:50%; display: flex; flex-direction: column; gap:30px; justify-content: center; padding: 100px 80px;
  }
  .lab_txt span{
    font-size: 2.4rem; font-weight:600;
  }
  
  .lab_flex {
    display: flex; 
    flex-direction: row; 
    justify-content: flex-start;
    align-items: flex-start;
    margin: 0 auto;
    width:100%;
    padding: 0 30px;
    gap: 20px;
    overflow:hidden;
  }
  
  /* 가로형 연혁 선 */
  .lab_flex::after {
    content: '';
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #B7B6B6;
    top:254px;
    z-index: -1;
  }
  
  .lab_flex .column {
    display: flex; 
    flex-direction: column; 
    justify-content: space-around; 
    align-items: center; 
    width: 200px;
    min-width: 200px;
    position: relative;
    flex-shrink: 1;
    
  }

  .lab_flex .column .column_img{
    width:90px; height:90px;
  }

  .mission_wr{position: relative; width:100%; max-width:1500px;}
  .mission_wr .bar3{
    height: 2px; width: 100%; position: absolute; background-color:#B7B6B6; top:237px;}
.lab_flex .column .box{ color:#333333; }
.lab_flex .column .O2{
  width: 17px; height: 17px; border-radius:50%; 
  position: absolute; bottom:18%;
  background: var(--gradation, linear-gradient(180deg, #94E34F 0%, #059646 100%));}
  .lab_flex .column{
    display: flex; position: relative; }
.lab_flex .column .box.year{
  padding: 0 20px; margin-top:80px;
  font-size: 3.6rem; font-weight: 500; }  
.lab_flex .column .box.num{
  text-align: center; font-size: 18px; font-weight: 700; 
  width: 10%; line-height: 30px;} 
.lab_flex .column .box.content{
  width:100%;
  text-align:center; font-size: 1.8rem; font-weight: 500; line-height: 30px; letter-spacing: -0.27px; height: 100px; margin-top: 15px;
  word-wrap: break-word; overflow-wrap: break-word;}
.sub-txt{
  text-align: center; padding:50px 0;
}
.sub-txt img{border-radius: 30px 0;}
.sub-txt .title{
   padding:0; justify-content: center;
  font-size: 3.5rem; font-weight: 700; line-height: 1.3; text-align: center;
}
.sub-txt p{
text-align: center; font-size: 1.6rem; font-weight: 400; line-height: 1.5;
margin:10px auto;
}
@media screen and (max-width: 1800px) {
  .company01 .tab-content{
    width:100vw; max-width: 100%;
    padding:0 20px;
  }
  .lab_flex {
    display: flex;
    flex-wrap: nowrap; /* 줄 바뀜 방지 */
    overflow: hidden; /* 넘치는 부분 숨김 */
    width: 100vw; /* 부모 요소 크기를 줄여 화면에 맞게 조정 */
    max-width: 100%; /* 부모 요소가 넘지 않도록 설정 */
  }
}

@media screen and (max-width: 1000px){
  
  .lab_flex::after {
  top: 248px;
  }
}

/*  모바일 화면 (768px 이하) → 세로형 연혁으로 변경 */
@media screen and (max-width: 768px) {
  .lab_flex {
    flex-direction: column; /* 세로 방향 */
    gap: 40px;
    padding: 0 20px;
  }

  .lab_flex::after {
    display: none; /* 가로 라인 제거 */
  }

  .lab_flex .column {
    width: 100%;
    min-width: auto;
    flex-direction: row;
    gap: 10px;
    margin: 0;
    justify-content: center;
  }

  .lab_flex .column .column_img {
    align-self: center;
    width: 60px;
    height: 60px;
    order: 1;
  }

  .lab_flex .column .box.year {
    margin-top: 0;
    order: 2;
    width: 80px;
    text-align: center;
  }

  .lab_flex .column .box.content {
    order: 3;
    margin-top: 0;
    text-align: left;
    height: auto;
    flex: 1;
  }

  .lab_flex .column .O2 {
    display: none;
  }
}

/*  작은 모바일 화면 (480px 이하) */
@media screen and (max-width: 480px) {
  .lab_flex .column {
    flex-direction: column;
    align-items: flex-start;
    padding-left: 70px;
  }

  .lab_flex .column .column_img {
    position: absolute;
    left: 0;
    top: 0;
    width: 50px;
    height: 50px;
  }

  .lab_flex .column .box.year {
    margin-bottom: 10px;
  }

  .lab_flex::after {
    left: 25px;
  }

  .lab_flex .column .O2 {
    left: 25px;
    transform: none;
  }
}











  @media screen and (max-width: 1540px) {
    .main-content h2 {padding: 0 3vw; }
    .main-rnd > div{position: relative;}
    .main-rnd > div > div ul{left:50%; transform: translate(-50%, -50%); display: flex; right: auto;}
    .main-rnd > div > div ul li a{padding: 16vw 2vw 2vw 2vw; font-size: 2.3vw;}
    .main-rnd > div > div ul li:hover{transform: scale(1.05);}
    .main-rnd > div > div ul li a img{top: 5vw; left: 50%; transform: translate(-50%); height: 8vw;}
  }
  @media screen and (max-width: 1000px){
    .main-rnd > div > div ul{ width: 100%; padding: 0 20px;}
    .main-rnd > div > div ul li{flex: 1; margin: 0;}
    .main-rnd > div > div ul li a {text-align: center;}
    .main-rnd > div > div ul li a{padding: 21vw 2vw 2vw 2vw; font-size: 2.5vw;}
    .main-rnd > div > div ul li a img{top: 5vw; left: 50%; transform: translate(-50%); height: 12vw;}
  }
  @media screen and (max-width: 470px){
    .main-rnd > div > div{min-height: 400px;}
    .main-rnd > div > div ul{ width: 100%; padding: 0 20px; flex-direction: column;}
    .main-rnd > div > div ul li{flex: 1; margin: 0;}
    .main-rnd > div > div ul li a {text-align: right;}
    .main-rnd > div > div ul li a{padding: 10vw 8vw 10vw 8vw; font-size: 6vw;}
    .main-rnd > div > div ul li a img{top: 50%; left: 8vw; transform: translateY(-50%); height: 12vw;}
  }
.sub01-03{
   gap:20px; width: 100%; max-width: 1500px; text-align: center; grid-template-columns: repeat(2 ,1fr); 
}
  .ci_wr.alert{
    position: relative; margin:0;
    display: flex; align-items: center;
    font-size:2rem; font-weight:400; line-height: 1.4; 
  }
  .sub_title{
   min-width: 150px; margin-right: 50px; font-size: 3.6rem; font-weight: 700;line-height: 1.3; display: inline-block; vertical-align:text-top;
  }
  .sub_title .small{
    font-size: 3.4rem;
  }
  .info_wr.care {
    width:100%; margin:0; margin-bottom:20px; border:2px solid #329D37; padding:30px 50px; border-radius: 10px;  display: inline-block; vertical-align:text-top; line-height: 1.5; text-align: left;
  }
  .info_wr.care::after{ display:none; content: ''; background: linear-gradient(180deg, #94E34F 0%, #0A8E39 100%); position: absolute; top:-3px; left: -3px; right: -3px; bottom: -3px; border-radius: 10px; z-index: -1;}

.pcbr {
  display: inline;
}
.mo_br {
  display: none;
}


/* 모바일 화면에서 pcbr을 숨김 */
@media screen and (max-width: 1000px) {
  .pcbr {
    display: none;
  }
}

@media screen and (max-width:600px) {
  .ci_wr.alert{
    gap:0;
  }
  .ci_wr.alert .info_wr.care{
    padding:20px 30px;
  }
}

@media (max-width: 500px) {
  .mo_br {
    display: inline;
  }
}

/* 품질관리 */
.quality_wr{
  padding:50px 0; width:100%; max-width:1500px; 
}
.q_title{
  color: #333; font-size: 4rem; font-weight: 600; margin:20px 0; position:relative; padding-left:40px; 
}
.q_title::before {
  content: '';display: inline-block;line-height:3rem; position: absolute; left: -5px; top:32px; transform: translateY(-80%); 
  width: 39px; height: 39px; overflow: visible; background: url(../images/bullet01.svg) 0 0 no-repeat;}
.q_text{
  font-size:1.6rem; line-height: 2; padding:20px 0 50px 0; 
}
.q_imgwr {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 3열 그리드 */
  gap: 30px;
  justify-items: center;
}

.q_img {
  width: 100%; max-width:480px ;
}

.q_img img {
  width: 100%;
  height: auto;
  display: block;
  border:1px solid #ddd;
}

.q_img p {
  text-align: center; font-size: 2rem; font-weight:400;
  padding:20px 0;
}

/* 태블릿 화면 (768px ~ 1023px) */
@media screen and (max-width: 1023px) {
  .q_imgwr {
    grid-template-columns: repeat(3, 1fr); /* 2열로 변경 */
    gap: 20px;
  }
}

/* 모바일 화면 (767px 이하) */
@media screen and (max-width: 767px) {
  .q_imgwr {
    grid-template-columns: 1fr; /* 1열로 변경 */
    gap: 15px;
  }
  
  .quality_wr {
    padding: 0 15px;
  }
}

/* 애니메이팅 */
.act{opacity: 0; transform: translateY(30px); transition: 0.5s all;}
.act.visible{opacity: 1; transform: translateY(0);}
.actl{opacity: 0; transform: translateX(30px); transition: 0.5s all;}
.actl.visible{opacity: 1; transform: translateX(0);}
.actr{opacity: 0; transform: translateX(-30px); transition: 0.5s all;}
.actr.visible{opacity: 1; transform: translateX(0);}
.actt{opacity: 0; transform: translateY(-30px); transition: 0.5s all;}
.actt.visible{opacity: 1; transform: translateY(0);}
.big{opacity: 0; transform: scale(2.0); transition: 0.5s all;}
.big.visible{opacity: 1; transform: scale(1);}


.s1{transition-delay: 0.1s;}
.s2{transition-delay: 0.2s;}
.s3{transition-delay: 0.3s;}
.s4{transition-delay: 0.4s;}
.s5{transition-delay: 0.5s;}
.s6{transition-delay: 0.6s;}
.s7{transition-delay: 0.7s;}
.s8{transition-delay: 0.8s;}
.s9{transition-delay: 0.9s;}
.s10{transition-delay: 1.0s;}
.s11{transition-delay: 1.1s; }
.s12{transition-delay: 1.2s; }
.s13{transition-delay: 1.3s; }
.s14{transition-delay: 1.4s; }
.s15{transition-delay: 1.5s; }

.sub-content .con_wr{
}
.filmbox{display: flex; flex-direction: column; gap:40px; }
.filmbox h1{position: relative; font-size: 3.5rem; line-height:3rem; color: #333;   font-family: 'GmarketSans';}
.filmbox h1::before{content: '';display: inline-block;line-height:3rem; position: relative; left: 0; top: 1px; width: 39px; height: 39px; background: url(../images/bullet01.svg) 0 0 no-repeat;}
.filmcon{margin:0 20px; border-radius:1vw; box-shadow: 3px 4px 11px 5px rgba(0, 0, 0, 0.10); padding: 50px; display: flex;flex-wrap: wrap; gap: 50px;  align-items: flex-start; flex-direction: row;}
.filmcon img{width:100%; max-width:520px; align-self: center;}
.filmcon .innercon{display: flex; gap:30px; flex-direction:column; padding:20px 0;}
.innercon p span{font-size: 2.4rem;font-weight: 600;}
.innercon p {font-size: 1.8rem;line-height:1.5;}

@media screen and (max-width:1200px){
  .filmcon img{
    max-width: none; padding:0;
  }
}


/* 상단 배너 */
.topBanner{width: 100%; position: relative;}
.topBanner img{width: 100%; position: relative; z-index: 0;}
.bannerText{width: 100%; height: 100%; position: absolute; display: flex; justify-content: center; font-size: 3em; font-weight: 700;
 align-items: center; z-index: 1; text-align: center;}
.button-wr{display: flex; position: absolute; bottom:0; width: 100%; align-items: center; justify-content: center;
 background-color: #267E2Aaa; z-index: 2; flex-wrap: wrap;}
.button{height: 40px; display: flex; align-items: center; font-size: 1.5em; transition: 0.2s all; color:#fff;}
.button:hover, .button.active{color: #329D37; font-weight: 700; transition: 0.2s all;}
.button.active{background-color: #fff;}
.button div{height: 70%; padding: 0 30px; display: flex; align-items: center;}
.topBanner .bar {position: absolute;transition: all 0.3s ease;height: 100%; top:0; background: #fff; /* 모바일 배너쪽도 같이 수정해야함*/ z-index: -1;}


/* 모바일 배너 */
@media screen and (max-width:1050px) {
.topBanner{height: 250px; display: flex; justify-content: center; overflow: hidden;}
.topBanner img{width: auto; height: 100%;}
.topBanner .bar{display: none;}
.button:hover, .button.active{background-color: #fff; transition: none;}
}

@media screen and (max-width:720px) {
  .topBanner{margin-top: 60px;}
}
@media screen and (max-width:600px) {
.button-wr{justify-content: flex-start;}
.button{height: 30px;}

}



#container_title {
}
#container_title span{font-size: 5rem; font-family: 'Paperlogy'; font-weight: 700;  padding:0 calc(min(20px, 1540px - 100vw));}
.logoimg{padding: 0 calc(min(20px, 1540px - 100vw));}

@media screen and (max-width: 400px) {
  .logoimg{ width: 80%;}
}

.video-wrap{width: 100%; height: 100vh;position: relative; overflow: hidden;}
.video-wrap blocker{ position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
.video-wrap .videotextwr{z-index: 1; position: relative; display: flex; justify-content: center; align-items: center; height: 100%;}
.video-wrap .videotext, .main-text{color: #fff; font-size: 6rem; text-align: center; line-height: 1.2; font-weight: 600;}
.main-visual .main-text{text-align: left; padding: calc(max(20px, 50vw - 750px));}
.video-wrap .videotext .spandiv, .main-texth2{font-size: 8rem;}
.video-wrap .videotext .spandiv>span, .main-texth2 span{font-family: 'poppins'; letter-spacing: -2px; color: #22b756;}
.video-wrap .skip{ position: absolute; bottom: 30px; width: 100%; z-index: 1; text-align: center;}
.video-wrap .skip img{width: 40px; animation: upDown 1s ease-in-out infinite; cursor: pointer;}
@keyframes upDown {
  0% {transform: translateY(0);}
  50% {transform: translateY(-10px);}
  100% {transform: translateY(0);}
}

@media screen and (max-width:800px){
  .video-wrap .videotext .spandiv, .main-texth2{font-size: 5.8rem;}
}


.footer .right{min-width: 200px;}
.footer .right button{margin-top: 30px;background-color: transparent; border: 0; width: 100%; color: #fff; font-size: 1.2rem; font-weight: 700; border: 1px solid #fff; padding: 10px; cursor: pointer; line-height: 1; display: flex; justify-content: space-between; align-items: center; gap: 10px;}
.footer .right button:hover span{transform: rotate(90deg); transition: all 0.3s ease-out; line-height: 1;}
.footer .right button i {
    transition: all 0.3s ease-out;
    transform-origin: center center;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: -1px;
}

.footer .right button:hover i {
    transform: rotate(90deg);
    transition: all 0.3s ease-out;
}

.footer .right div, .footer-con02 div>div{font-size: 2.3rem; font-weight: 700; line-height: 1.3;}
.footer .right div span{font-weight: 400;}
.footer .right div:first-child, .footer-con02 div div:first-child{font-size: 2.6rem;line-height: 1; margin-bottom: 10px;}
.footer .right p{color: #ffffff99}
.ft_down{ padding:10px; display: flex; justify-content: center;  flex-direction: column; gap: 5px;}
.ft_down li{font-size: 1.9rem; font-weight: 600; color: #000;}
.ft_down li a{color: #fff; width: 100%; display: block;}
.ft_down li:hover a{color: #4188C6; text-decoration: underline;}

.ft_down ul {margin: 0;}
.ft_down li::after{display: none;}

.company01-2{display: flex; flex-direction: column;}
.company01-2 .row{display: flex;}
.company01-2 .row .img{width: 50%;}
.company01-2 .row .text{padding: 50px; display: flex; flex-direction: column; justify-content: flex-end;}
.company01-2 .row .text img{width: 90px;}
.company01-2 .row .subject, .company01-2 .row .subject span{font-size: 3.2rem; font-family: 'Paperlogy'; margin: 20px 0; color: #329D37;}
.company01-2 .row .subject span{font-weight: 700;}
.company01-2 .row .text p{font-size: 2rem; line-height: 1.5;}
.company01-2 .row .text p::before{content: ''; width: 10px; background-color: #329D37; height: 10px; display: inline-block; border-radius: 50%; margin-right: 10px;}

@media screen and (max-width: 1540px) {
  .company01-2 .row{flex-direction: column;}
  .company01-2 .row .img{width: 100%;}
  .company01-2 .row .img img{width: 100%;}
}


.ctt_me2_6 .tab-content{
  display:flex; width:auto; max-width:1500px;
}

.ctt_me2_6  .tab-content .tab_wr{
  display: flex; flex-direction: column; align-items: normal;
}
.ctt_me2_6 .tab-content .tab_wr .eco_wr{
  display: flex; flex-direction: column; flex-wrap: wrap; padding: 0 30px;
}
.ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_wr_in{
  flex-wrap: wrap; justify-content: center; align-items: center;
  gap:16px; padding:60px;
}
.sub01-03 .tab_wr .tab{
  word-wrap: break-word; white-space: normal;
}
.ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_wr_in>img{width: 90%;}

@media screen and (max-width:800px){
  .ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_wr_in {
    padding:20px; justify-content: center;
  }
}

.ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_title{
  font-size: 3rem; font-weight: 600; line-height: 58px; font-family: 'Paperlogy'; color:#fff; 
  position: relative; width: 100%;  padding:0 50px; overflow: visible; height: 58px; 
}
.ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_title.short{
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="350" height="58" viewBox="0 0 350 58" fill="none"><path d="M322.759 58H0L27.2414 0H350L322.759 58Z" fill="%23009B4D"/></svg>');
  background-repeat: no-repeat;
  background-size: min(354px, 100%) auto;
}
.ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_title.medi{
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="396" height="58" viewBox="0 0 396 58" fill="none"><path d="M368.759 58H0L27.2414 0H396L368.759 58Z" fill="%23009B4D"/></svg>');
  background-repeat: no-repeat; 
  background-size: min(400px, 100%) auto;
}
.ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_title.long{
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="531" height="58" viewBox="0 0 531 58" fill="none"><path d="M503.759 58H0L27.2414 0H531L503.759 58Z" fill="%23009B4D"/></svg>');
  background-repeat: no-repeat;
  background-size: min(540px, 100%) auto; white-space: nowrap;
  /*max-width: 540px; height: auto;*/
}
.ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_title::after{
 content: '';
 width:100%; height:2px; background: #329D37;
 position:relative; bottom: 2px; display: block;
}
.ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_title img{
  max-width:124px; width:100%; height:auto; position:absolute; left:410px; top:50%; transform: translateY(-50%); z-index:2;
}
.ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_wr_in{
  display: flex;
}
.ctt_me2_6 .tab-content .con_wr .sub_title{
  text-align: left; font-size: 3.5rem; color: #333; display: block; font-family: 'GmarketSans'; position: relative; padding-left:55px; text-transform: uppercase;}
.ctt_me2_6 .tab-content .con_wr .sub_title::before {content: '';display: inline-block;line-height:3rem; position: absolute; left: 6px; top:20px; transform: translateY(-80%); width: 39px; height: 39px; overflow: visible; background: url(../images/bullet01.svg) 0 0 no-repeat;}

.eco_wr_in .innercon span{font-size: 2.4rem;font-weight: 500; color:#329D37;}
.eco_wr_in .innercon {font-size: 1.8rem;line-height:1.8; max-width:300px;}

@media screen and (max-width:800px) {
  .ctt_me2_6 .tab-content .tab_wr .eco_wr{
    padding:0 10px;
  }
  .ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_title img{
    width:70%; max-width: 80px; left:470px;
  }
  .ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_title::after{
    display: none;
  }
  
}
@media screen and (max-width:600px) {
  .ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_title img{
    left:320px;
  }
  .ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_title {
    padding:0 30px;
  }
}
@media screen and (max-width:500px){
  .ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_title img{
    left:298px;
  }
  .ctt_me2_6 .tab-content .tab_wr .eco_wr .eco_title {
    font-size: 2rem;
  }
}
.eco-table {
  width: 100%; max-width: 100%;
  border-collapse: collapse;
  text-align: center;
  font-size: 16px;
}

.eco-table .b-yellow{
  background-color: #F2F7DF; color:#0A794B;
}
.eco-table .b-green{
  background-color: #D9ECD4;
  color:#0A794B;
}
.eco-table th, .eco-table td{
  padding: 20px 24px; border:1px solid #298A62; text-align: center; vertical-align: middle;
}
/* 기준 행 (두 번째 행) */
.standard-row th, .standard-row td {
  background-color: #e3f1e3;
  font-weight: bold;
  border: 1px solid #ffffff;
}

/* 일반 셀 스타일 */
.custom-table th, .custom-table td {
  border: 1px solid #4d7c50;
  padding: 10px;
}

/* 테이블 본문 */
.custom-table tbody tr {
  background-color: black;
  color: white;
}


/* 숫자 강조 */
.highlight {
  color: #32a852;
  font-weight: bold;
}

.eco_wr_in p{
  font-size: 1.8rem; font-weight: 400; color:#818285;
}
@media screen and (max-width:1200px) {
  .eco-table{
    width:90%;
  }
  .eco-table th, .eco-table td{
    padding: 10px 12px;
  }
}
@media screen and (max-width:800px) {
  #ctt{
    padding: 0 10px;
  }
}
@media screen and (max-width:600px) {
  .eco-table{
    font-size:1.4rem;
  }
  .eco-table th, .eco-table td{
    padding: 6px 8px;
  }

}


.footer-hidden-checkbox { display: none; }
#footer-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #00000080; z-index: 1000001; opacity: 0; pointer-events: none; transition: opacity 0.5s; overflow-y: auto; justify-content: center; align-items: center;  color:#000}
.footer-hidden-checkbox:checked + #daeduk-overlay { opacity: 1; pointer-events: auto; }
.footer-content { background-color: white; width: 800px; max-width: 100%; margin: 50px auto; overflow-y: auto; padding: 60px 40px 40px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); position: relative; line-height: 20px; font-size: 1.5rem; line-height: 1.5; font-weight: 400; }
#footer-close-btn::before, #footer-close-btn::after { position: absolute; content: ""; top: 20px; right: -5px; width: 24px; height: 2px; background-color: black; transform-origin: center; }
.footer-close-wrapper { position: absolute; cursor: pointer; top: 30px; right: 30px; width: 40px; height: 40px; }
#footer-close-btn::before { transform: translateX(-50%) translateY(-50%) rotate(45deg); }
#footer-close-btn::after { transform: translateX(-50%) translateY(-50%) rotate(-45deg); }


.gall_overlay {
  cursor: pointer;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1000001;
  text-align: center;

}

.gall_overlay.active{
  display: flex;
  justify-content: center;
  align-items: center;
}


.gall_overlay img {
  max-height: 80%;
  width: auto;
  display: block;
  position: relative;
}
.close-wr{
  height: 80%;}
.close-overlay {
  color: white;
  background: none;
  width: 30px;
  height: 30px;
  cursor: pointer;
  padding: 10px;
  font-size: 16px;
  position: relative;
  
}
.close-overlay::before{transform: rotate(45deg);}
.close-overlay::after{transform: rotate(-45deg);}
.close-overlay::before, .close-overlay::after{
    content: '';
    position: absolute;
    width: 2px;
    height: 100%;
    background-color: #fff;
    top: 0;
    left: 50%;}


.download_button{
  width:100%; 
  max-width:200px; 
  max-height:50px; 
  background:#000; 
  padding:10px 5px;
  transition: all 0.3s ease; /* 부드러운 전환 효과 추가 */
  margin:20px auto 30px;
}

.download_button:hover{
  background:#eee;
}

.download_button a{
  width:100%; 
  max-width:200px; 
  max-height:50px; 
  padding:10px 5px;
  color:#fff;
}

.download_button:hover a{
  color:#000;
}

.pdfdownload{width: 100%; display: block; padding: 15px 20px; border: 1px solid #555; text-align: center; font-size: 2.1rem; margin: 0 auto; font-weight: 700; max-width: 200px;}
.pdfdownload:hover{background-color: #222; color: #fff;}




.snsbutton{position: absolute; display: flex; justify-content: center; align-items: center; z-index: 3; right: -10px; top:0; height: 120px; gap:8px;}
@media screen and ( max-width : 1360px ){
  .snsbutton{height: 80px; right: 80px; position: fixed;}
}

.snsbutton img{width: 35px;}
.videotextwr img{height: 40px;}
@media screen and ( max-width : 800px ){
  .videotextwr img{height: 30px;}
}

.slideimgwr{width: 100%; aspect-ratio: 16 / 9; overflow: hidden;display: flex; justify-content: center; align-items: center;}
.slideimgwr img{}

.info_wr .info{width: 32%; border: 2px solid #059646; border-radius: 10px; overflow: hidden; min-height: 300px; font-size: 1.7rem; display: inline-flex; flex-direction: column; justify-content: space-between;}
.info_wr .info p{padding: 10px;}
.info_wr .info .imgwr{width: 100%; overflow: hidden; aspect-ratio: 16/10; display: flex; justify-content: center; align-items: center; vertical-align: bottom;}
.info_wr .info .imgwr img{width: 100%;}
#bo_v_info .profile_info{display: none;}

@media screen and (max-width: 1047px) {
  .info_wr.care{padding: 20px 20px; }
  .sub_title{margin-right: 0; margin-bottom: 20px;}
  .info_wr .info{flex-direction: row; width: 100%; min-height:0; margin-bottom: 10px;}
  .info_wr .info p{width: 50%;}
  .info_wr .info .imgwr{width: 50%;}
}


/*basic 게시판 때문에 쓰는 css*/
.bo_sch_wrap{display: block; position: relative;}
.bo_sch{position: relative; margin:0}
#bo_list_total, .bo_sch_cls, .bo_sch h3, .btn_bo_sch{display: none;}
.bo_sch form{padding: 0; display: flex; gap:9.5px; justify-content: flex-end;}
.bo_sch select{height:auto;}
.btn_bo_user{margin:0; display: flex;}
.bo_sch .sch_bar{margin:0; display: flex; border: 0px; border-radius: 0; width: auto;}
.bo_sch .sch_input{width: 180px; border: 1px solid #AAAAAA; border-radius: 5px;}
.bo_sch_bg{background: transparent; display: none;}
#bo_list{height:40px}
#sfl{width:108px; border: 1px solid #AAAAAA; border-radius: 5px;}
.bo_sch .sch_btn{font-size: 28px;}
.bo_sch{width: auto;}
.td_num2{width:150px; text-align: center;}
.tbl_head01 thead th, .tbl_head01 thead th a{color:#AAAAAA;}

.tbl_head01 thead th{padding: 17px 0;}
.tbl_wrap table thead{border-bottom: 1px solid #707070; color: #fff; font-size: 20px; }
#bo_list .tbl_wrap table tbody{font-size: 20px; color: #333333; font-weight: 500;}
#bo_list .td_num2{width: 15%; padding: 17px 0; color: #333333; font-weight: 500;}
#bo_list .td_subject{width: auto; padding: 30px 0 30px 30px; }
#bo_list .td_subject .bo_tit{color: #333333; font-weight: 500;}
#bo_list .td_name{width: 10%; padding: 17px 0; text-align: center;color: #333333; font-weight: 500;}
#bo_list .td_datetime{width: 15%; padding: 17px 0; color: #333333; font-weight: 500;}
#bo_list .td_blank{width: 10%;}
#bo_list tbody .even td{background-color: transparent;}
#bo_list tbody .even:hover td{background-color: transparent;}
#bo_list tbody tr{border-left:none ;}
.tbl_wrap table{border-top:1px solid #707070; }
#bo_list .pg_wrap{float:none;}
.tbl_head01 thead th{border: none;}

.tbl_head01 td{border-top: none;; border-bottom: 1px solid #707070; font-size: 18px; font-weight: 500;}
.tbl_head01 td a{font-weight: 500;}
.td_name{text-align: center;}
#bo_v_con{ font-size:1.4rem;}
#bo_v_title .bo_v_tit{font-size:2.5rem; font-weight:medium;}



/* basic 게시판 write*/
#bo_w .write_div .bo_v_option{display: none;}
#bo_w .bo_w_tit #btn_autosave{display: none;}
#bo_w .bo_w_link {display: none;}
#bo_w .bo_w_tit .bo_w_chkbox {font-size: 14px; font-weight: 500; color:#000000}
#bo_w .bo_w_tit .bo_w_chkbox .textarea{padding: 21px 18px 27px 18px}
#bo_w .bo_w_tit .bo_w_chkbox input[type="checkbox"] {
  visibility: hidden;
  position: absolute;
}
#bo_w .bo_w_tit .bo_w_chkbox label{font-size: 18px; font-weight: 700;  display: flex; align-items: center;}
#bo_w .bo_w_tit .bo_w_chkbox .checkmark {
  height: 25px;
  width: 25px;
  background-color: #fff;
  display: inline-block;
  position: relative;
  border: 1px solid #D9D9D9;
}
#bo_w .bo_w_tit .bo_w_chkbox input[type="checkbox"]:checked + .checkmark {
  background-color: #D9D9D9;
}
#bo_w .bo_w_tit .bo_w_chkbox .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
#bo_w .bo_w_tit .bo_w_chkbox input[type="checkbox"]:checked + .checkmark:after {
  display: block;
}
#bo_w .bo_w_tit .bo_w_chkbox .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid #000000;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.bo_w_tit .hrline{font-size: 16px; font-weight: 500; color: #666666; text-align: right; border-bottom:2px solid #335899; padding: 64px 0 14px 0;}
.bo_w_tit .hrline span{color: #FF0000;}
.write_grid{display: grid; grid-template-columns: 15% 85%; row-gap:40px;margin: 40px 0 30px 0;}
.write_grid .left{font-size: 18px;font-weight: 700; color: #000000; line-height: 38px;padding-left:20px}
.write_grid .left span{color: #FF0000;}
#bo_w .write_div{margin: 0;}
.fileh1{font-size: 18px;font-weight: 700; color: #000000; line-height: 38px;}
.fileh1 span{font-weight: 500;}
.write_grid .left{padding-left:20px}
#bo_w .bo_w_tit .frm_input{padding: 5px; height: 38px; border-radius: 0; background-color: #F2F2F2; border: 1px solid #C1C3C5;}
.write_div textarea{border-radius: 0;  border: 1px solid #C1C3C5;}
.write_div textarea#wr_content{background-color: #F2F2F2;}
#bo_w .bo_w_tit .frm_input.short{width: 100%}
.write_div .right.boxs{display: flex; width:60%; flex-wrap: wrap; column-gap: 11px;}
.write_div .right .checkbox{font-size: 14px; font-weight: 500; display: flex; align-items: center; width: auto; gap:5px}
.write_div .right .checkbox input[type="checkbox"] {
  visibility: hidden;
  position: absolute;
}
.write_div .right .checkbox .checkmark {
  height: 18px;
  width: 18px;
  background-color: #fff;
  display: inline-block;
  position: relative;
  border: 1px solid #D9D9D9;
  border-radius: 50%;
}
.write_div .right .checkbox input[type="checkbox"]:checked + .checkmark {
  background-color: #D9D9D9;
}
.write_div .right .checkbox .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
.write_div .right .checkbox input[type="checkbox"]:checked + .checkmark:after {
  display: block;
}
.write_div .right .checkbox .checkmark:after {
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 8px;
  height: 8px;
  background-color: #666666;
  border-radius: 50%;
}
#bo_w .bo_w_flie .file_wr{border: none; height:auto; padding:0 0 0 20px;}
#bo_w .bo_w_flie .frm_file{padding-left: 0; display: none;}
#bo_w .bo_w_flie .lb_icon{width: auto;}
#file-upload_button {
  /* 사용자 정의 버튼 스타일 */
  background-color: #F2F2F2;
  color: #666666;
  border: 1px solid #C1C3C5;
  border-radius: 13px;
  cursor: pointer;
  padding: 8px 15px;
}
#file-name {
  font-weight: 300;
  color: #666666;
}
#bo_w .btn_confirm.write_div{margin-top: 49px; margin-bottom: 243px; display: flex;
gap:20px; width: 100%; align-items: center; justify-content: center; font-size: 18px;
font-weight: 500;}
#bo_w .btn_confirm.write_div .btn_submit{width: 217px; padding:13px 0; border-radius: 0; line-height: 18px; height:45px;}
#bo_w .btn_confirm.write_div .btn_cancel{width: 217px; border: 1px solid #C1C3C5; background-color: #fff; color: #333333; font-weight: 500;padding:13px 0; border-radius: 0;line-height: 18px;height:45px;}
#bo_w .hrline{margin-top: 36px; border-bottom:2px solid #267E2A; }


@media screen and (max-width:460px) {
  .tbl_head01 td{ font-size:1.6rem; word-break: keep-all;}
  .tbl_head01 tr{ font-size:1.6rem; }

  .td_name.sv_use{ width:15%; word-break: keep-all; }
  .td_datetime{ width:15%; word-break: keep-all; }
  tr .td_num2{ width:10%; }
}