#aaa {
  background-image: url("../../img/bg.png");
}

header a {
text-decoration: none;
color: #eee;
}


h1 {
background: linear-gradient(#333, #555);
color: #eee;
border-bottom: 2px solid #CBCBCB;
width: 100%;
height: 50px;
padding-left:3%;
line-height: 50px;
margin-top: 0px;
margin-bottom: 10px;
font-size: 20px;
}

h2 {
  font-size: 18px;
  font-weight: normal;
  margin: 0;
  border-bottom: solid 2px;
  border-color: #333;
  margin-left: 25px;
  margin-bottom: 5px;
}

#demo img {
width: 100%;
height: auto;
}

.op {
border: solid 2px;
border-color: #708090;
margin-bottom: 20px;
max-width: 400px;
max-height: 374px;
height: auto;
}

.upload img , #open2 img {
max-width: 100%;
max-height: 346px;
height: auto;
object-position: 50% 50% ;
object-fit: cover;
}

#open3 img, #open4 img {
padding-left: 10%;
padding-right: 10%;
max-width: 80%;
max-height: 348px;
height: auto;
object-position: 50% 50% ;
object-fit: cover;
}

select, .write input {
font-size: 16px;
}

.form {
  width: 100px;
  height: auto;
}

.upload input {
margin: 10px 2%;
}

.kesi input {
 width: 20px;
 height: 20px;
 vertical-align: middle;
 margin-top: 0;
}

#open_a {
border-bottom: dashed 1px;
}

.write {
  margin-bottom: 20px;
}

.write li {
    padding-left: 15px;
    list-style-type: square;
    margin-top: 25px;
}

.write select {
  margin-left: 15px;
  width: 60%;
  height: 30px;
}

.write input {
padding: 5px ;
margin: 2px 2%;
width: 70%;
}

.write h2 {
  margin-top: 30px;
}

#rank, #note_speed, #rating, #fc_hard, #fc_ex, #fc_sp ,#bandrank_pop,
#bandrank_aft, #bandrank_pas, #bandrank_ros, #bandrank_hal,#bandrank_mor,#bandrank_rai, #bandrank_ath,
#bandrat_pop, #bandrat_aft, #bandrat_pas, #bandrat_ros, #bandrat_hal,#bandrat_mor ,#bandrat_rai ,#bandrat_ath {
  width: 100px;
}


 #event_style ,#friend1 ,#friend2 ,#friend3 ,#multi_live1 ,#multi_live2 ,#friend ,#favoband_pop
,#favoband_aft ,#favoband_pas ,#favoband_ros ,#favoband_hal ,#favoband_mor ,#favoband_rai
,#favoun_a ,#favoun_b ,#favoun_c ,#favoun_d ,#favoun_e ,#favoun_f ,#favocha_1 ,#favocha_2
,#favocha_3 ,#favocha_4 ,#favocha_5 ,#favocha_6 ,#favocha_7 ,#favocha_8 ,#favocha_9 ,#favocha_10
,#favocha_11 ,#favocha_12 ,#favocha_13 ,#favocha_14 ,#favocha_15 ,#favocha_16 ,#favocha_17
,#favocha_18 ,#favocha_19 ,#favocha_20 ,#favocha_21 ,#favocha_22 ,#favocha_23 ,#favocha_24
,#favocha_25 ,#favocha_26 ,#favoband_hap ,#favoband_PP ,#favoband_PM ,#favoband_mer ,#favoband_ron
,#favoband_LL ,#mode ,#auto_1 ,#auto_2 ,#auto_3 ,#Spin_as {
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 3px;
}


#canvas {
  max-width: 100%;
  height: auto;
}

#result {
  padding-left: 15px;
}