@media screen and (max-width: 1180px){
	#main{
		width:100%;
		min-width:100%;
		overflow:hidden;
	}

}

@media screen and (max-width: 1180px){
	#main .visualArea{
		width:94%;
		position:relative;
		left:50%;
		margin-left:-47%;
	}
	
	
	#main .visualArea .bg{
		width:100%;
	}
	
	#main .visualArea .bg img{
		width:100%;
	}
	
	#main .visualArea .contArea{
		width:100%;
		position:absolute;
		height:100%;
		z-index:9;
	}
	
	#main .visualArea .contArea .topCont{
		position:absolute;
		z-index:99;
		top:50%;
		left:50%;
		margin-left:-15%;
		margin-top:3%;
	}
	
	
	#main .visualArea .contArea .topCont .subject{
		font-size:20px;
		color:#ba9d3d;
		font-family:'montserrat';
		font-weight:bold;
	}
	
	#main .visualArea .contArea .topCont .substance{
		font-size:16px;
		color:#ba9d3d;
		font-family:'roboto','noto sans kr';
		font-weight:300;
		margin-top:10px;
	}
	
	#main .visualArea .contArea .topCont .type{
		font-size:14px;
		color:#ba9d3d;
		font-family:'roboto','noto sans kr';
		margin-top:30px;
	}
	
	#main .visualArea .contArea .bottomCont{
		position:absolute;
		z-index:99;
		bottom:15%;
		left:33%;
		display:none;
	}
	
	
	#main .visualArea .contArea .bottomCont .name{
		font-size:20px;
		color:#ba9d3d;
		font-weight:800;
		font-family:'montserrat';
	}
	
	#main .visualArea .contArea .bottomCont .subject{
		font-size:13px;
		color:#ba9d3d;
		font-weight:300;
		margin-top:10px;
		font-family:'roboto','noto sans kr';
	}
	
	
	#main .visualArea .contArea .bottomCont .substance{
		font-size:13px;
		color:#ba9d3d;
		font-weight:300;
		margin-top:30px;
		font-family:'montserrat';
	}
	
	#main .visualArea .contArea .bottomCont .button{
		font-size:12px;
		color:#ba9d3d;
		font-weight:300;
		margin-top:30px;
		width:210px;
		border:1px solid #ba9d3d;
		box-sizing:border-box;
		padding:12px 0px;
		text-align:center;
		font-family:'montserrat'
	}
	
	
	#main .visualArea .contArea .bottomCont .button a{
		color:#ba9d3d;
	}
	
	
	



#main .visualArea .mainVisual li:nth-child(3) .contArea .topCont .subject{
	font-size:20px;
	color:#fff;
	font-family:'montserrat';
	font-weight:bold;
}

#main .visualArea .mainVisual li:nth-child(3) .contArea .topCont .substance{
	font-size:16px;
	color:#fff;
	font-family:'roboto','noto sans kr';
	font-weight:300;
	margin-top:10px;
}

#main .visualArea .mainVisual li:nth-child(3) .contArea .topCont .type{
	font-size:14px;
	color:#fff;
	font-family:'roboto','noto sans kr';
	margin-top:30px;
}

#main .visualArea .mainVisual li:nth-child(3) .contArea .bottomCont{
	position:absolute;
	z-index:99;
	bottom:15%;
	left:33%;
	display:none;
}






#main .visualArea .mainVisual li:nth-child(4) .contArea .topCont{
	position:absolute;
		z-index:99;
		top:50%;
		left:3%;
		margin-left:0%;
		margin-top:3%;
}


#main .visualArea  .mainVisual li:nth-child(4) .contArea .topCont .subject{
	font-size:24px;
	color:#fff;
	font-family:'montserrat';
	font-weight:bold;
}

#main .visualArea .mainVisual li:nth-child(4) .contArea .topCont .substance{
	font-size:18px;
	color:#fff;
	font-family:'roboto','noto sans kr';
	font-weight:300;
	margin-top:10px;
}

#main .visualArea .mainVisual li:nth-child(4) .contArea .topCont .type{
	font-size:14px;
	color:#fff;
	font-family:'roboto','noto sans kr';
	margin-top:30px;
}

#main .visualArea .mainVisual li:nth-child(4) .contArea .bottomCont{
	position:absolute;
	z-index:99;
	bottom:15%;
	left:30px;
	display:none;

}
	
	
	
}






@media screen and (max-width: 767px){
	#main .visualArea{
		width:94%;
		position:relative;
		left:50%;
		margin-left:-47%;
	}
	
	
	#main .visualArea .bg{
		width:100%;
	}
	
	#main .visualArea .bg img{
		width:100%;
	}
	
	#main .visualArea .contArea{
		width:100%;
		position:absolute;
		height:100%;
		z-index:9;
	}
	
	#main .visualArea .contArea .topCont{
		position:absolute;
		z-index:99;
		top:30%;
		left:50%;
		margin-left:-15%;
		margin-top:3%;
	}
	
	
	#main .visualArea .contArea .topCont .subject{
		font-size:16px;
		color:#ba9d3d;
		font-family:'montserrat';
		font-weight:bold;
	}
	
	#main .visualArea .contArea .topCont .substance{
		font-size:14px;
		color:#ba9d3d;
		font-family:'roboto','noto sans kr';
		font-weight:300;
		margin-top:5px;
	}
	
	#main .visualArea .contArea .topCont .type{
		font-size:13px;
		color:#ba9d3d;
		font-family:'roboto','noto sans kr';
		margin-top:1em;
	}
	
	#main .visualArea .contArea .bottomCont{
		position:absolute;
		z-index:99;
		bottom:15%;
		left:33%;
		display:none;
	}
	
	
	#main .visualArea .contArea .bottomCont .name{
		font-size:16px;
		color:#ba9d3d;
		font-weight:800;
		font-family:'montserrat';
	}
	
	#main .visualArea .contArea .bottomCont .subject{
		font-size:13px;
		color:#ba9d3d;
		font-weight:300;
		margin-top:10px;
		font-family:'roboto','noto sans kr';
	}
	
	
	#main .visualArea .contArea .bottomCont .substance{
		font-size:13px;
		color:#ba9d3d;
		font-weight:300;
		margin-top:30px;
		font-family:'montserrat';
	}
	
	#main .visualArea .contArea .bottomCont .button{
		font-size:12px;
		color:#ba9d3d;
		font-weight:300;
		margin-top:30px;
		width:210px;
		border:1px solid #ba9d3d;
		box-sizing:border-box;
		padding:12px 0px;
		text-align:center;
		font-family:'montserrat'
	}
	
	
	#main .visualArea .contArea .bottomCont .button a{
		color:#ba9d3d;
	}
	
	
	
	
	

	
	#main .visualArea .mainVisual li:nth-child(3) .contArea .topCont .subject{
		font-size:16px;
		color:#fff;
		font-family:'montserrat';
		font-weight:bold;
	}
	
	#main .visualArea .mainVisual li:nth-child(3) .contArea .topCont .substance{
		font-size:13px;
		color:#fff;
		font-family:'roboto','noto sans kr';
		font-weight:300;
		margin-top:5px;
	}
	
	#main .visualArea .mainVisual li:nth-child(3) .contArea .topCont .type{
		font-size:13px;
		color:#fff;
		font-family:'roboto','noto sans kr';
		margin-top:1em;
	}
	
	#main .visualArea .mainVisual li:nth-child(3) .contArea .bottomCont{
		position:absolute;
		z-index:99;
		bottom:15%;
		left:33%;
		display:none;
	}
	
	
	
	
	
	
	#main .visualArea .mainVisual li:nth-child(4) .contArea .topCont{
		position:absolute;
			z-index:99;
			top:50%;
			left:3%;
			margin-left:0%;
			margin-top:3%;
	}
	
	
	#main .visualArea  .mainVisual li:nth-child(4) .contArea .topCont .subject{
		font-size:16px;
		color:#fff;
		font-family:'montserrat';
		font-weight:bold;
	}
	
	#main .visualArea .mainVisual li:nth-child(4) .contArea .topCont .substance{
		font-size:13px;
		color:#fff;
		font-family:'roboto','noto sans kr';
		font-weight:300;
		margin-top:5px;
	}
	
	#main .visualArea .mainVisual li:nth-child(4) .contArea .topCont .type{
		font-size:13px;
		color:#fff;
		font-family:'roboto','noto sans kr';
		margin-top:1em;
	}
	
	#main .visualArea .mainVisual li:nth-child(4) .contArea .bottomCont{
		position:absolute;
		z-index:99;
		bottom:15%;
		left:30px;
		display:none;
	
	}
	
	
}



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


	#main .proVisualArea{
		width:94%;
		margin:7.5em auto 0;
	}
	
	#main .proVisualArea .proVisual{
		width:100%;
	}
	
	#main .proVisualArea .proVisual li{
		width:100%;
		display:flex;
	}
	
	
	#main .proVisualArea .proVisual .thum{
		width:50%;
		vertical-align:middle;
	}
	
	#main .proVisualArea .proVisual .thum img{
		width:100%;
	}
	
	
	#main .proVisualArea .proVisual .textArea{
		width:50%;
		background:#f7f7f7;
		padding:50px 20px;
		box-sizing:border-box;
	}
	
	
	
	#main .proVisualArea .proVisual .textArea .subject{
		text-align:Center;
		font-size:18px;
		color:#222;
		width:100%;
		overflow:hidden;
		white-space:nowrap;
		text-overflow:ellipsis;
	}
	
	
	#main .proVisualArea .proVisual .textArea .enSubject{
		text-align:Center;
		font-size:14px;
		color:#777;
		font-family:'montserrat';
		margin-top:10px;
		width:100%;
		overflow:hidden;
		white-space:nowrap;
		text-overflow:ellipsis;
	}
	
	
	#main .proVisualArea .proVisual .textArea .line{
		width:30px;
		height:2px;
		background:#222;
		margin:1em auto 1em;
		
	}
	
	
	#main .proVisualArea .proVisual .textArea .substance{
		text-align:Center;
		font-size:13px;
		color:#777;
		word-break:keep-all;
		font-family:'roboto','noto sans kr';
	}
	
	
}







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


	#main .proVisualArea{
		width:94%;
		margin:7.5em auto 0;
	}
	
	#main .proVisualArea .proVisual{
		width:100%;
	}
	
	#main .proVisualArea .proVisual li{
		width:100%;
		display:block;
	}
	
	
	#main .proVisualArea .proVisual .thum{
		width:100%;
		vertical-align:middle;
	}
	
	#main .proVisualArea .proVisual .thum img{
		width:100%;
	}
	
	
	#main .proVisualArea .proVisual .textArea{
		width:100%;
		background:#f7f7f7;
		padding:50px 20px;
		box-sizing:border-box;
	}
	
	
	
	#main .proVisualArea .proVisual .textArea .subject{
		text-align:Center;
		font-size:18px;
		color:#222;
		width:100%;
		overflow:hidden;
		white-space:nowrap;
		text-overflow:ellipsis;
	}
	
	
	#main .proVisualArea .proVisual .textArea .enSubject{
		text-align:Center;
		font-size:14px;
		color:#777;
		font-family:'montserrat';
		margin-top:10px;
		width:100%;
		overflow:hidden;
		white-space:nowrap;
		text-overflow:ellipsis;
	}
	
	
	#main .proVisualArea .proVisual .textArea .line{
		width:30px;
		height:2px;
		background:#222;
		margin:1em auto 1em;
		
	}
	
	
	#main .proVisualArea .proVisual .textArea .substance{
		text-align:Center;
		font-size:13px;
		color:#777;
		word-break:keep-all;
		font-family:'roboto','noto sans kr';
	}
	
	
}











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

#main .story{
	width:100%;
	position:relative;
	left:50%;
	margin-left:-50%;
	margin-top:7.5em;
}

#main .story .title{
	font-size:30px;
	text-align:center;
	color:#222;
	font-weight:'montserrat';
	font-weight:bold;
}

#main .story .cont{
	width:100%;
}


#main .story .cont .bg{
	width:100%;
}


#main .story .cont .bg img{
	width:130%;
}

#main .story .cont .textbox{
	position:absolute;
	background:#fff;
	width:700px;
	left:50%;
	margin-left:-350px;
	bottom:4em;
	padding:2.5em;
}

#main .story .cont .textbox .enTitle{
	font-size:16px;
	color:#777;
	font-family:'montserrat'
	
}

#main .story .cont .textbox .subject{
	font-size:24px;
	color:#222;
	margin-top:5px;
}


#main .story .cont .textbox .line{
	width:20px;
	height:2px;
	background:#222;
	margin:20px 0px;
}

#main .story .cont .textbox .substance{
	font-size:14px;
	color:#444444;
	word-break:keep-all;
	font-family:'roboto','noto sans kr'
}

}

























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

#main .story{
	width:100%;
	position:relative;
	left:50%;
	margin-left:-50%;
	margin-top:7.5em;
}

#main .story .title{
	font-size:24px;
	text-align:center;
	color:#222;
	font-weight:'montserrat';
	font-weight:bold;
}

#main .story .cont{
	width:100%;
}


#main .story .cont .bg{
	width:100%;
}


#main .story .cont .bg img{
	width:300%;
	margin-left:-80%
}

#main .story .cont .textbox{
	position:absolute;
	background:#fff;
	width:94%;
	left:50%;
	margin-left:-47%;
	bottom:2em;
	padding:2.5em;
	box-sizing:border-box
}

#main .story .cont .textbox .enTitle{
	font-size:16px;
	color:#777;
	font-family:'montserrat'
	
}

#main .story .cont .textbox .subject{
	font-size:24px;
	color:#222;
	margin-top:5px;
}


#main .story .cont .textbox .line{
	width:20px;
	height:2px;
	background:#222;
	margin:20px 0px;
}

#main .story .cont .textbox .substance{
	font-size:14px;
	color:#444444;
	word-break:keep-all;
	font-family:'roboto','noto sans kr'
}

}

