/* 서브비주얼 */
.sub_visual { position: relative; height: 420px; overflow: hidden; }
.sub_visual .bg { z-index: -1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: no-repeat center/cover; transform-origin: center; transform: scale(1.1); animation: sub_bg linear forwards 5s; }
@keyframes sub_bg {
    0% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

.sv1 .bg { background-image: url(/image/sub/topbg_company.png); }
.sv2 .bg { background-image: url(/image/sub/topbg_business.png); }
.sv3 .bg { background-image: url(/image/sub/topbg_inquiry.png); }

.sub_visual .contwrap { height: 100%; }
.sub_visual .txtwrap { position: absolute; top: 90px; left: 0; width: 100%; height: calc(100% - 138px); }
.sub_visual .txtwrap .txtbox { position: relative; top: 50%; transform: translateY(-50%); text-align: center; }
.sub_visual .txtwrap .txtbox .txt1 { font-weight: 700; font-size: 50px; color: #fff; line-height: 1; }

@media (max-width: 1535px) {
    .sub_visual { height: 340px; }
    
    .sub_visual .txtwrap { top: 80px; height: calc(100% - 128px); }
}
@media (max-width: 1280px) {
    .sub_visual { height: 310px; }

    .sub_visual .txtwrap { top: 70px; height: calc(100% - 118px); }
}
@media (max-width: 1023px) {
    .sub_visual { height: 280px; }
    .sub_visual .txtwrap { height: calc(100% - 110px); }
    .sub_visual .txtwrap .txtbox .txt2 br { display: inline-block; }
}
@media (max-width: 639px) {
    .sub_visual { height: 250px; }
}

/* 서브메뉴 */
.sub_menu { margin-top: -48px; height: 48px; background-color: rgba(0, 0, 0, 0.7); }
.sub_menu .contwrap { height: 100%; }
.sub_menu .contents { height: 100%; }
.sub_menu .contents .con { float: left; position: relative; height: 100%; border-right: 1px solid #4d4d4b; }
.sub_menu .contents .con1 { width: 48px; border-left: 1px solid #4d4d4b; }
.sub_menu .contents .con1 > a { position: relative; display: block; height: 100%; }
.sub_menu .contents .con1 > a > img { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.sub_menu .contents .con1 > a:hover { background-color: #333; }
.sub_menu .contents .con2 { width: 300px; }
.sub_menu .contents .con2 .sub_menu1 { position: relative; height: 100%; cursor: pointer; }
.sub_menu .contents .con2 .sub_menu1:hover { background-color: #333;  }
.sub_menu .contents .con2 .sub_menu1 p { position: absolute; top: 50%; transform: translateY(-50%); left: 15px; font-weight: 500; font-size: 16px; color: #fff; }
.sub_menu .contents .con2 .sub_menu1 .down_arrow { position: absolute; top: 50%; transform: translateY(-50%); right: 15px; width: 11px; height: 6px; background: url(/image/sub/sub_menu_icon2.png) no-repeat center/cover; }
.sub_menu .contents .con2 .sub_menu1.active .down_arrow { background-image: url(/image/sub/sub_menu_icon3.png); }
.sub_menu .contents .con3 { width: 340px; }
.sub_menu .contents .con3 .sub_menu2 { position: relative; height: 100%; cursor: pointer; }
.sub_menu .contents .con3 .sub_menu2:hover { background-color: #333;  }
.sub_menu .contents .con3 .sub_menu2 p { position: absolute; top: 50%; transform: translateY(-50%); left: 15px; font-weight: 500; font-size: 16px; color: #fff; }
.sub_menu .contents .con3 .sub_menu2 .down_arrow { position: absolute; top: 50%; transform: translateY(-50%); right: 15px; width: 11px; height: 6px; background: url(/image/sub/sub_menu_icon2.png) no-repeat center/cover; }
.sub_menu .contents .con3 .sub_menu2.active .down_arrow { background-image: url(/image/sub/sub_menu_icon3.png); }
.sub_menu .contents .con .ssub_menu { display: none; z-index: 10; position: absolute; left: -1px; width: calc(100% + 2px); border: 1px solid #c0c0c0; }
.sub_menu .contents .con .ssub_menu a { display: block; padding: 10px 12px; text-align: left; font-size: 16px; color: #fff; background-color: rgba(0, 0, 0, 0.8) }
.sub_menu .contents .con .ssub_menu a:hover { background-color: #444; }

@media (max-width: 1023px) {
    .sub_menu { margin-top: -40px; height: 40px; }
    .sub_menu .contents .con1 { width: 40px; height: 40px; }
    .sub_menu .contents .con2 { width: calc(100% - 40px);  height: 40px;}
    .sub_menu .contents .con2 .sub_menu1 p { font-size: 13px; }
    .sub_menu .contents .con3 { width: 100%;  height: 40px; border-top: 1px solid rgba(255, 255, 255, 0.2); border-left: 1px solid rgba(255, 255, 255, 0.2); }
    .sub_menu .contents .con3 .sub_menu2 p { font-size: 13px; }
    .sub_menu .contents .con .ssub_menu a { font-size: 13px; }

    .sub_menu .contents .con2 .sub_menu1 .down_arrow { right: 10px; }
    .sub_menu .contents .con3 .sub_menu2 .down_arrow { right: 10px; }
}

/* 서브공통 */
.sub_sect { padding: 90px 0; }
.sub_sect .sub_tit { padding-bottom: 70px; text-align: center; font-weight: 600; font-size: 30px; color: #000; }

/* sub1_1 */
.sub1_1 .img_wrap { position: relative; }
.sub1_1 .img_wrap img { position: relative; width: 100%; }
.sub1_1 .img_wrap .descbox { z-index: 1; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.sub1_1 .img_wrap .descbox .desc1 { font-weight: 700; font-size: 30px; color: #fff; line-height: 1.5; }
.sub1_1 .img_wrap .descbox .desc2 { font-size: 20px; color: #fff; line-height: 1.5; }
.sub1_1 .map_wrap { margin-top: 50px; height: 500px; border: 1px solid #ddd; }
.sub1_1 .map_wrap iframe { width: 100%; height: 100%; }
.sub1_1 .map_desc { padding: 20px 0;}
.sub1_1 .map_desc dl { width: 100%; display: flex; flex-wrap: nowrap; align-items: center; font-size: 18px; color: #000; line-height: 1.4; }
.sub1_1 .map_desc dl dt, .sub1_1 .map_desc dl dd { font-size: inherit; color: inherit; line-height: inherit; }
.sub1_1 .map_desc dl dt { min-width: max-content; margin-right: 10px; }
.sub1_1 .map_desc dl dt img { width: 36px; }
@media (max-width: 1535px) {
    .sub1_1 .map_wrap { height: calc(250px + 15vw); }
    .sub1_1 .map_desc dl dt img { width: calc(20px + 1vw); }
}
@media (max-width: 1023px) {
    .sub1_1 .map_wrap { height: calc(200px + 13vw); }
    .sub1_1 .map_desc { display: block; padding: 15px 0; }
    .sub1_1 .map_desc dl dt img { width: 27px; }
}
@media (max-width: 767px) {
    .sub1_1 .map_wrap { height: calc(170px + 10vw); }
    .sub1_1 .img_wrap img { display: none; }
    .sub1_1 .img_wrap .descbox { position: relative; top: initial; left: initial; transform: translate(0,0); padding: 30px; background: url(/image/sub/sub1_2_img1.png) no-repeat center/cover; }
    .sub1_1 .map_desc { padding: 10px 0; }
}