@charset "utf-8";
/* CSS Document */
@import url('/views/hmpg/common/css/font-notokr.css');

/* 초기화 */
.sub-container {
	padding-bottom: 2rem;
}
@media (min-width: 768px) {
	.sub-container {
		padding-bottom: 4rem;
	}
}
.sub-container #content {
	min-height: auto;
	margin-bottom: auto;
}

body {word-break: keep-all;}
.line-gap {width: 100%;margin: 2.4rem 0;clear: both;border-top: 1px dotted #ccc;}

/* title */
.tit-h3 {position: relative;padding: 0.8rem 0 0 0;font-size: 1.6rem;margin-bottom: 1.6rem;color: #333;}
.tit-h3:after {content: '';position: absolute;top:0;left: 0;display: inline-block;width: 1.9rem;height: 2px;background-color: rgb(var(--point-color-01));}
.tit-h3 > span {font-size: 18px;color: #777;font-weight: normal;}
.tit-h4 {color: rgb(var(--point-color-01));margin-top: 1.6rem;margin-bottom: 0.7rem;}
.tit-h4 > span {font-size: 1rem;font-weight: 400;color: #838484;}
.tit-h5 {color: #874b19;font-weight: 600;margin-top: 1.5rem;margin-bottom: 0.5rem;}
.tit-h6 {background: url("/views/hmpg/site/resource/knu/common/images/bullet01.png") no-repeat left 4px;padding-left: 1.1rem;color: #333;font-size: 17px;margin-top: 1.5rem;margin-bottom: 5px;}

/* list */
.list-style01, .list-style02 {margin: 0 0 1.5rem 0;}
.list-style01 > li {background: url(/views/hmpg/site/resource/knu/common/images/bullet02.png) no-repeat left 10px;text-align: left;padding-left: 0.9rem;margin: 0.3rem 0;}
.list-style01 > li .list-style02 {margin: 0.3rem 0 0.7rem;}
.list-style02 > li {background: url("/views/hmpg/site/resource/knu/common/images/bullet03.png") no-repeat left 9px;padding-left: 1rem;margin: 0.1rem 0;color: #777;}

/* numbering */
ol.list-style01 {
  padding-left: 1rem;
  list-style: decimal;
}
ol.list-style01 > li {
  margin: 0.5rem 0;
    background: none;
}

ol[class*='list-style0'] .form-check-input {
    margin-top: 0.5rem;
}

ol.list-style02 {
  padding-left: 1.75rem;
  list-style: decimal-leading-zero;
}
ol.list-style02 > li {
  margin: 0.5rem 0;
    background: none;
}

/* text type */
.ment-tit {font-family: 'iropke';font-size: 1.5rem;line-height: 1.6;color: #666;}
.info-txt {position: relative;padding-left: 1.6rem;}
.info-txt:before {content: '\e88e';position: absolute;top: 2px;left: 0;font-family: 'material-Icons';font-size: 1.3rem;line-height: 1.1;color: #767b81;}
.info-txt.small:before {font-size:18px;top: 0;}
.info-txt.type01:before {color: #dc3545;}

/* btn */
.btn {border-radius:0;}
.btn-primary {background-color: rgb(var(--point-color-01));border-color: #b70b1e;}
.btn-primary:hover, .btn-primary:focus {background-color: rgb(var(--point-color-02));border-color: #a30c1c;}
.btn-secondary {background-color: #59636d;border-color: #555d65;}
.btn-secondary:hover, .btn-secondary:focus {background-color: #464a4f;border-color: #414447;}
.btn-outline-primary {color: rgb(var(--point-color-01));border-color: rgb(var(--point-color-01));}
.btn-outline-primary:hover, .btn-outline-primary:focus {background-color: rgb(var(--point-color-01));border-color: #b70b1e;}
.btn-outline-secondary {color: #59636d;border-color: #555d65;}
.btn-outline-secondary:hover, .btn-outline-secondary:focus {background-color: #59636d;border-color: #555d65;}
.btn-sm .material-icons {font-size:1rem;}

/* modal */
.modal-header {background-color: rgb(var(--point-color-02));}

/* login */
.login-wrap {border: 1px solid #e6e6e6;border-top: 2px solid rgb(var(--point-color-04));border-radius: 0.3rem;background: #fbfbfb;max-width: 60rem;margin: 3rem auto 0;padding: 3rem 10%;}
.login-wrap h3 {text-align: center;padding: 0;background: none;}
.login-wrap img {display: block;margin: 0 auto;}
.login-box {margin-top: 2.5rem;}
.login-box .form-control {border-radius: 0;height: calc(2.45rem + 2px);}
.login-box .btn {border-radius: 0;}
@media (min-width: 768px) {
    .login-wrap {padding:3rem 5%;}
    .login-wrap h3 {font-size:1.3rem}
    .login-box {/* margin-top: 1rem; */}
}
.form-control-plaintext {
	background-color: #f8f9fa;
	border-radius: 0.25rem;
	padding: 0.375rem 0.75rem;
}
.input-group .form-control-plaintext {
	position: relative;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	width: 1%;
	margin-bottom: 0;
}


/* tab */
.nav-tabs-style01 .nav-item .nav-link.active {background-color: rgb(var(--point-color-01));}
.nav-tabs-style01 .nav-item .nav-link:hover, .nav-tabs-style01 .nav-item .nav-link:focus {color: rgb(var(--point-color-01));}
.nav-tabs-style01 .nav-item .nav-link.active:hover, .nav-tabs-style01 .nav-item .nav-link.active:focus {color: #fff;}
.nav-tabs-style01>a:hover, .nav-tabs-style01>a:focus {color: rgb(var(--point-color-01));}
.nav-tabs-style02 {margin-bottom:2rem;border: none;background: #F8F8F8;position: relative;border-top: 1px solid #4A5664;border-left: 1px solid #ddd;}
.nav-tabs-style02:after, .nav-tabs-style02:before {content:'';position:absolute;display:inline-block;background: #ddd;}
.nav-tabs-style02:after {width: 100%;height: 1px;left: 0;bottom: 0;}
.nav-tabs-style02:before {width: 1px;height: 100%;top: 0;right: 0;}
.nav-tabs-style02 .nav {border-bottom:none;overflow: hidden;}
.nav-tabs-style02 .nav .nav-item {width:50%;margin: 0;}
.nav-tabs-style02 .nav-link {border-radius: 0;background: #fff;text-align: center;border: 1px solid #DDDDDD;padding: 0.9rem 0.25rem;margin: -1px 0 0 -1px;}
.nav-tabs-style02 .nav-link.active, .nav-tabs-style02 .nav-item.show .nav-link {color:#fff;background: #7b3506;border-color: transparent;}
.nav-tabs-style02 .nav-link:hover, .nav-tabs-style02 .nav-link:focus {color: rgb(var(--point-color-04));font-weight: 400;border-color: #ddd;}
.nav-tabs-style02 .nav-link.active:hover, .nav-tabs-style02 .nav-link.active:focus {color:#fff;text-decoration:underline;}
@media (min-width: 768px) {
        .nav-tabs-style02 .nav .nav-item {width:33.3%;}
}
@media (min-width: 992px) {
        .nav-tabs-style02 .nav .nav-item {width:25%;}
}

/* flow-list */
.flow-list {display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;padding: 0;border-bottom: 1px solid #aaa;border-top: 2px solid #404b57;}
.flow-list > li {position: relative;-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;list-style: none;counter-increment: count;border-bottom: 1px dotted #ddd;padding: 0;margin: 0;}
.flow-list > li:first-child {}
.flow-list > li:after {content:'\e313';position: absolute;top: -0.8rem;left: 50%;z-index: 1;display: inline-block;width: 26px;height: 26px;text-align: center;margin-left: -14px;border-radius: 50%;font-family: 'material-Icons';font-size: 1.3rem;color: #7b3506;background: #ebeced;}
.flow-list > li:first-child:after {display:none;}
.flow-list > li .txt-box {list-style: none;position: relative;box-sizing: border-box;line-height: 1.5;color: #888;word-break: keep-all;padding: 0 0 0 2.2rem;margin: 1.8rem 0;}
.flow-list > li:first-child .txt-box {}
.flow-list > li .txt-box:before {content:counter(count, decimal-leading-zero);position: absolute;top: 0;left: 0;color: #874b19;font-size: 1rem;}
.flow-list > li .txt-box strong {font-weight: 600;color: #000;}
.flow-list > li .txt-box li {line-height: 1.3;}
.flow-list > li .txt-box.type01:before {display: none;}
.flow-list > li .txt-box.type01 .step {position: absolute;width: 2rem;top: 0;left: 0;word-break: normal;color: #874b19;font-size: 1rem;}

.flow-list.style01 > li .txt-box {padding-left:0;}
.flow-list.style01 > li .txt-box:before {display:none;}
.flow-list.style01 > li .txt-box strong {color: #874b19;}
@media (min-width: 768px) {
	.flow-list > li {-ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%;padding-left: 1.4rem;}
	.flow-list > li:nth-child(4n):before {display: none}
	.flow-list > li:after {content:'\e315';top: 50%;left: -14px;margin-top: -14px;margin-left: 0;}
	.flow-list > li:nth-child(2n+1):after {display: none;}
	.flow-list > li .txt-box {padding: 1.6rem 1.6rem 0 0;height: calc(100% - 3.6rem);}
	.flow-list > li .txt-box:before {content:'STEP 'counter(count, decimal-leading-zero);}
	.flow-list > li .txt-box:after {content:'';position: absolute;display:inline-block;width:1px;height: 90%;top: 5%;right: 0;background: #ddd;}
	.flow-list > li:nth-child(2n) .txt-box:after {display:none;}
	.flow-list > li .txt-box.type01 .step {width: auto;}
	.flow-list.style01 > li .txt-box {padding-top:0;}
}
@media (min-width: 992px) {
	.flow-list > li {-ms-flex: 0 0 33.333%;flex: 0 0 33.333%;max-width: 33.333%;}
	.flow-list > li:nth-child(2n+1):after {display: block;}
	.flow-list > li:nth-child(3n+1):after {display: none;}
	.flow-list > li:nth-child(2n) .txt-box:after {display:block;}
	.flow-list > li:nth-child(3n) .txt-box:after {display:none;}
}
@media (min-width: 1200px) {
		.flow-list > li {-ms-flex: 0 0 25%;flex: 0 0 25%;max-width: 25%;}
		.flow-list > li:nth-child(3n+1):after {display: block;}
		.flow-list > li:nth-child(4n+1):after {display: none;}
		.flow-list > li:nth-child(3n) .txt-box:after {display:block;}
		.flow-list > li:nth-child(4n) .txt-box:after {display:none;}
		.flow-list.style02 > li {-ms-flex: 0 0 33.333%;flex: 0 0 33.333%;max-width: 33.333%;}
		.flow-list.style02 > li:nth-child(2n+1):after {display: block;}
		.flow-list.style02 > li:nth-child(3n+1):after {display: none;}
		.flow-list.style02 > li:nth-child(2n) .txt-box:after {display:block;}
		.flow-list.style02 > li:nth-child(3n) .txt-box:after {display:none;}
}


/* flow-listimg */
.flow-listimg {background: #f8f8f8;padding: 2rem;}
.flow-listimg .row {position:relative;}
.flow-listimg .row + .row {border-top: 1px solid #e2e3eb;padding-top: 1.5rem;margin-top: 1.5rem;}
.flow-listimg .img {display: none;}
.flow-listimg .row + .row:after {content:'\e5cf';position: absolute;top: -25px;left: 50%;font-family: 'material-Icons';font-size: 35px;color: #aa1a2a;background: #f8f8f8;margin-left: -15px;}
.flow-listimg .txt-box h4 {margin-bottom: 0.6rem;}
.flow-listimg .txt-box h4 > span {font-size: 17px;display: block;color: rgb(var(--point-color-01));margin-bottom: 0.2rem;}
.flow-listimg .txt-box > p {color: #666;line-height: 1.5;}
.flow-listimg .txt-box ul li {color: #666;}
@media (min-width: 768px) {
    .flow-listimg .row + .row:after {left:12.5%;}
    .flow-listimg .img {display:block;text-align: center;}
    .flow-listimg .txt-box h4 {margin-top: 1rem;}
}
@media (min-width: 992px) {
    .flow-listimg {padding:3rem 2.5rem;}
}


/* img */
.img-zoom, .img-lg-zoom, .img-xl-zoom {position: relative;text-align: center;border: 1px solid #eaeaea;padding: 1.5rem 1rem;}
.img-zoom img, .img-lg-zoom img, .img-xl-zoom img {max-width: 100%;margin: 0 auto;}
.img-zoom > .btn, .img-lg-zoom > .btn, .img-xl-zoom > .btn {position: absolute;top: 0;right: 0;width: 2.4rem;height: 2.4rem;background: #31313d url('/views/hmpg/common/images/zoom-icon.png') no-repeat center center;transition: 0.3s;}
.img-zoom > .btn:hover, .img-zoom > .btn:focus, .img-lg-zoom > .btn:hover, .img-lg-zoom > .btn:focus, .img-xl-zoom > .btn:hover, .img-xl-zoom > .btn:focus {background-color: rgb(var(--point-color-01));}
@media (min-width: 768px) {
	.img-zoom {padding: 0;border: none;}
	.img-zoom > .btn {display: none;}
}
@media (min-width: 992px) {
	.img-lg-zoom {padding: 0;border: none;}
	.img-lg-zoom > .btn {display: none;}
}


/* accordion */
.accordion-style01 .card {margin-bottom: 0.5rem;}
.accordion-style01 .card .card-header {background-color:#fff;border-bottom: none;}
.accordion-style01 .card .card-header button {background-color: transparent;border-bottom: none;width: 100%;position: relative;text-align: left;font-size: 17px;color: #555;font-weight: 600;padding: 0;white-space: inherit;}
.accordion-style01 .card .card-header button:hover, .accordion-style01 .card .card-header button:focus {color: rgb(var(--point-color-02));}
.accordion-style01 .card .card-header button[aria-expanded="true"] {color: rgb(var(--point-color-02));text-decoration: none;}
.accordion-style01 .card .card-header button:before {content: '\e313';font-family: 'material-Icons';position: absolute;right: 0;font-weight: 600;font-size: 1.3rem;line-height: 1.3;}
.accordion-style01 .card .card-header button:not(.collapsed):before {content: '\e316'; }
.accordion-style01 .card .card-body {padding: 1.75rem;border-top: 1px dotted rgba(0, 0, 0, 0.125);background-color: rgba(0, 0, 0, 0.03);}

.accordion-style02 .card {margin-bottom: 0.5rem;}
.accordion-style02 .card .card-header {position: relative;background-color:#fff;border-bottom: none;}
.accordion-style02 .card .card-header:after  {content: 'Q';position: absolute;top: 0.8rem;left: 1.25rem;width: 26px;height: 26px;padding: 0.1rem 0;text-align: center;font-size: 0.9rem;display: inline-block;background: #1364ba;color: #fff;}
.accordion-style02 .card .card-header button {background-color: transparent;border-bottom: none;width: 100%;position: relative;text-align: left;color: #555;font-weight: 600;padding: 0;white-space: inherit;padding-left: 2.1rem;}
.accordion-style02 .card .card-header button:hover, .accordion-style02 .card .card-header button:focus {color: #1364ba;}
.accordion-style02 .card .card-header button:not(.collapsed) {color: #1364ba;text-decoration: none;}
.accordion-style02 .card .card-header button:before {content: '\e313';font-family: 'material-Icons';position: absolute;right: 0;font-weight: 600;font-size: 1.3rem;line-height: 1.3;}
.accordion-style02 .card .card-header button:not(.collapsed):before {content: '\e316'; }
.accordion-style02 .card .card-body {position: relative;padding: 1.75rem 1.75rem 1.75rem 3.65rem;border-top: 1px dotted rgba(0, 0, 0, 0.125);background-color: rgba(0, 0, 0, 0.03);}
.accordion-style02 .card .card-body:after  {content: 'A';position: absolute;top: 1.7rem;left: 1.25rem;width: 26px;height: 26px;padding: 0.1rem 0;text-align: center;font-size: 0.9rem;display: inline-block;background: #6d7175;color: #fff;}


/* professor-item */
.professor-area{justify-content: flex-start; align-items: stretch;}
.professor-area > .col-lg-6.col-xl-4{margin-bottom: 1.5rem;}
.professor-item {display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;padding: 1.5rem 1.3rem 3rem;width: inherit; border-color: #e7e7e7;justify-content: flex-start;
    align-items: flex-start;  margin-bottom: 0; }
.professor-item .thum {display:block;position: relative;-ms-flex: 0 0 30%;flex: 0 0 30%;max-width: 30%;float: none;}
.professor-item .professor-btn>a:hover, .professor-item .professor-btn>a:focus {color: rgb(var(--point-color-02));}
.professor-item .professor-cont {-ms-flex: 0 0 70%;flex: 0 0 70%;max-width: 70%;padding-left: 15px;}
.professor-item .professor-cont .name {padding:0;width: calc(100% - 95px);font-size: 20px;margin-bottom: 0.5rem;color: #7b3506;}
.professor-item .professor-cont ul>li {background: url("/views/hmpg/site/resource/knu/common/images/bullet02.png") no-repeat left 9px;margin: 0.2rem 0;}
.prof-body { flex-grow: 1; height: 100%;}

.modal-body .professor-item {height:auto;padding:1.3rem}
.modal-body .professor-item .thum {padding-top:0;margin-bottom:0}
.modal-body .professor-item .professor-cont .name {margin-top:0;}

/* board */
.page-item .page-link {color: rgb(var(--point-color-04)); height: 100%;}
.page-item.active .page-link {background-color: rgb(var(--point-color-01));border-color: rgb(var(--point-color-02));}

.pager .pager-navi {color: rgb(var(--point-color-02));}
.btn-link {color: rgb(var(--point-color-04));}

/* Calendar */
	.pager-calendar h3 {color: rgb(var(--point-color-02));}
	.pager-calendar .pager-btn {position:relative;background-color: #e3e4e5;width: 38px;height: 38px;text-align: center;border-radius: 38px;}
	.pager-calendar .pager-btn:hover, .pager-calendar .pager-btn:focus {color: rgb(var(--point-color-01));}
	.pager-calendar .pager-btn span {display:none;}
	.pager-calendar .pager-btn .left-year {left: 53px;}
	.pager-calendar .pager-btn .right-year {right: 53px;}
	.pager-calendar .pager-btn .material-icons {font-size: 2.2rem;}
	.calendar-list li {background: url(/views/hmpg/site/resource/knu/common/images/bullet02.png) no-repeat 5px 9px;text-align: left;padding-left: 1rem;margin: 0.3rem 0;}
@media (min-width: 586px) {
	.pager-calendar .pager-btn > span {display:block;position:absolute;top: 6px;font-size: 1.2rem;font-weight: 600;}
}
@media (min-width: 992px) {
    .calendar-wrap .calendar-list {padding: 0.5rem;}
    .calendar-wrap .card {height:100%}
}

/* lecture */
.lecture h3.tit-h3 {
	margin-top: 2rem;
	margin-bottom: 1rem;
}
@media (max-width: 576px) {
	.sub-container {
		font-size: 0.9375rem;
	}
}
.lecture .form-label,
.lecture .col-form-label {
	font-size: 0.9375rem;
	font-weight: 600;
}

/* border p-3 rounded */
.lecture .search-box {
	border: 1px solid #dee2e6;
	padding: 1rem;
	border-radius: 0.25rem;
	margin-bottom: 2rem;
}

.lecture .search-box .form-label {
	font-weight: 700;
}
@media (min-width: 768px) {
	.lecture .search-box .form-label:not(:first-child) {
		padding-left: 1rem;
	}
}

.lecture .search-box .form-label,
.lecture .search-box .form-control,
.lecture .search-box .input-group,
.lecture .search-box .btn {
	margin-bottom: 0.5rem;
}
.lecture .search-box .input-group .form-control {
	margin-bottom: 0;
}

@media (min-width: 768px) {
	.lecture .search-box .form-label,
	.lecture .search-box .form-control,
	.lecture .search-box .input-group,
	.lecture .search-box .btn {
		margin-right: 0.5rem;
		margin-bottom: 0;
	}
	.lecture .search-box .input-group .form-control {
		margin-right: 0;
	}
}

.lecture .card {
	margin-bottom: 2rem;
}

.lecture .card dl {
	margin-bottom: 0;
	display: flex;
}
.lecture dl dt {
	position: relative;
	padding-left: 0.5rem;
}
.lecture dl dt::before {
	content: '';
	display: inline-block;
	width: 4px;
	height: 4px;
	border-radius: 1000px;
	background-color: #999;

	position: absolute;
	top: 8px;
	left: 0;
}
.lecture dl dd {
	margin-bottom: 0;
	padding-left: 0.5rem;
}

.lecture .card dl {
	flex-direction: column;
	align-items: flex-start;
}
.lecture .card dl {
	margin-bottom: 0.5rem;
}


@media (min-width: 576px) {
	.lecture .card dl {
		flex-direction: row;
	}

	.lecture .card dl dt {
		flex: 1 0 120px;
		max-width: 120px;

	}
}

/* lecture list */
.lecture.list .card {
	width: 100%;
}
.lecture.list .card-body dl {
	flex-direction: row;
}
.lecture.list .card-body dt {
	flex: 1 0 88px;
	max-width: 88px;
}
@media (min-width: 1024px) {
	.lecture.list .row {
		align-items: stretch;
	}
	.lecture.list .row > div {
		display: inline-flex;
	}
}


/* lecture result */
@media (min-width: 576px) {
	.lecture.result .card dl dt {
		flex: 1 0 200px;
		max-width: 200px;
	}
}

/* lecture-his */
.lecture .student-info {
	padding: 0.5rem 1rem;
	border: 1px solid #dee2e6;
	background: #f8f9fa;
	margin-bottom: 0;
	border-radius: 0.25rem;
}
.lecture .student-info dl {
	align-items: center;
	margin-bottom: 0;
}
.lecture .student-info dl dt {
	padding-right: 0.5rem;
}
.lecture .student-info dl dd {
	margin-bottom: 0;
}
.lecture.app-history .card-body dl:last-child {
	margin-bottom: 0.5rem;
}
.lecture.app-history .form-label + .form-check {
	height: calc(2.25rem + 2px);
	left: auto;
	top: 50%;
	transform: translateY(-60%);
}

.lecture.app-history .btn-sm {
	margin-bottom: 1px;
}
@media (min-width: 768px) {
	.lecture.app-history .btn-sm {
		margin-bottom: 0;
	}
}
.lecture.app-history .tab-pane {
	padding: 2rem 1rem;
}

/* .lecture.app-certificate */
.lecture.app-certificate {
}

/* @media (min-width: 768px) {
	.lecture.app-history .student-info dl dt {
		flex: 1 0 100px;
		max-width: 100px;
	}
	.lecture.app-history .student-info dl dd {
		flex: 1 0 calc(100% - 100px);
		max-width: calc(100% - 100px);
	}

} */

/* Top banner */
.top-sub-layout .ly-item:first-child a.top-sub-link-popup::after { display: none; }

.top-banner {
    background-color: #fff;
    background-color: #F9F9F9;
    padding: 0.5rem 0;
    text-align: left;
}
.top-banner .container {
    position: relative;
}
.top-banner .close-btns {
    position: absolute;
    right: 1rem;
    bottom: 0.375rem;
    color: #333;
    display: flex;
    align-items: center;
    z-index: 100;
}
@media (min-width: 1200px) {
    .top-banner .close-btns {
        bottom: -0.125rem;
    }
}
.top-banner .close-btns input:hover,
.top-banner .close-btns label:hover {
    cursor: pointer;
}
.top-banner .owl-carousel {
    position: relative;
}
.top-banner .owl-dots-wrapper {
    position: relative;
    bottom: 0;
    justify-content: flex-start;
    /*
    display: flex;
    align-items: center;
    margin-bottom: 1rem; */
}
.top-banner .top-banner-inner .owl-dots {
    position: absolute;
    left: 0;
    margin-left: 2rem;
    bottom: inherit;
}
.top-banner .owl-carousel .play-pause-btn {
    position: absolute;
    top: 0;
    margin-top: -1rem;
    left: 0;
    color: #333;
    line-height: 1;
    padding: 0;
}
.top-banner .owl-carousel .play-pause-btn > span {
    font-size: 1.3rem;
    line-height: 1;
    text-align: left;
}
.top-banner .top-banner-inner .owl-carousel.owl-drag .owl-item .item {
    background-color: #fff;
    background-color: #F9F9F9;
    display: flex;
    align-items: center;
    position: relative;
    padding: 0.5rem 0;
}

.top-banner .top-banner-inner .owl-carousel.owl-drag .owl-item .item .title {
    font-size: 1.5rem;
}
.top-banner .top-banner-inner .owl-carousel.owl-drag .owl-item .item .text {
    font-size: 1rem;
}

/*
@media (min-width: 576px) {
    .top-banner .top-banner-inner .owl-carousel.owl-drag .owl-item .item {
        padding: 0;
    }
} */
.top-banner .top-banner-inner .owl-carousel.owl-drag .owl-item .item > .col {
    max-width: calc(100% - 5.5rem);
    padding-left: 1rem;
}
.top-banner .top-banner-inner .owl-carousel.owl-drag .owl-item .item [class*='text-'] {
    max-width: 100%;
}
.top-banner .owl-carousel .owl-item img {
    max-width: 4.5rem;
}

@media (min-width: 992px) {
    .top-banner .top-banner-inner .owl-carousel.owl-drag .owl-item .item > .col {
        max-width: calc(100% - 120px);
    }
    .top-banner .top-banner-inner .owl-carousel.owl-drag .owl-item .item [class*='text-'] {
        max-width: 100%;
    }
    .top-banner .owl-carousel .owl-item img {
        max-width: 100px;
    }
}

.top-banner .top-banner-inner .owl-dots .owl-dot,
.top-banner .top-banner-inner .owl-dots .owl-dot.active {
    background-color: transparent;
    font-size: 0;
}
.top-banner .top-banner-inner .owl-dots .owl-dot>span {
    margin: 0;
    width: 100%;
    height: 100%;
    border-color: rgb(var(--point-color-01));
    background-color: rgba(var(--point-color-01), 0.4);
    opacity: 0.4;
}
.top-banner .top-banner-inner .owl-dots .owl-dot.active > span {
    background-color: rgba(var(--point-color-01), 1);
    opacity: 1;




}