laravel bootstrap ラジオボタンと文字の間に空白ができてしまいます。

開発環境

laravel6.0.3
php7.2.22
mysql8.0.17
Mac

ラジオボタンを作成したのですが、日、週、月、年の左に余分な空白が入ってしまい、困っています。
ボタンのすぐ隣に日、週、月、年が来るようにしたいです。
どのようにすれば修正できるか、ご教授願います。

現在の状態

View(子)

View
1@extends('layouts.default')
2@section('title', '学習記録')
3
4@section('content')
5<section class="records_list">
6
7    <form action="{{ action('RecordsController@index')}}" method="GET">
8        @csrf
9        <div class="search-bar">
10        <div class="form-group form-inline">
11            {{--カテゴリ絞り込み検索--}}
12            <label>カテゴリ名</label>
13            <select class="form-control" name="category">
14                <option value="">選択してください</option>
15            @forelse($categories as $category)
16                <option value="{{$category->id}}" @if( "{{$category->id}}" === "{{$selectedCategory}}" ) selected @else "" @endif >{{$category->name}}</option>
17            @empty
18                <p>カテゴリーがありません。</p>
19            @endforelse
20            </select>
21
22            {{--表示期間絞り込み検索--}}
23            <div class="form-check">
24                <input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio1" value="day" {{ $selectedPeriod == 'day' ? 'checked' : '' }}>
25                <label class="form-check-label">日</label>
26            </div>
27            <div class="form-check">
28                <input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio2" value="week"
29                {{ $selectedPeriod == 'week' ? 'checked' : '' }}>
30                <label class="form-check-label">週</label>
31            </div>
32            <div class="form-check">
33                <input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio3" value="month"
34                {{ $selectedPeriod == 'month' ? 'checked' : '' }}>
35                <label class="form-check-label">月</label>
36            </div>
37            <div class="form-check">
38                <input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio3" value="year"
39                {{ $selectedPeriod == 'year' ? 'checked' : '' }}>
40                <label class="form-check-label">年</label>
41            </div>
42            <div class="form-check"><button type="submit" class="btn btn-primary">検索</button></div>
43        </div>
44        </div>
45    </form>
46
47    {{--circleProgressBar--}}
48    <div class="wrapper">
49      <div class="row">
50        <div class="col">
51          <div class="counter" data-cp-percentage={{$sumForProgress}} data-cp-color="#00bfeb">
52          </div>
53          <h4>合計：{{$sum}}時間</h4>
54        </div>
55      </div>
56      </div>
57
58      {{--学習記録リスト--}}
59      @forelse ($records as $record)
60      <div class="container">
61          <div class="row">
62              <div class="col">{{ $record->category->name }}</div>
63              <div class="col">{{ $record->created_at }}</div>
64              <div class="col">{{ $record->time }}時間</div>
65              <form action="/records/delete/{{$record->id}}" method="POST">
66                  @csrf
67                  <div class="col">
68                      <button type="submit" class="btn btn-outline-primary" class="del_btn" onclick='return confirm("削除してよろしいですか？");'>削除</button>
69                  </div>
70              </form>
71              <div class="col">
72                  <div class="progress">
73                      <div class="progress-bar bg-warning" role="progressbar" style='width:{{$record->time}}%' aria-valuenow="{{$record->time}}" aria-valuemin="0" aria-valuemax="100">{{$record->time}}h</div>
74                  </div>
75              </div>
76          </div>
77      </div>
78
79    @empty
80        <p class="error">記録がありません。</p>
81    @endforelse
82</section>
83
84
85
86{{-- ページネーションバー--}}
87<span class="pagination">{{ $records->appends($selectedCategory)->appends($selectedPeriod)->links() }}</span>
88
89<script src="/js/main.js"></script>
90@endsection
91

View(親)

View
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4    <meta charset="utf-8">
5    <title>@yield('title')</title>
6    <link rel="stylesheet" href="/css/styles.css">
7    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
8    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
9    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
10    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
11</head>
12<body>
13      <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
14          <a class="navbar-brand" href="{{ url('/') }}" >チリツモ</a>
15          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
16          <span class="navbar-toggler-icon"></span>
17          </button>
18          <div class="collapse navbar-collapse" id="navbarNav">
19              <ul class="navbar-nav">
20                  <li class="nav-item active">
21                      <a class="nav-link" href="{{ action('RecordsController@create') }}">今日の記録 <span class="sr-only">(current)</span></a>
22                  </li>
23                  <li class="nav-item active">
24                      <a class="nav-link" href="{{ action('CategoriesController@maintenance') }}">カテゴリ一覧</a>
25                  </li>
26                  <li class="nav-item active">
27                      <a class="nav-link" href="{{ action('CategoriesController@create') }}">カテゴリ登録</a>
28                  </li>
29              </ul>
30          </div>
31      </nav>
32      <div class="content">
33          @yield('content')
34      </div>
35</body>
36</html>
37

CSS
1body {
2  font-family: Verdana, sans-serif;
3  font-size: 14px;
4}
5
6.records_list{
7    margin-top: 30px;
8    display: inline-block;
9}
10
11#search-bar {
12    text-align: center;
13}
14
15.form-check {
16    margin-right: 30px;
17}
18
19.form-control {
20    margin-right: 30px;
21    width: 100px;
22}
23.content {
24  width: 100%;
25  text-align: center;
26}
27
28.container {
29    margin-top: 30px;
30}
31
32.create-container {
33    margin-top: 80px;
34    margin-bottom: 30px;
35    display: inline-block;
36}
37
38.maintenance-container {
39    margin-top: 80px;
40    margin-bottom: 30px;
41    display: inline-block;
42}
43.row {
44    margin-bottom: 20px;
45}
46
47.create-category-name{
48    margin-top: 80px;
49    margin-bottom: 30px;
50}
51.error{
52    font-size: 12px;
53    color: tomato;
54    margin-top: 20px;
55}
56.del{
57    font-size: 12px;
58}
59
60.edit{
61    font-size: 12px;
62}
63
64.submit_btn{
65    text-align: center;
66}
67
68.pagination {
69    display: flex;
70    justify-content: center;
71    align-items: center;
72    margin-top: 30px;
73}
74
75.register-btn {
76    display: flex;
77    justify-content: center;
78    align-items: center;
79}
80
81.category-title {
82    margin-top: 30px;
83}
84
85.category {
86    width:50px;
87}
88
89//circleProgress
90h1 {
91  background: rgba(255,255,255,0.8);
92  box-shadow:0px 1px 10px 2px rgba(0,0,0,0.2);
93  border-bottom: 3px solid #00bfeb;
94  font-size: calc(1em + 1vmax);
95}
96.counter {
97  display: inline-flex;
98  cursor:pointer;
99  width:300px;
100  height:300px;
101  max-width:100%;
102  position:relative;
103  justify-content:center;
104  align-items:center;
105  font-size: calc(1em + 1vmin);
106  transition: height .2s ease-in-out;
107  background: #fff;
108  border-radius:50%;
109  box-shadow:0px 1px 10px 2px rgba(0,0,0,0.2);
110  margin:1em 0;
111}
112.percentage {
113  position:absolute;
114  text-align:center;
115  top:50%;
116  left:0;
117  right:0;
118  vertical-align:middle;
119  transform:translate3d(0,-50%,0);
120}
121canvas {
122  position:absolute;
123}
124
125input {
126    width: 200px;
127}
128@import url('https://fonts.googleapis.com/css?family=Open+Sans');
129body {
130  font-family: 'Open Sans', sans-serif;
131  text-align:center;
132}
133