@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Play:wght@400;700&display=swap');

/* main */
.section_title{font-size:52px;color:#000;line-height:100px;font-weight:600;letter-spacing:-0.045em;margin-bottom:80px}
/* mainvisual */
.m_swiper{position:relative;overflow:hidden}
.m_bg{height:100vh;width:100%;background-position:50%;background-repeat:no-repeat;background-size:cover;z-index:-1;}
.m_mobg{height:100vh;width:100%;background-position:bottom;background-repeat:no-repeat;background-size:cover;visibility:hidden;z-index:-1;}
.m_video{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:120%}
.m_video-pc{display:block}
.m_video-mo{display:none}
.m_slidetext{display:none;position:absolute;left:50%;bottom:0;max-width:1720px;width:100%;height:100%;transform:translateX(-50%);z-index:20}
.m_slidetext span{position:absolute;left:20px;bottom:142px;font-size:14px;color:var(--white);font-weight:bold;letter-spacing:0;z-index:20;transform:rotate(-90deg);transform-origin:top left}
.m_counter{display:none;position:absolute;bottom:80px;left:20px;right:0;max-width:1700px;margin:0 auto;font-size:14px;font-weight:bold;color:var(--white);transform:rotate(-90deg);transform-origin:top left;z-index:10}
.m_counter small{margin:0 3px}
.m_number-all{font-weight:400;opacity:.4}
.m_direction{display:none;position:absolute;top:50%;width:26px;height:50px;background-position:50%;background-repeat:no-repeat;cursor:pointer;transform:translateY(-50%);z-index:20}
.m_direction-left{left:6.25%;background-image:url(../images/main/main_arrow01.png)}
.m_direction-right{right:6.25%;background-image:url(../images/main/main_arrow02.png)}
.m_indicator{position:absolute;left:calc(50% - 14px);bottom:30px;display:flex;justify-content:center;align-items:center;transform:translateX(-50%);z-index:20}
.m_indicator-list{float:left}
.m_indicator-list>li{position:relative;margin-right:5px;float:left}
.m_indicator-list .swiper-pagination-bullet{position:relative;width:45px;height:45px;margin:0 5px 0 0 !important;background-color:transparent;color:#fff;text-align:center;opacity:1}
.m_indicator-list .swiper-pagination-bullet-active{border:2px solid rgba(255,255,255,0.4);opacity:1}
.m_indicator-list .swiper-pagination-bullet-active .m_indicator-loader{animation:m-loader 7s linear}
@keyframes m-loader{100%{stroke-dashoffset:0}}
.m_indicator-list .swiper-pagination-bullet-active .m_indicator-number{color:var(--white);line-height:41px}
.m_indicator-number{font-size:12px;color:rgba(255,255,255,0.6);font-weight:bold;text-align:center;line-height:45px}
.m_indicator-loader{fill:none;stroke-width:2px;stroke-linecap:round;stroke:var(--white);stroke-dasharray:314;stroke-dashoffset:314;transform:rotate(-90deg);transform-origin:center center}
.m_play-stop{width:45px;height:45px;background:url("../images/main/main_m_play.svg") 50% no-repeat;cursor:pointer}
.m_play-stop.active{background-image:url(../images/main/main_m_pause.svg)}
.m_indicator-imgbox{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}
.m_textbox{position:absolute;width:100%;left:50%;top:40%;color:var(--white);font-weight:bold;text-align:center;transform:translate(-50%, -50%);z-index:40}
.m_textbox span{display:block}
.m_textbox br{display:none}
.m_outline{font-size:108px;color:transparent;transition:all .6s ease-out 0.4s;opacity:0;transform:translateY(30px)}
.m_tag {opacity:0;transition:all 0.3s ease-out 0.3s;transform:translateY(10px);margin-bottom:10px;display:inline-block;padding:10px 30px;font-size:18px;font-weight:500;border-radius:25px;background:#08803c;}
.m_company{font-size:72px;margin-top:0;margin-bottom:20px;transition:all 0.6s ease-out 0.8s;opacity:0;transform:translateY(30px)}
.m_slogan{font-size:28px;transition:all .6s ease-out 1.2s;opacity:0;transform:translateY(30px)}
.m_swiper .swiper-slide-active .m_outline, .m_swiper .swiper-slide-active .m_tag,
.m_swiper .swiper-slide-active .m_company,.m_swiper .swiper-slide-active .m_slogan {opacity:1;transform:translateY(0)}
@media screen and (max-width:1540px) {
.m_company{font-size:60px;}
.m_slogan{font-size:20px}
}
@media screen and (max-width:1023px) {
.section_title{font-size:60px;margin-bottom:30px}
.mo-mode{display:none}
.m_swiper{max-height:1080px}
.m_swiper.no-news{height:100vh;}
.m_textbox{top:calc(40% - 100px)}
.no-news .m_textbox{top:calc(50% - 60px)}
.m_textbox br{display:block}
.m_tag{font-size:16px;padding:8px 20px;}
.m_company{font-size:60px;}
.m_slogan{font-size:32px}
.m_indicator{display:none}
}
@media screen and (max-width:768px) {
.section_title{font-size:30px;margin-bottom:40px}
.m_swiper{max-height:900px}
.m_bg{visibility:hidden}
.m_mobg{visibility:visible}
.m_video-pc{display:none}
.m_video-mo{display:block}
.m_textbox{top:calc(30% - 50px)}
.no-news .m_textbox{top:calc(40% - 30px)}
.m_tag{font-size:14px;padding:5px 15px;}
.m_company{font-size:40px;line-height:1.2}
.m_slogan{font-size:20px}
}

.m_news{position:absolute;right:0;bottom:0;width:420px;height:500px;background-color:var(--point);line-height:normal;transform:translateX(calc(100% - 60px));transition:all .6s cubic-bezier(0.87, 0, 0.13, 1);z-index:20}
.m_news-content{position:relative;padding-left:60px;padding-top:3rem;}
@keyframes main-arrow {0%{transform:translateX(5px)}50%{transform:translateX(0px)}100%{transform:translateX(5px)}}
.btn-mnews:hover{background-color:var(--point);background-image:url(../images/main/icon_next_white.svg)}
.m_news.active{transform:translateX(0)}
.m_news.active .btn-mnews{transform:rotate(0)}
.btn-mnews{position:absolute;left:0;top:0;width:60px;height:454px;cursor:pointer;background:var(--point);background-image:url(../images/main/icon_next_white.svg);background-repeat:no-repeat;background-position:center 22%;background-size:6px 10px;border-radius:25px 0 0 25px;}
.btn-mnews span{display:block;position:absolute;top:10%;left:0;color:#fff;font-size:20px;font-weight:300;text-decoration:none;transform:rotate(90deg);}
@media screen and (max-width:1023px) {
.m_news {display:none; }
}

.event_foot_pop {background:#172a88;color:#fff;z-index:1;}
.event_foot_pop .slick-controls {display:flex;align-items:center;position:absolute;left:8rem;top:1rem;}
.event_foot_pop .control {position:static;margin-left:3rem;font-size:1.2rem;color:#fff;}
.event_foot_pop .control button {display:none;}
.event_foot_pop .control button.active {display:inline-block;vertical-align:middle;color:#fff;}
.event_foot_pop .slick-counter {position:static;font-size:1.rem;font-weight:bold;}
.event_foot_pop .slick-counter i {display:inline-block;width:1px;height:1.2rem;background:#fff;transform:rotate(45deg);margin:0 .5rem;}
.event_foot_pop .slick-prev {left:6rem;font-size:0.8rem;}
.event_foot_pop .slick-prev::before { content:'〈';}
.event_foot_pop .slick-next {left:12rem;font-size:0.8rem;}
.event_foot_pop .slick-next::before { content:'〉';}
.event_foot_pop .slick-arrow {position:absolute;top:0.8rem;overflow:hidden;z-index:10;font-size:0;transition:.2s;color:#fff;width:3.6rem;height:2rem;line-height:1;}
.event_foot_pop .slick-arrow::before {font-size:1.3rem;display:block;transition:.2s;}

.pop-up {position:absolute;left:20px;bottom:50px;z-index:10}
.pop-up .close-button {transition:all 0.5s ease;position:absolute;left:0px;top:5px;background-color:#18a474;width:3rem;height:3rem;border-radius:50%;color:white;font-size:1.6rem;box-shadow:-3px 1px 6px 0px rgba(0,0,0,0.1); display:flex;justify-content:center;align-items:center;}
.pop-up .close-button:hover {background-color:#0084b4;color:#fff;}
.blur-in {animation:blur 2s forwards;}
.blur-out {animation:blur-out 2s forwards;}
@keyframes blur {0%{filter:blur(0px);}100%{filter:blur(4px);}}
@keyframes blur-out {0%{filter:blur(4px);}100%{filter:blur(0px);}}
@media screen and (max-width:1280px){ 
.pop-up	{transform:translate(5%,5%) scale(1.2);}	
}
@media screen and (max-width:1023px) {
.pop-up	{transform:translate(0%,5%) scale(1.1);}	
}
@media screen and (max-width:768px) {
.pop-up	{transform:translate(0%,5%) scale(0.8);}
}
.law_green {width:313px;height:313px;border-radius:50%;box-shadow:0px 4px 6px 0px rgba(0,0,0,0.2);background:url("../images/Law_Green.png") no-repeat;display:flex;justify-content:center;align-items:center;}
.law_green .button {font-size:1rem;padding:10px 25px;color:#fff;border-radius:20px;text-decoration:none;cursor:pointer;transition:all 0.3s ease-out;margin-top:65px;}
.gradient {background:linear-gradient(334deg, #18a474, #7525e2, #18a474); background-size:180% 180%;animation:gradient-animation 6s ease infinite;}
@keyframes gradient-animation {0% { background-position:0% 50%; }50% {background-position:100% 50%;} 100% {background-position:0% 50%;}}

/*  main :numbers */
.inbox{max-width:100%;width:1680px;margin:0 auto;padding:0 20px}
.main-list{display:flex}
.main-list>li{position:relative;transition:all .3s ease-in-out}
.main-numbers{max-width:1920px;margin:0 auto;padding-top:175px;}
.main-list-numbers{padding-bottom:170px}
.main-list-numbers>li{flex:1;text-align:center}
.main-numbers_title{position:relative;margin-top:30px;color:#000;font-weight:600}
.main-numbers_unit{display:inline-block;margin-top:50px;font-size:24px}
.main-numbers_counter{font-size:72px}
.main-numbers_counter-nodata{font-size:72px}
.main-numbers_counter-nodata sup{font-size:46px;line-height:0}
.main-numbers_description{font-size:18px;line-height:28px}
.numbers_icon{height:85px}
.numbers_icon>i {font-size:70px;}
.main-numbers_counter-nodata{position:relative}
.main-numbers_counter-nodata .main-numbers_result{visibility:hidden;opacity:0;transition-delay:0.4s}
.main-numbers_text{display:block;position:absolute;top:0;left:0;line-height:85px;transition-delay:0.4s}
.main-numbers_title.aos-animate .main-numbers_counter-nodata .main-numbers_result{visibility:visible;opacity:1}
.main-numbers_title.aos-animate .main-numbers_text{opacity:0}
@media screen and (max-width:1023px) {
.inbox{padding:0 30px}
.main-list-numbers{flex-wrap:wrap;padding-bottom:80px}
.main-list-numbers>li{flex:none;width:50%;margin-bottom:40px}
.main-list-numbers>li:nth-child(n+3):nth-child(-n+4){margin:0}
.main-numbers{padding-top:80px}
.main-numbers_counter{font-size:43px}
.main-numbers_counter-nodata{font-size:43px}
.main-numbers_unit{margin-top:30px;font-size:16px}
.main-numbers_counter-nodata sup{font-size:32px}
.main-numbers_title{margin-top:0}
.main-numbers_description{font-size:16px}
.main-numbers_counter-nodata>span{transition-delay:0.3s}
.main-numbers_text{line-height:60px;transition-delay:0.3s}
.numbers_icon{height:63px}
.numbers_icon>i {font-size:60px}
}
@media screen and (max-width:768px) {
.inbox{padding:0 20px}
.main-numbers{padding-top:60px}
.main-list-numbers{padding-bottom:60px}
.main-list-numbers>li{margin-bottom:30px}
.main-numbers_title{margin-bottom:-10px}
.main-numbers_counter{font-size:32px}
.main-numbers_counter-nodata{font-size:32px}
.main-numbers_unit{margin-top:20px;font-size:16px}
.main-numbers_counter-nodata sup{font-size:24px;line-height:24px}
.main-numbers_description{font-size:16px}
.main-numbers_text{line-height:30px}
.numbers_icon{height:42px}
.numbers_icon>i {font-size:40px}
}

/* section2 */ 
.section2 {position:relative;height:100vh;display:flex;align-items:center;justify-content:center;background:#ededed;}
.section2 .container{max-width:100%;width:1680px;margin:0 auto;padding:1rem;display:flex;justify-content:space-between;align-items:center;overflow:hidden; }
.section2 .tit_wrap {width:25%;z-index:2;text-align:left}
.section2 .tit_wrap .dot{ font-size:1.2rem;  color:var(--point);}
.section2 .tit_wrap .tit{ font-size:2.5rem;font-weight:500; line-height:3.5rem; color:#333;}
.section2 .tit_wrap .txt{ font-size:1.8rem; color:#333; }
.business { position:relative;width:60rem;height:100%;padding:1rem }
.business .inner {overflow-y:auto;overflow-x:hidden;position:relative;height:100%;}
.business .inner::-webkit-scrollbar { display:none; -ms-overflow-style:none; scrollbar-width:none; }
.business ul {margin:0 -2rem;overflow:hidden;} 
.business ul li { float:right; width:50%; padding:0 2rem; }
.business ul li:nth-child(even) { transform:translateY(11rem); }
.business ul li + li { margin:2.5rem 0; }
.business ul li a { position:relative; display:block; }
.business ul li .img { width:28rem; height:16rem; overflow:hidden; border-radius:0.5rem; text-align:center; background:rgba(0,0,0,0.1);}
.business ul li .img img { width:100%; height:100%; }
.business ul li .txt_box { text-align:left; margin-top:1.1rem;}
.business ul li .txt_box span { color:#666; font-size:1rem; font-weight:600;}
.business ul li .txt_box p { color:#111; font-size:1.2rem; font-weight:700;}
.business ul li .hover_box { position:absolute; top:0; left:0; text-align:left; display:flex; flex-wrap:wrap; flex-direction:column; justify-content:end; width:100%; height:16rem; background:rgba(0, 0, 0, 0.6); color:#fff; opacity:0; padding:2rem; font-size:1.1rem; font-weight:600; border-radius:0.5rem; }
.business ul li .hover_box .tit { font-size:1.1rem;}
.business ul li .hover_box .txt {display:block}
.business ul li .hover_box .txt ul {font-size:1rem; font-weight:300; padding:0.2rem 2rem;}
.business ul li .hover_box .txt ul li {position:relative;padding-left:0.7rem;float:none;width:100%;}
.business ul li .hover_box .txt ul li:nth-child(even) { transform:none;}
.business ul li .hover_box .txt ul li + li { margin:0;}
.business ul li .hover_box .txt ul li::before { content:''; display:block; width:3px; height:3px ; left:0; top:0.55rem; border-radius:50%; background:#fff; position:absolute;}
.business ul li a:hover .hover_box { opacity:1; }
.business ul li .hover_box { transition:all 0.3s; }
@media screen and (max-width:1240px){ 
.section2 {display:block !important;table-layout:auto !important; height:auto;} 
.section2 .container { flex-direction:column;padding:3rem 1rem 0;}
.section2 .tit_wrap {position:relative;width:100%;height:auto;padding:1rem;}
.section2 .tit_wrap .tit{ margin-bottom:1rem;font-size:2rem;}
.section2 .tit_wrap .txt{ margin-bottom:0.8rem;font-size:1.6rem;}
.business {width:100%;padding:1rem;}  
.business .inner {overflow-x:auto;overflow-y:hidden;position:relative;white-space:nowrap;width:100vw;} 
.business .inner ::-webkit-scrollbar { width:5px; height:5px; }
.business .inner ::-webkit-scrollbar-thumb { background-color:#aaa; border-radius:10px; }
.business .inner ::-webkit-scrollbar-track { background-color:#ddd; border-radius:10px; }
.business ul {margin:0;display:flex;overflow:inherit;padding-bottom:1rem;} 
.business ul li {float:left;width:100%;padding:0;margin-left:1rem;}
.business ul li:nth-child(even) {transform:translateY(0);}
.business ul li + li {margin:0 0 0 1rem;}
.business ul li .hover_box p {text-align:left;white-space:normal;}  
.business ul li .hover_box .txt ul {flex-direction:column; padding:0.2rem 0 0 0;}
.business ul li .hover_box .txt ul li {margin-left:0;}
}
@media screen and (max-width:768px){ 
.section2 .tit_wrap .dot{ font-size:1rem;}
.section2 .tit_wrap .tit{ margin-bottom:0.5rem;font-size:1.8rem;}
.section2 .tit_wrap .txt{ margin-bottom:0.5rem;font-size:1.4rem;}
.section2 .tit_wrap .btn_more {position:absolute;right:1.2rem;top:2rem; }
.business ul {width:calc(100% - 0.5rem);margin:0px -1rem;} 
.business ul li {padding:0 0.5rem;}
}
@media screen and (max-width:500px){ 
.business {width:100%;}
}

/* section3 */
.section3{height:100vh; background:#003b83;display:flex;align-items:center;justify-content:center;}
.section3 .container{max-width:100%;width:1680px;margin:0 auto;padding:1rem;display:flex;justify-content:space-between;align-items:center;overflow:hidden; }
.section3 .container .left{width:90%; margin:0 auto;color:#fff; }
.section3 .container .left .tit_wrap .dot{ font-size:1.2rem; font-weight:500; color:#fff;}
.section3 .container .left .tit_wrap .tit{ font-size:2.5rem; line-height:3.5rem; margin:1.25rem 0 0.5rem; color:#fff;}
.section3 .container .left .tit_wrap .txt{ font-size:2rem; color:#fff; }
.section3 .container .left .tml {position:relative;width:100%;text-align:center;margin-top:12%;font-size:0;} 
.section3 .container .left .tml::after {content:'';display:block;background-color:rgb(2 30 89 / 74%);width:100%;height:14rem;border-radius:0 5rem 0 5rem;}
.section3 .container .left .tml .control a.prev {position:absolute;left:1%;top:calc(50% - 1%);}
.section3 .container .left .tml .control a.next {position:absolute;right:1%;top:calc(50% - 1%);}
.section3 .container .left .tml .slider-item {position:absolute;left:8%;right:8%;top:-100%;display:flex;align-items:center;justify-content:space-around;}
.section3 .container .left .tml .item {overflow:hidden;text-align:center;font-size:0;float:left; z-index:10;}
.section3 .container .left .tml .item img {width:170px;height:100%;}
.section3 .container .left .tml > p {position:absolute;bottom:1rem;left:50%;transform:translateX(-50%);color:#fff;font-size:1.2rem;font-weight:700;} 
.section3 .container .left .tml > p i {font-size:2rem; margin-right:1rem }
.section3 .container .left .tml > p i, .section3 .container .left .tml > p span {vertical-align:middle;} 
@media screen and (max-width:1023px) {
.section3 {height:auto;}
.section3 .container  {padding:2rem 1rem 3rem;}
.section3 .container .left {width:100%;} 
.section3 .container .left .tit_wrap .dot{ font-size:1.1rem; }
.section3 .container .left .tit_wrap .tit{ font-size:1.8rem; line-height:1.8rem;} 
.section3 .container .left .tit_wrap .txt{ font-size:1.4rem; }
.section3 .container .left .tml > p { font-size:1rem;bottom:3rem;} 
.section3 .container .left .tml .control {display:none;}	
.section3 .container .left .tml .slider-item {position:absolute;left:1%;right:1%;top:-10%;display:flex;flex-wrap:wrap;flex-direction:row;justify-content:center;}
.section3 .container .left .tml::after{height:17rem;}
.section3 .container .left .tml .item img {width:125px;height:100%;}
.section3 .container .left .tml .item {margin:1%;}
}
@media screen and (max-width:768px){ 
.section3 .container .left .tit_wrap .btn_more {position:absolute;right:0;top:2rem; }
.section3 .container .left .tml {margin-top:25%;} 
.section3 .container .left .tml::after{overflow:hidden;height:23rem;}
.section3 .container .left .tml .item img {width:110px;height:100%;}	
.section3 .container .left .tml > p{bottom:1rem; } 
}

/* section4 */
.section4 {height:100vh;display:flex;align-items:center;justify-content:center;}
.section4 .container{max-width:100%;width:1680px;margin:0 auto;padding:1rem;display:flex;justify-content:space-between;align-items:center;overflow:hidden; }
.portfolio_wrap {position:relative;  }
.portfolio_wrap .tit_wrap {position:relative;width:100%;}
.portfolio_wrap .tit_wrap .dot{ font-size:1.2rem;  color:var(--point);}
.portfolio_wrap .tit_wrap .tit{ font-size:2.5rem;font-weight:500; line-height:3.5rem; color:#333;}
.portfolio_wrap .tit_wrap .txt{ font-size:2rem; color:#333; }
.portfolio_wrap .tit_wrap .btn_more {position:absolute; right:1.2rem;top:0; }
.portfolio_wrap .titTab { margin-top:30px  }
.portfolio_wrap .titTab ul li { display:inline-block;}
.portfolio_wrap .titTab ul li + li { margin-left:0.8rem;}
.portfolio_wrap .titTab ul li a { display:inline-block; width:6rem; line-height:2.5rem; background:#b0b0b0; color:#fff; text-align:center; border-radius:2rem;}
.portfolio_wrap .list_box {  width:100%; margin-top:0.75rem;}
.portfolio_wrap .list_box ul { width:calc(100% + 1.5rem); margin:-0.75rem; font-size:0; }
.portfolio_wrap .list_box li { display:inline-block; width:calc(100% / 4); padding:0.75rem;}
.portfolio_wrap .list_box li:nth-child(1) { margin-left:50%; }
.portfolio_wrap .list_box li a{ display:block; height:14.5rem; border-radius:0.5rem; color:#fff; padding:1.5rem 1.7rem; transition:all 0.15s;}
.portfolio_wrap .list_box li:nth-child(1) a { background-color:#003b83; }
.portfolio_wrap .list_box li:nth-child(2) a { background-color:#004fb3; }
.portfolio_wrap .list_box li:nth-child(3) a { background-color:#009bcf; }
.portfolio_wrap .list_box li:nth-child(4) a { background-color:#0077ca; }
.portfolio_wrap .list_box li:nth-child(5) a { background-color:#3a3da9; }
.portfolio_wrap .list_box li:nth-child(6) a { background-color:#10a37f; }
.portfolio_wrap .list_box li a .top { text-align:left;}
.portfolio_wrap .list_box li a .top em { display:inline-block; line-height:1.5rem; font-size:0.85rem; padding:0 0.75rem; border:1px solid #fff; border-radius:1rem;}
.portfolio_wrap .list_box li a .top em + em { margin-left:0.25rem;}
.portfolio_wrap .list_box li a .tit { font-size:1.4rem; font-weight:700; word-break:keep-all;display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; width:100%; max-width:100%; height:3.5rem; line-height:1.7rem; word-wrap:break-word; text-overflow:ellipsis; overflow:hidden; margin-top:1.5rem;}
.portfolio_wrap .list_box li a .txt {display:block;margin-top:1rem;padding-top:1.1rem;border-top:1px solid rgba(255,255,255,0.1);font-size:0.9rem;line-height:1.2rem;-webkit-box-orient:vertical;-webkit-line-clamp:2;width:100%;max-width:100%;height:2.5rem;word-wrap:break-word;text-overflow:ellipsis;overflow:hidden;}
.portfolio_wrap .list_box.on { display:block; }
.portfolio_wrap .titTab ul li a:hover, .portfolio_wrap .titTab ul li a:focus, .portfolio_wrap .titTab ul li a.current {background:#2c46bb;font-weight:600;}
.portfolio_wrap .list_box li a:hover,.portfolio_wrap .list_box li a:focus { animation:btnHo 0.4s ease;}
@keyframes btnHo {0% { transform:translateY(0); }50% {  transform:translateY(-4px); }100% { transform:translateY(0); }}
@media screen and (max-width:1240px){ 
.section4  {height:auto; }
.section4 .tit_wrap .tit{ margin-bottom:1rem;font-size:1.8rem;}
.section4 .tit_wrap .txt{ margin-bottom:0.8rem;font-size:1.4rem;}
.portfolio_wrap .list_box li:nth-child(1) { margin-left:0 }
.portfolio_wrap .list_box li {width:calc(100% / 3);padding:0.75rem;}
}
@media screen and (max-width:768px){ 
.portfolio_wrap { padding:1rem; }
.portfolio_wrap .tit_wrap .dot{ font-size:1rem;}
.portfolio_wrap .tit_wrap .tit{ margin-bottom:0.5rem;font-size:1.8rem;}
.portfolio_wrap .tit_wrap .txt{ margin-bottom:0.5rem;font-size:.1.4rem;}
.portfolio_wrap .list_box li { width:calc(100% /2); }
}	
@media screen and (max-width:640px){ 
.portfolio_wrap .list_box li { width:100%; }
.portfolio_wrap .list_box li a{ height:12rem;}
}

/* section5 */
.section5 {height:100vh;display:flex;align-items:center;justify-content:center;background:#f2f2f2;}
.section5 .container{max-width:100%;width:1680px;margin:0 auto;padding:1rem;display:flex;flex-direction:column;}
.section5 .tit_wrap {position:relative;width:100%;}
.section5 .tit_wrap .dot{ font-size:1.2rem; color:var(--point);}
.section5 .tit_wrap .tit{ font-size:2.5rem;font-weight:500; line-height:3.5rem; color:#333;}
.section5 .tit_wrap .txt{ font-size:1.8rem; color:#333; }
.section5 .tit_wrap .btn_more {position:absolute; right:1.2rem;top:0; }
.main-news-wrap {position:relative;margin-top:30px}
.main-news-box {position:relative; width:100%;}
.main-news {width:calc(100% + 1.5rem); margin:-0.75rem; }
.main-news:after {content:"";display:block;clear:both;}
.main-news li {float:left;width:calc(100% /4);padding:0.75rem;}
.main-news li a {position:relative;display:block;}
.main-news li a span {display:block;}
.main-news li a span.news-img {overflow:hidden;aspect-ratio:460 / 307;border:1px solid #eee;}
.main-news li a span.news-img img{transform:scale(1.01);transition:transform 0.5s;width:100%;height:100%;object-fit:cover;}
.main-news li a:hover span.news-img img {transform:scale(1.1);}
.main-news li a:hover span.news-txt .txt-title {color:var(--point);text-decoration:underline;}
.main-news li a span.news-txt {padding:35px 30px 30px 30px;background:#fff;}
.main-news li a span.news-txt .txt-title {font-size:1.2rem;width:100%;height:3.5rem;line-height:1.8rem; word-break:keep-all; word-wrap:break-word; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; text-overflow:ellipsis; overflow:hidden; }
.main-news li a span.news-txt .txt-date {margin-top:20px;}
.main-news li a .new {position:absolute;top:10px;right:10px;padding:5px;background:#f00;color:#fff;font-weight:bold;font-size:13px;line-height:12px;}
@media screen and (max-width:1240px){ 
.section5 {display:block !important;table-layout:auto !important; height:auto;} 
.section5 .container { flex-direction:column;padding:3rem 1rem 0;}
.section5 .tit_wrap .tit{ margin-bottom:1rem;font-size:2rem;}
.section5 .tit_wrap .txt{ margin-bottom:0.8rem;font-size:1.6rem;}
.main-news li  { width:calc(100% /2); }
}
@media screen and (max-width:768px){ 
.section5 .tit_wrap .dot{ font-size:1rem;}
.section5 .tit_wrap .tit{ margin-bottom:0.5rem;font-size:1.8rem;}
.section5 .tit_wrap .txt{ margin-bottom:0.5rem;font-size:1.4rem;}
.main-news-wrap {padding:30px 0 0 0;}
.main-news-box {transform:translateY(-50px);padding-bottom:30px;}
.main-news {padding:0 0.5%;}
.main-news li {float:none;width:100%;margin:10px 0;}
.main-news li a {display:table;table-layout:fixed;width:100%;}
.main-news li a>span {display:table-cell;}
.main-news li a span.news-txt {width:calc(100% - 120px);padding:15px;}
.main-news li a span.news-txt .txt-title {height:46px;font-size:18px;line-height:24px;display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}
.main-news li a span.news-txt .txt-date {font-size:14px;margin-top:10px;}	
}

.btn_more { display:flex; align-items:center; font-size:1.1rem; overflow:hidden; padding:1rem;}
.btn_more i { position:relative; z-index:0; color:#1d2088; font-size:1.2rem; margin-left:2rem; }
.btn_more i::after { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:50px; height:54px; z-index:-1; background:url(../images/main/btn_more.png) 0 0 no-repeat;background-size:contain;content:""; }
.btn_more:hover i {color:#fff; animation:txtUp 1.0s cubic-bezier(0.1, 0, 0.2, 1) both 0.3s; opacity:0;}
.btn_more:hover i::after { animation:rotate 1s linear infinite; background:url(../images/main/btn_more_on.png) 0 0 no-repeat;background-size:contain;}
@media screen and (max-width:1280px){ 
.btn_more i { margin-left:1rem; }
.btn_more i::after { width:32px; height:34px;}	
}	
@keyframes txtUp {0% { transform:translateY(50px); opacity:0; }100% { transform:translateY(0); opacity:1;}}
@keyframes rotate {100% { transform:translate(-50%, -50%) rotate(360deg); }}