diff --git a/index.html b/index.html
index 9dfee90..fe10963 100644
--- a/index.html
+++ b/index.html
@@ -29,7 +29,7 @@
                 required
                 pattern="[0-9]{4}/[0-9]{2}/[0-9]{2}.*"
                 onchange="timechanged()">  
-                <span class="reload blue" onclick="timechanged();">RELOAD</span>
+                <span class="reload blue" onclick="timechanged();">Reload</span>
             </fieldset>
         </form>
 
@@ -74,14 +74,17 @@
                 <label for="ML1" class="checkbox">ML1</label>
                 <input type="checkbox" id="ML2" onchange="filter()"/>
                 <label for="ML2" class="checkbox">ML2</label>
-                <input type="checkbox" id="HSJ" onchange="HSJ_sub(); filter()"/>
-                <label for="HSJ" class="checkbox">HSI</label>
-                <div class="box">
-                    <input type="checkbox" class="mini" id="HSJ-A" onchange="HSJ_mini_sub(); filter()"/>
-                    <label for="HSJ-A" class="checkbox mini">HSI-A</label>
-                    <input type="checkbox" class="mini" id="HSJ-B" onchange="HSJ_mini_sub(); filter()"/>
-                    <label for="HSJ-B" class="checkbox mini">HSI-B</label>
-                </div>
+                <span class="box">
+                    <input type="checkbox" id="HSJ" onchange="HSJ_sub(); filter()"/>
+                    <label for="HSJ" class="checkbox">HSI</label>
+
+                    <span class="bbox">
+                        <input type="checkbox" id="HSJ-A" onchange="HSJ_mini_sub(); filter()"/>
+                        <label for="HSJ-A" class="checkbox mini">HSI-A</label>
+                        <input type="checkbox" id="HSJ-B" onchange="HSJ_mini_sub(); filter()"/>
+                        <label for="HSJ-B" class="checkbox mini">HSI-B</label>
+                    </span>
+                </span>
             </fieldset>
         </form>
         <form>
@@ -345,7 +348,7 @@
     var from = "from="+$("#input_from").val();
     var to   = "to="+$("#input_to").val();
     var query = [date, from, to];
-    ["GRL", "ML1", "ML2", "HSJ-A", "HSJ-B", "uniq"].forEach(
+    ["GRL", "ML1", "ML2", "HSJ", "HSJ-A", "HSJ-B", "uniq"].forEach(
             function (s) {if($("#"+s).prop("checked")) {query.unshift(s+"=true");}});
     query = query.join('&');
     window.location.href = "/~tkuro/cgi-bin/attend/call.cgi?"+query+"&excel=true";
diff --git a/lib/themes/sitelocal.css b/lib/themes/sitelocal.css
index 96eca23..94cac32 100644
--- a/lib/themes/sitelocal.css
+++ b/lib/themes/sitelocal.css
@@ -127,14 +127,24 @@
 
 
 .mini {
-    font-size: 10px;
+    font-size: 5px;
+    background: grey;
+}
+
+.mini:before {
+    width: 3px;
 }
 
 .box {
-    display: inline-block;
-    margin: 5px ;
+    display: inline;
+    border: solid 8px #eef;
+    border-radius: 8px;
+    background: #eef;
+}
+
+.bbox {
+    display: inline;
     width: 80px;
-    height: 60px;
 }
 
 input[type=radio], input[type=checkbox] {
@@ -147,8 +157,8 @@
     transition: background-color 0.2s linear;
     position: relative;
     display: inline-block;
-    margin: 0 10px 0px 0;
-    padding: 8px 8px 8px 42px;
+    margin: 0 0px 0px 0;
+    padding: 8px 0px 8px 42px;
     border-radius: 8px;
     background-color: #f6f7f8;
     vertical-align: middle;
@@ -223,13 +233,14 @@
 }
 
 .reload {
+    width: 100px;
+    height: 100px;
     position: relative;
     border: 4px solid;
     border-right-color: transparent;
-    border-radius: 100%;
+    border-radius: 60%;
     box-sizing: border-box;
-    text-color: black;
-    color: darkblue;
+	text-shadow: -1px -1px 1px blue, 1px 1px 1px grey;
 }
 
 .reload:before{
@@ -246,3 +257,6 @@
     box-sizing: border-box;
 }
 
+.blue {
+    color: #68b;
+}