.nowrap {
white-space: nowrap
}
.flex {
display: flex!important;
}
.flex.wrap {
flex-wrap: wrap
}
.flex.nowrap {
flex-wrap: nowrap
}
.flex.jc-sb {
justify-content: space-between
}
.flex.start {
justify-content: flex-start
}
.flex.end {
justify-content: flex-end
}
.flex.center {
justify-content: center
}
.flex.jc-fe{
justify-content: flex-end
}
.flex.ai-c{
align-items: center
}
.flex.ai-b{
align-items: baseline
}
.flex.ai-e{
align-items: flex-end
}
.flex.ai-s{
align-items: flex-start;
}
.hide {
display: none!important;
}
.grid{
display: grid;
gap: 10px;
}
.grid > li, .grid > div{
box-sizing: border-box;
overflow: hidden;
}
.grid2{
grid-template-columns: repeat(2, 1fr);
}
.grid3{
grid-template-columns: repeat(3, 1fr);
}
.grid4{
grid-template-columns: repeat(4, 1fr);
}
.grid5{
grid-template-columns: repeat(5, 1fr);
}
.grid6{
grid-template-columns: repeat(6, 1fr);
}
.grid7{
grid-template-columns: repeat(7, 1fr);
}
.gap5{
gap: 5px;
}
.gap10{
gap: 10px;
}
.gap15{
gap: 15px;
}
.gap20{
gap: 20px;
}
.gap25{
gap: 25px;
}
.gap30{
gap: 30px;
}
.gap40{
gap: 40px;
}
.w50 {
width: 50% !important
}
.w100 {
width: 100%!important;
}
.wfit {
width: fit-content!important;
}
.mw100 {
max-width: 100px!important;
}
.mw150 {
max-width: 150px!important;
}
.mw200 {
max-width: 200px!important;
}
.w30px {
width: 30px!important;
}
.w40px {
width: 40px!important;
}
.w50px {
width: 50px!important;
}
.w60px {
width: 60px!important;
}
.w70px {
width: 70px!important;
}
.w80px {
width: 80px!important;
}
.w90px {
width: 90px!important;
}
.w100px {
width: 100px!important;
}
.w150px {
width: 150px!important;
}
.w200px {
width: 200px!important;
}
.w600px{
max-width: 600px;
margin: 0 auto;
}
.w900px{
max-width: 900px;
margin: 0 auto;
}
.w1200px{
max-width: 1200px!important;
margin: 0 auto;
}
.w1300px{
max-width: 1300px;
margin: 0 auto;
}
.max-none {
max-width: none!important;
}
.mari-auto {
margin-right: auto!important;
}
.male-auto {
margin-left: auto!important;
}



.cut{
display:inline-block;
width:100%;
overflow: hidden;
text-overflow: ellipsis;
vertical-align:middle;
word-break: break-all;
white-space: nowrap;
}
.cut2{
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
width:100%;
word-break: break-all;
}
.cut3{
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
width:100%;
word-break: break-all;
}
.b0 {
border: 0px!important;
}
.mb0 {
margin-bottom: 0px!important;
}
.mb5 {
margin-bottom: 5px !important;
}
.mb10 {
margin-bottom: 10px!important;
}
.mb15 {
margin-bottom: 15px!important;
}
.mb25 {
margin-bottom: 25px!important;
}
.mt0 {
margin-top: 0px!important;
}
.mt5 {
margin-top: 5px!important;
}
.mt10 {
margin-top: 10px!important;
}
.mt15 {
margin-top: 15px!important;
}
.mt20 {
margin-top: 20px!important;
}
.mt25 {
margin-top: 25px!important;
}
.mt30 {
margin-top: 30px!important;
}
.mb5 {
margin-bottom: 5px!important;
}
.mb10 {
margin-bottom: 10px!important;
}
.mb15 {
margin-bottom: 15px!important;
}
.mb20 {
margin-bottom: 20px!important;
}
.mb25 {
margin-bottom: 25px!important;
}
.m10 {
margin: 10px 0!important;
}
.ml10 {
margin-left: 10px !important;
}
.mr5 {
margin-right: 5px !important;
}
.mr10 {
margin-right: 10px !important;
}
.cursor {
cursor: pointer;
}



/*글자*/
.txt-blue> a, .txt-blue {
color: #3979f8;
}
.txt-org> a, .txt-org {
color: #f77e02;
}
.txt-green> a, .txt-green {
color: #00a915;
}
.txt-blue2> a, .txt-blue2 {
color: #a8bfff;
}
.txt-sky> a, .txt-sky {
color: #4aeaff;
}
.txt-pink> a, .txt-pink{
color:#ff5b90;
}
.txt-yellow> a, .txt-yellow {
color: #FAC700;
}
.txt-brown> a, .txt-brown {
color: #95711D;
}
.txt-red > a, .txt-red {
color: #ff2d0d;
}
.txt-lightgray > a, .txt-lightgray{
color: #DBDBDB;
}
.txt-gray > a, .txt-gray{
color: #AFAFAF;
}
.txt-gray2 > a, .txt-gray2{
color: #4b4b4b;
}
.txt-dark > a, .txt-dark{
color: #7D7D7D;
}
.txt-black > a, .txt-black{
color: #232323!important;
}
.txt-white > a, .txt-white{
color: #ffffff!important;
}
.txt-bold {
font-weight: 800!important;
}
.txt-bold2 {
font-weight: 600!important;
}
.txt-thin {
font-weight: 400!important;
}
.txt-under {
text-decoration: underline!important;
}
.txt-under2{
text-decoration:none;
opacity:1;
border-bottom:10px solid #fff7f5;
display:inline-block;
line-height:0px;
}
.txt-through {
text-decoration:line-through
}
.txt-down{
font-size: 0.9em;
line-height: 1.6em;
}
.txt-up{
font-size: 1.1em;
}
.txt-mini{
font-size: 0.85em;
}
.text-center{
text-align: center!important;
}
.text-left{
text-align: left!important;
}
.text-right{
text-align: right!important;
}





/*버튼*/
button:disabled, button:disabled:hover{
filter:saturate(0);
background: #33333315;
color:#33333375;
border-color: #dddddd;
}
.btn,a.btn{
height: fit-content;
background: #fff;
display: inline-block ;
text-align:center;
border: none;
width: max-content;
word-break: keep-all;
padding: 8px 10px;
line-height: 1em;
border-radius: 0;
cursor: pointer;
font-weight: 600;
position: relative;
box-sizing: border-box;
text-align: center;
}
.btn.round,a.btn.round{/* 추가 */
border-radius: 120px;
}
.btn-mini,a.btn-mini{
padding: 4px 8px;
height: auto!important;
font-size: 11px;
margin: 2px
}
.btn-mini2,a.btn-mini2{
padding: 4px 6px;
height: auto!important;
font-size: 9px;
margin: 2px
}
.btn-small{
padding: 7px 10px;
height: 40px;
}
.btn-small2{
padding: 4px 10px;
font-size: 14px;
}
.btn-middle,a.btn-middle{
width: 50%;
padding: 15px 0;
font-size: 1.2em;
font-weight: 600;
height: auto!important;
}
.btn-large,a.btn-large{
width: 100%;
padding: 0;
font-size: 15px;
font-weight: 600;
height: 56px;
line-height: 56px;
}

a.btn-white, .btn-white{
background-color: #fff;
color: #163161;
}
a.btn-white:hover, .btn-white:hover{
background-color: #fff;
color: #163161;
}
a.btn-navy, .btn-navy{
background-color: #163161;
color: #fff;
}
a.btn-navy:hover, .btn-navy:hover{
background-color: #333;
color: #fff;
}