@charset "utf-8";

/* 「上書き・追加修正」はCSS下部にまとめて記述 */

/* 背景 */
body.form { background-color: #e6f8f9; }

/* ------------------------------------------------------
    レイアウト
   ------------------------------------------------------ */

/* --ページ最小横幅指定-- */
body.form { min-width: 680px; }

/* --ページ行間指定-- */
body.form { line-height: 1.4; }

/* --コンテンツの幅指定-- */
body.form #wrapper {
  width: 680px;
  min-height: 100vh;
  word-break: break-all;
  -webkit-text-size-adjust:100%;
}

/* --フォームの左右余白-- */
body.form #wrapper .contents {
  box-sizing: border-box;
  padding: 30px;
  border-radius: 10px;
  background: #fff;
}

/* --完了画面-- */
body.form #wrapper .contents.complete {
  min-height: 180px;
}

/* --フッター-- */
body.form #wrapper .footer {
  padding: 0 0 60px;
}

/* --ヘッダー画像-- */
body.form #wrapper .title img {
  display: block;
  width: 100%;
}

/* ------------------------------------------------------
    フォーム
   ------------------------------------------------------ */

/* --フォームの横幅指定を解除-- */
body.form .input-form,
body.form .contents table,
body.form .contents .entry,
body.form .footer .link-group,
body.bbs-form .contents form,
body.bbs-form .contents table,
body.bbs-form .footer .link-group,
body.bbs-list .footer .link-group {
  width: auto;
}
body.form .contents table { 
  width: 100%;
  margin: 45px 0 35px;
}

/* --項目-- */
body.form .contents table .form-textbox,
body.form .contents table .form-textarea,
body.form .contents table .form-select,
body.form .contents table .form-radio,
body.form .contents table .form-checkbox,
body.form .contents table .form-photo,
body.form .contents table .form-movie,
body.form .contents table .form-datepicker,
body.form .contents table .form-tel,
body.form .contents table .form-email,
body.form .contents table .form-file {
  display: block;
  border-bottom: 1px solid #e8e8e8;
  margin-bottom: 25px;
  padding-bottom: 25px;
}

/* --項目名-- */
body.form .contents table .form-textbox th,
body.form .contents table .form-textarea th,
body.form .contents table .form-select th,
body.form .contents table .form-radio th,
body.form .contents table .form-checkbox th,
body.form .contents table .form-photo th,
body.form .contents table .form-movie th,
body.form .contents table .form-datepicker th,
body.form .contents table .form-tel th,
body.form .contents table .form-email th,
body.form .contents table .form-file th {
  display: block;
  margin-bottom: 15px;
  font-weight: bold;
  font-size: 16px;
  width: auto;
}
body.form .contents table td { width: 100%; }

/* --aタグhover-- */
body.form .contents a:hover{
  opacity: .5;
}

/* --入力枠-- */
body.form .contents table .form-textbox td,
body.form .contents table .form-textarea td,
body.form .contents table .form-select td,
body.form .contents table .form-radio td, 
body.form .contents table .form-checkbox td, 
body.form .contents table .form-photo td,
body.form .contents table .form-movie td,
body.form .contents table .form-datepicker td,
body.form .contents table .form-tel td,
body.form .contents table .form-email td,
body.form .contents table .form-file td {
  display: block;
  font-size: 16px;
}
body.form .contents table .form-radio td,
body.form .contents table .form-checkbox td{
  padding-bottom: 0;
}

/* --必須項目-- */
body.form .contents table .required {
  font-weight: bold;
  color: #fe0000;
  margin-left: .5em;
  font-size: 10px;
}
body.form .contents table .required::after{
  content: "必須";
  width: 2em;
  font-size: 10px;
  vertical-align: middle;
}

/* --特殊項目 テキスト・画像・区切り線-- */
body.form .contents table .form-text,
body.form .contents table .form-img,
body.form .contents table .form-hr{
  display: block;
}
body.form .contents table .form-text th,
body.form .contents table .form-img th,
body.form .contents table .form-hr th{
  display: block;
  width: auto;
}
body.form .contents table .form-text td,
body.form .contents table .form-img td,
body.form .contents table .form-hr td{
  display: block;
  width: auto;
}

/* --特殊項目 テキスト-- */
body.form .contents table .form-text .text {
  box-sizing: border-box;
  padding: 10px 20px;
  margin-bottom: 25px;
  font-size: 13px;
  line-height: 1.6;
  text-align: left;
  /* font-weight: bold; */
  /* border: 1px solid #e8e8e8; */
  border-radius: 5px;
  background: #fff0f2;
  color: #e60013;
}

/* --特殊項目 画像-- */
body.form .contents table .form-img .img {
  margin-bottom: 25px;
}
body.form .contents table .form-img .img img {
  width: 100%;
  vertical-align: bottom;
}

/* --特殊項目 区切り線-- */
body.form .contents table .form-hr .form-hr hr {
  margin: 0 0 25px;
  box-sizing: border-box;
  border: none;
  border-top: 1px solid #e8e8e8;
}
tr:has(+ tr.form-hr) {
  border-bottom: 0 !important;
}
tr.text:has(+ tr.form-hr),
tr.img:has(+ tr.form-hr) {
  margin-bottom: 50px !important;
}

/* --フォームタイトルテキスト-- */
body.form h1{
  margin-bottom: 0;
  display: block;
}
body.form h2{
  margin-bottom: 0;
  font-size: 28px;
  font-weight: bold;
  padding: 70px 5% 70px;
  background: #E60012;
  color: #fff;
  letter-spacing: .1em;
}

/* --利用目的・説明文-- */
body.form .contents .text1{
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 30px;
  padding: 15px;
  text-align: left;
  /* border: 1px solid #e8e8e8; */
  border-radius: 5px;
  background: #f9f9f9;
}
body.form .contents .text1>*:first-child{
  margin-top: 0!important;
}
body.form .contents .text1 .text1-tit{
  display: block;
  position: relative;
  padding: .6em .6em .6em 2.1em;
  margin-top: 20px;
  color: #fff;
  background: #E60012;
  font-size: 18px;
  font-weight: bold;
  border-radius: 5px;
}
body.form .contents .text1 .text1-tit-i{
  position: absolute;
  top: .6em;
  left: .6em;
}
body.form .contents .text1 .text1-subtit-inner{
  display: block;
  color: #E60012;
  font-size: 18px;
  font-weight: bold;
  border-left: 6px solid #E60012;
  padding-left: 12px;
}
body.form .contents .text1 .text1-note{
  display: block;
  color: #E60012;
  padding: 10px;
  text-align: center;
}
body.form .contents .text1 .text1-period{
  display: block;
  color: #E60012;
  background: #ffe5e7;
  padding: 10px;
  text-align: center;
  border-radius: 5px;
}
body.form .contents .text1 .text1-period .strong{
    font-size: 18px;
    font-weight: bold;
}
body.form .contents .text1 .text1-border{
  display: block;
  height: 1px;
  background: #e8e8e8;
}
body.form .contents .text1 .text1-txt .txt-marker,
body.form .contents .text1 .text1-list .txt-marker{
  font-weight: bold;
  font-size: 16px;
  /* text-decoration: underline; */
  padding: 0 .25em;
  background: linear-gradient(transparent 40%, #ffff33 40%);
}
body.form .contents .text1 .text1-txt .txt-strong,
body.form .contents .text1 .text1-list .txt-strong{
  font-weight: bold;
}
body.form .contents .text1 .text1-txt .txt-color,
body.form .contents .text1 .text1-list .txt-color{
  font-weight: bold;
  color: #E60012;
}
body.form .contents .text1 .text1-txt,
body.form .contents .text1 .text1-txtS{
  display: block;
}
body.form .contents .text1 .text1-list,
body.form .contents .text1 .text1-listS{
  display: block;
  position: relative;
  padding-left: 1.2em;
}
body.form .contents .text1 .text1-list-i,
body.form .contents .text1 .text1-listS-i{
  position: absolute;
  top: 0;
  left: 0;
}
body.form .contents .text1 .text1-txtS,
body.form .contents .text1 .text1-listS{
  font-size: 14px;
  color: #707070;
}
body.form .contents .text1 .text1-tit{
    margin-top: 20px;
}
body.form .contents .text1 .text1-subtit{
    display: block;
    padding-top: 10px;
}
body.form .contents .text1 .text1-subtit-inner{
    margin-top: 20px;
    margin-bottom: 20px;
}
body.form .contents .text1 .text1-txt,
body.form .contents .text1 .text1-note,
body.form .contents .text1 .text1-period,
body.form .contents .text1 .text1-list,
body.form .contents .text1 .text1-listS{
  margin-top: 15px;
}

.text1-list + .text1-list{
  margin-top: 15px!important;
}
.text1-listS + .text1-listS{
  margin-top: 10px!important;
}

/* --ダウンロードボタン-- */
body.form .contents .text1 .download-list{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
body.form .contents .text1 .download-list .download-item{
  width: 33%;
  text-align: center;
  background: #fbfae8;
  padding: 15px 10px 10px 10px;
  margin-top: 10px;
  border: 1px dotted #e60012;
  border-radius: 5px;
  box-sizing: border-box;
  align-items: stretch;
}
body.form .contents .text1 .download-list .download-item .br-pc{
  display: block;
}
body.form .contents .text1 .download-list .download-item .download-item-txt{
  font-weight: bold;
  margin-bottom: 10px;
  display: block;
}
body.form .contents .text1 .download-list .download-item .download-item-songtitle{
  font-weight: bold;
  margin-bottom: 10px;
  display: block;
  color: #E60012;
}
body.form .contents .text1 .download-list .download-item a{
  display: inline-block;
  text-decoration: none;
  color: #fff;
  background: #E60012;
  border-radius: 30px;
  padding: .5em 0;
  width: 100%;
  margin: 0 auto 5px;
}

/* ボタン */
body.form .contents .text1 .text1-btn{
  display: block;
  text-align: center;
  margin-top: 15px;
}
body.form .contents .text1 .text1-btn a{
  display: inline-block;
  text-align: center;
  text-decoration: none;
  color: #fff;
  background: #50b734;
  padding: 10px 30px;
  border-radius: 40px;
}


/* --エラー-- */
body.form .form-error{
  margin-bottom: 30px;
  color: #fe0000;
  font-weight: bold;
  font-size: 16px;
  text-align: left;
  background: #FFF5F5;
  padding: 40px 20px;
  border: 2px solid;
  border-radius: 5px;
}
body.form .contents .form-error li{
  margin-bottom: 10px;
  padding-left: 1em;
  text-indent: -1em;
}
body.form .contents .form-error li:last-child{
  margin-bottom: 0;
}
.file-name-view{
  display: inline-block;
  font-size: 14px;
  padding-left: 0;
}

/* --入力枠-- */
body.form .contents input,
body.form .contents textarea {
  padding: 15px;
  margin-bottom: 0;
}
body.form .contents textarea {
  resize: vertical;
  box-sizing: border-box;
  width: 100%;
  background: #fbfae8;
  border: 1px solid #a8a8a8;
  border-radius: 10px;
}
body.form .contents table .form-textbox input[type=text],
body.form .contents table .form-tel input[type=tel],
body.form .contents table .form-email input[type=text] {
  box-sizing: border-box;
  padding: 15px;
  width: 100%;
  background: #fbfae8;
  border: 1px solid #a8a8a8;
  border-radius: 10px;
  font-size: 16px;
}

/* --生年月日-- */
body.form .contents table .form-datepicker input[type=date]{
  width: 100%;
  box-sizing: border-box;
  appearance: none;
  -webkit-appearance: none;
  font-size: 16px;
  min-height: 52px;
  border: 1px solid #a8a8a8;
  border-radius: 10px;
  background: transparent;
  line-height: 1;
  position: relative;
  cursor: text;
}
body.form .contents table .form-datepicker input[type=date]::-webkit-date-and-time-value{
  text-align: left;
}
body.form .contents table .form-datepicker input[type=date]::-webkit-inner-spin-button{
  -webkit-appearance: none;
}
body.form .contents table .form-datepicker input[type=date]::-webkit-clear-button{
  -webkit-appearance: none;
}
body.form .contents table .form-datepicker input[type=date]::-webkit-calendar-picker-indicator {
  position: absolute;
  width: 40%;/* カレンダーのクリック領域 */
  height: 100%;
  opacity: 0;
  right: 0;
  z-index: 1;
  cursor: pointer;
}
body.form .form-datepicker td  {
  position: relative;
  display: block !important;
  width: 60% !important;
}
body.form .form-datepicker td::before{
  content: '';
  position: absolute;
  right: 15px;
  width: 16px;
  height: 14px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  border-right: 1px solid #000000;
  border-left: 1px solid #000000;
  border-top: 4px solid #000000;
  border-bottom: 1px solid #000000;
  border-radius: 2px;
  box-sizing: border-box;
  z-index: 0;
}
body.form .form-datepicker td::after{
  content: '';
  position: absolute;
  right: 18px;
  width: 10px;
  height: 3px;
  top: calc(50% - 7px);
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  border-right: 2px solid #000000;
  border-left: 2px solid #000000;
  border-top: none;
  border-bottom: none;
  box-sizing: border-box;
  z-index: 0;
}

/* --電話番号-- */
body.form .contents table .form-tel input[type=tel]{
  width: 60%;
}

/* --プルダウンメニュー-- */
body.form .form-select td {
  position: relative;
  display: inline !important;
}
body.form .form-select td::before{
  content: '';
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
  border-top: 8px solid #000000;
  border-bottom: 0;
}
body.form .form-select select {
  width: 40%;
  box-sizing: border-box;
  appearance: none; /* デフォルトの矢印を非表示 */
  -webkit-appearance: none;
  padding: 15px;
  font-size: 16px;
  min-height: 52px;
  margin-bottom: 0;
  background: transparent;
  border: 1px solid #a8a8a8;
  border-radius: 10px;
  line-height: 1;
  position: relative;
  cursor:pointer;
}
body.form .form-select select::-ms-expand {
  display: none; /* デフォルトの矢印を非表示(IE用) */
}

/* --ラジオボタン・チェックボックス-- */
body.form .contents table .form-radio td,
body.form .contents table .form-checkbox td {
  display: grid;
  grid-template-columns: 1fr;
  gap: 15px;
}
body.form .form-radio .item,
body.form .form-checkbox .item {
  background: #f5f5f5;
  text-align: left;
  width: 100%;
  border-radius: 10px;
}
body.form .form-radio .item label,
body.form .form-checkbox .item label{
  display: grid;
  grid-template-columns: auto 1fr;
  box-sizing: border-box;
  padding: 15px;
  width: 100%;
  height: 100%;
  position: relative;
  grid-template-columns: auto 1fr;
  grid-template-rows: 1fr auto;
  grid-column-gap: 10px;
  grid-row-gap: 0px;
  place-items: center start;
  cursor:pointer;
  font-size: 16px;
}

/* --画像付きラジオボタン・チェックボックス-- */
body.form .contents table .form-radio td,
body.form .contents table .form-checkbox td{
  overflow: hidden;
  *zoom: 1;
}
body.form .form-radio .item img,
body.form .form-checkbox .item img {
  float: left;
  margin-top: 15px;
  width: 100%;
  order: 3;
  grid-area: 2 / 1 / 3 / 3;
}
body.form .form-radio .item input,
body.form .form-checkbox .item input {
  display: inline-block;
  padding: 0;
  position: relative;
  width: 15px;
  height: 15px;
  margin-right: 0;
}

/* --郵便番号検索ボタン-- */
body.form .contents table .form-zipcode-btn {
  display: inline-block;
  padding: 14px 1em;
  margin-left: 15px;
  background-color: #E60012;
  text-decoration: none;
  color: #fff;
  border-radius: 5px;
  font-size: 15px;
  font-weight: 400;
}

/* --画像・動画・ファイル投稿 背景-- */
body.form .contents table .form-photo td,
body.form .contents table .form-movie td,
body.form .contents table .form-file td{
  padding: 15px 15px 10px !important;
  border: 2px dotted #a8a8a8;
  border-radius: 10px;
  box-sizing: border-box;
  margin-bottom: 0;
}

/* --画像・動画・ファイル投稿 進捗-- */
body.form .contents table .form-photo td .progress,
body.form .contents table .form-movie td .progress,
body.form .contents table .form-file td .progress{
  margin: 10px 0 5px;
}

/* --画像・動画・ファイル投稿 メッセージ-- */
body.form .contents table .form-photo td .file-message,
body.form .contents table .form-movie td .file-message,
body.form .contents table .form-file td .file-message{
  color: #fe0000;
  font-size: 14px;
  display: inline;
  line-height: 2;
}

/* --画像・動画・ファイル投稿 選択ボタン-- */
/* 郵便番号検索ボタンと同じスタイル */
body.form .contents table .form-image button,
body.form .contents table .form-video button,
body.form .contents table .form-file button{
  color: #fff;
  background: #E60012;
  font-size: 15px;
  padding: 10px 1em;
  border: none;
  border-radius: 5px;
  margin-right: 15px;
  cursor: pointer;
}
body.form .contents table .form-image button:hover,
body.form .contents table .form-video button:hover,
body.form .contents table .form-file button:hover{
  opacity: 0.5;
}
body.form .contents .text2 {
  font-weight: bold;
  font-size: 16px;
  margin: 30px 0;
}
body.form .contents .text3 {
  font-weight: bold;
  font-size: 16px;
  margin: 30px 0 90px;
  position: relative;
}
body.form .contents .text3::after{
  content: "「投稿が完了いたしました。」という画面が出たら応募完了です。応募された情報に関する確認メールは自動送信されません。";
  position: absolute;
  font-weight: normal;
  font-size: 14px;
  bottom: -60px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
}

/* --確認ボタン-- */
body.form .btn-set {
  margin-bottom: 30px;
}

/* --確認ボタン・登録するボタン-- */
body.form .contents .btn-set input[type=button]{
  color: #fff;
  background: #E60012;
  font-size: 18px;
  width: 160px;
  padding: 15px 15px;
  border: none;
  border-radius: 5px;
  font-weight: bold;
  margin-right: 15px;
  cursor: pointer;
}

/* --リセットボタン-- */
body.form .contents .btn-set input[type=reset],
body.form .contents .btn-set input#btn-back[type=button]{
  color:#E60012;
  background: #fff;
  font-size: 18px;
  width: 160px;
  padding: 13px 15px;
  border: 2px solid #E60012;
  border-radius: 5px;
  font-weight: bold;
  margin-right: 0;
  cursor: pointer;
}
body.form .contents input.btn-send:hover,
body.form .contents input.btn-reset:hover{
  opacity: .5;
}

/* --閉じるボタン-- */
body.form .footer .link-close {
  margin-bottom: 0;
}
body.form .footer .link-close a {
  display: inline-block;
  color: #a8a8a8;
  font-size: 18px;
  text-align: center;
  text-decoration: none;
  font-weight: bold;
  position: relative;
  margin-left: 1.5em;
}

/* --閉じるボタンのバツ-- */
body.form .footer .link-close a::before{
  display: block;
  content: "";
  position: absolute;
  left: -1.5em;
  width: 18px;
  height: 2.5px;
  background: #a8a8a8;
  transform: rotate(45deg);
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  -webkit-transform: translateY(-50%) rotate(45deg);
  -ms-transform: translateY(-50%) rotate(45deg);
}
body.form .footer .link-close a::after{
  display: block;
  content: "";
  position: absolute;
  left: -1.5em;
  width: 18px;
  height: 2.5px;
  background: #a8a8a8;
  top: 50%;
  transform: translateY(-50%) rotate(-45deg);
  -webkit-transform: translateY(-50%) rotate(-45deg);
  -ms-transform: translateY(-50%) rotate(-45deg);
}
body.form .footer .link-close a:hover {
  opacity: 0.5;
}

/* ------------------------------
    確認画面
   ------------------------------ */
/* --以下の内容でよろしいですか？-- */
body.form .contents.confirm .text3{
  font-size: 16px;
}

/* --確認画面 項目名-- */
body.form .contents.confirm table .form-img th,
body.form .contents.confirm table .form-text th,
body.form .contents.confirm table .form-hr th,
body.form .contents.confirm table .form-textbox th,
body.form .contents.confirm table .form-textarea th,
body.form .contents.confirm table .form-select th,
body.form .contents.confirm table .form-radio th,
body.form .contents.confirm table .form-checkbox th,
body.form .contents.confirm table .form-photo th,
body.form .contents.confirm table .form-movie th,
body.form .contents.confirm table .form-datepicker th,
body.form .contents.confirm table .form-tel th,
body.form .contents.confirm table .form-email th,
body.form .contents.confirm table .form-file th {
  font-size: 14px;
  margin-bottom: 10px;
  color: #a8a8a8;
}

/* --確認画面 入力枠-- */
body.form .contents.confirm table .form-textbox td,
body.form .contents.confirm table .form-textarea td,
body.form .contents.confirm table .form-select td,
body.form .contents.confirm table .form-radio td, 
body.form .contents.confirm table .form-checkbox td, 
body.form .contents.confirm table .form-photo td,
body.form .contents.confirm table .form-movie td,
body.form .contents.confirm table .form-datepicker td,
body.form .contents.confirm table .form-tel td,
body.form .contents.confirm table .form-email td,
body.form .contents.confirm table .form-file td {
  font-size: 16px;
}
body.form .contents.confirm table tr:first-child{
  padding-top: 25px;
  border-top: 1px solid #e8e8e8;
}

/* --回答なし-- */
body.form .contents.confirm table tr td .input-value:empty{
  position: relative;
}
.input-value:empty:before {
  content: '回答なし';
  color: #a8a8a8;
}

/* --プルダウン・カレンダーアイコン非表示-- */
body.form .contents.confirm .form-select td::before,
body.form .contents.confirm .form-datepicker td::before,
body.form .contents.confirm .form-datepicker td::after{
  display: none;
}

/* --画像・動画・ファイル投稿 背景-- */
body.form .contents.confirm table .form-photo td,
body.form .contents.confirm table .form-movie td,
body.form .contents.confirm table .form-file td{
  padding: 15px!important;
}

/* --画像付きラジオボタン・チェックボタン-- */
body.form .contents.confirm table .form-radio td div,
body.form .contents.confirm table .form-checkbox td div{
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
body.form .contents.confirm table .form-radio td div img,
body.form .contents.confirm table .form-checkbox td div img{
  width: 100%;
}

/* --以下の内容でよろしいですか？-- */
body.form .contents.confirm .text3{
  margin: 45px 0 90px;
}

/* --応募規約同意ボタン-- */
body.form .contents.confirm .agree-acquisition-personal-information{
  margin-bottom: 30px;
  text-align: center;
}
body.form .contents.confirm .agree-acquisition-personal-information input{
  display: inline-block;
  padding: 0;
  position: relative;
  top: 1.5px;
  width: 15px;
  height: 15px;
  margin: 0 ;
}
body.form .contents.confirm .agree-acquisition-personal-information label{
  padding-left: 10px;
  font-size: 16px;
  font-weight: bold;
}
body.form .contents.confirm .attention{
  font-size: 12px;
  color: #a8a8a8;
  margin-bottom: 30px;
}

/* --投稿するボタン 応募規約同意ボタンにチェックが入っていない場合-- */
body.form .contents .btn-set input[type=button]:disabled{
  background: #a8a8a8;
  cursor:default;
}
 body.form .contents .btn-set input[type=button]:disabled:hover{
  opacity: 1;
}
/* ------------------------------
    完了画面
   ------------------------------ */
body.form .contents.complete{
  padding: 30px 30px 30px;
}

/* --投稿が完了いたしました。-- */
body.form .contents.complete .text2{
  font-size: 20px;
}

/* --完了画面メッセージ-- */
body.form .contents.complete>div {
  box-sizing: border-box;
  padding: 20px;
  margin-bottom: 30px;
  font-size: 13px;
  text-align: left;
  line-height: 1.6;
  border: 1px solid #e8e8e8;
  border-radius: 5px;
  background: #fafafa;
}

/* --完了画面メッセージ 画像-- */
body.form .contents.complete>div img {
  vertical-align: top;
  max-width: 100%;
  height: auto;
}
body.form .contents.complete>div .download-list{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;

}
body.form .contents.complete>div .download-list .download-item{
  width: 33%;
  text-align: center;
  background: #fbfae8;
  padding: 15px 10px 10px 10px;
  margin-top: 10px;
  border: 1px dotted #e60012;
  border-radius: 5px;
  box-sizing: border-box;
  align-items: stretch;
}
body.form .contents.complete>div .download-list .download-item .br-pc{
  display: block;
}
body.form .contents.complete>div .download-list .download-item p{
  font-weight: bold;
  margin-bottom: 10px;
}
body.form .contents.complete>div .download-list .download-item a{
  display: inline-block;
  text-decoration: none;
  color: #fff;
  background: #E60012;
  border-radius: 30px;
  padding: .5em 0;
  width: 100%;
  margin: 0 auto 5px;
}

/* --div-- */
body.form .contents.complete{
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 30px;
  padding: 20px;
  text-align: left;
  border: 1px solid #e8e8e8;
  border-radius: 5px;
  background: #fafafa;
}
body.form .contents.complete>*:first-child{
  margin-top: 0!important;
}
body.form .contents.complete .complete-tit{
  display: block;
  position: relative;
  padding: .6em .6em .6em 2.1em;
  margin-top: 20px;
  color: #fff;
  background: #E60012;
  font-size: 16px;
  font-weight: bold;
  border-radius: 5px;
}
body.form .contents.complete .complete-tit-i{
  position: absolute;
  top: .6em;
  left: .6em;
}
body.form .contents.complete .complete-subtit{
  display: block;
  color: #E60012;
  font-size: 16px;
  font-weight: bold;
  border-left: 6px solid #E60012;
  padding-left: 12px;
}
body.form .contents.complete .complete-txt .txt-color{
  font-weight: bold;
  color: #E60012;
}
body.form .contents.complete .complete-txt,
body.form .contents.complete .complete-txtS{
  display: block;
}
body.form .contents.complete .complete-list,
body.form .contents.complete .complete-listS{
  display: block;
  position: relative;
  padding-left: 1.2em;
}
body.form .contents.complete .complete-list-i,
body.form .contents.complete .complete-listS-i{
  position: absolute;
  top: 0;
  left: 0;
}
body.form .contents.complete .complete-txtS,
body.form .contents.complete .complete-listS{
  font-size: 12px;
  color: #707070;
}
body.form .contents.complete .complete-tit,
body.form .contents.complete .complete-subtit{
  margin-top: 20px;
}
body.form .contents.complete .complete-txt,
body.form .contents.complete .complete-note,
body.form .contents.complete .complete-period,
body.form .contents.complete .complete-list,
body.form .contents.complete .complete-listS{
  margin-top: 15px;
}

.complete-list + .complete-list{
  margin-top: 5px!important;
}
.complete-listS + .complete-listS{
  margin-top: 3px!important;
}

/* ------------------------------------------------------
    スマートフォン対応
   ------------------------------------------------------ */
@media screen and (max-width: 680px){

  /* --ページ横幅指定解除-- */
  body.form { min-width: 100%; }

  /* --コンテンツの幅指定を解除-- */
  body.form #wrapper { width: 100%; }

  /* --フォームの左右余白-- */
  body.form #wrapper .contents {
    width: 100%;
    padding: 20px 5%;
  }
  body.form .contents table td { width: 100%; }

  /* --テキスト-- */
  body.form h2{
    font-size: 5vw;
  }

  /* --画像・動画・ファイル 選択ボタン-- */
  body.form .contents table .form-image button:hover,
  body.form .contents table .form-video button:hover,
    body.form .contents table .form-file button:hover{
    opacity: 1;
  }
  /* --確認ボタン・登録するボタン-- */
  body.form .contents .btn-set input[type=button]{
    width: 135px;
    margin-right: 10px;
  }
  /* --リセットボタン-- */
  body.form .contents .btn-set input[type=reset],
  body.form .contents .btn-set input#btn-back[type=button]{
    width: 135px;
    margin-right: 0;
  }
  body.form .contents input.btn-send:hover,
  body.form .contents input.btn-reset:hover{
    opacity: 1;
  }

  /* --閉じるボタン-- */
  body.form .footer .link-close a {
    font-size: 16px;
  }

  /* --閉じるボタンのバツ-- */
  body.form .footer .link-close a::before,
  body.form .footer .link-close a::after{
    width: 16px;
  }
  body.form .footer .link-close a:hover {
    opacity: 1;
  }
  
  /* --項目名-- */
  body.form .contents table .form-textbox th,
  body.form .contents table .form-textarea th,
  body.form .contents table .form-select th,
  body.form .contents table .form-radio th,
  body.form .contents table .form-checkbox th,
  body.form .contents table .form-photo th,
  body.form .contents table .form-movie th,
  body.form .contents table .form-datepicker th,
  body.form .contents table .form-tel th,
  body.form .contents table .form-email th,
  body.form .contents table .form-file th {
    font-size: 15px;
    padding: 0;
  }

  /* --確認画面 項目名-- */
  body.form .contents.confirm table .form-img th,
  body.form .contents.confirm table .form-text th,
  body.form .contents.confirm table .form-hr th,
  body.form .contents.confirm table .form-textbox th,
  body.form .contents.confirm table .form-textarea th,
  body.form .contents.confirm table .form-select th,
  body.form .contents.confirm table .form-radio th,
  body.form .contents.confirm table .form-checkbox th,
  body.form .contents.confirm table .form-photo th,
  body.form .contents.confirm table .form-movie th,
  body.form .contents.confirm table .form-datepicker th,
  body.form .contents.confirm table .form-tel th,
  body.form .contents.confirm table .form-email th,
  body.form .contents.confirm table .form-file th {
    font-size: 13px;
  }

  /* --入力枠-- */
  body.form .contents table .form-textbox td,
  body.form .contents table .form-textarea td,
  body.form .contents table .form-select td,
  body.form .contents table .form-radio td, 
  body.form .contents table .form-checkbox td, 
  body.form .contents table .form-photo td,
  body.form .contents table .form-movie td,
  body.form .contents table .form-datepicker td,
  body.form .contents table .form-tel td,
  body.form .contents table .form-email td,
  body.form .contents table .form-file td {
    font-size: 15px;
  }

  /* --確認画面 入力枠-- */
  body.form .contents.confirm table .form-textbox td,
  body.form .contents.confirm table .form-textarea td,
  body.form .contents.confirm table .form-select td,
  body.form .contents.confirm table .form-radio td, 
  body.form .contents.confirm table .form-checkbox td, 
  body.form .contents.confirm table .form-photo td,
  body.form .contents.confirm table .form-movie td,
  body.form .contents.confirm table .form-datepicker td,
  body.form .contents.confirm table .form-tel td,
  body.form .contents.confirm table .form-email td,
  body.form .contents.confirm table .form-file td {
    font-size: 15px;
  }

  /* --入力枠-- */
  body.form .contents table .form-textbox input[type=text],
  body.form .contents table .form-tel input[type=tel],
  body.form .contents table .form-email input[type=text] {
    font-size: 15px;
  }

  /* --プルダウン-- */
  body.form .form-select select{
    width: 60%;
    font-size: 15px;
    min-height: 51px;
  }

  /* --ラジオボタン・チェックボックス-- */
  body.form .form-radio .item label,
  body.form .form-checkbox .item label{
    font-size: 15px;
  }

  /* --生年月日-- */
  body.form .contents table .form-datepicker input[type=date]{
    font-size: 15px;
    min-height: 51px;
  }
  body.form .contents table .form-datepicker input[type=date]::-webkit-calendar-picker-indicator {
    width: 100%;/* カレンダーのクリック領域 */
  }

  /* --応募規約同意ボタン-- */
  body.form .contents.confirm .agree-acquisition-personal-information label{
    font-size: 15px;
  }
  body.form .contents.confirm .agree-acquisition-personal-information input{
    top: 1px;
  }

  body.form .contents .text3::after{
    font-size: 12px;
  }

  /* --ダウンロードボタン-- */
  body.form .contents .text1 .download-list .download-item{
    width: 100%;
  }
  body.form .contents .text1 .download-list .download-item .br-pc{
    display: none;
  }
  body.form .contents .text1 .download-list .download-item a{
    width: 70%;
  }

  /* --完了画面メッセージ 画像-- */
  body.form .contents.complete>div .download-list .download-item{
    width: 100%;
  }
  body.form .contents.complete>div .download-list .download-item .br-pc{
    display: none;
  }
  body.form .contents.complete>div .download-list .download-item a{
    width: 70%;
  }

  /* --利用目的・説明文-- */
  body.form .contents .text1{
    font-size: 14px;
  }
  body.form .contents .text1 .text1-tit{
    font-size: 16px;
  }
  body.form .contents .text1 .text1-subtit-inner{
    font-size: 16px;
  }
  body.form .contents .text1 .text1-period .strong{
    font-size: 16px;
  }
  body.form .contents .text1 .text1-txt .txt-marker{
    font-size: 16px;
  }
  body.form .contents .text1 .text1-txtS,
  body.form .contents .text1 .text1-listS{
    font-size: 12px;
  }
  .text1-list + .text1-list{
    margin-top: 13px!important;
  }
  .text1-listS + .text1-listS{
    margin-top: 8px!important;
  }

}/* max-width: 680px */


/* ------------------------------------------------------
    上書き・追加修正
   ------------------------------------------------------ */

/* =========================
    全体
   ========================= */

/* ヘッダーテキスト非表示(不要の場合は削除) */
body.form h2{
  display: none;
}

/* =========================
    カラー
   ========================= */

/* ページ全体背景 */
body.form{
  background-color: #edf9e6;
  /* 背景画像指定の場合
  background-image: url(../img/000000000-background.png);
  */
}

/* ヘッダー背景 */body.form h2,
/* 郵便番号検索ボタン */body.form .contents table .form-zipcode-btn,
/* 画像 選択ボタン */body.form .contents table .form-image button,
/* 動画 選択ボタン */body.form .contents table .form-video button,
/* ファイル投稿 選択ボタン */body.form .contents table .form-file button,
/* 確認ボタン・登録するボタン */ body.form .contents .btn-set input[type=button]{
  background: #E60012;
}
/* リセットボタン */body.form .contents .btn-set input[type=reset],
/* 戻るボタン */body.form .contents .btn-set input#btn-back[type=button]{
  color:#E60012;
  border: 2px solid #E60012;
}
/* 以下の内容でよろしいですか？ */body.form .contents.confirm .text3,
/* 投稿が完了いたしました。 */body.form .contents.complete .text2{
  color:#000;
}

/* 入力フォーム背景 */
body.form .contents table .form-textbox input[type=text],
body.form .contents table .form-tel input[type=tel],
body.form .contents table .form-email input[type=text],
body.form .contents textarea{
  background: #fbfae8;
}

/* =========================
    入力フォーム 横幅｜カラム数
   -------------------------
    【※必須作業】下記「#item●●」を各項目のid・class番号に変更
   ========================= */

/* 名前(姓・名) */
body.form .contents table .form-textbox #item01,
body.form .contents table .form-textbox #item02{
  width: 60%;
}
/* 郵便番号 */
body.form .contents table .form-textbox #item03{
  width: 40%;
  vertical-align: middle;
}
body.form .contents table .form-textbox #item03 + span{
  vertical-align: middle;
}
/* 住所１(市区町村) */
body.form .contents table .form-textbox #item05{
  width: 60%;
}
/* 年齢 */
body.form .contents table .form-textbox #item16{
  width: 40%;
}
/* 学年 */
body.form .contents table .form-textbox #item13{
  width: 40%;
}
/* 性別 */
body.form .contents table .item●● td{
  grid-template-columns: 1fr 1fr;
}
/* 画像付きラジオ(1カラムの場合は削除) */
body.form .contents table .item●● td{
  grid-template-columns: 1fr 1fr;
}
/* 画像付きチェック(1カラムの場合は削除) */
body.form .contents table .item●● td{
  grid-template-columns: 1fr 1fr;
}

/* =========================
    その他
   ========================= */

/* 下の項目と一括りにする場合に使用 */
body.form .contents table .item01,
body.form .contents table .item02,
body.form .contents table .item03,
body.form .contents table .item04,
body.form .contents table .item05,
body.form .contents table .item06,
body.form .contents table .item07,
body.form .contents table .item13,
body.form .contents table .item10,
body.form .contents table .item20{
  margin-bottom: 0;
  border-bottom: none;
}


/* 完了画面メッセージ 空欄・装飾なしの場合に使用 
body.form .contents.complete>div {
  padding: 0;
  margin-bottom: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
*/