.inner{width: 1400px;margin: 0 auto} .fp-viewing-main #header .right .lang button{ border-color: rgba(255, 255, 255, 0);backdrop-filter: blur(30px) brightness(140%);color: #fff;} .fp-viewing-main #header:hover .right .lang button{ border: 1px solid #DFDFDF; color: #fff;color: #222222} .fp-viewing-main #header .right .lang button path{stroke: #fff} .fp-viewing-main #header:hover .right .lang button path{stroke: #222} .fp-viewing-main #header #gnb > ul > li > div > a{color: #fff} .fp-viewing-main #header:hover #gnb > ul > li > div > a{color: #222} .fp-viewing-main #header:hover #gnb > ul > li:hover > div > a{color: #1F73D5} .fp-viewing-main #header{background-color: transparent;border-bottom: none;} .fp-viewing-main #header:hover{background-color: #fff;border-bottom: 1px solid #F2F2F2;} .fp-viewing-main #header:after{ width: calc(100% - 120px); background-color: rgba(255,255,255,0.2); content:""; display: block; height: 1px; position: absolute; left: 50%; bottom: 0; transform: translate(-50%,0); } .fp-viewing-main #header #logo a svg * {fill: #fff;} .fp-viewing-main #header:hover #logo a svg * {fill: #1a1718;} .fp-viewing-main #header #logo a svg #패스_62{fill: #dc741b;} .fp-viewing-main #header #logo a svg #패스_62{fill: #dc741b;} .fp-viewing-main #header #logo a svg #패스_61{fill: #dc741b;} #main .m_title{margin-bottom: 30px;} #main .m_title span{color: #A3B0BF;font-size: 20px;font-weight: 600;display: block;margin-bottom: 14px;} #main .m_title strong{font-size: 48px;color: #2C2C2C;font-family: "Manrope", sans-serif;} #main .main01{background:url(/img/main/main01_bg.jpg) no-repeat center center;} #main .main01 .w img{display: block;max-width: 100%;} #main .main01 .pagination {display: flex;justify-content: center;gap: 30px;margin-top: 80px;} #main .main01 .pagination .swiper-pagination-bullet{background: rgba(255,255,255,0.5);opacity: 1;margin: 0;position: relative} #main .main01 .pagination .swiper-pagination-bullet:after{content: '';display: block;width: 29px;height: 29px;background: url(/img/main/dot.png);position: absolute;top: 50%;left: 50%;margin-top: -14.5px;margin-left: -14.5px;animation: 5s cir infinite linear;opacity: 0;transition: 0.5s} #main .main01 .pagination .swiper-pagination-bullet-active:after{opacity: 1} @keyframes cir{ 0%{transform: rotate(0deg)} 100%{transform: rotate(360deg)} } #main .main01 .pagination .swiper-pagination-bullet-active{background: rgba(255,255,255,1);opacity: 1} #main .main01 .m_title strong{text-align: center;;display: block;color: #fff;} #main .main01 .img{border-radius: 12px;overflow: hidden;transform: scale(0.9);filter: blur(5px);opacity: 0.5;transition: 0.5s;} #main .main01 .swiper-slide-active .img{transform: scale(1);filter: blur(0px);opacity: 1;} #main .main03 ul{display: flex;gap: 40px} #main .main03 ul li{flex: 1;} #main .main03 ul li a{display: block;border-bottom: 1px solid #ECECEC;padding-bottom: 35px;position: relative;height: 100%} #main .main03 ul li a:after{content: '';display: block;width: 0%;height: 1px;background: #222222;position: absolute;bottom: 0;left: 0;transition: 0.5s} #main .main03 ul li:hover a:after{width: 100%} #main .main03 ul li .img img{display: block;width: 100%;} #main .main03 ul li .img{display: block;border-radius: 12px;overflow: hidden;display: block;} #main .main03 ul li .txt {padding-top: 30px;} #main .main03 ul li .txt strong{font-size: 22px;color: #2C2C2C;display: block;;margin-bottom: 15px;} #main .main03 ul li .txt p{font-size: 16px;color: #46494D;line-height: 28px;margin-bottom: 20px;} #main .main03 ul li .txt span{font-size: 16px;color: #B2B2B4;;;} #main .main06 .wrap{padding-bottom: 80px;padding-top: 100px} #main .main06 .wrap ul{display: flex;gap: 40px;} #main .main06 .wrap ul li{flex: 1} #main .main06 .wrap ul li .w{background: #F4F6F9;padding:35px 33px 45px 40px;border-radius: 12px;position: relative} #main .main06 .wrap ul li:hover .w{background: #1F73D5} #main .main06 .wrap ul li .w strong{font-size: 22px;color: #2C2C2C;font-weight: 900;display: block;margin-bottom: 15px;} #main .main06 .wrap ul li .w p{font-size: 16px;color: #2C2C2C;line-height: 28px} #main .main06 .wrap ul li .icon{margin-bottom: 20px;display: flex;justify-content: space-between;align-items: center;;} #main .main06 .wrap ul li .icon i{background-color: #FFFFFF;width: 50px;height: 50px;display: block;border-radius: 50%;position: relative;} #main .main06 .wrap ul li .icon i:before{content: '';display: block;width: 16px;height: 1px;background-color: #8899AC;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);} #main .main06 .wrap ul li .icon i:after{content: '';display: block;height: 16px;width: 1px;background-color: #8899AC;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);} #main .main06 .fp-tableCell{vertical-align: bottom;} #main .main02 .con01{display: flex;justify-content: space-between;align-items: center;} #main .main02 .inner{width: 100%} #main .main02 .con01{width: 1560px;margin: 0 auto;} #main .main02 .con01 p{font-size: 18px;color: #596370;line-height: 34px;margin-top: 40px;;} #main .main02 .con01 .img {border-radius: 12px;overflow: hidden;;} #main .main02 .con01 .img img{display: block;} #main .main02 .con02{width: 1680px;margin: 0 auto;margin-top: 55px;} #main .main02 .con02 ul{display: flex;} #main .main02 .con02 ul li{flex: 1;} #main .main02 .con02 ul li .w{padding: 35px;} #main .main02 .con02 ul li .w i{margin-bottom: 25px;display: block;} #main .main02 .con02 ul li .w strong{font-size: 22px;color: #2C2C2C;font-weight: 600;display: block;margin-bottom: 15px;} #main .main02 .con02 ul li .w p{font-size: 16px;color: #46494D;line-height: 28px;;} #main .main04 .wrap{height: 100vh;display: flex;} #main .main04 .wrap .title{width: 550px;height: 100%;background-color: #004494;padding-top: 234px;padding-left: 80px;box-shadow: 20px 0 40px #74879C30;position: relative} #main .main04 .wrap .title .btn_w{width: 100%;flex-direction: column;justify-content: flex-start;align-items: flex-start} #main .btn_w .btn > * svg{width: 12px;height: auto} #main .btn_w .btn{gap : 5px} #main .main04 .wrap .title .btn_w i{width: 100%;max-width: 350px;margin-bottom: 60px} #main .main04 .wrap .sw_w{width: calc(100% - 550px);} #main .main04 .wrap .sw_w .swiper{width: 100%;height: 100%;} #main .main04 .wrap .sw_w .swiper a{display: block;border-right: 1px solid #EFEFEF;height: 100%;padding-top: 230px;} #main .main04 .wrap .sw_w .swiper .w{height: 100%;display: flex;flex-direction: column;justify-content: space-between;padding-bottom: 90px;} #main .main04 .wrap .sw_w .swiper .txt{padding: 0 40px;} #main .main04 .wrap .sw_w .swiper .txt .date{margin-bottom: 30px;} #main .main04 .wrap .sw_w .swiper .txt .date span{font-size: 22px;color: #2C2C2C;display: block;;font-weight: 900;} #main .main04 .wrap .sw_w .swiper .txt .date strong{font-size: 32px;color: #2C2C2C;display: block;;font-weight: 900;} #main .main04 .wrap .sw_w .swiper .txt .text strong{font-size: 22px;color: #2C2C2C;font-weight: 600;display: block;margin-bottom: 15px;;} #main .main04 .wrap .sw_w .swiper .txt .text p{font-size: 18px;color: #596370;line-height: 28px;;} #main .main04 .m_title strong{color: #fff;font-size: 42px;} #main .main04 .m_title span{color: #fff;} #main .main05 .w{display: flex;} #main .main05 .w > div{width: 50%;} #main .main05 .w .pro_con{display: flex;flex-direction: column;justify-content: center;position: relative;z-index: 2;} #main .main05 .w .pro_con .pro_slide{background-color: #1F73D5;width: 600px;padding: 65px;border-radius: 12px;} #main .main05 .w .pro_con .pro_slide .txt i{display: block;margin-bottom: 20px;;} #main .main05 .w .pro_con .pro_slide .txt i img{max-width: 200px} #main .main05 .w .pro_con .pro_slide .txt strong{font-size: 30px;line-height: 38px;color: #FFFFFF;display: block;;margin-bottom: 20px;} #main .main05 .w .pro_con .pro_slide .txt p{font-size: 18px;color: #FFFFFF;margin-bottom: 15px} #main .main05 .m_title{padding-left: 0px;margin-bottom: 60px;} #main .main05 .m_title p{font-size: 20px;color: #596370;margin-top: 20px;;;} #main .main04 .wrap .sw_w .swiper .w img{max-width: 100%;} #main .main04 .wrap .sw_w .swiper .img{position: relative;padding-top: 67%;overflow: hidden} #main .main04 .wrap .sw_w .swiper .img img{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%)} #main .main05 .m_title.pc{display: block;} #main .main05 .m_title.mo{display: none;} #intro{position: fixed;z-index: 9999;top: 0;left: 0;width: 100%;height: 100%;} #intro .video{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);} #main .m_title strong{transition: 1s;opacity: 0;transform: translateY(70px);display: block;} #main .active .m_title strong{opacity: 1;transform: translateY(0px);transition-delay: 0.3s;} #main .m_title p{transition: 1s;opacity: 0;transform: translateY(70px);display: block;} #main .active .m_title p{opacity: 1;transform: translateY(0px);transition-delay: 0.6s;} #main .main02 .con01 .img{transition: 1s;opacity: 0;transform: translateY(70px);} #main .main02.active .con01 .img{opacity: 1;transform: translateY(0px);transition-delay: 0.9s;} #main .main02 .con02{transition: 1s;opacity: 0;transform: translateY(70px);} #main .main02.active .con02{opacity: 1;transform: translateY(0px);transition-delay: 1.2s;} #main .main05 .product_image{transition: 1s;opacity: 0;transform: translateY(70px);} #main .main05.active .product_image{opacity: 1;transform: translateY(0px);transition-delay: 0.9s;} #main .main05 .w .pro_con .pro_slide{transition: 1s;opacity: 0;transform: translateY(70px);} #main .main05.active .w .pro_con .pro_slide{opacity: 1;transform: translateY(0px);transition-delay: 1.2s;} #main .main03 ul{transition: 1s;opacity: 0;transform: translateY(70px);} #main .main03.active ul{opacity: 1;transform: translateY(0px);transition-delay: 0.6s;} #main .main04 .wrap .sw_w{transition: 1s;opacity: 0;transform: translateY(70px);} #main .main04.active .wrap .sw_w{opacity: 1;transform: translateY(0px);transition-delay: 0.6s;} #main .main06 .wrap ul li{transition: 1s;opacity: 0;transform: translateY(70px);} #main .main06.active .wrap ul li{opacity: 1;transform: translateY(0px);transition-delay: 0.6s;} #main .main06.active .wrap ul li:nth-child(2){transition-delay: 0.8s;} #main .main06.active .wrap ul li:nth-child(3){transition-delay: 1.0s;} #main .main01.active .m_title strong{transition: 1s;opacity: 0;transform: translateY(70px)} #main .main01.on .m_title strong{opacity: 1;transform: translateY(0px);transition-delay: 3s;} #main .main01.active .sw_w{transition: 1s;opacity: 0;transform: translateY(70px)} #main .main01.on .sw_w{opacity: 1;transform: translateY(0px);transition-delay: 3.3s;} #main .main06 .wrap ul li .w{transition: 0.5s} #main .main06 .wrap ul li .w strong{transition: 0.5s} #main .main06 .wrap ul li:hover .w strong{color: #fff} #main .main06 .wrap ul li .w p{transition: 0.5s} #main .main06 .wrap ul li:hover .w p{color: #D5E8FF} #main .main06 .wrap ul li .icon i:before{transition: 0.5s} #main .main06 .wrap ul li .icon i:after{transition: 0.5s} #main .main06 .wrap ul li:hover .icon i:before{background: #1F73D5} #main .main06 .wrap ul li:hover .icon i:after{background: #1F73D5} #main .main06 .wrap ul li path{transition: 0.5s} #main .main06 .wrap ul li:hover path{fill: #FFFFFF} #main .main02 .con02 ul li .w{transition: 0.6s;border-radius: 12px} #main .main02 .con02 ul li:hover .w{background: #1F73D5} #main .main02 .con02 ul li .w strong{transition: 0.6s} #main .main02 .con02 ul li:hover .w strong{color: #fff} #main .main02 .con02 ul li .w p{transition: 0.6s} #main .main02 .con02 ul li:hover .w p{color: #C8E1FF} #main .main02 .con02 ul li .w i path{transition: 0.6s} #main .main02 .con02 ul li:hover .w i path{fill:#fff} #main .main02 .con02 ul li:nth-child(2):hover .w i path{stroke:#fff} #main .main02 .con02 ul li:nth-child(2):hover .w i rect{fill:#fff} #main .btn_w{display: flex;align-items: center} #main .btn_w i{display: block;width: calc(100% - 175px);height: 1px;background:#ffffff20;position: relative} #main .btn_w i:after{content: '';display: block;width: 0%;height: 100%;position: absolute;top: 0;left: 0;animation: 3s scr infinite linear;background: #fff} @keyframes scr{ 0%{width: 0%} 100%{width: 100%} } #main .btn_w .btn{display: flex} #main .btn_w .swiper-pagination1 {width: auto;color: #FFFFFF50;font-size: 14px;font-weight: 600;margin-right: 20px;margin-left: 15px} #main .btn_w .swiper-pagination1 .swiper-pagination-current{color: #fff} #main .btn_w .btn > *{width: 46px;height: 46px;display: flex;align-items: center;justify-content: center;transition: 0.5s} #main .btn_w .btn > *:hover{background: rgba(255,255,255,0.1)} #main .main01{background-size: 100% auto} #intro .video {width: 100%} #intro .video video{width: 100%} #main .main01 .w img{width: 100%} #main .main05 .product_image .img img{width: 100%} #main .main04 .wrap .sw_w .swiper .w img{width: 100%} #main .main06 .fp-tableCell{vertical-align: middle} @media (max-width: 1920px) { #main .main01{background-size: auto auto} #intro .video {width: auto} #intro .video video{width:auto} #main .main01 .w img{width: auto} #main .main05 .product_image .img img{width: auto} #main .main04 .wrap .sw_w .swiper .w img{width: auto} #main .main06 .fp-tableCell{vertical-align: middle} #main .main05 .product_image .img img{width: 80%;display: block;margin: 0 auto} #main .main05 .w{height: 100vh;align-items: center} } @media (max-width: 1700px) { #footer .ft02 ul{gap: 25px} } @media (max-width: 1600px) { #footer .ft02 ul{flex-wrap: wrap} #header .hd_inner{padding: 0 20px;} #main .main04 .wrap .sw_w .swiper a{padding-top: 130px;} #main .main02 .con01, #main .main02 .con02{max-width: 100%;padding: 0 20px;} #main .main01 .m_title strong, #main .m_title strong{font-size: 40px;line-height: 1.5;} #main .main02 .con01 p{font-size: 16px;line-height: 1.5;;} #main .main02 .con01 .img img{width: 500px;} #main .main02 .con02 ul li .w strong{font-size: 19px;line-height: 1.5;;} #main .main02 .con02 ul li .w p{font-size: 15px;line-height: 1.5;;} #main .main05 .m_title p{font-size: 18px;} #main .m_title span{font-size: 16px;} #main .main05 .w img{max-width: 100%;} #main .main05 .w .pro_con .pro_slide .txt strong{font-size: 25px;line-height: 1.5;} #main .main05 .w .pro_con .pro_slide .txt p{font-size: 16px;} #main .main05 .w .pro_con .pro_slide{width: 600px;} #main .main05 .m_title{margin-bottom: 40px;} #header #gnb > ul > li > div > a{line-height: 80px;} #header #gnb > ul > li:after{top: 80px;} #main .main03 ul{width: 100%;max-width: 1200px;margin: 0 auto;} #main .main03 ul li .txt strong{font-size: 20px;;} #main .main03 ul li .txt p, #main .main03 ul li .txt span{font-size: 15px;;} #main .main03 ul li .txt{padding-top: 20px;;} #main .main04 .wrap .title{width: 450px;padding-left: 20px;padding-top: 130px;;} #main .main04 .wrap .sw_w .swiper .txt{padding: 0 20px;} #main .main04 .wrap .sw_w .swiper .txt .date span{font-size: 18px;} #main .main04 .wrap .sw_w .swiper .txt .date strong{font-size: 24px;} #main .main04 .wrap .sw_w .swiper .txt .text strong{font-size: 20px;} #main .main04 .wrap .sw_w .swiper .txt .text p{font-size: 16px;line-height: 1.5;;} #main .main04 .wrap .sw_w {width: calc(100% - 450px);} #main .main04 .wrap .sw_w .swiper .w{padding-bottom: 20px;} #main .main04 .m_title strong{font-size: 36px;line-height: 1.5;;} #main .m_title span{font-size: 15px;} #main .main06 .wrap ul li .w strong{font-size: 18px;} #main .main06 .wrap ul li .w p{font-size: 15px;line-height: 1.5;;} #main .main06 .wrap ul li .w{padding: 20px;} #main .main06 .wrap{padding-bottom: 0;} #main .main02 .con02{margin-top: 20px;} #main .main02 .con02 ul li .w{padding: 20px;} .inner{width: 100%;padding: 0 20px;} #main .main03 ul{gap: 20px} #main .main04 .wrap .sw_w .swiper .txt .text p br{display: none;} } @media (max-width: 1300px) { #header #gnb{overflow-y: scroll} #header #gnb > ul > li:nth-child(2) > div ul{transform: translateX(0)} #header #gnb > ul > li > div ul.on{display: block !Important} #header #gnb{padding: 20px;padding-top: 100px;} #header #gnb > ul > li > div ul{display: none} #header #gnb > ul > li > div ul.on{display: block} #header #gnb > ul{gap:15px} #header #gnb > ul > li:after{display: none !important} #header #gnb > ul > li > div > a:after{display: none} #main .main06 .wrap ul li .w p br{display: none;} #main .main06 .wrap ul li .w p{word-break: keep-all;} #main .main05 .m_title p{padding-right: 20px;} #header #gnb{position: fixed;height: 100vh;right: 0;top: 0;background: #fff;width: 300px} #header #gnb > ul{flex-direction: column} #header #gnb > ul > li > div ul{display: none;position: static} #header #gnb > ul > li:hover > div ul{display: none;position: static} #main .main01 .m_title strong, #main .m_title strong{font-size: 32px;} #header #gnb > ul > li > div > a{line-height: 50px;} #header #gnb > ul > li > div ul li a{line-height: 40px;} #main .main02 .con01 p{font-size: 15px;margin-top: 20px;;} #main .main02 .con02 ul li .w p{font-size: 14px;word-break: keep-all;;} #main .main02 .con02 ul li .w p br{display: none;} #main .main02 .con02 ul li .w strong{margin-bottom: 10px;font-size: 18px;} #main .main05 .m_title{padding-left: 20px;;} #main .main05 .m_title p{font-size: 15px;line-height: 1.5;word-break: keep-all;} #main .main05 .w .pro_con .pro_slide{padding: 20px;} #main .main05 .w .pro_con .pro_slide .txt strong{font-size: 22px;} #main .main05 .w .pro_con .pro_slide .txt p{font-size: 15px;} #main .main03 ul{width: 100%;} #main .main03 .wrap{padding: 0 20px;} #main .main04 .m_title strong{font-size: 30px;} #main .main04 .wrap .title{width: 340px;} #main .main06 .wrap ul{gap: 20px} #main .main04 .wrap .sw_w { width: calc(100% - 340px); } #main .main04 .wrap .title .btn_w i{margin-bottom: 20px} #main .main04 .wrap .title .btn_w{padding: 20px} #header #gnb .close {display: block;position: absolute} #header #gnb .close{display: block;position: absolute;right: 40px;top: 30px;width: 25px;height: 25px;z-index: 99;} #header #gnb .close:before{content: '';display: block;width: 100%;height: 2px;background: #1F73D5;position: absolute;top: 50%;left: 50%;margin-left: -12.5px;margin-top: -1px;transform: rotate(45deg)} #header #gnb .close:after{content: '';display: block;width: 100%;height: 2px;background: #1F73D5;position: absolute;top: 50%;left: 50%;margin-left: -12.5px;margin-top: -1px;transform: rotate(-45deg)} #header #gnb{transform: translateX(100%);transition: 0.7s} #header #gnb.on{transform: translateX(0%)} #header .menu_open{display: block} #header .menu_open svg{width: 26px;height: auto;display: block} #header .right{gap: 20px} } @media (max-width: 960px) { #header .lang ul li a{font-size: 12px} .btn_top button{bottom: 20px;right: 20px} .btn_top button strong{margin-top: 0} .btn_top button strong, .btn_top a strong{font-size: 12px} .btn_top button, .btn_top a{width: 40px;height: 40px;border-radius: 6px} #main .main05 .w{height: auto} #header #gnb > ul > li > div ul li a{line-height: 30px;font-size: 14px} #header #gnb .close{right: 20px;top: 20px} #header #gnb > ul{gap: 7px;} #header #gnb > ul > li > div > a{font-size: 15px;line-height: 35px} #main .main04 .wrap .title .btn_w{display: none} #intro{background-color: #000;} #intro .video video{width: 100vh;} #header .right .lang button{font-size: 12px;width: 60px;height: 30px;} #header .right .lang button svg{width: 7px;height: auto;display: block;} #header .hd_inner{height: 60px;} #header .hd_inner #logo a svg{height: 30px;width: auto;} #main .main06 .wrap ul li .icon{margin-bottom: 10px;;} #main .main06 .wrap ul li .w{padding: 15px;border-radius: 8px;} #main .main06 .wrap ul li .icon i:after{height: 7px;} #main .main06 .wrap ul li .icon i:before{width: 7px;} #main .main06 .wrap ul li .icon svg{width: 25px;height: auto;} #main .main06 .wrap ul li .icon i{width: 25px;height: 25px;} #main .main06 .wrap ul li .w strong{font-size: 14px;margin-bottom: 7px;} #main .main06 .wrap ul li .w p{font-size: 13px;;} #main .main02 .con01{flex-direction: column;padding: 0;padding-top: 80px;} #main .main01 .m_title strong, #main .m_title strong{font-size: 24px;word-break: keep-all;line-height: 1.5;} #main .main02 .con01 p br{display: none;} #main .main02 .con01 p{word-break: keep-all;line-height: 1.5;font-size: 14px;} #main .main02 .con01 .img {max-width: 100%;} #main .main02 .con01 .img img{width: 100%;} #main .main02 .con02 ul li .w{padding: 0;} #main .main02 .con02 ul{flex-wrap: wrap;gap: 20px 0} #main .main02 .con02 ul li {width: calc(50% - 10px);flex: auto} #main .main02 .con02 ul li .w svg{width: 30px;height: auto;} #main .main02 .con02 ul li .w strong{font-size: 14px;margin-bottom: 10px;} #main .main02 .con02 ul li .w p{font-size: 13px;} #main .main02 .con02 ul li .w i{margin-bottom: 7px;} #main .main05 .w > div{width: 100%;} #main .main05 .w{flex-wrap: wrap;} #main .main03 ul li:nth-child(3){display: none;} #main .main03 ul{gap:20px} #main .main03 ul li .txt strong{font-size: 14px;margin-bottom: 10px;} #main .main03 ul li .txt p{font-size: 13px;line-height: 1.52;margin-bottom: 5px;} #main .main03 .wrap{padding: 0;} #main .main03 ul li .txt span{font-size: 12px;} #main .main03 ul li .txt{padding-top: 10px;} #main .main03 ul li a{padding-bottom: 10px;} #main .main04 .wrap{flex-direction: column;} #main .main04 .wrap .title{width: 100%;height: 210px;} #main .main04 .wrap .title{padding-top: 80px;} #main .main04 .m_title span{font-size: 13px;} #main .main04 .m_title strong{font-size: 24px;} #main .main04 .wrap .sw_w { width: 100%; height: calc(100% - 210px); } #main .main04 .wrap .sw_w .swiper .txt .text p{font-size: 12px;word-break: keep-all;} #main .main04 .wrap .sw_w .swiper a{padding-top: 40px;} #main .main04 .wrap .sw_w .swiper .txt .text strong{font-size: 14px;margin-bottom: 7px;} #main .main04 .wrap .sw_w .swiper .txt .date span{font-size: 14px;} #main .main04 .wrap .sw_w .swiper .txt .date strong{font-size: 18px;} #main .main04 .wrap .sw_w .swiper .txt .date{margin-bottom: 15px;} #main .main05 .m_title.pc{display: none;} #main .main05 .m_title.mo{display: block;} #main .main05 .w{padding-top: 100px;padding-left: 20px;padding-right: 20px;} #main .main05 .m_title strong br{display: none;} #main .main05 .m_title p{margin-top: 7px;} #main .main05 .w .pro_con .pro_slide{width: 100%;margin-left: 0;} #main .main05 .w .product_image{border-radius: 8px;overflow: hidden;margin-bottom: 20px;} #main .main05 .w img{display: block;} #main .main05 .m_title.mo{padding-left: 0;} #main .main05 .w .pro_con .pro_slide img{height: 20px;} #main .main05 .w .pro_con .pro_slide .txt strong{font-size: 17px;line-height: 1.5;margin-bottom: 10px;;} #main .main05 .w .pro_con .pro_slide .txt i{margin-bottom: 7px;} #main .main05 .w .pro_con .pro_slide .txt p{font-size: 12px;} #footer{padding: 20px} #footer .ft02 ul li p, #footer .ft02 ul li span, #footer .ft02 address{font-size: 12px;word-break: keep-all} #footer{margin-top: 30px} #footer .ft01 .left svg{width: 100px;height: auto} #footer .ft01 .left ul{gap: 20px} #footer .ft01 .left ul li a{font-size: 13px} #footer .ft01 .right ul svg{width: 30px;height: auto} #footer .ft01{padding-bottom: 10px} #footer .ft02{padding-top: 20px} #footer .ft02 ul{padding-top: 20px;margin-bottom: 20px;} #footer .ft01 .left{gap: 20px} #header .hd_w #gnb > ul > li{padding-right: 0} #main .btn_w .btn > *{width: 36px;height: 36px} #main .btn_w .btn > * svg{width: 5.5px;height: auto} #main .btn_w .swiper-pagination1{font-size: 12px} #main .btn_w i{width: calc(100% - 135px)} #main .main06 .wrap{padding-top: 65px} #main .main02 .con02 ul li:hover .w{background: transparent; } #main .main02 .con02 ul li:hover .w strong{color: #2C2C2C} #main .main02 .con02 ul li:hover .w p{color: #46494D} #main .main02 .con02 ul li:hover .w i path{fill:#596777} #main .main02 .con02 ul li:nth-child(2):hover .w i path{stroke:#596777} #main .main02 .con02 ul li:nth-child(2):hover .w i rect{fill:#596777} } @media (max-width: 660px) { #footer .ft02 ul li p{margin-top: 5px} #footer .ft02 ul{gap: 10px} #footer .ft01{flex-direction: column;gap: 10px;justify-content: flex-start} #main .main06 .wrap ul{flex-wrap: wrap;gap: 10px;} #main .main06 .wrap ul li{flex: auto;width: 100%;} #main .main06 .wrap{padding-top: 100px;} #main .main02 .con02{padding: 0;} #main .main01 .m_title strong i{display: block;} }