@charset "UTF-8";
/* ==============
img-service
================= */
.img-service {
    background-image: url(../images/img-service-sp.jpg);
    position: relative;
    background-position: top;
    background-size: cover;
    background-repeat: no-repeat;
    padding-top: 60%;
}

/* ===============
img-service pc 769px
=================== */
@media screen and (min-width:769px) {
.img-service {
    background-image: url(../images/img-service-pc.jpg);
    background-position: center;
    padding-top: 22%;
}
}

/* ================
title sp
================== */
.title {
    margin-top: 40px;
    padding: 0 5.3%;
}

/* ================
title pc 769px
================== */
@media screen and (min-width:769px) {
.title {
    display: flex;
    align-items: center;
}

.title__page {
    font-size: 6.4rem;
}

.title-sub__page {
    font-size: 2.0rem;
    margin-left: 30px;
}
}

/* ================
content-title common sp
================== */
.title__content {
    padding-top: 65px;
    color: var(--primary-navy);
    text-align: center;
    font-size: 1.8rem;
    letter-spacing: 0.1rem;
    font-weight: 700;
    position: relative;
}
.title__content::after {
    position: absolute;
    content: '';
    display: inline;
    width: 256px;
    height: 4px;
    background: var(--gradation-blue-green);
    position: absolute;
    bottom: -12%;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 5px;
}

/* ================
content-title common 769px pc
================== */
@media screen and (min-width:769px) {
.title__content {
    padding-top: 100px;
    font-size: 2.6rem;
}
.title__content::after {
    width: 420px;
    height: 8px;
    bottom: -10%;
}
}

/* ================
trading sp
================== */
.service-trading__txt {
    padding: 40px 8% 55px;
    color: var(--primary-navy);
    line-height: 1.6;
}

.product__title {
    padding: 0 5.6% 20px;
    font-weight: 700;
}

.product__list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.product__item {
    display: block;
    position: relative;
    width: 42.5%;
    margin: 2%;
    max-width: 270px;
}

.product__item::before {
    content: "";
    display: block;
    padding-top: 100%;
}

.product__item img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    object-fit: cover;
}

/* ================
trading 769px pc
================== */
@media screen and (min-width:769px) {
.product {
    max-width: 1440px;
    margin: 0 auto;
}

.service-trading__txt {
    padding: 54px 20.8% 100px;
    font-weight: 700;
}

.product__title {
    padding: 0 14.2% 40px;
    font-size: 3.0rem;
}

.product__list {
    width: 100%;
    max-width: 1030px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.product__item {
    display: block;
    position: relative;
    width: 42.5%;
    margin: 2%;
    max-width: 270px;
}

.product__item::before {
    content: "";
    display: block;
    padding-top: 100%;
}

.product__item img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    object-fit: cover;
}
}

/* ================
overseas sp
================== */
.service-overseas {
    margin-top: 65px;
    background-image: url(../images/service-back-img.jpg);
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
}

.title__content--white {
    color: var(--primary-white);
}

.title__content--white::after {
    position: absolute;
    content: '';
    display: inline;
    width: 256px;
    height: 3px;
    background: var(--primary-white);
    position: absolute;
    bottom: -12%;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 5px;
}

.service-overseas__txt {
    padding: 40px 8% 55px;
    color: var(--primary-white);
    line-height: 1.6;
}

.service-overseas__img {
    padding: 0 5.3% 55px;
    text-align: center;
}

/* ================
overseas 769px pc
================== */
@media screen and (min-width:769px) {
.service-overseas {
    margin-top: 100px;
}

.title__content--white::after {
    width: 420px;
    height: 7px;
    bottom: -10%;
}

.service-overseas__txt {
    padding: 54px 20.8% 100px;
    font-weight: 700;
}

.service-overseas__img {
    padding: 0 13.8% 55px;
}
}

/* ===============
consulting sp
================== */
.service-consulting__img {
    width: 100%;
    padding:  40px 16% 0;
    text-align: center;
}

.service-consulting__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 1 / 1;
    max-width: 350px;
    margin: 0 auto;
}

.service-consulting__txt {
    padding: 30px 8% ;
    line-height: 1.6;
}

.pcBr {
    display: none;
}

/* ===============
consulting pc 769px
================== */
@media screen and (min-width:769px) {
.service-consulting__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 4.2vw;
    padding: 100px 13.8% ;
}

.service-consulting__img {
    max-width: 518px;
    padding:  0;
}

.service-consulting__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 1 / 1;
}

.service-consulting__txt {
    min-width: 350px;
    padding: 0;
    font-weight: 700;
}

.pcBr {
    display: block;
}
}