@charset "UTF-8";
:root[data-theme="color-a"] {
  --color-main: orange;
  --color-sub: gold;
  --color-text: #000;
}
:root[data-theme="color-b"] {
  --color-main: green;
  --color-sub: lightgreen;
  --color-text: #000;
}
:root[data-theme="color-c"] {
  --color-main: navy;
  --color-sub: blue;
  --color-text: #fff;
}

body{
    background-color: var(--color-main);
    color: var(--color-text);
}

p {
    background-color: var(--color-sub);
}

/*ボタンの装飾*/
button{
    width: 50px;
    height: 50px;
    border-radius: 25px;
    border:1px solid #fff;
}

#btn-a{
    background-color:orange;
    color:#000;}

#btn-b{
    background-color:green;
    color:#000;}
    
#btn-c{
    background-color:navy;
    color:#fff;}