@charset "utf-8";
/***********************************************************************
 * sub common style 

 메인컬러 #444
 ***********************************************************************/

/* sph-bg : 서브 메뉴 상단 이미지 */
.sph-bg {
	height:580px;
	margin-bottom:1.0416%; 
	background-position: 50% 50%;
    background-repeat: no-repeat;
	background-image:url("../img/sub-top-bg1.png"); 
}
.sph-bg2 {
	height:500px;
	margin-bottom:4.8958%; 
	background-position: 50% 50%;
    background-repeat: no-repeat;
	background-image:url("../img/sub-top-bg2.jpg"); 
}


/*공통*/

/* 게시판 상단 타이틀 */
.sp-heading-title, 
.sp-heading-title-board,
.sp-header-title,
.board-heading { font-size:24px; text-align:center; padding:40px 0; font-weight:300; }

.sub-page { min-height:500px; /* padding-bottom:10%; */ }

/* //공통// */




/******************************************** business.php *************************************************/
.business_bannerBox { clear:both; }
.business_bannerBox ul { }
.business_bannerBox li { float:left; width:25%; height:auto; min-height:310px; padding:0 1.3863%; margin-bottom:10.2587%; box-sizing:border-box; font-size:1em; position:relative; }
.business_bannerBox li .banner_img img { width:100%; height:auto; }
.business_bannerBox li .banner_txt { position:absolute; top:35.4838%; left:10%; width:80%; min-height:200px; box-sizing:border-box; background:#fff; border:1px solid #eee; color:#777; font-size:1.2em; text-align:center; padding:15px 0;  }
.business_bannerBox li .banner_txt h2 { color:#00a1e5; padding-bottom:25px; line-height: 1.5em;font-size:0.8em;letter-spacing:-0.5px;}
.business_bannerBox li .banner_txt h2 span { font-size:1.3em; }

.w100-sec { width:100%; }
.onestopBox { clear:both; background:#f8f8f8; height:auto; overflow:hidden; padding:100px 0; font-size:1em; }

.sub-title3-h2 { font-size:16px; color:#555; text-align:left; line-height:1.2; }

.business_roundBanner { padding-top:9.24%;  }
.business_roundBanner ul { }
.business_roundBanner li { float:left; width:25%; height:auto; text-align:center; }
.business_roundBanner div img { width:100%; }
.business_roundBanner div.roundimg100 { display:none; }
.business_roundBanner div.roundtxt { font-size:1.313em; color:#777; padding-top:11.1%; }



.bcs_nbss .banner_img{position:relative;}
.bcs_nbss .banner_txt{min-height:auto !important;top:100% !important;transform:translateY(-100%);}
.bcs_nbss .banner_txt h2{padding-bottom:0 !important;}

.bcs_nstl_ul1{margin-top:30px;}
.bcs_nstl_ul1 li{position:relative;width:100% !important;float:none;min-height: auto;line-height: normal;margin: 0;text-align: left;margin-bottom:10px;box-sizing: border-box;padding-left: 13px;}
.bcs_nstl_ul1 li:before{content:"*";color:#00a1e5;position:absolute;left:0;top:1px;font-size:15px;}



/******************************************** company_info.php *************************************************/
.tb-txt {
	height:auto; 
	overflow:hidden; 
    font-size: 18px;
    font-weight: 400;
    padding: 0 26px 51px 13px;
    line-height: 1.5;
}
#introdustion{
	text-align:center;
}
.sub-title {
	width:100%;
	max-width:333px;
	padding: 26px 26px 26px 13px;
}
.sub-title2 {
	width:100%;
	max-width:333px;
	padding: 126px 26px 26px 13px;
}
.sub-title4 {
	width:100%;
	max-width:333px;
	padding: 76px 26px 0 13px;
	text-align: left;
}
.sub-title5 {
	width:100%;
	max-width:333px;
	padding: 76px 26px 51px 13px;
}
.sub-title3{
	width:100%;
	max-width:138px;
	padding-bottom:40px;
}
.sub-title-coming {
    width: 100%;
    max-width: 660px;
    margin: 0 auto;
    padding-top: 17%;
}
.sub-title img{
	width:100%;
}
.sub-title-coming img{
	width:100%;
}
.about-img{
	width:100%;
	max-width:980px;
	margin:0 auto;
	padding: 10% 0;
}
.about-img img{
	width:100%;
}

/*
.sp-content{
    font-size: 18px;
    font-weight: 300;
    letter-spacing: -0.03em;
	line-height: 1.4;
	color:#555;
}
*/

#introdustion .custom-block{
	display:block;
	position:relative;
}
#introdustion .custom-block img{position:absolute; top:-173px; left:31%; display:block; width:23%;}


/* .about-us p{
	padding:1% 0;
	width:90%;
	margin:0 auto;
} */
.our-business p{
	width:80%;
	margin:0 auto;
}
#introdustion .sp-content strong {
    padding-bottom: 3%;
    display: inline-block;
}
.bus-icon{
	display:block;
	width:54px;
	height:54px;
	margin:0 auto 1%;
	background:url(../img/sub_business_icon_w54.png);
	background-repeat: no-repeat;
	background-size:162px;
	margin-top:10%;
}
.bus-icon2{
	background-position:-54px 0;
}
.bus-icon3{
	background-position:-108px 0;
}



/* sub-page-hedaer */

/* location-wrapper */
.location-wrapper {
    background-color:#f1f1f1; 
}

#locationList a {
	color: #898989;
}
#locationList > li {
	float: left; 
	height: 48px;
	line-height: 48px;
}
#locationList > li > a {
	box-sizing: content-box;
}
#locationList .ll-home > a {
	display: block;
	position: relative;
	width: 62px;
	height: 48px;
	line-height: 48px;
	text-align:center;
	font-size: 16px;
	color:#666;
	font-weight: 300;
}
#locationList .ll-home .icon {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0; left: 0;
	background: url("./img/kr.png") no-repeat 50% 46%;
}
#locationList .ll-current {
	position: relative;
	display: block;
	width: 185px;
	font-size: 16px;
}
#locationList .ll-current.ll-sub {
	width:220px;
}
.location00 #locationList .ll-current.ll-sub,
.location02 #locationList .ll-current.ll-sub,
.location04 #locationList .ll-current.ll-sub,
.location10 #locationList .ll-current.ll-sub,
.location12 #locationList .ll-current.ll-sub {
	line-height: 24px;
	width:195px;
}

#locationList .ll-current > a {
	display: block;
	position: relative;
	margin-left: -1px;
	padding: 0 0px;
	
}
#locationList .ll-gnb a:hover,
#locationList .ll-current.ll-gnb > a {
	color: #979997;
    font-size: 16px;
    line-height: 48px;
}

#locationList .ll-current.ll-sub > a {
	color: #666;
}
#locationList .ll-sub a:hover {
/* 	color: #666; */
}

#locationList .ll-current > a:after{
	content: ''; 
	width: 5px; 
	height: 3px; 
	position: absolute; 
	top: 22px; 
	right: 20px; 
	background: url("./img/lnbarrow.gif"); 
	-webkit-background-size: cover;
	background-size: cover;
}

#locationList .ll-list {
	display: none;
	box-sizing: content-box;
	position: absolute;
	z-index: 900;
	width: 100%;
	margin-left: -1px;
	background-color: #fff;
	background-color: rgba(255, 255, 255, 0.87);
	border: 1px solid #ddd;
	border-left: 0;
	
}
#locationList .ll-sub-list {
	
}
#locationList .ll-list:hover{
	/* overflow: visible; */
}
.ll-list > li {
	border-left: 1px solid #ddd;
}
.ll-list li > a {
	display: block;
	padding: 10px 25px;
	line-height: 1.5;
}

/*-sub-page-hedaer */

/* sub-page-tabs */
.sub-page-tabs {
	padding: 75px 0 0;
	text-align: center;
}

.sp-tabs-box {
	position: relative;
	display: inline-block;
	*display: inline; *zoom:1;
	border-bottom: 2px solid #cccdcf;
}

.sub-page-tabs .sp-tab {
	display: inline-block;
	*display: inline; *zoom:1;
	padding: 0 10px;
	font-size: 1.8em;
	line-height: 2;
	text-align: center;
}
.sub-page-tabs .sp-tab:hover,
.sub-page-tabs .sp-tab.active {
	color: #4678b7;
}

.sub-page-tabs .sp-tab-bar {
	display: none;
	position: absolute;
	z-index: 100;
	width: 0;
	height: 2px;
	bottom:-2px;
	background-color: #4678b7;
}
.sub-page-tabs .tab-bar-active {
	
}

/*플랫폼에선 메뉴경로 클릭이 안되게 돼어있어서 약갼 변경해놓습니다~!*/
header.sub-page-hedaer a {
    cursor: default;
}
#locationList .ll-current > a:after{
	display:none;
}
#locationList .ll-current.ll-sub,
#locationList .ll-current{
	width:auto;
}


header.sub-page-hedaer {
    padding-top: 87px;
}


#introdustion .ms-content {
	position: relative;
	background: url(../img/about_img2.png) no-repeat 100% 0;
	height: auto;
	padding:0;
}

.review-quote {
    mar/* gin: 0; */
    padding: 0;
	color: #777;
    font-size: 18px;
    font-weight: 300;
}

.review-box {
    /* text-indent: 1em; */
    text-align: left;
    font-size: 18px;
    padding-top: 0;
}

p.review-author {
    float: left;
    font-weight: 400;
    margin-top: 5px;
}

section.about-us.effect-element-list-item-js { }

section.our-business.effect-element-list-item-js {
    padding-top: 120px;
}

/*3b */
.main-sec-special { clear:both; }
.main-sec-special .heading-style {
    margin-bottom: 85px;
    color: #777777;
    font-size: 30px;
}
.main-sec-special .heading-style .hs-text {
    position: relative;
    display: inline-block;
    padding: 10px 0 0 113px;
}
.main-sec-special .heading-style .why-typo {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 140px;
    background: url(../img/why_typo.png) no-repeat 0 50%;
}
.main-sec-special .heading-style .em {
    font-size: 1.16667em;
}

.main-sec-special ul.ls-with-icon { margin-top:60px; }

/*
.main-sec-special .ls-item01 {
    background-image: url(../img/special_icon01.png);
}
*/

.main-sec-special .ls-item {
    float: left;
    width: 33.33%;
	padding:0 3%;
	box-sizing:border-box; 
    /*margin-right: 5%;*/
    /*padding-top: 170px;*/
    color: #777777;
}
.main-sec-special .ls-icon { text-align:center; width:100%; }
.main-sec-special .ls-icon img { max-width:100%; }

.main-sec-special .ls-heading {
    position: relative;
    padding-top: 60px;
    color: #009ee1;
    font-size: 30px;
    line-height: 1;
	font-weight:bold;
}
.main-sec-special .ls-content {
    padding-top: 15px;
    line-height: 1.3em;
	color:#777;
	font-size:18px; 
	font-weight:300; 
}
.main-sec-special .ls-content .custom-block {
    display: block;
}
.main-sec-special .ls-content {
    padding-top: 15px;
    line-height: 1.2857;
}

.company-bottomtxt {
    clear: both;
    background: url(/img/bg_company.jpg);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    text-align: center;
    padding: 10.4166% 20px;
}
.company-bottomtxt p {
    line-height: 22px;
    font-size: 20px;
    font-weight: 400;
    color: #fff;
}

/*
.main-sec-special .ls-item02 {
    background-image: url(../img/special_icon02.png);
}
.main-sec-special .ls-item03 {
    margin-right: 0;
    background-image: url(../img/special_icon03.png);
}
*/








/******************************************** contact.php *************************************************/
#contact.sub-page {  clear:both; padding-bottom:10%; }
#contact.sub-page > .boundary { }

/* cs-form */
#contact.sub-page.contact-sec .cs-form { text-align:left; font-size:1.1em; line-height:1; }
#contact.sub-page.contact-sec .cs-form .title { text-align:left; font-size:40px; padding:80px 0; }
#contact.sub-page.contact-sec .cs-form .right_txt { text-align:right; padding:0 0 20px; }
#contact.sub-page.contact-sec .cs-form em { font-weight:bold; color:#009de0; }

#contact.sub-page .cs-form-label { display:block; padding-bottom:8px; margin-top:1%; }

#contact.sub-page.contact-sec .cs-form-input,
#contact.sub-page.contact-sec .cs-msg { font-size:1.0em; background-color:#f1f1f1; border:0; }

#contact.sub-page .cs-form-field { width:80%; padding-top:10px; }

#contact.sub-page .cs-form-field-wide { width:100%; padding-top:10px; }

#contact.sub-page .cs-form-input { width:100%; padding:2%; box-sizing:border-box; }
#contact.sub-page .cs-form-field-wide .cs-form-input { padding:0.8%; }

#contact.sub-page textarea { width:100%; padding:1%; box-sizing:border-box; }

#contact.sub-page input.btn-send { width:40%; padding:1%; margin:1% 0; background:#009de0; color:#fff; border:0; }

/* cs-form-topbox */
.cs-form-topbox { position:relative; overflow:hidden; }
.cs-form-topbox .leftArea { float:left; width:50%; }
.cs-form-topbox .rightArea { float:left; width:50%; position:absolute; right:0; bottom:0; }
.cs-form-topbox .rightArea .company { line-height:1.8; }
.cs-form-topbox .rightArea .company i { width:20px; color:#009de0; }

/* cs-form-bottombox */
.cs-form-bottombox { clear:both; }
.cs-form-bottombox .company { display:none; }




/*타이틀*/

.title-box {
    font-size: 32px;
    font-weight: 400;
    padding-bottom: 32px;
}

.title-block {
    display: block;
}

.title-box p {
    margin: 30px 0;
    width: 100px;
    height: 5px;
    background: #00a1e5;
}



.content_atxt{height:550px;}


/******************************************** 반응형 *************************************************/


@media screen and (max-width: 1080px) {
	
	#introdustion .ms-content {
		padding-top: 500px;
		text-align: center;
		padding-left: 0;
		background-position: 50% 0;
		width: 90%;
		margin: 0 auto;
		height:300px; 
	}

	.business_roundBanner ul {
		width: 90%;
		margin: 0 auto;
	}

	.review-quote {
		width: 70%;
		margin: 0 auto;
	}

	#introdustion .custom-block {
		display: inline;
	}

	.business_bannerBox li { width:50%; }
}


@media screen and (max-width: 990px) {
	header.sub-page-hedaer {
		padding-top: 70px;
	}
}

@media screen and (max-width: 980px) {
	header.sub-page-hedaer {
		padding-top: 80px;
	}
}

@media screen and (max-width:780px) {
.cs-form-topbox .rightArea .company { display:none; }
.cs-form-bottombox .company { display:block; line-height:1.8; margin-top:5%; font-size:0.8em; }
.cs-form-bottombox .company i { width:20px; color:#009de0; }
}


@media screen and (max-width: 768px) {
	#locationList {
		position: relative;
		width: auto;
		/* padding: 0 0px 0 64px; */
	}
	#locationList .ll-home {
		/* position: absolute;
		left: 0px;
		top:0; */
	}
	#locationList .ll-current, #locationList .ll-current.ll-sub {
		/* width: 40%; */
	}
	#locationList .ll-current > a {
		padding: 0 0px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.location00 #locationList .ll-current.ll-sub,
	.location02 #locationList .ll-current.ll-sub,
	.location04 #locationList .ll-current.ll-sub,
	.location10 #locationList .ll-current.ll-sub,
	.location12 #locationList .ll-current.ll-sub {
		line-height: 48px;
	}
	#locationList .ll-list {
		width: 100%;
	}
	.ll-list li > a {
		padding: 10px 15px;
	}
	
	.main-sec-special .ls-heading { font-size:30px; }
	.main-sec-special .ls-content { font-size:18px; }

	.sph-bg { height:550px; margin-bottom:0; }
	.sph-bg2 { margin-bottom:10%; }

	
	.business_bannerBox li .banner_txt { /*font-size:0.875em;*/ }
	.business_bannerBox li .banner_txt h2 span { /*font-size:1.25em;*/ }
}

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


	#introdustion .ms-content {
		height: 300px;
	}

	.sub-title {
		width:100%;
		max-width:250px;
		padding: 26px; 
	}

	header.sub-page-hedaer {
		padding-top: 70px;
	}


	#introdustion .custom-block{
		display: inline;
	}

	.review-box {
		text-align: left;
		font-size: 15px;
		padding-top: 0;
	}
	.sp-tabs3 {
		display: block;
		width: 100%;
	}
	.sub-page-tabs .sp-tabs3 > a {
		display: block;
		float: left;
		width: 19%;
		padding: 0 0.5% 5px;
		line-height: 1.3;
	}
	.sub-page-tabs .sp-tabs3 > a > span {
		display: block;
		width: 100%;
	}
	#locationList > li{
		height:40px;
	}
	#locationList .ll-current {
		font-size: 14px;
	}
	#locationList > li {
		line-height: 40px;
	}
	#locationList .ll-home > a {
		height: 33px;
		line-height: 47px;
		font-size: 14px;
	}
	#locationList .ll-current > a {
		padding: 0 0px;
	}
	#locationList .ll-current > a:after {
		top: 19px;
		right:10px;
	}
	#locationList .ll-gnb a:hover, #locationList .ll-current.ll-gnb > a {
		font-size: 14px;
	}

	.main-sec-special.pointB .ls-item { display:block; width:100%; padding-bottom:10%; }
	.main-sec-special.pointB .ls-icon { max-width:30%; margin:0 auto; }
	.main-sec-special.pointB .ls-heading { font-size:20px; padding-top:10px; }
	.main-sec-special.pointB .ls-content { padding-top:5px; font-size:16px; } 
	.main-sec-special.pointB .ls-content span.custom-block { display:inline-block !important; } 

	.sph-bg,
	.sph-bg2 { height:380px; }

	.sph-bg { margin-bottom:40px; }

	.business_bannerBox li { display:block; width:100%; }
	.bus {
		width: 90%;
		margin: 0 auto;
	}
	.business_roundBanner li { display:block; width:100%; padding-bottom:7%; }
	.business_roundBanner div.roundimg100 { display:block; max-width:40%; margin:0 auto; }
	.business_roundBanner div.roundimg25 { display:none; }
	.business_roundBanner div.roundtxt { padding-top:10px; }
	.company-bottomtxt p { line-height:24px; font-size:13px; }

} 






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

	.tb-txt {
		font-size: 16px;
		font-weight: 300;
		padding: 0 26px 51px 13px;
		line-height: 1.2;
	}

	
	#locationList .ll-gnb a:hover, #locationList .ll-current.ll-gnb > a {
		line-height: 40px;
	}

	#locationList .ll-home > a {
		line-height: 41px;
	}

	.review-quote {
		width: 85%;
		margin: 0 auto;
	}

	.title-box {
		font-size: 24px;
		line-height: 1.2;
	}

	.sub-title4 {
		text-align: left;
	}
}



/* 게시판 탭 */
#bo_cate ul { margin-bottom:40px !important; padding:0 !important; zoom:1; }
#bo_cate ul:after { display:block; visibility:hidden; clear:both; content:""; }
#bo_cate li { float:left; width:16.66666666%; }
#bo_cate a { display:block; width:100% !important; position:relative; margin:0 !important; padding:12px 0 !important; box-sizing:border-box; border:1px solid #ddd; border-left:0 !important; background:#f7f7f7; color:#555 !important; text-align:center; letter-spacing:0 !important; font-size:15px !important; cursor:pointer; }
#bo_cate li:first-child a { border-left:1px solid #ddd !important; }
#bo_cate a:focus, 
#bo_cate a:hover, 
#bo_cate a:active { text-decoration:none; }
#bo_cate #bo_cate_on { z-index:2; border:1px solid #00a1e5 !important; background:#00a1e5 !important; color:#fff !important; }

@media screen and (max-width:640px) {
	#bo_cate a { font-size:13px; }
	#bo_cate li{width:50%;}
}

.font-blue{color:#00a1e5;}