.col01 {color:var(--col01) !important;}
.waitbox {text-align:center; border:5px solid #f5f5f5; padding:40px 20px;}
.waitbox img {width:100%; max-width:160px; margin:0 auto 20px;}
.waitbox .t01 {font-size:1.5em; font-weight:700;}

/*sub*/
#sub .tit01 {font-size:1.25em; font-weight:800; margin-bottom:20px;}
#sub .tit01::first-letter {border-bottom:0.1em solid var(--col01); padding-bottom:0.2em;}
#sub .tit02 {font-size:1.1em; font-weight:800; margin-bottom:20px; color:var(--col01);}
#sub .list01 {display:flex; align-items:stretch; flex-wrap:wrap; border-top:2px solid var(--col01);}
#sub .list01 dt,
#sub .list01 dd {padding:10px; border-bottom:1px solid var(--border); display:flex; align-items:center;}
#sub .list01 dt {width:20%; justify-content:center; text-align:center; font-weight:800; background:#f6f2f2;}
#sub .list01 dd {width:80%; justify-content:flex-start;}
#sub .list01 .info01 p {display:flex; align-items:flex-start; gap:0 0.5em;}
#sub .list01 .info01 p:not(:last-child) {margin-bottom:5px;}
#sub .list01 .info01 b {border:1px solid var(--col01); color:var(--col01); font-size:0.9em; font-weight:500; padding:0 0.2em; min-width:70px; display:inline-block; text-align:center; font-weight:600;}

@media all and (min-width:768px) {
  #sub .tit01 {font-size:1.5em;}
  #sub .tit02 {font-size:1.25em;}
}

@media all and (min-width:1200px) {
  #sub .tit01 {font-size:1.75em; margin-bottom:40px;}
  #sub .tit02 {font-size:1.35em;}
  #sub .list01 dt,
  #sub .list01 dd {padding:15px;}
  #sub .list01 dt {width:15%;}
  #sub .list01 dd {width:35%;}
  #sub .list01 dd:last-of-type:nth-of-type(odd) {width:85%;}
}


/*인사말*/
#sub .intro .txt h5 {font-size:1.25em; font-weight:800;}

@media all and (min-width:768px) {
  #sub .intro .txt h5 {font-size:1.5em;}
}

@media all and (min-width:1200px) {
  #sub .intro .txt {display:flex; flex-wrap:wrap; gap:0 5%;}
  #sub .intro .txt h5 {font-size:1.75em; flex:1;}
  #sub .intro .txt p {flex:1; font-size:1.1em;}
}


/*연혁*/
#sub .history ul {border-top:2px solid var(--col01);}
#sub .history li {border-bottom:1px solid var(--border); padding:20px 3%;}
#sub .history li:nth-child(even) {background:#f6f2f2;}
#sub .history h5 {font-size:1.25em; font-weight:800; color:var(--col01); margin-bottom:20px;}
#sub .history dl {display:flex; flex-wrap:wrap;}
#sub .history dt {width:4em; font-weight:800; padding-right:1em; text-align:center;}
#sub .history dd {width:calc(100% - 4em);}

@media all and (min-width:768px) {
  #sub .history li {display:flex; align-items:center; padding:30px;}
  #sub .history h5 {font-size:1.5em; width:20%; margin-bottom:0;}
  #sub .history dl {width:80%;}
}


/*이념*/
#sub .manage ul {border-top:2px solid var(--col01);}
#sub .manage li {border-bottom:1px solid  var(--border); padding:20px 3%;}
#sub .manage li .img {margin-bottom:20px;}
#sub .manage li .img img {width:100%;}
#sub .manage li .txt h5 {font-size:1.25em; font-weight:800; color:var(--col01); margin-bottom:0.5em;}
#sub .manage li .txt p {font-weight:600;}
#sub .manage dl {margin-top:1em;}
#sub .manage dd {display:flex; align-items:flex-start;}
#sub .manage dd:before {font-family:var(--ic); content:'check'; color:var(--col01); margin-right:0.5em;}

@media all and (min-width:768px) {
  #sub .manage li {display:flex; align-items:center; padding:30px; gap:0 5%;}
  #sub .manage li:nth-child(odd) {flex-direction:row-reverse;}
  #sub .manage li .img {width:40%; margin-bottom:0;}
  #sub .manage li .txt {width:55%;}
  #sub .manage li .txt h5 {font-size:1.5em;}
  #sub .manage dl {margin-top:2em;}
}

@media all and (min-width:1200px) {
  #sub .manage li .txt h5 {font-size:1.75em;}
  #sub .manage li .txt p {font-size:1.1em;}
}


/*조직도*/
#sub .org ul {display:flex; justify-content:center; align-items:flex-start; gap:0 2%; text-align:center; position:relative;}
#sub .org ul.dep01 {padding-bottom:30px;}
#sub .org ul.dep01:after {content:''; display:inline-block; width:1px; height:100%; position:absolute; left:50%; top:0; background:var(--border); z-index:-1;}
#sub .org ul.dep02:after {content:''; display:inline-block; width:76.5%; height:1px; position:absolute; left:11.75%; top:0; background:var(--border); z-index:-1;}
#sub .org li {display:flex; align-items:center; justify-content:center; flex-wrap:wrap; position:relative;}
#sub .org ul.dep01 li {width:32%; background:var(--col01); color:#fff; padding:15px 10px; font-weight:800;}
#sub .org ul.dep02 li {flex:1; padding-top:30px;}
#sub .org ul.dep02 li:after {content:''; display:inline-block; width:1px; height:100%; position:absolute; left:50%; top:0; background:var(--border); z-index:-1;}
#sub .org li h5 {width:100%; background:#303030; color:#fff; padding:15px 10px; font-weight:600;}
#sub .org li dl {border:1px solid var(--border); width:100%; margin-top:1em;}
#sub .org li dd {padding:10px; font-size:0.9em; background:#fafafa;}
#sub .org li dd:not(:last-of-type) {border-bottom:1px solid var(--border);}

@media all and (min-width:768px) {
  #sub .org ul.dep01 {padding-bottom:40px;}
  #sub .org ul.dep01 li {font-size:1.25em;}
  #sub .org ul.dep02 li {padding-top:40px;}
  #sub .org li h5 {font-size:1.1em;}
  #sub .org li dd {font-size:1em;}
}


/*생산시설*/
#sub .fac .txt h5 {font-size:1.25em; font-weight:800;}
#sub .fac .info01 {text-align:center;}
#sub .fac .info01 dl {display:flex; align-items:stretch; margin:0 10px 30px;}
#sub .fac .info01 dd {flex:1; display:flex; align-items:center; justify-content:center; color:#fff; border-radius:500px; font-weight:800; font-size:1.1em; padding:20px; opacity:0.95; margin:0 -10px;}
#sub .fac .info01 dd:nth-of-type(1) {background:var(--col01);}
#sub .fac .info01 dd:nth-of-type(2) {background:#303030;}
#sub .fac .info01 ul {display:flex; align-items:flex-start; gap:0 2%;}
#sub .fac .info01 li {flex:1;}
#sub .fac .info01 li img {display:block; width:100%; max-width:80px; margin:0 auto 1em; border-radius:100%; border:1px solid var(--border); padding:10px;}
#sub .fac .info01 li p {font-weight:600;}

@media all and (min-width:768px) {
  #sub .fac .txt h5 {font-size:1.5em;}
  #sub .fac .info01 {display:flex; align-items:center; justify-content:space-around; gap:0 5%; background:#f6f2f2; padding:40px 20px; border-radius:20px;}
  #sub .fac .info01 dl {margin:0; gap:0 2%;}
  #sub .fac .info01 dd {margin:0; border-radius:20px;}
  #sub .fac .info01 li img {border:0; background:#fff;}
}

@media all and (min-width:1200px) {
  #sub .fac .txt h5 {font-size:1.75em;}
}


/*제품소개*/
#sub .prdt .tab {display:flex; flex-wrap:wrap; gap:6px; text-align:center;}
#sub .prdt .tab a {width:calc(50% - 3px); border:1px solid var(--border); padding:10px; display:flex; align-items:center; justify-content:center; font-weight:600; color:#666;}
#sub .prdt .tab a.on {border-color:var(--col01); color:var(--col01);}

#sub .prdt .subtab {display:flex; flex-wrap:wrap; margin-bottom:40px;}
#sub .prdt .subtab p {width:100%; display:none; align-items:center; justify-content:space-between; cursor:pointer; position:relative; order:2;}
#sub .prdt .subtab.show p {display:flex;}
#sub .prdt .subtab p.on {background:#741513; color:#fff; display:flex; order:1;}
#sub .prdt .subtab p.on:after {content:"keyboard_arrow_down"; font-family:var(--ic); transition:0.3s;}
#sub .prdt .subtab p:not(.on) {border:1px solid var(--border); border-top:0;}
#sub .prdt .subtab.show p.on:after {-webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg); transform:rotate(180deg);}
#sub .prdt .subtab p:not(.on):hover {color:var(--col01);}
#sub .prdt .subtab p a {padding:10px;}

#sub .prdt .prfoot p {display:flex; align-items:center;}
#sub .prdt .prfoot p:before {content:"check_circle"; font-family:var(--ic); color:var(--col01); margin-right:0.2em; font-variation-settings:'FILL' 1;}
#sub .prdt .prfoot p b {margin-right:0.5em;}
#sub .prdt .prfoot a {display:block; width:50%; max-width:160px; background:var(--col01); color:#fff; padding:1em; text-align:center; margin:30px auto 0; font-weight:600; transition:0.3s;}
#sub .prdt .prfoot a:hover {background:#631110;}

@media all and (min-width:768px) {
  #sub .prdt .tab a {width:calc(33.33% - 4px);}
}

@media all and (min-width:1200px) {
  #sub .prdt .tab a {flex:1;}
  #sub .prdt .tab a.on {background:var(--col01); color:#fff;}
  #sub .prdt .tab a:not(.on):hover {background:#fafafa;}

	#sub .prdt .subtab {display:flex; flex-wrap:wrap; justify-content:center; margin-bottom:60px; background:#fafafa;}
	#sub .prdt .subtab p {order:unset; display:flex; width:auto; font-weight:600; color:#888; transition:0.3s;}
	#sub .prdt .subtab p.on {order:unset; background:unset; color:unset; color:var(--col01); border-bottom:3px solid var(--col01);}
	#sub .prdt .subtab p:not(.on) {border:0;}
	#sub .prdt .subtab p.on:after {display:none;}
  #sub .prdt .subtab p:not(.on):hover {color:#666;}
  #sub .prdt .subtab p a {padding:15px 1em;}
}


#sub .prdt .prtop {margin-bottom:40px;}
#sub .prdt .prtop .img {border:1px solid var(--border); padding:20px; margin-bottom:30px;}
#sub .prdt .prtop .img img {width:100%; max-width:400px; margin:0 auto; display:block;}
#sub .prdt .prtop .txt h3 {font-size:1.75em; font-weight:800; margin-bottom:0.5em;}

@media all and (min-width:768px) {
  #sub .prdt .prtop {display:flex; align-items:flex-start; flex-direction:row-reverse; gap:0 5%;}
  #sub .prdt .prtop .img {margin-bottom:0; flex:1;}
  #sub .prdt .prtop .txt {flex:2;}
  #sub .prdt .prtop .txt h3 {font-size:2em;}
}

@media all and (min-width:1200px) {
  #sub .prdt .prtop {margin-bottom:60px;}
  #sub .prdt .prtop .txt h3 {font-size:2.25em;}
}


/*자료실*/
#sub .data .txt h5 {font-size:1.25em; font-weight:800;}
#sub .data .quick {display:flex; flex-wrap:wrap; text-align:center;}
#sub .data .quick a {width:50%; padding:20px; transition:0.3s; border-radius:20px;}
#sub .data .quick a:hover {background:#f6f2f2;}
#sub .data .quick img {display:block; width:80%; max-width:100px; margin:0 auto 1em; background:#fff; border-radius:100%; padding:10px;}
#sub .data .quick h5 {font-size:1.1em; font-weight:800; margin-bottom:0.2em;}
#sub .data .quick p {font-size:0.9em; opacity:0.8;}

@media all and (min-width:768px) {
  #sub .data .txt h5 {font-size:1.5em;}
  #sub .data .quick a {width:33.33%;}
}

@media all and (min-width:1200px) {
  #sub .data .txt h5 {font-size:1.75em; flex:1;}
  #sub .data .quick a {padding:40px 20px; flex:1;}
  #sub .data .quick h5 {font-size:1.25em;}
  #sub .data .quick p {font-size:1em;}
}


/*안내책자*/
#sub .catalog .info01 {background:url('../img/sub03/catalog_bg.jpg') no-repeat center center / cover; color:#fff; text-align:center; display:flex; align-items:center; justify-content:center; padding:60px 20px;}
#sub .catalog .info01 h5 {font-size:1.25em; font-weight:800;}
#sub .catalog .info01 p {font-size:0.9em; opacity:0.8;}
#sub .catalog .info01 .btn {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:20px 2%;}
#sub .catalog .info01 .btn a {display:flex; align-items:center; padding:1em; background:var(--col01); color:#fff; transition:0.3s;}
#sub .catalog .info01 .btn a:hover {background:#631110;}
#sub .catalog .info01 .btn a:after {font-family:var(--ic); content:'download'; margin-left:0.5em;}

@media all and (min-width:768px) {
  #sub .catalog .info01 h5 {font-size:1.5em;}
}

@media all and (min-width:1200px) {
  #sub .catalog .info01 h5 {font-size:1.75em; flex:1;}
  #sub .catalog .info01 p {font-size:1em;}
}


/*FAQ*/
#sub .faq .list {border-top:2px solid var(--col01); text-align:left;}
#sub .faq .abox {cursor:pointer; width:100%; height:100%; background:#fff; border:0; border-bottom:1px solid var(--border); display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-start; padding:20px 80px 20px 20px; position:relative;}
#sub .faq .abox:after {font-family:var(--ic); content:'keyboard_arrow_down'; font-size:1.25em; display:flex; align-items:center; justify-content:center; width:40px; height:40px; position:absolute; right:20px; top:calc(50% - 20px);}
#sub .faq .abox.active:after {content:'keyboard_arrow_up';}
#sub .faq .abox h5 {width:100%; font-size:1.1em; font-weight:800; transition:0.3s; margin-bottom:0.2em;}
#sub .faq .abox p {width:100%; font-size:0.9em; color:#999;}
#sub .faq .abox.active h5,
#sub .faq .abox:hover h5 {color:var(--col01);}
#sub .faq .qbox {max-height:0; overflow:hidden; transition:max-height 0.2s ease-out; line-height:1.6;}
#sub .faq .abox.active ~ .qbox {border-bottom:1px solid var(--border);}
#sub .faq .qbox div {padding:20px; background:#fafafa;}
#sub .faq .qbox h5 {font-weight:600; margin-bottom:0.2em;}
#sub .faq .qbox p {width:100%; font-size:0.9em; color:#999;}

@media all and (min-width:768px) {
  #sub .faq .abox h5 {font-size:1.25em;}
}

@media all and (min-width:1200px) {
  #sub .faq .qbox h5 {font-size:1.1em;}
}


/*~에 대하여*/
#sub .tip .top {border-top:2px solid var(--col01); border-bottom:1px solid var(--border); padding:40px 0;}
#sub .tip .top .img {margin-bottom:20px; text-align:center;}
#sub .tip .top .img img {width:100%; max-width:400px;}
#sub .tip .top .txt h4 {font-size:1.1em; color:var(--col01); font-weight:800; margin-bottom:0.5em;}
#sub .tip .top .txt h5 {font-size:1.35em; font-weight:800; margin-bottom:0.5em;}
#sub .tip .tab {display:flex; align-items:stretch; gap:0 2px;}
#sub .tip .tab dd {cursor:pointer; flex:1; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:600; background:#ccc; padding:15px 10px; font-size:1.1em;}
#sub .tip .tab dd.on {background:var(--col01);}

@media all and (min-width:768px) {
  #sub .tip .top {display:flex; align-items:center; gap:0 5%; justify-content:space-between; flex-direction:row-reverse;}
  #sub .tip .top .img {width:35%; margin-bottom:0;}
  #sub .tip .top .txt {width:60%;}
  #sub .tip .top .txt h5 {font-size:1.75em;}
}

@media all and (min-width:1200px) {
  #sub .tip .top .txt h4 {font-size:1.25em;}
  #sub .tip .top .txt h5 {font-size:2em; flex:1;}
}


/*소통공간*/
#sub .ask .txt {margin-bottom:40px;}
#sub .ask .txt h5 {font-size:1.25em; font-weight:800;}
#sub .ask .txt dt {font-weight:600;}
#sub .ask .txt dd {font-size:1.1em; font-weight:800; color:var(--col01);}
#sub .ask .form .label {margin-bottom:10px; font-weight:600;}
#sub .ask .form input {background:0; border:0; border-bottom:2px solid #222; width:100%; padding:10px 0; margin-bottom:20px;}
#sub .ask .form input:focus {outline:none;}
#sub .ask .form a {display:block; background:var(--col01); color:#fff; font-weight:600; padding:10px; width:160px; text-align:center; margin:20px auto 0;}

@media all and (min-width:768px) {
  #sub .ask .pdinner {display:flex; gap:0 5%;}
  #sub .ask .txt {width:40%; margin-bottom:0;}
  #sub .ask .txt h5 {font-size:1.5em;}
  #sub .ask .txt dd {font-size:1.25em;}
  #sub .ask .form {width:55%;}
  #sub .ask .form input {margin-bottom:30px; padding:20px 0;}
  #sub .ask .form a {margin:20px 0 0;}
}

@media all and (min-width:1200px) {
  #sub .ask .txt h5 {font-size:1.75em;}
  #sub .ask .txt dd {font-size:1.5em;}
}


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

/*이메일무단수집거부*/
#sub .noemail .box {border-top:2px solid var(--col01); border-bottom:1px solid var(--border); padding:20px;}
#sub .noemail .box h1 {font-size:1.25em; font-weight:800;}

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

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

/*사이트맵*/
#sub .sitemap ul {border-top:2px solid var(--col01);}
#sub .sitemap li {display:flex; flex-wrap:wrap; width:100%; border-bottom:1px solid var(--border);}
#sub .sitemap li h5 {width:100%; padding:10px; border-bottom:1px solid var(--border); background:#f6f2f2; font-weight:800;}
#sub .sitemap li dl {display:flex; flex-wrap:wrap; width:100%; padding:20px 3%;}
#sub .sitemap li dd {display:flex; align-items:center;}
#sub .sitemap li dd:not(:nth-of-type(1)):before {content:''; display:inline-block; width:1px; height:0.8em; background:#aaa; margin:0 0.5em;}

@media all and (min-width:768px) {
  #sub .sitemap li h5 {width:20%; padding:20px; border-bottom:0; text-align:center;}
  #sub .sitemap li dl {width:80%; padding:20px;}
}

@media all and (min-width:1200px) {
  #sub .sitemap li h5,
  #sub .sitemap li dl {padding:30px 20px;}
}