/* BASIC css start */
#content{padding: 70px 0;}

#content>section>.a_Box{display:flex; justify-content: center; gap:10px; border-bottom: 1px solid #C1C1C1;}
#content>section>.a_Box>a{width:150px; font-size: 15px; text-align: center; padding: 10px 10px; border: 1px solid #C1C1C1; color: #C1C1C1; cursor: pointer;}
#content>section>.a_Box>a.on{border: 1px solid #9CB01B; color: #9CB01B;}

#content>section>.textBox{margin:50px 0;}
#content>section>.textBox>h3{font-size: 20px; font-weight:bold; margin-bottom:20px; color: #000;}
#content>section>.textBox>p{font-size: 15px;}
#content>section>.textBox>ul{font-size: 15px; margin-top:10px; padding-left:20px;}
#content>section>.textBox>ul>li{margin-bottom: 10px; list-style: outside;}

#content>section{display:none;}
#content>section.on{display:block;}
#content>section>.cardBox{width:100%;}
#content>section>.cardBox>.card{display:flex; flex-wrap: wrap; width:100%; margin-top: 30px; border: 1px solid #C1C1C1;}
#content>section>.cardBox>.card>.imgBox{width:40%;}
#content>section>.cardBox>.card>.imgBox>img{width:100%;}
#content>section>.cardBox>.card>.textBox{display: flex;flex-direction: column;justify-content: space-between; box-sizing: border-box; width:60%;padding:50px;}
#content>section>.cardBox>.card>.textBox>div>h3{font-size: 20px; font-weight:bold; margin-bottom:10px; color: #000}
#content>section>.cardBox>.card>.textBox>div>ul{font-size: 15px; margin-top:10px; padding-left:20px; font-weight: 600;}
#content>section>.cardBox>.card>.textBox>div>ul>li{margin-bottom: 10px; list-style: outside;}
#content>section>.cardBox>.card>.textBox>div>ul>li>ul{padding-left:10px; font-size:13px; font-weight: 100;}

.section.ani{
    position: relative;
    animation: move_bottom 0.5s ease-in-out;
}

@keyframes move_bottom {
    from {
        opacity: 0;
        left: 50px;
    }

    to {
        opacity: 1;
        left: 0;
    }
}

@media screen and (max-width:1300px) {
    .mid{width:1000px;}
    #content>section>.cardBox>.card>.textBox{padding: 40px 50px;}
}
@media screen and (max-width:1050px) {
    .mid{width:800px;}
    #content>section>.cardBox>.card>.textBox{padding: 15px 50px;}
}
@media screen and (max-width:768px) {    
    .mid{width: 90%; padding:0;}
    #content>section>.a_Box>a{width:135px;}
    #content>section>.cardBox>.card>.imgBox{width:100%;}
    #content>section>.cardBox>.card>.textBox{width:100%; padding:30px;}
}
/* BASIC css end */