@charset "utf-8";
*{margin: 0; padding: 0;}
body,html{width: 100%;   font-family: 'Noto Sans KR', sans-serif; font-size: 14px;
-ms-overflow-style: none; overflow-x: hidden; position: relative; margin: 0 auto;}
/* ::-webkit-scrollbar{display: none;} */
/* ::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-thumb { background: #a9a9a9; } */
ul{list-style: none;}
a{text-decoration: none; color: inherit;}
button, input, a, img{outline: 0; border:0; background-image: none; background-color: transparent;}
button{cursor: pointer;}
input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="image"],input[type="tel"], textarea {-webkit-appearance:none;}
input[type=submit],input[type=button] {-webkit-appearance:none;}
table {border-collapse: collapse;border-spacing: 0;}
p,a,h1, h2, h3, h4, h5, h6{transform: skew(-0.001deg);}

/* 공통 */

.w100{width: 100% !important;}

.m-10{margin: 10px;}
.m-t-0{margin-top: 0 !important;}
.m-t-2{margin-top: 2px !important;}
.m-t-5{margin-top: 5px !important;}
.m-t-10{margin-top: 10px !important;}
.m-t-15{margin-top: 15px !important;}
.m-t-20{margin-top: 20px;}

.m-b-10{margin-bottom: 10px !important;}
.m-b-18{margin-bottom: 18px !important;}
.m-b-20{margin-bottom: 20px !important;}

.p-0{padding: 0 !important;}
.p-b-0{padding-bottom: 0 !important;}
.f_center{text-align: center;}
.red_txt{color:#f00;}
.gray_txt{color:#7e7e7e;}
.mint_txt{color: #19b698;}
.bold_txt{font-weight: 700;}
.mint_color{background-color: #19b698 !important;}

.height-auto{height: auto !important;}

.graph_box{position: relative; width: 100%; height: 200px; margin: 10px 0; background-color: #ccc;}
.box{margin: 20px auto;}
.box p{margin:10px auto; font-weight: 800;}

.sm_box{width: 100px; height: 30px;background-color: #333;}

.sm_btn{padding: 5px;
  border: 1px solid #e0e0e0;
  border-radius: 5px;
  font-size: 12px;
  color: #7c7c7c;
  margin: 5px;
  min-width: 50px;}

  .gray{background-color: #eee;}
  .text_right{text-align: right;}
  .underline{text-decoration: underline;}

  .item_txt{margin-left: 10px;}

  .right{float: right;}
  .d-none{display: none;}
  

.wrap{max-width: 1024px;min-width: 320px; margin: 0 auto; min-height: 950px; position: relative; padding-bottom: 196px;}
.hd{position: fixed; width: 100%; top: 0; height: 80px; max-width: 1024px;min-width: 330px;z-index:2; background-color: #fff; border-bottom: 3px solid #19b698; transition:all .3s}
/* .logo_box{position: relative;} */
.logo img{position: absolute; top: 15px; left: 50%; transform: translate(-50%);}
.logo_box.on{background:transparent;}
/* .hd div{text-align: center;} */
.hd p{position: absolute; top: 30px; left: 50%; transform: translate(-50%); font-weight: 700; font-size: 16px;}
@media screen and (-ms-high-contrast: active),(-ms-high-contrast:none){
  .logo_box{position: relative;}
.logo img{position: absolute; top: 15px; left: 50%; transform: translate(-50%);}
}

.clearfix::after {
  content: '';
  zoom: 1;
  display: block;
  clear: both;
}
.search{height: 100%; position: relative;}

#searchtoggle {
  display: block;
  padding: 25px;
  font-size: 18px;
  color:#999;
  width: 50px;
}

/** hidden search field **/
#searchbar {
  display: none;
  float: left;
  width: 100%;
  border: 1px solid #d8d8d8;
  padding: 10px;
  z-index: 9999;
  background: #fff;
  margin-top: 3px;
}

#s {
  display: block;
  border: 0;
  outline: none;
  padding: 5px;
  font-weight: bold;
  color: #676767;
}

#searchsubmit {
  display: block;
  float: right;
  font-size: 18px;
  padding: 5px;
  background: none;
  color: #717171;
  border: 0;
  outline: none;
  cursor: pointer;
}


/* 검색 */
*, *::after, *::before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  }
  
  
  
/* 메인배너 */
.swiper-container {
  display: block;
  position: relative; 

  height: auto; 
  overflow: hidden;
  z-index: 0;
}
.swiper-wrapper.img_box1{margin-top: 50px;}
.swiper-container.swiper1 .swiper-slide {
    text-align:center;
    display:flex; 
    align-items:center; 
    justify-content:center; 
    height: auto !important;
}
.swiper-container.swiper1 .swiper-slide img {
  width: 100%;
  height: auto;
}
.swiper-button-next,.swiper-button-prev{color:#fff; margin-top:inherit;}
.swiper-pagination-bullet-active{background-color: #19b698;}

/* menu button */
.menuBtn {
  height: 30px;
  width: 30px;
  position: absolute;
  right: 20px;
  top: 25px;
  z-index: 101;
}

.menuBtn > span {
  background-color: #999;
  border-radius: 1px;
  height: 2px;
  width: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -1px 0 0 -15px;
  transition: height 100ms;
}

.menuBtn > span:after, .menuBtn > span:before {
  content: '';
  background-color: #999;
  border-radius: 1px;
  height: 2px;
  width: 100%;
  position: absolute;
  left: 50%;
  margin-left: -15px;
  transition: all 200ms;
}

.menuBtn > span:after {
  top: -7px;
}

.menuBtn > span:before {
  bottom: -7px;
}

.menuBtn.act > span {
  height: 0;
}

.menuBtn.act{background-color: #19b698; border-radius: 2px;}

.menuBtn.act > span:after, .menuBtn.act > span:before {
  background-color: #fff;
  top: 1px;
}

.menuBtn.act > span:after {
  transform: rotate(45deg);
}

.menuBtn.act > span:before {
  transform: rotate(-45deg);
}

/* main menu block */
.toggle_btn{position: fixed; width: 80px; height: 80px; right: calc(100% - 76%); z-index: 5;}

.toggle {
  background-color: #fff;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 100%;
  text-align: center;
  display:none;
  transition: all 0.2s;
  background-color: rgba(0,0,0,0.6);
}

.toggle.act {
  display: block;
  transform: translate(0px, 0px);
  z-index: 2;
}

.toggle.act ul li {
  opacity: 1;
  transform: translateX(0);
  line-height: 20px;
}

.toggle ul {
  vertical-align: middle;
}


.toggle a.suBtn {
  color: #fff;
}

/* sign up button */
.suBtn {
  background-color: #19b698;
  border-radius: 5px;
  padding: 10px 20px;
}

/* 토글버튼 반려묘정보 */
.cat_total{text-align: right; margin-bottom: 5px;}
.swiper {
        width: 100%;
        height: 215px;
        background: #eee;
        padding: 15px;
      }

.swiper-slide.one {
  text-align: center;
  font-size: 18px;
  background: #fff;
  /* Center slide text vertically */
  -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;
  border-radius: 10px;
  border: 1px dotted #ccc;
  box-sizing: border-box;
  height: 150px;
  width: 60% !important;
}

.m_tnb{display: flex; background-color: #eee; width: 100%; margin-top:20px; border-top:1px solid #ccc; border-bottom:1px solid #ccc;}
.m_tnb li{flex: 1; text-align: center; height: 20px !important;border-radius: 10px; margin: 10px;}
.m_tnb li:last-child{border-right: 0;}

.m_tnb li a{ font-size: 1.0em; color:#000;}
#tog_gnb{position: fixed; top: 0; transition: 0.6s; z-index: 999; background-color:#fff; width: 60%; height: 100%; right: 0;}
.circle{width: 30px; height: 30px; background-color: rgba(255, 255, 255, 0.5); position: absolute; right: -10px; bottom: 0; font-size: 18px; color: #555; border-radius: 50px; border:1px solid #ccc;}
.tog_gnb{position: relative; text-align: left; padding: 20px; background-color: #fff;}
.tog_close{position: absolute; text-align: center;font-size: 2.0em; border:1px solid #000; width: 30px; height: 30px; right: 20px; top: 25px;}
.tog_close i{display: block; margin-top: 2px;}
.tog_gnb .menu:first-of-type{margin-top: 50px;}
.tog_gnb li{padding: 10px 0px 0px 0px;}
.tog_gnb li i{float: right;}
.tog_gnb li.on i{color: #19b698;}
.tog_gnb li a{display: block; font-size: 14px; cursor: pointer;}

.member_set{cursor: pointer; position: relative; width: 60px; margin: 30px auto 10px; color: rgb(31, 32, 34);}
/* .member_set i{position: absolute; right: 0px; bottom: 0; font-size: 20px; color: #555;} */
.member_img{vertical-align: bottom; width: 60px; height:60px; border-radius: 30px;}
.tog_txt{margin: 30px; display: flex;}
.tog_txt1{text-align: left; line-height: 26px;}
.tog_txt2{text-align: center;}
.tog_txt2 span{font-size: 18px;}
.member_box{margin: 20px;}
.member_box .tog_txt{text-align: center; margin: 10px;}
.tog_join{width:80px; margin-left: 5px; border:1px solid #ccc; border-radius: 3px; padding: 2px; text-align: center;}
.hide_sub{display: none; height: auto; z-index: 1001;}
.hide_sub li{border-bottom: none;}
.hide_sub li a{font-size: 14px; color:#888 !important;}

/* 버튼 */
.button_box{width: 50%; height: 30px; background-color: #19b698; border-radius: 5px; margin-top: 25px; color:#fff; cursor: pointer;}
.button_box.login_out{margin-bottom: 120px;}
.button_box.sm{width:30%; height: 25px; margin-top: 0px; border:1px solid #19b698; background-color: #fff; color: #333;}
.right{float: right;}

.center{margin: auto;}
/* 반려묘등록/추가 */
.cat_box{display: flex; padding: 15px; color:#555;}
.cat_set{position: relative; display: flex; flex-wrap: wrap;
  flex-direction: row;
  align-items: center;
  justify-content: center;}
.member_img.profile{width: 30px; height: 30px;}
.cat_set.plus{height: 150px; flex-direction: column; cursor: pointer; color: #999;}
.cat_set.plus span{font-weight: normal; font-size: 14px;}
.cat_modify{margin-left: auto; display: flex; align-items: center; font-size: 14px; cursor: pointer;}
/* on/off */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

.cat_txt {
    margin:0px;
    font-size: 14px;
    margin-left: 5px;
}
.setting .btn-switch {
  position: relative;
  display: inline-block;
  width: 36px;
  height: 12px;
  margin: 3px 0 0 0;
}
.setting .btn-switch input {
  display:none;
}
.setting .slide-object {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #ccc;
  transition:0.4s;
  -webkit-transition:0.4s;
  -o-transition:0.4s;
  -moz-transition:0.4s;
  border-radius: 20px;
}
.setting .slide-object:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 0;
  bottom: -3px;
  background: #efefef;
  transition: 0.4s;
  -webkit-transition: 0.4s;
  -o-transition: 0.4s;
  -moz-transition: 0.4s;
  border-radius:50%;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  box-shadow: 0 2px 2px #bfbebe;
  -moz-box-shadow: 0 2px 2px #bfbebe;
  -webkit-box-shadow: 0 2px 2px #bfbebe;
}
.setting input:checked + .slide-object {
  background: rgba(81, 214, 151, 0.62);
}
.setting input:checked + .slide-object:before {
  transform: translateX(16px);
  -webkit-transform: translateX(16px);
  -ms-transform: translateX(16px);
  -moz-transform: translateX(16px);
  -o-transform: translateX(16px);
  background: #07ce72;
}
.cat_info{text-align: left; margin-left: 15px;}
.cat_info p{font-size: 14px; color:#555; line-height: 20px;}


/* 메뉴 아이콘 */
.icon_box{display: flex; flex-wrap: wrap; justify-content: center;}
.icon_box div{cursor: pointer; text-align: center; margin: 20px;}
.icon_box div p{text-align: center;}

/* footer부분 */
.footer{position: absolute; width: 100%; bottom: 0; background-color: #f5f5f5; text-align: center; font-size: 12px; padding: 15px;}
.ft_content{padding-bottom: 70px;}
.ft_title{font-weight: 700;}
.address{margin-top: 10px; color:#555;}
.time{color:#555;}
.copyright{color: #999; font-size: 10px; padding: 10px;}

/* 모바일 하단고정메뉴 */
.bottom-menu {  
  max-width:1024px;
  min-width: 320px;
  width:100%;
	position:fixed;
	bottom:0;
	background-color:#FFF;
	display:flex;
	align-items:center;
	justify-content:space-between;	
	padding-top:5px;
  padding-bottom:5px;
  z-index: 10;
	}
.bottom-menu a {
	display:flex;
	flex-direction:column;
	align-items:center;
  flex:1;
	padding:5px;
	color:#949494;
  font-weight:600;
  font-size:12px;
  text-decoration:none;
  transition:all .3s;
  font-weight: 300;
}
.bottom-menu a i{
  font-size:18px;
  margin-bottom:5px;
}
.bottom-menu a.sat {  
  background-color:#19b698;
  color:#fff;
  border-radius:100%;
  width:80px;
  height:80px;
  display:flex;
  align-items:center;
  justify-content:center;
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  top:-35px;
  border:6px solid #fff;
}
.bottom-menu a.sat:hover {
  border-color:#19b698;
  color:#fff;
}
.bottom-menu a.active, .bottom-menu a:hover {
  color:#19b698;
}
.bottom-menu a:last-child{
	margin-right:0;
	}
span.bosluk {
  flex:1;
}

/* intro 인트로페이지 */
.wrap.intro{background-color: #19b698; height: 100vh; min-height: initial; padding-bottom: initial;}
.intro_logo{height: inherit;
  display: flex;
  align-items: center;
  justify-content: center; flex-direction: column;}
.intro_logo i{position: initial; color:#fff; font-size: 30px; padding: 10px;}
/******************* login- 로그인페이지 *******************/
/* login1-1- 로그인페이지 */
.left_btn{display: inline-block; font-size: 24px; margin-top: 25px; margin-left: 15px; color:#ccc;}
.login {
  width: 30%;
  height: 600px;
  background: white;
  border-radius: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.login_id {
  margin-top: 20px;
  width: 80%;
  position: relative;
}

.login_id input {
  width: 100%;
  height: 35px;
  margin-top: 10px;
  padding: 0px 20px;
  border-bottom: 1px solid lightgray;
  outline: none;
}

.submit {
  margin-top: 30px;
  width: 60%;
}
.submit input {
  width: 100%;
  height: 35px;
  border: 0;
  outline: none;
  border-radius: 5px;
  background: #b3b3bb;
  color: white;
  font-size: 12px;
}
.forgot_login{width: 80%; margin: 30px auto; display: flex; justify-content: space-evenly; color:#aaaaaa;}
.sns_login_box p{text-align: center; margin: 20px auto 10px;}
.sns_login{display: flex; justify-content: center;}
.sns_login div{margin: 5px;}

/* login1-2.html 아이디/비밀번호 찾기 */


.login-form .group .input,
.login-form .group .button{
	border: 1px solid #ddd;
	padding:15px 20px;
	border-radius:25px;
	background:#fff;
}

/* login1-3.html 아이디/비밀번호 찾기 */
.sms_time{position: absolute; right: 45px; top: 15px; color: #333;}

/* login1-4.html 아이디/비밀번호 찾기 */
.content_top h4{margin: 10px; text-align: center;}

/* 회원가입 join1-1.html */
.content_top h3{margin: 10px; text-align: center;}
.checkbox_group div{display: flex; justify-content: space-between; padding: 10px;}
.checkbox_group div:first-child label{border-bottom: none;}
.checkbox_group div label{border-bottom: 1px solid #ccc;}
.checkbox_group div:first-child{background-color: #eee; border-radius: 5px;}

/******************* terms-이용약관 *******************/

.content_mid.terms{margin:0 auto;  border:1px solid #ccc; padding: 10px; color: #555; box-sizing: border-box; font-size: 12px;}
.terms_bold{font-weight: 700; color:#5a5a5a;}

/* 회원가입 join1-2.html */
.login_id p{padding: 5px;}
.h_area1.select,.h_area2.select{width: 49%;}
.join_btn{position: absolute; right: 0; bottom: 5px; padding: 5px; border: 1px solid #e0e0e0; border-radius: 5px; font-size: 12px; color:#7c7c7c;}

/* 회원가입 join1-3.html */
.flex_box{display: flex; align-items: baseline;}
.flex_box select,.flex_box input{margin: 5px;}
.select.tel{height: 35px;}
.intext.tel{border:1px solid #e0e0e0;}


/******************* withdrawal-회원탈퇴 *******************/
.num_li{margin-left: 15px;}

.withdrawal_label{display: -webkit-box; display: -webkit-flex;display: -ms-flexbox;display: flex; margin-bottom: 1rem; margin-top: 1rem;}
.withdrawal_form label{display: inline-block; width:80px !important; vertical-align: top;}
.withdrawal_form.txt{margin-top: 20px;}
#out1{vertical-align: middle;}
#out2,#out3,#ou4,#out5{vertical-align: middle; margin-left:10px;}
.out_txtbox{width: 85%; height: 200px;}
/* .out{display: inline;} */
.out_input{display: inline;}

/* my_information1-2.html 내정보관리 */
.login_id.flex{display: flex; justify-content: space-between; align-items: baseline;}

/* unregister1-1.html 회원탈퇴 */
.unregister input{width: initial; height: initial;}


/******************* cat_registration-반려묘등록 *******************/
.content{display: inline-block; position: relative; width: 100%; margin: 80px auto 0; padding: 20px 30px; min-height: 150px;}
.sub_tit_content{margin-bottom: 5px;}
.sub_tit_box{margin-bottom: 5px; float: left;}
.content_top img{vertical-align: bottom; margin-right: 5px;}
.sub_tit{display: inline-flex; font-size: 16px; font-weight: 700;}
.sub_tit::after{content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7px;
  background-color: rgba(25,182,152,.14901960784313725);}
.data-txt{display: flex; flex-direction: column; margin: 10px 0;}
.data-txt span{margin: 5px 0;}
.data-txt .color-d-red::after{content: "*";
  color: #f00;
    position: relative;
    margin-top: 3px;
    margin-left: 5px;}
.my-pet-contents-input{
  border: 1px solid #e0e0e0;
  border-radius: 3px;
  padding: 7px;
  width: 100%;
  letter-spacing: -.57px;}
.sm_txt{font-size: 12px; color:#8d8d8d;}

.data-file{margin: 10px 0;}

.profile-pic {
  max-width: 200px;
  max-height: 200px;
  display: block;
}

.avatar-upload {
  position: relative;
  max-width: 160px;
  margin: 0px auto;
}

.avatar-upload .avatar-edit {
  position: absolute;
  right: 12px;
  z-index: 1;
  top: 10px;
}

.avatar-upload .avatar-edit input {
  display: none;
}

.avatar-upload .avatar-edit input + label {
  display: inline-block;
  width: 34px;
  height: 34px;
  margin-bottom: 0;
  border-radius: 100%;
  background: #FFFFFF;
  border: 1px solid transparent;
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
  cursor: pointer;
  font-weight: normal;
  transition: all .2s ease-in-out;
}

.avatar-upload .avatar-edit input + label:hover {
  background: #f1f1f1;
  border-color: #d6d6d6;
}

.avatar-upload .avatar-edit i{

  color: #757575;
  position: absolute;
  top: 10px;
  left: 0;
  right: 0;
  text-align: center;
  margin: auto;
}

.avatar-upload .avatar-preview {
  width: 150px;
  height: 150px;
  position: relative;
  border-radius: 100%;
  border: 6px solid #F8F8F8;
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
}

.avatar-upload .avatar-preview > div {
  width: 100%;
  height: 100%;
  border-radius: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.select {
  width: 100%;
  padding: 5px;
  border: 1px solid #e0e0e0;
  font-family: inherit;
  /* background: url('arrow.jpg') no-repeat 95% 50%; */
  border-radius: 0px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  }
  
.birthday{display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-pack: distribute;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;} 
.birthday select{width: 32%;}
.my-pet-select{display: flex;
  flex-direction: row;
  justify-content: space-between;}
.my-pet-select input[type=radio]{
  display: none;
}
.my-pet-select input[type=radio]+label{
  cursor: pointer;
  padding: 5px;
  width: 49%;
  border: 1px solid #e0e0e0;
  text-align: center;
  background-color: #fff;
  color: #333;
}
.my-pet-select input[type=radio]:checked+label{
  background-color: #19b698;
  color: #fff;
}
.my-pet-select input[type=radio]:checked+label .sm_txt{color: #fff;}

.kg{display: flex;}

.my-pet-select.body input[type=radio]+label{cursor: pointer;
  padding: 5px;
  width: 33%;
  border: 1px solid #e0e0e0;
  text-align: center;}

  .my-pet-select.health {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .my-pet-select.body input[type=checkbox]+label{cursor: pointer;
    padding: 5px;
    border: 1px solid #e0e0e0;
    text-align: center;
  }

.my-pet-contents-checkbox[data-check_none] {
    display: none;
}

.my-pet-select.health input[type=checkbox]+label{cursor: pointer;
  padding: 5px;
  border: 1px solid #e0e0e0;
  text-align: center;}

.my-pet-select input[type=checkbox]:checked+label{
  background-color: #19b698;
  color: #fff;
}

.my-pet-contents-checkbox-button[data-check_none] {
  display: flex;
  overflow: hidden;
  width: calc(33.33333% - 10px);
  word-break: keep-all;
  align-items: center;
  justify-content: center;
  margin-bottom: 5px;
}

.birthday .my-pet-contents-input{margin: 5px;}

#allergy-y-content{display: none;}
#medicine-y-content{display: none;}
.btn_box{text-align: center;}
.swiper-slide.total{margin: 20px auto 0; width: 100% !important; background-color: #f6f6f6;}
.btn_box1{display: flex; position: absolute; left: 50%; transform: translateX(-50%); width: 100%; bottom: 196px;}
.prev_btn{width: 100%; color:#eee; background-color: #7a7a7a; padding: 10px;}
.next_btn{width: 100%; color:#fff; background-color: #19b698; padding: 10px;}

.searchTerm {
  width: 100%;
  border-right: none;
  padding: 8px;
  border-radius: 5px 0 0 5px;
}
.searchButton {
  width: 40px;
  padding: 3px;
  border: 1px solid #19b698;
  background: #19b698;
  text-align: center;
  color: #fff;
  border-radius: 0 5px 5px 0;
  cursor: pointer;
  font-size: 18px;
}
/* 사료검색 */
.cat_food_popup_box{position: relative; height: 100%;}
.cat_food_top{position: relative;}
.h3_tit{text-align: center; margin: 10px;}
.searchButton.arrow{position: absolute; background-color: transparent; border: none; color: #ccc; z-index: 2;}
.cat_food_search{display: flex;}
.cat_food_search_text{position: relative; display: flex; margin-top: 5px;}

.my-pet-select.age{-webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: space-around;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;}
.my-pet-select.age{border:1px solid #e0e0e0;}
.my-pet-select.age > div{ width: 33.3333%; border-bottom: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0;;}
.my-pet-select.age > div:nth-last-of-type(1),.my-pet-select.age > div:nth-last-of-type(2),.my-pet-select.age > div:nth-last-of-type(3){border-bottom: none;}
.my-pet-select.age > div:nth-of-type(3),.my-pet-select.age > div:nth-of-type(6),.my-pet-select.age > div:nth-of-type(9){border-right: none;}
.my-pet-select.age > div label{display: block; width: 100%; border: none; padding: 5px; text-align: center; cursor: pointer;}
.my-pet-select.age label{
  height: 100%;
  box-sizing: border-box;  margin-bottom: 0;}
.my-pet-select.age div:checked+label{
  background-color: #19b698;
  color: #fff;
  width: 100%;
  padding: 5px;
 
}
.searchTerm.text-in{text-indent: 10px;}
.cat_food{
  display: none;
  overflow:hidden;
  left:5em;
  z-index:5;
  width:100%;
  height:100%;
  position: absolute;
  background-color: #fff;
  padding: 10px 20px;
  top: 0;
}


.para{
  color:#033f72;
  padding-left:100px;
  font-size:3em;
  margin-bottom:20px;
}

.open{
  display: block;
  top: 0;
  left: 0;
  width:100%;
  height:100%;
  background-color: #fff;
}

.my-pet-select.moisture > div{width: 50%; border:1px solid #e0e0e0; text-align: center;}
.my-pet-select.moisture > div:first-child{border-right: none;}
.my-pet-select.moisture div label{display: block;width: 100%;border: none;padding: 5px;text-align: center;cursor: pointer;}

/* 터치슬라이더 */
.slider_container {margin-top: 10px;}

.slider-labels {
  margin-top: 10px;
}

.noUi-target,.noUi-target * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -ms-touch-action: none;
  touch-action: none;
  -ms-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.noUi-target {
  position: relative;
  direction: ltr;
}

.noUi-base {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
/* Fix 401 */
}

.noUi-origin {
  position: absolute;
  right: 0;
  top: 0;
  left: 0;
  bottom: 0;
}

.noUi-handle {
  position: relative;
  z-index: 1;
}

.noUi-stacking .noUi-handle {
/* This class is applied to the lower origin when
   its values is > 50%. */
  z-index: 10;
}

.noUi-state-tap .noUi-origin {
  -webkit-transition: left 0.3s,top .3s;
  transition: left 0.3s,top .3s;
}

.noUi-state-drag * {
  cursor: inherit !important;
}

/* Painting and performance;
 * Browsers can paint handles in their own layer.
 */
.noUi-base,.noUi-handle {
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

/* Slider size and handle placement;
 */
.noUi-horizontal {
  height: 4px;
}

.noUi-horizontal .noUi-handle {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  left: -7px;
  top: -7px;
  background-color: #19b698;
}

/* Styling;
 */
.noUi-background {
  background: #D6D7D9;
}

.noUi-connect {
  background: #19b698;
  -webkit-transition: background 450ms;
  transition: background 450ms;
}

.noUi-origin {
  border-radius: 2px;
}

.noUi-target {
  border-radius: 2px;
}

/* Handles and cursors;
 */
.noUi-draggable {
  cursor: w-resize;
}

.noUi-vertical .noUi-draggable {
  cursor: n-resize;
}

.noUi-handle {
  cursor: default;
  -webkit-box-sizing: content-box !important;
  -moz-box-sizing: content-box !important;
  box-sizing: content-box !important;
}

.noUi-handle:active {
  border: 8px solid #345DBB;
  border: 8px solid rgba(53,93,187,0.38);
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  left: -14px;
  top: -14px;
}

/* Disabled state;
 */
[disabled].noUi-connect,[disabled] .noUi-connect {
  background: #B8B8B8;
}

[disabled].noUi-origin,[disabled] .noUi-handle {
  cursor: not-allowed;
}

.slider-caption{display: flex; justify-content: space-between;}

.btn_box1.popup{bottom: 100px;}
.prev_btn.cancel,.next_btn.search{padding: 8px;}


/* cat_information1-1.html 반려묘 정보 */
.common_table{width: 100%; text-align: center; margin-top: 10px;}
.common_table tr,.common_table td{width: 25%; border:1px solid #eee; padding: 10px;}
.common_table thead tr:first-child,.common_table thead tr:nth-child(2){background-color: #ccc;}

/* necklace_registration1-1.html 목걸이 등록*/
.registration_box{display: flex; flex-direction: column; align-items: center;justify-content: center; border:1px dashed #ccc; padding: 10px; border-radius: 5px; text-align: center; min-height: 160px; width: 80%; margin: 20px auto;}
.registration_box div i{color:#19b698;}
.registration_box img{width: 80px; height: auto;}

/* locationterms.html 위치기반서비스 이용약관 */
.terms_indent{margin-left: 10px;}

/* mypage1-1.html 마이페이지 */
.mypage{border:1px solid #d1d1d1; padding: 20px; border-radius: 10px;}
.mypage.flex{display: flex; justify-content: space-around; align-items: flex-end;}

/* mypage1-1 */
.mySwiper.small{text-align: center;
  background: #fff;
  padding: 20px;
  /* Center slide text vertically */
  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;}

  .h300{height: 300px;}

  .swiper.mySwiper.small .swiper-slide img {
    display: block;
    width: 100%;
    height: 150px;
    object-fit: contain;
  }

/* curation1-1.html  큐레이션 */
.tabs {
  margin-top: 20px;
  float: left;
  width: 100%;
}
.tabs li {
  float: left;
  overflow: hidden;
  position: relative;
  background: #eee;
  padding: 10px;
  text-align: center;
}
.tabs.one li {width: 33.3333%;}
.tabs.two li {width: 50%;}
.tabs li a {
  display: block;
  padding: 0 20px;
}
.tabs li a:hover {
  color:#19b698;
}
.tabs li.active,.tabs li.active a:hover  {
   /*--Makes sure that the active tab does not listen to the hover properties--*/
  background: #19b698;
 color:#fff;
}

/*Tab Conent CSS*/
.tab_container {
  overflow: hidden;
  clear: both;
  float: left; 
  width: 100%;
}
.tab_content {
  margin-top: 10px;
}

.curation_txt{padding: 10px;}
.statistics input {height: 25px; width: 100px;}
.td-link{display: flex;}
.calendar3,.calendar4{border:1px solid #ccc;}
.item_tit{margin: 10px;}
.day_btn_box{display: flex;}
.day_btn{width: 90px; padding: 5px; border:1px solid #ccc; font-size: 12px; margin:0 5px;}
.btn_date3,.btn_date4{text-align: center;
  font-size: 0.8em;
  color: #fff;
  background: #19b698;
  border: 0;
  border-radius: 5px;
  vertical-align: top;
  cursor: pointer;
  width: 30px; height: 25px;
}
.btn_date_search{font-size: 0.8em;
  color: #fff;
  background: #19b698;
  border: 0;
  border-radius: 5px;
  vertical-align: top;
  cursor: pointer;
  width: 40px; height: 25px; margin-left: 5px;}

  .product_name{width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

/* item_information1-1.html 도면등록 */

.cm{display: block; margin-top: 25px;}

/* item_information1-2.html 도면등록 */
.room_box{padding: 10px;}
.item_box{display: flex; flex-wrap: wrap; justify-content: center; width: 100%; max-height: 100px; overflow-y: scroll;}
.item_box div{cursor: pointer; text-align: center; margin: 20px;}


/* item_information1-3.html 도면등록 */
.swiper.mySwiper.item{height: auto !important;}
.room_item{height: 150px;}
.item_btn{position: absolute;}
.item_con{position: relative; width: 30px; height: 15px; border: 1px dashed #000; background-color: #fff;}
.item_con i{position: absolute; right: -12px; font-size: 10px; top:0;}
.item_name{width: 100px; text-align: center;}

/* community1-1.html 커뮤니티 */
.community_btn{display: flex;}
.community_btn i{padding: 5px 0; font-size: 20px; color:#333; margin-left: 20px;}
.sub_tit_content.community{display: flex; justify-content: space-between; padding: 0 10px;}
.input-file-button{cursor: pointer;}
.community_box{margin: 0 auto; border:1px solid #e0e0e0; padding: 10px; border-radius: 10px; margin: 10px;}
.community_box .community_img{width: 100%; /* height: 300px; */ background-color: initial;}
.community_box .community_img img{display: block; width: 100%; height: 100%; object-fit: contain; padding: 5px;}
.community_txt{margin: 10px 20px;}
.community_txt1{display: flex; justify-content: space-between; margin-bottom: 10px;}
.community_symbol i{margin: 10px 5px;}
.comment_txt p{margin: 5px 0;}

/* community1-2.html 커뮤니티 */
.pic_flex{display: flex;padding: 10px;}
#pic{object-fit: contain;max-width: 80px; height: 100%; flex:1;margin: 5px;}
#pic_textarea{flex:2; margin: 5px;padding: 5px; border: none;}

/* community1-3.html 커뮤니티 */
.community_symbol{position: relative;}
.lyr_post_function{display: none; width: 100%; position: absolute; font-size: 12px; z-index: 1;}
.lyr_post_function ul{background-color: #fff; text-align: right;}
.lyr_post_function.one{right:0;}
.community_profile{display: flex; align-items: center;}
.like_txt{font-size: 12px;}
.comments_box{display: flex; align-items: center; margin-top: 10px;}
.comments_box p{margin-left: 5px;}
.comments_txt{display: flex; justify-content:space-between; flex-direction:row;}
.lyr_post_function.two{width: initial; top: 20px; right: 0;}
.form-group{display: flex; align-items: center; margin-left: 5px;}
.form-control{border:1px solid #e0e0e0; padding: 5px; border-radius: 5px;}
.comments_block{display: none; margin-left: 10px;}
.comments{position: relative;}

/* community1-4.html 커뮤니티 */
.community_top{width: 80%; margin: 0 auto;}
.community_top div{display: flex; justify-content: space-between;}
.total_img{display: flex; flex-wrap:wrap; justify-content: center; margin-top: 10px;}
.total_img div{min-height: 1px; margin: 1px;}
.total_img div img{flex-basis: 200px; width: 200px; height: 250px; object-fit: cover;}
/* .sm_btn i{vertical-align: top;} */

/* faq1-1.html 자주묻는질문 */
.faq_panels {overflow: hidden; }
/* FAQ listBox */
.faq_list {width: 100%;}
.faq_list > ul {overflow: hidden; width: 100%;}
.faq_list > ul > li {border-bottom: 1px solid #ddd;}
/* faq listBox 제목 */
.faq_title {position: relative; color: #282c37; margin: 0 30px 0 15px; padding: 20px 0 20px 10px;line-height: 20px; cursor: pointer; font-weight: 500; }
.faq_title span:first-child {position: absolute; top: 50%; left: 0; transform: translate(-50%, -50%); color: #7daca8; padding-right: 15px;}
/* .faq_title span.faq_list_tit {padding-right: 30px;} */
.faq_title strong {display: inline-block; width: 150px; vertical-align: middle; margin-left: 40px;}
.faq_title .fa-chevron-down {position: absolute; top: 50%; right: -30px; transform: translate(-50%, -50%); font-size: 1.2rem; color: #555;}
/* FAQ listBox 내용 */
.faq_conts {display: none; padding: 20px 40px; background-color:rgba(125, 172, 168, 0.138);}
.faq_conts p { line-height: 18px; word-break: keep-all;}

/* 공지사항 */
.notice_title{display: flex; align-items: center; border-bottom: 1px solid #e0e0e0; padding: 5px;}
.notice_tit{padding: 5px; border-radius: 5px; border:1px solid #e0e0e0;}
.notice_txt{margin-left: 10px;}
.notice_tit.fix{background-color: #19b698; color:#fff; border:none;}
.empty_list{display: none; border-bottom: 1px solid #e0e0e0; padding: 5px;}
.sm_btn.more{display: block; margin: 10px auto;}

/* 공지사항 상세 */
.notice_title.notice1-2{justify-content: space-between; background-color: #e0e0e0;;}
.notice_tit.notice1-2{background-color: #fff;}
.contEditor{padding: 10px; min-height: 100px; background-color: #fafafa;}

/* 불러다옹 소식 */
.contEditor.news{text-align: center;}
.contEditor img{max-width: 100%;}
.contEditor p{margin: 5px;}
.text_ellipsis p{width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

/* 1:1문의 */
.ellipsis {display: inline-block; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.clearfix::before, .clearfix::after {content: ""; display: block; clear: both;}
.floatLeft {float: left;}
.floatRight {float: right;}

/* 1.문의목록 */
.mypage_inquiry .empty {display:  block;text-align: center; padding: 50px 0; margin: 20px 0;}
.mypage_inquiry .inquiry_top {padding-bottom: 5px;}
.mypage_inquiry .inquiry_top h3 {float: left;}
.mypage_inquiry .inquiry_top .inquiry_btn {float: right;}
.mypage_inquiry .inquiry_top .inquiry_btn{ color: #fff; background-color:#999; font-size: .9em; padding: 7px 18px;}
.mypage_inquiry .inquiry_top .inquiry_btn:hover {background-color:#777; border: 0px;}


.mypage_inquiry_list h2 {margin-top: 30px;}
.mypage_inquiry_list table.inquiry_list {width: 100%; border-bottom: 1px solid #ddd;}
.mypage_inquiry_list table.inquiry_list thead th {background-color:#eeeeee; height: 40px;}

.mypage_inquiry_list table.inquiry_list tbody > * {text-align: center;}
.mypage_inquiry_list table.inquiry_list tbody tr {height: 50px; border-bottom: 1px solid #eee;}

.mypage_inquiry_list table.inquiry_list tbody tr i {margin-right: 0px; color: #19b698;}
.mypage_inquiry_list table.inquiry_list tbody tr .txt_under {max-width: 600px; text-align: left;}

.mypage_inquiry_list table.inquiry_list tbody tr .txt_under:hover {text-decoration: underline;}
.mypage_inquiry_list table.inquiry_list tbody tr .txt_color {color: #19b698; font-weight: bold;}

.mypage_inquiry_list table.inquiry_list tbody .delivery_btn {background-color: #777; color: #fff; border-radius: 5px; padding: 3px 5px; display: block; text-align: center; margin: 2px auto;}
.mypage_inquiry_list table.inquiry_list tbody .mypage_cancel_btn {border: 1px solid #ddd; border-radius: 5px; padding: 3px 5px; display: block; text-align: center; margin: 2px auto;}

.mypage_inquiry .empty {margin-top: 10px; padding: 50px 0; text-align: center; /* border-top: 1px solid #ddd; */ border-bottom: 1px solid #ddd;}

/* 2.문의상세내용 */
.mypage_inquiry .inquiry_top {padding-bottom: 5px;}
/* 답변/완료 박스 */
.mypage_inquiry .cs3_table1 .style02 {color: #fc7169; font-weight: 700; border-radius: 5px; padding: 2px 10px; background: #777; color: #fff;}
.mypage_inquiry .cs3_table1 .style03 {color: #fff; font-weight: 500; padding: 2px 5px; margin-right: 10px; border: 1px solid #19b698; background-color: #19b698; border-radius: 5px; vertical-align: middle;}

.mypage_inquiry .cs3_table1 tbody tr td.txtleft {text-align: left; padding-left: 10px;}

/* 문의내역상세 */
.mypage_inquiry .cs3-1_table1 {width: 100%; border-bottom: 1px solid #ddd;}
.mypage_inquiry .cs3-1_table1 th {background-color: #eee; padding: 5px 10px; text-align: left;}
/* .mypage_inquiry .cs3-1_table1 th > * {display: inline-block; vertical-align: middle;} */
.mypage_inquiry .cs3-1_table1 th h3 {vertical-align: middle;}
.mypage_inquiry .cs3-1_table1 th h3 span {font-size: 1.1rem; padding-right: 6px;}

.mypage_inquiry .cs3-1_table1 tbody tr td .inquiry_contents {line-height: 1.5; min-height: 150px; padding: 20px; text-align: justify;}
.cs3-1_table1 .floatLeft {vertical-align: middle; line-height: 35px;}
.mypage_inquiry .cs3-1_table1 .Date {color: #555; text-align: right;}
.mypage_inquiry .cs3-1_table1 .style04 {margin-left: 10px; color: #888; text-align: right;}

/* 답변등록하기 */
.mypage_inquiry .answer_wrap {background-color: #f1f1f1; padding: 20px;}
.mypage_inquiry .answer_wrap .answer_wri > * {display: inline-block;}
.mypage_inquiry .answer_wrap .answer_wri span {color: #fff; background-color: #777; padding: 2px 10px; border-radius: 5px; vertical-align: top;}
.answer_wrap .answer_box {min-height: 70px;}
.answer_wrap .answer_wri_cont {padding-left: 10px;}
.answer_enter .floatLeft {width: 80%;}
.answer_enter .floatRight {width: 20%;}
.answer_enter textarea {width: 100% !important; padding: 5px; color: #666666; height: 100px; resize: none; border: 1px solid #ddd;}
.mypage_inquiry .answer_enter .answer_btn button {width: 100%; height: 100px; background-color:  #19b698; color: #fff; font-size: 1em; padding: 0 5px;}

/* 3.문의하기 */
.mypage_inquiry .cs3-2_table {width: 100%; border-top: 1px solid #eee; border-bottom: 1px solid #eee;}
.mypage_inquiry .cs3-2_table tr {height: 30px; border-bottom: 1px solid #eee;}
.mypage_inquiry .cs3-2_table tr th {background-color: #ccc; width: 20%; padding: 10px 10px; height: 30px; text-align: center}
.mypage_inquiry .cs3-2_table tr td {padding: 10px; display: block; margin-left: 5px;}
.mypage_inquiry .cs3-2_table tr td textarea {resize: none; width: 100%; padding: 5px; min-height: 200px; border: 1px solid #ddd;}
.mypage_inquiry .cs3-2_table tr td input[type='text'] {width: 100%; height: 35px; border: 1px solid #ddd; padding: 3px 0px 3px 5px;}

.mypage_inquiry .cs3-2_table select {padding: 5px 10px 6px; width: 25%; font-family: inherit; border: 1px solid #dddddd; border-radius: 0; cursor: pointer; background-color: #fff;}


/* 검색결과창 */
.search_bar{
  width: 100%;
  border: 1px solid #d8d8d8;
  padding: 5px;
  background: #fff;}
.search_results1-1{display: flex; justify-content: space-between; padding: 20px 0 5px; border-bottom: 1px solid lightgray;}
.search_results1-2{padding: 15px 0;}
.search_results1-2 button{color:#fff; border:none}
.search_results1-2 h4{margin-bottom: 5px;}
.result_food{display: flex; align-items: center;}
.result_food img{max-width: 10%;}
.result_food h6{width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-left: 10px;}
  .catfood_img{max-width: 100%;}

  .search_results1-1.flex_center{justify-content: center;}
  .search_results1-1.none_flex{display: block; padding: 10px 0;}

  /* 사료검색결과 */
  .search_results1-2_list{display: flex; padding: 5px 0;}
  .search_results1-2_list div:last-child{margin-left: 5px;}

  .progress-bar_box{display: flex;}
  .progress-bar1{width: 100%; flex-wrap: wrap; padding: 10px;}
  .progress-bar1 p{font-size: 12px;}
  
  .horizontal .progress-track {
    position: relative;
    width: 100%;
    height: 15px;
    background: #ebebeb;
    border-radius: 50px;
  }
  
  .horizontal .progress-fill {
    position: relative;
    background: #aaaaaa;
    height: 15px;
    color: #fff;
    text-align: center;
    font-size: 10px;
    line-height: 15px;
    border-radius: 50px;
  }

  .cat_food_box{background-color: #eee; padding: 20px; border-radius: 5px;}
  .cat_food_box p{color:#555; padding: 5px 0;}
/* 팝업효과 css */
.cd-popup {
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s;
  -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s;
  transition: opacity 0.3s 0s, visibility 0s 0.3s;
  z-index: 100;
}
.cd-popup.address1{background-color: transparent !important;}
.cd-popup.is-visible {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0.3s 0s, visibility 0s 0s;
  -moz-transition: opacity 0.3s 0s, visibility 0s 0s;
  transition: opacity 0.3s 0s, visibility 0s 0s;
}

.cd-popup-container {
  position: relative;
  width: 90%;
  max-width: 1100px;
  margin: 4em auto;
  background: #FFF;
  border-radius: .25em .25em .4em .4em;
  text-align: center;
  box-shadow: 0 0 20px rgb(0 0 0 / 20%);
  -webkit-transform: translateY(-40px);
  -moz-transform: translateY(-40px);
  -ms-transform: translateY(-40px);
  -o-transform: translateY(-40px);
  transform: translateY(-40px);
  -webkit-backface-visibility: hidden;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

/* 팝업 크기 */
.cd-popup-container.w20{width: 20%; min-width: 250px;}
.cd-popup-container.w22{width: 420px;}
.cd-popup-container.w25{width: 480px;}
.cd-popup-container.w30{width: 700px;}

	/* 팝업버튼 */
	.pop-btn{clear: both;}
  /* margin: 10px auto 0; */
	.pop-btn ul{text-align: center;}
	.pop-btn ul li{display: inline-block; margin: 5px;}
	.pop-data{clear: both; text-align: left; margin-top: 20px;}

  .btn.btn-defualt {
    width: 80px;
    border-radius: 4px !important;
    border: 1px solid #949398;
    background: #fff;
    color: #1a1a1a;
    padding: 5px;
    margin-top: 0;
    text-align: center;
    font-size: 12px;
}

  .pop_close.delete{position: absolute; padding: 10px; cursor: pointer; right:10px; top: 0; z-index: 2;}
  .line {
    width: 100%;
    height: 1px;
    background-color: #ccc;
    clear: both;
}
	/* 데이터삭제 팝업 */
  .pop-title{padding: 5px;}
  .pop-title h4 {
		font-weight: 400;
	}
	.pop_box.delete{margin-top: 15rem; padding: 10px; border-radius: 10px;}
	.cd-popup-container.delete{width: 25%;}
	#nowMemberPassword1{width: 80%; float: none; margin-top: 20px;}
	.pop_txt.center p{text-align: center; padding: 10px; font-size: 12px;}


@media screen and (max-width: 1024px){
/* .icon_box div{justify-content: space-around;} */
/* .icon_box div img{width: 80%;} */
/* .icon_box div p{text-align: center;} */
.toggle_btn{right: calc(100% - 100%);}
.swiper.mySwiper.small .swiper-slide img{height: 100px;}
}

@media screen and (max-width: 499px){
  .wrap{font-size: 12px; min-height: 730px;}
  .hd{height: 60px;}
  .hd [class*="menu-"]{font-size: 20px; padding-top: 12px; margin-left: 5px;}
  .hd p{top: 15px;}
  .menuBtn{top: 12px;}
  .search{height: 60px;}
  #searchtoggle{padding: 15px;}
  #searchbar{margin-top: 0; padding: 5px;}
  .logo img{top: 5px;}    
  .swiper-slide{font-size: inherit !important;}
  .cat_info h5{font-size: 14px;}
  .cat_txt,.cat_modify,.cat_info p{font-size: inherit;}
  .tog_gnb li a{font-size: inherit;}
  .button_box{font-size: inherit;}
  .toggle_btn{width: 60px; height: 60px;}
  .m_tnb{margin-top: 0;}
  
  .swiper-button-next,.swiper-button-prev,.swiper-pagination{display: none;}
  #tog_gnb{width: 100%; height: 100%;}
  .icon_box div{margin: 10px;}
  .icon_box img{width: 70px !important;}
  /* .toggle{background-color: inherit;} */

  .left_btn{margin-top: 15px;}
  .content{margin-top: 60px; padding: 20px 20px 30px;}

  .sub_tit{font-size: 14px;}
  

  /* 반려묘 활동 */
  .tabs{margin-top: 0px;}

  /* 큐레이션 */
  .mySwiper.small{height: auto;}
  .swiper.mySwiper.small .swiper-slide img{height: 80px;}
  .tabs li a{padding: 0;}


  /* 목걸이 등록 조회 */
  .common_table tr, .common_table td{padding: 2px;}
  .button_box.sm{font-size: 12px;}

  /* 자주 묻는 질문 */
  .faq_title{padding:10px 0px 10px 10px;}
  .faq_title .fa-chevron-down{font-size: inherit;}
  .faq_conts{padding: 20px;}

  /* 커뮤니티 */
  .community_box{margin-bottom: 10px;}
  .community_txt{margin: 10px;}

  .form-group{flex-wrap: wrap;}
  .form-control{width: 75%;}
  .sm_btn.f-z-10{font-size: 10px; min-width: initial;}
  .form-group{flex-wrap: wrap;}
  .sm_btn.f-z-10{font-size: 10px; min-width: initial;}
  .total_img div{height: 150px; margin: 1px;}
  .total_img div img{width: 100px; height: 150px; object-fit: cover;}

  /* 1:1 문의 */
  /* 1:1문의 */
  .mypage_inquiry_list table.inquiry_list thead th {letter-spacing: -1px; padding: 5px;}
  .mypage_inquiry_list table.inquiry_list tbody tr td:first-child {letter-spacing: -0.5px;}
  .mypage_inquiry_list table.inquiry_list tbody tr .txt_under {max-width: 170px;}
  .mypage_inquiry_list table.inquiry_list tbody tr .txt_color {letter-spacing: -1px;}
  .mypage_inquiry .cs3-1_table1 th {padding: 5px 10px;}
  .cs3-1_table1 .floatLeft {line-height: 25px;}
  .mypage_inquiry .cs3-1_table1 th h3 {font-size: 1.1em; white-space: normal; display: inline;}
  .mypage_inquiry .cs3-1_table1 th h3 span {font-size: 1.1em;}
  .mypage_inquiry .cs3-1_table1 tbody tr td .inquiry_contents {padding: 10px;}
  
  .mypage_inquiry .answer_wrap {padding: 10px;}
  .answer_enter .floatLeft {width: 75%;}
  .answer_enter .floatRight {width: 25%;}

  .mypage_inquiry_list .inquiry_list .inquiry_title {padding-right: 0;}
  .mypage_inquiry_list .inquiry_list .inquiry_title button.right_Delbtn {top: -27px; font-size: 12px;}
  .mypage_inquiry_list .inquiry_list .inquiry_list_qna .inquiry_conts {padding: 10px;}

  .mypage_inquiry .cs3-2_table tr th {padding: 10px 5px;}
  .mypage_inquiry .cs3-2_table tr td input[type='text'] {font-size: 12px;}
  .mypage_inquiry .cs3-2_table tr td textarea {font-size: 12px;}

  /* item_information1-3 */
  .room_item{height: 100px;}

}
@media screen and (max-width: 320px){
  .icon_box{padding: 0px 0px 15px;}
  .content{padding: 15px 15px 40px;}
  .btn_box1{bottom: 213px;}
  .cat_box{padding: 5px; margin-top: 20px;}
}