@charset 'UTF-8';

html{ font-size:ajust:100%; line-height:1.55; margin:1em 2vw; }
body{ margin:0; padding:0; }

/* 変換フォーム用 */

form.changeName, form.changeName fieldset,
form.changeName ul, form.changeName li,form.changeName p
{
	margin: 0; padding: 0; border: none; background: none;
	font-weight: normal; font-style: normal; box-sizing: border-box; 
}
form.changeName input,
form.changeName select{ vertical-align: middle; font-size: 100%; max-width: 100%; box-sizing: border-box; }
form.changeName label{ display:none; },
form.changeName select,
form.changeName .process input{ cursor: pointer; }
form.changeName .process input[type="radio"]{ margin:0; }
p+fieldset{ margin-top:1rem; }

form.changeName
{
	width: max-content; max-width: 100%;
	margin: 1em auto; padding:10px;
	border:1px solid #000; border-radius:10px; 
}

form.changeName legend{ display:none; }
form.changeName p.dream-noCookie{ margin-bottom: 1em; font-size: small; }
form.changeName ul{ list-style:none; margin:0; }

/* 入力・選択フォームレイアウト */
form.changeName ul:not([class]){
	display: flex; 
	flex-wrap: wrap;
	flex-direction: column; /* row:横並び column:縦並び */
	justify-content: flex-start; /* flex-start:左寄せ center:真ん中 flex-end:右寄せ */
	gap: 5px; /* 要素間のスペ―ス*/
	margin: 1em 0;
}

/* 項目ラベル */
form.changeName ul:not([class]) label{ 
	min-width: 7em;
	font-size:82%; 
	text-align: left; 
}

/* 入力・選択フォーム */
form.changeName ul:not([class]) input,
form.changeName ul:not([class]) select{ 
	width: 100%;
	min-width: 15em;
}

/* 項目ラベルとフォームのレイアウト */
form.changeName ul:not([class])>li{ 
	display: flex;
	flex-direction: column; /* row:[項目][フォーム] column:[項目]の下に[フォーム] column-reverse:[フォーム]の下に[項目] */
	align-items:  start; /* center:rowにした場合のおすすめ start/end: column時の位置揃え */
	gap: 0 5px;
}

/* 登録削除実行のレイアウト */
form.changeName .process
{
	display: flex;
	flex-wrap: wrap;
	flex-direction: row; /* row:横並び column:縦並び */
	justify-content: center; /* flex-start:左寄せ center:真ん中 flex-end:右寄せ */
	align-items: center;
	gap: 5px;
}
form.changeName .process>li:first-child{ order: 1; }/* 登録を後（右側or下側）に */

/* 登録実行ボタン */
form.changeName .process input[type="submit"]{ }
