html {
}
div,
table,
ul,
ol,
li,
dl,
dt,
dd,
p,
input,
textarea,
select,
img,
h1,
h2,
h3,
h4,
em,
address,
fieldset,
form,
iframe,
object {
    margin: 0;
    padding: 0;
    vertical-align: middle;
}
ul,
ol {
    list-style: none;
}
fieldset,
img {
    border: none;
    vertical-align: middle;
}
a {
    text-decoration: none;
    color: #333;
}
a:link {
    text-decoration: none;
    cursor: pointer;
}
a:visited {
    text-decoration: none;
}
a:hover {
    text-decoration: none;
    color: #008b44;
}
button {
    margin: 0;
    padding: 0;
    border: none;
}
span {
    display: inline-block;
}
:focus {
    outline: 0;
}
body {
    margin: 0;
    padding: 0;
    width: 100%;
    font-family: "맑은 고딕", "Malgun Gothic", Arial, sans-serif;
}
legend {
    display: none;
}

.mt10 {
    margin-top: 10px;
}
.mt30 {
    margin-top: 30px;
}
.mt80 {
    margin-top: 80px;
}
.mb30 {
    margin-bottom: 30px;
}
.ml25 {
    margin-left: 25px;
}
.ml30 {
    margin-left: 30px;
}
.width20 {
    width: 20px;
}
.txt_point {
    font-weight: bold;
    color: #ff3d00 !important;
}
.txt_normal {
    font-weight: bold;
    color: #333 !important;
}
.flex_wrap {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin: 15px 0 15px;
}

/* input_Type */

.select_wrap {
    padding: 10px;
    font-size: 1rem;
}
input[type="radio"] {
    background-color: #008b44;
    color: #fff;
    height: 45px;
    font-size: 1rem;
}
input[type="text"] {
    background-color: #fff;
    color: #333;
    padding: 10px;
    border: 1px solid #999;
    width: 100%;
    height: 45px;
    font-size: 1rem;
}
input[type="checkbox"] {
    background-color: #fff;
    color: #333;
    padding: 10px;
    border: 1px solid #999;
    width: 100%;
    height: 22px;
    font-size: 1rem;
}
input[type="checkbox"]:checked + label {
    background-color: #008b44;
    color: #fff;
}
textarea {
    background-color: #fff;
    color: #333;
    padding: 10px;
    border: 1px solid #999;
    width: 95%;
    height: 100px; /* 높이는 필요에 따라 조정 */
    font-size: 1rem;
    resize: vertical; /* 세로 크기 조정 가능 */
}

textarea:focus {
    border-color: #008b44; /* 포커스 시 테두리 색상 강조 */
    outline: none;
    box-shadow: 0 0 5px rgba(0, 139, 68, 0.5);
}

#wrap_lingvo {
    width: 100%;
    height: 100%;
}

/* header */
#headers {
    width: 100%;
    height: 60px;
    padding: 0px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #008b44;
}

#headers .member {
    margin: 0 40px 0 0;
    color: #fff;
    font-size: 1rem;
}
#headers .member img {
    width: 40px;
}

#headers .logout {
    width: 100px;
    padding: 8px 15px 8px;
    border: 1px solid #fff;
    font-size: 0.9rem;
    margin-left: 20px;
    border-radius: 6px;
    color: #fff;
    letter-spacing: -1;
}
#headers a.logout:hover {
    background-color: #006933;
}
#headers .logo {
    margin: 5px 0 0 40px;
    width: 500px;
}
#headers .logo span {
    color: #fff;
    font-weight: bold;
    font-size: 1.5rem;
}
#headers .logo img {
    width: 42px;
    margin: 0 0 7px;
}

#headersUser {
    width: 100%;
    height: 60px;
    padding: 0px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #3372b1;
}

#headersUser .member {
    margin: 0 40px 0 0;
    color: #fff;
    font-size: 1rem;
}
#headersUser .member img {
    width: 40px;
}

#headersUser .logout {
    width: 100px;
    padding: 8px 15px 8px;
    border: 1px solid #fff;
    font-size: 0.9rem;
    margin-left: 20px;
    border-radius: 6px;
    color: #fff;
    letter-spacing: -1;
}
#headersUser a.logout:hover {
    background-color: #004080;
}
#headersUser .logo {
    margin: 5px 0 0 40px;
    width: 500px;
}
#headersUser .logo span {
    color: #fff;
    font-weight: bold;
    font-size: 1.5rem;
}
#headersUser .logo img {
    width: 42px;
    margin: 0 0 7px;
}

/* Footer */
#footers {
 
    position: fixed; bottom:0; width:100%; height:45px; padding:0px; display:flex; justify-content:center; 
    align-items:center; font-size:0.9rem; margin-left:115px; margin-top: 10px;
}

#container {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

/* LNB */
.LNB_wrap {
    width: 240px;
    min-width: 240px;
    height: 100%;
    background-color: #fff;
    border-right: 1px solid #ddd;
}
.category {
    margin: 0px 0 30px;
}
.cate_step1_1 {
    width: 100%;
    font-weight: bold;
    font-size: 1rem;
    border-bottom: 1px solid #ddd;
}
.cate_step1_1 .tit_over {
    border-left: 4px solid #008b44;
    background-color: #d1e8df;
    padding: 20px 0 20px 0;
    color: #0c8051;
    margin-top: 0;
}
.cate_step1_1 p {
    margin: 15px 0 0 0;
}
.cate_step1_1 p span {
    margin: 0 0 0 10px;
}

.category .over {
    background-color: #e8f3ef;
    width: 100%;
    border-left: 4px solid #008b44;
    padding: 20px 0 20px 0px;
}
.category .over a {
    color: #008b44;
    font-weight: bold;
    padding: 0 0 0 10px;
}
.category .over img {
    padding-right: 10px;
}
.category a.over_s {
    font-weight: bold;
    padding: 0 0 2px 0px; /* 밑줄과 글자 간격 조정 (padding-bottom: 3px) */
    font-size: 1.1rem;
    border-bottom: 1px solid #03160c; /* 밑줄 추가 및 색상 설정 */
}
/* LNB (Blue Theme) */
/* LNB (Blue Theme) */
.LNB_wrap_blue {
    width: 250px;
    min-width: 250px;
    height: 100%;
    background-color: #fff;
    border-right: 1px solid #ddd;
}
.category_blue {
    margin: 0px 0 30px;
}
.cate_step1_1_blue {
    width: 100%;
    font-weight: bold;
    font-size: 1rem;
    border-bottom: 1px solid #ddd;
}
.cate_step1_1_blue .tit_over {
    border-left: 4px solid #0057a3;
    background-color: #d1e8f3;
    padding: 20px 0 20px 0;
    color: #003f7f;
    margin-top: 0;
}
.cate_step1_1_blue p {
    margin: 15px 0 0 0;
}
.cate_step1_1_blue p span {
    margin: 0 0 0 10px;
}

.category_blue .over {
    background-color: #e8f0f7;
    width: 100%;
    border-left: 4px solid #0057a3;
    padding: 20px 0 20px 0px;
}
.category_blue .over a {
    color: #0057a3;
    font-weight: bold;
    padding: 0 0 0 10px;
}
.category_blue .over img {
    padding-right: 10px;
}
.category_blue a.over_s {
    font-weight: bold;
    padding: 0 0 2px 0px; /* 밑줄과 글자 간격 조정 (padding-bottom: 3px) */
    font-size: 1.1rem;
    border-bottom: 1px solid #021b47; /* 밑줄 추가 및 색상 설정 */
}

/*.category  a.over_s {color:#008B44; font-weight:bold; padding:0 0 0 10px; font-size:1.1rem}*/

.cate_step1_2 {
    width: 100%;
    font-weight: bold;
    font-size: 1rem;
    border-bottom: 1px solid #ddd;
    padding: 20px 0 20px 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cate_step1_2 span {
    display: block;
}
.cate_step1_2 img {
    width: 20px;
    vertical-align: middle;
    padding-right: 30px;
}
.category ul {
    width: 100%;
    padding: 15px 0 15px 10px;
}
.category ul li {
    height: 30px;
    font-weight: normal;
    font-size: 0.9rem;
    margin: 0 0 0 20px;
}
.category ul li a {
    width: 100%;
    padding: 10px 10px 10px 0;
    margin-top: 10px;
}
.category ul li a.over {
    width: 100%;
    font-size: 1.2rem;
    font-weight: bold;
    color: #008b44;
}

/* button */
.btn_wrap {
    width: 100%;
    text-align: right;
}
.submit_s {
    padding: 10px 20px 10px;
    background-color: #006933;
    color: #fff;
    border-radius: 6px;
}
a.adress:hover {
    background-color: #006933;
}
.search_s {
    padding: 10px 20px 10px;
    background-color: #999;
    color: #fff;
    border-radius: 6px;
    margin: 5px 0 0 10px;
}
a:hover.search_s {
    background-color: #777;
    color: #fff;
}
a:hover.submit_s {
    background-color: #008b44;
    color: #fff;
}
.btn_wrap_center {
    width: 100%;
    text-align: center;
    display: flex;
    justify-content: center;
    margin: 50px 0 30px;
}
a.submit_ok {
    padding: 15px 60px 15px;
    background-color: #008b44;
    color: #fff;
    border-radius: 6px;
    margin: 0 10px 0;
    font-size: 1.2rem;
}
a:hover.submit_ok {
    background-color: #006933;
    color: #fff;
}
a.submit_cancel {
    padding: 15px 60px 15px;
    background-color: #fff;
    color: #008b44;
    border-radius: 6px;
    margin: 0 10px 0;
    font-size: 1.2rem;
    border: 1px solid #008b44;
}
a:hover.submit_cancel {
    background-color: #e8f3ef;
    color: #008b44;
}
a.btn_s {
    padding: 5px 20px 5px;
    background-color: #fff;
    color: #008b44;
    border-radius: 4px;
    border: 1px solid #008b44;
}
a:hover.btn_s {
    background-color: #e8f3ef;
    color: #008b44;
}

/* button - blue */
a.submit_ok_blue {
    padding: 15px 60px 15px;
    background-color: #3372b1;
    color: #fff;
    border-radius: 6px;
    margin: 0 10px 0;
    font-size: 1.2rem;
}
a.submit_ok_blue:hover {
    color: #fff;
} /* Add this line to keep the text color white on hover */
a.submit_cancel_blue {
    padding: 15px 60px 15px;
    background-color: #fff;
    color: #3372b1;
    border-radius: 6px;
    margin: 0 10px 0;
    font-size: 1.2rem;
    border: 1px solid #3372b1;
}
a:hover.submit_cancel_blue {
    background-color: #e7ecf8;
    color: #3372b1;
}

.btn_blue_s {
    display: inline-block; /* 버튼 형태로 변경 */
    padding: 10px 20px;
    background-color: #3372b1;
    color: #fff;
    border-radius: 6px;
    margin: 5px 0 0 10px;
    text-align: center; /* 텍스트 중앙 정렬 */
    white-space: nowrap; /* 텍스트 줄 바꿈 방지 */
}

/* contents */
.contents_wrap {
    width: 100%;
    height: 100%;
    background: #f4f6fa;
    padding: 0 40px 0;
}
.contents_wrap .title_wrap {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 30px 0 10px;
}
.contents_wrap .title_sub {
    width: 100%;
    font-size: 1.4rem;
    font-weight: bold;
}
.contents_wrap .title_sub2 {
    width: 100%;
    font-size: 1.3rem;
    font-weight: bold;
}

/* table_wrap */
.table_wrap {
    width: 100%;
    margin: 30px 0 30px;
    background-color: #fff;
}
.table_wrap table {
    width: 100%;
    border-top: 3px solid #333;
    border-bottom: 1px solid #333;
}
.table_wrap table th {
    background: #e7ecf8;
    padding: 10px;
    text-align: center;
}
.table_wrap table td {
    padding: 15px 10px 15px;
    text-align: center;
    border-bottom: 1px solid #eee;
}
.table_wrap table td a {
    text-decoration: underline;
    text-underline-offset: 0.2em; /* 밑줄과 텍스트 사이의 간격 설정 */
}

.pageNum {
    width: 100%;
    margin-top: 5px;
    text-align: center;
    margin-bottom: 20px;
}

.pageNum a {
    width: 30px; /* 클릭 가능한 영역 크기 */
    height: 30px;
    line-height: 30px; /* 텍스트를 수직 중앙 정렬 */
    border: 1px solid #999;
    padding: 0; /* 패딩 제거 */
    font-size: 1rem;
    text-align: center;
    text-decoration: none;
    display: inline-block; /* 클릭 가능한 영역 확장 */
    color: #000;
    margin: 2px; /* 링크 간 간격 */
}

.pageNum a.Current {
    background: #008b44;
    color: #fff;
    border: 1px solid #008b44;
    font-weight: bold;
}

.pageNum_blue {
    width: 100%;
    margin-top: 5px;
    text-align: center;
    margin-bottom: 20px;
}

.pageNum_blue a {
    width: 30px; /* 클릭 가능한 영역 크기 */
    height: 30px;
    line-height: 30px; /* 텍스트를 수직 중앙 정렬 */
    border: 1px solid #999;
    padding: 0; /* 패딩 제거 */
    font-size: 1rem;
    text-align: center;
    text-decoration: none;
    display: inline-block; /* 클릭 가능한 영역 확장 */
    color: #000;
    margin: 2px; /* 링크 간 간격 */
}

.pageNum_blue a.Current {
    background: #3372b1;
    color: #fff;
    border: 1px solid #3372b1;
    font-weight: bold;
}

.table_regist {
    width: 100%;
    margin-top: 30px;
    background-color: #fff;
}

.table_regist table {
    width: 100%;
    border-top: 3px solid #333;
    border-bottom: 1px solid #333;
}

.table_regist table th {
    width: 200px;
    min-width: 150px;
    height: 55px;
    background: #e7ecf8;
    padding: 10px;
    text-align: center;
}

.table_regist table td {
    padding: 5px;
    text-align: left;
}

.checkbox-container {
    display: inline-flex; /* 플렉스 박스를 사용해 한 줄로 배치 */
    align-items: center; /* 체크박스와 텍스트의 수직 정렬 */
    white-space: nowrap; /* 텍스트 줄 바꿈 방지 */
    gap: 5px; /* 체크박스와 텍스트 사이 간격 */
}

.checkbox-container input[type="checkbox"] {
    margin: 0; /* 체크박스의 여백 초기화 */
}

.table_regist2 {
    width: 100%;
    margin-top: 5px;
    background-color: #fff;
}
.table_regist2 table {
    width: 100%;
    border-top: 3px solid #333;
    border-bottom: 1px solid #333;
}
.table_regist2 table th {
    height: 45px;
    background: #e7ecf8;
    padding: 15px;
    text-align: center;
}
.table_regist2 table td {
    min-width: 50px;
    padding: 5px;
}

/*popup_Alert*/
.popup_Alert {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10000;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: none;
}
.popup_cont_wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
    width: 600px;
    height: 50%;
    text-align: center;
}
.popup_cont_wrap .title {
    width: 100%;
    height: 30px;
    padding: 15px 0 15px;
    margin-bottom: 20px;
    color: #008b44;
    background-color: #e8f3ef;
    font-size: 1.1rem;
    border-top: 5px solid #008b44;
    font-weight: bold;
}
.popup_cont_wrap a.btn_ok {
    width: 96%;
    margin: 0 auto;
    font-size: 1.2rem;
    padding: 15px 0 15px;
    background-color: #008b44;
    color: #fff;
    border-radius: 6px;
}

.pop_cont {
    width: 96%;
    margin: 30px 0 30px;
    font-size: 1.1rem;
}
.qr_wrap {
    width: 240px;
    height: 240px;
    border: 1px solid #999;
    margin: 0 auto;
    vertical-align: middle;
}
.qr_wrap img {
    width: 239px;
    height: 239px;
}
.popBtn_wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 30px;
    padding: 0px;
    margin-bottom: 9px;
}
.popBtn_wrap a.btn_cancel {
    width: 100%;
    font-size: 1.2rem;
    padding: 15px 0 15px;
    background-color: #aaaaaa;
    display: block;
}

.popBtn_wrap a {
    color: #fff;
}
.popBtn_wrap div {
    width: 100%;
}

/*index*/

.main_contents_wrap {
    background-image: url("../assets/bg_01.png");
    background-size: cover;
    width: 100%;
    height: 100%;
    background-repeat: repeat-y;
}
.box_flex {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.main_contents_wrap .box_wrap {
    margin: 40px;
}
.main_contents_wrap .box_wrap .cols_01_wrap {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.cols_01_l {
    width: 100%;
}
.cols_01_r {
    width: 100%;
    vertical-align: top;
}
.box01_01 {
    width: 100%;
    height: 130px;
    background-color: #9fc54a;
    border-radius: 12px;
    color: #fff;
    margin: 0 15px 15px 0;
    box-shadow: 2px 2px 2px 2px #88c391;
    display: flex;
    justify-content: space-between;
}
.box01_02 {
    width: 100%;
    height: 130px;
    background-color: #43c2a9;
    border-radius: 12px;
    color: #fff;
    margin: 0 15px 15px 0;
    box-shadow: 2px 2px 2px 2px #88c391;
    display: flex;
    justify-content: space-between;
}
.box01_03 {
    width: 100%;
    height: 130px;
    background-color: #387f89;
    border-radius: 12px;
    color: #fff;
    margin: 0 15px 15px 0;
    box-shadow: 2px 2px 2px 2px #88c391;
    display: flex;
    justify-content: space-between;
}
.box01_04 {
    width: 100%;
    height: 130px;
    background-color: #e56e40;
    border-radius: 12px;
    color: #fff;
    margin: 0 15px 15px 0;
    box-shadow: 2px 2px 2px 2px #88c391;
    display: flex;
    justify-content: space-between;
}
.box01_05 {
    width: 98%;
    height: 275px;
    background-color: #fff;
    border-radius: 12px;
    color: #fff;
    margin: 0 0 0 15px;
    box-shadow: 3px 3px 3px 3px #88c391;
    filter: Alpha(Opacity=85);
    opacity: 0.85;
    color: #333;
}

.cols_02_wrap {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 15px 0 0 0;
}
.box02_01 {
    width: 100%;
    height: 275px;
    background-color: #fff;
    border-radius: 12px;
    color: #fff;
    margin: 0 30px 0 0;
    box-shadow: 3px 3px 3px 3px #88c391;
    filter: Alpha(Opacity=85);
    opacity: 0.85;
    color: #333;
}
.box02_02 {
    width: 100%;
    height: 275px;
    background-color: #fff;
    border-radius: 12px;
    color: #fff;
    margin: 0;
    box-shadow: 3px 3px 3px 3px #88c391;
    filter: Alpha(Opacity=85);
    opacity: 0.85;
    color: #333;
}

.cols_03_wrap {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 15px 0 0 0;
}
.box03_01 {
    width: 100%;
    height: 275px;
    background-color: #fff;
    border-radius: 12px;
    color: #fff;
    margin: 0 30px 0 0;
    box-shadow: 3px 3px 3px 3px #88c391;
    filter: Alpha(Opacity=85);
    opacity: 0.85;
    color: #333;
}
.box03_02 {
    width: 100%;
    height: 275px;
    background-color: #fff;
    border-radius: 12px;
    color: #fff;
    margin: 0;
    box-shadow: 3px 3px 3px 3px #88c391;
    filter: Alpha(Opacity=85);
    opacity: 0.85;
    color: #333;
}

.cols_01_l .icon {
    width: 77px;
    margin: 25px 0 25px 15%;
}
.cols_01_l .title {
    margin: 25px 25px 0 0;
    text-align: right;
    font-size: 16pt;
}
.cols_01_l .value {
    margin: 0 25px 0 0;
    text-align: right;
    font-size: 34pt;
    font-weight: bold;
}

.title_2 {
    padding: 25px 0 0 25px;
    font-size: 16pt;
    font-weight: bold;
    color: #000;
}
.chart {
    width: 94%;
    height: 190px;
    margin: 5px 25px 25px 25px;
    border: 2px solid #eee;
    border-radius: 12px;
    text-align: center;
}
.date {
    width: 150px !important;
    text-align: center;
}
.id_check {
    width: 320px !important;
    text-align: center;
}
.text_XL {
    width: 400px !important;
    text-align: center;
}
.text_L {
    width: 320px !important;
    text-align: center;
}
.text_M {
    width: 200px !important;
    text-align: center;
}
.text_S {
    width: 100px !important;
    text-align: center;
}

input[type="text"].text_80 {
    width: 80px !important;
}
input[type="text"].text_90 {
    width: 90px !important;
}
input[type="text"].text_100 {
    width: 100px !important;
}
input[type="text"].text_200 {
    width: 200px !important;
}
input[type="text"].text_150 {
    width: 150px !important;
}
input[type="text"].text_300 {
    width: 300px !important;
}
input[type="text"].text_400 {
    width: 400px !important;
}
input[type="text"].text_500 {
    width: 500px !important;
}
input[type="text"].text_600 {
    width: 600px !important;
}
input[type="text"].text_700 {
    width: 700px !important;
}
input[type="text"].text_800 {
    width: 800px !important;
}
input[type="text"].text_900 {
    width: 900px !important;
}

ul.contact_list {
    width: 400px;
}
ul.contact_list li {
    float: left;
    width: 33%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background-color: #f0f0f0;
    border-bottom: 2px solid #fff;
}

.red-text {
    color: red;
}
.red-text a {
    color: red;
}

/* 커스텀 모달팝업 Start  */

.popup-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* 어두운 배경 */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000; /* 항상 위에 표시 */
}

.consultation-popup {
    background: white;
    padding: 20px;
    border-radius: 8px;
    text-align: center;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
    width: 450px;
}

.consultation-popup2 {
    background: white;
    padding: 20px;
    border-radius: 8px;
    text-align: left;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
    width: 550px;
}

.consultation-popup p {
    font-size: 16px;
    margin-bottom: 20px;
    color: #333;
}

/* 테이블 스타일 */
.info-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
}

.info-table th,
.info-table td {
    border: 1px solid #ccc;
    padding: 10px;
    text-align: left;
}

.info-table th {
    width: 30%;
    background-color: #f9f9f9;
    font-weight: bold;
}

.info-table td {
    width: 70%;
}

.info-table input[type="text"] {
    width: 100%;
    padding: 8px;
    box-sizing: border-box;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* 버튼 스타일 */
.btn_blue_s {
    display: inline-block;
    padding: 10px 20px;
    background-color: #3372b1;
    color: #fff;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    font-size: 14px;
}

.btn_blue_s:hover {
    background-color: #285a8e; /* 버튼 호버 효과 */
}

.popup-button-container {
    display: flex;
    justify-content: center; /* 버튼들을 중앙에 정렬 */
    margin-top: 20px; /* 버튼 위에 여백 추가 */
}

.popup-button-container .btn_blue_m {
    flex: none; /* 버튼들이 동일한 크기를 가지지 않도록 설정 */
    width: 45%; /* 버튼의 너비를 45%로 설정하여 div 사이즈와 동일하지 않도록 설정 */
    margin: 0 5px; /* 버튼 사이에 여백 추가 */
}

/* 커스텀 모달팝업 End  */

/* 버튼 스타일 */

.btn_blue_m {
    display: inline-block;
    padding: 8px 16px;
    background-color: #3372b1;
    color: #fff;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    font-size: 14px;
}

.btn_blue_l {
    display: inline-block;
    padding: 10px 20px;
    background-color: #3372b1;
    color: #fff;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    font-size: 16px;
}

.btn_blue_xl {
    display: inline-block;
    padding: 12px 24px;
    background-color: #3372b1;
    color: #fff;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    font-size: 18px;
}

.btn_blue_xxl {
    display: inline-block;
    padding: 14px 28px;
    background-color: #3372b1;
    color: #fff;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    font-size: 20px;
}

.btn_blue_s:hover,
.btn_blue_m:hover,
.btn_blue_l:hover,
.btn_blue_xl:hover,
.btn_blue_xxl:hover {
    background-color: #285a8e; /* 버튼 호버 효과 */
}

.negative-price {
    color: red;
    font-weight: bold;
}

.zero-price {
    color: green;
    font-weight: bold;
}

.notice-box {
    border: 1px solid #ccc;
    padding: 10px;
    margin-top: 20px;
    background-color: #e7ecf8; /* 연한 푸른색 */
    font-size: 0.8rem; /* 글자 크기를 조금 작게 설정 */
    width: 100%;
    font-size: 1.1rem;
}

a.notice-button {
    padding: 10px 20px; /* 패딩 설정 */
    background-color: #e46b18; /* 배경색 설정 */
    color: #fff; /* 글자색 설정 */
    border-radius: 12px; /* 양쪽 모서리를 둥글게 설정 */
    margin: 0 10px; /* 마진 설정 */
    font-size: 1rem; /* 글자 크기 설정 */
    border: 1px solid #e46b18; /* 테두리 설정 */
    display: inline-block; /* 인라인 블록 설정 */
    width: auto; /* 너비를 글자 크기에 맞게 자동 설정 */
    min-width: 100px; /* 최소 너비 설정 */
    box-sizing: border-box; /* 패딩과 테두리를 포함한 너비 계산 */
}
.notice-box a {
    font-weight: bold;
}
a:hover.notice-button {
    background-color: #d65a16; /* 호버 시 배경색 설정 */
    color: #fff; /* 호버 시 글자색 설정 */
}

 /* <br>의 기본 높이(약 20px)의 절반 정도 */
.spacer {
  display: block;
  height: 10px;  
  width: 100%;
  background: transparent;
  margin: 0;
  padding: 0;
}

/* 추가된 모바일 스타일 */
@media (max-width: 480px) {
  .cate_step1_1_blue .tit {
    display: none; /* 모바일 환경에서 tit 숨김 */
  }
  .category {
    padding: 0 5px; /* 좌우 여백 최소화 */
  }
}