@charset "utf-8";

/*reset*/
*{box-sizing:border-box;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button{margin:0;padding:0;}
html {height:100%;}
body {height:100%;}
a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:none; }
a:active {text-decoration:none;}
img{border:0px; max-width:100%;}
img, a, label, span{vertical-align:middle;}
li{list-style: none;}
table{border-collapse:collapse;width:100%;}
address,caption,cite,code,dfn,em,var,h1,h2,h3,h4,h5,h6 {font-style:normal;font-weight:normal;}
caption,legend,caption *,legend *{position:absolute; left:-10000px; line-height:0; font-size:0;}
fieldset{border:solid 0px black;padding:0;}
button{border:none; background:none; cursor:pointer; outline:none;}

body,a,[type=text], [type=password], [type=file], [type=email], [type=number], [type=tel], [type=submit],select,h1, h2, h3, h4, h5, h6, pre,textarea, button{
font-family:"Pretendard","MalgunGothic","맑은 고딕","돋움","tahoma","sans-serif"; line-height:1.4;  font-size:inherit; font-weight:inherit; color:inherit;}

html,body {font-size: clamp(14px, 1.2vw, 16px); color: #212121; font-weight:400;}

[type=text], [type=password], [type=file], [type=email], [type=number], [type=tel], [type=submit]{padding-left:10px; box-sizing:border-box; vertical-align:middle; border:solid 1px #ddd; height:40px; line-height:38px; outline:none;}
[type=checkbox], [type=radio]{vertical-align:middle;}
select{height:40px; line-height:38px; border:1px solid #ddd; box-sizing:border-box; outline:none;}

[type=file], [type=submit]{padding:0; height:auto; }
textarea{padding:15px; width:100%; border:1px solid #ddd; box-sizing:border-box; resize:none; display:block; outline:none;}
button:focus,
textarea:focus,
select:focus,
input:focus{outline:none;}

input[type=tel],
input[type=password],
input[type=email],
input[type=search],
input[type=text] {
   -webkit-appearance: none;
   -webkit-border-radius: 0;
}

input[type=number]::placeholder,
input[type=password]::placeholder,
input[type=text]::placeholder{color:#bbb;}

input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
}

/* Select box 스타일 초기화 
select {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
}
*/

/* flex */
.d-flex{display:flex;}
.align-center{align-items: center;}
.ju-center{justify-content: center;}
.ju-end{justify-content: flex-end;}
.ju-start{justify-content: flex-start;}
.f-wrap{flex-wrap:wrap;}
.ml-auto{margin-left:auto; }

.gap8{gap:8px;}
.gap15{gap:15px;}
.gap30{gap:clamp(8px, calc(30 / 1920 * 100vw), 30px);}
.gap50{gap:clamp(20px, calc(50 / 1920 * 100vw), 50px);}

@media screen and (max-width: 768px) {


}

/*float 해제*/
.clfx:after{ clear: both; content: "."; display: block; height: 0; visibility: hidden; font-size: 0;}
.clfix{clear: both; content: "."; display: block; height: 0;}



/*margin*/
.mr_0 { margin-right: 0 !important; }
.mr_4 { margin-right: clamp(2px, calc(4 / 1920 * 100vw), 4px) !important; }
.mr_5 { margin-right: clamp(2px, calc(5 / 1920 * 100vw), 5px) !important; }
.mr_10 { margin-right: clamp(5px, calc(10 / 1920 * 100vw), 10px) !important; }
.mr_15 { margin-right: clamp(7px, calc(15 / 1920 * 100vw), 15px) !important; }
.mr_20 { margin-right: clamp(10px, calc(20 / 1920 * 100vw), 20px) !important; }
.mr_60 { margin-right: clamp(30px, calc(60 / 1920 * 100vw), 60px) !important; }

.ml_0 { margin-left: 0 !important; }
.ml_5 { margin-left: clamp(2px, calc(5 / 1920 * 100vw), 5px) !important; }
.ml_10 { margin-left: clamp(5px, calc(10 / 1920 * 100vw), 10px) !important; }
.ml_15 { margin-left: clamp(7px, calc(15 / 1920 * 100vw), 15px) !important; }

.mb_0 { margin-bottom: 0 !important; }
.mb_5 { margin-bottom: clamp(2px, calc(5 / 1920 * 100vw), 5px) !important; }
.mb_8 { margin-bottom: clamp(4px, calc(8 / 1920 * 100vw), 8px) !important; }
.mb_10 { margin-bottom: clamp(5px, calc(10 / 1920 * 100vw), 10px) !important; }
.mb_20 { margin-bottom: clamp(10px, calc(20 / 1920 * 100vw), 20px) !important; }
.mb_25 { margin-bottom: clamp(12px, calc(25 / 1920 * 100vw), 25px) !important; }
.mb_30 { margin-bottom: clamp(15px, calc(30 / 1920 * 100vw), 30px) !important; }
.mb_35 { margin-bottom: clamp(17px, calc(35 / 1920 * 100vw), 35px) !important; }
.mb_40 { margin-bottom: clamp(20px, calc(40 / 1920 * 100vw), 40px) !important; }
.mb_45 { margin-bottom: clamp(22px, calc(45 / 1920 * 100vw), 45px) !important; }
.mb_50 { margin-bottom: clamp(25px, calc(50 / 1920 * 100vw), 50px) !important; }
.mb_60 { margin-bottom: clamp(30px, calc(60 / 1920 * 100vw), 60px) !important; }
.mb_70 { margin-bottom: clamp(35px, calc(70 / 1920 * 100vw), 70px) !important; }
.mb_85 { margin-bottom: clamp(42px, calc(85 / 1920 * 100vw), 85px) !important; }

.mt_0 { margin-top: 0 !important; }
.mt_5 { margin-top: clamp(2px, calc(5 / 1920 * 100vw), 5px) !important; }
.mt_8 { margin-top: clamp(4px, calc(8 / 1920 * 100vw), 8px) !important; }
.mt_10 { margin-top: clamp(5px, calc(10 / 1920 * 100vw), 10px) !important; }
.mt_15 { margin-top: clamp(7px, calc(15 / 1920 * 100vw), 15px) !important; }
.mt_20 { margin-top: clamp(10px, calc(20 / 1920 * 100vw), 20px) !important; }
.mt_25 { margin-top: clamp(12px, calc(25 / 1920 * 100vw), 25px) !important; }
.mt_30 { margin-top: clamp(15px, calc(30 / 1920 * 100vw), 30px) !important; }
.mt_35 { margin-top: clamp(17px, calc(35 / 1920 * 100vw), 35px) !important; }
.mt_40 { margin-top: clamp(20px, calc(40 / 1920 * 100vw), 40px) !important; }
.mt_50 { margin-top: clamp(25px, calc(50 / 1920 * 100vw), 50px) !important; }
.mt_60 { margin-top: clamp(30px, calc(60 / 1920 * 100vw), 60px) !important; }
.mt_70 { margin-top: clamp(35px, calc(70 / 1920 * 100vw), 70px) !important; }
.mb_80 { margin-bottom: clamp(40px, calc(80 / 1920 * 100vw), 80px) !important; }

/*padding*/
.pb_0 { padding-bottom: 0 !important; }
.pb_5 { padding-bottom: clamp(2px, calc(5 / 1920 * 100vw), 5px) !important; }
.pb_20 { padding-bottom: clamp(10px, calc(20 / 1920 * 100vw), 20px) !important; }
.pb_25 { padding-bottom: clamp(12px, calc(25 / 1920 * 100vw), 25px) !important; }

.pt_0 { padding-top: 0 !important; }
.pt_8 { padding-top: clamp(4px, calc(8 / 1920 * 100vw), 8px) !important; }
.pt_10 { padding-top: clamp(5px, calc(10 / 1920 * 100vw), 10px) !important; }
.pt_15 { padding-top: clamp(7px, calc(15 / 1920 * 100vw), 15px) !important; }
.pt_20 { padding-top: clamp(10px, calc(20 / 1920 * 100vw), 20px) !important; }
.pt_30 { padding-top: clamp(15px, calc(30 / 1920 * 100vw), 30px) !important; }
.pt_35 { padding-top: clamp(17px, calc(35 / 1920 * 100vw), 35px) !important; }
.pt_40 { padding-top: clamp(20px, calc(40 / 1920 * 100vw), 40px) !important; }
.pt_50 { padding-top: clamp(25px, calc(50 / 1920 * 100vw), 50px) !important; }

.pl_10 { padding-left: clamp(5px, calc(10 / 1920 * 100vw), 10px) !important; }
.pl_20 { padding-left: clamp(10px, calc(20 / 1920 * 100vw), 20px) !important; }
.pl_25 { padding-left: clamp(12px, calc(25 / 1920 * 100vw), 25px) !important; }
.pl_30 { padding-left: clamp(15px, calc(30 / 1920 * 100vw), 30px) !important; }

/*text-align*/
.txt_r{text-align:right !important;}
.txt_l{text-align:left !important;}
.txt_c{text-align:center !important;}

/*background*/
.back_no{background:none !important;}

/*border*/
.bd_l{border-left:none !important;}
.bd_r{border-right:none !important;}

/*ir*/
.ir{overflow:hidden;line-height:0 !important;font-size:0 !important;position:relative;text-indent:-10000px;/*display:inline-block;*/}
.ir *{position:absolute;left:-10000px;top:-10000px;margin:0;padding:0;}

/*float*/
.f-l{float:left;}
.f-r{float:right;}