﻿@charset "utf-8";
/* 공통 -  탭 */ 
.tab_area {margin:10px auto 0}
.tab_area .tabs li {float:left;display:table;width:20%;height:58px;border-left:1px solid #fff;box-sizing:border-box;}
.tab_area .tabs li a {position: relative;display:table-cell;width:100%;padding:0;text-align:center;vertical-align:middle;font-size:18px;font-weight:500;color:#333;background:#efefef;letter-spacing:-0.9px;word-break:break-all}
.tab_area .tabs li:first-child{border-left: none}
.tab_area .tabs li a.active,
.tab_area .tabs li a:hover {background:#fe5e10;color:#fff}

/* 공통 - 상단영역 */ 
.busi_top_sec {margin-top:40px;}
.busi_top_sec:after {display:block;content:"";clear:both;}
.busi_top_sec .front {float:left;width:40%}
.busi_top_sec .rear {float:left;width:56%;margin-left:4%}
.busi_top_sec .top_img {display: block;width: 100%}
.busi_top_sec .top_txt_big {margin-top:8px;font-size:28px;line-height:38px;color:#333;font-weight:400;letter-spacing: -1px;word-break: keep-all;}
.busi_top_sec .top_subtit {display: block;margin-top:40px;font-size:18px;font-weight:600;color: #666;}
.busi_top_sec .top_desc {display: block;margin-top:6px;font-size:16px;line-height:26px;color:#666;letter-spacing: -1px;word-break:keep-all}
.busi_top_sec .btn_sample {position:relative;float:right;margin-top:40px;margin-right:20px;padding:14px 32px 14px 32px;color:#fff;font-weight: 500;background:#fe5e10;border:1px solid #fe5e10;border-radius:2px;letter-spacing: -1px}
.busi_top_sec a.btn_sample:active, 
.busi_top_sec a.btn_sample:hover {color:#fff;background: #ff4800;}

/* 공통 - 하단 견적 이동버튼 */ 
.btn_sec {float:left;margin:80px auto;text-align: center;width: 100%}
.btn_estimate {display:block;width:80%;max-width:260px;margin:0 auto;padding:16px 0;font-size: 18px;color:#fff;font-weight: 500;background: #ff712c;border-radius:2px}
a.btn_estimate:active,
a.btn_estimate:hover {background: #fe5401;}

/* 1  박스제작 */
.busi1_sec { margin-top:60px;}
.busi1_sec:after {display:block;content:"";clear:both;}
.busi1_sec .img_bx {float:left;width:100%;margin-top:40px}
.busi1_sec .img_bx .print_img {float:left;width:48%}
.busi1_sec .img_bx .print_img + .print_img {padding-left:4%}
.busi1_sec .img_bx_w {width:100%;padding:20px 0;text-align: center;background: #f5f5f5;}
.busi1_sec .print_img_w {width:100%;max-width:445px;margin:0 auto;text-align: center;}
.busi1_sec .txt_bx {float:left;width:100%;margin-top:20px}
.busi1_sec .txt_bx .print_tit {display:block;font-size:28px;color:#333;text-align:center;font-weight:500;letter-spacing: -1px;}
.busi1_sec .txt_bx .print_desc {width:96%;margin:0 auto;margin-top:20px;font-size:16px;line-height:26px;color:#666;font-weight:400;letter-spacing: -1px;word-break:keep-all}
.busi1_sec .txt_bx .print_desc b {color:#444;font-weight:500}
.busi1_sec .txt_bx .print_tit + .print_desc {margin-top:30px;}

/* 2 카톤 제작 */ 
.busi2_sec {float:left; width:100%;margin-top: 50px;}
.busi2_sec .busi2_tit {font-size:22px; color:#444;letter-spacing: -1px}
.busi2_sec .busi2_desc {margin-top:10px;font-size: 16px;line-height:24px;color:#666;letter-spacing: -1px}
.busi2_sec .busi2_img {width:100%;max-width: 540px;margin:30px 0 10px}

.busi2_sec .lst_hyphen {margin-top:12px;}
.busi2_sec .lst_hyphen li {position:relative; padding-left:10px;font-size:16px;line-height:24px; color:#666; text-align:left;word-break:keep-all;}
.busi2_sec  .lst_hyphen li:first-child {margin:0;}
.busi2_sec  .lst_hyphen li:before {display:block; position:absolute; top:0; left:0; content:"-";}

.busi2_sec .lst_process {margin-top: 20px;}
.busi2_sec .lst_process li {position:relative;float:left;width:calc(20% - 24px);height: 140px;margin-left:30px;background: #f1f1f1;text-align:center}
.busi2_sec .lst_process li:first-child {margin-left:0}
.busi2_sec .lst_process li:before {content: ''; position: absolute; width: 8px; height: 8px; display: block; top: 50%; left: -22px; margin-top: -4px; border-top: #cecece 2px solid; border-right: #cecece 2px solid; -webkit-transform: rotate(45deg); transform: rotate(45deg)}
.busi2_sec .lst_process li:first-child:before {display: none;}
.busi2_sec .lst_process li .ico { display: block;width:60%;margin:28px auto 0;max-width: 60px;height: auto;}
.busi2_sec .lst_process li .ico_txt {margin:12px 4px 0;color:#333;text-align:center;font-size:14px;font-weight:500;word-break: keep-all;}

.busi2_sec .lst_thickness {margin-top: 50px;}
.busi2_sec .lst_thickness li {float:left;width:calc(20% - 16px);height: 120px;margin-left:20px;text-align:left}
.busi2_sec .lst_thickness li:first-child {margin-left:0}
.busi2_sec .lst_thickness li .thick_txt {float: left;width:100%;margin:10px 0;color:#333;font-size:18px;font-weight:500;}
.busi2_sec .lst_thickness li .thick_detail {float: left;color:#666;font-size:15px;line-height: 19px;font-weight:400;letter-spacing: -0.9px;}
.busi2_sec .lst_thickness li .thick_detail + p {margin-left:6px}
.busi2_sec .lst_thickness li .thick_img { float:left;display: block;width:100%;margin:30px auto 0;max-width: 134px;height: auto;}

/*3  파우치 제작 */ 
.busi3_sec {float:left;width:100%;margin-top: 50px;}
.busi3_sec .busi3_img {float: left;width:38%;}
.busi3_sec .lst_bx {float:left;width:58%;margin-left:4%}
.busi3_sec .lst_bx .b_tit {display:block;margin:40px 0 14px;font-size:26px; font-weight:400;color:#333;}
.busi3_sec .lst_bx .b_lst_busi3 li {position:relative;padding-left:10px;font-size: 16px;line-height:26px;color:#444}
.busi3_sec .lst_bx .b_lst_busi3 li:before {display:block; position:absolute; top:0; left:0; content:"-";}

/* 4 라벨 튜브 */ 
.busi4_sec {float:left;margin-top:80px}
.busi4_sec .front {float:left;width:50%}
.busi4_sec .rear {float:left;width:50%}
.busi4_sec .front .la_main_img {width:100%;height:auto}
.busi4_sec .rear .la_main_txt {padding: 30px 10% ;font-size:32px;line-height:52px;color:#333}
.busi4_sec .rear .la_sub_txt {padding: 0 10%;font-size:16px;line-height:26px;color:#666}
.busi4_sec .rear em.la_sub_txt {font-weight:600;}
.busi4_sec .machine_tit {display:table;width:100%;margin:0 auto;vertical-align:middle}
.busi4_sec .machine_tit .m_logo {display:table-cell;height:auto;}
.busi4_sec .machine_tit .m_logo.logo_01 {width:6%;}
.busi4_sec .machine_tit .m_logo.logo_03 {width:8%;}
.busi4_sec .machine_tit .m_logo.logo_04 {width:12%;}
.busi4_sec .machine_tit .m_logo img {width:100%;}
.busi4_sec .machine_tit .m_tit {display: table-cell;vertical-align: middle;text-align: left;}
.busi4_sec .machine_tit .m_tit span {display: block;padding-left:12px;font-size: 28px;line-height: 28px;font-weight:500;color:#333;text-align: left;letter-spacing:-0.5px}
.busi4_sec .machine_img {width:100%;margin-top:48px}
.busi4_sec .machine_img img {width:100%;max-width: 100%;height: auto;}
.busi4_sec .product_lst {margin-top:40px}
.busi4_sec .product_lst .item {float:left;width:18.672%;margin-left:1.66%}
.busi4_sec .product_lst.four .item {width:23.75%;}
.busi4_sec .product_lst .item:first-child {margin-left:0}
.busi4_sec .product_lst .item img {width:100%;max-width: 100%;height: auto;}
.busi4_sec .product_lst .item .caption {margin-top:12px;font-size:15px;color:#999;text-align:left;}

/* 5 플랫폼 */ 
.busi_top_sec.busi5 .front {width:44%}
.busi_top_sec.busi5 .rear {width:52%;margin-left:4%}
.busi_top_sec .top_img  + img {margin-top:20px}
.busi_top_sec.busi5 .top_txt_big {font-size:22px;line-height:38px;}
.busi_top_sec.busi5 .top_txt_big + p {margin-top:10px}
.busi_top_sec.busi5 .btn_group {float: left;width:100%;margin-top: 30px;}
.busi_top_sec.busi5 .lst_group {float: left;width:calc(52% - 40px);margin-left:4%;margin-top: 40px;padding: 20px;background:#e9eefd;border-radius: 2px}
.busi_top_sec.busi5 .top_lstTit {display: block;font-size:18px;font-weight:600;color: #333;}
.busi_top_sec.busi5 .top_lst {float:left;margin-top: 10px;}
.busi_top_sec.busi5 .top_lst li {position:relative; padding-left:10px;font-size: 16px;line-height:26px;color:#444}
.busi_top_sec.busi5 .top_lst li:before {display:block; position:absolute; top:0; left:0; content:"-";}

.platform_sec {overflow: hidden;margin: 40px 0;}
.platform_sec .process_lst {float:left;width:100%;padding:8% 30px 5%;background:#f9f9f9;box-sizing:border-box}
.platform_sec .process_lst ul li {position:relative; float:left; display:inline-block;width:50%;}
.platform_sec .process_lst ul li:nth-child(n+3):nth-child(-n+5)  {width:100%;}
.platform_sec .process_lst ul li:nth-child(8)  {width:100%;height:120px}
.platform_sec .process_lst ul li .number {position:relative;width:10%;padding-bottom: 10%;margin:5% auto 0;}
.platform_sec .process_lst ul li:nth-child(-n+2) .number {margin:0 auto}
.platform_sec .process_lst ul li:nth-child(n+6) .number {margin:10% auto 0}
.platform_sec .process_lst ul li .number.type2 {width:5%;padding-bottom: 5%;}
.platform_sec .process_lst ul li .number span {position:absolute;width:100%;height:100%;background:#88abda;border-radius:50%;text-align:center;}
.platform_sec .process_lst ul li .number span b {position:absolute;top:calc(50% - 8px);left:calc(50% - 8px);width:16px;font-size:16px;color:#fff;}
.platform_sec .process_lst ul li .tit_area  {margin:20px auto 0;text-align:center;width: 100%;}
.platform_sec .process_lst ul li .tit_area .b_txt {font-size:22px;color:#333}
.platform_sec .process_lst ul li .tit_area .s_txt {margin-top:6px;font-size:18px;color:#999}
.platform_sec .process_lst ul li .img_area {width: 100%;margin-top:10px;text-align:center;}
.platform_sec .process_lst ul li .img_area.type2 {float:left;width: 50%;}
.platform_sec .process_lst ul li .img_area img {width:72%;max-width:380px}
.platform_sec .process_lst ul li .img_area img.long {max-width:740px}
canvas {position:absolute;right:0%;top:0;width: 100%;}
#line_05_out, #line_06_out, #line_07_out {top:-50%;} 


/* 1024 */
@media screen and (max-width:1024px){

/* 플랫폼 */ 
.platform_sec .process_lst ul li .number span b {top:calc(50% - 7px);left:calc(50% - 7px);width:14px;font-size:14px;}
.platform_sec .process_lst ul li .tit_area  {margin:14px auto 0;}
.platform_sec .process_lst ul li .tit_area .b_txt {font-size:19px;}
.platform_sec .process_lst ul li .tit_area .s_txt {margin-top:4px;font-size:17px}
.platform_sec .process_lst ul li .img_area {margin-top:8px;}

}

/* 태플릿용 */
@media screen and (max-width:768px){
	/* 탭 */ 
	.tab_area .tabs li {width:33.3333%;}
	.tab_area .tabs li:nth-child(4) {border-left:none;border-top:1px solid #fff;}
	.tab_area .tabs li:nth-child(5) {border-top:1px solid #fff;}
	.tab_area .tabs li a {font-size:16px;}
	
	/* 2 카톤 제작 */ 
	.busi2_sec .lst_thickness li .thick_detail {width:100%}
	.busi2_sec .lst_thickness li .thick_detail + p {margin-left:0}

	/* 4 라벨 튜브 */ 
	.busi4_sec {margin-top:52px}
	.busi4_sec .front {width:100%}
	.busi4_sec .rear {width:100%}
	.busi4_sec .rear .la_main_txt {padding: 30px 10%;font-size:26px;line-height:38px;text-align:center;word-break:keep-all}
	.busi4_sec .rear .la_sub_txt {padding: 0;font-size:16px;line-height:22px;}
	.busi4_sec .machine_tit .m_logo.logo_01 {width:8%;}
	.busi4_sec .machine_tit .m_logo.logo_03 {width:10%;}
	.busi4_sec .machine_tit .m_logo.logo_04 {width:14%;}
	.busi4_sec .machine_tit .m_tit span {padding-left:12px;font-size: 24px;line-height: 24px;}
	.busi4_sec .machine_img {margin-top:38px}	
	.busi4_sec .product_lst {margin-top:20px}
	.busi4_sec .product_lst .item {float:left;width:18.672%;margin-left:1.66%}
	.busi4_sec .product_lst.four .item {width:23.75%;}
	.busi4_sec .product_lst .item:first-child {margin-left:0}
	.busi4_sec .product_lst .item img {width:100%;max-width: 100%;height: auto;}
	.busi4_sec .product_lst .item .caption {margin-top:12px;font-size:15px;color:#999;text-align:left;}
	
	/* 5 플랫폼 */
	.busi_top_sec.busi5 .btn_group {margin-top: 0;}
	.busi_top_sec.busi5 .lst_group {width:calc(100% - 40px);margin-left:0%;}

	.platform_sec .process_lst ul li .number {width:12%;padding-bottom: 12%;}
	.platform_sec .process_lst ul li .number.type2 {width:6%;padding-bottom: 6%;}
	.platform_sec .process_lst ul li .number span b {top:calc(50% - 6px);left:calc(50% - 6px);width:12px;font-size:12px;}
	.platform_sec .process_lst ul li .tit_area  {margin:10px auto 0;}
	.platform_sec .process_lst ul li .tit_area .b_txt {font-size:17px;}
	.platform_sec .process_lst ul li .tit_area .s_txt {margin-top:4px;font-size:15px;}
	.platform_sec .process_lst ul li .img_area {margin-top:0;}
		
}

/* 모바일용 */
@media screen and (max-width:425px){
	/* 탭 */ 
	.tab_area .tabs li {height: 54px;}	

	/* 공통 - 상단영역 */ 
	.busi_top_sec .front {width:100%}
	.busi_top_sec .rear {width:100%;margin-left:0%;margin-top:20px}
	.busi_top_sec .top_img {height:220px;object-fit: cover;object-position:top;}
	.busi_top_sec .top_txt_big {font-size:26px;line-height:34px;}
	
	/* 공통 - 하단 견적 이동버튼 */ 
	.btn_sec {margin:40px auto 60px}

	/* 1  박스제작 */
	.busi1_sec .img_bx .print_img {width:100%}
	.busi1_sec .img_bx .print_img + .print_img {padding-left:0;margin-top:30px}
	.busi1_sec .txt_bx .print_tit {font-size:26px}
	.busi1_sec .txt_bx .print_desc {width:100%;}
	
	/* 2 카톤 제작 */ 
	.busi2_sec .lst_process li {width:calc(33.3333% - 20px);height: 110px;}
	.busi2_sec .lst_process li.line_2nd {margin-top:30px}
	.busi2_sec .lst_process li .ico {width:50%;margin:14px auto 0;max-width: 60px;}
	.busi2_sec .lst_process li .ico_txt {font-size:14px;}
	.busi2_sec .lst_thickness {margin-top: 0}
	.busi2_sec .lst_thickness li {width:calc(33.3333% - 10px);height: 120px;margin-left:15px;margin-top: 30px;}
	.busi2_sec .lst_thickness li:nth-child(4) {margin-left:0}
	.busi2_sec .lst_thickness li .thick_img { margin:10px auto 0;}

	/*3  파우치 제작 */ 
	.busi3_sec .busi3_img {width:100%;}
	.busi3_sec .lst_bx {width:100%;margin-left:0;}
	.busi3_sec .lst_bx .b_tit {margin:20px 0 14px;font-size:24px;}
	
	/* 4 라벨 튜브 */ 
	.busi4_sec .front {width:100%}
	.busi4_sec .rear {width:100%}
	.busi4_sec .rear .la_main_txt {padding: 30px 5%;font-size:18px;line-height:30px;}
	.busi4_sec .rear .la_sub_txt {font-size:12px;line-height:20px;}
	.busi4_sec .machine_tit .m_logo.logo_01 {width:10%;}
	.busi4_sec .machine_tit .m_logo.logo_03 {width:12%;}
	.busi4_sec .machine_tit .m_logo.logo_04 {width:16%;}
	.busi4_sec .machine_tit .m_tit span {padding-left:12px;font-size: 18px;line-height: 18px;}
	.busi4_sec .machine_img {margin-top:38px}	
	.busi4_sec .product_lst {margin-top:20px}
	.busi4_sec .product_lst .item {float:left;width:30%;margin-left:5%}
	.busi4_sec .product_lst.four .item {width:30%;}
	.busi4_sec .product_lst .item:nth-child(4) {margin-left:0}
	.busi4_sec .product_lst .item .caption {margin-top:8px;margin-bottom:8px;font-size:12px;}
	
	/* 5 플랫폼 */ 
	.busi_top_sec.busi5 .front {width:100%}
	.busi_top_sec.busi5 .rear {width:100%;margin-left:0}
	.busi_top_sec.busi5 .top_txt_big {font-size:18px;line-height:28px}
		
	.platform_sec .process_lst {padding: 0 10px}
	.platform_sec .process_lst ul li .number span b {top:calc(50% - 5px);left:calc(50% - 5px);width:10px;font-size:10px;}
	.platform_sec .process_lst ul li .tit_area  {margin:2px auto 0;}
	.platform_sec .process_lst ul li .tit_area .b_txt {font-size:11px;}
	.platform_sec .process_lst ul li .tit_area .s_txt {margin-top:2px;font-size:10px;}
		
	}

