/* ******************************** */
/* 서브페이지 스타일 */
SECTION > ARTICLE {
	padding: 10rem 2.5rem;
}

/* 모바일 */
@media all and (max-width: 767px) {
	SECTION > ARTICLE {
		padding: 5rem 0.5rem;
	}

}

/* ******************************** */
/* 컨텐츠 */
ARTICLE {
        font-family: 'Noto Sans KR','Malgun Gothic',AppleGothic,dotum,Sans-serif;
		font-size:1.55rem;
}
ARTICLE .b , ARTICLE B , ARTICLE STRONG {
	font-weight:500;
}

ARTICLE .PageTitle {
	font-size:3.8rem;
    font-weight:500;
	text-align:center;
	padding-bottom:5rem;
}
ARTICLE .PageTitle > SMALL {
	display:block;
	font-size:60%;
	color:#aaa;
}
ARTICLE .PageComment {
	text-align:center;
	padding-bottom:10rem;
    color:#555;
}
ARTICLE .PageTitle + .PageComment {
	margin-top:-8rem;
    padding-top:5rem;
}
ARTICLE .PageTitle + .PageComment::before {
	content:'';
	display:block;
	width: 2px;
	height: 40px;
	margin: 0 auto 2rem;
	background-color:#ddd;
}
ARTICLE .PageTitle + H3 ,
ARTICLE .PageTitle + .h3 ,
ARTICLE .PageTitle + .serv_box {
	margin-top:0;
}



@media (max-width: 767px) {
	ARTICLE .PageComment {
		padding:2rem;
	}
	ARTICLE P BR ,
	ARTICLE .PageComment BR {
		display:none;
	}
	ARTICLE .PageTitle {
		padding-bottom:0;
	}

}
ARTICLE {
    overflow:hidden;
}
ARTICLE IMG {
	max-width:100%;
}
ARTICLE P {
	line-height:165%;
}
ARTICLE P + P {
	padding-top:1rem;
}


ARTICLE .SubTitle {
	font-weight:500;
	font-size: 2.5rem;
    margin-top:5rem;

}
ARTICLE > H4 ,
ARTICLE > .h4 {
    margin-top:5rem;
}




UL.Line_disc {
    width: 100%;
    list-style-type: disc;
    list-style-position: inside
}

UL.Line_disc > LI::marker {
    color: #aaa
}

UL.Line_disc > LI {
    margin-top: 1rem;
    border-top: 1px dashed #ccc;
    padding-top: 1rem;
    text-indent: -2.3rem;
    padding-left: 2.3rem
}

UL.Line_disc > LI:first-of-type {
    margin-top: 0;
    border-top-width: 0;
    padding-top: 0
}


UL.Line_disc.Edgeline {
    position: relative;
    width: 100%;
    border: 2px solid #484D61;
    padding: 3rem 3.5rem;
    background-color: #f5f5f5;
    margin-top: 1rem;


    list-style-type: disc;
    list-style-position: inside
}

@media all and (max-width: 1170px) {
    UL.Line_disc.Edgeline {
        padding:2rem 3rem;
    }
}

@media all and (max-width: 767px) {
   UL .Line_disc.Edgeline {
        padding:2rem;
    }
}














.edge_box {
    position: relative;
    width: 100%;
    border: 2px solid #484D61;
    padding: 5rem;
    background-color: #f5f5f5;
    margin-top: 1rem;
    font-size: 1.5rem
}


.edge_box > .edge_box_arrow {
    position: absolute;
    width: 100%;
    height: 2rem;
    top: 0;
    left: 0
}

.edge_box > .edge_box_arrow::before ,
.edge_box > .edge_box_arrow::after {
    position: absolute;
    content: '';
    display: block;
    width: 2rem;
    height: 2rem;
    background-image: url('/imgs/arrow_box.png');
    background-repeat: no-repeat;
    background-size: contain
}

.edge_box > .edge_box_arrow::after {
    right: 0;
    transform: rotate(90deg)
}

.edge_box > .edge_box_arrow ~ .edge_box_arrow {
    top: auto;
    bottom: 0
}

.edge_box > .edge_box_arrow ~ .edge_box_arrow::before {
    transform: rotate(270deg)
}

.edge_box > .edge_box_arrow ~ .edge_box_arrow::after {
    transform: rotate(180deg)
}

@media all and (max-width: 1170px) {
    .edge_box {
        padding:3rem
    }
}

@media all and (max-width: 767px) {
    .edge_box {
        padding:2rem 3rem
    }
}


@media all and (max-width: 1170px) {
	.dzTbl5 TD, .dzTbl5 TH,
	.dztbl5 TD, .dztbl5 TH {
		padding:1rem 0.5rem;
		line-height: 2rem;
	}

}
@media all and (max-width: 767px) {

	.dzTbl5.data-label td::before ,
	.dztbl5.data-label td::before {
		width: 30%;
		padding-right: 1rem;
		font-weight:bold;
	}
	.dzTbl5.data-label td ,
	.dztbl5.data-label td {
		padding-left: calc(30% + 2rem) !important;
	}

	BR.no-mo {
		display:none;
	}
	BR.mo-blank,
	BR.mo-hide {
		position:relative;
		display: inline-block;
		border: none;
		font-size: inherit;
		line-height: inherit;
		height: inherit;
		content: " ";
		width: 0.75rem;
	}
	BR.mo-comma {
		position:relative;
		display: inline-block;
		border: none;
		font-size: inherit;
		line-height: inherit;
		height: inherit;
		content: " ";
		width: 1.5rem;
		padding-right: 1rem;
	}
	BR.mo-comma::after {
		content: ",";
		display: inline-block;
		position:relative;
	}
}








.edge_photo {
	position: relative;
	width:100%;
	height:40rem;
}
.edge_photo::before {

	content:'';
	display:block;
	position:absolute;
	width: calc(100% - 1rem);
	height: calc(100% - 1rem);
	left:0.5rem;
	top:0.5rem;
	border:5px solid rgba(255,255,255,.75);
}
UL.edge_2cell {
	position: relative;
	width:100%;

	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: space-between;
}
UL.edge_2cell > LI {
	position: relative;
	width: calc(50% - 2.5rem);
}

UL.edge_2cell.edge_2cell_l60p > LI:first-of-type {
	width:calc(55% - 2.5rem);
}
UL.edge_2cell.edge_2cell_l60p > LI:last-of-type {
	width:calc(45% - 2.5rem);
}
@media all and (max-width: 1170px) {
	UL.edge_2cell > LI {
		width: calc(50% - 1rem);
	}
	UL.edge_2cell.edge_2cell_l60p > LI:first-of-type {
		width:calc(55% - 1rem);
	}
	UL.edge_2cell.edge_2cell_l60p > LI:last-of-type {
		width:calc(45% - 1rem);
	}
}
@media all and (max-width: 767px) {
	UL.edge_2cell > LI ,
	UL.edge_2cell.edge_2cell_l60p > LI:first-of-type ,
	UL.edge_2cell.edge_2cell_l60p > LI:last-of-type {
		width: 100%;
	}

	UL.edge_2cell > LI ~ LI {
		padding-top:5rem;
	}

}



.edge_photo_2cell {
	position: relative;
	width:100%;
	height:35rem;

	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: space-between;
}
.edge_photo_2cell .photo {
	position: relative;
	width: calc(50% - 1rem);
	height:100%;
}
.edge_photo_2cell .photo::before {

	content:'';
	display:block;
	position:absolute;
	width: calc(100% - 1rem);
	height: calc(100% - 1rem);
	left:0.5rem;
	top:0.5rem;
	border:5px solid rgba(255,255,255,.75);
}
@media all and (max-width: 767px) {
	.edge_photo_2cell {
		height:auto;
	}
	.edge_photo_2cell .photo {
		width: 100%;
		margin-top:2rem;
	}


}


.edge_photo_3cell {
	position: relative;
	width:100%;
	height:30rem;

	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: space-between;
}
.edge_photo_3cell .photo {
	position: relative;
	width: calc(100% / 3 - 1rem);
	height:100%;
}
.edge_photo_3cell .photo::before {

	content:'';
	display:block;
	position:absolute;
	width: calc(100% - 1rem);
	height: calc(100% - 1rem);
	left:0.5rem;
	top:0.5rem;
	border:5px solid rgba(255,255,255,.75);
}
@media all and (max-width: 767px) {
	.edge_photo_3cell {
		height:auto;
	}
	.edge_photo_3cell .photo {
		width:100%;
		margin:1rem 0;
	}
}




UL.edge_half {
	position: relative;
	width:100%;

	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: stretch;
	justify-content: space-between;

}
UL.edge_half > LI {
	position: relative;
	width: calc(50% - 2.5rem);
}
UL.edge_half > LI:nth-of-type(n+3) {
	padding-top:5rem;
}
UL.edge_half > LI .SubTitle {
	margin:0;
	height:5rem;
}
UL.edge_half > LI .SubTitle + .Edgeline {
	margin:0;
	height:calc(100% - 5rem);
}
@media all and (max-width: 1170px) {
	UL.edge_half > LI {
		width: calc(50% - 1rem);
	}
	UL.edge_half > LI:nth-of-type(n+3) {
		padding-top:2rem;
	}

}
@media all and (max-width: 767px) {
	UL.edge_half > LI {
		width: 100%;
	}

	UL.edge_half > LI ~ LI {
		padding-top:5rem;
	}

}









/* 이용료 테이블 */
.ReservPayTable {
	margin-top:1rem;
}
.ReservPayTable TH {
	line-height:1.5;
	padding: 1.5rem;
}
.ReservPayTable TH.tb-rl {
	writing-mode: unset;
	letter-spacing: 0;
	padding:0 1rem;
}
.ReservPayTable TH > DIV,
.ReservPayTable TH > SPAN {
	display:block;
	margin:0;
	letter-spacing: -1px;
}







/* 테마버튼 */
.btn.btn-theme {
	color: var(--base-btn-color);
	background-color: var(--base-btn-bgcolor);
	text-shadow:-1px -1px 0 rgba(0,0,0,1);
}
.btn.btn-theme:hover,
.btn.btn-theme:focus,
.btn.btn-theme:active,
.btn.btn-theme.active {
	background-color: var(--base-btn-bgcolor);
}
.btn.btn-theme.disabled,
.btn.btn-theme[disabled],
fieldset[disabled] .btn.btn-theme,
.btn.btn-theme.disabled:hover,
.btn.btn-theme[disabled]:hover,
fieldset[disabled] .btn.btn-theme:hover,
.btn.btn-theme.disabled:focus,
.btn.btn-theme[disabled]:focus,
fieldset[disabled] .btn.btn-theme:focus,
.btn.btn-theme.disabled:active,
.btn.btn-theme[disabled]:active,
fieldset[disabled] .btn.btn-theme:active,
.btn.btn-theme.disabled.active,
.btn.btn-theme[disabled].active,
fieldset[disabled] .btn.btn-theme.active {
	background-color:  var(--base-btn-border);
	border-color:  var(--base-btn-border);
}
