@charset "utf-8";

@import url("common.css");
@import url("contents.css?v=20241128");
@import url("border.css");



/* Layout */
#wrap { position:relative; width:100%;}

#contents {height:auto; width:100%;}

#footer {width:100%; margin:0 auto; height:260px;}



/* layer_popup */
.layer_popup{position:absolute; top:0; left:0;width:auto; height:auto; z-index:10000000000;border:#444444 solid 1px;background:#fff;}
.layer_popup .layer_popup_closed{position:absolute; bottom:0; left:0;width:100%;overflow:hidden;padding:0 0;height:30px;line-height:30px;background:rgba(0,0,0,0.8);}
.layer_popup .layer_popup_closed .fl{float:left;color:#fff;padding-left:10px; font-size:14px;}
.layer_popup .layer_popup_closed .fr{float:right;width:20%;text-align:right;color:#fff;padding-right:10px;}
.layer_popup .layer_popup_closed .fr a{color:#fff; font-size:14px;}
.layer_popup select, .layer_popup input, .layer_popup img { vertical-align:middle;}
.layer_popup .layer_popup_closed input[type="checkbox"] { display: inline-block; width:13px; height: 13px; background: #fff;
cursor: pointer; border-radius: 3px;}
.layer_popup .layer_popup_closed input[type="checkbox"]:checked { display: inline-block; width:13px; height: 13px; background: #fa3062;
cursor: pointer; border-radius: 3px;}
.layer_popup .layer_popup_in img{width:100%;}

/* skipNavi */
#skipNavi dt {position:absolute; top:0; left:-1000px;}
#skipNavi dd a {display:block; font-family:'Malgun Gothic'; font-weight:bold; position:absolute; top:0; left:-1000px; font-size:1em; text-align:center; background-color:#000; z-index:1000;} 
#skipNavi dd a:hover, 
#skipNavi dd a:active, 
#skipNavi dd a:focus{left:0; height:40px; width:100%; line-height:40px; color:#fff !important;}

/* 공통 */

.blind {display: none;}
.hidden, .hidden *{display:block !important; position:fixed !important; top:-500000px !important; margin:0px !important; padding:0px !important; width:0px !important; height:0px !important; text-indent:-50000px !important; font-size:0px !important; line-height:0px !important; border:0px !important;}
button, [type="button"], [type="reset"], [type="submit"] {cursor:pointer;}



/* header */


.headerArea {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    background-color: #fff;
    z-index: 999;
    transition: all 0.2s;
}
.headerArea.up {
    top: -80px;
}
.headerArea.transparent {
    background-color: transparent;
}
.headerArea .logo {
    margin-right: auto;
}
.headerArea .logo a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}
.headerArea .logo a img:first-child {
    display: block;
}
.headerArea .logo a img:last-child {
    display: none;
}
.headerArea.transparent a img:first-child {
    display: none;
}
.headerArea.transparent .logo a img:last-child {
    display: block;
}
.headerArea .container {
    display: flex;
    justify-content: space-between;
    max-width: calc(124rem + 60px);
    padding: 0 30px;
    height: 110px;
    margin: 0 auto;
}
.headerArea .nav {
    display: flex;
    /* background: #fff; */
}
.headerArea.transparent .nav {
    background: transparent;
}
.headerArea .menu .navbar {
    display: flex;
}
.headerArea .menu .navbar > li {
    /* 2뎁스정렬*/
    display: flex;
    justify-content: center;
}
.headerArea .menu .navbar > li > a {
    position: relative;
    display: block;
    /* height: 100%; */
    padding: 0 35px;
    line-height: 7rem;
    letter-spacing: -0.03em;
    /* font-size: 1.7rem; */
    font-weight: 600;
}
.headerArea .menu .navbar > li > a,
.headerArea .family_site li a {
    /* color: #222; */
    transition: color 0.3s;
}
.headerArea .menu .navbar > li > a::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 0;
    height: 0.2rem;
    transform: translateX(-50%);
    transition: all 0.3s;
}
.headerArea.transparent .menu .navbar > li > a {
    color: #fff;
}

.headerArea .menu .navbar > li:nth-child(3) .sub-menu li:not(:first-child) a::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1.9rem;
    height: 1.9rem;
    background-image: url("../images/common/ico_arrow_site_gray.svg");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 100% 100%;
    transition: all 0.3s;
}

.headerArea .family_site {
    display: flex;
    margin-left: auto;
}
.headerArea .family_site.mo {
    display: none;
}
.headerArea .family_site li:first-child {
    margin-right: 3rem;
}
.headerArea .family_site li a {
    position: relative;
    display: block;
    /* height: 100%; */
    /* color: #222; */
    line-height: 7.2rem;
    letter-spacing: -0.03em;
    /* font-size: 1.7rem; */
    font-weight: 600;
    transition: color 0.3s;
}
.headerArea.transparent .family_site li a {
    color: #fff;
        font-size: 17px;
    font-weight: 400;
}

.headerArea .util_list {
    display: flex;
    margin-left: 5.25rem;
}
.headerArea .util_list li {
    position: relative;
    /* height: 100%; */
}
.headerArea .util_list li:last-child {
    margin-left: 1rem;
}
.headerArea .util_list li > a {
    position: relative;
    display: block;
    width: 32px;
    height: 100%;
    text-indent: -9999em;
    transition: color 0.3s;
    top:2px;
}
.headerArea .util_list li > a::after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    display: block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 100% 100%;
    transform: translateY(-50%);
    transition: background 0.3s;
}

.headerArea .util_list li.language .box {
    position: absolute;
    left: 50%;
    top: 6.6rem;
    transform: translateX(-50%);
    z-index: 100;
    width: 132px;
}
.headerArea .util_list li.language .box div {
    position: relative;
    height: 0;
    padding: 1rem 1.7rem 1rem 1.6rem;
    border-radius: 1rem;
    background: var(--point-color);
    opacity: 0;
    transition: all 0.3s;
}
.headerArea .util_list li.language .box div::before {
    content: "";
    position: absolute;
    left: 50%;
    top: -5px;
    width: 0.8rem;
    height: 0.6rem;
    background: url("../img/main/bg_tootiip.png") no-repeat left top;
    transform: translateX(-50%);
}
.headerArea .util_list li.language .box a {
    display: inline-block;
    color: #fff;
    line-height: 2.25rem;
    font-size: 14px;
    font-weight: 500;
    font-family: var(--font-poppins);
}
.headerArea .util_list li.language .box a:last-child {
    margin-top: 2px;
}
.headerArea .util_list li.hamburger a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}
.headerArea .util_list li.hamburger a span {
    display: block;
    width: 30px;
    height: 3px;
    margin-top: 8px;
    background: #222;
    transition: all 0.3s;
}
.headerArea.transparent .util_list li.hamburger a span {
    background: #fff;
}
.headerArea .util_list li.hamburger a span:nth-child(1) {
    margin-top: 0;
}

.headerArea .util_list li.language > a::after {
    background-image: url("../img/main/header_ico_lan_bk.png");
}
.headerArea.transparent .util_list li.language > a::after {
    background-image: url("../img/main/header_ico_lan.png");
}
.headerArea .util_list li.language.on > a::after {
    background-image: url("../img/main/header_ico_lan_b.png");
}
.headerArea .util_list li.hamburger.on > a span {
    background: var(--point-color);
}

/* header 서브메뉴 */
.headerArea .sub-menu {
    position: absolute;
    top: 100px;
    margin-top: 4.4rem;
    transition: all 0.3s;
}
.headerArea .sub-menu li {
    margin-top: 1rem;
    text-align: center;
}
.headerArea .sub-menu li:first-child {
    margin-top: 0;
}
.headerArea .sub-menu li a {
    display: none;
    text-align: center;
    color: #666;
    font-size: 16px;
    font-weight: normal;
    transition: color 0.3s;
}
.headerArea .sub-menu li a:hover {
    font-weight: bold;
    color:#073190;
}
.headerArea.active .sub-menu li a {
    display: inline-block;
}

/* header 활성화 */
.headerArea:before {
    content: "";
    position: absolute;
    left: 0;
    top: 110px;
    width: 100%;
    height: 0;
    background: #fff;
    opacity: 0;
    transition: all 0.2s linear;
}
.headerArea.active:before {
    /* 배경 */
    height: 20rem;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    opacity: 1;
}

/* only pc */
@media (min-width: 1181px) {
    .headerArea .sub-menu {
        opacity: 0;
    }
    .headerArea.active .sub-menu {
        opacity: 1;
    }
    /* header hover*/
    .headerArea .menu .navbar > li:hover > a::after {
        width: calc(100% - 5.6rem);
        background-color: var(--point-color);
    }
    .headerArea .menu .navbar > li:hover > a,
    .headerArea .menu .navbar > li.on > a,
    .headerArea a:hover:not(.language a) {
        color: var(--point-color) !important;
    }
    .headerArea .menu .navbar > li:nth-child(3) .sub-menu li:not(:first-child):hover a::after {
        background-size: 1.9rem 1.9rem;
        background-image: url("../images/common/ico_arrow_site_green.svg");
    }
    .headerArea .family_site li a:hover::after {
        background-image: url("../images/common/ico_arrow_site_green.svg");
    }
    .headerArea.transparent.main .util_list li.language:hover > a::after {
        background-image: url("../img/main/header_ico_lan_b.png");
    }
    .headerArea.main .util_list li.language:hover > a::after {
        background-image: url("../img/main/header_ico_lan_bk.png");
    }
    .headerArea .util_list li.hamburger:hover > a span {
        background: var(--point-color);
    }
    .headerArea .util_list li.language:hover .box div, .headerArea .util_list li.language.on .box div {
        height: 100%;
        opacity: 1;
    }
}

.sr-only {position: absolute;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(0px 0px 99.9% 99.9%);clip-path: inset(0px 0px 99.9% 99.9%);overflow: hidden;height: 1px;width: 1px;padding: 0;border: 0;}

/* 상단으로 이동*/
.btn_top {
    position: absolute;
    right: 30px;
    margin-top: -9rem;
    z-index: 99;
}
.btn_top.fixed {
    position: fixed;
    bottom: 30px;
    margin-top: 0;
}
.btn_top a {
    position: relative;
    display: block;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: rgba(34, 34, 34, 0.6);
    text-indent: -9999em;
}
.btn_top a::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 2.4rem;
    height: 2.4rem;
    margin: 0 auto;
    background: url("../images/common/ico_arrow_top.svg") no-repeat center center / 100% 100%;
    transform: translate(-50%, -50%);
}





/* tablet */
@media (max-width: 1180px) {
    :root {
        font-size: 56.25%; /* 9px */
    }
    a[class^="btn_"] {
        padding: 1.56rem 2.96rem;
    }
    a[class^="btn_"] span {
        letter-spacing: -0.03em;
        line-height: 2.28rem;
        font-size: 1.91rem;
    }
    .btn_top {
        right: 40px;
    }
    .btn_top.fixed {
        bottom: 40px;
    }
    .btn_top a {
        width: 76px;
        height: 76px;
    }
    .btn_top a::after {
        width: 30px;
        height: 30px;
    }

    /* header */
    .headerArea .logo a img {
        width: auto;
        height: 4rem;
    }
    .headerArea .container {
        max-width: 100%;
        height: 100px;
    }
    .headerArea.up {
        top: -100px;
    }

    /* header tablet, mobile 공통 */
    .headerArea.active::before {
        height: 1px;
        top: auto;
        bottom: 0;
        border: none;
        background: #ddd;
    }
    .headerArea .nav {
        overflow-y: auto;
        position: fixed;
        right: -100%;
        top: 100px;
        display: block;
        width: 100%;
        height: calc(100vh - 100px);
        height: calc(100dvh - 100px);
        margin: 0;
        z-index: 100;
        transition: all 0.3s;
        background: #fff;
    }
    .headerArea.active .nav {
        right: 0;
    }
    .headerArea .menu {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 100%;
        padding-top: 90px;
    }

    .headerArea .menu .navbar {
        display: block;
    }
    .headerArea .menu .navbar > li {
        display: block;
        margin-top: 3.13rem;
    }
    .headerArea .menu .navbar > li:first-child {
        margin-top: 0;
    }

    .headerArea .menu .navbar > li > a {
        position: relative;
        padding: 0 50px 0 100px;
        line-height: 5.2rem;
        font-size: 4.3rem;
        font-weight: 700;
    }
    .headerArea .menu .navbar > li > a::after {
        position: absolute;
        left: auto;
        right: 50px;
        top: 50%;
        width: 3.8rem;
        height: 3.8rem;
        background: url("../img/main/ico_nav_open.png") no-repeat left center / 100% 100%;
        transform: translateY(-50%);
    }
    .headerArea .menu .navbar > li.on > a {
        color: var(--point-color);
    }
    .headerArea .menu .navbar > li.on > a::after {
        width: 3.8rem;
        background-color: transparent;
        background-image: url("../img/main/ico_nav_close.png");
    }
    .headerArea .family_site.pc {
        display: none;
    }
    .headerArea .menu .family_site.mo {
        display: block;
        position: relative;
        margin: 20rem 0 0 0;
    }
    .headerArea .menu .family_site.mo::after {
        content: "";
        position: absolute;
        right: 50px;
        bottom: 0;
        width: 31.4rem;
        height: 26rem;
        background: url("../images/common/bg_nav.svg") no-repeat left center / 100% 100%;
    }
    .headerArea .menu .family_site.mo li {
        margin-bottom: 2.4rem;
    }
    .headerArea .menu .family_site.mo li:last-child {
        margin-bottom: 7rem;
    }
    .headerArea .menu .family_site.mo li a {
        display: inline-block;
        margin-left: 100px;
        padding-right: 3.48rem;
        line-height: 3.5rem;
        font-size: 3rem;
        font-weight: 700;
    }
    .headerArea .menu .family_site.mo li a::after {
        width: 3.3rem;
        height: 3.3rem;
    }
    .headerArea .util_list li:last-child {
        margin-left: 1.7rem;
    }
    .headerArea .util_list li > a {
        width: 4rem; top:0;
    }
    .headerArea .util_list li > a::after {
        height: 4rem;
    }
    .headerArea .util_list li.language > a::after {
        width: 24px;
        height: 24px;
        transition: none;
    }
    .headerArea .util_list li.language .box {
        top: 8.5rem;
    }
    .headerArea .util_list li.language.on .box div {
        height: 100%;
        padding: 1.25rem 2rem;
        opacity: 1;
    }
    .headerArea .util_list li.language .box a:last-child {
        margin-top: 4px;
    }
    .headerArea .util_list li.hamburger a span {
        width: 2.8rem;
        height: 3px;
        margin-top: 0.7rem;
        transition: all 0.3s;
    }
    .headerArea .util_list li.hamburger.on > a span {
        width: 3.1rem;
        background: #222;
    }
    .headerArea .util_list li.hamburger.on > a span:nth-child(1) {
        transform: translateY(8px) rotate(135deg);
    }
    .headerArea .util_list li.hamburger.on > a span:nth-child(2) {
        transform: scale(0);
    }
    .headerArea .util_list li.hamburger.on > a span:nth-child(3) {
        transform: translateY(-11px) rotate(-135deg);
    }

    .headerArea .sub-menu {
        position: static;
        margin-top: 3.13rem;
        padding: 3.48rem 100px;
        display: none;
        background: #f5f5f5;
    }
    .headerArea .sub-menu li {
        margin-top: 1rem;
        padding: 0 2.3rem;
        text-align: left;
    }
    .headerArea .sub-menu li a {
        display: block;
        text-align: left;
        line-height: 3.5rem;
        font-size: 2rem;
    }
    .headerArea .menu li.on .sub-menu {
        display: block;
    }
    .headerArea .menu .navbar > li:nth-child(3) .sub-menu li:not(:first-child) a::after {
        display: none;
    }
    .headerArea .menu .navbar > li:nth-child(3) .sub-menu li:not(:first-child) a span {
        position: relative;
        display: inline-block;
        padding-right: 2.1rem;
    }
    .headerArea .menu .navbar > li:nth-child(3) .sub-menu li:not(:first-child) a span::after {
        content: "";
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 1.9rem;
        height: 1.9rem;
        background-image: url("../images/common/ico_arrow_site_gray.svg");
        background-repeat: no-repeat;
        background-position: left center;
        background-size: 100% 100%;
        transition: all 0.3s;
    }

}



/* mobile */
@media (max-width: 767px) {
    :root {
        font-size: 56%; /* 8px */
    }
    a[class^="btn_"],
    button[class^="btn_"] {
        padding: 0;
    }
    a[class^="btn_"] span,
    button[class^="btn_"] span {
        padding-right: 2.4rem;
        line-height: 2rem;
        font-size: 1.6rem;
    }
    a[class^="btn_"] span::after,
    button[class^="btn_"] span::after {
        width: 1.9rem;
        height: 1.9rem;
    }
    .btn_top {
        right: 15px;
    }
    .btn_top.fixed {
        bottom: 16.5px;
    }
    .btn_top a {
        width: 45px;
        height: 45px;
    }
    .btn_top a::after {
        width: 18px;
        height: 18px;
    }

    /* header */
    .headerArea.up {
        top: -55px;
    }
    .headerArea .container {
        padding: 0 20px;
        height: 55px;
    }
    .headerArea .logo a img {
        width: auto;
        height: 3rem;
    }
    .headerArea .nav {
        top: 55px;
        height: calc(100vh - 55px);
        height: calc(100dvh - 55px);
    }
    .headerArea .nav::after {
        right: 20px;
        width: 13.5rem;
        height: 11.25rem;
    }
    .headerArea .menu {
        height: 100%;
        padding-top: 40px;
    }
    .headerArea .menu .navbar > li {
        margin-top: 2.5rem;
    }
    .headerArea .menu .navbar > li > a {
        padding: 0 20px 0 45px;
        line-height: 3.75rem;
        font-size: 18px;
    }
    .headerArea .menu .navbar > li > a::after {
        right: 20px;
        width: 2.75rem;
        height: 2.75rem;
    }
    .headerArea .menu .navbar > li.on > a::after {
        width: 2.75rem;
    }
    .headerArea .menu .family_site.mo {
        margin-top: 0rem;
    }
    .headerArea .menu .family_site.mo::after {
        width: 13.5rem;
        height: 11.25rem;
    }
    .headerArea .menu .family_site.mo li {
        margin-top: 0.87rem;
    }
    .headerArea .menu .family_site.mo li:first-child {
        margin-bottom: 1.5rem;
    }
    .headerArea .menu .family_site.mo li:last-child {
        margin-bottom: 3.5rem;
    }
    .headerArea .menu .family_site.mo li a {
        margin-left: 45px;
        padding-right: 2.6rem;
        line-height: 3.75rem;
        font-size: 2.1rem;
    }
    .headerArea .menu .family_site.mo li a::after {
        width: 19px;
        height: 19px;
    }

    .headerArea .util_list li > a {
        width: 20px;
    }
    .headerArea .util_list li:last-child {
        margin-left: 1.2rem;
    }
    .headerArea .util_list li.language > a::after {
        width: 20px; height:20px;
    }
    .headerArea .util_list li.language .box {
        top: 5.3rem;
        width: 115px;
    }
    .headerArea .util_list li.hamburger a span {
        width: 2.1rem;
        height: 2px;
        margin-top: 0.57rem;
    }
    .headerArea .util_list li.hamburger.on > a span {
        width: 2.3rem;
    }
    .headerArea .util_list li.hamburger.on > a span:nth-child(1) {
        transform: translateY(7px) rotate(135deg);
    }
    .headerArea .util_list li.hamburger.on > a span:nth-child(2) {
        transform: scale(0);
    }
    .headerArea .util_list li.hamburger.on > a span:nth-child(3) {
        transform: translateY(-7px) rotate(-135deg);
    }

    .headerArea .sub-menu {
        margin-top: 2rem;
        padding: 2.5rem 20px 2.5rem 45px;
    }
    .headerArea .sub-menu li {
        margin-top: 1.63rem;
        padding: 0 3rem;
    }
    .headerArea .sub-menu li a {
        line-height: 20px;
        font-size: 17px;
    }

}
.main:not(.headerArea.main) {
  overflow-x: hidden;
}
.main section {
  width: 100%;
  max-width: 1300px;
  margin-left: auto;
  margin-right: auto;
}
.main .visual {
  overflow: hidden;
  position: relative;
  display: block;
  height: 1080px;
  padding-top: 110px;
}
.main .visual:after {
  content:'';
  display: block;
  position: absolute;
  left:0;
  bottom:0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg,rgba(0, 0, 0, 0) 0%, rgba(21, 21, 24, 1) 100%);
}
.sub_visual {height: 420px !important;}
.main .visual img.visual-img {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}
.main .visual img.visual-sub-img {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 420px;
  object-fit: cover;
  z-index: -1;
}
.main .visual .inner {
  height: 100%;
  max-width: 1300px;
  padding-top: 150px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.main .visual .global .inner {
  padding-top: 260px;
}
.main .visual .title {
  position: relative;
  z-index: 10;
}
.main .visual .title h2 {
  color: #fff;
  line-height: 60px;
  font-size: 54px;
}
.main .visual .title h2 .motion {
  overflow: hidden;
}
.main .visual .title h2 .motion .v_txt {
  font-size: 41px;
  font-weight: 300;
  margin-top: 20px;
  display: flex;
  align-items: center;
  line-height: 1.3;
}
.main .visual .title h2 .motion .v_txt strong{
  font-weight:500;
  font-size: 50px;
}
.main .visual .title h2 .motion:first-child div {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 64px;
}
.main .sub_visual .title h2 .motion:first-child div {
  text-align: center; font-size:40px; font-weight: bold;
}
.main .visual .title p {
  margin-top: 2rem;
  color: #fff;
  line-height: 30px;
  font-size: 20px;
  font-weight: 400;
  font-family: var(--font-poppins);
}
.main .visual .title h2 .motion .main_txt {font-size:24px;}

/* only pc */
@media (min-width: 1181px) {
  .main .visual img {
    animation: visualScale 8s linear alternate both;
  }
  .main .visual .title h2 .motion div {
    animation: fadeInUp 1s both;
  }
  .main .visual .title h2 .motion:last-child div {
    animation-delay: 0.5s;
  }
  .main .visual .title p {
    animation: fadeInUp 1s 1s both;
  }
}
@media (max-width: 1180px) {
  .main .visual img {
    max-width: 100%;
    object-fit: cover;
    animation: none;
  }
  .main .visual .title {
    margin-top: 0;
  }
  .main .visual .title h2 .motion div {
    animation: none;
  }
  .main .visual .title p {
    animation: none;
  }
}

/* 뉴스*/
.main .news {
  background: #f8f8f8;
}
.main .news .inner {
  position: relative;
  display: flex;
  width:1300px;
  padding:130px 0 210px;	
}
.main .news .title {
  width: 42%;
  text-align: left;
}
.main .news .title .btn_view {
  padding-top:40px; display:inline-block;
}
.main .news .swiper-slide .report {
  position: relative;
  display: block;
  width: 100%;
  height: 200px;
  background: #fff;
}
.main .news .swiper-slide .report:focus-visible{
    outline-offset: 3px;
}

.main .news .swiper-slide .report .uq_txt {position: absolute; bottom:10%; left:10%; z-index: 99; color:#fff; display: inline-block; font-size:20px; font-weight: bold;}



.main .news .swiper-slide .report p img {width:100%; max-width:100%;}

.main .news .inner .swiper-arrow .swiper-button-prev:focus-visible,
.main .news .inner .swiper-arrow .swiper-button-next:focus-visible{
    outline-offset: 5px;
    transition: all 0s;
}

/* 슬라이드 swiper common*/
.main .swiper_wrap {
    position: relative;
    width: calc(100% - 42%);
	overflow:hidden;
}
.main .swiper_wrap .swiper-container {
    overflow: unset;
    clip-path: inset(0 -100vw 0 0);
}
.main .swiper_wrap .swiper-slide {
    width: 340px;
    
}
.main .swiper_wrap .swiper-pagination {
    overflow: hidden;
    width: 100%;
    height: 0.3rem;
    bottom: -5.3rem;
    border-radius: 0.3rem;
    background: #ddd;
}
.main .swiper_wrap .swiper-pagination .swiper-pagination-progressbar-fill {
    border-radius: 0.3rem;
    background: #222;
}

.main .swiper-arrow {
    position: absolute;
    left: 0;
    bottom: 20%;
}
/* 메인, 회사소개 같이씀 */
.swiper-arrow {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 13%;
}

div[class^="swiper-button"] {
    position: static;
    width: 70px;
    height: 70px;
    border: 1px solid rgba(34, 34, 34, 0.4);
    background-color: #353535;
    border-radius: 50%;
    transition: all 0.3s;
}
div[class^="swiper-button"]::after {
    width: 1rem;
    height: 1.6rem;
    background: url("../img/main/ico_slide_arrow_hover.png") no-repeat left center / 100% 100%;
}
.swiper-button-next::after {
    transform: rotate(180deg);
}
/* only pc */
@media (min-width: 1181px) {
    div[class^="swiper-button"].swiper-button-disabled {
        background-color: #fff;
    }
    div[class^="swiper-button"].swiper-button-disabled::after {
        background-image: url("../img/main/ico_slide_arrow.png");
    }
}
@media (max-width: 767px) {
    div[class^="swiper-button"] {
        width: 5rem;
        height: 5rem;
    }
    .swiper-arrow {
        width: 11.25rem;
    }
    .main .news .title h3 {
        line-height: 4rem;
        font-size: 3rem;
    }
}


/* media*/
@media (max-width: 1180px) {
    .main .visual .title h2 {
        line-height: 6.6rem;
        font-size: 5.2rem;
    }
    .main .visual .title p {
        margin-top: 2.26rem;
    }
    .main .reits .reits_list li {
        height: 36.6rem;
    }
    .main .reits .reits_list li .stock::after {
        height: 9rem;
    }
    .main .reits .reits_list li:nth-child(1) .stock::after {
        width: 17.6rem;
    }
    .main .reits .reits_list li:nth-child(2) .stock::after {
        width: 18.5rem;
    }
    .main .reits .reits_list li .stock {
        height: 9.57rem;
        padding-top: 3.13rem;
    }
    .main .swiper_wrap .swiper-slide {
        width: 33rem;
    }
   
    .main .recommend .title h3 {
        margin-right: 4.4rem;
    }
    .main .recommend .title h3 br {
        display: none;
    }
    .main .manage .title {
        width: 30%;
        margin-right: 5%;
    }
    .main .manage .title::after {
        width: 23.5rem;
        height: 17.3rem;
    }
    .main .manage .title p {
        line-height: 3.1rem;
    }
    .main .manage .info_list {
        width: 65%;
        padding: 0;
    }
    .main .manage .info_list li .ico {
        /* width: 15.2rem; */
        width: 28%;
    }
    .main .manage .info_list li .num {
        line-height: 7.8rem;
        font-size: 6rem;
    }
    .main .manage .info_list li .desc {
        line-height: 3.5rem;
        font-size: 2.6rem;
    }

    .main .introduce .inner {
        display: block;
    }
    .main .introduce .title {
        position: static;
        width: 100%;
    }
    .main .introduce .family_list {
        grid-template-columns: repeat(4, 1fr);
        /* grid-template-rows: repeat(4, 15.8rem); */
    }
    .main .introduce .family_list li a {
        padding: 2.2rem;
    }
    .main .introduce .family_list li a::after {
        width: 7rem;
        height: 7rem;
    }
    .main .introduce .family_list li br {
        display: block;
    }

    /* 추가 수정 */
    .main .news .swiper-arrow,
    .main .recommend .swiper-arrow {
        bottom: 15rem;
    }
}

@media (max-width: 767px) {
    .main .visual {
        overflow: hidden;
        height: 744px;
        padding-top: 0;
    }
    .main .visual.global {
        height: 455px;
    }
    .main .visual img {
        height: 100%;
    }
    .main .inner {
        padding-top: 60px !important;
        padding-bottom: 60px !important;
    }
    .main .visual .title h2 {
        line-height: 5rem;
        font-size: 3.5rem;
    }
    .main .visual .title p {
        margin-top: 1.5rem;
        line-height: 3.12rem;
        font-size: 2rem;
    }
    .main :is(.news .inner, .recommend .inner) {
        padding-right: 0 !important;
    }
    .main .reits .reits_list {
        display: block;
    }
    .main .reits .reits_list li {
        width: 100%;
        height: 30rem;
        padding: 3rem;
    }
    .main .reits .reits_list li:last-child {
        margin-top: 3.3rem;
    }
    .main .reits .reits_list li .title {
        margin-bottom: 2.25rem;
    }
    .main .reits .reits_list li .title p {
        margin-top: 1.3rem;
    }
    .main .reits .reits_list li .stock {
        left: 3rem;
        bottom: 3rem;
        width: calc(100% - 6rem);
        height: 6.5rem;
        padding: 0;
    }
    .main .reits .reits_list li .stock::after {
        height: 8.2rem;
    }
    .main .reits .reits_list li:nth-child(1) .stock::after {
        width: 16rem;
    }
    .main .reits .reits_list li:nth-child(2) .stock::after {
        width: 16.8rem;
    }
    .main .news .inner {
        display: block;
    }
    .main .swiper_wrap {
        width: 100%;
        margin-top: 20px;
    }
    .main .swiper_wrap .swiper-container {
        overflow: hidden;
        clip-path: none;
    }
    .main .swiper_wrap .swiper-slide {
        width: 32.5rem;
    }
    .main .swiper_wrap .swiper-pagination,
    .main .swiper-arrow {
        display: none;
    }
    .main .manage .inner {
        display: block;
    }
    .main .manage .title {
        width: 100%;
    }
    .main .manage .info_list {
        width: 100%;
        margin-top: 6.8rem;
        padding: 0;
    }
    .main .manage .title::after {
        display: none;
    }
    .main .manage .info_list li {
        margin-top: 3.7rem;
    }
    .main .manage .info_list li .ico {
        /* width: 12.5rem; */
        width: 10rem;
    }
    .main .manage .info_list li .num {
        font-size: 5.8rem;
    }
    .main .manage .info_list li .desc {
        font-size: 2.8rem;
    }
    .main .introduce .title {
        position: static;
        width: 100%;
    }
    .main .introduce .title h3 {
        line-height: 4rem;
        font-size: 3rem;
    }
    .main .introduce .title p br {
        display: none;
    }
    .main .introduce .family_list {
        overflow: hidden;
        margin-top: 6.8rem;
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: minmax(14rem, auto);
        grid-gap: 1.2rem;
        grid-template-areas:
            "list01 list02"
            "list03 list04"
            "list05 list06"
            "list07 list08"
            "list09 .";
    }

    .main .introduce .family_list li a {
        padding: 2rem;
    }
    .main .introduce .family_list li a::after {
        right: 2rem;
        bottom: 2rem;
        width: 6rem;
        height: 6rem;
    }
}



.con01 {width:100%; padding:40px 0; background:url('../img/main/con_bg.jpg') right 0 repeat-x; display: block;position: relative;
    z-index: 1;}
.con01 .con01_inner {width:1300px; margin:0 auto;}
.con02 {width:100%; padding:40px 0; background:url('../img/main/con2_bg.jpg') right 0 repeat-x; display: block;position: relative;
    z-index: 1;}
.con02 .con02_inner {margin:0 auto;width: 100% !important;max-width: 1300px;}

.serch {width:100%; padding:0;    max-width: 734px;}
.serch .search_wrap {    border: 1px solid #fff;
    height: 60px;
    background: rgba(0, 0, 0, 0.7);}
.serch input {border: 0;
    height: 58px;
    width: calc(100% - 55px);
    padding: 0 0 0 24px;
    background: transparent;
    color: #fff;
    font-weight: 500;}
.serch .search_btn {float:left; padding:14px;}
.serch .search_btn button {background: url('../img/main/main_serch_btn.jpg') no-repeat center center; width:28px; height: 28px; font-size:0;}
.serch dl {width:100%; clear: both; margin:30px 0 0 0;}
.serch dl dt {    font-size: 20px;
    font-weight: 300;
    color: #fff;
    float: left;
    padding: 8px 0;}
.serch dl dd {    display: flex;
    margin-left: 20px;
    font-size: 20px;
    font-weight:300;
    background: rgba(255, 255, 255, 0.2);
    padding: 3px 14px;
    color: #fff;
    align-items: center;
    justify-content: center;
    text-decoration: underline;}

.quick {
  width: 100%;
  padding: 0;
  margin: 100px 0 0 0;
}
.quick ul {
  width:100%;
  display: flex;
  gap: 20px;
}
.quick ul li {
}
.quick ul li a{
  width: 200px;
  height: 200px;
  background:rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.quick ul li .q_txt {font-size:16px; line-height: 18px; padding:10px 0;}

.con01_btn {margin:50px 0 20px; display: inline-block;}
.con01_btnx{
  margin:82px 0 0 0;
  padding: 0 0 50px 0;
}
.con01_btnx a{
  display: flex;
  background: linear-gradient(95deg,rgba(0, 61, 96, 1) 52%, rgba(72, 41, 112, 1) 100%);
  border-radius: 4px;
  height: 119px;
  color:#fff;
  font-size: 28px;
  align-items: center;
  padding:0 50px;
  gap: 30px;
}
.con01_btnx a img{
    width: auto!important;
}
.con01_btnx.letter a{
  background: linear-gradient(95deg,rgba(40, 92, 171, 1), rgba(81, 139, 214, 1));
}
.con01_btnx a span{
  margin-left: auto;
  color: #fff;
  background: #16195F url(../img/main/direct-arrow.png) right 24px center no-repeat;
  border-radius: 45px;
  height: 45px;
  font-size: 20px;
  display: flex;
  align-items: center;
  padding: 0 48px 0 24px;
}
.con01_btnx.letter a span{
  background: #1443A2 url(../img/main/direct-arrow.png) right 24px center no-repeat;
}
.infra {width:100%; margin:130px 0 0;}
.infra .infra_tit {font-size:46px; font-weight: bold; color:#000;}
.infra ul {width:100%; display: inline-block; margin-top:50px;} 
.infra ul li {float:left; width:31.3%; margin-left:3%;}
.infra ul li:first-child {margin:0;}
.infra ul li a {position: relative;}
.infra ul li a .box_bg {width:100%; height: 360px; overflow: hidden;}
.infra ul li a .box_bg img {max-width:100%; transition:all 0.3s; transform:scale(1) rotate(0.001deg); width:100%;}
.infra ul li a .box_bg::before {content: ""; transition: all 0.3s; position: absolute; top:0; left:0; width:100%; height:100%; z-index: 1;}
.infra ul li a:hover .box_bg img{transform:scale(1.05) rotate(0.001deg);}
.infra ul li a:hover .box_bg::before {background:rgba(0,0,0,0.5); z-index:1;}
.infra ul li a .box_txt {position: absolute; bottom:10%; left:10%; z-index: 99; color:#fff; display: inline-block; font-size:24px; font-weight: bold;}



.con03 {padding:160px 0 20px; position: relative;}
.con03 .con03_inner {width:1300px; margin:0 auto;}
.con03 ul {display: inline-block; width:100%; margin-top:40px;}
.con03 ul li {width:23.8%; float: left; padding:2% 2%; border:1px solid #efefef; margin-right:20px; text-align: left; border-top-left-radius: 30px;}
.con03 ul li:last-child {margin:0;}
.con03 ul li .con03_txt01 {font-size:14px; color: #003f7a;}
.con03 ul li .con03_txt02 {font-size:18px; font-weight: bold; color:#000; margin:10px 0 20px;}
.con03 ul li .con03_txt03 {font-size:14px; color:#444444; margin:0 0 20px; height:58px; line-height:18px;}
.con03 ul li .con03_date {font-size: 12px; color: #666; text-align: right;}
.con03 .con03_more {position: absolute; top:20%; right:7%; display: inline-block;}

footer {background: #141414; padding:20px 0;}
.foot_inner {width:1300px; margin: 0 auto;}
.foot_inner .f_top {padding:20px 0; width:100%; display: inline-block;}
.foot_inner .f_top ul li {float:left; margin-right: 20px;}
.foot_inner .f_top ul li a {font-size: 16px; color:#fff;}
.foot_inner .f_con {width:100%; padding:20px 0; display: inline-block;}
.foot_inner .f_con .f_left {float:left; width:60%;}
.foot_inner .f_con .f_left dl {width:100%; margin:10px 0; display: inline-block;}
.foot_inner .f_con .f_left dl dt {color:#fff; width:20%; float: left; font-size: 16px;}
.foot_inner .f_con .f_left dl dd { float: left; color:#666; font-size: 16px; width:80%;}
.foot_inner .f_con .f_right {float:left; width:40%;}
.foot_inner .f_con .f_right .f_txt01 {font-size:14px; color:#fff;}
.foot_inner .f_con .f_right .f_txt02 {font-size:30px; color:#b0b0b0; padding: 10px 0; font-weight: bold;}
.foot_inner .f_con .f_right .f_txt03 {font-size:14px; color:#666; line-height: 20px;}
.foot_inner .f_ctxt {font-size:14px; padding:10px 0; color:#666;  width:100%;}



.sub_tit {font-size:14px; color:#003f7a;}
.con_tit {font-size:48px; font-weight: bold; }


/* search */

.search_bb {background:#f7f8fa; padding:3% 2%; width:100%; margin: 0 0 20px; text-align: center;}
.search_bb fieldset {float: left; }
#mainform {display: inline-block;}
.bbs_search_text {position: relative; border: 1px solid #6d6d6d;}
legend {font-size:0; height:0; width: 0; position: absolute;}
.bbs_search_text input {float:left; border:0; height:48px; line-height:48px; width:calc(100% - 48px) !important; box-sizing:border-box; background:#fff;}
.search_bb .bbs_sbtn01 {float:left; background: url('../img/common/icon_search.png') no-repeat center; width:48px; height: 48px; border: 0; display: block; cursor: pointer; color:transparent; font-size:0; background-size: 22px;}

.search_bb ul {width:100%; display: inline-block; margin:20px 0;}
.search_bb ul li {float:left; margin:5px;}
.search_bb ul li a {border:1px solid #ccc; padding: 8px 20px; font-size:16px; border-radius: 20px; background: #fff; color: #000;}
.search_bb ul li.on_p a {background: #073190; color:#fff; border: 1px solid #073190;}

.search_bb ul li a:focus-visible{outline-offset: 5px;}

/* 포토 갤러리 */

.photo_list {width:100%; margin:40px 0; display: inline-block;}
.photo_list ul {width: 100%;}
.photo_list ul li {float:left; width:23%; margin:2% 1%; text-align: center;}
.photo_list ul li .photo_img {overflow: hidden; height:175px;}
.photo_list ul li .photo_img img{max-width:100%; transition:all 0.3s; transform:scale(1) rotate(0.001deg); width:100%;}
.photo_list ul li a:hover .photo_img img{transform:scale(1.05) rotate(0.001deg);}
.photo_list ul li .photo_txt01 {font-size:14px; margin-top:10px; padding:5px 14px; border:1px solid #6d6d6d; border-radius: 20px; color:#000; display: inline-block;}
.photo_list ul li .photo_txt02 {font-size:20px; font-weight: bold; margin:10px 0;overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-all;}



/* tbult */

@media (max-width: 1180px) {  
    .quick ul {
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-start;
        gap: 12px;
    }
    .quick ul li {
}
    .quick ul li a {
        width: 140px;
        height: 140px;
    }
}


/* mobile */
@media (max-width: 767px) {

    .sub_tit {font-size:12px;}
    .con_tit {font-size:28px;}

    .infra .infra_tit {font-size:28px;}

    .con01 .con01_inner {width:100%;}
    .serch {width:100%;padding: 0;}
    .serch input {width:75%;height: 52px}
    .serch dl {display: inline-block; margin:6px 0;}
    .serch dl dt {font-size:14px;}
    .serch dl dd {font-size:12px; margin-left:5px;}
    .quick {width:100%; margin:20px 0;}
    .quick ul li .q_txt {font-size:12px;}

    .con01_btn {margin:20px 0;}

    .infra ul li a .box_bg {height:auto;}
    .infra ul li a .box_txt {font-size:12px;}

    .bbs_search_text input {width:81%;}
    .search_bb {padding:5%; margin:50px 0 0;}
    .search_bb ul li a {font-size:12px;}
    .search_bb ul li {margin:5px 7px;}
    .photo_list ul li {width:48%;}
    .photo_list ul li .photo_img {height:105px;}
    .photo_list ul li .photo_txt01 {font-size:12px;}
    .photo_list ul li .photo_txt02 {font-size:16px;}
   

    .main .news .title .btn_view {width:15%; padding:20px 0 0 0;}
    .main .news .inner {width:100%;}
    .main .news .swiper-slide .report p img {width:100%;}
    .main .news .swiper-slide .report {height:120px;}
    .main .news .swiper-slide .report .uq_txt {font-size:12px;}

    .main .news .title {width:60%;}


    .con03 {padding:0 0 20px;}
    .con03 .con03_inner {width:96%; padding:0 2%;}
    .con03 ul li {width:47.5%; padding:3%; margin-top:10px; margin-right:15px;}
    .con03 ul li:nth-child(2) {margin-right:0;}
    .con03 ul li:nth-child(4) {margin-right:0; margin-top:10px;}
    .con03 ul li .con03_txt01 {font-size:12px;}
    .con03 ul li .con03_txt02 {font-size:16px; }
    .con03 ul li .con03_txt03 {font-size:12px; height:40px;}
    .con03 ul li .con03_date {font-size: 11px;}
    .con03 .con03_more {top:0; right:3%; width:20%;}
    

    .banner {display:none;}

    .foot_inner {width:100%;}
    .foot_inner .f_top {text-align: center;}
    .foot_inner .f_top ul {display: inline-block;}
    .foot_inner .f_top ul li {margin-right:10px;}
    .foot_inner .f_top ul li a {font-size:11px;}

    .foot_inner .f_con .f_left {width:100%;}
    .foot_inner .f_con .f_left dl {width:92%; padding:0 4%; margin:5px 0;}
    .foot_inner .f_con .f_left dl dt {font-size:12px;}
    .foot_inner .f_con .f_left dl dd  {font-size:12px;}

    .foot_inner .f_con .f_right {width:92%; padding:20px 4% 0; }
    .foot_inner .f_con .f_right .f_txt01 {font-size:12px;}
    .foot_inner .f_con .f_right .f_txt02 {font-size:24px;}
    .foot_inner .f_con .f_right .f_txt03 {font-size:12px; line-height: 18px;}
    .foot_inner .f_ctxt {font-size:12px; text-align: center;}

    .main .visual .title h2 .motion:first-child div{
      font-size: 24px;
      margin:40px 0 0 0;
    }
    .main .visual .title h2 .motion:first-child div span{
      display: block;
      line-height: 1.5;
    }
    .main .visual .title h2 .motion .v_txt {
      font-size: 20px;
      display: block;
    }
    .main .visual .title h2 .motion .v_txt strong{
      font-size: 28px;
    }
    .quick ul {
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 12px;
        max-width: 292px;
        padding: 0;
        margin: auto;
    }
    .quick ul li a {
    width: 140px;
    height: 140px;
    }
        .main .visual .quick img {
        width: 50px;
        height: 50px;
    }
    .con01 {
    width: 100%;
    padding:20px 0;
    }
    .serch .search_wrap {
    height: 54px;
    }
    .main section {
      padding: 0 16px;
    }
    .con01_btnx {
      margin: 40px 0 0 0;
    }
    .con01_btnx a {
      display: block;
      background: linear-gradient(95deg, rgba(38, 41, 97, 1), rgba(72, 41, 112, 1));
      border-radius: 4px;
      height: 152px;
      color: #fff;
      font-size: 18px;
      padding: 0 24px;
      text-align: left;
      position: relative;
  }
  .con01_btnx a p{
    padding:19px 0 0 0;
    line-height: 1.4;
    font-weight: 300;
  }
  .con01_btnx a p strong{
    font-weight: 500;
  }
  .con01_btnx a img{
    position: absolute;
    left: 23px;
    width: 47px !important;
    bottom: 21px;
  }
  .con01_btnx a span{
    position: absolute;
    right: 16px;
    height: 36px;
    font-size: 16px;
    bottom: 21px;
  }
  .infra {
    margin: 55px 0 0;
  }
  .infra ul {
    margin-top: 30px;
  }
  .con03 {
    margin: 64px 0 0 0;
  }
  .main .visual img.viusal-img {
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: -80px center;
  }
  .main .visual.global .inner {
    padding-top: 110px !important;
  }
}