- カートに商品がありません。
teste
<style>
.lh-story .lh-row {
align-items: center;
}
.lh-content {
margin-left: 15%;
}
.lh-des {
display: flex;
}
.lh-des .lh-img {
width: 50%;
}
.lh-des .lh-img:first-child {
margin-right: 15px;
}
.lh-des .lh-img:last-child {
margin-left: 15px;
}
.lh-title {
font-size: calc(var(--lh-font-size) * 2.5);
line-height: 1.5;
font-weight: 500;
color: var(--lh-color);
margin-bottom: 40px;
letter-spacing: 0.02em;
}
.lh-desc {
font-size: calc(var(--lh-font-size) * 1);
line-height: 1.5;
font-weight: 300;
color: var(--lh-color);
letter-spacing: 0.02em;
}
.lh-line {
opacity: 0.5;
border-bottom: 1px solid rgb(38, 76, 80);
width: 50%;
margin: 100px auto 0px;
}
@media screen and (max-width: 991px) {
.lh-col-md-7,
.lh-col-md-5 {
flex: 0 0 50%;
max-width: 50%;
}
.lh-des .lh-img:first-child {
margin-right: 5px;
}
.lh-des .lh-img:last-child {
margin-left: 5px;
}
.lh-content {
margin-left: 0%;
}
.lh-line {
margin-top: 80px;
}
}
@media screen and (max-width: 767px) {
.lh-col-md-7,
.lh-col-md-5 {
flex: 0 0 100%;
max-width: 100%;
}
.lh-col-md-5 {
order: 1;
}
.lh-col-md-7 {
order: 2;
}
.lh-content {
margin-bottom: 60px;
}
.lh-des .lh-img:last-child {
margin-left: 0px;
}
.lh-line,
.lh-des .lh-img img {
width: 100%;
}
}
</style>
<div class="lh-story">
<div class="lh-container">
<div class="lh-row ">
<div class="lh-col-md-7">
<div class="lh-des">
<div class="lh-img">@print(section.settings.img_why)</div>
<div class="lh-img">@print(section.settings.img_why2)</div>
</div>
</div>
<div class="lh-col-md-5">
<div class="lh-content">
<h3 class="lh-title">@lang(section.settings.txt_title)</h3>
<div class="lh-desc">@lang(section.settings.txt_desc)</div>
</div>
</div>
</div>
<div class="lh-row ">
<div class="lh-col-md-12">
<div class="lh-line"></div>
</div>
</div>
</div>
</div>