body {
	/*overflow-y:scroll;*/
}
img { max-width:100%; }

.ellip{
	display:block;
	text-overflow:ellipsis;
	white-space:nowrap;
	word-wrap:normal;
	overflow:hidden;
}
.nodrag {
	-ms-user-select: none;
	-moz-user-select: -moz-none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	user-select:none;
}
.check-big {
	width:15px;
	height:15px;
	vertical-align:-3px;
}
.check-big2 {
	width:20px;
	height:20px;
	vertical-align:-5px;
}
.ellip{
	display:block;
	text-overflow:ellipsis;
	white-space:nowrap;
	word-wrap:normal;
	overflow:hidden;
}

@media all and (min-width:1025px){
	/* 데스크탑 CSS 작성 */
}
@media all and (min-width:768px) and (max-width:1024px){
	/* 태블릿 및 노트북 CSS 작성 */
}
@media only screen and (max-width:480px){
	/* 모바일 */
}

/*
@ import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@ import url(http://fonts.googleapis.com/earlyaccess/nanumbrushscript.css);
@ import url(http://fonts.googleapis.com/earlyaccess/nanumgothiccoding.css);
@ import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);
@ import url(http://fonts.googleapis.com/earlyaccess/nanumpenscript.css);
*/

#toast {
	position: fixed;
	bottom: 350px;
	left: 50%;
	padding: 15px 20px;
	transform: translate(-50%, 10px);
	border-radius: 11px;
	overflow: hidden;
	font-size: 1.2rem;
	opacity: 0;
	visibility: hidden;
	transition: opacity .5s, visibility .2s, transform .5s;
	background: rgba(0, 0, 0, .8);
	color: #fff;
	z-index: 99999;
}

#toast.reveal {
	opacity: 0.8;
	visibility: visible;
	transform: translate(-50%, 0)
}




/* 달력 CSS */
.sec_cal {
    width: 100%; /* 너비를 100%로 변경하여 화면 크기에 맞게 조절 */
    max-width: 360px; /* PC 등 넓은 화면에서는 360px을 넘지 않도록 설정 */
    margin: 0 auto;
    font-family: "NotoSansR";
    padding: 0 10px; /* 스마트폰 화면 좌우에 여백 추가 */
    box-sizing: border-box; /* padding이 너비에 영향을 주지 않도록 설정 */
}

.sec_cal .cal_nav {
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 700;
    font-size: 24px;
    line-height: 0px;
}

.sec_cal .cal_nav .year-month {
    width: 96px;
    text-align: center;
    position: relative;
    top: 0px;
}

.sec_cal .cal_nav .nav {
    display: flex;
    border: 1px solid #333333;
    border-radius: 5px;
}

.sec_cal .cal_nav .go-prev,
.sec_cal .cal_nav .go-next {
    display: block;
    width: 50px;
    height: 36px;
    font-size: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sec_cal .cal_nav .go-prev::before,
.sec_cal .cal_nav .go-next::before {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border: 1px solid #000;
    border-width: 2px 2px 0 0;
    transition: border 0.1s;
}

.sec_cal .cal_nav .go-prev:hover::before,
.sec_cal .cal_nav .go-next:hover::before {
    border-color: #ed2a61;
}

.sec_cal .cal_nav .go-prev::before {
    transform: rotate(-135deg);
}

.sec_cal .cal_nav .go-next::before {
    transform: rotate(45deg);
}

.sec_cal .cal_wrap {
    padding-top: 10px;
    position: relative;
    margin: 0 auto;
}

.sec_cal .cal_wrap .days {
	display: flex;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: 1px solid #ddd;
}

.sec_cal .cal_wrap::after {
    top: 368px;
}

.sec_cal .cal_wrap .day {
	display:flex;
	align-items: center;
	justify-content: center;
	width: calc(100% / 7);
	text-align: left;
	color: #999;
	font-size: 14px;
	text-align: center;
	xborder-radius:5px;
}

.current.today {background: rgb(242 242 242);}

.sec_cal .cal_wrap .dates {
    display: flex;
    flex-flow: wrap;
    height: 170px;
}

.sec_cal .cal_wrap .day:nth-child(7n) {
    color: #3c6ffa;
}

.sec_cal .cal_wrap .day:nth-child(7n +1) {
    color: #ed2a61;
}

.sec_cal .cal_wrap .day.disable {
    color: #ddd;
}

/* ligntbox 좌우측 화살표 항상 보이게 */
.lb-nav a.lb-next,
.lb-nav a.lb-prev{
	opacity:1;
}




/* 토글 */
.check_switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}
.check_switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.check_slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}
.check_slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}
input:checked + .check_slider {
  background-color: #FE3368;
}
input:focus + .check_slider {
  box-shadow: 0 0 1px #FE3368;
}
input:checked + .check_slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}
.check_slider.round {
  border-radius: 34px !important;
}
.check_slider.round:before {
  border-radius: 50% !important;
}
label.check_switch{margin:0px;}




/* 캡챠 자동등록(입력)방지 기본 -pc */
#captcha {display:inline-block;position:relative}
#captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden;}
#captcha #captcha_img {width:160px;height:60px;border:1px solid #e9e9e9;vertical-align:top;padding:0;margin:0}
#captcha #captcha_mp3 {position:absolute;top:0;left:161px;;margin:0;padding:0;width:31px;height:31px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer}
#captcha #captcha_mp3 span {position:absolute;top:0;left:0;width:31px;height:31px;background:url('../img/a_captcha.png') no-repeat;}
#captcha #captcha_reload {position:absolute;top:31px;left:161px;margin:0;padding:0;width:31px;height:31px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('../img/a_captcha.png') no-repeat  0 -30px;border-top:1px solid #ccc;text-indent:-999px}
#captcha #captcha_key {margin:0 0 0 33px;padding:0 5px;width:70px;height:60px;border:1px solid #b8c9c2;background:#f7f7f7;font-size:1.333em;font-weight:bold;text-align:center;line-height:2.8em;vertical-align:top}
#captcha #captcha_info {display:block;margin:5px 0 0;font-size:0.95em;letter-spacing:-0.1em}

/* 캡챠 자동등록(입력)방지 기본 - mobile */
#captcha.m_captcha audio {display:block;margin:0 0 5px;width:187px}
#captcha.m_captcha #captcha_img {width:160px;height:60px;border:1px solid #e9e9e9;margin-bottom:3px;margin-top:5px;display:block;}
#captcha.m_captcha #captcha_reload {position:static;margin:0;padding:0;width:31px;height:31px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('../img/a_captcha.png') no-repeat  0 -30px;text-indent:-999px}
#captcha.m_captcha #captcha_reload span{display:none;}
#captcha.m_captcha #captcha_key {margin:0;padding:0 5px;width:115px;height:29px;border:1px solid #b8c9c2;background:#f7f7f7;font-size:1.333em;font-weight:bold;text-align:center;line-height:29px;margin-left:3px}
#captcha.m_captcha #captcha_info {display:block;margin:5px 0 0;font-size:0.95em;letter-spacing:-0.1em}
#captcha.m_captcha #captcha_mp3 {width:31px;height:31px;background:url('../img/a_captcha.png') no-repeat; vertical-align:top;overflow:hidden;cursor:pointer;text-indent:-9999px;border:none}

.alert-custom {
  background-color: #FF325D; /* 코랄 색 */
  color: #fff;              /* 텍스트 색 */
  border: none;
}




/* 팝업창(gs-modal) 제목 영역 스타일 */
.gs-modal .header {
    font-size: 17px !important;   /* 제목 글씨 크기 (원하는대로 조절) */
    
    /* 제목 아래 분홍색 라인 */
    border-bottom: 2px solid #FF3170 !important; /* 라인 두께 */
}


.gs-modal .modal-container {
    overflow: hidden;
}

.gs-modal-css .body {
    border-bottom: none !important;
}

/* 쪽지 보내기 팝업의 메시지 입력칸 placeholder 스타일 수정 */
#drink_message_form textarea.form-control::placeholder {
    color: #999999;        /* 글자 색상을 원하시는 회색으로 변경 */
    font-weight: normal;   /* 글자 굵기를 보통(굵지 않게)으로 변경 */
}

/* 팝업 하단 전체 영역을 Flexbox 컨테이너로 설정 */
.gs-modal .footer {
    display: flex; /* Flexbox 레이아웃 활성화 */
    gap: 10px;     /* 버튼 사이의 간격을 10px로 설정 */
    padding: 0 10px 10px 10px; /* 팝업창 가장자리와의 여백 */
    border-top: none !important;
}

/* 각각의 버튼 공통 스타일 */
.gs-modal .footer .btn-confirm,
.gs-modal .footer .btn-cancel {
    flex: 1; /* 두 버튼이 공간을 1:1 비율로 똑같이 나눠가짐 */
    color: white;
    font-weight: bold;
    padding: 7px;
    text-align: center;
    border-radius: 8px;
    cursor: pointer;
    font-size: 16px;
}

/* 확인 버튼 배경색 */
.gs-modal .footer .btn-confirm {
    background-color: #20B2AA; 
}

/* 취소 버튼 배경색 */
.gs-modal .footer .btn-cancel {
    background-color: #FF3170;
}

.gs-modal .footer .btn-confirm:only-child {
    background-color: #5A62AC; 
}