@charset "utf-8";

.typeIntro{max-width:1920px;margin:0 auto;background-color:var(--color-background-gray-subtler);}

.header{position:absolute;width:100%;left:50%;top:0;max-width:1920px;margin:0 auto;height:104px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:0 90px;z-index:90;transform:translateX(-50%);}
.header a,
.header a img{display:block;}
.header .util .snsList{display:flex;flex-wrap:wrap;align-items:center;justify-content:end;gap:12px;}
.header .util .snsList li{width:auto;height:100%;display:inline-flex;align-items:center;justify-content:center;}
.header .util .snsList li a{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;}

#container{display:flex;flex-direction:column;gap:48px;padding-top:150px;position:relative;}

.typeIntro .inner {position:relative;width:100%;height:100%;padding:0 80px;margin:0 auto;}

.svgIcon{display:inline-flex;transition:0.4s ease-in-out;mask-repeat:no-repeat;mask-position:center;mask-size:contain;forced-color-adjust: none;}

.intro_visual{width:100%;height:calc(100% - 48px);}
.intro_visual .inner{max-width:1920px;margin:0 auto;padding:0 90px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;}
.intro_visual .visualTxtBx{width:498px;padding-right:48px;}
.intro_visual .link{width:calc(100% - 498px);height:100%;}
.intro_visual .visualTxtBx .visual_txt{font-family:'Pretendard GOV', 'Pretendard', sans-serif;font-size:56px;line-height:normal;color:var(--color-text-basic);font-weight:bold;margin-bottom:50px;white-space:pre-line;padding-left:2px;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;text-overflow:ellipsis;overflow:hidden;word-break:keep-all;overflow-wrap:anywhere;}
.intro_visual .visualTxtBx .baseBtn{display:inline-flex;align-items:center;justify-content:center;background:var(--color-button-primary-fill);color:var(--color-text-basic-inverse);gap:16px;font-weight:bold;padding:0 20px 0 24px;border-radius:1000px;transition:all 0.4s;}
.intro_visual .visualTxtBx .baseBtn .base{font-size:17px;padding:0;background:transparent;border:none;height:auto;}
.intro_visual .visualTxtBx .baseBtn:hover{background:var(--color-button-primary-fill-hover);}
.intro_visual .visualTxtBx .baseBtn:hover .base{color:var(--color-text-basic-inverse);}
.intro_visual .visualTxtBx .baseBtn:active{background:var(--color-button-primary-fill-pressed);}
.intro_visual .visualTxtBx .baseBtn:active .base{color:var(--color-text-basic-inverse);}
.intro_visual .visualTxtBx .baseBtn .ico_arrow24{width:24px;height:24px;background-color:var(--color-text-basic-inverse);mask-image:url(../../KOR_C/img/layout/ico_arrowRight24.svg);flex-shrink:0;}
.intro_visual .link .linkList{display:flex;flex-wrap:wrap;align-items:stretch;justify-content:start;margin-right:-30px;gap:30px;height:100%;}
.intro_visual .link .linkList li{width:calc(25% - 30px);}
.intro_visual .link .linkList a{display:flex;flex-wrap:wrap;align-items:stretch;justify-content:center;align-content:center;border-radius:24px;background:var(--color-background-white);box-shadow:0 0 50px rgba(0,0,0,0.09);height:100%;min-height:330px;padding:0 24px;border: 1px solid var(--color-border-inverse);transition:0.4s;}
.intro_visual .link .linkList a .icoBx{display:inline-flex;align-items:center;justify-content:center;width:86px;height:86px;margin-bottom:30px;}
.intro_visual .link .linkList a .txtBx{width:100%;text-align:center;}
.intro_visual .link .linkList a .txtBx span{display:block;}
.intro_visual .link .linkList a .txtBx .txt{font-size:16px;line-height:1.4;color:var(--color-text-subtle-inverse);margin-bottom:5px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
.intro_visual .link .linkList a .txtBx .tit{font-size:30px;line-height:normal;color:var(--color-text-basic);font-weight:bold;width:100%;margin-bottom:26px;}
.intro_visual .link .linkList a .txtBx .svgIcon{width:32px;height:32px;background-color:var(--color-background-dark);mask-image:url(../../KOR_C/img/layout/ico_arrowRight24.svg);}/* 260220 background color change */
.intro_visual .link .linkList a:hover,
.intro_visual .link .linkList a:focus-visible{border-color: var(--color-border-primary);}

.intro_content{max-width:1920px;margin:0 auto;padding:0 40px;height:476px;width:100%;}
.intro_content .inner{border-radius:40px;overflow:hidden;padding:0 65px;display:flex;align-items:center;justify-content:start;}
.intro_content .inner .bg{background-image:url(../../KOR_C/img/intro/bg_intro.png);background-repeat:no-repeat;background-size:cover;background-position:center;position:absolute;width:100%;height:100%;left:0;top:0;z-index:-2;}
.intro_content .inner .bg::before{content:"";position:absolute;width:100%;height:100%;left:0;top:0;background:rgba(0,0,0,0.3);}
.intro_content .link{display:flex;flex-wrap:wrap;align-items:stretch;justify-content:start;height:auto;margin-left:-63px;width:calc(100% + 63px);}
.intro_content .link li{width:25%;padding:0 63px;}
.intro_content .link li + li{border-left:1px solid rgba(255,255,255,0.3);}
.intro_content .link a{display:flex;flex-direction:column;}
.intro_content .link .tit{font-size:40px;line-height:1.4;color:var(--color-text-basic-inverse);font-weight:bold;margin-bottom:20px;white-space:pre-line;word-break:keep-all;}
.intro_content .link .txt{font-size:16px;line-height:1.4;color:var(--color-text-basic-inverse);margin-bottom:55px;white-space:pre-line;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;text-overflow:ellipsis;overflow:hidden;word-break:keep-all;}
.intro_content .link .ico_link24{width:24px;height:24px;background-color:var(--color-text-basic-inverse);mask-image:url(../../KOR_C/img/intro/ico_link24.svg);}


.footer{height:86px;display:flex;max-width:1920px;margin:0 auto;width:100%;padding:0 90px;align-items:center;justify-content:space-between;gap:20px 40px;}
.footer .info{font-style:normal;display:inline-flex;align-items:center;justify-content:start;gap:0 12px;flex-wrap:wrap;}
.footer .info > span{font-size:16px;line-height:1.4;color:var(--color-text-basic);}
.footer .info > span .label{font-weight:bold;color:var(--color-text-subtle);margin-right:4px;}
.footer .copyright{font-size:14px;line-height:1.4;color:var(--color-text-basic);}


.fixedArea{position:fixed;right:12px;bottom:40px;display:flex;flex-direction:column;gap:10px;transition:opacity 0.4s;z-index:990;display:none;}
.fixedArea.absol{position: absolute;}
.fixedArea .btnSns{width:50px;height:50px;border-radius:1000px;background:var(--color-background-white);color:var(--color-text-dark);display:inline-flex;align-items:center;justify-content:center;font-size:14px;font-weight:500;font-family:'Roboto',sans-serif;}/* 260220 color change */

#snsPop .popLayout{background:transparent;padding:0;top:auto !important;bottom:40px;left:auto !important;right:12px;position:fixed;width:50px;display:flex;flex-wrap:wrap;gap:8px;}
#snsPop .popLayout .popConts{padding-top:0;}
#snsPop .popLayout .popInner{background:var(--color-background-white);padding:12px 5px;border-radius:8px;width:50px;}
#snsPop .snsList{display:flex;flex-direction:column;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;}
#snsPop .snsList li{width:100%;}
#snsPop .snsList li a,
#snsPop .snsList li img{display:block;}
#snsPop.absol .popLayout{position: absolute;}
#snsPop .btn_popClose{width:50px;height:50px;border-radius:1000px;background-color:var(--color-button-primary-fill);position: static;right:auto;top:auto;background-image:url(../../KOR_C/img/layout/ico_close24.svg);background-size:24px auto;}


/* responsive */
@media all and (max-width:1800px){
    .intro_visual .visualTxtBx{width:30%;}
    .intro_visual .link{width:70%;}
    .intro_visual .link .linkList a{padding:0 12px;}
}
@media all and (max-width:1600px){
    .header{padding:0 40px;}

    #container{padding-top:120px;}
    .intro_visual .visualTxtBx{width:28%;padding-right:32px;}
    .intro_visual .link{width:72%;}
    .intro_visual .inner{padding:0 40px;}
    .intro_visual .link .linkList{margin-right:-16px;gap:16px;}
    .intro_visual .link .linkList li{width:calc(25% - 16px);}
    .intro_visual .visualTxtBx .visual_txt{font-size:44px;}
    .intro_visual .link .linkList a .icoBx{width:72px;height:72px;margin-bottom:20px;}
    .intro_visual .link .linkList a .txtBx .txt{font-size:14px;}
    .intro_visual .link .linkList a .txtBx .tit{font-size:24px;}
    .intro_content{height:420px;}
    .intro_content .inner{padding:0 40px;}
    .intro_content .link{margin-left:-40px;}
    .intro_content .link li{padding:0 40px;}
    .intro_content .link .tit{font-size:32px;}

    .footer{padding:0 40px;}
}
@media all and (max-width:1280px){
    #container{gap:32px;}
    .intro_visual .visualTxtBx{width:100%;padding-right:0;margin-bottom:40px;}
    .intro_visual .link{width:100%;}    
    .intro_visual .visualTxtBx .visual_txt{margin-bottom:30px;}
    .intro_visual .visualTxtBx .visual_txt br{display:none;}
    .intro_visual .link .linkList a{min-height:auto;padding:26px 12px;}
    .intro_visual .link .linkList a .icoBx{width:52px;height:52px;}
    .intro_visual .link .linkList a .txtBx .tit{margin-bottom:10px;}
    .intro_visual .link .linkList a .txtBx .svgIcon{width:24px;height:24px;}
    .intro_content{height:400px;}
    .intro_content .link{margin-left:-24px;}
    .intro_content .link li{padding:0 24px;}
    .intro_content .link .tit{font-size:24px;margin-bottom:10px;}
    .intro_content .link .txt{font-size:14px;margin-bottom:40px;}
}

@media all and (max-width:1040px){
    .header{height:80px;padding:0 24px;}
    .header .logo img{height:32px;}
    .header .util{display:none;}

    #container{padding-top:100px;gap:24px;}
    .intro_visual .inner{padding:0 24px;}
    .intro_visual .visualTxtBx{margin-bottom:24px;}
    .intro_visual .visualTxtBx .visual_txt{font-size:28px;margin-bottom:20px;}
    .intro_visual .visualTxtBx .baseBtn{height:46px;gap:8px;}
    .intro_visual .link .linkList a{padding:26px 12px 18px;box-shadow: 0 0 30px rgba(0, 0, 0, 0.15);}
    .intro_visual .link .linkList a .icoBx{width:40px;height:40px;margin-bottom:10px;}
    .intro_visual .link .linkList a .txtBx .txt{display:none;}
    .intro_visual .link .linkList a .txtBx .tit{font-size:20px;margin-bottom:6px;}
    .intro_visual .link .linkList a .txtBx .svgIcon{display:none;}
    .intro_content{padding:0 24px;height:auto;}    
    .intro_content .inner{padding:32px 24px;border-radius:24px;}
    .intro_content .inner .bg{background-image:url(../../KOR_C/img/intro/bg_intro_m.png);background-position:center bottom;}
    .intro_content .link{margin-left:0;}
    .intro_content .link li{padding:0;width:100%;}
    .intro_content .link li a{padding-right:32px;position:relative;}
    .intro_content .link li + li{border-left:none;border-top:1px solid rgba(255,255,255,0.25);padding-top:24px;margin-top:24px;}
    .intro_content .link .tit{margin-bottom:8px;}
    .intro_content .link .txt{margin-bottom:0;}
    .intro_content .link .tit br,
    .intro_content .link .txt br{display:none;}    
    .intro_content .link .ico_link24{position:absolute;right:0;top:50%;transform:translate(0,-50%);width:20px;height:20px;}

    .footer{padding:40px 24px;height:auto;gap:24px;flex-wrap:wrap;}    
    .footer .copyright{width:100%;}

    .fixedArea{display:flex;bottom:20px;}
    .fixedArea.absol{bottom:-20px;}
}

@media all and (max-width:768px){
    .header{padding:0 20px;}
    .header .logo img{height:26px;}

    #container{padding-top:90px;gap:15px;}    
    .intro_visual .inner{padding:0 16px;}
    .intro_visual .visualTxtBx{margin-bottom:20px;}
    .intro_visual .visualTxtBx .visual_txt{font-size:24px;margin-bottom:16px;}
    .intro_visual .visualTxtBx .baseBtn .base{font-size:16px;}
    .intro_visual .visualTxtBx .baseBtn .ico_arrow24{width:20px;height:20px;margin-top:-2px;}
    .intro_visual .link .linkList{margin-right:-12px;gap:12px;}
    .intro_visual .link .linkList li{width:calc(50% - 12px);}
    .intro_visual .link .linkList a{padding:24px 12px;}
    .intro_visual .link .linkList a .icoBx{width:40px;height:40px;margin-bottom:12px;}
    .intro_visual .link .linkList a .txtBx .txt{display:none;}
    .intro_visual .link .linkList a .txtBx .tit{font-size:17px;margin-bottom:0;}
    .intro_content{padding:0 20px;}
    .intro_content .inner{padding:24px;}
    .intro_content .link .tit{font-size:18px;margin-bottom:4px;}
    .intro_content .link li + li{margin-top:16px;padding-top:16px;}

    .footer{padding:40px 20px;}    
    .footer .info .add{width:100%;margin-bottom:12px;}
}


@media all and (max-width:480px){
    .intro_visual .link .linkList{margin-right:-12px;gap:12px;}
    .intro_visual .link .linkList li{width:calc(50% - 12px);}
    .intro_visual .link .linkList a .txtBx .tit{font-size:17px;}
}

@media all and (max-width:359px){
    .footer .info > span{font-size:15px;}
}


/* 
.intro_visual {width:calc(100% - 420px);background:url(../../KOR_A/img/intro/intro_visual.jpg) no-repeat center;background-size: cover;}
.intro_visual .inner {padding-top: 210px}
.intro_visual .visual_txt {margin-left:-5px;font-size:100px;font-style: normal;color:#fff;line-height:10px;}
.intro_visual .visual_txt>span {font-family: "contralto-big", sans-serif;font-weight: 300;}
.intro_visual .link {display:flex;flex-wrap:wrap;margin-top:100px;}
.intro_visual .link>a {display:flex;width:150px;height:150px;margin-right:15px;border-radius: 50%;border:1px solid #fff;justify-content: center;align-items: center;transition:.3s all;}
.intro_visual .link>a span {font-size:20px;font-weight: 700;color:#fff;line-height:26px;}
.intro_visual .link>a:hover {background:#A70638;border:1px solid #A70638;} */

/* .intro_content {width:420px;}
.intro_content .inner {max-width:260px;width:100%;margin:0 auto;padding:235px 0 0 0;}
.intro_content .inner .service_tit {margin-bottom:55px;font-size:32px;font-weight: 700;line-height:30px;background:url(../../KOR_A/img/intro/ico_service.svg) no-repeat right 0 top -8px;}
.intro_content .inner .link {padding-top:50px;border-top:1px solid rgba(0,0,0,0.07)}
.intro_content .inner .link>a {display:block;font-size:24px;font-weight:500;line-height: 48px;background:url(../../KOR_A/img/intro/intro_arrR.svg) no-repeat right 0 top 50%;text-align: left;}
footer {position:absolute;bottom:40px}
footer .info {font-size:0;font-size:15px;line-height:24px;}
footer .info>span {display:inline-block;vertical-align: top;}
footer .info>span:first-child {margin-right: 10px;}
footer .copyright {width:calc(100% + 30px);margin:10px 0 23px 0;font-size:13px;padding-left:13px;;background:url(../../KOR_A/img/intro/ico_copy.svg) no-repeat left 0 top 3px;}
footer .snsArea {display:flex;font-size:0;align-items: center;}
footer .snsArea a {display:block;margin-right: 23px;} */

/* footer {position:inherit; bottom:auto;padding-top:50px;padding-bottom: 80px;;} */
/* #container.pcScroll footer {position:inherit; bottom:auto;padding-top:50px;padding-bottom:40px;;}

.footer_m {display:none;} */
/* 
@media all and (max-width:1400px){
    .intro_content {width:350px;}
    .intro_visual {width:calc(100% - 350px);}
}


@media all and (max-width:1260px){
    .intro_visual .visual_txt {line-height: 87px;}
    .intro_visual .visual_txt>span {display:block;line-height:70px;}

    .intro_visual .link>a {width:11.812vw;height:11.812vw;}
    footer .copyright {width:100%;}
}


@media all and (max-width:1100px){
    .intro_visual .link>a {margin-right: 10px;}
    .intro_visual .inner {padding-right: 40px;}
} 

@media all and (max-width:1040px){
    #container {display:block;height:auto;}
    .intro_visual {width:100%;}
    .intro_content {width:100%;}
    .intro_visual .link {padding-bottom: 30px;}
    
    .intro_visual .visual_txt {margin-left:0;}
    .typeIntro header {padding-left:30px;padding-right:30px;}
    .typeIntro .inner {padding:0 30px;padding-top:200px;}
    .intro_content .inner {max-width:100%;}
    .intro_visual .link {margin-top:80px;padding-bottom: 180px;}
    .intro_visual .link>a {width:150px;height:150px;}
    .intro_content .inner {padding-top:80px;padding-bottom: 40px;}
    .intro_content .inner .service_tit {margin-bottom:20px;}
    .intro_content .inner .link {display:flex;flex-wrap: wrap;padding-top:30px;}
    .intro_content .inner .link>a {width:50%;background:none}
    .intro_content .inner .link>a>span {display:inline-block;width:180px;background:url(../../KOR_A/img/intro/intro_arrR.svg) no-repeat right 0 top 50%;vertical-align: top;}
    .intro_content .inner .link>a:nth-child(odd)>span {width:170px}
    footer  {position:inherit;bottom:auto;padding-bottom: 0;padding-top:40px;}
    #container.pcScroll footer {padding-bottom: 0;}
    
}

@media all and (max-width:768px){
    #container {height:calc(var(--vh, 1vh) * 100);}
    .typeIntro header {padding:15px;}
    .intro_visual .link>a {width:84px;height:84px;transition:none;}
    .intro_visual .link>a:last-child {margin-right: 0;}
    .intro_visual .link>a:hover {background:transparent;border:1px solid #fff}
    .intro_visual .link>a span {font-size:15px;line-height: 18px;}
    .typeIntro .inner {padding:0 15px;padding-top:65px;}
    .typeIntro header img {height: 30px;}
    .intro_visual {height:calc(100% - 200px)}
    .intro_visual .inner {padding-top:33.333vw;}
    .intro_visual .visual_txt {font-size:50px;line-height: 48px;;}
    .intro_visual .visual_txt>span {line-height:60px;}
    .intro_visual .link {margin-top:30px;padding-bottom: 50px;}
    .intro_content {height:200px}
    .intro_content .inner {display:flex;justify-content:center;flex-direction: column;padding-top:0;}
    .intro_content .inner .service_tit {margin-bottom:16px;font-size: 26px;}
    .intro_content .inner .service_tit br {display:none;}
    .intro_content footer {display:none;}
    .intro_content .inner .link>a {line-height: inherit;}
    .intro_content .inner .link>a>span {width:120px;}
    .intro_content .inner .link>a>span {font-size:16px;background-size: 9px auto;}
    .intro_content .inner .link>a:nth-child(odd)>span {width:115px;}
    footer.footer_m {display:block;padding:0px 15px 30px 15px;}
    .intro_content .inner .service_tit {position:relative;background:none;}
    .intro_content .inner .service_tit:before {content:'';position:absolute;right:0;top:-10px;display:block;width:39px;height:39px;background:url(../../KOR_A/img/intro/m_ico_service.svg) no-repeat right 0 top 50%;}
    
}


@media all and (max-width:420px){
    .intro_visual .link {justify-content: space-between;}
    .intro_visual .link>a {width:74px;height:74px;margin-right: 0;}
}

@media all and (max-width:350px){
    .intro_visual .link>a {width:70px;height:70px;}
}*/
