@charset "utf-8";

/*** メニュー アクティブ ***/
.header-menu-list-item.is_search .header-menu-list-item__link {
  box-shadow: 0 -3px 0 #ee8aa4 inset;
  color: #ee8aa4;
}

.primary p {
  font-size: 14px;
  line-height: 1.4em;
}

/********** ページ内共通 **********/
.primary .primary__inner .form p {
  line-height: initial;
}

.primary .primary__inner li {
  list-style: none;
}

.primary__inner button {
  display: block;
  border: none;
  font-weight: bold;
  line-height: 1;
  text-align: center;
  appearance: none;
  cursor: pointer;
}



/***** セクションやブロック *****/
.description {
  margin-bottom: 40px;
}

.primary div.primary__inner {
  position: relative;
  width: 100%;
}



/***** 保存済み検索条件 *****/
.saved-filters-list {
  margin: 20px 0 40px;
  padding: 16px 20px 20px;
  background: #fce4eb;
  border-radius: 16px;
}

.primary p.saved-filters-list__description {
  margin-bottom: 8px;
}

.saved-filters-list-item {
  box-sizing: border-box;
  display: flex;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 2px 10px 0 rgba(233, 121, 150, .15);
}

.saved-filters-list-item + .saved-filters-list-item {
  margin-top: 6px;
}

.saved-filters-list-title {
  box-sizing: border-box;
  flex: 1;
  padding: 16px 0 16px 12px;
  font-size: 16px;
  font-weight: bold;
  line-height: 1;
  letter-spacing: 0.04em;
  color: #ee8aa4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.saved-filters-list-data {
  display: flex;
  justify-content: flex-end;
  width: 246px;
}

.saved-filters-button-wrap {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  column-gap: 5px;
  flex: 1;
}

.saved-filters-number {
  font-size: 12px;
  text-align: right;
  white-space: nowrap;
}

.saved-filters-list .button.is_search-saved-filters {
  box-sizing: border-box;
  width: 80px;
  padding: 6px 0;
  background: linear-gradient(to right, #ff88a7, #f487cc);
  box-shadow: 0 0 10px #ffe0e7;
  border-radius: 26px;
  font-size: 12px;
  color: #ffffff;
}

.saved-filters-list .button.is_search-saved-filters .button__inner {
  position: relative;
  display: inline-block;
  padding-left: 15px;
  line-height: 1;
}

.saved-filters-list .button.is_search-saved-filters .button__inner::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  display: block;
  content: '';
  width: 12px;
  height: 12px;
  background: url(https://assets.angel-live.com/common/images/search_icon_search.png) 0 0 no-repeat;
}

.saved-filters-action {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  column-gap: 6px;
  width: 46px;
  margin: 0 10px;
}

.saved-filters-action .button {
  display: block;
  width: 20px;
  height: 20px;
  background: url(https://assets.angel-live.com/common/images/search_icon_setting.png) 2px 2px no-repeat;
  background-size: 16px;
}

.saved-filters-action .button.is_delete-saved-filters {
  background-image: url(https://assets.angel-live.com/common/images/search_icon_delete.png);
}



/***** フォーム *****/
.form {
  width: 840px;
  margin: 0 auto;
}

.form-item {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.form-item.is_genre {
  align-items: flex-start;
}

.form-item-title {
  box-sizing: border-box;
  width: 100px;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}

/* input-checkboxの時 */
.form-item.is_input-checkbox .form-item-title { 
  cursor: pointer;
}

.form-item-data {
  width: 680px;
}

.form-item.is_select.is_notice-frequency {
  display: none;
}

.input-text {
  box-sizing: border-box;
  height: 40px;
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  padding-left: 12px;
  font-size: 14px;
  letter-spacing: 0.04em;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.form-item.is_handlename .input-text,
.form-item.is_freeword .input-text {
  width: 400px;
}


.input-text::placeholder {
  color: #cccccc;
}

.form-select {
  box-sizing: border-box;
  height: 40px;
  padding-left: 12px;
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  font-size: 14px;
  letter-spacing: 0.04em;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.input-text:focus,
.form-select:focus {
  outline: none;
  border: 1px solid #e97996;
  box-shadow: 0 0 8px rgba(233, 121, 150, .3);
  color: #444444;
}

.input-checkbox[type="checkbox"] {
  display: block;
  width: 24px;
  height: 24px;
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  cursor: pointer;
}



/*** toggle たぶんダイアログ内だけ ***/
.input-toggle-wrap {
  position: relative;
  width: 66px;
  height: 26px;
}

.input-toggle {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  opacity: 0;
  cursor: pointer;
}

.input-toggle-label {
  width: 66px;
  height: 26px;
  background: #aaa;
  position: relative;
  display: inline-block;
  border-radius: 40px;
  transition: 0.2s;
  box-sizing: border-box;
}

.input-toggle-label:after {
  position: absolute;
  top: 50%;
  left: 3px;
  transform: translateY(-50%);
  z-index: 2;
  content: '';
  width: 20px;
  height: 20px;
  background: #ffffff;
  border-radius: 100%;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  transition: 0.2s;
}

.input-toggle-label::before {
  position: absolute;
  top: 50%;
  left: 27px;
  transform: translateY(-50%);
  content: "OFF";
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.05em;
  color: #ffffff;
}

.input-toggle:checked + .input-toggle-label {
  background-color: #ee8aa4;
}

.input-toggle:checked + .input-toggle-label:after {
  left: 43px;
}

.input-toggle:checked + .input-toggle-label::before {
  left: 10px;
  content: "ON";
}


/*** 条件を追加 ***/
.primary .primary__inner .form p.button.is_add-condition {
  display: flex;
  align-items: center;
  column-gap: 8px;
  width: fit-content;
  margin: 0 auto;
  padding: 8px 28px;
  border: 1px solid #ffd4de;
  border-radius: 32px;
  box-shadow: 0 0 15px #ffe0e7;
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
  text-align: center;
  color: #e97996;
  cursor: pointer;
}

.button.is_add-condition .button__inner {
  position: relative;
  display: block;
  width: 14px;
  height: 14px;
}

.button.is_add-condition .button__inner::before,
.button.is_add-condition .button__inner::after {
  position: absolute;
  inset: 0;
  place-self: center;
  content: '';
  width: 2px;
  height: 11px;
  background: #e97996;
  border-radius: 5px;
}

.button.is_add-condition .button__inner::after {
  transform: rotate(-90deg);
}


/*** メインの検索ボタン ***/
.button.is_search {
  width: 286px;
  margin: 40px auto;
  padding: 17px;
  background: linear-gradient(to right, #ff88a7 0%, #fa87cc 100%);
  border-radius: 50px;
  box-shadow: 0 0 10px #ffe0e7;
  font-size: 16px;
  color: #ffffff;
}



/***** カテゴリ一覧 *****/
.list-filter-category {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.list-filter-category li a {
  display: block;
  padding: 6px 10px;
  background-color: #ffffff;
  border: 1px solid #ffd4de;
  border-radius: 26px;
  font-size: 12px;
  line-height: 1;
  font-weight: bold;
  text-decoration: none;
  color: #e97996;
  transition: background .3s ease, color .3s ease;
}

.list-filter-category li a.select {
  background: linear-gradient(to right, #ff88a7, #f487cc);
  border-color: transparent;
  color: #ffffff;
}

/*** 追加条件 ***/
.additional-condition {
  display: none;
}



/***** 検索結果 *****/
.search-data {
  margin-bottom: 20px;
  padding: 10px 20px;
  background: #fce4eb;
  border-radius: 16px;
  font-size: 14px;
}

.search-data .search-data-result {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.primary p.search-data-result__text {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.search-data-result__num {
  font-size: 16px;
  font-weight: bold;
  color: #e97996;
  margin-right: 3px;
}

.search-data-result a {
  position: relative;
  display: block;
  padding: 6px 24px 6px 11px;
  background: linear-gradient(to right, #ff88a7, #f487cc);
  border: 1px solid transparent;
  border-radius: 26px;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
  text-decoration: none;
  color: #ffffff;
  white-space: nowrap;
}

.search-data-result a::before, .search-data-result a::after {
  position: absolute;
  top: 12px;
  right: 12px;
  content: '';
  width: 2px;
  height: 11px;
  background-color: #ffffff;
  border-radius: 5px;
}

.search-data-result a::before {
  transform: translate(-50%,-50%) rotate(45deg);
}

.search-data-result a::after {
  transform: translate(-50%,-50%) rotate(-45deg);
}

.search-data-result a.searchResets {
  margin-left: 8px;
  background: transparent;
  border-color: #999999;
  font-weight: initial;
  color: #444444;
}

.search-data-result a.searchResets::before, .search-data-result a.searchResets::after {
  background-color: #444444;
}


/***** 検索条件を保存する *****/
.search-data-wrap .button.is_save {
  width: 250px;
  margin: 20px auto 10px;
  padding: 17px;
  background-color: #ffffff;
  box-shadow: 0 2px 10px 0 rgba(233, 121, 150, .15);
  border-radius: 50px;
  font-size: 16px;
  color: #e97996;
}



/***** ページャー *****/
.pager {
  display: flex;
  column-gap: 10px;
  justify-content: center;
  margin-bottom: 20px;
}

.pager-item {
  box-sizing: border-box;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  color: #e97996;
}

.pager-item.is_button-square {
  width: 42px;
  height: 42px;
  background: #ffffff;
  border: 1px solid #ffdede;
  border-radius: 42px;
  box-shadow: 0 3px 5px #ffe1ea;
  font-size: 12px;
  cursor: pointer;
}

.pager-item.is_button-square.is_current {
  background: linear-gradient(to right, #ff88a7, #f487cc);
  border-color: transparent;
  color: #ffffff;
  cursor: auto;
  pointer-events: none;
}

.pager-item .pager-item__inner {
  display: block;
  line-height: 40px;
  text-decoration: none;
  color: inherit;
}

.pager-item.is_prev .pager-item__inner,
.pager-item.is_next .pager-item__inner {
  position: relative;
  cursor: pointer;
}

.pager-item.is_prev .pager-item__inner::before,
.pager-item.is_prev .pager-item__inner::after,
.pager-item.is_next .pager-item__inner::before,
.pager-item.is_next .pager-item__inner::after {
  position: absolute;
  top: 18px;
  left: 50%;
  content: '';
  width: 2px;
  height: 10px;
  background: #e97996;
  border-radius: 5px;
}

.pager-item.is_prev .pager-item__inner::before {
  transform: translate(-50%,-50%) rotate(45deg);
}

.pager-item.is_prev .pager-item__inner::after {
  top: 24px;
  transform: translate(-50%,-50%) rotate(-45deg);
}

.pager-item.is_next .pager-item__inner::before {
  transform: translate(-50%,-50%) rotate(-45deg);
}

.pager-item.is_next .pager-item__inner::after {
  top: 24px;
  transform: translate(-50%,-50%) rotate(45deg);
}



/***** 女性一覧 *****/
.girl-line {
  margin: 12px 0;
}

.girl-line__item {
  margin: 14px 7px;
}

.girl-comment {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

/***** フリーワード検索 *****/
.freeword-highlight {
  padding: 2px 3px;
  background: #46BDE8;
  color: #fff;
}



/***** ダイアログ *****/
.dialog {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  display: none;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, .5);
}

.dialog.is_error {
  z-index: 200;
}

.dialog.is_error .dialog-description,
.dialog.is_coupon .dialog-description {
  font-size: 13px;
}

.dialog__inner {
  position: fixed;
  inset: 0;
  place-self: center;
  z-index: 110;
  box-sizing: border-box;
  width: 620px;
  padding: 40px 20px;
  background-color: #ffffff;
  border-radius: 20px;
}

.dialog-title,
.dialog-description {
  text-align: center;
}

.primary p.dialog-title {
  font-size: 18px;
  font-weight: bold;
  color: #ee8aa4;
}

.primary p.dialog-description {
  margin-top: 5px;
  font-size: 12px;
}

.dialog-data {
  margin-top: 10px;
}


/*** form系 ***/
.dialog .form-item {
  justify-content: space-between;
}

.dialog .form-item-title {
  width: 120px;
}

.dialog .form-item.is_search-condition-name .input-text {
  width: 100%;
  padding-right: 60px;
  text-overflow: ellipsis;
}

.dialog .form-item-data {
  display: flex;
  justify-content: flex-end;
  position: relative;
  width: 440px;
}

.primary p.notice-description {
  margin: 5px 0 20px;
  text-align: center;
}


/*** 保存済み検索条件 保存上限エラーでの表示 ***/
.dialog .saved-filters-list {
  margin: 0 0 20px;
  padding: 10px;
}

.dialog .saved-filters-list-title {
  font-size: 14px;
}

.dialog .saved-filters-list-data {
  display: block;
  width: 72px;
  margin: 10px 12px 10px 10px;
}

.dialog .button.is_delete-saved-filters {
  box-sizing: border-box;
  width: 100%;
  padding: 7px 0;
  background: linear-gradient(to right, #ff88a7, #f487cc);
  box-shadow: 0 0 10px #ffe0e7;
  border-radius: 26px;
  font-size: 12px;
  line-height: 1;
  color: #ffffff;
}

/*** button系 ***/
/* 単体系 */
.dialog .button.is_save,
.dialog .button.is_ok {
  width: 286px;
  margin: 0 auto;
  padding: 17px;
  background: linear-gradient(to right, #ff88a7 0%, #fa87cc 100%);
  border-radius: 50px;
  box-shadow: 0 0 10px #ffe0e7;
  font-size: 16px;
  color: #ffffff;
}

.dialog .button.is_cancel {
  box-sizing: border-box;
  width: 100px;
  margin: 0 auto;
  padding: 8px;
  background: #ffffff;
  border: 1px solid #ffd4de;
  border-radius: 30px;
  box-shadow: 0 0 15px #ffe0e7;
  font-size: 12px;
  color: #e97996;
}

.dialog .button.is_clear {
  position: absolute;
  top: 50%;
  right: 5px;
  transform: translateY(-50%);
  box-sizing: border-box;
  padding: 8px 12px;
  background: #ffffff;
  border: 1px solid #999999;
  border-radius: 30px;
  font-size: 12px;
  color: #444444;
}

/* OK or キャンセルの時 */
.dialog .button-wrap.is_confirm,
.dialog .button-wrap.is_coupon {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  row-gap: 20px;
}


/* ダイアログ右上閉じるボタン style_ts_top.cssから*/
.dialog-close {
  position: absolute;
  top: -17px;
  right: -17px;
  width: 30px;
  height: 30px;
  background-color: #e97996;
  border-radius: 20px;
  border: 2px solid #fff;
  cursor: pointer;
}

.dialog-close__icon::before,
.dialog-close__icon::after {
  position: absolute;
  inset: 0;
  place-self: center;
  content: '';
  width: 3px;
  height: 18px;
  background: #ffffff;
  border-radius: 5px;
}

.dialog-close__icon::before {
  transform: rotate(45deg);
}

.dialog-close__icon::after {
  transform: rotate(-45deg);
}



/***** ローディング画像 *****/
.search-loading {
  padding: 20px;
}

.search-loading__image {
  display: block;
  margin: 0 auto;
  width: 90px;
}



/***** AI 検索結果（suggestions）表示 *****/
.ai-suggestion {
  padding: 20px;
  background: linear-gradient(90deg, #ff7b9e 0%, #ff73d0 100%);
  border-radius: 20px;
}

.ai-suggestion-title {
  position: relative;
  margin-bottom: 20px;
  padding-left: 34px;
  font-size: 22px;
  font-weight: bold;
  line-height: 1;
  color: #ffffff;
}

.ai-suggestion-title:before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: '';
  width: 26px;
  height: 26px;
  background: url(https://assets.angel-live.com/common/img/icon_tenchan.svg) no-repeat center / contain;
}

.ai-suggestion .girl-line {
  margin: 0;
}

.ai-suggestion .girl-line__item {
  height: 210px;
  margin-top: 0;
  margin-bottom: 0;
}

.ai-suggestion .girl-status-detail {
  box-shadow: none;
}