@charset "utf-8";

#download{
    .wrap{
        .contents{
            .contents_inner{
                display: grid;
                grid-template-columns: 1fr 1fr 1fr;
                grid-gap: 20px;
                .btn{
                    border: #000 3px solid;
                    display: grid;
                    grid-template-columns: 40px 1fr 20px;
                    grid-gap: 2em;
                    font-size: 1.8rem;
                    line-height: 1.6;
                    padding: 1em;
                    align-items: center;
                    background-color: #fff;
                    width: 100%;
                    height: inherit;
                    &::after{
                        content:none;
                    }
                }
            }
        }
    }
}
#schedule{
    .wrap{
        .contents{
            .contents_inner{
                display: grid;
                grid-template-columns: 1fr 1fr;
                grid-gap: 20px;
                .schedule_box{  
                    border: 2px #000 solid;
                    h3{
                        background-color: #027A36;
                        color: #fff;
                        display: grid;
                        grid-template-columns: 1fr auto;
                        grid-gap: 1em;
                        border: 2px #027A36 solid;
                        padding: 1em 1em 0.5em;
                        align-items: center;
                        font-size: 1.8rem;
                        .en{
                            font-size: 3.6rem;
                        }
                    }
                    ul{
                        padding: 2.5em;
                    }
                    &.ver1{
                        ul{
                            display: grid;
                            grid-gap: 1.5em;
                            li{
                                border-bottom: 3px dotted #666;
                                padding-bottom: 1.5em;
                                &:last-child{
                                    border-bottom: none;
                                    padding-bottom: 0;
                                }
                            }
                        }
                    }
                    &.ver2{
                        ul{
                            display: grid;
                            grid-gap: 1.5em;                                                    
                            li{
                                position: relative;                                                               
                                text-indent: 1.2em;                                
                                dl{
                                    display: grid; 
                                    grid-template-columns: 8em 1fr;
                                    grid-gap: 1em;
                                }
                                &::before{
                                    content:"";
                                    background-color: #027A36;
                                    height: 0.7em;
                                    width: 0.7em;
                                    border-radius: 50px;
                                    position: absolute;
                                    left:0;
                                    top: 58%;
                                    transform: translateY(-50%);   
                                }
                                &:last-child{
                                    text-indent: 0;   
                                    &::before{
                                        content:none;
                                    }
                                }
                            }                           
                        }
                    }
                }
            }
        }
    }
}
#payment{
    .wrap{
        .contents{
            p{
                margin-bottom: 30px;
            }
            .bank{
                background-color: #DEF2A7;
                display: grid;
                grid-gap: 1em;
                padding: 2em;
                justify-self: start;
            }
        }
    }
}
#scholarship{
    .wrap{
        .contents{
            ul{
                display: grid;
                grid-gap: 1em;
                margin-bottom: 30px;
                li{
                    position: relative;                                                               
                    text-indent: 1.2em; 
                    &::before{
                        content:"";
                        background-color: #027A36;
                        height: 0.7em;
                        width: 0.7em;
                        border-radius: 50px;
                        position: absolute;
                        left:0;
                        top: 58%;
                        transform: translateY(-50%);   
                    }
                    dl{
                        display: grid;
                        grid-template-columns: 4em 1fr;
                        grid-gap: 1em;
                    }
                }
            }
            p{
                margin-bottom: 30px;
            }
            .time{
                display: grid;
                grid-gap: 2em;
                grid-template-columns: 1fr 1fr;
                justify-self: start;
                p{
                    margin-bottom: 0;
                }
            }
        }
    }
}
#price{
    .wrap{
        .contents{
            .table{               
                table{
                    width: 100%;
                    &:first-child{
                        margin-bottom: 50px;
                    }                    
                    tr{                        
                        th{
                            background-color: #CECECE;                                                
                        }
                        th,td{        
                            border: 1px solid #333;                      
                            padding: 1em;
                            line-height: 1.4;
                            vertical-align: middle;
                            text-align: center;
                            &.violet{
                                background-color: #745CF8;
                                color: #fff;
                            }
                            &.orange{
                                background-color: #FFAB86;
                                color: #fff;
                            }
                            &.blue{
                                background-color: #4491DE;
                                color: #fff;
                            }
                            &.pink{
                                background-color: #F474C2;
                                color: #fff;
                            }
                            &.green{
                                background-color: #32B487;
                                color: #fff;
                            }                           
                        }
                        .vertical{
                            writing-mode: vertical-rl;
                            letter-spacing: 0.2em;
                        }
                    }
                }
                .caution{
                    display: grid;
                    grid-gap: 1em;
                    margin: 20px 0 50px;
                    li{
                        position: relative;
                        text-indent: 1.5em;
                        &::before{
                            content:"※";
                            height: 1em;
                            width: 1em;
                            border-radius: 50px;
                            position: absolute;
                            left:-1.2em;
                            top: 58%;
                            transform: translateY(-50%);   
                        }
                    }
                }
            }
        }
    }
}
@media (hover:hover) {
    
    #download{
        .wrap{
            .contents{
                .contents_inner{
                    .btn{
                        &:hover{
                            background-color: #efefef;
                        }
                    }
                }
            }
        }
    }
    
}

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

}

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

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