.topHead {}

/*------------------------------------------------------------------------------------------------------
¼­ºêºñÁÖ¾ó
---------------------------------------------------------------------------------------------------------*/
.subVisualWrap {width:100%; margin:0; padding:0;}
.subVisual {
	/*display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:column;*/
	margin:0; padding:0; position:relative;
}

.subVisualText {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:column;
	justify-content:center;
	width:100%; height:100%; margin:0 auto; position:absolute;
}
.subVisualText div {
	flex-wrap:nowrap;
	max-height:100%; padding:5px;
}
	@media all and (max-width: 984px) {
		.subVisualText div  {height:90%;}
	}
	
.subVisualText div img {max-height:100%;}


/*------------------------------------------------------------------------------------------------------
¼­ºêºñÁÖ¾ó ³¡
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
ÇöÀçÀ§Ä¡
---------------------------------------------------------------------------------------------------------*/
.positionWrap {margin:-3px 0 0 0; padding:0; border-bottom:1px solid #ccc;}
	@media all and (max-width: 479px) {
		.positionWrap {display:none}
	}
	
	
.positionWrap .positionContainer {
	display:-webkit-flex;
	display:-moz-flex;
	display:-o-flex;
	display:-ms-flex;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	width:1260px; height:50px; line-height:50px; margin:0 auto; padding:0;
}
	/*************************************************
	phone
	*************************************************/
	@media all and (min-width: 320px) and (max-width: 768px) {
		.positionWrap .positionContainer {width:100%; margin:0 auto; display:none;}
	}
	/*************************************************
	pc
	*************************************************/
	@media all and (min-width: 1260px)  {
		.positionWrap .positionContainer {width:100%; max-width:1260px; margin:0 auto;}
	}
	
.positionWrap .positionContainer div {
	border-right:1px solid #ccc;
}
.positionWrap .positionContainer div a {
	display:block; padding:0 30px; text-decoration:none; text-transform:uppercase;
	font-size:1em; font-weight:bold;
}
.positionWrap .positionContainer div a:hover {background-color:#00c0cb; color:#fff;}

.positionWrap .positionContainer div:nth-child(1) {
	background-color:#00c0cb;
}
.positionWrap .positionContainer div:nth-child(1) a {color:#fff;}
.positionWrap .positionContainer div:nth-child(2) a {color:#00c0cb; font-weight:500;}
.positionWrap .positionContainer div:nth-child(2) a:hover {background-color:#fff; color:#00c0cb;}

/*------------------------------------------------------------------------------------------------------
ÇöÀçÀ§Ä¡ ³¡
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
¼­ºêŸÀÌƲ
---------------------------------------------------------------------------------------------------------*/
.subTitleContainer {margin:30px 0; padding:20px 0 0 0; text-align:left; background:url(/~snb2018/img/sub_title_bar.jpg) left top no-repeat;}
.subTitleContainer h1 {font-size:35px; color:#0061da; font-weight:500;}
	@media all and (min-width: 320px) and (max-width: 768px) {
		.subTitleContainer h1 {
			font-size:28px;
		}
	}
/*------------------------------------------------------------------------------------------------------
¼­ºêŸÀÌƲ ³¡
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
Àλ縻
---------------------------------------------------------------------------------------------------------*/
.greetContainer {
	display:-webkit-flex;
	display:flex;
	flex-direction:row;
	/*justify-content:space-between;*/
	width:100%; margin:25px auto 0; padding:0; background:url(/~snb2018/sub/images/greet_2.jpg) center top no-repeat; position:relative; text-transform:uppercase;
	font-weight:350;
}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.greetContainer {
			flex-direction:column;
			padding:0 5px;
		}
	}
	
.greetTitle {
	position:absolute; top:100px; left:0;
	font-size:74px; color:#e8e8e8; font-weight:900;
}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.greetTitle {
			top:120px; text-align:center;
			font-size:30px;
		}
	}

.greetContainer div {width:50%; margin-top:170px; text-align:left; border-right:1px solid #ccc;}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.greetContainer div {
			width:100%; border-right:none;
		}
	}
	
.greetContainer div:nth-child(2) {padding-right:70px;}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.greetContainer div:nth-child(2) {
			padding-right:0;
		}
	}
	
.greetContainer div:nth-child(3) {border-right:none; padding-left:70px;}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.greetContainer div:nth-child(3) {
			margin-top:0; padding-left:0;
		}
	}

.greetContainer div p {margin-bottom:30px;}
.greetContainer div p span {color:#ff7200; font-weight:700;}
.greetContainer div p strong {font-weight:700;}
/*------------------------------------------------------------------------------------------------------
Àλ縻 ³¡
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
ÆÐÅ°Áö
---------------------------------------------------------------------------------------------------------*/
.packageContainer {
	display:-webkit-flex;
	display:flex;
	flex-direction:row;
	/*justify-content:space-between;*/
	width:100%; margin:0 auto 30px; padding:0; position:relative; text-transform:uppercase;
	font-weight:350;
}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.packageContainer {
			flex-direction:column;
			padding:0 5px;
		}
	}
	
.packageContainer > div {width:50%;}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.packageContainer > div {
			width:100%; border-right:none;
		}
	}
	
.packageContainer > div:nth-child(1) {}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.packageContainer > div:nth-child(1) {
			padding-right:0;
		}
	}
	
.packageContainer > div:nth-child(2) {padding-top:30px;}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.packageContainer > div:nth-child(2) {
			padding-left:0; padding-right:0;
		}
	}
	
.packageContainer > div:nth-child(2) img {margin-bottom:30px;}

	/*
	¹«ÅëÀåÀԱݰèÁÂ
	-------------------------------------------------------*/
.packageContainer > div:nth-child(2) div.packageBank {
	display:-webkit-flex;
	display:flex;
	flex-direction:row;
	width:100%; margin:0; padding:0 30px;
}
	@media all and (min-width: 320px) and (max-width: 768px) {
		.packageContainer > div:nth-child(2) div.packageBank {
			flex-direction:column;
			padding-left:0; padding-right:0;
		}
	}
	
.packageContainer > div:nth-child(2) .packageBank div {
	margin:0; padding:25px 10px;
	font-size:20px; font-weight:500;
}
.packageContainer > div:nth-child(2) .packageBank div:nth-child(1) {
	width:30%; background-color:#5891e6;
	color:#fff;
}
	@media all and (min-width: 320px) and (max-width: 768px) {
		.packageContainer > div:nth-child(2) .packageBank div:nth-child(1) {
			width:100%;
		}
	}
	
.packageContainer > div:nth-child(2) .packageBank div:nth-child(2) {width:70%; background-color:#e1edff;}
	@media all and (min-width: 320px) and (max-width: 768px) {
		.packageContainer > div:nth-child(2) .packageBank div:nth-child(2) {
			width:100%;
		}
	}
	
	/*
	ÁÖÀÇ»çÇ×
	-------------------------------------------------------*/
.packageText {width:100%; margin:30px auto 0; padding:0 30px; text-align:left;}
	@media all and (min-width: 320px) and (max-width: 768px) {
		.packageText {
			width:100%; padding-left:0; padding-right:0;
		}
	}
	
.packageText p {padding:5px 0 5px 20px;}
.packageText p i {
	margin-right:10px;
	font-size:24px; color:#797979;
}
.packageText p i.fa-phone-square {margin-left:20px;}
/*------------------------------------------------------------------------------------------------------
ÆÐÅ°Áö ³¡
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
°´½Ç¾È³»
---------------------------------------------------------------------------------------------------------*/
.roomWrap {
	display:-webkit-flex;
	display:flex;
	flex-direction:column;
	width:100%; margin:0; padding:0;
}
	
.roomWrap .roomContainer {
	display:flex;
	flex-direction:row;
	/*justify-content:space-between;*/
	margin:0 0 60px 0;
}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.roomWrap .roomContainer {
			flex-direction:column;
			padding:0 5px;
		}
	}

.fotoSlide {width:497px; margin:0; padding:0; position:relative;}
	@media all and (min-width: 320px) and (max-width: 768px) {
		.fotoSlide {width:100%;}
	}
	
.fotoTitle {margin-right:60px;}
	@media all and (min-width: 320px) and (max-width: 768px) {
		.fotoTitle {margin-right:0;}
	}
	
.fotoTable {
	display:flex;
	flex-direction:column;
	margin:0; padding:0;
}
.fotoTable > div {
	display:flex;
	flex-direction:row;
	margin:-1px 0 0 -1px; padding:0; border-top:1px solid #ccc; border-left:1px solid #ccc; border-right:1px solid #ccc;
}
.fotoTable > div.roomType {
	width:100%; margin:0; padding:15px 0 15px 20px; background-color:#F3F3F3; text-align:center;
	/*font-size:24px; font-weight:500;*/
}
.fotoTable > div:last-child {border-bottom:1px solid #ccc;}
.fotoTable > div div {padding:15px 10px; text-align:left;}

.fotoTableTitle {
	width:142px; border-right:1px solid #ccc;
	font-weight:bold;
}
	@media all and (min-width: 320px) and (max-width: 400px) {
		.fotoTableTitle {width:50%; border-right:none;}
	}
	@media all and (min-width: 401px) and (max-width: 768px) {
		.fotoTableTitle {width:30%; border-right:none;}
	}
	
.fotoTableTitle i {margin-right:15px;}
	@media all and (min-width: 320px) and (max-width: 768px) {
		.fotoTableTitle i {display:none;}
	}
	
.fotoTableCon {width:448px;}

	/*°´½Ç ÀÌ¿ë¿ä±Ý ŸÀÌƲ*/
.roomCostTitle {
	width:80%; margin:0 auto 50px; padding:25px 0; border-top:1px solid #ed3092; border-bottom:1px solid #ed3092;
	font-size:30px; color:#ed3092; font-weight:700;
}
/*------------------------------------------------------------------------------------------------------
°´½Ç¾È³» ³¡
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
½Ã¼³¾È³» ³¡
---------------------------------------------------------------------------------------------------------*/
.faciWrap {
	display:-webkit-flex;
	display:flex;
	flex-direction:row;
	width:100%; margin:0 0 50px 0; padding:0;
}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.faciWrap {
			flex-direction:column;
			padding:0 5px;
		}
	}

.faciSlide_room {width:497px; margin:0 80px 0 0; padding:0; position:relative;}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.faciSlide_room {width:100%; margin-right:0;}
	}
	
.faciCon_room {width:700px; text-align:left;}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.faciCon_room {width:100%;}
	}
	
.faciCon_room h2 {
	margin:0 0 50px 0; padding:27px 0 0 0; display:inline-table; border-top:2px solid #353535;
	font-size:36px; color:#fe5a00; font-weight:normal;
}

.faciSlide_etc {width:497px; margin:0 0 0 80px; padding:0; position:relative;}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.faciSlide_etc {width:100%; margin-left:0;}
	}
	
.faciCon_etc {width:650px; text-align:right;}
	@media all and (min-width: 320px) and (max-width: 1127px) {
		.faciCon_etc {width:100%;}
	}
	
.faciCon_etc h2 {
	margin:0 0 50px 0; padding:27px 0 0 0; display:inline-table; border-top:2px solid #353535;; letter-spacing:-1px;
	font-size:36px; color:#fe5a00; font-weight:normal;
}
/*------------------------------------------------------------------------------------------------------
½Ã¼³¾È³» ³¡
---------------------------------------------------------------------------------------------------------*/

/*-------------------------------------------------------------------------------------------------
¾à°ü¸Þ´º
-------------------------------------------------------------------------------------------------*/
.stAgree {float:right;}
.stAgree ul {margin:0; padding:0; list-style:none;}
.stAgree li {
	margin:0; padding:0; text-align:right;
	font-family:'Spoqa Han Sans', SpoqaHanSans, 'Spoqa Han Sans JP', '½ºÆ÷Ä« ÇÑ »ê½º', ½ºÆ÷Ä«Çѻ꽺, 'Sans-serif'; font-size:13px; line-height:25px;
}
/*-------------------------------------------------------------------------------------------------
¾à°ü¸Þ´º ³¡
-------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
¾à°ü ÆäÀÌÁö 
---------------------------------------------------------------------------------------------------------*/
.agreeContainer {float:left; width:100%; margin:0 0 30px 0; padding:0; text-align:left; position:relative;
	font-size:16px; line-height:30px;
}
.agreeContainer  h1 {
	margin:0; padding:10px 0; border-top:1px solid #ccc; border-bottom:1px solid #ccc;
	font-size:24px; font-weight:bold;
}
.agreeContainer  h3 {font-weight:bold;}
.agreeContainer p {
	text-align:left; margin:10px 0 0 0;
	font-size:16px; line-height:30px; font-weight:400; word-break:keep-all;

}
.agreeContainer ul {margin:10px 0 0 30px; padding:0; list-style:none;}
.agreeContainer li {margin:0; padding:0;}
/*------------------------------------------------------------------------------------------------------
¾à°ü ÆäÀÌÁö ³¡
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
·Î±×ÀÎ
---------------------------------------------------------------------------------------------------------*/
.memberWrap {clear:both; height:477px; margin:50px auto; padding:0; position:relative;}
.memberWrap h3 { font-weight:400;}

.loginWrap {width:100%;}
.loginWrap .loginContainer {
	width:370px; height:477px; margin:0 auto; padding:0 0 30px 0; text-align:center; position:relative; background-color:#FFFFFF;
	border:1px solid #dfdfdf; box-shadow: 0 0 50px #eaeaea;
}
.loginWrap .loginContainer  h1 {
	margin:0 auto; padding:25px 0 10px 0;
	font-size:28px; font-weight:bold; color:#f84101;
}
.loginWrap .loginContainer ul {width:80%; margin:0 auto; padding:0; list-style:none;}
.loginWrap .loginContainer li {
	margin:25px 0 0 0; padding:0; text-align:left;
	font-size:16px; font-weight:bold; color:#868686;
}
.loginWrap .loginContainer li:nth-child(1) { border-bottom:2px solid #333;}
.loginWrap .loginContainer li:nth-child(2) { border-bottom:2px solid #333;}
.loginWrap .loginContainer li:nth-child(4) input {
	width:100%; margin:0; padding:10px 0; background-color:#2e1753; border:none; text-align:center;
	font-size:16px;
}
.loginWrap .loginContainer li input.stLoginInput {
	width:100%; height:30px; line-height:30px; border:none;
	font-size:14px; color:#333;
}
.loginWrap .loginContainer li input.stLoginBtn {width:294px; height:51px; margin:0; padding:0;}
.loginWrap .loginContainer li.stFind {
	display:block; width:100%; height:51px; line-height:51px; background:#353535; margin:3px auto 0; padding:0; text-align:center;
	font-size:19px; color:#fff;
}
.loginWrap .loginContainer li.stFind a {color:#fff;}
.loginWrap .loginContainer li.stFind a:hover {text-decoration:none;}

/*------------------------------------------------------------------------------------------------------
·Î±×ÀÎ ³¡
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
ȸ¿ø°¡ÀÔ
---------------------------------------------------------------------------------------------------------*/
.memberJoinWrap {width:1100px; margin:25px auto; padding:0; position:relative;}
.memberJoinWrap .memberJoinContainer {margin:0; padding:0;}
.memberJoinWrap .memberJoinContainer h1 {
	width:100%; margin:0; padding:10px 0; background-color:#f5f5f5; text-align:center; border-top:1px solid #ccc; border-left:1px solid #ccc; border-right:1px solid #ccc;
	font-size:26px; color:#353535;
}
.memberJoinWrap .memberJoinContainer span.joinAccept {display:block; margin:0 auto; padding:25px 0;}

.memberJoinWrap .memberJoinContainer .agree_1 {margin:0 auto; padding:0; clear:both;}
.memberJoinWrap .memberJoinContainer .agree_1 textarea {
	width:100%; height:350px; margin:0; padding:30px; line-height:24px; border:1px solid #ccc;
}

.memberJoinWrap p {text-align:center; margin:28px auto 0; padding:0;}

/*°¡ÀÔÀÔ·ÂÆû*/
.memberJoinWrap .memberJoinContainer .joinInputFormWrap {margin:0 auto; padding:0; /*padding:30px 0 0 0; */clear:both;}

.joinInputFormContainer {margin:0; padding:0;}
.joinInputFormContainer ul {margin:0; padding:0; list-style:none;}
.joinInputFormContainer li {height:58px; line-height:58px; margin:0 0 1px 0; padding:0;}
.joinInputFormContainer li:first-child {border-top:3px solid #2e1753;}
.joinInputFormContainer li dl {width:100%; margin:0; padding:0; list-style:none;}
.joinInputFormContainer dt {
	float:left; width:20%; height:58px; line-height:58px;margin:0; padding:0 0 0 20px; text-align:left; background-color:#fbfbfb; border-bottom:1px solid #ccc;
	font-size:16px; font-weight:600;
}
.joinInputFormContainer dd {
	float:left; width:80%; height:58px; line-height:58px;display:block; margin:0; padding:0 0 0 20px; text-align:left; border-bottom:1px solid #ccc; position:relative;
	font-size:14px;
}
.joinInputFormContainer dd input {width:300px; height:39px; border-radius:2px; border:1px solid #999; margin:8px 0 0 0; padding:0;}
.joinInputFormContainer dd select {width:100px; height:39px; border-radius:2px; border:1px solid #999; margin:8px 0 0 0; padding:0;}
.joinInputFormContainer dd textarea {width:100%; height:39px; margin:0; padding:0; border-radius:2px; border:1px solid #999; vertical-align:middle;}
.joinInputFormContainer dd input.inputCkc {width:15px; height:15px; margin:0; padding:0; vertical-align:middle; margin:0; padding:0;}

/*------------------------------------------------------------------------------------------------------
ȸ¿ø°¡ÀÔ ³¡
---------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------------------
¾ÆÀ̵ð/Æнº¿öµå ã±â
---------------------------------------------------------------------------------------------------------*/
.passLostWrap {width:500px; margin:0 auto; padding:0; text-align:center;}
.passLostWrap h1 {
	margin:30px auto; padding:0;
	font-size:24px;
}
.passLostWrap h1 span {color:#29ae6e;}
.passLostWrap input {width:300px; height:39px; line-height:39px; margin:0; padding:0; border-radius:2px; border:1px solid #999; text-align:center;}
.passLostWrap .autoInput {margin:30px auto 0; padding:0;}
.passLostWrap .autoInput input {width:150px; margin-left:20px; margin-top:-45px; vertical-align:middle;}
.passLostWrap .autoInputText {margin:20px 0 30px 0;}
.autoInputBtn {margin-top:30px;}
/*------------------------------------------------------------------------------------------------------
¾ÆÀ̵ð/Æнº¿öµå ã±â ³¡
---------------------------------------------------------------------------------------------------------*/