@charset "utf-8";

#wrap{margin:0;}

/* Main Visual */
.mv_sec {overflow: hidden; position: relative;}
.mv_sec .item {position: relative; overflow: hidden;} 
.mv_sec .item .mv_img {display: flex; align-items: center; justify-content: center;}
.mv_sec .item .mv_img img {transition: all 5s; min-width: 1000px;}
.mv_sec .item .m_txt {position:absolute; top:230px; left:50%; transform: translateX(-50%); max-width: 1400px; width: 100%;}
.mv_sec .item .m_txt .mv_logo {max-width: 349px; width: 50%; margin:0 auto; position: relative; top: -30px; transition: all 0.5s; opacity: 0;}
.mv_sec .item .m_txt h4 {font-size: 3.125em; font-weight: 700; color: #fff; line-height: 1.3; text-align: center; margin-top: 35px; position: relative; top: -30px; transition: 0.5s 0.3s; opacity: 0;}
.mv_sec .item .m_txt h5 {font-size: 1.875em; line-height: 1.3; color: #fff; text-align: center; margin-top: 27px; position: relative; top: -30px; transition: 0.5s 0.6s; opacity: 0; font-weight: 400;}

.mv_sec .active .item .mv_logo,
.mv_sec .active .item h4,
.mv_sec .active .item h5 {top: 0; opacity: 1;}
.mv_sec .active .item .mv_img img {transform:scale(1.1) rotate(.001deg); }

.mv_sec .owl_control .mv_owl_prev {position: absolute; top:330px; left: 100px; z-index: 2;}
.mv_sec .owl_control .mv_owl_next {position: absolute; top:330px; right: 100px; z-index: 2;}
.mv_sec .scroll {position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 2; animation: motion 1.5s linear 0s infinite alternate;}
@keyframes motion {
    0% {
        bottom : 70px;
    }

    100% {
        bottom : 50px;
    }
}

/* MCT 공용 */
.mct {position: relative; padding: 130px 0;}
.mct .inner {max-width: 1400px; width:100%; margin:0 auto;}
.mct .tit {font-size: 3em; line-height: 1; color: #111; font-weight: 700; margin-bottom: 24px;}
.mct .stit {font-size: 1.25em; line-height: 1; font-weight: 400; color: #454545; margin-bottom: 63px;}

/* MCT01 */
.mct01 {background:url(../../images/main/mct01_bg.jpg) no-repeat center center;}
.mct01 ul {justify-content: space-between; border-top-left-radius: 36px; overflow: hidden;}
.mct01 ul li {max-width: 198px; width: 14.143%; align-items: center; justify-content: center; position: relative; background: center center no-repeat; height: 505px; transition: all 0.5s; opacity: 1;}
.mct01 ul li::after {content: ""; display: block; width: 50px; height: 50px; background: url(../../images/main/mct01_plus.png) no-repeat center center; position: absolute; bottom: 0; right: 0; transition: all 0.5s;}
.mct01 ul li:nth-child(1) {background-image: url(../../images/main/mct01_img01.jpg);}
.mct01 ul li:nth-child(2) {background-image: url(../../images/main/mct01_img02.jpg);}
.mct01 ul li:nth-child(3) {background-image: url(../../images/main/mct01_img03.jpg); background-position: center left;}
.mct01 ul li:nth-child(4) {background-image: url(../../images/main/mct01_img04.jpg);}
.mct01 ul li:nth-child(5) {background-image: url(../../images/main/mct01_img05.jpg);}
.mct01 ul li .txt_wrap {width: 100%; overflow: hidden;}
.mct01 ul li .txt_wrap h5 {font-size:1.0625em; line-height: 1.764706; color: #fff; text-align: center; font-weight: 700; text-align: center; transition: all 0.5s;}
.mct01 ul li .txt_wrap h5::after {content: ""; display: block; width: 16px; height: 2px; background: #c70b18; margin: 0 auto 0;;}
.mct01 ul li .txt_wrap h4 {font-size: 2.375em; line-height: 1.3157895; color: #fff; text-align: center; margin-top:30px;transition: opacity 0.5s; opacity: 0; width:0; height: 0;}
.mct01 ul li .txt_wrap a {display: flex; align-items: center; justify-content: center; 
    border-radius: 25px; background-color: #c70b18; margin:55px auto 0;transition: opacity 0.5s; opacity: 0; width:0; height: 0;
    text-align: center; text-transform: uppercase; font-size: 0.875em; line-height: 1; color: #fff;font-weight: 500; 
}

.mct01 ul li.on {max-width: 600px; width: 42.86%;}
.mct01 ul li.on::after {opacity: 0;}
.mct01 ul li.on .txt_wrap h4 {opacity: 1; width: auto; transition-delay: 0.5s; height: 2.6316em;}
.mct01 ul li:last-child.on .txt_wrap h4 { height: 1.3158em;}
.mct01 ul li.on .txt_wrap a {opacity: 1; width: 184px; transition-delay: 0.5s; height: 50px;}

/* MCT02 */
.mct02 {background:url(../../images/main/mct02_bg.jpg) no-repeat center center;}
/* .mct02 .mct02_owl {height: 470px;} */
/* .mct02 .mct02_owl .item {padding-top: 42px;}
.mct02 .mct02_owl .item a {width: 100%;}
.mct02 .mct02_owl .item .img_wrap .bimg {display: none;}
.mct02 .mct02_owl .item .txt_wrap {padding: 27px 0 0;  transition: all 0.3s;}
.mct02 .mct02_owl .item .txt_wrap h4 {font-size: 1.5em; font-weight: 500; text-align: center; color: #333; line-height: 1;  transition: all 0.3s;}
.mct02 .mct02_owl .item .txt_wrap .plus {width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color: #151d30; margin: 36px auto 0;  transition: all 0.3s;}
.mct02 .mct02_owl .item .txt_wrap .plus img {width: auto;}

.mct02 .mct02_owl .center {width: 360px!important; margin-right: 130px!important;}
.mct02 .mct02_owl .center .item {padding-top: 0px!important; position: relative!important;}
.mct02 .mct02_owl .center .item::after {content: ""; display: block; width: 32px; height: 55px; background: url(../../images/main/mct02_arr.png) no-repeat center center; position: absolute; top: 155px; right: -90px;}
.mct02 .mct02_owl .center .item .img_wrap .simg {display: none;}
.mct02 .mct02_owl .center .item .img_wrap .bimg {display: block;}
.mct02 .mct02_owl .center .item .txt_wrap {background-color: #151d30; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; height: 165px; display: flex; flex-flow: column wrap; align-items: center; justify-content: center; padding-top: 0;}
.mct02 .mct02_owl .center .item .txt_wrap h4 {color: #fff;}
.mct02 .mct02_owl .center .item .txt_wrap .plus {background-color: #c70b18;} */

.mct02 ul {height: 470px;}
.mct02 ul li {max-width: 280px; width: 20%; margin-right: 35px; padding-top: 42px; transition: all 0.3s;}
.mct02 ul li:last-child {margin-right: 0;}
.mct02 ul li a {width: 100%;}
.mct02 ul li .img_wrap .bimg {display: none;}
.mct02 ul li .txt_wrap {padding: 27px 0 0;  transition: all 0.3s;}
.mct02 ul li .txt_wrap h4 {font-size: 1.5em; font-weight: 500; text-align: center; color: #333; line-height: 1;  transition: all 0.3s;}
.mct02 ul li .txt_wrap .plus {width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color: #151d30; margin: 36px auto 0;  transition: all 0.3s;}
.mct02 ul li .txt_wrap .plus img {width: 10px;}

.mct02 ul li.on {max-width: 360px; width: 25.72%; margin-right: 130px; padding-top: 0px; position: relative;}
.mct02 ul li .mct02_owl_btn {display: block; width: 32px; height: 55px; background: url(../../images/main/mct02_arr.png) no-repeat center center; position: absolute; top: 155px; right: -90px; cursor: pointer;}
.mct02 ul li:last-child.on {margin-right: 0; margin-left: 95px;}
.mct02 ul li:last-child.on::after {right: auto; left: -90px; transform: rotate(180deg);}
.mct02 ul li.on .img_wrap .simg {display: none;}
.mct02 ul li.on .img_wrap .bimg {display: block;}
.mct02 ul li.on .txt_wrap {background-color: #151d30; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; height: 165px; display: flex; flex-flow: column wrap; align-items: center; justify-content: center; padding-top: 0;}
.mct02 ul li.on .txt_wrap h4 {color: #fff;}
.mct02 ul li.on .txt_wrap .plus {background-color: #c70b18;}

.mct02 ul li .owl-carousel .animated { 
    animation-duration: 100ms;
    animation-fill-mode: both; }

/* MCT03 */
.mct03 {background:url(../../images/main/mct03_bg.jpg) no-repeat center center;}
.mct03 .inner > .flex_bx {justify-content: space-between;}
.mct03 .map_wrap {max-width: 600px; width: 42.8572%; height: 450px; overflow: hidden; position: relative; border-radius: 15px; border: 3px solid rgba(255,255,255,0.6); box-shadow: 5px 9px 24px 0px rgba(0, 0, 0, 0.13);}
.mct03 .map_wrap .map_mark {max-width: 140px; width: 30%; position: absolute; top: 20px; left: 20px; z-index: 2;}
.mct03 .map_wrap .root_daum_roughmap {width: 100%; height:100%;}
.mct03 .map_wrap .root_daum_roughmap .wrap_map {width: 100%; height:100%;}
.mct03 .form_wrap {max-width: 760px; width: 54.286%; background-color: #fff; border-radius: 15px; padding: 30px; box-shadow: 5px 9px 24px 0px rgba(0, 0, 0, 0.13);}
.mct03 .form_wrap .flex_bx {justify-content: space-between;}
.mct03 .form_wrap .w50 {width: 49.28572%;}
.mct03 .form_wrap .w100 {width: 100%;}
.mct03 .form_wrap .email_h {height: 16%;}
.mct03 .form_wrap .input_wrap {position: relative; margin-bottom: 10px;}
.mct03 .form_wrap .input_wrap label {position: absolute; top: 50%; left:20px; font-size: 1em; line-height: 1.25; transform: translateY(-50%); cursor: text; color: #808080;}
.mct03 .form_wrap .input_wrap label sup {color:#c70b18}
.mct03 .form_wrap .input_wrap input {width: 100%; height: 100%; background-color: #f8f8f8; border: none; font-size: 1em; line-height: 1.25; padding: 20px;}
.mct03 .form_wrap .input_wrap label.off {display: none;}
.mct03 .form_wrap .txt_wrap {height: 170px;}
.mct03 .form_wrap .txt_wrap textarea {width: 100%; height: 100%; background-color: #f8f8f8; border: none; font-size: 1em; line-height: 1.25; padding: 20px; color: #808080;}
.mct03 .form_wrap .txt_wrap textarea::-webkit-input-placeholder {color: #808080;}
.mct03 .form_wrap .txt_wrap textarea:-ms-input-placeholder {color: #808080;}
.mct03 .form_wrap input[type="submit"] {background-color: #151d30; border: none; border-radius: 10px; color: #fff; font-size: 1.125em; font-weight: 500; height: 60px; margin-top: 10px;}

/* mct2 */
.mct2 {position: relative;}
.mct2 .inner {max-width: 1400px; width:100%; margin:0 auto;}
.mct2 .tit {font-size: 3em; line-height: 1; color: #111; font-weight: 700; margin-bottom: 24px;}
.mct2 .stit {font-size: 1.25em; line-height: 1; font-weight: 400; color: #454545; margin-bottom: 63px;}

/* MCT04 */
.mct04 .inner > .flex_bx {justify-content: space-between;}
.mct04 .map_wrap {max-width: 600px; width: 42.8572%; height: 450px; overflow: hidden; position: relative; border-radius: 15px; border: 3px solid rgba(255,255,255,0.6); box-shadow: 5px 9px 24px 0px rgba(0, 0, 0, 0.13);}
.mct04 .map_wrap .map_mark {max-width: 140px; width: 30%; position: absolute; top: 20px; left: 20px; z-index: 2;}
.mct04 .map_wrap .root_daum_roughmap {width: 100%; height:100%;}
.mct04 .map_wrap .root_daum_roughmap .wrap_map {width: 100%; height:100%;}
.mct04 .form_wrap {margin: 0 auto; max-width: 760px; width: 100%; background-color: #fff; border-radius: 15px; padding: 30px; box-shadow: 5px 9px 24px 0px rgba(0, 0, 0, 0.13);}
.mct04 .form_wrap .flex_bx {justify-content: space-between;}
.mct04 .form_wrap .w50 {width: 49.28572%;}
.mct04 .form_wrap .w100 {width: 100%;}
.mct04 .form_wrap .email_h {height: 10%;}
.mct04 .form_wrap .input_wrap {position: relative; margin-bottom: 10px;}
.mct04 .form_wrap .input_wrap label {position: absolute; top: 50%; left:20px; font-size: 1em; line-height: 1.25; transform: translateY(-50%); cursor: text; color: #808080;}
.mct04 .form_wrap .input_wrap label sup {color:#c70b18}
.mct04 .form_wrap .input_wrap input {width: 100%; height: 100%; background-color: #f8f8f8; border: none; font-size: 1em; line-height: 1.25; padding: 20px;}
.mct04 .form_wrap .input_wrap label.off {display: none;}

.mct04 .form_wrap .input_wrap .form-select {width:100%; background-color: #f8f8f8; border: none; font-size: 1em; line-height: 1.25; padding: 20px}

.mct04 .form_wrap .txt_wrap {height: 170px;}
.mct04 .form_wrap .txt_wrap textarea {width: 100%; height: 100%; background-color: #f8f8f8; border: none; font-size: 1em; line-height: 1.25; padding: 20px; color: #808080;}
.mct04 .form_wrap .txt_wrap textarea::-webkit-input-placeholder {color: #808080;}
.mct04 .form_wrap .txt_wrap textarea:-ms-input-placeholder {color: #808080;}
.mct04 .form_wrap input[type="submit"] {background-color: #151d30; border: none; border-radius: 10px; color: #fff; font-size: 1.125em; font-weight: 500; height: 60px; margin-top: 10px;}
.mct04 .form_wrap input[type="button"] {background-color: #151d30; border: none; border-radius: 10px; color: #fff; font-size: 1.125em; font-weight: 500; height: 60px; margin-top: 10px;}
.mct04 .mct04-head {margin: 0;}


.asbutton {
    position: relative;
    padding: 8px 16px;
    background: #151d30;
    color: #fff;
    font-size: 1.125em;
    font-weight: 500;
    height: 60px;
    margin-top: 10px;
    border: none;
    outline: none;
    border-radius: 10px;
    cursor: pointer;
    
  }
  
  .asbutton:active {
    background: #151d30;
    
  }
  
  .asbutton__text {
    font: bold 20px "Quicksand", san-serif;
    color: #ffffff;
    transition: all 0.2s;
  }
  
  .asbutton--loading .asbutton__text {
    visibility: hidden;
    opacity: 0;
  }
  
  .asbutton--loading::after {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border: 4px solid transparent;
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: button-loading-spinner 1s ease infinite;
  }
  
  @keyframes button-loading-spinner {
    from {
      transform: rotate(0turn);
    }
    to {
      transform: rotate(1turn);
    }
  }