@charset "UTF-8";
html {
scrollbar-gutter: stable;
}
.uc-page-header .uc-header-site {
padding-bottom: 9px;
}
:root {
--base-size: calc(1rem / 10);
--hanaColabo-color-white: #ffffff;
--hanaColabo-color-red-01: #f87e71;
--hanaColabo-color-pink-01: #fecfca;
--hanaColabo-color-pink-02: #fee5e2;
--hanaColabo-color-gray-01: #828e8c;
--hanaColabo-color-black-01: #000000;
--hanaColabo-color-black-02: #0c2a30;
--hanaColabo-color-black-03: #242828;
--hanaColabo-color-blue-01: #33145c;
--hanaColabo-color-transparent: transparent;
--hana-f-weight-normal: 500;
--hana-f-weight-bold: 700;
--hanaColabo-f-family-01:
"Noto Sans JP", "Roboto", "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro",
"Hiragino Maru Gothic Pro", "ヒラギノ角ゴ Pro W3",
"Hiragino Kaku Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO", "HGMaruGothicMPRO", sans-serif;
--hanaColabo-f-family-02:
"Cormorant Garamond", "Noto Sans JP", "Roboto", "ヒラギノ丸ゴ Pro W4",
"ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "ヒラギノ角ゴ Pro W3",
"Hiragino Kaku Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO", "HGMaruGothicMPRO", sans-serif;
}
.f-family-01 {
font-family: var(--hanaColabo-f-family-01) !important;
}
.f-family-02 {
font-family: var(--hanaColabo-f-family-02) !important;
}
.f-color-white {
color: var(--hanaColabo-color-white) !important;
}
.f-color-red-01 {
color: var(--hanaColabo-color-red) !important;
}
.f-color-pink-01 {
color: var(--hanaColabo-color-pink-01) !important;
}
.f-color-pink-02 {
color: var(--hanaColabo-color-pink-02) !important;
}
.f-color-gray-01 {
color: var(--hanaColabo-color-gray-01) !important;
}
.f-color-black-01 {
color: var(--hanaColabo-color-black-01) !important;
}
.f-color-black-02 {
color: var(--hanaColabo-color-black-02) !important;
}
.f-color-black-03 {
color: var(--hanaColabo-color-black-03) !important;
}
.f-color-blue-01 {
color: var(--hanaColabo-color-blue-02) !important;
}
.f-color-transparent {
color: var(--hanaColabo-color-transparent) !important;
}
.f-color-link {
color: var(--hanaColabo-color-link) !important;
}
.f-weight-inherit {
font-weight: inherit !important;
}
.f-weight-normal {
font-weight: var(--hana-f-weight-normal) !important;
}
.f-weight-bold {
font-weight: var(--hana-f-weight-bold) !important;
}
.hana-mod-disp-block {
display: block !important;
}
.hana-mod-disp-inline-block {
display: inline-block !important;
}
.hana-mod-disp-inline {
display: inline !important;
}
.hana-mod-disp-flex {
display: flex !important;
}
.bg-color-white {
background-color: var(--hanaColabo-color-white) !important;
}
.bg-color-red-01 {
background-color: var(--hanaColabo-color-red) !important;
}
.bg-color-pink-01 {
background-color: var(--hanaColabo-color-pink-01) !important;
}
.bg-color-pink-02 {
background-color: var(--hanaColabo-color-pink-02) !important;
}
.bg-color-gray-01 {
background-color: var(--hanaColabo-color-gray-01) !important;
}
.bg-color-black-01 {
background-color: var(--hanaColabo-color-black-01) !important;
}
.bg-color-black-02 {
background-color: var(--hanaColabo-color-black-02) !important;
}
.bg-color-black-03 {
background-color: var(--hanaColabo-color-black-03) !important;
}
.bg-color-blue-01 {
background-color: var(--hanaColabo-color-blue-07) !important;
}
.bg-color-transparent {
background-color: var(--hanaColabo-color-transparent) !important;
}
.hana-mt-04 {
margin-top: 4px !important;
}
.hana-mt-05 {
margin-top: 5px !important;
}
.hana-mt-08 {
margin-top: 8px !important;
}
.hana-mt-10 {
margin-top: 10px !important;
}
.hana-mt-12 {
margin-top: 12px !important;
}
.hana-mt-16 {
margin-top: 16px !important;
}
.hana-mt-20 {
margin-top: 20px !important;
}
.hana-mt-24 {
margin-top: 24px !important;
}
.hana-mt-25 {
margin-top: 25px !important;
}
.hana-mt-28 {
margin-top: 28px !important;
}
.hana-mt-30 {
margin-top: 30px !important;
}
.hana-mt-32 {
margin-top: 32px !important;
}
.hana-mt-35 {
margin-top: 36px !important;
}
.hana-mt-36 {
margin-top: 36px !important;
}
.hana-mt-40 {
margin-top: 40px !important;
}
.hana-mt-44 {
margin-top: 44px !important;
}
.hana-mt-45 {
margin-top: 45px !important;
}
.hana-mt-48 {
margin-top: 48px !important;
}
.hana-mt-50 {
margin-top: 50px !important;
}
.hana-mt-52 {
margin-top: 52px !important;
}
.hana-mt-55 {
margin-top: 55px !important;
}
.hana-mt-56 {
margin-top: 56px !important;
}
.hana-mt-60 {
margin-top: 60px !important;
}
.hana-mt-64 {
margin-top: 64px !important;
}
.hana-mt-65 {
margin-top: 65px !important;
}
.hana-mt-68 {
margin-top: 68px !important;
}
.hana-mt-70 {
margin-top: 70px !important;
}
.hana-mt-72 {
margin-top: 72px !important;
}
.hana-mt-75 {
margin-top: 75px !important;
}
.hana-mt-76 {
margin-top: 76px !important;
}
.hana-mt-80 {
margin-top: 80px !important;
}
.hana-mt-84 {
margin-top: 84px !important;
}
.hana-mt-85 {
margin-top: 85px !important;
}
.hana-mt-88 {
margin-top: 88px !important;
}
.hana-mt-90 {
margin-top: 90px !important;
}
.hana-mt-92 {
margin-top: 92px !important;
}
.hana-mt-96 {
margin-top: 96px !important;
}
.hana-mr-04 {
margin-right: 4px !important;
}
.hana-mr-05 {
margin-right: 5px !important;
}
.hana-mr-08 {
margin-right: 8px !important;
}
.hana-mr-10 {
margin-right: 10px !important;
}
.hana-mr-12 {
margin-right: 12px !important;
}
.hana-mr-16 {
margin-right: 16px !important;
}
.hana-mr-20 {
margin-right: 20px !important;
}
.hana-mr-24 {
margin-right: 24px !important;
}
.hana-mr-25 {
margin-right: 25px !important;
}
.hana-mr-28 {
margin-right: 28px !important;
}
.hana-mr-30 {
margin-right: 30px !important;
}
.hana-mr-32 {
margin-right: 32px !important;
}
.hana-mr-36 {
margin-right: 36px !important;
}
.hana-mr-40 {
margin-right: 40px !important;
}
.hana-mr-44 {
margin-right: 44px !important;
}
.hana-mr-45 {
margin-right: 45px !important;
}
.hana-mr-48 {
margin-right: 48px !important;
}
.hana-mr-50 {
margin-right: 50px !important;
}
.hana-mr-52 {
margin-right: 52px !important;
}
.hana-mr-56 {
margin-right: 56px !important;
}
.hana-mr-60 {
margin-right: 60px !important;
}
.hana-mr-64 {
margin-right: 64px !important;
}
.hana-mr-65 {
margin-right: 65px !important;
}
.hana-mr-68 {
margin-right: 68px !important;
}
.hana-mr-70 {
margin-right: 70px !important;
}
.hana-mr-72 {
margin-right: 72px !important;
}
.hana-mr-76 {
margin-right: 76px !important;
}
.hana-mr-80 {
margin-right: 80px !important;
}
.hana-mr-84 {
margin-right: 84px !important;
}
.hana-mr-85 {
margin-right: 85px !important;
}
.hana-mr-88 {
margin-right: 88px !important;
}
.hana-mr-90 {
margin-right: 90px !important;
}
.hana-mr-92 {
margin-right: 92px !important;
}
.hana-mr-96 {
margin-right: 96px !important;
}
.hana-mb-04 {
margin-bottom: 4px !important;
}
.hana-mb-05 {
margin-bottom: 5px !important;
}
.hana-mb-08 {
margin-bottom: 8px !important;
}
.hana-mb-12 {
margin-bottom: 12px !important;
}
.hana-mb-16 {
margin-bottom: 16px !important;
}
.hana-mb-20 {
margin-bottom: 20px !important;
}
.hana-mb-24 {
margin-bottom: 24px !important;
}
.hana-mb-25 {
margin-bottom: 25px !important;
}
.hana-mb-28 {
margin-bottom: 28px !important;
}
.hana-mb-30 {
margin-bottom: 30px !important;
}
.hana-mb-32 {
margin-bottom: 32px !important;
}
.hana-mb-36 {
margin-bottom: 36px !important;
}
.hana-mb-40 {
margin-bottom: 40px !important;
}
.hana-mb-44 {
margin-bottom: 44px !important;
}
.hana-mb-45 {
margin-bottom: 45px !important;
}
.hana-mb-48 {
margin-bottom: 48px !important;
}
.hana-mb-50 {
margin-bottom: 50px !important;
}
.hana-mb-52 {
margin-bottom: 52px !important;
}
.hana-mb-56 {
margin-bottom: 56px !important;
}
.hana-mb-60 {
margin-bottom: 60px !important;
}
.hana-mb-64 {
margin-bottom: 64px !important;
}
.hana-mb-65 {
margin-bottom: 65px !important;
}
.hana-mb-68 {
margin-bottom: 68px !important;
}
.hana-mb-70 {
margin-bottom: 70px !important;
}
.hana-mb-72 {
margin-bottom: 72px !important;
}
.hana-mb-76 {
margin-bottom: 76px !important;
}
.hana-mb-80 {
margin-bottom: 80px !important;
}
.hana-mb-84 {
margin-bottom: 84px !important;
}
.hana-mb-85 {
margin-bottom: 85px !important;
}
.hana-mb-88 {
margin-bottom: 88px !important;
}
.hana-mb-90 {
margin-bottom: 90px !important;
}
.hana-mb-92 {
margin-bottom: 92px !important;
}
.hana-mb-96 {
margin-bottom: 96px !important;
}
.hana-ml-04 {
margin-left: 4px !important;
}
.hana-ml-05 {
margin-left: 5px !important;
}
.hana-ml-08 {
margin-left: 8px !important;
}
.hana-ml-10 {
margin-left: 10px !important;
}
.hana-ml-12 {
margin-left: 12px !important;
}
.hana-ml-16 {
margin-left: 16px !important;
}
.hana-ml-20 {
margin-left: 20px !important;
}
.hana-ml-24 {
margin-left: 24px !important;
}
.hana-ml-25 {
margin-left: 25px !important;
}
.hana-ml-28 {
margin-left: 28px !important;
}
.hana-ml-30 {
margin-left: 30px !important;
}
.hana-ml-32 {
margin-left: 32px !important;
}
.hana-ml-35 {
margin-left: 35px !important;
}
.hana-ml-36 {
margin-left: 36px !important;
}
.hana-ml-40 {
margin-left: 40px !important;
}
.hana-ml-44 {
margin-left: 44px !important;
}
.hana-ml-45 {
margin-left: 45px !important;
}
.hana-ml-48 {
margin-left: 48px !important;
}
.hana-ml-50 {
margin-left: 50px !important;
}
.hana-ml-52 {
margin-left: 52px !important;
}
.hana-ml-55 {
margin-left: 55px !important;
}
.hana-ml-56 {
margin-left: 56px !important;
}
.hana-ml-60 {
margin-left: 60px !important;
}
.hana-ml-64 {
margin-left: 64px !important;
}
.hana-ml-65 {
margin-left: 65px !important;
}
.hana-ml-68 {
margin-left: 68px !important;
}
.hana-ml-60 {
margin-left: 68px !important;
}
.hana-ml-72 {
margin-left: 72px !important;
}
.hana-ml-75 {
margin-left: 75px !important;
}
.hana-ml-76 {
margin-left: 76px !important;
}
.hana-ml-80 {
margin-left: 80px !important;
}
.hana-ml-84 {
margin-left: 84px !important;
}
.hana-ml-85 {
margin-left: 85px !important;
}
.hana-ml-88 {
margin-left: 88px !important;
}
.hana-ml-90 {
margin-left: 90px !important;
}
.hana-ml-92 {
margin-left: 92px !important;
}
.hana-ml-96 {
margin-left: 96px !important;
}
.hana-pt-04 {
padding-top: 4px !important;
}
.hana-pt-05 {
padding-top: 5px !important;
}
.hana-pt-08 {
padding-top: 8px !important;
}
.hana-pt-10 {
padding-top: 10px !important;
}
.hana-pt-12 {
padding-top: 12px !important;
}
.hana-pt-16 {
padding-top: 16px !important;
}
.hana-pt-20 {
padding-top: 20px !important;
}
.hana-pt-24 {
padding-top: 24px !important;
}
.hana-pt-28 {
padding-top: 28px !important;
}
.hana-pt-30 {
padding-top: 30px !important;
}
.hana-pt-32 {
padding-top: 32px !important;
}
.hana-pt-35 {
padding-top: 35px !important;
}
.hana-pt-36 {
padding-top: 36px !important;
}
.hana-pt-40 {
padding-top: 40px !important;
}
.hana-pt-44 {
padding-top: 44px !important;
}
.hana-pt-45 {
padding-top: 45px !important;
}
.hana-pt-48 {
padding-top: 48px !important;
}
.hana-pt-50 {
padding-top: 50px !important;
}
.hana-pt-52 {
padding-top: 52px !important;
}
.hana-pt-55 {
padding-top: 55px !important;
}
.hana-pt-56 {
padding-top: 56px !important;
}
.hana-pt-60 {
padding-top: 60px !important;
}
.hana-pt-64 {
padding-top: 64px !important;
}
.hana-pt-65 {
padding-top: 65px !important;
}
.hana-pt-68 {
padding-top: 68px !important;
}
.hana-pt-70 {
padding-top: 70px !important;
}
.hana-pt-72 {
padding-top: 72px !important;
}
.hana-pt-75 {
padding-top: 75px !important;
}
.hana-pt-76 {
padding-top: 76px !important;
}
.hana-pt-80 {
padding-top: 80px !important;
}
.hana-pt-84 {
padding-top: 84px !important;
}
.hana-pt-85 {
padding-top: 85px !important;
}
.hana-pt-88 {
padding-top: 88px !important;
}
.hana-pt-90 {
padding-top: 90px !important;
}
.hana-pt-92 {
padding-top: 92px !important;
}
.hana-pt-95 {
padding-top: 95px !important;
}
.hana-pt-96 {
padding-top: 96px !important;
}
.hana-pr-04 {
padding-right: 4px !important;
}
.hana-pr-05 {
padding-right: 5px !important;
}
.hana-pr-08 {
padding-right: 8px !important;
}
.hana-pr-10 {
padding-right: 10px !important;
}
.hana-pr-12 {
padding-right: 12px !important;
}
.hana-pr-15 {
padding-right: 15px !important;
}
.hana-pr-16 {
padding-right: 16px !important;
}
.hana-pr-20 {
padding-right: 20px !important;
}
.hana-pr-24 {
padding-right: 24px !important;
}
.hana-pr-25 {
padding-right: 25px !important;
}
.hana-pr-28 {
padding-right: 28px !important;
}
.hana-pr-30 {
padding-right: 30px !important;
}
.hana-pr-32 {
padding-right: 32px !important;
}
.hana-pr-35 {
padding-right: 35px !important;
}
.hana-pr-36 {
padding-right: 36px !important;
}
.hana-pr-40 {
padding-right: 40px !important;
}
.hana-pr-44 {
padding-right: 44px !important;
}
.hana-pr-45 {
padding-right: 45px !important;
}
.hana-pr-48 {
padding-right: 48px !important;
}
.hana-pr-50 {
padding-right: 50px !important;
}
.hana-pr-52 {
padding-right: 52px !important;
}
.hana-pr-55 {
padding-right: 55px !important;
}
.hana-pr-56 {
padding-right: 56px !important;
}
.hana-pr-60 {
padding-right: 60px !important;
}
.hana-pr-64 {
padding-right: 64px !important;
}
.hana-pr-65 {
padding-right: 65px !important;
}
.hana-pr-68 {
padding-right: 68px !important;
}
.hana-pr-70 {
padding-right: 70px !important;
}
.hana-pr-72 {
padding-right: 72px !important;
}
.hana-pr-75 {
padding-right: 75px !important;
}
.hana-pr-76 {
padding-right: 76px !important;
}
.hana-pr-80 {
padding-right: 80px !important;
}
.hana-pr-84 {
padding-right: 84px !important;
}
.hana-pr-85 {
padding-right: 85px !important;
}
.hana-pr-88 {
padding-right: 88px !important;
}
.hana-pr-90 {
padding-right: 90px !important;
}
.hana-pr-92 {
padding-right: 92px !important;
}
.hana-pr-95 {
padding-right: 95px !important;
}
.hana-pr-96 {
padding-right: 96px !important;
}
.hana-pb-04 {
padding-bottom: 4px !important;
}
.hana-pb-05 {
padding-bottom: 5px !important;
}
.hana-pb-08 {
padding-bottom: 8px !important;
}
.hana-pb-10 {
padding-bottom: 10px !important;
}
.hana-pb-12 {
padding-bottom: 12px !important;
}
.hana-pb-15 {
padding-bottom: 15px !important;
}
.hana-pb-16 {
padding-bottom: 16px !important;
}
.hana-pb-20 {
padding-bottom: 20px !important;
}
.hana-pb-24 {
padding-bottom: 24px !important;
}
.hana-pb-25 {
padding-bottom: 25px !important;
}
.hana-pb-28 {
padding-bottom: 28px !important;
}
.hana-pb-30 {
padding-bottom: 30px !important;
}
.hana-pb-32 {
padding-bottom: 32px !important;
}
.hana-pb-35 {
padding-bottom: 35px !important;
}
.hana-pb-36 {
padding-bottom: 36px !important;
}
.hana-pb-40 {
padding-bottom: 40px !important;
}
.hana-pb-44 {
padding-bottom: 44px !important;
}
.hana-pb-45 {
padding-bottom: 45px !important;
}
.hana-pb-48 {
padding-bottom: 48px !important;
}
.hana-pb-40 {
padding-bottom: 48px !important;
}
.hana-pb-52 {
padding-bottom: 52px !important;
}
.hana-pb-55 {
padding-bottom: 55px !important;
}
.hana-pb-56 {
padding-bottom: 56px !important;
}
.hana-pb-60 {
padding-bottom: 60px !important;
}
.hana-pb-64 {
padding-bottom: 64px !important;
}
.hana-pb-65 {
padding-bottom: 65px !important;
}
.hana-pb-68 {
padding-bottom: 68px !important;
}
.hana-pb-70 {
padding-bottom: 70px !important;
}
.hana-pb-72 {
padding-bottom: 72px !important;
}
.hana-pb-75 {
padding-bottom: 75px !important;
}
.hana-pb-76 {
padding-bottom: 76px !important;
}
.hana-pb-80 {
padding-bottom: 80px !important;
}
.hana-pb-84 {
padding-bottom: 84px !important;
}
.hana-pb-85 {
padding-bottom: 85px !important;
}
.hana-pb-88 {
padding-bottom: 88px !important;
}
.hana-pb-90 {
padding-bottom: 90px !important;
}
.hana-pb-92 {
padding-bottom: 92px !important;
}
.hana-pb-96 {
padding-bottom: 96px !important;
}
.hana-pl-04 {
padding-left: 4px !important;
}
.hana-pl-05 {
padding-left: 5px !important;
}
.hana-pl-08 {
padding-left: 8px !important;
}
.hana-pl-10 {
padding-left: 10px !important;
}
.hana-pl-12 {
padding-left: 12px !important;
}
.hana-pl-15 {
padding-left: 15px !important;
}
.hana-pl-16 {
padding-left: 16px !important;
}
.hana-pl-20 {
padding-left: 20px !important;
}
.hana-pl-24 {
padding-left: 24px !important;
}
.hana-pl-25 {
padding-left: 25px !important;
}
.hana-pl-28 {
padding-left: 28px !important;
}
.hana-pl-20 {
padding-left: 28px !important;
}
.hana-pl-32 {
padding-left: 32px !important;
}
.hana-pl-35 {
padding-left: 35px !important;
}
.hana-pl-36 {
padding-left: 36px !important;
}
.hana-pl-40 {
padding-left: 40px !important;
}
.hana-pl-44 {
padding-left: 44px !important;
}
.hana-pl-45 {
padding-left: 45px !important;
}
.hana-pl-48 {
padding-left: 48px !important;
}
.hana-pl-50 {
padding-left: 50px !important;
}
.hana-pl-52 {
padding-left: 52px !important;
}
.hana-pl-55 {
padding-left: 55px !important;
}
.hana-pl-56 {
padding-left: 56px !important;
}
.hana-pl-60 {
padding-left: 60px !important;
}
.hana-pl-64 {
padding-left: 64px !important;
}
.hana-pl-65 {
padding-left: 65px !important;
}
.hana-pl-68 {
padding-left: 68px !important;
}
.hana-pl-70 {
padding-left: 70px !important;
}
.hana-pl-72 {
padding-left: 72px !important;
}
.hana-pl-75 {
padding-left: 75px !important;
}
.hana-pl-76 {
padding-left: 76px !important;
}
.hana-pl-80 {
padding-left: 80px !important;
}
.hana-pl-84 {
padding-left: 84px !important;
}
.hana-pl-85 {
padding-left: 85px !important;
}
.hana-pl-88 {
padding-left: 88px !important;
}
.hana-pl-90 {
padding-left: 90px !important;
}
.hana-pl-92 {
padding-left: 92px !important;
}
.hana-pl-96 {
padding-left: 96px !important;
}
.hana-mb-0 {
padding-left: 0 !important;
}
.hana--pb- {
padding-left: 0 !important;
}
.hana-mod-flex-left {
justify-content: left;
}
.hana-mod-flex-center {
justify-content: center;
}
.hana-mod-flex-right {
justify-content: right;
}
.hana-mod-br-before::before {
content: "\A";
white-space: pre;
}
.hana-mod-br-after::after {
content: "\A";
white-space: pre;
}
.hana-mod-ws-nowrap {
white-space: pre;
}
.hana-mod-float-inline-start {
float: inline-start;
}
/* main contents */
body {
background: none;
position: relative;
z-index: 1;
}
body:before {
content: '';
position: fixed;
top: 0;
inset: 0;
z-index: 0;
height: 100%;
width: 100%;
background-image:
url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-01-sp.jpg),
url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-02-sp.jpg);
background-repeat: no-repeat, repeat;
background-size: 100% auto;
background-position:
center 30px,
center 30px;
}
.uc-page-root {
position: relative;
}
header.uc-page-header {
background: #fff;
}
main.uc-page-body {
font-family: var(--hanaColabo-f-family-01);
font-weight: var(--hana-f-weight-normal);
overflow-x: hidden;
}
.sec-kv {
padding-bottom: 33px;
h1 {
margin-bottom: 0;
}
}
[class*="hana-mod-hdg-lv"] h1,
[class*="hana-mod-hdg-lv"] h2,
[class*="hana-mod-hdg-lv"] h3,
[class*="hana-mod-hdg-lv"] h4,
[class*="hana-mod-hdg-lv"] h5,
[class*="hana-mod-hdg-lv"] h6 {
color: inherit;
font-size: inherit;
font-weight: inherit;
line-height: inherit;
margin: 0 auto;
text-align: inherit;
}
.hana-mod-hdg-lv2-01 {
font-size: calc(24 * var(--base-size));
margin-bottom: calc(37 * var(--base-size));
text-align: center;
}
.hana-mod-hdg-lv2-01 h2 {
position: relative;
display: inline-block;
&::after {
content: "";
background: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-contents-01.png)
no-repeat;
background-size: 100%;
width: min(60px, 50%);
height: 47px;
position: absolute;
top: -11px;
left: calc(100% + 14px);
}
}
.hana-responsive-hdg-media-01.hana-mod-hdg-lv2-01 > * {
max-width: 194px;
margin: 0 auto;
}
.hana-mod-hdg-lv2-02 {
margin-bottom: 30px;
h2 {
position: relative;
}
span {
display: block;
max-width: 842px;
text-align: left;
background: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-07.svg)
no-repeat;
background-size: calc(100% - 155px) 5px;
background-position: right center;
margin-inline: auto;
}
img {
height: 24px;
display: inline-block;
}
}
.hana-mod-hdg-lv2-03 {
margin-bottom: 14px;
h2 {
position: relative;
}
h2::after {
content: "";
}
span {
display: block;
text-align: right;
background: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-09-sp.svg)
no-repeat;
background-size: calc(100% - 94px) 5px;
background-position: left center;
}
img {
height: 24px;
display: inline-block;
}
}
.hana-mod-hdg-lv2-04 {
background-image: linear-gradient(to right, var(--hanaColabo-color-blue-01));
background-size: 100% 1px;
background-repeat: no-repeat;
background-position: left calc(100% - 45px);
margin-bottom: 39px;
> * {
max-width: 340px;
margin-inline: auto;
}
}
.hana-mod-hdg-lv2-04 h2 {
position: relative;
&::before {
content: "";
width: 83px;
height: 65px;
transform: translateY(-50%);
position: absolute;
top: 0;
left: 0;
background-image: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-contents-01.png);
background-size: 100% auto;
background-position: left top;
}
&::after {
content: "";
width: 82px;
height: 63px;
transform: translateY(-50%);
position: absolute;
top: calc(50% - 7px);
right: calc(0% - 9px);
background-image: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-contents-03.png);
background-size: 100% auto;
}
}
.hana-mod-hdg-lv3-01 {
font-size: calc(28 * var(--base-size));
margin-bottom: 20px;
line-height: calc(42 / 28);
letter-spacing: 0.1em;
font-weight: 700;
}
.hana-mod-hdg-lv3-02 {
text-align: center;
font-size: calc(18 * var(--base-size));
/* line-height: calc(49 / 18); */
line-height: 1;
letter-spacing: 0.05em;
max-width: 248px;
margin: 0 auto 20px;
font-weight: var(--hana-f-weight-bold);
span:first-child {
display: block;
}
span:last-child {
display: inline-block;
padding-bottom: 16px;
border-bottom: 1px solid var(--hanaColabo-color-blue-01);
}
}
.hana-mod-hdg-lv3-03 {
text-align: center;
font-size: calc(18 * var(--base-size));
line-height: 1;
letter-spacing: 0.05em;
max-width: 241px;
margin: 0 auto 20px;
font-weight: var(--hana-f-weight-bold);
span:first-child {
display: block;
}
span:last-child {
display: inline-block;
padding-bottom: 16px;
border-bottom: 1px solid var(--hanaColabo-color-blue-01);
}
}
.hana-mod-hdg-lv4-01 {
width: 79px;
text-align: left;
text-align: -webkit-left;
margin-bottom: 12px;
h1,
h2,
h3,
h4,
h5,
h6 {
text-align: inherit;
}
}
.hana-mod-hdg-lv5-01 {
text-align: center;
text-align: -webkit-center;
font-size: calc(16 * var(--base-size));
line-height: 1.5;
color: white;
max-width: 301px;
margin: 0 auto 20px;
letter-spacing: 0.05em;
position: relative;
overflow-x: visible;
}
.hana-mod-hdg-lv5-01 h4 {
background-image: linear-gradient(to right, #f6a5c2, #e15d94);
padding: 11px 3px 15px;
position: relative;
z-index: 1;
}
.hana-mod-hdg-lv5-01::before {
content: "";
width: 35px;
height: 42px;
border-radius: 50%;
background-image: linear-gradient(to right, #f6a5c2);
position: absolute;
z-index: 0;
top: 50%;
left: 0;
transform: translate(-50%, -50%);
}
.hana-mod-hdg-lv5-01::after {
content: "";
width: 35px;
height: 42px;
border-radius: 50%;
background-image: linear-gradient(to right, #e15d94);
position: absolute;
z-index: 0;
top: 50%;
right: 0;
transform: translate(50%, -50%);
}
.hana-mod-hdg-lv5-02 {
text-align: center;
text-align: -webkit-center;
line-height: 1.5;
color: white;
font-size: calc(16 * var(--base-size));
max-width: 301px;
margin: 0 auto 20px;
letter-spacing: 0.05em;
position: relative;
overflow-x: visible;
}
.hana-mod-hdg-lv5-02 h4 {
background-image: linear-gradient(to right, #e4cae4, #7d68c2);
padding: 11px 3px 15px;
position: relative;
z-index: 1;
}
.hana-mod-hdg-lv5-02::before {
content: "";
width: 35px;
height: 42px;
border-radius: 50%;
background-image: linear-gradient(to right, #e4cae4);
position: absolute;
z-index: 0;
top: 50%;
left: 0;
transform: translate(-50%, -50%);
}
.hana-mod-hdg-lv5-02::after {
content: "";
width: 35px;
height: 42px;
border-radius: 50%;
background-image: linear-gradient(to right, #7d68c2);
position: absolute;
z-index: 0;
top: 50%;
right: 0;
transform: translate(50%, -50%);
}
.hana-contents-block {
color: var(--hanaColabo-color-blue-01);
font-family: var(--hanaColabo-f-family-01);
}
.hana-contents-wrapper {
max-width: 1000px;
margin: 0 auto;
}
.hana-mod-width-auto {
width: auto !important;
}
.hana-mod-width-max {
width: 100% !important;
}
.hana-message-block {
padding: 11px 20px 40px 30px;
}
.hana-contents-block [class*="uc-mod-link-text-"] {
text-align: center;
text-align: -webkit-center;
margin-bottom: 40px;
}
.uc-mod-link-text-01.hana-mod-link-text-01 {
margin-bottom: 40px;
}
.hana-contents-block [class*="uc-mod-link-text-"] p {
max-width: 540px;
padding: 0 20px;
margin: 0 auto;
}
.hana-contents-block [class*="uc-mod-link-text-"] a {
width: 100%;
border-radius: 35px;
box-shadow: 0 10px 10px rgba(223, 81, 140, 0.15);
background-image: linear-gradient(to bottom right, #e697b0 0%, #d43476 100%);
color: #ffffff;
font-size: 1.6rem;
padding: 23px 58px 23px 31px;
}
.hana-contents-block .hana-mod-link-text-01 a {
background-image: linear-gradient(to right, #e697b0 0%, #d43476 100%);
}
.hana-contents-block [class*="uc-mod-link-text-"] a::after {
width: 24px;
height: 24px;
background-size: 24px;
background-position: center;
right: 30px;
}
.uc-mod-link-text-01.hana-mod-link-text-01 a::after {
background-image: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-icon-01.svg);
}
.hana-contents-block .hana-mod-link-text-02 a {
background-image: linear-gradient(to right, #bc7cc8 0%, #3d2998 100%);
}
.uc-mod-link-text-01.hana-mod-link-text-02 a::after {
background-image: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-icon-02.svg);
}
.hana-mod-txt-01 {
font-size: calc(16 * var(--base-size));
letter-spacing: 0.05em;
line-height: calc(24 / 16);
margin-bottom: 1em;
}
.hana-mod-grid-01 {
/* margin-bottom: 75px; */
background: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-contents-02.png)
no-repeat;
background-size: 182px 137px;
background-position: 100% 100%;
padding-bottom: 75px;
max-width: 525px;
margin: 0 auto;
}
.hana-movie-block {
padding: 22px 20px 0;
color: var(--hanaColabo-color-white);
overflow-x: hidden;
background-color: rgba(255, 255, 255, 0.4);
}
.hana-movie-block .hana-contents-wrapper {
max-width: 842px;
}
.hana-mod-movie-lead-01 {
font-size: calc(15 * var(--base-size));
line-height: calc(27 / 15);
letter-spacing: 0.05em;
padding: 65px 0 35px;
margin-top: -19.6px;
position: relative;
overflow: visible;
}
.hana-mod-movie-lead-01::before {
content: "";
height: 100%;
width: 101vw;
background: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-03-sp.svg)
no-repeat;
background-size: 101vw 100%;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
z-index: 0;
}
.hana-mod-movie-lead-01 p {
position: relative;
}
.section:has(> .hana-movie-contents),
.section:has(> .hana-mod-movie-lead-block) {
position: relative;
z-index: 1;
}
.section:has(> .hana-mod-movie-lead-block) {
margin-top: -45px;
z-index: 0;
}
.sec-lineup .hana-contents-block {
padding: 50px 0 60px;
}
.sec-profile .hana-contents-wrapper {
max-width: 1040px;
margin: 0 auto;
padding: 17px 20px 51px;
}
.hana-mod-media-profile-01 {
margin: 0 auto 25px;
}
.section:has(> .hana-mod-media-profile-01) {
order: 2;
}
.hana-profile-detail-contents {
display: flex;
flex-direction: column;
}
.hana-profile-detail-contents > * {
order: 2;
}
.hana-profile-detail-contents .section:has(> .hana-mod-media-profile-01) {
order: 0;
}
.hana-profile-detail-contents .CMP-CM09-heading:first-child {
order: 1;
}
.hana-mod-txt-02 {
font-size: calc(13 * var(--base-size));
line-height: calc(23.4 / 13);
letter-spacing: 0.05em;
}
.hana-mod-txt-03 {
font-size: calc(13 * var(--base-size));
line-height: calc(19.5 / 13);
letter-spacing: 0.05em;
}
footer.uc-page-footer {
background-color: #ffffff;
}
.sec-profile .hana-contents-block {
background: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-08.png)
no-repeat;
background-size: 100% 100%;
}
.hana-mod-white-block {
border-radius: 40px;
padding: 20px;
background-color: var(--hanaColabo-color-white);
margin-bottom: 40px;
}
.hana-mod-grid-02 {
display: flex;
justify-content: left;
gap: 20px 15px;
max-width: 600px;
margin: 0 auto;
flex-direction: row;
flex-wrap: wrap;
margin-bottom: 40px;
}
.hana-mod-grid-02 > .section {
-webkit-box-flex: 0;
-ms-flex: calc(50% - 7.5px);
flex: 0 0 calc(50% - 7.5px);
max-width: calc(50% - 7.5px);
}
.hana-mod-media-02 {
text-align: center;
color: #362268;
line-height: calc(19.6 / 14);
font-size: calc(14 * var(--base-size));
letter-spacing: 0.05em;
}
.hana-mod-media-02 .uc-object {
margin-bottom: 10px;
img {
background: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-04.png)
no-repeat;
background-size: cover;
display: inline-block;
padding: 32px 6.25% 8px;
}
}
.hana-mod-media-02 .uc-object span {
display: inline-block;
}
.hana-mod-media-02 .uc-object img {
width: 100%;
}
.hana-mod-media-03 {
text-align: center;
color: #362268;
line-height: calc(19.6 / 14);
font-size: calc(14 * var(--base-size));
letter-spacing: 0.05em;
}
.hana-mod-media-03 .uc-object {
margin-bottom: 10px;
img {
background: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-05.png)
no-repeat;
background-size: cover;
padding: 32px 6.25% 8px;
}
}
.hana-mod-media-03 .uc-object span {
display: inline-block;
}
.hana-product-media-01 {
display: block;
margin-bottom: 4px;
}
.hana-product-media-01 a {
color: inherit;
}
.hana-product-media-01 a:hover b {
text-decoration: underline;
}
[class*="hana-mod-title-"] {
display: inline-block;
}
.hana-mod-title-01 {
display: block;
}
.hana-mod-title-02 {
margin-bottom: 4px;
}
.hana-product-scent {
display: inline-block;
padding: 4px 25px;
background: rgba(230, 149, 182, 0.2);
border-radius: 13.5px;
line-height: calc(19.01 / 13);
font-size: calc(13 * var(--base-size));
margin-bottom: 10px;
font-weight: var(--hana-f-weight-normal);
}
.hana-product-detail {
font-weight: var(--hana-f-weight-normal);
display: block;
border-radius: 13.5px;
}
.hana-free-block {
padding: 60px 20px;
}
.hana-contents-bottom-bg {
background: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-06.png)
no-repeat;
background-size: 100% 80px;
background-position: center bottom;
}
@media screen and (min-width: 500px) and (max-width: 768px) {
.hana-mod-media-02 .uc-object {
width: 80%;
margin-inline: auto;
}
}
@media screen and (max-width: 768px) {
:root{
}
.hana-mod-disp-block-sp {
display: block !important;
}
.hana-mod-disp-inline-block-sp {
display: inline-block !important;
}
.hana-mod-disp-inline-sp {
display: inline !important;
}
.hana-mod-disp-flex-sp {
display: flex !important;
}
.uc-mod-ad-center-sp {
text-align: center !important;
}
.uc-mod-ad-start-sp {
text-align: center !important;
}
.uc-mod-ad-end-sp {
text-align: center !important;
}
.hana-mod-float-inline-start-sp {
float: inline-start;
}
.hana-mod-br-before-sp::before {
content: "\A";
white-space: pre;
}
.hana-mod-br-after-sp::after {
content: "\A";
white-space: pre;
}
.f-weight-normal-sp {
font-weight: var(--hana-f-weight-normal) !important;
}
.f-weight-bold-sp {
font-weight: var(--hana-f-weight-bold) !important;
}
.hana-mt-04-sp {
margin-top: 4px !important;
}
.hana-mt-05-sp {
margin-top: 5px !important;
}
.hana-mt-08-sp {
margin-top: 8px !important;
}
.hana-mt-10-sp {
margin-top: 10px !important;
}
.hana-mt-12-sp {
margin-top: 12px !important;
}
.hana-mt-15-sp {
margin-top: 15px !important;
}
.hana-mt-16-sp {
margin-top: 16px !important;
}
.hana-mt-20-sp {
margin-top: 20px !important;
}
.hana-mt-24-sp {
margin-top: 24px !important;
}
.hana-mt-25-sp {
margin-top: 25px !important;
}
.hana-mt-28-sp {
margin-top: 28px !important;
}
.hana-mt-30-sp {
margin-top: 30px !important;
}
.hana-mt-32-sp {
margin-top: 32px !important;
}
.hana-mt-35-sp {
margin-top: 35px !important;
}
.hana-mt-36-sp {
margin-top: 36px !important;
}
.hana-mt-40-sp {
margin-top: 40px !important;
}
.hana-mt-44-sp {
margin-top: 44px !important;
}
.hana-mt-45-sp {
margin-top: 45px !important;
}
.hana-mt-48-sp {
margin-top: 48px !important;
}
.hana-mt-50-sp {
margin-top: 50px !important;
}
.hana-mt-52-sp {
margin-top: 52px !important;
}
.hana-mt-55-sp {
margin-top: 55px !important;
}
.hana-mt-56-sp {
margin-top: 56px !important;
}
.hana-mt-60-sp {
margin-top: 60px !important;
}
.hana-mt-64-sp {
margin-top: 64px !important;
}
.hana-mt-65-sp {
margin-top: 65px !important;
}
.hana-mt-68-sp {
margin-top: 68px !important;
}
.hana-mt-70-sp {
margin-top: 70px !important;
}
.hana-mt-72-sp {
margin-top: 72px !important;
}
.hana-mt-75-sp {
margin-top: 7rpx !important;
}
.hana-mt-76-sp {
margin-top: 76px !important;
}
.hana-mt-80-sp {
margin-top: 80px !important;
}
.hana-mt-84-sp {
margin-top: 84px !important;
}
.hana-mt-85-sp {
margin-top: 85px !important;
}
.hana-mt-88-sp {
margin-top: 88px !important;
}
.hana-mt-90-sp {
margin-top: 90px !important;
}
.hana-mt-92-sp {
margin-top: 92px !important;
}
.hana-mt-95-sp {
margin-top: 95px !important;
}
.hana-mt-96-sp {
margin-top: 96px !important;
}
.hana-mr-04-sp {
margin-right: 4px !important;
}
.hana-mr-05-sp {
margin-right: 5px !important;
}
.hana-mr-08-sp {
margin-right: 8px !important;
}
.hana-mr-10-sp {
margin-right: 10px !important;
}
.hana-mr-12-sp {
margin-right: 12px !important;
}
.hana-mr-15-sp {
margin-right: 15px !important;
}
.hana-mr-16-sp {
margin-right: 16px !important;
}
.hana-mr-20-sp {
margin-right: 20px !important;
}
.hana-mr-24-sp {
margin-right: 24px !important;
}
.hana-mr-25-sp {
margin-right: 25px !important;
}
.hana-mr-28-sp {
margin-right: 28px !important;
}
.hana-mr-30-sp {
margin-right: 30px !important;
}
.hana-mr-32-sp {
margin-right: 32px !important;
}
.hana-mr-35-sp {
margin-right: 35px !important;
}
.hana-mr-36-sp {
margin-right: 36px !important;
}
.hana-mr-40-sp {
margin-right: 40px !important;
}
.hana-mr-44-sp {
margin-right: 44px !important;
}
.hana-mr-45-sp {
margin-right: 45px !important;
}
.hana-mr-48-sp {
margin-right: 48px !important;
}
.hana-mr-50-sp {
margin-right: 50px !important;
}
.hana-mr-52-sp {
margin-right: 52px !important;
}
.hana-mr-55-sp {
margin-right: 55px !important;
}
.hana-mr-56-sp {
margin-right: 56px !important;
}
.hana-mr-60-sp {
margin-right: 60px !important;
}
.hana-mr-64-sp {
margin-right: 64px !important;
}
.hana-mr-65-sp {
margin-right: 65px !important;
}
.hana-mr-68-sp {
margin-right: 68px !important;
}
.hana-mr-70-sp {
margin-right: 70px !important;
}
.hana-mr-72-sp {
margin-right: 72px !important;
}
.hana-mr-75-sp {
margin-right: 75px !important;
}
.hana-mr-76-sp {
margin-right: 76px !important;
}
.hana-mr-80-sp {
margin-right: 80px !important;
}
.hana-mr-84-sp {
margin-right: 84px !important;
}
.hana-mr-85-sp {
margin-right: 85px !important;
}
.hana-mr-88-sp {
margin-right: 88px !important;
}
.hana-mr-90-sp {
margin-right: 90px !important;
}
.hana-mr-92-sp {
margin-right: 92px !important;
}
.hana-mr-95-sp {
margin-right: 95px !important;
}
.hana-mr-96-sp {
margin-right: 96px !important;
}
.hana-mb-04-sp {
margin-bottom: 4px !important;
}
.hana-mb-05-sp {
margin-bottom: 5px !important;
}
.hana-mb-08-sp {
margin-bottom: 8px !important;
}
.hana-mb-10-sp {
margin-bottom: 10px !important;
}
.hana-mb-12-sp {
margin-bottom: 12px !important;
}
.hana-mb-15-sp {
margin-bottom: 15px !important;
}
.hana-mb-16-sp {
margin-bottom: 16px !important;
}
.hana-mb-20-sp {
margin-bottom: 20px !important;
}
.hana-mb-24-sp {
margin-bottom: 24px !important;
}
.hana-mb-25-sp {
margin-bottom: 25px !important;
}
.hana-mb-28-sp {
margin-bottom: 28px !important;
}
.hana-mb-30-sp {
margin-bottom: 30px !important;
}
.hana-mb-32-sp {
margin-bottom: 32px !important;
}
.hana-mb-35-sp {
margin-bottom: 35px !important;
}
.hana-mb-36-sp {
margin-bottom: 36px !important;
}
.hana-mb-40-sp {
margin-bottom: 40px !important;
}
.hana-mb-44-sp {
margin-bottom: 44px !important;
}
.hana-mb-45-sp {
margin-bottom: 45px !important;
}
.hana-mb-48-sp {
margin-bottom: 48px !important;
}
.hana-mb-50-sp {
margin-bottom: 50px !important;
}
.hana-mb-52-sp {
margin-bottom: 52px !important;
}
.hana-mb-55-sp {
margin-bottom: 55px !important;
}
.hana-mb-56-sp {
margin-bottom: 56px !important;
}
.hana-mb-60-sp {
margin-bottom: 60px !important;
}
.hana-mb-64-sp {
margin-bottom: 64px !important;
}
.hana-mb-65-sp {
margin-bottom: 65px !important;
}
.hana-mb-68-sp {
margin-bottom: 68px !important;
}
.hana-mb-70-sp {
margin-bottom: 70px !important;
}
.hana-mb-72-sp {
margin-bottom: 72px !important;
}
.hana-mb-75-sp {
margin-bottom: 75px !important;
}
.hana-mb-76-sp {
margin-bottom: 76px !important;
}
.hana-mb-80-sp {
margin-bottom: 80px !important;
}
.hana-mb-84-sp {
margin-bottom: 84px !important;
}
.hana-mb-85-sp {
margin-bottom: 85px !important;
}
.hana-mb-88-sp {
margin-bottom: 88px !important;
}
.hana-mb-90-sp {
margin-bottom: 90px !important;
}
.hana-mb-92-sp {
margin-bottom: 92px !important;
}
.hana-mb-95-sp {
margin-bottom: 95px !important;
}
.hana-mb-96-sp {
margin-bottom: 96px !important;
}
.hana-ml-04-sp {
margin-left: 4px !important;
}
.hana-ml-05-sp {
margin-left: 5px !important;
}
.hana-ml-08-sp {
margin-left: 8px !important;
}
.hana-ml-10-sp {
margin-left: 10px !important;
}
.hana-ml-12-sp {
margin-left: 12px !important;
}
.hana-ml-15-sp {
margin-left: 15px !important;
}
.hana-ml-16-sp {
margin-left: 16px !important;
}
.hana-ml-20-sp {
margin-left: 20px !important;
}
.hana-ml-24-sp {
margin-left: 24px !important;
}
.hana-ml-25-sp {
margin-left: 25px !important;
}
.hana-ml-28-sp {
margin-left: 28px !important;
}
.hana-ml-30-sp {
margin-left: 30px !important;
}
.hana-ml-32-sp {
margin-left: 32px !important;
}
.hana-ml-35-sp {
margin-left: 35px !important;
}
.hana-ml-36-sp {
margin-left: 36px !important;
}
.hana-ml-40-sp {
margin-left: 40px !important;
}
.hana-ml-44-sp {
margin-left: 44px !important;
}
.hana-ml-45-sp {
margin-left: 45px !important;
}
.hana-ml-48-sp {
margin-left: 48px !important;
}
.hana-ml-50-sp {
margin-left: 50px !important;
}
.hana-ml-52-sp {
margin-left: 52px !important;
}
.hana-ml-5r-sp {
margin-left: 55px !important;
}
.hana-ml-56-sp {
margin-left: 56px !important;
}
.hana-ml-60-sp {
margin-left: 60px !important;
}
.hana-ml-64-sp {
margin-left: 64px !important;
}
.hana-ml-65-sp {
margin-left: 65px !important;
}
.hana-ml-68-sp {
margin-left: 68px !important;
}
.hana-ml-70-sp {
margin-left: 70px !important;
}
.hana-ml-72-sp {
margin-left: 72px !important;
}
.hana-ml-75-sp {
margin-left: 75px !important;
}
.hana-ml-76-sp {
margin-left: 76px !important;
}
.hana-ml-80-sp {
margin-left: 80px !important;
}
.hana-ml-84-sp {
margin-left: 84px !important;
}
.hana-ml-85-sp {
margin-left: 85px !important;
}
.hana-ml-88-sp {
margin-left: 88px !important;
}
.hana-ml-90-sp {
margin-left: 90px !important;
}
.hana-ml-92-sp {
margin-left: 92px !important;
}
.hana-ml-95-sp {
margin-left: 95px !important;
}
.hana-ml-96-sp {
margin-left: 96px !important;
}
.hana-pt-04-sp {
padding-top: 4px !important;
}
.hana-pt-05-sp {
padding-top: 5px !important;
}
.hana-pt-08-sp {
padding-top: 8px !important;
}
.hana-pt-10-sp {
padding-top: 10px !important;
}
.hana-pt-12-sp {
padding-top: 12px !important;
}
.hana-pt-15-sp {
padding-top: 15px !important;
}
.hana-pt-16-sp {
padding-top: 16px !important;
}
.hana-pt-20-sp {
padding-top: 20px !important;
}
.hana-pt-24-sp {
padding-top: 24px !important;
}
.hana-pt-28-sp {
padding-top: 28px !important;
}
.hana-pt-30-sp {
padding-top: 30px !important;
}
.hana-pt-32-sp {
padding-top: 32px !important;
}
.hana-pt-35-sp {
padding-top: 35px !important;
}
.hana-pt-36-sp {
padding-top: 36px !important;
}
.hana-pt-40-sp {
padding-top: 40px !important;
}
.hana-pt-44-sp {
padding-top: 44px !important;
}
.hana-pt-45-sp {
padding-top: 45px !important;
}
.hana-pt-48-sp {
padding-top: 48px !important;
}
.hana-pt-50-sp {
padding-top: 50px !important;
}
.hana-pt-52-sp {
padding-top: 52px !important;
}
.hana-pt-55-sp {
padding-top: 55px !important;
}
.hana-pt-56-sp {
padding-top: 56px !important;
}
.hana-pt-60-sp {
padding-top: 60px !important;
}
.hana-pt-64-sp {
padding-top: 64px !important;
}
.hana-pt-65-sp {
padding-top: 65px !important;
}
.hana-pt-68-sp {
padding-top: 68px !important;
}
.hana-pt-70-sp {
padding-top: 70px !important;
}
.hana-pt-72-sp {
padding-top: 72px !important;
}
.hana-pt-75-sp {
padding-top: 75px !important;
}
.hana-pt-76-sp {
padding-top: 76px !important;
}
.hana-pt-80-sp {
padding-top: 80px !important;
}
.hana-pt-84-sp {
padding-top: 84px !important;
}
.hana-pt-85-sp {
padding-top: 85px !important;
}
.hana-pt-88-sp {
padding-top: 88px !important;
}
.hana-pt-90-sp {
padding-top: 90px !important;
}
.hana-pt-92-sp {
padding-top: 92px !important;
}
.hana-pt-95-sp {
padding-top: 95px !important;
}
.hana-pt-96-sp {
padding-top: 96px !important;
}
.hana-pr-04-sp {
padding-right: 4px !important;
}
.hana-pr-05-sp {
padding-right: 5px !important;
}
.hana-pr-08-sp {
padding-right: 8px !important;
}
.hana-pr-10-sp {
padding-right: 10px !important;
}
.hana-pr-12-sp {
padding-right: 12px !important;
}
.hana-pr-15-sp {
padding-right: 15px !important;
}
.hana-pr-16-sp {
padding-right: 16px !important;
}
.hana-pr-20-sp {
padding-right: 20px !important;
}
.hana-pr-24-sp {
padding-right: 24px !important;
}
.hana-pr-25-sp {
padding-right: 25px !important;
}
.hana-pr-28-sp {
padding-right: 28px !important;
}
.hana-pr-30-sp {
padding-right: 30px !important;
}
.hana-pr-32-sp {
padding-right: 32px !important;
}
.hana-pr-35-sp {
padding-right: 35px !important;
}
.hana-pr-36-sp {
padding-right: 36px !important;
}
.hana-pr-40-sp {
padding-right: 40px !important;
}
.hana-pr-44-sp {
padding-right: 44px !important;
}
.hana-pr-45-sp {
padding-right: 45px !important;
}
.hana-pr-48-sp {
padding-right: 48px !important;
}
.hana-pr-40-sp {
padding-right: 50px !important;
}
.hana-pr-52-sp {
padding-right: 52px !important;
}
.hana-pr-55-sp {
padding-right: 55px !important;
}
.hana-pr-56-sp {
padding-right: 56px !important;
}
.hana-pr-60-sp {
padding-right: 60px !important;
}
.hana-pr-64-sp {
padding-right: 64px !important;
}
.hana-pr-65-sp {
padding-right: 65px !important;
}
.hana-pr-68-sp {
padding-right: 68px !important;
}
.hana-pr-70-sp {
padding-right: 70px !important;
}
.hana-pr-72-sp {
padding-right: 72px !important;
}
.hana-pr-75-sp {
padding-right: 75px !important;
}
.hana-pr-76-sp {
padding-right: 76px !important;
}
.hana-pr-80-sp {
padding-right: 80px !important;
}
.hana-pr-84-sp {
padding-right: 84px !important;
}
.hana-pr-85-sp {
padding-right: 85px !important;
}
.hana-pr-88-sp {
padding-right: 88px !important;
}
.hana-pr-90-sp {
padding-right: 90px !important;
}
.hana-pr-92-sp {
padding-right: 92px !important;
}
.hana-pr-96-sp {
padding-right: 96px !important;
}
.hana-pb-04-sp {
padding-bottom: 4px !important;
}
.hana-pb-05-sp {
padding-bottom: 5px !important;
}
.hana-pb-08-sp {
padding-bottom: 8px !important;
}
.hana-pb-10-sp {
padding-bottom: 10px !important;
}
.hana-pb-12-sp {
padding-bottom: 12px !important;
}
.hana-pb-15-sp {
padding-bottom: 15px !important;
}
.hana-pb-16-sp {
padding-bottom: 16px !important;
}
.hana-pb-20-sp {
padding-bottom: 20px !important;
}
.hana-pb-24-sp {
padding-bottom: 24px !important;
}
.hana-pb-25-sp {
padding-bottom: 25px !important;
}
.hana-pb-28-sp {
padding-bottom: 28px !important;
}
.hana-pb-30-sp {
padding-bottom: 30px !important;
}
.hana-pb-32-sp {
padding-bottom: 32px !important;
}
.hana-pb-35-sp {
padding-bottom: 35px !important;
}
.hana-pb-36-sp {
padding-bottom: 36px !important;
}
.hana-pb-40-sp {
padding-bottom: 40px !important;
}
.hana-pb-44-sp {
padding-bottom: 44px !important;
}
.hana-pb-45-sp {
padding-bottom: 45px !important;
}
.hana-pb-48-sp {
padding-bottom: 48px !important;
}
.hana-pb-50-sp {
padding-bottom: 50px !important;
}
.hana-pb-52-sp {
padding-bottom: 52px !important;
}
.hana-pb-55-sp {
padding-bottom: 55px !important;
}
.hana-pb-56-sp {
padding-bottom: 56px !important;
}
.hana-pb-60-sp {
padding-bottom: 60px !important;
}
.hana-pb-64-sp {
padding-bottom: 64px !important;
}
.hana-pb-65-sp {
padding-bottom: 65px !important;
}
.hana-pb-68-sp {
padding-bottom: 68px !important;
}
.hana-pb-70-sp {
padding-bottom: 70px !important;
}
.hana-pb-72-sp {
padding-bottom: 72px !important;
}
.hana-pb-75-sp {
padding-bottom: 75px !important;
}
.hana-pb-76-sp {
padding-bottom: 76px !important;
}
.hana-pb-80-sp {
padding-bottom: 80px !important;
}
.hana-pb-84-sp {
padding-bottom: 84px !important;
}
.hana-pb-85-sp {
padding-bottom: 85px !important;
}
.hana-pb-88-sp {
padding-bottom: 88px !important;
}
.hana-pb-90-sp {
padding-bottom: 90px !important;
}
.hana-pb-92-sp {
padding-bottom: 92px !important;
}
.hana-pb-90-sp {
padding-bottom: 90px !important;
}
.hana-pb-96-sp {
padding-bottom: 96px !important;
}
.hana-pl-04-sp {
padding-left: 4px !important;
}
.hana-pl-05-sp {
padding-left: 5px !important;
}
.hana-pl-08-sp {
padding-left: 8px !important;
}
.hana-pl-10-sp {
padding-left: 10px !important;
}
.hana-pl-12-sp {
padding-left: 12px !important;
}
.hana-pl-15-sp {
padding-left: 15px !important;
}
.hana-pl-16-sp {
padding-left: 16px !important;
}
.hana-pl-20-sp {
padding-left: 20px !important;
}
.hana-pl-24-sp {
padding-left: 24px !important;
}
.hana-pl-25-sp {
padding-left: 25px !important;
}
.hana-pl-28-sp {
padding-left: 28px !important;
}
.hana-pl-30-sp {
padding-left: 30px !important;
}
.hana-pl-32-sp {
padding-left: 32px !important;
}
.hana-pl-35-sp {
padding-left: 35px !important;
}
.hana-pl-36-sp {
padding-left: 36px !important;
}
.hana-pl-40-sp {
padding-left: 40px !important;
}
.hana-pl-44-sp {
padding-left: 44px !important;
}
.hana-pl-45-sp {
padding-left: 45px !important;
}
.hana-pl-48-sp {
padding-left: 48px !important;
}
.hana-pl-50-sp {
padding-left: 50px !important;
}
.hana-pl-52-sp {
padding-left: 52px !important;
}
.hana-pl-55-sp {
padding-left: 55px !important;
}
.hana-pl-56-sp {
padding-left: 56px !important;
}
.hana-pl-60-sp {
padding-left: 60px !important;
}
.hana-pl-64-sp {
padding-left: 64px !important;
}
.hana-pl-65-sp {
padding-left: 65px !important;
}
.hana-pl-68-sp {
padding-left: 68px !important;
}
.hana-pl-70-sp {
padding-left: 70px !important;
}
.hana-pl-72-sp {
padding-left: 72px !important;
}
.hana-pl-75-sp {
padding-left: 75px !important;
}
.hana-pl-76-sp {
padding-left: 76px !important;
}
.hana-pl-80-sp {
padding-left: 80px !important;
}
.hana-pl-84-sp {
padding-left: 84px !important;
}
.hana-pl-85-sp {
padding-left: 85px !important;
}
.hana-pl-88-sp {
padding-left: 88px !important;
}
.hana-pl-90-sp {
padding-left: 90px !important;
}
.hana-pl-92-sp {
padding-left: 92px !important;
}
.hana-pl-95-sp {
padding-left: 95px !important;
}
.hana-pl-96-sp {
padding-left: 96px !important;
}
.hana-mb-0-sp {
margin-bottom: 0 !important;
}
.hana-pb-0-sp {
padding-bottom: 0 !important;
}
.hana-mod-flex-left-sp {
justify-content: left;
}
.hana-mod-flex-center-sp {
justify-content: center;
}
.hana-mod-flex-right-sp {
justify-content: right;
}
[class*="hana-responsive-hdg-media-"] span:has(img):first-child {
display: none;
}
.hana-mod-media-01 {
max-width: 240px;
}
/*
Start EC button */
.uc-custom-products__side-btn.uc-store-view-mode {
bottom: unset;
top: unset;
bottom: -1px;
right: unset;
left: 50%;
-webkit-transform: unset;
display: flex;
transform: translateX(-50%);
column-gap: 5px;
width: 100%;
max-width: 355px;
}
.uc-custom-products__side-btn.uc-store-view-mode > .CMP-CM26-ec-button {
width: calc(50% - 2.5px);
position: relative;
}
.uc-js-modal-inline-01.fc-ec-custom-store-list-modal-btn a {
width: auto;
display: block;
max-width: none;
padding: 14px 23px 13px 50px;
border-radius: 10px 10px 0 0;
font-size: calc(16 * var(--rem));
background-position-x: 17px;
background-position-y: center;
letter-spacing: 0;
}
.uc-js-modal-inline-01.fc-ec-custom-store-list-modal-btn text {
width: auto;
writing-mode: lr;
line-height: 1.5;
}
.uc-custom-products__side-btn.uc-store-view-mode
.uc-js-modal-inline-01.fc-ec-custom-store-list-modal-btn {
margin-bottom: 0;
}
.uc-custom-products__side-btn.uc-store-view-mode
.uc-js-modal-inline-01.fc-ec-custom-store-list-modal-btn,
.uc-custom-products__side-btn.uc-store-view-mode
.uc-custom-store-flort.uc-store-view-mode {
position: absolute;
top: unset;
bottom: 0;
min-width: 175px;
}
/* 取扱店舗 */
.uc-custom-store-flort.uc-store-view-mode {
width: auto;
border: none;
border-radius: 10px 10px 0 0;
}
.uc-custom-store-flort.uc-store-view-mode:not(:has(.uc-mod-cart-left)) a {
display: flex;
flex-direction: row;
padding: 14px 15px 13px 18px;
line-height: 1.5;
font-size: calc(16 * var(--rem));
align-items: center;
max-width: none;
letter-spacing: 0;
column-gap: 10px;
}
.uc-custom-store-flort.uc-store-view-mode:not(:has(.uc-mod-cart-left))
.uc-object {
width: 21.42px;
height: auto;
margin-bottom: 0;
}
.uc-custom-products__side-btn.uc-store-view-mode
.uc-store-view-mode
a:hover:before,
.uc-custom-products__side-btn.uc-store-view-mode
.fc-ec-custom-store-list-modal-btn
a:hover:before {
border-radius: 10px 10px 0 0;
}
.uc-custom-store-flort.uc-store-view-mode:not(:has(.uc-mod-cart-left))
.uc-caption {
flex: 1;
letter-spacing: 0;
}
.uc-page-footer .uc-lyt-col {
padding-bottom: 40px;
}
/*
End EC button*/
}
@media screen and (min-width: 769px) {
:root{
}
body:before {
content: '';
width: 100%;
background-image: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-01.jpg), url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-02.jpg);
background-repeat: no-repeat, repeat;
background-size: 100% auto;
background-position: center top, center -40px;
}
.hana-mod-disp-block-pc {
display: block !important;
}
.hana-mod-disp-inline-block-pc {
display: inline-block !important;
}
.hana-mod-disp-inline-pc {
display: inline !important;
}
.hana-mod-disp-flex-pc {
display: flex !important;
}
.hana-mod-float-inline-start-pc {
float: inline-start;
}
body {
background-image:
url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-01.jpg),
url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-02.jpg);
background-repeat: no-repeat, repeat;
background-size: 100% auto;
background-position:
center top,
center -40px;
}
.uc-mod-ad-center-pc {
text-align: center !important;
}
.uc-mod-ad-start-pc {
text-align: center !important;
}
.uc-mod-ad-end-pc {
text-align: center !important;
}
.hana-mod-br-before-pc::before {
content: "\A";
white-space: pre;
}
.hana-mod-br-after-pc::after {
content: "\A";
white-space: pre;
}
.f-weight-normal-pc {
font-weight: var(--hana-f-weight-normal) !important;
}
.f-weight-bold-pc {
font-weight: var(--hana-f-weight-bold) !important;
}
.hana-mt-04-pc {
margin-top: 4px !important;
}
.hana-mt-05-pc {
margin-top: 5px !important;
}
.hana-mt-08-pc {
margin-top: 8px !important;
}
.hana-mt-10-pc {
margin-top: 10px !important;
}
.hana-mt-12-pc {
margin-top: 12px !important;
}
.hana-mt-15-pc {
margin-top: 15px !important;
}
.hana-mt-16-pc {
margin-top: 16px !important;
}
.hana-mt-20-pc {
margin-top: 20px !important;
}
.hana-mt-24-pc {
margin-top: 24px !important;
}
.hana-mt-25-pc {
margin-top: 25px !important;
}
.hana-mt-28-pc {
margin-top: 28px !important;
}
.hana-mt-30-pc {
margin-top: 30px !important;
}
.hana-mt-32-pc {
margin-top: 32px !important;
}
.hana-mt-35-pc {
margin-top: 35px !important;
}
.hana-mt-36-pc {
margin-top: 36px !important;
}
.hana-mt-40-pc {
margin-top: 40px !important;
}
.hana-mt-44-pc {
margin-top: 44px !important;
}
.hana-mt-45-pc {
margin-top: 45px !important;
}
.hana-mt-48-pc {
margin-top: 48px !important;
}
.hana-mt-50-pc {
margin-top: 50px !important;
}
.hana-mt-52-pc {
margin-top: 52px !important;
}
.hana-mt-55-pc {
margin-top: 55px !important;
}
.hana-mt-56-pc {
margin-top: 56px !important;
}
.hana-mt-60-pc {
margin-top: 60px !important;
}
.hana-mt-64-pc {
margin-top: 64px !important;
}
.hana-mt-65-pc {
margin-top: 65px !important;
}
.hana-mt-68-pc {
margin-top: 68px !important;
}
.hana-mt-70-pc {
margin-top: 70px !important;
}
.hana-mt-72-pc {
margin-top: 72px !important;
}
.hana-mt-75-pc {
margin-top: 7rpx !important;
}
.hana-mt-76-pc {
margin-top: 76px !important;
}
.hana-mt-80-pc {
margin-top: 80px !important;
}
.hana-mt-84-pc {
margin-top: 84px !important;
}
.hana-mt-85-pc {
margin-top: 85px !important;
}
.hana-mt-88-pc {
margin-top: 88px !important;
}
.hana-mt-90-pc {
margin-top: 90px !important;
}
.hana-mt-92-pc {
margin-top: 92px !important;
}
.hana-mt-95-pc {
margin-top: 95px !important;
}
.hana-mt-96-pc {
margin-top: 96px !important;
}
.hana-mr-04-pc {
margin-right: 4px !important;
}
.hana-mr-05-pc {
margin-right: 5px !important;
}
.hana-mr-08-pc {
margin-right: 8px !important;
}
.hana-mr-10-pc {
margin-right: 10px !important;
}
.hana-mr-12-pc {
margin-right: 12px !important;
}
.hana-mr-15-pc {
margin-right: 15px !important;
}
.hana-mr-16-pc {
margin-right: 16px !important;
}
.hana-mr-20-pc {
margin-right: 20px !important;
}
.hana-mr-24-pc {
margin-right: 24px !important;
}
.hana-mr-25-pc {
margin-right: 25px !important;
}
.hana-mr-28-pc {
margin-right: 28px !important;
}
.hana-mr-30-pc {
margin-right: 30px !important;
}
.hana-mr-32-pc {
margin-right: 32px !important;
}
.hana-mr-35-pc {
margin-right: 35px !important;
}
.hana-mr-36-pc {
margin-right: 36px !important;
}
.hana-mr-40-pc {
margin-right: 40px !important;
}
.hana-mr-44-pc {
margin-right: 44px !important;
}
.hana-mr-45-pc {
margin-right: 45px !important;
}
.hana-mr-48-pc {
margin-right: 48px !important;
}
.hana-mr-50-pc {
margin-right: 50px !important;
}
.hana-mr-52-pc {
margin-right: 52px !important;
}
.hana-mr-55-pc {
margin-right: 55px !important;
}
.hana-mr-56-pc {
margin-right: 56px !important;
}
.hana-mr-60-pc {
margin-right: 60px !important;
}
.hana-mr-64-pc {
margin-right: 64px !important;
}
.hana-mr-65-pc {
margin-right: 65px !important;
}
.hana-mr-68-pc {
margin-right: 68px !important;
}
.hana-mr-70-pc {
margin-right: 70px !important;
}
.hana-mr-72-pc {
margin-right: 72px !important;
}
.hana-mr-75-pc {
margin-right: 75px !important;
}
.hana-mr-76-pc {
margin-right: 76px !important;
}
.hana-mr-80-pc {
margin-right: 80px !important;
}
.hana-mr-84-pc {
margin-right: 84px !important;
}
.hana-mr-85-pc {
margin-right: 85px !important;
}
.hana-mr-88-pc {
margin-right: 88px !important;
}
.hana-mr-90-pc {
margin-right: 90px !important;
}
.hana-mr-92-pc {
margin-right: 92px !important;
}
.hana-mr-95-pc {
margin-right: 95px !important;
}
.hana-mr-96-pc {
margin-right: 96px !important;
}
.hana-mb-04-pc {
margin-bottom: 4px !important;
}
.hana-mb-05-pc {
margin-bottom: 5px !important;
}
.hana-mb-08-pc {
margin-bottom: 8px !important;
}
.hana-mb-10-pc {
margin-bottom: 10px !important;
}
.hana-mb-12-pc {
margin-bottom: 12px !important;
}
.hana-mb-15-pc {
margin-bottom: 15px !important;
}
.hana-mb-16-pc {
margin-bottom: 16px !important;
}
.hana-mb-20-pc {
margin-bottom: 20px !important;
}
.hana-mb-24-pc {
margin-bottom: 24px !important;
}
.hana-mb-25-pc {
margin-bottom: 25px !important;
}
.hana-mb-28-pc {
margin-bottom: 28px !important;
}
.hana-mb-30-pc {
margin-bottom: 30px !important;
}
.hana-mb-32-pc {
margin-bottom: 32px !important;
}
.hana-mb-35-pc {
margin-bottom: 35px !important;
}
.hana-mb-36-pc {
margin-bottom: 36px !important;
}
.hana-mb-40-pc {
margin-bottom: 40px !important;
}
.hana-mb-44-pc {
margin-bottom: 44px !important;
}
.hana-mb-45-pc {
margin-bottom: 45px !important;
}
.hana-mb-48-pc {
margin-bottom: 48px !important;
}
.hana-mb-50-pc {
margin-bottom: 50px !important;
}
.hana-mb-52-pc {
margin-bottom: 52px !important;
}
.hana-mb-55-pc {
margin-bottom: 55px !important;
}
.hana-mb-56-pc {
margin-bottom: 56px !important;
}
.hana-mb-60-pc {
margin-bottom: 60px !important;
}
.hana-mb-64-pc {
margin-bottom: 64px !important;
}
.hana-mb-65-pc {
margin-bottom: 65px !important;
}
.hana-mb-68-pc {
margin-bottom: 68px !important;
}
.hana-mb-70-pc {
margin-bottom: 70px !important;
}
.hana-mb-72-pc {
margin-bottom: 72px !important;
}
.hana-mb-75-pc {
margin-bottom: 75px !important;
}
.hana-mb-76-pc {
margin-bottom: 76px !important;
}
.hana-mb-80-pc {
margin-bottom: 80px !important;
}
.hana-mb-84-pc {
margin-bottom: 84px !important;
}
.hana-mb-85-pc {
margin-bottom: 85px !important;
}
.hana-mb-88-pc {
margin-bottom: 88px !important;
}
.hana-mb-90-pc {
margin-bottom: 90px !important;
}
.hana-mb-92-pc {
margin-bottom: 92px !important;
}
.hana-mb-95-pc {
margin-bottom: 95px !important;
}
.hana-mb-96-pc {
margin-bottom: 96px !important;
}
.hana-ml-04-pc {
margin-left: 4px !important;
}
.hana-ml-05-pc {
margin-left: 5px !important;
}
.hana-ml-08-pc {
margin-left: 8px !important;
}
.hana-ml-10-pc {
margin-left: 10px !important;
}
.hana-ml-12-pc {
margin-left: 12px !important;
}
.hana-ml-15-pc {
margin-left: 15px !important;
}
.hana-ml-16-pc {
margin-left: 16px !important;
}
.hana-ml-20-pc {
margin-left: 20px !important;
}
.hana-ml-24-pc {
margin-left: 24px !important;
}
.hana-ml-25-pc {
margin-left: 25px !important;
}
.hana-ml-28-pc {
margin-left: 28px !important;
}
.hana-ml-30-pc {
margin-left: 30px !important;
}
.hana-ml-32-pc {
margin-left: 32px !important;
}
.hana-ml-35-pc {
margin-left: 35px !important;
}
.hana-ml-36-pc {
margin-left: 36px !important;
}
.hana-ml-40-pc {
margin-left: 40px !important;
}
.hana-ml-44-pc {
margin-left: 44px !important;
}
.hana-ml-45-pc {
margin-left: 45px !important;
}
.hana-ml-48-pc {
margin-left: 48px !important;
}
.hana-ml-50-pc {
margin-left: 50px !important;
}
.hana-ml-52-pc {
margin-left: 52px !important;
}
.hana-ml-5r-pc {
margin-left: 55px !important;
}
.hana-ml-56-pc {
margin-left: 56px !important;
}
.hana-ml-60-pc {
margin-left: 60px !important;
}
.hana-ml-64-pc {
margin-left: 64px !important;
}
.hana-ml-65-pc {
margin-left: 65px !important;
}
.hana-ml-68-pc {
margin-left: 68px !important;
}
.hana-ml-70-pc {
margin-left: 70px !important;
}
.hana-ml-72-pc {
margin-left: 72px !important;
}
.hana-ml-75-pc {
margin-left: 75px !important;
}
.hana-ml-76-pc {
margin-left: 76px !important;
}
.hana-ml-80-pc {
margin-left: 80px !important;
}
.hana-ml-84-pc {
margin-left: 84px !important;
}
.hana-ml-85-pc {
margin-left: 85px !important;
}
.hana-ml-88-pc {
margin-left: 88px !important;
}
.hana-ml-90-pc {
margin-left: 90px !important;
}
.hana-ml-92-pc {
margin-left: 92px !important;
}
.hana-ml-95-pc {
margin-left: 95px !important;
}
.hana-ml-96-pc {
margin-left: 96px !important;
}
.hana-pt-04-pc {
padding-top: 4px !important;
}
.hana-pt-05-pc {
padding-top: 5px !important;
}
.hana-pt-08-pc {
padding-top: 8px !important;
}
.hana-pt-10-pc {
padding-top: 10px !important;
}
.hana-pt-12-pc {
padding-top: 12px !important;
}
.hana-pt-15-pc {
padding-top: 15px !important;
}
.hana-pt-16-pc {
padding-top: 16px !important;
}
.hana-pt-20-pc {
padding-top: 20px !important;
}
.hana-pt-24-pc {
padding-top: 24px !important;
}
.hana-pt-28-pc {
padding-top: 28px !important;
}
.hana-pt-30-pc {
padding-top: 30px !important;
}
.hana-pt-32-pc {
padding-top: 32px !important;
}
.hana-pt-35-pc {
padding-top: 35px !important;
}
.hana-pt-36-pc {
padding-top: 36px !important;
}
.hana-pt-40-pc {
padding-top: 40px !important;
}
.hana-pt-44-pc {
padding-top: 44px !important;
}
.hana-pt-45-pc {
padding-top: 45px !important;
}
.hana-pt-48-pc {
padding-top: 48px !important;
}
.hana-pt-50-pc {
padding-top: 50px !important;
}
.hana-pt-52-pc {
padding-top: 52px !important;
}
.hana-pt-55-pc {
padding-top: 55px !important;
}
.hana-pt-56-pc {
padding-top: 56px !important;
}
.hana-pt-60-pc {
padding-top: 60px !important;
}
.hana-pt-64-pc {
padding-top: 64px !important;
}
.hana-pt-65-pc {
padding-top: 65px !important;
}
.hana-pt-68-pc {
padding-top: 68px !important;
}
.hana-pt-70-pc {
padding-top: 70px !important;
}
.hana-pt-72-pc {
padding-top: 72px !important;
}
.hana-pt-75-pc {
padding-top: 75px !important;
}
.hana-pt-76-pc {
padding-top: 76px !important;
}
.hana-pt-80-pc {
padding-top: 80px !important;
}
.hana-pt-84-pc {
padding-top: 84px !important;
}
.hana-pt-85-pc {
padding-top: 85px !important;
}
.hana-pt-88-pc {
padding-top: 88px !important;
}
.hana-pt-90-pc {
padding-top: 90px !important;
}
.hana-pt-92-pc {
padding-top: 92px !important;
}
.hana-pt-95-pc {
padding-top: 95px !important;
}
.hana-pt-96-pc {
padding-top: 96px !important;
}
.hana-pr-04-pc {
padding-right: 4px !important;
}
.hana-pr-05-pc {
padding-right: 5px !important;
}
.hana-pr-08-pc {
padding-right: 8px !important;
}
.hana-pr-10-pc {
padding-right: 10px !important;
}
.hana-pr-12-pc {
padding-right: 12px !important;
}
.hana-pr-15-pc {
padding-right: 15px !important;
}
.hana-pr-16-pc {
padding-right: 16px !important;
}
.hana-pr-20-pc {
padding-right: 20px !important;
}
.hana-pr-24-pc {
padding-right: 24px !important;
}
.hana-pr-25-pc {
padding-right: 25px !important;
}
.hana-pr-28-pc {
padding-right: 28px !important;
}
.hana-pr-30-pc {
padding-right: 30px !important;
}
.hana-pr-32-pc {
padding-right: 32px !important;
}
.hana-pr-35-pc {
padding-right: 35px !important;
}
.hana-pr-36-pc {
padding-right: 36px !important;
}
.hana-pr-40-pc {
padding-right: 40px !important;
}
.hana-pr-44-pc {
padding-right: 44px !important;
}
.hana-pr-45-pc {
padding-right: 45px !important;
}
.hana-pr-48-pc {
padding-right: 48px !important;
}
.hana-pr-40-pc {
padding-right: 50px !important;
}
.hana-pr-52-pc {
padding-right: 52px !important;
}
.hana-pr-55-pc {
padding-right: 55px !important;
}
.hana-pr-56-pc {
padding-right: 56px !important;
}
.hana-pr-60-pc {
padding-right: 60px !important;
}
.hana-pr-64-pc {
padding-right: 64px !important;
}
.hana-pr-65-pc {
padding-right: 65px !important;
}
.hana-pr-68-pc {
padding-right: 68px !important;
}
.hana-pr-70-pc {
padding-right: 70px !important;
}
.hana-pr-72-pc {
padding-right: 72px !important;
}
.hana-pr-75-pc {
padding-right: 75px !important;
}
.hana-pr-76-pc {
padding-right: 76px !important;
}
.hana-pr-80-pc {
padding-right: 80px !important;
}
.hana-pr-84-pc {
padding-right: 84px !important;
}
.hana-pr-85-pc {
padding-right: 85px !important;
}
.hana-pr-88-pc {
padding-right: 88px !important;
}
.hana-pr-90-pc {
padding-right: 90px !important;
}
.hana-pr-92-pc {
padding-right: 92px !important;
}
.hana-pr-96-pc {
padding-right: 96px !important;
}
.hana-pb-04-pc {
padding-bottom: 4px !important;
}
.hana-pb-05-pc {
padding-bottom: 5px !important;
}
.hana-pb-08-pc {
padding-bottom: 8px !important;
}
.hana-pb-10-pc {
padding-bottom: 10px !important;
}
.hana-pb-12-pc {
padding-bottom: 12px !important;
}
.hana-pb-15-pc {
padding-bottom: 15px !important;
}
.hana-pb-16-pc {
padding-bottom: 16px !important;
}
.hana-pb-20-pc {
padding-bottom: 20px !important;
}
.hana-pb-24-pc {
padding-bottom: 24px !important;
}
.hana-pb-25-pc {
padding-bottom: 25px !important;
}
.hana-pb-28-pc {
padding-bottom: 28px !important;
}
.hana-pb-30-pc {
padding-bottom: 30px !important;
}
.hana-pb-32-pc {
padding-bottom: 32px !important;
}
.hana-pb-35-pc {
padding-bottom: 35px !important;
}
.hana-pb-36-pc {
padding-bottom: 36px !important;
}
.hana-pb-40-pc {
padding-bottom: 40px !important;
}
.hana-pb-44-pc {
padding-bottom: 44px !important;
}
.hana-pb-45-pc {
padding-bottom: 45px !important;
}
.hana-pb-48-pc {
padding-bottom: 48px !important;
}
.hana-pb-50-pc {
padding-bottom: 50px !important;
}
.hana-pb-52-pc {
padding-bottom: 52px !important;
}
.hana-pb-55-pc {
padding-bottom: 55px !important;
}
.hana-pb-56-pc {
padding-bottom: 56px !important;
}
.hana-pb-60-pc {
padding-bottom: 60px !important;
}
.hana-pb-64-pc {
padding-bottom: 64px !important;
}
.hana-pb-65-pc {
padding-bottom: 65px !important;
}
.hana-pb-68-pc {
padding-bottom: 68px !important;
}
.hana-pb-70-pc {
padding-bottom: 70px !important;
}
.hana-pb-72-pc {
padding-bottom: 72px !important;
}
.hana-pb-75-pc {
padding-bottom: 75px !important;
}
.hana-pb-76-pc {
padding-bottom: 76px !important;
}
.hana-pb-80-pc {
padding-bottom: 80px !important;
}
.hana-pb-84-pc {
padding-bottom: 84px !important;
}
.hana-pb-85-pc {
padding-bottom: 85px !important;
}
.hana-pb-88-pc {
padding-bottom: 88px !important;
}
.hana-pb-90-pc {
padding-bottom: 90px !important;
}
.hana-pb-92-pc {
padding-bottom: 92px !important;
}
.hana-pb-90-pc {
padding-bottom: 90px !important;
}
.hana-pb-96-pc {
padding-bottom: 96px !important;
}
.hana-pl-04-pc {
padding-left: 4px !important;
}
.hana-pl-05-pc {
padding-left: 5px !important;
}
.hana-pl-08-pc {
padding-left: 8px !important;
}
.hana-pl-10-pc {
padding-left: 10px !important;
}
.hana-pl-12-pc {
padding-left: 12px !important;
}
.hana-pl-15-pc {
padding-left: 15px !important;
}
.hana-pl-16-pc {
padding-left: 16px !important;
}
.hana-pl-20-pc {
padding-left: 20px !important;
}
.hana-pl-24-pc {
padding-left: 24px !important;
}
.hana-pl-25-pc {
padding-left: 25px !important;
}
.hana-pl-28-pc {
padding-left: 28px !important;
}
.hana-pl-30-pc {
padding-left: 30px !important;
}
.hana-pl-32-pc {
padding-left: 32px !important;
}
.hana-pl-35-pc {
padding-left: 35px !important;
}
.hana-pl-36-pc {
padding-left: 36px !important;
}
.hana-pl-40-pc {
padding-left: 40px !important;
}
.hana-pl-44-pc {
padding-left: 44px !important;
}
.hana-pl-45-pc {
padding-left: 45px !important;
}
.hana-pl-48-pc {
padding-left: 48px !important;
}
.hana-pl-50-pc {
padding-left: 50px !important;
}
.hana-pl-52-pc {
padding-left: 52px !important;
}
.hana-pl-55-pc {
padding-left: 55px !important;
}
.hana-pl-56-pc {
padding-left: 56px !important;
}
.hana-pl-60-pc {
padding-left: 60px !important;
}
.hana-pl-64-pc {
padding-left: 64px !important;
}
.hana-pl-65-pc {
padding-left: 65px !important;
}
.hana-pl-68-pc {
padding-left: 68px !important;
}
.hana-pl-70-pc {
padding-left: 70px !important;
}
.hana-pl-72-pc {
padding-left: 72px !important;
}
.hana-pl-75-pc {
padding-left: 75px !important;
}
.hana-pl-76-pc {
padding-left: 76px !important;
}
.hana-pl-80-pc {
padding-left: 80px !important;
}
.hana-pl-84-pc {
padding-left: 84px !important;
}
.hana-pl-85-pc {
padding-left: 85px !important;
}
.hana-pl-88-pc {
padding-left: 88px !important;
}
.hana-pl-90-pc {
padding-left: 90px !important;
}
.hana-pl-92-pc {
padding-left: 92px !important;
}
.hana-pl-95-pc {
padding-left: 95px !important;
}
.hana-pl-96-pc {
padding-left: 96px !important;
}
.hana-mb-0-pc {
margin-bottom: 0 !important;
}
.hana-pb-0-pc {
padding-bottom: 0 !important;
}
.hana-mod-flex-left-pc {
justify-content: left;
}
.hana-mod-flex-center-pc {
justify-content: center;
}
.hana-mod-flex-right-pc {
justify-content: right;
}
.sec-kv {
padding-bottom: 77px;
}
.hana-mod-hdg-lv2-01 {
font-size: calc(40 * var(--base-size));
margin-bottom: calc(84 * var(--base-size));
}
.hana-mod-hdg-lv2-01 h2::after {
width: 144px;
height: 114px;
top: -41px;
left: calc(100% + 38px);
}
.hana-responsive-hdg-media-01.hana-mod-hdg-lv2-01 > * {
max-width: none;
}
[class*="hana-responsive-hdg-media-"] span:has(img):last-child {
display: none;
}
.hana-mod-hdg-lv2-02 {
margin-bottom: 40px;
img {
height: 39px;
}
span {
background: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-07.svg)
no-repeat;
background-size: calc(100% - 240px) 5px;
background-position: right center;
}
}
.hana-mod-hdg-lv2-03 {
margin-bottom: 53px;
img {
height: 39px;
}
span {
background-image: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-09.svg);
background-size: calc(100% - 136px) 5px;
background-position: left center;
}
}
.hana-mod-hdg-lv2-04 {
background-position: left calc(100% - 25px);
margin-bottom: 50px;
text-align: center;
> h2 {
position: relative;
display: inline-block;
max-width: none;
margin-inline: auto;
}
}
.hana-mod-hdg-lv2-04 h2 {
position: relative;
&::before {
content: "";
width: 168px;
height: 132px;
transform: translateY(0%);
position: absolute;
top: -45px;
left: -80px;
background-image: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-contents-01.png);
background-size: 100% auto;
background-position: left top;
}
&::after {
content: "";
width: 130px;
height: 99px;
/* transform: translateY(-45px); */
position: absolute;
top: calc(100% + 15px);
right: calc(0% - 92px);
background-image: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-contents-03.png);
background-size: 100% auto;
}
}
.hana-mod-hdg-lv3-01 {
font-size: calc(28 * var(--base-size));
margin-bottom: 20px;
line-height: calc(42 / 28);
letter-spacing: 0.1em;
}
.hana-mod-hdg-lv3-02 {
max-width: 296px;
margin-bottom: 28px;
}
.hana-mod-hdg-lv3-03 {
max-width: 273px;
margin-bottom: 28px;
}
.hana-message-block {
max-width: 1000px;
padding: 41px 47px 0 29px;
margin: 0 auto;
background-size: 33% auto;
background-position: 29px 100%;
}
[class*="hana-mod-grid-"] {
display: flex;
}
.hana-mod-grid-01 {
flex-direction: row;
flex-wrap: wrap;
padding-bottom: 43px;
margin-bottom: 106px;
background-size: 33% auto;
background-position: 10px 100%;
max-width: none;
}
.hana-mod-grid-01 > .section {
width: 50%;
}
.hana-mod-grid-01 .hana-grid-block-01 {
padding-left: 38px;
}
.hana-mod-grid-01 .hana-grid-block-02 {
margin-top: 89px;
}
.hana-mod-hdg-lv3-01 {
font-size: calc(40 * var(--base-size));
margin-bottom: 20px;
line-height: calc(60 / 40);
letter-spacing: 0.16em;
}
.hana-mod-hdg-lv4-01 {
width: 94.79px;
text-align: left;
margin-bottom: 15.4px;
}
.uc-mod-link-text-01.hana-mod-link-text-01 {
margin-bottom: 100px;
}
.hana-mod-txt-01 {
font-size: calc(18 * var(--base-size));
font-weight: var(--hana-f-weight-bold);
letter-spacing: 0.1em;
line-height: calc(32.4 / 18);
margin-bottom: 20px;
}
.hana-movie-block {
padding-top: 42px;
}
.hana-movie-contents .uc-mod-media-02 .uc-object {
max-width: 672px;
}
.hana-mod-movie-lead-01 {
font-size: calc(16 * var(--base-size));
line-height: calc(28.8 / 15);
padding: 74px 0 35px;
margin-top: -50px;
}
.hana-mod-movie-lead-01::before {
background-image: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-03.svg);
}
.sec-lineup .hana-contents-block {
padding: 95px 0 120px;
}
.sec-profile .hana-contents-block {
background: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-08-sp.png)
no-repeat;
background-size: cover;
}
.sec-profile .hana-contents-wrapper {
padding-top: 32px;
padding-bottom: 66px;
}
.hana-profile-detail-contents {
display: block;
}
.hana-profile-detail-contents .section:has(> .hana-mod-media-profile-01) {
float: right;
margin: 7px 0 0 29px;
max-width: 381px;
}
.hana-mod-txt-02 {
font-size: 14px;
line-height: calc(30 / 14);
p {
line-height: inherit;
}
}
.hana-mod-white-block {
border-radius: 100px;
padding: 50px 80px;
background-color: var(--hanaColabo-color-white);
}
.hana-mod-hdg-lv5-01,
.hana-mod-hdg-lv5-02 {
font-size: calc(18 * var(--base-size));
line-height: 1.334;
margin-bottom: 28px;
}
.hana-mod-grid-02 {
gap: 28px 45px;
margin-bottom: 60px;
justify-content: center;
max-width: 840px;
}
.hana-mod-grid-02 > .section {
-webkit-box-flex: 0;
-ms-flex: calc((100% / 3) - 30px);
flex: 0 0 calc((100% / 3) - 30px);
max-width: calc((100% / 3) - 30px);
}
.hana-mod-media-02 {
text-align: center;
color: #362268;
line-height: calc(19.6 / 16);
font-size: calc(16 * var(--base-size));
letter-spacing: 0.05em;
}
.hana-mod-media-02 .uc-object {
margin-bottom: 20px;
img {
background-image: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-04-pc.png);
background-size: cover;
display: inline-block;
padding: 65px 25px 20px;
}
}
.hana-mod-media-02 .uc-object img {
width: 100%;
}
.hana-mod-media-03 {
text-align: center;
color: #362268;
line-height: calc(19.6 / 16);
font-size: calc(16 * var(--base-size));
letter-spacing: 0.05em;
}
.hana-mod-media-03 .uc-object {
margin-bottom: 20px;
img {
background-image: url(/content/dam/sites/www_sofy_jp/hana2026/image/img-bg-05-pc.png);
background-size: cover;
display: inline-block;
padding: 65px 25px 20px;
}
}
.hana-product-media-01 {
display: inline-block;
margin-bottom: 4px;
}
.hana-mod-title-01 {
display: inline-block;
}
.hana-product-scent {
line-height: calc(19.6 / 13);
}
.hana-product-detail {
line-height: calc(19.6 / 14);
font-size: calc(14 * var(--base-size));
}
.hana-free-block {
padding: 120px 20px 200px;
}
.hana-contents-bottom-bg {
background-size: 100% 240px;
}
.hana-contents-block
[class*="uc-mod-link-text-"][class*="hana-mod-link-text-"]
a {
padding: 27px 64px 27px 36px;
border-radius: 40px;
font-size: 1.8rem;
}
.hana-contents-block [class*="hana-mod-link-text-"] a::after {
right: 36px;
}
}
@media screen and (min-width: 1265px) {
body:has(.uc-js-header-fix-01.uc-is-fixed) .uc-page-header {
height: 145.61px;
background-color: white;
}
}
@media screen and (min-width: 814px) and (max-width: 1264px) {
body:has(.uc-js-header-fix-01.uc-is-fixed) header.uc-page-header {
display: block;
height: 202.03px;
background-color: white;
}
}
@media screen and (min-width: 769px) and (max-width: 813px) {
body:has(.uc-js-header-fix-01.uc-is-fixed) header.uc-page-header {
display: block;
height: 269.67px;
background-color: white;
}
}
@media screen and (max-width: 768px) {
body:has(.uc-js-header-fix-01.uc-is-fixed) header.uc-page-header {
display: block;
height: 111.11px;
background-color: white;
}
}