@charset "UTF-8";

/*************************************************
【忍者式メールフォーム自作CSS】
自作CSSを使用するには、HTMLとCSSの知識が必須です。
HTMLやCSSについては参考文献などを参照してください。
*************************************************/

/*メールフォーム全体を囲っているタグのid*/
#aa-mail_top {
  position: absolute;
  right: 0; bottom: 10px;
  width: 200px;
  padding: 10px;
  border: 1px solid #555;
  border-radius: 10px;
  background-color: #fff;
  font-size: 14px;
}

/*メールフォームのパーツや送信ボタンを囲っているタグのclass（タイトル、説明文以外）*/
#aa-mail_top .main {
  padding: 10px;
}

/*メールフォームのタイトルを囲っているタグのclass*/
#aa-mail_top .title{
  padding: 5px;
  border-bottom: 1px solid #aaa;
  font-weight: bold;
}

/*メールフォームの説明文を囲っているタグのclass*/
#aa-mail_top .explain {

}

/*『name』パーツの表示名と入力項目を囲っているタグのclass*/
#aa-mail_top .name_top {

}

/*『name』パーツの表示名を囲っているタグのclass（[ 名前 ]の部分）*/
#aa-mail_top .name_left{

}

/*『name』パーツの入力項目を囲っているタグのclass*/
#aa-mail_top .name_right {

}

/*『name』パーツの入力項目のclass（inputなどの部分）*/
#aa-mail_top .name_parts {

}

/*『textarea』パーツの表示名と入力項目を囲っているタグのclass*/
#aa-mail_top .textarea_top {

}

/*『textarea』パーツの表示名を囲っているタグのclass（[ メッセージ ]の部分）*/
#aa-mail_top .textarea_left{

}

/*『textarea』パーツの入力項目を囲っているタグのclass*/
#aa-mail_top .textarea_right {

}

/*『textarea』パーツの入力項目のclass（inputなどの部分）*/
#aa-mail_top .textarea_parts {
  height: 4em;
}

/*メールフォームの送信ボタンを囲っているタグのclass*/
#aa-mail_top .submit {
  text-align: right;
}

/*メールフォームの送信ボタンのclass*/
#aa-mail_top .submit_button {
  border: 1px solid #000;
  background-color: #fcc;
  cursor: pointer;
}
#aa-mail_top .submit_button:hover {
  background-color: #fff;
}
#aa-mail_top .submit_button:active {
  background-color: #f88;
  color: #fff;
}

/*エラーメッセージを囲っているタグのclass*/
#aa-mail_top .error {

}

/*エラーメッセージのリトライボタンを囲っているタグのclass*/
#aa-mail_top .error_submit {

}

/*エラーメッセージのリトライボタンのclass*/
#aa-mail_top .error_submit_button {

}

/*送信完了メッセージを囲っているタグのclass*/
#aa-mail_top .result {

}

/*送信完了メッセージの戻るボタンを囲っているタグのclass*/
#aa-mail_top .result_submit {

}

/*送信完了メッセージの戻るボタンのclass*/
#aa-mail_top .result_submit_button {
  display: none;
}