@charset "UTF-8";
/* ====================================================
　個人情報保護方針ページ固有CSS（ファーストビュー以降）
　privacy_body.css

　【スマートフォン版の実装方針】
　Figmaのスマホアートボード幅390pxを基準比率とし、320〜430px程度の画面幅で
　常に同じデザイン比率を維持するため、font-size・余白・サイズ指定は
　vw のみで画面幅に比例して拡大縮小させる（390pxで頭打ちにしない・下限も設けない）。
　margin/paddingはem・%・vw・vhのみを使用し、pxは使用しない。
==================================================== */


/* ######################################################################################

　PRIVACY POLICY（個人情報保護方針）

###################################################################################### */

/* ----- privacyPolicy ----- */
.privacyPolicy{ background: var(--color-white); }
@media print, screen and (min-width: 768px){
    /* Figma実測：パンくず下端→タイトル=約95px／お問い合わせ表下端→フッター=約197px */
    .privacyPolicy{ padding-top: 6em; padding-bottom: 12.5em; }
}
@media screen and (max-width: 767px){
    .privacyPolicy{ padding-top: 12.8205vw; padding-bottom: 6.1538vw; }
}

/* privacyPolicy__inner（本文用の狭コンテナ：内側1000px＋左右パディング）
---------------------------------------------------- */
.privacyPolicy__inner{
    max-width: 1000px;
    margin-right: auto;
    margin-left: auto;
    padding-right: var(--container-pad-sp);
    padding-left: var(--container-pad-sp);
}
@media print, screen and (min-width: 768px){
    .privacyPolicy__inner{ padding-right: var(--container-pad-pc); padding-left: var(--container-pad-pc); }
}

/* privacyPolicy__title（共通部分は widget/sectionHeading.css の .sectionHeading）
　margin-bottomは.sectionHeadingが持たないプロパティのため個別に指定する
---------------------------------------------------- */
.privacyPolicy__title{
    --sectionHeading-textAlign: center;
    --sectionHeading-color: #242424;
    --sectionHeading-lineHeight-pc: 1.25;
    --sectionHeading-lineHeight-sp: 1.25;
}
@media print, screen and (min-width: 768px){
    /* 文字サイズと同じ1500px基準：max=30px */
    .privacyPolicy__title{ margin-bottom: 0.5625em; }
}
@media screen and (max-width: 767px){
    /* Figma SPアートボード幅390px基準：22px ÷ 390 × 100 */
    .privacyPolicy__title{ margin-bottom: 4.8718vw; }
}

/* privacyPolicy__lead（共通部分は widget/sectionHeading.css の .sectionLead）
　このページはheading→leadの間隔をlead側のmargin-bottomで確保する構造のため、
　.sectionLeadの既定margin-topは0にして打ち消す
---------------------------------------------------- */
.privacyPolicy__lead{
    --sectionLead-color: #242424;
    --sectionLead-textAlign-pc: center;
    --sectionLead-textAlign-sp: center;
    --sectionLead-lineHeight-pc: 2.9333;
    --sectionLead-marginTop-pc: 0;
    --sectionLead-marginTop-sp: 0;
}
@media print, screen and (min-width: 768px){
    .privacyPolicy__lead{ margin-bottom: 2.4375em; }
}
@media screen and (max-width: 767px){
    .privacyPolicy__lead{ margin-bottom: 9.7436vw; }
}

/* privacyPolicy__sections（各項目の縦積みラッパー）
---------------------------------------------------- */
.privacyPolicy__sections{ display: flex; flex-direction: column; }
@media print, screen and (min-width: 768px){
    .privacyPolicy__sections{ gap: 2.25em; }
}
@media screen and (max-width: 767px){
    .privacyPolicy__sections{ gap: 6.1538vw; }
}

/* privacyPolicy__section（見出し＋本文の1項目）
---------------------------------------------------- */
.privacyPolicy__section{ display: flex; flex-direction: column; }
@media print, screen and (min-width: 768px){
    .privacyPolicy__section{ gap: 1em; }
}
@media screen and (max-width: 767px){
    .privacyPolicy__section{ gap: 6.1538vw; }
}

/* privacyPolicy__heading（見出しバー）
---------------------------------------------------- */
.privacyPolicy__heading{
    font-weight: 700;
    line-height: 1.4;
    color: #242424;
}
@media print, screen and (min-width: 768px){
    /* Figma実測：背景#f3f3f3、上下13px／左右20px（自身のfont-size 18px基準） */
    .privacyPolicy__heading{ padding: 0.7222em 1.1111em; background: #f3f3f3; font-size: 1.8rem; }
}
@media screen and (max-width: 767px){
    /* Figma実測：背景#f5f5f5、上下左右16px（自身のfont-size 16px基準＝1em） */
    .privacyPolicy__heading{ padding: 1em; background: #f5f5f5; font-size: 4.1026vw; }
}

/* privacyPolicy__text（本文段落）
---------------------------------------------------- */
.privacyPolicy__text{ color: #242424; }
@media print, screen and (min-width: 768px){
    /* 見出しバー（.privacyPolicy__heading）は内側paddingで文字を20px相当
       右にずらしているが、本文側は左paddingが無く0px相当のままだったため、
       見出しの文字開始位置とずれていた。本文自身のfont-size（15px）基準で
       同じ20px相当（20÷15）を付与し、個別の文章ではなく本文ブロック全体の
       基準位置として揃える */
    .privacyPolicy__text{ padding-left: 1.3333em; font-size: 1.5rem; line-height: 2; }
}
@media screen and (max-width: 767px){
    .privacyPolicy__text{ font-size: 3.8462vw; line-height: 1.7333; }
}

/* privacyPolicy__numList（番号付きリスト：1．2．3．…）
---------------------------------------------------- */
.privacyPolicy__numList{
    counter-reset: privacyNum;
}
@media print, screen and (min-width: 768px){
    /* リスト自身（ol）はfont-size未指定＝bodyの16px基準を継承するため、
       見出しと同じ20px相当をこの基準で換算する（20÷16）。liのpadding-left
       はマーカー「1．」との間隔用のため触らず、リスト全体をこちらで
       右へずらして基準位置を揃える */
    .privacyPolicy__numList{ padding-left: 1.25em; }
}
.privacyPolicy__numList li{
    position: relative;
    color: #242424;
}
.privacyPolicy__numList li::before{
    counter-increment: privacyNum;
    content: counter(privacyNum) "．";
    position: absolute;
    left: 0;
}
@media print, screen and (min-width: 768px){
    .privacyPolicy__numList li{ padding-left: 1.5em; font-size: 1.5rem; line-height: 2; }
}
@media screen and (max-width: 767px){
    .privacyPolicy__numList li{ padding-left: 1.5em; font-size: 3.8462vw; line-height: 1.7333; }
}

/* privacyPolicy__dotList（中黒リスト：・）
---------------------------------------------------- */
.privacyPolicy__dotList li{
    position: relative;
    color: #242424;
}
@media print, screen and (min-width: 768px){
    /* numListと同じ理由（bodyの16px基準で20px相当） */
    .privacyPolicy__dotList{ padding-left: 1.25em; }
}
.privacyPolicy__dotList li::before{
    content: "・";
    position: absolute;
    left: 0;
}
@media print, screen and (min-width: 768px){
    .privacyPolicy__dotList li{ padding-left: 1.1em; font-size: 1.5rem; line-height: 2; }
}
@media screen and (max-width: 767px){
    .privacyPolicy__dotList li{ padding-left: 1.1em; font-size: 3.8462vw; line-height: 1.7333; }
}


/* ######################################################################################

　privacyPolicy__contactTable（お問い合わせ先テーブル）

###################################################################################### */

.privacyPolicy__contactTable{ width: 100%; }
@media print, screen and (min-width: 768px){
    .privacyPolicy__contactTable{ border: 1px solid #ccd4e0; }
}
@media screen and (max-width: 767px){
    .privacyPolicy__contactTable{ border-top: 1px solid #a5b2c7; }
}

/* privacyPolicy__contactRow
---------------------------------------------------- */
.privacyPolicy__contactRow:not(:last-child){ border-bottom: 1px solid #ccd4e0; }
@media print, screen and (min-width: 768px){
    .privacyPolicy__contactRow{ display: flex; align-items: stretch; height: 50px; }
}
@media screen and (max-width: 767px){
    .privacyPolicy__contactRow{
        display: flex;
        flex-direction: column;
        gap: 1.5385vw;
        padding-top: 4.359vw;
        padding-bottom: 4.359vw;
    }
}

/* privacyPolicy__contactLabel / contactValue
---------------------------------------------------- */
.privacyPolicy__contactLabel{ font-weight: 700; }
@media print, screen and (min-width: 768px){
    .privacyPolicy__contactLabel{
        display: flex;
        align-items: center;
        flex-shrink: 0;
        width: 131px;
        /* 見出しの文字開始位置に揃える（20px相当。自身のfont-size 15px基準で20÷15） */
        padding-left: 1.3333em;
        /* 他の罫線（.privacyPolicy__contactRowの#ccd4e0、外枠の#ddd）と別色だったため
           1本だけ濃く見える原因になっていた。他の罫線と同じ色に統一する */
        border-right: 1px solid #ccd4e0;
        font-size: 1.5rem;
        color: #222;
    }
    .privacyPolicy__contactValue{
        display: flex;
        align-items: center;
        flex: 1;
        min-width: 0;
        padding-left: 1.0667em; /* 16px相当（同上） */
        font-size: 1.5rem;
        color: #242424;
    }
}
@media screen and (max-width: 767px){
    .privacyPolicy__contactLabel{ font-size: 3.5897vw; color: var(--color-primary); }
    .privacyPolicy__contactValue{ font-size: 4.1026vw; color: #242424; }
}

.privacyPolicy__contactValue a{
    text-decoration: underline;
    text-underline-offset: 2px;
}
@media print, screen and (min-width: 768px){
    .privacyPolicy__contactValue a{ font-weight: 700; color: var(--color-primary); }
}