@charset "utf-8";

/* ---------------------------------------------------
POINTWEB.co.kr
Layout Markup ver1.0 2016-07-01
---------------------------------------------------- */

#piw_wrapper {width:100%}
.layout {width:1200px;margin:0 auto}

/* ---- 상단영역 ---- */
#piw_header {width:100%;height:90px}
#header_box {position:relative;width:100%;height:90px;background:#fff;border-bottom:3px solid #115795}
#header_box .logo{width:286px;margin:22px 0 0 0;float:left;position:relative}
#gnb {position:relative;float:right;margin:30px 0 0 0}
#gnb li {float:left;height:49px;position:relative;margin-left:80px}
#gnb li a{font-size:18px;font-weight:500;color:#333}
#gnb li a, .submenu *{transition: all .4s ease-out}
#gnb a:hover.list, #gnb a.list.on {color:#004b8d}
#gnb a:hover.list:before, #gnb a.list.on:before
{content:"";display:inline-block;position:absolute;left:50%;bottom:-10px;width:0;height:0;border-left:8px solid transparent; border-right:8px solid transparent;border-bottom:10px solid #004b8d}

.submenu{width:100%;height:50px;position:absolute;top:87px;z-index:9999;background-color:#004b8d;display:none}
.submenu .smlist {width:100%}
.submenu .smlist li {margin:18px 0 0 0;padding:0 18px;line-height:13px;float:left;text-align:center}
.submenu .smlist li a {color:#fff;font-size:15px}
.submenu .smlist li:hover a{text-decoration: underline;}
.submenu .smlist ul {width:100%}
.submenu .smlist ul.sm01{padding-left:580px}
/*.submenu .smlist ul.sm02{padding-left:900px}*/
.submenu .smlist ul.sm03{padding-left:740px}

/* 메인 레이이아웃 */
.fontitle, .tit{font-family:'Nanum Square'; sans-serif;font-weight:bold}
#container {width:100%}

/* 메인 비주얼 css :  jQuery/swiper/swiper.css*/
.text-box{position:absolute;top:0;left:0;z-index:9999;width:100%;padding-top:160px}
.text-box p{color:#fff;font-size:20px}
.text-box strong, .text-box span{display:block;font-size:54px;color:#fff;font-weight:bold}
.text-box strong{margin-bottom:10px}
.text-box span{color:#0072bc}

/* 메인 컨텐츠 */
  /*제품소개*/
.prod_section{width:100%;background-color:#f3f3f3;padding:50px 0}
.prod_section .tit{text-align:center;font-size:35px}
.tabarea{width:580px;height:43px;margin:20px auto;}
.tabarea li{float:left;min-width:120px;height:43px;margin-right:10px;text-align: center;}
.tabarea li:nth-child(4){width:160px}
.tabarea li a{display:table;width:100%;height:43px;border-radius: 20px;border:1px solid #ccc;box-sizing: border-box;background-color: #fff;padding:0 20px;}
.tabarea li strong{display:table-cell;vertical-align: middle;font-size:16px}
.tabarea li.on a, .tabarea li:hover a{border:3px solid #004b8d;}
.tabarea li:hover strong, .tabarea li.on strong{font-weight:500}
.con {clear:both}
.con01,.con02, .con03, .con04{width:100%;position:relative;padding-top:20px}
.prod_section .prod_list:after{content: "";clear:both;display: block}
.prod_section .prod_list li{float:left;width:285px;height:270px;margin-right:20px;box-sizing: border-box;text-align:center;box-shadow:0 0 15px rgba(0,0,0,0.05);}
.prod_section .prod_list li img{width:100%;height:auto;object-fit:contain;}

/*회사소개,온라인*/
.com_section{width:100%;position:relative;padding:50px 0;clear: both}
.infobox, .estbox{float:left;width:590px;height:540px;box-sizing: border-box;}
.estbox{position:relative;width:590px;padding:0 54px;border:1px solid #ccc;margin-left:20px}

figure {
	width: 590px;height: 270px;margin:0;padding:0;background: #fff;	overflow: hidden;
}
/* Zoom In #1 */
.infobox figure img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.infobox figure:hover img {
	-webkit-transform: scale(1.3);
	transform: scale(1.3);
}
.infobox .thumb{position: relative;}
.infobox .thumb .con_txt{position:absolute;top:65px;left:50px;color: #ccc;font-size:18px}
.con_txt strong{font-size:30px;color:#fff;display:block}
.con_txt .ct-btn.line{display:block;width:100px;background: none;color:#ccc;border:1px solid #ccc;margin-top:30px !important}
.con_txt .ct-btn.line:hover{border:1px soild #fff;color:#fff}

/*온라인견적문의*/
.estbox strong{font-size:30px;display:block;text-align:center;padding:35px 0 25px}
.estbox .inputbox, .estbox .warn input.box01{background-color:#fff;border:1px solid #d2d2d2;padding:0 0 0 10px;border-radius:.25em;-webkit-appearance: none; -moz-appearance: none;appearance: none;}
.estbox .inputbox{width:100%;height:40px;margin-top:12px;}
.estbox .warn input.box01{height:25px;width:90px !important}
.estbox .name .inputbox{margin-top:0}
.estbox input::-webkit-input-placeholder,
.estbox textarea::-webkit-input-placeholder {font-size:15px;color:#a1a1a1}
.estbox input::-moz-placeholder,
.estbox textarea::-moz-placeholder{font-size:15px;color:#a1a1a1}
.estbox textarea{width:100%;height:140px;padding:12px;border-radius:.25em;border:1px solid #d2d2d2;resize: none;margin-top:12px}
.estbox .checkbox, .estbox .warn{float:left;width:240px;padding:10px 0 14px;overflow:hidden}
.estbox .checkbox {position:relative;display:inline-block;text-align:left}
.estbox .checkbox input[type="checkbox"] {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden; clip:rect(0,0,0,0);border:0}
.estbox .checkbox input[type="checkbox"] + label {display: inline-block;padding:0 5px 0 0;font-size:13px;position:relative;cursor:pointer;-webkit-user-select:none; -moz-user-select:none;-ms-user-select:none}
.estbox .checkbox input[type="checkbox"] + label:before {content:"";display:inline-block; width:17px;height:17px;line-height: 21px;margin:-2px 8px 0 0;text-align:center;vertical-align:middle;background:#fafafa;border:1px solid #cacece;border-radius :3px; box-shadow:0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05); }
.estbox .checkbox input[type="checkbox"] + label:active:before, .checks input[type="checkbox"]:checked + label:active:before {box-shadow:0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1); }
.estbox .checkbox input[type="checkbox"]:checked + label:before {content:"\f00c";font-family:'fontAwesome';color:#fff;background:#004b8d;border-color:#004b8d;box-shadow:0px 1px 2px rgba(0,0,0,0.05),inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1); }
.estbox .bt_view{display:inline-block;padding:3px 5px;border:1px solid #d2d2d2;font-size:12px}
.estbox .bt_view:hover{border:1px solid #000;color:#000}
.estbox .ct-btn.red{width:100%;height:50px;font-size:18px;text-align:center}
.estbox .warn{padding-left:16px}
.estbox .btnarea{clear:both}

/* Footer */
#footer {position:relative;width:100%;height:205px;background-color:#2b2b2b;padding-top:27px}
#footer .f_info{float:left;width:800px;}
#footer .pri_list{float:right}
#footer .footer_logo {width:276px;}
#footer .f_info * {color:#707070;font-size:14px}
#footer .address {width:100%;display:block;margin-top:20px}
#footer .address li {float:left;padding:0 5px}
#footer .address li:first-child{display:block;width:100%;}
.copyright {margin-top:12px;clear:both}
#footer .ct-btn.white{color:#000;width:160px;text-align:center}
#footer .ct-btn.white:hover{text-decoration: underline;color:#004b8d}

/*  서브 레이아웃 */
#svisual.gnb01, #svisual.gnb02, #svisual.gnb03, #svisual.gnb04{width:100%;height:230px}
#svisual.gnb01{background:url("/_public/images/sub/svis1.jpg") center no-repeat}
#svisual.gnb02{background:url("/_public/images/sub/svis2.jpg") center no-repeat}
#svisual.gnb03{background:url("/_public/images/sub/svis3.jpg") center no-repeat}
#svisual.gnb04{background:url("/_public/images/sub/svis4.jpg") center no-repeat}

/*레프트메뉴*/
#left {}
#left h2{text-align:center;padding:45px 0}
#left .left_menu:after {clear:both;display:block;content:"";}
#left .left_menu > li {width:240px;position:relative}
#left .left_menu > li > a {width:240px;height:55px;padding:15px 0 0 20px;display:inline-block;font-size:17px}
#left .left_menu > li > a:first-child{border-top:1px solid #e5e6e7}
#left .left_menu > li > a:hover, #left .left_menu > li.on > a{width:240px;height:55px;background-color: #004b8d;color:#2d508a;color:#fff}
#left .left_menu li.on a {color:#fff}

#left .left_menu_depth{width:240px;padding:17px 0 20px 22px;background:#f8f8f8;border:1px solid #e5e6e7;border-width:1px 1px 0 1px}
#left .left_menu_depth2 {height:315px;}
#left .left_menu_depth li.subdep{width:100%;height:20px;position:relative;margin-top:8px}
#left .left_menu_depth li:first-child{margin-top:0}
#left .left_menu_depth li.subdep:before{content:"";position:absolute;top:10px;left:0px;width:5px;height:2px;background-color:#959595}
#left .left_menu_depth li.subdep a{display:block;padding:0 0 0 15px;color:#363636;border:none;font-size:15px}
#left .left_menu_depth li.subdep a:hover,
#left .left_menu_depth li.subdep a.on{color:#004b8d;font-weight:bold}

#left .left_menu_depth li.subdep2{width:100%;height:20px;position:relative;margin:5px 0 15px}
#left .left_menu_depth li.subdep2 a{display:block;padding:0 0 0 30px;color:#363636;border:none;font-size:15px}
#left .left_menu_depth li.subdep2:before{content:"";position:absolute;top:5px;left:18px;width:7px;height:7px;background:url("/_public/images/common/ico_bullet.png") no-repeat}
#left .left_menu_depth li.subdep2 a:hover,
#left .left_menu_depth li.subdep2 a.on{color:#004b8d;font-weight:bold}

#left .left_menu_depth .subdep3 {padding-left:20px;}
#left .left_menu_depth .subdep3 li {position:relative;margin-top:8px;}
#left .left_menu_depth .subdep3 li:before {content:"";position:absolute;top:10px;left:0px;width:2px;height:2px;background-color:#959595}
#left .left_menu_depth .subdep3 li a {font-size:14px;color:#555;}

#left .left_menu > li:hover:before {opacity:0; -webkit-transition: .3s ease-in-out; ransition: .3s ease-in-out;  -webkit-transform: translateZ(0);  transform: translateZ(0);}
#left .left_menu > li:hover {cursor:pointer}


/* Icon Wobble Horizontal */
@-webkit-keyframes ltab {
  16.65% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
  }
  33.3% {
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes ltab {
  16.65% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
  }
  33.3% {
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.ltab:hover {
  display:block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  padding-right: 2.2em;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;

}
.ltab:hover:after,.on .ltab:after {
  content: "\f054";
  position: absolute;
  color:#fff;
  right:25px;
  top:20px;
  padding: 0 1px;
  font-family: FontAwesome;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.ltab:hover:after, .ltab:focus:after, .ltab:active:after {
  -webkit-animation-name: ltab;
  animation-name: ltab;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* Icon Wobble Vertical */
@-webkit-keyframes ltab2 {
  16.65% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }
  33.3% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
  }
  49.95% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }
  66.6% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  83.25% {
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes ltab2 {
  16.65% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }
  33.3% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
  }
  49.95% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }
  66.6% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  83.25% {
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
.ltab2 {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  padding-right: 2.2em;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.ltab2:before {
  content: "\f078";
  position: absolute;
  right: 1em;
  padding: 0 1px;
  font-family: FontAwesome;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.ltab2:hover:before, .ltab2:focus:before, .ltab2:active:before {
  -webkit-animation-name: ltab2;
  animation-name: ltab2;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

.type4 li.on .ltab2:before{
content: "\f077";
  position: absolute;
  right: 1em;
  padding: 0 1px;
  font-family: FontAwesome;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

/* 서브 공통 */
#subcontent {width:100%;position:relative;display:table}
#subcontent::after{content:"";clear:both;display:block}
#subcontent .layout:after{display:table-row}
#lnb_left{display:table-cell;width:240px;background:url("/_public/images/sub/bg_leftmenu.gif") repeat-y}
#contents{display:table-cell;width:960px;position:relative;padding:0 0 100px 80px}
#subcontent .subtitle{font-size:32px;font-family:'Nanum Square'; sans-serif;font-weight:bold}
#subcontent .stxt{font-size:30px}
#subcontent .titlearea{position:relative;width:100%;border-bottom:1px solid #e5e6e7;padding-bottom:14px;margin-bottom:30px}
#subcontent .titlearea .subtitle{display:inline-block}

/* 회사소개 */
	/*인사말*/
.cont_box{width:100%;position:relative;margin-bottom:30px}
.cont_box img{float:right;top:0;margin:0 0 10px 40px}
.cont_box .ptit{font-size:28px;display:block;margin-bottom:20px;line-height:38px;font-weight:normal}
.greeting .cont_box .ptit{margin-bottom:40px}
.cont_box .ptit span{font-size:inherit;font-weight:700}
.cont_box p{margin-top:15px;font-size:15px}

	/*사업장현황 및 위치*/
.location .map {width:100%;margin:10px 0 20px}
.location .section {width:100%;margin-bottom:70px}
.location .section:after{content:"";clear:both;display:block}
.location .cutable {border:1px solid #555;border-width:1px 0}
.location .cutable th, .location .cutable td {padding:13px 0;border-bottom:1px dotted #ccc}
.location .cutable tr:last-child th, .location .cutable tr:last-child td{border-bottom:0}
.location .cutable th{text-align:center;background-color:#f8f8f8;border-right:1px solid #ccc}
.location .cutable td {padding-left:20px}

/*사업분야*/
.prd_list{}
.prd_list li{float:left;width:430px;height:390px;border:1px solid #e5e6e7;padding-top:30px; text-align:center; margin-bottom:20px;}
.prd_list li img{width:300px;height:300px;object-fit:contain}
.prd_list li:nth-child(odd){margin-right:20px}
.prd_list span{display:block;font-size:16px;margin-top:15px}

/*사업분야-기계 200417*/
.business .cont_txt {background:#f9f9f9;padding:30px;margin-bottom:30px;}
.business .cont_txt .sub_tit {font-size:22px;font-weight:500;padding-bottom:10px;color:#004b8d;}
.business .cont_txt .sub_txt li {position:relative;padding-left:20px;}
.business .cont_txt .sub_txt li:after {content:"";position:absolute;top:10px;left:0;width:10px;height:1px;background:#004b8d;}
.business05 table {width:100%;border-spacing:0;}
.business05 td, .business05 th {padding:10px 15px;border-left:1px solid #c1c1c1;border-bottom:1px solid #c1c1c1;text-align:center;}
.business05 th {background:#004b8d;font-weight:500;color:#fff;}
.business05 td:last-child, .business05 th:last-child {border-right:1px solid #c1c1c1;}
.business05 .cont_txt {background:transparent;padding:0;}


/* 상담/방문예약 */
.csarea02 {margin-top:50px}
.csarea02 h3 {font-weight:500;font-size:25px;margin-bottom:20px;letter-spacing:-1px}
.privacy {width:100%;height:240px;overflow:hidden;border:1px solid #ccc;padding:20px 30px;overflow-y:scroll;display:inline-block;}
.agreecheck{width:100%;text-align:right;margin:10px 0 20px;position:relative}
.agreecheck label{margin-left:5px}
.btn_send{width:100%;text-align:center;margin-top:20px}
.btn_send a{width:100px}

/* 제품소개 */
.product_list .proarea {width:100%;display:inline-block;clear:both;padding:0 0 90px}
.product_list .proarea li{display:inline-block;float:left;margin:0 14px 14px 0;}
.product_list .proarea li:nth-child(4n+4){margin-right:0}
.product_list .proarea li a{width:209px;height:209px;display:inline-block;border:1px solid #e5e6e7;text-align:center;position:relative;transition:0.11s}
.product_list .proarea li a:hover{border:1px solid #004b8d}
.product_list .proarea li a:hover strong{color:#004b8d}
.product_list .proarea li img {width:80%}
.product_list .proarea li strong{display:block;font-size:16px;line-height:40px;font-weight:500;color:#2e2e2e}

/* 사이트맵 */
.sitemap {width:100%}
.sitemap dl {width:300px;display:inline-block;float:left;margin:0 50px 31px 0}
.sitemap dl a {width:100%;display:inline-block;}
.sitemap dl:nth-child(3n+3){margin-right:0}
.sitemap dt {display:block;height:46px;font-size:16px;border-bottom:1px solid #0c8653;border-top:1px solid #ccc;line-height:45px;text-align:center;}
.sitemap dt a {font-weight:900;position:relative;border-bottom:2px solid #0c8653}
/*.sitemap dt a:before {content:"";width:13px;height:8px;background:url("/_public/images/common/icon_arrow2.png") no-repeat;position: absolute;bottom:0;left:50%;margin-left:-7px;z-index: 99999;display:inline-block}*/
.sitemap dt:hover {background-color:#fafafa;color:#ffffff !important;cursor:pointer}
.sitemap dd {width:100%;height:220px;display:block;overflow:hidden;text-align:center;position:relative;padding:15px 0;}

/*가이드*/
	/*이메일무단수집거부*/
.guide{}
.guide .guide_chept{position:relative;width:880px;background-color:#f8f8f8;padding:20px 0 20px 120px}
.guide .guide_chept:before{content:"\f058";position:absolute;top:30px;left:40px; font-family: FontAwesome;font-size:50px;color:#b7b7b7}
.guide h3{margin:25px 0 5px 0;font-size:20px;color:#252525}

.guide p{line-height:23px;word-wrap:break-word;word-break:keep-all}
.guide li.list01, .guide li.list02{position:relative;display:block;padding-left:30px;line-height:20px;margin:5px 0}
.guide li.list02{padding-left:15px}
.guide li span.num{position:absolute;top:0;left:0}

.guide .table{width:500px;margin:20px 0}
.guide .table th, .guide .table td{text-align:left;padding:10px 0 10px 14px}
.guide .table th{font-weight:700;border:1px solid #e1e1e1;border-width:1px 1px 0 1px;background:#f8f8f8}
.guide .table td{border:1px solid #e1e1e1;border-width:1px 1px 0 0}