@extends('layouts.default')

@section('content')
    <link rel="stylesheet" type="text/css" href="{{ asset('css/programs/programs.css') }}"/>
    <script src="{{ asset('js/programs/programs.js') }}"></script>

    <div class="container submain-programs">
        <!-- 사이트 경로 표시 -->
        <div class="area-pages-wayfinding">
            <div class="flex-wrap">
                <div class="way-prev-dep">
                    <a href="#">나에게 맞는 프로그램 찾기</a>
                </div>
                <ul class="way-curr-dep">
                    <li>
                        <a href="#">어학연수 가이드</a>
                    </li>
                    <li>
                        <a href="#">주요도시</a>
                        <ul class="gnb-dep4">
                            <li><a href="#">뉴욕</a></li>
                            <li><a href="#">보스턴</a></li>
                            <li><a href="#">샌프란시스코</a></li>
                            <li><a href="#">샌디에고</a></li>
                            <li><a href="#">시애틀</a></li>
                            <li><a href="#">로스엔젤레스</a></li>
                            <li><a href="#">시카고</a></li>
                        </ul>
                    </li>
                    <li>
                        <a href="#">프로그램</a>
                        <ul class="gnb-dep4">
                            <li><a href="#">뉴욕</a></li>
                            <li><a href="#">보스턴</a></li>
                            <li><a href="#">샌프란시스코</a></li>
                            <li><a href="#">샌디에고</a></li>
                            <li><a href="#">시애틀</a></li>
                            <li><a href="#">로스엔젤레스</a></li>
                            <li><a href="#">시카고</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
        <!-- 제목 및 현재위치 표시 -->
        <div class="area-pages-top">
            <!--<div class="area-page-location">현재위치표시가 따로 표기될 경우</div>-->
            <h1 class="page-title">나에게 맞는 프로그램 찾기</h1>
        </div>
        <div class="area-pages-content">
            <div class="flex-wrap">
                <!-- 상품검색필터 -->
                <div class="area-programs-condition">
                    <!-- search -->
                    <div class="apc-search">
                        <h2 class="hidden"><label for="apc-search">유학프로그램 검색</label></h2>
                        <input type="text" id="apc-search" name="" />
                        <button class="btn-search">검색</button>
                    </div>
                    <!-- category -->
                    <div class="apc-category">
                        <h2 class="apc-title">과정별 프로그램</h2>
                        <div class="apc-cate-list">
                            <!--<a href="#">전체보기</a>-->
                            <a href="#">어학연수</a>
                            <a href="#">워홀&middot;인턴쉽</a>
                            <a href="#">해외대학</a>
                            <a href="#">조기유학</a>
                        </div>
                    </div>
                    <!-- filters -->
                    <div class="apc-filter">
                        <h2 class="apc-title">필터</h2>
                        <div class="filter-item">
                            <p class="fi-tit">국가</p>
                            <div class="chk-custom-wrap">
                                <span><input type="checkbox" id="pg-fi-country1" name="" ><label for="pg-fi-country1">미국</label></span>
                                <span><input type="checkbox" id="pg-fi-country2" name="" ><label for="pg-fi-country2">영국</label></span>
                                <span><input type="checkbox" id="pg-fi-country3" name="" ><label for="pg-fi-country3">캐나다</label></span>
                                <span><input type="checkbox" id="pg-fi-country4" name="" ><label for="pg-fi-country4">필리핀</label></span>
                                <span><input type="checkbox" id="pg-fi-country5" name="" ><label for="pg-fi-country5">아일랜드</label></span>
                                <span><input type="checkbox" id="pg-fi-country6" name="" ><label for="pg-fi-country6">뉴질랜드</label></span>
                                <span><input type="checkbox" id="pg-fi-country7" name="" ><label for="pg-fi-country7">몰타</label></span>
                            </div>
                        </div>
                        <div class="filter-item">
                            <p class="fi-tit">테마</p>
                            <div class="chk-custom-wrap">
                                <span><input type="checkbox" id="pg-fi-theme1" name="" ><label for="pg-fi-theme1">영어&middot;문화</label></span>
                                <span><input type="checkbox" id="pg-fi-theme2" name="" ><label for="pg-fi-theme2">2개국연계연수</label></span>
                                <span><input type="checkbox" id="pg-fi-theme3" name="" ><label for="pg-fi-theme3">직장인</label></span>
                                <span><input type="checkbox" id="pg-fi-theme4" name="" ><label for="pg-fi-theme4">시니어</label></span>
                                <span><input type="checkbox" id="pg-fi-theme5" name="" ><label for="pg-fi-theme5">초특가</label></span>
                                <span><input type="checkbox" id="pg-fi-theme6" name="" ><label for="pg-fi-theme6">특별기획전</label></span>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- content -->
                <div class="area-programs-wrap">
                    <div class="result-info">
                        <!-- 결과값이 있을경우에만 출력 -->
                        <h2 class="ri-tit">총 100개의 결과</h2>
                        <div class="selected-tag-wrap">
                            <span class="tag">어학연수 <i class="ui-kit-x">삭제</i></span>
                            <span class="tag">영국 <i class="ui-kit-x">삭제</i></span>
                            <span class="tag">2개국어학연수 <i class="ui-kit-x">삭제</i></span>
                            <span class="tag">미국 <i class="ui-kit-x">삭제</i></span>
                            <span class="clear-all">모든필터제거</span>
                        </div>
                        <!--// 결과값이 있을경우에만 출력 -->
                        <div class="view-array">
                            <select class="choose">
                                <option value="1" selected>최신순</option>
                                <option value="2">조회수순</option>
                                <option value="3">가나다순</option>
                            </select>
                        </div>
                    </div>

                    <div class="result-list area-pg-list col3">
                        <div class="area-pg-item">
                            <div class="pg-item-thumb">
                                <div class="bg"><img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/banner/tmp/program-thumb-short.png" alt=""></div>
                                <div class="title">
                                    <p>
                                        <span>단기어학연수</span><br>
                                        <span class="color">종합패키지</span>
                                    </p>
                                </div>
                                <div class="cate">
                                    <span class="lang">어학연수</span>
                                    <!--<span class="univ">해외대학</span>
                                    <span class="junior">조기유학</span>
                                    <span class="working">워홀&middot;인턴십</span>-->
                                </div>
                            </div>
                            <div class="pg-item-cont">
                                <div class="pg-text">
                                    1~2개월 단기연수 준비생을 위한 종합패키지
                                </div>
                                <div class="tag">
                                    <span>미국</span>
                                    <span>캐나다</span>
                                    <span>영국</span>
                                    <span>호주</span>
                                    <span>뉴질랜드</span>
                                </div>
                            </div>
                        </div>
                        <div class="area-pg-item">
                            <div class="pg-item-thumb">
                                <div class="bg"><img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/banner/tmp/program-thumb-short.png" alt=""></div>
                                <div class="title">
                                    <p>
                                        <span>단기어학연수</span><br>
                                        <span class="color">종합패키지</span>
                                    </p>
                                </div>
                                <div class="cate">
                                    <span class="lang">어학연수</span>
                                    <!--<span class="univ">해외대학</span>
                                    <span class="junior">조기유학</span>
                                    <span class="working">워홀&middot;인턴십</span>-->
                                </div>
                            </div>
                            <div class="pg-item-cont">
                                <div class="pg-text">
                                    1~2개월 단기연수 준비생을 위한 종합패키지
                                </div>
                                <div class="tag">
                                    <span>미국</span>
                                    <span>캐나다</span>
                                    <span>영국</span>
                                    <span>호주</span>
                                    <span>뉴질랜드</span>
                                </div>
                            </div>
                        </div>
                        <div class="area-pg-item">
                            <div class="pg-item-thumb">
                                <div class="bg"><img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/banner/tmp/program-thumb-short.png" alt=""></div>
                                <div class="title">
                                    <p>
                                        <span>단기어학연수</span><br>
                                        <span class="color">종합패키지</span>
                                    </p>
                                </div>
                                <div class="cate">
                                    <span class="lang">어학연수</span>
                                    <!--<span class="univ">해외대학</span>
                                    <span class="junior">조기유학</span>
                                    <span class="working">워홀&middot;인턴십</span>-->
                                </div>
                            </div>
                            <div class="pg-item-cont">
                                <div class="pg-text">
                                    1~2개월 단기연수 준비생을 위한 종합패키지
                                </div>
                                <div class="tag">
                                    <span>미국</span>
                                    <span>캐나다</span>
                                    <span>영국</span>
                                    <span>호주</span>
                                    <span>뉴질랜드</span>
                                </div>
                            </div>
                        </div>
                        <div class="area-pg-item">
                            <div class="pg-item-thumb">
                                <div class="bg"><img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/banner/tmp/program-thumb-short.png" alt=""></div>
                                <div class="title">
                                    <p>
                                        <span>단기어학연수</span><br>
                                        <span class="color">종합패키지</span>
                                    </p>
                                </div>
                                <div class="cate">
                                    <span class="lang">어학연수</span>
                                    <!--<span class="univ">해외대학</span>
                                    <span class="junior">조기유학</span>
                                    <span class="working">워홀&middot;인턴십</span>-->
                                </div>
                            </div>
                            <div class="pg-item-cont">
                                <div class="pg-text">
                                    1~2개월 단기연수 준비생을 위한 종합패키지
                                </div>
                                <div class="tag">
                                    <span>미국</span>
                                    <span>캐나다</span>
                                    <span>영국</span>
                                    <span>호주</span>
                                    <span>뉴질랜드</span>
                                </div>
                            </div>
                        </div>
                        <div class="area-pg-item">
                            <div class="pg-item-thumb">
                                <div class="bg"><img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/banner/tmp/program-thumb-short.png" alt=""></div>
                                <div class="title">
                                    <p>
                                        <span>단기어학연수</span><br>
                                        <span class="color">종합패키지</span>
                                    </p>
                                </div>
                                <div class="cate">
                                    <span class="lang">어학연수</span>
                                    <!--<span class="univ">해외대학</span>
                                    <span class="junior">조기유학</span>
                                    <span class="working">워홀&middot;인턴십</span>-->
                                </div>
                            </div>
                            <div class="pg-item-cont">
                                <div class="pg-text">
                                    1~2개월 단기연수 준비생을 위한 종합패키지
                                </div>
                                <div class="tag">
                                    <span>미국</span>
                                    <span>캐나다</span>
                                    <span>영국</span>
                                    <span>호주</span>
                                    <span>뉴질랜드</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="area-pagination">
                        <div class="arr">
                            <a href="#" class="first">첫 목록으로</a>
                            <a href="#" class="prev">이전 목록으로</a>
                        </div>
                        <div class="pages">
                            <a href="#" class="active">1</a>
                            <a href="#">2</a>
                            <a href="#">3</a>
                            <a href="#">4</a>
                            <a href="#">5</a>
                            <a href="#">6</a>
                            <a href="#">7</a>
                            <a href="#">8</a>
                            <a href="#">9</a>
                            <a href="#">10</a>
                        </div>
                        <div class="arr">
                            <a href="#" class="next">다음 목록으로</a>
                            <a href="#" class="last">마지막 목록으로</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="flex-wrap program-hit">
                <h2>edm유학센터 인기프로그램</h2>
                <div class="area-pg-list full">
                    <div class="area-pg-item">
                        <div class="pg-item-thumb">
                            <div class="bg"><img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/banner/tmp/program-thumb-short.png" alt=""></div>
                            <div class="title">
                                <p>
                                    <span>단기어학연수</span><br>
                                    <span class="color">종합패키지</span>
                                </p>
                            </div>
                            <div class="cate">
                                <span class="lang">어학연수</span>
                                <!--<span class="univ">해외대학</span>
                                <span class="junior">조기유학</span>
                                <span class="working">워홀&middot;인턴십</span>-->
                            </div>
                        </div>
                        <div class="pg-item-cont">
                            <div class="pg-text">
                                1~2개월 단기연수 준비생을 위한 종합패키지
                            </div>
                            <div class="tag">
                                <span>미국</span>
                                <span>캐나다</span>
                                <span>영국</span>
                                <span>호주</span>
                                <span>뉴질랜드</span>
                            </div>
                        </div>
                    </div>
                    <div class="area-pg-item">
                        <div class="pg-item-thumb">
                            <div class="bg"><img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/banner/tmp/program-thumb-short.png" alt=""></div>
                            <div class="title">
                                <p>
                                    <span>단기어학연수</span><br>
                                    <span class="color">종합패키지</span>
                                </p>
                            </div>
                            <div class="cate">
                                <span class="lang">어학연수</span>
                                <!--<span class="univ">해외대학</span>
                                <span class="junior">조기유학</span>
                                <span class="working">워홀&middot;인턴십</span>-->
                            </div>
                        </div>
                        <div class="pg-item-cont">
                            <div class="pg-text">
                                1~2개월 단기연수 준비생을 위한 종합패키지
                            </div>
                            <div class="tag">
                                <span>미국</span>
                                <span>캐나다</span>
                                <span>영국</span>
                                <span>호주</span>
                                <span>뉴질랜드</span>
                            </div>
                        </div>
                    </div>
                    <div class="area-pg-item">
                        <div class="pg-item-thumb">
                            <div class="bg"><img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/banner/tmp/program-thumb-short.png" alt=""></div>
                            <div class="title">
                                <p>
                                    <span>단기어학연수</span><br>
                                    <span class="color">종합패키지</span>
                                </p>
                            </div>
                            <div class="cate">
                                <span class="lang">어학연수</span>
                                <!--<span class="univ">해외대학</span>
                                <span class="junior">조기유학</span>
                                <span class="working">워홀&middot;인턴십</span>-->
                            </div>
                        </div>
                        <div class="pg-item-cont">
                            <div class="pg-text">
                                1~2개월 단기연수 준비생을 위한 종합패키지
                            </div>
                            <div class="tag">
                                <span>미국</span>
                                <span>캐나다</span>
                                <span>영국</span>
                                <span>호주</span>
                                <span>뉴질랜드</span>
                            </div>
                        </div>
                    </div>
                    <div class="area-pg-item">
                        <div class="pg-item-thumb">
                            <div class="bg"><img src="https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/banner/tmp/program-thumb-short.png" alt=""></div>
                            <div class="title">
                                <p>
                                    <span>단기어학연수</span><br>
                                    <span class="color">종합패키지</span>
                                </p>
                            </div>
                            <div class="cate">
                                <span class="lang">어학연수</span>
                                <!--<span class="univ">해외대학</span>
                                <span class="junior">조기유학</span>
                                <span class="working">워홀&middot;인턴십</span>-->
                            </div>
                        </div>
                        <div class="pg-item-cont">
                            <div class="pg-text">
                                1~2개월 단기연수 준비생을 위한 종합패키지
                            </div>
                            <div class="tag">
                                <span>미국</span>
                                <span>캐나다</span>
                                <span>영국</span>
                                <span>호주</span>
                                <span>뉴질랜드</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection