@charset "UTF-8";

/* common */
.place .visualwrap{background: #F4F4F4;}
.place .visualwrap .inner{background-image: url('/resources/renewal/images/place/visual.png'); }

/* 매장안내 */
.placeinfo img{display: block; width: 100%; margin:0 auto;}
.placeinfo .subnavi ul{display: inline-block;}
.placeinfo .subcontent{text-align: center;}
.placeinfo h3{padding-top:97px; font-size: 30px; letter-spacing: -0.75px;}
.placeinfo h3+p{margin-top:25px; line-height: 34px;}
.placeinfo h3+p+img{margin-top:52px;}
.placeinfo .subcontent ul{display: flex; flex-direction: row; flex-wrap: wrap; padding:55px 0 100px; }
.placeinfo .subcontent ul li{width: calc(25% - 15px);margin-left:20px; font-size: 20px; font-weight: 300; letter-spacing: -0.6px; line-height: 28px;}
.placeinfo .subcontent ul li:first-child{margin-left: 0;}
.placeinfo .subcontent ul li img{width:80px; margin-bottom:32px;}
.placeinfo .subcontent ul+h3{padding-top: 110px;}
.placeinfo .subcontent ul+h3+p{margin-top: 27px;}

/* 가까운 매장 찾기 */
strong.vallabel{display: inline-block; width: 215px; border-radius: 20px; font-weight:400; font-size:18px; letter-spacing:-0.45px; line-height: 1; padding: 12px 0 8px; color: #fff; text-align: center;} /* 2023-03-29 수정 */
/* 2023-05-18, 2023-06-01 수정 s */
strong.vallabel.vallabel1 {background: #30BFDB;}
strong.vallabel.vallabel2 {background: #24BFCC;}
strong.vallabel.vallabel3 {background: #359D9D;}
strong.vallabel.vallabel4 {background: #188EAA;}
strong.vallabel.vallabel5 {background: #1882D8;}
strong.vallabel.vallabel6 {background: #1474B3;}
strong.vallabel.vallabel7 {background: #0C558D;}
strong.vallabel.vallabel8 {background: #074266;}
/* // 2023-05-18, 2023-06-01 수정 e */

.placeSearch .subtop.visual + .subcontent{padding-top: 93px;}
.placeSearch .subcontent .inner{display: flex; flex-direction: row; flex-wrap: wrap;}
.placeSearch .subcontent .inner .maplist{width: calc(620/1516*100%);max-width:620px; }
a.helppop{display: inline-block;bottom: 0;padding:6px 0 5px;width:26px;font-size: 15px;font-weight: 700;color:#fff;letter-spacing: -0.38px;border-radius:100%;background-color: #D4D4D4;line-height: 1;text-align: center;transform: translate(1px, -2px);}
.checklist {display: inline-block;}
.checklist li{display: inline-block;margin-right:17px;margin-top: 10px;}
.checklist li label{padding:3px 0 1px 36px; font-size: 18px; line-height: 1;font-weight: 300;}
/* 2023-05-18 추가, 2023-06-01 수정 s */
.placeSearch .checkwrap {position: relative;}
.placeSearch .checklist {display: flex; flex-wrap: wrap;}
.placeSearch .checklist li {width: 45%;}
/* .placeSearch .checklist li:nth-of-type(4), .maplist .checklist li:last-of-type {width: auto;}
.placeSearch .checklist li:last-of-type {margin-left: auto;} */
.placeSearch .checkwrap .helppop {position: absolute; right: 0; bottom: 0;}
/* // 2023-05-18 추가, 2023-06-01 수정 e */
.searchbox{margin-top:18px;display: flex; flex-direction: row; flex-wrap: wrap;}
.nice-select.selectstyle:not(.noline){line-height:1; padding-top: 21px;}
.nice-select.selectstyle:not(.noline):after{right: 11px;}
.nice-select.selectstyle:not(.noline) span{font-weight: 400;}
.searchbox .nice-select, .searchbox select{ width:calc(305/620*100%); /*max-width:305px;*/}
.searchbox .nice-select.sel2, .searchbox select.sel2{margin-left:calc(10/620*100%);}
.searchbox select{padding-top:5px; height:60px; border:1px solid #C5C5C5; border-radius:10px; font-family: 'Roboto', 'Noto Sans KR', sans-serif; font-size:22px; font-weight:400; letter-spacing: -0.65px; padding-left: 18px; padding-right: 30px; background: url(/resources/renewal/images/common/selarr.png) no-repeat right 11px center;}
.searchbox .nice-select.selectstyle .list{width:100%;}
.searchbox input[type="text"]{ margin-top:15px; width:calc(492/620*100%);padding-top:20px;padding-left:19px;vertical-align: middle; line-height: 1;}
.searchbox input[type="text"]:focus{padding-top:19px;padding-left:18px;}
.searchbox input[type="text"]::-webkit-input-placeholder{line-height:1; letter-spacing: -0.6px;}
.searchbox input[type="text"]:-ms-input-placeholder{line-height: 1; letter-spacing: -0.6px;}
.searchbox .button.gray{ margin-top:15px; margin-left:calc(8/620*100%); width:calc(120/620*100%); vertical-align: middle;}
.placeSearch h3{/*font-size: 24px; letter-spacing: -0.6px; */line-height: 30px;}
.placeSearch .inner .mapbox{margin-left:calc(148/1516*100%); width: calc(748/1516*100%);max-width:748px;}
.keywordbox{margin-top:40px;}
.keywordlist{margin-top:9px;display: flex; flex-direction: row; flex-wrap: wrap;}
.keywordbox .keywordlist{margin-right: -12px;}
.keywordlist li{margin-right:10px;}
.keywordlist li:last-child{margin-right:0;}
.keywordlist li a, .keywordlist li a span{font-size: 18px; font-weight:400; letter-spacing: -0.36px; line-height: 1;}
.keywordlist li a{display: block;margin-top:11px; padding:12px 20px 8px; border-radius: 25px; color:#000; border:1px solid #C5C5C5; text-align: center; box-sizing: border-box;}
/* .keywordlist li a.keyword1{min-width: 130px;}
.keywordlist li a.keyword2{min-width: 130px;}
.keywordlist li a.keyword3{min-width: 130px;}
.keywordlist li a.keyword4{min-width: 130px;}
.keywordlist li a.keyword5{min-width: 140px;}
.keywordlist li a.keyword6{min-width: 190px;}
.keywordlist li a.keyword7{min-width: 118px;}
.keywordlist li a.keyword8{min-width: 158px;} */
.keywordlist li a.on, .keywordlist li a.on span{color:#fff; background: #000; border-color: #000;}
.resbox{margin-top:40px; }
.resbox .bordertop{padding-bottom:20px; overflow: hidden; border-bottom:1px solid #D4D4D4;}
.resbox .bordertop h3{float: left;}
.resbox .bordertop p, .resbox .bordertop p strong{ font-size: 18px; font-weight: 400; letter-spacing: -0.45px;}
.resbox .bordertop p{float: right; margin-top: 6px;} 
.resbox .bordertop p strong{color: #00B0CC;}
.resbox .scrollbox{margin-right:-10px; width:calc(100% + 10px); padding:0; height: 590px; background: none; overflow:hidden;}
.resbox .scrollbox .mCustomScrollbar{padding:0; height: 590px;}
.resbox .scrollbox .mCSB_container{padding: 0 1px 0 0;margin-right: 10px;}
.placeSearch .noboard{margin:0 auto; padding:100px 0 0;}
.placeSearch .noboard p{padding-top:158px; font-size: 22px; letter-spacing: -0.55px; line-height:1; font-weight: 400;background: url('/resources/renewal/images/common/pnocontent.png') no-repeat center top / 130px}
.resbox .button.sizem.line{margin:30px auto 0;}
.placetit{position: relative; }
.resbox .placetit{padding-right:107px; display:flex; align-items: center;}
.placetit h4{display: inline-block; vertical-align: middle;margin-left:6px;font-weight: 700; /* transform: translateY(-1px);*/}
.addrlist > li{padding:30px 0; border-bottom: 1px solid #D4D4D4;}
.placetxt p{margin-top:9px; font-size: 18px; font-weight: 400; letter-spacing: -0.45px; line-height: 26px;}
.placetxt p + p{margin-top:0;}
.placetxt p + .keywordlist{margin-top: 8px;}
.wh{margin-top:22px;}
.wh li{font-weight: 300; line-height: 24px;}
.placetit .button.arrow{position: absolute;top: 12px;right: 0;}
.placetit .button.arrow span{padding-right: 34px;}
/*
.placeSearch .mCSB_scrollTools{opacity: 0;}
.placeSearch .mCS-autoHide>.mCustomScrollBox>.mCSB_scrollTools,
.placeSearch .mCS-autoHide>.mCustomScrollBox~.mCSB_scrollTools,
.placeSearch .mCS-autoHide:hover>.mCustomScrollBox>.mCSB_scrollTools,
.placeSearch .mCS-autoHide:hover>.mCustomScrollBox~.mCSB_scrollTools,
.placeSearch .mCustomScrollBox:hover>.mCSB_scrollTools,
.placeSearch .mCustomScrollBox:hover~.mCSB_scrollTools {
    opacity: 0;
    filter: "alpha(opacity=0)";
    -ms-filter: "alpha(opacity=0)"
}

.placeSearch .mCustomScrollbar>.mCustomScrollBox>.mCSB_scrollTools.mCSB_scrollTools_onDrag,
.placeSearch .mCustomScrollbar>.mCustomScrollBox~.mCSB_scrollTools.mCSB_scrollTools_onDrag {
    opacity: 1;
    filter: "alpha(opacity=100)";
    -ms-filter: "alpha(opacity=100)"
}*/

.mapinfo{padding:39px;position:relative; max-width:640px;background-color: #fff; border:1px solid #D4D4D4;}
.mapinfo:after{content:''; display:block; position: absolute; bottom:0; left: 50%; transform: translate(-50%,100%);width: 35px;height: 30px; background: url('/resources/renewal/images/place/tri.png')no-repeat center bottom;}
.mapinfo .popclose{position:absolute; top:14px; right:15px; width: 30px;}
.mapinfo .popclose img{display: block; width: 100%;}
.mapinfo .placetit h4{ transform: translateY(1px);}
.mapinfo p + .keywordlist{margin-top: -2px;}
.mapinfo .txt16{font-weight: 300; font-size: 16px; letter-spacing: -0.5px;line-height: 24px;}
.mapinfo .cation, #mappop .cation{margin-top:23px;padding-top:27px; border-top:1px solid #D4D4D4 ;}
.mapinfo .cation strong, #mappop .cation strong{font-weight: 400; color:#00B0CC;}
.mapinfo .cation{position: relative;padding-left:10px;}
.mapinfo .cation:before{content: '*'; display: block; position: absolute; top:25px; left:0;}

.mapbox #map{width:100%; height: 100%; border: 1px solid #c5c5c5;}

#infopop, #releasePop{width:calc(100% - 120px);}
#releasePop .popcon, #searchPop .popcon{margin-bottom:52px;}
#searchPop .popcon h3, #releasePop .popcon h3{line-height: 30px;}

#infopop{max-width:750px;}
#infopop .poptop{padding:11px 15px 14px 20px;}
#infopop .poptop a.popclose{margin-top: 4px;}
#infopop .poptop h3{font-size: 24px; letter-spacing: -0.6px; line-height: 28px;}
#infopop .popcon{padding: 0 37px; margin: 48px 0 58px;} /* 2023-03-29 수정 */
#infopop ul li{display: flex; align-items: center;}
#infopop ul li:not(:nth-child(1)){margin-top:32px;}
#infopop ul li strong, #infopop ul li span{display: inline-block; vertical-align: middle;}
#infopop ul li span{width: calc(100% - 235px); margin-left:20px; font-size: 20px; color: #000; letter-spacing: -0.65px; line-height: 28px;} /* 2023-03-29 수정 */

#releasePop, #searchPop{max-width:400px;}
#releasePop .popcon{text-align: center;margin-top:8px;}
#releasePop .popcon h3 + p{margin-top:25px;}

#aiblemappop {width: calc(100% - 60px) !important; max-width:750px;}
#aiblemappop .poptop{padding: 13px 15px 12px 21px;}
#aiblemappop .poptop h3{font-size:24px; letter-spacing: 1px;}
#aiblemappop .poptop a.popclose{margin-top: 4px;}
#aiblemappop .popcon{padding:0 75px;margin:35px auto 13px; max-height: calc(100% - 160px); overflow: auto;}
#aiblemappop h4{font-size:24px; font-weight:700; line-height:1; letter-spacing: 1px;}
#aiblemappop p, #aiblemappop dt, #aiblemappop dd{font-size: 22px; font-weight: 300; line-height:34px; color: #000; letter-spacing:1px;}
#aiblemappop p{margin-top:19px;}
#aiblemappop dl{margin-top:16px;}
#aiblemappop dd{font-size:18px;}
#aiblemappop .popcon div:nth-child(1){padding-left:32px;}
#aiblemappop .popcon div:nth-child(2){display:block; margin-top:17px; width:100%; border:1px solid #D4D4D4;}
#aiblemappop .popcon img{display:block; margin:10px auto; width:calc(100% - 170/600*100%); max-width:430px;}

@media screen and (max-width:1516px) {
    .placeSearch .subcontent .inner .maplist{width: calc(420/914*100%);}
    .placeSearch .inner .mapbox{margin-left:calc(44/914*100%); width: calc(450/914*100%);} 
    .placetit .button.arrow{display: none;}
    .resbox .placetit{padding-right: 0;}
}

@media screen and (max-width:1023px) {
    .subtop.visual h2 + p br{display: block !important;}

    /* 가까운 매장 찾기 */
    .mofun .placeSearch .subcontent .inner .maplist, .placeSearch .subcontent .inner .maplist{width: 100%; max-width: 100%;}
   .mofun .mapbox, .mapbox{position:fixed;top:0;left:0;margin:0 !important;height:100% !important;width:100% !important;max-width:100% !important;z-index:-1; opacity:0;}
   .mapbox #map{margin:0!important; width:100% !important; max-width:100% !important; height:100% !important;}
    .mofun .resbox .scrollbox, .mofun .resbox .scrollbox .mCustomScrollbar, .resbox .scrollbox, .resbox .scrollbox .mCustomScrollbar{height: auto;}
    .mofun .resbox .scrollbox .mCSB_container, .resbox .scrollbox .mCSB_container{padding:0;}
    .popup.whitetxt#mappop .cation{position: relative;padding-left:10px;}
    .popup.whitetxt#mappop .cation:before{content: '*'; display: block; position: absolute; top:25px; left:0;}
    #momap{margin-top:30px;width:100%; height:200px;border: 1px solid #c5c5c5;}

}


@media screen and (min-width:721px) and (max-width:1023px) {
    .place .subtop.visual .visualwrap .inner{    background-position: right 0px center; }

}
@media screen and (max-width:720px) {
    /* common */
    .place .subtop.visual .visualwrap .inner{background-image: url('/resources/renewal/images/place/mvisual.png'); background-size: 135px; background-position: right 2px center;}
    .place .subtop .subnavi{padding-bottom:4px; text-align: center;}
    .place .subtop .subnavi ul li{padding-left:16px; float: none; display: inline-block;}
    .place .subtop .subnavi ul li:first-child { padding-left: 0; }
    .place .subtop .subnavi ul li a{letter-spacing: -0.6px;}

    /* 매장안내 */
    .placeinfo h3{padding: 0; font-size: 20px; line-height: 1; letter-spacing: -0.6px;}
    .placeinfo h3+p{margin-top:8px; font-size: 14px; line-height: 1.6; letter-spacing: -0.45px;}
    .placeinfo img.onlymo{margin-top:23px;}
    .placeinfo .subcontent ul{padding:0 0 50px;}
    .placeinfo .subcontent ul li{width:calc(50% - 5px); margin-left:0; padding-top:25px; font-size: 13px; line-height: 1.46;    letter-spacing: -0.4px;}
    .placeinfo .subcontent ul li:nth-child(even){margin-left: 10px;}
    .placeinfo .subcontent ul li:nth-child(3), .placeinfo .subcontent ul li:nth-child(4){padding-top: 23px;}
    .placeinfo .subcontent ul li img{width:45px; margin-bottom:17px;}
    .placeinfo .subcontent ul+h3{padding-top:29px;}
    .placeinfo .subcontent ul+h3+p{margin-top: 9px;line-height: 1.57;}
    
    /* 가까운 매장 찾기 */
    .placeSearch .subtop.visual + .subcontent{padding-top: 40px;}
    .placetit{display: flex; align-items: center;}
    .resbox .placetit{padding-right: 0;}
    .keywordlist li a{padding: 11px 25px 8px;font-size:14px;}
     strong.vallabel{font-size: 14px; width: 175px; padding:7px 0;} /* 2023-03-29 수정 */
    #infopop, #releasePop, #searchPop{width:calc(100% - 60px); max-width:100%;}
    #searchPop .popcon h3, #releasePop .popcon h3{line-height: 1.25;}

    .resbox .bordertop p, .resbox .bordertop p strong, .placeSearch .checklist li label{font-size: 13px; font-weight: 300;}
    /* 2023-05-18 수정 s */
    .placeSearch .checklist li{display: flex; align-items: flex-start; margin-right: 7px;}
    .placeSearch .checklist li:nth-of-type {width: auto;}
	.placeSearch .checklist li input[type="checkbox"] + label{padding-left: 25px; background-position: 0 0; background-size: 19px; font-weight: 400; line-height: 1.2;}
	/* // 2023-05-18 수정 e */
    a.helppop{padding:3px 0 3px;font-size: 13px; width: 20px;transform: translate(5px, -1px);}
    .searchbox{margin-top: 13px;}
    .searchbox .nice-select, .searchbox select{width: calc(50% - 5px);}
    .searchbox select{height: 40px; padding-top: 2px; padding-left: 9px; padding-right: 24px; border-radius: 5px; font-size: 15px; letter-spacing: -0.5px; background-position: right 4px center; background-size: 14px;}
    .searchbox .nice-select.sel2, .searchbox select.sel2{margin-left: 10px;}
    .nice-select.selectstyle:not(.noline){padding-top: 13px; padding-left: 9px;}
    .nice-select.selectstyle:not(.noline):after{right: 4px;width: 14px;height: 14px; background-size: 14px;}
    .searchbox input[type="text"], .searchbox .button.gray{margin-top:6px;}
    .searchbox input[type="text"]{width: calc(100% - 200/640*100% - 10px);padding:10px}
    .searchbox input[type="text"]:focus{padding:9px}
    .searchbox .button.gray {margin-left: 10px;width: calc(200/640*100%); }
    .placetxt p{margin-top:13px; font-size:13px; line-height: 1.46;}
    .placetxt p span{font-weight:400;}
    .keywordbox{margin-top:32px;}
    .keywordlist{margin-top:1px;}
    .keywordlist li a.keyword1, .keywordlist li a.keyword2, .keywordlist li a.keyword3, .keywordlist li a.keyword4,
    .keywordlist li a.keyword5, .keywordlist li a.keyword6, .keywordlist li a.keyword7, .keywordlist li a.keyword8{min-width:auto; width: auto;padding-left: 25px; padding-right: 25px;}
    /* .keywordlist li a.keyword1{/*width: 112px;*padding-left: 27px; padding-right: 27px;}
    .keywordlist li a.keyword2{/*width: 112px;*}
    .keywordlist li a.keyword3{/*width: 112px;*padding-left: 27px; padding-right: 27px;}
    .keywordlist li a.keyword4{/*width: 73px;*padding-left: 19px; padding-right: 19px;}
    .keywordlist li a.keyword5{/*width: 138px;*padding-left: 24.5px; padding-right: 24.5px;}
    .keywordlist li a.keyword6{/*width: 138px;*padding-left: 28px; padding-right: 28px;}
    .keywordlist li a.keyword7{/*width: 103px;*padding-left: 28px; padding-right: 28px;}
    .keywordlist li a.keyword8{/*idth: 118px;*padding-left: 24px; padding-right: 24px;}  */
    .resbox .button.sizem.line{margin-top:35px;}
    .resbox{margin-top: 31px;}
    .resbox .bordertop p{margin-top: 8px; font-weight: 400;}
    .resbox .bordertop p strong{font-weight: 400;}
    .resbox .bordertop{padding-bottom: 7px;}
    .placeSearch .noboard{margin:0 auto; padding:51px 0 2px;}
    .placeSearch .noboard p{padding-top:79px; font-size: 17px; letter-spacing: -0.7px; background: url('/resources/renewal/images/common/mnocontent.png') no-repeat center top / 70px}
    .addrlist > li{padding: 25px 0;}
    .addrlist > li h4{transform: translateY(1px); letter-spacing: 0.5px;}
    .addrlist > li p{ margin-top: 12px;}
    .placetxt p + .keywordlist{margin-top: 2px;}
    .resbox .scrollbox .mCSB_container{margin-right:0;}

    .popup.whitetxt#mappop .popcon{margin:24px auto 20px;}
    .wh{margin-top:15.5px;}
    .wh li{font-size:13px; font-weight:300; line-height: 1.48; color:#000; letter-spacing: -0.35px;}
    .popup.whitetxt#mappop .cation{margin-top:10px; padding-top:9px; border-top:1px solid #D4D4D4;padding-left:9px;  font-size: 12px; line-height: 1.5;}
    .popup.whitetxt#mappop .cation:before{ top:8px; left:3px;}
    .popup.whitetxt#mappop .cation strong{font-weight: 300;}
    #momap{margin-top:16.5px;}
    
    #mappop .placetit h4{margin-left: 7px; letter-spacing: 0.5px;}
    #mappop .placetxt p {margin-top: 10px;}
    #mappop .placetxt p + p{margin-top: 0;}
    
    #infopop{}
    #mappop .poptop,#infopop .poptop {padding: 11px 9px 6px 14px;}
    #mappop .poptop h3, #infopop .poptop h3, #aiblemappop .poptop h3{margin-top:3px; font-size: 16px; line-height: 1; letter-spacing: -0.5px;}
    #infopop .poptop a.popclose{margin: 0;}
    #infopop .popcon{margin:32px 0 44px;padding:0 15px;}
    #infopop ul li{text-align: center; flex-direction: column;}
    #infopop ul li:not(:nth-child(1)){margin-top:20px;}
    #infopop ul li span{display: block;width: 100%; margin:13px 0 0; font-size: 15px; font-weight:400; letter-spacing: -0.75px; line-height: 1.46;}

    #releasePop .poptop{padding-top: 10px;padding-right: 9.5px ;}
    #releasePop .popcon{margin-bottom:32px;}
    #releasePop .popcon h3{margin-top:20px; }
    #releasePop .popcon h3 + p{margin-top:10px; font-weight: 400;font-size: 15px; letter-spacing: -0.5px;line-height: 1.48;}

    #searchPop .popcon{margin-bottom: 50px;}
    
    #aiblemappop .poptop { padding: 10px 7.5px 7px 13px;}
    #aiblemappop .poptop h3{letter-spacing:0;}
    #aiblemappop .poptop a.popclose { margin-top: 0; }
    #aiblemappop .popcon{margin: 29px 0 15.6px;padding: 0 10px;}
    #aiblemappop h4{font-size:17px;letter-spacing: 0.3px;}
	#aiblemappop p, #aiblemappop dt, #aiblemappop dd{font-size: 15px;font-weight: 400;line-height:22px;letter-spacing: 0.3px;}
	#aiblemappop p{margin-top: 10px;}
	#aiblemappop dl{margin-top: 6px;}
	#aiblemappop dd{font-size:12px;}
    #aiblemappop .popcon div:nth-child(1){padding:0 5px;}
    #aiblemappop .popcon div:nth-child(2){margin-top:20px}
    #aiblemappop .popcon div img{width:calc(100% - 30px);max-width:500px;}

}
@media screen and (max-width:380px) {
/* .placeSearch .checklist li:nth-child(2){margin-right:40px;} 2023-05-18 삭제 */


.resbox .placetit {
    flex-direction: column;
    align-items: baseline;
}

}