メモ：CSS ボーダーのグラデーション
上記サイトの内容が面白そうなのでやってみた
test.htmlの実行
borderに直にグラデーションを指定することはできないようで、
親要素の背景をグラデーションにして、paddingで子要素を押し込んでボーダーのように見せる
半円の切りかけの表現もコロンブスの卵的で面白い
本題とは逸れるがCSSでの変数も初めて使った
独自に、サイズ設定もcalc()関数（これも初使用）と組み合わせて変数で盛り込んで、本体の高さやボーダーの太さ変更時に半円の切り欠きがズレないように自動的に計算してくれるようにした
test.html
test.css
test.js （マウスの動きに合わせてカードが動くスクリプト）
きらめき感を出すためにボーダーの色をアニメーションさせてみる
マウスオーバーさせると、背景色を.outerと同じにするようにも記述
下記のCSSを追加する
変数とcalc()は、ものすごく便利なので今後使い倒すことになりそう
参考になったサイト