@charset "utf-8";
html {overflow-y:scroll;}
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.ceo .box {display:flex; position:relative;}
.ceo .box:after {position:absolute; content:''; top:45px; bottom:-50px; left:0px; right:0; background-color:#f2f2f2; z-index:-1;}
.ceo .box .right {padding-top:115px; padding-left:90px; position:relative; flex:1;}
.ceo .box .right strong {font-size:30px; margin-bottom:15px; letter-spacing:-.03em; line-height:1em; color:#c9252c; display:block;}
.ceo .box .right p {font-size:22px; margin-bottom:90px; font-weight:500; color:#282828; letter-spacing:-.03em; line-height:1.4em;}
.ceo .box .right .name {color:#282828; font-weight:500;}
.ceo .box .right .name img {margin:-3px 0 0 15px;}
.ceo .box .right .logo {position:absolute; bottom:0px; right:80px;}
.ceo .cnt {display:flex; margin:0 -20px;}
.ceo .cnt .group {padding:0 20px; width:50%;}
.ceo .cnt .group p {margin-bottom:40px; line-height:1.7em; letter-spacing:-.03em;}
.ceo .cnt .group.first p {margin-bottom:30px;}
.ceo .cnt .group p:last-child {margin-bottom: 0 !important;}
/* .ceo .cnt .group.first p {margin-bottom: 76px;} */

.fancybox-margin {margin-right: 0 !important;}

.doc-cnt100 {margin-bottom:100px;}

.fz17 {font-size:17px;}
.fz18 {font-size:18px;}

#history .tab-title {display:flex; justify-content:center; margin-bottom:15px;}
#history .tab-title li {width:25%; display:flex;align-items:center; justify-content:center; position:relative; background-color:#fff; transition:all 0.4s;}
#history .tab-title li:after{content:""; display:block; position:absolute; left:50%; transform:translateX(-50%); transition:all 0.4s; width:0; height:2px; background:#c9252c; bottom:0;}
#history .tab-title li a {font-size:18px; padding:25px 0; border-bottom:1px solid #ddd; width:100%; display:flex; justify-content:center; transition:all 0.4s;}
#history .tab-title li:hover a,
#history .tab-title li.on a {color:#c9252c;}
#history .tab-title li:hover:after,
#history .tab-title li.on::after {width:100%;}

#history .tab-box {padding-bottom: 50px; position:relative; overflow: hidden;}
#history .history-bar,
#history .history-bar > span {position:absolute; width:1px; left:50%; transform:translateX(-50%);}
#history .history-bar {height:100%; background:#ddd; z-index:-2;}
#history .history-bar > span {background:#c9252c; height:20px; top:0;}
#history .tab-cnt {text-align:center;}
#history .tab-cnt > h4 {font-size:60px; padding:80px 0; letter-spacing:-.03em; color:#ddd; line-height:1em; font-weight:700; display:block; position:relative;}
#history .tab-cnt > h4:before {content:""; display:block; width:100%; position:absolute; top:0; bottom:0; background:#fff; z-index:-3;}

#history .tab-box dl {width:50%; padding:0 40px 60px; text-align:left; margin:0 0 0 auto; box-sizing:border-box;}
#history .tab-box dl.last {padding-bottom:0;}
#history .tab-box dl dt {color:#c9252c; font-size:25px; font-weight:700; position:relative;}
#history .tab-box dl dt:before {content:""; display:inline-block; width:8px; height:8px; border-radius:50%; background:#c9252c; position:absolute; top:50%; transform:translateY(-50%); left:-44px;}
#history .tab-box dl dt:after {content:""; display:inline-block; width:21px; height:21px; border-radius:50%; border:1px solid #ddd; position:absolute; top:50%; transform:translateY(-50%); left:-50px;}
#history .tab-box dl dd {padding:15px 0 0;}

#history .tab-box dl dd p {padding-left:15px; position:relative; line-height:1.625em;}
#history .tab-box dl .right_point p {padding-right:15px;}
#history .tab-box dl dd p span {width:100%; display:block; font-size:16px;}
#history .tab-box dl dd p:before {content:""; display:block; position:absolute; left:0; top:9px; width:5px; height:5px; border-radius:50%; background:#454545;}
#history .tab-box dl .right_point p:before {left:unset;right:0;}
#history .tab-box .left_point dd p {padding:11px 0 11px 20px;}
#history .tab-box .left_point dd p:before {right:unset; left:0;}
#history .tab-box dl.reverse {margin:0;text-align:right;}
#history .tab-box dl.reverse dt:before {left:auto; right:-44px;}
#history .tab-box dl.reverse dt:after {left:auto; right:-50px;}
#history .tab-box dl.reverse dd p {flex-direction:row-reverse;}

.root_daum_roughmap {width:100% !important;}

.local-top {margin-bottom:55px; text-align:center;}
.local-top p {font-size:17px; margin-bottom:5px; font-weight:500; letter-spacing:-.03em; color:#282828;}
.local-top ul {display:flex; justify-content:center}
.local-top ul li {padding:0 20px; position:relative;}
.local-top ul li:after {position:absolute; content:''; width:1px; height:11px; background-color:#454545; top:7px; right:0;}
.local-top ul li:last-child:after {display:none;}

.local {margin-top:30px; border-top:2px solid #242424;}
.local .group {padding:30px 0; display:flex; align-items:center; border-bottom:1px solid #ddd;}
.local .group:last-child {border-bottom:0; padding-bottom:0;}
.local .group .icon {margin:0 22px;}
.local .group .cnt ul li {margin-bottom:15px;}
.local .group .cnt ul li:last-child {margin-bottom:0;}
.local .group:last-child .cnt ul li:last-child {margin-bottom:0; padding-left: 55px; text-indent: -55px;}
.local .group:last-child .cnt ul li:last-child span {text-indent: 0;}
.local .group .cnt ul li span {font-size:14px; padding:0 6px; min-width:45px; margin-right:10px;line-height:20px; text-align:center; border-radius:30px; color:#fff; display:inline-block;}
.local .group .cnt ul li span.bgc1 {background-color:#3495df;}
.local .group .cnt ul li span.bgc2 {background-color:#263c96;}
.local .group .cnt ul li span.bgc3 {background-color:#00afbd;}

.fw500 {font-weight:500;}

.machine-list {display:flex; margin:0 -8px 100px;}
.machine-list li {padding:0 8px; width:16.6666%; text-align:center; position:relative; overflow:hidden;}
.machine-list li a {height:313px; overflow:hidden; color:#fff; position:relative; display:flex; flex-direction:column; justify-content:center; align-items:center; transition: .3s ease-in-out;}
.machine-list li a .bg {transition: .6s; background-size:cover; background-repeat:no-repeat; background-position:center; position:absolute; top:0; right:0; left:0; bottom:0; z-index:-1; filter:grayscale(70%);}
.machine-list li a .tit {font-size:23px; margin-top:55px; font-weight:700; letter-spacing:-.03em; display:inline-block; line-height:1.2em;}
.machine-list li a .go {width:110px; height:35px; margin:45px auto 0; font-weight:500; letter-spacing:-.03em; transition: .3s ease-in-out; align-items:center; justify-content:center; border:2px solid #fff; border-radius:30px; display:flex;}
.machine-list li:hover a {transition: .3s ease-in-out;}
.machine-list li a:after {position:absolute; content:''; top:0; left:0; right:0; bottom:0; border:4px solid #c9252c; opacity:0; transition: .3s ease-in-out;}
.machine-list li:hover a:after {opacity:1; transition: .3s ease-in-out;}
.machine-list li:hover a .bg {filter:none;}
.machine-list li:hover a .tit {/* border-bottom:1px solid #fff; */ text-decoration:underline;}
.machine-list li:hover a .go {background-color:#c9252c; border-color:#c9252c; transition: .3s ease-in-out;} 

.machine-list li a:hover .bg {transform:scale(1.1); transition: .6s;}

.txt-img-list .group {padding:100px 0;}
.txt-img-list .group:nth-child(odd) {background-color:#f8f8f8;}
.txt-img-list .group .wrap {display:flex; align-items:center;}
.txt-img-list .group .img {padding-right:133px;}
.txt-img-list .group:nth-child(even) .wrap .img {padding-left:133px; order:2; padding-right:0;}
.txt-img-list .group .txt {flex:1;}
.txt-img-list .group .txt .tit {font-size:32px; margin-bottom:15px; font-weight:600; color:#282828; letter-spacing:-.03em; line-height:1.2em;}
.txt-img-list .group .txt p {line-height:1.5em; color:#282828; letter-spacing:-.03em; text-align: justify;}

.txt-img-list .group .img.type2 {padding-right:100px;}
.txt-img-list .group:nth-child(even) .wrap .img.type2 {padding-left:90px;}
.txt-img-list ul {margin-top:10px;}
.txt-img-list li {letter-spacing:-.04em; line-height:1.5em;}

.txt-img-list .group .go-page {font-size:17px; width:258px; height:55px; padding:0 25px 0 30px; margin:100px auto 50px; border-radius:30px; align-items:center; justify-content:space-between;letter-spacing:-.03em; color:#fff; background-color:#c9252c; display:flex;}

.machine-pro {display:flex;}
.machine-pro .col-l {padding-top:100px; flex:1 150px; width:1%; max-width:150px; margin-right:60px; text-align:center; border-left:1px solid #ddd; border-right:1px solid #ddd;}
/* .machine-pro .col-l ul {padding:0 30px;} */
.machine-pro .col-l ul li {font-size:17px; letter-spacing:-.03em; font-weight:500;}
.machine-pro .col-l ul li.preview.active a,
.machine-pro .col-l ul li.preview:hover a {color:#fff; background-color:#c9252c;}
.machine-pro .col-l ul li.preview {margin:0 30px 35px;}
.machine-pro .col-l ul li.preview a {height:40px; display:flex; align-items:center; justify-content:center; background-color:#eee; border-radius:10px;}
.machine-pro .col-l ul li.item {margin-bottom:30px;}
.machine-pro .col-l ul li.item a .icon {width:70px; height:70px; margin:0 auto; background-size:contain; background-repeat:no-repeat; transition: .3s ease-in-out;}
.machine-pro .col-l ul li.item a .icon1 {background-image:url('../images/sub/pro_icon1.png');}
.machine-pro .col-l ul li.item a .icon2 {background-image:url('../images/sub/pro_icon2.png');}
.machine-pro .col-l ul li.item a .icon3 {background-image:url('../images/sub/pro_icon3.png');}
.machine-pro .col-l ul li.item a .icon4 {background-image:url('../images/sub/pro_icon4.png');}
.machine-pro .col-l ul li.item a .icon5 {background-image:url('../images/sub/pro_icon5.png');}
.machine-pro .col-l ul li.item a .icon6 {background-image:url('../images/sub/pro_icon6.png');}

.machine-pro .col-l ul li.item:hover a .icon {transition: .3s ease-in-out;}
.machine-pro .col-l ul li.item:hover a .icon1,
.machine-pro .col-l ul li.item.active a .icon1 {background-image:url('../images/sub/pro_icon1_on.png');}
.machine-pro .col-l ul li.item:hover a .icon2,
.machine-pro .col-l ul li.item.active a .icon2 {background-image:url('../images/sub/pro_icon2_on.png');}
.machine-pro .col-l ul li.item:hover a .icon3,
.machine-pro .col-l ul li.item.active a .icon3 {background-image:url('../images/sub/pro_icon3_on.png');}
.machine-pro .col-l ul li.item:hover a .icon4,
.machine-pro .col-l ul li.item.active a .icon4 {background-image:url('../images/sub/pro_icon4_on.png');}
.machine-pro .col-l ul li.item:hover a .icon5,
.machine-pro .col-l ul li.item.active a .icon5 {background-image:url('../images/sub/pro_icon5_on.png');}
.machine-pro .col-l ul li.item:hover a .icon6,
.machine-pro .col-l ul li.item.active a .icon6 {background-image:url('../images/sub/pro_icon6_on.png');}

.machine-pro .col-l ul li.item.active a p {margin-top:7px; line-height:1.2em;}
.machine-pro .col-l ul li.item.active a p,
.machine-pro .col-l ul li.item:hover a p {color:#c9252c;}

.machine-pro .col-r {padding-bottom:150px; flex:1;}

.sub-title.space-left h2 {line-height:1em;}

.product-image {position:relative;}
.product-image .slick-arrow {position:absolute; top:50%; margin-top:-15px; width:17px; height:29px; z-index:20; border:0; font-size:0; line-height:0; background-color:transparent; background-position:50% 50%; background-repeat:no-repeat; background-size:100% 100%;}
.product-image .slick-prev {left:20px; background-image:url("../images/sub/pro_prev.png");}
.product-image .slick-next {right:20px; background-image:url("../images/sub/pro_next.png");}

.product-image .slick-dots {position:absolute; bottom:-10px; text-align:center; width:100%; line-height:0;}
.product-image .slick-dots li {position:relative; display:inline-block; padding:0 7px; border:0; background:transparent;}
.product-image .slick-dots li button {width:11px; height:11px; position:relative; border-radius:50%; font-size:0; border:0; background:transparent; text-indent:-9999px;}
.product-image .slick-dots li button:after {width:11px; height:11px; background-color:#ddd; content:" "; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border-radius:50%;}
.product-image .slick-dots li.slick-active button:after {width:17px; border-radius:30px; background:#c9252c;}

.detail-paginate {margin:-10px 0 60px; border-bottom:1px solid #ddd;}
.detail-paginate ul {display:flex; justify-content:flex-end;}
.detail-paginate ul li {padding:0 28px 8px;}
.detail-paginate ul li a {font-size:17px; font-weight:500; color:#282828; position:relative;}
.detail-paginate ul li.active a,
.detail-paginate ul li:hover a {color:#c9252c;}
.detail-paginate ul li.active a:after,
.detail-paginate ul li:hover a:after {position:absolute; content:''; width:100%; height:2px; bottom:-14px; left:0; background-color:#c9252c;}
.detail-paginate ul li:last-child {padding-right:0;}

.product-info {font-size:17px; letter-spacing:-.03em; line-height:1.529em;}
.product-info .info-explain {margin-bottom:45px; font-weight:500;}
.product-info .info-explain span {color:#b5b5b5; font-size: 18px;}
.product-info .info-explain p {color:#282828;}
.product-info .group {margin-bottom:45px;}
.product-info .group:last-child {margin-bottom:0;}
.product-info .group .title {font-weight:500; color:#c9252c;}
.product-info .group .txt ul li {padding-left:7px; position:relative;}
.product-info .group .txt ul li:before {position:absolute; content:''; width:3px; height:3px; top:10px; left:0; background-color:#282828; border-radius:100%;}

.b2c-list {display:flex; margin:0 -18px;}
.b2c-list li {padding:0 18px; flex:1;}

.affiliate .group {padding:95px 0; border-top:1px solid #ddd; display:flex; align-items:center;}
.affiliate .group:last-child {padding-bottom:0;}
.affiliate .group .cnt {padding-left:105px; flex:1; position:relative;}
.affiliate .group .cnt .name {font-size:28px; font-weight:600; color:#282828; letter-spacing:-.02em; line-height:1.3em;}
.affiliate .group .cnt p {font-size:17px; margin:15px 0 20px; letter-spacing:-.02em; line-height:1.647em;}
.affiliate .group .cnt a {font-size:17px; width:210px; height:55px; padding:0 20px 0 30px; position:absolute; bottom:5px; right:0; border:1px solid #ddd; letter-spacing:-.03em; justify-content:space-between; display:flex; align-items:center;}
.affiliate .group .cnt a:after {width:22px; height:15px; right:20px; top:50%; margin-top: -7px; background-image:url('../images/sub/arrow2.png'); background-size:contain; background-repeat:no-repeat; position:absolute; content:'';}
.affiliate .group .cnt a:hover {color: #fff; background-color: #c9252c; border-color:#c9252c;}
.affiliate .group .cnt a:hover:after {background-image:url('../images/sub/arrow2_on.png');}

.client {margin:0 -12px -24px; display:flex; flex-wrap:wrap;}
.client li {padding:0 12px 24px; width:20%;}

.required {font-size:17px; color:#c9252c; font-weight:500;}

.essential {margin-bottom:5px; text-align:right;}

.padr25 {padding-right:25px;}

.sub04-cont {display:flex;}
.sub04-cont .img {order:2;}
.sub04-cont .cnt {margin-top:75px; padding:50px 0 0 50px; flex:1; background-color:#f8f8f8;}
.sub04-cont .cnt b {font-size:13px; color:#c9252c; font-weight:500; letter-spacing:-.03em; display:block;}
.sub04-cont .cnt strong {font-size:33px; margin:15px 0; font-weight:700; letter-spacing:-.03em; color:#282828; display:block;}
.sub04-cont .cnt p {font-size:25px; font-weight:500; letter-spacing:-.03em; line-height:1.2em;}
.sub04-cont .cnt span {margin-top:15px; display:block;}

.procedure {display:flex; margin:0 -22px;}
.procedure li {padding:0 22px; width:20%; position:relative;}
.procedure li:after {width:17px; height:30px; right:-8px; top:50%; transform:translateY(-50%); background-image:url('../images/sub/arrow3.png'); background-size:contain; background-repeat:no-repeat; position:absolute; content:'';}
.procedure li:last-child:after {display:none;}
.procedure li .box {min-height:321px; border:1px solid #ddd; border-radius:15px;}
.procedure li .box .num {width:27px; height:27px; line-height:27px; margin:15px 15px 0; background-color:#c9252c; border-radius:100%; text-align:center; color:#fff;}
.procedure li .box .icon {margin-bottom:15px; margin-top:40px; text-align:center;}
.procedure li .box strong {font-size:21px; margin-bottom:4px;font-weight:500; color:#282828; text-align:center; display:block;} 
.procedure li .box p {font-size:17px; letter-spacing:-.03em; line-height:1.6em; text-align:center;}
.procedure li .box a {width:130px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:8px; margin:15px auto 0; color:#fff; background-color:#c9252c;}
.procedure li:nth-child(3) .box .icon {margin-left:17px;}

.sub04-cont2 {display:flex;}
.sub04-cont2 .img {order:2;}
.sub04-cont2 .cnt {margin-top:30px; padding:50px 0 0 50px; background-color:#f8f8f8; flex:1;} 
.sub04-cont2 .cnt strong {font-size:25px; font-weight:600; letter-spacing:-.03em; color:#282828; line-height:1.2em; display:block;}
.sub04-cont2 .cnt p {margin-top:20px; line-height:1.5em; letter-spacing:-.04em;}

.talent {padding:110px 0 140px; text-align:center; background-color:#f8f8f8;}
.talent .wrap ul {margin:0 -80px 100px; display:flex;}
.talent .wrap ul li {padding:0 80px; width:33.3333%; position:relative;}
.talent .wrap ul li:after {position:absolute; content:''; width:1px; top:50px; bottom:85px; right:0; background-color:#ddd;}
.talent .wrap ul li:last-child:after {display:none;}
.talent .wrap ul li .icon {margin-bottom:45px;}
.talent .wrap ul li strong {font-size:25px; margin-bottom:10px; font-weight:600; letter-spacing:0; color:#282828; line-height:1.2em; display:block;}
.talent .wrap ul li p {font-size:17px; text-align:left; letter-spacing:-.03em;}
.talent .last-txt strong {font-size:30px; font-weight:500; color:#c8242c; letter-spacing:-.03em; line-height:1.3em;}
.talent .last-txt p {font-size:22px; letter-spacing:-.03em; line-height:1.5em;}

.recruitment .table table {border-top:2px solid #282828; text-align:center; border-collapse:collapse; width:100%;}
.recruitment .table table th,
.recruitment .table table td {padding:15px 0; border-bottom:1px solid #ddd; border-right:1px solid #ddd;}
.recruitment .table table th:last-child,
.recruitment .table table td:last-child {border-right:0;}
.recruitment .table table th {background-color:#f8f8f8; color:#282828; line-height:1.412em;}
.recruitment .table table td {font-size: 15px; line-height:1.625em;}

.sub0502-cont-1 {padding-bottom:80px; background-color:#f8f8f8;}
.sub0502-cont-1 .sub-title2 {padding-top: 70px;}
.sub0502-cont-1 ul {display:flex; margin:0 -30px;}
.sub0502-cont-1 ul li {padding:0 30px; width:16.6666%; text-align:center;}
.sub0502-cont-1 ul li .icon {margin-bottom:20px;}
.sub0502-cont-1 ul li .num {font-size:20px; margin-bottom:15px; border-bottom:1px solid #ddd; font-weight:500; letter-spacing:-.03em; color:#282828; line-height:1.7em;}
.sub0502-cont-1 ul li p {font-weight:500; line-height:1.25em;}

.table2 table {border-top:2px solid #282828; border-collapse:collapse; width:100%;}
.table2 table th,
.table2 table td {padding:20px 0; border-bottom:1px solid #ddd;}
.table2 table th {background-color:#f8f8f8; text-align:center; border-right:1px solid #ddd;}
.table2 table td {padding-left:50px;}

.bg-cnt {padding:64px 0; background-image:url('../images/sub/sub0502bg.jpg'); background-size:cover; background-repeat:no-repeat; text-align:center;}
.bg-cnt p {font-size:20px; margin-bottom:20px; font-weight:500; color:#fff; line-height:1.4em;}
.bg-cnt p:last-child {margin-bottom:0;}

.list-ti {padding-left: 72px; text-indent: -72px; line-height:1.5em;}



/* .korea */
.nation-circle .variety-list li.nation-txt{margin-right: 8px}
.nation-circle .variety-list li:last-child{margin-right: 0}
.nation-circle .list-con .nation-txt em.suwon::after{content:"OSAN"}
.nation-circle .list-con .nation-txt em.seoul::after{content:"SEOUL"}
.nation-circle .korea-area span{top: 134px; left: 10px}
.nation-circle .korea-area i{top:147px; left:22%}
.nation-circle .korea-area i::before{left:50%; bottom: 1px; height: 120px}
/* 파장효과 */
.wave {
  opacity: .5;
  position: absolute;
  top: 31.7%;
  left: 37.7%;
  border: 1px solid #fdb913;
  background-color:rgba(253,185,19,.2);
  width: 85px;
  height: 85px;
  border-radius: 100%;
  -webkit-animation: drift 3000ms infinite linear;
          animation: drift 3000ms infinite linear;
}
.wave.three {-webkit-animation: drift 3000ms infinite linear;animation: drift 3000ms infinite linear}
.wave.two {-webkit-animation: drift 4000ms infinite linear;animation: drift 4000ms infinite linear;opacity: .1; border: 1px solid #fdb913;background-color:rgba(253,185,19,.8);}

@-webkit-keyframes drift {
  from {-webkit-transform: scale(0,0); transform: scale(0,0);opacity: 1}
  to { -webkit-transform: scale(1.1); transform: scale(1.1);opacity: 0;}
}
@keyframes drift {
	from {-webkit-transform:scale(0,0);transform: scale(0,0); opacity: 1}
	to {-webkit-transform: scale(1.1);transform:  scale(1.1);opacity: 0;}
}

.map-bg {position: relative;}
.map-bg .map {position: absolute; }
.map-bg .map1 {top: -20px; left:100px;}
.map-bg .map2 {top:214px; left: 20px;}
.map-bg .map3 {top: 236px; left: 156px;}
.map-bg .map4 {top: 310px; left: 185px;}
.map-bg .map5 {top: 270px; left: 370px;}
.map-bg .map6 {top: 335px; left: 558px;}
.map-bg .map7 {top: 275px; left: 575px;}
.map-bg .map8 {top: 60px; right: 250px;}
.map-bg .map9 {top: 246px; right: 80px;}

.only-mobile-map {display: none;}
