@charset "UTF-8";

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css');

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');

@font-face {
  font-family: "gmarket";
  font-weight: normal;
  src: url(../font/GmarketSansMedium.woff2) format("woff2");
  src: url(../font/GmarketSansMedium.woff) format("woff");
}
@font-face {
  font-family: "gmarket";
  font-weight: bold;
  src: url(../font/GmarketSansBold.woff2) format("woff2"); 
  src: url(../font/GmarketSansBold.woff) format("woff");
}

body *{font-family: 'pretendard', sans-serif;}
body{font-family: 'pretendard', sans-serif;font-size: 20px;font-weight: normal;color: #111;line-height: 1.2em;letter-spacing: -0.02em;word-break: keep-all;overflow-x: hidden;}
.container{position: relative;}
img{max-width: 100%;}
.inner{width: 100%;max-width: 1400px;margin: 0 auto;}

@media screen and (max-width: 1440px) {
  .inner{padding: 0 3%;}
}

/* Footer */
.footer{background-color: #767676;padding: 100px 0;}
.footer .inner{display: flex;justify-content: space-between;align-items: end;flex-wrap: wrap;gap: 30px;}

.footer .foot_left .img_box{width: 160px;height: 110px;}
.footer .foot_left .info{margin-top: 47px;}
.footer .foot_left .info li{font-size: 14px;font-weight: 500;line-height: 1.2em;color: rgb(255, 255, 255, 0.5);}
.footer .foot_left .info li:nth-child(n + 2){margin-top: 10px;}

.footer .foot_right{padding-right: 100px;}
.footer .foot_right .sns{display: flex;gap: 22px;justify-content: end;}
.footer .foot_right .sns li a{display: flex;align-items: center;justify-content: center;width: 30px;height: 30px;}
.footer .foot_right .sns li a img{max-height: 100%;}
.footer .foot_right .copyright{font-size: 14px;font-weight: normal;line-height: 1.2em;color: #ACACAC;margin-top: 36px;}

@media screen and (max-width: 768px) {
  .footer{padding: 90px 0;}
  .footer .inner{flex-direction: column;align-items: start;}

  .footer .foot_left .info li{font-size: 12px;}

  .footer .foot_right .copyright{font-size: 12px;}
  .footer .foot_right .sns{gap: 18px;justify-content: start;}
}
@media screen and (max-width: 512px) {
  .footer{padding: 60px 0;}
  .footer .inner{flex-direction: column;align-items: start;}

  .footer .foot_left .img_box{width: 100px;height: 70px;}
  .footer .foot_left .info{margin-top: 24px;}
  .footer .foot_left .info li{font-size: 10px;}

  .footer .foot_right .sns li a{width: 24px;height: 24px;}
  .footer .foot_right .sns li a img{max-height: 100%;}
  .footer .foot_right .copyright{font-size: 10px;margin-top: 20px;}
}

.fixed_btn{display: flex;justify-content: space-between;flex-direction: column;position: fixed;right: 20px;bottom: 53px;width: 65px;height: 290px;z-index: 999;}
.fixed_btn .btn{border-radius: 22px;box-shadow: rgb(0, 0, 0, 0.3) 0 3px 5px;}

.fixed_btn .btn .hover{
  display: none;
}



@media screen and (max-width: 1200px) {
  .fixed_btn{right: 15px;bottom: 40px;width: 50px;height: 240px;}
}
@media screen and (max-width: 1024px) {
  .fixed_btn{right: 10px;bottom: 30px;width: 40px;height: 200px;}
}
@media screen and (max-width: 768px) {
  .fixed_btn{right: 8px;bottom: 20px;width: 36px;height: 170px;}
}

.popup_wrap{display: none;position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;background-color: rgb(0, 0, 0, 0.5);z-index: 100000;}
.popup_wrap.open{display: block;}
.popup_wrap .personal_info{position: relative;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 94%;max-width: 800px;height: auto;text-align: center;padding: 60px 40px;background-color: #fff;}
.popup_wrap .personal_info h2{font-size: 24px;font-weight: bold;line-height: 1.5em;padding-bottom: 40px;text-align: center;}
.popup_wrap .personal_info .personal_info_desc{max-height: 360px;overflow-y: scroll;padding: 20px 15px;border: 1px solid #ddd;}
.popup_wrap .personal_info .personal_info_desc p{font-size: 20px;font-weight: 400;line-height: 1.5em;text-align: center;}
.popup_wrap .personal_info .colse_btn{margin-top: 12px;}

@media screen and (max-width: 1024px) {
  .popup_wrap .personal_info{padding: 50px 30px;}
  .popup_wrap .personal_info h2{font-size: 22px;padding-bottom: 30px;}
  .popup_wrap .personal_info .personal_info_desc p{font-size: 18px;}
}
@media screen and (max-width: 512px) {
  .popup_wrap .personal_info{padding: 40px 20px;}
  .popup_wrap .personal_info h2{font-size: 20px;padding-bottom: 20px;}
  .popup_wrap .personal_info .personal_info_desc p{font-size: 16px;}
}