@charset "utf-8";
/* *******************************************************
 * filename : content.css
 * description : 서브페이지 컨텐츠 CSS
 * date : 2018-01-16
******************************************************** */

/* ******************  공통 ********************** */
/* -------- 공통 레이아웃 -------- */
/* 공통레이아웃 :: 기본Parallax */
.parallax-container-wrapper{font-size:20px; color:#fff;}
.parallax-container{position:relative; height:100vh; background-size:cover !important; box-sizing:border-box; }
.parallax-fixed .parallax-container{background-attachment:fixed !important; }
.parallax-container.v-center{display:flex; align-items:center; text-align:center; }
.no-prarallax-container{position:relative; background-color:#fff;}
/* 공통레이아웃 :: first section fixed */
.parallax-fixed-wrapper{position:relative; min-height:100vh; padding-top:100vh; }
.parallax-fixed-container{position:absolute; top:0; left:0; width:100%; height:100vh; background-size:cover !important; box-sizing:border-box; }
.parallax-fixed .parallax-fixed-container{position:fixed;}
.parallax-fixed-container + .parallax-container{position:relative;}
.parallax-fixed-bg{position:absolute; top:0px; left:0px; width:110%; margin-left:-5%; height:100%; background-size:cover !important;}
/* 공통레이아웃 :: 왼쪽NAV */
#scrollNavBar{position:fixed; width:100px; top:50%; transform:translateY(-50%); opacity:0; left:-100px; transition:all 0.5s}
#scrollNavBar.fixed{left:0; opacity:1; }
#scrollNavBar ul li {width:10px; padding:10px 0; margin:0 auto;}
#scrollNavBar ul li .nav-menu-btn{position:relative; display:block;}
#scrollNavBar ul li .nav-menu-btn:before{display:block; width:10px; height:10px; border:1px solid #eee; vertical-align:top; box-sizing:border-box; content:""; transition:all 0.3s}
#scrollNavBar ul li .nav-menu-btn span{position:absolute; left:100%; top:-2px;color:#fff; width:100px; font-size:15px; opacity:0.25; font-weight:600; letter-spacing:-0.5px; margin-left:20px; font-family:'NanumSquare', "나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif; transition:all 0.4s }
#scrollNavBar ul li.selected .nav-menu-btn:before{background-color:#eee;}
#scrollNavBar ul li.selected .nav-menu-btn span{opacity:1.0}
/* -------- 공통 버튼 -------- */
.cm-sub-tit-style01{color:#e60044; font-size:22px; margin-bottom:1em; color:#e60044; font-weight:700;letter-spacing:-0.75px;}
.cm-sub-tit-style01.kr{font-weight:600;}

/* -------- 공통 스크롤아이콘 -------- */
.cm-scroll-icon{position:absolute; bottom:30px; left:50%; text-align:center; transform:translateX(-50%)}
.cm-scroll-icon .scroll-txt{display:block; color:#fff; letter-spacing:2px; font-size:0; font-weight:600; margin-bottom:10px;  }
.cm-scroll-icon .scroll-txt em{font-size:12px; display:inline-block; animation: scroll-down-ani 2s ease-in-out 0s infinite;}
.cm-scroll-icon .scroll-txt em:nth-child(1){animation-delay:1s;}
.cm-scroll-icon .scroll-txt em:nth-child(2){animation-delay:1.04s;}
.cm-scroll-icon .scroll-txt em:nth-child(3){animation-delay:1.08s;}
.cm-scroll-icon .scroll-txt em:nth-child(4){animation-delay:1.12s;}
.cm-scroll-icon .scroll-txt em:nth-child(5){animation-delay:1.16s;}
.cm-scroll-icon .scroll-txt em:nth-child(6){animation-delay:1.2s;}
.cm-scroll-icon .scroll-txt em:nth-child(7){animation-delay:1.24s;}
.cm-scroll-icon .scroll-txt em:nth-child(8){animation-delay:1.28s;}
.cm-scroll-icon .scroll-txt em:nth-child(9){animation-delay:1.32s;}
.cm-scroll-icon .scroll-txt em:nth-child(10){animation-delay:1.36s;}
.cm-scroll-icon .scroll-txt em:nth-child(11){animation-delay:1.4s;}
.cm-scroll-icon .arrow .arrow-icon{display:block; text-align:center; font-size:24px; color:#fff; height:7px; animation: arrow-ani 2s ease-in-out 0s infinite;}
.cm-scroll-icon .arrow .arrow-icon:nth-child(1){animation-delay:0.1s}
.cm-scroll-icon .arrow .arrow-icon:nth-child(2){animation-delay:0.2s}
.cm-scroll-icon .arrow .arrow-icon:nth-child(3){animation-delay:0.3s}
.cm-scroll-icon .arrow .arrow-icon:nth-child(4){animation-delay:0.4s}
.cm-scroll-icon .arrow .arrow-icon:nth-child(5){animation-delay:0.5s}
.last-container .cm-scroll-icon{display:none;}
@keyframes scroll-down-ani {
    0% {
        opacity: 0;
        transform: translateY(-50%) rotateX(90deg)
    }

    15%,85% {
        opacity: 1;
        transform: translateY(0) rotateX(0)
    }

    100% {
        opacity: 0;
        transform: translateY(50%) rotateX(-90deg)
    }
}
@keyframes arrow-ani {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.2;
    }
    100% {
        opacity: 1;
    }
}

/* -------- 탭 공통 -------- */
.history-inner-con .cm-fixed-tab-container-JS{display:none}
/*.cm-drop-menu-box-JS{display:none;}*/
.sub-cm-tab-container{position:relative; height:60px;  margin-bottom:30px;}
.sub-cm-tab-container .sub-cm-tab-inner{position:absolute; left:50%; top:0; width:1200px; transform:translate(-50%,  0); -webkit-transition:width 0.3s;-moz-transition:width 0.3s;-o-transition:width 0.3s;-ms-transition:width 0.3s;transition:width 0.3s}
.sub-cm-tab-container .sub-cm-tab-inner .sub-cm-tab-inner-con{-webkit-transition:margin 0.3s;-moz-transition:margin 0.3s;-o-transition:margin 0.3s;-ms-transition:margin 0.3s;transition:margin 0.3s}
.sub-cm-tab-container ul{border-top:1px solid #ddd; border-bottom:1px solid #ddd; text-align:center; }
.sub-cm-tab-container ul li{float:left; }
.sub-cm-tab-container ul.menu2 li{width:50%; float:none; display:inline-block; max-width:175px}
.sub-cm-tab-container ul.menu3 li{width:33.33%; }
.sub-cm-tab-container ul.menu4 li{width:25%;  }
.sub-cm-tab-container ul.menu5 li{width:20%;}
.sub-cm-tab-container ul.menu6 li{width:16.65%; }
.sub-cm-tab-container ul.menu7 li{width:14.28%; }
.sub-cm-tab-container ul.menu8 li{width:12.5%; }
.sub-cm-tab-container ul.menu9 li{width:11.1%; }
.sub-cm-tab-container ul.menu10 li{width:10%; }
.sub-cm-tab-container ul.menu11 li{width:8.33%; }
.sub-cm-tab-container ul li a{position:relative; display:block; color:#555; background-color:#fff; font-size:15px; line-height:59px; text-align:center; letter-spacing:-1px; font-weight:400; font-family:'Rubik', 'Noto Sans KR', "나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif;}
.sub-cm-tab-container ul li.selected a,
.sub-cm-tab-container ul li a:hover{color:#e60044}
.sub-cm-tab-container ul li.selected a:before,
.sub-cm-tab-container ul li.selected a:after{display:block; position:absolute;  left:0px; width:100%; content:""; height:1px; background-color:#e60044;}
.sub-cm-tab-container ul li.selected a:before{top:-1px;}
.sub-cm-tab-container ul li.selected a:after{bottom:-1px;}
/* 탭 공통 :: fixed */
.sub-fixed-tab.top-fixed{position:fixed; top:80px; width:100%; z-index:9; }
.sub-cm-tab-container .sub-fixed-tab.top-fixed.sub-cm-tab-inner .sub-cm-tab-inner-con{background-color:#fff; /*margin:0 130px;*/ border-bottom:1px solid #e5e5e5;}
.sub-cm-tab-container .sub-fixed-tab.top-fixed ul{background-color:#fff; border-color:#f7f7f7; }
.sub-cm-tab-container .sub-fixed-tab.top-fixed ul li a{background:#fff; color:#888; /* opacity:0.5;filter:Alpha(opacity=50); */}
.sub-cm-tab-container .sub-fixed-tab.top-fixed ul li.selected a,
.sub-cm-tab-container .sub-fixed-tab.top-fixed ul li a:hover{color:#222; opacity:1.0;filter:Alpha(opacity=100);}
.sub-cm-tab-container .sub-fixed-tab.top-fixed ul li.selected a:before,
.sub-cm-tab-container .sub-fixed-tab.top-fixed ul li.selected a:after{display:none}


/* ========================================================
 * BUSINESS
======================================================== */
/* ******************  BUSINESS :: 공통 ********************** */
/* -------- BUSINESS :: 상단공통 -------- */
/* Fixed Content */
.business-cm-top-container{color:#fff; padding-top:114px;}
.business-cm-top-container .business-top-bg{position:absolute; top:0px; left:0px; width:100%; height:100%;}
.business-cm-top-container .business-top-area{position:relative; padding-top:108px;}
.business-cm-top-container .business-top-slogan{font-size:3em; letter-spacing:-1px; line-height:1.44em; font-weight:900; color:#fff;}
/* Cover Content */ 
.business-cm-top-cover-con .business-slogan2-1{font-size:1.7em; line-height:1.64; margin-bottom:1.5em; letter-spacing:-1px;}
.business-cm-top-cover-con .business-slogan2-1 b{font-weight:900;}
.business-cm-top-cover-con .business-slogan2-2{line-height:1.8; font-size:1em; letter-spacing:-0.5px;}

/* ******************  BUSINESS :: 스마트홈 ********************** */
/* -------- 스마트홈 :: Section01 -------- */
.business-smart-home-container1 .parallax-fixed-bg{background:url(../images/content/business_smart_home_bg_01.jpg) no-repeat 60% 0; }
/* -------- 스마트홈 :: Section02 -------- */
.business-smarthome-container2{padding-top:200px;  background:rgba(0,0,0,0.75);}
/* -------- 스마트홈 :: Section03, Section04 -------- */
.business-smarthome-container3{background:url(../images/content/business_smart_home_bg_02.jpg) no-repeat;}
.business-smarthome-container3-bg{position:absolute; top:0px; left:0px; width:0; height:100%; background:url(../images/content/business_smart_home_bg_02_cover.png) no-repeat; content:""; background-size:auto 100%; opacity:0; transition:opacity 1s 0.3s, width 1s 0.3s;}
.business-smarthome-container3-bg.animated{opacity:1.0; width:100%;}
.business-smarthome-container4{background:url(../images/content/business_smart_home_bg_03.jpg) no-repeat; }
.business-bg-txt{position:absolute; top:30%; top:23vh; right:100px; font-size:100px; letter-spacing:-1px; z-index:1; color:#fff; font-weight:700;}
/* 텍스트영역 */
.business-txt-container{position:relative; z-index:1; color:#fff; display:flex; height:100%; align-items:center;}
.business-txt-container.right{justify-content:flex-end}
.business-txt-container .business-txt-inner-con{width:50%; font-family:'NanumSquare', "나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif;}
.business-txt-container .business-slogan-category{display:block; font-size:1.1em; font-weight:600; letter-spacing:-0.75px; margin-bottom:1.7em;}
.business-txt-container .business-slogan3-1{font-size:1.7em; line-height:1.64; margin-bottom:1.5em; letter-spacing:-1px;}
.business-txt-container .business-slogan3-1 b{font-weight:900;}
.business-txt-container .business-slogan3-2{line-height:1.8; font-size:1em; letter-spacing:-0.5px;}

/* ******************  BUSINESS :: 스마트보안 ********************** */
/* -------- 스마트보안 :: Section01 -------- */
.business-security-container1 .parallax-fixed-bg{background:url(../images/content/business_security_bg_01.jpg) no-repeat 55% 0;}

/* -------- 스마트보안 :: Section02 -------- */
.business-security-container2{padding-top:200px;  background:rgba(0,0,0,0.75); }

/* -------- 스마트보안 :: 하단섹션 -------- */
.smart-security-list .security-item{background-size:cover !important; display:table; width:100%; height:450px; position:relative}
.smart-security-list .security-item.item01{background:url("../images/content/security_item_bg01.jpg") no-repeat 40% 0;}
.smart-security-list .security-item.item02{background:url("../images/content/security_item_bg02.jpg") no-repeat 50% 0;}
.smart-security-list .security-item.item03{background:url("../images/content/security_item_bg03.jpg") no-repeat 40% 0;}
.smart-security-list .security-item.item04{background:url("../images/content/security_item_bg04.jpg") no-repeat 50% 0;}
.smart-security-list .security-item.item05{background:url("../images/content/security_item_bg05.jpg") no-repeat 40% 0;}
.smart-security-list .security-item.item06{background:url("../images/content/security_item_bg06.jpg") no-repeat 50% 0;}
.smart-security-list .security-item .inner{display:table-cell; vertical-align:middle}
.smart-security-list .security-item .inner .inner-area{max-width:1200px; margin:0 auto}
.smart-security-list .security-item .inner .inner-txt{width:50%; box-sizing:border-box}
.smart-security-list .security-item .inner .inner-txt .cate{display:block; font-weight:600; font-size:22px; letter-spacing:-0.75px; color:#fff}
.smart-security-list .security-item .inner .inner-txt .num-txt{margin-top:40px}
.smart-security-list .security-item .inner .inner-txt .num-txt li{font-weight:700; font-size:32px; letter-spacing:-0.75px; color:#fff; line-height:1.56}
.smart-security-list .security-item .inner .inner-txt .num-txt.sm li{font-size:26px}
.smart-security-list .security-item .inner .inner-txt .num-txt li .num{float:left; width:60px}
.smart-security-list .security-item .inner .inner-txt .num-txt li .txt{float:left; width:calc(100% - 60px)}
.smart-security-list .security-item .inner .inner-txt .notice{font-size:18px; letter-spacing:-0.5px; color:#fff; opacity:0.35; line-height:1.5; margin-top:40px}
.smart-security-list .security-item .inner .deco-txt{position:absolute; font-weight:600; font-size:30px; letter-spacing:-0.75px; color:#fff; opacity:0.1; text-transform:uppercase; line-height:1.33; top:50%; margin-top:-30px; transform:rotate(90deg); transition:opacity 0.3s}
.smart-security-list .security-item.rt-txt .inner .inner-txt{float:right; padding-left:2.7%}
.smart-security-list .security-item.rt-txt .inner .deco-txt{right:50%; margin-right:-970px}
.smart-security-list .security-item.lf-txt .inner .inner-txt{float:left}
.smart-security-list .security-item.lf-txt .inner .deco-txt{left:50%; margin-left:-950px}
.smart-security-list .security-item.bk .inner .inner-txt .cate,
.smart-security-list .security-item.bk .inner .inner-txt .num-txt li,
.smart-security-list .security-item.bk .inner .inner-txt .notice{color:#000}
.smart-security-list .security-item.bk .inner .deco-txt{color:#f5f5f5; opacity:1; padding:13px 13px 0 0}

/* ******************  BUSINESS :: 서비스 ********************** */
/* -------- 서비스 :: Section01 -------- */
.business-service-container1 .parallax-fixed-bg{background:url(../images/content/business_service_bg_01.jpg) no-repeat 60% 0;}

/* -------- 서비스 :: Section02 -------- */
.business-service-container2{padding-top:200px;  background:rgba(0,0,0,0.75); }

/* -------- 서비스 :: 하단섹션 -------- */
.business-service-page{padding-top:60px; background-color:#f5f5f5}
/* 탭 */
.bs-cm-tab-syle{position:relative; height:70px; z-index:11; margin-bottom:65px}
.bs-cm-tab-syle .bs-cm-tab-list{/*position:absolute; top:0; left:0; height:70px; width:100%*/}
.bs-cm-tab-syle .bs-cm-tab-list:before{position:absolute; content:""; width:0; height:1px; background-color:#e6e6e6; bottom:0; left:50%; transform:translateX(-50%); transition:width 0.5s; z-index:-1}
.bs-cm-tab-syle .bs-cm-tab-list li{float:left; width:50%; background-color:#e6e6e6; transition:background-color 0.3s}
.bs-cm-tab-syle .bs-cm-tab-list li a{display:table; width:100%; height:70px; text-align:center}
.bs-cm-tab-syle .bs-cm-tab-list li a em{display:table-cell; vertical-align:middle; font-weight:400; font-size:16px; letter-spacing:-0.75px; color:rgba(0,0,0,0.5); transition:color 0.3s}
.bs-cm-tab-syle .bs-cm-tab-list li.selected{background-color:#e60044}
.bs-cm-tab-syle .bs-cm-tab-list li.selected a em{font-weight:600; color:#fff}

.bs-cm-tab-syle .sub-fixed-tab.top-fixed .bs-cm-tab-list:before{width:100%}

/* 유지관리서비스란? */
.service-sec-01 .service-meaning{margin-bottom:30px}
.service-sec-01 .service-meaning .tit{float:left; font-weight:400; font-size:34px; letter-spacing:-0.75px; color:#000; width:300px}
.service-sec-01 .service-meaning .tit b{font-weight:600}
.service-sec-01 .service-meaning .txt{float:right; font-weight:400; font-size:18px; letter-spacing:-0.5px; color:#000; line-height:1.5; margin-top:5px; width:calc(100% - 300px); text-align:right}
.service-sec-01 .service-top-img{position:relative; height:500px}
.service-sec-01 .service-top-img .service-top-bg{width:100%; height:100%; background:url("../images/content/service_top_con_bg.jpg") no-repeat 50% 0; background-size:cover}
.service-sec-01 .service-top-img .service-top-img-inner{position:absolute; right:3.3%; top:14%; display:flex; flex-wrap:wrap}
.service-sec-01 .service-top-img .service-top-img-inner dl{float:left; width:200px; height:auto; background-color:rgba(255,255,255,0.1); box-shadow:0 0 5px 0 rgba(0,70,194,0.05); box-sizing:border-box; padding:37px 37px 30px}
.service-sec-01 .service-top-img .service-top-img-inner dl.txt-box-02{margin-left:19px}
.service-sec-01 .service-top-img .service-top-img-inner dl dt{font-weight:600; font-size:18px; letter-spacing:-0.5px; color:#fff;  padding-bottom:5px}
.service-sec-01 .service-top-img .service-top-img-inner dl dd{}
.service-sec-01 .service-top-img .service-top-img-inner dl dd span{position:relative; display:block; font-size:16px; letter-spacing:-0.5px; color:#fff; opacity:0.85; margin-top:20px; padding-left:11px}
.service-sec-01 .service-top-img .service-top-img-inner dl dd span:before{position:absolute; content:"-"; left:0; top:0}
.service-sec-01 .service-top-img .service-top-tit{position:absolute; right:0; bottom:0; background-color:#f5f5f5; color:#000; line-height:1.4; padding:25px 40px 0}
.service-sec-01 .service-top-img .service-top-tit strong{display:block; font-weight:600; font-size:30px; letter-spacing:-0.75px}
.service-sec-01 .service-top-img .service-top-tit span{display:block; font-weight:400; font-size:20px; letter-spacing:-0.5px; opacity:0.65; margin-top:10px}

/* 유지관리서비스 구성 */
.bs-cm-tit{text-align:center; font-weight:600; font-size:34px; letter-spacing:-0.75px; color:#000}
.service-detail-tbl{margin-top:30px}
.service-detail-tbl li{border-top:3px solid #000}
.service-detail-tbl li .service-detail-tit{float:left; width:23.3%; padding-top:35px; font-weight:700; font-size:30px; letter-spacing:-0.75px; color:#000; line-height:1.86}
.service-detail-tbl li .service-detail-item{float:left; width:76.7%}
.service-detail-tbl li .service-detail-item dl{border-bottom:1px solid #ddd; padding:45px 0}
.service-detail-tbl li .service-detail-item dl:last-child{border-bottom:0;}
.service-detail-tbl li .service-detail-item dl dt{float:left; width:43%; padding:0 3% 0 5.2%; box-sizing:border-box; font-weight:400; font-size:26px; letter-spacing:-0.75px; color:#000; line-height:1.4}
.service-detail-tbl li .service-detail-item dl dd{float:left; width:57%}
.service-detail-tbl li .service-detail-item dl dd p{position:relative; font-size:18px; letter-spacing:-0.75px; color:#000; opacity:0.8; padding-left:11px; line-height:1.37; margin-bottom:10px}
.service-detail-tbl li .service-detail-item dl dd p:before{position:absolute; content:"-"; left:0; top:0}
.service-detail-tbl li .service-detail-item dl dd p:last-child{margin-bottom:0}
.service-detail-tbl li .service-detail-item dl dd p em{display:block; color:#666; opacity:0.8; font-size:16px; margin-top:3px}
.service-detail-tbl li .service-detail-item dl dd p span{position:relative; display:block; padding-left:11px; font-size:16px; color:rgba(0,0,0,0.6); margin-top:11px}
.service-detail-tbl li .service-detail-item dl dd p span:first-child{margin-top:15px}
.service-detail-tbl li .service-detail-item dl dd p span:before{position:absolute; content:""; width:3px; height:3px; background-color:#6c6c6c; top:8px; left:0}
.service-sec-02{padding:110px 0 65px}

/* 수행절차 */
.service-sec-03{background-color:#fff; padding:105px 0 110px}
.service-sec-03 .service-process-con{margin-top:50px}
.service-sec-03 .service-team{}
.service-sec-03 .service-team .team-top-txt{}
.service-sec-03 .service-team .team-top-txt .tit{float:left; width:33.3%; font-weight:600; font-size:34px; letter-spacing:-0.75px; color:#000; line-height:1.4; padding-right:2%; box-sizing:border-box}
.service-sec-03 .service-team .team-top-txt .txt{float:left; width:66.7%}
.service-sec-03 .service-team .team-top-txt .txt p{position:relative; font-size:18px; letter-spacing:-0.75px; color:#000; line-height:2; padding-left:20px}
.service-sec-03 .service-team .team-top-txt .txt p:before{position:absolute; content: "\e929"; font-family: xeicon; left:0; top:0; color:#c1023d}
.service-sec-03 .team-box{margin:30px -0.5% 0; display:flex; flex-wrap:wrap}
.service-sec-03 .team-box li{float:left; width:32.333%; margin:0 0.5%; background-color:#f5f5f5}
.service-sec-03 .team-box li .inner{padding:11.5% 13% 15% 14%}
.service-sec-03 .team-box li .inner .icon{position:relative; display:inline-block; height:79px; width:100%; margin-bottom:25px}
.service-sec-03 .team-box li .inner .icon img{position:absolute; bottom:0; left:0}
.service-sec-03 .team-box li .inner .tit{display:block; font-weight:600; font-size:20px; letter-spacing:-0.75px; color:#000; line-height:1.4; margin-bottom:25px}
.service-sec-03 .team-box li .inner .txt{}
.service-sec-03 .team-box li .inner .txt span{position:relative; display:block; font-weight:400; font-size:16px; letter-spacing:-0.75px; color:#000; opacity:0.6; line-height:1.5; margin-bottom:12px; padding-left:10px}
.service-sec-03 .team-box li .inner .txt span:last-child{margin-bottom:0}
.service-sec-03 .team-box li .inner .txt span:before{position:absolute; content:""; width:3px; height:3px; left:0; top:10px; background-color:#000; opacity:0.6}
/* 수행절차 :: 하단 */
.service-sec-03 .service-team-circle{position:relative; background:url("../images/content/service_team_line.png") no-repeat 50% 0; padding:45px 0 225px}
.service-sec-03 .service-team-circle .center-txt{display:table; width:390px; height:160px; margin:0 auto; background-color:#c1023d; text-align:center; border-radius:100px}
.service-sec-03 .service-team-circle .center-txt p{display:table-cell; vertical-align:middle; font-size:26px; letter-spacing:-0.75px; color:#fff; line-height:1.38}
.service-sec-03 .service-team-circle .center-txt p b{font-weight:700}
.service-sec-03 .service-team-circle .circle-item{position:absolute; top:0; left:0; width:100%; height:100%}
.service-sec-03 .service-team-circle .circle-item li{text-align:center; position:absolute; left:50%; top:50%; margin-top:-5%; transform:translateX(-50%); }
.service-sec-03 .service-team-circle .circle-item li.item01{margin-left:-29%}
.service-sec-03 .service-team-circle .circle-item li.item02{top:auto; bottom:0; margin-top:0}
.service-sec-03 .service-team-circle .circle-item li.item03{margin-left:29%}
.service-sec-03 .service-team-circle .circle-item li .icon{max-width:100%}
.service-sec-03 .service-team-circle .circle-item li .tit{display:block; font-weight:400; font-size:18px; letter-spacing:-0.75px; color:#000; line-height:1.4; margin-top:15px}
.service-sec-03 .service-team-circle .circle-item li .tit em{display:block; font-size:14px; font-weight:400; opacity:0.6; margin-top:5px; }

/* 기대효과 */
.service-sec-04{padding:105px 0 65px}
/* 클라우드 서비스 */
.cloud-service-sec{background-color:#fff; padding:110px 0}


/* ========================================================
 * BRAND
======================================================== */
/* ******************  BRAND :: 스토리 및 컨셉  ********************** */
.brand-story-container1 .parallax-fixed-bg{background:url(../images/content/brand_story_bg_01.jpg) no-repeat 50% 50%;}
.brand-story-container2{background:url(../images/content/brand_story_bg_01_02.jpg) no-repeat 50% 50%;}
/* .brand-story-container2-bg{position:absolute; top:0px; left:0px; width:0; height:100%; background:rgba(227, 0, 71, .7); content:""; background-size:auto 100%; opacity:0; transition:opacity 1s 0.5s, width 1s 0.5s; transform-origin:0 0;}
.brand-story-container2-bg.animated{opacity:1.0; width:100%;} */
.brand-story-container3{background:url(../images/content/brand_story_bg_02.jpg) no-repeat 65% 50%;}
.brand-story-container4{background:url(../images/content/brand_story_bg_03.jpg) no-repeat 65% 50%;}
.brand-story-inner-con{position:relative; text-align:center; color:#fff;}
.brand-story-con-sub-tit{text-align:center; font-size:0.85em; font-weight:400; color:#fff; margin-bottom:4em; margin-top:-4em;}
.brand-story-con-sub-tit.pos-ab{position:absolute; top:120px; left:50%; transform:translateX(-50%); z-index:1; margin-bottom:0; margin-top:0;}
.brand-story-con-sub-tit strong{display:block; margin-top:0.5em; font-size:1.66em; font-weight:400;}

/* -------- 브랜드스토리 :: Section01 -------- */
.brand-story-container1 .brand-story-slogan1-1{color:#e60044; font-size:2em; letter-spacing:10px; font-weight:600; margin-top:1.15em;}
.brand-story-container1 .cm-scroll-icon .scroll-txt,
.brand-story-container1 .cm-scroll-icon .arrow .arrow-icon{color:#888;}
/* -------- 브랜드스토리 :: Section02 -------- */
#storyContent2 .brand-story-inner-con{color:#000}
.brand-story-container2 .brand-story-inner-con{z-index:2;}
.brand-story-container2 .brand-story-slogan2-1{font-size:1.8em; font-weight:900; line-height:1.6; letter-spacing:-1px; margin-top:0.75em;}
.brand-story-container2 .brand-story-slogan2-1:first-child{margin-top:0;}
.brand-story-container2 .brand-story-slogan2-2{font-size:1em; font-weight:400; line-height:2; letter-spacing:-0.5px; margin-top:1.65em;}
.brand-story-container2 .cm-scroll-icon{display:none;}
/* -------- 브랜드스토리 :: Section03 -------- */
.brand-story-container3 .brand-story-concept-tit{color:#e60044; font-size:1.5em; font-weight:600; margin-bottom:2em;}
.brand-story-container3 .brand-story-slogan3-1{font-size:1em; font-weight:900; letter-spacing:8px; margin-bottom:1em;}
.brand-story-container3 .brand-story-slogan3-2{font-size:3em; font-weight: 900; letter-spacing:-1px; margin-bottom:1em;}
.brand-story-container3 .brand-story-slogan3-2 em{font-weight:inherit;}
.brand-story-container3 .brand-story-slogan3-3{font-size:1em; font-weight: 600; letter-spacing:-1px; line-height:2}
/* -------- 브랜드스토리 :: Section04 -------- */
.brand-story-word-list-con{}
.brand-story-word-list-con{display:flex; height:100%; color:#fff; text-align:center;}
.brand-story-word-item{position:relative; display:flex; align-items:center; justify-content:center; width:33.33%; height:100%; box-sizing:border-box; padding:0 10px;}
.brand-story-word-item:before{position:absolute; top:0px; left:0px; width:1px; height:100%; background-color:#fff; content:""; opacity:0.15;}
.brand-story-word-item:first-child:before{display:none;}
.brand-story-word-item dl dt{font-weight:600; letter-spacing:-1px; font-size:2em; margin-bottom:0.75em;}
.brand-story-word-item dl dd{font-size:1em;letter-spacing:-0.5px; font-weight:600;} 

/* -------- 브랜드스토리 :: 하단링크 -------- */
#brandIdentityLinkCon{position:relative;}
#brandIdentityLinkCon a{display:flex; align-items:center; justify-content:center;  height:100px; background-color:#e60044; color:#fff; font-size:20px; }
#brandIdentityLinkCon a em{letter-spacing:-1px; font-weight:600;}
#brandIdentityLinkCon a i{position:relative; font-size:1.2em; margin-left:1.25em; top:1px;}

/* ******************  BRAND :: 브랜드 아이덴티티   ********************** */
/* 공통 */
.id-sec{padding:80px 0}
.id-cm-tit{font-weight:700; font-size:34px; letter-spacing:-0.75px; color:#000; text-align:center}
.id-cm-txt{font-size:20px; letter-spacing:-0.75px; color:#000; line-height:1.8}

/* 비주얼 아이덴티티 */
.identity-sec-01{text-align:center; }
.identity-sec-01 .id-cm-txt{margin-top:40px}
 
/* 브랜드 마크 */
.identity-sec-02{text-align:center; background-color:#fff;}
.identity-sec-02 .id-cm-tit{margin-bottom:70px}
.identity-sec-02 .id-cm-txt{margin-top:70px}
.identity-sec-02 .logo{max-width:100%}

/* 브랜드 컬러 */
.brand-color-con .id-cm-tit{margin-bottom:75px}
.brand-color-con .brand-color{}
.brand-color-con .brand-color > div{float:left; width:50%; box-sizing:border-box}
.brand-color-con .brand-color .lf-con{padding-right:4%}
.brand-color-con  .color-sec-name{font-weight:600; font-size:30px; letter-spacing:0; color:#000; margin-bottom:35px; display:block}
.brand-color-con  .color-sec-name em{position:relative; display:inline-block; font-weight:400; font-size:18px; color:rgba(0,0,0,0.6); letter-spacing:0; padding-left:24px; vertical-align:middle}
.brand-color-con  .color-sec-name em:before{position:absolute; content:""; width:1px; height:13px; background-color:#c4c4c4; top:2px; left:12px}
.brand-color-con .brand-color .lf-con .logo{max-width:100%}
.brand-color-con .brand-color .lf-con .txt-bt{margin-top:40px; font-size:16px; letter-spacing:0; color:#000; opacity:0.6; line-height:1.4; font-weight:400}
.brand-color-con .brand-color .rt-con{margin-top:-10px}
.brand-color-con .brand-color .rt-con .explain{font-weight:400; font-size:20px; letter-spacing:-0.75px; color:#000; line-height:1.8; border-bottom:1px solid #dcdcdc; padding-bottom:28px; margin-bottom:35px}
.brand-color-con .brand-color .rt-con .explain b{font-weight:600}
.brand-color-con .brand-color .rt-con .color-detail{color:#000; opacity:0.8; letter-spacing:0; font-size:18px;}
.brand-color-con .brand-color .rt-con .color-detail dt{float:left; font-weight:400; width:41.6%; position:relative; padding-left:40px; box-sizing:border-box}
.brand-color-con .brand-color .rt-con .color-detail dt .color{display:inline-block; width:29px; height:29px; border-radius:50%; vertical-align:middle; position:absolute; top:-5px; left:0}
.brand-color-con .brand-color .rt-con .color-detail dd{float:left; width:58.4%; padding-left:11.5%; box-sizing:border-box}
.brand-color-con .brand-color .rt-con .color-detail dd p span{display:inline-block; font-weight:400; padding-bottom:20px; margin-right:3px}
.brand-color-con .brand-color .rt-con .color-detail dd p span:last-child{margin-right:0}

.identity-sec-04{background-color:#000}
.identity-sec-04.brand-color-con  .color-sec-name,
.identity-sec-04.brand-color-con .brand-color .rt-con .explain,
.identity-sec-04.brand-color-con .brand-color .rt-con .color-detail{color:#fff}
.identity-sec-04.brand-color-con  .color-sec-name em{color:rgba(255,255,255,0.6)}
.identity-sec-04.brand-color-con  .color-sec-name em:before{background-color:#808080}
.identity-sec-04.brand-color-con .brand-color .rt-con .explain{border-color:#808080}
.identity-sec-06{background-color:#fff}

/* 하단 다운로드 버튼 */
.identity-sec-bt a{float:left; text-align:center; width:50%; height:110px; display:table}
.identity-sec-bt a.bk-btn{background-color:#111821}
.identity-sec-bt a.pk-btn{background-color:#e60044}
.identity-sec-bt a span{display:table-cell; vertical-align:middle; font-weight:400; font-size:20px; letter-spacing:0; color:#fff}
.identity-sec-bt a span i{font-size:32px; margin-left:15px; vertical-align:text-bottom; position:relative; top:2px}


/* ========================================================
 * 투자정보
======================================================== */
.invest-container1 .parallax-fixed-bg{background:url("../images/content/invest_01_top_bg.jpg") no-repeat 50% 0; }
/* -------- 투자정보 :: 주가정보 -------- */
#investContent{position:relative; min-height:400px; }
#investInnerCon{display:none;}
.invest-loading {
  position:absolute;
  left:50%;
  top:50%;
  margin:-25px 0 0 -25px;
  width: 50px;
  height: 50px;
  border: 8px solid #ebd2d6;
  border-radius: 50%;
  border-top-color: #e60044;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
}
/* -------- 투자정보 :: 내부정보관리규정 -------- */
#ruleTopContent{padding:30px; border:1px solid #ddd; background-color:#fff; margin-bottom:60px;}
#ruleTopContent h4{color:#000; line-height:1.5;}
#ruleTopContent h4 br{display:none}
#ruleTopContent .rule-caution-txt{padding-top:10px; color:#888; font-size:16.5px; line-height:2; font-weight:400; letter-spacing:-0.75px;}
#rultListContent .rule-box{margin-bottom:50px;}
#rultListContent .rule-number{position:relative; color:#444; font-size:20px; letter-spacing:-0.75px; margin-bottom:25px; padding-left:11px; font-family:'Godo', 'Noto Sans KR', "나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif;}
#rultListContent .rule-number:before{position:absolute; top:0px; left:0px; width:4px; height:19px; background-color:#e60044; content:"";}
#rultListContent dl {color:#555; font-size:15px; letter-spacing:-0.75px; margin-bottom:20px;}
#rultListContent dl dt{color:#333; font-weight:600; margin-bottom:10px;}
.rule-down-box a{display:flex; align-items:center; justify-content:center;  height:60px; background-color:#e60044; color:#fff; font-size:20px; }
.rule-down-box a em{letter-spacing:-1px; font-weight:600;}
.rule-down-box a i{position:relative; font-size:1.2em; margin-left:1.25em; top:1px;}

/* ******************  주식정보 스크롤 ********************** */
.invest-swiper-slide {
    text-align:center;
    width:100%;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.swiper-scrollbar, .swiper-scrollbar-drag{display:none;}
.invest-table-con{width:100%;}
.invest-swiper-guide-wrapper{display:none;}

/* ========================================================
 * 미디어센터
======================================================== */
/* 보도자료 :: 헤드라인 */
#boardHeadlineContent{margin-bottom:65px;}
.media-controls-box{position:relative; margin-top:20px;max-width:1200px;overflow:hidden;}
.media-controls-box .media-prev-btn,
.media-controls-box .media-next-btn{float:left; font-size:24px; color:#000; transition:all 0.3s}
.media-controls-box .media-prev-btn{margin-right:28px;}
.media-controls-box .swiper-button-disabled{color:#ddd}
#boardHeadlineContent .media-controls-box .media-paging-bar {top:50%; left:100px; right:0; height:4px; margin-top:-3px; background-color:#fff;}
.media-controls-box .media-paging-bar .swiper-pagination-progressbar-fill{background-color:#000;}

/* 보도자료 :: 상단 */
#boardTopCon{position:relative; padding:0 0 20px 0}
.board-sort-box{float:left; position:relative; width:130px; text-align:left; letter-spacing:-0.25px;}
.board-sort-box .board-cur-category{display:block; width:100%; height:40px; line-height:40px; padding:0 10px; text-align:left; font-size:15px; background-color:#fff; color:#000; box-sizing:border-box; }
.board-sort-box .board-cur-category:after{position:absolute; right:10px; top:50%; transform:translateY(-50%); font-size:24px; font-weight:600; font-family: 'xeicon'; content:"\e942";}
.board-sort-box.open .board-cur-category:after{content:"\e945";}
.board-sort-list{position:absolute; top:100%; left:0px; width:100%;  padding:10px 0; background-color:#fff; z-index:11; display:none; box-sizing:border-box;}
.board-sort-list a{display:block; padding:10px; color:#333; font-size:14px;}
.board-sort-list a:hover{color:#e60044;}
.board-top-search-box{position:relative; float:right; width:380px; background-color:#fff;}
.board-top-search-box input[type="text"]{width:100%;  padding-right:40px; height:40px; border:0; text-indent:8px; font-size:16px; border:1px solid #fff; letter-spacing:-0.5px; color:#333; transition:all 0.3s; -webkit-appearance: none;}
.board-top-search-box input[type="text"]::placeholder{color:#aaa; opacity:0.5}
.board-top-search-box input[type="text"]:focus{outline:none; border-color:#e60044}
.board-top-search-box .board-search-btn{position:absolute; top:0px; right:0px; width:40px; height:40px; color:#333; font-size:24px; transition:all 0.3s}
.board-top-search-box input[type="text"]:focus + .board-search-btn{color:#e60044}


/* ========================================================
 * COMPANY
======================================================== */
/* ******************  COMPANY :: 회사개요 및 경영철학 ********************** */
/* -------- 회사개요 :: 공통 -------- */
.summary-container1 .parallax-fixed-bg{background:url(/images/m_banner1.jpg.jpg) no-repeat 50% 0%; }
.summary-container2{background:url(../images/content/company_summary_bg_02.jpg) no-repeat 50% 50%;}
.summary-container3{background:url(../images/content/company_summary_bg_03.jpg) no-repeat 50% 50%;}
.summary-container4{background:url(../images/content/company_summary_bg_04.jpg) no-repeat 50% 50%;}
.summary-container5{background:url(../images/content/company_summary_bg_05.jpg) no-repeat 50% 50%;}
.summary-con-sub-tit{text-align:center; font-size:0.85em; font-weight:400; color:#fff; margin-bottom:4em; margin-top:-4em;}
.summary-con-sub-tit.pos-ab{position:absolute; top:50%; left:50%; transform:translateX(-50%); margin-bottom:0; margin-top:-190px;}
.summary-con-sub-tit strong{display:block; margin-top:0.5em; font-size:1.66em; font-weight:400;}
.summary-inner-con{position:relative; text-align:center; color:#fff;}
/* -------- 회사개요 :: Section01 -------- */
.summary-container1 .summary-slogan{font-size:2em; font-weight:900; letter-spacing:-1px; line-height:1.6; margin-top:0.875em;}
/* -------- 회사개요 :: Section02 -------- */
.summary-time-container{display:flex; flex-wrap: wrap; height:100%; color:#fff; text-align:center;}
.summary-time-item{position:relative; display:flex; align-items:center; justify-content:center; width:33.33%; height:100%;}
.summary-time-item:before{position:absolute; top:0px; left:0px; width:1px; height:100%; background-color:#fff; content:""; opacity:0.15;}
.summary-time-item:first-child:before{display:none;}
.summary-time-item .summary-time-detail-con dt{font-weight:600; line-height:1.5; letter-spacing:-1px; font-size:1.2em; margin-bottom:2.15em;}
.summary-time-item .summary-time-detail-con .summary-time-con{margin-bottom:1.6em;}
.summary-time-item .summary-time-detail-con .summary-time-con .time-num{display:block; font-size:4em; letter-spacing:-1px; font-weight:600; }
.summary-time-item .summary-time-detail-con .summary-time-con .time-unit{display:block; letter-spacing:-0.5px; font-weight:600; margin-top:.5em; font-family:'NanumSquare', "나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif;}
.summary-time-item .summary-time-txt{height:6em; font-size:0.85em; line-height:2em; letter-spacing:-0.5px; font-weight:600;} 
/* -------- 회사개요 :: Section03 -------- */
.summary-container3 .summary-slogan3-1{font-size:3.5em; letter-spacing:-1px; line-height:1.28; font-weight:600; margin-bottom:0.57em;}
.summary-container3 .summary-slogan3-2{font-size:1.5em; letter-spacing:-1px; line-height:1.53; font-weight:400;}
/* -------- 회사개요 :: Section04 -------- */
.summary-container4 .summary-slogan4-1{font-size:1.5em; letter-spacing:-0.5px; font-weight:900; margin-bottom:1.43em;}
.summary-container4 .summary-slogan4-2{font-size:3.5em; letter-spacing:-1px; line-height:1.37; font-weight:800;}
/* -------- 회사개요 :: Section05 -------- */
.summary-container5 .summary-con-sub-tit{z-index:4;}
.summary-value-list-con{display:flex; height:100%; color:#fff; text-align:center;}
.summary-value-item{position:relative; display:flex; align-items:center; justify-content:center; width:20%; height:100%; box-sizing:border-box; padding:0 10px;}
.summary-value-item:before{position:absolute; top:0px; left:0px; width:1px; height:100%; background-color:#fff; content:""; opacity:0.15; z-index:3;}
.summary-value-item:first-child:before{display:none;}
.summary-value-item:after{position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:1; background-color:#e30047; content:""; opacity:0; transform:scaleX(0); transition:all 0.5s}
.summary-value-item:hover:after{opacity:0.2; transform:scaleX(1)}
.summary-value-item dl {position:relative; margin-top:100px; z-index:4;}
.summary-value-item dl dt{font-weight:600; letter-spacing:-1px; font-size:1.5em; margin-bottom:1em;}
.summary-value-item dl dd{height:8em; font-size:0.85em; line-height:2em; letter-spacing:-0.5px; font-weight:600;} 

/* -------- 회사개요 :: Section06 (2022-06-09 추가) -------- */
.summary-container6{background:url(/images/content/company_summary_bg_06.jpg) no-repeat 50% 50%}
.summary-container6 .summary-con-sub-tit{top:95px; margin-top:0}
.ethics-txt-con{display:flex; height:100%; align-items:center; justify-content:center; text-align:center;}
.ethics-txt-con h3{font-size:70px; letter-spacing:-1px; margin-bottom:50px}
.ethics-txt-con .ethics-txt{font-size:30px; letter-spacing:-0.75px; line-height:1.53; font-weight:300; margin-bottom:65px}
.ethics-txt-con .cm-more-btn .txt{width:70px}

/* ******************  COMPANY :: HISTORY ********************** */
/* -------- HISTORY :: 공통 -------- */
#historyContent{position:relative; font-size:20px; padding-bottom:100px; }
/* #historyContent .parallax-fixed-bg{background:url(../images/content/company_history_bg_01.jpg) no-repeat 70% 0%; background-attachment:fixed; background-size:cover;} */
#historyContent .parallax-fixed-bg {background: url(/./images/content/company_history_bg_01.jpg) no-repeat 55% 100%; background-size:100% !important; background-attachment:initial; background-color:#000;}
.history-inner-con{position:relative; text-align:left; color:#fff; padding-top:60px; }
.history-inner-con .history-tit{margin-bottom:3.18em;}
/* -------- HISTORY :: Section01 -------- */
.history-list-container{padding-top:100px; font-family:'NanumSquare', "나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif;}
.history-item{display:flex; align-items:Center; margin-bottom:48px;}
.history-item-box{width:calc(100% - 270px);  }
.history-item-box > dl{display:flex;}
.history-item-box > dl > dt.year{width:215px; font-size:2.5em; font-weight:700; letter-spacing:-1.5px; }
.history-item-box > dl > dd{width:calc(100% - 215px); padding-top:15px;}
.history-item-box > dl > dd > p{position:relative; padding-left:48px; line-height:1.5; font-size:0.9em; margin-bottom:0.88em;}
.history-item-box > dl > dd > p .month{position:absolute; top:0px; left:0px; font-size:1em; font-weight:600;}
.history-item-box > dl > dd > p .hanja{font-family:"나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif;}
.history-item .history-img-box{width:270px; text-align:center;}
.history-item .history-img-box img{max-width:100%;}
/* 2022 */
.history-item .history-img-box .img-2022{margin-bottom:30px}

/* ========================================================
 * FOOTER :: Location
======================================================== */
/* 탭 */
.location-tab.bs-cm-tab-syle .bs-cm-tab-list li{width:16.666%; border-right:1px solid #ddd; box-sizing:border-box}
.location-tab.bs-cm-tab-syle .bs-cm-tab-list li:last-child{border-right:0}
.location-tab-content-wrapper{margin-top:20px; position:relative}
.location-pop{position:relative; width:96%; max-width:1200px; margin:50px auto}
.location-pop .modal-close-btn{top:-45px}
.location-pop .location-inner{background-color:#fff; padding:20px}
.location-pop .location-inner .map-wrapper{overflow:hidden; position:relative; width:100%; margin:0px auto 20px; height:500px; border:1px solid #ddd;}
.location-pop .location-inner .map-wrapper .map-box{position:absolute; top:50%; left:50%; width:1160px; height:500px; margin-left:-580px; margin-top:-250px;}   
.location-pop .location-inner .map-iframe-wrapper{position:relative; border:1px solid #ddd; margin:0px auto; }
.location-pop .location-inner .map-iframe-wrapper .map-iframe-con{padding-top:41.66%; position:relative; height:0;}
.location-pop .location-inner .map-iframe-wrapper .map-iframe-con iframe{position:absolute; top:0px; left:0px; width:100%; height:100%;}
.location-pop .location-inner .map-info-tbl{width:100%; margin-top:10px}
.location-pop .location-inner .map-info-tbl th, 
.location-pop .location-inner .map-info-tbl td{padding:10px 20px; line-height:28px;color:#333; font-size:15px; letter-spacing:-0.7px;}
.location-pop .location-inner .map-info-tbl th{width:60px; text-align:left;font-weight:500; vertical-align:top;}
.location-pop .location-inner .map-info-tbl td{color:#666; }
.location-pop .location-inner .map-info-tbl td dl{overflow:hidden; }
.location-pop .location-inner .map-info-tbl td dl dt,
.location-pop .location-inner .map-info-tbl td dl dd{float:left;}
.location-pop .location-inner .map-info-tbl td dl dt{width:95px;}
.location-pop .location-inner .cm-tab-con{}


/* ========================================================
 * HUMAN RESOURCES
======================================================== */
/* ******************  인재상, 인사제도 :: 공통 ********************** */
/* Fixed Content */
.person-cm-top-container{color:#fff; padding-top:190px;}
.person-cm-top-container .business-top-bg{position:absolute; top:0px; left:0px; width:100%; height:100%;}
.person-cm-top-container .business-top-area{position:relative; }
.person-cm-top-container .business-top-slogan{font-size:3em; letter-spacing:-1px; line-height:1.44em; font-weight:900; color:#fff;}
/* 항목 리스트 */
.person-system-list-con{display:flex; height:100%; color:#fff; text-align:center;}
.person-system-item{position:relative; display:flex; align-items:center; justify-content:center; width:33.33%; height:100%; box-sizing:border-box; padding:0 10px;}
.person-system-item:before{position:absolute; top:0px; left:0px; width:1px; height:100%; background-color:#fff; content:""; opacity:0.15;}
.person-system-item:first-child:before{display:none;}
.person-system-item dl dt{font-weight:600; letter-spacing:-1px; font-size:2em; margin-bottom:0.75em;}
.person-system-item dl dd{font-size:1em;letter-spacing:-0.5px; font-weight:600;} 

/* ****************** HUMAN RESOURCES  :: 인재상 ********************** */
/* -------- 인재상 :: Section01 -------- */
.person-talent-container1{background:url(../images/content/person_talent_bg_01.jpg) no-repeat 60% 0; }
.person-talent-container1 .person-cm-top-container .business-top-slogan{color:#000;}
/* -------- 인재상 :: Section02 -------- */
.person-talent-container2{background:rgba(0,0,0,0.5); }
/* -------- 인재상 :: Section03, Section04 -------- */
.person-talent-container3{background:url(../images/content/person_talent_bg_02.jpg) no-repeat 45% 0;}
.person-talent-container4{background:url(../images/content/person_talent_bg_03.jpg) no-repeat 45% 0;}
.person-talent-container4:after{position:absolute; top:0px; left:0px; width:0; height:100%; background:url(../images/content/business_smart_home_bg_02_cover.png) no-repeat; content:""; background-size:auto 100%; opacity:0; transition:opacity 1s 0.3s, width 1s 0.3s;}
.aos-animate.person-talent-container4:after{opacity:1.0; width:100%;}
.person-talent-container5{background:url(../images/content/person_talent_bg_04.jpg) no-repeat 35% 0; }
/* 텍스트영역 */
#personContent .business-txt-container{max-width:1430px}
#personContent .business-txt-container.black{color:#000}
#personContent .business-txt-container.right{justify-content:flex-end; text-align:right;}

/* ****************** HUMAN RESOURCES  :: 인사제도 ********************** */
/* -------- 인사제도 :: Section01 -------- */
.person-system-container1{background:url(../images/content/person_system_bg_01.jpg) no-repeat 50% 0; }
/* -------- 인사제도 :: Section02 -------- */
.person-system-container2{background-color:rgba(0,0,0,0.5);}
/* -------- 인사제도 :: Section03~Section05 -------- */
.person-system-container3{background:url(../images/content/person_system_bg_02.jpg) no-repeat 60% 0;}
.person-system-container4{background:url(../images/content/person_system_bg_03.jpg) no-repeat 60% 0;}
.person-system-container5{background:url(../images/content/person_system_bg_04.jpg) no-repeat 50% 0;}
.person-system-txt-container .person-system-tit{font-size:1em; margin-bottom:2.5em;}
.person-system-txt-container .person-system-tit span{display:block; font-size:1em; font-weight:600; letter-spacing:10px; margin-bottom:1.35em; text-indent:10px}
.person-system-txt-container .person-system-tit strong{display:block; font-size:3em; font-weight:900; letter-spacing:-0.75px;}
.person-system-txt-container .person-system-txt1{font-size:1em; line-height:1.8; letter-spacing:-0.5px; }
.person-system-txt-container .person-system-txt2{font-size:0.9em; line-height:1.77; letter-spacing:-0.5px; color:rgba(255,255,255,0.8); margin-top:1.4em;}
/* -------- 인사제도 ::Section05 -------- */
.person-system-grade-list-con{margin-top:90px; margin-top:4.5vw;}
.person-system-grade-list-con .preson-system-grade-list{display:flex; align-items:center;}
.person-system-grade-list-con .preson-system-grade-list:first-child{margin-bottom:25px;}
.person-system-grade-list-con .preson-system-grade-list dt{width:165px; color:#fff; font-size:1.2em; letter-spacing:-0.5px; font-weight:600; text-align:left;}
.person-system-grade-list-con .preson-system-grade-list dd{width:calc(100% - 165px); display:flex;}


/* ****************** HUMAN RESOURCES  :: 복리후생 ********************** */
.welfare-page{background-color:#fff; padding:105px 0}
.welfare-page-tit{text-align:center; font-weight:600; font-size:34px; letter-spacing:-0.75px; color:#000; margin-bottom:30px}
.welfare-list{display:flex; flex-wrap:wrap; margin:0 -0.5%}
.welfare-list li{float:left; width:32.333%; margin:0 0.5% 1%; background-color:#f5f5f5; min-height:390px; transition:all 0.3s}
.welfare-list li .box-inner{padding:14.5% 13.8%}
.welfare-list li .box-inner .icon{position:relative; display:block; height:77px; width:100%; margin-bottom:30px}
.welfare-list li .box-inner .icon img{position:absolute; top:50%; left:0; transform:translateY(-50%); transition:all 0.3s}
.welfare-list li .box-inner .icon img.off{opacity:1}
.welfare-list li .box-inner .icon img.on{opacity:0}
.welfare-list li .box-inner .tit{display:block; font-weight:600; font-size:24px; letter-spacing:-0.75px; color:#000; line-height:1.4; margin-bottom:20px; transition:all 0.3s}
.welfare-list li .box-inner .txt{font-size:20px; letter-spacing:-0.75px; color:#000; opacity:0.6; line-height:1.8; min-height:90px; transition:all 0.3s}
@media all and (min-width:801px){	
	.welfare-list li:hover{background-color:#e60044}
	.welfare-list li:hover .box-inner .tit,
	.welfare-list li:hover .box-inner .txt{color:#fff}
	.welfare-list li:hover .box-inner .icon img.off{opacity:0}
	.welfare-list li:hover .box-inner .icon img.on{opacity:1}
}


/* ****************** HUMAN RESOURCES  :: 채용공고 ********************** */
.career-info-box{border:1px solid #ddd; margin-bottom:5%; padding:30px; background-color:#fff}
.career-info-box ul li{float:left; width:48%; padding-left:2%; }
.career-info-box ul li:first-child{padding-right:2%; padding-left:0;}
.career-info-tit{font-size:19.5px; line-height:28px; color:#333; font-weight:400; letter-spacing:-0.6px; padding-left:15px; position:relative; margin-bottom:10px;}
.career-info-tit:before{display:inline-block; content:""; width:7px; height:7px; background-color:#e60044; border-radius:100%; -moz-border-radius:100%; -webkit-border-radius:100%; -o-border-radius:100%; position:absolute; top:14px; left:0; margin-top:-4px;}
.career-info-txt{position:relative; font-size:16px; line-height:20px; color:#555; letter-spacing:-0.5px; padding-left:35px; margin-bottom:15px;}
.career-info-txt.download-controls{position:static;}
.career-info-txt .caution-txt-con{color:#aaa; font-size:13px; letter-spacing:-0.75px; display:block; font-weight:400; margin-left:40px; margin-top:10px;}
.career-info-txt > img{max-width:100%;}
.career-info-txt > span{position:absolute; top:0px; left:0px; vertical-align:middle; }
.career-info-txt > a{color:#555;}
.career-info-txt > a.career-info-btn{display:inline-block; vertical-align:middle; padding:0 10px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; -o-border-radius:5px; color:#fff; line-height:45px; color:#fff; text-align:center; background:#333;}
.career-info-txt > a.career-info-btn:first-child{margin-right:5px;}
.career-info-txt > a.career-info-btn i{vertical-align:middle;}
.career-info-txt > a.career-info-btn:hover{ background-color:#e60044;}

.career-download-btn{display:inline-block; border:1px solid #eee; line-height:40px; padding:0 20px; transition:all 0.3s}
.career-download-btn strong{font-size:16.5px; font-weight:400; transition:all 0.3s}
.career-download-btn i{margin-left:10px; position:relative; top:1px; color:#e60044; transition:all 0.3s}
.career-download-btn:hover{background-color:#e60044; border:1px solid #e60044; }
.career-download-btn:hover strong,
.career-download-btn:hover i{color:#fff;}


/* ========================================================
 * 이전 CSS
======================================================== */
/* -------- 사업분야 :: 시공실적 -------- */
/* 시공실적 :: 리스트페이지 */
.result-con{padding-top:30px;}
.result-con .sub-title{margin-bottom:30px; font-size:18px; color:#000}
.result-item{margin-bottom:15px;}
.result-item .result-item-inner{border:1px solid #ddd; background-color:#fff; transition:all 0.3s}
.result-item .result-item-inner a{position:relative; display:block; overflow:hidden; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s; }
.result-item .result-item-inner a .bbs-thumb-img{width:30%; display:inline-block; vertical-align:top;}
.result-item .result-item-inner a .bbs-thumb-img span{display:block; position:relative; height:0; padding-top:54%;}
.result-item .result-item-inner a .bbs-thumb-img img{position:absolute; top:0px; left:0px; width:100%; height:auto; border-right:1px solid #ddd;}
.result-item .bbs-category{position:absolute; top:0px; left:0px; z-index:1; min-width:60px; padding:0 10px; height:28px; line-height:28px; color:#fff; background-color:#e60044; text-align:center; font-size:13px; font-weight:500; margin-bottom:15px;}
.result-item-info-con{overflow:hidden; display:inline-block; vertical-align:top; padding-left:2%; width:65%; height:100%;}
.result-item-info-con h3{
    line-height:30px; color:#333; padding-top:25px; font-size:20px; letter-spacing:-0.5px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
	font-family:'Godo', 'Noto Sans KR', "나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif;
    -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s;
}
.result-item-info-con .bbs-detail-txt{
    overflow:hidden; height:50px; margin:15px 0 ; letter-spacing:-0.5px;line-height:26px; font-size:15px; color:#626262; word-break:keep-all;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}
.result-item-info-con .bbs-thumb-writer-info{overflow:hidden; color:#aaa; font-size:15px; letter-spacing:-0.5px; font-family:'Rubik', 'Noto Sans KR', "나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif;}
.result-item .result-item-inner a:hover h3{color:#e60044} 
.result-item .result-item-inner:hover{border-color:#e60044}
/* 공사실적 :: 리스트페이지 :: 이미지없을때 */
.no-result-list-con{overflow:hidden; margin:0 -1%;}
.no-result-list-con .result-item{float:left; width:31.33%; margin:1%;}
.no-result-list-con .result-item .result-item-inner a{padding:20px 30px 30px 30px}
.no-result-list-con .result-item .result-item-inner .result-item-info-con{display:block; width:auto; padding:0;}
 /* 시공실적 :: 뷰페이지 */
.result-photo-rolling-con{position:relative; margin:50px 0}
.result-photo-rolling-con img{width:100%;}
.result-photo-rolling-con .slick-arrow{	position:absolute; width:50px; height:50px; bottom:0; left:0; cursor:pointer; border:0; cursor:pointer; z-index:9; font-size:0;}		/* 버튼이미지에 맞게 크기 수정 */
.result-photo-rolling-con .slick-arrow.slick-prev{ background:#fff url(/images/icon/round-keyboard_arrow_left-24px.svg) no-repeat 50% 50%; background-size:30px 30px}
.result-photo-rolling-con .slick-arrow.slick-next{margin-left:50px;background:#fff url(/images/icon/round-keyboard_arrow_right-24px.svg) no-repeat 50% 50%; background-size:30px 30px}
.result-detail-list-con{padding-top:50px;}
.result-tbl{width:100%; border-top:1px solid #000;}
.result-tbl th, .result-tbl td{border-bottom:1px solid #ddd; font-size:15px; padding:15px 0; letter-spacing:-0.5px; text-align:center;}
.result-tbl th{color:#333; font-weight:500; }
.result-detail-list-con{border:1px solid #ddd; padding:20px}
.result-detail-list-con li{overflow:hidden;}
.result-detail-list-con li.title{margin-top:0;}
.result-detail-list-con li dl{overflow:hidden; position:relative; float:left; width:300px; margin-right:15px;}
.result-detail-list-con li.title dl{float:none; margin-right:0;}
.result-detail-list-con li dl dt,
.result-detail-list-con li dl dd{font-size:14px; letter-spacing:-0.5px; line-height:20px;  margin-top:10px;}
.result-detail-list-con li.title dl dt,
.result-detail-list-con li.title dl dd{margin-top:0}
.result-detail-list-con li dl dt{position:absolute; top:0px; left:0px;width:70px; font-weight:500; color:#222; }
.result-detail-list-con li dl dd{padding-left:70px;}
@media all and (max-width:1120px){
    /* 게시판 :: 리스트 :: 썸네일형 */
	.result-item .result-item-inner a{position:relative; height:145px;}
    .result-item .result-item-inner a .bbs-thumb-img{position:absolute; top:0px; left:0px;width:262px; bottom:0px;}
	.result-item .result-item-inner a .bbs-thumb-img span{display:block; width:100%; height:100%; padding-top:0; }
	.result-item .result-item-inner a .bbs-thumb-img span img{position:static;border-right:0; width:100%; height:100%;}
	.result-item-info-con{padding-left:300px; display:block; width:auto;}
    .result-item-info-con h3{font-size:18px; padding-top:10px;}
    .result-item-info-con .bbs-detail-txt{height:42px; font-size:13px; line-height:20px; margin-bottom:10px;}
    .result-item-info-con .bbs-thumb-writer-info{position:static; font-size:12px;}
	.no-result-list-con .result-item .result-item-inner a{padding:30px 15px;}
}
@media all and (max-width:800px){
    /* 게시판 :: 리스트 :: 썸네일형 */
	.result-con .sub-title{margin-bottom:10px}
	.result-item{margin-bottom:5px;}
    .result-item .result-item-inner a{height:120px;}
	.result-item .result-item-inner a .bbs-thumb-img{width:220px}
    .result-item-info-con .bbs-category{width:60px; height:18px; line-height:16px; font-size:12px;}
	.result-item-info-con{padding-left:235px;}
    .result-item-info-con h3{font-size:16px; line-height:20px;}
    .result-item-info-con .bbs-detail-txt{}
	.result-item-info-con .bbs-thumb-writer-info{font-size:12px;}
	.result-item .bbs-category{height:20px; line-height:20px; min-width:40px; font-size:12px; margin-bottom:0; }
}
@media all and (max-width:480px){
    /* 게시판 :: 리스트 :: 썸네일형 */
	.result-item .result-item-inner a{height:95px;}
	.result-item .result-item-inner a .bbs-thumb-img{width:150px}
	.result-item-info-con{padding-left:170px;}
	.result-item-info-con h3{font-size:15px; }
	.result-item-info-con .bbs-detail-txt{height:18px; margin:8px 0 12px;}
	.no-result-list-con .result-item{width:48%}
	 /* 시공실적 :: 뷰페이지 */
	.result-detail-list-con li dl dt,
	.result-detail-list-con li dl dd{font-size:12px;}
}
@media all and (max-width:359px){
	/* 게시판 :: 리스트 :: 썸네일형 */
	.result-item .result-item-inner a{height:auto;}
	.result-item .result-item-inner a .bbs-thumb-img{position:static; width:100%; height:auto;}
	.result-item-info-con{padding:15px;}
	.result-item-info-con h3{padding-top:0}

}



/* 공통 탭 */
.sub-cm-tab-wrapper.sub-3dep-tab-wrapper{height:55px; margin-bottom: 65px;}
.sub-3dep-cm-style ul{text-align: center;}
.sub-3dep-cm-style ul li{margin: 0 4px; display: inline-block; position:relative; width:20%; background-color:#fff;}
.sub-3dep-cm-style ul.col-3 li{width: 245px;}
.sub-3dep-cm-style ul li a{display:table; height:53px; width:100%; border:1px solid #c9c9c9; background-color: #f2f2f2;}
.sub-3dep-cm-style ul li a em{display:table-cell; vertical-align:middle; color:#000; font-size:17px; line-height: 1.3; letter-spacing:-0.25px; text-align:center;}
.sub-3dep-cm-style ul li.selected{z-index:1;}
.sub-3dep-cm-style ul li.selected a{background-color:#fff; border-color:#000;}
.sub-3dep-cm-style .cm-tab-m-btn{display:none;}