@import url("../font/pretendard/pretendard.css");
@import url("../font/freesentation/freesentation.css");

a { color: #333;	text-decoration: none; }
.container { width: 1080px; margin: 0 auto; position: relative; }
.notScroll {overflow: hidden; width: 100%; height: 100vh; touch-action: none;}
.mbr {display: none !important;}

/* Select box 스타일 초기화 */ 
select {
	padding: 0 10px 0 4px;
	background: #fff url('arrow.png') no-repeat 100% 50% !important;
	border-radius: 0px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
  color: inherit;
  font-family: inherit;
}

select option { 
	color: #222;
}

/* IE 에서 Select box 화살표 제거 */ 
select::-ms-expand { display: none; }

/* IE10 이상에서 input box 에 추가된 지우기 버튼 제거 */
input::-ms-clear { display: none; }

/* placeholder 초기화 */
input::-webkit-input-placeholder {
  color: #aaa;
  font-style: normal;
  font-weight:100;
}
input:-ms-input-placeholder {
  color: #aaa;
  font-style: normal;
  font-weight:100;
}
textarea::-webkit-input-placeholder {
  color: #aaa;
  font-style: normal;
  font-weight:100;
}
textarea:-ms-input-placeholder {
  color: #aaa;
  font-style: normal;
  font-weight:100;
}
input::placeholder { font-weight: 400; color:#aaa; }

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	transition: background-color 5000s ease-in-out 0s;
	-webkit-transition: background-color 9999s ease-out;
  -webkit-box-shadow: 0 0 0px 1000px none inset !important;
}

/* header */
header {background: #3d95e6;}
header .container {display:flex; align-items:center;}
header a {display: inline-block; padding: 25px 0;}
header a img {width: 107px;}

/* section1 */
.sec1 {padding: 93px 0 190px; background: #F3F9FF url(./form_bg.png) no-repeat center;}
.sec1 .title_wrap {display: flex; align-items: center; justify-content: center; margin-bottom: 58px; gap: 9px;}
.sec1 .title_wrap h2 {font-size: 73px; color: #3d95e6; font-family: 'Freesentation'; font-weight: 800;}
.sec1 .title_wrap h2 b { color: #003cdc; font-family: 'Freesentation';}
.sec1 .title_wrap img { width: 300px;}

.sec1 .main_wrap {display: flex; align-items: center; justify-content: space-between; gap: 60px;}
.sec1 .main_wrap .text_wrap .main_title {text-align: center; margin-bottom: 30px;}
.sec1 .main_wrap .text_wrap .main_title p {font-size: 32px; color: #3d95e6; font-weight: 500; margin-bottom: 26px; font-family: 'Freesentation';}
.sec1 .main_wrap .text_wrap .main_title h3 {font-size: 36px; color: #222; font-weight: 700; font-family: 'Freesentation'; line-height: 1.4;}
.sec1 .main_wrap .text_wrap .main_title h3 b {background: #1088f6; border-radius: 30px; padding: 3px 14px; color: #fff;}
.sec1 .main_wrap .text_wrap ul { background: #fff; border-radius: 45px; padding: 40px; display: flex; flex-direction: column; gap: 35px;}
.sec1 .main_wrap .text_wrap ul li {display: flex; align-items: center; gap: 15px;}
.sec1 .main_wrap .text_wrap ul li p {font-size: 27px; color: #222; font-family: 'Freesentation'; white-space: nowrap;}
.sec1 .main_wrap .text_wrap ul li img {width: 24px;}

.sec1 .main_wrap .form_wrap {background: #fff; border: 7px solid #a7d5ff; border-radius: 50px; padding: 40px 30px; height: 490px; box-sizing: border-box;}
.sec1 .main_wrap .form_wrap form {height: 100%; display: flex; flex-direction: column;}
.sec1 .main_wrap .form_wrap .form_title {display: flex; align-items: center; justify-content: center; gap: 6px; flex: none;}
.sec1 .main_wrap .form_wrap .form_title img {width: 28px;}
.sec1 .main_wrap .form_wrap .form_title h3 {font-size: 24px; color: #2b2018; font-weight: 700;}

.sec1 .main_wrap .form_wrap ul {display: flex; flex-direction: column; justify-content: center; gap: 24px; flex: 1 1 auto; min-height: 0; margin-bottom: 0;}
.sec1 .main_wrap .form_wrap ul.step2 {display: none;}
.sec1 .main_wrap .form_wrap form.step2on ul.step1 {display: none;}
.sec1 .main_wrap .form_wrap form.step2on ul.step2 {display: flex;}
.sec1 .main_wrap .form_wrap ul li .input_box {display: flex; flex-direction: column; gap: 7px;}
.sec1 .main_wrap .form_wrap ul li .input_box label {color: #444; font-weight: 500;}
.sec1 .main_wrap .form_wrap ul li .input_box input {height: 50px; background: #fff; border-radius: 10px; padding-left: 14px; outline: none; border: 1px solid #c3ced6; width: 100%; font-family:Pretendard,sans-serif; font-size: 16px;}
.sec1 .main_wrap .form_wrap ul li .input_box .tel_wrap {display: flex; gap: 10px;}
.sec1 .main_wrap .form_wrap ul li .input_box .tel_wrap select {height: 50px; background: #fff; border-radius: 10px; border: 1px solid #c3ced6; outline:none; width: 100px; padding-left: 14px; font-size: 16px; font-family:Pretendard,sans-serif;}

.sec1 .main_wrap .form_wrap ul li.visit label {display: block; color: #444; font-weight: 500; margin-bottom: 7px;}
.sec1 .main_wrap .form_wrap ul li.visit .btn-group {display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;}
.sec1 .main_wrap .form_wrap ul li.visit .btn-yes-no {height: 50px; background: #fff; border: 1px solid #c3ced6; border-radius: 10px; font-size: 16px; color: #444; font-family:Pretendard,sans-serif; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.sec1 .main_wrap .form_wrap ul li.visit .btn-yes-no.active {background: #eaf4ff; border: 1px solid #1088f6; color: #1088f6; font-weight: 700;}

.sec1 .main_wrap .form_wrap button.btn_submit {height: 60px; flex: none; background: #1088f6; border-radius:10px; color: #fff; display: flex; align-items: center; justify-content: center; width: 400px; font-size: 23px; font-weight: 700;}
.sec1 .main_wrap .form_wrap button.btn_submit i img {width: 24px;}

/* section2 */
.sec2 {background: #3D95E6 url(../Img/con_BG.png) no-repeat center; padding: 170px 0 280px;}
.sec2 .title_wrap { position: relative; width: fit-content; margin: 0 auto; margin-bottom: 90px;}
.sec2 .title_wrap img {width: 30px; position: absolute;}
.sec2 .title_wrap img:nth-of-type(1) {left: -20px; top: -22px;}
.sec2 .title_wrap img:nth-of-type(2) {right: -26px; bottom: -20px;}
.sec2 .title_wrap h2 {font-size: 60px; color: #fff; font-family: 'Freesentation'; font-weight: 800;}

.sec2 .content_wrap {position: relative;}
.sec2 .content_wrap .dog, .sec2 .content_wrap .cat {position: relative;}
.sec2 .content_wrap .dog {margin-bottom: 286px;}

.sec2 .content_wrap .content_title {background: #f0f8ff; border-radius: 100px; width: fit-content; margin: 0 auto; display: flex; align-items: center; justify-content: center; padding: 17px 30px; gap: 10px;}
.sec2 .content_wrap .content_title img {width: 24px;}
.sec2 .content_wrap .content_title h3 {font-size: 42px; color: #3d95e6; font-family: 'Freesentation'; font-weight: 800;}
.sec2 .content_wrap .content_title b {font-size: 36px; font-family: 'Freesentation';}

.sec2 .content_wrap .content_box { position: relative; margin-top: 30px; background: url(../Img/content_bg.png) no-repeat 0 / 100% 100%;}
.sec2 .content_wrap ul { padding: 40px 115px;}
.sec2 .content_wrap ul li { display: flex; align-items: center; gap: 30px; padding: 60px 70px;}
.sec2 .content_wrap ul li:not(:last-child) { border-bottom: 2px solid #e8edf0;}
.sec2 .content_wrap ul li img {width: 180px;}
.sec2 .content_wrap ul li .text_wrap h4 {font-size: 30px; font-family: 'Freesentation'; font-weight: 700; color: #444; line-height: 1.4;}
.sec2 .content_wrap ul li .text_wrap h4 b.blue {color: #1088f6; font-family: 'Freesentation';}
.sec2 .content_wrap ul li .text_wrap h4 b.small { font-family: 'Freesentation';}
.sec2 .content_wrap ul li .text_wrap p {margin-top: 10px; font-size: 26px; color: #888; line-height: 1.6; font-size: 26px; white-space: nowrap;}
.sec2 .content_wrap .dog > img {width: 300px; position: absolute; right: -60px; bottom: -70px;}
.sec2 .content_wrap .cat > img {width: 300px; position: absolute; left: -60px; bottom: -130px;}

/* section3 */
.sec3 {padding: 80px 0;}
.sec3 button {background: #fff; border-radius: 100px; border: 2px solid #3d95e6; font-size: 24px; color: #3d95e6; font-weight: 600; display: flex; align-items: center; justify-content: center; padding: 14px 94px; margin: 0 auto;}

/* section7 */
.sec4 {background: #fff; color:#333; width:100%;}
.sec4 .container {width: 1200px; border-top: 1px solid #d2d5d8; padding: 60px 0 80px;}
.sec4 h3 {margin-bottom: 38px; font-size: 24px; font-weight: 700;}
.sec4 ul li {color:#222; position:relative; font-size: 16px; line-height: 1.8;}
.sec4 ul li b {color: #3F96E6;}