/***************************************/
/* MEDIAQUERIES */
/***************************************/

/*타워세라믹 서브 : 이경환*/

#top_image{
	width:100%;
}

#top_image img{
	width:100%;
}
/* 브랜드스토리 */


/* 브랜드스토리 end */

/* 인사말 */
.greet{}
.greet .greet_top{
	width:100%; 
	height:260px; 
	background:url(../image/greet_img1.jpg) no-repeat center/cover;
	padding:0 50px;
	box-sizing:border-box;
	}
.greet .greet_top:after{content:""; display:block; clear:both;}
.greet .greet_top p{color:#fff; float:left; font-size:20px; line-height:28px; margin-top:90px;}

.greet .greet_top .name_box{float:right; margin-top:75px; }

.greet .greet_top .name_box strong{display:block; font-size:50px; color:#9f9f9f; line-height:50px;}
.greet .greet_top .name_box .name1{margin-right:80px;}
.greet .greet_top .name_box .name2{margin-left:80px;}

/*.greet .greet_text{
	width:70%;
	padding:50px 70px;
	margin:-100px auto 0 auto;
	background:#fff;
	border:1px solid #bbbbbb;
	box-sizing:border-box;
	position:relative;
	
}
.greet .greet_text:before{
	content:"";
	display:block;
	width:2px;
	height:55px;
	background:#bbbbbb;
	position:absolute;
	top:-30px;
	left:50%;
	transform:translateX(-50%);
}
.greet .greet_text img{width:70%; margin-bottom:30px;}
.greet .greet_text p{
	line-height:25px;
	word-break:keep-all;
	margin:0 auto 10px auto;

}
.greet .greet_text p span{
	font-size:22px;
	font-weight:600;
	color:#b6d697;
	border-bottom:2px solid #b6d697;
	padding-bottom:2px;
}
.greet .greet_text strong{font-size:20px; display:block; margin-top:50px; text-align:right;}*/

.greet_text{
	background:#f6f6f6; 
	padding:3% 2%; 
	width:90%; 
	box-sizing:border-box;
	margin:-30px auto 50px auto;}
.greet_text:after{content:""; display:block; clear:both;}
.greet_text img{float:left; width:48%; margin-right:2%;}
.greet_text .text_box{width:48%; float:left;}
.greet_text .text_box p{line-height:25px; margin-bottom:20px; word-break:keep-all;}
.greet_text .text_box strong{display:block; text-align:right; margin-top:60px;}
.greet_text .text_box strong img{float:none; width:150px; margin-left:10px; margin-right:0;}
/* 인사말 end */

/* 연혁 */
.history{position:relative;}
.history .hideme{opacity:0;}
.history:before{
	content:"";
	display:block;
	width:1px;
	height:100%;
	position:absolute;
	left:50%;
	background:#dddddd;
}
.history .hcont{margin-bottom:100px;}
.history .hcont:after{content:""; display:block; clear:both;}
.history .hcont .img_box{
	width:50%;
	float:left;
	box-sizing:border-box;
}

.history .hcont .img_box p{
	margin-bottom:10px;
	font-size:16px;
	color:#121212;
	}
.history .hcont .img_box p:before{
	display:inline-block;
	content:"";
	width:3px;
	height:3px;
	border-radius:50%;
	background:#121212;
	margin-bottom:4px;
	margin-right:5px;
}
.history .hcont .img_box img{width:83%;}

.history .hcont .right_img{	text-align:right;}
.history .hcont .right_img p{text-align:right;}
.history .hcont .right_img img{
	display:inline-block;
}

.history .hcont .text_wrap{
	width:50%;
	box-sizing:border-box;
}
.history .hcont .right{
	float:right;
	padding-left:100px;
	position:relative;
}
.history .hcont .right:before{
	display:block;
	content:"";
	width:11px;
	height:11px;
	border-radius:50%;
	background:#bad89c;
	position:absolute;
	top:50%;
	left:-5px;
	transform:translateY(-50%);
}
.history .hcont .right:after{
	display:block;
	content:"";
	width:100px;
	height:1px;
	background:#bad89c;
	position:absolute;
	top:50%;
	left:0;
	transform:translateY(-50%);
}
.history .hcont .left{
	float:left;
	padding-right:100px;
	position:relative;
}
.history .hcont .left:before{
	display:block;
	content:"";
	width:11px;
	height:11px;
	border-radius:50%;
	background:#bad89c;
	position:absolute;
	top:50%;
	right:-6px;
	transform:translateY(-50%);
}
.history .hcont .left:after{
	display:block;
	content:"";
	width:100px;
	height:1px;
	background:#bad89c;
	position:absolute;
	top:50%;
	right:0;
	transform:translateY(-50%);
}

.history .hcont .text_wrap ul{
	border:1px solid #bad89c;
	padding:30px;
	position:relative;
}
.history .hcont .text_wrap ul:after{
	content:"";
	display:block;
	width:17px;
	height:17px;
	border:1px solid #bad89c;
	border-radius:50%;
	position:absolute;
}
.history .hcont .right ul:after{
	top:50%;
	left:-110px;
	transform:translateY(-50%);
}
.history .hcont .left ul:after{
	top:50%;
	right:-111px;
	transform:translateY(-50%);
}

.history .hcont .text_wrap ul strong{
	display:block;
	font-size:20px;
	margin-bottom:15px;
}
.history .hcont .text_wrap ul li{margin-bottom:7px;}
.history .hcont .text_wrap ul li:last-child{margin-bottom:0;}
.history .hcont .text_wrap ul li:after{content:""; display:block; clear:both;}
.history .hcont .text_wrap ul li span{
	display:block;
	float:left;
	margin-right:20px;
	font-weight:500;
	line-height:24px;
}
.history .hcont .text_wrap ul li p{
	float:left;
	line-height:24px;
}




/* 연혁 end */

/* 오시는길 */
.map .map_title{
	color:#7dba6a;
	border-top:1px solid #cccccc;
	padding-top:20px;
	margin:10px 0 30px 0;
	position:relative;}
.map .map_title:before{
	content:"";
	display:block;
	width:50px;
	height:6px;
	background:#7dba6a;
	position:absolute;
	top:-3px;
	left:0;
}
.map .company{margin-bottom:120px;}
.map .company:after{content:""; display:block; clear:both;}
.map .kakao{width:60%; height:432px; float:left;}
.map .info{
	float:right;
	width:40%;
	height:430px;
	/*background:rgba(0,0,0,0.6);*/
	background:url(../image/map_img1.png) no-repeat center/cover;
	bottom:0;
	z-index:100;
	color:#fff;;
	box-sizing:border-box;
	padding:30px 3%;
}
.map .company .info h3{
	text-align:center;
	margin-bottom:30px;
	font-size:24px;
	line-height:30px;
	background:url(../image/map_title_icon1.png) no-repeat center 0;
	padding-top:48px;
	font-weight:400;
}
.map .company .info h3 span.bold{font-weight:700; color:#bad89c;}
.map .info h3:after{
	content:"";
	display:block;
	width:50px;
	height:1px;
	background:#fff;
	margin:30px auto 0 auto;
}
.map .info ul{}
.map .info ul li{
	font-size:18px;
	margin-bottom:30px;
	padding:0 0 20px 30px;
	border-bottom:1px solid #b4b4b4;
	background-repeat:no-repeat;
	background-size:20px auto;
	vertical-align:middle;
	line-height:27px;
}

.map .info ul li:nth-child(2){background-image:url(../image/map_icon1.png)}
.map .info ul li:nth-child(3){background-image:url(../image/map_icon2.png)}
.map .info ul li:nth-child(4){background:url(../image/map_icon3.png) no-repeat 0 2px/23px auto;}
.map .info ul li:last-child{border-bottom:none;}

.map .center{margin-bottom:100px;}
.map .center:after{content:""; display:block; clear:both;}
.map .center .info h3{
	text-align:center;
	margin-bottom:30px;
	font-size:24px;
	background:url(../image/map_title_icon2.png) no-repeat center 0;
	padding-top:48px;
	font-weight:400;
	line-height:30px;
}
.map .center .info h3 span.bold{
	font-weight:700;
	color:#bad89c;
}


/* 오시는길 end */


@media screen and (max-width: 1200px){ 
	#sub_middle {
    padding: 0 3%;
	box-sizing:border-box;
	}

}
@media screen and (max-width: 1000px){
	.greet .greet_top{text-align:center; padding-top:100px;}
	.greet .greet_top p{float:none ; margin-top:0;}
	.greet .greet_top .name_box {display:none;}
}
 
@media screen and (max-width:959px){ 
	.greet_text{padding:4% 5%;}
	.greet_text img{float:none; width:100%; margin-bottom:40px;}
	.greet_text .text_box {float:none; width:100%;}
	.greet_text .text_box strong{font-size:14px;}
	.greet_text .text_box strong img{margin-bottom:0 !important}

	.map .company .info h3 {
		font-size:21px; 
		margin-bottom:20px;
	}
	.map .info ul li {
		font-size:16px;
		margin-bottom:20px ;
		padding-bottom:10px;
	}
	.map .info h3:after{margin-top:20px;}

	.map .center .info h3{	
		font-size:21px; 
		margin-bottom:20px;}
	
	.map .map_title {font-size:21px;}
	.map .map_title:before {width:45px;}

 	.history:before {left:0;}
	.history .hcont{margin-bottom:70px;}
	.history .hcont .text_wrap {width:100%;}
	.history .hcont .left {float:none; padding-right:0; padding-left:100px;}
	.history .hcont .left:before{left:-5px;}
	.history .hcont .left:after{left:0;}
	.history .hcont .left ul:after {left:-110px;}
	.history .hcont .right_img img{margin-top:20px;}
	.history .hcont .left_img img{margin-bottom:20px;}
	.history .hcont .img_box{width:100%; text-align:left; padding-left:100px;}
	.history .hcont .img_box img{width:80%;}
}

@media screen and (max-width:751px){
	.greet .greet_top {padding:80px 0 0; }
	.greet .greet_top p {width:80%; font-size:18px; word-break:keep-all; margin:0 auto;}
	.greet .greet_top p br{display:none;}
	.greet .greet_text p span {font-size:18px;}
}

@media screen and (max-width:600px){ 
	.map .kakao{float:none; width:100%; } 
	.map .info{width:100%; padding:30px 10%; height:400px;}

}
@media screen and (max-width:500px){
	.greet_text img {margin-bottom:20px;}
	.greet_text .text_box strong {margin-top:50px;}
	.greet_text .text_box strong img{width:35%;}

	.history .hcont .img_box img{width:100%;}

}
@media screen and (max-width:425px){
	.history .hcont{margin-bottom:50px;}
	.history .hcont .text_wrap ul{padding:20px;}
	.history .hcont .text_wrap ul li span {float:none;}
	.history .hcont .text_wrap ul li p {float:none;}
	.history .hcont .text_wrap ul strong{font-size:18px;}
	.history .hcont .text_wrap ul li span {font-size:14px;}
	.history .hcont .text_wrap ul li p {font-size:12px; line-height:16px;}
	.history .hcont .right, .history .hcont .left, .history .hcont .img_box{padding-left:70px;}
	.history .hcont .right:after, .history .hcont .left:after{width:70px;}

}