@charset "utf-8";
/* *******************************************************
 * filename : content.css
 * description : 서브페이지 컨텐츠 CSS
 * date : 2018-01-16
******************************************************** */


/* ******************  포트폴리오 :: 리스트 ********************** */
.portfolio-list {margin:0 -0.65%;}
.portfolio-list-inner {float:left; width:32%; margin:0 0.65%;}
.portfolio-list-inner a {display:block;}

.portfolio-list-img {position:relative; width:100%; padding-top: 100%;}
.portfolio-list-img span {position:absolute; left:0; top:0; width:100%; height:100%;}
.portfolio-list-img span img {width:100%; height:100%;}

.portfolio-list-tit {text-align:center; margin-top: 15px; margin-bottom: 45px;}
.portfolio-list-tit p {font-size:17px; line-height: 30px; letter-spacing: -0.75px; color:#565656; font-weight: 300; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

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

@media all and (max-width:800px){
	.portfolio-list {margin:0 -0.5%;}
	.portfolio-list-inner {width:49%; margin:0 0.5%;}
	.portfolio-list-tit {margin-top: 8px; margin-bottom: 20px;}
	.portfolio-list-tit p {font-size:13px; line-height: 20px; }
}

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


/* ****************** 결제 :: 결제 ********************** */
.pay-list {margin:0 -1%;}
.pay-list-inner {float:left; width:23%; margin:0 1%; margin-bottom: 35px;}
.pay-list-inner a {display:block; position:relative; padding-top: 100%; background:url("../images/content/pay_bg.jpg") no-repeat; background-size:cover; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}

.pay-info {position:absolute; width:100%; height:100%; left:0; top:0;}
.pay-info-wrap {display:table; width:100%; height:100%;}
.pay-info-inner {display:table-cell; width:100%; height:100%; vertical-align: middle; text-align:center; border:1px solid #ddd;}

.pay-list-icon {width:87px; height:58px; display:inline-block; background:url("../images/icon/ic_pay.png") no-repeat; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
.pay-caption {margin-top: 10px; margin-bottom: 20px; font-size:17px; line-height: 30px; letter-spacing: 0.75px; color:#565656; font-weight: 300;  -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
.pay-name {margin-bottom: 10px; font-size:21px; line-height: 30px; letter-spacing: -0.75px; color:#565656; font-weight: 500;  -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
.pay-name span {color:#00bd80;  -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
.pay-txt {font-size:15px; line-height: 30px; letter-spacing: -0.75px; color:#a5a5a5; font-weight: 300;  -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}

.pay-list-inner a:hover {background: #08cd93; /* Old browsers */ background: -moz-linear-gradient(-45deg, #08cd93 0%, #592dac 100%); background: -webkit-linear-gradient(-45deg, #08cd93 0%,#592dac 100%); 
background: linear-gradient(135deg, #08cd93 0%,#592dac 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#08cd93', endColorstr='#592dac',GradientType=1 ); box-shadow:12px 12px 51px rgba(0, 0, 0, 0.28);}

.pay-list-inner a:hover .pay-info-inner {border-color:transparent;}

.pay-list-inner a:hover .pay-list-icon {background:url("../images/icon/ic_pay_on.png") no-repeat;}
.pay-list-inner a:hover .pay-caption, .pay-list-inner a:hover .pay-name, .pay-list-inner a:hover .pay-name span, .pay-list-inner a:hover .pay-txt {color:#fff;}


@media all and (max-width:1330px){
	.pay-list-inner {width:31.33%;}
}

@media all and (max-width:800px){
	.pay-list-inner {width:48%; margin-bottom: 15px;}
	.pay-list-icon {width:70px; height:47px; background-size:cover;}
	.pay-list-inner a:hover .pay-list-icon {background-size:cover;}
	.pay-caption {margin-top: 5px; margin-bottom: 10px; font-size:14px; line-height: 20px;}
	.pay-name {margin-bottom: 5px; font-size:17px; line-height: 22px;}
	.pay-txt {font-size:12px; line-height: 20px;}
}

@media all and (max-width:480px){
	.pay-list-icon {width:45px; height:30px; }
}

/* ******************  회사소개 :: 회사소개 ********************** */
.greeting-top {margin-bottom: 50px;}

.greeting-top .greeting-top-info {float:left; width:60%;}
.greeting-top .greeting-top-info h3 {position:relative; font-size:28px; line-height: 38px; letter-spacing: -0.8px; color:#333333; font-weight: 300; margin-bottom: 20px; padding-bottom: 20px; word-break:keep-all;}
.greeting-top .greeting-top-info h3::after {content:""; position:absolute; width:25px; height:1px; background-color:#3D3D3D; left:0; bottom:0;}
.greeting-top .greeting-top-info h3 span {color:#00cc8a; font-weight: 500;}
.greeting-top .greeting-top-info p {font-size:18px; line-height: 28px; letter-spacing: -0.65px; color:#565656; font-weight: 300; word-break:keep-all;}
.greeting-top .greeting-top-img {float:right; width:40%; text-align:center;}
.greeting-top .greeting-top-img img {max-width:100%;}

.greeting-table {margin-bottom: 85px;}
.greeting-table table {width:100%; border-top: 1px solid #3D3D3D;}
.greeting-table table th {padding:0 2%; font-size:15px; letter-spacing: -0.65px; color:#565656; font-weight: 500; text-align:left; height:50px; background-color:#F7F7F7; border-bottom: 1px solid #EAEAEA;}
.greeting-table table td {padding:0 2%; font-size:15px; line-height: 20px; letter-spacing: -0.65px; color:#565656; font-weight: 300; border-bottom: 1px solid #EAEAEA;}

.greeting-info {background:url("../images/content/greeting_img_2.jpg") no-repeat bottom right; background-size:contain; padding:40px 0; border-bottom: 4px solid #3D3D3D;}
.greeting-info h3 {font-size:42px; line-height: 52px; letter-spacing: -0.65px; color:#333333; font-weight: 300;}
.greeting-info h3 span {color:#04d28f;}
.greeting-info p {font-size:18px; line-height: 28px; letter-spacing: -0.65px; color:#565656; font-weight: 300; margin:35px 0;}

.greeting-info .greeting-ceo {padding-left: 15px; border-left: 1px solid #D1D1D1; }
.greeting-info .greeting-ceo p {font-size:18px; line-height: 23px; letter-spacing: -0.65px; color:#a2a1a1; font-weight: 300; margin-bottom: 10px;}
.greeting-info .greeting-ceo h4 {font-size:24px; line-height: 28px; letter-spacing: -0.65px; color:#565656; font-weight: 300;}
.greeting-info .greeting-ceo h4 span {color:#00cd8d;}
.greeting-info .greeting-ceo h4 em {color:#000000}

.greeting-info .greeting-m-img {display:none}

@media all and (max-width:1330px){
	.greeting-table {margin-bottom: 60px;}
}

@media all and (max-width:800px){
	.greeting-top {margin-bottom: 20px;}
	.greeting-top .greeting-top-info {float:none; width:100%;}
	.greeting-top .greeting-top-info h3 {font-size:19px; line-height: 24px; margin-bottom: 10px; padding-bottom: 10px;}
	.greeting-top .greeting-top-info h3::after {width:15px;}
	.greeting-top .greeting-top-info p {font-size:14px; line-height: 18px;}

	.greeting-top .greeting-top-img {float:none; width:100%; margin-bottom: 20px;} 

	.greeting-table {margin-bottom: 30px;}
	.greeting-table table th {font-size:12px; line-height: 18px; height:40px; word-break:keep-all;}
	.greeting-table table td {font-size:12px; line-height: 18px; }

	.greeting-info {padding:20px 0; background:none; padding-bottom: 0;}
	.greeting-info h3 {font-size:30px; line-height: 40px; word-break:keep-all;}
	.greeting-info p {font-size:14px; line-height: 20px; margin:15px 0; word-break:keep-all;}

	.greeting-info .greeting-ceo {padding-left: 8px;}
	.greeting-info .greeting-ceo p {font-size:14px; line-height: 20px; margin-bottom: 5px; word-break:keep-all;}
	.greeting-info .greeting-ceo h4 {font-size:18px; line-height: 22px; word-break:keep-all;}

	.greeting-info .greeting-m-img {display:block; text-align:center;}
	.greeting-info .greeting-m-img img {max-width:100%; display:inline-block;}
}

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




/* ******************  서비스 :: 공통 ********************** */
.service-top {height:845px; text-align:center; padding-top: 65px;}
.service-tit h3 {font-size:52px; line-height: 62px; letter-spacing: -0.65px; color:#444343; font-weight: 400; opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(-20px);
-moz-transform: translateY(-20px);
-ms-transform: translateY(-20px);
-o-transform: translateY(-20px);
transform: translateY(-20px); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s; transition-delay:0.1s}
.service-tit span {display:inline-block; padding:10px 35px; border-radius:20px; background-color:#3D3D3D; color:#ffffff; font-size:17px; letter-spacing: -0.75px; color:#fff; font-weight: 300; margin:25px 0; opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(-20px);
-moz-transform: translateY(-20px);
-ms-transform: translateY(-20px);
-o-transform: translateY(-20px);
transform: translateY(-20px); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s; transition-delay:0.3s}

.service-list {max-width:1200px; margin:0 auto; opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(-20px);
-moz-transform: translateY(-20px);
-ms-transform: translateY(-20px);
-o-transform: translateY(-20px);
transform: translateY(-20px); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s; transition-delay:0.5s}
.service-list li {float:left; width:16.66%;}

.service-list-wrap {width:80%; margin:0 auto; position:relative; padding-top: 80%; border-radius:50%; box-shadow:5px 5px 13px rgba(0, 0, 0, 0.18);}
.service-list-inner {position:absolute; width:100%; height:100%; left:0; top:0; text-align:center;}
.service-list-table {display:table; width:100%; height:100%;}
.service-list-cell {display:table-cell; width:100%; height:100%; vertical-align: middle;}
.service-list-cell p {font-size:17px; line-height: 30px; letter-spacing: -0.75px; color:#565656; font-weight: 300; margin-top: 5px;}

.service-process {padding-top: 100px; padding-bottom: 150px; background:url("../images/content/sub_process_bg.jpg") no-repeat center; background-size:cover;}
.service-process-tit {text-align:center;}
.service-process-tit h3 {font-size:52px; letter-spacing: -0.75px; color:#fff; font-weight: 400; opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(-20px);
-moz-transform: translateY(-20px);
-ms-transform: translateY(-20px);
-o-transform: translateY(-20px);
transform: translateY(-20px); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s; transition-delay:0.1s }
.service-process-tit p {font-size:17px; line-height: 28px; letter-spacing: -0.75px; color:#fff; font-weight: 300; margin-top:20px; margin-bottom: 30px; opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(-20px);
-moz-transform: translateY(-20px);
-ms-transform: translateY(-20px);
-o-transform: translateY(-20px);
transform: translateY(-20px); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s; transition-delay:0.3s}
.service-process-list-inner {float:left; width:32%; margin-left: 2%; opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(-20px);
-moz-transform: translateY(-20px);
-ms-transform: translateY(-20px);
-o-transform: translateY(-20px);
transform: translateY(-20px); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s; }
.service-process-list-inner:first-child {margin-left: 0; transition-delay:0.5s}
.service-process-list-inner:nth-child(2) {transition-delay:0.7s}
.service-process-list-inner:last-child {transition-delay:0.9s}

.service-process-list-inner.list1 h4 {background:#23C589}
.service-process-list-inner.list1 h4::after {content:""; position:absolute; z-index:5; width:165px; height:16px; background:url("../images/content/process_step1_bg.png") no-repeat; right:4%; bottom:0;}
.service-process-list-inner.list2 h4 {background:#41719D}
.service-process-list-inner.list2 h4::after {content:""; position:absolute; z-index:5; width:165px; height:16px; background:url("../images/content/process_step2_bg.png") no-repeat; right:4%; bottom:0;}
.service-process-list-inner.list3 h4 {background:#592FAD}
.service-process-list-inner.list3 h4::after {content:""; position:absolute; z-index:5; width:165px; height:16px; background:url("../images/content/process_step3_bg.png") no-repeat; right:4%; bottom:0;}

.service-process-list-inner h4 {position:relative; z-index:2; border-radius:10px 10px 0 0; padding:0 10%; font-size:30px; color:#fff; font-weight: 500; line-height: 60px;}
.service-process-list-inner h4::before {content:""; position:absolute; width:64%; height:1px; background-color:rgba(255, 255, 255, 0.2); right:0; top:50%; z-index:5;}
.service-process-list-inner h4 img {position:absolute; right:7%; top:-20px; z-index:10;}

.service-process-info {background:#fff; border-radius:0 0 10px 10px; background-color:#fff; padding:0 10%; padding-top: 25px; padding-bottom: 20px; text-align:center;}
.service-process-cell > p {font-size:17px; line-height: 28px; letter-spacing: -0.75px; color:#616161; font-weight: 300;}
.service-process-cell > p span {color:#d60000;}

.service-process-table {display:table; width:100%; height:140px;}
.service-process-cell {display:table-cell; width:100%; height:100%; vertical-align: middle;}


/* 블로그 :: 프로세스 박스 높이 맞추기 */
.process-height{display:flex; flex-wrap:wrap}
.process-height .service-process-info{height:calc(100% - 60px); box-sizing:border-box}
@media all and (max-width:800px){	
	.process-height .service-process-info{height:auto}
}


.service-effect {padding:100px 0; background-color:#F2F2F2}
.service-effect-tit {text-align:center;}
.service-effect-tit h3 {font-size:52px; line-height: 62px; letter-spacing: -0.65px; color:#444343; font-weight: 400; opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(-20px);
-moz-transform: translateY(-20px);
-ms-transform: translateY(-20px);
-o-transform: translateY(-20px);
transform: translateY(-20px); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s; transition-delay:0.1s}
.service-effect-tit p {font-size:18px; line-height: 28px; letter-spacing: -0.65px; color:#444343; font-weight: 300; margin:20px 0; opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(-20px);
-moz-transform: translateY(-20px);
-ms-transform: translateY(-20px);
-o-transform: translateY(-20px);
transform: translateY(-20px); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s; transition-delay:0.3s}

.service-effect-list {padding:80px 0; opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateX(20px);
-moz-transform: translateX(20px);
-ms-transform: translateX(20px);
-o-transform: translateX(20px);
transform: translateX(20px); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s; transition-delay:0.5s}

.service-effect-list li {margin-top: 80px; opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateX(-20px);
-moz-transform: translateX(-20px);
-ms-transform: translateX(-20px);
-o-transform: translateX(-20px);
transform: translateX(-20px); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s; }
.service-effect-list li:first-child {margin-top: 0; transition-delay:0.7s}

.service-effect-list li:nth-child(2) {transition-delay:0.8s}
.service-effect-list li:nth-child(3) {transition-delay:0.9s}
.service-effect-list li:nth-child(4) {transition-delay:1.0s}
.service-effect-list li:last-child {transition-delay:1.1s}


.service-effect-list dl {display:table; width:100%; max-width:550px;}
.service-effect-list dt {display:table-cell; vertical-align: middle; width:18%; text-align:right;}
.service-effect-list .num{display:inline-block; width:60px; height:60px; border-radius:50%; text-align:center; line-height: 60px; font-size:30px; font-weight: 600; color:#fff; background-color:#24C18A;}
.service-effect-list dd {display:table-cell; vertical-align: middle; padding-left: 2%;}
.service-effect-list dd img {display:inline-block; vertical-align: middle;}
.service-effect-list dd p {display:inline-block; vertical-align: middle; font-size:17px; line-height: 30px; letter-spacing: -0.65px; color:#757575; font-weight: 300; margin-left: 3%;}

.service-effect-m-img {display:none;}

.service-banner {background: #08cd93; /* Old browsers */ background: -moz-linear-gradient(-45deg, #08cd93 0%, #592dac 100%); background: -webkit-linear-gradient(-45deg, #08cd93 0%,#592dac 100%); 
background: linear-gradient(135deg, #08cd93 0%,#592dac 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#08cd93', endColorstr='#592dac',GradientType=1 ); padding:45px 0;}

.service-banner-wrap {display:table; width:100%; max-width:600px; margin:0 auto;}
.service-banner-tit {display:table-cell; vertical-align: middle;}
.service-banner-tit img {display:inline-block; vertical-align: middle; margin-right:15px;}

.service-banner-txt {display:inline-block; vertical-align: middle;}
.service-banner-txt p {font-size:22px; line-height: 30px; letter-spacing: -0.65px; color:#fff; font-weight: 300;}
.service-banner-txt h3 {font-size:42px; line-height: 48px; letter-spacing: -0.65px; color:#fff; font-weight: 300;}

.service-banner-link {display:table-cell; vertical-align: middle; width:40%; text-align:right;}
.service-banner-link a {display:inline-block; width:100%; max-width:230px; height:65px; line-height: 65px; text-align:center; border:1px solid #fff; font-size:18px; letter-spacing: -0.65px; color:#fff; font-weight: 300;}
.service-banner-link a span {display:inline-block; margin-left: 15px;}



/* 스크롤 효과 */

.service-bx {opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(-20px);
-moz-transform: translateY(-20px);
-ms-transform: translateY(-20px);
-o-transform: translateY(-20px);
transform: translateY(-20px); -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;}






.service-bx.active {opacity:1;filter:Alpha(opacity=100); -webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);}

.service-bx.active .service-tit h3, .service-bx.active .service-tit span, .service-bx.active .service-list {opacity:1;filter:Alpha(opacity=100); -webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);}

.service-bx.active .service-process-tit h3 , .service-bx.active .service-process-tit p, .service-bx.active .service-process-list-inner {opacity:1;filter:Alpha(opacity=100); -webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);}


.service-bx.active .service-effect-tit h3, .service-bx.active .service-effect-tit p {opacity:1;filter:Alpha(opacity=100); -webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);}


.service-bx.active .service-effect-list, .service-bx.active .service-effect-list li {opacity:1;filter:Alpha(opacity=100); -webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);}


@media all and (max-width:1330px){
	.service-process {padding-top: 70px; padding-bottom: 105px;}

	.service-effect {padding:70px 0;}
	.service-effect-list {padding:56px 0;}
	.service-effect-list li {margin-top: 56px;}
}

@media all and (max-width:800px){
	.service-process {padding-top: 30px; padding-bottom: 50px;}

	.service-top {height:455px; padding-top: 30px;}

	.service-tit h3 {font-size:32px; line-height: 40px;}
	.service-tit span {padding:5px 15px; font-size:14px; margin:10px 0;}

	.service-list {max-width:510px;}
	.service-list li {float:none; display:inline-block; width:30%; margin:5px 0;}
	.service-list-wrap {background-color:#fff;}
	.service-list-cell p {font-size:14px; line-height: 20px;}

	.service-process-list-inner {float:none; width:51.25%; margin:0 auto; margin-top: 10px;}
	.service-process-list-inner:first-child {margin-left:auto; margin-top: 0;}

	.service-process-tit h3 {font-size:32px; line-height: 40px;}
	.service-process-tit p {font-size:14px; line-height: 20px; margin-top: 10px; margin-bottom: 15px;}

	.service-process-list-inner h4 {font-size:21px; line-height: 45px;}
	.service-process-info {padding-top: 15px; padding-bottom: 10px;}
	.service-process-table {height:100px;}
	.service-process-cell > p {font-size:14px; line-height: 20px; }

	.service-effect {padding:30px 0;}

	.service-effect-tit h3 {font-size:32px; line-height: 40px;}
	.service-effect-tit p {font-size:14px; line-height: 20px; margin:10px 0;}

	.service-effect-list {padding:0; padding-top: 20px;}
	.service-effect-list li {margin-top: 20px;}
	.service-effect-list dl {max-width:none;}
	.service-effect-list dd {overflow:hidden;}
	.service-effect-list dd img {width:15%; max-width:100%;}
	.service-effect-list dd p {width:70%; font-size:14px; line-height: 20px; word-break:keep-all;}
	.service-effect-list .num {width:45px; height:45px; line-height: 45px; font-size:21px;}

	.service-effect-m-img {display:block; margin-top: 20px;}
	.service-effect-m-img img {max-width:100%; margin:0 auto;}


	.service-banner {padding:20px 0;}
	.service-banner-wrap {display:block; }
	.service-banner-tit {display:block; text-align:Center; margin-bottom: 15px;}
	.service-banner-tit img {max-width:65px;}

	.service-banner-txt p {font-size:18px; line-height: 24px; }
	.service-banner-txt h3 {font-size:28px; line-height: 35px;}

	.service-banner-link {display:block; margin:0 auto;}
	.service-banner-link a {height:45px; line-height: 45px; font-size:14px; min-width:150px;}
}

@media all and (max-width:480px){
	.service-top {height:auto; padding-bottom: 80px;}
	.service-list li  {width:48%;}

	.service-process-list-inner {width:75%;}
}

/* ******************  서비스 :: 블로그 ********************** */

.blog-content .service-top {background:url("../images/content/blog_top_bg.png") no-repeat center bottom;}
.blog-content .service-process-table {height:128px;}

.service-process-number {border-radius:20px; padding:5px 0; text-align:center; font-size:24px; line-height: 30px; color:#fff; font-weight: 500; margin-top: 10px;}

.service-process-list-inner.list1 .service-process-number {background:#23C589}
.service-process-list-inner.list2 .service-process-number {background:#41719D}
.service-process-list-inner.list3 .service-process-number {background:#592FAD}

.blog-content .service-effect-list {padding:0; background:url("../images/content/blog_effect_bg.png") no-repeat center right;  }
.blog-content .service-effect-list li {margin-top: 45px;}

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

@media all and (max-width:800px){
	.blog-content .service-top {background-size:contain;}

	.service-process-number {font-size:18px; margin-top: 5px; line-height: 23px;}

	.blog-content .service-effect-list {background:none;}
}

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

/* ******************  서비스 :: 페이스북&인스타그램 ********************** */
.facebook-content .service-banner-wrap {max-width:720px;}
.facebook-content .service-top {background:url("../images/content/facebook_top_bg.png") no-repeat center bottom;}

.facebook-content .service-effect-list {background:url("../images/content/facebook_effect_bg.png") no-repeat center right; }

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

@media all and (max-width:800px){
	.facebook-content .service-top {background-size:contain;}

	.facebook-content .service-effect-list {background:none;}
}

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

/* ******************  서비스 :: 유튜브 ********************** */
.youtube-content .service-top {background:url("../images/content/youtube_top_bg.png") no-repeat center bottom;}

.youtube-content .service-effect-list {background:url("../images/content/youtube_effect_bg.png") no-repeat center right;  }

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

@media all and (max-width:800px){
	.youtube-content .service-top {background-size:contain;}

	.youtube-content .service-effect-list {background:none;}
}

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

/* ******************  서비스 :: IMC ********************** */
.imc-content .service-top {background:url("../images/content/imc_top_bg.png") no-repeat center bottom;}

.imc-content .service-effect-list {background:url("../images/content/imc_effect_bg.png") no-repeat center right; }

.imc-content .service-process {padding-bottom: 70px;}

.imc-process-list li {float:left; position:relative; padding-top: 15.83%; width:15.83%; margin-left: 1%; text-align:center;}
.imc-process-list li:first-child {margin-left: 0;}

.imc-process-wrap {position:absolute; width:100%; height:80%; padding-top: 20%; left:0; top:0; border:1px solid #fff; border-radius:10px;}

.imc-process-list li p {display:table; width:100%; height:48px; margin-top: 30px;}
.imc-process-list li p span {display:table-cell; width:100%; height:100%; vertical-align: middle; font-size:17px; line-height: 24px; letter-spacing: -0.75px; color:#fff; font-weight: 300;}

.process-sub-txt {text-align:center; font-size:24px; line-height: 36px; letter-spacing: -0.75px; color:#fff; font-weight: 300; margin-top: 40px;}

.imc-process-list li.active .imc-process-wrap {border-color:transparent; background: #08cd93; /* Old browsers */
background: -moz-linear-gradient(45deg, #08cd93 0%, #592dac 100%);  background: -webkit-linear-gradient(45deg, #08cd93 0%,#592dac 100%); background: linear-gradient(45deg, #08cd93 0%,#592dac 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#08cd93', endColorstr='#592dac',GradientType=1 );}

@media all and (max-width:1330px){
	.imc-content .service-effect-list {background-size:60% auto;}

	.imc-process-list ul {max-width:900px; margin:0 auto;}
	.imc-process-list li {width: 32%; margin:0 0.5%; padding-top: 32%; margin-bottom: 10px;}
	.imc-process-list li:first-child {margin-left: 0.5%;}
}

@media all and (max-width:800px){
	.imc-content .service-top {background-size:contain;}

	.imc-content .service-effect-list {background:none;}

	.imc-process-list li p {height:40px; margin-top: 15px;}
	.imc-process-list li p span {font-size:14px; line-height: 20px; }

	.process-sub-txt {font-size:18px; line-height: 24px; margin-top: 20px; word-break:keep-all;}
}

@media all and (max-width:480px){
	.imc-process-list li {width:49%; padding-top: 49%;}
}


