@charset "utf-8";
/* Common */
.sub-section {padding-bottom: 150px;}
.sec-tit {text-align: center; font-weight: 700; font-size: 40px; color: #242424; position: relative; width: fit-content; margin: 0 auto 45px; padding-bottom: 30px;}
.sec-tit:before {position: absolute; content: ''; bottom: 0; left: 50%; transform: translateX(-50%); width: 35px; height: 2px; background: #ddd;}
.tit-text {text-align: center;}
.point {color: #1631b1 !important;}
.sec-cnt {margin-top: 80px;}

/* sub01 */
.brand .sec1 {padding-top: 20px;}
.brand .sec2 .sec-cnt {display: flex; gap: 100px; justify-content: space-between;}
.brand .sec2 .photo {width: 50%; position: relative;}
.brand .sec2 .photo .sub-img {position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
.brand .sec2 .txt {flex: 1; line-height: 2.353em; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; font-size: 17px; background: #f8f8f8; border-radius: 20px;}
.brand .sec2 .txt .large {font-size: 28px;}
.brand .sec2 .txt .point {font-weight: 600;}
.brand .sec3 {background: url('../images/sub/bg_brand_sec3.jpg') no-repeat center center; background-size: cover; padding: 100px 0;}
.brand .sec3 .sec-tit {padding-bottom: 0;}
.brand .sec3 .sec-tit:before {content: none;}
.brand .sec3 .tit-text {color: #fff;}
.brand .sec3 .sec-cnt {display: flex; gap: 30px;}
.brand .sec3 .item {padding-top: 55px; flex:1; height: 260px; border-radius: 10px; background: rgba(255,255,255,.8); text-align: center;}
.brand .sec3 .item .txt {font-weight: 500; font-size: 18px; color: #242424; line-height: 1.556em; margin-top: 5px;}

/* sub02 */
.business-slider {position: relative; margin-bottom: 60px;}
.business-slider .items {position: relative;}
.business-slider .slick-list {margin: 0 -10px;}
.business-slider .items { padding-bottom: 45px;}
.business-slider .slick-slide {padding: 5px 10px;}
.business-slider .slick-arrow {position: absolute; bottom: -12px; width: 12px; height: 23px; filter: grayscale(1) brightness(3); overflow: hidden; font-size: 0; text-indent: -9999em; border: none; transition: .3s;}
.business-slider .slick-arrow:hover {filter:none;}
.business-slider .slick-prev {right: 70px; background:url("../images/sub/business_prev.png") 50% 50% no-repeat; background-size: contain;}
.red-c .business-slider .slick-prev {background:url("../images/sub/business_prev_red.png") 50% 50% no-repeat; background-size: contain;}
.business-slider .slick-next {right: 0; background:url("../images/sub/business_next.png") 50% 50% no-repeat; background-size: contain;}
.red-c .business-slider .slick-next {background:url("../images/sub/business_next_red.png") 50% 50% no-repeat; background-size: contain;}
.business-slider:before {position: absolute; content: ''; bottom: -12px; right: 39px; width: 1px; height: 25px; background: #ddd;}
.business-slider .caption {position: absolute; top: 34%; right: 26%; text-align: center; font-size: 18px;}
.business-slider .caption h2 {color: #242424; font-weight: 700; font-size: 38px; margin-top: 7px; line-height: 1em;}
.business-slider .progress {width: calc(100% - 140px);}
.business-list .item:first-child {padding-top: 0;border-top: none;}
.business-list .item {padding: 100px 0; border-top: 1px solid #ddd; letter-spacing: -.02em;}
.business-list .item .top {display: flex; gap: 60px;}
.business-list .item .top .photo {border-radius: 15px; border: 1px solid #ddd; overflow: hidden;}
.business-list .item .top .txt {flex: 1; display: flex; align-items: center; justify-content: space-between;}
.business-list .item .top .desc span {color: #808080; font-size: 18px;}
.business-list .item .top .desc .tit {color: #242424; font-size: 30px; font-weight: 700; line-height: 1em; margin-top: 5px; margin-bottom: 25px;}
.business-list .item .functions {display: flex; margin-top: 40px; text-align: center; gap: 110px; justify-content: center;}
.business-list .item .functions .ico img {margin-top: 0; margin-bottom: 13px;}
.business-list .btn-more.grey {width: 190px; height: 50px; font-size: 16px; font-weight: 600; color: #808080;}
.business-list .btn-more.grey .ico {filter: brightness(0.5);}
.business-list .btn-more.grey:hover * {color: #fff; filter: none;}

/* sub03 */
.portfolio-list {display: flex; flex-wrap:wrap; margin-bottom: 50px;}
.portfolio-list .item {width: 25%; position: relative;}
.portfolio-list .item .img {position: relative; width: 100%; padding-bottom: 100%; overflow: hidden;}
.portfolio-list .item .img img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.portfolio-list .item .caption {position: absolute; left: 0; bottom: 0; color: #fff; padding: 25px; transition: .3s;}
.portfolio-list .item .caption * {display: none; opacity: 0; transition: .3s;}
.portfolio-list .item .caption .tit {display: block; font-weight: 600; font-size: 22px; position: relative; opacity: 1;}
.portfolio-list .item .caption .txt {margin-bottom: 25px;}
.portfolio-list .item:hover .caption .tit {padding-bottom: 15px; margin-bottom: 15px;}
.portfolio-list .item .caption .tit:before {position: absolute; content: ''; width: 0; height: 1px; background: rgba(255,255,255,.3); bottom: 0; left: 50%; transform: translateX(-50%); transition: .3s;}
.portfolio-list .item:hover .caption .tit:before {width: 30px;}
.portfolio-list .item:hover .caption {display: flex; width: 100%; height: 100%; flex-direction: column; align-items: center; justify-content: center; background: rgba(0,0,0,.75);}
.portfolio-list .item:hover .caption * {display: block; opacity: 1;}
.btn-view-more {text-align: center; display: flex; flex-direction: column; margin: 0 auto 95px; width: fit-content; color: #656565;}
.btn-view-more .plus {width: 40px; height: 40px; background: url('../images/sub/ico_plus_w.png') no-repeat center center; background-size: contain; transition: .3s; margin: 0 auto 10px;}
.btn-view-more:hover .plus {background: url('../images/sub/ico_plus.png') no-repeat center center; background-size: contain;}

/* sub03_view */
.portfolio_view .top .tit {font-size: 30px; font-weight: 700; color: #333; margin-bottom: 30px; line-height: 1.3em;}
.portfolio_view .top .info ul {display: flex; flex-wrap: wrap; max-width: 50%; gap: 15px 0;}
.portfolio_view .top .info li {display: flex; align-items: center; width: 50%; font-weight: 500; color: #767676; letter-spacing: 0; padding-right: 15px;}
.portfolio_view .top .info-tit {color: #454545;min-width: 70px;}
.portfolio_view .view-cnt {margin-top: 60px;}
.portfolio_view .img {position: relative; width: 100%; overflow: hidden; padding-bottom: 55.23%;}
.portfolio_view .img:before {position: absolute; content: ''; top: 0; left: 0; bottom: 0; right: 0; border: 1px solid #ddd; z-index:1;}
.portfolio_view .img img {position: absolute; width: 100%; height: 100%; object-fit: cover; top: 0; left: 0;}
.portfolio_view .slider-for, .portfolio_view .slider-nav {position: relative;}
.portfolio_view .slider-for .slick-arrow {position: absolute; bottom: 0; width: 44px; height: 45px; font-size: 0; overflow: hidden; text-indent: -999em; z-index: 5; border: none;}
.portfolio_view .slider-for .slick-prev {right: 44px; background: url('../images/sub/for_prev.png') no-repeat center center;background-size: contain;}
.portfolio_view .slider-for .slick-next {right: 0; background: url('../images/sub/for_next.png') no-repeat center center;background-size: contain;}
.portfolio_view .slider-nav .items {margin: 0 -12px; padding: 40px 50px; margin-bottom: 60px;}
.portfolio_view .slider-nav .item {padding: 0 12px;}
.portfolio_view .slider-nav .slick-arrow {position: absolute; bottom: 50%; transform: translateY(50%); width: 17px; height: 32px; font-size: 0; overflow: hidden; text-indent: -999em; z-index: 5; border: none;}
.portfolio_view .slider-nav .slick-prev {left: 0; background: url('../images/sub/nav_prev.png') no-repeat center center;background-size: contain;}
.portfolio_view .slider-nav .slick-next {right: 0; background: url('../images/sub/nav_next.png') no-repeat center center;background-size: contain;}
.portfolio_view .slider-nav .slick-current .img:before {border: 3px solid #1631b1;}

/* sub04 */
.bmsystem .deco-under {position: relative; z-index:1; width: fit-content; margin: 0 auto;}
.bmsystem .deco-under:before {position: absolute; content: ''; width: 0; height: 10px; left: 0; bottom: 0; background: #ffcbf6; z-index: -1; border-radius: 3px;}
.bmsystem .aos-animate .deco-under:before {width: 100%; transition: 1s linear;}
.bmsystem .aos-animate .deco-under.long:before {transition: 1.5s linear;}
.bmsystem .sec-tit  {margin-bottom: 55px; padding-bottom: 0;}
.bmsystem .sec-tit:before {content: none;}
.bmsystem .sec-tit h2 {font-size: 30px; font-weight: 600; line-height: 1.250em;}
.bmsystem .sec-tit p {margin-top: 10px; font-size: 16px; color:#454545; font-weight: 400;}
.bmsystem .sec-tit.small {font-size: 28px;}
.bmsystem .sec-tit .num {font-weight: 700; font-size: 20px; color: #fff; width: 35px; height: 35px; border-radius: 100%; background: #1631b1; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px;}
.bmsystem .sub-section:nth-child(even) {background: #f8f8f8;}
.bmsystem .sub-section {padding: 100px 0;}
.bmsystem .sub-section:first-child {padding-top: 0;}

.bmsystem .sec1 .sec-cnt {display: flex; justify-content: space-between; gap: 30px;}
.bmsystem .sec1 .item {flex: 1; text-align: center; background: #1631b1; border-radius: 10px; color: #fff; padding: 58px 10px 54px;}
.bmsystem .sec1 .item:nth-child(even) {background: #526cec;}
.bmsystem .sec1 .num {font-weight: 700; font-size: 20px; color: #1631b1; width: 35px; height: 35px; border-radius: 100%; background: #fff; display: flex; align-items: center; justify-content: center; margin: 0 auto;}
.bmsystem .sec1 .txt {font-weight: 500; font-size: 20px; margin-top: 15px; min-height: 55px;}
.bmsystem .sec1 .view-more {font-size: 15px; color: #ececec;}
.bmsystem .sec1 .item:hover .view-more {text-underline-offset: 4px; text-decoration: underline;}

.bmsystem .sec2 .step-photo {position: relative;}
.bmsystem .sec2 .img {opacity: 0;}
.bmsystem .sec2 .sub-img {position: absolute; width: 100%; height: 100%; left: 0; top: 0;}

.cards {display: flex; gap: 30px; margin-bottom: 28px;}
.cards li { flex: 1; text-align: center;}
.cards li .item {position: relative; border-radius: 20px; border: 1px solid #ddd; padding: 40px 15px 35px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px;}
.cards .ico {display: flex; align-items: center; justify-content: center; width: 110px; height: 110px; background: #f8f8f8; border-radius: 100%;}
.cards .number {position: absolute; left: 15px; top: 9px; font-weight: 600; font-size: 20px; color: #dd8438; text-decoration: underline; text-underline-offset: 4px;}
.cards .tit {font-weight: 600; font-size: 20px; color: #242424; margin-bottom: 25px;}
.cards .view-more {color: #808080; font-size: 15px;}
.bmsystem .sec3 .detail-tab li a:hover, .bmsystem .sec3 .detail-tab li.active a {background: #1631b1; border-color: #1631b1;}
.bmsystem .sec3 .detail-tab li a:hover .ico, .bmsystem .sec3 .detail-tab li.active a .ico {background: #fff;}
.bmsystem .sec3 .detail-tab li a:hover .number, .bmsystem .sec3 .detail-tab li.active a .number {color: #fff;}
.bmsystem .sec3 .detail-tab li a:hover .tit, .bmsystem .sec3 .detail-tab li.active a .tit {color: #fff;}
.bmsystem .sec3 .detail-tab li a:hover .view-more, .bmsystem .sec3 .detail-tab li.active a .view-more {color: #ececec; text-underline-offset: 4px; text-decoration: underline;}
.bmsystem .sec3 .detail-tab li:nth-child(even) a:hover, .bmsystem .sec3 .detail-tab li:nth-child(even).active a {background: #526cec; border-color: #526cec;}
.bmsystem .sec3 .tab-content:nth-child(odd) .view-tit {background: #526cec;}
.bmsystem .sec3 .tab-content:nth-child(odd) {border-color: #526cec}

.bmsystem .sec3 .view {border-radius: 20px; overflow: hidden; border: 1px solid #1631b1;}
.bmsystem .sec3 .view-tit {background: #1631b1; display: flex; align-items: center; justify-content: space-between; padding: 17px 40px;}
.bmsystem .sec3 .view-tit h3 {color: #fff; font-weight: 600; font-size: 20px; letter-spacing: -.02em;}
.bmsystem .sec3 .view-cnt {display: flex; padding: 50px 40px 45px; gap: 44px;}
.bmsystem .sec3 .view-cnt .item {flex: 1; text-align: center;}
.bmsystem .sec3 .view-cnt .item-tit {position: relative; width: 100%; padding: 17px 5px; border-radius: 30px; border: 1px dashed #1631b1; background: rgba(22,49,177,.05); margin-bottom: 10px;}
.bmsystem .sec3 .view-cnt .item:not(:last-child) .item-tit:before {position: absolute; content: ''; width: 14px; height: 12px; background: url('../images/sub/ico_next.png') no-repeat center center; background-size: contain; top: 50%; transform: translate(100%,-50%); right: -18px;}
.bmsystem .sec3 .view-cnt p {letter-spacing: -.04em;}
.bmsystem .sec3 .btn-close {cursor: pointer;}
.bmsystem .sec4 .item {background: #fff;}
.bmsystem .sec4 .cards .tit {margin-bottom: 12px;}

.bmsystem .sec5 .sec-cnt {display: flex; gap: 30px;}
.bmsystem .sec5 .item {padding: 30px; flex: 1; border-radius: 20px; background: #f8f8f8; letter-spacing: -.02em; position: relative;}
.bmsystem .sec5 .number {font-weight: 500; color: #dd8438; background: #fff; width: 50px; height: 25px; display: flex; align-items: center; justify-content: center; border-radius: 12.5px; box-shadow: 1px 1px 5px rgba(0,0,0,.1);}
.bmsystem .sec5 .ico {position: absolute; bottom: 30px; right: 30px;}
.bmsystem .sec5 .item .top {font-weight: 500; padding-top: 20px; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #ddd; min-height: 127px;}
.bmsystem .sec5 .item .top h3 {margin-top: 5px; font-weight: 600; font-size: 22px; line-height: 1.364em;}
.bmsystem .sec5 .item .bot {padding-bottom: 57px; min-height: 135px;}

/* sub05 */
.community, .blog {margin-bottom: 100px;}
.root_daum_roughmap .wrap_controllers {display: none;}
.root_daum_roughmap, .root_daum_roughmap .wrap_map {width: 100% !important;}
.community .doc-cnt {display: flex; margin-top: 50px; border-top: 2px solid #1631b1; border-bottom: 1px solid #ddd;}
.community .doc-cnt .item {flex:1; text-align: center;}
.community .doc-cnt .item:not(:last-child) {border-right: 1px solid #ddd;}
.community .doc-cnt .item .tit {background: rgba(22,49,177,.05); color: #242424; font-weight: 500; font-size: 17px; padding: 17px;}
.community .doc-cnt .item .desc {padding: 37px 15px;}
.community .doc-cnt .item .desc p{line-height: 1.375em; margin-top: 20px;}