@charset "UTF-8";


/* 共有 */

.section-box {
    width: 120rem;
    max-width: 120rem;
    margin: 0 auto;
    margin-bottom: 9rem;

    @media screen and (max-width: 767px) {
      margin-bottom: 6rem;
      width: 100%;
      max-width: 100%;
    }

    h3 {
        font-size: 3rem;
        font-weight: bold;
        line-height: 1;
        padding: 1rem 1.8rem;
        border-left: 8px solid var(--primary-color);

        @media screen and (max-width: 767px) {
          font-size: 1.8rem;
          border-left: 5px solid var(--primary-color);
          padding: 5px 1rem;
        }
    }

    p {
        line-height: 1.8;
        font-size: 1.6rem;
    }

    .act-list{
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            grid-column-gap: 7rem;
            grid-row-gap: 5rem;
            margin-top: 4rem;

            @media screen and (max-width: 767px) {
              grid-template-columns: 1fr;
              margin-top: 3rem;
            }
        
            .act-item{
                display: flex;
                gap: 3rem;

                @media screen and (max-width: 767px) {
                  /* flex-direction: column; */
                  gap: 2rem;
                }
            
                .item-img-box{
                    @media screen and (max-width: 767px) {
                      flex: 0 0 9.6rem;
                    }
                
                }
                .item-text-box{
                    flex: 1;
                
                    .title{
                        font-size: 1.8rem;
                        font-weight: bold;
                        color: var(--primary-color);
                        margin-bottom: 1.6rem;
                        @media screen and (max-width: 767px) {
                          font-size: 1.6rem;
                          line-height: 1.4;
                        }
                    }
                    .main-text{
                        line-height: 1.5;
                        @media screen and (max-width: 767px) {
                          font-size: 1.4rem;
                        }
                    
                    }
                    .desc-box {
                        @media screen and (max-width: 767px) {
                          flex-direction: column;
                          align-items: flex-start;
                          gap: 0
                        }
                    }
                    .desc-text{
                        display: inline-block;
                        margin-top: 1.6rem;
                        font-size: 1.4rem;
                        font-weight: bold;
                        color: var(--primary-color);
                        padding: 5.5px 7px;
                        line-height: 1;
                        background-color: #D7EAF4;
                    }
                    .courses{
                        display: flex;
                        gap: 1rem;

                        @media screen and (max-width: 767px) {
                          flex-wrap: wrap;
                        }

                        .course{
                            padding: 5.5px 7px;
                            font-size: 1.4rem;
                            font-weight: bold;
                            color: #fff;
                            margin-top: 1.6rem;

                        
                            &.a-course{
                                background-color: var(--primary-color);
                            
                            }
                            &.b-course {
                                background-color: #489D72;
                            }
                            &.c-course{
                                background-color: #4D9FDD;
                            
                            }
                            &.l-course{
                                background-color: #7871B8;
                            
                            }    
                        }
                    }
                }
            }
    }

        .insurance-wrapper{
        display: flex;
        flex-direction: column;
        gap: 6rem;
        margin-top: 7rem;

        @media screen and (max-width: 767px) {
          gap: 4rem;
        }

        .insurance-group{

                & h3 {
                    margin-bottom: 3rem;

                    @media screen and (max-width: 767px) {
                    margin-bottom: 2rem;
                    line-height: 1.4;
                    }
                }
        
            .group-type{

                &:not(:last-child) {
                    margin-bottom: 4rem;
                }
            
            }
            .group-type-name{
                color: #fff;
                background-color: var(--primary-color);
                font-size: 2rem;
                padding: 1.5rem 3rem;
                border-radius: 3rem;

                @media screen and (max-width: 767px) {
                  font-size: 1.6rem;
                }
            
            }
            .pdf-year-wrapper{
                margin-top: 2rem;
                border: 1px solid #666666;
            
                .year{
                    display: flex;

                    @media screen and (max-width: 767px) {
                      flex-direction: column;
                    }

                    &:not(:last-child) {

                        .pdf-year-name {
                            border-bottom: 1px solid #fff;
                        }
                        
                        .languages {
                            border-bottom: 1px solid #666;
                        }
                    }
                
                    .pdf-year-name{
                        padding: 2rem 5rem;
                        color: #fff;
                        background-color: #666;
                        font-size: 1.8rem;
                        font-weight: bold;
                        display: flex;
                        justify-content: center;
                        align-items: center;

                        @media screen and (max-width: 767px) {
                          font-size: 1.4rem;
                        }
                    }
                    .languages{
                        display: flex;
                        align-items: center;
                        gap: 2rem;
                        padding-left: 2rem;
                        flex: 1;
                        flex-wrap: wrap;

                        @media screen and (max-width: 767px) {
                          padding: 2rem;
                          gap: 1rem;
                        }
                    
                        .pdf-link{
                            font-size: 1.8rem;
                            font-weight: bold;
                            border-radius: 3rem;
                            padding: 1rem 2rem;
                            color: var(--primary-color);
                            background-color: #D7EAF4;

                            @media screen and (max-width: 767px) {
                              font-size: 1.4rem;
                            }
                        
                        }
                    }
                }
            }
        }
    }

    
}
/* 重要事項 */

.section-notice {

    .content-box {

        & p:first-child {
            padding-left: 3rem;

            & span.has-mark {
                position: relative;

                &:after {
                    content: '・';
                    position: absolute;
                    top: 0;
                    left: -1.5rem;
                }   
            }
        }

        & a {
            text-decoration: underline;
            color: var(--primary-color);
        }
    }
}

/* table */

.detail-table{
                width: 100%;

                & td {
                    border: 1px solid #e0e0e0;
                    background-color: #F8F8F8;
                }
    
                & tr {

                    &:not(:last-child) th {
                        border-bottom: 1px solid #e0e0e0;
                    }
    
                }
    
                & th {
                    font-weight: bold;
                    color: #fff;
                    background-color: var(--primary-color);
                    border: 1px solid var(--primary-color);
                    font-size: 1.8rem;
                    width: 27rem;
                    min-width: 27rem;
                    padding: 2rem;
                    line-height: 1.4;

                    @media screen and (max-width: 767px) {
                      font-size: 1.6rem;
                      width: 40%;
                      min-width: 40%;
                      letter-spacing: 2px;
                      line-height: 1.5;
                      display: none;
                    }
    
                }
    
                & td {
                    padding: 1.7rem 4rem;

                    @media screen and (max-width: 767px) {
                        padding: 1.5rem;
                        font-size: 1.4rem;
                        line-height: 1.5;
                    }
    
                    & p {
                        margin-bottom: 1.4rem;

                        @media screen and (max-width: 767px) {
                          font-size: 1.2rem;
                        }
                    }
    
                    & span {
                        font-weight: bold;
                    }
    
                    .buttons-box{
                        display: flex;
                        gap: 1.6rem;

                        & a {
                            width: 31rem;
                            min-width: 30rem;
                            height: 5rem;
                            padding: 1.4rem 1.8rem;
                            background-color: #fff !important;

                            @media screen and (max-width: 767px) {
                              width: 100%;
                              min-width: 100%;
                            }
                        }



                        @media screen and (max-width: 767px) {
                          flex-direction: column;
                          width: 100%;
                        }
                    
                    }
                }
}