@charset "UTF-8";

@import url("contents_pc.css");

@media only all and (max-width: 1023px) {
	.span-br {
		display: inline;
	}

	.span-mobile-br {
		display: block;
	}

	.word-type01 {
		font-size: 1.083rem;
		line-height: 1.917rem;
	}

	.word-type01 + .word-type01 {
		margin-top: 1.875rem;
	}

	.contents-area {
		margin-bottom: 2.5rem
	}

	.contents-box {
		padding-left: 1.538rem;
		margin-bottom: 1.25rem;
	}

	.title-type01 {
		margin-bottom: 0.625rem;
		padding-left: 2rem;
		font-size: 1.583rem;
		line-height: 2rem;
	}

	.title-type01:before {
		width: 0.75rem;
		height: 0.75rem;
		margin-top: -0.7083rem;
		border: 0.3333rem solid #e63c3c
	}


	.title-type02 {
		margin-bottom: 0.125rem;
		padding-left: 1.417rem;
		font-size: 1.125rem;
		line-height: 1.625rem;
		background-size: 1.167rem 1.167rem;
	}


	/* 표 */
	.table-type01 table thead th {
		padding: 0.8333rem 0;
		font-size: 1.083rem;
		line-height: 1.5rem;
		word-break: break-all;
	}

	.table-type01 table tbody th,
	.table-type01 table tfoot th,
	.table-type01 table tfoot td {
		padding: 0.8333rem 0;
		font-size: 1.083rem;
		line-height: 1.5rem;
		word-break: break-all;
	}


	.table-type01 table tbody td {
		padding: 0.8333rem;
		font-size: 1.083rem;
		line-height: 1.5rem;
		word-break: break-all;
	}

	.images-box > .pc {
		display: none;
	}

	.images-box > .mobile {
		display: block;
	}

	.images-box > img + img {
		margin-top: 0.5rem
	}

	.images-box.mt25 {
		margin-top: 1.042rem !important
	}


	.ul-list01 > li {
		padding-left: 0.8333rem;
		margin-bottom: 0.3333rem;
		font-size: 1.083rem;
		line-height: 1.333rem;
	}

	.ul-list01 > li:after {
		top: 0.625rem;
		width: 0.2083rem;
		height: 0.2083rem;
	}

	/* 센터 안내 */
	.center-slogan-wrapper > p {
		font-size: 1.25rem;
		line-height: 1.833rem;
		letter-spacing: -0.5px;
	}


	/* 프로그램 */
	.process-wrapper > dl {
		float: none;
		width: 100%;
		height: auto;
	}

	.process-wrapper > dl > dt {
		height: 3.75rem;
		padding-top: 1.042rem;
		font-size: 1.333rem;
		line-height: 1.833rem;
	}
	.process-wrapper > dl > dd {
		height: auto;
		border-top: 0;
		padding: 0.9583rem 1.25rem;
	}

	.process-wrapper .arrow {
		float: none;
		width: 100%;
		margin: 5% 0;
		height: 1.667rem;
		background-image: url(../img/sub05/btn_arrow_next01_mobile.png);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center center;
	}

	/* Responsive table */
	.horizontal-scroll {
		position: relative;
		width: 100%;
		overflow-y: hidden;
		overflow-x: auto;
		background:
				linear-gradient(to right, rgba(0, 0, 0, .15), rgba(0, 0, 0, 0)) no-repeat 0 0 / 20px 100% scroll,
				linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, .15)) no-repeat 100% 0 / 20px 100% scroll;
	}

	.horizontal-scroll table {
		width: 50rem;
		background:
				linear-gradient(to right, #fff, rgba(255, 255, 255, 0)) no-repeat 0 0 / 80px 100% local,
				linear-gradient(to right, rgba(255, 255, 255, 0), #fff) no-repeat 100% 0 / 80px 100% local;
	}

	.horizontal-scroll::-webkit-scrollbar {
		width: 6px;
		height: 6px;
		border-radius: 6px;
		background-color: rgba(0, 0, 0, 0.05);
	}

	.horizontal-scroll::-webkit-scrollbar-thumb {
		border-radius: 6px;
		background-color: rgba(0, 0, 0, 0.25);
	}

	.horizontal-scroll table thead th {
		background-color: rgba(131, 164, 186, .15);
	}

	.horizontal-scroll table tbody th {
		background-color: rgba(161, 161, 161, .15);
	}

	.horizontal-scroll table tbody td,
	.horizontal-scroll table tfoot td {
		background-color: rgba(255, 255, 255, .15);
	}


	/* 찾아오시는 길 */
	.map-wrapper {
		height: 16.67rem !important;
	}

	.contact-wrap {
		margin-top: 2.308rem;
	}

	.contact-wrap li {
		padding: 1.154rem 1.538rem;
	}

	.contact-wrap li > img{
		width: 15%;
		vertical-align: middle;
	}

	.contact-wrap li > dl{
		margin-left: 10%;
		width: 70%;
		vertical-align: middle;
	}

	.contact-wrap li > dl dt{
		font-size: 1.231rem;
		line-height: 1.615rem;
		margin-bottom: 0.3846rem;
	}

	.contact-wrap li > dl dd{
		font-size: 1rem;
		line-height: 1.385rem;
	}


	/* 행사일정 */
	.schdule-area .schdule-yymm-area {
		position: relative;
		margin-bottom: 1.25rem;
		padding-right: 7.5rem;
	}

	.schdule-area .schdule-yymm-area:after {
		content: "";
		clear: both;
		display: block;
	}

	.schdule-area .schdule-yymm-area select {
		float: left;
		width: calc(50% - 0.2083rem);
		height: 2.5rem;
		border: 1px solid #d2d2d2;
		font-size: 1rem;
		background-position: 95% center;
	}

	.schdule-area .schdule-yymm-area select:nth-child(2) {
		float: right;
	}

	.schdule-area .schdule-yymm-area input[type="submit"] {
		position: absolute;
		top: 0;
		right: 0;
		display: block;
		width: 7.083rem;
		height: 2.5rem;
		line-height: 2.5rem;
		font-size: 1rem;
		border-radius: 0.125rem;
		color: #fff;
	}

	.calendar-area {
		margin-bottom: 2.5rem;
	}

	.calendar-area table thead th {
		height: 2rem;
	}


	.calendar-area table tbody td {
		height: 6.375rem;
		padding: 0.4167rem;
	}

	.calendar-area table tbody td .word-schdule {
		font-size: 0.8333rem;
		line-height: 1rem;
	}

	.calendar-area table tbody td .word-schdule a {
		margin-top:  0.2083rem;
	}

	.schdule-list-area {
		padding: 1.875rem 1.875rem 1.25rem 1.875rem;
	}

	.schdule-list-area li {
		margin-bottom: 0.625rem;
	}

	.schdule-list-area li a {
		padding-left: 0.875rem;
		font-size: 1rem;
	}

	.schdule-list-area li a:after {
		top: 0.3333rem;
		width: 0.25rem;
		height: 0.25rem;
	}



	.layerpopup-schdule-info-area .layerpopup-schdule-info-box {
		width: calc(100% - 1.667rem);
		margin-top: 0;
		margin-left: 0;
		background: #fff;
		padding: 2.5rem;
		transform: translate(-50%, 0);
	}

	.layerpopup-schdule-info-area .layerpopup-schdule-info-box h2 {
		font-size: 1.25rem;
		line-height: 1.5rem;
		padding-bottom: 0.8333rem;
	}

	.layerpopup-schdule-info-area .layerpopup-schdule-info-box dl {
		padding-left: 5.417rem;
		padding-top:0.8333rem;
		padding-bottom: 0.8333rem;
		font-size: 1rem;
		line-height: 1.25rem;
	}

	.layerpopup-schdule-info-area .layerpopup-schdule-info-box dl dt {
		position: absolute;
		top: 0;
		left: 0;
		padding: 0.8333rem; 0;
	}


	.layerpopup-schdule-info-area .layerpopup-schdule-info-box .btn-close {
		margin-top: 0.8333rem;
		width: 3.75rem;
		height: 2.25rem;
		line-height: 2.25rem;
		font-size: 1rem;
	}

	.btn-advice-application {
		display: block;
		margin-bottom: 1rem;
		max-width: 100%;
		height: 5.625rem;
		border-radius: 3.75rem;
		padding-left: 2.708rem;
		padding-right: 2.292rem;
		box-sizing: border-box;
	}

	.btn-advice-application > img {
		height: 5.625rem;
		margin: 0 auto;
	}
}

@media only all and (max-width: 767px) {
	.calendar-area {
		display: none;
	}


	.btn-advice-application {
		padding: 0;
		height: 5rem;
		border-radius: 2.5rem;
	}

	.btn-advice-application > img {
		height: 5rem;
		margin: 0 auto;
	}
}