@extends('ielts.layout')

@section('ielts-css')
    {!! resource('css/ielts/sub.css') !!}

    {!! resource('css/common/nice-select.css') !!}
    {!! resource('css/myclass/my_class.css') !!}
@endsection



@section("ielts-content")
<div class="container">
    <div class="path-wrapper">
        <div class="wrapper">
            <dl class="path">
                <dt class="blind">path</dt>
                <dd>전체</dd>
                <dd>나의 강의실</dd>
                <dd>첨삭학습</dd>
            </dl>
        </div>
    </div>
    <div class="my-class-wrapper">
        <div class="wrapper">
            <div class="my-class-menu">
                <ul>
                    <li>
                        <a href="#none">
                            <i class="ico-myclass-01"></i>
                            <span>메인</span>
                        </a>
                    </li>
                    <li>
                        <a href="#none">
                            <i class="ico-myclass-02"></i>
                            <span>강의수강</span>
                        </a>
                    </li>
                    <li class="on">
                        <a href="#none">
                            <i class="ico-myclass-03"></i>
                            <span>첨삭 학습</span>
                        </a>
                    </li>
                    <li>
                        <a href="#none">
                            <i class="ico-myclass-04"></i>
                            <span>CDT 모의고사</span>
                        </a>
                    </li>
                    <li>
                        <a href="#none">
                            <i class="ico-myclass-05"></i>
                            <span>게시판</span>
                        </a>
                    </li>
                    <li>
                        <a href="#none">
                            <i class="ico-myclass-06"></i>
                            <span>휴강/연장 신청</span>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="my-class-contents">
                <div class="row">
                    <div class="column c100p">
                        <div class="my-tab">
                            <ul>
                                <li class="on"><a href="#none">첨삭등록</a></li>
                                <li><a href="#none">첨삭내역</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="column c100p">
                        <div class="card my-class-sub">
                            <div class="bg-lightgreen pd32 br12">
                                <table class="my-correct-table">
                                    <colgroup>
                                        <col width="173">
                                        <col width="280">
                                        <col width="280">
                                        <col width="281">
                                    </colgroup>
                                    <thead>
                                        <tr>
                                            <th class="text-left">구분</th>
                                            <th><i class="ico-ctable-01"></i>매주 첨삭</th>
                                            <th class="bdr0"><i class="ico-ctable-02"></i>무제한 첨삭</th>
                                            <th class="bdr0"><i class="ico-ctable-03"></i>모두의 첨삭</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td>미이용시 차감</td>
                                            <td class="text-center">수강일로부터 7일에 한 번씩 가능,<br>기간 내 미등록 시 해당 회차는
                                                자동소멸</td>
                                            <td class="text-center bdr0">수강 기간 내 하루 5회까지 첨삭 제출 가능</td>
                                            <td class="text-center bdr0">등록주기 제한 없이 부여된 횟수만큼<br>수강 기간 내 사용 가능
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Premium 서비스 여부</td>
                                            <td class="text-center">불포함</td>
                                            <td class="text-center bdr0">불포함</td>
                                            <td class="text-center bdr0">포함</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                            <div class="list-info mt40">
                                <a href="#none" class="my-btn-default2 md">임시저장한 내용 불러오기</a>
                            </div>
                            <div class="bg-white pd2416 br12">
                                <select class="select-option wide" name="" id="" required>
                                    <option value="" disabled selected>상품을 선택해 주세요.</option>
                                    <option value="" date="수강기간 : 2024.03.19~24.09.30" correct="첨삭명첨삭명첨삭명첨삭명첨삭명첨삭명삭명">%상품명% %옵션명%</option>
                                    <option value="" date="수강기간 : 2024.03.19~24.09.30" correct="첨삭명첨삭명첨삭명첨삭명첨삭명첨삭명삭명">%상품명% %옵션명%</option>
                                    <option value="" date="수강기간 : 2024.03.19~24.09.30" correct="첨삭명첨삭명첨삭명첨삭명첨삭명첨삭명삭명">%상품명% %옵션명%</option>
                                    <option value="" date="수강기간 : 2024.03.19~24.09.30" correct="첨삭명첨삭명첨삭명첨삭명첨삭명첨삭명삭명">%상품명% %옵션명%</option>
                                </select>
                                <div class="option-category pd2416 pb0">
                                    <dl>
                                        <dt>
                                            선택상품
                                        </dt>
                                        <dd>
                                            상품명이 들어갑니다. 상품명이 들어갑니다. 상품명이 들어갑니다. 상품명이 들어갑니다. 상품명이 들어갑니다.
                                        </dd>
                                    </dl>
                                    <dl>
                                        <dt>
                                            서비스 구분
                                        </dt>
                                        <dd>
                                            Basic
                                        </dd>
                                    </dl>
                                    <dl>
                                        <dt>
                                            이용기간
                                        </dt>
                                        <dd>
                                            24.03.15~24.06.30
                                        </dd>
                                    </dl>
                                    <dl>
                                        <dt>
                                            첨삭명
                                        </dt>
                                        <dd>
                                            첨삭명이 들어갑니다.
                                        </dd>
                                    </dl>
                                    <dl class="w100p">
                                        <dt>
                                            미이용 차감일(등록주기)
                                        </dt>
                                        <dd>
                                            상품명이 들어갑니다.상품명이 들어갑니다.상품명이 들어갑니다.상품명이 들어갑니다.
                                        </dd>
                                    </dl>
                                    <dl class="w100p">
                                        <dt>
                                            첨삭명
                                        </dt>
                                        <dd>
                                            <span>총 첨삭회수 30회</span>
                                            <span>첨삭 소진 횟수 : 10회</span>
                                            <span>잔여 첨삭 횟수 <strong>20회</strong></span>
                                        </dd>
                                    </dl>
                                </div>
                            </div>
                            <h5 class="option-title mt60">
                                11회차 첨삭 등록
                            </h5>
                            <div class="option-cont">
                                <div class="option-category between">
                                    <dl>
                                        <dt>
                                            모듈 선택
                                        </dt>
                                        <dd>
                                            <select name="" id="" required>
                                                <option value="" disabled selected>모듈 선택</option>
                                                <option value="">%모듈%</option>
                                            </select>
                                        </dd>
                                    </dl>
                                    <dl disabled>
                                        <dt>
                                            과목 선택
                                        </dt>
                                        <dd>
                                            <select name="" id="" required disabled>
                                                <option value="" disabled selected>과목 선택</option>
                                                <option value="">%과목%</option>
                                            </select>
                                        </dd>
                                    </dl>
                                    <dl disabled>
                                        <dt>
                                            첨삭타입 선택
                                        </dt>
                                        <dd>
                                            <select name="" id="" required disabled>
                                                <option value="" disabled selected>타입 선택</option>
                                                <option value="">%첨삭타입%</option>
                                            </select>
                                        </dd>
                                    </dl>
                                </div>
                                <!-- 패턴선택시 -->
                                <div class="correct-process mt40">
                                    <div class="correct-process-header">
                                        <ul>
                                            <li class="on">
                                                <i class="ico-correct-prc1"></i>
                                                1.패턴 선택
                                            </li>
                                            <li class="off">
                                                <i class="ico-correct-prc4"></i>
                                                2.토픽 선택 & 에세이 작성
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="correct-process-body active">
                                        <ul class="select-crt-prc">
                                            <!-- 반복 -->
                                            <li>
                                                <input type="radio" id="pt1" name="pt">
                                                <label for="pt1">
                                                    <dl>
                                                        <dt>Pattern 1</dt>
                                                        <dd>Analysing figures without the flow of time(BAR/ PIE/
                                                            TABLE/ MIXED) Analysing figures without the flow of
                                                            time(BAR/ PIE/ TABLE/ MIXED)</dd>
                                                    </dl>
                                                </label>
                                            </li>
                                            <!-- //반복 -->
                                            <li>
                                                <input type="radio" id="pt2" name="pt">
                                                <label for="pt2">
                                                    <dl>
                                                        <dt>Pattern 2</dt>
                                                        <dd>Analysing figures without the flow of time(BAR/ PIE/
                                                            TABLE/ MIXED) Analysing figures without the flow of
                                                            time(BAR/ PIE/ TABLE/ MIXED)</dd>
                                                    </dl>
                                                </label>
                                            </li>
                                            <li>
                                                <input type="radio" id="pt3" name="pt">
                                                <label for="pt3">
                                                    <dl>
                                                        <dt>Pattern 3</dt>
                                                        <dd>Analysing figures without the flow of time(BAR/ PIE/
                                                            TABLE/ MIXED) Analysing figures without the flow of
                                                            time(BAR/ PIE/ TABLE/ MIXED)</dd>
                                                    </dl>
                                                </label>
                                            </li>
                                            <li>
                                                <input type="radio" id="pt4" name="pt">
                                                <label for="pt4">
                                                    <dl>
                                                        <dt>Pattern 4</dt>
                                                        <dd>Analysing figures without the flow of time(BAR/ PIE/
                                                            TABLE/ MIXED) Analysing figures without the flow of
                                                            time(BAR/ PIE/ TABLE/ MIXED)</dd>
                                                    </dl>
                                                </label>
                                            </li>
                                            <li>
                                                <input type="radio" id="pt5" name="pt">
                                                <label for="pt5">
                                                    <dl>
                                                        <dt>Pattern 5</dt>
                                                        <dd>Analysing figures without the flow of time(BAR/ PIE/
                                                            TABLE/ MIXED) Analysing figures without the flow of
                                                            time(BAR/ PIE/ TABLE/ MIXED)</dd>
                                                    </dl>
                                                </label>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                                <!-- // 패턴선택시 -->
                                <!-- 에세이선택시 -->
                                <div class="correct-process mt40">
                                    <div class="correct-process-header">
                                        <ul>
                                            <li>
                                                <i class="ico-correct-prc1"></i>
                                                1.패턴 선택
                                            </li>
                                            <li class="on">
                                                <i class="ico-correct-prc4"></i>
                                                2.에세이 작성
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="correct-process-body active">
                                        <div class="essay-contents">
                                            <h5>
                                                임시저장/ 제출완료 안내
                                            </h5>
                                            <div class="essay-noti">
                                                · 임시저장 버튼을 누르면 등록 중인 답변 내용을 중간저장 할 수 있습니다.<br>
                                                <span class="red">· 임시저장 후 이어서 등록하시려면 첨삭 내역 페이지에서 ‘답변 원본 보기’ 버튼을
                                                    눌러 답변 등록 페이지로 이동하실 수 있습니다. </span><br>
                                                · 임시저장된 답변은 해당 회차의 첨삭 등록기간이 초과될 경우 제출할 수 없습니다. <br>
                                                · 임시저장 상태에서는 첨삭이 진행되지 않으니 답변 등록 완료 후 반드시 ‘제출완료’버튼을 눌러주세요. <br>
                                                · 제출완료 후 첨삭이 진행되며 제출완료 후에는 답변 내용을 수정할 수 없습니다.
                                            </div>
                                            <h5 class="mt24">
                                                음성파일 업로드/ 음성녹음 안내
                                            </h5>
                                            <div class="essay-noti">
                                                · Speaking 첨삭의 경우 질문에 대한 답변을 음성파일 업로드 또는 음성녹음을 통해 등록할 수 있습니다. <br>
                                                · 음성파일 업로드의 경우 보유하고 계신 음성파일을 첨부하는 방식이며, mp3/ wav/ m4a파일 형식의 10분 이하 파일만 업로드 가능합니다. <br>
                                                · 음성녹음의 경우 본 페이지에서 직접 음성을 진행하는 방식이며, [녹음(Record)] 버튼 클릭 시 기존에 녹음한 답변은 삭제되며 복구가 불가합니다. <br>
                                                · 음성녹음은 마이크가 있는 PC 및 노트북, 안드로이드 OS 및 아이폰(IOS 12.0 이하)에서 가능합니다.
                                            </div>
                                        </div>
                                        <div class="essay-contents cont2 mt16">
                                            <dl>
                                                <dt>Pattern</dt>
                                                <dd>Weather & Season</dd>
                                            </dl>
                                        </div>
                                        <!-- 녹음전 -->
                                        <div class="essay-contents mt16 pd24 rec">
                                            <dl class="topic">
                                                <dt>Part 2</dt>
                                                <dd>
                                                    Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    · What it is<br>
                                                    · Where you usually experience it<br>
                                                    · What you will do in this weather and explain why you like it<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;
                                                </dd>
                                            </dl>
                                            <div class="record">
                                                <div class="record-wrap">
                                                    <span>아이콘을 눌러 녹음을 시작하세요.</span>
                                                    <a href="#none" class="ico-record"></a>
                                                </div>
                                                <div class="record-btn">
                                                    <a href="#none" class="my-btn-default2 mini">내 PC</a>
                                                </div>
                                                <div class="file-drag">
                                                    <i class="ico-upload"></i>
                                                    녹음 파일을 마우스로 끌어 오세요.
                                                </div>
                                            </div>
                                        </div>
                                        <!-- 파일업로드 -->
                                        <div class="essay-contents mt16 pd24 rec">
                                            <dl class="topic">
                                                <dt>Part 2</dt>
                                                <dd>
                                                    Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    · What it is<br>
                                                    · Where you usually experience it<br>
                                                    · What you will do in this weather and explain why you like it<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;
                                                </dd>
                                            </dl>
                                            <div class="record">
                                                <div class="record-wrap">
                                                    <span>아이콘을 눌러 녹음을 시작하세요.</span>
                                                    <a href="#none" class="ico-record off"></a>
                                                </div>
                                                <div class="record-btn">
                                                    <a href="#none" class="my-btn-default2 mini">내 PC</a>
                                                </div>
                                                <div class="file-drag">
                                                    <a href="#none">20240501.mp3(58.9kb)</a>
                                                    <a href="#none" class="ico-file-delete"></a>
                                                </div>
                                            </div>
                                        </div>
                                        <!-- 녹음중 -->
                                        <div class="essay-contents mt16 pd24 rec">
                                            <dl class="topic">
                                                <dt>Part 2</dt>
                                                <dd>
                                                    Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    · What it is<br>
                                                    · Where you usually experience it<br>
                                                    · What you will do in this weather and explain why you like it<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;
                                                </dd>
                                            </dl>
                                            <div class="record">
                                                <div class="record-wrap">
                                                    <div class="rec-time">
                                                        <i class="ico-recording"></i>
                                                        01:20
                                                    </div>
                                                    <div class="voice-print">

                                                    </div>
                                                    <a href="#none" class="ico-play"></a>
                                                </div>
                                                <div class="record-btn">
                                                    <a href="#none" class="my-btn-default2 mini">내 PC</a>
                                                </div>
                                                <div class="file-drag">
                                                    <a href="#none">20240501.mp3(58.9kb)</a>
                                                    <a href="#none" class="ico-file-delete"></a>
                                                </div>
                                            </div>
                                        </div>
                                        <!-- 녹음완료/재생 -->
                                        <div class="essay-contents mt16 pd24 rec">
                                            <dl class="topic">
                                                <dt>Part 2</dt>
                                                <dd>
                                                    Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    · What it is<br>
                                                    · Where you usually experience it<br>
                                                    · What you will do in this weather and explain why you like it<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;
                                                </dd>
                                            </dl>
                                            <div class="record">
                                                <div class="rec-down">
                                                    <a href="#none">
                                                        녹음파일 다운로드
                                                        <i class="ico-download"></i>
                                                    </a>
                                                </div>
                                                <div class="record-wrap h130">
                                                    <div class="speaking-player">
                                                        <div class="playbar">
                                                            <span class="now">1:00</span>
                                                            <div class="bar">
                                                                <div class="bar-ing"></div>
                                                            </div>
                                                            <span class="total">3:10</span>
                                                        </div>
                                                        <div class="playbtn">
                                                            <a href="#none" class="ico-speaker">
                                                                <div class="volume">
                                                                    <input type="radio" id="volume6" name="volume" value="6">
                                                                    <label for="volume6" title="volume"></label>
                                                                    <input type="radio" id="volume5" name="volume" value="5">
                                                                    <label for="volume5" title="volume"></label>
                                                                    <input type="radio" id="volume4" name="volume" value="4">
                                                                    <label for="volume4" title="volume"></label>
                                                                    <input type="radio" id="volume3" name="volume" value="3">
                                                                    <label for="volume3" title="volume"></label>
                                                                    <input type="radio" id="volume2" name="volume" value="2">
                                                                    <label for="volume2" title="volume"></label>
                                                                    <input type="radio" id="volume1" name="volume" value="1">
                                                                    <label for="volume1" title="volume"></label>
                                                                </div>
                                                            </a>
                                                            <a href="#none" class="ico-play stop"></a>
                                                            <a href="#none" class="ico-setting">
                                                                <div class="playx">
                                                                    <span>재생속도</span>
                                                                    <input type="radio" id="playx7" name="playx" value="7">
                                                                    <label for="playx7" title="playx">x 0.25</label>
                                                                    <input type="radio" id="playx6" name="playx" value="6">
                                                                    <label for="playx6" title="playx">x 0.5</label>
                                                                    <input type="radio" id="playx5" name="playx" value="5">
                                                                    <label for="playx5" title="playx">x 1</label>
                                                                    <input type="radio" id="playx4" name="playx" value="4">
                                                                    <label for="playx4" title="playx">x 1.25</label>
                                                                    <input type="radio" id="playx3" name="playx" value="3">
                                                                    <label for="playx3" title="playx">x 1.5</label>
                                                                    <input type="radio" id="playx2" name="playx" value="2">
                                                                    <label for="playx2" title="playx">x 1.75</label>
                                                                    <input type="radio" id="playx1" name="playx" value="1">
                                                                    <label for="playx1" title="playx">x 1.2</label>
                                                                </div>
                                                            </a>
                                                        </div>
                                                        <a href="#none" class="my-btn-default2 re">다시 녹음하기</a>
                                                    </div>
                                                </div>
                                                <div class="record-btn">
                                                    <a href="#none" class="my-btn-default2 mini">내 PC</a>
                                                </div>
                                                <div class="file-drag">
                                                    <a href="#none">20240501.mp3(58.9kb)</a>
                                                    <a href="#none" class="ico-file-delete"></a>
                                                </div>
                                            </div>
                                        </div>
                                        <!-- // -->
                                        <div class="agree-wrap">
                                            <input type="checkbox" id="agree" name="agree">
                                            <label for="agree">입력하신 첨삭 내용은 보다 나은 학습 서비스 제공을 위한 데이터 분석, 프로모션,
                                                그 외 홍보/마케팅 목적으로 활용될 수 있음을 동의합니다.</label>
                                        </div>
                                        <div class="validation-wrap">
                                            <p>첨삭내역 활용목적 동의여부를 체크해 주세요.</p>
                                        </div>
                                        <div class="text-center mt16">
                                            <a href="#none" class="my-btn-default lg">제출완료</a>
                                        </div>
                                    </div>
                                </div>
                                <!-- // 에세이선택시 -->
                                <!-- 선생님 & 에세이선택시 -->
                                <div class="correct-process mt40">
                                    <div class="correct-process-header">
                                        <ul>
                                            <li>
                                                <i class="ico-correct-prc1"></i>
                                                1.패턴 선택
                                            </li>
                                            <li class="on">
                                                <i class="ico-correct-prc4"></i>
                                                2.선생님 선택&에세이 작성
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="correct-process-body active">
                                        <div class="essay-contents pd24">
                                            <h4>첨삭선생님 선택</h4>
                                            <div class="select-teacher">
                                                <div class="tcSwiper-wrap">
                                                    <!-- teacher -->
                                                    <div class="swiper tcSwiper">
                                                        <div class="swiper-wrapper">
                                                            <div class="swiper-slide">
                                                                <input type="radio" id="tc1" name="tc">
                                                                <label for="tc1">
                                                                    <img src="https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/teacher_sample.png" alt="">
                                                                    <p class="tc-name">
                                                                        <strong>헤더헤더헤</strong>
                                                                        <span>선생님</span>
                                                                    </p>
                                                                    <a href="#none" class="go-video">
                                                                        샘플영상
                                                                        <i class="ico-video"></i>
                                                                    </a>
                                                                </label>
                                                            </div>
                                                            <div class="swiper-slide">
                                                                <input type="radio" id="tc2" name="tc">
                                                                <label for="tc2">
                                                                    <img src="https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/teacher_sample.png" alt="">
                                                                    <p class="tc-name">
                                                                        <strong>헤더헤더헤</strong>
                                                                        <span>선생님</span>
                                                                    </p>
                                                                    <a href="#none" class="go-video">
                                                                        샘플영상
                                                                        <i class="ico-video"></i>
                                                                    </a>
                                                                </label>
                                                            </div>
                                                            <div class="swiper-slide">
                                                                <input type="radio" id="tc3" name="tc">
                                                                <label for="tc3">
                                                                    <img src="https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/teacher_sample.png" alt="">
                                                                    <p class="tc-name">
                                                                        <strong>헤더헤더헤</strong>
                                                                        <span>선생님</span>
                                                                    </p>
                                                                    <a href="#none" class="go-video">
                                                                        샘플영상
                                                                        <i class="ico-video"></i>
                                                                    </a>
                                                                </label>
                                                            </div>
                                                            <div class="swiper-slide">
                                                                <input type="radio" id="tc4" name="tc">
                                                                <label for="tc4">
                                                                    <img src="https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/teacher_sample.png" alt="">
                                                                    <p class="tc-name">
                                                                        <strong>헤더헤더헤</strong>
                                                                        <span>선생님</span>
                                                                    </p>
                                                                    <a href="#none" class="go-video">
                                                                        샘플영상
                                                                        <i class="ico-video"></i>
                                                                    </a>
                                                                </label>
                                                            </div>
                                                            <div class="swiper-slide">
                                                                <input type="radio" id="tc5" name="tc">
                                                                <label for="tc5">
                                                                    <img src="https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/teacher_sample.png" alt="">
                                                                    <p class="tc-name">
                                                                        <strong>헤더헤더헤</strong>
                                                                        <span>선생님</span>
                                                                    </p>
                                                                    <a href="#none" class="go-video">
                                                                        샘플영상
                                                                        <i class="ico-video"></i>
                                                                    </a>
                                                                </label>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="swiper-button-next"></div>
                                                    <div class="swiper-button-prev"></div>
                                                </div>
                                                <div class="selected-teacher">
                                                    <div class="teacher-profile">
                                                        <img src="https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/teacher_sample.png" alt="">
                                                    </div>
                                                    <div class="teacher-name">
                                                        <p>선택선생님</p>
                                                        <strong>클라라라라</strong>
                                                    </div>
                                                </div>
                                            </div>
                                            <script>
                                                var swiper = new Swiper(".tcSwiper", {
                                                    slidesPerView: 4,
                                                    spaceBetween: 16,
                                                    navigation: {
                                                        nextEl: ".swiper-button-next",
                                                        prevEl: ".swiper-button-prev",
                                                    },
                                                });
                                            </script>
                                        </div>
                                        <div class="essay-contents">
                                            <h5>
                                                임시저장/ 제출완료 안내
                                            </h5>
                                            <div class="essay-noti">
                                                · 임시저장 버튼을 누르면 등록 중인 답변 내용을 중간저장 할 수 있습니다.<br>
                                                <span class="red">· 임시저장 후 이어서 등록하시려면 첨삭 내역 페이지에서 ‘답변 원본 보기’ 버튼을
                                                    눌러 답변 등록 페이지로 이동하실 수 있습니다. </span><br>
                                                · 임시저장된 답변은 해당 회차의 첨삭 등록기간이 초과될 경우 제출할 수 없습니다. <br>
                                                · 임시저장 상태에서는 첨삭이 진행되지 않으니 답변 등록 완료 후 반드시 ‘제출완료’버튼을 눌러주세요. <br>
                                                · 제출완료 후 첨삭이 진행되며 제출완료 후에는 답변 내용을 수정할 수 없습니다.
                                            </div>
                                            <h5 class="mt24">
                                                음성파일 업로드/ 음성녹음 안내
                                            </h5>
                                            <div class="essay-noti">
                                                · Speaking 첨삭의 경우 질문에 대한 답변을 음성파일 업로드 또는 음성녹음을 통해 등록할 수 있습니다. <br>
                                                · 음성파일 업로드의 경우 보유하고 계신 음성파일을 첨부하는 방식이며, mp3/ wav/ m4a파일 형식의 10분 이하 파일만 업로드 가능합니다. <br>
                                                · 음성녹음의 경우 본 페이지에서 직접 음성을 진행하는 방식이며, [녹음(Record)] 버튼 클릭 시 기존에 녹음한 답변은 삭제되며 복구가 불가합니다. <br>
                                                · 음성녹음은 마이크가 있는 PC 및 노트북, 안드로이드 OS 및 아이폰(IOS 12.0 이하)에서 가능합니다.
                                            </div>
                                        </div>
                                        <div class="essay-contents cont2 mt16">
                                            <dl>
                                                <dt>Pattern</dt>
                                                <dd>Weather & Season</dd>
                                            </dl>
                                        </div>
                                        <!-- 녹음전 -->
                                        <div class="essay-contents mt16 pd24 rec">
                                            <dl class="topic">
                                                <dt>Part 2</dt>
                                                <dd>
                                                    Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    · What it is<br>
                                                    · Where you usually experience it<br>
                                                    · What you will do in this weather and explain why you like it<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;
                                                </dd>
                                            </dl>
                                            <div class="record">
                                                <div class="record-wrap">
                                                    <span>아이콘을 눌러 녹음을 시작하세요.</span>
                                                    <a href="#none" class="ico-record"></a>
                                                </div>
                                                <div class="record-btn">
                                                    <a href="#none" class="my-btn-default2 mini">내 PC</a>
                                                </div>
                                                <div class="file-drag">
                                                    <i class="ico-upload"></i>
                                                    녹음 파일을 마우스로 끌어 오세요.
                                                </div>
                                            </div>
                                        </div>
                                        <!-- 파일업로드 -->
                                        <div class="essay-contents mt16 pd24 rec">
                                            <dl class="topic">
                                                <dt>Part 2</dt>
                                                <dd>
                                                    Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    · What it is<br>
                                                    · Where you usually experience it<br>
                                                    · What you will do in this weather and explain why you like it<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;<br>
                                                    Describe a kind of weather you like<br>
                                                    You should say;
                                                </dd>
                                            </dl>
                                            <div class="record">
                                                <div class="record-wrap">
                                                    <span>아이콘을 눌러 녹음을 시작하세요.</span>
                                                    <a href="#none" class="ico-record"></a>
                                                </div>
                                                <div class="record-btn">
                                                    <a href="#none" class="my-btn-default2 mini">내 PC</a>
                                                </div>
                                                <div class="file-drag">
                                                    <a href="#none">20240501.mp3(58.9kb)</a>
                                                    <a href="#none" class="ico-file-delete"></a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- // 선생님 & 에세이선택시 -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection



@section('ielts-script')

    {!! resource('js/common/jquery.nice-select.js') !!}
    <script>
        $(document).ready(function () {
            $('.sub-tab ul li').on('click', function () {
                $(this).addClass('on').siblings('li').removeClass('on')
                var nowTab = $(this).index() + 1;
                // alert(nowTab);
                $('.sub-tab').children('#tab-cont'+nowTab).show().siblings('[id^="tab-cont"]').hide()
            });
            $('.select-option').niceSelect();
        });
    </script>
@endsection