/* fonts
@font-face {
    font-family: 'Pretendard';
    src: url('./fonts/Pretendard-Thin.woff') format('woff');
    font-weight: 100;
}
@font-face {
    font-family: 'Pretendard';
    src: url('./fonts/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
}
@font-face {
    font-family: 'Pretendard';
    src: url('./fonts/Pretendard-Medium.woff') format('woff');
    font-weight: 500;
}
@font-face {
    font-family: 'Pretendard';
    src: url('./fonts/Pretendard-SemiBold.woff') format('woff');
    font-weight: 700;
}
@font-face {
    font-family: 'Pretendard';
    src: url('./fonts/Pretendard-Bold.woff') format('woff');
    font-weight: 800;
}

@font-face {
    font-family: 'Pretendard';
    src: url('./fonts/Pretendard-ExtraBold.woff') format('woff');
    font-weight: 900;
}
*/

/* initiating */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body { margin: 0; padding: 0; font-size:19px; }
ul,ol {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
li { list-style: none !important }

:root {
    --primary : #0092FF;
    --secondary : #4987C7;
    --tertiary : #0A62A2;

    --success : #4F9DF5;
    --danger : #D23949;
    --warning : #F1CE85;

    --outfit : "Outfit", sans-serif;
    --p : "Pretendard", sans-serif;
}

.txt-primary { color:var(--primary); }
.txt-secondary { color:var(--secondary); }
.txt-tertiary { color:var(--tertiary); }

.bg-primary { background-color:var(--primary); }
.bg-secondary { background-color:var(--secondary); }
.bg-tertiary { background-color:var(--tertiary); color:#fff }


.txt-outfit { font-family:var(--outfit) }
.txt-white { color:#fff }
.txt-warning { color: var(--warning); }
.txt-gray { color: rgba(150,150,150,.5) }
.txt-black { color: #000; font-weight: 700;}


.bg-sky { background-color: #D9EEE9; }
.bg-ivory { background-color: #F5F8F1; }
.bg-gray { background-color:#EDEDED }


.temp {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #E2EBEC ;
}
.temp img { opacity: 0; }
.temp::before {
    content: 'IMAGE';
    position: absolute;
    width: inherit;
    text-align: center;
    display: block;
    font-weight: 400;
    color: rgba(50,50,50,.3);
}

section.main-preview .thmzone .swiper-slide.temp::before { line-height:15em; }
section.main-preview .mainzone .swiper-slide.temp::before { line-height:7em; }




/* fonts */
*,  input, textarea { font-family: "Outfit", "Pretendard", sans-serif; word-break: keep-all; margin: 0; text-align: left; line-height:1.3; letter-spacing: -0.025em; color:#272727; font-weight: 500}
input:focus,  textarea:focus,  select:focus,  a:focus { outline: none; }
a { color: inherit; text-decoration: none;}
a:hover { color:inherit; }
div,nav,footer,header,ul,li,a { box-sizing:border-box; }


h1, h2, h3, h4, h5, h6 { font-weight:bolder; color:inherit; line-height:1.7; }
h1 { font-size:2.5em }
h2 { font-size:2em }
h3 { font-size:1.8em }
h4 { font-size:1.5em }
h5 { font-size:1.2em }
h6 { font-size:1.0em }

b { font-weight: bold; }
strong { font-weight: bolder; font-family: inherit;}
u { font-style:normal; font-weight:normal; font-family:inherit; color:inherit; }
i { font-style:normal; font-weight:lighter; font-family:inherit; color:inherit; }

p, strong, b, span, h1, h2, h3, h4, h5, h6 { font-family: inherit; color:inherit; letter-spacing:inherit; line-height:inherit; }

h1 *, h2 *, h3 *, h4 *, h5 *, h6 * { line-height:inherit; font-weight:inherit; }

/* text effect */
.highlight {
    display: inline-block;
    position: relative;
}
.highlight::after {
    content: '';
    display: inherit;
    position: absolute;
    width: 100%;
    height: 0.5em;
    left: 0;
    bottom: 0.3em;
    z-index: -1;
}
.hl-yellow::after { background-color: var(--danger); }





/* drag area */
::-moz-selection {
    background-color: rgba(0, 146, 255, 0.8);
    color: #fff;
    text-shadow: 0.1em 0.1em 0.1em rgba(0,80,86,.2);
}
::selection {
    background-color: rgba(0, 146, 255, 0.8);
    color: #fff;
    text-shadow: 0.1em 0.1em 0.1em rgba(0,80,86,.2);
}

.blur {
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
 }

/* font size */
.f14 { font-size: 14px; }
.f16 { font-size: 16px; }
.f18 { font-size: 18px; }
.f20 { font-size: 20px; }
.f22 { font-size: 22px; }
.f24 { font-size: 24px; }
.f26 { font-size: 26px; }
.f28 { font-size: 28px; }
.f30 { font-size: 30px; }
.f32 { font-size: 32px; }
.f36 { font-size: 36px; }
.f38 { font-size: 38px; }
.f40 { font-size: 40px; }
.f42 { font-size: 42px; }
.f60 { font-size: 60px; }

/* signiture external fonts */
.Anek { font-family: var(--a); }


/* layout */
#wrapper { margin:0; padding: 0; }

/* static class */
.width-full { width: 100vw; }
.width-full-percent { width: 100%; }
.width-fit { width: fit-content; }

/* position */
.sticky { position: fixed; }
.position-rel { position: relative; }
.position-abs { position: absolute; }

/* flex layout  */
.flex { display:flex; }
.flex.row { flex-direction: row; }
.flex.col { flex-direction: column; }
.center-center { justify-content:center; align-items: center; }
.justify-between { justify-content: space-between; }
.justify-around { justify-content: space-around; }
.justify-center { justify-content: center; }
.justify-start { justify-content: flex-start; }
.justify-stretch { align-items: stretch; }
.justify-end { justify-content: flex-end; }
.align-center { align-items: center; }
.align-end { align-items: flex-end; }
.align-start { align-items: flex-start; }
.align-stretch { align-items: stretch; }

/* grid layout */
.grid { display:grid }
.half { grid-template-columns:1fr 1fr }
.trio { grid-template-columns:repeat(3, 1fr); }
.quater { grid-template-columns:repeat(4, 1fr); }
.five { grid-template-columns:repeat(5, 1fr); }

/* text-style */
.txt-center { text-align: center; }
.txt-left { text-align: left; }
.txt-right { text-align: right; }
.fw900 { font-weight: 900; }
.fw700 { font-weight:700; }
.fw600 { font-weight:600; }
.fw500 { font-weight:500; }
.fw400 { font-weight:400; }
.fw300 { font-weight: 300; }
.fw100 { font-weight: 100; }
.uppercase { text-transform: uppercase; font-family: var(--outfit) }


pre { background-color:#f5f5f5; border-radius:10px; padding:1em; font-family: var(--p); color: #999; font-weight: 500; letter-spacing: 0.01em; font-size: 0.9em; margin: 1em auto 0; width: 80%; }

/* img */
figure { overflow:hidden; display:block; }
figure img { max-width: 100%; }

/* opacity */
.op60 { opacity: 0.6; }
.op50 { opacity: 0.5; }
.op40 { opacity: 0.4; }
.op30 { opacity: 0.3; }
.op20 { opacity: 0.2; }
.op10 { opacity: 0.1; }

img {
    -webkit-user-select: none !important;
    -moz-user-select: -moz-none !important;
    -ms-user-select: none !important;
    user-select: none !important;
}




div.table table.noborder th { font-weight:bolder }
div.table table.noborder th,
div.table table.noborder td {
    text-align: justify;
    line-height: 0;
}
div.table table.noborder td::before,
div.table table.noborder td::after,
div.table table.noborder th::before,
div.table table.noborder th::after {
    content: '';
    display: inline-block;
    width: 100%;
    height: 0;
    line-height: 0;
    font-size: 0;
}
div.table table.noborder td {
    padding: 0.1em 1.5em;
    padding-right: 0;
    letter-spacing: 0.01em;
    line-height: 0.5;
    font-weight: 400 !important;
    letter-spacing: -0.03em;
}