body, html{ overflow-x: hidden; }

.inner{width: 1400px; margin: 0 auto; }
#footer{z-index: 4;position: relative}



/* 메인비주얼 */
.main_visual{width:100%;position: relative;z-index: 3; height: 100vh; background: #111;}
.main_visual .main_slider{ height:100%;overflow: hidden; position: relative;}
.main_visual .main_slider .slide_box{ overflow: hidden;width:100%;height:100%; position: relative; background-color: #111; }
.main_visual .main_slider .slide_box > div{ overflow: hidden;height:inherit;position: absolute;left:0;top:0;right:0; z-index: 3; overflow: hidden;
width: 100%; height: 100%;
opacity:0;
}
.main_visual .main_slider .slide_box > div{
-moz-transition: all .7s ease-in-out;
-webkit-transition: all .7s ease-in-out;
-o-transition: all .7s ease-in-out;
-ms-transition: all .7s ease-in-out;
transition: all .7s ease-in-out;
}

.main_visual .main_slider .slide_box .main_img{ position: absolute;left: 50%; top: 50%; transform: translate(-50%,-50%); 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 .main_img img{ display: block; min-width: 100%;  max-width: auto;height: 100%; position: absolute; left: 50%; transform: translate(-50%,-50%) scale(1.1); top: 50%;  transition: transform 5s; }
.main_visual .main_slider .slide_box div.on .main_img img{ transform: translate(-50%,-50%) scale(1);}

.main_visual .main_slider .slide_box .in_obj{text-align: left; top:0%; width: 100%; z-index: 9}
.main_visual .main_slider .slide_box .in_obj:after{content: ''; display: block}
.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;
-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)"
}





.m_tit{margin-bottom: 55px;}
.m_tit strong{font-size: 50px;color: #fff;display: block;line-height: 1; text-shadow: 2px 2px 2px rgba(0,0,0,0.2);}
.m_tit strong:before{content: '';display: inline-block;height: 37px;width: 4px;background: #880505;margin-right: 45px;}
.m_tit p{padding-left: 52px;font-size: 30px;font-weight: 300;color: #281212;letter-spacing: -0.5px;margin-top: 15px;}





/*효과*/
.main_visual .in_inner{width: 1400px;margin: 0 auto;max-width: 100%; position: absolute; left: 0; right: 0; top: 50%; transform: translate(0,-50%); z-index: 10; }
.main_visual .box.on .dim{opacity: 0.1;transition: 1.5s}
.main_visual .box1.on .dim{opacity: 0.3}
.main_visual ul li{overflow: hidden}
.main_visual ul li strong{display: block;transform: translateY(100%);}
.main_visual .box.on ul li strong{transform: translateY(0%);transition: transform 1.4s}
.main_visual .box.on ul li:nth-child(1) strong{transition-delay: 0.2s}
.main_visual .box.on ul li:nth-child(2) strong{transition-delay: 0.4s}
.main_visual .box.on ul li:nth-child(3) strong{transition-delay: 0.6s}
.main_visual .box.on ul li:nth-child(4) strong{transition-delay: 0.8s}
.main_visual .box.on ul li:nth-child(5) strong{transition-delay: 1s}
.main_visual .txt, .main_visual .txt2{overflow: hidden}
.main_visual .txt p{display: block;transform: translateY(100%);}
.main_visual .box.on .txt p{transform: translateY(0%);transition: transform 1.4s;transition-delay: 1.2s}
.main_visual .txt2 span{display: block;transform: translateY(100%);}
.main_visual .box.on .txt2 span{transform: translateY(0%);transition: transform 1.4s;transition-delay: 2.7s}

.m_tit strong{opacity: 0;transform: translateY(30px);transition: opacity 1s, transform 1s;}
.on .m_tit strong{opacity: 1; transform: translateY(0);}
.m_tit p{opacity: 0;transform: translateY(30px);transition: opacity 1s, transform 1s;transition-delay: 0.3s}
.on .m_tit p{opacity: 1; transform: translateY(0);}



#main .main_visual .in_inner .in_obj strong{ font-size: 120px; line-height: 1em; font-weight: 800; color:#fff; display: block; }
#main .main_visual .in_inner .in_obj p{ font-size: 24px; line-height: 36px; color: #fff; margin-top: 30px; }
#main .main_visual .progress{ position: relative; width: 100%; height: 2px; background-color: rgba(255,255,255,0.25); margin-top: 40px; }
#main .main_visual .progress .on{ display: block; width: 0; height: 100%; background-color: #FFCC00; position: absolute; left: 0; top: 0; }
#main .main_visual .main_slider .slide_box div.on .progress .on{ width: 100%; transition: width 6s linear; }

.main_visual .main_slider .slide_box div .in_obj strong{
  transform: translate3d(0px, 200%, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 10deg); transition: transform 1s; transform-style: preserve-3d;
}

#main .main_visual .in_inner .in_obj .clip2 strong{ transition-delay: .2s; }

.main_visual .main_slider .slide_box div.on .in_inner .in_obj strong{
  transform: translate3d(0px, 0, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0);
}

#main .main_visual .in_inner .in_obj p{ filter: blur(10px); opacity: 0; transition: filter 1.2s, opacity 1s; transition-delay: .6s; }
#main .main_visual .main_slider .slide_box div.on .in_inner .in_obj p{ filter: blur(0); opacity: 1; }

#main .main_visual .in_inner .clip{ overflow: hidden; position: relative;
  flex-direction: column;
  justify-content: space-between;
  display: flex;
  position: relative;
  overflow: hidden;
}

#main .main_visual .in_inner .wraps{ position: relative; }
#main .main_visual .thum_wrap { position: absolute; right: 0; bottom: -40px; z-index: 5; }
#main .main_visual .thum_wrap .thum li{ float: left; width: 10px; height: 10px; border-radius: 50%; border: 1px solid #fff; margin-right: 10px; cursor: pointer; }
#main .main_visual .thum_wrap .thum li:first-child{ margin-left: 0; }
#main .main_visual .thum_wrap .thum li.on{ border-color: #FFCC00; background-color: #FFCC00; }

#main .main_visual .thum_wrap .thum li.last{ display: none; }


#main .main_visual .box2 .thum_wrap .thum li:nth-child(2){ border-color: #FFCC00; background-color: #FFCC00; }
#main .main_visual .box3 .thum_wrap .thum li:nth-child(3){ border-color: #FFCC00; background-color: #FFCC00; }

#main .main_visual .scroll{ position: absolute; left: 50%; bottom: 50px; transform: translate(-50%,0); z-index: 10; }
#main .main_visual .scroll strong{ display: block; font-size: 14px; font-weight: 500; color:#fff; }
#main .main_visual .scroll svg{ display: block; margin: 0 auto; margin-top: 15px;
  animation: mouse 1s infinite ease-in-out;
}
#main .main_visual .scroll svg #r01{ animation: dots1 1s infinite; }
#main .main_visual .scroll svg #r02{ animation: dots2 1s infinite; }
#main .main_visual .scroll svg #r03{ animation: dots3 1s infinite; }

@keyframes mouse {
  50%{
    transform: translateY(10px);
  }
  100%{
    transform: translateY(0);
  }
}

@keyframes dots1 {
  100%{
    transform: translateY(18px);
  }
}

@keyframes dots2 {
  100%{
    transform: translateY(12px);
  }
}

@keyframes dots3 {
  100%{
    transform: translateY(6px);
  }
}

/* 메인컨텐츠 공통 */
#main .title_box .clip{ position: relative; overflow: hidden; }
#main .title_box p{ display: inline-block; font-size: 24px; font-weight: 600; color:#FFAA00; margin-bottom: 10px; }
#main .title_box strong{ display: inline-block; font-size: 60px; font-weight: 600; color:#000000; line-height: 80px; }
#main .con_w{ padding: 165px 0; }
.swiper-wrapper{ height: auto !important; }

#main .btn{ width: 200px; height: 60px; margin-top: 50px; }
#main .btn a{ display: block; position: relative; width: 100%; height: 100%; border-radius: 100px; background-color: #FFCC00; overflow: hidden;
  transition: background .4s;
}
#main .btn a ul li{ float: left; width: 200px; height: 100%; text-align: center; color: #fff; font-size: 20px; font-weight: 600; line-height: 60px; }
#main .btn a ul{ position: absolute; right: 0; top: 0; width: 400px; transition: right .4s; }
#main .btn a:hover ul{ right: -100%; }
#main .btn a:hover{ background-color: #FFAA00; }



#main .title_box p{
  transform: translate3d(0px, 200%, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 10deg); transition: transform 1s; transform-style: preserve-3d;
}

#main .on .title_box p{
  transform: translate3d(0px, 0%, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
}

#main .title_box strong{
  transform: translate3d(0px, 200%, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 10deg); transition: transform 1s; transform-style: preserve-3d; transition-delay: .2s;
}

#main .on .title_box strong{
  transform: translate3d(0px, 0%, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
}

#main .clip2 .title_box strong{
  transition-delay: .4s;
}


/* con01 */
#main .con01 .title_box{ text-align: right;background-color: #F9F9F9; border-radius: 20px; padding: 38px 50px; }
#main .con01 .what_s .swiper-slide{ border-radius: 20px; box-shadow: 0px 0px 50px rgba(0,0,0,0.1); width: 900px; height: 400px; position: relative; }
#main .con01 .what_s { overflow: visible; margin-top: 50px; }
#main .con01 .what_s .swiper-slide .wrap{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; padding: 0 50px; }
#main .con01 .what_s .swiper-slide .wrap dl dt{ float: left; font-size: 72px; font-weight: 800; color: #EEEEEE; margin-right: 100px; position: relative; line-height: 242px; }
#main .con01 .what_s .swiper-slide .wrap dl dt:after{ content:""; display: block; width: 1px; height: 100px; background-color: #DDDDDD; position: absolute; right: -40px; top: 50%; transform: translate(0,-50%);}
#main .con01 .what_s .swiper-slide .wrap dl dt span{ color: #FFCC00; }
#main .con01 .what_s .swiper-slide .wrap dl dd{ float: left; }
#main .con01 .what_s .swiper-slide .wrap dl dd svg{ display :block; margin-bottom: 20px; }
#main .con01 .what_s .swiper-slide .wrap dl dd strong{ font-size: 36px; font-weight: 600; color:#000000; display: block; margin-bottom: 20px; }
#main .con01 .what_s .swiper-slide .wrap dl dd p{ font-size: 20px; font-weight: 400; color:#000000; display: block; line-height: 30px; }

#main .con01 .what_s{ transform: translateY(50px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .6s; }
#main .con01.on .what_s{ transform: translateY(0); opacity: 1; }


/* con02 */
#main .con02{ height: 970px; }
#main .con02 .inner{ display: flex;  justify-content: space-between; justify-content: center; align-items: center;
  height: 100%;
}
#main .con02 .left{ width: 48%; margin-right: 4%; }
#main .con02 .right{ width: 48%; height: 100%; filter : blur(20px); opacity: 0; transition: filter 1s, opacity 1s; transition-delay: .6s; }
#main .con02.on .right{ filter: blur(0); opacity: 1; }



#main .con02 .right .img_s{ width: 100%; height: 100%; overflow: hidden; }
#main .con02 .right .img_s .swiper-container{ height: 100%; width: 100%; }
#main .con02 .right .img_s .swiper-wrapper{ height: 100% !important; width: 100%; }
#main .con02 .right .img_s .swiper-slide{ height: 100% !important;
  display: flex;
  justify-content: center;
  align-items: center;
}
#main .con02 .left .txt_slide{ position: relative; transform: translateX(-50px); opacity: 0;transition: transform 1s, opacity 1s;  transition-delay: .6s;  }
#main .con02.on .left .txt_slide{ transform: translateX(0); opacity: 1; }
#main .con02 .left .txt_slide .swiper-slide .box{ background-color: #F9F9F9; border-radius: 20px; padding: 60px 0; padding-left: 110px; margin-top: 50px; }
#main .con02 .left .txt_slide .swiper-slide .box strong{ display: block; font-size: 36px; color:#000000; font-weight: 600; margin-bottom: 20px; }
#main .con02 .left .txt_slide .swiper-slide .box p{ font-size: 24px; line-height: 36px; color: #000; }

#main .con02 .left .txt_slide .swiper-pagination{ position: absolute; left: 50px; top: 42%; transform: translate(0,-50%); width: auto; height: auto; bottom: auto; }
#main .con02 .left .txt_slide .swiper-pagination-bullet{ background-color: #DDDDDD; opacity: 1; width: 10px; height: 10px; margin: 0; display: block; margin-top: 10px; }
#main .con02 .left .txt_slide .swiper-pagination-bullet:first-child{ margin-top: 0; }
#main .con02 .left .txt_slide .swiper-pagination-bullet-active{ background-color: #FFCC00; }


#main .con03 .title_box{ text-align: center; }
#main .con03 .list{ display: flex; gap: 10px 0.66666%; flex-wrap: wrap; padding: 0 15px; margin-top: 50px; }
#main .con03 .list .box{ width: 24.5%; border-radius: 20px; position: relative; overflow: hidden;
  transform: translateY(50px); opacity: 0; transition: transform 1s, opacity 1s;
}
#main .con03.on .list .box{ transform: translateY(0); opacity: 1; }

#main .con03.on .list .box:nth-child(1){ transition-delay: .6s; }
#main .con03.on .list .box:nth-child(2){ transition-delay: .7s; }
#main .con03.on .list .box:nth-child(3){ transition-delay: .8s; }
#main .con03.on .list .box:nth-child(4){ transition-delay: .9s; }
#main .con03.on .list .box:nth-child(5){ transition-delay: 1s; }
#main .con03.on .list .box:nth-child(6){ transition-delay: 1.1s; }
#main .con03.on .list .box:nth-child(7){ transition-delay: 1.2s; }
#main .con03.on .list .box:nth-child(8){ transition-delay: 1.3s; }

#main .con03 .list .box a > img{ width: 100%; display: block; filter: blur(0); transition: filter .4s; }
#main .con03 .list .box .hover_box{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(255,255,255,0.6); z-index: 1; opacity: 0; transition: opacity .4s; }
#main .con03 .list .box a{ display: block; width: 100%; height: 100%; }
#main .con03 .list .box .hover_box .wrap{ position: absolute; left: 0; top: 50%; transform: translate(0,-50%); width: 100%; text-align: center; }
#main .con03 .list .box .hover_box .wrap > span{ display: block; width: 160px; height: 50px; border-radius: 50px; background-color: #FFCC00; text-align: center; line-height: 50px; color: #fff; font-size: 18px; font-weight: 600; margin: 0 auto; margin-bottom: 10px; }
#main .con03 .list .box .hover_box .wrap > strong{ display: block; font-size: 24px; font-weight: 600; color: #000; }
#main .con03 .list .box a:hover > img{ filter: blur(10px); }
#main .con03 .list .box a:hover .hover_box{ opacity: 1; }

#main .con04 { margin-bottom: 160px; }
#main .con04 .wrap{ position: relative; transform: translateY(50px); opacity: 0; transition: transform 1s, opacity 1s; }
#main .con04.on .wrap{ transform: translateY(0); opacity: 1; }
#main .con04 .wrap .bg_img img{ display: block; border-radius: 20px; }
#main .con04 .wrap .txt{ position: absolute; text-align: center; left: 50%; top: 50%; transform: translate(0,-50%); text-align: center; width: 50%; }
#main .con04 .wrap .txt .btn{ margin: 0 auto; margin-top: 50px; filter: blur(20px); opacity: 0; transition: filter 1s, opacity 1s; transition-delay: .6s; }
#main .con04.on .wrap .txt .btn{ filter: blur(0); opacity: 1; }

#main .con04 .wrap .bg_img .pc_img{ display: block; }
#main .con04 .wrap .bg_img .mo_img{ display: none; }


#main .con05{ position: relative; }
#main .con05 .inner{ position: absolute; left: 0; right: 0; top: 0; height: 100%; z-index: 1; }
#main .con05 .wrap{ width: 50%; text-align: center; position: absolute; left: 0; top: 57%; transform: translate(0,-50%);}
#main .con05 .btn{ margin: 0 auto; transform: translate(-30px);}
#main .con05 .bg_img{ position: relative; width: 100%; height: 100%; overflow: hidden; }
#main .con05 .bg_img img{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); min-width: 100%; }

#main .con05 .bg_img img{ transform: translate(-50%,-50%) scale(1.1); opacity: 0; transition: transform 3s, opacity 1s; }
#main .con05.on .bg_img img{ transform: translate(-50%,-50%) scale(1); opacity: 1; }
#main .con05 .btn{ margin: 0 auto; margin-top: 50px; filter: blur(20px); opacity: 0; transition: filter 1s, opacity 1s; transition-delay: .6s; }
#main .con05.on .btn{ filter: blur(0); opacity: 1; }

#main .con05 .bg_img .pc_img{ display: block; }
#main .con05 .bg_img .mo_img{ display: none; }


#main .con06 .list{ display: flex; flex-wrap: wrap; width: 100%; margin-top: 50px; }
#main .con06 .list .box{ width: 20%; }

#main .con06 .list .box{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s;
}
#main .con06.on .list .box{ transform: translateY(0); opacity: 1; }

#main .con06.on .list .box:nth-child(1){ transition-delay: .6s; }
#main .con06.on .list .box:nth-child(2){ transition-delay: .7s; }
#main .con06.on .list .box:nth-child(3){ transition-delay: .8s; }
#main .con06.on .list .box:nth-child(4){ transition-delay: .9s; }
#main .con06.on .list .box:nth-child(5){ transition-delay: 1s; }
#main .con06.on .list .box:nth-child(6){ transition-delay: 1.1s; }
#main .con06.on .list .box:nth-child(7){ transition-delay: 1.2s; }
#main .con06.on .list .box:nth-child(8){ transition-delay: 1.3s; }
#main .con06.on .list .box:nth-child(9){ transition-delay: 1.4s; }
#main .con06.on .list .box:nth-child(10){ transition-delay: 1.5s; }



@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

}

@media (min-width: 1920px){
  .main_visual{ height: 100vh; }
}

@media (max-width: 1919px){
.main_visual .main_slider .slide_box .main_img #videobcg{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}

}

@media (max-width: 1416px){
  .main_visual .in_inner{ width: 100%; padding: 0 20px; }
  .inner{ padding: 0 20px; width: 100%; }
  #main .con02 .right .img_s .swiper-slide img{ width: 100%; display: block; }
  #main .con04 .wrap .bg_img img{ width: 100%; }
  #main .con05 .bg_img img{ width: 100%; }
  #main .con05 .btn{ transform: translateX(0);}
  #main .con05 .wrap{width: 60%; }
  #main .con06 .list .box img{ width: 100%; }
}


@media (max-width: 980px){
  #main .main_visual .in_inner .in_obj strong{ font-size: 80px; }
  #main .main_visual .in_inner .in_obj p{ font-size: 18px; line-height: 28px; }
  #main .title_box p{ font-size: 18px; }
  #main .title_box strong{ font-size: 32px; line-height: 46px; }
  #main .con_w{ padding: 110px 0; }
  #main .con01 .what_s .swiper-slide .wrap dl dd strong{ font-size: 24px; margin-bottom: 10px; }
  #main .con01 .what_s .swiper-slide .wrap dl dd p{ font-size: 14px; line-height: 22px; }
  #main .con01 .what_s .swiper-slide .wrap dl dd svg{ width: 80px; height: auto; }
  #main .con01 .what_s .swiper-slide .wrap dl dt{ font-size: 50px; line-height: 199px;}
  #main .con01 .what_s .swiper-slide{ height: 300px; width: 700px; }
  #main .con02{ height: 100vh; }
  #main .con03 .list .box .hover_box .wrap > strong{ font-size: 18px; }
  #main .con03 .list .box .hover_box .wrap > span{width: 120px; height: 42px; line-height: 42px; font-size: 16px; }
  #main .btn{ width: 160px; height: 50px; margin-top: 30px; }
  #main .btn a ul{ width: 320px; }
  #main .btn a ul li{width: 160px; line-height: 50px; font-size: 16px; }
  #main .con04 .wrap .txt .btn{ margin-top: 30px; }
  #main .con04{ margin-bottom: 110px; }
  #main .con05 .bg_img img{ position: static; transform: scale(1.1); }
  #main .con05.on .bg_img img{ transform: scale(1); }
  #main .con05 .bg_img{ height: auto; }
  #main .con02 .left .txt_slide .swiper-slide .box{ padding-left: 60px; margin-top: 30px; }
  #main .con02 .left .txt_slide .swiper-slide .box strong{ font-size: 24px; margin-bottom: 10px; }
  #main .con02 .left .txt_slide .swiper-slide .box p{ font-size: 16px; line-height: 26px; }
  #main .con02 .left .txt_slide .swiper-pagination{ left: 25px; }

}



@media (max-width: 800px){
  #main .main_visual .in_inner .in_obj strong{ font-size: 60px; }
  #main .main_visual .in_inner .in_obj p{ font-size: 16px; line-height: 26px; }
  #main .main_visual .scroll svg{ width: 20px; height: auto; }
  #main .con01 .what_s .swiper-slide .wrap dl dt{ line-height: 1em; float: none; width: 100%; padding-bottom: 20px; border-bottom: 1px solid #efefef; margin-bottom: 20px; }
  #main .con01 .what_s .swiper-slide .wrap{ padding: 30px; position: static; transform: translate(0,0);}
  #main .con01 .what_s .swiper-slide .wrap dl dt:after{ display: none; }
  #main .con01 .what_s .swiper-slide .wrap dl dd svg{ width: 60px; }
  #main .con01 .what_s .swiper-slide{ height: auto; width: 400px; }
  #main .con01 .what_s .swiper-slide .wrap dl dd p br{ display: none; }
  #main .con01 .what_s .swiper-slide .wrap dl dd p{ word-break: keep-all; }
  #main .con02{ height: 600px; }
  #main .con03 .list .box{ width: 49.5%; }
  #main .con03 .list{ gap: 10px 1%; }
  #main .title_box strong{ font-size: 26px; line-height: 38px; }
  #main .title_box p{ font-size: 16px; }
  #main .con06 .list .box{ width: 25%; }
  #main .con06{  padding-bottom: 0; }
}

@media (max-width: 540px){
  #main .main_visual .in_inner .in_obj strong{ font-size: 40px; }
  #main .main_visual .in_inner .in_obj p{ font-size: 14px; line-height: 24px; }
  #main .main_visual .thum_wrap{ bottom: 0; transform: translateY(-30px);}
  #main .main_visual .progress{ margin-top: 25px; }
  #header .lang button{ font-size: 14px; }
  #header .lang svg{ margin-left: 6px;
    transform: translateY(-1px); }
    #main .con_w{ padding: 60px 0; }
    #main .title_box p{ margin-bottom: 5px; }
    #main .con01 .title_box{ padding: 25px 20px; text-align: left; }
    #main .con01 .what_s{ margin-top: 30px; }
    #main .con01 .what_s .swiper-slide .wrap dl dd strong{ font-size: 20px; }
    #main .con01 .what_s .swiper-slide{ width: 300px; box-shadow: 0px 0px 30px rgba(0,0,0,0.05); }
    #main .con02 .left{ width: 100%; margin-right: 0;}
    #main .con02 .right{ width: 100%; margin-left: 0; }
    #main .con02 .inner{ flex-wrap: wrap; }
    #main .con02{ height: auto; }
    #main .con02 .right .img_s .swiper-slide{ height: 540px !important;  }
    /* #main .con02 .right .img_s .swiper-container{ height: 480px !important;  } */
    #main .con02 .right .img_s{ height: 540px !important;  }
    #main .con02 .right{ height: auto !important;  }
    #main .con02 .inner{ height: auto !important; }
    #main .title_box strong{ font-size: 22px; line-height: 32px; }
    #main .con04 .wrap .txt .btn{ margin-top: 20px; }
    #main .btn{ width: 130px; height: 42px; }
    #main .btn a ul{ width: 260px; }
    #main .btn a ul li{width: 130px; line-height: 42px; font-size: 14px; }
    #main .con04{ margin-bottom: 60px; }
}

@media (max-width: 414px){
#main .main_visual .thum_wrap{ transform: translateY(-120px);right: auto; left: 0; }
#main .main_visual .in_inner .in_obj p{ word-break: keep-all; }
#main .main_visual .in_inner .in_obj p br{ display: none; }
#main .main_visual .scroll strong{ display: none; }
#main .main_visual .scroll svg{ margin-top: 0; }
#main .main_visual .scroll{ left:20px; text-align: left; transform: translate(0,0); bottom: 40px; }
  #main .con06 .list .box{ width: 50%; }
  #main .con02 .right .img_s{ height: 400px !important; }
  #main .con02 .right .img_s .swiper-slide{ height: 400px !important; }
  #main .con04 .wrap .bg_img .pc_img{ display: none; }
  #main .con04 .wrap .bg_img .mo_img{ display: block; }
  #main .con04 .wrap .txt{ width:100%; transform: translate(0,0); left: 0; top: 60%; }
  #main .con05 .bg_img .pc_img{ display: none; }
  #main .con05 .bg_img .mo_img{ display: block; }
  #main .con05 .wrap{ width: 100%; top: 31%; }
  #main .con05 .btn{ margin-top: 0; }
  #main .con06 .list{ margin-top: 20px; }
}

@media (max-width: 300px){
  #main .main_visual .in_inner .in_obj strong{ font-size: 30px; }
  #main .title_box strong{ word-break: keep-all; }
  #main .con_w{ padding: 40px 0; }
  .inner{ padding: 0 12px; }
  .main_visual .in_inner{ padding: 0 12px; }
  #header h1{ left: 12px; }
  #header .all_menu_b{ right: 12px; }
  #header .lang{ right: 50px; }
  #main .con01 .what_s .swiper-slide{ width: 220px; }
  #main .con01 .what_s .swiper-slide .wrap dl dd strong{ font-size: 18px; word-break: keep-all; }
  #main .con01 .what_s .swiper-slide .wrap{ padding: 30px 20px;  }
  #main .con01 .what_s .swiper-slide .wrap dl dt{ font-size: 30px; }
  #main .con02 .left .txt_slide .swiper-slide .box{ padding-left: 40px; }
  #main .con02 .left .txt_slide .swiper-pagination{ left: 16px;  }
  #main .con02 .left .txt_slide .swiper-slide .box{ padding: 30px 0; padding-left: 40px; }
  #main .con02 .left .txt_slide .swiper-slide .box p{ font-size: 14px; line-height: 22px; }
  #main .con02 .left .txt_slide .swiper-slide .box strong{ font-size: 20px; margin-bottom: 5px; }
  #main .con02 .left .txt_slide .swiper-slide .box p{ font-size: 14px; line-height: 22px; }
  #main .con04{ margin-bottom: 40px; }
}