@charset "utf-8";
.mainbar {width: 100%; background: url('/html/images/main/main_bar.jpg') repeat center left; background-size: cover; text-align: center;}
.mainbar h1 { color: #fff; font-size: 22px; line-height: 68px; letter-spacing: 3px;}

.bx-wrapper { position:relative; z-index:1;}

.main01_00 {}
.mainbox { width: 100%; height: 100%; padding: 30px; background: #d6967b;}
.typoWrap {position:relative; overflow:hidden; width: 100%; margin: 0 auto; z-index: 3;}
.typoCon { position:absolute; z-index: 2; left: 2%; bottom: 2%; font-size: 50px; line-height: 60px; color: #fff; font-weight: bold; opacity: 0.8; letter-spacing: 10px;}
#vimeoWrap{
	padding-bottom: 56.25%;
}
.obj { position: absolute; }
.main01_01 {
	position: relative;
	width: 100%;
	text-align: center;
}
.main01_01 > .obj01 {
	top: 0;
	left: 0;
}
.main01_01 > .obj02 {
	top: 0;
	right: -70px;
}
.main01_01 > .obj03 {
	top: 13.5%;
	left: 8px;
}
.main01_01 > .obj04 {
	top: 10.1%;
	right: 0;
}
.main01_01 .content01 {
	width: 100%;
	background: url('/html/images/main/bg01.jpg');
}
.main01_01 .content01 .img {
	width: 80%;
	margin: 0 auto;
}
.main01_01 .txt {
	padding: 80px 0;
	width: 100%;
}
.main01_01 .txt span {
	display: block;
	font-size: 16px;
	color: #cd8161;
	letter-spacing: 5px;
}
.main01_01 .txt h1 {
	line-height: 80px;
	font-size: 60px;
	color: #cd8161;
	letter-spacing: 3px;
	padding: 15px 0 30px;
}
.main01_01 .txt p {
	line-height: 25px;
	font-size: 16px;
	color: #636363;
}
.main01_01 .content02 {
	width: 100%;
	background: url('/html/images/main/bg02.jpg');
	padding-bottom: 5%;
}
.main01_01 .content02 .special {
	width: 100%;
}
.main01_01 .content02 .special:after {
	display: block;
	content: '';
	clear: both;
}
.main01_01 .content02 .special .img_00 {
}
.main01_01 .content02 .special > .left {
	float: left;
	width: 35%;
	text-align: right;
}
.main01_01 .content02 .special > .middle {
	float: left;
	width: 30%;
	text-align: center;
}
.main01_01 .content02 .special > .right {
	float: left;
	width: 35%;
	text-align: left;
}
.m_special .swiper-wrapper .swiper-slide img {
	width: 60%;
	margin: 0 auto;
}
.main01_02 {
	width: 100%;
}

.main01_03 {
	display: table;
	width: 100%;
	position: relative;
}
.main01_03:after {
	display: block;
	content: '';
	clear: both;
}
.main01_03 .left{
	width: 50%;
	display: table-cell;
}
.main01_03 .right{
	position: relative;
	display: table-cell;
	width: 50%;
}
.main01_03 .right > .logo_image img{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}
.main01_04 {
	background: url('/html/images/main/img05.jpg') no-repeat center center;
	background-size: cover;
	text-align: center;
	padding: 12.5% 0
}
.main01_04 p {
	color: #424242;
	font-size: 20px;
	font-weight: bold;
	line-height: 30px;
}
.main01_05 {
	position: relative;
	width: 100%;
	text-align: center;
}
.main01_05 .txt {
	padding: 80px 0;
	width: 100%;
}
.main01_05 .txt span {
	display: block;
	font-size: 16px;
	color: #cd8161;
	letter-spacing: 5px;
}
.main01_05 .txt h1 {
	line-height: 80px;
	font-size: 60px;
	color: #cd8161;
	letter-spacing: 3px;
	padding: 15px;
}
.main01_05 .txt p {
	line-height: 23px;
	font-size: 16px;
	color: #636363;
}
.main01_05 .obj05 {
	top: 150px;
	left: -50px;
}
.main01_05 .obj06 {
	top: 0;
	right: 0;
}
@media (max-width: 1024px) {
	.obj {
		display: none;
	}
}
@media (max-width: 800px) {
	.block800 { display: block !important;}
	.mainLogo {
		width: 50% !important
	}
	.topArea .lSAction > a {
		display: none;
	}
	.mainbar h1 {
		color: #fff;
		font-size: 15px;
		line-height: 50px;
		letter-spacing: 3px;
	}
	.main01_00 {
		padding: 10px;
		display: none;
	}
	.main01_00 > .typoCon {
		font-size: 18px;
		font-weight: bold;
		line-height: 23px;
		letter-spacing: 3px;
	}
	.main01_01 .content01 .img {
		width: 90%;
	}
	.main01_01 .txt {
		padding: 25px 0;
		width: 80%;
		margin: 0 auto;
	}
	.main01_01 .txt span {
		display: block;
		font-size: 12px;
		color: #cd8161;
		letter-spacing: 5px;
	}
	.main01_01 .txt h1 {
		line-height: 33px;
		font-size: 30px;
		color: #cd8161;
		letter-spacing: 0px;
		padding: 10px 0 15px;
	}
	.main01_01 .txt p {
		line-height: 20px;
		font-size: 12px;
		color: #636363;
	}
	.main01_01 .content02 {
		padding-bottom: 8%;
	}
	.main01_01 .content02 .special > .left {
		float: left;
		width: 50%;
		text-align: right;
		padding: 0 5px 0 10px;
		box-sizing: border-box;
	}
	.main01_01 .content02 .special > .middle {
		float: left;
		width: 50%;
		text-align: center;
		padding: 0 10px 0 5px;
		box-sizing: border-box;
	}
	.main01_01 .content02 .special > .right {
		float: left;
		display: none;
		width: 35%;
		text-align: left;
	}
	.main01_03 .right > .logo_image img {
		width: 80%;
	}
	.main01_04 p {
		color: #424242;
		font-size: 10px;
		font-weight: bold;
		line-height: 18px;
	}
	.main01_05 .txt {
		padding: 25px 0;
		width: 80%;
		margin: 0 auto;
	}
	.main01_05 .txt span {
		display: block;
		font-size: 12px;
		color: #cd8161;
		letter-spacing: 5px;
	}
	.main01_05 .txt h1 {
		line-height: 30px;
		font-size: 25px;
		color: #cd8161;
		letter-spacing: 0px;
		padding: 10px;
	}
	.main01_05 .txt p {
		line-height: 20px;
		font-size: 12px;
		color: #636363;
	}


}
.mainMovie { position:relative; overflow:hidden; z-index:1;}
.mainMovie > div { position:absolute; width:100%; /* padding-bottom:56.25%; */ left:50%; top:50%; transform: translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); }
.mainMovie > div > video {
	margin-top: -90px;
}
.movie_thum { position:absolute; min-width:100%; min-height:100%; left:50%; top:50%; transform: translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); background:url(../images/main/movieBg.jpg) center bottom; background-size:cover !important; }
.movie_thum i { position:absolute; width:50px; height:50px; font-size:20px; line-height:50px; text-align:center; left:50%; top:50%; transform: translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); background:rgba(255, 255, 255, 0.3); border-radius:50%;}
.mainMovie iframe { position:absolute; min-width:100%; min-height:100%; left:50%; top:50%; transform: translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);}
.main_video {position: absolute; top: 50%; left: 50%; min-width:100%; min-height:100%; width:auto; height:auto; transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);}
@media  (max-width: 1024px) {
  .mainMovie iframe {min-width:100%; min-height:100%; width:auto; height:100%;}
  .main_video {min-width:100%; min-height:100%; width:auto; height:100%;}
  .mainMovie > div > video {margin-top: 0;}
}
#main_topArea_bottom { position:absolute; width:100%; height:10px; left:0; top:1px;z-index:-1;}
#contents { overflow:hidden;}
.mainLogo {position:absolute; width:479px; left:50%; top:50%; transform: translate(-50%,-50%) scale(0.85); -ms-transform:translate(-50%,-50%) scale(0.85); -webkit-transform:translate(-50%,-50%) scale(0.85);  opacity:0; z-index:5;}
.mainLogo img {width:100%; vertical-align:top; }
.active .mainLogo {transform: translate(-50%,-50%) scale(1); -ms-transform:translate(-50%,-50%) scale(1); -webkit-transform:translate(-50%,-50%) scale(1); -webkit-transition: opacity 2s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 2s cubic-bezier(0.645, 0.045, 0.355, 1); transition: opacity 2s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 2s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: opacity 2s cubic-bezier(0.645, 0.045, 0.355, 1), transform 2s cubic-bezier(0.645, 0.045, 0.355, 1); transition: opacity 2s cubic-bezier(0.645, 0.045, 0.355, 1), transform 2s cubic-bezier(0.645, 0.045, 0.355, 1); transition: opacity 2s cubic-bezier(0.645, 0.045, 0.355, 1), transform 2s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 2s cubic-bezier(0.645, 0.045, 0.355, 1); opacity:1; }
.mainCon01 { position:relative; background:#286995; }
.mainCon01:after {content:"";display:block;clear:both;}

.main01_01 {position:relative; width:100%; z-index:10;}
.main01_01 p {
  color: #4a4a4a;
}
.main01_01 .typo02_01 {
  width: 100%;
  letter-spacing: 4px;
  font-size: 1.3em;
  line-height: 1.5em;
  text-align: center;
  position: absolute;
  top: 125px;
  left: 50%;
  transform: translate(-50%, -50%);
}
.main01_01 .typo02_02 {
  letter-spacing: 18px;
  font-weight: 700;
  writing-mode: vertical-rl;
  text-orientation: upright;
  text-transform: uppercase;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.boxT02_03 {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
.typo02_03 {
  position: relative;
  font-size: 16px;
  line-height: 1.5em;
  margin-bottom: 70px;
}
.typo02_03::before {
  position: absolute;
  top: 88px;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  content: "";
  width: 1px;
  height: 32px;
  background: #4a4a4a;
}
.typo02_04 {
  color: #939393;
  font-size: 18px;
  font-family: 'GyeonggiTitleM';
  font-weight: lighter;
}
.main01_02 { position:relative;}
.main01_02 > div > img {
  display: block;
  width: 100%;
}
.img02_01 {}
.img02_02 {position: relative;}
.img02_02 p {
  font-family: 'GyeonggiTitleM';
  position: absolute;
  bottom: 20px;
  right: 20px;
  font-size: 40px;
  color: #fff;
  opacity: 0.4;
  line-height: 1em;
  text-align: right;
}
.main01_0201 {position:relative; width:66%; z-index:9;}
.main01_0201 .btn_scroll { position:absolute; display:inline-block; left:75%; bottom:-115px; z-index:2;}
.main01_0201 .btn_scroll .line { display:block; width:1px; height:60px; margin:0 auto; background:rgba(255,255,255,0.5); }
.main01_0201 .btn_scroll i {display:inline-block; width:30px; height:30px; border:1px solid #fff; border-radius:50%; color:#fff; text-align:center; line-height:30px; vertical-align:top;}
/*.main01_03 { position:absolute; width:34%; height:100%; left:50%; top:0; z-index:8; }
.active.main01_03 { left:66%;}
.main01_0301 { position:absolute; height:100%;}*/
/*.main01_03 img { opacity:0.14; height:100%; width:auto; vertical-align:top;  }*/
.main01_0302 { position:absolute; right:-10em; bottom:0; font-size:0.9em; line-height:1.6em; color:#fff; opacity:0.5; }
@media  (max-width: 1420px){ .main01_0302 {font-size:1vw;}  }

.main_cloud { position:relative; width:100%; margin-bottom:-41%; overflow:hidden;}
.cloud_bg { position:absolute; width:60%; height:100%; right:-2px; top:-2px; z-index:3;}
.img_cloud { position:absolute; width:150%; left:0; top:0; animation-duration:30s; animation-name: cloud; animation-iteration-count: infinite; animation-direction: alternate; }
@keyframes cloud { 
  from { left: 0; }
  to { left: -50%; }
}
.img_cloud_bg { position:relative; width:150%; opacity:0; }
.main_concept { position:relative; z-index:9; }
.main_concept .bx-wrapper {/*padding-left:22.4%;*/}
.main_concept .bx-controls { position:absolute; width:20%; left:8%; top:50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); z-index:5;}
.main_concept .bx-pager {}
.main_concept .bx-pager .bx-pager-item { margin-bottom:15%;}
.main_concept .bx-pager .bx-pager-item .bx-pager-link {position:relative; display:block; font-family: 'Quicksand', sans-serif; font-size:1.5em; line-height:2.6em; color:rgb(236, 101, 164); letter-spacing:0.1em; font-weight:700; opacity:0.7; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-text-shadow:0 0 3px rgba(236, 101, 164, 0.6); -moz-text-shadow:0 0 3px rgba(236, 101, 164, 0.6); text-shadow:0 0 3px rgba(0, 0, 0, 0.6); }
.main_concept .bx-pager .bx-pager-item .bx-pager-link.active {opacity:1;}
.main_concept .bx-pager .bx-pager-item .bx-pager-link:after {-webkit-transition: all 0.15s ease-in-out; -moz-transition: all 0.15s ease-in-out; -ms-transition: all 0.15s ease-in-out; -o-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; content:""; position:absolute; display:block; width:0; height:1px; background:rgba(255,255,255,0.5); right:50%; top:50%; }
.main_concept .bx-pager .bx-pager-item .bx-pager-link.active:after {  width:50%; right:0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.main_concept .bx-controls-direction { display:none;}

.main01_05 { position:relative; margin-top:-0.5px; z-index:10;}

.mainRoom { position:relative; text-align:center;}
.mainRoom dt { padding: 55px 0 45px 0; background:#fff;  }
.mainRoom dt > span { display:block;}
.mainRoom_t01 { position:relative; margin-bottom:45px;}
.mainRoom_t0101 {
  font-family: 'GyeonggiBatang';
  text-transform: uppercase;
  font-size: 1.2em;
  font-weight: 600;
  line-height: 0.8em;
  color: #818181;
  letter-spacing: 0.05em;
  display: block;
}
.mainRoom_t0102 {
  position: relative;
  text-align: center;
  font-size: 2em;
  font-family: 'GyeonggiTitleM';
  font-weight: 300;
  line-height: 1.6em;
  display: block;
}
.mainRoom_t0102::before {
  display: block;
  content:"";
  width: 1px;
  height: 20px;
  background: #b4b2b2;
  position: absolute;
  top: 60px;
  left: 50%;
  transform: translate(-50%, -50%);
}
.mainRoom_t02 {
  color: #a8a8a8;
  font-size: 20px;
  line-height: 1.5em;
  font-family: 'GyeonggiTitleM';
}
.mainRoom ul {
  display: flex;
}
.roomList01 { 
  position:relative; 
  overflow:hidden;
  width: 25%;
  transition: 0.3s all !important;
}
.roomList01 a img {
  display: block;
  width: 100%;
}
.room_img {
  height: 936px;
}
.room_img01 {
  background: url('/html/images/room/roomList01.jpg')no-repeat center center;
}
.room_img02 {
  background: url('/html/images/room/roomList02.jpg')no-repeat center center;
}
.room_img03 {
  background: url('/html/images/room/roomList03.jpg')no-repeat center center;
}
.room_img04 {
  background: url('/html/images/room/roomList04.jpg')no-repeat center center;
}
.room_txt {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  transition: 0.4s all;
}
.R_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.6);
  transition: 0.3s all;
}
.R_title span {
  font-family: 'GyeonggiBatang';
  font-size: 24px;
  line-height: 42px;
  text-transform: uppercase;
  position: relative;
  padding-top: 25px;
  display: block;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
}
.R_title span h3 {
  font-size: 24px;
  font-family: 'paybooc-Light';
}
/* .roomList01:nth-child(1) .R_title {
  background: url('/html/images/room/choco.png')no-repeat center center;
  height: 128px;
}
.roomList01:nth-child(2) .R_title {
  background: url('/html/images/room/vanilla.png')no-repeat center center;
  height: 128px;
}
.roomList01:nth-child(3) .R_title {
  background: url('/html/images/room/white.png')no-repeat center center;
  height: 128px;
}
.roomList01:nth-child(4) .R_title {
  background: url('/html/images/room/berry.png')no-repeat center center;
  height: 128px;
} */





@media  (max-width: 1820px){
.mainRoom_t0101 { font-size:5.6vw;}
}

@media  (max-width: 1480px){
.roomList01 .title { font-size:0.9em;}
}

@media (max-width: 1024px){
  /*.mainLogo { width:30%;}*/
  .main01_02 .btn_scroll { display:none;}
  .mainRoom_t0101 { font-size:7.6vw;}
  .mainRoom_t0102 { font-size:1.2em;}
  .mainRoom_t02 { font-size:0.85em; line-height:1.5em;}
  .roomList_img {padding-bottom:36%;}
  .roomList01 .title { font-size:1vw;}
  .roomList01 .title .title_e {font-size:3.4em; }
  .roomList01 .title .title_k {font-size:2.4em;margin-bottom:10%;}
  .roomList01 .title .title_btn p { font-size:2.5em; line-height:1em;}
  .mainRoom ul {display: block;}
  .mainRoom ul:after {display: block; content: ""; clear: both;}
  .roomList01 {
    float: left;
    width: 50%;
  }
  .room_img {
    height: 350px;
    background-size: cover;
  }
  .main01_01 .typo02_01 {width: 80%;}
  .mainRoom_t0102::before {top: 45px;}
}


@media  (max-width: 768px){
.main_concept .bx-controls { left:5%;}
.main_concept .bx-pager { width:30%; left:5%}
.main_concept .bx-pager .bx-pager-item { margin-bottom:10%;}
.main_concept .bx-pager .bx-pager-item .bx-pager-link { font-size:1em;letter-spacing:0;}
.main_concept .bx-pager .bx-pager-item .bx-pager-link.active:after { width:45%;}
} 

@media  (max-width: 640px){
.main01_0302 {display:none;}
.roomList01 .title { font-size:1.5vw;}
.roomList01 .title .title_k {margin-bottom:3%;}
.roomList01 .title .title_btn p { display:none;}
.roomList01 .title .title_btn .btn_arrow { vertical-align:top; }
} 
@media (max-width:560px){
  .main01_01 .typo02_01 {font-size: 0.9em; top: 40px;}
	.main01_01 .typo02_02 {}
  .boxT02_03 {
    width: 100%;
    bottom: -30px;
  } 
  .typo02_03 {
    font-size: 0.9em;
    margin-bottom: 5px;
  }
  .typo02_03::before {
    display: none;
  }
  .typo02_04 {
    font-size: 0.9em;
  }
  .img02_02 p {
    font-size: 1em;
  }
	.R_title span {
		font-size: 1.2em;
		line-height: 25px; 
		padding-top: 43px;
	}
  .room_more {
    background-size: contain;
    width: 75px;
    height: 40px;
    margin: 15px auto;
  }
  .roomList01 a:hover .room_more {
    background-size: contain;
    width: 75px;
    height: 40px;
    margin: 15px auto;
  }
}
@media  (max-width: 420px){
  .main01_01 .typo02_01 {
    font-size: 0.75em;
  }
  .typo02_03, .typo02_04 {
    font-size: 0.75em;
  }
  .main_concept .bx-pager { width:24%; left:3%}
  .main_concept .bx-pager .bx-pager-item .bx-pager-link.active:after { width:40%;}
}