@import url(http://fonts.googleapis.com/css?family=Montserrat:400,700);

/* Helpers & resets */
*,
*:after,
*:before {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.cf:before,
.cf:after {
	content: '';
	display: table;
}

.cf:after {
	clear: both;
}

/* General styles */
body {
	color: #444;
	font-size: 1em;
	overflow: ;
	position: relative;
	overflow-y: ;
	font-family:'Nanum Barun Gothic', '나눔고딕', 'NanumGothic', '맑은 고딕', Malgun Gothic, 'Lato-Regular', sans-serif, Dotum,'돋움',gulim,'굴림', sans-serif; font-weight:normal;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background:#fff;
}

a {
	color: #585558;
	text-decoration: none;
	outline: none;
}

a:hover {
	color: #0a5fae;
}

a:hover,
a:focus {
	outline: none;
}

button:focus {
	outline: none;
}

/* Main container */
main{position:relative; width:100%; }
.container {
	position: relative;
	overflow: ;
	background:#;
	/*display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;*/
	display:block;
	/*-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;*/
}

.myContent {
	height: ;
	padding:100px 0 60px 0;
	display:block;
	
}

#mainvisual{
    background:#333333;
    min-width: 100%; 
    min-height: 100%;
}
.section{
	text-align:center;
	display:block;
}

/* Main footer */
footer{position:relative; width:100%; height:auto;display:block; clear:both}
#foot_wrap{position:relative; width:95%; padding:1.8em 0 2em 0; margin:0 auto;}
#foot_wrap .foot_logo{font-size:0.7em; color:#333; opacity:1; line-height:1.4; padding-bottom:0.6em;  text-align:; letter-spacing:0.2em; font-weight:600; display:;} 
#foot_wrap ul{position:relative; width:100%; /*display:inline-block; text-align:center;*/}
#foot_wrap ul li{/*display:inline-block;*/ font-size:0.7em; color:#333; opacity:0.8; line-height:1.4; padding-bottom:0.2em; /*margin:0 0.5em;*/ letter-spacing:0.02em;}
#foot_wrap ul li:after{ content:''; display:block; *display:inline;}
#foot_wrap .copyright{font-size:0.7em; color:#333; opacity:0.7; line-height:1.4;  text-align:;  letter-spacing:0.05em;}


/* 20200519 내가 작업한 스타일[반응형] */
@media all and (min-width:65em){
	
}

@media all and (max-width:65em){
.myContent {
	height: ;
	padding:0px 0 20px 0;
	display:block;
	
}
	
#foot_wrap{padding:0.8em 0 1em 0; }
#foot_wrap ul li{font-size:0.6em; }
#foot_wrap .copyright{font-size:0.6em;}
	
	
}

@media all and (max-width:45em){
}

@media all and (max-width:35em){
}

/* 20200519 내가 작업한 스타일[반응형] */













/* 20200519 내가 작업한 스타일 - 서브페이지 */

.sub_container{	position:relative;	width:95%;	margin:0 auto; min-height:500px; height:100%; padding:70px 0; display:block; clear:both}

/* company */
#namda{position:relative; float:left; width:50%; min-height:350px; text-align:left; z-index:10}
.namda {width:95%; padding-left:5%;}
.namda .intro_title{position:relative; padding-left:0; font-size:2.2em; color:#333; margin-top:50px; margin-bottom:40px; font-weight:300; letter-spacing:0.04em}
.namda .intro_title span{  font-weight:700}
.namda .intro_txt{position:relative; padding-left:0; }
.namda .intro_txt p{ font-size:1.1em; color:#333; line-height:1.8; margin-bottom:30px; word-break:keep-all;}
.namda .intro_txt2{position:relative; padding-left:0; }
.namda .intro_txt2 p{ font-size:1em; color:#333; line-height:1.8; margin-bottom:30px; word-break:keep-all;}

	
#intro_img{position:relative; float:right; min-width:600px; width:50%; min-height:420px; margin:20px auto 30px auto; overflow:; text-align:center; }
#intro_img .frame{position:absolute; left:50%; margin-left:-40px; width:80px; transition: all ease 0.5s; height:420px; overflow:hidden; }
#intro_img .frame:hover{margin-left:-300px; width:600px; transition: all ease 0.5s; overflow:hidden; }
#intro_img .imgct{width: 750px ; height:420px; display:block; position:absolute; left:50%; margin-left:-375px; }

#intro_img2{ display:none;}


/* contact  */
.map_txt{position:relative; float:left; width:46%; min-height:650px; text-align:left; z-index:10; display:block;}
.map_txt:after{content:"";  display:block; clear:both;}
.loca_img ul{position:relative; width:95%; }
.loca_img li{ /*float:;  display:inline-block; text-align:left; margin-right:10px; */ text-align:left;}
.loca_img li:after{content:"";  display:block; clear:both;}
.loca_img .main_txt{font-size:1em; color:#333; letter-spacing:0.04em;  margin-bottom:20px; text-align:left;}
.loca_img .main_txt span{}
.loca_img p{  color:#333; font-size:0.8em;  line-height:1.6; text-align:left;}
.loca_img p a{color:#333;}
#map{position:relative; width:100%; height:500px; width:90%; padding-left:%; margin-top:50px;}
#map > div{position:relative; margin-top:30px;}

#contact_img{position:relative; float:right; width:42%; min-height:400px; margin:0px auto 30px auto;  display:block; }
#contact_img:after{content:"";  display:block; clear:both;}
#contact_img img{display:block; position:; top:0; right:0; left:0; bottom:0; width:100%; margin:0 auto; text-align:center}

#online{position:relative; width:100%; text-align:left; z-index:10; display:block; margin-top:20px; }
#online .section{position:relative; clear:both;}
#online ul{position:relative; }
#online ul:after{content:""; display:block; clear:both;}
#online .sort li{text-align:left; font-size:.9em; color:#333; font-weight:400; padding:1% 0; margin:0px; line-height:2.4; display:inline-block;}
#online .sort li.left{width:48%; float:left;}
#online .sort li.right{width:48%; float:right;}
#online .sort li:after{content:"";  display:block; clear:both;}
#online .sort2 li{text-align:left; font-size:.9em; color:#333; font-weight:400; padding:1% 0; margin:0px; line-height:2.4; }
#online .sort2 li:after{content:"";  display:block; clear:both;}
#online .btn_ok{position:relative; padding-top:20px;}
.infotext{
	border:1px solid #ccc;
	box-sizing:border-box;
	background:#fff;
	min-height:28px;
	width:100%;
	padding:1em;
	font-size:1em; 
	color:#333;
	font-weight:300;
}
.infotext2{
	border:1px solid #ccc;
	box-sizing:border-box;
	background:#fff;
	min-height:28px;
	width:100%;
	padding:1em;
	font-size:1em; 
	color:#333;
	font-weight:300;
}
.mServiceArea{
	border:1px solid #ccc;
	box-sizing:border-box;
	background:#fff;
	height:120px;
	width:100%;
	padding:1em;
	font-size:1em; 
	color:#333;
	font-weight:300;	
}



@media all and (min-width:65em){

	/*.sub_container{	position:relative;	width:95%;	margin:0 auto; min-height:600px; padding:40px 0;}
#namda{position:relative; float:none; width:95%; text-align:center; margin:0 auto; clear:both;}
.namda .intro_title{font-size:2em; margin-top:20px; margin-bottom:20px; text-align:center; }
.namda .intro_txt p{ font-size:1.1em; text-align:center; }
.namda .intro_txt2 p{ font-size:1em; text-align:center; }

#intro_img{ float:none;  width:100%; min-height:420px; margin:0 auto 30px auto;  clear:both;}
#intro_img .frame{min-height:420px;  }
#intro_img .frame:hover{margin-left:-250px; width:500px; }
#intro_img .imgct{width: 500px ; height:420px; margin-left:-250px; }	*/
}


@media all and (max-width:65em){
.sub_container{	position:relative;	width:95%;	margin:0 auto; min-height:300px; padding:30px 0 0px 0;}
	
#namda{position:relative; float:none; width:95%; text-align:center; margin:0 auto; clear:both; margin-bottom:20px;}
.namda .intro_title{font-size:1.6em; margin-top:0px; margin-bottom:20px;}
.namda .intro_txt p{ font-size:1em; }
.namda .intro_txt2 p{ font-size:0.9em; }

#intro_img{ float:none;  width:100%; min-height:360px; margin:0 auto 00px auto;  clear:both;}
#intro_img .frame{position:absolute; left:50%; margin-left:-40px; width:80px; min-height:360px; }
#intro_img .frame:hover{ margin-left:-250px; width:500px;  }
#intro_img .imgct{width: 500px ; height:auto; position:absolute; left:50%; margin-left:-250px; }

}

@media all and (max-width:45em){
#namda{width:95%; min-height:320px; }
.namda .intro_title{font-size:1.3em; letter-spacing:-0.02em}
.namda .intro_txt p{ font-size:0.9em; }
.namda .intro_txt2 p{ font-size:0.8em; }

#intro_img{ display:none; }
#intro_img2{display:block; min-height:220px; margin:0 auto 10px auto; }
#intro_img2 .frame{position:absolute; left:50%; margin-left:-40px; width:80px; min-height:220px; }
#intro_img2 .frame:hover{margin-left:-170px; width:340px; }
#intro_img2 .imgct{width: 340px; height:auto; position:absolute; left:50%; margin-left:-170px; }


.map_txt{ float:none; width:100%;}
#map{width:100%; }
#contact_img{ float:none; width:100%; }




	}

@media all and (max-width:35em){
	
}