body{ overflow-x: hidden !important; font-size: 0; }
body{ background-color: #000000; overflow-x: hidden; }
.inner{width: 1400px; margin: 0 auto; }


#intro{ width: 100%;height: 100%;position: fixed;z-index: 9999999; background: #000000 !important;overflow: hidden;transition: 0.5s;opacity: 1}
#intro.remove{opacity: 0}
#intro.hidden{display: none}
#intro ul{width: 108px;height: 108px;position: absolute;top: 50%;left: 50%;margin-top: -54px;margin-left: -54px;transform: rotate(45deg); animation: rotate 1s;animation-delay: 0.7s;animation-fill-mode: forwards;z-index: 2}
#intro ul li{width: 108px;height: 108px;background: rgba(255,255,255,0.0);position: absolute;top: 50%;left: 50%;margin-top: -54px;margin-left: -54px;}
#intro ul li > div{position: relative;width: 100%;height: 100%}
#intro ul li > div > div {position: relative;width: 100%;height: 100%;}
#intro ul li > div i{position: absolute;width: 32px;height: 32px;display: block;}
#intro ul li > div i span{display: block;width: 100%;height: 100%;background: #fff;display: block;border-radius: 50%;;}
#intro ul li{}
#intro ul li:nth-child(1) > div{transform: rotate(-90deg);animation: circle3 0.5s;animation-delay: 0.5s;animation-fill-mode: forwards;}
#intro ul li:nth-child(3) > div{transform: rotate(-90deg);animation: circle3 0.5s;animation-delay: 0.5s;animation-fill-mode: forwards;}
#intro ul li:nth-child(1) > div i{left: 0;top: 0}
#intro ul li:nth-child(2) > div i{right: 0;top: 0}
#intro ul li:nth-child(3) > div i{right: 0;bottom: 0}
#intro ul li:nth-child(4) > div i{left: 0;bottom: 0}
#intro ul li i{transform: scale(1.3);animation: circle4 0.5s;animation-delay: 0.5s;animation-fill-mode: forwards;}

#intro ul li:nth-child(1){animation: circle1 0.4s; animation-delay: 0.3s;transform: translate(38px,-38px);animation-fill-mode: forwards;}
#intro ul li:nth-child(2){animation: circle2 0.4s; animation-delay: 0.3s;transform: translate(-38px,38px);animation-fill-mode: forwards;}
#intro ul li:nth-child(3){animation: circle2 0.4s; animation-delay: 0.3s;transform: translate(-38px,38px);animation-fill-mode: forwards;}
#intro ul li:nth-child(4){animation: circle1 0.4s; animation-delay: 0.3s;transform: translate(38px,-38px);animation-fill-mode: forwards;}

#intro ul li:nth-child(1) > div > div{animation: circle4_bak 0.6s; animation-delay: 1.6s;transform: translate(0,-0);animation-fill-mode: forwards;}
#intro ul li:nth-child(2) > div > div{animation: circle2_bak 0.6s; animation-delay: 1.6s;transform: translate(-0,0);animation-fill-mode: forwards;}
#intro ul li:nth-child(3) > div > div{animation: circle3_bak 0.6s; animation-delay: 1.6s;transform: translate(-0,0);animation-fill-mode: forwards;}
#intro ul li:nth-child(4) > div > div{animation: circle1_bak 0.6s; animation-delay: 1.6s;transform: translate(0,-0);animation-fill-mode: forwards;}
#intro ul li:nth-child(4) i span{animation: scale2 1.4s; animation-delay: 2.2s;animation-fill-mode: forwards;}

#intro .in_logo {position: absolute;top: 50%;left: 50%;transform: translate(-52%, -50%);animation: zin  0.1s;z-index: 0;animation-delay: 1.9s;animation-fill-mode: forwards;}
#intro .in_logo img{ height: 110px; }

@keyframes circle1 {
  0%{transform: translate(38px,-38px);}
  100%{transform: translate(0,0);}
}
@keyframes circle2 {
  0%{transform: translate(-38px,38px);}
  100%{transform: translate(0,0);}
}

@keyframes circle1_bak {
  0%{transform: translate(0,0);}
  100%{transform: translate(38px,-38px);}
}
@keyframes circle2_bak {
  0%{transform: translate(0,0);;}
  100%{transform:  translate(-38px,38px);}
}
@keyframes circle3_bak {
  0%{transform: translate(0,0);;}
  100%{transform: translate(-38px,-38px);}
}
@keyframes circle4_bak {
  0%{transform: translate(0,0);;}
  100%{transform: translate(38px,38px);}
}
@keyframes circle3 {
  0%{transform: rotate(-90deg)}
  100%{transform: rotate(0);}
}
@keyframes circle4 {
  0%{transform: scale(1.3)}
  100%{transform: scale(1);}
}
@keyframes rotate {
  0%{transform: rotate(45deg)}
  100%{transform: rotate(180deg);}
}
@keyframes scale2 {
  0%{transform: scale(0)}
  100%{transform: scale(100);}
}
@keyframes zin {
  0%{z-index: 1}
  100%{z-index: 11;}
}

#cursor{
  z-index: 99;
  position: fixed;
  left: 0;
  top: 0;
  pointer-events: none;
  will-change: transform;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  transition: background 0.4s, width 0.4s, height 0.4s, transform .4s;
  mix-blend-mode : difference;
  transform: translate(-50%,-50%);
}

@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) {
    #cursor{ display: none; }
}}

@media not all and (min-resolution:.001dpcm) { @media {
  #cursor{ display: none; }
}}

#cursor.on{ width: 60px; height: 60px; }

#cursor .scroll{ position: absolute; width: 100%; height: 100%; left: 0; top: 0; display: flex; align-items: center;justify-content: center; opacity: 0; }
#cursor .scroll span{ display: block; width: 7px; height: 7px; background-color: #000; border-radius: 50%; left: 0; }
#cursor .scroll .sp01{ animation: sc2 1.6s infinite; transform: translateX(3px);}
#cursor .scroll .sp02{ margin-right: 0; animation: sc 1.6s infinite;  transform: translateX(-3.5px); }

#cursor.sc{ width: 80px; height:  80px; }
#cursor.sc .scroll{ opacity: 1; }

@keyframes sc {
  0%{
    transform: translateX(-3.5px);
  }
  50%{
    transform: translateX(3px);
  }
  100%{
    transform: translateX(-3.5px);
  }
}

@keyframes sc2 {
  0%{
    transform: translateX(3px);
  }
  50%{
    transform: translateX(-3.5px);
  }
  100%{
    transform: translateX(3px);
  }
}

/* 원스크롤 */



/*  */
#main.ac{ filter: blur(20px);}
#main .main_visual{ background: url('/img/main/main_dim.png') center top no-repeat; width: 100%; height: 100vh; position: relative; background-size: 100% 100%; }
#main .main_visual .tit em{ width: 100%;  display: block; text-align: center; font-size: 160px; color: rgba(146,146,146,0.14); font-weight: 700;  line-height: 1;
  opacity: 0; z-index: -10;
}

#main .main_visual{ width: 100%; position: relative; z-index: 10; height: 100vh; background: #000; }



.main_visual .main_slider .slide_box .main_img{ position: absolute;left: 0; top: 0; overflow: hidden; width: 100%; height: 100%;
-moz-transition: all 8s ;
-webkit-transition: all 8s;
-o-transition: all 8s;
-ms-transition: all 8s ;
transition: all 8s ;
}

.main_visual .main_slider .slide_box .main_img .videobcg{ display: block; min-height: 100vh; min-width: 100vw; object-fit: fill; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }


.main_visual .main_slider .slide_box .in_obj{text-align: left; position: absolute; top:45%; transform: translate(0,-50%); padding-top: 0;width: 1280px;left: 50%;margin-left: -640px; z-index: 999}
.main_visual .main_slider .slide_box .in_obj .wrap_t{margin-bottom: 25px;}


.main_visual .main_slider .slide_box div div.wrap_tit{display: block; opacity:0;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
-ms-transition: all 1s;
transition: all 1s;
transition-delay: 0.6s;}

.main_visual .main_slider .slide_box div.on div.wrap_tit{
    opacity: 1
}


.main_visual .main_slider .slide_box > div.on{ z-index: 5; opacity:1;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}


.main_visual .main_slider .slide_box .main_img:after{ content:""; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0;
background: rgb(0,0,0);
background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); z-index: 10;
}



#main .main_visual .tit{ position: relative; z-index: 11; }
#main .main_visual .tit strong{ display:block; font-size: 80px; margin-bottom: 50px; font-weight: 600; color: #fff; text-align: center; opacity: 0; z-index: 10; position: relative; }
#main .main_visual .tit{ position: absolute; left: 0; width: 100%; top: 50%; transform: translate(0,-50%);}
#main .main_visual .txt ul li{ font-size: 22px; font-weight: 400; color: #fff; line-height: 38px; text-align: center; }
#main .main_visual .txt{ }

/* #main .m_slide .mainSlider .swiper-slide{ opacity: 0; }
#main .m_slide .mainSlider .swiper-slide-active { opacity: 1; }
#main .m_slide .mainSlider .swiper-slide-active .tit em{ opacity: 1; }
#main .m_slide .mainSlider .swiper-slide-active .tit strong{ opacity: 1; }
#main .m_slide .mainSlider .swiper-slide-active .txt{ opacity: 1; } */

#main .main_visual .main_img{ position: relative; }

#main .main_visual .main_img #videobcg{ display: block; min-height: 100vh; min-width: 100vw; object-fit: fill; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);
  opacity: 1;
}

#main .m_tit{ text-align: center; margin-bottom: 70px; }
#main .m_tit strong{ display: block; font-size: 50px; font-weight: 600; color:#FFFFFF; }

#main .m_tit4 p{ transform: translateY(100%); transition: transform 1s; transition-delay: .3s; }
#main .on .m_tit4 p{  transform: translateY(0); }
#main .m_tit4{ overflow: hidden;}

#main .m_tit strong{ line-height: 1; transform: translateY(100%); transition: transform 1s; }
#main .on .m_tit strong{ transform: translateY(0); }
#main .m_tit{ overflow: hidden; }

#main .m_tit4{ margin: 0 auto; margin-top: 30px; margin-bottom: 50px; width: 60%; }
#main .m_tit4 strong{ display: block; font-size: 36px; font-weight: 500; color: #fff; text-align: center; margin-bottom: 20px; }
#main .m_tit4 p{ font-size: 24px; line-height: 36px; font-weight: 200; color: rgba(255,255,255,1); text-align: left; text-align: center; word-break: keep-all; }

#main .con02 .m_tit{ margin-bottom: 0; }

#main .main_visual .tit .wrap{ overflow: hidden;width: 150%; position: absolute; left: 50%; top: -80px; transform: translate(-50%,-0); z-index: -10; }
#main .main_visual .tit .wrap em{ transform: translate(0,100%); transition: transform 1s; }
#main .main_visual .swiper-slide-active .tit em{ transform: translate(0,0%); }

#main .main_visual .tit .wrap2{ overflow: hidden; }
#main .main_visual .tit strong{ transform: translate(0,50px); opacity: 0; transition: transform 1s, opacity 1s; line-height: 1; transition-delay: .2s; }
#main .main_visual .swiper-slide-active .tit strong{ transform: translate(0,0); opacity: 1; }

#main .main_visual .txt ul li{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; }
#main .main_visual .swiper-slide-active .txt ul li{ transform: translateY(0); opacity: 1; }
#main .main_visual .swiper-slide-active .txt ul li:nth-child(1){ transition-delay: .5s; }
#main .main_visual .swiper-slide-active .txt ul li:nth-child(2){ transition-delay: .7s; }
#main .main_visual .swiper-slide-active .txt ul li:nth-child(3){ transition-delay: .9s; }


#main .main_visual .control{ position: absolute; left: 0; width: 100%; bottom: 100px; text-align: center; z-index: 5; }
#main .main_visual .control .wrap{ display: inline-block; }
#main .main_visual .control .swiper-button-prev4{ position: static; float: left; width: 9px; height: 18px; background: url('/img/main/slide_prev.png') center center no-repeat; margin-top: 0; margin-right: 40px; }
#main .main_visual .control .swiper-button-next4{ position: static; float: left;  width: 9px; height: 18px; background: url('/img/main/slide_next.png') center center no-repeat; margin-top: 0; margin-left: 40px; }
#main .main_visual .control .swiper-pagination4{ position: static; float: left; margin-top: 5px; width: 137px; }
#main .main_visual .control .swiper-pagination4:after{ content:""; display: table; clear: both; }
#main .main_visual .control .swiper-pagination4 span{ float: left; display: block; border-radius: 10px; background-color: rgba(255,255,255,0.3); opacity: 1; margin-left: 14px; transition: width .6s; width: 8px; height: 8px; margin-right: 0 !important; }
#main .main_visual .control .swiper-pagination4 span:first-child{ margin-left: 0; }
#main .main_visual .control .swiper-pagination4 span.swiper-pagination-bullet-active{ width: 93px; position: relative; }
#main .main_visual .control .swiper-pagination4 span.swiper-pagination-bullet-active:after{ content:""; display: block; width: 0; height: 100%; background-color: #fff; border-radius: 10px; position: absolute; left: 0; top: 0;
  animation: slideon 7s linear; animation-fill-mode: forwards;
}
#main .main_visual .control .thum li.last{ display: none; }

@keyframes slideon {
  0%{
    width: 0;
  }
  100%{
    width: 100%;
  }
}

.fp-is-overflow .fp-overflow.fp-auto-height, .fp-is-overflow .fp-overflow.fp-auto-height-responsive, .fp-is-overflow>.fp-overflow{ overflow: visible !important; }



@keyframes txt1 {
  0%{
    left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-40deg);
  }
  100%{
    left: 27%; top: 12%; transform: translate(-50%,-50%) rotate(0);
    animation-timing-function: cubic-bezier(1,0,0.6,1.5);
  }
}

@keyframes txt2 {
  0%{
    left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-40deg);
  }
  100%{
    left: 18%; top: 52%; transform: translate(-50%,-50%) rotate(0);
    animation-timing-function: cubic-bezier(1,0,0.6,1.5);
  }
}

@keyframes txt3 {
  0%{
    left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-40deg);
  }
  100%{
    left: 32%; top: 82%; transform: translate(-50%,-50%) rotate(0);
    animation-timing-function: cubic-bezier(1,0,0.6,1.5);
  }
}

@keyframes txt4 {
  0%{
    left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(40deg);
  }
  100%{
    left: 73%; top: 12%; transform: translate(-50%,-50%) rotate(0);
    animation-timing-function: cubic-bezier(1,0,0.6,1.5);
  }
}

@keyframes txt6 {
  0%{
    left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(40deg);
  }
  100%{
    left: 70%; top: 82%; transform: translate(-50%,-50%) rotate(0);
    animation-timing-function: cubic-bezier(1,0,0.6,1.5);
  }
}

@keyframes txt5 {
  0%{
    left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(40deg);
  }
  100%{
    left: 85%; top: 50%; transform: translate(-50%,-50%) rotate(0);
    animation-timing-function: cubic-bezier(1,0,0.6,1.5);
  }
}

#main .fp-tableCell{ vertical-align: middle;display: flex;
    flex-direction: column;
    justify-content: center; }

#main .con_w{ padding-top: 62px; overflow: hidden; }
#main .con_w .fp-scrollable{ overflow: hidden; }
#main #con02{ }

#main #con01 { background: url('/img/main/con01_bgs.jpg') center center no-repeat; background-size: cover; }
#main #con01 .m_tit strong{ font-size: 50px; line-height: 1em; text-align: left; font-weight: 600; }
#main #con01 .m_tit{ margin-bottom: 30px; }
#main #con01 .m_tit2 { margin-bottom: 50px; overflow: hidden; width: 60%; max-width: 840px; }

#main #con01 .m_tit2 p{ font-size: 24px; line-height: 36px; font-weight: 200; color: rgba(255,255,255,1); text-align: left; word-break: keep-all; }
#main #con01 .n_pro .wrapss{ overflow: hidden;}
#main #con01 .n_pro .wrapss{ position: relative; }
#main #con01 .n_pro .wrapss strong{ display: block; font-size: 50px; font-weight: 600; color: #FFFFFF;  }
#main #con01 .n_pro .wrapss p{ position: absolute; right: 0; top: 50%; transform: translate(0,-50%); font-size: 20px; font-weight: 400; color: rgba(255,255,255,0.5); }
#main #con01 .n_pro > ul > li{ margin-top: 30px; }
#main #con01 .n_pro > ul > li{ float: left; width: 30%; margin-right: 5%; padding-bottom: 30px; border-bottom: 1px solid rgba(255,255,255,0.3);}
#main #con01 .n_pro > ul > li:nth-child(3n+0){ margin-right: 0; }
#main #con01 .n_pro > ul > li .icon{ margin-bottom: 20px; }
#main #con01 .n_pro > ul > li .txt > strong{ display: block; float: left; font-size: 24px; font-weight: 500; color: rgba(255,255,255,0.7); line-height: 38px; min-height: 76px; }
#main #con01 .n_pro > ul > li .txt .num{ float: right; overflow: hidden; height: 50px; }
#main #con01 .n_pro > ul > li .txt .num .wrap > strong{ font-size: 50px; line-height: 1em; color: #fff; font-weight:  600; display: block; float: right; }
#main #con01 .n_pro > ul > li .txt .num ul{ display: inline-block;  margin-left: -5px;  }
#main #con01 .n_pro > ul > li .txt .num ul > li{ line-height: 1em; font-size: 50px; font-weight: 600; color:#FFFFFF; text-align: center; }

#main #con01 .m_tit2 p{ transform: translateY(100%); transition: transform 1s; transition-delay: .3s; }
.fp-viewing-consulting #main #con01 .m_tit2 p{ transform: translateY(0); }

#main #con01 .m_tit2 p{ transform: translateY(100%); transition: transform 1s; transition-delay: .3s; }
.fp-viewing-consulting #main #con01 .m_tit2 p{ transform: translateY(0); }

#main #con01 .n_pro .wrapss > strong{ transform: translateY(100%); transition: transform 1s; transition-delay: .6s; }
.fp-viewing-consulting #main #con01 .n_pro .wrapss > strong{ transform: translateY(0); }



#main #con01 .n_pro > ul > li .num ul:nth-child(1){ transform: translateY(-90%); transition: transform 3s; }
.fp-viewing-consulting #main #con01 .n_pro > ul > li .num ul:nth-child(1){ transform: translateY(0);  }

#main #con01 .n_pro > ul > li .num ul:nth-child(2){ transform: translateY(-90%); transition: transform 3s; transition-delay: .5s; }
.fp-viewing-consulting #main #con01 .n_pro > ul > li .num ul:nth-child(2){ transform: translateY(0);  }

#main #con01 .n_pro > ul > li .num ul:nth-child(3){ transform: translateY(-90%); transition: transform 3s; transition-delay: 1s; }
.fp-viewing-consulting #main #con01 .n_pro > ul > li .num ul:nth-child(3){ transform: translateY(0);  }

#main #con01 .n_pro > ul > li .num ul:nth-child(4){ transform: translateY(-90%); transition: transform 3s; transition-delay: 1.5s; }
.fp-viewing-consulting #main #con01 .n_pro > ul > li .num ul:nth-child(4){ transform: translateY(0);  }


.fp-viewing-consulting #main #con01 .m_tit strong{ transform: translateY(0);transition-delay: .3s; }



#main #con02{ position: relative; z-index: 1; width: 100vw; height: 100vh;  }
#main #con02 .d_slide .swiper-slide{ width: 792px; height: auto; position: relative; display: flex; align-items: center; justify-content: center; box-sizing: border-box; opacity: .5; }
#main #con02 .d_slide .swiper-slide-active{ opacity: 1; }
#main #con02 .d_slide .swiper-wrapper{ height: auto; z-index: 102; }
#main #con02 .d_slide .swiper-slide .img_box{ position: relative; }
#main #con02 .d_slide .swiper-slide .img_box:after{ content:""; display: block; width: 100%; height: 100%; background-color: rgba(0,0,0,0.4); position: absolute; left: 0; top: 0; }
#main #con02 .d_slide .swiper-slide img{ display: block; width: 100%; box-shadow: 0px 0px 40px rgba(0,0,0,0.8);}
#main #con02 .d_slide .swiper-slide .txt{ position: absolute; text-align: center; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 70%; z-index: 1; }
#main #con02 .d_slide .swiper-slide .txt strong{ display: block; font-size: 32px; font-weight: 700; color: #fff; margin-bottom: 30px; }
#main #con02 .d_slide .swiper-slide .txt p{ font-size: 20px; line-height: 30px; color:rgba(255,255,255,1); font-weight: 500; word-break: break-all; text-align: left; }
#main #con02 .d_slide .swiper-slide .txt p br{ display: none !important; }
#main #con02 .d_slide .swiper-slide .txt p span{ display: none; }
#main #con02 .d_slide .swiper-slide .icon{ position: absolute; bottom: -35px; opacity: 0; transition: opacity .5s; z-index: 222}
#main #con02 .d_slide .swiper-slide .icon img{ box-shadow: 0px 0px 30px rgba(0,0,0,0.3); }
#main #con02 .d_slide .swiper-slide-active .icon{ opacity: 1; }

#main #con02 .swiper-pagination{ position: static; margin-top: 95px; }
#main #con02 .swiper-pagination .swiper-pagination-bullet{ background: #fff; }

#main #con02 .d_slide{ transform: scale(1.1); opacity: 0; transition: transform 1.4s, opacity 1.4s; transition-delay: .3s; position: relative; }
.fp-viewing-development #main #con02 .d_slide{ transform: scale(1); opacity: 1; }

#main #con02 .wrap{ width: 100%; }

#main #con02 .boxs{ position: absolute; left: 50%; top: 41%; transform: translate(-50%,-50%); width: 792px; height: auto; z-index: 300; }
#main #con02 .boxs .swiper-button-prev{ width: 60px; height: 60px; border-radius: 50%; background: url('/img/main/pslide_prev.png') center center no-repeat; background-color: rgba(23,23,23,1); left: -76px; top: 50%; margin-top: 0;
transform: translate(0,-50%); z-index: 200;
}
#main #con02 .boxs .swiper-button-next{ width: 60px; height: 60px; border-radius: 50%; background: url('/img/main/pslide_next.png') center center no-repeat; background-color: rgba(23,23,23,1); right: -76px; top: 50%; margin-top: 0;
transform: translate(0,-50%); z-index: 200;
}

.fp-viewing-development #main .con02 .m_tit strong{ transform: translateY(0); transition-delay: .3s; }
.fp-viewing-development #main .con02 .m_tit4 p{ transform: translateY(0); transition-delay: .3s; }

#main #con03 .m_tit{ margin-bottom: 0; }
#main #con03 .wrap{ width: 100%; }
#main #con03 .s_slide { max-width: 1920px; margin: 0 auto; padding: 60px 0; overflow: hidden; }
#main #con03 .s_slide .swiper-slide{ width: 370px; height: 500px; position: relative; display: flex; align-items: center; justify-content: center; box-sizing: border-box; opacity: .5; }
#main #con03 .m_tit4{ margin-bottom: 0; }

#main #con03 .s_slide .swiper-slide-active{ opacity: 1; transform: rotateY(0) !important;}
#main #con03 .s_slide .swiper-wrapper{ height: auto;  }
#main #con03 .s_slide .box{ background-color: #242424; width: 100%; height: 100%; padding-top: 40px; padding-left: 38px; padding-right: 38px; border-radius: 20px; }
#main #con03 .s_slide .box strong{ display: block;
  font-size: 24px; line-height: 34px; font-weight: 700;
  color: #fff;
}
#main #con03 .s_slide .box .p01{ margin-top: 15px; font-size: 20px; font-weight: 500; color:#FFFFFF; line-height: 30px; }
#main #con03 .s_slide .box .p02{ margin-top: 15px; font-size: 15px; line-height: 25px; font-weight: 400; color: rgba(255,255,255,0.7); }
#main #con03 .s_slide .box .p02 span{ display: none; }
#main #con03 .s_slide .box .p02 br{ display: none; }

#main #con03 .s_slide .swiper-slide-active .box strong{
  background: linear-gradient(45deg, #8ECAFF, #3471FF);
  color: transparent;
  -webkit-background-clip: text;
}


#main #con03 .swiper-pagination{ position: static; margin-top: 0; transform: translateY(60px);}
#main #con03 .swiper-pagination .swiper-pagination-bullet{ background: #fff; }


#main #con03 .s_slide .swiper-slide-next .box{ transform: translateX(-100%); transition: transform 1s; }
.fp-viewing-Services #main #con03 .s_slide .swiper-slide-next .box{ transform: translateX(0); transition: transform 1s; }

#main #con03 .s_slide .swiper-slide-prev .box{ transform: translateX(100%); transition: transform 1s; }
.fp-viewing-Services #main #con03 .s_slide .swiper-slide-prev .box{ transform: translateX(0); transition: transform 1s; }

#main #con03 .s_slide .last .box{  transform: translateX(1000%); transition: transform 1s, opacity 1s;}
.fp-viewing-Services #main #con03 .s_slide .last .box{ transform: translateX(0);  opacity: 1; }

#main #con03 .s_slide .swiper-slide-next+div .box{  transform: translateX(-1000%); transition: transform 1s, opacity 1s;  }
.fp-viewing-Services #main #con03 .s_slide .swiper-slide-next+div  .box{ transform: translateX(0); opacity: 1; }





#main #con03 .swiper-slide-shadow-right{ display: none; }
#main #con03 .swiper-slide-shadow-left{ display: none; }

#main #con03 .swiper-button-prev{ width: 60px; height: 60px; border-radius: 50%; background: url('/img/main/pslide_prev.png') center center no-repeat; background-color: rgba(23,23,23,1); left: -67px; top: 50%; margin-top: 0;
transform: translate(0,-50%); z-index: 10;
}
#main #con03 .swiper-button-next{ width: 60px; height: 60px; border-radius: 50%; background: url('/img/main/pslide_next.png') center center no-repeat; background-color: rgba(23,23,23,1); right: -67px; top: 50%; margin-top: 0;
transform: translate(0,-50%);  z-index: 10;
}
#main #con03 .swiper-slide-next{ left: 40px; }
#main #con03 .swiper-slide-prev{ left: -40px; }
#main #con03 .boxs{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 370px; z-index: 101; }


.fp-viewing-Services #main .con03 .m_tit strong{ transform: translateY(0); transition-delay: .3s; }
.fp-viewing-Services #main .con03 .m_tit4 p{ transform: translateY(0); transition-delay: .3s; }



#main #con04 .t_bg{ position: absolute; left: -200px; top: 15%; }
#main #con04 .tit2{ text-align: left;  }
#main #con04{ position: relative;  padding-top: 60px;  }
#main #con04 .inner .wraps{ position: relative; }
#main #con04 .tit2 .go_btn{ position: absolute; right: 0; top: 3px; transform: translate(0,0);}
#main #con04 .i_wrap{
  border-radius: 30px;
  background-color: #000;
  border: 1px solid #333;
  background-origin: border-box;
  background-clip: content-box, border-box;
  box-shadow: 0px 30px 40px rgba(255,255,255,0.1);
}
#main #con04 .i_wrap > .wrap > svg{ position: absolute; left: 50%; bottom: 20px; transform: translate(-50%,0);}
#main #con04 .i_wrap > .wrap > svg #scroll #mouse #타원_52{ animation: sc 1s ease-in-out infinite; }
#main #con04 .i_wrap{ transform: translateY(50px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .7s; }
#main #con04.on .i_wrap{ transform: translateY(0); opacity: 1; }

@keyframes sc {
  0%{
    transform: translate(33.777px, 26px);
  }
  50%{
    transform: translate(33.777px, 38px);
  }
  100%{
    transform: translate(33.777px, 26px);
  }
}

#main #con04 .i_wrap { width: 1400px; margin: 0 auto; }
#main #con04 .i_wrap .wrap{ margin: 10px; border-radius: 20px; overflow: hidden; position: relative; }
#main #con04 .i_wrap iframe{ width: 100%; height: 520px;  }
#main #con04 .i_wrap .pc_w{ display: block; }
#main #con04 .i_wrap .mo_w{ display: none; }

.fp-viewing-retail #main .con04 .tit2 .wrap > strong{ transform: translateY(0); transition-delay: .3s; }
.fp-viewing-retail #main .con04 .tit2 .wrap > p{ transform: translateY(0); transition-delay: .3s; }
.fp-viewing-retail #main #con04 .i_wrap{ transform: translateY(0); opacity: 1; }


#main .tit2{ margin-bottom: 50px; }
#main .tit2 strong{ display: block; font-size: 50px; line-height: 1em !important; font-weight: 600; color: #fff; }
#main .tit2 strong br{ display: none; }
#main .tit2 p{ font-size: 24px; line-height: 36px; font-weight: 200; color: #fff; word-break: keep-all; }
#main .tit2 .go_btn{ display: flex; float: right; align-items: center; justify-content: center; width: 163px; height: 163px;  }
#main .tit2 .go_btn a{ width: 100%; height: 100%; display: block; position: relative; }
#main .tit2 .go_btn a:before{ content:""; display: block; width: 100%; height: 100%; box-sizing: border-box; border: 10px solid #fff; border-radius: 50%; position: absolute; left: 0; top: 0; transition: transform .6s; }
#main .tit2 .go_btn a svg{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
#main .tit2 .go_btn a:after{ content:""; display: block; width: 240px; height: 240px; background: url('/img/main/retail_go.png') center center no-repeat; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);
  animation: rotatee 20s linear infinite;
}
#main .tit2 .go_btn a:hover:before{ transform: scale(.8);}

#main .tit2 .wrap{ overflow: hidden; }
#main .tit2 .br1{ margin-bottom: 30px; }
#main .tit2 .wrap > strong{ line-height: 1; transform: translateY(100%); transition: transform 1s; }
#main .on .tit2 .wrap > strong{ transform: translateY(0);}
#main .tit2 .wrap > p{  transform: translateY(100%); transition: transform 1s; transition-delay: .3s; }
#main .on .tit2 .wrap > p{ transform: translateY(0);}
#main .tit2 .wrap3 > p{ transition-delay: .5s; }
#main .tit2 .wrap2{ margin-bottom: 16px; }
#main .tit2 .wrap2:last-child{ margin-bottom: 0; }
#main .tit2 .br2{ margin-bottom: 50px; }


#main #con06 .address strong{  transform: translateY(100%); transition: transform 1s; transition-delay: .3s; }


#main #con04 .p_svg svg path{ fill:none; stroke: #fff; stroke-miterlimit: 10;}


#main #con05 .tit2{ margin-bottom: 50px; }
#main #con05 ul li{ float: left; width: 23%; margin-right: 2.666666%; height: 390px; text-align: center;
position: relative; padding: 1px; box-shadow: 0px 0px 99px rgba(52,113,255,0.1); overflow: hidden;

}



#main #con05 ul li .wrap{
   padding-top: 60px; height: 100%; width: 100%;
  background: linear-gradient(315deg, rgba(1,1,1,1) 0%, rgba(54,54,54,1) 100%);
}
#main #con05 ul li:hover{ box-shadow: 0px 0px 99px rgba(52,113,255,0.5); }

#main #con05 ul li:after{ content:""; display: block;
width: 520px; height: 520px;
background-size: 100% 100%;
z-index: -1;
position: absolute; left: 50%; top: 50%;
border: 1px solid transparent;
background-image:
linear-gradient(135deg, #8ECAFF 0%, rgba(255,255,255,0) 50%, #8ECAFF 100%);
transform: translate(-50%,-50%) rotate(0);

background-origin: border-box;
background-clip: content-box, border-box;
}




@keyframes AnimationName {
  0%{transform: translate(-50%,-50%) rotate(0);}
  100%{transform: translate(-50%,-50%) rotate(180deg);}
}


#main #con05 ul li i{ display: block;  margin-bottom: 25px; }
#main #con05 ul li i img{ display: block; margin: 0 auto; }
#main #con05 ul li strong{ display: block; font-size: 30px; font-weight: 600; color: #FFFFFF; }
#main #con05 ul li p{ font-size: 16px; font-weight: 500; color:#ABABAB; line-height: 28px; margin-top: 30px; }
#main #con05 ul li:last-child{ margin-right: 0; }

#main #con05 ul li{ transition: opacity .8s, box-shadow .5s, transform .8s; opacity: 0;
  transform: translateY(50px);
}



.fp-viewing-partnership #main #con05 ul li:nth-child(1){ transition-delay: .6s, 0s, .5s; }
.fp-viewing-partnership #main #con05 ul li:nth-child(2){ transition-delay: .8s, 0s, .7s; }
.fp-viewing-partnership #main #con05 ul li:nth-child(3){ transition-delay: 1s, 0s, .9s; }
.fp-viewing-partnership #main #con05 ul li:nth-child(4){ transition-delay: 1.2s, 0s, 1.1s; }



.fp-viewing-partnership #main #con05 .tit2 .wrap > strong{ transform: translateY(0); transition-delay: .3s; }
.fp-viewing-partnership #main #con05 .tit2 .wrap > p{ transform: translateY(0); transition-delay: .3s; }
.fp-viewing-partnership #main #con05 ul li{ opacity: 1; transform: translate(0); }
.fp-viewing-partnership #main #con05 ul li:after{ animation: AnimationName 2s ease infinite; }

#main #con06{ overflow: visible !important;}
#main #con06 .inner .wraps{ position: relative; }
#main #con06 .txt_b{ position: absolute; right: -500px; top: 25%; }
#main #con06 .go_btn a:after{ background-image: url('/img/main/contact_go.png');}
#main #con06 .go_btn{ position: absolute; right: 0; top: 5px; transform: translate(0,0);  }
#main #con06 .tit2 strong{ margin-bottom: 0;
  background: linear-gradient(45deg, #8ECAFF, #3471FF);
  color: transparent;
  -webkit-background-clip: text;
}
#main #con06 .address{ margin-top: 30px; }
#main #con06 .address .clip{ overflow: hidden; position: relative; }

#main #con06 .address > div{ overflow: hidden; }
#main #con06 .address strong{ display: block; font-size: 24px; line-height: 36px !important; color:#FFFFFF; font-weight: 200; }
#main #con06 .address ul{ margin-top: 20px; overflow: hidden; }
#main #con06 .address ul li{ float: left; margin-right: 60px; font-size: 24px; line-height: 36px; font-weight: 200; color: #fff; }
#main #con06 .address ul li a{ color: inherit; }
#main #con06 .address ul li a:hover{ color: #5692ff; text-decoration: underline; }
#main #con06 .address ul li:last-child{ margin-right: 0; }
#main #con06 .div_m iframe { filter: grayscale(100%) invert(100%) contrast(100%); }
#main #con06 .div_m { margin-top: 40px; box-shadow: 30px 30px 40px rgba(0,0,0,0.1);}


#main #con06 .address ul li{  transform: translateY(100%); transition: transform 1s; transition-delay: .3s; }


#main #con06{ position: relative; }
#main #con06 .bg_w{ width: 100%; height: 1005px; position: absolute; left: 0; bottom: -42%;  z-index: -1; }
#main #con06 .bg_w svg{ }
#main #con06 .bg_w svg #그룹_88 path{opacity: 0; }

#main #con06 #mapss{height: 480px;margin-top: 50px; box-shadow: 30px 30px 40px rgba(0,0,0,0.1);}
#main #con06 #mapss{ transform: translateY(50px); opacity: 0; transition: opacity 1s, transform 1s; transition-delay: .6s; }


.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path{ animation: linea 5s linear infinite; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(1){ animation-delay: 0; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(2){ animation-delay: .2s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(3){ animation-delay: .4s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(4){ animation-delay: .6s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(5){ animation-delay: .8s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(6){ animation-delay: 1s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(7){ animation-delay: 1.2s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(8){ animation-delay: 1.4s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(9){ animation-delay: 1.6s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(10){ animation-delay: 1.8s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(11){ animation-delay: 2s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(12){ animation-delay: 2.2s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(13){ animation-delay: 2.4s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(14){ animation-delay: 2.6s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(15){ animation-delay: 2.8s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(16){ animation-delay: 3s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(17){ animation-delay: 3.2s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(18){ animation-delay: 3.4s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(19){ animation-delay: 3.6s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(20){ animation-delay: 3.8s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(21){ animation-delay: 4s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(22){ animation-delay: 4.2s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(23){ animation-delay: 4.4s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(24){ animation-delay: 4.6s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(25){ animation-delay: 4.8s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(26){ animation-delay: 5s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(27){ animation-delay: 5.2s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(28){ animation-delay: 5.4s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(29){ animation-delay: 5.6s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(30){ animation-delay: 5.8s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(31){ animation-delay: 6s; }
.fp-viewing-contacts #main #con06 .bg_w svg #그룹_88 path:nth-child(32){ animation-delay: 6.2s; }

.fp-viewing-contacts #main #con06 .tit2 .wrap > strong{ transform: translateY(0); transition-delay: .3s; }
.fp-viewing-contacts #main #con06 .tit2 .wrap > p{ transform: translateY(0); transition-delay: .3s; }
.fp-viewing-contacts #main #con06 .address strong{  transform: translateY(0); transition-delay: .3s; }
.fp-viewing-contacts #main #con06 .address ul li{  transform: translateY(0); transition-delay: .3s;}

.fp-viewing-contacts #main #con06 #mapss{ transform: translateY(0); opacity: 1; }
.fp-viewing-footers #main #con06 #mapss{ transform: translateY(0); opacity: 1; }

.fp-viewing-footers #main #con06 .tit2 .wrap > strong{ transform: translateY(0); transition-delay: .3s; }
.fp-viewing-footers #main #con06 .tit2 .wrap > p{ transform: translateY(0); transition-delay: .3s; }
.fp-viewing-footers #main #con06 .address strong{  transform: translateY(0); transition-delay: .3s; }
.fp-viewing-footers #main #con06 .address ul li{  transform: translateY(0); transition-delay: .3s;}


.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path{ animation: linea 5s linear infinite; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(1){ animation-delay: 0; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(2){ animation-delay: .2s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(3){ animation-delay: .4s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(4){ animation-delay: .6s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(5){ animation-delay: .8s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(6){ animation-delay: 1s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(7){ animation-delay: 1.2s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(8){ animation-delay: 1.4s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(9){ animation-delay: 1.6s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(10){ animation-delay: 1.8s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(11){ animation-delay: 2s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(12){ animation-delay: 2.2s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(13){ animation-delay: 2.4s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(14){ animation-delay: 2.6s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(15){ animation-delay: 2.8s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(16){ animation-delay: 3s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(17){ animation-delay: 3.2s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(18){ animation-delay: 3.4s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(19){ animation-delay: 3.6s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(20){ animation-delay: 3.8s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(21){ animation-delay: 4s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(22){ animation-delay: 4.2s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(23){ animation-delay: 4.4s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(24){ animation-delay: 4.6s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(25){ animation-delay: 4.8s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(26){ animation-delay: 5s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(27){ animation-delay: 5.2s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(28){ animation-delay: 5.4s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(29){ animation-delay: 5.6s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(30){ animation-delay: 5.8s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(31){ animation-delay: 6s; }
.fp-viewing-footers #main #con06 .bg_w svg #그룹_88 path:nth-child(32){ animation-delay: 6.2s; }


.swiper-button-next:after, .swiper-button-prev:after{ display: none !important;  }


@keyframes linea {
  0%{
    opacity: 0;
  }
  50%{
    opacity: 1;
  }
  100%{
    opacity: 0;
  }
}




#main #con06 .bg_w{ top: auto; transform: translate(0,0);}
#main #footer2{ height: auto !important; min-height: auto; }
#main #footer2 > .wrap{ transform: translate(0,0); position: static; margin: 0 auto; width: 1400px; }


#main .main_visual .txt ul li.mo{ display: none; }

#main .tit2{ width: 60%; }

@keyframes rotatee {
  0%{
    transform: translate(-50%,-50%) rotate(0);
  }
  100%{
    transform: translate(-50%,-50%) rotate(360deg);
  }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

}

@media (min-width: 1920px){
  #main #con06 .bg_w svg{ width: 102%; height: auto; }
}


@media (max-width: 1600px){
  #main .main_visual .tit strong{ font-size: 60px; }
  #main .main_visual .tit em{ font-size: 100px; }
  #main .main_visual .tit .wrap{ top: -50px; }
}

@media (max-width: 1416px){
  #main #footer2 > .wrap{ width: 100%; }
  .inner{ width: 100%; padding: 0 20px; }
  #main .m_slide .mainSlider .txt{ width: 100%; }
  #main .m_tit strong{ font-size: 36px; }
  #main #con04 .products{ left: 20px; }
  #con04 .p_svg svg{ width: 480px; height: auto; }
  #main #con04 .t_bg svg{ width: 100%; height: auto; }
  #main .tit2 strong{ font-size: 40px; }
  #main .tit2 .br1{ margin-bottom: 40px; }
  #main .tit2 p{ font-size: 20px; }
  #main #con05 .tit2{ margin-bottom: 70px; }
  #main #con05 ul li strong{ font-size: 26px; }
  #main #con05 ul li p{ font-size: 14px; line-height: 26px; margin-top: 20px; }
  #main #con05 ul li{ height: 312px; }
  #main #con06 .txt_b{ display: none; }
  #main #con01 .m_tit{ margin-bottom: 15px; }
  #main #con01 .m_tit2{ margin-bottom: 30px; }
  #main #con01 .m_tit strong{ font-size: 24px ;line-height: 34px; }
  #main #con01 .m_tit2 p{ font-size: 20px; line-height: 32px; }
  #main #con01 .n_pro .wrapss strong{ font-size: 40px; }
  #main #con01 .n_pro > ul > li .txt .num ul > li{ font-size: 40px; }
  #main #con01 .n_pro > ul > li .txt .num{ height: 40px;  }
  #main #con01 .n_pro > ul > li .txt .num .wrap > strong{ font-size: 40px; }
  #main #con01 .n_pro > ul > li .txt > strong{ font-size: 18px; line-height: 30px; min-height: 60px; }
  @keyframes txt1 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-40deg);
    }
    100%{
      left: 27%; top: 17%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }

  @keyframes txt2 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-40deg);
    }
    100%{
      left: 20%; top: 48%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }

  @keyframes txt3 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-40deg);
    }
    100%{
      left: 35%; top: 80%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }

  @keyframes txt4 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(40deg);
    }
    100%{
      left: 70%; top: 20%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }

  @keyframes txt6 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(40deg);
    }
    100%{
      left: 65%; top: 82%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }

  @keyframes txt5 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(40deg);
    }
    100%{
      left: 80%; top: 52%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }
}


@media (max-width: 1550px){
  #main .tit2 p{ line-height: 28px; }
  #main .tit2{ margin-bottom: 30px; }
  #main #con05 .tit2{ margin-bottom: 30px; }
  #main #con03 .boxs{ width: 325px; }
  #main #con02 .swiper-pagination{ margin-top: 55px; }
  #main #con03 .swiper-pagination{ transform: translateY(30px);}
  #main #con01 .m_tit strong{ font-size: 40px; line-height: 50px; }
  #main #con01 .m_tit2 p{ font-size: 18px; line-height: 28px; }
  #main #con01 .n_pro .wrapss strong{ font-size: 40px; }
  #main #con01 .m_tit2{ margin-bottom: 30px; }
  #main #con01 .m_tit{ margin-bottom: 20px; }
  #main #con01 .n_pro > ul > li .icon svg{ width: 40px; height: auto; }
  #main #con01 .n_pro > ul > li .txt > strong{ font-size: 18px; line-height: 28px; min-height: 56px; }
  #main #con01 .n_pro > ul > li .txt .num ul > li{ font-size: 40px; }
  #main #con01 .n_pro > ul > li .txt .num ul{ margin-left: -2px; }
  #main #con01 .n_pro > ul > li .txt .num{ height: 40px; }
  #main #con01 .n_pro > ul > li .txt .num .wrap > strong{ font-size:40px; }
  #main #con01 .n_pro > ul > li .txt .num{ overflow-y: hidden; overflow-x: visible; }
  #main .m_tit4 p{ font-size: 18px; line-height: 28px; }
  #main .m_tit strong{ font-size: 40px; }
  #main .m_tit4{ margin-top: 20px; margin-bottom: 30px; }
  #main #con02 .d_slide .swiper-slide{ width: 630px; }
  #main #con02 .boxs{ width: 630px; }
  #main #con02 .d_slide .swiper-slide .txt strong{ margin-bottom: 15px; }
  #main #con02 .d_slide .swiper-slide .txt strong{ font-size: 24px; }
  #main #con02 .d_slide .swiper-slide .txt p{ font-size: 14px; line-height: 22px; }
  #main #con02 .d_slide .swiper-slide .icon{ bottom: -25px; }
  #main #con02 .d_slide .swiper-slide .icon svg{ height: 50px; width: auto; }
  #main #con02 .swiper-pagination{ bottom: -55px; }
  #main #con03 .s_slide .box strong{ font-size: 20px; line-height: 30px; }
  #main #con03 .s_slide .box .p01{ font-size: 16px; line-height: 26px; margin-top: 10px; }
  #main #con03 .s_slide .box .p02{ font-size: 14px; line-height: 24px; margin-top: 10px; }
  #main #con03 .s_slide .swiper-slide{ height: 440px; width: 325px; }
  #main #con03 .s_slide{ padding: 30px 0; }
  #main #con03 .s_slide .box{ padding-top: 30px; padding-left: 25px; padding-right: 25px; }
  #main .tit2 strong{ font-size: 40px; }
  #main .tit2 p{ font-size: 18px; }
  #main .tit2 .wrap2{ margin-bottom: 8px; }
  #main .tit2 .br1{ margin-bottom: 20px; }
  #main .tit2 .br2{ margin-bottom: 30px; }
  #main #con04 .i_wrap iframe{ height: 400px; }
  .inner{ width: 1200px; }
  #main #con04 .i_wrap{ width: 1200px; }
  #main .tit2 .go_btn{ width: 120px; height :120px; }
  #main .tit2 .go_btn a:after{ width: 170px; height: 170px; background-size: 100% 100%; }
  #main #con05 ul li .wrap{ padding-top: 40px; }
  #main #con05 ul li p{ font-size: 14px; line-height: 22px; margin-top: 15px; }
  #main #con05 ul li{ height: 340px; }
  #main #con05 ul li i img{ height: 50px; }
  #main #con05 ul li strong{ font-size: 24px; }
  #main #con06 #mapss{ height: 400px; margin-top: 30px; }
  #main #con06 .address{ margin-top: 20px; }
  #main #con06 .address strong{ font-size: 18px; line-height: 28px !important; }
  #main #con06 .address ul li{ font-size: 18px; line-height: 28px;margin-right: 40px; }
  #main #con06 .bg_w svg{ width: 110%; height: auto; }
  #main #con06 .bg_w{ bottom: -60%; }
  #main .tit2 .wrap2{ margin-bottom: 0; }
  #main #footer2 > .wrap{ width: 1200px;  }

}

@media (max-width: 1216px){
  .inner{ width: 100%; }
  #main #con04 .i_wrap{ width: 100%; }
}

@media (max-width: 1100px){
  #main > div > .wrap{ width: 100%; }
  #main #con03 .s_slide .box strong{ font-size: 20px; line-height: 30px ;}
  #main #con03 .s_slide .box .p01{ font-size: 16px; line-height: 28px; margin-top: 15px; }
  #main #con03 .s_slide .box .p02{ font-size: 13px; line-height: 23px; margin-top: 20px; }
  #main #con03 .s_slide .swiper-slide{ width: 300px; height: 360px;}
  #main #con03 .s_slide .boxs{ width: 300px; }
  #main #con03 .s_slide .box{ padding-top: 30px; padding-left: 25px; padding-right: 15px; }
  #main #con03{ padding-top: 110px; }
  #main #con02{ padding-top: 110px; padding-bottom: 110px; }
  #main #con06{ padding-bottom: 110px; }
  #main .main_visual .tit strong{ font-size: 40px; }
  #main .main_visual .tit em{ font-size: 70px; }
  #main #con06 .address{ margin-top: 30px; }
  #main #con06 .address strong{ font-size: 18px; float: none; }
  #main #con06 .address ul { float: none;margin-top: 20px; }
  #main #con06 .address ul li{ font-size: 16px; line-height: 32px; float: none; margin-right: 0; }
  #main #con02 .d_slide .swiper-slide{ width: 60%; }
  #main #con02 .boxs{ width: 60%; }
  #main #con02 .d_slide .swiper-slide .txt p{ font-size: 14px; line-height: 22px; }
  #main #con02 .d_slide .swiper-slide .txt strong{ font-size: 24px; margin-bottom: 15px; }
  #main #con04 .i_wrap{ width: 90%; margin: 0 auto; }
  #main #con04 .i_wrap .wrap{  }
  #main #con04 .i_wrap .wrap iframe{ width: 100%; height: 400px; }
	
}

@media (max-width: 885px){
	#main #con01 .m_tit2, #main .m_tit4, #main .tit2{width: 80%}
    #main #con03 .s_slide .swiper-slide{height: 420px}
}
@media (max-width: 880px){
  #intro .in_logo img{height: 40px; }
  #intro ul{transform: scale(0.6) rotate(45deg)}
  @keyframes rotate {
    0%{transform: scale(0.6) rotate(45deg)}
    100%{transform: scale(0.6) rotate(180deg);}
  }
	#main #con01 .n_pro .wrapss p{font-size: 17px}
	#main #con02 .d_slide .swiper-slide .txt p{text-align: center}
  #main .main_visual .tit strong{ margin-bottom: 20px; }
  #main .main_visual .txt ul li{ font-size: 20px; line-height: 30px; }
  #main #con01 .m_tit2{ width: 70%; margin-bottom: 20px; }
  #main #con01 .n_pro .wrapss strong{ font-size: 30px; }
  #main #con03 .s_slide .box strong{ font-size: 20px; line-height: 28px; }
  #main #con03 .s_slide .boxs{ top: 47%;  }
  #main #con03 .s_slide .swiper-slide{ height: 400px; }
  #main .m_tit strong, #main #con01 .m_tit strong{ font-size: 30px; line-height: 40px; }
  #main .m_tit4{ margin-top: 10px; margin-bottom: 20px; }
  #main #con03 .s_slide .box .p01{ font-size: 14px; line-height: 24px; margin-top: 10px; }
  #main #con03 .s_slide .box .p02{ margin-top: 10px; }
  #main #con02 .d_slide .swiper-slide .txt p{ font-size: 14px; line-height: 24px; font-weight: 500; }
  #main .m_tit4 p, #main #con01 .m_tit2 p{ font-size: 16px; line-height: 26px; }
  #main .tit2 p{ font-size: 16px; line-height: 26px; }
  #main #con02 .d_slide .swiper-slide .txt{ width: 80%; }
  #main #con03 .s_slide .box{ padding-right: 20px; padding-left: 20px; }
  #main #con02 .d_slide .swiper-slide .txt strong{ margin-bottom: 10px; }
  #main #con02 .swiper-pagination{ margin-top: 40px; }
  #main #con03 .s_slide .swiper-pagination{ margin-top: 20px; }
  #main .m_tit4{ width: 70%; }
  #main #con04 .products{ position: static; }
  #main #con04{ padding-top: 110px; }
  #main #con04{ padding-bottom: 110px; }
  #main #con05 ul li{ width: 48%; margin-right: 4%; margin-bottom: 20px; }
  #main #con05 ul li:nth-child(2n+0){ margin-right: 0; }
  #main #con05 ul li i img{ height: 40px; }
  #main #con05 ul li strong{ font-size: 22px; }
  #main #con05 ul li i{ margin-bottom: 15px; }
  #main #con05 ul li p{ margin-top: 10px; }
  #main #con04 .tit2{ padding-right: 30px; }
  #main #con06 #mapss{ height: 280px !important; }
  #main #con02 .d_slide .swiper-button-prev{ left: -45px; width: 40px; height: 40px; background-size: 20%;}
  #main #con02 .d_slide .swiper-button-next{ right: -45px; width: 40px; height: 40px; background-size: 20%;}
    #main #con03 .s_slide .swiper-button-prev{ left: -48px; width: 40px; height: 40px; background-size: 20%;}
    #main #con03 .s_slide .swiper-button-next{ right: -48px; width: 40px; height: 40px; background-size: 20%; }

    #main #con05 ul li .wrap{ padding-top: 30px; }
    #main #con05 ul li{ height: 260px; }

    #main #con04 .i_wrap{ margin-top: 30px; }

    #main #con01 .n_pro > ul > li{ width: 48%; margin-right: 4%; }
    #main #con01 .n_pro > ul > li:nth-child(3n+0){ margin-right: 4%;}
    #main #con01 .n_pro > ul > li:nth-child(2n+0){ margin-right: 0; }
    #main #con01 .n_pro > ul > li .icon{ margin-bottom: 10px; }
    #main #con01 .n_pro > ul > li .icon svg{ width: 50px; height: auto; }
    #main #con01 .n_pro > ul > li{ padding-bottom: 20px; }
    #main #con01 .n_pro > ul > li .txt .num ul{ margin-left: -2px; }
    #main .con_w{ padding-top: 62px !important; padding-bottom: 0 !important;}
    #main #con01{ padding-bottom: 0 !important; }
    #main #con06{ padding-bottom: 0 !important; }
    #main #con02 .d_slide{ padding-bottom: 30px; }
    #main #con03 .m_tit{ margin-bottom: 0; }
    #main #con03 .s_slide{ padding: 20px 0; }
    #main #con05 ul li:nth-child(3), #main #con05 ul li:nth-child(4){ margin-bottom: 0; }
    #main .tit2 strong{ font-size: 30px; line-height: 40px !important; }
    #main .tit2 .br1{ margin-bottom: 10px; }
    #main #con04 .tit2{ padding-right: 0; width: 75%; }
    #main .tit2{ margin-bottom: 20px; }
    #main #con04 .i_wrap{ width: 100%; }
    #main .tit2 {width: 70%; }
    #main #con05 .tit2{ margin-bottom: 20px; }
    #main #con06 .tit2 .wrap2{ margin-bottom: 0; }
    #main #con06 .address{margin-top: 10px; }
    #main #con06 .address strong{ font-size: 18px; line-height: 28px !important;}
    #main #con06 .address ul{ margin-top: 10px; }
    #main #con06 .address ul li{ font-size: 16px; line-height: 24px; }
    #main #con01 .m_tit2 p br{ display: none; }
    #main #con06 #mapss{ margin-top: 0; }
    #main #con06 .bg_w{ bottom: -86%; }
    #main .m_tit4 p br{ display: none; }
    #main .tit2 .wrap > p br{ display: none; }
	#main #con01 .n_pro > ul > li .txt > strong{font-size: 16px;line-height: 24px;}
	#main #con01 .n_pro > ul > li .icon svg{width: 45px}
	#main #con01 .n_pro > ul > li .txt .num ul > li, #main #con01 .n_pro > ul > li .txt .num .wrap > strong{font-size: 36px}
}

@media (max-width: 700px){
	#main #con02 .d_slide .swiper-slide .img_box{width: 80% !important}
	#main #con02 .d_slide .swiper-slide .txt{padding-left: 20px;padding-right: 20px;}
	#main #con02 .d_slide .swiper-button-next{right: -90px}
	#main #con02 .d_slide .swiper-button-prev{left: -90px}
}


@media (max-width: 660px){
  #main .tit2 strong br{ display: block; }
  #main #con06 .address strong{ font-size: 16px; line-height: 24px !important; }
  .iScrollIndicator{ display: none !important; }
  #main #con01 .n_pro .wrapss p{ font-size: 16px; }
  #main .main_visual .txt{ padding: 0 20px; word-break: keep-all; }
  #main .main_visual .txt ul li{ line-height: 30px; }
  #main .main_visual .tit strong{ font-size: 28px; }
  #main .main_visual .tit em{ font-size: 40px; }
  #main #con04 .i_wrap .pc_w{ display: none; }
  #main #con04 .i_wrap .mo_w{ display: block; }
  #main .main_visual .tit strong{ margin-bottom: 20px; }
  #main #con02 .d_slide .swiper-slide .txt{  text-align: left; }
  #main .main_visual .control .swiper-pagination4 span.swiper-pagination-bullet-active{ width: 60px; }
  #main .main_visual .control .swiper-button-prev4{ margin-right: 20px; }
  #main .main_visual .control .swiper-button-next4{ margin-left: 20px; }
  #main .main_visual .control .swiper-pagination4{ width: 104px; }
  #main .m_tit4 p{ font-size: 16px; line-height: 26px; padding: 0 20px; word-break: keep-all; }
  #main .m_tit4{ margin-top: 10px; margin-bottom: 20px; }
  #main #con01 .m_tit strong{ font-size: 24px; line-height: 34px; }
  #main #con01 .m_tit2 p{ font-size: 16px; line-height: 24px; }
  #main #con01 .m_tit{ margin-bottom: 0; }
  #main #con01 .n_pro .wrapss strong{ font-size: 24px; }
  #main #con01 .m_tit2{ margin-bottom: 20px; }
  #main #con03 .s_slide .box strong{ font-size: 16px; line-height: 24px; }
  #main #con03 .s_slide .box .p01{ font-size: 14px; line-height: 18px; margin-top: 10px; }
  #main #con03 .s_slide .box .p02{ font-size: 12px; line-height: 18px; margin-top: 10px; }
  #main #con03 .s_slide .swiper-slide{ height: 320px; }
  #main #con03 .s_slide .swiper-pagination{ bottom: 0; }
  #main #con04 .i_wrap{ margin-top: 20px; }
	#main .tit2{width: 60%}

  @keyframes txt1 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-40deg);
    }
    100%{
      left: 27%; top: 17%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }

  @keyframes txt2 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-40deg);
    }
    100%{
      left: 10%; top: 48%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }

  @keyframes txt3 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-40deg);
    }
    100%{
      left: 35%; top: 80%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }

  @keyframes txt4 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(40deg);
    }
    100%{
      left: 70%; top: 20%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }

  @keyframes txt6 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(40deg);
    }
    100%{
      left: 65%; top: 82%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }

  @keyframes txt5 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(40deg);
    }
    100%{
      left: 90%; top: 52%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }
  #main .m_tit{ margin-bottom: 30px; }
  #main .m_tit strong{ font-size: 24px; line-height: 34px; margin-bottom: 10px; }
  #main #con04 .products{ margin-bottom: 40px; }
  #main #con02 .d_slide .swiper-slide{ width: 80%; }
  #main #con02 .boxs{ width: 80%; }
  #main #con02 .d_slide .swiper-slide{ opacity: 1; }
  #main #con02 .d_slide .swiper-slide .txt p{  font-size: 12px; line-height: 18px; }
  #main #con02 .d_slide .swiper-slide .icon img{ width: 60px; height: 60px;  }
  #main #con02 .d_slide .swiper-slide .icon{ bottom: -30px;  }
  #con04 .p_svg svg{ width: 320px; }
  #main #con04 .products > strong{ margin-bottom: 50px; font-size: 18px; line-height: 28px; }
  #main .tit2 .go_btn{ width:100px; height: 100px; top: 6px !important;  }
  #main .tit2 .go_btn a:before{ border: 5px solid #fff; }
  #main .tit2 .go_btn a:after{ width: 150px; height: 150px; background-size: 100% 100%; }
  #main #con04{ padding-bottom: 70px; }
  #main .con_w{ padding-top: 62px !important; }
  #main #con04{ padding-top: 62px; }
  #main #con06{ padding-bottom: 80px; }
  #main .tit2 strong{ font-size: 24px; line-height: 34px !important; }
  #main .tit2 p{ font-size: 16px; line-height: 24px !important; }
  #main .m_tit{ padding-left: 20px; padding-right: 0; text-align: left !important; }
  #main .tit2 .wrap2{ margin-bottom: 0; }
  #main .m_tit4{ text-align: left !important;}
  #main .tit2 .wrap > p{ line-height: 18px; }
  #main #con05 .tit2{ margin-bottom: 20px; }
  #main .m_tit4 p{ text-align: left !important;}
  #main #footer2{ padding-top: 0; }
  #main .tit2 .br1{ margin-bottom: 10px; }
  #cursor{ display: none !important; }
  #main .main_visual .tit.on strong{ word-break: keep-all; }
  #main .main_visual .txt ul li{ font-size: 16px; line-height: 24px; display: none; }
  #main .main_visual .txt ul li.mo{ display: block; transition-delay: .5s; width: 80%; margin: 0 auto; }
  #main #con03{ overflow: hidden; }
  #main #con02{ overflow: hidden; }
  #main #con06 #videobcg2{ height: 100%; width: auto; left: 50%; transform: translate(-50%,0) scaleX(-1);}
  #main #con02 .d_slide .swiper-slide .icon{ bottom: -20px; }
  #main #con02 .d_slide .swiper-slide .icon svg{ height: 40px; width: auto; }
  #main .m_tit{ padding-left: 0; }
  #main #con01 .n_pro > ul > li{ margin-top: 20px; }
  #main #con01 .m_tit strong br{ display: none; }
  #main #con01 .m_tit strong{ word-break: keep-all; }
  #main #con01 .m_tit2 p{ word-break: keep-all; }
  #main #con01 .n_pro > ul > li .txt .num ul > li{ font-size: 30px; }
  #main #con01 .n_pro > ul > li .txt .num{ height: 30px; }
  #main #con01 .n_pro > ul > li .txt .num .wrap > strong{ font-size: 30px; }
  #main #con01 .n_pro > ul > li .icon svg{ width: 40px; }
  #main #con01 .n_pro > ul > li .txt > strong{ font-size: 14px ;line-height: 20px; min-height: 40px; }
  #main .m_tit4 p{ padding: 0; }
  #main .m_tit4{ margin: 0; margin-bottom: 20px; }
  #main .m_tit4{ width: 100%; }
  #main .tit2{ width: 80%; }
  #main #con01 .m_tit2{ width:100%; }
  #main #con02 .d_slide .swiper-slide .txt strong{ font-size: 20px; }
  #main #con03 .swiper-pagination{ transform: translateY(0);}
    #main .tit2 .go_btn{width: 75px;height: 75px}
    #main .tit2 .go_btn a:after{width: 105px;height: 105px;}
	#main #con05 .tit2{width: 100%}
    
}
@media (max-width: 440px){
    #main #con06 .tit2{width: 280px}
    #main #con06 .address strong{word-break: keep-all}
    #main #con04 .wrap > p{max-width: 261px}
    #main #con03 .m_tit strong, #main #con03 .m_tit4 p{text-align: center !important}
    #main #con02 .m_tit strong, #main #con02 .m_tit4 p{text-align: center !important}
    #main #con03 .m_tit4 p{max-width: 350px;margin: 0 auto}
    #main #con02 .d_slide .swiper-slide{ height: 370px; }
  #main #con02 .d_slide .swiper-slide .img_box{ overflow: hidden; width: 100%; height: 100%; position: relative; z-index: -1}
  #main #con02 .d_slide .swiper-slide .img_box img{ width: auto; height: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);z-index: -1}
  #main #con02 .d_slide .swiper-slide .txt{ z-index: 1; }
    #main #con02 .d_slide .swiper-slide .img_box{width: 72%}
    #main #con02 .d_slide .swiper-slide .txt{width: 72%;padding: 0 20px;text-align: center}
    #main #con02 .d_slide .swiper-slide .txt p{text-align: center}
    #main #con01 .n_pro > ul > li .txt .num{float: none}
    #main #con01 .n_pro > ul > li .txt > strong{float: none}
    #main #con01 .n_pro > ul > li .txt .num .wrap > strong{float: left}
    #main #con01 .n_pro > ul > li .txt .num ul{float: left}
    #main #con01 .n_pro > ul > li .txt .num{margin-top: 12px;}
    #main #con02 .d_slide .swiper-button-prev{left: -28px;}
    #main #con02 .d_slide .swiper-button-next{right: -28px;}
    #main #con02 .d_slide .swiper-slide .icon > *{position: relative;z-index: 3}
}
@media (max-width: 414px){
  #main #con06 #mapss{ height: 220px !important;  }
  #main #con01 .inner{ padding-top: 48px; padding-bottom: 48px; }
  #main #con04 .inner{ padding-top: 48px; padding-bottom: 48px; }
  #main #con05 .inner{ padding-top: 48px; padding-bottom: 48px; }
  #main #con06 .inner{ padding-top: 48px; padding-bottom: 48px; }
  #main #con06 .tit2{ width: 77%; }
  #main .con02 .m_tit{ text-align: center !important; }
  #main .con02 .m_tit4 p{ text-align: center !important; }
  #main .con03 .m_tit{ text-align: center !important; }
  #main .con03 .m_tit4 p{ text-align: center !important; }
  #main .con_w{ padding-top: 62px !important; }
  #main #con03 .s_slide .swiper-slide{ opacity: 1; }
  #main #con06 .address{ margin-top: 10px; }
  #main #con06 .tit2 strong{ margin-top: 0; }
  #main #con05 ul li strong{ font-size: 18px; font-weight: 500; }
  #main #con02 .d_slide .swiper-slide .txt p span{ display: none; }
  #main #con02 .d_slide .swiper-slide .txt p br{ display: block; }
  #main #con02 .d_slide .swiper-slide .txt strong{ font-size: 18px; margin-bottom: 10px; text-align: center; }
  #main .tit2 .go_btn{ height: 70px; width: 70px; top: 8px !important; }
  #main .tit2 .go_btn a:after{ width: 100px; height: 100px; }
  #main #con04 .i_wrap{ border-radius: 20px;}
  #main #con04 .i_wrap .wrap{ margin: 6px; border-radius: 12px; }
  #main #con05 ul li p{ font-size: 11px; line-height: 16px; padding: 0 10px; }
  #main #con05 ul li{ height: 240px; }
  #main #con05 ul li:nth-child(3), #main #con05 ul li:nth-child(4){ height: 200px; }
  #main #con02 .d_slide .swiper-slide{ height: 340px; }
  #main #con02 .d_slide .swiper-slide .img_box{ overflow: hidden; width: 100%; height: 100%; position: relative; }
  #main #con02 .d_slide .swiper-slide .img_box img{ width: auto; height: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
  #main #con02 .d_slide .swiper-slide .txt{ z-index: 1; }
  #main #con04 .i_wrap > .wrap > svg{ width: 60px; height: auto; }
  #main #con02 .d_slide .swiper-slide .txt{ width: 75% !important; padding: 0 20px; }
  #main #con01 .n_pro > ul > li .txt strong{ float: none; }
  #main #con01 .n_pro > ul > li .txt .num{ float: none; margin-top: 10px; }
  #main #con01 .n_pro > ul > li .txt .num ul{ float: left; }
  #main #con01 .n_pro > ul > li .txt .num .wrap > strong{ float: left; }
  #main #con01 .n_pro .wrapss strong{ font-size: 24px; line-height: 34px; }
  #main #con01 .m_tit strong{ font-size: 24px; line-height: 34px; }
  #main #con01 .m_tit2 p{ font-size: 16px; line-height: 24px; }
  #main #con06 .bg_w{ bottom: auto; top: 600px; height:500px; }
  #main #con01 .m_tit{ padding:0;  }
  #main #con01 .n_pro > ul > li .icon svg{ width: 30px; }
  #main #con02 .d_slide .swiper-slide{ width: 100% !important; }
  #main #con02 .d_slide .swiper-slide .img_box{ width: 75%; }
  #main #con02 .boxs{ width:75%; }
  #main #con02 .boxs{ top: 44%; }
  #main #con02 .d_slide{ padding: 20px 0;  }
  #main #con02 .m_tit4{ margin-bottom: 0; }
  #main #con02 .d_slide .swiper-pagination{ bottom: 0; }
  #main .tit2 .wrap > p{ word-break: keep-all; }
  #main #con02 .d_slide{  }
  #main #con05 ul li i img{ height: 30px; }
  #main #con05 ul li{ height: 197px; }
  #main #con05 ul li .wrap{ padding-top: 20px;}
  #main #con04 .tit2 .go_btn{ top: 6px !important; }
  #main #con02 .d_slide .swiper-button-prev{ width: 32px; height: 32px; left: -40px; }
  #main #con02 .d_slide .swiper-button-next{ width: 32px; height: 32px; right: -40px;  }

  #main #con03 .s_slide .swiper-button-prev{ width: 32px; height: 32px; left: -40px; }
  #main #con03 .s_slide .swiper-button-next{ width: 32px; height: 32px; right: -40px;  }
  #main #con03 .s_slide .swiper-slide{ width: 281px; }
/*	#main #con01 .n_pro > ul > li{padding-top: 16px;margin-bottom: 16px;}*/
	#main #con01 .n_pro > ul > li{padding-bottom: 16px;margin-top: 16px}

  @keyframes txt3 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-40deg);
    }
    100%{
      left: 30%; top: 80%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }
  @keyframes txt6 {
    0%{
      left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(40deg);
    }
    100%{
      left: 69%; top: 82%; transform: translate(-50%,-50%) rotate(0);
      animation-timing-function: cubic-bezier(1,0,0.6,1.5);
    }
  }
}


@media (max-width: 365px){
    #main #con03 .s_slide .swiper-button-prev{left: -25px}
    #main #con03 .s_slide .swiper-button-next{right: -25px}
}
@media (max-width: 325px){
		#main .main_visual .txt ul li.mo{width: 100%}
	#main #con01 .m_tit strong, #main #con01 .n_pro .wrapss strong, #main .m_tit strong, #main .tit2 strong{font-size: 20px;line-height: 28.4px}
	#main #con01 .m_tit2 p, #main .m_tit4 p, #main .tit2 .wrap > p, #main .main_visual .txt ul li{font-size: 13.5px;line-height: 21.7px !important}
	#main #con01 .n_pro .wrapss p{font-size: 13.5px;}
	#main #con01 .n_pro > ul > li .txt > strong{font-size: 11.7px;}
	#main #con01 .n_pro > ul > li .txt .num ul > li, #main #con01 .n_pro > ul > li .txt .num .wrap > strong{font-size: 25px;}
	#main #con01 .n_pro > ul > li .txt .num{height: 22px}
	#main .m_tit strong, #main .m_tit strong{margin-bottom: 8.4px}
	#main #con02 .d_slide .swiper-slide .txt strong{font-size: 15px}
	#main #con02 .d_slide .swiper-slide .txt p, #main #con03 .s_slide .box .p02{font-size: 10px;line-height: 15px;;margin-top: 8.4px}
	#main #con03 .s_slide .box strong{font-size: 13.4px;line-height: 20px;}
	#main #con03 .s_slide .box .p01{font-size: 11.7px;;margin-top: 8.4px}
	#main #con03 .s_slide .swiper-slide{height: 290px;width: 235px}
	#main #con03 .s_slide .swiper-pagination{margin-top: 16.7px}
	.swiper-pagination-clickable .swiper-pagination-bullet{width: 6.5px;height: 6.5px;margin: 0 3px}
	#main #con03 .s_slide{padding: 16.7px 0}
	#main #con04 .i_wrap{margin-top: 16.7px}
	#main #con05 ul li p{font-size: 10px;}
	#main #con04 .i_wrap .wrap iframe{height: 340px;}
	#main #con05 ul li p{padding: 0 7px;line-height: 13.7px;}
	#main #con05 ul li strong{font-size: 15px}
	#main #con05 ul li i img{height: 24px}
	#main #con05 ul li i{margin-bottom: 12.5px}
	#main #con05 ul li .wrap{padding-top: 16.7px;}
	#main #con05 ul li{height: 185px}
	#main #con06 .address strong, #main #con06 .address ul li{font-size: 13.4px;line-height: 20px;}
	#main #con06 .address, #main #con06 .address ul{margin-top: 8.4px}
	#footer2 .wrap .txt address{font-size: 10.84px;line-height: 20.84px;margin-bottom: 3.5px;}
	#footer2 .wrap .txt address i{width: 16.4px;}
	#footer2 .wrap .txt .copy{font-size: 10px;margin-top: 8.33px;}
	#main .tit2 .go_btn{width: 58.4px;height: 58.4px;}
	#main .tit2 .go_btn a:after{width: 83.33px;height: 83.33px;}
	#main .tit2 .go_btn a svg{width: 10.84px;height: auto}
	#main .main_visual .tit strong{font-size: 23.4px;margin-bottom: 16.7px;}
	#main .main_visual .control .swiper-pagination4 span{width: 6.5px;height: 6.5px;margin-left: 11.7px}
	#main .main_visual .control .swiper-button-prev4{width: 7.5px;height: 15px;margin-right: 16.7px}
	#main .main_visual .control .swiper-button-next4{width: 7.5px;height: 15px;margin-left: 16.7px}
    #main #con01 .n_pro > ul > li:nth-child(3) .txt .num .wrap > strong{line-height: 0.7em}
    #main #con01 .n_pro > ul > li:nth-child(4) .txt .num .wrap > strong{line-height: 0.7em}
    #main #con01 .n_pro > ul > li:nth-child(6) .txt .num .wrap > strong{line-height: 0.7em}
      #main #con03 .s_slide .swiper-button-prev{left: 0}
    #main #con03 .s_slide .swiper-button-next{right: 0}
    #main #con03 .s_slide .swiper-button-prev{left: -26px}
    #main #con03 .s_slide .swiper-button-next{right: -26px}
    #main #con03 .s_slide .swiper-button-prev{left: -4px}
    #main #con03 .s_slide .swiper-button-next{right: -4px}

	
}
@media (max-width: 300px){
  #main #con02 .d_slide .swiper-slide img{ width: auto; height: 300px; }
      @keyframes txt3 {
        0%{
          left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-40deg);
        }
        100%{
          left: 25%; top: 80%; transform: translate(-50%,-50%) rotate(0);
          animation-timing-function: cubic-bezier(1,0,0.6,1.5);
        }
      }
      #con04 .p_svg svg{ width: 220px; }
      #main .tit2 strong{ font-size: 24px; }
      #main #con04 .tit2{ padding-right: 15px; }
  
}
