@extends('layouts.default')

@section('content')

    <link rel="stylesheet" type="text/css" href="/css/membership.css"/>
    <script src="{{ asset('js/default-ui.js') }}"></script>

    <div class="container area-pages mypage">
        <!-- 페이지 상단 : 제목 및 현재위치 표시 -->
        <div class="area-pages-top">
            <div class="area-page-location">
                <h1 class="page-title">마이페이지</h1>
                <div class="page-location">
                    <span class="home">Home</span><span class="depth1">마이페이지</span><span class="depth2">수속신청</span>
                </div>
            </div>
        </div>

        <div class="area-pages-content">
            <div class="flex-wrap">
                <!--  lnb -->
                <div class="area-mypage-nav">
                    <p class="hello-user">
                        안녕하세요, <br class="pc-br"> <strong>김동현님</strong>
                    </p>
                    <div class="lnb">
                        <a href="#" class="active btn-apply">수속신청</a>
                        <a href="#" class="btn-myinfo">내 정보수정</a>
                        <a href="#" class="btn-logout">로그아웃</a>
                    </div>
                </div>

                <!-- content -->
                <div class="area-mypage-wrap">
                    <h2 class="cont-title">수속신청</h2>
                    <!-- 단계표시 -->
                    <ul class="md-process-step">
                        <li>1. <span class="pc-text">수속</span>기본정보 <span class="pc-text">입력</span></li>
                        <li class="current">2. 학교/과정/기타<span class="pc-text">정보 입력</span></li>
                        <li>3. <span class="pc-text">수속신청</span>완료</li>
                    </ul>

                    <div class="exp-txt">
                        <p>ㆍ* 표시 항목은 필수입력사항입니다.</p>
                        <p>ㆍ작성하기 어려운 부분은 입력하지 않으셔도 됩니다.  담당 컨설턴트가  자세히 안내해드립니다.</p>
                    </div>

                    <div class="area-mypage-form">
                        <form>
                            <!-- 신청서비스 -->
                            <div class="input-wrap">
                                <p class="af-title">신청서비스 <span class="add-text">아래의 항목을 선택해주세요.</span></p>
                                <div class="input">
                                    <p class="tit"><label for=""> *비자 <span class="add-text">(신청하는 비자를 하나만 선택해주세요.)</span></label></p>
                                    <p>
                                        <select>
                                            <option value="">영국</option>
                                            <option value="">영국</option>
                                            <option value="">영국</option>
                                        </select>
                                    </p>
                                    <p class="chk-custom-wrap">
                                        <span class="chk-custom">
                                            <input type="radio" id="uk-visa1" name="uk-visa"><label for="uk-visa1">관광비자</label>
                                        </span>
                                            <span class="chk-custom">
                                            <input type="radio" id="uk-visa2" name="uk-visa"><label for="uk-visa2">학생비자</label>
                                        </span>
                                            <span class="chk-custom">
                                            <input type="radio" id="uk-visa3" name="uk-visa"><label for="uk-visa3">단기학생방문비자(STSV)</label>
                                        </span>
                                            <span class="chk-custom">
                                            <input type="radio" id="uk-visa4" name="uk-visa"><label for="uk-visa4">장기학생방문비자(ESVV)</label>
                                        </span>
                                            <span class="chk-custom">
                                            <input type="radio" id="uk-visa5" name="uk-visa"><label for="uk-visa5">워킹홀리데이비자</label>
                                        </span>
                                    </p>
                                </div>
                                <div class="input">
                                    <p class="tit"><label for=""> *기타서비스 <span class="add-text">(edm유학센터를 통해서 예약할 경우만 선택해주세요. 중복선택이 가능합니다.)</span></label></p>
                                    <p class="chk-custom-wrap">
                                        <span class="chk-custom">
                                            <input type="checkbox" id="etc1" name="etc"><label for="etc1">유학</label>
                                        </span>
                                        <span class="chk-custom">
                                            <input type="checkbox" id="etc2" name="etc"><label for="etc2">항공권</label>
                                        </span>
                                        <span class="chk-custom">
                                            <input type="checkbox" id="etc3" name="etc"><label for="etc3">홈스테이</label>
                                        </span>
                                        <span class="chk-custom">
                                            <input type="checkbox" id="etc4" name="etc"><label for="etc4">기숙사</label>
                                        </span>
                                        <span class="chk-custom">
                                            <input type="checkbox" id="etc5" name="etc"><label for="etc5">쉐어하우스</label>
                                        </span>
                                    </p>
                                </div>
                            </div>
                            <!-- 학교 과정 정보 -->
                            <div class="input-wrap">
                                <p class="af-title">학교 / 과정 정보</p>
                                <div class="input">
                                    <p class="tit"><label for=""> *학교 / 과정</label></p>
                                    <p class="input">
                                        <select>
                                            <option value="">수속신청할 학교를 선택해주세요.</option>
                                            <option value="1">학교선택</option>
                                            <option value="2">학교선택</option>
                                            <option value="3">학교선택</option>
                                        </select>
                                        <select>
                                            <option value="">수속신청할 학교를 선택해주세요.</option>
                                            <option value="1">학교선택</option>
                                            <option value="2">학교선택</option>
                                            <option value="3">학교선택</option>
                                        </select>
                                    </p>
                                </div>
                                <div class="input column">
                                    <div class="col2">
                                        <p class="tit"><label for=""> * 수업시작일</label></p>
                                        <select>
                                            <option value="">수속신청할 학교를 선택해주세요.</option>
                                            <option value="1">학교선택</option>
                                            <option value="2">학교선택</option>
                                            <option value="3">학교선택</option>
                                        </select>
                                    </div>
                                    <div class="col2">
                                        <p class="tit"><label for=""> * 수업주수</label></p>
                                        <select>
                                            <option value="">수속신청할 학교를 선택해주세요.</option>
                                            <option value="1">학교선택</option>
                                            <option value="2">학교선택</option>
                                            <option value="3">학교선택</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="input text-right">
                                    <a class="button">학교추가 +</a>
                                </div>
                            </div>
                            <!-- 숙박세부정보 -->
                            <div class="input-wrap">
                                <p class="af-title"> 숙박세부정보 <span class="add-text">(숙소를 직접 구하는 경우에는 '숙박형태'에서 '신청안함'을 선택해주세요.)</span></p>
                                <div class="input column">
                                    <div class="col2">
                                        <p class="tit"><label for="">숙박형태</label></p>
                                        <select>
                                            <option value="">수속신청할 학교를 선택해주세요.</option>
                                            <option value="1">학교선택</option>
                                            <option value="2">학교선택</option>
                                            <option value="3">학교선택</option>
                                        </select>
                                    </div>
                                    <div class="col2">
                                        <p class="tit"><label for="">숙소옵션</label></p>
                                        <select>
                                            <option value="">수속신청할 학교를 선택해주세요.</option>
                                            <option value="1">학교선택</option>
                                            <option value="2">학교선택</option>
                                            <option value="3">학교선택</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="input column">
                                    <div class="col2">
                                        <p class="tit"><label for="">숙박기간</label></p>
                                        <select>
                                            <option value="">수속신청할 학교를 선택해주세요.</option>
                                            <option value="1">학교선택</option>
                                            <option value="2">학교선택</option>
                                            <option value="3">학교선택</option>
                                        </select>
                                    </div>
                                    <div class="col2">
                                        <p class="tit"><label for="">숙박시작일</label></p>
                                        <select>
                                            <option value="">수속신청할 학교를 선택해주세요.</option>
                                            <option value="1">학교선택</option>
                                            <option value="2">학교선택</option>
                                            <option value="3">학교선택</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="input">
                                    <p class="tit">식사옵션 <span class="add-text">("아침" 과 "저녁"을 신청하는 경우는 모두 선택해주세요.)</span></p>
                                    <p class="chk-custom-wrap">
                                        <span class="chk-custom">
                                            <input type="checkbox" id="meal1" name="meal"><label for="meal1">아침 (Breakfast)</label>
                                        </span>
                                        <span class="chk-custom">
                                            <input type="checkbox" id="meal2" name="meal"><label for="meal2">점심 (Lunch)</label>
                                        </span>
                                        <span class="chk-custom">
                                            <input type="checkbox" id="meal3" name="meal"><label for="meal3">저녁 (Dinner)</label>
                                        </span>
                                        <span class="chk-custom">
                                            <input type="checkbox" id="meal4" name="meal"><label for="meal4">직접 취사 (Self catering)</label>
                                        </span>
                                    </p>
                                </div>
                                <div class="input option-hs">
                                    <p class="tit">홈스테이 선택사항</p>
                                    <p>
                                        <span class="chk-custom">
                                            <input type="radio" id="hs1-y" name="hs1"><label for="hs1-y">예</label>
                                        </span>
                                        <span class="chk-custom">
                                            <input type="radio" id="hs1-n" name="hs1"><label for="hs1-n">아니오</label>
                                        </span>
                                        <span class="txt">흡연자입니까?</span>
                                    </p>
                                    <p>
                                        <span class="chk-custom">
                                            <input type="radio" id="hs2-y" name="hs2"><label for="hs2-y">예</label>
                                        </span>
                                        <span class="chk-custom">
                                            <input type="radio" id="hs2-n" name="hs2"><label for="hs2-n">아니오</label>
                                        </span>
                                        <span class="txt">애완동물이 있어도 좋습니까?</span>
                                    </p>
                                    <p>
                                        <span class="chk-custom">
                                            <input type="radio" id="hs3-y" name="hs3"><label for="hs3-y">예</label>
                                        </span>
                                        <span class="chk-custom">
                                            <input type="radio" id="hs3-n" name="hs3"><label for="hs3-n">아니오</label>
                                        </span>
                                        <span class="txt">아이들이 있어도 괜찮습니까?</span>
                                    </p>
                                    <p>
                                        <span class="chk-custom">
                                            <input type="radio" id="hs4-y" name="hs4"><label for="hs4-y">예</label>
                                        </span>
                                        <span class="chk-custom">
                                            <input type="radio" id="hs4-n" name="hs4"><label for="hs4-n">아니오</label>
                                        </span>
                                        <span class="txt">특별한 알러지가 있습니까?</span>
                                    </p>
                                </div>
                            </div>
                            <!-- 약관동의 -->
                            <div class="input-wrap agreement">
                                <p class="agreement-all">
                                    <span class="chk"><input type="checkbox" name="" id="agreementAll"/><label for="agreementAll">전체동의</label></span>
                                </p>
                                <div class="agreement-each">
                                    <div class="terms-wrap">
                                        <p class="chk"><input type="checkbox" name="" id="agree1" /><label for="agree1">[필수] 개인정보수집 및 이용안내 동의</label></p>
                                        <span class="toggle-btn">자세히보기</span>
                                        <div class="terms-detail">
                                            약관내용
                                        </div>
                                    </div>
                                    <div class="terms-wrap">
                                        <p class="chk"><input type="checkbox" name="" id="agree2" /><label for="agree2">수속약관 동의</label></p>
                                        <span class="toggle-btn">자세히보기</span>
                                        <div class="terms-detail">
                                            약관내용
                                        </div>
                                    </div>
                                    <div class="terms-wrap">
                                        <p class="chk"><input type="checkbox" name="" id="agree3" /><label for="agree3">수집한 개인정보 위탁동의</label></p>
                                        <span class="toggle-btn">자세히보기</span>
                                        <div class="terms-detail">
                                            약관내용
                                        </div>
                                    </div>
                                    <div class="terms-wrap">
                                        <p class="chk"><input type="checkbox" name="" id="agree4" /><label for="agree4">고유식별정보 수집처리 동의</label></p>
                                        <span class="toggle-btn">자세히보기</span>
                                        <div class="terms-detail">
                                            약관내용
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- 신청하기 -->
                            <div class="button-wrap next">
                                <a href="#" class="button color wide">신청하기</a>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>


@endsection