/**************************************************
* 버전관리
* version : v=1
* Last Update : 
**************************************************/

/********************************************************
■ 공통
********************************************************/
:root {
	--color-blue: #4488F9;
	--color-deepblue: #0E65BC;
}
.content_body {padding: var(--num-50) 0 var(--num-70); letter-spacing: -0.065em;}
.con {margin:0 auto; padding:0 var(--side-padding); width:100%; max-width: var(--content-width); font-size:var(--font-size-15);}
.upper {text-transform: uppercase;}
.sct {margin-top: clamp(3.125rem, 2.375rem + 3.75vw, 6.875rem);}
.sct_tit {margin-bottom: clamp(1.25rem, 1.1rem + 0.75vw, 2rem); font-size: clamp(1.5rem, 1.438rem + 0.31vw, 1.813rem); font-weight: 500; text-align: center;}

/********************************************************
■ 준비중 페이지
********************************************************/
.ing {display: flex;flex-direction: column; gap:clamp(1.5rem, 1.45rem + 0.25vw, 1.75rem); padding:clamp(3rem, 2.725rem + 1.375vw, 4.375rem) 0; text-align: center; background: #fbfbfb; border-radius: 1rem;}
.ing .img_box img {display: inline-block; width: clamp(12.5rem, 11.662rem + 4.188vw, 16.688rem); height:auto; aspect-ratio: 1.136 / 1;}
.ing .txt_box {font-size:var(--font-size-18);}
.ing .txt_box h4 {margin-top: 0; margin-bottom:clamp(0.75rem, 0.7rem + 0.25vw, 1rem); font-size: clamp(1.728rem, 1.674rem + 0.272vw, 2rem); line-height: 1.3; font-weight: 500;}
.ing .txt_box h4 strong {color:var(--Brand-Color-main);}

/********************************************************
■ 서비스 소개 및 사이트 사용 방법 설명
********************************************************/
.content_body:has(.info) {padding-top: 0; padding-bottom: 0;}
:has(.info) #footer {background-color: #fff;}
#info_visual {display: flex; flex-direction: column; justify-content: center; width: 100%; max-width: 78.75rem; height: clamp(10rem, 9.438rem + 2.81vw, 12.813rem); margin: 0 auto; padding-left: clamp(1rem, -0.363rem + 6.81vw, 7.813rem); background-color: #ECF2FD; overflow: hidden; border-radius: .625rem; position: relative;}
#info_visual::before {content: ''; /*width: clamp(11.25rem, 7.025rem + 21.13vw, 32.375rem);*/ height: 90%; aspect-ratio: 226/180; background: url('/images/newOpen_hp/content/info_visual_img.svg') no-repeat center/cover; position: absolute; bottom: 0; left: 66%;}
#info_visual img {display: block; width: clamp(13.75rem, 12.285rem + 7.33vw, 17.688rem); position: relative;}
#info_visual strong {display: block; margin-top: clamp(0.625rem, 0.525rem + 0.5vw, 1.125rem); font-size: clamp(1.375rem, 1.175rem + 1vw, 2.375rem); color: #0063C6; line-height: 1.3; position: relative;}
#info_visual strong br{display: none;}
.info .sct1 .sct_tit {margin-bottom: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);}
.info_reason {display: flex; justify-content: space-between; gap: 1.875rem 0;}
.info_reason > li {display: flex; flex-direction: column; align-items: center; padding: 0 clamp(1rem, 0.875rem + 0.63vw, 1.625rem); text-align: center;}
.info_reason > li .img_box {width: 19.75rem; aspect-ratio: 316/215; background: no-repeat center/cover;}
.info_reason > li .img_box.inquiry {background-image: url('/images/newOpen_hp/content/info_img1.png');}
.info_reason > li .img_box.matching {background-image: url('/images/newOpen_hp/content/info_img2.png');}
.info_reason > li .img_box.items {background-image: url('/images/newOpen_hp/content/info_img3.png');}
.info_reason > li strong {display: block; margin: clamp(1rem, 0.95rem + 0.25vw, 1.25rem) 0 clamp(0.375rem, 0.325rem + 0.25vw, 0.625rem); font-size: clamp(1.125rem, 1.075rem + 0.25vw, 1.375rem); font-weight: 700; color: #222;}
.info_reason > li span {font-size: var(--font-size-16); color: #828282;}
.info_step {display: flex; gap: clamp(3.125rem, 2.95rem + 0.88vw, 4rem); width: 100%;}
.info_step > li {flex: 1; padding: clamp(1.25rem, 1.063rem + 0.94vw, 2.188rem) clamp(1.25rem, 0.8rem + 2.25vw, 3.5rem) clamp(1.25rem, 0.9rem + 1.75vw, 3rem); background-color: #fff; border-radius: clamp(0.625rem, 0.5rem + 0.63vw, 1.25rem); border: 1px solid #EBEBEB; box-shadow: 0 4px 15px rgba(0, 0, 0, .1); position: relative;}
.info_step > li + li::before {content: ''; display: block; width: clamp(1rem, 0.963rem + 0.19vw, 1.188rem); aspect-ratio: 19/27; background: url('/images/newOpen_hp/content/info_step_arr.svg') no-repeat center/cover; position: absolute; top: 50%; right: calc(100% + clamp(3.125rem, 2.95rem + 0.88vw, 4rem) / 2); transform: translate(50%, -50%);}
.info_step > li .step {display: inline-block; margin-bottom: clamp(1rem, 0.787rem + 1.06vw, 2.063rem); padding: 3px clamp(1rem, 0.912rem + 0.44vw, 1.438rem) 1px; font-size: clamp(0.938rem, 0.875rem + 0.31vw, 1.25rem); font-weight: 700; color: #fff; background-color: var(--color-blue); border-radius: 10rem;}
.info_step > li strong {display: block; margin-bottom: clamp(1rem, 0.825rem + 0.88vw, 1.875rem); font-size: clamp(1.125rem, 1.075rem + 0.25vw, 1.375rem); font-weight: 500;}
.chk_list > li {padding-left: clamp(1.625rem, 1.575rem + 0.25vw, 1.875rem); font-size: var(--font-size-17); color: #334155; position: relative;}
.chk_list > li::before {content: ''; display: block; width: clamp(1.25rem, 1.2rem + 0.25vw, 1.5rem); aspect-ratio: 1; background: url('/images/newOpen_hp/content/list_chk.svg') no-repeat center/cover; position: absolute; top: 0; left: 0;}
.chk_list > li + li {margin-top: .625rem;}
.info .sct3 {padding: clamp(1.875rem, 1.625rem + 1.25vw, 3.125rem) 0 clamp(2.5rem, 2.212rem + 1.44vw, 3.938rem); background-color: #EFF7FD;}
.info .sct3 .con {max-width: 1190px;}
.info .sct3 .top_wrap {display: flex; align-items: center; gap: clamp(1.25rem, 0.875rem + 1.88vw, 3.125rem); }
.info .sct3 .top_wrap .ask {padding: clamp(0.625rem, 0.575rem + 0.25vw, 0.875rem) 0 clamp(0.625rem, 0.575rem + 0.25vw, 0.875rem) clamp(6.25rem, 5.625rem + 3.13vw, 9.375rem); font-size: var(--font-size-18); font-weight: 500; background: url('/images/newOpen_hp/content/info_telephone.png') no-repeat left center/auto 100%;}
.info .sct3 .top_wrap .ask strong {display: block; margin-top: .375rem; font-size: clamp(1.375rem, 1.288rem + 0.44vw, 1.813rem); font-weight: 700; color: var(--color-deepblue);}
.info .sct3 .top_wrap .bar_list {padding-left: clamp(1.25rem, 0.875rem + 1.88vw, 3.125rem); font-size: var(--font-size-18); font-weight: 500; border-left: 1px dashed #818181;}
.bar_list > li {display: flex; align-items: flex-start;}
.bar_list > li + li {margin-top: clamp(0.5rem, 0.45rem + 0.25vw, 0.75rem);}
.bar_list > li span {display: inline-block; padding-right: .625rem; margin-right: .625rem; position: relative;}
.bar_list > li span::after {content: ''; display: block; width: 1.6px; height: 64%; background-color: #222; position: absolute; top: 18%; right: -.8px;}
.cs_menu {display: flex; gap: clamp(0.625rem, 0.5rem + 0.63vw, 1.25rem); margin-top: clamp(1.875rem, 1.675rem + 1vw, 2.875rem);}
.cs_menu > li {width: clamp(12.5rem, 11.25rem + 6.25vw, 18.75rem); border-radius: clamp(0.375rem, 0.325rem + 0.25vw, 0.625rem); box-shadow: 0 4px 15px rgba(0, 0, 0, .1); overflow: hidden;}
.cs_menu > li a {display: flex; justify-content: space-between; align-items: center; gap: var(--num-10); height: 100%; padding: clamp(1rem, 0.825rem + 0.88vw, 1.875rem); font-size: var(--font-size-18); background-color: #fff;}
.cs_menu > li strong {font-weight: 500;}
.cs_menu > li span {display: block; margin-top: clamp(0.25rem, 0.225rem + 0.13vw, 0.375rem); font-size: var(--font-size-16);}
.cs_menu > li i {display: block; background: no-repeat center/cover;}
.cs_menu > li i.icon_catalog {width: clamp(2.25rem, 2.175rem + 0.38vw, 2.625rem); aspect-ratio: 42/39; background-image: url('/images/newOpen_hp/content/info_catalog.svg');}
.cs_menu > li i.icon_history {width: clamp(2.25rem, 2.087rem + 0.81vw, 3.063rem); aspect-ratio: 49/39; background-image: url('/images/newOpen_hp/content/info_history.svg');}
.cs_menu > li i.icon_check {width: clamp(2.25rem, 2.138rem + 0.56vw, 2.813rem); aspect-ratio: 45/33; background-image: url('/images/newOpen_hp/content/info_check.svg');}
.cs_menu > li.li_strong {flex: 1; min-width: clamp(12.5rem, 11.25rem + 6.25vw, 18.75rem);}
.cs_menu > li.li_strong a {color: #fff; background-color: var(--color-deepblue);}

@media (max-width: 1260px){
	#info_visual {width: calc(100% - (var(--side-padding) * 2)); margin: 0 var(--side-padding);}
	.info_reason > li .img_box {zoom: .8;}
}
@media (max-width: 1024px){
	.info_reason > li .img_box {zoom: .6;}
	.info .sct3 .top_wrap {flex-direction: column;}
	.info .sct3 .top_wrap .bar_list {padding-top: clamp(1.25rem, 0.875rem + 1.88vw, 3.125rem); padding-left: 0; border-left: none; border-top: 1px dashed #828282;}
}
@media (max-width: 940px){
	.info_reason {flex-direction: column; align-items: center;}
	.info_reason > li {width: 100%;}
	.info_reason > li .img_box {zoom: 1; width: 70%; max-width: 300px;}
}
@media (max-width: 767px){
	#info_visual::before {height: 80%; left: auto; right: var(--side-padding);}
	.info_step {flex-direction: column; align-items: center;}
	.info_step > li {width: 100%; max-width: 500px;}
	.info_step > li + li::before {top: 0; left: 50%; transform: rotate(90deg) translate(calc(0% - (clamp(3.125rem, 2.95rem + 0.88vw, 4rem) / 2)), -50%); transform-origin: top;}
	.info .sct3 .top_wrap .ask {width: 100%; padding: clamp(6.25rem, 5.625rem + 3.13vw, 9.375rem) 0 clamp(0.625rem, 0.575rem + 0.25vw, 0.875rem); background-size: 5rem auto; background-position: top left;}
	.info .sct3 .top_wrap .bar_list {width: 100%;}
	.cs_menu {flex-wrap: wrap; justify-content: center; width: 100%; max-width: 600px; margin: clamp(1.875rem, 1.675rem + 1vw, 2.875rem) auto 0;}
	.cs_menu > li {width: auto; flex: 1;}
	.cs_menu > li.li_strong {flex: none; width: 100%;}
}
@media (max-width: 640px){
	#info_visual::before {height: auto; width: 32%;}
	#info_visual strong br{display: block;}
}

/* 팝업 */
#viewPopup {background-color: rgba(0, 0, 0, .5) !important;}
#viewPopup .v_box {width: 100% !important;}
#viewPopup .v_con {padding: clamp(1.25rem, 0.538rem + 3.56vw, 4.813rem) clamp(1.25rem, 0.45rem + 4vw, 5.25rem) clamp(1.25rem, 0.912rem + 1.69vw, 2.938rem) !important;}
#viewPopup .v_box .v_info {align-items: flex-start;}
#viewPopup .v_box .v_imageZone {height: auto !important; background-color: #EDF1F5 !important; border: none !important;}
#viewPopup .v_box .v_pro {margin-left: clamp(1.25rem, 0.788rem + 2.31vw, 3.563rem) !important; border-top: 1px solid #000 !important;}