@charset "utf-8"; 

@import url(html5_reset.css);
@import url(font.css);

:root{
  --main_color: #284aab;
  --sub_color: #783fab;
  --sub2_color: #3c559f;
  --bg_color: #fff1f9;
  --bg_color2: #b6b4bf;
  --yellow_color: #fece63;
  --color_pen: #ffe580;
  --color_dark: #333;
  --line: #ddd;
  --fff:#fff;
}

html {font-family:"Barlow", 'Noto Sans KR', sans-serif;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;overflow-y: scroll;max-width: 1920px;margin: 0 auto; text-align: center; }
body {font-size: 20px;overflow: hidden;position: relative;color: var(--color_dark);}
img{max-width: 100%;}
body p {line-height: 1.5em;}
.mobile{display:none;}
.inwrap {max-width: 1200px;margin:0 auto;/* margin-bottom: 68px; */padding-bottom: 60px;background: #a02424;}
.inwrap img {display: block;}
.visual {
  .owl-dots {
    display:flex;
    justify-content: center;
    gap: .5em;
    position: absolute;
    right: 0;
    left: 0;
    margin-top: -3em;
    
    .owl-dot{
      span{
        display:block;
        width:1em;
        height:1em;
        background:#284aab;
        border-radius: 100px;
        opacity:.5;
      }
     
    }
     .owl-dot.active span {
        opacity:1;
      }
  }
}
.quick_menu{
  position: fixed;
  bottom: 0;
  width: 100%;
  left: 0;
  right: 0;
  
  
    ul{
      display: flex;
      max-width: 1200px;
      margin: 0 auto;
      background: var(--fff);

      li{
        width: 33.33333333333%;
        padding: 10px 0;
        
        
        
        i{
          /* display: block; */
          font-size: 2em;
        }
        span{
          font-size: 26px;
        }
        a{
          display: flex;
          align-items: center;
          justify-content: center;
          gap: 10px;
        }
      }
      
      li:nth-child(1){
        background: #284aab;
        a {
          color:var(--fff);
        }
      }
      li:nth-child(2){
        background: #FAE100;
        animation-name: color-effect;
        animation-duration: 600ms;
        animation-iteration-count:infinite;
      }
      li:nth-child(3){
        background: #2DB400;
        a{
          color: var(--fff);
        }
      }
    }
   
}

@media screen and (max-width:  767px) {
  .visual {
  .owl-dots {
   margin-top: -6vw;
   gap: 5px;
   
    
    .owl-dot{
   span{
  width: 12px;
  height: 12px;
      }
     
    }
     .owl-dot.active   span {}

  }
}
.inwrap{padding-bottom: 80px;}
.quick_menu{
  ul{
   
    li{
      a{
        gap:0;
        display: flex;
        flex-direction: column;
        
        i{
          font-size: 1.5em;
          margin-bottom: 2px;
        }
        span{
          font-size:15px;
        }
      }
      
    }
  }
}

}

@keyframes color-effect {


  0%{

	background-color: #FAE100;
	}
  50% {

    background-color: #82ffcb;
  }
}


button.counsel {background: var(--main_color);color: var(--fff);border: 0;font-size: 1.5em;padding: 10px 20px;border-radius: 10px;position: absolute;left: 15px;right: 15px;bottom: 30px;font-family: 'TheJamsil';cursor: pointer;}

.wrapper > .counsel{position: fixed;bottom: 20px;max-width: 780px;left: 50%;transform: translate(-50%,0%);z-index: 10;bottom: -70px;-webkit-transition: all 1s;-moz-transition: all 1s;-ms-transition: all 1s;-o-transition: all 1s;transition: all 1s;}
.wrapper > .counsel.fixed {bottom: 20px;}
.counsel_pop {display: flex;left: 0;right: 0;position: fixed;z-index: 100;bottom: -100vh;/* display: none; */-webkit-transition: all 1s;-moz-transition: all 1s;-ms-transition: all 1s;-o-transition: all 1s;transition: all 1s;}
.counsel_pop:after {content:'';display:block;position:fixed;background: rgba(0, 0, 0, .6);z-index: -1; opacity:0; -webkit-transition: all 1s;    -moz-transition: all 1s;    -ms-transition: all 1s;    -o-transition: all 1s;    transition: all 1s;
}
.counsel_pop.open:after{opacity:1;top:0;left:0;right:0;bottom:0;-webkit-transition: all 1s;-moz-transition: all 1s;-ms-transition: all 1s;-o-transition: all 1s;transition: all 1s;}
.counsel_pop > div {background: var(--fff);padding: 30px;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;max-width: 800px;margin: 0 auto;position: relative;}
.counsel_pop h4 {font-family: 'TheJamsil';font-size: 2em;}
.counsel_pop h5{font-size: 1.4em;text-align: left;margin-top: 1em;font-family: 'TheJamsil';line-height: 1.2em;font-weight: 400;text-align: center;}
.counsel_pop h5 span {font-size: .7em;display: block;color: #85878c;}
.counsel_pop.open {display:block;bottom: 0;}

.counsel_pop .close_but {position: absolute;width: 30px;height: 30px;cursor: pointer;right: 30px;top: 30px;transition: transform 0.3s ease;}
.counsel_pop .close_but:hover {transform: rotate(180deg);}
.counsel_pop .close_but span{position: absolute;display: block;width: 100%;height: 2px;top: 50%;left: 0;transform: rotate(45deg);background-color: #222;}
.counsel_pop .close_but  span::after {content:'';position: absolute;display: block;width: 100%;height: 2px;transform: rotate(90deg);background-color: #222;}

/* formbox */
#inquiry {margin-top: 32px;}
#inquiry .form_box {position: relative;width: 100%;}
#inquiry .form_box .input_item + .input_item {margin-top: 16px;}
#inquiry .form_box .input_item p {display: flex;align-items: flex-start;color: #333;margin-bottom: 6px;font-weight: bold;}
#inquiry .form_box .input_item p.reqiured:after {display: inline-block;content: '*';clear: both;color: #E8272C;font-size: 14px;font-weight: bold;}
.blind {position: absolute;width: 1px;height: 1px;clip: rect(0 0 0 0);overflow: hidden;}

/* input */
#inquiry .form_box input::placeholder {color: #999;}
#inquiry .form_box input:focus::placeholder {color: #333;}
#inquiry .form_box input[type="text"], #inquiry .form_box input[type="tel"] {display: block;width: 100%;height: 50px;line-height: 50px;padding: 0 16px;color: #333;font-size: 16px;font-family: "Pretendard";border-radius: 8px;letter-spacing: -0.03em;outline: none;background: #F8F9FD;border: 0;box-sizing: border-box;}
#inquiry .form_box input[type="text"]:focus, #inquiry .form_box input[type="tel"]:focus {box-shadow: 4px 4px 8px rgb(151 39 232 / 14%);border: 1px solid var(--main_color);}
input, textarea, select { font: inherit; }
button, input[type="button"], input[type="submit"], input[type="reset"] { cursor: pointer; }
input[type="text"], input[type="password"], textarea { -webkit-appearance: none; }


/* checkbox */
.privacy-box {display: flex;flex-direction: column;flex-wrap: wrap;justify-content: space-between;width: 100%;margin: 0 auto;padding-top: 28px;/* border-top: 1px solid #eee; */}
.privacy-box div[class^="checkbox-"] {display: flex;justify-content: space-between;align-items: center;width: 100%;margin: 14px auto 0;}
.privacy-box  input[type="checkbox"] + label {display: flex;width: fit-content;align-items: center;color: #777;cursor: pointer;user-select: none;-webkit-user-select: none;-moz-user-select: none;}
.privacy-box  input[type="checkbox"] + label:before {display: inline-block;margin-right: 8px;content: '\e800';font-family: "icon_font";font-size: 1.25em;color: #ddd;}
.privacy-box  input[type="checkbox"]:checked + label {color: #222;font-weight: 700;}
.privacy-box  input[type="checkbox"]:checked + label:before {color: #E8272C;}

/* button */

#inquiry  button {margin: 36px auto 0;display: inline-block;width: 100%;text-align: center;padding: 17px;border-radius: 12px;font-size: 18px;font-weight: 700;color: #fff;background: #242628;background: var(--main_color);color: #fff;font-size: 18px;font-weight: bold;border: 0;}


@media screen and (max-width:  767px) {
  .mobile{display:initial;}
  .counsel_pop h4{
  font-size: 1.5em;
}
  .counsel_pop > div{
  padding: 30px 15px;
}
  .counsel_pop .close_but{
  width: 20px;
  right: 15px;
}

.counsel_pop h5 {
  font-size: 1em;
}
  .wrapper > .counsel{left: 15px;right: 15px;transform: translate(0%, 0%);}
  .wrapper > .counsel.fixed {bottom:15px;}

}