@charset "utf-8";
#wrap {overflow:hidden;}
.container {width:92%; max-width:128rem; margin:auto;}

#main_visual {position:relative; z-index:100; overflow:hidden;}
#main_visual .swiper-slide {height:100vh; background:#000 no-repeat center/cover;}
#main_visual .swiper-slide .inbox {display:flex; align-items:flex-end; height:100vh;}

#main_visual .controls {position:absolute; left:0; right:0; bottom:7rem; z-index:100;}
#main_visual .container {display:flex; align-items:center; gap:3rem; height:3.5rem;}
#main_visual .progress {width:120px; height:3px; background:rgba(255,255,255,0.2)}
#main_visual .progress .per {display:block; height:3px; background:#fff;}
#main_visual .swiper-pagination {position:relative; top:auto; left:auto; right:auto; bottom:auto; margin:0; width:auto; font-size:15px; font-weight:700; color:#fff;}
#main_visual .btn_control {width:35px; height:35px; background:url('/theme/basic/images/main/icon_pause.png') no-repeat center/contain;}
#main_visual .btn_control.paused {background-image:url('/theme/basic/images/main/icon_play.png');}
#main_visual .txt {padding-bottom:18.5rem; color:#fff; word-break:keep-all;}
#main_visual .t1 {font-family: 'Paperlogy',sans-serif; font-size:7rem; font-weight:600; line-height:1.3;}
#main_visual .t2 {margin-top:0.5rem; font-family: 'Paperlogy',sans-serif; font-size:3.2rem; font-weight:600; line-height:1.4;}
#main_visual .t3 {margin-top:3rem; font-size:2.4rem; line-height:1.5;}

#main_visual .txt {transform:translateY(5rem); opacity:0; transition:all 0.6s 0.7s;}
#main_visual .active .txt {transform:translateY(0); opacity:1;}

@media screen and (max-width:1024px){
	#main_visual .t1 {font-size:3.8rem;}
	#main_visual .t2 {margin-top:1rem; font-size:2.4rem;}
	#main_visual .t3 {font-size:2.2rem;}
}



#section1 {margin:12rem 0;}
#section1_swiper .swiper-container {width:100%; box-sizing: border-box;}
#section1_swiper .swiper-slide {height:auto;}
#section1_swiper .inbox {display:flex; flex-direction:column; overflow:hidden; height:100%; border-radius:1rem; background:#F8F8F8; transition:background 0.4s;}
#section1_swiper .inbox img {width:100%;}
#section1_swiper .cont {flex:1; min-height:0; display:flex; flex-direction:column; padding:3.5rem 2.8rem;}
#section1_swiper .info {display:flex; align-items:center; font-size:1.5rem;}
#section1_swiper .grade {padding-left:2.3rem; background:url('../images/main/icon_grade.svg') no-repeat 0 center/contain; background-size: 13px;}
#section1_swiper .date  {position:relative; padding-left:2.3rem; margin-left:2.1rem; background:url('../images/main/icon_calendar.svg') no-repeat 0 center/contain; background-size: 13px;}
#section1_swiper .date::before {position:absolute; top:50%; left:-1rem; width:1px; height:1.2rem; margin-top:-0.6rem; background:#E0E0E0; content:'';}
#section1_swiper .tit {overflow:hidden; margin:3rem 0 1rem; font-size:2.2rem; font-weight:600; white-space:nowrap; text-overflow:ellipsis;}
#section1_swiper .tag {display:flex; align-items:center; flex-wrap:wrap; gap:0.6rem; padding-bottom:5rem;}
#section1_swiper .tag span {padding:0.5rem 1rem; border-radius:0.5rem; border:1px solid #E0E0E0; font-size:1.4rem; background:#fff; transition:background 0.4s;}
#section1_swiper .bottom {margin-top:auto;}


#section1_swiper .inbox:hover {background:#fff; box-shadow: 0 0 2.4rem 0 rgba(0, 0, 0, 0.10); transition:all 0.4s;}
#section1_swiper .inbox:hover .tag span {background:#F8F8F8;}
#section1_swiper .inbox:hover .bottom span i {background:#00BABB;}
#section1_swiper .inbox:hover .bottom span i::after {filter: brightness(0) invert(1);}

@media screen and (min-width:1024px){
	#section1_swiper .bottom span {display:inline-block; position:relative; padding-right:3.6rem; font-size:1.4rem; line-height:2.6rem;}
	#section1_swiper .bottom span i {position:absolute; top:50%; right:0; width:2.6rem; height:2.6rem; margin-top:-1.3rem; border-radius:100%; background:#EEEEEE; transition:all 0.4s;}
	#section1_swiper .bottom span i::after {position:absolute; top:0; left:0; right:0; bottom:0;background:url('../images/main/icon_arr.svg') no-repeat center/contain; content:''; transition:all 0.4s;}
}
@media screen and (max-width:1024px){
	#section1 {margin:10rem 0;}
	#section1_swiper .swiper-slide {width:40vw;}
	#section1_swiper .tag {padding-bottom:3rem;}
	#section1_swiper .swiper-slide .inbox {transform:scale(0.9); transition:all 0.4s;}
	#section1_swiper .swiper-slide-duplicate-active .inbox,
	#section1_swiper .swiper-slide-active .inbox {transform:scale(1);}
	#section1_swiper .bottom span {display:flex; align-items:center; gap:0.5rem; justify-content:center; padding:1rem; border-radius:0.5rem; color:#00BABB; font-size:1.6rem; font-weight:600; background: rgba(0, 186, 187, 0.10);}
	#section1_swiper .bottom span i {width:1.4rem; height:1.4rem; background:url('../images/main/section4_arr.png') no-repeat center/contain; transition:all 0.4s;}
}
@media screen and (max-width:780px){
	#section1_swiper .swiper-slide {width:80vw;}
	
	#section1_swiper .inbox {border: 1px solid #E0E0E0; background:#fff; box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.05);}
	#section1_swiper .tag span {border:1px solid #E0E0E0; font-size:1.4rem; background:#ECEDF0;}
}


#section2 {overflow:hidden; position:relative; padding:13rem 0 64.4rem; color:#fff; background:url('../images/main/section2_bg.jpg') #123541 no-repeat center/cover;}
#section2 .cbox {display:flex; gap:8.2rem;}
#section2 .lcont {width:45%;}
#section2 .mtit {text-align:left;}
#section2 .stxt {font-size:2rem; line-height:1.6; font-weight:400; color:rgba(255,255,255,0.6);}
#section2 .stxt div+div {margin-top:4rem;}
#section2 .rcont {flex:1; min-width:0;}
#section2 ul {margin-top:-5rem; word-break:keep-all;}
#section2 ul li {position:relative; padding:5rem 13.7rem;}
#section2 ul li::before {position:absolute; top:5rem; left:0; width:11.7rem; height:11.7rem; background:no-repeat center/contain;content:'';}
#section2 ul li::after {position:absolute; left:0; bottom:0; width:2000px; height:1px; background:rgba(255,255,255,0.1); content:'';}
#section2 ul li:nth-child(1)::before {background-image:url('../images/main/section2_icon1.svg')}
#section2 ul li:nth-child(2)::before {background-image:url('../images/main/section2_icon2.svg')}
#section2 ul li:nth-child(3)::before {background-image:url('../images/main/section2_icon3.svg')}
#section2 ul strong {display:block; margin-right:-10rem; font-size:2.8rem; font-weight:400;}
#section2 ul div {margin-top:3rem; margin-right:-20rem; font-size:1.8rem; line-height:1.5;}
@media screen and (max-width:1024px){
	#section2 {padding:10rem 0 70%; background-position:center bottom; background-size:150% auto;}
	#section2 .cbox {flex-direction:column; gap:10rem;}
	#section2 .lcont {width:100%;}
	#section2 .rcont {width:100%;}
	#section2 ul div {margin-right:0;}
	#section2 ul li {padding-right:0; padding-left:11.6rem;}
	#section2 ul li::before {width:10rem; height:10rem;}
	#section2 ul strong {font-size:2.5rem;}
 
}

#section3 {padding:13rem 0 15rem; background:#F8F8F8;}
#section3 .map {position:relative;}
#section3 ul {display:flex; margin:-1.1rem;}
#section3 li {flex: 1;; padding:1.1rem; transition:all 0.7s cubic-bezier(0.4, 0, 0.2, 1);}
#section3 .inbox {overflow:hidden; position:relative; height:52rem; border-radius:1rem; color:#fff; transition:all 0.6s cubic-bezier(0.4, 0, 0.2, 1); background: rgba(0, 0, 0, 0.50);}
#section3 .inbox::before {position:absolute; top:0; left:0; right:0; bottom:0; background:no-repeat center/cover; content:''; transition:all 0.6s cubic-bezier(0.4, 0, 0.2, 1);}
#section3 .step {display:flex; align-items:center; justify-content:center; position:absolute; top:1rem; left:1rem; z-index:2; width:10rem; height:10rem; text-align:left; background:no-repeat center/contain;}
#section3 .step span {font-family: 'Paperlogy',sans-serif; font-size:1.6rem; font-weight:700;}
#section3 li:nth-child(1) .inbox::before {background-image:url('../images/main/section3_img1.jpg');}
#section3 li:nth-child(2) .inbox::before {background-image:url('../images/main/section3_img2.jpg'); background-position:right center;}
#section3 li:nth-child(3) .inbox::before {background-image:url('../images/main/section3_img3.jpg'); background-position:100% center;}
#section3 li:nth-child(1) .step {background-image:url('../images/main/section3_step1.png')}
#section3 li:nth-child(2) .step {background-image:url('../images/main/section3_step2.png')}
#section3 li:nth-child(3) .step {background-image:url('../images/main/section3_step3.png')}
#section3 .txt {position:absolute; right:3.5rem; bottom:5rem; z-index:4; text-align:right; transition:all 0.4s;}
#section3 .txt strong {font-size:3.8rem; font-weight:700; transition:all 0.4s;}
#section3 .txt div {margin-top:2rem; font-size:2.4rem; transition:all 0.4s;}


@media screen and (min-width:1024.1px){
	#section3 ul:hover li {flex: 0.7;}
	#section3 ul:hover li:hover {flex: 2.3;}
	#section3 ul:hover li:not(:hover) .inbox::before {filter: blur(10px);}
	#section3 ul:hover li:hover .txt strong {font-size:7rem;}
	#section3 ul:hover li:hover .txt div {font-size:3.2rem;}
}
@media screen and (max-width:1024px){
	#section3 {padding:10rem 0;}
	#section3 ul {flex-direction:column;}
	#section3 .inbox {height:35rem;}
	#section3 .txt strong {font-size:3.2rem;}
	#section3 .txt div {margin-top:1.5rem;}
}

#section4 {padding:14rem 0 15rem;}
#section4 .cmap {position:relative; left:-3rem; width:142rem; margin:auto;}
#section4 .cmap img {width:142rem;}
#section4 .btn_box {position:absolute; transform:translate(-.6rem,-.6rem); z-index:3;}
#section4 .btn_box.s1 {left: 14.1rem;  top: 14.4rem;}
#section4 .btn_box.s2 {left:53rem; top:39.1rem;} 
#section4 .btn_box.s3 {left:66.3rem; top:39.5rem;} 
#section4 .btn_box.s4 {left:71.7rem; top:54.1rem;} 
#section4 .btn_box.s5 {left:71.2rem; top:56.8rem;} 
#section4 .btn_box.s6 {left:79.6rem; top:58.0rem;} 
#section4 .btn_box.s7 {left:120.2rem; top:23.0rem;} 
#section4 .btn_box.s8 {left:118rem; top:27.7rem;} 
#section4 .btn_box.s9 {left:114rem; top:27.8rem;} 
#section4 .btn_box.s10 {left:101.9rem; top:21.0rem;} 
#section4 .btn_box.s11 {left:105.7rem; top:27.9rem;} 
#section4 .btn_box.s12 {left: 105.6rem;  top: 22.7rem;} 
#section4 .btn_box.s13 {left: 14.1rem;  top: 15.6rem;}
#section4 .btn_box.s14 {left:71.7rem; top:52.9rem;}
#section4 .btn_box.s15 {left: 103.7rem;  top: 24.4rem;}
#section4 .btn_box > strong {display:block; position:relative; width:1.1rem; height:1.1rem; border-radius:100%; background:#00BABB; transition:all 0.4s; cursor:pointer;}
#section4 .btn_box > strong::before {position:absolute; top:50%; left:50%; width:6rem; height:6rem; margin:-3rem; border-radius:100%; background:rgba(0, 128, 129, 0.15); content:''; opacity:0; transform:scale(0.4);}
#section4 .btn_box > strong::after {position:absolute; top:50%; left:50%; width:3.2rem; height:3.2rem; margin:-1.6rem; border-radius:100%; background:rgba(0, 128, 129, 0.2); content:''; opacity:0; transform:scale(0.4);}
#section4 .btn_box > span {display:inline-block; margin-top:-1.6rem; padding:0 1.3rem; white-space:nowrap; border-radius:0.5rem; font-size:1.6rem; color:#fff; font-weight:600; line-height:3.1rem; background:#00BABB; transition:all 0.4s; cursor:pointer; transition:all 0.4s;}
#section4 .btn_box > span::after {transition:all 0.4s;}
#section4 .btn_box.type1 > span {position:absolute; top:50%; right:3.1rem;}
#section4 .btn_box.type1 > span::after {position:absolute; top:50%; left:100%; width:2rem; height:1px; background:#00BABB; content:'';}
#section4 .btn_box.type2 > span {position:absolute; top:50%; left:3.1rem;}
#section4 .btn_box.type2 > span::after {position:absolute; top:50%; left:-2rem; width:2rem; height:1px; background:#00BABB; content:'';}
#section4 .btn_box.type3 > span {position:absolute; top:4.4rem; left:50%; transform:translateX(-50%);}
#section4 .btn_box.type3 > span::before {display:none; position:absolute; top:-1.5rem; left:0; right:0; bottom:0; content:'';}
#section4 .btn_box.type3 > span::after {position:absolute; top:-2rem; left:50%; width:1px; height:2rem; background:#00BABB; content:'';}
#section4 .btn_box.disabled {z-index:2;}
#section4 .btn_box.disabled > strong {background:#AAA;}
#section4 .btn_box.disabled > strong::before,
#section4 .btn_box.disabled > strong::after {background:rgba(170,170,170, 0.15);}
#section4 .btn_box.disabled > span {background:#AAA;}
#section4 .btn_box.disabled > span::after {background:#AAA;}
#section4 .btn_box.on {z-index:10;}
#section4 .btn_box.on:not(.disabled) > strong {background:#008081;}
#section4 .btn_box.on > strong::before {animation: ripple1 1s infinite ease-out;}
#section4 .btn_box.on > strong::after {animation: ripple2 1s infinite ease-out;}
#section4 .btn_box.on > span {margin-right:1.1rem; margin-left:1rem;}
#section4 .btn_box.type1.on > span::after {width:3.1rem;}
#section4 .btn_box.type2.on > span::after {width:3.1rem; left:-3.1rem;}
#section4 .btn_box.type3.on > span::after {height:3.1rem; top:-3.1rem;}
#section4 .btn_box.on.type3 > span {margin:0; margin-top:-.4rem;}
#section4 .btn_box.on.type3::before {display:block;}
#section4 .btn_box.on:not(.disabled) > span {background:#008081;}
#section4 .btn_box.on:not(.disabled) > span::after {background:#008081;}


@keyframes ripple1 {
  0% {
    transform:scale(0.4);
    opacity:1;
  }
  70% {
    transform:scale(1.3);
    opacity:0.6;
  }
  100% {
    transform:scale(1.5);
    opacity:0;
  }
}

@keyframes ripple2 {
  0% {
    transform:scale(0.4);
    opacity:1;
  }
  70% {
    transform:scale(1.3);
    opacity:0.6;
  }
  100% {
    transform:scale(1.5);
    opacity:0;
  }
}



#section4 .detail {display:none; position:absolute; bottom:6rem; left:-9rem; width:40rem; padding:3rem; border-radius:1rem; background:#fff; box-shadow: 0 .4rem .4rem 0 rgba(0, 0, 0, 0.25);}
#section4 .detail::after {position:absolute; top:100%; left:5.5rem; width:4.2rem; height:3.8rem; background:url('../images/main/section4_arr2.png') no-repeat center/contain; content:'';}
#section4 .detail .tit {display:flex; gap:1rem; margin-bottom:2rem;}
#section4 .detail .tit strong {font-size:2.8rem;}
#section4 .detail .tit i {width:3rem; height:3rem;}

#section4 .detail .info > div {display:flex; font-size:1.5rem; line-height:1.4;}
#section4 .detail .info > div+div {margin-top:0.5rem;}
#section4 .detail .info > div strong {width:7rem; color:#666; font-weight:400;}
#section4 .detail .info > div span {flex:1; min-width:0;}
#section4 .detail .tag {display:flex; align-items:center; flex-wrap:wrap; gap:0.6rem; margin-top:2rem;}
#section4 .detail .tag span {padding:0.5rem 1rem; border-radius:0.5rem; border:1px solid #E0E0E0; font-size:1.3rem; background:#ECEDF0;}
#section4 .detail .bottom {margin-top:auto; padding-top:3rem;}
#section4 .detail .bottom a {display:inline-flex; gap:0.5rem; justify-content:center; font-size:1.4rem; }
#section4 .detail .bottom a i {width:1.4rem; height:1.4rem; background:url('../images/main/section4_arr.png') no-repeat center/contain; transition:all 0.4s;}
#section4 .detail .bottom a:hover {font-weight:600;}


#section4_swiper {display:none;}
#section4_swiper .inbox {overflow:hidden; border-radius:1rem; background:#fff; box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.05);}
#section4_swiper .swiper-slide .inbox {transform:scale(0.9); transition:all 0.4s;}
#section4_swiper .swiper-slide-duplicate-active .inbox,
#section4_swiper .swiper-slide-active .inbox {transform:scale(1);}
#section4_swiper .inbox {display:flex; flex-direction:column; overflow:hidden; height:100%; border: 1px solid #E0E0E0;}
#section4_swiper .img img {width:100%;}
#section4_swiper .cont {flex:1; min-height:0; display:flex; flex-direction:column; padding:3rem;}
#section4_swiper .tit {display:flex; align-items:center; gap:1.5rem; margin-bottom:2rem;}
#section4_swiper .tit strong {flex:1; min-width:0; line-height:2.4rem; font-size:2.4rem; font-weight:700;}
#section4_swiper .tit i {width:3.6rem; height:3.6rem;}
#section4_swiper .info > div {display:flex; font-size:1.8rem; line-height:1.4;}
#section4_swiper .info > div+div {margin-top:0.6rem;}
#section4_swiper .info > div strong {width:8rem; color:#666; font-weight:400;}
#section4_swiper .info > div span {flex:1; min-width:0;}
#section4_swiper .tag {display:flex; align-items:center; flex-wrap:wrap; gap:0.6rem; margin-top:2rem;}
#section4_swiper .tag span {padding:0.5rem 1rem; border-radius:0.5rem; border:1px solid #E0E0E0; font-size:1.4rem; background:#ECEDF0;}
#section4_swiper .bottom {margin-top:auto; padding-top:2.5rem;}
#section4_swiper .bottom a {display:flex; align-items:center; gap:0.5rem; justify-content:center; padding:1rem; border-radius:0.5rem; color:#00BABB; font-size:1.6rem; font-weight:600; background: rgba(0, 186, 187, 0.10);}
#section4_swiper .bottom a i {width:1.4rem; height:1.4rem; background:url('../images/main/section4_arr.png') no-repeat center/contain; transition:all 0.4s;}

#section4_earth {display:none;}

@media screen and (max-width:1500px){	
	#section4 .cmap_wrap {padding-left:50%;}
	#section4 .cmap {margin:-6rem 0; margin-left:-65rem; transform:scale(0.85);}
}
@media screen and (max-width:1024px){
	#section4 {padding:10rem 0 10rem;}
	#section4 .cmap {display:none;}
	#section4_swiper {display:block;}
	#section4_swiper .swiper-slide {width:40vw;}
	
	#section4 .cbox {width:100%;}
	
	#section4_earth {display:block;}
}
@media screen and (max-width:700px){
	#section4_swiper .swiper-slide {width:80vw;}
}



#section5 {padding:13rem 0; color:#fff; text-align:center; background:url('../images/main/section5_bg.jpg') no-repeat center 25% /cover;}
#section5 .mtit {margin-bottom:4.8rem;}
#section5 a {display:inline-flex; align-items:center; gap:1rem; font-size:1.6rem;}
#section5 a i {position:relative; width:4rem; height:4rem; border-radius:100%; background:rgba(255,255,255,0.3); transition:all 0.4s;}
#section5 a i::after {position:absolute; top:0; left:0; width:100%; height:100%; background:url('../images/main/section5_arr.svg') no-repeat center/contain; content:''; filter: brightness(0) invert(1); transition:all 0.4s;}
#section5 a:hover i {background-color:#00BABB;}
@media screen and (max-width:1024px){
	#section5 {padding:6rem 0;}
}


#section6 {padding:14rem 0; background:#f8f8f8;}
#section6_swiper .swiper-container {padding:4rem 0 2rem;}
#section6_swiper .inbox {display:flex; flex-direction:column; position:relative; height:100%; padding:7rem 4rem 4rem; border-radius:1rem; background:#fff; transition:all 0.4s;}
#section6_swiper .inbox:hover {background:#fff; box-shadow: 0 0.4rem 2.4rem 0 rgba(0, 0, 0, 0.10);}
#section6_swiper .pimg {overflow:hidden; position:absolute; top:0; left:4rem; width:8rem; height:8rem; margin-top:-4rem; border-radius:100%; vertical-align:top;}
#section6_swiper .pimg img {width:100%; height:100%;}
#section6_swiper .cont {margin-bottom:7rem; font-size:1.6rem; line-height:2.6rem;}
#section6_swiper .cont {display:-webkit-box; overflow:hidden; white-space:normal; word-wrap:break-word; -webkit-line-clamp:3; -webkit-box-orient:vertical; text-overflow: ellipsis; min-height:7.8rem;}




#section6_swiper .info {display:flex; align-items:center; margin-top:auto; font-size:1.4rem;}
#section6_swiper .info span {position:relative;}
#section6_swiper .info span+span {margin-left:2.1rem;}
#section6_swiper .info span+span::before {position:absolute; top:50%; left:-1rem; width:1px; height:1.2rem; margin-top:-0.6rem; background:#E0E0E0; content:'';}
#section6_swiper .info i {width:2.4rem; height:2.4rem; margin-right:1rem;}
@media screen and (min-width:1024.1px){
	#section6_swiper {padding-left:50%;}
	#section6_swiper .swiper-container {overflow:hidden; width:440rem; margin-left:-220rem;}
	#section6_swiper .swiper-slide {width:44rem; height:auto;} 
	#section6_swiper .inbox {margin:0 2rem;}
}
@media screen and (max-width:1024px){
	#section6 {padding:10rem 0;}
	#section6_swiper {}
	#section6_swiper .swiper-container {margin:0 -50%;}
	#section6_swiper .inbox {padding:7rem 3rem 4rem;}
	
}

#section7 {padding:16rem 0 20rem;}
#section7 .cbox {display:flex;}
#section7 .mtit {text-align:left; flex:1; min-width:0;}
#section7 .mbox {width:60.93%; position:relative;}
#section7 .mbox::before {display:block; padding-bottom:56.25%; content:'';}
#section7 .mbox iframe {position:absolute; top:0; left:0; width:100%; height:100%;}
@media screen and (max-width:1024px){
	#section7 {padding:10rem 0;}
	#section7 .cbox {flex-direction:column;}
	#section7 .mtit {text-align:center;}
	#section7 .mbox {width:100%;}
}

#section8 {padding:15rem 0 13rem; background:#F8F8F8;}
#section8 .tab {margin-bottom:8rem;}
#section8 .tab ul {display:flex; justify-content:center;}
#section8 .tab li {position:relative; padding:0 2rem;}
#section8 .tab li+li::before {position:absolute; top:50%; left:0; width:1px; height:2rem; margin-top:-1rem; background:#A7A7A7; content:'';}
#section8 .tab a {display:block; position:relative; font-size:2rem; line-height:4.8rem; transition:all 0.4s;}
#section8 .tab a::before {position:absolute; left:0; right:0; bottom:0; border-bottom:0.4rem solid #00BABB; content:''; opacity:0; transition:all 0.4s;}
#section8 .tab li.on a::before {opacity:1;}
#section8 .tab li a:hover {color:#00BABB;}
#section8 .tab li.on a {font-weight:600; color:#00BABB;}

#section8 .grid {margin:-1.4rem;}
#section8 .grid-item {width:25%;}
#section8 .grid-item .img {padding:1.4rem; position:relative;}
#section8 .grid-item .img > div {position:relative; overflow:hidden; border-radius:1rem; background:#000; transition:box-shadow 0.4s;}
#section8 .grid-item .img img {width:100%; height:auto; transition:opacity 0.4s;}
#section8 .grid-item span {position:absolute; right:3rem; bottom:2.5rem; font-size:1.6rem; color:#fff; font-weight:500; opacity:0; transition:opacity 0.4s;}
/*
#section8 .grid-item .img img {position:absolute; top:50%; left:50%; min-width:110%; height:110%; transform:translate(-50%,-50%); object-fit:cover; transition:opacity 0.4s;}
#section8 .grid-item .img > div::before {display:block; padding-bottom:153.846%; content:'';}
#section8 .grid-item:nth-child(11n+1) .img > div::before,
#section8 .grid-item:nth-child(11n+3) .img > div::before,
#section8 .grid-item:nth-child(11n+7) .img > div::before,
#section8 .grid-item:nth-child(11n+10) .img > div::before {padding-bottom:100%;}
#section8 .grid-item:nth-child(11n+6) .img > div::before {padding-bottom:139.13%;}
*/
#section8 .grid-item .img:hover > div {box-shadow: 1rem 1rem 2rem 0 rgba(0, 0, 0, 0.25);}
#section8 .grid-item .img:hover img {opacity:0.6;}
#section8 .grid-item .img:hover span {opacity:1;}
#section8 .bottom {margin-top:10rem; text-align:center;}
#section8 .bottom a {display:inline-flex; align-items:center; gap:1.5rem; position:relative; font-size:1.6rem; line-height:5rem;}
#section8 .bottom a i {position:relative; width:5rem; height:5rem; border-radius:100%; background:#EEEEEE; transition:all 0.4s;}
#section8 .bottom a i::after {position:absolute; top:0; left:0; right:0; bottom:0; background:url('../images/main/section8_arr.svg?v=1') no-repeat center/contain; content:''; transition:all 0.4s; transition:all 0.4s;}
#section8 .bottom a:hover i {background:#00BABB;}
#section8 .bottom a:hover i::after {filter: brightness(0) invert(1);}
@media screen and (max-width:1024px){
	#section8 {padding:10rem 0;}
	#section8 .tab {margin-bottom:3rem;}
	#section8 .tab ul {display:inline-flex; flex-wrap:wrap; min-width:100%; white-space:nowrap; padding-bottom:2rem;}
	#section8 .grid {margin:-1rem;}
	#section8 .grid-item {width:50%;}
	/* #section8 .grid-item:nth-child(11n+3) .img > div::before {padding-bottom:139.13%;} */
	#section8 .grid-item .img {padding:1rem;}
}