@charset "utf-8";


/* ==================== タグ設定 ==================== */


#form h1 {
  margin: 0 0 10px 0;
  padding: 0;
  font-size: 136%;
  font-weight: bold;
}
#form p {
  margin: 0 0 20px 0;
  padding: 0;
  color: #000000;
  line-height: 1.5;
}
#form hr {
  height: 1px;
  margin: 20px 0 20px 0;
  _margin: 10px 0 20px 0;
  padding: 0;
  background: #CCCCCC;
  border: 0px none;
  clear: both;
}
/* フォーム関連 */
#form dl {
  margin: 20px 0;
  padding: 0;
  text-align: z;
}
#form dt {
  margin: 5px 0;
  font-size: 100%;
  font-weight: bold;
  color: #000000;
}
#form dt.error {
  color: #FF0000;
}
#form dd {
  margin: 0 0 20px 0;
  font-size: 100%;
  color: #000000;
}
#form dd table {
  border-collapse: collapse;
  border-spacing: 5;
  width: 100%;
  max-width: 600px;
}
#form dd th {
  padding: 5px;
  font-size: 100%;
  color: #000000;
}
#form dd td {
  padding: 5px;
  font-size: 100%;
}
#form table.confirm {
  margin-bottom: 20px;
  border-collapse: collapse;
  border-spacing: 5;
  border-top: #CCCCCC solid 1px;
  border-left: #CCCCCC solid 1px;
}
#form table.confirm th {
  padding: 15px 10px;
  font-size: 100%;
  font-weight: bold;
  text-align: left;
  color: #000000;
  background: #ffffff;
  border-bottom: #CCCCCC solid 1px;
  border-right: #CCCCCC solid 1px;
}
#form table.confirm td {
  padding: 15px 10px;
  font-size: 100%;
  color: #000000;
  background: #ffffff;
  border-bottom: #CCCCCC solid 1px;
  border-right: #CCCCCC solid 1px;
}
#form label {
  margin: 0;
}
/* 入力フィード関連 */
#form input {
  margin: 0 5px 5px 0;
  _margin: 0 5px 0 0;
}
#form *:first-child + html input {
  margin: 0 5px 0 0;
}
#form input.text {
  padding: 3px;
  border: #999999 solid 1px;
  /* width: 100%!important; */
}
#form input.text:focus {
  color: #000000;
  background: #FFFFCC;
  border: #999999 solid 1px;
}
#form input.text-error {
  padding: 3px;
  color: #FF0000;
  border: #FF0000 solid 1px;
  background: #FFE0E0;
}
#form input.text-error:focus {
  padding: 3px;
  color: #000000;
  background: #FFFFCC;
  border: #999999 solid 1px;
}
#form textarea.error:focus {
  color: #000000;
  background: #FFFFCC;
  border: #999999 solid 1px;
}
#form textarea {
  margin: 0 5px 5px 0;
  _margin: 0 5px 0 0;
  padding: 3px;
  border: #999999 solid 1px;
  width: 100%!Important;
}
#form *:first-child + html textarea {
  margin: 0 5px 0 0;
}
#form textarea:focus {
  color: #000000;
  background: #FFFFCC;
  border: #999999 solid 1px;
}
#form textarea.error {
  color: #FF0000;
  border: #FF0000 solid 1px;
  background: #FFE0E0;
}
#form textarea.error:focus {
  color: #000000;
  background: #FFFFCC;
  border: #999999 solid 1px;
}
#form select {
  margin: 0 5px 5px 0;
  _margin: 0 5px 0 0;
}
#form *:first-child + html select {
  margin: 0 5px 0 0;
}
#form option {
  padding-right: 10px;
}
#form button {
  margin: 0 5px 5px 0;
  padding: 3px;
}
/* フォント関連 */
#form .font-size-s {
  font-size: 85%;
}
#form .font-size-m {
  font-size: 100%;
}
#form .font-size-l {
  font-size: 122%;
}
#form .font-color-red {
  color: #FF0000;
}
#form .font-color-blue {
  color: #0066CC;
}
#form .font-color-green {
  color: #009933;
}
#form .font-color-gray {
  color: #666666;
}
#form strong {
  font-weight: bold;
}
#form .align-center {
  text-align: center;
}
#form .align-left {
  text-align: left;
}
#form .align-right {
  text-align: right;
}
/* ==================== レイアウト設定 ==================== */
#form #container {
  width: 80%;
  margin: 40px auto;
  padding: 0;
  font-size: 100%;
  text-align: left;
  position: relative;
}
#form #header {
  margin: 0 auto;
  padding: 20px;
  clear: both;
}
#form #contents {
  margin: 0 auto;
  padding: 40px 40px;
  background: #ffffff;
  border: #CCCCCC solid 1px;
  clear: both;
}
#form #footer {
  margin: 0 auto;
  padding: 20px 0;
  color: #000000;
  clear: both;
}
#form #ad {
  margin: 10px auto;
  padding: 10px 0;
  text-align: center;
  background: #FFFFFF;
  clear: both;
}
#form #ad a {
  color: #555555;
}
#form #ad hr {
  height: 1px;
  margin: 10px 0;
  _margin: 0px 0 10px 0;
  padding: 0;
  background: #DDDDDD;
  border: 0px none;
  clear: both;
}
#form #powered {
  width: 161px;
  height: 0px;
  margin: 0 auto;
  padding-top: 22px;
  background: url(../../images/powered-by-formmailer.gif) no-repeat;
  display: block;
  overflow: hidden;
}
/* ==================== システムメッセージ ==================== */
#form #alert {
  width: 100%;
  height: 40px;
  margin: 0 0 20px 0;
  text-align: center;
  font-weight: bold;
  color: #FF0000;
  line-height: 40px;
  background: #FFFFFF;
  clear: both;
}
/* ==================== テンプレート設定 ==================== */
#form #header h1 {
  color: #000000;
}
#form #contents h1, #TB_ajaxWindowTitle h1 {
  color: #000000;
  text-align: center;
}
#form #description {
  padding-bottom: 20px;
  font-size: 100%;
  line-height: 1.5;
  color: #000000;
}
#form #complete {
  padding: 20px 0;
  font-size: 100%;
  line-height: 1.5;
}
#form .space {
  margin: 0 0 10px 0;
}
#form .required {
  margin: 0 5px 0 0;
  font-size: 122%;
  color: #ff0000;
  font-weight: bold;
}
#form div.error {
  margin: 10px 0;
  font-size: 100%;
  color: #FF0000;
  line-height: 1.3;
}
#form .label {
  margin: 0 5px 0 0;
  font-size: 100%;
  color: #000000;
}
#form .notes {
  margin: 10px 0 0 0;
  font-size: 93%;
  color: #000000;
  line-height: 1.3;
}
/* 注文フォーム */
#form #box-order {}
#form #box-order .comment-header {
  margin: 0 0 10px 0;
  font-size: 100%;
  line-height: 2;
  clear: both;
  color: #000000;
}
#form #box-order .comment-footer {
  margin: 10px 0 0 0;
  font-size: 100%;
  line-height: 2;
  clear: both;
  color: #000000;
}
#form #box-order table {
  margin: 0 0 20px 0;
  border-collapse: collapse;
  border-spacing: 5;
  background: #ffffff;
  border-top: #CCCCCC solid 1px;
  border-left: #CCCCCC solid 1px;
  border-right: #CCCCCC solid 1px;
}
#form #box-order table th {
  padding: 10px;
  font-size: 100%;
  font-weight: bold;
  color: #000000;
  vertical-align: top;
  border-bottom: #CCCCCC solid 1px;
}
#form #box-order table td {
  padding: 10px;
  font-size: 100%;
  color: #000000;
  border-bottom: #CCCCCC solid 1px;
}
#form #box-order table.settle {
  border-collapse: collapse;
  border-spacing: 5;
  border: none;
  background: none;
}
#form #box-order table.settle th {
  padding: 10px;
  font-size: 100%;
  font-weight: bold;
  text-align: right;
  color: #000000;
  vertical-align: top;
  border-bottom: #CCCCCC solid 1px;
}
#form #box-order table.settle td {
  padding: 10px;
  font-size: 100%;
  text-align: right;
  border-bottom: #CCCCCC solid 1px;
}
/* thickbox設定 */
#form #TB_window {
  border: #000000 solid 3px;
}
#form #TB_ajaxWindowTitle {
  background: #FFFFFF;
}
#form #TB_ajaxContent {
  color: #000000;
  background: #FFFFFF;
}
#form #TB_closeAjaxWindow {
  color: #000000;
  background: #FFFFFF;
}
/* 入力補助設定 */
#form input.required_field, textarea.required_field, tr.required_field, td.required_field {
  background: #FFDDDD;
  border: #FF9999 solid 1px;
}
#form select.required_field {
  background: #FFDDDD;
}
#form ul {
  margin: 0;
  padding: 0;
  display: block;
}
#form ul strong {
  display: block;
}
#form ul li {
  padding: .5em 0;
  display: block;
}
#form #container {
  width: 75% !important;
  padding: 0 40px;
}
@media screen and (max-width: 767px) {
  #form #container {
    width: 100% !important;
    padding: 0px;
  }
  #form #contents{
    padding: 20px 20px;
  }
  #form label{
    display:block;
  }
  #form input.text{
    width: 100%!important;
  }
}

/* ボタン装飾 */

#form input#submit{
  margin: 20px 5px 5px 0px;
  _margin: 0 5px 0 0;
  background: #000;
  color: #FFF;
  padding: 10px 20px;
  min-width: 250px;
  border-radius: 50px;  
}