

/* 
*PC (가로폭 1024px 이상): @media only screen and (min-width:1024px)		화면가로폭이 최소 1024PX는 되는 장치
*태블릿 (가로폭 728~1024px): @media only screen and (min-width:728px) and (max-width:1024px) 화면가로폭이 최소728PX에서 최대 1024PX 되는 장치
*모바일 (가로폭 728px 미만): @media only screen and (max-width:728px)	화면가로폭이 최대 728PX 밖에 안되는 장치

위 3가지 중, PC가 아닌 장치(1024미만)에서는 운영시간표를 아예 표시하지 않도록 처리. 그 기능을 위젯에 CSS로 장착하였다.
PC를 제외한 태블릿&모바일 에서 실행되게 하기 위해서 max-width:1024px 로 지정하였다.
*/
/* @media only screen and (max-width:728px) {
	#konz_id_div_CharacterLogo {
		display: none;
	}
} */

#konz_id_div_CharacterLogo {
	margin: 0 auto;
	padding: 0 auto;
	text-align: center;
	/* width: 100%; */
	width: 200px;
	height: 220px;
}


#konz_id_div_CharacterLogo_ImgDiv {
	margin: 0 auto;
	text-align: center;
	width: 100%;
	height: 100%;	
	/* width: 200px;
	height: 230px; */
	box-sizing: border-box;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
}

/* 2020-12-20: 이미지 넘침 문제 해결
가로폭이 좁아졌을 때(태블릿이나 모바일 사용 시), 이미지 크기가 그대로라서 다른 div에 의해 가려버리는 문제 발생한다.
그 때문에, 가로폭이 좁아지면, 그에 따라서 div 자체의 width가 자동으로 줄어들고, 그에 맞춰서 이미지 비율이 그대로 유지되는 범위 내에서
ImgDiv 가 줌아웃되는 방식으로 축소되는 기능을 구현하였다.
ImgDiv의 상위 div는 width, height 을 고정된 값으로 선언하였고, 그 아래에 있는 ImgDiv는 가로 세로를 모두 100%로 선언하였으므로,
평소에는 그 속에 꽉 차있게 된다.
그러다가 가로폭이 점점 줄어들면 부모div의 가로폭이 감소하게 되는데, 그에 비례하여 가로가 100%인 ImgDiv도 가로 크기가 줄어들게 된다.
그 안에 no repeat으로 contain으로 배경이미지를 선언하였으므로, 비율을 유지한 상태로 이미지가 축소하게 된다.
물론 그래도 문제점은 남아 있다. ImgDiv는 줄어들지만 각각의 세로폭은 그대로가 유지되기 때문이다. 이 문제를 해결하기 위해서는 padding-top을 설정해야되는데
그 과정이 복잡하고 굳이 그정도는 필요 없으므로 여기까지 개발하였다.
*/