.col01 {color:var(--col01) !important;}
.col02 {color:var(--col02) !important;}
.waitbox {text-align:center; background:var(--lbg); padding:40px 20px;}
.waitbox img {width:100%; max-width:200px; margin:0 auto 20px;}
.waitbox .t01 {font-size:1.5em; font-weight:700; margin:0 0 10px;}
.waitbox .t02 {opacity:0.8;}


/*sub*/
#sub .subtab {display:grid; grid-template-columns:repeat(2, 1fr); margin:0 0 40px; text-align:center; gap:4px;}
#sub .subtab a {flex:1; display:flex; align-items:center; justify-content:center; font-weight:700; padding:10px; color:#fff; background:#b0afb8; border-radius:8px;}
#sub .subtab a.on {background:var(--col01);}
#sub .titbox {display:flex; flex-wrap:wrap; gap:20px 5%;}
#sub .titbox > .tit {width:100%; margin:0 0 20px;}
#sub .titbox > .con {width:100%;}
#sub .tabbox {overflow-x:auto;}
#sub .btnbox {display:flex; flex-wrap:wrap; align-items:stretch; justify-content:center; gap:10px;}
#sub .btnbox a {display:flex; align-items:center; justify-content:center; width:min(40%, 240px); padding:10px 10px 10px 20px; border-radius:100px; background:#b0afb8; color:#fff; font-weight:600; min-height:50px; transition:0.3s; gap:5px;}
#sub .btnbox a:after {content:'chevron_right'; font-family:var(--ic);}
#sub .btnbox a:hover {background:var(--col02);}
#sub .tab01 {border-top:2px solid var(--col01); width:100%;}
#sub .tab01 tr {border-bottom:1px solid var(--border);}
#sub .tab01 th,
#sub .tab01 td {padding:0.4em 0.2em; vertical-align:middle;}
#sub .tab01 th:not(:last-child),
#sub .tab01 td:not(:last-child),
#sub .tab01 .bdr {border-right:1px solid var(--border);}
#sub .tab01 th {background:var(--lbg);}
#sub .h_l {font-weight:700; font-size:1.75em; line-height:1.25;}
#sub .h_m {font-weight:700; font-size:1.25em;}
#sub .h_s {font-weight:600; font-size:1.1em;}

@media all and (min-width:768px) {
  #sub .subtab {margin:0 0 60px; grid-template-columns:repeat(4, 1fr); gap:8px;}
  #sub .titbox > .tit {width:20%;}
  #sub .titbox > .con {width:75%;}
}

@media all and (min-width:1200px) {
  #sub .subtab {margin:0 0 80px;}
  #sub .subtab a {font-size:1.1em; padding:15px;}
  #sub .btnbox a {min-height:60px;}
  #sub .h_l {font-size:2em;}
  #sub .h_m {font-size:1.5em;}
  #sub .h_s {font-size:1.15em;}
  #sub .tab01 th,
  #sub .tab01 td {padding:0.6em;}
}


/*인사말*/
#sub .greet .info01 {display:grid; grid-template-columns:1fr; gap:40px 5%;}
#sub .greet .info01 .txt .t01 {line-height:1.8;}
#sub .greet .info01 .img img {border-radius:8px;}

@media all and (min-width:768px) {
  #sub .greet .info01 {grid-template-columns:2fr 1fr;}
  #sub .greet .info01 .img {order:2;}
  #sub .greet .info01 .txt {order:1;}
}

@media all and (min-width:768px) {
  #sub .greet .info01 .img img {border-radius:16px;}
}


/*경영비전/이념*/
#sub .vision .info01 {display:flex; flex-direction:column; align-items:stretch; justify-content:center; text-align:center; gap:40px;}
#sub .vision .info01 .tit {background:var(--col01); background:linear-gradient(90deg, var(--col01) 0%, var(--col02) 100%); color:#fff; padding:20px; border-radius:16px; display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:20px 40px;}
#sub .vision .info01 .tit img {width:min(20%, 160px);}
#sub .vision .info01 ul {display:grid; grid-template-columns:repeat(2, 1fr); gap:20px; background:var(--lbg); border-radius:16px; padding:20px;}
#sub .vision .info01 ul li {webkit-box-shadow:0px 0px 20px 0px rgba(0,0,0,0.05); -moz-box-shadow:0px 0px 20px 0px rgba(0,0,0,0.05); box-shadow:0px 0px 20px 0px rgba(0,0,0,0.05); padding:20px; border-radius:8px; background:#fff;}
#sub .vision .info01 ul li img {width:min(20%, 40px);}
#sub .vision .info01 ul li p {color:var(--col01); margin:10px 0;}

@media all and (min-width:768px) {
}

@media all and (min-width:1200px) {
  #sub .vision .info01 .tit {padding:30px; border-radius:500px;}
  #sub .vision .info01 ul {grid-template-columns:repeat(4, 1fr); padding:30px; border-radius:500px;}
  #sub .vision .info01 ul li {border-radius:500px;}
}


/*연혁*/
#sub .his .info01 {display:grid; grid-template-columns:1fr; gap:40px 10%;}
#sub .his .info01 h3 {font-size:1.5em; font-weight:800; color:var(--col01);}
#sub .his .info01 ul {display:flex; flex-direction:column; gap:20px;}
#sub .his .info01 ul li > p {display:flex; align-items:flex-start; gap:0 10px;}
#sub .his .info01 ul li > p:before {content:'·';}
#sub .his .info01 dl {background:var(--lbg); padding:20px; display:grid; grid-template-columns:1fr; gap:10px 1em; border-radius:8px; margin:20px 0 0;}
#sub .his .info01 dl dt {color:var(--col02); font-weight:600;}
#sub .his .info01 dl dt:nth-of-type(1) {background:var(--col02); color:#fff; border-radius:8px; padding:0.2em 0.6em; grid-column:1/-1; width:fit-content; margin:0 0 10px;}

@media all and (min-width:768px) {
  #sub .his .info01 {grid-template-columns:auto 1fr;}
  #sub .his .info01 ul {border-top:1px solid var(--border); padding:40px 0 0;}
  #sub .his .info01 h3 {font-size:1.75em;}
}

@media all and (min-width:1200px) {
  #sub .his .info01 {gap:60px 10%;}
  #sub .his .info01 ul {gap:30px; padding:60px 0 0;}
  #sub .his .info01 dl {grid-template-columns:auto 1fr;}
}


/*조직도*/
:root {--orgline:20px;}
#sub .org ul:after,
#sub .org dl:after {display:none;}
#sub .org .info01 {text-align:center;}
#sub .org .info01 li {position:relative; z-index:1;}
#sub .org .info01 .dep01 {display:flex; align-items:stretch; justify-content:center; gap:0 2%;}
#sub .org .info01 .dep01 li {width:32%; display:flex; align-items:center; justify-content:center; color:#fff; padding:10px; font-weight:600; border-radius:8px;}
#sub .org .info01 .dep01 li:nth-child(1) {background:var(--col01); background:linear-gradient(90deg, var(--col01) 0%, var(--col02) 100%); color:#fff;}
#sub .org .info01 .dep01 li:nth-child(2) {background:var(--col01);}
#sub .org .info01 .dep02 {margin:var(--orgline) 0 0 50%; position:relative;}
#sub .org .info01 .dep02:after {content:''; display:inline-block; width:1px; height:calc(var(--orgline) * 2 + 100%); background:var(--border); position:absolute; left:0; top:calc(-1 * var(--orgline)); z-index:0;}
#sub .org .info01 .dep02 li {width:64%; display:flex; align-items:center; justify-content:center; color:#fff; padding:10px; font-weight:600; margin:0 0 0 36%; background:#4c4c58; position:relative; border-radius:8px;}
#sub .org .info01 .dep02 li:after {content:''; display:inline-block; width:56.25%; height:1px; background:var(--border); position:absolute; left:-56.25%; top:50%; z-index:0;}
#sub .org .info01 .dep03 {margin:var(--orgline) 0 0; position:relative;}
#sub .org .info01 .dep03 li {font-weight:600; position:relative;}
#sub .org .info01 .dep03 li:not(:last-of-type) {margin-bottom:var(--orgline);}
#sub .org .info01 .dep03 h5 {font-weight:600; background:var(--col02); color:#fff; padding:10px; border-radius:8px;}
#sub .org .info01 .dep03 h6 {font-weight:600; background:#9493ad; color:#fff; padding:10px; border-radius:8px; margin:var(--orgline) 0 0; position:relative;}
#sub .org .info01 .dep03 h6:after {content:''; display:inline-block; width:1px; height:var(--orgline); background:var(--border); position:absolute; left:50%; bottom:100%; z-index:0;}
#sub .org .info01 .dep03 dl {display:flex;  gap:0 2%;}
#sub .org .info01 .dep03 dd {width:49%;; margin:var(--orgline) 0 0; position:relative;}
#sub .org .info01 .dep03 dd:after {content:''; display:inline-block; width:1px; height:var(--orgline); background:var(--border); position:absolute; left:50%; bottom:100%; z-index:0;}
#sub .org .info01 .dep03 dd p {background:var(--lbg); border:1px solid var(--border); font-weight:600; color:#555; padding:10px; border-radius:8px;}

@media all and (min-width:768px) {
  :root {--orgline:30px;}
  #sub .org .info01 .dep01 li,
  #sub .org .info01 .dep02 li,
  #sub .org .info01 .dep03 h5,
  #sub .org .info01 .dep03 h6 {font-size:1.1em;}
  #sub .org .info01 .dep03 {display:flex; align-items:stretch; justify-content:space-between; gap:0 2%; padding:var(--orgline) 0 0;}
  #sub .org .info01 .dep03:after {content:''; display:inline-block; width:68%; height:1px; background:var(--border); position:absolute; left:16%; top:0; z-index:0;}
  #sub .org .info01 .dep03 li {width:32%;}
  #sub .org .info01 .dep03 li:after {content:''; display:inline-block; width:1px; height:var(--orgline); background:var(--border); position:absolute; left:50%; bottom:100%; z-index:0;}
  #sub .org .info01 .dep03 dd:not(:last-of-type) {margin-bottom:0;}
}

@media all and (min-width:1200px) {
  :root {--orgline:40px;}
  #sub .org .info01 .dep01 li,
  #sub .org .info01 .dep02 li,
  #sub .org .info01 .dep03 h5,
  #sub .org .info01 .dep03 h6 {padding:20px; font-size:1.25em;}
  #sub .org .info01 .dep03 dd p {font-size:1.1em;}
}


/*인증서*/
#sub .certi .info01 ul {display:grid; grid-template-columns:repeat(2, 1fr); gap:20px 2%;}
#sub .certi .info01 ul li .img {position:relative; -webkit-box-shadow:0 0 20px 0 rgba(0,0,0,0.1); -moz-box-shadow:0 0 20px 0 rgba(0,0,0,0.1); box-shadow:0 0 20px 0 rgba(0,0,0,0.1); border-radius:8px; overflow:hidden;}
#sub .certi .info01 ul li .img a {font-family:var(--ic); display:flex; align-items:center; justify-content:center; text-align:center; background:var(--col02); color:#fff; width:40px; height:40px; border-radius:8px; position:absolute; right:10px; bottom:10px; font-size:1.25em;}
#sub .certi .info01 ul li .img a:after {content:'search';}
#sub .certi .info01 ul li p {font-weight:600; padding:10px; text-align:center;}

@media all and (min-width:768px) {
  #sub .certi .info01 ul {grid-template-columns:repeat(3, 1fr);}
}

@media all and (min-width:1200px) {
  #sub .certi .info01 ul {grid-template-columns:repeat(5, 1fr);}
  #sub .certi .info01 ul li .img {border-radius:16px;}
}


/*오시는 길*/
#sub .map .info01 {display:grid; grid-template-columns:1fr; gap:20px 5%;}
#sub .map .info01 > p {font-size:1.1em; font-weight:600; display:flex; align-items:center; gap:10px;}
#sub .map .info01 > p:before {content:'location_on'; font-family:var(--ic); color:var(--col01); font-size:1.1em;}
#sub .map .info01 dl {display:grid; grid-template-columns:auto 1fr; gap:10px 1em; background:var(--lbg); padding:20px; border-radius:8px;}
#sub .map .info01 dl dt {font-weight:700; color:var(--col01);}
#sub .map .mapbox {width:100%; height:min(60vw, 480px);}
#sub .map .mapbox iframe {width:100%; height:100%;}

@media all and (min-width:768px) {
  #sub .map .info01 > p {font-size:1.25em; justify-content:center;}
  #sub .map .info01 dl {grid-template-columns:repeat(6, auto); justify-content:center;}
}

@media all and (min-width:1200px) {
  #sub .map .info01 dl {font-size:1.1em; padding:20px 40px; border-radius:16px;}
}


/*생산제품*/
#sub .prdt .prdt_top {display:grid; grid-auto-flow:1fr; gap:20px 10%;}
#sub .prdt .prdt_top .txt {order:2;}
#sub .prdt .prdt_top .img {order:1;}
#sub .prdt .prdt_top .img img {border-radius:8px;}
#sub .prdt .prdt_top .h_l {color:var(--col01);}
#sub .prdt .prdt_top .h_s {color:var(--col02);}
#sub .prdt .prdt_top .box {background:var(--lbg); padding:20px; border-radius:8px; margin:20px 0 0; display:flex; align-items:flex-start; justify-content:flex-start; gap:20px;}
#sub .prdt .prdt_top .box:before {content:''; display:inline-block; width:1.4em; height:1.4em; background:url('../img/sub02/ic_box.png') no-repeat center center / 100%; flex-shrink:0;}
#sub .prdt .imgwrap {border:1px solid var(--border); border-radius:8px; padding:20px;}
#sub .prdt .imgwrap img {margin:0 auto; display:block;}
#sub .prdt .imgwrap .label {background:var(--col01); background:linear-gradient(90deg, var(--col01) 0%, var(--col02) 100%); color:#fff; padding:0.5em 1em; border-radius:8px; display:inline-block; margin:0 0 20px; font-size:0.9em;}
#sub .prdt .imgwrap ul {display:flex; flex-wrap:wrap; gap:10px; justify-content:center; align-items:center;}
#sub .prdt .imgwrap ul li:first-letter {color:var(--col01);}
#sub .prdt .info01 {display:grid; grid-template-columns:repeat(2, 1fr); gap:20px;}
#sub .prdt .info01 li {display:flex; align-items:center; gap:10px; background:var(--lbg); border-radius:8px; padding:10px;}
#sub .prdt .info01 li em {background:var(--col01); background:linear-gradient(90deg, var(--col01) 0%, var(--col02) 100%); color:#fff; font-weight:600; display:flex; align-items:center; justify-content:center; text-align:center; width:1.6em; height:1.6em; border-radius:4px;}
#sub .prdt .info01 li p {font-weight:600;}

@media all and (min-width:768px) {
  #sub .prdt .prdt_top {grid-template-columns:2fr 1fr;}
  #sub .prdt .prdt_top .txt {order:1;}
  #sub .prdt .prdt_top .img {order:2;}
  #sub .prdt .info01 {grid-template-columns:repeat(3, 1fr);}
}

@media all and (min-width:1200px) {
  #sub .prdt .prdt_top {align-items:center;}
  #sub .prdt .prdt_top .img img {border-radius:16px;}
  #sub .prdt .prdt_top .box {padding:30px; align-items:center; border-radius:16px;}
  #sub .prdt .imgwrap {border-radius:16px;}
  #sub .prdt .imgwrap .label {font-size:1em;}
  #sub .prdt .info01 {grid-template-columns:repeat(4, 1fr);}
}


/*파트너사*/
#sub .partners ul {display:grid; grid-template-columns:repeat(2, 1fr); gap:20px;}
#sub .partners ul li {border:1px solid var(--border); border-radius:8px; overflow:hidden; text-align:center;}
#sub .partners ul li img {display:block; width:min(80%, 200px); margin:0 auto;}

@media all and (min-width:768px) {
  #sub .partners ul {grid-template-columns:repeat(3, 1fr);}
}

@media all and (min-width:1200px) {
  #sub .partners ul {grid-template-columns:repeat(5, 1fr);}
  #sub .partners ul li {border-radius:16px;}
}


/*인재상*/
#sub .talent .info01 {display:grid; grid-template-columns:repeat(2, 1fr);; text-align:center; gap:20px;}
#sub .talent .info01 li {padding:20px; background:var(--lbg); background:linear-gradient(180deg, var(--lbg) 0%, #fff 100%); border-radius:500px 500px 0 0; display:flex; flex-direction:column; gap:10px;}
#sub .talent .info01 li img {border-radius:100%; width:100%; margin:0 0 20px;}
#sub .talent .info01 li em {color:var(--col01); font-weight:800; font-style:italic; font-size:1.1em;}
#sub .talent .info01 li h5 {font-size:1.25em; font-weight:700;}
#sub .talent .info01 li p {color:#888;}

@media all and (min-width:768px) {
  #sub .talent .info01 {grid-template-columns:repeat(3, 1fr);}
  #sub .talent .info01 li em {font-size:1.25em;}
  #sub .talent .info01 li h5 {font-size:1.5em;}
}

@media all and (min-width:1200px) {
  #sub .talent .info01 {grid-template-columns:repeat(5, 1fr); background:url('../img/main/sec01_txt.svg') no-repeat center top / 80%; padding:80px 0 0;}
  #sub .talent .info01 li {padding-bottom:40px;}
  #sub .talent .info01 li:nth-child(even) {margin-top:60px;}
  #sub .talent .info01 li em {font-size:1.5em;}
  #sub .talent .info01 li h5 {font-size:1.75em;}
}


/*채용절차*/
#sub .recruit .info01 {display:grid; grid-template-columns:1fr; gap:20px;}
#sub .recruit .info01 li {padding:20px; border:1px solid var(--border); border-radius:8px; display:flex; flex-direction:column; gap:10px;}
#sub .recruit .info01 li em {color:var(--col02); font-weight:800; font-style:italic; font-size:1.5em; text-align:right; line-height:1;}
#sub .recruit .info01 li img {width:min(20%, 40px); margin:0 0 10px;}
#sub .recruit .info01 li h5 {font-size:1.5em; font-weight:700;}
#sub .recruit .info01 li p {color:#888;}
#sub .recruit .info02 {display:grid; grid-template-columns:1fr; gap:0 1em;}

@media all and (min-width:768px) {
  #sub .recruit .info01 {grid-template-columns:repeat(2, 1fr);}
}

@media all and (min-width:1200px) {
  #sub .recruit .info01 {grid-template-columns:repeat(4, 1fr);}
  #sub .recruit .info01 li {padding:30px; border-radius:16px;}
  #sub .recruit .info01 li em {font-size:1.5em;}
  #sub .recruit .info02 {grid-template-columns:repeat(2, 1fr);}
}


/*개인정보처리방침*/
#sub .privacy h4 {font-size:1.25em; font-weight:700;}


/*이메일무단수집거부*/
#sub .noemail .box {border:1px solid var(--border); padding:40px 20px; border-radius:8px;}
#sub .noemail .box h1 {font-size:1.5em; font-weight:700;}

@media all and (min-width:768px) {
  #sub .noemail .box {padding:60px 30px;}
  #sub .noemail .box h1 {font-size:1.75em;}
}

@media all and (min-width:1200px) {
  #sub .noemail .box {border-radius:16px;}
}


/*사이트맵*/
#sub .sitemap ul {display:grid; align-items:stretch; grid-template-columns:1fr; gap:20px; text-align:center;}
#sub .sitemap ul li {display:flex; flex-direction:column; gap:20px;}
#sub .sitemap ul li h5 {font-size:1.1em; font-weight:700; background:var(--col01); background:linear-gradient(90deg, var(--col01) 0%, var(--col02) 100%); color:#fff; padding:10px; border-radius:8px;}
#sub .sitemap ul li .sub {border:1px solid var(--border); padding:20px; border-radius:8px; height:100%;}
#sub .sitemap ul li .sub dl {display:flex; flex-direction:column; gap:5px;}
#sub .sitemap ul li .sub a {transition:0.3s;}
#sub .sitemap ul li .sub a:hover {font-weight:700; color:var(--col01);}

@media all and (min-width:768px) {
  #sub .sitemap ul {grid-template-columns:repeat(3, 1fr);}
  #sub .sitemap ul li h5 {font-size:1.25em;}
  #sub .sitemap ul li .sub a {font-size:1.1em;}
}

@media all and (min-width:1200px) {
  #sub .sitemap ul {grid-template-columns:repeat(5, 1fr);}
  #sub .sitemap ul li h5 {border-radius:16px;}
  #sub .sitemap ul li .sub {border-radius:16px;}
}