div, ul, li, form{ margin:0; padding:0; }
#mainslidediv{width: 100%;  word-break:keep-all; overflow: hidden; position: relative;}

#mainslidediv > div {    overflow: hidden; }
.mainslide { width: 100%; height: 750px; position: relative; font-size: 14px;} 
.mainslide .slidediv { width: 100%; height: 750px; position: absolute;}
.mainslide .slidediv li { width: 100%; height: 750px; position: absolute;}
.mainslide .slidediv li img {position: absolute; height: 100%; object-fit: cover; top: 0; left: 0; right: 0; bottom: 0;animation:slide_imgbg 3s .1s ease-in; -webkit-animation:slide_imgbg 3s .1s ease-in; -moz-animation:slide_imgbg 3s .1s ease-in;}


.mainslide .slidediv li .slideimg { overflow: hidden; text-shadow: 0 2px 4px rgb(0,0,0,.5); text-align: center; position: absolute; top: 45%; bottom: 0; left: 0; right: 0; z-index: 10; box-sizing: border-box;}
.mainslide .slidediv li .slideimg h1 {font-weight: 700; font-size: 60px; line-height: 120%; color: #fff; /*text-transform:uppercase;*/ margin-bottom: 15px; margin-top:0; letter-spacing: -.002em; font-family:"pretendard", sans-serif !important;} 
.mainslide .slidediv li .slideimg p { font-size: 32px; color: #fff; box-sizing: border-box; position: relative; display: inline-block;}
.mainslide .slidediv li .slideimg .img_areaname {position: absolute; font-size: 32px; font-weight: 600; color: #fff; bottom: 5%; right: 5%;}

.mainslide .bx-pager {  position:absolute; bottom: 50px; width:auto; left:0; right: 0; z-index:99; font-size: 0; text-align: center;}
.mainslide .bx-pager div { display: inline-block; margin: 0 5px; }
.mainslide .bx-pager a {display: block; width:10px; height:10px; text-indent:-9999px; background: rgba(255,255,255,.2); border-radius: 50%;}
.mainslide .bx-pager a:hover, .mainslide .bx-pager a.active {background:#fff; border-radius: 5px;}

.mainslide .bx-controls-direction { position:absolute; z-index:99; top: 45%; right: 0; left: 0; width:auto;}
.mainslide .bx-controls-direction a { position:absolute; width:60px; height:60px; display:block; cursor:pointer; text-indent:-9999px; border-radius: 50%;}
.mainslide .bx-prev { background: url(arrow-left.png) no-repeat center; left: 50px; opacity: 0}
#mainslidediv:hover .bx-prev{opacity: 1;}
.mainslide .bx-prev:hover { background: url(arrow-leftov.png) no-repeat center; left: 50px;}
.mainslide .bx-next { background: url(arrow-right.png) no-repeat center; right: 50px;opacity: 0}
#mainslidediv:hover .bx-next{opacity: 1;}
.mainslide .bx-next:hover { background:  url(arrow-rightov.png) no-repeat center; right: 50px;}



@keyframes slide_imgbg { 
	0% { transform:scale(1.2,1.2); }
	100% { transform:scale(1,1); }
}

@keyframes slideimgit {
	0% { margin-top: 100px; opacity:0; }
	100% { margin-top: 0; opacity:1; }
}
@media screen and (min-width:1920px) { 
	.mainslide .slidediv li img{width:100%}
}
@media screen and (max-width:1420px) { 
    .mainslide { height: 680px; } 
    .mainslide .slidediv { height: 680px; }
	.mainslide .slidediv li { height: 680px; }
}

@media screen and (max-width:1280px) { 
    .mainslide { height: 600px; } 
    .mainslide .slidediv { height: 600px; }
	.mainslide .slidediv li { height: 600px; }
	/* mainslide */
	.mainslide .bx-controls-direction { display: none;}
    .mainslide .slidediv li .slideimg h1 {font-size: 55px;}
    

}
@media screen and (max-width:1024px) { 
	.mainslide { height: 550px; } 
    .mainslide .slidediv { height: 550px; }
	.mainslide .slidediv li { height: 550px; }
    .mainslide .slidediv li .slideimg h1 {font-size: 46px;}
    .mainslide .slidediv li .slideimg p { font-size: 28px;}

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

	/* mainslide */
	.mainslide { height: 480px; } 
	.mainslide .slidediv { height: 480px; }
	.mainslide .slidediv li { height: 480px; }
	.mainslide .slidediv li .slideimg h1 { font-size: 36px;} 
	.mainslide .slidediv li .slideimg p { font-size: 14px;}
    .mainslide .slidediv li .slideimg .img_areaname {font-size: 26px;}
}

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

	/* mainslide */
	.mainslide { height: 300px; } 
	.mainslide .slidediv { height: 300px; }
	.mainslide .slidediv li { height: 300px; }
	.mainslide .slidediv li .slideimg { padding: 0;}
	.mainslide .slidediv li .slideimg h1 { font-size: 25px; margin-bottom: 10px;} 
	.mainslide .slidediv li .slideimg p { font-size: 14px; line-height: 38px;}
    .mainslide .slidediv li .slideimg .img_areaname {font-size: 20px;}

}