@charset "utf-8";
/*index01 영역*/
#in01{width:100%;height:100%;min-width:1200px}
#in01 .prd_list{overflow:hidden;width:100%;height:100%}
#in01 .prd_list li{overflow:hidden;float:left;position:relative;width:25%;height:100%;text-align:center}
#in01 .prd_list li:first-child .cont,#in01 .prd_list li:nth-child(3) .cont{background:#efefef}
#in01 .prd_list li .bg{position:absolute;top:0;left:0;z-index:1;width:5px;height:0;background:#c41818}
#in01 .prd_list li .cont{display:none;width:100%;height:100%}
#in01 .prd_list dt{position:relative;font-size:32px;color:#333;letter-spacing:-0.5px;font-family:'notokr-bold',sans-serif}
#in01 .prd_list dt:before{display:block;position:absolute;bottom:2px;left:50%;margin-left:-142px;font-size:32px;color:#333;letter-spacing:-0.5px;font-family:'notokr-bold',sans-serif;content:"["}
#in01 .prd_list dt:after{display:block;position:absolute;bottom:2px;right:50%;margin-right:-142px;font-size:32px;color:#333;letter-spacing:-0.5px;font-family:'notokr-bold',sans-serif;content:"]"}
#in01 .prd_list .s_tit{display:block;margin-bottom:14px;padding-top:154px;font-size:16px;color:#4a4a4a;letter-spacing:-0.4px;font-family:'notokr-medium',sans-serif}
#in01 .prd_list .light{font-family:'notokr-light',sans-serif}
#in01 .prd_list .txt01{font-size:20px;line-height:32px;color:#555;letter-spacing:-0.4px;font-family:'notokr-regular',sans-serif}
#in01 .prd_list .txt01:before{display:block;width:35px;height:1px;margin:23px auto;background:#c41818;content:""}
#in01 .prd_list .txt01 span{font-style:italic }
#in01 .prd_list .txt02{font-size:16px;line-height:32px;color:#848484;letter-spacing:-0.4px;font-family:'notokr-regular',sans-serif}
#in01 .prd_list a{display:block;width:165px;height:51px;margin:38px auto 0;border:1px solid #c41818;box-sizing:border-box;font-size:16px;line-height:50px;color:#c41818;letter-spacing:-0.4px;transition:0.5s;font-family:'notokr-regular',sans-serif}
#in01 .prd_list a:hover{background:#c41818;color:#fff}
#in01 .prd_list img{margin-top:135px;transition:0.5s}
#in01 .prd_list a:hover ~ img{transform:scale(1.05)}
#in01 .prd_list li:first-child img{margin-left:58px}
#in01 .prd_list li:first-child a:hover ~ img{margin-left:20px;transform:scale(1)}

@media screen and (max-width:1200px){
	#in01{height:900px}	
	#in01 .prd_list li .cont{display:block}
}

@media screen and (max-height:800px){
	#in01 .prd_list .s_tit{padding-top:115px}
	#in01 .prd_list img{width:80%;margin-top:60px;}
}
@media screen and (max-height:700px){
	#in01 .prd_list .txt01{font-size:15px}
	#in01 .prd_list .txt02{font-size:14px}	
}