@charset "utf-8";

.titlewrap {
	h1 {
        .txtclip {
            background: #0A259A;
            background: linear-gradient(to right bottom,#0A259A 0%,#42BFEC 100%);
        }
        img {
            width:8em;
        }
	}
}

section {
    .wrap {
        .contents {
            h2 {
                &::first-letter {
                    color:#1A80FF;
                }
                & + .detail {
                    margin-bottom:3em;
                    p {
                        &:not(:last-child) {
                            margin-bottom:1em;
                        }
                    }
                }
            }
            h3 {
                font-size :2.8rem;
                padding-left:1em;
            }
        }
    }
}

#recruit {
    .wrap {
        .contents {
            .tab_content {
                .item {
                    border:1px solid #1A80FF;
                    border-radius:10px;
                    box-shadow:0 3px 6px rgba(0,0,0,.15);
                    padding:40px;
                    display:grid;
                    grid-template-columns:50% 1fr;
                    grid-column-gap:5%;
                    .detail {
                        display:grid;
                        height:100%;
                        grid-template-rows:auto 1fr auto;
                        h3 {
                            margin-bottom:.5em;
                        }
                        .txtlink {
                            display:grid;
                            grid-template-columns:repeat(2,auto);
                            align-items:center;
                            grid-column-gap:.33em;
                            justify-self:end;
                            color:#1A80FF;
                            margin-top:1em;
                            &::after {
                                content:'>';
                                transform:translateY(-.1em);
                            }
                        }
                    }
                    .img {
                        img {
                            display:block;
                            border-radius:10px;
                        }
                    }
                }
            }
        }
    }
}

#people {
    .wrap {
        .contents {
            .contents_inner {
                display:grid;
                grid-template-columns:repeat(3,1fr);
                grid-column-gap:1%;
                .item {
                    background-color:rgba(26,128,255,.4);
                    padding:15px 15px 30px;
                    border-radius:5px;
                    display:grid;
                    grid-template-rows:auto auto 1fr auto;
                    img {
                        border-radius:5px;
                    }
                    h4 {
                        font-size:2.8rem;
                        color:#FFFFFF;
                        padding:1em 0;
                    }
                    .detail {
                        margin-bottom:2em;
                        p {
                            color:#FFFFFF;
                            &:not(:last-child) {
                                margin-bottom:1em;
                            }
                        }
                    }
                    .txtlink {
                        display:grid;
                        grid-template-columns:repeat(2,auto);
                        align-items:center;
                        grid-column-gap:.33em;
                        justify-self:end;
                        color:#FFFFFF;
                        &::after {
                            content:'>';
                            transform:translateY(-.1em);
                        }
                    }
                }
            }
        }
    }
}

#gallery {
    .wrap {
        overflow:hidden;
        .contents {
            h3 {
                text-align:center;
                padding:0;
            }
            .slider_wrap {
                overflow:hidden;
                .slide_gallery_main {
                    padding:0 60px;
                    margin-bottom:30px;
                    .slick-list {
                        border:1px solid #1A80FF;
                        border-radius:10px;
                        .slide {
                            padding:40px;
                            img {
                                display:block;
                                width:100%;
                                aspect-ratio:1.66;
                                object-fit:cover;
                                border-radius:10px;
                            }
                            h4 {
                                font-size:2.8rem;
                                line-height:1.5;
                                padding:.66em 0;
                            }
                        }
                    }
                    .slick-arrow {
                        width:24px;
                        height:24px;
                        border-top:5px solid #000000;
                        border-right:5px solid #000000;
                        transform-origin:center center;
                        &::before {
                            content:none;
                        }
                        &.slick-prev {
                            left:10px;
                            transform:rotate(-135deg);
                        }
                        &.slick-next {
                            right:10px;
                            transform:rotate(45deg);
                        }
                    }
                }
                .slide_gallery_thumb {
                    padding:0 60px;
                    .slick-list {
                        .slide {
                            padding:3px;
                            img {
                                display:block;
                                width:125px;
                                aspect-ratio:1;
                                object-fit:cover;
                                border-radius:5px;
                            }
                            &.slick-current {
                                img {
                                    opacity:.5;
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

#data {
    .wrap {
        .contents {
            .data {
                display:flex;
                flex-wrap:wrap;
                align-items:stretch;
                gap:20px;
                & > li {
                    border:5px solid #1A80FF;
                    padding:20px;
                    flex-grow:1;
                    min-width:25%;
                    display:grid;
                    grid-template-rows:auto auto 1fr auto;
                    justify-items:center;
                    align-content:start;
                    h4 {
                        font-size:2.2rem;
                        text-align:center;
                    }
                    & > img {
                        width:110px;
                        margin:1.5em 0;
                    }
                    & > p {
                        color:#1A80FF;
                        font-size:5.8rem;
                        line-height:1;
                        font-family: "Poppins", sans-serif;
                        font-weight:600;
                        letter-spacing:.05em;
                        align-self:center;
                        span {
                            font-size:2.2rem;
                            &.font1 {
                                font-size:3.0rem;
                            }
                        }
                    }
                    .caption {
                        font-size:1.4rem;
                        line-height:1.3;
                        margin-top:1em;
                    }
                    ul {
                        display:flex;
                        flex-wrap:wrap;
                        column-gap:2em;
                        width:100%;
                        align-items:center;
                        justify-content:center;
                        li {
                            dl {
                                text-align:center;
                                dt {
                                    font-size:1.8rem;
                                    font-weight:600;
                                    margin-bottom:1em;
                                }
                                dd {
                                    font-family: "Poppins", sans-serif;
                                    font-weight:600;
                                    color:#1A80FF;
                                    font-size:4.4rem;
                                    span {
                                        font-size:1.8rem;
                                    }
                                }
                            }
                        }
                        &.list {
                            li {
                                dl {
                                    dt {
                                        font-size:1.6rem;
                                    }
                                    dd {
                                        font-size:3.2rem;
                                    }
                                }
                            }
                            &.list1 {
                                column-gap:1%;
                                justify-content:space-around;
                                li {
                                    min-width:31%;
                                    dl {
                                        display:flex;
                                        align-items:center;
                                        justify-content:center;
                                        column-gap:.5em;
                                        dt {
                                            margin-bottom:0;
                                        }
                                    }
                                }
                            }
                            &.list2 {
                                column-gap:.5em;
                                justify-content:space-between;
                                dt {
                                    font-size:1.3rem;
                                    margin:0 -1em 1em;
                                }
                            }
                        }
                    }
                    &:first-child,&:nth-child(5) {
                        width:58%;
                        max-width:58%;
                    }
                    &:nth-child(4) {
                        width:67%;
                        max-width:67%;
                    }
                    &:nth-child(n+7) {
                        width:calc(50% - 10px);
                    }
                }
            }
        }
    }
}

#news {
    .wrap {
        .contents {
            .ttl_box {
                display: grid;
                grid-template-columns: repeat(2,auto);
                align-items: center;
                justify-content: space-between;
                margin-bottom:30px;
                h3 {
                    margin-bottom:0;
                    span {
                        font-size:.7em;
                        color:#1A80FF;
                        margin-left:1em;
                    }
                }
                .txtlink {
                    display:grid;
                    grid-template-columns:repeat(2,auto);
                    align-items:center;
                    grid-column-gap:.33em;
                    color:#1A80FF;
                    &::after {
                        content:'>';
                        transform:translateY(-.1em);
                    }
                }
            }
			.news_box {
                dl {
                    font-size:1.6rem;
                    display:grid;
                    grid-template-columns:5em 7em 1fr;
                    align-items:center;
                    grid-column-gap:2em;
                    padding:1em 0;
                    border-bottom:1px solid #1A80FF;
                    min-height:6em;
                    .cat {
                        a {
                            background-color:#F7CD16;
                            color:#FFFFFF;
                            white-space:nowrap;
                            height:2.2em;
                            display:grid;
                            width:100%;
                            align-items:center;
                            justify-content:center;
                            border-radius:1.1em;
                            padding:0 1.5em;
                        }
                    }
                    dt {
                        a {
                            line-height:1.5;
                        }
                    }
                }
			}
        }
    }
}

@media (hover:hover) {
}

@media screen and (max-width:1200px){

}

@media screen and (max-width:1024px){

    section {
        .wrap {
            .contents {
                h3 {
                    font-size :2.4rem;
                }
            }
        }
    }
    
    #people {
        .wrap {
            .contents {
                .contents_inner {
                    .item {
                        h4 {
                            font-size:2.4rem;
                        }
                    }
                }
            }
        }
    }
    
    #data {
        .wrap {
            .contents {
                .data {
                    gap:15px;
                    & > li {
                        ul {
                            &.list1 {
                                justify-content:center;
                                li {
                                    width:48%;
                                }
                            }
                            &.list {
                                &.list2 {
                                    column-gap:1%;
                                    row-gap:10px;
                                    justify-content:flex-start;
                                    li {
                                        width:19%;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    
}

@media screen and (max-width:768px){

    .titlewrap {
        h1 {
            img {
                width:7em;
            }
        }
    }

    section {
        .wrap {
            .contents {
                h2 {
                    & + .detail {
                        margin-bottom:2em;
                    }
                }
                h3 {
                    font-size :2.0rem;
                    padding-left:0em;
                }
            }
        }
    }

    #recruit {
        .wrap {
            .contents {
                .tab_content {
                    .item {
                        padding:20px;
                        grid-template-columns:1fr;
                        .detail {
                            display:contents;margin-bottom:.5em;
                            p {
                                order:2;
                            }
                            .txtlink {
                                font-size:1.4rem;
                                order:3;
                                &::after {
                                    content:'>';
                                    transform:translateY(-.1em);
                                }
                            }
                        }
                        .img {
                                order:1;
                            img {
                                margin-bottom:15px;
                            }
                        }
                    }
                }
            }
        }
    }

    #people {
        .wrap {
            .contents {
                .contents_inner {
                    grid-template-columns:1fr;
                    grid-row-gap:20px;
                    .item {
                        padding:15px 15px 20px;
                        grid-template-rows:unset;
                        grid-template-columns:36% 1fr;
                        grid-column-gap:5%;
                        img {
                            border-radius:5px;
                            grid-area:1/1/4/2;
                        }
                        h4 {
                            font-size:2rem;
                            padding: .66em 0;
                        }
                        .detail {
                            margin-bottom:1em;
                        }
                        .txtlink {
                            font-size:1.4rem;
                        }
                    }
                }
            }
        }
    }

    #gallery {
        .wrap {
            .contents {
                .slider_wrap {
                    overflow:visible;
                    .slide_gallery_main {
                        padding:0 15px;
                        margin-bottom:10px;
                        .slick-list {
                            .slide {
                                padding:15px;
                                h4 {
                                    font-size:1.6rem;
                                }
                            }
                        }
                        .slick-arrow {
                            width:16px;
                            height:16px;
                            border-top:4px solid #000000;
                            border-right:4px solid #000000;
                            &.slick-prev {
                                left:-5px;
                            }
                            &.slick-next {
                                right:-5px;
                            }
                        }
                    }
                    .slide_gallery_thumb {
                        padding:0 15px;
                        .slick-list {
                            overflow:visible;
                            .slide {
                                padding:2px;
                                img {
                                    display:block;
                                    width:75px;
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    #data {
        .wrap {
            .contents {
                .data {
                    display:grid;
                    gap:10px;
                    max-width:400px;
                    margin:0 auto;
                    & > li {
                        border:4px solid #1A80FF;
                        padding:15px;
                        h4 {
                            font-size:2.0rem;
                        }
                        & > p {
                            font-size:5rem;
                            span {
                                font-size:2rem;
                                &.font1 {
                                    font-size:2.4rem;
                                }
                            }
                        }
                        .caption {
                            font-size:1.2rem;
                        }
                        ul {
                            column-gap:5%;
                            li {
                                dl {
                                    dt {
                                          font-size:min(4vw,1.6rem);
                                    }
                                    dd {
                                        font-size:min(10vw,4rem);
                                        span {
                                             font-size:min(4.3vw,1.6rem);
                                        }
                                    }
                                }
                            }
                            &.list {
                                li {
                                    dl {
                                        dt {
                                            font-size:1.3rem;
                                        }
                                        dd {
                                            font-size:2.6rem;
                                        }
                                    }
                                }
                                &.list1 {
                                    justify-content:center;
                                    li {
                                        dl {
                                            dt {
                                                font-size:min(3.6vw,1.6rem);
                                            }
                                            dd {
                                                font-size:min(7vw,4rem);
                                                span {
                                                    font-size:min(3.6vw,1.6rem);
                                                }
                                            }
                                        }
                                    }
                                }
                                &.list2 {
                                    dt {
                                        font-size:min(3.2vw,1.2rem);
                                    }
                                    li {
                                        &:nth-last-child(2) {
                                            width:30%;
                                        }
                                    }
                                }
                            }
                        }
                        &:first-child,&:nth-child(5) {
                            width:100%;
                            max-width:100%;
                        }
                        &:nth-child(4) {
                            width:100%;
                            max-width:100%;
                        }
                        &:nth-child(n+7) {
                            width:100%;
                        }
                    }
                }
            }
        }
    }

    #news {
        .wrap {
            .contents {
                display:grid;
                .ttl_box {
                    display: contents;
                    h3 {
                        margin-bottom:1em;
                    }
                    .txtlink {
                        justify-self:end;
                        order:2;
                        font-size: 1.4rem;
                    }
                }
                .news_box {
                    margin-bottom:30px;
                    dl {
                        font-size:1.4rem;
                        grid-template-columns:5em 1fr;
                        grid-gap:.5em 1em;
                        padding:1em 0;
                        border-bottom:1px solid #1A80FF;
                        min-height:6em;
                        .cat {
                            justify-self:start;
                            a {
                                font-size:1.2rem;
                            }
                        }
                        dt {
                            grid-area:2/1/3/3;
                        }
                    }
                }
            }
        }
    }

}