body, html {height:100%; background-color: #000; overflow: hidden;}

.main_wrap {background-color: #131222; width:100%; height:100%;}
.sub_wrap {background-color: #000; width:100%; height:100%;}

.main_wrap .header_wrap {padding:50px; width: 100%; box-sizing: border-box;}
.main_wrap .header_wrap .logos {float: left; width: 20%; text-align: left;}
.main_wrap .header_wrap .logos img {height:75px;}
.main_wrap .header_wrap .titles {float: left; width: 60%; text-align: center;}
.main_wrap .header_wrap .titles img {height:80px;}
.main_wrap .header_wrap .types {float: right; width: 20%;text-align: right;}
.main_wrap .header_wrap .types img {height:40px;}

.main_wrap .header_wrap {position: fixed; top:0px; left: 0px; width:100%; background-color: #131222; z-index: 100;}

.main_wrap .content_wrap .content_wrap_abs {width: 100%; padding-top: 200px;}
.main_wrap .content_wrap .inner {width: 1330px; margin: 0 auto; text-align: center; position: relative;}

.main_wrap .footer_wrap {width: 100%; padding-bottom: 20px; margin-top: 67px;}
.main_wrap .footer_wrap .footer_txt1 {text-align: center;}
.main_wrap .footer_wrap .footer_txt1 img {height:13px;}

.main_wrap .swiper-slide-list {margin-top: 0px !important; margin-bottom: 30px !important;}

.sub_wrap .header_wrap {    padding-bottom: 0px !important; padding:50px; position: fixed; top:0px; left: 0px; width: 100%; box-sizing: border-box; z-index: 1;}
/*.sub_wrap .header_wrap {}*/
.sub_wrap .header_wrap .logos {float: left; width: 20%; text-align: left;}
.sub_wrap .header_wrap .logos img {height:75px;}
.sub_wrap .header_wrap .titles {float: left; width: 60%; text-align: center;}
.sub_wrap .header_wrap .titles img {height:87.5px;}
.sub_wrap .header_wrap .titles .top_type {height:69.5px;}

.sub_wrap .content_wrap {height:100%; position: relative;}
.sub_wrap .content_wrap .content_wrap_abs {position: absolute; top:50%; transform:translateY(-50%); width: 100%;}
.sub_wrap .content_wrap .inner {width: 1080px; margin: 0 auto; text-align: center; position: relative;}
.sub_wrap .content_wrap .iso_image {width: 100%; object-fit: cover; object-position:center center; margin-top: -200px;}
.sub_wrap .content_wrap .info_btns {
    background-color: transparent;
    width: 50px;
    height: 50px;
    padding: 0px;
    border: 0px;
    transition:none;
	z-index:999999;
}
.sub_wrap .content_wrap .info_btns img {height:40px;}
.sub_wrap .content_wrap_control {position: fixed; top:50%; transform: translateY(-50%); left: 50px;}
.sub_wrap .content_wrap_control img {height:160px; margin-top: -150px;}

.sub_wrap .content_wrap_map {position: fixed; bottom:120px; left: 50px;}
.sub_wrap .content_wrap_map .content_wrap_map_ul1 {margin-bottom: 10px; display: flex; align-items: center;}
.sub_wrap .content_wrap_map .content_wrap_map_ul1_txt {margin-right: auto;}
.sub_wrap .content_wrap_map .content_wrap_map_ul1_txt img {height:14px;}
.sub_wrap .content_wrap_map .content_wrap_map_ul1_comp {margin-left: auto;}
.sub_wrap .content_wrap_map .content_wrap_map_ul1_comp img {height:45px; margin-left: 5px;}
.sub_wrap .content_wrap_map .content_wrap_map_ul2 img {height:129px;}

.sub_wrap .footer_wrap {position: fixed; bottom:0px; left: 0px; width: 100%; padding-bottom: 20px; z-index: 98}
.sub_wrap .footer_wrap .footer_txt1 {text-align: center; margin-top: 10px;}
.sub_wrap .footer_wrap .footer_txt1 img {height:13px;}
.sub_wrap .footer_wrap .footer_wrap_iso_gnb {display: flex; text-align: center; align-items: center; justify-content: center; margin-top: 20px;}
.sub_wrap .footer_wrap .footer_wrap_iso_gnb ul {display: flex; align-items: center; justify-content: center;}
.sub_wrap .footer_wrap .footer_wrap_iso_gnb img {height:50px;}
.sub_wrap .footer_wrap .footer_wrap_iso_gnb .btm_home_btn {padding-left: 20px; padding-right: 20px;}

.sub_wrap .footer_wrap .footer_wrap_option_gnb {display: flex; text-align: center; align-items: center; justify-content: center; gap:20px;}
.sub_wrap .footer_wrap .footer_wrap_option_gnb img {height:40px;}

/* 하단 옵션에 연동된 우측 옵션 설명 팝업창 삭제
.sub_wrap .option_wrap {position: fixed; top:150px; right:0px; max-width:355px; text-align: center;}
.sub_wrap .option_wrap img {width: 355px; height:auto; margin-bottom: 10px;}
.sub_wrap .option_wrap .option_text {height:10.5px; width: auto;}*/

#d_sLightBox_win .close img {height:18px; width:auto; opacity: 0.5; padding:10px;}
#d_sLightBox_win .close:hover img {opacity: 1}

.frame_wrap {background-color: #4c4d54; box-sizing: border-box; height:505px;}
.frame_contents {background-color: #4c4d54; height:100%;}


.swiper-button-next-fr {right: 0px !important; background-color: #4c4d54; height:100% !important; top:22px !important; padding-left: 22px; padding-right: 22px;}
.swiper-button-next-fr img {height:35.5px; padding-top: 85px;}
.swiper-button-prev-fr {left: 0px !important; background-color: #4c4d54; height:100% !important; top:22px !important; padding-left: 22px; padding-right: 22px;}
.swiper-button-prev-fr img {height:35.5px; padding-top: 85px;}

.swiper-slide-fr {padding-left: 70px !important; padding-right: 70px !important; text-align: center;}
.swiper-slide-fr img {height:100%; width: auto;}

.swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled {opacity: 1 !important;}
.swiper-button-prev.swiper-button-disabled img, .swiper-button-next.swiper-button-disabled img {opacity: 0.5;}

.spritespin-progress {
    position: absolute;
    width: 50%;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    border:3px solid #111320;
    border-radius: 30px;
    background-color: #363636;
    overflow: hidden;
    outline: 3px solid #4f5060;
    height:22px;
}

.spritespin-progress-label {
    color: #fff;
    font-size: 14px;
}

.spritespin-progress-bar {
    background-color: #4d5d92;
    height: 20px;
    border-radius: 30px;
    margin-top: -19px;
}

.info_btns {display: none;}
.sc_wrap {position: fixed; right:30px; top:155px; padding-left: 20px; padding-right: 20px; background-color: #191827; height:calc(100% - 257px); border-radius: 10px; width: 25px;}
.sc_wrap ul {position: relative; height:100%;}
.sc_wrap img {width: 25px; position: absolute; top:50%; transform: translateY(-50%);}

.mobile {display: none;}
.pc {display: block;}

.info_btns_info {
    padding: 20px;
    border-radius: 10px;
    max-width: 150px;
    word-break: keep-all;
    position: fixed;
    right: 50px;
    top:50%;
    transform: translateY(-50%);
    background-color: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.3);
    font-size: 12px;
    z-index: 999;
    display: none; opacity: 0;
}
.btn_info_open {display: block !important; opacity: 1 !important;}
.btn_info_none {display: none; opacity: 0;}

#reset {background-color: #4b4c54; color:#999; border:0px; margin-top: 20px; height:40px; border-radius: 40px; width: 100%;}
#reset:hover {background-color: #53ad67; color:#fff;}

@media (min-width: 992px) and (max-width:1400px) {
	.main_wrap .content_wrap .inner {width: 85%;
	}
	    .sub_wrap .content_wrap_map .content_wrap_map_ul2 img {
        height: 80px !important;
    }

	.sub_wrap .content_wrap_map .content_wrap_map_ul1_txt img {
        height: 12px;
    }
    .sub_wrap .content_wrap_map .content_wrap_map_ul1_comp img {
        height: 21px;
    }
    .sub_wrap .content_wrap_map {
        position: fixed;
        bottom: 180px;}
        .sub_wrap .content_wrap_control img {
        height: 110px;
        margin-top: -160px;
    }
    .sub_wrap .header_wrap .logos img {
        height: 55px;
    }
    .sub_wrap .header_wrap .titles .top_type {
        height: 60px;
    }

    .sub_wrap .option_wrap img {
        width: 355px;
        height: auto;
        margin-bottom: 10px;
    }
    .sub_wrap .option_wrap {
        position: fixed;
        top: 100px;
        right: 0px;
        max-width: 355px;
        text-align: center;


    }
  
}
	
	@media all and (max-width:768px) {    .sub_wrap .content_wrap_control img {
        height: 200px;
		}
	
	}
		
@media all and (max-width:1100px) {
	
	
    .mobile {display: block;}
    .pc {display: none;}
	.sub_wrap .content_wrap_map .content_wrap_map_ul2 img {
    height: 100px !important;
}
.sub_wrap .content_wrap_map .content_wrap_map_ul1_comp img {
    height: 35px;
}
    .main_wrap .content_wrap .inner {width: 100%; padding-left: 120px; padding-right: 120px; box-sizing: border-box;}
    .sub_wrap .footer_wrap {padding-left: 20px; padding-right: 20px; box-sizing: border-box;}
    .sub_wrap .footer_wrap .footer_wrap_option_gnb {flex-wrap: wrap;}
    .sub_wrap .footer_wrap .footer_wrap_iso_gnb .btm_home_btn {display: none;}
    .sub_wrap .footer_wrap .footer_wrap_iso_gnb {flex-wrap: wrap;}
    .sub_wrap .footer_wrap .footer_wrap_iso_gnb ul:nth-child(1) {margin-bottom: 20px;}
    .btm_home_btn_mo_wrap {text-align: center; margin-top: 20px;}
    .btm_home_btn_mo_wrap img {height:50px; width:auto;}
    .sub_wrap .content_wrap_map {bottom:420px;}
    .sub_wrap .content_wrap_control {top:30%;}
    .main_wrap .footer_wrap {padding-bottom: 20px;}
    .main_wrap .header_wrap {padding-top: 30px; padding-bottom: 30px;}
    .main_wrap .header_wrap .types img {
    /* max-height: 44px; */
    height: 20px;
    /* height: auto; */
    vertical-align: top;
}

.main_wrap .header_wrap .types {
    height: 100%;
    line-height: 100px; /* header_wrap 높이와 맞춤 */
    display: inline-block;
    vertical-align: middle;
}
    .main_wrap .footer_wrap .footer_txt1 img {height:36px;}
    .main_wrap .footer_wrap .footer_txt1 {color:#666; text-align: center; font-size: 12px; padding-left: 20px; padding-right: 20px; box-sizing: border-box; word-break: keep-all;}
    .main_wrap .header_wrap .titles img {height:40px; margin-top: 15px;}
    
    /*.sub_wrap .content_wrap .content_wrap_abs {}*/
    .sub_wrap .content_wrap .inner {position: absolute; top:50%; left: 50%; transform: translate(-50%, -58%)}
    .main_wrap .content_wrap .content_wrap_abs {width: 100%; padding-top: 155px;}

    .main_wrap .footer_wrap {position: fixed; padding-top: 20px; background-color: #131222; z-index: 100; bottom:0px;}
    .main_wrap .content_wrap {padding-bottom: 103px;}
}