@charset "utf-8";

@font-face {src:url("/skin/view/images/Jalnan.ttf") format('truetype'); font-family: 'jalnan';}
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&display=swap');
@font-face {
    font-family: 'HeirofLightBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-07@1.0/HeirofLightBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GowunBatang-Regular';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/GowunBatang-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

 .myungjo{ font-family: "Nanum Myeongjo", serif; font-weight: 700; margin: 10px 0 10px 0;font-size: 28px; color:#7493db;}

.btn1{/*form control 객체에 버튼 요소만 추가 함*/
		width:80%;height:38px;border:1px solid #cc3300;font-weight:bold;padding:0px;font-size:20px;padding-bottom:2px;margin-left:10px;
		transition:0.3s;
	}

	.box1{
        height:50px;padding:10px 20px;font-size:20px;color: #2a2a2a;
        background: white;
		border: 1px #e3e3e3 solid;
	}

	.box2{
		height:50px;border:0px;padding:10px 20px;font-size:20px;color: white;
        background: #fe8c12;float: left
	}

	.btn1:hover{
		background-color:#eaeaea;
	}

	.select1{
		height:50px;border:0px;padding:10px 20px;font-size:20px;color: #2a2a2a;
        background: white
	}

	.tr1{
        overflow-x:hidden;background-color:#fff;font-size:12px;resize:none;height:40px;float: left
	}

	.test_title{/*타이틀 효과*/
	  font: 50px jalnan, Sans-Serif;
	  text-align: center;
	  color: #2a2a2a;
	  font-weight: 600;
	  }

	.test_title2{/*타이틀 효과*/
      font-size: 20px;
	  color: #2a2a2a;
      margin-bottom: 10px;
	  font-weight: 600;
	}

    .test_title3{/*타이틀 효과*/
      font-size: 20px;
	  color: #2a2a2a;
      margin-bottom: 10px;
	  font-weight: 600;
	}

	.result-text{
	  font: 14px Georgia Bold, Sans-Serif;
	  color: #fff;
	  text-shadow: 0px 1px 4px #e89897;
	  float:left;
	  width:100%;
	  padding:30px;	
	}


	/*#### 금글자 class ####*/
	.golden-base {
	  -webkit-background-clip: text;
	  -webkit-text-fill-color: transparent;
	  font-weight:bold;
	  -webkit-margin-before: 0.3em; 
	  -webkit-margin-after: 0.2em;
	}

	.golden1 {
	  background-image: -webkit-linear-gradient(#FFF65C, #3A2C00);
	  text-shadow: -0.02em -0.03em 0.005em rgba(255, 223, 0, 0.60);

	}

	.golden-text{
		  font-size:30px;padding-left:20px;margin-top:15px;
	}
	/*#### 금글자 class #### */

	.wid_33 { width:50%;float:left;height:55px;line-height:55px;padding-top:13px;padding-bottom:13px;}
	.wid_50 { width:50%;float:left;height:55px;line-height:55px;padding-top:13px;padding-bottom:13px; }
	.in1 { font-size:20px;cursor:pointer;width:100px;height:50px;line-height:50px;text-align:center;color:white;background:#818181;border-radius:4px;float:left;}
	.in2 { font-size:20px;cursor:pointer;width:100px;height:50px;line-height:50px;text-align:center;color:white;background:#407ba3;border-radius:4px;float:left;}
	
	.plno { padding-left:0px !important; }
	.r1 {float: left; width:100px;margin-right: 10px;height:50px;color: #2a2a2a;background: white !important;border: 1px #e3e3e3 solid; }
	.r2 {float: left; width:320px;margin-right: 10px;height:50px;padding:3px 20px;font-size:20px;color: #2a2a2a;background: white !important; border: 1px #e3e3e3 solid; }
	@media all and (max-width:1500px){ 
		.in1 { cursor:pointer;width:120px;height:58px;line-height:58px;text-align:center;color:white;background:#818181;border-radius:4px;margin-left:10px;font-size:25px; }
	.in2 { font-size:25px;cursor:pointer;width:120px;height:58px;line-height:58px;text-align:center;color:white;background:#407ba3;border-radius:4px;float:left;margin-left:10px;}
	.wid_33 { width:100%;float:left;height:99px;line-height:99px;padding-top:13px;padding-bottom:13px; }
	.wid_50 { width:100%;float:left;height:99px;line-height:99px;padding-top:13px;padding-bottom:13px; }
	.plno { padding-left:0px !important; }
    .test_title2{/*타이틀 효과*/
	  font-size: 30px;
	  color: #2a2a2a;
      margin-bottom: 10px
	}
    .test_title3{/*타이틀 효과*/
	  font-size: 30px;
	  color: #ff8584;
      margin-bottom: 10px
	}
	/*select { height:58px !important;font-size:30px !important; }
	input[type=text] { height:58px !important;font-size:30px !important; }*/
/*	input[type=checkbox] {
    transform: scale(2);margin-right:10px;margin-left:10px;
}*/
/*input[type=radio] {
    transform: scale(2);margin-right:10px;margin-left:10px;
}*/
 .nb { width:180px; }
 .r1 { float: left;width:calc( 32.6% - 56px ) !important; }
 .pb { width:180px; }

 .r2 {  float: left;width:calc( 100% - 170px ) !important; }
	}
.select1{
		height:50px;padding:3px 20px;font-size:20px;color: #2a2a2a;
        background: white;    border: 1px #e3e3e3 solid;
	}

.test_orange{color: #7493db; font-weight:600;}


/*이상형찾기 리뉴얼*/
.noto{font-family: 'Noto Sans KR', sans-serif;}
.jal{font-family: 'jalnan', Sans-Serif;}

#div0{display:block;}
#div0 .progress_container{display:none;}
#div0 .btn_1 li{width: 230px !important; margin: 0 auto !important; display: block !important;}
#div1{display:none;}
#div2{display:none;}
#div3{display:none;}
#div4{display:none;}
#div5{display:none;}
#div6{display:none;}
#div7{display:none;}
#div8{display:none;}
#div9{display:none;}
#div10{display:none;}
#div11{display:none;}
#div12{display:none;}
#div13{display:none;}
#div14{display:none;}
#div15{display:none;}
#div16{display:none;}
.div17{display:none;}
#result1{display:none}

/*제목*/
.swid {font-family: 'Noto Sans KR', sans-serif; text-align: center;}
.swid .lovetest_0 {width: 100%; text-align: center; background: #f4f4f4; padding: 50px;}
.swid .lovetest_1 {width: 100%; text-align: center; background: #f4f4f4; padding: 50px;}
.swid .lovetest_2 {width: 100%; text-align: center; background: #f4f4f4; padding: 50px;}
.swid .lovetest_3 {width: 100%; text-align: center; background: #f4f4f4; padding: 50px;}
.swid .lovetest_4 {width: 100%; text-align: center; background: #f4f4f4; padding: 50px;}
.swid .lovetest_5 {width: 100%; text-align: center; background: #f4f4f4; padding: 50px;}
.swid .lovetest_6 {width: 100%; text-align: center; background: #f4f4f4; padding: 50px;}
.swid .lovetest_7, .swid .lovetest_8, .swid .lovetest_9, .swid .lovetest_10, .swid .lovetest_11, .swid .lovetest_12, .swid .lovetest_13, .swid .lovetest_14, .swid .lovetest_15, .swid .lovetest_16, .swid .lovetest_17{width: 100%; text-align: center; background: #f4f4f4; padding: 50px;}
.swid .lovetest_1 #up_title{width: 100%; background:  url(/skin/view/images/lovetest3_2_1.jpg);background-size: cover;margin-bottom: -10px;}
/*.swid .border{border: 3px solid; border-image: linear-gradient(30deg, #c78b70, #f6d6a8, #c78b70, #f6d6a8, #c78b70);
    border-image-slice: 1;position: relative;z-index: 999;width: 100%;padding: 70px 0}*/

/*.swid #gradient{background: linear-gradient(to right,rgba(0,0,0,0),rgba(0,0,0,.3),rgba(0,0,0,0));width: 100%;margin: 0 auto;}*/

.swid .logo img{display: block; margin: 0 auto}
.swid .warn1{color: white;} 
.swid .italic{font-style: italic;font-family: 'GowunBatang-Regular';} 
.swid .warn1 .impact{font-style: italic;font-weight: bold;background: linear-gradient(180deg,rgba(255,255,255,0) 50%, #f4957f 50%);}
.swid .warn1 span{font-weight: bold;color:white;}
.swid .warn2{color: white;line-height: 30px;font-style: italic;font-family: 'GowunBatang-Regular';} 
.swid .warn2 .underline1 {height: 5px;width: 150px; position: absolute;margin-left: -155px} 
.swid .warn2 .underline2 {height: 5px;position: absolute;margin-left: -65px} 
.swid .warn2 .underline3 {height: 5px;position: absolute;margin-left: -75px} 
.swid .warn2 span{font-weight: bold;color:white;}
.swid .title{text-align:center;color: white;font-weight: bold;}
.swid .t_under{text-align:center;}



/*테스트 내용*/
.sel_box{padding:90px 0px 70px; /*background: url(/skin/view/images/sub3/test_14_bg.png);*/ background-color:#ffffff; background-repeat: no-repeat;background-size: cover; background-position: center; /*height: 800px;*/ text-align: center; margin: 0 auto; display: flex; flex-direction: column; justify-content: center; align-items: center;}

.sel_box_main{padding:60px 0px 30px; /*background: url(/skin/view/images/sub3/test_14_bg.png);*/ background-color:#f4f4f4; background-repeat: no-repeat;background-size: cover; background-position: center; /*height: 800px;*/ text-align: center; margin: 0 auto; display: flex; flex-direction: column; justify-content: center; align-items: center;}

.sel_box2{padding:100px 0px; background: #ffffff; /* url(/skin/view/images/sub3/test_14_bg2.png); */ background-repeat: no-repeat;background-size: cover; background-position: center; height: 800px; text-align: center; margin: 0 auto; display: flex; flex-direction: column; justify-content: center; align-items: center;}

.top_padding{padding-right:0px !important; padding-left:0px !important;}

.sel_box .warn3{font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Pretendard Variable", Pretendard, Roboto, "Noto Sans KR", "Segoe UI", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;color: white;text-align: left;line-height: 30px;border: 1px solid white;margin: 0 auto;font-size: 15px;width: 400px;padding: 10px 20px} 
.sel_box .warn3 span{font-weight: bold;color:#2cb1ae;}
.swid .warn3 .impact{font-style: italic;font-weight: bold;border-bottom: 2px solid #2cb1ae;color: #2cb1ae} 
.sel_box #warn4_box{    font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Pretendard Variable", Pretendard, Roboto, "Noto Sans KR", "Segoe UI", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;text-align: center} 
.sel_box #warn4_box li{display: inline-block} 
.sel_box #warn4_box img{height: 75px;margin-top: -50px} 
.sel_box .warn4{color: white;text-align: left;line-height: 25px;font-size: 15px;word-break: break-all;width: 350px;margin: 0 15px 0 20px} 


.sel_box .intitle span{background: #d5eeff;}
.sel_box .intitle{font-size: 37px;color: #2a2a2a;position: relative;z-index:10;text-align:center;font-weight: 500;}
.sel_box .line{margin:0 auto;border: 3px dotted #00ff0000;border-bottom-color:white;}


.question_number {
    font-size: 28px;
    color: #7493db;
    text-align: center;
    margin-bottom: 10px;
	font-weight: 600;
}

.test_top_logo{margin-bottom:30px;}

.main_title {
    font-size: 44px;
    color: #252525;
    text-align: center;
  /*  margin-bottom: 30px;*/
	letter-spacing: -2px;
	line-height: 60px;
font-family: "source-han-serif-k-variable", sans-serif; /*제목 serif*/
font-variation-settings: "wght" 600;
}

.main_title_sm{
    font-size: 42px;
    color: #252525;
    text-align: center;
  /*  margin-bottom: 30px;*/
	letter-spacing: -2px;
	line-height: 60px;
font-family: "source-han-serif-k-variable", sans-serif; /*제목 serif*/
font-variation-settings: "wght" 500;
}

.main_title_s {
    font-size: 60px;
    color: #222222;
    text-align: center;
    font-weight: 600;
    margin: 18px 0;
	letter-spacing: -2px;
	line-height: 60px;
}

.main_title_l{
	font-size: 36px;
    color: #222222;
    text-align: center;
    font-weight: 500;
    margin-bottom: 30px;
	letter-spacing: -1.5px;
	line-height: 52px;	
}

.main_sub{
	color: #222222;
    font-weight: 500;
    margin: 30px 0 20px;
    font-size: 20px;
    letter-spacing: -0.5px;
	line-height: 30px;
}

.main_bottom{
	color: #222222;
    font-weight: 400;
    margin-top: 20px;
    font-size: 17px;
    letter-spacing: -0.5px;
}

.main_bottom .count-number{
    font-size: 20px;
    font-weight: 600;
    color: #7493db;
}

/* 진행률 그래프 */
.progress_container {
    width: 70%;
    max-width: 600px;
    margin: 20px auto 34px auto;
    text-align: center;
}

.progress_bar {
    width: 100%;
    height: 8px;
    background-color: #f0f0f0;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}

.progress_fill {
    height: 100%;
    background-color: #7493db;
    width: 0%;
    transition: width 0.5s ease;
    border-radius: 10px;
}

.progress_text {
    display: none; /* 진행률 텍스트 숨김 */
}

.sel_box .margin_5{margin-bottom:4%}
.sel_box_main .btn_1 .row_1 li:first-child{background:white;color: #7493db; border:2px solid #7493db;}
.sel_box .btn_1 .row_1 li:first-child{background:white;color: #7493db; border:2px solid #7493db;}
.sel_box .btn_1 .row_1 li:last-child{background:white;color: #7493db; border:2px solid #7493db;}
.sel_box .btn_1 .row_2 li:first-child{background:white;color: #7493db; border:2px solid #7493db;}
.sel_box .btn_1 .row_2 li:last-child{background:white;color: #7493db; border:2px solid #7493db;}
.sel_box .btn_1 .row_3 li:first-child{background:white;color: #7493db; border:2px solid #7493db;}
.sel_box .btn_1 .row_3 li:last-child{background:white;color: #7493db; border:2px solid #7493db;}
.sel_box .btn_1 .row_4 li:first-child{background:white;color: #7493db; border:2px solid #7493db;}
.sel_box .btn_1 .row_4 li:last-child{background:white;color: #7493db; border:2px solid #7493db;}
.sel_box .btn_1 .row_5 li:first-child{background:white;color: #7493db; border:2px solid #7493db;}
.sel_box .btn_1 .row_5 li:last-child{background:white;color: #7493db; border:2px solid #7493db;}

.sel_box .btn_1{font-size: 20px !important; margin: 0 auto; width: 100%; margin-top: 30px;}
.sel_box_main .btn_1{font-size: 20px !important; margin: 0 auto; width: 100%; margin-top: 20px;}
.sel_box .btn_1 ul{text-align: center; width: 100%;}
.sel_box_main .btn_1 ul{text-align: center; width: 100%;}
.sel_box .btn_1 li{height:70px;border-radius:8px;text-align: center;line-height: 68px;cursor: pointer; display: inline-block;margin-right: 2%; font-weight: 500; background: white; color: #2a2a2a; border: 1px solid #e0e0e0; transition: all 0.3s ease; width: 48%; margin-bottom: 20px;}
.sel_box_main .btn_1 li{height:66px;border-radius:8px;text-align: center;line-height: 60px;cursor: pointer; display: inline-block;margin-right: 2%; font-weight: 600; background: white; color: #2a2a2a; border: 1px solid #e0e0e0; transition: all 0.3s ease; width: 48%; margin-bottom: 20px;}
.sel_box .btn_1 li:last-child{margin-right: 0}
.sel_box .btn_1 .row_1 li:hover{background: #7493db; color: #ffffff; border-color: #7493db;}
.sel_box_main .btn_1 .row_1 li:hover{background: #7493db; color: #ffffff; border-color: #7493db;}
.sel_box .btn_1 .row_2 li:hover{background: #7493db; color: #ffffff; border-color: #7493db;}
.sel_box .btn_1 .row_3 li:hover{background: #7493db; color: #ffffff; border-color: #7493db;}
.sel_box .btn_1 .row_4 li:hover{background: #7493db; color: #ffffff; border-color: #7493db;}
.sel_box .btn_1 .row_5 li:hover{background: #7493db; color: #ffffff; border-color: #7493db;}


.sel_box .btn_2 li:first-child{background:white;color: #2a2a2a}
.sel_box .btn_2 li:nth-child(2){background:white;color: #2a2a2a}
.sel_box .btn_2 li:nth-child(3){background:white;color: #2a2a2a}
.sel_box .btn_2 li:nth-child(4){background:white;color: #2a2a2a}
.sel_box .btn_2 li:nth-child(5){background:white;color: #2a2a2a}
.sel_box .btn_2 li:nth-child(6){background:white;color: #2a2a2a}
.sel_box .btn_2 li:nth-child(7){background:white;color: #2a2a2a}
.sel_box .btn_2 li:nth-child(8){background:white;color: #2a2a2a}

.sel_box .btn_2{font-size: 20px !important; width: 100%;}
.sel_box .btn_2 li{margin: 0 auto;height:64px;border-radius: 15px;text-align: center;line-height: 62px;cursor: pointer;margin-bottom: 5%;font-weight: 600; background: white; color: #2a2a2a; border: 1px solid #e0e0e0; transition: all 0.3s ease; width: 48%; display: inline-block; margin-right: 2%;}
.sel_box .btn_2 li:last-child{margin-bottom: 0}
.sel_box .btn_2 li:hover{background: #7493db; color: #000000; border-color: #7493db;}


.sel_box .btn_1 li{font-size: 20px !important; width: 23% !important;}
.sel_box .btn_2 li{font-size: 20px !important;  width: 23% !important;}

@media screen and (max-width: 1024px){
	.sel_box .btn_1, .sel_box .btn_1 li{font-size: 20px !important;}
	.sel_box .btn_2, .sel_box .btn_2 li{font-size: 20px !important;}

.sel_box .btn_1 li{font-size: 20px !important; width: 34% !important;}
.sel_box .btn_2 li{font-size: 20px !important;  width: 34% !important;}
	
	.result1{width:31% !important;}
}

/*div2 버튼*/
.swid .lovetest_2 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_5_1.jpg);background-size: cover;margin-bottom: -10px}



/*div3 버튼*/
.swid .lovetest_3 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_4_1.jpg);background-size: cover;margin-bottom: -10px}



/*div4 버튼*/
.swid .lovetest_4 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_3_1.jpg);background-size: cover;margin-bottom: -10px}


/*div5 버튼*/
.swid .lovetest_5 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_1_1.jpg);background-size: cover;margin-bottom: -10px}


/*div6 버튼*/
.swid .lovetest_6 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_4_1.jpg);background-size: cover;margin-bottom: -10px}



/*div7 버튼*/
.swid .lovetest_7 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_5_1.jpg);background-size: cover;margin-bottom: -10px}

.swid .lovetest_8 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_5_1.jpg);background-size: cover;margin-bottom: -10px}
.swid .lovetest_9 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_5_1.jpg);background-size: cover;margin-bottom: -10px}
.swid .lovetest_10 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_5_1.jpg);background-size: cover;margin-bottom: -10px}
.swid .lovetest_11 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_5_1.jpg);background-size: cover;margin-bottom: -10px}
.swid .lovetest_12 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_5_1.jpg);background-size: cover;margin-bottom: -10px}
.swid .lovetest_13 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_5_1.jpg);background-size: cover;margin-bottom: -10px}
.swid .lovetest_14 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_5_1.jpg);background-size: cover;margin-bottom: -10px}
.swid .lovetest_15 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_5_1.jpg);background-size: cover;margin-bottom: -10px}
.swid .lovetest_16 #up_title{width:100%;background:  url(/skin/view/images/lovetest3_5_1.jpg);background-size: cover;margin-bottom: -10px}


/*div8*/
.result1 {font-size: 23px; margin: 0 auto;height:66px;background: #7493db; border-radius: 8px;text-align: center;line-height: 62px;cursor: pointer;color:#ffffff;font-weight: 600;}

/*
.result1:hover{background: #407ba3;
 -webkit-transition: background-color 0.3s linear;
    -moz-transition: background-color 0.3s linear;
    -ms-transition: background-color 0.3s linear;
    -o-transition: background-color 0.3s linear;
    transition: background-color 0.3s linear;color: #fff}

.ticket img{width: 100%;}
.ticket p{color: white;text-align: center}
.ticket span{color: #407ba3;}
.ticket .small{color: #407ba3;font-size: 23px;text-align: center;font-weight: 100}
*/


/*div9*/
#div9{font-family: 'Noto Sans KR', sans-serif;}

.result {margin: 0 auto;font-size: 25px;height:55px;background:#fff;border-radius: 100px;text-align: center;line-height: 55px;cursor: pointer;color: #7493db}
.result:hover{background: #7493db;
 -webkit-transition: background-color 0.3s linear;
    -moz-transition: background-color 0.3s linear;
    -ms-transition: background-color 0.3s linear;
    -o-transition: background-color 0.3s linear;
    transition: background-color 0.3s linear;color: #fff}


.info {margin-bottom: 70px;background:#fff;}
.info ul{margin-bottom: 30px}

.div9_name li:last-child{width:50%;}
.div9_gender li span{margin-right: 50px}
.div9_gender li input{margin-top: -2px;}
.div9_year li:last-child{width:50%;}
.div9_numb li:last-child{margin-bottom: 110px}
.div9_numb2 li:last-child{margin-bottom: 110px}
.div9_agree {margin-top: 10px; width: 100%; display:inline-block;text-align:left;}
.div9_agree li{float: left;}
.div9_agree li:last-child {margin-right: 0}


/*result1*/
.end{margin-bottom: 50px;width: 100%;text-align: center;}
.end .about{margin-top: 40px;font-size: 25px;color: #2cb1ae;}
.end span{color: white;font-family: 'jalnan', Sans-Serif;font-size: 30px;}
.end .tada{font-size: 25px;color: white}
.end .tada .in{margin-top: 40px;text-align: center}
.end .tada .numb{border:2px solid #2cb1ae;text-align: center;width: 20%;margin: 15px auto;border-radius: 10px}
	.end img {width:100%;}



/*250626 추가*/
/*body {
  margin: 0;
  padding: 0;
  font-family: 'Pretendard', sans-serif;
  background: #f8f8f8;
}

.lovetest_1 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 800px;
}
*/
.form_container {
  width: 800px;
  background: #fff;
  padding: 40px;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.05);
  box-sizing: border-box;
}

/* 2열 구성 */
.form_row_2col {
  display: flex;
  gap: 36px;
  margin-bottom: 28px;
  padding-left: 0;
}

.form_row_2col li {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 16px;
}

.form_row_2col label {
  width: 70px;
  font-weight: 600;
  font-size:19px;
	text-align: left;
}

.input {
  flex: 1;
  padding: 14px;
  border: 1px solid #ccc;
  border-radius: 6px;
  font-size: 16px;
  box-sizing: border-box;
}

select.input{
height: 52px;
  border-radius: 6px;
  font-size: 16px;
  background-color: #fff;
  border: 1px solid #ccc;
  appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'><polyline points='30,55 70,95 110,55' stroke='%23000' stroke-width='20' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: right 14px center;
background-size: 14px;}

.short {
  width: 83px;
}

.gender_box input{width:18px; height:18px; margin-right:8px;}

.gender_box label{margin-right:13px; width: 40px;}


/* 휴대폰 섹션 */
.phone_line {
  display: flex;
  align-items: center;
  gap: 16px;
      margin: 34px 0 20px;
}

.label_left {
  width: 70px;
  font-weight: 600;
  font-size:19px;
}

.phone_inputs {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
}

.btn_cert, .btn_cert_confirm {
  padding: 14px 30px;
  background: #7493db;
  border: none;
  border-radius: 6px;
  color: #ffffff;
  cursor: pointer;
  font-size: 17px;
  white-space: nowrap;
  font-weight:600;
}

.btn_cert_confirm{padding: 14px 26px;}

.cert_inline {
  display: none;
  align-items: center;
  gap: 8px;
}

.cert_inline .short {width:134px; margin: 0 5px;}

/* 개인정보 */
.agree_flex {
  display: flex;
  gap: 20px;
  margin: 30px 0;
	width:50%;
}

.agree_item {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.agree_item label{text-align: left;}

.agree_item textarea {
  height: 60px;
  resize: none;
  font-size: 13px;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  overflow-y: auto;
  letter-spacing:0.5px;
  font-family: 'Pretendard', sans-serif;
}

@media screen and (min-width: 1024px) {
    #chk1 {
        width: 18px !important;
        height: 18px !important;
        margin-top: 0px !important;
    }
}

.btn_1 li.active {
  background-color: #7493db !important;
  color: #fff !important;
  border: 1px solid #7493db !important;
}


/* 결과 버튼 */
.btn_submit_wrap {
  text-align: center;
  
}

.btn_submit {
  background: #7493db;
  padding: 16px;
  border-radius: 6px;
  border: none;
  font-size: 19px;
  color: #ffffff;
  cursor: pointer;
  width:100%;
	min-width:200px;
  font-weight:600;
}

/*251016 이미지 추가*/

 /* 전체 박스 */
  .wrap {
    width:1200px;
    max-width:100%;
    background:#f4f4f4;
  /*   border-radius:20px;
    box-shadow:0 4px 15px rgba(0,0,0,0.05);
   display:flex;*/
    justify-content:center;
  }

/* 실제 이미지 영역 */
  .grid {
    width:1100px;
	  margin:0 auto;
    display:grid;
    grid-template-columns:repeat(6, 1fr);
    gap:24px 8px; /* 세로, 가로 간격 */
    justify-items:center;
	padding-bottom:30px;
  }

  .bubble {
    width:160px;  /* 이미지 크기 조절 */
    height:160px;
    border-radius:50%;
    overflow:hidden;
  }

  .bubble img {
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:0.4;
    transition:opacity 400ms ease, transform 400ms ease;
    display:block;
  }

  .bubble img.is-active {
    opacity:1;
    transform:scale(1);
  }

  @media (max-width:1024px){
    .wrap { width:100%; border-radius:0; padding:60px 0; }
    .grid { width:90%; grid-template-columns:repeat(3,1fr); gap:18px; }
    .bubble { width:180px; height:180px; }
	  .sel_box_main{padding:0;}
  }


.input_box {
    width: 70%;
    max-width: 300px;
    display: block;
    margin: 20px auto;
    padding: 12px 12px;
    border: 0;
    font-size: 20px;
    border-bottom: 1px solid #ccc;
    text-align: center;
}


.input_box:focus{  outline: none;
  box-shadow: none;   /* 부트스트랩 등 그림자 제거 */
  border-color: inherit; /* 테두리 색 변동 방지(선택) */
}

.input_box::placeholder{
	
 color: #ccc; /* 원하는 색상으로 변경 (#ccc, #999, 등) */
  opacity: 1; /* 브라우저별 기본 흐림 방지 */
}


select.select_box{
    -webkit-appearance: menulist !important; /* Safari, Chrome */
    -moz-appearance: menulist !important;    /* Firefox */
    appearance: menulist !important;  
    background-position: right 12px center !important;
    background-repeat: no-repeat !important;
    /* 필요 시 아래 라인 활성화해 간단한 화살표 추가 가능 (로컬 아이콘 사용 시 경로 조정)
    background-image: url('/path/to/chevron-down.svg');
    */
    cursor: pointer !important;
	/*color:#cccccc;*/
}
.select_box option{color:#222222;}

  /* placeholder 대체 옵션(비활성) 스타일이 흐리게 보이길 원하면: */
.select_box option[disabled] { color: #cccccc !important; }



/*여기서 부터 추가*/

.input_row {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px; /* 인풋과 버튼 사이 간격 */
  margin-top: 20px;
}

.input_box {
  width: 300px; /* 적당한 크기로 조정 */
  padding: 12px;
  font-size: 20px;
  border: 0;
  border-bottom: 1px solid #ccc;
  text-align: center;
}

.btn_next {
  padding: 14px 42px;
  background-color: #7493db;
  color: #fff;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  transition: 0.3s;
font-size:18px;
}

.btn_next:hover {
  background-color: #5d7ec4;
}