@charset "utf-8";
/* 팝업창 모음 */

/* 로그인 */

#pop_login .modal-content {
  border: 0;
}

.login_wrap {
  /**height: 416px;**/
  /*width: 422px;*/

  /* height: 530px; */
  background-color: #fff;
}

.login_wrap.login_wrap_ext {
  height: auto;
  background-color: #fff;
}

.login_wrap.login_wrap_ext > div:nth-child(1) {
  margin-bottom: 0;
}

.login_txt,
.login_txt a {
  color: #707070;
  font-size: 13px;
}

.pop_tit {
  padding: 16px 20px 14px 30px;
  display: flex;
  font-size: 20px;
  font-weight: 500;
  color: #000;
  justify-content: space-between;
  border-bottom: 2px solid #f84914;
}

.login_wrap_ext .login_nonmember_buttons {
  display: flex;
  margin-bottom: 20px;
}

a.login_button,
a.nonmember_button {
  padding: 15px 0;
  flex-grow: 1;
  background-color: #bfbfbf;
  text-align: center;
  cursor: pointer;
}

a.login_button,
a.nonmember_button {
  color: #fff !important;
}

a.login_button.active,
a.nonmember_button.active {
  color: #f84914 !important;
  background-color: #fff;
  border-bottom: 2px solid #f84914;
  border-left: 2px solid #f84914;
  border-right: 2px solid #f84914;
}

.login_button.active:hover a,
.nonmember_button.active:hover a {
  color: #f84914;
}

.pop_tit img {
  cursor: pointer;
}

.login_wrap .login_info {
  font-size: 17px !important;
  color: #999 !important;
  text-align: center;
}

.login_wrap > div:nth-child(1) {
  margin-bottom: 30px;
}

.login_wrap .login_input {
  margin: 25px 30px;
}

.login_wrap .login_input > .input {
  margin-bottom: 7px;
}

.login_wrap .login_input .mt_12 > label {
  margin-top: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.login_wrap .login_input input[type='text'],
.login_wrap .login_input input[type='password'] {
  width: 100%;
  outline: none;
  border: 1px solid #ccc;
  color: #838383;
  padding-left: 10px;
  font-size: 16px;
  font-weight: 400;
}

.login_wrap .login_input > .input a.login {
  display: inline-block;
  padding: 15px 6px;
  color: #fff;
  font-size: 20px;
  font-weight: 500;
  background-color: #f84914;
  width: 100%;
  text-decoration: none;
  text-align: center;
}

.login_wrap .login_input > .div .input[checkbox] {
  display: inline-block;
  padding: 10px 15px;
  color: #fff;
  background-color: #f84914;
  width: 100%;
  text-decoration: none;
  text-align: center;
}

.login_wrap .sns_login_items {
  border-top: 1px solid #e3e3e3;
  padding-top: 26px;
  padding-bottom: 20px;
  margin-top: 25px;
  display: flex;
  justify-content: center;
  border-bottom: 1px solid #e3e3e3;
}

.login_wrap .sns_login_title {
  position: absolute;
  left: 38%;
  top: 55%;
  color: #707070;
  font-size: 16px;
  background-color: #ffffff;
  padding-left: 10px;
  padding-right: 10px;
}

html[lang='en'] .login_wrap .sns_login_title {
  left: 33%;
}

.login_wrap .sns_login .sns_txt {
  padding-bottom: 20px;
  display: flex;
  justify-content: center;
  color: #777777;
  font-size: 13px;
  padding: 6px 20px 0px 20px;
}

.login_wrap .join_area {
  padding-top: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
}

.login_wrap .join_txt {
  color: #777777;
  font-size: 12px;
}

.login_wrap .join_btn {
  font-size: 13px;
  color: #fff;
  padding: 10px;
  background-color: #f84914;
}

.login_wrap .sns_img_pad {
  padding-left: 10px;
  padding-right: 10px;
}

.login_wrap .link_info {
  border-top: 1px solid #ccc;
  padding-top: 30px;
  margin-top: 30px;
  display: flex;
}

.login_wrap .link_info a {
  text-decoration: none;
  display: inline-block;
  flex: 1;
  text-align: center;
  color: #545454;
  font-size: 15px;
}

/* 공유하기 */

.share_wrap {
  /* height: 454px; */
  height: 210px;
  width: 570px;
  background-color: #fff;
}

.share_wrap .tit_info {
  font-size: 17px !important;
  color: #000 !important;
  font-weight: 500;
  padding-left: 5px;
  margin-bottom: 10px;
}

.share_wrap .share_box01 {
  padding: 30px;
}

.share_wrap .share_box02 {
  padding: 0 30px;
}

.share_wrap .share_input {
  background-color: #f4f4f4;
  padding: 10px 25px;
  color: #666;
}

.share_wrap .share_input input {
  width: 400px;
  outline: none;
  border: 0;
  background: #f4f4f4;
  padding-left: 10px;
  font-size: 16px;
  font-weight: 400;
}

.share_wrap .share_input > .input a.share {
  display: inline-block;
  padding: 15px 6px;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  background-color: #f84914;
  width: 300px;
  text-decoration: none;
  text-align: center;
  margin-left: 148px;
}

.input_row {
  display: flex;
  justify-content: space-between;
}

.input_row > label {
  flex-basis: 150px;
}

.input_row > .copy {
  font-weight: 500;
  color: #f84914;
  padding-top: 10px;
}

/* 내 서류가방에 담기 */

.pick_wrap {
  background-color: #fff;
}

.pick_wrap .txt_info {
  font-size: 15px;
  color: #444;
  font-weight: 400;
  word-break: keep-all;
  text-align: center;
  line-height: 1.7em;
  padding: 30px 0;
}

.pick_wrap .share_input {
  text-align: center;
}

.pick_wrap .share_input > .input a.pick {
  display: inline-block;
  padding: 15px 0px;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  background-color: #f84914;
  width: 300px;
  text-decoration: none;
  text-align: center;
  margin-bottom: 7px;
}

.pick_wrap .share_input > .input a.not_now {
  display: inline-block;
  padding: 15px 0px;
  color: #666;
  font-size: 16px;
  font-weight: 500;
  background-color: #fff;
  width: 300px;
  text-decoration: none;
  text-align: center;
  border: 2px solid #999;
  box-sizing: border-box;
}

/*로그인_체크박스*/

.label-check {
  display: block;
  position: relative;
  padding: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-size: 15px;
  color: #545454;
  font-weight: 400;
}

.label-check input[type='checkbox'] {
  display: none;
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.mark-check {
  display: inline-block;
  height: 20px;
  width: 20px;
  background-color: #fff;
  border: 1px solid #f84914;
  vertical-align: middle;
}

.mark-check.mark-check-after {
  float: left;
  position: relative;
}

.mark-check.white {
  border: 1px solid #f84914;
  background-color: #fff;
}

.label-check input[type='checkbox']:checked ~ .mark-check {
  background-color: #ff0046;
}

.label-check input[type='checkbox']:checked ~ .mark-check.white {
  background-color: #fff;
}

.mark-check:after {
  content: '';
  position: absolute;
  display: none;
}

.label-check input[type='checkbox']:checked ~ .mark-check:after {
  display: block;
}

.label-check .mark-check:after {
  left: 6px;
  top: 2px;
  width: 6px;
  height: 9px;
  border: solid #f84914;
  border-width: 0px 1px 1px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.label-check .mark-check.white:after {
  left: 6px;
  top: 2px;
  width: 6px;
  height: 9px;
  border: solid #f84914;
  border-width: 0px 1px 1px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* 로그인 전 팝업 */
.layer_wrap_before {
  z-index: 5;
  position: absolute;
  width: 220px;
  background-color: #fff;
  border: 1px solid #ddd;
  padding: 10px 15px;
  box-sizing: border-box;
}

.log_cate li {
  font-size: 14px;
  color: #333;
  font-weight: 500;
  line-height: 1.4em;
  float: none;
}

.log_info {
  padding-left: 10px;
  padding-top: 15px;
  font-size: 14px;
  color: #666;
}

/* 로그인 후 팝업 */
.layer_wrap_after {
  z-index: 5;
  position: absolute;
  max-width: 264px;
  background-color: #fff;
  border: 1px solid #ddd;
  padding: 0px 20px;
  box-sizing: border-box;
  width: 100%;
}

.layer_box {
  margin-right: -20px;
  margin-left: -20px;
  padding: 15px 20px;
}

.layer_box:not(:first-child) {
  border-top: 1px solid #ddd;
}

.layer_wrap_after .layer_box .layer_box_item {
  padding: 3px 0;
}

.layer_wrap_after .layer_box .layer_box_item:hover {
  background-color: #f1f1f1;
}

.s_tit,
.s_tit > a {
  font-size: 15px;
  font-weight: 500;
  color: #f84914 !important;
  margin-bottom: 7px;
}

.prd_info,
.sell_info {
  padding-left: 10px;
}

.prd_info .prd_name {
  font-size: 14px;
  font-weight: 500;
  color: #000;
  line-height: 1.4em;
}

.prd_info .sel_name {
  font-size: 13px;
  font-weight: 400;
  color: #666;
  line-height: 1.5em;
}

.seller {
  font-size: 14px;
  font-weight: 500;
  color: #000;
  line-height: 1.4em;
}

.cate_info {
  font-size: 14px;
  font-weight: 400;
  color: #666;
  line-height: 1.5em;
}

.my_pick,
.my_pick a {
  font-size: 14px;
  font-weight: 500;
  color: #f84914;
  line-height: 1.5em;
  text-decoration: none;
  text-align: right;
}

.b_bt {
  border-bottom: 1px solid #ddd;
}

/* 추가정보 입력하기 */
.add_info_wrap {
  height: auto;
  /* width: 422px; */
  background-color: #fff;
}

.add_info_wrap .add_info {
  font-size: 17px !important;
  color: #999 !important;
  text-align: center;
}

.add_info_wrap > div:nth-child(1) {
  margin-bottom: 30px;
}

.add_info_wrap .add_info_input {
  margin: 25px 30px;
}

.add_info_wrap .add_info_input > .input {
  margin-bottom: 7px;
}

.add_info_wrap .add_info_input input[type='text'],
.add_info_wrap .add_info_input input[type='password'] {
  width: 98%;
  outline: none;
  border: 1px solid #ccc;
  color: #838383;
  padding-left: 10px;
  font-size: 16px;
  font-weight: 400;
}

.add_info_wrap .add_info_input > .input a.add_info {
  display: inline-block;
  padding: 15px 6px;
  color: #fff;
  font-size: 20px;
  font-weight: 500;
  background-color: #f84914;
  width: 98%;
  text-decoration: none;
  text-align: center;
}

.add_info_wrap .add_info_input > .div .input[checkbox] {
  display: inline-block;
  padding: 10px 15px;
  color: #fff;
  background-color: #f84914;
  width: 100%;
  text-decoration: none;
  text-align: center;
}

.add_info_wrap .button-container {
  border-top: 1px solid #e3e3e3;
  padding-top: 30px;
  margin-top: 25px;
  display: flex;
  justify-content: space-between;
}

/* .add_info_wrap .button-container .reg_add_info {
  display: inline-block;
  padding: 15px 0px;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  background-color: #f84914;
  width: 45%;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
}

.add_info_wrap .button-container .cancel {
  display: inline-block;
  padding: 15px 0px;
  color: #000;
  font-size: 16px;
  font-weight: 500;
  border: 2px solid #000;
  width: 45%;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
} */

/* 아이디 찾기 */
.idpw_search_wrap {
  /* height: 454px; */
  height: 245px;
  width: 400px;
  /*background-color: #fff; */
}

.idpw_search_wrap .tit_info {
  font-size: 17px !important;
  color: #000 !important;
  font-weight: 500;
  padding-left: 5px;
  margin-bottom: 10px;
}

.idpw_search_wrap .idpw_box01 {
  padding: 20px 15px;
}

.idpw_search_wrap .idpw_input {
  background-color: #f4f4f4;
  margin: 0 0 3px 5px;
  padding: 10px 0;
  color: #666;
}

.idpw_search_wrap .input_row {
  margin: 0 0 0 10px;
  padding: 0;
  color: #666;
}

.idpw_search_wrap a.idpw_home {
  float: left;
  display: inline-block;
  padding: 15px 0px;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  background-color: #f84914;
  width: 150px;
  text-decoration: none;
  text-align: center;
  margin: 0 30px 7px 0;
}

.idpw_search_wrap a.idpw_close {
  float: right;
  display: inline-block;
  padding: 13px 0px;
  color: #666;
  font-size: 16px;
  font-weight: 500;
  background-color: #fff;
  width: 150px;
  text-decoration: none;
  text-align: center;
  border: 2px solid #999;
  box-sizing: border-box;
}

.non_member_form {
  padding: 0 40px 40px 40px;
}

.non_member_form > .non_member_info {
  display: block;
  outline: none;
  border: 1px solid #ccc;
  color: #838383;
  padding-left: 10px;
  font-size: 16px;
  font-weight: 400;
  width: calc(100% - 10px);
  margin-bottom: 5px;
}

button.catalog_download_button {
  cursor: pointer;
  display: block;
  width: 100%;
  height: 50px;
  background-color: #f84914;
  border: 0;
  margin-top: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.non_member_form .error {
  margin-bottom: 5px;
}

.text_required {
  color: #f00 !important;
}

.newsletter-email {
  width: 100%;
  padding-left: 5px;
  padding-right: 5px;
  text-align: center;
}

.d-block {
  display: block;
}

.mb-2 {
  margin-bottom: 0.7rem;
}

#pop_newsletter label.error {
  margin-top: 3px;
}

#linkonNewsletter {
  position: relative;
  height: 150px;
}

#linkonNewsletter button {
  margin-top: 15px;
  position: absolute;
  bottom: 0;
}