/**********************************************************
                         common
***********************************************************/
@import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css');
@import url('https://fonts.cdnfonts.com/css/montserrat');
@import url('https://fonts.cdnfonts.com/css/manrope');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css');

:root {
   --color-header-middle-bg: #fff;
   --color-content-bg-alt: #f5f5f5;
   --color-content-border: #e8e8e8;
   --color-content-text: #333;
}

html,
body {
   position: relative;
   width: 100%;
   scroll-behavior: smooth;
}
body {
   width: 100%;
   overflow-x: hidden;
   min-width: 320px;
   margin: 0 auto;
   font-size: 14px;
   font-family: 'Pretendard', 'Nanum Gothic2',sans-serif;
   font-weight: 500;
   letter-spacing: 0;
   color: #000;
   background-color: #fff;
   line-height: 1.2;
}
body.active{
   overflow: hidden;
}
select,
input {
   font-family: "Pretendard","Nanum Gothic2", sans-serif;
   box-sizing: border-box;
}
.header,
.nav,
.section,
.footer {
   width: 100%;
}


/**********************************************************
                       common_class
***********************************************************/
.recv {
   position: relative;
   width: 100%;
   max-width: 1460px;
   margin: 0 auto;
   text-align: left;
}

.recv_prod {
   position: relative;
   width: 100%;
   text-align:center;
   margin: 0 auto;
}

.recv_full {
   position: relative;
   width: 100%;
   text-align: left;
}

.recv_1492 {
   position: relative;
   width: 100%;
   max-width: 1492px;
   margin: 0 auto;
   text-align: left;
}

.recv_1603 {
   position: relative;
   width: 100%;
   max-width: 1603px;
   margin: 0 auto;
   text-align: left;
}

.recv_pd {
   position: relative;
   width: 100%;
   text-align: left;
   border-bottom: 1px solid rgba(255,255,255,0.5);
}

.recv_pd.rs365 { max-width:1000px; margin:0 auto;  }

.text_left {
   text-align: left;
}
.text_center {
   text-align: center;
}
.text_right {
   text-align: right;
}

.bg_white {
   background: #fff;
}
.bg_black {
   background: #000;
}
.col_white {
   color: #fff !important;
}
.col_black {
   color: #000;
}
.col_1{
   color: #dda61a !important;
}
.col_2{
   color: #05008a !important;
}
.col_3{
   color: #0e3d0c !important;
}
.col_4{
   color: red !important;
}

.col_blue { color: blue !important }
.col_red { color: red !important }

.bg_col1{
   background-color: #dda61a !important;
}
.bg_col2{
   background-color: #05008a !important;
}
.bg_col3{
   background-color: #0e3d0c !important;
}
.fw_light {
   font-weight: lighter;
}
.fw_normal {
   font-weight: normal;
}
.fw_bold {
   font-weight: bold;
}
.txt-center { text-align:center;  }

.otl21{
   font-size: 21px;
}

.dp_pc,
.dp_pc2,
.dp_pc3  {
   display: block;
   margin: 0 auto;
}
.dp_mo,
.dp_mo2,
.dp_mo3  {
   display: none;
}
.hidden{
   display: none;
}

/**********************************************************
                        margin / padding
***********************************************************/

.mg_t20 { margin-top: 20px;  }
.mg_t53 { margin-top: 53px;  }
.mg_t100 { margin-top: 100px;  }
.mg_t150 { margin-top: 150px;  }
.mb_b30 { margin-bottom: 30px;  }
.mb_b50 { margin-bottom: 50px;  }


/**********************************************************
                        tag
***********************************************************/
.tag_title1{
   background:#000;
   
   border-radius: 20px;
   padding: 8px 28px;
   display:inline-block;
   
}
.tag_title1 a { font-size: 20px; color: #fff; }
/**********************************************************
                        video
***********************************************************/
.video-popup.reveal {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    justify-content: center;
    align-items: center;
    z-index: 99
}

.video-popup .video-wrapper {
    position: relative;
    width: 70%;
    padding-bottom: 40%;
    z-index: 100
}

.video-popup .video-wrapper iframe {
    position: absolute;
    width: 100%;
    height: 100%;
}

.video-popup.reveal .video-popup-closer {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .5);
    z-index: 99
}

/**********************************************************
                        responsive
***********************************************************/
@media screen and (max-width: 1600px) {
   .recv_pd {
      position: relative;
      width: 100%;
      padding: 0 40px;
      text-align: left;
   }
}
@media screen and (max-width: 1023px) {
   .dp_pc {
      display: none;
   }
   .dp_mo {
      display: block;
   }

}
@media screen and (max-width: 799px) {
   .recv_pd {
      position: relative;
      width: 100%;
      padding: 0 20px;
      text-align: left;
   }
   .recv_pd.recv_mob { padding: 0 0px; margin-top: -15px; }
}
@media screen and (max-width: 639px) {
   .dp_pc3 {
      display: none;
   }
   .dp_mo3 {
      display: block;
   }
}
@media screen and (max-width: 499px) {
   .dp_pc2 {
      display: none;
   }
   .dp_mo2 {
      display: block;
   }
   .otl21{
      font-size: 18px;
   }
}
@media screen and (max-width: 399px) {
}