@charset "utf-8";
/* section note */
:root{
  --yl-primary:#2f7f6e;
  --yl-primary-dark:#1f5c50;
  --yl-primary-deep:#0d332c;
  --yl-accent:#e88f31;
  --yl-accent-2:#b9c778;
  --yl-ink:#242a29;
  --yl-muted:#6a7673;
  --yl-line:#e4e9e7;
  --yl-bg-soft:#f5f8f7;
  --yl-bg-card:#ffffff;
  --yl-radius:8px;
  --yl-max:1200px;
  --yl-shadow:0 2px 14px rgba(23,56,50,.07);
  --yl-shadow-hover:0 6px 22px rgba(23,56,50,.13);
}
*{box-sizing:border-box;}
.yl-wrap{max-width:var(--yl-max);margin:0 auto;padding:0 16px;}
.yl-main{min-height:420px;}
img{max-width:100%;height:auto;}
a{color:var(--yl-primary);text-decoration:none;}
a:hover{color:var(--yl-accent);}

/* section note */
.yl-topline{background:var(--yl-primary-deep);color:#cfe0db;font-size:13px;line-height:34px;}
.yl-topline .yl-wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.yl-topline b{color:#fff;font-weight:600;}

/* section note */
.yl-header{background:#fff;border-bottom:1px solid var(--yl-line);position:relative;z-index:60;}
.yl-hd-in{display:flex;align-items:center;gap:26px;min-height:76px;}
.yl-logo{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.yl-logo img{display:block;}
.yl-logo-t b{display:block;font-size:20px;letter-spacing:1px;color:var(--yl-primary-deep);line-height:1.2;}
.yl-logo-t i{display:block;font-style:normal;font-size:11px;letter-spacing:2.4px;color:var(--yl-muted);}

.yl-nav{display:flex;align-items:stretch;list-style:none;margin:0;padding:0;flex:1;}
.yl-nav>li{position:relative;}
.yl-nav>li>a{display:flex;align-items:center;height:76px;padding:0 18px;font-size:16px;color:var(--yl-ink);position:relative;}
.yl-nav>li>a:hover,.yl-nav>li.on>a{color:var(--yl-primary);}
.yl-nav>li>a::after{content:"";position:absolute;left:18px;right:18px;bottom:16px;height:2px;background:var(--yl-accent);transform:scaleX(0);transition:transform .18s;}
.yl-nav>li.on>a::after,.yl-nav>li>a:hover::after{transform:scaleX(1);}
.yl-nav .mega{position:absolute;top:76px;left:50%;transform:translateX(-50%);background:#fff;border:1px solid var(--yl-line);
  border-top:2px solid var(--yl-primary);box-shadow:var(--yl-shadow-hover);min-width:200px;padding:8px 0;
  opacity:0;visibility:hidden;transition:.16s;}
.yl-nav>li:hover .mega{opacity:1;visibility:visible;}
.yl-nav .mega a{display:block;padding:9px 20px;font-size:14px;color:var(--yl-ink);white-space:nowrap;}
.yl-nav .mega a:hover{background:var(--yl-bg-soft);color:var(--yl-primary);padding-left:24px;transition:.15s;}

.yl-hd-r{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.yl-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 20px;
  background:var(--yl-accent);color:#fff;font-size:15px;border-radius:var(--yl-radius);transition:.16s;}
.yl-btn:hover{background:#d57d22;color:#fff;}
.yl-btn-ghost{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;
  border:1px solid var(--yl-line);border-radius:var(--yl-radius);color:var(--yl-ink);font-size:15px;transition:.16s;}
.yl-btn-ghost:hover{border-color:var(--yl-primary);color:var(--yl-primary);}

.yl-burger{display:none;width:44px;height:44px;border:1px solid var(--yl-line);background:#fff;border-radius:var(--yl-radius);
  cursor:pointer;padding:11px 10px;}
.yl-burger span{display:block;height:2px;background:var(--yl-ink);margin:3px 0;}
.yl-mnav{display:none;border-top:1px solid var(--yl-line);}
.yl-mnav a{display:block;padding:13px 20px;font-size:15px;color:var(--yl-ink);border-bottom:1px solid var(--yl-line);}
.yl-mnav a.on{color:var(--yl-primary);font-weight:600;background:var(--yl-bg-soft);}
.yl-mnav.open{display:block;}

/* ---------------- Hero ---------------- */
.yl-hero{background-color:var(--yl-primary-deep);background-size:cover;background-position:center;
  color:#fff;padding:58px 0 62px;}
.yl-hero h1{font-size:32px;line-height:1.3;margin:10px 0 12px;font-weight:700;}
.yl-hero p{max-width:760px;font-size:15px;line-height:1.9;color:#d8e5e1;}
.yl-crumb{font-size:13px;color:#b9cdc8;margin-bottom:6px;}
.yl-crumb a{color:#d8e5e1;}
.yl-crumb a:hover{color:#fff;}

/* section note */
.yl-crumb-dark{background:var(--yl-bg-soft);border-bottom:1px solid var(--yl-line);font-size:13px;color:var(--yl-muted);line-height:40px;}
.yl-crumb-dark a{color:var(--yl-muted);margin:0 4px;}
.yl-crumb-dark a:hover{color:var(--yl-primary);}

/* section note */
.yl-sec{padding:56px 0;}
.yl-sec-soft{background:var(--yl-bg-soft);}
.yl-sec-h{text-align:center;margin-bottom:34px;}
.yl-sec-h .yl-kick{font-size:12px;letter-spacing:3px;color:var(--yl-accent);font-weight:700;margin-bottom:8px;}
.yl-sec-h h2{font-size:27px;color:var(--yl-ink);margin:0 0 12px;font-weight:700;}
.yl-sec-h .yl-sec-p{max-width:760px;margin:0 auto;font-size:14px;line-height:1.9;color:var(--yl-muted);}
.yl-sec-h::after{content:"";display:block;width:56px;height:3px;background:var(--yl-accent);margin:16px auto 0;border-radius:2px;}

/* section note */
.yl-grid{display:grid;gap:22px;}
.yl-g3{grid-template-columns:repeat(3,1fr);}
.yl-g4{grid-template-columns:repeat(4,1fr);}
.yl-g2{grid-template-columns:repeat(2,1fr);}

.yl-card{background:var(--yl-bg-card);border:1px solid var(--yl-line);border-radius:var(--yl-radius);overflow:hidden;
  transition:.18s;display:flex;flex-direction:column;}
.yl-card:hover{box-shadow:var(--yl-shadow-hover);transform:translateY(-2px);border-color:#d0ded9;}
.yl-card-img{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--yl-bg-soft);}
.yl-card-img img{width:100%;height:100%;object-fit:cover;display:block;transition:.3s;}
.yl-card:hover .yl-card-img img{transform:scale(1.04);}
.yl-card-b{padding:16px 18px 18px;flex:1;display:flex;flex-direction:column;}
.yl-card-b h3{font-size:16px;margin:0 0 8px;color:var(--yl-ink);font-weight:600;line-height:1.45;}
.yl-card-b p{font-size:13px;color:var(--yl-muted);line-height:1.85;margin:0 0 12px;flex:1;}
.yl-card-f{display:flex;align-items:center;justify-content:space-between;border-top:1px dashed var(--yl-line);padding-top:12px;}
.yl-price{color:var(--yl-accent);font-size:14px;font-weight:700;}
.yl-price b{font-size:20px;}
.yl-more{font-size:13px;color:var(--yl-primary);}
.yl-tag{display:inline-block;background:#eaf4f1;color:var(--yl-primary-dark);font-size:12px;
  padding:3px 9px;border-radius:20px;margin:0 6px 6px 0;}


.yl-was{color:#9aa6a3;font-size:12px;text-decoration:line-through;margin-left:6px;font-weight:400;}
.yl-now{font-weight:700;}

/* section note */
.yl-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center;}
.yl-stat{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--yl-radius);padding:22px 10px;}
.yl-stat b{display:block;font-size:30px;color:#fff;font-weight:700;line-height:1.2;}
.yl-stat i{font-style:normal;font-size:13px;color:#c2d6d0;}

/* section note */
.yl-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.yl-step{background:#fff;border:1px solid var(--yl-line);border-radius:var(--yl-radius);padding:20px;}
.yl-step b{display:inline-block;width:34px;height:34px;line-height:34px;text-align:center;border-radius:50%;
  background:var(--yl-primary);color:#fff;font-weight:600;margin-bottom:10px;}
.yl-step h4{font-size:15px;margin:0 0 6px;color:var(--yl-ink);}
.yl-step p{font-size:13px;color:var(--yl-muted);line-height:1.8;margin:0;}

/* section note */
.yl-spec{width:100%;border-collapse:collapse;font-size:14px;background:#fff;}
.yl-spec th,.yl-spec td{border:1px solid var(--yl-line);padding:11px 14px;text-align:left;line-height:1.7;}
.yl-spec th{width:160px;background:var(--yl-bg-soft);color:var(--yl-ink);font-weight:600;}
.yl-spec td{color:var(--yl-muted);}

/* section note */
.yl-form{background:#fff;border:1px solid var(--yl-line);border-radius:var(--yl-radius);padding:26px;}
.yl-form .fr{margin-bottom:16px;}
.yl-form label{display:block;font-size:14px;color:var(--yl-ink);margin-bottom:6px;font-weight:600;}
.yl-form label i{color:var(--yl-accent);font-style:normal;margin-left:2px;}
.yl-form input[type=text],.yl-form input[type=tel],.yl-form input[type=password],.yl-form input[type=email],
.yl-form select,.yl-form textarea{width:100%;min-height:44px;padding:10px 12px;border:1px solid var(--yl-line);
  border-radius:6px;font-size:14px;color:var(--yl-ink);background:#fff;}
.yl-form textarea{min-height:110px;resize:vertical;}
.yl-form input:focus,.yl-form textarea:focus,.yl-form select:focus{outline:none;border-color:var(--yl-primary);}
.yl-form .hint{font-size:12px;color:var(--yl-muted);margin-top:5px;}
.yl-cap{display:flex;align-items:center;gap:10px;}
.yl-cap canvas{border:1px solid var(--yl-line);border-radius:6px;cursor:pointer;}
.yl-check{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--yl-muted);}
.yl-check input{margin-top:3px;}
.yl-check a{color:var(--yl-primary);}
.yl-err{color:#d24a43;font-size:13px;margin-top:6px;display:none;}
.yl-ok{color:var(--yl-primary-dark);font-size:14px;}

/* section note */
.yl-detail{display:grid;grid-template-columns:440px 1fr;gap:34px;align-items:start;}
.yl-detail-img{border:1px solid var(--yl-line);border-radius:var(--yl-radius);overflow:hidden;background:var(--yl-bg-soft);}
.yl-detail-img img{width:100%;display:block;}
.yl-detail-b h1{font-size:24px;color:var(--yl-ink);margin:0 0 6px;line-height:1.4;}
.yl-detail-b .yl-sub{font-size:14px;color:var(--yl-muted);line-height:1.85;margin-bottom:16px;}
.yl-priceband{background:var(--yl-bg-soft);border:1px solid var(--yl-line);border-radius:var(--yl-radius);
  padding:16px 18px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:18px;}
.yl-priceband .yl-price{font-size:14px;}
.yl-priceband .yl-price b{font-size:26px;}
.yl-priceband small{color:var(--yl-muted);font-size:12px;}
.yl-prose p{font-size:15px;line-height:2.0;color:#3b4442;margin:0 0 14px;}
.yl-prose h3{font-size:18px;color:var(--yl-ink);margin:26px 0 12px;font-weight:600;}

.yl-note{font-size:13px;color:var(--yl-muted);line-height:1.9;background:var(--yl-bg-soft);
  border-left:3px solid var(--yl-accent);padding:12px 16px;border-radius:0 6px 6px 0;}

/* ---------------- FAQ ---------------- */
.yl-faq{max-width:860px;margin:0 auto;}
.yl-faq details{background:#fff;border:1px solid var(--yl-line);border-radius:var(--yl-radius);margin-bottom:12px;padding:0 18px;}
.yl-faq summary{cursor:pointer;font-size:15px;color:var(--yl-ink);font-weight:600;padding:16px 0;list-style:none;position:relative;padding-right:34px;}
.yl-faq summary::-webkit-details-marker{display:none;}
.yl-faq summary::after{content:"+";position:absolute;right:6px;top:14px;font-size:20px;color:var(--yl-accent);}
.yl-faq details[open] summary::after{content:"−";}
.yl-faq .ans{font-size:14px;color:var(--yl-muted);line-height:1.95;padding:0 0 16px;}

/* section note */
.yl-foot{background:var(--yl-primary-deep);color:#b9cdc8;font-size:13px;line-height:1.9;margin-top:56px;}
.yl-foot a{color:#cfe0db;}
.yl-foot a:hover{color:#fff;}
.yl-foot-top{display:grid;grid-template-columns:1.2fr 1fr;gap:30px;padding:44px 0 26px;border-bottom:1px solid rgba(255,255,255,.10);}
.yl-fbrand{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.yl-fbrand b{display:block;color:#fff;font-size:16px;}
.yl-fbrand span{display:block;font-size:12px;color:#8fb0a8;letter-spacing:1px;}
.yl-fintro{margin:0 0 14px;}
.yl-fact p{margin:0 0 3px;}
.yl-foot-mid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;padding:24px 0;}
.yl-fcol h4{color:#fff;font-size:14px;font-weight:600;margin:0 0 10px;}
.yl-fcol a{display:block;padding:3px 0;font-size:13px;}
.yl-foot-bot{border-top:1px solid rgba(255,255,255,.10);padding:20px 0 30px;font-size:12px;color:#8fb0a8;}
.yl-foot-bot p{margin:0 0 5px;}
.yl-cr2 a{color:#8fb0a8;margin-right:4px;}

/* section note */
.yl-top{position:fixed;right:22px;bottom:26px;width:46px;height:46px;border-radius:50%;
  background:#fff;border:1px solid var(--yl-line);color:var(--yl-primary);display:flex;align-items:center;justify-content:center;
  box-shadow:var(--yl-shadow);opacity:0;visibility:hidden;transition:.2s;z-index:80;}
.yl-top.show{opacity:1;visibility:visible;}
.yl-top:hover{background:var(--yl-primary);color:#fff;}

/* section note */
.yl-rv{opacity:1;transform:none;}
.yl-rv.in{opacity:1;transform:none;}

/* section note */
.yl-empty{background:#fff;border:1px dashed var(--yl-line);border-radius:var(--yl-radius);padding:34px;text-align:center;color:var(--yl-muted);font-size:14px;}

/* section note */
@media (max-width:1024px){
  .yl-nav{display:none;}
  .yl-burger{display:block;}
  .yl-hd-r .yl-btn-ghost{display:none;}
  .yl-g4{grid-template-columns:repeat(2,1fr);}
  .yl-g3{grid-template-columns:repeat(2,1fr);}
  .yl-detail{grid-template-columns:1fr;}
  .yl-foot-top{grid-template-columns:1fr;}
  .yl-foot-mid{grid-template-columns:repeat(2,1fr);}
  .yl-steps{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:640px){
  .yl-g3,.yl-g4,.yl-g2,.yl-steps{grid-template-columns:1fr;}
  .yl-hero h1{font-size:24px;}
  .yl-sec{padding:40px 0;}
  .yl-topline .yl-tl-l{display:none;}
  .yl-foot-mid{grid-template-columns:1fr;}
  .yl-detail-img{max-width:100%;}
}
