@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Cinzel&family=Noto+Sans+KR&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400..900&display=swap');
/* ===============================================================
    * Reset
=============================================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;overflow-x: hidden;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
a {text-decoration: none; color: inherit;}
img {vertical-align: top;}
input[type="date"] {border: none;}
input[type="text"],input[type="tel"],input[type="email"],input[type="password"],input[type="search"],input[type="date"],
textarea,button {appearance: none;-webkit-appearance: none;outline:none;background: none; border: 1px solid #e0e0e0;}
button {cursor: pointer; border:none; border-radius: 0; padding: 0; margin: 0;}
select {appearance: none;-webkit-appearance: none;outline:none; border: 1px solid #e0e0e0;}
select::-ms-expand {display: none;}
* {box-sizing: border-box;}
a:link {background: none;}
a:visited {background: none;}
a:active {background: none;}

/* ===============================================================
    * Layout & Font & Width & Color
=============================================================== */
html {font-size: 62.5%;}
body {font-family: 'Noto Sans KR', sans-serif; font-size: 16px; line-height: 1; font-weight: normal; color: #222; overflow-x: hidden;}
/*
    font-family: 'Cinzel', serif;
    font-family: 'Noto Sans KR', sans-serif;
*/

.font1 {font-family: 'Cinzel', serif;}
.c9{ color: #999;}
.upp{ text-transform: uppercase;}
.none-pc {display: none;}
.none-mo {display: block;}
.fl{ float: left;}
.fr{ float: right;}
.re{ font-weight: 400;}
@media (max-width: 820px){
  .none-pc {display: block;}
  .none-mo {display: none!important;}
}

/* cover */
.cover {
  background-repeat:no-repeat;
  background-position:50% 50%;
  background-size:cover
}

header, footer {
 	display:none !important; 
}
main {padding-top:0;}

.index-intro-beachhill-1 {width:100%;box-sizing:border-box;overflow:hidden;}
.index-intro-beachhill-1 .frame {width:100%;height:100vh;display:flex;align-items:center;}
.index-intro-beachhill-1 .intro {width:100%;height:100%;display:flex;}
.index-intro-beachhill-1 .intro-box {width:100%;background-color:#f5f5f5;display:flex;align-items:center;}
.index-intro-beachhill-1 .intro-box:nth-child(2n) {background-color:#fff;}
.index-intro-beachhill-1 .intro-box a {display:block;width:100%;}
.index-intro-beachhill-1 .intro-wrap {width:100%;display:flex;flex-direction:column;}
.index-intro-beachhill-1 .intro-logo {width:100%;display:flex;justify-content:center;}
.index-intro-beachhill-1 .intro-logo .tit {color:#222;display:flex;flex-direction:column;align-items:center;}
.index-intro-beachhill-1 .intro-logo .tit img {display:block;height:2.6vw;margin-bottom:1.82vw;}
.index-intro-beachhill-1 .intro-logo .tit h2 {font-size:1.87vw;font-weight:400;line-height:2.25vw;padding-bottom:0.26vw;font-family:'Cinzel';text-align:center;}
.index-intro-beachhill-1 .intro-logo .tit p {font-size:1.04vw;line-height:1.41vw;padding-bottom:2.08vw;color:#999;font-family : 'Noto Sans KR'}
.index-intro-beachhill-1 .intro-tit {width:100%;padding:0 1.2vw;box-sizing:border-box;}
.index-intro-beachhill-1 .intro-tit .img {width:100%;padding-bottom:56.25%;position:relative;margin-bottom:3.13vw;overflow:hidden;}
.index-intro-beachhill-1 .intro-tit .img .cover {width:100%;height:100%;position:absolute;transition:all .5s;}
.index-intro-beachhill-1 .intro-info {padding:0.52vw 0;border-top:1px solid #999;border-bottom:1px solid #999;text-align:center;}
.index-intro-beachhill-1 .intro-info p {font-size:0.6771vw;line-height:0.8333vw;margin-bottom:0.52vw;color:#999;font-family : 'Noto Sans KR'}
.index-intro-beachhill-1 .intro-info p span:first-child {margin-right:1vw;position:relative;}
.index-intro-beachhill-1 .intro-info p span:first-child::after {content:"";width:.5px;height:70%;background-color:#999;display:block;position:absolute;right:-0.5vw;top:60%;transform:translateY(-50%);}
.index-intro-beachhill-1 .intro-info p:last-child {margin-bottom:0;}

@media (hover: hover) {
    .index-intro-beachhill-1 .intro-box a:hover .intro-tit .img .cover {transform:scale(1.1);}
}
@media screen and (max-width:1024px) {
    .index-intro-beachhill-1 .frame {height:auto;align-items:normal;}
    .index-intro-beachhill-1 .intro {flex-wrap:wrap;}
    .index-intro-beachhill-1 .intro-wrap {padding:10vw 0;}
    .index-intro-beachhill-1 .intro-logo .tit img {height:10.26vw;margin-bottom:4.8828vw;}
    .index-intro-beachhill-1 .intro-logo .tit h2 {font-size:6.15vw;line-height:8.21vw;padding-bottom:1.28vw;}
    .index-intro-beachhill-1 .intro-logo .tit p {font-size:4.10vw;line-height:5.38vw;padding-bottom:5.13vw;}
    .index-intro-beachhill-1 .intro-tit {padding:4vw;}
    .index-intro-beachhill-1 .intro-tit .img {margin-bottom:10.26vw;}
    .index-intro-beachhill-1 .intro-info {padding:3.08vw 0;}
    .index-intro-beachhill-1 .intro-info p {font-size:3.08vw;line-height:4.10vw;margin-bottom:1.28vw;color:#999;}
    .index-intro-beachhill-1 .intro-info p span:first-child {margin-right:2vw;}
    .index-intro-beachhill-1 .intro-info p span:first-child::after {width:1px;height:80%;right:-1vw;top:55%;}
}