@charset "utf-8";
/* CSS Document */
.material-symbols-rounded {
  font-variation-settings:
  'FILL' 0,
  'wght' 700,
  'GRAD' 200,
  'opsz' 48
}
/* 스크롤바 전체 */ ::-webkit-scrollbar { width: 8px!important; background-color: #cecfd0!important; }
/* 스크롤바 막대 */ ::-webkit-scrollbar-thumb { background-color: #9e9fa2!important; }
/* 스크롤바 외부 */ ::-webkit-scrollbar-track { background-color: #cecfd0!important; }
:root { 
	/* 트랜지션 */
	--transition: 0.15s ease-in;
	--q_trans: 500ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; /*큐빅*/
	/* 패딩,마진 */
	--sec_pd: 9rem;
	
	/* 컬러 */
	--scroll: #4361ee4d; /*포인트컬러 4d 앞에 넣어주기*/		
  --darker_point: #0043a7;
	--point: #0062f2;	
	--point_hover: #0054d1;	
  --point_light:#e7eefe;
  --mint:#00be92;
  --mint_light:#d7f3f0;
  --mint_point:#00ffc3;
	--light_blue: #2786FF;
	--light_blue_hover: #006eff;

	--dark_point: #051923;	
	--highlight:#00f7ff;

	--green_01: #bfff00;
  --green_01_hover: #94ED70;
	--green_02: #2aac48;
	--green_02_hover: #1F9039;
	--green_03: #2d9c00;
	--green_03_hover: #268f00;

	--light_green:#efffe1;
	--purple:#a03ee2;
	--pink: #ff84b1;
	--red:#ff4024;
	--orange:#ff663b;
	--yellow:#ffdb4e;
	--light_yellow:#ffeda4;
	--gray_3: #344048;	
	--gray_4: #444444;
	--gray_5: #555555;
	--gray_6: #666666;
	--gray_8: #888888;
	--gray_9: #999999;
	
	--gray_f3: #f3f3f3;
	--gray_f5: #f5f5f5;
	--gray_f8: #f8f8f8;
	--gray_f9: #f9f9f9;
	--gray_fa: #fafafa;	
	--surface:#f8faff;
	--white: #ffffff;
	--black: #000000;
	--light_sky: #F3FBFF;
	--light_gray: #f4f5f8;;
	--slate_gray: #636e8a;
    --slate_gray_hover: #45506c;
    --dark_gray: #2C333D;
    --border_color: #ebebeb;
	--db_gray:#434656;

	/* Light Steel */
	--bright-snow: #f8f9faff;
	--platinum: #e9ecefff;
	--alabaster-grey: #dee2e6ff;
	--pale-slate: #ced4daff;
	--pale-slate-2: #adb5bdff;
	--slate-grey: #6c757dff;
	--iron-grey: #495057ff;
	--gunmetal: #343a40ff;
	--carbon-black: #21252982;

	--border_g: 1px solid #dfdfdf;
	--op_white: 1px solid rgba(255,255,255, .15);
	--op_black: 1px solid rgba(0,0,0,0.15);
	
	--gradientR: linear-gradient(to right,#6a5ff9,#e2657a);
	--gradientRB: linear-gradient(to right bottom,#6a5ff9,#e2657a);
	--gradient_02: linear-gradient(to right bottom, #F3FBFF 35%, #C8E3F4 120%);
	--btn_grd:linear-gradient(to right, #cbe0ff 0%, #5c51f2 50%, #332182 110%);
	--btn_grd_hover:linear-gradient(to right, #e2657a  ,#5c51f2 100% );
	--wrap: 1500px;
}


/*라인*/
hr {/*display:none;*/ width: 100%; height: 1px; background-color: rgba(212, 223, 236, 0.719); border : 0; margin-left : auto; margin-right : auto; padding: 0; margin-block-start: 0; margin-block-end: 0;}
.line{ width: 100%; height: 1pt; background-color: #bbbbbb; display: block; content: ""}

/*보더색상*/
.border_w { border: var(--op_white); }
.border_b { border: var(--op_black); }
.border_g { border: var(--border_g); }
.border_point { border: 1px solid var(--point); }
.border_green{ border: 1px solid var(--green_01); }
.border_white { border: 1px solid var(--white); }
.border_light_blue {border: 1px solid #b3d7ff}

/* 그라데이션배경 */
.night_grd{background: linear-gradient(to bottom, var(--dark_point), var(--point));}
.orange_grd{background: linear-gradient(70deg, #ff4e50, #ff5858, #f89b29);}
.green_grd{background: linear-gradient( 90deg, rgb(9, 255, 234) 0%, #ccff00 90%);}
.blue_grd{background: linear-gradient(135deg, #00A8F1 0%, #0065D1 70%);}
.mint_grd{background: linear-gradient(to bottom, hsla(138, 82%, 69%, 1)-1%, hsla(186, 100%, 50%, 1) 101%);}
.purple_grd{background: linear-gradient(90deg, hsla(307, 93%, 84%, 1) -1%, hsla(256, 96%, 44%, 1) 101%);}
.pb_grd{background: linear-gradient(297deg, var(--purple), var(--point) 101%);}
.pink_grd{background:  linear-gradient(90deg, hsla(335, 91%, 70%, 1) -1%, hsla(49, 89%, 61%, 1) 101%); }
.rainbow{background-image: linear-gradient( 109.6deg,  rgba(254,253,205,1) 11.2%, rgba(163,230,255,1) 91.1% ); }
.chick{background-image: radial-gradient( circle 314px at 95.1% 37.9%,  rgba(255,246,78,1) 1.4%, rgba(242,252,186,1) 100.7% );}
.blpink{background-image: linear-gradient( 114.2deg, rgba(252,251,224,1), rgba(245,212,212,1) 8.5%, rgba(255,180,239,1));}
.sky{background-image: linear-gradient( 109.6deg,  rgba(204,228,247,1) 11.2%, rgba(237,246,250,1) 100.2% );}
.seassak{background-image: linear-gradient( 135deg,  rgba(252,255,222,1) 2.2%, #b6f1ab 99.3% );}
.sprout{background-image: linear-gradient(to bottom, #fcff99 30%, #c5ff08 120%);}
.baby{background-image: linear-gradient(180deg, #fff56a 11.5%,#ffb64f 91% );}
/*폰트 그라디언트 색상 -webkit-text-stroke: 1px rgba(255, 255, 255, 0.8);background-image: linear-gradient(to top, #c7ffd3 0%, #fbfff2 100%);*/
.fc_grd{background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.black50{background-color: #00000080;}
/* 텍스트 마커 */
.marker_green {box-shadow: inset 0px -.5em 0 rgb(239 254 190);}
.marker_orange {box-shadow: inset 0px -.5em 0 #ffe0cd;}
.marker_blue {box-shadow: inset 0px -.5em 0 #3075d559;}
.marker_sky {box-shadow: inset 0px -.5em 0 #d1e7ff;}
.marker_purple {box-shadow: inset 0px -1.2em 0 #aa00ff2e;}
.marker_red {box-shadow: inset 0px -.3em 0 #b20a0a; padding: .1rem 0.3rem;}

/*포지션*/
.absolute { position: absolute !important} .fixed { position: fixed !important} .relative { position: relative !important} .static { position: static !important} .sticky { position: sticky!important} .visible { visibility: visible} .invisible { visibility: hidden} 

/*디스플레이*/
.CenCen { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; } 
.flexwrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } 
.d_flex { display: flex; } 
.d_inline_flex { display: inline-flex; } 
.d_block { display: block; } .d_inline_block { display: inline-block; } 
.inline{display: inline;} 
.flex_wrap { flex-wrap: wrap; } 
.flex_column { flex-direction: column; } 
.flex_row { flex-direction: row; } 
.grow_1{flex-grow: 1; }

.jc_cen { justify-content: center; } 
.jc_sb { justify-content: space-between; } 
.jc_sa { justify-content: space-around; } 
.jc_end { justify-content: end; }

.ai_cen { align-items: center; } 
.ai_str { align-items: flex-start; } 
.ai_st { align-items: stretch; } 
.ai_end { align-items: flex-end; }
/*텍스트 행간 높이*/
.lh_1_0{line-height: 1}.lh_1_1{line-height: 1.1}.lh_1_2{line-height: 1.2}.lh_1_3{line-height: 1.3}.lh_1_4{line-height: 1.4}.lh_1_5{line-height: 1.5}.lh_1_6{line-height: 1.6}
/* 텍스트정렬 */
.ta_l { text-align: left; } .ta_cen { text-align: center; } .ta_r { text-align: right; }
/* 그림자 */
.shadow { box-shadow: 0 0.2rem 0.4rem 0rem rgba(0,0,0,0.15); }
.shadow_strong { box-shadow: 0 0.25rem 0.8rem 0.15rem rgba(0,0,0,0.25); }
.shadow_blue { box-shadow: 0 0.2rem 0.7rem 0.2rem  rgba(0,93,191,0.15);}
.big_shadow{ box-shadow: 0 20px 80px 0 rgba(193, 199, 212, 0.25);}
.filter_shadow{filter: drop-shadow(0 0.2rem 0.2rem rgba(0,0,0,0.25));}
.filter_shadow_s{filter: drop-shadow(0 0.1rem 0.1rem rgba(0,0,0,0.5));}
.filter_shadow_white{filter: drop-shadow(0 .15rem .2rem rgba(255, 255, 255, .9));}

/* 박스 스타일 */
.shadow_box { background-color: var(--white); border-radius: var(--br_40); padding: 4rem 0rem; box-shadow: 0px 15px 80px 10px rgba(34, 50, 91, 0.25),0px 0px 10px 0px rgba(34, 50, 91, 0.10); border: .8rem #e8ebf5 solid;  }

/* Wrap width: 100%;  */
.wrap { width: 100%; max-width: calc(var(--wrap) + 2rem); padding-right: 1rem; padding-left: 1rem;margin: 0 auto; word-break: keep-all; }

/* 모바일 표시 */
.m_ver { display: none; }
.p_ver{display: inline-flex;}
/* br */
.m_br { display: none; }
.p_br { display: inline-block; }

/* 포지션 중앙 정렬 */
.pos_cen { position: absolute!important; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }

/* 배경 컬러 */
.bc_blue {padding: 0; background: var(--point); background-image: linear-gradient(135deg, #9b37ff 7%, var(--point) 96%); }
.bc_gray { background-color: #f4f4f4; }

.bg_white { background-color: var(--white); }
.bg_point { background-color: var(--point); }
.bg_point_light { background-color: var(--point_light); }
.bg_dark_point { background-color: var(--dark_point); }
.bg_darker_point { background-color: var(--darker_point); }

.bg_red { background-color: var(--red); }
.bg_mint { background-color: var(--mint); }
.bg_purple { background-color: var(--purple); }
.bg_orange { background-color: var(--orange); }
.bg_yellow { background-color: var(--yellow); }
.bg_light_yellow { background-color: var(--light_yellow); }

.bg_surface { background-color: var(--surface); }
.bg_light_blue { background-color: var(--light_blue);}
.bg_light_gray { background-color: var(--light_gray);}
.bg_db_gray { background-color: var(--db_gray);}
.bg_dark_gray { background-color: var(--dark_gray);}
.bg_green { background-color: var(--green_01);}
.bg_green_02 { background-color: var(--green_02);}
.bg_green_03 { background-color: var(--green_03);}
.bg_light_green { background-color: var(--light_green);}
.bg_gray_3 { background-color: var(--gray_3); }
.bg_gray_4 { background-color: var(--gray_4); }
.bg_gray_5 { background-color: var(--gray_5); }
.bg_gray_6 { background-color: var(--gray_6); }
.bg_gray_8 { background-color: var(--gray_8); }
.bg_gray_9 { background-color: var(--gray_9); }

.bg_gray_f3 { background-color: var(--gray_f3); }
.bg_gray_f5 { background-color: var(--gray_f5); }
.bg_gray_f8 { background-color: var(--gray_f8); }
.bg_gray_f9 { background-color: var(--gray_f9); }
.bg_gray_fa { background-color: var(--gray_fa); }

.bg_black_op_01{background-color: rgba(0,0,0,0.1);}
.bg_black_op_02{background-color: rgba(0,0,0,0.2);}
.bg_black_op_03{background-color: rgba(0,0,0,0.3);}
.bg_black_op_04{background-color: rgba(0,0,0,0.4);}
.bg_black_op_05{background-color: rgba(0,0,0,0.5);}
.bg_black_op_06{background-color: rgba(0,0,0,0.6);}
.bg_black_op_07{background-color: rgba(0,0,0,0.7);}
.bg_black_op_08{background-color: rgba(0,0,0,0.8);}
.bg_black_op_09{background-color: rgba(0,0,0,0.9);}

.LS_gray_1{background-color: var(--bright-snow);}
.LS_gray_2{background-color: var(--platinum);}
.LS_gray_3{background-color: var(--balabaster-grey);}
.LS_gray_4{background-color: var(--pale-slate);}
.LS_gray_5{background-color: var(--pale-slate-2);}
.LS_gray_6{background-color: var(--slate-grey);}
.LS_gray_7{background-color: var(--iron-grey);}
.LS_gray_8{background-color: var(--gunmetal);}
.LS_gray_9{background-color: var(--carbon-black);}

/* 폰트 컬러 */
.fc_light_blue { color: var(--light_blue); }

.fc_green { color: var(--green_01);}
.fc_green_02 { color: var(--green_02);}
.fc_green_03 { color: var(--green_03);}
.fc_light_green { color: var(--light_green);}
.fc_light_yellow { color: var(--light_yellow);}
.fc_mint { color: var(--mint);}
.fc_mint_point { color: var(--mint_point);}
.fc_orange { color: var(--orange); }
.fc_yellow { color: var(--yellow); }
.fc_gray_01 { color: rgba(51,51,51,0.7); }
.fc_gray_02 { color: rgba(51,51,51,0.85); }
.fc_point { color: var(--point) !important; }
.fc_white { color: var(--white); }
.fc_red { color: var(--red)!important; }
.fc_purple { color: var(--purple); }
.fc_pink { color: var(--pink); }

.fc_g_3 { color: var(--gray_3);}
.fc_g_4 { color: var(--gray_4);}
.fc_g_5 { color: var(--gray_5);}
.fc_g_6 { color: var(--gray_6);}
.fc_g_8 { color: var(--gray_8);}
.fc_g_9 { color: var(--gray_9);}
.fc_g_f3 { color: var(--gray_f3);}

.fc_g_f5 { color: var(--gray_f5);}



/* 공통 폼 */
form { text-align: center; }
input, select { padding: 1rem; height: 58px; outline: 0; border: none; background-color: rgba(241,240,247,0.6); font-size: 1em; border-radius: var(--br_s); color: inherit; font-family: 'SEBANG_Gothic_Regular'}
textarea { display:inline-block; border:0; border-radius: var(--br_s); outline:none; box-sizing:border-box; padding: 20px; background-color: rgba(0,0,0,0.04); margin-top: 0.5rem; }
.agree_set { margin-bottom:  1rem; }
.agree_set #checkbox_label { margin-right: 0.5rem; }
.agree_set a { margin-left: 0.5rem; color: inherit; font-weight: 500; }
.agree_set a:hover { color: #016e83!important; }

.fieldset_basic { margin-bottom: 1.5rem; display: inline-block; width: 100%; }
	.fieldset_basic:last-of-type { margin-bottom: 0rem; }
.fieldset_basic input, .fieldset_basic textarea, .fieldset_basic select { border-bottom:2px solid rgba(255,255,255,0)!important; transition:.2s ease-in-out; }
.fieldset_basic:focus-within > label { color: var(--point); }
.fieldset_basic:focus-within > input, 
.fieldset_basic:focus-within > div > input,	 
.fieldset_basic:focus-within > textarea, 
.fieldset_basic:focus-within > div > textarea, 
.fieldset_basic:focus-within > select, 
.fieldset_basic:focus-within > div > select { border-bottom:2px solid var(--point); animation:border_blink 1s infinite; }
.fieldset_basic label { display: flex; align-items: center; width: 100%; margin-bottom: 0.7rem; font-weight: 500; text-align: left; font-size: 1.1em; }
.fieldset_basic label i { margin-right: 0.5rem; margin-bottom: .1rem; }
.fieldset_basic label sup { font-size: 0.8em; font-weight: normal; margin-left: 0.5rem; display: inline-flex; align-items: center; color: #ff4f4f; }
.fieldset_basic label sup i { display: inline-block; margin-right: 0.25rem; }
.fieldset_basic input, .fieldset_basic select { display: inline-block; width: 100%; background-color: rgba(0,0,0,0.0); border: solid 1px #ddd!important; }

#phone_fieldset select, #phone_fieldset input { width: 30%; }
#empty_fieldset label, #empty_fieldset input{visibility: hidden}
.form_inner{gap:1rem; flex-wrap: wrap }
.form_inner .fieldset_basic { margin-bottom: 1.5rem; display: inline-block; width: calc(50% - 0.5rem); }
/*#name_fieldset, #job_fieldset,  #property_fieldset, #phone_fieldset { float: left; }
#income_fieldset, #income_fieldset, #insurance_fieldset, #overdue_fieldset { float: right; }
margin: 0.5%; float: left*/
[id^="_fieldset"] {width: 100%; }

.form_btn { width: 100%; max-width: 400px; margin: 0 auto; margin-top: 2rem; }

/* 체크박스 */
input#chk_top{ display: none; }
#checkbox_label { padding-bottom: 3px; }
input#chk_top + #checkbox_label { display: inline-block; cursor: pointer; }
input#chk_top + #checkbox_label:before{ content:""; display:inline-block; width:17px; height:17px; line-height: 17px; border:1px solid #cbcbcb; vertical-align:middle;/*체크 전과 체크 후 높이 차이 때문에 설정*/ background-color: var(--white); }
input#chk_top:checked + #checkbox_label:before{ content:"\f00c"; font-family:"Font Awesome 7 Pro"; font-weight:900; color:var(--white); background-color: var(--point); border-color: var(--point); font-size:14px; text-align:center; }

input#chk_top_0{ display: none; }
#checkbox_label_0 { padding-bottom: 3px; }
input#chk_top_0 + #checkbox_label_0 { display: inline-block; cursor: pointer; }
input#chk_top_0 + #checkbox_label_0:before{ content:""; display:inline-block; width:17px; height:17px; line-height: 17px; border:1px solid #cbcbcb; vertical-align:middle;/*체크 전과 체크 후 높이 차이 때문에 설정*/ background-color: var(--white); }
input#chk_top_0:checked + #checkbox_label_0:before{ content:"\f00c"; font-family:"Font Awesome 7 Pro"; font-weight:900; color:var(--white); background-color: var(--point); border-color: var(--point); font-size:14px; text-align:center; }

input#chk_top_1{ display: none; }
#checkbox_label_1 { padding-bottom: 3px; }
input#chk_top_1 + #checkbox_label_1 { display: inline-block; cursor: pointer; }
input#chk_top_1 + #checkbox_label_1:before{ content:""; display:inline-block; width:17px; height:17px; line-height: 17px; border:1px solid #cbcbcb; vertical-align:middle;/*체크 전과 체크 후 높이 차이 때문에 설정*/ background-color: var(--white); }
input#chk_top_1:checked + #checkbox_label_1:before{ content:"\f00c"; font-family:"Font Awesome 7 Pro"; font-weight:900; color:var(--white); background-color: var(--point); border-color: var(--point); font-size:14px; text-align:center; }

/* 선택형 라디오 */
.switch-field { /* margin-top: 1rem; */ width: 100%; padding: 0!important; }
.switch-field > input { display: none; }
.switch-field > input[type=radio] { display: none; height: 1px; width: 1px; border: 0; }
.switch-field > label { background-color: rgba(255,255,255,1); color: #666; font-weight: normal; text-align: center!important; text-shadow: none; padding: 1rem; border: 1px solid #ddd; font-size: 1em;  margin: 0 0.2em; display: flex; justify-content: center; align-items: center; border-radius: var(--br_s);}
.switch-field > label:first-of-type{margin-left: 0;}
.switch-field > label:last-of-type{margin-right: 0;}
.switch-field > label:hover { cursor: pointer; }
.switch-field > input[type=radio]:checked + label { border: 1px solid var(--point); background: var(--white); color: var(--point); background-color: var(--surface); font-weight: bold; border-radius: var(--br_s);}

/* 비활성화 - 연체 있음 선택시 */
.disabled_label { background-color: rgba(0,0,0,0.04)!important; color: #888888!important; border-color: rgba(0,0,0,0.04)!important; }
/*활성화 인풋*/
input:focus,
select:focus { border: solid 1px var(--point)!important; background-color: var(--surface);}

/* 버튼 스타일 border:1px solid rgba(255, 255, 255, 0.15); filter: hue-rotate(30deg);background-size: 115%; background-position: center right; hue-rotate(227deg)*/
.Mybtn { color: #fff; line-height: 1; border-radius: var(--br_c); padding:1.6rem 3rem 1.5rem; border: 1px solid #ffffff27; background-clip: padding-box!important; }
	.Mybtn:hover{filter:hue-rotate(40deg) contrast(110%) saturate(120%); box-shadow: 0 10px 20px rgba(46,7,0,0.20), 0 -5px 10px rgba(46,7,0,0.15), 0 6px 6px rgba(46,7,0,0.10);  }
	a.orange_grd:hover, button.orange_grd:hover{background: linear-gradient(-70deg, #ff4e50, #ff5858, #f89b29); filter: none;}



a.bg_point:hover, button.bg_point:hover{background-color: var(--point_hover);}
a.bg_light_blue:hover, button.bg_light_blue:hover{background-color: var(--light_blue_hover);}
a.bg_green:hover, button.bg_green:hover{background-color: var(--green_01_hover);}
a.bg_green_02:hover, button.bg_green_02:hover{background-color: var(--green_02_hover);}
a.bg_green_03:hover, button.bg_green_03:hover{background-color: var(--green_03_hover);}

/*기본버튼 배경 이펙트*/
.hover{ display: inline-flex!important; align-items: center; justify-content: center; gap: 5px; position: relative!important; overflow: hidden; min-width: fit-content!important;}
.hover:after { background: var(--white); content: ""; height: 155px; left: -150%; opacity: 0.2;  position: absolute; top: -50px; transform: rotate(35deg); transition: all 450ms cubic-bezier(0.19, 1, 0.22, 1); width: 50px; pointer-events: none; filter: blur(3px);}
.hover:hover::after { left: 150%; transition: all 750ms cubic-bezier(.81,.11,.41,1); }
.hover.hover_loop:hover::after{
    transition: none !important;
    animation: hoverFlashLoop 1800ms cubic-bezier(.81,.11,.41,1) infinite;
}
.hover.hover_loop:not(:hover)::after{
    animation: none !important;
    left: -150%;
    opacity: 0.2;
}
/* 반복 플래시 키프레임 */
@keyframes hoverFlashLoop{
    0%{
        left: -150%;
        opacity: 0;
    }
    12%{
        opacity: 0.25;
    }
    45%{
        left: 150%;
        opacity: 0.25;
    }
    60%{
        opacity: 0;
    }
    100%{
        left: 150%;
        opacity: 0;
    }
}

/* a나 버튼 에 텍스트랑 아이콘 함께 있는 경우 작은 버튼 큰번튼 동시에 사용하려면  */
a .btn_txt, button .btn_txt { transform: translateX(0.85rem); transition-duration: 0.3s;  line-height: 1; }
a .iconer, button .iconer { transform: translateY(4rem); transition-duration: 0.3s; display: inline-flex!important; align-items: center; justify-content: center;}
a:hover .btn_txt, button:hover .btn_txt  { transform: translateX(0px); }
a:hover .iconer, button:hover .iconer { transform: translateY(0%); }
@keyframes btn_flash {
0% ,100%  { left: -150%; }
10%  { left: 150%; }
}

/* ==================== 모바일 레이아웃 ==================== --base-px: 2px;*/ 
@media ( max-width: 1280px ) { 
	:root { 
		/* 패딩,마진 */
		--sec_pd: 7rem;
	}
	.column_lg{flex-direction: column;}
	
}
@media ( max-width: 900px ) { 
	.column_md{flex-direction: column;}
}
@media ( max-width: 600px ) { 	:root { 
	}
	.column_sm{flex-direction: column;}
	input, select {height: 45px;}
  a .btn_txt, button .btn_txt { font-size: 1.25rem; }
}
@media only screen and (min-width: 300px) and (max-width: 850px) {
	/*모바일 스크롤바 없애기*/
	body{ -ms-overflow-style: none; /* IE and Edge */  scrollbar-width: none; /* Firefox */}
	body::-webkit-scrollbar { display: none; /* Chrome, Safari, Opera*/}
	/* .wrap { padding: 0 1rem;} */
	
	/* 모바일 표시 */
	.m_ver { display: inline-flex; }
	.p_ver {display: none;}
	/* br */
	.m_br { display: inline-block; }
	.p_br { display: none; }
	
	/* 버튼 스타일 */
	.btn_style_01 { padding: 1.25rem 1.95rem; font-weight: 700; font-size: 1.2rem;}
	
	#empty_fieldset, #empty_fieldset label, #empty_fieldset input{visibility: hidden; display: none!important}
	.form_inner{gap:0; flex-wrap: wrap; flex-direction: column; }
	.form_inner .fieldset_basic { margin-bottom: 1.5rem; display: inline-block; width:100%; }
	/* 박스 스타일 */
	.shadow_box { padding:3rem 1rem; }
	/* 포지션 중앙 정렬 */
	.pos_cen {  top: 55%; left: 48%;  }
}

/*Animations*/
[data-animate-in] { opacity: 0;    transition: transform 0.8s ease, opacity 2s ease}
[data-animate-in="up"] {    transform: translate3d(0, 24px, 0)}
[data-animate-in="left"] {    transform: translate3d(-25%, 0, 0)}
[data-animate-in="right"] {    transform: translate3d(25%, 0, 0)}
[data-animate-in="down"] {    transform: translate3d(0, -24px, 0)}
[data-animate-in="fadeIn"] {    transform: translate3d(0, 0, 0)}
/* =========================
   Flip (animate.css style)
   ========================= */

[data-animate-in^="flip"]{
  transform-style: preserve-3d;
  backface-visibility: visible !important; /* animate.css는 visible을 씀 */
  will-change: transform, opacity;
}

/* 시작 상태(보이지 않게) */
[data-animate-in="flipInY"],
[data-animate-in="flipInX"]{
  opacity: 0;
}

/* 공통 in-view 시: animation으로만 처리 */
[data-animate-in="flipInY"].in-view{
  opacity: 1;
  transition: none;
  animation: flipInY_Embank 0.9s both;
}

[data-animate-in="flipInX"].in-view{
  opacity: 1;
  transition: none;
  animation: flipInX_Embank 0.9s both;
}

/* Y축 플립(좌우로 뒤집힘) */
@keyframes flipInY_Embank{
  from{
    transform: perspective(900px) translate3d(0,0,0) rotate3d(0,1,0,90deg);
    opacity: 0;
    animation-timing-function: ease-in;
  }
  40%{
    transform: perspective(900px) translate3d(0,0,40px) rotate3d(0,1,0,-18deg);
    animation-timing-function: ease-in;
  }
  60%{
    transform: perspective(900px) translate3d(0,0,18px) rotate3d(0,1,0,10deg);
    opacity: 1;
  }
  80%{
    transform: perspective(900px) translate3d(0,0,0) rotate3d(0,1,0,-4deg);
  }
  to{
    transform: perspective(900px) translate3d(0,0,0) rotate3d(0,1,0,0deg);
  }
}

/* X축 플립(위아래로 뒤집힘) */
@keyframes flipInX_Embank{
  from{
    transform: perspective(900px) translate3d(0,0,0) rotate3d(1,0,0,90deg);
    opacity: 0;
    animation-timing-function: ease-in;
  }
  40%{
    transform: perspective(900px) translate3d(0,0,40px) rotate3d(1,0,0,-18deg);
    animation-timing-function: ease-in;
  }
  60%{
    transform: perspective(900px) translate3d(0,0,18px) rotate3d(1,0,0,10deg);
    opacity: 1;
  }
  80%{
    transform: perspective(900px) translate3d(0,0,0) rotate3d(1,0,0,-4deg);
  }
  to{
    transform: perspective(900px) translate3d(0,0,0) rotate3d(1,0,0,0deg);
  }
}

/* Safari Touch 예외 처리 */
.isSafari.isTouch [data-animate-in="flipY"],
.isSafari.isTouch [data-animate-in="flipX"]{
  opacity: 1;
  transition: none;
  transform: none;
  animation: none;
}
[data-animate-in="zoom"] {    transform: scale(1.5)}
[data-animate-in].in-view {    opacity: 1;    -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);    transition: transform 0.6s ease, opacity 0.6s ease}
.fade-in {    opacity: 0;    transition: opacity 1s ease}
.page-loaded .fade-in,.page-loaded.fade-in {    opacity: 1}
.isSafari.isTouch [data-animate-in],.isSafari.isTouch [data-animate-in="up"] {    opacity: 1;    transition: none;    transform: none}
/* 바운스 애니메이션 */
.wobble {    animation: wobble 2s ease infinite;}
.bounce {    animation: bounce 1.5s infinite;}
.swing {    transform-origin: top center;    animation: swing 2s ease infinite;}
@keyframes bounce {
    0%, 50%, 100% {
        transform: scale(.97);
    }

    25% {
        transform: scale(1.025);
        /*transform-origin: bottom center;*/
    }
}
@keyframes swing {
    20% {
        transform: rotate(15deg);
    }

    40% {
        transform: rotate(-10deg);
    }

    60% {
        transform: rotate(5deg);
    }

    80% {
        transform: rotate(-5deg);
    }

    100% {
        transform: rotate(0deg);
    }
}
@keyframes wobble {
    0% {
        transform: translateX(0%);
    }

    15% {
        transform: translateX(-25%) rotate(-5deg);
    }

    30% {
        transform: translateX(20%) rotate(3deg);
    }

    45% {
        transform: translateX(-15%) rotate(-3deg);
    }

    60% {
        transform: translateX(10%) rotate(2deg);
    }

    75% {
        transform: translateX(-5%) rotate(-1deg);
    }

    100% {
        transform: translateX(0%);
    }
}