.mainVisual {
    width: 1441px;
    margin: 354px auto 0;
}

.mainVisualInner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.mainVisualCopy {
    grid-column: 1 / 2;
}

.mainVisualImg {
    grid-column: 2 / 4;
}

.copyTitle {
    margin-top: 80px;
    font-size: 72px;
    color: #b7d339;
}

/*====================================About====================================*/

.about {
    width: 1441px;
    margin: 191px auto 0;
}

.aboutInner {
    display: flex;
    gap: 80px;
}

.aboutLogo img {
    width: 800px;
}

.aboutTitle h2 {
    font-size: 64px;
}

.aboutText {
    margin-top: 80px;
}

.aboutText p {
    line-height: 56px;
}

/*====================================WorksList====================================*/

.worksList {
    width: 1441px;
    margin: 160px auto 0;
}

.worksListInner {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 160px;
}

.worksListConts {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(8, 1fr);
}

.worksListInner a:nth-child(1) {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
}

.worksListInner a:nth-child(2) {
    grid-column: 2 / 3;
    grid-row: 1 / 2;
}

.worksListInner a:nth-child(3) {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
}

.worksListInner a:nth-child(4) {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
}

.worksBg {
    background-color: #dfe6bc;
    border-radius: 10px;
}

.worksListInner a:nth-child(1) .worksBg,
.worksListInner a:nth-child(3) .worksBg {
    grid-column: 1 / 5;
    grid-row: 1 / 3;
}

.worksListInner a:nth-child(2) .worksBg,
.worksListInner a:nth-child(4) .worksBg {
    grid-column: 5 / 9;
    grid-row: 2 / 4;
}

.worksListInner a:nth-child(1) .worksImgArea,
.worksListInner a:nth-child(3) .worksImgArea {
    grid-column: 2 / 9;
    grid-row: 2 / 6;
}

.worksListInner a:nth-child(2) .worksImgArea,
.worksListInner a:nth-child(4) .worksImgArea {
    grid-column: 1 / 8;
    grid-row: 3 / 7;
}

.worksListInner a:nth-child(1) .worksTitle,
.worksListInner a:nth-child(3) .worksTitle {
    grid-column: 2 / 9;
    grid-row: 7 / 8;
}

.worksListInner a:nth-child(2) .worksTitle,
.worksListInner a:nth-child(4) .worksTitle {
    grid-column: 1 / 8;
    grid-row: 8 / 9;
}

.worksTitle h3 {
    font-size: 40px;
}

.worksImgArea img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/*====================================WorksList Hover Effect====================================*/

.worksListInner a {
    transition: opacity 0.3s ease;
}

.worksListInner a:hover {
    opacity: 0.7;
}

/*====================================Recruit Hover Effect====================================*/

.recruit a {
    transition: opacity 0.3s ease;
}

.recruit a:hover {
    opacity: 0.7;
}

/*====================================Area====================================*/

.area {
    margin: 160px auto 0;
    width: 1441px;
}

.areaTitle h3 {
    font-size: 40px;
}

.areaMap {
    margin-top: 80px;
}

.areaMap img {
    width: 100%;
}

/*====================================Recruit====================================*/

.recruit {
    margin: 160px auto 0;
    width: 1441px;
}

.recruitInner {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(8, 1fr);
}

.recruitTitle {
    grid-column: 1 / 2;
    grid-row: 4 / 5;
    z-index: 3;
}

.recruitTitle h3 {
    font-size: 40px;
    text-align: center;
    color: #fff;
}

.recruitImg {
    grid-column: 1 / 2;
    grid-row: 1 / 9;
}

.recruitImg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}