.spoint{
position:relative;/*基準設定*/
width:200px;/*円の直径と同じサイズに*/
height:400px;/*円の直径と同じサイズに*/
top:40px;
left:50px;
margin:0px;
background-color:rgba(0,0,0,0);/*基準円。出力はされない*/
font-size:10px;/*文字サイズ*/
}

/*コラム*/
column{
position: absolute;
left:25px;
}

column .column1b {
    position: absolute;
    width:200px;
    height:200px; 
    top:40px;
    left:75px;
    background-color: rgb(255,255,255);
    border-radius: 100px;/* ←円を作る */
   align:middle;
}
column .column2b {
    position: absolute;
    width:200px;
    height:200px; 
    top:152.5px; 
    left:10px;
    background-color: rgb(255,255,255);
    border-radius: 100px;/* ←円を作る */
   align:middle;
}
column .column3b {
    position: absolute;
    width:200px;
    height:200px; 
    top:152.5px; 
    left:140px;
    background-color: rgb(255,255,255);
    border-radius: 100px;/* ←円を作る */
   align:middle;
}

column .column1 {
    position: absolute;
    width:200px;
    height:200px; 
    top:40px;
    left:75px;
    background-color: rgba(255,96,255,0.375);
    border-radius: 100px;/* ←円を作る */
   align:middle;
}
column .column2 {
    position: absolute;
    width:200px;
    height:200px; 
    top:152.5px; 
    left:10px;
    background-color: rgba(255,255,96,0.375);
    border-radius: 100px;/* ←円を作る */
   align:middle;
}

column .column3 {
    position: absolute;
    width:200px;
    height:200px; 
    top:152.5px; 
    left:140px;
    background-color: rgba(96,255,255,0.375);
    border-radius: 100px;/* ←円を作る */
   align:middle;
}

column co1 {
position: absolute; /*文字位置を設定するために指定*/
font-size:20px;
left:45px;
top:87.5px;
}
column co2 {
position: absolute; /*文字位置を設定するために指定*/
font-size:20px;
left:45px;
top:87.5px;
}
column co3 {
position: absolute; /*文字位置を設定するために指定*/
font-size:20px;
left:87.5px;
top:97.5px;
}