
span.c_ff0000{
    background-color:#ff0000;
}

span.c_ff3300{
    background-color:#ff3300;
}

span.c_ff6600{
    background-color:#ff6600;
}

span.c_ff9900{
    background-color:#ff9900;
}

span.c_ffcc00{
    background-color:#ffcc00;
}


span.c_ffff00{
    background-color:#ffff00;
}

span.c_ffff33{
    background-color:#ffff33;
}

span.c_ffff66{
    background-color:#ffff66;
}

span.c_ffff99{
    background-color:#ffff99;
}

span.c_ffffcc{
    background-color:#ffffcc;
}

span.c_ff00ff{
    background-color:#ff00ff;
}

span.c_ff33ff{
    background-color:#ff33ff;
}

span.c_ff66ff{
    background-color:#ff66ff;
}

span.c_ff99ff{
    background-color:#ff99ff;
}

span.c_ffccff{
    background-color:#ffccff;
}

span.c_ffffff{
    background-color:#ffffff;
    border:solid 1px #ccc;
}
span.c_000000{
    background-color:#000000;
}

span.c_0000ff{
    background-color:#0000ff;
}

span.c_0033ff{
    background-color:#0033ff;
}

span.c_0066ff{
    background-color:#0066ff;
}

span.c_0099ff{
    background-color:#0099ff;
}

span.c_00ccff{
    background-color:#00ccff;
}

span.c_00ffff{
    background-color:#00ffff;
}

span.c_9900ff{
    background-color:#9900ff;
}

span.c_9933ff{
    background-color:#9933ff;
}

span.c_9966ff{
    background-color:#9966ff;
}

span.c_9999ff{
    background-color:#9999ff;
}

span.c_99ccff{
    background-color:#99ccff;
}

span.c_99ffff{
    background-color:#99ffff;
}




span.c_009933{
    background-color:#009933;
}

span.c_009966{
    background-color:#009966;
}

span.c_009999{
    background-color:#009999;
}

span.c_0099cc{
    background-color:#0099cc;
}

span.c_00ff00{
    background-color:#00ff00;
}

span.c_00ff33{
    background-color:#00ff33;
}

span.c_00ff66{
    background-color:#00ff66;
}

span.c_00ff99{
    background-color:#00ff99;
}





span.c_99ff00{
    background-color:#99ff00;
}

span.c_99ff33{
    background-color:#99ff33;
}

span.c_99ff66{
    background-color:#99ff66;
}

span.c_99ff99{
    background-color:#99ff99;
}

span.c_99ffcc{
    background-color:#99ffcc;
}



span.c_ff3333{
    background-color:#ff3333;
}

span.c_aa3333{
    background-color:#aa3333;
}

span.c_993333{
    background-color:#993333;
}

span.c_663333{
    background-color:#663333;
}

span.c_33ff33{
    background-color:#33ff33;
}

span.c_33aa33{
    background-color:#33aa33;
}

span.c_339933{
    background-color:#339933;
}

span.c_336633{
    background-color:#336633;
}

span.c_3333ff{
    background-color:#3333ff;
}

span.c_3333aa{
    background-color:#3333aa;
}

span.c_333399{
    background-color:#333399;
}

span.c_333366{
    background-color:#333366;
}

span.c_00aa00{
    background-color:#00aa00;
}

span.c_009900{
    background-color:#009900;
}

span.c_006600{
    background-color:#006600;
}

span.c_003300{
    background-color:#003300;
}

span.c_333333{
    background-color:#333333;
}

span.c_666666{
    background-color:#666666;
}

span.c_999999{
    background-color:#999999;
}

span.c_aaaaaa{
    background-color:#aaaaaa;
}

span.c_none{
    background:url(../img/nocolor.svg);
    border:solid #aaa 1px;
}



/*レッド*/
span.c_eb0514{
    background-color:#EB0514;
}

/*濃いレッド*/
span.c_ba0c30{
    background-color:#BA0C30;
}

/*ホットピンク*/
span.c_e0457b{
    background-color:#E0457B;
}

/*ピンク*/
span.c_f57eb6{
    background-color:#F57EB6;
}

/*サーモンピンク*/
span.c_fc9bb3{
    background-color:#FC9BB3;
}

/*えんじ*/
span.c_912f45{
    background-color:#912F45;
}

/*オレンジ*/
span.c_fe5101{
    background-color:#FE5101;
}

/*やまぶき色*/
span.c_ffa402{
    background-color:#FFA402;
}

/*ライトイエロー*/
span.c_f7ea48{
    background-color:#F7EA48;
}

/*クリーム*/
span.c_f1eb9c{
    background-color:#F1EB9C;
}

/*黄緑*/
span.c_97d702{
    background-color:#97D702;
}

/*ダークグリーン*/
span.c_007a33{
    background-color:#007A33;
}

/*グリーン*/
span.c_009a43{
    background-color:#009A43;
}

/*パステルグリーン*/
span.c_9de7d7{
    background-color:#9DE7D7;
}

/*ミントグリーン*/
span.c_6bcaba{
    background-color:#6BCABA;
}

/*エメラルドグリーン*/
span.c_00a499{
    background-color:#00A499;
}

/*ダークブルー*/
span.c_012169{
    background-color:#012169;
}

/*ブルー*/
span.c_0072ce{
    background-color:#0072CE;
}

/*スカイブルー*/
span.c_02a3e0{
    background-color:#02A3E0;
}

/*ダークネイビー*/
span.c_071d49{
    background-color:#071D49;
}

/*パステルブルー*/
span.c_74d1ea{
    background-color:#74D1EA;
}

/*青紫色*/
span.c_685bc7{
    background-color:#685BC7;
}


/*パープル*/
span.c_8031a7{
    background-color:#8031A7;
}

/*パステルパープル*/
span.c_be9bde{
    background-color:#BF9BDE;
}

/*ブラウン*/
span.c_8b5b29{
    background-color:#8B5B29;
}

/*ベージュ*/
span.c_ceb888{
    background-color:#CEB888;
}

/*ホワイト*/
span.c_ffffff{
    background-color:#FFFFFF;
    border:solid 1px #ccc;
}

/*ダークグレー*/
span.c_53565b{
    background-color:#53565B;
}

/*グレー*/
span.c_b1b3b3{
    background-color:#B1B3B3;
}

/*ブラック*/
span.c_000000{
    background-color:#000000;
}


/*蛍光ブルー*/
span.c_009ace.flourescent{
    background-color:#009ACE;
    /*background-image:url(../img/color_fluorescent.svg);*/
}



/*蛍光グリーン*/
span.c_44d62c.flourescent{
    background-color:#44D62C;
}

/*蛍光イエロー*/
span.c_ffe900.flourescent{
    background-color:#FFE900;
}

/*蛍光オレンジ*/
span.c_ffaa4d.flourescent{
    background-color:#FFAA4D;
}

/*蛍光ピンク*/
span.c_ff3e9e.flourescent{
    background-color:#FF3E9E;
}



span.flourescent:after{
    content:url(../img/color_fluorescent-rev.svg);
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
}

span.c_ffe900.flourescent:after{
    content:url(../img/color_fluorescent.svg);
}

/*半透明*/
span.c_eeeeee.transparent{
    background-color:#EEEEEE;
}

/*半透明ブルー*/
span.c_009ace.transparent{
    background-color:#009ACE;
    background-color:rgba(0,154,206,0.3);
}

/*半透明グリーン*/
span.c_44d62c.transparent{
    background-color:#44D62C;
    background-color:rgba(68,214,44,0.3);
}

/*半透明イエロー*/
span.c_ffe900.transparent{
    background-color:#FFE900;
    background-color:rgba(255,233,0,0.3);
}

/*半透明ピンク*/
span.c_ff3eb5.transparent{
    background-color:#FF3EB5;
    background-color:rgba(255,62,181,0.3);
}

/*半透明コーラル*/
span.c_e5958f.transparent{
    background-color:#E5958F;
    background-color:rgba(229,149,143,0.3);
}

/*半透明オレンジ*/
span.c_ffae62.transparent{
    background-color:#FFAE62;
    background-color:rgba(255,174,98,0.6);
}

/*半透明ミントグリーン*/
span.c_a7e6d7.transparent{
    background-color:#A7E6D7;
    background-color:rgba(167,230,215,0.3);
}

/*半透明パープル*/
span.c_dfc8e7.transparent{
    background-color:#DFC8E7;
    background-color:rgba(223,200,231,0.6);
}

/*半透明グレー*/
span.c_d9d9d6.transparent{
    background-color:#D9D9D6;
}

span.transparent:after{
    content:url(../img/color_transparent.svg);
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
}

/*半透明金ラメ*/
span.c_89764b.g-rame{
    background-color:#89764B;
    background-color:#EEEEEE;
}

/*半透明銀ラメ*/
span.c_8d9093.s-rame{
    background-color:#8D9093;
    background-color:#EEEEEE;
}

/*金*/
span.c_89764b.metaric{
    background-color:#89764B;
    background: linear-gradient(-30deg, #B67B03 0%, #DAAF08 45%, #FEE9A0 70%, #DAAF08 85%, #B67B03 90% 100%);
}

/*金2*/
span.c_705d2f.metaric{
    background-color:#705d2f;
    background: linear-gradient(-30deg, #9f7c34 0%, #bba03a 45%, #d8c890 70%, #bba03a 85%, #9f7c34 90% 100%);
}

/*金3*/
span.c_705d2f.metaric{
    background-color:#705d2f;
    background: linear-gradient(-30deg, #9f7c34 0%, #bba03a 45%, #d8c890 70%, #bba03a 85%, #9f7c34 90% 100%);
}

/*銀*/
span.c_8d9093.metaric{
    background-color:#8D9093;
    background: linear-gradient(-30deg, #757575 0%, #9E9E9E 45%, #E8E8E8 70%, #9E9E9E 85%, #757575 90% 100%);
}

/*銀2*/
span.c_696b6e.metaric{
    background-color:#8D9093;
    background: linear-gradient(-30deg, #757575 0%, #7E7E7E 45%, #cccccc 70%, #7E7E7E 85%, #757575 90% 100%);
}

/*銀3*/
span.c_696b6e.metaric{
    background-color:#8D9093;
    background: linear-gradient(-30deg, #757575 0%, #7E7E7E 45%, #cccccc 70%, #7E7E7E 85%, #757575 90% 100%);
}

span.g-rame:after{
    content:url(../img/color_g-rame.svg);
    background-image:url(../img/g-rame.webp);
    position:absolute;
    background-size: 100%;
    border-radius: 0.8em;
    width:100%;
    height:100%;
    top:0;
    left:0;
}

span.s-rame:after{
    content:url(../img/color_s-rame.svg);
    background-image:url(../img/s-rame.webp);
    position:absolute;
    background-size: 100%;
    border-radius: 0.8em;
    width:100%;
    height:100%;
    top:0;
    left:0;
}

span.c_705d2f.metaric:after,
span.c_696b6e.metaric:after{
    content:url(../img/color_gold.svg);
    background-image:url(../img/scratch.webp);
    position:absolute;
    background-size: 100%;
    border-radius: 0.8em;
    width:100%;
    height:100%;
    top:0;
    left:0;
}

span.c_696b6e.metaric:after{
    content:url(../img/color_silver.svg);
}

/*蓄光ブルー*/
span.c_48a6c4.glow{
    background-color:#48A6C4;
}

/*蓄光水色*/
span.c_97cbd9.glow{
    background-color:#97CBD9;
}

/*蓄光グリーン*/
span.c_99c674.glow{
    background-color:#99C674;
}

/*蓄光イエロー*/
span.c_e6e35b.glow{
    background-color:#E6E35B;
}

/*蓄光オレンジ*/
span.c_e9b94f.glow{
    background-color:#E9B94F;
}

/*蓄光サーモンピンク*/
span.c_e78e6b.glow{
    background-color:#E78E6B;
}

/*蓄光レッド*/
span.c_d45663.glow{
    background-color:#D45663;
}

/*蓄光半透明*/
span.c_eeeeee.glow{
    background-color:#EEEEEE;
    /*border:solid 1px #aaa;*/
}

/*蓄光ピンク*/
span.c_d3679d.glow{
    background-color:#D3679D;
}

/*蓄光パープル*/
span.c_c35391.glow{
    background-color:#C35391;
}

/*蓄光白*/
span.c_ffffff.glow{
    background-color:#FFFFFF;
    border:solid 1px #ccc;
}

span.glow:after{
    content:url(../img/color_glow-rev.svg);
    position:absolute;
    background-size: 100%;
    border-radius: 0.8em;
    width:100%;
    height:100%;
    top:0;
    left:0;
}

span.c_e6e35b.glow:after,
span.c_eeeeee.glow:after,
span.c_ffffff.glow:after{
    content:url(../img/color_glow.svg);
}

span.c_transparent,
span.c_rame,
span.c_grow1,
span.c_grow2{
    font-size: 0.6em;
    width: 3.8em;
    height: 2.1em;
    letter-spacing: -0.1em;
    padding: 0 0.4em;
    padding-left: 0.2em;
    line-height: 2.1;
    text-align: center;
    color: rgb(200, 0, 0);
    background: #ffd6ef;
    white-space: nowrap;
}

span.c_rame{
    background: url(../img/rame.webp);
    background-size:50% 50%;
    color:#ffffff;
    letter-spacing:0.2em;
    text-shadow: 0 0 2px rgba(18,20,95,1), 0 0 2px rgba(18,20,95,1), 0 0 2px rgba(18,20,95,1);
}



span.c_grow1{
    background: #b7eea9;
}

span.c_grow2{
    background: #d3f4ec;
}

.color-select_btn span.checked{
    border:solid red 2px;
}
.color-select_btn span.c_ff0000.checked,
.color-select_btn span.c_ff3300.checked,
.color-select_btn span.c_ff6600.checked,
.color-select_btn span.c_ff3333.checked,
.color-select_btn span.c_ff00ff.checked,
.color-select_btn span.c_ff33ff.checked,
.color-select_btn span.c_ff66ff.checked
{
    border:solid #9900ff 2px;
}

.color-select_btn span.c_eb0514.checked,
.color-select_btn span.c_f5002c.checked,
.color-select_btn span.c_ba0c30.checked,
.color-select_btn span.c_e0457b.checked,
.color-select_btn span.c_ba0c30.checked,
.color-select_btn span.c_fe5101.checked,
.color-select_btn span.c_ff3e9e.checked{
    border:solid #9900ff 2px;
}


.color-select_btn span.c_transparent.checked,
.color-select_btn span.c_rame.checked,
.color-select_btn span.c_grow1.checked,
.color-select_btn span.c_grow2.checked{
    border:solid red 2px;
    line-height: 1.6;
}


.metaric.rock{
    opacity:0.3;
    pointer-events:none;
    background-image: linear-gradient(45deg,rgba(0,0,0,0.5)) !important;

}

.debos.rock{
    opacity:0.3;
    pointer-events:none;
}

.flat.rock{
    opacity:0.3;
    pointer-events:none;
}

.box2__color-select .color-select_btn .c_none.rock{
    opacity:0.3;
    pointer-events:none;
}
