var.myName{ font:inherit; }

/* ▼フォーム用css（自分で編集する場合は以下全削除） */

@media screen{

form.changeName, form.changeName fieldset,
form.changeName ul, form.changeName li
{
	margin: 0; padding: 0; border: none; background: none;
	font-weight: normal; font-style: normal; box-sizing: border-box;
}

form.changeName legend{ display: none; }
form.changeName p{ display: none; }
form.changeName ul,
form.changeName li{ margin:0; padding: 0;  list-style:none; }
form.changeName input,
form.changeName select{ vartical-align: middle; }
form.changeName .process input{ margin: 0 .2em 0 0; cursor: pointer; }

/* 縦並び */
form.changeName ul{ display:flex; flex-wrap:wrap; flex-direction:column;
	justify-content:space-between; /* 変換フォーム左寄せ【flex-start】 / 中央【center】 / 右寄せ【flex-end】/等間隔【space-between】 */ }
form.changeName li{ margin:.2em 0; 
	display:flex; /* 入力フォームを項目名の横幅分を除いて幅いっぱいにするなら */
}
form.changeName li label{ min-width: 5em; /* 項目名の幅をそろえるなら */
	padding-right:.25em; display:inline-block; /* 項目名を消す場合は【display:none;】 */ 
}
form.changeName li input[type="text"],
form.changeName li select{ flex-grow:1; /* 入力フォームを幅いっぱいにするなら */ }
form.changeName ul.process{ margin-top: .32em; flex-direction:row; /* 登録削除横並び */
	justify-content:center; /* 登録削除左寄せ【flex-start】 / 中央【center】 / 右寄せ【flex-end】 */
}

/* 表示の順番を変える。orderの数値を並べたい順に */
form.changeName ul:not([class]) li:nth-of-type(1) { order: 1; }
form.changeName ul:not([class]) li:nth-of-type(2) { order: 2; }
form.changeName ul:not([class]) li:nth-of-type(3) { order: 3; }
form.changeName ul:not([class]) li:nth-of-type(4) { order: 4; }
form.changeName ul:not([class]) li:nth-of-type(5) { order: 5; }
}