@charset "UTF-8";
/* -----------------------------------------------------------
cookie表記
----------------------------------------------------------- */
#cookie-notice,
#cookie-notice *{
    transition-duration: .5s !important;
    /* transition-delay: .1s !important; */
    opacity: 0 !important;
    visibility: hidden !important;
    animation: none !important;
}
.cookies-not-set #cookie-notice,
.cookies-not-set #cookie-notice *{
    opacity: 1 !important;
    visibility: visible !important;
}
.cookies-refused #cookie-notice,
.cookies-refused #cookie-notice *{
    opacity: 0 !important;
    visibility: hidden !important;
}
#cookie-notice .cookie-notice-container{
    display: flex !important;
    align-items: center !important;
}
#cookie-notice,
#cookie-notice.cn-effect-fade,
#cookie-notice.cookie-notice-visible.cn-effect-fade,
#cookie-notice.cookie-revoke-visible.cn-effect-fade{
    background: rgba(30, 100, 189, 0.9) !important;
    padding: 0 !important;
}
.cookie-notice-container {
    text-align: left !important;
    max-width: 1300px !important;
    margin: auto !important;
    padding: 20px 50px 10px !important;
}
#cookie-notice #cn-notice-text {
    font-family: var(--ff_notoSans);
    font-weight: 200;
    text-align: left !important;
    width: calc(100% - 350px);
    font-size: 14px;
    line-height: 1.57;
    vertical-align: top;
}
#cookie-notice #cn-notice-text a {text-decoration: underline;}
#cookie-notice #cn-notice-buttons{
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    border: 1px solid var(--themeColor);
    background: #fff;
    transition: 0.3s;
    width: fit-content !important;
    margin: 0 0 0 min(8%, 90px) !important;
}
#cookie-notice .cn-button:not(.cn-button-custom) {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-height: 35px !important;
    padding: 0.1em .8em 0.15em !important;
    color: var(--themeColor) !important;
    font-family: var(--ff_notoSans);
    min-width: 220px !important;
    width: auto !important;
    text-align: center !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    transition: 0.3s !important;
}
#cookie-notice #cn-notice-buttons:has(.cn-button:not(.cn-button-custom):hover){
    --themeColor: #fff;
    background: var(--mainColor);
}
#cookie-notice .cn-button:not(.cn-button-custom):hover{
    opacity: 1;
    color: #fff !important;
}
.cn-close-icon {
    right: 25px !important;
    top: 30px !important;
    opacity: 1 !important;
}
.cn-close-icon:before, .cn-close-icon:after {
    height: 20px !important;
    background: #fff !important;
}

/* ============================================== */
/*                    共通設定                    */
/* ============================================== */
/* *,
*::before,
*::after {
    outline: 1px solid red;
} */

:root{
    /* Corporate Color */
    --c_ryokaSangyo: #1e64bd;
    --c_ryokaKogyo: #4b9dd6;
    --c_nichiden: #006837;
    --c_ryokaTech: #000080;
    --c_ryokaMalaysia: #093146;

    /* Common */
    --txtColor: #31373d;
    --mainColor: var(--c_ryokaSangyo);
    --accentColor: #f69b31;
    --sustainColor: #209147;
    --grayMain: #83878b;
    --textLink: #1a73e8;
    --alertColor: #da0000;
    --themeColor: var(--mainColor); /* サステナのエディタ見出し、ボタン等 */
    --gray: #c8c8c8;
    /* Background */
    --bgMain: #f4f7fc;
    --bgNews: #f2f8fc;
    --bgEdit: #eff7fa;
    --bgSustain: #e2edd5;
    --bgSpHam: #eff4fa;
    --bgFooter: #3d7ac6;
    /* border */
    --borderMain: #b1d6e8;
    --borderPcMenu: #d8eaf3;
    --borderSpMenu: #8eb1de;
    --borderWhite: rgba(255, 255, 255, 0.24);
    /* フォント */
    --ff_notoSans: "Noto Sans JP", serif;
    --ff_plusJakartaSans: "Plus Jakarta Sans", sans-serif;
    --ff_oswald: "Oswald", sans-serif;
    /* 幅・高さ */
    --headerHeight: 110px;
    /* skew */
    --skewDeg: 10deg;
}
html:has(body){margin-top: 0 !important;}
html,body{overflow-x: hidden;}
body:has(.ham.open),
html:has(.ham.open){overflow: hidden;}
html:has(main.home),body:has(main.home),
html:has(main.page_product),body:has(main.page_product){overflow-x: clip;}
body:has(main.home):has(.ham.open),
html:has(main.home):has(.ham.open),
body:has(main.page_product):has(.ham.open),
html:has(main.page_product):has(.ham.open){overflow: clip;}
body{
    position: relative;
    z-index: 0;
    color: var(--txtColor);
    font-family: var(--ff_notoSans);
    line-height: 1.875;
    word-break: break-all;
}
figure,
img{
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
}
a{transition: .3s;}
a:hover{opacity: 0.6;}
a[href*=tel]{pointer-events: none;}
textarea{resize: none;}
.inner{
    width: 100%;
    max-width: 1210px;
    padding: 0 50px;
    margin: 0 auto;
}
body:has(main.home) .inner{max-width: 1300px;}
.flex{display: flex;}
.pc_cont{display: block !important;}
.sp_cont{display: none !important;}
.txt_red{color: var(--alertColor);}

/* ============================================== */
/*            スクロールアニメーション            */
/* ============================================== */
.scrollin {
    visibility: hidden;
    opacity: 0;
    transition: 1.2s;
    transition-property: visibility, opacity, transform;
}
.scrollin.bottom {transform: translateY(30px);}
.scrollin.left {transform: translateX(-30px);}
.scrollin.right {transform: translateX(30px);}
.scrollin.active,
.scrollin.bottom.active,
.scrollin.left.active,
.scrollin.right.active {
visibility: visible;
opacity: 1;
transform: translate(0,0);
}

/* -----------------------------------------------------------
template
----------------------------------------------------------- */
main{margin: var(--headerHeight) auto 0;}

/* ============================================== */
/*                    ヘッダー                    */
/* ============================================== */
header{
    --w_logo: 180px;
    --w_contact: 130px;
    position: fixed;
    z-index: 10;
    inset: 0 0 auto;
    display: flex;
    align-items: center;
    background: var(--mainColor);
    height: var(--headerHeight);
    color: #fff;
    transition: .3s transform;
}
header.h_hide{transform: translateY(calc(var(--headerHeight) * -1 - 1px));}
/* logo */
header > .logo{
    width: var(--w_logo);
    height: 100%;
}
header > .logo a{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}
header > .logo a img{max-width: 64px;}
/* flex */
header > .flex{
    --w_txt: 144px;
    justify-content: space-between;
    width: calc(100% - var(--w_logo) - var(--w_contact));
    border-left: 1px solid var(--borderWhite);
    padding: 0 32px 0 24px;
    height: 100%;
}
header .c_name{
    display: flex;
    align-items: center;
    font-weight: 700;
    font-size: 1.125em;
    width: var(--w_txt);
}
header > .flex > div{

    width: min(calc(100% - var(--w_txt)), 820px);
}
header > .flex > div:not(.ham){
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
/* sub menu */
header .sub_menu{
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 19px 0 0;
}
header .sub_menu > li{
    width: 40%;
    padding: 0 15px;
    border-right: 1px solid var(--borderWhite);
}
header .sub_menu .m_global{max-width: 128px;}
header .sub_menu .m_fb{max-width: 52px;}
header .sub_menu .m_search{max-width: 50px;}
header .sub_menu > li a,
header .sub_menu > li > p{
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: right;
    font-size: 13px;
}
header .sub_menu .m_global p::before{
    display: block;
    content: '';
    width: 1.23em;
    height: 1.23em;
    background: url(../img/common/ico/h_global.svg) no-repeat center / contain;
    margin: 0 0.45em 0 0;
}
header .sub_menu .m_global p::after{
    display: block;
    content: '';
    width: .5em;
    height: .5em;
    margin: 0 0 0 0.65em;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    transform: rotate(45deg);
}
/* 言語プルダウン */
header .sub_menu .m_global{
    position: relative;
    z-index: 0;
}
header .sub_menu > li p{cursor: pointer;}
header .sub_menu > .m_search p{transition: 0.3s;}
header .sub_menu > .m_search p:hover{opacity: 0.6;}
header .sub_menu .m_global ul{
    position: absolute;
    z-index: 1;
    inset: 100% 4px auto auto;
    width: calc(100% - 20px);
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
}
header .sub_menu .m_global ul li a{
    background: #fff;
    border: 1px solid var(--grayMain);
    color: var(--txtColor);
    padding: 0.2em 0;
}
header .sub_menu .m_global ul li:not(:last-of-type) a{border-bottom: none;}
header .sub_menu .m_global ul li.is_active a{
    background: #f2f9ff;
    pointer-events: none;
}
header .sub_menu .m_global ul li a:hover{
    opacity: 1;
    background: #e3f1ff;
}
header .sub_menu .m_global.is_hovered ul{
    opacity: 1;
    visibility: visible;
}
/* 検索欄 */
header .g_nav .g_nav_items .g_nav_search .s_cont{
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
}
header .g_nav .g_nav_items .g_nav_search .s_ttl{
    color: var(--mainColor);
    font-size: 31px;
    font-weight: 500;
    text-align: center;
    margin: 0 auto 0.3em;
}
header form input{
    padding: 10px 60px 10px 10px;
    width: 100%;
    margin: 0 auto;
    height: 50px;
    border: 1px solid var(--borderMain);
}
header .g_nav .g_nav_items .g_nav_search .close_btn{
    position: absolute;
    z-index: 0;
    inset: -25px -25px auto auto;
    margin: auto;
    width: 40px;
    height: 40px;
    cursor: pointer;
    font-size: 0;
}
header .g_nav .g_nav_items .g_nav_search .close_btn::before,
header .g_nav .g_nav_items .g_nav_search .close_btn::after{
    position: absolute;
    z-index: 0;
    inset: 0;
    margin: auto;
    content: '';
    width: 23px;
    height: 3px;
    background: var(--mainColor);
}
header .g_nav .g_nav_items .g_nav_search .close_btn::before{transform: rotate(-45deg);}
header .g_nav .g_nav_items .g_nav_search .close_btn::after{transform: rotate(45deg);}
header .search_box{
    position: relative;
    z-index: 0;
    border-radius: 2px;
    overflow: hidden;
}
header .search_box button{
    position: absolute;
    z-index: 1;
    inset: 0 0 0 auto;
    margin: auto;
    display: block;
    width: 50px;
    height: 50px;
    background: var(--mainColor);
}
header .search_box button span{font-size: 0;}
header .search_box button span::before{
    position: absolute;
    z-index: 1;
    inset: 0;
    margin: auto;
    content: '';
    width: 19px;
    height: 19px;
    background: url(../img/common/ico/h_search.svg) no-repeat center / contain;
}
/* 言語切替 */
header .g_nav .g_nav_items > .g_nav_language{display: none;}

/* nav pc */
header .nav_pc{
    display: flex;
    justify-content: flex-end;
    -moz-column-gap: 4%;
         column-gap: 4%;
    margin: 13px 0 0;
}
header .nav_pc > li{
    position: relative;
    z-index: 0;
}
header .nav_pc > li a{
    --padding: .625em;
    position: relative;
    z-index: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 700;
    line-height: 1.3;
    width: 100%;
    padding: 10px var(--padding) 23px;
}
header .nav_pc > li[class^="trigger_"] a{padding-right: calc(var(--padding) + .85em);}
header .nav_pc > li[class^="trigger_"] a::after{
    position: absolute;
    z-index: 0;
    /* inset: .1em calc(var(--padding) * 0.65) 0 auto; */
    inset: -0.6em calc(var(--padding) * 0.65) 0 auto;
    margin: auto;
    content: '';
    width: 0.6875em;
    height: 0.3125em;
    background: url(../img/common/ico/menu_arrow.svg) no-repeat center / contain;
}
header .nav_pc > li.current::before{
    position: absolute;
    z-index: 1;
    inset: auto 0 0;
    margin: auto;
    content: '';
    width: 100%;
    max-width: 100px;
    height: 6px;
    background: var(--accentColor);
    pointer-events: none;
}

/* contact */
header > .contact{
    height: 100%;
    width: var(--w_contact);
    background: var(--accentColor);
    font-weight: 700;
    font-size: 0.875em;
}
header > .contact a{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    row-gap: .8em;
    width: 100%;
    height: 100%;
    padding-top: .75em;
}
header > .contact a::before{
    content: '';
    display: block;
    width: 2.07em;
    height: 1.5em;
    background: currentColor;
    -webkit-mask: url(../img/common/ico/h_contact.svg) no-repeat center / contain;
            mask: url(../img/common/ico/h_contact.svg) no-repeat center / contain;
}
/* ============================================== */
/*              mage menu              */
/* ============================================== */
header .g_nav{
    --gnavGap: min(1.875vw, 30px);
    position: absolute;
    z-index: -1;
    inset: var(--headerHeight) 0 auto;
    margin: auto;
    height: 0;
    overflow: hidden;
    transition: height 0.4s;
    background: #fff;
    color: var(--txtColor);
    -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, .1));
            filter: drop-shadow(0 2px 12px rgba(0, 0, 0, .1));
    transform: translateZ(0);
}
header .g_nav .g_nav_items{
    position: relative;
    z-index: 0;
}
header .g_nav .g_nav_items > div {
    position: absolute;
    z-index: 0;
    inset: 50px -100% auto;
    margin: auto;
    width: calc(95vw - 120px);
    max-width: 1400px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, visibility 0.2s ease;
    padding: 20px 0 100px;
}
header .g_nav .g_nav_items > .is_active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
header .g_nav .g_nav_items > div > .flex{
    justify-content: space-between;
    align-items: flex-start;
}
header .g_nav .gnav_l{padding-right: var(--gnavGap);}
header .g_nav .cat_name{margin: 0 0 35px;}
header .g_nav .cat_name span{
    display: block;
    color: var(--mainColor);
    line-height: 1.2;
}
header .g_nav .cat_name span:nth-of-type(1){
    font-family: var(--ff_plusJakartaSans);
    font-weight: 700;
    font-size: 40px;
    letter-spacing: 0.02em;
    margin: 0 0 0.1em;
}
header .g_nav .cat_name span:nth-of-type(2){
    font-weight: 500;
    font-size: 31px;
}
header .g_nav .cat_top a{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    -moz-column-gap: .5em;
         column-gap: .5em;
    font-size: 24px;
    line-height: 1.2;
}
header .g_nav .cat_top a::after{
    content: '';
    display: block;
    width: 22px;
    height: 8px;
    background: var(--mainColor);
    -webkit-mask: url(../img/common/ico/gnav_arrow.svg) no-repeat center / contain;
            mask: url(../img/common/ico/gnav_arrow.svg) no-repeat center / contain;
    transform: translateY(3px);
}
header .g_nav ul{
    position: relative;
    z-index: 0;
    display: flex;
    flex-wrap: wrap;
    width: 950px;
    gap: 25px var(--gnavGap);
    padding-left: calc(var(--gnavGap) + min(5%, 100px));
}
header .g_nav ul::before{
    position: absolute;
    z-index: 0;
    inset: 0 auto auto 0;
    content: '';
    width: 1px;
    height: 100%;
    min-height: 190px;
    background: var(--borderPcMenu);
}
header .g_nav ul li{
    width: calc((100% - (var(--gnavGap) * 2)) / 3);
    min-width: -webkit-max-content;
    min-width: -moz-max-content;
    min-width: max-content;
}
header .g_nav ul li a{
    position: relative;
    z-index: 0;
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 20px;
    font-size: 18px;
    line-height: 1.4;
    padding: 0 0 0 1em;
}
header .g_nav .cat_top a,
header .g_nav ul li a{
    text-decoration: underline;
    text-underline-offset: 2px;
    -webkit-text-decoration-color: transparent;
            text-decoration-color: transparent;
}
header .g_nav .cat_top a:hover,
header .g_nav ul li a:hover{
    opacity: 1;
    color: var(--mainColor);
}
header .g_nav ul li a::before{
    position: absolute;
    z-index: 0;
    inset: .45em auto auto 0;
    content: '';
    width: 10px;
    height: 10px;
    border-top: 1px solid var(--mainColor);
    border-right: 1px solid var(--mainColor);
    transform: rotate(45deg);
}

/* ============================================== */
/*              ハンバーガーメニュー              */
/* ============================================== */
.ham {
    position: relative;
    z-index: 10;
    width: 50px;
    height: 50px;
    transition: .3s;
    cursor: pointer;
    display: none;
}
.ham span,
.ham::before,
.ham::after {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0;
    display: block;
    width: 30px;
    height: 1px;
    border-radius: 1px;
    background: #fff;
    transition: .5s;
}

.ham::before,
.ham::after{content: '';}
.ham::before{top: calc(50% - 8px);}
.ham::after{top: calc(50% + 8px);}

.ham.open span{opacity: 0;}
.ham.open::before {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
}
.ham.open::after {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
}
/* ナビゲーション */
.sp_nav{display: none;}

/* ============================================== */
/*                    フッター                    */
/* ============================================== */
/* page top */
.pagetop{
    position: fixed;
    z-index: 5;
    inset: auto 50px 30px auto;
    cursor: pointer;
    transition: opacity .3s;
    opacity: 0;
    visibility: hidden;
    transition: .4s;
    transition-property: opacity, visibility;
    /*  */
    background: var(--mainColor);
    width: 40px;
    height: 40px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #fff;
    font-size: 0;
}
.pagetop::before{
    position: absolute;
    z-index: 0;
    inset: 4px 0 0 0;
    margin: auto;
    content: '';
    width: .5rem;
    height: .5rem;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(-45deg) ;
}
.pagetop.is_visible{
    opacity: 1;
    visibility: visible;
}
@media screen and (hover: hover) {
    .pagetop:hover{opacity: 0.6;}
}

/* footer */
footer{
    background: var(--bgFooter);
    color: #fff;
}
footer .f_top{padding: 90px 0 120px;}
footer .f_top .flex{
    justify-content: space-between;
    align-items: flex-start;
    -moz-column-gap: 10%;
         column-gap: 10%;
}
footer .logo{margin: 1em auto 5px;}
footer .logo a{display: block;}
footer .logo a img{
    max-width: 133px;
    margin: 0 auto;
}
footer .c_name{
    font-weight: 500;
    font-size: 20px;
    letter-spacing: 0.05em;
    margin: 0 auto 18px;
    line-height: 1.6;
    letter-spacing: 0.1em;
    text-align: center;
}
footer address{
    text-align: center;
    font-size: 15px;
}
footer address p{
    line-height: 1.6;
    letter-spacing: 0.1em;
}

/* common menu */
footer .common_menu{
    display: flex;
    -moz-column-gap: 6%;
         column-gap: 6%;
    justify-content: flex-end;
    font-size: 15px;
    width: 60%;
    max-width: 730px;
}
footer .common_menu > li{
    position: relative;
    z-index: 0;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}
footer .common_menu li a{
    text-decoration: underline;
    text-underline-offset: 2px;
    -webkit-text-decoration-color: transparent;
            text-decoration-color: transparent;
}
footer .common_menu > li.li_last{order: 2;}
footer .common_menu > li.li_last p:not(:last-of-type){margin-bottom: 1.5em;}
footer .common_menu > li.dir_col{display: contents;}
footer .common_menu > li.dir_col > ul >li:not(:last-of-type){margin-bottom: 2em;}
footer .common_menu > li p a{
    position: relative;
    z-index: 0;
    font-weight: 700;
}
footer .common_menu > li a{
    display: inline-block;
    font-weight: 300;
    transform: translateZ(0);
}
footer .f_sub_menu{
    display: none;
    justify-content: center;
    align-items: center;
    font-size: 10px;
    -moz-column-gap: 2em;
         column-gap: 2em;
    margin: 30px auto 26px;
}
footer .f_copy{
    background: var(--mainColor);
    text-align: center;
    font-family: var(--ff_plusJakartaSans);
    font-size: 12px;
    letter-spacing: 0.06em;
    line-height: 1.2;
    padding: 28px 5%;
}
footer .common_menu li a:hover{
    opacity: 1;
    -webkit-text-decoration-color: currentColor;
            text-decoration-color: currentColor;
}
/* footer - home */
body:has(main.home) footer{
    position: relative;
    z-index: 0;
    background: transparent;
}
/* -----------------------------------------------------------
検索結果
----------------------------------------------------------- */
.page_search .search_section h2{margin-bottom: 40px;}
.page_search .search_section p{
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.page_search .search_section p a{word-break: break-all;}

/* -----------------------------------------------------------
common_parts
----------------------------------------------------------- */
/* contents_wrapper */
.contents_wrapper{padding-block: 80px 160px;}
/* kv_sub */
.kv_sub{
    border-bottom: 1px solid var(--borderMain);
    background: #fff;
}
.kv_sub .bg_area{
    position: relative;
    z-index: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    min-height: 330px;
    padding-block: 2em ;
}
.kv_sub .ttl_cont .en{
    position: relative;
    z-index: 0;
    color: var(--mainColor);
    font-family: var(--ff_plusJakartaSans);
    font-weight: 800;
    font-size: 24px;
    line-height: 1.4;
    padding: 0 0 0 0.9em;
    margin: 0 0 14px;
}
.kv_sub .ttl_cont .en::before{
    position: absolute;
    z-index: 0;
    inset: .45em auto auto 0;
    content: '';
    width: 0.625em;
    height: 0.55em;
    background: currentColor;
    -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
            clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}
.kv_sub .ttl_cont .ja{
    font-weight: 700;
    font-size: 54px;
    line-height: 1.15;
}
/* kv_sub - portal */
.kv_sub > picture{
    position: relative;
    z-index: 0;
    display: block;
    width: 100%;
    height: 250px;
    overflow: hidden;
}
.kv_sub > picture img{
    position: relative;
    z-index: 0;
    width: calc(100% + 1px);
    height: calc(100% + 1px);
    -o-object-fit: cover;
       object-fit: cover;
}
.kv_sub > picture::before{
    position: absolute;
    z-index: 1;
    inset: 0;
    margin: auto;
    content: '';
    width: 100%;
    height: 100%;
    background: url(../img/common/kv_overlay.png) no-repeat center / cover;
    mix-blend-mode: soft-light;
    opacity: .5;
    pointer-events: none;
}
main:not(.page_product) .kv_sub:has(picture) .bg_area{min-height: 300px;}
main:not(.page_product) .kv_sub:has(picture) .ttl_cont .en{
    padding: 0;
    font-size: 80px;
    line-height: 1.2;
}
main:not(.page_product) .kv_sub:has(picture) .ttl_cont .en::before{display: none;}
main:not(.page_product) .kv_sub:has(picture) .ttl_cont .ja{
    position: relative;
    z-index: 0;
    color: var(--mainColor);
    font-size: 28px;
    padding: 0 0 0 1.1em;
    line-height: 1.3;
}
main:not(.page_product) .kv_sub:has(picture) .ttl_cont .ja::before{
    position: absolute;
    z-index: 0;
    inset: .45em auto auto 4px;
    content: '';
    width: 21px;
    height: 15px;
    background: var(--accentColor);
    -webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
            clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

/* breadcrumb */
.kv_sub .breadcrumb{
    position: absolute;
    z-index: 0;
    inset: auto 50px .5em auto;
}
.kv_sub .breadcrumb > span{
    position: relative;
    z-index: 0;
    display: inline-block;
    color: var(--grayMain);
    font-weight: 500;
    font-size: 13px;
    padding-right: 1.2em;
    margin-right: 1.2em;
}
.kv_sub .breadcrumb > span::before{
    position: absolute;
    z-index: 0;
    inset: 0 -.15em 0 auto;
    margin: auto;
    content: '';
    width: 5px;
    height: 6px;
    background: var(--mainColor);
    -webkit-clip-path: polygon(0 0, 0% 100%, 100% 50%);
            clip-path: polygon(0 0, 0% 100%, 100% 50%);
}
.kv_sub .breadcrumb > span a{
    text-decoration: underline;
    text-underline-offset: 2px;
}
.kv_sub .breadcrumb > span:nth-of-type(1) a::before{
    content: '';
    display: inline-block;
    width: 9px;
    height: 9px;
    background: url(../img/common/ico/breadcrumb_top.svg) no-repeat center / contain;
    margin: 0 0.1em 0 0;
}
/* .kv_sub .breadcrumb > span:nth-of-type(1) a::after{
    position: absolute;
    z-index: 0;
    inset: auto auto 1px -2px;
    content: '';
    width: 1em;
    height: 1px;
    background: var(--grayMain);
} */
.kv_sub .breadcrumb > span:last-of-type{
    margin: 0;
    padding: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: min(420px, 30vw);
    margin-bottom: -0.6em;
}
.kv_sub .breadcrumb > span:last-of-type::before{display: none;}

/* ボタン */
.btn{
    max-width: 100%;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    transform: skewX(calc(var(--skewDeg) * -1));
    border: 1px solid var(--themeColor);
    background: #fff;
    transition: 0.3s;
}
.btn.f_italic{
    font-family: var(--ff_plusJakartaSans);
    font-style: italic;
}
.btn a,
.btn span{
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 225px;
    min-height: 35px;
    padding: 0.1em .8em 0.15em;
    color: var(--themeColor);
    transform: skewX(var(--skewDeg));
}
.btn:has(a:hover){background: var(--themeColor);}
.btn a:hover{
    opacity: 1;
    color: #fff !important;
}
/* news list */
.news_list > li{
    border-bottom: 1px solid var(--borderMain);
    transition: border-color .3s;
}
.news_list > li a{
    --w_cat: 115px;
    /* --w_date: 95px; */
    --w_date: 90px;
    --gap: 1em;
    position: relative;
    z-index: 0;
    display: flex;
    align-items: center;
    -moz-column-gap: var(--gap);
         column-gap: var(--gap);
    padding: 22px 40px 22px 12px;
    font-size: 15px;
    min-height: 74px;
}
.news_list > li a::before{
    position: absolute;
    z-index: 0;
    inset: 0 20px 0 auto;
    margin: auto;
    content: '';
    width: 9px;
    height: 9px;
    border-top: 2px solid var(--mainColor);
    border-right: 2px solid var(--mainColor);
    transform: rotate(45deg);
    transition: border-color 0.3s;
}
.news_list > li a .n_cat{width: var(--w_cat);}
.news_list > li a .n_cat li{
    text-align: center;
    transform: skewX(calc(var(--skewDeg) * -1));
    background: #fff;
}
.news_list > li a .n_cat li:not(:last-of-type){margin: 0 0 .5em;}
.news_list > li a .n_cat li span{
    display: block;
    transform: skewX(var(--skewDeg));
    font-size: 13px;
    line-height: 1.3;
    color: var(--mainColor);
    letter-spacing: 0.05em;
    min-height: 30px;
    padding: 0.5em 1em;
}
.news_list > li a .n_date{
    width: var(--w_date);
    /* font-family: var(--ff_plusJakartaSans); */
    letter-spacing: 0.1em;
}
.news_list > li a .n_txt{
    width: calc(100% - var(--w_cat) - var(--w_date) - (var(--gap) * 2));
    line-height: 1.4;
    letter-spacing: 0.1em;
    text-decoration: underline;
    text-underline-offset: 2px;
    -webkit-text-decoration-color: transparent;
            text-decoration-color: transparent;
    transition: -webkit-text-decoration-color .3s;
    transition: text-decoration-color .3s;
    transition: text-decoration-color .3s, -webkit-text-decoration-color .3s;
    /* 省略 */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
            line-clamp: 2;
}
/* hover */
.news_list > li a:hover{
    opacity: 1;
    background: rgba(255, 255, 255, .2);
}
.news_list > li a:hover .n_txt{-webkit-text-decoration-color: currentColor;text-decoration-color: currentColor;}

/* -----------------------------------------------------------
home
----------------------------------------------------------- */
/* KV ============ */
.home .kv_home{
    position: relative;
    z-index: 0;
    /* aspect-ratio: 1600 / 790; */
    height: calc(100svh - var(--headerHeight));
    min-height: 500px;
}
.home .kv_home .flex{
    height: 100%;
    align-items: flex-end;
    padding: 0 5% min(2.8125vw, 45px);
    max-width: initial !important;
}
.home .kv_home .ttl_cont{height: -webkit-fit-content;height: -moz-fit-content;height: fit-content;}
.is_loaded .home .kv_home .ttl_cont{
    visibility: visible;
    opacity: 1;
    transform: translate(0, 0);
}
.home .kv_home .ttl_cont .name{
    font-family: var(--ff_plusJakartaSans);
    font-weight: 800;
    font-size: min(10.625vw, 240px);
    line-height: 1.05;
    color: var(--mainColor);
    margin: 0 0 0.2em;
}
.home .kv_home .ttl_cont .desc{
    color: var(--mainColor);
    font-size: min(1.625vw, 32px);
    font-weight: 700;
    letter-spacing: 0.02em;
}
/* fixed bg ============ */
.home + .fixed_bg{
    position: fixed;
    z-index: -1;
    inset: 0 0 auto;
    margin: auto;
    width: 100vw;
    height: 100lvh;
}
.home + .fixed_bg::before{
    position: absolute;
    z-index: 1;
    inset: 0 auto 0 0;
    margin: auto;
    content: '';
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, rgba(255, 255, 255, .9) -15%, rgba(255, 255, 255, 0) 55%);
    transition: opacity .5s;
}
.home + .fixed_bg .overlay{
    position: absolute;
    z-index: 0;
    inset: 0;
    margin: auto;
    background-color: #fff;
    opacity: 0.85;
    transition: background-color .5s;
}
.home + .fixed_bg.is_news_area .overlay{
    background-color: var(--mainColor);
    opacity: 0.5 !important;
}
.home + .fixed_bg.is_news_area::before{opacity: 0;}
.home + .fixed_bg video{
    position: absolute;
    z-index: -1;
    inset: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}

/* section common ============ */
.home article > section{padding: 140px 0;}
.home section.txt_white *{
    --themeColor: #fff;
    color: #fff;
}

/* bg white */
.home .bg_white{background: #fff;}
.home .bg_white > section{padding: 120px 0;}
.home .bg_white > section:not(:last-of-type){border-bottom: 1px solid var(--borderMain);}
.home .bg_white .flex,
.home .sec_blur .flex{
    --w: 370px;
    --gap: 8%;
    position: relative;
    z-index: 0;
    justify-content: space-between;
    align-items: center;
    -moz-column-gap: var(--gap);
         column-gap: var(--gap);
}
.home .bg_white .flex > div,
.home .sec_blur .flex > div{
    width: var(--w);
}
.home .bg_white .flex > div .btn,
.home .sec_blur .flex > div .btn{
    margin-top: 45px;
}
.home .bg_white .flex > *:not(p):nth-child(2),
.home .sec_blur .flex > *:not(p):nth-child(2){
    width: calc(100% - var(--w) - var(--gap));
}
.home .bg_white > section:has(.flex > figure) .flex{min-height: 430px;}
.home .bg_white .flex > figure{
    position: absolute;
    z-index: 0;
    inset: 0 auto auto calc(var(--w) + var(--gap) * 1.5);
    margin: auto;
    width: calc(100% - var(--w) - var(--gap) + 47vw - 530px ) !important;
    max-width: initial;
    height: 430px;
}
.home .bg_white .flex > figure img{
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}

/* btn */
.home section .btn{
    background: transparent;
    border-color: currentColor;
    color: var(--themeColor);
}
.home section .btn a,
.home section .btn span,
.portal_b section .btn a,
.smf-action .smf-button-control__control{
    position: relative;
    z-index: 0;
    min-height: 58px;
    padding-right: 1.2em;
}
.home section .btn a::before,
.home section .btn span::before,
.portal_b section .btn a::before,
.smf-action .smf-button-control__control::before{
    position: absolute;
    z-index: 0;
    inset: 0 18px 0 auto;
    margin: auto;
    content: '';
    width: 9px;
    height: 9px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
}
.home section .btn:has(a:hover),
.portal_b section .btn:has(a:hover),
.smf-action .smf-button-control:has(.smf-button-control__control:hover){
    --themeColor: #fff;
    background: var(--mainColor);
}
/* ttl cont */
.home section .ttl_cont{
    transition: color 0.5s;
    margin: 0 0 20px;
    line-height: 1.2;
    color: var(--themeColor);
}
.home section .ttl_cont p{
    font-family: var(--ff_plusJakartaSans);
    font-weight: 700;
    font-size: 45px;
    letter-spacing: 0.02em;
    margin: 0 0 0.13em;
}
.home section .ttl_cont h2{
    font-weight: 700;
    font-size: 28px;
    letter-spacing: 0.05em;
}
.home section .ttl_cont + .desc{
    font-size: 18px;
    line-height: 2;
    letter-spacing: 0.05em;
}

/* sec_lead ============ */
.home .sec_lead{padding: 200px 0 140px;}
.home .sec_lead .flex{
    --w: min(45%, 400px);
    --gap: 5.5%;
    -moz-column-gap: var(--gap);
         column-gap: var(--gap);
    padding-right: 25px;
}
.home .sec_lead .flex > div{width: var(--w);}
.home .sec_lead .flex > figure{width: calc(100% - var(--gap) - var(--w));}
.home .sec_lead h2{
    color: var(--mainColor);
    font-size: 26px;
    font-weight: 700;
    line-height: 1.6;
    letter-spacing: 0.02em;
    margin: 0 0 1em;
}
.home .sec_lead h2 + p{
    font-weight: 500;
    line-height: 2.5;
    letter-spacing: 0.1em;
}
.home .sec_lead h2 + p span{
    display: inline-block;
    color: var(--mainColor);
    margin: 0 0.3em;
}

/* sec_news ============ */
.home .sec_news{padding-bottom: 180px;}
.home .sec_news .flex{
    --ttlW: 230px;
    --gap: 5%;
    -moz-column-gap: var(--gap);
         column-gap: var(--gap);
}
.home .sec_news .flex > div{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: var(--ttlW);
}
@media screen and (min-width:769px) {
    .home .sec_news .flex .ttl_cont{margin-bottom: 50px;}
}
.home .sec_news .btn a{min-width: 200px;}
.home .sec_news .flex > .news_list{width: calc(100% - var(--ttlW) - var(--gap));}
.home .sec_news .banner_wrapper{margin: 130px auto 0;}
.home .sec_news .banner_wrapper a{
    position: relative;
    z-index: 0;
    display: block;
}
.home .sec_news .banner_wrapper p{
    position: absolute;
    z-index: 1;
    inset: max(-18px, -1.48vw) auto auto max(-40px, -3.3vw);
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    width: min(11.15vw, 135px);
    aspect-ratio: 1;
    border-radius: 50%;
    color: #fff;
    font-size: min(1.9vw, 23px);
    font-weight: 700;
    line-height: 1.43;
    letter-spacing: 0.025em;
    background: var(--accentColor);
}

/* white ver */
body:has(.fixed_bg.is_news_area) .home .sec_news{
    --themeColor: #fff;
    color: #fff;
}
body:has(.fixed_bg.is_news_area) .home .sec_news .news_list > li{border-color: rgba(255, 255, 255, .3);}
body:has(.fixed_bg.is_news_area) .home .sec_news .news_list > li a::before{border-color: #fff;}
body:has(.fixed_bg.is_news_area) .home .sec_news .flex > div .btn:has(a:hover){background: #fff;}
body:has(.fixed_bg.is_news_area) .home .sec_news .flex > div .btn a:hover{color: var(--mainColor)  !important;}

/* sec_blur common ============ */
.home .sec_blur{
    position: relative;
    padding: 0;
    background: var(--mainColor);
}
.home .sec_blur .flex > div .btn:has(a:hover){
    background: #fff;
    border-color: #fff;
}
.home .sec_blur .flex > div .btn a:hover{color: var(--mainColor) !important;}
.home .sec_blur > figure{
    position: -webkit-sticky;
    position: sticky;
    z-index: 0;
    top: 0;
    display: block;
    width: 100vw;
    height: 100lvh;
    overflow: clip;
}
.home .sec_blur > figure .overlay{
    position: absolute;
    z-index: 1;
    inset: 0;
    margin: auto;
    content: '';
    width: 100%;
    height: 100%;
    background: var(--mainColor);
    opacity: 0;
    visibility: hidden;
    will-change: opacity;
    display: none;
}
.is_loaded .home .sec_blur > figure .overlay{display: block;}

.home .sec_blur > figure img{
    position: relative;
    z-index: 0;
    width: calc(100% + 1px);
    height: calc(100% + 1px);
    transform: scale(1.05);
    -o-object-fit: cover;
       object-fit: cover;
    will-change: filter;
    transition: -webkit-filter 0.1s linear;
    transition: filter 0.1s linear;
    transition: filter 0.1s linear, -webkit-filter 0.1s linear;
}
.home .sec_blur .flex{
    padding-block: 10vh 35vh;
    justify-content: space-between;
    align-items: center;
}
.home .sec_blur .flex > figure{
    overflow: clip;
    aspect-ratio: 700 / 590;
}
.home .sec_blur .flex > figure img{
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain;
}

/* sec product ============ */
.home .sec_product .flex{
    justify-content: space-between;
    align-items: flex-start;
    margin: 0 0 30px;
}

/* slider */
.home .sec_product .product_slider{
    position: relative;
    z-index: 0;
    padding: 0 0 min(12.4vw, 150px);
}
.home .sec_product .product_slider .slick-list{
    width: calc(100% + min(500px, 25vw));
    width: calc(100% + 25vw);
    transform: translateX(-6px);
}
.product_slider .slick-dummy {
    pointer-events: none;
    visibility: hidden;
}
.home .sec_product .product_slider::before{
    position: absolute;
    z-index: -1;
    inset: auto -100% 0;
    margin: auto;
    content: '';
    width: 100vw;
    height: min(19.4vw, 235px);
    background: var(--mainColor);
}
/* .home .sec_product .product_slider .slick-list{overflow: initial;} */
.home .sec_product .product_slider .slick-track{
    display: flex;
    -moz-column-gap: 6px;
         column-gap: 6px;
}
.home .sec_product .product_slider li a{
    position: relative;
    z-index: 0;
    display: block;
}
.home .sec_product .product_slider li a::before{
    position: absolute;
    z-index: 0;
    inset: auto 0 0;
    margin: auto;
    content: '';
    width: 100%;
    height: 30%;
    background: linear-gradient(to top, #31373d, transparent);
    mix-blend-mode: multiply;
}
.home .sec_product .product_slider li a figure{
    width: 100%;
    height: 100%;
    aspect-ratio: 1;
    overflow: hidden;
}
.home .sec_product .product_slider li a figure img{
    position: relative;
    z-index: -1;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    transition: transform .3s;
}
.home .sec_product .product_slider li a p{
    position: absolute;
    z-index: 1;
    inset: auto 0 0;
    margin: auto;
    width: 100%;
    padding: 1em 1em 1em 2.5em;
    font-size: min(1.48vw, 18px);
    color: #fff;
    font-weight: 500;
    line-height: 1.6;
}
.home .sec_product .product_slider li a p::before{
    position: absolute;
    z-index: 0;
    inset: 1.5em auto auto 1em;
    margin: auto;
    content: '';
    width: min(1.07vw, 13px);
    height: min(1.07vw, 13px);
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
}
/* slick dots */
.home .sec_product .product_slider .slick-dots {
    --dot-x: 0%;
    --dot-width: 25%;
    position: absolute;
    bottom: min(6.36vw, 77px);
    display: flex;
    width: calc(100% - min(15.7vw, 190px));
    height: 4px;
    background: rgba(255,255,255,.3);
    margin: 0;
    padding: 0;
}
.home .sec_product .product_slider .slick-dots::after {
    position: absolute;
    z-index: 1;
    content: '';
    inset: 0 auto auto var(--dot-x);
    width: var(--dot-width);
    height: 100%;
    background: #fff;
    transition: left .3s;
}

.home .sec_product .product_slider .slick-dots li{
    width: 100%;
    height: 100%;
    flex: 1;
    margin: 0;
}
.home .sec_product .product_slider .slick-dots li button::before{content: none;}

/* slick arrow */
.home .sec_product .product_slider .slick-arrow{
    --w: min(4.54vw, 55px);
    z-index: 2;
    inset: auto 0 min(4.13vw, 50px) auto;
    width: var(--w);
    height: min(4.95vw, 60px);
    border: 1px solid #fff;
    transform: skewX(calc(var(--skewDeg) * -1));
    transition: 0.3s;
}
.home .sec_product .product_slider .slick-arrow::before{
    position: absolute;
    z-index: 0;
    inset: 0;
    margin: auto;
    font-size: 0;
    content: '';
    display: block;
    width: min(0.99vw, 12px);
    height: min(0.99vw, 12px);
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: skewX(var(--skewDeg)) translateX(max(-0.33vw, -4px)) rotate(45deg);
    transition: 0.3s;
    opacity: 1;
}
.home .sec_product .product_slider .slick-prev{translate: calc(var(--w) * -1 - min(1.24vw, 15px));}
.home .sec_product .product_slider .slick-prev::before{transform: skewX(var(--skewDeg)) translateX(0) rotate(-135deg);}
@media screen and (hover: hover){
    .home .sec_product .product_slider .slick-arrow:hover{background: #fff;}
    .home .sec_product .product_slider .slick-arrow:hover::before{border-color: var(--mainColor);}
}
/* hover */
.home .sec_product .product_slider li a:hover{opacity: 1;}
.home .sec_product .product_slider li a:hover figure img{transform: translateZ(0) scale(1.1);}
/* banner */
.home .sec_product .product_banner{margin: 150px auto 0;}

/* sec_group ============ */
.home .sec_group ul{
    --colGap: 8px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-end;
    gap: var(--colGap);
}
.home .sec_group ul li{
    width: calc(50% - (var(--colGap) / 2));
    -webkit-filter: drop-shadow(0 0 3px rgba(0, 0, 0, .14));
            filter: drop-shadow(0 0 3px rgba(0, 0, 0, .14));
}
.home .sec_group ul li a{
    display: block;
    transform: translateZ(0);
}
.home .sec_group ul li.disabled a{pointer-events: none;}
/* sec_sustainability ============ */
.home .sec_sustainability{
    --themeColor: var(--sustainColor);
}
.home .sec_sustainability .btn:has(a:hover){background: var(--sustainColor);}
/* sec contact ============ */
.home .sec_contact a{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 360px;
    text-align: center;
    background: url(../img/page/home/sec_contact.jpg) no-repeat center / cover;
    padding: 30px;
}
.home .sec_contact a .ttl_cont p::before{
    content: '';
    display: inline-block;
    width: 40px;
    height: 29px;
    background: var(--mainColor);
    -webkit-mask: url(../img/common/ico/h_contact.svg) no-repeat center / contain;
            mask: url(../img/common/ico/h_contact.svg) no-repeat center / contain;
    margin: 0 14px 2px 0;
}
.home .sec_contact a .btn{
    background: var(--mainColor);
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 230px;
    min-height: 60px;
    margin: 20px auto 0;
}
.home .sec_contact a .btn span{color: #fff;}

/* -----------------------------------------------------------
portal
----------------------------------------------------------- */
.page_portal .lead{
    font-size: 1.125em;
    font-weight: 500;
    margin: 0 0 1.75em;
}
.page_portal .lead.lead_l{font-size: 1.5em;}
/* portal A ============ */
.portal_a .sub_list{
    --gap: 4.5%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 40px var(--gap);
}
.portal_a .sub_list li{width: calc((100% - var(--gap)) / 2);}
.portal_a .sub_list li a{display: block;}
.portal_a .sub_list li a figure{
    position: relative;
    z-index: 0;
    aspect-ratio: 526 / 295;
    overflow: hidden;
    margin: 0 0 18px;
}
.portal_a .sub_list li a figure::before{
    position: absolute;
    z-index: 1;
    inset: auto -1px -1px auto;
    content: '';
    width: 35px;
    height: 35px;
    -webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
            clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}
.portal_a .sub_list li:nth-of-type(odd) a figure::before{background: var(--mainColor);}
.portal_a .sub_list li:nth-of-type(even) a figure::before{background: var(--accentColor);}
.portal_a.page_company .sub_list li a figure::before{background: var(--mainColor) !important;}


.portal_a .sub_list li a figure img{
    width: calc(100% + 1px);
    height: calc(100% + 1px);
    -o-object-fit: cover;
       object-fit: cover;
    transition: transform .3s;
}
.portal_a .sub_list li a .ttl{
    color: var(--mainColor);
    font-weight: 500;
    font-size: 24px;
    line-height: 1.4;
    margin: 0 0 0.4em;
}
.portal_a .sub_list li a .ttl::after{
    content: '';
    display: inline-block;
    width: 9px;
    height: 9px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: translateY(-4px) rotate(45deg);
    margin: 0 0 0 .8em;
}
.portal_a .sub_list li a:hover{opacity: 1;}
.portal_a .sub_list li a:hover figure img{transform: scale(1.1);}
/* portal B ============ */
.portal_b .sub_list section:not(:last-of-type){margin: 0 0 20px;}
.portal_b .sub_list section{
    position: relative;
    z-index: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    min-height: 470px;
    padding: 75px max(50px, 14.375vw);
}
.portal_b .sub_list section::before{
    position: absolute;
    z-index: -1;
    inset: 0 auto 0 0;
    margin: auto;
    content: '';
    width: calc(max(50px, 3.125vw) + 75%);
    height: 100%;
    background: linear-gradient(to right, #fbfcff 0%, #fbfcff 55%, transparent 100%);
}
.portal_b .sub_list section picture{
    position: absolute;
    z-index: -2;
    inset: 0 0 0 auto;
    margin: auto;
    display: block;
    width: 100%;
    height: 100%;
}
.portal_b .sub_list section picture img{
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
.portal_b .sub_list section > div{
    width: 47%;
}
.portal_b .sub_list section .ttl{
    color: var(--mainColor);
    font-weight: 700;
    line-height: 1.4;
    margin: 0 0 1.4em;
}
.portal_b .sub_list section .ttl p{margin: 0 0 0.5em;}
.portal_b .sub_list section .ttl h2{font-size: 22px;}
.portal_b .sub_list section .lead{
    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;
    margin: 0 0 1.1em;
}
.portal_b .sub_list section .txt{
    font-size: 15px;
    line-height: 2;
    margin: 0 0 2.25em;
}
.portal_b .sub_list section .btn{background: transparent;}

/* 社長署名（トップメッセージ、サステナビリティ） */
article .president{
    margin: 3.5em 0 0;
}
article .president > div{
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    column-gap: 1em;
}
article .president p{
    line-height: 1.1;
    margin: 0;
}
article .president .position{font-size: 1.2em;}
article .president .name{
    max-width: 130px;
    margin: 0;
}
.page_sustainability .president{column-gap: 1.5em;}
.page_sustainability .president .position{font-size: 1.4em;}
.page_sustainability .president .name{max-width: 150px;}

/* -----------------------------------------------------------
subpage
----------------------------------------------------------- */
/* editor_contents ============ */
.editor_contents{
    --baseMargin: 60px;
}
.editor_contents .mb_0{margin-bottom: 0 !important;}
.editor_contents .mb_5{margin-bottom: 5px !important;}
.editor_contents .mb_10{margin-bottom: 10px !important;}
.editor_contents .mb_15{margin-bottom: 15px !important;}
.editor_contents .mb_20{margin-bottom: 20px !important;}
.editor_contents .mb_25{margin-bottom: 25px !important;}
.editor_contents .mb_30{margin-bottom: 30px !important;}
.editor_contents .mb_35{margin-bottom: 35px !important;}
.editor_contents .mb_40{margin-bottom: 40px !important;}
.editor_contents .mb_45{margin-bottom: 45px !important;}
.editor_contents .mb_50{margin-bottom: 50px !important;}
/*  */
.editor_contents .inner > *:first-child{margin-top: 0 !important;}
.editor_contents .inner > *:last-child{margin-bottom: 0 !important;}
/* 見出し */
.editor_contents h2,
.editor_contents h3,
.editor_contents h4,
.editor_contents h5,
.editor_contents h6{
    line-height: 1.4;
}
/* h2 */
.editor_contents h2{
    position: relative;
    z-index: 0;
    color: var(--themeColor);
    font-weight: 700;
    font-size: 32px;
    padding: 35px 0 0;
    margin: 95px 0 75px;
}
.editor_contents h2::before,
.editor_contents h2::after{
    position: absolute;
    inset: 0 auto auto 0;
    content: '';
    height: 5px;
}
.editor_contents h2::before{
    z-index: -1;
    width: 60px;
    background: var(--borderMain);
}
.editor_contents h2::after{
    z-index: 0;
    width: 30px;
    background: var(--themeColor);
}
/* h2 - no deco */
.editor_contents h2.no_deco{
    padding: 0;
    margin-bottom: 55px;
}
.editor_contents h2.no_deco::before,
.editor_contents h2.no_deco::after{display: none;}

/* h3 */
.editor_contents h3,
.editor_contents .h3_common{
    position: relative;
    z-index: 0;
    font-weight: 500;
    font-size: 24px;
    padding: 0 0 0 0.875em;
    margin: 95px 0 35px;
}
.editor_contents h3::before,
.editor_contents .h3_common::before{
    position: absolute;
    z-index: 0;
    inset: 2px auto 0 0;
    margin: auto;
    content: '';
    width: 3px;
    height: calc(100% + 3px);
    background: var(--themeColor);
}
.editor_contents .h3_common::after{display: none;}
/* h3 - style group */
.editor_contents h3.style_group{
    padding: 0;
    line-height: 2;
}
.editor_contents h3.style_group::before{display: none;}

/* h4 */
.editor_contents h4{
    font-weight: 500;
    font-size: 20px;
    color: var(--themeColor);
    border-top: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    padding: 0.5em 0;
    margin: 55px 0 25px;
}
/* h5 */
.editor_contents h5{
    font-weight: 500;
    font-size: 18px;
    margin: 55px 0 25px;
}
/* テキスト */
.editor_contents p{margin: 0 0 1.5em;}
.editor_contents p.lead_philosophy{
    font-size: 20px;
    font-weight: 500;
    line-height: 2.4;
    letter-spacing: 0.1em;
    text-align: center;
}
.editor_contents p.lead_philosophy span{
    display: inline-block;
    color: var(--mainColor);
    margin: 0 0.4em;
}
/* テキストリンク */
.editor_contents p:not(.btn) a{
    color: var(--textLink);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.editor_contents p:not(.btn) a[target="_blank"]::after,
.editor_contents p:not(.btn) a[href*=".pdf"]::after,
.editor_contents p:not(.btn) a[href*=".doc"]::after,
.editor_contents p:not(.btn) a[href*=".xl"]::after{
    content: '';
    display: inline-block;
    margin: 0 0 0 0.3em;
    background: no-repeat center / contain;
    transform: translateY(.2em);
}
.editor_contents p:not(.btn) a[target="_blank"]::after{
    width: 1.15em;
    height: 1em;
}
.editor_contents p:not(.btn) a[href*=".pdf"]::after,
.editor_contents p:not(.btn) a[href*=".doc"]::after,
.editor_contents p:not(.btn) a[href*=".xl"]::after{
    width: 1.25em;
    height: 1.25em;
}
.editor_contents p:not(.btn) a[target="_blank"]::after{background-image: url(../img/common/ico/link_blank.svg);}
.editor_contents p:not(.btn) a[href*=".pdf"]::after{background-image: url(../img/common/ico/link_pdf.svg);}
.editor_contents p:not(.btn) a[href*=".doc"]::after{background-image: url(../img/common/ico/link_word.svg);}
.editor_contents p:not(.btn) a[href*=".xl"]::after{background-image: url(../img/common/ico/link_excel.svg);}
/* ボタンリンク */
.editor_contents .btn a{
    color: var(--themeColor);
    line-height: 1.4;
    padding: 0.3em .8em 0.35em;
}
.editor_contents .btn a[target="_blank"]::after,
.editor_contents .btn a[href*=".pdf"]::after,
.editor_contents .btn a[href*=".doc"]::after,
.editor_contents .btn a[href*=".xl"]::after{
    display: block;
    content: '';
    background: currentColor;
    -webkit-mask: no-repeat center / contain;
            mask: no-repeat center / contain;
    margin: 0 0 0 0.25em;
}
.editor_contents .btn a[target="_blank"]::after{
    -webkit-mask-image: url(../img/common/ico/link_blank.svg);
            mask-image: url(../img/common/ico/link_blank.svg);
    width: 1.15em;
    height: 1em;
}
.editor_contents .btn a[href*=".pdf"]::after,
.editor_contents .btn a[href*=".doc"]::after,
.editor_contents .btn a[href*=".xl"]::after{
    width: 1.25em;
    height: 1.25em;
}
.editor_contents .btn a[href*=".pdf"]::after{-webkit-mask-image: url(../img/common/ico/link_pdf.svg);mask-image: url(../img/common/ico/link_pdf.svg);}
.editor_contents .btn a[href*=".doc"]::after{-webkit-mask-image: url(../img/common/ico/link_word.svg);mask-image: url(../img/common/ico/link_word.svg);}
.editor_contents .btn a[href*=".xl"]::after{-webkit-mask-image: url(../img/common/ico/link_excel.svg);mask-image: url(../img/common/ico/link_excel.svg);}
/* 画像 */
.editor_contents figure.wp-block-image {display: flex;width: fit-content;}
.editor_contents .wp-block-image .aligncenter,
.editor_contents .wp-block-image .alignleft,
.editor_contents .wp-block-image .alignright,
.editor_contents .wp-block-image.aligncenter,
.editor_contents .wp-block-image.alignleft,
.editor_contents .wp-block-image.alignright{width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;}
.editor_contents figure.wp-block-image.aligncenter {display: table;margin-right: auto;margin-left: auto;}
.editor_contents figure.wp-block-image.alignleft {display: table;margin-right: auto;}
.editor_contents figure.wp-block-image.alignright {display: table;margin-left: auto;}
.editor_contents .wp-block-image{margin: var(--baseMargin) 0;}
.editor_contents .wp-block-image figcaption{
    font-size: 0.875em;
    margin: 1.4em auto 0;
}
/* カラム */
.editor_contents .wp-block-columns{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 3%;
    margin: var(--baseMargin) 0;
}
.wp-block-column {
    flex-grow: 1;
    flex-basis: 0;
}
.editor_contents .wp-block-columns .wp-block-column > *:nth-child(1){margin-top: 0 !important;}
.editor_contents .wp-block-columns .wp-block-column > *:nth-last-child(1){margin-bottom: 0 !important;}
.editor_contents .wp-block-columns .wp-block-image{margin: 0;}
/* 枠囲みテキスト */
.editor_contents .wp-block-group{margin: var(--baseMargin) 0 1.5em;}
.editor_contents .bg_main{
    padding: 1.375em 1.875em;
    background: var(--bgEdit);
}
.editor_contents .bg_main > *:first-child{margin-top: 0;}
.editor_contents .bg_main > *:last-child{margin-bottom: 0;}
/* テーブル */
.editor_contents .wp-block-table{margin: var(--baseMargin) 0;}
.editor_contents .wp-block-table:has(.simplebar-horizontal[style="visibility: visible;"]){padding: 0 0 25px;}
.editor_contents .wp-block-table table{
    table-layout: fixed;
    width: 100%;
}
.editor_contents .wp-block-table td{
    padding: .6em 1.25em .65em;
    border: 1px solid #c8c8c8;
}
.editor_contents .simplebar-track.simplebar-horizontal,
.editor_contents .simplebar-scrollbar:before{height: 0;}
.editor_contents .simplebar-track.simplebar-horizontal[style],
.editor_contents .simplebar-scrollbar[style]::before{
    height: 6px;
    border-radius: 0;
}
.editor_contents .simplebar-track.simplebar-horizontal[style]{background: #d7d7d7;}
.simplebar-track.simplebar-vertical,
.simplebar-content:after,
.simplebar-content:before{display: none !important;}
.editor_contents .simplebar-scrollbar:before{
    inset: 0;
    background: #828282;
    opacity: 1 !important;
}
/* テーブル - 縦 */
.editor_contents .wp-block-table.h_tate tr:nth-of-type(1) td{
    background: inherit;
    color: var(--txtColor);
}
/* テーブル - 基本 */
.editor_contents .wp-block-table:not(.table_outline):not(.h_tate) tr:nth-of-type(1) td,
.editor_contents .wp-block-table:not(.table_outline).h_yoko table.table_border tr:nth-of-type(1) th,
.editor_contents .wp-block-table.h_tate tr td:nth-of-type(1){
    background: var(--themeColor) !important;
    color: #fff !important;
}
/* テーブル - サイトポリシー */
.editor_contents .wp-block-table:not(.table_outline).h_yoko table.table_border tr:nth-of-type(1) th{padding: .6em 1.25em .65em;}
.editor_contents .wp-block-table:not(.table_outline):not(.h_tate) .table_border tr:nth-of-type(1) th,
.editor_contents .wp-block-table:not(.table_outline):not(.h_tate) .table_border tr:nth-of-type(1) td{
    background: #fff !important;
    color: var(--txtColor) !important;
    border: 1px solid var(--gray) !important;
}

/* テーブル - 会社概要テーブル*/
.editor_contents .wp-block-table.table_outline tr{
    --w: 200px;
    border-top: 1px solid var(--borderMain);
}
.editor_contents .wp-block-table.table_outline tr:last-of-type{
    border-bottom: 1px solid var(--borderMain);
}
.editor_contents .wp-block-table.table_outline td{
    border: none;
    padding-block: 1.2em;
    min-height: 70px;
}
.editor_contents .wp-block-table.table_outline td:nth-of-type(1){
    color: var(--mainColor);
    text-align: center;
    width: var(--w);
    border-top: 1px solid var(--mainColor);
    border-bottom: 1px solid var(--mainColor);
    padding-inline: 1em;
    vertical-align: top;
}
.editor_contents .wp-block-table.table_outline td:nth-of-type(2){
    /* width: calc(100% - var(--w)); */
    width: auto; /* safari対策 */
    padding-inline: 9% 1em;
}
/* リスト */
.editor_contents ul,
.editor_contents ol{margin: 0 0 1.5em;}
.editor_contents ul li,
.editor_contents ol li{
    position: relative;
    z-index: 0;
    line-height: 1.5;
    padding: 0 0 0 1.15em;
    margin: 0 0 0.4em;
}
.editor_contents ul li::before,
.editor_contents ol li::before{
    position: absolute;
    z-index: 0;
    left: 0;
}
/* リスト - ul */
.editor_contents ul li::before{
    top: .43em;
    content: '';
    width: .75em;
    height: 0.75em;
    border-radius: 50%;
    background: var(--themeColor);
}
/* リスト - ol */
.editor_contents ol{counter-reset: ol_num 0;}
.editor_contents ol li:nth-of-type(n+10){padding-left: 1.7em;}
.editor_contents ol li:nth-of-type(n+100){padding-left: 2.2em;}
.editor_contents ol li::before{
    top: 0;
    counter-increment: ol_num 1;
    content: counter(ol_num) ".";
    color: var(--themeColor);
}
/* リスト - group list*/
.editor_contents .group_list{
    --gap: 5%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 60px var(--gap);
    margin: var(--baseMargin) 0;
}
.editor_contents .group_list li{
    width: calc(50% - var(--gap) / 2);
    padding: 0;
    margin: 0;
}
.editor_contents .group_list li::before{display: none;}
.editor_contents .group_list li > figure{
    width: 100%;
    aspect-ratio: 526 / 350;
    overflow: hidden;
    margin: 0 0 30px;
}
.editor_contents .group_list li > figure img{
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
.editor_contents .group_list li > dl > dt{
    font-weight: 700;
    font-size: min(2.5vw, 32px);
    line-height: 1.4;
    margin: 0 0 15px;
}
.editor_contents .group_list li.r_kogyo > dl > dt{color: var(--c_ryokaKogyo);}
.editor_contents .group_list li.nichiden > dl > dt{color: var(--c_nichiden);}
.editor_contents .group_list li.r_tech > dl > dt{color: var(--c_ryokaTech);}
.editor_contents .group_list li.r_malaysia > dl > dt{color: var(--c_ryokaMalaysia);}
.editor_contents .group_list li dd dl > div{
    --w: 115px;
    --gap: .5em;
    display: flex;
    -moz-column-gap: var(--gap);
         column-gap: var(--gap);
    margin: 0 0 0.25em;
}
.editor_contents .group_list li dd dt{
    width: var(--w);
    text-align: justify;
    -moz-text-align-last: justify;
         text-align-last: justify;
    font-weight: 400;
}
.editor_contents .group_list li dd dd{
    width: calc(100% - var(--gap) - var(--w));
}
.editor_contents .group_list li dd dd a{
    color: var(--textLink);
    text-decoration: underline;
    text-underline-offset: 2px;
}
/* google map */
.editor_contents .google_map{
    position: relative;
    z-index: 0;
    width: 100%;
    padding-top: 56.25%;
    height: 0;
    margin: 0 auto 1.5em;
}
.editor_contents .google_map iframe{
    position: absolute;
    z-index: 0;
    inset: 0 auto auto 0;
    width: 100%;
    height: 100%;
}
/* indent */
.editor_contents .indent-2em{
    text-indent: -2em;
    padding-left: 2em;
}
/* ============
事業案内
============*/
.editor_contents .bg_main .ttl_s{
    font-size: 16px;
    padding: 0;
    border: none;
    margin-bottom: .5em;
    color: var(--mainColor);
    font-weight: 500;
}
/* about_cont ============ */
.page_about .about_cont > section{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 60px 0;
    gap: 6%;
}
.page_about .about_cont > section:not(:last-of-type){border-bottom: 1px solid var(--borderMain);}
.page_about .about_cont > section > figure{width: 46%;}
.page_about .about_cont > section > div{width: 48%;}
.page_about .about_cont > section > div h3{margin: 0 0 15px;}
.page_about .about_cont > section > div .related_company{
    font-size: 1.125em;
    font-weight: 500;
}

.page_about .about_cont > section > div .bg_main ul li{padding: 0 0 0 .75em;}
.page_about .about_cont > section > div .bg_main ul li::before{
    top: 0.65em;
    width: 5px;
    height: 5px;
}
.page_about .about_cont > section > div .bg_main + p{
    text-align: right;
    margin: 18px 0 0;
}
.page_about .about_cont > section > div .bg_main + p a{
    position: relative;
    z-index: 0;
    color: var(--mainColor);
    text-decoration: none;
    padding: 0 1em 0 0;
}
.page_about .about_cont > section > div .bg_main + p a::before{
    position: absolute;
    z-index: 0;
    inset: 0.5em .25em auto auto;
    content: '';
    width: 9px;
    height: 9px;
    border-top: 1px solid var(--mainColor);
    border-right: 1px solid var(--mainColor);
    transform: rotate(45deg);
}
/* 3分でわかるRyoka ============ */
/* KV */
.page_3minutes .kv_sub{overflow: hidden;}
.page_3minutes .kv_sub .bg_area{
    min-height: 500px;
    justify-content: center;
}
.page_3minutes .kv_sub .ttl_cont{
    width: 60%;
    max-width: 570px;
    font-size: 0;
}
/* KV - slide */
.page_3minutes .kv_sub .slide_cont{
    position: absolute;
    z-index: -1;
    inset: -100%;
    margin: auto;
    width: 100vw;
    max-height: 100%;
    pointer-events: none;
    overflow: hidden;
    padding: 15px 0 0;
}
.page_3minutes .kv_sub .slide_cont .cat_list{
    font-size: 0;
    margin: 0 0 25px;
    white-space: nowrap;
    opacity: 0;
    transform: translateY(50px);
    transition-duration: .5s;
}
.page_3minutes .kv_sub .ttl_cont.active + .slide_cont .cat_list{
    opacity: 1;
    transform: translateY(0)
}
.page_3minutes .kv_sub .slide_cont > div:nth-of-type(1){transition-delay: .1s;}
.page_3minutes .kv_sub .slide_cont > div:nth-of-type(2){transition-delay: .2s;}
.page_3minutes .kv_sub .slide_cont > div:nth-of-type(3){transition-delay: .3s;}
.page_3minutes .kv_sub .slide_cont > div:nth-of-type(4){transition-delay: .4s;}
.page_3minutes .kv_sub .slide_cont ul{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    column-gap: 32px;
    font-size: 68px;
    line-height: 120px;
    line-height: 96px;
    width: max-content;
    animation: catScroll 30s linear infinite;
    will-change: transform;
    transform: translateZ(0);
}
@keyframes catScroll{
    0%  {transform: translateX(0);}
    100%{transform: translateX(-50%);}
}
.page_3minutes .kv_sub .slide_cont .cat_list:nth-child(1) ul{animation-duration: 32s;}
.page_3minutes .kv_sub .slide_cont .cat_list:nth-child(2) ul{animation-duration: 38s;}
.page_3minutes .kv_sub .slide_cont .cat_list:nth-child(3) ul{animation-duration: 28s;}
.page_3minutes .kv_sub .slide_cont .cat_list:nth-child(4) ul{animation-duration: 46s;}
.page_3minutes .kv_sub .slide_cont li{
    color: var(--mainColor);
    font-weight: 800;
    opacity: 0.09;
    white-space: nowrap;
}
.page_3minutes .kv_sub .slide_cont li.fz_s{font-size: 0.8em;}
.page_3minutes .kv_sub .slide_cont li.fz_l{font-size: 1.6em;}


/* section共通 */
.page_3minutes .contents_wrapper{padding: 0;}
.page_3minutes section h2{
    color: #fff;
    font-size: 48px;
    font-weight: 900;
    letter-spacing: 0.05em;
    line-height: 1.5;
    text-align: center;
    margin: 0 auto 40px;
}
.page_3minutes .bg_white{background: #fff;}


/* sec_what */
.page_3minutes .sec_what{
    background: var(--mainColor);
    color: #fff;
    padding: 80px 0 60px;
}
.page_3minutes .sec_what h2 + p{
    font-size: 1.25em;
    line-height: 2.5;
    text-align: center;
}
.page_3minutes .sec_what .product_slide{
    position: relative;
    z-index: 0;
    margin: 65px 0 0;
    overflow:hidden;
    width:100%;
}
.page_3minutes .sec_what .product_slide > div{
    display: flex;
    width:max-content;
    column-gap:40px;
    animation: productMarquee 30s linear infinite;
    will-change: transform;
    transform: translateZ(0);
}
@keyframes productMarquee{
    0%  {transform: translateX(0);}
    100%{transform: translateX(-50%);}
}
@keyframes updown{
    0%  {transform:translateY(0);}
    50% {transform:translateY(-25px);}
    100%{transform:translateY(0);}
}

@keyframes downup{
    0%  {transform:translateY(0);}
    50% {transform:translateY(25px);}
    100%{transform:translateY(0);}
}

/* sec_where */
.page_3minutes .sec_where{
    background: var(--mainColor);
    padding: 60px 0 0;
    overflow: hidden;
}

.page_3minutes .sec_where > section{
    --txt_w: 33%;
    --gap: 8.75%;
    position: relative;
    z-index: 0;
    padding: 135px 0;
    isolation: isolate;
    background: var(--mainColor);
}
.page_3minutes .sec_where > section::after{
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    margin: auto;
    content: '';
    width: 50vw;
    height: calc(100% - (135px * 2));
    background: #fff;
}
.page_3minutes .sec_where > section:last-of-type::after{
    top: auto;
    bottom: 0;
    height: calc(100% - (135px * 1));
}
.page_3minutes .sec_where > section:last-of-type{padding-bottom: 0;}
.page_3minutes .sec_where > section > .inner{
    position: relative;
    z-index: 0;
    max-width: 1300px;
    min-height: 500px;
    background: #fff;
    justify-content: space-between;
    padding-block: 80px 70px;
    filter: drop-shadow(3px 3px 9px rgba(0, 0, 0, .1));
}

.page_3minutes .sec_where > section > .inner::before{
    position: absolute;
    z-index: 2;
    content: '';
    width: calc(100% - var(--txt_w) - var(--gap));
    height: auto;
    aspect-ratio: 710 / 520;
}
.page_3minutes .sec_where > section:nth-of-type(1) > .inner::before{
    inset: -13% -5% auto auto;
    background: url(../img/page/business/3minutes/sec02_img01.png) no-repeat center / contain;
}
.page_3minutes .sec_where > section:nth-of-type(2) > .inner::before{
    inset: -24% auto auto -5%;
    background: url(../img/page/business/3minutes/sec02_img02.png) no-repeat center / contain;
}
.page_3minutes .sec_where > section:nth-of-type(3) > .inner::before{
    inset: -15% -5% auto auto;
    background: url(../img/page/business/3minutes/sec02_img03.png) no-repeat center / contain;
}
.page_3minutes .sec_where > section:nth-of-type(4) > .inner::before{
    inset: -15% auto auto -7%;
    background: url(../img/page/business/3minutes/sec02_img04.png) no-repeat center / contain;
}
.page_3minutes .sec_where > section:nth-of-type(5) > .inner::before{
    inset: -8% -5% auto auto;
    background: url(../img/page/business/3minutes/sec02_img05.png) no-repeat center / contain;
}
.page_3minutes .sec_where > section:nth-of-type(6) > .inner::before{
    inset: -24% auto auto -5%;
    background: url(../img/page/business/3minutes/sec02_img06.png) no-repeat center / contain;
}

.page_3minutes .sec_where > section > .inner::after{
    position: absolute;
    z-index: 1;
    inset: 0 0 auto;
    margin: auto;
    content: '';
    width: 100%;
    height: 50px;
    background: #dbedff;
    opacity: 0.7;
    mix-blend-mode: screen;
    pointer-events: none;
}


/* txt cont */
.page_3minutes .sec_where section .txt_cont{width: var(--txt_w);}
.page_3minutes .sec_where section .h3_cont{
    position: relative;
    z-index: 0;
    text-align: center;
    margin: 0 auto 30px;
    isolation: isolate;
}
.page_3minutes .sec_where section .h3_cont p,
.page_3minutes .sec_where section .h3_cont h3 span:nth-of-type(1){
    position: absolute;
    inset: auto 0 calc(100% + 57px);
    line-height: 150px;
    margin: auto;
}
.page_3minutes .sec_where section .h3_cont p{
    z-index: 1;
    font-family: var(--ff_plusJakartaSans);
    font-weight: 800;
    font-size: 200px;
    color: var(--mainColor);
    color: #144ca9;
    /* color: #0043aa; */
    white-space: nowrap;
    /* opacity: 0.45; */
    opacity: 1;
    mix-blend-mode: multiply;
    pointer-events: none;
}
.page_3minutes .sec_where section .h3_cont h3 span:nth-of-type(1){
    z-index: 2;
    font-weight: 900;
    font-size: 26px;
    color: #fff;
    text-align: center;
    letter-spacing: 0.05em;
}
.page_3minutes .sec_where section .h3_cont h3 span:nth-of-type(2){
    position: relative;
    z-index: 0;
    color: var(--mainColor);
    font-weight: 900;
    font-size: 46px;
    line-height: 1.17;
}
.page_3minutes .sec_where section .h3_cont h3 span:nth-of-type(2)::before{
    position: absolute;
    z-index: 0;
    inset: .1em calc(100% + 20px) 0 auto;
    margin: auto;
    content: '';
    background: no-repeat center / contain;
}
.page_3minutes .sec_where > section:nth-of-type(1) .h3_cont h3 span:nth-of-type(2)::before{
    width: .82em;
    height: 1.04em;
    background-image: url(../img/page/business/3minutes/sec02_ico01.svg);
}
.page_3minutes .sec_where > section:nth-of-type(2) .h3_cont h3 span:nth-of-type(2)::before{
    width: 1.3em;
    height: 1.1em;
    background-image: url(../img/page/business/3minutes/sec02_ico02.svg);
}
.page_3minutes .sec_where > section:nth-of-type(3) .h3_cont h3 span:nth-of-type(2)::before{
    width: 1.24em;
    height: 1em;
    background-image: url(../img/page/business/3minutes/sec02_ico03.svg);
}
.page_3minutes .sec_where > section:nth-of-type(4) .h3_cont h3 span:nth-of-type(2)::before{
    width: .95em;
    height: .847em;
    background-image: url(../img/page/business/3minutes/sec02_ico04.svg);
}
.page_3minutes .sec_where > section:nth-of-type(5) .h3_cont h3 span:nth-of-type(2)::before{
    width: 1.239em;
    height: .89em;
    background-image: url(../img/page/business/3minutes/sec02_ico05.svg);
}
.page_3minutes .sec_where > section:nth-of-type(6) .h3_cont h3 span:nth-of-type(2)::before{
    width: 1em;
    height: .978em;
    background-image: url(../img/page/business/3minutes/sec02_ico06.svg);
}
.page_3minutes .sec_where section .txt_cont p:not(.h3_cont > p){line-height: 2.375;}
.page_3minutes .sec_where section .txt_cont .signature{
    margin: 2em 0 0;
    font-weight: 700;
}
.page_3minutes .sec_where section .txt_cont .signature span{color: var(--mainColor);}
/* 奇数のみ */
.page_3minutes .sec_where > section{
    --clip_base: 80px;
    --num_offset: -120px;
}
.page_3minutes .sec_where > section:nth-of-type(odd){--offset: calc(100% - var(--clip_base));}
.page_3minutes .sec_where > section:nth-of-type(odd) > .inner{clip-path: polygon(0 var(--num_offset), 150% var(--num_offset), 100% var(--offset), var(--offset) 100%, 0% 110%);}
.page_3minutes .sec_where > section:nth-of-type(odd)::after{left: 0;}
/* 偶数のみ */
.page_3minutes .sec_where > section:nth-of-type(even){--offset: var(--clip_base);}
.page_3minutes .sec_where > section:nth-of-type(even) > .flex{flex-direction: row-reverse;}
.page_3minutes .sec_where > section:nth-of-type(even) > .inner{clip-path: polygon(-50% var(--num_offset), 100% var(--num_offset), 100% 100%, var(--offset) 100%, 0 calc(100% - var(--offset)));}
.page_3minutes .sec_where > section:nth-of-type(even)::after{right: 0;}

/* sec_why */
.page_3minutes .sec_why{
    background: var(--mainColor);
    padding: 120px 0 0;
}
.page_3minutes .sec_why .bg_white{
    position: relative;
    z-index: 0;
    padding: 230px 0 100px;
}
.page_3minutes .sec_why .bg_white::before,
.page_3minutes .sec_why .bg_white::after{
    position: absolute;
    right: -100%;
    left: -100%;
    margin: auto;
    content: '';
    background: var(--mainColor);
}
.page_3minutes .sec_why .bg_white::before{
    z-index: 0;
    top: 0;
    width: 100%;
    height: 70px;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.page_3minutes .sec_why .bg_white::after{
    z-index: -1;
    top: -1.9px;
    width: calc(100% - 6px);
    height: 2px;
}

.page_3minutes .sec_why .bg_white .flex{
    --txt_w: 38.4%;
    --gap: 13%;
    column-gap: var(--gap);
    align-items: flex-start;
}
.page_3minutes .sec_why .bg_white .flex .txt_cont{
    width: var(--txt_w);
}
.page_3minutes .sec_why .bg_white h2{
    position: relative;
    z-index: 0;
    font-size: 40px;
    color: var(--mainColor);
    line-height: 2;
    text-align: left;
    padding: 2em 0 0;
}
.page_3minutes .sec_why .bg_white h2::before{
    position: absolute;
    z-index: 0;
    inset: 0 auto auto 0;
    content: '';
    width: 2.55em;
    height: 1.65em;
    background: url(../img/page/business/3minutes/sec03_h2.svg) no-repeat center / contain;
}
.page_3minutes .sec_why .bg_white h2 + p{
    font-weight: 700;
    line-height: 2.375;
}
.page_3minutes .sec_why .bg_white .flex ul{
    --gap: min(5%, 30px);
    width: calc(100% - var(--txt_w) - var(--gap));
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 55px var(--gap);
}
.page_3minutes .sec_why .bg_white .flex ul li{
    --shape: 12px;
    position: relative;
    z-index: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    width: calc((100% - var(--gap)) / 2);
    aspect-ratio: 267 / 257;
    max-width: 270px;
    color: #fff;
    padding: 22px;
    filter: drop-shadow(1px 1px 3px rgba(0, 0, 0, .1));
}
.page_3minutes .sec_why .bg_white .flex ul li::after{
    position: absolute;
    z-index: -1;
    inset: 0;
    margin: auto;
    content: '';
    width: 100%;
    height: 100%;
    clip-path: polygon(var(--shape) 0, calc(100% - var(--shape)) 0, 100% var(--shape), 100% calc(100% - var(--shape)), calc(100% - var(--shape)) 100%, var(--shape) 100%, 0 calc(100% - var(--shape)), 0 var(--shape));
}
.page_3minutes .sec_why .bg_white .flex ul li.r_kogyo::after{background: #267dbd;}
.page_3minutes .sec_why .bg_white .flex ul li.nichiden::after{background: var(--c_nichiden);}
.page_3minutes .sec_why .bg_white .flex ul li.r_tech::after{background: #00409e;}
.page_3minutes .sec_why .bg_white .flex ul li.r_malaysia::after{background: #073045;}

.page_3minutes .sec_why .bg_white .flex ul li::before{
    position: absolute;
    z-index: 0;
    inset: -53px 0 auto;
    margin: auto;
    content: '';
    width: 66.7%;
    aspect-ratio: 268 / 256;
    background: no-repeat center / contain;
}

.page_3minutes .sec_why .bg_white .flex ul li.r_kogyo::before{background-image: url(../img/page/business/3minutes/sec03_ico01.png);}
.page_3minutes .sec_why .bg_white .flex ul li.nichiden::before{background-image: url(../img/page/business/3minutes/sec03_ico02.svg);}
.page_3minutes .sec_why .bg_white .flex ul li.r_tech::before{background-image: url(../img/page/business/3minutes/sec03_ico03.png);}
.page_3minutes .sec_why .bg_white .flex ul li.r_malaysia::before{background-image: url(../img/page/business/3minutes/sec03_ico04.svg);}


.page_3minutes .sec_why .bg_white .flex ul li dl{text-align: center;}
.page_3minutes .sec_why .bg_white .flex ul li dl dt{
    font-size: min(2.22vw, 24px);
    font-weight: 900;
    line-height: 1.3;
    letter-spacing: 0.05em;
    margin: 0 auto 0.65em;
}
.page_3minutes .sec_why .bg_white .flex ul li dl dd{
    display: inline-flex;
    align-items: center;
    font-weight: 500;
    min-height: calc(2em * 1.875);
    font-size: min(1.4vw, 16px);
}

/* sec_number */
.page_3minutes .sec_number{
    position: relative;
    z-index: 0;
    padding: calc((1600 / 70) * 0.2vw) 0 190px;
}
.page_3minutes .sec_number::before{
    position: absolute;
    z-index: 0;
    inset: 0 0 auto;
    margin: auto;
    content: '';
    width: 100%;
    height: fit-content;
    aspect-ratio: 1600 / 70;
    background: url(../img/page/business/3minutes/sec04_arrow.svg) no-repeat center / contain;
}
.page_3minutes .sec_number .inner{max-width: 1050px;}
.page_3minutes .sec_number h2{
    position: relative;
    z-index: 0;
    color: var(--mainColor);
    margin: 120px auto 100px;
    padding: 0 0 160px;
}
.page_3minutes .sec_number h2::before{
    position: absolute;
    z-index: 0;
    inset: auto 0 0;
    margin: auto;
    content: '';
    width: 380px;
    height: 121px;
    background: url(../img/page/business/3minutes/sec04_img01.jpg) no-repeat center / contain;
}

.page_3minutes .sec_number .num_list{
    --gap: 4.2%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 64px var(--gap);
}
.page_3minutes .sec_number .num_list li{
    width: calc((100% - var(--gap)) / 2);
    text-align: center;
    background: #ecf5fa;
    padding: 65px 50px 45px;
}
.page_3minutes .sec_number .num_list li .ttl{
    position: relative;
    z-index: 0;
    font-weight: 700;
    font-size: 28px;
    line-height: 1.5;
}
.page_3minutes .sec_number .num_list li .ttl::before{
    position: absolute;
    z-index: 0;
    inset: auto 0 calc(100% + 11px);
    margin: auto;
    content: '';
    width: 95px;
    height: 80px;
    background: no-repeat center / contain;
}
.page_3minutes .sec_number .num_list li:nth-of-type(1) .ttl::before{background: url(../img/page/business/3minutes/sec04_ico01.svg);}
.page_3minutes .sec_number .num_list li:nth-of-type(2) .ttl::before{background: url(../img/page/business/3minutes/sec04_ico02.svg);}
.page_3minutes .sec_number .num_list li:nth-of-type(3) .ttl::before{background: url(../img/page/business/3minutes/sec04_ico03.svg);}
.page_3minutes .sec_number .num_list li:nth-of-type(4) .ttl::before{background: url(../img/page/business/3minutes/sec04_ico04.svg);}
.page_3minutes .sec_number .num_list li .ttl span{
    display: block;
    font-size: 20px;
    margin: 0.5em auto 1em;
}
.page_3minutes .sec_number .num_list li .nums span{
    display: inline-block;
    font-weight: 700;
    font-size: 35px;
    line-height: 1.1;
}
.page_3minutes .sec_number .num_list li .nums .num{
    margin: 0 0.1em;
    font-family: var(--ff_oswald);
    color: var(--mainColor);
    font-size: 103px;
    font-weight: 600;
}
.page_3minutes .sec_number .num_list li .flex:has(>.nums){
    justify-content: space-between;
    align-items: flex-end;
}
.page_3minutes .sec_number .num_list li .nums.fz_s span{font-size: 20px;}
.page_3minutes .sec_number .num_list li .nums.fz_s .sup{
    display: block;
    text-align: left;
}
.page_3minutes .sec_number .num_list li .nums.fz_s .num{
    font-size: 63px;
    margin-left: 0;
}

/* sec_more */
.page_3minutes .sec_more{
    padding: 90px 0 160px;
    background: #ecf5fa;
}
.page_3minutes .sec_more h2{
    color: var(--mainColor);
    margin: 0 auto 65px;
}
.page_3minutes .sec_more .more_list{
    --gap: 3.6%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    column-gap: var(--gap);
}
.page_3minutes .sec_more .more_list li{
    width: calc((100% - (var(--gap) * 2)) / 3);
    text-align: center;
}
.page_3minutes .sec_more .more_list li a{display: block;}
.page_3minutes .sec_more .more_list li figure{
    aspect-ratio: 345 / 230;
    overflow: hidden;
    margin: 0 auto 1.25em;
}
.page_3minutes .sec_more .more_list li figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.page_3minutes .sec_more .more_list li p{
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: .66em;
    color: var(--mainColor);
    font-weight: 500;
    font-size: 24px;
    line-height: 1.4;
}
.page_3minutes .sec_more .more_list li p::after{
    display: block;
    content: '';
    width: 9px;
    height: 9px;
    border-top: 2px solid var(--mainColor);
    border-right: 2px solid var(--mainColor);
    transform: translateY(.05em) rotate(45deg);
}

/* ============
製品案内
============*/
/* 下層 ============ */
/* KV */
.page_product .kv_sub{
    --bcH: 45px;
    position: relative;
    z-index: 0;
}
.page_product .kv_sub:has(picture){border-bottom: none;}
.page_product .kv_sub::before,
.page_product .kv_sub::after{
    position: absolute;
    margin: auto;
    content: '';
}
.page_product .kv_sub::before{
    z-index: -2;
    inset: 0 auto 0 0;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, #fff 0%, #fff 65%, transparent 100%);
}
.page_product .kv_sub::after{
    z-index: -1;
    inset: auto 0 0;
    width: 100%;
    height: var(--bcH);
    background: #fff;
}
.page_product .kv_sub > picture{
    position: absolute;
    z-index: -3;
    inset: 0 0 auto auto;
    height: calc(100% - var(--bcH));
}
.page_product .kv_sub > picture::before{display: none;}
.page_product .kv_sub .bg_area{padding-bottom: var(--bcH);}
.page_product .kv_sub .ttl_cont .ja{
    font-size: 40px;
    color: var(--mainColor);
}
/* flex */
.page_product .flex{
    position: relative;
    z-index: 0;
    --w: min(250px, 15.625vw);
    --w: 250px;
    --gap: min(40px, 2.5vw);
    -moz-column-gap: var(--gap);
         column-gap: var(--gap);
}
/* menu */
.page_product nav{
    position: -webkit-sticky;
    position: sticky;
    top: calc(var(--headerHeight) + 30px);
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    width: var(--w);
}
.page_product nav ul{margin: 0;}
.page_product nav ul li{
    padding: 0;
    margin: 0;
    border-top: 1px solid #eaebec;
}
.page_product nav ul li:last-of-type{border-bottom: 1px solid #eaebec;}
.page_product nav ul li::before{display: none;}
.page_product nav ul li a{
    position: relative;
    z-index: 0;
    display: block;
    height: 100%;
    color: #afb1b3;
    font-size: 14px;
    line-height: 1.85;
    font-weight: 500;
    padding: 1em;
}
.page_product nav ul li a::before{
    position: absolute;
    z-index: 0;
    inset: 0 auto 0 0 ;
    margin: auto;
    content: '';
    width: 2px;
    height: calc(100% - 18px);
    /* background: #d4e7f4; */
    background: var(--mainColor);
    opacity: 0;
    visibility: hidden;
    transition: .3s;
}
.page_product nav ul li.active a::before{
    opacity: 1;
    visibility: visible;
}

.page_product nav ul li a:hover,
.page_product nav ul li.active a{
    color: var(--mainColor);
    opacity: 1;
}
/* cont */
.page_product .editor_contents{
    position: relative;
    z-index: 1;
}
.page_product .cont{width: calc(100% - var(--w) - var(--gap));}
.editor_contents .cont > section:nth-of-type(1) > *:first-child{margin-top: 0 !important;}
.editor_contents .cont > section:nth-last-of-type(1) > *:last-child{margin-bottom: 0 !important;}
.page_product .cont section section:not(:last-of-type){margin: 0 0 70px;}
.page_product .cont h2{
    font-size: 30px;
    margin: 110px 0 30px;
}
.page_product .cont h3{
    font-size: 20px;
    font-weight: 700;
    margin: 40px 0 25px;
}
.page_product .cont h4{margin: 30px 0 25px;}
.page_product .cont h2 + figure,
.page_product .cont h3 + figure{margin: 35px 0 20px;}
.page_product .cont p{line-height: 2;}
.page_product .cont .cap{
    color: #6f7377;
    font-size: 15px;
    line-height: 1.4;
}
.page_product .cont ul[class] li{padding: 0;margin: 0;}
.page_product .cont ul[class] li::before{display: none;}
.page_product .cont ul[class] li a{
    display: flex;
    align-items: center;
}
/* bg_list */
.page_product .cont .bg_list{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 14px 12px;
    margin: 0 0 12px;
}
.page_product .cont ul.bg_list li{
    width: calc(50% - 6px);
    background: var(--bgSpHam);
    padding: 1.45em 1.125em;
    border-radius: 12px;
    line-height: 1.4;
}
/* related_company */
.page_product .cont .related_company{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px 5%;
}
.page_product .cont .related_company li{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    /* -moz-column-gap: 0.5em; */
         /* column-gap: 0.5em; */
}
.page_product .cont .related_company li figure{
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0;
}
.page_product .cont .related_company li.r_kogyo figure{width: 60px;}
.page_product .cont .related_company li.nichiden figure{width: 120px;}
.page_product .cont .related_company li figure img{
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain;
}
.page_product .cont .related_company li p{
    margin: 0;
    line-height: 1.4;
}
/* prod_list */
.page_product .cont .prod_list{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 28px  2%;
}
.page_product .cont .prod_list li{
    width: calc(25% - (2% / 1.33));
    cursor: pointer;
}
.page_product .cont .prod_list li figure{
    aspect-ratio: 1;
    overflow: hidden;
    margin: 0 0 10px;
}
.page_product .cont .prod_list li figure img{
    transition: 0.3s;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
.page_product .cont .prod_list li:hover figure img{transform: scale(1.1);}
.page_product .cont .prod_list li p{
    margin: 0;
    line-height: 1.4;
}

/* prod_list - modal*/
html:has(.prod_modal.is_open),
body:has(.prod_modal.is_open){overflow: clip;}
.page_product + .prod_modal{
    position: fixed;
    z-index: 50;
    inset: 0;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.5s ease, visibility 0.5s ease;
}
.page_product + .prod_modal.is_open{
    visibility: visible;
    opacity: 1;
}

.page_product + .prod_modal .modal_overlay{
    position: absolute;
    z-index: 0;
    inset: 0;
    margin: auto;
    background: rgba(255, 255, 255, .8);
}

.page_product + .prod_modal .modal_inner{
    position: relative;
    z-index: 1;
    width: 60%;
    max-width: 600px;
}
.page_product + .prod_modal figure{
    width: auto;
    height: auto;
    max-height: 70vh;
    aspect-ratio: 1;
    overflow: hidden;
    margin: 0 auto;
}
.page_product + .prod_modal figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.page_product + .prod_modal .modal_close{
    position: absolute;
    z-index: 1;
    top: -35px;
    right: -8px;
    display: block;
    width: 30px;
    aspect-ratio: 1;
    background: transparent;
    cursor: pointer;
    font-size: 0;
}
.page_product + .prod_modal .modal_close::before,
.page_product + .prod_modal .modal_close::after{
    position: absolute;
    z-index: 0;
    inset: 0;
    margin: auto;
    content: '';
    width: 25px;
    height: 2px;
    background: var(--mainColor);
}
.page_product + .prod_modal .modal_close::before{transform: rotate(-45deg);}
.page_product + .prod_modal .modal_close::after{transform: rotate(45deg);}

/* other_cont */
.page_product .cont .other_cont > section{
    --w: 73%;
    --gap: 4%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--gap);
    border-bottom: 1px solid var(--borderMain);
    margin: 0 !important;
    padding: 22px 0;
}
.page_product .cont .other_cont > section > div{width: var(--w);}
.page_product .cont .other_cont > section > div h3{
    font-size: 20px;
    margin: 0 0 .6em;
}
/* .page_product .cont .other_cont > section > div h3::before{display: none;} */
.page_product .cont .other_cont > section > div p{margin: 0 0 .2em;}
.page_product .cont .other_cont > section > div p:last-of-type{margin: 0;}
.page_product .cont .other_cont > section > figure{
    width: calc(100% - var(--w) - var(--gap));
    height: auto;
    aspect-ratio: 1;
    overflow: hidden;
    cursor: pointer;
}
.page_product .cont .other_cont > section > figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s;
}
.page_product .cont .other_cont > section > figure:hover img{transform: scale(1.1);}

/* sec_other */
.page_product.page .contents_wrapper{padding-bottom: 0;}
.page_product .sec_other{
    position: relative;
    z-index: 0;
    border-top: 1px solid var(--borderMain);
    background: #f5f9fc;
    padding: 80px 0 160px;
    margin: 80px 0 0;
}
.page_product .sec_other h2{
    color: var(--mainColor);
    font-size: 32px;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    margin: 0 0 60px;
}
.page_product .sec_other ul{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 22px 28px;
}
.page_product .sec_other ul li{width: calc(50% - 14px);}
.page_product .sec_other ul li.current{display: none;}
.page_product .sec_other ul li a{
    position: relative;
    z-index: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 1.875em 45% 1.875em 1.875em;
    min-height: 140px;
    border: 1px solid var(--borderMain);
    color: var(--mainColor);
    font-weight: 700;
    line-height: 1.6;
    background: #fff;
}
.page_product .sec_other ul li a::before{
    position: absolute;
    z-index: -1;
    inset: 0 auto 0 0;
    margin: auto;
    content: '';
    width: 200px;
    height: 100%;
    background: linear-gradient(to right, #fff 0%, #fff 55%, transparent 100%);
}
.page_product .sec_other ul li.prod01 a{background: url(../img/page/product/sub/prod_other01.jpg) no-repeat right center / cover;}
.page_product .sec_other ul li.prod02 a{background: url(../img/page/product/sub/prod_other02.jpg) no-repeat right center / cover;}
.page_product .sec_other ul li.prod03 a{background: url(../img/page/product/sub/prod_other03.jpg) no-repeat right center / cover;}
.page_product .sec_other ul li.prod04 a{background: url(../img/page/product/sub/prod_other04.jpg) no-repeat right center / cover;}
.page_product .sec_other ul li.prod05 a{background: url(../img/page/product/sub/prod_other05.jpg) no-repeat right center / cover;}
/* ============
会社案内
============*/
/* 沿革 ============ */
.page_history .history_list{
    --offset: 8px;
    position: relative;
    z-index: 0;
    padding: calc(100px - var(--offset)) 0 40px;
}
.page_history .history_list::before{
    position: absolute;
    z-index: -1;
    inset: 0;
    margin: auto;
    content: '';
    width: 10px;
    height: 100%;
    background: var(--mainColor);
}
.page_history .history_list > div{
    --w: 100px;
    position: relative;
    z-index: 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: calc(50% + 50px);
    height: 115px;
}
.page_history .history_list > div:nth-of-type(odd){
    margin-inline: 0 auto;
    flex-direction: row-reverse;
}
.page_history .history_list > div:nth-of-type(even){
    margin-inline: auto 0;
    flex-direction: row;
}
.page_history .history_list > div::before{
    position: absolute;
    z-index: -1;
    inset: 32px auto auto 0;
    content: '';
    width: 100%;
    height: 1px;
    background: var(--mainColor);
}
.page_history .history_list > div > dt{
    font-family: var(--ff_plusJakartaSans);
    font-weight: 700;
    font-size: 32px;
    line-height: 1.1;
    color: #fff;
    background: var(--mainColor);
    padding: 5px 14px 3px 14px;
    text-align: center;
    min-width: var(--w);
    min-height: 45px;
    margin-top: var(--offset);
}
.page_history .history_list > div > dd{max-width: 90%;}
.page_history .history_list > div.miraiwood > dd{max-width: 72%;}
.page_history .history_list > div:nth-of-type(odd) > dd{
    padding-right: 1em;
    text-align: left;
}
.page_history .history_list > div:nth-of-type(even) > dd{
    padding-left: 1em;
    text-align: right;
}
.page_history .history_list > div dd dt{
    color: var(--mainColor);
    font-weight: 500;
    font-size: 18px;
    line-height: 1.4;
    padding: 0 0 .4em;
    margin: 0 0 .3em;
}
.page_history .history_list > div dd dd p{font-feature-settings: "halt";}
.page_history .history_list > div dd dd p span{display: inline-block;}
.page_history .history_list > div:nth-of-type(even) dd dd figure{margin-inline: auto 0;}
.page_history .history_list > div dd dd figure{
    margin-top: 20px;
    width: 80%;
}
.page_history .history_list > div.r_tech dd dd figure{max-width: 130px;}
.page_history .history_list > div.r_kogyo dd dd figure{max-width: 88px;}
.page_history .history_list > div.nichiden dd dd figure{max-width: 198px;}
.page_history .history_list > div.r_malaysia dd dd figure{max-width: 170px;}
.page_history .history_list > div.miraiwood dd dd figure{max-width: 315px;}

/* 　　 ============ */

/* ============
サステナビリティ
============*/
/* TOP ============ */
.page_sustainability{
    --themeColor: var(--sustainColor);
}
.page_sustainability .kv_sub > picture::before{display: none;}
.page_sustainability .kv_sub > picture img{-o-object-position: 30% 50%;object-position: 30% 50%;}

.page_sustainability .inner > section:first-of-type > *:first-child{margin-top: 0 !important;}
.page_sustainability .inner > section:last-of-type > *:last-child{margin-bottom: 0 !important;}

.page_sustainability .inner > section > h2{
    padding-top: 0;
    margin: 100px 0 50px;
    text-align: center;
}
.page_sustainability .editor_contents h2::before{background: #badbc6;}

.page_sustainability .inner > section > h2::before,
.page_sustainability .inner > section > h2::after{display: none;}
.page_sustainability .inner > section > h2 + p{
    font-size: 1.125em;
    line-height: 2;
}
.page_sustainability .inner > section .president_name{text-align: right;}
/* anc list */
.page_sustainability .anc_list{
    display: flex;
    justify-content: center;
    align-items: center;
}
.page_sustainability .anc_list li{
    width: calc(100% / 3);
    padding: 0;
    margin: 0;
    border-left: 1px solid var(--themeColor);
    transform: skewX(calc(var(--skewDeg) * -1));
}
.page_sustainability .anc_list li:last-of-type{border-right: 1px solid var(--themeColor);}
.page_sustainability .anc_list li::before{display: none;}
.page_sustainability .anc_list li a{
    display: block;
    transform: skewX(var(--skewDeg));
    padding: .5em 1em 1.7em;
    text-align: center;
}
.page_sustainability .anc_list li a::before{
    display: block;
    content: '';
    counter-increment: ol_num 1;
    content: counter(ol_num);
    color: var(--themeColor);
    font-size: 26px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 auto 0.4em;
}
.page_sustainability .anc_list li a::after{
    position: absolute;
    z-index: 0;
    inset: auto 0 .5em;
    margin: auto;
    content: '';
    width: 9px;
    height: 9px;
    border-right: 2px solid var(--themeColor);
    border-bottom: 2px solid var(--themeColor);
    transform:  rotate(45deg);
    transition: transform .2s;
}
.page_sustainability .anc_list li a span{
    display: block;
    font-weight: 500;
    font-size: 20px;
    letter-spacing: 0.05em;
}
.page_sustainability .anc_list li a:hover{opacity: 1;}
@media screen and (hover: hover) {
    .page_sustainability .anc_list li a:hover{color: var(--themeColor);}
    .page_sustainability .anc_list li a:hover::after{transform: translateY(.3em) rotate(45deg);}
}
/* section common */
.page_sustainability .sus_policy > section{margin: 95px 0 0;}
.page_sustainability .sus_policy > section .sus_ttl{margin: 0 0 40px;}
.page_sustainability .sus_policy > section .sus_ttl p{
    color: var(--themeColor);
    font-weight: 700;
    font-size: 20px;
    line-height: 1.4;
    margin: 0;
}
.page_sustainability .sus_policy > section .sus_ttl h3{margin: 20px 0 0;}
.page_sustainability .sus_policy > section .sus_ttl h3 span{
    display: inline-block;
    color: var(--themeColor);
    font-weight: 700;
    margin: 0 0.25em 0 0;
}
.page_sustainability .sus_policy > section picture{
    display: block;
    margin: 0 0 30px;
}
.page_sustainability .sus_policy > section ul li{
    font-weight: 500;
    line-height: 1.75;
    padding: 0 0 0 0.8em;
    word-break: auto-phrase;
}
.page_sustainability .sus_policy > section ul li::before{
    top: 0.73em;
    width: 6px;
    height: 6px;
}
/* case */
.page_sustainability .sus_policy .case{margin: 40px 0 0;}
.page_sustainability .sus_policy .case h4{
    font-size: 18px;
    font-weight: 700;
    background: var(--bgSustain);
    border: none;
    padding: 1.2em 2em;
    margin: 0;
}
.page_sustainability .sus_policy .case dl{
    --w: 110px;
    --mr: 1em;
    border: 2px solid var(--bgSustain);
    padding: 1.5625em 2.125em;
}
.page_sustainability .sus_policy .case dl dt,
.page_sustainability .sus_policy .case dl dd{
    display: inline-block;
    margin-bottom: .5em;
}
.page_sustainability .sus_policy .case dl dt{
    position: relative;
    z-index: 0;
    width: var(--w);
    margin: 0 var(--mr) 0 0;
    padding: 0 var(--mr) 0 0;
    font-weight: 400;
    vertical-align: top;
}
.page_sustainability .sus_policy .case dl dt::before{
    position: absolute;
    z-index: 0;
    inset: 0 0 0 auto;
    margin: auto;
    content: '';
    width: 1px;
    height: 57%;
    background: #dcddde;
}
.page_sustainability .sus_policy .case dl dd{width: calc(99% - var(--w) - var(--mr));}
/* ============
採用
============*/
/* TOP ============ */
.page_recruit .editor_contents h2{margin: 80px 0 60px;}
.page_recruit .editor_contents h3{margin: 60px 0 25px;}
/* スライダー */
.page_recruit .slider_area{
    margin: 160px 0 0;
    padding: 80px 0;
    background: var(--bgSpHam);
}
.page_recruit .slider_area h2{margin-bottom: 35px;}
.page_recruit .slider_area .recruit_slider{margin: 40px auto 0;}
.page_recruit .slider_area .recruit_slider .slick-list{margin: 0 calc(min(1.25vw, 20px) * -1);}
.page_recruit .slider_area .recruit_slider li{
    padding: 0;
    margin: 0 min(1.25vw, 20px);
}
.page_recruit .slider_area .recruit_slider li figure{
    aspect-ratio: 345 / 230;
    overflow: hidden;
}
.page_recruit .slider_area .recruit_slider li figure img{
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}
.page_recruit .slider_area .recruit_slider li p{
    color: var(--mainColor);
    font-size: 20px;
    font-weight: 500;
    line-height: 1.3;
    text-align: center;
    margin: 0.5em auto 0;
}
.page_recruit .slider_area .recruit_slider li::before{display: none;}
/* slick */
.page_recruit .slider_area .recruit_slider .slick-arrow{
    top: calc(50% - 15px);
    width: 15px;
    height: 30px;
}
.page_recruit .slider_area .recruit_slider .slick-arrow::before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: var(--mainColor);
    -webkit-mask: url(../img/common/ico/arrow_slider.svg) no-repeat center / contain;
            mask: url(../img/common/ico/arrow_slider.svg) no-repeat center / contain;
    opacity: 1;
    transition: background-color .3s;
}
.page_recruit .slider_area .recruit_slider .slick-arrow.slick-disabled{pointer-events: none;}
.page_recruit .slider_area .recruit_slider .slick-arrow.slick-disabled::before{background: #ccc;}
.page_recruit .slider_area .recruit_slider .slick-prev{left: max(-3.4vw, -65px);}
.page_recruit .slider_area .recruit_slider .slick-next{
    right: max(-3.4vw, -65px);
    transform: translate(0, -50%) rotate(180deg);
}

/* cta */
.page_recruit .cta_entry{
    padding: 80px 0 0;
    text-align: center;
}
.page_recruit .cta_entry .ttl{
    color: var(--mainColor);
    font-weight: 700;
    line-height: 1.4;
    margin: 0 auto 25px;
}
.page_recruit .cta_entry .ttl p{
    font-family: var(--ff_plusJakartaSans);
    font-size: 24px;
    font-weight: 800;
}
.page_recruit .cta_entry .ttl h2{font-size: 32px;}
.page_recruit .cta_entry .ttl + p{
    font-weight: 500;
    margin: 0 auto 40px;
}
.page_recruit .cta_entry ul{
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    max-width: 580px;
    -moz-column-gap: 35px;
         column-gap: 35px;
}
.page_recruit .cta_entry ul li{width: calc((100% - 35px) / 2);}
.page_recruit .cta_entry ul li a{
    position: relative;
    z-index: 0;
    display: block;
    background: var(--mainColor);
    color: #fff;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.4;
    text-align: center;
    letter-spacing: 0.05em;
    padding: 1.065em 2.15em;
    min-height: 60px;
    border: 1px solid var(--mainColor);
    transform: skewX(calc(var(--skewDeg) * -1));
}
.page_recruit .cta_entry ul li a::before{
    position: absolute;
    z-index: 0;
    inset: 0 1.1em 0 auto;
    margin: auto;
    content: '';
    width: 9px;
    height: 9px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: skewX(var(--skewDeg)) rotate(45deg);
    transition: 0.3s;
    transition-property: border-color, background-color;
}
.page_recruit .cta_entry ul li a[target]::before{
    width: 16px;
    height: 16px;
    border: none;
    background: currentColor;
    -webkit-mask: url(../img/common/ico/link_blank02.svg) no-repeat center / contain;
            mask: url(../img/common/ico/link_blank02.svg) no-repeat center / contain;
    transform: skewX(var(--skewDeg));
}
.page_recruit .cta_entry ul li a span{
    display: inline-block;
    transform: skewX(var(--skewDeg));
}
.page_recruit .cta_entry ul li a:hover{
    opacity: 1;
    background: #fff;
    color: var(--mainColor);
}
/* ============
お問い合わせ
============*/
.grecaptcha-badge{display: none !important;}
body:has(.page_contact) .grecaptcha-badge{
    display: block !important;
    z-index: 10;
    bottom: 85px !important;
}
#autozip{display: none !important;}
/* ベース ============ */
.page_contact .snow-monkey-form{margin: 70px auto 0;}
/* 行 */
.page_contact .smf-form--simple-table .smf-item{
    border-top: 1px solid var(--gray);
    padding: 1.25em 4.5%;
}
/* ラベル */
.page_contact .smf-form--simple-table{
    --w: 300px;
}
.page_contact .smf-form--simple-table .smf-item__col--label{
    width: var(--w);
    padding: 0.6em 0;
}
.page_contact .smf-form--simple-table .smf-item__col--controls{
    width: calc(100% - var(--w));
}
/* 項目 */
.page_contact .smf-form .smf-text-control__control,
.page_contact .smf-form .smf-select-control__control,
.page_contact .smf-form .smf-textarea-control__control{
    width: 100%;
    border: none;
    background: var(--bgNews);
    border-radius: 0;
    box-shadow: none;
    padding-block: .81rem;
    min-height: 50px;
}
.page_contact .smf-form .smf-text-control__control::-webkit-input-placeholder{
    color: var(--gray);
    font-weight: 300;
}
.page_contact .smf-form .smf-text-control__control::-moz-placeholder{
    color: var(--gray);
    font-weight: 300;
}
.page_contact .smf-form .smf-text-control__control:-ms-input-placeholder{
    color: var(--gray);
    font-weight: 300;
}
.page_contact .smf-form .smf-text-control__control::-ms-input-placeholder{
    color: var(--gray);
    font-weight: 300;
}
.page_contact .smf-form .smf-text-control__control::placeholder{
    color: var(--gray);
    font-weight: 300;
}
.page_contact .smf-form .smf-text-control__control[name="adrs_zip"],
.page_contact .smf-form .smf-select-control:has(.smf-select-control__control[name="adrs_prefecture"]),
.page_contact .smf-form .smf-select-control .smf-select-control__control[name="adrs_prefecture"]{
    width: 100%;
    max-width: 390px;
}
.page_contact .smf-item__controls .wp-block-columns{margin: 0;}
/* 電話番号 */
.page_contact .wp-block-columns:has(input[type="tel"]){gap: 1%;}
.page_contact .wp-block-columns.is-not-stacked-on-mobile:has(input[type="tel"]) > .wp-block-column{
    display: flex;
    align-items: center;
}
/* 住所 */
.page_contact .smf-form--simple-table .smf-item.address .smf-item__controls > div:not(:last-of-type){margin: 0 0 0.625em;}
.page_contact .smf-form--simple-table .smf-item.address .smf-item__controls > div:first-of-type{margin: 0 0 1.125em;}
/* お問い合わせ項目 */
.page_contact .smf-form .smf-checkboxes-control__control{
    padding: 0.6em 0;
    font-weight: 500;
}
.page_contact .smf-form .smf-checkboxes-control__control .h_contact{
    color: var(--mainColor);
    font-weight: 500;
    font-size: 17px;
    line-height: 1.3;
    margin: 2em 0 .7em;
}
.page_contact .smf-form .smf-checkboxes-control__control > *:first-child{margin-top: 0 !important;}
.page_contact .smf-form .smf-checkboxes-control__control > *:last-child{margin-bottom: 0 !important;}

.page_contact .privacy_box .smf-checkbox-control,
.page_contact .check_cont .smf-checkbox-control{
    position: relative;
    z-index: 0;
    padding-left: 1.5em;
}
.page_contact .privacy_box .smf-checkbox-control input,
.page_contact .check_cont .smf-checkbox-control input{display: none;}
.page_contact .check_cont .smf-checkboxes-control--horizontal .smf-checkboxes-control__control>.smf-label{margin: 0 1.5em 0.5em 0;}
.page_contact .privacy_box .smf-checkbox-control::before,
.page_contact .privacy_box .smf-checkbox-control::after,
.page_contact .check_cont .smf-checkbox-control::before,
.page_contact .check_cont .smf-checkbox-control::after{
    position: absolute;
    inset: 8px auto auto 0;
    width: 16px;
    height: 16px;
}
.page_contact .privacy_box .smf-checkbox-control::before,
.page_contact .check_cont .smf-checkbox-control::before{
    z-index: 0;
    content: '';
    background: #fff;
    border: 1px solid #787878;
}
.page_contact .privacy_box .smf-checkbox-control::after,
.page_contact .check_cont .smf-checkbox-control::after{
    z-index: 1;
    content: '✓';
    display: none;
    justify-content: center;
    align-items: center;
    line-height: 1;
    font-size: 10px;
    color: #fff;
    background: #0071bc;
}
.page_contact .privacy_box .smf-checkbox-control:has(input:checked)::after,
.page_contact .check_cont .smf-checkbox-control:has(input:checked)::after{display: flex;}

/* 確認 / 送信ボタン */
.smf-action .smf-button-control{
    display: block;
    width: fit-content;
    margin-inline: auto;
    display: block;
    min-width: 220px;
    height: 60px;
    line-height: 41px;
    color: var(--mainColor);
    font-size: 17px;
    text-align: center;
    border: solid 1px var(--mainColor);
    text-decoration: none;
    transform: skewX(calc(var(--skewDeg) * -1));
    transition: background-color .3s;
}
.smf-action .smf-button-control__control{
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    transform: skew(var(--skewDeg));
    background: transparent !important;
    border-radius: 0 !important;
    border: none !important;
    color: var(--mainColor) !important;
    width: 100% !important;
    height: 100% !important;
    transition: color .3s !important;
}
.smf-action .smf-button-control:hover{background: var(--mainColor);}
.smf-action .smf-button-control:hover .smf-button-control__control{color: #fff !important;}

/* 入力 / 確認 / 完了 ============ */
body:has(form[data-screen=invalid]) .disp_confirm{display: none;}
/* 入力画面のみ */
body:has(form[data-screen=input]) .disp_input{display: block;}
body:has(form[data-screen=input]) .disp_confirm{display: none;}

/* 確認画面のみ*/
body:has(form[data-screen=confirm]) .disp_input{display: none;}
body:has(form[data-screen=confirm]) .disp_confirm{display: block;}
body:has(form[data-screen=confirm]) .confirm_txt_first{margin-bottom: calc(var(--sectionPadding) / 2);}
body:has(form[data-screen=confirm]) .confirm_txt_last{margin-top: calc(var(--sectionPadding) / 2);}
body:has(form[data-screen=confirm]) .page_contact .smf-form--simple-table .smf-item__col--controls{
    display: flex;
    align-items: center;
    padding: 0.6em 0;
}
body:has(form[data-screen=confirm]) .page_contact .smf-form--simple-table .smf-item__col--controls .smf-item__controls{width: 100%;}
body:has(form[data-screen=confirm]) .wp-block-columns.is-not-stacked-on-mobile>.wp-block-column[style*=flex-basis]{flex-basis: fit-content !important;}
body:has(form[data-screen=confirm]) .page_contact .smf-item__controls .wp-block-columns{
    justify-content: flex-start;
    gap: 0.5%;
}
body:has(form[data-screen=confirm]) .page_contact .smf-form--simple-table .smf-item.name .smf-item__controls > div > div,
body:has(form[data-screen=confirm]) .page_contact .smf-form--simple-table .smf-item.furigana .smf-item__controls > div > div,
body:has(form[data-screen=confirm]) .page_contact .smf-form--simple-table .smf-item.address .smf-item__controls > div:not(:first-of-type){
    display: inline-block;
    width: fit-content;
    flex-basis: fit-content !important;
}
body:has(form[data-screen=confirm]) .page_contact .smf-form--simple-table{border-bottom: 1px solid var(--gray);}
body:has(form[data-screen=confirm]) .smf-action{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: var(--baseMargin);
}
body:has(form[data-screen=confirm]) .smf-action .smf-button-control{margin-inline: 20px;}


/* 完了画面 */
body:has(form[data-screen=complete]) .disp_input,
body:has(form[data-screen=complete]) .disp_confirm{display: none;}
body:has(form[data-screen=complete]) .editor_contents h2,
body:has(form[data-screen=complete]) .page_contact .snow-monkey-form{margin-top: 0 !important;}

/* 必須表示 ============ */
form .wp-block-snow-monkey-forms-item:has(.smf-checkboxes-control):has([data-validations~="required"]) .smf-item__label__text{display: flex;}
form .wp-block-snow-monkey-forms-item:has([data-validations~="required"]) .smf-item__label__text::after,
form .privacy_box .smf-checkboxes-control__control[data-validations~="required"] .smf-checkbox-control__label::after{
    display: inline-block;
    margin: 0 0 0 .2em;
    content: '※';
    font-size: 1em;
    color: var(--alertColor);
}
/* メールアドレスダブルチェック用エラーメッセージ(contact.js) ============ */
.page_contact form .is_error{
    position: relative;
    z-index: 0;
    top: .5em;
}

/* 同意する ============ */
.page_contact form .privacy_box{
    margin: 0 0 1.875em;
    padding: 4.75em 0 0;
    border-top: 1px solid var(--gray);
    text-align: center;
}
.page_contact .privacy_box .smf-checkbox-control{cursor: pointer;}
.page_contact .privacy_box .smf-checkbox-control .smf-checkbox-control__label::after{display: none !important;}
.page_contact .privacy_box p a{color: var(--txtColor);}
.page_contact .privacy_box p a::after{display: none !important;}

/* エントリーフォーム ============ */
.page_contact .privacy_box .ta_left{
    text-align: left;
    margin: 0 0 10px;
}
.page_contact .privacy_box h3{margin-top: 0;}
.page_contact .privacy_box ul li{padding: 0 0 0 0.7em;}
.page_contact .privacy_box ul li::before{
    top: 0.7em;
    width: 4px;
    height: 4px;
    background: var(--txtColor);
}

/* ============
サイトマップ
============*/
.page_sitemap .columns.sitemap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.page_sitemap .columns.sitemap > .item {
    min-width: 215px;
    padding-right: 30px;
}
.page_sitemap .columns.sitemap > .item:last-child {padding-right: 0;}
.page_sitemap .columns.sitemap > .item .top {margin: 55px 0 33px;}
.page_sitemap .columns.sitemap > .item .top:first-child {margin-top: 0;}
.page_sitemap .columns.sitemap > .item .top > span {display: block;}
.page_sitemap .columns.sitemap > .item .top .en {
    line-height: 1.2;
    font-size: 40px;
    font-weight: 700;
}
.page_sitemap .columns.sitemap > .item .top .jp {
    line-height: 1.2;
    font-size: 14px;
    font-weight: 500;
}
.page_sitemap .columns.sitemap > .item ul li {
    padding: 0;
    margin: 0 0 10px;
}
.page_sitemap .columns.sitemap > .item ul li::before{display: none;}

/* -----------------------------------------------------------
single
----------------------------------------------------------- */
/* post_info ============ */
.single .post_info{margin: 0 auto 55px;}
.single .post_info .n_cat{
    display: inline-flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: .5em .75em;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 1em 0 0;
}
.single .post_info .n_cat li{
    text-align: center;
    transform: skewX(calc(var(--skewDeg) * -1));
    border: 1px solid var(--mainColor);
}
.single .post_info .n_cat li span{
    display: block;
    transform: skewX(var(--skewDeg));
    font-size: 12px;
    line-height: 1.3;
    color: var(--mainColor);
    letter-spacing: 0.05em;
    min-height: 30px;
    min-width: 105px;
    padding: 0.6em 1em 0.4em 1em;
}
.single .post_info .n_date{
    display: inline-block;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    letter-spacing: 0.1em;
    line-height: 1.4;
    margin: 0.25em 0 0;
}
.single .post_info h1{
    color: var(--mainColor);
    font-weight: 700;
    font-size: 32px;
    line-height: 1.625;
    margin: .625em 0 0;
    padding: 0 0 0.5em;
    border-bottom: 1px solid currentColor;
}
/* editor contents ============ */
.single .editor_contents h2{
    color: var(--txtColor);
    font-weight: 400;
    font-size: 22px;
    padding: 0 0 15px;
    margin: 80px 0 65px;
    border-bottom: 2px solid var(--mainColor);
}
.single .editor_contents h2::before{
    z-index: 1;
    inset: auto auto -2px 0;
    width: 50px;
    height: 2px;
    background: var(--accentColor);
}
.single .editor_contents h2::after{display: none;}
.single .editor_contents h3{
    font-weight: 400;
    font-size: 20px;
    padding: .5em .7em;
    margin: 65px 0 45px;
    color: var(--mainColor);
    border: 1px solid currentColor;
}
.single .editor_contents h3::before{display: none;}
.single .editor_contents h4{
    position: relative;
    z-index: 0;
    font-weight: 400;
    font-size: 18px;
    color: var(--accentColor);
    border: none;
    padding: 0.25em 0 .25em 0.875em;
}
.single .editor_contents h4::before{
    position: absolute;
    z-index: 0;
    inset: 1px auto 0 0;
    margin: auto;
    content: '';
    width: 3px;
    height: calc(100% + 4px);
    background: currentColor;
}
.single .editor_contents h5{
    font-weight: 400;
    padding: 0 0 .5em;
    border-bottom: 1px solid currentColor;
}
.single .editor_contents h6{
    font-weight: 500;
    margin: 35px 0 25px;
}
/* btn back ============ */
.btn.btn_back{margin: 80px auto 0;}
.btn.btn_back a,
.page_contact .smf-action .smf-button-control__control[data-action="back"]{
    position: relative;
    z-index: 0;
    min-width: 220px;
    min-height: 60px;
    font-size: 17px;
}
.btn.btn_back a::before,
.page_contact .smf-action .smf-button-control__control[data-action="back"]::before{
    position: absolute;
    z-index: 0;
    inset: 0 auto 0 1em;
    margin: auto;
    content: '';
    width: 9px;
    height: 9px;
    border: none;
    border-bottom: 2px solid currentColor;
    border-left: 2px solid currentColor;
    transform: rotate(45deg);
}

/* -----------------------------------------------------------
archive
----------------------------------------------------------- */
/* kv ============ */
.archive .kv_sub > picture::after{
    position: absolute;
    z-index: 2;
    inset: 0 0 0 auto;
    margin: auto;
    content: '';
    width: 63%;
    height: 100%;
    background: linear-gradient(247deg, rgba(255, 255, 255, 1) -10%, rgba(255, 255, 255, 0) 80%);
    pointer-events: none;
}
/* cat_list ============ */
.archive .cat_inner{margin: 0 auto 60px;}
.archive .cat_inner .scroll_wrapper{padding-left: 3px;}
.archive .cat_list{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: .5em 1em;
}
.archive .cat_list li{
    text-align: center;
    transform: skewX(calc(var(--skewDeg) * -1));
    border: 1px solid var(--mainColor);
    transition: background-color 0.3s;
}
.archive .cat_list li a{
    display: block;
    transform: skewX(var(--skewDeg));
    font-size: 12px;
    line-height: 1.3;
    color: var(--mainColor);
    letter-spacing: 0.05em;
    min-height: 30px;
    min-width: 105px;
    padding: 0.6em 1em 0.4em 1em;
}
.archive .cat_list li:has(a:hover),
.archive .cat_list li.current{background: var(--mainColor);}
.archive .cat_list li a:hover,
.archive .cat_list li.current a{
    opacity: 1;
    color: #fff;
}
.archive .cat_list li.current a{pointer-events: none;}

/* news_list ============ */
.archive .news_list > li a .n_cat{margin-right: var(--gap);}
.archive .news_list > li a .n_cat li,
.archive .news_list > li a .n_cat li span{transition: 0.3s;}
.archive .news_list > li a .n_cat li{border: 1px solid var(--mainColor);}
.archive .news_list > li a .n_txt{
    width: calc(100% - var(--w_cat) - var(--w_date) - (var(--gap) * 3));
    text-decoration: none;
}
/* hover */
.archive .news_list > li a:hover{
    background: var(--bgNews);
    color: var(--mainColor);
}
.archive .news_list > li a:hover .n_cat li{background: var(--mainColor);}
.archive .news_list > li a:hover .n_cat li span{color: #fff;}

/* pagenation ============ */
.archive .pagenation{
    margin: 60px auto 0;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}
.archive .pagenation .wp-pagenavi {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}
.archive .pagenation .wp-pagenavi .pages,
.archive .pagenation .wp-pagenavi .first,
.archive .pagenation .wp-pagenavi .last{display: none;}
.archive .pagenation .wp-pagenavi > a,
.archive .pagenation .wp-pagenavi > span {
    display: block;
    width: 56px;
    height: 60px;
    line-height: 58px;
    color: var(--mainColor);
    font-size: 17px;
    text-align: center;
    border: solid 1px var(--mainColor);
    text-decoration: none;
    transform: skewX(calc(var(--skewDeg) * -1));
}
.archive .pagenation .wp-pagenavi > a span,
.archive .pagenation .wp-pagenavi > span span{
    display: inline-block;
    transform: skewX(var(--skewDeg));
}
.archive .pagenation .wp-pagenavi span.current,
.archive .pagenation .wp-pagenavi a:hover {
    color: #fff;
    background: var(--mainColor);
    opacity: 1;
}
.archive .pagenation .wp-pagenavi span.extend {
    border: none;
    width: 30px;
    line-height: 3;
}
.archive .pagenation .wp-pagenavi a.previouspostslink,
.archive .pagenation .wp-pagenavi a.nextpostslink {
    position: relative;
    z-index: 0;
}
.archive .pagenation .wp-pagenavi a.previouspostslink span::after,
.archive .pagenation .wp-pagenavi a.nextpostslink span::after {
    position: absolute;
    z-index: 0;
    inset: -12px 0 0 0;
    display: block;
    content: "";
    width: 0.5em;
    height: 0.5em;
    border-top: solid 2px var(--mainColor);
    border-right: solid 2px var(--mainColor);
    margin: auto;
    transition: 0.3s;
}
.archive .pagenation .wp-pagenavi a.previouspostslink span::after {
    transform: rotate(-135deg);
}
.archive .pagenation .wp-pagenavi a.nextpostslink span::after {
    transform: rotate(45deg);
    left: -5px;
}
.archive .pagenation .wp-pagenavi a.previouspostslink:hover span::after,
.archive .pagenation .wp-pagenavi a.nextpostslink:hover span::after {border-color: #fff;}