body {
    font-family: 'Escoredream';
}


/*---------------------- PC 인트로 ----------------------*/

.wrap.intro2 {
    position:relative;
    min-width:1905px;
    width:100%;
    z-index:10;
}

.wrap.intro2 .leftArea {
    position:relative;
    float:left;
    width:15.8%;
    height:100%;
    background:#fff;
    z-index:2;
}

.wrap.intro2 .leftArea .top img {
    width:100%;
}

.wrap.intro2 .leftArea .contact {
    padding-bottom:30px;
    text-align:center;
}

.wrap.intro2 .leftArea .contact a {
    width:80%;
    margin:0 auto 5px auto;
    display:block;
}

.wrap.intro2 .leftArea .contact a img {
    width:100%;
}

.wrap.intro2 .leftArea .bottom {
    margin:0 auto;
    padding:30px 0;
    border-top:1px solid #d3d1d0;
    text-align:center;
}

.wrap.intro2 .leftArea .bottom a {
    height:26px;
    padding:0 8px;
    margin-bottom:20px;
    border:1px solid #a2968d;
    border-radius:13px;
    font-size:0.8em;
    color:#a2968d;
    line-height:26px;
    display:inline-block;
}

.wrap.intro2 .leftArea .bottom p {
    width:80%;
    margin:0 auto;
}

.wrap.intro2 .leftArea .bottom p img {
    width:100%;
}

.wrap.intro2 .rightArea {
    float:left;
    position:relative;
    width:84.2%;
    height:100%;
    background:#fff;
    overflow:hidden;
}

.wrap.intro2 .rightArea .menu {
    position:relative;
    width:100%;
    height:100%;
    z-index:10;
    overflow:hidden;
}

.wrap.intro2 .rightArea .menu ul {
    height:100%;
}

.wrap.intro2 .rightArea .menu ul li {
    float:left;
    width:16.6666%;
    height:100%;
    border-right:1px solid rgba(255,255,255,0.3);
    text-align:center;
}

.wrap.intro2 .rightArea .menu ul li:last-child {
    border-right:0;
}

.wrap.intro2 .rightArea .menu ul li a {
    width:55%;
    margin:80% auto 0 auto;
    padding-bottom:60%;
    background:url(/images/intro_pc/menu_arrow.png) no-repeat bottom center / 60%;
    display:block;
}

.wrap.intro2 .rightArea .menu ul li a img {
    width:100%;
}

.wrap.intro2 .rightArea .intro_visual {
    overflow:hidden;
    z-index:5;
}


/*---------------------- PC 인트로 텍스트 처리 ----------------------*/

/* 텍스트 상단 */

.wrap.intro2 .leftArea .top2 {
    position:relative;
    width:100%;
    height:0;
    padding-bottom:195%;
    background:url(/images/intro_pc/left_bg2.jpg) no-repeat top center;
    background-size:cover;
}

.wrap.intro2 .leftArea .top2 .logo {
    margin-top:5%;
}

.wrap.intro2 .leftArea .top2 h1 {
    color:#fff;
}

.wrap.intro2 .leftArea .top2 .logo a {
    width:60%;
    margin:0 auto;
    display:block;
}

.wrap.intro2 .leftArea .top2 p {
    padding-top:108%;
    width:100%;
    text-align:center;
    white-space:pre-line;
    font-size:clamp(1.3em, 1vw, 2em);
    line-height:120%;
    color:#555;
    font-family:'MaruBuri';
}

.wrap.intro2 .leftArea .top2 p span {
    font-family:'MaruBuriBold';
}

.wrap.intro2 .leftArea .top2 .logo a img {
    width:100%;
}


/* 텍스트 연락처 */

.wrap.intro2 .leftArea .contact2 {
    margin-bottom:20px;
}

.wrap.intro2 .leftArea .contact2 a {
    width:85%;
    margin:0 auto;
    padding:4% 0;
    margin-bottom:2%;
    text-align:center;
    font-weight:200;
    font-size:clamp(1.2em, 1vw, 1.5em);
    display:block;
}

.wrap.intro2 .leftArea .contact2 a.tel span {
    display:inline-block;
    padding-left:10px;
    font-weight:500;
}

.wrap.intro2 .leftArea .contact2 a.tel2 span {
    display:inline-block;
    padding-left:10px;
    font-weight:500;
}

.wrap.intro2 .leftArea .contact2 a.kakao em {
    padding-left:30px;
    background:url(/images/intro_pc/icon_naver.png) no-repeat left center;
    background-size:contain;
}


/* 텍스트 푸터 */

.wrap.intro2 .leftArea .bottom p.text {
    width:100%;
    font-size:0.3em;
    font-weight:300;
    line-height:1.5;
    color:#888;
    white-space:pre-line;
}


/* =========================================================
   PC 텍스트 메뉴
   ========================================================= */

.wrap.intro2 .rightArea .menu2 {
    position:relative;
    width:100%;
    height:100%;
    z-index:10;
    overflow:hidden;
}

.wrap.intro2 .rightArea .menu2 ul {
    height:100%;
}

.wrap.intro2 .rightArea .menu2 ul li {
    float:left;
    width:16.6666%;
    height:100%;
    border-right:1px solid rgba(255,255,255,0.3);
    text-align:center;
}

.wrap.intro2 .rightArea .menu2 ul li:last-child {
    border-right:none;
}


/* =========================================================
   ① 전체 메뉴 세로 위치

   기존값 : 80%
   숫자가 커질수록 전체가 아래로 내려갑니다.

   추천 시작값 : 88%
   ========================================================= */

.wrap.intro2 .rightArea .menu2 ul li a {
    margin:88% auto 0 auto;
    color:#fff;
    height:0;
    padding-bottom:110%;

    /*
    ④ 화살표 위치

    아래의 95% 숫자만 변경하면 됩니다.

    85% = 위
    90% = 조금 위
    95% = 추천
    100% = 가장 아래
    */
    background-image:url(/images/intro_pc/menu_arrow.png);
    background-repeat:no-repeat;
    background-position:center 95%;
    background-size:35%;

    display:block;
}


/* =========================================================
   ② 영문 타이틀 위치

   top 숫자가 커질수록 아래
   음수면 위로 올라갑니다.

   예:
   top:10px;
   top:20px;
   top:-10px;
   ========================================================= */

.wrap.intro2 .rightArea .menu2 ul li a span {
    position:relative;
    top:30px;

    padding:3% 3%;
    text-transform:uppercase;
    font-size:clamp(0.8em, 0.7vw, 1.1em);
    letter-spacing:0.1em;
    font-weight:300;
    display:inline-block;
}


/* =========================================================
   ③ 한글 메뉴 위치

   top = 한글 전체만 이동
   margin-top = 영문과 한글 사이 간격
   ========================================================= */

.wrap.intro2 .rightArea .menu2 ul li a h2 {
    position:relative;

    /* 한글 자체 세로 위치 */
    top:30px;

    /* 영문과 한글 사이 간격 */
    margin-top:45px;

    white-space:pre-line;
    font-size:clamp(2.6em, 2.2vw, 3.5em);
    font-weight:600;
    line-height:1.3;
    display:block;
}


/*---------------------- MOBILE 인트로 ----------------------*/

.wrap.intro2_m .logoArea {
    width:100%;
}

.wrap.intro2_m .logoArea img {
    width:100%;
}

.wrap.intro2_m .menuArea {
    position:relative;
    width:100%;
    background:#574d43;
    overflow:hidden;
    z-index:10;
}

.wrap.intro2_m .menuArea .menu {
    position:relative;
    width:100%;
    z-index:10;
    overflow:hidden;
}

.wrap.intro2_m .menuArea .menu ul li {
    float:left;
    width:50%;
    height:0;
    padding-bottom:52%;
    border-right:1px solid rgba(255,255,255,0.3);
    border-bottom:1px solid rgba(255,255,255,0.3);
}

.wrap.intro2_m .menuArea .menu ul li a {
    width:70%;
    margin:0 auto;
    display:block;
}

.wrap.intro2_m .menuArea .menu ul li a img {
    margin-top:38%;
    width:100%;
}

.wrap.intro2_m .menuArea #slideshow .intro_visual span {
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

.wrap.intro2_m .bottomArea {
    width:90%;
    margin:40px auto;
}

.wrap.intro2_m .bottomArea a {
    margin-bottom:15px;
    display:block;
}

.wrap.intro2_m .bottomArea a img {
    width:100%;
}


/*---------------------- MOBILE 인트로 텍스트 처리 ----------------------*/

.wrap.intro2_m .menuArea .menu2 {
    position:relative;
    width:100%;
    z-index:10;
    overflow:hidden;
}

.wrap.intro2_m .menuArea .menu2 ul li {
    float:left;
    width:50%;
    height:0;
    padding-bottom:52%;
    border-right:1px solid rgba(255,255,255,0.3);
    border-bottom:1px solid rgba(255,255,255,0.3);
    text-align:center;
}


/* ---------------------------------------------------------
[수정] 메뉴 5개 → 6개 변경에 따른 :last-child 특수처리 제거

6개 메뉴는 2열 × 3행으로 균등 배치되므로
마지막 아이템을 풀와이드(100%)로 만드는 기존 규칙이
6번째 메뉴에 잘못 적용되어 레이아웃이 깨지는 원인이었습니다.
--------------------------------------------------------- */


.wrap.intro2_m .menuArea .menu2 ul li a {
    width:70%;
    margin:27% auto 0 auto;
    color:#fff;
    display:block;
}

.wrap.intro2_m .menuArea .menu2 ul li a span {
    padding:4% 3%;
    text-transform:uppercase;
    font-size:2.3vw;
    letter-spacing:0.1em;
    font-weight:300;
    display:inline-block;
}

.wrap.intro2_m .menuArea .menu2 ul li a h2 {
    margin-top:15%;
    white-space:pre-line;
    font-size:6.0vw;
    font-weight:600;
    line-height:1.2;
    display:block;
}

.wrap.intro2_m .bottomArea2 {
    width:90%;
    margin:40px auto;
}

.wrap.intro2_m .bottomArea2 a {
    width:100%;
    margin:0 auto;
    padding:6% 0;
    margin-bottom:2%;
    text-align:center;
    font-weight:200;
    font-size:6vw;
    display:block;
}

.wrap.intro2_m .bottomArea2 a.tel span {
    display:inline-block;
    padding-left:10px;
    font-weight:500;
}

.wrap.intro2_m .bottomArea2 a.tel2 span {
    display:inline-block;
    padding-left:10px;
    font-weight:500;
}

.wrap.intro2_m .bottomArea2 a.kakao em {
    padding-left:10%;
    background:url(/images/intro_pc/icon_naver.png) no-repeat left center;
    background-size:contain;
}


/*---------------------- 메뉴 영문 박스 컬러 ----------------------*/

.wrap.intro2 .rightArea .menu2 ul li:nth-child(1) a span,
.wrap.intro2_m .menuArea .menu2 ul li:nth-child(1) a span {
    background:#FF529D;
}

.wrap.intro2 .rightArea .menu2 ul li:nth-child(2) a span,
.wrap.intro2_m .menuArea .menu2 ul li:nth-child(2) a span {
    background:#ffba2c;
}

.wrap.intro2 .rightArea .menu2 ul li:nth-child(3) a span,
.wrap.intro2_m .menuArea .menu2 ul li:nth-child(3) a span {
    background:#00CA6E;
}

.wrap.intro2 .rightArea .menu2 ul li:nth-child(4) a span,
.wrap.intro2_m .menuArea .menu2 ul li:nth-child(4) a span {
    background:#FF5028;
}

.wrap.intro2 .rightArea .menu2 ul li:nth-child(5) a span,
.wrap.intro2_m .menuArea .menu2 ul li:nth-child(5) a span {
    background:#F43EFF;
}

.wrap.intro2 .rightArea .menu2 ul li:nth-child(6) a span,
.wrap.intro2_m .menuArea .menu2 ul li:nth-child(6) a span {
    background:#59d2ff;
}


/*---------------------- 연락처 박스 컬러 ----------------------*/

.wrap.intro2 .leftArea .contact2 a.tel,
.wrap.intro2_m .bottomArea2 a.tel {
    color:#fff;
    background:#DE4A94;
}

.wrap.intro2 .leftArea .contact2 a.kakao,
.wrap.intro2_m .bottomArea2 a.kakao {
    background:#00c73c;
}