@charset "utf-8";
.section1 {
	height: 100vh;
}
.mainSlider .sloganWrap { top: 46%; }
/* 슬라이더 슬로건 */
.sloganWrap {
	position: absolute;
	top: 50%; left: 50%;
	margin: auto;
	font-family: 'Montserrat', sans-serif;
	color: #fff;
	transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	text-align: center;
	user-select: none;
	z-index: 1;
	overflow: hidden;
}
.sloganWrap h5 {
	font-family: 'Montserrat', sans-serif;
	font-size: 60px;
	line-height: 54px;
	color:rgba(255,255,255,1);
	margin: 1vw 0;
	white-space: nowrap;
}
.sloganWrap h6 {
	font-family: 'Noto Sans KR', sans-serif;
	font-size: 20px;
	color:rgba(255,255,255,1);
}

/* 슬라이더 view */
.viewObj {
	position: absolute;
	right: 30px; bottom: 54px;
	height: 27px;
	line-height: 27px;
	font-size: 15px;
	color: #fff;
	z-index: 10;
}
.viewObj i { cursor: pointer; }
.viewObj #icon-play { margin-right: 3px;}

/* 메인슬라이드 마우스 오버 애니효과 */
.owl-carousel .owl-nav button.owl-prev {
	display: inline-block;
	width: 17%;
	height: 26px;
	overflow: hidden;
}
.owl-carousel .owl-nav button.owl-prev .btn_motion {
	display: inline-block;
	width: 400%;
}
.owl-carousel .owl-nav button.owl-prev:hover .btn_motion {
	animation-name: leftRepeat;
	animation-duration: 10s;
	animation-iteration-count: infinite;
}
.owl-carousel .owl-nav button.owl-next {
	display: inline-block;
	width: 17%;
	height: 26px;
	overflow: hidden;
}
.owl-carousel .owl-nav button.owl-next .btn_motion {
	display: inline-block;
	width: 400%;
	float: right;
}
.owl-carousel .owl-nav button.owl-next:hover .btn_motion {
	animation-name: rightRepeat;
	animation-duration: 10s;
	animation-iteration-count: infinite;
}
.btn_motion i { display: none; }
.btn_motion i:first-child { display: block; }
.btn_motion i { display: inline-block; width: 25%; float: left; text-align: center;}


/* 슬라이더 페이지 */
.pageObj {
	position: absolute;
	right: 0; left: 0; bottom: 54px;
	width: 150px; height: 27px;
	margin: auto;
	line-height: 27px;
	font-family: 'Montserrat', sans-serif;
	font-size: 24px; font-style: italic;
	color: #fff;
	text-align: center;
	z-index: 10;
}


@media ( max-width: 1365px ) {
	.section1 {
		height: 70vh;
	}
	.firstSlider .owl-carousel .owl-item img {
		width: 100%;
		height: 100%;
		transition: width 0.3s;
	}
	.sloganWrap h5 {
		font-size: 45px;
		line-height: 45px;
	}
	.owl-nav { 
		bottom: 32px;
		width: 145px;
	}
	.owl-nav i:before {
		font-size: 14px;
	}
	.pageObj {
		bottom: 32px;
		width: 90px;
		font-size: 15px;
	}
	.viewObj {
		right: 20px; bottom: 32px;
		font-size: 12px;
	}
}
@media ( max-width: 719px ) {
	.section1 {
		height: auto;
		padding-top: 56.25%;
	}
	.firstSlider {
		position: absolute;
		top: 0; right: 0; bottom: 0; left: 0;
		margin: auto;
	}
	.firstSlider .owl-carousel .owl-item img {
		width: auto;
		object-fit: cover;
		object-position: center;
	}
	.owl-nav {
		bottom: 7%;
	}
	.pageObj {
		bottom: 7%;
	}
	.sloganWrap img {
		max-width: 8%;
	}
	.sloganWrap h5 {
		font-size: 34px;
		line-height: 34px;
	}
	.sloganWrap h6 {
		font-size: 12px;
	}
	.viewObj {
		right: 0; left: 0; bottom: -9.9vw;
		height: 10vw;
		line-height: 10vw;
		text-align: center;
		animation-name: none!important;
	}
	.viewObj .play-pause {
		position: absolute;
		width:40px;
		top: 0; right: 25px;
		font-size: 1.4em;
		line-height: 65px;
		z-index: 999;
	}
}
@media ( max-width: 380px ) {
	.viewObj {
		bottom: auto;
		line-height: 20vw;
	}
	.section1-line {
		height: 20vw;
	}
}




.service1 .sloganWrap .sub_title {
	font-family: 'Quicksand', sans-serif;
	font-size: 22px;
	line-height: 25px;
	color: rgba(255,255,255,1);
}

.service1 .sloganWrap .btn_info {
	display: inline-block;
	width: 60px; height: 60px;
	line-height: 60px;
	margin-top: 30px;
	font-family: 'Montserrat', sans-serif;
	font-size: 18px;
	color: #fff;
	border: 1px solid #fff;
	border-radius: 100%;
}
.service1 .firstSlider .loader::after {
	content: '';
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	margin: auto;
	background: rgba(0,0,0,0);
}



@media (max-width: 719px) {
	.service1.section1 {
		padding-top: calc(56.25% + 65px);
	}
	.service1.section1 .firstSlider {
		bottom: auto;
		height: calc(100% - 65px);
	}
	.service1 .sloganWrap .sub_title {
		font-size: 12px;
	}
	.service1 .sloganWrap .btn_info {
		width: 40px; height: 40px;
		margin-top: 20px;
		line-height: 40px;
		font-size: 14px;
	}
	.service1 .owl-nav { bottom: -33px; }
	.service1 .viewObj {
		position: absolute;
		bottom: -65px;
		left: 0;
		height: 65px;
		background: #7e8389;
		z-index: 0;
	}
	.service1 .viewObj a {
		display: none;
		margin-top: 18px;
	}
	.service1 .pageObj { bottom: -37px; }

}



.service2 {
	overflow: hidden;
}
.service2_wrap {
	position: relative;
}
.service2 .title_wrap {
	position: relative;
	width: 100%;
	min-height: 145px;
	margin-top: 70px;
	border-bottom: 1px solid #ddd;
	text-align: center;
}
.service2 .title_wrap .title {
	position: relative;
	display: inline-block;
	margin-bottom: 25px;
	padding-bottom: 17px;
	font-size: 15px;
	font-weight: bold;
	color: #2d2f31;
	letter-spacing: -0.03em;
}
.service2 .title_wrap .title::after {
	content: '';
	position: absolute;
	right: 0; bottom: 0; left: 0;
	margin: auto;
	width: 100%; height: 4px;
	background: #2d2f31;
	transition: height 0.3s;
}
.service2 .service_list {
	position: relative;
	width: 1200px;
	margin: auto;
	padding-bottom: 25px;
	letter-spacing: -0.03em;
	text-align: cenver;
}
.service2 .service_list a {
	margin-right: 30px;
	font-size: 15px;
	color: #7e8389;
	line-height: 35px;
	transition: color 0.3s;
	white-space: nowrap;
}
.service2 .service_list a:hover, .service2 .service_list a.SEL {
	font-weight: bold;
	color: #2d2f31;
}

@media ( max-width: 1365px ) {
	.service2 .service_list {
		width: 100%;
		height: 35px;
		margin-left: 20px;
		overflow-x: scroll;
		overflow-y: hidden;
		white-space: nowrap;
		text-align: center;
	}
		/* scroll */
	.service2 ::-webkit-scrollbar {
		height: 5px;
	}
	.service2 ::-webkit-scrollbar-track {
		background: transparent;
	}
	.service2 ::-webkit-scrollbar-thumb {
		background: #aaa;
	}
}


.service3 {
	overflow: hidden;
}
.service3_wrap {
	position: relative;
}
.service3_wrap .img_wrap {
	display: inline-block;
	width: 41.667vw;
	padding-top: 157px;
	vertical-align: top;
}
.service3_wrap .img_wrap .service3_deco {
	width: 100%;
	margin-bottom: 76px;
	text-align: right;
}
.service3_wrap .img_wrap .loader {
	width: 100%; height: 56vw;
}

.service3_wrap .info_wrap {
	display: inline-block;
	width: calc(100% - 41.67vw);
	height: 100%;
	padding-left: 12vw;
	background: url(./../../images/service/ser3_2.jpg) right top no-repeat;
	background-size: 200px 380px;
	vertical-align: top;
	box-sizing: border-box;
}
.service3_wrap .info_wrap .content {
	width: 500px;
	padding-top: 22vw;
}

.service3_wrap .info_wrap h5 {
	margin-bottom: 10px;
	font-family: 'Montserrat', sans-serif;
	font-size: 15px;
	color: #2d2f31;
}
.service3_wrap .info_wrap h6 {
	font-family: 'Quicksand', sans-serif;
	font-size: 48px;
	line-height: 52px;
	color: rgba(45,47,49,1);
}
.service3_wrap .content_info {
	margin-top: 70px;
	border-top: 1px solid #4c4d4e;
}
.service3_wrap .content_info .title {
	padding-top: 18px;
	font-family: 'Montserrat', sans-serif;
	font-style: italic;
	font-size: 15px;
	font-weight: bold;
	letter-spacing: -0.03em;
	color: #2d2f31;
}
.service3_wrap .content_info .txt {
	margin-top: 50px;
	font-size: 14px;
	letter-spacing: -0.03em;
	color: #7e8389;
	line-height: 24px;
}
.service3_wrap .content_info .notice {
	margin-top: 30px;
	font-size: 14px;
	color: #2d2f31;
	letter-spacing: -0.03em;
}
.service3_wrap .content_info .notice li {
	margin-bottom: 6px;
	line-height: 22px;
}
.service3_wrap .content_info .notice i {
	display: inline-block;
	margin-right: 5px;
}



@media ( max-width: 1365px ) {
	.service3_wrap .img_wrap {
		padding-top: 85px;
	}
	.service3_wrap .img_wrap .loader {
		width: 100%;
	}

	.service3_wrap .info_wrap {
		padding-left: 8vw;
		background-size: 150px 285px;
	}

}


@media ( max-width: 1024px ) {
	.service3_wrap .info_wrap .content {
		width: 400px;
		margin-right: 20px;
	}
}


@media ( max-width: 880px ) {
	.service3_wrap .img_wrap {
		display: block;
		width: calc(100% - 40px);
		height: 100%;
		margin: auto;
	}
	.service3_wrap .img_wrap .loader {
		height: 100vw;
	}

	.service3_wrap .info_wrap {
		display: block;
		width: calc(100% - 40px);
		margin: auto;
		padding-left: 0;
	}
	.service3_wrap .info_wrap .content {
		width: calc(100% - 180px);
		padding-top: 63px;
	}
	.service3_wrap .info_wrap h6 {
		font-size: 34px;
		line-height: 38px;
	}
	.service3_wrap .content_info {
		margin-top: 60px;
	}
	.service3_wrap .content_info .title {
		padding-top: 13px;
		font-size: 12px;
	}
}


@media ( max-width: 640px ) {
	.service3_wrap .info_wrap {
		background-size: 75px 145px;
	}
	.service3_wrap .info_wrap .content {
		width: 100%;
	}
}


.section4 { overflow: hidden; }
.section4 .fixed_list {
	overflow: hidden;
}
.section4 .fixed_list a {
	position: relative;
	display: block;
	width: 100%; height: 36.459vw;
	background-attachment: fixed;
	overflow: hidden;
}
.section4 .fixed_list .fixed_hidden {
	clip: rect(0, auto, auto, 0);
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
}
.section4 .fixed_list .fixed_hidden img {
	position: fixed;
	top: 0; right: 0; bottom: 0; left: 0;
	margin: auto;
	width: 100%;
}
.section4 .fixed_list .loader::before {
	content: '';
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	margin: auto;
	background: #000;
	opacity: 0.55;
	transition: opacity 1s;
}
.section4 .fixed_list .loader:hover::before {
	opacity: 0;
}
.section4 .fixed_list .section4_txt {
	position: absolute;
	top: 50%; left: 16.5vw;
	transform: translateY(-50%);
	margin: auto;
}
.section4 .fixed_list .section4_txt .TRAN {
	transform: translateY(50%);
}
.section4 .fixed_list  .section4_txt .txt1 {
	font-family: 'Montserrat', sans-serif;
	font-size: 54px;
	line-height: 65px;
	color: rgba(255,255,255,1);
}
.section4 .fixed_list  .section4_txt .txt2 {
	font-family: 'Malgun Gothic', sans-serif;
	font-size: 14px;
	font-style: normal;
	color: rgba(255,255,255,1);
	line-height: 20px;
}


/* go  마우스오버 애니 효과 */
.fixed_list .section4_txt .btn_line {
	transform: translateX(-30%);
}
.fixed_list .section4_txt .btn_line::before {
	transition: background 0.5s;
}
.fixed_list a:hover .section4_txt .btn_line::before {
	background: #fff;
}
.fixed_list .section4_txt .go {
	transition: color 0.5s;
}
.fixed_list a:hover .section4_txt .go {
	width: 400%;
	text-align: center;
	animation-name: leftRepeat;
	animation-duration: 10s;
	animation-iteration-count: infinite;
	color: #fff;
}



@media (max-width: 1600px) {
	.section4 .fixed_list a {
		height: 36.5vw;
	}
	.section4 .fixed_list .section4_txt .txt1 {
		font-size: 40px;
		line-height: 50px;
	}
	.section4 .fixed_list .section4_txt .btn_go_left {
		margin-top: -15px;
	}
}

@media ( max-width: 1024px ) {
	.section4 .fixed_list a {
		background-attachment: inherit;
	}
	.section4 .fixed_list .fixed_hidden img {
		position: relative;
		max-width: 100%;
	}
	
}

@media ( max-width: 768px ) {
	.section4 .fixed_list .section4_txt .txt1 {
		font-size: 28px;
		line-height: 31px;
	}
	.section4 .fixed_list .section4_txt .btn_go_left {
		margin-top: -10px;
	}
	.section4 .fixed_list .section4_txt .txt2 {
		margin-top: 0;
		font-size: 12px;
	}
	.section4 .fixed_list .section4_txt {
		left: 3.5vw;
	}
}
@media ( max-width: 640px ) {
	.section4 .fixed_list a {
		height: 50.5vw;
	}
	.section4 .fixed_list .section4_txt .txt2 {
		line-height: 20px;
	}
}
@media ( max-width: 430px ) {
	.section4 .fixed_list a {
		height: 62.5vw;
	}
	.section4 .fixed_list .fixed_hidden img {
		height: 100%;
	}
}


.preview {
	overflow: hidden;
}
.preview_wrap {
	position: relative;
	width: 100%; height: 480px;
	overflow: hidden;
}
.preview_wrap::before {
	content: '';
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	margin: auto;
	background: rgba(0,0,0,0.45);
}
.preview_wrap::after {
	content: '';
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	margin: auto;
	background: url(./../images/previewBg.png) center bottom no-repeat;
}
.preview_wrap .slogan {
	position: absolute;
	top: 49%; right: 0; left: 0;
	margin: auto;
	transform: translateY(-50%);
	text-align: center;
}
.preview_wrap .slogan .adjective {
	margin-bottom: 18px;
	font-family: 'Meie Script', cursive;
	font-size: 36px;
	color: #fff;
}
.preview_wrap .slogan h5 {
	font-family: 'Montserrat', sans-serif;
	font-size: 54px;
	color: #fff;
}

.preview_tab {
	position: absolute;
	right: 0; bottom: 0; left: 0;
	margin: auto;
	width: 100%; height: 47px;
	text-align: center;
}
.preview_tab .tab {
	position: relative;
	display: inline-block;
	margin: 0 18px;
	padding: 16px 0;
	font-size: 15px;
	font-weight: bold;
	color: #7e8389;
}
.preview_tab .tab::after {
	content: '';
	position: absolute;
	right: 0; bottom: 0; left: 0;
	margin: auto;
	width: 100%; height: 0;
	background: #fff;
	transition: height 0.5s;
}
.preview_tab .tab.tab_ov, .preview_tab .tab:hover {
	color: #fff;
}
.preview_tab .tab:hover::after, .preview_tab .tab.tab_ov::after {
	height: 4px;
}

/* 예약 커뮤니티 타이틀 */
.commTitle {
	position: relative;
	padding-top: 9vw;
	padding-bottom: 75px;
	color: #2d2f31;
	text-align: center;
}
.commTitle h5 {
	position: relative;
	font-family: 'Montserrat', sans-serif;
	font-size: 34px;
}
.commTitle h6::before {
	content: '';
	display: block;
	width: 100px; height: 1px;
	margin: 20px auto;
	background: #4c4d4e;
}
.commTitle h6 {
	font-size: 15px;
	font-style: italic;
	letter-spacing: -0.03em;
}


@media ( max-width: 1300px ) {
	.preview {
		height: 41vh;
		min-height: 340px;
	}
	.preview_wrap {
		height: 100%;
	}
	.preview_wrap .slogan {
		position: absolute;
		top: 40%; right: 0; left: 0;
		margin: auto;
		transform: translateY(-50%);
		text-align: center;
	}
	.preview_wrap .slogan .adjective {
		margin-bottom: 10px;
	}
	.preview_wrap .slogan h5 {
		font-size: 34px;
	}
}


@media ( max-width: 770px ) {
	.preview_tab {
		white-space: nowrap;
		overflow-x: scroll;
		overflow-y: hidden;
	}
	/* scroll */
	.preview ::-webkit-scrollbar {
		height: 5px;
	}
	.preview ::-webkit-scrollbar-track {
		background: transparent;
	}
	.preview ::-webkit-scrollbar-thumb {
		background: #aaa;
	}

	.commTitle {
		padding-top: 65px;
		padding-bottom: 65px;
	}
}

@media ( max-width: 440px ) {
	.commTitle {
		padding-top: 60px;
		padding-bottom: 60px;
	}
	.commTitle h6 {
		width: 65%;
		margin: auto;
		line-height: 24px;
	}
	
	.commTitle .commR_h5::after {
		content: 'GUIDE & \A RESERVATION';
		white-space: pre;
		line-height: 38px;
	}

}