@charset "utf-8";

/* CSS Document */

/*******************************************************************************

  共通

*******************************************************************************/
body,button,input,textarea,select {
  font-family: -apple-system, BlinkMacSystemFont,'メイリオ', Meiryo,"Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",'Arial','ＭＳ Ｐゴシック','MS PGothic';
}
body {
  border-top: 4px solid #183763;
}
.forSP {
  display: none;
}

/* smartPhone */
@media screen and (max-width: 640px) {
.forSP {
  display: inline-block;
}
.forPC {
  display: none !important;
}
}
@media screen and (max-width: 320px) {
html {
    overflow-y: scroll !important;
}
}

/*******************************************************************************

  ヘッダー

*******************************************************************************/
header {
  text-align: center;
  padding: 1em 0;
}
header img {
width:300px;
}

/*******************************************************************************

  フッター

*******************************************************************************/
footer {
  background: #204b89;
  color: #FFF;
  text-align: center;
  font-size: 80%;
  padding: 0.8em 0;
  margin-top: 8em;
}


/*******************************************************************************

  コンテンツ

*******************************************************************************/
#Contents {
  max-width: 720px;
  margin: 0 auto;
}
#Contents h1 {
  background: #366db0;
  border: 2px solid #FFF;
  box-shadow: 1px 1px 1px 2px #DDD;
  color: #FFF;
  font-size: 150%;
  text-align: center;
  padding: 1em;
  line-height: 1.5;
  margin-bottom: 1em;
}
#Contents .Read p {
  margin-bottom: 0.5em;
  line-height: 1.5;
}

#Contents div.agency,
#Contents div.client,
#Contents div.post,
#Contents div.privacy {
  margin-top: 2em;
  overflow: hidden;
}
#Contents h2 {
  border: 1px solid #e8e8e8;
  border-left: 2px solid #1559af;
  box-shadow: 0 0 0 1px #FFF inset;
  background: linear-gradient(0deg, #FFF, #f1f1f1);
  color: #1559af;
  font-size: 124%;
  padding: 0.8em 0 0.8em 0.5em;
  margin-bottom: 1em;
}

#Contents .form table {
  text-align: left;
  width: 100%;
}
#Contents .form table th {
  width: 14em;
  padding: 1em;
  background-color: #F9F9F9;
  border: 1px solid #DDD;
  text-align: left;
}
#Contents .form table th span {
  width: 5em;
  text-align: center;
  color: #F30;
  background: #fee7ea;
  border: 1px dotted #F30;
  font-size: 80%;
  display: inline-block;
  padding: 0.3em 0 0.4em;
  float: right;
}
#Contents .form table td {
  padding: 1em;
  border: 1px solid #DDD;
}
#Contents .form table td .error {
  color: #F50;
  font-size: 80%;
  line-height: 1.5;
  background:#FDFDEE;
  border-left: 2px solid #F50;
  margin-top: 1em;
  padding: 0.5em 0 0.5em 1em;
}
#Contents .privacy {
  border-top: 2px solid #DDD;
  padding-top: 1em;
  margin-top: 5em !important;
}
#Contents .privacy p {
  text-align: center;
  line-height: 1.5;
}
#Contents .privacy .iframe {
  width:100%;
  height:250px;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  display: inline-block;
  margin: 1em 0;
}
#Contents .privacy .iframe iframe {
  width:100%;
  height:100%;
  border:none;
  display:block;
}
#Contents .privacy .button {
  margin-top: 1em;
}
#Contents .privacy .button input[type="submit"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  background: transparent;
  background: linear-gradient(0deg, #0585ca, #2caaed);
  color: #FFF;
  font-weight: bold;
  font-size: 124%;
  padding: 0.5em 1em;
  border-radius: 6px;
  border: 1px solid #0585ca;
  box-shadow: 0 1px 0 0 #94d4f6 inset;
  cursor: pointer;
}
#Contents .privacy .button input[type="submit"]:hover {
  background: linear-gradient(0deg, #0265b5, #1a8de4);
  border:1px solid #0265b5;
}
#Contents .privacy .button input[type="submit"][disabled] {
	cursor: not-allowed;
}
#Contents .privacy .button input[type="submit"]:disabled {
  background: #666;
  border: 1px solid #333;
  box-shadow: 0 1px 0 0 #999 inset;
  cursor: default;
}
#Contents .privacy .button input[type="submit"].repost {
  background: linear-gradient(0deg, #193c80, #164ab0);
  border: 1px solid #001f6f;
  box-shadow: 0 1px 0 0 #1b6aae inset;
}
#Contents .privacy .button input[type="submit"].repost:hover {
  background: linear-gradient(0deg, #0c275b, #153675);
  border: 1px solid #0c275b;
}
#Contents .textBig {
  text-align: center;
  font-weight: bold;
  font-size: 200%;
}
/* smartPhone */
@media screen and (max-width: 640px) {
#Contents {
  margin: 0 5%;
}
#Contents .form table th,
#Contents .form table td {
  width: 100%;
  display: block;
}
#Contents .form table td {
  margin-bottom: 1em;
}
#Contents .privacy iframe {
  height: 10em !important;
}
#Contents .privacy .button input[type="submit"] {
  width: 12em;
}
#Contents .privacy .button:last-child input[type="submit"]{
  margin-top: 1em !important;
}
}


/*******************************************************************************

  フォーム

*******************************************************************************/
input[type="text"], 
input[type="password"], 
input[type="tel"], 
input[type="email"], 
input[type="number"], 
textarea, 
select {
    outline: none;
    font-size: 100%;
}

/* テキストフィールド
---------------------------------------------------------------------------------------------------------------*/
.form input[type="text"],
.form input[type="tel"],
.form input[type="email"],
.form input[type="number"],
.form textarea {
  border-radius: 5px;
  background-color: #FFF;
  border: solid 1px #a4b3b7;
  padding: 0.5em 0.5em;
  color: #1c2e36;
  -webkit-appearance: none;
  box-shadow: 1px 1px 3px 0 #DDD inset;
  width: 60%;
}
.form textarea {
  width: 100%;
}
.form input[type="text"]:focus,
.form input[type="password"]:focus,
.form input[type="tel"]:focus,
.form input[type="email"]:focus,
.form input[type="number"]:focus,
.form textarea:focus {
  color: #1559af;
}
.form input[type="text"]::placeholder,
.form input[type="password"]::placeholder,
.form input[type="tel"]::placeholder,
.form input[type="email"]::placeholder,
.form input[type="number"]::placeholder,
.form textarea::placeholder {
  color: #a4b3b7;
}
.form input[type="text"]:-ms-input-placeholder,
.form input[type="password"]:-ms-input-placeholder,
.form input[type="tel"]:-ms-input-placeholder,
.form input[type="email"]:-ms-input-placeholder,
.form input[type="number"]:-ms-input-placeholder,
.form textarea:-ms-input-placeholder {
  color: #a4b3b7;
}
.form input[type="text"]::-ms-input-placeholder,
.form input[type="password"]::-ms-input-placeholder,
.form input[type="tel"]::-ms-input-placeholder,
.form input[type="email"]::-ms-input-placeholder,
.form input[type="number"]::-ms-input-placeholder,
.form textarea::-ms-input-placeholder {
  color: #a4b3b7;
}

/* smartPhone */
@media screen and (max-width: 640px) {
.form input[type="text"],
.form input[type="tel"],
.form input[type="email"],
.form input[type="number"] {
  width: 100%;
}
}