@charset "UTF-8";
/* CSS Document */


.container{
	padding: 2rem;
}

.slider-wrapper{
	position: relative;
	max-width: 48rem;
	margin: 0 auto;
	bottom: -70px;
}

.slider{
	display: flex;
	aspect-ratio: 16/9;
	overflow-x: auto;
	scroll-snap-type:x mandatory;
	scroll-behavior: smooth;
	box-shadow: 0 1.5rem 3rem -0.75rem hsla(0,0%, 0%, 0.25);
	border-radius: 0.5rem;
}

.slider img{
	flex: 1 0 100%;
	scroll-snap-align:start;
	object-fit:cover;
}

.slider_nav{
	display: flex;
	column-gap: 1rem;
	position: absolute;
	bottom: 1.25rem;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
}

.slider_nav a{
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
	background-color: #fff;
	opacity: 0.75;
	transition: opacity ease 250ms;
}

.slider_nav a:hover{
	opacity: 1;
}

body{
	background: rgba(252,224,185,1.00);
}

h1{
	font-family: 'Nanum Pen Script', cursive;
	position: absolute;
	top: 30px;
	left: 50%;
		
}

back{
	position: relative;
	height: 300px;
	width: 200px;
	background: rgba(240,208,160,1.00);
}

.logo3{
	position: absolute;
	top: 10px;
}


.logo3:hover{
	background:rgba(214,168,101,1.00);
	transition: .5s;
	
}

.title3{
	font-family: 'Nanum Pen Script', cursive; 
	font-size: 160px; 
	position: absolute;
	top: -100px;
	left: 300px;
}

.screen{
	position: absolute;
	top: 100px;
}

.logo5:hover{
	background:rgba(214,168,101,1.00);
	transition: .5s;	
}