@charset "UTF-8"; 
/* 초기화 및 초기 세팅 */
:root {
    /* 버튼 및 인풋 폼 높이 세팅 */
	
	--body_width:57.6rem;
    --hd_height: 9rem;
    --hd_height_m: 5.6rem;
    --height_sm: 2.8rem;
    --height_md: 3.8rem;
    --height: 4.8rem;
    --height_lg: 5.6rem;
    --ic_date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Crect width='256' height='256' fill='none'/%3E%3Crect x='40' y='40' width='176' height='176' rx='8' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='16'/%3E%3Cline x1='176' y1='24' x2='176' y2='56' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='16'/%3E%3Cline x1='80' y1='24' x2='80' y2='56' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='16'/%3E%3Cline x1='40' y1='88' x2='216' y2='88' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='16'/%3E%3Ccircle cx='128' cy='132' r='12'/%3E%3Ccircle cx='172' cy='132' r='12'/%3E%3Ccircle cx='84' cy='172' r='12'/%3E%3Ccircle cx='128' cy='172' r='12'/%3E%3Ccircle cx='172' cy='172' r='12'/%3E%3C/svg%3E");
    --ic_time:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Crect width='256' height='256' fill='none'/%3E%3Ccircle cx='128' cy='128' r='96' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='16'/%3E%3Cpolyline points='128 72 128 128 184 128' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='16'/%3E%3C/svg%3E");
	--ic_send:  url("data:image/svg+xml,%3Csvg width='36' height='36' viewBox='0 0 36 36' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_1656_12716)'%3E%3Cpath d='M15.6657 20.3503L22.4508 33.7998L30.2 5.81934L15.6657 20.3503Z' fill='%23F8C327'/%3E%3Cpath d='M2.19996 13.549L15.6495 20.334L30.1804 5.7998L2.19996 13.549Z' fill='%23F2A20E'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1656_12716'%3E%3Crect width='28' height='28' fill='white' transform='matrix(-1 0 0 1 30.2 5.7998)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}

/*스크롤 스타일*/
div::-webkit-scrollbar {
    width: 0.4rem;
    height: 0.4rem;
}
div::-webkit-scrollbar-thumb {
    background-color:rgba(0,0,0,0.04);
    border-radius: 100px;
}


html { font-size:10px; } 
body { margin:0 auto; padding:0;} 

html, h1, h2, h3, h4, h5, h6, form, fieldset, img { margin:0; padding:0; border:0 } 
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block } 

ul, dl,dt,dd { margin:0; padding:0; list-style:none } 
legend { position:absolute; margin:0; padding:0; font-size:0; line-height:0; text-indent:-9999em; overflow:hidden } 
label, input, button, select, img { vertical-align:middle; } 
input, button { margin:0; padding:0;} 
input[type="submit"] {cursor:auto;} 
button {cursor: auto;word-break: keep-all;} 
select {margin:0} 
p { margin:0; padding:0;} 
hr { display:none } 
a { text-decoration:none;} 
a:hover { text-decoration: none; } 
.un_reboot_a { color: var(--text); text-decoration: underline; } 
*, :after, :before { 
	-webkit-box-sizing:border-box; 
	-moz-box-sizing:border-box; 
	box-sizing:border-box;
	word-break: normal;
	word-wrap: break-word;
 } 

img { max-width:100%; display:inline-block; height: auto; } 
.container-fluid {max-width: 2560px;}
.mobile_wr {
    /*border-left: 1px solid #F2F2F2;
    border-right: 1px solid #F2F2F2;*/
	box-sizing: content-box;
	min-height: calc(100vh - 5.6rem);
}

 /*메인*/
.idx_pg {min-height:100vh;padding-bottom: 5.0rem;}
.curs_pointer{cursor: pointer;}


/*서브*/
.sub_tit { position: relative; } 
.sub_pg {position: relative;padding-bottom: 5.0rem;} 

.over_hidden{overflow:hidden;}
.text_dynamic{ white-space: pre-line;}

.text-red{color:var(--red);}
.text-gray{color:var(--gray);}
.text-gray-50{color:var(--gray-50);}
.text-gray-100{color:var(--gray-100);}
.text-gray-200{color:var(--gray-200);}
.text-gray-300{color:var(--gray-300);}
.text-gray-400{color:var(--gray-400);}
.text-gray{color:var(--gray);}
.text-gray-600{color:var(--gray-600);}
.text-gray-700{color:var(--gray-700);}
.text-gray-800{color:var(--gray-800);}
.text-gray-900{color:var(--gray-900);}
.text-primary-100{color:var(--primary-100);}
.text-primary-200{color:var(--primary-200);}
.text-primary{color:var(--text-primary);}
.text-primary-400{color:var(--primary-400);}
.text-primary-500{color:var(--primary-500);}
.text-primary-600{color:var(--primary-600);}
.text-primary-700{color:var(--primary-700);}
.text-primary-800{color:var(--primary-800);}
.text-primary-900{color:var(--primary-900);}
.text-black{color:#000;}



.bg-black{background:#000;}
.bg-gray-50{background:var(--gray-50);}
.bg-gray-100{background:var(--gray-100);}
.bg-gray-200{background:var(--gray-200);}
.bg-gray-300{background:var(--gray-300);}
.bg-gray-400{background:var(--gray-400);}
.bg-gray{background:var(--gray);}
.bg-gray-600{background:var(--gray-600);}
.bg-gray-700{background:var(--gray-700);}
.bg-gray-800{background:var(--gray-800);}
.bg-gray-900{background:var(--gray-900);}


.bg-primary-50{background:var(--primary-50);}
.bg-primary-100{background:var(--primary-100);}
.bg-primary-200{background:var(--primary-200);}
.bg-primary{background:var(--bg-primary);}
.bg-primary-400{background:var(--primary-400);}
.bg-primary-500{background:var(--primary-500);}
.bg-primary-600{background:var(--primary-600);}
.bg-primary-700{background:var(--primary-700);}
.bg-primary-800{background:var(--primary-800);}
.bg-primary-900{background:var(--primary-900);}

.border-50{border-color:var(--border-50) !important;}
.border-200{border-color:var(--border-200) !important;}



.num_list ul {list-style: decimal-leading-zero;padding-left: 2.5rem;}
.num_list li {line-height: 1.4em;margin-bottom: 0.5rem; word-break: keep-all;white-space: pre-line;}
.dot_list li {list-style: none;margin-bottom:0.5rem;display: flex;word-break: keep-all;line-height: 140%;}
.dot_list li *{word-break: keep-all;}
.dot_list li:before {content:"-";vertical-align:middle;margin-right:0.5rem;}
.dot_list li:last-child{margin-bottom:0;}


.line_h1 { line-height:1.0em; } 
.line_h1_1 { line-height:1.1em; } 
.line_h1_2 { line-height:1.2em; } 
.line_h1_3 { line-height:1.3em !important; } 
.line_h1_4 { line-height:1.4em !important; } 
.line_h1_5 { line-height:1.5em !important; } 
.line_h1_6 { line-height:1.6em !important; } 
.line_h1_7 { line-height:1.7em; } 
.line_h1_8 { line-height:1.8em; } 
.line_h1_9 { line-height:1.9em; } 
.line_h2 { line-height:2.0em; } 


/*폰트커스텀 기본사이즈 10px*/

.tit_h1 {font-size: 2.8rem; font-weight: 700; color: #000;line-height: 1.286;}
.tit_h2 {font-size: 2.6rem; font-weight: 700; color:#000;line-height: 1.385;} 
.tit_h3 {font-size: 2.0rem; font-weight: 700; color:#000;line-height: 1.6;}
.tit_h4 {font-size: 1.8rem; font-weight: 700; color:#000;line-height: 1.444;} 
.tit_h5 {font-size: 1.6rem; font-weight: 600; color:#000;line-height: 1.5;} 

.body_small{font-size: 1.4rem;line-height: 1.715;}


.fs_8 { font-size: 0.8rem; } 
.fs_9 { font-size: 0.9rem; } 
.fs_10 { font-size: 1.0rem; } 
.fs_11 { font-size: 1.1rem !important; } 
.fs_12 { font-size: 1.2rem !important; } 
.fs_13 { font-size: 1.3rem !important; } 
.fs_14 { font-size: 1.4rem !important; } 
.fs_15 { font-size: 1.5rem !important; } 
.fs_16 { font-size: 1.6rem !important; } 
.fs_17 { font-size: 1.7rem !important; } 
.fs_18 { font-size: 1.8rem !important; } 
.fs_19 { font-size: 1.9rem !important; } 
.fs_20 { font-size: 2.0rem !important; } 
.fs_21 { font-size: 2.1rem !important; } 
.fs_22 { font-size: 2.2rem; } 
.fs_23 { font-size: 2.3rem; } 
.fs_24 { font-size: 2.4rem; } 
.fs_25 { font-size: 2.5rem; } 
.fs_26 { font-size: 2.6rem; } 
.fs_27 { font-size: 2.7rem; } 
.fs_28 { font-size: 2.8rem; } 
.fs_29 { font-size: 2.9rem; } 
.fs_30 { font-size: 3.0rem; } 
.fs_31 { font-size: 3.1rem; } 
.fs_32 { font-size: 3.2rem; } 
.fs_33 { font-size: 3.3rem; } 
.fs_34 { font-size: 3.4rem; } 
.fs_35 { font-size: 3.5rem; } 
.fs_36 { font-size: 3.6rem; } 
.fs_37 { font-size: 3.7rem; } 
.fs_38 { font-size: 3.8rem; } 
.fs_39 { font-size: 3.9rem; } 
.fs_40 { font-size: 4.0rem; } 
.fs_41 { font-size: 4.1rem; } 
.fs_42 { font-size: 4.2rem; } 
.fs_43 { font-size: 4.3rem; } 
.fs_44 { font-size: 4.4rem; } 
.fs_45 { font-size: 4.5rem; } 
.fs_46 { font-size: 4.6rem; } 
.fs_47 { font-size: 4.7rem; } 
.fs_48 { font-size: 4.8rem; } 
.fs_49 { font-size: 4.9rem; } 
.fs_50 { font-size: 5.0rem; } 
.fs_51 { font-size: 5.1rem; } 
.fs_52 { font-size: 5.2rem; } 


.fw_100 { font-weight: 100; } 
.fw_200 { font-weight: 200; } 
.fw_300 { font-weight: 300; } 
.fw_400 { font-weight: 400; } 
.fw_500 { font-weight: 500; } 
.fw_600 { font-weight: 600; } 
.fw_700 { font-weight: 700; } 
.fw_800 { font-weight: 800; } 
.fw_900 { font-weight: 900; }


.wh_pre { white-space: pre-line; } 
.wh_nowrap { white-space: nowrap; }

.break_all{word-break: break-all;}
.keep_all{word-break: keep-all;word-wrap: break-word;}

/*글자 줄임말/자르기*/
.line_text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; word-break: break-all;word-break: break-all;} 
.line1_text { white-space: normal; overflow: hidden; text-overflow: ellipsis;word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;word-break: break-all;} 
.line2_text { white-space: normal; overflow: hidden; text-overflow: ellipsis;word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;word-break: break-all;} 
.line3_text { white-space: normal; overflow: hidden; text-overflow: ellipsis;word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;word-break: break-all;} 


/* 폼 사각형 */
.sq_guide { display:flex; flex-wrap: wrap; } 
.sq_guide li { 
	width: 103px; 
	height: 35px; 
	border-radius: 0.5rem; 
	display: flex; 
	align-items: center; 
	justify-content: center; 
	font-size: 1.2rem; 
	margin: 0.2rem;
 }

/* 스크롤바 none */
.scroll_bar_none { -ms-overflow-style: none; } 
.scroll_bar_none::-webkit-scrollbar { display: none; }


/*테이블 반응형때*/
.touch_scroll { overflow-x: auto; overflow-y: hidden;}



/* 버튼 */
.btn{height: var(--height);display: inline-flex;justify-content: center; align-items: center;border-radius: 1.2rem;font-size: 1.6rem;font-weight:600;word-break: keep-all;} 
.btn-sm{height: var(--height_sm);border-radius: 0.8rem;font-size: 1.2rem;padding-left:1.0rem;padding-right:1.0rem; font-weight: 500;} 
.btn-md{ height: var(--height_md);border-radius: 1.0rem;font-weight: 500;font-size: 1.5rem;}
.btn-lg{ height: var(--height_lg);font-weight:700;font-size: 1.6rem;padding: 0.5rem 2rem;} 
.btn-link{height:auto;padding:0;cursor: pointer;display: flex;align-items: center;border-radius: 0;background: transparent;flex-shrink: 0;border: 0;font-weight: 500;}
.btn-icon{height:auto;padding:0;cursor: pointer;display: flex;align-items: center;border-radius: 0;background: transparent;flex-shrink: 0;border: 0;}
.btn-icon img{flex-shrink: 0;}


.btn-naver{background:#00CD4C;border-color:#00CD4C;color:#fff;}
.btn-naver:hover, .btn-naver:focus{background:#1ABB00;border-color:#1ABB00;}

.btn-kakao{background:#FEE404;border-color:#FEE404;color:#333;}
.btn-kakao:hover, .btn-kakao:focus{background:#FFCC00;border-color:#FFCC00;}

.btn-apple{background:#fff;border-color:var(--border);color:#000;}
.btn-apple:hover, .btn-apple:focus{background:#fff;border-color:var(--border-200);}

.btn-google{background:#fff;border-color:var(--border);color:#000;}
.btn-google:hover, .btn-google:focus{background:#fff;border-color:var(--border-200);}



.btn.disabled, .btn:disabled {
    opacity: 1;
    color: var(--gray-400) !important;
    background: var(--gray-200);
    border-color: var(--gray-200);
}
.btn-outline-light.active {
	color: var(--secondary);
    background-color: #fff;
}

.btn-group-toggle .btn-outline-light:not(:disabled):not(.disabled).active, .btn-group-toggle .show > .btn-outline-light.dropdown-toggle {
	color: #000;
    background-color: #fff;
    border-color: #000;
}
.btn-group-toggle .btn-light:not(:disabled):not(.disabled).active, .btn-group-toggle .show > .btn-light.dropdown-toggle {
    color: #fff;
    background-color: #000;
    border-color: #000;
}
.btn-group-toggle .btn-light:not(:disabled):not(.disabled).active img, .btn-group-toggle .show > .btn-light.dropdown-toggle img{filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(65deg) brightness(240%) contrast(103%);}

.btn-group-toggle .btn input[type=radio], .btn-group-toggle .btn input[type=checkbox], .btn-group-toggle .btn-group .btn input[type=radio], .btn-group-toggle .btn-group .btn input[type=checkbox] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
}




.btn-group-full{display:flex;}
.btn-group-full .btn{display:flex;padding-left:0.4rem;padding-right:0.4rem;}

.btn_toggle_primary .btn-outline-light{border-color:#D6DAE5;}
.btn_toggle_primary .btn-outline-light:not(:disabled):not(.disabled).active{color: var(--primary);background-color: #fff;border-color: var(--primary);font-weight:600;}

.btn-group-wrap{display:flex;flex-wrap: wrap;}
.btn-group-wrap .btn{margin-bottom:0.8rem !important;margin-right:0.6rem;flex-shrink: 0;}
.btn-group-wrap .btn:last-child{margin-right:0;}

.keyword_badge_wr{gap: 0.8rem;}
.keyword_badge{
   display: flex;
   justify-content: center;
   align-items: center;
   flex-shrink: 0;
   padding:0;
}
.keyword_badge .btn{ height: 100%;font-size: 1.5rem;}
.keyword_badge .btn-link{padding-left:1.3rem;margin-right: 0.2rem;}
.keyword_badge .btn-icon{padding-right:1.0rem;}
.keyword_badge .btn *{white-space: normal; overflow: hidden; text-overflow: ellipsis;word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;word-break: break-all;}


/* 인풋 자동완성 초기화 */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	-webkit-text-fill-color: var(--text);
    -webkit-box-shadow: 0 0 0px 1000px var(--bg) inset;
    box-shadow: 0 0 0px 1000px var(--bg) inset;
    transition: background-color 5000s ease-in-out 0s;
}

input:autofill,
input:autofill:hover,
input:autofill:focus,
input:autofill:active {
	-webkit-text-fill-color: var(--text);
    -webkit-box-shadow: 0 0 0px 1000px var(--bg) inset;
    box-shadow: 0 0 0px 1000px var(--bg) inset;
    transition: background-color 5000s ease-in-out 0s;
}

/* 입력 인풋 */
.form-control {height: var(--height);} 
.form-control-sm {height: var(--height_sm);border-radius: 0.8rem;font-size:1.2rem;} 
.form-control-md {height: var(--height_md);border-radius: 1.0rem;font-size:1.5rem;} 
.form-control-lg {height: var(--height_lg);}
.form-control-auto {height: auto;}



input.form-control{white-space: nowrap; overflow: hidden; text-overflow: ellipsis; word-break: break-all;}

.ip_wr .ip_tit { margin-bottom:1.0rem;} 
.ip_tit h5 {
    font-size: 1.6rem;
	line-height: 1.4;
    font-weight: 600;
    display: inline-block;
    position: relative;
    color: #000;
    word-break: keep-all;
}
.ip_tit.required h5::after{ content: "*";font-size:1.4rem;position: absolute;color: var(--primary-400);top: 0; right: -1.2rem;}
.ip_wr .form-row .col-3{max-width: 10rem;}
.ip_wr .btn-group-toggle{margin-bottom: -0.8rem;}
.ip_wr .btn-group-toggle .btn {
    margin-bottom: 0.8rem;
}

.form-password{position:relative;}
.form-password .form-control{padding-right:5.0rem;}
.form-password .pw_icon {
    width: 2.5rem;
    height: 2.5rem;
    border: 0;
    background: transparent;
    padding: 0;
    position: absolute;
    right: 1.5rem;
    top: 50%;
    transform: translateY(-50%);
}


/* form-text */
.form-text {
    display: none;
    margin-top: 0.8rem;
    font-size: 1.4rem;
    line-height: 1.5;
    font-weight: 300;
	color:#999DA5;
}
.ip_valid .ip_valid{display: flex; color: var(--success);}
.ip_invalid .ip_invalid{display: flex; color: var(--danger);}



/*.form-row*/
.form-row{margin-left:-0.5rem;margin-right:-0.5rem;}
.form-row > .col, .form-row > [class*=col-]{padding-left:0.5rem;padding-right:0.5rem;}

/* textarea 높이 */
textarea {resize: none;}
textarea.form-control{ min-height: 15rem; padding: 1.5rem 1.5rem; line-height: 140%;word-break: keep-all;}

.form-control textarea{min-height: 14rem; padding: 0; line-height: 130%;border:0;width:100%;}
.form-control textarea:focus {
  color: var(--text);
  background-color: var(--bg);
  border-color: var(--gray);
  outline: 0;
  box-shadow: 0 0 0 0 var(--border);
}
.form-control textarea::placeholder {
  color: var(--input_placeholder);
  opacity: 1;
}
.form-control textarea:disabled, .form-control textarea[readonly] {
  background-color: var(--input_disabled);
  opacity: 1;
}

/* 셀렉트 박스 */
.custom-select, .custom-select2 {
    padding-right: 3.3rem;
	background-repeat:no-repeat;
	background-position:center right 1.5rem;
	background-size:1.6rem;
	background-color: #fff;
	border-color: var(--border);
    padding-left: 1.5rem;
    /*font-size: 1.6rem;*/
    font-weight: 400;
    color: #000;
	text-align: left;
	position:relative;
	line-height: 1.25;
}
.custom-select{background-image: url(/static/img/user/ic_fold.png);}
.custom-select:focus {border-color: var(--border-200);}
.custom-select2:after{content:'';display:block;width:1.6rem;height:1.6rem;background: url(/static/img/user/ic_fold.png)no-repeat center center;background-size:1.6rem;position:absolute;right:1.5rem;top:50%;transform: translateY(-50%);}


/*.custom-select2[aria-expanded="true"]{border-radius:1.2rem 1.2rem 0 0;border-color: var(--border-200);background: #fff;}
.custom-select2[aria-expanded="true"]:after{transform: translateY(-50%) rotate(180deg);}
.custom-select2 + .dropdown-menu{min-width: 100%;margin: -1px 0 0;border-color:var(--border-200);font-size: 1.6rem;border-radius: 0 0 1.2rem 1.2rem;max-width: 100%;box-shadow: none;}
.custom-select2 + .dropdown-menu a{padding:1.0rem 1.5rem;white-space: break-spaces;word-break: break-all;}
.custom-select2 + .dropdown-menu a:hover{color: var(--primary-700);background: var(--light);}*/


/* 날짜 선택 */
input.form-control[type="date"], input.form-control[type="time"]{position: relative;}
input.form-control[type="date"]::-webkit-calendar-picker-indicator, input.form-control[type="time"]::-webkit-calendar-picker-indicator{
    -webkit-appearance: none;
    background: none;
    width: 100%; height: 100%; cursor: pointer;
    position: absolute; left: 0; top: 0; 
}
input.form-control[type="date"]::before, input.form-control[type="time"]::before{
    content: ''; display: block; width: 2.5rem; height: 2.5rem; position: absolute; top: 50%;
    transform: translateY(-50%); right: 1.6rem; background: var(--gray); cursor: pointer; 
    -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain;
}
input.form-control[type="time"]::before{
    -webkit-mask: var(--ic_time); mask: var(--ic_time);       
}
input.form-control[type="date"]::before{
    -webkit-mask: var(--ic_date); mask: var(--ic_date);
}


input.form-control.no-icon[type="date"]::before, input.form-control.no-icon[type="time"]::before{ display: none;}


/*버튼타입 인풋*/
input.form-control[type="button"]{position: relative;background:url(/static/img/user/ic_more_ip.png)no-repeat right 1.5rem center / 1.5rem;text-align: left;}


/* 체크박스*/
.checks_wr{display: flex; flex-wrap: wrap; margin-bottom: -1rem; }
.checks_wr .checks{margin-right: 3rem; margin-bottom: 1rem;}

.checks label{display: flex; align-items: center; cursor: pointer;}
.checks label.chk_right{flex-flow: row-reverse; justify-content: flex-end;}
.checks input{display: none;}
.checks .ic_box {
    display: inline-block;
    width: 2.0rem;
    height: 2.0rem;
    border: 1px solid var(--gray-200);
    border-radius: 3.0rem;
    background-image: url(/static/img/user/check01_off.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-color: var(--gray-200);
	background-image:url(/static/img/user/ic_check_on.png);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 1.0rem;
    flex-shrink: 0;
}
.checks input:checked + .ic_box{background-color:var(--primary-400);border-color:var(--primary-400);}
.chk_right .ic_box{margin-right: 0; margin-left: 0.5rem;}
.checks input:checked ~ .chk_p{}
.chk_p{padding-top:0.1rem;}



.checks.primary_checks .ic_box{background-color: #eae9f0;border-radius: 50%;background-image:none;}
.checks.primary_checks input:checked + .ic_box{background-image: url(/static/img/user/check01_on.png);}


.radios_wr{display: flex; flex-wrap: wrap;}
.radios_wr .radios{margin-right: 2rem; margin-bottom: 1rem;}

.radios label{display: flex; align-items: center; cursor: pointer;}
.radios label.chk_right{flex-flow: row-reverse; justify-content: flex-end;}
.radios input{display: none;}
.radios .ic_box{display: inline-flex;flex-shrink: 0;position:relative; width: 2.0rem; height: 2.0rem; text-align: center; background-color: #fff;display: flex; align-items: center; justify-content: center; margin-right: 1.0rem;border-radius:2.0rem;border:1px solid var(--gray-300);}
.radios input:checked + .ic_box{background-color: var(--primary-400);border-color: var(--primary-400);border-width:2px;}
.radios input:checked + .ic_box:after {
    content: '';
    display: block;
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 50%;
    background-color: #fff;
}
.radios input + .ic_box:after {
    content: '';
    display: block;
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 50%;
    background-color: var(--gray-200);
}




/* 이미지 업로드 */
.image_upload{display: inline-block;position: relative;margin-right:1.0rem;}
.rprs_img {
    position: absolute;
    top: 1px;
    left: 1px;
    font-sizE: 1.4rem;
    color: #fff;
    color: #fff;
    background: var(--primary);
    padding: 0.2rem 0.5rem;
    border-radius: 1.0rem 0 1.0rem 0;
    z-index: 1;
}
.upload_box{
    width: 10rem;
    overflow: hidden;
    cursor: pointer;
    background: url(/static/img/user/btn_add_img2.png) no-repeat center top 35% / 3.0rem;
	background-color: #fff;
	border:1px solid var(--border);
	border-radius: 1.2rem;
	position: relative;
}
.upload_box .max_img {
    position: absolute;
    bottom: 15%;
    width: 100%;
    left: 0;
    font-size: 1.6rem;
    text-align: center;
    color: var(--gray-400);
    font-weight: 500;
}
.image_upload.on .upload_box{background: none;border: 1px solid var(--border);}
.upload_del {
    position: absolute;
    top: 0.8rem;
    right: 0.8rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    background-color: transparent;
    padding: 0 !important;
    display: none;
}
.upload_del img{width:100%;}
.image_upload.on .upload_del{display: flex;}



/* 페이지네이션 */
.pagination {display: flex; justify-content: center; align-items: center; } 
.pagination li { height: 100%; } 
.pagination a {
    color: #000;
    font-weight: 500;
    margin: 0 0.4rem;
	width: 2.8rem;height: 2.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}
.pagination a.on {
	background-color: var(--primary);color:#fff; font-weight: 400;
    color: #fff;
} 
.pagination a.arrow{background-color: #fff;color: #626C79;}
.pagination a.arrow{margin:0;}
.pagination a.arrow.disabled img{opacity:0.3;} 

/* 페이저 */
.pager {
    display: inline-flex;
    justify-content: center;
    align-items: center;
	border-radius:3.0rem;
	background:var(--light);
	padding:0.3rem 0.6rem;

}
.pager .btn{padding:0;width:3.6rem;height:3.6rem;}
.pager .btn img{width:3.6rem;}
.pager .btn.disabled{background:transparent;border:0;}
.pager .btn.disabled img{opacity:0.3;}

/* 테이블 */
.table_01 {width:100%; border-collapse: collapse;   border-bottom:1px solid #e3e3e3;border-top: 1px #eee solid;line-height: 140%;}
.table_01 th {
    border-bottom: 1px solid #eee;
    color: #1C1C1E;
    font-weight: 500;
    padding: 0.7rem 1.2rem 0.7rem 1.2rem;
    background: #F8F8F8;
    vertical-align: top;
    
}
.table_01 td {border-bottom:1px solid #eee;  padding:0.7rem 1.2rem;color: #1C1C1E;}


/* 테이블 슬래쉬 */
.table_01 th.slash {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><line x1="0" y1="100%" x2="100%" y2="0" stroke="rgb(77,77,77)" /></svg>'); background-repeat: no-repeat;
}
.table_01 th.backslash {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><line x1="0" y1="0" x2="100%" y2="100%" stroke="rgb(77,77,77)" /></svg>'); background-repeat: no-repeat;
}
.table_01 th.slash, .table_01 th.backslash { text-align: left; }
.slash div, .backslash div { text-align: right; }

/*테이블 반응형때*/
.table_scroll { overflow-x: auto; overflow-y: hidden; padding: 0px !important; }






/* 이미지 크롭 */
.rect{width: 100%;position: relative;overflow: hidden; } 
.rect:after{content: "";display: block;padding-bottom: 100%; } 
.rect img{ position: absolute;width: 100%;height: 100%;object-fit: cover;object-position: center;top: 50%;left: 50%;transform: translate(-50%,-50%);}


.rect2{width: 100%;position: relative;overflow: hidden; } 
.rect2:after{content: "";display: block;padding-bottom: calc(256 / 181 * 100%); } 
.rect2 img{ position: absolute;width: 100%;height: 100%;object-fit: cover;object-position: center;top: 50%;left: 50%;transform: translate(-50%,-50%);}


.rect3{width: 100%;position: relative;overflow: hidden; } 
.rect3:after{content: "";display: block;padding-bottom: calc(190 / 335 * 100%); } 
.rect3 img{ position: absolute;width: 100%;height: 100%;object-fit: cover;object-position: center;top: 50%;left: 50%;transform: translate(-50%,-50%);}

.rect4{width: 100%;position: relative;overflow: hidden; } 
.rect4:after{content: "";display: block;padding-bottom: calc(142 / 250 * 100%); } 
.rect4 img{ position: absolute;width: 100%;height: 100%;object-fit: cover;object-position: center;top: 50%;left: 50%;transform: translate(-50%,-50%);}

.rect5{width: 100%;position: relative;overflow: hidden; } 
.rect5:after{content: "";display: block;padding-bottom: calc(110 / 335 * 100%); } 
.rect5 img{ position: absolute;width: 100%;height: 100%;object-fit: cover;object-position: center;top: 50%;left: 50%;transform: translate(-50%,-50%);}



.gap_02{gap:0.2rem;}
.gap_04{gap:0.4rem;}
.gap_05{gap:0.5rem;}
.gap_08{gap:0.8rem;}
.gap_10{gap:1rem;}
.gap_15{gap:1.5rem;}
.gap_2_10{gap:0.2rem 1rem;}

/*기본모달*/
body{padding-right: 0px !important;}
body.modal-open[style]{overflow-y: scroll;
	position: fixed;
    top: 0px;
    width: 100%;
}
.modal{padding-right: 0px !important;}
.modal-dialog {max-height: 100%;height: 100%;}
.modal-sm{max-width:40.0rem;margin: 0 auto;padding: 1.5rem;padding: 2.0rem;}
.modal-md{max-width:48rem;margin: 0 auto;padding: 1.5rem;padding: 0rem 2.0rem;max-height: calc(100% - 3.5rem);min-height: calc(100% - 3.5rem);}
.modal-default{max-width:var(--body_width);margin: 0 auto;padding-left:0;padding-right:0;padding: 2.0rem 2.0rem;}
.modal{overflow-y: auto;}
.modal .modal-header{align-items: center;padding: 2rem 2rem 0.5rem;justify-content: space-between;border-bottom:0;}
.modal .modal-header .modal-title {font-weight: 700;font-size: 1.8rem;flex: 1 1 auto;border: 0;}
.modal .modal-header .close{text-shadow: none;opacity: 1;width:2.4rem;padding: 0;margin: 0;}
.modal .modal-content {border: 0;border-radius: 2.4rem;}
.modal .modal-body { position: relative; flex: 1 1 auto;padding:2.0rem 2.0rem 2.5rem;}
.modal .modal-body .close_bar{width:4.4rem;height:0.4rem;background:#E3E3E3;border-radius:1.0rem;margin:0 auto 1.0rem;border: 0;display: block;}
.modal .modal-footer > *{margin:0;}
.modal .modal-footer {padding: 1.0rem 2.0rem 2.0rem;border:0;display: block;}
.modal .modal-footer .form-row{margin-right: -0.4rem; margin-left: -0.4rem;}


.modal-sm .modal-footer{padding: 0 2.0rem 2.0rem;}
.modal-md .modal-footer{padding: 0 2.0rem 2.0rem;}

.modal .modal-sm .modal-header{padding: 1.5rem 2rem;}
.modal .modal-sm .modal-body{border:0;padding:3rem 2.0rem 1.5rem;}
.modal .modal-md .modal-header{}
.modal .modal-md .modal-body{}


/*전체사이즈*/
.modal_full.modal{overflow-y: auto;}
.modal_full.modal .modal-header {
	width: 100%;
	background: #fff;
	color:#000;
	padding: 0rem 2.0rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: var(--hd_height_m);
	border-bottom:0;
	border-radius:0;
}
.modal_full.modal .modal-header button{border:0;background:transparent;width:2.4rem;}
.modal_full.modal .modal-content {border-radius: 0;max-height: 100vh;height: 100vh;}
.modal_full.modal .modal-dialog{margin:0 auto;max-width:var(--body_width);transform: translate(0%, 0);max-height: 100%;}
.modal_full.modal .modal-body{border:0;padding:2.0rem 2.0rem 11.6rem;}
.modal_full.modal .modal-footer {
    padding: 2.0rem 2.0rem 1.0rem;
    display: block;
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
    background: linear-gradient(180deg, transparent, #fff 20%);
	border-radius: 0;
}


/*하단 팝업*/
.modal_bottom.modal{padding-right:0 !important;overflow-y: hidden;}
.modal_bottom.modal.fade{}
.modal_bottom.modal.show .modal-dialog{padding-right:0 !important;transform: translate(-50%, 0);}
.modal_bottom.modal .modal-dialog {transform: translate(0, 5rem);position: fixed;
	bottom: 0;
	width: 100%;
	max-width:100%;
	transform: translate(-50%, 5rem);
	left: 50%;
}
.modal_bottom.modal .modal-header{padding: 2.4rem 2.0rem 0;}
.modal_bottom.modal .modal-header .modal-title {font-size: 2.6rem;line-height: 1.385;}
.modal_bottom.modal .modal-title button{border:0;background:transparent;width:2.4rem;position:absolute;right:2.0rem;top:1.6rem;}
.modal_bottom.modal .modal-dialog{justify-content: flex-end;margin: 0 auto;min-height: 100%;max-width:var(--body_width);}
.modal_bottom.modal .modal-content{border-radius: 2.4rem 2.4rem 0 0;margin-top: 3.0rem;}
.modal_bottom.modal .modal-body{border-bottom:0;padding: 0.5rem 2.0rem 2.0rem;}
.modal_bottom.modal .modal-footer {padding: 0 2.0rem 1.0rem;}
.modal-backdrop {left: 50%; width: 100%;transform: translateX(-50%);max-width:var(--body_width);}



/* toast */
.toast_fixed {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: var(--body_width);
    z-index: 9999;
    top: 0;
    bottom: 0;
    pointer-events: none;
}
/* 토스트가 표시될 때만 pointer-events를 auto로 변경하여 클릭 가능하게 함 */
.toast_fixed.active {
    pointer-events: auto;
}

.toast_fixed.hide {
  display: none;
}
.toast{
	margin:0;
    box-shadow: none;
    font-weight: 300;
    border: 0;
    background: transparent;
	width: 100%;
	flex-basis:auto;
}
.toast-body {
	display: flex;
	justify-content: center;
	width: 100%;
	padding: 0;
    
}
.toast-body .toast_cont {
    padding: 1.2rem 2.3rem;
    background-color: #fff;
    color: #000;
    font-weight: 400;
    border-radius: 1.5rem;
    text-align: center;
    box-shadow: 0 0 1.5rem rgba(0, 0, 0, 0.16);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 5.0rem;
}
.toast-body p img{
    margin-right: 0.6rem;
}



/* 뱃지 */
.badge {
    padding: 0.5rem 1.0rem;
    border-radius: 0.6rem;
    font-weight: 500;
    font-size: 1.4rem;
}
.badge-light{background:var(--light);color:#858585;}
.badge-primary-outline{color:var(--primary);background:#fff;border:1px solid var(--primary);}
.badge-secondary-light{background:var(--secondary-light);color:var(--secondary);}
.badge-secondary-line{color:var(--secondary);background:#fff;border:2px solid var(--secondary);}
.badge-gray-300{background:var(--gray-300);color:#fff;}
.badge-sm{font-size:1.3rem; padding: 0.3rem 0.5rem;}
.badge-md{font-size:1.4rem; padding: 0.6rem 1.0rem;}
.badge-lg{font-size:inherit; padding: 1.0rem 2.0rem;}
.badge_judge img{width:3.0rem;}
.badge_other img{width:2.4rem;}



/*탭*/
.tab_sticky{
    position: sticky;
    top: var(--hd_height_m);
    z-index: 15;
}

/*nav-tabs*/
.nav-tabs {
    background: #F5F6F8;
    border-radius: 0.8rem;
    padding: 0.8rem;
	border: 0;
	flex-wrap: nowrap;
}
.nav-tabs .nav-link {
    height: 4.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    color: #999;
    border: 0;
    margin-bottom: 0px;
    padding-left: 0.2rem;
    padding-right: 0.2rem;
    border-radius: 0.8rem;
    font-weight: 600;
	word-break: keep-all;
}
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    color: #495057;
    background: #fff;
    color: #000;
    box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.06);
}

/*nav-pills*/
.nav-pills{
	margin-left:-0.4rem;
	margin-right:-0.4rem;
	flex-wrap: nowrap;
}
.nav-pills .col{
	padding-left:0.4rem;
	padding-right:0.4rem;
}
.nav-pills .nav-link {
    background: none;
    border: 1px solid var(--border);
    border-radius: 1rem;
    background: #fff;
    color: #000;
}
.nav-pills .nav-link.active {
    background: none;
    border: 0;
    border-radius: 1rem;
    background: #fff;
    color: #000;
    border: 1px solid #000;
}



/*nav_tab_line*/
.nav_tab_line{
    width: 100%;
    margin: 0;
    background-color: #fff;
}
.nav_tab_line {
    border: unset;
	border-bottom:1px solid #E3E3E3;
}
.nav_tab_line .col, .nav_tab_line [class*=col-]{padding-left:0;padding-right:0;}
.nav_tab_line .nav-item{
    text-align: center;
    background-color: #fff;
	-ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
	margin-right:2.0rem;
	flex-basis: content;
}
.nav_tab_line .nav-link {
    border: 1px solid white;
    color: var(--gray);
    height: 5.7rem;
    padding: 1.8rem 0.0rem 1.5rem;
    width: 100%;
    font-size: 2.0rem;
    font-weight: 600;
    background: transparent;
	display: flex;
    align-items: center;
    justify-content: center;
}
.nav_tab_line .nav-link.active, .nav_tab_line .nav-item.show .nav-link {
    border-bottom: 3px solid var(--secondary);
    color: var(--secondary);
	transform: translateY(0.15rem);
	padding: 1.6rem 0.0rem 1.5rem;
}


.nav_tab_line.cate_auto{width: fit-content;}
.nav_tab_line.cate_auto .nav-item{flex-grow: 0;}
.nav_tab_line.cate_auto .nav-link{white-space: nowrap;}


/*top_tab*/
.top_tab{
    width: 100%;
    margin: 0;
}
.top_tab {border:unset;border-bottom: 1px solid var(--border);}
.top_tab .col, .top_tab [class*=col-]{padding-left:0;padding-right:0;}
.top_tab .nav-item{
    text-align: center;
}
.top_tab .nav-link {
    border: 1px solid transparent;
    color: var(--gray);
    height: 5.0rem;
    width: 100%;
    font-size: 1.8rem;
    font-weight: 700;
    background: transparent;
	display: flex;
    align-items: center;
    justify-content: center;
	padding-left: 0;
    padding-right: 0;
}
.top_tab .nav-link span{padding: 1.8rem 0.0rem 1.5rem;display: inline-block;}
.top_tab .nav-link.active span, .top_tab .nav-item.show .nav-link span{
    border-bottom: 2px solid #000;
    color: #000;
	transform: translateY(0.2rem);
	padding:1.1rem 0.0rem 0.9rem;
	width:100%;
}



/*드롭다운*/
.dropdown-menu {
    padding: 1.0rem 0;
    min-width: 13rem;
    box-shadow: 0 0rem 1.6rem rgba(0, 0, 0, 0.06);
    border-color: var(--border);
    border-radius: 1.2rem;
    font-size: 1.6rem;
	color:#000;
	margin-top:0.9rem;
}
.dropdown-menu.dropdown-menu02 {
    padding: 1.0rem 1.5rem;
}
.dropdown-menu .dropdown-item{padding:0.35rem 1.5rem;cursor: pointer;color:#000;}
.dropdown-menu.dropdown-menu02 .dropdown-item{padding:0.35rem 0.8rem;cursor: pointer;border-bottom:1px solid var(--border);text-align: center;}
.dropdown-menu.dropdown-menu02 .dropdown-item:last-child{border-bottom:0;}
.dropdown-menu .dropdown-item:hover{background:var(--light);}
.dropdown-menu .dropdown-item.active, .dropdown-menu .dropdown-item:active{background:var(--light) !important;color:#000;}

/*커스텀 스위치*/
.custom-switch {
    padding: 0;
    width: 5.0rem;
    height: 3.0rem;
	position: relative;
}
.custom-switch .custom-control-label::after {
    width: 3.0rem;
    height: 3.0rem;
    background-color: #fff;
	border:3px solid var(--gray-200);
    border-radius: 3rem;
    top: -0.0rem;
    left: 0rem;
}
.custom-control-label::after {
    position: absolute;
    top: 0.3rem;
    display: block;
    width: 1rem;
    height: 1rem;
    content: "";
	cursor: pointer;
}
.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
    background-color: #fff;
    left: 1.2rem;
    border-color: var(--primary-400);
}
.custom-control-input:checked ~ .custom-control-label::before {
    color: #fff;
    border-color: var(--primary-400);
    background-color: var(--primary-400);
}
.custom-control-label::before {
    background-color: var(--gray-200);
    border: 0;
	top: 0;
	cursor: pointer;
}
.custom-switch .custom-control-label::before {
    left: 0;
	top: 0;
    width: 5.0rem;
    height: 3.0rem;
    border-radius: 3rem;
    background-color: var(--gray-200);
}
.custom-control-input:not(:disabled):active ~ .custom-control-label::before {
  color: #fff;
  background-color: var(--gray-200);
  border-color: var(--gray-200);
}
.custom-control-input:not(:disabled):active ~ .custom-control-label::after {
  color: #fff;
  background-color: #fff;
  border-color: var(--gray-200);
}



/*마진*/
.mt_8{margin-top:0.8rem;}
.mt_12{margin-top:1.2rem;}
.mt_16{margin-top:1.6rem;}
.mt_20{margin-top:2.0rem;}
.mt_24{margin-top:2.4rem;}
.mt_25{margin-top:2.5rem;}
.mt_28{margin-top:2.8rem;}
.mt_35{margin-top:3.5rem;}
.mt_36{margin-top:3.6rem;}
.mt_40{margin-top:4.0rem;}
.mt_50{margin-top:5.0rem;}
.mt_60{margin-top:6.0rem;}
.mt_70{margin-top:7.0rem;}
.mt_80{margin-top:8.0rem;}


.mb_4{margin-bottom:0.4rem;}
.mb_5{margin-bottom:0.5rem;}
.mb_6{margin-bottom:0.6rem;}
.mb_8{margin-bottom:0.8rem;}
.mb_10{margin-bottom:1.0rem;}
.mb_12{margin-bottom:1.2rem;}
.mb_14{margin-bottom:1.4rem;}
.mb_16{margin-bottom:1.6rem;}
.mb_18{margin-bottom:1.8rem;}
.mb_20{margin-bottom:2.0rem;}
.mb_24{margin-bottom:2.4rem;}
.mb_25{margin-bottom:2.5rem;}
.mb_27{margin-bottom:2.7rem;}
.mb_30{margin-bottom:3.0rem;}
.mb_40{margin-bottom:4.0rem;}
.mb_50{margin-bottom:5.0rem;}
.mb_60{margin-bottom:6.0rem;}
.mb_70{margin-bottom:7.0rem;}
.mb_90{margin-bottom:9.0rem;}
.mb_110{margin-bottom:11.0rem;}

.mr_4{margin-right:0.4rem;}
.mr_6{margin-right:0.6rem;}
.mr_8{margin-right:0.8rem;}
.mr_12{margin-right:1.2rem;}
.mr_16{margin-right:1.6rem;}
.mr_20{margin-right:2.0rem;}

.ml_6{margin-left:0.6rem;}
.ml_8{margin-left:0.8rem;}
.ml_12{margin-left:1.2rem;}
.ml_16{margin-left:1.6rem;}
.ml_20{margin-left:2.0rem;}


.mx_4{margin-left:0.4rem;margin-right:0.4rem;}
.mx_20{margin-left:2.0rem;margin-right:2.0rem;}
.mx_n16{margin-left:-1.6rem;margin-right:-1.6rem;}
.mx_n20{margin-left:-2.0rem;margin-right:-2.0rem;}


.my_2{margin-top:0.2rem;margin-bottom:0.2rem;}



/*패딩*/
.pt_hd{padding-top:var(--hd_height_m);}
.pt_6{padding-top:0.6rem;}
.pt_14{ padding-top: 1.4rem;}
.pt_15{ padding-top: 1.5rem;}
.pt_20{ padding-top: 2.0rem;}
.pt_24{padding-top:2.4rem;}
.pt_25{padding-top:2.5rem;}
.pt_28{padding-top:2.8rem;}
.pt_38{padding-top:3.8rem;}
.pt_40{ padding-top: 4.0rem;}
.pt_50{ padding-top: 5.0rem;}
.pt_60{ padding-top: 6.0rem;}
.pt_80{padding-top:8.0rem;}
.pt_120{padding-top:12.0rem;}

.pb_8 { padding-bottom: 0.8rem;}
.pb_14 { padding-bottom: 1.4rem;}
.pb_16 { padding-bottom: 1.6rem;}
.pb_18{padding-bottom:1.8rem;}
.pb_20{padding-bottom:2.0rem;}
.pb_22{ padding-bottom: 2.2rem;}
.pb_24{ padding-bottom: 2.4rem;}
.pb_25{padding-bottom:2.5rem;}
.pb_40{padding-bottom:4.0rem;}
.pb_50{padding-bottom:5.0rem;}
.pb_60{padding-bottom:6.0rem;}
.pb_70{padding-bottom:7.0rem;}
.pb_80{padding-bottom:8.0rem;}
.pb_90{padding-bottom:9.0rem;}
.pb_100{padding-bottom:10.0rem;}


.pl_16 { padding-left: 1.6rem;}
.pl_25 { padding-left: 2.5rem;}


.pr_16{padding-right:1.6rem;}

.py_8{ padding-top: 0.8rem; padding-bottom: 0.8rem;}
.py_12{ padding-top: 1.2rem; padding-bottom: 1.2rem;}
.py_20{padding-top:2.0rem;padding-bottom:2.0rem;}
.py_24{padding-top:2.4rem;padding-bottom:2.4rem;}
.py_35{padding-top:3.5rem;padding-bottom:3.5rem;}
.py_40{padding-top:4.0rem;padding-bottom:4.0rem;}


.px_8{padding-left:0.8rem;padding-right:0.8rem;}
.px_12{padding-left:1.2rem;padding-right:1.2rem;}
.px_18{padding-left:1.8rem;padding-right:1.8rem;}
.px_16{padding-left:1.6rem;padding-right:1.6rem;}
.px_20{padding-left:2.0rem;padding-right:2.0rem;}

.py_30{padding-top:3.0rem;padding-bottom:3.0rem;}
.p_20{ padding: 2rem;}



.vh_min100_hd{min-height:calc(100vh - 5.6rem);}
.vh_min100{min-height:100vh;}
.vh_100_vh{height:100vh;}
.w-auto{width:auto;}

.wrap{background:#fff;min-height: 100vh; padding-top: var(--hd_height_m);}

.licenses_item{padding-top:2.0rem;padding-bottom:2.0rem;border-bottom:1px solid var(--border);}
.licenses_item .tit{font-size:1.6rem;color:#000;font-weight:700;margin-bottom:0.2rem;}
.licenses_item .link_a{font-size:1.4rem;color:var(--blue);display:block;margin-bottom:0.2rem;}
.licenses_item .info{font-size:1.4rem;color:var(--gray-600);margin-bottom:0.4rem;white-space: pre-line;}



body{overflow-y: scroll;}
.mobile_wr{max-width:var(--body_width);margin:0 auto;}

/* bar */
.bar{ height: 1.0rem; background-color: var(--light);}


.loading_float {
	display:none;
    position: fixed;
    top: 0;
    left: 50%;
    max-width: var(--body_width);
    background: transparent;
    width: 100%;
    z-index: 1000;
    height: 100%;
    transform: translateX(-50%);
}
.loading_float.show{display:block;}
.loading_round {
    position: fixed;
    background: #fff;
    width: 5.2rem;
    height: 5.2rem;
    position: fixed;
    top: 13.4rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    box-shadow: 0 0 1.6rem rgba(0, 0, 0, 0.2);
}
.loading_round .spinner-border{color: var(--secondary);border-right-color: #E9E9E9;width: 2.4rem;height: 2.4rem;border-width:0.35rem;}

/*버튼*/
.bottom_btn {
    position: fixed;
    left: 50%;
    bottom: 0;
    width: 100%;
    max-width: var(--body_width);
    transform: translateX(-50%);
	padding-bottom: env(safe-area-inset-bottom);
	z-index:1040;
}
.bottom_btn .btn_wrap{padding:2.0rem 1.5rem 1.0rem;background: linear-gradient(180deg, transparent 0, #fff 20%);position: relative;}
.bottom_btn .spc_bubble {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate3d(-50%, -4.0rem, 0);
    width: 100%;
}

.fixed_btn {
    width: 5.6rem;
    height: 5.6rem;
    position: fixed;
    right: 50%;
    bottom: 1rem;
    transform: translateX(27.2rem);
    display: block;
    z-index: 1000;
}

.go_top {
    width: 5.2rem;
    height: 3.6rem;
    background: url(/static/img/user/gotop_btn.png) no-repeat center;
    background-color: rgba(0,0,0,0.06);
    background-size: 1.9rem auto;
    z-index: 1000;
    border-radius: 2.0rem;
    display: none;
    position: fixed;
    right: 50%;
    bottom: 1.0rem;
    transform: translateX(27.2rem);
	backdrop-filter: blur(3px);
}
.go_top.show{display: block;}
.zd_2{position:relative;z-index:2;}
.zd_3{position:relative;z-index:3;}

.icon90{width:9.0rem;flex-shrink: 0;}
.icon80{width:8.0rem;flex-shrink: 0;}
.icon70{width:7.0rem;flex-shrink: 0;}
.icon60{width:6.0rem;flex-shrink: 0;}
.icon52{width:5.2rem;flex-shrink: 0;}
.icon50{width:5.0rem;flex-shrink: 0;}
.icon44{width:4.4rem;flex-shrink: 0;}
.icon40{width:4.0rem;flex-shrink: 0;}
.icon38{width:3.8rem;flex-shrink: 0;}
.icon36{width:3.6rem;flex-shrink: 0;}
.icon34{width:3.4rem;flex-shrink: 0;}
.icon32{width:3.2rem;flex-shrink: 0;}
.icon30{width:3.0rem;flex-shrink: 0;}
.icon28{width:2.8rem;flex-shrink: 0;}
.icon27{width:2.7rem;flex-shrink: 0;}
.icon24{width:2.4rem;flex-shrink: 0;}
.icon20{width:2.0rem;flex-shrink: 0;}
.icon18{width:1.8rem;flex-shrink: 0;}
.icon16{width:1.6rem;flex-shrink: 0;}
.icon15{width:1.5rem;flex-shrink: 0;}
.icon14{width:1.4rem;flex-shrink: 0;}
.icon12{width:1.2rem;flex-shrink: 0;}

.icon_shadow{filter: drop-shadow(0 0.3rem 0.6rem rgba(254,103,110,0.49));}

.btn_roudned {
    height: 4.0rem;
    width: 4.0rem;
    border: 1px solid var(--border);
    border-radius: 50%;
    z-index: 3;
    position: relative;
    padding: 0;
    flex-shrink: 0;
	background: #fff;
}
.btn_roudned:hover{background:var(--light);}

.dot_menu{border-radius:0.8rem;}
.dot_menu[aria-expanded="true"]{background:var(--gray-100);}

.fixed_rb_btn {
    position: fixed;
    right: 50%;
    bottom: 12.0rem;
    transform: translateX(27.2rem);
    z-index: 1001;
}
.fixed_rb_btn .btn_fixed{width:5.2rem;height:5.2rem;border-radius:50%;background:var(--secondary);padding: 0;box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.07);margin-top:0.8rem;}

/* 헤더 */
.hd_m {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: var(--hd_height_m) !important;
    width: 100%;
    max-width: var(--body_width);
    background: #fff;
	color:#000;
    position: fixed;
    top: 0;
    padding: 0 2.0rem;
    z-index: 1000;
}
.hd_m .logo img{width:15.2rem;display:flex;}
.hd_m .log_txt{font-size:1.4rem;padding-left:0.5rem;}
.hd_m .log_txt span {padding: 0 0.5rem;}
.hd_m button{border:0; background: transparent;flex-shrink: 0;}
.hd_m button > img{height:2.4rem;}
.hd_m .hd_btn, .modal-header .hd_btn {display: flex;align-items: center;flex-shrink: 0;gap:1.5rem;}

.hd_m img{flex-shrink: 0;}
.hd_m .sch_ip{background: rgba(255,255,255,0.1);border: 0;}
.hd_m .sch_ip button{width:3.0rem;}
.hd_m .sch_ip button > img{height:auto;}
.hd_m .sch_ip .form-control{height: 4.0rem;color:#fff;}


.hd_transparent{background: transparent;}
.hd_menu {
    position: fixed;
    left: 50%;
    top: 1.4rem;
    width: 2.5rem;
    z-index: 1000;
    transform: translateX(24.6rem);
}

/* 모바일 메뉴 */
.hd_menu_btn {font-size: 2rem;}
.m_menu_wr {
    visibility: hidden;
    opacity: 0;
    position: fixed;
    top: 0;
    left: 50%;
    width: 100%;
    height: 100%;
    max-width: var(--body_width);
    z-index: 99999;
    transition: all 0.5s ease-in-out;
    display: flex;
    justify-content: flex-end;
    overflow: hidden;
    transform: translateX(-50%);
}

/* x버튼 */
.close_btn_wr{display: none; opacity: 0;}
.m_nav .close_btn_wr{display: flex; justify-content: flex-end; opacity: 0;}
.menu_on .m_nav .close_btn_wr{opacity: 1;}
.close_btn{font-size: 2rem; border:0; height: auto; }
.close_btn img{width:3.0rem;}

/* 메뉴 열렸을때 외부 */
.menu_on .m_menu_wr{visibility: visible; opacity: 1; }
.m_nav{position: relative; width: 100%; height: 100%; z-index: 99999;  background: #fff; transition: all 0.4s ease-in-out; max-width: 0; transform: translateX(100%); visibility: hidden; opacity: 0; }
.menu_on .m_nav {
    transform: translateX(0%);
    visibility: visible;
    opacity: 1;
    max-width: var(--body_width);
    width: 80%;
}

.menu_bg{position: fixed;  left: 50%; top: 0; background: rgba(0,0,0,0.6); transition: all 0.4s ease-in-out; width: 100%; height: 100%; z-index: 99998; visibility: hidden; opacity: 0; transform: translateX(-50%); max-width:var(--body_width);}
.menu_on .menu_bg{visibility: visible; opacity: 1;}

/* 메뉴 열렸을때 내부 */
.m_nav .nav_wr{height: auto;}
.m_nav .nav_ul{display: block;}
.m_nav .nav_li{height: 100%; position: relative;}
.m_nav .nav_a{display: flex; align-items: center; justify-content: space-between; width: 100%; height: 100%; padding: 1.2rem 1.6rem;}
.m_nav .nav_a i{display: inline-block;}
.m_nav .nav_a img{width:2.0rem;}

.m_nav .nav_ul2{display: none;background: var(--light);}
.m_nav .nav_ul2 a{display: block; padding: 1.2rem 1.6rem; white-space: nowrap;}



/*검색*/
.sch_ip {display: flex;background:#fff;padding: 0 2rem;border-radius: 1.2rem;border:1px solid var(--border-200);}
.sch_ip .form-control{height:4.6rem;padding: 0.5rem 0;margin-right:1.0rem;}
.sch_ip .form-control:focus {background-color: transparent;}
.sch_ip button{width:1.6rem;height:1.6rem;border:0;background: transparent;}


/* IE의 경우 */
.sch_ip .form-control::-ms-clear,
.sch_ip .form-control::-ms-reveal{
    display:none;
}
/* 크롬의 경우 */
.sch_ip .form-control::-webkit-search-decoration,
.sch_ip .form-control::-webkit-search-cancel-button,
.sch_ip .form-control::-webkit-search-results-button,
.sch_ip .form-control::-webkit-search-results-decoration{
    display:none;
}
/*회색 검색*/
.sch_gray.sch_ip{background: var(--light);border:0;}


/*새로운 input 스타일*/
.form_box{border:1px solid var(--border);border-radius:1.2rem;padding-left:2.0rem;padding-right:2.0rem;display:flex;height:var(--height_lg); align-items: center;}
.form_box .form-control{flex:1 1 auto;height:auto;border:0;border-radius:0;padding: 0;}
.form_box .form_time{display:none;}
.ip_box .ip_valid{display:none;}
.ip_box.ip_valid .ip_valid{display:block;}
.form_box .btn-sm{min-width:6.0rem;}

.form_box.disabled{background:var(--gray-50);}
.form_box.disabled .form-control{background:var(--gray-50);color:var(--gray-300);}

/*노데이터*/
.result_data{display:flex;align-items: center;justify-content: center; flex-direction: column;}
.result_data img {width: 4.4rem;}



/*숫자 증감*/
.item_opt_counter {
    position: relative;
    width: 11.2rem;
    height: 3.1rem;
    line-height: 3.1rem;
    flex-shrink: 0;
    display: flex;
    align-items: center;
	z-index:2;
}
.item_opt_counter_btn {
    width: 3.1rem;
    height: 3.1rem;
    vertical-align: top;
    padding: 0;
    background: transparent;
    border: 1px solid var(--border);
    flex-shrink: 0;
    padding: 0;
    border-radius: 50%;
}

.item_opt_counter_btn.disabled, .item_opt_counter_btn:disabled{opacity: 0.3;background: transparent;}
.item_opt_counter .quantity {
    width: 48%;
    height: 100%;
    vertical-align: top;
    font-size: inherit;
    font-weight: 500;
    line-height: 3.1rem;
    text-align: center;
    border: unset;
    margin: 0 0.5rem;
}
.item_opt_counter .quantity:focus{outline: 0;}
.item_opt_counter.time_counter {
    width: 15.0rem;
    height: 4.7rem;
    line-height: 4.7rem;
    border-radius: 3.6rem;
    border: 1px solid #E3E3E3;
}
.item_opt_counter.time_counter .quantity {color: #000;font-size: 1.8rem;}
.item_opt_counter.disabled .quantity{color:#999;}
.item_opt_counter.disabled .item_opt_counter_btn{opacity: 0.3;}

/*양옆정렬 정보*/
.between_info {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
	margin-bottom:0.5rem;
}
.between_info:last-child{margin-bottom:0;}

/*왼쪽정렬 정보*/
.left_info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
	margin-bottom:0.5rem;
}
.left_info:last-child{margin-bottom:0 !important;}

/*아이템*/
.item{position:relative;}
.item .tit{font-weight:600;color:#000;line-height: 1.5;}
.item .info_wr{display:flex;flex-wrap:wrap;align-items: center;font-size:1.4rem;color:;var(--gray-500);line-height: 1.7;}
.item .info_wr .info_dot{display:block;width:0.4rem;height:0.4rem;background:#D1D1D1;margin:0 1.0rem;}
.item .info_value{display:flex;flex-wrap:wrap;align-items: center;font-size:1.4rem;gap: 1.0rem;}
.item .info_value .btn{font-weight:500;font-size:1.4rem;line-height: 1.7;}
.item .info_value .info_span{display:flex;align-items: center;font-weight:500;gap: 0.5rem;line-height: 1.7;}
.item .thum{overflow: hidden;}
.item .item_link{position:absolute;top:0;left:0;right:0;bottom:0;}


/*커뮤니티 item*/
.commu_list .item{padding:2.0rem 0;border-bottom:1px solid var(--border);}
.commu_list .item .thum{min-width: 6rem; width: 6rem; margin-left: 1.0rem; aspect-ratio: 1 / 1;position: relative;overflow: hidden; }
.commu_list .item .thum:after{content: "";display: block;padding-bottom: 100%; }
.commu_list .item .thum img{width: 100%;position: absolute;width: 100%;height: 100%;object-fit: cover;object-position: center;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.commu_list .item .item_body{flex:1 1 auto;}
.commu_list li:last-child .item{border-bottom:0;}



/*찜하기*/
.like_btn{position:relative;z-index:1;}
.like_btn span {
    background-image: url(/static/img/user/ic_like.png);
    display: block;
    width: 1.6rem;
    height: 1.6rem;
    background-size: contain;
    margin-right: 0.5rem;
}
.like_btn[aria-pressed="true"] span{background-image: url(/static/img/user/ic_like_on.png);}



/*스와이프 기본*/
.basic_pagination{position: static;line-height:100%;display:flex;align-items: center;}
.basic_pagination .swiper-pagination-bullet{width:0.8rem;height:0.8rem;display:block;background-color:#000;opacity:0.2;margin:0 0.5rem;}
.basic_pagination .swiper-pagination-bullet-active{background-color:#000;opacity:1;width:2.0rem;border-radius:0.5rem;}


/*말풍선 스타일*/
.spc_bubble{display: inline-flex;flex-direction: column; align-items: center;}
.spc_bubble div{padding:1.2rem 2.8rem;background:#000;border-radius:3.0rem;color:#fff;font-size:1.4rem;line-height:1.4;text-align:center;}
.spc_bubble:after {
    content: '';
    display: block;
    width: 1.0rem;
    height: 0.7rem;
    background: url(/static/img/user/spc_bubble_tail.png) no-repeat center / cover;
}

/*말풍선 스타일2*/
.spc_bubble02{display: inline-flex;flex-direction: column; align-items: center;}
.spc_bubble02 div{padding:1.0rem 2.3rem;background:rgba(255,255,255,0.9);border-radius:1.6rem;color:var(--gray-700);font-size:1.5rem;line-height:1.333;text-align:center;    box-shadow: 0 0.2rem 0.7rem rgba(0, 0, 0, 0.05);}
.spc_bubble02:after {
    content: '';
    display: block;
    width: 1.4rem;
    height: 0.8rem;
    background: url(/static/img/user/spc_bubble_tail02.png) no-repeat center / cover;
}

/*말풍선 스타일3*/
.spc_bubble03{display: inline-flex;flex-direction: column; align-items: center;}
.spc_bubble03 div{padding:0.7rem 1.6rem;background:rgba(0,0,0,0.6);border-radius:3.6rem;color:#fff;font-size:1.4rem;line-height:1.333;text-align:center;}
.spc_bubble03:after {
    content: '';
    display: block;
    width: 1.4rem;
    height: 0.8rem;
    background: url(/static/img/user/spc_bubble_tail03.png) no-repeat center / cover;
}


/*온보딩*/
.login_pg {
    padding-top: 0.4rem;
}
.login_pg .container {
	max-width:34rem;
}
.login_pg .container .content{}
.onboard_swiper{width:100%;}
.onboard_swiper .swiper-slide{background:#fff;}
.onboard_swiper .tit_h3{margin-bottom:4.8rem;}
.onboard_swiper .basic_pagination {
    position: absolute;
    bottom: unset;
    top: 8.4rem;
}

.sns_login{
	display: flex;
    flex-direction: column;
    align-items: center;
}
.sns_login .spc_bubble{display: flex;}
.sns_login ul{max-width:29rem;width:100%;margin:0 auto;position:relative;}
.sns_login li{width:6.0rem;}
.sns_login li .btn-icon{border-radius:50%;overflow: hidden;}

.checks_all{border:1px solid var(--border);height:var(--height_lg);display:flex;padding:0 2.0rem;border-radius:1.2rem;}
.checks_all label{width:100%;}
.checks_list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
	margin-bottom:1.2rem;
}
.checks_list li:last-child{margin-bottom:0;}
.checks_list li label span{margin-right:0.5rem;font-weight:600;}
.checks_list li .chk_p{display: flex;align-items: center;}
.checks_list li .btn-icon{width:1.6rem;}


/*스와이프 기본*/
.step_pager{display:flex;align-items: center;}
.step_pager span{width:0.8rem;height:0.8rem;display:block;background-color:#000;opacity:0.2;margin-right:1.0rem;border-radius:50%;}
.step_pager span.active{background-color:#000;opacity:1;width:2.0rem;border-radius:0.5rem;}


/*서브페이지*/
.sign_pg{padding-bottom:8.0rem;}

/*spinner*/
.input_spinner_wrap{
    height: 30.6rem;
	display: flex;
    justify-content: center;
	align-items: center;
	padding:0 1.1rem;
}
.input_spinner {
    display: flex;
    justify-content: center;
	align-items: center;
    height: 25rem;
	width: 100%;
}
.input_spinner .swiper {
    height: 100%;
    width: 100%;
    overflow: hidden;
    transform: translate3d(0, 0, 0);
    will-change: transform;
    transition-timing-function: cubic-bezier(0.33, 1, 0.68, 1); /* 자연스러운 가속감 */
}

.input_spinner .swiper-slide {
	text-align: center;
	font-size: 3.5rem;
	line-height: 7.0rem;
	opacity: 0.3;
	transition: opacity 0.3s;
	font-weight: 700;
}

.input_spinner .swiper-slide-active {
	font-size: 3.8rem;
	opacity: 1 !important;
}


.input_spinner.input_spinner_lg{padding-left:0;padding-right:0;}
.input_spinner.input_spinner_lg .swiper-slide {font-size: 4.0rem;}
.input_spinner.input_spinner_lg .swiper-slide-active{opacity: 1;font-size: 4.5rem;}
.input_spinner .spinner_item.spinner_single{width:9.5rem;}

.input_spinner_wrap{position:relative;}
.input_spinner_wrap .spinner_unit {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 3.0rem;
    transform: translate3d(150%, -48%, 0);
    height: 7rem;
}
.input_spinner_wrap .spinner_unit span{height: 7.0rem;display: flex;align-items: center;justify-content: center;}

/* 큰 텍스트 토글 버튼*/
.btn_sign_toggle{}
.btn_sign_toggle .row {margin: -1.0rem;}
.btn_sign_toggle .row > [class*=col-], .btn_sign_toggle .row > .col {padding:1.0rem;}
.btn_sign_toggle .btn-link{font-size:4.0rem;font-weight: 700;height: 8.0rem;color:#000;opacity:0.3;}
.btn_sign_toggle .btn-link:hover {opacity:1;}
.btn_sign_toggle .btn-link:focus, .btn_sign_toggle .btn-link.focus {opacity:1;}
.btn_sign_toggle .btn-link.disabled, .btn_sign_toggle .btn-link:disabled {opacity:0.3;}
.btn_sign_toggle .btn-link:not(:disabled):not(.disabled):active, .btn_sign_toggle .btn-link:not(:disabled):not(.disabled).active, .show > .btn_sign_toggle .btn-link.dropdown-toggle {opacity:1;}
.btn_sign_toggle .btn-link:not(:disabled):not(.disabled):active:focus, .btn_sign_toggle .btn-link:not(:disabled):not(.disabled).active:focus, .show > .btn_sign_toggle .btn-link.dropdown-toggle:focus {opacity:1;}

.box_toggle{}
.box_toggle .row {margin: -0.5rem;}
.box_toggle .row > [class*=col-], .box_toggle .row > .col {padding:0.5rem;}
.box_toggle .btn {
	position: relative;
    width: 100%;
    font-size: 1.4rem;
    font-weight: 500;
    color: #000;
    border: 1px solid var(--border);
    flex-direction: column;
    height: auto;
    padding: 0.5rem;
    min-height: 9.5rem;
}
.box_toggle .btn .icon_img{width:4.4rem;margin-bottom:1.1rem;}
.box_toggle .btn .check_img {
    width: 2.0rem;
    position: absolute;
    right: 1.0rem;
    top: 1.0rem;
	display:none;
}
.box_toggle .btn.active{border:2px solid var(--primary-400);}
.box_toggle .btn.active .check_img{display:block;}
.box_toggle .btn.disabled, .btn_sign_toggle .btn:disabled {opacity:0.5;}




/*메인 캐릭터영역*/
.visual_wrap {
    position: relative;
    margin-left: -2.0rem;
    margin-right: -2.0rem;
    width: auto;
}
.visual_wrap:after{content: "";display: block;padding-bottom: calc(310 / 375 * 100%); } 
.visual_wrap_in {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding-left: 2.0rem;
    padding-right: 2.0rem;
}
.main_content {
    padding: 8.6rem 2.0rem 2.0rem;
    border-radius: 0 0 3rem 3rem;
	overflow: hidden;
}
.main_content .time_greet {
    font-size: 2.6rem;
    font-weight: 700;
    color: #000;
    line-height: 1.308;
    min-height: 6.8rem;
    margin-bottom: 1.3rem;
	word-break: keep-all;
}
.character_wrap{position:relative;}
.character_wrap .spc_bubble02{position:absolute;top:0;left:0;width:100%;z-index: 2;}
.character_wrap .character_grain{position:relative;z-index:2;}
.character_wrap .character_mission{position:absolute;bottom:2.0rem;left:0;width:100%;}
.character_wrap .character_area {
    background: url(/static/img/user/main_site.png) no-repeat;
    background-size: contain;
    background-position: center bottom;
    padding-bottom: 2.0rem;
    margin: 0 auto;
	position: relative;
	z-index: 2;
}

.character_wrap .grain_h{width: 100%;position: relative;overflow: hidden; } 
.character_wrap .grain_h:after{content: "";display: block;padding-bottom:calc(186.56 / 250 * 100%)} 
.character_wrap .grain_h img{ position: absolute;width: 100%;height: 100%;object-fit: cover;object-position: center;top: 50%;left: 50%;transform: translate(-50%,-50%);}

.character_wrap .main_site_sdw {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    background: url(/static/img/user/main_site_sdw.png) no-repeat center bottom -0.2rem;
    mix-blend-mode: multiply;
    background-size: contain;
    z-index: 1;
    max-width: 40rem;
    transform: translateX(-50%);
}
.main_content .character_wrap:after {
    content: '';
    display: block;
    width: 37.5rem;
    height: 31.8rem;
    border-radius: 20rem;
    position: absolute;
    filter: blur(100px);
    top: 0;
    left: 50%;
    transform: translate3d(-50%, 0.7rem, 0);
}

.visual_wrap .btn_shadow{background:rgba(0,0,0,0.39);color:#fff;font-size:1.5rem;font-weight:600;height:3.6rem;border-radius:2.0rem;position:absolute;right:1.6rem;bottom:2.0rem; z-index: 3;padding-left:1.8rem;padding-right:1.2rem;}

/*시간대에 따라 변경 되는 부분*/
.main_content.time_morning{background:#FEF18D;}
.main_content.time_lunch{background:#F8B235;}
.main_content.time_dinner{background:#284DAE;}
.main_content.time_lunch .time_greet .text-primary-600, .main_content.time_dinner .time_greet .text-primary-600{color:#fff;}
.main_content.time_morning .character_wrap:after{background: var(--primary);}
.main_content.time_lunch .character_wrap:after{background:#F58300;}
.main_content.time_dinner .character_wrap:after{background:#223A79;}

/*캐릭터에 따라 변경 되는 부분*/
.character_wrap.grain04 .character_area{padding-top:1.5rem;}
.character_wrap.grain05 .character_area{padding-top:3.5rem;}



/*메인 비주얼 중간 부분*/
.main_mid {position: relative;}
.main_box{background:#fff;margin-bottom:1.5rem;border-radius:1.6rem;box-shadow:0 0 1.6rem rgba(0,0,0,0.06);}
.main_box:last-child{margin-bottom:0;}


/*메인박스 모양*/
.main_box01{padding:2.0rem;}
.main_box02{padding:2.5rem 2.5rem 1.0rem;}
.main_box03{padding:2.5rem;}

/*main_box01 탭*/
.meal_tab{width:9.0rem;}
.meal_tab .nav-item{margin-bottom:0.8rem; width: 100%;}
.meal_tab .nav-item:last-child{margin-bottom:0;}
.meal_tab .nav-link {
    display: flex;
    width: 100%;
    height: 4.4rem;
    border: 0;
    border-radius: 1.2rem;
    background: #F0F0F0;
    font-size: 1.6rem;
    color: var(--gray-600);
    align-items: center;
    justify-content: center;
	font-weight:500;
}
.meal_tab .nav-link img{width:2.0rem;margin-right:0.8rem;}
.meal_tab .nav-link .sm_meal_on{display:none;}


.meal_tab .nav-link[aria-selected="false"]{color: var(--gray-600);}
.meal_tab .nav-link[aria-selected="true"], .meal_tab .nav-link.active, .meal_tab .nav-link.on{color: #000;}
.meal_tab .nav-link[aria-selected="false"] .sm_meal_on{display:none;}
.meal_tab .nav-link[aria-selected="false"] .sm_meal_off{display:block;}
.meal_tab .nav-link[aria-selected="true"] .sm_meal_off, .meal_tab .nav-link.active .sm_meal_off, .meal_tab .nav-link.on .sm_meal_off{display:none;}
.meal_tab .nav-link[aria-selected="true"] .sm_meal_on, .meal_tab .nav-link.active .sm_meal_on, .meal_tab .nav-link.on .sm_meal_on{display:block;}


/*식사기록*/
.checks.checks_meal .chk_p{color:var(--gray-300);}
.checks.checks_meal input:checked ~ .chk_p{color:#000;}
.checks.checks_meal .ic_box{margin-right:0.5rem;}
.main_record {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
	padding:1.8rem 0;
	text-align: center;
}
.main_record *{word-break: keep-all;}


.record_btn{position:absolute;right:0;top:0.5rem;z-index:1;}
.meal_check_btn{display:none;}
.meal_check{display:none;}

.record_btn_wrap{height: 29rem;width: fit-content;}
.meal_record {
    width: 23rem;
    height: 29rem;
    display: flex;
    margin-right: 2.0rem;
    padding: 4.0rem 2.0rem 2.0rem;
    border: 1px solid var(--border);
    border-radius: 1.6rem;
    flex-direction: column;
    flex-shrink: 0;
    justify-content: space-between;
}
.meal_record:last-child{margin-right:0;}
.meal_record_top{
	position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    min-height: 11.2rem;
}
.meal_record_top .record_btn{top:-1.3rem;}
.meal_record_bottom{margin-top:auto;}/*20250828 추가*/
.meal_record_bottom .meal_value {
    background: var(--gray-50);
    border-radius: 1.0rem;
    padding: 1.25rem 1.5rem;
    line-height: 1.5;
    align-items: center;
    font-weight: 500;
}
.meal_record_bottom .meal_value .rect{width:5.4rem;border-radius:1.2rem; flex-shrink: 0;}

.word_box{text-align:center;font-size:1.5rem;padding:1.0rem 0;font-weight:600;border-radius: 1.0rem;}
.word_box.word_gray {
    color: var(--gray);
    background: var(--gray-50);
}
.word_box.word_orange {
    color: #FA8F55;
    background: rgba(250,143,85,0.12);
}

.record_info {
    background: url(/static/img/user/record_info.png) no-repeat right bottom;
    height: 11rem;
    padding: 2.0rem;
    background-color: #ced8fc;
    background-size: contain;
}

/*배송현황 프로그래브바 열림/닫힘*/
.delivery_form .btn {
    padding: 0;
    width: 100%;
    text-align: left;
    height: auto;
}
.delivery_form .btn[aria-expanded="false"] img, .delivery_form .btn[aria-expanded="false"] img{transform: rotate(0deg);}
.delivery_form .btn[aria-expanded="true"] img, .delivery_form .btn[aria-expanded="true"] img{transform: rotate(180deg);}

.delivery_prgr_item{padding:1.0rem 0;}
.delivery_prgr_item ul {
    position: relative;
    display: flex;
	margin-left:-2.0rem;
	margin-right:-2.0rem;
}
.delivery_prgr_item .delivery_progress {
    font-size: 1.2rem;
    color: var(--gray-300);
	position: relative;
	width: 33.3333%;
	text-align: center;
	line-height: 1.4rem;
}	
.delivery_prgr_item .delivery_progress.active{color:var(--secondary);}
.delivery_prgr_item ul:after {
    content: '';
    display: block;
    height: 0.6rem;
    background: var(--gray-100);
    position: absolute;
    left: 16%;
    right: 16%;
    top: 0.7rem;
}
.delivery_prgr_item .delivery_progress .progress_ing{position: relative;display: block; height: 2.0rem;margin-bottom:1.0rem;}
.delivery_prgr_item .delivery_progress .progress_ing:before {
    content: '';
    display: block;
    width: 2.0rem;
    height: 2.0rem;
    background: var(--gray-100);
    border-radius: 50%;
    z-index: 1;
    position: absolute;
    right: 50%;
    transform: translateX(50%);
}
.delivery_prgr_item .delivery_progress.active .progress_ing:before{background: var(--secondary);}
.delivery_prgr_item .delivery_progress.active .progress_ing:after {
    content: '';
    display: block;
    width: 100%;
    height: 0.6rem;
    background: var(--secondary);
    position: absolute;
    right: 50%;
    top: 0.7rem;
    z-index: 1;
}
.delivery_prgr_item .delivery_progress:nth-child(1) .progress_ing:after{display:none;}


/*기본프로그래스바*/
.basic_progress{background:var(--gray-50);border-radius:2.0rem;height:1.5rem;position:relative;overflow: auto;box-shadow: 0 0.1rem 0.2rem rgba(0,0,0,0.05) inset;}
.basic_progress .progress_ing {
    height: 1.5rem;
    overflow: hidden;
    display: block;
	background: linear-gradient(90deg, #F8C327, #F2A20E);
	border-radius:2.0rem;
}

.banner_wrap{position:relative;display:block;}
.banner_wrap .banner_more, .banner_wrap .banner_tag, .swiper_banner .autoplay-progress{
    padding: 0.15rem 1.0rem;
    border: 1px solid rgba(255, 255, 255, 0.4);
    color: #fff;
    font-size: 1.2rem;
    border-radius: 2.0rem;
    background: rgba(28, 28, 30, 0.4);
    position: absolute;
    z-index: 1;
}
.banner_wrap .banner_more {
    left: 2.0rem;
    top: 1.5rem;
	display: inline-block;
}
.banner_wrap .banner_tag {
    right: 2.0rem;
    top: 1.5rem;
	display: inline-block;
}
.rect_bottom_banner{width: 100%;position: relative;overflow: hidden; border-radius:1.6rem;} 
.rect_bottom_banner:after{content: "";display: block;padding-bottom: calc(110 / 335 * 100%); } 
.rect_bottom_banner img{ position: absolute;width: 100%;height: 100%;object-fit: cover;object-position: center;top: 50%;left: 50%;transform: translate(-50%,-50%);}

.rect_banner{width: 100%;position: relative;} 
.rect_banner:after{content: "";display: block;padding-bottom: calc(190 / 335 * 100%); } 
.rect_banner img{ position: absolute;width: 100%;height: 100%;object-fit: cover;object-position: center;top: 50%;left: 50%;transform: translate(-50%,-50%);}

.swiper_banner{overflow: hidden; border-radius:1.6rem;}
.swiper_banner .banner_wrap .banner_tag {left: 2.0rem;right:unset;}
.swiper_banner .banner_wrap .banner_more {bottom: 1.5rem;top:unset;}
.swiper_banner .autoplay-progress {
    right: 2.0rem;
    bottom: 1.5rem;
}


/*메인 캘린더*/
.week_calendar{padding:1.7rem 1.5rem 1.0rem;background:#fff;border-radius:1.6rem;box-shadow:0 0 1.6rem rgba(0,0,0,0.06);}
.week_calendar ul {
    display: flex;
    text-align: center;
    justify-content: space-around;
    color: #A4A4A5;
    font-size: 1.4rem;
}
.week_calendar li{width:3.0rem;}
.week_calendar li span{height:1.4rem;display:block;margin-top:0.8rem;}
.week_calendar li span.today:after{content:'';display:block;height:0.6rem;width:0.6rem;border-radius:50%;background:var(--primary);margin:0 auto;}



/*식사기록*/
/*큰이미지 업로드*/
.image_upload_lg{display: block;position: relative;}
.upload_box_lg {
    width: 100%;
    cursor: pointer;
    background: url(/static/img/user/btn_add_img2.png) no-repeat center top 37% / 4.0rem;
    background-color: #fff;
    border: 1px solid var(--border);
    border-radius: 1.6rem;
    position: relative;
    padding: 0;
    height: auto;
	overflow: hidden;
}
.upload_box_lg .max_img {
    position: absolute;
    bottom: 50%;
    width: 100%;
    left: 0;
    font-size: 1.6rem;
    text-align: center;
    color: var(--gray-400);
    font-weight: 500;
    transform: translateY(3.5rem);
}
.image_upload_lg.on .upload_box_lg{background: none;border: 1px solid var(--border);}
.image_upload_lg .upload_del {
    position: absolute;
    top: 1.6rem;
    right: 1.6rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    background-color: transparent;
    padding: 0 !important;
    display: none;
}
.image_upload_lg .upload_del img{width:100%;}
.image_upload_lg.on .upload_del{display: flex;}


.upload_modal li {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-right: 1px solid var(--border);
}
.upload_modal li:last-child{border-right:0;}
.upload_modal .img_upload{text-align:center;}
.upload_modal .img_icon {
    width: 6.4rem;
    height: 6.4rem;
    overflow: hidden;
    cursor: pointer;
    background-color: #fff;
    border: 1px solid var(--border);
    border-radius: 50%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
	margin:0 auto;
}

.record_list li{display:flex;padding:0.8rem 0;}

/*자동완성 검색 레이어*/
.sch_layer {
	display:none;
    background: #fff;
    width: 100%;
    position: absolute;
    top: 4.6rem;
}
.sch_layer.show{display:block;}
.sch_layer li a {
    display: flex;
    padding: 1.5rem 2.0rem;
    color: #000;
    font-weight: 500;
    border-bottom: 1px solid var(--border);
    align-items: center;
    min-height: 5.6rem;
	line-height: 1.35;
}
.sch_layer li em{font-weight:700;font-style: normal;}
.sch_layer li:hover{background:var(--gray-50);}

/*입력완료 페이지*/
.complete_img{position: relative;}
.complete_img .mission_complete {
    width: 13.2rem;
    display: block;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}
.confetti_bg {
    display: block;
    width: 100%;
    max-width: 32.2rem;
    margin: 0 auto;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate3d(-50%, -20%, 0);
}

/* toast */
.bottom_toast{
    position: fixed;
    left: 50%;
	bottom:8.6rem;
    transform: translateX(-50%);
	margin:0;
    box-shadow: none;
    font-weight: 300;
    z-index: 999;
    border: 0;
    background: transparent;
	max-width:var(--body_width);
	display: flex;
	justify-content: center;
	padding: 0;
	width: 100%;
}
.bottom_toast .toast_cont {
    padding: 1.2rem 2.3rem;
    background-color: #fff;
    color: #000;
    font-weight: 400;
    border-radius: 1.5rem;
    text-align: center;
    box-shadow: 0 0 1.5rem rgba(0, 0, 0, 0.16);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 5.0rem;
}
.bottom_toast .toast_cont p img{
    margin-right: 0.6rem;
}

/*캐릭터 키우기*/
/*상단버튼*/
.character_pg{background:url(/static/img/user/character_bg.jpg)no-repeat center / cover;min-height: calc(100vh - 5.6rem);}
.crttop_btn{padding:0;height:auto;border-radius:0; flex-direction: column;font-size:1.4rem;font-weight:500; line-height:1.072;align-items: center; justify-content: center;width: 100%;}
.crttop_btn .ic_img {
    width: 5.6rem;
    height: 5.6rem;
    border-radius: 1.2rem;
    display: flex;
    background: #fff;
    align-items: center;
    justify-content: center;
	margin-bottom:1.0rem;
}
.crttop_btn .ic_img img{width:3.6rem;}
.crttop_btn .tit{margin-bottom:0.3rem;}
.crttop_btn .time{color:var(--primary-600);}


.crttop_btn:disabled, .crttop_btn.disabled{
	color: #000 !important;
    background: transparent;
    border-color: transparent;
}
.crttop_btn:disabled img, .crttop_btn.disabled img{filter: grayscale(1);}

/*캐릭터 영역*/
.crtmidd_area{position:relative;}
.crtmidd_area .spc_bubble02{position:absolute;top:0;left:50%;transform: translateX(-50%);width: 100%;}
.crtmidd_area .spc_bubble02 div{min-width:20.4rem;}
.crtmidd_area .bath_time {
    position: absolute;
    left: 2.0rem;
    bottom: 3.8rem;
    background: rgba(255, 255, 255, 0.85);
    border-radius: 3.0rem;
    box-shadow: 0 0 1.5rem rgba(0, 0, 0, 0.16);
    padding: 0.5rem 2.0rem;
    text-align: center;
    line-height: 1.3;
}
.crtmidd_area .bath_time .time{font-size:1.4rem;font-weight:500;}
.crtmidd_area .character_area{display:block;margin:0 auto;width: 100%;position: relative;overflow: hidden;}
.crtmidd_area .character_area:after{content: "";display: block;padding-bottom: calc(250 / 375 * 100%);    width: 100%;} 
.crtmidd_area .character_area .lottie_img{ position: absolute;width: 100%;height: 100%;object-fit: cover;object-position: center;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.raise_area {
    background: #fff;
    margin-bottom: 1.5rem;
    box-shadow: 0 0 1.6rem rgba(0, 0, 0, 0.06);
    padding: 1.5rem 2.0rem;
    border-radius: 1.6rem;
	min-height: 20.2rem;
}
.raise_btn_wrap .row{margin-left:-0.4rem;margin-right:-0.4rem;}
.raise_btn_wrap .col,
.raise_btn_wrap [class*=col-] {
  padding-right: 0.4rem;
  padding-left: 0.4rem;
}
.raise_btn{padding:0.5rem;background:var(--gray-50);border-radius:1.2rem;height:11rem; flex-direction: column;font-weight:500; align-items: center; justify-content: center;width: 100%;}
.raise_btn .ic_img {
    width: 4.4rem;
    height: 4.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
	margin-bottom:0.5rem;
}
.raise_btn .tit{margin-bottom:0.3rem;font-size:1.4rem;color:var(--gray);line-height:1.215;}
.raise_btn .num{line-height:1.188;}

.benefit_menu li .rect{width:4.4rem;}
.benefit_menu li .media {
    display: flex;
    padding: 1.0rem 0;
    align-items: center;
    font-weight: 600;
    font-size: 1.8rem;
	cursor: pointer;
}
.benefit_menu li .media-body{margin-left:1.5rem;margin-right:2.0rem;}
.benefit_menu li .tit{word-break: keep-all;}


/*쌀복권*/
.card_lottery li{margin-bottom:1.0rem;}
.card_lottery li .card_item img{border-radius:1.6rem;cursor: pointer;}

/* .lottery_modal 클래스가 붙은 모달의 modal-dialog에 적용 */
.modal.lottery_modal .modal-dialog {
  opacity: 0;
  transform: translateY(0);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out; /* 기본 트랜지션 효과 */
}

.modal.lottery_modal.show .modal-dialog {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.3s !important;/*modal-dialog 보여지는것을 딜레이*/
}
.modal.lottery_modal.fade .modal-dialog {
  transition: opacity 0.3s ease-out, transform 0.3s ease-out;
}
.modal.lottery_modal.fade .modal-dialog .modal-content {
    border-radius: 0;
    overflow: visible;
    width: 100%;
    max-width: 33.5rem;
}

#card {
    position: relative; 
    perspective: 1000px;
	margin: 0 auto;
}
#card{width: 100%;position: relative;} 
#card:after{content: "";display: block;padding-bottom: calc(460 / 335 * 100%); } 

.card-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    transform-style: preserve-3d;
    animation: flipCard 0.5s ease-in-out forwards;
    animation-delay: 3s;
}

#card .front{ height: 100%;}
#card .front,
#card .back {
    position: absolute;
    width: 100%;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    overflow: hidden;
}
#card .back {
    transform: rotateY(180deg);
}
#card .back img{max-width:16.5rem;}
.card_shape {
    border-radius: 1.2rem;
    cursor: pointer;
    display: block;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
	border-radius:2.4rem;
	overflow: hidden;
}
@keyframes flipCard {
    0% {
        transform: rotateY(0deg);
    }
    100% {
        transform: rotateY(180deg);
    }
}



.friend_pg{min-height: calc(100vh - 5.6rem);background: linear-gradient(180deg, #fff, #D1EBFF); overflow: hidden;}
.friend_pg .gradient_bg{display:block;width:100%;height:50.2rem;position:absolute;top:0;left:0;background: linear-gradient(180deg, #fff, transparent);z-index: 1;}
.friend_pg .character_area{position: relative;z-index: 1;max-width:15rem;}
.friend_pg .round01, .friend_pg .round02, .friend_pg .round03, .friend_pg .round04{display:block;border-radius:50%;background:#829FD2;opacity:0.08;position:absolute;top:46%;left:50%;width:30.6rem;height:30.6rem;animation: town_ani 1.2s ease-in 0s infinite;transform: translate(-50%, -50%) scale(1.0);}
.friend_pg .round01{width:58.4rem;height:58.4rem;}
.friend_pg .round02{width:43.535rem;height:43.535rem;}
.friend_pg .round03{width:29.067rem;height:29.067rem;}
.friend_pg .round04{display:block;border-radius:50%;background:#829FD2;opacity:0.08;position:absolute;top:46%;left:50%;}
.friend_pg .round04{width:16.458rem;height:16.458rem;opacity:0.1;}

@keyframes town_ani {
	0% {transform: translate(-50%, -50%) scale(0.8);opacity:0;}
	50% {transform: translate(-50%, -50%) scale(1.0);opacity:0.08;}
	100% {transform: translate(-50%, -50%) scale(1.2);opacity:0;}
}
.friend_icon_wrap span {
    color: var(--gray-800);
    display: flex;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.friend_icon_wrap .name{width:6.0rem;height:6.0rem;background:rgba(255,255,255,0.4);border-radius:50%;border:1px solid #fff;font-weight:700;
	color: var(--gray-800);
    position: absolute;
    top: 50%;
    left: 50%;}

.scroll_btn_wrap li{position: relative;margin-right: 1.0rem;}
.scroll_btn {
    background: #fff;
    height: 9.0rem;
    width: 13rem;
    border-radius: 1.6rem;
    padding-left: 1.5rem;
    padding-right: 1.0rem;
    font-size: 1.5rem;
    line-height: 2.2rem;
}

.scroll_btn img{margin-right:1.0rem;}
.scroll_btn_wrap li .spc_bubble03{position: absolute;top:-1.5rem;right:1.0rem;}


.recommend_list li {
    padding: 1.5rem 0;
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
}
.recommend_list.recommend_list02 li {padding: 0.5rem 0;}
.recommend_list li .rank_front {
    width: 5.6rem;
    height: 5.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.recommend_list li .rank_front img {
    width: 3.6rem;
    height: 3.6rem;
    flex-shrink: 0;
}

.stay_time{background:var(--gray-50);padding:0.6rem 2.0rem;}

/*하단메뉴*/
.bt_menu {
    width: calc(100% + 2px);
    max-width: var(--body_width);
    background: #fff;
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    display: block;
	border-radius:1.6rem 1.6rem 0 0;
	box-shadow:0 -0.4rem 1.0rem rgba(0,0,0,0.03);
}
.bt_menu ul{display: flex;justify-content: space-between;align-items: center;text-align:center;padding:0.7rem 1.5rem 0; height:7.0rem;}
.bt_menu ul li{width:20%;}
.bt_menu ul li a {
    display: block;
	color:var(--gray-400);
	font-weight:500;
	font-size:1.3rem;
	line-height: 1.31;
}
.bt_menu ul li .ico {
    width: 2.4rem;
    display: block;
    margin: 0 auto;
}
.bt_menu ul li a p{margin-top:1.1rem;word-break: keep-all;}
.bt_menu ul li .img_on{display:none;}
.bt_menu ul li.on a{color:#000;}

.bt_menu ul li.on .img_on{display:block;}
.bt_menu ul li.on .img_off{display:none;}


/*에디터스타일*/
/*.edit_area *{line-height: 1.6em;margin-bottom:0.3rem;}
.edit_area h1 {font-size: 2.3em;line-height: 1.2em;margin-bottom:0.8rem;}
.edit_area h2 {font-size: 1.84em;line-height: 1.2em;margin-bottom:0.5rem;}*/


/*스와이프 공통*/
.default_pager.swiper-pagination-fraction {
    background: var(--dark);
    color: #fff;
    border-radius: 2.0rem;
    padding: 0.8rem 1.0rem 0.6rem;
    font-size: 1.2rem;
    width: auto;
    left: unset;
    right: 2.0rem;
    bottom: 1.0rem;
    position: absolute;
}
.default_pager.swiper-pagination-bullets{display:flex;justify-content: center;}
.default_pager .swiper-pagination-bullet{background: var(--border);opacity:1;width:0.6rem;height:0.6rem;margin: 0 0.3rem;}
.default_pager .swiper-pagination-bullet-active {background: var(--primary);opacity: 1;}
.default_pager.swiper-horizontal>.swiper-pagination-bullets, .default_pager .swiper-pagination-bullets.swiper-pagination-horizontal {bottom: 1.1rem;}



/*아코디언 베이직*/
/* 초기 상태에서는 화살표 아래 아이콘을 보여줌 */
.accordion_basic li{}
.accordion_basic li:last-child{}
.accordion_basic .hd_btn {
    padding: 1.6rem 2.0rem;
    height: auto;
    width: 100%;
    text-align: left;
}
.accordion_basic .content{margin:0 2.0rem;background:var(--light);padding:2.0rem;border-radius:1.2rem;}
.accordion_basic .btn[aria-expanded="false"] img, .accordion_box .btn[aria-expanded="false"] img{transform: rotate(0deg);}
.accordion_basic .btn[aria-expanded="true"] img, .accordion_box .btn[aria-expanded="true"] img{transform: rotate(180deg);}


/*푸터*/
.ft{padding:4.0rem 0 10rem;}
.ft .ft_logo{width:12.24rem;}
.ft .fnb a {
    display: inline-block;
    font-weight: 600;
    color: var(--gray-500);
    padding: 0 1.0rem;
    border-right: 1px solid var(--border-200);
    line-height: 1;
}
.ft .fnb a:nth-child(1){padding-left:0;}
.ft .fnb a:last-child{border-right:0;}
.ft .ft_info {
    gap: 0.2rem;
    display: flex;
    flex-wrap: wrap;
}
.ft .ft_info span{margin-right:0.8rem;}







/* 초기 상태에서는 화살표 아래 아이콘을 보여줌 */
.collapse_ex .btn[aria-expanded="false"] img{transform: rotate(0deg);}

 /* 펼쳐진 상태에서는 화살표 위 아이콘을 보여줌 */
.collapse_ex .btn[aria-expanded="true"] img{transform: rotate(180deg);}



.y-tag{display:inline-block; padding:0.4rem 0.8rem; color:#904310; background-color:#FAD755; font-size:1.2rem; line-height: 1.3rem; font-weight:600; border-radius:0.6rem;}
.text-nowrap{white-space: nowrap;}
.relative{position:relative;}
.glay-line{width:100%; height:1rem; background-color:#F6F6F6;}
.f6_bg{background-color:#F6F6F6;}
.recom{display:inline-block; padding:0.5rem 0.8rem; color:#fff; background-color:#000; font-size:1.3rem; line-height: 1.3rem; font-weight:600; border-radius:0.6rem;}


/*마이페이지*/
.my-sec3{display: flex; align-items: center; padding: 1.5rem 2rem;  background-color: #F6F6F6;  border-radius: 1.2rem;}
.my-sec3 .line{width:0.1rem; height:5rem; background-color:#E7E7E7;}
.tell_btn{border:0.1rem solid var(--border-200); border-radius:1.2rem; display: flex; gap:0.5rem;  align-items: center;  justify-content: space-between;  padding: 1.3rem 1.8rem;}
.my_menu{border-bottom: 1rem solid #f6f6f6; margin-bottom: 3rem; padding: 0 2rem 1.5rem;}
.my_menu ul{ display: flex; flex-wrap: wrap; gap:0.5rem 2rem;}
.my_menu ul li{width: calc(50% - 1rem);}
.sub_pg.my_posts{overflow:hidden;}
.faq .accordion_basic .hd_btn{padding: 1.6rem 0rem;color:#000;}
.faq .accordion_basic .content{margin:0;}
.terms-con{background-color:#f6f6f6; padding:2rem;}
.notice_list li{padding:1.6rem 0;}
.notice_list li img{width: 2.5rem; min-width: 2.5rem; aspect-ratio: 1 / 1;}
.notice-tit{padding:1.5rem 2rem 2rem; border-bottom:0.1rem solid #E7E7E7;}
.notice-detail{padding:2.5rem 2rem 3rem;}
.notify-box{padding: 2.5rem; border-radius: 1.6rem;  border: 0.1rem solid #e7e7e7;}
.app-info{min-height:50rem; display:flex; justify-content: center; align-items: center;}
.caution{padding: 2.0rem; border-radius: 1.6rem;  border: 0.1rem solid #e7e7e7; display: flex;  align-items: start;  gap: 1rem; }
.container-check{margin-bottom:3rem;}
.container-check .checks{width:calc((100% / 2) - 0.5rem); margin: 0;}
.container-check.report .checks label{align-items: start;}
.container-check.report .checks .ic_box{margin-top: 0.4rem;}
.container-check.report .checks p{line-height:2.6rem; word-break: keep-all;}
.report_btn{padding: 2rem 2rem 1rem; background-color: #fff;  position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); width: 100%; max-width: 576px;}
.collected-rice{padding: 2.5rem 3rem; background-color: #f6f6f6; border-radius: 1.6rem;}
.collected-rice .bag_wrap{display: flex; justify-content: space-around; align-items: flex-end;}
.collected-rice .bag_wrap .relative{width: 90px; min-width: 75px; text-align:center; padding-top:5rem;}
.collected-rice .bag_wrap .relative > p{font-size: 1.4rem; font-weight: 500;  margin-top: 0.5rem;}
.collected-rice .bag_wrap .speech-bk-bubble{position:absolute; padding: 0.6rem 1rem; background-color: #000;  border-radius: 5rem;  top: 0;  left: 50%; transform: translateX(-50%);}
.collected-rice .bag_wrap .speech-bk-bubble img{position:absolute; left: 50%; transform: translateX(-50%);  bottom: -0.7rem;}
.collected-rice .bag_wrap .speech-bk-bubble p{color: #fff; white-space: nowrap; font-size: 1.4rem; font-weight: 500;}
.bag-box{max-width: 6rem;  margin: auto;  display: flex; flex-wrap: wrap;}
.bag-box .bag_mid{background: url(/static/img/user/bag_mid.png); width: 100%; background-size: 6rem; max-height:6rem; min-height:0;}
.grain_btn{padding:0 2rem;}
.grain_btn ul li{width: 120px;}
.grain_btn ul li a{ aspect-ratio: 1 / 1; padding: 2rem; display: block; background-color: #f6f6f6;  border-radius: 1.6rem;}
.grain_btn ul li img{width:4.4rem;}
.grain_btn ul li p{white-space: nowrap;}
.ad-box img{width:100%; border-radius:1.6rem;}
.ad-box .ad-tag{position: absolute; z-index: 1;  right: 2rem;   top: 1.5rem;   border: 0.1rem solid #FFFFFF66;  border-radius: 5rem;  color: #fff; width: 3.5rem; height: 2.4rem; line-height: 2.4rem; text-align: center;}
.history_top{box-shadow: 0 0 1.6rem 0 #0000000F;  padding: 1.8rem 1.5rem;  border-radius: 1.6rem; margin-bottom:2rem;}
.history_top img{width:2.6rem;}
.his-list{border-bottom:0.1rem solid #E7E7E7; padding: 1.0rem 2.0rem;;}
.his-list li{padding:1.3rem 0;}
.his-list li > div:nth-child(1){margin-bottom:0.2rem;}
.leave_btn{font-weight: 500;font-style: 500; color:#888888;font-size: 1.6rem; line-height: 2.6rem;text-align: center;text-decoration: underline;text-decoration-style: solid;text-decoration-offset: 0%; text-decoration-thickness: 0%;}
.leave-con{list-style: decimal;padding-left:2rem;}
.leave-con li{padding-left:0.5.rem;}
.leave-con li::marker{color:#454545;}
.leave-con li p{line-height:2.4rem; color:#454545; word-break: keep-all;}
.consent-btn{    border: 0.1rem solid var(--Black-100, #E7E7E7); padding: 1.5rem 2rem;  border-radius: 1.2rem;}
.consent-btn .checks_wr{margin-bottom:0;}
.consent-btn .checks_wr .checks{margin-bottom: 0; margin-right: 0;}
.my_hashtag ul{display: flex; gap: 1rem; margin-bottom: 2rem;}
.my_hashtag ul li{width: calc(100% / 3); padding: 1.2rem 0; text-align: center; border: 0.1rem solid #E7E7E7; border-radius: 1.2rem;}
.my_hashtag ul li p{font-size: 1.4rem; font-weight: 500; margin-top: 1rem;}
.my_hashtag ul li img{width:4.4rem;}
.my_hashtag button{font-size: 1.6rem; line-height: 100%; font-weight: 600;  background-color: #fff;  border: 0.1rem solid #D1D1D1;  border-radius: 5rem;  padding: 1.45rem 2rem 1.45rem 2.5rem;color:#000;}

/*정기구독*/
.reward-bk{background-color: #000; border-radius: 3rem; margin-top: 1.2rem; position: relative; text-align: center; padding: 1.2rem 3rem; display: inline-block;}
.reward-bk img{position: absolute; left: 50%; top: -0.7rem; transform: translateX(-50%);}
.reward-bk p{font-size:1.4rem; font-weight:500; color:#fff;}
.reding-list{margin-bottom:1.5rem;}
.reding-list:last-child{margin-bottom:0;}
.reding-list label, .reding-list .label{width: 100%; padding: 1.5rem 1.8rem 1.5rem 2rem;  border: 0.1rem solid #e7e7e7;  border-radius: 1.2rem; cursor: pointer;}
.reding-list label.active{border: 0.2rem solid #F8C327;}
.reding-list .ic_box {display: inline-flex;  flex-shrink: 0;  position: relative; width: 2.0rem; height: 2.0rem; text-align: center;  background-color: #fff;   display: flex;  align-items: center;  justify-content: center;  margin-right: 1.0rem;  border-radius: 2.0rem;  border: 0.1rem solid var(--gray-300);}
.reding-list .ic_box:after {content: '';  display: block;   width: 0.8rem;   height: 0.8rem;  border-radius: 50%;   background-color: var(--gray-200);}
.reding-list input {display: none;}
.reding-list label.active .ic_box {background-color: var(--primary-400);   border-color: var(--primary-400);   border-width: 0.2rem;}
.reding-list label.active .ic_box:after {content: '';  display: block;   width: 0.8rem;  height: 0.8rem;  border-radius: 50%; background-color: #fff;}
.reding-list .icon-tag {display: inline-block; line-height: 2.4rem; width: 2.4rem; height: 2.4rem; border-radius: 50%; text-align: center;  color: #fff; font-size: 1.6rem;  font-weight: 600;}
.bronze{ background-color: #E68669;}
.silver{background-color:#9D9D9D}
.gold{background-color:#FAA926}
.platinum{background-color:#7794C9}
.master{background-color:#8047D0}
.reading-guide2 .box_toggle .btn{padding:3rem 0.5rem;}
.rice-character{width:8rem;}
.order-goods{border-radius:1.2rem; border:0.1rem solid #E7E7E7; padding:1.5rem 2rem;}
.means_payment1{display: flex;  flex-wrap: wrap;  gap: 0.6rem; margin-bottom:1.5rem;}
.means_payment1 .radios{width:calc((100% / 2) - 0.3rem)}
.means_payment2{display: flex;  flex-wrap: wrap;  gap: 1rem;}
.means_payment2 .radios{width:calc((100% / 2) - 0.5rem)}
.means_payment2 .radios .ic_box{width: 100%; height: 5.6rem;  border-radius: 1.2rem;  border: 0.1rem solid #d1d1d1; margin-right: 0;}
.means_payment2 .radios .ic_box:after{display:none;}
.means_payment2 .radios input:checked + .ic_box{background-color: transparent; border: 0.1rem solid #000;}
.means_payment2 .radios input:checked + .ic_box:after{display:none;}
.reading-guide-con{background-color:#F6F6F6; width:100%; border-radius:1.2rem; padding:1.5rem 2rem;}
.direct-input {display: none;}
.delivery-addr-list li{padding:2rem 0; border-bottom:0.1rem solid #E7E7E7;}
.delivery-addr-list li .radios .ic_box{margin-top:4px;}
.modal-g-bg{background-color:#F6F6F6; padding:1rem; border-radius:1rem;}

/*캘린더*/
.calender_top{display: flex; align-items: center;  justify-content: space-between; padding: 0 2rem 1.5rem;}
.calender_top button{ background-color: transparent; border: 0;}
.calender_box table{width:100%;}
.calender_box table thead th{font-size: 14px; font-weight: 500; text-align: center; color: #1C1C1E; opacity: 0.4; padding: 1rem 0; border-bottom: 0.1rem solid #f6f6f6;}
.calender_box table tbody td{font-size: 16px; font-weight: 500; text-align: center; padding: 0.5rem 0 2rem; border-bottom: 0.1rem solid var(--border); cursor: pointer;}
.calender_box table tbody td .today{display:inline-block; width:6px; height:6px; background-color:#fff; border-radius:50%;}
.calender_box table tbody td .today.on{display:inline-block; width:6px; height:6px; background-color:#F8C327; border-radius:50%;}
.calender_box table tbody td .calendar_img{width: 30px; aspect-ratio: 15 / 17; margin: 0.6rem auto 0;}
.calender_box table tbody td p{line-height:2.0rem;}
.calender_bottom{padding: 3rem 2rem;}
.calender_bottom .click-day{margin-bottom:2.5rem;}
.click-day-info{display: flex; gap:1.5rem; flex-wrap: wrap;}
.click-day-info li{display: flex; padding: 2rem; align-items: center;  gap: 2rem;  border: 1px solid #E7E7E7;  border-radius: 1.6rem;  width: 100%; flex-shrink:0;}
.click-day-info li .left{display: flex;  align-items: center; gap: 1.5rem;}
.click-day-info li .left img{min-width: 2rem; max-width:2rem; aspect-ratio: 1 / 1;}
.click-day-info li .right button{display: flex;  align-items: center; gap: 1rem; background-color: transparent; border: 0;color:#000;}
.modal-calendar{display: flex; padding:2rem; max-height:18.8rem; overflow:hidden;}
.modal-calendar .w-50 {position: relative; scroll-snap-type: y mandatory; -webkit-overflow-scrolling: touch; /* iOS 부드러운 스크롤 */ height: 16.8rem; /* 필요 시 조정 */ cursor: grab; overflow-y: auto;-ms-overflow-style:none /* IE and Edge */ scrollbar-width:none /* Firefox */}
.modal-calendar .w-50::-webkit-scrollbar {display:none /* Chrome , Safari , Opera */}
.modal-calendar .year, .modal-calendar .month{text-align:center; height:5.6rem; display:flex; align-items:center; scroll-snap-align: center;}
.modal-calendar .year p, .modal-calendar .month p{font-size:18px; font-weight:500; color:#888;  width:100%;     text-align: center;}
.modal-calendar .year.on p, .modal-calendar .month.on p{font-size:26px; font-weight:700; color:#000;}
.modal-calendar .w-50::before,
.modal-calendar .w-50::after { content: ''; position: absolute; left: 0; right: 0; height: 5.6rem; /* 항목 하나 높이와 같게 */ z-index: 2; pointer-events: none;}

/*내 쌀통*/
.gauge-box{box-shadow: 0px 1px 2px 0px #0000000D inset; background-color:#F6F6F6; border-radius:2rem; overflow:hidden; height:1.5rem;}
.gauge-box .gauge{background: linear-gradient(90deg, #F8C327 0%, #F2A20E 100%); height:100%; border-radius:2rem;}
.delivery-status{border:0; background-color:#fff;}
.delivery-status-list{padding:1rem 0; margin-bottom:1rem; margin-top:1rem;}
.delivery-status-list:last-child{margin-bottom:0; margin-top:0;}
.delivery-fold{transition: 0.3s all;}
.delivery-status[aria-expanded="false"] img{transform: rotate(0deg);}
.delivery-status[aria-expanded="true"] img{transform: rotate(-180deg);}
.shipping{width:100%; text-align: center;}
.shipping .circle-ck{width: 1.6rem; aspect-ratio: 1 / 1;  background-color: #E7E7E7;  margin: auto;  border-radius: 50%; margin-top: 0.2rem; position: relative; z-index: 2;}
.shipping p{font-size:1.2rem; font-weight:500; line-height:100%; color:#B0B0B0; }
.shipping p:nth-child(2){margin-top:0.5rem;}
.shipping.on .circle-ck{width: 2rem; background-color: #FA8F55; margin-top: 0rem;}
.shipping.on p{color:#FA8F55;}
.rectangle-line{position:absolute; left: 50%;  transform: translateX(-50%);  width: 70%; max-width: 345px; top:1.7rem; background-color:#e7e7e7; height:0.6rem; z-index:0;}
.payment-details li{padding:1.5rem 0; border-bottom:0.1rem solid #E7E7E7;}
.payment-details-img{width:7rem; height:7rem; aspect-ratio: 1 / 1; background-color:#F6F6F6; border-radius:1.2rem; overflow:hidden;}
.product-img-box{width:9rem; height:9rem; aspect-ratio: 1 / 1; background-color:#F6F6F6; border-radius:1.2rem; overflow:hidden;}
.product-img-box .recom{position:absolute; top:0.6rem; left:0.6rem; z-index:1;}
.collected-rice-slide{padding-bottom:3.8rem;}
.collected-rice-slide ul li{width:30rem; padding-right:2rem;}
.collected-rice-slide ul li > .d-flex{margin-bottom:1.5rem; width: 100%;}
.collected-rice-slide ul li > .d-flex:last-child{margin-bottom:0;}
.collected-rice-slide .swiper-pagination-bullet-active{background:#000; width:2rem; border-radius:2rem}
.look-btn button{border:0; background-color:transparent ; width:100%;}
.product-list-slide{margin-bottom:2.7rem;}
.product-list-slide ul li{border-radius:1.6rem; overflow:hidden; text-align:center;}
.product-list-slide ul li .recom{position:absolute; top:1rem; left:1rem;}
.product-list-slide ul li .rice-bag-img{width:15rem; aspect-ratio: 1 / 1; margin:1.5rem auto; }
.product-list-slide ul li > div{padding:3rem 2rem;}
.product-list-slide.swiper-backface-hidden ul li{transform: scale(0.9); transition: 0.5s all;}
.product-list-slide.swiper-backface-hidden ul li.swiper-slide-active{transform: scale(1);}
.slide-bg1{background: #727AB5B2;}
.slide-bg2{background: #A8A0E2B2;}
.slide-bg3{background: #81BDD5B2;}
.slide-bg4{background: #E29D77B2;}
.slide-bg5{background: #82D2A9B2;}
.slide-bg6{background: #FEEFABB2;}
.slide-bg7{background: #E0A1A8B2;}
.slide-bg8{background: #7C7C7CB2;}
.product-detail-img{border-radius:1.6rem; padding:2rem; aspect-ratio: 1 / 1; display:flex; }
.product-detail-img .img-box{width:70%; aspect-ratio: 1 / 1; margin:auto;}
.product-check-btn-box{display: flex;  flex-wrap: wrap;  gap: 1.1rem;  padding: 1.6rem 2rem;  border: 0.1rem solid #E7E7E7;  border-radius: 1.2rem;}
.product-li{display: flex;  align-items: center;  justify-content: space-between; width: 100%;}
.product-li .check-btn{width: auto;  display: inline-block;  height: auto;   padding: 0.7rem 1rem;  border: 0.1rem solid #D1D1D1;  border-radius: 0.8rem;  background-color: #fff; margin: 0; background-image: none;}
.checks input:checked + .ic_box.check-btn {background-color: #fff; border-color:#000; background-image: none;}
.checks input:disabled + .ic_box.check-btn{background-color: #D1D1D1; border-color:#D1D1D1; color:#888888; background-image: none;}
.ex-product-img{ aspect-ratio: 1 / 1;width:7rem; border-radius:1.2rem; background-color:#f6f6f6; overflow:hidden;}
.selected-options li{width: 100%; padding: 1.5rem 0; display: flex; align-items: center;  justify-content: space-between;  border-bottom: 0.1rem solid #E7E7E7}
.selected-options li:last-child{border:0; padding-bottom:0;}
.selected-options li:nth-child(1){ padding-top:0;}
.order-detail-box1{border:0.1rem solid #E7E7E7; border-radius:1.6rem; padding:2rem;}
.select-option-list li{width: 100%; padding: 1.2rem 0; display: flex; align-items: center;  justify-content: space-between;  border-bottom: 0.1rem solid #E7E7E7}
.select-option-list li:last-child{border:0;}
.deliver-info ul li{display: flex; align-items: center; margin-bottom:0.5rem;}
.deliver-info ul li:last-child{ margin-bottom:0;}
.deliver-info ul li p:nth-child(1){min-width:9rem;}

/*커뮤니티*/
.community-top{display:flex;  align-items: center;  justify-content: space-between; padding:0 2rem 1.5rem;}
.today-board-slide{padding:0 2rem 3rem;}
.today-board-thumbnail{border-radius:1.2rem; overflow:hidden;display:block;}
.today-board-slide .swiper-pagination-bullet-active{background:#000; width:2rem; border-radius:2rem}
.today-board-slide .swiper-horizontal>.swiper-pagination-bullets, .today-board-slide .swiper-pagination-bullets.swiper-pagination-horizontal{bottom: var(--swiper-pagination-bottom, 0px);}
.community-banner{border-radius:1.6rem; overflow:hidden;}
.community-banner .swiper-pagination{display: inline-block;  width: auto; min-width:4.7rem;  left: auto;  right: 1rem;  bottom: 1rem;  border: 1px solid #FFFFFF66;  background: #1C1C1E66;  color: #fff; font-size:1.2rem; padding: 0.4rem 0.9rem; border-radius:5rem;}
.free-board-filter button{ background-color: transparent;  border: 0; display: flex; align-items: center; gap: 0.2rem; height: var(--height_md); padding: 0.5rem 3rem 0.5rem 2rem; border: 0.1rem solid #d1d1d1; border-radius: 5rem;color:#000;}
.free-board-filter button p{white-space: nowrap;}
.free-board-filter button img{width:1.4rem;}
.sch-btn{background: #F6F6F6; border-radius: 5rem;  display: flex; align-items: center; gap: 0.5rem; padding:0.5rem 2rem; height: var(--height_md); }
.sch-btn .img{width:1.6rem;}
.commu_list:last-child{border-bottom:0;}
.community_detail_top{padding:0 2rem 2rem; border-bottom:0.1rem solid #E7E7E7}
.community_detail_top .tit_h5{color:#D67C09;}
.community_detail_top span.rectangle{background-color:#d1d1d1; width:0.4rem; height:0.4rem;}
.community_detail{padding:2.5rem 2rem; border-bottom:0.1rem solid #E7E7E7;}
.community_detail .like_btn{padding: 1.45rem 2rem 1.45rem 2.5rem;  border: 0.1rem solid #d1d1d1;  border-radius: 5rem;  gap: 1rem;  margin: auto;}
.community_detail .like_btn span{margin-right:0;}
.community_detail_info_value{padding: 1.7rem 2rem; }
.community_detail_info_value .info_value{ display: flex; align-items: center; gap: 1rem;}
.community_detail_info_value .info_value .info_span{ display: flex; align-items: center; gap: 0.5rem; }
.comment_box .comment_list{border-bottom:0.1rem solid #f6f6f6;}
.comment_info{display: flex;  align-items: start;  gap: 1rem; padding:2rem;}
.comment_info.active{background-color:#F6F6F6;}
.comment_reply{display: flex;  align-items: start;  gap: 1rem; padding:2rem 2rem 2rem 5rem; }
.comment_reply.active{background-color:#F6F6F6;}
.comment_info .left, .comment_reply .left{min-width:3.6rem; width:3.6rem;  aspect-ratio: 1 / 1;   background-color:#FFE1D0; border-radius:50%; overflow:hidden;}
.comment_info .left img, .comment_reply .left img{width:100%; aspect-ratio: 1 / 1; object-fit: cover;}
.comment_info .right, .comment_reply .right{width:100%;}
.reply_btn{display:flex;  align-items: center; gap: 0.8rem; font-size:1.4rem; font-weight:500; color:#6d6d6d; border:0; background-color:transparent;}
.write_ip {display: flex; background: var(--light); padding: 0 1.5rem 0 1.5rem; border-radius: 2.4rem; width: 100%;}
.write_ip .form-control{height:4.8rem;padding: 0.5rem 0;margin-right:1.2rem;border: 0;}
.write_ip textarea.form-control{min-height: auto;padding-top: 1.5rem;background: transparent;max-height: 10rem;}
.write_ip .form-control:focus {background-color: transparent;}
.write_ip button{width:3.2rem;height:3.2rem;border:0;background: transparent;margin-top:0.75rem;padding: 0;flex-shrink: 0;color:#000;}
.write_ip .name_tag{color:#000;flex-shrink: 0;padding-left:0.5rem;padding-right: 0.5rem;}
.write_send{position:relative;}
.write_send:before{
    content: ''; display: block; width: 3.2rem; height: 3.2rem; position: absolute; top: 0;left: 0; background:url(/static/img/user/send_off.svg); cursor: pointer;
    -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain;
   -webkit-mask: var(--ic_send); mask: var(--ic_send);
}

.write_send.active:before {
    background:url(/static/img/user/send_on.svg);
}
.write_send.active{background: url(/static/img/user/send_on.svg);}
/*.write_ip .form-control:focus + .write_send:before, .write_send:hover:before, .write_send:active:before{background: url(/static/img/user/send_on.svg);}*/
.recommend-rice-info ul li{display:none; text-align:center;}
.recommend-rice-info ul li.on{display:block;}

.sparks_wrap {
    position: relative;
}
.sparks_bg {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 4.4rem;
    transform: translate3d(-43%, -50%, 0);
}

/*반응형 max 1200 xl*/
@media (max-width: 1199.98px) { 


} 

/*반응형 max 992px lg*/
@media (max-width: 991.98px) {




 } 


/*반응형 max 767px md*/
@media (max-width: 767.98px) { 

	.m_menu_wr{width: 100%; left: 50%; transform: translate(-50%); max-width:var(--body_width);}
	.menu_bg{width: 100%; left: 50%;}
	.menu_on .m_nav{max-width: 80%;}

	
} 

/*반응형 max 576px sm*/
@media (max-width: 575.98px) { 

	.mobile_wr {
		border-left: 0;
		border-right: 0;
	}
	.go_top {right: 1.0rem;transform: translateX(0);}
	.fixed_btn {right: 1.0rem;transform: translateX(0);}

	/*메인 캘린더*/
	.week_calendar ul {
		justify-content: space-between;
	}
    
    
} 

/*반응형 max 360px*/
@media (max-width: 360px) {
	html { font-size:9.4px; }
	.badge { padding: 0.4rem 0.8rem;}
	.btn-group-wrap .btn{margin-bottom:0.6rem !important;margin-right:0.4rem;}
	.nav_tab_line .nav-link.active, .nav_tab_line .nav-item.show .nav-link {padding-bottom: 1.25rem;}
	.top_tab .nav-link {font-size: 1.8rem;}
	.top_tab .nav-link.active span, .top_tab .nav-item.show .nav-link span {/*transform: translateY(0.25rem);padding: 1.5rem 0.0rem 1.3rem;*/}
    .my_posts .top_tab .nav-link.active span{padding: 1.1rem 0.0rem 0.9rem;}
    
    .input_spinner .swiper-slide {font-size: 3.0rem;}
	.input_spinner .swiper-slide-active {font-size: 3.3rem;}
	.input_spinner.input_spinner_lg .swiper-slide, .input_spinner.input_spinner_lg .btn_sign_toggle .btn-link{font-size: 3.7rem;}
	.input_spinner.input_spinner_lg .swiper-slide-active {font-size: 4.0rem;}
	
} 

.jconfirm.jconfirm-myalert {
    background-color: rgba(0, 0, 0, 0.4);    
}
/* 다이얼로그 박스 */
.jconfirm.jconfirm-myalert .jconfirm-box {
    width: 80% !important;
    border: 0;
    border-radius: 2.4rem;    
}
.jconfirm.jconfirm-myalert .jconfirm-title-c {
    text-align: center;
}
/* 타이틀 */
.jconfirm.jconfirm-myalert .jconfirm-title {
    font-size: 2.0rem;
    font-weight: 700;
    color:#000;
    line-height: 1.6;
}

/* 내용 영역 */
.jconfirm.jconfirm-myalert .jconfirm-content-pane {
    max-height: none !important;
    height: auto !important;
    overflow-y: visible !important;
}	

/* 내용 */
.jconfirm.jconfirm-myalert .jconfirm-content {
    white-space: pre-line;
    text-align: center !important;
    margin-top: 1rem !important;
}
.jconfirm.jconfirm-myalert .jconfirm-buttons {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row-reverse; /* 왼쪽에 확인, 오른쪽에 취소 */
}

/* alert 버튼하나 */
.jconfirm.jconfirm-myalert .jconfirm-buttons .btn-custom-single-ok {
    width: 100%;
      background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    height: var(--height_lg);
    font-weight:700;
    font-size: 1.6rem;
    padding: 0.5rem 2rem;
    border: 0;
    border-radius: 1.2rem;
    justify-content: center;
    align-items: center;
    word-break: keep-all;
}

/* 버튼 - 확인 */
.jconfirm.jconfirm-myalert .jconfirm-buttons .btn-custom-ok {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    height: var(--height_lg);
    font-weight:700;
    font-size: 1.6rem;
    padding: 0.5rem 2rem;
    border: 0;
    border-radius: 1.2rem;		  
}

/* 버튼 - 취소 */
.jconfirm.jconfirm-myalert .jconfirm-buttons .btn-custom-cancel {
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
    margin-right: 0.8em;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 1.2rem;
    font-size: 1.6rem;
    font-weight:600;
    word-break: keep-all;
    height: var(--height_lg);		
    padding: 0.5rem 2rem;
    color:  #000;
    border: 1px solid #D1D1D1 !important;
    background: #fff;
}


