/*신청서표지 */
@charset "utf-8";
/*@import url('https://unpkg.com/pretendard@latest/dist/web/static/pretendard.css');*/
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
/* font-family: Pretendard; */
@font-face {
    font-family: 'GongGothicLight';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
.clear{clear: both;}
.side_fix{display:none}

.bottom_menu {display:none}
.bottom_menu_PC {display:block}

/* .time_ju{width:5px} */
/* body{background: #f3f8ff;} */
.serviceWrap{width: 586px;margin: 0 auto;    font-size: 0;}
.serviceBox{
	width: 535px;    
	margin: 0 auto; 
	background: #fff;  
	padding: 30px 10px;
}

.header {padding:0 !important;}
.header .logo {    width: 100% !important;text-align: center;/*    box-shadow: 1px 2px 3px 0px #e0e0e0;*/}
.header .hide_menu {display:none !important;}
.header .header_main{display:none !important;}

/*신청서슬라이드*/
.bar_slider .slide_img img{
	display: block;
	width:100%;
}
.bar_slider button.slick-arrow{
	display: none !important;
}

@media screen and (max-width: 600px){
    .main_form_banner {
        display: block !important;
    }
}
/* .slick-dots { bottom: 20px; } */
/* .slick_slider .slick-dots button { width: 10px; height: 10px; border: 2px solid green; border-radius: 50%;  } */
/* .slick-active button { background: red }  */

/**슬라이드 숫자**/

.bar_slider{position: relative;}
.cur_num {
    position: absolute;
    right: 10px;
    bottom: 10px;
    padding: 6px 10px;
    background:rgba(0,0,0,0.1);
    line-height: 1;
    font-size: 10px;
    border-radius: 28px;
    color: #fff;
}


/*방문상담*/
.visit_pc{display: flex;align-items: center;}
.visit_pc p{font-size:12px;    display: inline-block;}
.visit_mo{display:none}

.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}
.bar_slider .slick-dots {
    width: 100%;
    position: absolute;
    bottom: 10px;
    right: 20px;
    text-align: center;
    cursor: pointer;
   width:auto;
}
.bar_slider .slick-dots > li {
    width: auto;
    height: 100%;
    margin: 0;
    display: inline-block;
    vertical-align: top;
}

.bar_slider .slick-dots > li > .page-btn {
    background-size: cover;margin-left: 10px;
}
.bar_slider .slick-dots > li.slick-active > .page-btn > img {
   background:url("/resources/brandsite/img/slide_white.png");
}

.bar_slider .slide_img{    
	position: relative;
	overflow: hidden;
}
.slide_img a {
	display:block;
	height: 100%;
	}
.slide_img a img{
	height: 100%;
}	

.slide_txtBox {
	color:#fff;    
	position: absolute;
	width: 100%;
	left: 50%;
	top: 54%;
	transform: translate(-50%, -50%);
/*     top: 17px; */
/*     transform: translate(-50%, 0); */
}
.slide_txtBox span {
	font-size:14px;
	margin-bottom: 5px;
	display: block;
	font-weight: 600;
	text-align: center;
	font-family: 'GongGothicLight' !important;
}
.slide_txtBox strong {
	display: block;
	font-size: 20px;    
	line-height: 1.2;
	text-align: center;
	font-family: 'GongGothicLight' !important;
}
.slide_txtBox >a >strong:nth-child(2),
.slide_txtBox >a >strong:nth-child(2) >strong{
	font-size: 18px;
}
.slide_img_mo{
   display: none !important;
}
.slide_img_fold{
	display: none !important;
}

/*게이지*/
.serviceBox .step_gauge{    display: none;}
.serviceBox .step_gauge .gauge_bar{}
.serviceBox .step_gauge .gauge_txt{font-size: 16px;font-weight: bold;padding-top: 20px;}
.serviceBox .step_gauge .gauge_txt span{    text-transform: uppercase;color: #68a1f7}
.serviceBox .step_gauge .gauge_txt span::after{content:"|";padding: 0 10px;color: #9aa6b7;}
.serviceBox .step_gauge .gauge_txt p{display: inline-block;   color: #9aa6b7;}

.pre-consultation-progress-bar {width: 100%; overflow: hidden; position: relative;}

.pre-consultation-progress-bar__bg {background-color: #f5f5f5; height: 6px;}
.pre-consultation-progress-bar__value {
    position: absolute;top: 0; left: 0;
    background-color: #1778ba;
    height: 6px;transition: width .3s ease-in;animation-fill-mode: both;border-radius:3px;}

.serviceBox{box-sizing: content-box;}
.title06Txt{display:none}

.section_02 {padding-bottom: 20px;}
.metaBox{padding-top:0px;}
.serviceTitle{margin-top: 180px;}
.serviceTitle h2{font-size: 40px;color: #fff;}

.serviceBox .box{    padding: 30px 20px;border-radius:10px;/* box-shadow: 0px 0 6px 0px rgb(49 49 49 / 20%); */width: calc(33.33% - 7px);/*height: 182px;    */display: inline-flex;
    align-items: center;flex-direction: column;background-size: cover;justify-content: flex-start;
vertical-align: top; cursor: pointer; position: relative;}
.serviceBox .box a{color: #606060;font-size: 16px;font-weight: bold;   }
/* .serviceBox .box:hover {box-shadow: inset 1px 0px 10px #c5c5c5;} */


.boximg{width: 100%;
    margin: 0 auto;
    text-align: center;
    }
.boxcenter{margin:0 10px;}

.serviceBox .box .imgbox img{border: 1px solid #a4a4a4;border-radius: 3px;}
.serviceBox .box .imgbox img:hover{border: 3px solid #7db0fe; z-index:2}


.serviceBox .box .titlebox{    display: flex;
    align-items: flex-end;
    justify-content: center;
    flex-direction: row;
    width: 100%;
    height: 100%;
    text-align: center;
    position: absolute;
    left: 0;    bottom:0px;}
/* .serviceBox .box .titlebox{display: table-cell; vertical-align: bottom;text-align: center;   } */
.serviceBox .box .titlebox span{font-weight: bold;font-size:16px;color: #606060;     padding-bottom: 35px;}
/*상품설명 방문 상담 업체전용 문구*/
.serviceBox #box_visit .titlebox span{font-weight: bold;font-size:16px;color: #606060;   }



.section_01 h3{
	text-align: left;
    color: var(--mBlk);
    font-size: 18px;
    font-weight: bold;
    padding-bottom: 15px;
    padding-top: 24px;
    letter-spacing: -1px;
 }
.section_01 h3 span{
	color: var(--mBlue);
	padding: 0 2px;
}

.btnBox{
	padding: 20px 4px 0px;
}
.btnBox a{
	font-size:15px;
	font-weight: bold;
	color: #fff;
	display: inline-block;
	padding: 10px 40px;
	background-color: var(--sBlue01);
	display: block;
	text-align: center;
}


.informationBox{padding-top: 20px;}
.informationBox > span{
	color: var(--mBlk);
	font-size: 15px;
	font-weight: bold;
	padding-bottom:10px;
}
.informationBox >span a{
	color: var(--sBlue02);
}
.inform_txt {
	color: var(--sDg04);
	font-size: 13px;
	padding-top:5px;
}
.time_txt li{display: inline-block;vertical-align: top; }
.time_txt li::after {content:"|"; padding:0 5px}
.time_txt li:last-child::after {   color: transparent;}

.time2_txt li:first-child::before{content:"*";padding-right: 2px;}
.time2_txt li{display: inline-block;vertical-align: top;}
.time_none{color: var(--sDg04) !important;}
.time_last{color: var(--sDg04); font-size: 13px;}


.box_bg_01 {background:url('/resources/serviceForm/img/box_b.png');background-position: center;
    background-size: 190px;
    background-repeat: no-repeat;}
    
.box_bg_02 {background:url('/resources/serviceForm/img/box.png');background-position: center;
    background-size: 195px;box-shadow:none !important;
    background-repeat: no-repeat;}

@media all and (max-width:600px) {
   .serviceWrap {width:100%;padding: 0;  padding-bottom: 0;}
   .serviceBox {width: 100%;padding:0 }
   .bar_slider{    padding: 0 10px;}
  /*  .slide_txtBox{top:13vw; left:4vw} */
   /* .slide_txtBox p {font-size: 3.5vw;} */
  /*  .slide_txtBox h2 {font-size: 5vw;} */
   
   .btnBox a {padding: 15px 40px;}

   .serviceBox .step_gauge {padding: 0 10px;}
    .serviceBox {
        padding-bottom: 100px
    }

    .informationBox {  display: none; /*padding: 20px 10px 100px 10px;*/
    }

    .informationBox p {
        word-break: keep-all;
    }
   .serviceBox .box .titlebox span {word-break: keep-all;    padding-bottom: 4.5vw;}
   .serviceBox #box_visit .titlebox span{    padding-bottom: 4.5vw !important;}
   .section_01 , .section_02{ text-align:left;}
   .title06Txt2{display:none}
   .title06Txt{display:block;}
   .section_02 {padding: 30px 10px 20px 10px;}
   .btnBox a {
    font-size: 18px;}
    
    .time_none{display:none}
    
    .section_01{padding: 0px 10px 0}
   .section_02{ padding: 0px 10px 20px;}

   .section_01 h3 {font-size: 17px;}

   .metaBox {padding-top: 5px;}
   .btnBox {     padding: 10px  0px;}
   
 
/* 	 input[id="chk_agree"]+label {margin-left: 4vw !important;}
	 input[id="chk_permi"]+label {margin-left: 2vw  !important;} */
	 .box_bg_02{    background-size: 33vw;}
	.box_bg_01{background-size: 33vw;}
	.serviceBox .box_bg_02{     height: 32vw; padding:6vw 0;}
	 .serviceBox .box_bg_01{height:32vw;    padding: 7vw 0 ;}
	/* input[id="chk_agree"]+label, input[id="chk_permi"]+label, input[id="chk_lift"]+label, input[id="chk_fire"]+label, input[id="chk_shoot"]+label, input[id="chk_web"]+label, input[id="chk_metta"]+label, input[id="chk_nano"]+label, input[id="chk_care_mobile"]+label, input[id="chk_care"]+label, input[id="chk_care_mobile"]+label, input[id="chk_visit"]+label  {
	 width: 14vw !important; height: 13vw !important;margin-bottom:0 !important} */
	 
/* 	input[id="chk_agree"]+label , input[id="chk_lift"]+label ,input[id="chk_permi"]+label{margin-top :0  !important} */
	.bottom_menu {display:block}
    .bottom_menu_PC {display:none}
	
	.box_bg_02 span {padding-bottom: 5vw !important;}
	/* input[id="chk_web"]+label, input[id="chk_metta"]+label, input[id="chk_nano"]+label {margin-top:10px !important} */

	
	.cur_num{right:20px;}/* font-size: 15px;height: 35px; line-height: 35px; text-align: center;padding: 0;width: 70px;} */
	
	.visit_pc{display:none}
	.visit_mo{display:block}
}

@media all and (max-width:520px) {
   .time2_txt li:last-child{padding-left:7px}
}

@media all and (max-width:476px) {
   	.cur_num {
    font-size: 10px;
    padding: 4px 8px;
    bottom: 6px;
	}
}

@media all and (max-width:466px) {
   .time_txt li:nth-child(1)::after { color: transparent;}
   .time_txt li:nth-child(2)::after { content:none}
   .time_txt li:last-child{width: 193px;text-align: right;}
   .time_txt li{width: 180px;}
   .time_txt li {display: flex;justify-content: flex-start;}
}



@media all and (max-width:453px) {
   .title06Txt span {display:block; font-size:17px !important;}
}



@media all and (max-width:435px) {
   
   .btnBox a{    font-size: 4vw; padding: 3vw 40px; }
    .section_01 h3 {font-size: 4.5vw;}
   .section_01 h3 {font-size: 18px;}
    .boxcenter {padding: 0px;margin:0}

    .serviceBox .box {width: calc(33.33% - 0px);}
    input[id="chk_agree"]+label, input[id="chk_permi"]+label, 
    input[id="chk_lift"]+label, input[id="chk_fire"]+label, 
    input[id="chk_shoot"]+label, input[id="chk_web"]+label, 
    input[id="chk_metta"]+label, input[id="chk_nano"]+label, 
    input[id="chk_care_mobile"]+label, input[id="chk_care"]+label, 
    input[id="chk_visit"]+label {height:12vw  !important}
    .serviceBox .box{background-size: 35vw;}
   .metaBox {padding-top: 0px;}
    .box_bg_01 {height:32vw !important;}
}
@media all and (max-width:414px) {
   .slide_img_mo{
   display: block !important;
   }
   .slide_img_pc{
   display: none !important;
   }
   .slide_txtBox span {
    font-size: 13px;
    font-weight: 500;
    }
    .slide_txtBox >a >strong:nth-child(2),
    .slide_txtBox >a >strong:nth-child(2) >strong {
/*     font-size: 16px; */
	font-size: 15px;
    font-weight: 500;
	}
	.slide_txtBox strong {
/*     font-size: 18px; */
	    font-size: 15px;
    font-weight: 500;
	}
}



@media all and (max-width:400px) {
/*    input[id="chk_agree"]+label , input[id="chk_permi"]+label ,input[id="chk_lift"]+label , input[id="chk_fire"]+label , input[id="chk_shoot"]+label , input[id="chk_web"]+label,input[id="chk_metta"]+label , input[id="chk_nano"]+label ,input[id="chk_care_mobile"]+label, input[id="chk_care"]+label{ height: 100px !important;} */
   .serviceBox .box .titlebox span {font-size: 4vw !important;}
   .hit_txt{font-size: 3vw;top:3vw; left:3vw}

}

@media all and (max-width:384px) {
   .time_txt li:nth-child(2){text-align: right;}
   .time_txt li:nth-child(1)::after {  color: transparent;}
}

@media all and (max-width:375px) {
/* 	.slide_txtBox { */
/*     top: 22px; */
/*     } */
	.slide_txtBox strong {
    font-size: 14px;
    line-height: 1.3;
	}
	.slide_txtBox >a >strong:nth-child(2),
	.slide_txtBox >a >strong:nth-child(2) >strong {
    font-size: 14px;
	}
	.slide_txtBox span {
    font-size: 12px;
    }
}

@media all and (max-width:345px) {
     .section_01 h3{  font-size: 5vw;}
   
}

@media all and (max-width:330px) {
	.bottom_menu .b_menu span { font-size: 12px;}
}

@media all and (max-width:320px) {
	.bottom_menu .b_menu span { font-size: 12px;}
}
@media all and (max-width:280px) {
   .slide_txtBox span {
    font-size: 10px;
	}
   .slide_txtBox >a >strong:nth-child(2),
   .slide_txtBox >a >strong:nth-child(2) >strong {
    font-size: 12px;
	}
	.slide_txtBox strong {
    font-size: 14px;
	}
	.cur_num {
    bottom: 2px;
	}
}
    
