@charset "utf-8";

#sub #header.active {transform:translateY(0);}
#sub #header.hide {transform:translateY(-100%);}

/* sub-visual */
#sub_layout {padding-top:110px;}
.sub-visual {height:490px; background-repeat:no-repeat; background-size:cover; background-position:center center;}
.sub-visual .title {display:flex; width:100%; height:100%; justify-content:center; align-items:center; text-align:center; color:#fff;}
.sub-visual .title h2 {font-size:60px; line-height:1.2em;}
/* lnb */
#lnb {border-bottom:1px solid #ddd;}
.lnb ul {display:flex;}
.lnb ul li {width:100%; position:relative;}
.lnb ul li:after {content:''; width:1px; height:16px; background:#ddd; position:absolute; top:50%; margin-top:-8px; right:0;}
.lnb ul li:last-child:after {display:none;}
.lnb ul li a {display:flex; width:100%; height:100%; align-items:center; justify-content:center; text-align:center; padding:25px 10px; font-size:20px; line-height:1.5em; color:#bfbfbf; font-weight:600; position:relative; transition:all 0.4s;}
.lnb ul li.active a {color:#c60515;}
.lnb ul li a:hover {color:#c60515;}
.lnb ul li a:after {content:''; width:0; height:2px; background:#c60515; position:absolute; bottom:-1px; left:50%; transition:all 0.4s; z-index:1;}
.lnb ul li.active a:after {width:100%; left:0;}
.lnb ul li a:hover:after {width:100%; left:0;}
/* common */
.real-cont {padding:150px 0 180px;}

.doc-tit {margin-bottom:62px;}
.doc-tit h3 {font-size:60px; line-height:1.2em; color:#000; display:inline-block; position:relative; padding-right:25px;}
.doc-tit h3:after {content:''; width:9px; height:9px; background:#c60515; position:absolute; top:10px; right:0; border-radius:50%;}
.doc-tit p {font-size:28px; line-height:1.4em; color:#666; margin-top:16px;}
/* sub 01 02 */
.history .real-cont {padding-bottom:0;}
.history .img-box {margin-bottom:90px; border-radius:10px; overflow:hidden;}
.history .col {display:flex; position:relative; padding-bottom:300px;}
.history .col:after {content:''; width:1px; height:100%; background:#ddd; position:absolute; top:0; left:539px;}
.history .year {width:100%; max-width:540px; padding:0 100px; position:relative;}
.history .year .tit {position:sticky; top:110px; right:0; display:inline-block;}
.history .year.active .tit {z-index:1;}
.history .year p {font-size:34px; line-height:1.3em; color:#000; font-weight:700; margin-bottom:14px;}
.history .year h4 {font-size:100px; line-height:1.1em; color:#c60515; font-weight:800;}
.history .wrap {width:1%; flex:1 1 auto; padding-left:65px;}
.history .txt-box {margin-bottom:120px; position:relative;}
.history .txt-box:before {content:''; width:50px; height:50px; background:#cb222e; border:20px solid #fff; position:absolute; top:-5px; left:-90px; border-radius:50%; z-index:11;}
.history .txt-box .m-year {display:none;}
.history .txt-box .txt {display:flex; margin-bottom:40px;}
.history .txt-box .txt .month {width:100%; max-width:80px; font-size:26px; line-height:1.5em; color:#000; font-weight:700;}
.history .txt-box .txt p {width:1%; flex:1 1 auto; font-size:26px; line-height:1.5em; color:#666;}
/* sub 01 04 */
.directions .maps {border-radius:10px; overflow:hidden; margin-bottom:66px;}
.directions .maps iframe {width:100%; height:100%;}
.directions .maps .root_daum_roughmap {width:100% !important; height:540px !important;}
.directions .maps .root_daum_roughmap .wrap_map {height:540px !important;}
.directions .maps .root_daum_roughmap .map_border {border:0 !important; width:0 !important; height:0 !important;}
.directions .txt-box {position:relative; padding-right:440px;}
.directions .txt-box dl {display:flex; margin-bottom:16px; font-size:26px; line-height:1.5em;}
.directions .txt-box dt {width:100%; max-width:90px; font-weight:700; color:#000;}
.directions .txt-box dd {width:1%; flex:1 1 auto; color:#666;}
.directions .txt-box dd ul {display:flex;}
.directions .txt-box dd ul li {margin-right:20px; padding-right:20px; position:relative;}
.directions .txt-box dd ul li:after {content:''; width:1px; height:16px; background:#cacaca; position:absolute; right:0; top:50%; margin-top:-8px;}
.directions .txt-box dd ul li:last-child:after {display:none;}
.directions .txt-box dd ul li a {display:block; transition:all 0.4s; color:#666;}
.directions .txt-box dd ul li a:hover {color:#000;}
.directions .txt-box .btn-box {position:absolute; top:0; right:0; max-width:430px; width:100%;}
.directions .txt-box .btn-box ul {display:flex; margin:0 -5px;}
.directions .txt-box .btn-box ul li {padding:0 5px; width:50%;}
.directions .txt-box .btn-box ul li a {display:block; padding:0 30px; line-height:70px; border-radius:10px; color:#fff; transition:all 0.6s; font-size:20px; font-weight:500; position:relative;}
.directions .txt-box .btn-box ul li:nth-child(1) a {background:#c60515;}
.directions .txt-box .btn-box ul li:nth-child(1) a:hover {background:#000;}
.directions .txt-box .btn-box ul li:nth-child(2) a {background:#000;}
.directions .txt-box .btn-box ul li:nth-child(2) a:hover {background:#c60515;}
.directions .txt-box .btn-box ul li a:after {content:''; width:20px; height:20px; position:absolute; top:50%; margin-top:-10px; right:30px; background-repeat:no-repeat; background-size:cover;}
.directions .txt-box .btn-box ul li a.more:after {background-image:url('../img/sub/directions-more.png');}
.directions .txt-box .btn-box ul li a.print:after {background-image:url('../img/sub/directions-print.png');}
/* sub 02 01 */
.program .cnt {padding:160px 0 180px;}
.program .cnt01 .img-box {padding:80px 76px; border-radius:10px; background-image:url('../img/sub/program01.jpg'); height:540px; display:flex; align-items:flex-end; color:#fff; background-repeat:no-repeat; background-size:cover; background-position:center center;}
.program.advantage .cnt01 .img-box {background:url('../img/sub/advantage01.jpg');}
.program .cnt01 .img-box h4 {font-size:44px; line-height:1.2em; font-weight:600; margin-bottom:22px;}
.program .cnt01 .img-box p {font-size:26px; line-height: 1.6em; opacity:0.8;}
.program .wrap .cnt:nth-child(odd) {background:#f6f7fb;}
.program .cnt02 .txt-box {margin-bottom:64px;}
.program .cnt02 .txt-box .point {display:block; font-size:44px; line-height:1.2em; color:#c60515; font-weight:800; margin-bottom:12px;}
.program .cnt02 .txt-box h4 {font-size:38px; line-height:1.4em; color:#000; margin-bottom:34px;}
.program .cnt02 .txt-box p {font-size:26px; line-height:1.6em; color:#666;}
.program .cnt02 .img-box img {border-radius:10px; overflow:hidden; width:100%;}
.program .cnt02 .img-box.col {display:flex; margin:0 -30px;}
.program .cnt02 .img-box.col .row {width:50%; padding:0 30px;}
/* sub 02 02 */
.equipment .real-cont {padding-bottom:0;}
.equipment .tab-menu {margin-bottom:70px;}
.equipment .tab-menu ul {display:flex; margin:0 -5px;}
.equipment .tab-menu ul li {padding:0 5px; width:20%;}
.equipment .tab-menu ul li a {display:flex; align-items:center; justify-content:center; text-align:center; height:70px; border:1px solid #ddd; border-radius:5px; font-size:20px; color:#666; transition:all 0.6s;}
.equipment .tab-menu ul li a:hover {background:#c60515; border-color:#c60515; color:#fff;}
.equipment .tab-menu ul li.active a {background:#c60515; border-color:#c60515; color:#fff; font-weight:600;}
.equipment .title {height:540px; margin-bottom:180px; border-radius:10px; overflow:hidden; display:flex; align-items:flex-end; padding:86px 80px; color:#fff;  position:relative; background-repeat:no-repeat; background-size:cover; background-position:center center;}
.equipment .kiosk .title {background-image:url('../img/sub/equipment-title-bg01.jpg');}
.equipment .projector .title {background-image:url('../img/sub/equipment-title-bg02.jpg');}
.equipment .sensor .title {background-image:url('../img/sub/equipment-title-bg03.jpg');}
/* .equipment .personal .title {background-image:url('../img/sub/equipment-title-bg03.jpg');} */
.equipment .plate .title {background-image:url('../img/sub/equipment-title-bg04.jpg');}
.equipment .autotee .title {background-image:url('../img/sub/equipment-title-bg05.jpg');}
.equipment .title h4 {font-size:44px; line-height:1.3em; font-weight:600; margin-bottom:16px;}
.equipment .title p {font-size:26px; line-height:1.5em; opacity:.8;}
.equipment .cnt {padding:160px 0 180px;}
.equipment .cnt.cnt-bg {background:#f6f7fb;}
.equipment .cnt-tit {margin-bottom:56px;}
.equipment .cnt-tit h4 {font-size:44px; line-height:1.3em; color:#c60515; margin-bottom:8px; font-weight:800;}
.equipment .cnt-tit p {font-size:38px; line-height:1.4em; color:#000; font-weight:700;}
.equipment .sensor .cnt .col {display:flex; align-items:center;}
.equipment .sensor .cnt .col:nth-child(odd) {margin-bottom:50px;}
.equipment .sensor .cnt .col:last-child {margin-bottom:0;}
.equipment .sensor .cnt .col:nth-child(even) {flex-direction:row-reverse;}
.equipment .sensor .cnt .col > div {width:50%;}
.equipment .sensor .cnt .img-box img {border-radius:10px; overflow:hidden;}
.equipment .sensor .cnt .txt-box {padding:0 60px;}
.equipment .sensor .cnt .col:nth-child(even) .txt-box {padding-left:80px;}
.equipment .sensor .cnt .txt-box li {font-size:26px; line-height:1.5em; color:#666; position:relative; padding-left:25px; margin-bottom:2px;}
.equipment .sensor .cnt .txt-box li:before {content:''; width:6px; height:6px; background:#c60515; position:absolute; top:16px; left:0; border-radius:50%;}
.equipment .cnt-img img {border-radius:10px; overflow:hidden;}
.equipment .table {margin-top:50px; background:#fff; border-radius:10px; overflow:hidden;}
.equipment .table table {width:100%; border-spacing:0; border-collapse:collapse;}
.equipment .table table th {background:#000; color:#fff; font-size:28px; height:120px; position:relative; line-height:1.4em;}
.equipment .table table th:after {content:''; width:calc(100% - 60px); height:1px; position:absolute; bottom:0; left:30px; background:rgba(255,255,255,0.3);}
.equipment .table table tr:last-child th:after {display:none;}
.equipment .table table tr:first-child th {height:140px; padding-top:20px; border-radius:0 10px 0 0;}
.equipment .table table tr:last-child th {height:140px; padding-bottom:20px; border-radius:0 0 10px 0;}
.equipment .table table td {font-size:26px; line-height:1.5em; color:#666; padding:20px 50px; border-bottom:1px solid #ddd;}
.equipment .table table tr:first-child td {}
.equipment .table table tr:last-child td {border-bottom:0;}
.equipment .autotee .col {display:flex; margin:0 -30px;}
.equipment .autotee .col .row {width:50%; padding:0 30px;}
/* sub 03 list */
.store-list .col {margin-bottom:50px; padding:60px; background:#f6f6f6; border-radius:10px; display:flex;}
.store-list .col:last-child {margin-bottom:0;}
.store-list .col .img-box {width:100%; max-width:488px;}
.store-list .col .img-box .pic {position:relative; height:0; padding-bottom:65.57%; overflow:hidden; transition:all 0.6s; border-radius:10px;}
.store-list .col .img-box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.program .cnt .img-box video{width: 100%; border-radius: 10px;}
.store-list .col .txt-box {width:1%; flex:1 1 auto; padding-left:60px;}
.store-list .col .txt-box .tit {margin-bottom:48px;}
.store-list .col .txt-box .tit h4 {font-size:34px; line-height:1.3em; color:#000; font-weight:600; margin-bottom:36px;}
.store-list .col .txt-box .tit dl {display:flex; font-size:26px; line-height:1.5em; margin-bottom:2px;}
.store-list .col .txt-box .tit dt {width:100%; max-width:110px; font-weight:600; color:#000; position:relative; padding-left:36px;}
.store-list .col .txt-box .tit dt:before {content:''; width:24px; height:24px; position:absolute; left:0; top:6px; background-repeat:no-repeat; background-size:cover; background-position:center center;}
.store-list .col .txt-box .tit dt.tel:before {background-image:url('../img/sub/store-tel.png');}
.store-list .col .txt-box .tit dt.address:before {background-image:url('../img/sub/store-address.png');}
.store-list .col .txt-box .tit dd {width:1%; flex:1 1 auto; color:#666;}
.store-list .col .txt-box .btn {text-align:right;}
.store-list .col .txt-box .btn a {display:inline-block; width:200px; background:#000; line-height:66px; padding:0 20px; position:relative; color:#fff; font-size:20px; font-weight:500; transition:all 0.6s; border-radius:10px; text-align:left;}
.store-list .col .txt-box .btn a:hover {background:#c60515;}
.store-list .col .txt-box .btn a:after {content:''; width:14px; height:14px; background-image:url('../img/sub/store-more.png'); background-repeat:no-repeat; background-size:cover; position:absolute; top:50%; margin-top:-7px; right:32px; transition:all 0.6s;}
.store-list .col .txt-box .btn a:hover:after {transform:rotate(45deg); background-image:url('../img/sub/store-more-on.png'); right:24px;}
/* sub 03 view */
.store-view .col {margin-bottom:70px; padding:60px; background:#f6f6f6; border-radius:10px; display:flex; align-items:center;}
.store-view .col:last-child {margin-bottom:0;}
.store-view .col .img-box {width:100%; max-width:488px;}
.store-view .col .img-box .pic {position:relative; height:0; padding-bottom:65.57%; overflow:hidden; transition:all 0.6s; border-radius:10px;}
.store-view .col .img-box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.store-view .col .txt-box {width:1%; flex:1 1 auto; padding-left:60px;}
.store-view .col .txt-box h4 {font-size:34px; line-height:1.3em; color:#000; font-weight:600; margin-bottom:36px;}
.store-view .col .txt-box dl {display:flex; font-size:26px; line-height:1.5em; margin-bottom:2px;}
.store-view .col .txt-box dt {width:100%; max-width:110px; font-weight:600; color:#000; position:relative; padding-left:36px;}
.store-view .col .txt-box dt:before {content:''; width:24px; height:24px; position:absolute; left:0; top:6px; background-repeat:no-repeat; background-size:cover; background-position:center center;}
.store-view .col .txt-box dt.tel:before {background-image:url('../img/sub/store-tel.png');}
.store-view .col .txt-box dt.address:before {background-image:url('../img/sub/store-address.png');}
.store-view .col .txt-box dd {width:1%; flex:1 1 auto; color:#666;}
.store-view .text-box {padding:70px 40px; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
.store-view .text-box p {font-size:26px; line-height:1.5em; color:#666; word-break:break-all;}
/* sub 04 */
.found {margin-bottom:180px;}
.found .col {display:flex; margin:0 -13px;}
.found .col.reverse {flex-direction:row-reverse;}
.found .col .row {padding:0 13px; position:relative; width:25%; margin-bottom:26px;}
.found .col .row:after {content:''; width:56px; height:56px; background-color:#c60515; border-radius:50%; position:absolute; top:50%; margin-top:-28px; right:-28px; z-index:11; background-image:url('../img/sub/found-arrow.png'); background-repeat:no-repeat; background-position:center center; background-size:cover;}
.found .col.non-rev .row:last-child:after {top:auto; bottom:-36px; margin-top:0; right:50%; margin-right:-28px; transform:rotate(90deg);}
.found .col.reverse .row:first-child:after {display:none;}
.found .col.reverse .row:after {transform:rotate(180deg);}
.found .inner {border:1px solid #ddd; border-radius:10px; overflow:hidden; background:#fff; padding:40px 50px 74px; position:relative; height:100%;}
.found .inner .num {font-size:18px; line-height:1.6em; color:#c60515; font-weight:800; margin-bottom:2px;}
.found .inner h4 {font-size:30px; line-height:1.3em; color:#000; margin-bottom:16px;}
.found .inner p {font-size:26px; line-height:1.5em; color:#666;}
.found .inner .icon {position:absolute; bottom:-2px; right:-1px; opacity:.1;}

/* 갤러리 커스텀 */
.custom-list {}
.custom-list ul {display:flex; flex-wrap:wrap; margin:0 -24px;}
.custom-list ul li {width:33.3333333%; padding:0 24px; margin-bottom:60px;}
.custom-list ul li a {display:block;}
.custom-list ul li a .thumb {margin-bottom:36px;}
.custom-list ul li a .thumb .pic {position:relative; height:0; padding-bottom:70%; overflow:hidden; transition:all 0.6s; border-radius:10px;}
.custom-list ul li a .thumb .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.custom-list ul li a .thumb .pic .over {position:absolute; top:0; left:0; width:100%; height:100%; transition:all 0.6s; background:rgba(198,5,21,0.8); display:flex; align-items:center; justify-content:center; text-align:center; opacity:0;}
.custom-list ul li a:hover .thumb .pic .over {opacity:1;}
.custom-list ul li a .thumb .pic .over span {display:inline-block; font-size:24px; line-height:1.6em; color:#fff; font-weight:500; position:relative; padding-right:40px;}
.custom-list ul li a .thumb .pic .over span:before {content:''; width:20px; height:20px; background:url('../img/sub/custom-list-more.png') no-repeat; background-size:cover; position:absolute; top:50%; margin-top:-10px; right:0;}
.custom-list ul li a .tit {text-align:center; font-size:26px; line-height:1.5em; padding:0 10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

.custom-list.patent-list ul li a {cursor:default;}
.custom-list.patent-list ul li a .thumb .pic {padding-bottom:141.452%;}

.custom-list ul li.none { width:100%; border-top:1px solid #000; border-bottom:1px solid #ddd; text-align:center; font-size:26px; color:#000; line-height:1.5em; padding:60px 24px;}

/* sub 04 view 답변 */
.answer-box {padding-top:100px; margin-top:26px; border-top:1px solid #ddd;}
.answer-box .answer-tit {font-size:26px; line-height:1.5em; color:#000; margin-bottom:18px;}
.answer-box .answer {font-size:26px; line-height:1.5em; color:#666;}

/* sub 01 01 */
.greeting .col {display:flex;}
.greeting .col > div {width:50%;}
.greeting .img-box {padding-right:50px;}
.greeting .img-box img {border-radius:10px; overflow:hidden;}
.greeting .txt-box h4 {font-size:36px; line-height:1.1em; color:#000; font-weight:600; margin-bottom:50px;}
.greeting .txt-box p {font-size:26px; line-height:1.5em; color:#666; margin-bottom:42px;}
.greeting .txt-box p:last-child {margin-bottom:60px;}
.greeting .txt-box .txt {text-align:right; font-size:26px; line-height:1.5em; color:#000; font-weight:500;}
.greeting .txt-box .txt strong {font-size:40px; line-height:1.1em; font-weight:700; display:inline-block; margin-left:24px;}