@charset "UTF-8";

.sec-sitemap{

    .content-box{
        display: flex;
        flex-direction: column;
        gap: 10rem;
        padding-bottom: 13rem;
        
        @media screen and (max-width: 767px) {
          gap: 8rem;
          padding-bottom: 10rem;
        }

        .box{
            .title {
                font-size: 2rem;
                font-weight: bold;
                color: var(--primary-color);
                margin-bottom: 6rem;
                @media screen and (max-width: 767px) {
                  margin-bottom: 3rem;
                  font-size: 1.8rem;
                  text-align: center;
                }

                & a {
                    color: var(--primary-color);
                }

            }

            .link-list{
                display: grid;
                grid-template-columns: repeat(4,1fr);
                grid-row-gap: 5rem;

                @media screen and (max-width: 767px) {
                  grid-template-columns: 1fr;
                }

                .link-col{
                    
                    .title {
                        font-size: 2rem;
                        font-weight: bold;
                        margin-bottom: 1.6rem;
                        line-height: 1.5;
                        color: #000;
                        
                        @media screen and (max-width: 767px) {
                            font-size: 1.8rem;
                            text-align: left;
                        }

                        & a {
                            color: #000;
                        }
                        
                    }
                    
                
                    .links{
                        padding: 5px 0;
                        padding-left: 1.8rem;
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        gap: 1.6rem;

                        &::after {
                            content: '';
                            position: absolute;
                            width: 5px;
                            height: 100%;
                            top: 0;
                            left: 0;
                            background: var(--primary-color);
                            border-radius: 1rem;
                        }
                    
                        .link{

                            & a {
                                text-decoration: underline;
                                line-height: 1.7;

                                &[target="_blank"] {
                                    position: relative;

                                    &::after {
                                        position: absolute;
                                        content: '';
                                        width: 15px;
                                        height: 15px;
                                        background-repeat: no-repeat;
                                        background-position: center;
                                        background-size: contain;
                                        background-image: url(../../common/img/icon_external_arrow_black.svg);
                                        top: 50%;
                                        right: -2rem;
                                        transform: translateY(-50%);
                                    }
                                }
                            }
                        
                        }
                    }
                }
            }

        }

        .box01{

            .link-list {
                .link-col:last-child {
                    grid-column: 3 / span 2;

                    @media screen and (max-width: 767px) {
                      grid-column: 1 / -1;
                    }
                }
            }

        }


        .box02{
            .link-col:nth-child(2) {
                grid-column: 2 / span 2;

                @media screen and (max-width: 767px) {
                      grid-column: 1 / -1;
                    }
            }

        }
        .box03{

        }
    
    }
}


a {
                                line-height: 1.7;

                                &[target="_blank"] {
                                    position: relative;

                                    &::after {
                                        position: absolute;
                                        content: '';
                                        width: 15px;
                                        height: 15px;
                                        background-repeat: no-repeat;
                                        background-position: center;
                                        background-size: contain;
                                        background-image: url(../../common/img/icon_external_arrow_black.svg);
                                        top: 50%;
                                        right: -2rem;
                                        transform: translateY(-50%);
                                    }
                                }
                            }