
/* ==============================
   FOOTER SAMPLE
============================== */

.pm-footer{
    width:100%;
    position:relative;
    overflow:hidden;
    background:
        radial-gradient(circle at 16% 34%, rgba(255,255,255,.075), transparent 28%),
        radial-gradient(circle at 74% 46%, rgba(255,255,255,.045), transparent 30%),
        linear-gradient(115deg,#1c1d1f 0%,#111214 42%,#17181a 100%);
    color:#fff;
}

/* 上の細い光 */
.pm-footer::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:1px;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
}

/* 全体の薄い光 */
.pm-footer::after{
    content:"";
    position:absolute;
    top:-110px;
    left:-10%;
    width:120%;
    height:260px;
    background:radial-gradient(ellipse at center,rgba(255,255,255,.08),rgba(255,255,255,.025) 38%,transparent 70%);
    pointer-events:none;
}

/* 斜めの境界線 */
.pm-footer-slash{
    position:absolute;
    left:35.5%;
    top:0;
    width:1px;
    height:100%;
    background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.32),rgba(255,255,255,.08));
    transform:skewX(-15deg);
    box-shadow:0 0 18px rgba(255,255,255,.12);
    z-index:1;
}

/* メイン */
.pm-footer-main{
    position:relative;
    z-index:2;
    max-width:1600px;
    margin:0 auto;
    padding:58px 70px 52px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:70px;
}

/* 左 */
.pm-footer-left{
    width:34%;
    min-width:410px;
}

.pm-main-logo{
    display:inline-flex;
    align-items:center;
    margin-bottom:30px;
    filter:drop-shadow(0 0 14px rgba(255,255,255,.08));
}

.pm-main-logo svg{
    width:330px;
    height:auto;
}

.pm-company-name{
    font-size:18px;
    font-weight:600;
    letter-spacing:.02em;
    color:#f4f4f4;
    margin-bottom:23px;
}

.pm-info-list{
    display:grid;
    gap:14px;
}

.pm-info-row{
    display:flex;
    align-items:center;
    gap:13px;
    color:#ededed;
    font-size:13px;
    letter-spacing:.04em;
    line-height:1.6;
}

.pm-info-row .icon{
    width:22px;
    height:22px;
    min-width:22px;
    color:#d5ad62;
    filter:drop-shadow(0 0 7px rgba(213,173,98,.25));
}

/* 右 */
.pm-footer-right{
    width:66%;
}

.pm-group-title{
    display:flex;
    align-items:center;
    gap:24px;
    margin-bottom:54px;
}

.pm-group-title .gold-line{
    display:block;
    height:1px;
    flex:1;
    position:relative;
    overflow:visible;
    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(213,173,98,.18) 12%,
            rgba(213,173,98,.55) 48%,
            rgba(213,173,98,.18) 88%,
            transparent 100%
        );
}

/* 金線の上に乗る光 */
.pm-group-title .gold-line::before{
    content:"";
    position:absolute;
    top:-1px;
    left:50%;
    width:210px;
    height:3px;
    transform:translateX(-50%);
    background:
        radial-gradient(
            ellipse at center,
            rgba(255,245,210,1) 0%,
            rgba(255,222,145,.85) 18%,
            rgba(213,173,98,.38) 43%,
            transparent 76%
        );
    filter:blur(.15px);
    pointer-events:none;
}

.pm-group-title .gold-line::after{
    content:"";
    position:absolute;
    top:-6px;
    left:50%;
    width:78px;
    height:13px;
    transform:translateX(-50%);
    background:
        radial-gradient(
            ellipse at center,
            rgba(255,245,210,.78) 0%,
            rgba(255,222,145,.36) 34%,
            transparent 74%
        );
    filter:blur(3px);
    pointer-events:none;
}

/* 下部の金線 */
.pm-gold-bottom-line{
    position:absolute;
    left:0;
    /* bottom:69px; */
    bottom:72px;
    width:100%;
    height:1px;
    z-index:3;
    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(213,173,98,.23) 10%,
            rgba(213,173,98,.7) 50%,
            rgba(213,173,98,.23) 90%,
            transparent 100%
        );
}

.pm-gold-bottom-line::before{
    content:"";
    position:absolute;
    top:-2px;
    left:50%;
    width:260px;
    height:5px;
    transform:translateX(-50%);
    background:
        radial-gradient(
            ellipse at center,
            rgba(255,245,210,1) 0%,
            rgba(255,222,145,.75) 19%,
            rgba(213,173,98,.35) 45%,
            transparent 78%
        );
    filter:blur(.25px);
}

.pm-gold-bottom-line::after{
    content:"";
    position:absolute;
    top:-8px;
    left:50%;
    width:120px;
    height:17px;
    transform:translateX(-50%);
    background:
        radial-gradient(
            ellipse at center,
            rgba(255,245,210,.65) 0%,
            rgba(255,222,145,.28) 40%,
            transparent 76%
        );
    filter:blur(4px);
}

.pm-group-title p{
    color:#d5ad62;
    font-size:18px;
    letter-spacing:.18em;
    white-space:nowrap;
    text-shadow:0 0 12px rgba(213,173,98,.25);
		margin: 0;
}

.pm-brand-list{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
}

.pm-brand{
    width:16%;
    /* min-width:120px; */
    height:74px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    position:relative;
}

.pm-brand img{
		max-width:100%;
		max-height:50px;
}

/* 縦線は金色ではなく、白系の薄い線 */
.pm-brand:not(:first-child)::before{
    content:"";
    position:absolute;
    left:-12px;
    top:12px;
    width:1px;
    height:50px;
    background:linear-gradient(180deg,transparent,rgba(255,255,255,.28),transparent);
}

.pm-brand svg{
    max-width:155px;
    max-height:46px;
    width:100%;
    height:auto;
    overflow:visible;
}

.pm-brand svg *{
    filter:drop-shadow(0 0 6px rgba(255,255,255,.08));
}

/* 下部コピー */
.pm-copy{
    position:relative;
    z-index:4;
    background:linear-gradient(180deg,#090909,#050505);
    text-align:center;
    padding:22px 15px;
    color:#e5e5e5;
    font-size:14px;
    letter-spacing:.05em;
}


/* ==============================
   RESPONSIVE  FOOTER
============================== */

@media(max-width:1200px){
    .pm-footer-main{
        flex-direction:column;
        align-items:flex-start;
        padding:50px 35px;
    }

    .pm-footer-slash{
        display:none;
    }

    .pm-footer-left,
    .pm-footer-right{
        width:100%;
        min-width:0;
    }

    .pm-brand-list{
        flex-wrap:wrap;
        justify-content:center;
    }

    .pm-brand{
        width:30%;
    }
    .pm-brand:not(:first-child)::before {
    	display: none;
    }

    .pm-gold-bottom-line{
        bottom:69px;
    }
}

@media(max-width:640px){
    .pm-main-logo svg{
        width:260px;
    }

    .pm-company-name{
        font-size:16px;
    }

    .pm-info-row{
        font-size:12px;
    }

    .pm-brand{
        width:45%;
    }

    .pm-group-title p{
        font-size:14px;
    }

    .pm-group-title{
        gap:14px;
    }
}
