@charset "utf-8";
@keyframes bounce {
	0% {transform:translateY(0);} 
	50% {transform:translateY(-10px);} 
	100% {transform:translateY(0);}
}
@keyframes spin {to {transform: rotate(360deg);}}
@keyframes spin2 {to {transform: rotate(180deg);}}

/* 레이어팝업 */
.leyerpop_box {
	position: absolute; 
	padding: 0px; 
	margin: 0px;
	border:2px solid #20272e;
	z-index: 999999999;
	font-size:13px;
}
.leyerpop_box dl.alt{display:block;overflow:hidden;position:absolute;top:-9999px;left:-9999px;visibility:hidden;}
#popup1 {left: 0; 	top: 10px; }
#popup2 {left: 400px; 	top: 10px; }

@media all and (max-width:748px){
	/* left값 동일 _ top값만 변경 */
	.leyerpop_box img{width:100%;}
	#popup1 {left: 0; 	top: 10px;}
	#popup2 {left: 0; top: 30px;}
}
.hid {display:none;}
@media all and (max-width: 480px){
	.m-hid {display:none;}
	.m-block {display:block;}
}

#content {position: relative;width: 100%;}
#content:before {
	position: absolute;
	bottom: 0;
	left: 0;
	display: block;
	content: '';
	width: 100%;
	height: 20rem;
	background-color: #F4F5F9;	
	z-index: -1;
}
/* 메인 비주얼 */
#main_visual {width: 100%;}
	/* 슬로건 */
	.main_slogan {	
		position: relative;
		max-width: 1300px;
		margin: 0 auto;
		padding: 6rem 0;
	}
	.main_slogan .tit {
		position: relative;
		display: inline-block;
		margin-bottom: 0.8rem;
		padding-right: 6rem;
		font-size: clamp(2.2rem, 3.3vw, 4.4rem);
		font-weight: 800;
		line-height: 1.5;
		color: #111;
		opacity: 0;
		animation: fadeInUp 0.8s ease-out forwards;
	}
	.main_slogan .tit::before {
		position: absolute;
		right: 0;top: 0;
		display: block;
		content: '';
		width: 4.8rem;height: 4.8rem;
		background-image: url('/images/susang/main/slogan_quo.svg');
		background-position: 0 0;
		background-repeat: no-repeat;
		background-size: cover;
		z-index: -1;
	}
	.main_slogan .txt {
		font-size: clamp(1.6rem, 1.2vw , 2.2rem);
		line-height: 1.5;
		color: #707589;
		opacity: 0;
		animation: fadeInUp 0.8s ease-out forwards;
		animation-delay: 0.3s;
	}
	.main_slogan .txt br{display: none;}
	@keyframes fadeInUp {
	    0% {opacity: 0;transform: translateY(-3rem);}
	    100% {opacity: 1;transform: translateY(0);}
	}
	.main_slogan .slogan_bg {
		position: absolute;
		display: block;
		content: '';
		top: 25%;left: 50%;
		width: 40rem;height: 40rem;
		background: url('/images/susang/main/slogan_circle.svg') 0 0 no-repeat;
		animation: spin 60s linear infinite;
		z-index: -8;
	}
/* 이미지 슬라이드 */
#main_visual .swiper-wrapper{
	width: 100%;
	height: clamp(28rem, 32vw, 36rem);
}
	.swiper-wrapper .swiper-slide,
	.swiper-wrapper img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.visual_ctrl{
		position: absolute;
		top: 50%;
		right: 0;
		display: flex;
		align-items: center;
		gap: 1.6rem;
		z-index: 999;
		transform: translateY(-50%);
	}
	.visual_slider_ctrl{
		display: flex;
		justify-content: flex-end;
		align-items: center;
	 }
	.visual-button-next, 
	.visual-button-prev{
		width: 6rem; height: 6rem;
		position: relative;
		left: 0; right: 0; top:0; bottom: 0;
		margin-top: 0;
		text-indent: -9999em;	     
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 4rem;
		border-radius: 999rem;
		transition: all 0.3s ease;
	 }
	.visual-button-prev,
	.visual-button-next {
		background-color: #E6E8EA;
		background-image: url('/images/susang/main/slider_ctrl_arrow.svg');
	 }
	.visual-button-next{transform: rotate(180deg);}
	.visual-button-prev:hover,
	.visual-button-prev:focus,
	.visual-button-next:hover,
	.visual-button-next:focus
	 {
		background-color: #244EA2;
		background-image: url('/images/susang/main/slider_ctrl_arrow_active.svg');
	 }
	.visual-button-prev:hover,
	.visual-button-prev:focus {transform: rotate(-180deg);}
	.visual-button-next:hover,
	.visual-button-next:focus{transform: rotate(360deg);}
	.visual_pagination{
		display: flex;
		gap: 1rem;
		align-items: center;
		z-index: 999;
	}
	.visual_pagination span{ 
		font-family: 'Gmarket-Medium';
		font-size: 1.6rem;
		color: #8A949E;
		letter-spacing: .02rem;
	}
	.visual_pagination .current {
		font-family: 'Gmarket-Bold';
		color: #1E2124;
	}
	.visual_pagination em.bar {
		width: 6rem;
		height: 1px;
		background-color: #C3CAD2;
	}
	

@media (max-width: 1300px){
	#main_visual .main_slogan{margin: 0 3%;}
}	
@media (max-width: 1024px){
	#main_visual .main_slogan{padding: 5rem 0;}
	.main_slogan .tit {
		padding-right: 4rem;
		line-height: 1.5;
	}
	.main_slogan .tit::before {width: 3.6rem;height: 3.6rem;}
	
	#main_visual .swiper-wrapper{
		height: clamp(280px, 18vw, 320px);
	}
	.visual-button-prev, 
	.visual-button-next {
		width: 5.2rem; height: 5.2rem;
		background-size: 3.6rem;
	}	
	.visual_pagination {
		display: none;
	}
}
@media (max-width: 768px){
	#main_visual .main_slogan{margin: 0 6%;}
	#main_visual .main_slogan{padding: 4rem 0 4.8rem;}
	.main_slogan .tit {
		margin-bottom: 0.4rem;
		font-weight: 800;
	}
	#main_visual .main_slogan .slogan_bg {
		left: auto;right: -15%;
		width: 32rem;height: 32rem;
	}
	#main_visual .swiper-wrapper{
		height: clamp(240px, 16vw, 280px);
	}	
	.visual_ctrl{
		top: 0; bottom: -16rem;
		transform: translateY(0);
	}
	.visual-button-prev,
	.visual-button-next{
		width: 4rem; height: 4rem;
		background-size: 2.4rem;
	}
}
@media (max-width: 480px){
	#main_visual .main_slogan{padding: 3.2rem 0 4rem;}
	.main_slogan .tit {padding-right: 3.2rem;}
	.main_slogan .tit::before {width: 2.8rem;height: 2.8rem;}
	.main_slogan .txt br{display: block;}
	#main_visual .main_slogan .slogan_bg {
		right: -30%;
		width: 24rem;height: 24rem;
	}
	#main_visual .swiper-wrapper{
	  	height: clamp(200px, 14vw, 240px);
	}
	
}

	/* 도심속 힐링 */
	#main_info {
		width: 100%;
		margin: 0;
		padding: 8rem 0;
		background-color: #EFF1F8;
	}
	#main_info .inner {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 5.2rem;
	}
	#main_info .info_img,
	#main_info .info_txt {
		width: 50%;
	}
	#main_info .info_img img {
		width: 100%;
		border-radius: 0.4rem;
	}
	#main_info .info_txt {
		margin: 0;
		padding: 0;
	}
	#main_info .info_txt p {
		margin-bottom: 2.4rem;
		padding: 0;
		font-size: 1.7rem;
		line-height: 1.5;	
		color: #464C53;
	}
	#main_info .info_txt p strong {
		font-size: 3.2rem;
		font-weight: 700;
		color: #111;
	}
	#main_info .info_txt p:last-child {margin: 4rem 0 0;}
	#main_info .info_txt a.btn_more {
		position: relative;
		display: inline-block;
		margin: 0;
		padding: 1.2rem 5rem 1.2rem 2.4rem;
		font-size: 1.6rem;
		color: #fff;
		background: linear-gradient(45deg,rgba(36, 78, 162, 1) 0%, rgba(208, 48, 60, 1) 100%);
		border-radius: 0.4rem;
	}
	#main_info .info_txt a.btn_more:before {
		position: absolute;
		top: 50%;right: 2rem; 
		display: block;content: ''; 
		width: 2.4rem;height: 2.4rem;
		margin: 0;padding: 0;
		background-image:url('/images/susang/main/btn_more_arrow.svg');
		background-size: 2.4rem auto;
		background-repeat:no-repeat;
		background-position:0 0;
		transition: all 0.3s ease;
		transform: translateY(-50%);
	}
	#main_info .info_txt a.btn_more:hover:before {
		transform: translateY(-50%) translateX(0.4rem);
	}
	
	@media (max-width: 1300px){
		#main_info .inner{margin: 0 3%;}
	}
	@media (max-width: 1024px){
		#main_info {padding: 6rem 0;}
		#main_info .inner {gap: 4rem;}
		#main_info .info_txt p {
			margin-bottom: 2rem;
			font-size: 1.5rem;
		}
		#main_info .info_txt p strong {font-size: 2.8rem;}
		#main_info .info_txt a.btn_more {padding: 0.8rem 4.4rem 0.8rem 2rem;}
		#main_info .info_txt a.btn_more:before {
			right: 1.6rem; 
			width: 2rem;height: 2rem;
			background-size: 2rem auto;
		}
	}
	@media (max-width: 768px){
		#main_info {padding: 4rem 0 4.4rem;}
		#main_info .inner {
			flex-direction: column;
			gap: 4rem;
		}
		#main_info .info_img,
		#main_info .info_txt {
			width: 100%;
		}
		#main_info .info_img{order: 2;}
		#main_info .info_txt{order: 1;}
		#main_info .info_txt p {
			margin-bottom: 1.6rem;
			font-size: 1.4rem;
			text-align: center;
		}
		#main_info .info_txt p strong {
			font-size: 2.4rem;
		}
		#main_info .info_txt p:last-child {margin: 2.4rem 0 0;}
		#main_info .info_txt a.btn_more {font-size: 1.4rem;}
	}
	@media (max-width: 480px){
		#main_info .info_txt p strong {font-size: 2rem;}
	}

	.m_cont {
		max-width: 1300px;
		margin: 0 auto;
		padding-top: 4rem;
		display: flex;
		justify-content: space-between;
		gap: 4rem;	
	}
	.m_cont > div:not(#main_popupzone) .head {
	    padding-bottom: 1.6rem;
	    display: flex;
	    justify-content: space-between;
	    align-items: center;
	}
	.m_cont > div:not(#main_popupzone) .head h3.tit{
	    font-size: 1.6rem;
	    font-weight: 700;
		line-height: 1.5;
	    color: #2E5EBF;
	}
	.m_cont > div .head h3 span{
		display: block;
	    font-size: 3.2rem;
		font-weight: 700;
	    color: #111;
	}

	@media (max-width: 1300px){
		.m_cont {
			max-width:94%; margin:0 3%;
		}
	}	
	@media (max-width: 1024px){
		.m_cont {
			flex-direction: column;
			gap: 3rem;
		}
	}	
	@media (max-width: 768px){
		.m_cont > div:not(#main_popupzone) .head h3.tit{ font-size: 1.4rem;font-weight: 600;line-height: 1.4;}
		.m_cont > div .head h3 span{font-size: 2.4rem;}
	}
	@media (max-width: 480px){
		.m_cont > div:not(#main_popupzone) .head {padding-bottom: 1.2rem;}
		.m_cont > div:not(#main_popupzone) .head h3.tit{font-size: 1.3rem;}
		.m_cont > div .head h3 span{font-size: 2rem;}
	}

	/* 공지사항 */
	#main_notice {width: 65%;}
	#main_notice ul.notice_list {
        display: flex;
        flex-direction: column;
        gap: 0.8rem;
    }
    #main_notice ul.notice_list li {       
		position: relative;
		padding: 2.4rem;
        padding-left: 4.4rem;
		display: flex;
		justify-content: space-between;
		align-items: center;    
		background-color: #EEF2F7;
		border-radius: 0.6rem;
        transition: all 0.3s linear;
    }
    #main_notice ul.notice_list li::after{
		position: absolute;
		content: '';	
		top: 50%; left: 2.8rem;
		transform: translateY(-50%);
		width: 0.5rem; height: 0.5rem;
		background-color: #1E2124;
		border-radius: 999rem;
	} 
    #main_notice ul.notice_list li a {
		flex-grow: 1; 
		display: flex;
		align-items: center;
		gap: 0.5rem;
		width: 85%;
	}  
    #main_notice ul.notice_list li a span.sbj{
    	display: block;
    	font-size: 1.6rem;
        color: #1E2124;
	    white-space: nowrap; 
	    overflow: hidden; 
	    text-overflow: ellipsis;
	    max-width: 80%;
	}
    #main_notice ul.notice_list li:hover{
        background-color: #dee6ee;
    }
	#main_notice ul.notice_list li span.date{
	    font-size: 1.5rem;
	    color: #6D7882;
	    flex-grow: 0;
	}
	#main_notice ul.notice_list li a span.link_ico{
	    display: block;
		width: 2.4rem;height: 2.4rem;
	    text-indent: -9999em;
	    background-position: center center;
	    background-repeat: no-repeat;
	    background-size: 2.4rem;
	    border-radius: 999rem;  
	}
	#main_notice ul.notice_list li a span.link_ico.new{
	    background-color: #D52938;
	    background-image: url('/images/susang/main/ico_notice_new.svg');
	}
	#main_notice ul.notice_list li a span.link_ico.file{
	    background-color: #fff;
	    background-image: url('/images/susang/main/ico_notice_file.svg');
	}
	#main_notice ul.notice_list li.no-board{
	    display: flex;
	    justify-content: center;
	    align-items: center;
	    color: #6D7882;
	    text-align:center;
	}
	.m_cont > div .head div.ctrl .btn_more,
	#main_notice .head a.btn_more{
	    display: block;
	    width: 40px; height: 40px;
	    text-indent: -9999em;
		background-color: #244EA2;
	    background-image: url('/images/susang/main/icon_content_more.svg');
	    background-repeat: no-repeat;
	    background-position: center center;
	    background-size: 24px;
	    border-radius: 999rem;
		transition: .2s ease-out;
	}
	.m_cont > div .head div.ctrl .btn_more:hover,
	#main_notice .head a.btn_more:hover{
		background-color: #103382;
	    animation: spin2 .2s linear;
	}
	
	/* 팝업존 */
	#main_popupzone {
		width: 35%;
		display: flex;
		flex-direction: column;
		overflow: hidden;
		border-radius: 0.6rem;
	}
	#main_popupzone .head {
		order: 2;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 1.6rem 2rem;
		background-color: #2D3548;		
	}
	#main_popupzone .head h3.tit{
	    font-size: 1.8rem;
	    font-weight: 700;
	    color: #fff;
	}
	#main_popupzone .head .popup_slider_ctrl button{
	    width: 2.4rem; height: 2.4rem;
	    position: relative;
	    left: 0; right: 0; top:0; bottom: 0;
	    margin-top: 0;
	    text-indent: -9999em;
	    background-repeat: no-repeat;
	    background-position: center center;
	    background-size: 2.4rem;
	    
	}
	#main_popupzone .head .popup-button-next{
	    background-image:url('/images/susang/main/ico_slider_next_ov.svg');
	}
	#main_popupzone .head .popup-button-prev{
	    background-image:url('/images/susang/main/ico_slider_prev_ov.svg');
	}
	#main_popupzone .head .popup-button-play{
	    background-image:url('/images/susang/main/ico_slider_play_ov.svg');
	}
	#main_popupzone .head .popup-button-pause{
	    background-image:url('/images/susang/main/ico_slider_pause_ov.svg');
	}
	#main_popupzone .cont {
		order: 1;
		position: relative;
		overflow: hidden;
		height: 400px;
		flex-grow: 1;
	}
	#main_popupzone .popup_slider {
		display: flex;
		height: 100%;
		background: #F9F9F9 url('/images/common/default_img.jpg') center center no-repeat;
		background-size: contain;
	}
	#main_popupzone .cont a.thumb img{
        width: 100%; height: 100% !important;
        object-fit: cover;
        object-position: center;
    }	
	#main_popupzone .cont .swiper-wrapper .swiper-slide,
	#main_popupzone .cont .swiper-wrapper img{
		width: 100%;
		height: 100% !important;
		object-fit: cover;
	}
	
	@media (max-width: 1300px){
		#main_notice {width: 60%;}
		#main_popupzone {width: 40%;}
	}	
	@media (max-width: 1024px){
		#main_notice,
		#main_popupzone {width: 100%;}		
		#main_notice ul.notice_list li {
			padding: 2rem;
	        padding-left: 4rem;
	    }    
		.m_cont > div .head div.ctrl .btn_more,
		#main_notice .head a.btn_more{
		    width: 3.2rem; height: 3.2rem;
		    background-size: 2rem;
		}
		#main_popupzone .head {padding: 1.2rem 1.6rem;}
		#main_popupzone .head h3.tit{font-size: 1.7rem;}
		#main_popupzone .cont {height: 28rem;}
		#main_popupzone .cont a.thumb img{object-fit: contain;}	
	}	
	@media (max-width: 768px){
		#main_notice ul.notice_list li {
			padding: 1.2rem;
			padding-left: 3.2rem;
	    }
	    #main_notice ul.notice_list li::after{
			left: 2rem;
			width: 0.4rem; height: 0.4rem;
		} 
		#main_notice ul.notice_list li a span.sbj{font-size: 1.4rem;}
		#main_notice ul.notice_list li span.date{display: none;}		
	}
	@media (max-width: 480px){	
		.m_cont > div .head div.ctrl .btn_more,
		#main_notice .head a.btn_more{
		    width: 2.8rem; height: 2.8rem;
		    background-size: 1.6rem;
		}
		
		#main_popupzone .head h3.tit{font-size: 1.6rem;}
		#main_popupzone .cont {height: 20rem;}
	}
		
	/* 갤러리 */
	#main_gallery {
		width: 50%;
		display: flex;
		flex-direction: column;
		overflow: hidden;
	}
	#main_gallery .head .gallery_slider_ctrl button {
	    width: 4rem; height: 4rem;
	    position: relative;
	    left: 0; right: 0; top:0; bottom: 0;
	    margin-top: 0;
	    text-indent: -9999em;
	    background-color: #fff;
	    background-repeat: no-repeat;
	    background-position: center center;
	    background-size: 2.4rem;
	    border: 1px solid #D6DFEB;
	    border-radius: 99rem;
	    transition : all .2s linear;
	}
	#main_gallery .head .gallery-button-next{background-image:url('/images/susang/main/ico_slider_next.svg');}
	#main_gallery .head .gallery-button-prev{background-image:url('/images/susang/main/ico_slider_prev.svg');}
	#main_gallery .head .gallery-button-play{background-image:url('/images/susang/main/ico_slider_play.svg');}
	#main_gallery .head .gallery-button-pause{background-image:url('/images/susang/main/ico_slider_pause.svg');}
	#main_gallery .head .gallery_slider_ctrl button:hover {
		background-color: #244EA2;
		border:1px solid transparent;
	}
	#main_gallery .head .gallery-button-next:hover{background-image:url('/images/susang/main/ico_slider_next_ov.svg');}
	#main_gallery .head .gallery-button-prev:hover{background-image:url('/images/susang/main/ico_slider_prev_ov.svg');}
	#main_gallery .head .gallery-button-play:hover{background-image:url('/images/susang/main/ico_slider_play_ov.svg');}
	#main_gallery .head .gallery-button-pause:hover{background-image:url('/images/susang/main/ico_slider_pause_ov.svg');}
	#main_gallery .cont {
		order: 1;
		position: relative;
		overflow: hidden;
		height: 320px;
		flex-grow: 1;
	}
	#main_gallery .cont .gallery_slider {
		position: relative;
		display: flex;
		height: 100%;
		padding-bottom: 5.2rem;
	}
	#main_gallery .cont .gallery_slider > .swiper-wrapper{
		background: #F9F9F9 url('/images/common/default_img.jpg') center center no-repeat;
		background-size: contain;
	}
    #main_gallery .cont .gallery_slider a.thumb{
        position: relative;
        display: block;
        height: 100%; min-height: 100%;
        overflow: hidden;
        border-radius: 0.2rem;
    }
    #main_gallery .cont .gallery_slider a.thumb img{
        width: 100%; height: 100%;
        object-fit: cover;
        object-position: center;
		transition : all .2s linear;
    }
	#main_gallery .cont .gallery_slider a.thumb:hover img{transform: scale(1.05);}
    #main_gallery .cont .gallery_slider a.thumb::after{
        content: '';
        position: absolute;
        top: 0; left: 0;
        width: 100%; height: 100%;
        background: linear-gradient(to bottom, rgba(0,0,0,.2) 60%, rgba(0,0,0,.4) 80%, rgba(0,0,0,.7) 100%);
        opacity: 1;
    }
    #main_gallery .cont .gallery_slider a.thumb span.sbj{
        position: absolute;
        bottom: 2.8rem; left: 2.8rem;
        z-index:99;
        font-size: 2rem;
        line-height: 1.5;
        color: #fff;
        white-space: nowrap; 
        overflow: hidden; 
        text-overflow: ellipsis;
        max-width:80%;
        transition: 0.2s all linear;
    }
    #main_gallery .cont .gallery_slider .gallery-scrollbar {
	    position: absolute;
	    left: 0; bottom: 0;
	    width: 100%;height: 0.6rem;
	    background-color: #dfe1ea;
	    border-radius: 2rem;
	}
    #main_gallery .cont .gallery_slider .swiper-scrollbar-drag {
	    background: linear-gradient(45deg,rgba(36, 78, 162, 1) 0%, rgba(208, 48, 60, 1) 100%);
	    border-radius: 5rem;
	}
    
    /* 바로가기 */
	#main_banner {
		width: 50%;
		min-height: 100%;
	}
	#main_banner .ban_list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: repeat(2, 1fr);
		gap: 1.6rem;
		height: 100%;
		align-content: stretch;
		margin: 0; padding: 0;
	}	
	#main_banner .ban_list > li {min-height: 0;}
	#main_banner .ban_list > li > a{
		position: relative;
		display: flex;
		flex-direction: column;
		height: 100%;
		min-height: 22rem;
		margin: 0;padding: 3.2rem;
		background-color: #FFF;
		border: 1px solid #D6DFEB;
		border-radius: 0.3rem;
		transition: all .3s ease-out;
		overflow: hidden;
	}
	#main_banner .ban_list > li > a::before{
        position:absolute;
        content: '';
        left: 0;top: 0;
        width: 100%;height: 100%;
        background-color: #FFF;
        z-index: -2;
    }
	#main_banner .ban_list > li > a::after{
        position:absolute;
        content: '';
        left: -250%;top: 0;
        width: 200%;height: 100%;
        background: linear-gradient(45deg,rgba(36, 78, 162, 1) 0%, rgba(208, 48, 60, 1) 100%);
        z-index: -1;
    }
    #main_banner .ban_list > li > a:hover,
    #main_banner .ban_list > li > a:focus{
    	transform: scale(1.05);
        border-color: transparent;
        box-shadow : 0 1rem 1rem rgba(48,51,93,.1);
    }
    #main_banner .ban_list > li > a:hover::after,
    #main_banner .ban_list > li > a:focus::after{left: -50%}
	
	#main_banner .ban_list > li > a > p {
		margin: 0; padding: 0;
		font-size: clamp(1.3rem, 1.4vw, 1.5rem);
		line-height: 1.5;
		color: #707589;
	}
	#main_banner .ban_list > li > a > p span {
		display: block; 
		margin-bottom: 0.8rem; padding: 0;
		font-size: clamp(1.6rem, 1.9vw, 2.2rem);
	    font-weight: 600;
		color: #111;
	}
	#main_banner .ban_list > li > a:hover p,
	#main_banner .ban_list > li > a:hover p span{color: #FFF;}
	#main_banner .ban_list > li > a i {
        display: block;
        width: 100%; height: 5.2rem;
        margin-top: 2rem; padding: 0;
        background-size: contain;
        background-position: right center;
        background-repeat: no-repeat;
    }     
    #main_banner .ban_list > li > a i.icon_ban01 {background-image:url('/images/susang/main/icon_ban01.svg');}
   #main_banner .ban_list > li > a i.icon_ban02 {background-image:url('/images/susang/main/icon_ban02.svg');}
    #main_banner .ban_list > li > a i.icon_ban03 {background-image:url('/images/susang/main/icon_ban03.svg');}
    #main_banner .ban_list > li > a i.icon_ban04 {background-image:url('/images/susang/main/icon_ban04.svg');}
    #main_banner .ban_list > li > a:hover i {animation: bounce .3s linear;} 

	@media (max-width: 1024px){	
		#main_gallery,
		#main_banner  {width: 100%;}
		
		#main_gallery {border: 0;}
		#main_gallery .head .gallery_slider_ctrl button {
	    	width: 3.2rem; height: 3.2rem;
	    	background-size: 2rem;
	    }
		#main_gallery .cont {height: 32rem;}
		#main_gallery .cont .gallery_slider{padding-bottom: 4rem;}
		#main_gallery .cont .gallery_slider a.thumb span.sbj{font-size: 1.8rem;}
	   
	    #main_banner .ban_list > li > a{
			min-height: 16rem;
	    	padding: 2.4rem;
	    }
	    #main_banner .ban_list > li > a:hover,
		#main_banner .ban_list > li > a:focus{transform: scale(1.025);}
	}
	@media (max-width: 768px){
		#main_gallery .cont {height: 24rem;}
		#main_gallery .cont .gallery_slider{padding-bottom: 3rem;}
	    #main_gallery .cont .gallery_slider .gallery-scrollbar {height: 0.4rem;}
		
		#main_banner .ban_list {gap: 1.2rem;}
	    #main_banner .ban_list > li > a {
	    	min-height: 12rem;
	    	padding: 2rem;
	    }
		#main_banner .ban_list > li > a > p {line-height: 1.4;}
	    #main_banner .ban_list > li > a > p span {
	    	margin-bottom: 0.25rem;
	    }
	    #main_banner .ban_list > li > a > i {
			height: 4rem;
			margin-top: 1.6rem;
		}	    
	}
	@media (max-width: 480px){	
		#main_gallery .cont {height: 20rem;}
		#main_gallery .cont .gallery_slider{padding-bottom: 2.4rem;}
		#main_gallery .cont .gallery_slider a.thumb span.sbj{font-size: 1.6rem; }
		#main_gallery .head .gallery_slider_ctrl button {
	    	width: 2.8rem; height: 2.8rem;
	    	background-size: 1.6rem;
	    }
		
		#main_banner .ban_list > li > a > i {
			height: 3.6rem;
		}	
	}
	
	#main_link {
		width: 100%;
		margin-top: 5rem; padding: 2rem 0;
		background-color: #fff;
		border-top: 1px solid #D6DFEB;
	}
	#main_link .inner {
		display: flex;
		align-items: center;
	}
	#main_link .head {
		width: 200px;
	    display: flex;
	    justify-content: space-between;
	    align-items: center;
	}
	#main_link .head h3.tit{
	    font-size: 1.8rem;
	    font-weight: 700;
	    color: #111;
	}
	#main_link .head .ctrl button{
	    width:4rem; height: 4rem;
	    position: relative;
	    left: 0; right: 0; top:0; bottom: 0;
	    margin-top: 0;
	    text-indent: -9999em;
	    background-color: #E6E8EA;
	    background-repeat: no-repeat;
	    background-position: center center;
	    background-size: 2.4rem;
	    border-radius: 99rem;
	    transition : 0.2s all linear;
	}
	#main_link .head .link-button-next{
	    background-image:url('/images/susang/main/ico_slider_next.svg');
	}
	#main_link .head .link-button-prev{
	    background-image:url('/images/susang/main/ico_slider_prev.svg');
	}	
	#main_link .link_slider {
		flex-grow: 1;
		width: calc(100% - 200px);		
		margin-left: 2rem; padding: 0;
		overflow: hidden;
	}
	#main_link .link_slider .swiper-wrapper {
		align-items: center;
	}
	#main_link .link_slider img {
		width: auto; height: 100%;
		object-fit: contain;
	}
	
	@media (max-width: 1300px){
		#main_link {margin-top: 3rem;}
		#main_link .inner{margin: 0 3%;}
	}
	@media (max-width: 1024px){
				
		#main_link .head {width: 12rem;}
		#main_link .head h3.tit{font-size: 1.4rem;}
		#main_link .head .ctrl button{
		    width:3rem; height: 3rem;
		    background-size: 2rem;
		}		
		#main_link .link_slider {width: calc(100% - 10rem);}
	}
	@media (max-width: 768px){
		#main_link {
			margin-top: 2rem;
			padding: 1.6rem 0;
		}
		#main_link .head {
			width: 6rem;
			order:2;
		}
		#main_link .head h3 {display:none;}
		#main_link .head .ctrl button{
		    width: 2.4rem; height: 2.4rem;
		}	
		#main_link .link_slider {
			order: 1;
			width: calc(100% - 5rem);
			margin: 0 1rem 0 0;
		}
	}
	@media (max-width: 480px){}