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

239 lines
6.1 KiB
PHP

<style>
/* ===== WHAT WE DO (BT-Trader look) ===== */
.bt-what {
background: #fff;
padding: 90px 0;
}
.bt-what .bt-container {
max-width: 1320px;
/* 화면 여백 넓게 */
}
/* 2x2 grid with cross lines */
.bt-what-grid {
display: grid;
grid-template-columns: 1fr 1fr;
position: relative;
}
.bt-what-grid::before {
/* vertical line */
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 50%;
width: 1px;
background: #e9e9e9;
transform: translateX(-0.5px);
pointer-events: none;
}
.bt-what-grid::after {
/* horizontal line */
content: "";
position: absolute;
left: 0;
right: 0;
top: 50%;
height: 1px;
background: #e9e9e9;
transform: translateY(-0.5px);
pointer-events: none;
}
.bt-cell {
min-height: 380px;
/* 캡처처럼 칸이 큼 */
padding: 70px 80px;
display: flex;
align-items: flex-start;
justify-content: flex-start;
}
/* Top-left title block */
.bt-what-title {
font-size: 56px;
font-weight: 500;
letter-spacing: -0.02em;
margin-bottom: 22px;
}
.bt-what-intro {
max-width: 420px;
font-size: 14px;
line-height: 1.8;
color: #333;
}
/* Service blocks */
.bt-service {
max-width: 520px;
}
.bt-service h3 {
font-size: 20px;
font-weight: 500;
line-height: 1.25;
margin: 18px 0 18px;
letter-spacing: -0.01em;
}
.bt-service p {
font-size: 14px;
line-height: 2.0;
color: #333;
margin: 0;
max-width: 430px;
}
/* Icon: overlapped squares */
.bt-icon {
width: 58px;
height: 58px;
position: relative;
margin-bottom: 18px;
}
.bt-icon::before {
content: "";
position: absolute;
width: 52px;
height: 52px;
border: 1px solid #111;
background: transparent;
top: 0;
left: 0;
}
.bt-icon::after {
content: "";
position: absolute;
width: 28px;
height: 28px;
background: #6D4CFF;
border: 1px solid #111;
right: 6px;
bottom: 6px;
}
/* Slight variations like screenshot */
.bt-icon.v2::after {
right: 10px;
bottom: 10px;
}
.bt-icon.v3::before {
left: 8px;
top: 2px;
}
.bt-icon.v3::after {
left: 0px;
bottom: 0px;
right: auto;
}
/* responsive */
@media (max-width: 991.98px) {
.bt-what {
padding: 50px 0;
}
.bt-what-grid {
grid-template-columns: 1fr;
}
.bt-what-grid::before,
.bt-what-grid::after {
display: none;
/* 모바일은 라인 제거(원본도 보통 다름) */
}
.bt-cell {
padding: 40px 22px;
min-height: auto;
border-top: 1px solid #e9e9e9;
}
.bt-cell:first-child {
border-top: 0;
}
.bt-what-title {
font-size: 44px;
}
}
</style>
<section class="bt-what" id="what-we-do">
<div class="container bt-container">
<div class="bt-what-grid">
<!-- Top Left -->
<div class="bt-cell">
<div>
<div class="bt-what-title">What We Do</div>
<div class="bt-what-intro">
At BT-Trader, we specialize in titanium and high-value metal trading across the U.S., Korea, and
Southeast Asia,
supplying premium titanium ingots, solids, scrap, and specialty nickel alloys through a trusted
global network.
</div>
</div>
</div>
<!-- Top Right -->
<div class="bt-cell">
<div class="bt-service">
<div class="bt-icon v2"></div>
<h3>
Titanium &amp; Specialty Metals<br>
Trading Experts
</h3>
<p>
We supply high-grade titanium ingots, solids, scrap, and specialty alloys through a trusted
global network.
Our team ensures precise sourcing, consistent quality, and reliable delivery for manufacturers
and industrial partners.
</p>
</div>
</div>
<!-- Bottom Left -->
<div class="bt-cell">
<div class="bt-service">
<div class="bt-icon"></div>
<h3>
Global Procurement and Export of<br>
Non-Ferrous Metal Scrap
</h3>
<p>
We purchase and export non-ferrous metal scrap—including titanium, nickel alloys, and high-value
industrial metals—to international markets.
Every shipment is inspected, graded, and prepared to meet global standards.
</p>
</div>
</div>
<!-- Bottom Right -->
<div class="bt-cell">
<div class="bt-service">
<div class="bt-icon v3"></div>
<h3>
Operating Global Metal<br>
Supply Network
</h3>
<p>
Our multi-region supply chain enables stable sourcing and fast logistics across the U.S., Korea,
and Southeast Asia.
We coordinate shipping, warehousing, and export documentation to ensure efficient and dependable
global distribution.
</p>
</div>
</div>
</div>
</div>
</section>