diff --git a/app/assets/stylesheets/atoms/_a-meta.css b/app/assets/stylesheets/atoms/_a-meta.css
index 6cc0054b364..9ecbb46d306 100644
--- a/app/assets/stylesheets/atoms/_a-meta.css
+++ b/app/assets/stylesheets/atoms/_a-meta.css
@@ -22,6 +22,10 @@
   font-weight: 600;
 }
 
+.a-meta.is-important  .is-emphasized {
+  color: inherit;
+}
+
 a.a-meta {
   text-decoration: none;
   cursor: pointer;
diff --git a/app/components/products/product_component.html.slim b/app/components/products/product_component.html.slim
index 8e5e32a60da..76c773e6004 100644
--- a/app/components/products/product_component.html.slim
+++ b/app/components/products/product_component.html.slim
@@ -63,13 +63,13 @@
                 - else
                   | 約#{until_next_elapsed_days}時間
 
-      - if @product.comments.size > 0
+      - if @product.comments.any?
         hr.card-list-item__row-separator
         .card-list-item__row
           .card-list-item-meta
             .card-list-item-meta__items
               .card-list-item-meta__item
-                .a-meta コメント（#{@product.comments.size}）
+                .a-meta = helpers.comment_count(@product)
               .card-list-item-meta__item
                 .card-list-item__user-icons
                   - @product.commented_users.distinct.each do |user|
diff --git a/app/controllers/reports_controller.rb b/app/controllers/reports_controller.rb
index 63413607521..4ed236ae670 100644
--- a/app/controllers/reports_controller.rb
+++ b/app/controllers/reports_controller.rb
@@ -14,7 +14,7 @@ class ReportsController < ApplicationController # rubocop:todo Metrics/ClassLeng
   before_action :set_watch, only: %i[show]
 
   def index
-    @reports = Report.list.page(params[:page]).per(PAGER_NUMBER)
+    @reports = Report.list.includes(:comments).page(params[:page]).per(PAGER_NUMBER)
     @reports = @reports.joins(:practices).where(practices: { id: params[:practice_id] }) if params[:practice_id].present?
   end
 
diff --git a/app/helpers/events_helper.rb b/app/helpers/events_helper.rb
index 6fd292802a7..672fd2ac18d 100644
--- a/app/helpers/events_helper.rb
+++ b/app/helpers/events_helper.rb
@@ -13,18 +13,8 @@ def google_calendar_url(event)
     uri.to_s
   end
 
-  def event_comment_count(event, styled: true)
-    length = event.comments.length
-
-    if styled
-      link_to '#comments', class: "a-meta #{'is-disabled' if length.zero?}" do
-        'コメント（'.html_safe +
-          content_tag(:span, length, class: length.zero? ? 'is-muted' : 'is-emphasized') +
-          '）'.html_safe
-      end
-    else
-      "コメント（#{length}名）"
-    end
+  def comment_count(commentable)
+    safe_join(['コメント（', content_tag(:span, commentable.comments.size, class: 'is-emphasized'), '）'])
   end
 
   def event_participant_count(event)
diff --git a/app/views/announcements/_announcement.html.slim b/app/views/announcements/_announcement.html.slim
index 417b5595707..c818c47d57d 100644
--- a/app/views/announcements/_announcement.html.slim
+++ b/app/views/announcements/_announcement.html.slim
@@ -30,6 +30,7 @@
                   | 公開
                 time.a-meta__value datetime=announcement.published_at.iso8601
                   | #{l announcement.published_at}
-          .card-list-item-meta__item
-            .a-meta
-              | コメント（#{announcement.comments.length}）
+          - if announcement.comments.any?
+            .card-list-item-meta__item
+              .a-meta
+                = comment_count(announcement)
diff --git a/app/views/announcements/show.html.slim b/app/views/announcements/show.html.slim
index 301abc7f6fb..e30306e2900 100644
--- a/app/views/announcements/show.html.slim
+++ b/app/views/announcements/show.html.slim
@@ -45,12 +45,9 @@ hr.a-border
                       = @announcement.user.long_name
                 .page-content-header-metas__end
                   .page-content-header-metas__meta
-                    - length = @announcement.comments.length
-                    a.a-meta(href='#comments' class="#{length.zero? ? 'is-disabled' : ''}")
-                      | コメント（
-                      span#comment_count(class="#{length.zero? ? 'is-muted' : 'is-emphasized'}")
-                        = length
-                      | ）
+                    - if @announcement.comments.any?
+                      a.a-meta(href='#comments')
+                        = comment_count(@announcement)
             .page-content-header__row
               .page-content-header-actions
                 .page-content-header-actions__start
diff --git a/app/views/companies/products/_product.html.slim b/app/views/companies/products/_product.html.slim
index 0976b956832..2b1ecc99f5b 100644
--- a/app/views/companies/products/_product.html.slim
+++ b/app/views/companies/products/_product.html.slim
@@ -37,14 +37,14 @@
                   time.a-meta datetime=product.updated_at.iso8601
                     span.a-meta__label 更新
                     | #{l product.updated_at}
-      - if !product.comments.empty?
+      - if product.comments.any?
         hr.card-list-item__row-separator
         .card-list-item__row
           .card-list-item-meta
             .card-list-item-meta__items
               .card-list-item-meta__item
                 .a-meta
-                  | コメント（#{product.comments.size}）
+                  = comment_count(product)
               .card-list-item-meta__item
                 .card-list-item__user-icons
                   - commented_users[product.id].uniq.each do |user|
diff --git a/app/views/events/_event.html.slim b/app/views/events/_event.html.slim
index bc5fa385e6e..6512235a9d2 100644
--- a/app/views/events/_event.html.slim
+++ b/app/views/events/_event.html.slim
@@ -26,7 +26,9 @@
                   = l event.updated_at
           .page-content-header-metas__end
             .page-content-header-metas__meta
-              = event_comment_count(event, styled: true)
+              - if event.comments.any?
+                a.a-meta(href='#comments')
+                  = comment_count(event)
 
       .page-content-header__row
         .page-content-header-actions
diff --git a/app/views/events/_events.html.slim b/app/views/events/_events.html.slim
index e6a10ffdc69..90e1bd77aff 100644
--- a/app/views/events/_events.html.slim
+++ b/app/views/events/_events.html.slim
@@ -36,8 +36,8 @@ ul.card-list.a-card
                   .card-list-item-meta__item
                     .a-meta
                       | 補欠者（#{event.waitlist.count}名）
-                - if event.comments.size.positive?
+                - if event.comments.any?
                   .card-list-item-meta__item
                     .a-meta
-                      | コメント（#{event.comments.size}）
+                      = comment_count(event)
 = paginate @events
diff --git a/app/views/home/_colleague_trainee.html.slim b/app/views/home/_colleague_trainee.html.slim
index e86b92666e0..ece25f5c9ba 100644
--- a/app/views/home/_colleague_trainee.html.slim
+++ b/app/views/home/_colleague_trainee.html.slim
@@ -19,7 +19,7 @@
               .card-list-item-meta__item
                 = link_to user_products_path(user), class: 'card-list-item-meta__item-link a-text-link' do
                   | 提出物一覧（#{user.products.count}）
-            - if user.comments.present?
+            - if user.comments.any?
               .card-list-item-meta__item
                 = link_to user_comments_path(user), class: 'card-list-item-meta__item-link a-text-link' do
-                  | コメント（#{user.comments.count}）
+                  = comment_count(user)
diff --git a/app/views/movies/_movie_header.html.slim b/app/views/movies/_movie_header.html.slim
index b2656eef695..624e2b251b4 100644
--- a/app/views/movies/_movie_header.html.slim
+++ b/app/views/movies/_movie_header.html.slim
@@ -52,16 +52,12 @@ header.page-content-header
                           = image_tag 'users/avatars/ghost.png', class: 'thread-header__user-icon a-user-icon'
                       .a-user-name
                         | ghost
-
-        .page-content-header-metas__end
-          .page-content-header-metas
-            .page-content-header-metas__meta
-              - length = movie.comments.length
-              a.a-meta(href='#comments' class="#{length.zero? ? 'is-disabled' : ''}")
-                | コメント（
-                span#comment_count(class="#{length.zero? ? 'is-muted' : 'is-emphasized'}")
-                  = length
-                | ）
+        - if movie.comments.any?
+          .page-content-header-metas__end
+            .page-content-header-metas
+                .page-content-header-metas__meta
+                  a.a-meta(href='#comments')
+                    = comment_count(movie)
 
     .page-content-header__row
       .page-content-header-actions
diff --git a/app/views/pages/_doc_header.html.slim b/app/views/pages/_doc_header.html.slim
index 645a4a54869..5dc8796c405 100644
--- a/app/views/pages/_doc_header.html.slim
+++ b/app/views/pages/_doc_header.html.slim
@@ -55,16 +55,12 @@ header.page-content-header
                       image_class: 'thread-header__user-icon'
                     = link_to page.last_updated_user, class: 'a-user-name' do
                       | #{page.last_updated_user.login_name}
-
-        .page-content-header-metas__end
-          .page-content-header-metas
-            .page-content-header-metas__meta
-              - length = page.comments.length
-              a.a-meta(href='#comments' class="#{length.zero? ? 'is-disabled' : ''}")
-                | コメント（
-                span#comment_count(class="#{length.zero? ? 'is-muted' : 'is-emphasized'}")
-                  = length
-                | ）
+        - if page.comments.any?
+          .page-content-header-metas__end
+            .page-content-header-metas
+              .page-content-header-metas__meta
+                a.a-meta(href='#comments')
+                  = comment_count(page)
 
     .page-content-header__row
       .page-content-header-actions
diff --git a/app/views/pages/_page.html.slim b/app/views/pages/_page.html.slim
index 0c752206aff..1ef03e2ca64 100644
--- a/app/views/pages/_page.html.slim
+++ b/app/views/pages/_page.html.slim
@@ -52,4 +52,4 @@
             - if page.comments.any?
               .card-list-item-meta__item
                 .a-meta
-                  | コメント（#{page.comments.length}）
+                  = comment_count(page)
diff --git a/app/views/pair_works/_pair_work.html.slim b/app/views/pair_works/_pair_work.html.slim
index d019380dc03..e8934468ec1 100644
--- a/app/views/pair_works/_pair_work.html.slim
+++ b/app/views/pair_works/_pair_work.html.slim
@@ -40,9 +40,10 @@
                 - else
                   time.a-meta__value datetime=pair_work.published_at.iso8601
                     = l pair_work.published_at
-            .card-list-item-meta__item
-              .a-meta(class="#{pair_work.important? ? 'is-important' : ''}")
-                | コメント（#{pair_work.comments.length}）
+            - if pair_work.comments.any?
+              .card-list-item-meta__item
+                .a-meta(class="is-important")
+                  = comment_count(pair_work)
 
     - if pair_work.solved?
       .stamp.is-circle.is-solved
diff --git a/app/views/products/_product.html.slim b/app/views/products/_product.html.slim
index 78da650c7ce..31693707083 100644
--- a/app/views/products/_product.html.slim
+++ b/app/views/products/_product.html.slim
@@ -50,7 +50,7 @@
             .card-list-item-meta__items
               .card-list-item-meta__item
                 .a-meta
-                  | コメント（#{product.comments.size}）
+                  = comment_count(product)
               .card-list-item-meta__item
                 .card-list-item__user-icons
                   = render partial: 'users/icon',
diff --git a/app/views/products/_product_header.html.slim b/app/views/products/_product_header.html.slim
index 513dd931412..6f9fcc9a53f 100644
--- a/app/views/products/_product_header.html.slim
+++ b/app/views/products/_product_header.html.slim
@@ -68,15 +68,11 @@ header.page-content-header.is-product
                   | 更新
                 time.a-meta__value datetime=product.updated_at.iso8601
                   = l product.updated_at
-
-        .page-content-header-metas__end
-          .page-content-header-metas__meta
-            - length = product.comments.length
-            a.a-meta(href='#comments' class="#{length.zero? ? 'is-disabled' : ''}")
-              | コメント（
-              span(class="#{length.zero? ? 'is-muted' : 'is-emphasized'}")
-                = length
-              | ）
+        - if product.comments.any?
+          .page-content-header-metas__end
+            .page-content-header-metas__meta
+              a.a-meta(href='#comments')
+                = comment_count(product)
 
     .page-content-header__row
       .page-content-header-actions
diff --git a/app/views/products/_product_list_item.html.slim b/app/views/products/_product_list_item.html.slim
index 8d6075a7451..bda708ebb7f 100644
--- a/app/views/products/_product_list_item.html.slim
+++ b/app/views/products/_product_list_item.html.slim
@@ -54,7 +54,7 @@ ruby:
         hr.card-list-item__row-separator
         .card-list-item-meta__items
           .card-list-item-meta__item
-            .a-meta コメント（#{product.comments.size}）
+            .a-meta = comment_count(product)
           .card-list-item-meta__item
             .card-list-item__user-icons
               = render partial: 'users/icon',
diff --git a/app/views/regular_events/_regular_event.html.slim b/app/views/regular_events/_regular_event.html.slim
index cd7166e6152..ecc4715c707 100644
--- a/app/views/regular_events/_regular_event.html.slim
+++ b/app/views/regular_events/_regular_event.html.slim
@@ -22,14 +22,11 @@
               .a-meta
                 time.a-meta__value datetime=regular_event.updated_at.iso8601
                   = l regular_event.updated_at
-          .page-content-header-metas__end
-            .page-content-header-metas__meta
-              - length = regular_event.comments.length
-              a.a-meta(href='#comments' class="#{length.zero? ? 'is-disabled' : ''}")
-                | コメント（
-                span(class="#{length.zero? ? 'is-muted' : 'is-emphasized'}")
-                  = length
-                | ）
+          - if regular_event.comments.any?
+            .page-content-header-metas__end
+              .page-content-header-metas__meta
+                a.a-meta(href='#comments')
+                  = comment_count(regular_event)
 
       .page-content-header__row
         .page-content-header-actions
diff --git a/app/views/regular_events/_regular_events.html.slim b/app/views/regular_events/_regular_events.html.slim
index 40c84d2590f..5475b2e830c 100644
--- a/app/views/regular_events/_regular_events.html.slim
+++ b/app/views/regular_events/_regular_events.html.slim
@@ -47,9 +47,8 @@ ul.card-list.a-card
                   .a-meta
                     span.a-meta__label 開催日時
                     span.a-meta__value = "#{event.holding_cycles} #{l event.start_at, format: :time_only} ~ #{l event.end_at, format: :time_only}"
-                  .card-list-item-meta__item
-                - if event.comments.size.positive?
+                - if event.comments.any?
                   .card-list-item-meta__item
                     .a-meta
-                      | コメント（#{event.comments.size}）
+                      = comment_count(event)
 = paginate @regular_events
diff --git a/app/views/reports/_product.html.slim b/app/views/reports/_product.html.slim
index 6b8752b96af..faae089d483 100644
--- a/app/views/reports/_product.html.slim
+++ b/app/views/reports/_product.html.slim
@@ -31,7 +31,7 @@
             .card-list-item-meta__items
               .card-list-item-meta__item
                 .a-meta
-                  | コメント（#{product.comments.size}）
+                  = comment_count(product)
               .card-list-item-meta__item
                 .card-list-item__user-icons
                   = render partial: 'comments/user_icons', collection: product.comments.commented_users, as: :user
diff --git a/app/views/reports/_report.html.slim b/app/views/reports/_report.html.slim
index 1e164b8319a..018c0a1756e 100644
--- a/app/views/reports/_report.html.slim
+++ b/app/views/reports/_report.html.slim
@@ -48,7 +48,7 @@
             .card-list-item-meta__items
               .card-list-item-meta__item
                 .a-meta
-                  | コメント（#{report.comments.size}）
+                  = comment_count(report)
               .card-list-item-meta__item
                 .card-list-item__user-icons
                   = render partial: 'comments/user_icons', collection: report.comments.commented_users, as: :user
diff --git a/app/views/reports/_report_header.html.slim b/app/views/reports/_report_header.html.slim
index d3221fd5845..f29ea3acedc 100644
--- a/app/views/reports/_report_header.html.slim
+++ b/app/views/reports/_report_header.html.slim
@@ -40,12 +40,9 @@ header.page-content-header.is-report
 
         .page-content-header-metas__end
           .page-content-header-metas__meta
-            - length = report.comments.length
-            a.a-meta(href='#comments' class="#{length.zero? ? 'is-disabled' : ''}")
-              | コメント（
-              span(class="#{length.zero? ? 'is-muted' : 'is-emphasized'}")
-                = length
-              | ）
+            - if report.comments.any?
+              a.a-meta(href='#comments')
+                = comment_count(report)
 
     .page-content-header__row
       .page-content-header-actions
diff --git a/app/views/talks/_talk.html.slim b/app/views/talks/_talk.html.slim
index d7a6ab4bc9d..840d63ec57a 100644
--- a/app/views/talks/_talk.html.slim
+++ b/app/views/talks/_talk.html.slim
@@ -8,9 +8,8 @@
           h2.card-list-item-title__title(itemprop='name')
             = link_to "/talks/#{talk.id}#latest-comment", itemprop: 'url', class: 'card-list-item-title__link a-text-link' do
               | #{talk.user.long_name} さんの相談部屋
-      - if talk.comments.present?
+      - if talk.comments.any?
         hr.card-list-item__row-separator
-      - if talk.comments.present?
         .card-list-item__row
           .card-list-item-meta__items
             .card-list-item-meta__item
@@ -18,7 +17,7 @@
                 .card-list-item-meta__items
                   .card-list-item-meta__item
                     .a-meta
-                      | コメント（#{talk.comments.size}）
+                      = comment_count(talk)
                   .card-list-item-meta__item
                     .card-list-item__user-icons
                       = render partial: 'users/icon',
diff --git a/app/views/users/events/index.html.slim b/app/views/users/events/index.html.slim
index dd55a782c7d..1d5c2875de3 100644
--- a/app/views/users/events/index.html.slim
+++ b/app/views/users/events/index.html.slim
@@ -57,10 +57,10 @@
                             .card-list-item-meta__item
                               .a-meta
                                 = event_waitlist_count(event)
-                          - if event.comments.size.positive?
+                          - if event.comments.any?
                             .card-list-item-meta__item
                               .a-meta
-                                = event_comment_count(event, styled: false)
+                                = comment_count(event)
           .pagination
             = paginate @events
         - else
diff --git a/app/views/users/regular_events/index.html.slim b/app/views/users/regular_events/index.html.slim
index 1d3c629e9de..17ae63e8c77 100644
--- a/app/views/users/regular_events/index.html.slim
+++ b/app/views/users/regular_events/index.html.slim
@@ -56,10 +56,10 @@
                             time.a-meta(datetime="#{event.start_at}")
                               | 開催日時:
                               | #{event.holding_cycles} #{l event.start_at, format: :time_only} ～ #{l event.end_at, format: :time_only}
-                          - if event.comments.size.positive?
+                          - if event.comments.any?
                             .card-list-item-meta__item
                               .a-meta
-                                = event_comment_count(event, styled: false)
+                                = comment_count(event)
           .pagination
             = paginate @regular_events
         - else
diff --git a/test/system/announcements_test.rb b/test/system/announcements_test.rb
index c07a3cae76d..0a616cf7f98 100644
--- a/test/system/announcements_test.rb
+++ b/test/system/announcements_test.rb
@@ -44,7 +44,7 @@ class AnnouncementsTest < ApplicationSystemTestCase
     assert_selector 'p', text: 'コメント数表示のテストです。'
 
     visit current_path
-    assert_selector '#comment_count', text: '2'
+    assert_selector 'a.a-meta[href="#comments"] span.is-emphasized', text: '2'
   end
 
   test 'using file uploading by file selection dialogue in textarea' do
diff --git a/test/system/movies_test.rb b/test/system/movies_test.rb
index 862a5e8b2e2..fa899e3ebb8 100644
--- a/test/system/movies_test.rb
+++ b/test/system/movies_test.rb
@@ -41,14 +41,13 @@ class MoviesTest < ApplicationSystemTestCase
       content_type: 'video/mp4'
     )
     visit_with_auth "/movies/#{movie.id}", 'kimura'
-    assert_selector '#comment_count', text: 0
 
     wait_for_comment_form
     post_comment('コメント数表示のテストです。')
 
     visit_with_auth "/movies/#{movie.id}", 'kimura'
     wait_for_javascript_components
-    assert_selector '#comment_count', text: 1
+    assert_selector 'a.a-meta[href="#comments"] span.is-emphasized', text: 1
   end
 
   test 'show the edit movie page' do
diff --git a/test/system/pages_test.rb b/test/system/pages_test.rb
index 72a590ba349..7ed0d8cc27f 100644
--- a/test/system/pages_test.rb
+++ b/test/system/pages_test.rb
@@ -40,14 +40,13 @@ class PagesTest < ApplicationSystemTestCase
   test 'show comment count' do
     page = pages(:page1)
     visit_with_auth "/pages/#{page.id}", 'kimura'
-    assert_selector '#comment_count', text: 0
 
     wait_for_comment_form
     post_comment('コメント数表示のテストです。')
 
     visit current_path
     wait_for_javascript_components
-    assert_selector '#comment_count', text: 1
+    assert_selector 'span.is-emphasized', text: 1
   end
 
   test 'show last updated user icon' do
diff --git a/test/system/product/product_list_test.rb b/test/system/product/product_list_test.rb
index 5dee2c91492..8a554bbef68 100644
--- a/test/system/product/product_list_test.rb
+++ b/test/system/product/product_list_test.rb
@@ -37,7 +37,7 @@ class Product::ProductListTest < ApplicationSystemTestCase
     visit_with_auth '/products', 'komagata'
     product_item = find("a[href='/products/#{product.id}']").ancestor('.card-list-item')
     within product_item do
-      assert_text "コメント（#{product.comments.size}）"
+      assert_text(/コメント（\s*#{product.comments.size}\s*）/)
       assert_selector '.card-list-item__user-icons'
     end
   end
diff --git a/test/system/reports_test.rb b/test/system/reports_test.rb
index e41c91c9ebc..8c909cbe2bc 100644
--- a/test/system/reports_test.rb
+++ b/test/system/reports_test.rb
@@ -19,9 +19,7 @@ class ReportsTest < ApplicationSystemTestCase
 
   test 'show number of comments' do
     visit_with_auth report_path(reports(:report1)), 'komagata'
-    within(:css, '.is-emphasized') do
-      assert_text '2'
-    end
+    assert_selector '.is-emphasized', text: '2'
   end
 
   test 'hide user icon from recent reports in report show' do
diff --git a/test/system/talks/user_list_test.rb b/test/system/talks/user_list_test.rb
index 4c68976038e..942f7782479 100644
--- a/test/system/talks/user_list_test.rb
+++ b/test/system/talks/user_list_test.rb
@@ -51,7 +51,7 @@ class UserListTest < ApplicationSystemTestCase
       within('.card-list-item-meta') do
         assert_text 'コメント'
         assert_selector 'img.a-user-icon'
-        assert_text '（1）'
+        assert_selector 'span.is-emphasized', text: 1
         assert_text '2019年01月02日(水) 00:00'
         assert_text '（hajime）'
       end