@charset "utf-8";

body {
  /***	フォント関連設定	***/
  font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

  font-size: 112.5%;
  /* 18px */
  font-size: 125%;
  /* 20px */
  line-height: 1.7;
  /***	背景＆文字色設定	***/
  background: #f5f5f5;
  color: #222;
  font-feature-settings: "palt";
  text-align: justify;
}

/***	ヘッダー画像	***/

h2 {
  margin: 0 auto;
  text-align: center;
  padding: 0em 0;
}

h3 {

  padding: 1.5em 0;
}

a {
  cursor: pointer;
}

img {
  display: block;
  /*	ブロック要素としてふるまう：中揃えで表示	*/
  margin: 0 auto;
  max-width: 100%;
  height: auto;
}

strong {
  font-weight: bold;
}

/***　見出しの設定用　***/

/* --------------------------------------------------
背景設定
----------------------------------------------------- */

.bg {
  background-image: url("../images/bg.webp");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

.bg_white {
  background: #FFFFFF;
}



/*---	背景ここまで---*/

/* フッター設定 */
footer {
  margin: 0 auto;
  padding: 1em 0;
  background: #fff;
  color: #222;
  text-align: center;
  font-size: 75%;
}

footer a {
  color: #222;
  text-decoration: underline;
}

footer a:hover {
  color: #595959;
}

address {
  font-style: normal;
}


/* --------------------------------------------------
テキスト装飾
----------------------------------------------------- */
.bold {
  font-weight: bold;
}

.large {
  font-size: 120%;
}

.xlarge {
  font-size: 144%;
}

.xxlarge {
  font-size: 172.8%;
}

.small {
  font-size: 82.5%;
}

.xsmall {
  font-size: 62.5%;
}

.xxsmall {
  font-size: 56.25%;
}

.u {
  text-decoration: underline;
}

.red {
  color: red;
}

.pink {
  color: #e72444;
}

.white {
  color: #FFFFFF;
}

.underline {
  background: linear-gradient(transparent 70%, yellow 70%);
}

.highlight_blue {
  background-color: #000436;
  padding: 0.1em;
}

.highlight_white {
  background-color: #fff;
  padding: 0.1em;
}

.highlight {
  background-color: #fff266;
}

.redhigh {
  color: red;
  background-color: #fff266;
}

/***	テキスト装飾設定ここまで	***/

/* PC版のみ表示 */
.pc-only {
  display: block;
}

/* SP版のみ表示 */
.sp-only {
  display: none;
}

/* --------------------------------------------------
案件ごとのコンテンツ内容
----------------------------------------------------- */




/*
 *		class-name　案件ごとのコンテンツ内容　ここまで
 */

.deco {
  display: block;
  margin: 30px auto 0;
  margin-bottom: 20px;
  padding: 10px 6px 4px;
  width: 840px;
  max-width: 96%;
  height: 108px;
  border: 4px solid #cbcbcb;
  background: #fff;
  color: #333;
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
}

.deco::placeholder {
  color: #AAA;
}

.btn {
  transition: transform 0.3s ease;
}

.btn:hover {
  transform: scale(1.05);
}

.optin {
  font-size: 0.9em;
  padding: 1.3em;
  text-align: center;
  color: #fff;
}

/***	form設定ここまで	***/


@media screen and (max-width: 1024px) {
  /***	幅1024px以下に適用：ipad proなどの1024pxのものはスマホ表示	***/

  /* 文字サイズを小さくする場合 */

  body {
    font-size: 100%;

  }


  h2 {
    padding: 2.5em 0em;
  }

  h3 {
    margin: 0 auto;
    text-align: center;
    padding: 0.5em 0;
    font-size: 1.2em;

  }

 

  /* --------------------------------------------------
案件ごとの設定
----------------------------------------------------- */



  /* 案件ごとの設定ここまで */


  /***	テキスト装飾設定	***/
  .xlarge {
    font-size: 125%;
  }

  .xxlarge {
    font-size: 150%;
  }

  /***　中央揃え　***/
  .center {
    text-align: center;
  }


  /* PC版のみ表示を非表示 */
  .pc-only {
    display: none;
  }

  /* SP版のみ表示を表示 */
  .sp-only {
    display: block;
  }

  /**formの設定 */

  
  
}

@media screen and (max-width: 599px) {
  /***	幅599px以下に適用：スマホ	***/
}

/*
 *		特商法
 */
.page_laws #wrapper {
  margin: 0 auto 2em;
  padding: 3em;
  width: 800px;
  background: #fff;
  max-width: 100%;
  font-size: 75%;
}

.page_laws #wrapper h2 {
  margin: 0 auto;
  font-size: 2em;
  text-align: center;
}

.page_laws #wrapper h3 {
  margin-top: 2em;
  font-size: 1.25em;
}

.page_laws #wrapper h4 {
  margin-top: 2em;
}

.page_laws table {
  margin: 1.5em auto;
  border-collapse: separate;
  border-spacing: 1px;
  background: #ccc;
}

.page_laws th {
  padding: 0.5em;
  width: 28%;
  border-top: 1px solid #fff;
  background-color: #EBEBEB;
}

.page_laws td {
  padding: 0.5em;
  font-size: 0.8em;
  background-color: #FFFFFF;
}

/* =========================================
   LP Template Logic ========================================= */



/* SP版のみの画像をPC版で非表示 */
@media screen and (min-width: 1025px) {
  .lp-section picture.sp-only {
    display: none;
  }

}


/* ============================================================
   ★ フォームの調整：ここだけ編集してください ★
   上記は触らない。フォームの微調整はここだけ。
   ============================================================ */

/* --- PC版：ここを編集 --- */
@media screen and (min-width: 1025px) {
  .form {
    display: block;
    background-color: #841b12;  /* 背景色 */
    margin: 0 auto;
    max-width: 1400px;
    padding: 1em 0;              /* 上下の余白 */
    text-align: center;          /* タイトル・ボタンを中央揃え（必須・これがないと中央に寄らない） */
  }
  .form_title {
    margin: 0 auto;
    text-align: center;
    padding: 0em 0 1.5em;           /* タイトル画像の余白 */
    max-width: 40%;             /* タイトル画像の幅 */
  }
  .submit .btn {
    margin: 0 auto;       /* ボタンの位置 */
    max-width: 45%;             /* ボタンの幅 */
  }
}

/* フッター設定 */
footer {
  margin: 0 auto;
  padding: 1em 0;
  background: #fff;
  color: #222;
  text-align: center;
  font-size: 75%;
}

footer a {
  color: #222;
  text-decoration: underline;
}

footer a:hover {
  color: #595959;
}

/* --- スマホ版：ここを編集 --- */
@media screen and (max-width: 1024px) {
  .form{
    display: block;
    background-color: #841b12;  /* 背景色 */
    margin: 0 auto;
    padding: 1em 0;              /* 上下の余白 */
    text-align: center;          /* タイトル・ボタンを中央揃え（必須・これがないと中央に寄らない） */
  }
  .form_title {
    margin: 0 auto;
    text-align: center;
    padding: 0em 1em 1em;   /* タイトル画像の余白 */
    max-width: 90%;            /* タイトル画像の幅 */
  }
  .submit .btn {
    max-width: 90%;             /* ボタンの幅 */
    margin: 0 auto;             /* ボタンの位置 */
  }

}