@font-face {
    font-family: "NotoSansKR-Light";
    src: url("../font/NotoSansKR-Light.otf") format("truetype");
}
.tl {
    font-family: "NotoSansKR-Light";
}

@font-face {
    font-family: "NotoSansKR-Regular";
    src: url("../font/NotoSansKR-Regular.otf") format("truetype");
}
.tr {
    font-family: "NotoSansKR-Regular";

}

@font-face {
    font-family: "NotoSansKR-Medium";
    src: url("../font/NotoSansKR-Medium.otf") format("truetype");
}
.tm {
    font-family: "NotoSansKR-Medium";
}

@font-face {
    font-family: "NotoSansKR-Bold";
    src: url("../font/NotoSansKR-Bold.otf") format("truetype");
}
.tb {
    font-family: "NotoSansKR-Bold";
}

/* ------------------------------------------------------------------------------- */

.pc_view {display: block !important;}
.m_view {display: none !important;}


@media (max-width:768px) {

    .pc_view {display: none !important;}
    .pc_view2 {display: none !important;}
    .m_view {display: block !important;}
    .plus_col {color: #a5a5a5 !important;}
    .plus_col > span {color: #a5a5a5 !important;}
}

/* 기본 노말라이징 */
* {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    color: inherit;
}
input:focus, select:focus, textarea:focus {
    outline: none;
}
input, select, textarea {
    font-family: "NotoSansKR-Regular";
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
textarea {
    resize: none;
}
select::-ms-expand{
    display:none;
}
input::-ms-clear {
    display: none;
}

/* ------------------------------------------------------------------------------- */

/* 옵션 */
.con {
    margin:0 auto;
	max-width:1320px;
    box-sizing: border-box;
    padding: 0 20px;
}
.con2 {
    margin:0 auto;
	max-width:1696px;
    box-sizing: border-box;
    padding: 0 20px;
}
.img-box > img {
    width:100%;
    display:block;
}
.k-cell::after {
    content:"";
    display:block;
    clear:both;
}
.cell {
    float:left;
    box-sizing:border-box;
}
.cell-right {
    float:right;
    box-sizing:border-box;
}
.block {
    display:block;
}
.inblock {
    display:inline-block;
}
.flex {
    display:flex;
}
.inflex {
    display:inline-flex;
}
.aic {
    align-items: center;
}
.jcc {
    justify-content: center;
}
.jcsb {
    justify-content: space-between;
}
.fdc {
    flex-direction: column;
}
.fww {
    flex-wrap: wrap;
}
.wh100 {
    width: 100%;
    height: 100%;
}
.w100 {
    width: 100%;
}
.h100 {
    height: 100%;
}
.rel {
    position: relative;
}
.abs {
    position: absolute;
}
.fixed {
    position: fixed;
}
.xy-middle {
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.x-middle {
    left: 50%;
    transform: translateX(-50%);
}
.y-middle {
    top: 50%;
    transform: translateY(-50%);
}
.xy-tl {
    top: 0;
    left: 0;
}
.xy-tr {
    top: 0;
    right: 0;
}
.xy-bl {
    bottom: 0;
    left: 0;
}
.xy-br {
    bottom: 0;
    right: 0;
}
.mgc {
    margin: 0 auto;
}
.tac {
    text-align: center;
}
.tal {
    text-align: left;
}
.tar {
    text-align: right;
}
.cp {
    cursor: pointer;
}
.cfff {
    color: #fff;
}
.c000 {
    color: #000;
}
.bfff {
    background: #fff;
}
.b000 {
    background: #000;
}
.mc {
    color: #;
}
.sc {
    color: #;
}
.mbc {
    background;: #;
}
.sbc {
    background;: #;
}
.f20 {
    font-size: 20px;
}
.f18 {
    font-size: 18px;
}
.f16 {
    font-size: 16px;
}
.f14 {
    font-size: 14px;
}
.f12 {
    font-size: 12px;
}
.f10 {
    font-size: 10px;
}
h1, h2, h3, h4 {
    font-weight: inherit;
}
h1 {
    font-size: ;
}
h2 {
    font-size: ;
}
h3 {
    font-size: ;
}
h4 {
    font-size: ;
}
.ex::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    background: ;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    transform: translate(-50%, -50%);
    transform: translateX(-50%);
    transform: translateY(-50%);
}
/* ------------------------------------------------------------------------------- */

/* margin */
.mgc {margin: 0 auto;}

.mt4 {margin-top: 0.4rem;}
.mt8 {margin-top: 0.8rem;}
.mt12 {margin-top: 1.2rem;}
.mt16 {margin-top: 1.6rem;}
.mt20 {margin-top: 2rem;}
.mt24 {margin-top: 2.4rem;}
.mt28 {margin-top: 2.8rem;}
.mt32 {margin-top: 3.2rem;}
.mt36 {margin-top: 3.6rem;}
.mt40 {margin-top: 4rem;}
.mt60 {margin-top: 6rem;}
.mt80 {margin-top: 8rem;}
.mt100 {margin-top: 10rem;}
.mt120 {margin-top: 12rem;}
.mt140 {margin-top: 14rem;}
.mt160 {margin-top: 16rem;}
.mt180 {margin-top: 18rem;}
.mt200 {margin-top: 20rem;}

.mr4 {margin-right: 0.4rem;}
.mr8 {margin-right: 0.8rem;}
.mr12 {margin-right: 1.2rem;}
.mr16 {margin-right: 1.6rem;}
.mr20 {margin-right: 2rem;}
.mr24 {margin-right: 2.4rem;}
.mr28 {margin-right: 2.8rem;}
.mr32 {margin-right: 3.2rem;}
.mr36 {margin-right: 3.6rem;}
.mr40 {margin-right: 4rem;}
.mr60 {margin-right: 6rem;}
.mr80 {margin-right: 8rem;}
.mr100 {margin-right: 10rem;}
.mr120 {margin-right: 12rem;}
.mr140 {margin-right: 14rem;}
.mr160 {margin-right: 16rem;}
.mr180 {margin-right: 18rem;}
.mr200 {margin-right: 20rem;}

.mb4 {margin-bottom: 0.4rem;}
.mb8 {margin-bottom: 0.8rem;}
.mb12 {margin-bottom: 1.2rem;}
.mb16 {margin-bottom: 1.6rem;}
.mb20 {margin-bottom: 2rem;}
.mb24 {margin-bottom: 2.4rem;}
.mb28 {margin-bottom: 2.8rem;}
.mb32 {margin-bottom: 3.2rem;}
.mb36 {margin-bottom: 3.6rem;}
.mb40 {margin-bottom: 4rem;}
.mb60 {margin-bottom: 6rem;}
.mb80 {margin-bottom: 8rem;}
.mb100 {margin-bottom: 10rem;}
.mb120 {margin-bottom: 12rem;}
.mb140 {margin-bottom: 14rem;}
.mb160 {margin-bottom: 16rem;}
.mb180 {margin-bottom: 18rem;}
.mb200 {margin-bottom: 20rem;}

.ml4 {margin-left: 0.4rem;}
.ml8 {margin-left: 0.8rem;}
.ml12 {margin-left: 1.2rem;}
.ml16 {margin-left: 1.6rem;}
.ml20 {margin-left: 2rem;}
.ml24 {margin-left: 2.4rem;}
.ml28 {margin-left: 2.8rem;}
.ml32 {margin-left: 3.2rem;}
.ml36 {margin-left: 3.6rem;}
.ml40 {margin-left: 4rem;}
.ml60 {margin-left: 6rem;}
.ml80 {margin-left: 8rem;}
.ml100 {margin-left: 10rem;}
.ml120 {margin-left: 12rem;}
.ml140 {margin-left: 14rem;}
.ml160 {margin-left: 16rem;}
.ml180 {margin-left: 18rem;}
.ml200 {margin-left: 20rem;}

/* ------------------------------------------------------------------------------- */

html {
    font-size: 62.5%;
}

@media (max-width:1200px) {
    html {
        font-size: 56.5%;
    }
}

@media (max-width:768px) {
    html {
        font-size: 47.5%;
    }
}

/* ------------------------------------------------------------------------------- */

/* 스와이퍼 공통 */
.swiper {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}
.swiper .swiper-slide {
    text-align: center;
    background: #fff;
    position: relative;
    /* Center slide text vertically */
    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;
}
.swiper .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ------------------------------------------------------------------------------- */

/* 헤더 영역 */
.header-area {
    height: 10rem;
    z-index: 5;
    box-sizing: border-box;
    border-bottom: 1px solid transparent;
    transition: all 0.3s;
}
.header-area:hover {
    background: #fff;
    border-bottom: 1px solid #ddd;
}
.header-area.active {
    background: #fff;
    border-bottom: 1px solid #ddd;
}
.header-area:hover .select_lang a {
    color: #000;
}
.header-area.active .select_lang a {
    color: #000;
}
.header-area:hover .select_lang a img {
    filter: brightness(0);
}
.header-area.active .select_lang a img {
    filter: brightness(0);
}
.header-area .logo-box {
    width: 12.8rem;
}
.header-area .logo-box .logo-active {
    display: none;
}
.header-area.active .logo-box .logo-active {
    display: block;
}
.header-area.active .logo-box .logo-inactive {
    display: none;
}
.header-area:hover .logo-box .logo-active {
    display: block;
}
.header-area:hover .logo-box .logo-inactive {
    display: none;
}
.header-area .menu-box {
    height: 100%;
}
.header-area .menu-box > li:not(:last-child) {
    margin-right: 16rem;
}
.header-area .menu-box > li {
    position: relative;
}
.header-area .menu-box > li > a {
    font-size: 2rem;
    transition: all 0.3s;
    height: 100%;
    line-height: 10rem;
}
.header-area:hover .menu-box > li > a {
    color: #000;
}
.header-area.active .menu-box > li > a {
    color: #000;
}
.header-area .menu-box > li:hover > a {
    color: #6499c6;
}
.header-area .menu-box > li > .sub-menu-box {
    position: absolute;
    top: 100%;
    left: 0;
    box-sizing: border-box;
    padding: 2.5rem 0;
    z-index: 7;
}
.header-area .menu-box > li > .sub-menu-box > li:not(:first-child) {
    margin-top: 2.6rem;
}
.header-area .menu-box > li > .sub-menu-box > li > a {
    white-space: nowrap;
    font-size: 1.6rem;
    color: #555;
    transition: all 0.3s;
}
.header-area .menu-box > li > .sub-menu-box > li:hover > a {
    color: #6499c6;
}
.header-area .sub-menu-bg {
    width: 100%;
    height: 45rem;
    background: rgba(265,265,265,0.9);
    z-index: 6;
}

@media (max-width:1023px) {
    .header-area {
        display: none;
    }
}

/* ------------------------------------------------------------------------------- */

/* mb-헤더 영역 */
.mb-header-area {
    height: 60px;
    z-index: 5;
    box-sizing: border-box;
    border-bottom: 1px solid transparent;
    transition: all 0.3s;
    display: none;
}
.mb-header-area.active {
    background: #fff;
    border-bottom: 1px solid #ddd;
}
.mb-header-area .logo-box {
    width: 100px;
}
.mb-header-area .logo-box .logo-active {
    display: none;
}
.mb-header-area.active .logo-box .logo-active {
    display: block;
}
.mb-header-area.active .logo-box .logo-inactive {
    display: none;
}
.mb-header-area .ham-btn {
    width: 24px;
    right: 20px;
}
.mb-header-area .ham-btn .ham-active {
    display: none;
}
.mb-header-area.active .ham-btn .ham-active {
    display: block;
}
.mb-header-area.active .ham-btn .ham-inactive {
    display: none;
}
.mb-header-area .side-menu-box {
    box-sizing: border-box;
    border-left: 1px solid #ddd;
    z-index: 6;
    top: 0;
    right: -150%;
    width: 360px;
    transition: all 0.3s;
}
.mb-header-area .side-menu-box.active {
    right: 0;
}
.mb-header-area .side-menu-box .logo-box {
    width: 100px;
    margin-top: 11px;
}
.mb-header-area .side-menu-box .x-btn {
    top: 12px;
    right: 12px;
    width: 28px;
}
.mb-header-area .side-menu-box .accordion-menu-box {
    margin-top: 40px;
}
.mb-header-area .side-menu-box .accordion-menu-box .que {
    padding: 16px 20px;
    cursor: pointer;
    font-size: 16px;
    border-bottom: 1px solid #dddddd;
    position: relative;
}
.mb-header-area .side-menu-box .accordion-menu-box .que span {
    color: #000;
}
.mb-header-area .side-menu-box .accordion-menu-box .que::after {
    content: "";
    position: absolute;
    display: block;
    width: 16px;
    height: 16px;
    background: url(../img/arrow_bottom.svg) no-repeat center center/cover;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}
.mb-header-area .side-menu-box .accordion-menu-box .que.active::after {
    background: url(../img/arrow_bottom_active.svg) no-repeat center center/cover;
}
.mb-header-area .side-menu-box .accordion-menu-box .que.active > span {
    font-family: "NotoSansKR-Bold";
    color: #6499c6;
}
.mb-header-area .side-menu-box .accordion-menu-box .anw {
    display: none;
    overflow: hidden;
    box-sizing: border-box;
    border-bottom: 1px solid #dddddd;
    padding: 8px 0;
    background: #fafafa;
}
.mb-header-area .side-menu-box .accordion-menu-box .anw li a {
    font-size: 14px;
    padding: 12px 28px;
    color: #555;
}
.mb-header-area .side-menu-box .accordion-menu-box .anw li a.active {
    color: #6499c6;
}

@media (max-width:1023px) {
    .mb-header-area {
        display: block;
    }
}
@media (max-width:768px) {
    .mb-header-area .side-menu-box {
        width: 100%;
    }
}

/* ------------------------------------------------------------------------------- */

/* 푸터 영역 */
.footer-area {
    background: #244d70;
    box-sizing: border-box;
    padding: 2.4rem 0 3.6rem 0;
}
.footer-area .space-area-1 {
    align-items: flex-end;
}
.footer-area .space-area-1 .menu-box > li:not(:first-child) {
    margin-left: 1.2rem;
}
.footer-area .space-area-1 .menu-box > li a {
    font-size: 1.6rem;
    color: rgba(239,239,239,0.8);
}
.footer-area .space-area-1 .logo-box {
    width: 12.8rem;
    opacity: 0.4;
}
.footer-area .line {
    width: 100%;
    height: 1px;
    background: rgba(265,265,265,0.3);
    margin: 2rem 0 3.6rem 0;
}
.footer-area .space-area-2 .infor-box {
    font-size: 1.4rem;
    color: rgba(221,221,221,0.7);
    line-height: 1.6;
}
.footer-area .space-area-2 .top-move-btn {
    width: 4.2rem;
    margin-left: 1.2rem;
}
.footer-area .copyright {
    font-size: 1.4rem;
    color: rgba(221,221,221,0.5);
    margin-top: 4rem;
}

@media (max-width:1023px) {
    .footer-area .space-area-1 .logo-box {
        width: 100px;
    }
}

@media (max-width:768px) {
    .footer-area {
        position: relative;
    }
    .footer-area .space-area-1 .logo-box {
        display: none;
    }
    .footer-area .space-area-1 .menu-box > li a {
        font-size: 12px;
    }
    .footer-area .space-area-2 .infor-box {
        font-size: 12px;
    }
    .footer-area .space-area-2 .top-move-btn {
        width: 28px;
        margin-left: 0;
        position: absolute;
        right: 20px;
        bottom: 20px;
    }
}