.ttm-form,
.ttm-now,
.ttm-latest,
.ttm-works,
.ttm-success {
  box-sizing: border-box;
  max-width: 760px;
  margin: 20px auto;
  color: #202020;
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
}

.ttm-form {
  padding: clamp(20px, 4vw, 36px);
  border: 1px solid #d8d8d8;
  border-radius: 18px;
  background: #fff;
}

.ttm-form h2,
.ttm-latest h2 {
  margin: 0 0 12px;
  font-size: clamp(25px, 4vw, 34px);
}

.ttm-lead {
  margin: 0 0 24px;
  font-size: 17px;
  line-height: 1.8;
}

.ttm-form > label {
  display: block;
  margin: 0 0 22px;
}

.ttm-form > label > span {
  display: block;
  margin-bottom: 8px;
  font-size: 19px;
  font-weight: 700;
}

.ttm-form input[type="text"],
.ttm-form textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 14px 16px;
  border: 2px solid #888;
  border-radius: 10px;
  background: #fff;
  color: #202020;
  font-size: 18px;
  line-height: 1.6;
}

.ttm-form input:focus,
.ttm-form textarea:focus {
  outline: 4px solid rgba(49, 94, 232, .18);
  border-color: #315ee8;
}

.ttm-form fieldset {
  margin: 26px 0;
  padding: 18px;
  border: 1px solid #aaa;
  border-radius: 12px;
}

.ttm-form legend {
  padding: 0 8px;
  font-size: 19px;
  font-weight: 700;
}

.ttm-form fieldset label {
  display: block;
  margin: 12px 0;
  font-size: 17px;
  line-height: 1.6;
}

.ttm-form input[type="radio"] {
  width: 20px;
  height: 20px;
  margin-right: 7px;
  vertical-align: -4px;
}

.ttm-form button {
  display: block;
  width: 100%;
  padding: 16px 20px;
  border: 0;
  border-radius: 999px;
  background: #176b45;
  color: #fff;
  font-size: 19px;
  font-weight: 700;
  cursor: pointer;
}

.ttm-form button:hover,
.ttm-form button:focus {
  background: #0e5133;
}

.ttm-trap {
  position: absolute !important;
  left: -10000px !important;
}

.ttm-success {
  padding: 20px;
  border: 2px solid #4c946d;
  border-radius: 12px;
  background: #edf8f1;
  font-size: 18px;
  line-height: 1.8;
}

.ttm-now {
  padding: 22px;
  border: 1px solid #ddd;
  border-radius: 14px;
  background: #fff;
  text-align: center;
}

.ttm-now strong,
.ttm-now span {
  display: block;
}

.ttm-now strong {
  font-size: 26px;
}

.ttm-now span {
  margin-top: 6px;
  font-size: 17px;
}

.ttm-latest {
  padding: 22px;
  border-top: 3px solid #222;
}

.ttm-latest ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ttm-latest li {
  padding: 14px 0;
  border-bottom: 1px solid #ddd;
  line-height: 1.7;
}

.ttm-meta {
  display: block;
  margin-bottom: 3px;
  color: #666;
  font-size: 14px;
}

.ttm-artwork-upload{box-sizing:border-box;margin:18px 0;padding:20px;border:2px solid #4c946d;border-radius:14px;background:#fff}
.ttm-artwork-upload h3{margin:0 0 8px;font-size:21px}
.ttm-artwork-upload label,.ttm-artwork-upload label span{display:block;margin:12px 0;font-weight:700}
.ttm-artwork-upload input[type="file"]{width:100%;box-sizing:border-box;padding:12px;border:1px solid #999;border-radius:8px}
.ttm-artwork-upload button{width:100%;margin-top:14px;padding:14px;border:0;border-radius:999px;background:#176b45;color:#fff;font-size:18px;font-weight:700;cursor:pointer}

.ttm-works{max-width:1100px;padding:22px}
.ttm-works h2{margin:0 0 22px;font-size:clamp(26px,4vw,36px)}
.ttm-works-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.ttm-work-card{overflow:hidden;border:1px solid #ddd;border-radius:16px;background:#fff;box-shadow:0 5px 18px rgba(0,0,0,.06)}
.ttm-work-card a{display:block;background:#f4f4f4}
.ttm-work-card img{display:block;width:100%;height:auto}
.ttm-work-body{padding:16px;font-size:16px;line-height:1.7}
.ttm-work-body p{margin:0}
.ttm-work-meta{margin-bottom:7px!important;color:#666;font-size:13px}
.ttm-work-card[hidden]{display:none}
.ttm-works-more{display:block;min-width:240px;margin:28px auto 0;padding:14px 24px;border:1px solid #bca77e;border-radius:999px;background:#fffaf0;color:#222;font-size:17px;font-weight:700;cursor:pointer}
.ttm-works-more:hover,.ttm-works-more:focus{background:#f4ead7;outline:3px solid rgba(188,167,126,.25)}

@media (max-width: 600px) {
  .ttm-form {
    border-radius: 12px;
  }
  .ttm-works-grid{grid-template-columns:1fr}
}

@media (min-width:601px) and (max-width:900px){.ttm-works-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
