@charset "utf-8";

/* shop introduction */
.shop_intro { display:flex; width:100%; max-width:1920px; margin:0 auto; align-items:stretch; }
.shop_intro_copy { display:flex; width:50%; min-width:0; padding:60px 40px 60px max(20px,calc((100% - 1440px)/2)); flex-direction:column; align-items:flex-start; justify-content:center; }
.shop_intro_logo { position:relative; width:100%; max-width:140px; aspect-ratio:1; overflow:hidden; }
.shop_intro_logo img { position:absolute; top:-5.69%; left:-5.3%; display:block; width:118.07%; height:auto; }
.shop_intro_title { margin-top:24px; color:#111; font-family:"Manuale", "Pretendard", serif; font-size:60px; font-weight:500; line-height:70px; }
.shop_intro_title_line { display:block; color:inherit; font:inherit; }
.shop_intro_tagline { margin-top:24px; color:#111; font-size:24px; font-weight:400; line-height:1.6; }
.shop_intro_tagline span { color:inherit; font:inherit; }
.shop_intro_description { margin-top:40px; color:#111; font-size:18px; font-weight:400; line-height:1.6; }
.shop_intro_description span { display:block; color:inherit; font:inherit; }
.shop_intro_visual { display:flex; width:50%; aspect-ratio:960/796; overflow:hidden; }
.shop_intro_visual img { display:block; width:100%; height:100%; aspect-ratio:960/796; object-fit:cover; object-position:center; }

/* common gallery: STYLE / NOTICE */
.style_gallery { width:calc(100% - 40px); max-width:1440px; margin:0 auto; padding:80px 0 120px; }
.sub_page_title { color:#111; font-family:"Manuale", "Pretendard", serif; font-size:40px; font-weight:400; line-height:57px; text-align:center; }
.style_gallery_tools { display:flex; margin-top:80px; align-items:center; justify-content:flex-end; gap:9px; }
.style_gallery_search { display:flex; width:100%; max-width:369px; gap:9px; }
.style_search_select { position:relative; width:100%; max-width:100px; flex-shrink:0; }
.style_search_select::after { position:absolute; top:50%; right:12px; width:16px; height:16px; background:url(/sheephair/img/svg/icon_select.svg) center/contain no-repeat; content:""; transform:translateY(-50%) rotate(90deg); pointer-events:none; }
.style_search_select select { width:100%; padding:9px 30px 9px 15px; border:1px solid #e0e0e0; border-radius:0; color:#111; background:#fff; font-size:16px; line-height:20px; appearance:none; }
.style_search_field { display:flex; width:100%; min-width:0; border:1px solid #e0e0e0; background:#fff; }
.style_search_field input { width:100%; min-width:0; padding:9px 0 9px 15px; color:#111; font-size:16px; line-height:20px; }
.style_search_field input::placeholder { color:#999; opacity:1; }
.style_search_field input::-webkit-search-cancel-button { appearance:none; }
.style_search_field button { display:flex; width:40px; flex-shrink:0; align-items:center; justify-content:center; }
.icon_style_search { width:24px; height:24px; background:url(/sheephair/img/svg/icon_search.svg) center/contain no-repeat; }
.style_write_button { display:flex; width:100%; max-width:100px; padding:10px 15px; align-items:center; justify-content:center; color:#fff; background:#ff2684; font-size:16px; line-height:20px; }
.style_gallery_list { display:flex; margin-top:40px; flex-wrap:wrap; gap:60px 24px; }
.style_gallery_item { width:calc((100% - 48px)/3); min-width:0; }
.style_gallery_link { display:block; color:#111; }
.style_gallery_image { display:flex; width:100%; aspect-ratio:464/280; align-items:center; justify-content:center; overflow:hidden; background:#f5e5e4; }
.style_gallery_image img { display:block; width:100%; height:100%; object-fit:cover; }
.style_gallery_placeholder { display:flex; width:100%; height:100%; align-items:center; justify-content:center; flex-direction:column; gap:9px; }
.icon_style_camera { width:80px; height:80px; background:url(/sheephair/img/svg/icon_camera.svg) center/contain no-repeat; }
.style_gallery_placeholder span { color:#ff2684; font-size:16px; line-height:20px; }
.style_gallery_copy { margin-top:15px; }
.style_gallery_copy h2 { overflow:hidden; color:#111; font-size:16px; font-weight:400; line-height:1.6; text-overflow:ellipsis; white-space:nowrap; }
.style_gallery_copy time { display:block; margin-top:9px; color:#999; font-size:13px; line-height:1.6; }
.style_gallery_empty { margin-top:40px; padding:90px 20px; color:#999; font-size:16px; text-align:center; }
.style_gallery_pagination { display:flex; margin-top:60px; justify-content:center; }
.style_gallery_pagination ol { display:flex; align-items:center; gap:24px; }
.style_gallery_pagination a { display:flex; height:30px; align-items:center; justify-content:center; color:#999; font-size:16px; line-height:1; }
.style_gallery_pagination a.active { color:#ff2684; }
.style_gallery_pagination .pagination_arrow { width:15px; margin:0 9px; background:url(/sheephair/img/svg/icon_page_prev.svg) center/8px auto no-repeat; font-size:0; }
.style_gallery_pagination .pagination_next { background-image:url(/sheephair/img/svg/icon_page_next.svg); transform:rotate(180deg); }
.style_gallery_pagination .is_disabled { pointer-events:none; }

/* price / length guide */
.price_layout { display:flex; width:calc(100% - 40px); max-width:1440px; margin:0 auto; padding:120px 0; align-items:flex-start; gap:80px; }
.price_layout .sub_page_title { text-align:left; }
.price_menu { width:100%; max-width:492px; min-width:0; flex:1; }
.price_groups { display:flex; margin-top:40px; flex-direction:column; gap:30px; }
.price_group { display:flex; width:100%; align-items:flex-start; }
.price_group h2 { width:21.545%; flex-shrink:0; color:#ff2684; font-size:18px; font-weight:600; line-height:1.6; }
.price_items { display:flex; min-width:0; flex:1; flex-direction:column; gap:9px; }
.price_row { display:flex; width:100%; align-items:center; gap:9px; color:#111; font-size:18px; font-weight:400; line-height:1.6; }
.price_row dt { display:flex; min-width:0; flex:1; align-items:center; gap:9px; color:inherit; white-space:nowrap; }
.price_row dt::after { display:block; height:1px; flex:1; background-image:var(--price_line); background-position:left center; background-repeat:repeat-x; content:""; transform:scaleX(var(--price_line_progress,1)); transform-origin:left center; }
.price_row dd { flex-shrink:0; color:inherit; text-align:right; white-space:nowrap; }
.price_line_cut { --price_line:url(/sheephair/img/svg/price_line_02420.svg); }
.price_line_junior_cut { --price_line:url(/sheephair/img/svg/price_line_1e853.svg); }
.price_line_perm { --price_line:url(/sheephair/img/svg/price_line_39b53.svg); }
.price_line_junior_perm { --price_line:url(/sheephair/img/svg/price_line_4312d.svg); }
.price_line_men_perm { --price_line:url(/sheephair/img/svg/price_line_d673d.svg); }
.price_line_magic { --price_line:url(/sheephair/img/svg/price_line_7d7df.svg); }
.price_line_magic_setting { --price_line:url(/sheephair/img/svg/price_line_bf10a.svg); }
.price_line_aveda { --price_line:url(/sheephair/img/svg/price_line_16d63.svg); }
.price_line_aveda_root { --price_line:url(/sheephair/img/svg/price_line_e80c4.svg); }
.price_line_root { --price_line:url(/sheephair/img/svg/price_line_e7838.svg); }
.price_line_trend { --price_line:url(/sheephair/img/svg/price_line_2bb60.svg); }
.length_guide { width:100%; min-width:0; flex:1.765; }
.length_guide_list { display:flex; margin-top:40px; flex-wrap:wrap; gap:24px; }
.length_guide_card {display:flex;width:calc((100% - 24px)/2);padding:25px 30px;aspect-ratio:422/260;align-items:center;gap:min(40px,12%);background:#f5e5e4;}
.length_guide_card:first-child, .length_guide_card:last-child { background:#f5e4e9; }
.length_guide_art { display:flex; width:50%; max-width:181px; aspect-ratio:181/202; flex-shrink:0; align-items:center; }
.length_guide_crop { position:relative; width:100%; aspect-ratio:1; overflow:hidden; }
.length_guide_crop img { position:absolute; top:-10.03%; left:-84.28%; display:block; width:392.64%; max-width:none; height:auto; }
.length_medium .length_guide_crop img { top:-115.33%; }
.length_long .length_guide_crop { aspect-ratio:181/194; }
.length_long .length_guide_crop img { top:-203.3%; }
.length_long_long .length_guide_crop { aspect-ratio:181/202; }
.length_long_long .length_guide_crop img { top:-292.07%; }
.length_guide_copy { min-width:0; flex:1; color:#111; font-size:18px; line-height:1.6; }
.length_guide_copy h3 { color:#ff2684; font-size:inherit; font-weight:600; }
.length_guide_copy p { margin-top:3px; color:inherit; font-size:inherit; font-weight:400; }

/* reservation */
.reservation_section { padding:120px 20px; background:linear-gradient(to bottom,#fff 50%,#fee2ea 100%); }
.reservation_panel { width:100%; max-width:720px; margin:0 auto; padding:40px; background:#fff; box-shadow:4px 8px 20px rgba(221,129,169,.16); }
.reservation_panel .sub_page_title { text-align:left; }
.hair_reservation_form { margin-top:40px; }
.hair_fields { display:flex; flex-wrap:wrap; gap:15px; }
.hair_field { display:flex; width:calc((100% - 15px)/2); min-width:0; flex-direction:column; gap:5px; }
.hair_field > span, .hair_captcha > span { color:#111; font-size:16px; font-weight:400; line-height:1.6; }
.hair_reservation_form em { color:#ff2684; font-style:normal; }
.hair_field input, .hair_field textarea, .hair_captcha .inquiry_captcha_input { width:100%; min-width:0; padding:9px 12px; border:1px solid #e0e0e0; color:#111; background:#fff; font-size:16px; line-height:20px; }
.hair_message_field { width:100%; }
.hair_field textarea { height:160px; resize:vertical; }
.hair_security { display:flex; margin-top:15px; align-items:flex-start; flex-wrap:wrap; column-gap:9px; }
.hair_password_field { width:calc((100% - 170px)/2); }
.hair_captcha { display:flex; min-width:0; flex:1; flex-direction:column; gap:5px; }
.hair_captcha > span { display:block; margin-left:calc(min(155px,55%) + 9px); }
.hair_captcha .inquiry_captcha_widget { display:flex; min-width:0; align-items:center; gap:9px; }
.hair_captcha .inquiry_captcha_legacy { display:flex; width:55%; max-width:155px; flex-shrink:0; align-items:center; gap:5px; }
.hair_captcha [data-captcha-image] { display:block; width:calc(100% - 45px); min-width:0; height:40px; border:1px solid #dedede; background:#f3f5f8; object-fit:contain; font-size:0; }
.hair_captcha [data-captcha-image]:not([src]) { visibility:hidden; }
.hair_captcha .inquiry_captcha_refresh { display:flex; width:40px; height:40px; flex-shrink:0; align-items:center; justify-content:center; background:#ff2684; }
.hair_captcha .icon_refresh { width:24px; height:24px; background:url(/img/svg/icon_reservation_refresh.svg) center/20px auto no-repeat; }
.hair_captcha .inquiry_captcha_input { flex:1; }
.hair_captcha .inquiry_captcha_input::placeholder { color:transparent; }
.hair_password_rules { display:flex; width:100%; margin-top:12px; flex-direction:column; gap:5px; }
.hair_password_rules p { display:flex; align-items:center; gap:5px; color:#a6a6a6; font-size:13px; font-weight:500; line-height:16px; }
.hair_password_rules .icon { width:16px; height:16px; flex-shrink:0; background-position:center; background-size:contain; background-repeat:no-repeat; }
.icon_password_types { background-image:url(/img/svg/icon_password_types.svg); }
.icon_password_length { background-image:url(/img/svg/icon_password_length.svg); }
.hair_password_rules .valid { color:#ff2684; }
.hair_privacy { display:flex; margin-top:15px; align-items:center; flex-wrap:wrap; gap:5px; }
.hair_privacy label { display:flex; min-width:0; align-items:center; gap:12px; cursor:pointer; }
.hair_privacy label span { color:#111; font-size:16px; line-height:1.5; }
.hair_privacy input { width:20px; height:20px; flex-shrink:0; margin:0; border:1px solid #e0e0e0; background:#fff; appearance:none; cursor:pointer; }
.hair_privacy input:checked { border:0; background:transparent url(/img/svg/icon_privacy_checked.svg) center/contain no-repeat; }
.hair_privacy a { color:#999; font-size:14px; line-height:1.5; }
.hair_submit { display:block; width:100%; margin-top:24px; padding:10px 15px; color:#fff; background:#ff2684; font-size:16px; font-weight:600; line-height:20px; }
.hair_submit:disabled { opacity:.55; cursor:not-allowed; }
.hair_reservation_form.is_submitting .hair_submit { cursor:wait; }
.hair_form_error { margin-top:15px; color:#c52c58; font-size:14px; line-height:1.6; }
.hair_form_error[hidden] { display:none; }
.reservation_privacy_dialog { width:calc(100% - 40px); max-width:640px; max-height:calc(100dvh - 40px); margin:auto; padding:30px; overflow:auto; border:1px solid #e0e0e0; background:#fff; color:#111; }
.reservation_privacy_dialog::backdrop { background:rgba(0,0,0,.45); }
.reservation_privacy_header { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.reservation_privacy_header h2 { color:#111; font-size:20px; font-weight:600; line-height:1.5; }
.reservation_privacy_header button { padding:5px 0; color:#777; font-size:14px; }
.reservation_privacy_content { margin-top:20px; color:#555; font-size:14px; line-height:1.7; }
.reservation_privacy_content p { color:inherit; font:inherit; }
.reservation_privacy_content h3 { margin:20px 0 5px; color:#111; font-size:15px; font-weight:600; }
.reservation_privacy_content .privacy_draft_notice { margin-bottom:15px; color:#c52c58; }
.privacy_page_inner { width:calc(100% - 40px); max-width:960px; margin:0 auto; padding:80px 0 120px; }

/* place */
.place_layout { display:flex; width:calc(100% - 40px); max-width:1440px; margin:0 auto; padding:80px 0 120px; flex-direction:column; gap:80px; }
.place_layout .map_box { width:100%; height:520px; }
.place_layout .map_box iframe { display:block; width:100%; height:100%; border:0; }

/* hover */
@media (hover: hover) and (pointer:fine){
  .shop_intro_logo { cursor:default; }
  .style_gallery_search button, .style_write_button { transition:opacity .2s; }
  .style_gallery_search button:hover, .style_write_button:hover { opacity:.75; }
  .style_gallery_link:hover h2, .style_gallery_pagination a:not(.is_disabled):hover { color:#ff2684; }
  .hair_submit, .hair_captcha .inquiry_captcha_refresh, .hair_privacy a { transition:opacity .2s; }
  .hair_submit:not(:disabled):hover, .hair_captcha .inquiry_captcha_refresh:hover, .hair_privacy a:hover { opacity:.75; }
}

@media (max-width:1024px){
  .shop_intro { flex-direction:column; }
  .shop_intro_visual { order:-1; width:100%; }
  .shop_intro_visual img { height:auto; }
  .shop_intro_copy { width:100%; padding:30px 20px 60px; }
  .shop_intro_logo { max-width:80px; }
  .shop_intro_title { margin-top:20px; font-size:40px; line-height:48px; }
  .shop_intro_tagline { margin-top:15px; font-size:20px; }
  .shop_intro_tagline span { display:block; }
  .shop_intro_description { margin-top:15px; font-size:14px; }
  .style_gallery { padding:40px 0 60px; }
  .sub_page_title { font-size:24px; line-height:33px; }
  .style_gallery_tools { margin-top:40px; flex-wrap:wrap; gap:9px; }
  .style_gallery_search { max-width:none; }
  .style_search_select { max-width:80px; }
  .style_search_select::after { right:9px; }
  .style_search_select select { padding-left:12px; font-size:14px; }
  .style_search_field input { padding-left:12px; font-size:14px; }
  .icon_style_search { width:20px; height:20px; }
  .style_write_button { max-width:none; font-size:14px; }
  .style_gallery_list { margin-top:30px; gap:30px; }
  .style_gallery_item { width:100%; }
  .icon_style_camera { width:60px; height:60px; }
  .style_gallery_placeholder span { font-size:14px; }
  .style_gallery_copy { margin-top:12px; }
  .style_gallery_copy h2 { font-size:14px; }
  .style_gallery_copy time { margin-top:3px; }
  .style_gallery_empty { margin-top:30px; padding:60px 15px; font-size:14px; }
  .style_gallery_pagination { margin-top:30px; }
  .style_gallery_pagination ol { gap:15px; }
  .style_gallery_pagination a { height:24px; font-size:14px; }
  .style_gallery_pagination .pagination_arrow { margin:0 6px; background-size:6px auto; }
  .price_layout { padding:60px 0; flex-direction:column; gap:60px; }
  .price_menu, .length_guide { max-width:none; flex:none; }
  .price_groups { margin-top:20px; gap:21px; }
  .price_group { flex-direction:column; gap:9px; }
  .price_group h2 { width:100%; font-size:16px; }
  .price_items { width:100%; flex:none; gap:12px; }
  .price_row { font-size:14px; }
  .length_guide_list { margin-top:20px; flex-direction:column; flex-wrap:nowrap; gap:9px; }
  .length_guide_card {width:100%;padding:20px;aspect-ratio:auto;gap:20px;justify-content: center;}
  .length_guide_art { max-width:120px; }
  .length_guide_copy {font-size:14px;display: flex;flex-direction: column;align-items: center;max-width: 100px;}
  .length_guide_copy h3 { font-size:16px; }
  .reservation_section { padding:60px 20px; }
  .reservation_panel { padding:20px; }
  .hair_reservation_form { margin-top:20px; }
  .hair_fields { flex-direction:column; flex-wrap:nowrap; gap:12px; }
  .hair_field { width:100%; gap:3px; }
  .hair_field > span, .hair_captcha > span { font-size:14px; }
  .hair_field input, .hair_field textarea, .hair_captcha .inquiry_captcha_input { font-size:14px; }
  .hair_field textarea { height:120px; }
  .hair_security { flex-direction:column; flex-wrap:nowrap; }
  .hair_password_rules { order:1; margin-top:9px; }
  .hair_password_rules p { align-items:flex-start; font-size:12px; line-height:18px; }
  .hair_password_rules .icon { background-image:url(/img/svg/icon_password_mobile.svg); }
  .hair_captcha { order:2; width:100%; margin-top:12px; flex:none; gap:3px; }
  .hair_privacy { margin-top:12px; }
  .hair_privacy label { gap:9px; }
  .hair_privacy label span { font-size:14px; }
  .hair_privacy a { font-size:13px; }
  .hair_submit { margin-top:20px; font-size:14px; }
  .reservation_privacy_dialog { padding:20px; }
  .privacy_page_inner { padding:40px 0 60px; }
  .place_layout { padding:40px 0 60px; gap:40px; }
  .place_layout .map_box { height:auto; aspect-ratio:1; }
}
