@charset "utf-8";

.about-vis {position:relative; height:800px; overflow:hidden; display:flex; align-items:center; color:#fff; justify-content:center; text-align:center;}
.about-vis .contain {z-index:1; max-width:1430px}
.about-vis .tit {font-size:120px; line-height:1em; font-weight:500; letter-spacing:-.025em; font-style:italic; margin-bottom:30px;}
.about-vis .cnt {font-size:50px; line-height:1.4em; letter-spacing:-.025em; margin-bottom:30px;}
.about-vis .background {
	position:absolute; 
	top:0; 
	left:0;
	width:100%; height:100%;	
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-size:cover;
	background-image:url('../images/content/about_vis.jpg');
	transform:scale(1.09);
    -ms-transform:scale(1.09); /* IE 9 */
    -moz-transform:scale(1.09); /* Firefox */
    -webkit-transform:scale(1.09); /* Safari and Chrome */
    -o-transform:scale(1.09); /* Opera */
	transition: all 2s ease-out 0s;
	transition-delay: 0.1s;
	z-index:0;
}
.about-vis.load .background {
	transform:scale(1);
    -ms-transform:scale(1); /* IE 9 */
    -moz-transform:scale(1); /* Firefox */
    -webkit-transform:scale(1); /* Safari and Chrome */
    -o-transform:scale(1); /* Opera */
}
.about-vis.contact .background {background-image:url('../images/content/contact_vis.jpg');}

.about-sec1 .content {position:relative; padding:130px 0 55px; text-align:center;}
.about-sec1 .content:after {content:"";position:absolute; top:0;left:0; width:344px; height:385px; background:url('../images/content/about_bg1.jpg') 0 0 no-repeat; background-size:contain; z-index:-1;}
.about-sec1 .content:before {content:"";position:absolute; bottom:0;right:0; width:336px; height:365px; background:url('../images/content/about_bg2.jpg') 0 0 no-repeat; background-size:contain; z-index:-1;}
.about-sec1 .content .des {font-size:30px; line-height:2em; margin-bottom:10px;}
.about-sec1 .content .des .fs50 {font-size:50px;font-weight:400;}
.about-sec1 .content .tit {font-size:50px; line-height:1.4em; margin-bottom:10px; letter-spacing:-.05em;}
.about-sec1 .content .cnt {font-size:20px; line-height:1.5em; letter-spacing:-.025em;}
.about-sec1 .img-type {margin-bottom:1px; overflow:hidden;}
.about-sec1 .img-type ul {display:flex; margin-left:-1px;}
.about-sec1 .img-type ul li {flex:1; padding-left:1px;}
.about-sec1 .img-type ul li .photo {position:relative; color:#fff;}
.about-sec1 .img-type ul li .pic {position:relative; padding-bottom:100%; overflow:hidden;}
.about-sec1 .img-type ul li .pic img {position:absolute; top:0; left:0; width:100%; height:100%;}
.about-sec1 .img-type ul li .text-box {position:absolute; bottom:40px; left:0; width:100%; text-align:center;}
.about-sec1 .img-type ul li .tt {font-size:24px; line-height:1.3em; font-weight:700; margin-bottom:5px;}
.about-sec1 .img-type ul li .tit {font-size:40px; line-height:1.4em; letter-spacing:-.075em; margin-bottom:10px;}
.about-sec1 .img-type ul li .cnt {font-size:20px; line-height:1.5em; letter-spacing:-.025em; font-family:'Noto Sans KR',sans-serif;}
.about-sec1 .img-type2 {height:800px; display:flex; padding-top:200px; color:#fff; justify-content:center; background:url('../images/content/about_img4.jpg') 50% 50% no-repeat; background-size:cover;}
.about-sec1 .img-type2 .tit {font-size:120px; line-height:1em; font-family:TimesNewRoman,'Times New Roma','Times',sans-serif; font-style:italic; font-weight:700; margin-bottom:20px; margin-left:350px;  letter-spacing:-.050em;}
.about-sec1 .img-type2 .text {padding-left:500px;}
.about-sec1 .img-type2 .text .tt {font-size:50px; line-height:1.4em; font-style:italic; margin-bottom:10px; letter-spacing:-.050em;}
.about-sec1 .img-type2 .text .cnt {font-size:20px; line-height:1.5em; letter-spacing:-.025em;}
 
.about-sec2 {position:relative; padding-top:125px; margin-bottom:100px; text-align:center;}
.about-sec2:after {content:"";position:absolute; top:0;right:0; width:453px; height:444px; background:url('../images/content/about_bg3.jpg') 0 0 no-repeat; background-size:contain; z-index:-1;}
.about-sec2 .title {font-size:50px; line-height:1.2em; margin-bottom:25px;}
.about-sec2 ul {display:flex; margin-left:-40px;}
.about-sec2 ul li {width:calc(25% - 40px); margin-left:40px; height:300px; padding:76px 15px; background:#f8f8f8; border-radius:40px;}
.about-sec2 ul li .tt {font-size:20px; line-height:1.4em; color:#999; font-weight:700; margin-bottom:10px; font-family:'Noto Sans KR',sans-serif;}
.about-sec2 ul li .number {font-size:80px; line-height:0.750em; color:#d23246;font-weight:700;}

.content-title {margin-bottom:30px;}
.content-title h2 {font-size:80px; line-height:1.3em; font-weight:900;}
.content-title .txt {font-size:20px; line-height:1.4em; padding-top:10px;}

.about-history {position:relative; margin-bottom:180px; overflow:hidden;}
.about-history:after {content:""; position:absolute; top:195px; left:0; width:100%; height:2px; background:#ccc;}
.about-history .swiper-container {overflow: visible; margin:0 -20px;}
.about-history .item {width:50%; padding:0 20px;}
.about-history .item .year {position:relative; font-size:40px; line-height:1.4em; color:#ccc; font-weight:700; margin-bottom:20px;}
.about-history .item .year:after {content:"";position:absolute; left:0; bottom:-7px; width:0; height:2px; background:#d23246; opacity:0; transition: all 2s ease-out;}
.about-history .item ul li {font-size:20px; line-height:2.5em;}
.about-history .item.swiper-slide-active .year {color:#d23246}
.about-history .item.swiper-slide-active .year:after {width:100%; opacity:1;}
.about-history .btns {position:absolute; top:30px; right:15px; margin:0 -4px; display:flex; z-index:12}
.about-history .btns .swiper-button-prev,
.about-history .btns .swiper-button-next {position:static; margin:0 4px; width:36px; height:36px; background-position:50% 50%; background-color:transparent; background-repeat:no-repeat; border:1px solid #e5e5e5; background-size:9px 15px;}
.about-history .btns .swiper-button-prev {background-image:url('../images/main/slide_prev.png');}
.about-history .btns .swiper-button-next {background-image:url('../images/main/slide_next.png');}
.about-history .btns .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {opacity:1;}

.about-member {padding:125px 0 140px;background:url('../images/content/about_bg5.jpg') 50% 50% no-repeat; background-size:cover; overflow:hidden;}
.about-member .content-title {color:#fff; margin-bottom:75px; text-align:center;}
.about-member .article-wrap {display:flex;}
.about-member ul {display:flex;  justify-content: space-around;}
.about-member ul li {padding:0 20px; text-align:center;}
.about-member ul li .pic-box {transition: transform 0.35s;}
.about-member ul li .pic {width:300px; border-radius: 100% / 70% 70% 70% 70%;  overflow:hidden; margin-bottom:10px;}
.about-member ul li .name {font-size:28px; line-height:1.4em; color:#fff;font-weight:500;}
.about-member ul li .pos {font-size:18px; line-height:1.4em; color:#999;font-weight:700;}

.about-member .article-wrap.animation { animation: animateSymbolContainer 20s linear infinite;will-change: transform;}

.pic-box.anim1 {animation: animateSymbol1 4s ease-in-out infinite;}
.pic-box.anim2 {animation: animateSymbol2 3.5s ease-in-out infinite;}
.pic-box.anim3 {animation: animateSymbol3 3s ease-in-out infinite;}
.pic-box.anim4 {animation: animateSymbol4 2.5s ease-in-out infinite;}

@keyframes animateSymbolContainer {
  from {
    transform: translate3d(0px, 0px, 0px);
  }
  to {
    transform: translate3d(-100%, 0px, 0px);
  }
}

@keyframes animateSymbol1 {
  0% {
      transform: translateY(9%);
  }
  50% {
      transform: translateY(-9%);
  }
  100% {
      transform: translateY(9%);
  }
}
@keyframes animateSymbol2 {
  0% {
      transform: translateY(-9%);
  }
  50% {
      transform: translateY(9%);
  }
  100% {
      transform: translateY(-9%);
  }
}
@keyframes animateSymbol3 {
  0% {
      transform: translateY(10%);
  }
  50% {
      transform: translateY(-10%);
  }
  100% {
      transform: translateY(10%);
  }
}
@keyframes animateSymbol4 {
  0% {
      transform: translateY(-10%);
  }
  50% {
      transform: translateY(10%);
  }
  100% {
      transform: translateY(-10%);
  }
}

.about-partner {background:#f8f8f8; padding:125px 0 170px;} 
.about-partner .content-title {text-align:center; margin-bottom:50px;}
.about-partner-slider .slick-list {margin:0 -20px -40px;}
.about-partner-slider .slick-slide {padding:0 20px;}
.about-partner-slider .slick-slide > div {margin-bottom:40px;}
.about-partner-slider .thumb {position:relative; height:0; padding-bottom:66.7%; border-radius:45px; overflow:hidden}
.about-partner-slider .thumb img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; min-height:100%; object-fit:contain; transition:0.3s;}
.about-partner-slider .slick-dots {margin-top:20px;display:flex; justify-content:center; z-index:20}
.about-partner-slider .slick-dots li {margin:0 4px; line-height:0;}
.about-partner-slider .slick-dots li button {width:10px; height:10px; text-indent:-9999em; border:0; background:#666; opacity:.50; border-radius:100%; transition: all 0.2s ease-in-out;}
.about-partner-slider .slick-dots li.slick-active button {width:30px; border-radius:10px; opacity:1;} 
.about-partner-slider.logos-slider .thumb {padding-bottom:60%;}

.about-location {position:relative; padding:130px 0;}
.about-location:before {content:"";position:absolute; top:0;right:0; width:342px; height:395px; background:url('../images/content/about_bg4.jpg') 0 0 no-repeat; background-size:contain; z-index:-1;}
.about-location:after {content:"";position:absolute; bottom:0;left:0; width:360px; height:413px; background:url('../images/content/about_bg6.jpg') 0 100% no-repeat; background-size:contain; z-index:-1;}
.about-location .content-title {text-align:center; margin-bottom:45px;}
.about-location .nav {margin-bottom:30px;}
.about-location .nav ul {display:flex; justify-content:center; margin:0 -1px;}
.about-location .nav ul li {padding:0 1px; text-align:center;}
.about-location .nav ul li a {display:flex; align-items:center;justify-content:center; width:200px; height:60px; border:1px solid #e5e5e5; background:#fff;font-size:18px; line-height:1.4em;}
.about-location .nav ul li.active a {background:#d23246; color:#fff; border-color:#d23246;}

.root_daum_roughmap {width:100% !important; height:820px !important;}
.root_daum_roughmap .wrap_map {height:820px !important;}
.location1 .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.location1 .roughmap_lebel_text:after {content:"헤드 오피스"; font-size:12px; line-height:15px;}
.location2 .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.location2 .roughmap_lebel_text:after {content:"개발 연구실"; font-size:12px; line-height:15px;}
.location3 .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.location3 .roughmap_lebel_text:after {content:"미디어 오피스"; font-size:12px; line-height:15px;}
.location4 .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.location4 .roughmap_lebel_text:after {content:"촬영 스튜디오"; font-size:12px; line-height:15px;}
.location5 .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.location5 .roughmap_lebel_text:after {content:"소잉 매장"; font-size:12px; line-height:15px;}
.location6 .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.location6 .roughmap_lebel_text:after {content:"물류 창고"; font-size:12px; line-height:15px;}

.startup-top-menu {position:absolute; top:50px; left:50%; margin-left:-25%; width:50%; z-index:101}
.startup-top-menu ul {display:flex; align-items:center; justify-content:center;}
.startup-top-menu ul li {padding:0 10px; text-align:center;}
.startup-top-menu ul li a {display:flex; align-items:center; justify-content:center; height:60px; width:320px; border-radius:60px; background:#fff; font-size:20px; line-height:1.4em; color:#000; border:1px solid #e5e5e5;}
.startup-top-menu ul li.active a {background:#d23246; color:#fff; border-color:#d23246}

.startup-vis {height:1416px; position:relative; overflow:hidden;}
.startup-vis .content {padding-top:285px; color:#fff; text-align:center; z-index:1; position:relative;}
.startup-vis .tit {position:relative; padding-top:80px; font-size:120px;line-height:1.3em; font-weight:900; margin-bottom:40px;}
.startup-vis .tit .label {position:absolute; top:0; left:170px; width:275px; height:114px; background:url('../images/content/startup_label.png') 0 0 no-repeat; font-size:40px; line-height:80px; font-weight:700;}
.startup-vis .tt {font-size:60px; line-height:1.4em; letter-spacing:-.075em;}
.startup-vis .cnt {font-size:20px; line-height:1.4em;}
.startup-vis .background {
	position:absolute; 
	top:0; 
	left:0;
	width:100%; height:100%;	
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-size:cover;
	background-image:url('../images/content/startup_vis.jpg');
	transform:scale(1.09);
    -ms-transform:scale(1.09); /* IE 9 */
    -moz-transform:scale(1.09); /* Firefox */
    -webkit-transform:scale(1.09); /* Safari and Chrome */
    -o-transform:scale(1.09); /* Opera */
	transition: all 2s ease-out 0s;
	transition-delay: 0.1s;
	z-index:0;
}
.startup-vis.load .background {
	transform:scale(1);
    -ms-transform:scale(1); /* IE 9 */
    -moz-transform:scale(1); /* Firefox */
    -webkit-transform:scale(1); /* Safari and Chrome */
    -o-transform:scale(1); /* Opera */
}
.startup-vis.brandup-vis {height:1100px;}
.startup-vis.brandup-vis .tit .label {width:280px; height:80px;background-image:url('../images/content/brandup_label.png')}
.startup-vis.brandup-vis .background {background-image:url('../images/content/brandup_vis.jpg');}

.startup-cont {text-align:center; margin-bottom:75px; margin-top:40px;}
.startup-cont h2 {font-size:100px; line-height:1.4em; font-weight:900; background: linear-gradient(95deg, #06b2a4 20%, #b765de 40%, #472bc6 80%); -webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.startup-cont .tit {font-size:50px; line-height:1.4em; letter-spacing:-.05em; margin-bottom:10px;}
.startup-cont .cnt {font-size:20px; line-height:1.5em;}
.startup-cont.brand h2 {background: linear-gradient(95deg, #d5ce18 20%, #ef3ccf 40%, #c62b48 80%); -webkit-background-clip: text;-webkit-text-fill-color: transparent;}

.startup-menu {background:#aa71d8; height:80px; border-radius:80px; padding:10px; margin-bottom:65px;}
.startup-menu ul {display:flex; margin:0 -5px;}
.startup-menu ul li {flex:1; text-align:center; padding:0 5px;}
.startup-menu ul li a {display:flex; align-items:center; justify-content:center; height:60px; border-radius:60px; background:#fff; font-size:20px; line-height:1.4em; color:#000;}
.startup-menu ul li.active a {background:#6837ce; color:#fff;}
.startup-menu.brand {background:#e02f9b;border-radius:0;}
.startup-menu.brand ul li a {border-radius:0}
.startup-menu.brand ul li.active a {background:#a3116a}

.sub-tab-fixed .fixed-menu {position:fixed; top:15px; left:0; width:100%; z-index:90}
#brand #header.header-fixed {display:none}

.startup-menu-m {display:none; margin-bottom:20px;}
.startup-menu-m ul {display:flex; height:50px; background:#aa71d8; border-radius:50px; padding:5px 2.5px; margin-bottom:5px;}
.startup-menu-m ul li {flex:1; text-align:center; padding:0 2.5px;}
.startup-menu-m ul li a {display:flex; align-items:center; justify-content:center; height:40px; border-radius:40px; background:#fff; font-size:16px; line-height:1.4em; color:#000}
.startup-menu-m ul li.active a {background:#6837ce; color:#fff;}
.startup-menu-m.brand ul {background:#e02f9b; border-radius:0;}
.startup-menu-m.brand ul li a {border-radius:0}
.startup-menu-m.brand ul li.active a {background:#a3116a}

.start-title {margin-bottom:55px;}
.start-title h3 {font-size:60px; line-height:1.4em; letter-spacing:-.075em; margin-bottom:14px;}
.start-title .cnt {font-size:20px ;line-height:1.5em; margin-bottom:10px;}
.start-title .option ul {display:flex; flex-wrap:wrap; margin:0 -10px -10px;}
.start-title .option ul li {position:relative; padding:0 10px; margin-bottom:10px; font-size:24px; line-height:1.6em; font-weight:500;}
.start-title .option ul li:after {content:"";position:absolute; top:50%; left:0; width:1px; height:18px; background:#aaa; margin-top:-9px;}
.start-title .option ul li:first-child:after {display:none}

.start-tit {margin-bottom:15px;}
.start-tit h4 {font-size:50px; line-height:1.4em; font-weight:900;}
.start-tit .tt {font-size:30px;line-height:1.4em; font-weight:700; margin-bottom:5px;}
.start-tit .cnt {font-size:20px; line-height:1.5em;}

.start-cont {margin-bottom:75px;}
.start-cont ul {display:flex; margin:0 -20px;}
.start-cont ul li {width:50%; padding:0 20px;}
.start-cont ul li .pic {margin-bottom:14px;}
.start-cont ul li .tit {font-size:30px;line-height:1.4em; font-weight:700; margin-bottom:5px;}
.start-cont ul li .cnt {font-size:20px; line-height:1.5em;}
.start-cont.business ul {margin:0 -10px;}
.start-cont.business ul li {padding:0 10px;}
.start-cont.business ul li .pic {margin-bottom:0;} 
.start-cont.business ul li .cnt {margin-bottom:10px;}
.start-cont.promotion ul {margin:0 -5px;}
.start-cont.promotion ul li {padding:0 5px;}
.start-cont.promotion ul li .pic {margin-bottom:0;}
.start-cont.promotion ul li:nth-child(2) .pic {position:relative;  z-index:-1}
.start-cont.promotion ul li:nth-child(2) .pic img {margin-left:-50px;}
.start-cont.promotion ul li .cnt {letter-spacing:-.05em; margin-bottom:10px;}
.start-cont.promotion.homepage ul li:nth-child(2) .pic {margin-top:60px;} 
.start-cont.promotion.homepage ul li:nth-child(2) .pic img {margin-left:-120px;}

.start-service {display:flex; align-items:center; color:#fff; height:400px; background:url('../images/content/startup_service_bg.jpg') 50% 50% no-repeat; background-size:cover; margin:175px 0 85px;}
.start-service h3 {font-size:100px; line-height:1em; font-weight:900; margin-bottom:5px;}
.start-service .cnt {font-size:40px; line-height:1.4em;}
.start-service.brandup {background-image:url('../images/content/brandup_bg.jpg')}

.start-table-wrap {margin-bottom:70px;}
.start-table-wrap .row {display:flex; margin:0 -20px;}
.start-table-wrap .col {width:50%; padding:0 20px;}
.start-table-wrap .col.type2 .table01 table thead th {background:#8a33d1; border-color:#8a33d1}
.start-table-wrap .col.type2 .table01 table tbody th,
.start-table-wrap .col.type2 .table01 table tbody td {border-color:#8a33d1}
.start-table-wrap .col.type2 .table-total {border-top-color:#8a33d1;}
.start-table-wrap .col.type2 .table-total-sale {background:#8a33d1}

.table01 table {width:100%; border-collapse:collapse; border-spacing:0px;}
.table01 table thead th {padding:12px 30px; background:#aa71d8; color:#fff; text-align:left; font-size:34px; font-weight:700; line-height:1.5em; border:1px solid #aa71d8;}
.table01 table tbody tr:nth-child(odd) {background:#fbf8fd}
.table01 table tbody th {padding:20px 15px; font-size:20px; font-weight:700; line-height:1.5em; border:1px solid #aa71d8;}
.table01 table tbody td {padding:20px 20px; font-size:20px; font-weight:400; line-height:1.5em; border:1px solid #aa71d8;}
.table01 table tbody td:last-child {text-align:right;}
.table01 .num {font-size:24px; line-height:1.4em; font-weight:700;}
.table-total {margin-top:15px; border-top:1px solid #aa71d8; padding:15px 30px;}
.table-total dl {display:flex; align-items:center;}
.table-total dl dt {font-size:30px; line-height:1.4em; font-weight:700; width:90px;}
.table-total dl dd {flex:1 1 auto; min-width:0; width:1%; font-size:24px; line-height:1.4em; font-weight:700; text-decoration:line-through; text-align:right;}
.table-total-sale {background:#aa71d8; padding:15px 30px; color:#fff;}
.table-total-sale dl {display:flex; align-items:center;}
.table-total-sale dl dt {font-size:30px; line-height:1.4em; font-weight:700; width:150px;}
.table-total-sale dl dd {flex:1 1 auto; min-width:0; width:1%; font-size:40px; line-height:1.4em; font-weight:700; text-align:right;}

.brand-type1 .table01 table thead th {background:#e02f9b; border-color:#e02f9b}
.brand-type1 .table01 table tbody th,
.brand-type1 .table01 table tbody td {border-color:#e02f9b}
.brand-type1 .table-total {border-top-color:#e02f9b;}
.brand-type1 .table-total-sale {background:#e02f9b}

.brand-type2 .table01 table thead th {background:#a3116a; border-color:#a3116a}
.brand-type2 .table01 table tbody th,
.brand-type2 .table01 table tbody td {border-color:#a3116a}
.brand-type2 .table-total {border-top-color:#a3116a;}
.brand-type2 .table-total-sale {background:#a3116a}

.start-btns {text-align:center;}
.start-btns a {display:inline-block; background:#d23246; width:640px; height:80px; font-size:30px; line-height:80px; color:#fff;}

.start-business-slider .slick-list {margin:0 -20px;}
.start-business-slider .item {padding:0 20px;}
.start-business-slider .slick-arrow {position:absolute; top:-60px; right:15px; font-size:0; width:36px; height:36px; background-position:50% 50%; background-color:transparent; background-repeat:no-repeat; border:1px solid #e5e5e5; z-index:70;}
.start-business-slider .slick-prev {right:40px; background-image:url('../images/main/slide_prev.png');}
.start-business-slider .slick-next {right:0; background-image:url('../images/main/slide_next.png');}

.website-container {overflow:hidden;}
.website-container .contain {position:relative;}
.website-slider {max-width:1056px; position:relative;}
.website-slider:after {content:"";position:absolute; top:0; left:0; max-width:1036px; width:100%; height:679px; background:#000; border-radius:30px; z-index:-1}
.website-slider .swiper-container {overflow:visible}
.website-slider ul {margin:0 -18px;}
.website-slider ul li {padding:0 18px;}
.website-slider ul li .box {margin-left:20px; padding-top:20px;}
.website-slider .thumb {position:relative;  border-radius:20px; overflow:hidden;}
.website-slider .thumb:after {content:"";position:absolute; top:0; left:0; bottom:0; right:0; border:1px solid #e5e5e5; border-radius:20px;}
.website-container .btns {position:absolute; top:15px; right:15px; margin:0 -4px; display:flex; z-index:12}
.website-container .btns .swiper-button-prev,
.website-container .btns .swiper-button-next {position:static; margin:0 4px; width:36px; height:36px; background-position:50% 50%; background-color:transparent; background-repeat:no-repeat; border:1px solid #e5e5e5; background-size:9px 15px;}
.website-container .btns .swiper-button-prev {background-image:url('../images/main/slide_prev.png');}
.website-container .btns .swiper-button-next {background-image:url('../images/main/slide_next.png');}
.website-slider .monitor-img {text-align:center; margin-top:18px;}
.website-slider .swiper-slide.swiper-slide-active .thumb:after {border:0}
.website-slider .swiper-slide.swiper-slide-prev .thumb {opacity:.5;}
.website-slider .swiper-slide.swiper-slide-next .thumb {opacity:.5;}


/* service */
.service-vis {position:relative; height:500px; overflow:hidden; display:flex; align-items:flex-end; color:#fff; }
.service-vis .contain {z-index:1}
.service-vis .tit {font-size:120px; line-height:1em; font-weight:500; letter-spacing:-.01em;}
.service-vis .background {
	position:absolute; 
	top:0; 
	left:0;
	width:100%; height:100%;	
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-size:cover;
	background-image:url('../images/content/service_vis.jpg');
	transform:scale(1.09);
    -ms-transform:scale(1.09); /* IE 9 */
    -moz-transform:scale(1.09); /* Firefox */
    -webkit-transform:scale(1.09); /* Safari and Chrome */
    -o-transform:scale(1.09); /* Opera */
	transition: all 2s ease-out 0s;
	transition-delay: 0.1s;
	z-index:0;
}
.service-vis.load .background {
	transform:scale(1);
    -ms-transform:scale(1); /* IE 9 */
    -moz-transform:scale(1); /* Firefox */
    -webkit-transform:scale(1); /* Safari and Chrome */
    -o-transform:scale(1); /* Opera */
}

.service-sec1 {text-align:center; background:url('../images/content/service_vis_bg.jpg') 0 0 repeat;}

.service-cont .item {height:800px; display:flex; align-items:center; color:#fff; background:url('../images/content/service_bg2.jpg') 50% 50% no-repeat; background-size:cover;}
.service-cont .item .contain {display:flex; align-items:center; justify-content:flex-end}
.service-cont .item .content-box {padding-left:75px; width:50%;}
.service-cont .item h2 {color:#c9a68b; font-size:100px;line-height:1.4em; font-weight:900; margin-bottom:5px;}
.service-cont .item .tit {font-size:50px; line-height:1.2em; letter-spacing:-.050em; margin-bottom:10px;}
.service-cont .item .cnt {font-size:20px; line-height:1.5em; margin-bottom:30px;}
.service-cont .item .opt {font-size:24px; line-height:1.6em; font-weight:500;}
.service-cont .item .opt ul {display:flex; flex-wrap:wrap; margin:0 -10px -7px;}
.service-cont .item .opt ul li {position:relative; padding:0 10px; margin-bottom:7px; font-size:24px; line-height:1.6em; font-weight:500;}
.service-cont .item .opt ul li:after {content:"";position:absolute; top:50%; left:0; width:1px; height:18px; background:#aaa; margin-top:-9px;}
.service-cont .item .opt ul li:first-child:after {display:none}
.service-cont .item .opt ul li:nth-child(4):after {display:none}
.service-cont .item .opt .bar {padding:0 10px;}
.service-cont .item .more {margin-top:30px;}
.service-cont .item .more a {display:inline-block; font-size:14px; line-height:1.4em; font-weight:500; position:relative;}
.service-cont .item .more a:after {content:""; margin-left:5px; display:inline-block; vertical-align:button; width:25px; height:7px; background:url('../images/content/more_arrow.png') 0 0 no-repeat;}
.service-cont .item:nth-child(even) {color:#000}
.service-cont .item:nth-child(even) .contain {justify-content:flex-start;}
.service-cont .item:nth-child(even) .content-box {padding-left:0;}
.service-cont .item:nth-child(even) .more a:after {background-image:url('../images/content/more_arrow_b.png');}
.service-cont .item.website {background-image:url('../images/content/service_bg3.jpg');}
.service-cont .item.website h2 {color:#d23246}
.service-cont .item.website .opt ul li:nth-child(3):after {display:none}
.service-cont .item.website .opt ul li:nth-child(4):after {display:block}
.service-cont .item.content {background-image:url('../images/content/service_bg4.jpg');}
.service-cont .item.content h2 {color:#fdad23}
.service-cont .item.photo {background-image:url('../images/content/service_bg6.jpg'); flex-wrap:wrap; align-content:center;}
.service-cont .item.photo h2 {color:#9fd087; font-weight:700; font-family: 'Playfair Display', serif; font-style:italic;}
.service-cont .item.photo .contain {justify-content:flex-start}
.service-cont .item.photo .content-box {padding-left:0; width:100%}
.service-cont .item .photo-img {padding-left:30px; margin-top:50px; width:100%}
.service-cont .item.marketing {background-image:url('../images/content/service_bg7.jpg');}
.service-cont .item.marketing h2 {color:#d23246;}
.service-cont .item.marketing .contain {padding-left:90px;justify-content:flex-end}
.service-cont .item.marketing .content-box {width:50%; margin-top:-150px;}

.service-media {background:#eaeff5; padding-top:140px; text-align:center;}
.service-media h2 {font-size:100px; line-height:1.4em; font-weight:900; background: linear-gradient(95deg, #e9a5a5 10%, #b8c1c0 30%, #65c0e0 50%, #aea2db 60%, #81c1d9 80%); -webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.service-media .tit {font-size:50px; line-height:1.4em; letter-spacing:-.05em; margin-bottom:10px;}
.service-media .cnt {font-size:20px; line-height:1.5em;}
.service-media .more {margin:40px 0 50px;}
.service-media .more a {display:inline-block; font-size:14px; line-height:1.4em; font-weight:500; position:relative;}
.service-media .more a:after {content:""; margin-left:5px; display:inline-block; vertical-align:button; width:25px; height:7px; background:url('../images/content/more_arrow_b.png') 0 0 no-repeat;}

.portflio-vis {height:auto; padding-bottom:56.25%; position:relative; overflow:hidden;}
.portflio-vis video,
.portflio-vis iframe {position: absolute;right:0;bottom:0;top:0;right:0;width: 100%;height: 100%;background-size: 100% 100%;background-color: black; background-position: center center;background-size: contain;z-index:3;}

.portflio-container {position:relative; padding:130px 0;background:#000 url('../images/content/portflio_bg.jpg') 50% 50% no-repeat; background-size:cover; overflow:hidden}
.portflio-container:after {content:"";position:absolute; bottom:0; left:0; width:100%; height:200px; background: linear-gradient(0, rgba(20, 20, 20, 1), rgba(255, 0, 0, 0) 100%); z-index:0;}
.portflio-container .top-txt {text-align:center; font-size:120px ;line-height:1.4em; color:#fff; letter-spacing:-.075em; padding-top:20px; font-weight:200; margin-bottom:30px;}
.portflio-container .top-txt .point {position:relative; display:inline-block;}
.portflio-container .top-txt .point:after {content:""; position:absolute; top:-20px; left:50%; width:20px; height:20px; background:#fff; margin-left:-10px; border-radius:100%}
.portflio-container .port-nav {margin-bottom:50px;}
.portflio-container .port-nav ul {display:flex; justify-content:center;}
.portflio-container .port-nav ul li {padding:0 2px; width:auto}
.portflio-container .port-nav ul li a {display:flex; align-items:center; justify-content:center; color:#333; padding:0 30px; border:2px solid #666; background:#fff; height:40px; font-size:18px; line-height:1.4em; font-weight:700; border-radius:40px;}
.portflio-container .port-nav ul li.active a {background:#d23246; border-color:#d23246; color:#fff;}

.portflio-list .items-list {position:relative;}
.portflio-list ul {position:relative; display:flex; flex-wrap:wrap;}
.portflio-list ul li {width:25%;}
.portflio-list ul li.fade_in {position:relative;}
.portflio-list ul li a {display:block; position:relative;}
.portflio-list ul li a:after {content:"";position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.50) url('../images/main/port_more.png') 50% 50% no-repeat; z-index:4; transition:0.3s; opacity:0;}
.portflio-list ul li .line-ep {position:absolute; top:0; left:0; width:100%; height:100%; z-index:5}
.portflio-list ul li .line-ep .line-1 {position:absolute; width:100%; height:100%;}
.portflio-list ul li .line-ep .line-1:before {content:"";position:absolute; top:0; left:0; width:0; height:10px; background:#fff; transition:0.3s;  transition-delay:.1s; opacity:0;} 
.portflio-list ul li .line-ep .line-1:after {content:"";position:absolute; top:0; right:0; width:10px; height:0; background:#fff; transition:0.3s;  transition-delay:.2s; opacity:0;} 
.portflio-list ul li .line-ep .line-2 {position:absolute; width:100%; height:100%;}
.portflio-list ul li .line-ep .line-2:before {content:"";position:absolute; bottom:0; left:0; width:0; height:10px; background:#fff; transition:0.3s;  transition-delay:.1s; opacity:0;} 
.portflio-list ul li .line-ep .line-2:after {content:"";position:absolute; top:0; left:0; width:10px; height:0; background:#fff; transition:0.3s;  transition-delay:.2s; opacity:0;}
.portflio-list ul li .thumb {position:relative; height:0; padding-bottom:100%; overflow:hidden;}
.portflio-list ul li .thumb img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.portflio-list ul li .thumb:before {content:"";position:absolute; bottom:0; left:0; width:100%; height:50%;  background: linear-gradient(0, rgba(0, 0, 0, 1), rgba(255, 0, 0, 0) 100%); z-index:2;}
.portflio-list ul li .thumb.no-shadow:before {content:""; background:transparent;}
.portflio-list ul li a:hover .thumb img {transform:translateY(-50%) scale(1.04,1.04); -ms-transform:translateY(-50%) scale(1.04,1.04); -webkit-transform:translateY(-50%) scale(1.04,1.04);}
.portflio-list ul li a:hover:after {opacity:1;}
.portflio-list ul li .title {position:absolute; bottom:30px; left:40px; color:#fff; z-index:3; text-align:left;}
.portflio-list ul li .title .tit {font-size:30px; line-height:1.4em;font-weight:500; margin-bottom:5px;}
.portflio-list ul li .title .txt {font-size:16px; line-height:1.4em;font-weight:300;}
.portflio-list ul li .title .bar {padding:0 5px;}
.portflio-list ul li a:hover .line-ep .line-1:before {opacity:1; width:100%;}
.portflio-list ul li a:hover .line-ep .line-1:after {opacity:1; height:100%;}
.portflio-list ul li a:hover .line-ep .line-2:before  {opacity:1;  width:100%;}
.portflio-list ul li a:hover .line-ep .line-2:after {opacity:1; height:100%;}
.portflio-list .all-more {text-align:center; position:relative; height:50px;margin-top:50px;}
.portflio-list .all-more .more {position:absolute; bottom:0; left:0; display:inline-block; position:relative; font-size:16px; line-height:1.4em; color:#fff; animation:srollUpDown 1.0s linear infinite alternate;}
.portflio-list .all-more .more:after {content:"";display:block; width:100%; height:21px; background:url('../images/main/btn_arrow.png') 50% 50% no-repeat; margin-top:5px;}

@keyframes srollUpDown{
	from{
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}to{
		-moz-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		-webkit-transform: translateY(20px);
		transform:translateY(20px);
	}
}

.btn-close {display:none}
#portdetail .btn-m-menu {display:none;}
#portdetail .btn-close {display:block; position:absolute; top:55px; margin-top:0; right:15px; width:60px; height:60px; background:#d23246; border-radius:100%;text-align:center; text-indent:-9999em; z-index:92; transition: all 0.3s ease-in-out;}
#portdetail .btn-close span {position:absolute; left:50%; margin-top:-1px;top:50%; margin-left:-15px; height:2px; width:30px;background:none;}
#portdetail .btn-close span:before,
#portdetail .btn-close span:after {position:absolute; left:50%; top:50%; margin-top:-15px; margin-left:-1px;content: ' ';height:30px; width:2px;background-color:#fff;}
#portdetail .btn-close span:before {transform: rotate(45deg);} 
#portdetail .btn-close span:after {transform: rotate(-45deg);}

#portdetail .btn-close:hover {width:70px; height:70px; margin-top:0; top:50px; right:10px;}
.portflio-cont-wrap {padding-top:175px; overflow:hidden;}
.portflio-cont-wrap .title {text-align:center; margin-bottom:40px;}
.portflio-cont-wrap .title .des {font-size:16px; line-height:1.4em; margin-bottom:10px;}
.portflio-cont-wrap .title h2 {font-size:80px; line-height:1.4em; font-weight:900;}
.portflio-cont-wrap.black-bg {background:#141414;}
.portflio-cont-wrap.black-bg .title {color:#fff}
.portflio-cont-wrap.gray-bg {background:#f8f8f8}
.portflio-cont-wrap.gray-bg .portflio-slide {padding-top:0;}

.portflio-head {text-align:center; padding-bottom:200px; background:#fff;}
.portflio-head .img {margin:0 0 35px; padding-top:40px;}
.portflio-head .tit {font-size:50px; line-height:1.4em; margin-bottom:15px;}
.portflio-head .cnt {font-size:20px; line-height:1.5em;}

.portflio-title {font-size:80px; line-height:1.4em;margin-bottom:35px;  font-weight:900;text-align:center;}
.portflio-title span {font-weight:200;}
.portflio-title.mobile {position:relative; padding-top:220px;}
.portflio-title.mobile:after {content:"";position:absolute; top:0; left:50%; width:1px; height:160px; background:#000; margin-left:-.05;}
.portflio-title.pc {position:relative; padding-top:220px;}
.portflio-title.pc:after {content:"";position:absolute; top:0; left:50%; width:1px; height:160px; background:#000; margin-left:-.05;}

.portflio-images {max-width:1920px; margin:0 auto; background:#fff;}
.portflio-images .item {margin-bottom:160px;}
/* .portflio-images .item:last-child {margin-bottom:0;} */

.portflio-slide {background:#f8f8f8; padding:205px 0;}
.portflio-slide .contain {max-width:1430px;}
.portflio-slide .items {position:relative; }
.portflio-slide .item {padding:20px;}
.portflio-slide .pic {box-shadow:0 0 20px rgba(0,0,0,.15)}
.portflio-slide .slick-arrow {position:absolute; top:50%; margin-top:-63px; font-size:0; width:50px; height:126px; border:0; background-position:50% 50%; background-color:transparent; background-repeat:no-repeat; z-index:30;}
.portflio-slide .slick-prev {left:-125px; background-image:url('../images/content/slide_prev.png');}
.portflio-slide .slick-next {right:-125px; background-image:url('../images/content/slide_next.png');}
.portflio-slide .slick-dots {margin-top:15px; display:flex; justify-content:center; z-index:20}
.portflio-slide .slick-dots li {margin:0 4px; line-height:0;}
.portflio-slide .slick-dots li button {width:10px; height:10px; text-indent:-9999em; border:0; background:#666; opacity:.50; border-radius:100%; transition: all 0.2s ease-in-out;}
.portflio-slide .slick-dots li.slick-active button {width:30px; border-radius:10px; opacity:1;}


.portflio-video {position:relative; padding-bottom:56.25%; overflow:hidden;}
.portflio-video video,
.portflio-video iframe {position: absolute;width: 100%;height: 100%;background-size: 100% 100%;background-color: black; background-position: center center;background-size: contain;z-index:3;}

.portflio-wrap {background:#141414; position:relative;  overflow:hidden; padding-bottom:205px;}
.portflio-wrap:after {content:"";position:absolute; bottom:0; left:0; width:100%; height:200px; background: linear-gradient(0, rgba(20, 20, 20, 1), rgba(255, 0, 0, 0) 100%); z-index:-1;}
.portflio-photo-list .photo-items {position:relative;}
.portflio-photo-list .photo-items:after {content:"";display:block;clear:both;}
.portflio-photo-list .item-sizer {width:8.33333333%}
.portflio-photo-list .item {float:left; width:25%;}
.portflio-photo-list .pic {position:relative; overflow:hidden;}
.portflio-photo-list .pic img {width:100%; transition:0.3s}
.portflio-photo-list .line-ep {position:absolute; top:0; left:0; width:100%; height:100%; z-index:5}
.portflio-photo-list .line-ep .line-1 {position:absolute; width:100%; height:100%;}
.portflio-photo-list .line-ep .line-1:before {content:"";position:absolute; top:0; left:0; width:0; height:10px; background:#fff; transition:0.3s;  transition-delay:.1s; opacity:0;} 
.portflio-photo-list .line-ep .line-1:after {content:"";position:absolute; top:0; right:0; width:10px; height:0; background:#fff; transition:0.3s;  transition-delay:.2s; opacity:0;} 
.portflio-photo-list .line-ep .line-2 {position:absolute; width:100%; height:100%;}
.portflio-photo-list .line-ep .line-2:before {content:"";position:absolute; bottom:0; left:0; width:0; height:10px; background:#fff; transition:0.3s;  transition-delay:.1s; opacity:0;} 
.portflio-photo-list .line-ep .line-2:after {content:"";position:absolute; top:0; left:0; width:10px; height:0; background:#fff; transition:0.3s;  transition-delay:.2s; opacity:0;}
.portflio-photo-list a {display:block; position:relative;}
.portflio-photo-list a:after {content:"";position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.50) url('../images/main/port_more.png') 50% 50% no-repeat; z-index:4; transition:0.3s; opacity:0;}
.portflio-photo-list a:hover .line-ep .line-1:before {opacity:1; width:100%;}
.portflio-photo-list a:hover .line-ep .line-1:after {opacity:1; height:100%;}
.portflio-photo-list a:hover .line-ep .line-2:before  {opacity:1;  width:100%;}
.portflio-photo-list a:hover .line-ep .line-2:after {opacity:1; height:100%;}
.portflio-photo-list a:hover:after {opacity:1;}
.portflio-photo-list a:hover .pic img {transform:scale(1.04,1.04); -ms-transform:scale(1.04,1.04); -webkit-transform:scale(1.04,1.04);}

.portfolio-load-list {margin-top:150px;}
.portfolio-load-list .portflio-title {color:#fff}

.pop-photo-wrap {height:100vh;display:flex; align-items:center; justify-content:center; width:100%; overflow:hidden;}
.pop-photo-container {max-width:1400px; width:100%; margin:0 auto; text-align:center;}
.pop-photo-container.type2 {max-width:902px;}
.pop-photo {position:relative; padding:20px 0;}
.pop-photo .item {width:100%; display:flex; align-items:center;}
.pop-photo .pic {position:relative; height:auto; overflow:hidden;}
.pop-photo .pic img {/* position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); */ max-height:80%; max-width:100%;}
.pop-photo .slick-list {max-height:95vh;}
.pop-photo .slick-arrow {position:absolute; top:50%; margin-top:-63px; font-size:0; width:50px; height:126px; border:0; background-position:50% 50%; background-color:transparent; background-repeat:no-repeat; z-index:30;}
.pop-photo .slick-prev {left:-125px; background-image:url('../images/content/pop_slide_prev.png');}
.pop-photo .slick-next {right:-125px; background-image:url('../images/content/pop_slide_next.png');}
.pop-photo .slick-dots {margin-top:15px; display:flex; justify-content:center; z-index:20}
.pop-photo .slick-dots li {margin:0 4px; line-height:0;}
.pop-photo .slick-dots li button {width:10px; height:10px; text-indent:-9999em; border:0; background:#fff; opacity:.50; border-radius:100%; transition: all 0.2s ease-in-out;}
.pop-photo .slick-dots li.slick-active button {width:30px; border-radius:10px; opacity:1;}
.pop-close {display:block; position:fixed; top:50px; right:50px; width:60px; height:60px; background:#d23246; border-radius:100%;text-align:center; text-indent:-9999em; z-index:92; transition: all 0.3s ease-in-out;}
.pop-close span {position:absolute; left:50%; margin-top:-1px;top:50%; margin-left:-15px; height:2px; width:30px;background:none;}
.pop-close span:before,
.pop-close span:after {position:absolute; left:50%; top:50%; margin-top:-15px; margin-left:-1px;content: ' ';height:30px; width:2px;background-color:#fff;}
.pop-close span:before {transform: rotate(45deg);} 
.pop-close span:after {transform: rotate(-45deg);}


/* 프로젝트 */
.project-visual {position:relative;}
.project-visual .item {height:1000px; position: relative; z-index:1; overflow:hidden;}
.project-visual .item .visual-img {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; background-repeat:no-repeat; background-position:50% 50%; background-size:cover;  opacity: 1 !important; animation-duration: 3s; transition: all 1s ease;}
.project-visual .content {position:absolute; top:50%; left:0; text-align:center; width:100%; color:#fff;  transform:translateY(-50%); z-index:50;}
.project-visual .content .contain {max-width:1350px;}
.project-visual .content .tit {font-size:80px; line-height:1em;}
.project-visual .content .txt {font-size:120px; line-height:1.2em; font-weight:900;}
.project-visual .content p {font-size:20px; line-height:1.5em; font-weight:100; letter-spacing:-.025em;}
.project-visual .content .more {margin-top:50px;}
.project-visual .content .more a {display:inline-flex; align-items:center; justify-content:center; width:175px; height:50px; font-size:14px; border:1px solid #999; line-height:1.4em; font-weight:500; position:relative;}
.project-visual .slick-dots {position:absolute; bottom:16px; left:0; width:100%; display:flex; justify-content:center; z-index:20}
.project-visual .slick-dots li {margin:0 4px; line-height:0;}
.project-visual .slick-dots li button {width:10px; height:10px; text-indent:-9999em; border:0; background:#fff; opacity:.50; border-radius:100%; transition: all 0.2s ease-in-out;}
.project-visual .slick-dots li.slick-active button {width:30px; border-radius:10px; opacity:1;} 

.project-visual [data-animation-in] {opacity: 0; animation-duration: 1.5s;transition: opacity 0.5s ease 0.3s;transition:1s;}


.project-visual-m {display:none; position:relative;}
.project-visual-m .item {height:500px; position: relative; z-index:1; overflow:hidden;}
.project-visual-m .item .visual-img {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; background-repeat:no-repeat; background-position:50% 50%; background-size:cover;  opacity: 1 !important; animation-duration: 3s; transition: all 1s ease;}
.project-visual-m .content {position:absolute; top:50%; left:0; text-align:center;width:100%; color:#fff;  transform:translateY(-50%); z-index:50;}
.project-visual-m .content .contain {max-width:1350px;}
.project-visual-m .content .tit {font-size:30px; line-height:1em;}
.project-visual-m .content .txt {font-size:40px; line-height:1.5em; font-weight:900;}
.project-visual-m .content p {font-size:15px; line-height:1.5em; font-weight:100; letter-spacing:-.025em;}
.project-visual-m .content .more {margin-top:30px;}
.project-visual-m .content .more a {display:inline-flex; align-items:center; justify-content:center; width:120px; height:40px;  border:1px solid #999;  font-size:14px; line-height:1.4em; font-weight:500; position:relative;}
.project-visual-m .slick-dots {position:absolute; bottom:16px; left:0; width:100%; display:flex; justify-content:center; z-index:20}
.project-visual-m .slick-dots li {margin:0 4px; line-height:0;}
.project-visual-m .slick-dots li button {width:7px; height:7px; text-indent:-9999em; border:0; background:#fff; opacity:.50; border-radius:100%; transition: all 0.2s ease-in-out;}
.project-visual-m .slick-dots li.slick-active button {width:26px; border-radius:7px; opacity:1;} 
.project-visual-m [data-animation-in] {opacity: 0; animation-duration: 1.5s;transition: opacity 0.5s ease 0.3s;transition:1s;}

.project-container {padding-top:130px;}
.project-list ul {display:flex; flex-wrap:wrap; margin:0 -20px;}
.project-list ul li {width:33.333333%; padding:0 20px; margin-bottom:40px;}
.project-list ul li.fade_in {position:relative;}
.project-list .thumb {position:relative; height:0; padding-bottom:100%; overflow:hidden;}
.project-list .thumb img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.project-list .thumb:after {content:"";position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #e5e5e5}
.project-list .text-box {text-align:center; border:1px solid #e5e5e5;border-top:0;padding:25px 15px;}
.project-list .text-box .tit {font-size:26px; line-height:1.4em; color:#000;font-weight:500; margin-bottom:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; letter-spacing:-.025em;}
.project-list .text-box p {font-size:16px; line-height:1.5em; color:#999; white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.project-list .text-box .sch_word {font-weight:400; color:#fff; background:#d23246; padding:0 5px}

.project-view {border-bottom:1px solid #ccc; margin-bottom:40px;}
.project-view .title {margin-bottom:65px; text-align:center; border-bottom:1px solid #ccc; padding-bottom:20px;}
.project-view .title h2 {font-size:60px; line-height:1.5em;}
.project-view .body {max-width:1200px; margin:0 auto; padding-bottom:100px; text-align:center;}
.project-view .body .text-box {font-size:20px; line-height:1.5em; padding:30px 0;}


.career-vis {position:relative; height:1200px; overflow:hidden; display:flex; align-items:flex-end; color:#fff; justify-content:center;}
.career-vis .contain {z-index:1}
.career-vis .tit {font-size:120px; line-height:1em; font-weight:700; letter-spacing:-.04em; position:absolute; bottom:-20px; left:0;}
.career-vis .background {
	position:absolute; 
	top:0; 
	left:0;
	width:100%; height:100%;	
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-size:cover;
	background-image:url('../images/content/career_vis.jpg');
	transform:scale(1.09);
    -ms-transform:scale(1.09); /* IE 9 */
    -moz-transform:scale(1.09); /* Firefox */
    -webkit-transform:scale(1.09); /* Safari and Chrome */
    -o-transform:scale(1.09); /* Opera */
	transition: all 2s ease-out 0s;
	transition-delay: 0.1s;
	z-index:0;
}
.career-vis.load .background {
	transform:scale(1);
    -ms-transform:scale(1); /* IE 9 */
    -moz-transform:scale(1); /* Firefox */
    -webkit-transform:scale(1); /* Safari and Chrome */
    -o-transform:scale(1); /* Opera */
}

.career-sec1 {padding-top:30px;}
.career-sec1 .contain {padding-bottom:100px;}
.career-sec1 .contain .tit {font-size:50px; line-height:1.4em; margin-bottom:10px;}
.career-sec1 .contain .cnt {font-size:20px; line-height:1.5em; margin-bottom:26px;}
.career-sec1 .contain .opt {width:52%}
.career-sec1 .contain .opt ul {display:flex; flex-wrap:wrap; margin:0 -10px -10px;}
.career-sec1 .contain .opt ul li {position:relative; padding:0 10px; margin-bottom:10px; font-size:24px; line-height:1.6em; font-weight:500;}
.career-sec1 .contain .opt ul li:after {content:"";position:absolute; top:50%; left:0; width:1px; height:16px; background:#aaa; margin-top:-8px;}
.career-sec1 .contain .opt ul li:first-child:after {display:none}
.career-sec1 .contain .opt ul li:nth-child(5):after,
.career-sec1 .contain .opt ul li:nth-child(7):after,
.career-sec1 .contain .opt ul li:nth-child(10):after {display:none}
.career-sec1 .contain .pic {position:absolute; bottom:0; right:123px; z-index:-1}

.career-sec2 {display:flex;}
.career-sec2 .col {width:50%;}
.career-sec2 .col img {width:100%}

.career-title {margin-bottom:90px;}
.career-title h2 {font-size:100px ;line-height:1.2em; color:#ff7529; font-weight:900;}
.career-title .cnt {font-size:50px; line-height:1.2em;}
.career-sec3 {padding:140px 0 80px; overflow:hidden;}
.career-sec3 .item .imgs {position:relative; margin-bottom:15px;}
.career-sec3 .item .text-box .tt {font-size:30px; line-height:1.3em; color:#ccc;font-weight:700; letter-spacing:-.025em;}
.career-sec3 .item .text-box .tit {font-size:40px; line-height:1.4em; font-weight:700; margin-bottom:10px;}
.career-sec3 .item .text-box .cnt {font-size:20px; line-height:1.5em;}
.career-sec3 .item .img-slide {position:absolute; top:20%; left:0; display:flex; width:100%; z-index:-1;}
.career-sec3 .item .img-slide ul {display:flex;}
.career-sec3 .item .img-slide ul li {padding:0 40px;}
.career-sec3 .item .img-slide ul li .pic {width:175px; margin:0 auto;}
.career-sec3 .item .img-slide.animation {animation: animateSymbolContainer 20s linear infinite;will-change: transform;}
.career-sec3 .item .wrap {display:flex; justify-content:flex-end; margin-top:-130px;}
.career-sec3 .item .wrap .col {width:50%; padding-left:20px;}
.career-sec3 .item .wrap .pic {margin-bottom:15px;}
.career-sec3 .item .wrap.type2 {justify-content:flex-start; margin-top:-500px;}
.career-sec3 .item .wrap.type2 .col {padding-left:0;}
.career-sec3 .item .wrap.type2 .pic {margin-left:-80px;}
.career-sec3 .item .wrap.type2 .text-box {margin-left:300px;}
.career-sec3 .item.ongoing {margin-top:95px;}
.career-sec3 .item.ongoing .imgs {text-align:center;}
.career-sec3 .item.ongoing .img-slide ul li .pic {width:180px; margin:0 auto;}
.career-sec3 .item.ongoing .img-slide.animation {animation: animateSymbolContainer2 20s linear infinite;will-change: transform;}
.career-sec3 .item.ongoing .on-wrap {display:flex; justify-content:flex-end;}

@keyframes animateSymbolContainer2 {
  from {
    transform: translate3d(-100%, 0px, 0px);
  }
  to {
    transform: translate3d(0, 0px, 0px);
  }
}

.career-sec4 .career-title {margin-bottom:-27px;}
.career-sec4 .career-title h2 {color:#0a47ac}
.career-sec4 .benefit-content {padding:40px 0 185px;background:#0a47ac url('../images/content/career_b_bg.jpg') 50% 100% repeat-x;}
.career-sec4 .top-txt {font-size:50px ;line-height:1.2em; color:#fff; letter-spacing:-.050em; margin-bottom:45px;}
.benefit-slider .slick-list {margin:0 -20px;}
.benefit-slider .slick-slide {padding:0 20px;}
.benefit-slider .item {background:#fff; border-radius:40px; padding:10px; overflow:hidden;}
.benefit-slider .box {padding:0 20px 30px;}
.benefit-slider .tit {font-size:30px; line-height:1.4em;font-weight:700; margin-bottom:5px;}
.benefit-slider .cnt {font-size:20px ;line-height:1.5em;}
.benefit-slider .slick-arrow {position:absolute; top:-80px; font-size:0; width:36px; height:36px; border-radius:100%; background-position:50% 50%; background-color:#fff; background-repeat:no-repeat; border:1px solid #e5e5e5; z-index:70;}
.benefit-slider .slick-prev {right:40px; background-image:url('../images/main/slide_prev.png');}
.benefit-slider .slick-next {right:0; background-image:url('../images/main/slide_next.png');}

.career-sec5 {padding-bottom:135px; overflow:hidden;}
.career-sec5 .contain {padding-top:145px;}
.career-sec5 .career-title h2 {color:#d23246;} 
.career-sec5 .pic {position:absolute; top:0; right:0; z-index:-1;}

.recruit-slider .slick-list {margin:0 -20px; overflow:visible}
.recruit-slider .slick-slide {padding:0 20px;}
.recruit-slider .box {width:413px; height:413px; color:#fff; text-align:center; border-radius:100%; background:#d23246; overflow:hidden; padding:20px;}
.recruit-slider .box.complete {background:#ccc}
.recruit-slider .box.complete .more {color:#ccc}
.recruit-slider .thumb {position:relative; padding-bottom:50%; margin-bottom:25px; border-radius: 50% / 100% 100% 0 0; overflow:hidden;}
.recruit-slider .thumb img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.recruit-slider .tit {font-size:30px ;line-height:1.3em;font-weight:700;}
.recruit-slider p {font-size:24px; line-height:1.4em; margin-bottom:10px;}
.recruit-slider .more {display:inline-block; width:180px; height:60px; background:#fff; font-size:24px; line-height:60px; color:#d23246; font-weight:500; border-radius:60px}
.recruit-slider .slick-dots {margin-top:20px; display:flex; justify-content:center; z-index:20}
.recruit-slider .slick-dots li {margin:0 4px; line-height:0;}
.recruit-slider .slick-dots li button {width:10px; height:10px; text-indent:-9999em; border:0; background:#666; opacity:.50; border-radius:100%; transition: all 0.2s ease-in-out;}
.recruit-slider .slick-dots li.slick-active button {width:30px; border-radius:10px; opacity:1;} 

.recruit-faq {padding-bottom:190px;}
.recruit-faq .career-title {margin-bottom:40px;}
.recruit-faq .career-title h2 {color:#000}
.recruit-faq ul {border-top:4px solid #000;}
.recruit-faq ul li {border-bottom:1px solid #e6e6e6; padding:40px 0;}
.recruit-faq ul li a {display:block; position:relative; padding:0 50px 0 90px;}
.recruit-faq ul li a .num {position:absolute; top:0; left:0; font-size:24px; line-height:1.4em; color:#999;}
.recruit-faq ul li a .tit {font-size:28px; line-height:1.4em; font-weight:400; letter-spacing:-.025em;}
.recruit-faq ul li a:after {content:""; position:absolute; top:50%; right:20px; transform:translateY(-75%) rotate(45deg); width:14px; height:14px; border-right:3px solid #262626; border-bottom:3px solid #262626;}
.recruit-faq ul li .content {display:none; padding:15px 50px 0 90px; font-size:20px;line-height:1.4em;}
.recruit-faq ul li.active a:after {transform:translateY(-35%) rotate(-135deg);}

.career-sec6 {position:relative; height:787px; text-align:center; background:url('../images/content/career_member_bg.jpg') 50% 50% no-repeat; background-size:cover; padding-top:105px; overflow:hidden;}
.career-sec6 .tit {font-size:80px; line-height:0.750em; font-weight:700; letter-spacing:-.050em;}
.career-sec6 .tit span {font-size:38px; font-weight:200;}
.career-sec6 .txt {position:absolute; bottom:-23px; left:0; width:100%; text-align:center; font-size:120px; line-height:1.1em; color:#fff;font-weight:700;}

.contact-container {background:#f8f8f8; padding:135px 0 110px; margin-bottom:100px;}
.contact-container .content-title {margin-bottom:20px;}
.contact-container .tt {font-size:50px;line-height:1.4em;}
.contact-container .num {position:relative; font-size:60px; line-height:1.3em; color:#d23246; font-weight:500; padding-top:15px;}
.contact-container .num:after {content:"";position:absolute; top:0; left:0; width:50px; height:2px; background:#d23246}

.contact-form .group {margin-bottom:70px;}
.contact-form .group h3 {margin-bottom:10px; font-size:40px; line-height:1.3em; letter-spacing:-.05em;}
.contact-form .group h3 .txt {font-size:22px; font-weight:300;letter-spacing:-.025em;}
.contact-form .group h3 .light {font-weight:300;}
.contact-form .group .opt-box {display:block; vertical-align:middle;}
.contact-form .group .opt-box label {display:inline-flex; align-items:center; justify-content:center; width:100%; height:60px; box-sizing:border-box; text-align:center; font-size:18px; line-height:1.4em; color:#000; background-color:#fff; background-position:50% 50%; background-repeat:no-repeat; border:1px solid #e5e5e5; cursor:pointer; overflow:hidden;}
.contact-form .group .opt-box input {display:none; position:absolute; top:0; left:0; width:0; height:0; border:0; opacity:0; z-index:-1;}
.contact-form .group .opt-box input:checked + label {border-color:#d23246; color:#fff; background-color:#d23246}
.contact-form .group .check-ul ul {display:flex; flex-wrap:wrap; margin:0 -7px -14px;}
.contact-form .group .check-ul ul li {width:25%; padding:0 7px; margin-bottom:14px;}
.contact-form .group .text-ul ul {display:flex; flex-wrap:wrap; margin:0 -7px -14px;}
.contact-form .group .text-ul ul li {width:50%; padding:0 7px; margin-bottom:14px;}
.contact-form .group .text-ul ul li.wide {width:100%}
.contact-form .group input.input {width:100%; height:60px; font-size:18px;}
.contact-form .group textarea.input {height:330px; font-size:18px;}
.contact-form .group.captcha_wrap {display:flex;}
#captcha_reload {width:60px; height:60px; border:1px solid #ddd; margin-right:-1px; outline:none; background:transparent;cursor:pointer; text-indent:-999px; overflow:hidden; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='32' height='32'%3E%3Cpath d='M12 4C9.4095 4 7.10606 5.23053 5.64274 7.14274L8 9.5H2V3.5L4.21863 5.71863C6.05061 3.452 8.85558 2 12 2 17.5228 2 22 6.47715 22 12H20C20 7.58172 16.4183 4 12 4ZM4 12C4 16.4183 7.58172 20 12 20 14.5905 20 16.894 18.7695 18.3573 16.8573L16 14.5 22 14.5V20.5L19.7814 18.2814C17.9494 20.548 15.1444 22 12 22 6.47715 22 2 17.5228 2 12H4Z' fill='rgba(121,121,121,1)'%3E%3C/path%3E%3C/svg%3E") center center no-repeat;}
.contact-form .group .captcha_img {width:20%; min-width:160px; border:1px solid #ddd; height:60px; overflow:hidden; text-align:center; margin-right:-1px;}
.contact-form .group .captcha_img img {height:calc(100% - 6px); width:auto; padding-top:3px;}
.contact-form .group .captcha_reload {}
.contact-form .group .captcha_input {width:100%; margin-left:14px;}



.filebox {display:flex;}
.filebox .upload-name {display:block;height: 60px; padding: 0 10px; font-size:18px; vertical-align: middle; border: 1px solid #e5e5e5; width:calc(100% - 170px); color: #999;}
.filebox label {
    display:flex;
	align-items:center; justify-content:center;
    padding: 10px 20px;
    color: #fff;
	width:160px;
	font-size:20px; line-height:1.4em;
    background-color: #666;
    cursor: pointer;
    height: 60px;
    margin-left: 10px;
}

.filebox input[type="file"] {
    position: absolute;
    width: 0;
    height: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
}

.form-agree {margin:0 0 50px;}
.form-agree h3 {font-size:24px; font-weight:300; letter-spacing:0; line-height:1.3em; margin-bottom:15px;}
.form-agree .scroll-box {padding:20px; font-size:18px; font-weight:300; line-height:1.5em; border:1px solid #e5e5e5;}
.form-agree .scroll-box .box {height:230px; overflow:auto; }
.form-agree .scroll-box .box::-webkit-scrollbar {width: 8px;}
.form-agree .scroll-box .box::-webkit-scrollbar-thumb {background-color: #ccc; border-radius:8px;}
.form-agree .scroll-box .box::-webkit-scrollbar-track {background-color: #fff;}
.form-agree .scroll-box .tit {margin-bottom:20px;}
.form-agree .scroll-box .cnt {margin-bottom:40px;}
.form-agree .scroll-box .cnt:last-child {margin-bottom:0;}
.form-agree .check {text-align:center; font-size:18px; line-height:1.5em; margin-top:20px;}

br.br-in-mobile { display:none;}
br.br-in-pc {display:block;}

#pop-success {width:auto; height:auto; background:#fff; border-radius:0.5em; padding:1em; text-align:center;}
#pop-success .title {font-size:2.5em; padding:1em;}
#pop-success .title span {font-size:0.5em; display:block; text-align:center; margin-top:0.5em;}
#pop-success img {width:100%; height:auto; max-width:50%; margin:0 auto; display:block; }
#pop-success a.go_home {position:relative; font-size:1.75em; display:inline-block; margin:0 auto; padding:0.75em 3em; color:#fff; background:#d23246; font-weight:300; margin-top:3em;}


/* 팝업레이어 */
#hd_pop {z-index:1000;position:relative;margin:0 auto;height:0}
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff}
.hd_pops img {max-width:100%}
.hd_pops_con {}
.hd_pops_footer {padding:0;background:#000;color:#fff;text-align:left;position:relative}
.hd_pops_footer:after {display:block;visibility:hidden;clear:both;content:""}
.hd_pops_footer button {padding:10px;border:0;color:#fff}
.hd_pops_footer .hd_pops_reject {background:#000;text-align:left}
.hd_pops_footer .hd_pops_close {background:#393939;position:absolute;top:0;right:0}