/* ==============================
会社概要css
=============================== */
.bg_blue {
    background: #0ab2f5;
}
#recruit h1,
#company h1,
#vn h1 {
    margin: 15vw auto 8vw;
}
#recruit section,
#company section,
#vn section,
#recruit article,
#company article,
#vn article,
#recruit aside,
#company aside,
#vn aside {
    padding: 5.2vw 0;
}
#recruit section h1,
#company section h1,
#vn section h1,
#recruit article h1,
#company article h1,
#vn article h1,
#recruit aside h1,
#company aside h1,
#vn aside h1 {
    margin: 0 auto 5vw;
    font-size: 2vw;
}
#recruit section h2,
#company section h2,
#vn section h2,
#recruit article h2,
#company article h2,
#vn article h2,
#recruit aside h2,
#company aside h2,
#vn aside h2 {
    font-size: 1.5vw;
}
#recruit section p,
#company section p,
#vn section p,
#recruit article p,
#company article p,
#vn article p,
#recruit aside p,
#company aside p,
#vn aside p {
    width: 88%;
    margin: 0 auto;
    line-height: 2vw;
    font-size: 1.2vw;
    font-weight: 500;
}

.whatis div.user {
    margin: 5vw auto;
    padding: 3vw 0;
}
.whatis div.user h2 {
    text-align: center;
    margin: 0 auto 3vw;
}
.whatis_img {
    display: flex;
    justify-content: space-evenly;
    margin: 8vw auto 0;
}
.whatis img {
    width: 33%;
}
.page_feature li {
    background: #055d7f; 
    display: grid;
    width: 80vw;
    margin: 2vw auto;
    padding: 2vw 4vw;
    grid-template-columns: 1fr 5fr;
    border-radius: 2vw;
    align-items: center;
}
.page_feature img {
    width: 10vw;
}
#vn .page_feature p {
    margin: 1vw auto 0;
    width: 100%;
    color: #fff;
}
#vn .page_feature h2 {
    color: #fff;
    display: inline;
    background:linear-gradient(transparent 75%, #0ab2f5 60%);
}

.service dl {
    background: #fff;
    width: 72vw;
    margin: 3vw auto;
    padding: 8vw 8vw 5vw;
    border-radius: 2vw;
    line-height: 2vw;
}
.service dt {
    font-size: 1.5vw;
}
.service dt::before {
    content: "▼";
    color: #f5860a;
    font-size: 2vw;
    margin-right: 1vw;
    vertical-align: middle;
    transform: rotate(30deg);
    display: inline-block;
}
.service dd {
    font-size: 1.2vw;
    padding: 1vw;
    border-right: 1vw solid #f5860a;
    border-bottom: 0.5vw solid #f5860a;
    margin-bottom: 5vw;
    font-size: 1.2vw;
}

#company .philosophy h2,
#recruit .rec_overview h2 {
    text-align: center;
    background: #055d7f;
    color: #fff;
    line-height: 6.7vw;
    font-size: 2vw;
}
#vn .page_info h2,
#company .page_info h2 {
    font-size: 1.8vw;
    text-align: center;
    margin: 5.2vw auto 2vw;
}
#vn .page_info p,
#company .page_info p {
    text-align: center;
}

#vn p.btn,
#company p.btn {
    text-align: center;
} 
#vn p.btn a,
#company p.btn a,
#recruit p.btn a {
    width: 26vw;
    line-height: 2vw;
    font-size: 1.5vw;
    margin: 2vw auto;
}
.page_info div,
.rec_overview div {
    display: flex;
    margin: auto 15vw;
}

.philosophy div {
    margin: 4.5vw auto 2.5vw;
}

.goal ul {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    margin: 0 4.3vw;
    gap: 2.7vw;
}
.goal li {
    display: grid;
    background: #fff;
    border-radius: 2vw;
    justify-items: center;
    padding: 3vw;
    gap: 2vw;
}
.goal img {
    width: 20vw;
    order: 2;
}
.goal h2 {
    order: 1;
}
.goal p {
    order: 3;
}

.greeting_grid {
    display: grid;
    grid-template-columns: 4fr 1fr;
    margin: 0 4vw;
    align-items: center;
}
.greeting_name {
    text-align: right;
    margin: 1vw 0;
}
.overview dl {
    display: grid;
    grid-template-columns: 1fr 4fr;
    justify-items: start;
    width: 60vw;
    margin: 0 auto;
    background: #fff;
    border-radius: 1vw;
    border: 1px solid #999;
}
.overview dt {
    text-align: right;
    width: 83%;
    border-bottom: 1px solid #999;
    line-height: 3vw;
    font-size: 1.2vw;
    font-weight: 500;
    padding-right: 2vw;
}
.overview dd {
    width: 95.8%;
    padding-left: 2vw;
    border-left: 1px solid #999;
    line-height: 3vw;
    font-size: 1.2vw;
    font-weight: 500;
    border-bottom: 1px solid #999;
}
.overview dd:last-child,
.overview dt:last-of-type {
    border-bottom: 0;
    padding-bottom: 0.3vw;
}
.overview dt:first-of-type,
.overview dd:first-of-type {
    padding-top: 0.5vw;
}
.overview dd span,
.overview dd li {
    font-size: 1.2vw;
    font-weight: 500;
}
.overview dd li {
    line-height: 1.5vw;
}
.overview dd ul {
    padding: 1vw 0 1vw 0;
}


/* =============================
スマートフォン用css max-width768
=============================== */
@media screen and (max-width: 768px){

#recruit h1,
#company h1,
#vn h1 {
    margin: 15vw auto 8vw;
    font-size: 6vw;
}
#recruit section,
#company section,
#vn section,
#recruit article,
#company article,
#vn article,
#recruit aside,
#company aside,
#vn aside {
    padding: 5vw 0;
    margin: 5vw auto;
}
#recruit section:last-child,
#company section:last-child,
#vn section:last-child {
    margin-bottom: 0;
}
#recruit section h1,
#company section h1,
#vn section h1,
#recruit article h1,
#company article h1,
#vn article h1,
#recruit aside h1,
#company aside h1,
#vn aside h1 {
    margin: 0 auto 8vw;
    font-size: 5.5vw;
}
#recruit section h2,
#company section h2,
#vn section h2,
#recruit article h2,
#company article h2,
#vn article h2,
#recruit aside h2,
#company aside h2,
#vn aside h2 {
    font-size: 4.5vw;
}
#recruit section p,
#company section p,
#vn section p,
#recruit article p,
#company article p,
#vn article p,
#recruit aside p,
#company aside p,
#vn aside p {
    width: 84%;
    margin: 0 auto;
    line-height: 6.5vw;
    font-size: 4vw;
    font-weight: 400;
    text-align: justify;
}
#vn .whatis div p,
#company .philosophy p {
    margin-bottom: 3vw;
}
.whatis div.user {
    margin: 10vw auto;
    padding: 5vw 0;
}
.whatis_img {
    display: block;
    margin: 0 auto;
    text-align: center;
}
.whatis img {
    width: 80vw;
    margin-bottom: 5vw;
}

.page_feature li {
    display: block;
    padding: 5vw;
    text-align: justify;
    margin: 5vw auto;
}
.page_feature img {
    width: 25vw;
    display: block;
    margin: 3vw auto;
}
#vn .page_feature p {
    margin: 3vw auto 1vw;
    width: 100%;
    color: #fff;
}

.service dt {
    font-size: 4.5vw;
    margin-bottom: 2vw;
    line-height: 4.5vw;
}
.service dd {
    font-size: 4vw;
    line-height: 5.5vw;
    border-right: 2vw solid #f5860a;
    text-align: justify;
}

#vn .page_info h2,
#company .page_info h2 {
    font-size: 5vw;
}
#vn p.btn a, 
#company p.btn a, 
#recruit p.btn a {
    width: 50vw;
    font-size: 4vw;
    line-height: 10vw;
    display: block;
}
#vn p.btn_navy, 
#company p.btn_navy, 
#recruit p.btn_navy {
    margin: 5vw auto 10vw;
}

.page_info div,
.rec_overview div {
    flex-direction: column;
    margin: 5vw auto;
}

#company .philosophy h2,
#recruit .rec_overview h2 {
    line-height: 10vw;
    font-size: 4.5vw;
}
.philosophy div {
    margin: 5vw auto 10vw;
}
.goal ul {
    grid-template-columns: 1fr;
}
.goal img {
    width: 50vw;
}
.greeting_grid {
    grid-template-columns: 1fr;
}
.greeting_grid div {
    order: 2;
}
.greeting_grid img {
    order: 1;
    width: 50vw;
    margin: 5vw auto;
}
#company .greeting_grid p {
    margin-bottom: 3vw;
}
.greeting_name {
    margin: 5vw auto;
}
#company .greeting_name p {
    text-align: right;
    margin: 0 auto;
}
.overview dl {
    grid-template-columns: 1fr;
    overflow: hidden;
    width: 80vw;
    border-radius: 2vw;
}
.overview dt {
    text-align: center;
    width: 100%;
    font-size: 4vw;
    line-height: 7vw;
    background: #eee;
    border: none;
    padding: 0;
}
.overview dd {
    width: 100%;
    line-height: 10vw;
    font-size: 3vw;
    font-weight: 400;
    border: none;
    text-align: center;
    padding: 0;
}
.overview dd span {
    font-size: 4vw;
    font-weight: 400;
}
.overview dd ul {
    padding: 3vw 0;
}
.overview dd li {
    font-size: 3vw;
    font-weight: 400;
    line-height: 5vw;
}
main.policy h1 {
    font-size: 5.5vw;
}
main.policy h2 {
    font-size: 4.5vw;
}
main.policy p, main.policy li {
    font-size: 4vw;
    line-height: 6vw;
}

}