@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

*{
    padding: 0;
    margin: 0;
    text-decoration: none;
    color: #303033;
    font-family: 'Noto Sans KR', sans-serif;
    list-style: none;
    border-collapse: collapse;
}
.container{min-width: 360px;}

.clear{content:''; display: block; clear: both;}



@media only screen and (max-width:1490px){
    .txt br{display: none;}
}



/* 모바일 */
/* full menu*/
.full-menu{min-height: 700px; padding: 50px 0; margin-bottom: 30px;}
.full-menu .menu-title{margin-bottom: 50px;}
.full-menu .menu-title > p{padding: 10px;}
.menu-title{text-align: center; }
.menu-title > p{font-size: 1.8rem; font-weight: 500; border-bottom: 1px solid #fff; display:inline-block; color: #fff;}
.co-inner{margin: 0 auto; width: 50%; min-width:270px; min-height: 300px; padding: 40px 30px; background: rgba(0, 0, 0, 0.8); border-radius: 30px; text-align: center; vertical-align: middle; word-wrap:break-word; text-overflow:ellipsis;}
.co-inner span{color: #fff;}
.co-inner.box01 p{font-size: 1.2rem; margin-bottom: 40px; font-weight: 500; color: #46DFDF;}
.co-inner.box01 .txt{text-align: center; margin-bottom: 50px;}
.txt{line-height: 1.8; display: inline-block;  font-size: 0.875rem;}
.co-sub-title p{font-size: 1.125rem; color: #46DFDF; font-weight: 500;}
.co-sub-title{text-align: left;}
.co-sub-title p{margin-bottom: 13px;}
.co-sub-title:first-child{margin-bottom:50px;}

/* top menu */
.top-menu{padding: 40px 0 45px; margin-bottom: 20px;}
.top-menu .menu-title{padding-top:0;}
.navBar{text-align: right; padding: 0 16px; margin-bottom: 60px;}
.navBar div img{padding: 0 2px;}
.navBar div a > img{padding:0; width: 15px;}
.navBar div a{vertical-align: middle;}
.navBar div span{font-size:0.875rem; font-weight: 300;}
.navBar div span:nth-child(5){color: #1B7889; font-weight: 500;}


/* middle menu */
.middle-menu{height: 120px; margin-bottom: 70px; position:relative;}


/* MOBILE 서브메뉴 */
.pc-center{display:none;}
.menu-title{padding-top: 40px;}
.mobile-center{position: absolute; top: 100%; width: 100%;}
.mobile-sub > li{float: left; line-height: 50px; border-bottom: 1px solid #CFD3D4;}
.mobile-sub > li:first-of-type{width: 15%; text-align: center; border-right: 1px solid #CFD3D4; box-sizing: border-box;}
.mobile-sub > li:last-of-type{width: 85%; box-sizing: border-box;}
.mobile-sub > li a span{display: block; background: url(../images/menu-arrow-down.svg) no-repeat 95% center; background-size: 10px; padding-left: 20px;}
.mobile-sub > li a span:active .sub-inner{display:block;}
.sub-inner{background-color: #edeff3; padding: 20px 0 20px 20px; width: 100%; display: none; border: 1px solid #CFD3D4;}
.sub-inner li{line-height: 27px; font-size: 0.875rem;}
.sub-ctg{position: relative;}
.sub-inner{position: absolute;}



/* 태블릿 */
@media screen and (min-width:768px){
    /* full menu*/
    .full-menu{min-height: 700px; padding: 80px 0 100px;}
    .full-menu .menu-title{margin-bottom: 70px;}
    .menu-title > p{font-size: 2.1875rem; }
    .co-inner{padding: 7.5% 4.375%; border-radius: 50px;}
    .co-inner.box01 p{font-size: 1.5625rem;}
    .txt{font-size: 16px;}

    /* top menu */
    .top-menu{padding: 70px 0 80px;}
    .navBar div img{padding: 0 2px;}
    .navBar div a > img{padding:0; width: auto;}
    .navBar div a{vertical-align: middle;}
    .navBar div span{font-size:1rem; font-weight: 300;}

    /* middle menu */
    .middle-menu{padding: 100px 0 110px;}
}



/* 태블릿 */
@media screen and (min-width:1024px){
    /* full menu*/
    .full-menu{margin-bottom: 150px;}
    .menu-title > p{font-size: 2.5rem;}
    .co-inner{width: 50%; padding: 7.5% 4.375%; border-radius: 50px;}
    .co-inner.box01 p{font-size: 1.875rem;}
    .navBar{padding:0 20px;}
    .navBar div{margin: 0 auto; max-width: 1300px;}

    /* 태블릿 서브메뉴 */
    .mobile-sub > li:first-of-type{width: 10%;}
    .mobile-sub > li:last-of-type{width: 90%; box-sizing: border-box;}
    .mobile-sub > li a span{display: block; background: url(../images/menu-arrow-down.svg) no-repeat 98% center; background-size: 10px; padding-left: 20px;}
 }


 @media screen and (min-width:1300px){
    /* middle menu */
    .middle-menu{height: 180px; margin-bottom: 20px;}
    .middle-menu .menu-title > p{border-bottom: none;}

    /* PC 서브메뉴 */
    .mobile-center{display: none;}
    .pc-center{display: block; background-color: rgba(0, 0, 0, 0.5); position: relative; bottom: -60%;}
    .pc-center div{max-width: 1300px; margin: 0 auto;}
    .pc-center li{display: inline-block; height: 85px; line-height: 85px; padding-right: 70px;}
    .pc-center li a{color: rgb(198, 202, 204); font-size: 1.125rem; font-weight: 300;}
    .pc-center li:hover a{color: #fff; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; -ms-transition: all .3s; transition: all .3s;}
    .pc-center li:last-of-type{padding-right: 0;}
    .pc-sub li a{position: relative; display: inline-block; height: 85px;}
    .pc-sub li a:after{content: ""; display: block; width: 0; left: 50%; top: 0; transform: translateX(-50%); position: absolute; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; -ms-transition: all .3s; transition: all .3s;}
    .pc-sub li:hover a:after{content: ""; display: block; width: 110%; height:2px; left: 50%; top: 0; transform: translateX(-50%); position: absolute; background-color: #fff; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; -ms-transition: all .3s; transition: all .3s;}
 }





