@extends('ielts.layout')

@section('ielts-css')
    {!! resource('css/ielts/sub.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><a href="#none">첨삭등록</a></li>
                                <li class="on"><a href="#none">첨삭내역</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="column c100p">
                        <div class="card my-class-sub">
                            <table class="correct-table">
                                <thead>
                                    <tr>
                                        <th>첨삭명</th>
                                        <th>서비스 구분</th>
                                        <th>등록 회차</th>
                                        <th>등록 일자</th>
                                        <th>과목</th>
                                        <th>모듈</th>
                                        <th>첨삭타입</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>모두의 첨삭 Basic 첨삭</td>
                                        <td>Basic</td>
                                        <td>3회차/10회</td>
                                        <td>24.03.25(월)</td>
                                        <td>Writing</td>
                                        <td>Academic</td>
                                        <td>Task1</td>
                                    </tr>
                                    <tr>
                                        <td class="pd24" colspan="7">
                                            <dl>
                                                <dt>Pattern 1</dt>
                                                <dd>Analysing figures based on the flow of time(BAR/ LINE/ PIE/ TABLE/ MIXED)</dd>
                                            </dl>
                                            <dl>
                                                <dt>Chart 1</dt>
                                                <dd>Analysing figures based on the flow of time(BAR/ LINE/ PIE/ TABLE/ MIXED)</dd>
                                            </dl>
                                            <dl class="topic">
                                                <dt>Topic</dt>
                                                <dd>The bar char below shows the figures for imprisonment in five countries between 1930 and 1980. Summarise the information by selecting and reporting the main features and make comparisons where relevant. Write at least 150 words.</dd>
                                            </dl>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                            <div class="chart-img-detail mt24">
                                <!-- 차트가 없을 경우 해당 영역 삭제 -->
                                <div class="chart-img">Chart IMG</div>
                                <!-- // 차트가 없을 경우 해당 영역 삭제 -->
                                <div class="chart-detail">
                                    Popular events like the football World Cup and other international sporting occasions are essential in easing international tensions and releasing patriotic emotions in a safe way. To what extent do you agree or disagree with this opinion?Popular events like the football World Cup and other international sporting occasions are essential in easing international tensions and releasing patriotic emotions in a safe way. To what extent do you agree or disagree with this opinion?Popular events like the football World Cup and other international sporting occasions are essential in easing international tensions and releasing patriotic emotions in a safe way. To what extent do you agree or disagree with this opinion?
                                </div>
                            </div>
                            <h4 class="correct-title">
                                <i class="ico-clipboard"></i>
                                첨삭 피드백
                            </h4>
                            <h5 class="correct-sub-title">
                                <span class="point-color">항목별</span> 점수
                            </h5>
                            <ul class="score-ul">
                                <li>
                                    <div class="bg-gradient">
                                        Task<br>Achievement
                                    </div>
                                    <div>
                                        9.0
                                    </div>
                                </li>
                                <li>
                                    <div class="bg-gradient">
                                        Cohesion &<br>Coherence
                                    </div>
                                    <div>
                                        9.0
                                    </div>
                                </li>
                                <li>
                                    <div class="bg-gradient">
                                        Lexical<br>Resources
                                    </div>
                                    <div>
                                        9.0
                                    </div>
                                </li>
                                <li>
                                    <div class="bg-gradient">
                                        Grammatical Range<br>& Accuracy
                                    </div>
                                    <div>
                                        9.0
                                    </div>
                                </li>
                                <li>
                                    <div class="bg-gradient">
                                        Band Score
                                    </div>
                                    <div>
                                        9.0
                                    </div>
                                </li>
                            </ul>
                            <h5 class="correct-sub-title mt60">
                                첨삭 내용
                            </h5>
                            <div class="file-list">
                                <span class="name">
                                    <i class="ico-file"></i>
                                    Writing1
                                </span>
                                <ul>
                                    <li>
                                        <a href="#none">%첨부파일명%. 확장자</a>
                                        <a href="#none">
                                            다운로드
                                            <i class="ico-download"></i>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#none">%첨부파일명%. 확장자</a>
                                        <a href="#none">
                                            다운로드
                                            <i class="ico-download"></i>
                                        </a>
                                    </li>
                                </ul>
                                <span class="date">
                                    (첨부일자) 24.03.25(월)
                                </span>
                            </div>
                            <h6 class="mt60">학습 문의 <span class="point-color">8</span> 건</h6>
                            <div class="cmt-wrap">
                                <div class="cmt-write">
                                    <textarea name="" id="" placeholder="내용을 입력해주세요."></textarea>
                                    <button>등록</button>
                                </div>
                                <div class="cmt-view">
                                    <ul>
                                        <!-- depth 1 cmt -->
                                        <li>
                                            <div class="cmt-view-wrap">
                                                <div class="cmt-info">
                                                    <i class="ico-profile" style="background-image: url(https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/ico_profile_edm.svg);"></i>
                                                    <strong>edm아이엘츠</strong>
                                                    <span>2020-12-31 00:09:51</span>
                                                </div>
                                                <div class="cmt-contents">
                                                    메모 내용이 여기에 노출됩니다. 줄 띄어쓰기가 적용되고 글자수는 2000byte로 제한됩니다. 한 사람의 댓글은 스크롤이 생성되지 않고 전체 내용이 노출됩니다. 댓글은 최근순으로 보여지며, 대댓글(답글)은 상위 댓글 하단에 오래된순으로 보여집니다. (인스타그램, 트위터 등의 SNS와 동일한 정렬) 대댓글의 대댓글은 들여쓰기 처리되지 않습니다.
                                                </div>
                                                <div class="cmt-button">
                                                    <a href="#none">답글</a>
                                                    <a href="#none">답글 1개 숨기기</a>
                                                </div>
                                                <a href="#none" class="ico-delete"></a>
                                            </div>
                                            <!-- depth 2 cmt -->
                                            <ul class="depth">
                                                <li>
                                                    <div class="cmt-view-wrap">
                                                        <div class="cmt-info">
                                                            <i class="ico-profile" style="background-image: url(https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/ico_profile.svg);"></i>
                                                            <strong>계정명</strong>
                                                            <span>2020-12-31 00:09:51</span>
                                                        </div>
                                                        <div class="cmt-contents">
                                                            <span class="at">@edmIELTS</span>메모 내용이 여기에 노출됩니다. 줄 띄어쓰기가 적용되고 글자수는 2000byte로 제한됩니다. 한 사람의 댓글은 스크롤이 생성되지 않고 전체 내용이 노출됩니다. 댓글은 최근순으로 보여지며, 대댓글(답글)은 상위 댓글 하단에 오래된순으로 보여집니다. (인스타그램, 트위터 등의 SNS와 동일한 정렬) 대댓글의 대댓글은 들여쓰기 처리되지 않습니다.
                                                        </div>
                                                        <div class="cmt-button">
                                                            <a href="#none">답글</a>
                                                            <a href="#none">답글 1개 숨기기</a>
                                                        </div>
                                                    </div>
                                                    <a href="#none" class="ico-delete"></a>
                                                </li>
                                                <li>
                                                    <div class="cmt-view-wrap">
                                                        <div class="cmt-info">
                                                            <i class="ico-profile" style="background-image: url(https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/ico_profile.svg);"></i>
                                                            <strong>계정명</strong>
                                                            <span>2020-12-31 00:09:51</span>
                                                        </div>
                                                        <div class="cmt-contents">
                                                            <span class="at">@edmIELTS</span>메모 내용이 여기에 노출됩니다. 줄 띄어쓰기가 적용되고 글자수는 2000byte로 제한됩니다. 한 사람의 댓글은 스크롤이 생성되지 않고 전체 내용이 노출됩니다. 댓글은 최근순으로 보여지며, 대댓글(답글)은 상위 댓글 하단에 오래된순으로 보여집니다. (인스타그램, 트위터 등의 SNS와 동일한 정렬) 대댓글의 대댓글은 들여쓰기 처리되지 않습니다.
                                                        </div>
                                                        <div class="cmt-button">
                                                            <a href="#none">답글</a>
                                                            <a href="#none">답글 1개 숨기기</a>
                                                        </div>
                                                    </div>
                                                    <a href="#none" class="ico-delete"></a>
                                                </li>
                                            </ul>
                                        </li>
                                        <!-- depth 1 cmt -->
                                        <li>
                                            <div class="cmt-view-wrap">
                                                <div class="cmt-info">
                                                    <i class="ico-profile" style="background-image: url(https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/ico_profile_edm.svg);"></i>
                                                    <strong>edm아이엘츠</strong>
                                                    <span>2020-12-31 00:09:51</span>
                                                </div>
                                                <div class="cmt-contents">
                                                    메모 내용이 여기에 노출됩니다. 줄 띄어쓰기가 적용되고 글자수는 2000byte로 제한됩니다. 한 사람의 댓글은 스크롤이 생성되지 않고 전체 내용이 노출됩니다. 댓글은 최근순으로 보여지며, 대댓글(답글)은 상위 댓글 하단에 오래된순으로 보여집니다. (인스타그램, 트위터 등의 SNS와 동일한 정렬) 대댓글의 대댓글은 들여쓰기 처리되지 않습니다.
                                                </div>
                                                <div class="cmt-button">
                                                    <a href="#none">답글</a>
                                                    <a href="#none">답글 1개 숨기기</a>
                                                </div>
                                                <a href="#none" class="ico-delete"></a>
                                            </div>
                                            <!-- depth 2 cmt -->
                                            <ul class="depth">
                                                <li>
                                                    <div class="cmt-view-wrap">
                                                        <div class="cmt-info">
                                                            <i class="ico-profile" style="background-image: url(https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/ico_profile.svg);"></i>
                                                            <strong>계정명</strong>
                                                            <span>2020-12-31 00:09:51</span>
                                                        </div>
                                                        <div class="cmt-contents">
                                                            <span class="at">@edmIELTS</span>메모 내용이 여기에 노출됩니다. 줄 띄어쓰기가 적용되고 글자수는 2000byte로 제한됩니다. 한 사람의 댓글은 스크롤이 생성되지 않고 전체 내용이 노출됩니다. 댓글은 최근순으로 보여지며, 대댓글(답글)은 상위 댓글 하단에 오래된순으로 보여집니다. (인스타그램, 트위터 등의 SNS와 동일한 정렬) 대댓글의 대댓글은 들여쓰기 처리되지 않습니다.
                                                        </div>
                                                        <div class="cmt-button">
                                                            <a href="#none">답글</a>
                                                            <a href="#none">답글 1개 숨기기</a>
                                                        </div>
                                                    </div>
                                                    <a href="#none" class="ico-delete"></a>
                                                </li>
                                                <li>
                                                    <div class="cmt-view-wrap">
                                                        <div class="cmt-info">
                                                            <i class="ico-profile" style="background-image: url(https://s3.ap-northeast-2.amazonaws.com/new.edmclass.com/ielts/my_class/ico_profile.svg);"></i>
                                                            <strong>계정명</strong>
                                                            <span>2020-12-31 00:09:51</span>
                                                        </div>
                                                        <div class="cmt-contents">
                                                            <span class="at">@edmIELTS</span>메모 내용이 여기에 노출됩니다. 줄 띄어쓰기가 적용되고 글자수는 2000byte로 제한됩니다. 한 사람의 댓글은 스크롤이 생성되지 않고 전체 내용이 노출됩니다. 댓글은 최근순으로 보여지며, 대댓글(답글)은 상위 댓글 하단에 오래된순으로 보여집니다. (인스타그램, 트위터 등의 SNS와 동일한 정렬) 대댓글의 대댓글은 들여쓰기 처리되지 않습니다.
                                                        </div>
                                                        <div class="cmt-button">
                                                            <a href="#none">답글</a>
                                                            <a href="#none">답글 1개 숨기기</a>
                                                        </div>
                                                    </div>
                                                    <a href="#none" class="ico-delete"></a>
                                                </li>
                                            </ul>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection



@section('ielts-script')

@endsection