:root {
	/* Color */
	--brand-primary: #103770;
	--brand-hover: #2b64b3;
	--brand-gradient1 : linear-gradient(138deg, #6b9cdf 0%, #255dac 50%, #103770 100%);
	--brand-secondary: #ff9d4b;
	--brand-third: #ff6e30;
	--brand-gradient2 : linear-gradient(136deg, #ff9d4b 0%, #ff6e30 100%);
	--basic-black: #000;
	--basic-darkgray: #434343;
	--basic-middlegray: #7b7b7b;
	--basic-lightgray: #c4c4c4;
	--basic-pale: #f5f5f5;
	--basic-white: #fff;
	--basic-border: #ddd;
	--basic-bg: #fdfeff;
	--basic-bg2: #f8f8f8;
	--basic-pointbg: #f5f9ff;
	--state-info: #4c88fb;
	--state-success: #0ec174;
	--state-warning: #f9c116;
	--state-error: #f22a2d;
	--primary-primary100: #b7d5ff;
	--primary-primary200: #8dbdff;
	--primary-primary300: #63a4fe;
	--primary-primary400: #4681d2;
	--primary-primary500: #295da6;
	--primary-primary700: #0a264e;
	--primary-primary800: #081e3d;
	--primary-primary900: #06152b;

	/* Font */
	--font-family: "Pretendard", sans-serif;
	--second-family: "Raleway", sans-serif;
	--third-family: "Spoqa Han Sans Neo", sans-serif;
	--font3: "Roboto", sans-serif;
	--font4: "Racing Sans One", sans-serif;

	/* Typography */
	--56_display_r: 400 3.5rem/1.286 'Pretendard', sans-serif;
	--56_display_m: 500 3.5rem/1.286 'Pretendard', sans-serif;
	--56_display_sb: 600 3.5rem/1.286 'Pretendard', sans-serif;
	--56_display_b: 700 3.5rem/1.286 'Pretendard', sans-serif;

	--40_display_r: 400 2.5rem/1.3 'Pretendard', sans-serif;
	--40_display_m: 500 2.5rem/1.3 'Pretendard', sans-serif;
	--40_display_sb: 600 2.5rem/1.3 'Pretendard', sans-serif;
	--40_display_b: 700 2.5rem/1.3 'Pretendard', sans-serif;

	--36_title_r: 400 2.25rem/1.334 'Pretendard', sans-serif;
	--36_title_m: 500 2.25rem/1.334 'Pretendard', sans-serif;
	--36_title_sb: 600 2.25rem/1.334 'Pretendard', sans-serif;
	--36_title_b: 700 2.25rem/1.334 'Pretendard', sans-serif;

	--32_title_r: 400 2rem/1.334 'Pretendard', sans-serif;
	--32_title_m: 500 2rem/1.334 'Pretendard', sans-serif;
	--32_title_sb: 600 2rem/1.334 'Pretendard', sans-serif;
	--32_title_b: 700 2rem/1.334 'Pretendard', sans-serif;

	--30_title_r: 400 1.875rem/1.334 'Pretendard', sans-serif;
	--30_title_m: 500 1.875rem/1.334 'Pretendard', sans-serif;
	--30_title_sb: 600 1.875rem/1.334 'Pretendard', sans-serif;
	--30_title_b: 700 1.875rem/1.334 'Pretendard', sans-serif;

	--28_title_r: 400 1.75rem/1.358 'Pretendard', sans-serif;
	--28_title_m: 500 1.75rem/1.358 'Pretendard', sans-serif;
	--28_title_sb: 600 1.75rem/1.358 'Pretendard', sans-serif;
	--28_title_b: 700 1.75rem/1.358 'Pretendard', sans-serif;

	--24_title_r: 400 1.5rem/1.334 'Pretendard', sans-serif;
	--24_title_m: 500 1.5rem/1.334 'Pretendard', sans-serif;
	--24_title_sb: 600 1.5rem/1.334 'Pretendard', sans-serif;
	--24_title_b: 700 1.5rem/1.334 'Pretendard', sans-serif;
	
	--22_heading_r: 400 1.375rem/1.364 'Pretendard', sans-serif;
	--22_heading_m: 500 1.375rem/1.364 'Pretendard', sans-serif;
	--22_heading_sb: 600 1.375rem/1.364 'Pretendard', sans-serif;
	--22_heading_b: 700 1.375rem/1.364 'Pretendard', sans-serif;

	--20_heading_r: 400 1.25rem/1.4 'Pretendard', sans-serif;
	--20_heading_m: 500 1.25rem/1.4 'Pretendard', sans-serif;
	--20_heading_sb: 600 1.25rem/1.4 'Pretendard', sans-serif;
	--20_heading_b: 700 1.25rem/1.4 'Pretendard', sans-serif;

	--18_headline_r: 400 1.125rem/1.445 'Pretendard', sans-serif;
	--18_headline_m: 500 1.125rem/1.445 'Pretendard', sans-serif;
	--18_headline_sb: 600 1.125rem/1.445 'Pretendard', sans-serif;
	--18_headline_b: 700 1.125rem/1.445 'Pretendard', sans-serif;

	--17_headline_r: 400 1.063rem/1.412 'Pretendard', sans-serif;
	--17_headline_m: 500 1.063rem/1.412 'Pretendard', sans-serif;
	--17_headline_sb: 600 1.063rem/1.412 'Pretendard', sans-serif;
	--17_headline_b: 700 1.063rem/1.412 'Pretendard', sans-serif;

	--16_body_normal_r: 400 1rem/1.4 'Pretendard', sans-serif;
	--16_body_normal_m: 500 1rem/1.4 'Pretendard', sans-serif;
	--16_body_normal_sb: 600 1rem/1.4 'Pretendard', sans-serif;
	--16_body_normal_b: 700 1rem/1.4 'Pretendard', sans-serif;

	--16_body_read_r: 400 1rem/1.6 'Pretendard', sans-serif;
	--16_body_read_m: 500 1rem/1.6 'Pretendard', sans-serif;
	--16_body_read_sb: 600 1rem/1.6 'Pretendard', sans-serif;
	--16_body_read_b: 700 1rem/1.6 'Pretendard', sans-serif;

	--15_body_normal_r: 400 0.938rem/1.467 'Pretendard', sans-serif;
	--15_body_normal_m: 500 0.938rem/1.467 'Pretendard', sans-serif;
	--15_body_normal_sb: 600 0.938rem/1.467 'Pretendard', sans-serif;
	--15_body_normal_b: 700 0.938rem/1.467 'Pretendard', sans-serif;

	--15_body_read_r: 400 0.938rem/1.6 'Pretendard', sans-serif;
	--15_body_read_m: 500 0.938rem/1.6 'Pretendard', sans-serif;
	--15_body_read_sb: 600 0.938rem/1.6 'Pretendard', sans-serif;
	--15_body_read_b: 700 0.938rem/1.6 'Pretendard', sans-serif;

	--14_label_normal_r: 400 0.875rem/1.429 'Pretendard', sans-serif;
	--14_label_normal_m: 500 0.875rem/1.429 'Pretendard', sans-serif;
	--14_label_normal_sb: 600 0.875rem/1.429 'Pretendard', sans-serif;
	--14_label_normal_b: 700 0.875rem/1.429 'Pretendard', sans-serif;

	--14_label_read_r: 400 0.875rem/1.571 'Pretendard', sans-serif;
	--14_label_read_m: 500 0.875rem/1.571 'Pretendard', sans-serif;
	--14_label_read_sb: 600 0.875rem/1.571 'Pretendard', sans-serif;
	--14_label_read_b: 700 0.875rem/1.571 'Pretendard', sans-serif;

	--13_label_r: 400 0.813rem/1.385 'Pretendard', sans-serif;
	--13_label_m: 500 0.813rem/1.385 'Pretendard', sans-serif;
	--13_label_sb: 600 0.813rem/1.385 'Pretendard', sans-serif;
	--13_label_b: 700 0.813rem/1.385 'Pretendard', sans-serif;

	--12_caption_r: 400 0.75rem/1.334 'Pretendard', sans-serif;
	--12_caption_m: 500 0.75rem/1.334 'Pretendard', sans-serif;
	--12_caption_sb: 600 0.75rem/1.334 'Pretendard', sans-serif;
	--12_caption_b: 700 0.75rem/1.334 'Pretendard', sans-serif;

	--11_caption_r: 400 0.688rem/1.273 'Pretendard', sans-serif;
	--11_caption_m: 500 0.688rem/1.273 'Pretendard', sans-serif;
	--11_caption_sb: 600 0.688rem/1.273 'Pretendard', sans-serif;
	--11_caption_b: 700 0.688rem/1.273 'Pretendard', sans-serif;

	--10_caption_r: 400 0.625rem/1.273 'Pretendard', sans-serif;
	--10_caption_m: 500 0.625rem/1.273 'Pretendard', sans-serif;
	--10_caption_sb: 600 0.625rem/1.273 'Pretendard', sans-serif;
	--10_caption_b: 700 0.625rem/1.273 'Pretendard', sans-serif;


	/* Transition */
	--transition: all 0.35s ease;

	/* Shadow */
	--box-shadow: 0.25rem 0.25rem 0.75rem 0 rgba(0, 0, 0, 0.2);

	/* Marquee Gap */
  	--gap: 1.25rem;
}
  
/* common */
* { margin: 0; padding: 0; outline: none; box-sizing: border-box; -webkit-tap-highlight-color: transparent;}
body {margin: 0; padding: 0; -ms-overflow-style: none; scrollbar-width: none; }
html::-webkit-scrollbar {display: none;}
html { scroll-behavior: smooth; }
html, body {font: 400 16px/1.3 var(--font-family), sans-serif;  color: var(--basic-black); width: 100%; position: relative;}
ul, li {list-style: none;}
a {text-decoration: none; color: inherit; -webkit-tap-highlight-color: transparent;}
img {max-width: 100%;}
button { font-family: inherit; border: none; background-color: transparent; outline: 0;  cursor: pointer; }
input,textarea,button,select {font-family: inherit;}
::-webkit-scrollbar {width: 4px; height: 4px;}
::-webkit-scrollbar-track {background: var(--basic-pale);border-radius: 6.25rem;}
::-webkit-scrollbar-thumb {background: var(--basic-middlegray); border-radius: 6.25rem;}

[data-aos=fade-up] { transform: translate3d(0,3.125rem,0)}
[data-aos=fade-down] { transform: translate3d(0,-3.125rem,0)}
[data-aos=fade-right] { transform: translate3d(-3.125rem,0,0)}
[data-aos=fade-left] { transform: translate3d(3.125rem,0,0)}

body.hidden { overflow: hidden;}
body.menu { overflow: hidden;}
body::before { content: "";  position: fixed;  left: 0;  top: 0;  width: 100%;  height: 100%; background-color: rgba(0,0,0,0.25); z-index: 99;  transition: all 0.4s ease; opacity: 0; pointer-events: none;cursor: pointer;}
body.hidden::before { opacity: 1;  pointer-events: auto;}
  
.wrap {width: 100%; position: relative;}
.pc {display: block;}
.tablet {display: none !important;}
.mobile { display: none !important;}
.container {position: relative; width: 100%; padding-top: 5.5rem;} 
.inner {position: relative; width: 90%; max-width: 1600px;  margin-left: auto; margin-right: auto;}
.inner2 {position: relative; width: 90%; max-width: 1280px;  margin-left: auto; margin-right: auto;}
.mob_inner { max-width: 780px;}


.Pretendard {font-family: var(--font-family) !important}
.Raleway {font-family: var(--second-family) !important}
.SpoqaHanSansNeo {font-family: var(--third-family) !important}
.Roboto {font-family: var(--font3) !important}
.RacingSansOne {font-family: var(--font4) !important}


  
/* header */
.header { position: fixed; left: 0; top: 0;  width: 100%;  height: 5.5rem;  z-index: 50;  background: var(--basic-white); transition: var(--transition);}
.header .h_inner { display: flex; align-items: center; justify-content: space-between;  gap: 1.25rem; padding: 1.5rem 0;}
.header .h_left {flex: 1; display: flex; align-items: center; gap: 1.5rem;}
.header .h_left .logobox { width: 11.25rem;}
.header .h_left .logobox > a { position: relative; display: flex; align-items: center; justify-content: center;}
.header .h_left .logobox > a img {transition: var(--transition);}
.header .h_left .logobox > a .logo_w {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); opacity: 0;}
.header .h_nav { display: flex;  align-items: center; gap: 2.5rem;}
.header .h_nav > li {position: relative;}
.header .h_nav > li .link {  font-family: var(--second-family); font-weight: 700;  font-size: 1.125rem;  line-height: 145%; color: var(--brand-primary);  padding: 0.375rem;  transition: var(--transition);}
.header .h_nav > li .link:hover {color: var(--brand-secondary);}
.header .h_right { flex: 1; display: flex; align-items: center;  justify-content: flex-end;   gap: 0.875rem;}
.header .h_right .side_btn {  width: 2.5rem;  aspect-ratio: 1 / 1;  font-size: 2rem;   line-height: 1; color: var(--brand-primary);  display: flex;  align-items: center;   justify-content: center;  transition: var(--transition);}
.header .h_right .side_btn:hover {color: var(--brand-secondary);}

.white_ver .header {background: transparent;}
.white_ver .header .h_left .logobox > a .logo {opacity: 0;}
.white_ver .header .h_left .logobox > a .logo_w {opacity: 1;}
.white_ver .header .h_nav > li .link {color: var(--basic-white);}
.white_ver .header .h_right .side_btn {color: var(--basic-white);}
.white_ver .header .h_nav > li .link:hover {color: var(--brand-secondary);}
.white_ver .header .h_right .side_btn:hover {color: var(--brand-secondary);}

.header.down {background: var(--basic-white);}
.header.down .h_left .logobox > a .logo {opacity: 1;}
.header.down .h_left .logobox > a .logo_w {opacity: 0;}
.header.down .h_nav > li .link {color: var(--brand-primary);}
.header.down .h_right .side_btn {color: var(--brand-primary);}
.header.down .h_nav > li .link:hover {color: var(--brand-secondary);}
.header.down .h_right .side_btn:hover {color: var(--brand-secondary);}


  
/* nav box */
.navbox { position: fixed;  left: 0;  top: 0;  width: 100%;  height: 100%;  background: var(--brand-primary); z-index: 60; transition: var(--transition); opacity: 0; pointer-events: none; display: flex; flex-direction: column;}
.navbox .nav_head {width: 100%; height: 5.5rem; border-bottom: 1px solid rgba(255, 255, 255, 0.2);}
.navbox .nav_head .h_inner{ height: 100%; display: flex; align-items: center; justify-content: space-between;  gap: 1.25rem; padding: 1.5rem 0;}
.navbox .nav_head .h_left {flex: 1; display: flex; align-items: center; gap: 1.5rem;}
.navbox .nav_head .h_left .logobox { width: 11.25rem;}
.navbox .nav_head .h_left .logobox > a { position: relative; display: flex; align-items: center; justify-content: center;}
.navbox .nav_head .h_left .logobox > a .logo {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); opacity: 0;}
.navbox .nav_head .h_right { flex: 1; display: flex; align-items: center;  justify-content: flex-end; gap: 0.875rem;}
.navbox .nav_head .h_right .side_btn {  width: 2.5rem;  aspect-ratio: 1 / 1;  font-size: 2rem; line-height: 1; color: var(--basic-white);  display: flex;  align-items: center;   justify-content: center;  transition: var(--transition);}
.navbox .nav_head .h_right .side_btn:hover {color: var(--brand-secondary);}
.navbox.open {opacity: 1; pointer-events: all;}
.navbox .nav_menupop {  flex: 1; display: flex;  flex-direction: column;  justify-content: center;  gap: 8.25rem;}
.navbox .nav_menupop .nav_title { font: var(--40_display_sb);  letter-spacing: -0.03em;  color: var(--basic-white);}
.navbox .nav_menupop .nav_menu { display: flex; align-items: flex-start;  justify-content: space-between;}
.navbox .nav_menupop .nav_menu .nav_menuitem {  display: flex;  flex-direction: column;  align-items: center; gap: 1.875rem;}
.navbox .nav_menupop .nav_menu .nav_menuitem .title { font: var(--28_title_sb);  letter-spacing: -0.02em; color: var(--basic-white);}
.navbox .nav_menupop .nav_menu .nav_menucont { display: flex; flex-direction: column;  align-items: center; gap: 1.5rem; }
.navbox .nav_menupop .nav_menu .nav_menucont > li { font: var(--20_heading_r);  letter-spacing: -0.01em; text-align: center; color: var(--basic-white); font-weight: 300;}
.navbox .nav_menupop .nav_menu .nav_menucont > li .link {display: inline-block; transition: var(--transition);}
.navbox .nav_menupop .nav_menu .nav_menucont > li .link:hover {color: var(--brand-secondary);}
.navbox .nav_menupop .nav_menu .line {width: 1px; align-self: stretch; background: var(--basic-white); opacity: 0.2;}
.navbox .nav_menubox { display: none;}



/* fixed nav */
.fixed_nav { position: fixed; right: 2.5rem; bottom: 2.5rem;  display: flex; flex-direction: column; gap: 0.625rem;  z-index: 50;}
.fixed_nav .item { width: 3.125rem; aspect-ratio: 1 / 1; display: flex; align-items: center;  justify-content: center; cursor: pointer; transition: var(--transition);}
.fixed_nav .item .link { width: 100%; height: 100%; display: flex;}



/* footer */
.footer { position: relative;  background: var(--brand-primary);  padding: 5rem 0 3.125rem; z-index: 30;}
.footer .f_inner { display: flex; flex-direction: column; gap: 3.125rem;}
.footer .f_top { position: relative;}
.footer .f_top .balloon { position: absolute;  right: 8.75rem;  bottom: -2.625rem;   width: 23%; max-width: 22.5rem;}
.footer .f_top .logobox { width: 15rem; display: flex; align-items: center;  justify-content: center;}
.footer .f_contbox { display: flex; justify-content: space-between;  align-items: flex-start; gap: 3.5rem; padding-top: 1rem;}
.footer .f_contbox .f_contitem { position: relative;}
.footer .f_contbox .f_contitem1 {flex: 1; }
.footer .f_contbox .f_contitem2 { min-width: 15rem;}
.footer .f_contbox .f_contitem .f_tit { font: var(--24_title_sb);  letter-spacing: -0.02em;  color: var(--basic-white); margin-bottom: 1rem;}
.footer .f_contbox .f_contitem .f_infobox {  display: flex;  flex-wrap: wrap;  gap: 0.25rem 1.5rem; max-width: 50rem;}
.footer .f_contbox .f_contitem .f_infobox .f_txt {  font: var(--16_body_normal_r);   letter-spacing: 0.01em;  color: var(--basic-white);  display: flex;  align-items: center;  gap: 0.375rem;}
.footer .f_contbox .f_contitem .f_infobox .f_txt .tit { font-weight: 600;}
.footer .f_contbox .f_contitem .f_navbox { display: flex; flex-direction: column; align-items: flex-start; gap: 0.5rem;}
.footer .f_contbox .f_contitem .f_navbox .btn { font: var(--16_body_normal_r);  letter-spacing: 0.01em; color: var(--basic-white); cursor: pointer;}
.footer .f_contbox .f_contitem .f_contact .contact_tit { display: flex;  align-items: center;  gap: 1rem; margin-bottom: 0.25rem;}
.footer .f_contbox .f_contitem .f_contact .contact_tit .number {  font: var(--36_title_m);  letter-spacing: -0.03em;  color: var(--basic-white);}
.footer .f_contbox .f_contitem .f_contact .contact_tit .inq_btn { height: unset;  padding: 0.375rem 1rem; font: var(--15_body_normal_sb);}
.footer .f_contbox .f_contitem .f_contact .txtbox {  display: flex;  flex-direction: column;  gap: 0.25rem;  font: var(--14_label_normal_r);  letter-spacing: 0.01em;  color: var(--basic-white);}
.footer .f_bottom {  border-top: 1px solid rgba(255, 255, 255, 0.2);  padding-top: 3.125rem;  display: flex; align-items: center;  justify-content: space-between;  font: var(--14_label_normal_m); letter-spacing: 0.01em; color: var(--basic-white);}
.footer .f_bottom .sns_box {  display: flex;  align-items: center;  gap: 2.5rem;}
.footer .f_bottom .sns_box .link {display: block; transition: var(--transition);}
.footer .f_bottom .sns_box .link:hover {color: var(--brand-secondary);}



/* mobile nav */
.mob_nav {display: none;}



/* layout */
.layout {display: flex; align-items: flex-start;  gap: 2.5rem;}
.layout .side_area { position: sticky; top: 6.25rem;  width: 22.5rem;  border: 1px solid var(--basic-border);  border-radius: 1rem;  background: var(--basic-white);}
.layout .cont_area { position: relative; width: calc(100% - 22.5rem - 2.5rem);}



/* form */
.form_box {display: flex; flex-wrap: wrap; gap: 1.25rem 1.5rem;}
.form_box .form_item {width: calc((100% - 1.5rem)/2);}
.form_box .form_item.full {width: 100%;}

.input_box {position: relative; display: flex; flex-direction: column; gap: 0.625rem;}
.input_box.flexible {flex-direction: row; align-items: center; gap: 0.5rem;}
.input_box.flexible2 {flex-direction: row; align-items: center; gap: 1rem;}
.input_box .input_text {  border: 1px solid var(--basic-border);  border-radius: 0.5rem;   padding: 0 1rem; background: var(--basic-white);  width: 100%;  height: 2.5rem;  font: var(--16_body_normal_r);  letter-spacing: 0.01em;  color: var(--basic-darkgray);   transition: var(--transition);  text-overflow: ellipsis;}
.input_box .input_text.datepicker{background: url(../img/ic_datepicker.png) no-repeat right 1rem center/1rem auto var(--basic-white); padding-right: 2.5rem; cursor: pointer;}
.input_box .input_text:focus {border-color: var(--brand-primary);}
.input_box .input_text::placeholder {color: var(--basic-lightgray);}
.input_box textarea.input_text {height: 12.5rem; padding: 0.75rem 1rem; resize: none;}
.input_box textarea.input_text.h100 {height: 6.25rem;}
.input_box .label_text {font: var(--16_body_normal_m);letter-spacing: 0.01em;color: var(--basic-darkgray);}
.input_box .label_text.felxible {display: flex; align-items: center; gap: 0.5rem;}
.input_box .label_text .required {position: relative; display: flex; align-items: center; gap: 0.25rem;}
.input_box .label_text .required::after {content: "*"; color: var(--brand-primary);} 
.input_box .label_text .point {font:var(--12_caption_m); letter-spacing: 0.03em;
color: var(--brand-primary);}
.input_box .input_status {font:var(--14_label_normal_r); letter-spacing: 0.01em; color: var(--basic-middlegray); word-break: keep-all;}
.input_box .input_status.success {color: var(--state-success);}
.input_box .input_status.warning {color: var(--state-warning);}
.input_box .input_status.error {color: var(--state-error);}
.input_box .input_btn{border-radius: 0.625rem; height: 2.5rem; padding: 0.25rem 1rem; background: var(--brand-primary); font: var(--16_body_normal_r); letter-spacing: 0.01em; color: var(--basic-white); border: 1px solid var(--brand-primary);;} 
.input_box .input_btn.typeB {background: var(--basic-white);}
.input_box .input_btn.sch {display: flex; align-items: center; justify-content: center ; align-self: stretch;}
.input_box .input_btn.sch .icon {width: 1rem;}
.input_box .input_item { display: flex; align-items: center; gap: 0.5rem;}
.input_box .input_item .input_text {flex: 1;}
.input_box .input_flex {display: flex; align-items: center; gap: 0.625rem;}
.input_box .input_flex .sns_select {width: 7.5rem;}
.input_box .input_flex .input_text {flex: 1;}

.input_box_sch { width: 17.5rem;}
.input_box_sch .input_text { padding: 0 1rem;  padding-right: 2.5rem; border-radius: 6.25rem;}
.input_box_sch .sch_btn { background: url(../img/ic_search.png) no-repeat center / contain; width: 1rem;  aspect-ratio: 1 / 1;  position: absolute;  right: 1rem;  top: 50%;  transform: translateY(-50%);}
.input_box_sch .input_text:focus {background: var(--basic-white);}

.input_box_file {display: flex; flex-direction: row; gap: 0.5rem;letter-spacing: 0.01em; color: var(--basic-darkgray); border: none; background: none;} 
.input_box_file .input_text{flex: 1;} 
.input_box_file .input_btn{font-weight: 600;} 

.input_box_view {position: relative;}
.input_box_view .input_item {position: relative; }
.input_box_view .input_text {padding-right: 2.75rem;}
.input_box_view .view_btn {background: url(../img/ic_eye_closed.png) no-repeat center/contain; width: 1.25rem; aspect-ratio: 1/1; position: absolute;  right: 1rem;  top: 50%;  transform: translateY(-50%);}
.input_box_view .view_btn.on {background-image: url(../img/ic_eye.png);}


.check_wrap {position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: 0.625rem 1rem;}
.check_box {display: flex; align-items: center; gap: 0.5rem;}
.check_box.align_start {align-items: flex-start;}
.check_box .input_check{position: relative; appearance: none; border: 1px solid var(--basic-border); border-radius: 0.25rem; width: 1.25rem; height: 1.25rem; background: var(--basic-white); transition: var(--transition); cursor: pointer;}
.check_box .input_check::before{content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); background: url(../img/ic_check_off.png) no-repeat center/contain; width: 0.75rem; aspect-ratio: 1/1; transition: var(--transition); }
.check_box .input_check:checked{background: var(--brand-primary); border-color: var(--brand-primary);}
.check_box .input_check:checked::before{background-image: url(../img/ic_check_on.png);}
.check_box .label_check{font: var(--16_body_normal_r);letter-spacing: 0.01em;color: var(--basic-darkgray); cursor: pointer}
.check_box .input_check:disabled + .label_check{color: var(--basic-lightgray);}
.check_box .label_check .small {font:var(--14_label_normal_r); color: var(--basic-middlegray);}
.check_box .label_check .point {color: var(--brand-primary);}
.check_box .label_check .underline {text-decoration: underline;text-decoration-skip-ink: none;font-weight: 600; text-underline-offset: 3px;}

.check_box .label_check.star_ver {display: flex; align-items: center; gap: 0.25rem;}
.check_box .label_check.star_ver .stars{display: flex; gap: 0.125rem;}
.check_box .label_check.star_ver .stars .star{background: url(../img/ic_star_off.png) no-repeat center/contain; width: 0.875rem; aspect-ratio: 1/1;}
.check_box .label_check.star_ver .stars .star.on{background-image: url(../img/ic_star_on.png);}

.check_wrap.ver2 {display: flex; flex-direction: column;  flex-wrap: nowrap;  align-items: unset;  gap: 0.5rem;  max-height: 10rem;  overflow: auto;  padding: 0.125rem 0.75rem; margin: 0.625rem 0;}
.check_wrap.ver2 .check_box { flex-direction: row-reverse;  justify-content: space-between; gap: 0.25rem;}
.check_wrap.ver2 .check_box .input_check {  border: none;  border-radius: 0;  width: 1rem; height: 1rem; background: none; transition: none;}
.check_wrap.ver2 .check_box .input_check::before {background: none; transition: none;}
.check_wrap.ver2 .check_box .input_check:checked {background: none;}
.check_wrap.ver2 .check_box .input_check:checked::before {background: url(../img/ic_check.png) no-repeat center/contain; width: 100%; aspect-ratio: 1/1;}
.check_wrap.ver2 .check_box .label_check { font: var(--14_label_normal_r); flex: 1;}
.check_wrap.ver2 .check_box .input_check:checked + .label_check {font-weight: 500; color: var(--brand-primary);}

.check_wrap.ver3 {gap: 0.313rem;}
.check_wrap.ver3 .check_box .input_check { display: none;}
.check_wrap.ver3 .check_box .label_check { border: 1px solid var(--basic-border);  border-radius: 6.25rem; font: var(--14_label_normal_r); padding: 0.375rem 0.875rem; background: var(--basic-white);  transition: var(--transition);}
.check_wrap.ver3 .check_box .input_check:checked + .label_check { background: var(--basic-pointbg);  border-color: var(--brand-primary);  color: var(--brand-primary);  font-weight: 500;}


.radio_wrap {position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: 0.625rem 1.25rem;}
.radio_wrap.mh { height: 2.5rem}
.radio_box {display: flex; align-items: center; gap: 0.5rem;}
.radio_box.mh { height: 2.5rem}
.radio_box.align_start {align-items: flex-start;}
.radio_box .input_radio{position: relative; appearance: none; width: 1.25rem; height: 1.25rem; border: 1px solid var(--basic-border);transition: var(--transition); cursor: pointer; border-radius: 50%;}
.radio_box .input_radio::before{content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); border-radius: 50%; width: 0.625rem; aspect-ratio: 1/1; background: var(--basic-border); transition: var(--transition);}
.radio_box .input_radio:checked{border-color:  var(--brand-primary);;}
.radio_box .input_radio:checked::before{background: var(--brand-primary);}
.radio_box .label_radio{font: var(--16_body_normal_r);letter-spacing: 0.01em;color: var(--basic-darkgray); cursor: pointer}
.radio_box .input_radio:disabled + .label_radio{color: var(--basic-lightgray);}
.radio_box .label_radio .small {font:var(--14_label_normal_r); color: var(--basic-middlegray);}


.switch_box {position: relative; display: flex; align-items: center; gap: 0.5rem;}
.switch_box .input_switch{position: relative; appearance: none; width: 2.75rem; height: 1.5rem; background: var(--basic-border); border-radius: 6.25rem; cursor: pointer; transition: var(--transition);}
.switch_box .input_switch::before{ content: ""; position: absolute; left: 0.125rem;  top: 50%; transform: translateY(-50%); width: 1.25rem; aspect-ratio: 1 / 1; border-radius: 6.25rem; background: var(--basic-white); transition: var(--transition);}
.switch_box .input_switch:checked{background: var(--brand-primary);}
.switch_box .input_switch:checked::before{left: calc(100% - 1.25rem - 0.125rem);}
.switch_box .label_switch{font: var(--16_body_normal_r);letter-spacing: 0.01em;color: var(--basic-darkgray); cursor: pointer}
.switch_box.reverse { flex-direction: row-reverse;}


.select_box {position: relative;}
.select_box.full {width: 100%; flex: 1;}
.select_box.w120 {width: 7.5rem;}
.select_box .select { width: 100%; appearance: none; height: 2.5rem; font: var(--16_body_normal_r);  letter-spacing: 0.01em;  color: var(--basic-darkgray);  background: url(../img/select_arrow.png) no-repeat right 1rem center / 1rem var(--basic-white); border: 1px solid var(--basic-border); border-radius: 0.5rem; padding: 0 2.5rem 0 1rem; transition: var(--transition); cursor: pointer;}
.select_box.filter_ver { border: 1px solid var(--basic-border); border-radius: 0.5rem;  padding: 0 1rem;  background: var(--basic-white);}
.select_box.filter_ver .select { font: var(--14_label_normal_r); letter-spacing: 0.01em;  color: var(--basic-lightgray);  background: none; border-radius: 0;  padding: 0;  border: 0; display: flex; align-items: center; gap: 0.5rem;}
.select_box.filter_ver .select.selected {color: var(--basic-darkgray); }
.select_box.filter_ver .select .icon { width: 1rem;}
.select_box.filter_ver .select .txt {flex: 1;}
.select_box.filter_ver .select .arrow { background: url(../img/select_arrow.png) no-repeat center / contain; width: 1rem;  aspect-ratio: 1 / 1; transition:var(--transition);}
.select_box.filter_ver .show .select .arrow {transform: rotate(180deg);}
.select_box.filter_ver .select_wrap {display: none;}
.select_box.filter_ver .select_list .input_box .input_text {  height: 2.25rem; padding-left: 0.75rem;  padding-right: 2rem;  font: var(--14_label_normal_r);}
.select_box.filter_ver .select_list .input_box .sch_btn{ background: url(../img/ic_search.png) no-repeat center / contain; width: 0.75rem;  aspect-ratio: 1 / 1;  position: absolute;  right: 0.75rem;  top: 50%;  transform: translateY(-50%);}


.range_box { position: relative;  width: 100%; margin-top: 0.688rem; padding: 0 0.5rem;}
.range_box .range_slider { position: relative; width: 100%; margin: 0 auto;}
.range_box .range_slider input[type="range"] {appearance: none; -webkit-appearance: none; pointer-events: none; cursor: pointer; position: absolute; background-color: transparent; height:2px; left: 0;  right: 0; z-index: 2;  opacity: 0;}
.range_box .range_slider input[type="range"]::-webkit-slider-thumb {appearance: none; -webkit-appearance: none; pointer-events: all; width: 1rem; height: 1rem; border-radius: 50%; z-index: 3;  opacity: 0;}
.range_box .slider { position: relative; height: 2px; width: 100%; margin: 0 auto 1.188rem;}
.range_box .slider .track { position: absolute; width: calc(100% + 1rem);  height: 2px; background: var(--basic-border); top: 0; left: -0.5rem; right: 0; border-radius: 6.25rem;} 
.range_box .slider .range { position: absolute; height: 2px; background: var(--basic-border); top: 0; left: 0; right: 0; border-radius: 6.25rem;}
.range_box .slider .range {background: var(--brand-primary);}
.range_box .slider .thumb { position: absolute; top: -0.5rem; width: 1rem; aspect-ratio: 1/1; border-radius: 50%; background: var(--basic-white); border: 1px solid var(--brand-primary); padding: 0.25rem;display: flex; align-items: center;  justify-content: center; box-shadow: 0 0.25rem 0.625rem 0 rgba(0, 0, 0, 0.12);}
.range_box .slider .thumb_left { transform: translate(-50%);}
.range_box .slider .thumb_right { transform: translate(50%);}
.range_box .slider .thumb::before {content: ""; width: 100%; aspect-ratio: 1/1; background: var(--brand-primary); border-radius: 50%;}
.range_box .label_range {display: block; font:var(--13_label_r);letter-spacing: 0.02em; color: var(--basic-middlegray); margin: 0 -0.5rem; width: calc(100% + 1rem); }


.control_box {display: flex; align-items: center; gap: 0.125rem;}
.control_box .input_control {background: no-repeat center/contain; width: 1.25rem; aspect-ratio: 1/1;}
.control_box .input_control.input_plus {background-image: url(../img/ic_plus.png);}
.control_box .input_control.input_minus {background-image: url(../img/ic_minus.png);}
.control_box .input_count {border: 0; width: 2.5rem; height: 1rem; font: var(--12_caption_m);letter-spacing: 0.01em; text-align: center; color: var(--basic-darkgray);}

.control_box.ver2 .input_control {width: 1.5rem;}
.control_box.ver2 .input_control.input_plus {background-image: url(../img/ic_plus2.png);}
.control_box.ver2 .input_control.input_minus {background-image: url(../img/ic_minus2.png);}
.control_box.ver2 .input_count {font:var(--16_body_normal_m); height: unset;}

.control_box.ver3 {border: 1px solid var(--basic-border); border-radius: 0.625rem;}
.control_box.ver3 .input_control { width: 2.75rem;}
.control_box.ver3 .input_control.input_plus {background-image: url(../img/ic_plus_big.png);}
.control_box.ver3 .input_control.input_minus {background-image: url(../img/ic_minus_big.png);}
.control_box.ver3 .input_count {font:var(--16_body_normal_r); width: 3.125rem; height: 2.75rem; color: var(--basic-black); border-left: 1px solid var(--basic-border);border-right: 1px solid var(--basic-border);}


.rating_box { display: flex;}
.rating_box .rating { display: flex; align-items: center;  flex-direction: row-reverse;  gap: 0.188rem;}
.rating_box .rating .input_star{display: none;}
.rating_box .rating .label_star{background: url(../img/ic_star_off.png) no-repeat center/contain; width: 1.125rem; aspect-ratio: 1/1; cursor: pointer; display: block;}
.rating_box .rating .input_star:checked ~ .label_star {background-image: url(../img/ic_star_on.png);}



/* datepicker */
#datepicker:focus>.ui-datepicker { display: block; }
.ui-datepicker { font-family: inherit; display: none; margin-top: 0.75rem; margin-left: 0px; margin-right: 0px;  width: auto;  box-shadow: 0 0.25rem 1.25rem 0 rgba(0, 0, 0, 0.1); border: 1px solid var(--basic-pale); border-radius: 1rem; padding: 1.25rem 1rem;  background: var(--basic-white);}
.ui-widget.ui-widget-content {border: 1px solid var(--basic-pale);}
.ui-datepicker .ui-datepicker-header { position: relative; padding: 0 0.625rem; display: flex;  align-items: center; border-radius: 0; background: var(--basic-white); margin-bottom: 1.25rem;  border: 0;}
.ui-datepicker .ui-datepicker-title { flex: 1;  margin: 0;  padding: 0;  text-align: left; order: 1;  font: var(--16_body_normal_sb); letter-spacing: 0.01em;  color: var(--basic-black);}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: relative; width: 1rem  !important; height: auto !important; left: auto; right:auto; top: auto; aspect-ratio: 1 / 1; display: flex; cursor: pointer;}
.ui-datepicker .ui-datepicker-prev {order: 2; margin-right: 0.5rem;}
.ui-datepicker .ui-datepicker-next {order: 3;}
.ui-datepicker .ui-datepicker-prev span, 
.ui-datepicker .ui-datepicker-next span { background: no-repeat center / contain; width: 100%; height: 100%;}
.ui-datepicker .ui-datepicker-prev span{ background-image: url(../img/datepicker_prev.png);}
.ui-datepicker .ui-datepicker-next span{ background-image: url(../img/datepicker_next.png);}
.ui-datepicker-calendar { width: 100%; }  
.ui-datepicker table {margin: 0;}
.ui-datepicker-calendar>thead>tr>th { width: 2.2rem; height: 2.2rem;  padding: 0;  }
.ui-datepicker-calendar>thead>tr>th span {font: var(--16_body_normal_m); letter-spacing: 0.01em; color: var(--basic-black);}
.ui-datepicker-calendar>thead>tr>th span[title="일요일"] {color: var(--state-error);}
.ui-datepicker-calendar>thead>tr>th span[title="토요일"] {color: var(--state-info);}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { border: none; background-color: transparent;text-align: center; width: 2.2rem; height: 2.2rem; padding: 0; font: var(--16_body_normal_m);    display: flex;  align-items: center; justify-content: center;letter-spacing: 0.01em;color: var(--basic-darkgray);}
.ui-state-hover,.ui-widget-content .ui-state-hover,.ui-widget-header .ui-state-hover,
.ui-state-focus,.ui-widget-content .ui-state-focus,.ui-widget-header .ui-state-focus,
.ui-button:hover,.ui-button:focus { border: none; background-color: transparent;text-align: center; width: 2.2rem; height: 2.2rem; padding: 0; font: var(--16_body_normal_m);   display: flex;  align-items: center; justify-content: center;letter-spacing: 0.01em;color: var(--basic-darkgray);}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {font-weight: 700; color: var(--brand-primary);}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {border: none; background: transparent; position: relative; color: #fff}
.ui-state-active::before, .ui-widget-content .ui-state-active::before, .ui-widget-header .ui-state-active::before, a.ui-button:active::before, .ui-button:active::before, .ui-button.ui-state-active:hover::before { content: ""; border-radius: 0.5rem; background: var(--brand-primary);  width: 2.2rem; aspect-ratio: 1 / 1; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1;}
.ui-state-disabled { cursor: auto; color: var(--basic-lightgray);}    
.ui-datepicker-calendar>tbody>tr>.ui-state-disabled:hover {cursor: auto;  background-color: var(--basic-white);}  
.ui-state-disabled, .ui-widget-content .ui-state-disabled , .ui-widget-header .ui-state-disabled { opacity: 1;}
.ui-state-disabled, .ui-widget-content .ui-state-disabled span, .ui-widget-header .ui-state-disabled span { color: var(--basic-lightgray); font-weight: 400;}



/* tab */
.tab_wrap {position: relative;}
.tab_navbox {display: flex; border-bottom: 1px solid var(--basic-border); background: var(--basic-white);}
.tab_navbox .tab_nav {width: auto; position: relative; font: var(--18_headline_r); text-align: center;  color: var(--basic-middlegray);  cursor: pointer; transition: var(--transition);}
.tab_navbox .tab_nav.full {flex: 1;}
.tab_navbox .tab_nav:hover {color: var(--brand-primary);}
.tab_navbox .tab_nav.on { color: var(--brand-primary); font-weight: 600;}
.tab_navbox .tab_nav::before {content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 0.188rem; background: var(--brand-primary); opacity: 0; transition: var(--transition);} 
.tab_navbox .tab_nav.on::before {opacity: 1;}
.tab_navbox .tab_nav .link {width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 1.25rem 1.875rem;}
.tab_contbox { position: relative;}
.tab_contbox .tab_cont { position: relative; display: none; /*animation: 1.2s ease 0s fadeIn;*/}
.tab_contbox .tab_cont.on {display: block;}
/* @keyframes fadeIn {	0% {opacity:0} 100% {opacity:1;} } */



/* button */
.button {display: flex; align-items: center; justify-content: center; border-radius: 0.625rem; height: 3.125rem; width: 17.5rem; padding: 0 5rem; font: var(--18_headline_m);letter-spacing: 0.01em;color: var(--basic-white);border: 1px solid transparent; transition: var(--transition);}
.button.typeA {border-color: var(--brand-primary); background: var(--brand-primary); color: var(--basic-white);}
.button.typeB {border-color: var(--brand-primary); background: var(--basic-white); color: var(--brand-primary);}
.button.typeC {border-color: var(--basic-white); background: transparent; color: var(--basic-white);}
.button.typeD {border-color: var(--basic-border); background: var(--basic-white); color: var(--basic-darkgray);}
.button.typeE {border-color: var(--brand-third); background: var(--brand-third); color: var(--basic-white);}
.button.typeF {border-color: var(--basic-darkgray); background: var(--basic-darkgray); color: var(--basic-white);}
.button:disabled {border-color: var(--basic-border); background: var(--basic-pale); color: var(--basic-lightgray); pointer-events: none;}
.button.round {border-radius: 6.25rem;}
.button.round2 {border-radius: 0.5rem;}
.button.auto {width: auto;}
.button.icon_ver {width: 3.125rem; height: auto; aspect-ratio: 1/1; padding: 0;}
.button.icon_ver .icon {width: 1.25rem;}

.view_more { width: 100%;  max-width: 25rem;  display: flex;  align-items: center;  justify-content: center;  gap: 0.5rem;  font: var(--18_headline_sb);  color: var(--basic-darkgray); border: 1px solid var(--basic-border);  border-radius: 1rem;   padding: 1.25rem 0;  text-transform: uppercase;  background: var(--basic-white);}
.view_more .arrow {background: url(../img/ic_view.png) no-repeat center/contain; width: 1.25rem; aspect-ratio: 1/1; transition: var(--transition);}

.button_box {display: flex; align-items: center; gap: 1.25rem; margin-top: 2.5rem;}
.button_box.center {justify-content: center;}
.button_box .button {width: 8.75rem; height: 3.125rem; padding: 0;}
.button_box .button.medium {height: 2.5rem; font:var(--14_label_normal_m);border-radius: 0.5rem;}



/* badge */
.badgebox {display: flex; flex-wrap: wrap; gap: 0.25rem 0.375rem;}
.badge {font: var(--10_caption_m); display: flex; align-items: center; justify-content: center;letter-spacing: 0.03em; border: 1px solid transparent; border-radius: 0.25rem; padding: 0.125rem 0.313rem;}
.badge.typeA {--bg: var(--state-info); background: var(--state-info);color: var(--basic-white);border-color: var(--state-info);} 
.badge.typeB {--bg: var(--state-error); background: var(--basic-white); color: var(--state-error);border-color: var(--state-error);}
.badge.typeC {--bg: var(--state-error); background: var(--state-error);color: var(--basic-white); border-color: var(--state-error);}
.badge.typeD {--bg: var(--basic-black); background: var(--basic-black);color: var(--basic-white);border-color: var(--basic-black);}
.badge.typeE {--bg: var(--basic-middlegray); background: var(--basic-white);color: var(--basic-middlegray);border-color: var(--basic-border);}



/* table */
.tbl { width: 100%;  border-collapse: collapse; overflow: hidden;}
.tbl thead { background: var(--basic-bg2);}
.tbl thead tr th {padding: 1.125rem 1rem; font: var(--16_body_normal_sb);letter-spacing: 0.01em;color: var(--basic-darkgray);}
.tbl tbody tr{border-bottom: 1px solid var(--basic-pale);}
.tbl tbody tr td {  font: var(--16_body_normal_r); letter-spacing: 0.01em;  text-align: center; color: var(--basic-darkgray); padding: 0.625rem; height: 3.375rem;  background: var(--basic-white);}
.tbl tbody tr td.full_td{text-align: left; padding: 0.625rem 1.5rem;}
.tbl tbody tr td.full_td .link { display: -webkit-box;  word-wrap: break-word;   -webkit-line-clamp: 1;  -webkit-box-orient: vertical;  text-overflow: ellipsis;  overflow: hidden; transition: var(--transition);}
.tbl tbody tr td.full_td .link:hover {color: var(--brand-primary);}
.tbl tbody tr td .tbl_btn {font: var(--14_label_normal_sb); letter-spacing: 0.01em; color: var(--basic-white); background: var(--brand-primary); padding: 0.5rem 1rem; border-radius: 0.5rem;}
.tbl tbody tr td .icon { width: 1rem; display: inline-block; vertical-align: middle;}
.tbl tbody tr td .icon.icon_answer { width: 0.875rem;}
.tbl tbody tr td .no_post { gap: 0.625rem;  padding: 3rem 0;}
.tbl tbody tr td .no_post .icon {width: 2.5rem;}

.tbl.medium thead tr th { font: var(--14_label_normal_sb); padding: 0.875rem 0.625rem;}
.tbl.medium tbody tr td { font: var(--14_label_normal_r); height: 3rem;  padding: 0.625rem;}
.tbl.medium tbody tr td .notice_badge {font: var(--14_label_normal_m);color: var(--brand-primary); padding: 0.375rem 0.75rem; background: var(--basic-pointbg); border-radius: 6.25rem;}

.tbl.small thead tr th { font: var(--14_label_normal_sb); padding: 0.438rem 0.313rem;}
.tbl.small tbody tr td { font: var(--14_label_normal_r); height: 2.25rem;  padding: 0.313rem;}



/* pagination */
.pagination { display: flex;  align-items: center;}
.pagination .page {  border-radius: 6.25rem;  width: 2rem;  aspect-ratio: 1 / 1;  display: flex;  align-items: center;  justify-content: center;}
.pagination .page_btn{position: relative; }
.pagination .page_btn.prev{margin-right: 1.125rem;}
.pagination .page_btn.next{margin-left: 1.125rem;}
.pagination .page_btn::after {content: ""; background: no-repeat center/contain; width: 2rem; aspect-ratio: 1/1;}
.pagination .page_btn.start::after{background-image: url(../img/page_start.png);}
.pagination .page_btn.prev::after{background-image: url(../img/page_prev.png);}
.pagination .page_btn.next::after{background-image: url(../img/page_next.png);}
.pagination .page_btn.end::after{background-image: url(../img/page_end.png);}
.pagination .page_link, .pagination .page_ellipsis { font: var(--14_label_normal_r);  line-height: 100%; letter-spacing: 0.01em; text-align: center; color: var(--basic-middlegray);}
.pagination .page_link.active{font-weight: 600;color: var(--brand-primary);  background: var(--basic-pointbg);}



/* breadcrumb */
.breadcrumb {display: flex; align-items: center; gap: 0.875rem; font:var(--16_body_normal_m);letter-spacing: 0.01em;color: var(--basic-white);}
.breadcrumb .home {background: url(../img/breadcrumb_home.png) no-repeat center/contain; width: 1.125rem; aspect-ratio: 1/1; margin-bottom: 0.125rem;}
.breadcrumb .bar {width: 1px; height: 0.75rem; background: var(--basic-white);}
.breadcrumb .catebox {position: relative;}
.breadcrumb .catebox .cate_btn {display: flex; align-items: center; gap: 0.5rem; cursor: pointer; color: inherit; font:inherit}
.breadcrumb .catebox .cate_btn .arrow {background: url(../img/breadcrumb_arrow.png) no-repeat center/contain; width: 1rem; aspect-ratio: 1/1; transition: var(--transition);}
.breadcrumb .catebox .cate_popup {  left: 50%;  transform: translateX(-50%);  top: calc(100% + 0.625rem);  padding: 0.5rem; width: max-content;}
.breadcrumb .catebox .cate_popup .linkbox { display: flex; flex-direction: column;}
.breadcrumb .catebox .cate_popup .linkbox .link { padding: 0.375rem 1rem;  font: var(--16_body_normal_r);  color: var(--basic-darkgray); transition: var(--transition);}
.breadcrumb .catebox .cate_popup .linkbox .link.on { color: var(--brand-primary); font-weight: 600;}
.breadcrumb .catebox.show .catetit .arrow {transform: rotate(180deg);}
.breadcrumb .catebox.show .cate_popup { opacity: 1;  pointer-events: auto;}



/* modal */
.modal { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 100; background: rgba(0, 0, 0, 0.5); transition: var(--transition); pointer-events: none; opacity: 0;}
.modal.show { pointer-events: auto; opacity: 1;}
.modal .modal_box { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 1rem; background: var(--basic-white); box-shadow: 0 0.25rem 0.625rem 0 rgba(0, 0, 0, 0.1); padding: 2.5rem 1.875rem 1.875rem; min-width: 500px;  max-width: 90%; max-height: 90%; display: flex; flex-direction: column;  align-items: center; transition: var(--transition); margin-top: 2.5rem; opacity: 0; overflow: hidden;}
.modal.show .modal_box { margin-top: 0; opacity: 1;}
.modal .modal_box .modal_tit { font: var(--24_title_sb); letter-spacing: -0.02em;   text-align: center; color: var(--basic-black);  margin-bottom: 0.625rem;}
.modal .modal_box .modal_desc { font: var(--16_body_normal_r); letter-spacing: 0.01em;  text-align: center;  color: var(--basic-darkgray);}
.modal .modal_box .modal_btnbox { width: 100%; display: flex; justify-content: center;  gap: 0.625rem;  margin-top: 2.25rem;}
.modal .modal_box .modal_btnbox .modal_btn {  font: var(--16_body_normal_m);  letter-spacing: 0.01em; border: 1px solid var(--brand-primary); min-width: 6rem;  max-width: calc((100% - 0.5rem) / 2);  padding: 0 1.5rem; border-radius: 0.625rem; height: 2.75rem;}
.modal .modal_box .modal_btnbox .modal_btn.full {flex: 1; max-width: unset;}
.modal .modal_box .modal_btnbox .modal_btn.typeA {background: var(--brand-primary); color: var(--basic-white);}
.modal .modal_box .modal_btnbox .modal_btn.typeB {color: var(--brand-primary);}

.modal.ver2 .modal_box {padding: 1.875rem; align-items: unset;}
.modal.ver2 .modal_box .modal_head {display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; margin-bottom: 1.25rem;}
.modal.ver2 .modal_box .modal_head .tit{font: var(--20_heading_sb); letter-spacing: -0.01em; color: var(--basic-black);}
.modal.ver2 .modal_box .modal_head .modal_close{background: url(../img/modal_close.png) no-repeat center/contain; width: 1.5rem; aspect-ratio: 1/1;} 
.modal.ver2 .modal_box .modal_body {display: flex; flex-direction: column; gap: 1.875rem; overflow: auto;}
.modal.ver2 .modal_box .modal_body::-webkit-scrollbar {display: none;}
.modal.ver2 .modal_box .modal_btnbox {margin-top: 2rem;}



/* popup */
.popup { position: absolute; border-radius: 0.625rem; box-shadow: var(--box-shadow);  background: var(--basic-white); min-width: 6.25rem; display: flex; flex-direction: column; transition: var(--transition); opacity: 0; pointer-events: none; z-index: 100;}
.popup.show{opacity: 1; pointer-events: auto;}
.popup .pop_head {position: relative;}
.popup .pop_head .pop_close {background: url(../img/modal_close.png) no-repeat center/contain;}
.popup .pop_body {position: relative;}



/* swiper */
.swiper {width: 100%;}
.swiper.inner {width: 90%;}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after,
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {display: none;}
.swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal {z-index: 30;}

.swiper .paging {--paging_bg: var(--basic-black); --paging_bg2: var(--basic-middlegray); display: flex;  align-items: center;  justify-content: center;  gap: 0.5rem;}
.swiper .paging.white { --paging_bg: var(--basic-white);}
.swiper .paging .swiper-pagination-bullet { position: relative; width: 0.5rem;  height: 0.5rem;  background: var(--paging_bg2); border-radius: 10rem; transition: var(--transition); opacity: 0.4; margin: 0; transition: var(--transition);}
.swiper .paging .swiper-pagination-bullet.swiper-pagination-bullet-active {opacity: 1; width: 2rem;}

.swiper .paging.fraction { display: flex;align-items: center; justify-content: center;   gap: 0.188rem;  padding: 0.188rem 0.625rem; background:rgba(255, 255, 255, 0.7);  border-radius: 6.25rem;  width: auto; font: var(--13_label_m); letter-spacing: 0.01em;  color: var(--basic-darkgray);}
.swiper .paging.fraction.black {background:rgba(0, 0, 0, 0.7); color: var(--basic-white);}
.swiper .paging.fraction .current{font-weight: 600; letter-spacing: 0.02em;color: var(--basic-black);}
.swiper .paging.fraction.black .current {color: var(--basic-white);}

.swiper .progressbar { position: relative; left: auto;  bottom: auto; top: auto;  width: 100%; height: 4px; border-radius: 6.25rem; margin-top: 2.5rem; background: var(--basic-border);}
.swiper .progressbar .swiper-pagination-progressbar-fill { background: var(--basic-darkgray);  border-radius: 6.25rem;}

.swiper .scrollbar { position: relative; left: auto;  bottom: auto; top: auto;  width: 100%; height: 4px; border-radius: 6.25rem; margin-top: 2.5rem; background: var(--basic-pale); }
.swiper .scrollbar .swiper-scrollbar-drag { background: var(--basic-middlegray);  border-radius: 6.25rem;}

.slidebox .prev_btn, .slidebox .next_btn{background: no-repeat center/contain; border-radius: 50%; width:3rem;  height: unset;  aspect-ratio: 1 / 1; transition: var(--transition);}
.slidebox .prev_btn{background-image: url(../img/slider_prev1.png);left: 5%;} 
.slidebox .next_btn{background-image: url(../img/slider_next1.png);right: 5%;}
.slidebox .prev_btn.white{background-image: url(../img/slider_prev2.png);left: 5%;} 
.slidebox .next_btn.white{background-image: url(../img/slider_next2.png);right: 5%;}

.slidebox .paging {--paging_bg: var(--basic-black); --paging_bg2: var(--basic-middlegray); display: flex;  align-items: center;  justify-content: center;  gap: 0.5rem;}
.slidebox .paging.white { --paging_bg: var(--basic-white);}
.slidebox .paging .swiper-pagination-bullet { position: relative; width: 0.5rem;  height: 0.5rem;  background: var(--paging_bg2); border-radius: 10rem; transition: var(--transition); opacity: 0.4; margin: 0; transition: var(--transition);}
.slidebox .paging .swiper-pagination-bullet.swiper-pagination-bullet-active {opacity: 1; width: 2rem;}




/* calender */
.calender {border: 1px solid var(--basic-border); border-radius: 0.625rem; padding: 1rem 1.25rem; background: var(--basic-white); display: flex; flex-direction: column; gap: 1.25rem;}
.calender .cal_head{display: flex; align-items: center; justify-content: space-between;}
.calender .cal_head .date{font: var(--16_body_normal_sb);line-height: 150%;letter-spacing: 0.01em;color: var(--basic-black);}
.calender .cal_head .control{display: flex; align-items: center; gap: 0.5rem;}
.calender .cal_head .control .cal_btn{background: no-repeat center/contain; width: 1rem; aspect-ratio: 1/1;}
.calender .cal_head .control .cal_btn.prev{background-image: url(../img/datepicker_prev.png);}
.calender .cal_head .control .cal_btn.next{background-image: url(../img/datepicker_next.png);}
.calender .cal_body {  font: var(--14_label_normal_m); letter-spacing: 0.01em; color: var(--basic-darkgray); display: flex; flex-direction: column; gap: 0.438rem;}
.calender .cal_body .week_day {  display: flex; gap: 0.438rem;}
.calender .cal_body .week_day .day {  width: 1.75rem;  aspect-ratio: 1 / 1; display: flex; align-items: center;  justify-content: center;}
.calender .cal_body .week_day .day.red{color: var(--state-error);}
.calender .cal_body .week_day .day.blue{color: var(--state-info);}
.calender .cal_body .week_date {    display: flex; gap: 0.438rem;}
.calender .cal_body .week_date .date {  width: 1.75rem; aspect-ratio: 1 / 1; display: flex; align-items: center;  justify-content: center; border-radius: 0.5rem;}
.calender .cal_body .week_date .date.hide { color: var(--basic-lightgray); pointer-events: none;}
.calender .cal_body .week_date .date.enabled { background: var(--state-success); color: var(--basic-white);}
.calender .cal_body .week_date .date.confirmed{background: var(--state-warning); color: var(--basic-white);}
.calender .cal_body .week_date .date.checking{background: var(--state-error); color: var(--basic-white);}
.calender .cal_body .week_date .date.disabled{background: var(--basic-border); color: var(--basic-white);}

.calender_wrap {display: flex; align-items: flex-start; gap: 1rem;}
.calender_wrap .calender.ver2 {width: 50%;}
.calender.ver2 { border: none; border-radius: 0; padding: 0; gap: 0.75rem;}
.calender.ver2 .cal_head { padding: 0 0.75rem;}
.calender.ver2 .cal_head .cal_date { display: flex; align-items: center;}
.calender.ver2 .cal_head .cal_date .date_select { font: var(--16_body_normal_sb);  letter-spacing: 0.01em;  color: var(--basic-black); border: none;  border-radius: 0;  background: none; appearance: none; cursor: pointer; padding: 0 0.375rem;}
.calender.ver2 .cal_head .cal_btn {background: no-repeat center/contain; width: 1.5rem; aspect-ratio: 1/1;}
.calender.ver2 .cal_head .cal_btn.prev{background-image: url(../img/datepicker_prev.png);}
.calender.ver2 .cal_head .cal_btn.next{background-image: url(../img/datepicker_next.png);}
.calender.ver2:nth-child(1) .cal_head .cal_btn.next,
.calender.ver2:nth-child(2) .cal_head .cal_btn.prev {opacity: 0; pointer-events: none;}
.calender.ver2 .cal_body { gap: 0.25rem;}
.calender.ver2 .cal_body .week_day { gap: 0;}
.calender.ver2 .cal_body .week_day .day {width: auto; flex: 1;}
.calender.ver2 .cal_body .week_date { gap: 0;}
.calender.ver2 .cal_body .week_date .date { width: auto; flex: 1;  flex-direction: column; gap: 0.125rem; padding: 0.25rem 0; cursor: pointer;  border-radius: 0; border: 1px solid transparent;}
.calender.ver2 .cal_body .week_date .date::after {  content: "";  font: var(--10_caption_r); color: var(--brand-primary); white-space: nowrap; min-height: 1.273em;}
.calender.ver2 .cal_body .week_date .date.period { color: var(--brand-primary);  background: var(--basic-pointbg); border-color: var(--basic-pointbg);}
.calender.ver2 .cal_body .week_date .date.selected {color: var(--brand-primary);  background: var(--basic-pointbg); border-color: var(--basic-pointbg);  border: 1px solid var(--brand-primary); border-radius: 0.25rem;}
.calender.ver2 .cal_body .week_date .date.selected.flightDate::after {content: "비행일";}
.calender.ver2 .cal_body .week_date .date .price { font: var(--10_caption_r);color: var(--basic-darkgray);  white-space: nowrap; min-height: 1.273em; opacity: 0;}
.calender.ver2 .cal_body .week_date .date.hide .price {opacity: 0;}
.calender.ver2 .cal_body .week_date .date.selected .price {opacity: 1; color: var(--brand-primary);}



/* no post */
.no_post {display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; padding: 7.5rem 0;}
.no_post .icon{background: url(../img/no_post.png) no-repeat center/contain; width: 3.125rem; aspect-ratio: 1/1;}
.no_post .txt{font: var(--16_body_normal_m);letter-spacing: 0.01em; color: var(--basic-lightgray);}



/* dot text  */
.dot_txt {position: relative; font: var(--14_label_normal_r); letter-spacing: 0.01em; color: var(--basic-darkgray); padding-left: 0.875rem;}
.dot_txt::before {content: ""; position: absolute; left: 0; top: 0.563em; width: 0.188rem; aspect-ratio: 1/1; border-radius: 50%; background: var(--basic-darkgray);}
.dot_txt .bold {font-weight: 600; color: var(--basic-black);}



/* terms */
.term_area {display: flex; flex-direction: column; gap: 1.5rem;}
.term_area .term_txtbox{display: flex; flex-direction: column; gap: 0.255rem;}
.term_area .term_txtbox .title{font:var(--15_body_normal_sb); letter-spacing: 0.01em;
color: var(--basic-darkgray);}
.term_area .term_txtbox .sub{font:var(--14_label_normal_sb);letter-spacing: 0.01em;
color: var(--basic-darkgray);}
.term_area .term_txtbox .desc{font: var(--13_label_r); letter-spacing: 0.02em; color: var(--basic-middlegray);}
.term_area .term_txtbox .dot_txt.desc {padding-left: 0.625rem;}
.term_area .term_txtbox .dot_txt.desc::before {top: 0.375rem;}



/* date popup */
.date_popup .modal_box {width: 44.25rem;}



/* photo popup */
.photo_modal .modal_box {width: 79rem;}
.modal.photo_modal .modal_box .modal_body {border: 2px solid var(--basic-border); border-radius: 1rem; padding: 1rem; background: var(--basic-bg2); gap: 0.5rem;}
.photo_modal .photo_list { width: 100%;}
.photo_modal .photo_list .item { display: flex; align-items: center;  justify-content: center;}
.photo_modal .photo_list .item .img {  width: 100%; max-height: 34.188rem; object-fit: cover;  border-radius: 1rem;}
.photo_modal .photo_list .prev_btn,
.photo_modal .photo_list .next_btn{width: 3.75rem; height: unset; aspect-ratio: 1/1; background: no-repeat center/contain;}
.photo_modal .photo_list .prev_btn{background-image: url(../img/rv_photo_prev.png); left: 3.125rem;}
.photo_modal .photo_list .next_btn{background-image: url(../img/rv_photo_next.png); right: 3.125rem;}
.photo_modal .photo_thum { width: 100%; }
.photo_modal .photo_thum .item { width: calc((100% - 8px * 9) / 10);  aspect-ratio: 1 / 1;  border-radius: 0.375rem; overflow: hidden;  overflow: hidden; display: flex; align-items: center; justify-content: center; cursor: pointer;}
.photo_modal .photo_thum .item::after {content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%; border-radius: 0.375rem; border: 3px solid var(--brand-secondary); opacity: 0; transition: var(--transition); box-sizing: border-box;}
.photo_modal .photo_thum .item.swiper-slide-thumb-active::after {opacity: 1;}
.photo_modal .photo_thum .item .img {width: 100%; height: 100%; object-fit: cover;}



/* term popup */
.term_popup .modal_box {width: 62.5rem;}
.term_popup .modal_box .modal_body {border: 1px solid var(--basic-border);border-radius: 0.75rem; padding: 1.25rem;}
.term_popup .modal_box .modal_body .term_area { max-height: 29.75rem; overflow: auto; padding-right: 1.25rem;}.prd_slidewrap{position: relative;}



/* product swiper */
.prd_swiper {border-radius: 0.75rem 0.75rem 0 0;}
.prd_swiper .item {width: calc((100% - 20px*3)/4); display: flex; flex-direction: column; gap: 0.75rem;}
.prd_swiper .item .imgbox{position: relative; display: flex; width: 100%; aspect-ratio: 1 / 0.6667; box-shadow: var(--box-shadow); border-radius: 0.75rem; overflow: hidden;}
.prd_swiper .item .imgbox .img{width: 100%; height: 100%; object-fit: cover; transition: var(--transition);}
.prd_swiper .item .imgbox .top {  position: absolute;  left: 0.625rem;   bottom: 0.625rem; display: flex;  align-items: center;  gap: 0.25rem;  background: var(--brand-primary);  border-radius: 0.25rem;  padding: 0.313rem 0.5rem;  font: var(--10_caption_sb); font-family: var(--second-family); line-height: 100%;  letter-spacing: 0.06em;  text-transform: uppercase;  color: var(--basic-white);}
.prd_swiper .item .txtbox {display: flex; flex-direction: column; gap: 0.25rem;}
.prd_swiper .item .txtbox .titbox {display: flex; flex-direction: column; align-items: flex-start; gap: 0.125rem;}
.prd_swiper .item .txtbox .titbox .tit {  position: relative;  max-width: 100%;  font: var(--20_heading_sb); letter-spacing: -0.01em;  color: var(--basic-black);   white-space: nowrap;  overflow: hidden;  text-overflow: ellipsis;}
.prd_swiper .item .txtbox .titbox .desc { width: 100%;  font: var(--16_body_normal_r); letter-spacing: 0.01em; color: var(--basic-darkgray);  white-space: nowrap;  overflow: hidden; text-overflow: ellipsis;}
.prd_swiper .item .txtbox .pricebox{display: flex; flex-wrap: wrap; align-items: center; gap: 0.375rem 0.5rem;}
.prd_swiper .item .txtbox .pricebox .price{font: var(--18_headline_m);color: var(--basic-darkgray);}
.prd_swiper .item .txtbox .pricebox .ori {font: var(--16_body_normal_m);letter-spacing: 0.01em;text-decoration: line-through;color: var(--basic-lightgray);}
.prd_swiper .item .txtbox .detailbox {display: flex; align-items: center; gap: 1rem; margin-bottom: 0.5rem;}
.prd_swiper .item .txtbox .detailbox .de_item {display: flex; align-items: center; gap: 0.25rem; font:var(--16_body_normal_r); line-height: 100%; letter-spacing: 0.01em; color: var(--basic-darkgray);}
.prd_swiper .item .txtbox .detailbox .de_item .icon {width: 1.125rem;}
.prd_swiper .item:hover .imgbox .img {transform: scale(1.1);}
.prd_slidebox .prev_btn.swiper-button-disabled, 
.prd_slidebox .next_btn.swiper-button-disabled {opacity: 0;}
.prd_slidebox .prev_btn, .prd_slidebox .next_btn { top: 5rem;  margin-top: 0; width: 2.25rem;}
.prd_slidebox .prev_btn { left: 1.5rem; background-image: url(../img/slider_prev2.png);}
.prd_slidebox .next_btn { right: 1.5rem; background-image: url(../img/slider_next2.png);}
.prd_slidebox .no_post { min-height: 19.545rem; padding: 6.25rem 0; border-top: 1px solid var(--basic-border); border-bottom: 1px solid var(--basic-border);}