/* 공통 */
.bg_gray { background: #f5f5f5; }
.bg_brw1 { background: #bf8c50; }
.bg_brw2 { background: #8d7d6f; }
.bg_brw3 { background: #888888; }
.main_container { padding: 80px 0; width: 100%; margin: auto; }
.main_container > h4 { font-size: 40px; text-align: center; letter-spacing: -1px; line-height: 40px; margin-bottom: 20px; }
.main_container > h5 { font-size: 18px; font-weight: 400; color: #555555; text-align: center; line-height: 30px; }


/* swiper slider */
.main_img_slider { position: relative; width: 100%; height: 808px; transition: height 0.2s ease-in-out; }
.main_img_slider .swiper-slide { width: 100%; padding: 0 14vw; display: flex; justify-content: flex-start; align-items: center; background-position: center; background-repeat: no-repeat; background-size: cover; }
.main_img_slider > div > div > div >  p { word-break: keep-all; color: #000; font-size: 19px; text-align: center; font-weight: 400; color: #000000;  }
.main_img_slider > div > div > div >  h3 { color: #000; font-size: 40px; font-weight: 600; text-align: center; line-height: 55px; letter-spacing: -2px }
.main_img_slider > div > div > div >  h2:after { display: block; content: ''; width: 1px; height: 70px; background-color: #000000; margin:20px auto; transform: rotate(45deg); }
.main_img_slider > div > div > div >  h2 { margin-top: 5px; color: #000; font-size: 58px; font-weight: 300; text-align: center; letter-spacing: -4px; }
.main_img_slider .slide1 { width: 100%; max-width: 500px;  }
.swiper-pagination { bottom: 20px !important; }
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 12px 8px !important }
.swiper-pagination-bullet { width: 16px !important; height: 16px !important; background: #ffffff !important; opacity: 1 !important; border: rgba(297,297,297,0.9) !important;}
.swiper-pagination-bullet-active { background: #00844a !important; border: none !important; }
/* } */

/* 컨텐츠 */
.content01 { width: 100%; }
.content01 > ul { width: 100%; max-width: 1765px; margin: auto; display: flex; justify-content: space-between; margin-top: 40px; }
.content01 > ul > li { padding: 85px 0; background-image: url(../../../img/main_bg_01.png); background-size: cover; background-position: center; width: 31.8%; height: 400px; border: 1px solid #dddddd; }
.content01 > ul > li:hover { cursor: pointer; }
.content01 > ul > li > h2 { font-size: 60px; font-weight: 300; color: #dddddd; text-align: center; }
.content01 > ul > li > h3 { font-size: 35px; font-weight: 600; text-align: center; letter-spacing: -3px; }
.content01 > ul > li > h3 > span { display: block; font-size: 20px; letter-spacing: -1px }
.content01 > ul > li > p { font-size: 17.5px; text-align: center; margin: 5px 0; }
.content01 > ul > li:nth-of-type(1) { border-top: 3px solid #599db4; }
.content01 > ul > li:nth-of-type(2) { border-top: 3px solid #7dc90f; }
.content01 > ul > li:nth-of-type(3) { border-top: 3px solid #0aa849; }
.content01 > ul > li:nth-of-type(3) > h3 { letter-spacing: -1px; }
.content01 > ul > li:nth-of-type(1) > p { color: #599db4; }
.content01 > ul > li:nth-of-type(2) > p { color: #7dc90f; }
.content01 > ul > li:nth-of-type(3) > p { color: #0aa849; }
.content02 { width: 100%; padding: 0; }
.content02 > ul { width: 100%; display: flex; justify-content: space-between; }
.content02 > ul > li:nth-of-type(1) { background-position: center; background-size: cover; width: 50%; height: 600px; display: flex; justify-content: center; align-items: center; }
.content02 > ul > li:nth-of-type(1) > div > h4 { text-align: center; font-size: 40px; font-weight: 600; color: #ffffff; }
.content02 > ul > li:nth-of-type(1) > div > p { text-align: center; font-size: 17px; font-weight: 300; color: rgba(297,297,297,0.55); letter-spacing: 0; }
.content02 > ul > li:nth-of-type(1) > div > ol { margin: 60px 0; }
.content02 > ul > li:nth-of-type(1) > div > ol > li { line-height: 47px; display: flex; justify-content: flex-start; align-items: center; font-size: 24px; font-weight: 400; color: #ffffff; }
.content02 > ul > li:nth-of-type(1) > div > ol > li > img { margin-right: 8px; }
.content02 > ul > li:nth-of-type(1) > div > a { border: 1px solid #ffffff; width: 100%; max-width: 200px; height: 50px; line-height: 48px; font-size: 16px; font-weight: 300; display: block; margin: auto; text-align: center; color: #ffffff; }
.content02 > ul > li:nth-of-type(2) { width: 50%; }
.content02 > ul > li:nth-of-type(2) > ol > li { background-position: center; background-size: cover; padding: 80px; width: 100%; height: 300px; }
.content02 > ul > li:nth-of-type(2) > ol > li:hover { cursor: pointer }
.content02 > ul > li:nth-of-type(2) > ol > li:nth-of-type(2) { text-align: right }
.content02 > ul > li:nth-of-type(2) > ol > li > h4 { margin-bottom: 20px; color: #ffffff; font-size: 40px; font-weight: 600; }
.content02 > ul > li:nth-of-type(2) > ol > li > p { line-height: 32px; color: #ffffff; font-size: 18px; font-weight: 400; }
.content03 { padding: 120px 0; }
.content03 > ul { width: 100%; max-width: 1250px; margin: auto; display: flex; justify-content: space-between; }
.content03 > ul > li { /*width: 33.33%;*/ }
.content03 > ul > li > ol { display: flex; justify-content: flex-start; }
.content03 > ul > li > ol > li { height: 85px; }
.content03 > ul > li > ol > li > h4 { font-size: 20px; }
.content03 > ul > li > ol > li > p { font-size: 19px; font-weight: 400; }
.content03 > ul > li > ol > li:nth-of-type(1) { display: flex; align-items: center; padding: 0 30px; border-right: 1px solid #dddddd; }
.content03 > ul > li > ol > li:nth-of-type(2) { padding: 0 30px; }

@media(max-width: 1850px){
	.content01 > ul { padding: 0 20px; }
}
@media(max-width: 1400px){
	.main_img_slider .swiper-slide { padding: 0 }
}
@media(max-width: 1300px){
	.content02 > ul > li:nth-of-type(2) > ol > li { padding: 40px; }
}
@media(max-width: 1270px){
	.content03 > ul > li > ol > li:nth-of-type(1), .content03 > ul > li > ol > li:nth-of-type(2) { padding: 0 15px; }
	.content03 > ul > li > ol > li > p { font-size: 16px; }
	.content03 > ul { padding: 0 40px; }
}
@media(max-width: 1040px){
	.content03 > ul { flex-flow: row wrap; }
	.content03 > ul > li { width: 50%; margin-bottom: 30px; }
	.content03 > ul > li:last-child { margin-bottom: 0; }
	.content03 { padding: 50px 20px; }
}
@media(max-width: 960px){
	.main_img_slider { height: 600px; }
	.main_img_slider .slide1 { max-width: 400px; }
	.main_img_slider > div > div > div > h3 { font-size: 33px; line-height: 40px; }
	.main_img_slider > div > div > div > h2 { font-size: 50px; }
	.main_img_slider > div > div > div > h2:after { height: 50px; margin: 10px auto; }
	.main_img_slider > div > div > div > p { font-size: 17px; }
	.content01 > ul > li > h3 { font-size: 27px; }
	.content01 > ul > li { height: 320px; padding: 44px 0 }
	.content02 > ul > li:nth-of-type(1) > div > h4, .content02 > ul > li:nth-of-type(2) > ol > li > h4 { font-size: 29px; }
	.content02 > ul > li:nth-of-type(2) > ol > li > p { word-break: keep-all; line-height: 25px; font-size: 17px; }
	.content02 > ul > li:nth-of-type(1) > div > ol > li {  font-size: 20px; line-height: 40px; }
	.content02 > ul > li:nth-of-type(2) > ol > li { height: 275px; }
	.content02 > ul > li:nth-of-type(1) { height: 550px; }
}
@media(max-width: 800px){
	.content03 > ul > li { width: 100%; }
	.content03 > ul > li > ol > li:nth-of-type(1), .content03 > ul > li > ol > li:nth-of-type(2) { padding: 0 30px; }
	.content03 > ul { padding: 0; }
}
@media(max-width: 760px){
	.main_container > h4 { font-size: 33px; }
	.main_container > h5 { font-size: 17px; line-height: 25px }
	.content01 > ul > li > h3 > span { font-size: 19px; }
}
@media(max-width: 720px){
	.content02 > ul { flex-flow: row wrap; }
	.content02 > ul > li:nth-of-type(1), .content02 > ul > li:nth-of-type(2) { width: 100%; }
	.content02 > ul > li:nth-of-type(1) { height: 440px; }
	.content02 > ul > li:nth-of-type(2) > ol > li { height: 210px; }
	.content01 > ul { flex-flow: row wrap; }
	.content01 > ul > li { width: 100%; height: 270px; margin-bottom: 20px; padding: 25px 0; }
}
@media(max-width: 640px){
	.main_img_slider .slide1 { padding: 0 20px; max-width: 280px; }
	.main_img_slider > div > div > div > h3 { font-size: 26px; line-height: 34px; text-align: left }
	.main_img_slider > div > div > div > h2 { font-size: 40px; text-align: left }
	.main_img_slider > div > div > div > p { font-size: 16px; text-align: left; line-height: 22px }
	.main_img_slider > div > div > div > h2:after { height: 30px; margin: 10px; }
	.swiper-pagination-bullet { width: 12px !important; height: 12px !important; }
}
@media(max-width: 500px){
	.main_img_slider { height: 500px; }
	.content02 > ul > li:nth-of-type(1) { height: 390px; }
	.content02 > ul > li:nth-of-type(1) > div > ol { margin: 40px 0; }
	.content02 > ul > li:nth-of-type(2) > ol > li { padding: 40px 30px; }
	.main_container > h5 { padding: 0 20px; word-break: keep-all; font-size: 16px; line-height: 23px; }
	.content03 > ul > li > ol > li:nth-of-type(1), .content03 > ul > li > ol > li:nth-of-type(2) { padding: 5px 16px; }
	.content03 > ul > li > ol > li:nth-of-type(1) img { width: 50px; }
}
@media(max-width: 375px){
	.content02 > ul > li:nth-of-type(2) > ol > li { height: 190px; padding: 25px; }
	.content02 > ul > li:nth-of-type(1) > div > h4, .content02 > ul > li:nth-of-type(2) > ol > li > h4 { font-size: 27px; }
	.content02 > ul > li:nth-of-type(2) > ol > li > p { line-height: 23px; font-size: 16px; }
	.content03 > ul > li > ol > li > p { font-size: 15px; word-break: keep-all; }
}