/* ******************* */
/* section1 */

.mainindex #section1 { background: url(images/main_banner.png) center/cover no-repeat; width: 100%; height: 100vh; position : relative; } 
.mainindex #section1 .txt { position : absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: #fff; font-size: 5rem; text-shadow: 2px 2px 14px rgba(0, 0, 0, 0.7); width: 95%; } 



 /* section2 */
 .mainindex #section2 { padding-top: 9rem; } 
 .mainindex #section2 .con { background: url(images/sec2_bg.png) center/cover no-repeat; align-items: center; width: 100%; display: grid; padding-bottom: 7rem; height: 120rem } 

 .mainindex #section2 .con>p { width: 100%; padding-right: 3rem; } 
 .mainindex #section2 .con>p img { width: 100%; } 
 
 .mainindex #section2 .top { text-align: center; } 
 .mainindex #section2 .top .smtxt b { text-align: center; letter-spacing: .5rem; font-size: 1.4rem; } 
 .mainindex #section2 .text { padding-left: 3rem; align-self: end; } 
 .mainindex #section2 .text b { font-size: 5rem; } 
 .mainindex #section2 .text ul p { font-size: 1.8rem; line-height: 1.8; } 

 .more { display: inline-flex; gap: 2rem; padding: 1rem 2rem; border: 1px solid; border-radius: 3rem; font-size: 1.8rem; align-items: center; transition: 200ms ease; line-height: 1; } 
 .more img { transition: transform 200ms ease; vertical-align: middle; transform: scale(.9); } 
 .more p { font-size: 0; } 


 .mainindex #section2 .more { border-color: var(--main); color: var(--main); } 
 .mainindex #section2 .more:hover { background: var(--main); color: #fff; } 
 .mainindex #section2 .more:hover img { filter: brightness(0) invert(1); } 



 /* section3 */
 .mainindex #section3 { margin-top: 5rem; } 
 .mainindex #section3 .con { display: flex; flex-direction: column; padding-bottom: 9rem; padding-left: 3rem; } 
 .mainindex #section3 .con .left { flex: 1; } 
 .mainindex #section3 .con .right { width: 100%; margin-top: 7rem } 

 .mainindex #section3 .swiper-slide { color: var(--color20); } 
 .mainindex #section3 .swiper-slide p:nth-child(2) { font-size: 3rem; font-weight: bold; margin: 3rem 0 1rem; } 
 .mainindex #section3 .swiper-slide span { font-size: 1.8rem; } 
.mainindex #section3 .smtxt { color: var(--text2); } 
.mainindex #section3 .s3Swiper img { width: 100%; } 
.mainindex #section3 .swiper-slide a {color: var(--color20)}


/* section4 */
.mainindex #section4 { text-align: center; padding: 9rem 3rem; background: url(images/sec4_bg.png)center/cover no-repeat; } 
.mainindex #section4 .con { display: flex; gap: 6rem; flex-direction: column; } 
.mainindex #section4 .left { text-align: left; } 
.mainindex #section4 .left .kor { color: #fff; } 
.mainindex #section4 .left .smtxt { color: #ffffffc5; } 
.mainindex #section4 .right { display: flex; flex-direction: column; gap: 2rem; } 

.mainindex #section4 .right li { display: flex; padding: 4rem 3rem; border-radius: 20px; border: 1px solid #ffffff31; align-items: center; font-size: 2.4rem; font-weight: bold; color: #fff; transition: border 200ms ease; } 
.mainindex #section4 .right li p { text-align: center; flex:1 } 
.mainindex #section4 .right li:hover { border: 1px solid #fff; } 
.mainindex #section4 .right li img { transform: scale(.8); } 


/* section5 */
.mainindex #section5 { background: url(./images/sec5_bg.png) center/cover no-repeat; padding: 9rem 0; text-align: center; } 
.mainindex #section5 .smtxt,#section5 .kor { color: #fff; } 
.mainindex #section5 .kor span { font-size: 5rem; } 
.mainindex #section5 ul { display: flex; padding:0 3rem; flex-direction: column; margin: 0 auto; gap: 4rem; } 
.mainindex #section5 ul li { flex: 1; border: 1px solid #fff; text-align: left; color: #fff; border-radius: 20px; padding: 5rem 4rem 4rem; transition: background 200ms ease; } 

.mainindex #section5 ul li .top { display: flex; justify-content: space-between; } 
.mainindex #section5 ul li .top p { font-size: 2rem; font-weight: bold; } 
.mainindex #section5 ul li .top h2 { font-size: 3rem; color: var(--text); margin: 1rem 0 4rem; } 
.mainindex #section5 ul li span { font-size: 1.8rem; line-height: 1.5; } 

.mainindex #section5 ul li:hover .top h2 { color: #fff; } 
.mainindex #section5 ul li:hover .top img { filter: brightness(0) invert(1); } 


.mainindex #section5 ul li:nth-child(1):hover { background: url(./images/sec5_1_bg.png) center/cover no-repeat; } 
.mainindex #section5 ul li:nth-child(2):hover { background: url(./images/sec5_2_bg.png) center/cover no-repeat; } 
.mainindex #section5 ul li:nth-child(3):hover { background: url(./images/sec5_3_bg.png) center/cover no-repeat; } 
.mainindex #section5 ul li:nth-child(4):hover { background: url(./images/sec5_4_bg.png) center/cover no-repeat; } 




/* section6 */
.mainindex #section6 { padding: 9rem 0; } 

.mainindex #section6 .con { margin: 0 auto; padding :0 3rem; } 

.mainindex #section6 .con .top { display: flex; flex-direction: column; align-items: left; justify-content: space-between; } 
/* .mainindex #section6 .con .top .eng { margin: 0; } */
.mainindex #section6 .con .top .kor { margin: 2rem 0 5rem; } 
.mainindex #section6 .con .top .smtxt { color: var(--text2); } 
.mainindex #section6 .s6Swiper { width: 100%; height: 38rem; border-radius: 30px; position : relative; } 
.mainindex #section6 .swiper-slide { padding: 0 3rem; color: #fff; display: flex; align-items: flex-end; } 

.mainindex #section6 .swiper-slide.slide1 { background: url(./images/sec6_1.png) center/cover no-repeat; } 
.mainindex #section6 .swiper-slide.slide2 { background: url(./images/sec6_2.png) center/cover no-repeat; } 
.mainindex #section6 .swiper-slide.slide3 { background: url(./images/sec6_3.png) center/cover no-repeat; } 

.mainindex #section6 .swiper-slide .txt { margin-bottom: 10rem; } 

.mainindex #section6 .swiper-slide .txt p { font-size: 2.2rem; margin-bottom: 2rem; font-weight: bold; } 

.mainindex #section6 .swiper-slide .txt span { font-size: 1.8rem; } 




/* section7 */
.mainindex #section7 { background: url(./images/sec7_bg.png) center/cover no-repeat; } 
.mainindex #section7 .con { display: flex; flex-direction: column; margin: 0 auto; padding: 9rem 3rem; } 
.mainindex #section7 img { width: 100%; object-fit: cover; } 

.mainindex #section7 .s7Swiper { width: 100%; height: 38rem; border-radius: 3rem; margin-top: 5rem; } 

.mainindex #section7 .smtxt { color: var(--text2); margin-bottom: 3rem; } 

.mainindex #section7 .s7Swiper img { width: 100%; height: 100%; object-fit: cover; } 


/* section8 */
.mainindex #section8 .con { padding-top: 9rem; margin: 0 auto; } 
.mainindex #section8 .eng { margin-bottom: 0; } 
.mainindex #section8 .top { text-align: center; } 
.mainindex #section8 .top .kor { margin: 2rem 0; } 
.mainindex #section8 .smtxt { color: var(--text2); margin-bottom: 0; } 

.mainindex #section8 .map_wrap { padding: 0 3rem; margin: 5rem 0; } 
.mainindex #section8 .kakaomap { border-radius: 3rem; } 

.mainindex #section8 .info p { font-size: 2rem; color: var(--color20); } 
.mainindex #section8 .info h6 { font-size: 1.8rem; color: var(--text2); font-weight: bold; } 

.mainindex #section8 h1 { font-size: 5rem; font-weight: normal; color: var(--text) } 

.mainindex #section8 .more { border: 1px solid var(--text2); color: var(--color20); font-weight: bold; padding: 1rem 1.5rem; } 


.mainindex #section8 .info .btns { margin: 2rem 0 5rem; display: flex; gap: 1rem; } 

.mainindex #section8 .info .btns a:first-child { border: 1px solid var(--text); color: var(--text); } 

.mainindex #section8 .left, .mainindex #section8 .mid { padding: 0 3rem; } 
.mainindex #section8 .mid ul { margin-top: 2rem; width: 85%; } 
.mainindex #section8 .mid ul li { display: flex; justify-content: space-between; gap: 3rem; } 
.mainindex #section8 .mid ul li p { line-height: 1.7; } 
.mainindex #section8 .mid ul li p:nth-of-type(2) { width: 27rem; } 
.mainindex #section8 .mid ul li span { background: var(--text); color: #fff; padding:.3rem .7rem; line-height: 1.2; border-radius: 5px; display: inline-block; font-weight: normal; margin-left: .5rem; } 

.mainindex #section8 .right { border-top: 1px solid #e0e0e0; padding: 3rem 0; margin-top: 5rem; } 
.mainindex #section8 .right ul { display: flex; width: 100%; } 
.mainindex #section8 .right ul li { flex: 1 0 22%; } 
.mainindex #section8 .right ul li:last-child { flex:1 0 34%; } 
.mainindex #section8 .right ul li a { height: 9rem; display: flex; flex-direction: column; justify-content: space-between; text-align: center; color: var(--color20); font-weight: bold; } 
.mainindex #section8 .right ul li:last-child a { flex-direction: row; justify-content: center; align-items: center; } 

.mainindex #section8 .right ul li:last-child a span { font-size: 2.5rem; } 

.mainindex #section8 .right ul li:not(:last-of-type) a { border-right: 1px solid #e0e0e0; } 

.mainindex #section8 .right img { transform: scale(.8); } 

.mainindex #section8 .right>a p { display: flex; align-items: center; gap: 3rem; padding: 3rem 0 3rem 5rem; border: 1px solid #e0e0e0; border-radius: 10rem; font-size: 3rem; }