<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">.inner{width: 1520px; margin: 0 auto; }
#footer{z-index: 999;position: relative}


/*html, body{ overflow-x: hidden; }*/


/* 硫붿씤鍮꾩＜�� */
.main_visual{width:100%;position: fixed; height: 100dvh; }




.main_img{ position: fixed; height: 100%; width: 100%; left: 0; top: 0; background-color: #fff; clip-path: circle(0% at 50% 50%); transition: clip-path 1.5s; left: 0; top: 0; }
.main_img.on{ clip-path: circle(11% at 50% 50%); }
.main_img.on2{ clip-path: circle(1200px); }


.main_img:after{ content:""; display: block; width: 100%; height: 100%; background-color: #001F3B; opacity: .2; mix-blend-mode: multiply; position: absolute; left: 0; top: 0; }
.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 .main_visual .main_slider .slide_box .bgs{ position: absolute; left: 12%; top: 50%; transform: translate(-50%,-50%); }

.main_visual .main_slider .slide_box &gt; 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 &gt; 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 &gt; div.on{ z-index: 5; opacity:1;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}



/*�④낵*/

#main .main_visual .in_inner .in_obj strong{ font-size: 54px; line-height: 72px; font-weight: 700; color:#fff; display: block; }

.main_visual .main_slider .slide_box div .in_obj strong{
  transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; transform-style: preserve-3d;
}

.main_visual .main_slider .slide_box div.on2 .in_inner .in_obj strong{
  transform: translateY(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 .main_slider .slide_box .bgs{ transition: left 1s, opacity 1s; left: 9%; opacity: 0; transition-delay: .6s; }
#main .main_visual .main_slider .slide_box div.on2 .bgs{ left: 12%; opacity: 1; }  



#main .main_visual .in_inner{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 1520px; }
#main .main_visual .in_inner strong{ display: block; font-size: 60px; line-height: 80px; color:#FFFFFF; font-weight: 400; }

.intro{ opacity: 0; }
.fp-viewing-home .intro{ opacity: 1; }

.intro{ position: fixed; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; height: 100dvh; display: flex; align-items: center; justify-content: center; text-align: center; z-index: 3; flex-flow: column; }

.intro .txt{ display: flex; flex-flow: column; gap: 6px; transition: gap 1.5s; }
.intro .txt strong{ font-size: 48px; color:#3B3B3B; font-weight: 700; display: block; opacity: 0; transition: opacity 1s; }
.intro.ac .txt strong:nth-child(1){ opacity: 1; }
.intro.ac .txt strong:nth-child(2){ opacity: 1; transition-delay: .4s; }
.intro .txt strong b{ padding: 6px 12px; position: relative; transition: color .3s; transition-delay: .5s; }
.intro .txt strong b:before{ content: ""; display: block; width: 0; height: 100%; background-color: #0055A4; position: absolute; left: 0; top: 0; z-index: -1; transition: width .5s; transition-delay: .5s; }



.intro.on .txt{ gap: 370px; }
.intro.on .txt strong b:before{ width: 100%; }
.intro.on .txt strong b{ color: #fff; }

#main .main_visual .in_inner strong{ transform: translateY(50px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .5s; }
#main .main_visual.on2 .in_inner strong{ transform: translateY(0); opacity: 1; }



.main_visual.no .in_inner strong{ opacity: 0 !important; transition-delay: 0 !important; }




#main .main_visual .main_nav{ position: absolute; left: 50%; bottom: 70px; transform: translate(-50%,200%); width: 790px; display: flex; justify-content: center; align-items: center; height: 70px; border-radius: 100px; background-color: rgba(0,96,185,0.8); backdrop-filter: blur(10px) brightness(110%); gap: 20px;z-index: 3; transition: transform 1s; transition-delay: .5s; }
#main .main_visual .main_nav div{ display: flex; align-items: center; gap: 20px; }
#main .main_visual .main_nav div:after{ content:""; display: block; width: 1px; height:22px; background-color: rgba(255,255,255,0.2);}
#main .main_visual .main_nav div:last-child:after{ display: none; }
#main .main_visual .main_nav div a{ display: flex; align-items: center; gap: 15px; }
#main .main_visual .main_nav div a strong{ font-size: 18px; color:#fff; font-weight: 400; }
#main .main_visual .main_nav div a svg circle{ transition: fill .3s; }
#main .main_visual .main_nav div a svg path{ transition: stroke .3s; }
#main .main_visual .main_nav div a:hover svg circle{ fill: #003363; }
#main .main_visual .main_nav div a:hover svg path{ stroke: #fff; }

#main .main_visual .scroll{ position: absolute; left: 50%; width: 100%; bottom: 76px; transform: translate(-50%,0); z-index: 2; }
#main .main_visual .scroll .inner{ display: flex; align-items: center; gap: 12px; }
#main .main_visual .scroll strong{ font-size: 14px; color: #fff; font-weight: 400; }
#main .main_visual .scroll .mouse{ width: 15px; height: 25px; border: 1px solid #fff; border-radius: 50px; position: relative; }
#main .main_visual .scroll .mouse span{ display: block; width: 3px; height: 6px; border-radius: 60px;background-color: #fff; position: absolute; left: 50%; top: 5px; transform: translate(-50%,0); animation: mouse 1s ease-in-out infinite; }

#main .main_visual.on2 .main_nav{ transform: translate(-50%,0); }
#main .main_visual.no .main_nav{ transform: translate(-50%,200%) !important;; transition-delay: 0 !important; }





@keyframes mouse {
    0%{
        top: 5px;
    }
    50%{
        top: 12px;
    }
    100%{
        top: 5px;
    }
}

#main .con00{ width: 100%; height: 100vh; }
/*#main{ overflow-x: hidden; }*/
#main .con_w{ position: relative; z-index: 5; height: 100vh; width: 100%;  }
#main .con01{ background: background: rgb(0,6,12);
background: linear-gradient(90deg, rgba(0,6,12,0.15) 0%, rgba(0,6,12,.5) 100%);  }
#main .con01 .inner{ display: flex; gap: 30px; height: 100%; align-items: center; padding-top: 110px; }
#main .con01 .inner .left{ display: flex; flex-flow: column; gap: 30px; width: 70%; height: calc(100% - 200px); }
#main .con01 .inner .right{ width: 30%; height: calc(100% - 200px); }
#main .con01 .inner .right .wrap{ display: flex; flex-flow: column; gap: 30px; height: 100%; }
#main .con01 .inner .right .wrap &gt; div{ width: 100%; height: 50%; }

#main .con01 .wrap .box { height: 100%; }
#main .con01 .wrap .box a{ border-radius: 16px; padding: 50px; position: relative; display: flex; flex-flow: column; height: 100%; width: 100%; justify-content: space-between; }

#main .con01 .wrap .box .txt{ display: flex; flex-flow: column; gap: 12px; }
#main .con01 .wrap .box .txt strong{ font-size: 24px; font-weight: 700; color: #fff; transition: color .3s; }
#main .con01 .wrap .box .txt p{ font-size: 17px; line-height: 28px; color:#FFFFFF; transition: color .3s; }
#main .con01 .wrap .box .arrow{ width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background-color: #fff; transition: background .3s; }
#main .con01 .wrap .box .arrow .wr{ overflow: hidden; width: 20px; height: 20px; position: relative; }
#main .con01 .wrap .box .arrow .wr img{ transform: translateX(-50%); transition: transform .3s; }

#main .con01 .wrap .box5 a{ background-color: rgba(0,45,87,0.5); backdrop-filter: blur(10px) brightness(95%); transition: background .3s, backdrop-filter .3s, transform 1s; }

#main .con01 .wrap .box6 a{ background-color: rgba(0,49,133,0.5); backdrop-filter: blur(10px) brightness(110%); transition: background .3s, backdrop-filter .3s, transform 1s;  }

#main .con01 .wrap .box5 a:hover{ backdrop-filter: blur(0) brightness(100%); background: rgba(0,45,87,1); }

#main .con01 .wrap .box6 a:hover{ backdrop-filter: blur(0) brightness(100%); background: rgba(23,69,146,1); }

#main .con01 .wrap .box:hover .arrow .wr img{ transform: translateX(0); }

#main .con01 .wrap .box:hover .arrow2{ background-color: #0055A4; }

#main .con01 .wrap .box{ perspective: 1000px; }
#main .con01 .wrap .box a{ transform: rotateY(-90deg) translate(0,0); }
#main .con01 .wrap .box2 a{ transform: rotateX(90deg) translate(0,0); }
#main .con01 .wrap .box4 a{ transform: rotateX(-90deg) translate(0,0); }
#main .con01 .wrap .box6 a{ transform: rotateX(-90deg) translate(0,0); }

#main .con01.active .wrap .box a{ transform: rotateY(0) translate(0,0); }


#main .con01 .left .wrap{ display: flex; gap: 30px; }
#main .con01 .left .wrap1{ height: 40%; }

#main .con01 .left .wrap1 .box1{ width: 35%; }
#main .con01 .left .wrap1 .box2{ width: 65%; }

#main .con01 .left .wrap1 .box1 a{ background-color: rgba(255,255,255,0.0); backdrop-filter: blur(10px) brightness(115%); transition: background .3s, backdrop-filter .3s, transform 1s; }

#main .con01 .left .wrap1 .box2 a{ backdrop-filter: blur(10px); transition: background .3s, backdrop-filter .3s, transform 1s; background: url('/img/main/con01_box02_bg.png') right bottom no-repeat; background-color: rgba(0,133,255,0.7);}


#main .con01 .left .wrap2 .box3 a{ background-color: rgba(0,58,112,0.5); backdrop-filter: blur(10px) brightness(110%); transition: background .3s, backdrop-filter .3s, transform 1s; }

#main .con01 .left .wrap2 .box4 a{ backdrop-filter: blur(10px) brightness(95%); transition: background .3s, backdrop-filter .3s, transform 1s; background-color: rgba(255,255,255,0.2);}


#main .con01 .left .wrap1 .box1 a:hover{ backdrop-filter: blur(0) brightness(100%); background: rgba(255,255,255,1); }

#main .con01 .left .wrap1 .box2 a:hover{ backdrop-filter: blur(0) brightness(100%); background-color: rgba(0,118,226,1); }


#main .con01 .left .wrap2 .box3 a:hover{ backdrop-filter: blur(0) brightness(100%); background: rgba(0,86,167,1); }

#main .con01 .left .wrap2 .box4 a:hover{ backdrop-filter: blur(0) brightness(100%); background: rgba(255,255,255,1); }

#main .con01 .wrap .wt a:hover .txt strong{ color: #333333; }
#main .con01 .wrap .wt a:hover .txt p{ color: #666666; }




#main .con01 .left .wrap2{ height: 60%; }
#main .con01 .left .wrap2 .box{ width: 50%; }


#main .con02{ background-color: #fff; }
/*#main .con02 .inner{ display: flex; align-items: center; gap: 140px; }*/
#main .con02 .inner { position: relative; width: 100%; padding-left: 10.417%; }
#main .con02 .r_slide{ width: 1200px; overflow: hidden; position: absolute; right: 0; top: 50%; transform: translate(0,-50%); }
#main .con02 .r_slide .swiper-wrapper{ height: auto; }

#main .con02 .r_slide .swiper-slide{transition: margin 1s}
#main .con02 .r_slide .swiper-slide .w_area{perspective: 500px;padding-top: 60px;padding-bottom: 60px;}
#main .con02 .r_slide .swiper-slide .w_area a{ transform: rotateY(-16deg) translate(0,0);transition: 0.7s;position: relative; display: block; cursor: default; }
#main .con02 .r_slide .swiper-slide-active .w_area a{ transform: rotateY(0deg) translate(0,0);}
#main .con02 .r_slide .swiper-slide-active { margin-right: -240px !important;z-index: 4}
#main .con02 .r_slide .swiper-slide-next{z-index: 3}
#main .con02 .r_slide .swiper-slide-next + div{z-index: 2}

#main .con02 .r_slide .swiper-slide .w_area a{ width: 380px; padding: 12px; border-radius: 16px; background-color: #fff; box-shadow: 0 0 40px rgba(158,169,180,0.3); padding-bottom: 30px; }
#main .con02 .r_slide .swiper-slide .w_area a .img img{ display: block; border-radius: 8px; width: 100%; }
#main .con02 .r_slide .swiper-slide .w_area a .txt { padding-top: 30px; }
#main .con02 .r_slide .swiper-slide .w_area a .txt strong{ font-size: 18px; line-height: 30px; color:#333333; padding-left: 18px; display: block;
    flex: 1;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    word-break: break-all;
}

#main .con02 .r_slide .swiper-slide .w_area a .txt .cate{ margin-top: 55px; height: 48px; border-radius:  0 50px 50px 0; background-color: #F4F7FB; padding-left: 30px; position: relative; align-items: center; gap: 6px;  display: flex; width: calc(100% + 12px); transform: translateX(-12px); }
#main .con02 .r_slide .swiper-slide .w_area a .txt .cate .sp{ display: block; font-size: 15px; color:#0055A4; display: flex; align-items: center; gap: 6px; }
#main .con02 .r_slide .swiper-slide .w_area a .txt .cate .sp:before{ content:""; display: block; width: 3px; height: 3px; border-radius: 50%; background-color: #0055a4; }
#main .con02 .r_slide .swiper-slide .w_area a .txt .cate svg{ position: absolute; right: 5px; top: 50%; transform: translate(0,-50%); display: none; }
#main .con02 .r_slide .swiper-slide .w_area a .txt .cate .sp:first-child:before{ display: none; }

#main .con02 .r_slide .swiper-slide-prev{ opacity: 0; }

#main .con02 .r_slide .swiper-slide-active .w_area a{ background-color: #0055A4; }
#main .con02 .r_slide .swiper-slide-active .w_area a .txt .cate{ background-color: #003A70; }
#main .con02 .r_slide .swiper-slide-active .w_area a .txt .cate .sp{ color: #fff; }
#main .con02 .r_slide .swiper-slide-active .w_area a .txt .cate .sp:before{ background-color: #fff; }
#main .con02 .r_slide .swiper-slide-active .w_area a .txt strong{ color: #fff; }

#main .con02 .m_tit{ width: 440px; }
#main .con02 .m_tit &gt; strong{ display: block; font-size: 40px; font-weight: 700; color:#3B3B3B; margin-bottom: 20px; }
#main .con02 .m_tit &gt; p{ font-size: 20px; line-height: 36px; color:#666666; }
#main .con02 .m_tit .control{ display: flex; position: relative; margin-top: 60px; }
#main .con02 .m_tit .control .swiper-pagination2{ position: static;  font-size: 0; display: flex; align-items: center; gap: 8px; }
#main .con02 .m_tit .control .swiper-pagination2 span{ font-size: 20px; color:#C5C5C5; width: 30px; text-align: left; position: relative; }
#main .con02 .m_tit .control .swiper-pagination2 span:nth-child(1){ color: #0055A4; font-weight: 700; position: relative; }
#main .con02 .m_tit .control .swiper-pagination2 span:nth-child(1):after{ content:""; display: block; width: 1px; height: 12px; background-color: #C5C5C5; position: absolute; right: 0; top: 50%; transform: translate(0,-50%); }

#main .con02 .m_tit .control .wrap{ display:flex; align-items: center; gap: 20px; }
#main .con02 .m_tit .control .wrap .swiper-pagination{ position: static; width: 140px; background-color: #CBD7E3; }
#main .con02 .m_tit .control .wrap .swiper-pagination .swiper-pagination-progressbar-fill{ background-color: #0055A4; }

#main .con02 .m_Tit .control .wrap .paging{ width: 140px; background-color: #CBD7E3; height: 2px; position: relative; }
#main .con02 .m_Tit .control .wrap .paging:after{ width: 0; height: 100%; content:""; display: block; background-color: #0055a4; position: absolute; left: 0; top: 0;
 animation: bar 2s linear infinite;
}

#main .con02 .go_btn{ position: static; margin-top: 40px; }
#main .con02 .go_btn a{ background-color: #f6f7f8; }


@keyframes bar {
    0%{
        width: 0;
    }
    100%{
        width: 100%;
    }
}


#main .con02 .m_tit .control .wrap .swiper-button-prev{ position: static; margin: 0; width: auto; height: auto; }
#main .con02 .m_tit .control .wrap .swiper-button-next{ position: static; margin: 0; width: auto; height: auto; }
#main .con02 .m_tit .control .wrap .swiper-button-next svg{ width: auto; height: auto; }
#main .con02 .m_tit .control .wrap .swiper-button-prev svg{ width: auto; height: auto; }

#main .con02 .m_tit .control .wrap .swiper-button-prev:after{ display: none; }
#main .con02 .m_tit .control .wrap .swiper-button-next:after{ display: none; }

#main .con03{ background-color: #002C54; position: relative; }
#main .con03 .inner &gt; svg{ position: absolute; left: 50%; top: 0;}
#main .con03 .inner{ display: flex; align-items: center; }
#main .con03 .left &gt; strong{ display: block; font-size: 40px; line-height: 64px; font-weight: 700; color:#FFFFFF; margin-bottom: 50px; }

#main .con03 .left .list{ display: flex; gap: 30px; }
#main .con03 .left .list &gt; div{ width: 280px; border-radius: 12px; background: rgb(0,55,104);
background: linear-gradient(235deg, rgba(0,55,104,1) 0%, rgba(0,44,84,0) 100%); padding: 60px 30px; padding-right: 20px; }
#main .con03 .left .list &gt; div &gt; em{ font-size: 24px; color:#638DB2; font-weight: 700; display: block;display: flex; align-items: center; gap: 10px; margin-bottom: 20px; }
#main .con03 .left .list &gt; div &gt; em:after{ content:""; width: 40px; height: 1px; background-color: #174875; }



#main .con02 .m_tit &gt; strong{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; }
.fp-viewing-result #main .con02 .m_tit &gt; strong{ transform: translateY(0); opacity: 1; }

#main .con02 .m_tit p{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .2s; }
.fp-viewing-result #main .con02 .m_tit p{ transform: translateY(0); opacity: 1; }

#main .con02 .m_tit .control{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .3s; }
.fp-viewing-result #main .con02 .m_tit .control{ transform: translateY(0); opacity: 1; }

#main .con02 .go_btn{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .4s; }
.fp-viewing-result #main .con02 .go_btn{ transform: translateY(0); opacity: 1; }



#main .con03 .left .list &gt; div .num_w{ overflow: hidden; height: 100px; position: relative; }
#main .con03 .left .list &gt; div .num_w .num{ display: flex; }
#main .con03 .left .list &gt; div .num_w .num ul li{ font-family: "ivyora-display", sans-serif; font-size: 100px; line-height: 1em; color: #fff; font-weight: 600; text-align: center; letter-spacing: -0.075em; }

#main .con03 .left .list &gt; div .num_w .ul01{ transform: translateY(-83%); transition: transform 2s ease-in-out; transition-delay: .3s; }
.fp-viewing-member #main .con03 .left .list &gt; div .num_w .ul01{ transform: translateY(0);  }

#main .con03 .left .list &gt; div .num_w .ul02{ transform: translateY(0); transition: transform 2s ease-in-out; transition-delay: .3s; }
.fp-viewing-member #main .con03 .left .list &gt; div .num_w .ul02{ transform: translateY(-83%);  }

#main .con03 .left .list &gt; div .num_w .ul03{ transform: translateY(-83%); transition: transform 2s ease-in-out; transition-delay: .3s; }
.fp-viewing-member #main .con03 .left .list &gt; div .num_w .ul03{ transform: translateY(0);  }

#main .con03 .left .list &gt; div .num_w .ul04{ transform: translateY(0); transition: transform 2s ease-in-out; transition-delay: .3s; }
.fp-viewing-member #main .con03 .left .list &gt; div .num_w .ul04{ transform: translateY(-83%);  }

#main .con03 .left .list &gt; div .num_w .ul05{ transform: translateY(-83%); transition: transform 2s ease-in-out; transition-delay: .3s; }
.fp-viewing-member #main .con03 .left .list &gt; div .num_w .ul05{ transform: translateY(0);  }

#main .con03 .left .list &gt; div .num_w .ul06{ transform: translateY(0); transition: transform 2s ease-in-out; transition-delay: .3s; }
.fp-viewing-member #main .con03 .left .list &gt; div .num_w .ul06{ transform: translateY(-83%);  }


#main .con03 .left &gt; strong{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; }
.fp-viewing-member #main .con03 .left &gt; strong{ transform: translateY(0); opacity: 1; }

#main .con03 .left .list &gt; div{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; }

#main .con03 .left .list &gt; div:nth-child(1){ transition-delay: .3s; }
#main .con03 .left .list &gt; div:nth-child(2){ transition-delay: .5s; }
#main .con03 .left .list &gt; div:nth-child(3){ transition-delay: .7s; }
.fp-viewing-member #main .con03 .left .list &gt; div{ transform: translateY(0); opacity: 1; }

#main .con03 .inner &gt; svg #pins &gt; g &gt; g{ transform: translateY(-20px); opacity: 0; transition: transform 1s, opacity 1s; }

.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; g &gt; g{ transform: translateY(0); opacity: 1; cursor: pointer; }
#main .con03 .inner &gt; svg #pins &gt; g text{ transition: fill .3s; }
#main .con03 .inner &gt; svg #pins &gt; g:hover text{ fill: #fff; }

#main .con03 .inner &gt; svg #pins &gt; g .pins{ transition: fill .3s; }
#main .con03 .inner &gt; svg #pins &gt; g:hover .pins{ fill: #fff; }


.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #蹂몄궗 &gt; g{ transition-delay: 0s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #寃쎌씤 &gt; g{ transition-delay: .15s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #寃쎄린遺곷� &gt; g{ transition-delay: .3s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #寃쎄린�⑤� &gt; g{ transition-delay: .45s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #寃쎄린�숇� &gt; g{ transition-delay: .6s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #媛뺤썝 &gt; g{ transition-delay: .75s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #異⑸궓���� &gt; g{ transition-delay: .9s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #以묐� &gt; g{ transition-delay: 1.05s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #異⑹젙 &gt; g{ transition-delay: 1.2s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #�꾨턿 &gt; g{ transition-delay: 1.35s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #愿묒＜�꾨궓 &gt; g{ transition-delay: 1.5s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #寃쎈궓 &gt; g{ transition-delay: 1.65s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #��援� &gt; g{ transition-delay: 1.8s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #�몄궛 &gt; g{ transition-delay: 1.95s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #遺��곌꼍�� &gt; g{ transition-delay: 2.1s; }
.fp-viewing-member #main .con03 .inner &gt; svg #pins &gt; #�쒖＜ &gt; g{ transition-delay: 2.25s; }




#main .con04{ background-color: #fff; position: relative;  }
#main .con04 .txt_it{ position: absolute; width: 100%; height: auto; display: flex; align-items: center; justify-content: center; left: 50%; top: 50%; transform: translate(-50%,-50%)}
#main .con04 .txt_it .wrap{ position: relative; }
#main .con04 .txt_it .wrap strong{ color:#CFCFCF; font-size: 40px; font-weight: 700; }
#main .con04 .txt_it .wrap .st2{ position: absolute; left: 0; top: 0; color: #3B3B3B; clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%); transition: clip-path 1.5s; transition-delay: .3s; }

.fp-viewing-business #main .con04 .txt_it .wrap .st2{ clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); }

#main .con04 .b_slide{ height: 590px; }
#main .con04 .b_slide .box{ height: 100%; width: 100%; display: flex; gap: 30px; }
#main .con04 .b_slide .wrap{ width: 66.5%; display: flex; flex-flow: wrap; gap :30px; height: 100%; }
#main .con04 .b_slide .wrap .b_box{ height: calc(50% - 15px); }
#main .con04 .b_slide .b_box{ cursor: pointer; position: relative; border-radius: 16px; overflow: hidden; }


#main .con04 .b_slide .b_box:before{ content:""; width: 12px; height: 12px; border-radius: 50%; background-color: #005AC1; opacity: .7; display: block; position: absolute; left: 0; bottom: 0; transform: translate(-100%,100%); transition: transform 1s; }

#main .con04 .b_slide .b_box:hover:before{ transform: translate(-100%,100%) scale(200);}

#main .con04 .b_slide .b_box .txt{ position: absolute; left: 0; bottom: 40px; padding: 0 40px; width: 100%; z-index: 1; }
#main .con04 .b_slide .b_box .txt strong{ font-size: 24px; display: block; margin-top: 10px; color:#FFFFFF; line-height: 1.5em; }
#main .con04 .b_slide .b_box .txt em{ font-size: 20px; font-weight: 500; color:#FFFFFF; }

#main .con04 .b_slide .wrap .b01, #main .con04 .b_slide .wrap .b04{ width: calc(67% - 15px); }
#main .con04 .b_slide .wrap .b02, #main .con04 .b_slide .wrap .b03{ width: calc(33% - 15px); }

#main .con04 .b_slide .wrap .b06, #main .con04 .b_slide .wrap .b09{ width: calc(67% - 15px); }
#main .con04 .b_slide .wrap .b07, #main .con04 .b_slide .wrap .b08{ width: calc(33% - 15px); }


#main .con04 .b_slide .wrap{ perspective: 2000px; }
#main .con04 .b_slide .b_box{ transform: rotateY(-90deg) translate(0,0); transition: transform 1s, opacity 1s; opacity: 0; }
#main .con04 .b_slide .b02{ transform: rotateX(90deg) translate(0,0); }
#main .con04 .b_slide .b03{ transform: rotateX(-90deg) translate(0,0); }
#main .con04 .b_slide .b04{ transform: rotateX(-90deg) translate(0,0); }
#main .con04 .b_slide .b05{ transform: rotateX(90deg) translate(0,0); }
#main .con04 .b_slide .b06{ transform: rotateX(-90deg) translate(0,0); }
#main .con04 .b_slide .b07{ transform: rotateX(-90deg) translate(0,0); }
#main .con04 .b_slide .b08{ transform: rotateX(90deg) translate(0,0); }
#main .con04 .b_slide .b09{ transform: rotateX(-90deg) translate(0,0); }
#main .con04 .b_slide .b10{ transform: rotateX(-90deg) translate(0,0); }


.fp-viewing-business #main .con04 .b_slide .b_box{ transform: rotateY(0) translate(0,0); opacity: 1; transition-delay: 2.5s; }
#main .con04 .swiper-pagination3{ opacity: 0; transition: opacity .3s;}
.fp-viewing-business #main .con04 .swiper-pagination3{ opacity: 1; transition-delay: 2.5s;  }
#main .con04 .txt_it{ opacity: 1; transition: opacity .3s;}
.fp-viewing-business #main .con04 .txt_it{ opacity: 0; transition-delay: 2.5s;  }


#main .con04 .b_slide .arrow{ width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background-color: #fff; transition: opacity .3s; position: absolute; right: 40px; bottom: 40px; opacity: 0; }
#main .con04 .b_slide .arrow .wr{ overflow: hidden; width: 20px; height: 20px; position: relative; }
#main .con04 .b_slide .arrow .wr img{ transform: translateX(-50%); transition: transform .3s; }

#main .con04 .b_slide .b_box:hover .arrow .wr img{ transform: translateX(0); }

#main .con04 .b_slide .wrap2{ width: 33.5%; height: 100%; }
#main .con04 .b_slide .wrap2 .b_box{ height: 100%; }

#main .con04 .b_slide .b01{ background: url('/img/main/b_img01.jpg') center center no-repeat ; background-size: cover; }
#main .con04 .b_slide .b02{ background: url('/img/main/b_img02.jpg') center center no-repeat ; background-size: cover; }
#main .con04 .b_slide .b03{ background: url('/img/main/b_img03.jpg') center center no-repeat ; background-size: cover; }
#main .con04 .b_slide .b04{ background: url('/img/main/b_img04.jpg') center center no-repeat ; background-size: cover; }
#main .con04 .b_slide .b05{ background: url('/img/main/b_img05.jpg') center center no-repeat ; background-size: cover; }
#main .con04 .b_slide .b06{ background: url('/img/main/b_img06.jpg') center center no-repeat ; background-size: cover; }
#main .con04 .b_slide .b07{ background: url('/img/main/b_img07.jpg') center center no-repeat ; background-size: cover; }
#main .con04 .b_slide .b08{ background: url('/img/main/b_img08.jpg') center center no-repeat ; background-size: cover; }
#main .con04 .b_slide .b09{ background: url('/img/main/b_img09.jpg') center center no-repeat ; background-size: cover; }
#main .con04 .b_slide .b10{ background: url('/img/main/b_img10.jpg') center center no-repeat ; background-size: cover; }

#main .con04 .b_slide .b_box:hover .arrow{ opacity: 1; }

#main .con04 .swiper-pagination3{ position: static; margin-top: 60px; position: relative; background-color: #EBECEE; }
#main .con04 .swiper-pagination3 .swiper-pagination-progressbar-fill{ background-color: #0055A4; }

#main .con05{ background-color: #F3F9FF; position: relative; z-index: 4; }

#main .con05 .m_tit{ position: relative; margin-bottom: 60px; }
#main .con05 .m_tit &gt; strong{ font-size: 40px; line-height: 64px; font-weight:700; color:#3B3B3B; }

#main .con05 .n_list ul{ display: flex; flex-flow: column; gap: 10px; }
#main .con05 .n_list ul li{ position: relative; }
#main .con05 .n_list ul li:after{ width: 150%; content:""; display: block; height: 100%; position: absolute; right: 0; top: 0; border-radius: 0 80px 80px 0; background-color: #0055A4; transform: translateX(-40px); opacity: 0; transition: transform .5s, opacity .5s; }
#main .con05 .n_list ul li a{ height: 110px; display: flex; padding: 0 40px; align-items: center; border-bottom: 1px solid #DCE6F1; position: relative; position: relative; z-index: 1; transition: border .3s; }
#main .con05 .n_list ul li a .tit{ display: flex; gap: 20px; align-items: center; }
#main .con05 .n_list ul li a .tit span{ height: 43px; padding: 0 20px; display:flex; align-items: center; color: #fff; font-size: 17px; border-radius: 70px; background-color: #00427F; }
#main .con05 .n_list ul li a .tit strong{ font-size: 20px; font-weight: 400; color:#3E4347;  }

#main .con05 .n_list ul li a .date{ position: absolute; right: 128px; top: 50%; transform: translate(0,-50%); }
#main .con05 .n_list ul li a .date p{ color: #909091; font-size: 16px; }
#main .con05 .n_list ul li a svg{ position: absolute; right: 40px; top: 50%;  transform: translate(0,-50%); opacity: 0; transition: opacity .3s; }

#main .con05 .n_list ul li:hover:after{ opacity: 1; transform: translateX(0); }
#main .con05 .n_list ul li:hover a { border-color: transparent; }
#main .con05 .n_list ul li:hover a .tit strong{ color: #fff; }
#main .con05 .n_list ul li:hover a .date p{ color: #fff; }
#main .con05 .n_list ul li:hover a svg{ opacity: 1; }

#main .con05 .m_tit{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; }
.fp-viewing-news #main .con05 .m_tit{ transform: translateY(0); opacity: 1; }
.fp-viewing-footer #main .con05 .m_tit{ transform: translateY(0); opacity: 1; }

#main .con05 .n_list{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .3s; }
.fp-viewing-news #main .con05 .n_list{ transform: translateY(0); opacity: 1; }
.fp-viewing-footer #main .con05 .n_list{ transform: translateY(0); opacity: 1; }


#main .go_btn{  display:flex; position: absolute; right: 25px; bottom: 0; }
#main .go_btn a{ padding: 8px 10px; padding-left: 20px; border-radius: 60px; background-color: #fff; display: flex; gap: 10px; align-items: center; transition: gap .3s; }
#main .go_btn a strong{ font-size: 18px; color:#0055A4; font-weight: 700; }
#main .go_btn a:hover{ gap: 30px; }



@media (min-width: 1920px){
    .main_img .on2{ clip-path: circle(200%); }

}



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

}




@media (max-width: 1540px){
    .inner{ width: 100%; padding: 0 20px; }
}

@media (max-width: 1800px){
    #main .con02 .inner{ padding-left: 40px; }
    #main .con02 .r_slide{ right: auto; left: 50%; }
}


@media (max-width: 1540px){
    #header h1{ left: 0; }
    #footer{  padding-top: 0; }
    .scroll_top{ width :60px; height: 60px; right: 20px; bottom: 20px; }
    .scroll_top button strong{ font-size: 12px; }
    .scroll_top button{ gap: 2px; }
    #main .main_visual .in_inner{ width: 100%; padding: 0 20px; }
    #main .con01 .wrap .box a { padding: 30px; } 
    #main .con01 .wrap .box .txt { gap: 4px; }
    #main .con01 .wrap .box .txt strong{ font-size: 16px; line-height: 1.5em; }
    #main .con01 .wrap .box .txt p{ font-size: 14px; }
}

@media (max-width: 1280px){
    #footer .wrap .info{ margin-bottom: 40px;  }
    #footer .wrap .btns{ position: static; flex-flow: nowrap; margin-bottom: 40px; }
    
    #main .con03 .left &gt; strong{ font-size: 24px; line-height: 1.5em; }
    #main .con03 .left .list &gt; div .num_w .num ul li{ font-size: 50px; }
    #main .con03 .left .list &gt; div .num_w{ height: 50px; }
    #main .con03 .left .list &gt; div{ width: 175px; padding: 30px; }
    #main .con03 .left .list{ gap: 15px; }
    #main .con03 .left .list &gt; div &gt; em{ font-size: 18px; }
    #main .con03 .left &gt; strong{ margin-bottom: 20px; }
    #main .con03 .inner &gt; svg{ height: auto; width: 600px; top: 50%; transform: translate(0,-50%); }
    
    #main .con03 .left &gt; strong{ margin-bottom: 10px; font-size: 18px; }
    #main .con03 .left .list{ width: 100%; }
    #main .con03 .left .list &gt; div .num_w .num ul li{ font-size: 30px; }
    #main .con03 .left .list &gt; div{ padding: 20px; }
    #main .con03 .left .list &gt; div .num_w{ height: 30px; }
    #main .con03 .left .list &gt; div &gt; em{ font-size: 14px; margin-bottom: 10px;gap: 4px; }
    #main .con03 .left .list &gt; div{ width: 33.333333333%; }
    #main .con03 .inner &gt; svg{ width: 80%; height: auto; position: static; transform: translate(0,0); margin: 0 auto; margin-top: 30px; }
    #main .con03 .inner{ flex-flow: column; }
    #main .con03{ padding: 60px 0; height: auto; }
}


@media (max-width: 1180px){
    #footer .wrap .info{ gap: 10px; flex-flow: column; }
    #footer .wrap .info dl dt{ font-size: 12px; margin-bottom: 4px; }
    #footer .wrap .info dl dd{ font-size: 12px; }
    #footer .wrap{ padding: 30px 20px; }
    #footer .wrap .f_logo{ margin-bottom: 20px; }
    #footer .wrap .f_logo svg{ width: 160px; height: auto; }
    #footer .wrap .btns a{ width: 170px; height: 38px; font-size: 12px; padding-left: 12px; }
    #footer .wrap .btns a svg{ height: 100%; width: auto; }
    #footer .wrap .btns{ gap: 8px; }
    #footer .wrap .info{ margin-bottom: 20px; }
    #footer .wrap .btns{ margin-bottom: 20px; }
    #footer .wrap .copy{ font-size: 12px; }
    #main .main_visual .in_inner strong{ font-size: 40px; line-height: 1.5em; }
    #main .main_visual .main_nav{ width: auto; padding: 0 40px; }
    #main .main_visual .main_nav div a{ gap: 8px; }
    .intro .txt strong{ font-size: 30px; }
    .intro .txt strong b{ padding: 4px 6px; }
    #main .main_visual .main_nav div a strong{ font-size: 14px; }
    #main .main_visual .main_nav{ bottom: 40px; height: 54px; }
    #main .main_visual .scroll{ bottom: 45px; }
    #main .con02 .m_tit &gt; strong{ font-size: 24px; margin-bottom: 8px; }
    #main .con02 .m_tit p{ font-size: 16px; line-height: 1.5em; }
    #main .con02 .m_tit .control{ margin-top: 40px; }
    #main .con02 .m_tit .control .swiper-pagination2 span{ font-size: 14px; width :20px; }
    #main .con02 .m_tit .control .swiper-pagination2{ gap: 6px; }
    #main .con02 .m_tit .control .wrap{ gap: 10px; }
    #main .con02 .m_tit .control .wrap .swiper-button-prev svg{ width:40px; height: auto; }
    #main .con02 .m_tit .control .wrap .swiper-button-next svg{ width:40px; height: auto; }
    #main .con02 .m_tit .control .wrap .swiper-pagination{ height: 2px; }
    #main .con02 .m_tit { width: 320px; } 
    #main .con02 .r_slide{ left: 40%; }
    #main .con02 .r_slide .swiper-slide .w_area a{ width: 280px; }
    #main .con02 .r_slide .swiper-slide .w_area a .txt strong{ font-size: 14px; line-height: 1.5em; padding-left: 10px; }
    #main .con02 .r_slide .swiper-slide .w_area a .txt{ padding-top: 15px; }
    #main .con02 .r_slide .swiper-slide .w_area a .txt .cate{ margin-top: 20px; height: 40px; padding-left: 20px; }
    #main .con02 .r_slide .swiper-slide .w_area a .txt .cate svg{ width: 30px; height: auto; }
    
    #main .con04 .txt_it .wrap strong{ font-size: 24px; }
    #main .con04 .b_slide .b_box .txt em{ font-size: 14px; }
    #main .con04 .b_slide .b_box .txt strong{ font-size: 18px; margin-top: 4px;}
    #main .con04 .b_slide .b_box .txt{ bottom: 20px; padding: 0 20px; }
    #main .con04 .b_slide .arrow{ right: 20px; bottom: 20px; }
    #main .con04 .b_slide .arrow svg{ width: 28px; height: auto; }
    #main .con04 .b_slide{ height: 480px; }
    #main .con04 .b_slide .box{ gap: 12px; }
    #main .con04 .b_slide .wrap{ gap: 12px; }
    #main .con04 .b_slide .wrap .b_box{ height: calc(50% - 6px); }
    #main .con04 .b_slide .wrap .b01, #main .con04 .b_slide .wrap .b04{ width: calc(67% - 6px); }
    #main .con04 .b_slide .wrap .b02, #main .con04 .b_slide .wrap .b03{ width: calc(33% - 6px); }
    #main .con04 .b_slide .wrap .b06, #main .con04 .b_slide .wrap .b09{ width: calc(67% - 6px); }
    #main .con04 .b_slide .wrap .b07, #main .con04 .b_slide .wrap .b08{ width: calc(33% - 6px); }
    #main .con05{ padding-top: 120px; }
    #main .con05 .m_tit &gt; strong{ font-size: 24px; line-height: 1.5em; }
    #main .con05 .n_list ul li a .tit strong{ font-size: 14px; }
    #main .con05 .n_list ul li a .tit span{ padding: 0 12px; height: 32px; font-size: 12px; }
    #main .con05 .n_list ul li a .tit{ gap: 8px; }
    #main .con05 .n_list ul li a{ padding: 0 20px; height: 80px; }
    #main .con05 .n_list ul li a svg{ right: 20px; width: 28px; height: auto; }
    #main .con05 .n_list ul li a .date p{ font-size: 12px; }
    #main .con05 .n_list ul li a .date{ right: 70px }
    #main .con_w{ height: auto; padding: 80px 0; }
    
        #main .con03 .left { width: 100%; }
    #main .con_w{ padding: 0 !important; }
}


@media (max-width: 800px){
    html{ overflow-x: hidden; }
    #header h1 a svg{ width: 180px; height: auto; }
    #header{ height: 58px; }
    #footer .wrap .btns{ flex-flow: column; }
    #footer .wrap .btns &gt; div &gt; a{ width: 100%; }
    #footer .wrap .copy{ line-height: 1.5em; }
    #footer{ padding: 0; }
    .intro.on .txt{ gap:250px; }
    #main .main_visual .in_inner strong{ font-size: 28px; line-height: 1.5em; }
    .intro .txt strong{ font-size: 24px; }
    #main .main_visual .main_nav div a strong{ font-size: 12px; }
    #main .main_visual .main_nav div a svg{ width: 22px; height: auto; }
    #main .main_visual .scroll{ bottom: 110px; }
    #main .main_visual .main_nav{ padding: 0 20px; width: calc(100% - 40px); }
    #main .main_visual .scroll strong{ font-size: 12px; }
    #main .con01 .inner .left{ width: 100%; }
    #main .con01 .inner{ flex-flow: column; gap: 12px; }
    #main .con01 .inner .right { width: 100%; }
    #main .con01 .inner .left{ gap: 12px; }
    #main .con01 .inner .right{ height: auto; }
    #main .con01 .inner .right .wrap{ flex-flow: row }
    #main .con01 .left .wrap{ gap: 12px; }
    #main .con01 .inner .right .wrap{ gap:12px; }
    #main .con01 .inner .right .wrap{ height: auto; }
    #main .con01 .wrap .box .txt p{ font-size: 12px; line-height: 1.5em; }
    #main .con01 .wrap .box a{ padding: 20px; }
    #main .con01{ height: 100vh; }
    #main .con01 .left .wrap1{ height: auto; }
    #main .con01 .left .wrap2{ height: auto; }
    #main .con01 .inner .left{ height: auto; }
    #main .con01 .inner{ justify-content: center; }
    #main .con01 .wrap .box .txt strong{ font-size: 14px; }
    #main .con01 .wrap .box .arrow{ margin-top: 12px; }
    #main .con01 .wrap .box .arrow{ width: 22px; height: 22px; }
    #main .con01 .wrap .box .arrow .wr{ width: 14px; height: 14px; }
    #main .con01 .wrap .box .arrow .wr img{ height: 100%; }
    #main .con02 .m_tit{ width: 100%;  }
    #main .con02 .inner{ padding-left: 20px; padding-right: 20px; }
    #main .con02 .r_slide{ position: static; transform: translate(0,0)}
    #main .con02 .m_tit .control{ margin-top: 20px; }
    #main .con02 .r_slide .swiper-slide .w_area{ padding-top: 30px; padding-bottom: 30px; }
    #main .con02 .m_tit &gt; strong{ font-size: 18px; margin-bottom: 4px; }
    #main .con02 .m_tit &gt; p{ font-size: 14px; }
    #main .con04 .b_slide .arrow{ bottom: auto; top: 20px; width: 22px; height: 22px; }
    #main .con04 .b_slide .arrow .wr{ width: 12px; height: 12px; }
    #main .con04 .b_slide .arrow .wr img{ height: 100%; }
    #main .con04 .b_slide .b_box .txt strong{ font-size: 14px; }
    #main .con04 .swiper-pagination3{ margin-top: 30px; }
    #main .con04 .b_slide .b_box .txt em{ font-size: 12px; }
    #main .con04 .txt_it .wrap strong{ font-size: 18px; }
    #main .con05 .m_tit &gt; strong{ font-size: 18px; }
    #main .go_btn a strong{ font-size: 12px; }
    #main .go_btn a svg{ width: 28px; height: auto; }
    #main .con05 .m_tit .go_btn{ position: static; margin-top: 12px;}
    #main .go_btn a{ gap: 4px; }
    #main .con05 .m_tit{ margin-bottom: 20px; }
    #main .con05{ padding: 60px 0; }
    #main .con05 .n_list ul li a .date{ position: static; display: block;     transform: translate(0,0); margin-top: 10px;  }
    #main .con05 .n_list ul li a{ flex-flow: column; justify-content: center; align-items: flex-start;  }
    #main .con05 .n_list ul li a .tit{ flex-flow: column;align-items: flex-start;  }
    #main .con05 .n_list ul li a{ height: auto; padding: 12px; }
    #main .con05 .n_list ul li a .tit span{ height: 24px; font-size: 11px; padding: 0 8px; }
    #main .con01 .inner{ padding-top: 0; }
    #main .con02 .go_btn{ margin-top: 10px; }
     #main .con02{ height: auto; padding: 60px 0; }
    #footer .wrap .btns a{ width: 100%; }
    #main .con04 .b_slide .b_box:before{ display: none !important; }
    #main .con04 .b_slide .arrow{ display: none !important; }
    #main .con02 .r_slide{ width: 100%; }
    #main .con02 .r_slide .swiper-slide .w_area a .txt .cate{ margin-top: 8px; height:32px; }
    #main .con02 .r_slide .swiper-slide .w_area a{ padding-bottom: 20px; }
    #main .con02 .m_tit .control{ margin-top: 10px; }
    
}


@media (max-width: 540px){
    #main .main_visual .main_nav div{ gap: 8px; }
    #main .main_visual .in_inner strong{ font-size: 24px; } 
    .intro .txt strong{ font-size: 18px; }
    .intro.on .txt{ gap: 180px; }
    #main .con02 .r_slide .swiper-slide .w_area a{ width: 100%; }
    #main .con02 .r_slide{ width: 100%; }
    #main .con03 .left .list &gt; div{ width: 100%; }
/*    #main .con03 .left .list { flex-flow: column; }*/
    #main .con03 .inner &gt; svg{ width: 90%; transform: translate(-5%); }
    #main .con04 .b_slide .box{ width: auto; }
    #main .con04 .b_slide .wrap{ width: 400px; }
    #main .con04 .b_slide .wrap2{ width: 200px; }
    #main .con05 .n_list ul li a svg{ display: none; }
    #main .con05 .n_list ul li a .tit strong{ font-size: 12px; }
    #main .con05 .n_list ul li a .tit { gap: 4px; }
    #main .con05 .n_list ul li a .date{ margin-top: 4px; }
    #main .con05 .n_list ul li a .date p{ font-size: 10px; }
    #main .con02 .r_slide .swiper-slide-active { margin-right: 20px !important;z-index: 4}
    #main .con04 .b_slide .swiper-slide{ width: auto !important; }
    #main .con01 .wrap .box .txt p{ display: none; }
    #main .con01 .left .wrap1 .box2 a { background-size: 80px auto; }
    .main_img.on{ clip-path: circle(7% at 50% 50%); }
    .main_img.on2{ clip-path: circle(1200px); }
        #main .con03 .left .list &gt; div {
        padding: 12px 6px;
    }
    .intro{ height: 1200px; }
}





/**/</pre></body></html>