/*
Theme Name: kurasapo
Theme URI: ★ テーマの公式サイトなどのURL（空欄でも可） ★
Template: lightning
Description: ★ テーマの説明（空欄でも可） ★
Author: ★ テーマ作成者の名前（空欄でも可） ★
Tags: 
Version: 0.5.1
*/


/* ==========================
   物件情報テーブル スタイル
   ========================== */
/*------------------------物件情報入力ページのCSS開始-------------------------*/
/*--------------CF物件入力*/
.photogallery{
	text-align:center;
}

.flex-container {
    display: flex;

	
}
/*--------------ボタンCSS*/
.button018 a {
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    max-width: 225px;
    padding: 10px 0 10px 25px;
    color: #313131;
    transition: 0.3s ease-in-out;
    font-weight: 500;
    font-size: 15px;
}

.button018 a:before,
.button018 a:after {
    content: "";
    position: absolute;
    display: block;
    top: 50%;
}

.button018 a:before {
    width: 0.5rem;
    height: 0.5rem;
    left: 1.1rem;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    z-index: 2;
    transform: translateY(-50%) rotate(45deg);
    transition: all 0.3s;
}

.button018 a:after {
    left: 0;
    background: #4d9bc1;
    z-index: 1;
    width: 3rem;
    height: 3rem;
    border-radius: 4rem;
    transform: translateY(-50%);
    transition: all 0.5s;
}

.button018 a span {
    position: relative;
    transition: all 0.3s;
    z-index: 3;
}

.button018 a:hover span {
    color: #fff;
}

.button018 a:hover:before {
    left: 2rem;
}

.button018 a:hover:after {
    right: 0;
    width: 100%;
}

.button018 {
    margin-bottom: 20px; /* 下に20pxのスペース */
}


/*--------------CF物件入力テーブル*/
.table_design07 {
  width: 100%;
  border-collapse: collapse;
  border: none;        /* ← ここで外枠を消す */
  margin-bottom: 25px;
  font-family: Arial, sans-serif;
}

.table_design07 th,
.table_design07 td {
  padding: 10px 12px;
  text-align: left;
  vertical-align: top;
  border: none;
  background-color: #e6f1f6;
}

.table_design07 th {
  background-color: #4d9bc1;
  color: #fff;
  font-weight: bold;
  border-radius: 6px 0 0 6px;
　
}

.table_design07 td {
  border-radius: 0 6px 6px 0;
}

/* --- PC: 各行を th + td の1セットで横並びにする（スマホは触らない） --- */
@media (min-width: 768px) {
  .table_design07 tr {
    display: flex;
    align-items: stretch; /* これで th と td の高さが揃う */
    margin-bottom: 12px; /* 行ごとの下余白（必要なら調整） */
	
  }

  .table_design07 tr > th,
  .table_design07 tr > td {
    margin: 0;            /* 隙間は作らない */
    box-sizing: border-box;
  }

  /* 見出し（左カラム）幅 */
  .table_design07 tr > th {
    width: 30%;           /* 必要に応じて 25% / 35% に調整してください */
    min-width: 120px;     /* 狭くなりすぎないように最小幅を指定 */
    padding: 10px 12px;
    text-align: left;
  }

  /* 値（右カラム）は残り幅を占有 */
  .table_design07 tr > td {
    flex: 1 1 0%;
    padding: 10px 12px;
  }
}

/* スマホ表示：縦積み */
@media (max-width: 767px) {
  .table_design07 tr {
    display: block;
    margin-bottom: 8px; /* 行ごとの下余白（必要なら調整） */
  }

  .table_design07 th,
  .table_design07 td {
    display: block;
    width: 100%;
    padding: 6px 10px;  /* 必要最低限の内側余白 */
    margin: 0;           /* thとtd間の余白を消す */
  }

  .table_design07 th {
    font-weight: bold;
    margin-bottom: 0;    /* th下の余白を消す */
    border-radius: 6px 6px 0 0;
  }

  .table_design07 td {
    border-radius: 0 0 6px 6px;
    margin-bottom: 8px;  /* th+tdセット下のスペースは均等に保持 */
  }
}
