@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;500;600&family=Noto+Serif+JP:wght@400;500;600;700&family=EB+Garamond:wght@400;500;600&display=swap');
/* === FUKINOTO SSL PAGES BEGIN === */
/* Match the COMPANY page look. SSL pages allow CSS only. */
:root{--fk-bg:#A5DEE4;--fk-pn:#EFF1F0;--fk-tx:#282828;--fk-sb:#636364;
 --fk-ac:#90ABB4;--fk-ln:rgba(144,171,180,.55);
 --fk-mj:"Hiragino Mincho ProN","Hiragino Mincho Pro","Yu Mincho",YuMincho,"Noto Serif JP",serif;
 --fk-gd:"EB Garamond","Cormorant Garamond",Georgia,serif;
 --fk-ez:cubic-bezier(.22,.61,.36,1)}

body.p-page__wrap{background:var(--fk-bg)!important;color:var(--fk-tx);
 font-family:var(--fk-mj);position:relative;min-height:100vh}
body.p-page__wrap *{font-family:inherit}

/* floating white particles */
body.p-page__wrap::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
 background-image:
  radial-gradient(circle,rgba(255,255,255,.9) 0 2.5px,transparent 3.6px),
  radial-gradient(circle,rgba(255,255,255,.6) 0 4px,transparent 5.2px),
  radial-gradient(circle,rgba(255,255,255,.9) 0 1.8px,transparent 2.8px),
  radial-gradient(circle,rgba(255,255,255,.6) 0 6px,transparent 7.6px),
  radial-gradient(circle,rgba(255,255,255,.9) 0 3.4px,transparent 4.6px),
  radial-gradient(circle,rgba(255,255,255,.6) 0 8.5px,transparent 10.5px);
 background-size:232px 204px,330px 288px,166px 150px,498px 432px,272px 336px,660px 580px;
 background-position:12px 30px,124px 62px,44px 12px,206px 154px,92px 202px,304px 262px;
 animation:fkdrift 24s linear infinite alternate,fktwinkle 9s ease-in-out infinite alternate}
@keyframes fkdrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-56px,-44px,0)}}
@keyframes fktwinkle{from{opacity:.7}to{opacity:1}}

/* header band (white) */
body.p-page__wrap .base01,
body.p-page__wrap .p-shop__header--title{background:#FFFFFF!important;border:0!important;
 position:relative;z-index:1}
body.p-page__wrap .p-shop__header--title{padding:clamp(30px,4vw,56px) clamp(16px,2.6vw,44px)!important;
 text-align:left}
/* logo */
body.p-page__wrap .p-shop__header--title{
 padding-left:calc(clamp(16px,2.6vw,44px) + clamp(54px,5.4vw,82px) + clamp(14px,1.6vw,24px))!important;
 background-color:#FFFFFF!important;
 background-image:url('https://file001.shop-pro.jp/PA01524/662/logo-fukinoto.png')!important;
 background-repeat:no-repeat!important;
 background-position:left clamp(16px,2.6vw,44px) center!important;
 background-size:clamp(54px,5.4vw,82px) auto!important;
 animation:fklogo 1.1s var(--fk-ez) both}
@keyframes fklogo{from{background-size:calc(clamp(54px,5.4vw,82px) * .82) auto;opacity:0}
 to{background-size:clamp(54px,5.4vw,82px) auto;opacity:1}}
body.p-page__wrap .p-shop__title,
body.p-page__wrap .shop_title{font-family:var(--fk-mj)!important;font-weight:700!important;
 font-size:clamp(20px,2.4vw,32px)!important;letter-spacing:.06em;color:var(--fk-tx)!important;
 text-decoration:none!important;line-height:1.5}
body.p-page__wrap .p-shop__header--title::after{content:"MY ACCOUNT";display:block;margin-top:10px;
 font-family:var(--fk-gd);font-size:13px;letter-spacing:.24em;color:var(--fk-ac);font-weight:600}
body.p-page__wrap .p-shop__header--title::before{content:"";position:absolute;left:0;bottom:0;
 height:3px;width:min(34%,420px);background:var(--fk-ac)}

/* body card */
body.p-page__wrap .p-page__body{background:transparent!important;position:relative;z-index:1;
 padding:clamp(24px,3vw,52px) clamp(14px,2.2vw,34px)!important}
body.p-page__wrap .p-page__body-inner{max-width:1340px;margin:0 auto;
 background:var(--fk-pn)!important;border-radius:clamp(16px,2vw,30px);
 padding:clamp(28px,4vw,72px) clamp(20px,3.4vw,64px)!important;
 box-shadow:0 14px 34px rgba(40,40,40,.09);border:0!important;
 animation:fkrise .9s var(--fk-ez) both}
@keyframes fkrise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

/* headings and text */
body.p-page__wrap h1,body.p-page__wrap h2,body.p-page__wrap h3,
body.p-page__wrap .p-heading,body.p-page__wrap legend{
 font-family:var(--fk-mj)!important;font-weight:700!important;color:var(--fk-tx)!important;
 letter-spacing:.05em;line-height:1.7}
body.p-page__wrap h1{font-size:clamp(22px,2.6vw,34px)!important;text-align:center;
 margin:0 0 clamp(18px,2.4vw,34px)!important}
body.p-page__wrap p,body.p-page__wrap li,body.p-page__wrap td,body.p-page__wrap th,
body.p-page__wrap label,body.p-page__wrap dd,body.p-page__wrap dt{
 font-size:15px!important;line-height:2.1;letter-spacing:.05em;color:var(--fk-tx)}
body.p-page__wrap a{color:var(--fk-ac)}

/* form fields */
body.p-page__wrap input[type=text],body.p-page__wrap input[type=email],
body.p-page__wrap input[type=tel],body.p-page__wrap input[type=password],
body.p-page__wrap input[type=number],body.p-page__wrap textarea,body.p-page__wrap select{
 border:1px solid var(--fk-ln)!important;border-radius:8px!important;
 padding:.7em .9em!important;background:#FFFFFF!important;color:var(--fk-tx)!important;
 font-size:15px!important;transition:border-color .3s var(--fk-ez),box-shadow .3s var(--fk-ez)}
body.p-page__wrap input:focus,body.p-page__wrap textarea:focus,body.p-page__wrap select:focus{
 outline:0!important;border-color:var(--fk-ac)!important;
 box-shadow:0 0 0 3px rgba(144,171,180,.22)!important}

/* tables */
body.p-page__wrap table{border-collapse:collapse;width:100%}
body.p-page__wrap th,body.p-page__wrap td{border:0!important;
 border-top:1px solid rgba(40,40,40,.14)!important;padding:16px 8px!important;
 background:transparent!important}
body.p-page__wrap th{font-weight:700;text-align:left;white-space:nowrap}

/* buttons */
body.p-page__wrap .c-button,
body.p-page__wrap .c-button:link,body.p-page__wrap .c-button:visited{
 background:#FFFFFF!important;color:var(--fk-tx)!important;
 border:1px solid var(--fk-ln)!important;border-radius:999px!important;
 padding:.85em 2.2em!important;font-size:15px!important;letter-spacing:.08em;
 box-shadow:none!important;transition:.35s var(--fk-ez)}
body.p-page__wrap .c-button:hover{background:var(--fk-pn)!important;transform:translateY(-2px)}
body.p-page__wrap .c-button--primary,
body.p-page__wrap .c-button--primary:link,body.p-page__wrap .c-button--primary:visited{
 background:var(--fk-ac)!important;color:#FFFFFF!important;border-color:var(--fk-ac)!important}
body.p-page__wrap .c-button--primary:hover{background:#7E9AA4!important;color:#FFFFFF!important}
body.p-page__wrap .c-button--danger,
body.p-page__wrap .c-button--danger:link,body.p-page__wrap .c-button--danger:visited{
 background:#FFFFFF!important;color:#8C5A4A!important;border-color:#8C5A4A!important}
body.p-page__wrap .c-button--danger:hover{background:#8C5A4A!important;color:#FFFFFF!important}

/* footer */
body.p-page__wrap .p-page__footer{background:transparent!important;position:relative;z-index:1;
 padding-top:clamp(20px,3vw,40px)}
body.p-page__wrap .p-page__copyright,body.p-page__wrap .p-page__secure,
body.p-page__wrap .p-page__footer *{color:var(--fk-sb)!important;font-size:12px!important}

@media (prefers-reduced-motion:reduce){
 body.p-page__wrap::before{animation:none!important}
 body.p-page__wrap .p-page__body-inner{animation:none!important}
}
/* full width inner */
body.p-page__wrap .p-page__container{max-width:none!important;width:auto!important}
body.p-page__wrap .p-page__body-inner form,
body.p-page__wrap .p-page__body-inner > div{max-width:none!important;width:auto!important}
body.p-page__wrap .p-page__body-inner table{width:100%!important;max-width:none!important}
body.p-page__wrap .p-page__body-inner input[type=text],
body.p-page__wrap .p-page__body-inner input[type=email],
body.p-page__wrap .p-page__body-inner input[type=tel],
body.p-page__wrap .p-page__body-inner textarea{width:100%!important;max-width:720px!important;
 box-sizing:border-box}
/* === FUKINOTO SSL PAGES END === */
