@charset "utf-8";


/* common */
/* .df{display: flex;flex-wrap: wrap;justify-content: space-between;} */
.df {display: flex !important;flex-wrap: wrap;}
.df .half{flex: 0 1 calc(100% / 2)}
.no-scroll {
	overflow: hidden !important; 
}

/* slick common */
.slick-slider {width: 100%;height: 100%;overflow: hidden;}
.slick-slider div {width: 100%;float: left;height: 100%;text-align: center;}
.slick-slider div .img img{width: 100%;height: 100%;object-fit: cover;}
.slide_wrap{border: 1px solid #e5e5e5;border-radius: 30px;padding: 35px 40px;position: relative;z-index: 0;overflow: hidden;flex: 60%;}


/* layout */
.wr-1500{width: 100%;max-width: 1500px; margin: 0 auto;}
.wr-1770{width: 100%;max-width: 1770px; margin: 0 auto;}


.sub_con {}
.sub_con > .sub {margin: 72px auto;/* min-height: 700px; */}
.sub_con > .sub .box {display: flex;flex-direction: column;justify-content: center;width: 100%;align-items: center;}
.sub_con > .sub .box + .box {margin-top: clamp(20px,2.8vw,60px);}
.sub_con > .sub .box > .text_box_wrap {margin-bottom: 0;}
.sub_con > .sub .box > .title {background-color: #04162a50; min-width: 175px; line-height: 60px; text-align: center; border-radius: 30px; margin-top: 60px; color: #fff; font-size: clamp(17px, 3vw, 22px); font-weight: bold; }
.sub_con > .sub .box > img {margin-top: 20px;}

/* tab 스타일 기본 */
.tab {display: flex; gap: 12px; justify-content: center;}
.tab > li {border: 1px solid #04162a;border-radius: 35px;width: 100%;max-width: 230px;text-align: center;height: clamp(50px,3.8vw,70px);font-size: clamp(15px, 3vw, 20px)}
.tab > li > a {color: #04162a;height: 100%;display: flex;justify-content: center;align-items: center;}
.tab > li.action {background-color: #04162a; }
.tab > li.action > a {color:#fff;}

/* box */
.text_box_wrap {width: 100%;margin-top: clamp(20px,2vw,44px);margin-bottom: clamp(40px,2.8vw,66px);position: relative;display: flex;justify-content: center;}
.text_box_wrap > div {width: 100%;}
.text_box_wrap .text_box {width: 100%;padding: 20px;font-size: clamp(18px,2vw,17px);line-height: 25px;background-color: #04162a05;border-radius: 36px;min-height: 98px;display: flex;color: #04162a;text-align: left;position: relative;justify-content: center;align-items: center;}
.text_box_wrap .text_box.dark {background-color: #04162a; color: #fff; justify-content: center; align-items: center; text-align: center;}
.text_box_wrap .text_box.green {background-color: #e6f6f2; justify-content: center; align-items: center; text-align: center;}
.text_box_wrap .text_box.light_green {background-color: #ebf4cf; justify-content: center; align-items: center; text-align: center;}
.text_box_wrap .text_box.border {border: 2px solid #04162a; justify-content: center; align-items: center; text-align: center;}
.text_box_wrap .title {position: absolute; top: -25px; background-color: #04162a; min-width: 149px; border-radius: 25px; color: #fff; line-height: 45px; z-index: 1; text-align: center; font-size: clamp(18px, 3vw, 23px); font-weight: bold;}

/* list 스타일 기본 */
.list_style > li {list-style: disc; font-size: clamp(16px,2vw,20px);}

/* 서브의 타이틀 */
.sub .under_line {max-width: 1400px;margin: 0 auto;font-size: clamp(22px, 3vw, 30px);font-weight: bold;color: #04162a;text-align: center;padding-bottom: 20px;position: relative;display: flex;justify-content: center;}
.sub .under_line p::after {content: '';width: 100%;height: 3px;background-color: #04162a;display: inline-block;position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);}
.sub .under_line p {
	width: fit-content;
	position: relative;
	padding-bottom: 30px;
}

/* table */
table {width: 100%; border-top: 2px solid #04162a;}
table > thead {}
table > thead > tr {}
table > thead > tr > th {background-color: #f8f8f8; min-width: 150px;}
table > tbody > tr {border-bottom: 1px solid #ececec;}
table > tbody > tr > th {background-color: #f8f8f8; min-width: 150px; padding: 10px 5px; text-align: left; padding: 0 40px;}
table > tbody > tr > th.required::before {content: '*'; color: red; }
table > tbody > tr > td {padding: 10px 5px;}
table > tbody > tr > td input[type="text"],
table > tbody > tr > td textarea,
table > tbody > tr > td select {border: 1px solid #dedede; padding: 5px 10px;}

table > tbody > tr > td.tel > select {width: 100px;}
table > tbody > tr > td.tel > input {width: 100px;}

table > tbody > tr > td.email > input {width: 150px;}
table > tbody > tr > td.email > select {width: 150px;}
table > tbody > tr > td > textarea {width: 100%; padding:80px 4px;}

table + table {margin-top: 80px;}

@media (max-width: 1770px){
	/* .wr-1770{paddding:0 20px;} */
}

@media (max-width: 1500px){
	.sub_con > .sub {padding: 0 20px}
	.wr-1500{padding: 0 20px;}
}

@media (max-width: 550px){
	.tab {flex-wrap: wrap;}
	.tab > li {flex: 0 0 calc(100% / 3 - 20px);}
}
@media (max-width: 400px){
	.tab > li {flex: 0 0 calc(100% - 20px);}
}