@charset "utf-8";
/* 기본설정 */
@import "default.css";
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600&display=swap');
@font-face {
	src: url("../css/font/PretendardVariable.ttf");
	font-family: "Pre";
}
@font-face {
    font-family: 'GowunDodum-Regular';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/GowunDodum-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
.specialList{
	width: 100%;
	height: auto;
	background-image: url(/images/main/bg04.jpg);
	height: 100vh;
	position: relative;
	margin-bottom: 22%;
	
}
.special-wrap{
	width: 90%;
	float: right;
	height: 100%;
}
.special-wrap .title1 p{
	margin-bottom: 50px;
}
.img-wrap{
	max-height: 665px;
	overflow: hidden;
	margin-bottom: 25px;
}
.special-wrap li{
	display: inline-block;
	position: absolute;
	height: auto;
	overflow: hidden;
}
.special-wrap li:nth-child(1){
	left: 24%;
	top: 32%;
}
.special-wrap li:nth-child(2){
	left: 43%;
	top:40%;
}

.special-wrap li:nth-child(3){
	left: 62%;
	top: 29%;
}
.special-wrap li:nth-child(4){
	left: 80%;
	top: 45%;
}
.special-wrap li span{
	display: block;
	text-align: center;
	font-size: 18px;
	font-family: 'GowunDodum-Regular';
}
.special-wrap img:hover{
	transform: scale(1.1);
	transition: all 1.2s;
	
}

.special-wrap span img{
	margin-bottom: 0;
}
.special-wrap img{
	overflow: hidden;
	object-fit: cover;
	margin-bottom: 10px;
}
.specialslide{
	display: none;
}
.special-swiper{
	display: none;
}

.special-swiper1{
	display: none;
}
.special-swiper1 span{
	text-align: center;
	display: block;
}
.special-swiper1 a{
	display: inline-block;
	height: 100%;
}
@media (max-width: 1200px){
  .specialslide{
    display: block;
    width: 50%;
    margin: 0 auto;
}
.special-swiper{
	display: block;
}
.special-wrap{
    width: 100%;
    height: 50%;
}
.special-wrap ul{
    display:none;
}

.special-wrap img:hover{
    transform:none;
}
.special-wrap img{
    width: 100%;
    height: auto;
}
.specialList{
    height: 1100px;
}
  }

@media (max-width: 768px){
	.special-swiper{
		display: none;
	}
	.special-swiper1{
		display: block;
	}
	
}
@media (max-width: 500px){
.specialList{
	height: 900px;
	margin-bottom: 0;
	background-size: 300%;
	background-repeat: no-repeat;
}
}
@media (max-width: 400px){
	.specialList{
		height: 750px;
	}
	}