/* common */
main section:not(.visual){ padding: 90px 0;}
main h3.title,
main h3.title a{ color:#fff; font-family: var(--pre); font-weight: bold; }
main h3.title a{ display:inline-flex; align-items:center;}

/* main */
main{ overflow: hidden; background: var(--bodyC);}
main section.visual{ position: relative; width: 100%; height: 100vh; overflow: hidden; margin-bottom: 90px;}
main section.visual video{ position:absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; min-width:100%; min-height:100%; object-fit:cover; width: 100%; }

main section.care .titleBox{ color:#fff; margin-bottom: 100px; text-align: center; letter-spacing: -2px;}
main section.care #linkBox{ position: relative; width: 100%; height: 520px; background: url(/img/main/careBg.png) no-repeat 50% 50%; background-size:cover;  border-radius:45px 0 45px 45px; }
main section.care #linkBox .txtBox{ position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0 80px; color:#fff; display:flex; flex-direction:column; justify-content:center; }
main section.care #linkBox .txtBox .wrapLink{ position: absolute; top: 0; left: 0;}
main section.care #linkBox .txtBox .txt{ font-weight: 600;}
main section.care #linkBox .txtBox .title{ line-height: 1.4; margin: 20px 0 40px;}
main section.care #linkBox .txtBox .title span{ font-weight: 600;}
main section.care #linkBox .txtBox .linkBtn{ background: var(--mainC); border-radius:50px; color:#fff; font-weight: 600; display:flex; justify-content:center; align-items:center; width: 280px; height: 65px; position: relative; z-index: 5;}
main section.care #linkBox .txtBox .linkBtn img{ margin-left: 10px;}
main section.care #linkBox #linkBox{ position: absolute; top: 0; right: 0;}
/*main section.care #linkBox .cover{ position: relative; position: absolute; top: 0; right: 0; }*/
main section.care #linkBox .cover button{ position: absolute; top: 0; right: 0; color:#333; font-family: var(--pre); font-weight: 600; width: 80px; height: 80px; border-radius:50%; background: var(--mainC);}
main section.care #linkBox:hover .cover{ border: 2px solid #000; }
main section.care #linkBox:hover:before,
main section.care #linkBox:hover .cover span:after{ opacity: 0;}
/*main section.care .ctnBox{ display:flex; }*/
/*main section.care .ctnBox .slideBox{ position: relative; width: 1080px; overflow: hidden; flex-shrink:0; margin-right: 40px; }*/
/*main section.care .ctnBox .slideBox .slideDots{ position: absolute; z-index: 5; bottom: 20px; text-align: right; padding-right: 40px;}*/
/*main section.care .ctnBox .slideBox .slideDots .swiper-pagination-bullet{ background: #000; opacity: 1; width: 10px; height: 10px; transition:all 0.3s; }*/
/*main section.care .ctnBox .slideBox .slideDots .swiper-pagination-bullet-active{ background: var(--mainC);}*/
/*main section.care .ctnBox #linkBox .txtBox .title{ color:#fff; font-weight: 500; margin-bottom: 30px; }*/
/*main section.care .ctnBox #linkBox .txtBox .txt{ color:#fff; font-weight: 300; line-height: 1.6;}*/
/*main section.care .ctnBox #linkBox .cover button{ position: relative; position: absolute;  transition:all 0.3s; }*/
/*main section.care .ctnBox #linkBox .cover button img{ position: absolute; transform:translate(-50%,-50%) scale(0.5); top: 50%; left: 50%; opacity: 0; transition:all 0.5s; }*/
/*main section.care .ctnBox #linkBox:hover .cover button{ background: var(--mainC); font-size:0; }*/
/*main section.care .ctnBox #linkBox:hover .cover button img{ opacity: 1; transform:translate(-50%,-50%) scale(1);}*/

main section.news > div{ display:flex; }
main section.news > div > div{ width: calc((100% - 90px) / 2); }
main section.news > div > div > .title{ margin-bottom: 55px;}
main section.news > div > div > .title,
main section.news > div > div > .title a{ display:flex; justify-content:space-between; align-items:center; width: 100%; color:#fff; }
main section.news .awards{ margin-right: 90px; }
main section.news .awards .ctnBox{ display:flex; justify-content:space-between;  }
main section.news .awards .ctnBox .itemBox{ position: relative; width: calc((100% - 35px) / 2); height: 490px; display:block; background: var(--bgG); border-radius:20px; overflow: hidden; padding: 100px 40px 40px; display: flex;  flex-direction: column; justify-content: space-between;}
main section.news .awards .ctnBox .itemBox:before{ background-image: var(--bgG), linear-gradient(130deg, rgba(3, 188, 142, 1), rgba(0, 0, 0, 0), rgba(3, 188, 142, 1)); pointer-events:none; }
main section.news .awards .ctnBox .itemBox:hover:before{ opacity: 1;}
main section.news .awards .ctnBox span{ position: absolute; top: 0; left: 0; width: 135px; height: 50px; display:flex; justify-content:center; align-items:center; background: rgba(255,255,255,0.2); 
border-radius: 20px 0; color:#fff; font-family: var(--pre); font-weight: 600; }
main section.news .awards .ctnBox .txtBox,
main section.news .awards .ctnBox .dayBox{ position: relative; z-index: 5;}
main section.news .awards .ctnBox .txtBox .title{ color:#fff; font-weight: 600; position: relative; z-index: 5;}
main section.news .awards .ctnBox .txtBox .txt{ color:rgba(255,255,255,0.5); margin-top: 30px;}
main section.news .awards .ctnBox .dayBox{ display:flex; align-items:flex-end; justify-content:space-between; color:rgba(255,255,255,0.7); font-variant-numeric: lining-nums proportional-nums; font-family: var(--pre);  font-weight: 600;}
main section.news .awards .ctnBox .dayBox figure{ width: 140px;}
main section.news .public .ctnBox .itemBox{ position: relative;}
main section.news .public .ctnBox .itemBox a{ position: relative; display:flex; align-items:center; justify-content:space-between; padding: 50px 55px 50px 0; }
main section.news .public .ctnBox .itemBox .txtBox{ color:#fff; font-weight: 600;}
main section.news .public .ctnBox .itemBox .txtBox .title{ text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; width: 75%;}
main section.news .public .ctnBox .itemBox .txtBox .txt{ font-family: var(--pre); font-variant-numeric: lining-nums proportional-nums; margin-top: 15px;}
main section.news .public .ctnBox .itemBox:after{ content: ''; display: block; position: absolute; bottom: 1px; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.50) 50.03%, rgba(255, 255, 255, 0.00) 100%, rgba(255, 255, 255, 0.00) 100.01%); transition:all 0.5s;  opacity: 0.2;}
main section.news .public .ctnBox .itemBox:before{ content: ''; display: block; position: absolute; bottom: 1px; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, rgba(255, 255, 255, 0.00) 0%, #03BC8E 50.13%, rgba(255, 255, 255, 0.00) 100%); opacity: 0; transition:all 0.5s; }
main section.news .public .ctnBox .itemBox figure{ width: 50px; height: 50px; border-radius:50%; background:rgba(255,255,255,0.2); display:flex; justify-content:center; align-items:center; transition:all 0.5s; flex-shrink:0; }
main section.news .public .ctnBox .itemBox:hover figure{ background: var(--mainC);}
main section.news .public .ctnBox .itemBox:hover:after{ opacity: 0;}
main section.news .public .ctnBox .itemBox:hover:before{ opacity: 1;}

main section.press h3.title{ margin-bottom: 55px;}
main section.press h3.title img{ margin-left: 30px;}
main section.press .ctnBox{ display:flex; gap:40px; }
main section.press .ctnBox #linkBox{ width: calc((100% - 80px) / 3); height: 390px;}
main section.press .ctnBox #linkBox .cover{ border-radius:0 0 0 30px; }
main section.press .ctnBox #linkBox .cover:after, 
main section.press .ctnBox #linkBox .cover:before{ width: 30px; height: 30px;-webkit-mask-image: url(/img/common/bgSide02.png); mask-image: url(/img/common/bgSide02.png);}
main section.press .ctnBox #linkBox .cover:before{ bottom: -30px;}
main section.press .ctnBox #linkBox .cover span:after{ border-radius:30px; }
main section.press .ctnBox #linkBox button{ position: absolute; top: 30px; right: 30px;}
main section.press .ctnBox #linkBox button path{ transition:all 0.5s; }
main section.press .ctnBox #linkBox:hover button path{ fill:var(--mainC); }
main section.press .ctnBox #linkBox .txtBox{ left: 40px; padding-right: 40px;}
main section.press .ctnBox .itemBox .txtBox .day{ font-family: var(--pre); font-weight: bold; color:#333; font-variant-numeric: lining-nums proportional-nums;}
main section.press .ctnBox .itemBox .txtBox .title{ color:#fff; font-weight: 500; line-height: 1.5; margin: 20px 0 60px; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
main section.press .ctnBox .itemBox .txtBox .txt{ color:#ccc;l font-weight: 300; line-height: 1.6; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

main section.sns .titleBox{ position: relative; text-align: center; margin-bottom: 55px;}
main section.sns .titleBox .linkBox{ position: absolute; transform:translateY(-50%); top: 50%; right: 0; display:flex; align-items:center; }
main section.sns .titleBox .linkBox li:not(:last-child){ margin-right: 10px;}
main section.sns .titleBox .linkBox li a{ font-family: var(--pre); font-weight: 600; color:rgba(255,255,255,0.4); border-radius:50px; border:1px solid rgba(255,255,255,0.5); display:flex; justify-content:center; align-items:center; height: 40px; padding: 0 15px; line-height: 1.6; transition:all 0.5s; }
main section.sns .titleBox .linkBox li a img{ margin-right: 10px; opacity: 0.4; transition:all 0.5s; }
main section.sns .titleBox .linkBox li:hover a{ color:#fff; background: var(--mainC); border:1px solid var(--mainC); }
main section.sns .titleBox .linkBox li:hover a img{ opacity: 1;}
main section.sns .ctnBox{ display:flex; gap: 30px;}
main section.sns .ctnBox .itemBox{ position: relative; width: calc((100% - 90px) / 4); }
main section.sns .ctnBox .itemBox figure{ position: relative; width: 100%; height: 255px; border-radius: 20px; overflow: hidden; margin-bottom: 30px;}
main section.sns .ctnBox .itemBox:before{ content:""; display:block; position: absolute; top: 0; left: 0; width: 100%; height: 255px; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%); z-index: 2; transition:all 0.5s; pointer-events:none; } 
main section.sns .ctnBox .itemBox figure .img{ position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; min-width:100%; min-height:100%; object-fit:cover; }
main section.sns .ctnBox .itemBox figure .btn{ width: 75px; height: 75px; background: rgba(0,0,0,0.5); border-radius:50%; display:flex; justify-content:center; align-items:center; 
position: absolute; transform:translate(-50%,-50%); top: 50%; left: 50%; transition:all 0.5s; opacity: 0; z-index: 5;}
main section.sns .ctnBox .itemBox:hover:before{ top: 100%; }
main section.sns .ctnBox .itemBox:hover figure .btn{ opacity: 1;}
main section.sns .ctnBox .itemBox .title{ color:#fff; font-weight: 600; line-height: 1.6; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; position: relative; z-index: 5; }
main section.sns .ctnBox{ margin-bottom: 50px;}

main section.sns .listWrap{ display:flex; overflow: hidden;}
main section.sns .listWrap:first-child{ margin-bottom: 30px;}
main section.sns .listWrap .rollingList{ display:flex; width: max-content;}
main section.sns .listWrap .rollingList li{ width: max-content; display: flex; justify-content: center; align-items: center; margin-right: 80px;}
main section.sns .listWrap .rollingList li img{  max-width: max-content; max-height: 100%; width: 100%;}
main section.sns .listWrap .rollingList.origin{ animation: 50s linear 0s infinite normal forwards running rollingleft;}
main section.sns .listWrap .rollingList.clone{ animation: 50s linear 0s infinite normal forwards running rollingleft2;}
main section.sns .listWrap2 .rollingList.origin{ animation: 50s linear 0s infinite normal forwards running rollingRight;}
main section.sns .listWrap2 .rollingList.clone{ animation: 50s linear 0s infinite normal forwards running rollingRight2;}