@media screen and (max-width: 803px){

	#header {width: 100%; height:60px; background-color: #fff; border-bottom: 1px solid #efeff4; display: block; }
	.gnb { padding: 12px 20px 0px 20px; position: relative;}
	.logo { width:calc(25vw); height: auto; display: inline-block; object-fit: contain;}
	.logo img { 
		max-width: 140px;  
		object-fit: contain!important; 
		margin-top: -10%; 
	}
	
	.slider_wrap .arrow_btn {display: none;}

	.gnb_btn { visibility: hidden;}
	#gnb_nav {display: none;}
	.mobile-nav-toggle {}
	
		/* 이미지 체크박스 */
	.mobile_menu {display: inline-block;}
	
	.mobile_menu input[type=checkbox]{
		display: none;
	}
	.mobile_menu input[type=checkbox]+label{
		background-image: url('../img/menu-open.svg');
		background-repeat: no-repeat;
		background-size: 2em;
		position: absolute; right:15px; top: 13px; cursor: pointer;  width: 2em; height:2em;
	}
	.mobile_menu input[type=checkbox]+label>span{
		font-weight: bold;
	}
	.mobile_menu input[type=checkbox]:checked+label{
		background-image: url('../img/menu-close.svg');
		z-index: 10;
		position: absolute; right:10px; top: 9px;
		width: 2.7em; height: 2.7em;
		background-size: 2.7em;
	}
	/* 메뉴 목록*/
	.mobile_menu .menuitems{
		display: none;
	}
	
	.menuitems p {
		position: fixed;
		bottom: 20px;
		left: 50%; transform: translateX(-50%);
		opacity: 0.5;
		color: #666;
	}
	.menuitems p img {
		width: 8em;
		
	}
	.mobile_menu .menuitems{
		list-style: none;
		position: fixed; 
	  overflow: hidden;
	  top: 0;
	  right: 0;
	  left: 0;
	  bottom: 0;
	  background: rgba(0, 0, 0, 0.6);
	  transition: 0.3s;
	    z-index: 3;
		
	}
	.mobile_menu .menustyle {
		display: block;
	  position: absolute;
	  top: 60px;
	  right: 15px;
	  left: 15px;
	  bottom: 15px;
	  background-color: #F7F7F7;
	  overflow-y: auto;
	  transition: 0.3s;
		padding: 30px 10px;
		font-size: 1.2em;
		font-weight: 600;
		border-radius: 10px;
	}
	
	.mobile_menu .menustyle i {
		opacity: 0.4;
		margin-right: 16px;
		
	}
	.mobile_menu .menustyle img.icon {
		width: 19px;
		margin-right: 14px;
		margin-top: -3px;
		display:inline-block;
		vertical-align: middle
	}
	.mobile_menu .menuitems li{
		margin: 0.5em;
		padding: 1em 2em;
	  color: #222;
		background: #fff;
		border-radius: 4px;
		
	}
	.mobile_menu .menuitems li a{
		text-decoration: none;
		display: block;
		font-weight: 300;
	}
	.mobile_menu .menustyle .nav{
    overflow: hidden;

	}
	.mobile_menu .menustyle .btn{ font-weight: 500; color: #454d55;
    display: block;
    position: relative;

	}
	.mobile_menu .menustyle .subMenu{
    overflow: hidden;
    transition: max-height 0.7s;
    max-height: 0;
	}
	.mobile_menu .menustyle .subMenu a{
    display: block;
    padding: 12px 35px;
    color: #343a40;
    font-size: 0.8em;
    position: relative;
	border-radius: 10px; 
		font-weight: 700;
	}
	.mobile_menu .menustyle .subMenu a:after{
    content: '';
    opacity: 0;
    transition: opacity 0.3s;
	}
	
	.mobile_menu .menustyle .subMenu a:hover{
    background: #f7f7f7;
   transition: all 0.3s;
	}
	.mobile_menu .menustyle .subMenu a:last-child{
		border:none;
	}
	.mobile_menu .menustyle .nav:target .subMenu{
		max-height: 100em;
	}
	
	
	
	/* 메뉴 펼침 - 체크박스 체크되면 메뉴목록 표시 */
	.mobile_menu input[type=checkbox]:checked~.menuitems{
		display: block;
	}
	


	
	
	.slider_wrap { max-height:80vw; padding:1em 0 3em 0;}
	.slider_wrap .container {
		padding-left: 10px;
	}
	.slider_wrap .container div {display:flex;justify-content: center; align-items: center; height:100%; width:0;}
	.slider_wrap .container img {height:auto; width:100%;}
	.container .mobile {min-width:calc(100vw - 35px)}

	#banner_focus {min-width:calc(100vw - 50px)}

	
	.banner {min-width: 320px;}
	.banner_focus {min-width: 320px;}
	.bullets{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 1.5em;
    z-index: 2;
	}

	.bullets input[type="radio"] + label span {display: inline-block;
    border-radius: 50%;
    background-color: rgba(34,34,34,0.15);
    width: 0.5em;
    height: 0.5em;
	margin:0 0.2em;
    cursor: pointer;}
	.bullets input[type="radio"]:checked + label span {background: #222; color: #222;}

	.container i,
	.todaysong_page i {display: none}
	.todaysong_bg h2 {font-size: 1.4em; }
	.todaysong_bg h2 .hot, .todaysong_bg h2 .new  {font-size: 0.71em;}
	
	#today_song {
		
	}
	
	#service_btn .container { grid-template-columns: 1fr 1fr ; grid-template-rows: repeat(3, minmax(170px, auto)); grid-column-gap: 10px;grid-row-gap: 10px; -ms-grid-columns: 1fr 10px 1fr;	width: calc(100% - 40px); height:auto;	-ms-grid-rows:170px 10px 170px 10px 170px; }
	#service_btn { padding: 3em 0 100px;}  
	#service_btn #zillersong { display: none;	}
	#service_btn #zillerting { display: none;	}
	#service_btn .youtube { grid-column: 2; grid-row: 1;-ms-grid-column: 3; -ms-grid-row: 1;}
	#service_btn .ticketshop { grid-column: 1; grid-row: 2; -ms-grid-column: 1; -ms-grid-row: 3;}
	#service_btn .tjshop {
		
		grid-column: 2;
		grid-row: 2;
		-ms-grid-column: 3;
		-ms-grid-row: 3;
	}
	#service_btn .songrequest {
		grid-column: 1;
		grid-row: 1;
		-ms-grid-column: 1;
		-ms-grid-row: 1;
	}
	#service_btn .ticketshop .detail, #service_btn .tjshop .detail, #service_btn .songrequest .detail { display: none;}
	#service_btn .ticketshop .title, #service_btn .tjshop .title, #service_btn .songrequest .title, #service_btn .youtube .title {font-family: TJJoyofsingingL;}
	#service_btn .cs {
		grid-column: 1 / 3;
		grid-row: 3;
		-ms-grid-column: 1;
		-ms-grid-column-span: 3;
		-ms-grid-row: 5;
		-ms-margin-top: 10px;
	}
	
	#service_btn .cs .number {	
		padding: 0.5em 0 0.41em;	
		font-size: 1.2em;	
		font-weight: 600; 
		color: #fff!important;
	}
	
	#service_btn .cs img.clock {
		display: none;
	}
	#service_btn .cs .time img.clock_mobile {
		width: 20px;
		display: inline;
		vertical-align:sub;
		margin-right: 2px;
	}
	#service_btn .cs .time .bi-clock-fill {
		font-size: 0.9em;
		color: #222;
		filter: drop-shadow(0px 0px );
		display:inline;
	
	}
	#service_btn .cs .time {margin-top: -1em;	float: left; 	font-size: 1em;	padding-top: 0.5em; font-weight: 600	}
	
	#service_btn .cs .time:after {	margin:10px 0 10px ;}
	#service_btn .cs .detail {	font-size: 0.75em;	font-weight: 300; }
	#service_btn .cs .btn_cs {
		display: none;
	}
	
	#btn_cs_mobile {
		padding: 0.9em 2.2em;
  border-radius: 2em;
  background-color: #222; 
	color: white;
	font-size: 1.1em;
		font-weight: 600;
	display: block;
		width: 55%;
		margin:0 auto;
		margin-top: 1.5em;
		text-align: center;
	}
	#btn_cs_mobile img {
		width: 18px;
		vertical-align: bottom;
		margin-right: 6px;
	}
	
	#btn_cs_mobile .fa-envelope {
	font-size: 1.1em;
	margin-right: 10px;
	color: white;
}
	#service_btn .cs .time {

		width: 100%;
	}
	
	

	#service_btn .youtube, #service_btn .ticketshop, #service_btn .tjshop, #service_btn .songrequest {
		width: 202px;
		height: 202px;
	}
	
	#main_notice {
		display: none
	}

	#footer_inner {width: 90%; margin: 0 auto}
	.footer_inner #mobile {
		display: inline;
	}
	
	.footer_inner .mobile_menu {width: 100%; margin-top: 1em;  word-break: keep-all;}
	.footer_inner .mobile_menu a { display: inline-block; line-height: 2.5; position: relative;	margin: 0 0.3em;	letter-spacing: -0.1em; font-weight: 300; font-size: 0.95em;}
	.footer_inner .mobile_menu:after {width: 100%; content: ''; display: inline-block}
	.footer_inner .mobile_menu a:first-child {
		margin: 0 0.3em 0 0;
	}
/* .footer_inner .mobile_menu a:after {
	content: '';
	position: absolute;
	top: 11px;
	margin-right:30%;
	width: 2px;
	height: 2px;
	background: #222;
	border-radius: 2px;
	display: inline-block;
} */
	.footer_inner .copyright {position: absolute; bottom: -1.5em;}
	.footer_inner .mobile_menu .dot {margin: 0; width: auto}

	.footer_inner .mobile_menu a:last-child:after {
		display: none;
	
	} 
	
	.footer_inner .tjlicense,
	.footer_inner .menu,
	.footer_inner .btn,
	.footer_inner p {
		display: none;
	}
	
	.footer_inner .bi-arrow-up-circle-fill { }
	.footer_inner .mobile_menu .family-site  { margin-left: 2px; margin-bottom: 8px; }
	
	.subbg {padding-bottom: 10em; padding: 0 20px 37px;} 
	.whiteBG {margin: 0 -20px;}
	.find_container {width: 100%;  margin: 0 auto; }

	.common_tab_menu { background: #fff;  
    display: -ms-flexbox;
    display: flex;
    overflow:hidden;
    position: relative;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 45px;
    padding: 0 5px;
    margin: 0 -20px;
    white-space: nowrap;
    border-bottom: 1px solid #f0f0f1;}
	 
	.common_tab_item { font-size: 17px;
   display: inline-block;
    position: relative;
    padding: 0 15px;
    line-height: 42px;
    color: #777;
    text-align: center;
		width: 100%;
		margin-right: 0px;
		font-weight: 300;

	}
	.common_tab_item[aria-selected=true] {
    font-size: 18px;
}

	.common_tab_item[aria-selected=true]:after {
   position: absolute;
    right: -1px;
    bottom:0px;
    left: 0;
    z-index: 1;
    border-bottom: 3px solid #ff4a2b;
    border-radius: 3px;
    content: '';	
}
	
	.common_tab_item:before {
		content: '';
		display: inline-block;
    position: absolute;
    top: 46%;
    left: -1px;
    width: 1px;
    height: 18px;
    margin-top: -7px;
    background-color: #f0f0f1;
	}
	.common_tab_item:first-child:before {display: inline-block;
    display: none;
		content: ''}
	
	
	.subtitle {width: 100%;  margin: 0 auto; position: relative; padding:0 ; margin-bottom: 0px;}
	.subtitle > p {display: none}
	.subtitle p.install {font-size: 0.4em; margin-top: 0;  text-decoration: underline; text-underline-offset: 4px; cursor: pointer; font-weight:600; }
    .subtitle p.install i { margin-right: 5px; }
	
	.subtitle .left {width: 100%; margin: 0 auto;text-align: left; display: block; font-size: 2.3em; font-weight: 700; color: #343a40; line-height: 1.4; text-align: justify; padding-top: 45%; word-break: keep-all; word-wrap: break-word;}
	.subtitle .left .title .song {display: block;width: 80%; height: auto; margin: 0;}
	.subtitle .left .title .ting {display: block;width: 70%; height: auto; margin: 0;}
	.subtitle .left .title .youtube {display: block;width: 80%; height: auto; margin: 0;}
	.subtitle .left .title .mobile {display: block;width: 70%; height: auto; margin: 0;}
	
	.subtitle .left .title { width: 100%; }
	.subtitle .left .small {font-size:0.45em;  margin-top: 3%; }

	.subtitle .down_img { display: block;width:100%; float: none; margin-top: -8%; transform: none !important; perspective: none !important; }
	.subtitle .up_img { display: block;width:100%; float: none; margin-top: 3%; transform: none !important; perspective: none !important; }
	.subtitle .song, .subtitle .ting, .subtitle .youtube1, .subtitle .youtube2, .subtitle .and, .subtitle .ios {width: 100%; font-size: 0.4em; display: block; margin-top:3%;}
	.subtitle .buttonM, .subtitle .youtube1, .subtitle .and {margin-top: 50px; }
	.subtitle .ting, .subtitle .youtube2, .subtitle .ios {margin-bottom: 5em;}
	
	.subtitle .song {display: none}
.subtitle .buttonM {display: block; width:100%; height: 52px; margin-top: 50px; border-radius: 4px; color: #fff; font-size: 0.4em; margin-bottom: 15%;}
	.subtitle .orange {background: #ff4a2b; }
	.subtitle .purple {background: #8737ff; }
	
	
	.service_intro {	grid-template-columns:1fr; -ms-grid-columns: 1fr; grid-column-gap: 10px;
	grid-row-gap: 10px;grid-auto-rows: minmax(auto);}
	
	.service_intro .description { font-weight: 300;
  line-height: 26px;

}
	.service_intro .title {
  margin-bottom: 1px;
  font-size: 1.4em;
}
	.service_intro .song-box1 { -ms-height: auto;
	-ms-grid-column: 1;
    -ms-grid-row: 1;
	grid-column: 1;
    grid-row: 1;}
.service_intro .song-box2 {

	-ms-grid-column: 1;
    -ms-grid-row: 3;
	grid-column: 1;
    grid-row: 2;}
.service_intro .song-box3 {
	-ms-grid-column: 1;
    -ms-grid-row: 5;
	grid-column: 1;
    grid-row: 3;}
.service_intro .song-box4 {
	-ms-grid-column: 1;
    -ms-grid-row: 7;
	grid-column: 1;
    grid-row: 4;}
	
	.service_intro .ting-box1 { -ms-height: auto;
	-ms-grid-column: 1;
    -ms-grid-row: 1;
	grid-column: 1;
    grid-row: 1;}
.service_intro .ting-box2 {
	-ms-grid-column: 1;
    -ms-grid-row: 3;
	grid-column: 1;
    grid-row: 2;}
.service_intro .ting-box3 {
	-ms-grid-column: 1;
    -ms-grid-row: 5;
	grid-column: 1;
    grid-row: 3;}
	
	.service_intro2 .title, .service_intro3 .title {font-size: 1.3em; font-weight: 600;  line-height: 2; color: #343a40;}
	.service_intro2 .number, .service_intro3 .number {width: 26px; padding-top: 3px; margin-right: 0.5em; vertical-align:text-top }
	.service_intro2 .content, .service_intro3 .content {font-weight: 300;}

	.service_intro3 .route { display: block; width: 100%;margin: 0 auto; }
	.service_intro3 .top { font-size:1em; color: #454d55;  font-size: 1.1em; margin-bottom: 5%; }

	.service_intro3 .left {width:100%; margin: auto; padding-bottom: 4em;}
	.service_intro3 .route ul { width:100%; margin-bottom: 20%; margin-top: -0.5em;}
	.service_intro3 .left img {width: 100%;}
	
	.legend_detail { width: 90%; margin: 3em auto;	padding: 2em 1.5em; line-height: 1.8; font-size: 16px; }
	.legend_detail p {margin: 1em 0; background: rgba(63,205,199,0.08); padding: 1em; line-height: 2; }
	.width1030 .right { float: none;width: 95%; height: auto;  top: -2em;}

	.mobile_content {width: 100%; display: block; text-align: justify}
	.wp-block-quote { font-size: 0.85em; line-height: 1.8;width: 96%; padding-left: 14px; border-left: 4px solid #454d55;}
	.intro_qrbox {width: 100%; display: block; padding:30px 16px 10px 16px; }
	.intro_qrbox .qr {margin: 0 auto 20px auto; width: 50%; float: left;}
.intro_qrbox .qr .code { border-radius: 6px; border: 10px solid #F6F8FA; width: 70%; height: auto;}
.intro_qrbox .qr .icon {width: 18px; vertical-align:sub; margin-top: 10px;}
.intro_qrbox .qr .title {color: #343a40; font-size: 0.9em; letter-spacing: -1px;}

	
	.intro_tv header {margin: 6em 0; padding-bottom: 2em; }
	.intro_tv header h2 {font-size: 1.5em; top: 105%;  width: calc(100% - 20px); }
.intro_tv header span.small {display: none}
	.tv_imgbg {margin: 0 auto; width: 150%; text-align: center; margin-left: -25%; overflow: hidden;}
	
	.intro_tv2 .intro_tv_title blockquote.wp-block-quote {width: calc(100% - 45px); font-size: 0.9em;  margin:5em 0 0 15px; }
	.intro_tv2 .intro_tv_title blockquote span.small {font-size: 15px; font-weight: 300; letter-spacing: -0.3px;  text-align: justify}

	
	.history {width: 100%;  margin: 0 0 0 0; padding-bottom: 2em;}
	.history:last-child { padding-bottom: 10em;}
		.history .left {width: 100%;  text-align: center;    margin: 3em 0 2em; 0; }
	.history .left .ktlogo {width: 12%; height: auto; padding-top: 0.5% }
.history .left .btvlogo {width: 14%; height: auto;}
.history .left .upluslogo {width: 17%; height: auto;}
.history .left .skylifelogo {width: 24%; height: auto;}
.history .left .lghellologo {width: 29%; height: auto;}
.history .left .hyundailogo {width: 29%; height: auto; margin-top: 20px;}
.history .left .dlivelogo {width: 25%; height: auto;}

	.history .right { width: 100%;     float: left;     }
.history .right ul.tv-history {      width: 100%; 
    float: left;
    margin: 0; }

	.history .right ul.tv-history > li {   width: 100%;
    height: 7em !important;
    margin: 0;
    padding: 27px 0;
    font-size: 0.875rem;
    display: block;
    float: left;
		border-top: 1px solid #ECEDEE; 
	}
	
	.history .right ul.tv-history p.table_logo {
		width:31%;
		max-width: 180px;
		margin:0.8% 0 0 15px;
		vertical-align:bottom;
		font-weight: 500;
		display: block;
		float: left;
		}
	
	.history .right ul.tv-history p.table_logo img {width: 100%; height: auto; object-fit: contain; }
	.history .right ul.tv-history > li > span {display:inline-block; text-align: center; padding: 12px 0; border-radius: 20px;
    width: 40%;    margin: 0 15px 0 0; float: right;
    font-weight: 600; border: 1px solid rgba(52,58,64,0.2); color: #454d55; line-height: 16px; font-size: 1.1em; }
	
	.history .right ul.tv-history .ppoyoCh {width: 25%; margin:0; }
	.history .right ul.tv-history p.table_logo .ikoo {width: 85%; margin-top:-7%;}
	.history .right ul.tv-history li img.coin {width: 135%; margin-left:0;}

	.event_list .event_item {width:calc(100% - 10%); padding:30px 15px;}
	.event_list .event_thumb {display: table}
	.event_list .event_thumb_image {display: table-cell; vertical-align: middle;}
	.event_list .event_info {font-size: 0.9em; font-weight: 300; }
	
	.event_detail { padding:3em 1.5em;word-break : keep-all; margin: 2.7em 0 4em 0; }
	.event_detail h2 {font-size: 1.5em}
	.event_detail .event_info {font-size: 0.8em; font-weight: 300; }
	.event_detail .contents {font-size: 0.95em; line-height: 1.8em; }
	.event_detail .btn_join {width: 80%; margin-left: 10%; margin-top: 4em;}
	.event_detail .contents img {margin-bottom: 1em;}

	
	h2.mobile { margin-top: 1.5em; font-size: 2em; text-align: left}
	.company_intro { background-position: 55% bottom; padding: 3em 2em; color: #fff; line-height: 1.7; opacity: 0.9;  text-shadow : 0px 0px 5px #000; border-radius: 6px; word-break:keep-all; margin-top: 3em;}
.company_intro strong {font-size: 1.6em; font-style:normal; font-weight: inherit}


	table.company .list {line-height: 1.6; }
	table.company .list tr { 
    border-bottom: none;
		display: block;
		padding: 10px 0;
}
	table.company .list th {
		float: left;
    clear: left;
    width: 100%!important;
        display: block;
    padding: 10px 3% 0;
    background: none;
    text-align: left;
		box-sizing: border-box;
		font-weight: 600;
		border-bottom: none;
		font-size: 1em;
	}
	
	table.company .list td {
    display: block;
    float: left;
    clear: left;
    width: 100%;
    padding: 0 3% 10px;
    box-sizing: border-box;
		font-weight: 300;
	border: none;
		font-size: 0.95em;
		word-break: keep-all;
}
	
	table.company .list tr:after {
    display: block;
    clear: both;
    content: ".";
    visibility: hidden;
    height: 0;
}
	
	article.content .right {  display: none;}
	article.content h3 {width:100%; font-size: 1.4em;display: block;}
	article.content h3 span {display: none}

	article.content .btn_login {width: 100%;  margin-left: 0;}
	article.content .legend_detail {width: 100%; margin: 3em 0;}
	article.content .legend_detail strong {font-size: 1.1em;}
	article.content p.mobile-text {font-size: 0.95em; font-weight: 300;}
	
	
	iframe.mobile {margin-bottom: 4em;}
	.footer_notice {padding: 2em 0 4em 0;}
	.footer_notice .mobile-hide {display: none;
    visibility: hidden;
    width: 0%;}
    .currentEvent .mobile-hide, .expiredEvent .mobile-hide {display: none; visibility: hidden; width: 0%; }
	
.footer_notice .common_table .list {
position: relative;
  border-radius: 0;
	background: #fff;
	line-height: 1;

   }
	.footer_notice .common_table .mobile-title {
		width: 100%!important;		
        display: block;
		box-sizing: border-box;
		border-radius: 0;
		font-size: 1em;
		word-break: keep-all;
		padding: 4% 20px 0 20px;
		line-height: 1.5;
	}
	
	.footer_notice .common_table .date {
    display: block;
    float: left;
    clear: left;
    width: 100%!important;
    box-sizing: border-box;
		font-weight: 300;
	border: none;
		font-size: 0.9em;
		opacity: 0.5;
		word-break: keep-all;
		padding: 0 20px 4% 20px ;
		text-align: left;
		margin-top: -3%;
		border-bottom: 1px solid rgba(52,58,64,0.06); border-radius: 0;
}
	.footer_notice .common_table td {border-radius: 0;}
	.more-view  {display: block; margin: 1.5em auto; width: 100%; 
    font-size:1.1em;
    font-weight: 300;
    color: #808991;
    text-align: center;
	cursor: pointer;
	    background: #EAECEF;
    border-color: #0e7bc3;
	border-radius: 6px;
	font-weight: 700; padding: 14px 0;
	transition: 0.2s;
}
.more-view:hover {transition: 0.2s; opacity: 0.8;}
	.form-field label {     font-size: 0.9em;  }
.currentEvent .more-view, .expiredEvent .more-view { margin-top:-0.5em; margin-bottom: 5em; }	
	

	
		
		
		
		
	

	
	
	



















}