@charset "utf-8";
/* Webfonts */

@font-face {
    font-family: 'Recipekorea';
    font-weight: normal;
    font-display: swap;
    src: url("/font/Recipekorea.ttf") format('woff2');
}

@font-face {
    font-family: 'Pretendard';
    font-weight: 100;
    font-display: swap;
    src: url("/font/Pretendard-Thin.woff2") format('woff2');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 200;
    font-display: swap;
    src: url("/font/Pretendard-ExtraLight.woff2") format('woff2');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 300;
    font-display: swap;
    src: url("/font/Pretendard-Light.woff2") format('woff2');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 400;
    font-display: swap;
    src: url("/font/Pretendard-Regular.woff2") format('woff2');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 500;
    font-display: swap;
    src: url("/font/Pretendard-Medium.woff2") format('woff2');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 600;
    font-display: swap;
    src: url("/font/Pretendard-SemiBold.woff2") format('woff2');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 700;
    font-display: swap;
    src: url("/font/Pretendard-Bold.woff2") format('woff2');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 800;
    font-display: swap;
    src: url("/font/Pretendard-ExtraBold.woff2") format('woff2');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 900;
    font-display: swap;
    src: url("/font/Pretendard-Black.woff2") format('woff2');
}

@font-face{
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:300;
	font-display:swap;
	src:local('Noto Sans KR Light'), local('NotoSansKR-Light'), url('../font/NotoSansKR-Light.ttf') format('woff2');
}
@font-face{
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:400;
	font-display:swap;
	src:local('Noto Sans KR Regular'), local('NotoSansKR-Regular'), url('../font/NotoSansKR-Regular.ttf') format('woff2');
}
@font-face{
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:500;
	font-display:swap;
	src:local('Noto Sans KR Medium'), local('NotoSansKR-Medium'), url('../font/NotoSansKR-Medium.ttf') format('woff2');
}
@font-face{
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:700;
	font-display:swap;
	src:local('Noto Sans KR Bold'), local('NotoSansKR-Bold'), url('../font/NotoSansKR-Bold.ttf') format('woff2');
}

@font-face{
	font-family:'the Jamsil';
	font-style:normal;
	font-weight:300;
	font-display:swap;
	src:local('the Jamsil Light'), local('theJamsil2Light'), url('../font/theJamsil2Light.ttf') format('woff2');
}
@font-face{
	font-family:'the Jamsil';
	font-style:normal;
	font-weight:400;
	font-display:swap;
	src:local('the Jamsil Regular'), local('theJamsil3Regular'), url('../font/theJamsil3Regular.ttf') format('woff2');
}
@font-face{
	font-family:'the Jamsil';
	font-style:normal;
	font-weight:500;
	font-display:swap;
	src:local('the Jamsil Medium'), local('theJamsil4Medium'), url('../font/theJamsil4Medium.ttf') format('woff2');
}
@font-face{
	font-family:'the Jamsil';
	font-style:normal;
	font-weight:700;
	font-display:swap;
	src:local('the Jamsil Bold'), local('theJamsil5Bold'), url('../font/theJamsil5Bold.ttf') format('woff2');
}
@font-face{
	font-family:'tmon';
	font-style:normal;
	font-weight:normal;
	font-display:swap;
	src:local('TmonMonsori'), local('TmonMonsori'), url('/font/TmonMonsori.ttf') format('woff2');
}


/* Reset */
* {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    word-break: break-all;
    outline: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
html {
    font-size: 62.5%;
    font-family: 'Noto Sans KR';
    letter-spacing: -0.04em;
    margin: 0;
    padding: 0;
}

blockquote,
body,
button,
code,
dd,
div,
dl,
dt,
fieldset,
form,
h1,
h2,
h3,
h4,
h5,
h6,
input,
legend,
li,
ol,
p,
pre,
select,
td,
textarea,
textarea,
th,
ul {
    margin: 0;
    padding: 0;
}
body {
    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touch;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: normal;
    font-size: 100%;
}
button,
input,
label,
select,
textarea {
    vertical-align: middle;
}
strong {
    display: inline-block;
}
fieldset,
iframe,
img {
    border: 0 none;
}
img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
    border-style: none;
}
textarea {
    width: 100%;
    padding: 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    resize: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
address,
em {
    font-style: normal;
}
a {
    text-decoration: none;
    background-color: transparent;
    vertical-align: middle;
    -webkit-text-decoration-skip: objects;
    word-break: break-word;
}
a:active,
a:focus,
a:hover {
    text-decoration: none;
}
li,
menu {
    list-style: none;
}
s {
    text-decoration: none;
}
button {
    padding: 0;
    margin: 0;
    overflow: visible;
    cursor: pointer;
    vertical-align: middle;
    text-transform: none;
    border: none;
    background: none;
    font-family: 'Noto Sans KR';
}
button,
html [type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: none;
}
hr {
    display: block;
}
address,
em,
i {
    font-style: normal;
}
label {
    cursor: pointer;
}
input[type="checkbox"],input[type="radio"] {position:absolute; left:0; top:0;  width:0; height:0; margin:0; padding:0; opacity:0;}
span{
    display: inline-block;
}

iframe {
    width: 100%;
    height: 102%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

table{
	text-align:center;
}




/* input */
input {overflow:visible; transition:border 0.4s; border:none; color:#666666;}
input[type="text"], 
input[type="password"], 
input[type="tel"], 
input[type="email"], 
input[type="number"], 
input[type="date"], 
input[type="search"] {flex:1; width:100%; height:3.8rem; font-size:1.6rem; padding:0 1.4rem; -webkit-appearance:none; -moz-appearance:none; appearance:none; transition:all 0.4s; border-radius:0.6rem; font-family:"Pretendard"; font-weight:400; color:#666666; border:1px solid #E3E3E3; background:#ffffff}

input:focus {padding:0 1.6rem; color:#111; outline:none}

input[type="date"] {background:url(../img/icon/icon-date-right-darkgray-24-px2x.png) right 1.6rem center / 2rem no-repeat;}
input[type="date"]::-webkit-calendar-picker-indicator {color:transparent; background:none;}

input[type="checkbox"],input[type="radio"] {position:absolute; left:0; top:0;  width:0; height:0; margin:0; padding:0; opacity:0;}

input:read-only,
input:disabled{color:#555; -webkit-text-fill-color:inherit; border: 1px solid #ddd; background:#ddd;} 

/* ´ëÃâ½Åû - ÀüÈ­¹øÈ£¿µ¿ª */
.inp.inp_com.disabled_type,
.inp.inp_com.disabled_type input,
.inp.inp_com.disabled_type input:disabled{color:red; border: 1px solid #eee; background:#eee;} 

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {display:none;}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {-webkit-appearance:none; margin:0;}

input[type="password"]:disabled {opacity:1; -webkit-text-fill-color:#555;}

::-webkit-input-placeholder {font-size:1.6rem; color:#666; font-weight:400; vertical-align:middle; text-align: left;}
input[type="tel"]::placeholder {text-align:left;}

input.has_el[inputmode="numeric"] {text-align:right;}


/* ¼¿·ºÆ® */
select {width:100%; height:3.8rem; padding:0 3.4rem 0 1.4rem; font-size:1.6rem; font-weight:400; border:none; -webkit-appearance:none; text-transform:none; transition:border 0.4s; border-radius:0.6rem; border:1px solid #E3E3E3; background:#ffffff url('/img/content/icon-arrow-down-18-px.svg') right 1.4rem center / 2rem no-repeat;}
select:disabled {color:#666; transition:all 0.4s; -webkit-text-fill-color:inherit; background:#ddd url(../img/icon/icon-arrow-down-18-px.svg) right 1.4rem center / 2rem no-repeat;}
select:disabled option {color:#666}
select:focus {color:#000000; font-weight:500; transition:border 0.4s;}

textarea{
	flex:1; width:100%; height:7rem; font-size:1.6rem; padding:1.4rem; transition:all 0.4s; border-radius:0.6rem; font-family:"Pretendard"; font-weight:400; color:#666666; border:1px solid #E3E3E3; background:#ffffff;resize:none;
}
textarea:focus {padding:1.4rem 1.6rem; color:#111;}