@extends('programs.show')

@push('head')
    <link rel="stylesheet" type="text/css" href="/css/programs/english-plus.css"/>
    <script type="text/javascript" src="/js/fixedTabScroller.js"></script>
@endpush

@section('details')
    <link rel="stylesheet" type="text/css" href="{{ asset('css/programs/english-plus.css') }}"/>
    <article class="program english-plus">
        <header class="visual">
            <div class="max-width">
                <p class="font40">영어가 이렇게 재미있을 수 있어요?</p>
                <h1><em>영어 플러스</em> <br class="mo-br">어학연수</h1>
                <p class="font32">영어+전공/자기계발 <br class="mo-br">어학연수 프로그램</p>
                <div class="boxWrap flex-center">
                    <div class="box">
                        <p><em>합리적인 비용</em></p>
                        <p class="font26">초특가 <br class="pc-br">학비 할인</p>
                    </div>
                    <div class="box">
                        <p><em>압도적 무료 혜택</em></p>
                        <p class="font26">출국 전후 <br>빈틈없는 케어</p>
                    </div>
                </div>
            </div>
        </header>

        <div class="mean">
            <div class="max-width">
                <div class="value">
                    <p class="title"><em>영어 플러스</em> 어학연수란?</p>
                    <p class="sub font32">아트&디자인, 패션, 영화, 음악, 각종 스포츠 등 <br class="pc-br">관심있는 분야의 지식과 경험을 쌓으며 영어 공부를 할 수 있어 <br class="pc-br"><em>영어 실력과 자기계발을 동시에 만족하는 과정</em>입니다.</p>
                    <div class="area">
                        <p class="font32 valueTitle">실제 후기로 보는 <br class="mo-br">영어 플러스 과정 특징</p>
                        <div class="boxWrap flex">
                            <div class="box"></div>
                            <div class="box col3"></div>
                            <div class="box col3"></div>
                            <div class="box col3"></div>
                        </div>
                        <p class="font26 bottomText">수업 주제가 제가 <em>좋아하는 분야와 관련</em>되어 있어 <br class="pc-br">훨씬 <em>재미있게</em> 영어를 배울 수 있어요.</p>
                    </div>
                </div>
                <div class="channel">
                    <div class="circleBox"><span>1위 유학 채널</span></div>
                    <p class="title">유학티비에서 확인하는 <br class="mo-br"><em>영어 플러스</em> 과정</p>
                    <!-- 1위 유학 채널 -->
                    <div class="youtubeArea">
                        <div class="youtube-wrap" id="youtube-con">
                            <iframe src="https://www.youtube.com/embed/CZP2bT0SrrE"  frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
                        </div>
                        <ul>
                            <li data-youtubeid="CZP2bT0SrrE" class="active"><img src="https://i.ytimg.com/vi/CZP2bT0SrrE/mqdefault.jpg" draggable="false"></li>
                            <li data-youtubeid="3h3JOEAaj6k"><img src="https://i.ytimg.com/vi/3h3JOEAaj6k/mqdefault.jpg" draggable="false"></li>
                            <li data-youtubeid="t2kJh2w1cCY"><img src="https://i.ytimg.com/vi/t2kJh2w1cCY/mqdefault.jpg" draggable="false"></li>
                        </ul>
                    </div>
                    <!-- //1위 유학 채널 -->
                </div>
            </div>
        </div>

        <div class="review">
            <div class="max-width">
                <p class="title"><em>영어 플러스</em> 어학연수 후기</p>
                <div class="boxWrap flex">
                    <div class="box">
                        <div class="name" style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_review_icon1.png');">김O영 님</div>
                        <div class="textWrap">
                            <span class="squareBox">수강 수업</span>
                            <strong>English + Toronto</strong>
                            <p class="sub">캐나다 ILSC Language Schools</p>
                            <p>이 수업 덕분에 토론토 곳곳의 새로운 명소들을 직접 가보는 것에서만 끝나지 않고, <em>다양한 친구들과 여러 의견들을 나누고 제가 발표까지</em> 해 보며 잊을 수 없는 도시가 되었습니다.</p>
                        </div>
                    </div>
                    <div class="box">
                        <div class="name" style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_review_icon2.png');">강O나 님</div>
                        <div class="textWrap">
                            <span class="squareBox">수강 수업</span>
                            <strong>English + Film</strong>
                            <p class="sub">미국 Kings English</p>
                            <p>평소 영화나 다큐에 관심이 많아 고민없이 LA를 선택했어요! <em>전문적인 영화 제작 기술과 지식, 경험을 쌓고 트렌드까지</em> 배울 수 있어 너무 좋았습니다.</p>
                        </div>
                    </div>
                    <div class="box">
                        <div class="name" style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_review_icon3.png');">박O민 님</div>
                        <div class="textWrap">
                            <span class="squareBox">수강 수업</span>
                            <strong>English + Fashion</strong>
                            <p class="sub">영국 Bayswater college</p>
                            <p>한국에서 접하기 힘든 <em>크리에이티브들의 강의와 패션 관련 다양한 주제의 실무 수업</em>들이 많아 전문적인 지식과 함께 자연스레 영어가 많이 늘었어요!</p>
                        </div>
                    </div>
                    <div class="box">
                        <div class="name" style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_review_icon4.png');">이O원 님</div>
                        <div class="textWrap">
                            <span class="squareBox">수강 수업</span>
                            <strong>English + Sports</strong>
                            <p class="sub">호주 Browns English Language School</p>
                            <p>편안하고 여유로운 도시 골드코스트에서 주 2회 서핑의 기본기부터 차근차근 배우며 실력은 물론 <em>호주 현지 친구들을 많이 사귈 수 있어</em> 좋은 시간이었습니다. </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="lineBox">
            <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_lineBox01.png');"></figure>
            <p>지루할 틈 없이 재미있고 유익한 <br class="mo-br">어학연수를 경험하세요.</p>
        </div>

        <div class="courseType">
            <div class="max-width">
                <p class="title"><em>영어 플러스</em> 과정 종류</p>
                <div class="typeWrap flex">
                    <div class="type">
                        <div class="imgWrap">
                            <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_courseType01.jpg');"></figure>
                            <span>영어 + Art&Design</span>
                        </div>
                        <div class="textWrap">
                            <span class="squareBox">특징</span>
                            <p>본인 레벨에 맞는 영어 수업과 Drawing, Painting, Sculpture, Photography 등 <b>다양한 아트&디자인 관련 주제의 수업 진행</b></p>
                            <span class="squareBox">추천대상</span>
                            <p>영어 실력을 향상 시키며, <em>미술과 디자인 관련 현장을 경험하거나 관련 이론과 기술을 함께 공부</em>하고 싶은 분</p>
                        </div>
                    </div>
                    <div class="type">
                        <div class="imgWrap">
                            <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_courseType02.jpg');"></figure>
                            <span>영어 + Fashion</span>
                        </div>
                        <div class="textWrap">
                            <span class="squareBox">특징</span>
                            <p>영어 실력 향상과 함께 관심 분야인 <b>패션 산업에 대한 지식, 전문 용어, 인사이트, 트렌드 예측 등</b>을 전문가와 함께 배우는 과정</p>
                            <span class="squareBox">추천대상</span>
                            <p>영어 수업과 함께 세계적인 트렌드를 선도하는 <em>패션, 예술 및 디자인 현장을 직접 경험</em>하고 싶은 분</p>
                        </div>
                    </div>
                    <div class="type">
                        <div class="imgWrap">
                            <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_courseType03.jpg');"></figure>
                            <span>영어 + Sports</span>
                        </div>
                        <div class="textWrap">
                            <span class="squareBox">특징</span>
                            <p>오전에는 영어 수업을, 오후에는 골프, 테니스 등 <b>자신이 관심있는 운동을 배우며 자연스럽게 영어 스피킹 기회</b>를 늘릴 수 있는 과정</p>
                            <span class="squareBox">추천대상</span>
                            <p>기본 영어 수업과 함께 어학연수 중에도 <em>계속해서 관심있는 운동을 전문적으로 배우며</em> 이어 나가고자 하는 분</p>
                        </div>
                    </div>
                    <div class="type">
                        <div class="imgWrap">
                            <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_courseType04.jpg');"></figure>
                            <span>영어 + Film</span>
                        </div>
                        <div class="textWrap">
                            <span class="squareBox">특징</span>
                            <p>영어 학습과 더불어 <b>영화 혹은 TV 산업 관련 역사, 전문 지식, 이론, 제작, 트렌드 등을 배우고 실습을 통해</b> 경험을 쌓을 수 있는 과정</p>
                            <span class="squareBox">추천대상</span>
                            <p>영상 제작 관련 이론과 기술을 배울 수 있어, <em>영어 실력과 함께 실제 영화 제작 경험</em>까지 원하시는 분</p>
                        </div>
                    </div>
                    <div class="type">
                        <div class="imgWrap">
                            <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_courseType05.jpg');"></figure>
                            <span>영어 + Music</span>
                        </div>
                        <div class="textWrap">
                            <span class="squareBox">특징</span>
                            <p>대중음악 및 다양한 장르에 대해 이해하고 토론하며 <b>'음악' 주제와 관련해 집중적으로 어휘력과 유창성을 향상</b>시킬 수 있는 과정</p>
                            <span class="squareBox">추천대상</span>
                            <p>다양한 장르의 음악이나 <em>관련 산업에 대한 지식 및 경험을 나누며 영어 실력을 향상</em>시키고자 하는 분</p>
                        </div>
                    </div>
                    <div class="type last">
                        <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_courseType06.jpg');"></figure>
                        <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_courseType07.jpg');"></figure>
                        <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_courseType08.jpg');"></figure>
                    </div>
                </div>
                <p class="title type2"><em>영어 플러스</em> 과정 <br>국가별 추천 어학연수 기관</p>
            </div>

            <div class="rec">
                <nav>
                    <ul class="flex-center">
                        <li class="active"><button type="button">영국</button></li>
                        <li><button type="button">미국</button></li>
                        <li><button type="button">캐나다</button></li>
                        <li><button type="button">호주</button></li>
                    </ul>
                </nav>
                <div class="max-width">
                    <div class="listWrap">
                        <div class="list">
                            <div class="font32 subTitle">
                                <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_flag_uk.jpg');"></figure>
                                <p>문화 예술, 전통과 <br class="mo-br">현대의 조화로운 공존</p>
                            </div>
                            <article class="flex">
                                <div class="imgWrap">
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_rec_uk01.jpg');" class="bgImage pc-image"></figure>
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_rec_uk01_mo.jpg');" class="bgImage mo-image"></figure>
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_logo_kings.svg');" class="logo"></figure>
                                </div>
                                <div class="textWrap">
                                    <strong>킹스 잉글리쉬</strong>
                                    <p class="sub">Kings English</p>
                                    <p>- 1957년에 설립되어 60여 년 이상의 교육 경험을 가진 어학원</p>
                                    <p>- 아트 파운데이션 과정을 운영해, 필요 시설을 갖춘 아트 스튜디오 사용 가능</p>
                                    <p>- 회화, 드로잉 및 모델링을 가르치기 위한 특수 장비를 갖춘 어학원</p>
                                    <div class="bottomText">
                                        <span class="squareBox">프로그램</span>
                                        <p>English Plus Art and Design (런던, 옥스퍼드)</p>
                                    </div>
                                </div>
                            </article>
                            <article class="flex">
                                <div class="imgWrap">
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_rec_uk02.jpg');" class="bgImage pc-image"></figure>
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_rec_uk02_mo.jpg');" class="bgImage mo-image"></figure>
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_logo_giles.svg');" class="logo"></figure>
                                </div>
                                <div class="textWrap">
                                    <strong>세인트 자일스 인터내셔널</strong>
                                    <p class="sub">St. Giles International</p>
                                    <p>- 1955년에 설립된 영국 전통 그룹 어학원</p>
                                    <p>- 아름다운 런던 교외 지역인 Highgate에 위치해 있으며, 높은 프로그램 만족도</p>
                                    <p>- 아트 관련 주제에 대한 어휘와 역사를 배우고, 기초 이론을 배우는 과정 제공</p>
                                    <div class="bottomText">
                                        <span class="squareBox">프로그램</span>
                                        <p>General English plus Art & Design (런던 하이게이트)</p>
                                    </div>
                                </div>
                            </article>
                            <article class="flex">
                                <div class="imgWrap">
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_rec_uk03.jpg');" class="bgImage pc-image"></figure>
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_rec_uk03_mo.jpg');" class="bgImage mo-image"></figure>
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_logo_bayswater.svg');" class="logo"></figure>
                                </div>
                                <div class="textWrap">
                                    <strong>베이스워터 컬리지</strong>
                                    <p class="sub">Bayswater College</p>
                                    <p>- 디지털 마케팅, 패션, 럭셔리 매니지먼트 등 만족도 높은 영어+전문 과정 운영</p>
                                    <p>- Hyde Park에서 도보 5분 거리, Bayswater 역 및 관광지에 인접한 곳에 위치</p>
                                    <p>- 워크숍, 패션 실무 전문종사자 강연, 실무관련 어드바이스 등 제공</p>
                                    <div class="bottomText">
                                        <span class="squareBox">프로그램</span>
                                        <p>Luxury Brand Management Fashion Course (런던)</p>
                                    </div>
                                </div>
                            </article>
                        </div>
                        <div class="list">
                            <div class="font32 subTitle">
                                <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_flag_usa.jpg');"></figure>
                                <p>전 세계를 이끄는 문화의 중심</p>
                            </div>
                            <article class="flex">
                                <div class="imgWrap">
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_rec_usa01.jpg');" class="bgImage pc-image"></figure>
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_rec_usa01_mo.jpg');" class="bgImage mo-image"></figure>
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_logo_kings.svg');" class="logo"></figure>
                                </div>
                                <div class="textWrap">
                                    <strong>킹스 잉글리쉬</strong>
                                    <p class="sub">Kings English</p>
                                    <p>- 60여 년 이상의 오랜 역사를 자랑하는 수준 높은 영어 교육 기관</p>
                                    <p>- LA는 Kings 미국 본사가 있는 LA 할리우드 지역에 위치한 프라이빗 캠퍼스</p>
                                    <p>- 맨하탄 인근 대학 내 위치한 뉴욕 센터는, 캠퍼스 내 다양한 활동에도 참여 가능</p>
                                    <div class="bottomText">
                                        <span class="squareBox">프로그램</span>
                                        <p>English Plus Film (LA)</p>
                                        <p>English for Fashion, Art and Design (뉴욕)</p>
                                    </div>
                                </div>
                            </article>
                        </div>
                        <div class="list">
                            <div class="font32 subTitle">
                                <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_flag_canada.jpg');"></figure>
                                <p>다양한 인종, 다양한 관심사</p>
                            </div>
                            <article class="flex">
                                <div class="imgWrap">
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_rec_canada01.jpg');" class="bgImage pc-image"></figure>
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_rec_canada01_mo.jpg');" class="bgImage mo-image"></figure>
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_logo_ilsc.svg');" class="logo"></figure>
                                </div>
                                <div class="textWrap">
                                    <strong>아이엘에스씨</strong>
                                    <p class="sub">ILSC Language Schools</p>
                                    <p>- 독창적인 ESL 커리큘럼을 운영하여 니즈에 따라 스케쥴 및 수업 선택 가능</p>
                                    <p>- 스피킹, 비즈니스, 호텔 경영, 테솔 등 다양한 전문 프로그램 제공</p>
                                    <p>- 학생들을 위한 전문 카운슬러가 수업, 레벨, 액티비티 등 세심한 카운슬링 제공</p>
                                    <div class="bottomText">
                                        <span class="squareBox">프로그램</span>
                                        <p>Creative English-Acting, English through Yoga (밴쿠버)</p>
                                        <p>English through Film & Video (밴쿠버, 토론토, 몬트리올)</p>
                                        <p>English through Music (토론토, 몬트리올)</p>
                                        <p>English through Toronto (토론토)</p>
                                    </div>
                                </div>
                            </article>
                        </div>
                        <div class="list">
                            <div class="font32 subTitle">
                                <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_flag_australia.jpg');"></figure>
                                <p>아름다운 대자연을 <br class="mo-br">누릴 수 있는 액티비티 천국</p>
                            </div>
                            <article class="flex">
                                <div class="imgWrap">
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_rec_australia01.jpg');" class="bgImage pc-image"></figure>
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_rec_australia01_mo.jpg');" class="bgImage mo-image"></figure>
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_logo_browns.svg');" class="logo"></figure>
                                </div>
                                <div class="textWrap">
                                    <strong>브라운스 잉글리쉬 랭귀지 스쿨</strong>
                                    <p class="sub">Browns English Language School</p>
                                    <p>- 오랜 경험과 노하우를 통해 자체 개발한 최고 수준의 커리큘럼</p>
                                    <p>- 사우스포트 중심지에 위치해 바닷가, 각종 편의시설이 도보 거리내 위치</p>
                                    <p>- 매주 다양한 방과 후 소셜 액티비티 제공</p>
                                    <div class="bottomText">
                                        <span class="squareBox">프로그램</span>
                                        <p>Intensive English 주당 20시간 +</p>
                                        <p>Surf/Tennis/Golf/Scuba Diving/Yoga 주 2회 플러스 수업 (골드코스트)</p>
                                    </div>
                                </div>
                            </article>
                        </div>
                    </div>
                </div>
            </div>

        </div>

        <div class="lineBox">
            <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/english-plus/english-plus_lineBox02.png');"></figure>
            <p>영어 실력만큼 <br class="mo-br"><em>혜택도 크게 플러스</em>하세요!</p>
        </div>

        <!-- 쏟아지는 edm유학센터 고객 후기! -->
        @include('include.real-review', ['key' => 'type2'])

        <!-- 압도적 어학연수 혜택 (type2 : maxWidth : 1080px ) -->
        @include('programs.details.language-abroad-benefit', ['key' => 'type2'])

        <!-- 유학티비 (type2 : maxWidth : 1080px ) -->
        @include('programs.details.uhak-tv', ['key' => 'type2'])

        <!-- edm조기유학 선택 이유 (type2 : maxWidth : 1080px ) -->
        @include('programs.details.why-edm-default', ['key' => 'type2'])

        <!-- 2024 대한민국 퍼스트브랜드 대상 수상 (type2 : maxWidth : 1080px ) -->
        @include('include.korea-first-brand', ['key' => 'type2'])
    </article>

    <script type="text/javascript">
        $(function(){
            // 동영상 클릭시 변경
            $('.mean .youtubeArea ul li').on('click',function(){
                let thisId = $(this).data('youtubeid');
                let src = 'https://www.youtube.com/embed/' + thisId + '?autoplay=1&mute=1';
                $('#youtube-con iframe').attr('src',src);
                $(this).addClass('active').siblings().removeClass('active');
            });



            let _userH = $(window).innerHeight()/5;
            $(window).on('scroll',function(){
                $('.courseType nav li').removeClass('active');
                var arr = [];
                let tabMenuH = $('.courseType nav').outerHeight();

                $('.courseType .listWrap .list').each(function(index,item){
                    let arr2 = $(item).offset().top - tabMenuH - 30;
                    arr.push(arr2);
                });

                let thisScroll = $(this).scrollTop();
                for(var i = 0; i < arr.length; i++){
                    if(arr[i] <= thisScroll + _userH){
                        $('.courseType nav li').eq(i).addClass('active').siblings().removeClass('active');
                    }else if(thisScroll + _userH < arr[0]){
                        $('.courseType nav li').eq(0).addClass('active').siblings().removeClass('active');
                    }
                }
            });

            $('.courseType nav li').on('click',function(){
                var arr = [];
                let tabMenuH = $('.courseType nav').outerHeight();
                let thisIndex = $(this).index();

                $('.courseType .listWrap .list').each(function(index,item){
                    let arr2 = $(item).offset().top - tabMenuH - 30;
                    arr.push(arr2);
                });

                $(window).scrollTop(arr[thisIndex]);
            });
        });
    </script>
@endsection