@charset "utf-8";

body .conPadding {padding:150px  0;}
body .img img {width:100%; height:100%; object-fit:cover; transition:var(--ani);}

.layer {display:none;}
.layer.on {display:block; position:fixed; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,.7); z-index:9999;}
.layer .layerWrap {background:#fff; left:50%; top:50%; transform:translate(-50%,-50%); position:absolute;}
.layer .layerWrap .close {
	width:30px; height:30px; right:-45px; top:-45px; position:absolute; color:#fff;
	background:url(/images/icon/x.svg)center no-repeat;
}
.layer .layerCon {position:relative;}
.layer .layerCon .cover {width:100%; height:100%; background:rgba(0,0,0,.5) url(/images/icon/playBtn.svg)center /80px no-repeat; position:absolute; left:0; top:0; display:block; content:''; z-index:9;}

.layer.people {}
.layer.medicheck .layerCon iframe,
.layer.people .layerCon iframe {width:1200px; height:675px;}
.layer.people .layerCon video {width:1400px;aspect-ratio:16/9; }
/* .layer.people .layerCon video.on {display:block;} */
/* .layer.people .layerCon .videoBox {display:none;} */
/* .layer.people .layerCon .videoBox.on {display:block;} */
.layerOpen {cursor:pointer;}


.checkBtn input[type="checkbox"]+label {position:relative; cursor:pointer;}

.checkBtn.type1 {position:relative;}
.checkBtn.type1 input[type="checkbox"] {position:absolute; left:-9999px;}
.checkBtn.type1 input[type="checkbox"]+label {padding-left:23px; margin:0; font-size:var(--fontSize6); line-height:18px; display:block; word-break: break-all; overflow-wrap: break-word; white-space: normal;}
.checkBtn.type1 input[type="checkbox"]+label:before {
	width:18px; height:18px; border:3px solid var(--gray2); left:0; top:0; border-radius:5px; 
	border-radius:50%; position:absolute; display:block; content:'';
	background:#fff 50% 60% no-repeat; 
}
.checkBtn.type1 input[type="checkbox"]:checked+label {}
.checkBtn.type1 input[type="checkbox"]:checked+label:before {
	background-color:var(--sky); border-color:var(--sky);
	background-image:url('/images/icon/check.png');
}

.radioBtn input[type="radio"]+label {position:relative; cursor:pointer;}

.radioBtn.type1 {position:relative;}
.radioBtn.type1 input[type="radio"] {position:absolute; left:-9999px;}
.radioBtn.type1 input[type="radio"]+label {padding-left:20px; font-weight:500; font-size:1.6rem; line-height:1;}
.radioBtn.type1 input[type="radio"]+label:before {
	width:16px; height:16px; border:3px solid var(--darkGray); 
	background:var(--lightGray); left:0; top:50%; border-radius:50%; 
	position:absolute; display:block; content:''; transform:translateY(-50%);
}
.radioBtn.type1 input[type="radio"]:checked+label:before {border:5px solid var(--blue); background:var(--lightGreen);}


.titleWrap.type1 .tit {padding:0 0 35px; margin:0 0 30px; font-size:var(--fontSize2); font-weight:800; line-height:1.2; position:relative; color:#000;}
.titleWrap.type1 .tit:after {width:50px; height:3px; background:var(--primary); left:0; bottom:0; position:absolute; content:''; display:block;}
.titleWrap.type1 .txt {font-size:var(--fontSize4); line-height:1.8;}
.titleWrap.type1 .txt+.txt {padding:30px 0 0;}

.ulType1 {}
.ulType1 li {padding-left:40px; background:url(/images/icon/listCheck.svg)5px 10px no-repeat;}
.ulType1 li {color:#000; font-size:var(--fontSize11);}
.ulType1 li b {padding-left:10px; font-weight:800; color:var(--primary);}

.itemList {}
.itemList.type1 {display:flex; gap:50px; flex-wrap:wrap;}
.itemList.type1 .item {width:calc((100% - 50px)/2);}
.itemList.type1 .item .img {aspect-ratio:16/9; border-radius:20px; overflow:hidden; position:relative;}
.itemList.type1 .item .img img {width:100%; height:100%; object-fit:cover;}
.itemList.type1 .item .img .cover {background:rgba(0,0,0,.6) url(/images/icon/playBtn.svg)center no-repeat; position:absolute; left:0; top:0; right:0; bottom:0; transition:var(--ani);}
.itemList.type1 .item:hover .img .cover {opacity:.2;}
.itemList.type1 .item .txt {}
.itemList.type1 .item .txt p {font-size:var(--fontSize4); line-height:1.8;text-align:center;}

body .formGroup {padding:50px 0; display:flex; flex-direction:column; gap:10px;}
body .formGroup .inputWrap {display:flex; gap:10px;}
body .formGroup .inputWrap .label {width:130px; line-height:50px; color: #000; font-size:var(--fontSize4); font-weight: 600;}
body .formGroup .inputWrap .label+* {width:calc(100% - 140px);}
body .formGroup .inputWrap input {height:50px;}
body .formGroup .inputWrap select {height:50px;}

.btnWrap {}
.btnWrap.type1 {display:flex; gap:5px; justify-content:end;}
.btnWrap.type1 button {padding:15px 30px; border-radius:100px; color:#FFF;font-size:var(--fontSize4); font-weight: 600;line-height: 140%;}
 


/* ************************ 태블릿 이하(~1199) ************************ */
@media (max-width: 1024px) {
	
	.layer {}
	.layer.on {}
	.layer .layerWrap {width:80%;}
	.layer .layerWrap .close {}
	.layer .layerCon {}
	
	.layer.people {}
	.layer.people .layerCon {}
	
	.layer.medicheck .layerCon iframe,
	.layer.people .layerCon iframe{width:100%; height:auto; aspect-ratio:16/9;}
	
	

	body .conPadding {padding:80px 20px;}
	
	
	.titleWrap.type1 .tit {padding:0 0 30px; margin:0 0 25px;}
	.titleWrap.type1 .txt {}
	.titleWrap.type1 .txt+.txt {padding:25px 0 0;}
	
	.ulType1 {}
	.ulType1 li {padding-left:35px; background-size:22px;}
	.ulType1 li {}
	.ulType1 li b {}
	
	.itemList.type1 {gap:30px;}
	.itemList.type1 .item {width:calc((100% - 30px)/2);}
	.itemList.type1 .item .txt p {line-height:1.6;}
	.itemList.type1 .item .img .cover {background-size:80px;}
	
	
	body .formGroup {padding:40px 0;}
	
	
	.btnWrap.type1 button {padding:12px 20px; line-height:130%;}



}

/* ************************ 모바일 ************************ */
@media (max-width: 767px) {
	
	
	body .conPadding {padding:50px 20px;}
	
	.layer .layerCon .cover {background-size:60px;}
	
	.titleWrap.type1 .tit {padding:0 0 20px; margin:0 0 17rpx;}
	.titleWrap.type1 .tit:after {width:35px; height:3px;}
	.titleWrap.type1 .txt+.txt {padding:20px 0 0;}
	
	
	.ulType1 {}
	.ulType1 li {padding-left:25px; background-size:18px; background-position:0 5px; line-height:1.2;}
	.ulType1 li+li {margin:5px 0 0;}
	.ulType1 li {}
	.ulType1 li b {}
	
	.itemList.type1 {gap:10px;}
	.itemList.type1 .item {width:calc((100% - 10px)/2);}
	.itemList.type1 .item .txt p {padding:5px 0 0; line-height:1.2;}
	.itemList.type1 .item .img .cover {background-size:50px;}
	
	
	body .formGroup {padding:30px 0; gap:20px;}
	body .formGroup .inputWrap {flex-direction:column; gap:5px;}
	body .formGroup .inputWrap .label {line-height:100%;}
	body .formGroup .inputWrap .label+* {width:100%;}
	body .formGroup .inputWrap input {height:40px;}
	body .formGroup .inputWrap select {height:40px;}
	
	
	.btnWrap.type1 button {padding:10px 20px; line-height:120%;}
	
}	


