@charset "utf-8";
/* CSS Document */

/*****************/
/* 전체 공용 css */
/*****************/
@font-face{font-family:'Pretendard Variable'; font-weight:45 920; font-style:normal; font-display:swap; src:url('../../../font/PretendardVariable.woff2') format('woff2-variations');}
@font-face{font-family:'Mont'; font-weight:normal; font-style:normal; font-display:swap; src:url('../../../font/Mont.woff2') format('woff2');}
@font-face{font-family:'MontHeavy'; font-weight:normal; font-style:normal; font-display:swap; src:url('../../../font/MontHeavy.woff2') format('woff2');}

html,body{font-family:'Pretendard Variable'; color:#ffffff; font-size:16px; width:100%; height:100%; margin:0; padding:0; letter-spacing:0em;}
div, a{position:relative; box-sizing:border-box; line-height:1.3em;}
a{display:block; text-decoration:none; color:#ffffff}
input{border:none; outline:none; padding:0px 5px; font-family:'Pretendard Variable'; background-color:rgba(0, 0, 0, 0); width:100%; height:100%; box-sizing:border-box; color:#ffffff; font-size:inherit;}
button, select {font-family:'Pretendard Variable';}
select{border:none;outline:none;cursor:pointer;appearance:none;}

::-webkit-scrollbar{width:10px;}
::-webkit-scrollbar-thumb{background-color:#c1c1c1; border-radius:5px;}
::-webkit-scrollbar-track{background-color:#f0f0f0;}
::-webkit-scrollbar:horizontal{height:10px;}
::-webkit-scrollbar-thumb:horizontal{background-color:#c1c1c1; border-radius:5px;}
::-webkit-scrollbar-track:horizontal{background-color:#f0f0f0; border-radius:5px;}

/* 전체 페이지 공통 css */
.wrapAll{width:100%; height:100%; overflow:auto; z-index:2; background-color:#000000;}
.wrapAll.studio{overflow:auto;}
body.submenu{height:auto;}
.wrapTopAll{width:100%; height:80px; border-bottom:1px solid #ffffff; display:flex;}
.wrapBottomAll{width:100%; height:calc(100% - 80px); display:flex;}
.wrapLeftAll{width:200px; height:100%; border-right:1px solid #ffffff;}
.wrapRightAll{width:calc(100% - 200px); height:100%;}

.wrapTopAll .wrapLeftAll{font-size:20px; display:flex; justify-content:center; align-items:center; font-weight:bold; border-right:none; text-align:center;}
.middleText{display:table-cell; vertical-align:middle;}

.wrapTopAll .wrapRightAll{display:flex; justify-content:space-between; align-items:center; padding:0px 30px;}
.wrapTopMenuAll{display:flex; gap:40px; font-size:16px; font-weight:600;}
.wrapTopMenu{opacity:0.7;}
.wrapTopMenu.selected, .wrapTopMenu:hover{opacity:1;}
.wrapTopMenu a:after{width:2px; height:12px; background-color:#ffffff; position:absolute; content:''; margin:5px 0px 0px 19px;}
.wrapTopMenu:last-child a:after{display:none;}
.wrapTopMyinfoAll{display:flex; gap:40px; font-weight:600;}
.wrapTopMyInfo a:before{width:2px; height:12px; background-color:#ffffff; position:absolute; content:''; margin:4px 0px 0px -19px;}

.wrapBottomAll .wrapLeftAll{padding:20px; overflow:auto;}
.wrapBottomAll .wrapRightAll{padding:20px;}
.wrapLeftAll.half, .wrapRightAll.half{width:50%;}
.wrapLeftAll.w30percent{width:30%;}
.wrapRightAll.w70percent{width:70%;}
.wrapLeftAll.flex{display:flex; gap:10px;}
.wrapLeftAll.flex .contentsContainer{width:calc(100% / 3);}
.wrapLeftAll.sep3, .wrapRightAll.sep3, .wrapCenterAll{width:calc(100% / 3);}
.wrapCenterAll{border-right:1px solid #ffffff; padding:20px;}
.inputFile{position:absolute; width:0px; height:0px;}

.flexContainer {display: flex; flex-direction: column;}

/* admin 스튜디오 관리 */
.contentsTitleContainer{width:100%; height:40px; display:flex; justify-content:space-between; align-items:center; margin-bottom:10px;}
.contentsTitle{font-size:18px; font-weight:700;}
.contentsBtnContainer{display:flex; gap:20px;}
.contentsBtn a{padding:5px 15px; border:1px solid #ffffff; font-weight:600;}
.contentsBtn.full a{background-color:#ffffff; color:#000000;}
.contentsBtn.disabled{opacity:0.5; pointer-events:none;}
.contentsContainer{width:100%; height:calc(100% - 50px); overflow:hidden; overflow-y:auto;}
.studioList{width:100%; height:45px; font-size:16px; display:flex; align-items:center; border-bottom:1px solid #ffffff; background-color:#000000; opacity:0.7;}
.studioList.selected{opacity:1;}
.handle{width:40px; height:100%; display:flex; justify-content:center; align-items:center;}
.studioListAll.newStudio a{pointer-events:none;}

.studioInfoContainer{width:100%; border-bottom:1px solid #ffffff;}
.studioInfoTitle{font-size:16px; font-weight:bold; border-bottom:1px dashed #cccccc; padding:20px 0px 10px;}
.studioInfoTitle .infoText{font-size:14px; color:#cccccc;}
.studioInfoInput{width:100%; height:40px;}
.studioInfoInput.menuImg{height:70px; display:flex; align-items:center; gap:20px;}
.studioInfoInput.infoText{height:auto;}
.menuPreview{width:100px; height:56px; display:flex; align-items:center; justify-content:center; overflow:hidden;}
.menuPreview img{width:100%;}
.inputFileLabel{padding:5px 15px; border:1px solid #ffffff; font-weight:600;}

/* admin 메뉴 관리 */
.studioMenu a{width:100%; font-size:16px; display:flex; align-items:center; border-bottom:1px solid #ffffff; background-color:#000000; margin-bottom:5px; opacity:0.7;}
.studioMenu.selected a, .studioMenu:hover a{opacity:1;}
.studioMenu.big a{height:55px;}
.studioMenu.small a{height:45px;} 
.studioMenu .name{width:calc(100% - 40px); height:100%;}
.studioSmallmenuContainer{margin-bottom:20px;}

.studioImageMenu a{width:100%; display:table; font-size:16px; border-bottom:1px solid #ffffff; opacity:0.7;}
.studioImageMenu.big a{height:45px;}
.studioImageMenu.small a{height:45px;}
.studioImageMenu.selected a, .studioImageMenu:hover a{opacity:1;}

/* admin 스튜디오 사진 */
.studioImage{width:335px; height:190px; overflow:hidden; border:1px solid #ffffff;}
.studioImage.selected{outline:5px solid #ffffff;}
.studioImage a{position:absolute; left:0px; top:0px; width:100%; height:100%;}
.studioImage img{object-fit:contain; width:100%; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);}
.studioImageDelBtn{position:absolute; right:5px; top:2px; width:20px; height:20px;}
.studioImageDelBtn a{width:20px; height:20px; border-radius:50%; background-color:#000000;}
.studioImageDelBtn a:before, .studioImageDelBtn a:after{position:absolute; content:''; width:15px; height:2px; background-color:#ffffff; margin:8px 0px 0px 3px;}
.studioImageDelBtn a:before{transform:rotate(45deg);}
.studioImageDelBtn a:after{transform:rotate(-45deg);}
/* .studioImageAll {width:100%; height:calc(100% - 50px); border:1px dashed #dddddd;} */
.studioImageAll {width:100%; height: auto; min-height: 80%; flex: 1 1 auto; border:1px dashed #dddddd; overflow-y: auto;}
.studioImageContainer{width:100%; display:flex; gap:10px; flex-wrap:wrap; padding:10px;}
.studioImageOptionAll{width:100%; height:50px; display:flex; gap:20px; align-items:center;}
.studioSelect{padding:5px 15px; border:1px solid #ffffff; outline:none; color:#ffffff; background-color:rgba(0, 0, 0, 0);}
.studioSelect option{padding:5px; background-color:#000000; color:#ffffff; border-radius:0px;}
.studioImageInfo { width: 100%; display: flex; flex-direction: column; gap: 15px; margin-top: 20px;}
.studioImageInfoHeader { display: flex; justify-content: space-between; align-items: center; }
.studioImageInfoDirectTitle { font-weight: 600;}
.studioImageInfoSaveButton { align-self: flex-end; }
.studioImageInfoSaveButton a { display: inline-block; padding: 8px 24px; background: #fff; color: #000; border-radius: 5px; font-weight: 600; }
.studioImageInfoText { min-height: 100px; max-height: 300px; resize: vertical; padding: 12px; font-size: 16px; border-radius: 5px; border: 1px dashed #dddddd; background: #000; color: #fff; font-family: 'Pretendard Variable'; }
.studioImageInfoText:focus { outline: none; }
.studioImageInfoDirect { display: flex; align-items: center; gap: 1rem;}
.studioImageInfoDirectItem { display: flex; gap: 0.5rem; align-items: center; }
.studioImageInfoDirect input[type='radio'] {width: 15px; height: 15px;}

.note-frame{font-family:'Pretendard Variable' !important; color:#ffffff !important;}

.cardAll{width:100%; max-width:1500px; display:flex;}
.cardAll.all{gap:10px; flex-wrap:wrap; border-radius:15px; overflow:hidden;}
.cardContainer{width:calc((100% - 20px) / 3); display:flex; flex-direction:column; gap:10px;}
.card{width:100%; height:280px; background-color:#252525; padding:10px 30px;}
.card.red1{background-color:#652d2a;}
.card.red2{background-color:#3b1a19;}
.card.red3{background-color:#b54a45;}
.card.gray1{background-color:#424242;}
.cardNum{font-size:80px; font-family:'Mont'; opacity:0.5;}
.cardTextContainer{position:absolute; left:0px; bottom:0px; padding:0px 30px 40px 30px; width:100%; display:flex; justify-content:space-between; align-items:flex-end;}
.cardTextLeftContainer {width: 100%;}
.cardTextLeftContainer .title{font-size:30px; font-weight:bold; margin-bottom:10px;}
.cardTextLeftContainer .contents{font-size:22px; color:rgba(255, 255, 255, 0.5);}
/*.cardTextIconContainer .icon{background-image:url("../image/icon/allIcon.png");}*/
.card3{height:570px;}
.card3 .cardTextContainer{display:flex; flex-direction:column; justify-content:space-between; height:calc(100% - 144px);}
.card3 .cardTextLeftContainer{/*margin-bottom:215px;*/}
.card3 .cardTextIconContainer{display:flex; justify-content:flex-end;}
.card1 .icon{width:92px; height:79px; background-image:url("../image/icon/studioAll_card1.png");}
.card2 .icon{width:103px; height:94px; background-image:url("../image/icon/studioAll_card2.png");}
.card3 .icon{width:193px; height:124px; background-image:url("../image/icon/studioAll_card3.png");}
.card4 .icon{width:75px; height:108px; background-image:url("../image/icon/studioAll_card4.png");}
.card5 .icon{width:88px; height:107px; background-image:url("../image/icon/studioAll_card5.png");}
.card6 .icon{width:142px; height:101px; background-image:url("../image/icon/studioAll_card6.png");}
.card7 .icon{width:84px; height:100px; background-image:url("../image/icon/studioAll_card7.png");}
.card8 .icon{width:72px; height:117px; background-image:url("../image/icon/studioAll_card8.png");}
.contentsSmall{padding-left:15px;}
.contentsSmall:before{position:absolute; width:8px; height:8px; background-color:rgba(255, 255, 255, 0.5); content:''; margin:10px 0px 0px -15px; border-radius:50%;}
.highlight{color:#ff554c; font-weight:bold;}
.cardLeftAll, .cardRightAll{width:50%; font-size:22px;}
.cardLeftAll{padding-right:20px;}
.cardLeftTitle{font-weight:bold; font-size:33px; margin-bottom:30px;}
.cardLeftSubTitle{font-weight:bold; font-size:25px; margin-bottom:15px;}
.cardLeftContents{color:#a7a7a7;}
.cardLeftContentsItem{margin-bottom: 30px;}
.cardLeftContents.main{margin-bottom:30px;}
.cardLeftContents.small{padding-left:15px; margin-bottom:10px;}
.cardLeftContents.small .bullet{font-size: 21px;}
.cardLeftContents.small:before {position:absolute;width:8px;height:8px;background-color:rgba(255,255,255,0.5);content:'';margin:10px 0 0 -15px;border-radius:50%;}
.studioCardContainer {width:100%;display:grid;grid-template-columns:repeat(4,1fr); gap:20px 28px ;margin-top:30px;font-size:24px; padding-left:16px;}

.studioCard{width:159px; height:180px; border-radius:8px;}
/* .studioCard:after{position:absolute; content:''; width:90px; height:1px; background-color:#454545; left:calc(50% - 45px); top:calc(100% + 10px); z-index:100;} */
.studioCard:after{position:absolute; content:''; width:90px; height:1px; background-color:#454545; left:calc(50% - 45px); top:calc(100% + 10px);}
.studioCard:nth-child(5):after, .studioCard:nth-child(6):after, .studioCard:nth-child(7):after, .studioCard:nth-child(8):after{display:none;}
.studioCard .icon{position:absolute; left:50%; top:calc(50% - 20px); transform:translate(-50%, -50%);}
.studioCard .text{position:absolute; left:0px; bottom:25px; width:100%; text-align:center; color:#a7a7a7;}
.studioCard.width .icon{width:72px; height:72px; background-image:url("../image/icon/studio_card1.png");}
.studioCard.floor .icon{width:82px; height:77px; background-image:url("../image/icon/studio_card2.png");}
.studioCard.wifi .icon{width:78px; height:63px; background-image:url("../image/icon/studio_card3.png");}
.studioCard.cooling .icon{width:79px; height:71px; background-image:url("../image/icon/studio_card4.png");}
.studioCard.time .icon{width:80px; height:84px; background-image:url("../image/icon/studio_card5.png");}
.studioCard.parking .icon{width:97px; height:60px; background-image:url("../image/icon/studio_card6.png");}
.studioCard.dressroom .icon{width:73px; height:72px; background-image:url("../image/icon/studio_card8.png"); }
.studioCard.member .icon{width:100%; text-align:center; background-image:none; font-size:30px; font-weight:bold; color:#a7a7a7;}
.studioCard.member .icon .big{font-size:60px; color:#ff554c; font-family:'MontHeavy';}
.studioContentsCardRight .studioCard{overflow:visible;}

.studioMenuPhotoNaviBtn{position:absolute; width:34px; height:64px; top:50%; transform:translateY(-50%);}
.studioMenuPhotoNaviBtn a{width:100%; height:100%; opacity:0.7;}
.studioMenuPhotoNaviBtn a:hover{opacity:1;}
.studioMenuPhotoNaviBtn.prev{left:25px;}
.studioMenuPhotoNaviBtn.next{right:25px;}
.studioMenuPhotoNaviBtn a:before, .studioMenuPhotoNaviBtn a:after{position:absolute; content:''; width:30px; height:2px; background-color:#ffffff; left:0px; box-shadow:0px 0px 2px 0px rgba(0, 0, 0, 0.1);}
.studioMenuPhotoNaviBtn.next a:before{transform:rotate(-45deg); top:40px;}
.studioMenuPhotoNaviBtn.next a:after{transform:rotate(45deg); top:20px;}
.studioMenuPhotoNaviBtn.prev a:before{transform:rotate(45deg); top:40px;}
.studioMenuPhotoNaviBtn.prev a:after{transform:rotate(-45deg); top:20px;}
.studioMenuPhotoNaviTitle{position:absolute; left:20px; top:15px; height:38px; border-radius:19px; padding:0px 20px; color:#ffffff; font-size:20px; background-color:rgba(0, 0, 0, 0.5); display:flex; justify-content:center; align-items:center;}
.studioMenuPhotoNaviNum{height:30px; padding:0px 8px; display:flex; justify-content:center; align-items:center; font-size:17px; border-radius:5px; border:3px solid #ffffff; position:absolute; right:25px; bottom:20px;}
.studioMenuPhotoNaviNum:after{position:absolute; content:''; width:100%; height:100%; border-radius:5px; border-bottom:3px solid #ffffff; border-right:3px solid #ffffff; left:5px; top:5px;}

/* 팝업 */
.popupMenuNaviSmallTitle{margin:10px 0px 10px 25px; font-size:16px; display:none; opacity:0.7;}
/*.popupMenuNaviContainer.selected .popupMenuNaviSmallTitle,*/ .popupMenuNaviContainer.open .popupMenuNaviSmallTitle{display:block;}
.popupMenuNaviSmallTitle.selected{opacity:1;}
.popupMenuNaviSmallTitle:before{width:10px; height:2px; background-color:#ffffff; position:absolute; content:''; margin:10px 0px 0px -15px;}
/* .popupAll.perspective{background-color:#1f1d1e;} */
.popupImageInfoContainer {display: none; position: fixed; width: 20rem; height: 17rem; padding: 2rem 2.5rem; background-color: rgba(0, 0, 0, 0.8); z-index: 100;}
.popupImageInfoContainer.leftTop {left: 100px; top: 100px;}
.popupImageInfoContainer.leftBottom {left: 100px; bottom: 100px;}
.popupImageInfoContainer.rightTop {right: 100px; top: 100px;}
.popupImageInfoContainer.rightBottom {right: 100px; bottom: 100px;}
.popupImageInfo {display: flex; flex-direction: column; gap: 1rem;}
.popupImageInfoIcon {display: block; width: 45px; height: 45px;}
.popupImageInfoContents {font-size: 1.125rem; color: #fff; line-height: 1.7; word-break: keep-all; white-space: pre-line;}

/* 스튜디오 예약현황/문의 */
.studioBooking{display:none; min-height:1500px;}

/* 스튜디오 예약 달력 */
.studioBookingCalendarAll{width:100%; padding:50px; background-color:#ffffff; border-radius:15px; margin-bottom:50px; color:#000000;}
.studioBookingCalendarTitle{font-size:30px; font-weight:700;}
.studioBookingCalendarTitle span{font-size:25px; font-weight:500; margin-left:20px;}
.studioBookingDateContainer{width:100%; display:flex; justify-content:center; align-items:center; gap:90px; margin:20px 0px; font-size:24px; font-weight:600;}
.studioBookingDateBtn a{width:15px; height:30px; /*background-color:rgba(0, 0, 0, 0.5);*/}
.studioBookingDateBtn a:before, .studioBookingDateBtn a:after{width:17px; height:2px; background-color:#000000; position:absolute; content:'';}
.studioBookingDateBtn.prev a:before{transform:rotate(45deg); top:19px;}
.studioBookingDateBtn.prev a:after{transform:rotate(-45deg); top:7px;}
.studioBookingDateBtn.next a:before{transform:rotate(-45deg); top:19px;}
.studioBookingDateBtn.next a:after{transform:rotate(45deg); top:7px;}
.studioBookingCalendarTr{width:100%; display:flex; border-bottom:1px solid #dddddd;}
.studioBookingCalendarTr.headTr{height:45px;}
.studioBookingCalendarTr.headTr .studioBookingCalendarTd{display:table;}
.studioBookingCalendarTd{font-size:20px; width:calc(100% / 7); border-right:1px solid #dddddd; padding:0px 10px; box-sizing:border-box;}
.studioBookingCalendarTd:last-child{border-right:none;}
.studioBookingCalendarTd.sun{color:#ff4d4d;}
/* .studioBookingCalendarTd.today{border:3px solid #a6a6a6; } */
.studioBookingCalendarTd.today{box-shadow: inset 0 0 0 2px #a6a6a6; }
.studioBookingCalendarTd.today .day{color: #a6a6a6}
/* .studioBookingCalendarTd.bookingDate{outline: 3px solid #e6281e;  } */
.studioBookingCalendarTd .day{width: fit-content;}
.studioBookingCalendarTd.bookingDate{box-shadow: inset 0 0 0 2px #ff4d4d; z-index: 10;}
.studioBookingCalendarTd.bookingDate .day{color: #ff4d4d}
.studioBookingCalendarDayContainer .studioBookingCalendarTd{padding:10px; min-height:200px; cursor: pointer;}
.bookingList{width:100%; font-size:15px; display:flex; gap:5px; align-items:center; color:#000000; overflow-x:hidden;}
.bookingList .icon{font-size:13px; border-radius:3px; background-color:#ff7e6d; display:flex; align-items:center; padding:0px 4px; color:#ffffff; font-weight:bold;}
.bookingList .name{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

/* 예약 문의 팝업 */
.studioBookingAskAll{position:absolute; left:0px; top:0px; width:550px; border-radius:15px; background-color:#ffffff; box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.35); color:#000000; overflow: hidden; z-index: 10001;}
/* .studioBookingAskAll{position:absolute; left:0px; top:0px; width:650px; border-radius:15px; background-color:#ffffff; box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.35); color:#000000; overflow-y: auto; max-height: 100vh; z-index: 10;} */
.studioBookingAskTitleContainer{width:100%; display:flex; justify-content:space-between; align-items:center; padding:10px 30px; background-color: #f1f1f1;}
.studioBookingAskTitleContainer .title{font-size:22px; font-weight:bold;}
.studioBookingAskTitleContainer .selectedDate{font-size:20px; margin-left: 1rem; font-weight: normal;}
.studioBookingAskTitleContainer .btnContainer{display:flex; align-items:center; gap:20px;}
.studioBookingAskTitleContainer .btnContainer .btn a{width:30px; height:35px; display:block;}
.studioBookingAskTitleContainer .btnContainer .btn.close a:before, .studioBookingAskTitleContainer .btnContainer .btn.close a:after{width:30px; height:2px; background-color:#000000; position:absolute; content:''; top:17px;}
.studioBookingAskTitleContainer .btnContainer .btn.close a:before{transform:rotate(45deg);}
.studioBookingAskTitleContainer .btnContainer .btn.close a:after{transform:rotate(-45deg);}
.studioBookingAskTitleContainer .btnContainer .btn.close a:hover:before, .studioBookingAskTitleContainer .btnContainer .btn.close a:hover:after{background-color:#e6281e;}
.studioBookingAskTitleContainer .btnContainer .btn.open a:after{position:absolute; content:''; width:25px; height:5px; border:2px solid #000000; left:3px; top:15px;}
.studioBookingAskTitleContainer .btnContainer .btn.open a:hover:after{border:2px solid #e6281e;}
.studioBookingAskContentsContainer{display: flex; flex-direction: column; gap: 0.5rem; background-color: #f1f1f1;}
.studioBookingAskContents{width: 100%; background-color: #ffffff; padding:15px 30px; }
.studioBookingAskContents.studio, .studioBookingAskContents.person{display: flex; align-items: center;}
.studioBookingAskContents.studio .title, .studioBookingAskContents.person .titleContainer{min-width: 30%; margin-bottom: 0;}
.studioBookingAskContents.studio .contents, .studioBookingAskContents.person .contents{width: 100%;}
.studioBookingAskContents .title{font-size:20px; font-weight:bold; }
.studioBookingAskContents .titleContainer{display:flex; justify-content:space-between; align-items:center; margin-bottom:12px;}
.studioBookingAskContents .titleContainer .title{margin-bottom:0px;}
.studioBookingAskContents .titleContainer .titleBtn a{color:#ffffff; font-size:18px; padding:5px 10px; border-radius:5px; box-shadow:0px 2px 4px rgba(0, 0, 0, 0.1); background-color: #4a4a4a; transition: background-color 0.3s ease;}
.studioBookingAskContents .titleContainer .titleBtn a:hover{background-color: #a6a6a6;}
.studioBookingAskSelect{width:100%; padding:8px 15px; border:1px solid #c5c5c5; border-radius:10px; font-size:18px; outline: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23000000' d='M6 8L0 0h12z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 15px center;}

.studioBookingAskAll {display:none;}
.studioBookingAskAll.open {display:block;}
.studioBookingAskAll.open .studioBookingAskTitleContainer .btnContainer .btn.open a:after{height:25px; top:5px;}

.studioBookingAskContents .contents{display: flex; flex-direction: column; gap: 0.7rem;}

/* 개인정보 입력 */
.askInfoContainer { display: flex; align-items: top; }
.askInfoContainer:first-child {margin-top: 8px;}
.askInfoTitle { display: block; font-size: 20px; font-weight: 600; margin: 8px 0; min-width: 30%; }
.askInfoContainer .require { color: #e6281e; margin-left: 4px; }
.askInfoInputWrap { width: 100%; }
.askInfoInputWrap.password, .askInfoInputWrap.email { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.askInfoInputWrap.email .emailInputWrap {display: flex; gap: 8px; align-items: center;}
.askInfoInput { width: 100%; background-color: #ffffff; border: 1px solid #c5c5c5; border-radius: 8px; padding: 8px 16px; color: #000000; font-size: 18px; outline: none; }
/* .askInfoInput.email {flex: 1;} */
.askInfoInput.password {margin-bottom: 8px;}
.askInfoInput::placeholder { color: #666666; }
.askInfoSelect { width: 100%; background-color: #ffffff; border: 1px solid #c5c5c5; border-radius: 8px; padding: 10px 15px; color: #000000; font-size: 18px; outline: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23000000' d='M6 8L0 0h12z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 15px center; }
.askInfoSelect option { background-color: #ffffff; color: #000000; }
.askInfoText { font-size: 16px; color: #666666; }

/* 시간 선택 */
.studioBookingAskContents .contents.time {display: grid; grid-template-columns: repeat(auto-fill, minmax(5rem, 1fr)); gap: 8px; width: 100%;}
.timeSelectContainer a{height:2rem; display:flex; justify-content:center; align-items:center; color:#000000; font-size:18px; border-radius:8px; border:1px solid #d2d2d2; box-shadow:0px 2px 4px rgba(0, 0, 0, 0.1);}
.timeSelectContainer a.selected, .timeSelectContainer a.click{background-color:#e6281e; color:#ffffff;}
.titleContainer .info{font-size:18px; font-weight:normal; margin-left:20px;}

.studioBookingPersonSelectContainer{width:220px; height:35px; border:1px solid #c4c4c4; border-radius:8px; display:flex; align-items:center;}
.studioBookingPersonSelectBtn a{width:70px; height:35px;}
.studioBookingPersonSelectBtn.disabled a{opacity:0.5; pointer-events:none;}
.studioBookingPersonSelectBtn a:before, .studioBookingPersonSelectBtn a:after{position:absolute; content:''; left:calc(50% - 10px); top:calc(50% - 2px); width:20px; height:4px; border-radius:2px; background-color:#3d3d3d;}
.studioBookingPersonSelectBtn.minus a:after{display:none;}
.studioBookingPersonSelectBtn.plus a:after{transform:rotate(90deg);}
.studioBookingPersonInput{color:#3d3d3d; font-size:18px; text-align:center; moz-appearance: textfield;}
.studioBookingPersonInput::-webkit-outer-spin-button, .studioBookingPersonInput::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
.bookingPersonAddInfoText{color:#e6281e; font-size:22px;}
.bookingMemo{width:100%; height:100px; border-radius:8px; border:1px solid #d1d1d1; outline:none; padding:16px; color:#000000; font-size:18px; font-family:'Pretendard Variable'; resize:none; box-sizing:border-box;}
/* 이용 동의 */
.bookingAgree{margin-bottom:0px;}
.bookingAgree .bookingAgreeCheck{display: flex; align-items: center; gap: 8px;}
.bookingAgree .bookingAgreeCheckbox{width:20px; height:20px; accent-color:#e6281e; border: none; cursor: pointer;}
.bookingAgree label{font-size:18px; color:#e6281e; font-weight: bold; text-decoration-line: underline; text-underline-offset: 6px; cursor: pointer;}
.bookingAgree span{padding-left: 40px; color: #616161; font-size: 16px;}
.bookingAgree .termsViewBtn { padding: 4px 12px; border: 1px solid #616161; border-radius: 4px; background: #fff; color: #616161; text-decoration: none; box-sizing: border-box; cursor: pointer; margin-left: 10px; }
.bookingAgree .termsViewBtn:after { content: "▼"; display: inline-block; margin-left: 10px; font-size: 10px; vertical-align: middle; color: #616161; }
/* 결제 정보 */
.studioBookingAskContents:last-child{padding-bottom: 20px;}
.studioBookingAskContents .contentTr{display:flex; padding-bottom:12px; justify-content:space-between; border-bottom: 1px solid #d2d2d2;}
.studioBookingAskContents .contentTr:last-child{border-bottom:none; align-items: center; padding-bottom:20px;}
.studioBookingAskContents .contentsTd.title{font-size:18px; font-weight:normal; margin-bottom: 0;}
.studioBookingAskContents .contentsTd.contents{font-size:18px; font-weight:bold; text-align:right;}
.contentsTd.contents.totalPrice{font-size:22px; color:#e6281e; margin-bottom: 0;}
/* 문의 버튼 */
.bookingBtn {display: flex; flex-direction: column; gap: 8px; padding-bottom: 8px;}
.bookingBtn a{width:100%; height:55px; background-color:#e7281e; font-size:20px; border-radius:10px; display:flex; justify-content:center; align-items:center;}
.bookingBtn.disable a{cursor:default; pointer-events:none; background-color:#999999; color:#ffffff;}


/****************/
/* front 페이지 */
/****************/
.subMenuContainerAll{margin-top:30px; margin-bottom: 10px;}
.subMenuContainer{gap:12px;}
.studioContentsAll{max-width:1500px; width:100%; margin:0 auto; padding-top:245px;}
.studioContentsTopAll{width:100%; height:616px; margin-bottom:80px;}
.subMenuContainerAll {width: auto;}
.studio_menuBtn a {width: 120px; overflow:hidden;}
/* .studio_menuBtn a:hover {opacity: 1;} */
.studio_menuBtn a:hover .text{color:#ffffff;}
/* .subMenuContainer.wide .studio_menuBtn a { width:120px; } */
.studio_menuBtn a .icon{width:100%; height:83px; margin-bottom:10px; overflow:hidden;}
.studio_menuBtn a .icon img{position:absolute; height: calc(100% + 10px); left:50%; top:50%; transform:translate(-50%, -50%); object-fit:contain;}
.studio_menuBtn a .text{width:100%; text-align:center; font-size:16px; color:#898989; transition:color 0.3s;}
.studio_menuBtn.selected a .icon{border:5px solid #ffffff;}
.studio_menuBtn.selected a .text{color:#ffffff;}

.studio_menuBtn.sticky a{position:relative;}
.studio_menuBtn.sticky a .icon{position:relative; z-index:1; transition:background 0.3s; margin-bottom: 0; height: 60px; transition: 0.3s;}
.studio_menuBtn.sticky a .icon::before {content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.328); z-index: 2; pointer-events: none;}
.studio_menuBtn.sticky a .icon img{z-index:1; object-fit: cover; width: 100%; height: auto;}
.studio_menuBtn.sticky a .text{position:absolute; left:0; top:0; height:60px; display:flex; align-items:center; justify-content:center; z-index:2; opacity:0; pointer-events:none;}
.studio_menuBtn.sticky a:hover .icon::after,.studio_menuBtn.sticky.selected a .icon::after{content:''; position:absolute; left:0; top:0; width:100%; height:100%; z-index:3; pointer-events:none;}
.studio_menuBtn.sticky a:hover .text,.studio_menuBtn.sticky.selected a .text{opacity:1; pointer-events:auto;}

.studioContentsSubmenu{margin:120px 0px;}
.studioContentsBottom.all {margin-bottom: 10rem;}
.studioContentsBottom.all .titleText{width:100%; font-size:40px; font-weight:600; text-align:center; margin-bottom:20px;}
.studioContentsBottom.all .studioAllMenuContainer{width:100%; display:flex; gap:10px; height:235px; border-radius:15px; overflow:hidden}
.studioContentsBottom.all .studioSubmenu{width:calc((100% - 50px) / 6); height:100%;}
.studioContentsBottom.all .studioSubmenu a{width:100%; height:100%;}
.studioContentsBottom.all .studioSubmenu a .icon{position:absolute; left:50%; top:calc(50% - 25px); transform:translate(-50%, -50%); opacity:1; transition:opacity 0.3s;}
.studioContentsBottom.all .studioSubmenu a .icon_hover{position:absolute; left:50%; top:calc(50% - 25px); transform:translate(-50%, -50%); opacity:0; transition:opacity 0.3s;}
.studioContentsBottom.all .studioSubmenu a:hover .icon{opacity:0;}
.studioContentsBottom.all .studioSubmenu a:hover .icon_hover{opacity:1;}
.studioContentsBottom.all .studioSubmenu a .text{position:absolute; left:0; bottom:0px; width:100%; text-align:center; height:65px; font-size:24px;}
.studioContentsBottom.all .studioSubmenu:nth-child(1) a .icon{width:81px; height:83px; background-image:url("../image/icon/studioAll_btn1.png");}
.studioContentsBottom.all .studioSubmenu:nth-child(1) a .icon_hover{width:81px; height:83px; background-image:url("../image/icon/studioAll_btn1_over.png");}
.studioContentsBottom.all .studioSubmenu:nth-child(2) a .icon{width:154px; height:77px; background-image:url("../image/icon/studioAll_btn2.png");}
.studioContentsBottom.all .studioSubmenu:nth-child(2) a .icon_hover{width:154px; height:77px; background-image:url("../image/icon/studioAll_btn2_over.png");}
.studioContentsBottom.all .studioSubmenu:nth-child(3) a .icon{width:116px; height:113px; background-image:url("../image/icon/studioAll_btn3.png");}
.studioContentsBottom.all .studioSubmenu:nth-child(3) a .icon_hover{width:116px; height:113px; background-image:url("../image/icon/studioAll_btn3_over.png");}
.studioContentsBottom.all .studioSubmenu:nth-child(4) a .icon{width:105px; height:97px; background-image:url("../image/icon/studioAll_btn4.png");}
.studioContentsBottom.all .studioSubmenu:nth-child(4) a .icon_hover{width:105px; height:97px; background-image:url("../image/icon/studioAll_btn4_over.png");}
.studioContentsBottom.all .studioSubmenu:nth-child(5) a .icon{width:94px; height:80px; background-image:url("../image/icon/studioAll_btn5.png");}
.studioContentsBottom.all .studioSubmenu:nth-child(5) a .icon_hover{width:94px; height:80px; background-image:url("../image/icon/studioAll_btn5_over.png");}
.studioContentsBottom.all .studioSubmenu:nth-child(6) a .icon{width:108px; height:82px; background-image:url("../image/icon/studioAll_btn6.png");}
.studioContentsBottom.all .studioSubmenu:nth-child(6) a .icon_hover{width:108px; height:82px; background-image:url("../image/icon/studioAll_btn6_over.png");}

.studioPhotoContainerTitle{font-size:33px; font-weight:bold; margin-bottom:20px;}
.studioPhotoContainerContents{width:100%; display:flex; gap:10px; flex-wrap:wrap;}
.studioPhoto{width:calc((100% - 20px) / 3); height:auto;}
.studioPhoto a{width:100%; height:auto; padding-top:calc(100% / 16 * 9); overflow:hidden;}
.studioPhoto a img{position:absolute; left:0px; top:0px; width:100%; height:auto; object-fit:contain;}
.studioPhotoContainer{margin-bottom:50px;}

.stickymenuAll {position:fixed; left:0px; top: 166px; width:100%; height:60px; background-color:#ffffff; z-index:90; opacity:0; transform:translateY(-20px); transition:opacity 0.3s, transform 0.3s;}
.stickymenuAll.show {opacity:1; transform:translateY(0);}
.stickymenuContainer{width:100%; max-width:1500px; height:100%; margin:0 auto; display:flex; align-items:center; justify-content:space-around;}
.stickyMenu a{display:flex; justify-content:center; align-items:center; font-size:22px; font-weight:bold; color:#9b9b9b;}
.stickyMenu a.selected{color:#000000;}
.stickyMenuLine{width:1px; height:24px; background-color:#cccccc;}

.popupMenuNaviContainer{padding:0px 5px; margin-bottom:20px;}
.popupMenuNaviTitleContainer a{display:flex; align-items:center; gap:10px;}
.popupMenuNaviTitleContainer .icon{width:0px; height:0px; border:7px solid transparent; border-bottom:10px solid #ffffff; top:-7px; opacity:0.7;}
.popupMenuNaviTitle{font-size:18px; font-weight:bold; margin-bottom:10px; opacity:0.7;}
.popupMenuNaviContainer.selected .popupMenuNaviTitle{opacity:1;}
.popupMenuNaviContainer.selected .icon{opacity:1;/* border:7px solid transparent; border-top:10px solid #ffffff; top:0px;*/}
.popupMenuNaviContainer.open .icon{border:7px solid transparent; border-top:10px solid #ffffff; top:0px;}
.popupMenuNaviDotContainer{width:100%; display:none; gap:10px; flex-wrap:wrap;}
.popupMenuNaviDotContainer.small{gap:7px; padding-left:25px;}
/*.popupMenuNaviContainer.selected .popupMenuNaviDotContainer,*/ .popupMenuNaviContainer.open .popupMenuNaviDotContainer{display:flex;}
/* .popupMenuNaviDot a{width:12px; height:12px; border-radius:50%; background-color:#ffffff; opacity:0.7;}
.popupMenuNaviDot a.selected, .popupMenuNaviDot a:hover{opacity:1;} */
.popupMenuNaviDot a{width:23px; height:23px; border-radius:3px; color:#ffffff; display:inline-flex; justify-content:center; align-items:center; opacity:0.7; font-size:10px; border:1px solid #ffffff;}
.popupMenuNaviDot a.selected, .popupMenuNaviDot a:hover{opacity:1; background-color:#ffffff; color:#000000;}
.popupImageAll .perspectiveImg { width:auto; }

.studioMenuAll{width:100%; height:50px; display:flex; justify-content:space-between; margin-bottom:50px; align-items:center; display:none;}
.studioContentsBottom .studioMenu a{font-size:24px; border:none; display:flex; justify-content:center; align-items:center; padding:0px 30px;}
.studioContentsBottom .studioMenu a:after{position:absolute; right:0px; width:1px; content:''; height:24px; background-color:#ffffff;}
.studio.booking{height:50px; width:190px;}
.studio.booking a{background-color:#e6281e; color:#ffffff; opacity:1; display:flex; justify-content:center; align-items:center; height:100%; border-radius:25px; width:100%; font-size:24px;}
.studioContentsCardAll{width:100%; display:flex; gap:20px;}
.studioContentsCardAll_test{width:100%; display:flex; gap:20px;}
.studioContentsCardRight{width:calc(50% - 10px);}
/* .studioContentsCardRight a{width:100%; height:50%; background-color:#1f1d1e;} */
.studioContentsCardRight a{width:100%;}
.studioContentsCardRight a img{width:100%;}
.studioContentsCardRight a .btn{position:absolute; right:20px; bottom:20px; width:46px; height:44px; background-image:url("../image/icon/frontIcon.png"); background-position:-100px 0px;}
.studioContentsCardLeft{width:calc(50% - 10px); font-size:24px;}
.studioContentsCardLeft_test{width:calc(50% - 10px); font-size:24px;}
.studioContentsAlertAll{width:100%; margin:50px 0px 100px; padding-top:50px; border-top:2px dotted #545454; display:flex;}
.studioContentsAlertLeftAll{width:170px; display:flex; justify-content:center; align-items:center;}
.studioContentsAlertLeftAll .icon{width:92px; height:81px; background-image:url("../image/icon/studioIcon.png"); background-position:-1200px 0px;}
.studioContentsAlertLeftAll .text{width:92px; margin-top:10px; color:#a7a7a7; font-size:24px; text-align:center;}
.studioContentsAlertRightAll{display:flex; flex-direction:column; justify-content:space-around;}
.studioContentsAlert{font-size:20px; color:#a7a7a7; padding-left:15px;}
.studioContentsAlert:before{position:absolute; content:''; width:8px; height:8px; background-color:#a7a7a7; border-radius:50%; margin:10px 0px 0px -15px;}
.studioContentsBottom.studio .studioPhotoAll{width:100%; display:flex; flex-wrap:wrap; gap:10px;}
.studioMenuPhotoAll{width:calc((100% - 10px) / 2); height: 420px; display: flex; align-items: center; overflow: hidden;}
.studioMenuPhotoAll a{width: 100%; height:100%;}
.studioMenuPhotoAll img{width: 100%; height:100%; object-fit: cover;}

.studioPhotoContainerBox {display: flex; gap: 10px; width: 100%;}
.studioPhotoContainerBox .studioPhotoContainer {width: calc((100% - 10px) / 2);}
.studioPhotoContainerBox .studioMenuPhotoAll {width: 100%;}
.studioContentsPhotoAll.half{display:flex; gap:10px; flex-wrap:wrap;}
.studioContentsPhotoAll.half .studioMenuPhotoAll{width:100%;}
.studioContentsPhotoAll.half .studioPhotoContainer{width:calc(50% - 5px);}
.studioPhotoContainer.half{width:calc(50% - 5px); display:inline-block; margin-right:10px;}
.studioPhotoContainer.half .studioMenuPhotoAll{width:100%;}

.studioDetailInfo {margin: 50px 0px 100px; padding: 0 40px; display: flex; flex-direction: column; gap: 20px;}
.studioDetailInfoTextIcon {display: flex; align-items: center; gap: 10px; margin-bottom: 15px;}
.studioDetailInfoTitle {font-size: 25px; }
.studioDetailInfoContents {font-size: 25px; color:#a7a7a7; text-indent: 40px;}

/* add 지도버튼 추가 2025-08-28 */
.studioDetailInfoMapIcon {display:flex; gap:64px; align-items:center; margin: 32px 0; padding-left: 40px;}
.studioDetailInfoMapIcon a {display: block; width: 120px; height: 120px;}
.naverMapLink {background-image: url('../image/icon/naver_map_dark.png'); background-size: contain; background-repeat: no-repeat; transition: background-image 0.5s ease;}
.naverMapLink:hover {background-image: url('../image/icon/naver_map.png');}
.googleMapLink {background-image: url('../image/icon/google_map_dark.png'); background-size: contain; background-repeat: no-repeat; transition: background-image 0.5s ease;}
.googleMapLink:hover {background-image: url('../image/icon/google_map.png');}

/* add 다운로드버튼 추가 2025-11-12 */
.studioBrochure {position:fixed; bottom:50px; right:50px; z-index:1000;}
.studioBrochureBtn {display:flex; align-items:center; background-color: #fff; border: none; cursor: pointer; font-weight: bold; font-size: 20px; gap:12px; justify-content:flex-end; max-width:65px; height:65px; border-radius: 37px; padding: 0px 15px;}
.studioBrochureBtn .studioBrochureBtnText{ pointer-events: none; opacity: 0; white-space:nowrap; color: #e6281e; }
.studioBrochureBtn:hover{max-width:500px; transition:max-width 0.3s;}
.studioBrochureBtn:hover .studioBrochureBtnText { opacity: 1; transition:opacity 0.3s;}
.studioBrochureBtnIcon {width: 35px; height: 35px; flex-shrink: 0; background-image: url('../image/icon/brochure.svg');background-repeat: no-repeat; background-size: contain; background-position: center; transition: background-image 0.3s ease;}
.studioBrochureBtn:hover .studioBrochureBtnIcon {background-image: url('../image/icon/brochure_hover.svg');}

/* add 스튜디오 링크복사 버튼 추가 2025-12-01 */
.studioLinkCopyContainer {position:fixed; bottom:125px; right:50px; z-index:1000;}
.studioLinkCopyBtn {display:flex; align-items:center; background-color: #fff; border: none; cursor: pointer; font-weight: bold; font-size: 20px; gap:8px; justify-content:flex-end; max-width:65px; height:65px; border-radius: 37px; padding: 0px 15px;}
.studioLinkCopyBtn .studioLinkCopyBtnText{ pointer-events: none; opacity: 0; white-space:nowrap; color: #e6281e; }
.studioLinkCopyBtn:hover{max-width:500px; transition:max-width 0.3s;}
.studioLinkCopyBtn:hover .studioLinkCopyBtnText { opacity: 1; transition:opacity 0.3s;}
.studioLinkCopyBtnIcon {width: 40px; height: 40px; flex-shrink: 0; background-image: url('../image/icon/share.svg');background-repeat: no-repeat; background-size: contain; background-position: center; transition: background-image 0.3s ease;}

/* 로그인 페이지 */
.loginTopText{width:100%; text-align:center; font-size:40px; font-weight:bold; margin-bottom:30px; user-select: none;}
.loginMiddleInputContainer{margin-bottom:10px; position: relative;}
.loginMiddleInputContainer .title{font-size:20px; margin-bottom:10px; user-select: none;}
.loginMiddleInputContainer .password-eye {display: none; position:absolute; right:25px; top:50%; transform:translateY(-50%); width:20px; height:20px; background-image:url("../image/icon/eyes.png"); background-size:contain; background-repeat:no-repeat; background-position:center; cursor:pointer; z-index:2;}
.loginMiddleInputContainer .password-eye.closed {background-image:url("../image/icon/eyes-none.png");}
.loginIput{width:100%; background-color:#4a4a4a; height: 60px; border-radius:8px; font-size:16px; padding:0px 25px;}
.loginMiddleBtnContainer{width:100%; display:flex; justify-content:space-between;}
.loginMiddleBtn a{font-size:20px; color:#dbdbdb !important; display:flex; align-items:center; gap:10px;}
.loginMiddleBtn a .icon{width:20px; height:20px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='30.25px' height='30.25px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(219, 219, 219)' stroke-width='3px' stroke-linecap='round' stroke-linejoin='round' fill='none' d='M22.574,27.574 L6.885,27.574 C4.123,27.574 1.885,25.335 1.885,22.574 L1.885,6.885 C1.885,4.123 4.123,1.885 6.885,1.885 L22.574,1.885 C25.335,1.885 27.574,4.123 27.574,6.885 L27.574,22.574 C27.574,25.335 25.335,27.574 22.574,27.574 Z'/%3E%3Cpath fill='none' stroke='rgb(219, 219, 219)' stroke-width='3px' stroke-linecap='round' stroke-linejoin='round' d='M9.574,14.574 L13.574,18.574 L20.574,11.574'/%3E%3C/svg%3E"); background-size:contain; background-repeat:no-repeat; background-position:center;}
.loginMiddleBtn a.selected .icon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='30.25px' height='30.25px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(254, 85, 78)' stroke-width='3px' stroke-linecap='round' stroke-linejoin='round' fill='none' d='M22.574,27.574 L6.885,27.574 C4.123,27.574 1.885,25.335 1.885,22.574 L1.885,6.885 C1.885,4.123 4.123,1.885 6.885,1.885 L22.574,1.885 C25.335,1.885 27.574,4.123 27.574,6.885 L27.574,22.574 C27.574,25.335 25.335,27.574 22.574,27.574 Z'/%3E%3Cpath fill='none' stroke='rgb(254, 85, 78)' stroke-width='3px' stroke-linecap='round' stroke-linejoin='round' d='M9.574,14.574 L13.574,18.574 L20.574,11.574'/%3E%3C/svg%3E");}
.loginFindBtnContainer{display:flex; gap:20px; align-items:center; font-size:20px;}
.loginFindBtn a:after{position:absolute; width:2px; height:17px; background-color:#ffffff; content:''; margin:6px 0px 0px 10px;}
.loginFindBtn:last-child a:after{display:none;}
.loginBtn a{margin:50px 0px 40px 0px; width:100%; height:70px; background-color:#e7281e; font-size:20px; border-radius:10px; display:flex; justify-content:center; align-items:center;}
.loginBtn.find a{height:70px; font-size:20px; margin:0;}
.loginBottomContaier {display:flex; flex-direction: column; gap: 8px;}
.loginBottomText{width:100%; text-align:center; font-size:18px;}
.loginBottomText a{display:inline-block; color:#fe554e; text-decoration:underline;}

/* 공통 */
.alertText {font-size:16px; color:#fe554e; display:inline; user-select: none; height: auto;}

/* 회원가입 페이지 */
.joinContainerAll{padding: 150px 0px 60px 0px;}
.joinContainerAll input {font-weight: 500; font-size: 17px;}
.joinContainer{width:500px; margin:0 auto; display:flex; flex-direction: column; gap: 30px;}
.joinTopText{width:100%; text-align:center; font-size:40px; font-weight:bold; user-select: none;}
.joinInputContainer{display: flex; flex-direction: column; gap: 24px; height: auto;}
.joinLabel{font-size:20px; flex:1; user-select: none; margin-bottom: 8px;}
.joinInputWrap{display: flex; width:100%; gap: 8px;}
.joinInputWrap.flexCol{flex-direction: column;}
.joinInputWrap.check{display:none;}
.joinInputWrapInner{display: flex; position: relative;}
.joinInputWrapInner .password-eye {display: none; position:absolute; right:25px; top:50%; transform:translateY(-50%); width:20px; height:20px; background-image:url("../image/icon/eyes.png"); background-size:contain; background-repeat:no-repeat; background-position:center; cursor:pointer; z-index:2;}
.joinInputWrapInner .password-eye.closed {background-image:url("../image/icon/eyes-none.png");}
.joinInputItem{display:flex; align-items:start; gap:8px; width:100%; flex-direction: column;}
.joinInput{flex:1; background-color:#4a4a4a; height:60px; border-radius:8px; font-size:16px; padding:0px 25px;}
.joinInput#mail, .joinInput#mailAuth {border-radius:8px 0 0 8px;}
.joinAuthBtn, .joinAuthCheckBtn {width:100px;height:60px;border-radius:8px;border:none;font-size:16px;cursor:pointer;font-weight:600;transition:background-color 0.2s ease; user-select: none;background-color:#808080; color:#ffffff;border-radius:0 8px 8px 0;}
.joinAuthBtn.disable, .joinAuthCheckBtn.disable {color:#a7a7a7;}
.joinAuthBtn:not(.disable):hover, .joinAuthCheckBtn:not(.disable):hover {background-color:#666666;}
.joinInfoTextWrap{display: flex; flex-direction: column; padding:  0 8px; font-size:16px; color:#a7a7a7;}
.joinInfoText {font-size:16px; color:#a7a7a7; display:inline; user-select: none;}
.joinInfoText a{color:#fe554e; text-decoration:underline; display:inline;}

.joinAgreeContainer{width:100%; background-color:#131313; font-size:16px; display: flex; flex-direction: column; gap: 8px;}
.joinAgreeItemContainer {padding: 20px; background: #4a4a4a; border-radius: 8px;}
.joinAllAgree {width: 100%; display: flex; align-items: center;}
.joinAgreeItem {display: flex; align-items: center; gap: 8px;}
.joinAgreeItem label {font-size: 16px; color: #a7a7a7; user-select: none;}
.joinAgreeItem label a {color: #a7a7a7; text-decoration: none;}
.joinTermsRequired {color: #e7281e; font-size: 14px; margin-left: 8px;}
.joinCheckbox{width:20px; height:20px; margin-right:8px; cursor:pointer; appearance:none; background-color:#ffffff; border-color:#ffffff; border-radius:4px;}
.joinCheckbox:checked {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='none' stroke='%23e7281e' stroke-width='5' d='M4 12l5 5L20 7'/%3E%3C/svg%3E"); background-position: center; background-repeat: no-repeat;}

.joinBtn {display: flex; flex-direction: column; gap: 8px;}
.joinBtn a{width:100%; height:70px; background-color:#e7281e; font-size:20px; border-radius:10px; display:flex; justify-content:center; align-items:center;}
.joinBtn.disable a{cursor:default; pointer-events:none; background-color:#999999; color:#ffffff;}
.joinBtn a:hover{opacity:1;}

/* 회원가입 성공 페이지 */
.loginContainer.joinSuccess {display: flex; flex-direction: column; gap: 40px;}
.joinOkContents{font-size: 20px; color:#efefef; user-select: none;}
.joinBottomBtn{display:flex; gap:24px; user-select: none; width: 100%;}
.joinBottomBtnItem{width:100%; height:70px; font-size:20px; border-radius:10px; display:flex; padding:0 30px; background-color:#4a4a4a; user-select: none;}
.joinBottomBtnItem{transition:all 0.3s ease;}
.joinBottomBtnItem:hover{background-color:#efefef; font-weight: 700;}
.joinBottomBtnItem:hover a{color:#4a4a4a;}
.joinBottomBtnItem a:before, .joinBottomBtnItem a:after{position:absolute; right:0px; content:''; width:13px; height:2px; background-color:#efefef; transition:background-color 0.3s ease;}
.joinBottomBtnItem:hover a:before, .joinBottomBtnItem:hover a:after{background-color:#4a4a4a;}
.joinBottomBtnItem a:before{transform:rotate(45deg); margin-top:-9px;}
.joinBottomBtnItem a:after{transform:rotate(-45deg); margin-top:9px;}
.joinBottomBtnItem a{width:100%; height:100%; display:flex; justify-content:start; align-items:center; color:#efefef; transition:color 0.3s ease;}
.pc-br {display: block;}
.mobile-br {display: none;}

/* 아이디/비밀번호 찾기 */
.loginMiddleContainer.find{display:flex; flex-direction:column; gap:28px;}
.pwFineInputContainer{ display:flex; flex-direction:column; gap:16px;}
.pwFineInputItem{display:flex; flex-direction: column; gap:8px;}
.pwTopText{width:100%; text-align:center; font-size:40px; font-weight:bold; margin-bottom:50px; user-select: none;}
.pwLabelText{font-size:20px; user-select: none;}
.pwEmailInput{width:100%; background-color:#4a4a4a; height:60px; border-radius:8px; font-size:16px; padding:0px 25px;}
.pwEmailFind {font-size:16px; color:#a7a7a7; display:inline; user-select: none;}
.pwEmailFind a{color:#fe554e; text-decoration:underline; display:inline;}
.pwFindText {font-size:18px; text-align: center; user-select: none;}
.pwFindBtn a{width:100%; height:70px; background-color:#e7281e; font-size:20px; border-radius:10px; display:flex; justify-content:center; align-items:center; user-select: none;}

/* 마이페이지 */
.myPageContainerAll{width:70%; margin:0 auto; padding:150px 0px; display:flex; align-items:flex-start;min-height:80vh;}
.myPageSideArea{width:30%; display:flex; flex-direction:column; gap:52px; padding-right:50px;}
.myPageSideTitle{font-size:30px; font-weight:bold; user-select: none;}
.myPageMiddleTitle{font-size:24px; user-select: none;}
.myPageSideBtn{display:flex; flex-direction:column; gap:20px; user-select: none;}
.myPageSideBtnItem{width:100%; height:70px; font-size:20px; font-weight:600; border-radius:10px; display:flex; padding:0 30px; background-color:#4a4a4a; user-select: none;}
.myPageSideBtnItem a:before, .myPageSideBtnItem a:after{position:absolute; right:0px; content:''; width:13px; height:2px; background-color:#dbdbdb;}
.myPageSideBtnItem a:before{transform:rotate(45deg); margin-top:-9px;}
.myPageSideBtnItem a:after{transform:rotate(-45deg); margin-top:9px;}
.myPageSideBtnItem a{width:100%; height:100%; display:flex; justify-content:start; align-items:center; color:#dbdbdb;}
.myPageSideBtnItem.active{background-color:#ffffff;}
.myPageSideBtnItem.active a{color:#000000;}
.myPageSideBtnItem.active a:before, .myPageSideBtnItem.active a:after{background-color:#000000;}

.myPageContentsArea{width:70%; padding-left:50px; font-size:20px; border-left:1px solid #4a4a4a;}
.myPageContentsTitle{font-size:30px; font-weight:bold; margin-bottom:60px; user-select: none;}
.myPageContentsContainer{display:flex; flex-direction:column; gap:32px;}
.myPageInfoContainer, .myPageAddressContainer{padding-bottom:32px; display:flex; flex-direction:column; gap:32px;}
/* .myPageInfoContainer{border-bottom:1px solid #4a4a4a;} */
.myPageInputContainer{display:flex; flex-direction:column; gap:12px;}
.myPageLabel{font-size:18px; width:150px; user-select: none;}

.myPageInputItem{display:flex; align-items:center; gap:8px; width:100%;}
.myPageInput{flex:1; position: relative;}
.myPageInput, .myPageSelect, .myPageAddress, .genderBtn{background-color:#4a4a4a; height:60px; border-radius:8px; font-size:16px;}
.myPageInput, .myPageAddress{padding:0px 25px;}
.myPageInput#name, .myPageInput #currentPw, .myPageInput #newPwCheck, .myPageInput #newPw, .myPageInput#zipcode{border-radius:8px 0 0 8px;}
.myPageInput #currentPw, .myPageInput #newPwCheck, .myPageInput #newPw {padding: 0;}
.myPageInput .password-eye {display: none; position:absolute; right:25px; top:50%; transform:translateY(-50%); width:20px; height:20px; background-image:url("../image/icon/eyes.png"); background-size:contain; background-repeat:no-repeat; background-position:center; cursor:pointer; z-index:2;}
.myPageInput .password-eye.closed {background-image:url("../image/icon/eyes-none.png");}

.myPageSelectContainer{display:flex; gap:8px; flex:1;}
.myPageSelect{width:calc((100% - 16px) / 3); padding:0 40px 0 20px; color:#dbdbdb; appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='19px' height='12px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(219, 219, 219)' stroke-width='2px' stroke-linecap='round' stroke-linejoin='round' opacity='0.302' fill='none' d='M15.194,2.609 L8.972,8.839 L2.751,2.609'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 15px center;}
.myPageSelect:focus{opacity:1; box-shadow:0 0 0 2px rgba(255, 255, 255, 0.2);}
.myPageSelect option{background-color:#4a4a4a; color:#dbdbdb; font-size:16px;}

.myPageChgBtn, .myPageSaveBtn{width:150px;height:60px;border-radius:8px;border:none;font-size:16px;cursor:pointer;font-weight:600;transition:background-color 0.2s ease; user-select: none;}
.myPageChgBtn{background-color:#ffffff;border-radius:0 8px 8px 0;}
.myPageChgBtn:hover{background-color:#e6e6e6;}
.myPageChgBtn.gray, .myPageSaveBtn{background-color:#808080; color:#ffffff;}
.myPageChgBtn.gray:hover, .myPageSaveBtn:hover{background-color:#666666;}
.myPageSaveBtn.right{margin-left:auto;}

.genderBtnContainer{display:flex; gap:8px; flex:1;}
.genderBtnContainer input[type="radio"]{display:none;}
.genderBtn{display:flex; justify-content:center; align-items:center; color:#dbdbdb; cursor:pointer; width:calc((100% - 8px) / 2);}
.genderBtnContainer input[type="radio"]:checked + .genderBtn{background-color:#ffffff; color:#000000;}

.deliveryInfoContainer{background-color:#4a4a4a;border-radius:8px;padding:15px 25px; font-size:16px;color:#dbdbdb;}
.deliveryInfoTitle{font-size:18px; font-weight:bold; margin-bottom:10px;}
.deliveryInfoText{font-size:16px; color:#a7a7a7;}

.marketingAgreeContainer{background-color: #4a4a4a; flex: 1; border-radius: 8px;padding:15px 15px; display:flex; justify-content: space-between;}
.marketingAgreeText{font-size:18px; font-weight:bold; color:#dbdbdb; user-select:none;}
.marketingAgreeInfo{display:flex; gap:24px; font-size: 16px; text-decoration:underline;}
.marketingAgreeLink{display:flex; align-items:center; gap:10px;}
.marketingAgreeItem{display: flex; align-items: center;}

/* 마이페이지 > 1:1 문의내역 */
.myPageAskContainer{display:flex; flex-direction:column; gap:20px;}
.myPageAskFilter {display:flex; gap:24px; justify-content:flex-end; user-select: none;}
.myPageAskFilterIcon{display:flex; align-items:center; gap:8px; font-size:18px;}
.myPageSelect.ask, .myPageSelect.ask option{width:130px; height:40px; font-size:18px;}

.myPageAskTable{width:100%; border-collapse:collapse; font-size: 18px;}
.myPageAskTable thead{background-color: #4a4a4a; color: #dbdbdb; height: 60px; user-select: none;}
.myPageAskTable thead tr th:first-child{border-radius: 8px 0 0 0;}
.myPageAskTable thead tr th:last-child{border-radius: 0 8px 0 0;}
.myPageAskTable th{text-align:center; height:50px; border-bottom:1px solid #4a4a4a; font-weight:600;}
.myPageAskTable td{height:50px; border-bottom:1px solid #4a4a4a; font-weight: 300;}
.myPageAskTable tbody tr{cursor: pointer;}
.myPageAskTable td.center{text-align:center;}
.myPageAskTable td.waiting{color:#fe554e;}
.myPageAskTable td.nodata{height:200px; text-align:center; color:#dbdbdb; cursor: default;}

.askBtn {width:200px; margin-left:auto; user-select: none;}
.askBtn a{width:100%; height:70px; background-color:#e7281e; font-size:20px; border-radius:10px; display:flex; justify-content:center; align-items:center; gap:10px;}

.askContentCell {padding: 30px 50px; background: #4a4a4a;}
.askContentTitle {display: block; font-size: 20px; color: #ffffff; font-weight: 700; border-bottom: 1px solid #dbdbdb; padding-bottom: 25px; text-align: center;}
.askContentText {font-size: 18px; color: #ffffff; line-height: 1.6; font-weight: 400;}
.askContentDetailRow {display:flex;align-items:center; padding:12px 0;border-bottom:1.5px solid #5a5a5a;}
.askContentDetailRow:last-child {border-bottom:none;margin-bottom:0;}
.askContentLabel {min-width:100px;font-weight:600;font-size:18px;display:flex;align-items:center;}
.askContentValue {color:#fff;font-size:18px;line-height:1.7;font-weight:400;}
.askAnswerBox {margin-top: 20px; padding: 20px; background: #ffffff; border-radius: 8px;}
.askAnswerTitle {display: block; font-size: 20px; color: #333; font-weight: 700; border-bottom: 1px solid #666; padding-bottom: 25px; text-align: center;}
.askAnswerText {font-size: 18px; color: #666; line-height: 1.6; font-weight: 500;}

/* 비회원 1:1문의 답변조회 */
.nonmemberContainerAll{min-height:calc(100vh - 263px); height:auto;}
.nonmemberContainer{position:absolute; left:50%; top:50%; transform:translateX(-50%) translateY(-50%); width:500px; color:#ffffff; padding:0px;}
.nonmemberTopText{width:100%; text-align:center; font-size:40px; font-weight:bold; margin-bottom:50px; user-select: none;}
.nonmemberInputContainer{display:flex; flex-direction:column; gap:16px; margin-bottom:25px;}
.nonmemberInputItem{ display:flex; flex-direction:column; gap:8px;}
.nonmemberLabelText{font-size:20px; user-select: none;}
.nonmemberInput{width:100%; background-color:#4a4a4a; height:60px; border-radius:8px; font-size:16px; padding:0px 25px;}
.nonmemberBtn a{width:100%; height:70px; background-color:#e7281e; font-size:20px; border-radius:10px; display:flex; justify-content:center; align-items:center; user-select: none;}

/* 비회원 1:1문의 내역 (마이페이지와 동일한 화면 사용) */
.myPageContentsTitle.nonmember{font-size:35px;margin-bottom:30px;}
.myPageContentsArea.nonmember{width:100%; font-size:20px; border-left:0;}

/* 공통 모달 */
.modal-container{position:fixed; top:0; left:0; width:100%; height:100%; z-index:99999;}
.modal-background{position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5);}
.modal-content{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); background:#fff; color: #4a4a4a; padding:30px; border-radius:8px; min-width:400px; display: flex; flex-direction: column; gap: 32px;}
.modal-header{text-align:center; font-size: 20px; font-weight: 700; user-select: none;}
.modal-body{text-align:center; font-size: 16px; line-height: 1.5;}
.modal-footer{text-align:center; display: flex; gap: 16px; justify-content: center; align-items: center; }
.modal-footer button{padding:8px 32px; border:none; border-radius:4px; cursor:pointer; font-size: 16px; font-weight: 600;}
.btn-confirm{background:#e7281e; color:#fff;}
.btn-cancel{background:#808080; color:#fff;}

/* 팝업 닫기버튼 */
.popupCloseBtn {right: 10px; top: 10px;}
.popupCloseBtn.contentImg{right:25px; top:25px;}
.popupMenuBtn {left: 365px;}


/* 스튜디오 예약 현황 (admin 사용) */
.studioContentsAll.admin{max-width:1800px; padding-top:50px;}
.studioContentsAll.admin .studioBookingCalendarTitle {display:flex; align-items:center; justify-content:space-between;}
.studioContentsAll.admin .studioBooking{display: block; min-height: auto;}
.studioContentsAll.admin .studioBookingDateContainer{margin: 20px 0px; font-size: 24px;}
.studioContentsAll.admin .studioBookingCalendarTd {font-size: 20px; cursor: auto;}
.studioContentsAll.admin .studioBookingCalendarTr.headTr {height: 35px;}
.studioContentsAll.admin .studioBookingCalendarDayContainer .studioBookingCalendarTd {min-height: 180px;}
.studioContentsAll.admin .bookingList {font-size: 10px; padding-bottom: 3px;}
.studioContentsAll.admin .bookingList .name {white-space: pre-line;}

/* 스튜디오 예약 문의 (admin 사용) */
.studioContentsAll.admin .askboardListContainer { width:100%; background:#fff; border-radius:15px; box-shadow:0 2px 8px rgba(0,0,0,0.04); padding:50px; margin-bottom:40px; }
.studioContentsAll.admin .askboardListHeader { display:flex; justify-content:space-between; align-items:center; margin-bottom:40px; }
.studioContentsAll.admin .askboardListTitle { font-size:30px; color:#222; font-weight:700; }
.studioContentsAll.admin .askboardListFilter { font-size:18px; color:#444; font-weight:500;}
.studioContentsAll.admin .askboardFilterSelect { padding:6px 36px 6px 12px; border:1px solid #aaa; border-radius:4px; font-size:15px; background:#fafafa; appearance:none; -webkit-appearance:none; -moz-appearance:none; background-image:url('data:image/svg+xml;utf8,<svg fill="gray" height="18" viewBox="0 0 24 24" width="18" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>'); background-repeat:no-repeat; background-position:right 12px center; background-size:18px 18px; cursor:pointer; }
.studioContentsAll.admin .askboardListTable { width:100%; border-collapse:collapse; margin-bottom:24px; }
.studioContentsAll.admin .askboardListTable th, .askboardListTable td { padding:12px 8px; text-align:center; font-size:16px; }
.studioContentsAll.admin .askboardListTable th { background:#f6f6f6; color:#222; border-bottom:2px solid #e7281e; }
.studioContentsAll.admin .askboardListTable tr { border-bottom:1px solid #ececec; transition:background 0.2s; padding: 10px 8px;}
.studioContentsAll.admin .askboardListTable tr.askboardEven { background:#fafafa; }
.studioContentsAll.admin .askboardListTable tr:hover { background:#f0f0f0; }
.studioContentsAll.admin .askboardListTable tr .askboardNew a {color: #e7281e; font-weight: 600;}
.studioContentsAll.admin .askboardListTable td a { color:#222; text-decoration:none; transition:color 0.2s; }
.studioContentsAll.admin .askboardListTable td a:hover { color:#e7281e; text-decoration:underline; }
.studioContentsAll.admin .askboardListEmpty { text-align:center; color:#aaa; font-size:16px; padding:32px 0; }
.studioContentsAll.admin .askboardPagination { display:flex; justify-content:center; gap:4px; list-style:none; padding:0; margin:0; }
.studioContentsAll.admin .askboardPagination li { display:inline-block; }
.studioContentsAll.admin .askboardPagination a, .askboardPagination li.selected { display:inline-block; min-width:32px; padding:6px 10px; margin:0 2px; border-radius:4px; font-size:15px; color:#222; background:#f6f6f6; text-align:center; text-decoration:none; transition:background 0.2s, color 0.2s; }
.studioContentsAll.admin .askboardPagination li.selected { background:#e7281e; color:#fff; font-weight:bold; }
.studioContentsAll.admin .askboardPagination a:hover { background:#e7281e; color:#fff; }

/* 스튜디오 예약 문의 상세 (admin 사용) */
.studioContentsAll.admin .askboardViewContainer { width:100%; background:#fff; border-radius:15px; box-shadow:0 2px 8px rgba(0,0,0,0.04); padding:50px; margin-bottom:40px; }
.studioContentsAll.admin .askboardViewHeader { display:flex; align-items:center; margin-bottom:30px; }
.studioContentsAll.admin .askboardViewTitle { font-size:30px; color:#222; font-weight:700; }
.studioContentsAll.admin .askboardViewTable { width:100%; border-collapse:collapse; margin-bottom:24px; border-top:2px solid #e7281e; border-bottom:2px solid #e32c24; }
.studioContentsAll.admin .askboardViewTable th, 
.studioContentsAll.admin .askboardViewTable td { padding:12px; text-align:left; font-size:16px; border-bottom:1px solid #ececec; }
.studioContentsAll.admin .askboardViewTable th.reservation, .studioContentsAll.admin .askboardViewTable td.reservation { border-bottom:1px solid #ffe2e0; }
.studioContentsAll.admin .askboardViewTable th { background:#f6f6f6; color:#222; width:180px; font-weight:500; }
.studioContentsAll.admin .askboardViewTable tr:last-child th,
.studioContentsAll.admin .askboardViewTable tr:last-child td { border-bottom:none; }
.studioContentsAll.admin .askboardViewTable .askboardViewSection { background:#fafafa; font-weight:600; color:#e7281e; text-align:center; }
.studioContentsAll.admin .askboardViewTable .askboardViewLabel { background:#f6f6f6; color:#444; width:140px; text-align:center; font-weight:600;}
.studioContentsAll.admin .askboardViewTable .askboardViewLabel.reservation { background:#fff3f3;}
.studioContentsAll.admin .askboardViewTable .askboardViewLabel.reservation.top { border-top: 2px solid #e32c24; color:#e32c24; background:#fff3f3;}
.studioContentsAll.admin .askboardViewTable .askboardViewValue { color:#222; }
.studioContentsAll.admin .askboardViewBtnArea { display:flex; gap:10px; margin-top:20px; justify-content:flex-start;}
.studioContentsAll.admin .askboardViewBtn { display:inline-block; min-width:120px; padding:6px 0; border-radius:6px; font-size:16px; color:#fff; background:#e32c24; text-align:center; font-weight:600; text-decoration:none; transition:background 0.2s; margin-left:10px;}
.studioContentsAll.admin .askboardAnswerTextarea { width:100%; min-width:0; max-width:100%; box-sizing:border-box; min-height:50px; resize:vertical; font-size:16px; padding:10px; border:1px solid #ccc; border-radius:6px; }
.studioContentsAll.admin .askboardAnswerBtnArea { width: 100%; text-align:right; margin-top: 5px;}
.studioContentsAll.admin .askboardAnswerBtn { display:inline-block; min-width:120px; padding:6px 0; border-radius:6px; font-size:16px; color:#fff; background:#e32c24; text-align:center; font-weight:600; text-decoration:none; transition:background 0.2s; margin-left:10px;}
.studioContentsAll.admin .addReservationBtn { display:inline-block; min-width:120px; padding:6px 0; border-radius:6px; font-size:16px; color:#fff; background:#e32c24; text-align:center; font-weight:600; text-decoration:none; transition:background 0.2s; margin-left:10px;}
.studioContentsAll.admin .askboardViewBtn:hover, .studioContentsAll.admin .askboardAnswerBtn:hover, .studioContentsAll.admin .addReservationBtn:hover { background:#b71c1c; }
.studioContentsAll.admin .askboardListBtn { display:inline-block; min-width:120px; padding:12px 0; border-radius:6px; font-size:16px; color:#fff; background:#888; text-align:center; font-weight:600; text-decoration:none; transition:background 0.2s;}
.studioContentsAll.admin .askboardListBtn:hover { background:#888; }
.studioContentsAll.admin .askboardViewSelect { padding:6px 36px 6px 12px; border:1px solid #888; border-radius:4px; font-size:15px; background:#fafafa; appearance:none; -webkit-appearance:none; -moz-appearance:none; background-image:url('data:image/svg+xml;utf8,<svg fill="gray" height="18" viewBox="0 0 24 24" width="18" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>'); background-repeat:no-repeat; background-position:right 12px center; background-size:18px 18px; cursor:pointer; }
.studioContentsAll.admin .askboardViewSelect:focus { outline:none; }
.studioContentsAll.admin .askboardViewArea { display:inline-block; position:relative; }
.askboardViewTable input {color: #222}

/* 스튜디오 회원 관리 (admin 사용) */
.studioContentsAll.admin .userListContainer { width:100%; background:#fff; border-radius:15px; box-shadow:0 2px 8px rgba(0,0,0,0.04); padding:50px; margin-bottom:40px; }
.studioContentsAll.admin .userListHeader { display:flex; justify-content:space-between; align-items:center; margin-bottom:40px; }
.studioContentsAll.admin .userListTitle { font-size:30px; color:#222; font-weight:700; }
.studioContentsAll.admin .userListFilter { font-size:18px; color:#444; font-weight:500;}
.studioContentsAll.admin .userFilterSelect { padding:6px 36px 6px 12px; border:1px solid #aaa; border-radius:4px; font-size:15px; background:#fafafa; appearance:none; -webkit-appearance:none; -moz-appearance:none; background-image:url('data:image/svg+xml;utf8,<svg fill="gray" height="18" viewBox="0 0 24 24" width="18" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>'); background-repeat:no-repeat; background-position:right 12px center; background-size:18px 18px; cursor:pointer; }
.studioContentsAll.admin .userListTable { width:100%; border-collapse:collapse; margin-bottom:24px; }
.studioContentsAll.admin .userListTable th, .userListTable td { padding:12px 8px; text-align:center; font-size:16px; }
.studioContentsAll.admin .userListTable th { background:#f6f6f6; color:#222; border-bottom:2px solid #e7281e; }
.studioContentsAll.admin .userListTable tr { border-bottom:1px solid #ececec; transition:background 0.2s; padding: 10px 8px;}
.studioContentsAll.admin .userListTable tr.userEven { background:#fafafa; }
.studioContentsAll.admin .userListTable tr:hover { background:#f0f0f0; }
.studioContentsAll.admin .userListTable tr .userNew a {color: #e7281e; font-weight: 600;}
.studioContentsAll.admin .userListTable td { color:#222; text-decoration:none; transition:color 0.2s; }
.studioContentsAll.admin .userListTable td:hover { color:#e7281e; text-decoration:underline; }
.studioContentsAll.admin .userListEmpty { text-align:center; color:#aaa; font-size:16px; padding:32px 0; }
.studioContentsAll.admin .userPagination { display:flex; justify-content:center; gap:4px; list-style:none; padding:0; margin:0; }
.studioContentsAll.admin .userPagination li { display:inline-block; }
.studioContentsAll.admin .userPagination a, .userPagination li.selected { display:inline-block; min-width:32px; padding:6px 10px; margin:0 2px; border-radius:4px; font-size:15px; color:#222; background:#f6f6f6; text-align:center; text-decoration:none; transition:background 0.2s, color 0.2s; }
.studioContentsAll.admin .userPagination li.selected { background:#e7281e; color:#fff; font-weight:bold; }
.studioContentsAll.admin .userPagination a:hover { background:#e7281e; color:#fff; }


@media screen and (max-width:1600px){
	.studioContentsTopAll{height:calc((616 * 100vw) / 1500); margin-bottom:calc((80 * 100vw) / 1500);}
	.stickymenuAll{height:calc((80 * 100vw) / 1500);}
	
	.studioContentsBottom.all .titleText{font-size:calc((40 * 100vw) / 1500);}
	.studioContentsBottom.all .card{height:calc((330 * 100vw) / 1500);}
	.studioContentsBottom.all .card{padding:calc((25 * 100vw) / 1500) calc((30 * 100vw) / 1500);}
	.studioContentsBottom.all .card.card3{height:calc((670 * 100vw) / 1500);}
	.studioContentsBottom.all .cardTextContainer{padding:0px calc((30 * 100vw) / 1500) calc((40 * 100vw) / 1500);}
	.studioContentsBottom.all .cardTextLeftContainer .title{font-size:calc((30 * 100vw) / 1500);}
	.studioContentsBottom.all .cardTextLeftContainer .contents{font-size:calc((20 * 100vw) / 1500);}
	.cardNum{font-size:calc((80 * 100vw) / 1500);}
	.stickyMenu a{font-size:calc((22 * 100vw) / 1500);}
	.studioContentsBottom.all .studioSubmenu a .text{font-size:calc((24 * 100vw) / 1500); height:calc((50 * 100vw) / 1500);}
	.studioContentsBottom.all .studioSubmenu a .icon{top:calc(50% - ((25 * 100vw) / 1500))}
	
	.card .icon{background-size:cover;}
	.card1 .icon{width:calc((92 * 100vw) / 1500); height:calc((79 * 100vw) / 1500);}
	.card2 .icon{width:calc((103 * 100vw) / 1500); height:calc((94 * 100vw) / 1500);}
	.card3 .icon{width:calc((193 * 100vw) / 1500); height:calc((124 * 100vw) / 1500);}
	.card4 .icon{width:calc((75 * 100vw) / 1500); height:calc((108 * 100vw) / 1500);}
	.card5 .icon{width:calc((88 * 100vw) / 1500); height:calc((107 * 100vw) / 1500);}
	.card6 .icon{width:calc((142 * 100vw) / 1500); height:calc((101 * 100vw) / 1500);}
	.card7 .icon{width:calc((84 * 100vw) / 1500); height:calc((100 * 100vw) / 1500);}
	.card8 .icon{width:calc((72 * 100vw) / 1500); height:calc((117 * 100vw) / 1500);}
	
	.studioContentsSubmenu{margin:calc((120 * 100vw) / 1500) 0px;}
	
	.studioContentsBottom.all .studioSubmenu a .icon{background-size:cover;}
	.studioContentsBottom.all .studioSubmenu:nth-child(1) a .icon{width:calc((81 * 100vw) / 1500); height:calc((83 * 100vw) / 1500);}
	.studioContentsBottom.all .studioSubmenu:nth-child(2) a .icon{width:calc((154 * 100vw) / 1500); height:calc((77 * 100vw) / 1500);}
	.studioContentsBottom.all .studioSubmenu:nth-child(3) a .icon{width:calc((116 * 100vw) / 1500); height:calc((113* 100vw) / 1500);}
	.studioContentsBottom.all .studioSubmenu:nth-child(4) a .icon{width:calc((105 * 100vw) / 1500); height:calc((97 * 100vw) / 1500);}
	.studioContentsBottom.all .studioSubmenu:nth-child(5) a .icon{width:calc((94 * 100vw) / 1500); height:calc((80 * 100vw) / 1500);}
	.studioContentsBottom.all .studioSubmenu:nth-child(6) a .icon{width:calc((108 * 100vw) / 1500); height:calc((82 * 100vw) / 1500);}
	.studioContentsBottom.all .studioAllMenuContainer{height:calc((235 * 100vw) / 1500);}
	
	.studioPhotoContainerTitle{font-size:calc((33 * 100vw) / 1500);}
	
	.studioContentsBottom .studioMenu a{font-size:calc((24 * 100vw) / 1500); padding:0px calc((30 * 100vw) / 1500);}
	.studio.booking{width:calc((190 * 100vw) / 1500); height:calc((50 * 100vw) / 1500);}
	.studio.booking a{border-radius:calc((25 * 100vw) / 1500); font-size:calc((24 * 100vw) / 1500);}	
	
	.studioContentsBottom.studio .studioContentsCardLeft{font-size:calc((24 * 100vw) / 1500);}
	.cardLeftTitle{font-size:calc((33 * 100vw) / 1500);}
  .cardLeftSubTitle{font-size:calc((25 * 100vw) / 1500);}
	.cardLeftContents.small:before{width:calc((8 * 100vw) / 1500); height:calc((8 * 100vw) / 1500); margin:calc((10 * 100vw) / 1500) 0px 0px calc((-15 * 100vw) / 1500);}
	
	.studioContentsBottom.studio .studioCard{padding:0px;}
	.studioCard.member .icon{width:100%; text-align:center; background-image:none; font-size:30px; font-weight:bold; color:#a7a7a7;}
	.studioCard.member .icon .big{font-size:60px; color:#ff554c; font-family:'MontHeavy';}
	.studioContentsAlertAll{margin:calc((50 * 100vw) / 1500) 0px calc((100 * 100vw) / 1500); padding-top:calc((50 * 100vw) / 1500);}
	.studioContentsAlertLeftAll .text{font-size:calc((24 * 100vw) / 1500);}
	.studioContentsAlert{font-size:calc((20 * 100vw) / 1500);}
	.studioContentsAlert:before{width:calc((8 * 100vw) / 1500); height:calc((8 * 100vw) / 1500); margin:calc((10 * 100vw) / 1500) 0px 0px calc((-15 * 100vw) / 1500);}
	
	.studioMenuPhotoNaviTitle{font-size:calc((20 * 100vw) / 1500); height:calc((38 * 100vw) / 1500); border-radius:calc((19 * 100vw) / 1500);}
	.studioMenuPhotoNaviNum{font-size:calc((17 * 100vw) / 1500); height:calc((30 * 100vw) / 1500);}

  
}

@media screen and (min-width:1440px) and (max-width:1600px){
	/* 노트북 사이즈 대응 */
  .studioContentsAll {max-width: 1200px;}
	.nonmemberContainerAll {height: 100vh;}	
  .loginTopText {margin-bottom: 10px;}
  .loginBtn a {margin: 20px 0;}
	.studio_menuBtn a {width: 100px; height: 100%;}
	.studio_menuBtn a .icon {height: 65px;}
	.stickymenuAll {height: 55px; top: 167px !important; }
  .studioContentsBottom.all .titleText, .cardLeftTitle, .studioPhotoContainerTitle {font-size: 30px;}
	.studioContentsSubmenu {margin: 90px 0px;}
  .studioContentsBottom .studioMenu a, .studio.booking a, .studioContentsCardLeft, .studioCardContainer, .stickyMenu a {font-size: 20px;}
  .studio.booking {width: 175px; margin-left: 20px;}
  .studioCard {width: 130px; height: 185px;}
  .studioContentsTopAll {margin-bottom: 0;}
  .studioContentsBottom.studio .studioContentsCardLeft {font-size: calc((22 * 100vw) / 1500);}
  .studioDetailInfoContents {font-size: calc((20 * 100vw) /1440); }
  /* add 지도버튼 추가 2025-08-28 */
  .studioDetailInfoMapIcon a {width: calc((88 * 100vw) /1440); height: calc((88 * 100vw) /1440);}
}

@media screen and (max-width:1000px){
	.studioContentsBottom.studio .studioContentsCardAll{flex-direction:column;}
	.studioContentsBottom.studio .studioContentsCardAll_test{flex-direction:column;}
	.studioContentsBottom.studio .studioContentsCardLeft, .studioContentsBottom.studio .studioContentsCardRight{width:100%;}
  .studioMenuPhotoAll {height: 230px;}
  .stickymenuAll { top: 160px;}
	
	.studioCard{width:calc((159 * 100vw) / 900); height:calc((159 * 100vw) / 900);}
	.studioCard .icon{background-size:cover;}
	.studioCard.width .icon{width:calc((72 * 100vw) / 900); height:calc((72 * 100vw) / 900);}
	.studioCard.floor .icon{width:calc((82 * 100vw) / 900); height:calc((77 * 100vw) / 900);}
	.studioCard.wifi .icon{width:calc((78 * 100vw) / 900); height:calc((63 * 100vw) / 900);}
	.studioCard.cooling .icon{width:calc((79 * 100vw) / 900); height:calc((71 * 100vw) / 900);}
	.studioCard.time .icon{width:calc((80 * 100vw) / 900); height:calc((84 * 100vw) / 900);}
	.studioCard.parking .icon{width:calc((97 * 100vw) / 900); height:calc((60 * 100vw) / 900);}
}

/* 반응형 (모바일) */
@media screen and (max-width: 768px) {
  .pc-br {display: none;}
	.mobile-br {display: block;}

  /* 로그인 */
  .loginContainerAll {width:100%; height:calc(100vh - 100px); display:flex; justify-content:center; align-items:center;}
  .loginContainer {width:100%; max-width:500px; padding:30px;}
  .loginTopText {font-size:36px;}
  .loginIput {height:60px; font-size:18px; padding:0 25px;}
  .loginMiddleBtn a {font-size:20px;}
  .loginFindBtnContainer {font-size:20px;}
  .loginBtn a {height:65px; font-size:20px;}
  .loginBottomText {font-size:20px;}

  /* 회원가입 */
  .joinContainerAll {width: 100%; display: flex; justify-content: center; align-items: center; padding:100px 0 60px 0;}
  .joinContainer {width: 100%; max-width: 500px; padding: 30px;}
  .joinTopText {font-size: 36px; margin-bottom: 40px;}
  .joinLabel {font-size: 24px;}
  .joinInput {height: 65px; font-size: 20px; padding: 0 25px;}
  .joinAuthBtn, .joinAuthCheckBtn {height: 65px; font-size: 20px;}
  .joinInfoText {font-size: 18px;}
  .joinAgreeContainer {font-size: 20px;}
  .joinBtn a {height: 68px; font-size: 25px;}
  .popupContentsAll {width: 90%; max-width: 500px;}

  /* 회원가입 성공 */
  .joinBottomBtn{flex-direction: column;}

  /* 비회원 1:1문의 답변 */
  .nonmemberContainer {width:100%; max-width:500px; padding:40px;}
  .nonmemberTopText {font-size:36px; margin-bottom:40px;}
  .nonmemberInputContainer {gap:30px; margin-bottom:40px;}
  .nonmemberLabelText {font-size:24px;}
  .nonmemberInput {height:65px; font-size:20px; padding:0 25px;}
  .pwFindBtn.find a {height:68px; font-size:25px;}

  /* 아이디/비밀번호 찾기 */
  .loginContainerAll {width:100%; height:calc(100vh - 100px); display:flex; justify-content:center; align-items:center;}
  .loginContainer {width:100%; max-width:500px; padding:30px;}
  .pwTopText {font-size:36px; margin-bottom:40px;}
  .pwLabelText {font-size:24px;}
  .pwEmailInput {height:65px; font-size:20px; padding:0 25px;}
  .pwEmailFind {font-size:20px;}
  .pwFindText {font-size:20px; margin:30px 0;}
  .pwFindBtn.find a {height:68px; font-size:25px;}
  .loginBtn.find a {height:68px; font-size:25px;}

  /* 마이페이지 & 문의내역 */
  .myPageContainerAll { flex-direction: column; width: 90% }
  .myPageSideArea { width: 100%; margin-bottom: 30px; padding-right: 0; }
  .myPageSideTitle { font-size: 30px; }
  .myPageSideBtn { flex-direction: row; }
  .myPageSideBtnItem a { font-size: 20px; }
  .myPageSelect{padding: 0 15px 0 10px; background-position: right 5px center;}
  .myPageContentsArea { width: 100%; padding-left: 0; border-left:0; }
  .myPageContentsTitle { font-size: 28px; }
  .myPageAskFilter { font-size: 18px; }
  .myPageSelect.ask { font-size: 18px; }
  .myPageAskTable th, .myPageAskTable td { font-size: 18px; padding: 15px 10px; }
  .askBtn a { font-size: 18px; }
  .genderBtn {height: 60px;}
  .myPageSelect option, .myPageSelect.ask option {font-size: 16px; padding: 5px 10px;}
  .askContentTitle, .askAnswerTitle, .askContentText, .askAnswerText {font-size: 16px;}
  .askContentLabel, .askContentValue {font-size: 16px;}

  /* 비회원 1:1문의 내역 (마이페이지와 동일한 화면 사용) */
  .myPageContentsTitle.nonmember{font-size:28px;margin-bottom:15px;}
  .myPageContentsArea.nonmember{width:100%; font-size:16px; border-left:0;}
  .myPageSideTitle.nonmember{margin-bottom:15px; font-size:24px;}

  /* 스튜디오 예약 start */
  .studioContentsAll { padding:270px 20px 0 20px; }
  .studioContentsBottom.all .studioAllMenuContainer { gap:16px; }
  .studioAllMenuContainer { flex-wrap:wrap; height:auto !important; justify-content:center; align-items:stretch; }
  .studioMenuAll { display:flex; flex-wrap:wrap; gap:8px 0; width:100%; height:100%;  display:none;}
  .studioMenuAll .studioMenu { width:48%; min-width:140px; margin-bottom:8px; box-sizing:border-box; }
  .studioMenuAll .studio.booking { width:100%; margin-bottom:0; margin-top:8px; order:99; }
  .studioContentsBottom .studioMenu:nth-child(2n) a:after { display:none; }
  .studioContentsBottom .studioMenu a { font-size:calc((24 * 100vw) /768); padding:0 calc((30 * 100vw) /768); }
  .studio.booking { width:calc((190 * 100vw) /768); height:calc((65 * 100vw) /768); }
  .studio.booking a { border-radius:calc((25 * 100vw) /768); font-size:calc((24 * 100vw) /768); }
  .stickymenuContainer { justify-content:space-between; padding:0 30px; overflow:scroll; overflow-x:auto; overflow-y:hidden; white-space:nowrap; gap:20px; }
  .stickymenuContainer .studio.booking { width:100%; min-width:150px; height:50px; }
  .stickymenuAll { height:calc((80 * 100vw) /768); top: 160px !important; }
  .stickyMenu a { font-size:calc((22 * 100vw) /768); }
  .subMenuContainer { padding:0 20px; }
  .studio_menuBtn a { width: 96px; }
  .studio_menuBtn a .text { font-size:calc((22 * 100vw) /768); }

  /* 스튜디오 서브메뉴 */
  .studioContentsBottom.all .studioSubmenu { width:calc(50% - 8px); min-width:140px; height:120px; }
  .studioContentsBottom.all .studioSubmenu a .icon { width:48px; height:48px; }
  .studioContentsBottom.all .studioSubmenu a .text { font-size:20px; height:32px; line-height:32px; bottom:8px; }
  .studioContentsBottom.all .studioSubmenu:nth-child(1) { border-top-left-radius:18px; }
  .studioContentsBottom.all .studioSubmenu:nth-child(2) { border-top-right-radius:18px; }
  .studioContentsBottom.all .studioSubmenu:nth-child(5) { border-bottom-left-radius:18px; }
  .studioContentsBottom.all .studioSubmenu:nth-child(6) { border-bottom-right-radius:18px; }

  /* 스튜디오 사진 */
  .studioMenuPhotoAll {height: 145px;}
  .studioPhotoContainerTitle { font-size:calc((28 * 100vw) /768); }
  .studioPhoto { width:calc(50% - 8px); min-width:120px; max-width:100%; }
  .studioPhoto a { padding-top:56.25%; width:100%; position:relative; overflow:hidden; background:#222; }
  .studioPhoto a img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; }
  .card { font-size:1.3rem; padding:48px 36px; min-height:280px; }
  .card.red3.card3 { min-height:570px; }
  .cardNum { font-size:3.5rem; text-align:right; }
  .studioContentsBottom.all .cardTextLeftContainer .title { font-size:calc((24 * 100vw) /768); }
  .studioContentsBottom.all .cardTextLeftContainer .contents { font-size:calc((18 * 100vw) /768); }
  .studioCardContainer { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; font-size:calc((22 * 100vw) /768); padding-left: 0;}
  .studioCard { width:calc((198 * 100vw) /768); height:calc((159 * 100vw) /768); }
  .studioCard:after{display:none;}
  .studioCard.line:after{display:none;}
  .studioContentsAlertLeftAll { width:250px; }
  .studioContentsAlertAll { margin:calc((50 * 100vw) /768) 0 calc((100 * 100vw) /768); padding-top:calc((50 * 100vw) /768); }
  .studioContentsAlertLeftAll .text { font-size:calc((24 * 100vw) /768); }
  .studioContentsAlert { font-size:calc((22 * 100vw) /768); }
  .studioContentsAlert:before { width:calc((8 * 100vw) /768); height:calc((8 * 100vw) /768); margin:calc((10 * 100vw) /768) 0 0 calc((-15 * 100vw) /768); }
  .cardLeftTitle { font-size:calc((30 * 100vw) /768); }
  .cardLeftSubTitle { font-size:calc((25 * 100vw) /768); }
  .cardLeftContents.main { font-size:calc((28 * 100vw) /768); }
  .cardLeftContents.small { font-size:calc((22 * 100vw) /768); }
  .cardLeftContents.small .bullet { font-size:calc((21 * 100vw) /768); }
  .cardLeftContents.small:before { width:calc((8 * 100vw) /768); height:calc((8 * 100vw) /768); margin:calc((10 * 100vw) /768) 0 0 calc((-15 * 100vw) /768); }
  .studioMenuPhotoNaviTitle { font-size:calc((20 * 100vw) /768); height:calc((38 * 100vw) /768); border-radius:calc((19 * 100vw) /768); }
  .studioMenuPhotoNaviNum { font-size:calc((17 * 100vw) /768); height:calc((30 * 100vw) /768); }
  .studioContentsCardRight a img { position:static; left:auto; top:auto; transform:none; }
  .studio_menuBtn a .icon {height: 65px;}
  .studioCard:last-child{margin-bottom:0;}
  .popupImageAll {position: relative;}
  .popupImageInfoContainer {width: 100%; left: 0 !important;}
  .popupImageInfoIcon {width: 30px; height: 30px;}

  .studioDetailInfo {padding: 0 32px;}
  .studioDetailInfoTitle {font-size:calc((25 * 100vw) /768);}
  .studioDetailInfoContents {font-size:calc((25 * 100vw) /768); text-indent: 0;}
  .studioDetailInfoTextIcon img {width: 25px; height: 25px;}
  .studioCard.member .icon .big{font-size:calc((35 * 100vw) / 768);}

  /* add 지도버튼 추가 2025-08-28 */
  .studioDetailInfoMapIcon {gap:calc((180 * 100vw) /768); margin: calc((28 * 100vw) /768) 0; padding-left: calc((60 * 100vw) /768);}
  .studioDetailInfoMapIcon a {width: calc((65 * 100vw) /768); height: calc((65 * 100vw) /768);}
  .naverMapLink {background-image: url('../image/icon/naver_map.png'); background-size: contain; background-repeat: no-repeat; }
  .googleMapLink {background-image: url('../image/icon/google_map.png'); background-size: contain; background-repeat: no-repeat; }

  /* 스튜디오 예약 달력 */
  .studioBookingCalendarAll { padding:0; }
  .studioBookingCalendarTitle { padding:30px 50px; font-size:calc((28 * 100vw) /768); }
  .studioBookingCalendarTitle span { font-size:calc((24 * 100vw) /768); }
  .studioBookingDateContainer { margin-bottom:30px; }
  .studioBookingCalendarDayContainer .studioBookingCalendarTd { min-height:150px; height:auto; padding:5px; }

  /* 예약 */
  .bookingList { flex-direction:column; align-items:flex-start; word-break:break-all; }
  .bookingList .name { text-overflow:ellipsis; }
  .studioBookingAskAll { width:auto; height: 73vh; overflow-y: auto; touch-action: auto;}
  .popupImageAll { height:100%; }
  .popupImageAll .perspectiveImg { width:100%; }
  .studioBookingAskTitleContainer { padding:12px 40px; }
  .studioBookingAskTitleContainer .title { font-size:calc((28 * 100vw) /768); }
  .studioBookingAskTitleContainer .title span { font-size:calc((24 * 100vw) /768); }
  .studioBookingAskContents { padding:20px 40px; }
  /* 스튜디오 예약 end */

  /* 모달 */
  .modal-header { font-size:calc((28 * 100vw) /768); }
  .modal-body { font-size:calc((24 * 100vw) /768); }
  .modal-footer button { font-size:calc((24 * 100vw) /768); }

  .popupDragging {overflow: hidden !important; touch-action: none !important;}

  /* 브로슈어 다운로드 버튼 */
  .studioBrochure {bottom:20px; right:20px; z-index:1000;}
  .studioBrochureBtn{max-width:300px; transition:max-width 0.3s;}
  .studioBrochureBtn .studioBrochureBtnText { opacity: 1; transition:opacity 0.3s;}
  .studioBrochureBtnIcon {background-image: url('../image/icon/brochure_hover.svg');}

  /* 스튜디오 주소 복사 버튼 */
  .studioLinkCopyContainer {bottom:100px; right:20px; z-index:1000;}
  .studioLinkCopyBtn {max-width:300px; transition:max-width 0.3s;}
  .studioLinkCopyBtn .studioLinkCopyBtnText { opacity: 1; transition:opacity 0.3s;}
  .studioLinkCopyBtnIcon {background-image: url('../image/icon/share.svg');}
}