@extends('layouts.default')

@section('content')

    <article class="container brand-branches domestic hongdae">
        <!-- 페이지타이틀 : full-bg -->
        <div class="area-pages-top parallax-bg">
            <h1 class="page-title">홍대지사</h1>
        </div>

        <!-- 지사안내 -->
        <article class="area-edm-branches" data-tab="tab-wrap">
            <div class="sm-branches-content">
                <section class="sm-bh-tabs-con">
                    <div class="img-wrap">
                        <div class="slider">
                            <ul>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae1.jpg" alt="">
                                        <figcaption>내부전경1</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae2.jpg" alt="">
                                        <figcaption>내부전경2</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae3.jpg" alt="">
                                        <figcaption>고객대기공간</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae4.jpg" alt="">
                                        <figcaption>회의실</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae5.jpg" alt="">
                                        <figcaption>세미나룸</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae6.jpg" alt="">
                                        <figcaption>외부전경</figcaption>
                                    </figure>
                                </li>
                            </ul>
                            <div class="paging-number"></div>
                        </div>
                        <div class="pager">
                            <!-- [D]: slider의 ul 내용과 동일합니다. -->
                            <ul>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae1.jpg" alt="">
                                        <figcaption>내부전경1</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae2.jpg" alt="">
                                        <figcaption>내부전경2</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae3.jpg" alt="">
                                        <figcaption>고객대기공간</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae4.jpg" alt="">
                                        <figcaption>회의실</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae5.jpg" alt="">
                                        <figcaption>세미나룸</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae6.jpg" alt="">
                                        <figcaption>외부전경</figcaption>
                                    </figure>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <article class="info-wrap">
                        <h3 class="bransches-name">홍대지사</h3>
                        <div class="bransches-info">
                            <div class="list-wrap">
                                <dl>
                                    <dt>전화</dt>
                                    <dd>전화: 02-337-5090</dd>
                                </dl>
                                <dl>
                                    <dt>근무시간</dt>
                                    <dd>
                                        <p class="bullet">주중: 10:00~19:00

                                        </p>
                                        <p class="bullet">
                                            토요일: 사전예약제
                                        </p>
                                    </dd>
                                </dl>
                                <dl>
                                    <dt>주소</dt>
                                    <dd>
                                        도로명: 서울 마포구 양화로 151 욱도빌딩 5층
                                    </dd>
                                    <dd>
                                        지번:
                                        서울 마포구 동교동 160-1 5층
                                    </dd>
                                    <dd>
                                        우편번호: 03995
                                    </dd>
                                </dl>
                            </div>
                            <div class="button-wrap">
                                <a href="#" class="button dark half">무료전화상담</a>
                                <a href="#" class="button color half">무료간편상담</a>
                            </div>
                            <div class="exp-box">
                                <p class="exp-txt">* 조기유학 상담은 강남2, 부산, 대구, 대전지사에서 가능합니다.</p>
                            </div>
                        </div>
                    </article>
                </section>
            </div>
        </article>

        <div class="area-brand-content">
            <!-- 앵커영역 -->
            <div class="area-branches-anchor">
                <a href="#" data-type="scroll-btn">지사소개</a>
                <a href="#">찾아오시는길</a>
                <a href="#" class="pc-menu">지사전경</a>
                <a href="#">감사해요edm<i class="ui-kit-new"></i> </a>
            </div>

            <!-- 지사소개 -->
            <section class="branches-greeting" id="branches-greeting">
                <div class="flex-wrap">
                    <div class="branches-title-wrap">
                        <h2 class="branches-title">지사소개</h2>
                    </div>
                    <div class="context">
                        <p>
                            <em>
                                안녕하세요. edm유학센터 홍대지사입니다.<br>
                                고객님이 기대하고 목표하는 연수 및 학업을 성공적으로 마칠 수 있도록 홍대지사가 자세하고 꼼꼼하게 서포트 해 드리겠습니다.
                            </em>
                        </p>
                        <p>
                            기대하고 꿈꾸는 성공적인 해외 유학 생활을 위해서는 한국에서부터 차근차근 준비하는 것이 필수입니다.<br class="pc-br">
                            풍부한 경험과 전문성을 갖고, 다양한 케이스를 진행해 본 저희 홍대지사의 전문 컨설턴트들이 여러분의 곁에 있습니다.<br class="pc-br">
                            현지생활에 잘 적응하고, 안전하게 학업 할 수 있도록 저희가 도와드리겠습니다.<br class="pc-br">
                            체계적이고 전문적인 상담으로 edm유학센터 홍대지사와 함께 당신의 성공적인 유학준비를 시작하세요.
                        </p>
                    </div>
                </div>
            </section>

            <!-- 풀 배너 영역 -->
            <div class="area-banner-slide">
                <div class="fix-wrap">
                    <ul class="slider-cont-full">
                        <li>
                            배너1
                        </li>
                        <li>
                            배너2
                        </li>
                        <li>
                            배너3
                        </li>
                    </ul>
                </div>
            </div>

            <!-- 찾아오시는길 -->
            <section class="branches-location" id="branches-location">
                <div class="flex-wrap">
                    <div class="branches-title-wrap">
                        <h2 class="branches-title">찾아오시는길</h2>
                        <p class="add-func">
                            <button class="btn-print">인쇄하기</button>
                            <button class="btn-en">IN ENGLISH</button>
                            <button class="btn-share">주소공유</button>
                            <button class="btn-large">크게보기</button>
                        </p>
                    </div>
                    <div class="column">
                        <div class="col2 map-wrap">
                            <div class="map-data">
                                <div class="map" id="map">맵 데이터 영역</div>
                            </div>
                            <div class="map-info">
                                <p class="address">서울 마포구 양화로 151 욱도빌딩 5층</p>
                                <p class="tel">02-337-5090</p>
                            </div>
                        </div>
                        <div class="col2">
                            <div class="howto-come">
                                <div class="by-subway">
                                    <h3 class="tit">지하철 이용시</h3>
                                    <p class="line2">
                                        홍대입구역 하차 후 1번 출구에서 직진, 할리스커피 건물 5층
                                    </p>
                                </div>
                                <div class="by-bus">
                                    <h3 class="tit">버스 이용시</h3>
                                    <p>[인근 버스 정류장]</p>
                                    <p>
                                        홍대입구역 / 동교로사거리
                                    </p>
                                    <a href="#" class="btn-detail">자세히보기</a>
                                </div>
                                <div class="by-drive">
                                    <h3 class="tit">자가용 이용시</h3>
                                    <p>욱도빌딩 1층 및 지하 기계식 주차 이용 가능</p>
                                    <p class="exp">
                                        * 지하 기계식 주차의 경우, SUV, 승합차, 밴 주차불가
                                        * 주차 공간이 협소하므로 가급적 대중교통을 이용해 주시기 바랍니다.
                                    </p>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </section>

            <!-- 지사전경 -->
            <section class="branches-photo" id="branches-photo">
                <div class="flex-wrap area-edm-branches">
                    <div class="branches-title-wrap">
                        <h2 class="branches-title">지사전경</h2>
                    </div>
                    <!-- 국내는 지사안내의 슬라이드와 동일 -->
                    <div class="img-wrap">
                        <div class="slider">
                            <ul>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae1.jpg" alt="">
                                        <figcaption>내부전경1</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae2.jpg" alt="">
                                        <figcaption>내부전경2</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae3.jpg" alt="">
                                        <figcaption>고객대기실</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae4.jpg" alt="">
                                        <figcaption>회의실</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae5.jpg" alt="">
                                        <figcaption>세미나룸</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae6.jpg" alt="">
                                        <figcaption>외부전경</figcaption>
                                    </figure>
                                </li>
                            </ul>
                            <div class="paging-number"></div>
                        </div>
                        <div class="pager">
                            <!-- [D]: slider의 ul 내용과 동일합니다. -->
                            <ul>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae1.jpg" alt="">
                                        <figcaption>내부전경1</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae2.jpg" alt="">
                                        <figcaption>내부전경2</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae3.jpg" alt="">
                                        <figcaption>고객대기실</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae4.jpg" alt="">
                                        <figcaption>회의실</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae5.jpg" alt="">
                                        <figcaption>세미나룸</figcaption>
                                    </figure>
                                </li>
                                <li>
                                    <figure>
                                        <img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/pages/branches/domestic/hongdae/hongdae6.jpg" alt="">
                                        <figcaption>외부전경</figcaption>
                                    </figure>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </section>

            <!-- 감사해요edm -->
            <section class="branches-review" id="branches-review">
                <div class="flex-wrap">
                    <div class="branches-title-wrap">
                        <h2 class="branches-title">감사해요edm</h2>
                        <p class="add-text">전체 <span class="color">###</span>건의 후기</p>
                    </div>
                    <div class="review-slider-wrap">
                        <div class="slider-item">
                            <p class="comment">
                                <span class="ellipsis-2line">
                                    제가 결정을 번복한적도 있었고, eTA도 늦게 신청했는데, 잘 이해해주셔서 감사했습니다 :) 또 친절하게 상담해주셔서 감사합니다. edm은
                                    체계가 잘 잡혀있어서 만족합니다!제가 결정을 번복한적도 있었고, eTA도 늦게 신청했는데, 잘 이해해주셔서 감사했습니다 :) 또 친절하게 상담해주셔서 감사합니다. edm은
                                    체계가 잘 잡혀있어서 만족합니다!
                                </span>
                            </p>
                            <p class="info">
                                <span class="name">고객 <em>김*현</em></span>
                                <span class="ec">담당컨설턴트 <em>정혜진</em></span>
                                <span class="date">2019.12.17</span>
                            </p>
                        </div>
                        <div class="slider-item">
                            <p class="comment">
                                <span class="ellipsis-2line">
                                    제가 결정을 번복한적도 있었고, eTA도 늦게 신청했는데, 잘 이해해주셔서 감사했습니다 :) 또 친절하게 상담해주셔서 감사합니다. edm은
                                    체계가 잘 잡혀있어서 만족합니다!
                                </span>
                            </p>
                            <p class="info">
                                <span class="name">고객 <em>김*현</em></span>
                                <span class="ec">담당컨설턴트 <em>정혜진</em></span>
                                <span class="date">2019.12.17</span>
                            </p>
                        </div>
                        <div class="slider-item">
                            <p class="comment">
                                <span class="ellipsis-2line">
                                    제가 결정을 번복한적도 있었고, eTA도 늦게 신청했는데, 잘 이해해주셔서 감사했습니다 :) 또 친절하게 상담해주셔서 감사합니다. edm은
                                    체계가 잘 잡혀있어서 만족합니다!
                                </span>
                            </p>
                            <p class="info">
                                <span class="name">고객 <em>김*현</em></span>
                                <span class="ec">담당컨설턴트 <em>정혜진</em></span>
                                <span class="date">2019.12.17</span>
                            </p>
                        </div>
                        <div class="slider-item">
                            <p class="comment">
                                <span class="ellipsis-2line">
                                    제가 결정을 번복한적도 있었고, eTA도 늦게 신청했는데, 잘 이해해주셔서 감사했습니다 :) 또 친절하게 상담해주셔서 감사합니다. edm은
                                    체계가 잘 잡혀있어서 만족합니다!
                                </span>
                            </p>
                            <p class="info">
                                <span class="name">고객 <em>김*현</em></span>
                                <span class="ec">담당컨설턴트 <em>정혜진</em></span>
                                <span class="date">2019.12.17</span>
                            </p>
                        </div>
                    </div>
                </div>

            </section>
        </div>
    </article>

@endsection