@import url('//fonts.googleapis.com/earlyaccess/jejumyeongjo.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

.font-mn * {
 font-family: 'Jeju Myeongjo', serif;
}
@font-face {
   font-family: "NotoSansCJKkr";
   src: url(../font/NotoSansCJKkr-Bold.eot);
   src: local(※), url(../font/NotoSansCJKkr-Bold.woff) format("woff"), url(../font/NotoSansCJKkr-Bold.ttf) format("ttf");
   font-weight: 800;
}
@font-face {
   font-family: "NotoSansCJKkr";
   src: url(../font/NotoSansCJKkr-Medium.eot);
   src: local(※), url(../font/NotoSansCJKkr-Medium.woff) format("woff"),
      url(../font/NotoSansCJKkr-Medium.ttf) format("ttf");
   font-weight: 600;
}
@font-face {
   font-family: "NotoSansCJKkr";
   src: url(../font/NotoSansCJKkr-Regular.eot);
   src: local(※), url(../font/NotoSansCJKkr-Regular.woff) format("woff"),
      url(../font/NotoSansCJKkr-Regular.ttf) format("ttf");
   font-weight: 500;
}
@font-face {
   font-family: "NotoSansCJKkr";
   src: url(../font/NotoSansCJKkr-Light.eot);
   src: local(※), url(../font/NotoSansCJKkr-Light.woff) format("woff"),
      url(../font/NotoSansCJKkr-Light.ttf) format("ttf");
   font-weight: 400;
}
@font-face {
   font-family: "NotoSansCJKkr";
   src: url(../font/NotoSansCJKkr-DemiLight.eot);
   src: local(※), url(../font/NotoSansCJKkr-DemiLight.woff) format("woff"),
      url(../font/NotoSansCJKkr-DemiLight.ttf) format("ttf");
   font-weight: 200;
}
@font-face {
   font-family: "KoPubWorld";
   src: url(../font/KoPubWorldBatang-Medium.ttf) format("truetype");
   font-weight: normal;
}
@font-face {
   font-family: "KoPubWorld";
   src: url(../font/KoPubWorldBatang-Bold.ttf) format("truetype");
   font-weight: bold;
}
@font-face {
   font-family: "KoPubWorld";
   src: url(../font/KoPubWorldBatang-Light.ttf) format("truetype");
   font-weight: lighter;
}
/**********************************************************
                         common
***********************************************************/
html,
body {
   position: relative;
   width: 100%;
}
body {
   min-width: 320px;
   margin: 0 auto;
   font-size: 14px;
   font-family: "NotoSansCJKkr", sans-serif;
   font-weight: 500;
   letter-spacing: normal;
   color: #000;
   background-color: #fff;
   line-height: 1.2;
}
select,
input {
   font-family: "NotoSansCJKkr";
   box-sizing: border-box;
}
header,
nav,
section,
footer {
   width: 100%;
}

/**********************************************************
                       common_class
***********************************************************/
.fore {
   position: relative;
   width: 100%;
   max-width: 1280px;
   margin: 0 auto;
   text-align: left;
}
.fore > svg.vert_line { position:absolute; top: -200px;  } 
.sub.fore {
   position: relative;
   width: 100%;
   max-width: 1240px;
   margin: 0 auto;
   text-align: left;
}
.fore_full {
   position: relative;
   width: 100%;
   text-align: left;
}
.fore_pd {
   position: relative;
   width: 100%;
   padding: 0 100px;
   text-align: left;
}

/* 컨텐츠 이미지 radius추가 */
.sub .imgwrap,
.sub .imgwrap > img,
.sub .sfp_imginner,
.sub .sfp_imginner > img,
.sub .sub_mapwrap,
.sub .otl_list .otl_img,
.sub .saca_wrap .saca_img,
.sub .fds_list .fds_img,
.sub .sub_videocon,
.sub .research_cardwrap > li {
   border-radius: 10px;
   overflow: hidden;
}
.img_border,
.tstep_imglist > img,
.sub02 .imgwrap > img {
   border: 1px solid #ddd;
   border-radius: 10px;
   overflow: hidden;
}

.text_left {
   text-align: left;
}
.text_center {
   text-align: center;
}
.text_right {
   text-align: right;
}

.bg_white {
   background: #fff;
}
.bg_black {
   background: #000;
}
.bg_lgray {
   background: #f8f8f8;
}
.bg_gray {
   background: #f3f3f3;
}
.bg_ngray {
   background: #f9f9f9;
}
.bg_dgray {
   background: #f5f5f5;
}
.bg_ivory_half {
   background: #fff;
   background: -webkit-linear-gradient(
      to bottom,
      #fff 0,
      #fff 70%,
      #f8f3ee 70%,
      #f8f3ee 100%
    );
    /* For Safari 5.1 to 6.0 */ */
    background: -o-linear-gradient(to bottom, #fff 0, #fff 70%, #f8f3ee 70%, #f8f3ee 100%); /* For Opera 11.1 to 12.0 */ */
    background: -moz-linear-gradient(to bottom, #fff 0, #fff 70%, #f8f3ee 70%, #f8f3ee 100%); /* For Firefox 3.6 to 15 */ */
    background: linear-gradient(to bottom, #fff 0, #fff 70%, #f8f3ee 70%, #f8f3ee 100%); /* Standard syntax */
}

.fw_light {
   font-weight: 400;
}
.fw_medium {
   font-weight: 600;
}
.fw_regular {
   font-weight: 500;
}
.fw_700 {
   font-weight: 700;
}
.fw_bold {
   font-weight: 800;
}
.bdr_none {
   border: 0px !important;
   border-radius: 0px !important;
}
.col_white {
   color: #fff;
}
.col_black {
   color: #000;
}
.col_gray {
   color: #999999;
}
.col_darkgray{
    color: #333;
}
.col_lightblue {
   color: #5378a8;
}
.col_skyblue {
   color: #0091d6;
}
.col_blue {
   color: #3748ab;
}
.col_mblue {
   color: #3f6aeb;
}
.col_orange {
   color: #c29a4c;
}
.col_red{
   color: #900c22;
}
.col_gold{
   color: #907851;
}
.bg_orange {
   background: #c29a4c;
}
.bg_skyblue {
   background-color: #e2f2f6;
}
.bdr_none {
   border: 0px !important;
   border-radius: 0px !important;
}
.bd_right {
   border-right: 1px solid;
}
.bd_bottom {
   border-bottom: 1px solid;
}
.bd_ddd {
   border-color: #ddd;
}
.bd_gray {
   border-color: #d9d9d9;
}
.bd_darkgray {
   border-color: #8b8b8b;
}

.olt_24 {
   font-size: 24px;
}
.olt_22 {
   font-size: 22px !important;
}
.olt_18 {
   font-size: 18px !important;
}
.olt_20 {
   font-size: 18px !important;
}

.olt_16 {
   font-size: 16px !important;
}

.olt_14 {
   font-size: 14px;
}

.line_h {
   line-height: initial !important;
}

.flex_center {
   display: flex;
   align-items: center;
   justify-content: center;
}
.flex_between {
   display: flex;
   align-items: center;
   justify-content: space-between;
}
.flex_start {
   display: flex;
   align-items: center;
   justify-content: flex-start;
}
.flex_alignstart {
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
}
.flex_evenly {
   display: flex;
   justify-content: space-evenly;
}
.flex_around {
   display: flex;
   justify-content: space-around;
}
.flex_auto {
   flex: auto;
}
.flex_shrink {
   flex-shrink: 0;
}
.flex_row {
   flex-direction: row;
}
.flex_column {
   flex-direction: column;
}
.flex_wrap {
   flex-wrap: wrap;
}
.align_start {
   align-items: flex-start;
}
.flex_end {
   align-items: flex-end;
}

.fore_w100 {
   width: 100%;
}
.fore_w85 {
   width: 85%;
}
.fore_w75 {
   width: 75%;
}
.fore_w70 {
   width: 70%;
}
.fore_w65 {
   width: 65%;
}
.fore_w60 {
   width: 60%;
}
.fore_w50 {
   width: 50%;
}
.fore_w40 {
   width: 40%;
}
.fore_w33 {
   width: 33.33%;
}
.fore_w25 {
   width: 25%;
}
.fore_w24 {
   width: 24%;
}
.fore_w20 {
   width: 20%;
}
.mg_b120 {
   margin-bottom: 120px;
}
.mg_t100 {
   margin-top: 100px;
}
.mg_t150 { margin-top: 150px; }

.mg_t60 {
   margin-top: 60px;
}
.mg_b100 {
   margin-bottom: 100px;
}
.mg_b80 {
   margin-bottom: 80px;
}
.mg_b50 {
   margin-bottom: 50px;
}
.mg_t55 {
   margin-top: 55px;
}
.mg_t50 {
   margin-top: 50px;
}
.mg_t40 {
   margin-top: 40px;
}
.mg_b40 {
   margin-bottom: 40px;
}
.mg_b35 {
   margin-bottom: 35px;
}
.mg_t30 {
   margin-top: 30px;
}
.mg_t20 {
   margin-top: 20px;
}
.mg_b30 {
   margin-bottom: 30px;
}
.mg_b20 {
   margin-bottom: 20px !important;
}
.mg_l20 {
   margin-left: 20px;
}
.mg_r60 {
   margin-right: 60px;
}
.mg_r40 {
   margin-right: 40px;
}
.mg_r20 {
   margin-right: 20px;
}
.mg_r10 {
   margin-right: 10px;
}
.mg_t10 {
   margin-top: 10px;
}
.mg_b15 {
   margin-bottom: 15px;
}
.mg_b10 {
   margin-bottom: 10px;
}
.mg_b5 {
   margin-bottom: 5px;
}
.pd_r155 {
   padding-right: 155px;
}
.pd_l155 {
   padding-left: 155px;
}
.pd_t100 {
   padding-top: 100px;
}
.pd_b100 {
   padding-bottom: 100px;
}
.pd_b80 {
   padding-bottom: 80px;
}
.pd_t80 {
   padding-top: 80px;
}
.pd_l100 {
   padding-left: 100px;
}
.pd_r100 {
   padding-right: 100px;
}
.pd_l75 {
   padding-left: 75px;
}
.pd_r75 {
   padding-right: 75px;
}
.pd_l60 {
   padding-left: 60px;
}
.pd_r60 {
   padding-right: 60px;
}
.pd_b60 {
   padding-bottom: 60px;
}
.pd_t60 {
   padding-top: 60px;
}
.pd_r40 {
   padding-right: 40px;
}
.pd_l30 {
   padding-left: 30px;
}
.pd_t35 {
   padding-top: 35px;
}
.pd_b35 {
   padding-bottom: 35px;
}
.pd_r30 {
   padding-right: 30px;
}
.pd_t20 {
   padding-top: 20px;
}
.pd_b20 {
   padding-bottom: 20px;
}
.pd_l20 {
   padding-left: 20px;
}
.pd_r20 {
   padding-right: 20px;
}
.pd_t10 {
   padding-top: 10px;
}
.pd_b10 {
   padding-bottom: 10px;
}
.pd_l10 {
   padding-left: 10px;
}
.pd_r10 {
   padding-right: 10px;
}
.pd_r5 {
   padding-right: 5px;
}
.pdmg_0 {
   padding: 0 !important;
   margin: 0 !important;
}
.mo_pd_l100 {
   padding-left: 100px;
}

.mo_pd_l60 {
   padding-left: 60px;
}
.mo_pd_r60 {
   padding-right: 60px;
}
.mo_pd_l50 {
   padding-left: 50px;
}
.mo_pd_r50 {
   padding-right: 50px;
}
.mg_0 {
   margin: 0 !important;
}

.mo_mg_0 {
   margin: 0 !important;
}
.pd_l100s {
   padding-left: 100px;
}
.two_img > img {
   width: 50% !important;
}
.dp_pc,
.dp_pcs {
   display: block;
}
.dp_mo,
.dp_mos {
   display: none;
}

.letsp-2{
    letter-spacing: -2px;
}

.video-container {
    position: relative;
    width: 100%;
    height: auto;
    padding-top: 50%;
}

.video-container iframe.heal_frame {
    z-index: 1;
    top: 0;
    left: 0;
    position: absolute;
    width: 100%;
    height: 100%;
}

/**********************************************************
                        responsive
***********************************************************/
@media screen and (max-width: 1340px) {
   .fore {
      max-width: 100%;
      padding: 0 30px;
   }
   .pd_t10 {
      padding-top: calc(10vw / 1340 * 100);
   }
   .pd_b10 {
      padding-bottom: calc(10vw / 1340 * 100);
   }
   .pd_l10 {
      padding-left: calc(10vw / 1340 * 100);
   }
   .pd_r10 {
      padding-right: calc(10vw / 1340 * 100);
   }
}
@media screen and (max-width: 1023px) {
   .dp_pc {
      display: none;
   }
   .dp_mo{
      display: block;
   }
   .mo_pd_l100 {
      padding-left: 0;
   }
   .mo_mg_0 {
      margin: 0 auto !important;
   }
   .pd_l100s {
      padding-left: 0;
   }
}
@media screen and (max-width: 799px) {
   .mo_pd_l60 {
      padding-left: 0;
   }
   .mo_pd_r60 {
      padding-right: 0;
   }
   .dp_pcs{
     display:none;
   }
   .dp_mos{
     display: block;
   }

  .maxix-img{
    width:calc(100% + 60px) !important;
    margin-left:-30px;
  }
}

@media screen and (max-width: 639px) {
   .mg_t100 {
      margin-top: 50px;
   }
   .mg_b100 {
      margin-bottom: 50px;
   }
   .pd_t100 {
      padding-top: 50px;
   }
   .pd_b100 {
      padding-bottom: 50px;
   }
   .two_img > img {
      width: 100% !important;
   }
}
@media screen and (max-width: 499px) {
   .fore {
      padding: 0 20px;
   }
   .maxix-img{
     width:calc(100% + 40px) !important;
     margin-left:-20px;
   }
}
@media screen and (max-width: 399px) {
}

/**********************************************************
                        swiper-slide
***********************************************************/
/* 스위퍼 이벤트 */
.swiper-container {
   width: 100%;
   height: 100%;
   margin-left: auto;
   margin-right: auto;
}
/* .swiper-wrapper{
   transition-timing-function: cubic-bezier(0.18, 0.91, 0.32, 1.28) !important;
   transition-duration: 400ms !important;
} */
.swiper-slide {
   text-align: center;
   font-size: 18px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: -webkit-flex;
   display: flex;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   -webkit-justify-content: center;
   justify-content: center;
   -webkit-box-align: center;
   -ms-flex-align: center;
   -webkit-align-items: center;
   align-items: center;
   backface-visibility: hidden; /* 슬라이드중 흐려짐효과 */
}
.swiper-button-next,
.swiper-button-prev {
   outline: none;
}
.swiper-button-next,
.swiper-button-prev {
   top: 50%;
   width: 17px;
   height: 24px;
   margin: 0 auto;
   transform: translateY(-50%);
   color: #c9dc62;
   outline: none;
}
.swiper-button-next {
   right: 0;
   background: #c9dc62;
}
.swiper-button-prevv {
   left: 0;
   background: #c9dc62;
}
.swiper-button-next:after,
.swiper-button-prev:after {
   display: none;
}
