@extends('programs.show')

@push('head')
    <link rel="stylesheet" type="text/css" href="/css/common-renewal.css?v=241028v5">
    <link rel="stylesheet" type="text/css" href="/css/programs/junior-abroad-seminar-admission.css?v=241028v5">
@endpush

@section('details')
    <div class="container program junior-abroad-seminar-admission">
        <header class="area-pg-visual">
            <figure class="bgImage"></figure>
            <div class="maxWidth">
                <div class="titleWrap">
                    <span>인기</span><span>이달 한정 혜택</span>
                    <h1 class="title">초중고 유학 <br class="pc-br">입학전략 세미나</h1>
                    <p class="sub">국내 1위 일대일 맞춤 서비스 + 특별한 추가 혜택 </p>
                </div>
                <div class="contactWrap">
                    <div class="box">
                        <strong>국가</strong>
                        <p>미국, 영국, 캐나다, 뉴질랜드</p>
                    </div>
                    <div class="box">
                        <strong>대상</strong>
                        <p>아이 혼자 유학 : 초5 ~ 고2</p>
                        <p>부모 동반 유학 : 초1 ~ 고2</p>
                    </div>
                    <a href="/inquiry/consultation?program_id=138" class="contact-btn"><span>무료 세미나 신청</span> <figure class="arrow"></figure></a>
                </div>
            </div>
        </header>

        <section>
            <!-- 페이지 탭 메뉴 -->
            <div id="page-tabMenu">
                <div class="maxWidth">
                    <button type="button" class="active">핵심 보기</button>
                    <button type="button">세미나 정보/혜택</button>
                    <button type="button">고객 후기</button>
                </div>
            </div>

            <!-- 핵심 보기 슬라이드 -->
            <article id="pointView" class="moveArea">
                <div class="maxWidth">
                    <div class="slideWrap">
                        <div class="navigation">
                            <div class="fraction"></div>
                            <button type="button" class="control"></button>
                            <button type="button" class="nav-prev"></button>
                            <button type="button" class="nav-next"></button>
                        </div>
                        <div class="slide">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide">
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/pointView_icon_01.svg');"></figure>
                                    <p>조기유학 수속비 <br>50% 할인</p>
                                    <span>25만 원 상당</span>
                                </div>
                                <div class="swiper-slide">
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/pointView_icon_02.svg');"></figure>
                                    <p>학교 추가 지원 <br>1회 무료</p>
                                    <span>50만원 상당</span>
                                </div>
                                <div class="swiper-slide">
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/pointView_icon_03.svg');"></figure>
                                    <p>유학 선행학습 <br>1회 무료</p>
                                    <span>레벨테스트 포함</span>
                                </div>
                                <div class="swiper-slide">
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/pointView_icon_04.svg');"></figure>
                                    <p>국내 1위 <br>유학 전문 컨설팅</p>
                                    <span>개인별 상세 상담 가능</span>
                                </div>
                                <div class="swiper-slide">
                                    <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/pointView_icon_05.svg');"></figure>
                                    <p>100% 안심 <br>현지 케어</p>
                                    <span>가디언, 현지 지사 등</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </article>

            <!-- 전문가에게 듣는 우리 아이 조기유학 성공 전략 -->
            <article class="strategy moveArea">
                <div class="maxWidth">
                    <div class="roundArea">
                        <div class="titleWrap articleTitle">
                            <h2 class="title">전문가에게 듣는 <br class="mo-br">우리 아이 조기유학 성공 전략</h2>
                        </div>
                        <ul class="listWrap">
                            <li class="personWrap">
                                <h3 class="title">조기유학 <br class="pc-br">전문팀 소개</h3>
                                <div class="info">
                                    <div class="person">
                                        <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_person_01.png');"></figure>
                                        <p>이혜영 실장</p>
                                    </div>
                                    <div class="person">
                                        <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_person_02.png');"></figure>
                                        <p>이현승 팀장</p>
                                    </div>
                                    <div class="person">
                                        <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_person_03.png');"></figure>
                                        <p>주애자 부장</p>
                                    </div>
                                    <div class="person">
                                        <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_person_04.png');"></figure>
                                        <p>조혜진 과장</p>
                                    </div>
                                    <div class="person">
                                        <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_person_05.png');"></figure>
                                        <p>김혜지 과장</p>
                                    </div>
                                    <div class="person">
                                        <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_person_06.png');"></figure>
                                        <p>이소라 과장</p>
                                    </div>
                                    <div class="person">
                                        <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_person_07.png');"></figure>
                                        <p>손주연 팀장 <br>(런던지사)</p>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <h3 class="title">세미나 정보</h3>
                                <div class="info">
                                    <b><em>1:1 세미나 (시간 /장소 선택 가능)</em></b>
                                    <p>- 초중고 유학 특성상, 자녀 성향에 맞춘 개별 상담 세미나입니다.</p>
                                    <p>- 오프라인/온라인(Zoom)에서 편안하게 참여하실 수 있습니다.</p>
                                </div>
                            </li>
                            <li class="popular">
                                <h3 class="title">세미나 인기 주제</h3>
                                <div class="info">
                                    <ul class="card">
                                        <li>
                                            <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_topic_icon_01.svg');"></figure>
                                            <p>국가별 조기유학 A to Z</p>
                                            <span>지역, 학교, 비용, <br class="pc-br">진로, 적응 등</span>
                                        </li>
                                        <li>
                                            <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_topic_icon_02.svg');"></figure>
                                            <p>다양한 초중고유학 종류</p>
                                            <span>국가별 공립, 사립학교부터 <br>보딩스쿨까지 모든 것</span>
                                        </li>
                                        <li>
                                            <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_topic_icon_03.svg');"></figure>
                                            <p>우리 아이 잘할 수 있을까?</p>
                                            <span>아이의 성향과 목표/예산별 <br>조기유학 방법 비교</span>
                                        </li>
                                        <li>
                                            <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_topic_icon_04.svg');"></figure>
                                            <p>실제 유학 후기</p>
                                            <span>국가별 공립, 사립학교부터 <br>보딩스쿨까지 모든 것</span>
                                        </li>
                                    </ul>
                                </div>
                            </li>
                            <li class="recommendation">
                                <h3 class="title">추천대상</h3>
                                <div class="info">
                                    <p>- 2025~26년도 조기유학을 희망하는 분</p>
                                    <p>- 자녀 혼자 또는 가족 동반 유학을 고려하시는 분</p>
                                </div>
                            </li>
                            <li class="benefit">
                                <h3 class="title">세미나 제공 혜택</h3>
                                <div class="info">
                                    <ul class="card">
                                        <li>
                                            <div class="textWrap">
                                                <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_benefit_icon_01.svg');"></figure>
                                                <p>조기유학 <br class="pc-br"><em>수속비 50% 할인</em></p>
                                                <span>최대 25만원 상당</span>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="textWrap">
                                                <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_benefit_icon_02.svg');"></figure>
                                                <p>학교 추가지원 <br class="pc-br"><em>1회 무료</em></p>
                                                <span>최대 50만원 상당</span>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="textWrap">
                                                <figure style="background-image: url('{{ env('UHAKIMG_S3') }}/uhak/r/v1/programs/junior-abroad-seminar-admission/strategy_benefit_icon_03.svg');"></figure>
                                                <p>유학 선행학습 <br class="pc-br"><em>1회 무료</em></p>
                                                <span>레벨테스트 포함</span>
                                            </div>
                                        </li>
                                    </ul>
                                    <span>※ 세미나 당일로부터 1개월 이내 수속 시 제공 혜택</span>
                                </div>
                            </li>
                            <li class="program">
                                <h3 class="title">관련 프로그램</h3>
                                <div class="info">
                                    <div class="textWrap">
                                        <p><strong>- 미국 관리형 프로그램 :</strong> 미국 명문대 입학 준비</p>
                                        <p><strong>- 미국 사립학교 프로그램 :</strong> 유학 생활에 빠르게 적응</p>
                                        <p><strong>- 영국 명문대 진학반 :</strong> All Care 프로그램</p>
                                        <p><strong>- 영국 보딩스쿨 :</strong> 500년 전통의 명문!</p>
                                    </div>
                                    <div class="textWrap">
                                        <p><strong>- 캐나다 공립학교 :</strong> 합리적 학비, 높은 교육 수준</p>
                                        <p><strong>- 캐나다 자녀무상 :</strong> 합리적 유학 비용</p>
                                        <p><strong>- 뉴질랜드 명문대 진학 :</strong> 뛰어난 시설의 사립학교</p>
                                        <p><strong>- 필리핀 국제학교 :</strong> 탄탄한 관리 시스템</p>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </article>

            <!-- 국내 대형 유학원의 압도적 파트너십! -->
            <article class="partnership">
                <div class="maxWidth">
                    <div class="articleTitle">
                        <p class="sub">영국, 미국, 캐나다, 뉴질랜드 <br class="mo-br"><em>약 800여개</em>의 학교 및 재단 지원 가능</p>
                        <h2 class="title">edm유학센터의 <br class="mo-br">압도적 파트너십!</h2>
                    </div>
                </div>
            </article>

            <!-- 조기유학 후기 -->
            <article id="earlyStudy" class="common-videoPlay moveArea">
                <div class="maxWidth">
                    <div class="roundArea">
                        <div class="titleWrap articleTitle">
                            <p class="sub">유학 준비 전 확인 필수!</p>
                            <h2 class="title">조기유학 후기</h2>
                        </div>
                        <div class="listWrap">
                            @php
                                $reviewVideos = [
                                    ['cPkLw3WsF68', '?si=Vq9QryRClO7Krbw1','한국과 다른 학교 생활! | 솔직한 캐나다 조기유학 후기 + 일상, 학교 생활, 성적 변화'],
                                    ['QC81P3silSU', '?si=Z4Bi7lFo-Ki--JFh','영국 조기유학 솔직 후기! 보딩스쿨 3년차 학부모가 공개하는 조기유학 준비 A to Z'],
                                    ['MXizGiBo7tE', '?si=mwakLKE_fSagXj4t','영국 조기유학 생생한 경험담!🇬🇧 유학와서 달라진 점? 보딩스쿨에서 어떻게 지내나요?'],
                                    ['59HrD-mBrB4', '?si=Pnb2YN0K6OTk6SUR','캐나다 조기유학 학부모 솔직 후기 | 영어 못해서 어떡하지? 걱정했는데 치열하게 해내더라고요'],
                                    ['xdZvVPUEXGo', '?si=loOzpb1C86-zF8XS','[캐나다 조기유학] 중학생 유학 고민 중이라면 필수 시청! 한국과 캐나다의 차이점?'],
                                    ['Rc_D0Q1TZbY', '?si=POs5y96R7T_Hm2NX','[조기유학] 캐나다&영국 TOP 명문대학 합격 5관왕! | 캐나다에서 영국 대학 진학이 가능한가요?']
                                ];
                            @endphp
                            @foreach ($reviewVideos as list($thumbnail, $videoKey, $subject))
                            <div class="box">
                                <div class="videoWrap youtube popupOn" data-youtube="{{ $thumbnail }}{{ $videoKey }}">
                                    <figure style="background-image:url('https://img.youtube.com/vi/{{ $thumbnail }}/mqdefault.jpg')"></figure>
                                </div>
                                <div class="textWrap">
                                    <p>{{ $subject }}</p>
                                </div>
                            </div>
                            @endforeach
                            <button type="button" class="moreBtn"><span>더보기</span><figure class="arrow"></figure></button>
                        </div>
                    </div>
                </div>
                <div class="videoPopup" style="display: none;">
                    <div class="popup">
                        <button type="button" class="closeBtn"><span>닫기</span></button>
                        <iframe src="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen=""></iframe>
                    </div>
                    <div class="dim"></div>
                </div>
            </article>
        </section>

        <!-- 유학티비 -->
        <article id="uhakTv" class="common-videoPlay iframe">
            <div class="maxWidth">
                <div class="articleTitle">
                    <h2 class="title">유학티비<figure></figure></h2>
                    <p class="sub">가장 신뢰할 수 있는 업계 1위 유학정보 채널</p>
                </div>
                <div class="slideWrap">
                    <div class="navigation">
                        <div class="fraction"></div>
                        <button type="button" class="nav-prev"></button>
                        <button type="button" class="nav-next"></button>
                    </div>
                    <div class="slide" id="video-swiper">
                        <div class="swiper-wrapper">
                            @php
                                $chanelVideos = [
                                    ['vMeRhHnTzrk', '?si=_ACPNiZFBwtJb1gj','[조기유학] 영국 유학원 고르실 때 꼭 확인하세요💚 15+13.. 도합 28년 경력에서 오는 찐 바이브'],
                                    ['y1yZosZh4bY', '?si=lUQxxvv5Gzy3wjRX','영국 조기유학 성공 가이드: 보딩스쿨 생활은 누가 케어하나요? | 가디언에 대한 솔직 토크'],
                                    ['tkEatL_vUpg', '?si=V1Nemn4gfLZfaHX2','캐나다 조기유학 자주 묻는 질문 Q&A | 자녀무상 vs 아이동반, 공립 vs 사립, 유학 추천 시기?'],
                                    ['RGdPGozhUDM', '?si=2NCQJ-4jMDa4XHi2','우리 아이 캐나다 유학은 관리형 조기유학으로 시작해봐요!'],
                                    ['1OrCM79UZKE', '?si=OOWmOTOZlhtnowcd','[조기유학] 영국 유학 후 대학 입시! 이렇게 준비하세요 | 합격 확률 높이는 지원 전략&TIP'],
                                    ['IRdUuTOgFZM', '?si=Q3rdvXwfyBUjeCnU','현지 유학 전문가가 말하는 영국 명문 보딩스쿨 입학 준비 팁 | 지원 시기, 절차, 출국 전 공부'],
                                    ['PCEr0LFYNro', '?si=_QXUtmRqg1oDwPNe','캐나다 조기 유학 비용이 궁금하다면? | 아이 혼자 vs 부모 동반 케이스별 비용을 철저히 분석해드립니다'],
                                    ['P4hBbIT7Qq4', '?si=s1kyiF6tTrAdl6go','캐나다 유학 예정이라면 필수 체크! 현지 케어 어디까지 되나요? #어학연수 #유학 | 유학원 현지센터']
                                ];
                            @endphp

                            @foreach ($chanelVideos as list($thumbnail, $videoKey, $subject))
                                <div class="swiper-slide">
                                    <div class="videoWrap youtube" data-youtube="{{ $thumbnail }}{{ $videoKey }}">
                                        <figure style="background-image:url('https://img.youtube.com/vi/{{ $thumbnail }}/mqdefault.jpg')"></figure>
                                    </div>
                                    <div class="textWrap ellipsis2">
                                        <p class="text">{{ $subject }}</p>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        </article>

        <!-- 왜 edm 유학센터인가요?! (type2 : maxWidth : 1080px ) -->
        @include('programs.details.why-edm-default', ['key' => ''])

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

    </div>

    <script src="{{ asset('js/common-renewal.js?v=241025') }}"></script>
    <script>
        $(function(){

            // 핵심 보기
            var pointView = new Swiper("#pointView .slide", {
                slidesPerView: 1.5,
                slidesPerGroup: 1,
                spaceBetween: 8,
                touchRatio: 1,
                loop: true,
                autoplay : {
                    delay : 2400,
                    disableOnInteraction : false,
                },
                navigation: {
                    nextEl: '#pointView .slideWrap .nav-next',
                    prevEl: '#pointView .slideWrap .nav-prev',
                },
                pagination: {
                    el: "#pointView .slideWrap .fraction",
                    type: "fraction",
                },
                speed: 500,
                breakpoints: {
                    501:{
                        touchRatio: 1,
                        slidesPerView: 2.4,
                        slidesPerGroup: 1,
                        spaceBetween: 8,
                    },
                    769:{
                        touchRatio: 0,
                        slidesPerView: 3.3,
                        slidesPerGroup: 1,
                        spaceBetween: 12,
                    },
                    950:{
                        touchRatio: 0,
                        slidesPerView: 4.3,
                        slidesPerGroup: 1,
                        spaceBetween: 12,
                    },
                }
            });

            let videoPlay_point = true;
            $('#pointView .slideWrap .control').on('click',function(){
                if(videoPlay_point == true){
                    $(this).addClass('play');
                    pointView.autoplay.stop();
                    videoPlay_point = false;
                }else if(videoPlay_point == false){
                    pointView.autoplay.start();
                    $(this).removeClass('play');
                    videoPlay_point = true;
                }
            });

            // 조기유학 모바일 더보기 버튼
            $('#earlyStudy .moreBtn').on('click',function(){
                $('#earlyStudy .listWrap').addClass('more');
            });

        });
    </script>
@endsection