#main1{padding-top: 7rem;}

.main-visual{position: relative; height: 70vh; min-height: 100%;overflow: hidden; border:0px solid #ddd}

.mb{display:none}
.menu-mb {display: none !important;}
.main-visual-txt-inner {
  position: absolute;
}
.main-visual-txt-inner {
  width: 50%;
  box-sizing: border-box;
  margin-bottom: 5rem;
}

.main-visual-img-inner {
    position: relative;
    width: 50%;
}

.main-visual-img-inner .visual-logo {   
    animation-name: jaehee;
    animation-duration:1s;
    -webkit-animation-fill-mode:both;
    width:80%;
}

@-webkit-keyframes jaehee {
    0% {
      opacity: 0;      
      transform: translateY(0) translateX(0);
    }
   
    100% {
      opacity: 1;        
      transform: translateY(100px) translateX(-100px);
    }

  }

.main-visual-img-inner  .visual-img{
  animation-name: hee;
  animation-duration:1s;
  width:80%;
  -webkit-animation-fill-mode:both;
}

@-webkit-keyframes hee {
  0% {
    opacity: 0;     
    transition: all 4s; 
    transform: translateY(220px) translateX(280px);
  }
 
  100% {
    opacity: 1; 
    transition: all 6s;        
    transform: translateY(120px) translateX(230px);
  }

}




.main-visual-img-inner span {
    position: absolute;
    display: block;
    width: 100%;
    max-height: 100%;
    top: 0%;
    left: 100%;
}

/*.main-visual-img-inner .visual-img {
    transform: translate(-38%, 5%);
    opacity: 1;
    transition: all 1s 0.5s;
}*/


.main-visual-txt1{animation-delay: 0.4s; position: absolute; top:120px;
   animation-name: rndt;
  animation-duration:1s;
  -webkit-animation-fill-mode:both; }

.word{font-size:6rem; font-weight: 700; color:#2e3c75;}
.word1{font-size:6rem; font-weight: 700; color:#404040;}

.word-t{font-size:3.6rem; font-weight: 600; }
.word-t1{font-size:3rem; }
.main_blank{padding:20px 0px;font-size:0px}

@-webkit-keyframes rndt {
  0% {
    opacity: 0;     
    transition: all 2s; 
    transform: translateY(50px) translateX(0px);
  }
 
  100% {
    opacity: 1; 
    transition: all 3s;        
    transform: translateY(0px) translateX(0px);
  }

}


/**/

.section-container,
.section {
    position: relative;
    text-align: center;
    color: inherit;
}

.section-container .section {
    height: 50vh;
}


.section-container .section h2>span:first-child { 
    font-family: "GmarketSans", "notokr", "맑은 고딕", serif;
    font-size: 1.6em;
    color: #2D306B;
    font-weight: 600;
    position: relative;
}

.section-container .section h2>span:first-child::before {
    content: "";
    display: block;
    width: 23px;
    height: 23px;
    border-radius: 100px;
    position: absolute;
    top: -10px;
    opacity: 0;
    right: 10px;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#5d8dff+0,1c35d9+100 */
    background: rgb(93, 141, 255);
    /* Old browsers */
    background: -moz-linear-gradient(-45deg, rgba(93, 141, 255, 1) 0%, rgba(28, 53, 217, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, rgba(93, 141, 255, 1) 0%, rgba(28, 53, 217, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, rgba(93, 141, 255, 1) 0%, rgba(28, 53, 217, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5d8dff', endColorstr='#1c35d9', GradientType=1);
    /* IE6-9 fallback on horizontal gradient */
}

.section-container .section.active h2>span:first-child::before {
    animation: showRight 1s ease-in-out 1;
    animation-fill-mode: forwards;
}

.section-container .section h2>span:nth-child(2) {
    display: block;
    font-size: 1.2em;
    color: #232327;
    line-height: 1.524em;
    margin-top: 15px;
}

.section-container .section h2.left {
    text-align: left;
    float: left;
}


.section-container .section {
    display: flex;
    align-items: center;
    justify-content: center;
}

.m-gagudt{text-align: left;background: url(../img/main_car_v.png)no-repeat 100% 0%; background-size: 220px 150px; width: 100%;height: 157px;}
.m-gagudt .tit1{font-size:2.4rem; color:#c4996c; font-weight: 600; line-height: 1.8;}
.m-gagudt .tit2{font-size:2.4rem; color:#2e3c75; font-weight: 600; line-height: 1.8;}


.box-wrap .box,
.owl-carousel .item,
.owl-carousel .item .box {
    width: 100%;
}

.box {
    background-color: #fff;
    border-radius: 24px;
    box-shadow: 10px 10px 50px rgba(0, 0, 0, .06);
    padding: 36px 30px 72px;
    position: relative;
    text-align: left;
    height: 100%;
    transition: all .25s;
}

.box * {
    transition: all .15s;
}

.box .tit {
    font-size: 1.2em;
    font-weight: 600;
    margin-top: 11px;
    word-break: normal;
}

.box .btn-wrap {
    position: absolute;
    top: 36px;
    right: 30px;
}

.box .btn-wrap button {
    margin-left: 8px;
    justify-content: center;
}

.box .border-span {
    font-size: .867em;
    color: #2D36A2;
    padding: .2em 1em;
    border-radius: 100px;
    background-color: #E5E7F9;
    border: 1px solid transparent;
}

.box .img_view{text-align: right; vertical-align: top;}
.step-txt{color:#3e4b7f; padding:20px 0; font-size:22px; font-weight: 600;}
.step-txt1{color:#333; padding:20px 0; font-size:16px; font-weight: 600; line-height: 1.8;}

.box .date {
    position: absolute;
    bottom: 36px;
    left: 30px;
    color: #767D87;
}

.box:hover {
    background-color: #1935a5;
    box-shadow: none;
}

.box:hover * {
    color: #fff !important;
    border-color: rgba(255, 255, 255, .5) !important;
    background-color: transparent !important;
}

.box:hover .btn-download img,
.box:hover .btn-download embed {
    filter: invert(100%) sepia(100%) saturate(1%) hue-rotate(345deg) brightness(102%) contrast(101%);
}

.box:hover .btn-download:hover {
    border-color: rgba(255, 255, 255, .75) !important;
}

.box:hover .date {
    opacity: .63;
}

.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    /* 라인수 */
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}

.line-2-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* 라인수 */
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}

.line-3-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    /* 라인수 */
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}

.line-4-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    /* 라인수 */
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}

.line-5-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    /* 라인수 */
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}


.section-container .section.carousel {
    justify-content: flex-start;
}

.section-container .section.carousel .tit-wrap {
    white-space: nowrap;
    z-index: 1;
    padding: 48px 80px 0 115px;
    height: 100%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+90,ffffff+100&1+90,0+100 */
    background: -moz-linear-gradient(left, rgba(255, 255, 255, 1) 85%, rgba(255, 255, 255, 0) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 1) 85%, rgba(255, 255, 255, 0) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(255, 255, 255, 1) 85%, rgba(255, 255, 255, 0) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=1);
    /* IE6-9 */
}

.section-container .section.carousel.business-value .tit-wrap {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f4f5fc+80,f4f5fc+100&1+80,0+100 */
    background: -moz-linear-gradient(left, rgba(244, 245, 252, 1) 85%, rgba(244, 245, 252, 0) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(244, 245, 252, 1) 85%, rgba(244, 245, 252, 0) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(244, 245, 252, 1) 85%, rgba(244, 245, 252, 0) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f5fc', endColorstr='#00f4f5fc', GradientType=1);
    /* IE6-9 */
}

.section-container .section h2.left .tit-wrap * {
    flex: 1 1 100%;
}

.section-container .section h2.left hr {
    display: block;
    opacity: 0;
    margin: 0;
}

.section-container .section.carousel h2.left {
    float: none;
}

.section-container .section.carousel .owl-carousel {
    margin-top: 48px;
    height: 360px;
    position: relative;
}

.section-container .section.carousel .owl-carousel::before {
    content: attr(data-comment);
    display: inline-block;
    background-color: rgba(0, 0, 0, .4);
    color: #fff;
    border-radius: 100px;
    font-size: .867em;
    height: 2.4em;
    line-height: 2.4em;
    padding: 0 1.5em;
    position: absolute;
    bottom: -4em;
    left: 12.5%;
    z-index: 4;
    opacity: 0;
}

.section-container .section.carousel.active .owl-carousel::before {
    animation: blinkAndHide 4s ease-in-out 1;
    animation-fill-mode: forwards;
}

.section-container .section.carousel .owl-stage-outer,
.section-container .section.carousel .owl-stage,
.section-container .section.carousel .owl-item,
.section-container .section.carousel .box {
    height: 100%;
}

.section-container .section.carousel .owl-stage {
    display: flex;
}

.section-container .section.carousel .owl-item {
    width: 300px !important;
    display: inline-flex;
    align-items: center;
}

.section-container .section.carousel .item {
    height: 100%;
}

.section-container .section.carousel .box {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 36px 30px;
    cursor: pointer;
}

.section-container .section.carousel .box .tit {
    margin-top: 0;
}

.section-container .section.carousel .box a:hover {
    text-decoration: underline;
}

.section-container .section.carousel .box:hover {
    transform: scale(1.16);
}

.section-container .section.carousel .box .go {
    margin-top: 1.467em;
}

.section-container .section.carousel .box .go .ico {
    vertical-align: top;
    margin-left: .5em;
    margin-top: .22em;
}

.section-container .section.carousel .box:hover .go {
    opacity: .79;
}

.section-container .section.carousel .box:hover .go img {
    filter: invert(98%) sepia(100%) saturate(0%) hue-rotate(235deg) brightness(180%) contrast(103%) !important;
}

.section-container .section.carousel .owl-item+.owl-item.active {}




/*퀵메뉴*/
.quickmenu {position:absolute;width:100px;top:70%;margin-top:-50px;right:6%;}
.quickmenu ul {position:relative;float:left;width:100%;display:inline-block;}
.quickmenu ul li {float:left;width:100%;border:1px solid #ddd;text-align:center;display:inline-block; margin-bottom:5px; border-radius: 8px; background: #fff; box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;}
.quickmenu ul li a {position:relative;float:left;width:100%;height:30px;line-height:30px;text-align:center;color:#999;font-size:9.5pt;}
.quickmenu ul li a:hover {color:#000;}


.content {position:relative;min-height:1000px;}



/**/
.m-pd100{padding-top:100px}
.dt_way{position: relative; background: url(../img/dt_way_bg.jpg) no-repeat center; height:479px ;}

.dt_way_icon1{position: absolute; top:38px; left:310px}
.box1{width:70px; height: 70px; background: #d0cece ; border-radius: 8px; box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; }
.box1 img{padding: 10px;opacity: 0.9;}
.dt_way_txt{line-height: 1.8;}
.dt_way_txt1{line-height: 1.8; padding-left:10px}

.box2{width:70px; height: 70px; background: #d0cece; margin-left: 12px;  border-radius: 8px; box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;}
.box2 img{padding: 10px;opacity: 0.9;}

.dt_way_icon2{position: absolute; top:38px; left:510px}
.dt_way_icon3{position: absolute; top:38px; left:710px}
.dt_way_icon4{position: absolute; top:38px; left:910px}

.dt_way_icon5{position: absolute; top:154px; left:910px}
.dt_way_icon6{position: absolute; top:154px; left:710px}
.dt_way_icon7{position: absolute; top:154px; left:510px}
.dt_way_icon8{position: absolute; top:154px; left:310px}

.dt_way_icon9{position: absolute; top:270px; left:310px}
.dt_way_icon10{position: absolute; top:270px; left:510px}
.dt_way_icon11{position: absolute; top:270px; left:710px}
.dt_way_icon12{position: absolute; top:270px; left:910px}

.dt_way_box{position: absolute; top:395px;left:310px; width:54%; background:#e46b18; padding:10px 20px;  }
.dt_way_box p{font-size:24px; color:#fff; font-weight: 600;}

.dt_way_part1{width:100%; position: relative; padding-top:50px; text-align: center; padding-bottom: 40px;}

.dt-txt1{font-family:Cafe24Oneprettynight; font-size: 26px; font-weight: 600; line-height: 1.8; }


/**/
.set-step-area{width:100%; background: #233f8f; padding:40px 0; color:#fff}
.center-txt1{font-family:GangwonEduPowerExtraBoldA; font-size:32px; width:23%}

.center-naiyo{width:100%; position: relative; padding-top:30px}
.center-naiyo ul{margin-bottom:20px}
.center-naiyo li{display: inline-block;}
.center-box{width:16%; background: #fff; padding:10px; color:#000; text-align: center;font-size:18px; font-weight:600 ;  border-radius: 8px; box-shadow: rgba(255, 255, 255, 0.3) 0px 1px 2px 0px, rgba(255, 255, 255, 0.15) 0px 1px 3px 1px;}
.center-line{width:12%; text-align: center;}
.center-t{font-size:18px; }



/**/
.weare_area{width:100%; background: #000; padding:40px 0 0; color:#fff}
.weare-txt{color:#ebdbc8; font-size:40px; font-weight: 600; line-height: 1.4; }
.weare-txt1{color:#fff; font-size:24px; font-weight: 500; line-height: 1.6; }
.weare-txt2{color:#fff; font-size:24px; font-weight: 500; line-height: 1.6; padding-top:30px; padding-bottom:30px }

.weare_area2{width:100%; background: #000; padding:40px 0 0; color:#fff;  }





/**/
.inner.goto {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 40px;
}
#re_0103 .inner.goto .tit_text {
    padding-bottom: 0;
}

.tit_text {
    padding-bottom: 40px;
    font-size: 40px;
    font-weight: 700;
    color: #27211f;
    padding-left:120px;
}

.inner { position: relative; max-width: 1800px; margin: auto; height: 100%; }
.service_container { padding: 150px 0 50px; overflow: hidden; }
.service_container .move_box_container { position: relative; width: 100%; height: 13vw; margin-bottom: 1.5vw; }
.service_container .move_box_container .move_box { display: flex; width: 100%; position: absolute; top: 0; right: 0; margin-right: 30px; }
.service_container .move_box_container1 .move_box { justify-content: flex-end; }
.service_container .move_box_container2 .move_box { justify-content: flex-start; }
.service_container .move_box_container .service_box_wrap { display: flex; width: auto; justify-content: center; }
.service_container .move_box_container .service_box_wrap a { margin-right: 1.5vw; }
.service_container .move_box_container1 .service_box_wrap:last-of-type { padding-right: 30px; }
.service_container .move_box_container2 .service_box_wrap:first-of-type { padding-left: 30px; }
.service_container .move_box_container .service_box_wrap .service_tag { position: absolute; width: 100%; left: 50%; bottom: 30px; transform: translateX(-50%); font-size: 0.8vw; font-weight: 700; text-align: center; }
.service_container .move_box_container .service_box_wrap .service_tag.bw { color: #a87e6e; }
.service_container .move_box_container .service_box_wrap .service_tag.wh { color: #fff; }
.service_container .move_box_container .service_box_wrap .service_tag.bl { color: #000; }
.service_container .service_box { position: relative; display: block; width: 13vw; height: 13vw; background-color: #f4efec; border-radius: 1.5vw; overflow: hidden; transition: all 0.3s; }
.service_container .service_box img { width: 100%; height: 100%; object-fit: cover; }

.service_container .service_box video { position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); }
.service_container .service_box video.wide { width: 120%; height: 120%; }
/*.service_container .service_box video.small { position: absolute; left: 50%; top: 50%; width: 80%; height: 100%; transform: translate(-50%, -50%); }*/



.service_container .service_box.bw { background-color: #591eb8; }
.service_container .service_box.video_bw { background-color: #cfc8c7; }
.service_container .service_box.pk { background-color: #b8b7f7; }
.service_container .service_box.video_pk { background-color: #cfb58e; }
.service_container .service_box.video_pk2 { background-color: #d1a38d; }
.service_container .service_box.gr { background-color: #dbcac0; }

@media screen and (min-width: 1024px) {
.service_container .service_box:hover { transform: translateY(-10px); box-shadow: 10px 10px 20px rgba(0,0,0,0.1); }
.section-container .section h2>span:first-child {font-size:1.8em !important;}
.mb-join li {display: inline-block;width: 49.6%;padding: 10px;background: #293390;color: #fff;text-align: center;}
}

@media only screen and (max-width:1900px){
.service_container { padding: 60px 0 ; }

}

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

.service_container { padding: 120px 0; }

}

@media screen and (max-width: 768px) {
.service_container { padding: 60px 0; padding-bottom: 30%; }
.service_container .move_box_container { height: 40vw; margin-bottom: 3vw; }
.service_container .move_box_container .move_box { margin-right: 10px; }
.service_container .move_box_container .service_box_wrap { margin-right: 10px; }
.service_container .service_box { width: 40vw; height: 40vw; border-radius: 3.5vw; }
.service_container .move_box_container .service_box_wrap .service_tag { bottom: 15px; width: 90%; margin: auto; font-size: 13px; text-align: center; }

.mb-join li {display: inline-block;width: 49.6%;padding: 10px;background: #293390;color: #fff;text-align: center;}
}



/**/

.main_join{width:100%; position: relative; background:#f8f0eb ;}
.mpd20{padding:45px 0}
.mjoin-txt{font-size:32px; font-weight: 600; background: url(../img/mjoin-icon.png)no-repeat 60% 100%; height:54px;}
.mjoin-inner{width:1000px; margin:0 auto; position: relative;display: table;}
.mjoin-part1{width:100%; position: relative; padding-top:30px}
.mjoin-part1 p{vertical-align: middle; line-height: 3; font-size:14px}
.mjoin-part1-txt{background: #c4996c; color:#fff; font-size:16px; font-weight: 600; padding:6px 2px }

.mjoin-round1{width:100%; position: relative; padding-top:30px}
.mjoin-round2{width:100%; position: relative; padding-top:30px}
.mjoin-round3{width:100%; position: relative; padding-top:30px; clear: both;}

.round-box{border-radius: 20px; border:2px solid #000; padding:6px 20px; background:#fff ; font-size:18px; width:52%; font-weight: 600; text-align: center;} 
.round-box2{border-radius: 20px; border:2px solid #000; padding:6px 20px; background:#fff ; font-size:18px; width:62%; font-weight: 600; text-align: center; float: right; display: block;} 





.balloon{position: absolute; top:0px; left:20px}
.balloon1 {
    position: relative;
    width: 90px;
    height: 32px;
    left: 0px;
    bottom: 2px;
    background: #d54646;
    color: white;
    border-radius: 10px;
    padding: 3px 14px;
    border: 2px solid #fff;
    font-size: 16px;
    font-weight: 600;
}


.balloon1:after {
    border-top: 14px solid #d54646;
    border-left: 4px solid transparent;
    border-right: 9px solid transparent;
    border-bottom: 0px solid transparent;
    content: "";
    position: absolute;
    top: 26px;
    left: 19px;
}

.balloon2box{position: absolute; top:0px; left:84%}
.balloon2 {
    position: relative;
    width: 90px;
    height: 32px;
    left: 0px;
    bottom: 2px;
    background: #d54646;
    color: white;
    border-radius: 10px;
    padding: 3px 14px;
    border: 2px solid #fff;
    font-size: 16px;
    font-weight: 600;
}

.balloon2 {
    position: relative;
    width: 68px;
    height: 32px;
    left: 100%;
    bottom: 2px;
    background: #3abfc4;
    color: white;
    border-radius: 10px;
    padding: 3px 14px;
    border: 2px solid #fff;
    font-size: 16px;
    font-weight: 600;
}


.balloon2:after {
    border-top: 14px solid #3abfc4;
    border-left: 4px solid transparent;
    border-right: 9px solid transparent;
    border-bottom: 0px solid transparent;
    content: "";
    position: absolute;
    top: 26px;
    left: 19px;
}




.balloon3 {
    position: relative;
    width: 90px;
    height: 32px;
    left: 0px;
    bottom: 2px;
    background: #2a2525;
    color: white;
    border-radius: 10px;
    padding: 3px 14px;
    border: 2px solid #fff;
    font-size: 16px;
    font-weight: 600;
}


.balloon3:after {
    border-top: 14px solid #2a2525;
    border-left: 4px solid transparent;
    border-right: 9px solid transparent;
    border-bottom: 0px solid transparent;
    content: "";
    position: absolute;
    top: 26px;
    left: 19px;
}

.mbtn-area{width:100%; text-align: center; padding:20px 0; clear: both; padding-top:30px}

.join-btn{border:2px solid #333; border-radius: 4px; color:#2e3c75 ; padding:4px 20px; font-size:18px; font-weight: 600; width:140px; margin-right:10px}
.join-btn:hover{background:#ddd; color:#000 ;}
.join-btn1{border:2px solid #333; border-radius: 4px; color:#fff ; padding:4px 20px; font-size:18px; font-weight: 600; width:140px; background:#2e3c75 ;}
.join-btn1:hover{background: #6b7ecd; color:#fffce5}



/**/
.new-product{width:100%; position: relative; margin-top:60px}
.prodcut-t{font-size:24px; margin-bottom:20px }

.product-list{padding-left:0.5%}
.product-list li{width:31%; margin-right: 1.8%; display: inline-block; vertical-align: top; padding-bottom:20px}
.product-list li:last-child {margin-right: 0px;}




@media (min-width: 360px) and (max-width: 430px) {
.main-visual-txt-inner {width: 100%;}
.main-visual-txt1 {top:20px}

.word {font-size: 3rem;}	
.word1{font-size: 3rem;}
.word-t{font-size: 2.6rem;}
.word-t1{font-size: 2rem;}



.main-visual-img-inner{width:70%}

.main-visual-img-inner .visual-logo {   
    animation-name: jaehee;
    animation-duration:1s;
    -webkit-animation-fill-mode:both;
    width:45%;
}


.main-visual-img-inner  .visual-img{
  animation-name: hee;
  animation-duration:1s;
  width:80%;
  -webkit-animation-fill-mode:both;
}

@-webkit-keyframes hee {
  0% {
    opacity: 0;     
    transition: all 4s; 
    transform: translateY(220px) translateX(280px);
  }
 
  100% {
    opacity: 1; 
    transition: all 6s;        
    transform: translateY(120px) translateX(230px);
  }

}

.main-visual-img-inner .visual-logo{top:-50px; left:110%}
.main-visual-img-inner .visual-img {width:60%; left:-30px; top:-50px}
.main-visual{height:42vh}
.section-container .section h2>span:first-child{font-size:16px}
.section-container .section h2>span:nth-child(2){font-size:15px; font-weight:600 }
.section-container .section.carousel .tit-wrap{padding:10px 0 0 10px}
.section-container .section.carousel .owl-carousel{display: none}
.section-container .section.carousel h2.left{font-size:14px}

.m-pd100{padding-top: 50px;}	
.box1{width:50px; height:50px}
.box2{width:50px; height:50px; margin-left:0px}
.dt_way_txt{font-size:12px}
.dt_way_txt1{font-size:12px; padding-left:0px}
.dt_way_icon1{left:0px}
.dt_way{width:100%}
.dt_way_icon2{left:26%}
.dt_way_icon3{left:54%}
.dt_way_icon4{left:78%}

.dt_way_icon5{left:0%}
.dt_way_icon6{left:26%}
.dt_way_icon7{left:54%}
.dt_way_icon8{left:78%}

.dt_way_icon9{left:0%}
.dt_way_icon10{left:26%}
.dt_way_icon11{left:54%}
.dt_way_icon12{left:78%}
.dt_way_box{width:100%; left:0px}

.dt_way_part1{padding-top:10px; }
.dt-txt1{font-size:15px}
.center-txt1{font-size:21px; width:100%}
.center-naiyo li {vertical-align: top}
.center-box{width:21%; font-size: 12px}
.center-line{width:4%}
.center-t {font-size: 13px; width: 72%;}

.weare-txt{font-size: 22px}
.weare-txt1{font-size: 16px}
.tit_text{width:100%; font-size:30px; padding-left:0px}
.mjoin-txt {font-size: 15px; background: url(../img/mjoin-icon.png)no-repeat 94% 0%;background-size: 70px;}

.mjoin-inner{width:100%; padding:0 10px}
.mjoin-part1 p{line-height: 2.2}

.round-box{font-size:15px}
.round-box2{font-size:15px}
.balloon2box{left:60%}
.join-btn{font-size:13px}
.join-btn1{font-size:13px}
.product-list li{width:30%}

} 



@media (min-width: 760px) and (max-width: 1024px) {
.main-visual{height:44vh}	
.main-visual-txt1{top:56px}	
.main-visual-img-inner .visual-logo{left:100%}
.main-visual-img-inner .visual-img{left:70%}
.section-container .section h2>span:first-child{font-size:1.3em}
.section-container .section.carousel .owl-carousel{display: none}
.section-container .section.carousel .tit-wrap {padding: 48px 80px 0 180px;}


.mpd20{padding:45px 20px}
.mjoin-txt{font-size:26px}
.balloon1{width:78px; border-radius: 8px}
.round-box{font-size:13px}
.round-box2 {font-size:13px}
.balloon2box{left:80%} 

.dt_way_icon1 {top: 35px;left: 130px;}
.dt_way_icon2 {top: 35px;left: 320px;}
.dt_way_icon3 {top: 35px;left: 500px;}
.dt_way_icon4 {top: 35px;left: 680px;}
.dt_way_icon5 {top: 152px;left:682px;}
.dt_way_icon6 {top: 152px;left:500px;}
.dt_way_icon7 {top: 152px;left:320px;}
.dt_way_icon8 {top: 152px;left:128px;}

.dt_way_icon9 {top: 264px;left:696px;}
.dt_way_icon10 {top: 264px;left:502px;}
.dt_way_icon11 {top: 264px;left:320px;}
.dt_way_icon12 {top: 264px;left:118px;}
.dt_way_box{left:226px}
.m-pd100 {padding-top:0px}

}


@media (min-width: 760px) and (max-width: 820px) {

.m-pd100 {padding-top: 0px;}
.dt_way{background-size: 110%}
.dt_way_icon1 {top: 64px;left: 80px;}
.box1{width:60px; height:60px}
.box2{width:60px; height:60px; margin-left:23px}
.dt_way_icon2 {top: 64px;left: 239px;}
.dt_way_icon3 {top: 64px;left: 400px;}
.dt_way_icon4 {top: 64px;left: 542px;}
.dt_way_icon5 {top: 164px;left:546px;}
.dt_way_icon6 {top: 164px;left:400px;}
.dt_way_icon7 {top: 164px;left:239px;}
.dt_way_icon8 {top: 164px;left:81px;}

.dt_way_icon9 {top: 264px;left:572px;}
.dt_way_icon10 {top: 264px;left:402px;}
.dt_way_icon11 {top: 264px;left:242px;}
.dt_way_icon12 {top: 264px;left:58px;}



.dt_way_txt1{padding-left:21px}
.dt_way_box{top:360px; left:170px; width:54%}
.tit_text{font-size:28px; padding-left:40px; padding-bottom:20px}
.service_container .move_box_container{height: 30vw; margin-bottom: 3vw}
.service_container .service_box{width:30vw; height:30vw }
.service_container{padding:30px 0; padding-bottom:10%}

.mjoin-inner{width:740px}	
	
	
}