.si_inner {
  max-width: 1820px;
  margin: 0 auto;
  width: 100%;
}

.sub_visual {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  height: 640px;
  padding-bottom: 90px;
  color: #fff;
  background: #222;
}
.sub_visual.sub_visual_bg01 {
  background: url(/img/sub_visual_bg01.png) no-repeat center/cover;
}
.sub_visual.sub_visual_bg02 {
  background: url(/img/sub_visual_bg02.png) no-repeat center/cover;
}
.sub_visual.sub_visual_bg03 {
  background: url(/img/sub_visual_bg03.png) no-repeat center/cover;
}
.sub_visual.sub_visual_bg04 {
  background: url(/img/sub_visual_bg04.png) no-repeat center/cover;
}
.sub_visual.sub_visual_bg05 {
  background: url(/img/sub_visual_bg05.png) no-repeat center/cover;
}
.sub_visual .breadcrumb ol {
  display: flex;
  gap: 20px;
  margin-bottom: 60px;
  color: #ccc;
}
.sub_visual .breadcrumb li {
  display: flex;
  gap: 20px;
    align-items: center;
}
.sub_visual .breadcrumb li::after {
  content: url(/img/bread_arrow.png);
}
.sub_visual .breadcrumb li:last-child::after {
  display: none;
}
.sub_visual h2 {
  font-size: 7.5rem;
  font-weight: 800;
  margin-bottom: 10px;
}
.sub_visual p {
  font-size: 1.5rem;
}

.sub_nav {
  background: #222;
  color: #fff;
}
.sub_nav ul {
  display: flex;
}
.sub_nav a {
  display: block;
  min-width: 240px;
  height: 80px;
  line-height: 80px;
  text-align: center;
  font-size: 1.125rem;
  opacity: 0.3;
}
.sub_nav .active a {
  background: #111;
  opacity: 1;
  text-decoration: underline;
  text-underline-offset: 8px;
  text-decoration-thickness: 3px;
}

.sub-title-split .char {
  opacity: 0;
  transform: translateY(-20px);
  animation: subTitleDown 1s cubic-bezier(0.33, 1, 0.68, 1) forwards;
  animation-delay: calc(0.05s * var(--char-index));
}
@keyframes subTitleDown {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media screen and (max-width: 1280px) {
	.sub_nav ul{overflow-x: scroll;}
	.sub_nav a{min-width: 160px;}
}
/* 샘플페이지 */

.sub_process {
  padding-bottom: 150px;
}

.sub_process .intro {
  text-align: center;
  padding: 150px 0;
  background: #f1f1f1;
}
.sub_process .intro h3 {
  font-size: 3.5rem;
  font-weight: 700;
  margin-bottom: 50px;
}
.sub_process .intro strong {
  display: block;
  margin-bottom: 30px;
  font-size: 1.5rem;
  font-weight: 800;
}
.sub_process .intro p {
  font-size: 1.25rem;
  line-height: 1.5em;
}

/* 탭 */
.proc_tabs {
  display: flex;
  gap: 40px;
  padding: 150px 0 40px;
}
.proc_tabs li {
  flex: 1;
  position: relative;
  height: 190px;
  border: 1px solid #ccc;
  border-radius: 10px;
}
.proc_tabs button {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  padding: 30px;
  font-size: 1.25rem;
  font-weight: 700;
}
.proc_tabs span {
  margin-bottom: 15px;
  font-size: 1rem;
  color: var(--color-primary);
}
.proc_tabs img {
  position: absolute;
  right: 30px;
  bottom: 30px;
}
.proc_tabs img.on{display: none}
.proc_tabs img.default{display: block;}

.proc_tabs li.active {
  color: #fff;
  background: var(--color-primary);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
}

.proc_tabs li.active button,
.proc_tabs li.active button span {
  color: #fff;
}

.proc_tabs li.active button img.on{display: block}
.proc_tabs li.active button img.default{display: none}

.proc_tabs li::after {
  content: url(/img/process_arrow.png);
  position: absolute;
  top: 50%;
  right: -22px;
  transform: translateY(-50%);
}
.proc_tabs li:last-child::after {
  display: none;
}

/* 본문 */
.proc_stage {
  display: flex;
  gap: 40px;
}
.proc_swiper {
  width: 60%;
	border-radius: 20px;
}
.proc_swiper .img_wrap {
  overflow: hidden;
  border-radius: 20px;
  height: 640px;
}
.proc_swiper img,
.proc_swiper video{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.proc_copy {
  width: 40%;
  padding: 80px;
  border-radius: 20px;
  background: #f1f1f1;
  position: relative;
}
.proc_copy em {
  display: block;
  margin-bottom: 100px;
  font-size: 1.25rem;
  font-weight: 700;
  font-style: normal;
  color: var(--color-primary);
  font-family: "pretendard";
}
.proc_copy h3 {
  font-size: 3.5rem;
  font-weight: 700;
  margin-bottom: 15px;
  letter-spacing: -0.02em;
}
.proc_copy p {
  font-size: 1.25rem;
  line-height: 1.5em;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: #333333;
	word-break: keep-all;
}

/* creative 효과 레이어 안정화 */
.proc_swiper .swiper-slide {
  z-index: 1;
}
.proc_swiper .swiper-slide-prev,
.proc_swiper .swiper-slide-next {
  z-index: 2;
}
.proc_swiper .swiper-slide-active {
  z-index: 3;
}

.proc_nav .swiper-button-prev,
.proc_nav .swiper-button-next {
  width: 72px;
  height: 72px;
  left: 80px;
  bottom: 80px;
  top: unset;
  opacity: 1;
}
.proc_nav .swiper-button-prev.swiper-button-disabled, .proc_nav .swiper-button-next.swiper-button-disabled{
	opacity: 0.4;
}
.proc_nav .swiper-button-next {
  left: 160px;
}

.sub_title h2 {
  text-align: center;
/*  font-size: 2.5rem;*/
  margin-bottom: 60px;
}

.sub_board {
  max-width: 1860px;
  width: 100%;
  margin: 0 auto;
  padding: 150px 20px;
}

#bo_cate_wrap ul {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 60px;
}

#bo_cate_wrap ul li a {
  display: block;
  border-radius: 50px;
  padding: 10px 20px;
  background: #f1f1f1;
}

#bo_cate_wrap ul li a#bo_cate_on {
  background: var(--color-primary);
  color: #fff;
}

.current_menu {
  display: none;
}

@media screen and (max-width: 1820px) {
  .si_inner {
    padding: 0 20px;
  }

  .proc_tabs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
  }
}

@media screen and (max-width: 1440px) {
  .sub_visual h2 {
    font-size: 5rem;
  }
}
@media screen and (max-width: 1080px) {
	.sub_board { padding: 75px 20px;}
}
@media screen and (max-width: 1024px) {
  .proc_stage {
    flex-direction: column;
  }

  .proc_swiper,
  .proc_copy {
    width: 100%;
  }

    .proc_nav .swiper-button-prev,
  .proc_nav .swiper-button-next {
    display: block;
    position: unset;
    transform: unset;
    width: 36px;
    height: 36px;
    margin: 0;
  }

  .proc_nav .swiper-button-prev img,
  .proc_nav .swiper-button-next img {
    width: 100%;
  }

  .proc_nav {
    margin-top: 30px;
    height: 32px;
    gap: 5px;
    display: flex;
  }

}

@media screen and (max-width: 768px) {
  .proc_tabs {
    grid-template-columns: repeat(2, 1fr);
  }

  .current_menu {
    display: block;
    padding: 20px 0;
    font-size: 1.25rem;
    position: relative;
  }

  .sub_nav {
    position: relative;
  }

  .sub_nav ul {
    position: absolute;
    max-height: 0;
    z-index: 10;
    flex-direction: column;
    color: #000;
    background: #fff;
    border-radius: 10px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    top: 70px;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 40px);
    overflow: hidden;
    transition: 0.3s all;
  }

  .sub_nav.active ul {
    max-height: 600px;
  }

  .sub_nav li:first-child a {
    padding-top: 20px;
  }

  .sub_nav li:last-child a {
    padding-bottom: 20px;
  }

  .sub_nav a {
    padding: 12px 20px;
    line-height: unset;
    height: unset;
    text-align: left;
    opacity: 1;
    font-size: 0.75rem;
  }

  .sub_nav .active a {
    background-color: #fff;
    text-decoration: none;
  }

  .current_menu::after {
    content: url(/img/menu_arrow_down.png);
    display: block;
    position: absolute;
    top: 20px;
    right: 20px;
  }

  .current_menu.active::after {
    transform: rotate(180deg);
  }

  .sub_process .intro h3 {
    font-size: 3.75rem;
    margin-bottom: 35px;
  }

  .sub_process .intro strong {
    font-size: 1.25rem;
    margin-bottom: 15px;
  }

  .sub_process .intro p {
    font-size: 15px;
  }


}

@media screen and (max-width: 512px) {
  .proc_tabs {
    gap: 25px;
  }

  .sub_visual .breadcrumb ol {
    font-size: 0.6875rem;
    margin-bottom: 40px;
  }

  .sub_visual {
    height: 350px;
    padding-bottom: 50px;
  }
  .current_menu {
    font-size: 0.75rem;
  }

  .sub_visual h2 {
    font-size: 2.625rem;
  }

  .sub_visual p {
    font-size: 15px;
    line-height: 1.5em;
  }
	.sub_visual p br{display: none;}
  .sub_process .intro {
    padding: 75px 0;
  }

  .sub_process .intro h3 {
    font-size: 2.25rem;
    margin-bottom: 35px;
  }

  .sub_process .intro strong {
    font-size: 1rem;
    margin-bottom: 15px;
  }

  .sub_process .intro p {
    font-size: 0.75rem;
  }

  .sub_process .intro p br {
    display: none;
  }

  .sub_process .intro p br.br_m {
    display: inline;
  }

  .proc_tabs {
    padding: 75px 0px 25px;
  }

  .proc_tabs button {
    padding: 15px;
    font-size: 0.935rem;
  }

  .proc_tabs li {
    height: 100px;
  }

  .proc_tabs li img {
    width: 30%;
    right: 15px;
    bottom: 15px;
  }

  .proc_swiper .img_wrap {
    height: 250px;
    border-radius: 10px;
  }

  .proc_stage {
    gap: 10px;
    border-radius: 10px;
  }

  .proc_copy {
    padding: 30px;
  }

  .proc_copy em {
    font-size: 0.75rem;
    margin-bottom: 30px;
  }

  .proc_copy h3 {
    font-size: 2.25rem;
  }

  .proc_copy p {
    font-size: 0.75rem;
  }


  .sub_process {
    padding-bottom: 75px;
  }
}



/*common*/
p{line-height: 1.5; word-break: keep-all;}

.fs_64{font-size: 4rem;}
.fs_56{font-size: 3.5rem;}
.fs_36{font-size: 2.25rem;}
.fs_24{font-size: 1.5rem;}
.fs_20{font-size: 1.25rem;}
.fs_18{font-size: 1.125rem;}
.fs_16{font-size: 1rem;}

@media screen and (max-width: 1080px){
	.fs_64{font-size: 36px;}
	.fs_56{font-size: 32px;}
	.fs_36{font-size: 24px;}
	.fs_24{font-size: 18px;}
	.fs_20{font-size: 14px;}
	.fs_18{font-size: 12px;}
	.fs_16{font-size: 12px;}
}

.fw_m{font-weight: 500;}
.fw_b{font-weight: 700;}
.fw_eb{font-weight: 800;}

.fc_f{color: #fff;}
.fc_9{color: #999;}
.fc_b{color: var(--color-primary)}

.br_1280o{display: none;}
@media screen and (max-width: 1280px){
	.br_1280x{display: none;}
	.br_1280o{display: block;}
}
.br_768o{display: none;}
@media screen and (max-width: 768px){
	.br_768x{display: none;}
	.br_768o{display: block;}
}
.br_480o{display: none;}
@media screen and (max-width: 480px){
	.br_480x{display: none;}
	.br_480o{display: block;}
}

.sub_pd .intro{padding: 150px 0; }
@media screen and (max-width: 1080px){
	.sub_pd .intro{padding: 75px 0; }
}
/*common*/

/*page0103*/
.ci_wrap{display: flex;}
.ci_wrap .ci_left{width: 45%}
.ci_wrap .ci_right{width: 55%}

.ci_wrap .ci_left p{margin-top: 20px;}
.ci_wrap .ci_left a{margin-top: 50px;}

.ci_img{border-radius: 20px; overflow: hidden; border:solid 2px #ccc;}
.ci_img img{display: block; width: 100%;}
.ci_img img.mo_ver{display: none;}

.ci_color_wrap{display: flex; flex-direction: column; gap:20px;}
.ci_color{padding: 40px; height: 300px; border-radius: 20px; display: flex; flex-direction: column; position: relative;}
.ci_color .ci_txt{position: absolute; right: 40px; bottom: 40px; display: flex; flex-direction: column; gap:20px;}
.ci_txt ul li{margin-bottom: 5px;}
.ci_txt ul li span{font-family: "Pretendard", sans-serif;}
.ci_txt ul li span.ci_code{width: 70px; display: inline-block;}

@media screen and (max-width: 1280px){
	.ci_wrap{flex-direction: column; gap:80px;}
	.ci_wrap .ci_left,
	.ci_wrap .ci_right{width: 100%}
}
@media screen and (max-width: 768px){
	.ci_wrap{gap:50px;}
	.ci_wrap .main_title h2{margin-bottom: 0;}
	.ci_wrap .main_title a{margin-top: 20px;}
	
	.ci_img img.mo_ver{display: block;}
	.ci_img img.pc_ver{display: none;}
	
	.ci_color_wrap{ gap:10px;}
	.ci_color{padding: 20px; height: 200px;}
	.ci_color .ci_txt{right: 20px; bottom: 20px; gap:10px;}
	.ci_txt ul li span.ci_code{width: 50px;}
}
/*page0103*/

/*page0105*/
.loca_wrap .main_title{text-align: center;}
.loca_wrap .main_title p{font-family: "Pretendard", sans-serif;}

.map_wrap{margin-top: 80px; display: flex; flex-direction: column; gap:20px; }
.map_info{display: flex; gap:20px;}
.map_info li{display: flex; gap:30px; border: solid 1px #ccc; border-radius: 20px; width: 33.3%;padding: 30px; align-items: center;}
.map_info li img{display: block;}

@media screen and (max-width: 1280px){
	.loca_wrap .main_title h2{margin-bottom: 0;}
	.map_info li{padding: 20px;}
}
@media screen and (max-width: 768px){
	.map_info{flex-direction: column; gap:10px;}
	.map_info li{width: 100%; gap:15px;}
	.map_info li img{width: 36px;}
}
/*page0105*/

/*page0203*/
.mis_wrap{display: flex; gap: 80px;flex-direction: column;}
.mis_wrap .sub_content{margin-left: 25%;}
.mis_cont_wrap{display: flex; gap: 30px; width: 100%;}
.mis_cont_wrap.mo_ver{display:none;}
.mis_cont_wrap li{width: 33%; height: 100%; overflow: hidden; background-color: antiquewhite; border-radius: 20px; position: relative;
    /* display: flex; flex-direction: column; justify-content: flex-end; */
}
.mis_cont_wrap li:first-child{margin-top: 80px;}
.mis_cont_wrap li:nth-child(2){margin-top: -60px;}
.mis_cont_wrap li .mis_bg img{width: 100%; display: block;}
.mis_cont_wrap li .mis_txt{position: absolute; left: 40px; bottom: 40px;}
.mis_cont_wrap li .mis_txt img{width: 36px;}
.sub_content .mis_cont_wrap h3{margin: 50px 0 20px!important;}

@media screen and (max-width: 1480px){
	.mis_wrap .sub_content{margin-left: 15%;}
}
@media screen and (max-width: 1280px) {
    .mis_cont_wrap{gap: 15px;}
    .mis_cont_wrap li .mis_txt{left: 20px; bottom: 20px;  width: 90%;}
}
@media screen and (max-width: 1080px){
    .mis_wrap .sub_content{margin-left: 0;}
    .mis_cont_wrap.mo_ver{display: flex; gap: 1vw;  width: 100%; flex-wrap: wrap; flex-direction: row-reverse;}
    .mis_cont_wrap.pc_ver{display:none;}

    .mis_cont_wrap li{width: calc(50% - 0.5vw);}
    .mis_cont_wrap li:nth-child(2){margin-top: 0; transform: translateY(50%);}
    .mis_cont_wrap li .mis_txt{left: 30px; bottom: 30px;}
    .sub_content .mis_cont_wrap h3{margin: 20px 0 10px!important;}
}
@media screen and (max-width: 480px){
	.mis_wrap{gap:0;}
	.mis_cont_wrap li{width: 100%}
	.mis_cont_wrap li:nth-child(2){transform: none;}
	.mis_cont_wrap li .mis_txt img{width: 24px;}
}

.vis_cont_wrap{
	display: flex;
    justify-content: center; /* 가운데 정렬 */
    align-items: flex-start; /* 상단 정렬 */
    gap: 100px; /* 좌우 컬럼 간의 간격 */
}
.vis_cont_wrap.mo_ver{display: none;}
.vis_left,
.vis_right {
    display: flex;
    flex-direction: column; /* 세로 방향으로 아이템 정렬 */
    gap: 230px; /* 각 항목 사이의 간격 */
    flex: 1; /* 남은 공간을 균등하게 차지 */
	width: 50%;
}
.vis_left{margin-top: 500px;}
.vis_cont{
	 display: flex;
	flex-direction: column;
    gap: 50px;
}

.vis_txt{flex: 1;}
.vis_txt .vis_num{display: inline-block; padding: 5px 15px; background: var(--color-primary); border-radius: 20px; font-family: "Pretendard", sans-serif;}
.vis_txt h3{margin: 50px 0 20px;}

.vis_img{flex: 1; width: 100%; border-radius: 20px; overflow: hidden;}
.vis_img img{display: block; width: 100%;}
.vis_img video{display: block; width: 100%;}

@media screen and (max-width: 1280px){
	.vis_left, .vis_right{gap:250px;}
	.vis_left{margin-top: 320px;}
	.vis_txt h3{margin: 30px 0 10px;}
}
@media screen and (max-width: 1080px){
	.vis_cont_wrap{gap:50px; margin-top: 80px;}
	.vis_left, .vis_right{gap:150px;}
	.vis_cont{gap:30px;}
}
@media screen and (max-width: 768px){
	.vis_cont_wrap.mo_ver{display: flex; flex-direction: column; gap:100px;}
	.vis_cont_wrap.pc_ver{display: none;}
	.vis_txt .vis_num{padding: 3px 10px;}
}
/*page0203*/

/*page0403*/
.net_cont_wrap{
	display: flex;
    justify-content: center; /* 가운데 정렬 */
    align-items: flex-start; /* 상단 정렬 */
    gap: 40px; /* 좌우 컬럼 간의 간격 */
}
.net_cont_wrap.mo_ver{display: none;}
.net_left,
.net_right {
    display: flex;
    flex-direction: column; /* 세로 방향으로 아이템 정렬 */
    gap: 40px; /* 각 항목 사이의 간격 */
    flex: 1; /* 남은 공간을 균등하게 차지 */
	width: 50%;
}
.net_left{margin-top: 80px;}
.net_cont{
	 display: flex;
	flex-direction: column;
    gap: 30px;
	background: #f5f5f5;
	border-radius: 20px;
	padding: 40px;
}
.net_tit{display: flex; justify-content: space-between; align-items: center;}
.net_txt_wrap {display: flex; flex-direction: column; gap:10px;}
.net_txt_wrap ul{background: #fff; border-radius: 20px; padding: 40px;}
.net_txt_wrap ul li{display: flex; align-items: center; gap:20px;}
.net_txt_wrap ul li:first-child{margin-bottom: 20px;}
.net_txt_wrap ul li div{display: flex; align-items: center; gap:5px; flex-shrink: 0;}
.net_txt_wrap ul li img{display: block;width: 24px;}

@media screen and (max-width: 1280px){
	.net_cont_wrap{gap:20px; margin-top: 80px;}
	.net_left, .net_right{gap:20px}
	.net_cont{gap:20px; padding: 20px;}
	.net_txt_wrap ul{padding: 20px;}
	.net_txt_wrap ul li:first-child{margin-bottom: 10px;}
	.net_txt_wrap ul li img{width: 18px;}
}
@media screen and (max-width: 768px){
	.net_cont_wrap.mo_ver{display: flex; flex-direction: column;}
	.net_cont_wrap.pc_ver{display: none;}
	.net_cont{width: 100%;}
	.net_tit img{width: 32px;}
	.net_txt_wrap ul li{gap:10px;}
	.net_txt_wrap ul li p{word-break: break-all;}
}
/*page0403*/


/*001 개인정보처리방침*/
.support_subtxt h2{margin: 150px 0 50px; font-family: "Pretendard", sans-serif;}
.info_t span{font-family: "Pretendard", sans-serif;}
.info_t p{line-height: 1.5; color: #333; word-break: keep-all; font-family: "Pretendard", sans-serif;}
.info_p01 {
	margin-top: 20px;
	font-weight:500;
}
.info_p02 {
	margin-top: 20px;
	font-weight:500;
	padding: 40px 50px;
	background: #f9f9f9;
}
.info_wrap{margin-bottom: 20px; }
.info_wrap:last-child{margin-bottom: 0; }
.info_wrap p{margin-bottom: 10px;}
.info_wrap p:last-child{margin-bottom: 0;}
.pri_line {
	width: 100%;
	height: 1px;
	margin: 30px auto;
	border-top: 1px solid #d9d9d9;
}
.qna_info em {
	font-style: normal;
	display: block;
	margin-left: 18px;
	margin-bottom: 10px;
}

.pri_top_txt{margin-bottom: 100px;}
.pri_bottom_txt{margin-top: 100px;}

@media screen and (max-width:1080px){
	.info_p02{padding: 30px; margin-top: 20px}
}
@media screen and (max-width:768px){
	.info_p02{padding: 20px;}
	.info_t>span{font-size: 16px;}
}
/*001 개인정보처리방침*/


/*제품 서브 텍스트*/
.pro_sub_txt{text-align: center;}
.pro_sub_txt p{font-size: 1.25rem; line-height: 1.5em; color:var(--color-primary); font-weight: 500}


/*영문*/
.sub_visual.sub_visual_en p,
#bo_v_con p{font-family: "Pretendard", sans-serif;}
.main_title.main_title_en h2 {
  font-size: 3.125rem;
  text-transform: none;
}
.en_family{font-family: "Pretendard", sans-serif; font-weight: 400;}

@media screen and (max-width:512px){
	.main_title.main_title_en h2 {
		font-size: 2rem;
		margin-bottom: 40px;
	  }
}


.proc_tabs.proc_tabs_en button{text-align: left; padding: 20px;}
.proc_copy.proc_copy_en em{margin-bottom: 60px;}
.proc_copy.proc_copy_en p{font-family: "Pretendard", sans-serif;}
.proc_copy_en .proc_nav .swiper-button-prev, 
.proc_copy_en .proc_nav .swiper-button-next{bottom: 40px;}

@media screen and (max-width:512px){
	.proc_tabs.proc_tabs_en li{height: 130px;}
	.proc_tabs.proc_tabs_en button{padding: 15px;}
}

.mis_cont_wrap.mis_cont_wrap_en li .mis_txt p{width:90%}
/*영문*/