@charset "utf-8";
/* CSS Document 320-500*/


.headbox .kakomi{margin: 0 5% 40px; border: 1px solid #a8cf3f}
.headbox h2{line-height: 1.4; padding: 20px 0 20px 5% ; font-size: clamp(1.75rem, 0.972rem + 3.89vw, 2.188rem)}/*28-35*/
.headbox .sub{padding: 0px 0 20px 5%; font-size: clamp(0.938rem, 0.604rem + 1.67vw, 1.125rem)}/*15-18*/
.headbox .prifle{position: relative; margin: 20px 5%; align-items: flex-start; display: flex; justify-content: space-between; background: #f4ffd8; padding: 10px}
.headbox .pril{width:63%; font-size: 12px ; letter-spacing: normal}
.headbox .pril span{font-size:clamp(1.125rem, 0.569rem + 2.78vw, 1.438rem) }/*18-23*/
.headbox .prifle img{width:110px; position: absolute; right: 0; bottom: -10px;}

.iconBox .serifu{font-size: clamp(0.875rem, 0.764rem + 0.56vw, 0.938rem)}/*14-15*/
.first .text{text-align: center; margin-bottom: 20px; font-size:clamp(0.938rem, 0.493rem + 2.22vw, 1.188rem)}/*15-19*/
.first .iconBox{margin: 0 8% 0px }
.first .iconBox .serifu{letter-spacing: normal}

.imgnayami{margin: 0 5% 60px}

.tetu{text-align: center}
.tetu h2{margin-bottom: 20px; font-size: clamp(1.25rem, 0.472rem + 3.89vw, 1.688rem)}/*20-27*/
.tetu .meri1{text-align: left; margin-top: 20px; position: relative}
.tetu .meri1 h3{font-weight: 600; margin: 0 0 0px 8%; font-size:clamp(1rem, 0.111rem + 4.44vw, 1.5rem)}/*16-24*/
.tetu .meri1 .pointimg{width: 67px; margin-left: 8%}
.tetu .meri1 .sub{margin: 0 0 20px 8%}
.tetu .meri1 .hito{position: absolute; right: 0; top: 0; width: 185px }
.tetu .img{margin: 0 8% 20px}
.tetu .iconBox{margin: 0 8% 50px}


.teian{text-align: center; padding: 0px 0 60px}
.teian .meri1{text-align: left; margin-top: 50px}
.teian .meri1 h3{font-weight: 600; margin: 0 0 0px 8%; font-size:clamp(1rem, 0.111rem + 4.44vw, 1.5rem)}/*16-24*/
.teian  .meri1 .sub{margin-left: 8%}
.teian .meri1 .pointimg{width: 67px; margin-left: 8%}
.teian .gyouseif dl{display: flex; justify-content: space-between; position: relative; padding: 30px 8% 0 3% ; align-items: baseline}
.teian .gyouseif .tate{font-weight: 600; position: absolute; right: 8%; top:30px; text-align: left; font-size: clamp(0.938rem, 0.604rem + 1.67vw, 1.125rem)}/*15-18*/
.teian .gyouseif dt{width: 30%; margin-top: 50px}
.teian .gyouseif dt img{ display:block; }
.teian .gyouseif dd{width: 68%; position: absolute; left: 32%; bottom: 20px; text-align: left}
.teian .gyouseif dd .tit{font-weight: 600; font-size: clamp(0.938rem, 0.604rem + 1.67vw, 1.125rem)}/*15-18*/

.teian .renkeibg{margin-top: -150px ; background: url("../img/top/bg.png") repeat-y left top; padding: 150px 0 20px}
.teian .renkei{margin: 0 8% 0 ; background: #fff; border: 1px solid #a8cf3f}
.teian .renkei .text{background:#a8cf3f; padding: 20px 0; color: #fff; font-size: clamp(0.938rem, 0.604rem + 1.67vw, 1.125rem)}/*15-18*/
.teian .renkei .rent{padding: 20px 0 0 ; font-size: clamp(0.938rem, 0.604rem + 1.67vw, 1.125rem)}/*15-18*/
.teian .renkei dl{ margin:20px 5% 0; text-align: left; display: flex; justify-content: space-between }
.teian .renkei dt{width: 22%}
.teian .renkei dd{letter-spacing: normal; margin-top: -5px; width: 75%; font-size:clamp(0.813rem, 0.59rem + 1.11vw, 0.938rem)}/*13-15*/
.teian .renkei dd .name{font-weight: 600; font-size:clamp(1rem, 0.778rem + 1.11vw, 1.125rem)}/*16-18*/
.teian .renkei .atte{text-align: left; padding: 20px 5% 40px; font-size: 13px}
.teian .renkei .fun{background: #f4ffd8; padding: 10px 20px ; text-align: left; margin: 20px 5%}
.teian .renkei .fun span{font-size: 17px; font-weight: 600}



.pointi{width:67px }

.kigen{margin: 0 5%;}
.kigen h2{margin-bottom: 20px; font-size: clamp(1.25rem, 0.472rem + 3.89vw, 1.688rem)}/*20-27*/
  /* ── Table ── */
  .deadline-table {
  box-sizing: border-box;
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    border-radius: 6px ;
    overflow: hidden;
  }
 
  .deadline-table thead th {
    background: #1d9f10;
    color: #fff;
    font-size:18px;
    font-weight: 600;
    padding: 5px 20px;
    text-align: left;
  }
 
  .deadline-table thead th:last-child {
    text-align: right;
  }
 
  .deadline-table tbody tr {
    transition: background 0.2s ease;
  }
 
  .deadline-table tbody tr:hover {
    background: #faf8f5;
  }
 
  .deadline-table tbody td {
    padding: 10px 0 10px;
    vertical-align: middle; text-align:left
  }
  .deadline-table tbody td.tl{white-space: nowrap; font-size: clamp(1rem, 0.778rem + 1.11vw, 1.125rem)}/*16-18*/
  .deadline-table tbody td:last-child {
    text-align:right;
    color: #b08d57;
    white-space: nowrap;font-size: 11px
  }
   .deadline-table tbody td:last-child span{font-size: 14px}
  /* ── 期限バッジ（緊急度で色分け） ── */
  .deadline-badge {
    display: inline-block;
    padding: 4px 14px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.04em;
  }
 
  .deadline-badge--urgent {
    background: #fdf0ed;
    color: #c0392b;
  }
 
  .deadline-badge--warning {
    background: #fef9ec;
    color: #b8860b;
  }
 
  .deadline-badge--normal {
    background: #eef5f0;
    color: #27764b;
  }


.support{text-align: center}
.support h2{margin-bottom: 20px; font-size:clamp(1.125rem, 0.236rem + 4.44vw, 1.625rem)}/*18-26*/
.support .spbox{padding: 20px 0; background: url("../img/souzoku/bg.jpg") repeat-y left top; }
.support dl{display: flex; margin: 20px 5% }
.support dt{width: 20%}
.support dd{width: 80%; text-align: left; }
.support dd h3{padding-bottom: 10px; border-bottom: 1px solid #a8cf3f; padding-left: 15px; font-weight: 700; font-size:clamp(1.063rem, 0.729rem + 1.67vw, 1.25rem) }/*17-20*/
.support dd ul{margin-top: 10px}
.support dd li{list-style: disc; margin-left: 30px; line-height: 1.6; margin-bottom: 10px}
.support dd li span{font-size: 11px}
.support .price{border: 1px solid #a8cf3f; border-radius: 6px; padding: 0 5% 20px ; margin: 0 5%;}
.support .price .kakaku{color: #fff; display: flex; justify-content: space-between;  background: #a8cf3f; padding: 10px 20px; position: relative; top: -20px; border-radius: 6px; align-items: center; flex-flow: wrap }
.support .price .kakaku .kal{width: 65%; font-size: 13px; text-align: left}
.support .price .kakaku .kal span{font-size: 24px; letter-spacing: normal}
.support .price .kakaku .tax{ width: 35%; text-align: right; font-size: 13px}
.support .price .tit{width: 100%; text-align: left;}
.support .price ul{margin-top: 10px; letter-spacing: normal}
.support .price ul:last-child{border-top:1px solid #a8cf3f; padding-top: 10px}
.support .price li{text-align: left; list-style: disc; margin-left: 20px; line-height: 1.4; margin-bottom: 5px; font-size: 14px}

.mess .iconBox{margin: 40px 8% 30px}
.mess .iconBox:last-child{margin:30px 8% 50px}
.mess .iconBox .serifu{ font-size:clamp(0.875rem, 0.764rem + 0.56vw, 0.938rem)}/*14-15*/
.mess .iconBox .serifu img{width: 14px; vertical-align: middle; margin-top: -2px}
.mess .text01{margin: 0 8%}
.mess .sime{margin-bottom: 20px}

.flow{ text-align: center; padding-bottom: 20px}
.flow h2{font-size:clamp(1.75rem, 0.972rem + 3.89vw, 2.188rem) }/*28-35*/
.flow .flowBox{margin: 30px 5% 50px }
.flow .fbox{
    --x-gradient: linear-gradient(90deg, #1d9f10 0 100%);
    --y-gradient: linear-gradient(#1d9f10 0 15px, transparent 0 calc(100% - 15px), #1d9f10 calc(100% - 15px));
    position: relative;
    padding: 20px 0;
    background-image:
        var(--x-gradient),
        var(--y-gradient),
        var(--x-gradient),
        var(--y-gradient);
    background-repeat: no-repeat;
    background-size: 100% 2px, 2px 100%, 100% 2px, 2px 100%;
    background-position: top, right, bottom, left;
}
.flow li{position: relative; text-align: left; border-bottom: 1px solid #1d9f10 ; padding: 0 0 30px 5%; margin: 30px 0 }
.flow li:last-child{border: none; padding-bottom: 0}
.flow li .img{position: absolute; width:23px; left: -5%; top: 0 }
.flow li .tate{position: absolute; right: 0; top: 0 }
.flow .soudanBox{padding: 0}
.flow .cont li{border: none; padding: 0; text-align: center; margin: 0 0 10px}
.flow li h3{margin-bottom: 20px; font-weight: 600; font-size:clamp(1.188rem, 0.743rem + 2.22vw, 1.438rem)}/*19-23*/
.flow li .pic img{border-radius: 6px; margin-bottom: 20px}
.flow li .iconBox {margin-top: 20px;}
.flow li .iconBox .serifu{ font-size:clamp(0.875rem, 0.764rem + 0.56vw, 0.938rem)}/*14-15*/
.flow .smalltext{ line-height: 1.7; font-size: 13px; background:#f4ffd8; padding: 20px; margin: 20px 0 }

.sime{margin: 20px 0 40px; text-align: center; font-size: clamp(1rem, 0.556rem + 2.22vw, 1.25rem) }/*16-20*/



@media (min-width: 500px) {
.sime { margin: 60px 0 40px;}
.headbox h2{line-height: 1.6}

.scene{padding: 60px 8%}
}