@charset "utf-8";

@import url(/font/SUIT/font.css);

body{font-family:'SUIT', Arial, sans-serif;  font-weight: 500;  margin: 0;padding: 2rem;  line-height: 1.4;font-size: clamp(14px, 2vw, 18px); word-break: keep-all;}


.wrap{ max-width: 1340px; margin: 0 auto;  }

h1 {font-size: clamp(22px, 5vw, 50px);/* 최소, 뷰포트 너비의 5%, 50px */color: #333;}
h2 {font-size: clamp(20px, 4.5vw, 30px);color: #333;}
p {font-size: clamp(14px, 2vw, 16px);color: #555;}
.box {margin-top: 2rem;padding: clamp(14px, 3vw, 40px);background: #f0f0f0;border-radius: 8px;font-size: clamp(14px, 1.8vw, 16px);}

a{ text-decoration: none; color: #3f3f3f;}
.text-primary{ color: #ffcc00 !important;}
.lh-sm{line-height: 1.2 !important;}


.home-link a{ border-radius: 30px; border: 1px solid #087E6D; padding: 8px 20px; }
.home-link a i{ font-size: clamp(14px, 2vw, 20px);}
.home-link a i, .home-link a span{ color: #087E6D;}


.season{padding: clamp(14px, 4vw, 40px) clamp(20px, 4vw, 50px);background: #087E6D;border-radius: 20px;font-size: clamp(14px, 1.8vw, 16px); color:#fff ; margin:1rem 0 1.5rem 0;}
.season p{ color: #fff;}
.season .title{font-size: clamp(21px, 4vw, 51px); font-weight: 800;}
.season .title.title-s{font-size: clamp(21px, 3.7vw, 39px);}
.title-wrap{/*margin: clamp(0px, 0vw, 0px) clamp(40px, 5vw, 70px) clamp(0px, 0vw, 0px) clamp(0px, 0vw, 0px);*/ flex: 0 1 449px;} 
.title-wrap .fs-4{font-size: clamp(16px, 3vw, 27px) !important}
.call{font-size: clamp(14px, 2vw, 18px)}

.link-circle a{ border-radius: 50%;  background-color: #fff; width: clamp(90px, 8vw, 136px); aspect-ratio: 1 / 1; font-size: clamp(14px, 1.5vw, 1７px); }

.ul-default{ font-size:clamp(15px, 1.8vw, 22px);  font-weight: 600;}
.ul-default li{padding: clamp(1px, 0.5vw, 2px) clamp(0px, 0vw, 0px)}
.ul-default li::marker{ color: #FAEE2E;}



.link-wrap .link-circle a{ background-color: none; border-radius: 0; width: auto; height: auto;}
.link-wrap .link-circle .ico-img{width: clamp(80px, 8vw, 114px); aspect-ratio: 1 / 1;border-radius: 50%; background-color: #f5f5f5;}


.footer{ border-top: 1px solid #e7e7e7;padding: clamp(20px, 3vw, 40px) clamp(20px, 2vw, 30px) clamp(0px, 0vw, 0px) clamp(20px, 2vw, 30px) ;  margin-top:clamp(20px, 4vw, 50px);}
.sns{ padding-right: 170px;}
.sns a{ width: 40px; height: 40px; background-color: #cccccc; border-radius: 50%; font-size: clamp(18px, 1.8vw, 22px); color: #fff;}
.footer-dudu{ position: absolute; right: 0; bottom: 0; width: calc(285px / 1.6);}
address{ margin: 0 0 7px 0;}
.bar{ opacity: 0.4;}

@media (max-width: 1300px) {
.season>div{ flex-direction: column; align-items: center;}
.title-wrap{ text-align: center; margin-right: 0; flex: 1;}
.season .title br{ display: none;}
.call{ display: none;}
.ul-default{ padding-left: 20px; display: flex; flex-direction: column; align-items: center;}

.link-circle{ justify-content: center; flex-wrap: wrap;}

.link-circle a img{ width: calc(68px / 1.8);}

.gap-4{ gap: 1rem !important;}
.gap-5{ gap: 1rem !important;}
.pt-4{ padding-top: 1rem !important;}
.py-5{ padding-top: 2rem !important; padding-bottom: 2rem !important;}
}

@media (max-width: 1100px) {
    .sns{ padding-right: 0;}
    .footer{padding: clamp(20px, 3vw, 40px)  clamp(0px, 0vw, 0px)}
    .footer-dudu{ display: none;}  
}

@media (max-width: 767px) {
    .header{ flex-direction: column;}
    .header h1 { margin-bottom: 14px;}
    .header h1 img{ width: calc(240px / 1.5);}
    .footer>div{ flex-direction: column;  align-items: center; text-align: center;}
    .footer .bar{ display: none;}
    address{ display: block;}
}