@charset "UTF-8";
.main-content-wrapper { display: flex; justify-content: space-between; gap: 5%; min-height: 100vh; overflow: visible; align-items: flex-start;}
.main-content-left {width: 40%; height: calc(100vh - 125px); border: 1px solid #ddd; border-radius: 0 20px 0 0; padding: 3rem; border-left: none; border-bottom: none; position: sticky; top: 125px;}
.main-content-left{border-left: none; border-bottom: none;}
.sub-title-box{display: flex; flex-direction: column; border-top: 1px solid #ddd;}
.sub-box-list{display: block; padding: 20px 0 0; text-decoration: none; transition: all .3s ease;}
.sub-box-list:hover{color: #00A6B9;}
.sub-box-list::before{font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f054"; color: #1F717A; margin-right: 15px;}
.sub-title{font-size: 1.2rem; margin-bottom: 40px;} .sub-title > span{display: block; font-size: .8rem; color: #b7b7b7;}

.main-content-right{width: 90%; padding: 0 5% 200px 0;}
.breadcrumbs{display: flex; align-items: center; font-size: 12px; margin-bottom: 30px;}
.breadcrumbs i{font-size: 18px;}
.breadcrumbs > a{text-decoration: underline !important;}
.breadcrumbs > .line{width: 10px; height: 1px; margin: 0 .8rem; background: #ddd;}


/* mobile
-----------------------------------------------------------*/
@media (max-width: 767px) {
    .main-content-wrapper{flex-wrap: wrap; padding: 0 5% 80px 5%; min-height: auto;}
    .main-content-left{display: none;}
    .main-content-right{width: 100%; padding: 0;}

}

@media (max-width: 375px) {

}