<commit_before>.centered {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.rival-content {
  position: relative;
}

.rival-content .timeline > li {
  /*margin:0;*/
}


/* bg 없애기 */

.box-comment.item-A,
.box-comment.item-B,
.hash-list.item-A,
.hash-list.item-B {
  background: none;
}

.item-A {
  background-color: #dd4b39;
  color: #fff;
}

.item-B {
  background-color:#00acee;
  color: #fff;
}

.item-C  {
  background-color: #46c377;
  color:#fff;
}

/* text-color */

.item-color-A {
  color: #dd4b39;
}
.item-color-B {
  color:#00acee;
}
.item-color-C {
  color: #46c377;
}


.hash-list.item-A .hash {
  color: #dd4b39;
}

.hash-list.item-B .hash {
  color: #00c0ef;
}


/* 메인 아이템 */

.main-item {
  margin-bottom: 10px;
  border: 1px solid #dedede;
}

.main-item .inner {
  overflow: hidden;
  padding: 5px;
  border: 1px solid #dedede;
}

.main-item .item-img {
  float: left;
  width: 100%;
  height: 400px;
  text-align: center;
}
.main-item .item-img img{
    width: 100%;
    max-height: 400px;
}

.main-item .item-graph {
  float: left;
  width: 30%;
}

.main-item .item-graph .box-pane-right {
  background-color: rgba(255, 255, 255, .4);
}

.main-item.right .item-img,
.main-item.right .item-graph {
  float: right;
}

.main-item .small-box-footer {
  clear: both;
}


/* 링크 리스트 */

.link-list {
  padding: 0;
}

.link-list li {
  padding: 5px 0;
  list-style: none;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.link-list li a {
  color: #888;
}

.link-list .news img {
  width: 24px;
}

.link-list li a:hover {
  color: #3c8dbc;
}

.link-list li + li {
  border-top: 1px solid #dedede;
}


/* 스펙 */
.spec-con{
  width:33%;
}
.spec-con .table{
  margin-bottom:0;
}
.spec-con .normal{
  display:none;
}
.spec-con .item-table tfoot td{
  padding:5px 0;
}
.btn-spec-view{
  visibility: hidden;
}
.table .align-c{
  text-align:center;
}
.table .spec-rank,
.table .spec-label{
  width:10%;
  max-width:50px;
}
.table .spec-tag-name{
  width:37%;
  max-width:120px;
}

.msg {
  padding: 10px;
  text-align: center;
}

.msg span {
  background-color: #fbf1f0;
  color: #c6254f;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.user-comment .comment-text {
  margin-left: 0;
}

.timeline-item.user-comment {}

.timeline-item.user-comment .bar {
  position: absolute;
  top: 0;
  height: 4px;
}

.timeline-item.user-comment .bar.item-A {
  left: 0;
  width: 33%;
}

.timeline-item.user-comment .bar.item-B {
  right: 0;
  width: 67%;
}

.timeline-item.user-comment .box {
  border-top: none;
  padding-top: 4px;
}

.rival-content .user-comment .comment-text {
  position: relative;
  padding: 0 10px;
}

.box-comments .text-muted {
  position: absolute;
  bottom: 0;
  right: 10px;
}

.rival-content .box-comments .box-comment:first-of-type {
  padding-top: 10px;
}

.box-comment.item-A {
  border-left: 3px solid #dd4b39;
}

.box-comment.item-B {
  border-left: 3px solid #00acee;
}

.box-comment .text {
  margin-top: 10px;
}


/*글쓰기 */

.message-box {
  position: relative;
  padding-right: 70px;
  height: 60px;
}

.message-box .text-write {
  width: 100%;
  padding: 10px;
  border: 1px solid #dedede;
  resize: none;
  height: 60px;
}

.message-box .write-btn {
  position: absolute;
  top: 0;
  right: 0;
  background-color: #444;
  color: #fff;
  padding: 10px 0;
  border: none;
  width: 70px;
  height: 60px;
  text-align: center;
}

.user-comment .user-block .name a {
  color: #444;
  font-weight: bold;
}


/* 버튼 수정 */

.btn-like,
.btn-hate {
  border: 1px solid #ddd;
  background-color: #fff;
  color: #444;
}

.btn-like .fa {
  color: blue;
}

.btn-hate .fa {
  color: red;
}

.sub-write {
  padding: 0 10px 10px;
}

.hash-list {}

.hash-list .hash {
  font-weight: bold;
  color: blue;
}

.hash-list .hash +.hash {
  margin-left: 6px;
}

.share-box {
  position: absolute;
  right: 40px;
  top: 0px;
  z-index: 10;
}


/* 타임라인별 */

.result-view .box {
  border-color: #00a65a;
}

.compare-view .box {
  border-color: #605ca8;
}

.spec-view .box {
  border-color: #0073b7;
}

.spec-view .spec-con:nth-child(1){
  margin-left: 0!important;
}

.spec-view .spec-con{
  margin-left: 3px;
  border-color: #e2e2e2;
}

.spec-con .btn-xs{
  background-color: #e2e2e2;
}
.writing-view .box {
  border-color: #f39c12;
}

.compare-grap-box {
  padding: 0 15px;
}

.compare-grap {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-bottom: 12px;
}

.compare-grap .left {
  float: left;
  width: 33%;
}
.compare-grap .center {
    float: left;
    width: 33%;
}
.compare-grap .right {
  float: left;
  width: 33%;
}

.compare-grap .item-A,
.compare-grap .item-B,
.compare-grap .item-C {
  clear: both;
  margin-top: 5px;
  height: 10px;
  width: 100%;
}

.compare-grap-box .text {
  margin-bottom: 3px;
  font-size: 12px;
  float: left;
}

.compare-grap-box .point {
  margin-bottom: 3px;
  font-size: 12px;
  float: left;
}

.compare-grap-box .center .point,
.compare-grap-box .center .text {
  margin-left: 15px;
}

.compare-grap-box .grap-logo {
  position: absolute;
  bottom: 22px;
  margin-left: -16px;
}

.compare-grap-box .compare-text {
  font-size: 12px;
  color: #888;
  line-height: 1.4;
}

.compare-grap-box .right {}

.compare-grap-box .right .text {
  float: right;
}

.compare-grap-box .right .point {
  float: right;
}

.level-icon {
  display: inline-block;
  position: relative;
  margin-right: 5px;
  /*width: 25px;*/
  /*height: 28px;*/
  vertical-align: middle;
}

.rival-content .level-icon img {
  width: 100% !important;
  height: 100% !important;
}

.level-icon i {
  position: absolute;
  top: 0;
  left: 0;
  padding-top: 2px;
  width: 100%;
  text-align: center;
  color: #fff;
  /*color: #444;*/
  font-weight: bold;
  font-style: normal;
  font-size: smaller;
}

.box-header.with-border.bd-bottom-A{
  border-bottom:1px solid #fdbab1;
}

.box-header.with-border.bd-bottom-B{
   border-bottom: 1px solid #95e7f2;
}
.box-header.with-border.bd-bottom-C{
   border-bottom: 1px solid #46c377;
}


/* add title css */

.title_area {
  border-bottom: 5px solid #000;
}

.title_area img {
  width: 58px;
}

.title_area img{
  width: 100%;
  max-width: 35px;
  margin-top: -2px;
}

.title_area .tit_txt {
  text-align: center;
  font-size: 26px;
  color: #fff;
  padding: 10px 0px 10px;
  line-height: 25px;
}

.title_area .tit_box {
  position: relative;
  background: #222d32;
  border-radius: 5px;
  height: 50px;
}

.title_area .ico_pri {
  display: block;
  background: #000;
  color: #fff;
  border-radius: 7px;
  width: 55px;
  height: 20px;
  text-align: center;
  font-size: 13px;
}

.pad20 {
  padding: 20px;
}

p.priview {
  font-size: 15px;
  color: #000;
  padding-bottom: 3px;
  padding-top: 7px;
}

.compare-grap-box .grap-logo img {
  width: 28px;
}

.title_area .ico_com {
  background-image: none;
  overflow: visible;
}

.title_area span {
  display: block;
  color: #fff;
  margin-top: 11px;
}

.title_area.rival {
  padding-bottom: 10px;
  border: 0 none
}

.screen_out {
  position: absolute;
  width: 0;
  height: 0;
  line-height: 0;
  text-indent: -9999px;
}


/* 미디어 쿼리 */
@media all and (max-width:767px) {
  .spec-con .reverse{
    display:none;
  }
  .spec-con .normal{
    display:table;
  }
  .spec-con{
    width:100%;
    margin-left: 0!important;
    border-top:1px solid;
    border-left:5px solid;
  }
.box-header.with-border.bd-bottom-A,
.box-header.with-border.bd-bottom-B,
.box-header.with-border.bd-bottom-C{
  border-bottom: 1px solid #f4f4f4!important;
}
  .spec-con.pull-left.item-bd-A{
    border-left-color:#fdbab1;
  }
  .spec-con.pull-left.item-bd-B{
  border-left-color:#95e7f2;
  }
  .spec-con.pull-left.item-bd-C{
   border-left-color: #46c377;
  }

  .btn-spec-view{
    visibility: visible;
  }
  .timeline-item.compare-view .box-body .col-xs-12{
    width: 100%!important;
  }
}

@media all and (max-width: 768px) {
  .timeline-item.compare-view .box-body .col-xs-12{
    width: 100%!important;
    margin-left: 0!important;
  }
}

@media all and (max-width:600px) {
  .share-box {
    right: 15px;
  }
  .reduce-text {
    display: none;
  }
  .compare-view .col-xs-6 {
    width: 100%;
    padding: 0;
  }
  .compare-view .box-body .col-xs-6+.col-xs-6 {
    margin-top: 20px;
  }
  .rival-content .col-sm-6,
  .rival-content .compare-grap-box {
    padding: 0;
  }
  .timeline:before,
  .timeline > li > .fa{
    display:none;
  }
  .timeline > li {
    margin-right: 0;
  }
  .timeline > li > .timeline-item {
    margin: 0;
  }
  .compare-grap-box .grap-logo {
    bottom: 22px;
  }
  .timeline-item.compare-view .box-body .col-xs-12{
    width: 100%!important;
  }
  /* 상품 */
  .main-item .item-img {
    float: right;
    height: inherit!important;
  }
  .text-hidden {
    display: none;
  }
}

@media all and (max-width:480px) {
  /* 스펙 */
  .share-box .social-icon-line {
    display: none;
  }
  .item-table .spec-title {
    display: none;
  }
  .item-table ul {
    border: 1px solid #dedede;
    margin: 0 0 20px 0;
  }
  .item-table .title {
    position: inherit;
    background: #f2f2f2;
    width: 100%;
    display: block;
    text-align: left;
    padding: 10px;
    border-bottom: 1px solid #dedede;
  }
  .item-table .title .btn {
    display: block;
    float: right;
    margin-top: -4px;
  }
  .item-table .dl-box {
    display: none;
    overflow: hidden;
  }
  .item-table .dl-box dt {
    display: block;
    float: left;
    width: 100px;
    text-align: left;
    padding: 7px 10px;
    border-bottom: 1px solid #dedede;
  }
  .item-table .dl-box dd.item-A,
  .item-table .dl-box dd.item-B {
    float: none;
    overflow: hidden;
    width: inherit;
    padding: 7px 10px;
    text-align: left;
    border-bottom: 1px solid #dedede;
    background-color: #fff;
    opacity: 1;
    color: #444;
  }

  .title_area .tit_box{
    display: inherit;
    height: inherit!important;
  }

  .title_area .tit_txt {
    font-size: 15px!important;
    padding: 10px 0px 10px;
  }

  .title_area img{
    max-width: 20px!important;
    margin-top: 4px!important;
  }

}
<commit_msg>index css code update<commit_after>.centered {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.rival-content {
  position: relative;
}

.rival-content .timeline > li {
  /*margin:0;*/
}


/* bg 없애기 */

.box-comment.item-A,
.box-comment.item-B,
.hash-list.item-A,
.hash-list.item-B {
  background: none;
}

.item-A {
  background-color: #dd4b39;
  color: #fff;
}

.item-B {
  background-color:#00acee;
  color: #fff;
}

.item-C  {
  background-color: #46c377;
  color:#fff;
}

/* text-color */

.item-color-A {
  color: #dd4b39;
}
.item-color-B {
  color:#00acee;
}
.item-color-C {
  color: #46c377;
}


.hash-list.item-A .hash {
  color: #dd4b39;
}

.hash-list.item-B .hash {
  color: #00c0ef;
}


/* 메인 아이템 */

.main-item {
  margin-bottom: 10px;
  border: 1px solid #dedede;
}

.main-item .inner {
  overflow: hidden;
  padding: 5px;
  border: 1px solid #dedede;
}

.main-item .item-img {
  float: left;
  width: 100%;
  height: 400px;
  text-align: center;
}
.main-item .item-img img{
    width: 100%;
    max-height: 400px;
}

.main-item .item-graph {
  float: left;
  width: 30%;
}

.main-item .item-graph .box-pane-right {
  background-color: rgba(255, 255, 255, .4);
}

.main-item.right .item-img,
.main-item.right .item-graph {
  float: right;
}

.main-item .small-box-footer {
  clear: both;
}


/* 링크 리스트 */

.link-list {
  padding: 0;
}

.link-list li {
  padding: 5px 0;
  list-style: none;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.link-list li a {
  color: #888;
}

.link-list .news img {
  width: 24px;
}

.link-list li a:hover {
  color: #3c8dbc;
}

.link-list li + li {
  border-top: 1px solid #dedede;
}


/* 스펙 */
.spec-con{
  width:33%;
}
.spec-con .table{
  margin-bottom:0;
}
.spec-con .normal{
  display:none;
}
.spec-con .item-table tfoot td{
  padding:5px 0;
}
.btn-spec-view{
  visibility: hidden;
}
.table .align-c{
  text-align:center;
}
.table .spec-rank,
.table .spec-label{
  width:10%;
  max-width:50px;
}
.table .spec-tag-name{
  width:37%;
  max-width:120px;
}

.msg {
  padding: 10px;
  text-align: center;
}

.msg span {
  background-color: #fbf1f0;
  color: #c6254f;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.user-comment .comment-text {
  margin-left: 0;
}

.timeline-item.user-comment {}

.timeline-item.user-comment .bar {
  position: absolute;
  top: 0;
  height: 4px;
}

.timeline-item.user-comment .bar.item-A {
  left: 0;
  width: 33%;
}

.timeline-item.user-comment .bar.item-B {
  right: 0;
  width: 67%;
}

.timeline-item.user-comment .box {
  border-top: none;
  padding-top: 4px;
}

.rival-content .user-comment .comment-text {
  position: relative;
  padding: 0 10px;
}

.box-comments .text-muted {
  position: absolute;
  bottom: 0;
  right: 10px;
}

.rival-content .box-comments .box-comment:first-of-type {
  padding-top: 10px;
}

.box-comment.item-A {
  border-left: 3px solid #dd4b39;
}

.box-comment.item-B {
  border-left: 3px solid #00acee;
}

.box-comment .text {
  margin-top: 10px;
}


/*글쓰기 */

.message-box {
  position: relative;
  padding-right: 70px;
  height: 60px;
}

.message-box .text-write {
  width: 100%;
  padding: 10px;
  border: 1px solid #dedede;
  resize: none;
  height: 60px;
}

.message-box .write-btn {
  position: absolute;
  top: 0;
  right: 0;
  background-color: #444;
  color: #fff;
  padding: 10px 0;
  border: none;
  width: 70px;
  height: 60px;
  text-align: center;
}

.user-comment .user-block .name a {
  color: #444;
  font-weight: bold;
}


/* 버튼 수정 */

.btn-like,
.btn-hate {
  border: 1px solid #ddd;
  background-color: #fff;
  color: #444;
}

.btn-like .fa {
  color: blue;
}

.btn-hate .fa {
  color: red;
}

.sub-write {
  padding: 0 10px 10px;
}

.hash-list {}

.hash-list .hash {
  font-weight: bold;
  color: blue;
}

.hash-list .hash +.hash {
  margin-left: 6px;
}

.share-box {
  position: absolute;
  right: 40px;
  top: 0px;
  z-index: 10;
}


/* 타임라인별 */

.result-view .box {
  border-color: #00a65a;
}

.compare-view .box {
  border-color: #605ca8;
}

.spec-view .box {
  border-color: #0073b7;
}

.spec-view .spec-con:nth-child(1){
  margin-left: 0!important;
}

.spec-view .spec-con{
  margin-left: 3px;
  border-color: #e2e2e2;
}

.spec-con .btn-xs{
  background-color: #e2e2e2;
}
.writing-view .box {
  border-color: #f39c12;
}

.compare-grap-box {
  padding: 0 15px;
}

.compare-grap {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-bottom: 12px;
}

.compare-grap .left {
  float: left;
  width: 33%;
}
.compare-grap .center {
    float: left;
    width: 33%;
}
.compare-grap .right {
  float: left;
  width: 33%;
}

.compare-grap .item-A,
.compare-grap .item-B,
.compare-grap .item-C {
  clear: both;
  margin-top: 5px;
  height: 10px;
  width: 100%;
}

.compare-grap-box .text {
  margin-bottom: 3px;
  font-size: 12px;
  float: left;
}

.compare-grap-box .point {
  margin-bottom: 3px;
  font-size: 12px;
  float: left;
}

.compare-grap-box .center .point,
.compare-grap-box .center .text {
  margin-left: 15px;
}

.compare-grap-box .grap-logo {
  position: absolute;
  bottom: 22px;
  margin-left: -16px;
}

.compare-grap-box .compare-text {
  font-size: 12px;
  color: #888;
  line-height: 1.4;
}

.compare-grap-box .right {}

.compare-grap-box .right .text {
  float: right;
}

.compare-grap-box .right .point {
  float: right;
}

.level-icon {
  display: inline-block;
  position: relative;
  margin-right: 5px;
  /*width: 25px;*/
  /*height: 28px;*/
  vertical-align: middle;
}

.rival-content .level-icon img {
  width: 100% !important;
  height: 100% !important;
}

.level-icon i {
  position: absolute;
  top: 0;
  left: 0;
  padding-top: 2px;
  width: 100%;
  text-align: center;
  color: #fff;
  /*color: #444;*/
  font-weight: bold;
  font-style: normal;
  font-size: smaller;
}

.box-header.with-border.bd-bottom-A{
  border-bottom:1px solid #fdbab1;
}

.box-header.with-border.bd-bottom-B{
   border-bottom: 1px solid #95e7f2;
}
.box-header.with-border.bd-bottom-C{
   border-bottom: 1px solid #46c377;
}


/* add title css */

.title_area {
  border-bottom: 5px solid #000;
}

.title_area img {
  width: 58px;
}

.title_area img{
  width: 100%;
  max-width: 35px;
  margin-top: -2px;
}

.title_area .tit_txt {
  text-align: center;
  font-size: 26px;
  color: #fff;
  padding: 10px 0px 10px;
  line-height: 25px;
}

.title_area .tit_box {
  position: relative;
  background: #222d32;
  border-radius: 5px;
  height: 50px;
}

.title_area .ico_pri {
  display: block;
  background: #000;
  color: #fff;
  border-radius: 7px;
  width: 55px;
  height: 20px;
  text-align: center;
  font-size: 13px;
}

.pad20 {
  padding: 20px;
}

p.priview {
  font-size: 15px;
  color: #000;
  padding-bottom: 3px;
  padding-top: 7px;
}

.compare-grap-box .grap-logo img {
  width: 28px;
}

.title_area .ico_com {
  background-image: none;
  overflow: visible;
}

.title_area span {
  display: block;
  color: #fff;
  margin-top: 11px;
}

.title_area.rival {
  padding-bottom: 10px;
  border: 0 none
}

.screen_out {
  position: absolute;
  width: 0;
  height: 0;
  line-height: 0;
  text-indent: -9999px;
}
.content{
  margin-top: -20px;
}


/* 미디어 쿼리 */
@media all and (max-width:767px) {
  .spec-con .reverse{
    display:none;
  }
  .spec-con .normal{
    display:table;
  }
  .spec-con{
    width:100%;
    margin-left: 0!important;
    border-top:1px solid;
    border-left:5px solid;
  }
.box-header.with-border.bd-bottom-A,
.box-header.with-border.bd-bottom-B,
.box-header.with-border.bd-bottom-C{
  border-bottom: 1px solid #f4f4f4!important;
}
  .spec-con.pull-left.item-bd-A{
    border-left-color:#fdbab1;
  }
  .spec-con.pull-left.item-bd-B{
  border-left-color:#95e7f2;
  }
  .spec-con.pull-left.item-bd-C{
   border-left-color: #46c377;
  }

  .btn-spec-view{
    visibility: visible;
  }
  .timeline-item.compare-view .box-body .col-xs-12{
    width: 100%!important;
  }
}

@media all and (max-width: 768px) {
  .timeline-item.compare-view .box-body .col-xs-12{
    width: 100%!important;
    margin-left: 0!important;
  }
  .sidebar-mini.sidebar-collapse .main-header .navbar{
    margin-left: 0!important;
  }
  .content{
    margin-top: 0!important;
  }
}

@media all and (max-width:600px) {
  .share-box {
    right: 15px;
  }
  .reduce-text {
    display: none;
  }
  .compare-view .col-xs-6 {
    width: 100%;
    padding: 0;
  }
  .compare-view .box-body .col-xs-6+.col-xs-6 {
    margin-top: 20px;
  }
  .rival-content .col-sm-6,
  .rival-content .compare-grap-box {
    padding: 0;
  }
  .timeline:before,
  .timeline > li > .fa{
    display:none;
  }
  .timeline > li {
    margin-right: 0;
  }
  .timeline > li > .timeline-item {
    margin: 0;
  }
  .compare-grap-box .grap-logo {
    bottom: 22px;
  }
  .timeline-item.compare-view .box-body .col-xs-12{
    width: 100%!important;
  }
  /* 상품 */
  .main-item .item-img {
    float: right;
    height: inherit!important;
  }
  .text-hidden {
    display: none;
  }
}

@media all and (max-width:480px) {
  /* 스펙 */
  .share-box .social-icon-line {
    display: none;
  }
  .item-table .spec-title {
    display: none;
  }
  .item-table ul {
    border: 1px solid #dedede;
    margin: 0 0 20px 0;
  }
  .item-table .title {
    position: inherit;
    background: #f2f2f2;
    width: 100%;
    display: block;
    text-align: left;
    padding: 10px;
    border-bottom: 1px solid #dedede;
  }
  .item-table .title .btn {
    display: block;
    float: right;
    margin-top: -4px;
  }
  .item-table .dl-box {
    display: none;
    overflow: hidden;
  }
  .item-table .dl-box dt {
    display: block;
    float: left;
    width: 100px;
    text-align: left;
    padding: 7px 10px;
    border-bottom: 1px solid #dedede;
  }
  .item-table .dl-box dd.item-A,
  .item-table .dl-box dd.item-B {
    float: none;
    overflow: hidden;
    width: inherit;
    padding: 7px 10px;
    text-align: left;
    border-bottom: 1px solid #dedede;
    background-color: #fff;
    opacity: 1;
    color: #444;
  }

  .title_area .tit_box{
    display: inherit;
    height: inherit!important;
  }

  .title_area .tit_txt {
    font-size: 15px!important;
    padding: 10px 0px 10px;
  }

  .title_area img{
    max-width: 20px!important;
    margin-top: 4px!important;
  }

}

{'fraction_non_alphanumeric': 0.16886062219592762, 'fraction_numerical': 0.04240003944189716, 'mean_word_length': 2.5907240219507877, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 15, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4218901', 'n_tokens_mistral': 9479, 'n_tokens_neox': 8809, 'n_words': 1808}