@charset "utf-8";
/* *******************************************************
 * filename : sub_style.css
 * description : 서브 레이아웃 및 컨텐츠 CSS
******************************************************** */
#header{position: fixed;}
#header.up {box-shadow: 1px 2px 12px 1px #ddd; }

/* ----------- REGULATORY:: 공통 :: 상단 타이틀 ------------ */
.regulatory-top{position:relative; }
.regulatory-top .regulatory-top-inner{position:relative; text-align:center}
.regulatory-top .regulatory-top-inner .regulatory-tit{position:relative; padding:50px 0 40px; border:1px solid #ddd; border-bottom:0; box-sizing:border-box; }
.regulatory-top .regulatory-top-inner .regulatory-tit strong{position:relative; display:inline-block; font-weight:700; font-size:21px; letter-spacing:-0.25px; color:#c71c22}
.regulatory-top .regulatory-top-inner .regulatory-tit strong:after{position:absolute; display:inline-block; content:""; width:100%; height:2px; background-color:#c71c22; top:-51px; left:0}
.regulatory-top .regulatory-top-inner .regulatory-tit h3{font-weight:700; font-size:50px; letter-spacing:-0.25px; color:#000; margin-top:10px}
.regulatory-top .regulatory-top-inner  .regulatory_info{background: #f0f0f0;padding: 40px;font-size: 17px; color: #444; line-height:1.7}
/*공통 서브 info text style*/
.sub-policy-tit {display: block;font-weight: 600;  font-size: 21px;letter-spacing: 0;color: #333;line-height: 1.4;margin-top: 34px;}
.sub-policy-tit:before{position: relative;display: inline-block;content: ""; width: 22px;height: 23px;left: 0;top: 0px;margin-right: 15px;background:url(../../img/quality_policy_icon.png) no-repeat;background-size: cover !important; vertical-align:middle}
.sub-policy-tit:first-child{ margin:0}
.sub-policy-txt{font-size:18px; letter-spacing: -0.15px;color: #444; line-height: 1.68;  margin-top: 10px; padding-left: 37px;}
.quality-policy-spirits {margin-top:30px}
.quality-policy-spirits li{background-color:#f4f4f4; margin-bottom:16px; padding:15px 28px; border-radius:10px; -webkit-border-radius:10px;}
.quality-policy-spirits li strong,
.quality-policy-spirits li em{display:inline-block; vertical-align:top; margin:0 -1px; line-height:1.4; font-weight:400}
.quality-policy-spirits li strong{position:relative; font-style:italic; font-size:18px; letter-spacing:-0.45px; color:#111; width:23px; padding-right:20px}
.quality-policy-spirits li strong:after{position:absolute; display:inline-block; content:""; width:2px; height:2px; background:#111; opacity:0.5; right:0; top:12px}
.quality-policy-spirits li em{font-size:17px; letter-spacing:0; color:#222; width:calc(100% - 60px); padding-left:17px}


/*=== contect common style ===*/
.rglt-sec {margin-top: 80px;}
.rglt-sub-sec{margin-top:25px;}
.rglt-sub-tit{font-weight:700; font-size:22px; letter-spacing:-0.15px; color:#121212; line-height:1.77; margin-bottom:20px;border-bottom: 1px solid #121212; padding-bottom: 18px;}
.rglt-sub-tit.big-tit{font-size:26px}
.rglt-common-txt{font-weight:400; font-size:18px; letter-spacing:-0.15px; color:#000; line-height:1.77}
.rglt-common-txt strong{font-weight:700}
.rglt-common-txt.plus{position:relative; margin-bottom:20px; padding-left:30px}
.rglt-common-txt.plus:before{position:absolute; display:inline-block; content:""; width:15px; height:16px; background:url("../../img/plus_icon.png") no-repeat; top:8px; left:0}
.rglt-common-txt.plus:last-child{margin-bottom:0}
.rglt-common-txt.plus span{position:relative; display:block; font-weight:400; font-size:18px; letter-spacing:-0.15px; color:#555; padding-left:15px;}
.rglt-common-txt.plus span:before{position:absolute; display:inline-block; content:""; width:6px; height:6px; background-color:#555; border-radius:50%; left:0; top:12px}
.rglt-common-txt.plus span:first-child{margin-top:15px}


/*=========== 슬라이드 버튼 ============== */
.slick_dots_wrap {display: inline-block;vertical-align: middle;}
.circle .slick-dots { text-align:center;}
.circle .slick-dots > li {display: inline-block;vertical-align: top;border: 1px solid transparent;width: 18px;border-radius: 50%;height: 18px;margin: 0 4px; cursor:pointer; -webkit-transition: border 300ms;transition: border 300ms; position: relative; box-sizing:border-box;}
.circle .slick-dots > li > button {width: 4px;height: 4px;padding:0;margin: 6px ;font-size:0;background: #222;border:none;border-radius: 10px;cursor: pointer;-webkit-transition: all 400ms;transition: all 400ms;position: absolute; top: 0; left: 0;}
.circle .slick-dots > li.slick-active {border-color:#222;}

.slick_control {display: block;width: 100%;height: 50px;position: absolute;left: 0;top: 50%;margin-top: -25px;}
.slick_arrows {padding:10px;margin: 0; font-size:13px; font-weight:600; color:#aaa; background: none;border: none;-webkit-box-shadow: none;box-shadow: none;cursor: pointer;z-index: 2;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.slick_arrows > button {display: block; margin: 0;padding: 0;position: absolute;top: 0;bottom: 0;left: 0;right: 0;font-size: 0;background: transparent;border: none;cursor: pointer;}
.slick_arrows:after {font-weight: normal;font-size: 36px;line-height: 50px;text-align: center;color: #ccc;-webkit-transition: color 300ms;transition: color 300ms;}
.slick_arrows.slick_prev {margin-right:30px;}
.slick_arrows.slick_next {margin-left:30px;}
.slick_play_state {display: inline-block;vertical-align: middle;width: 25px;height: 20px;position: relative;}
.slick_play_state_btn {display: block;width: 100%;height: 100%;margin: 0;padding: 0;position: absolute;top: 0;left: 0;background: transparent;border: none;cursor: pointer;opacity: 0;visibility: hidden;-webkit-transition:opacity 300ms;transition: opacity 300ms; font-size:15px; color:#222}
.slick_play_state_btn:after {display: block;font-size: 18px;font-weight: normal;text-align: center;line-height: 20px;color: #222;}
.slick_play_state.play .slick_state_pause {opacity: 1; visibility: visible;}
.slick_play_state.pause .slick_state_play {opacity: 1; visibility: visible;}
html.ios .slick_play_state {margin-top:3px;}
.slick_play_state_btn:after {display: block; font-size: 18px;font-weight: normal; text-align: center; line-height: 20px; color: #222;}
/* 네모 버튼 (자세히 보기 등) */


/*=========== 표 공통 ============== */
.table_wrap table {width: 100%; border-collapse: collapse}
.table_wrap table.tb_style1 {border-top:2px solid #111;}
.table_wrap table.tb_style1 tr th { padding: 19px 0;  border-bottom:1px solid #ddd; border-right: 1px solid #ddd;  color: #282828;  font-weight: 500; background: #f7f7f7; font-size: 17px; text-align: center;}
.table_wrap table.tb_style1 tr td {padding-left: 24px; color:#888; border-bottom:1px solid #ddd; border-left:1px solid #ddd;  line-height: 1.5; letter-spacing: -0.2px; font-size: 17px; padding-top: 10px; padding-bottom: 10px;}
.table_wrap table.tb_style2 {border-top: 2px solid #0043a0;}
.table_wrap table.tb_style2 tr .tit {color: #0043a0; font-size: 18px; font-weight: 500; background: #fff; background: #e9f0fb;}
.table_wrap table.tb_style2 tr th {text-align: center; text-transform: uppercase; font-size: 18px; color: #111; border-bottom: 1px solid #dedede; border-left: 1px solid #dedede; border-right: 1px solid #dedede; padding: 21px 0; font-weight: 400; background: #f8f9f9;}
.table_wrap table.tb_style2 tr td {text-align: center; font-size: 16px; border-bottom: 1px solid #dedede; border-left:1px solid #dedede;  letter-spacing: -0.2px; color: #777; border-right: 1px solid #dedede;}
.table_wrap table.tb_style2 tr td img {max-width: 100%;}
    

/* 서브페이지 공통 스타일 start */
h2.sub_title {position: relative; font-size: 36px; font-weight: 600; color: #111; letter-spacing: -0.5px; padding-top: 70px; padding-bottom: 2%; text-align: center;}
h2.sub_title:before {content:''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 2px; height: 50px; background: #1e7023;}
h3 {font-size: 17px;}



/* ----------- 개별 스타일 start ------------ */
/* greeting [인사말] */
.greeting-content {padding-bottom: 6%;}
.greeting-content .area1400{position: relative;}
.greeting-content .cont {padding-bottom: 400px;}
.greeting-content .cont .cm-fl, .greeting-content .cont .cm-fr {width: 50%;} 
.greeting-content .cont .text_area {padding: 30px 0px 30px 50px;}
.greeting-content .cont .text_area p {font-size: 70px; font-weight: 800; line-height: 1.25; color: #1e7023; text-shadow: 3px 3px 3px rgba(0,0,0,0.5); padding-bottom: 20px;}
.greeting-content .cont .text_area li {font-size: 24px; color: #666666; padding-bottom: 10px; word-break: keep-all;}
.greeting-content .cont .text_area li span {color: #333333;}
.greeting-content .cont .img_area img {max-width: 100%; border: 1px solid #ccc;}
.greeting-content .greeting_area {position: absolute; top: 45%; right: 0; width: 80%; background: #f7f7f7; padding: 80px 60px; z-index: 1;}
.greeting-content .greeting_area .greeting_txt {text-align: center; font-size: 18px; color: #666666; line-height: 1.8; word-break: keep-all;}

@media (max-width: 1024px) {
  .greeting-content .cont {padding-bottom: 30px; overflow: hidden}
  .greeting-content .cont .text_area {padding: 30px 0px 30px 40px;}
  .greeting-content .cont .text_area p {font-size: 50px;}
  .greeting-content .cont .text_area li {font-size: 20px;}
  .greeting-content .cont .img_area img {width: 100%;}
  .greeting-content .greeting_area {top: 0; width: 100%; right: 0; padding: 60px 40px; position: inherit}
  .greeting-content .greeting_area .greeting_txt {font-size: 16px;}
}

@media (max-width: 800px) {
    .greeting-content .cont .text_area {padding: 0px 0px 0px 40px;}
}

@media (max-width: 768px) {
    .greeting-content .cont .cm-fl, .greeting-content .cont .cm-fr {width: 100%;} 
  .greeting-content .cont .text_area {padding: 30px;}
  .greeting-content .cont .text_area p {font-size: 40px;}
  .greeting-content .cont .text_area li {font-size: 18px;}
  .greeting-content .cont .greeting_area {top: auto; position: relative; right: auto; width: 100%; margin-top: -30px; padding: 40px 20px;}
  .greeting-content .cont {padding-bottom: 0;}
  .greeting-content .greeting_area {padding: 40px 30px;}    
  .greeting-content .cont .greeting_area .greeting_txt {font-size: 15px; line-height: 1.6;}
}


/* history [회사연혁] */
.history-content {padding-bottom: 6%;}
.history .history_inner>li:first-child { margin-top: 0; }
.history .history_inner>li { margin-top: 77px; }
.history .history_inner li h3 { font-weight: 900; font-size: 50px; line-height: 1; width:20%; color: #000;}
.history .history_inner li .history_line { position: relative; width: 75%; }

.history .history_inner li .wrap { display: flex; flex-wrap: wrap; width: 100%; }
.history .history_inner li ul.content { margin-top: 10px; position: relative; }
.history .history_inner li ul.content li { display: flex; padding-bottom: 36px; position: relative; z-index: 1; padding-left: 24px; }
.history .history_inner li ul.content li::before { content:""; width: 11px; height: 11px; background: #1b7315; border-radius: 50%; position: absolute; top: 6px; left: -4.5px; opacity: 0; }
.history .history_inner li ul.content li::after { content: ""; width: 1px; height: 100%; background-color: #1b7315; position: absolute; left: 0; top: 10px; z-index: -1; }
.history .history_inner li ul.content li:last-child::after { display: none; }
.history .history_inner li ul.content li:first-child::before, .history .history_inner li ul.content li:last-child::before { opacity: 1; }
.history .history_inner li ul.content li:last-child { padding-bottom: 0; }
.history .history_inner li ul.content li .month { font-weight: 700; font-size: 20px; line-height: 1.2; letter-spacing: 0.3px; padding-right: 32px; word-break: keep-all; color: #333 }
.history .history_inner li ul.content li .txt { font-size: 20px; line-height: 1.2; }
.history .history_inner li ul.content li .txt p { margin-bottom: 12px; line-height: 1.8; font-weight: 400; color: #565656; margin-top: -6px; word-break: keep-all; }
.history .history_inner li ul.content li .txt p:last-child { margin-bottom: 0; }
.history .history_inner li ul.content li:last-child .txt p:last-child { margin-bottom: 0; }

@media (max-width: 767px) {
    .history .f48 { margin-bottom: 30px; }
    .about_history .line::after { left: 10px; }
    .about_history .active .line::after { width: calc(100% - 5px); }
    .about_history .line::before { right: -25px; }
    .history .history_inner { padding-top: 0; }
    .history .history_inner:nth-of-type(1) { margin-bottom: 60px;  }
    .history .history_inner>li { margin-top: 80px; }
    .history .history_inner li .wrap { display: block; }
    .history .history_inner li h3 { width: 100%; font-size: 30px; }
    .history .history_inner li .history_line { padding-left: 0; width: 100%; padding-top: 20px }
    .history .history_inner li ul.content li { padding-bottom: 20px; padding-left: 20px; }
    .history .history_inner li ul.content li .month { margin-right: 0px; width: 10px; font-size: 15px}
    .history .history_inner li ul.content li .txt { width: calc(100% - 10px); font-size: 15px}
    .history .history_inner li ul.content li::before { width: 8px; height: 8px; top: 6px; left: -3px; }
    .history .history_inner li ul.content li .txt p { line-height: 1.5; margin-top: -3px; }
}

/* management [경영목표] */
.management-content {padding-bottom: 6%;}
.management-content .contents {max-width: 1400px; width: 100%;overflow: visible;position: relative;}
.management-content .mana-txt {text-align: center;}
.management-content .mana-txt h3 {font-size: 32px; color: #1e7023; padding-bottom: 20px;}
.management-content .mana-txt h4 {font-size: 22px; color: #666666; font-weight: 400; padding-bottom: 60px; word-break: keep-all}
.management-content .grid-box {display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 1fr;  width: 100%; position: relative; gap:0; padding-left: 40px}
.management-content .grid-box article {aspect-ratio: 1/1; border-radius: 50%; background-color: #1e7023; background-clip: padding-box; border: 40px solid rgba(30,112,35,0.1); display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; margin-left: -40px;}
.management-content .grid-box article:nth-child(even) {background-color: #06500a;}
.management-content .grid-box article .num {font-size: 32px; color: #fff; padding-bottom: 20px;}
.management-content .grid-box article .desc {font-size: 22px; color: #fff;}

@media screen and (max-width: 1300px) {
    .management-content .mana-txt h3 {font-size: 30px; padding-bottom: 20px;}
    .management-content .mana-txt h4 {font-size: 20px; padding-bottom: 50px;}
    .management-content .grid-box {grid-template-columns: repeat(2, 1fr); padding-top: 40px;}
    .management-content .grid-box article {margin-top: -40px;}
    .management-content .grid-box article .num {font-size: 30px;}
    .management-content .grid-box article .desc {font-size: 20px;}
}

@media screen and (max-width: 680px) {
    .management-content .mana-txt h3 {font-size: 25px; padding-bottom: 20px;}
    .management-content .mana-txt h4 {font-size: 18px; padding-bottom: 40px;}
    .management-content .grid-box {grid-template-columns: repeat(1, 1fr);}
    .management-content .grid-box article .num {font-size: 25px;}
    .management-content .grid-box article .desc {font-size: 18px;}
}


/* organization (조직도) dsarttile.co.kr*/
.organization-box { margin-top:80px; }
.organization-box .org-1 { margin:0 auto; width:276px; position:relative; z-index:5;}
.organization-box .org-1 { margin-top:60px; }
.organization-box .org-0 { margin-top:0; }
.organization-box .org-0 .tit { position:relative; }
.organization-box .org-0 .tit:before { content:""; display:block; position:absolute; left:50%; bottom:-60px; transform:translateX(-50%); width:2px; height:60px; background:#e5e5e5; }
.organization-box .org-1 .tit { position:relative; z-index:5; width:100%; height:90px; background:#1e7023; border-radius:90px; padding:10px; display:flex; align-items:center; }
.organization-box .org-1 .tit > span { background:#fff; width:70px; height:70px; border-radius:70px; display:flex; align-items:center; justify-content:center; }
.organization-box .org-1 .tit .txt { padding-left:30px; color:#fff; font-size:26px; font-weight:500; line-height:1.3; letter-spacing:-0.04em; }
.organization-box .org-box { position:relative; padding-top:60px; display:flex; justify-content:space-between; }
.organization-box .org-box:before { content:""; display:block; position:absolute; left:50%; top:0; transform:translateX(-50%); width:2px; height:60px; background:#e5e5e5; }
.organization-box .org-box:after { content:""; display:block; position:absolute; left:50%; top:60px; transform:translateX(-50%); width:calc(100% - 300px); height:2px; background:#e5e5e5; }
.organization-box .org-box .list { padding-top:60px; width:300px; position:relative; }
.organization-box .org-box .list:before { content:""; display:block; position:absolute; left:50%; top:0; transform:translateX(-50%); width:2px; height:60px; background:#e5e5e5; }
.organization-box .org-box .list .tit { margin:0 auto; width:100%; height:90px; background:#fff; border-radius:90px; padding:10px; display:flex; align-items:center; box-shadow:0px 0px 40px 0px rgba(0, 64, 152, 0.30); }
.organization-box .org-box .list .tit > span { background:#1e7023; width:70px; height:70px; border-radius:70px; display:flex; align-items:center; justify-content:center; }
.organization-box .org-box .list .tit .txt { padding-left:30px; color:#1e7023; font-size:23px; font-weight:500; line-height:1.3; letter-spacing:-0.04em; }
.organization-box .org-box .list dd ul { position:relative; }
.organization-box .org-box .list dd ul:before { content:""; display:block; position:absolute; left:0; top:0; width:1px; height:calc(100% - 22px); background-image:linear-gradient(to bottom, #1e7023 50%, transparent 50%); background-position:0 0, 5px 5px; background-size:1px 10px; }
.organization-box .org-box .list dd li { margin-top:20px; padding-left:60px; position:relative; }
.organization-box .org-box .list dd li:before { content:""; display:block; position:absolute; left:4px; top:50%; transform:translateY(calc(-50% - 0.5px)); width:20px; height:1px; background-image:linear-gradient(to right, #1e7023 50%, transparent 50%); background-position:0 0, 5px 5px; background-size:10px 1px; }
.organization-box .org-box .list dd li:after { content:""; display:block; position:absolute; left:20px; top:50%; transform:translateY(calc(-50% - 0.5px)); width:10px; height:10px; background:#1e7023; border-radius:10px; }
.organization-box .org-box .list dd li .sbox { min-height:50px; width:100%; padding:5px 10px;border-radius:50px; border:2px solid #1e7023; display:flex; align-items:center; justify-content:center; text-align:center; color:#1e7023; font-size:22px; font-weight:300; line-height:1.3; letter-spacing:-0.04em; }

@media screen and (max-width:1440px){
	.organization-box .org-1 {  width:250px; }
	.organization-box .org-1 .tit,
	.organization-box .org-box .list .tit { height:80px;padding:10px; }
	.organization-box .org-1 .tit > span,
	.organization-box .org-box .list .tit > span { width:60px; height:60px; }
	.organization-box .org-1 .tit .txt { padding-left:30px; font-size:24px; }
	.organization-box .org-box { padding-top:60px; }
	.organization-box .org-box:after { width:calc(100% - 270px); }
	.organization-box .org-box .list { padding-top:60px; width:270px; }
	.organization-box .org-box .list .tit .txt { font-size:21px; }
	.organization-box .org-box .list dd li .sbox { font-size:21px; }
}
@media screen and (max-width:1280px){
	.organization-box .org-1 { width:200px; }
	.organization-box .org-1 .tit,
	.organization-box .org-box .list .tit { height:70px; padding:10px; }
	.organization-box .org-1 .tit > span,
	.organization-box .org-box .list .tit > span { width:50px; height:50px; }
	.organization-box .org-1 .tit > span img { width:30px; }
	.organization-box .org-box .list .tit > span img { width:25px; }
	.organization-box .org-1 .tit .txt { padding-left:20px; font-size:21px; }
	.organization-box .org-box { padding-top:50px;}
	.organization-box .org-box:before { width:2px; height:50px; }
	.organization-box .org-box:after { top:50px; width:calc(100% - 200px); }
	.organization-box .org-box .list { padding-top:50px; width:200px; }
	.organization-box .org-box .list:before { width:2px; height:50px; }
	.organization-box .org-box .list .tit .txt { padding-left:10px; font-size:18px; }
	.organization-box .org-box .list dd li { margin-top:20px; padding-left:40px; }
	.organization-box .org-box .list dd li:before { left:4px; width:20px; height:1px; }
	.organization-box .org-box .list dd li:after { left:20px; width:7px; height:7px; }
	.organization-box .org-box .list dd li .sbox { min-height:45px; border:2px solid #1e7023; font-size:18px; }
}
@media screen and (max-width:939px){
	.organization-box { margin-top:60px; }
	.organization-box .org-1 { width:200px; margin-top:40px; }
	.organization-box .org-0 { margin-top:0; }
    .organization-box .org-0 .tit:before {display: none;}
	.organization-box .org-1 .tit,
	.organization-box .org-box .list .tit { height:70px; padding:10px; }
	.organization-box .org-1 .tit > span,
	.organization-box .org-box .list .tit > span { width:50px; height:50px; }
	.organization-box .org-1 .tit > span img { width:30px; }
	.organization-box .org-box .list .tit > span img { width:25px; }
	.organization-box .org-1 .tit .txt { padding-left:20px; font-size:21px; }
	.organization-box .org-box { padding-top:0; flex-wrap:wrap;  }
	.organization-box .org-box:before { width:50%; height:2px; left:0; top:-35px; transform:translate(0); }
	.organization-box .org-box:after { height:70%; width:2px; top:-35px; left:0; transform:translate(0); }
	.organization-box .org-box .list { padding-top:50px; width:100%; padding-left:40px; }
	.organization-box .org-box .list:before { width:40px; height:2px; left:0; top:85px; transform:translate(0, 0);}
	.organization-box .org-box .list .tit { width:100%; margin:0; }
	.organization-box .org-box .list .tit .txt { padding-left:10px; font-size:18px; }
	.organization-box .org-box .list dd li { margin-top:20px; padding-left:40px; width:200px; }
	.organization-box .org-box .list dd li:before { left:4px; width:20px; height:1px; }
	.organization-box .org-box .list dd li:after { left:20px; width:7px; height:7px; }
	.organization-box .org-box .list dd li .sbox { min-height:45px; border:2px solid #1e7023; font-size:18px; }
	.organization-box .org-box .list dt { position:relative;}
	.organization-box .org-box .list:last-child dt:after { content:""; display:block; position:absolute; left:-40px; bottom:35px; width:2px; height:500%; background:#e5e5e5; }
}

/* animation */
.organization-box .org-1,
.organization-box .org-box .list .tit,
.organization-box .org-box .list dd { opacity:1; }
.organization-box.subOn .org-1 { animation:ani_4 0.8s 0.3s; animation-fill-mode:both; }
.organization-box.subOn .org-box .list .tit { animation:ani_4 0.8s 0.5s; animation-fill-mode:both; }
.organization-box.subOn .org-box .list dd { animation:ani_4 0.8s 0.8s; animation-fill-mode:both; }

 
/* ******************  회사소개 :: 인증서 ********************** */
.certification-con{padding-top: 30px; position:relative}
.certification-con.none-mgt{padding-top: 0;}
 
/* 인증서 팝 */
.ABA-album-thumb > ul {overflow:hidden; margin:0 -1%;}
.ABA-album-thumb > ul li {float:left; width:23%; margin:0 1% 2% 1%; }
.ABA-album-thumb > ul li .ABA-thumb{display: block; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box;}
.ABA-album-thumb > ul li .ABA-thumb a{position: relative; height: 0; padding-top: 130%; border: 1px solid #D8D8D7; overflow: hidden; display: block;}
.ABA-album-thumb > ul li .ABA-thumb a img{position:absolute; top: 0; left: 0; width: 100%; height: 100%;}
.ABA-album-thumb > ul li .AB-alignc span{display:block; height:48px; font-size:18px; line-height: 48px; letter-spacing: -1px; color:#000000; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
body:not(.lang_kor) .ABA-album-thumb > ul li .AB-alignc span{ font-size:16px}
.ABA-album-thumb > ul li .img-over-thum {
    position:absolute; opacity:0;filter:Alpha(opacity=0); width:100%; height:100%; left:0; top:0; background-color:rgba(0, 0, 0, 0.5);  
    -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
.ABA-album-thumb > ul li .img-over-thum span {
    position:absolute; left:32%; bottom:-45px; width:35%; height:45px; font-size:15px; line-height: 45px; letter-spacing: -1px; color:#fff; 
    background-color:rgba(0, 0, 0, 0.3); border:1px solid rgba(255, 255, 255, 0.3); border-bottom: 0; text-align:center; 
    -webkit-transition: all 0.3s; transition: all 0.3s; }
.ABA-album-thumb > ul li .img-over-thum span i {vertical-align: middle; color:#fff; display:inline-block; margin-left: 0px;}
.certifi-bottom-list{margin-top: 70px;}
.certifi-bottom-list.none-mgt{margin-top: 0;}
.ABA-album-thumb > ul li:hover .img-over-thum {opacity:1;filter:Alpha(opacity=100); }
.ABA-album-thumb > ul li:hover .img-over-thum span {bottom:0;}

@media screen and (max-width:800px){
    .ABA-album-thumb{/*max-width:480px;*/ margin:0px auto;}
    .ABA-album-thumb > ul li{width:48%; margin-bottom:5%}
    .ABA-album-thumb > ul li .gallery-tit{height:30px; line-height:30px; font-size:14px; padding-top:5px;} 
    .ABA-album-thumb > ul li .img-over-thum span{bottom:-30px; height:30px; line-height:30px; font-size:13px;}
    .ABA-album-thumb > ul li .img-over-thum span i{font-size:18px; margin-left:3px;}
    .ABA-album-thumb > ul li .AB-alignc span{height: 30px; line-height: 30px; font-size: 14px; padding-top: 5px;}    
}


/* location [오시는길] */
.map {position:relative;}
.map ul {max-width:calc(100% - 450px);}
.map ul li {font-size:22px; margin-bottom:20px;}
.map ul li img {margin-right:20px;}
.map .map_wrap {margin-top:50px; }
.map .map_wrap .root_daum_roughmap_landing {width:100%;}
.map .map_wrap .root_daum_roughmap .wrap_map {height:580px;}
.map .map_link {position:absolute; right:0; top:100px; }
.map .map_link a {display: inline-block; font-size:16px; padding:15px 25px; border:1px solid #eaeaea; margin-left:7px;}
.map .map_link a img {margin-right:10px;}

@media screen and (max-width:1080px){
    .map ul {max-width:100%;}
    .map ul li {padding-left:50px;}
    .map ul li img {margin-left:-135px; padding-left:90px;}
    .map .map_link {position:static; margin-top:30px;}    
}

@media screen and (max-width:768px){ 
    .map ul li {font-size:18px;}
    .map .map_link {display: flex;}
    .map .map_link a {width:33.33%; padding:15px 4px; text-align: center; font-size:14px;}
    .map .map_link a img {margin-right:6px;}
    .map .map_link a:first-child {margin-left:0;}    
}


/*=========================== 공통 ===========================*/
p.top_txt {position: relative; font-size: 25px; font-weight: 700; color: #fff; text-align: center; padding: 8%; z-index: 3; line-height: 1.4;}
p.top_txt:before {content:''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(60deg, rgba(0,90,171,1) 0%, rgba(7,164,210,1) 100%); opacity: 0.7; z-index: -1;}
p.top_txt:after{content:'';
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    background: #fff;
    width: 0;
    height: 0;
    border-bottom: 20px solid #0073bb;
    border-left: 20px solid #fff;
    box-shadow: 3px 4px 4px 0px rgba(0,0,0,0.2);
}
.section {margin-top: 5%;}
.section h4 {color: #333; font-size: 32px; font-weight: 600; margin-bottom: 2%; text-align: center;}
.section p {font-size: 18px; margin-bottom: 1%; line-height: 1.6; color: #666666; word-break: keep-all; text-align: center;}
.section p span {color: #333333; font-weight: 600;}
.section .img_box {margin: 2% 0; border: 1px solid #ddd; padding: 2%; text-align: center;}
.section img {max-width: 100%; }



/*=========================== 제품소개 ===========================*/
.product-content {padding-bottom: 6%;} 
.product-content .pro_head_img img {border-radius: 15px; margin-bottom: 2%}
.product-content .section .item-box {grid-template-columns: repeat(4, 1fr); gap: 40px; display: grid;}
.product-content .section .item-box .item {width: 100%; height: 400px; display: flex; flex-direction: column; border: 1px solid #d3d3d3; border-radius: 15px; padding: 30px; position: relative; text-align: center;}
.product-content .section .item-box .item .text em {color: #333333; font-size: 44px; font-weight: 700;}
.product-content .section .item-box .item .text em span {color: #1e7023}
.product-content .section .item-box .item .text h6 {color: #666666; font-weight: 400; margin-top: 20px; font-size: 20px; word-break: keep-all;}
.product-content .section .item-box .item figure {margin: 0;}
.product-content .section .item-box .item .icon {position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%);}
.product-content .section .item-box .item .icon img {width: 70%;}

.product-content .section .item-box2 {grid-template-columns: repeat(2, 1fr); gap: 80px 40px; display: grid;}
.product-content .section .item-box2 .item {width: 100%; display: flex; flex-direction: column;}
.product-content .section .item-box2 .item figure {margin: 0;}
.product-content .section .item-box2 .item .icon img {width: 100%;border-radius: 15px; }
.product-content .section .item-box2 .item .text h6 {color: #666666; font-weight: 400; margin-top: 20px; font-size: 22px; word-break: keep-all;}

/* product~business 공통*/
@media all and (max-width:1200px) {
    .section p br.mnone {display: none;}
}
@media all and (max-width:1100px) {
    .section p br.mnone {display: none;}
    .product-content .section .item-box {grid-template-columns: repeat(4, 1fr); gap: 20px; display: grid;}
    .product-content .section .item-box .item .text em {font-size: 40px;}
    .product-content .section .item-box .item .text h6 {font-size: 20px;}     
    
    .product-content .section .item-box2 {gap: 40px 20px; display: grid;}
}
@media all and (max-width:1024px) {
    .section h4 {font-size: 30px;}
    .product-content .section .item-box .item {height: 350px;}
    .product-content .section .item-box .item .text em {font-size: 25px;}
    .product-content .section .item-box .item .text h6 {font-size: 18px;}    
    
    .product-content .section .item-box2 .item .text h6 {margin-top: 10px; font-size: 18px;}
}
@media all and (max-width:800px) {
    .section h4 {font-size: 26px;}
    .section p {font-size: 16px;}
    .product-content .section .item-box .item {height: 330px;}
    .product-content .section .item-box {grid-template-columns: repeat(2, 1fr); gap: 20px; display: grid;}
    .product-content .section .item-box .item .text em {font-size: 22px;}
    .product-content .section .item-box .item .text h6 {font-size: 16px;}   
    
    .product-content .section .item-box2 .item .text h6 {font-size: 16px;}   
}
@media all and (max-width:768px) {
    .section h4 {font-size: 24px;}
}
@media all and (max-width:540px) {
     p.top_txt, .section h4 {font-size: 18px;}
     .section p {font-size: 15px;}
}
@media all and (max-width:480px) {
    .product-content .section .item-box .item {height: 300px; padding: 20px;}
    .product-content .section .item-box .item .icon {bottom: 20px;}
    
    .product-content .section .item-box2 .item {height: 150px;}
    .product-content .section .item-box2 .item .text h6 {margin-top: 10px; font-size: 16px;}
}


/* 코팅관련 설비 */
.equip_list {padding: 0 0 130px;}
.equip_list .heading {margin-bottom: 30px; font-size: 36px; color: #333;}
.equip_list .grid-box {display: grid; grid-template-columns: repeat(5, 1fr); grid-auto-rows: 1fr; gap: 80px 20px;}
.equip_list .grid-box .sbj { font-size: 23px; font-weight: 600; color: #333;}
.equip_list .grid-box figure {position: relative; width: 100%; height: 0; padding-bottom: 135%; border-radius: 10px; overflow: hidden; margin: 0 0 30px 0; border: 1px solid #ddd; box-sizing: border-box;}
.equip_list .grid-box figure img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.equip_list .grid-box ul { margin-top: 20px;}
.equip_list .grid-box ul li { display: flex; color: #666; font-weight: 400; font-size: 18px; word-break: keep-all;}
.equip_list .grid-box ul li + li { margin-top: 10px;}
.equip_list .grid-box ul li .dot { flex-shrink: 0; margin-top: 12px; background-color: #d9d9d9; margin-right: 7px; width: 4px; height: 4px; border-radius: 50%; vertical-align: middle; }

.equip_list2 {padding: 0 0 130px;}
.equip_list2 .heading {margin-bottom: 30px; font-size: 36px; color: #333;}
.equip_list2 .grid-box {display: grid; grid-template-columns: repeat(5, 1fr); grid-auto-rows: 1fr; gap: 80px 20px;}
.equip_list2 .grid-box .sbj { font-size: 23px; font-weight: 600; color: #333;}
.equip_list2 .grid-box figure {position: relative; width: 100%; height: 0; padding-bottom: 100%; border-radius: 10px; overflow: hidden; margin: 0 0 30px 0; border: 1px solid #ddd; box-sizing: border-box;}
.equip_list2 .grid-box figure img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.equip_list2 .grid-box ul { margin-top: 20px;}
.equip_list2 .grid-box ul li { display: flex; color: #666; font-weight: 400; font-size: 18px;}
.equip_list2 .grid-box ul li + li { margin-top: 10px;}
.equip_list2 .grid-box ul li .dot { flex-shrink: 0; margin-top: 12px; background-color: #d9d9d9; margin-right: 7px; width: 4px; height: 4px; border-radius: 50%; vertical-align: middle; }

@media screen and (max-width: 1100px) {
    .equip_list .heading {margin-bottom: 30px; font-size: 30px; color: #333;}
  .equip_list .grid-box { grid-template-columns: repeat(3, 1fr); grid-auto-rows: auto; gap: 50px 20px;}
  .equip_list .grid-box figure { padding-bottom: 120%; margin: 0 0 20px 0;}
  .equip_list .grid-box .sbj { font-size: 20px;}
    
    .equip_list2 .heading {margin-bottom: 30px; font-size: 30px; color: #333;}
  .equip_list2 .grid-box { grid-template-columns: repeat(3, 1fr); grid-auto-rows: auto; gap: 50px 20px;}
  .equip_list2 .grid-box figure { padding-bottom: 100%; margin: 0 0 20px 0;}
  .equip_list2 .grid-box .sbj { font-size: 20px;}
}
@media screen and (max-width: 767px) {
  .equip_list { padding: 0 0 70px;}
  .equip_list .heading { margin-bottom: 20px; font-size: 25px}
  .equip_list .grid-box { gap: 30px 10px; grid-template-columns: repeat(2, 1fr);}
  .equip_list .grid-box .sbj { font-size: 18px; margin-bottom: 10px;}
  .equip_list .grid-box figure { margin: 0 0 10px 0;}
  .equip_list .grid-box ul { margin-top: 10px;}
    .equip_list .grid-box ul li {font-size: 16px;}
  .equip_list .grid-box ul li + li { margin-top: 5px;}
    
  .equip_list2 { padding: 0 0 70px;}
  .equip_list2 .heading { margin-bottom: 20px; font-size: 25px}
  .equip_list2 .grid-box { gap: 30px 10px; grid-template-columns: repeat(2, 1fr);}
  .equip_list2 .grid-box .sbj { font-size: 18px; margin-bottom: 10px;}
  .equip_list2 .grid-box figure {margin: 0 0 10px 0;}
  .equip_list2 .grid-box ul { margin-top: 10px;}
    .equip_list2 .grid-box ul li {font-size: 16px;}
  .equip_list2 .grid-box ul li + li { margin-top: 5px;}
}

/* 공정과정 */
.process > ul{ display: flex; flex-wrap: wrap; justify-content: center; text-align: center; margin-bottom: -50px; }
.process > ul > li{ width: calc((100% - 270px) / 5); margin-right: 54px; margin-bottom: 50px; }
.process > ul > li:last-of-type{ margin-right: 0; }
.process > ul > li > figure{ width: 100%; background: #f0f0f0; border-radius: 15px; padding: 30px 0; position: relative; margin: 0;}
.process > ul > li > figure::after{ content: ""; width: 34px; height: 34px; background: url("../../images/arrow.svg") no-repeat center center / contain; position: absolute; top: 50%; right: -27px; transform: translate(50%, -50%); }
.process > ul > li:last-of-type figure::after{ display: none; }
.process > ul > li > p{ font-size: 18px; font-weight: 400; color: #000; letter-spacing: -0.02em; margin-top: 20px;}
.process > ul > li > p span {font-weight: bold; padding-right: 15px; color: #1e7023; font-size: 23px}

@media all and (max-width:1024px) {
    .process > ul > li{ width: calc((100% - 216px) / 4); margin-right: 54px; margin-bottom: 50px; }
}

@media all and (max-width:800px) {
    .process > ul{margin-bottom: -40px; }
    .process > ul > li{ width: calc((100% - 162px) / 3); margin-right: 54px; margin-bottom: 40px; }
}

@media all and (max-width:680px) {
    .process > ul{margin-bottom: -30px; }
    .process > ul > li{ width: calc((100% - 108px) / 2); margin-right: 54px; margin-bottom: 30px; }
    .process > ul > li > p{ font-size: 16px; margin-top: 10px;}
    .process > ul > li > p span {font-size: 20px}
}


/* 고객센터 */
.cscenter-content {padding-bottom: 6%;}

/* 개인정보처리방침 */
.privacy-content {padding-bottom: 100px;}
.privacy-content .privacy_tit {text-align: center; font-size: 43px; font-weight: 600; color: #333; letter-spacing: -1px; margin: 30px 0 }
.privacy-content .strong {position: relative; font-weight: bold; color: #222; display: block; font-size: 16px; margin-bottom: 10px; line-height: 1.5em; padding-left: 20px; word-break: keep-all}
.privacy-content .strong:before {content: ''; position: absolute; top: 7px; left: 0; background: #1b7315; width: 10px; height: 10px; }
.privacy-content .privacy_txt {font-size: 15px; color: #666; line-height: 1.8; margin: 20px 0; letter-spacing: -0.3px; padding-left: 24px; word-break: keep-all;}
.privacy-content .privacy_txt:first-child {padding-left: 0;}










/* *******************************************************
 * 미디어쿼리 시작
******************************************************** */

/* 서브스타일 공통 */
@media all and (max-width:1024px){
    h2.sub_title {font-size: 24px; padding-top: 60px;}
    h2.sub_title:before {width: 2px; height: 40px;}
}
@media all and (max-width:800px){
    /* ----------- REGULATORY:: 공통 :: 상단 타이틀 ------------ */
    .regulatory-top .regulatory-top-inner .regulatory-tit{padding:25px 0 20px; background-color: #fff;}
    .regulatory-top .regulatory-top-inner .regulatory-tit strong{font-size:16px;}
    .regulatory-top .regulatory-top-inner .regulatory-tit strong:after{top:-25px}
    .regulatory-top .regulatory-top-inner .regulatory-tit h3{font-size:30px; margin-top:5px}	
    .regulatory-top .regulatory-top-inner .regulatory_info{padding: 20px;font-size: 14px;}
    /*공통 서브 info text style*/
    .sub-policy-tit{ font-size:18px}
    .sub-policy-tit:before{width: 18px; height: 19px; margin-right: 8px;}
    .sub-policy-txt{ font-size:15px; padding-left:25px}	

    .quality-policy-spirits li{margin-bottom:8px; padding:10px 14px}
    .quality-policy-spirits li strong{font-size:14px; padding-right:10px; width:20px}
    .quality-policy-spirits li strong:after{top:9px}
    .quality-policy-spirits li em{font-size:15px; padding-left:10px; width:calc(100% - 40px)}

    /*=== contect common style ===*/
    .rglt-sec{ margin-top:40px}
    .rglt-sub-tit{ font-size:18px;line-height: 1.5;}
    .rglt-common-txt{ font-size:15px}	
    .rglt-common-txt.plus{margin-bottom: 10px;padding-left: 20px;}
    .rglt-common-txt.plus:before{width: 13px;height: 14px;top: 6px;background-size: cover !important;}
    .table_wrap .tb_info{ font-size:13px}
    .table_wrap table.tb_style1 tr th{ font-size:14px;padding: 15px 5px;}
    .table_wrap table.tb_style1 tr td{ font-size:13px}

    /* ----------- REGULATORY:: 공통 :: dot list 박스 ------------ */
    .dot-list-box > div{width:100%; margin:0 0 2px; padding:15px 15px 18px}
    .dot-list-box > div > div{padding:15px}
    .dot-list-box > div .dot-list li{font-size:14px; padding-left:12px; line-height:1.5}
    .dot-list-box > div .dot-list li:first-child~*{ margin-top:5px}
    .dot-list-box > div .dot-list li:before{width:4px; height:4px; top:10px}

    loListD .clearfix .infoD .mapBt{width: 80px;height: 32px;line-height: 32px;font-size: 11px; right:20px; top:auto; bottom:30px}

    .plus-icon-box.definitions-box{margin:0}
    .plus-icon-box.definitions-box li{float:none; width:100%; margin:0 0 2px}
    .plus-icon-box.definitions-box li .plus-box-inner .plus-box-list dd p br{display:none}
    .plus-icon-box li .plus-box-inner{padding:20px 15px}
    .plus-icon-box li .plus-box-inner .plus-box-list{padding:0 70px 0 20px}
    .plus-icon-box li .plus-box-inner .plus-box-list:before{width:13px; height:14px; top:1px; background-size:cover !important;}
    .plus-icon-box li .plus-box-inner .plus-box-list dt span{font-size:15px;}
    .plus-icon-box li .plus-box-inner .plus-box-list dd p{font-size:14px; margin-top:5px}
    .plus-icon-box li .plus-box-inner .num-bg{font-size:45px; margin-right:15px;}
    .plus-icon-box li .plus-box-inner .plus-box-list dd figure{ padding:0;width:95%; border:0;}



}
@media all and (max-width:600px){
    .regulatory-top .regulatory-top-inner .regulatory-tit strong{ font-size:14px}	
    .regulatory-top .regulatory-top-inner .regulatory-tit h3 { font-size:25px}	
    .sub-policy-tit > span{display: inline-block;width: calc(100% - 35px);}
    .sub-policy-tit:before{ vertical-align:top; top: 5px;}
    .table_scroll_info {display: block; margin-top: 25px; font-size: 13px;color: #c00;text-align: right;}
    .m_tb_scrollWrap{ width:100%; box-sizing:border-box; overflow:hidden; overflow-x:scroll;}
    .m_tb_scrollWrap .table_wrap{ min-width:600px;margin-top:15px}
    /*슬라이드 버튼 style*/
    .product_view_visual_slider_control { width:100%; position:absolute; bottom:0; margin-top:0; background: rgba(255,255,255,0.7);padding: 10px 0;}
    .product_view_visual_slider_control .slick_arrows {display:none;}
    .product_view_visual_slider_control .slick_play_state {display:inline-block;}
    
    /* 표 공통 */
    .table_wrap table.tb_style2 tr .tit {font-size: 16px;}
    .table_wrap table.tb_style2 tr th {font-size: 15px; padding: 8px 0;}
    .table_wrap table.tb_style2 tr td {font-size: 14px;}
    
}
@media all and (max-width:480px){
    h2.sub_title {font-size: 21px; padding-bottom: 6%;}
    
    /*=== contect common style ===*/
    .rglt-sub-tit{ font-size:16px;}
    .rglt-common-txt{ font-size:14px}	
    .table_wrap table.tb_style1 tr th{ font-size:14px;padding: 15px 5px;}
    .table_wrap table.tb_style1 tr td{ font-size:13px}
    .tb_info{margin-top: 10px;font-size: 13px;}
    
     .table_wrap table.tb_style2 tr .tit {font-size: 15px;}
    .table_wrap table.tb_style2 tr th {font-size: 14px; padding: 8px 0;}
    .table_wrap table.tb_style2 tr td {font-size: 13px;}
    
    
}




/* overview[회사개요] */
@media all and (max-width:1200px) {
    .overview-content {padding-bottom: 10%;}
    .overview-content .gp_info {padding: 4%;} 
    .overview-content .history .his_list ul li {font-size: 16px;}
}
@media all and (max-width:1024px) {
    .overview-content .gp_info:before {font-size: 100px;}
}
@media all and (max-width:800px) {
    .overview-content .txt_box {margin-top: 7%;}
    .overview-content .gp_info strong {font-size: 25px;}
    .overview-content .gp_info p {font-size: 15px;}
    .overview-content .history {padding: 7% 0;}
    .overview-content .history .his_title_g {font-size: 56px; width: 100%; margin-bottom: 5%; margin-right: 0;}
    .overview-content .history .his_title_g img {width: 100%;}
    .overview-content .history .his_list {width: 100%; height: 300px;}
}
@media all and (max-width:768px) {
    .overview-content .history .his_list ul li,.overview-content .history .his_list ul li .con p {font-size: 15px;}
    .overview-content .gp_info {box-shadow: 5px 5px 0 #3773d8}
    .overview-content .gp_info:before {font-size: 80px; bottom: -24px;}
    .overview-content .gp_info strong {font-size: 15px;}
    .overview-content .gp_info p {font-size: 13px;}
    
}
@media all and (max-width:480px) {
    .overview-content {padding-bottom: 15%;}
    .overview-content .txt_box {margin-top: 10%;}
    .overview-content .gp_info:before {display: none;}
    .overview-content .history {padding: 10% 0;}
    .overview-content .history .his_title_g {font-size: 43px;}
    .overview-content .history .his_list ul li,.overview-content .history .his_list ul li .con p {font-size: 14px;}
    .history_slide button {font-size: 22px;}
}










/* business[사업분야] */
@media all and (max-width:1200px) {
    
}
@media all and (max-width:1024px) {
    .business-content .section.sc01 {padding: 32px 0;}
}
@media all and (max-width:480px) {
    .business-content .section p {padding: 0 5px;}
    .business-content .section.sc01 {padding: 18px 0;}
    .business-content ul.section.sc03 {flex-wrap: wrap;}
    .business-content ul.section.sc03 li {flex-basis: 100%;}
}
