@charset "utf-8";
/* CSS Document */
/* 메인 */
#main {
    transition: all 0.5s ease-in-out;
    min-height: 85vh;
    display: flex;
    flex-direction: column;
	gap:3rem;
	background-image: linear-gradient(to bottom, #f5f5f5 20%, #ffffff);
}

    /* 헤더 - 로고 */
    #main .top_logo_pack {
        align-items: center;
        margin-top: 3rem;
    }

        #main .top_logo_pack .logo {
            display: inline;
            transition: all 0.3s ease-in-out;
        }

            #main .top_logo_pack .logo img {
                width: inherit;
                height: inherit;
            }

        /* 헤더 - 콜버튼 */
        #main .top_logo_pack .top_call {
            display: flex;
            align-items: center;
            justify-content: space-between;
            border-radius: var(--br_s);
            background-color: var(--point);
            padding: 0.65rem 2.55rem;
            transition: background var(--q_trans); /*큐빅*/
        }

    #main .top_call:hover {
        background-color: transparent;
        background-color: var(--purple);
    }

    #main .main_cont {
        padding: calc( var(--sec_pd) / 2) 0 var(--sec_pd)  ;
        display: flex;
		align-items: flex-start;
		justify-content: space-between
    }


.main_slide {
	width: 700px;
	aspect-ratio: 7 / 5.7;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
}

.main_slide_img {
    width: 100%;	 
	max-width: 675px;
    max-height: 485px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    transition: transform 0.5s ease, opacity 0.5s ease;
    opacity: 0;
    z-index: 1;
    border-radius: var(--br_r);
 	filter: drop-shadow(0 1px 6px rgba(0, 0, 0, 0.35));
	user-drag: none;
	-webkit-user-drag: none;
	pointer-events: none;
	
}

    /* 이전 이미지 */
    .main_slide_img.Mprev {
        transform: translate(-50%, calc(-50% - 3rem)) scale(0.9);
        opacity: 0.9;
    }

    /* 다음 이미지 */
    .main_slide_img.Mnext {
        transform: translate(-50%, calc(-50% + 3rem)) scale(0.9);
        opacity: 0.9;
    }

    /* 현재 이미지 (기본 크기) */
    .main_slide_img.Active {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
        z-index: 2;
    }

	.main_slide_dots {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 15px;
		border: 1px solid #ebebeb;
		border-radius: 9999px;
		width: 45px;
		height: 125px;
		cursor: pointer;
	}

	.dot {
		background-color: #d5d5d5;
		width: 12px;
		height: 12px;
		border-radius: 9999px;
		transition: all ease .05s ;
	}

	   /* .dot:hover {
			background-color: #c8b8ff;
		}*/

	.dotActive {
		background-color: #5335b9;
		width: 22px;
		height: 22px;
		position: relative;
		/*			border: 2px solid white;*/
	}

		.dotActive:after {
			content: "";
			position: absolute;
			top: 50%;
			transform: translate(-50%,-50%);
			left: 50%;
			border-radius: 9999px;
			background-color: transparent;
			border: 1px solid #5335b9;
			width: 30px;
			height: 30px;
		}
/* ==================== 모바일 레이아웃 ==================== */
@media ( max-width:1280px ) {
    #main .main_cont {
        display: flex;
        flex-direction: column;
		align-items: center;
    }

        #main .main_cont .sect_tit {
			margin-top: 2rem!important;
            padding-top: 0rem;
            text-align: center;
        }

            #main .main_cont .sect_tit p.fs_64 {
                font-size: 2.5rem
            }
            #main .main_cont .sect_tit p.fs_36 {
                font-size: 2rem
            }

	.main_slide_cont > .d_flex{
		flex-direction: column;
		align-items: center;
	}
	
	
.main_slide {
	width: 90vw;
}

.main_slide_img {
    width: 100%;	 
	max-width: 100%;
    max-height: 100%}

	
	.main_slide_dots{
		transform: rotate(-90deg)
	}
}





@media ( max-width:600px ) {
}
/***** 가로모드 *****/
@media screen and (orientation:landscape) and ( max-width:900px ) {
}
/* ========================================================================== */