@charset "utf-8";

.mainArea { position:relative; }



.mainTyop { position:absolute; width:80%; left:10%; top:50%; text-align:center; z-index:5;}
.mainTyop p { display:inline-block; margin:-1em auto 0; text-align:right; font-family:'GothamThin', sans-serif; font-size:8em; font-size:6vw; line-height:0.9em; letter-spacing:0.05em; color: #fff; -webkit-text-shadow: 1px 1px 3px rgb(0, 0, 0); text-shadow: 1px 1px 3px rgb(0, 0, 0); }

.mainCon { position:relative;}
.mainCon:after {content:"";display:block;clear:both;}
.mainLink { position:absolute; width:80%; left:10%; top:50%; margin-top:-26px; z-index:2;}
.mainLink li { float:left; width:33.3%; text-align:center;}
.mainLink li a { position:relative; display:inline-block; padding:0 0.8em 0 0.5em; font-family: 'Playfair Display', serif; font-size:2.5em; line-height:1.6em; font-style:italic; border-bottom:1px solid rgba(255, 255, 255, 0.5); -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease;}
.mainLink li a .line{ position:absolute; right:0; bottom:0; width:10px; height:1px; background:url(../images/bg/white_50.png); transform: translate(0, -3px) rotate(45deg); -ms-transform: translate(0, -3px) rotate(45deg); -webkit-transform: translate(0, -3px) rotate(45deg); }
.mainLink li a:hover { margin-left:0.5em;}

.mainTop {position:relative;}
.mainArrow {position:absolute; top:0; left:0; width:100%;}
.btn_scroll { position:relative; display:block; width:2.56em; height:2.56em; margin: 0 auto;  font-family: 'Oranienbaum', serif; color:#262626; font-size:3em; z-index:1;}
.btn_scroll span { position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); line-height:0;}

.mainTopText {padding:6% 0; text-align:center;}
.topTextMain {font-size:2.3em; color:#5b5a5a; line-height:1.3; letter-spacing:0.05em; margin-bottom:1.7%;}
.topTextSub {
  /* font-family: 'Libre Baskerville', serif;  */
  font-style: italic; font-size:1.4em; color:#696969; line-height:1.8; letter-spacing:0; 
}

.main_01, .main_02 { position:relative; float:left; width:50%; padding-top:34%;}
.main_01 { background-position:center; background-size:cover; background-repeat:no-repeat; }
.main_01 img { position:absolute; top:0; left:0; width:100%;}
.main_02 { background:#f9f9f9; }
.main_02_inner { position:absolute; top:50%; left:50%; -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); text-align:center; }
.main_02_title { display:inline-block; font-family: 'GothamLight', sans-serif; font-size:3.07em; color:#2c2c2c; background-size:cover; background-position: center; background-repeat:no-repeat; width:100%;}
.main_02_subtitle { display:inline-block;font-family: 'GothamLight', sans-serif; font-size:1.07em; color:#676767; letter-spacing: normal; margin-top: 0.5em; margin-bottom: 3.5em; }
.main_02 p {font-size:1.23em; line-height:1.7; color:#676767; font-weight:300; white-space:nowrap; }
.main_02 p span { display:block; }
.main_02 p span:last-child { margin-top:1.23em; }
.main_02 .viewMore {position: relative; display: inline-block; padding: 0 0.8em 0 0.5em;  color:#2c2c2c; font-family: 'Heebo', sans-serif; font-size: 1.15em; line-height: 0; text-indent: -9em; margin-left:4.5em; margin-top:3.3em; border-bottom: 1px solid #2c2c2c; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease;}
.main_02 .viewMore .line {position: absolute; right: 0; bottom: 0; width: 10px; height: 1px; background:#2c2c2c; transform: translate(0, -3px) rotate(45deg); -ms-transform: translate(0, -3px) rotate(45deg); -webkit-transform: translate(0, -3px) rotate(45deg);}

.mainMidText { text-align:center; padding-top:6%; padding-bottom:3%; }
.midTextMain {font-size:1.46em; color:#515151; line-height:1.6; letter-spacing:0.05em; margin-bottom:1%;}
.midTextSub {font-family: 'Libre Baskerville', serif; font-size:0.84em; color:#b3b3b3; line-height:1.6; font-style: italic; letter-spacing:0.05em; }

.mainCon01 {position:relative; width: 96%; max-width: 1318px; margin: 0 auto; z-index:1; margin-bottom:7%;}
.mainCon01 img { width: 100%; }
.mainCon01Btn { position:absolute; width:40%; max-width:240px; bottom:0; left:50%; transform:translate(-50%, 50%);}

/* 팝업레이어 */
#hd_pop {z-index:1000;position:relative;margin:0 auto; width:100%; max-width:970px;height:0}
#hd_pop h2, .sound_only {position:absolute;font-size:0;line-height:0;overflow:hidden}
.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff}
.hd_pops_con {}
.hd_pops_footer {padding:10px 0;background:#000;color:#fff;text-align:right}
.hd_pops_footer button {margin-right:5px;padding:5px 10px;border:0;background:#393939;color:#fff}

.lightslider li.mainImg06, .lightslider li.mainImg10, .lightslider li.mainImg11, .lightslider li.mainImg12 {background-position:right bottom !important;}

@media  (max-width: 1480px){
.mainArea { }
.main_02_inner {font-size:0.8em;}
.mainMidText {font-size:0.8em; }
.mRoom_title {font-size:0.8em; }
.midTextMain {letter-spacing:normal;}
.main_02_subtitle { margin-top: 1.5%; margin-bottom: 10%;}
.main_02 .viewMore { margin-top: 14%; }

.mainTop {font-size:0.8em;}
}

@media  (max-width: 1024px){
.mainArea { width:100%; left:0;}
.mainLink { margin-top:-3.2vw; }
.mainLink li a {  padding:0 0.8em 0 0.5em; font-size:3.5vw; line-height:1.8em;}
.mainLink li a .line{  width:6px; transform: translate(0, -1.8px) rotate(45deg); -ms-transform: translate(0, -1.8px) rotate(45deg); -webkit-transform: translate(0, -1.8px) rotate(45deg); }
.mainArrow {display:none;}
.topTextMain img {  width:262px;}
}


@media  (max-width: 768px){
  .main_02_inner { font-size:0.8em; }
  .mainMidText { font-size:0.7em; padding-top: 10%; padding-bottom: 5%; }
  .mRoom_title { font-size:0.7em; }
  .mainTop { font-size:0.7em; }
  .main_01 { float:none; width:90%; margin:0 auto; }
  .main_02 { width:100%; }
  .main_01 { padding-top: 55%;}
  .main_02 { padding:0; }
  .main_02_inner {position:relative; top:auto; left:auto; -ms-transform:none; -webkit-transform:none; transform:none; padding: 10% 0;  }
  .main_02 p { white-space: normal; width:94%; margin:0 auto;}
  /* .main_02 p span { display:inline; } */
  .main_02 p span:last-child { margin-top:0; }
  .main_02_subtitle { margin-top: 0; margin-bottom: 3%;}
  .main_02 .viewMore { margin-top: 6%; }
  .topTextMain img {  width:232px;}
}

@media  (max-width: 560px){
  .main_02_inner { font-size:0.6em; }
  .mainMidText { font-size: 0.4em; width: 94%; margin: 0 auto; }
  .mRoom_title { font-size:0.6em; }
  .mainTop { font-size:0.55em; }
  .topTextMain img {  width:202px;}
}



/* 메인 지도 */
.map_dl { position:relative; z-index:2;}
.map_dl:after {content:"";display:block;clear:both;}
.map_dl dt { 
  width: 27.1%;
}
.map_dl dd { position:absolute; width:72.9%; height:100%; right:0; top:0; }
.map_add { position:absolute; left:0; bottom:0; padding:2%; font-size:1.2em; line-height:1.2em;}

.mapCon { width:72.9%; margin-left:27.1%;}
.map_text { font-size:1em; line-height:1.6em; margin-top:3.5em; padding-right:2%;}
.map_text dt { font-size:1.3em; font-weight:600; margin-bottom:1em;}
.map_text dd { margin-bottom:3em;}
.map_text dd div { margin-bottom:1em;}
.map_text dd div.map_add02 { font-size:1.15em; font-weight:600; margin:2em 0;}
.map_text .map_p { margin-bottom:3px;}
.map_text dd div strong { display:block; font-size:1.05em; font-weight:500; color:#000; }

.mapFrame { position:relative; width:100%; height:36vw; background:#ddd; border:1px solid #eee; overflow:hidden; }
.mapFrame iframe {position:absolute; width:150%; height:150%; left:50%; top:20%; -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); border:0; opacity:0; filter: alpha(opacity=0;);}
.active .mapFrame iframe { opacity:1; filter: alpha(opacity=100); top:50%; transition: all 0.5s ease 0.5s;}


@media  (max-width: 1480px){

.mapFrame { width:100%;}
}



@media  (max-width: 1024px){
.map_dl {margin-top: 90px;}
.map_dl dt {
  text-align: center;
  width: 100%;
  margin-bottom: 20px;
}
.map_dl dt h2 {
  font-size: 25px;
  font-weight: 400;
  color: #575757;
}
.map_add { font-size:1em; line-height:1.6em;}

.mapCon { 
  width:100%; 
  margin-left:0;
  margin-bottom: 30px;
}
.mapFrame { height:50vw;}
.map_text { line-height:1.5em; padding:0 3%; width:100%;}
.map_text dd div { margin-bottom:1.2em;}

}

@media  (max-width: 640px){

.mapFrame { height:80vw;}
.map_dl dt h2 {
  font-size: 22px;
}

}