@charset "utf-8";

/* 
 * content CSS Document
 * KOWEB
 */

#content.sub {padding:120px 0;}
.sub_title {margin-bottom:80px;}
.sub_title h2 {text-align:center; font-size:35px; font-weight:600; text-transform:uppercase; font-family: 'NanumBarunGothic', sans-serif;}

/* 서브비쥬얼 */
.area_subVisual {position:relative; height:580px; padding-top:100px;}
.area_subVisual .inr {display:table; width:1400px; height:100%;}
.area_subVisual h2 {display:table-cell; vertical-align:middle; font-size:60px; font-weight:1000; color:#fff; text-shadow:5px 0 10px rgba(0, 0, 0, .2); text-transform:uppercase}

.area_subVisual.company {background:url(../images/common/sub_visual01.jpg) no-repeat center; background-size:cover;}
.area_subVisual.product {background:url(../images/common/sub_visual02.jpg) no-repeat center; background-size:cover;}
.area_subVisual.location {background:url(../images/common/sub_visual03.jpg) no-repeat center; background-size:cover;}


/* lnb */
.area_lnb {height:60px; border-bottom:1px solid #e1e1e1; background:#fff}
.area_lnb .inr {height:100%;}
.area_lnb .inr:after {clear:both; content:''; display:block;}
.area_lnb .inr > * {float:left;}
.area_lnb .home {display:block; width:60px; height:100%; border-left:1px solid #e1e1e1; border-right:1px solid #e1e1e1; background:#f5f5f5 url(../images/common/i_home.png) no-repeat center}
.area_lnb .title {display:inline-block; padding:0 30px; padding-right:120px; line-height:59px; background:url(../images/common/lnb_1depth.png) no-repeat right 30px center; text-transform:uppercase}
.area_lnb .lnb {position:relative;}
.area_lnb .lnb:hover ul {display:block;}
.area_lnb .lnb .sub {display:inline-block; padding:0 30px; padding-right:120px; line-height:59px; background:url(../images/common/lnb_2depth.png) no-repeat right 30px center; border-left:1px solid #e1e1e1; border-right:1px solid #e1e1e1; }
.area_lnb .lnb > ul {display:none; position:absolute; left:0; width:100%; background:#f5f5f5; box-shadow:1px 1px 3px rgba(0, 0, 0, .1); z-index:999}
.area_lnb .lnb > ul li.hidden {display:none;}
.area_lnb .lnb > ul li+li {border-top:1px dashed #eaeaea}
.area_lnb .lnb > ul li a {display:block; padding:15px 30px; font-size:15px; font-weight:300;}



/* 인사말 */
.intro dl dd+dd {margin-top:30px}

.intro .ss01 .img img {max-width:100%;}
.intro .ss01 dl {margin-top:50px; font-weight:300; font-size:18px; text-align:center; line-height:1.7}
.intro .ss01 dl dd:last-child {margin-top:60px; font-weight:400;}

.intro .ss02 {margin-top:100px; padding:50px; background:#fafafa; }
.intro .ss02 dl {font-weight:200; font-size:18px; color:#666; text-align:center; line-height:1.7}


/* 연혁 */
.history ul {position:relative;}
.history ul:before {position:absolute; left:560px; top:40px; content:''; display:inline-block; width:1px; height:calc(100% - 80px); background:#dfdfdf;}
.history ul li {padding-bottom:100px;}
.history ul li:last-child {padding-bottom:0}
.history ul li:after {clear:both; content:''; display:block;}
.history ul li .year {position:relative; float:left; width:560px; padding-right:150px; font-size:75px; font-weight:1000; line-height:1; text-align:right; color:#dfdfdf; font-style:italic}
.history ul li .year:before {position:absolute; right:0; top:0; content:''; display:inline-block; width:80px; height:80px; border-radius:100%; border:1px solid #dfdfdf; background:rgba(255, 255, 255, .7); transform:translateX(50%)}
.history ul li .year:after {position:absolute; right:0; top:50%; content:''; display:inline-block; width:10px; height:10px; margin-top:-2px; border-radius:100%; background:#666;transform:translateX(50%)}
.history ul li > div {float:left; width:calc(100% - 560px); padding-top:10px; padding-left:150px;}
.history ul li dl dt {padding-bottom:5px; font-size:18px; font-weight:600; color:#da0071}
.history ul li dl dd {font-weight:300}
.history ul li dl dd+dd {margin-top:10px}
.history ul li dl dd p {display:block; padding-top:3px; color:#888; word-break:break-word;}
.history ul li dl + dl {margin-top:30px;} 



/* location */
.location .ss01 .root_daum_roughmap {width:100%;}
.location .ss01 .hide {display:none;}
.location .ss01 .root_daum_roughmap_landing .border2 {display:block;}

.location .ss02 {padding:50px 0 0; margin-top:10px; color:#fff; background:linear-gradient(145deg, #424242, #2a2b2d)}
.location .ss02 dl dt {margin-bottom:10px; padding-left:30px; font-size:18px; font-weight:700;}
.location .ss02 dl dd {font-size:18px; font-weight:400; line-height:1.7}
.location .ss02 dl dd a {position:relative; display:inline-block; color:#fff; transition:all .3s}
.location .ss02 dl dd a:hover:after {position:absolute; left:0; bottom:-1px; content:''; display:inline-block; width:100%; height:1px; background:#fff;}
.location .ss02 dl dd.eng {font-size:16px; font-weight:300; opacity:.5}

.location .ss02 .address {padding:0 80px;}
.location .ss02 .address:after {clear:both; content:''; display:block}
.location .ss02 .address dt {float:left; width:15%; background:url(../images/content/location/i_address.png) no-repeat left top 2px}
.location .ss02 .address dd {float:right; width:85%;}
.location .ss02 ul {margin-top:50px; padding:50px 80px; background:rgba(255, 255, 255, .1)}
.location .ss02 ul:after {clear:both; content:''; display:block}
.location .ss02 ul li {position:relative; float:left; width:33.33%; padding:0 50px;}
.location .ss02 ul li+li:before {position:absolute; left:0; top:50%; content:''; display:inline-block; width:1px; height:80px; background:rgba(255, 255, 255, .2); transform:translateY(-50%)}
.location .ss02 ul li:nth-child(1) {padding-left:0}
.location .ss02 ul li:nth-child(1) dt {background:url(../images/content/location/i_call.png) no-repeat left center;}
.location .ss02 ul li:nth-child(2) dt {background:url(../images/content/location/i_fax.png) no-repeat left center;}
.location .ss02 ul li:nth-child(3) dt {background:url(../images/content/location/i_mail.png) no-repeat left center;}


/* product_list */
.product_list .tab_menu_wrap {text-align:center; margin-bottom:50px}
.product_list .tab_menu:after {clear:both; content:''; display:block;}
.product_list .tab_menu li {position:relative; float:left; width:33.33%; padding:0 15px 15px; cursor:pointer}
.product_list .tab_menu li:after {position:absolute; left:0; bottom:0; content:''; display:inline-block; width:100%; height:2px; background:#e1e1e1; transition:all .3s}
.product_list .tab_menu li.active:after {background:#da0071}
.product_list .tab_menu li a {display:inline-block; padding:0 30px; font-size:18px; font-weight:500;}

.product_list .tab_content ul:after {clear:both; content:''; display:block;}
.product_list .tab_content ul li {float:left; width:calc((100% - 160px)/5); margin-bottom:25px;}
.product_list .tab_content ul li+li {margin-left:40px}
.product_list .tab_content ul li:nth-child(5n+1) {margin-left:0}
.product_list .tab_content ul li .img {height:250px; overflow:hidden; border:1px solid #e1e1e1; background:#fff}
.product_list .tab_content ul li img {height:100%; margin-left:50%; transform:translateX(-50%)}
.product_list .tab_content ul li .pd_name {position:relative; margin-top:20px;}
.product_list .tab_content ul li .pd_name p {min-height:50px; padding-right:30px; font-weight:600; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-family: 'NanumBarunGothic', sans-serif;}
.product_list .tab_content ul li .pd_name i {position:absolute; right:0; top:0; width:20px; height:20px; background:#222 url(../images/content/product/i_plus.png) no-repeat center; transition:all .3s}
.product_list .tab_content ul li a:hover .pd_name i {background:#da0071 url(../images/content/product/i_plus.png) no-repeat center;}


/* product_view */
.product_view .pd_title {padding-bottom:15px; margin-bottom:50px; font-size:24px; font-weight:600; color:#da0071; border-bottom:2px solid #e1e1e1}
.product_view .pd_info:after {clear:both; content:''; display:block;}
.product_view .pd_info > div {float:left; width:calc((100% - 30px)/2); margin-bottom:80px;}
.product_view .pd_info .info_img {border:1px solid #e1e1e1; overflow:hidden;}
.product_view .pd_info .info_img img {max-width:100%; min-width:685px;}
.product_view .pd_info .info_text {min-height:400px; margin-left:30px; padding:60px 60px; background:#f5f5f5}
.product_view .pd_info .info_text dl:after {clear:both; content:''; display:block;}
.product_view .pd_info .info_text dl + dl {margin-top:30px;}
.product_view .pd_info .info_text dl dt {position:relative; float:left; width:20%; padding-left:15px; font-weight:600}
.product_view .pd_info .info_text dl dt:before {position:absolute; left:0; top:50%; content:''; display:inline-block; width:3px; height:3px; background:#222; transform:translateY(-50%)}
.product_view .pd_info .info_text dl dd {float:right; width:80%; padding-left:15px;}
.product_view .pd_info .info_text dl dd.eng {font-size:15px; font-weight:100; color:#888;}
.product_view .pd_info .info_text dl dd+dd {margin-top:5px;}
.product_view .pd_info > div.pd_table {margin-bottom:0; width:100%;}
.product_view .pd_info .table_alert{display:none;}


.product_table{width:100%; border:1px solid #eaeaea;}
.product_table thead th {background:#222222; font-weight:700; color:#fff; text-align:center; padding:15px; border-right:1px solid #eaeaea;}
.product_table tbody th {font-weight:700; color:#000; text-align:center; padding:15px; border-bottom:1px solid #eaeaea; background:#fafafa; border-right:1px solid #eaeaea;}
.product_table tbody td {font-weight:400; color:#000; text-align:center; padding:15px; border-bottom:1px solid #eaeaea; border-right:1px solid #eaeaea;}


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

	.inr {width:100%; padding:0 50px;}

	.area_subVisual .inr {width:100%; padding:0 50px;}

	.area_lnb .inr {width:100%; padding:0}


	/* 연혁 */
	.history ul:before {left:30%}
	.history ul li .year {width:30%;}
	.history ul li > div {width:70%;}



}

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

	.inr {width:100%; padding:0 30px;}
	#content.sub {padding:100px 0}
	.sub_title {margin-bottom:50px;}
	.sub_title h2 {font-size:30px;}

	/* area_Visual */
	.area_subVisual {padding-top:80px; height:450px}
	.area_subVisual .inr {width:100%; padding:0 30px;}
	.area_subVisual h2 {font-size:50px}

	/* lnb */
	.area_lnb .inr {width:100%; padding:0}

	/* intro */
	.intro dl dd+dd {margin-top:20px;}

	.intro .ss01 dl {margin-top:40px; font-size:16px;}
	.intro .ss01 dl dd:last-child {margin-top:40px;}
	.intro .ss02 {margin-top:50px}
	.intro .ss02 dl {font-size:16px;}
	.intro .ss02 dl br {display:none;}


	/* history */
	.history ul:before {left:30px; top:30px; height:97.3%;}
	.history ul li {padding-bottom:100px;}
	.history ul li .year:before {left:0; right:auto; width:60px; height:60px; transform:none;}
	.history ul li .year:after {left:0; right:auto; width:8px; height:8px; margin-left:23px; margin-top:0}
	.history ul li .year {float:none; width:100%; font-size:55px; text-align:left; padding-left:100px; padding-right:0}
	.history ul li > div {float:none; width:100%; padding-top:30px; padding-left:100px;}


	/* location */
	.location .ss01 .root_daum_roughmap .wrap_map {height:470px !important}
	.location .ss02 .address {padding:0 50px;}
	.location .ss02 .address dt {width:20%;}
	.location .ss02 .address dd {width:80%;}
	.location .ss02 ul {padding:0;}
	.location .ss02 ul li {width:100%; padding: 50px;}
	.location .ss02 ul li:nth-child(1) {padding-left:50px;}
	.location .ss02 ul li+li:before {top:0; width:100%; height:1px; transform:normal;}
	.location .ss02 ul dl:after {clear:both; content:''; display:block}
	.location .ss02 ul dl dt {float:left; width:20%;}
	.location .ss02 ul dl dd {float:left; width:80%;}


	/* product_list */
	.product_list .tab_content ul li {width:calc((100% - 60px)/3);}
	.product_list .tab_content ul li+li {margin-left:30px}
	.product_list .tab_content ul li:nth-child(1) {margin-left:0 !important}
	.product_list .tab_content ul li:nth-child(3n+1) {margin-left:0}
	.product_list .tab_content ul li:nth-child(5n+1) {margin-left:30px;}


	/* product_view */
	.product_view .pd_info > div {float:none; width:100%; margin-bottom:0}
	.product_view .pd_info .info_img {margin-bottom:20px; text-align:center; background:#f5f5f5}
	.product_view .pd_info .info_text {min-height:auto; margin-left:0; padding:50px;}
	.product_view .pd_table {margin-top:20px;}




}

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

	.inr {padding:0 20px;}

	#content.sub {padding:80px 0;}

	.sub_title h2 {font-size:27px;}

	.area_subVisual {height:380px;}
	.area_subVisual .inr {padding:0 20px}
	.area_subVisual h2 {font-size:42px;}

	.area_lnb {height:55px;}
	.area_lnb .home {width:55px;}
	.area_lnb .title {width:calc((100% - 55px)/2); padding:0 20px; padding-right:70px; line-height:54px; background-position:right 20px center !important}
	.area_lnb .lnb {width:calc((100% - 55px)/2);}
	.area_lnb .lnb .sub {width:100%; padding:0 20px; padding-right:70px; line-height:54px; border-right:none; background-position:right 20px center !important}
	.area_lnb .lnb > ul {top:55px;}

	/* intro */
	.intro .ss01 .img {height:200px; background:url(../images/content/company/intro_img.jpg) no-repeat center; background-size:cover;}
	.intro .ss01 .img img {display:none;}
	.intro .ss01 dl {margin-top:30px; font-size:14px;}
	.intro .ss01 dl br {display:none;}
	.intro .ss02 {padding:30px;}
	.intro .ss02 dl {font-size:14px;}


	/* history */
	.history ul:before {left:26px; top:25px;}
	.history ul li {padding-bottom:80px;}
	.history ul li .year:before {width:50px; height:50px;}
	.history ul li .year:after {left:22px; top:23px; width:5px; height:5px; margin:0 !important;}
	.history ul li .year {font-size:40px; line-height:50px;}
	.history ul li > div {padding-top:20px;}
	.history ul li dl dt {font-size:16px;}
	.history ul li dl + dl {margin-top:20px;}


	/* location */
	.location .ss01 .root_daum_roughmap .wrap_map {height:300px !important}
	.location .ss02 {padding:40px 0 0}
	.location .ss02 dl dt {margin-bottom:15px; font-size:16px; padding-left:35px;}
	.location .ss02 .address {padding:0 30px;}
	.location .ss02 .address dt {float:none; width:100%;}
	.location .ss02 .address dd {float:none; width:100%; font-size:14px;}
	.location .ss02 .address dd br {display:none}
	.location .ss02 dl dd.eng {padding-top:5px; font-size:13px; font-weight:100}
	.location .ss02 ul {margin-top:40px;}
	.location .ss02 ul li {padding:30px;}
	.location .ss02 ul li:nth-child(1) {padding-left:30px;}
	.location .ss02 ul dl dt {float:none; width:100%;}
	.location .ss02 ul dl dd {float:none; width:100%; font-size:14px;}


	
	/* product_list */
	.product_list .tab_menu_wrap {margin-bottom:30px;}
	.product_list .tab_menu li {padding:0 15px 10px}
	.product_list .tab_menu li a {font-size:16px;}
	.product_list .tab_content ul li {width:calc((100% - 30px)/2);}
	.product_list .tab_content ul li+li {margin-left:30px}
	.product_list .tab_content ul li:nth-child(1) {margin-left:0 !important}
	.product_list .tab_content ul li:nth-child(3n+1) {margin-left:30px}
	.product_list .tab_content ul li:nth-child(2n+1) {margin-left:0px;}
	

	/* product_view */
	.product_view .pd_title {padding-bottom:10px; margin-bottom:30px; font-size:18px;}
	.product_view .pd_info .info_text {padding:30px;}
	.product_view .pd_info .info_text dl dt {float:none; width:100%; margin-bottom:8px}
	.product_view .pd_info .info_text dl dd {float:none; width:100%; padding-left:15px;}
	

	





}

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

}


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

	#content.sub {padding:60px 0;}
	.sub_title {margin-bottom:30px;}
	.sub_title h2 {font-size:24px;}

	.area_lnb .title {padding-right:30px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
	.area_lnb .lnb .sub {padding-right:30px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
	
	.area_subVisual {height: 270px; padding-top:65px; }
	.area_subVisual h2 {font-size:35px;}
	
	
	/* intro */
	.intro .ss01 .img {height:180px;}


	/* history */
	.history ul:before {left:18px; top:17px}
	.history ul li {padding-bottom:50px}
	.history ul li .year {font-size:27px; padding-left:60px; line-height:35px;}
	.history ul li .year:before {width:35px; height:35px;}
	.history ul li .year:after {left:14px; top:16px;}
	.history ul li > div {padding-top:15px; padding-left:60px;}
	.history ul li dl dt {font-size:15px;}

	
	/* product_list */
	.product_list .tab_menu li a {padding:0; font-size:14px;}
	.product_list .tab_content ul li {width:100%}
	.product_list .tab_content ul li+li {margin-left:0 !important}
	.product_list .tab_content ul li .pd_name {margin-top:15px;}
	.product_list .tab_content ul li .pd_name p {min-height:auto; padding-right:40px; text-overflow:clip; display:block;}

	.product_list .tab_content ul li .img {height:auto;}
	.product_list .tab_content ul li img {width:100%; height:auto; margin-left:0; transform:none}

	.product_view .pd_info .table_alert{display:block; margin-top:20px;}
	.product_view .pd_info > div.pd_table {margin-bottom:0; width:100%; overflow-x:scroll;}
	.product_view .pd_info > div.pd_table table {min-width:800px;}
	


	


}

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

}