<div class="CG2-drawer">
<div class="CG2-drawer__panel">
<div class="CG2-drawer__panelViewport">
<div class="CG2-drawer__panelBody">
<div class="CG2-drawerBody">
<div class="CG2-drawerBody__user">
<div class="CG2-drawerBody__userAvatar">
<img src="http://www.gravatar.com/avatar/3d8d92b9ff9e708e3e4c247d5ab787ba.png?s=112" alt="" width="56" height="56">
</div>
<div class="CG2-drawerBody__userName">oyamada.akihiro@email.com</div>
</div>
<div class="CG2-drawerBody__nav">
<ul>
<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>
</div>
<div class="CG2-drawerBody__userNav">
<ul>
<li><a class="CG2-button CG2-button--primary CG2-button--fullWidth" href="#">購読する</a></li>
<li><a class="CG2-button CG2-button--fullWidth" href="#">ログイン</a></li>
</ul>
</div>
<div class="CG2-drawerBody__separator"></div>
<div class="CG2-drawerBody__search">
<div class="CG2-drawerBody__searchInner">
<input>
</div>
</div>
<div class="CG2-drawerBody__nav">
<ul>
<li class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-cat-elementary"></span>入門</a></li>
<li class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-cat-practice"></span>実践</a></li>
<li class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-cat-standards"></span>仕様解説</a></li>
<li class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-cat-talk"></span>座談会</a></li>
<li class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-cat-architecture"></span>設計</a></li>
<li class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-cat-report"></span>レポート</a></li>
<li class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-cat-future"></span>未来・次世代</a></li>
<li class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-cat-workstyle"></span>仕事術</a></li>
<li class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-cat-survey"></span>アンケート</a></li>
<li class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-cat-design"></span>デザイン</a></li>
<li class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-cat-interview"></span>インタビュー</a></li>
<li class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-cat-discussion"></span>ディカッション</a></li>
</ul>
</div>
<div class="CG2-drawerBody__separator"></div>
<div class="CG2-drawerBody__nav">
<ul>
<li><a href="#">CodeGridについて</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 class="CG2-drawerBody__navItem--icon"><a href="#"><span class="CG2-icon-twitter"></span>公式Twitter</a></li>
</ul>
</div>
<div class="CG2-drawerBody__separator"></div>
<div class="CG2-drawerBody__nav">
<ul>
<li class="CG2-drawerBody__navItem--plane"><a href="#">お問い合わせ</a></li>
<li class="CG2-drawerBody__navItem--plane"><a href="#">利用規約</a></li>
<li class="CG2-drawerBody__navItem--plane"><a href="#">プライバシーポリシー</a></li>
<li class="CG2-drawerBody__navItem--plane"><a href="#">特定商法に基づく表示</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="CG2-drawer__panelLeft" data-drawer-hide></div>
</div>
<div class="CG2-drawer__bg" data-drawer-close></div>
</div>