x grid lines showing every other tick

Here is my code that I am using to get the chart.

```
var chart = c3.generate({
bindto: '#chart',
size: {
height: 500,
width: 1100,
},
data: {
x: 'Company',
columns: data,
type: 'scatter',
},
grid: {
x: {
show: true
}
},
axis: {
x: {
type: 'categories',
tick: {
rotate: 75,
culling: {
max: 1
}
},
height: 200
},
y: {
tick: {
format: d3.format("$,")
}
}
}
});
```

Here is an image of the chart

There are two issues. One is that I want the x ticks to line up with the lines and not be in between the lines like it is in the picture above. This way the x line would go through the dots and not beside it.

I just want the lines to go through the dots, please let me know how this can be done.