#container{ position: relative;  height: 100%; min-height: 100vh;    min-width: 320px;     max-width: 500px;  margin: 0 auto;  background: var(--black);   margin: 0px 0px 0px calc(45vw + 100px); }
#container:after {content: ""; display: table;  clear: both;}

@media all and (max-width:1200px) {
  #container      { margin:0  auto !important; }
  .pc-device-wrap { display: none !important;}
  .ani-firecracker-mov{  margin:0  auto !important;  }
}

@media all and (max-width:320px) {
 .ani-airplan-mov{  margin-top:50px !important;   }
 .ani-firecracker-mov  {  }
}

/** 폴더블폰 **/
 @media all and (min-width:674px) and (max-width:842px) {  
  .headerGnb   { max-width: 100% !important; }
  #container,  .sec-contHd-title,  .footer-writing-box, .footerNavigation,.footer-fix,  .bwRow, .bwCol, .bwhalf{ min-width:100% !important; max-width: 100% !important; }

}


.whitebg{ background: var(--white) !important;}

.sec-splash{ position: relative; background: var(--white); height: 100vh;  }
.ani-airplan-mov{  margin-top:-15%;   }
.ani-airplan-mov img {  z-index: 500;}
.ani-firecracker-mov{ position: fixed;   left: 0;  right: 0;  bottom: 0;     max-width: 500px;  min-width: 320px;  margin: 0px 0px 0px calc(45vw + 100px);  }




.pc-device-wrap {  position: fixed; top: 0px;  left: calc(50% - 500px); }
.viewScreen { width:450px;    padding:50px;  display: flex; flex-wrap: wrap; justify-content: space-between; height: 100vh;  }
.viewScreen .left-logo img { height: 50px;}
.viewScreen .left-slogan   {   font-size:35px;       font-family: 'SBAggro'; font-weight: 500; line-height: 120%; letter-spacing: -3px; }

.viewScreen .left-catchphrase {   display: flex; flex-wrap: wrap; justify-content: space-between;  }
.viewScreen .left-catchphrase li { display: flex;    }
.viewScreen .left-catchphrase li  img {height: 64px;}
.viewScreen .left-catchphrase li .pos-right span{ display: block; margin-left: 16px;}
.viewScreen .left-catchphrase li .pos-right .title { font-size:16px; margin-bottom: 8px;  }
.viewScreen .left-catchphrase li .pos-right .text { font-size:13px;  font-weight: 400; color: var(--color400);}

.viewScreen  .bottom  {margin-top: auto; } 
.viewScreen  .bottom a {margin-right: 20px;}
.viewScreen  .bottom a img { height: 36px;  filter: var(--filterWhite);  }




.footer-postion{  min-width: 320px;  max-width: 500px; margin-top: 50px;    padding: 0 20px;  } 

.sec-stepWrap{ position: relative;    }
.sec-stepWrap .appInfo-title   { padding: 75px 0 0 22px; }
.sec-stepWrap .appInfo-title dt{ font-size:28px; margin-bottom: 16px; font-weight: 700; letter-spacing: -2px; color: var(--white);}
.sec-stepWrap .appInfo-title dd{ font-size:15px;  color: var(--color700); line-height: 130%; color: var(--color300); }

.sec-stepWrap .infoArea {     }
.sec-stepWrap .infoArea li{display: flex; align-items: center; margin:30px 0; }
.sec-stepWrap .infoArea i{display: inline-block;  border-radius: 100px;  background: var(--color700);  padding:10px; margin-right:14px;}
.sec-stepWrap .infoArea .description {display: inline-block;}
.sec-stepWrap .infoArea .description .subject{ display:block; font-size:16px; margin-bottom: 4px; color: var(--color200);}
.sec-stepWrap .infoArea .description .desc   { display:block; font-size:13px;  color: var(--color500);}

/* 약관동의 */
.sec-stepWrap .agreement-wrap  {     }
.sec-stepWrap .agreement-wrap .agree-all{  font-size: 18px; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--color800); font-weight: 800; color: var(--color200);   }
.sec-stepWrap .agreement-wrap .agree-list { }

.sec-stepWrap .agreement-wrap .agree-list li{position: relative; margin-bottom:20px;  font-size:14px; color: var(--color400); }
.sec-stepWrap .agreement-wrap .agree-list li .arrow-right  {   position: absolute; top:0px; right:0;   color: var(--pointColor1); font-size:12px;    }




/* 로그인 */
.sec-stepWrap .sns-btnBox{  margin:0 16px;}
.sec-stepWrap .sns-btnBox button{text-align: left; font-size:16px; width:100%; height: 60px; margin-bottom: 10px;  padding:0 20px 0 50px;  font-weight: 700;  color:var(--color900);  letter-spacing: -1px;  }
.sec-stepWrap .sns-btnBox i img{   margin-right:15px  }

.sec-stepWrap .joinText {position: relative;  text-align: center;  margin:35px 16px 20px 16px; color: var(--color500); font-size:13px; }
.sec-stepWrap .joinText::after  { content:"" ;  position: absolute; top:7px; left:0;   height:1px; width:40%;  background: var(--color200);   }
.sec-stepWrap .joinText::before { content:"" ;  position: absolute; top:7px; right:0;  height:1px; width:40%;  background: var(--color200);  }

/*  input 리스트 */
.panel-input-box{ padding: 0 16px;  }
.panel-input-box input{display: block; width:100%; }
.panel-input-box .row-item {position: relative;  margin-bottom:25px; width:100%;}
.panel-input-box .row-item:after {content: ""; display: table;  clear: both;} 
.panel-input-box .row-item:last-child{margin-bottom: 0;}
.panel-input-box .row-item .subject {display: block;  font-size:14px; font-weight: 600; margin-bottom:8px; color: var(--color300); }
.panel-input-box .row-item .select-arrow { position: absolute; top:43px; right:10px;  }
.panel-input-box .row-item .select-arrow img{ width:24px;  filter: invert(96%) sepia(7%) saturate(63%) hue-rotate(169deg) brightness(99%) contrast(89%);   }
.panel-input-box .row-item .in-col{ display:flex; flex-direction: row;   position: relative; }
.panel-input-box .row-item .in-col input{ width:calc(100% - 90px) !important; margin-right:10px !important;   }
.panel-input-box .row-item .in-col button{ width:80px !important; }
.panel-input-box .row-item .in-col .write-date { position: absolute; top:10px; left:calc(100% - 110px); font-size:12px; color:#D0116A;}
.panel-input-box .row-item .gender{ display: flex; justify-content: space-between;    }
.panel-input-box .row-item .gender.radio-new input[type="radio"] + label { width:calc(100% / 2); margin-right: 6px; }
.panel-input-box .row-item .gender.radio-new input[type="radio"] + label:last-child{ margin-right: 0; }
.panel-input-box .row-item .rowtext{ display: inline-block; margin-left: 6px;  font-size: 12px; }

.panel-input-box .row-item .postalCode input{ width:calc(100% - 130px) !important; margin-right:10px !important;   }
.panel-input-box .row-item .postalCode button{ width:120px !important; }

.panel-input-box .row-item .eyeView { position: absolute; top:43px; right:10px; }
.panel-input-box .row-item .eyeView .security[type="checkbox"] {display:none !important;}
.panel-input-box .row-item .eyeView .security[type="checkbox"] + .Link {color:#222;}
.panel-input-box .row-item .eyeView .security[type="checkbox"] + .Link span {display:inline-block; background:url('../resource/images/ico-eye.png')no-repeat; background-size:100% auto; width:24px; height:24px; background-position:0 0; margin:-3px 5px 0 0; vertical-align:middle; cursor:pointer;}
.panel-input-box .row-item .eyeView .security[type="checkbox"]:checked + .Link span {background:url('../resource/images/ico-eye.png') no-repeat; background-size:100% auto; background-position:0 -24px;  }

.panel-input-box .row-item .notice-row { display: inline-block; font-size:12px; color: var(--color400); }

.panel-input-box .row2{ display: flex; flex-flow: wrap;   justify-content: space-between;   flex-direction: row;  gap: 3px;  }
.panel-input-box .row2 label {width:calc( 100% / 2 - 4px);  }  
.panel-input-box .row2 input[type="radio"] + label {  }
.panel-input-box .row2 input[type="radio"] + label:last-child {margin-right:0; } 
.panel-input-box .row2-notChang { color: var(--color300); background: var(--color800);  border-radius:4px; width:100%; border: 1px solid var(--color700); height: 52px; display: flex; justify-content: center; align-items: center; }

.panel-input-box .radio-default input[type="radio"] + label  {font-size:13px;}

.panel-input-box .row1{ display: flex; flex-flow: wrap;   justify-content: space-between;    flex-direction: row;  gap: 5px; }
.panel-input-box .row1 label {width:100%;  }  

.panel-input-box .row3{ display: flex; flex-flow: wrap;   justify-content: space-between;    flex-direction: row;  gap: 5px; }
.panel-input-box .row3 label {width:calc( 100% / 3 - 3px);  }  

.panel-input-box .notice-col { display: inline-block;  color:#6F3CFF; font-size:13px;}

.panel-input-box .row-item.pictureItem .btn-photo-add { background: var(--color800); border-radius: 4px;  width:100%; height: 46px; display: flex; justify-content: center; align-items: center; }
.panel-input-box .row-item.pictureItem .btn-photo-add  i { background: var(--color900); border-radius: 100px;  width:32px; height: 32px; display: flex; justify-content: center; align-items: center;  }
.panel-input-box .row-item.pictureItem .btn-photo-add  i img { filter: var(--filterPoint1);  height: 16px;}
.panel-input-box .row-item.pictureItem .btn-photo-add span{ display: inline-block;  margin-left:10px ;   }

.panel-input-box .check {display: inline-block; margin-left: 6px;  font-size:12px;  color:var(--pointColor2);} 

.panel-input-box .textNum {  font-size:12px; text-align: right; display: block; margin-top: 10px; }
.panel-input-box.feed .row-item{ margin-bottom:8px;}



.upload-common-notice {  font-size:13px;    }
.upload-common-notice li { position: relative;  padding:2px 0;  padding-left:12px;  color: var(--color400); }
.upload-common-notice li:before{  content: ""; position: absolute; top: 10px; left:0px; width: 4px; height: 1px; background:  var(--color400); }
.upload-common-notice .bold {  color: var(--pointColor1); }





.language-level   { display: flex; flex-wrap: wrap; gap: 6px;  margin-top:10px;} 
.language-level a { display: flex;  flex-direction: column;  justify-content: center;   width: calc(100% / 3 - 4px);  flex-shrink: 0; border: 1px solid var(--color800);  border-radius: 4px; padding:10px; }

.language-level a .text1 {border-radius: 100px; height: 22px; display: flex; justify-content: center; align-items: center; background:var(--color800); width:50px; margin: 0 auto;  }
.language-level a .text2 { display: flex; justify-content: center; margin-top: 8px; font-size:12px;  }
.language-level a .text3 {text-align: center; }
.language-level a:active {    border: 1px solid var(--pointColor1); background:rgb(var(--rgb-point1), 50%);    }
.language-level a:active .text1  {  background:var(--pointColor1);  }




/* 로그인 페이지 > 자동로그인,아이디 저장 */
.sec-stepWrap .auto-check{ margin-top:25px;   }
.sec-stepWrap .auto-check li { display: inline-block;  color: var(--color500);  }
.sec-stepWrap .auto-check li:last-child {margin-left:15px; }
.sec-stepWrap .btn-passSearch{color: var(--color400); display: block;  text-align: center;  padding: 20px 0 40px; }

.sec-stepWrap  .auto-check input[type="checkbox"]:checked + .chk-label span {  filter: var(--filter500);}


.jplogo-area{position: relative;  text-align: center;   padding-top:100px;  margin: 0 auto;   }
.jplogo-area img { height: 52px; }
.jplogo-area .logo { height:52px;  }

.jplogo-area .air{  position: absolute;    top: 70px;   left: 50%; transform: translate(-50%, -50%); width:70px; } 
.jplogo-area .title{font-size:18px; color:var(--color900); margin-top: 20px; letter-spacing: -2px; font-weight: 800;}
.jplogo-area .desc { display: block; margin-top:10px;  color: var(--color700); font-size:15px; line-height:140%;} 


.sec-stepWrap .splash { position: fixed; bottom: 0;  width:100%;   max-width: 500px; }
.sec-stepWrap .splash img{ width:100%;  }


.ani-airplan-loadingBar  { width:90%; height: 500px;  position: absolute; top: 50%;  left: 50%; transform: translate(-50%, -50%); z-index: 1000; }
.ani-airplan-loadingBar i{ display: block; background:url('../resource/images/loading-bar.gif') no-repeat center;  width: 100%; height: 100%;   background-size: 100%;  }

/**** 메인 *********************************************/
.topSpace  { padding:56px 0 20px;  }
.fullSpace { padding:68px 0 100px; }
.sec-top-thumbnail  {margin:0; }
.sec-row-thumbnail  {margin:0 0 50px; }
.sec-categoryInfo {margin:35px 0 10px;}

/* header Gnb */
.headerGnb{  position:fixed; left:0; right: 0; top:0; height:60px;  max-width: 500px;   margin: 0px 0px 0px calc(45vw + 100px);  background: rgba(0, 0, 0, 0.65); backdrop-filter:blur(17.5px); -webkit-backdrop-filter:blur(17.5px); z-index:100;  }
.headerGnb .hd-Gnb{ position: relative;  display:flex; height: inherit;  align-items: center; margin: 4px 16px 0;   }
.headerGnb .hd-Gnb li {   }
.headerGnb .hd-Gnb li.logo img{ height: 28px;   }
.headerGnb .hd-Gnb li.right-position { margin-left: auto; display: flex; align-items: center; }
.headerGnb .hd-Gnb li.right-position .toggleSwitch { height: 30px; }
.headerGnb .hd-Gnb li.right-position .toggleSwitch .localTog[type="checkbox"] {display:none !important;}
.headerGnb .hd-Gnb li.right-position .toggleSwitch .localTog[type="checkbox"] + .Link span {display:inline-block; background:url('../resource/svg/toggle-local-on.svg')no-repeat; background-size:100% auto; width:80px; height:30px;  cursor:pointer;}
.headerGnb .hd-Gnb li.right-position .toggleSwitch .localTog[type="checkbox"]:checked + .Link span {background:url('../resource/svg/toggle-local-off.svg') no-repeat; background-size:100% auto;  }
.headerGnb .hd-Gnb li.right-position .myCoin{background: var(--color900); border-radius: 100px;  padding:0 10px 0 4px; margin-right: 10px;  color:var(--white); height: 30px; display: flex; align-items: center;  }
.headerGnb .hd-Gnb li.right-position .myCoin img{height: 20px; margin-right:6px; }
.headerGnb .hd-Gnb li.right-position .myCoin .num{font-size:12px; }
.headerGnb .hd-Gnb li.right-position .btn-search{ margin-left:10px; }

.headerGnb .hd-Gnb li.right-position .toggleSwitch .countryTog[type="checkbox"] {display:none !important;}
.headerGnb .hd-Gnb li.right-position .toggleSwitch .countryTog[type="checkbox"] + .Link span {display:inline-block; background:url('../resource/svg/toggle-country-ko.svg')no-repeat; background-size:100% auto; width:50px; height:30px;  cursor:pointer;}
.headerGnb .hd-Gnb li.right-position .toggleSwitch .countryTog[type="checkbox"]:checked + .Link span {background:url('../resource/svg/toggle-country-jp.svg') no-repeat; background-size:100% auto;  }

@media all and (max-width:1201px) {
  .headerGnb { margin:0 auto; }
}





/* sub header title */
.sec-contHd-title{ position:fixed; left:0; right:0; top:0; height:56px; background: rgba(0, 0, 0, 0.4); backdrop-filter: blur(17.5px); -webkit-backdrop-filter:blur(17.5px); min-width:320px; max-width:500px;  margin: 0px 0px 0px calc(45vw + 100px); z-index:500;  }
.sec-contHd-title .header-tit{height: inherit; display:flex; justify-content: space-between;    align-items: center; padding:8px 16px 0; }
.sec-contHd-title .header-tit li{     }
.sec-contHd-title .header-tit .title    {  font-weight: 600; width:100%;   text-align: center; font-size:20px;  color: var(--white);  } 
.sec-contHd-title .header-tit .title .sexAge{  font-size:20px; margin-left: 4px; font-weight: 700; line-height: 100%; margin-left:10px; font-weight: 400;}
.sec-contHd-title .header-tit .btn-back a { display: block;  background:url('../resource/svg/arrow-longLeft.svg') no-repeat center;  width: 20px; height: 20px;  cursor: pointer; filter: invert(100%) sepia(6%) saturate(0%) hue-rotate(115deg) brightness(108%) contrast(108%);}
.sec-contHd-title .header-tit .btn-home a { display: block;  background:url('../resource/svg/ico-home.svg') no-repeat center;  width:26px; height:26px; background-size:100%;  cursor: pointer;}
.sec-contHd-title .header-tit .title.posLeft { text-align: left; margin-left: 25px; width: auto;}

.sec-contHd-title .position-right{  margin-left: auto;}

.btn-albumView{  background: var(--mainColor);  color: var(--white); border-radius: 100px; padding: 0 16px;  height: 34px; margin-left: auto; display: flex; align-items: center;  }

@media all and (max-width:1201px) {
  .sec-contHd-title { margin:0 auto; }
}




.sec-contHd-title .header-tit .btn-menu   { margin-left: auto; /*border-radius:4px; background: rgba(0, 0, 0, 0.1);  width:40px; height:40px;*/    display: flex;  align-items: center;   justify-content: center;  }
.sec-contHd-title .header-tit .btn-menu a { display: block;    background:url('../resource/svg/btn-dotMenu.svg') no-repeat center;  width:22px; height:22px; background-size:100%;  cursor: pointer;
  filter: invert(99%) sepia(3%) saturate(67%) hue-rotate(202deg) brightness(116%) contrast(100%);    }
.sec-contHd-title .header-tit .btn-menu.white a { filter: invert(99%) sepia(3%) saturate(67%) hue-rotate(202deg) brightness(116%) contrast(100%); }
.sec-contHd-title .header-tit .btn-menu.black a { filter: invert(14%) sepia(7%) saturate(1481%) hue-rotate(202deg) brightness(91%) contrast(81%); }
.sec-contHd-title.white .header-tit .btn-back a { filter: invert(0%) sepia(93%) saturate(7499%) hue-rotate(59deg) brightness(90%) contrast(97%); }

.sec-contHd-title.trans{ background: rgba(0, 0, 0, 0);  }
.sec-contHd-title.white { background: var(--white); }
.sec-contHd-title.white .header-tit .title{ color: var(--color900); font-weight: 800; }
.sec-contHd-title.white .header-tit .title .sexAge { color: var(--color900); font-weight:600; }

/* 지도보기,검색 */
.sec-contHd-title .header-tit .right-position { position: relative; margin-left: auto; display: flex; align-items: center;   }
.sec-contHd-title .header-tit .right-position .btn-mapView { display: flex; align-items:center; padding-left:34px; margin-right: 16px;  border: 1px solid var(--white);  border-radius: 100px;  width:100px; height: 30px;   }
.sec-contHd-title .header-tit .right-position .btn-mapView::after{ content: ""; position: absolute; top:6px; left:14px; background:url('../resource/svg/ico-map.svg') no-repeat center;  width:16px; height:16px; background-size:100%;  }
.sec-contHd-title .header-tit .right-position .btn-search {display: block;    background:url('../resource/svg/ico-search.svg') no-repeat center;  width:26px; height:26px; background-size:100%;  cursor: pointer;  }

.sec-contHd-title .header-tit .searchInput {width:100%;  margin-left: 16px;}
.sec-contHd-title .header-tit .searchInput input{ height: 42px; width:100%;   }

/* 하단 네비게이션 */
.footerNavigation{  position: fixed; background: var(--black); left: 0; right: 0; bottom: 0;   max-width: 500px; min-width: 320px; margin: 0px 0px 0px calc(45vw + 100px);   z-index:505; }
.footerNavigation .menuLIst { display: flex;   justify-content: space-between; align-items: center;  height:62px;      }
.footerNavigation .menuLIst li { flex-grow: 1;  }
.footerNavigation .menuLIst li .subj{display: block; text-align: center; font-size:11px;  color:var(--color300); margin-top: 1px; font-weight: 300;  }

.footerNavigation .menuLIst li a i{ display: block;  width:24px; height:24px; filter: var(--filter500); }
.footerNavigation .menuLIst .info a i  { background:url('../resource/svg/footer-nav-menu-01.svg')no-repeat  center center; margin: 0 auto; background-size:100%; }
.footerNavigation .menuLIst .friend a i{ background:url('../resource/svg/footer-nav-menu-02.svg')no-repeat  center center; margin: 0 auto; background-size:100%;   }
.footerNavigation .menuLIst .chat a i  { background:url('../resource/svg/footer-nav-menu-03.svg')no-repeat  center center; margin: 0 auto; background-size:100%;   }
.footerNavigation .menuLIst .talk a i  { background:url('../resource/svg/footer-nav-menu-04.svg')no-repeat  center center; margin: 0 auto; background-size:100%;  }
.footerNavigation .menuLIst .feed a i  { background:url('../resource/svg/footer-nav-menu-05.svg')no-repeat  center center; margin: 0 auto; background-size:100%; }
.footerNavigation .menuLIst .menu a i  { background:url('../resource/svg/footer-nav-menu-06.svg')no-repeat  center center; margin: 0 auto; background-size:100%;  }

.footerNavigation .menuLIst li.active a i  {  width:24px; height:24px; filter: var(--filterWhite);  } 
.footerNavigation .menuLIst .info.active a i  { background:url('../resource/svg/footer-nav-menu-01on.svg')no-repeat  center center; margin: 0 auto; background-size:100%; }
.footerNavigation .menuLIst .friend.active a i{ background:url('../resource/svg/footer-nav-menu-02on.svg')no-repeat  center center; margin: 0 auto; background-size:100%;   }
.footerNavigation .menuLIst .chat.active a i  { background:url('../resource/svg/footer-nav-menu-03on.svg')no-repeat  center center; margin: 0 auto; background-size:100%;  }
.footerNavigation .menuLIst .talk.active a i  { background:url('../resource/svg/footer-nav-menu-04on.svg')no-repeat  center center; margin: 0 auto; background-size:100%;   }
.footerNavigation .menuLIst .feed.active a i  { background:url('../resource/svg/footer-nav-menu-05on.svg')no-repeat  center center; margin: 0 auto; background-size:100%; }
.footerNavigation .menuLIst .menu.active a i  { background:url('../resource/svg/footer-nav-menu-06on.svg')no-repeat  center center; margin: 0 auto; background-size:100%; }

.footerNavigation .menuLIst li.active .subj{ color:var(--white);}

@media all and (max-width:1201px) {
  .footerNavigation { margin:0 auto; }
}


.content-title {  display:flex; align-items: center;   padding: 16px 0 0;   font-weight: 600; width:100%;   text-align: center; font-size:20px;  color: var(--white);}
.content-title  .sexAge{  font-size:20px; margin-left: 4px; font-weight: 700; line-height: 100%; margin-left:10px; font-weight: 400;}
.content-title .badge-nation {margin-left:8px;}


.big-thumb-slider {   position: relative; min-width: 320px;  max-width:500px;  margin-top: 25px;  }
.big-thumb-slider .inner { position: relative; overflow: hidden;}


/* thumbnail-Type1 */
.slide-thumbnail-ty1 {     }
.slide-thumbnail-ty1 li  { position: relative; display: inline-block;  margin-right:16px;   width: 180px; height: 280px; cursor: pointer; }
.slide-thumbnail-ty1 li:before{content: ""; position: absolute; left: 0; top: 0;  display: inline-block;  border-radius: 0px 0px 24px 24px;
                                    background: linear-gradient(0deg, rgba(0, 0, 0, 0.00) 0%, #000 130%); height:130px;  width:100%;  }
.slide-thumbnail-ty1 li .photo img {  border-radius:16px;  height: 280px;  object-fit: cover;   }
.slide-thumbnail-ty1 li .infoBox { position: absolute; top:20px; left:20px;  }
.slide-thumbnail-ty1 li .infoBox .subject{font-size:18px; margin-bottom:8px;  color:var(--white); }
.slide-thumbnail-ty1 li .infoBox .desc { font-size:14px; margin-bottom:22px;  color:var(--color300); }

.pageing-nav { display: flex; align-items: center; justify-content: center; height:26px;  }
.pageing-nav li { display:inline-block; width:8px; height: 8px;  border-radius:10px;  margin:0 4px;  background:var(--white); }
.pageing-nav li.active {  width:20px; height: 8px;  background:var(--mainColor); }

.slide-thumbnail-ty1 li .pro-infoBox-col { position: absolute; top:20px; left:20px;  }
.slide-thumbnail-ty1 li .pro-infoBox-col .subject{font-size:18px; margin-bottom:8px;  color:var(--white); }
.slide-thumbnail-ty1 li .pro-infoBox-col .desc { font-size:14px; margin-bottom:22px;  color:var(--color300); }



/***/
.small-swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; padding-top:25px; }
.small-swiper-container .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1;  display: flex; transition-property: transform; box-sizing: content-box; }
.small-swiper-container .swiper-wrapper .swiper-slide { flex-shrink: 0;   position: relative; transition-property: transform}

.small-swiper-container { width: 100%;   }
.small-swiper-container .swiper-wrapper .swiper-slide {   width:35%;   display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }



.ad-swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; padding-top:25px; }
.ad-swiper-container .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1;  display: flex; transition-property: transform; box-sizing: content-box; }
.ad-swiper-container .swiper-wrapper .swiper-slide { flex-shrink: 0;   position: relative; transition-property: transform}

.ad-swiper-container { width: 100%; padding: 0 16px;   }
.ad-swiper-container .swiper-wrapper .swiper-slide { width:100%; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
.ad-swiper-container .swiper-wrapper .swiper-slide img { border-radius: 6px;}



/* thumbnail-Type2 */
.slide-thumbnail-ty2  { display: flex;     }
.slide-thumbnail-ty2 .item  { position: relative;    cursor: pointer;   display: flex; flex-direction: column; }
.slide-thumbnail-ty2 .item:first-child{ margin-left:16px; }
.slide-thumbnail-ty2 .item:last-child{ margin-right:16px; }
.slide-thumbnail-ty2 .item .zzim-position{ position: absolute; top:125px; right:10px; z-index: 1; }
.slide-thumbnail-ty2 .item .photo {  position: relative; overflow: hidden;  border-radius:8px;  height: 170px; }
.slide-thumbnail-ty2 .item .photo img  { width: 100%;  height: inherit;  object-fit: cover;  }
.slide-thumbnail-ty2 .item .infoBox{  display: block;  margin:14px 6px 0 0; }
.slide-thumbnail-ty2 .item .infoBox .proName{  line-height: 155%; letter-spacing: -0.5px; width:95%; overflow: hidden;  text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient: vertical; }
.slide-thumbnail-ty2  .badge-nh-set{ position: absolute; top:10px; left:10px; z-index:50 ; }

/* thumbnail-Type3 */
.slide-thumbnail-ty3  { margin: 30px 16px 0; }
.slide-thumbnail-ty3 .item  { position: relative; display: inline-block;   width:100%; margin-bottom: 20px;      cursor: pointer; }
.slide-thumbnail-ty3 .item .photo {  position: relative; overflow: hidden;  border-radius:8px; width:100%;  height: 160px;   }
.slide-thumbnail-ty3 .item .photo img  { width:inherit;  height: inherit;  object-fit: cover;  }
.slide-thumbnail-ty3 .zzim-position { position: absolute; top:115px; right:10px; z-index: 1; }

.slide-thumbnail-ty3 .item .infoBox{  display: block;  margin:14px 6px 0 6px; }
.slide-thumbnail-ty3 .item .infoBox .proName{   line-height: 135%;  letter-spacing: -1px;  font-size: 16px; }


/* col-thumbnail  */
.col-thumbnail  { padding: 0 16px;  display:flex; flex-wrap: wrap;   min-width:320px;  gap:16px; }
.col-thumbnail .item  { position: relative;     width:calc( 100% / 2 - 8px);    margin-bottom:5px;   cursor: pointer; }
.col-thumbnail .item .zzim-position{ position: absolute; top:150px; right:10px; z-index: 1; }
.col-thumbnail .item .photo {  position: relative; overflow: hidden;  border-radius:8px; width: inherit; height: 200px;   }
.col-thumbnail .item .photo img  {  width: 100%; height: 100%;  object-fit: cover;  }
.col-thumbnail .item .user-infoBox-col{  display: block;  margin-top:8px; }
.col-thumbnail .item .subject { font-size:18px;  margin-bottom:6px;}
.col-thumbnail .item .description { font-size:14px; color: var(--color300); }

.col-thumbnail .item .badge-nh-set{ position: absolute; top:10px; left:10px; z-index: 1; }
.col-thumbnail .item .badge-nation{  margin-left: 8px;  }

.row4-thumbnail  { padding: 0 16px;  display:flex; flex-wrap: wrap;   min-width:320px;  gap: 8px; margin-top: 16px; }
.row4-thumbnail .item  { position: relative; width:calc( 100% / 4 - 6px);  margin-bottom:5px;   cursor: pointer;  }
.row4-thumbnail .item .photo {  position: relative; overflow: hidden;  border-radius: 20px; width: inherit; height: 75px; background: var(--color200);  }
.row4-thumbnail .item .photo img  {  width: 100%; height: 100%;  object-fit: cover;  }
.row4-thumbnail .item .subject { font-size:12px;  margin-top:4px; text-align: center; letter-spacing: -1px;}

.row2-thumbnail  { padding: 0 16px;  display:flex; flex-wrap: wrap;   min-width:320px;  gap: 16px 8px ; margin-top: 16px; }
.row2-thumbnail .item  { position: relative; width:calc( 100% / 2 - 4px);  margin-bottom:5px;   cursor: pointer;  }
.row2-thumbnail .item .photo {  position: relative; overflow: hidden;  border-radius: 8px; width: inherit; height: 150px; background: var(--color200);  }
.row2-thumbnail .item .photo img  {  width: 100%; height: 100%;  object-fit: cover;  }
.row2-thumbnail .item .prd-info{ margin-top: 12px;}
.row2-thumbnail .item .prd-info span{ display: block;}
.row2-thumbnail .item .prd-info .brand{ margin-bottom:2px; font-size:12px; color:var(--pointColor1);   }
.row2-thumbnail .item .prd-info .proName {  font-size:13px;  margin-bottom:5px; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;   }
.row2-thumbnail .item .prd-info .price{ font-size:15px;  font-weight:800; }

.product-info {  padding:30px 16px 24px;  }
.product-info .show-img{ text-align: center;}
.product-info .show-img img {border-radius: 32px; }
.product-info .prd-info{ margin-top: 20px; text-align: center;   }
.product-info .prd-info span{display: block;}
.product-info .prd-info .brand{ font-size:13px;   color:var(--pointColor1);   }
.product-info .prd-info .proName {  font-size:14px; line-height: 1.4;  margin-bottom: 10px;  font-weight:700;   }
.product-info .notice {font-size:17px;  text-align: center;  line-height: 1.4; }
.product-info .notice b {font-weight:900 ;}

.btn-horizontal { border-radius: 6px; height: 56px; background: var(--color800); font-size: 16px;   }


@media all and (max-width:321px) {
  .row4-thumbnail .item .photo {    height: 65px;  }
  .row4-thumbnail .item .subject { font-size:11px;  }
  .col-thumbnail .item .photo {height: 170px !important;}
  .col-thumbnail .item .zzim-position { top:125px; right:8px;}
  .col-thumbnail .item .badge-nh-set{   top:8px; left:8px;   }
  .col-thumbnail .item .badge-nation{  top:8px;  right:8px;   }
  .row2-thumbnail .item .photo {    height: 120px;  }

}



/* search-thumbnail-ty4  */
.search-thumbnail-ty4  { margin:16px 0;  }
.search-thumbnail-ty4 .item  { position: relative;    cursor: pointer; border-bottom: 1px solid var(--color900); padding:20px 0 ; }
.search-thumbnail-ty4 .item a {display: flex;}
.search-thumbnail-ty4 .item .zzim-position{ position: absolute; top:75px; left:55px; z-index: 1; }
.search-thumbnail-ty4 .item .photo {  position: relative; overflow: hidden;  width:100px;  height: 100px;  border-radius:8px;  margin-right:16px;  }
.search-thumbnail-ty4 .item .photo img  {  height: inherit;  object-fit: cover;  }

.search-thumbnail-ty4 .item .infoBox .proName,
.search-thumbnail-ty4 .item .user-infoBox .userInfo .name ,
.search-thumbnail-ty4 .board-content .title{  font-size:16px;  letter-spacing: -1px;}

.search-thumbnail-ty4 .board-content { border-bottom: 1px solid var(--color800); padding:20px 0 20px; margin-bottom: 20px; } 
.search-thumbnail-ty4 .board-content .title   { font-size: 16px;    margin-bottom: 12px;  clear: both;}
.search-thumbnail-ty4 .board-content .textCon { line-height:150%; padding-bottom:14px;  color:var(--color400);} 
.search-thumbnail-ty4 .board-content .info    { display: flex; color:var(--color600);}
.search-thumbnail-ty4 .board-content .date    { font-size:12px; margin-left: auto;    }

/* 이름,성별,자기소개 스타일 */
.user-infoBox-col .userInfo{display: flex;  line-height: 135%;  letter-spacing: -0.7px;  margin-bottom:2px; }
.user-infoBox-col .userInfo .name  {  font-size:15px; overflow: hidden;  margin-right: 4px; }
.user-infoBox-col .userInfo .sexAge{  font-size:15px; margin-left: 4px; font-weight: 400;}
.user-infoBox-col .userBlind{font-size:13px;    letter-spacing: -1px; color:var(--color500); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.user-infoBox-row .userInfo{ display: block;  line-height: 135%;  letter-spacing: -0.7px; margin-bottom:4px;   }
.user-infoBox-row .userInfo .name  { overflow: hidden;  margin-right:4px; font-weight: 500; }
.user-infoBox-row .userInfo .sexAge{    margin-left: 4px; font-weight: 300;}
.user-infoBox-row .userBlind{ position: relative; display: flex; align-items: center; font-size:12px;   letter-spacing:-0.5px; color:var(--color500); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-infoBox-row .userBlind .new { display: inline-block; margin-right: 6px;   width: 5px; height: 5px; background: var(--mainColor);  border-radius: 100px; }
.user-infoBox-row .title {  width:70%; display: inline-block; line-height: 1.45rem;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;     overflow: hidden;}
.user-infoBox-row .userInfo.smSize .name ,
.user-infoBox-row .userInfo.smSize .sexAge { font-size:13px; color: var(--color300); }


@media all and (max-width:320px) {   




}




.besic-infoBox-row{  display: block;font-weight: 500;  }
.besic-infoBox-row .inwrap{ display: block; line-height: 135%;  letter-spacing: -0.7px; margin-bottom: 4px;   }
.besic-infoBox-row .inwrap .name  {  font-size:16px; overflow: hidden;  margin-right:8px; } 
.besic-infoBox-row .inwrap .sexAge{  font-size:15px; margin-left: 4px; font-weight: 300;}
.besic-infoBox-row .indesc{ font-size:13px; letter-spacing: -0.7px; color:var(--color400); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.besic-infoBox-row .sexAge{ font-size:14px;  font-weight: 300; }

                                                  

/* 일본 여행 정보 */
.jpTour-Info{  margin: 0 10px ;  display: flex; flex-wrap: wrap;   display: grid; grid-template-columns:  repeat(4, 1fr) ;   gap:10px  0;      }
.jpTour-Info li {  display: flex; flex-wrap: wrap;  justify-content: center;  align-items: center;  }

.jpTour-Info li a { display: inline-block;  width:100%;   display: flex; flex-wrap: wrap; flex-direction: column;  justify-content: center;  align-items: center;   }
.jpTour-Info li a .ico{ display: block; width:45px; height: 45px;}
.jpTour-Info li a .ico img {width:100%;  height: 100%;}
.jpTour-Info li a .subject{ font-size:13px; color:var(--color300);  line-height: 120%; }
.jpTour-Info li a .num { background: var(--color900); color: var(--color200); font-size:9px; font-weight: 300; border-radius: 100px; max-width:30px; padding: 2px 8px; margin-top: 6px;    display: flex; align-items: center; justify-content: center; }
.jpTour-Info li a .subject em{display: block;   line-height:105%;}
.jpTour-Info li a:hover { background: var(--color900); border-radius: 8px; }

/* 하단 버튼 */
.footer-btn-area{ width:100%;  padding:0  16px;  display: flex; flex-direction: row; gap: 10px;  }
.footer-btn-area button {text-align: center;    letter-spacing:-1px; border-radius: 100px;  gap: 4px; }
.footer-btn-area button:nth-child(1)  {background: var(--pointColor3); color: var(--white); }
.footer-btn-area button:nth-child(2)  {background: var(--white);       color: var(--black); font-weight: 800; }
.footer-btn-area button:nth-child(1) i {display: block;  background:url('../resource/svg/ico-calculator.svg')no-repeat center;  background-size:100%;   width:20px; height:20px; filter: var(--filterWhite);   }
.footer-btn-area button:nth-child(2) i {display: block;  background:url('../resource/images/ani-flying.gif')no-repeat center; background-size:100%; width:44px; height:44px;  }



/*** 서브페이지 *********************************************/
.sec-AD-banner{ position: relative;  }
.sec-AD-banner .adbanner img { width:100%; height:260px; object-fit: cover;  }
.sec-AD-banner .pageing-nav{   position: absolute; bottom:0%; left: 50%; transform:translate(-50%, -0%);}

@media screen and (max-width:320px) { .jpTour-Info li a .subject{ font-size:10px;  letter-spacing: -1px; }  }




/*** 지도보기 ***/
.sec-mapView{ position: relative;    height:100vh;  }
.sec-mapView .mapArea{ max-width: 500px; height:100%;   margin: 0 auto;  z-index: 10;}
.sec-mapView .mapArea img{ width: 100%; height: 100%;    object-fit: cover;}

.sec-mapView .btn-locationWrap { position: absolute; top:80px; right:16px;  border-radius: 8px; background: rgba(255, 255, 255, 0.9); width:44px; height:44px; display: flex; ; align-items: center;   justify-content: center; }
.sec-mapView .btn-locationWrap .locationSetting { background:url('../resource/svg/btn-location.svg')no-repeat center; background-size:100%; width:28px; height:28px;  cursor:pointer;  
  filter: invert(41%) sepia(5%) saturate(884%) hue-rotate(194deg) brightness(91%) contrast(94%); }
 
  .sec-mapView .btn-locationWrap .locationSetting:active { filter: invert(32%) sepia(87%) saturate(1499%) hue-rotate(201deg) brightness(84%) contrast(101%); }



.pop-shopBubble{ position: absolute; top:280px; left:50px; background:url('../resource/svg/bubble-box.svg')no-repeat center; background-size:100%; width:80px; height:72px;  cursor:pointer;  z-index: 100;}
.pop-shopBubble .shopImg { display: inline-block; width:72px; height:54px;  object-fit: cover; border-radius: 4px;  margin: 4px;  }

.shop-filter{  position: absolute; top:56px; left:0;  width:100%;  background: var(--white); z-index: 200; padding:14px 14px;  }
.shop-filter ul {display: flex; align-items: center; }
.shop-filter ul li { color:var(--color900); }
.shop-filter ul li.sp-photo img{ height: 60px; }
.shop-filter ul li.sp-info{ margin-left:10px;} 
.shop-filter ul li.sp-info .s-name{ font-size:16px; line-height: 140%;  }


/* 별점 */
.rating-starOver-visible{ display: flex; align-items: center;}
.rating-starOver-visible i{margin-right:1px ; }
.rating-starOver-visible .on { background:url('../resource/svg/ico-star.svg') no-repeat;     background-size:100%; width:18px; height:18px;  }
.rating-starOver-visible .off{ background:url('../resource/svg/ico-star-off.svg') no-repeat; background-size:100%; width:18px; height:18px;  } 

.rating-starOver-visible.Large .on { background:url('../resource/svg/ico-star.svg') no-repeat;     background-size:100%; width:24px; height:24px;  }
.rating-starOver-visible.Large .off{ background:url('../resource/svg/ico-star-off.svg') no-repeat; background-size:100%; width:24px; height:24px;  } 

/*** 상세설명 페이지 **********************************************/
/* 탭 */
.detail-navTab{  position: sticky;  top:55px; z-index:100;}
.detail-navTab .tab-MenuList{ display: flex;   justify-content: space-between;   align-items: center;  background:var(--color300);  height:54px;   }
.detail-navTab .tab-MenuList li{ flex: 1;  text-align: center;   font-size: 15px; height: inherit;display: flex; align-items: center;  }
.detail-navTab .tab-MenuList li a{ display: flex; align-items: center; justify-content: center; width: 100%;}
.detail-navTab .tab-MenuList li .rewNum{ display: inline-block; font-size:11px; margin-left:3px; border-radius: 100px; background: var(--color700); color:var(--white);  padding:0px 6px;   }
.detail-navTab .tab-MenuList li:active{ background: var(--black); color: var(--white);  } 
.detail-navTab .tab-MenuList li:active .rewNum { background: var(--color200);  color:var(--black)  }

.detail-navTab .tab-MenuList li.active{ background: var(--black); color: var(--white);  } 
.detail-navTab .tab-MenuList li.active .rewNum { background: var(--color200);  color:var(--black)  }

.height-fix { /* 높이지정*/   }

/* 01 정보 */
.sec-prd-detail-img{ position: relative; }
.sec-prd-detail-img .swiper-img img { width:100%; height: 400px; object-fit: cover;  }
.sec-prd-detail-img .pageing-nav {  position: absolute; bottom:0; left: 50%; transform:translate(-50%, 0);}


.sec-prd-detail-info{ position: relative; padding:24px 16px; }
.sec-prd-detail-info > li { margin-bottom:20px ;}
.sec-prd-detail-info .prd-title-wrap{ margin-bottom: 26px;}
.sec-prd-detail-info .prd-title-wrap .prd-name{ font-size:20px; font-weight:800; margin:8px 0 4px;  width:70%; line-height: 1.4;  }
 
.sec-prd-detail-info .prd-title-wrap .zzim-position{position: absolute; top:50px; right:16px;} 
.sec-prd-detail-info .prd-title-wrap .badge-position { display: flex;   }
.sec-prd-detail-info .prd-title-wrap .badge-position .level-badge{ display:block; background:#FCF4EF; height: 30px;  height: 26px; margin-right: 6px; padding:0 12px; border-radius: 100px; font-size: 12px;  
                                                                  display:flex; justify-content: center; align-items: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; z-index: 10;    }


.sec-prd-detail-info .prd-lacation-wrap {border: 1px solid  var(--color200); padding:16px 10px; border-radius: 8px; }
.sec-prd-detail-info .prd-lacation-wrap li { position: relative; font-size:13px; }
.sec-prd-detail-info .prd-lacation-wrap li.add{display:flex; margin-bottom: 12px;}
.sec-prd-detail-info .prd-lacation-wrap li.add .adtxt{    width:70%;  margin-right: 8px;}
.sec-prd-detail-info .prd-lacation-wrap li.add button{ margin-left: auto; max-width:70px; font-size:12px; border-radius: 100px; height: 26px; }
.sec-prd-detail-info .prd-lacation-wrap li.add::before { content:""; background:url('../resource/svg/ico-location.svg') no-repeat center;  background-size:100%; width:22px; height:22px;  margin-right: 4px;}

.sec-prd-detail-info .prd-lacation-wrap li.tel{ display: flex;   }
.sec-prd-detail-info .prd-lacation-wrap li.tel::before { content:""; background:url('../resource/svg/ico-tel.svg') no-repeat center;  background-size:100%; width:22px; height:22px;  margin-right: 4px;}

.sec-prd-detail-info .prd-description {line-height: 1.6rem; margin-top:24px; font-size:15px;  word-break: break-all;}

/* 02 가격 */
.sec-prd-price-info{ position: relative; padding:30px 16px; }
.sec-prd-price-info .price-prdList{}
.sec-prd-price-info .price-prdList li { border: 1px solid  var(--color200); border-radius: 4px; height: 60px; padding:0 16px; margin-bottom:8px;  display: flex;  align-items: center; }
.sec-prd-price-info .price-prdList li:last-child {margin-bottom:0; }
.sec-prd-price-info .price-prdList li .prdName { flex: 1; color: var(--color800);}
.sec-prd-price-info .price-prdList li .charge  { margin-left: auto; font-weight: 900; }

/* 03 갤러리 */
.sec-prd-gallery-info{ position: relative; padding:30px 16px 0px; min-width:320px; }
.sec-prd-gallery-info .photo-gallery {  display: flex;  flex-direction: column;   }
.sec-prd-gallery-info .photo-gallery li{  width:100%;   margin-bottom: 10px;   }
.sec-prd-gallery-info .photo-gallery li:last-child { margin-bottom: 0; }
.sec-prd-gallery-info .photo-gallery li img{ width:100%; height: 200px; object-fit: cover;}
.sec-prd-gallery-info .photo-gallery li.btn-more .view{ }

.btn-moreView {   margin-top:10px;   }
.btn-moreView a{ display: flex;   align-items: center; justify-content: center; }
.btn-moreView img {width:40px; height: 40px; display: block;  margin:0 6px;     }


.videoPlay-box{ position: relative; }
.btn-playwrap{  position: absolute; top:50%; left:50%; transform:translate(-50%, -50%);  border-radius: 100px;   background: rgb(var(--rgb-white), 37%);  width:80px; height:80px; display: flex; align-items: center; justify-content: center; }
.btn-playwrap .btn-video-play { display: block;  background:url('../resource/svg/ico-triangle.svg') no-repeat center;  background-size: 100%; width:34px; height:34px;  filter: var(--filterMain); }

 
/* 04 쿠폰 */
.sec-prd-coupon-info{ position: relative; padding:30px 16px;  }
.sec-prd-coupon-info .coupon-down{}
.sec-prd-coupon-info .coupon-down li {position: relative; display: block; margin-bottom: 8px; }
.sec-prd-coupon-info .coupon-down li:last-child{ margin-bottom: 0; }
.sec-prd-coupon-info .coupon-down li .coupon-outline img {width:100%; }
.sec-prd-coupon-info .coupon-down li .cup-dataDesc  { position: absolute; top: 50%; left: 42%; transform: translate(-42%, -50%);  text-align: center; }
.sec-prd-coupon-info .coupon-down li .cup-dataDesc .cupName{ font-size:18px; color: var(--pointColor1); display: block; margin-bottom:6px;}
.sec-prd-coupon-info .coupon-down li .cup-dataDesc .cupDate {font-size:14px; }

 

/* 05 후기 */
.sec-prd-review  {}
.sec-prd-review .review-list { position: relative; padding:0 16px 100px ; }
.sec-prd-review .review-list .item {position: relative;  border-bottom: 1px solid #E9E9EC; padding: 30px 0 30px; }
.sec-prd-review .review-list .item:first-child { padding-top: 0;}
.sec-prd-review .review-list .item .rev-user-info{   color:#7F8090;  display: flex;   }
.sec-prd-review .review-list .item .rev-user-info .left-pos {  margin-right: 10px;  }
.sec-prd-review .review-list .item .rev-user-info .left-pos img{ border-radius: 100%; width:56px; height:56px;}

.sec-prd-review .review-list .item .rev-user-info .right-pos { position: relative; width:calc(100% - 70px);   margin-top:12px;}
.sec-prd-review .review-list .item .rev-user-info .right-pos .name{ color: var(--color900); font-weight: 900; display: block;}
.sec-prd-review .review-list .item .rev-user-info .right-pos .rating-starOver-visible{  display: inline-flex;  margin-top: 6px;}
.sec-prd-review .review-list .item .rev-user-info .right-pos .date  { position: absolute; top:26px; left:100px;   font-size:12px; }
.sec-prd-review .review-list .item .rev-user-info .right-pos .report{ position: absolute; top:0px; right:0;   font-size:13px;}

.sec-prd-review .review-list .item .rev-content { font-size:16px; line-height: 26px; margin:16px 0 20px;  color: var(--color700);  word-break: break-all; }

.photo-view-gallery {  display: flex; flex-direction: column;   gap: 8px 0; }
.photo-view-gallery  img { width:100%; /*height: 200px;*/ object-fit: cover; }



/*그래프*/
.review-progressWrap{border-radius: 10px 10px 0 0; border: 1px solid var(--color200); margin:30px 16px 6px;   }
.review-progressWrap .rating-prgsArea {border-radius: inherit; background: var(--color100); height: 100px; display: flex; flex-wrap: wrap; flex-direction: column; justify-content: center; align-items: center;  }
.review-progressWrap .rating-prgsArea li {}
.review-progressWrap .rating-prgsArea li.pointNum{ font-size:34px; font-weight: 900; line-height: 100%; margin-bottom: 8px; }
.review-progressWrap .rating-prgsArea li.rating-position{   }
.review-progressWrap .rating-prgsArea li.rating-position .rating-starOver-visible  { display: flex; justify-content: center; align-items: center; }


.bar-graph-horizontal {width:100%; padding:20px 14px;   }
.bar-graph-horizontal .item { width: 100%;  display:flex; flex-flow:row nowrap; padding-bottom: 10px;   display: flex; align-items: center;  }
.bar-graph-horizontal .item:last-child {padding-bottom: 0; }
.bar-graph-horizontal .item .subject  { width:50px; }
.bar-graph-horizontal .item .out-pack{position: relative;  width:calc(100% - 50px);  background: #efefef; height:6px; border-radius: 100px; }
.bar-graph-horizontal .item .out-pack .bar {  float: left; border-radius: 100px; height:6px;  overflow: hidden; z-index: 1; }

.bar-graph .subject {
    -webkit-animation: fade-in-text 2.2s 0.1s forwards;
    -moz-animation: fade-in-text 2.2s 0.1s forwards;
    animation: fade-in-text 2.2s 0.1s forwards;
    opacity: 0;
  }
  
  .bar-graph-one .bar-one .bar {
    background-color: #95EAD5;
    -webkit-animation: show-bar-one 1.2s 0.1s forwards;
    -moz-animation: show-bar-one 1.2s 0.1s forwards;
    animation: show-bar-one 1.2s 0.1s forwards;
  }
  
  .bar-graph-one .bar-two .bar {
    background-color: #95EAD5;
    -webkit-animation: show-bar-two 1.2s 0.2s forwards;
    -moz-animation: show-bar-two 1.2s 0.2s forwards;
    animation: show-bar-two 1.2s 0.2s forwards;
  }
  
  .bar-graph-one .bar-three .bar {
    background-color: #95EAD5;
    -webkit-animation: show-bar-three 1.2s 0.3s forwards;
    -moz-animation: show-bar-three 1.2s 0.3s forwards;
    animation: show-bar-three 1.2s 0.3s forwards;
  }
  
  .bar-graph-one .bar-four .bar {
    background-color: #95EAD5;
    -webkit-animation: show-bar-four 1.2s 0.4s forwards;
    -moz-animation: show-bar-four 1.2s 0.4s forwards;
    animation: show-bar-four 1.2s 0.4s forwards;
  }
  
  /* Bar Graph Horizontal Animations */
  @-webkit-keyframes show-bar-one  {
  0% { width: 0; }
  /* 100% { width: 100%; } */
  }
  
  @-webkit-keyframes show-bar-two {
      0% { width: 0; }
    /* 100% { width: 71%; } */
  }
  
  @-webkit-keyframes show-bar-three {
      0% { width: 0; }
    /* 100% { width: 52%; } */
  }
  
  @-webkit-keyframes show-bar-four {
      0% { width: 0; }
    /* 100% { width: 40%; } */
  }
  
  @-webkit-keyframes show-bar-five {
    0% { width: 0; }
  /* 100% { width: 40%; } */
}

  @-webkit-keyframes fade-in-text {
    0% { opacity: 0; }
  100% { opacity: 1; }
  }

/* 갤러리( 사진 확대 페이지) */
.sec-gallery-Show{ position: relative; }
.sec-gallery-Show .default-photo   {  position: relative; } 
.sec-gallery-Show .default-photo img{width:100%;  height: 600px;  object-fit: cover;  }

.nav-photoPaging  {    margin:16px; display: flex; flex-wrap: wrap; align-items: center; gap: 5px 7px;  }
.nav-photoPaging li   { width:calc(100% / 4 - 5.5px);  }
.nav-photoPaging li a { position: relative;  display: inline-block; width:100%;  height: 75px; }
.nav-photoPaging li img{  width: 100%;  height: inherit;  object-fit: cover;  }
.nav-photoPaging li a:hover::after{ content: ""; position:absolute; top:0; left:0;  border:3px solid var(--mainColor);   z-index:100; width:100%; height:inherit; }

.nav-photoPaging .btn-playwrap { width: 34px; height: 34px; }
.nav-photoPaging .btn-playwrap .btn-video-play{width: 16px; height: 16px; }

 
.btn-wide-seclect { padding:0 16px; }
.btn-wide-seclect a{ display: flex; justify-content: center;align-items: center; background: var(--color400); color: var(--color900); border-radius: 6px; height: 55px; margin-bottom: 10px;  }
.btn-wide-seclect a:last-child{ margin-bottom: 0; }



/* 사진 갤러리 (토크 글보기) */
.sec-postViewer{   margin: 0 16px;}
.sec-postViewer .default-photo {position: relative;}
.sec-postViewer .default-photo img{width:100%;  height: 600px;  object-fit: cover;  border-radius: 8px; }
.sec-postViewer .default-photo .badge-nh-set { position: absolute; top:10px; left:10px; }

.default-photo .bighand-view {  position: absolute; bottom:10px; right: 10px;  width: 56px; height:56px; border-radius: 100px; background: rgb(var(--rgb-black), 37%);  display: flex; justify-content: center; align-items: center; }
.default-photo .bighand-view i { display: flex; background:url('../resource/images/ico-hand-exp.png') no-repeat center; background-size:100%; width:30px; height:30px;  }

@media all and (max-width:320px) {
  .sec-postViewer .default-photo img{   height: 500px;  }
  .nav-photoPaging li   { width:calc(100% / 3 - 5px);  }
}

.arrow-btn .left  { position: absolute; top:50%; left: 0px;  background:url('../resource/svg/arrow-left.svg') no-repeat center;   background-size:100%; width:30px; height:30px;   filter: var(--filter500); }
.arrow-btn .right { position: absolute; top:50%; right:0px;  background:url('../resource/svg/arrow-right.svg') no-repeat center;  background-size:100%; width:30px; height:30px;   filter: var(--filter500); }




.sec-postViewer .arrow-btn { z-index: 200;}
.sec-postViewer .arrow-btn a{ display:inline-block; }
.sec-postViewer .arrow-btn .left  { position: absolute; top:50%; left: 0px;     }
.sec-postViewer .arrow-btn .right { position: absolute; top:50%; right:0px;   }

.nav-photoPaging-small     { margin:16px 0; display: flex;   align-items: center; gap: 4px;  }
.nav-photoPaging-small li  {  flex: 1; }
.nav-photoPaging-small li a { position: relative;  display: inline-block; width:100%;  height: 45px;   }
.nav-photoPaging-small li img { width: 100%; height: inherit;  object-fit: cover;  border-radius: 4px; }
.nav-photoPaging-small li a:hover::after{ content: ""; position: absolute; top:0; left:0;  border:3px solid var(--mainColor);   z-index:100; width:100%; height:inherit; border-radius: 4px; }


@media screen and (min-width:768px) { 
  .nav-photoPaging-small  { gap: 8px 7px; width:60%;   margin:16px auto; }
  .nav-photoPaging-small li a { height:50px;  }  
  .nav-photoPaging-small li a:hover::after{ height: inherit; }
} 

/*** tab 모음 *********************************************/
.tab-horizontal-type1 { display:flex;   height: 40px;  margin: 0 16px ;  }
.tab-horizontal-type1 li{ border-bottom:1px solid var(--color900);  flex: 1;   height: inherit;  display: flex; justify-content: center; align-items: center; flex-wrap: wrap;  font-size:16px;  }
.tab-horizontal-type1 li.active{ border-bottom:3px solid var(--mainColor);  color:var(--mainColor); font-weight: 900;  }
.tab-horizontal-type1.small li {font-size:15px; }

.tab-duo-type2 {display: flex;   height: 36px; border:1px solid var(--color800);  width:124px; border-radius: 4px;   }
.tab-duo-type2 li  { flex: 1;  height: inherit;  display: flex; justify-content: center; align-items: center; flex-wrap: wrap;  padding:0 10px; font-size:13px;  }
.tab-duo-type2 li:nth-child(1).active {background:var(--color900);  border-radius: 4px 0  0 4px; height:34px; }
.tab-duo-type2 li:nth-child(2).active {background:var(--color900);  border-radius: 0 4px 4px 0;  height:34px;}

.tab-roundLine-type3 {display: flex;   justify-content: start;  gap: 6px;   }
.tab-roundLine-type3 li { border:1px solid var(--color700); background: var(--color900); height: 34px; border-radius: 100px;  padding:0 14px; font-size:13px; display: flex; justify-content: center; align-items: center;    }
.tab-roundLine-type3 li:first-child { margin-left: 16px;}
.tab-roundLine-type3 li.adult-ico { padding:0 18px 0 4px; }
.tab-roundLine-type3 li.adult-ico .adult-19{ display: flex;  background: var(--mainColor); border-radius: 100px;  width: 22px; height: 22px; justify-content: center; align-items: center; font-size:11px;  margin-right: 4px; } 
.tab-roundLine-type3 li a {display: flex; align-items: center;}
.tab-roundLine-type3 li.active{ border:1px solid var(--white); background: transparent; }
.tab-roundLine-type3.whiteLine li{  border:1px solid var(--white); background: transparent; height: 36px;  width:calc(100% / 3) !important; }

.tab-roundBg-type4 {display: flex; gap: 8px;     }
.tab-roundBg-type4 li { background: var(--color800); color: var(--color400); height: 34px; border-radius: 100px;  padding:0 10px 0 14px; font-size:13px; display: flex; justify-content: center; align-items: center;    }
.tab-roundBg-type4 li:first-child { margin-left: 16px;}
.tab-roundBg-type4 li a {display: flex; align-items: center;}
.tab-roundBg-type4 li .subj{ margin-right:8px; }
.tab-roundBg-type4 li .btn-del{ display: inline-block;  background:url('../resource/svg/btn-close.svg') no-repeat center;  background-size:100%; width:12px; height:12px;  filter: var(--filterWhite);}


/*** 일본친구(라운지) *********************************************/
.sub-tabWrap{margin: 16px 16px; display: flex;  }
.tab-option-filter {display: flex; margin: 10px 16px;}
.tab-option-filter .tab-duo-type2.right {margin-left: auto;}

/*** 일본친구(랭킹) *********************************************/

/* 랭킹 탑 */
.rangking-topTier  { position: relative;  margin:0 16px;       cursor: pointer; }
.rangking-topTier .zzim-position{ position: absolute; top:165px; right:10px; z-index: 1; }
.rangking-topTier .top-badge {position: absolute; top:10px; right:10px; z-index: 200; }
.rangking-topTier .top-badge img{width:50px; }

.rangking-topTier .photo {  position: relative; overflow: hidden;  border-radius:16px; width: inherit; width: 100%; height: 220px; }
.rangking-topTier .photo img  {   width: 100%; height: 100%;  object-fit: cover;  }
.rangking-topTier .photo::before{ content:"";  position: absolute; bottom:-1px; left:0;  background:url('../resource/images/thumb-dakr-bg.png') repeat-x  bottom;  width:inherit; height:210px;   }

.rangking-topTier .user-infoBox{  position: absolute; bottom:20px; left:16px; display: block;  border-radius: 0 0 14px 14px;    z-index:500; }
.rangking-topTier .user-infoBox .userInfo{display: flex;  line-height: 135%;  letter-spacing: -0.7px;  margin-bottom:4px;  }
.rangking-topTier .user-infoBox .userInfo .name  {  font-size:20px; overflow: hidden;  margin-right: 4px; color: var(--white); }
.rangking-topTier .user-infoBox .userInfo .sexAge{  font-size:15px; margin-left: 4px; font-weight: 400; color: var(--white);}
.rangking-topTier .user-infoBox .userBlind{font-size:14px; font-weight: 300;   letter-spacing: -1px; color:var(--color200); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }


@media screen and (min-width:768px) {  
  .rangking-topTier .zzim-position{  top:345px;  }
  .rangking-topTier .photo { height: 400px; }
  .rangking-topTier .photo::before{    }
  .rangking-topTier .top-badge img  {width:70px;}
}

 /* 기본 리스트형  */
.row-ListType-normal  { padding: 10px 16px;    min-width:320px;   }
.row-ListType-normal .item  {display: flex;   position: relative;  width: 100%;  border-bottom: 1px solid var(--color900);  padding:20px 0;    cursor: pointer; }
.row-ListType-normal .item:first-child {padding-top:0; }
.row-ListType-normal .item .photo {  position: relative; overflow: hidden;  border-radius:8px;   width: 60px; height: 60px; margin-right: 12px; }
.row-ListType-normal .item .photo img  {  width: 100%; height: 100%;  object-fit: cover;  }
.row-ListType-normal .item .rowArea{display: flex; align-items: center;  justify-content:center; width:calc(100% - 60px); }

/* + 알림 */
.row-ListType-normal .item.alarm .photo { width: 46px; height: 46px; }
.row-ListType-normal .item.alarm .rowArea .besic-infoBox-row .inwrap .name  {  font-size:14px;}
.row-ListType-normal .item.alarm .rowArea .besic-infoBox-row .indesc  { font-size:12px; }
.row-ListType-normal .item.alarm .rowArea .right-fix  a { width:34px;  }

/* 별점+후기 */
.customer-reviews { display: flex;  align-items: center; font-size:12px; color: var(--color400); margin:8px 0 0 0; }
.customer-reviews .review{ position: relative; padding-left: 16px; }
.customer-reviews .review::before{content:"."; position: absolute; bottom:8px; left:5px;   font-size:20px;     }

.customer-reviews .rating-star{position: relative;  margin-left:16px;  }
.customer-reviews .rating-star::after{content:""; position: absolute; bottom:3.5px; left:-16px; background:url('../resource/svg/ico-star.svg') no-repeat; background-size:100%; width:14px; height:14px;  }

.customer-reviews .dot{ display: inline-block; margin: 0 16px 0 10px;   width:3px; height:3px; background:var(--color600); border-radius: 100px; }

@media screen and (max-width:320px) { 
  .customer-reviews { display: flex; flex-direction: column; justify-content: start; align-items: flex-start  }
  .customer-reviews .dot{ display: none; }
  .customer-reviews .review{   padding-left: 0; }
  .customer-reviews .review::before{content:""; position: absolute; bottom:0px; left:0px;        }
}



/*일본친구*/
.row-ListType-normal .item .rowArea .right-fix { position: relative; display: flex;   margin-left: auto;  gap:6px;  }
.row-ListType-normal .item .rowArea .right-fix.column{   flex-direction: column;  }
.row-ListType-normal .item .rowArea .right-fix.column .del {margin-right:0; margin-left:auto; }

.row-ListType-normal .item .rowArea .right-fix .date {display: block; font-size:12px;  color: var(--color500); line-height: 90%; margin-top: 4px; }

/*토크*/
.row-ListType-normal .item .rowArea .right-fix.col{  flex-wrap: wrap;   flex-direction: column; margin-left: auto;  gap:2px;  }
.row-ListType-normal .item .rowArea .right-fix.col .write-date{  font-size: 12px; color: var(--color500);    }
.row-ListType-normal .item .rowArea .right-fix.col .badge-zzim{ display: flex;    justify-content: center;  background:var(--color800);   }

/*** 채팅 *********************************************/
.row-ListType-chatting  { padding: 0 16px;    min-width:320px;   } 
.row-ListType-chatting .item  { align-items: center; position: relative; border-bottom: 1px solid var(--color900);  padding:20px 0 6px;    cursor: pointer; }
.row-ListType-chatting .item:first-child {padding-top:0; }
.row-ListType-chatting .item .first-row { display: flex;  position: relative; }
.row-ListType-chatting .item .first-row .badge-nh-set { position: absolute; top:4px; left:4px; z-index: 100; }

.row-ListType-chatting .item .photo {  position: relative; overflow: hidden; border-radius:8px;   width: 86px; height: 86px; margin-right: 16px; }
.row-ListType-chatting .item .photo img  {  width: 100%; height: 100%;  object-fit: cover;  }
.row-ListType-chatting .item .rowArea{ position: relative;  display: block;  width:calc(100% - 95px);     }
.row-ListType-chatting .item .rowArea .user-infoBox-row{  display: block; }
.row-ListType-chatting .item .zzim-position { position: absolute; top:0; right:0; }

.row-ListType-chatting .badge-row-wrap {margin-top: 15px;}
.row-ListType-chatting .badge-row-wrap .right-position{ margin-left: auto; display: flex; gap: 4px; }
.row-ListType-chatting .badge-row-wrap .badge-nation { margin-right:8px;}



.videoChatBtn-set{}
.videoChatBtn-set a { background:var(--color900); display: flex;  justify-content: center; align-items: center; width:36px; height: 36px;  margin-right: 6px; border-radius: 4px;   }
.videoChatBtn-set img {width:20px;    }
.videoChatBtn-set a.chat img  { filter: invert(36%) sepia(10%) saturate(462%) hue-rotate(194deg) brightness(100%) contrast(86%);    }
.videoChatBtn-set a.video img { filter: invert(17%) sepia(97%) saturate(7420%) hue-rotate(350deg) brightness(86%) contrast(110%);}
.videoChatBtn-set a.del { border:1px solid var(--color800);  background: transparent; }
.videoChatBtn-set a.del img  { filter: invert(36%) sepia(10%) saturate(462%) hue-rotate(194deg) brightness(100%) contrast(86%); width:18px; }

.row-ListType-chatting .item .row-Area {display: flex; align-items: end;  margin-top: 8px;   width:100%; }
.row-ListType-chatting .item .row-Area a{}
.row-ListType-chatting .item .row-Area .write-date { display: inline-block;  margin-left: auto;   font-size: 12px; color: var(--color500); }

.button-write-wrap{ position: fixed;  right:0; left:0;  bottom:80px;  max-width: 500px;  min-width: 320px;   margin: 0px 0px 0px calc(45vw + 100px); z-index: 1; }
.button-write-wrap .btn-write{position: relative; margin:0 auto; display:block; background: var(--mainColor); border-radius: 100px; height: 40px; color: var(--white); font-size:15px; width:100px; display: flex; align-items: center; }
.button-write-wrap .btn-write::before {content: "";  position: absolute; top:10px; left:12px;  background:url('../resource/svg/ico-plus.svg') no-repeat bottom;  background-size:100%; width:20px; height:20px;
                                     filter: invert(100%) sepia(0%) saturate(2%) hue-rotate(319deg) brightness(108%) contrast(101%);}
.button-write-wrap .btn-write span {display: inline-block; margin-left:38px;}

.button-write-wrap .btn-write:hover {  color: var(--mainColor); background:var(--white); font-weight: 900; }
.button-write-wrap .btn-write:hover::before{ filter: var(--filterMain); }


@media all and (max-width:1201px) {
  .button-write-wrap { margin:0 auto; }
}



/*** 토크 글보기 *********************************************/
.content-post { color: var(--color400); padding: 20px 0 0;}
.content-post .write-date{color: var(--color500); display:block; margin-bottom: 12px;  }
.content-post .textArea {line-height: 160%;  font-size: 16px;  word-break: break-all;}




/*** 피드 *********************************************/

.sec-board-container{   }
.board-content-wrap{    }
.board-content-wrap .item{border-radius: 10px; padding:18px 16px 18px; margin:0 16px 16px 16px; background: var(--color900);  box-shadow:0px 0px 14px 0px rgb(0 0 0 / 7%); }
.board-content-wrap .item:after {content: ""; display: table;  clear: both;}

.board-content-wrap .feed-content  { border-bottom: 1px solid var(--color800); padding:20px 0 20px; margin-bottom: 20px; } 
.board-content-wrap .feed-content .title {font-size: 17px;  line-height: 160%;  margin-bottom: 10px;  clear: both;}
.board-content-wrap .feed-content .text  {font-size:15px; line-height: 24px;   color: var(--color400);   padding-bottom:10px; word-break: break-all; }
.board-content-wrap .feed-content .date { font-size:12px;  color: var(--color600);  }

.board-footer-info { display: flex; justify-content: space-between; align-items: center;  }
.board-footer-info .date { font-size:12px;  color: var(--color600);  }

.btn-wrap-right{ display: flex;     gap:6px;   }
.btn-wrap-right button { width:45px; }

.btn-wrap-side { display: flex;  justify-content: space-between; gap:6px;   }
.btn-wrap-side button { width:45px; }



/* 프로필사진, 카테고리 */
.sec-board-container .sort-rowArea  {display: flex;    }
.sec-board-container .sort-rowArea .userInfo { display: flex; align-items: center;  color: var(--color300);}
.sec-board-container .sort-rowArea .userInfo .photo{ width:30px; border-radius: 100px;  object-fit: cover; margin-right: 8px; }

.sec-board-container .sort-rowArea .rightArea { margin-left: auto; }
.sec-board-container .sort-rowArea .category { display: inline-block; background:var(--color800); border-radius: 4px; height: 26px; font-size:12px; color: var(--color600); padding:0 10px; display: flex;  align-items: center; }
.sec-board-container .sort-rowArea .leftArea { }
.sec-board-container .sort-rowArea .report { display: inline-block; border:1px solid var(--color800); border-radius: 4px; height: 26px; font-size:12px;  color: var(--color600); padding:0 10px; display: flex; justify-content: center; align-items: center; }

.sec-board-container .reg-rowArea{ position: relative; display: flex; align-items: center; font-size:12px;  color: var(--color500);  justify-content: space-between;     }
.sec-board-container .reg-rowArea span{position: relative;}
.sec-board-container .reg-rowArea .reply{padding-left:22px; }
.sec-board-container .reg-rowArea .reply::before{ content: "";  position: absolute;  top:-2px; left:0;  background:url('../resource/svg/ico-reply.svg') no-repeat center;  background-size:100%; width:20px; height:20px;  filter: var(--filter600);  }
.sec-board-container .reg-rowArea .reply .num{ display: inline-block; margin-left: 4px; color:#2C82F6; }
.sec-board-container .reg-rowArea .like { padding-left:22px;}
.sec-board-container .reg-rowArea .like::before{ content: "";  position: absolute; top:-2px; left:0;  background:url('../resource/svg/ico-like.svg') no-repeat center;  background-size:100%; width:20px; height:20px;  filter: var(--filter600); }
.sec-board-container .reg-rowArea .like.active::before  {  filter: var(--filterMain);  }
.sec-board-container .reg-rowArea .view .num{ display: inline-block; margin-left: 4px;   }

.sec-board-container .content-des-info{text-align: right; color: var(--color400); padding:16px 16px 10px; font-size:12px; }

.sec-board-container .info-rowArea  {display: flex;  }
.sec-board-container .info-rowArea .userInfo { display: flex; align-items: center;  color: var(--color300);}
.sec-board-container .info-rowArea .userInfo .photo{ width:30px; border-radius: 100px;  object-fit: cover; margin-right: 8px; }
.sec-board-container .info-rowArea .rightArea { margin-left: auto; display: inline-block;  font-size:12px;  color: var(--color600);  display: flex; align-items: center; }

/* 원글보기 */
.sec-board-container .user-detail-view{ background:var(--color900);  padding:20px 16px;    }
.sec-board-container .user-detail-view {    }
.sec-board-container .user-detail-view .titArea .bubble-blue {    }
.sec-board-container .user-detail-view .titArea .menu{position: absolute;  right:10px;  background:url('../svg/ico-more.svg')no-repeat center;  width: 20px; height: 20px; cursor: pointer; }
.sec-board-container .user-detail-view .titArea .title{font-size: 18px; font-weight: 600; padding:20px 0;  clear: both;}
.sec-board-container .user-detail-view .titArea .date{ color:#979AA3  }
.sec-board-container .user-detail-view .text-content{  padding:18px 0 20px; margin:18px 0;  border-top: 1px solid var(--black);  border-bottom: 1px solid var(--black);   }
.sec-board-container .user-detail-view .text-content .textArea{ font-size:16px; line-height: 26px; color:var(--color400);  word-break: break-all;  }

/* 댓글 */
.review-reply{  margin-top:10px;    }
.review-reply .item{position: relative !important; border-bottom: 1px solid var(--color900);  padding:20px 20px; }
.review-reply .text-content{ padding: 16px 0 14px;}
.review-reply .text-content .textArea {  font-size:15px; color:var(--color400); line-height: 155%;   word-break: break-all }

/* 글작성 입력폼 */
.footer-writing-box{position: fixed; bottom:0; left:0; padding:0 16px; background:var(--color900); min-width:320px; max-width: 500px; width: 100%; height: 64px;  margin: 0px 0px 0px calc(45vw + 100px);
       display: flex; justify-content: space-between;  align-items: center;}
.footer-writing-box li{      }
.footer-writing-box .btn-more { margin-right:14px;   }
.footer-writing-box .btn-more img {width:46px; filter: invert(39%) sepia(2%) saturate(2763%) hue-rotate(194deg) brightness(96%) contrast(96%); }
.footer-writing-box .reply-write {flex-grow:3;}
.footer-writing-box .reply-write input {width:98%;  border: 0; height: 46px; }

.footer-writing-box .btnWrap { margin-left:auto;  }
.footer-writing-box .btn-send { display: inline-block; position: relative; background:var(--black);  width:46px; height: 46px;  border-radius: 4px; }
.footer-writing-box .btn-send::before{ content: ""; position: absolute; top:10px; left:10px; background:url('../resource/svg/btn-send.svg') no-repeat center;  background-size:100%; width:26px; height:26px; 
   filter: invert(62%) sepia(4%) saturate(780%) hue-rotate(198deg) brightness(86%) contrast(86%); }



@media all and (max-width:1201px) {
  .footer-writing-box { margin:0 auto; left: 50%; transform: translate(-50%, 0);  }
}

.sec-searchResult {  }
.searchNotice{ text-align: center; font-size:18px; margin-top: 150px; }
.searchNotice span{ color:var(--pointColor1); }

/*햄버거 슬라이드 메뉴*/
.slider-menuContainer{ margin: 0 16px;}
.slider-menuContainer .slider-header{  padding:20px 20px 20px; display: flex;}
.slider-menuContainer .slider-header a{ display: inline-block; text-indent:-999999px; filter: invert(100%) sepia(1%) saturate(7488%) hue-rotate(316deg) brightness(105%) contrast(89%);  }
.slider-menuContainer .slider-header .left-position { }
.slider-menuContainer .slider-header .close  {float: right; background:url('../resource/svg/btn-close.svg')no-repeat center;  width: 15px; height: 15px; }
.slider-menuContainer .slider-header .right-position { margin-left: auto;  }
.slider-menuContainer .slider-header .alarm  { background:url('../resource/svg/btn-alarm.svg')no-repeat center; width: 25px; height: 25px; margin-right: 14px;  }
.slider-menuContainer .slider-header .setting {   background:url('../resource/svg/btn-setting.svg')no-repeat center; width: 25px; height: 25px;  }

.profile-userInfo { position: relative;  display: flex;    justify-content: center; align-items: center;  clear: both;  }
.profile-userInfo a {    }
.profile-userInfo .thumb-character{ position: relative;  display: block;    display: flex;    justify-content: center;  }
.profile-userInfo .cover:after {content:"검수중"; background: rgb(var(--rgb-black), 45%); display: flex; align-items: center; justify-content: center;   position: absolute;  top: 0; left: 0;  width: 100%; height: 100%;  pointer-events: none;  z-index: 1;}
.profile-userInfo .thumb-character img {border-radius: 100px;  width:110px; height: 110px; object-fit: cover;}
.profile-userInfo .btn-photo-reg {  position: absolute; top:110px; left: 50%; transform: translate(-50%, -50%); display: block; border-radius: 100px; width: 40px; height: 40px;  background: var(--white);display: flex;justify-content: center;  align-items: center; z-index: 505; }
.profile-userInfo .btn-photo-reg img { height: 60%; filter: invert(37%) sepia(8%) saturate(566%) hue-rotate(194deg) brightness(96%) contrast(89%);   }

.profile-userInfo .nameBox {display: flex;  justify-content: center; line-height: 135%;  letter-spacing: -0.7px;  margin:36px 0 4px;   }
.profile-userInfo .nameBox .name   {  font-size:18px; overflow: hidden;  margin-right: 4px; }
.profile-userInfo .nameBox .sexAge {  font-size:16px; margin-left: 4px; font-weight: 400;}
.profile-userInfo .userBlind{ font-size:13px; color:var(--color400); display: flex;  justify-content: center;}

/* 인증 버튼 */
.certification-area{ display: flex; justify-content: center; gap: 15px;}
.certification-area li {   font-size:13px;     }
.certification-area li img{ display: inline-block; padding:0 4px 0 16px;  }
.certification-area li a {border-radius: 100px; width:135px;  height: 34px; display: flex;  align-items: center;  }
.certification-area li a.btn-certifi-before { border: 1px solid var(--mainColor);  color: var(--white); cursor:pointer;  }
.certification-area li a.btn-certifi-after  { background:var(--pointColor3); color: var(--white); }
.certification-area li a.btn-certifi-text  { border:1px solid var(--pointColor3);  background:rgb(var(--rgb-point3), 40%)  ;  color: var(--white); }



.myTotal-Point{ margin:25px 0;}
.myTotal-Point li {position: relative; display: flex; padding:12px; }
.myTotal-Point li.totalPoint{ border:1px solid var(--color800); border-radius:4px 4px  0 0; background: transparent;  font-size:16px; height: 56px; }
.myTotal-Point li.totalPoint > p {   display: flex; align-items: center;  }
.myTotal-Point li.totalPoint .subj img{width:24px;  margin-right: 4px;}
.myTotal-Point li.totalPoint .pointNum { margin-left:auto; color:var(--mainColor); font-weight: 900;}
.myTotal-Point li.totalPoint .pointNum em { font-weight: 700; display: inline-block; margin-left: 4px; } 
.myTotal-Point li.btn-charge { position: relative; display: flex; align-items: center; justify-content: center; height: 52px; border-radius:0px 0px 4px 4px; font-size:16px; font-weight:900;  background:var(--white); color: var(--color900); }
.myTotal-Point li.btn-charge a {display: inline-block; margin-left:8px;}
.myTotal-Point li.btn-charge::before{content:""; display: inline-block; background:url('../resource/svg/ico-charge.svg')no-repeat center; width: 25px; height: 25px; }

.slider-menuContainer .menuList-1depth {   display: flex;  flex-wrap: wrap; gap: 6px;   }
.slider-menuContainer .menuList-1depth li { display: flex; justify-content: center; align-items: center;   width:calc(100% / 2 - 4px); height: 60px; border-radius: 3px;  background:var(--color800); }
.slider-menuContainer .menuList-1depth li .ico { display: inline-block;   margin-right:8px;}
.slider-menuContainer .menuList-1depth li .ico img{width:100%; }
.slider-menuContainer .menuList-1depth li .subject{ font-size:16px;}

.slider-menuContainer .menuList-2depth {  margin-top: 10px; padding-bottom:100px; }
.slider-menuContainer .menuList-2depth li {padding: 10px 0;  color: var(--color500); }
.slider-menuContainer .menuList-2depth li .ico { display: inline-block;  margin-right:8px; }
.slider-menuContainer .menuList-2depth li .ico  img { filter:var(--filter700); }
.slider-menuContainer .menuList-2depth li .subject{ font-size:15px;}

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

.btn-regist { position: relative; display: flex; align-items: center; justify-content: center;   width:70px; height: 70px;  border-radius: 100px; background: var(--color900);   }
.btn-regist:after { content:"" ;background:url('../resource/svg/ico-plus-bold.svg')no-repeat center;  width:30px; height:30px; filter: var(--filterPoint1); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);  }



.profile-photo-regWrap {   display: flex; flex-wrap: wrap;  gap: 10px; }
.profile-photo-regWrap li { position: relative; width: calc(100% / 2 - 5px); height:260px;  border-radius: 8px;  background:var(--color800);}
.profile-photo-regWrap li  .photo {  width:100%; height: 100%; border-radius: inherit;  object-fit: cover;}
.profile-photo-regWrap li .btn-regist { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);  background: var(--color900); width:70px; height: 70px;   }


.profile-photo-regWrap li .btn-photo-add { display: flex;   justify-content:space-between;  position: absolute; bottom:0; left:0; width: 100%;  padding:10px; }
.profile-photo-regWrap li .btn-photo-add a  { position: relative;  width:40px; height:40px;  border-radius: 100px; background: var(--white);  }


.profile-photo-regWrap li .btn-wrap  {  display: flex;   justify-content:space-between;  position: absolute; bottom:0; left:0; width: 100%;  padding:10px;  }
.profile-photo-regWrap li .btn-wrap  a{background: var(--white);  width: 40px; height: 40px; border-radius: 100px;}
.profile-photo-regWrap li .btn-wrap .btn-editor {  position: relative;   }
.profile-photo-regWrap li .btn-wrap .btn-editor:after { content:"" ;background:url('../resource/svg/ico-editor.svg')no-repeat center;  width:26px; height:26px; filter: var(--filterPoint1); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);  z-index: 100; }

.profile-photo-regWrap li .btn-wrap .btn-del    {  position: relative;   margin-left: left;   }
.profile-photo-regWrap li .btn-wrap .btn-del:after { content:"" ; background:url('../resource/svg/ico-close-bold.svg')no-repeat center;  width:14px; height:14px; filter: var(--filterPoint1); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);  }



.profile-photo-regWrap.vertical {  }
.profile-photo-regWrap.vertical li {  height:200px;    }


.notice-ty1{ display: flex; align-items: center; padding: 16px ; } 
.notice-ty1 span{  }
.notice-ty1 button { margin-left: auto; width:70px; }


.setting-list{}
.setting-list li{ margin-bottom:10px; }
.setting-list li{ display: flex; align-items: center; color: var(--color300);  }
.setting-list li .toggleWrap{ margin-left:auto ;}

.data-delete-cont{}
.data-delete-cont li{ text-align: center;  word-break: keep-all; line-height: 160%; font-weight: 400; }
.data-delete-cont li:nth-child(1) { margin:80px 0 30px;}
.data-delete-cont li:nth-child(2) {font-size:16px;  margin-bottom:20px;}
.data-delete-cont li:nth-child(3) {font-size:20px;  }

.JapanOppa-serviceInfo {}
.JapanOppa-serviceInfo li {  font-size:14px; color: var(--color500); line-height: 24px;}
.JapanOppa-serviceInfo li:nth-child(1) { margin:80px 0 80px; text-align: center;}
.JapanOppa-serviceInfo li:nth-child(1) img {width:120px; }
.JapanOppa-serviceInfo li:nth-child(2) {font-size:18px; color: var(--white);  margin-bottom:10px; }
.JapanOppa-serviceInfo li:nth-child(3) { word-break: keep-all;  margin-bottom:45px; }
.JapanOppa-serviceInfo li:nth-child(4) { line-height: 26px; }

/*** 충전하기 **********************************************************/
.single-myTotal-Point{ margin:25px 0; position: relative; display: flex; padding:12px;border:1px solid var(--color800); border-radius:4px; background: transparent;  font-size:16px; height: 56px;  }
.single-myTotal-Point > p {   display: flex; align-items: center;  }
.single-myTotal-Point .subj img{width:24px;  margin-right: 4px;}
.single-myTotal-Point .pointNum { margin-left:auto; color:var(--mainColor); font-weight: 900;}
.single-myTotal-Point .pointNum em { font-weight: 700; display: inline-block; margin-left: 4px; } 

.row-info-boardPrint{}
.row-info-boardPrint li{ background: var(--color900); border: 1px solid var(--color900);  padding: 12px 14px ; margin-bottom:10px; border-radius: 4px;  cursor: pointer; }
.row-info-boardPrint li .refund-date { color: var(--color600); border-bottom: 1px solid var(--black); padding-bottom:8px; font-size:12px; }
.row-info-boardPrint li .rowArea{  display: flex;   align-items: center;  }
.row-info-boardPrint li .rowArea.mt{ margin-top: 14px;}
.row-info-boardPrint li .left-position {color: var(--color400); font-size:13px; }
.row-info-boardPrint li .left-position .won{ margin-left: auto; float: right;  }
.row-info-boardPrint li .right-position { margin-left: auto;}
.row-info-boardPrint li:active{ border: 1px solid var(--mainColor); color:var(--mainColor);  background: transparent; font-weight: 900;}

.row-info-boardPrint li .left-position .date {  color:var(--color00); }
.row-info-boardPrint li .right-position .num    { display: block; font-size:16px; text-align: right; margin-bottom: 10px; }
.row-info-boardPrint li .right-position .target { display: block; text-align: right; margin-bottom:2px; }
.row-info-boardPrint li .right-position .nikName{ display: block; font-size: 13px; text-align: right; color:var(--color400);}
.row-info-boardPrint li .right-position .labelBox{margin-left: auto;}

.footer-notice{ color: var(--color400); font-size:12px; margin-top: 10px;}

.payment-prod-list{}
.payment-prod-list li{ display: flex; background: var(--color900); border: 1px solid var(--color900);  padding: 20px 16px ; margin-bottom:10px; border-radius: 4px;  cursor: pointer; }
.payment-prod-list li .left-position {color: var(--color400); font-size:15px; }
.payment-prod-list li .right-position { margin-left: auto;}
.payment-prod-list li .right-position em{ margin-left: 4px;  display: inline-block; font-size:15px; }
.payment-prod-list li:active{ border: 1px solid var(--mainColor); color:var(--mainColor);  background: transparent; font-weight: 900;}

.radio-method { display: flex; flex-wrap: wrap; gap: 8px; }
.radio-method:after {content: ""; display: table;  clear: both;}
.radio-method input[type="radio"]{ display: none;}
.radio-method input[type="radio"] + label{ display: inline-block; cursor: pointer; width:calc(100% / 2 - 4px);  height:80px; display:flex; justify-content: center; flex-direction: column; align-items: center;    }
.radio-method input[type="radio"] + label{  color:var(--color300); border-radius: 6px;   border: 1px solid var(--color800);   }
.radio-method input[type="radio"]:checked + label{ background:transparent; border: 1px solid var(--mainColor);  color:var(--mainColor); font-weight: 900;  }
.radio-method .subj  { display: block; margin-bottom:4px; color: var(--color400);font-size: 14px; }
.radio-method .money { display: block; font-size: 16px; }
.radio-method input[type="radio"]:checked + label .subj {color:var(--mainColor);}

.bank-deposit-info{}
.bank-deposit-info li {display: flex; margin-bottom: 15px; padding:10px 0;  border-bottom: 1px solid var(--color900);  }
.bank-deposit-info li .cont  { margin-left: auto; font-size:16px;  font-weight: 800;}
.bank-deposit-info li .varRed{font-weight: 900;}
.bank-deposit-info.greyLine li { border-bottom: 1px solid var(--color200);}

.footer-notice-caution{  background: var(--color900); padding:16px 16px 20px; margin-top: 30px;  }
.footer-notice-caution dt{ color:var(--color300);  margin-bottom: 10px; font-weight: 700; font-size:15px; } 
.footer-notice-caution dt i{margin-right: 4px;} 
.footer-notice-caution dd{ color:var(--color300);   font-weight: 400;  line-height: 145%;} 

.filterView-area{ display: flex; margin: 0 16px;}
.filterView-area dt {  color:var(--color500); display: flex; align-items: center;  }
.filterView-area dt em{  color:var(--white); display: inline-block; margin: 0 4px; }
.filterView-area dd { margin-left: auto; }

/*** 고객센터 게시판 **********************************************/
.customer-boardList{ margin: 20px 16px;}
.customer-boardList li{ border-bottom: 1px solid var(--color900); padding:20px 0;  }
.customer-boardList li.item .subject{ font-size:17px; }
.customer-boardList li.item .rowArea{ display:flex; margin-top: 14px; }
.customer-boardList li.item .rowArea .date{font-size:12px; color:var(--color500);   display: flex; align-items: center; }
.customer-boardList li.item .rowArea .btnWrap{margin-left:auto;}
.customer-boardList li.item .rowArea .btnWrap button { width:65px !important; }
.customer-boardList li.itemInquiry { padding:25px 0; line-height: 160%; font-weight: 400; word-break: keep-all; font-size:15px;  }
.customer-boardList li.itemReply   { padding:25px 0; line-height: 160%; font-weight: 400; word-break: keep-all; font-size:15px; color:var(--color300); }

.customer-boardList .notice-imgArea {margin:20px 0 0 ;  }
.customer-boardList .notice-imgArea .photo { margin-bottom:16px;      }
.customer-boardList .notice-imgArea .photo:last-child{ margin-bottom: 0; }
.customer-boardList .notice-imgArea .photo img {     }

.customer-boardList .admin-writerInfo{ margin-bottom: 14px; display: flex; font-size:13px; }
.customer-boardList .admin-writerInfo .writer{ color:var(--mainColor); margin-right:6px; font-weight: 700; }
.customer-boardList .admin-writerInfo .date  { color:var(--color400); }

.policy-list{  }
.policy-list a{position: relative; display: block; border-bottom: 1px solid var(--color900); height: 60px; padding:0 16px; display: flex;align-items: center;  color:var(--color300);  }
.policy-list a::after {content: ""; background:url('../resource/svg/arrow-right.svg')no-repeat center; background-size:100%; width:18px; height:18px; position: absolute; top:16px; right: 16px; 
                       filter: invert(38%) sepia(8%) saturate(603%) hue-rotate(194deg) brightness(96%) contrast(90%);}

.policy-textContent{line-height: 160%; color:var(--color300);  }

/* 회원탈퇴 */
.delete-account { margin: 0 16px; text-align: center;}
.delete-account dt.topImg{   margin:30px 0 50px; }
.delete-account dt.topImg img{height: 160px;}
.delete-account dd { color:var(--color400); line-height: 150%;  margin-bottom: 10px;  font-size: 15px; }
.delete-account dd.text1{ font-size: 20px; color:var(--white); margin-bottom:20px;   }
.delete-account dd.text4{ font-size: 18px; color:var(--color300); margin-top:50px;  }

.sec-profile { position: relative; }
.sec-profile .hd-fix-box {  position: relative;  background: var(--mainColor); height:250px;}
.sec-profile .profile-photo, .sec-videoCall .profile-photo {  position: absolute; top: 245px; left: 50%; transform: translate(-50%, -50%);  z-index: 200; }
.sec-profile .profile-photo img ,.sec-videoCall .profile-photo img { height: 200px;  border-radius: 100px;}

.innerWrap{margin:130px 0 0; }
.color-tooltip{  display: flex; justify-content: center;  gap: 6px;  margin-bottom: 20px; }
.color-tooltip li { border: 1px solid var(--color200); border-radius: 4px; width: 50px; height: 50px;  display: flex; align-items: center;  justify-content: center;}
.color-tooltip li a {}

.color-tooltip-vertical{  display:block;    float: right;  margin-top: 15px;  }
.color-tooltip-vertical li { background: rgba(255, 255, 255, 0.7); border-radius:100px; width:56px; height:56px; margin-bottom:6px; display: flex; align-items: center;  justify-content: center;}
.color-tooltip-vertical li a {}

.profile-infoBox-row  {   display: flex; justify-content: center; flex-direction: column;  margin-bottom:16px; }
.profile-infoBox-row .userInfo{   line-height: 135%;  letter-spacing: -0.7px; margin-bottom: 12px;  color:var(--color900); display: flex; justify-content: center; }
.profile-infoBox-row .userInfo .name  {  font-size:24px; overflow: hidden;  margin-right:8px; font-weight: 900; line-height: 100%; }
.profile-infoBox-row .userInfo .sexAge{  font-size:22px; margin-left: 4px; font-weight: 700; line-height: 100%;}
.profile-infoBox-row .userBlind{  font-size:15px; position: relative; display: flex; justify-content: center;  align-items: center;  letter-spacing:-0.5px; color:var(--color700); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 하트선물 버튼 */
.btn-hgWarp { margin: 0 auto; width:80%;  margin-top: 100px; }
.btn-heartGift-1ty { background: var(--lightRed); border: 1px solid #FFCFCF; color:var(--color900); height: 56px; border-radius: 4px;  font-size: 18px; font-weight:900; display: flex; align-items: center; justify-content: center; }
.btn-heartGift-1ty img{ width:30px; margin-right: 4px; }

.btn-waitWarp {  position: absolute; bottom:70px; left:50%; transform: translate(-50%, -50%); }
.btn-heartGift-2ty { background: var(--black); padding-left:10px; width:110px; height: 40px; border-radius:100px;  color: var(--white); display: flex; align-items: center;   }
.btn-heartGift-2ty img{ width:24px; margin-right: 2px; }

.btn-videoCall{  border: 1px solid var(--mainColor); color: var(--mainColor); border-radius: 100px; width:110px; height: 40px; display: flex; align-items: center;  justify-content: center; }
.btn-videoCall img { width:24px; margin-right: 2px;  filter: invert(13%) sepia(42%) saturate(5287%) hue-rotate(339deg) brightness(133%) contrast(138%); }

.btn-emoji{ background: var(--white);  border-radius: 100px; width:40px; height: 40px; display: flex; align-items: center;  justify-content: center; }
.btn-emoji img { width:28px; }

.bnt-photo{ background: var(--white);  border-radius: 100px; width:40px; height: 40px; display: flex; align-items: center;  justify-content: center; }
.bnt-photo img { width:24px;  filter: invert(38%) sepia(12%) saturate(401%) hue-rotate(194deg) brightness(93%) contrast(86%);}

.user-backgroundPhoto { position: relative;  }
.user-backgroundPhoto::before { content:""; position: absolute;top:0; left:0; width:100%; height: 100vh;  background: rgba(0, 0, 0, 0.7);  z-index: 1; }
.user-backgroundPhoto.blur::before{ backdrop-filter: blur(17.5px); }
.user-backgroundPhoto img{ height: 100vh; object-fit: cover;} 

.btn-videocall-wrap{  position: absolute; bottom: 130px; left: 50%; transform: translate(-50%, -50%); display: flex; justify-content: center;  z-index: 200; }
.btn-videocall-wrap.column { flex-direction: column;   }
.btn-videocall-wrap a{ border-radius: 100px;  display: flex; justify-content: center; align-items: center; font-size:18px; }
.btn-videocall-wrap .btn-call-no {  background: var(--mainColor);  width:80px;   margin: 0 auto;}
.btn-videocall-wrap .btn-call-no img { width:38px; height:80px; filter: invert(100%) sepia(2%) saturate(7425%) hue-rotate(136deg) brightness(122%) contrast(105%);  }
.btn-videocall-wrap .subject{display: block; margin-bottom:20px; font-size:25px;  color: var(--white); }
.btn-videocall-wrap .btn-call-noUp { width:120px; height:66px;  background: var(--black); margin-right:10px;  }
.btn-videocall-wrap .btn-call-ok   { width:180px; height:66px; padding:0 20px;    background: var(--mainColor);   }
.btn-videocall-wrap .btn-call-ok img {margin-right:6px; height: 32px;  filter: invert(100%) sepia(2%) saturate(7425%) hue-rotate(136deg) brightness(122%) contrast(105%);}

.loading-timing { position: fixed; left:0;  right:0; bottom:0;  min-width: 320px;  max-width: 500px; margin: 0px 0px 0px calc(45vw + 100px); height: 120px; color:var(--white);  
            background: rgba(255, 255, 255, 0.2);    z-index: 200;   display: flex; justify-content: center; align-items: center; flex-direction: column;     }
.loading-timing dt{ font-size:26px; margin-bottom:18px;  font-weight: 900;}
.loading-timing dd {font-size:16px; font-weight: 400 !important;}

@media all and (max-width:1201px) {
  .loading-timing { margin:0 auto; }
}

.top-perview{ height: 300px; }


.heart-number{ position: absolute; top: 400px; left: 50%; transform: translate(-50%, -50%);  border-radius:100px; border: 1px solid var(--white); height: 50px;  padding:0 26px 0 18px;  font-size:16px;
               display: flex; align-items: center; justify-content: center; z-index: 200;} 
.heart-number img { width:30px; margin-right: 6px; }

/*** 영상통화화면 ***********************/
.sec-videoCall{ position: relative; min-width:320px; }
.sec-videoCall .call-screen { position: relative;  }
.sec-videoCall .call-screen img{ width:100%; height: 100vh; object-fit: cover;} 
.sec-videoCall .callTime{ position: absolute; top:70px; left:16px; background: var(--white); border-radius: 100px; color: var(--color900); width:82px; height: 30px;  }
.sec-videoCall .callTime span{position: absolute; top: 50%; left: 58%; transform: translate(-50%, -50%); font-size:12px; font-weight: 800;   }
.sec-videoCall .callTime img{ position: absolute; top: 50%; left: 12px; transform: translate(-50%, -50%);  width:40px; }

.sec-videoCall .call-right-position{  position: absolute; top:70px; right:16px;   }
.sec-videoCall .person-face{ border: 2px solid rgba(255, 255, 255, .5);   border-radius:6px; }
.sec-videoCall .person-face img{ width:110px; height:150px; border-radius:4px; object-fit: cover;  }

.fix-videoControl { position: fixed;  bottom: 0; right:0; left:0; max-width: 500px; margin: 0px 0px 0px calc(45vw + 100px); background: rgba(0, 0, 0, 0.4); height: 70px; width: 100%;  padding: 16px;  backdrop-filter: blur(17.5px);
                    display: flex; align-items: center; justify-content: center;    }
.fix-videoControl li { border-radius: 100px; background: rgba(255, 255, 255, 0.2); width:50px; height:50px; display: flex; align-items: center; justify-content: center; margin-right:10px;  }
.fix-videoControl li.call{ background:var(--mainColor); width:90px;  margin-left:18px; margin-right:0; }
.fix-videoControl li a { display: inline-block; background-size:100%; width:24px; height:24px;  background-size:100%; width:24px; height:24px; font-size:0;
                         filter: invert(13%) sepia(84%) saturate(5881%) hue-rotate(350deg) brightness(86%) contrast(112%); }
.fix-videoControl li a.btn-cameraRota {  background:url('../resource/svg/btnVT-cameraRotation-on.svg')no-repeat center; }
.fix-videoControl li a.btn-video  { background:url('../resource/svg/btnVT-video-on.svg')no-repeat center;  }
.fix-videoControl li a.btn-sound  { background:url('../resource/svg/btnVT-sound-on.svg')no-repeat center;  }
.fix-videoControl li a.btn-mic    { background:url('../resource/svg/btnVT-mic-on.svg')no-repeat center;  }
.fix-videoControl li a.btn-callEnd{ background:url('../resource/svg/btn-call-off.svg')no-repeat center;   background-size:100%; width:32px; height:32px;   
                                  filter: invert(100%) sepia(2%) saturate(7425%) hue-rotate(136deg) brightness(122%) contrast(105%); }

.fix-videoControl li:active a  { filter: invert(40%) sepia(14%) saturate(313%) hue-rotate(194deg) brightness(90%) contrast(92%); }
.fix-videoControl li:active a.btn-cameraRota {  background:url('../resource/svg/btnVT-cameraRotation-off.svg')no-repeat center; }
.fix-videoControl li:active a.btn-video  { background:url('../resource/svg/btnVT-video-off.svg')no-repeat center;  }
.fix-videoControl li:active a.btn-sound  { background:url('../resource/svg/btnVT-sound-off.svg')no-repeat center;  }
.fix-videoControl li:active a.btn-mic    { background:url('../resource/svg/btnVT-mic-off.svg')no-repeat center;  }

@media all and (max-width:1201px) {
  .fix-videoControl  { margin:0 auto; }
}



/*** 채팅화면 **********************************************/
.chatting-sceen-wrap{  color:var(--color900);  margin: 56px 16px 0;  display: flex; flex-direction: column;}
.chatting-sceen-wrap .send-date span{ padding-left:14px;  display: inline-block; }
.chatting-sceen-wrap .send-date { position:relative; color:var(--color700); text-align: center;  margin: 20px auto; font-size:12px; border: 1px solid var(--color100); border-radius: 100px; width: 170px; padding:6px 0; }
.chatting-sceen-wrap .send-date::before {content:"";   background:url('../resource/svg/ico-calendar.svg')no-repeat center; background-size:100%; width:14px; height:14px; 
  position: absolute; top:6.5px; left: 12px;   filter: invert(40%) sepia(7%) saturate(677%) hue-rotate(194deg) brightness(89%) contrast(87%); }

.left-pos-message{ display: flex; margin-bottom:8px; }
.left-pos-message .profill-photo { margin-right:10px;  }
.left-pos-message .profill-photo img { width:30px; border-radius:100px; }
.left-pos-message .message-bubble { display: flex;  align-items: flex-end; }
.left-pos-message .message-bubble .message { max-width:210px; background: var(--color200);  border-radius:12px; padding:10px 14px 8px; margin-right:4px;  line-height: 150%; }
.left-pos-message .message-bubble .send-time { font-size:11px; color:var(--color700);} 

.right-pos-message{ display: flex;  margin-bottom:8px;  margin-left:auto ; }
.right-pos-message .message-bubble { display: flex;  align-items: flex-end; }
.right-pos-message .message-bubble .message { max-width:210px;  background:#FFD8CF;  border-radius:12px; padding:10px 14px 8px; margin-left:4px;   line-height: 150%; }
.right-pos-message .message-bubble .send-time { font-size:11px; color:var(--color700);} 

.footer-chatSend { position: fixed; width: 100%; bottom:0; left:0; right:0; max-width: 500px;  margin: 0px 0px 0px calc(45vw + 100px);  background: var(--color200); height: 126px; padding:14px 16px;  }
.footer-chatSend .btn-Wrap{display: flex; }
.footer-chatSend .btn-Wrap a {}
.footer-chatSend .btn-Wrap .pos-left, .footer-chatSend .btn-Wrap .pos-right {display: flex; gap: 6px;}
.footer-chatSend .btn-Wrap .pos-right { margin-left: auto;}

@media all and (max-width:1201px) {
  .footer-chatSend { margin:0 auto; }
}

.footer-chatSend .textInput-box{position: relative; margin-top: 16px;}
.footer-chatSend .textInput-box .btn-send { position: absolute; top:10px; right:12px; }
.footer-chatSend .textInput-box .btn-send img{width:28px;  filter: invert(69%) sepia(9%) saturate(254%) hue-rotate(188deg) brightness(89%) contrast(83%);}
.footer-chatSend .textInput-box .btn-send:hover img { filter: invert(0%) sepia(8%) saturate(7480%) hue-rotate(119deg) brightness(89%) contrast(100%); }
.footer-chatSend .textInput-box input{background: var(--white); height: 44px; width:100%; }
.footer-chatSend .textInput-box input:hover { background: var(--color400); border: 0;}
.footer-chatSend .textInput-box input:focus { border: 0; }

.hd-Refund { display: flex; flex-wrap: wrap; margin: 20px 16px 0; gap: 8px; }
.hd-Refund dt {  background: var(--white); border-radius: 8px;  color: var(--color900); padding:16px; height: 80px;  
  flex: 1 1 48%;  display: flex; align-items: center;justify-content: center; flex-direction: column; }

.hd-Refund dt .subj{ font-size:16px; font-weight: 800; margin-bottom: 8px;  }
.hd-Refund dt .price { font-size:18px; font-weight: 900;}
.hd-Refund dd {margin-top:16px; }
.hd-Refund dd span{display: block; margin-bottom:8px; font-weight: 500; }


.gender-notChang  {  display: flex; align-items: center;justify-content: center;   font-size: 14px; background: var(--color800); color: var(--white);  width:100%; height: 50px;  font-weight: 600; border-radius: 4px; cursor: pointer; }


@media all and (min-width:500px) {
  .pop-content-wrap{  max-width:460px;  }
} 

@media all and (max-width:360px) {
  .section-modal {  width:94% !important; min-width: 300px;   }
  .pop-content-wrap{  overflow-x: hidden;  margin: 0 auto !important;  }
} 


/* 모달 레이어 팝업*/
#dark-md-bg{ display:none;  position:fixed;   width:100%; height:100%;  top:0; left:0;   background:rgba(0,0,0, 0.5);  }
.section-modal { z-index: 999; display: none; position: fixed; top: 50%; left: 50%;  z-index:1; overflow:auto; overflow-x:hidden; width:100%;   
               -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.pop-content-wrap{ position: relative; background: var(--white); border-radius: 16px;  color: var(--color900);   width:96%;  margin: 0px 0px 0px calc(45vw + 120px);  }
.pop-content-wrap:after {content: ""; display: table;  clear: both;}
.pop-content-wrap .btn-close { position: absolute; top:16px; right:16px;  background:url('../resource/svg/btn-close.svg') no-repeat center;  background-size:100%; width:20px; height:20px;  filter: var(--filter600); }
.pop-content-wrap .inner-pop-content { padding:45px 16px 20px;  }

.pop-innerContent-wrap .inner-content{ padding: 0 16px 30px; }

@media all and (max-width:1200px) {
  .pop-content-wrap {margin: 0 auto;}
}




/* 얼럿창*/
.inner-alert-content  { padding:20px; text-align: center; }
.inner-alert-content .comment{ font-size:15px; text-align: center;}
.pop-content-wrap.alt-radius { border-radius: 8px !important;  }


/*** 팝업 *********************************************/
#popup-container {position: relative; }

.pop-topSlide-wrap{ background: var(--white); border-radius: 16px 16px 0 0;  color: var(--color900);   max-width: 500px; min-width:320px;   margin: 0px 0px  0px calc(45vw + 100px); }
.pop-topSlide-wrap:after {content: ""; display: table;  clear: both;}
.pop-topSlide-wrap .btnWrap {padding:10px 0 20px}
.pop-topSlide-wrap .btn-rowBar{ display: block; width:35px; height: 5px;  border-radius: 100px;  background: var(--color200); margin: 0 auto;  }

.pop-topSlide-wrap .menuList-wrap  { padding:0 16px 26px ; }
.pop-topSlide-wrap .menuList-wrap li{  display: flex; align-items: center; font-size: 16px; height: 45px; padding:10px 16px; font-weight: 700; }
.pop-topSlide-wrap .menuList-wrap li .img{ margin-right: 8px; }
.pop-topSlide-wrap .menuList-wrap li .img img {height: 26px;}
.pop-topSlide-wrap .menuList-wrap li:last-child{  margin-bottom:0; }
.pop-topSlide-wrap .menuList-wrap li:active {background: var(--lightRed);}

@media all and (max-width:1200px) {
  .pop-topSlide-wrap{    margin: 0 auto; }
}


/* 포인트 적립 내역 */
.pop-topSlide-wrap .pointSave-list { display: flex; flex-wrap: wrap;   margin: 0 16px;   }
.pop-topSlide-wrap .pointSave-list li{ float: left; border: 1px solid var(--color300);  width:calc(100% / 2 - 3px); border-radius: 4px; margin:0 6px 6px 0; } 
.pop-topSlide-wrap .pointSave-list li:nth-child(2n){ margin-right: 0;}
.pop-topSlide-wrap .pointSave-list li span{display: block; padding:12px 16px; text-align: center; }
.pop-topSlide-wrap .pointSave-list li span.subj{background:var(--color100); border-radius: 4px 4px 0 0; font-size:16px; }
.pop-topSlide-wrap .pointSave-list li span.content{  padding:26px 8px; font-size:16px; font-weight: 800;}

.pop-topSlide-wrap .pointTotalSave-list{   border: 1px solid var(--mainColor); border-radius: 4px; margin:0 16px  }
.pop-topSlide-wrap .pointTotalSave-list dt{background: var(--mainColor);  text-align: center; padding:12px 16px; color: var(--white); }
.pop-topSlide-wrap .pointTotalSave-list dd{padding:26px 8px;  text-align: center; font-size:16px; font-weight:900; color: var(--mainColor);}

/* 하트 선물하기 */
.giveGift-list {display: flex; flex-wrap: wrap;  margin: 0 16px;   }
.giveGift-list li{  display: flex; align-items: center; justify-content: center;  border: 1px solid var(--color300);  width:calc(100% / 3 - 4px); border-radius: 4px; height:52px; margin:0 6px 6px 0; } 
.giveGift-list li:nth-child(3n){ margin-right: 0;}
.giveGift-list li .ico { position: relative;    background:url('../resource/images/heart-stop.png')no-repeat center;  background-size: 100%; width: 26px; height: 26px;     }
.giveGift-list li .inCon { font-size:16px; font-weight: 800; padding-left: 2px;  }

.giveGift-list li.active { border: 1px solid var(--mainColor); background: var(--lightRed);  color: var(--mainColor);}
.giveGift-list li.active .ico {  background:url('../resource/images/heart-shape.gif')no-repeat center;  background-size: 100%; width: 26px; height: 26px; }

.panel-input-box .subject.color700 { color:var(--color700) }
.panel-input-box.black .subject{ color:var(--black)}
.panel-input-box.black input{background: var(--color300); height: 44px; width:100%; }
.panel-input-box.black input:hover { background: var(--color400); border: 0;}
.panel-input-box.black input:focus { border: 0; }
.panel-input-box.black textarea{background: var(--color300);  width:100%; padding: 16px 16px 16px; height: 120px; }
.panel-input-box.black .messageBox{ background: var(--color300); border-radius: 4px; padding:12px;  line-height: 150%; }

.top-notice-caution{  text-align: center;  padding-bottom: 30px;   }
.top-notice-caution dt.topImg { width:100%; height: 140px; display: flex; align-items: center; justify-content: center;} 
.top-notice-caution dt.topImg img {width:180px;   }
.top-notice-caution dt.title {font-size:20px; margin-bottom: 12px; font-weight: 800;  }
.top-notice-caution dt.smtitle {font-size:16px; margin-bottom:6px; font-weight: 800;  }
.top-notice-caution dd.desc { word-break: keep-all;  line-height: 140%;     }

.photoImg{padding:30px 0 14px;  }
.top-notice-caution .photoImg img{ border-radius: 100px; width:60px; object-fit: cover;}
.top-notice-caution .name { font-size:18px; margin-bottom: 10px; }
.top-notice-caution .desc2 {font-size:16px;  display: flex; align-items: center; justify-content: center;} 
.top-notice-caution .desc2 .bold{ font-weight: 800;  }
.top-notice-caution .desc2 img{ width:24px; margin-right:2px; }

.event-content-wrap { position: relative;  padding:50px 16px 30px ;  text-align: center; font-family: 'SBAggro'; }
.event-content-wrap .mainTitle-1 { font-size:47px;  line-height: 100%; letter-spacing: -4px;  }
.event-content-wrap .subTitle-1  { font-size: 21px; line-height: 100%;  margin-bottom: 10px;   }
.event-content-wrap .subTitle-2  { font-size: 29px; line-height: 100%;  margin-bottom: 10px; }

.event-content-wrap .check1 { border-radius: 100px; height: 40px; line-height: 42px; width:230px; font-size:16px; font-weight: 400; color:var(--white); background:rgba(0, 0, 0, 0.5); margin: 10px auto 0; }
.event-content-wrap .iconSize {margin-top:30px; }
.event-content-wrap .iconSize .img1{ width:150px;  }
.event-content-wrap .iconSize .img2{ width:200px;  }
.event-content-wrap .action-message { border-radius: 100px; height: 40px; line-height: 42px;  background: var(--white); font-size:17px; font-weight: 400; max-width: 260px; margin: 10px auto 0;}

.btn-popWrap {display:flex; flex-flow:row nowrap; justify-content: space-between;     flex-grow: 1;  min-width: 320px;}
.btn-popWrap button {border-radius: 0;}

.evBgTy1 {   border-radius: 16px 16px 0 0; background:url('../resource/images/event-bg-01.png')no-repeat center; background-size: cover; width: 100%; height:100%;   }
.evBgTy2 {   border-radius: 16px 16px 0 0; background:url('../resource/images/event-bg-02.png')no-repeat center; background-size: cover; width: 100%; height:100%;   }

.popup-alert{  background:var(--rgb-white); height: 50px; border-radius: 8px; margin: 0 16px;  display: flex; align-items: center; justify-content: center; }
.popup-alert img{ width:22px; margin-right: 6px;backdrop-filter: blur(5px); }
 

.avata-select{ display:flex; flex-wrap: wrap; gap: 10.2px;}
.avata-select li{ position: relative;  border-radius: 100px; background: var(--color100); width:calc(100% / 4 - 7.7px);     text-align: center;   }
.avata-select li img{ border-radius:inherit;  }
.avata-select li:active {background: var(--color200); }
.avata-select li:active::after { content:""; position: absolute;   top: 50%;   left: 50%; transform: translate(-50%, -50%); background:url('../resource/svg/ico-check.svg') no-repeat center;  background-size:100%; width:26px; height:26px;
filter: var(--filterMain); z-index: 101;}

.avata-select li:active::before { content: ''; border-radius:inherit;  background-color: rgb(var(--rgb-black), 37%); position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }

/**** 팝업 end ****************************************/
  
.ad2-container{ padding:8px 16px 0; width:100%; }
.ad2-containe:after {content: ""; display: table;  clear: both;}
.ad2-container .imgAD img {  width: 100%;   border-radius: 6px !important;   }
.ad2-container .probox {background: var(--color900); padding:4px  10px; border-radius: 8px; margin-top: 4px;  }
.ad2-container .probox .text {display: inline-block; margin-left: 4px; font-size:12px; color: var(--color400);}



  /* 찜하기 아이콘 */
.badge-zzim  { border-radius: 100px; background:rgb(var(--rgb-black), 37%); width:40px; height:40px;  display: flex; padding-top: 7.5px;   justify-content: center;  }
.badge-zzim .trigger[type="checkbox"] {display:none !important;}
.badge-zzim .trigger[type="checkbox"] + .Link span { display:inline-block; background:url('../resource/svg/btn-zzim-off.svg')no-repeat center; background-size:100% ; width:24px; height:24px; 
                                                     filter: invert(100%) sepia(12%) saturate(1772%) hue-rotate(65deg) brightness(111%) contrast(111%); cursor:pointer; }
.badge-zzim .trigger[type="checkbox"]:checked + .Link span { background:url('../resource/svg/btn-zzim-on.svg') no-repeat center; background-size:100%; 
 filter: invert(14%) sepia(68%) saturate(5505%) hue-rotate(347deg) brightness(93%) contrast(118%);}

.badge-zzimColor  {  }
.badge-zzimColor .trigger[type="checkbox"] {display:none !important;}
.badge-zzimColor .trigger[type="checkbox"] + .Link span { display:inline-block; display: flex; align-items: center; background:url('../resource/svg/btn-colorZzim-off.svg')no-repeat center; background-size:100% ; width:26px; height:26px; cursor:pointer; }
.badge-zzimColor .trigger[type="checkbox"]:checked + .Link span { background:url('../resource/svg/btn-colorZzim-on.svg') no-repeat center; background-size:100%;}         
.badge-zzim.white {  background: rgb(var(--rgb-white), 20%);}

.badge-red-new{ display: inline-block; border-radius: 100px; height:16px; padding:0 8px; line-height: 14px; font-size: 10px; font-weight: 500; color: var(--mainColor);  border: 1px solid var(--mainColor);  font-weight: 800; }
  
/*new.hot*/
.badge-nh-set{display: flex;  gap:2px; }
.badge-nh-set span { display: flex; align-items: center; justify-content:center; width:32px; font-size:9px;  height: 16px;  border-radius: 100px;}
.badge-new { background:#401BD2; color: var(--white);    }
.badge-hot { background:var(--pointColor1); color: var(--white);  }

/*애니 뱃지*/
.badge-tour-style{ display: inline-block; font-size:12px; margin-bottom: 0px; color: #FFDD87; }
.badge-tour-style img{ height: 28px; }
.badge-tour-style.radius {font-size:11px;  border: 1px solid var(--color800);  background: rgb(var(--rgb-white), 20%);  border-radius: 100px; padding:0 10px; height: 24px; display: flex; align-items: center; justify-content: center;  }


/*언어*/
.badge-row-wrap{ display: flex; align-items: center; gap: 1px;}
.badge-languageLevel{ font-size:11px; border: 1px solid var(--color800); width:65px;  height: 24px;  background: transparent;  border-radius: 100px; display: flex; align-items: center; justify-content:space-between;   }
.badge-languageLevel .lang  { width:100%; text-align: center;  }
.badge-languageLevel .level { border-radius: 100px; background: var(--color800); width:28px; height:inherit;   display: flex; align-items: center; justify-content: center;}

/* 나라 */
.badge-nation { width:20px;  height:20px !important;   }
.badge-nation img { width:100%;  height: 100%;   border-radius: 100px; object-fit: cover;} 


.btn-dropdown { position: relative; border-radius: 4px; height: 50px; background: var(--color800); color: var(--color200);  display: flex;   align-items: center;   padding:16px;  }
.btn-dropdown::before { content:""; position: absolute; top:14px; right:14px;  background:url('../resource/svg/arrow-down.svg') no-repeat; background-size:100% auto; width:20px; height:20px;}
.btn-dropdown .flag  { padding-right:10px;  }
.btn-dropdown .flag img{  width:30px;  }
.btn-dropdown .text { display: flex;  }


.tab-round-type5 { position: relative;  display: flex; justify-content: center;  background: var(--color100); border-radius: 100px; width:70%; margin: 0 auto; padding:4px; }
.tab-round-type5 li { display: inline-block; width:calc(100% / 2); float: left; text-align: center; background: #f9f9f9; line-height: 40px;  border-radius: 100px;}
.tab-round-type5 label { display: block; width: 100%; height: 40px; line-height: 40px; }
.tab-round-type5 input { display: none; }

.tab-round-type5 input:checked ~ label { background:var(--color600);  color: var(--white); border-radius: 100px;}
.tab-round-type5 input:checked ~ .tabCon { display: block; }




.pop-shop-grid { display: flex; flex-wrap: wrap; height: 200px; }
.pop-shop-grid  li {   /*flex: 1 1 50%; */    }
.pop-shop-grid  li img { height: 100%; object-fit: cover;  }
.pop-shop-grid .item1 {width:60%;   }
.pop-shop-grid .item2 {width:40%;  height: 100%; display: flex; flex-wrap: wrap;    flex-direction: column; }
.pop-shop-grid .item2 img {height: 50% !important;}



/* 슬라이 메뉴 */
.menu-swiper-container  { margin: 0 auto; position: relative; overflow: hidden; z-index: 1;  }
.snbSwiperMenu { padding: 0 16px;   }
.snbSwiperMenu .swiper-wrapper .swiper-slide { width: auto !important;   gap: 6px; display: flex; margin-right:6px; }
.snbSwiperMenu .swiper-wrapper .swiper-slide a {border-radius: 100px;  display: flex; justify-content: center; align-items:center;  border: 1px solid var(--color700);  background: var(--color900);  height: 36px;  white-space: nowrap;  }
.snbSwiperMenu .swiper-wrapper .swiper-slide .text { display: flex; justify-content: center; align-items:center; position: relative;  height:36px;  padding: 0 16px;   }
.snbSwiperMenu .swiper-wrapper .on .text {   position: relative; color: var(--white);  font-weight: bold;  }
.snbSwiperMenu .swiper-wrapper .on .text:after { content: ''; display: block; position: absolute;  top: 0; left: 0; width: 100%;  height:36px;  border-radius: 100px;   border:1px solid var(--white) ;  }



.withdraw-content{  padding:25px 16px;font-size:16px;   }
.withdraw-content dt{ border-radius: 100%; width:250px; height: 250px; background: var(--color900); margin: 0 auto 50px auto;   display: flex; align-items: center; justify-content: center;  }
.withdraw-content dt img {width:40%; }
.withdraw-content .text1{ line-height: 28px;  font-size:22px; letter-spacing: -1px;}
.withdraw-content .text2{ display: block; margin-top: 20px; line-height: 1.55rem; color: var(--color400); }



/**********************/
/* .modalLayer-bottomsheet { position: fixed; z-index: 600; bottom: 200; width: 100%; display: none; } */
.section-modal { z-index: 600 !important; }

/* @keyframes smooth-appear {
    to{
      bottom: 0;
      opacity:1;
    }
  }
  .modalLayer-bottomsheet.up { bottom: -100%; left: 50%; opacity: 0; transform: translateX(-50%); animation: smooth-appear 0.5s ease forwards; }

  @keyframes smooth-disappear {
    to{
      bottom: -100%;
      opacity:0;
    }
  }
.modalLayer-bottomsheet.down { bottom: 0; left: 50%; opacity: 1; transform: translateX(-50%); animation: smooth-disappear 1s ease forwards; } */

.dark-md-bg2 { z-index: 200; display: none; position: fixed; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0, 0.5); }
.disable-scroll { overflow: hidden; }
.menuList-wrap-age { max-height: 50%}
.modal-age-scroll { max-height: 400px; overflow-y: auto; }
.modal-age-scroll::-webkit-scrollbar { display: none; }
.d-none { display: none !important; }



.tour-estimate-content.gridCol-4 { display: grid;  grid-template-columns: repeat(4, 1fr);}
.tour-estimate-content.gridCol-3 { display: grid;  grid-template-columns: repeat(3, 1fr);}
.tour-estimate-content.gridCol-2 { display: grid;  grid-template-columns: 1fr 1fr;  }
.tour-estimate-content.gridCol-1 { display: grid;  grid-template-columns: 100%;  row-gap: 10px;   }
.tour-estimate-content.gridCol-1 li  {display: grid;  grid-template-columns: 50px 1fr; border: 0 !important;  }

.tour-estimate-content {  gap:6px;}
.tour-estimate-content li  { height: 50px;   border: 1px solid var(--color300);  display: flex; align-items: center; justify-content: center; border-radius:6px;  cursor: pointer; }
.tour-estimate-content li.active { border: 1px solid var(--pointColor1); color: var(--pointColor1);}
.tour-estimate-content li:active { border: 1px solid var(--pointColor1); color: var(--pointColor1);}
.tour-estimate-content li input{width:100%;  }

/* hidden */
.hidden-input-box{   margin-top: 8px;  display: grid;  grid-template-columns: repeat(4, 1fr); gap:6px; }
.hidden-input-box li { height: 42px; background: var(--color100);  border: 1px solid var(--color300);  display: flex; align-items: center; justify-content: center; border-radius:6px;  cursor: pointer; }
.hidden-input-box li.active { border: 1px solid #F98735; color: var(--pointColor1); background: #FFF3EB;}
.hidden-input-box li:active { border: 1px solid #F98735; color: var(--pointColor1); background: #FFF3EB; object-fit: cover;}

.tour-datePlan-content  { display: flex;  display: grid; grid-template-columns: 2fr 0.2fr 2fr;  } 
.tour-datePlan-content   li{ display: flex; flex-direction: column; gap: 5px;     } 
.tour-datePlan-content   li.wave{margin-top: 38px; text-align: center;}
.tour-datePlan-content   li input {width:100%; }
.plan-completion{    padding-top: 20px; gap: 25px; display: flex;  flex-direction: column; align-items: center; }
.plan-completion button{ width:95px;}
.plan-completion .date{   font-size:16px; font-weight: 800;}

.tour-service {  display: flex; flex-wrap: wrap;  gap:8px; }
.tour-service li {   border: 1px solid var(--color300); padding:16px; border-radius:6px; display: flex; flex-wrap: wrap;  gap: 8px;   }

.tour-service li.active { border: 1px solid var(--pointColor1); color: var(--pointColor1);}
.tour-service li .subject{position: relative; font-size:16px; font-weight: 800;    }
.tour-service li .desc { display: block; }
.tour-service li select { margin-top: 6px;}
.tour-service li input { width:100%;  }
.baege-recomm { position: absolute;  top:0px; left:82px; display:flex; align-items: center; justify-content: center; font-size:13px; width:60px; gap: 2px; background: var(--lightRed); border-radius: 100px;  }
.baege-recomm i{ display: block; background:url('../resource/images/ani-recommend.gif') no-repeat; background-size:100% auto; width:20px; height:20px; }

.inputContent-print    {  font-size:13px;    }
.inputContent-print li { display: grid;  grid-template-columns: 86px 1fr;   border-bottom:1px solid var(--color100); word-break: break-all; padding:10px 0;  }
.inputContent-print li.title {font-size:16px;  display: grid; grid-template-columns: 1fr; text-align: center; display: flex; justify-content: center;   border-bottom:1px solid var(--color600);  }
.inputContent-print li.title b{  font-weight: 900;}
.inputContent-print li .subj {color: var(--color700);}






.dropdown { width: 100%; border: 1px solid var(--color200); box-sizing: border-box; border-radius: 4px; padding: 12px 13px; height: 50px; background: url('../resource/svg/arrow-down.svg') no-repeat 98% 50%; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.dropdown:focus { box-sizing: border-box; }



.out-pos-center{ display: flex;  flex-direction: column;  -webkit-box-pack: justify;  justify-content: center;  height: calc(100vh - 68px);   overflow: hidden;}
.error404 { display: flex; flex-wrap: wrap; flex-direction: column; justify-content: center; align-items:center; gap: 50px;   }
.error404 li {     }
.error404 li.title {font-size:28px;  padding-bottom: 20px; font-weight: 900; }
.error404 li.desc { line-height: 1.6rem;  text-align: center; }
.error404 li.img img{ height: 95px;}