@charset "EUC-JP";
@import url(https://fonts.googleapis.com/earlyaccess/sawarabigothic.css);

/************************************************/
/*        フォームメール用スタイルシート        */
/************************************************/

/* ------ reset ------ */
html{color:#000;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}
fieldset,img{border:0}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}
ol,ul{list-style:none}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}
q:before,q:after{content:''}
abbr,acronym{border:0;font-variant:normal}
sup{vertical-align:text-top}
sub{vertical-align:text-bottom}
input,textarea,select{font-family:inherit;font-weight:inherit;*font-size:100%}
legend{color:#000}
#yui3-css-stamp.cssreset{display:none}

* {
  -o-box-sizing: border-box; 
  -ms-box-sizing: border-box; 
  box-sizing: border-box;
}
*:focus { 
  outline: 0; 
  outline: none;
}

/* ------ 基本設定 ------ */
html {
  font-size: 62.5%;
}
body {
  width: 100%;
  height: 100%;
  font-family: 'Sawarabi Gothic', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 1.4rem;
  color: #231815;
  -webkit-text-size-adjust: 100%;
  line-height: 1.8;
  background: none;
}

/* ------ フォームメールオリジナル ------ */
.title {     /* タイトル文字 */
  border: 1px solid #362200;
  text-align: center;
}
.msg_head {  /* ヘッダーメッセージ */
  padding-bottom: 15px;
}
.msg_foot {  /* フッターメッセージ */
  padding-top: 15px;
}
.errmsg, .red {    /* エラーメッセージ */
  color: #B30051;
}
.input td strong {
  text-decoration: underline;
  font-weight: bold;
}
hr + .errmsg {
  font-size: 1.6rem;
  color: #000;
  padding-bottom: .5em;
}
hr {
  border: none;
  border-top: 1px solid #362200;
}

p.list, .list li {
  position: relative;
  padding-left: 1.3em;
}
p.list::before, .list li::before {
  position: absolute;
  top: 0;
  left: 0;
  content: '・';
}
p.list.kome::before, .list.kome li::before {
  content: '※';
}
.exam {
  font-style: italic;
  color: #888;
}
table.input {
  width: 100%;
  border: none;
  border-top: 1px solid #362200;
  font-size: 1.4rem;
}
table.input tr {
  border-bottom: 1px solid #362200;
}
table.input th, table.input td {
  border: none;
  line-height: 1.6;
}
table.input th {
  font-size: 1.5rem;
}
table.input th.hissu::after {
  content: '必須';
  display: inline-block;
  background: #B30051;
  color: #fff;
  font-size: 1.1rem;
  line-height: 1;
  padding: 3px 5px 4px;
  margin-left: 5px;
}
table.input td p + p {
  padding-bottom: 5px;
}
table.input input,
table.input textarea,
table.input select {
  display: block;
  width: 100%;
  font-size: 1.4rem;
  padding: 5px;
  margin: 5px 0;
}
.submit input[type="submit"] {
  font-size: 1.8rem;
  display: block;
  width: 100%;
  padding: 10px;
  margin: 5px 0;
}

/* validationEngine */
.formError + * {
  border: 1px solid #D90000;
  background: #FBE5E5;
}

@media only screen and (max-width: 768px) {
  .pc {display:none;}
  .title {
    font-size: 1.7rem;
    margin-bottom: 10px;
  }
  table.input, table.input tr {
    display: block;
  }
  table.input th, table.input td {
    display: block;
    padding: 10px 5px;
    width: 100%;
    min-width: 300px;
  }
  table.input th {
    background: #362200;
    color: #fff;
    padding: 5px;
    text-align: center;
  }
  table.input td:last-child {
    padding-bottom: 15px;
  }
  .submit input[type="submit"] {
    margin-top: 15px;
  }
  
  
}
@media only screen and (min-width: 769px), print {
  .sp {display:none;}
  .title {
    font-size: 2.4rem;
    margin-bottom: 30px;
  }
  .msg_head, .msg_foot {
    text-align: center;
  }
  table.input th, table.input td {
    padding: 10px 15px;
  }
  table.input th {
    white-space: nowrap;
  }
  table.input input[type="text"],
  table.input input[type="tel"],
  table.input input[type="email"],
  table.input input[type="datetime-local"] {
    width: 400px;
  }
  table.input input[type="datetime-local"] {
    display: inline-block;
  }
  table.input textarea {
    height: 100px;
  }
  table.input select {
    display: inline-block;
    width: auto;
  }
  table.input input[type="tel"]#zip {
    width: 100px;
  }
  .submit input[type="submit"] {
    width: 300px;
    margin: 30px auto;
  }
  
  p.pc_inline {
    display: inline-block;
    width: 12em;
  }
  p.pc_inline + * {
    display: inline-block !important;
  }
  
  
  
}