/* Customer Center — aroma_pharm_customer_center_standalone */
:root{
  --paper:#f8f6f1;--ink:#171714;--muted:#79756d;--line:#dfddd7;
}
body{background:var(--paper)}
#container_title,.ap-page-title{display:none!important}

.cs-page{padding-top:50px;min-height:100vh;background:var(--paper)}
.cs-wrap{width:min(1220px,calc(100% - 80px));margin:auto;padding:92px 0 120px}

.cs-head{
  display:flex;justify-content:space-between;align-items:end;
  padding-bottom:30px;border-bottom:1px solid var(--line)
}
.cs-head .eyebrow{
  font-size:9px;letter-spacing:.23em;color:var(--muted);margin-bottom:12px
}
.cs-head h1{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(60px,7vw,96px);font-weight:400;
  line-height:.85;letter-spacing:-.045em;margin:0
}
.cs-head__contact{
  text-align:right;font-size:11.5px;line-height:1.8;color:#77736c;padding-bottom:6px
}
.cs-head__contact a{color:inherit;text-decoration:none}
.cs-head__contact a:hover{text-decoration:underline}

.cs-quick{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
  margin-top:34px
}
.cs-quick .cs-card:nth-child(n+4){min-height:160px}
.cs-card{
  min-height:180px;background:#eee8de;padding:28px;
  display:flex;flex-direction:column;justify-content:space-between
}
.cs-card .label{font-size:9px;letter-spacing:.16em;color:#7e7971}
.cs-card h2{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:34px;font-weight:400;margin:20px 0 8px
}
.cs-card p{font-size:11.5px;line-height:1.8;color:#706b64;margin:0}
.cs-card a{
  align-self:flex-start;margin-top:20px;
  font-size:9px;letter-spacing:.14em;border-bottom:1px solid #333;padding-bottom:4px;
  color:inherit;text-decoration:none
}

.cs-section{
  margin-top:56px;border-top:1px solid #242520;padding-top:22px
}
.cs-section__head{
  display:flex;justify-content:space-between;align-items:end;margin-bottom:18px
}
.cs-section__head h2{
  font-family:"Cormorant Garamond",Georgia,serif;font-size:38px;font-weight:400;margin:0
}
.cs-section__head a{
  font-size:9px;letter-spacing:.13em;border-bottom:1px solid #333;padding-bottom:4px;
  color:inherit;text-decoration:none
}

.notice-list{border-top:1px solid var(--line)}
.notice-row{
  display:grid;grid-template-columns:80px 1fr 120px;
  gap:20px;align-items:center;padding:17px 0;border-bottom:1px solid var(--line);
  color:inherit;text-decoration:none
}
.notice-row:hover .title{text-decoration:underline}
.notice-row .num{font-size:10px;color:#8d887f}
.notice-row .title{font-size:12px}
.notice-row .date{text-align:right;font-size:10px;color:#8d887f}
.notice-empty{
  padding:28px 0;font-size:12px;color:#8d887f;border-bottom:1px solid var(--line)
}

.faq-list{border-top:1px solid var(--line)}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{
  list-style:none;cursor:pointer;padding:18px 0;
  display:grid;grid-template-columns:56px 1fr auto;gap:16px;align-items:center
}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary .q{
  font-family:"Cormorant Garamond",Georgia,serif;font-size:22px;color:#77736c
}
.faq-list summary .title{font-size:12px}
.faq-list summary .plus{font-size:18px;color:#8b867e;transition:transform .2s ease}
.faq-list details[open] summary .plus{transform:rotate(45deg)}
.faq-list details .faq-a{
  margin:0;padding:0 0 20px 72px;
  font-size:11.5px;line-height:1.9;color:#77736c;max-width:880px
}
.faq-list details .faq-a p{margin:0 0 8px;font-size:inherit;line-height:inherit;color:inherit}
.faq-empty{
  padding:28px 0;font-size:12px;color:#8d887f;border-bottom:1px solid var(--line)
}

.guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.guide-box{border:1px solid var(--line);background:#fff;padding:26px}
.guide-box .label{font-size:9px;letter-spacing:.15em;color:#817c74}
.guide-box h3{
  font-family:"Cormorant Garamond",Georgia,serif;font-size:30px;font-weight:400;margin:14px 0 12px
}
.guide-box h3 a{color:inherit;text-decoration:none}
.guide-box h3 a:hover{text-decoration:underline}
.guide-box p{font-size:11.5px;line-height:1.85;color:#706b64;margin:0}

.cs-bottom{
  margin-top:56px;background:#171714;color:#eee;
  padding:48px 52px;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center
}
.cs-bottom .eyebrow{font-size:9px;letter-spacing:.2em;color:#99958d;margin-bottom:10px}
.cs-bottom h2{
  font-family:"Cormorant Garamond",Georgia,serif;font-size:42px;font-weight:400;margin:0 0 8px
}
.cs-bottom p{font-size:11.5px;line-height:1.8;color:#bbb7af;margin:0}
.cs-bottom a{
  height:44px;display:flex;align-items:center;padding:0 18px;
  border:1px solid #5e5b55;color:#fff;font-size:9px;letter-spacing:.13em;
  text-decoration:none;box-sizing:border-box
}

@media(max-width:900px){
  .cs-wrap{width:calc(100% - 30px);padding:70px 0 90px}
  .cs-head{display:block}
  .cs-head__contact{text-align:left;margin-top:18px}
  .cs-quick{grid-template-columns:1fr}
  .notice-row{grid-template-columns:50px 1fr}
  .notice-row .date{grid-column:2;text-align:left}
  .guide-grid{grid-template-columns:1fr}
  .cs-bottom{grid-template-columns:1fr;padding:34px 28px}
  .cs-bottom a{justify-self:start}
  .faq-list details .faq-a{padding-left:0}
}
