@charset "UTF-8";

/* 폰트명 : 마루부리
출처 : https://wess.tistory.com/223 */


@font-face {
  font-family: 'MaruBuri';
  font-weight: 100;
  font-style: normal;
  src: url(https://cdn.jsdelivr.net/gh/webfontworld/naver/MaruBuri-ExtraLight.woff2) format('woff2');
  font-display: swap;
}
@font-face {
  font-family: 'MaruBuri';
  font-weight: 300;
  font-style: normal;
  src: url(https://cdn.jsdelivr.net/gh/webfontworld/naver/MaruBuri-Light.woff2) format('woff2');
  font-display: swap;
}
@font-face {
  font-family: 'MaruBuri';
  font-weight: 400;
  font-style: normal;
  src: url(https://cdn.jsdelivr.net/gh/webfontworld/naver/MaruBuri-Regular.woff2) format('woff2');
  font-display: swap;
}
@font-face {
  font-family: 'MaruBuri';
  font-weight: 500;
  font-style: normal;
  src: url(https://cdn.jsdelivr.net/gh/webfontworld/naver/MaruBuri-SemiBold.woff2) format('woff2');
  font-display: swap;
}
@font-face {
  font-family: 'MaruBuri';
  font-weight: 700;
  font-style: normal;
  src: url(https://cdn.jsdelivr.net/gh/webfontworld/naver/MaruBuri-Bold.woff2) format('woff2');
  font-display: swap;
}

/* 폰트명 : Noto Sans KR
https://fonts.google.com/selection/embed */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap');


/* color */
.mgs-primary-color {color:#f28e0d !important;}
.mgs-secondary-color {color:#4EA187;}
.mgs-w-color {color:#fff !important;}

/* background-color */
.mgs-primary-back-color {background-color: #f28e0d !important; color:#fff;}
.mgs-foot-back-color {background-color: #295443; color:#fff !important;}

/* font-family */

/* 마루부리 */
.font-maru-400 {
  font-family: 'MaruBuri';
  font-weight: 400;
  font-style: normal;
  letter-spacing: -1px;
}

.font-maru-500 {
  font-family: 'MaruBuri';
  font-weight: 500;
  font-style: normal;
  letter-spacing: -1px;
}

.font-maru-700 {
  font-family: 'MaruBuri';
  font-weight: 700;
  font-style: normal;
  letter-spacing: -1px;
}


/* font Size */
.font-16 {font-size: 16px !important;}
.font-18 {font-size: 18px !important;}
.font-20 {font-size: 20px !important;}
.font-24 {font-size: 24px !important;}
.font-26 {font-size: 26px !important;}

/* margin */
.mg-r-5 {margin-right: 5px;}
.mg-r-10 {margin-right: 10px;}
.mg-b-0 {margin-bottom: 0 !important;}

/* padding */
.pd-lt-5 {padding-left: 5px;}
.pd-r-5 {padding-right: 5px;}
.pd-r-10 {padding-right: 10px;}

/* button */
.mgs-btn-primary {display: inline-block; min-width: 120px; border-radius: 8px; background-color: #f28e0d !important; color:#fff !important; border:0; padding: 8px; text-align: center;}
.mgs-btn-outline {min-width: 120px; border-radius: 8px; background-color: #fff; color:#f28e0d; border:2px solid #f28e0d; padding:8px !important;}


/* etc */
.line-h-18 {line-height: 18px;}
.line-h-30 {line-height: 30px;}
.letter-spc-10 {letter-spacing: 1px !important;}
.mgs-border-rdu-12 {border-radius: 12px !important;}



.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus, .pagination .page-item.active .page-link {
  background-color: #f28e0d !important;
  border-color: #f28e0d !important;
}
.pagination>li>a,.pagination>li>a:hover {color:#f28e0d !important;}



.color-bar-container {
 display: flex;
 justify-content: flex-end;
 width: 100%;
 margin: 5px 0;
}

.color-bar {
 width: 100px;
 height: 57px;
 transition: width 0.3s ease;
 border-top-left-radius: 40px;
 border-bottom-left-radius: 40px;
 display: flex;
 align-items: center;
 padding-left: 10px;
 color: white;
 font-size:17px;
 text-shadow: #000 2px 0 5px;
 font-weight: bold;
 overflow: hidden;
 white-space: nowrap;
}


.header-container .header-nav .nav li > a {
  text-transform: none !important;
  font-size: 18px !important;
}

.header-container .header-nav .nav li .dropdown-menu a {
  font-size: 1em !important;
}

#header .header-nav.header-nav-links nav>ul li:hover>a {
  color:#bea698 !important;
}

.header-line_bt {border-bottom: 1px solid #c1c1c1;}

.btn-custom-orange {
    color: #fff; /* White text */
	text-decoration:none;
    background-color: #f28e0d;
    border: none;
    border-color: #f28e0d;
    border-radius: 8px;
    padding: 7px 30px;
    font-weight: bold;
    transition: background-color 0.3s ease;
    text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5); /* Add text shadow for better visibility */
	box-shadow: none;
}

.btn-custom-orange:hover {
    color: #fff;
	text-decoration:none;
    background-color: #f28e0d; /* Slightly darker shade for hover effect */
    border-color: #f28e0d;
}

.btn-custom-orange:focus, .btn-custom-orange.focus {
    color: #fff;
    outline: none;
	text-decoration:none;
    background-color: #f28e0d;
    border-color: #f28e0d;
	box-shadow: none;
    /*box-shadow: 0 0 0 0.25rem rgba(255, 171, 98, 0.5);*/
}

.btn-custom-orange:active, .btn-custom-orange.active,
.show > .btn-custom-orange.dropdown-toggle {
    color: #fff;
	text-decoration:none;
    background-color: #f28e0d; /* Even darker shade for active state */
    border-color: #f28e0d;
}

.btn-custom-orange:active:focus, .btn-custom-orange.active:focus,
.show > .btn-custom-orange.dropdown-toggle:focus {
    color: #fff;
    background-color: #d77a03;
    /*box-shadow: 0 0 0 0.25rem rgba(255, 171, 98, 0.5);*/
}
/* .font-ct {
  font-size: 1em !important;
} */

.btn-custom-orange-outline {
    color: #f28e0d;
	text-decoration:none;
	border:1px #f28e0d solid;
    padding: 7px 30px;
    border-radius: 8px;
    transition: background-color 0.3s ease;
    background-color: transparent;
}

.btn-custom-orange-outline:hover {
    color: #f28e0d;
    background-color: transparent;
    border-color: #FF8F38;
}

.btn-custom-orange-outline:focus, .btn-custom-orange-outline.focus {
    color: #f28e0d;
    background-color: transparent;
}

.btn-custom-orange-outline:active, .btn-custom-orange-outline.active,
.show > .btn-custom-orange-outline.dropdown-toggle {
    color: #f28e0d;
    background-color: #fff;
    border-color: #f28e0d;
    /* text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); */
}

.btn-custom-orange-outline:active:focus, .btn-custom-orange-outline.active:focus,
.show > .btn-custom-orange-outline.dropdown-toggle:focus {
    color: #fff;
    background-color: #f28e0d;
}

p {word-break: keep-all;}
span {word-break: keep-all;}

.dropdown-menu li:hover span {
	color:#ff9D4D;
}