css 질문. 채택완료

</strong></p>

<p><strong><style>

body{margin-top:50px;}

.accordion-menu .panel-body{padding:0px; margin:0px;}

.accordion-menu .panel-heading{background-color:#FFFFFF;}

.accordion-menu .panel-heading:hover{

  background:#f5f5f5;

}</strong></p>

<p><strong>.accordion-menu .panel{

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  border-radius: 3px;

  box-shadow: 0 0px 0px rgba(0, 0, 0, 0.05);}</strong></p>

<p><strong>.glyphicon-icon-rpad .glyphicon,.glyphicon-icon-rpad .glyphicon.m8,.fa-icon-rpad .fa,.fa-icon-rpad .fa.m8{ padding-right:8px; }

.glyphicon-icon-lpad .glyphicon,.glyphicon-icon-lpad .glyphicon.m8,.fa-icon-lpad .fa,.fa-icon-lpad .fa.m8{ padding-left:8px; }

.glyphicon-icon-rpad .glyphicon.m5,.fa-icon-rpad .fa.m5{ padding-right:5px; }

.glyphicon-icon-lpad .glyphicon.m5,.fa-icon-lpad .fa.m5{ padding-left:5px; }

.glyphicon-icon-rpad .glyphicon.m12,.fa-icon-rpad .fa.m12{ padding-right:12px; }

.glyphicon-icon-lpad .glyphicon.m12,.fa-icon-lpad .fa.m12{ padding-left:12px; }

.glyphicon-icon-rpad .glyphicon.m15,.fa-icon-rpad .fa.m15{ padding-right:15px; }

.glyphicon-icon-lpad .glyphicon.m15,.fa-icon-lpad .fa.m15{ padding-left:15px; }</strong></p>

<p><strong>.accordion-menu h4{position:relative;}</strong></p>

<p><strong>.accordion-menu h4 .accordion-menu-collapsible-icon{position:absolute; right:0px; top:5px; font-size:9px; }

.accordion-menu h4 a{display:block; color:#666666;}

.accordion-menu h4 a.active,.accordion-menu h4 .active, .active{text-decoration:none;}

.accordion-menu h4 a:hover,

.accordion-menu h4 a:focus{text-decoration:none; color:#222222;}

.accordion-menu h4 .accordion-menu-title-icon

{

  float:right;

  margin:0;

}

.accordion-menu ul{list-style:none; padding:0px; margin:0px;}

.accordion-menu ul li .badge,.accordion-menu ul li span.badge,.accordion-menu ul li label.badge{float:right}

.accordion-menu ul li:first-child a{}

.accordion-menu ul li:last-child a{border:0px solid #f9f9f9;}

.accordion-menu ul li a{display:block; line-height:22px; padding:5px 15px; margin:0px; border-bottom:1px solid #e8e8e8;}

.accordion-menu ul li a:hover{color:#232323;text-decoration:none;}

.accordion-menu ul.bullets{list-style:inside disc}

.accordion-menu ul.numerics{list-style:inside decimal}

.accordion-menu ul.kas-icon{}

.accordion-menu ul.kas-icon-aero li a:before{font-family: 'Glyphicons Halflings'; font-size:9px; content: "\e258"; padding-right:8px; }

</style>

<div class="container">

    <div class="row">

        <div class="col-sm-3 col-md-3">

            <div class="panel-group accordion-menu glyphicon-icon-rpad" id="accordion">

                <div class="panel panel-default">

                    <div class="panel-heading">

                        <h4 class="panel-title">

                            <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne"><span class="glyphicon glyphicon-folder-close m5"></span> Content

                            <span class="accordion-menu-collapsible-icon glyphicon glyphicon-chevron-down"></span>

                          </a>

                        </h4>

                    </div>

                    <div id="collapseOne" class="panel-collapse collapse in">

                        <div class="panel-body">

                            <ul class="">

                                <li><a href="#"><span class="glyphicon glyphicon-pencil"></span>Articles</a></li>

                                <li><a href="#"><span class="glyphicon glyphicon-flash"></span>News</a></li>

                                <li><a href="#"><span class="glyphicon glyphicon-file"></span>Newsletters</a></li>

                                <li><a href="#"><span class="glyphicon glyphicon-comment"></span>Comments <span class="badge">42</span></a></li>

                            </ul>

                        </div>

                    </div>

                </div>

                <div class="panel panel-default">

                    <div class="panel-heading">

                        <h4 class="panel-title glyphicon-icon-rpad">

                            <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo"><span class="glyphicon glyphicon-th  m5"></span>Modules</a>

                            <span class="accordion-menu-collapsible-icon glyphicon glyphicon-chevron-down"></span>

                        </h4>

                    </div>

                    <div id="collapseTwo" class="panel-collapse collapse">

                        <div class="panel-body">

                            <ul class="kas-icon-aero">

                                <li><a href="#">Orders <span class="pull-right label label-success">$ 320</span></a></li>

                                <li><a href="#">Invoices</a></li>

                                <li><a href="#">Shipments</a></li>

                                <li><a href="#">Tex</a>

                                </li>

                            </ul>

                        </div>

                    </div>

                </div>

                <div class="panel panel-default">

                    <div class="panel-heading">

                        <h4 class="panel-title glyphicon-icon-rpad">

                            <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree"><span class="glyphicon glyphicon-user m5"></span>Account</a>

                            <span class="accordion-menu-collapsible-icon glyphicon glyphicon-chevron-down"></span>

                        </h4>

                    </div>

                    <div id="collapseThree" class="panel-collapse collapse">

                        <div class="panel-body">

                            <ul class="bullets">

                                <li><a href="#">Change Password</a></li>

                                <li><a href="#">Notifications <span class="label label-info">5</span></a></li>

                                <li><a href="#">Import/Export</a></li>

                                <li><a href="#">Delete Account</a></li>

                            </ul>

                        </div>

                    </div>

                </div>

                <div class="panel panel-default">

                    <div class="panel-heading">

                        <h4 class="panel-title glyphicon-icon-rpad">

                            <a data-toggle="collapse" data-parent="#accordion" href="#collapseFour"><span class="glyphicon glyphicon-file m5"></span>Reports</a>

                            <span class="accordion-menu-collapsible-icon glyphicon glyphicon-chevron-down"></span>

                        </h4>

                    </div>

                    <div id="collapseFour" class="panel-collapse collapse">

                        <div class="panel-body">

                            <ul class="numerics">

                                <li><a href="#">Sales</a></li>

                                <li><a href="#">Customers</a></li>

                                <li><a href="#">Products</a></li>

                                <li><a href="#">Shopping Cart</a></li>

                            </ul>

                        </div>

                    </div>

                </div>

            </div>

        </div>

        <div class="col-sm-9 col-md-9">

            <div class="well">

                <h1>

                    Accordion Menu With Icon</h1>

                Admin Dashboard Accordion Menu

            </div>

        </div>

    </div>

</div></strong></p>

<p><strong>