@charset "utf-8";

/* 제목 */
.titleArea {position: relative;padding-top: 35px;margin-bottom: 37px;z-index: 1;}
.titleArea h2 {font-family: 'Calibri-Bold';color: #3A3A3A;font-size: 28px;line-height: 35px;}
.titleArea strong {color: #5F5F5F;}

/* 그리드 */
.gridArea {position: relative;max-width: 1160px;/* border-top: 2px solid #292929; */padding-top: 20px;}
.gridArea:before {position:absolute;top: -2px;left: 0;display:block;content:"";width: 100%;height: 2px;background: #292929;z-index: 1;}
.gridArea:after {display: block; width: 0; height: 0; content: ""; clear: both;}

#grid-wrapper {padding: 0;padding-top: 1000px; /* Prevent flicker in grid area. */margin: 0 -20px;background: #202020;overflow: visible !important;}
#grid-wrapper:before {position:absolute;top: -77px;left: 0;display:block;content:"";width: 100%;height: 77px;background: #202020;}

/* value = (width * n) + (15+15+5) * (n-1). 
 * ex.
 * width=200 : 200, 425, 650, 875
 * width=250 : 250, 525, 800, 1075
 * width=240 : 240, 615, 940, 1265
 */
div.x1 {/* width: 240px; */}
div.x2 {width: 615px;}
div.x3 {width: 940px;}
div.x4 {width: 1265px;}

.grid-item {border: 0;width: 360px;width: calc(33.33333% - 40px);/* height: auto; */margin: 0 20px 20px;}

.grid-item a.grid-image {position: relative;/* display: flex; *//* justify-content: flex-end; */display: block;/* width: 360px; */width: 100%;/* height: 231px; */overflow: hidden;color: #424242;/* cursor: pointer; */text-decoration: none;}
.grid-item a.grid-image .image {/* transform: scale(1) rotate(.01deg); *//* transition: .5s ease; */cursor: pointer;overflow: hidden;background-position: 0 0;background-repeat: no-repeat;background-size: cover;}

.grid-item a.grid-image .image.si01 {background-image: url(/assets/images/project_si/thumb_si_01_bg.png);}
.grid-item a.grid-image .image.si02 {background-image: url(/assets/images/project_si/thumb_si_02_bg.png);}
.grid-item a.grid-image .image.si03 {background-image: url(/assets/images/project_si/thumb_si_03_bg.png);}
.grid-item a.grid-image .image.si04 {background-image: url(/assets/images/project_si/thumb_si_04_bg.png);}
.grid-item a.grid-image .image.si05 {background-image: url(/assets/images/project_si/thumb_si_05_bg.png);}
.grid-item a.grid-image .image.si06 {background-image: url(/assets/images/project_si/thumb_si_06_bg.png);}
.grid-item a.grid-image .image.si07 {background-image: url(/assets/images/project_si/thumb_si_07_bg.png);}
.grid-item a.grid-image .image.si08 {background-image: url(/assets/images/project_si/thumb_si_08_bg.png);}
.grid-item a.grid-image .image.si09 {background-image: url(/assets/images/project_si/thumb_si_09_bg.png);}

.grid-item a.grid-image .image.sm01 {background-image: url(/assets/images/project_sm/thumb_sm_01_bg.png);}
.grid-item a.grid-image .image.sm02 {background-image: url(/assets/images/project_sm/thumb_sm_02_bg.png);}
.grid-item a.grid-image .image.sm03 {background-image: url(/assets/images/project_sm/thumb_sm_03_bg.png);}
.grid-item a.grid-image .image.sm04 {background-image: url(/assets/images/project_sm/thumb_sm_04_bg.png);}
.grid-item a.grid-image .image.sm05 {background-image: url(/assets/images/project_sm/thumb_sm_05_bg.png);}

.grid-item a.grid-image .image.solution01 {background-image: url(/assets/images/project_solution/thumb_solution_01_bg.png);}
.grid-item a.grid-image .image.solution02 {background-image: url(/assets/images/project_solution/thumb_solution_02_bg.png);}
.grid-item a.grid-image .image.solution03 {background-image: url(/assets/images/project_solution/thumb_solution_03_bg.png);}
.grid-item a.grid-image .image.solution04 {background-image: url(/assets/images/project_solution/thumb_solution_04_bg.png);}

.grid-item a.grid-image .image img {transform: scale(1) rotate(.01deg);transition: .5s ease;transition: .3s ease;transition: .25s ease;image-rendering: -webkit-optimize-contrast;width: 100%;}
.grid-item a.grid-image .image img.tablet {position: absolute; top: 0px; left: 0px; transform: none !important;}
.grid-item a.grid-image .image.none img {transform: scale(1) rotate(.00deg);}

.grid-item a.grid-image h2 {font-family: 'Calibri-Bold';font-size: 15px;padding: 15px 0 5px;transition: .3s ease;transition: .25s ease;cursor: pointer;letter-spacing: 0.2px;overflow:hidden;max-width:100%;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle;word-break: break-all;}
.grid-item a.grid-image p {font-size: 15px;letter-spacing: 0.1px;overflow:hidden;max-width:100%;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle;word-break: break-all;}

.grid-item a.grid-image:hover .image img {transform: scale(1.06) rotate(.01deg);}
.grid-item a.grid-image:hover .image.noact img {transform: scale(1) rotate(.01deg);}
.grid-item a.grid-image:hover .image.none img {transform: scale(1) rotate(.00deg);}
.grid-item a.grid-image h2:hover {color: #1A7EA6;text-decoration: line-through;}

.grid-item div.wp-caption { display: none;}

/* 싱글 페이지 */
.singleArea {position: relative;padding-top: 35px;margin-bottom: 57px;}
.singleArea:after {display: block; width: 0; height: 0; content: ""; clear: both;}

#single-wrapper {padding: 0;padding-top: 1000px; /* for single-page effect */overflow: visible !important;}

.single-item {position: relative;/* overflow: hidden; */margin: 0;}
.single-item h2 {font-family: 'Calibri-Bold';color: #3A3A3A;font-size: 28px;line-height: 35px;margin-bottom: 20px;}

.single-item .imageBox {/* overflow: hidden; */padding: 0;text-align: center;}
.single-item .imageBox a {display: block;padding: 0;}
.single-item .imageBox img {margin-bottom: 25px;image-rendering: -webkit-optimize-contrast;}
.single-item .imageBox .zoom {position: relative;}
.single-item .imageBox .zoom p {position: absolute;top: 0;right: -86px;font-size: 15px;color: #1A7EA6;}
.single-item .imageBox .zoom p span {padding-right: 3px;}

.single-item .descBox {position: absolute;top: 55px;right: -270px;max-width: 230px;width: 100%;padding-top: 20px;border-top: 2px solid #292929;}
.single-item .descBox dl {margin-bottom: 17px;}
.single-item .descBox dl dt {font-family: 'Calibri-Bold';font-size: 15px;letter-spacing: 0.2px;margin-top: 17px;margin-bottom: 3px;}
.single-item .descBox dl dt:first-child {margin-top: 0px;}
.single-item .descBox dl dd {font-size: 15px;letter-spacing: 0.2px;line-height: 23px;word-break: break-word;}
.single-item .descBox a.list {position: absolute;right: -6px;bottom: -19px;display: block;width: 25px;height: 25px;background: url("/assets/images/common/btn_icon_close_list.svg") no-repeat center;transition: 0.25s ease;}

/* 비디오 영역 */
.videoBG {position: absolute;left: 0;top: 0;width: 100%;height: 100vh;z-index: -1;}
.videoBG:after {position: fixed;top: 0;left: 0;content: "";width: 100%;height: 100%;left: 0;opacity: .7;background-color: #000;z-index: -1;}
.videoBG  video {position:fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);visibility: visible;max-width: none;min-width:100%;min-height:100%;width:auto;height:auto;z-index:-100;transition: .35s cubic-bezier(.77, 0, .18, 1);}

/* 포지션 */
.positionWrap {display: flex;align-items: center;height: 100%;}
.positionArea {flex: 1;}
.positionArea:after {display: block; width: 0; height: 0; content: ""; clear: both;}
.positionArea ul {display: flex;justify-content: space-between;flex-wrap: wrap;gap: 97px;}
.positionArea ul li {padding: 0;}
.positionArea ul li h2 {font-family: 'Calibri-Bold';color: #E8E8E8;font-size: 28px;line-height: 35px;margin-bottom: 20px;}
.positionArea ul li dl {}
.positionArea ul li dl dt {font-family: 'Calibri-Bold';font-size: 15px;color: #E8E8E8;letter-spacing: 0.2px;margin-top: 17px;margin-bottom: 3px;}
.positionArea ul li dl dt:first-child {margin-top: 0px;}
.positionArea ul li dl dd {font-size: 15px;color: #E8E8E8;letter-spacing: 0.2px;line-height: 23px;}

/* 컨택트 */
.mapArea {width: 100%;height: 100%;}

.mapArea .root_daum_roughmap {width: 100%;height: 100%;}
.mapArea .root_daum_roughmap .wrap_map {height: 100%;}
.mapArea .root_daum_roughmap .wrap_controllers {display: none;}
.mapArea .root_daum_roughmap .cont {display: none;}

/* 컨택트 */
.contactWrap {display: flex;align-items: center;height: 100%;}
.contactArea {flex: 1;}
.contactArea:after {display: block; width: 0; height: 0; content: ""; clear: both;}
.contactArea h2 {font-family: 'Calibri-Bold';font-size: 28px;line-height: 35px;margin-bottom: 20px;}
.contactArea dl {}
.contactArea dl dt {font-family: 'Calibri-Bold';font-size: 15px;letter-spacing: 0.2px;margin-top: 17px;margin-bottom: 3px;}
.contactArea dl dt:first-child {margin-top: 0px;}
.contactArea dl dd {font-size: 15px;letter-spacing: 0.2px;line-height: 23px;}
.contactArea dl dd span {color: #1A7EA6;}


















@media (max-width:1770px) {/* 최대 1770px */
/* 싱글 페이지 */
.single-item .imageBox .zoom p {display: none;}
.single-item .descBox {display: none;}











}










@media (max-width:1366px) {/* 최대 1366 */
/* 그리드 */
.grid-item {width: calc(33.33333% - 40.2px);}

/* 포지션 */
.positionArea ul {gap: 40px;}









}










@media (max-width:1250px) {/* 최대 1250 */
/* 포지션 */
.positionArea ul li {width: calc(33.33333% - 40px);}












}









@media (max-width:1024px) {/* 최대 1024 */
/* 그리드 */
.grid-item {width: calc(50% - 40.1px);}

/* 포지션 */
.positionArea ul li {width: calc(50% - 40px);}














}







@media (max-width:959px) {/* 최대 959 */
/* 그리드 */
#grid-wrapper {margin: 0 -10px;}
.grid-item {width: calc(50% - 20.1px);margin: 0 10px 20px;}

.singleArea + .gridArea #grid-wrapper {margin: 0 -10px;}
.singleArea + .gridArea #grid-wrapper .grid-item {width: calc(50% - 20.1px);margin: 0 10px 20px;}

/* 포지션 */
.positionWrap {margin-top: 20px;margin-bottom: 7px;}
.positionArea ul {gap: 37px;}
.positionArea ul li {width: calc(100% - 40px);}

/* 컨택트 */
.contactWrap {margin-top: 40px;margin-bottom: 7px;}













}






@media (max-width:480px) {/* 최대 480 */
/* 제목 */
.titleArea {padding-top: 20px;margin-bottom: 10px;}
.titleArea h2 {font-size: 24px;line-height: 29px;}

/* 그리드 */
.gridArea:before {display: none;}
#grid-wrapper {margin: 0;}
#grid-wrapper:before {top: -52px;height: 52px;}
.grid-item {width: 100%;margin: 0 0 20px;}
.grid-item a.grid-image h2 {display: none;}
.grid-item a.grid-image p {display: none;}

.singleArea + .gridArea:before {display: block; position:absolute;top: -2px;left: 0;display:block;content:"";width: 100%;height: 2px;background: #292929;z-index: 1;}

/* 싱글 페이지 */
.singleArea {padding-top: 20px;margin-bottom: 12px;}
.single-item h2 {font-family: 'Calibri-Bold';color: #3A3A3A;font-size: 28px;line-height: 35px;margin-bottom: 20px;}
.single-item .imageBox img {margin-bottom: 20px;}








}









@media (max-width:320px) {/* 최대 320 */
/* 전체 */







}








/* prevent css vanishing */
/* prevent css vanishing */
/* prevent css vanishing */
/* prevent css vanishing */
/* prevent css vanishing */
/* prevent css vanishing */
/* prevent css vanishing */