@charset "utf-8";

html, body {font-family: 'Pretendard', sans-serif;overflow-x: hidden;}
body {line-height: inherit;margin: 0;}
*, :after, :before {border: 0 solid #e5e7eb;box-sizing: border-box;}

.layout {overflow:hidden;width:100%;min-width:1284px}
.header_area,.section_area,.footer_area {width:100%;clear:both}
.header_area {position:fixed;top:0;height:90px;z-index:99999;background-color:#fff;/*border-bottom: 1px solid #e9e9e9;*/}
.section_area {margin-top:100px}

.header_area{width: 100%;background: rgba(255, 255, 255, 0.4);  backdrop-filter: blur(20px);position: fixed;top: 0;left: 0;z-index: 9999;transition: all .2s ;}
.header_area:hover{background-color: #fff;}
.header_wrap{width: 100%;position: relative;height: 90px;} 

.header {max-width: 1624px;;height:90px;margin:auto;padding: 0 20px;}
.header .logo {overflow:hidden;float:left;padding:0;margin: 0;}
.header .logo a {width:459px;height:90px}
.header .logo a img {display:block;padding:20px 0;height: 90px;}

.wrap {width: 100%;margin: auto;position: relative;box-sizing: border-box;}
.wrap img{width: 100%;height: 100%;}
.hidden{display: none;}

/* 메인배너 */
.main_wrap, main {margin: 7rem auto auto;max-width: 1600px;padding: 0 20px 3rem;position: relative;width: 100%;}
.main_wrap {padding: 0;}
.main_inner {width: 100%;}
.main_banner {display: grid;position: relative;width: 100%;max-width: 1600px;aspect-ratio: 1600 / 555; /* 최대 크기 비율 유지 */border-radius: 0 50px 50px 50px;overflow: hidden;margin: 0 auto;}
.banner_box {grid-area: 1 / 1;}
.banner_box img {width: 100%;height: 100%;object-fit: cover;display: block;}
.banner_text {grid-area: 1 / 1;align-self: start;justify-self: start;color: white;z-index: 2;padding-top: clamp(30px, 5vw, 70px);padding-left: clamp(20px, 5vw, 80px); }
.banner_text .title {font-size: clamp(24px, 3vw, 50px);font-weight: 700;margin: 0 0 10px;line-height: 1.4;text-shadow: 0 2px 5px rgba(32, 21, 16, 0.6);}
.banner_text .subtitle {position: relative;font-size: clamp(12px, 1.5vw, 24px);margin: 0;opacity: 0.9;padding-left: 105px;color: white;font-weight: 300;text-shadow: 0 2px 5px rgba(32, 21, 16, 0.5);}
.banner_text .subtitle::before {content: "";position: absolute;left: 0;top: 50%;transform: translateY(-50%);width: 90px;height: 2px;background-color: white;}

.arrow_box {grid-area: 1 / 1;justify-self: end;align-self: end;margin: 40px;z-index: 4;}
.circle_btn {display: flex;justify-content: center;align-items: center;width: 100px;height: 100px;border-radius: 50%;background-color: rgba(255, 255, 255, 0.5);text-decoration: none;transition: background-color 0.2s, transform 0.2s;}
.circle_btn .inner_circle {display: flex;justify-content: center;align-items: center;width: 60px;height: 60px;border-radius: 50%;background-color: #fff;transition: background-color 0.2s;}
.circle_btn .inner_circle .arrow {color: #676565;font-size: 26px;transform: rotate(-45deg);display: inline-block; transition: color 0.2s;}
.circle_btn:hover {background-color: rgba(246, 165, 30, 0.5)}
.circle_btn:hover .inner_circle {background-color: #f68b1e;}
.circle_btn:hover .arrow {color: white;}

.section_inner {margin: auto;max-width: 1600px;padding: 0 20px;position: relative;width: 100%;}
.section_title {margin-bottom:80px;text-align: center;}
.section_title h2 {margin: 0 0 30px;font-size: 52px;color: #4db848;font-weight: bold;}
.section_title h2 .dot {color: #f68b1e}
.section_title p {color: #333333;font-weight: 400;font-size: 20px;line-height: 1.4;margin: 0;}
.wrap .section_1 {background-color: #f7fdf8;margin-top: 0;padding: 90px 0 100px;}
.section_1 .about_box {max-width: 1600px;margin: 0 auto;display: flex;flex-direction: column;}
.section_1 .ab_list_top {display: grid;grid-template-columns: 66% 31%;column-gap: 40px;margin: 0;margin-bottom: 40px;padding: 0;}
.section_1 .ab_list_bottom {display: grid;grid-template-columns: 31% 66%;column-gap: 40px;margin: 0;padding: 0;}
.section_1 .about_box ul li {height: 370px;border-radius: 30px;border: 1px solid #e1e1e1;overflow: hidden;position: relative;}
.section_1 .about_box ul li img {width: 100%;height: 100%;object-fit: cover;display: block;transition: transform 0.3s ease;}
.section_1 .about_box ul li:hover img {transform: scale(1.03);}

.wrap .section_2 {margin-top: 0;padding: 90px 0 100px;}
.section_2 .point_box ul {display: flex;margin: 0;padding: 0;justify-content: space-between}
.section_2 .point_box ul li {position: relative;list-style: none;width: 24%;background-color: #f4f5f6;height: 320px;border-radius: 30px;padding: clamp(20px, 3vw, 50px) clamp(15px, 2vw, 40px);box-sizing: border-box;display: flex;flex-direction: column;justify-content: flex-start;}
.section_2 .point_box ul li p {margin: 0;color: #676565;font-size: clamp(16px, 2vw, 30px);font-weight: bold;line-height: 1.4;}
.section_2 .point_box ul li img {width: 120px;height: 110px;}
.section_2 .point_box ul li .point_bottom {margin-top: auto;align-self: flex-end; }

.section_3 {display: flex;justify-content: space-between;max-height: 1600px;position: relative;}
.section_3 .map_left {width: 60%;}
.embed-container {position: relative;padding-bottom: 56.25%;height: 100%;overflow: hidden;max-width: 100%;}
.embed-container iframe, .embed-container object, .embed-container embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.section_3 .map_right {width: 40%;background-color: #4db848;padding: clamp(40px, 5vw, 100px) clamp(20px, 5vw, 80px);}
.section_3 .map_right .map_title_box {color: #fff;text-align: left;}
.section_3 .map_right .map_title_box h1 {font-size: clamp(28px, 4vw, 52px);margin: 0 0 3.75rem 0;}
.section_3 .map_right .map_title_box h1 span {color:#f68b1e}
.section_3 .map_right .map_title_box .map_title {margin-bottom: clamp(20px, 3vw, 50px);}
.section_3 .map_right .map_title_box .map_title h3 {font-size: clamp(18px, 2vw, 30px);margin: 0 0 1.25rem 0;border-left: 3px solid #fff;padding-left: 10px;}
.section_3 .map_right .map_title_box .map_title p {font-size: clamp(14px, 1.5vw, 24px);margin: 0;line-height: 1.4;font-weight: 300;}

.footer_area {background-color: #f4f5f7;margin-top: 0;padding:0;}
.footer {margin: auto;max-width: 1600px;padding: 0 20px;position: relative;width: 100%;}
.footer .top_area {padding: 90px 0 70px;}
.footer .top_area ul {display: flex;margin: 0;padding: 0;justify-content: space-between;flex-wrap: wrap}
.footer .top_area ul li {margin-bottom: 30px;position: relative;list-style: none;width: 49%;height: 125px;box-sizing: border-box;}
.footer .top_area ul li a {background-color: #fff;border-radius: 20px;transition: 0.25s;box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);}
.footer .top_area ul .bar_blog a:hover {background-color: #03c75a;}
.footer .top_area ul .bar_blog a:hover .sns_img img {content: url("/images/main/sns_img01_1.png");}
.footer .top_area ul .bar_band a:hover {background-color: #28c737}
.footer .top_area ul .bar_band a:hover .sns_img img {content: url("/images/main/sns_img02_2.png");}
.footer .top_area ul .bar_dg a:hover {background-color: #ff6f0f}
.footer .top_area ul .bar_dg a:hover .sns_img img {content: url("/images/main/sns_img03_3.png");}
.footer .top_area ul .bar_insta a:hover {background-color: #fe0971}
.footer .top_area ul .bar_insta a:hover .sns_img img {content: url("/images/main/sns_img04_4.png");}
.footer .top_area ul li a {display: block;width: 100%;height: 100%;padding: 0 30px;text-decoration: none;color: inherit;display: flex;justify-content: space-between;align-items: center;}
.footer .top_area ul li p {margin: 0;color: #676565;font-size: clamp(16px, 2vw, 30px);font-weight: bold;transition: 0.25s;}
.footer .top_area ul li:hover p {color: #fff;}
.footer .top_area ul li .sns_img {border-radius: 50%;background-color: #f4f5f6;width: 80px;height: 80px;display: flex;justify-content: center;align-items: center;transition: 0.25s;}
.footer .top_area ul li:hover .sns_img {background-color: #fff;}
.footer .top_area ul li:hover .sns_img img {transition: 0.25s ease-in-out;}
.footer .bottom_area {padding: 50px 0;border-top: 2px solid #e9e9e9;}
.footer .bottom_area .f_logo {margin-bottom:30px;}
.footer .txt_company{font-size:18px;line-height:1.5;letter-spacing:0;margin: 0;font-weight: 300;color: #444446;}

@media screen and (max-width:1024px) {
    .header_area {height:80px;}
    .header {height: 80px;}
    .header .logo a img {display: block;padding: 20px 0;height: 80px;}
  .main_banner{height: 40vh;}
  .banner_text .title {font-size: 2rem;}
   .banner_text .subtitle {font-size: 1.2rem;}
}

@media screen and (max-width:768px) {
   .banner_text {padding: 30px 30px 0px 20px;}
   .banner_text .title {font-size: 24px;}
   .banner_text .subtitle {padding-left: 0;font-size: 1rem;}
   .banner_text .subtitle::before {width: 2rem;display: none;}
   .arrow_box {margin: 30px 20px;}
   .circle_btn {width: 90px;height: 90px;}
    .main_wrap, main {margin-top: 5.5rem;;}
    .header_area {height:65px;}
    .header {height: 65px;}
    .header .logo a img {display: block;padding: 15px 0;height: 65px;}
  .section_title {margin-bottom: 40px;font-size: 24px;}
  .section_title  p {font-size: 15px;}
  .section_title h2 {font-size: 32px;margin-bottom: 20px;}
  .wrap .section_1 {padding: 40px 0 80px;}
  .wrap .section_2 {padding: 40px 0 60px;}
  .section_1 .ab_list_top {grid-template-columns:100%;margin-bottom: 0;}
  .section_1 .about_box ul li {height: 20rem;margin-bottom: 2rem;}
  .section_1 .ab_list_bottom {grid-template-columns:100%;margin-bottom: 0;}
  .section_1 .ab_list_bottom li:last-child {margin-bottom: 0;}
  .section_2 .point_box ul {flex-wrap: wrap}
  .section_2 .point_box ul li {width: 49%;height: 15rem;margin-bottom:1rem;}
  .section_2 .point_box ul li p {font-size: 1.4rem;}
  .section_3  {flex-wrap: wrap;}
  .section_3 .map_left {width: 100%;}
  .section_3 .map_right {width: 100%;}
  .section_3 .map_right .map_title_box h1 {font-size: 52px;margin-bottom: 2rem;}
  .section_3 .map_right .map_title_box .map_title {margin-bottom: 2.5rem;}
  .section_3 .map_right .map_title_box .map_title:last-child {margin-bottom: 0;}
  .section_3 .map_right .map_title_box .map_title h3 {font-size: 1.8rem;}
  .section_3 .map_right .map_title_box .map_title p {font-size: 1.4rem;}
  .footer .top_area {padding:5rem 0 4rem}
  .footer .top_area ul li {width: 100%;}
  .footer .top_area ul li p {font-size: 1.6rem;}
}

@media screen and (max-width:500px) {
 .section_2 .point_box ul li {width: 100%;padding: 25px;}
 .section_3 .map_right {padding: 30px 20px;}
 .section_3 .map_right .map_title_box h1 {font-size: 28px;margin-bottom:20px;}
 .section_3 .map_right .map_title_box .map_title {margin-bottom: 25px;}
 .section_3 .map_right .map_title_box .map_title:last-child {margin-bottom: 0;}
 .section_3 .map_right .map_title_box .map_title h3 {font-size: 22px;margin-bottom:15px;}
 .section_3 .map_right .map_title_box .map_title p {font-size: 18px;}
 .footer .top_area {padding: 50px 0 30px;}
 .footer .top_area ul li a {padding: 0 20px;}
 .footer .top_area ul li p {font-size: 18px;}
 .footer .bottom_area {padding: 40px 0;}
 .footer .top_area ul li .sns_img {width: 60px;height: 60px;}
 .footer .top_area ul li .sns_img img {width: 40%}
 .footer .bottom_area .f_logo {margin-bottom: 20px;}
 .footer .bottom_area .f_logo img {width: 100%;}
 .footer .txt_company {font-size: 14px;}
}