/*------------------------------------------------------------------------------------------------------
컨텐츠영역 .container_sj (width:1000px;)
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
공통
---------------------------------------------------------------------------------------------------------*/
.img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img {margin-left:auto!important; margin-right:auto!important;}
/*------------------------------------------------------------------------------------------------------
공통 끝
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
회사소개
---------------------------------------------------------------------------------------------------------*/
.greet_img {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:row;
	justify-content:center;
	flex-wrap:wrap;
	align-items:center;
	height:289px; background:url(../intro/images/greet_1.jpg) center top no-repeat;
}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.greet_img {height:auto; background:none;}
	}
.greet_img > img {margin-left:15px; margin-right:15px;}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.greet_img > img {width:40%; margin-left:5px; margin-right:5px;}
	}

.greet_con > h2, .greet_con > h3 {text-align:left;}
.greet_con > div, .greet_con > p {text-align:left;}

.greet_promise {font-size:18px; line-height:30px;}
/*------------------------------------------------------------------------------------------------------
회사소개 끝
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
사업영역
---------------------------------------------------------------------------------------------------------*/
.biz_top > h2 {font-size:44px;}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.biz_top > h2 {font-size:22px;}
	}

.biz_con {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:row;
	justify-content:flex-start;
	flex-wrap:wrap;
	align-items:center;
}
.biz_con > h3 {margin:0!important;}

.biz_vision > h3 {
	width:134px; height:149px; line-height:149px; background:url(../intro/images/biz_2.gif) center center no-repeat;
	color:#fff;
}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.biz_vision > h3 {width:100%; text-align:center;}
	}
.biz_vision > p {margin-left:15px; margin-right:15px;}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.biz_vision > p {display:none;}
	}
.biz_vision > div {font-size:24px;}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.biz_vision > div {font-size:18px;}
	}

.biz_mission {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:row;
	justify-content:flex-start;
	flex-wrap:wrap;
	align-items:center;
	width:50%;
}
.biz_mission > h3 {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:column;
	justify-content:center;
	flex-wrap:wrap;
	align-items:center;
	width:134px; height:149px; background:url(../intro/images/biz_3.gif) center center no-repeat;
	color:#fff;
}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.biz_mission > h3 {width:100%; text-align:center;}
	}
.biz_mission > h3 > span {font-size:14px; color:#000;}
.biz_mission > h3 > p {margin-top:-7px; font-size:18px; color:#fff;}
.biz_mission > p {margin-left:15px; margin-right:15px;}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.biz_mission > p {display:none;}
	}
.biz_mission > div {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:column;
	justify-content:center;
	flex-wrap:wrap;
	/*align-items:center;*/
	width:270px; height:149px; padding-left:15px; padding-right:15px; border-radius:15px; background-color:#f4f4f4; border:1px solid #ccc;
	text-align:left; word-break:break-all; word-break:keep-all;
}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.biz_mission > div {margin-left:auto; margin-right:auto;}
	}
/*------------------------------------------------------------------------------------------------------
사업영역 끝
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
건축종류&공법
---------------------------------------------------------------------------------------------------------*/
.ho_con_wrap {width:100%;}/* background-color:#FFCC99*/
.ho_con_wrap > h2 {
	display:inline-block; margin-left:auto; margin-right:auto; padding:20px 0; border-top:5px solid #000; border-bottom:5px solid #000;
	font-size:36px; line-height:46px;
}
.ho_con_wrap > p {text-align:left;}
.house_deco {padding-bottom:40px; background:url(../house/images/deco_leaf.png) center bottom no-repeat;}
.house_deco2 {font-size:20px;}

h2.ho_big_title {margin-bottom:0!important;}
h3.ho_sm_title {margin-top:10px!important; margin-bottom:10px!important;}

/*.ho_container {padding:10px 20px; border-bottom:1px solid #ccc; text-align:left;}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.ho_container {padding-left:0; padding-right:0;}
	}*/
.ho_container {padding:10px 0; border-bottom:1px solid #ccc; text-align:left;}
.ho_container > h3 {padding:0!important;}

.ho_container > div.ho_foto {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:row;
	justify-content:center;
	flex-wrap:wrap;
	align-items:flex-end;
}
.ho_container > div.ho_foto > figure {display:inline-block; width:auto; margin-left:2px; margin-right:2px; text-align:center;}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.ho_container > div.ho_foto > figure {margin-left:1px; margin-right:1px; margin-bottom:10px;}
	}
.ho_container > div.ho_foto > figure > figcaption {font-size:12px; color:#000;}

.ho_container > ul {padding:0;}
.ho_container > ul > li {margin-left:30px;}

.ho_container > dl {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:row;
	justify-content:flex-start;
	flex-wrap:wrap;
	align-items:flex-start;
	padding:0;
}
.ho_container > dl > dt, .ho_container > dl > dd {padding:3px 0; text-align:left;}
.ho_container > dl > dt {width:100px;}
/*------------------------------------------------------------------------------------------------------
건축종류&공법 끝
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
(건축종류&공법 - 목조주택) 목조주택이란?
---------------------------------------------------------------------------------------------------------*/
.ho_con_foto {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	flex-wrap:wrap;
	align-items:center;
}
.ho_con_foto > a {margin-bottom:5px; position:relative; text-decoration:none;}
.ho_con_foto > a > h4 {
	width:100%; padding:10px 0; background:rgba(0, 0, 0, 0.5);
	position:absolute; left:0; bottom:-10px;
	font-size:18px; color:#fff; font-weight:700;
}
/*------------------------------------------------------------------------------------------------------
(건축종류&공법 - 목조주택) 목조주택이란? 끝
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
스틸하우스
---------------------------------------------------------------------------------------------------------*/
.steel_wrap {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	flex-wrap:wrap;
	align-items:flex-start;
	padding:10px 0; border-bottom:1px solid #ccc; text-align:left;
}
.steel_wrap > .steel_container {width:85%;}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.steel_wrap > .steel_container {width:100%; margin-top:35px;}
	}
.steel_wrap > .steel_container > h3 {margin-top:0!important; padding:0!important;}
/*------------------------------------------------------------------------------------------------------
스틸하우스 끝
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
황토주택
---------------------------------------------------------------------------------------------------------*/
.clay_wrap {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:row;
	justify-content:flex-start;
	flex-wrap:wrap;
	align-items:center;
}
.clay_wrap > p {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:column;
	justify-content:center;
	flex-wrap:wrap;
	align-items:center;
	box-sizing:border-box; width:100px; height:100px; margin-right:10px; margin-bottom:10px; border-radius:100px;  border:3px solid #333; line-height:20px;
	word-break:break-all; word-break:keep-all;
}
/*------------------------------------------------------------------------------------------------------
황토주택 끝
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
건축스타일
---------------------------------------------------------------------------------------------------------*/
.spec_wrap {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	flex-wrap:wrap;
	align-items:center;
}
.spec_wrap > div {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:column;
	justify-content:center;
	box-sizing: border-box; width:500px; height:345px;
}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.spec_wrap > div {width:100%; height:auto;}
	}
.spec_wrap > div:nth-child(2), .spec_wrap > div:nth-child(3) {padding-left:20px; padding-right:20px; text-align:left;}
	@media all and (min-width: 320px) and (max-width: 56.25em) {
		.spec_wrap > div:nth-child(2), .spec_wrap > div:nth-child(3) {padding-top:25px; padding-bottom:25px;}
	}

.spec_top {background-color:#f4f4f4;}
.spec_top > h2 {font-size:36px; color:#000;}
.spec_top > h4 {font-size:18px; line-height:28px;}

.spec_ft {
	box-sizing: border-box; width:100%; padding:25px; text-align:left; background-color:#f4f4f4; border-radius:15px; border:1px solid #ccc;
	color:#000; font-weight:400;
}
/*------------------------------------------------------------------------------------------------------
건축스타일 끝
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
백그라운드가 2개로 겹칠때
---------------------------------------------------------------------------------------------------------
background-image:url(/theme/2019_1/images/top_bg_left.png), url(/theme/2019_1/images/top_bg_right.png); background-size:117px 191px, 203px 150px; background-position:left 13px ,right 13px; background-repeat:no-repeat, no-repeat;
/*------------------------------------------------------------------------------------------------------
백그라운드가 2개로 겹칠때 끝
---------------------------------------------------------------------------------------------------------*/