@charset "UTF-8";

/* 단일선택 셀렉트박스 디자인 */
.select-hidden {
  display: none;
  visibility: hidden;
}
.select-c::-ms-expand {
	display: none;
}
.select-c {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
  text-align:center;
  position:relative;
  border:1px solid #ccc;
  border-radius:1rem;
  width:100%;
  height:4.5rem;
  line-heighT:4.5rem;
  font-size:1.8rem;
  color:#333;
  padding:0;
  letter-spacing:-0.5px;
  background:#fff;
}
.select-styled:after {
  content: "";
  width:100%;
  height:100%;
  background-image:url('../../assets/images/mobile/ico-select.png');
  background-repeat:no-repeat;
  background-position:right 1rem center;
  background-size:1rem;
  position: absolute;
  top:0;
  right:0.5rem;
}
.select-styled:active:after, .select-styled.active:after {
  background-image:url('../../assets/images/mobile/ico-select.png');
  background-repeat:no-repeat;
  background-position:right 1rem center;
  background-size:1rem;
}
.select-options {
  display:none;
  position: absolute;
  top:4.5rem;
  left:-1px;
  right:0;
  z-index: 10;
  margin:0;
  padding:0;
  width: calc(100% + 2px );
  list-style: none;
  background:#fff;
  border-radius:1rem;
  overflow-y:hidden;
  border:1px solid #ccc;
}
.select-options { -webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjust:none;scrollbar-color:#D9D9D9;scrollbar-width:thin;  }
.select-options::-webkit-scrollbar{width:0.8rem; border-radius:0.8rem;}
.select-options::-webkit-scrollbar-track{background:#fff;  }
.select-options::-webkit-scrollbar-thumb{background:#D9D9D9;border-radius:100px}
.select-options::-webkit-scrollbar-thumb:hover{background:#ccc; -webkit-text-size-adjust:none;}

.select-options li {
  margin: 0 !important;
  padding:0;
  line-height:4.5rem !important;
  -moz-transition: all 0.1s ease-in;
  -o-transition: all 0.1s ease-in;
  -webkit-transition: all 0.1s ease-in;
  transition: all 0.1s ease-in;
  font-size:1.8rem;
  border-top:0;
  color:#777;
  border-bottom:1px solid #DEE2E5;
}
.select-options li:last-child {
	border-bottom:0;
}
.select-options li:hover {
  background:#EBF3FF;
}
.select-options li[rel="hide"] {
  display: none;
}


/* 셀렉트박스 기본 */
.select {
    background:url('../../assets/images/mobile/ico-select.png') no-repeat;
    background-position: right 2rem center;
	cursor: pointer;
	text-align:center;
	position:relative;
	border:1px solid #ccc;
	border-radius:1rem;
	width:100%;
	height:4.5rem;
	line-height:4.5rem;
	font-size:1.8rem;
	color:#333;
	padding:0 1rem;
	letter-spacing:-0.5px;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.select::-ms-expand { display: none; }
.select:focus { border:1px solid #333 !important; }
.select.auto { width:auto; flex:none; }



/* 레이아웃 정렬 */
.no-flex { display:block !important; }
.d-flex { display:flex; }
.flex-direction-row { flex-direction: row; }
.flex-direction-column { flex-direction: column; }

.flex-direction-row-reverse { flex-direction:row-reverse; }

.align-items-start { align-items:flex-start }
.align-items-center { align-items:center }
.align-items-end { align-items:flex-end }

.justify-content-start { justify-content:flex-start }
.justify-content-center { justify-content:center }
.justify-content-end { justify-content:flex-end }
.justify-content-between { justify-content:space-between }

.flex-wrap { flex-wrap:wrap }

.mt-auto { margin-top:auto; }
.ml-auto { margin-left:auto; }
.mr-auto { margin-right:auto; }
.mb-auto { margin-bottom:auto; }
.m-auto { margin:0 auto !important;}

.col-auto { flex:1; }
.col-100 { width:100% !important; }
.col-50 { width:50% !important; }

.h-50 { height:50% !important; }
.h-100 { height:100% !important; }


/* 텍스트 정렬 */
.text-left { text-align:left !important; }
.text-center { text-align:center !important; }
.text-right { text-align:right !important; }

/* 마진&여백 */
.p-0 { padding:0 !important; }
.pt-1 { padding-top:1rem !important; }
.pt-2 { padding-top:2rem !important; }
.pt-3 { padding-top:3rem !important; }
.pt-4 { padding-top:4rem !important; }
.pt-5 { padding-top:5rem !important; }
.pt-6 { padding-top:6rem !important; }
.pt-7 { padding-top:7rem !important; }
.pt-8 { padding-top:8rem !important; }
.pt-9 { padding-top:9rem !important; }
.pt-10 { padding-top:10rem !important; }

.pl-1 { padding-left:1rem !important; }
.pl-2 { padding-left:2rem !important; }
.pl-3 { padding-left:3rem !important; }
.pl-4 { padding-left:4rem !important; }
.pl-5 { padding-left:5rem !important; }
.pl-6 { padding-left:6rem !important; }
.pl-7 { padding-left:7rem !important; }
.pl-8 { padding-left:8rem !important; }
.pl-9 { padding-left:9rem !important; }
.pl-10 { padding-left:10rem !important; }

.pr-1 { padding-right:1rem !important; }
.pr-2 { padding-right:2rem !important; }
.pr-3 { padding-right:3rem !important; }
.pr-4 { padding-right:4rem !important; }
.pr-5 { padding-right:5rem !important; }
.pr-6 { padding-right:6rem !important; }
.pr-7 { padding-right:7rem !important; }
.pr-8 { padding-right:8rem !important; }
.pr-9 { padding-right:9rem !important; }
.pr-10 { padding-right:10rem !important; }

.pb-1 { padding-bottom:1rem !important; }
.pb-2 { padding-bottom:2rem !important; }
.pb-3 { padding-bottom:3rem !important; }
.pb-4 { padding-bottom:4rem !important; }
.pb-5 { padding-bottom:5rem !important; }
.pb-6 { padding-bottom:6rem !important; }
.pb-7 { padding-bottom:7rem !important; }
.pb-8 { padding-bottom:8rem !important; }
.pb-9 { padding-bottom:9rem !important; }
.pb-10 { padding-bottom:10rem !important; }

.m-0 { margin:0 !important; }
.mt-0 { margin-top:0rem !important; }
.mt-1 { margin-top:1rem !important; }
.mt-015 { margin-top:1.5rem !important; }
.mt-2 { margin-top:2rem !important; }
.mt-025 { margin-top:2.5rem !important; }
.mt-3 { margin-top:3rem !important; }
.mt-4 { margin-top:4rem !important; }
.mt-5 { margin-top:5rem !important; }
.mt-6 { margin-top:6rem !important; }
.mt-7 { margin-top:7rem !important; }
.mt-8 { margin-top:8rem !important; }
.mt-9 { margin-top:9rem !important; }
.mt-10 { margin-top:10rem !important; }
.mt-11 { margin-top:11rem !important; }

.ml-05 { margin-left:0.5rem !important; }
.ml-1 { margin-left:1rem !important; }
.ml-2 { margin-left:2rem !important; }
.ml-3 { margin-left:3rem !important; }
.ml-4 { margin-left:4rem !important; }
.ml-5 { margin-left:5rem !important; }
.ml-6 { margin-left:6rem !important; }
.ml-7 { margin-left:7rem !important; }
.ml-8 { margin-left:8rem !important; }
.ml-9 { margin-left:9rem !important; }
.ml-10 { margin-left:10rem !important; }

.mr-05 { margin-right:0.5rem !important; }
.mr-1 { margin-right:1rem !important; }
.mr-015 { margin-right:1.5rem !important; }
.mr-2 { margin-right:2rem !important; }
.mr-3 { margin-right:3rem !important; }
.mr-4 { margin-right:4rem !important; }
.mr-5 { margin-right:5rem !important; }
.mr-6 { margin-right:6rem !important; }
.mr-7 { margin-right:7rem !important; }
.mr-8 { margin-right:8rem !important; }
.mr-9 { margin-right:9rem !important; }
.mr-10 { margin-right:10rem !important; }

.mb-0 { margin-bottom:0rem !important; }
.mb-1 { margin-bottom:1rem !important; }
.mb-2 { margin-bottom:2rem !important; }
.mb-3 { margin-bottom:3rem !important; }
.mb-4 { margin-bottom:4rem !important; }
.mb-5 { margin-bottom:5rem !important; }
.mb-6 { margin-bottom:6rem !important; }
.mb-7 { margin-bottom:7rem !important; }
.mb-8 { margin-bottom:8rem !important; }
.mb-9 { margin-bottom:9rem !important; }
.mb-10 { margin-bottom:10rem !important; }

.scroll-y { overflow-x:hidden; overflow-y:auto !important; }
.scroll-no { overflow:hidden !important; }

/* 폰트 */
.font-80 { font-size:8rem !important; }
.font-100 { font-size:10rem !important; }

/* 목록 형태 */
ul.info li { margin:0 0 1rem; font-size:1.6rem; color:#666; padding-left:3rem; background:url('../../assets/images/ico_list_dot.png') 0 0.3rem no-repeat; }


a.more { transition:all 0.2s ease-out; margin-bottom:2rem; font-size:1.6rem; color:#1168B5; font-weight:700; padding-right:3rem; background:url('../../assets/images/ico_more.png') 100% 50% no-repeat; }
a.more:hover { text-decoration:underline; background:url('../../assets/images/ico_more.png') 95% 50% no-repeat; }


#wrapper { height:100%; }

/***** 헤더 *****/
header.gnb { transition:all 0.1s ease-out; position:fixed; top:0; left:0; width:100%; height:11rem; padding:0 10rem; z-index:99999999999; }
header.gnb .logo { }
header.gnb.active { background:rgba(0,0,0,0.4); }
header.gnb .menu li { margin-left:2rem; }
header.gnb .menu li a { padding:0 1.5rem; transition:all 0.2s ease-out; position:relative; font-size:1.6rem; font-weight:500; color:#fff; }
header.gnb .menu li a::after { content:""; transition:all 0.2s ease-out; position:absolute; left:50%; transform:translateX(-50%); bottom:-1rem; width:0; height:0.3rem; background:#fff;  }
header.gnb .menu li a:hover::after { content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:-1rem; width:3rem; height:0.3rem; background:#fff; }
header.gnb .menu li.active a::after { content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:-1rem; width:3rem; height:0.3rem; background:#fff;  }
header.gnb .menu li.active a:hover::after { content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:-1rem; width:3rem; height:0.3rem; background:#fff; }

header.gnb .menu li a.box { display:block; font-size:1.4rem; font-weight:400; text-align:center; width:10.8rem; height:3.2rem; line-height:3.2rem; padding:0 1rem; background:rgba(255,255,255,.2); border-radius:1.6rem; }
header.gnb .menu li a.box:hover { color:#333; background:rgba(255,255,255,.8); }
header.gnb .menu li a.box:hover::after { display:none; }


.container { overflow:hidden; }
.device-mobile { display:none; }

@media all and (max-width:1023px) {
	
	img { max-width:100%; height:auto; }
	.device-pc { display:none !important; }
	.device-mobile { display:block !important; }
	.mobile-br { display:block !important; }
	.container { padding-bottom:8rem;  }

	
	header.gnb { transition:all 0.1s ease-out; position:fixed; top:0; left:0; width:100%; height:7rem; padding:0 2rem; z-index:99999999999; }
	header.gnb .logo img { width:15rem; }
	header.gnb.active { background:rgba(0,0,0,0.4); }
	header.gnb .menu li { margin-left:2rem; }
	header.gnb .menu li a { padding:0 1.5rem; transition:all 0.2s ease-out; position:relative; font-size:1.6rem; font-weight:500; color:#fff; }
	header.gnb .menu li a::after { content:""; transition:all 0.2s ease-out; position:absolute; left:50%; transform:translateX(-50%); bottom:-1rem; width:0; height:0.3rem; background:#fff;  }
	header.gnb .menu li a:hover::after { content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:-1rem; width:3rem; height:0.3rem; background:#fff; }
	header.gnb .menu li.active a::after { content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:-1rem; width:3rem; height:0.3rem; background:#fff;  }
	header.gnb .menu li.active a:hover::after { content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:-1rem; width:3rem; height:0.3rem; background:#fff; }

	header.gnb .menu li a.box { display:block; font-size:1.4rem; font-weight:400; text-align:center; width:10.8rem; height:3.2rem; line-height:3.2rem; padding:0 1rem; background:rgba(255,255,255,.2); border-radius:1.6rem; }
	header.gnb .menu li a.box:hover { color:#333; background:rgba(255,255,255,.8); }
	header.gnb .menu li a.box:hover::after { display:none; }
	
	header.gnb button.btn-m-menu { margin-left:auto; width:2.4rem; height:2.4rem; background:url('../../assets/images/mobile/ico-menu.png') 50% 50% no-repeat; }

	#mobile-menu { position:fixed; top:0; left:0; width:100%; height:100%; z-index:9999999999999; background:#fff; }
	#mobile-menu .header { display:flex; align-items:center;  height:6.5rem; padding:0 2rem; border-bottom:1px solid #DEDEDE; }
	#mobile-menu button.btn-m-close { margin-left:auto; width:2.5rem; height:2.5rem; background:url('../../assets/images/mobile/ico-menu-close.png') 50% 50% no-repeat; }
	#mobile-menu li a { font-size:2.4rem; font-weight:700; color:#333; display:flex; align-items:center;  height:6.5rem; padding:0 3rem; border-bottom:1px solid #DEDEDE; background:url('../../assets/images/mobile/ico-link-arrow.png') no-repeat; background-position: right 3rem center; }
	#mobile-menu .link { display:block; margin:0 auto; font-size:1.8rem; width:16rem; height:4rem; border-radius:2rem; background:#F5F5F5; display:flex; align-items:center; justify-content:center; }



}


/* 메인 비주얼 스와이프 */
.visualSwiper { position:relative; overflow:hidden; border-radius:0 10rem 0 25rem; }
.visualSwiper .swiper-slide { position:relative; height:90rem; }
.visualSwiper .swiper-slide .txt { position:absolute; width:100%; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center; }
.visualSwiper .swiper-slide h1 { margin:0 0 4rem; font-size:12rem; color:#fff; font-weight:400; }
.visualSwiper .swiper-slide h1 strong { font-weight:700; }
.visualSwiper .swiper-slide h1.sty2 { margin:0 0 4rem; font-size:8rem; color:#fff; font-weight:400;  }
.visualSwiper .swiper-slide h1.sty2 strong { font-size:10rem; font-weight:700; }
.visualSwiper .swiper-slide h1.sty2 .logo-img { margin-left:1rem; display:inline-block; vertical-align:middle; width:25.1rem; height:10.6rem; background:url('../../assets/images/txt-logo.png') 50% 50% no-repeat; background-size:contain; }
.visualSwiper .swiper-slide h2 { margin:0 0 1rem; font-size:3rem; font-weight:700; color:#fff; }
.visualSwiper .swiper-slide p.description {  font-size:1.6rem; font-weight:400; color:#fff; line-height:2.6rem; }
.visualSwiper .btnWrap { position:absolute; top:67rem; left:50%; transform:translateX(-50%); z-index:2; display:flex; align-items:center; }
.visualSwiper .visualSwiper-button-prev { display:flex; align-items:center; margin-right:1.5rem; }
.visualSwiper .visualSwiper-button-prev i { transition:all 0.2s ease-out; margin-right:1rem; width:7rem; height:5rem; background:url('../../assets/images/btn-swiper-left.png') 50% 50% no-repeat; }
.visualSwiper .visualSwiper-button-prev:hover i { margin-right:2rem; }
.visualSwiper .visualSwiper-button-next { display:flex; align-items:center; margin-left:1.5rem;  }
.visualSwiper .visualSwiper-button-next i { transition:all 0.2s ease-out; margin-left:1rem; width:7rem; height:5rem; background:url('../../assets/images/btn-swiper-right.png') 50% 50% no-repeat; }
.visualSwiper .visualSwiper-button-next:hover i { margin-left:2rem; }
.visualSwiper .btnWrap span { font-size:1.2rem; font-weight:900; color:#fff; position:relative; bottom:-0.25rem; }

/* 스크롤 다운 애니메이션 */
.scroll-Wrap { position:absolute; bottom:5rem; left:50%; transform:translateX(-50%); z-index:2; display:flex; align-items:center; justify-content:center; flex-direction:column; }
.scroll-Wrap .scroll-arrow { width:8px; height:8px; border-right: 2px solid white; border-bottom: 2px solid white; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg);  -ms-transform: rotate(45deg); animation: arrow-wave 0.5s infinite; animation-direction: alternate;}
.scroll-Wrap .scroll-arrow:nth-child(1) {animation-delay: 0.1s;}
.scroll-Wrap .scroll-arrow:nth-child(2) {margin-top:5px; animation-delay: 0.2s;}
.scroll-Wrap .scroll-arrow:nth-child(3) {margin-top:5px; animation-delay: 0.3s;}
@keyframes arrow-wave {
	0% {opacity: 0;}
	50% {opacity: .5;}
	100% {opacity: 1;}
}
@keyframes arrow_down{
	0%{top:28px;}
	50%{top:40px;}
	100%{top:28px;}
}
.scroll-Wrap p { margin:1rem 0 0; font-size:1.4rem; color:#fff; font-weight:700; }



@media all and (max-width:1023px) {

	.visualSwiper {  position:relative; overflow:hidden; border-radius:0 5rem 0 10rem; }
	.visualSwiper .swiper-slide { position:relative; height:72rem; }
	.visualSwiper .swiper-slide .txt { position:absolute; width:100%; top:50%; left:50%; transform:translate(-50%, -80%); text-align:center; }
	.visualSwiper .swiper-slide h1 { margin:0 0 2rem; line-height:6rem; font-size:4rem !important; color:#fff; font-weight:400; }
	.visualSwiper .swiper-slide h1 strong { font-size:5rem !important; font-weight:700; }
	.visualSwiper .swiper-slide h1.sty2 .logo-img { display:block; margin:0 auto; width:25.1rem; height:10.6rem; background:url('../../assets/images/txt-logo.png') 50% 50% no-repeat; background-size:80%; }
	.visualSwiper .swiper-slide h2 { margin:0 0 1rem; font-size:2.4rem !important; font-weight:700; color:#fff; }
	.visualSwiper .swiper-slide p.description {  font-size:1.6rem; font-weight:300; color:#fff; }
	.visualSwiper .btnWrap { position:absolute; top:48rem; left:50%; transform:translateX(-50%); z-index:2; display:flex; align-items:center; }
	.visualSwiper .visualSwiper-button-prev { display:flex; align-items:center; margin-right:1.5rem; }
	.visualSwiper .visualSwiper-button-prev i { transition:all 0.2s ease-out; margin-right:1rem; width:7rem; height:5rem; background:url('../../assets/images/btn-swiper-left.png') 50% 50% no-repeat; }
	.visualSwiper .visualSwiper-button-prev:hover i { margin-right:2rem; }
	.visualSwiper .visualSwiper-button-next { display:flex; align-items:center; margin-left:1.5rem;  }
	.visualSwiper .visualSwiper-button-next i { transition:all 0.2s ease-out; margin-left:1rem; width:7rem; height:5rem; background:url('../../assets/images/btn-swiper-right.png') 50% 50% no-repeat; }
	.visualSwiper .visualSwiper-button-next:hover i { margin-left:2rem; }
	.visualSwiper .btnWrap span { font-size:1.2rem; font-weight:900; color:#fff; position:relative; bottom:-0.25rem; }

}



/* 비앤피 하는 일 */
section.works { margin:10rem 0 0; padding:0 10rem; }
section.works .txt { flex:1; }
section.works .txt h2 { font-size:7.5rem; font-weight:400; line-height:10rem; }
section.works .txt h2 strong { font-size:9rem; font-weight:700; }
section.works ul.slider { height:60rem; }
section.works ul.slider li { cursor:pointer; transition:all 0.2s ease-out; width:12rem; margin-left:2rem; border-radius:1rem; padding:5rem 3.5rem; }
section.works ul.slider li:nth-child(1) { background:url('../../assets/images/hover_img.png') 50% 50% no-repeat; background-size:cover; }
section.works ul.slider li:nth-child(2) { background:url('../../assets/images/hover_img-2.png') 50% 50% no-repeat; background-size:cover; }
section.works ul.slider li:nth-child(3) { background:url('../../assets/images/hover_img-3.png') 50% 50% no-repeat; background-size:cover; }
section.works ul.slider li:nth-child(4) { background:url('../../assets/images/hover_img-4.png') 50% 50% no-repeat; background-size:cover; }
section.works ul.slider li .after { display:none; }
section.works ul.slider li p { display:flex; align-items:center; color:#fff; font-size:2.4rem; font-weight:400; white-space: nowrap; transform:rotate(90deg); }
section.works ul.slider li p span { font-size:3.6rem; font-weight:500; margin-right:2rem; }
section.works ul.slider li.active {  width:80rem; }
section.works ul.slider li.active p { display:block; color:#fff; font-size:3.6rem; font-weight:700; transform:rotate(0); }
section.works ul.slider li.active p span { display:block; font-size:7.5rem; font-weight:700; margin:0 0 3rem; }
section.works ul.slider li.active .after { display:block; }
section.works ul.slider li.active .after p { display:block; font-size:1.8rem; font-weight:400; color:#DEDEDE; }


@media all and (max-width:1023px) {

	section.works { margin:5rem 0 0; padding:0 2rem; display:block; }
	section.works .txt { flex:1; }
	section.works .txt h2 { font-size:4rem; font-weight:400; line-height:5rem; }
	section.works .txt h2 strong { font-size:4.5rem; font-weight:700; }
	section.works ul.slider { height:auto; margin:3rem 0 0; display:block; }
	section.works ul.slider li { cursor:pointer; transition:all 0.2s ease-out; width:100%; margin-left:0; margin:1rem 0 0; border-radius:1rem; padding:2rem; }
	section.works ul.slider li:nth-child(1) { background:url('../../assets/images/hover_img.png') 50% 50% no-repeat; background-size:cover; }
	section.works ul.slider li:nth-child(2) { background:url('../../assets/images/hover_img-2.png') 50% 50% no-repeat; background-size:cover; }
	section.works ul.slider li:nth-child(3) { background:url('../../assets/images/hover_img-3.png') 50% 50% no-repeat; background-size:cover; }
	section.works ul.slider li:nth-child(4) { background:url('../../assets/images/hover_img-4.png') 50% 50% no-repeat; background-size:cover; }
	section.works ul.slider li .after { display:none; }
	section.works ul.slider li p { display:flex; align-items:center; color:#fff; font-size:1.8rem; font-weight:400; white-space: nowrap; transform:rotate(0); }
	section.works ul.slider li p span { font-size:3rem; font-weight:500; margin-right:2rem; }
	section.works ul.slider li.active {  width:auto; height:32rem; }
	section.works ul.slider li.active p { display:block; color:#fff; font-size:2.4rem; font-weight:700; transform:rotate(0); }
	section.works ul.slider li.active p span { display:block; font-size:4.5rem; font-weight:700; margin:0 0 3rem; }
	section.works ul.slider li.active .after { display:block; }
	section.works ul.slider li.active .after p { display:block; font-size:1.6rem; font-weight:400; color:#DEDEDE; }

}


/* 흐르는 슬러건 */
section.bnp-works { position:relative; height:90rem; overflow:hidden; margin:15rem 0 0; background:url('../../assets/images/main-con-1-bg.png') 50% 50% no-repeat; background-size:cover; }
section.bnp-works .con { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); z-index:2; }
section.bnp-works .txtWrap { display: flex; align-items:center; white-space: nowrap; overflow: hidden;  }
section.bnp-works .txtWrap .text { color:rgba(255,255,255,.06); font-size:24rem; font-weight:900; animation: textLoop 15s linear infinite; padding-right:10rem; }

@keyframes textLoop {
    0% {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
    100% {
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
    }
}


@media all and (max-width:1023px) {

	section.bnp-works { align-items:center; justify-content:center; position:relative; height:auto; overflow:hidden; margin:5rem 0 0; background:#111; }
	section.bnp-works .con { position:relative; top:0; left:0; transform:none; z-index:2; text-align:center; }
	section.bnp-works .txtWrap { display:none; align-items:center; white-space: nowrap; overflow: hidden;  }
	section.bnp-works .txtWrap .text { color:rgba(255,255,255,.06); font-size:24rem; font-weight:900; animation: textLoop 15s linear infinite; padding-right:10rem; }

}


/***** 메인 포트폴리오 *****/
section.portfolio { margin:22rem 0 0; position:relative; }
section.portfolio .title { position:absolute; top:-3rem; left:10rem; z-index:2; }
section.portfolio .title h2 { font-size:9rem; color:#333; font-weight:700; line-height:10rem; }
section.portfolio .imgWrap { position:relative; }
section.portfolio .txtWrap { position:relative; padding:17rem 8rem 0; flex:1; }
section.portfolio .txtWrap .category { font-size:1.8rem; font-weight:700; color:#1168B5; }
section.portfolio .txtWrap .subject { font-size:5rem; font-weight:400; color:#333; line-height:6rem; }
section.portfolio .txtWrap .subject strong { font-weight:900; }
section.portfolio .txtWrap .description { font-size:1.8rem; color:#666; }
section.portfolio .txtWrap .line { background:url('../../assets/images/line.png') 50% 0 no-repeat; }
section.portfolio .txtWrap ul.tab-tag { display:flex; }
section.portfolio .txtWrap ul.tab-tag li { transition:all 0.2s ease-out; cursor:pointer; font-size:1.8rem; font-weight:500; color:#999; width:25%; margin-right:1rem; display:flex; align-items:center; justify-content:center; border:1px solid #ccc; height:4.5rem; border-radius:1rem; }
section.portfolio .txtWrap ul.tab-tag li.active { color:#fff; background:#333; }
section.portfolio .txtWrap ul.tab-tag li:last-child { margin-right:0; }
section.portfolio .txtWrap .tab-content { display:none; }
section.portfolio .txtWrap .tab-content.active { display:block; }


@media all and (max-width:1023px) {

	section.portfolio { margin:10rem 0 0; position:relative; }
	section.portfolio .d-flex { display:block; }
	section.portfolio .title { position:absolute; top:-4rem; left:2rem; z-index:2; }
	section.portfolio .title h2 { font-size:4.5rem; color:#333; font-weight:700; line-height:5.5rem; }
	section.portfolio .imgWrap { position:relative; }
	section.portfolio .txtWrap { position:relative; padding:3rem 2rem 0; flex:1; }
	section.portfolio .txtWrap .category { font-size:1.6rem; font-weight:700; color:#1168B5; }
	section.portfolio .txtWrap .subject { font-size:2.8rem; font-weight:400; color:#333; line-height:150%; }
	section.portfolio .txtWrap .subject strong { font-weight:900; }
	section.portfolio .txtWrap .description { font-size:1.7rem; color:#666; }
	section.portfolio .txtWrap .line { background:url('../../assets/images/line.png') 50% 0 no-repeat; }
	section.portfolio .txtWrap ul.tab-tag { display:flex; }
	section.portfolio .txtWrap ul.tab-tag li { transition:all 0.2s ease-out; cursor:pointer; font-size:1.8rem; font-weight:500; color:#999; width:25%; margin-right:1rem; display:flex; align-items:center; justify-content:center; border:1px solid #ccc; height:4.5rem; border-radius:1rem; }
	section.portfolio .txtWrap ul.tab-tag li.active { color:#fff; background:#333; }
	section.portfolio .txtWrap ul.tab-tag li:last-child { margin-right:0; }
	section.portfolio .txtWrap .tab-content { display:none; }
	section.portfolio .txtWrap .tab-content.active { display:block; }

}




/***** 푸터 *****/
.top-btn { display:none; position:fixed; z-index:999999; right:1rem; bottom:7rem; width:8rem; height:8rem; background:url('../../assets/images/ico-top.png') 50% 0 no-repeat; }
footer.footer { position:relative; background:#333; padding:6rem 10rem;  }
footer.footer .logo { margin-right:14rem; }
footer.footer .logo p { font-size:2rem; color:#fff; }
footer.footer .copyright { flex:1; }
footer.footer .copyright dl { display:flex; }
footer.footer .copyright dl dt { width:11rem; font-size:1.6rem; color:#fff; font-weight:500; }
footer.footer .copyright dl dd { font-size:1.6rem; color:#999;  }
footer.footer .copyright dl.line { border-bottom:1px solid #666; padding:0 0 2rem; }
footer.footer .copyright dl.line span { display:inline-block; height:1rem; border-right:1px solid #666; margin:0 1rem; }
footer.footer .copyright .copyright-txt { font-size:1.6rem; color:#666; margin:2rem 0 0; }

@media all and (max-width:1023px) {
	
	footer.footer { position:relative; background:#333; padding:3rem 2rem; }
	footer.footer .d-flex { display:block; }
	footer.footer .logo { margin-right:0; }
	footer.footer .logo p { font-size:2rem; color:#fff; }
	footer.footer .copyright { flex:1; margin:3rem 0 0; }
	footer.footer .copyright dl { display:block; }
	footer.footer .copyright dl dt { width:11rem; font-size:1.4rem; color:#fff; font-weight:500; }
	footer.footer .copyright dl dd { font-size:1.4rem; color:#999;  }
	footer.footer .copyright dl.line { margin:1rem 0 0; border-bottom:1px solid #666; padding:0 0 2rem; }
	footer.footer .copyright dl.line dd { margin:1rem 0 0; line-height:100%; }
	footer.footer .copyright dl.line span { display:block; border:0; margin:0; padding:0; } 
	footer.footer .copyright .copyright-txt { font-size:1.6rem; color:#666; margin:2rem 0 0; }

}



/***** 서브 *****/

/* 공통 */
table.fixed { table-layout:fixed; }
table.tbl-a { border-top:2px solid #1168B5; margin:4rem 0 0; }
table.tbl-a th { width:11rem; height:6.5rem; text-align:left; font-size:1.7rem; padding:0 1rem; color:#333; font-weight:700; border-bottom:1px solid #DEDEDE; }
table.tbl-a td { height:6.5rem; font-size:1.7rem; color:#333; border-bottom:1px solid #DEDEDE; padding:0 1rem; }
table.tbl-a td.w-320 { width:32rem; }


/* 서브 비주얼 */
.visualWrap { height:60rem; display:flex; align-items:center; justify-content:center; }
.visualWrap .title { text-align:center; }
.visualWrap .title h1 { font-size:11rem; color:#fff;  }
.visualWrap .title p.description { font-size:2rem; color:#DEDEDE; }
.visualWrap.about {  background:rgba(0, 0, 0, 0.4) url('../../assets/images/about_bg.png') 50% 50% no-repeat; background-size:cover; background-blend-mode: multiply; }
.visualWrap.works {  background:rgba(0, 0, 0, 0.4) url('../../assets/images/works_bg.png') 50% 50% no-repeat; background-size:cover; background-blend-mode: multiply; }
.visualWrap.contact {  background:rgba(0, 0, 0, 0.4) url('../../assets/images/contact_bg.png') 50% 50% no-repeat; background-size:cover; background-blend-mode: multiply; }


@media all and (max-width:1023px) {

	.visualWrap { height:24rem; display:flex; align-items:center; justify-content:center; }
	.visualWrap .title { text-align:center; }
	.visualWrap .title h1 { font-size:4rem; color:#fff;  }
	.visualWrap .title p.description { font-size:1.6rem; color:#DEDEDE; }
	.visualWrap.about {  background:rgba(0, 0, 0, 0.4) url('../../assets/images/mobile/about_bg.png') 50% 50% no-repeat; background-size:cover; background-blend-mode: multiply; }
	.visualWrap.works {  background:rgba(0, 0, 0, 0.4) url('../../assets/images/mobile/works_bg.png') 50% 50% no-repeat; background-size:cover; background-blend-mode: multiply; }
	.visualWrap.contact {  background:rgba(0, 0, 0, 0.4) url('../../assets/images/mobile/contact_bg.png') 50% 50% no-repeat; background-size:cover; background-blend-mode: multiply; }

}


/*** about ***/

/* 회사소개 */
.container-about { min-height:50rem; overflow:hidden; }
.container-about section.about-company { }
.container-about section.about-company .wrap { max-width:144rem; margin:0 auto; padding:8rem 0 12rem; }
.container-about section.about-company .wrap .title { text-align:center; }
.container-about section.about-company .wrap .title p { font-size:1.4rem; color:#999; }
.container-about section.about-company .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
.container-about section.about-company .wrap .title h2 { font-size:5rem; color:#333; }
.container-about section.about-company .wrap .Slogan { margin:12.5rem 0 0; display:flex; align-items:center; justify-content:center; padding:0 0 6.5rem; border-bottom:1px dashed #DEDEDE; }
.container-about section.about-company .wrap .Slogan p { text-align:center; }
.container-about section.about-company .wrap .Slogan p:nth-child(1) { font-size:8.5rem; color:#1168B5; font-weight:900; }
.container-about section.about-company .wrap .Slogan p:nth-child(3) { font-size:8.5rem; color:#0DA3DE; font-weight:900; }
.container-about section.about-company .wrap .Slogan p:nth-child(5) { font-size:8.5rem; color:#059B65; font-weight:900; }
.container-about section.about-company .wrap .Slogan p:nth-child(2),
.container-about section.about-company .wrap .Slogan p:nth-child(4) { flex:1; font-size:5rem; color:#DEDEDE; }
.container-about section.about-company .wrap .infoWrap { display:flex; align-items:center; margin:8rem 0 0; }
.container-about section.about-company .wrap .infoWrap .logo { padding-left:5rem; }
.container-about section.about-company .wrap .infoWrap .txt { width:100rem; margin-left:15rem; }
.container-about section.about-company .wrap .infoWrap .txt .big { font-size:4rem; color:#333; font-weight:700; margin:0 0 2rem; }

/* 인사말 */
.container-about section.about-ceo { background:#111; }
.container-about section.about-ceo .wrap { max-width:144rem; margin:0 auto; padding:8rem 0 12rem; }
.container-about section.about-ceo .wrap .title { text-align:center; }
.container-about section.about-ceo .wrap .title p { font-size:1.4rem; color:#999; }
.container-about section.about-ceo .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
.container-about section.about-ceo .wrap .title h2 { font-size:5rem; color:#fff; }
.container-about section.about-ceo .wrap .infoWrap { display:flex; align-items:center; }
.container-about section.about-ceo .wrap .infoWrap .txt { flex:1; }
.container-about section.about-ceo .wrap .infoWrap .txt p { font-size:1.8rem; color:#ccc; }
.container-about section.about-ceo .wrap .infoWrap .txt p span { color:#64A6BD; }
.container-about section.about-ceo .wrap .infoWrap .txt p.name { margin:3rem 0 0; font-size:1.6rem; color:#ccc; }
.container-about section.about-ceo .wrap .infoWrap .txt p.name strong { font-size:4rem; color:#fff; font-weight:500; }
.container-about section.about-ceo .wrap .infoWrap .img { margin-left:8rem; width:52rem; height:52rem; background:url('../../assets/images/about-con-1.png') 50% 50% no-repeat; }

/* 연혁 */
.container-about section.about-history { }
.container-about section.about-history .wrap { max-width:144rem; margin:0 auto; padding:8rem 0 12rem; }
.container-about section.about-history .wrap .title { text-align:center; }
.container-about section.about-history .wrap .title p { font-size:1.4rem; color:#999; }
.container-about section.about-history .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
.container-about section.about-history .wrap .title h2 { font-size:5rem; color:#333; }
.container-about section.about-history .wrap .infoWrap { display:flex; align-items:center; }
.container-about section.about-history .wrap .infoWrap.block { margin:5rem 0 0; display:block !important; }
.container-about section.about-history .wrap .infoWrap ul.tab-history { display:flex; align-items:center; justify-content:center; }
.container-about section.about-history .wrap .infoWrap ul.tab-history li { transition:all 0.2s ease-out; margin:0 0.6rem; cursor:pointer; width:18rem; height:4.5rem; display:flex; align-items:center; justify-content:center; }
.container-about section.about-history .wrap .infoWrap ul.tab-history li { border:1px solid #ccc; border-radius:1rem; font-size:1.8rem; color:#999; }
.container-about section.about-history .wrap .infoWrap ul.tab-history li.active {background:#1168B5; color:#fff; }
.container-about section.about-history .wrap .infoWrap .tab-history-content { display:none; margin:8rem 0 0; }
.container-about section.about-history .wrap .infoWrap .tab-history-content.active { display:flex; }

.container-about section.about-history .wrap .infoWrap .tab-history-content .year { width:50%; line-height:150%; font-size:25rem; font-weight:700; color:#F5F5F5; }
.container-about section.about-history .wrap .infoWrap .tab-history-content ul.list { width:50%; }

.container-about section.about-history .wrap .infoWrap .tab-history-content ul.list li { position:relative; padding:0 0 2rem 3rem; font-size:1.8rem; color:#333; background:url('../../assets/images/line-list.png') 0 0 repeat-y; }
.container-about section.about-history .wrap .infoWrap .tab-history-content ul.list li:last-child { padding-bottom:0; }
.container-about section.about-history .wrap .infoWrap .tab-history-content ul.list li:before { content:""; width:1.6rem; height:1.6rem; position:absolute; top:0.6rem; left:-0.8rem; z-index:9; background:url('../../assets/images/ico-dot.png') 0 0 repeat-y; }

/* 인증/기술력 */
.container-about section.about-certification { }
.container-about section.about-certification .wrap { max-width:144rem; margin:0 auto; padding:8rem 0 12rem; }
.container-about section.about-certification .wrap .title { text-align:center; }
.container-about section.about-certification .wrap .title p { font-size:1.4rem; color:#999; }
.container-about section.about-certification .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
.container-about section.about-certification .wrap .title h2 { font-size:5rem; color:#333; }
.container-about section.about-certification .wrap .infoWrap { display:flex; align-items:center; }
.container-about section.about-certification .wrap .infoWrap.block { display:block !important; }
.container-about section.about-certification .wrap .infoWrap ul.list { margin:8rem 0 0; display:flex; flex-wrap:wrap; justify-content:center; }
.container-about section.about-certification .wrap .infoWrap ul.list li { margin:0 1rem; }
.container-about section.about-certification .wrap .infoWrap ul.list li p { font-weight:500; font-size:1.8rem; color:#333; text-align:center; }

/* 고객의 신뢰 */
.container-about section.about-career { background: linear-gradient(to top, rgba(76, 145, 192, .3), rgba(182, 238, 177, .3)); }
.container-about section.about-career .wrap { max-width:144rem; margin:0 auto; padding:8rem 0 12rem; }
.container-about section.about-career .wrap .title { text-align:center; }
.container-about section.about-career .wrap .title p { font-size:1.4rem; color:#999; }
.container-about section.about-career .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
.container-about section.about-career .wrap .title h2 { font-size:5rem; color:#333; }
.container-about section.about-career .wrap .title p.description { margin:1rem 0 0; font-size:1.8rem; color:#666; }
.container-about section.about-career .wrap .infoWrap { display:flex; align-items:center; }
.container-about section.about-career .wrap .infoWrap.block { display:block !important; }
.container-about section.about-career .wrap .infoWrap ul.list { margin:8rem 0 0; display:flex; flex-wrap:wrap; }
.container-about section.about-career .wrap .infoWrap ul.list li { width:24rem; height:8rem; margin:0 2.5rem 2.5rem; border-radius:1rem; overflow:hidden; }
.container-about section.about-career .wrap .infoWrap ul.list li:nth-child(5n + 1) { margin-left:0; }
.container-about section.about-career .wrap .infoWrap ul.list li:nth-child(5n) { margin-right:0; }

/* 팀원 */
.container-about section.about-people { }
.container-about section.about-people .wrap { max-width:144rem; margin:0 auto; padding:8rem 0 12rem; }
.container-about section.about-people .wrap .title { text-align:center; }
.container-about section.about-people .wrap .title p { font-size:1.4rem; color:#999; }
.container-about section.about-people .wrap .title span.line { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
.container-about section.about-people .wrap .title h2 { font-size:5rem; color:#333; }
.container-about section.about-people .wrap .title p.description { margin:1rem 0 0; font-size:1.8rem; color:#666; }
.container-about section.about-people .wrap .infoWrap { display:flex; align-items:center; }
.container-about section.about-people .wrap .infoWrap.block { display:block !important; }
.container-about section.about-people .wrap .infoWrap ul.list { margin:5rem 0 0; display:flex; flex-wrap:wrap; }
.container-about section.about-people .wrap .infoWrap ul.list li { position:relative; width:34rem; height:24rem; border:1px solid #ccc; margin:0 1.3rem 3rem; border-radius:1rem; overflow:hidden; padding:0 0 2rem 2rem; }
.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(4n + 1) { margin-left:0; }
.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(4n) { margin-right:0; }

.container-about section.about-people .wrap .infoWrap ul.list li .txt { position:absolute; left:2rem; bottom:2rem; }
.container-about section.about-people .wrap .infoWrap ul.list li .txt h3 { font-size:2.4rem; font-weight:700; color:#1168B5; }
.container-about section.about-people .wrap .infoWrap ul.list li .txt p.description { border-radius:0.5rem;  margin:0.5rem 0 0; background:rgba(255, 255, 255, .6); font-size:1.6rem; color:#333; }

.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(1) { background:url('../../assets/images/ico-people-1.png') 90% 100% no-repeat; }
.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(2) { background:url('../../assets/images/ico-people-2.png') 90% 100% no-repeat; }
.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(3) { background:url('../../assets/images/ico-people-3.png') 90% 100% no-repeat; }
.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(4) { background:url('../../assets/images/ico-people-4.png') 90% 100% no-repeat; }
.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(5) { background:url('../../assets/images/ico-people-5.png') 90% 100% no-repeat; }
.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(6) { background:url('../../assets/images/ico-people-6.png') 90% 100% no-repeat; }
.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(7) { background:url('../../assets/images/ico-people-7.png') 90% 100% no-repeat; }


@media all and (max-width:1023px) {

	/* 회사소개 */
	.container-about { min-height:50rem; }
	.container-about section.about-company { }
	.container-about section.about-company .wrap { max-width:144rem; margin:0 auto; padding:4rem 2rem 5rem; }
	.container-about section.about-company .wrap .title { text-align:center; }
	.container-about section.about-company .wrap .title p { font-size:1.4rem; color:#999; }
	.container-about section.about-company .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
	.container-about section.about-company .wrap .title h2 { font-size:3rem; color:#333; }
	.container-about section.about-company .wrap .Slogan { margin:4rem 0 0; display:block; align-items:center; justify-content:center; text-align:center; padding:0 0 5rem; border-bottom:1px dashed #DEDEDE; }
	.container-about section.about-company .wrap .Slogan p { text-align:center; }
	.container-about section.about-company .wrap .Slogan p:nth-child(1) { font-size:4rem; color:#1168B5; font-weight:900; }
	.container-about section.about-company .wrap .Slogan p:nth-child(3) { font-size:4rem; color:#0DA3DE; font-weight:900; }
	.container-about section.about-company .wrap .Slogan p:nth-child(5) { font-size:4rem; color:#059B65; font-weight:900; }
	.container-about section.about-company .wrap .Slogan p:nth-child(2),
	.container-about section.about-company .wrap .Slogan p:nth-child(4) { flex:1; font-size:3rem; color:#DEDEDE; }
	.container-about section.about-company .wrap .infoWrap { display:block; align-items:center;  margin:4rem 0 0; }
	.container-about section.about-company .wrap .infoWrap .logo { padding-left:0; text-align:center; }
	.container-about section.about-company .wrap .infoWrap .txt { width:100%; margin-left:0; margin:3rem 0 0; }
	.container-about section.about-company .wrap .infoWrap .txt .big { text-align:left; font-size:3.5rem; color:#333; font-weight:700; margin:0 0 2rem; }
	.container-about section.about-company .wrap .infoWrap .txt ul.info li { font-size:1.7rem; }


	/* 인사말 */
	.container-about section.about-ceo { background:#111; }
	.container-about section.about-ceo .wrap { max-width:144rem; margin:0 auto; padding:4rem 2rem 5rem; }
	.container-about section.about-ceo .wrap .title { text-align:center; }
	.container-about section.about-ceo .wrap .title p { font-size:1.4rem; color:#999; }
	.container-about section.about-ceo .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
	.container-about section.about-ceo .wrap .title h2 { font-size:3rem; color:#fff; }
	.container-about section.about-ceo .wrap .infoWrap { display:block; align-items:center; margin:3rem 0 0;  }
	.container-about section.about-ceo .wrap .infoWrap .txt { flex:1; }
	.container-about section.about-ceo .wrap .infoWrap .txt p { font-size:1.8rem; color:#ccc; }
	.container-about section.about-ceo .wrap .infoWrap .txt p span { color:#64A6BD; }
	.container-about section.about-ceo .wrap .infoWrap .txt p.name { margin:3rem 0 0; font-size:1.6rem; color:#ccc; }
	.container-about section.about-ceo .wrap .infoWrap .txt p.name strong { font-size:4rem; color:#fff; font-weight:500; }
	.container-about section.about-ceo .wrap .infoWrap .img { margin-left:0; margin:4rem auto 0; width:100%; height:32rem; background:url('../../assets/images/about-con-1.png') 50% 50% no-repeat; background-size:cover; }


	/* 연혁 */
	.container-about section.about-history { }
	.container-about section.about-history .wrap { max-width:144rem; margin:0 auto; padding:4rem 2rem 5rem; }
	.container-about section.about-history .wrap .title { text-align:center; }
	.container-about section.about-history .wrap .title p { font-size:1.4rem; color:#999; }
	.container-about section.about-history .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
	.container-about section.about-history .wrap .title h2 { font-size:3rem; color:#333; }
	.container-about section.about-history .wrap .infoWrap { display:flex; align-items:center; }
	.container-about section.about-history .wrap .infoWrap.block { margin:3rem 0 0; display:block !important; }
	.container-about section.about-history .wrap .infoWrap ul.tab-history {  display:flex; align-items:center; justify-content:center; }
	.container-about section.about-history .wrap .infoWrap ul.tab-history li { transition:all 0.2s ease-out; margin:0 0.6rem; cursor:pointer; width:18rem; height:4.5rem; display:flex; align-items:center; justify-content:center; }
	.container-about section.about-history .wrap .infoWrap ul.tab-history li { border:1px solid #ccc; border-radius:1rem; font-size:1.8rem; color:#999; }
	.container-about section.about-history .wrap .infoWrap ul.tab-history li.active {background:#1168B5; color:#fff; }
	.container-about section.about-history .wrap .infoWrap .tab-history-content { display:none; margin:0; }
	.container-about section.about-history .wrap .infoWrap .tab-history-content.active { display:block; }

	.container-about section.about-history .wrap .infoWrap .tab-history-content .year { width:100%; text-align:center; line-height:150%; font-size:10rem; font-weight:700; color:#F5F5F5; }
	.container-about section.about-history .wrap .infoWrap .tab-history-content ul.list { width:100%; }

	.container-about section.about-history .wrap .infoWrap .tab-history-content ul.list li { position:relative; padding:0 0 2rem 3rem; font-size:1.8rem; color:#333; background:url('../../assets/images/line-list.png') 0 0 repeat-y; }
	.container-about section.about-history .wrap .infoWrap .tab-history-content ul.list li:last-child { padding-bottom:0; }
	.container-about section.about-history .wrap .infoWrap .tab-history-content ul.list li:before { content:""; width:1.6rem; height:1.6rem; position:absolute; top:0.6rem; left:-0.8rem; z-index:9; background:url('../../assets/images/ico-dot.png') 0 0 repeat-y; }


	/* 인증/기술력 */
	.container-about section.about-certification { }
	.container-about section.about-certification .wrap { max-width:144rem; margin:0 auto; padding:4rem 2rem 5rem; }
	.container-about section.about-certification .wrap .title { text-align:center; }
	.container-about section.about-certification .wrap .title p { font-size:1.4rem; color:#999; }
	.container-about section.about-certification .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
	.container-about section.about-certification .wrap .title h2 { font-size:3rem; color:#333; }
	.container-about section.about-certification .wrap .infoWrap { display:block; align-items:center; text-align:center; }
	.container-about section.about-certification .wrap .infoWrap.block { display:block !important; }
	.container-about section.about-certification .wrap .infoWrap ul.list { margin:4rem 0 0; display:flex; flex-wrap:wrap; justify-content:center; }
	.container-about section.about-certification .wrap .infoWrap ul.list li { width:50%; margin:0; }
	.container-about section.about-certification .wrap .infoWrap ul.list li p { font-weight:500; font-size:1.7rem; color:#333; text-align:center; }

	/* 고객의 신뢰 */
	.container-about section.about-career { background: linear-gradient(to top, rgba(76, 145, 192, .3), rgba(182, 238, 177, .3)); }
	.container-about section.about-career .wrap { max-width:144rem; margin:0 auto; padding:4rem 2rem 5rem; }
	.container-about section.about-career .wrap .title { text-align:center; }
	.container-about section.about-career .wrap .title p { font-size:1.4rem; color:#999; }
	.container-about section.about-career .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
	.container-about section.about-career .wrap .title h2 { font-size:3rem; color:#333; }
	.container-about section.about-career .wrap .title p.description { margin:1rem 0 0; font-size:1.6rem; color:#666; }
	.container-about section.about-career .wrap .infoWrap { display:flex; align-items:center; }
	.container-about section.about-career .wrap .infoWrap.block { display:block !important; }
	.container-about section.about-career .wrap .infoWrap ul.list { margin:4rem 0 0; display:flex; flex-wrap:wrap; }
	.container-about section.about-career .wrap .infoWrap ul.list li { width:50%; padding:0 0.5rem; height:auto; margin:0 0 1rem; border-radius:1rem; overflow:hidden; }
	.container-about section.about-career .wrap .infoWrap ul.list li:nth-child(5n + 1) { margin-left:auto; }
	.container-about section.about-career .wrap .infoWrap ul.list li:nth-child(5n) { margin-right:auto; }

	/* 팀원 */
	.container-about section.about-people { }
	.container-about section.about-people .wrap { max-width:144rem; margin:0 auto; padding:4rem 2rem 5rem; }
	.container-about section.about-people .wrap .title { text-align:center; }
	.container-about section.about-people .wrap .title p { font-size:1.4rem; color:#999; }
	.container-about section.about-people .wrap .title span.line { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
	.container-about section.about-people .wrap .title h2 { font-size:5rem; color:#333; }
	.container-about section.about-people .wrap .title p.description { margin:1rem 0 0; font-size:1.8rem; color:#666; }
	.container-about section.about-people .wrap .infoWrap { display:flex; align-items:center; }
	.container-about section.about-people .wrap .infoWrap.block { display:block !important; }
	.container-about section.about-people .wrap .infoWrap ul.list { margin:3rem 0 0; display:block; flex-wrap:wrap; }
	.container-about section.about-people .wrap .infoWrap ul.list li { position:relative; width:100%; height:23rem; border:1px solid #ccc; margin:0 0 1rem; border-radius:1rem; overflow:hidden; padding:0 0 2rem 2rem; }
	.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(4n + 1) { margin-left:0; }
	.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(4n) { margin-right:0; }

	.container-about section.about-people .wrap .infoWrap ul.list li .txt { position:absolute; left:2rem; bottom:2rem; }
	.container-about section.about-people .wrap .infoWrap ul.list li .txt h3 { font-size:2.4rem; font-weight:700; color:#1168B5; }
	.container-about section.about-people .wrap .infoWrap ul.list li .txt p.description { border-radius:0.5rem; margin:0.5rem 0 0; background:rgba(255, 255, 255, .6); font-size:1.6rem; color:#333; }

	.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(1) { background:url('../../assets/images/ico-people-1.png') 90% 100% no-repeat; }
	.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(2) { background:url('../../assets/images/ico-people-2.png') 90% 100% no-repeat; }
	.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(3) { background:url('../../assets/images/ico-people-3.png') 90% 100% no-repeat; }
	.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(4) { background:url('../../assets/images/ico-people-4.png') 90% 100% no-repeat; }
	.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(5) { background:url('../../assets/images/ico-people-5.png') 90% 100% no-repeat; }
	.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(6) { background:url('../../assets/images/ico-people-6.png') 90% 100% no-repeat; }
	.container-about section.about-people .wrap .infoWrap ul.list li:nth-child(7) { background:url('../../assets/images/ico-people-7.png') 90% 100% no-repeat; }



}



/*** works ***/

/* 프로젝트 목록 */
.container-Works { min-height:50rem; overflow:hidden; }
.container-Works section.OurWorks { }
.container-Works section.OurWorks .wrap { max-width:144rem; margin:0 auto; padding:8rem 0 12rem; }
.container-Works section.OurWorks .swiperWrap { overflow:hidden; margin:0 0 8rem; }
.container-Works section.OurWorks .swiperWrap .title { text-align:center; }
.container-Works section.OurWorks .swiperWrap .title p { font-size:1.4rem; color:#999; }
.container-Works section.OurWorks .swiperWrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
.container-Works section.OurWorks .swiperWrap .title h2 { font-size:5rem; color:#333; }
.container-Works section.OurWorks .swiperWrap .WorksSwiper { position:relative;  border-bottom:1px solid #dedede; margin:3.5rem 0 0; padding:0 0 8rem; }
.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-wrapper { }
.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide {  position:relative; }
.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide .thumbnail {  }
.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide .thumbnail img { width:100%; height:auto; }
.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide .txt { margin:3rem 0 0; }
.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide p.subject { font-size:3.2rem; color:#333; font-weight:700; }
.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide p.description {  margin-left:4rem; font-size:1.8rem; color:#666; }
.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide p.description span { color:#1168B5; margin:0 2rem; }
.container-Works section.OurWorks .swiperWrap .WorksSwiper .btnWrap { position:absolute; top:-10rem; right:0; display:flex; align-items:center; }
.container-Works section.OurWorks .swiperWrap .WorksSwiper .WorksSwiper-button-prev { display:flex; align-items:center; }
.container-Works section.OurWorks .swiperWrap .WorksSwiper .WorksSwiper-button-prev i { transition:all 0.2s ease-out; margin-right:1rem; width:5rem; height:5rem; background:url('../../assets/images/prev_btn.png') 50% 50% no-repeat; }

.container-Works section.OurWorks .swiperWrap .WorksSwiper .WorksSwiper-button-next { display:flex; align-items:center;  }
.container-Works section.OurWorks .swiperWrap .WorksSwiper .WorksSwiper-button-next i { transition:all 0.2s ease-out; margin-left:1rem; width:5rem; height:5rem; background:url('../../assets/images/next_btn.png') 50% 50% no-repeat; }

.container-Works section.OurWorks ul.tab-OurWorks { display:flex; align-items:center; }
.container-Works section.OurWorks ul.tab-OurWorks li { font-size:2rem; color:#666; transition:all 0.2s ease-out; margin-right:1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; width:26rem; height:5rem; border:1px solid #ccc; border-radius:1rem; }
.container-Works section.OurWorks ul.tab-OurWorks li.active { background:#1168B5; color:#fff; font-weight:500; }
.container-Works section.OurWorks ul.tab-OurWorks li:last-child { margin:0; }

.container-Works section.OurWorks .tab-OurWorks-content { display:none; margin:5rem 0 0; }
.container-Works section.OurWorks .tab-OurWorks-content.active { display:block; }
.container-Works section.OurWorks .tab-OurWorks-content .btnWrap { text-align:center; margin:3rem auto 0; }
.container-Works section.OurWorks .tab-OurWorks-content .btnWrap button.btn-more { transition:all 0.2s ease-out; font-size:1.6rem; color:#333; font-weight:700; text-decoration:underline; text-underline-position: under; }
.container-Works section.OurWorks .tab-OurWorks-content .btnWrap button.btn-more:hover { color:#1168B5; }

.container-Works section.OurWorks ul.data-list { display:flex; flex-wrap:wrap; }
.container-Works section.OurWorks ul.data-list li { position:relative; width:46rem; height:48rem; margin:0 3rem 5rem 0; }

.container-Works section.OurWorks ul.data-list li a.dim { opacity:0; transition:all 0.2s ease-out; display:flex; align-items:center; justify-content:center; position:absolute; bottom:0; left:0; width:100%; height:0; background: linear-gradient(to right, #6BC174, #26598B); }
.container-Works section.OurWorks ul.data-list li a.dim { padding:1rem 2rem; font-size:1.6rem; color:#fff; font-weight:700; }

.container-Works section.OurWorks ul.data-list li:nth-child(3n) { margin-right:0; }
.container-Works section.OurWorks ul.data-list li .thumbnail { position:relative; overflow:hidden; }
.container-Works section.OurWorks ul.data-list li .thumbnail img { width:100%; height:100%; object-fit:cover; }

.container-Works section.OurWorks ul.data-list li .thumbnail:hover .dim { opacity:0.8; height:100%; }

.container-Works section.OurWorks ul.data-list li .info { padding:2rem 1rem; }
.container-Works section.OurWorks ul.data-list li .info .subject { flex:1; font-size:2rem; font-weight:700; color:#333; margin-right:2rem; }
.container-Works section.OurWorks ul.data-list li .info .tag { margin:1rem 0 0;  }
.container-Works section.OurWorks ul.data-list li .info .tag a { margin-right:1rem; font-size:1.4rem; color:#64A6BD; font-weight:400; }
.container-Works section.OurWorks ul.data-list li .info .tag a:last-child { margin:0; }


@media all and (max-width:1023px) {

	/* 프로젝트 목록 */
	.container-Works { min-height:50rem; overflow:hidden; }
	.container-Works section.OurWorks { }
	.container-Works section.OurWorks .wrap { max-width:144rem; margin:0 auto; padding:4rem 2rem; }
	.container-Works section.OurWorks .swiperWrap { overflow:hidden; margin:0 0 4rem;  }
	.container-Works section.OurWorks .swiperWrap .title { text-align:center; }
	.container-Works section.OurWorks .swiperWrap .title p { font-size:1.4rem; color:#999; }
	.container-Works section.OurWorks .swiperWrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
	.container-Works section.OurWorks .swiperWrap .title h2 { font-size:3rem; color:#333; }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper { position:relative;  border-bottom:1px solid #dedede; margin:3.5rem 0 0; padding:0 0 4rem; }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-wrapper { }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide { position:relative; }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide .thumbnail { }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide .txt { margin:2rem 0 0; display:block !important;  }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide .txt a { display:inline-block; margin:2rem 0 0; }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide p.subject { font-size:2.4rem; color:#333; font-weight:700; }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide p.description { margin-left:0; margin:1rem 0; font-size:1.6rem; color:#666; }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper .swiper-slide p.description span { color:#1168B5; margin:0 2rem; }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper .btnWrap { position:absolute; top:-8rem; right:0; display:flex; align-items:center; }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper .WorksSwiper-button-prev { display:flex; align-items:center; }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper .WorksSwiper-button-prev i { transition:all 0.2s ease-out; margin-right:1rem; width:5rem; height:5rem; background:url('../../assets/images/prev_btn.png') 50% 50% no-repeat; }

	.container-Works section.OurWorks .swiperWrap .WorksSwiper .WorksSwiper-button-next { display:flex; align-items:center;  }
	.container-Works section.OurWorks .swiperWrap .WorksSwiper .WorksSwiper-button-next i { transition:all 0.2s ease-out; margin-left:1rem; width:5rem; height:5rem; background:url('../../assets/images/next_btn.png') 50% 50% no-repeat; }

	.container-Works section.OurWorks ul.tab-OurWorks { display:flex; align-items:center; }
	.container-Works section.OurWorks ul.tab-OurWorks li { font-size:2rem; color:#666; transition:all 0.2s ease-out; margin-right:1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; width:26rem; height:5rem; border:1px solid #ccc; border-radius:1rem; }
	.container-Works section.OurWorks ul.tab-OurWorks li.active { background:#1168B5; color:#fff; font-weight:500; }
	.container-Works section.OurWorks ul.tab-OurWorks li:last-child { margin:0; }

	.container-Works section.OurWorks .tab-OurWorks-content { display:none; margin:3rem 0 0; }
	.container-Works section.OurWorks .tab-OurWorks-content.active { display:block; }
	.container-Works section.OurWorks .tab-OurWorks-content .btnWrap { text-align:center; margin:3rem auto 0; }
	.container-Works section.OurWorks .tab-OurWorks-content .btnWrap button.btn-more { transition:all 0.2s ease-out; font-size:1.6rem; color:#333; font-weight:700; text-decoration:underline; text-underline-position: under; }
	.container-Works section.OurWorks .tab-OurWorks-content .btnWrap button.btn-more:hover { color:#1168B5; }

	.container-Works section.OurWorks ul.data-list { display:block; flex-wrap:wrap; }
	.container-Works section.OurWorks ul.data-list li { position:relative; width:100%; height:auto; margin:0 0 2.5rem; }

	.container-Works section.OurWorks ul.data-list li a.dim { opacity:0; transition:all 0.2s ease-out; display:flex; align-items:center; justify-content:center; position:absolute; bottom:0; left:0; width:100%; height:0; background: linear-gradient(to right, #6BC174, #26598B); }
	.container-Works section.OurWorks ul.data-list li a.dim { padding:1rem 2rem; font-size:1.6rem; color:#fff; font-weight:700; }

	.container-Works section.OurWorks ul.data-list li:nth-child(3n) { margin-right:0; }
	.container-Works section.OurWorks ul.data-list li .thumbnail { position:relative;  overflow:hidden; }
	.container-Works section.OurWorks ul.data-list li .thumbnail img { width:100%; height:100%; object-fit:cover; }

	.container-Works section.OurWorks ul.data-list li .thumbnail:hover .dim { opacity:0.8; height:100%; }

	.container-Works section.OurWorks ul.data-list li .info { padding:2rem 1rem; }
	.container-Works section.OurWorks ul.data-list li .info .subject { flex:1; font-size:2rem; font-weight:700; color:#333; margin-right:2rem; }
	.container-Works section.OurWorks ul.data-list li .info .tag { margin:1rem 0 0; }
	.container-Works section.OurWorks ul.data-list li .info .tag a { margin-right:1rem; font-size:1.4rem; color:#64A6BD; font-weight:400; }
	.container-Works section.OurWorks ul.data-list li .info .tag a:last-child { margin:0; }


}





.type-no { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#CBCBCB; }
.type-lightgreen { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#149AAF; }
.type-yellow { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#B0901C; }
.type-lightyellow { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#DBD54C; }
.type-orange { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#E65C69; }
.type-blue { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#4A75EC; }
.type-purple { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#A250FF; }
.type-mint { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#46D5AF; }
.type-sky { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#3DAEF8; }
.type-black { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#231F45; }
.type-navi { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#2C416B; }
.type-darkblue { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#0061b2; }
.type-red { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#ed1b24; }
.type-lightbrown { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#86796E; }
.type-darkbrown { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#4D453A; }
.type-orange { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#FC6000; }
.type-green { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#6FAD00; }
.type-darkgreen { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#12A0A5; }
.type-lightpink { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#FFADAB; }
.type-violet { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#7065A8; }
.type-lightviolet { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#BBC6E6; }
.type-lightorange { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#FF9D11; }
.type-gray { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#666; }
.type-darkgray { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#444; }
.type-lightblue { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#5777AB; }
.type-apricot { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#FE7676; }
.type-lightred { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#F25D75; }
.type-lightgray { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#ececec; }
.type-lightsky { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#2df8fa; }
.type-pink { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#FE5C78; }
.type-darkpink { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#E5257A; }
.type-lightorange { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#EB9B00; }
.type-darksky { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#007DB6; }
.type-mint { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#00AB83; }
.type-darknavi { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#005B82; }
.type-deepblue { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#284EAE; }
.type-deepnavi { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#152787; }
.type-darkred { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#AE2B31; }
.type-lightmint { position:relative; top:0.4rem; display:inline-block; vertical-align:middle; width:1.8rem; height:1.8rem; border-radius:100%; background:#2CD5C4; }


/* 프로젝트 상세 */
.container-Works section.about-project { padding:0 0 12rem }
.container-Works section.about-project .wrap { max-width:144rem; margin:0 auto; padding:8rem 0 4rem; }
.container-Works section.about-project .wrap .title { text-align:center; }
.container-Works section.about-project .wrap .title p { font-size:1.4rem; color:#999; }
.container-Works section.about-project .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
.container-Works section.about-project .wrap .title h2 { font-size:5rem; color:#333; }

.container-Works section.about-project .wrap .infoWrap { margin:3rem auto 0; }
.container-Works section.about-project .wrap .infoWrap div { display:flex; align-items:center; justify-content:center; font-size:1.7rem; color:#666; }
.container-Works section.about-project .wrap .infoWrap div strong { margin-right:1rem; font-size:1.7rem; color:#1168B5; font-weight:700; }
.container-Works section.about-project .wrap .infoWrap div .Bullet { width:0.6rem; height:0.6rem; border-radius:100%; background:#1168B5; margin:0 1.5rem; }
.container-Works section.about-project .wrap .infoWrap div .line { border-right:1px solid #ccc; height:1rem; margin:0 1.5rem; }
.container-Works section.about-project .wrap .infoWrap ul.device { margin:5rem 0 0; display:flex; justify-content:center; }
.container-Works section.about-project .wrap .infoWrap ul.device li { position:relative; text-transform:uppercase; text-align:center;  }
.container-Works section.about-project .wrap .infoWrap ul.device li.bg { margin:0 1rem; width:4.5rem; background:url('../../assets/images/ico-device-line.png') 50% 1.5rem no-repeat; }
.container-Works section.about-project .wrap .infoWrap ul.device li.pc div { margin:0 auto; width:3.4rem; height:3.4rem; background:url('../../assets/images/ico-pc.png') 50% 50% no-repeat; }
.container-Works section.about-project .wrap .infoWrap ul.device li.mobile div { margin:0 auto; width:3.4rem; height:3.4rem; background:url('../../assets/images/ico-mobile.png') 50% 50% no-repeat; }
.container-Works section.about-project .wrap .infoWrap ul.device li.tab div { margin:0 auto; width:3.4rem; height:3.4rem; background:url('../../assets/images/ico-tab.png') 50% 50% no-repeat; }
.container-Works section.about-project .wrap .infoWrap ul.device li p { margin:1rem 0 0; font-size:1.4rem; color:#666; }
.container-Works section.about-project .wrap .infoWrap .btnWrap { margin:8rem auto 0; text-align:center; display:flex; align-items:center; justify-content:center; gap:2rem; }
.container-Works section.about-project .wrap .infoWrap .btnWrap a { width:20rem; height:6rem; border-radius:3rem; background:#1168B5; display:flex; align-items:center; justify-content:center; font-size:1.8rem; color:#fff; }

.container-Works section.about-project .wrap .infoWrap .btnWrap a.img-link { width:auto; height:auto; border-radius:0; background:none; display:flex; align-items:center; justify-content:center; font-size:1.8rem; color:#fff; }

.container-Works section.about-project .project-thumbnail { }
.container-Works section.about-project .project-thumbnail .s-tit { max-width:144rem; margin:6rem auto; }
.container-Works section.about-project .project-thumbnail .s-tit h3 { font-size:3.2rem; font-weight:700; color:#333;  }

@media all and (max-width:1440px) {
	.container-Works section.about-project .project-thumbnail img { max-width:100%; height:auto; }
}

.container-Works section.about-project .btnList { margin:10rem auto 0; display:flex; align-items:center; justify-content:center; }
.container-Works section.about-project .btnList a { display:flex; align-items:center; justify-content:center; font-size:1.8rem; width:20rem; height:6rem; border-radius:3rem; border:1px solid #333; }
.container-Works section.about-project .btnList a span { margin-right:1rem; width:1.6rem; height:1.2rem; background:url('../../assets/images/ico-list.png') 50% 50% no-repeat;  } 



@media all and (max-width:1023px) {

	/* 프로젝트 상세 */
	.container-Works section.about-project { padding:0 0 8rem }
	.container-Works section.about-project .wrap { max-width:144rem; margin:0 auto; padding:4rem 2rem; }
	.container-Works section.about-project .wrap .title { text-align:center; }
	.container-Works section.about-project .wrap .title p { font-size:1.4rem; color:#999; }
	.container-Works section.about-project .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
	.container-Works section.about-project .wrap .title h2 { font-size:3rem; color:#333; }

	.container-Works section.about-project .wrap .infoWrap { margin:3rem auto 0; }
	.container-Works section.about-project .wrap .infoWrap div { text-align:center; display:block; align-items:center; justify-content:center; font-size:1.6rem; color:#666; }
	.container-Works section.about-project .wrap .infoWrap div strong { margin-right:0; margin:0 auto 0.5rem; display:block; font-size:1.7rem; color:#1168B5; font-weight:700; }
	.container-Works section.about-project .wrap .infoWrap div .Bullet { display:block; width:0.6rem; height:0.6rem; border-radius:100%; background:#1168B5; margin:1rem auto; }
	.container-Works section.about-project .wrap .infoWrap div .line { display:block; border-right:0; height:auto; margin:0; }
	.container-Works section.about-project .wrap .infoWrap ul.device { margin:5rem 0 0; display:flex; justify-content:center; }
	.container-Works section.about-project .wrap .infoWrap ul.device li { position:relative; text-transform:uppercase; text-align:center;  }
	.container-Works section.about-project .wrap .infoWrap ul.device li.bg { margin:0 1rem; width:4.5rem; background:url('../../assets/images/ico-device-line.png') 50% 1.5rem no-repeat; }
	.container-Works section.about-project .wrap .infoWrap ul.device li.pc div { margin:0 auto; width:3.4rem; height:3.4rem; background:url('../../assets/images/ico-pc.png') 50% 50% no-repeat; }
	.container-Works section.about-project .wrap .infoWrap ul.device li.mobile div { margin:0 auto; width:3.4rem; height:3.4rem; background:url('../../assets/images/ico-mobile.png') 50% 50% no-repeat; }
	.container-Works section.about-project .wrap .infoWrap ul.device li.tab div { margin:0 auto; width:3.4rem; height:3.4rem; background:url('../../assets/images/ico-tab.png') 50% 50% no-repeat; }
	.container-Works section.about-project .wrap .infoWrap ul.device li p { margin:1rem 0 0; font-size:1.4rem; color:#666; }
	.container-Works section.about-project .wrap .infoWrap .btnWrap { margin:8rem auto 0; text-align:center; display:block; align-items:center; justify-content:center; gap:2rem; }
	.container-Works section.about-project .wrap .infoWrap .btnWrap a { width:20rem; height:6rem; margin:0 auto; border-radius:3rem; background:#1168B5; display:flex; align-items:center; justify-content:center; font-size:1.8rem; color:#fff; }

	.container-Works section.about-project .wrap .infoWrap .btnWrap a.img-link { width:auto; height:auto; border-radius:0; background:none; display:flex; align-items:center; justify-content:center; font-size:1.8rem; color:#fff; }

	.container-Works section.about-project .wrap .infoWrap .btnWrap a.img-link:last-child { margin:1.2rem 0 0; }

	.container-Works section.about-project .project-thumbnail { }
	.container-Works section.about-project .project-thumbnail .s-tit { max-width:144rem; margin:6rem auto; padding:0 2rem; }
	.container-Works section.about-project .project-thumbnail .s-tit h3 { font-size:2.4rem; font-weight:700; color:#333;  }
	.container-Works section.about-project .project-thumbnail img { width:100%; height:auto; }

	.container-Works section.about-project .btnList { margin:10rem auto 0; display:flex; align-items:center; justify-content:center; }
	.container-Works section.about-project .btnList a { display:flex; align-items:center; justify-content:center; font-size:1.8rem; width:20rem; height:6rem; border-radius:3rem; border:1px solid #333; }
	.container-Works section.about-project .btnList a span { margin-right:1rem; width:1.6rem; height:1.2rem; background:url('../../assets/images/ico-list.png') 50% 50% no-repeat;  } 



}




/*** contact ***/
.container-Contact { min-height:50rem; overflow:hidden; }
.container-Contact section.Contact { }
.container-Contact section.Contact .wrap { max-width:144rem; margin:0 auto; padding:8rem 0 12rem; }
.container-Contact section.Contact .wrap .title { text-align:center; }
.container-Contact section.Contact .wrap .title p { font-size:1.4rem; color:#999; }
.container-Contact section.Contact .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
.container-Contact section.Contact .wrap .title h2 { font-size:5rem; color:#333; }
.container-Contact section.Contact .wrap .info { position:relative; margin:9rem 0 0; display:flex; }
.container-Contact section.Contact .wrap .info .tel { border-right:2px solid #F5F5F5; padding-right:5rem; margin-right:5rem; }
.container-Contact section.Contact .wrap .info .tel .subject { font-size:1.8rem; font-weight:700; color:#1168B5; padding-left:3rem; background:url('../../assets/images/ico-tel.png') 0 50% no-repeat; }
.container-Contact section.Contact .wrap .info .email .subject { font-size:1.8rem; font-weight:700; color:#1168B5; padding-left:3rem; background:url('../../assets/images/ico-email.png') 0 50% no-repeat; }
.container-Contact section.Contact .wrap .info .txt { margin:1rem 0 0; font-size:2.4rem; color:#333; }
.container-Contact section.Contact .wrap .info .addrWrap { position:absolute; z-index:9; top:0; right:0; padding:3rem 5rem; width:68rem; height:18rem; background:rgba(17, 104, 181, .9); }
.container-Contact section.Contact .wrap .info .addrWrap { border-radius:5rem 0 5rem 0; }
.container-Contact section.Contact .wrap .info .addrWrap .addr-kor { margin:2rem 0 0; font-size:2rem; color:#fff; }
.container-Contact section.Contact .wrap .info .addrWrap .addr-eng { font-size:1.6rem; color:#DEDEDE; }
.container-Contact section.Contact .wrap .google-map { margin:4.5rem 0 0; }
.container-Contact section.Contact .wrap .google-map iframe { width:100%; height:57rem; }


@media all and (max-width:1023px) {
	
	/*** contact ***/
	.container-Contact { min-height:50rem; overflow:hidden; }
	.container-Contact section.Contact { }
	.container-Contact section.Contact .wrap { max-width:144rem; margin:0 auto; padding:4rem 0 0; }
	.container-Contact section.Contact .wrap .title { text-align:center; }
	.container-Contact section.Contact .wrap .title p { font-size:1.4rem; color:#999; }
	.container-Contact section.Contact .wrap .title span { display:block; margin:2rem auto 1rem; width:1px; height:3rem; background:#999; }
	.container-Contact section.Contact .wrap .title h2 { font-size:3rem; color:#333; }
	.container-Contact section.Contact .wrap .info { position:relative; margin:4rem 0 0; display:block; padding:0 2rem; }
	.container-Contact section.Contact .wrap .info .tel { border-right:0; border-bottom:2px solid #F5F5F5; padding-right:0; margin-right:0; padding:0 0 2rem; margin:0 0 2rem; }
	.container-Contact section.Contact .wrap .info .tel .subject { font-size:1.8rem; font-weight:700; color:#1168B5; padding-left:3rem; background:url('../../assets/images/ico-tel.png') 0 50% no-repeat; }
	.container-Contact section.Contact .wrap .info .email .subject { font-size:1.8rem; font-weight:700; color:#1168B5; padding-left:3rem; background:url('../../assets/images/ico-email.png') 0 50% no-repeat; }
	.container-Contact section.Contact .wrap .info .txt { margin:1rem 0 0; font-size:2.4rem; color:#333; }
	.container-Contact section.Contact .wrap .info .addrWrap { position:relative; z-index:9; top:0; right:0; margin:5rem 0 0; padding:3rem; width:auto; height:auto; background:rgba(17, 104, 181, .9); }
	.container-Contact section.Contact .wrap .info .addrWrap { border-radius:5rem 0 5rem 0; }
	.container-Contact section.Contact .wrap .info .addrWrap .addr-kor { margin:2rem 0 0; font-size:2.2rem; color:#fff; }
	.container-Contact section.Contact .wrap .info .addrWrap .addr-eng { margin:1rem 0 0; font-size:1.6rem; color:#DEDEDE; }
	.container-Contact section.Contact .wrap .google-map { position:relative; top:0; margin:0; }
	.container-Contact section.Contact .wrap .google-map iframe { width:100%; height:57rem; }

}