bt-trader/app/Views/layouts/front/bottom.php
2026-02-24 18:58:30 +09:00

177 lines
4.4 KiB
PHP

<style>
/* ===== BT Footer (like screenshot) ===== */
.bt-footer {
background: #000;
color: #fff;
}
/* 상단 큰 검정 영역 */
.bt-footer-top {
padding: 70px 0;
min-height: 420px;
/* 캡처처럼 넉넉하게 */
border-bottom: 1px solid rgba(255, 255, 255, .65);
/* 하단 얇은 라인 */
}
/* 가운데 세로 구분선 */
.bt-footer-col-divider {
position: relative;
}
.bt-footer-col-divider::before {
content: "";
position: absolute;
top: -70px;
/* 섹션 padding만큼 위로 */
bottom: -70px;
/* 섹션 padding만큼 아래로 */
left: 0;
width: 1px;
background: rgba(255, 255, 255, .65);
}
/* 오른쪽 끝 세로 라인(캡처의 가장 오른쪽 라인 느낌) */
.bt-footer-right-edge {
position: relative;
}
.bt-footer-right-edge::after {
content: "";
position: absolute;
top: -70px;
bottom: -70px;
right: 0;
width: 1px;
background: rgba(255, 255, 255, .65);
opacity: .75;
}
/* 로고 영역 */
.bt-footer-logo {
display: flex;
align-items: flex-start;
gap: 10px;
}
.bt-footer-logo .bt {
font-size: 88px;
font-weight: 300;
line-height: .9;
letter-spacing: -0.02em;
}
.bt-footer-logo .tag {
margin-top: 14px;
font-size: 14px;
line-height: 1.3;
opacity: .95;
}
/* 오른쪽 텍스트 스타일 */
.bt-footer-title {
font-size: 22px;
font-weight: 400;
margin: 0 0 14px 0;
}
.bt-footer-text {
font-size: 13px;
line-height: 2.0;
opacity: .9;
margin: 0;
}
.bt-footer-link {
color: #fff;
text-decoration: none;
font-size: 13px;
opacity: .9;
}
.bt-footer-link:hover {
text-decoration: underline;
opacity: 1;
}
/* 하단 흰 바 + 중앙 카피 */
.bt-footer-bottom {
background: #fff;
color: #000;
text-align: center;
padding: 18px 0;
font-size: 12px;
}
/* 캡처처럼 오른쪽 섹션에서 타이틀/내용이 중앙 쪽에 오도록 */
.bt-footer-right-inner {
padding-left: 120px;
padding-right: 120px;
}
@media (max-width: 991.98px) {
.bt-footer-top {
min-height: auto;
padding: 40px 0;
}
.bt-footer-col-divider::before,
.bt-footer-right-edge::after {
display: none;
}
.bt-footer-right-inner {
padding: 30px 0 0 0;
}
.bt-footer-logo .bt {
font-size: 64px;
}
}
</style>
<footer class="bt-footer">
<!-- TOP AREA -->
<div class="bt-footer-top">
<div class="container-fluid px-0">
<div class="row g-0">
<!-- LEFT -->
<div class="col-md-6 px-5">
<div class="bt-footer-logo">
<div class="bt">BT</div>
<div class="tag">
Better<br>
Tomorrow,<br>
Inc.
</div>
</div>
</div>
<!-- RIGHT (has center divider + right edge line) -->
<div class="col-md-6 bt-footer-col-divider bt-footer-right-edge">
<div class="bt-footer-right-inner">
<div class="mb-5">
<div class="bt-footer-title">Info</div>
<p class="bt-footer-text">714-469-7987</p>
<a class="bt-footer-link" href="mailto:info@bt-trader.com">info@bt-trader.com</a>
</div>
<div>
<div class="bt-footer-title">Address</div>
<p class="bt-footer-text" style="text-transform: uppercase;">
110-E WILSHIRE AVE SUITE 400<br>
FULLERTON, CA 92832
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- BOTTOM WHITE BAR -->
<div class="bt-footer-bottom">
© 2025 by Better Tomorrow, Inc
</div>
</footer>