:root {
	--special-font: 'gothic-a1', 'Roboto', 'Noto Sans KR', 'Apple SD Gothic Neo', helvetica, 'Malgun Gothic', '맑은 고딕',helvetica, sans-serif;
	--header-height: 60px;
	--header-height-inner: 60px;
	--header-height-minus: -60px;
	--header-height-gnb: 30px;
	--basic-color: #07b594;
	--basic-color-deep: #08a184;
	--basic-color-bright: #e0fdf8;
	--special-color: #0089bf;
	--special-color-deep: #0075a3;
	--special-color-bright: #dff6fd;
	--red-color: #ff4d5e;
	--red-color-deep: #e72033;
	--red-color-bright: #fef2f2;
	--gray-color: #c1c1c1;
	--gray-color-deep: #9f9f9f;
	--gray-color-bright: #eeeef0;
}

@media (min-width: 950px){
	:root {
		--header-height: 110px;
		--header-height-inner: 80px;
		--header-height-minus: -110px;
	}
}

html { color: #333; }
body { background-color: #fff; }
* { font-family: 'Roboto', 'Noto Sans KR', 'Apple SD Gothic Neo', helvetica, 'Malgun Gothic', '맑은 고딕',helvetica, sans-serif; }
.maxWidth { max-width: 1130px; padding-left: 2rem; padding-right: 2rem; transition: padding .5s cubic-bezier(.215,.61,.355,1); }
.maxWidth-min { max-width: 640px; margin: auto; position: relative; padding-left: 3rem; padding-right: 3rem; }
.maxWidth-full { max-width: 100%; }
.divisionLine { border: 1px solid #e9e9eb; border-width: 1px 0 1px 0; margin: 3rem 0; height: 10px; width: 100%; background-color: #f9fafc; }
@media (min-width: 950px){ .divisionLine { margin: 5rem 0; } }
.divisionLine-dot { border-top: 1px dashed #ccc; }
.float-wrap:after { content: ''; display: block; clear: both; }
.x-scroll { overflow-x: auto; } 
.orangeText { color: #f57319; } .blueText { color: #4179c6; } .grayBg { background-color: #f1f4f6; }
.alignCenter { text-align: center !important; }
@media (min-width: 1300px){ .maxWidth { padding-left: 0; padding-right: 0; } }

@media print {
	header, footer, .no-print, .subHero-wrap, .summery-wrap, .subPage-title-btn { display:none }	
    body{ width: 210mm; height: 297mm; margin: auto auto; }
  	 * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  	.page-break { page-break-before: always; }
}




@media (min-width: 1300px){ 
	.header-wrap .headerInner .logo img { max-height: 5rem; }
	.header-wrap .headerInner nav > ul > li > a { font-size: 1.7rem; padding: 0 2.5rem; }
	.header-wrap .headerInner nav > ul > li:last-child a { padding-right: 0.5rem; }
}

/* .layerPopup-wrap { display: none; } */
.layerPopup-wrap:after { content: '';  position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1900; background-color: rgba(0,0,0,0.5); }
.layerPopup { position: fixed; top: 0; left: 0; z-index: 2000;  background-color: #fff; max-width: 100%; }
.layerPopup-content { max-height: calc(100vh - 5rem); overflow-y: auto; max-width: 100%; }
.layerPopup-content img { max-width: 100%; }
.layerPopup-bar:after { content: ''; display: block;  clear: both; }
.layerPopup-bar { background-color: #000; padding: 1rem; }
.layerPopup-bar * { color: #fff; }
.layerPopup-bar .todayStop-btn { float: left; }
.layerPopup-bar .close-btn { float: right; } 

.centerPopup-x { left: 50% !important; transform: translateX(-50%); }
.centerPopup-y { top: 50% !important; transform: translateY(-50%); }
.centerPopup-x.centerPopup-y { transform: translate(-50%, -50%); }


#wrap footer { background-color: #f0f2f5; border-top: 1px solid #d4d5d9; padding-top: 0.8rem; text-align: center; }
#wrap footer .footer-wrap { background-color: #f0f2f5; border-top: 1px solid #eaecea; padding: 3rem 0 4rem; }
#wrap footer .footer-wrap .contact-title, #wrap footer .footer-wrap .contactText { font-size: 2.6rem; }
#wrap footer .contact-title strong { font-size: 1em; font-family: var(--special-font); font-weight: 900; text-indent: -0.2rem; display: block; color: var(--special-color-deep); }
#wrap footer .contact-title span { font-size: 0.6em; display: block; color: #535457; font-weight: normal; margin-top: 0.5rem; }

#wrap footer .contactText *, #wrap footer .copyText { line-height: 1.5; color: #535457; }
#wrap footer .contactText dt { font-weight: 700; font-size: 0.55em; }
#wrap footer .contactText dt ~ dt { margin-top: 2rem; }
#wrap footer .contactText dd { padding-top: 0.2rem; font-size: 0.5em; }
#wrap footer .copyText { font-size: 1.3rem; color: #999; /* padding-top: 2rem; */ }

@media (min-width: 950px){
	#wrap footer .footer-wrap .contact-title, #wrap footer .footer-wrap .contactText { font-size: 2.8rem; }
	#wrap footer .footer-wrap { padding: 4rem 0 5rem; }
}

.header-wrap .headerInner { background-color: rgba(255,255,255,0); }
.header-wrap .headerInner .logo img { max-height: 3.4rem; }
.headerRight-btn { font-size: 0; }
.headerRight-btn > * { display: inline-block; vertical-align: middle; }

.headerRight-btn > a { padding: 2rem 1rem; margin-top: 0.2rem; margin-right: 0.5rem; }
.headerRight-btn > a span{ display: block; font-family: var(--special-font); color: #333; font-weight: 600; font-size: 1.9rem; line-height: 1; }

.burgerBtn { padding-left: 1rem; width: 2.5rem; }
.burgerBtn span { background-color: #000; position: relative; }
.burgerBtn span:before { 
	content: ''; display: block; width: 0.5rem; height: 0.5rem; border-radius: 50%; border: 1px solid #000;
	position: absolute; top: 50%; left: -0.8rem; transform: translateY(-50%); 
}

@media (min-width: 950px){
	.headerRight-btn { display: none; }
}

.sectionTitle { margin-bottom: 2rem; }
.sectionTitle h3 { display: block; padding-left: 4rem; position: relative; }
.sectionTitle h3 strong { display: block; font-size: 2rem; font-weight: 600;  }
.sectionTitle h3:before { 
	content: ''; display: block; width: 2.8rem; height: 2.8rem; position: absolute; left: 0; top: -0.3rem;
	background: url("/naju_helper/style_www/img/common/icon/title_dot.png") no-repeat center; background-size: 100%;
}
.sectionTitle ~ .sectionTitle { margin-top: 3rem; }

@media (min-width: 950px){
	.sectionTitle ~ .sectionTitle { margin-top: 4rem; }
}

/** mainTop **/

.mainTop-wrap { background-color: #fff5d2; /* background: url("/naju_helper/style_www/img/bg/top_bg.jpg") center no-repeat; */ background-size: cover;  position: relative; overflow: hidden; }
.mainTop-wrap .maxWidth-min { padding: 0; }
.mainTop-wrap:before {  content:''; display: none; background: url("/naju_helper/style_www/img/common/header/shadow.png"); position: absolute; top: 0; right: 0; left: 0; height: 250px; background-repeat: repeat-x; background-size: auto 100%; z-index: 1;}

.mainTop-wrap .sliderControl-wrap { padding: 0.5rem 1rem; background-color: #f9fafc; border-top: 1px solid #e7dfc1; border-bottom: 1px solid #f1f1f1; text-align: center; }
.mainTop-wrap .sliderControl-wrap > .inner > * { display: inline-block; vertical-align: middle; color: var(--special-color); font-size: 0; }
.mainTop-wrap .sliderControl-wrap > .inner *:before { font-size: 1.4rem; }

/** mainTop end **/



/** mainReservation-wrap **/

.mainReservation-wrap { border-bottom: 1px solid #f1f1f1; padding: 3.5rem 0; }

.mainReservation .initialBtn { border-radius: 0.8rem; padding: 2rem 0.5rem;  }
.mainReservation .initialBtn > * { display: inline-block; vertical-align: middle; } 
.mainReservation .initialBtn > i { width: 2rem; margin-right: 1rem; }
.mainReservation .initialBtn > span { font-weight: 600; font-size: 1.6rem;  }

.state-wrap { padding: 3rem 0 0; text-align: center; }
.state-wrap ul:after { content: ''; display: block; clear: both; }
.state-wrap ul li { float: left; width: 25%; }
.state-wrap ul li + li { border-left: 1px solid #e6e6e6; }
.state-wrap ul li dl dt { color: #9d9d9d; margin-bottom: 1rem; }
.state-wrap ul li dl dd { font-weight: 800; font-size: 3rem; color: #555; }
.state-wrap ul li dl dt > * { display: inline-block; vertical-align: middle; }
.state-wrap ul li dl dt i { width: 0.8rem; height: 0.8rem; background-color: var(--basic-color); border-radius: 50%; margin-right: 0.5rem; position: relative; top: -0.1rem; }
.state-wrap ul li dl dt.stateFinish i { background-color: #c1c1c1; }
.state-wrap ul li dl dt.stateReservation i { background-color: #0089bf; }
.state-wrap ul li dl dt.stateCancel i { background-color: #ff804d; }

/** mainReservation-wrap end **/



/** mainInformation-wrap **/

.mainInformation-wrap { background-color: #f9fafc; padding: 4rem 0 3rem; }
.mainInformation-wrap .maxWidth-min { padding: 0; }

.mainInformation-wrap .sectionTitle { padding-left: 3rem; margin-bottom: 0; }
.mainInformation-wrap .mainInformation-slider { font-size: 0; }
 
.mainInformation-content { position: relative; }
.mainInformation-slider li.sliderItem { padding: 2rem 3rem; } 
.mainInformation-slider .inner { box-shadow: 0 4px 2rem rgb(0 0 0 / 10%); border-radius: 0.8rem; overflow: hidden; }
.mainInformation-arrow { 
	position: absolute; top: 50%; transform: translateY(-50%); backdrop-filter: blur(2px); background-color: rgba(255, 245, 210, 0.6); border: 1px solid #fff5d2; 
	color: #59493f; font-size: 0; width: 6rem; height: 6rem; border-radius: 50%; }
}
.mainInformation-arrow#informationSlider-prev { left: 0;}
.mainInformation-arrow#informationSlider-next { right: 0; }
.mainInformation-arrow *:before { font-size: 2rem; }

.mainInformation-wrap .sliderControl-wrap { padding: 0.5rem 1rem; text-align: center; }
.mainInformation-wrap .sliderControl-wrap > .inner > * { display: inline-block; vertical-align: middle; color: var(--special-color); font-size: 0; }
.mainInformation-wrap .sliderControl-wrap > .inner *:before { font-size: 1.4rem; }

@media (max-width: 640px){
	.mainInformation-arrow#informationSlider-prev { border-radius: 0 3rem 3rem 0; border-left: 0; }
	.mainInformation-arrow#informationSlider-next { border-radius: 3rem 0 0 3rem; border-right: 0; }
}

/** mainInformation-wrap end **/



/** mainNotice-wrap **/

.mainNotice-wrap { background-color: #e4e8eb; border-top: 1px solid #d4d5d9; }
.mainNotice > .inner { position: relative; padding-left: 2.5rem; }
.mainNotice > .inner a { position: absolute; left: 0; top: 50%; transform: translateY(-50%); color: #333; }
.mainNotice-list { width: 100%; }
.mainNotice-list li > button { display: block; width: 100%; color: #333; }
.mainNotice-list li > button dl { position: relative; line-height: 2rem; padding: 1.5rem 8rem 1.5rem 1.5rem; font-size: 0; }
.mainNotice-list li > button dt { font-weight: 400; text-align: left; }
.mainNotice-list li > button dt span { font-weight: 400; padding-right: 0.5rem; font-size: 1.5rem; }
.mainNotice-list li > button dd { position: absolute; right: 0rem; top: 50%; transform:translateY(-50%); }
.mainNotice-list li > button dd span { font-size: 1.4rem; }

@media (max-width: 500px){
	.mainNotice-list li > button dl { padding: 1.5rem; }
	.mainNotice-list li > button dd { display: none; }
}

/** mainNotice-wrap end **/



/** ************************************************** **/


/** subTop-wrap **/

.subHero-wrap { background-color: #fff5d3; /* margin-top: var(--header-height-minus); */ position: relative; border-bottom: 1px solid rgba(192,192,192,0.4); }
/* .subHero-wrap:before { content:''; display: block; background-image: url('/naju_helper/style_www//img/common/header/shadow.png'); position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-repeat: repeat-x; background-size: auto 80%; z-index: 10; } */
.subHero-wrap:after { content:''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0;  background-image: url('/naju_helper/style_www/img/bg/top_bg.jpg'); background-size: auto 100%; background-position: 55% 0; background-repeat: no-repeat; animation: animatedBackground 30s linear infinite alternate; }
/* @keyframes animatedBackground { from { background-position: center 0%; } to { background-position: center 100%; } } */

.subHero-text { color: #382f1f; padding: 5rem 0; position: relative; z-index: 20; text-align: center; }
.subHero-text > h2 strong { font-size: 2.5rem; }
.subHero-text > p { margin-top: 0.5rem; padding: 0; font-size: 1.7rem; }

@media (min-width: 950px){
	.subHero-text { padding: 6rem 0; }
	.subHero-text > h2 strong { font-size: 2.5rem; }
	.subHero-text > p { font-size: 2rem; }
}

/** subHero-wrap end **/


/** sub-wrap end **/

.sub-wrap { padding: 3rem 0 4rem; }
@media (min-width: 950px){ .sub-wrap { padding: 6rem 0 6rem; } }

/** sub-wrap end **/


/** pageTab-wrap **/

.pageTab:after { content: ''; display: block; clear: both; }
.pageTab ul { margin-left: -1.2rem; }
.pageTab ul li { float: left; padding-left: 1.2rem; /* border-bottom: 2px solid var(--special-color-deep);*/ }
.pageTab ul li a { display: block; font-size: 3vw; padding: 1.8rem 0.5rem; text-align: center; position: relative; background-color: #b4b7bb; color: #fff; font-weight: 500; } 
.pageTab ul li a:before {
	position: absolute; top: 0; left: 0; content: ""; display: block; width: 0;
	height: 100%; background-color: rgba(0,0,0, 0);  transition: all 0.2s ease-in-out;
}
.pageTab ul li a:hover:before { width: 100%; background-color: rgba(0,0,0, 0.1); }
.pageTab ul li.active a { background-color: var(--special-color-deep); color: #fff; }

.pageTab_2.maxWidth { max-width: 70rem; }
.pageTab_2 ul li { width: 50%; }
.pageTab_3 ul li { width: 33.333333%; }
.pageTab_4 ul li { width: 25%; }

@media (min-width: 600px){
	.pageTab ul li a { font-size: 1.7rem; }
}

/** pageTab-wrap end **/



/** Publication **/

.webzineList { border-top: 1px solid #333; }
.webzineList > li { border-bottom: 1px solid #dedede; }
.webzineList > li > * { display: block; width: 100%; text-align: left; font-size: 0; padding: 2rem 1rem; }
.webzineList .webzineList-img { width: 12rem; display: none; border: 1px solid #dedede; }
.webzineList .webzineList-img .imgContainer-fit { padding: 0; height: 8rem; }
.webzineList dl dt { font-size: 1.7rem; font-weight: 500; }
.webzineList dl dd { color: #a1a2a8; font-size: 1.5rem; margin-top: 1.2rem; }

.webzineList .withImg * > * { vertical-align: middle; }
.webzineList .withImg .webzineList-img { display: inline-block; }
.webzineList .withImg dl { display: inline-block; width: calc(100% - 12rem); padding-left: 2rem; }

.webzineList > li > button:hover dl { text-decoration: underline; }

/** Publication **/



.reserveClause-wrap { background-color: var(--red-color-bright); padding: 3rem 2.5rem; border-radius: 1rem; }
.reserveClause-wrap h3 { color: var(--red-color); display: block; font-size: 0; }
.reserveClause-wrap h3 * { display: inline-block; vertical-align: middle; }
.reserveClause-wrap h3 i { position: relative; top: -0.05rem; margin-right: 0.5rem; }
.reserveClause-wrap h3 i:before { font-size: 3rem; }
.reserveClause-wrap h3 strong { font-size: 2rem; font-weight: 600; }
.reserveClause-wrap .dotList li { padding-left: 1.2rem; }
.reserveClause-wrap .dotList li + li { margin-top: 1.5rem; }
.reserveClause-wrap .dotList li:before { background-color: var(--red-color); border-radius: 0.2rem; width: 0.3rem; height: 1.1rem; top: 0.35em; }
.reserveClause-wrap .dotList li p { font-size: 1.6rem; }
.reserveClause-wrap .reserveClause { padding: 2rem 0.5rem 0; }

.reserveInfo-wrap { background-color: var(--basic-color-bright); padding: 3rem 2.5rem; border-radius: 1rem; }
.reserveInfo-wrap h3 { color: var(--basic-color); display: block; font-size: 0; }
.reserveInfo-wrap h3 * { display: inline-block; vertical-align: middle; }
.reserveInfo-wrap h3 i { position: relative; top: -0.05rem; margin-right: 0.5rem; }
.reserveInfo-wrap h3 i:before { font-size: 3rem; }
.reserveInfo-wrap h3 strong { font-size: 2rem; }
.reserveInfo-wrap .dotList li { padding-left: 1.2rem; }
.reserveInfo-wrap .dotList li + li { margin-top: 1rem; }
.reserveInfo-wrap .dotList li:before { background-color: var(--basic-color); border-radius: 0.2rem; width: 0.3rem; height: 1.1rem; top: 0.35em; }
.reserveInfo-wrap .dotList li p { font-size: 1.6rem; }
.reserveInfo-wrap .reserveInfo { padding: 2rem 0.5rem 0; }

.consent-wrap { padding: 2rem 0 0; }
.consent-wrap p { font-size: 1.6rem; line-height: 1.5; }
.consent-wrap p font { color: var(--basic-color); font-weight: 500; }

.consent-wrap .customCheckbox { margin-top: 1.5rem; }
.consent-wrap .customCheckbox label span { font-size: 1.6rem; color: #555; }

.consent-line { position: relative; }
.consent-line a { position: absolute; right: 0; top: 50%; transform: translateY(-50%); background-color: #e4e8eb; border-radius:  2rem; padding: 0.5rem 1.5rem; color: #555; }
.consent-line a:hover { background-color: var(--special-color); color: #fff; }

.reserveButton-wrap { margin-top: 3rem; }
.reserveButton-wrap .initialBtn { border-radius: 0.8rem; padding: 2rem 0.5rem; }
.reserveButton-wrap .initialBtn span { font-weight: 600; font-size: 1.6rem; }



.reserveSelect-btn { border-bottom: 1px solid #dedede; display: block; width: 100%; position: relative; }
.reserveSelect-btn > * { display: inline-block; vertical-align: middle; }
.reserveSelect-btn em { width: 2.5rem; }
.reserveSelect-btn input { border: 0; padding: 2.2rem 1rem; }
.reserveSelect-btn input, .reserveSelect-btn input::placeholder { color: #333; font-size: 2rem; font-weight: 600; }
.reserveSelect-btn:before { content:'\e944'; display: block; font-family: xeicon; font-size: 1.8rem; color: #aaa; position: absolute; right: 0.5rem;; top: 50%; transform: translateY(-50%); }

.reserveSelect-close .reserveSelect-btn:before { content: '\e941'; }
.reserveSelect-close + .reserveSelect-content { height: 0; overflow: hidden; }


.selectDate-wrap { padding: 3rem 0 1.5rem; }
.selectDate { width: 100%; table-layout: fixed; }
.selectDate > thead > tr > th { padding: 5px; font-size: 1.5rem; font-weight: bold; text-align: center; }
.selectDate > tbody > tr > td { border-radius: 100%; font-weight: 100; text-align: center; font-size: 12px; position: relative; font-size: 0; }
.selectDate > tbody > tr > td:after { content: ''; display: block; padding-bottom: 100%; z-index: -1; }
.selectDate > tbody > tr > td > .inner { 
	color: #454545; font-size: 1.5rem; font-weight: bold !important; text-decoration: none;
	position: absolute; top: 5%; left: 5%; width: 90%; height: 90%; cursor: default; 
	display: flex; justify-content: center; align-items: center; opacity: 0.3;
}
.selectDate > tbody > tr > td.w_sat > .inner, .w_sat { color: #0099ff; }
.selectDate > tbody > tr > td.w_sun > .inner, .w_sun { color: red; }
.selectDate > tbody > tr > td.today > .inner { background: #d1d1d1; border-radius: 50%; border: 0px; }
.selectDate > tbody > tr > td > .daySelectable { opacity: 1; cursor: pointer; }
.selectDate > tbody > tr > td > .daySelectable:hover { color: var(--basic-color); }
.selectDate > tbody > tr > td > .daySelectable.active { color: #fff; background-color: var(--basic-color); border-radius: 50%; border: 0px;  }

.selectDate > thead > tr.calMonth-wrap th { padding: 0 0 3rem; }
.calMonth { text-align: center; position: relative; }
.calMonth > * { display: inline-block; vertical-align: middle; }
.calMonth strong { font-size: 2.5rem; }
.calMonth-prev { padding-left: 0; }
.calMonth-next { padding-right: 0; }
.calMonth-move { padding: 1rem 1.5rem; }
.calMonth-move i { display: block; font-size: 0; line-height: 3rem; width: 0.8rem; height: 0.8rem; border: 2px solid #aaa; transform: rotate(-45deg); margin: auto; }
.calMonth-prev i { border-width: 2px 0 0 2px; }
.calMonth-next i { border-width: 0 2px 2px 0;  }

.calToday { position: absolute; right: 0; top:50%; transform: translateY(-50%); background-color: var(--gray-color-bright); padding: 0.5rem 1rem; border-radius: 2rem; }



.selectTime-wrap { padding-top: 1.5rem; }
.selectTime-wrap ~ .selectTime-wrap { padding-top: 1rem; }
.selectTime-wrap h3 { font-size: 1.7rem; color: #888; padding: 1rem 0; }
.selectTime-wrap .customRadio { margin-left: -0.6rem; margin-top: -0.6rem; }
.selectTime-wrap .customRadio:after { content: ''; display: block; clear: both; }
.selectTime-wrap .customRadio > li { width: 25%; float: left; padding: 0.6rem 0 0 0.6rem; }

.selectTime-wrap .customRadio label { background-color: var(--special-color-bright); border: 1px solid #bedfe9; padding: 1rem 0; text-align: center; border-radius: 0.2rem; }
.selectTime-wrap .customRadio label i { display: none; }
.selectTime-wrap .customRadio label span { font-size: 1.5rem; padding: 0; }

.selectTime-wrap .customRadio input[type="radio"]:checked + label { background-color: var(--special-color); border-color: var(--special-color-deep); }
.selectTime-wrap .customRadio input[type="radio"]:checked + label span { color: #fff; }





.serviceChoice-wrap .customCheckbox { margin: -1rem 0 0 -2rem; padding: 0.6rem 0 1rem; }
.serviceChoice-wrap .customCheckbox li { display: inline-block; vertical-align: middle; padding: 1rem 0 0 2rem; }
.serviceChoice-wrap .customCheckbox label span { font-size: 1.6rem; }

.serviceChoice-wrap .warningText { color: var(--red-color); font-size: 1.4rem; }
.serviceChoice-wrap textarea { border-radius: 0.5rem; border: 1px solid #dadada; padding: 1.6rem 1.2rem; width: 100%; margin-top: 1rem; }


.subReservation-wrap { padding-bottom: 2rem; }
.subReservation .state-wrap { padding: 3rem 0 2rem; }
.subReservation .initialBtn { border-radius: 0.8rem; padding: 2rem 0.5rem; }
.subReservation .initialBtn > * { display: inline-block; vertical-align: middle; } 
.subReservation .initialBtn > i { width: 2rem; margin-right: 1rem; }
.subReservation .initialBtn > span { font-weight: 600; font-size: 1.6rem;  }

@media (min-width: 950px){
	.subReservation-wrap { padding-bottom: 3rem; }
}

.reservePage-list { margin: -1.8rem 0 0 -1.8rem; }
.reservePage-list > li { padding: 1.8rem 0 0 1.8rem; }
.reservePage-list > li > .inner { box-shadow: 0 4px 2rem rgb(0 0 0 / 10%); border-radius: 0.8rem; overflow: hidden; border: 3px solid #c1c1c1; padding: 2.5rem 3rem; }
.reservePage-list > li > .inner > p i { width: 0.8rem; height: 0.8rem; background-color: var(--basic-color); border-radius: 50%; margin-right: 0.5rem; position: relative; top: -0.1rem; }
.reservePage-list > li > .inner > p.stateFinish i { background-color: #c1c1c1; }
.reservePage-list > li > .inner > p.stateReservation i { background-color: #0089bf; }
.reservePage-list > li > .inner > p.stateCancel i { background-color: #ff804d; }
.reservePage-list > li > .inner > dl { margin-top: 1.5rem; }
.reservePage-list > li > .inner > dl dt { font-size: 3.8vw; font-weight: 600; }
.reservePage-list > li > .inner > dl dd { margin-top: 1rem; font-size: 1.6rem; color: #555; }

.reservePage-list > li > .inner .btnGroup { margin: 2rem 0 0 -0.5rem; }
.reservePage-list > li > .inner .btnGroup:after { content: ''; display: block; clear: both; }
.reservePage-list > li > .inner .initialBtn, .noneBtn { padding: 1.5rem 0.5rem; font-size: 1.6rem; font-weight: 500; border-radius: 0.8rem; }
.reservePage-list > li.stateReservation-card > .inner { border-color: var(--special-color); }

.reservePage-list > li.stateReservation-card > .inner .btnGroup li { float: left; padding-left: 0.5rem; width: calc(50%);}
.reservePage-list > li.stateStandby > .inner .btnGroup li { width: calc(100%); }
.reservePage-list > li.stateReservation-card > .inner .btnGroup li:last-child { width: 100%; /* padding-left: 1rem; */ padding-top: 1rem;}
.reservePage-list > li.stateReservation-card .initialBtn { border-color: var(--special-color-deep); color: var(--special-color); }
.reservePage-list > li.stateReservation-card .basicBtn { background-color: var(--special-color); color: #fff; }

.reservePage-list > li.stateFinish-card .initialBtn { background-color: #333; border-color: #222; }
.reservePage-list > li.stateCancel-card > .inner { border-color: #ff804d; }

.noneBtn { text-align: center; background-color: var(--gray-color-bright); border: 1px solid var(--gray-color); color: var(--gray-color-deep); }

@media (min-width: 500px){
	.reservePage-list > li > .inner > dl dt { font-size: 2rem; }
}

.reserveView .reserveView-img { border: 1px solid var(--gray-color-bright); border-radius: 5rem; overflow: hidden; max-width: 15rem; margin: 0 auto 2rem; }
.reserveView .reserveView-img .imgContainer-fit { padding-bottom: 110%; }
.reserveView table { text-align: left;  }
.reserveView table th, .reserveView table td { padding-top: 1rem; padding-bottom: 1rem; font-size: 1.6rem; vertical-align: top; line-height: 1.5; }
.reserveView table th { padding-right: 2rem; }
.reserveView .initialBtn { padding: 1.5rem 0.5rem; font-size: 1.6rem; font-weight: 500; border-radius: 0.8rem; color: var(--gray-color-deep); }

.reserveFinish-wrap { background-color: #feddee; }
.reserveFinish-img { border-radius: 0.8rem; overflow: hidden; }
.reserveFinish .initialBtn { padding: 1.5rem 0.5rem; font-size: 1.6rem; font-weight: 500; border-radius: 0.8rem; }





.documentSubmit-info .sectionTitle { margin-bottom: 1.5rem; }
.documentSubmit-info p { font-size: 1.5rem; line-height: 1.5; color: #555; }
.documentSubmit-info .dotList-s li { font-size: 1.5rem; color: #555; }


.fileBox input[type="file"] { position: absolute;  width: 0; height: 0; padding: 0; overflow: hidden; border: 0; }
.fileBox input { background-color: #fff !important; }
.fileBox label { display: flex !important; justify-content: center; align-items: center; border-color: var(--basic-color); font-size: 1.4rem !important; color: var(--basic-color); }


/** board **/

.noticeTab-wrap { margin-bottom: 3rem; }
.noticeTab ul{ position: relative; }
.noticeTab ul:before { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: ''; border: 1px solid #dae1e6; z-index: -1; }
.noticeTab ul:after { content: ''; display: block; clear: both; }
.noticeTab ul li { float: left; width: 25%;  }
.noticeTab ul li a { display: block; text-align: center; border-right: 1px solid #dae1e6; border-bottom: 1px solid #dae1e6; color: #333; padding: 1.3rem 0; font-weight: 400; font-size: 2.8vw }
.noticeTab ul li a:hover { color: var(--special-color); }
.noticeTab ul li a.tabActive { background-color: var(--special-color); color: #fff; margin: 0 -1px; }

@media (min-width: 720px){
	.noticeTab ul li a { font-size: 1.5rem; }
}

.boardBtn:after { content: ''; display: block; clear: both; }
.boardBtn .initialBtn { border-radius: 0.5rem; padding: 1rem 0; }

.boardBtn.alignRight > * { float: right; margin-left: 0.5rem; }

.boardBtn.alignCenter { margin-left: -0.5rem; text-align: center; }
.boardBtn.alignCenter .initialBtn { display: inline-block; vertical-align: middle; margin-left: 0.5rem; }




.galleryBoard.gridWrap > ul > li > .inner { border: 1px solid #dedede; }
.galleryBoard .galleryText { padding: 1.5rem 1.5rem; text-align: left; }
.galleryBoard .galleryText h5, .galleryBoard .date { padding: 0; }
.galleryBoard .galleryText h5 strong, .galleryBoard .date { line-height: 1.2; height: inherit; }
.galleryBoard .galleryText h5 strong { font-size: 1.7rem; font-weight: 400; }
.galleryBoard .date { padding-top: 0.5rem; display: block; color: #999; }

.basicBoard th { padding: 1.8rem 1rem; }
.basicBoard td { padding: 1.8rem 1rem; }
.basicBoard td a strong { font-size: 1.6rem; }

.newsBoard > ul > li + li { margin-top: 1.5rem; }
.newsBoard > ul > li > .inner > button { display:block; position:relative; width:100%; border:1px solid #d8d8d8; transition:all 0.2s; -webkit-transition:all 0.2s;-moz-transition:all 0.2s; -ms-transition:all 0.2s; }
.newsImg .imgContainer-fit { padding-bottom: 50%; }
.newsImg .imgContainer-fit img { object-position: top; } 


.newsText { padding: 2rem; text-align: left; }
.newsText h5 { display: block; text-align: left; }
.newsText h5 strong { font-size: 1.8rem; color: #384463; }
.newsText p { text-align: left; margin: 1rem 0; line-height: 1.4; font-size: 1.5rem; color: #555; }
.newsText .date { display: inline-block; padding-top: 0; } 
.newsText .date.count { padding-left: 0.7rem; margin-left: 0.7rem; border-left: 1px solid #dedede; }


@media (min-width: 720px){
	.newsBoard > ul > li + li { margin-top: 2rem; }
	.newsBoard > ul > li > .inner > button { display: block; padding-left: 30%; }
	
	.newsImg { width: 30%; height: 100%; position: absolute; left: 0; top: 0;   }
	.newsText { width: 100%; }
	.newsImg li {position: absolute; top: 0; right: 0; left: 0; bottom: 0; }
	.newsImg .imgContainer-fit { padding: 0; height: 100%;  }
	.newsImg .imgContainer-fit img { object-position: top; } 
} 

@media (min-width: 950px){ 
	.newsText { padding: 3rem; }
	.newsText p { margin: 1.5rem 0; }
}

/** board end **/


.reserveSurvey-list > li + li  { margin-top: 3.5rem; }
.reserveSurvey-list > li h3 label { font-size: 1.6rem; font-weight: 600; }
.reserveSurvey-list > li .customRadio > li { margin-top: 1rem; }
.reserveSurvey-list > li .customRadio > li:first-child { margin-top: 1.5rem; }
.reserveSurvey-list > li textarea { width: 100%; border: 1px solid #dedede; border-radius: 0.5rem; overflow: hidden; margin-top: 1rem; padding: 1rem; font-size: 1.5rem; }