@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900);
@import url(https://fonts.googleapis.com/css?family=Montserrat:400,900);
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400);
@import url(https://cdn.jsdelivr.net/gh/xpressengine/xeicon@1.0.4/xeicon.min.css);

/* Reset with bootstrap */
html{font-size: 23px}
body,p,h1,h2,h3,span,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0;padding:0}
body,input,textarea,select,button,table{font-family:'Noto Sans KR','Apple SD Gothic Neo','맑은 고딕','Malgun Gothic','돋움',sans-serif}
body{-ms-word-break:break-all;word-break:keep-all;word-wrap:break-word;letter-spacing: -.05em;color: #222}
a{text-decoration:none;color: #000}
a:hover,a:focus,a:active{text-decoration:none;color: #0054aa}
a[class*=text-]:hover{text-decoration: underline}
a,button,input,textarea{transition:border-color .15s ease-in-out,background .15s ease-in-out,color .15s ease-in-out,opacity .15s ease-in-out,transform .15s ease-in-out}
li{list-style:none}
address,em{font-style:normal}
label{cursor:pointer}
table{width: 100%}
textarea{width: 100%;resize:none;font-size: 1.1rem}
img{vertical-align: top}
hr{margin-top: 10px;margin-bottom: 10px;border-top-color: rgb(240,240,241)}
b{font-weight: 500}

/* Helper Classes */
.skip{z-index:200;background:#000;text-align:center;color:#fff}
.skip:active, .skip:focus{position:absolute;width:100%;padding:.5em;color:#fff}
.no-style{margin:0;padding:0;border:0;background:none}
.txt-line{display:-webkit-box;overflow:hidden;max-height:3em;line-height:1.5em !important;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;word-break:break-all;white-space:normal}
.txt-line.fix{height: 3em}

/* Grid */
.container{width: 100%;max-width: 1400px;padding-left: 5%;padding-right: 5%}
.d-flex>.flex1{flex: 1}

/* Icon */
[class^=icon-]{overflow:hidden;display:inline-block;margin:0;padding:0;border:0;background-color:transparent;background-position:50% 50%;background-repeat:no-repeat;font-size:0;line-height:0;text-decoration:none;vertical-align:top;text-indent:-1000em}

/* Typography */
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{margin: 0;font-weight: 700}
.lead{font-size: 2.5rem;font-weight: 700}
.h1, h1{font-size: 2.174rem}
.h2, h2{font-size: 1.739rem}
.h3, h3{font-size: 1.565rem}
.h4, h4{font-size: 1.391rem}
.h5, h5{font-size: 1.217rem}
.h6, h6{font-size: 1.043rem}
.display-1{font-size: 3rem !important;font-weight: 900}
.display-2{font-size: 2.522rem;font-weight: 700}
.display-3{font-size: 1.652rem}
.tbasic{font-size: 1rem}
.smtxt{font-size: .87rem}
.text-link{display: inline-block;vertical-align: top;padding-bottom: .2em;border-bottom: 1px solid;font-size: .783rem;text-decoration: none !important}
.font-mont{font-family: 'Montserrat', sans-serif;font-weight: 900;letter-spacing: 0}
.font-roboto{font-family: 'Roboto', sans-serif;font-weight: 300;letter-spacing: 0}
.font-weight-black{font-weight: 900 !important}
.font-weight-thin{font-weight: 100 !important}
.bigger{font-size: 1.15em}

/* Theme */
.text-primary, a.text-primary:focus, a.text-primary:hover{color: #0055aa !important}
.text-muted{color: #4f4f4f !important}
.text-light{color: #c7c7c7 !important}
.bg-light{background-color: #f7f7f7 !important}

/* Form */
.form-group{margin-bottom: 10px}
.form-control{height: calc(3.2rem + 2px);padding: .7rem 1rem;border-radius: 0;background: #0a2847;border-color: #0a2847 !important;font-weight: 100;color: #d0dfec;transition: background .15s ease-in-out}
.form-control:focus{font-weight: 400;box-shadow: none}
.form-control:-ms-input-placeholder{opacity:1;color:#d0dfec !important}
.form-control::-moz-placeholder{opacity:1;color:#d0dfec}
.form-control::-webkit-input-placeholder{opacity:1;color:#d0dfec}
.input-group>.form-control{border-right: 0}
/* Form:button */
.btn{padding: .9em 1.8em;border-radius: 0;font-size: 1rem;box-shadow: none !important}
.btn-primary{background-color: #006fff !important}
.btn-more{min-width: 220px;margin-top: 2.6rem}

/* Table */
.tb-fixed{table-layout: fixed}
.table{margin: 0}
.table .thead-light th{background: #efefef;color: rgba(0,0,0,.5)}
.table td, .table th, .table thead th{padding: .563rem .231em;border-top: 0;border-bottom: 1px solid #e1e1e1;font-size: .875rem;font-weight: 400;line-height: 1.1}
.table td{opacity: .8}
.table thead th{white-space: nowrap}
.table th.text-right, td.text-right{padding-right: 0;padding-left: 1em}
.table td:first-child, .table th:first-child{padding-left: 1.4em}
.table td:last-child, .table th:last-child{padding-right: 1.4em}
.table .img-txt>.rounded-circle{width: 17px;height: 17px}

/* List */
.list-inline{font-size: 0}
.list-inline-item{font-size: 1rem}
.list-type-dash>li{padding-left: .7em}
.list-type-dash>li:before{float: left;margin-left: -.7em}
.list-type-dash>li:before{content: '-'}
.desc-float dt{float: left;width: 6rem;white-space: nowrap;clear: left;text-overflow: ellipsis}
.desc-float dd{margin-left: 6rem}
.desc-float dd:not(:last-child){padding-bottom: 10px}
.desc-float dd:after{content: '';display: block;clear: both}

/* Nav */
.navbar{padding: 0}
.nav{padding: 0 3px;border-bottom: 1px solid #e1e1e1}
.nav>.nav-item{margin-left: 21px;margin-bottom: -1px}
.nav-link{display: block;padding: 3px 0 8px;border-bottom: 3px solid transparent;line-height: 1;color: rgb(0,0,0,.5)}
.nav-link.active{border-color: #006fff;font-weight: 500;color: #006fff}

/* Modal */
.modal-backdrop.in{opacity: .3}
.modal-dialog{width: 90%;max-width: 960px}
.modal-dialog.modal-sm{max-width: 850px}
.modal-dialog.modal-xs{max-width: 600px}
.icon-modal-close{position: absolute;top: 0;right: 0;z-index: 10;width: 60px;height: 60px;background-image: url(../img/modal_close.jpg);background-position: 100% 0;background-size: 60px}
.modal-content{padding: 7%;border: 0;border-radius: 0}
.modal-title{padding-bottom: .5em;border-bottom: 2px solid}
.modal-header{display: block;border: 0;padding: 0}
.modal-header.text-center .modal-title{border-bottom: 0}
.modal-body{padding: 1.5rem 0;font-size: .783rem;line-height: 1.7;font-weight: 300}
.desc-item{display: block;width: 100%;margin: 0 auto}
.desc-item .media-left{max-width: 100%;margin: 0 auto 1rem}
.desc-item .media-body{width: 100%}
.desc-item .swiper-button-next, .desc-item .swiper-button-prev{width:32px; height:32px;background-size: auto 100%;font-size:24px;line-height: 32px}
.slide-content{padding: 0 !important;background: #e3e3e3}
.slide-content .swiper-container{width:  100%}
.slide-content .modal-body{padding:  1rem 5% 2rem;margin: 0}
.swiper-title{padding: .5rem 5% 1rem;background: rgba(255,255,255,.95)}
.swiper-title .modal-title{padding: 0;border-bottom: 0;line-height: 1.2}
.mCSB_inside>.mCSB_container{margin: 0}
.logo-list{align-items: center;text-align: center}
.logo-list>li{margin-bottom: 2.3rem}
.modal-title-text{margin: 1em 0 2em;font-size: .87rem;text-align: center;font-weight: 300}
.pop-view-swiper .swiper-button-next, .pop-view-swiper .swiper-button-prev{top: 0;margin-top: calc(33% - 37px) !important}
.popimg-wrap{overflow: hidden;position: relative;display: flex}
.popimg-wrap.popimg-wrap img{position: absolute;top: 0;left: 50%;width: auto;height: 100%;transform: translateX(-50%)}
.popimg-wrap:before{content: '';padding-bottom: 66%}

/* Swiper */
.overflow-swiper{overflow: visible}
.swiper-slide img{display: block;width: 100%}
.swiper-button-next, .swiper-button-prev{width: 75px;height: 75px;margin: 0 0 0 20px;font-family: xeicon;line-height: 75px;background: #c9c9c9;border-radius: 50%;font-size: 34px;text-align: center;vertical-align: top;color: #fff}
.basic-swiper .swiper-button-next{right: 0}
.basic-swiper .swiper-button-prev{left: 0}
.basic-swiper .swiper-button-next, .basic-swiper .swiper-button-prev{margin: -37px 30px 0}
.swiper-button-next:before{content: '\e60d'}
.swiper-button-prev:before{content: '\e60b'}
.swiper-button-next:hover, .swiper-button-prev:hover{background: #2a2a2a}
.swiper-buttons .swiper-button-next, .swiper-buttons .swiper-button-prev{position: static;display: inline-block}
.swiper-pagination{bottom: 0}
.swiper-pagination-bullet, .swiper-pagination-bullet-active{background: #fff}
.swiper-container-horizontal>.swiper-pagination-progressbar{top: auto;right: 0;width: auto;height: 6px;margin: 0 calc(5% + 75px) 35px;background: #dadada}
.progressbar-swiper .swiper-buttons{position: static !important;margin: 2.5rem 0 0 !important;text-align: right}
.progressbar-swiper .swiper-button-prev, .progressbar-swiper .swiper-button-next{position: static !important}
.progressbar-swiper .swiper-buttons .swiper-button-prev{float: left;margin: 0}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background: #2a2a2a}

/* Wrapper */
.card{border-radius: 0}
.card-item, .card-space-txt{border: 0}
.card-item .card-thumb{position: relative;display: flex;padding-bottom: 100%;align-items: center;justify-content: center;background: #fff;box-shadow: .435rem .435rem 2.174rem rgba(220,220,220,.3), -.435rem -.435rem 2.174rem rgba(220,220,220,.3);transition: box-shadow .4s}
.card-item:hover .card-thumb{box-shadow: .435rem .435rem 2.174rem rgba(220,220,220,.6), -.435rem -.435rem 2.174rem rgba(220,220,220,.6)}
.card-item .card-thumb>img{position: absolute;top: 50%;left: 50%;max-width: 80%;transform: translate(-50%,-50%)}
.card-item .card-body{background: none}
.card-thumb{overflow: hidden}
.card-thumb>img{width: 100%}
.card-body{padding: 1.3rem 0;background: #fff}
.card-body>.smtxt{font-weight: 300}
.card-body>.smtxt:first-child{margin-bottom: 5px}
.card-body>.smtxt:last-child{margin-top: 5px}
.card-box-txt{height: 100%;border-color: #d2d2d2}
.card-box-txt .card-body{position: relative;padding-left: 5px;padding-right: 5px}
.card-box-txt .card-body:before{content: '';position: absolute;bottom: 100%;left: 50%;height: 40px;margin: 0 0 -20px -1px;border-left: 3px solid #0054aa}
.card-space-txt .card-body{padding-left: 3.4rem}
.card-space-txt .txt-line{position: relative;margin-left: -3.4rem;padding-left: 3.4rem}
.card-space-txt .txt-line:before{content: '';position: absolute;top: .75em;left: 0;width: 2.6rem;border-top: 2px solid}
.hover-size-effect .card-thumb>img{transition: all .5s}
.hover-size-effect:hover .card-thumb>img{filter: brightness(80%);-webkit-filter: brightness(80%);-moz-filter: brightness(80%);-ms-filter: brightness(80%);-webkit-transform: scale(1.1);transform: scale(1.1)}
.space-block-sm{margin-top: 1rem}
.space-block{margin-top: 2rem}
.space-block-lg{margin-top: 4rem}

/*--------------------------------------
    PAGES
---------------------------------------*/

/* Header */
#hd{position: fixed;top: 0;left: 0;right: 0;z-index: 100;letter-spacing: -.03em;background: #fff;box-shadow: 0 2px 8px rgba(0,0,0,.05)}
.gnb a, .depth3 a{font-size: 18px}
.navbar-collapse{flex-grow: 0}
#navAll{display: none}
.util .xi-magnifier{margin-top: -5px;vertical-align: middle;font-size: 1.3rem;color: #023262}
.util>a{display: inline-block;vertical-align: top;text-align: center}

/* Contact */
.contact{padding: 3.5rem 0;background: #06213c;color: #fff}
.contact .btn{margin-top: 2em}
.icon-arrow, .icon-arrow-dark{width: 40px;height: 8px;margin: 7px 0 0 20px;background-image: url(../img/icon_arrow.png);transition: background .15s ease-in-out}
:hover>.icon-arrow, .icon-arrow-dark{background-image: url(../img/icon_arrow_dark.png)}
:hover>.icon-arrow-dark{background-image: url(../img/icon_arrow.png)}

/* Footer */
#ft{padding: 3.5rem 0;background: #00152a;font-size: .783rem;font-weight: 300;color: #fff}
.social-list a{display: inline-block;font-size: 30px;line-height: 25px;color: #2e4459}
.social-list a>img{height: 25px;margin: 0 3px}
.social-list .list-inline-item:not(:last-child){margin-right: 1.154em}
.icon-kakao-plus{width: 30px;height: 25px;;background-image: url(../img/icon_kp.png);font-size: inherit}
.footer{padding-bottom: 2.5em;margin-bottom: 1.5em;border-bottom: 1px solid #2d4c6b}
.fnb a{font-weight: 100;letter-spacing: -.07em;color: #fff}
.fnb .list-inline-item{font-size: 16px}
.copy{margin-top: 1.5em;color: #2d4358}
.float-buttons{position: fixed;right: 40px;bottom: 40px;z-index: 100;width: 90px;}
.icon-top{display: none;width: 90px;height: 90px;background-image: url(../img/icon_top.png);background-size: 100% auto}
.float-buttons .icos-sns{position:absolute;bottom:100px;left:0;opacity:0;pointer-events: none;transition:0.3s}
.float-buttons .icos-sns li{margin-top:10px ;}
.is-scroll .icon-top{display: block}
.is-scroll .icos-sns{opacity:1;pointer-events: all;}

/* Layout */
#wrap{overflow: hidden}
#ct{padding-top: 100px}

/* Main */
.main-visual{display: flex;align-items: center;min-height: calc(100vh - 100px);letter-spacing: 0;font-weight: 100}
.main-visual-bg{position: absolute;top:0;bottom:0;left:0;right:0;z-index:-1;}
.main-visual-bg .swiper-slide i{position: absolute;top:0;bottom:0;left:0;right:0;background:no-repeat 50% 50%;background-size: cover;}
.main-visual>.container{padding: 0}
.main-visual:before{content: '';position: absolute;top:0;bottom:0;left:0;right:0;background:rgba(0,0,0,.3)}
.main-visual:after{content: '';display: block;min-height: inherit}
.main-column-swiper .container{background: #fff}
.main-visual .swiper-slide{text-align: center;color: #fff}
.main-visual .display-3{display: block;margin: .5em 0;text-transform: uppercase;line-height: 1.184}
.main-visual .text-wrap{padding: 20% 0}
.main-visual .font-roboto{font-size: 15px;letter-spacing: .3em}
.btn-scroll-content{position: absolute;left: 50%;bottom: 30px;font-size: 12px;letter-spacing: .03em;color: #fff !important}
.btn-scroll-content>i{position: relative;display: block;width: 19px;height: 29px;margin: 0 auto 5px;border-radius: 2em;border: 1px solid #fff}
.btn-scroll-content>i:after{content: '';position: absolute;top: 5px;left: 50%;width: 4px;height: 4px;margin-left: -2px;background: #fff;border-radius: 50%;animation: dot 2s infinite}
@keyframes dot {
  0% {
    transform: translate(0, 0);
    opacity: 0;
  }
  40% {
    opacity: 1;
  }
  80% {
    transform: translate(0, 13px);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
.sect{margin: 3rem 0}
.sect[class*=bg-]{margin-bottom: 0;padding-bottom: 2rem}
.sect:first-child, .sect[class*=bg-]{margin-top: 0;padding-top: 5rem}
.main-column-swiper{max-width: 1450px;margin-left: auto;margin-right: auto;}
.main-column-swiper .swiper-slide{overflow: hidden;background: #fff}
.sect-sm-title{padding-left: 50px;font-style: italic;font-weight: 900;letter-spacing: 0 }
.sect-sm-title:before{content: '';float: left;width: 28px;margin: 10px 0 0 -50px;border-top: 3px solid;vertical-align: top}
.flex-text{line-height: 1.7;font-weight: 300}
.flex-text .h1{margin-bottom: .8em;letter-spacing: -.07em}
.flex-text .h1>.font-mont{display: inline-block;margin-bottom: -.158em;line-height: 1;vertical-align: bottom;font-size: 2.2em}
.flex-image-wrap{position: relative;display: inline-block;max-width: 100%;padding-bottom: 10%;vertical-align: top}
.flex-image-wrap>img{position: relative}
.flex-image-wrap:before{content: '';position: absolute;right: -10%;bottom: 0;width: 100%;height: 90%;background: #e2e2e2}
.main-column-swiper>.swiper-pagination-bullets{left: 50%;bottom: 0;padding-left: 30px;padding-right: 30px;transform: translate3d(-50%, 0,0)}
.main-column-swiper .swiper-pagination-bullet{width: auto;height: auto;padding-bottom: .5em;border-bottom: 3px solid;background: none;border-radius: 0;font-size: .87rem;line-height: 1;color: #ccc;opacity: 1}
.main-column-swiper>.swiper-pagination-bullets .swiper-pagination-bullet{margin: 0 1em}
.main-column-swiper .swiper-pagination-bullet-active{color: #000}
.shadow-box{background: #fff;box-shadow: 16px 27px 54.6px 10.4px rgba(4, 0, 0, .09)}
.sect-market{position: relative;padding: 6rem 0}
.sect-market .shadow-box{position: relative;display: flex;height: 100%;padding: 20% 10%;align-items: center}
.market-info{margin: 0;text-align: center}
.market-info img, .service-info img{display: block;margin: 0 auto 1em}
.market-info .text-link{margin-top: 1em}
.sect-line-title{margin-bottom: .5em}
.sect-line-title .font-mont{font-style: italic}
.sect-blog>.bg{position: relative;padding-top: 3.9rem;background: #0055aa;color: #fff}
.sect-blog .smtxt{height: 1.5em}
.sect-blog>.bg:before{content: '';position: absolute;bottom: -1px;left: 0;right: 0;height: calc(7.434rem + 6px);background: #fff}
.sect-blog .blog-swiper{overflow: visible;margin-bottom:60px;}
.sect-blog .swiper-buttons{position: absolute;bottom: 100%;right: 0;margin-bottom: -6px}
.sect-blog .swiper-buttons .swiper-button-next, .sect-blog .swiper-buttons .swiper-button-prev{position: static !important;background: #0065ca;color: #78bcff}
.sect-blog .swiper-buttons .swiper-button-next:hover, .sect-blog .swiper-buttons .swiper-button-prev:hover{background: #fff;color: #0055aa}
.hover-effect .card-thumb{position: relative;padding-bottom: 76.6%}
.hover-effect .card-thumb>img{position: absolute;top: 0;width: 100%;transform: translateY(12.5%);transition: transform .3s ease-out}
.hover-effect .card-thumb:before, .hover-effect .float-txt{content: '';position: absolute;top: 12.5%;left: 0;right: 0;bottom: 0;z-index: 5;opacity: 0;transition: all .3s ease-out}
.hover-effect .card-thumb:before{background: rgba(0,0,0, .6)}
.hover-effect .float-txt{display: flex;align-items: center;justify-content: center;flex-direction: column;font-size: .783rem;font-weight: 300;color: #fff}
.hover-effect .float-txt .xi-magnifier{padding-bottom: 10px;font-size: 3em}
.hover-effect:hover .card-thumb>img{transform: translateY(0)}
.hover-effect:hover .card-thumb:before, .hover-effect:hover .float-txt{top: 0;opacity: 1}
.blog-swiper .card-thumb>img{width: 100%;height: 100%}
.blog-swiper .card-body{position: relative;padding:40px 40px;background: #fff;box-shadow:16px 27px 54.6px 10.4px rgba(4, 0, 0, .09)}
.blog-swiper .card-body:after{content:''; display: block; width:40px; margin-top: 40px; border-top:4px solid #0055aa;}
.lst-blog{position: relative;top:60px;margin:0 0 60px;padding:40px 4%;background: #fff;box-shadow:16px 27px 54.6px 10.4px rgba(4, 0, 0, .09)}
.lst-blog li+li{border-top:1px solid #ddd}
.lst-blog a{display: block;position: relative;padding:1.5em 0; font-size:.8em}
.lst-blog h4{margin:0 80px .5em 0; font-size: 1.2em}
.lst-blog .date{position: absolute;top:1.5em; right:0;font-size:.9em; color: #999}

/* sub */
.sub-visual{padding: 4rem 0;background-color: #0054aa;background-repeat: no-repeat;background-size: cover;background-position: 50% 0;text-align: center;color: #fff}
.sub-visual>.h2{margin: 1.5rem 0 1rem}
.sub-visual>p{height: 3rem}
.location{background: #0054aa;font-size: 18px;font-weight: 300;color: #fff}
.snb{height: 75px;flex-direction: row;align-items: center}
.snb .xi-home{font-size: 1.278em;color: #fff}
.snb .nav-item, .snb .nav-item>a{position: relative;display: flex;height: 100%;align-items: center;justify-content: center}
.snb .nav-item:first-child>a{width: 75px;border: 1px solid #287fd7;border-width: 0 1px}
.snb .nav-item:not(:first-child){padding: 0 40px}
.snb .nav-item:not(:first-child)+.nav-item:before{content: '';position: absolute;top: 50%;left: 0;height: .8em;margin-top: -.3em;border-left: 1px solid #287fd7}
.sub-title{margin-bottom: 2.5rem;font-size: 2rem;text-align: center}
.sub-title-txt{margin-top: -1.5rem;margin-bottom: 2.5rem;line-height: 1.45;text-align: center}
.sub-content{line-height: 1.8;font-weight: 300}

/* about */
.sub-about{margin-bottom: -6rem;padding-bottom: 6rem;background: url(../img/bg_about.jpg) no-repeat 50% 100%;background-size: cover}
#mapArea{height:530px}
#mapArea .root_daum_roughmap{width: 100%;height: 100%;padding: 0;border: 0;border-radius: 0}
#mapArea .root_daum_roughmap>.wrap_map{height: 100%}
.title-line{display: block;width: 3px;height: 2.174rem;margin: -1rem auto 2.174rem;background: #000}
.map-info{position: relative;z-index: 10;padding: 3rem 7%;margin: -75px 5% 0;text-align: left}
.map-info tr>*{padding: .8em 1.5em .8em 0;vertical-align: top;line-height: 1.4}
.map-info td:last-child{padding-right: 0}
.map-info th{white-space: nowrap}

/* why */
.why-graph{padding: 5%;background: #fff}

/* business */
.desc-swiper{overflow: visible}
.img-txt-row>.row+.row{margin-top: 3rem}
.img-txt-row .h6{display: block;margin-bottom: .5em}
.bg-service{background: url(../img/service.jpg) no-repeat 50% 50%;background-size: cover;text-align: center;color: #fff}

/* install */
.install-logo{margin-top: .8rem;width: auto;height: 20px}

/* search */
.sub-search{min-height: -webkit-calc(100vh - 100px);min-height: calc(100vh - 100px)}
.frm-search{max-width: 770px;margin: 0 auto}
.input-group-line{border-bottom: 4px solid #000}
.input-group-line .form-control{height: 3rem;padding-left: 0;background: none;color: #000;border: 0}
.input-group-line .form-control:-ms-input-placeholder{color:#b6b6b6 !important}
.input-group-line .form-control::-moz-placeholder{color:#b6b6b6}
.input-group-line .form-control::-webkit-input-placeholder{color:#b6b6b6}
.input-group-append button:not(.btn){background: none;border: 0;font-size: 1.4em}
.line-title{padding-bottom: .7em;margin-bottom: 1em;border-bottom: 1px solid}
.search-content>.sect:first-child{padding-top: 0}
.search-content .card-list{margin-top: 2.5rem}
.card-list{margin-left: -10px;margin-right: -10px}
.card-list>li{padding: 0 10px 20px}


/*--------------------------------------
    Media
---------------------------------------*/

@media (min-width: 768px){
    .contact textarea{height: -webkit-calc(100% - 10px);height: calc(100% - 10px)}
    .footer{padding-bottom: 4em;margin-bottom: 3em}

    .scrollb{height: 40vh;max-height: 440px}
    .logo-list{margin-right: 0}
    .mCSB_scrollTools{top: 0;bottom: 0;right: 0;width: 6px;border-radius: 3px;background: #e2e2e2;opacity: 1}
    .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width: 6px;background: #2b75bf !important}
    .mCSB_scrollTools .mCSB_draggerRail{background: #e2e2e2}
}

@media (min-width: 992px){
    .btn, .form-control{font-size: 18px}
    /* Header */
    #hd .navbar, .gnb{height: 100px}
    .navbar-expand-lg{-ms-flex-pack: justify;justify-content: space-between}
    .gnb{align-items: center}
    .gnb>.nav-item>a{display: inline-block;padding: 10px 0;border-bottom: 3px solid transparent;vertical-align: top;font-weight: 500}
    .gnb>.nav-item:hover>a, .gnb>.nav-item:focus>a, .gnb>.nav-item.active>a, .gnb>.nav-item.open>a{border-bottom-color: #0054aa;color: #0054aa}
    .util>a{min-width: 56px;line-height: 56px}
    .util .btn-nav-all{font-size: 18px;cursor: pointer}
    .btn-nav-all>span{margin-right: 10px}
    .btn-nav-all .xi-bars{display: inline-flex;width: 56px;height: 56px;background: #023262;align-items: center;justify-content: center;font-size: 1.3rem;vertical-align: top;color: #fff}
     /* 
    .gnb>.nav-item+.nav-item{margin-left:50px}
    .container, .gnb .depth{padding-right: 30px;padding-left: 30px}
	.depth-wrap{position: absolute;top: 100%;left: 0;right: 0;background: #f2f2f2;border-top: 1px solid #ddd} */
    .open .depth-wrap{display: block}
    .gnb .depth{margin: 28px 0}
	.collapse.show{display:none}
	#hd.open .collapse.show{display:block}
	#hd .container{padding-left:2% ; padding-right:2%}

    .gnb>.nav-item{padding:0 35px}
    .gnb>.nav-item:first-child{padding-left:0 !important}
    .gnb>.nav-item{position:relative}
    #hd.open::before{content:""; position: absolute;top: 100%;left: 0;right: 0;background: #f2f2f2;border-top: 1px solid #ddd;min-height:283px}
	.depth-wrap{position: absolute;width:100%;left:0;letter-spacing:-1px}

    .gnb .depth>li{padding: 0 2%;text-align: left;text-align:center;line-height:40px}
    .gnb .depth>li:first-child{padding-top:15px}
    .depth>li>a{display:block;font-size: 16px;font-weight: 500;vertical-align: top}
    .gnb .depth3{margin-top: 1em}
    .depth3>li+li{margin-top: .3em}
    body.nav-all-open{overflow: hidden}
    .nav-all-open #navAll{display: block}
    #navAll{overflow-x: hidden;overflow-y: auto;position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 200;background: #fff}
    #navAll>.container{position: relative;padding-top: 100px;padding-bottom: 100px}
    .nav-all{display: flex;padding: 0 50px;-ms-flex-pack: justify;justify-content: space-between;letter-spacing: -.03em}
    .nav-all>li{max-width: 300px;white-space: nowrap}
    .nav-all>li>strong{display: block;padding-bottom: 20px;margin-bottom: 20px;border-bottom: 2px solid #c4c4c4;font-size: 1.2em}
    .nav-all .depth>li+li{margin-top: .5em}
    .nav-all .depth>li>a{padding-left: 15px;font-weight: 700;color: #0054aa}
    .nav-all .depth>li>a:before{content: '';float: left;width: 5px;height: 5px;margin: 12px 0 0 -15px;background: #0054aa;border-radius: 50%}
    .nav-all .depth3{margin: 10px 0 0 16px}
    #navAll .btn-nav-all{position: absolute;top: 22px;right: 30px;width: 56px;height: 56px;margin-bottom: 21px;font-size: 40px}
    .btn-depth-toggle{display: none}

    /* Footer */
	#ft .container{padding:0}
    .footer{display: flex;-ms-flex-pack: justify;justify-content: space-between;align-items: flex-start}
    .footer .txt:nth-of-type(1){margin-top: 1.5em}
    .footer .txt{margin-top: .3em}
	.fnb-all{flex:1;}
	.fnb-wrap{display:flex ;justify-content:center;text-align:center }
	.fnb-wrap>li{padding:0 25px}
	.fnb-wrap>li>a{color:#fff;font-size:15px}
	.fnb-depth {margin-top:15px}
	.fnb-depth a{font-size:13px;color:#fff;opacity:0.5;line-height:28px}

    .fnb .list-inline-item:not(:last-child){margin-right: 50px}
    .fnb a:hover{font-weight: 300}
    .contact .font-mont{margin-right: 6%}

    /* main  */
    .sect{margin-top: 5rem}
    .main-visual .swiper-pagination-bullet{display: none}
    .main-visual .display-3{display: flex;height: 2.4em;align-items: center;justify-content: center}
    .sect-sm-title{position: relative;display: inline-block;z-index: 10}
    .main-column-swiper{margin-top: -2.4rem}
    .main-column-swiper .row{margin-left: -4%;margin-right: -4%;align-items: center}
    .main-column-swiper .col-lg{padding-left: 4%;padding-right: 4%}
    .flex-text{padding-top: 80px;padding-bottom: 80px}
    .sect-column-reverse .sect-sm-title{margin-left: 55%}
    .flex-lg-row-reverse .flex-image-wrap:before{right: auto;left: -10%}
    .main-column-swiper>.swiper-pagination-bullets{position: static;width: 50%;line-height: 0;transform: none}
    .main-column-swiper>.swiper-pagination-bullets .swiper-pagination-bullet{margin: 1em 1em 0}
    .sect:not(.sect-column-reverse) .main-column-swiper>.swiper-pagination-bullets{margin-left: 50%}
    .main-column-swiper .swiper-button-prev, .main-column-swiper .swiper-button-next{margin-top: -75px}
    .sect:not(.sect-column-reverse) .main-column-swiper .swiper-button-prev{left: 50%}
    .sect-column-reverse .main-column-swiper .swiper-button-next{right: 50%}
    .sect-market .shadow-box:before{content: '';position: absolute;top: 20%;left: 100%;width: 20%;margin-left: -10%;border-top: 3px solid #000}
    .sect-market:before{content: '';position: absolute;top: 0;bottom: 0;right: 0;left: 20%;background: #f7f7f7}
    .market-info{height: 100%;padding-left: 16%}
    .market-info>.col-6{display: flex;padding: 30px;align-items: center;flex-direction: column}
    .market-info>.col-6>.smtxt{width: 100%}
    .sect-line-title>*{display: inline-block;vertical-align: top}
    .sect-line-title>.font-mont{margin-top: .6em;padding-left: 340px}
    .sect-line-title>.font-mont:before{content: '';float: left;width: 275px;margin: .5em 0 0 -315px;border-top: 3px solid}
    .swiper-buttons{margin-bottom: 1.3rem;text-align: right}

    /* Search */
    .card-list{margin-left: -25px;margin-right: -25px;}
    .card-list>li{padding: 20px 25px;}
    /*.card-list>.col-md-4:nth-last-child(-n+3){padding-bottom: 0}*/

    /* business 
    .desc-swiper .swiper-slide{padding-bottom: 4rem}*/
    .desc-swiper .swiper-slide{}
    .desc-txt-box{position: absolute;top: 20%;right: 12%;bottom: 0;display: flex;flex-direction: column;width: 500px;padding: 3.5rem 2.5rem 0}
    .desc-txt-box .h4{position: relative}
    .desc-txt-box .h4:before{content: '';position: absolute;top: 50%;right: 100%;width: 4.5em;margin-right: .8em;border-top: 3px solid #000}
    .desc-swiper .swiper-button-next, .desc-swiper .swiper-button-prev{margin: calc(-37px - 1.5rem) 10px 0}
    .img-txt-row .h3:before{content: '';display: block;width: 1em;margin: 1rem 0;border-bottom: 3px solid}
}

@media (min-width: 1200px){
    .img-txt-row .row{margin-left: -30px;margin-right: -30px}
    .img-txt-row .row>[class*=col]{padding-left: 30px;padding-right: 30px}
}

@media (max-width: 1395px) and (min-width: 992px){ 
    .gnb>.nav-item{padding:0 25px !important}
}

@media (max-width: 1365px) and (min-width: 992px){
    /* Header */
    .btn-nav-all>span{display: none} 
    .gnb>.nav-item>a{font-size: 16px}
    .nav-all{justify-content: flex-start;flex-wrap: wrap}
    .nav-all>li{width: auto;padding: 0 25px;flex: 0 0 33.33%;max-width: 33.33%}
    .nav-all>li:nth-last-child(-n+3){margin-top: 2rem}
}

@media (max-width: 1199px) and (min-width: 992px){
    html{font-size: 20px}
    /* Header */
    .logo img{height: 35px}
    .navbar-brand{margin-right: 5px}
    .util .btn-nav-all{margin-left: .6rem}
    .util>a{min-width: 45px;line-height: 45px}
    .btn-nav-all .xi-bars{width: 45px;height: 45px}
    .gnb>.nav-item>a{font-size: 14px}
    .depth>li>a{font-size: 14px}
    .nav-all .depth>li>a:before{width: 4px;height: 4px;margin-top: 9px}
    /* Footer */
    .fnb .list-inline-item:not(:last-child){margin-right: 30px}
	.fnb-wrap>li{padding:0 15px}

    .sect-line-title>.font-mont{padding-left: 240px}
    .sect-line-title>.font-mont:before{width: 175px;margin-left: -215px}
    .main-visual .display-3{font-size: 1.45rem}

    /* business */
    .card-list>li{padding: 20px 15px}
    .desc-txt-box{background: rgba(255,255,255,.9)}
}

@media (max-width: 1199px){
    html{font-size: 20px}
}

@media (max-width: 991px){
    #navAll, .btn-nav-all{display: none !important}
    .btn-more{margin-top: 2rem}

    .swiper-buttons:not(.position-absolute){position: absolute;right: 0;bottom: 100%;margin-bottom: 2.522rem}

    /* Card */
    .card-space-txt .card-body{padding-left: 2rem}
    .card-space-txt .txt-line{margin-left: -2rem;padding-left: 2rem}
    .card-space-txt .txt-line:before{width: 1.6rem}

    /* Header */
    #hd .navbar{height: 60px}
    .logo img{width: 100px}
    #gnb{overflow-y: auto;position: absolute;top: 100%;left: 0;right: 0;max-height: calc(100vh - 60px);border-top: 1px solid #ddd}
    .gnb li{position: relative;background: #fff}
    .gnb li+li{border-top: 1px solid #ddd}
    .gnb a{display: block;padding: 0 5%;line-height: 60px}
    .util>a{width: 30px;margin-right: 5px;line-height: 50px}
    .util .navbar-toggler{width: 50px;height: 50px;margin-right: -14px;padding: 0 5px;background: none;border: 0}
    .util .xi-magnifier{font-size: 25px}
    .util .xi-bars{width: 40px;font-size: 32px}
    .btn-depth-toggle{position: absolute;top: 0;right: 7px;height: 60px;padding: 0 5%;background: none;border: 0;font-size: 18px;outline: 0 !important}
    .depth{padding: 0 5%;border-top: 1px solid #ddd;background: #fafafa}
    .depth>li>a{padding: 0 5%;font-size: 16px;background: #fafafa}
    .depth3>li+li{border-top-color: #eee}
    .depth3 a{line-height: 45px;background: #f3f3f3;font-size: 15px;color: #555}
    .btn-depth-toggle:not(.collapsed), .btn-depth-toggle:not(.collapsed)+a{color: #0054aa}
    .btn-depth-toggle:not(.collapsed) .xi-angle-down:before{content: "\e60e"}

    /* Footer */
    .footer{text-align: center}
    .footer img{margin-bottom: 1rem;height: 15px}
    .fnb{margin: 1.5rem -5% 0}
	.fnb-all{display:none}
    .float-buttons{right: 20px;bottom: 50px;width: 45px;}
    .icon-top{width: 45px;height: 45px}
    .float-buttons .icos-sns{bottom:55px}
    .float-buttons .icos-sns img{width:45px}

    #ct{padding-top: 60px}
    .contact .font-mont{margin-bottom: .8em;text-align: center}

    /* main */
    .sect{margin: 4rem 0}
    .sect:first-child, .sect[class*=bg-]{padding-top: 4rem}
    .sect[class*=bg-]{padding-bottom: 4rem}
    .main-visual{min-height: calc(100vh - 50px)}
    .main-visual .display-3{font-size: 2.3rem}
    .main-visual .text-wrap{padding-bottom: 25%}
    .main-column-swiper .row{position: relative}
    .main-column-swiper .swiper-button-prev, .main-column-swiper .swiper-button-next{display: none}
    .flex-text{position: static}
    .flex-text .h1{margin-top: .5em}
    .flex-image{padding: 2rem 0 0}
    .flex-image-wrap{max-width: 95%;padding-bottom: 5%}
    .flex-image-wrap:before{right: -5%}
    .main-column-swiper .swiper-pagination{position: static;display: block;padding-top: 1rem;transform: none}
    .market-info{max-width: 500px;margin: 1rem auto 0}
    .sect-market{padding: 4rem 0;background: #f7f7f7}
    .market-info>.col-6{padding: 50px 30px 0}
    .sect-line-title .font-mont{display: block;padding-left: 50px;margin-top: 1.2rem}
    .sect-line-title .font-mont:before{content: '';float: left;width: 28px;margin: 10px 0 0 -50px;border-top: 3px solid;vertical-align: top}
	.blog-swiper .card-body{padding:30px;}
	.lst-blog{margin-top: -30px; padding:0 20px}
	.lst-blog h4{ padding-right: 60px}

    /* about */
    #mapArea{height: 60vw;max-height: 530px;box-shadow: 16px 27px 54.6px 10.4px rgba(4, 0, 0, .09)}
    .map-info{padding: 1.5rem 5%;margin: 0}

    /* business */
    .desc-txt-box{padding: 2rem 5%;box-shadow: none}
    .desc-swiper .swiper-slide{height: auto;background: #fff;box-shadow: 8px 14px 27px 5px rgba(2, 0, 0, .05)}
    .img-txt-row .space-block{margin-top: 1rem}
    .img-txt-row .swiper-container{margin-bottom: 1.5rem}
    .img-txt-row p{padding-left: .5em}
    .img-txt-row p:before{content: '- ';float: left;margin-left: -.5em;font-weight: 500}
    .service-info [class*=col-]:not(:first-child){margin-top: 3rem}

    /* install */
    .install-logo{height: 10px}
}

@media (max-width: 767px){
    html{font-size: 18px}

    .fnb .list-inline-item{font-size: .786rem}

    /* Card */
    .card-box-txt .card-body:before{height: 26px;margin-bottom: -13px}

    /* Modal */
    .icon-modal-close{background-size: 30px}
    .modal-body{font-size: .867rem}

    /* sub */
    .snb{height: 50px}
    .snb .nav-item:first-child>a{width: 50px}
    .snb .nav-item:not(:first-child){padding: 0 20px}
    .location{font-size: 16px}

    /* search */
    .input-group-line{border-bottom-width: 2px}
	.card-list{margin:0}
	.card-list>li{width: 50%}
}

@media (max-width: 575px){
    html{font-size: 15px}
    body{line-height: 1.6;letter-spacing: -.03em}

    .btn-more{min-width: 150px}

    /* Typography */
    .h1, h1{font-size: 1.8rem}
    .h2, h2{font-size: 1.4rem}
    .h3, h3, .display-3{font-size: 1.3rem}
    .display-2{font-size: 2.1rem}

    /* Swiper */
    .swiper-button-next, .swiper-button-prev{width: 36px;height: 36px;margin-left: 10px;font-size: 17px;line-height: 36px}
    .swiper-buttons:not(.position-absolute) .swiper-button-next, .swiper-buttons:not(.position-absolute) .swiper-button-prev{position: absolute;top: 50%;margin: -18px 0}
    .swiper-buttons:not(.position-absolute) .swiper-button-next{right: 0}
    .swiper-buttons:not(.position-absolute) .swiper-button-prev{left: 0}
    .swiper-buttons:not(.position-absolute){position: static}
    .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{background: #c9c9c9 !important;pointer-events: auto}
    .progressbar-swiper .swiper-buttons{margin-top: 1.5rem !important}
    .swiper-container-horizontal>.swiper-pagination-progressbar{height: 3px;margin: 0 calc(5% + 36px) 16px}
    .basic-swiper .swiper-button-next, .basic-swiper .swiper-button-prev{margin: -18px 10px 0}
    .pop-view-swiper .swiper-button-next, .pop-view-swiper .swiper-button-prev{margin-top: calc(23% - 18px) !important}

    /* Card */
    .card-box-txt .card-body{padding: 1rem 5px}
    .card-box-txt .card-body:before{height: 18px;margin-bottom: -9px;border-left-width: 2px}
    .card-space-txt .card-body{padding: .5rem 0}
    .card-space-txt .txt-line{margin: 0;padding: 0}
    .card-space-txt .txt-line:before{display: none}

    /* Modal */
    .modal{padding:  0 !important}
	.modal .modal-dialog{width: 100%;margin: 0 auto}
	.modal .modal-content{min-height: 100vh;padding: 10% 5%}
    .mCustomScrollBox{max-height: none !important}

    /* main */
    .sect-market .shadow-box{padding: 14% 7%}
    .market-info img{height: 52px}
    .market-info>.col-6{padding: 40px 20px 0}
    .sect-blog .swiper-buttons{margin-bottom: 0}
    .flex-text .h1>.font-mont{font-size: 2em}

    /* sub */
    .sub-visual{padding: 2rem 10%}
    .snb{height: 40px}
    .snb .nav-item:first-child>a{width: 40px}
    .snb .nav-item:not(:first-child){padding: 0 15px}
    .location{font-size: .867rem}
    .sub-title{margin-left: -5%;margin-right: -5%;font-size: 1.8rem}

    /* about */
    .sub-about .sub-title~p{text-align: justify !important}
    .sub-about .sub-title~p>br{display: none !important}
    .map-info tr>*{display: block;padding: 2px 0}
    .map-info tr>th{padding-top: 10px}

    /* business */
    .desc-swiper .swiper-button-next, .desc-swiper .swiper-button-prev{margin: -18px 0 0;border-radius: 0;opacity: .7}
    .service-info img{height: 70px}
}

@media (max-width: 359px){
    html{font-size: 13px}
}
