@charset "utf-8";

#container {
    overflow: hidden;
}
#header .headerTit {
    color: var(--Colorwhite);
    border: 0.1rem solid var(--Colorwhite);
}
#header .naviLink {
    color: var(--Colorwhite);
}

/* =============================
    Loader (ロゴフェード型)
============================= */
#loader {
    background: var(--ColorOrange);
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    inset: 0;
    z-index: 10001;
    transition: opacity 0.8s ease;
}

#loader .imgLoader {
    width: 86.4584%;
    margin: 0 auto;
    max-width: 172rem;
    padding-bottom: 20rem;
}

#loader .loader__logo {
    width: 100%;
    opacity: 0;
    animation: logoFade 1.8s ease forwards;
}

@keyframes logoFade {
    0% {
        opacity: 0;
        transform: scale(1);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

#loader.is-hide {
    opacity: 0;
    pointer-events: none;
}

/* Hero初期は非表示 */
body.loading .secHero {
    opacity: 0;
    visibility: hidden;
}

/* フェードイン時 */
.secHero.show {
    opacity: 1;

    visibility: visible;
    transition: opacity 1.2s ease;
}
@media only screen and (max-width:1215px) {
    #loader .imgLoader {
        width: 94.67%;
        padding-bottom: 0rem;
        position: absolute;
        top: 40%;
        transform: translateY(-50%);
    }
}

/* ============================================================
    Section: Hero（メインビジュアル）
   ============================================================ */
.secHero {
    position: relative;
    height: 108rem;
    overflow: hidden;
    background: radial-gradient(circle at center, #ffa81e 0%, #ff651e 100%);
    transition: none;
}

/* 初期状態では非表示 */
body.loading .secHero {
    opacity: 0 !important;
    visibility: hidden !important;
}

.secHero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: url('../img/common/bgNoise.png') repeat;
    opacity: 0.3;
    mix-blend-mode: overlay;
    pointer-events: none;
}

/*-----------------------------------------------
  Hero 内テキスト
-----------------------------------------------*/
.secHero .heroImmner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 86.4584%;
}

.secHero .titEng {
    width: 100%;
    max-width: 172rem;
    margin: 0 auto;
}

.secHero .heroImmner .titHero {
    margin-top: 6rem;
    font-size: var(--pcFontSize40);
    line-height: var(--pcLineHeight40_75);
    letter-spacing: var(--pcLetterSpacing40_50);
    color: var(--Colorwhite);
    font-family: 'YakuHanJP_Noto', 'Hiragino Sans', 'Hiragino Kaku Gothic Pro', 'Hiragino Kaku Gothic ProN', 'Noto Sans JP', sans-serif;
}

/*-----------------------------------------------
  Hero Responsive
-----------------------------------------------*/
@media only screen and (max-width:1215px) {
    .secHero {
        height: 60rem;
        background: url(../img/index/bgHero_sp.png) center center / cover no-repeat;
    }

    .secHero .heroImmner {
        width: 100%;
        top: 54%;
    }

    .secHero .titEng {
        width: 94.667%;
        max-width: 35.5rem;
        margin: 0 auto;
    }

    .secHero .heroImmner .titHero {
        margin-top: 2.5rem;
        font-size: var(--spFontSize18);
        line-height: var(--spLineHeight18_40);
        letter-spacing: var(--spLetterSpacing18_50);
        text-align: center;
    }
}

/* ============================================================
    Section: Scroll（背景アニメーション＋テキスト）
   ============================================================ */
.secScroll {
    position: relative;
    z-index: 10;
    width: 100%;
    height: 350vh;
    /* テキスト分の高さを確保 */
    opacity: 0;
    transition: opacity 0.8s ease;
}

/*-----------------------------------------------
  Scroll 背景レイヤー
-----------------------------------------------*/
.secScroll .scrollWrapper {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 28rem;
    background: var(--Coloryellow2);
}

/* グラデーションレイヤー */
.secScroll .scrollWrapper::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 5;
    background-image: linear-gradient(-90deg,
            rgb(255, 236, 30) 30%,
            rgb(255, 202, 30) 56%,
            rgb(255, 168, 30) 100%);
    opacity: 0.6;
    pointer-events: none;
}

/* 下部の影 */
.secScroll .scrollWrapper::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 192rem;
    height: 80rem;
    z-index: 5;
}
.secScroll.lazyloaded .scrollWrapper::after {
    background: url(../img/index/bgBottomShadow.png) center bottom / cover no-repeat;
}

/*-----------------------------------------------
  背景画像（4枚構成）
-----------------------------------------------*/
.secScroll .bgTop01,
.secScroll .bgTop02,
.secScroll .bgTop03,
.secScroll .bgTop04 {
    position: absolute;
    display: block;
}

.secScroll .bgTop01 {
    top: 56rem;
    right: 3rem;
    z-index: 2;
    width: 55.573%;
    max-width: 106.7rem;
}

.secScroll .bgTop02 {
    top: 0;
    left: 0;
    width: 63.698%;
    max-width: 122.3rem;
}

.secScroll .bgTop03 {
    top: 91rem;
    left: 13rem;
    z-index: 1;
    width: 56.771%;
    max-width: 109rem;
}

.secScroll .bgTop04 {
    top: 0;
    right: 0;
    width: 44.74%;
    max-width: 85.9rem;
}

/*-----------------------------------------------
  Scroll テキスト
-----------------------------------------------*/
.secScroll .boxTxt {
    position: relative;
    z-index: 6;
    padding-top: 17rem;
}

.secScroll .boxTxt .titScroll {
    font-size: var(--pcFontSize100);
    color: var(--Colorwhite);
    font-weight: bold;
    line-height: var(--pcLineHeight100_140);
    letter-spacing: var(--pcLetterSpacing100_50);
    font-family: 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', 'YakuHanJP_Noto', 'Noto Sans JP', sans-serif;
}

.secScroll .boxTxt .txtScroll {
    margin-top: 5.3rem;
    font-size: var(--pcFontSize30);
    color: var(--Colorwhite);
    font-weight: bold;
    line-height: var(--pcLineHeight30_80);
    letter-spacing: var(--pcLetterSpacing30_50);
}

/*-----------------------------------------------
    Scroll Responsive
-----------------------------------------------*/
@media only screen and (max-width:1215px) {
    .secScroll {
        height: 290vh;
    }

    .secScroll .scrollWrapper::after {
        width: 100%;
        /* height: 28.1rem; */
        height: 75vw;
    }
    .secScroll.lazyloaded .scrollWrapper::after {
        background: url(../img/index/bgBottomShadow_sp.png) center bottom / cover no-repeat;
    }

    .secScroll .boxTxt {
        padding-top: 6rem;
    }

    .secScroll .boxTxt .titScroll {
        font-size: var(--spFontSize30);
        line-height: var(--spLineHeight30_45);
        letter-spacing: var(--spLetterSpacing30_50);
    }

    .secScroll .boxTxt .txtScroll {
        font-size: var(--spFontSize16);
        line-height: var(--pcLineHeight16_40);
        letter-spacing: var(--spLetterSpacing16_50);
        margin-top: 2rem;
        white-space: nowrap;
    }

    /* 背景画像位置調整 */
    .secScroll .bgTop01 {
        top: -2%;
        right: -9%;
        width: 84.267%;
    }

    .secScroll .bgTop02 {
        top: 0;
        left: -9%;
        width: 61.867%;
    }

    .secScroll .bgTop03 {
        bottom: unset;
        top: 57%;
        right: -5%;
        left: unset;
        width: 54.534%;
    }

    .secScroll .bgTop04 {
        bottom: unset;
        top: 58%;
        left: -7%;
        right: unset;
        width: 88.267%;
    }

    .secScroll .scrollWrapper::before {
        height: 100%;
    }

    .secScroll .scrollWrapper {
        padding-bottom: 1rem;
    }
}

@media only screen and (max-width:370px) {
    .secScroll .boxTxt .txtScroll {
        font-size: var(--spFontSize14);
    }
}

/* ============================================================
    共通アニメーション設定（Hero / Scroll）
   ============================================================ */

/* Hero固定時のレイヤー管理 */
.secHero {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 2;
    transition: opacity 0.5s ease;
}

/* Scroll固定クラス */
.secScroll.is-fixed .boxBg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

/* テキストフェードアップ */
.titScroll,
.txtScroll {
    opacity: 0;
    transform: translateX(-8rem) translateY(2rem);
    transition: all 5s cubic-bezier(0.22, 1, 0.36, 1);
}

/* 表示状態：位置に来て透明度も 1 */
.titScroll.is-show,
.txtScroll.is-show {
    opacity: 1;
    transform: translateX(0) translateY(0);
}


/*-----------------------------------------------
    secPhilosophy
-----------------------------------------------*/
.secPhilosophy {
    height: 125rem;
    position: relative;
    z-index: 10;
}

.secPhilosophy {
    background-image: -moz-radial-gradient(75% 50%, circle closest-side, rgb(255, 236, 30) 0%, rgb(255, 168, 30) 100%);
    background-image: -webkit-radial-gradient(75% 50%, circle closest-side, rgb(255, 236, 30) 0%, rgb(255, 168, 30) 100%);
    background-image: -ms-radial-gradient(75% 50%, circle closest-side, rgb(255, 236, 30) 0%, rgb(255, 168, 30) 100%);
}

.secPhilosophy .titEng,
.secPhilosophy .titJpn {
    opacity: 0;
}

.secPhilosophy .secCmnTit {
    margin-top: -6rem;
    margin-bottom: 8rem;
    z-index: 8;
    position: relative;
}

.secPhilosophy .boxFlex {
    position: relative;
    display: flex;
}

.secPhilosophy .txtPhilosophy {
    font-size: var(--pcFontSize22);
    line-height: var(--pcLineHeight22_60);
    letter-spacing: var(--pcLetterSpacing22_50);
    color: var(--Colorwhite);
    font-weight: bold;
    opacity: 0;
}

.secPhilosophy .txtPhilosophy+.txtPhilosophy {
    margin-top: 6rem;
}

.secPhilosophy .boxTxt {
    position: relative;
    z-index: 1;
}

.secPhilosophy .boxImg {
    position: absolute;
    top: 3rem;
    /* left: calc(50% - -10.5rem); */
    right: 0;
    width: 44.584%;
    max-width: 85.6rem;
}
.secPhilosophy .boxImg {
    opacity: 0;
    transform: scale(1.05);
    transition: opacity 0.6s ease, transform 1s ease;
    will-change: opacity, transform;
}

.secPhilosophy .boxBack .btnBack {
    width: 45rem;
    height: 10rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    font-size: var(--pcFontSize20);
    letter-spacing: var(--pcLetterSpacing20_50);
    color: var(--Colorwhite);
    border-radius: 0.5rem;
    border: 0.1rem solid var(--Colorwhite);
    margin: 8rem auto 0 0;
}

.secPhilosophy .boxBack .btnBack::before,
.secPhilosophy .boxBack .btnBack::after {
    right: 0rem;
}

@media only screen and (max-width:1215px) {
    .secPhilosophy.lazyloaded {
        background-image: -moz-radial-gradient(50% 30%, circle closest-side, rgb(255, 236, 30) 0%, rgb(255, 168, 30) 120%);
        background-image: -webkit-radial-gradient(50% 30%, circle closest-side, rgb(255, 236, 30) 0%, rgb(255, 168, 30) 120%);
        background-image: -ms-radial-gradient(50% 30%, circle closest-side, rgb(255, 236, 30) 0%, rgb(255, 168, 30) 120%);
    }

    .secPhilosophy .boxImg {
        top: -40%;
        left: calc(50% - 12.8rem);
        right: unset;
        width: 44.584%;
        max-width: 25.6rem;
        width: 25.6rem;
    }

    .secPhilosophy .secCmnTit .titEng {
        width: 31.4rem;
    }

    .secPhilosophy .secCmnTit {
        margin-top: 0rem;
        margin-bottom: 21rem;
        padding-top: 0;
    }

    .secPhilosophy .txtPhilosophy {
        font-size: var(--spFontSize13);
        letter-spacing: var(--spLetterSpacing13_50);
        line-height: var(--pcLineHeight13_26);
    }

    .secPhilosophy .txtPhilosophy+.txtPhilosophy {
        margin-top: 2.4rem;
    }

    .secPhilosophy {
        height: auto;
        padding: 7.3rem 0 8rem;
    }

    .secPhilosophy .boxBack .btnBack {
        width: 88.06%;
        height: 5.5rem;
        font-size: var(--spFontSize15);
        letter-spacing: var(--spLetterSpacing15_50);
        margin: 4rem auto 0;
    }

    .titScroll,
    .txtScroll {
        opacity: 0;
        transform: translateX(-8rem) translateY(2rem);
        transition: all 2s cubic-bezier(0.22, 1, 0.36, 1);
    }
}

/*-----------------------------------------------
    secMission
-----------------------------------------------*/
.secMission {
    overflow: hidden;
    position: relative;
    z-index: 10;
    background: var(--Colorwhite);
}

.secMission .listMission {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin: 1rem auto;
    width: 100%;
}

.secMission .itemLink {
    width: calc((100% - 1rem) / 2);
    height: 68rem;
    max-width: 95.5rem;
}

.secMission .itemLink a {
    padding: 5rem 4rem;
    width: 100%;
    height: 100%;
    position: relative;
    display: block;
}

.secMission .itemLink:nth-child(n + 3) {
    width: calc((100% - 2rem) / 3);
    max-width: 63.3rem;
    height: 68rem;
}

.secMission.lazyloaded .itemLink {
    background: url(../img/index/bgMission.jpg) center center / cover no-repeat;
}

.secMission.lazyloaded .itemLink.visit {
    background: url(../img/index/bgVision.jpg) center center / cover no-repeat;
}

.secMission.lazyloaded .itemLink.Base {
    background: url(../img/index/bgBase.jpg) center center / cover no-repeat;
}

.secMission.lazyloaded .itemLink.Topia {
    background: url(../img/index/bgTopia.jpg) center center / cover no-repeat;
}

.secMission.lazyloaded .itemLink.future {
    background: url(../img/index/bgFuture.jpg) center center / cover no-repeat;
}

.secMission .itemLink .imgTit {
    width: 54.286%;
    max-width: 47.5rem;
}

.secMission .itemLink.visit .imgTit {
    width: 43.886%;
    max-width: 38.4rem;
}

.secMission .itemLink.Base .imgTit {
    width: 96.9259%;
    max-width: 53.6rem;
}

.secMission .itemLink.Topia .imgTit {
    width: 75.407%;
    max-width: 41.7rem;
}

.secMission .itemLink.future .imgTit {
    width: 83.183%;
    max-width: 46rem;
}

.secMission .itemLink .titLinkBox {
    position: absolute;
    bottom: 5rem;
    left: 4rem;
}

.secMission .itemLink .txtWhite {
    font-weight: bold;
    font-size: var(--pcFontSize32);
    letter-spacing: var(--pcLetterSpacing32_50);
    color: var(--Colorwhite);
    display: inline-block;
    background: var(--Colorblack);
    padding: 1.4rem;
}

.secMission .itemLink .txtOrange {
    font-weight: bold;
    font-size: var(--pcFontSize50);
    letter-spacing: var(--pcLetterSpacing50_50);
    color: var(--ColorOrange);
    display: inline-block;
    background: var(--Colorblack);
    margin-top: 1.5rem;
    padding: 1.5rem;
}

/* ==================================================
    テキストスライド（既存そのままでOK）
================================================== */
.secMission .itemLink .titLinkBox span {
    position: relative;
    overflow: hidden;
    display: inline-block;
    transition: color 0.4s ease;
}

.secMission .itemLink .titLinkBox span::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: var(--ColorOrange);
    transition: left 0.4s ease;
    z-index: -1;
}

.secMission .itemLink .titLinkBox span {
    position: relative;
    z-index: 1;
}

/* aホバー時に背景がスライド */
.secMission .itemLink a:hover .titLinkBox span::before {
    left: 0;
}

.secMission .itemLink a:hover .titLinkBox .txtWhite,
.secMission .itemLink a:hover .titLinkBox .txtOrange {
    color: var(--Colorblack);
}

.secMission .itemLink .titLinkBox .txtWhite,
.secMission .itemLink .titLinkBox .txtOrange {
    background: var(--Colorblack);
    position: relative;
}

/* ==================================================
    丸ボタン + 矢印スライドアニメーション
================================================== */
.secMission .itemLink .circleBtn {
    position: absolute;
    bottom: 5.5rem;
    right: 4rem;
    width: 65px;
    height: 65px;
    border-radius: 50%;
    overflow: hidden;
    cursor: pointer;
    background: linear-gradient(to right, var(--Colorblack) 50%, var(--ColorOrange) 50%);
    background-size: 200% 100%;
    background-position: right bottom;
    transition: background-position 0.5s ease;
}

/* 背景スライド（aホバー時に左→右） */
.secMission .itemLink a:hover .circleBtn {
    background-position: left bottom;
}

/* ▼ 通常の矢印（黒） */
.secMission .itemLink .circleBtn::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 10px solid var(--Colorblack);
    transform: translate(-40%, -50%);
    z-index: 2;
    opacity: 1;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

/* ▼ 左から出てくる矢印（オレンジ） */
.secMission .itemLink .circleBtn::after {
    content: "";
    position: absolute;
    top: 50%;
    left: -30%;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 10px solid var(--ColorOrange);
    transform: translate(-40%, -50%);
    z-index: 2;
    opacity: 0;
    transition: left 0.4s ease, opacity 0.4s ease;
}

/* aホバー時の動き */
.secMission .itemLink a:hover .circleBtn::before {
    transform: translate(80%, -50%);
    opacity: 0;
}

.secMission .itemLink a:hover .circleBtn::after {
    left: 50%;
    opacity: 1;
}

@media only screen and (max-width:1820px) {
    .secMission .itemLink .txtOrange {
        font-size: var(--pcFontSize40);
    }
}

@media only screen and (max-width:1580px) {
    .secMission .itemLink .txtOrange {
        font-size: var(--pcFontSize38);
    }

    .secMission .itemLink .circleBtn {
        right: 2rem;
    }
}

@media only screen and (max-width:1215px) {
    .secMission {
        margin-top: 0;
    }

    .secMission .listMission {
        display: block;
        flex-wrap: unset;
        gap: 2rem;
        margin: 0 2rem 0 2rem;
        width: 100%;
    }

    .secMission .itemLink {
        width: 31.5rem;
        padding: 3rem 2rem;
        height: 33.8rem;
    }

    .secMission .itemLink .titLinkBox {
        bottom: 0;
        left: 0;
    }

    .secMission .itemLink a {
        padding: 0;
    }

    .secMission .itemLink .txtWhite {
        font-size: var(--spFontSize16);
        letter-spacing: var(--spLetterSpacing16_50);
        padding: 0.7rem;
    }

    .secMission .itemLink .txtOrange {
        font-size: var(--spFontSize24);
        letter-spacing: var(--spLetterSpacing24_26);
        margin-top: 0.8rem;
        padding: 0.8rem;
    }

    .secMission .itemLink:nth-child(n + 3) {
        width: 31.5rem;
        padding: 3rem 2rem;
        height: 33.8rem;
    }

    .secMission .itemLink .imgTit {
        width: 23.8rem;
    }

    .secMission .itemLink.visit .imgTit {
        width: 43.886%;
        max-width: 19.2rem;
    }

    .secMission .itemLink.Base .imgTit {
        width: 96.9259%;
        max-width: 26.6rem;
    }

    .secMission .itemLink.Topia .imgTit {
        width: 75.407%;
        max-width: 20.9rem;
    }

    .secMission .itemLink.future .imgTit {
        width: 83.183%;
        max-width: 23rem;
    }

    .secMission .itemLink .circleBtn {
        width: 3.5rem;
        height: 3.5rem;
        bottom: 0;
        right: 0;
    }

    .secMission .itemLink .circleBtn::before {
        border-top: 4px solid transparent;
        border-bottom: 4px solid transparent;
        border-left: 7px solid var(--Colorblack);
    }

    /* =============================
        secMission（横スクロール＋進捗バー）
    ============================= */
    .secMission {
        height: auto;
        width: 100%;
        position: relative;
        overflow: visible;
        height: 44.7rem;
    }

    .secMission .horizontal-inner {
        display: flex;
        align-items: flex-start;
        height: 100%;
        width: max-content;
        padding-top: 4rem;
    }

    .secMission .listMission {
        display: flex;
    }

    .secMission .itemLink {
        flex: 0 0 auto;
        height: auto;
    }

    /* 進捗バー */
    .secMission .scroll-progress {
        position: absolute;
        bottom: 3rem;
        left: calc(50% - 1rem);
        transform: translateX(-50%);
        width: 31.5rem;
        height: 1px;
        background: rgb(0 0 0 / 20%);
        border-radius: 3px;
        overflow: visible;
        z-index: 10;
    }

    .secMission .scroll-bar {
        display: block;
        height: 9px;
        width: 9px;
        border-radius: 50%;
        background: #ffb400;
        transition: width 0.2s linear;
        /* border-radius: 3px; */
        position: absolute;
        top: -4px;
        z-index: 10;
    }
}
@media only screen and (max-width:370px) {
    .secMission .itemLink {
        width: 28rem;
    }
    .secMission .scroll-progress {
        left: calc(50% - 0rem);
        width: 28rem;
    }
}

/*----------------------
    secEvent
------------------------*/
.secEvent {
    overflow: hidden;
    position: relative;
    z-index: 10;
}

.secEvent .secCmnTit {
    margin-top: 0;
    margin-bottom: 0;
}

@media only screen and (max-width:1215px) {
    .secEvent .secCmnTit .titEng {
        width: 15.9rem;
    }

    .secEvent .secCmnTit {
        margin-bottom: 4rem;
    }
}

.secEvent.lazyloaded {
    background: url(../img/common/bgNoise.png)0% 0% / 5rem 5rem repeat;
}

.secEvent {
    padding-top: 15rem;
    padding-bottom: 12rem;
}

.secEvent .boxContents {
    padding-bottom: 8rem;
    margin-top: 8rem;
}

.secEvent .itemEvent {
    background: var(--Colorwhite);
    position: relative;
    min-height: 40rem;
}

.secEvent .itemEvent .itemEventLink{
    display: flex;
}

.secEvent .boxLeft {
    width: 40rem;
    flex-shrink: 0;
}

.secEvent .boxLeft .imgEvent {
    height: 0;
    padding-top: 100%;
}

.secEvent .bocRight {
    margin-left: 4rem;
    padding-top: 6rem;
    padding-bottom: 6rem;
    padding-right: 5rem;
    width: calc(100% - 44rem);
}

.secEvent .bocRight .boxIconFlex {
    display: flex;
    margin-bottom: 1.8rem;
    gap: 1rem;
}

.secEvent .bocRight .txtTag {
    font-size: var(--pcFontSize14);
    letter-spacing: var(--pcLetterSpacing14_80);
    height: 3rem;
    padding: 0 0.8rem;
    background: var(--ColorOrange);
    border-radius: 0.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.secEvent .bocRight .iconNew {
    width: 6rem;
    height: 3rem;
    font-size: var(--pcFontSize15);
    background: var(--Coloryellow2);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    font-weight: bold;
    padding-top: 0.3rem;
    border-radius: 0.5rem;
}

.secEvent .bocRight .titEvent {
    font-size: var(--pcFontSize24);
    line-height: var(--pcLineHeight24_36);
    letter-spacing: var(--pcLetterSpacing24_80);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-height: 6.8rem;
}

.secEvent .bocRight .titDay,
.secEvent .bocRight .titTarget {
    font-size: var(--pcFontSize13);
    letter-spacing: var(--pcLetterSpacing13_80);
    height: 2.8rem;
    padding: 0 0.8rem;
    background: var(--bgColor);
    border-radius: 0.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.secEvent .bocRight .boxDay,
.secEvent .bocRight .boxTarget {
    display: flex;
    gap: 2rem;
}

.secEvent .bocRight .boxDay {
    margin-bottom: 1.5rem;
    padding-top: 3rem;
    margin-top: 3rem;
    border-top: 1px solid var(--borderColor);
}

.secEvent .bocRight .txtDay {
    font-size: var(--pcFontSize16);
    line-height: var(--pcLineHeight16_30);
    letter-spacing: var(--pcLetterSpacing16_50);
}

.secEvent .bocRight .txtTarget {
    font-size: var(--pcFontSize18);
    line-height: var(--pcLineHeight18_26);
    letter-spacing: var(--pcLetterSpacing18_50);
}

.secEvent .bocRight .txtUpdate {
    font-size: var(--pcFontSize12);
    letter-spacing: var(--pcLetterSpacing12_50);
    text-align: right;
    position: absolute;
    right: 2rem;
    bottom: 2rem;
    color: var(--PlaceholderColor);
}

@media only screen and (max-width:1215px) {
    .secEvent {
        padding-top: 5.5rem;
        padding-bottom: 6rem;
    }

    .secEvent .boxContents {
        padding-bottom: 0rem;
        margin-top: 4rem;
    }

    .secEvent .itemEvent {
        display: block;
        position: relative;
        min-height: auto;
    }

    .secEvent .itemEvent .itemEventLink{
        display: block;
    }

    .secEvent .boxLeft {
        width: 100%;
    }

    .secEvent .bocRight {
        margin-left: 0;
        padding: 2rem 2rem 4rem 2rem;
        width: 100%;
    }

    .secEvent .bocRight .boxIconFlex {
        margin-bottom: 1rem;
        gap: 0.6rem;
    }

    .secEvent .bocRight .txtTag {
        font-size: var(--spFontSize13);
        letter-spacing: var(--spLetterSpacing13_80);
        height: 2.5rem;
        padding: 0 0.8rem;
    }

    .secEvent .bocRight .iconNew {
        width: 5.5rem;
        height: 2.5rem;
        padding-top: 0.2rem;
    }

    .secEvent .bocRight .titEvent {
        font-size: var(--spFontSize15);
        letter-spacing: var(--spLetterSpacing15_50);
        line-height: var(--spLineHeight15_24);
        padding-bottom: 0;
        margin-bottom: 0;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        max-height: 4.4rem;
        /*任意の値*/
        white-space: wrap;
        border-bottom: unset;
    }

    .secEvent .bocRight .boxDay {
        margin-bottom: 0.7rem;
        padding-top: 1.5rem;
        margin-top: 1.5rem;
        border-top: 1px solid var(--borderColor);
    }

    .secEvent .bocRight .boxDay,
    .secEvent .bocRight .boxTarget {
        gap: 1.2rem;
        align-items: center;
    }

    .secEvent .bocRight .titDay,
    .secEvent .bocRight .titTarget {
        font-size: var(--spFontSize12);
        letter-spacing: var(--spLetterSpacing12_50);
        line-height: var(--spLineHeight12_15);
        height: 4rem;
        padding: 0.7rem;
    }

    .secEvent .bocRight .txtDay {
        font-size: var(--spFontSize12);
        letter-spacing: var(--spLetterSpacing12_50);
        line-height: var(--spLineHeight12_20);
    }

    .secEvent .bocRight .txtTarget {
        font-size: var(--spFontSize15);
        letter-spacing: var(--spLetterSpacing15_50);
        line-height: var(--spLineHeight15_22);
    }

    .secEvent .bocRight .txtUpdate {
        font-size: var(--spFontSize10);
        letter-spacing: var(--spLetterSpacing10_50);
        right: 2rem;
        bottom: 2rem;
    }
}


#sliderEvent .swiper {
    max-width: 1100px;
    margin: 0 auto;
    overflow: visible;
}

#sliderEvent .swiper-slide {
    width: 1000px;
}

#sliderEvent .swiper-button-next,
#sliderEvent .swiper-button-prev {
    position: absolute;
    top: -12.5rem;
    left: unset;
    right: 0;
    width: 6.5rem;
    height: 6.5rem;
    border-radius: 50%;
    background: var(--Colorwhite);
}

#sliderEvent .swiper-button-next {
    right: -14rem;
}

#sliderEvent .swiper-button-prev {
    right: -6.5rem;
}

#sliderEvent .swiper-button-next:after,
#sliderEvent .swiper-button-prev:after {
    content: "";
    position: absolute;
    z-index: 2;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
}

#sliderEvent .swiper-button-next:after {
    border-width: 6px 0 6px 8px;
    border-color: transparent transparent transparent var(--textColor);
}

#sliderEvent .swiper-button-prev:after {
    border-width: 6px 8px 6px 0;
    border-color: transparent #333 transparent transparent;
}

@media (max-width: 1215px) {
    #sliderEvent .swiper {
        max-width: none;
        padding: 0 2rem;
    }

    #sliderEvent .swiper-slide {
        width: calc(100% - 2rem);
    }

    #sliderEvent .swiper-button-next,
    #sliderEvent .swiper-button-prev {
        display: none;
    }

    /* SPで表示＆見た目 */
    #sliderEvent .swiper {
        padding-bottom: 2.8rem;
    }

    #sliderEvent .swiper-scrollbar {
        display: block;
        height: 0.5rem;
        background: rgba(0, 0, 0, 0.08);
        border-radius: 5rem;
        margin: 0 1.7rem;
        width: calc(100% - 6rem);
    }

    #sliderEvent .swiper-scrollbar-drag {
        background: var(--ColorOrange);
        /* つまみ */
        border-radius: 5rem;
        width: 12rem;
    }
}

/*-----------------------------------------------
    secCompany
-----------------------------------------------*/
.secCompany {
    padding: 15rem 0 0;
    height: 100rem;
    position: relative;
    z-index: 10;
}

.secCompany .secCmnTit {
    margin-top: 0;
    margin-bottom: 0;
}

.secCompany .secCmnTit .titEng {
    width: 24.2rem;
}

.secCompany.lazyloaded {
    background: url(../img/index/bgCompany.jpg) center center / cover no-repeat;
}

.secCompany .txtWrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.secCompany .txtWrapper .txtBox {
    position: relative;
    top: -3rem;
}

.secCompany .txtCompany {
    font-size: var(--pcFontSize18);
    line-height: var(--pcLineHeight18_40);
    letter-spacing: var(--pcLetterSpacing18_50);
    font-weight: bold;
}

.secCompany .boxBack .btnBack {
    width: 45rem;
    height: 10rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    font-size: var(--pcFontSize20);
    letter-spacing: var(--pcLetterSpacing20_50);
    color: var(--ColorOrange);
    background: var(--Colorblack);
    border-radius: 0.5rem;
    border: 0.1rem solid var(--textColor);
    margin: 8rem auto 0 0;
}

/* secTicker */
.secCompany .secTicker {
    overflow: hidden;
    position: absolute;
    bottom: 0;
}

.secCompany .secTicker .boxTicker {
    display: flex;
}

.secCompany .secTicker .itemTicker:nth-child(odd) {
    animation: loop 80s -40s linear infinite;
    backface-visibility: hidden;
    will-change: transform;
    transform: translate3d(0, 0, 0);
}

.secCompany .secTicker .itemTicker:nth-child(even) {
    animation: loop2 80s linear infinite;
}

@keyframes loop {
    0% {
        transform: translateX(100%);
    }

    to {
        transform: translateX(-100%);
    }
}

@keyframes loop2 {
    0% {
        transform: translateX(0);
    }

    to {
        transform: translateX(-200%);
    }
}

@media only screen and (max-width:1215px) {
    .secCompany {
        padding: 6rem 0 0;
        height: 60.2rem;
        /* height: 160vw; */
    }

    .secCompany.lazyloaded {
        background: url(../img/index/bgCompany_sp.jpg) center bottom / cover no-repeat;
    }

    .secCompany .txtWrapper {
        display: block;
        margin-top: 3.5rem;
    }

    .secCompany .txtWrapper .txtBox {
        top: 0;
    }

    .secCompany .txtCompany {
        font-size: var(--spFontSize13);
        line-height: var(--spLineHeight13_26);
        letter-spacing: var(--spLetterSpacing13_50);
    }

    .secCompany .boxBack .btnBack {
        width: 88.06%;
        height: 5.5rem;
        font-size: var(--spFontSize15);
        letter-spacing: var(--spLetterSpacing15_50);
        margin: 4rem auto 0;
    }

    .secCompany .secTicker .imgTicker {
        height: 9.2rem;
        width: 93rem;
    }
}

/*-----------------------------------------------
    secBusiness
-----------------------------------------------*/
.secBusiness {
    height: 95rem;
    overflow: hidden;
    display: flex;
    position: relative;
    z-index: 10;
    background-image: -moz-linear-gradient(-90deg, rgb(255, 236, 30) 0%, rgb(255, 202, 30) 40%, rgb(255, 168, 30) 100%);
    background-image: -webkit-linear-gradient(-90deg, rgb(255, 236, 30) 0%, rgb(255, 202, 30) 40%, rgb(255, 168, 30) 100%);
    background-image: -ms-linear-gradient(-90deg, rgb(255, 236, 30) 0%, rgb(255, 202, 30) 40%, rgb(255, 168, 30) 100%);
}

.secBusiness .secCmnTit {
    margin: 0;
}

.secBusiness .txtBusiness {
    font-size: var(--pcFontSize18);
    line-height: var(--pcLineHeight18_40);
    letter-spacing: var(--pcLetterSpacing18_50);
    font-weight: bold;
    color: var(--Colorwhite);
}

.secBusiness .wrapperBusiness {
    display: flex;
    gap: 11rem;
    height: 100%;
    align-items: center;
    overflow: hidden;
    justify-content: flex-end;
}

.secBusiness .txtWrapper {
    margin-top: 6.6rem;
}

.secBusiness .boxRight {
    padding-right: 6rem;
}

.secBusiness .secTickerBusiness {
    position: absolute;
    width: 41.667%;
    max-width: 80rem;
    height: 416rem;
    /* ← 2枚分の高さを確保 */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
    left: 2rem;
}

.secBusiness .boxBack .btnBack {
    width: 45rem;
    height: 10rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    font-size: var(--pcFontSize20);
    letter-spacing: var(--pcLetterSpacing20_50);
    color: var(--Colorwhite);
    border-radius: 0.5rem;
    border: 0.1rem solid var(--Colorwhite);
    margin: 8rem auto 0 0;
}

.secBusiness .secTickerBusiness .boxTicker {
    position: absolute;
    width: 48.75%;
    max-width: 39rem;
    height: 200%;
    /* ← 2枚分の高さを確保 */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    overflow: hidden;
}

.secBusiness .secTickerBusiness .boxTicker:nth-child(1) {
    left: 0;
}

.secBusiness .secTickerBusiness .boxTicker:nth-child(2) {
    right: 0;
}

.secBusiness .secTickerBusiness .itemTicker {
    will-change: transform;
    flex: 0 0 50%;
    /* 各画像がちょうど半分の高さを占めるように */
}

.secBusiness .secTickerBusiness .boxTicker:nth-child(1) {
    animation: vertical-up 60s linear infinite;
}

.secBusiness .secTickerBusiness .boxTicker:nth-child(2) {
    animation: vertical-down 60s linear infinite;
}

.secBusiness .secTickerBusiness.spNone {
    display: flex !important;
}

.secBusiness .secTickerBusiness.spOnly {
    display: none !important;
}

@keyframes vertical-up {
    0% {
        transform: translateY(0);
    }

    100% {
        transform: translateY(-50%);
    }

    /* ← half, because 2 images stacked */
}

/* 上から下へ */
@keyframes vertical-down {
    0% {
        transform: translateY(-50%);
    }

    100% {
        transform: translateY(0);
    }
}

@media only screen and (max-width:1215px) {
    .secTickerBusiness {
        overflow: hidden;
        width: 100%;
    }

    .secTickerBusiness .boxTicker {
        display: flex;
        width: max-content;
    }

    .secTickerBusiness .imgTicker {
        height: 20rem;
        width: 65.6rem;
    }

    .secBusiness {
        height: auto;
        display: block;
        padding-bottom: 8rem;
    }

    .secBusiness .txtWrapper {
        margin-top: 4rem;
    }

    .secBusiness .boxRight {
        padding-right: 0;
        margin-top: 6rem;
    }

    .secBusiness .txtBusiness {
        font-size: var(--spFontSize13);
        line-height: var(--spLineHeight13_26);
        letter-spacing: var(--spLetterSpacing13_50);
    }

    .secBusiness .boxBack .btnBack {
        width: 88.06%;
        height: 5.5rem;
        font-size: var(--spFontSize15);
        letter-spacing: var(--spLetterSpacing15_50);
        margin: 4rem auto 0;
    }

    .secBusiness.lazyloaded {
        background: url(../img/index/bgBusiness_sp.png) center top / cover no-repeat;
    }

    .secBusiness .secCmnTit .titEng {
        width: 24.3rem;
    }

    .secBusiness .wrapperBusiness {
        display: block;
    }

    .secBusiness .secTickerBusiness {
        width: 65.6rem;
        height: 20rem;
    }

    .secBusiness .secTickerBusiness.spNone {
        display: none !important;
    }

    .secBusiness .secTickerBusiness.spOnly {
        display: flex !important;
    }

    .secBusiness .secTickerBusiness {
        position: static;
    }


    /* secTicker */
    .secBusiness .secTickerSp {
        overflow: hidden;
        margin-top: 1rem
    }

    .secBusiness .secTickerSp .boxTicker {
        display: flex;
    }

    .secBusiness .secTickerSp .itemTicker:nth-child(odd) {
        animation: loopSp 80s -40s linear infinite;
        backface-visibility: hidden;
        will-change: transform;
        transform: translate3d(0, 0, 0);
    }

    .secBusiness .secTickerSp .itemTicker:nth-child(even) {
        animation: loopSp2 80s linear infinite;
    }

    .secBusiness .secTickerSp02 {
        overflow: hidden;
        margin-top: 1rem
    }

    .secBusiness .secTickerSp02 .boxTicker {
        display: flex;
    }

    .secBusiness .secTickerSp02 .itemTicker:nth-child(odd) {
        animation: loopSp3 80s -40s linear infinite;
        backface-visibility: hidden;
        will-change: transform;
        transform: translate3d(0, 0, 0);
    }

    .secBusiness .secTickerSp02 .itemTicker:nth-child(even) {
        animation: loopSp4 80s linear infinite;
    }

    @keyframes loopSp {
        0% {
            transform: translateX(100%);
        }

        to {
            transform: translateX(-100%);
        }
    }

    @keyframes loopSp2 {
        0% {
            transform: translateX(0);
        }

        to {
            transform: translateX(-200%);
        }
    }

    @keyframes loopSp3 {
        0% {
            transform: translateX(-100%);
        }

        to {
            transform: translateX(100%);
        }
    }

    @keyframes loopSp4 {
        0% {
            transform: translateX(-200%);
        }

        to {
            transform: translateX(0%);
        }
    }
}


/*-----------------------------------------------
    secEnvironment
-----------------------------------------------*/
.secEnvironment {
    padding: 15rem 0 0;
    height: 85rem;
    position: relative;
    z-index: 10;
}

.secEnvironment .secCmnTit {
    margin-top: 0;
    margin-bottom: 0;
}

.secEnvironment .secCmnTit .titEng {
    width: 24.2rem;
}

.secEnvironment.lazyloaded {
    background: url(../img/index/bgEnvironment.jpg) center center / cover no-repeat;
}

.secEnvironment .txtWrapper {
    display: flex;
    flex-direction: column;
}

.secEnvironment .txtWrapper .txtBox {
    position: relative;
    top: 3rem;
}

.secEnvironment .txtCompany {
    font-size: var(--pcFontSize18);
    line-height: var(--pcLineHeight18_40);
    letter-spacing: var(--pcLetterSpacing18_50);
    font-weight: bold;
    color: var(--Colorwhite);
}

.secEnvironment .boxBack .btnBack {
    width: 45rem;
    height: 10rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    font-size: var(--pcFontSize20);
    letter-spacing: var(--pcLetterSpacing20_50);
    color: var(--Colorwhite);
    border-radius: 0.5rem;
    border: 0.1rem solid var(--Colorwhite);
    margin: 8rem auto 0 0;
}

.secEnvironment .secCmnTit .titJpn {
    color: var(--Colorwhite);
}


@media only screen and (max-width:1215px) {
    .secEnvironment {
        padding: 6rem 0 0;
        height: 50rem;
        /* height: 160vw; */
    }

    .secEnvironment .secCmnTit .titEng {
        width: 33.3rem;
    }

    .secEnvironment.lazyloaded {
        background: url(../img/index/bgEnvironment_sp.jpg) center top / cover no-repeat;
    }

    .secEnvironment .txtWrapper {
        display: block;
        margin-top: 12em;
    }

    .secEnvironment .txtWrapper .txtBox {
        top: 0;
    }

    .secEnvironment .txtCompany {
        font-size: var(--spFontSize13);
        line-height: var(--spLineHeight13_26);
        letter-spacing: var(--spLetterSpacing13_50);
    }

    .secEnvironment .boxBack .btnBack {
        width: 88.06%;
        height: 5.5rem;
        font-size: var(--spFontSize15);
        letter-spacing: var(--spLetterSpacing15_50);
        margin: 4rem auto 0;
    }
}

/*-----------------------------------------------
    .secUnderImg 
-----------------------------------------------*/
.secUnderImg {
    padding: 4rem 0;
    position: relative;
    z-index: 10;
}

.secUnderImg.lazyloaded {
    background: url(../img/common/bgNoise.png) 0% 0% / 5rem 5rem repeat;
}

.secUnderImg .secTicker {
    overflow: hidden;
}

.secUnderImg .secTicker .boxTicker {
    display: flex;
}

.secUnderImg .secTicker .itemTicker:nth-child(odd) {
    animation: loop 80s -40s linear infinite;
    backface-visibility: hidden;
    will-change: transform;
    transform: translate3d(0, 0, 0);
}

.secUnderImg .secTicker .itemTicker:nth-child(even) {
    animation: loop2 80s linear infinite;
}

@media only screen and (max-width:1215px) {
    .secUnderImg .secTicker .imgTicker {
        height: 21rem;
        width: 123.9rem;
    }

    .secUnderImg {
        padding: 2rem 0;
    }
}

/*----------------------
    secTopics
------------------------*/
.secTopics {
    padding: 15rem 0;
    overflow: hidden;
    position: relative;
    z-index: 10;
}

.secTopics.lazyloaded {
    background: url(../img/common/bgNoise.png) 0% 0% / 5rem 5rem repeat;
}

.secTopics .secCmnTit {
    border-bottom: 0.1rem solid var(--Colorblack);
    padding-bottom: 4rem;
    margin: 0;
}

.secTopics .secCmnTit .titJpn {
    padding-left: 5rem;
    font-size: var(--pcFontSize20);
    letter-spacing: var(--pcLetterSpacing20_80);
}

.secTopics .secCmnTit .titEng {
    margin-bottom: 2.8rem;
}

.secTopics .secCmnTit .titJpn::after {
    width: 3.5rem;
    height: 1.8rem;
    background-color: var(--keysubColor);
}

.secTopics .innerTopics {
    display: flex;
}

.secTopics .secNews,
.secTopics .secBlog {
    width: calc((100% - 8rem) / 2);
}

.secTopics .secNews+.secBlog {
    margin-left: 8rem;
}

.secTopics .boxNewsList {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    margin-top: 4rem;
}

.secTopics .boxNewsList .item {
    width: 100%;
    margin-bottom: 3rem;
}

.secTopics .boxNewsList .itemLink {
    display: flex;
    width: 100%;
    gap: 3rem;
    position: relative;
    padding-bottom: 3rem;
    align-items: center;
}

.secTopics .boxNewsList .boxImg {
    width: 18rem;
    flex-shrink: 0;
}

.secTopics .boxNewsList .innerImg {
    height: 0;
    padding-top: 100%;
}

.secTopics .boxNewsList .boxTxt {
    color: var(--textColor);
    display: flex;
    flex-direction: column;
    margin-top: 0;
    padding-right: 4rem;
}

.secTopics .boxNewsList .boxTabList {
    display: flex;
    flex-wrap: wrap;
    margin-top: 0.3rem;
    margin-bottom: 0.6rem;
}

.secTopics .boxNewsList .tab {
    border-radius: 0.5rem;
    padding: 0.5rem 0.8rem;
    font-size: var(--pcFontSize13);
    color: var(--textColor);
    border: 0.1rem solid var(--textColor);
    margin-right: 1rem;
}

.secTopics .boxNewsList .txtTit {
    font-size: var(--pcFontSize16);
    line-height: var(--pcLineHeight16_30);
    letter-spacing: var(--pcLetterSpacing16_80);
    margin-bottom: 1rem;
    white-space: normal;
    text-overflow: inherit;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-height: 6rem;
}

.secTopics .boxNewsList .txtTime {
    font-size: var(--pcFontSize12);
    letter-spacing: var(--pcLetterSpacing12_50);
    color: var(--PlaceholderColor);
}

.secTopics .boxNewsList .itemLink::after {
    content: "";
    width: 100%;
    height: 0.1rem;
    background: var(--Colorgray);
    position: absolute;
    bottom: 0;
    left: 0;
}

.secTopics .boxNewsList .itemLink::before {
    content: "";
    width: 2.1rem;
    height: 2.1rem;
    position: absolute;
    right: 0;
    bottom: calc(50% - 0.1rem);
}

.secTopics.lazyloaded .boxNewsList .itemLink::before {
    background: url(../img/common/iconNext.png) center top / cover;
}

.secTopics .boxBack .btnBack {
    width: 38rem;
    height: 8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    font-size: var(--pcFontSize18);
    letter-spacing: var(--pcLetterSpacing18_50);
    color: var(--textColor);
    border-radius: 0.5rem;
    border: 0.1rem solid var(--textColor);
    margin: 2.2rem auto 0;
}

.secTopics .boxNewsList .item:last-child .itemLink::after {
    display: none;
}

.secTopics .iconNew {
    position: absolute;
    top: -1rem;
    left: -1rem;
    width: 6rem;
    height: 3rem;
    font-size: var(--pcFontSize15);
    background: var(--Coloryellow2);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    font-weight: bold;
    padding-top: 0.3rem;
}

@media only screen and (max-width:1215px) {
    .secTopics {
        padding: 6rem 0 8rem;
    }

    .secTopics .secCmnTit {
        padding-bottom: 3rem;
    }

    .secTopics .secCmnTit .titJpn {
        padding-left: 3.5rem;
        font-size: var(--spFontSize16);
        letter-spacing: var(--pcLetterSpacing16_80);
    }

    .secTopics .secCmnTit .titJpn::after {
        width: 2.6rem;
        height: 1.3rem;
        top: 0.2rem;
    }

    .secTopics .innerTopics {
        display: block;
    }

    .secTopics .secNews,
    .secTopics .secBlog {
        width: 100%;
    }

    .secTopics .secCmnTit .titEng {
        margin-bottom: 1.8rem;
        width: 14.3rem;
    }

    .secTopics .secBlog .secCmnTit .titEng {
        width: 13.3rem;
    }

    .secTopics .boxNewsList {
        margin-top: 2.5rem;
    }

    .secTopics .boxNewsList .boxImg {
        width: 35.825%;
        flex-shrink: 0;
    }

    .secTopics .boxNewsList .tab {
        height: auto;
        padding: 0.4rem 0.4rem;
        font-size: var(--spFontSize11);
        letter-spacing: var(--spLetterSpacing11_50);
        margin-right: 0.5rem;
    }

    .secTopics .boxNewsList .txtTit {
        font-size: var(--spFontSize12);
        line-height: var(--spLineHeight12_20);
        letter-spacing: var(--spLetterSpacing12_50);
        -webkit-line-clamp: 3;
    }

    .secTopics .boxNewsList .itemLink {
        display: flex;
        width: 100%;
        gap: 1.5rem;
        position: relative;
        padding-bottom: 2rem;
        align-items: center;
    }

    .secTopics .boxNewsList .txtTime {
        font-size: var(--spFontSize10);
        letter-spacing: var(--spLetterSpacing10_50);
    }

    .secTopics .boxBack .btnBack {
        width: 88.06%;
        height: 5.5rem;
        font-size: var(--spFontSize15);
        letter-spacing: var(--spLetterSpacing15_50);
        margin: 0 auto 0;
    }

    .secTopics .secNews+.secBlog {
        margin-left: 0;
        margin-top: 8rem;
    }

    .secTopics .iconNew {
        top: -0.5rem;
        left: -0.5rem;
        width: 5.5rem;
        height: 2.5rem;
        padding-top: 0.2rem;
    }
    .secTopics .boxNewsList .item {
        margin-bottom: 2rem;
    }
}
.pin-spacer{
    background: rgb(255, 168, 30);
}