/*****************************/
/** Font Custom Preset      **/
/*****************************/


@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format("woff2"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format("woff"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format("opentype");
}

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format("woff2"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format("woff"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format("opentype");
}


@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format("woff2"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format("woff"), url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format("opentype");
}



body, 
p, 
h1, 
h2, 
h3, 
h4, 
h5, 
h6, 
input, 
textarea, 
select {
    font-family: 'Montserrat', 'Noto Sans KR' ;
    word-break: keep-all;
}

h1, h2, h3, h4, h5, h6 {
  line-height: 1.5em; 
  font-weight: 700; 
  color:#040000; 
  margin-bottom: 10px; 
  font-family: 'Raleway', 'Noto Sans KR' ;
  letter-spacing: -.06em;
}


body, 
p {
    font-weight: 400; 
    font-size: 15px; 
    letter-spacing: -.06em; 
    color:#333;
}

h1 {font-size: 30px;}
h2 {font-size: 26px;}
h3 {font-size: 22px;}
h4 {font-size: 20px;}
h5 {font-size: 18px;}
h6 {font-size: 16px;}


/*****************************/
/** Common                  **/
/*****************************/
* {
    outline: none;
}

body {
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
}

img {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -moz-user-drag: none;
    -ms-user-drag: none;
    user-drag: none;
    display: block;
    height: auto;
    width: auto;
}

a {
    text-decoration: none;
}

.clearfix:before,
.clearfix:after {
    content: '\0020';
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    zoom: 1;
}






/*****************************/
/** Custom Preset           **/
/*****************************/
.blue {color: #1575ba;}
.green {color: #9acd64;}
.gold {color:#8a6d49;}
.red {color: #e92e2f;}
.orange {color: #f29833;}
.navy {color: #34495e;}
.white {color: #ffffff;}
.yellow {color: #ffe62c;}

.bg-blue {background-color: #1575ba;}
.bg-green {background-color: #9acd64;}
.bg-gold {background-color:#8a6d49;}
.bg-red {background-color: #e92e2f;}
.bg-orange {background-color: #f29833;}
.bg-navy {background-color: #34495e;}
.bg-white {background-color: #ffffff;}
.bg-yellow {background-color: #ffe62c;}
.bg-dark-grey {background-color: #313131;}
.bg-light-grey {background-color: #f4f5f7;}

.font-300 {font-weight: 300;}
.font-400 {font-weight: 400;}
.font-500 {font-weight: 500;}
.font-600 {font-weight: 600;}
.font-700 {font-weight: 700;}

.align-center {text-align: center;}
.align-right {text-align: right;}
.align-left {text-align: left;}

.lg-20 {width: 19.5%; margin-right:.5%; float: left; }
.lg-25 {width: 23%; margin-right:2%; float: left;}
.lg-33 {width: 31.33%; margin-right: 2%; display: inline-block; vertical-align: top;}
.lg-50 {width: 48.5%; margin-right: 3%; float: left;}



.col-4-left {width: 31%; float: left;}
.col-8-right {width: 65%; float: right;}
.col-5-left {width: 40%; float: left;}
.col-7-right {width: 48%; float: right;}

.visible {opacity: 1!important;}

.vertical-center {
    display: -webkit-box; 
    display: -ms-flexbox; 
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.transition {
    transition:all 0.3s ease; 
    -webkit-transition:all 0.3s ease; 
    -ms-transition:all 0.3s ease;
}
input, button, select, textarea {
    -webkit-transition: color 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86), background-color 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86), border-color 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -moz-transition: color 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86), background-color 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86), border-color 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -o-transition: color 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86), background-color 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86), border-color 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition: color 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86), background-color 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86), border-color 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

select {
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    -webkit-appearance: none;
    appearance: none;
    border-style: solid;
    border-color: transparent;
    -moz-appearance: none;
    text-overflow: "";
    outline: none;
    background-position: 100% center;
    background-repeat: no-repeat;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}

input, textarea, select {
    display: block;
    font-size: 14px;
    line-height: initial;
    margin: 9px 0px 0px 0px;
    padding: 10px 15px 10px 15px;
    border-style: solid;
    border-radius: 2px;
    font-weight: normal;
    border: 1px solid transparent;
}

a.btn-loco {
  color: #313131; 
  font-weight: 700; 
  position: relative; 
  padding: 12px 36px; 
  font-size: .9em; 
  display: inline-block;
  border: 1px solid #313131; 
  background-color: rgba(255,255,255,0);
  transition:all 0.3s ease; 
  -webkit-transition:all 0.3s ease; 
  -ms-transition:all 0.3s ease;
}
a.btn-loco:hover {
  color: #ffffff; 
  background-color: #313131;
}

.btn-loco.dark {
  background-color: #1e1e1e;
  color: #ffffff;
  border-color: #1e1e1e;
}
.btn-loco.dark:hover {
  background-color: rgba(255,255,255,0);
}

.btn-loco.white {
  background-color: rgba(255,255,255,0);
  color: #ffffff;
  border-color: #fff;
}

.btn-loco.white:hover {
  background-color: rgba(255,255,255,1);
  color: #333;
}

.shadow{
    -webkit-box-shadow: 1px 1px 12px -2px rgba(0,0,0,0.1);
    -moz-box-shadow: 1px 1px 12px -2px rgba(0,0,0,0.1);
    box-shadow: 1px 1px 12px -2px rgba(0,0,0,0.1);
}

.error404 .breadcrumbs {display: none;}



/* Page Navi */
.loco .wp-pagenavi {
  border-top: 0;
}

.loco .wp-pagenavi a:hover, 
.loco .wp-pagenavi span.current {
  color: #040000!important;
  font-weight: 700;
}


/*****************************/
/** Responsive Custom       **/
/*****************************/ 


/*** Responsive Styles Large Desktop And Above ***/
@media all and (min-width: 1405px) {
  
}
 
/*** Responsive Styles Standard Desktop Only ***/
@media all and (min-width: 1100px) and (max-width: 1405px) {
 
}
 
/*** Responsive Styles Tablet And Below ***/
@media all and (max-width: 980px) {
     .sm-50 {width: 48%; margin-right: 2%; float: left;}
     .sm-50:nth-child(2n) {margin-right:0;}
     .col-4-left, .col-8-right {width: 100%; float: none;}
}
 
/*** Responsive Styles Tablet Only ***/
@media all and (min-width: 768px) and (max-width: 980px) {
    body, p {font-size: 14px;}
    h1 {font-size: 24px;}
    h2 {font-size: 20px;}
    h3 {font-size: 18px;}
    h4 {font-size: 16px;}
    h5 {font-size: 15px;}
    h6 {font-size: 14px;}
}
 
/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
    body, p {font-size: 12px;}
    h1 {font-size: 22px;}
    h2 {font-size: 18px;}
    h3 {font-size: 17px;}
    h4 {font-size: 15px;}
    h5 {font-size: 14px;}
    h6 {font-size: 12px;}

    .lg-25 {width: 100%; float: none; margin-right:0; }
}
 
/*** Responsive Styles Smartphone Portrait ***/
@media all and (max-width: 479px) {
 
}