@charset "utf-8";

/* ************************ 기본셋팅 ************************ */

html { 
    font-size: 62.5% !important;
    -webkit-text-size-adjust: 100%; 
}

:root {
	--f_base1:'Pretendard';
	
	--c_base1:#FB64B6; /*핑크*/
	--c_base2:#63AEFF; /*하늘*/
	--c_base3:#C9BDFF; /*보라*/
	
	--c_bg1:#f7f7f7;
	--c_bg2:#f1f1f1;
	
	--border1:#DFE4EB;
	
	--ani:all .3s;
	
	--bgSet:center no-repeat;
	
	--fs12:1.2rem;
	--fs13:1.3rem;
	--fs14:1.4rem;
	--fs15:1.5rem;
	--fs16:1.6rem;
	--fs17:1.7rem;
	--fs18:1.8rem;
	--fs20:2rem;
	--fs22:2.2rem;
	--fs23:2.3rem; 
	--fs24:2.4rem; 
	--fs26:2.6rem;
	--fs28:2.8rem;
	--fs30:3rem;
	--fs32:3.2rem;
	--fs36:3.6rem;
	--fs38:3.8rem;
	--fs40:4rem;
	--fs45:4.5rem;
	--fs46:4.6rem;
	--fs48:4.8rem;
	--fs50:5rem;
	--fs55:5.5rem;
	--fs60:6rem;
	--fs64:6.4rem;
	--fs80:8rem;
	

}

@media screen and (max-width: 1199px) {
	:root {
		--fs18:1.7rem;
		--fs20:1.9rem;
		--fs22:2rem;
		--fs23:2.2rem; 
		--fs24:2.3rem; 
		--fs26:2.4rem;
		--fs28:2.6rem;
		--fs30:2.8rem;
		--fs32:3.2rem;
		--fs36:3rem;
		--fs38:3.2rem;
		--fs40:3.4rem;
		--fs45:4rem;
		--fs46:4rem;
		--fs48:4.1rem;
		--fs50:4.2rem;
		--fs55:4.4rem;
		--fs60:5rem;
		--fs64:5.2rem;
		--fs80:6rem;
	}
}
@media screen and (max-width: 767px) {
	:root {
		--fs12:1.1rem;
		--fs13:1.2rem;
		--fs14:1.3rem;
		--fs15:1.4rem;
		--fs16:1.5rem;
		--fs18:1.6rem;
		--fs20:1.8rem;
		--fs22:1.9rem;
		--fs23:2rem; 
		--fs24:2.1rem; 
		--fs26:2.2rem;
		--fs28:2.3rem;
		--fs30:2.4rem;
		--fs32:2.5rem;
		--fs36:2.6rem;
		--fs38:2.8rem;
		--fs40:3rem;
		--fs45:3.1rem;
		--fs46:3.1rem;
		--fs48:3.1rem;
		--fs50:3.2rem;
		--fs55:3.3rem;
		--fs60:3.4rem;
		--fs64:3.6rem;
		--fs80:5rem;
	}
}

.w1400 {width:100%; max-width:1400px; margin: auto;}

.c_base1 {color:var(--c_base1) !important;}
.c_base2 {color:var(--c_base2) !important;}
.c_base3 {color:var(--c_base3) !important;}
.c_base4 {color:var(--c_base4) !important;}

.c_bg1 {background:var(--c_bg1) !important; color:#fff !important;}
.c_bg2 {background:var(--c_bg2) !important; color:#fff !important;}


.h5 {height:5px;}
.h10 {height:10px;}
.h20 {height:20px;}
.h30 {height:30px;}
.h40 {height:40px;}
.h50 {height:50px;}
.h60 {height:60px;}
.h70 {height:70px;}
.h80 {height:80px;}
.h90 {height:90px;}
.h100 {height:100px;}
.h110 {height:110px;}
.h120 {height:120px;}
.h130 {height:130px;}
.h140 {height:140px;}
.h150 {height:150px;}
.h160 {height:160px;}
.h170 {height:170px;}
.h180 {height:180px;}
.h190 {height:190px;}
.h200 {height:200px;}

@media screen and (max-width:1199px) {
	.h30 {height:20px;}
	.h40 {height:30px;}
	.h50 {height:40px;}
	.h60 {height:40px;}
	.h70 {height:50px;}
	.h80 {height:60px;}
	.h90 {height:65px;}
	.h100 {height:70px;}
	.h110 {height:75px;}
	.h120 {height:80px;}
	.h130 {height:85px;}
	.h140 {height:90px;}
	.h150 {height:90px;}
	.h160 {height:90px;}
	.h170 {height:100px;}
	.h180 {height:100px;}
	.h190 {height:110px;}
	.h200 {height:120px;}
	
}

@media screen and (max-width:767px) {
	.h10 {height:5px;}
	.h20 {height:10px;}
	.h30 {height:20px;}
	.h40 {height:25px;}
	.h50 {height:30px;}
	.h60 {height:35px;}
	.h70 {height:40px;}
	.h80 {height:45px;}
	.h90 {height:50px;}
	.h100 {height:55px;}
	.h110 {height:60px;}
	.h120 {height:60px;}
	.h130 {height:65px;}
	.h140 {height:65px;}
	.h150 {height:70px;}
	.h160 {height:70px;}
	.h170 {height:75px;}
	.h180 {height:75px;}
	.h190 {height:80px;}
	.h200 {height:85px;}
}

a { text-decoration:none !important; outline:none !important; selector-dummy:expression(this.hideFocus=true) !important; transition:var(--ani); color:inherit; } 
a:link, a:visited, a:hover, a:active {text-decoration:none; color:inherit; } 


/* *************************** 이미지팝업 - 인증서 등 이전,다음 버튼 있음 *************************** */
.imgOpen2 {z-Index:999999; position:fixed; overflow:hidden; left:0; top:0; width:100%; height:0; overflow:hidden; background-color:rgba(0,0,0,.7); text-align:center; font-weight:normal;}
.imgOpen2 .wrap {position:relative;}
.imgOpen2 .wrap div {padding:40px 0 80px; position:relative; display:flex; justify-content:center; overflow:hidden; width:100%;text-align:center; vertical-align:middle; box-sizing:border-box;}
.imgOpen2 .wrap img {max-height:100%; max-width:100%; border:10px solid transparent;}
.imgOpen2 .popTitle {z-Index:100; position:absolute; left:0; bottom:20px; width:100%; font-size:14px; text-align:center;}
.imgOpen2 .popTitle p {display:inline-block; padding:10px 20px; color:#fff; background:rgba(0,0,0,.4); border-radius:100px; line-height:1.2;}
.imgOpen2 button {z-index:300; position:absolute; display:block; top:50%; width:60px; height:60px; padding:0; background-color:rgba(0,0,0,.2); font-size:12px; color:#fff; border:0; border-radius:50%; cursor:pointer; background-position:50%; background-repeat:no-repeat; background-size:30%; transition:.3s;}
.imgOpen2 button:hover {background-color:rgba(0,0,0,.9);}
.imgOpen2 button img {max-width:initial; max-height:initial;}
.imgOpen2 button.off {opacity:.2; cursor:default;}
.imgOpen2 button.prev {left:20px;}
.imgOpen2 button.next {right:20px;}
.imgOpen2 button.close {top:20px; right:20px;}
.imgOpen2 button img {width:100%; height:100%; object-fit:scale-down; margin:0 auto; }
@media screen and (max-width:767px){
	.imgOpen2 {padding:0 !important; margin:0 !important;}
	.imgOpen2 button {width:40px; height:40px;}
	.imgOpen2 button img {width:30%; height:30%; }
	.imgOpen2 button.prev {left:10px;}
	.imgOpen2 button.next {right:10px;}
	.imgOpen2 button.close {top:10px; right:10px;}
	.imgOpen2 button img {}
	.imgOpen2 .popTitle {bottom:10px; font-size:12px; text-align:center;}
	.imgOpen2 .wrap img {max-height:100%; max-width:100%; border:10px solid transparent; object-fit:contain;}
}