@charset "utf-8";
/*.design-bg{ width: 1400px; height: 5024px; background: url('../design_img/reservation-thanks.jpg') 0 0 no-repeat; position: absolute; top: 0; left: 50%; -webkit-transform: translate(-50%,0); transform: translate(-50%,0); z-index: -1; opacity: .5; background-size: 1400px; }*/


@media print, screen and (min-width: 751px) {
#main 					{ margin-top: 60px; }
.mainImage 				{ height: 376px; background: url('../img/reservation/main-image2.jpg') 50% 50% no-repeat; background-size: cover; }
.mainImage .text 		{ font-size: .9rem; font-weight: normal; line-height: 2.4; }
.mainImage .text.mt 	{ margin-top: 30px; }

#howToReserve 			{ margin-top: 100px; }
#howToReserve .bg 		{ margin-top: 100px; background-color: #f9f7f3; }
#howToReserve .master 	{  }
#howToReserve dl 		{ padding: 110px 0; }
#howToReserve dl>div 	{ display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; }
#howToReserve dl>div:nth-of-type(n+2){ margin-top: 110px; }
#howToReserve dl>div:after{ content: ''; width: 25px; height: 4px; background-color: #7cc156; display: block; position: absolute; bottom: -59px; left: 50%; -webkit-transform: translate(-50%,0); transform: translate(-50%,0); }
#howToReserve dl>div:last-of-type:after{ content: none; }
#howToReserve dl>div dt { width: 130px; }
#howToReserve dl>div dd { width: calc(100% - 130px); }
#howToReserve dl>div dd p{ font-size: .9rem; line-height: 1.8; }
#howToReserve dl>div dd .textB{ font-size: 1.2rem; font-weight: 700; line-height: 1.8; }
#howToReserve dl>div dd .telBox{ width: 100%; max-width: 620px; margin: 32px 0 10px; padding: 20px 20px; text-align: center; background-color: #fff; }
#howToReserve dl>div dd .telBox p:nth-of-type(2){ margin-top: 15px; font-size: .9rem }
#howToReserve dl>div dd .infoBox{ width: 100%; max-width: 620px; margin-top: 32px; padding: 30px 20px; text-align: center; background-color: #fff; }
#howToReserve dl>div dd .infoBox p{ font-size: .95rem; font-weight: 700; }
#howToReserve dl>div dd .infoBox ul{ margin-top: 5px; }
#howToReserve dl>div dd .infoBox ul li{ margin-right: 20px; display: inline-block; font-size: 1rem; line-height: 1.8; }
#howToReserve dl>div dd .infoBox ul li:last-of-type{  }
#howToReserve dl>div dd .infoBox ul li:before{ content: '●'; color: #7cc156; }

#form 					{ margin-top: 95px; }
#form .topBox 			{ margin-top: 95px; }
#form .topBox p:nth-of-type(1){ font-size: 1.2rem; font-weight: 700; }
#form .topBox p:nth-of-type(2){ margin-top: 10px; font-size: .81rem; }
#form .topBox p:nth-of-type(2) a{ text-decoration: underline; color: #7cc156; }
#form .formContents 	{ margin-top: 65px; }
#form .formContents>div { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#form .formContents>div:nth-of-type(n+2){ margin-top: 40px; }
#form .formContents>div dt{ width: 230px; padding-top: 15px; padding-right: 58px; font-size: .9rem; font-weight: 700; line-height: 1.5; position: relative; }
#form .formContents>div dt span{ padding: 5px 9px; background-color: #7cc156; color: #fff; font-size: 1rem; font-weight: 700; line-height: 1; position: absolute; top: 15px; right: 59px; }
#form .formContents>div dd{ width: calc(100% - 230px); font-size: .95rem; }
#form .formContents>div dd input[type="text"]{ padding: 14px 15px; border: 0; background-color: #f2f2f2; }
#form .formContents>div dd input[type="date"]{ padding: 14px 15px; border: 0; background-color: #f2f2f2; }
#form .formContents>div dd input[type="number"]{ padding: 14px 15px; border: 0; background-color: #f2f2f2; }
#form .formContents>div dd textarea{ width: 100%; height: 200px; padding: 14px 15px; resize: vertical; border: 0; background-color: #f2f2f2; }
#form .formContents>div dd .widthL{ width: 100%; }
#form .formContents>div dd .widthS{ width: 173px; }
#form .formContents>div.email dd p{ margin: 37px 0 7px; font-size: .9rem; }
#form .formContents>div.address dd>div:nth-of-type(n+2){ margin-top: 20px; }
#form .formContents>div.preferredTime{ margin-top: 30px; }
#form .formContents>div.preferredTime dd{ margin-top: 20px; }
#form .formContents>div.preferredTime dd label{ font-size: 1.1rem; }
#form .formContents>div.preferredTime dd .as{ margin-top: 5px; font-size: .8rem; }
#form .formContents>div.preferredTime dd .as.mt{ margin-top: 30px; }
#form .formContents>div.desiredNumber{ margin-top: 80px; }
#form .agree 			{ margin-top: 98px; text-align: center; }
#form .agree input 		{ margin-right: 10px; }
#form .agree a 			{ text-decoration: underline; color: #7cc156; }
#form .confirmBtn 		{ width: 90%; max-width: 450px; height: 90px; margin: 96px auto 0; display: block; border-radius: 45px; border: 2px solid #7cc156; background: #fff url('../img/common/arrow-btn.svg') 41px 50% no-repeat; font-size: 1.1rem; font-weight: 700; color: #7cc156; cursor: pointer; -webkit-transition: .5s; transition: .5s; }
#form .confirmBtn:hover { background: #7cc156 url('../img/common/arrow-btn-hover.svg') 41px 50% no-repeat; color: #fff; }
}


@media screen and (max-width: 1345px) and (min-width: 415px) {

}


@media screen and (max-width: 750px) {
#main 					{ margin-top: 60px; }
.mainImage 				{ height: auto; padding: 40px 0; background: url('../img/reservation/main-image2.jpg') 50% 50% no-repeat; background-size: cover; }
.mainImage .text 		{ font-size: .8rem; font-weight: normal; line-height: 2; }
.mainImage .text.mt 	{ margin-top: 20px; }

#howToReserve 			{ margin-top: 60px; }
#howToReserve .bg 		{ margin-top: 60px; background-color: #f9f7f3; }
#howToReserve .master 	{  }
#howToReserve dl 		{ padding: 60px 0; }
#howToReserve dl>div 	{ position: relative; }
#howToReserve dl>div:nth-of-type(n+2){ margin-top: 100px; }
#howToReserve dl>div:after{ content: ''; width: 25px; height: 4px; background-color: #7cc156; display: block; position: absolute; bottom: -50px; left: 50%; -webkit-transform: translate(-50%,0); transform: translate(-50%,0); }
#howToReserve dl>div:last-of-type:after{ content: none; }
#howToReserve dl>div dt { text-align: center; }
#howToReserve dl>div:nth-of-type(1) dt img{ width: 56px; }
#howToReserve dl>div:nth-of-type(2) dt img{ width: 61px; }
#howToReserve dl>div:nth-of-type(3) dt img{ width: 62px; }
#howToReserve dl>div dd { margin-top: 20px; }
#howToReserve dl>div dd p{ font-size: .85rem; line-height: 1.8; }
#howToReserve dl>div dd .textB{ font-size: 1rem; font-weight: 700; line-height: 1.8; }
#howToReserve dl>div dd .telBox{ width: 100%; max-width: 620px; margin: 32px 0 10px; padding: 20px 20px; text-align: center; background-color: #fff; }
#howToReserve dl>div dd .telBox p:nth-of-type(2){ margin-top: 15px; font-size: .85rem }
#howToReserve dl>div dd .infoBox{ width: 100%; max-width: 620px; margin-top: 32px; padding: 20px 20px; text-align: center; background-color: #fff; }
#howToReserve dl>div dd .infoBox p{ font-size: .95rem; font-weight: 700; }
#howToReserve dl>div dd .infoBox ul{ margin-top: 5px; }
#howToReserve dl>div dd .infoBox ul li{ text-align: left;display: block; font-size: .9rem; line-height: 1.8; }
#howToReserve dl>div dd .infoBox ul li:last-of-type{  }
#howToReserve dl>div dd .infoBox ul li:before{ content: '●'; color: #7cc156; }

#form 					{ margin-top: 60px; }
#form .topBox 			{ margin-top: 60px; }
#form .topBox p:nth-of-type(1){ font-size: 1rem; font-weight: 700; }
#form .topBox p:nth-of-type(2){ margin-top: 10px; font-size: .81rem; }
#form .topBox p:nth-of-type(2) a{ text-decoration: underline; color: #7cc156; }
#form .formContents 	{ margin-top: 65px; }
#form .formContents>div {  }
#form .formContents>div:nth-of-type(n+2){ margin-top: 40px; }
#form .formContents>div dt{ font-size: .9rem; font-weight: 700; line-height: 1.5; position: relative; }
#form .formContents>div dt span{ margin-left: 10px; padding: 3px 9px; background-color: #7cc156; color: #fff; font-size: 1rem; font-weight: 700; line-height: 1; }
#form .formContents>div dd{ margin-top: 15px; font-size: .95rem; }
#form .formContents>div dd input[type="text"]{ padding: 14px 15px; border: 0; background-color: #f2f2f2; }
#form .formContents>div dd input[type="date"]{ padding: 14px 15px; border: 0; background-color: #f2f2f2; }
#form .formContents>div dd input[type="number"]{ padding: 14px 15px; border: 0; background-color: #f2f2f2; }
#form .formContents>div dd textarea{ width: 100%; height: 160px; padding: 14px 15px; resize: vertical; border: 0; background-color: #f2f2f2; }
#form .formContents>div dd .widthL{ width: 100%; }
#form .formContents>div dd .widthS{ width: 173px; }
#form .formContents>div.email dd p{ margin: 37px 0 7px; font-size: .9rem; }
#form .formContents>div.address dd>div:nth-of-type(n+2){ margin-top: 20px; }
#form .formContents>div.preferredTime{ margin-top: 30px; }
#form .formContents>div.preferredTime dd{ margin-top: 20px; }
#form .formContents>div.preferredTime dd label{ font-size: 1.1rem; }
#form .formContents>div.preferredTime dd .as{ margin-top: 5px; font-size: .8rem; }
#form .formContents>div.preferredTime dd .as.mt{ margin-top: 30px; }
#form .formContents>div.desiredNumber{  }
#form .agree 			{ margin-top: 50px; text-align: center; }
#form .agree input 		{ margin-right: 10px; }
#form .agree a 			{ text-decoration: underline; color: #7cc156; }
#form .confirmBtn 		{ width: 90%; max-width: 450px; height: 60px; margin: 50px auto 0; display: block; border-radius: 45px; border: 2px solid #7cc156; background: #fff url('../img/common/arrow-btn.svg') 41px 50% no-repeat; font-size: 1rem; font-weight: 700; color: #7cc156; cursor: pointer; -webkit-transition: .5s; transition: .5s; }
#form .confirmBtn:hover { background: #7cc156 url('../img/common/arrow-btn-hover.svg') 41px 50% no-repeat; color: #fff; }
}