@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Urbanist:ital,wght@0,100..900;1,100..900&display=swap');
@import url(html5_reset.css);
@import url(font.css);

:root {
  --fff: #fff;
  --aaa: #aaa;
  --222: #000;
  --333: #000;
  --444: #444;
  --666: #666;
  --888: #888;
  --5C5C5C: #5C5C5C;
  --C6C3C2: #C6C3C2;
  --bg: #F7F4EF;
  --color_main: #645142;
  --color_sub2:#984300;
  --color_sub: #FFE3B5;
  --color_dark: #1b1b1c;
  --naverGreen: #35a340;
  --kakaoYellow: #fbe100;
  /*
  
  --color_sub: #5680C1;
  
  --color_pen: #d6f4ff;
  --color_subtit: #b2eaff;
  --line: #8d8d8d;
  --bg: #f8f6f3;
  --lightGray: #DADADA;
*/
  --000: #000;
}
.color_main{
  color:var(--color_main) !important;
}
.color_sub2{
  color:var(--color_sub2) !important;
}
.underLine{
  /* text-decoration: underline; */
  display: inline-block;
  position: relative;
  margin-bottom: .5em;
  
  
  
  
  
  &::before{
    content:'';
    width: 100%;
    /* height: .2rem; */
    border-bottom: .2rem solid currentColor;
    display: block;
    bottom: .6rem;
    position: absolute;
  }
}
.roundBorder{
  border:1px solid var(--000);
  padding:1rem 2rem;
  display: inline-block;
  font-size: 2.4rem;
  border-radius: 10rem;
  line-height: 1;
  margin-top: 2rem;
  margin-bottom: 1rem;
}
.video-container {
    width: 100%;            /* 너비를 부모에 맞춤 */
    max-width: 1000px;      /* (선택) 최대 너비 제한 */
    aspect-ratio: 16 / 9;   /* 영상 비율 설정 */

    iframe {
      width: 100%;
      height: 100%;
    }
  }


.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

html {
  font-family: 'Pretendard', sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  overflow-y: scroll;
  margin: 0 auto;
  font-size: 62.5%;
  
  /* 웹킷 속성 (Chrome, Edge, Safari) */
  &::-webkit-scrollbar {
    width: 8px;
  }

  &::-webkit-scrollbar-track {
    background: #343434;
  }

  &::-webkit-scrollbar-thumb {
    background: #6c6c6c;
    border-radius: 10px;
  }
}

body {
  /* min-width: 1400px; */
  overflow: hidden;
  letter-spacing: -0.04em;
  position: relative;
  font-size: 1.6rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #181818;
  font-weight: 600;
  line-height: 1.4;
}

img {
  max-width: 100%;
}

b {
  font-weight: 700;
}

li {
  list-style: none;
}

.mobile {
  display: none !important;
}

.pc {
  display: ;
}

.box {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}


input[type="text"],
input[type="tel"],
input[type="password"],
textarea {
  padding: 5px 10px;
  border: 1px solid #d3d3d3;
  color: #666;
  height: 30px;
  font-family: 'Noto Sans Korean', sans-serif;
  font-size: 16px;
  vertical-align: top;
}

select {
  padding: 5px 1px 5px 10px;
  border: 1px solid #d3d3d3;
  color: #666;
  height: 42px;
  vertical-align: top;
  min-width: 150px;
  background: #fff;
  position: relative;
  z-index: 1;
  background: none;
  -moz-appearance: none;
  /* Firefox */
  -webkit-appearance: none;
  /* Safari and Chrome */
  appearance: none;
}

.select {
  text-align: center;
  font-size: 16px;
}

.select::after {
  content: "\E828";
  font-family: "misoicon";
  position: absolute;
  margin-left: -41px;
  background: #fff;
  line-height: 44px;
  width: 32px;
  margin-top: 1px;
  color: #bdbdbd;
  font-size: 12px;
}

select::-ms-expand {
  /* for IE 11 */
  display: none;
}

input[type="tel"] {
  width: 20%;
  max-width: 150px;
}

textarea {
  min-height: 76px;
}

input[type=checkbox] {
  display: none;
}

input[type=checkbox]+label {
  padding-left: 25px;
  position: relative;
}

input[type=checkbox]+label:before {
  display: inline-block;
  vertical-align: text-bottom;
  content: "";
  margin-right: 8px;
  line-height: 20px;
  position: absolute;
  left: 0;
  border: 1px solid #777;
  width: 12px;
  height: 12px;
  vertical-align: middle;
  top: 7px;
  margin-left: 3px;
}

/* unchecked icon */
input[type=checkbox]:checked+label:before {
  font-family: 'LineAwesome';
  top: 4px;
  content: "\f17f";
  color: #0abbab;
  margin-right: 5px;
  left: 0;
  font-size: 19px;
  border: 0;
  margin-left: 0;
}

.filebox input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.filebox label {
  display: inline-block;
  padding: .5em .75em;
  color: #999;
  font-size: inherit;
  line-height: normal;
  vertical-align: middle;
  background-color: #fdfdfd;
  cursor: pointer;
  border: 1px solid #ebebeb;
  border-bottom-color: #e2e2e2;
  /* border-radius: .25em; */
}

/* named upload */
.filebox .upload-name {
  display: inline-block;
  padding: .5em .75em;
  font-size: inherit;
  font-family: inherit;
  line-height: normal;
  vertical-align: middle;
  background-color: #ffffff;
  border: 1px solid #d3d3d3;
  border-bottom-color: #e2e2e2;
  /* border-radius: .25em; */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-size: 16px;
}

.filebox.bs3-primary label {
  color: #fff;
  background-color: #8387DD;
  border-color: #13a499;
  font-size: 16px;
}

/* checked icon */

button:active {
  outline: none;
  border: none;
}

hr {
  clear: both;
  float: none;
  border: 0
}

hr.border {
  border-top: 1px solid #ddd;
  margin: 60px 0;
}

/* float & align */
.left {
  float: left !important;
}

.right {
  float: right !important;
}

.left_align {
  text-align: justify !important;
}

.center {
  text-align: center !important;
}

.right_align {
  text-align: right !important;
}

.vertical_middle {
  vertical-align: middle;
}

.border_none {
  border: none !important;
}

/* CURSOR */
.cursor {
  cursor: pointer;
}

/* MARGIN */
.m_0 {
  margin: 0 !important;
}

.m_10 {
  margin: 10px !important;
}

.m_20 {
  margin: 20px !important;
}

.m_30 {
  margin: 30px !important;
}

.m_t_m60 {
  margin-top: -60px !important;
}

.m_t_0 {
  margin-top: 0 !important;
}

.m_t_10 {
  margin-top: 10px !important;
}

.m_t_20 {
  margin-top: 20px !important;
}

.m_t_30 {
  margin-top: 30px !important;
}

.m_t_40 {
  margin-top: 40px !important;
}

.m_t_50 {
  margin-top: 50px !important;
}

.m_t_60 {
  margin-top: 60px !important;
}

.m_t_80 {
  margin-top: 80px !important;
}

.m_r_0 {
  margin-right: 0 !important;
}

.m_r_10 {
  margin-right: 10px !important;
}

.m_r_20 {
  margin-right: 20px !important;
}

.m_r_30 {
  margin-right: 30px !important;
}

.m_b_0 {
  margin-bottom: 0 !important;
}

.m_b_10 {
  margin-bottom: 10px !important;
}

.m_b_20 {
  margin-bottom: 20px !important;
}

.m_b_30 {
  margin-bottom: 30px !important;
}

.m_b_40 {
  margin-bottom: 40px !important;
}

.m_b_50 {
  margin-bottom: 50px !important;
}

.m_b_60 {
  margin-bottom: 60px !important;
}

.m_b_150 {
  margin-bottom: 150px !important;
}


.m_l_0 {
  margin-left: 0 !important;
}

.m_l_10 {
  margin-left: 10px !important;
}

.m_l_20 {
  margin-left: 20px !important;
}

.m_l_30 {
  margin-left: 30px !important;
}


/* PADDING */
.p_0 {
  padding: 0px !important;
}

.p_10 {
  padding: 10px !important;
}

.p_20 {
  padding: 20px !important;
}

.p_30 {
  padding: 30px !important;
}

.p_t_0 {
  padding-top: 0px !important;
}

.p_t_10 {
  padding-top: 10px !important;
}

.p_t_20 {
  padding-top: 20px !important;
}

.p_t_30 {
  padding-top: 30px !important;
}

.p_t_60 {
  padding-top: 60px !important;
}

.p_r_0 {
  padding-right: 0px !important;
}

.p_r_10 {
  padding-right: 10px !important;
}

.p_r_20 {
  padding-right: 20px !important;
}

.p_r_30 {
  padding-right: 30px !important;
}

.p_b_0 {
  padding-bottom: 0px !important;
}

.p_b_10 {
  padding-bottom: 10px !important;
}

.p_b_20 {
  padding-bottom: 20px !important;
}

.p_b_30 {
  padding-bottom: 30px !important;
}

.p_l_0 {
  padding-left: 0px !important;
}

.p_l_10 {
  padding-left: 10px !important;
}

.p_l_20 {
  padding-left: 20px !important;
}

.p_l_30 {
  padding-left: 30px !important;
}



/* font size +  weight + color */
.font_18 {
  font-size: 18px;
}

.font_20 {
  font-size: 20px;
}

.font_22 {
  font-size: 22px;
}

.font_24 {
  font-size: 24px;
}

.myeongjo {
  font-family: 'Nanum Myeongjo'
}

.notosan {
  font-family: 'Noto Sans KR', sans-serif;
}

.fontw_100 {
  font-weight: 100 !important;
}

.fontw_300 {
  font-weight: 300 !important;
}

.fontw_400 {
  font-weight: 400 !important;
}

.fontw_500 {
  font-weight: 500 !important;
}

.fontw_600 {
  font-weight: 600 !important;
}

.fontw_700 {
  font-weight: 700 !important;
}

.fontw_800 {
  font-weight: 800 !important;
}


.overflow {
  overflow: hidden;
}

.block {
  display: block;
}



/* 4. 모바일 (해상도 768px 이하) */
@media all and (max-width:768px) {
  html{
    font-size:40%;
  }
  body {
    min-width: 320px;

  }

  .pc {
    display: none !important;
  }

  .mobile {
    display: block !important;
    overflow: hidden;
  }

  select {
    min-width: 120px;
  }

  textarea {
    min-height: 40px;
  }

  .select::after {
    line-height: 30px;
    font-size: .8em;
    margin-left: -36px;
    width: 36px;
  }

  .filebox.bs3-primary label {
    height: 14px;
    line-height: 1;
  }

  /* MARGIN */
  .m_10 {
    margin: 5px !important;
  }

  .m_20 {
    margin: 10px !important;
  }

  .m_30 {
    margin: 15px !important;
  }

  .m_t_m60 {
    margin-top: -30px !important;
  }

  .m_t_10 {
    margin-top: 5px !important;
  }

  .m_t_20 {
    margin-top: 10px !important;
  }

  .m_t_30 {
    margin-top: 15px !important;
  }

  .m_t_40 {
    margin-top: 20px !important;
  }

  .m_t_50 {
    margin-top: 25px !important;
  }

  .m_t_60 {
    margin-top: 30px !important;
  }

  .m_t_80 {
    margin-top: 40px !important;
  }

  .m_r_10 {
    margin-right: 5px !important;
  }

  .m_r_20 {
    margin-right: 10px !important;
  }

  .m_r_30 {
    margin-right: 15px !important;
  }

  .m_b_10 {
    margin-bottom: 5px !important;
  }

  .m_b_20 {
    margin-bottom: 10px !important;
  }

  .m_b_30 {
    margin-bottom: 15px !important;
  }

  .m_b_40 {
    margin-bottom: 20px !important;
  }

  .m_b_50 {
    margin-bottom: 25px !important;
  }

  .m_b_60 {
    margin-bottom: 30px !important;
  }

  .m_b_150 {
    margin-bottom: 50px !important;
  }

  .m_l_10 {
    margin-left: 5px !important;
  }

  .m_l_20 {
    margin-left: 10px !important;
  }

  .m_l_30 {
    margin-left: 15px !important;
  }


  /* PADDING */

  .p_10 {
    padding: 5px !important;
  }

  .p_20 {
    padding: 10px !important;
  }

  .p_30 {
    padding: 15px !important;
  }

  .p_t_10 {
    padding-top: 5px !important;
  }

  .p_t_20 {
    padding-top: 10px !important;
  }

  .p_t_30 {
    padding-top: 15px !important;
  }

  .p_t_60 {
    padding-top: 30px !important;
  }

  .p_r_10 {
    padding-right: 5px !important;
  }

  .p_r_20 {
    padding-right: 10px !important;
  }

  .p_r_30 {
    padding-right: 15px !important;
  }


  .p_b_10 {
    padding-bottom: 5px !important;
  }

  .p_b_20 {
    padding-bottom: 10px !important;
  }

  .p_b_30 {
    padding-bottom: 15px !important;
  }

  .p_l_10 {
    padding-left: 5px !important;
  }

  .p_l_20 {
    padding-left: 10px !important;
  }

  .p_l_30 {
    padding-left: 15px !important;
  }

  .font_18 {
    font-size: 12px;
  }

  .font_20 {
    font-size: 13px;
  }

  .font_22 {
    font-size: 14px;
  }

  .font_24 {
    font-size: 16px;
  }


}

/* header */


@media (max-width: 1400px) {
 body{  
    header{
      left:auto;
      right:0;
      position: fixed;
      z-index: 100;
      width: 100%;
      top: 0;
      
      
      
      
      > .inwrap{
        background:var(--fff);
        position: absolute;
        width: 380px;
        right: 0;
        top: 0;
        min-height: 100dvh;
        display: flex;
        justify-content: flex-start;
        flex-direction: column;
        margin-right: -380px;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -ms-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
        transition: all 0.4s ease-in-out;
              
        .logo_area{
          padding-top: 5rem;
          width: 100%;
          display: block;
          text-align: center;
          a {
            img.main{
            position: relative;
            transform: translate(0, 0);
            left: 0;
            display: inline-block;
            }
            img.sub{
              display:none;
            }
          }
        }
        
        nav{
          width: 100%;
          margin-left: 0;
          
          .lnb{
          margin-top:0;
          display: flex;
          flex-direction: column;
          gap: 0;
          margin: 5rem 0 3rem 0;
          li{
            margin: 0;
            margin: 0 2rem;
            font-size: 2.6rem;
            border-bottom: 1px solid var(--C6C3C2);
            
            &:nth-child(4){
              margin-right: 2rem;
            }
            a{
              color: var(--000);
              display:flex;
              gap: 1rem;
              /* border-bottom: 1px solid var(--aaa); */
              font-family: 'Pretendard';
              font-weight: 400;
              /* font-size: 2.6rem; */
              line-height: normal;
              justify-content: center;
              padding: 1.5rem 0;
              
              
              span{
                display:none;
                  &:after{
                  display:none;
                  }
                }
              }
            &.tel {
              display:block;
              text-align: center;
              a{
                font-size: 1.2em;
                font-weight: 600;
                display: flex;
                justify-content: center;
                padding: 2rem;
                i {
                  &:before{
                    margin: 0;
                  }
                }
              }
              
              }
            &:first-child{
              display:none;
            }
            &:hover {
              > a{
                color: var(--000);
              }
            } 
          }
        }
      
        .menu_wrap{
          right: 5rem;
          top: 2.5rem;
          position: fixed;
          width: 5rem;
          height: 5rem;
          cursor: pointer;
          transition: all 0.4s ease-in-out;
          margin-top: 0;
          opacity: 1;
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          #menu_but{
          &:before,
          &:after,
          span{
            content:'';
            width: 5rem;
            height: 3px;
            display: block;
            background: var(--color_main);
            position: relative;
            -webkit-transition: all 0.3s;
            -moz-transition: all 0.3s;
            -ms-transition: all 0.3s;
            -o-transition: all 0.3s;
            transition: all 0.3s;
            margin-top: 1rem;
            -webkit-transform-origin: center center;
            -ms-transform-origin: center center;
            transform-origin: 
              center center;
          }
      
          }
          &.active{
            right:3rem;
            #menu_but{
            
            span{
              opacity:0;
            
            }
            &:before{
              visibility: inherit;
              transform:  rotate(45deg);
              margin-top: 2.3rem;
            }
            &:after {
              visibility: inherit;
              transform:  rotate(-45deg);
              margin-top: -1.6rem;
              }
          
            
            }
          }
        }
        .sns{
          display: flex;
          justify-content: center;
          align-items: center;
          gap: 1.5rem;
          
          
          
          li{
            a{
              i{
                background: var(--000);
                color: var(--fff);
                font-size: 3.5rem;
                border-radius: 100%;
                line-height: 6rem;
                height: 6.2rem;
                display: inline-block;
                width: 6.2rem;
                text-align: center;
              }
              span {
                display:none;
              }
            }
          }
        }
        }
      }
        &.f_nav{
          top:0;
        }
        &.open {
          top:0;
        .inwrap{
          margin-right: 0px !important;
          box-shadow: -4px 0 4px 0 rgba(0, 0, 0, 0.15);
          gap: 0;
        }
    }
  }
}
}
@media (max-width: 768px) {
 body{
   header {
    position:fixed;
    z-index: 20;
    width: 100%;
    /* left: 0; */
    top: 0;
    padding: 0;
    
    > .inwrap {
      width:100dvw;
      margin-right: -100dvw !important;
      background: var(--fff);
      position: absolute;
      right: 0;
      top: 0;
      min-height: 100dvh;
      display: flex;
      justify-content: flex-start;
      flex-direction: column;
      -webkit-transition: all 0.3s;
      -moz-transition: all 0.3s;
      -ms-transition: all 0.3s;
      -o-transition: all 0.3s;
      transition: all 0.3s;
      gap: 0;
      
      
      
      .logo_area{
        padding-top:10rem;
        width: 100%;
        display: block;
        text-align: center;
        
        a{
          
          img.main{
            display: none;
          }
          img.sub{
            display: block;
            position: relative;
            width: 200px;
            left: 50%;
            transform: translate(-50%, 0);
            max-width: 200px;
          }          
        }

      }
      nav{
        .lnb{
           margin: 3rem 0;
           
          li{
            padding: 0 3rem;
            font-size: 2.6rem;
            font-weight: 800;
            a{
              font-size: 4rem;
              text-align: center;
              display: block;
              padding: 2rem;
              /* border-bottom: 1px solid var(--C6C3C2); */
              font-family: 'Pretendard';
              font-weight: 400;
              color: var(--000);
              line-height: normal;
            }
            &.tel {
            display:block;
            text-align: center;
            a{
              font-size: 1.8em;
              /* font-weight: 600; */
              /* display: flex; */
              /* justify-content: center; */
              /* padding: 2rem; */
            }
            
            }
          }
        }
      .menu_wrap{
        right: 3rem;
          &.active{
            #menu_but{
            
            span{
              opacity:0;
            
            }
            &:before{
              visibility: inherit;
              transform:  rotate(45deg);
              margin-top: 2.3rem;
            }
            &:after {
              visibility: inherit;
              transform:  rotate(-45deg);
              margin-top: -1.9rem;
              }
          
            
            }
          }
        }

      }
    }
     &.f_nav{
       > .inwrap{
         min-width: 100%;
       }
     }
  }
 }   
}

/* FAQ */

#faq {

  border-top: 1px solid var(--color_main);
  
  > li{
          border-bottom: 1px solid var(--color_main);
    p {
      margin: 0
    }
    .faq_q {
      padding: 2.5rem;
      position: relative;
      z-index: 1;
      cursor: pointer;
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 2.4rem;
      font-weight: 700;
      /* color: var(--color_main); */
    }
  .faq_a {
    display: none;
    padding: 2.5rem;
    border-top: 1px solid var(--C6C3C2);
    overflow: hidden;
    > div {
      width: 100%;
    }
  }
    
    .faq_q{
      &::before {
        content: '\E835';
        font-family: 'icon_font';
        position: absolute;
        right: 3rem;
      }
      &.q_active{
        &::before {
          content: '\E836';

      }
    }

  }
}
}


@media screen and (max-width: 768px) {

#faq{
  > li{

    .faq_q {padding: 1.5rem;padding-right: 4rem;font-size: 16px;display: block;}
    .faq_q::before, .faq_a::before {width: 3rem;height: 3rem;line-height: 3rem;font-size: 3rem;/* margin-left: -3rem; *//* margin-top: -4px; */position: absolute;text-align: center;right: 1rem;}
    .faq_a::before {margin-top: 0px;}
    .faq_a {padding: 10px;/* padding-left: 50px; */
           > div{
             width:auto;
           }
           }
    p{
    }
  }
}
}

/* storyList */
.storyList{
  ul{
    border-top: 1px solid var(--color_main);
    li{
      border-bottom: 1px solid var(--color_main);
      a{
        padding: 2.5rem;
         display: flex;
         font-size: 2.4rem;
        font-weight: 700;
      }
    
      
    }
  }
}
@media screen and (max-width: 768px) {
  .storyList{
    ul{
      li{
        a{
          padding: 1.5rem;
          font-size: 16px;
          }
        }
      }
    }
  }


/* footer */
.footer {
  position:relative;
  z-index: 2;
  
  .foot_map {
    background: var(--bg);
    padding: 15rem 5rem;
    
    .inwrap {
      max-width: 1400px;
      margin: 0 auto;

      >ul {
        display: flex;
        gap: 6rem;
        
        >li {
          flex: 1;
          letter-spacing: 0;
          

          #footMap {
            width: 100%;
            height: 100%;
            border: 1px solid var(--color_main);
          }

          >ul {
            >li {
              h4 {
                font-size: 4rem;
                text-align: center;
                position: relative;
                margin-bottom: 2rem;
                font-family: 'GounBatang';

                &:after {
                  content: '';
                  display: inline-block;
                  width: .6rem;
                  height: .6rem;
                  border: 4px solid var(--color_main);
                  border-radius: 10rem;
                  position: absolute;
                  margin-right: -2rem;
                  margin-top: -.5rem;
                }
              }

              h5 {
                font-size: 3rem;
                color: var(--color_main);
                text-align: center;
              }

              h6 {
                font-size: 2rem;
                color: var(--color_main);
                text-align: center;
              }

              >div {
                border-top: 1px solid var(--color_main);
                margin-top: 5rem;
                padding-top: 5rem;
                align-items: center;
                justify-content: center;
                gap: 5rem;
                
                h4 {
                  margin: 0;
                }
                > div{
                  display:flex;
                  justify-content: center;
                  align-items: center;
                  gap: 4rem;
                  margin-top: 2rem;
                }
                dl {
                  font-size: 2.5rem;
                  display: flex;
                  flex-wrap: wrap;
                  align-items: center;
                  max-width: 295px;
                  gap: 1rem 2rem;
                  
                  
                  &+ dl {
                    max-width: 260px;
                  }
                  
                  dt {
                    display: inline-block;
                  }

                  dd {
                    display: flex;
                    align-items: center;
                    
                    i {
                      margin-left: 1rem;
                    }

                    span {
                      font-size: .8em;
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }

  .footCopy {
    background: var(--color_main);
    padding: 5rem;
    color: var(--fff);
    letter-spacing: .5px;
    font-weight: 400;
    line-height: 1.6;
    
    
    .inwrap {
      max-width: 1400px;
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      align-items: center;
      .footer_info{
        color: var(--bg);
        
        
        
        
        a{
          display: block;
          img{
            max-width: 25rem;
          }
          margin-bottom: 1rem;
        }
      }
      p {
        font-size: 1.2rem;
        margin-top: 1rem;
      }
      .foot_sns{
        ul{
          display: flex;
          gap: 2rem;
          li{
            position:relative;
            a{
              color: var(--fff);
              font-size: 2rem;
              letter-spacing: .5px;
              text-align: center;
              -webkit-transition: all 0.3s;
              -moz-transition: all 0.3s;
              -ms-transition: all 0.3s;
              -o-transition: all 0.3s;
              transition: all 0.3s;
              transition: all 0.4s ease-in-out;

              &:before{
                  content:'';
                  display: inline-block;
                  width: .6rem;
                  height: .6rem;
                  border: 2px solid var(--color_sub);
                  border-radius: 10rem;
                  position: absolute;
                  left: 50%;
                  transform: translate(-50%, -100%) scale(0);
                  -webkit-transition: all 0.3s;
                  -moz-transition: all 0.3s;
                  -ms-transition: all 0.3s;
                  -o-transition: all 0.3s;
                  transition: all 0.3s;
                  transition: all 0.4s ease-in-out;
                }

            }
            &:hover{
              a{
                color: var(--color_sub);
                &:before{
                  transform: translate(-50%, -100%) scale(1);
                }
              }
                
              }
          }
        }
      }
    }
  }
}
@media (max-width: 1400px) {
  .footer{
    .foot_map{
      .inwrap{
        ul{
          gap: 3rem;
          > li{
            > ul{
              > li{
                > div{
                  > div{
                    display: flex;
                    flex-direction: column;
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}
@media (max-width: 768px) {
  .footer{
    .foot_map{
      padding:10rem 3rem;
      .inwrap{
        ul{
          display:flex;
          flex-direction: column;
          li{
            #footMap{
              height: 30rem;
              margin-bottom: 2rem;
            }
            > ul{
              gap:0;
              > li{
                > div{
                  > div{
                    flex-direction: column;
                    gap: 1rem;
                    
                    dl{
                      max-width: 30rem;
                      display: flex;
                      justify-content: center;
                    }
                  }
                }
              }
            }
            
          }
        }
      }
    }
    .footCopy{
      padding: 5rem 3rem 10rem 3rem;
      
      
      
      
      
      
      .inwrap{
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 2rem;
        .footer_info{
          text-align:center;
        }
      }
    }
  }
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(30%, 0, 0);
    transform: translate3d(50%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(30%, 0, 0);
    transform: translate3d(50%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.map_marker {
  text-align: center;
  width: 180px;
  height: 35px;
  background: #fff;
  position: relative;

    p {
    padding: 5px 10px;
    margin: 0;
    position: absolute;
    border-radius: 6px;
    border: 2px solid var(--color_main);
    display: block;
    background: #ffffff;
    left: 0;
    right: 0;
    left: -3px;
    right: -3px;
    top: -3px;
    bottom: -3px;
    font-weight: 600;
    font-size: 1em;
    margin: 0 !important;
    line-height: normal !important;
    font-size: 2rem;
    
      &:after {
      content: '';
      width: 0;
      height: 0;
      border-left: 10px solid transparent;
      border-right: 10px solid transparent;
      border-top: 20px solid var(--color_main);
      position: absolute;
      margin-top: 33px;
      left: 50%;
      margin-left: -10px;
    }
  }
}

@media (max-width: 767px) {
  .map_marker {
    width: 150px;
    height: 30px;
    
    p {
      font-size: 2em;
      
      
      
      &:after {
        margin-top: 28px;
      }
    }
  }
}

/* quick_menu */
.quick_menu {position:relative;bottom: 2rem;right: 20px;/* width: 490px; */position:fixed;z-index: 30;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
.quick_menu > ul {float: left;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
.quick_menu > ul > li{/* margin-bottom:10px */}
.quick_menu > ul > li:before {/* content: '\E8A7'; */font-family:'icon_font';color: #a28050;position: absolute;font-size: 5em;opacity:0;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
.quick_menu > ul > li:hover:before {/* opacity:1 */}
.quick_menu > ul > li a {/* background: #939393; *//* height: 80px; *//* border-radius: 100px; */overflow: hidden;/* margin-bottom: 20px; */}
.quick_menu > ul > li > a {padding: 0;color: var(--color_main);text-align: center;display:block;font-size: 18px;cursor: pointer;text-align: center;padding-left: 0;-moz-box-sizing: border-box;/* -webkit-box-sizing: border-box; *//* box-sizing: border-box; *//* position: relative; *//* width: 80px; *//* border: 1px solid rgb(255, 255, 255,0); *//* border-radius: 10px; */background: rgba(255, 255, 255, .6);border: 1px solid #fff;border-radius: 100px;padding: 5px 20px;display: block;margin-top: 10px;text-align: center;border: 1px solid var(--color_main);}
.quick_menu > ul > li a::before{display: inline-block;font-size: 22px;font-family: 'icon_font';margin-right: 10px;}
.quick_menu > ul > li > a span {display: inline-block;font-weight: 500;/* position: absolute; *//* margin: 21px 10px; */width: 80px;}


.quick_menu > ul > li:nth-child(1) a::before{content: '\E865';}
.quick_menu > ul > li:nth-child(2) a::before{content: '\E846';}

.quick_menu > ul > li:nth-child(3) a::before{content: '\E8C9';}
.quick_menu > ul > li:nth-child(4) a::before{content: '\E857'; }
.quick_menu > ul > li:nth-child(5) a::before{content: '\E851';}
.quick_menu > ul > li:nth-child(6) a::before{content: '\E900';}

.quick_menu > ul > li:hover a{/* background: #a28050; *//* color:#fff; */-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
/* .quick_menu > ul > li:nth-child(2) a{background: #a28050;}
.quick_menu > ul > li:nth-child(3) a{background: #77614d;}
.quick_menu > ul > li:nth-child(4) a{background: #5a4d40;}
.quick_menu > ul > li:nth-child(5) a{background: #f0a900;}
.quick_menu > ul > li:nth-child(6) a{background:#ccc } */

quick_menu > div {width: 380px;float: right;border: 0;border-bottom: 1px solid #dadada;overflow: hidden;}

.quick_menu > ul > li:hover > a {/* width: 140px; *//* padding-left: 25px; *//* text-align: left; *//* margin-left: -80px; */border: 1px solid var(--color_main);background: var(--color_main);color: #fff;}
.quick_menu > ul > li:hover > a span {opacity:1;}
.quick_menu > ul > li:hover a::before{}


.quick_menu.f_nav {top: 170px;right: 20px;margin-right: 0;}
.quick_menu.open {margin-right: 0;}
.quick_menu.open > ul{opacity:0;}


.layerwrite{text-align:left;background: #fff;width: 560px;position: fixed;left: 50%;z-index: 300;margin-left: -280px;top: 140px;display: none;border: 1px solid #dadada;border-radius: 30px;overflow: hidden;padding: 50px;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
.layerwrite h2{font-size: 2.5em;font-weight: 400;margin-bottom: 20px;text-align: center;color: var(--sub_color);font-weight: 600;}
.layerwrite h2 i {float: right;cursor: pointer;position: absolute;right: 20px;top: 20px;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;font-size: .7em;}
.layerwrite h2 i:hover{-webkit-transform: rotate(180deg);transform: rotate(180deg);}
.layerwrite .wraper p {margin:0;text-align: center;}
.layerwrite .wraper > iframe {width: 330px; height: 360px; }
.layerwrite .quick_counsel table {width: 100%;margin: 10px 0 20px;border-top: 1px solid #d3cfc8;}
.layerwrite .quick_counsel table th {border-bottom: 1px solid #cbcbcb;background: #f4f8fb;color: #606060;font-weight: 400;width: 100px;text-align: center;vertical-align:  middle;}
.layerwrite .quick_counsel table td {border-bottom: 1px solid #d5d5d5;padding: 0;background: #fff;}
.layerwrite .quick_counsel form input[type="text"] {border:0;font-size: 1em;padding: 10px 15px;width: 327px;}
.layerwrite .quick_counsel form   textarea {padding: 10px 15px;border:0;width: 327px;min-height: 112px;}
.layerwrite .quick_counsel form p {margin-bottom: 40px;}
.layerwrite .quick_counsel form p input[type=checkbox] + label{}
.layerwrite .quick_counsel form p input[type=checkbox] + label:before{top: -5px;}
.layerwrite .quick_counsel form p input[type=checkbox]:checked + label:before{}
.layerwrite .quick_counsel form input[type="submit"] {width: auto;background: var(--sub_color);border: 0;color: #fff;font-size: 1.4em;padding: 10px 40px;cursor: pointer;border-radius: 40px;display: block;margin: 0 auto;}
.layerwrite img {display: block;}

.layerwrite .quick_counsel form input::placeholder ,
.layerwrite .quick_counsel form textarea::placeholder{color:#c5c5c5;}

.Counselagree_view {line-height:1em;color:#fff;background: #898989;padding:5px 10px;border-radius:4px;margin-left:10px;display:inline-block;}
.Counselagree_view:hover {color:#fff;}

@media screen and (max-width: 1600px) {
  .quick_menu {/* display:none; */}
}



@media screen and (max-width: 767px) {
  .quick_menu {display: block;top: auto;bottom: 0px;width: 100%;left: 0;right: 0;z-index: 50;background: #fff;border-top: 1px  solid #ddd;}
  .quick_menu.f_nav{top:auto;z-index: 100;}
  .quick_menu > ul{width:100%;}
  .quick_menu > ul > li{float:left;width: 33.333%;margin: 0;border-right: 1px solid #ddd;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
  .quick_menu > ul > li:last-child{
    border: 0;
}
  .quick_menu > ul > li > a{width: 100%;height: auto;margin: 0;padding: 0;border: 0;}
  .quick_menu > ul > li:nth-child(5) a{border:0}
  .quick_menu > ul > li > a span{/* margin: 0; *//* position: sticky; *//* opacity: 1; *//* padding: 0; *//* width: 100%; *//* margin-bottom: 8px; */font-size: 12px;/* display: none; */width: auto;font-size: 14px;}
  .quick_menu > ul > li a::before {/* margin-top: 10px; *//* font-weight: 100; *//* margin-bottom: 3px; */margin: 10px 0;line-height: 1;margin-right: 5px;vertical-align: middle;}
  .quick_menu > ul > li:hover > a{padding: 0;margin: 0;text-align: center;width: auto;background: #fff;color: #333;border: none;}



  .layerwrite{width:90%;margin-left:-45%;padding: 50px 5% 30px;top: 60px;}
  .layerwrite h2{font-size:2em;margin-bottom: 10px;}
  .layerwrite h2 > em{width:15px;height:15px;margin: -20px 0 0 -10px;}
  .layerwrite h2 > em:before, .layerwrite h2 > em:after{width:15px;height:15px;margin: 18px 0 0 18px;}
  .layerwrite h2 > em:before{margin: 0px 0 0 18px;}
  .layerwrite .quick_counsel table th{width: 25%;}
  .layerwrite .quick_counsel form input[type="text"], .layerwrite .quick_counsel form textarea{width: 90%;padding: 10px 5%;}
  .Counselagree_view{margin-left: 5px;font-size: .9em;}
  .layerwrite .quick_counsel form p{margin-bottom:20px}
  .layerwrite .quick_counsel table{margin-top:0}
  .layerwrite .quick_counsel form input[type="submit"]{  font-size:1.2em;  padding: 10px 20px;  }
}