/* ==============================================
   recruit-new-section.css  — 全7セクション完全版
   1200px基準 vw単位
   1px = 0.08333vw  (100vw / 1200)
   ============================================== */

@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@500;700;900&family=Red+Hat+Display:wght@600&display=swap');

/* ---------- ベース ---------- */
.ns-wrapper *, .ns-wrapper *::before, .ns-wrapper *::after { box-sizing: border-box; }

/* 画面全体に固定枠（10px #005a98） */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  border: 10px solid #005a98;
  z-index: 9999;
  pointer-events: none;
  top: 111px;
}

/* フェードイン（上から） */
.ns-fadein {
  opacity: 0;
  transform: translateY(1.5em);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.ns-fadein.is-visible { opacity: 1; transform: translateY(0); }

/* フェードイン（左から） */
.ns-fadein-left {
  opacity: 0;
  transform: translateX(-3em);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.ns-fadein-left.is-visible { opacity: 1; transform: translateX(0); }

/* フェードイン（下から） */
.ns-fadein-bottom {
  opacity: 0;
  transform: translateY(3em);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.ns-fadein-bottom.is-visible { opacity: 1; transform: translateY(0); }

/* フェードイン（右から） */
.ns-fadein-right {
  opacity: 0;
  transform: translateX(3em);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.ns-fadein-right.is-visible { opacity: 1; transform: translateX(0); }

.ns-wrapper {
  font-family: 'Zen Maru Gothic', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif !important;
  color: #333;
  line-height: 1.75;
}

.ns-wrapper img { max-width: 100%; height: auto; display: block; }
.ns-wrapper p   { margin: 0 0 1em; }
.ns-wrapper p:last-child { margin-bottom: 0; }
.ns-wrapper h2, .ns-wrapper h3, .ns-wrapper h4 { margin: 0; }

.ns-container {
  max-width: 81.67vw;
  margin: 0 auto;
  padding: 0 2.5vw;
}


/* ==============================================
   共通見出し
   ============================================== */
.ns-heading { text-align: center; margin-bottom: 4.17vw; }

.ns-h-en {
  display: block;
  font-family: 'Zen Maru Gothic', 'Helvetica Neue', Arial, sans-serif !important;
  font-size: 2.33vw;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1;
  margin-bottom: 0.5vw;
}
.ns-h-en--blue { color: #1e5fa6; }
.ns-h-en--dark { color: #1e5fa6; }

.ns-h-ja {
  display: block;
  font-family: 'Zen Maru Gothic', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif !important;
  font-size: 1vw;
  color: #aaa;
  letter-spacing: 0.1em;
  margin: 0;
}

.ns-jobs-en {
  font-family: 'Zen Maru Gothic', 'Helvetica Neue', Arial, sans-serif !important;
  font-size: 2.33vw;
  font-weight: 900;
  color: #005a98;
  letter-spacing: 0.1em;
  line-height: 1;
  margin-bottom: 0.33vw;
}
.ns-jobs-ja {
  font-family: 'Zen Maru Gothic', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif !important;
  font-size: 1.08vw;
  color: #1e3953;
  margin: 0;
}


/* ==============================================
   SEC 1: CEO MESSAGE
   ============================================== */
.ns-flow--ngtk {
  margin-top: 0;
  margin-bottom: 0;
}
.ns-flow-inner--ngtk {
  animation: flow-left 28s linear infinite;
}
.ns-flow-inner--ngtk span {
  font-family: 'Red Hat Display', sans-serif;
  font-weight: 600;
  font-size: 140px;
  background: linear-gradient(90deg, #005a98 0%, #d8f1ff 50%, #005a98 100%);
  background-attachment: fixed;
  background-size: 100vw 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: inline-block;
  line-height: 1.1;
}

.ns-ceo { padding: 5.83vw 0 6.67vw; }

.ns-ceo-layout {
  display: flex;
  gap: 3.33vw;
  align-items: flex-start;
}

.ns-ceo-img { flex: 0 0 35vw; }
.ns-ceo-img img { width: 100%; display: block; }

.ns-ceo-text {
  flex: 1;
  font-size: 1.17vw;
  line-height: 1.9;
  color: #333;
  position: relative;
}

.ns-ceo-logo {
  position: fixed;
  top: 50%;
  right: 15vw;
  transform: translateY(-50%);
  width: 30vw;
  pointer-events: none;
  z-index: -10;
  transition: width 0.05s linear, opacity 0.2s linear;
}
.ns-ceo-logo img { width: 100%; height: auto; display: block; }
.ns-ceo-logo.is-hidden { opacity: 0 !important; }

.ns-ceo-text p { position: relative; z-index: 1; margin-bottom: 1.4em; }
.ns-ceo-text p:last-child { margin-bottom: 0; }

.ns-ceo-sign { text-align: left !important; }


/* ==============================================
   SEC 2: OUR JOBS
   ============================================== */
.ns-jobs {
  position: relative;
  overflow: hidden;
  padding: 0 0 5.83vw;
  background: url('../images/recruit-n/bg-job.jpg') center / cover fixed;
}
.ns-jobs::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(105, 141, 162, 0.9);
  mix-blend-mode: screen;
  z-index: 0;
}
.ns-jobs-bg-text {
  position: absolute;
  top: -3vw;
  right: 0;
  font-family: 'Zen Maru Gothic', 'Helvetica Neue', Arial, sans-serif !important;
  font-size: 12vw;
  font-weight: 900;
  color: #fff;
  letter-spacing: 0.02em;
  line-height: 1;
  pointer-events: none;
  user-select: none;
  white-space: nowrap;
  z-index: 1;
}
.ns-jobs-head { padding-top: 10vw; margin-bottom: 2vw; position: relative; z-index: 3; text-align: center; }
.ns-jobs-body { display: flex; gap: 2.5vw; align-items: flex-start; margin-bottom: 3.33vw; position: relative; z-index: 3; }
.ns-jobs-left { flex: 0 0 39.67vw; font-size: 1.08vw; color: #1e3953; line-height: 1.85; background: rgb(255 255 255 / 40%); padding: 20px; border-radius: 8px;}
.ns-jobs-right { flex: 1; }
.ns-jobs-right img { width: 100%; border-radius: 0.25vw; }
.ns-jobs-qa { position: relative; z-index: 2; }
.ns-jobs-q-row { display: flex; align-items: center; gap: 1.17vw; margin-bottom: 1vw; }
.ns-q-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.83vw; height: 2.83vw;
  border-radius: 50%; background: #3a6ea8; color: #fff;
  font-size: 1.33vw; font-weight: 700; flex-shrink: 0;
}
.ns-q-text { font-size: 1.42vw; font-weight: 700; color: #fff; }
.ns-jobs-a-box { background: rgba(255,255,255,0.9); border-radius: 4.17vw; padding: 1.5vw 3.33vw; }
.ns-jobs-a-box p { font-size: 1.17vw; font-weight: 600; color: #222; margin: 0; }


/* ==============================================
   SEC 3: INTERVIEW
   ============================================== */
.ns-interview { padding: 5.83vw 0 0; background: #fff; overflow: hidden; }

.ns-iv-slider {
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.ns-iv-track {
  display: flex;
  width: max-content;
  animation: iv-scroll 28s linear infinite;
}

@keyframes iv-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.ns-iv-card {
  flex-shrink: 0;
  width: 28vw;
  margin: 0 0.67vw;
  overflow: hidden;
}
.ns-iv-photo { position: relative; overflow: hidden; height: 22vw; }
.ns-iv-photo img {
  position: absolute; right: 0; bottom: 0;
  height: 100%; width: auto;
  object-fit: cover; object-position: top right; display: block;
  transition: transform 0.4s ease;
}
.ns-iv-overlay-text { position: absolute; top: 1vw; left: 1vw; width: 55%; z-index: 1; transition: transform 0.4s ease; }
.ns-iv-overlay-text p { font-size: 1.5vw; font-weight: 700; color: #1e5fa6; line-height: 1.75; margin: 0; }
.ns-iv-name-bar {
  background: #1e3a5f; color: #fff;
  padding: 0.75vw 1.2vw;
  display: flex; flex-direction: column; gap: 0.17vw; text-align: center;
}
.ns-iv-name { font-size: 1.17vw; font-weight: 700; letter-spacing: 0.08em; }
.ns-iv-dept { font-size: 0.83vw; opacity: 0.82; }

.ns-flow-wrap { position: relative; top: -5vw; z-index: 0; pointer-events: none; }
.ns-flow { overflow: hidden; white-space: nowrap; }
.ns-flow-inner { display: inline-flex; white-space: nowrap; }
.ns-flow-inner span {
  font-family: 'Red Hat Display', sans-serif;
  font-weight: 600; font-size: 140px;
  letter-spacing: 0.02em; display: inline-block; line-height: 1.1;
}
.ns-flow--right-img {
  overflow: hidden;
  white-space: nowrap;
}
.ns-flow-inner--right-img {
  display: inline-flex;
  animation: flow-right-img 20s linear infinite;
}
.ns-flow-inner--right-img img {
  height: 140px;
  width: auto;
  display: block;
  flex-shrink: 0;
}
@keyframes flow-right-img {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.ns-flow-inner--left span {
  color: #e3edf4;
  -webkit-text-fill-color: #e3edf4;
}
.ns-flow-inner--right span {
  background: linear-gradient(90deg, #005a98 0%, #d8f1ff 50%, #005a98 100%);
  background-attachment: fixed;
  background-size: 100vw 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.ns-flow-inner--right { animation: flow-right 20s linear infinite; }
.ns-flow-inner--left  { animation: flow-left  20s linear infinite; }
@keyframes flow-right { 0%{transform:translateX(-50%)} 100%{transform:translateX(0)} }
@keyframes flow-left  { 0%{transform:translateX(0)}    100%{transform:translateX(-50%)} }


/* ==============================================
   SEC 4: WORK STYLE
   ============================================== */
.ns-workstyle { padding: 5.83vw 0 6.67vw; background: #fff; }
.ns-ws-stage { position: relative; width: 100%; height: 51.67vw; }
.ns-bbl { position: absolute; display: flex; flex-direction: column; align-items: center; gap: 0.83vw; }
.ns-bbl-c { border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.08vw; color: #fff; font-weight: 400; }
.ns-bc-dark-lg    { width: 11.67vw; height: 11.67vw; background: #1b4f8a; }
.ns-bc-dark-lg2   { width: 11.67vw; height: 11.67vw; background: #2a6aad; }
.ns-bc-dark-md    { width: 10vw;    height: 10vw;    background: #1b4f8a; }
.ns-bc-mid-lg     { width: 11.67vw; height: 11.67vw; background: #5a9ac8; }
.ns-bc-mid-md     { width: 10vw;    height: 10vw;    background: #6aaee0; }
.ns-bc-light-lg   { width: 11.67vw; height: 11.67vw; background: #a8cce0; }
.ns-bc-light-md   { width: 9.17vw;  height: 9.17vw;  background: #a8cce0; }
.ns-bc-lightest-md{ width: 9.17vw;  height: 9.17vw;  background: #cce0ef; }
.ns-bbl-lbl { display: flex; align-items: center; gap: 0.5vw; white-space: nowrap; }
.ns-bbl-lbl small  { font-size: 1vw; color: #3a6ea8; line-height: 1.2; }
.ns-bbl-lbl strong { font-size: 2.5vw; font-weight: 700; color: #1e5fa6; letter-spacing: -0.01em; }
.ns-bbl-lbl--pale small  { color: #9ab8cc; }
.ns-bbl-lbl--pale strong { color: #9ab8cc; }

/* バブル配置 — animation-fill-mode: forwards で opacity:1 のまま止まる */
.ns-bbl-1 { top: 14%; left: 0%;  animation: bk1  7.2s ease-in-out infinite; }
.ns-bbl-2 { top: 0%;  left: 24%; animation: bk2  9.4s ease-in-out infinite; }
.ns-bbl-3 { top: 8%;  left: 52%; animation: bk3  6.5s ease-in-out infinite; }
.ns-bbl-4 { top: 12%; left: 76%; animation: bk4 11.0s ease-in-out infinite; }
.ns-bbl-5 { top: 52%; left: 0%;  animation: bk5  8.3s ease-in-out infinite; }
.ns-bbl-6 { top: 42%; left: 22%; animation: bk6  9.8s ease-in-out infinite; }
.ns-bbl-7 { top: 46%; left: 52%; animation: bk7 12.5s ease-in-out infinite; }
.ns-bbl-8 { top: 60%; left: 36%; animation: bk8  6.8s ease-in-out infinite; }
.ns-bbl-9 { top: 62%; left: 78%; animation: bk9 10.6s ease-in-out infinite; }

/* opacity: 0→1→1 の長め滞在にして「常にほぼ見えている」状態に */
@keyframes bk1 { 0%{opacity:.3} 30%{opacity:1} 70%{opacity:1} 100%{opacity:.3} }
@keyframes bk2 { 0%{opacity:.3} 25%{opacity:1} 75%{opacity:1} 100%{opacity:.3} }
@keyframes bk3 { 0%{opacity:.3} 35%{opacity:1} 65%{opacity:1} 100%{opacity:.3} }
@keyframes bk4 { 0%{opacity:.3} 20%{opacity:1} 80%{opacity:1} 100%{opacity:.3} }
@keyframes bk5 { 0%{opacity:.3} 30%{opacity:1} 70%{opacity:1} 100%{opacity:.3} }
@keyframes bk6 { 0%{opacity:.3} 25%{opacity:1} 75%{opacity:1} 100%{opacity:.3} }
@keyframes bk7 { 0%{opacity:.3} 20%{opacity:1} 80%{opacity:1} 100%{opacity:.3} }
@keyframes bk8 { 0%{opacity:.3} 30%{opacity:1} 70%{opacity:1} 100%{opacity:.3} }
@keyframes bk9 { 0%{opacity:.3} 25%{opacity:1} 75%{opacity:1} 100%{opacity:.3} }


/* ==============================================
   SEC 5: CHARM
   ============================================== */
.ns-charm { padding: 5.83vw 0 6.67vw; background: #fff; }
.ns-charm-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2vw; }
.ns-charm-col { display: flex; flex-direction: column; }
.ns-charm-img-box { border: 0.13vw solid #2d6ea8; overflow: hidden; margin-bottom: 1.33vw; aspect-ratio: 4/3; display: flex; align-items: center; justify-content: center; }
.ns-charm-img-box img { width: 100%; height: 100%; object-fit: cover; }
.ns-charm-title { font-family: 'Zen Maru Gothic', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif !important; font-size: 1.33vw; font-weight: 700; color: #1e5fa6; text-align: center; margin-bottom: 0.83vw; }
.ns-charm-text { font-size: 1.08vw; line-height: 1.75; color: #444; text-align: center; margin: 0; }


/* ==============================================
   SEC 6: BENEFITS
   ============================================== */
.ns-benefits { padding: 5.83vw 0 6.67vw; background: #fff; }
.ns-persons { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2vw; margin-bottom: 3.67vw; }
.ns-person { position: relative; overflow: hidden; }
.ns-person-img img { width: 100%; aspect-ratio: 4/4; object-fit: cover; display: block; }
.ns-person-bar { background: #1e3a5f; color: #fff; padding: 0.83vw 1.17vw; display: flex; flex-direction: column; gap: 0.17vw; text-align: center; align-items: center; }
.ns-person-name { font-size: 1.17vw; font-weight: 700; letter-spacing: 0.05em; }
.ns-person-dept  { font-size: 0.92vw; opacity: 0.85; }
.ns-benefits-qa { display: flex; flex-direction: column; gap: 4vw; }
.ns-bq-q { display: flex; align-items: center; gap: 1.17vw; margin-bottom: 1.17vw; }
.ns-bq-label { font-size: 1.33vw; font-weight: 700; color: #1a1a1a; }
.ns-bq-voices { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5vw; }
.ns-bq-voice { border: 0.08vw solid #ddd; border-radius: 0.5vw; padding: 1.5vw 1.67vw; font-size: 1.08vw; line-height: 1.75; color: #444; }
.ns-voice-name-tag { display: inline-block; background: #6ab04c; color: #fff; font-size: 1vw; font-weight: 600; padding: 0.17vw 1.17vw; border-radius: 0.17vw; margin-bottom: 0.83vw; }


/* ==============================================
   SEC 7: RECRUITMENT TYPE
   ============================================== */
.ns-rt { padding: 5.83vw 0 6.67vw; background: #fff; }
.ns-rt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2vw; transition: grid-template-columns 0.4s ease; }
.ns-rt-grid:has(.ns-rt-card--fresh:hover)  { grid-template-columns: 1.15fr 0.85fr; }
.ns-rt-grid:has(.ns-rt-card--career:hover) { grid-template-columns: 0.85fr 1.15fr; }
.ns-rt-card { border-radius: 0.67vw; overflow: hidden; display: flex; flex-direction: column; }
.ns-rt-card--fresh  { background: #7dc44a; }
.ns-rt-card--career { background: #3a85c8; }
.ns-rt-img { background: #fff; margin: 1.17vw 1.17vw 0; border-radius: 0.5vw; overflow: hidden; }
.ns-rt-img img { width: 100%; display: block; aspect-ratio: 16/7; object-fit: cover; }
.ns-rt-title-bar { padding: 1.33vw 1.67vw 1vw; text-align: center; }
.ns-rt-title-bar h3 { font-family: 'Zen Maru Gothic', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif !important; font-size: 1.67vw; font-weight: 500; color: #fff; line-height: 1.2; }
.ns-rt-bold { font-weight: 800; }
.ns-rt-text-box { background: #fff; border-radius: 0.5vw; margin: 0 1.17vw; padding: 1.33vw 1.5vw; font-size: 1.08vw; line-height: 1.75; color: #333; flex: 1; }
.ns-rt-btn { display: block; text-align: center; padding: 1.33vw; margin: 1.17vw; border-radius: 0.33vw; font-size: 1.25vw; font-weight: 700; color: #fff; text-decoration: none; transition: opacity .2s; }
.ns-rt-btn:hover { opacity: .85; text-decoration: none; color: #fff; }
.ns-rt-btn--fresh  { background: #3d6e10; }
.ns-rt-btn--career { background: #1a3f70; }
.recruit-video {
    width: 100% !important;
    height: auto !important;
    max-width: 100%;
    object-fit: contain;
}


/* ==============================================
   レスポンシブ (768px以下)
   ============================================== */
@media (max-width: 767px) {
  body::before { top: 52px; }
  .ns-container { max-width: 100%; padding: 0 20px; }
  .ns-h-en    { font-size: 28px !important; }
  .ns-h-ja    { font-size: 14px; }
  .ns-heading { margin-bottom: 30px; }
  .ns-jobs-en { font-size: 28px !important; }
  .ns-jobs-ja { font-size: 14px; }

  .ns-ceo { padding: 40px 0 50px; }
  .ns-ceo-layout { flex-direction: column; }
  .ns-ceo-img { width: 100%; flex: none; }
  .ns-ceo-text { font-size: 13px; }
  .ns-ceo-logo { display: none; }

  .ns-jobs { padding: 40px 0 50px; }
  .ns-jobs-bg-text { font-size: 52px; top: -6px; right: -10px; }
  .ns-jobs-body { flex-direction: column; gap: 20px; margin-bottom: 24px; }
  .ns-jobs-left { flex: none; width: 100%; font-size: 13px; }
  .ns-q-icon { width: 30px; height: 30px; font-size: 14px; }
  .ns-q-text { font-size: 14px; }
  .ns-jobs-q-row { gap: 10px; }
  .ns-jobs-a-box { padding: 14px 20px; border-radius: 30px; }
  .ns-jobs-a-box p { font-size: 13px; }

  .ns-interview { padding: 40px 0 0; }
  .ns-iv-card { width: 240px; margin: 0 6px; }
  .ns-iv-photo { height: 46vw; }
  .ns-iv-photo img { height: 170px; }
  .ns-iv-overlay-text p { font-size: 14px; }
  .ns-iv-name { font-size: 13px; }
  .ns-iv-dept { font-size: 10px; }
  .ns-flow-inner span { font-size: 40px; }

  .ns-workstyle { padding: 40px 0 50px; }
  .ns-ws-stage { height: 350vw; }

  .ns-bc-dark-lg,
  .ns-bc-dark-lg2,
  .ns-bc-mid-lg,
  .ns-bc-light-lg   { width: 120px; height: 120px; }
  .ns-bc-dark-md,
  .ns-bc-mid-md     { width: 100px; height: 100px; }
  .ns-bc-light-md,
  .ns-bc-lightest-md{ width:  80px; height:  80px; }

  .ns-bbl-c         { font-size: 13px; }
  .ns-bbl-lbl strong{ font-size: 22px; }
  .ns-bbl-lbl small { font-size: 11px; }
  .ns-bbl           { gap: 8px; }

  .ns-bbl-1 { top:  2%;  left:  5%; }
  .ns-bbl-2 { top:  8%;  left: 45%; }
  .ns-bbl-3 { top: 18%;  left: 10%; }
  .ns-bbl-4 { top: 26%;  left: 52%; }
  .ns-bbl-5 { top: 36%;  left:  2%; }
  .ns-bbl-6 { top: 45%;  left: 42%; }
  .ns-bbl-7 { top: 55%;  left: 15%; }
  .ns-bbl-8 { top: 64%;  left: 48%; }
  .ns-bbl-9 { top: 74%;  left:  8%; }

  .ns-charm { padding: 40px 0 50px; margin-top: -270px;}
  .ns-charm-grid { grid-template-columns: 1fr; gap: 20px; }
  .ns-charm-title { font-size: 15px; }
  .ns-charm-text  { font-size: 13px; }
  .ns-charm-img-box { margin-bottom: 12px; border-width: 1px; }

  .ns-benefits { padding: 40px 0 50px; }
  .ns-persons { grid-template-columns: repeat(2, 1fr); margin-bottom: 30px; }
  .ns-person-name { font-size: 13px; }
  .ns-person-dept { font-size: 10px; }
  .ns-person-bar { padding: 8px 10px; }
  .ns-benefits-qa { gap: 24px; }
  .ns-bq-label { font-size: 14px; }
  .ns-bq-q { gap: 10px; margin-bottom: 10px; }
  .ns-bq-voices { grid-template-columns: 1fr; gap: 10px; }
  .ns-bq-voice { padding: 14px 16px; font-size: 13px; border-width: 1px; border-radius: 4px; }
  .ns-voice-name-tag { font-size: 11px; padding: 2px 10px; margin-bottom: 8px; }

  .ns-rt { padding: 40px 0 50px; }
  .ns-rt-grid { grid-template-columns: 1fr; gap: 20px; }
  .ns-rt-card { border-radius: 6px; }
  .ns-rt-img { margin: 10px 10px 0; border-radius: 4px; }
  .ns-rt-title-bar { padding: 12px 16px 10px; }
  .ns-rt-title-bar h3 { font-size: 17px; }
  .ns-rt-text-box { margin: 0 10px; padding: 14px 16px; font-size: 13px; border-radius: 4px; }
  .ns-rt-btn { font-size: 14px; padding: 13px; margin: 10px; border-radius: 3px; }
}
