/* section */ section{padding: 6vw 0;} section >*{z-index:5} section .title_box .page_title{font-weight: 600;font-size: 6vh;color: var(--secondary);position: relative;font-family: 'Poppins', sans-serif;text-transform: uppercase;line-height: 110%;text-transform: uppercase;margin-bottom: 30px;} section .title_box h3{display:none} section .title_box p{line-height: 130%;letter-spacing: 0.5px;font-weight: 400;font-size: 20px;color: #181818;position: relative;} section.bg_box{background:no-repeat 50% / cover;} .more_btn{margin-top:0px} .more_btn a{position:relative;overflow:hidden;width: 90px;padding: 12px 40px;display:inline-block;border-radius: 100px;text-align: center;} .more_btn font{font-size: 14px;position:relative;writing-mode:inherit;color:#fff;text-align: left;font-weight: 400;letter-spacing: 1px;text-align: center;} .more_btn span::before{content:"";position:absolute;top:calc(50% - 5px);right: 23px;width:10px;height:10px;border-top: 2px solid #204780;border-right: 2px solid #204780;transform:rotate(45deg)} .more_btn span::after{content:"";position:absolute;top:calc(50% - 5px);right: 15px;width:10px;height:10px;border-top:2px solid #fff;border-right:2px solid #fff;transform:rotate(45deg)} .more_btn a:before{content:"";height:100%;width:100%;display:block;position:absolute;bottom:0;left:0;-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s;background: var(--triadic2);} /* mainArea */ #mainArea{position:relative} /* news_area */ #news_area #imglist{display:grid;grid-template-columns:600px 1fr;width:100%;gap:60px} #news_area #imglist .left li{margin: 20px;} #news_area .right{position:relative} #news_area li .img_scale img{aspect-ratio:4 / 3;width:100%} #news_area .img_box li .item{align-items:center;padding:20px 0px;display:grid;grid-template-columns:1fr 170px;gap:0 30px} #news_area li .item .Txt h3{color:#132d65;font-size:21px;letter-spacing:1px;margin-bottom:10px} #news_area li .item .Txt article{color:#6e7c9a;font-size:18px} #news_area li .more_btn a{width:90px;padding:10px 50px 10px 30px} #news_area li .more_btn.white font{font-size:14px} #news_area .img_nav li .item .Txt h3{-webkit-line-clamp:2;height:70px;margin-bottom:20px} #news_area .img_nav li .row{padding:0 15px} #imglist .img_nav{width:100%;position:absolute;bottom:40px;right:0} #imglist .img_nav .img_show{margin:0 10px 0} #imglist .img_nav img{width:140px;aspect-ratio:4 / 3;object-fit:cover} /* news_area */ #news_area{padding:5vw 0 5vw 0} section .itemTitleBox{position:relative;padding-top:0px;display:inline-block;animation-name:fadeInUp;-webkit-animation-name:fadeInUp} #news_area .itemTitleBox{width: auto;display: grid;grid-template-columns: 1fr 360px 130px;gap: 20px 20px;margin: 0 30px 30px;align-items: center;} #news_area .itemTitleBox .title_box .page_title{margin-bottom:0} #news_area section{padding: 2vmax 0 3vmax;position: relative;} #news_area img.dight {position: absolute;left: 150px;z-index: 11;min-width: 100%;margin-top: 0;object-fit: cover;display: none;} #news_area {padding: 3vmin 0 4vmax;overflow: initial;position: relative;background-image: url(/images/39/img-n-bg.png);background-size: cover;background-repeat: no-repeat;background-position: 50% 50%;} #news_area:before{content:"";position: absolute;left: 0;right: 0;top: 40px;width: 100px;height: 100px;margin: auto;background-image: url(/images/39/menu_logo.png);background-repeat: no-repeat;background-position: center top;background-size: contain;display: none;} @-webkit-keyframes iconRotate {0% {-webkit-transform: rotate(0);transform: rotate(0); }100% {-webkit-transform: rotate(15deg);transform: rotate(15deg); } } #news_area #news_txt {top: 2vmax;right: 5vmax;} #news_area .news_box {margin: 0 auto 0;padding-top: 20px;position: relative;z-index: 1;} #news_area .news_box .leftBox,#news_area .news_box .rightBox{position:relative;} #news_area .news_box .leftBox{width: 56%;} section .title_box,#news_area .tabs_box{animation-name:fadeInUp;-webkit-animation-name:fadeInUp} #news_area .tabs_box{margin-top:0px} #news_area .tabs_box .tabs_btn .newsList{display:flex;flex-direction: row;align-items:flex-start;position:relative;margin-bottom: 20px;margin-right:40px;margin-left: 10px;margin-top: 10px;padding-right:20px;justify-content: flex-start;gap: 20px 20px;} #news_area .tabs_box .tabs_body{width: calc(100% - 0px);} #news_area .tabs_box .tabs_body .news_list{margin-top: 20px;} section .title_box h2 {background: linear-gradient(to right, var(--info) 100%, var(--info) 65%);-webkit-background-clip: text;background-clip: text;} #news_area .tabs_btn .newsList {gap: 8px;} #news_area .tabs_btn a {padding: 15px 25px;background-color: var(--primary);font-size: 15px;color: aliceblue;font-weight: 500;display: block;border-radius: 50px;letter-spacing: .5px;} #news_area .tabs_btn .active a,#news_area .tabs_btn .newsList li:hover a {background-color: var(--secondary);} #news_area .tabs_body .tab_info { width: 100%; top: 0; left: 0; opacity: 0; pointer-events: none; } #news_area .tabs_body .tab_info.showBox {opacity: 1;pointer-events: auto;} #news_area .tabs_body .tab_info li{width: calc((100% / 1) - 0px);} #news_area .tabs_body .tab_info .items {display: flex;align-items: center;border-bottom: 1px solid #ded6d6;} #news_area .tabs_body .tab_info .items .Txt{position:relative;padding:30px 30px;z-index:3;background-color:#ffffff;background-size:cover;background-position:50% 50%;background-repeat:no-repeat} #news_area .tabs_body .tab_info .category{padding:0px 10px;background:#e1e1e1;color:var(--info);line-height:1;font-size:18px;line-height:217%;font-weight:500} #news_area .f_aitems_end{align-items:center;margin:10px 0px 0} #news_area .f_aitems_right{position:relative;width:calc(100% - 0px)} #news_area .tabs_body .tab_info .time{font-size:14px;display:flex;flex-direction:row} #news_area .tabs_body .tab_info .time font.m_txt{color:var(--triadic1);font-weight:500;font-family:'Tenor Sans';line-height:140%;font-size:19px} #news_area .tabs_body .tab_info .time font.d_txt{width:20px;grid-area:time_d;color:var(--dark)} #news_area .tabs_body .tab_info h3{height:auto;font-weight:500;font-size:21px;line-height:140%;-webkit-line-clamp:1} #news_area .tabs_body .tab_info p{height:auto;font-size:16px;color:#515050;-webkit-line-clamp:2;margin:11px 0 0} #news_area .btn{position:absolute;right:10px;bottom:30px;width:35px;height:35px;padding:0px 0px;width:35px;height:35px;margin:0;border-radius:50%;display:flex;justify-content:center} #news_area .tab_info li:hover .btn{scale:1;translate:0 -10px;background-color:#0193de} #news_area .tab_info li:hover .btn svg{fill:#ffffff} #news_area .tabs_box .tabs_btn .moreBtn a{font-weight:400;color:#fff;font-size:14px;line-height:50px;padding:0 20px} #news_area .rightBox .newsList2 .Img{border-radius:30px 30px 0 0} #news_area .rightBox .newsList2 .Img img,#news_area .tabs_body .tab_info .items .Img img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:30px 30px 0 0} #news_area .tabs_body .tab_info .items .Img{height:230px} #news_area .rightBox .moreN2{position:absolute;top:0;left:0;z-index:10;width:100%;height:100%} #news_area .rightBox .newsList2 li,#news_area .tabs_body .tab_info li{-webkit-box-shadow:0px 0px 21px 0px rgb(0 0 0 / 24%);box-shadow:0px 0px 21px 0px rgb(0 0 0 / 24%);margin:20px;border-radius:30px 30px 0 0} #news_area .rightBox .newsList2 .Txt{position:relative;padding:30px 20px;z-index:3;background-color:#ffffff;background-size:cover;background-position:50% 50%;background-repeat:no-repeat} #news_area .rightBox .newsList2 .Txt .title{font-size:22px;height:auto;-webkit-line-clamp:1} #news_area .rightBox .newsList2 .Txt .text{margin:14px 0;-webkit-line-clamp:2;height:auto;font-size:16px;color:#515050} #news_area .rightBox .newsList2 .Txt .top{position:relative;-webkit-box-pack:justify;justify-content:space-between;align-items:center;display:grid;gap: 10px 10px;} #news_area .rightBox .newsList2 .Txt .top .dateBox{display:flex;-webkit-box-align:end;line-height:1;font-weight:600;color:#fff;flex-direction: row;align-items: center;} #news_area .rightBox .newsList2 .Txt .top .dateBox .date,#news_area .rightBox .newsList2 .Txt .top .dateBox .date{font-size:44px;line-height:160%;color:#204780} #news_area .rightBox .newsList2 .Txt .top .dateBox .date{font-size: 16px;line-height:1;position:relative} #news_area .rightBox .newsList2 .Txt .top .dateBox .year,#news_area .rightBox .newsList2 .Txt .top .dateBox .year{font-size:16px;color:#204780} #news_area .tabs_body .tab_info .time .classTitle,#news_area .rightBox .newsList2 .Txt .classTitle{width: 6vw;height:50px;display:flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size: 16px;font-weight: 500;color:#ffffff;background-color:var(--secondary);position:absolute;padding: 0 10px;right:0;top:-50px;letter-spacing:1px} section .btn2{display:flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;width:200px;height:40px;font-weight:500;background-color:#fff;border-radius:50px;border:1px #9fabbd solid;justify-content:space-around;position:relative} section .btn2 font{color:var(--secondary)} section .btn2::after{content:"";width:17px;height:15px;display:block;position:absolute;top:50%;right:10px;-webkit-transform:translate(-10px,-50%);transform:translate(-10px,-50%);background:url(/images/39/icon-arrow.png);background-size: contain;-webkit-transition:0.6s;transition:0.6s;opacity: 1;} section .btn2:hover svg{-webkit-animation:movemove 1s infinite;animation:movemove 1s infinite} @-webkit-keyframes movemove{0%{-webkit-transform:translate(0,0%);transform:translate(0,0%)} 50%{-webkit-transform:translate(10px,0%);transform:translate(10px,0%)} 100%{-webkit-transform:translate(0,0%);transform:translate(0,0%)} }@keyframes movemove{0%{-webkit-transform:translate(0,0%);transform:translate(0,0%)} 50%{-webkit-transform:translate(10px,0%);transform:translate(10px,0%)} 100%{-webkit-transform:translate(0,0%);transform:translate(0,0%)} } section .btn2 svg{display:none} .newsbtn{display:flex;justify-content:space-between;align-items:center;position: relative;} #news_prev{-webkit-transform:scaleX(-1);transform:scaleX(-1);position:relative} #news_prev,#news_next{-webkit-box-shadow: 8px 9px 20px 1.4px rgb(192 192 192 / 50%);box-shadow: 8px 9px 20px 1.4px rgb(192 192 192 / 50%);border-radius:150px;} #news_prev svg,#news_next svg{width: 30px;height: 30px;fill:var(--secondary);display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:var(--white);border-radius:150px;padding: 15px;} #news_next svg{background-color:var(--secondary);fill:var(--white)} #news_area .btn svg{margin: 0;} /* about_area */ #wrap{position:relative} #about_area{padding: 7vw 0 4vw 0;position: relative;} #about_area::after{content:"";width: 720px;height: 100%;position:absolute;bottom: 0px;right: 0;background-image: url(/images/39/img-ab-bg.png);background-size: cover;background-repeat: no-repeat;background-position: 50% 50%;display:block;} #about_area .areaTitle .title_box h2{font-size:42px;margin-bottom:0} #about_area .areaTitle .title_box p{font-size:16px;line-height:210%;position:relative;padding:20px 0 20px 0;margin:20px 0} #about_area .aboutArea .about_icon{display:grid;position:relative;grid-template-columns: repeat(2,1fr);gap:20px 0px;padding-bottom:40px;width:min(500px,100%)} #about_area .aboutArea .about_icon >div{display:flex;flex-direction:column;align-items:center} #about_area .aboutArea .about_icon >div img{aspect-ratio:1 / 1;object-fit:contain;width:70px} #about_area .aboutArea .about_icon >div p{text-align:center;line-height:130%;font-size:16px;color:var(--primary);font-weight:600;padding:0;margin:20px 0 10px} #about_area .aboutArea{display:grid;grid-template-columns: 550px 1fr;gap:50px 0px;align-items:center} #about_area .aboutArea .right{position:relative} #about_area .aboutArea .goalsItem{display:grid;grid-template-columns:repeat(7,1fr);width:min(400px,80%);margin:50px 0 0 auto} #about_area .aboutArea .goalsItem .imgBox img{aspect-ratio:1 /1} #about_area .solutionsList .imgBox{padding:6.5%;position:relative;height:600px;width:600px} #about_area .solutionsList .imgBox::before{content:"";display:block;width:100%;height:100%;border-radius:50%;position:absolute;top:0;right:0;z-index:1;border:1px solid #ffffff;-webkit-clip-path:polygon(0 0,60% 0,60% 100%,0 100%);clip-path:polygon(0 0,70% 0,70% 100%,0 100%);-webkit-transform:rotate(180deg);transform:rotate(180deg);opacity:.5} #about_area .solutionsItem .imgBox .Img{overflow:hidden;border-radius:50%;border:26px solid rgb(255 255 255 / 90%);position:relative;z-index:1;/* height:500px; *//* width:500px; */} #about_area .deck02{position:absolute;top: -50px;left:20%;z-index:-3} #about_area .dotsBox{position:absolute;height:100%;width:100%;right:0px;pointer-events:none;top:50%;left:50%;transform:translate(-50%,-50%);z-index:30} #about_area .dotsBox .dots{position:absolute;z-index:2;right:0;display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:center;justify-content:start;width: min(100%,300px);} #about_area .dotsBox .dots.active .circle{opacity:1;-webkit-transform:scale(1);transform:scale(1)} #about_area .dotsBox .dots.active .dot{background-color:#97d3df;border-color:rgba(0,0,0,0)} #about_area .dotsBox .circle{background-color:#fff;border:1px solid #97d3df;width:calc(100% + 10px);height:calc(100% + 10px);border-radius:50%;position:absolute;z-index:0;top:0;left:0;opacity:0;-webkit-transform:scale(0.6);transform:scale(0.6);transition:all 0.8s;display:none} #about_area .dotsBox .dot{border:1px solid #d2d2d2;background-color:#fff;position:relative;z-index:1;width:14px;height:14px;border-radius:50%;transition:all 0.8s} #about_area .dotsBox .dots .Txt{color:#fff;font-size: 14px;} #about_area .dotsBox .dotsitem{position:relative} #about_area .dotsBox .dots:nth-of-type(1){top: 7.4%;right: 1.4%;} #about_area .dotsBox .dots:nth-of-type(2){top: 16.8%;right: -4.5%;} #about_area .dotsBox .dots:nth-of-type(3){top: 22.1%;right: -8.5%;} #about_area .dotsBox .dots:nth-of-type(4){top: 32.4%;right: -11.6%;} #about_area .dotsBox .dots:nth-of-type(5){top: 43.8%;right: -13.3%;} #about_area .dotsBox .dots:nth-of-type(6){top: 58.2%;right: -12.3%;} #about_area .dotsBox .dots:nth-of-type(7){top: 69.2%;right: -8.8%;} #about_area .dotsBox .dots:nth-of-type(8){top: 80.2%;right: -4.3%;} /* book_area */ #book_area{padding:6vw 0 5vw 0;background-image:url(/images/39/img-ad-bg.png);background-size:auto;background-position:0 -30px} #book_area .title_box{display:flex;flex-direction:column;align-items:center} #book_area .right .noteBox{width:min(1000px,100%);margin:auto;text-align:center;line-height:180%} #book_area .list_box{margin:70px 0 30px 0} #book_area .list_box ul{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 40px} #book_area .list_box ul li{overflow:hidden} #book_area .list_box ul li.slick-active{opacity:1} #book_area .list_box ul li .bookItem{position:relative;margin:0 auto} #book_area .list_box ul li{border-radius:30px} #book_area .list_box ul li .img_scale{position:relative;border-radius:50px;width:100%;margin:0 auto;height:310px;overflow:hidden;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out} #book_area .list_box ul li .img_scale::after{content:"";position:absolute;right:0;width:100%;height:60%;opacity:.8;background:linear-gradient(to bottom,rgba(0,0,0,0),#10284a);color:#fff;pointer-events:none;position:absolute;bottom:0;left:0;transition:all 0.5s 0s ease-out;z-index:1} #book_area .list_box ul li .img_scale img{aspect-ratio:4 / 3;position:relative;object-fit:cover} #book_area .list_box ul li .info_box{width:calc(100% - 0px);padding:30px 0px 10px;pointer-events:none;transition:all 0.5s 0s ease-out;z-index:1;display:flex;align-items:center;-webkit-clip-path:polygon(0 0,100% 0%,100% 100%,0% 100%);clip-path:polygon(0 0,100% 0%,100% 100%,0% 100%);transition:all 0.8s;position:relative;justify-content:space-between} #book_area .list_box ul li .info_box h3{font-size:20px;font-weight:400;color:var(--primary);display:flex;flex-direction:column;align-items:flex-start;height:auto} #book_area .list_box ul li .info_box h3 span{font-size:21px;font-weight:500;color:var(--triadic1)} #book_area .list_box ul li .info_box .more_btn a{width:50px} #book_area .list_box ul li:hover .info_box .more_btn a:before{background:var(--secondary)} /* product_area */ #product_area{padding:0;} #product_area .workframe{display:grid;grid-template-columns:30% 60%;gap:20px 80px;width:calc(100% - 230px );margin-left:auto;margin-right:0;background-color:#fff} #product_area .workframe .Img img{object-fit:cover;width:100%;height:100%} #product_area .workframe .Txt{padding:50px 0} #product_area .workframe .Txt .title_box{padding-bottom:40px;margin-bottom:40px;border-bottom:1px solid rgb(122 122 122 / 30%);display:grid;grid-template-columns:1fr 170px;gap:20px 20px} #product_area .workframe .title_box .page_title{margin-bottom:0} #product_area .workframe .Txt{padding-bottom:40px;margin-bottom:40px;border-bottom:1px solid rgb(122 122 122 / 30%)} #product_area .list_box ul li{margin:0 20px} #product_area .productitem .info_box h2{height:auto;-webkit-line-clamp:3;font-size:19px;color:var(--secondary);margin-bottom:20px} #product_area .productitem .info_box .number{margin:20px 0;color:#65686e;font-size:14px} #product_area .productitem .textBox{display:grid;grid-template-columns:1fr 60px;gap:20px 20px;align-items:center} #product_area .productitem .info_box .classTitle{color:var(--primary)} #product_area .productitem .info_box .btn a{position:relative;overflow:hidden;width: 90px;padding: 12px 40px;display:inline-block;border-radius: 100px;text-align: center;} #product_area .productitem .info_box .btn span{font-size: 14px;position:relative;writing-mode:inherit;color:#fff;font-weight: 400;letter-spacing: 1px;text-align: center;width: 15px;height: 15px;background-color: var(--secondary);display: flex;flex-direction: column;align-items: center;justify-content: center;border-radius: 150px;padding: 20px;} #product_area .productitem .info_box .btn span::after{content:"";position:absolute;top: calc(50% - 5px);right: 24px;width:10px;height:10px;border-top:2px solid #fff;border-right:2px solid #fff;transform:rotate(45deg)} #product_area .productitem .info_box .btnn a:before{content:"";height:100%;width:100%;display:block;position:absolute;bottom:0;left:0;-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s;background: var(--triadic2);} /* collaberation */ #collaberation{margin-left: auto;margin-right: 0;background-color: #fff;z-index: 10;position: relative;padding: 80px 100px;} #collaberation h2{font-weight: 600;font-size: 6vh;color: var(--secondary);text-align: center;margin: 0 0 60px 0;} #collaberation >div .Img img{aspect-ratio: 7.5 / 3.1;object-fit:contain;} #collaberation .collaberationItem {margin: 0 10px;} @media screen and (min-width: 1781px){ #news_area .tabs_box{display:flex;justify-content:flex-start;margin-top:0px;flex-direction:column} } @media screen and (min-width: 1501px){ #news_area .bg_box { left: 6rem; } } @media screen and (max-width:1660px){ #about_area .aboutArea .about_icon{grid-template-columns:repeat(2,1fr)} #product_area .workframe{grid-template-columns:30% 60%;padding-right:50px;width:calc(100% - 130px)} #about_area .aboutArea{grid-template-columns: 536px 1fr;} #about_area .deck02 img{width:60%} #about_area .solutionsList .imgBox{height: 520px;width: 520px;} #about_area .solutionsItem .imgBox .Img{height:420px;width:420px} #about_area .dotsBox .dots:nth-of-type(1){top: 8.4%;right: -0.6%;} #about_area .dotsBox .dots:nth-of-type(2){top: 17.8%;right: -5.5%;} #about_area .dotsBox .dots:nth-of-type(3){top: 24.1%;right: -9%;} #about_area .dotsBox .dots:nth-of-type(4){top: 32.4%;right: -11.6%;} #about_area .dotsBox .dots:nth-of-type(5){top: 43.8%;right: -12.8%;} #about_area .dotsBox .dots:nth-of-type(6){top: 56.2%;right: -12.1%;} #about_area .dotsBox .dots:nth-of-type(7){top: 68.2%;right: -9.4%;} #about_area .dotsBox .dots:nth-of-type(8){top: 80.2%;right: -4.3%;} #about_area .areaTitle .title_box p{font-size:14px} #about_area .dotsBox{left: 40%;} } @media screen and (max-width:1440px){ #book_area .list_box ul li .img_scale{height:auto} section .title_box .page_title, #book_area .title_box .page_title, #about_area .areaTitle .title_box h2, #collaberation h2{font-size: 5vh;} #about_area .dotsBox{left: 40%;} #about_area .aboutArea{grid-template-columns: 486px 1fr;} #about_area .solutionsList .imgBox{height: 430px;width: 430px;} #about_area .solutionsItem .imgBox .Img{height: 380px;width: 380px;} #about_area .dotsBox .dots:nth-of-type(1){top: 8.4%;right: -0.6%;} #about_area .dotsBox .dots:nth-of-type(2){top: 17.8%;right: -5.5%;} #about_area .dotsBox .dots:nth-of-type(3){top: 24.1%;right: -9%;} #about_area .dotsBox .dots:nth-of-type(4){top: 32.4%;right: -10.9%;} #about_area .dotsBox .dots:nth-of-type(5){top: 43.8%;right: -11.8%;} #about_area .dotsBox .dots:nth-of-type(6){top: 56.2%;right: -11.4%;} #about_area .dotsBox .dots:nth-of-type(7){top: 68.2%;right: -8.4%;} #about_area .dotsBox .dots:nth-of-type(8){top: 80.2%;right: -4.3%;} } @media screen and (max-width:1400px){ #news_area .list_box{margin:0 90px} #book_area .list_box ul{grid-template-columns:repeat(2,1fr)} #about_area .dotsBox{left:62%} #about_area .dotsBox{left:65.5%} } @media screen and (max-width: 1380px){ #about_area .aboutArea .right{display:flex;align-items:center;gap:140px} #about_area .solutionsList .imgBox{height:430px;width:430px} #about_area .solutionsItem .imgBox .Img{height:370px;width:370px;margin: auto;} #about_area .dotsBox{display:flex;justify-content:center;flex-direction:column;align-items:flex-start;gap:13px 20px;left:0;transform:none;position:relative} #about_area .aboutArea{gap:80px;display:flex;flex-direction:column;align-items:center} #about_area::after{width:100%;height: 53%;} #about_area .areaTitle .title_box p{text-align:center} #about_area .aboutArea .about_icon{grid-template-columns:repeat(4,1fr);width:100%} #about_area .areaTitle .title_box h2{text-align:center} #about_area .areaTitle .more_btn{text-align:center} #about_area .dotsBox .dots{position:relative;width: 94%;} #about_area .dotsBox .dots:nth-of-type(1){top:auto;right:0;} #about_area .dotsBox .dots:nth-of-type(2){top:auto;right:0} #about_area .dotsBox .dots:nth-of-type(3){top:auto;right:0} #about_area .dotsBox .dots:nth-of-type(4){top:auto;right:0} #about_area .dotsBox .dots:nth-of-type(5){top:auto;right:0} #about_area .dotsBox .dots:nth-of-type(6){top:auto;right:0} #about_area .dotsBox .dots:nth-of-type(7){top:auto;right:0} #about_area .dotsBox .dots:nth-of-type(8){top:auto;right:0} #about_area .aboutArea .goalsItem{margin:50px auto 0;width:min(520px,100%)} } @media screen and (min-width:1281px){ .more_btn.white a:hover font{color:#ffffff} .more_btn.white a:hover{width: 130px;} #news_area .tabs_body .tab_info .items:hover .more .arrowWrap::before,.infoArea .leftBox:hover .arrowWrap::before, .infoArea .leftBox + .rightBox .infoList li:hover .arrowWrap:before {width: 36px;height: 36px;top: calc(50% - 18px);right: 0px;background-color: rgb(223 223 223 / 70%);border: 1px solid rgb(223 223 223 / 70%);} #news_area .tabs_body .tab_info .items:hover .more .arrowWrap .arrow,.infoArea .leftBox:hover .more .arrow, .infoArea .leftBox + .rightBox .infoList li:hover .more .arrow {animation: moreArrow 1s infinite;} #news_area::after{content:"";width: 100%;height: 190px;position:absolute;bottom: 0px;right: 0;background-image: url(/images/39/img-n-bg-01.png);background-size: cover;background-repeat: no-repeat;background-position: 50% 50%;display:block;} #news_area .bg_box { width: 860px; } #book_area .list_box ul li:hover .info_box .more_btn{right:10px} #book_area .list_box ul li:hover .img_scale{width:95%;border-radius:60px} #book_area .list_box ul li:hover .img_scale img{-webkit-transform:scale(1.1);transform:scale(1.1)} } @media screen and (max-width:1280px){ #news_area .news_box{padding:0rem 0 4rem 0vw} #news_area .news_box{padding: 2.5rem 0vw 4rem;} #news_area .tabs_box .tabs_btn{width:100%} #news_area .title_box h2:before{left:50%} #news_area .title_box .more_btn{bottom:30px;left:50%;padding:10px 15px;font-size:13px} #news_area .title_box article{margin-top:1rem;margin-bottom:1.75rem} #news_area .title_box article br{display:none} #news_area .tabs_body .tab_info .items{width:auto} #news_area:after{display:none} #news_area .tabs_body .tab_info .time font.y_txt{font-size:40px} #news_area .tabs_body .tab_info .time font.m_txt{font-size:13px} #news_area .f_aitems_end{margin:0} #news_area .tabs_body .tab_info .category{font-size:13px} #news_area .tabs_body .tab_info h3{margin-top:16px} section .title_box{margin-bottom:0px} section .title_box .page_title,#book_area .title_box .page_title,#about_area .areaTitle .title_box h2{font-size: 46px;margin-bottom: 0;} #book_area .list_box ul{grid-template-columns:1fr} #news_area section{padding:0} #news_area .tabs_body .tab_info .time .classTitle, #news_area .rightBox .newsList2 .Txt .classTitle{width: 160px;} #about_area .solutionsList .imgBox::before{display:none} #about_area .workframe{width: 100%;} #about_area .aboutArea .areaTxt{width: 90%;margin:auto} #about_area .aboutArea .img_item{background-image:url(/images/39/img-ab-bg.png);background-size:cover;background-repeat:no-repeat;background-position:50% 50%;padding:60px 30px;width: calc(100% - 60px );} #about_area .aboutArea .right{display:flex;align-items:center;gap: 20px 80px;} #about_area .dotsBox{position:relative;left:0} #about_area{padding:7vw 0 0 0} #about_area::after{display:none} #collaberation{padding:50px 10px} } @media (max-width:1200px){ #imglist .img_nav{position:relative} #news_area::after{width:100%;height:45%} #about_area .about_logo{margin:50px auto;width:200px} .more_btn a{padding:6px 30px 6px 20px} #news_area .tabs_box{display:flex;flex-direction:column;align-items:flex-start;width:100%;margin-top:20px} #news_area .tabs_box .tabs_btn .newsList{display:flex;justify-content:flex-start;margin-right: 0;padding-right: 0;flex-direction: row;flex-wrap: wrap;gap: 15px 10px;} #news_area .tabs_box .tabs_body{width:calc(100% - 0px)} #news_area .tabs_body .tab_info li{width:calc((100% / 1) - 0px)} #news_area .news_box .leftBox{width:100%} #news_area .tabs_btn a{padding:10px 14px;font-size:14px} #news_prev svg,#news_next svg{width:25px;height:25px} #news_area .rightBox .newsList2 .Txt .top .dateBox .date{font-size:40px} #news_area .rightBox .newsList2 .Txt .top .dateBox .year,#news_area .rightBox .newsList2 .Txt .top .dateBox .year{font-size:16px} } @media screen and (max-width:1024px){ #product_area{margin-bottom:0} section .title_box .page_title, #book_area .title_box .page_title, #about_area .areaTitle .title_box h2,#collaberation h2{font-size: 4vh;} #product_area .workframe .Txt .title_box{grid-template-columns:1fr} #news_area #imglist{display:flex;flex-direction:column;gap:20px} #news_area #imglist .left{order:1;width:100%} #news_area #imglist .right .img_nav{display:none} #news_area .img_box li .item{grid-template-columns:1fr 60px} #news_area li .more_btn.white font{display:none} #news_area li .more_btn a{width:40px;padding:20px 10px 20px 10px} #news_area .tabs_box ul{margin-bottom:0.55rem} #product_area .workframe{display:flex;padding-right:0;width:calc(100% - 0px);margin:auto;flex-direction:column;gap: 50px;} #product_area .workframe .Txt{padding:0px 0px 30px;margin:10px 30px 40px 30px} #product_area .workframe .Img img{height:100%;aspect-ratio:5 / 3} } @media (min-width:961px){ .bottombtn{position: relative;} } @media (max-width: 960px){ #news_area{padding:3vmin 0 4vmax} #book_area .title_box{grid-template-columns:1fr;gap:20px 0;justify-content:center;justify-items:center} #book_area .title_box .page_title{margin-bottom:0;text-align:center} #book_area .right .noteBox{text-align:center} #book_area{padding: 12vw 0 8vw 0;} #news_area:before{display:none} #news_area .news_box{display:flex;flex-direction:column;padding: 3.5rem 0vw 4rem;} #news_area .news_box .leftBox{width:calc(100% - 0px);padding:0} #news_area .news_box .rightBox{width:calc(100% - 0px)} #about_area .solutionsList .imgBox{padding:0;height:360px;width:360px} #about_area .solutionsItem .imgBox .Img{height:310px;width:310px;border:16px solid rgb(255 255 255 / 90%);} #about_area .aboutArea .about_icon{grid-template-columns:repeat(2,1fr);} #news_area .rightBox .newsList2 .Txt{padding: 20px 15px;} #news_area .rightBox .newsList2 .Txt .top{grid-template-columns: 1fr;gap: 10px;} #news_area .rightBox .newsList2 .Txt .top .dateBox{display:flex;flex-direction:row-reverse;justify-content:center;gap:5px} #news_area .rightBox .newsList2 .Txt .top .dateBox .date{font-size:16px;padding-bottom:0} #news_area .rightBox .newsList2 .Txt .top .dateBox .date::before{display:none} #news_area .btn2{width:160px} #news_area .btn2 font{font-size:14px} #news_area .rightBox .newsList2 .Txt .title{font-size:18px} #news_area .rightBox .newsList2 .Txt .text{margin:10px 0 15px 0;font-size:15px} #collaberation >div .Img img{aspect-ratio: 4.5 / 3.1;} } @media screen and (max-width:768px){ #news_area .itemTitleBox{grid-template-columns:1fr;margin: 0 0px 30px;justify-content:center;justify-items:center} #news_prev svg,#news_next svg{width:20px;height:20px} #news_area{padding:0;background-image:none} #news_area img.dight{margin-top:-30px} #news_area .f_aitems_end{margin-bottom:5px;width:calc(100% - 50px)} #news_area .btn{top:20px;right:0} #news_area .tabs_body .tab_info h3{width:calc(100% - 0px)} #about_area .aboutArea .right{display:flex;flex-direction:column} } @media screen and (max-width:640px){ #news_area .title_box h2 , #about_area .about_item .title_box h2 {} .bottombtn .productbtn img{width: 16px;} #product_next::after{top: 6px;} }