結果を表示する
元にもどす
<html> <meta charset="utf-8"> <style> .コンテナ_1{display:grid; position:fixed; top:80px; left:100px; margin:0; height:480px; width:960px; padding:20px; border:solid 1px silver; background-color:#f8f8f8; grid-template-columns:160px 160px 160px 160px 160px 160px; grid-template-rows:40px 100px 100px 100px 100px 40px; grid-template-areas:"T_1 T_1 T_1 T_1 T_1 T_1" "ボックス_1 ボックス_2 ボックス_3 ボックス_4 ボックス_5 ボックス_6" "ボックス_7 ボックス_8 ボックス_9 ボックス_10 ボックス_11 ボックス_12" "ボックス_13 ボックス_14 ボックス_15 ボックス_16 ボックス_17 ボックス_18" "ボックス_19 ボックス_20 ボックス_21 ボックス_22 ボックス_23 ボックス_24" "B_1 B_1 B_1 B_1 B_1 B_1"; border-radius:10px;} .ボックス_トップ{grid-area:T_1; text-align:center; font-size:18px; font-weight:bold; padding-top:6px; border-top:solid 1px black; border-right:solid 1px black; border-bottom:none; border-left:solid 1px black; background-color:white; border-radius:10px 10px 0 0;} .ボックス_1{grid-area:ボックス_1; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_2{grid-area:ボックス_2; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_3{grid-area:ボックス_3; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_4{grid-area:ボックス_4; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_5{grid-area:ボックス_5; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_6{grid-area:ボックス_6; border-top:solid 1px black; border-right:solid 1px black; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_7{grid-area:ボックス_7; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_8{grid-area:ボックス_8; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_9{grid-area:ボックス_9; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_10{grid-area:ボックス_10; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_11{grid-area:ボックス_11; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_12{grid-area:ボックス_12; border-top:solid 1px black; border-right:solid 1px black; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_13{grid-area:ボックス_13; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_14{grid-area:ボックス_14; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_15{grid-area:ボックス_15; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_16{grid-area:ボックス_16; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_17{grid-area:ボックス_17; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_18{grid-area:ボックス_18; border-top:solid 1px black; border-right:solid 1px black; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_19{grid-area:ボックス_19; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_20{grid-area:ボックス_20; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_21{grid-area:ボックス_21; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_22{grid-area:ボックス_22; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_23{grid-area:ボックス_23; border-top:solid 1px black; border-right:none; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_24{grid-area:ボックス_24; border-top:solid 1px black; border-right:solid 1px black; border-bottom:none; border-left:solid 1px black; background-color:white;} .ボックス_ボトム{grid-area:B_1; text-align:center; font-family:"Arial Black"; font-size:14px; font-weight:bold; padding-top:12px; border-top:solid 1px black; border-right:solid 1px black; border-bottom:solid 1px black; border-left:solid 1px black; background-color:white; border-radius:0 0 10px 10px;} .コンポーネント_1{position:fixed; top:170px; left:176px;} .センター_ポイント_1{position:absolute; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_1::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_1{position:relative; top:22; left:4px; height:10px; width:4px; background-color:black; transform:rotate(-120deg);} .コンポーネント_2{position:fixed; top:170px; left:336px;} .センター_ポイント_2{position:absolute; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_2::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_2{position:relative; top:8; left:4px; height:10px; width:4px; background-color:black; transform:rotate(-60deg);} .コンポーネント_3{position:fixed; top:170px; left:498px;} .センター_ポイント_3{position:absolute; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_3::before{content:""; position:absolute; top:15; left:15; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_3{position:relative; top:-1; left:18px; height:10px; width:4px; background-color:black;} .コンポーネント_4{position:fixed; top:170px; left:660px;} .センター_ポイント_4{position:absolute; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_4::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_4{position:relative; top:8; left:32px; height:10px; width:4px; background-color:black; transform:rotate(60deg);} .コンポーネント_5{position:fixed; top:170px; left:818px;} .センター_ポイント_5{position:absolute; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_5::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_5{position:relative; top:22; left:32px; height:10px; width:4px; background-color:black; transform:rotate(120deg);} .コンポーネント_6{position:fixed; top:170px; left:976px;} .センター_ポイント_6{position:absolute; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_6::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_6{position:relative; top:31; left:18px; height:10px; width:4px; background-color:black;} .コンポーネント_7{position:fixed; top:244px; left:146px;} .ボリューム_メモリ_7{position:absolute; top:0; left:0;} .ボリューム_メモリ_サークル_7{position:absolute; top:12px; left:14px; height:80px; width:80px; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_7>div{position:absolute; top:7px; left:40px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_7>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_7 div:nth-child(1){transform:rotate(30deg);} .ボリューム_メモリ_ダイアル_7 div:nth-child(2){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_7 div:nth-child(3){transform:rotate(90deg);} .ボリューム_メモリ_ダイアル_7 div:nth-child(4){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_7 div:nth-child(5){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_7 div:nth-child(6){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_7 div:nth-child(7){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_7 div:nth-child(8){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_7 div:nth-child(9){transform:rotate(270deg);} .ボリューム_メモリ_ダイアル_7 div:nth-child(10){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_7 div:nth-child(11){transform:rotate(330deg);} .ボリューム_メモリ_ダイアル_7 div:nth-child(12){transform:rotate(360deg);} .センター_ポイント_7{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_7::before{position:absolute; content:""; top:16px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_7>div{position:absolute; top:24; left:5px; height:10px; width:4px; background-color:black; transform:rotate(-120deg);} .コンポーネント_8{position:fixed; top:244px; left:304px;} .ボリューム_メモリ_8{position:absolute; top:0; left:0;} .ボリューム_メモリ_サークル_8{position:absolute; top:12px; left:14px; height:80px; width:80px; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_8>div{position:absolute; top:7px; left:40px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_8>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_8 div:nth-child(1){transform:rotate(30deg);} .ボリューム_メモリ_ダイアル_8 div:nth-child(2){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_8 div:nth-child(3){transform:rotate(90deg);} .ボリューム_メモリ_ダイアル_8 div:nth-child(4){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_8 div:nth-child(5){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_8 div:nth-child(6){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_8 div:nth-child(7){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_8 div:nth-child(8){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_8 div:nth-child(9){transform:rotate(270deg);} .ボリューム_メモリ_ダイアル_8 div:nth-child(10){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_8 div:nth-child(11){transform:rotate(330deg);} .ボリューム_メモリ_ダイアル_8 div:nth-child(12){transform:rotate(360deg);} .センター_ポイント_8{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_8::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_8>div{position:absolute; top:8; left:4px; height:10px; width:4px; background-color:black; transform:rotate(-60deg);} .コンポーネント_9{position:fixed; top:244px; left:464px;} .ボリューム_メモリ_9{position:absolute; top:0; left:0;} .ボリューム_メモリ_サークル_9{position:absolute; top:12px; left:14px; height:80px; width:80px; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_9>div{position:absolute; top:6px; left:40px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_9>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_9 div:nth-child(1){transform:rotate(30deg);} .ボリューム_メモリ_ダイアル_9 div:nth-child(2){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_9 div:nth-child(3){transform:rotate(90deg);} .ボリューム_メモリ_ダイアル_9 div:nth-child(4){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_9 div:nth-child(5){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_9 div:nth-child(6){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_9 div:nth-child(7){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_9 div:nth-child(8){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_9 div:nth-child(9){transform:rotate(270deg);} .ボリューム_メモリ_ダイアル_9 div:nth-child(10){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_9 div:nth-child(11){transform:rotate(330deg);} .ボリューム_メモリ_ダイアル_9 div:nth-child(12){transform:rotate(360deg);} .センター_ポイント_9{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_9::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_9>div{position:absolute; top:-1px; left:18px; height:10px; width:4px; background-color:black;} .コンポーネント_10{position:fixed; top:244px; left:624px;} .ボリューム_メモリ_10{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_10{position:absolute; top:12px; left:14px; height:80px; width:80px; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_10>div{position:absolute; top:7px; left:40px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_10>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_10 div:nth-child(1){transform:rotate(30deg);} .ボリューム_メモリ_ダイアル_10 div:nth-child(2){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_10 div:nth-child(3){transform:rotate(90deg);} .ボリューム_メモリ_ダイアル_10 div:nth-child(4){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_10 div:nth-child(5){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_10 div:nth-child(6){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_10 div:nth-child(7){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_10 div:nth-child(8){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_10 div:nth-child(9){transform:rotate(270deg);} .ボリューム_メモリ_ダイアル_10 div:nth-child(10){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_10 div:nth-child(11){transform:rotate(330deg);} .ボリューム_メモリ_ダイアル_10 div:nth-child(12){transform:rotate(360deg);} .センター_ポイント_10{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_10::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_10>div{position:absolute; top:7px; left:32px; height:10px; width:4px; background-color:black; transform:rotate(60deg);} .コンポーネント_11{position:fixed; top:244px; left:784px;} .ボリューム_メモリ_11{position:absolute; top:0; left:0;} .ボリューム_メモリ_サークル_11{position:absolute; top:12px; left:14px; height:80px; width:80px; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_11>div{position:absolute; top:7px; left:40px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_11>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_11 div:nth-child(1){transform:rotate(30deg);} .ボリューム_メモリ_ダイアル_11 div:nth-child(2){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_11 div:nth-child(3){transform:rotate(90deg);} .ボリューム_メモリ_ダイアル_11 div:nth-child(4){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_11 div:nth-child(5){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_11 div:nth-child(6){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_11 div:nth-child(7){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_11 div:nth-child(8){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_11 div:nth-child(9){transform:rotate(270deg);} .ボリューム_メモリ_ダイアル_11 div:nth-child(10){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_11 div:nth-child(11){transform:rotate(330deg);} .ボリューム_メモリ_ダイアル_11 div:nth-child(12){transform:rotate(360deg);} .センター_ポイント_11{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_11::before{position:absolute; content:""; top:16px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_11>div{position:absolute; top:24px; left:31px; height:10px; width:4px; background-color:black; transform:rotate(120deg);} .コンポーネント_12{position:fixed; top:240px; left:944px;} .ボリューム_メモリ_12{position:absolute; top:0; left:0;} .ボリューム_メモリ_サークル_12{position:absolute; top:12px; left:14px; height:80px; width:80px; border-radius:50%; background-color:#f8f8f8; border:solid 1px gray;} .ボリューム_メモリ_ダイアル_12>div{position:absolute; top:6px; left:39px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_12>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_12 div:nth-child(1){transform:rotate(30deg);} .ボリューム_メモリ_ダイアル_12 div:nth-child(2){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_12 div:nth-child(3){transform:rotate(90deg);} .ボリューム_メモリ_ダイアル_12 div:nth-child(4){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_12 div:nth-child(5){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_12 div:nth-child(6){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_12 div:nth-child(7){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_12 div:nth-child(8){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_12 div:nth-child(9){transform:rotate(270deg);} .ボリューム_メモリ_ダイアル_12 div:nth-child(10){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_12 div:nth-child(11){transform:rotate(330deg);} .ボリューム_メモリ_ダイアル_12 div:nth-child(12){transform:rotate(360deg);} .センター_ポイント_12{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_12::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_12>div{position:absolute; top:-1px; left:18px; height:10px; width:4px; background-color:black;} .コンポーネント_13{position:fixed; top:344px; left:146px;} .ボリューム_メモリ_13{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_13{position:absolute; top:18px; left:20; height:70px; width:70px; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_13>div{position:absolute; top:0; left:34px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_13>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_13 div:nth-child(1){transform:rotate(20deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(2){transform:rotate(40deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(3){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(4){transform:rotate(80deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(5){transform:rotate(100deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(6){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(7){transform:rotate(140deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(8){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(9){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(10){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(11){transform:rotate(220deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(12){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(13){transform:rotate(260deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(14){transform:rotate(280deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(15){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(16){transform:rotate(320deg);} .ボリューム_メモリ_ダイアル_13 div:nth-child(17){transform:rotate(340deg);} .センター_ポイント_13{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_13::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_13>div{position:absolute; top:27; left:8px; height:10px; width:4px; background-color:black; transform:rotate(-140deg);} .コンポーネント_14{position:fixed; top:344px; left:306px;} .ボリューム_メモリ_14{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_14{position:absolute; top:19px; left:20; height:70px; width:70px; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_14>div{position:absolute; top:0; left:34px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_14>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_14 div:nth-child(1){transform:rotate(20deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(2){transform:rotate(40deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(3){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(4){transform:rotate(80deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(5){transform:rotate(100deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(6){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(7){transform:rotate(140deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(8){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(9){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(10){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(11){transform:rotate(220deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(12){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(13){transform:rotate(260deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(14){transform:rotate(280deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(15){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(16){transform:rotate(320deg);} .ボリューム_メモリ_ダイアル_14 div:nth-child(17){transform:rotate(340deg);} .センター_ポイント_14{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_14::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_14>div{position:absolute; top:8; left:4px; height:10px; width:4px; background-color:black; transform:rotate(-60deg);} .コンポーネント_15{position:fixed; top:344px; left:466px;} .ボリューム_メモリ_15{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_15{position:absolute; top:18px; left:19; height:70px; width:70px; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_15>div{position:absolute; top:0; left:34px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_15>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_15 div:nth-child(1){transform:rotate(20deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(2){transform:rotate(40deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(3){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(4){transform:rotate(80deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(5){transform:rotate(100deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(6){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(7){transform:rotate(140deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(8){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(9){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(10){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(11){transform:rotate(220deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(12){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(13){transform:rotate(260deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(14){transform:rotate(280deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(15){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(16){transform:rotate(320deg);} .ボリューム_メモリ_ダイアル_15 div:nth-child(17){transform:rotate(340deg);} .センター_ポイント_15{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_15::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_15>div{position:absolute; top:-1; left:18px; height:10px; width:4px; background-color:black;} .コンポーネント_16{position:fixed; top:344px; left:626px;} .ボリューム_メモリ_16{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_16{position:absolute; top:19px; left:20; height:70px; width:70px; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_16>div{position:absolute; top:0; left:34px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_16>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_16 div:nth-child(1){transform:rotate(20deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(2){transform:rotate(40deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(3){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(4){transform:rotate(80deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(5){transform:rotate(100deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(6){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(7){transform:rotate(140deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(8){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(9){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(10){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(11){transform:rotate(220deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(12){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(13){transform:rotate(260deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(14){transform:rotate(280deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(15){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(16){transform:rotate(320deg);} .ボリューム_メモリ_ダイアル_16 div:nth-child(17){transform:rotate(340deg);} .センター_ポイント_16{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_16::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_16>div{position:absolute; top:8; left:32px; height:10px; width:4px; background-color:black; transform:rotate(60deg);} .コンポーネント_17{position:fixed; top:344px; left:786px;} .ボリューム_メモリ_17{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_17{position:absolute; top:18px; left:20; height:70px; width:70px; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_17>div{position:absolute; top:0; left:34px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_17>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_17 div:nth-child(1){transform:rotate(20deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(2){transform:rotate(40deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(3){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(4){transform:rotate(80deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(5){transform:rotate(100deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(6){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(7){transform:rotate(140deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(8){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(9){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(10){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(11){transform:rotate(220deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(12){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(13){transform:rotate(260deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(14){transform:rotate(280deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(15){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(16){transform:rotate(320deg);} .ボリューム_メモリ_ダイアル_17 div:nth-child(17){transform:rotate(340deg);} .センター_ポイント_17{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_17::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_17>div{position:absolute; top:27; left:28px; height:10px; width:4px; background-color:black; transform:rotate(140deg);} .コンポーネント_18{position:fixed; top:340px; left:946px;} .ボリューム_メモリ_18{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_18{position:absolute; top:18px; left:19; height:70px; width:70px; border-radius:50%; background-color:#f8f8f8; border:solid 1px gray;} .ボリューム_メモリ_ダイアル_18>div{position:absolute; top:0; left:34px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_18>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_18 div:nth-child(1){transform:rotate(20deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(2){transform:rotate(40deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(3){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(4){transform:rotate(80deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(5){transform:rotate(100deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(6){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(7){transform:rotate(140deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(8){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(9){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(10){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(11){transform:rotate(220deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(12){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(13){transform:rotate(260deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(14){transform:rotate(280deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(15){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(16){transform:rotate(320deg);} .ボリューム_メモリ_ダイアル_18 div:nth-child(17){transform:rotate(340deg);} .センター_ポイント_18{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_18::before{position:absolute; content:""; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_18>div{position:absolute; top:-1; left:18px; height:10px; width:4px; background-color:black;} .コンポーネント_19{position:fixed; top:450px; left:162px;} .エフェクト_ネーム_19{position:absolute; font-family:"arial"; width:100px; font-size:12px; color:black; font-weight:bold;} .ボリューム_メモリ_19{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_19{position:absolute; top:18px; left:22; height:70px; width:70px; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_19>div{position:absolute; top:0; left:32px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_19>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_19 div:nth-child(1){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_19 div:nth-child(2){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_19 div:nth-child(3){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_19 div:nth-child(4){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_19 div:nth-child(5){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_19 div:nth-child(6){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_19 div:nth-child(7){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_19 div:nth-child(8){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_19 div:nth-child(9){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_19 div:nth-child(10){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_19 div:nth-child(11){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_19 div:nth-child(12){transform:rotate(360deg);} .センター_ポイント_19{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_19::before{content:""; position:absolute; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_19>div{position:absolute; top:23; left:5px; height:10px; width:4px; background-color:black; transform:rotate(-120deg);} .コンポーネント_20{position:fixed; top:450px; left:322px;} .エフェクト_ネーム_20{position:absolute; font-family:"arial"; width:100px; font-size:12px; color:black; font-weight:bold;} .ボリューム_メモリ_20{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_20{position:absolute; top:18px; left:22; height:70px; width:70px; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_20>div{position:absolute; top:0; left:32px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_20>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_20 div:nth-child(1){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_20 div:nth-child(2){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_20 div:nth-child(3){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_20 div:nth-child(4){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_20 div:nth-child(5){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_20 div:nth-child(6){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_20 div:nth-child(7){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_20 div:nth-child(8){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_20 div:nth-child(9){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_20 div:nth-child(10){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_20 div:nth-child(11){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_20 div:nth-child(12){transform:rotate(360deg);} .センター_ポイント_20{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_20::before{content:""; position:absolute; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_20>div{position:absolute; top:7; left:4; height:10px; width:4px; background-color:black; transform:rotate(-60deg);} .コンポーネント_21{position:fixed; top:450px; left:482px;} .エフェクト_ネーム_21{position:absolute; font-family:"arial"; width:100px; font-size:12px; color:black; font-weight:bold;} .ボリューム_メモリ_21{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_21{position:absolute; height:70px; width:70px; top:18px; left:22; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_21>div{position:absolute; top:0; left:32px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_21>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_21 div:nth-child(1){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_21 div:nth-child(2){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_21 div:nth-child(3){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_21 div:nth-child(4){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_21 div:nth-child(5){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_21 div:nth-child(6){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_21 div:nth-child(7){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_21 div:nth-child(8){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_21 div:nth-child(9){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_21 div:nth-child(10){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_21 div:nth-child(11){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_21 div:nth-child(12){transform:rotate(360deg);} .センター_ポイント_21{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_21::before{content:""; position:absolute; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_21>div{position:absolute; top:-1; left:18px; height:10px; width:4px; background-color:black;} .コンポーネント_22{position:fixed; top:450px; left:642px;} .エフェクト_ネーム_22{position:absolute; font-family:"arial"; width:100px; font-size:12px; color:black; font-weight:bold;} .ボリューム_メモリ_22{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_22{position:absolute; height:70px; width:70px; top:18px; left:22; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_22>div{position:absolute; top:0; left:32px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_22>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_22 div:nth-child(1){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_22 div:nth-child(2){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_22 div:nth-child(3){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_22 div:nth-child(4){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_22 div:nth-child(5){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_22 div:nth-child(6){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_22 div:nth-child(7){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_22 div:nth-child(8){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_22 div:nth-child(9){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_22 div:nth-child(10){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_22 div:nth-child(11){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_22 div:nth-child(12){transform:rotate(360deg);} .センター_ポイント_22{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_22::before{content:""; position:absolute; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_22>div{position:absolute; top:8; left:32px; height:10px; width:4px; background-color:black; transform:rotate(60deg);} .コンポーネント_23{position:fixed; top:450px; left:802px;} .エフェクト_ネーム_23{position:absolute; font-family:"arial"; width:100px; font-size:12px; color:black; font-weight:bold;} .ボリューム_メモリ_23{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_23{position:absolute; height:70px; width:70px; top:18px; left:22; border-radius:50%; /* border:solid 1px red; */ border:hidden;} .ボリューム_メモリ_ダイアル_23>div{position:absolute; top:0; left:32px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_23>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:silver;} .ボリューム_メモリ_ダイアル_23 div:nth-child(1){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_23 div:nth-child(2){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_23 div:nth-child(3){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_23 div:nth-child(4){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_23 div:nth-child(5){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_23 div:nth-child(6){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_23 div:nth-child(7){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_23 div:nth-child(8){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_23 div:nth-child(9){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_23 div:nth-child(10){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_23 div:nth-child(11){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_23 div:nth-child(12){transform:rotate(360deg);} .センター_ポイント_23{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray;} .センター_ポイント_23::before{content:""; position:absolute; top:15px; left:15px; height:8px; width:8px; border:solid 1px black; border-radius:50%; background-color:silver;} .ダイアル_23>div{position:absolute; top:23; left:32px; height:10px; width:4px; background-color:black; transform:rotate(120deg);} .コンポーネント_24{position:fixed; top:446px; left:961px;} .エフェクト_ネーム_24{position:absolute; font-family:"arial"; width:100px; font-size:12px; color:black; font-weight:bold;} .ボリューム_メモリ_24{position:absolute; top:0px; left:0px;} .ボリューム_メモリ_サークル_24{position:absolute; top:18px; left:19; height:70px; width:70px; border-radius:50%; border:solid 1px silver; background-color:#f8f8f8;} .ボリューム_メモリ_ダイアル_24>div{position:absolute; top:0; left:34px; height:70px; width:2px; background-color:transparent;} .ボリューム_メモリ_ダイアル_24>div::before{position:absolute; content:""; top:0; left:0; height:8px; width:2px; background-color:black;} .ボリューム_メモリ_ダイアル_24 div:nth-child(1){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_24 div:nth-child(2){transform:rotate(60deg);} .ボリューム_メモリ_ダイアル_24 div:nth-child(3){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_24 div:nth-child(4){transform:rotate(120deg);} .ボリューム_メモリ_ダイアル_24 div:nth-child(5){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_24 div:nth-child(6){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_24 div:nth-child(7){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_24 div:nth-child(8){transform:rotate(240deg);} .ボリューム_メモリ_ダイアル_24 div:nth-child(9){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_24 div:nth-child(10){transform:rotate(300deg);} .ボリューム_メモリ_ダイアル_24 div:nth-child(11){transform:rotate(0deg);} .ボリューム_メモリ_ダイアル_24 div:nth-child(12){transform:rotate(360deg);} .センター_ポイント_24{position:relative; top:30px; left:32px; height:40px; width:40px; border-radius:50%; border:double 3px gray; background-color:gray;} .センター_ポイント_24::before{content:""; position:absolute; top:15px; left:15px; height:8px; width:8px; border:solid 1px white; border-radius:50%; background-color:silver;} .ダイアル_24>div{position:absolute; top:-2; left:18px; height:10px; width:4px; background-color:white;} </style> <div class="コンテナ_1"> <div class="ボックス_トップ">部品 : Volume / Effect</div> <div class="ボックス_1"> <div class="コンポーネント_1"> <div class="センター_ポイント_1"> <div class="ダイアル_1"> <div></div></div></div></div></div> <div class="ボックス_2"> <div class="コンポーネント_2"> <div class="センター_ポイント_2"> <div class="ダイアル_2"> <div></div></div></div></div></div> <div class="ボックス_3"> <div class="コンポーネント_3"> <div class="センター_ポイント_3"> <div class="ダイアル_3"> <div></div></div></div> </div></div><div class="ボックス_4"> <div class="コンポーネント_4"> <div class="センター_ポイント_4"> <div class="ダイアル_4"> <div></div></div></div></div></div> <div class="ボックス_5"> <div class="コンポーネント_5"> <div class="センター_ポイント_5"> <div class="ダイアル_5"> <div></div></div></div></div></div> <div class="ボックス_6"> <div class="コンポーネント_6"> <div class="センター_ポイント_6"> <div class="ダイアル_6"> <div></div></div></div></div></div> <div class="ボックス_7"> <div class="コンポーネント_7"> <div class="ボリューム_メモリ_7"> <div class="ボリューム_メモリ_サークル_7"> <div class="ボリューム_メモリ_ダイアル_7"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div> <div class="センター_ポイント_7"> <div class="ダイアル_7"> <div></div></div></div></div></div> <div class="ボックス_8"> <div class="コンポーネント_8"> <div class="ボリューム_メモリ_8"> <div class="ボリューム_メモリ_サークル_8"> <div class="ボリューム_メモリ_ダイアル_8"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div> <div class="センター_ポイント_8"> <div class="ダイアル_8"> <div></div></div></div></div></div> <div class="ボックス_9"> <div class="コンポーネント_9"> <div class="ボリューム_メモリ_9"> <div class="ボリューム_メモリ_サークル_9"> <div class="ボリューム_メモリ_ダイアル_9"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div> <div class="センター_ポイント_9"> <div class="ダイアル_9"> <div></div></div></div></div></div> <div class="ボックス_10"> <div class="コンポーネント_10"> <div class="ボリューム_メモリ_10"> <div class="ボリューム_メモリ_サークル_10"> <div class="ボリューム_メモリ_ダイアル_10"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div> <div class="センター_ポイント_10"> <div class="ダイアル_10"> <div></div></div></div></div></div> <div class="ボックス_11"><div class="コンポーネント_11"> <div class="ボリューム_メモリ_11"> <div class="ボリューム_メモリ_サークル_11"> <div class="ボリューム_メモリ_ダイアル_11"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div> <div class="センター_ポイント_11"> <div class="ダイアル_11"> <div></div></div></div></div></div> <div class="ボックス_12"> <div class="コンポーネント_12"> <div class="ボリューム_メモリ_12"> <div class="ボリューム_メモリ_サークル_12"> <div class="ボリューム_メモリ_ダイアル_12"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div> <div class="センター_ポイント_12"> <div class="ダイアル_12"> <div></div></div></div></div></div> <div class="ボックス_13"> <div class="コンポーネント_13"> <div class="ボリューム_メモリ_13"> <div class="ボリューム_メモリ_サークル_13"> <div class="ボリューム_メモリ_ダイアル_13"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div> <div class="センター_ポイント_13"> <div class="ダイアル_13"> <div></div></div></div></div></div> <div class="ボックス_14"> <div class="コンポーネント_14"> <div class="ボリューム_メモリ_14"> <div class="ボリューム_メモリ_サークル_14"> <div class="ボリューム_メモリ_ダイアル_14"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div> <div class="センター_ポイント_14"> <div class="ダイアル_14"> <div></div></div></div></div></div> <div class="ボックス_15"> <div class="コンポーネント_15"> <div class="ボリューム_メモリ_15"> <div class="ボリューム_メモリ_サークル_15"> <div class="ボリューム_メモリ_ダイアル_15"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div> <div class="センター_ポイント_15"> <div class="ダイアル_15"> <div></div></div></div></div></div> <div class="ボックス_16"> <div class="コンポーネント_16"> <div class="ボリューム_メモリ_16"> <div class="ボリューム_メモリ_サークル_16"> <div class="ボリューム_メモリ_ダイアル_16"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div> <div class="センター_ポイント_16"> <div class="ダイアル_16"> <div></div></div></div></div></div> <div class="ボックス_17"> <div class="コンポーネント_17"> <div class="ボリューム_メモリ_17"> <div class="ボリューム_メモリ_サークル_17"> <div class="ボリューム_メモリ_ダイアル_17"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div> <div class="センター_ポイント_17"> <div class="ダイアル_17"> <div></div></div></div></div></div> <div class="ボックス_18"> <div class="コンポーネント_18"> <div class="ボリューム_メモリ_18"> <div class="ボリューム_メモリ_サークル_18"> <div class="ボリューム_メモリ_ダイアル_18"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div> <div class="センター_ポイント_18"> <div class="ダイアル_18"> <div></div></div></div></div></div> <div class="ボックス_19"> <div class="コンポーネント_19"> <div class="エフェクト_ネーム_19"><span style="position:absolute;top:64px; left:-30px;">REV:Hall</span><span style="position:absolute;top:24px; left:-34px;">REV:Plate</span><span style="position:absolute;top:4; left:44px;">OFF</span><span style="position:absolute;top:26; left:88px;">CHO</span><span style="position:absolute;top:66; left:88px;">DEL</span> <div class="ボリューム_メモリ_19"> <div class="ボリューム_メモリ_サークル_19"> <div class="ボリューム_メモリ_ダイアル_19"> <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></div> <div class="センター_ポイント_19"> <div class="ダイアル_19"> <div></div></div></div></div></div> <div class="ボックス_20"> <div class="コンポーネント_20"> <div class="エフェクト_ネーム_20"><span style="position:absolute;top:64px; left:-30px;">REV:Hall</span><span style="position:absolute;top:24px; left:-34px;">REV:Plate</span><span style="position:absolute;top:4; left:44px;">OFF</span><span style="position:absolute;top:26; left:88px;">CHO</span><span style="position:absolute;top:66; left:88px;">DEL</span> <div class="ボリューム_メモリ_20"> <div class="ボリューム_メモリ_サークル_20"> <div class="ボリューム_メモリ_ダイアル_20"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></div> <div class="センター_ポイント_20"> <div class="ダイアル_20"> <div></div></div></div></div></div> <div class="ボックス_21"> <div class="コンポーネント_21"> <div class="エフェクト_ネーム_21"><span style="position:absolute;top:64px; left:-30px;">REV:Hall</span><span style="position:absolute;top:24px; left:-34px;">REV:Plate</span><span style="position:absolute;top:4; left:44px;">OFF</span><span style="position:absolute;top:26; left:88px;">CHO</span><span style="position:absolute;top:66; left:88px;">DEL</span> <div class="ボリューム_メモリ_21"> <div class="ボリューム_メモリ_サークル_21"> <div class="ボリューム_メモリ_ダイアル_21"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></div> <div class="センター_ポイント_21"> <div class="ダイアル_21"> <div></div></div></div></div></div> <div class="ボックス_22"> <div class="コンポーネント_22"> <div class="エフェクト_ネーム_22"><span style="position:absolute;top:64px; left:-30px;">REV:Hall</span><span style="position:absolute;top:24px; left:-34px;">REV:Plate</span><span style="position:absolute;top:4; left:44px;">OFF</span><span style="position:absolute;top:26; left:88px;">CHO</span><span style="position:absolute;top:66; left:88px;">DEL</span> <div class="ボリューム_メモリ_22"> <div class="ボリューム_メモリ_サークル_22"> <div class="ボリューム_メモリ_ダイアル_22"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></div> <div class="センター_ポイント_22"> <div class="ダイアル_22"> <div></div></div></div></div></div> <div class="ボックス_23"> <div class="コンポーネント_23"> <div class="エフェクト_ネーム_23"><span style="position:absolute;top:64px; left:-30px;">REV:Hall</span><span style="position:absolute;top:24px; left:-34px;">REV:Plate</span><span style="position:absolute;top:4; left:44px;">OFF</span><span style="position:absolute;top:26; left:88px;">CHO</span><span style="position:absolute;top:66; left:88px;">DEL</span> <div class="ボリューム_メモリ_23"> <div class="ボリューム_メモリ_サークル_23"> <div class="ボリューム_メモリ_ダイアル_23"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></div> <div class="センター_ポイント_23"> <div class="ダイアル_23"> <div></div></div></div></div></div> <div class="ボックス_24"> <div class="コンポーネント_24"> <div class="エフェクト_ネーム_24"><span style="position:absolute;top:64px; left:-30px;">REV:Hall</span><span style="position:absolute;top:24px; left:-34px;">REV:Plate</span><span style="position:absolute;top:4; left:44px;">OFF</span><span style="position:absolute;top:26; left:88px;">CHO</span><span style="position:absolute;top:66; left:88px;">DEL</span> <div class="ボリューム_メモリ_24"> <div class="ボリューム_メモリ_サークル_24"> <div class="ボリューム_メモリ_ダイアル_24"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></div> <div class="センター_ポイント_24"> <div class="ダイアル_24"> <div></div></div></div></div></div> <div class="ボックス_ボトム">SC-8.8</div> </div> </html>