@charset "utf-8";
/* CSS Document */
body {font-family: 'NanumSquare';}


/*메인롤링*/
.jssorb05 {position: absolute;}
.jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
	position: absolute;
	/* size of bullet elment */
	width: 18px;
	height: 18px;
	background: url('../images/rolling/b07.png') no-repeat;
	overflow: hidden;
	cursor: pointer;
}
.jssorb05 div { background-position: -7px -7px; }
.jssorb05 div:hover, .jssorb05 .av:hover { background-position: -37px -7px; }
.jssorb05 .av { background-position: -67px -7px; }
.jssorb05 .dn, .jssorb05 .dn:hover { background-position: -97px -7px; }
.jssora031 {display:block;position:absolute;cursor:pointer;}
.jssora031 .a {fill:#fff;}
.jssora031:hover {opacity:.8;}
.jssora031.jssora031dn {opacity:.5;}
.jssora031.jssora031ds { opacity: .3; pointer-events: none; }


/*컨텐츠*/
section.second-box .mainMenuWrap {width:100%; max-width:1200px; margin:0 auto; padding-bottom:80px;}
section.second-box .mainMenuWrap h2 {padding-top:50px; font-size:30px; color:#707e8c; text-shadow:1px 0; font-weight:bold; letter-spacing:2px;text-align:center; }
section.second-box .mainMenuWrap h2 span{display:inline-block; padding-left:10px; font-size:30px; color:#141414;font-weight:normal;letter-spacing:0;}

section.second-box .mainMenuWrap p {padding-top:15px; color:#959da5; font-size:14px; text-align:center;}
section.second-box .mainMenuWrap ul {margin:0; display:table; width:100%;}
section.second-box .mainMenuWrap ul li {text-align:center; width:25%;}
section.second-box .mainMenuWrap ul .col-xs-20 { width: 20% !important }
section.second-box .mainMenuWrap ul .col-xs-40 { width: 40% !important }
section.second-box .mainMenuWrap ul .col-xs-33 { width: 33.33333333% !important }

section.second-box .mainMenuWrap ul li {-text-align:center; padding:50px 0 0 0;}
section.second-box .mainMenuWrap ul li:hover a{border:2px solid #ff7b53; text-decoration:none;}
section.second-box .mainMenuWrap ul li:hover span{color:#ff5500;}
section.second-box .mainMenuWrap ul li a{display:block; width:90px; height:90px; margin:0 auto; border-radius:45px; border:2px solid #c2c2c2;}
section.second-box .mainMenuWrap ul li span {display:block; padding-top:95px; color:#1b1b1b; font-size:15px; text-shadow:0.7px 0; position:absolute; width:100%; left:0px;}

/*section.second-box .mainMenuWrap ul li span {display:block; padding-top:95px; color:#1b1b1b; font-size:15px; text-shadow:0.7px 0;}*/

section.second-box .mainMenuWrap ul li span.letter-3 {letter-spacing:-3px;}
section.second-box .mainMenuWrap ul li.mi01 a {background:url(../images/main/icon01.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi02 a {background:url(../images/main/icon14.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi03 a {background:url(../images/main/icon04.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi04 a {background:url(../images/main/icon02.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi05 a {background:url(../images/main/icon17.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi06 a {background:url(../images/main/icon12.png) center center no-repeat;letter-spacing:-2px;}
section.second-box .mainMenuWrap ul li.mi07 a {background:url(../images/main/icon08.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi08 a {background:url(../images/main/icon16.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi09 a {background:url(../images/main/icon09.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi10 a {background:url(../images/main/icon15.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi11 a {background:url(../images/main/icon07.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi12 a {background:url(../images/main/icon18.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi13 a {background:url(../images/main/icon06.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi14 a {background:url(../images/main/icon13.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi15 a {background:url(../images/main/icon19.png) center center no-repeat;}
section.second-box .mainMenuWrap ul li.mi16 a {background:url(../images/main/icon03.png) center center no-repeat;}

section.third-box {width:100%; height:440px; padding:0; background:#ff7b53;}
section.third-box article {display:table; width:100%; max-width:1200px; margin:0 auto; overflow:hidden;}

section.third-box article .service-title {display:table-cell;}
section.third-box article .service-title div{width:250px; padding:3em 2em; background:#ff5f3d;box-shadow:15px 10px #fa6e42; }
section.third-box article .service-title div h2 { font-size:30px; color:#fff; text-shadow:1px 0; font-weight:bold; letter-spacing:2px;}
section.third-box article .service-title div h2:after {display:block; width:70px; height:1px; margin:20px 0;background:#ffd4ba; content:''}
section.third-box article .service-title div span {font-size:30px; color:#fff; font-weight:normal;letter-spacing:0; text-shadow:1px 0;}
section.third-box article .service-title div p {padding-top:13px; color:#fff; line-height:20px;}
section.third-box article .service-con {display:table-cell; padding-left:50px; height:440px; vertical-align:bottom;}
section.third-box article .service-con ul {display:table; width:100%; }
section.third-box article .service-con ul li {display:table-cell; width:33%; vertical-align:bottom;}
section.third-box article .service-con ul li div {position:relative; width:90%; height:310px; background:#fff; box-shadow:15px 10px #fa6e42;}
section.third-box article .service-con ul li div a {position:absolute; right:0; bottom:0;}
section.third-box article .service-con ul li div.helptrade h3 {height:50%; background:url(../images/main/helptrade-logo.jpg) center center no-repeat; font-size:0;}
section.third-box article .service-con ul li div.helptrade p { height:50%; padding:1em; background:#71ae30; color:#fff;font-ssize:14px; line-height:25px;}
section.third-box article .service-con ul li div.helptrade a {display:block; width:93px; height:94px; background:url(../images/main/helptrade-more.png) no-repeat; font-size:0;}


section.third-box article .service-con ul li div.handyfarm h3 {height:50%; background:url(../images/main/hadyfarm-logo.jpg) center center no-repeat; font-size:0;}
section.third-box article .service-con ul li div.handyfarm p { height:50%; padding:1em; background:#e46a78; color:#fff;font-size:14px; line-height:25px;}
section.third-box article .service-con ul li div.handyfarm a {display:block; width:93px; height:94px; background:url(../images/main/handyfarm-more.png) no-repeat; font-size:0;}

section.third-box article .service-con ul li div.sign h3 {display:table; width:100%; height:50%;font-size: 27px;text-align: center;padding-top: 50px; font-weight: bold;}
section.third-box article .service-con ul li div.sign h3 img {display: inline-block;vertical-align: top;}
section.third-box article .service-con ul li div.sign h3 span {display: inline-block; vertical-align: top; padding-top: 19px; text-shadow:1px 0; padding-left: 10px;}
section.third-box article .service-con ul li div.sign p { height:50%; padding:1em; background:#737fda; color:#fff;font-size:14px; line-height:25px;}
section.third-box article .service-con ul li div.sign a {display:block; width:93px; height:94px; background:url(../images/main/sign-more.png) no-repeat; font-size:0;}

section.four-box {width:100%; height:440px; background:url(../images/main/four-bg.jpg) #111 center no-repeat;}
section.four-box article {width:100%; height:100%; max-width:1200px; margin:0 auto;}
section.four-box article h2 { padding-top:70px;font-size:30px; color:#fff; text-shadow:1px 0; font-weight:bold; letter-spacing:2px; text-align:center;}
section.four-box article h2 span {display:inline-block; padding-left:10px; font-size:30px; color:#fff;font-weight:normal;letter-spacing:0;}
section.four-box article p {padding-top:15px; color:#a2a2a2; font-size:14px; text-align:center;}
section.four-box article div ul {display:table; width:100%; height:100%;}
section.four-box article > div > ul > li {display:table-cell; width:50%; padding:80px 0; }
section.four-box article div ul li div > a {width:110px; height:110px; border-radius:55px; border:1px solid #fff; font-size:0; } 
section.four-box article div ul li .b01{display:table; width:100%;}
section.four-box article div ul li .b02 {display:table; width:100%;}
section.four-box article div ul li .b01 > a{display:inline-table; width:110px; height:110px; background:url(../images/main/bsicon01.png) center center no-repeat;}
section.four-box article div ul li  p {color:#fff; font-size:15px; text-align:left; line-height:20px;}
section.four-box article div ul li .b01 > div {display:table-cell; padding:0 3em;}
section.four-box article div ul li .b01:hover > a{ width:110px; height:110px; background:url(../images/main/bsicon01_on.png) center center no-repeat; border:1px solid #ff7b53;}
section.four-box article div ul li .b01 h3 {font-size:26px; text-shadow:1px 0;  color:#fff;}
section.four-box article div ul li .b02 > a{display:inline-table; width:110px; height:110px; background:url(../images/main/bsicon02.png) center center no-repeat;}
section.four-box article div ul li .b02:hover > a{ width:110px; height:110px; background:url(../images/main/bsicon02_on.png) center center no-repeat; border:1px solid #ff7b53;}
section.four-box article div ul li .b02 > div {display:table-cell;   padding:0 3em;}
section.four-box article div ul li .b02 h3 {font-size:26px; text-shadow:1px 0;  color:#fff;}
section.four-box article .b-btn {padding-top:20px;}
section.four-box article .b-btn li{ display:inline-block; padding-right:10px;}
section.four-box article .b-btn li a {display:inline-block; padding:0.5em 1em; border-radius:2em; background:rgba(255,255,255,0.5);  font-size:14px; color:#222; text-shadow:1px 0;}
section.four-box article .b-btn li a:hover {background:#ff7b53; text-decoration:none; color:#fff;}

section.five-box {width:100%; height:340px; background:#262626;}
section.five-box article {width:100%; max-width:1200px; margin:0 auto;}
section.five-box article h2 { padding-top:60px;font-size:30px; color:#fff; text-shadow:1px 0; font-weight:bold; letter-spacing:2px; text-align:center;}
section.five-box article h2 span {display:inline-block; padding-left:10px; font-size:30px; color:#fff;font-weight:normal;letter-spacing:0;}
section.five-box article p {padding-top:15px; color:#a2a2a2; font-size:14px; text-align:center;}
section.five-box article ul {display:table; width:100%; padding:70px 0; }
section.five-box article ul li {display:table-cell; width:25% ;}
section.five-box article ul li:hover span {color:#ff7b53;}
section.five-box article ul li a {display:table-cell; width:100px; height:100px; font-size:0;border-radius:50px; }
section.five-box article ul li span {display:table-cell; padding-left:20px; vertical-align:middle; color:#a2a2a2;  text-shadow:1px 0;}
section.five-box article ul li.c1 a{background:url(../images/main/c01.png) #333333 no-repeat;}
section.five-box article ul li:hover.c1 a{background:url(../images/main/c01_on.png) #ff7b53 no-repeat;}
section.five-box article ul li.c2 a{background:url(../images/main/c02.png) #333333 no-repeat;}
section.five-box article ul li:hover.c2 a{background:url(../images/main/c02_on.png) #ff7b53 no-repeat; }
section.five-box article ul li.c3 a{background:url(../images/main/c03.png) #333333 no-repeat;}
section.five-box article ul li:hover.c3 a{background:url(../images/main/c03_on.png) #ff7b53 no-repeat; }
section.five-box article ul li.c4 a{background:url(../images/main/c04.png) #333333 no-repeat;}
section.five-box article ul li:hover.c4 a{background:url(../images/main/c04_on.png) #ff7b53 no-repeat; }

.lp_wrap .lp_con {display: block; width: 100%; height: auto; background: #fff; padding: 0; text-align: center;}
.lp_footer {width: 100%; height: 35px; background: #333333; font-size: 13px;  color: #fff; padding: 8px 0 0 0; box-sizing: border-box; position: relative;}
.lp_wrap .lp_footer label {display: inline-block; height: 26px; vertical-align: middle; padding-top: 2px; margin: 0;}
.lp_wrap .lp_footer .btn_lp_close {position: absolute; right: 20px; top: 8px; color: #ffffff; padding-top: 2px;}

@media (max-width: 920px) {
section.second-box .mainMenuWrap ul li {text-align:center; width:25%;}
}

@media (max-width: 768px) {
	section.second-box .mainMenuWrap ul .col-xs-20 { width: 30% !important }
	section.second-box .mainMenuWrap ul li {text-align:center; width:33%;height:150px;}
	section.third-box article .service-con ul li div.sign h3 img {display:none;}
	section.second-box .mainMenuWrap ul .col-xs-40 {width:33% !important;}
        section.second-box .mainMenuWrap ul .w100 {width:100% !important}
}

@media (max-width: 640px) {
section.second-box {height: auto;}
.sub-title h3 {font-size:35px;}
.title01 {font-size:30px;}
section.second-box .mainMenuWrap ul li {text-align:center; width:33% !important; height:150px;}
section.second-box .mainMenuWrap ul .col-xs-40 {width:33% !important;}
section.second-box .mainMenuWrap ul .w100 {width:100% !important}
section.third-box article .service-con ul li div.sign h3 {padding-top:0; height:50px; line-height:50px;}
section.third-box article .service-con ul li div.sign h3 span {padding-top:0; font-size:23px;}
section.four-box article h2 span {font-size:23px;}
section.third-box article .service-title div span {font-size:23px;}
section.five-box article h2 span {font-size:23px;}
}