#header{
    background-color:rgb(255,255,255,1);
    border-bottom:1px solid #ebebeb;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* 파이어폭스에서의 초기화 방법 */
input[type=number] {
    -moz-appearance: textfield;
}
출처: https://kcmschool.com/206 [web sprit:티걸어온 길]
#section01{background-size:cover; background-position:center;position:relative;}
#section01 .inner{max-width:1300px; width:75%; margin:0 auto; height:100vh; display:table;}
#section01 .inner .inner02{display:table-cell; vertical-align:middle;}
#section01 .inner .inner02 .txt_box{display: flex; flex-direction: row; font-weight:500; color:#3A3A3A; font-size:80px; line-height: 95px; letter-spacing: -0.02em; margin-top:-150px; margin-bottom: 6px;}
#section01 .inner .inner02 .txt_box span{color:#3A3A3A; font-size: 2.5rem; line-height: 95px; display:block; font-weight:500;}
#section01 .inner .inner02 .txt_box2{font-weight:300; color:#777777; font-size:28px; line-height:40px; letter-spacing: -0.02em; margin-bottom: 55px;margin-top: 15px;}
#section01 .inner .inner02 .link_box{margin-top:30px;}
#section01 .inner .inner02 .link_box a:first-child{margin-right:20px;}
#section01 .inner .inner02 .link_box a img{width:215px; height:70px;}
#section01 .login_box{position:absolute; right:0; top:0; height:100vh; width:370px; background:#fff;
	box-shadow:-1px -1px 15px rgba(0,0,0,0.3); border-radius:40px 0 0 40px; display:table;}
#section01 .login_box .inner{display:table-cell; vertical-align:middle; text-align:center;}
#section01 .login_box .inner .form{margin:90px 40px 0 40px;}
#section01 .login_box .inner .form img{width: 85px; height: 70px; position: relative; top: 15px; float: right;}
#section01 .login_box .inner .form input{width:290px; height: 50px; background: #F5F5F5;
border-radius: 10px;border:none; outline:none; font-weight:400; font-size:15px; line-height: 18px; letter-spacing: -0.02em; padding:0 15px; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; margin-bottom:20px;}
#section01 .login_box .inner .form input:placeholder{font-weight:400; font-size:15px; line-height: 18px; color:#8E8E8E; font-size:15px; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}
#section01 .login_box .inner .form button{border:none; outline:none; background:#4CBCAF; width:290px; height: 50px; border-radius:10px;
	color:#FFFFFF; font-size:15px; line-height: 18px; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}
#section01 .login_box .inner .etc_box{width:290px; margin:10px auto 0;}
#section01 .login_box .inner .etc_box:after{content:""; display:block; float:none; clear:both;}
#section01 .login_box .inner .etc_box .join{float:left;}
#section01 .login_box .inner .etc_box .join a{color:#8E8E8E; font-size:13px; font-weight:300;}
#section01 .login_box .inner .etc_box .find{float:right;}
#section01 .login_box .inner .etc_box .find ul li{margin-left:10px; display:inline-block; position:relative;}
#section01 .login_box .inner .etc_box .find ul li a{color:#8E8E8E; font-size:13px; font-weight:300;}
#section01 .login_box .inner .btn_box{display: flex; flex-direction: column; justify-content: center; align-items: center;}
#section01 .login_box .inner .btn_box .app_btn_1{width: 290px; height: 50px; background: #FFFFFF; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.15); border-radius: 5px; font-weight: 500; font-size: 15px; line-height: 18px; text-align: center; letter-spacing: -0.02em; color: #3A3A3A; padding: 16px 0; margin: 50px 0 10px 0;}
#section01 .login_box .inner .btn_box .app_btn_2{width: 290px; height: 50px; background: #A7E4DD; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.15); border-radius: 5px; font-weight: 500; font-size: 15px; line-height: 18px; text-align: center; letter-spacing: -0.02em; color: #3A3A3A; padding: 16px 0;}
#section01 .scroll{position:absolute; left:50%; transform:translateX(-50%); bottom:50px;
	animation: motion 0.6s linear 0.5s infinite alternate;}
@keyframes motion {
	0% {bottom:50px;}
	100% {bottom:60px;}
}
    .header-ment{font-size:1.3rem;word-break:keep-all;font-weight:300;}

#section02{text-align:center;}
#section02 .inner{margin:0 auto; width:75%;}
#section02 .inner .ment{color:#3A3A3A; font-size:1.4rem;}
#section02 .inner .ment span{font-weight:700; font-size: 2.5rem;margin-bottom:10px;}
#section02 .inner .ment h1{font-weight:700; font-size:1.4rem;}
#section02 .inner .ment h2{font-weight:700; font-size:20px;}
#section02 .inner .ment .title{font-weight:700; font-size:2.rem}
#section02 .inner .ment span em{color:#4CBCAF;}

#section02 .inner .video_box{position:relative; z-index:1; background-size:contain; height:700px; max-width:1200px; margin:0 auto;}
#section02 .inner .video_box:after{content:""; display:block; width:40px; height:290px; background-size:cover; position:absolute; top:172px; left:110px;}
#section02 .inner .video_box iframe{width:929px; margin-top: 102px; height: 432px;}
#section02 .inner .nt{color:#3A3A3A; font-size:20px; margin-top:-60px;}


.section03{text-align:left;
            margin-top:140px;
            overflow:hidden;
            width:100%;max-width:880px;background:white;box-shadow: 5px 5px 8px rgb(50 60 70 / 10%);
    -webkit-box-shadow: 5px 5px 8px rgb(50 60 70 / 10%);}
.section03 .inner{margin:0 auto; width:95%;padding:10px;overflow:hidden;}
.section03 .inner .list{position:relative; max-width:1200px; margin:0 auto;}
.section03 .inner .ment{color:#3A3A3A; font-size:1.3em;}
.section03 .inner .ment h2{font-weight:500; font-size:1.1rem;}
.section03 .inner .ment .title{font-weight:700; font-size:2rem}
.section03 .inner .ment span{font-weight:700; font-size: 18px;margin-bottom:10px;margin-top:10px}
.section03 .inner .ment span em{color:#4CBCAF;}
#guide ul li .guide_comment{font-weight: 400; font-size: 28px; line-height: 33px; text-align: center; letter-spacing: -0.02em; color: #8E8E8E; margin-bottom: 10px;}
#guide ul li .img{width: 65%; border-radius: 20px; overflow: hidden; margin: auto auto 60px auto;}
#guide ul li .btn_box{display: flex; flex-direction: row; justify-content: center; align-items: center; width: 680px; height: 100px; background: #FFFFFF; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); border-radius: 10px; padding: 26px 0; margin: auto;}
#guide ul li .btn_box .app_btn_1{font-weight: 600; font-size: 2.5rem; line-height: 48px; text-align: center; letter-spacing: -0.02em; color: #3A3A3A;}
#guide ul li .btn_box img{width: 50px; height: 50px; margin-left: 10px;}

.section04{ text-align:center;}
.section04 .inner{margin:0 auto; width:75%;}
.section04 .inner .list{position:relative; max-width:1200px; margin:0 auto;}
.section04 .inner .ment{color:#3A3A3A; font-size:1.4rem;}
.section04 .inner .ment h1{font-weight:700; font-size:1.2rem;}
.section04 .inner .ment h2{font-weight:500; font-size:1rem;}
.section04 .inner .ment span{font-weight:700; font-size: 2.5rem;;margin-bottom:10px;}
.section04 .inner .question_box{font-weight:500; font-size:15px;}
#section04{text-align:center;}
#section04 ul li{width:500px; display:inline-block; margin:0 50px; box-shadow:0 0 10px rgba(0,0,0,0.25); border-radius:20px;
	position:relative;}
#section04 ul li .txt{padding:20px; font-weight:700; font-size:32px; color:#3A3A3A; text-align:left;}
#section04 ul li .txt span{font-weight:300; font-size:1.4rem; display:block; word-break:keep-all; min-height:62px; margin-top:5px;}
#section04 ul li .more{position:absolute; right:20px; top:26px;}
#section04 .nt{font-weight:700; font-size:20px; margin-top:100px;}
#section04 .link_box{margin-top:30px;}
#section04 .link_box a{margin:0 20px;}
#section04 .link_box a img{width:224px;}
#section04 .sns{width: 30%; margin: 20px auto 0 auto;}
#section04 .sns ul{display: flex;}
#section04 .sns ul li{width: 100%; margin :0px; box-shadow: none;}
#section04 .sns ul li a img{width:50px; height:50px;}

.section05{padding:200px 0; text-align:center;background:#F8FBFD;}
.section05 .inner{margin:0 auto; width:75%;}
.section05 .inner .ment{color:#3A3A3A; font-size:1.4rem;line-height:3rem;}
.section05 .inner .ment span{font-weight:700; font-size: 2.5rem;margin-bottom:10px;}
.section05 .inner .ment h1{font-weight:700; font-size:1.4rem;}
.section05 .inner .ment h2{font-weight:500; font-size:20px;}

.owl-carousel .owl-dots{margin-top:20px; text-align:center;}
.owl-carousel .owl-dots > button{width:15px; height:15px; background:#D9D9D9; border-radius:100%; display:inline-block; 
	margin:0 8px;}
.owl-carousel .owl-dots > button.active{background:#8E8E8E;}
.owl-carousel .owl-nav{position:absolute; left:0%; top:50%; width:100%; transform:translateY(-50%); }
.owl-carousel .owl-nav .owl-prev{float:left; background:url('../images/web/prev_icon.svg') no-repeat;
	background-size:cover; width:40px; height:40px; text-indent:-99999px;}
.owl-carousel .owl-nav .owl-next{float:right; background:url('../images/web/next_icon.svg') no-repeat;
	background-size:cover; width:40px; height:40px; text-indent:-99999px;}

#section04 ul.mb{display:none}
.section03 .mb{display:none}
.phone_menu{
	display:none !important;
	z-index:102 !important;
}
.common_top_nav_header{
    display:none;
}
.mv_fix{
display:none;
}
@media only screen and (max-width: 1280px){
    .desktop_menu {
        display: none !important;
    }
    .common_top_nav_header{
        display:block;
    }
    .side_place{
        justify-content: space-between !important;
        flex-direction: column-reverse !important;
    }
    .section03{
        max-width:100% !important;
        margin-top: 55px !important;
    }
    .login_place_side{
        width:100% !important;
        margin-top:15px !important;
    }
.phone_menu{
		display:flex !important;
		bottom:0 !important;
        opacity:1 !important;
        top: auto;
	}
	.web_reg{
	    display:none !important;
	}
	.mobile_reg{
	    display:block !important
	}
}
@media only screen and (max-width: 1280px){
	#section02 .inner .video_box{width:1000px; height:620px;}
	#section02 .inner .video_box iframe {width: 815px;margin-top: 90px;height: 376px;}
	#section02 .inner .video_box:after{width:34px; height:246px; top:154px; left:98px;}
	#section04 ul li{width:400px}
}
@media only screen and (max-width: 1024px){
	#section01 .login_box{display:none;}
	#section02 .inner .video_box{width:760px; height:480px;}
	#section02 .inner .video_box iframe {width: 623px;margin-top: 69px;height: 286px;}
	#section02 .inner .video_box:after{width:26px; height:186px; top:116px; left:73px;}

	#section04 ul li{width:360px; margin:0 20px;}
	#section04 ul li .txt span{min-height:81px;}

	   .vision_logo_box{
        justify-content: center;
    }
    .vision_logo{
        width:100% !important;
        text-align:center !important;
    }
        .vision_logo .button_box{ justify-content: center; }
    .flex-box{
        width:33% !important;
        aspect-ratio: 1/1 !important;
    }
     .flex-box-activity{
        width:50% !important;
        aspect-ratio: 1/1 !important;
    }
}
@media only screen and (max-width: 840px){
	.section03 .inner{margin:0 auto; width:100%;}
	.section04 .inner{margin:0 auto; width:90%;}
	.section04 .inner .question_box{font-weight:500; font-size:14px;}
    .section05 .inner{margin:0 auto; width:90%;}
	.section05 .inner .question_box{font-weight:500; font-size:12px;}
	#section04 ul li{width:100%; margin:30px 0 0 0; box-shadow:none; border-radius:0;}
	#section04 ul li:first-child{margin-top:0;}
	#section04 ul li .img img{width:100%;}
	#section04 ul li .txt span{min-height:auto;}
}
@media only screen and (max-width: 768px){
    .image_box{
    width:100% !important;
    }
    .inner02 .button_box{ justify-content: center;width:100%; }
    .button_origin, .button_origin_1 {
                font-size:1.1rem !important;
    }
	#section01{background-size:cover;
  background-position: center bottom 0px;
    }
	#section01 .inner{height:100%;}
    #section01 .inner .inner02{text-align:center;padding-top:10%;padding-bottom: 45%;}
	#section01 .inner .inner02 .txt_box{font-size:60px; line-height: 70px;}
	#section01 .inner .inner02 .txt_box span{font-size:17px; line-height: 60px;}
	#section01 .inner .inner02 .txt_box2{font-size:20px; margin-bottom: 30px;}
	#section01 .inner .inner02 .link_box{margin-top:20px;}
	#section01 .inner .inner02 .link_box a img{width:110px;height:35px;}
	#section01 .inner .inner02 .link_box a:first-child{margin-right:10px;}
	#section01 .inner .inner02 .txt_box{margin-top:0;}
	#section01 .scroll{display:none;}

	#section02 .inner .ment{font-size:15px;}
	#section02 .inner .ment span{font-size:1.4rem;}
	#section02 .inner .ment h1{font-size:20px;}
	#section02 .inner .ment h2{font-size:17px;}
	#section02 .inner .video_box{width:330px; height:240px;}
	#section02 .inner .video_box iframe {width: 100%;height: 75%;margin-top: 29px;}
	#section02 .inner .video_box:after{width:14px; height:101px; top:41px; left:32px;}
	#section02 .inner .nt{font-size:12px; margin-top:0;}

    .header-ment{font-size:1.4rem;}
     .section03 .inner .ment h2{font-size:1.4rem;}
     .section03 .inner .ment .title{font-size:1.4rem;}

	.owl-carousel .owl-dots{display:none;}
	.owl-carousel .owl-nav .owl-next{width:30px; height:30px;}
	.owl-carousel .owl-nav .owl-prev{width:30px; height:30px;}

    #guide ul li .guide_comment{font-weight: 400; font-size: 14px; line-height: 18px; text-align: center; letter-spacing: -0.02em; color: #8E8E8E; margin-bottom: 5px;}
    #guide ul li .img{width: 85%; margin: auto auto 30px auto;}
    #guide ul li .btn_box{display: flex; flex-direction: row; justify-content: center; align-items: center; width: 290px; height: 50px; background: #FFFFFF; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); border-radius: 10px; padding: 13px 0; margin: auto;}
    #guide ul li .btn_box .app_btn_1{font-weight: 600; font-size: 16px; line-height: 24px; text-align: center; letter-spacing: -0.02em; color: #3A3A3A;}
    #guide ul li .btn_box img{width: 30px; height: 30px; margin-left: 5px;}

    .section04 .inner .ment span{font-size:1.4rem;}
     .section04 .inner .ment h1{font-size:20px;}
	 .section04 .inner .ment h2{font-size:17px;}

    .section05 .inner .ment span{font-size:1.4rem;}
    .section05 .inner .ment h1{font-size:20px;}
    .section05 .inner .ment h2{font-size:17px;}

	#section04{padding:50px 0;}
	#section04 ul li .txt{padding:10px; font-size:22px;}
	#section04 ul li .txt span{font-size:15px;}
	#section04 .nt{font-size:11px; margin-top:30px;}
	#section04 .link_box a img{width:110px;}
	#section04 .link_box a{margin:0 3px;}
	#section04 .link_box{margin-top:20px;}
	#section04 .sns{width: 70%; margin: 20px auto 0 auto;}
}
.button_box{
    display:flex;
    width:40%;
}
.button_origin{
    text-align:center;
    padding:8px 10px;
    font-size:1rem;
    background:#3B75FF;
    color:white !important;
    width:auto;
    white-space:nowrap;
    justify-content: center;
    max-width:fit-content;
    border-radius:5px;
}
.button_origin_2{
    border:1px solid #00a6c3;
     padding:15px 35px;
     font-size: 1.3rem;
     white-space: nowrap;
     border-radius: 30px;
}
.button_origin_top{
    text-align:center;
    border-radius:30px;
    padding:5px 15px;
    font-size:1.2rem;
    color:white !important;
    width:100%;
    max-width:1200px;
    white-space:nowrap;
    justify-content: flex-end;
    display: flex;
    align-items: center;
    line-height: normal;
    margin:0 auto;
}


#gnb_2{
display:none;
}
@media only screen and (max-width: 768px){
#gnb{
display:none !important;;
}
.logo{
display:none !important;;
}
#gnb_2{
display:block;
}
}
.button_origin_1{
    text-align:center;
    border-radius:30px;
    padding:15px 55px;
    font-size:20px;
    background:white;
    color:#3B75FF !important;
    width:auto;
    white-space:nowrap;
    justify-content: center;
    max-width:fit-content;
}
.slide .slide_inner_box{
    background:#F8FBFD;
    border-radius:10px;
    padding:20px;
    min-height:430px;
    width:100%;
    display: flex;
    align-items: stretch;
    flex-direction: column;
    text-align: left;
    justify-content: space-between;
}
.hidden_box{
    display:none;
}
.question_box{
    background-color:#F5F8FA;
    border-radius:10px;
    color:#666C80;
}

.question_box_act{
    background-color:#EFF7FF !important;
    border-radius:10px;
    color:#20222C;
}
.fw_700{
    font-weight:700 !important;
}
.fw_500{
    font-weight:500 !important;
}






.input_content {
    width: 100% !important;
    height: 220px !important;
    color: #999999 !important;
    font-weight: 400 !important;
    font-size: 15px !important;
    line-height: 18px !important;
    letter-spacing: -0.02em;
    border-radius: 10px !important;
    padding: 15px;
    border: 0;
    background:#F5F5F5;
    border-radius:5px;
}

.flex-box{
    width:20%;
    aspect-ratio: 1/1;
    padding:10px;
    display: flex;
    color:white !important;
}
.flex-box-2{
    width:33%;
    aspect-ratio: 1/1;
    padding:10px;
    display: flex;
    flex-direction: column;
}
.flex-box-inner{
display: flex;
align-items: flex-start;
flex-direction: column;
justify-content: flex-end;
padding:10px;
border-radius:10px;
}
.shadow-inside{
   box-shadow: inset 0px -49px 100px -15px rgba(0, 0, 0, 0.5)
}
.five_flex_button_flex{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
}
.five_flex_button{
    min-width:17%;
    max-width:33%;
    padding:15px 10px ;
    border-radius:10px;
    margin: 8px;
    background:#ebebeb;
    color:#20222C;
    text-align:center;
    white-space:nowrap;
}

.gray_button{
    background:#F5F8FA;
    border-radius:10px;
    padding:15px 10px ;
    text-align:center;
    width:100%;
    color:#20222C;
}

.box_3{
    display:flex;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;
}
.box_3_inner{
    width:30%;
    padding:10px;
    border-radius:10px;
    display:flex;
    flex-direction: column;
    text-align:center;;
    font-size:1rem;
    margin:5px;
}
.box_3_inner_1{
    width:30%;
    display:flex;
    flex-direction: column;
    text-align:left;
}
@media only screen and (max-width: 840px){
    .five_flex_button{
        min-width:30%;
        max-width: fit-content;
        padding:15px 10px ;
        border-radius:10px;
        margin: 5px;
        text-align:center;
        white-space:nowrap;
    }

}
@media only screen and (max-width: 670px){
    .box_3_inner{
        width:100% !important;
        font-size:1.8rem;
    }
 .box-2{
        flex-direction: column-reverse;
  }
  .box-4{
        flex-direction: column;
  }
  .box-2-image{
  width:100% !important;
  }
    }

.gray_circle {
    color: #666c80;
    background:#eeeeee;
    font-weight: 400;
    padding: 10px 15px;
    border-radius: 15px;
    margin-bottom:15px;
}
.search_input{
     width: calc(100% - 50px);
    font-size: 11px;
    padding: 20px;
    color: black;
    height: 60px;
    border: 0px;
    line-height: 30px;
}
.box-3{
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    align-content: space-around;
    padding:2rem 0rem
    justify-content: flex-start;
}

@media (max-width: 375px){
  .box-3{
        justify-content: center !important
  }
}

/* 스타일시트에서 사각형 체크박스 스타일 정의 */
.checkbox-square {
  width: 20px; /* 체크박스의 가로 크기 */
  height: 20px; /* 체크박스의 세로 크기 */
  background-color: #fff; /* 체크박스 배경색 */
  border: 1px solid #ccc; /* 체크박스 테두리 스타일 */
  border-radius: 3px; /* 체크박스 테두리 둥글기 */
  display: inline-block; /* 다른 요소와 함께 인라인으로 배치 */
  vertical-align: middle; /* 수직 정렬 */
  position: relative; /* 자식 요소들을 절대 위치로 배치하기 위함 */
}

.checkbox-square input[type="checkbox"] {
  opacity: 0; /* 기본 체크박스 숨기기 */
}

.checkbox-square input[type="checkbox"] + label {
  position: absolute; /* 절대 위치 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer; /* 마우스 커서를 포인터로 변경하여 사용자에게 클릭 가능성을 보여줌 */
}

.checkbox-square input[type="checkbox"] + label::after {
  content: ''; /* 가상 요소 생성 */
  position: absolute; /* 절대 위치 */
  top: 50%; /* 상위 50% 위치로 이동 */
  left: 50%; /* 좌측 50% 위치로 이동 */
  transform: translate(-50%, -50%); /* 가운데 정렬 */
  width: 100%; /* 크기 */
  height: 100%; /* 크기 */
  background: transparent; /* 배경색 투명 */
  border-radius: 3px; /* 체크 표시의 둥글기 */
  transition: all 0.3s; /* 움직임이 부드럽게 전환되도록 */
}

.checkbox-square input[type="checkbox"]:checked + label::after {
  background: #007bff; /* 체크 표시의 색상 변경 */
}

::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}

 .rent_tab {
        font-weight: 500;
        font-size: 1.2rem;
        text-align: center;
        letter-spacing: -0.02em;
        color: #999999;
    }

    .menu_tab td {
        border-bottom: 0px;
        padding: 10px 10px;
        width: 25%;
        text-align: center !important;
        border-bottom: 1px solid #dddddd;
    }
    td {
        color: #666;
    }
    .background-image:before {
        filter: blur(10px); /* 필터 적용, 흐림 효과를 조절할 수 있습니다 */
    }
    .box-2{
    display:flex;
    align-items: center;
}

.box-4{
    display:flex;
    align-items: center;
}