@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css); 
@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 100;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype');}

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 300;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');}

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 400;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');}

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 500;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');}

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 700;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');}

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 900;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype');}
html{scroll-behavior: smooth; overflow-x: hidden;}
body, h1, h2, h3, h4, h5, h6, input, textarea, select {font-family: 'Noto Sans KR', sans-serif;}
*{padding:0;margin:0;}
a{text-decoration: none;color: inherit;}
.flex{display: flex;}
.inner{max-width:1200px;margin:0 auto;}
.inner2{max-width:1110px;margin:0 auto;}
ul li{list-style: none;}
html{overflow-x: hidden;}

.sec01{padding:50px 0 0 0;overflow-x: hidden;}
.sec01 .main{justify-content: space-between;align-items: center;}
.sec01 .main .right img{vertical-align: bottom;}

.sec01 .main .left .middle{margin:50px 0;}


.swiper {
    width: 100%;
    height: 100%;
  }

  .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .swiper-slide img {
    display: block;
   
    object-fit: cover;
  }
  
.sec02{
    background-color: #CAEBFF;
    padding:80px 0;
    text-align: center;
    overflow-x: hidden;
}

.sec02 .main{margin:50px 0;}

/* sec03 */

.sec03{
    background-color: #F8F8F8;
    padding:80px 0;
    text-align: center;
    overflow-x: hidden;
}

.sec03 .subtitle{margin:10px 0 25px 0;}

.sec03 .tab_content{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}


.sec03 input[type="radio"]{
    display:none;
}

.sec03 input[type="radio"]+ label {
    display:flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    font-size:22px;
    font-weight:bold;
    color:#fff;
    width:560px;
    height:74px;
    background: url('../img/sec06tabbg1.png') no-repeat;
    width: calc((100% - 20px) / 2);
    background-size: cover;
}

.sec03 input[type="radio"]:checked + label{
    background: url('../img/sec06tabbg2.png') no-repeat;
    background-size: cover;
    color:#fff;
}

.sec03 .conbox{display:none;margin-top:25px;}

.sec03 input[id="tab01"]:checked ~ .con1{display:block;}
.sec03 input[id="tab02"]:checked ~ .con2{display:block;}

/* sec04 */
.sec04{
    background-color: #fff;
    padding:80px 0;
    text-align: center;
    overflow-x: hidden;
}

.sec04 .title{margin-bottom:15px;}

.sec04 .main{margin:50px 0;}


/* 흐르는 슬라이드 */
.marquee { --gap: 1.5em; display: flex; flex-direction: column; gap: var(--gap); }
.marquee-con { overflow: hidden; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; display: flex; position: relative; gap: var(--gap); }
.marquee-list { position: relative; display: flex; flex-shrink: 0; justify-content: space-around; -webkit-animation: marqueeX 30s linear infinite; animation: marqueeX 30s linear infinite; gap: var(--gap); }
.marquee-con.reverse .marquee-list { animation-direction: reverse; }
.marquee-item.img { height: 380px; }
.marquee-item.img img { height: 100%; border-radius:25px;}

.marquee-item.shape { width: 25vw; height: 25vw; }
.marquee-item.shape1 { -webkit-clip-path: circle(50% at 50% 50%); clip-path: circle(50% at 50% 50%); }
.marquee-item.shape2 { -webkit-clip-path: polygon(100% 0,100% 0,100% 100%,0 100%); clip-path: polygon(100% 0,100% 0,100% 100%,0 100%); }
.marquee-item.shape4 { -webkit-clip-path: polygon(50% 0,50% 0,100% 100%,0 100%); clip-path: polygon(50% 0,50% 0,100% 100%,0 100%); }

.marquee-item.shape-img1 { -webkit-filter: invert(90%) sepia(81%) saturate(748%) hue-rotate(311deg) brightness(103%) contrast(101%); filter: invert(90%) sepia(81%) saturate(748%) hue-rotate(311deg) brightness(103%) contrast(101%); }
.marquee-item.shape-img2 { -webkit-filter: invert(79%) sepia(9%) saturate(2256%) hue-rotate(277deg) brightness(99%) contrast(85%); filter: invert(79%) sepia(9%) saturate(2256%) hue-rotate(277deg) brightness(99%) contrast(85%); }
.marquee-item.shape-img3 { -webkit-filter: invert(83%) sepia(24%) saturate(5991%) hue-rotate(181deg) brightness(99%) contrast(91%); filter: invert(83%) sepia(24%) saturate(5991%) hue-rotate(181deg) brightness(99%) contrast(91%); }
.marquee-item.shape-img4 { -webkit-filter: invert(92%) sepia(15%) saturate(1055%) hue-rotate(39deg) brightness(91%) contrast(90%); filter: invert(92%) sepia(15%) saturate(1055%) hue-rotate(39deg) brightness(91%) contrast(90%); }

@-webkit-keyframes marqueeX {
    0% {
        transform: translateZ(0)
    }
    to {
        transform: translate3d(calc(-100% - 1em),0,0)
    }
}

@keyframes marqueeX {
    0% {
        transform: translateZ(0)
    }
    to {
        transform: translate3d(calc(-100% - 1em),0,0)
    }
}
@-webkit-keyframes marqueeY {
    0% {
        transform: translateZ(0)
    }
    to {
        transform: translate3d(0,calc(-100% - 1em),0)
    }
}
@keyframes marqueeY {
    0% {
        transform: translateZ(0)
    }
    to {
        transform: translate3d(0,calc(-100% - 1em),0)
    }
}    



.sec05{
    padding:80px 0;
    text-align: center;
    background-color: #F4F4F4;
    overflow-x: hidden;
}

.sec05 .arr{margin:50px 0;}
.sec05 .bottom{margin-top:25px;}

.sec06{
    background: url('../img/sec06bg.png') no-repeat;
    background-size: cover;
    padding:50px 0;
    text-align: center;
    overflow-x: hidden;
}

.sec06 .main{margin:25px 0;}

.sec07{
    padding:80px 0;
    text-align: center;
    overflow-x: hidden;
}

.sec07 .main{
    margin:50px 0;
    justify-content: center;
    align-items: center;
    gap:25px;
}

.sec08{padding:50px 0;overflow-x: hidden;}

.sec08 .main{justify-content: space-between; align-items: center;}

.sec09{padding:50px 0;overflow-x: hidden;}

.sec09 .main{justify-content: space-between; align-items: center;}

.sec10{padding:50px 0;overflow-x: hidden;}

.sec10 .main{justify-content: space-between; align-items: center;}

.sec11{
    background-color: #CAEBFF;
    padding:80px 0;
    overflow-x: hidden;
}

.sec11 .main{justify-content: center;align-items: center;gap:50px;}

.sec11 .main .left{
    background-color: #fff;
    border-radius: 24px;
    text-align: right;
    padding:95px;
}

.sec11 .main .left .mid{margin:50px 0;}
.sec11 .main .right .mid{margin:10px 0;}



/* foot */
footer{background-color: #3B3A40;padding:50px 0;text-align: center;
margin-bottom:110px;overflow-x: hidden;}
footer .main{color: #fff;}

.footfix{
    width:100%;
    background-color: #2B6DE2;
    bottom:0;right:0;left:0;
    position: fixed;
    padding:15px 0;
    overflow-x: hidden;
}

.footfix .main{
    justify-content: center;
    align-items: center;
    gap:10px;
}

.footfix .input input{
    width:120px;
    height:35px;
    font-size:16px;
    border-radius: 5px;
    border:0;
}


.footfix .agree{color: #fff;align-items: center;gap:5px;}
.footfix .agree input{
    width:20px;
    height:20px;
}
.footfix .agree p{font-size:14px;}

.footfix .main .button button{
    border:0;
    background-color: #253340;
    color:#fff;
    font-size:18px;
    border-radius: 10px;
    cursor: pointer;
    padding:17px 20px;
}

.footfix .main .katalk img{vertical-align: bottom;}

.fade {
    position: relative;
  }

  .fade-in{
    animation: fadein 3s;
    -moz-animation: fadein 3s; /* Firefox */
    -webkit-animation: fadein 3s; /* Safari and Chrome */
    -o-animation: fadein 3s; /* Opera */
  }


  @keyframes fadein {
      from {
          opacity: 0;
      }
      to {
          opacity: 1;
      }
  }
  @-moz-keyframes fadein { /* Firefox */
      from {
          opacity: 0;
      }
      to {
          opacity: 1;
      }
  }
  @-webkit-keyframes fadein { /* Safari and Chrome */
      from {
          opacity: 0;
      }
      to {
          opacity: 1;
      }
  }
  @-o-keyframes fadein { /* Opera */
      from {
          opacity: 0;
      }
      to {
          opacity: 1;
      }
  }



  .sec01 .swiper{display: block;}
  .sec01 .mainmb{display: none;}
  .footfix{display:block;}
  .mfootfix{display:none;}

  @media(max-width:1199px){
    .inner{width:90%;}
    .inner2{width:90%;}
    .sec01 .swiper{display: none;}
    .sec01 .mainmb{display: block;}
    .footfix{display:none;}
    .mfootfix{display:block;}

    .sec01{padding:50px 0;text-align: center;margin-top:50px;}
    .sec01 .mainmb .logo{position: fixed;width:100%;top:0;right:0;left:0;padding:15px 0;
    z-index: 9;background-color: #fff;}
    .sec01 .mainmb .left .logo img{width:50%;}
    .sec01 .mainmb .left .middle img{width:100%;margin-left:10px;}
    .sec01 .mainmb .left .bottom{margin-top:15px;}
    .sec01 .mainmb .left .bottom a{width:50%;}
    .sec01 .mainmb .left .bottom a img{width:100%;}
    .sec01 .mainmb .left .bottom img{width:50%;}






    .sec02 .title img{width:70%;}
    .sec02 .main img{width:90%;}
    .sec02 {padding:50px 0;}
    .sec02 .main{margin:25px 0;}

    .sec03{padding:50px 0;}
    .sec03 .title img{width:70%;}
    .sec03 .subtitle img{width:70%;}

    .sec03 .subtitle{margin:5px 0 25px 0;}

.sec03 input[type="radio"]+ label {
    font-size:14px;
    border-radius: 15px;
    height:50px;
}

.sec03 .conbox img{width:100%;}

.sec04 .title img{width:50%;}
.sec04 .subtitle img{width:50%;}
.sec04 .main img{width:80%;height:auto;}

.sec04{
    padding:80px 0 0 0;
}
.sec04 .title{margin-bottom:10px;}
.sec04 .main{margin:25px 0 0 0;}


.sec05{padding:50px 0;}
.sec05 .top img{width:100%;}
.sec05 .arr img{width:20%;}
.sec05 .mid img{width:100%;}
.sec05 .bottom img{width:100%;}
.sec05 .arr{margin:25px 0;}
.sec05 .bottom{margin-top:10px;}

.sec06 .title img{width:100%;}
.sec06 .main img{width:100%;}

.sec06 .main{margin:15px 0;}

.sec07 .title img{width:70%;}
.sec07 .main{flex-direction: column;}
.sec07 .main img{width:100%;}

.sec07{padding:50px 0;}
.sec07 .main{
    margin:25px 0;
    gap:10px;
}

.sec08{padding:0;}
.sec08 .main{flex-direction: column;text-align: center;gap:15px;}
.sec08 .main .left img{width:100%;}
.sec08 .main .right img{width:100%}

.sec09{padding:25px 0;text-align: center;}
.sec09 .main{flex-direction: column;gap:15px;}
.sec09 .main .left img{width:100%;}
.sec09 .main .right img{width:100%;}

.sec10{padding:25px 0 50px 0;text-align: center;}
.sec10 .main{flex-direction: column;gap:15px;}
.sec10 .main .left img{width:100%;}
.sec10 .main .right img{width:100%;}

.sec11 .main{flex-direction: column;}

.sec11{
    background-color: #CAEBFF;
    padding:80px 0;
    overflow-x: hidden;
}

.sec11 .main{gap:25px;}

.sec11 .main .left{
    border-radius: 15px;
    text-align: center;
    padding:25px 0;
}

.sec11 .main .left .top img{width:90%;}
.sec11 .main .left .mid img{width:90%;}
.sec11 .main .left .bot img{width:90%;}
.sec11 .main .left .then img{width:60%;}

.sec11 .main .left .mid{margin:25px 0;}
.sec11 .main .right .mid{margin:10px 0;}

.sec11 .main .right img{width:100%;}


footer{font-size:12px; margin-bottom:160px;}

.mfootfix{
    width:100%;
    background-color: #2B6DE2;
    bottom:0;right:0;left:0;
    position: fixed;
    padding:15px 0;
    overflow-x: hidden;
    text-align: center;
}

.mfootfix .top{
    justify-content: center;
    align-items: center;
    margin-left:20px;
}

.mfootfix .top .logo img{width:90%;}
.mfootfix .top .tel img{width:80%;}

.mfootfix .mid{margin:10px 0;}
.mfootfix .mid {justify-content: center;align-items: center;gap:5px;}

.mfootfix .mid input{width:80px;height:35px;
border:0;border-radius: 5px;}

.mfootfix .mid .agree {justify-content: center; align-items: center;gap:2px;}
.mfootfix .mid .agree input{width:15px;height:15px;}
.mfootfix .mid .agree p{font-size:10px;color: #fff;}
.marquee-list{gap:1px;}
}

.mfootfix .bottom{justify-content: center;align-items: center;gap:10px;margin-left:30px;}

.mfootfix .bottom .button button{
    border: 0;
    background-color: #253340;
    color: #fff;
    font-size:14px;
    padding:15px 15px;
    cursor: pointer;
    border-radius: 5px;
}

.mfootfix .bottom .katalk2 img{width:80%;vertical-align: bottom;display: block;}