html {font-size: 62.5%;} /*10px = 1rem*/
    html, body {height: 100%; margin: 0; padding: 0; font-family: 'Pretendard', 'Malgun Gothic', dotum, sans-serif;}
    p, h1, h2 {margin: 0; padding: 0; word-break: break-all;}
    a {text-decoration: none;}

    .intro_wrap {width: 100%; height: 100%; position: relative;}

    .intro_logo {margin-left: 30px; margin-top: 20px; position: absolute; z-index: 999;}

    .intro_wrap > div {float: left;}
    .intro_wrap:after {clear: both; content: ''; display: block;}

    /* 광역지원센터 배경 */
    .jbsos {
        position: relative;
        width: 50%;
        height: 100%;
        background: url('../img/intro/intro_bg1.jpg') center no-repeat;
        background-size: cover;
        transition: width 0.3s ease; /* 애니메이션 효과 추가 */
    }

    /* 광역지원센터 하단배경색 */
    .sos_bg {
        width: 100%;
        height: 210px;
        display: table;
        position: absolute;
        z-index: 999;
        bottom: 0;
        background-color: rgba(5, 73, 199, 0.9);
    }
	.sos_bg:focus, .sos_bg:active {background-color: rgba(5, 73, 199, 0.9) !important;}

    .sos_bg > p,
    .hope_bg > p {position: absolute; right: 5%; top: 40%;}

    .sos_bg > div,
    .hope_bg > div {display: table-cell; vertical-align: middle; text-align: center;}

    .sos_tit,
    .hop_tit {font-size: 4rem; letter-spacing: -0.02em; font-weight: 700; color: #fff;}

    .sos_bg span {color: #00fff6;}
    .sos_bg span,
    .hope_bg span {margin-top: 10px; display: block; font-size: 1.8rem; font-weight: 300;}

    /* 희망센터 배경 */
    .jbhop {
        position: relative; 
        width: 50%; 
        height: 100%; 
        background: url('../img/intro/intro_bg2.jpg') center no-repeat; 
        background-size: cover;
    }

    /* 희망센터 하단배경색 */
    .hope_bg {
        width: 100%; 
        height: 210px; 
        display: table; 
        position: absolute; 
		z-index: 999;
        bottom: 0; 
        background-color: rgba(0, 153, 73, 0.9) !important;}
 
.hope_bg:focus, .hope_bg:active {background-color: rgba(0, 153, 73, 0.9) !important;}


    .hope_bg span {color: #63ff57;}

    /* 비디오 컨테이너 스타일 */
    .video-container {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 998;
        display: none; /* 비디오 초기 상태 숨김 */
		background-size:cover !important;
    }

    /*.video-container iframe {
        width: 100%;
        height: 100%;
        border: none;
    }*/


.video-container iframe{
  top: -60px;
  left: 0;
  width: 100%;
  height: calc(100% + 120px);
}


div {
  -ms-overflow-style: none; /* for Internet Explorer, Edge */
  scrollbar-width: none; /* for Firefox */
  overflow-y: scroll; 
}
div::-webkit-scrollbar {
  display: none; /* for Chrome, Safari, and Opera */
}


    /* 태블릿 */
    @media all and (max-width:1200px) {
        html {font-size: 50%;}
        .intro_logo img {width: 290px;}
        .sos_bg, .hope_bg {height: 180px;}
        .sos_bg > p img, .hope_bg > p img {width: 32px;}

		.intro_wrap > div {float: none;}
        .jbsos {width: 100% !important; height: 50%;}
		.jbhop {width: 100% !important; height: 50%;}
        .sos_bg > p, .hope_bg > p {display: none;}
	 .video-container {display: none !important;}
    }




    /* 모바일기기 + 태블릿 */
    @media all and (max-width:768px) {

        html {font-size: 45%;}
        .intro_logo img {width: 255px;}
        

}


    /* 모바일기기2 */
    @media all and (max-width:320px) {
        html {font-size: 40%;}
    }