@charset "utf-8";

/*----------------------------------------------------------------------------------------------------------------------------

reset & root set

----------------------------------------------------------------------------------------------------------------------------*/

/* reset
--------------------------------------------------------------*/

*,*::before,*::after { box-sizing: border-box; }
ul,ol { margin: 0; padding: 0; list-style: none; }
body,h1,h2,h3,h4,h5,p,figure,blockquote,dl,dd { margin: 0; font-size: inherit; }
img,video { max-width: 100%; height: auto; display: block; }
header,footer,main,aside,picture { display: block; }

/* form parts reset */
textarea { font: inherit; appearance: none; }
select { border: none; outline: none; font-weight: inherit; }
button,input[type="submit"],input[type="button"] { border-radius: 0; appearance: button; border: none; outline: none; cursor: pointer; }
input[type="submit"]:focus,input[type="button"]:focus { outline-offset: -2px;}
input[type="submit"]::-webkit-search-decoration,input[type="button"]::-webkit-search-decoration { display: none;}

/* iOS Safari tap reset */
body {-webkit-tap-highlight-color: transparent;}



/* print set
--------------------------------------------------------------*/
@media print{
html { width: 1280px; }
.header { position: relative !important; }/* fixheader clear */
[class*="iv-"] { opacity: 1; }/* inview view */
}


/* root set
--------------------------------------------------------------*/

/* color */
:root {
    --cl-key01: #1A1311;
    --cl-txt: #1A1311;
    --cl-border: #ccc;
    --cl-bg: #F2F2F2;
    --cl-wh: #fff;
    --cl-bk: #000;
    /*--cl-linktxt: #FDCC00;*/
    --cl-linkbtn-txt: #fff;
    --cl-linkbtn-bg: #1A1311;
    --cl-error: #FF1D1D;
    /*--cl-footer-bg: #00122E;*/
}

/* fixheader height */
:root { --header-height: 6rem; }
@media print, screen and (min-width: 640px) {
:root { --header-height: 9rem; }
}

/* font set */
:root {
    /* font: style weight size / line-height family */
    --ff-base: normal 400 1.4rem / 1.8 'Noto Sans JP', sans-serif;
    --ff-base-light: 300;
    --ff-base-bold: 700;
    /*--ff01f: "Figtree", sans-serif;*/
    /*--ff01w: 600;*/
}






/*----------------------------------------------------------------------------------------------------------------------------

base set

----------------------------------------------------------------------------------------------------------------------------*/
html { font-size:calc(100vw / 37.5); scroll-behavior: smooth; scroll-padding-top: var(--header-height); }
body { min-height: 100vh; text-rendering: optimizeSpeed; -webkit-text-size-adjust:100%; text-size-adjust: 100%; color: var(--cl-txt); font: var(--ff-base); letter-spacing: 0.04em;}
a { color: var(--cl-txt); outline:none; text-decoration:none; }

@media print, screen and (min-width: 640px) {
html { font-size: calc(100vw / 124); }
body { font-size: 1.6rem; }
a { transition: 0.5s; }
a:hover { opacity: 0.7; }
button:hover { opacity: 0.7; }
}

@media print, screen and (min-width: 1240px) {
html { font-size:62.5%; }
}


/* form set */
input:not([type=radio],[type=checkbox],[type=submit]),
select,
textarea { padding:0 0.75rem; background-color:var(--cl-wh); border:var(--cl-border) 1px solid; width:100%; font-size: 1.6rem; height: 4rem; font-family: inherit; border-radius: 0; }
textarea { padding:1.0rem 1.25rem; min-height:20rem; }
button { cursor: pointer; padding: 0; background: none; color: var(--cl-txt); width: 100%; font-size: inherit; }
input::placeholder,
textarea::placeholder { color:var(--cl-txtl); font-size: 0.8em; }
label { display: inline-block; width: fit-content; }
label:hover { cursor: pointer; }
select {}

@media print, screen and (min-width: 640px) {
input:not([type=radio],[type=checkbox],[type=submit]),
select,
textarea { height: 5rem; padding: 1rem 1.25rem; }
select:hover { cursor: pointer; }
}



/*----------------------------------------------------------------------------------------------------------------------------

utility & inview set

----------------------------------------------------------------------------------------------------------------------------*/

/* utility - base
---------------------------------------------------- */

/* utility - base responsive */
.u-inner { max-width: 116rem; margin: 0 auto; width: 90%; }
.u-inner._inner-min { max-width: 96rem; }
.u-wrapsect { padding: 7rem 0; }
.u-wrapsect:not(._bg-wave) + .u-wrapsect:not(._bg-wave) { padding-top: 0; }
.u-wrapsect._bg-wave { background-color: var(--cl-bg); }
.u-wrapblck { padding: 2rem 0; }
.u-only-pc	{ display: none; }

@media print, screen and (min-width: 640px) {
.u-inner { }
.u-wrapsect { padding: 11rem 0 14rem; }
.u-wrapblck { padding: 4rem 0; }
.u-only-sp	{ display: none !important; }
.u-only-pc	{ display: inherit; }
}


/* utility - base */
/*.u-ff01 { font-family: var(--ff01f); font-weight: var(--ff01w); }*/
.u-cl-txt { color: var(--cl-txt); }
.u-cl-wh { color: var(--cl-wh); }
.u-cl-key01 { color: var(--cl-key01); }
.u-cl-key02 { color: var(--cl-key02); }
.u-iframebox { position:relative; padding-bottom:56.25%; height:0; }
.u-iframebox iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.u-w30 { width: 30% !important; }
.u-w50 { width: 50% !important; }
.u-mt01 { margin-top: 1rem !important; }
.u-mt02 { margin-top: 2rem !important; }
.u-mt03 { margin-top: 3rem !important; }
.u-mb01 { margin-bottom: 1rem !important; }
.u-mb02 { margin-bottom: 2rem !important; }
.u-mb03 { margin-bottom: 3rem !important; }


/* utility - link
---------------------------------------------------- */

/* utility - linktxt */
.u-linktxt { display: inline-flex; /*color: var(--cl-linktxt);*/ text-decoration: underline; }
.u-linktxt._ar::after { content: ""; align-self: center; width: 0.8em; height: 0.8em; margin: 0 0.1em 0 0.25em; mask: url(/assets/images/common/ico_ar.svg) no-repeat center center / contain; /*background-color: var(--cl-linktxt);*/ }
/*.u-linktxt[target="_blank"]::after { content: ""; align-self: center; width: 0.8em; height: 0.8em; margin: 0 0.1em 0 0.25em; mask: url(/assets/images/common/ico_blank.svg) no-repeat center center / contain; }*/
.u-linktxt._linkfile::after { content: ""; align-self: center; width: 1em; height: 1em; margin: 0 0.1em 0 0.25em; mask: url(/assets/images/common/ico_file.svg) no-repeat center center / contain; /*background-color: var(--cl-linktxt);*/ }
.u-linktxt-back { display: inline-flex; color: var(--cl-txt); text-decoration: underline; }
.u-linktxt-back::before { content: ""; align-self: center; width: 0.8em; height: 0.8em; margin: 0 0.25em 0 0.1em; mask: url(/assets/images/common/ico_ar.svg) no-repeat center center / contain; background-color: var(--cl-txt); transform: rotate(180deg); }

@media print, screen and (min-width: 640px) {
.u-linktxt:hover,
.u-linktxt-back:hover { text-decoration: none; }
}



/* utility - linkbtn */
.u-linkbtn { display: grid; grid-template-columns: 1fr auto 1fr; column-gap: 0.5em; align-items: center; padding: 0 1em; color: var(--cl-linkbtn-txt); background-color: var(--cl-linkbtn-bg); border-radius: 0; width: 23rem; height: 6.4rem; border: var(--cl-linkbtn-bg) 1px solid; font-size: inherit; transition: 0.5s; }
.u-linkbtn::before { content: ""; transition: 0.5s; }
.u-linkbtn::after { content: ""; display: inline-grid; width: 1em; height: 1em; justify-self: end; mask: url(/assets/images/common/ico_ar.svg) no-repeat center center / contain; background-color: var(--cl-linkbtn-txt); transition: 0.5s; }

.u-linkbtn._rev {}
.u-linkbtn._rev::before { content: ""; display: inline-grid; width: 1em; height: 1em; mask: url(/assets/images/common/ico_ar.svg) no-repeat center center / contain; background-color: var(--cl-linkbtn-txt); rotate: 180deg; }
.u-linkbtn._rev::after { content: inherit; }

.u-linkbtn._back { color: var(--cl-linkbtn-bg); background-color: var(--cl-linkbtn-txt); }
.u-linkbtn._back::before { content: ""; display: inline-grid; width: 1em; height: 1em; mask: url(/assets/images/common/ico_ar.svg) no-repeat center center / contain; background-color: var(--cl-linkbtn-bg); rotate: 180deg; }
.u-linkbtn._back::after { content: inherit; }

.u-linkbtn._blank {  }
.u-linkbtn._blank::after { mask-image: url(/assets/images/common/ico_blank.svg) ; }


@media print, screen and (min-width: 640px) {
.u-linkbtn { width: 29rem; height: 6.4rem; }
.u-linkbtn:hover { color: var(--cl-linkbtn-bg); background-color: var(--cl-linkbtn-txt); }
.u-linkbtn:hover::after { background-color: var(--cl-linkbtn-bg); }
.u-linkbtn._rev:hover::before { background-color: var(--cl-linkbtn-bg); }
.u-linkbtn._back:hover { color: var(--cl-linkbtn-txt); background-color: var(--cl-linkbtn-bg); }
.u-linkbtn._back:hover::before { background-color: var(--cl-linkbtn-txt); }

}




/* iv-animation
---------------------------------------------------- */
.iv-fade { opacity:0; transition: 0.8s; }
.iv-fade._view { opacity:1; }
.iv-up_fade { opacity:0; transform:translate(0, 6rem); transition: 0.8s; }
.iv-up_fade._view { opacity:1; transform:translate(0, 0); }




/*----------------------------------------------------------------------------------------------------------------------------

base layout

----------------------------------------------------------------------------------------------------------------------------*/


/* header
--------------------------------------------------------------*/

/* header */
.header { position: fixed; z-index: 100; top: 0; padding: 0 2rem; height: var(--header-height); display: grid; align-items: center; background-color: var(--cl-wh); width: 100%; }
.header-logo { width: 10rem; }
.header-nav { display: none; }

@media print, screen and (min-width: 640px) {
.header { padding: 0 0 0 2rem; position: relative; display: grid; grid-template-columns: 28rem auto; gap: 2rem; }
.header-logo { width: 100%; }
.header-nav { display: block; }
.header-nav-gnav { display: flex; }
}


/* gnav */
@media print, screen and (min-width: 640px) {
.gnav { display: flex; justify-content: flex-end; gap: 3rem; }
.gnav-item { }
.gnav-item-link { display: flex; align-items: center; height: 9rem; font-size: 1.6rem; }
.gnav-item-link._contact { color: var(--cl-wh); background-color: var(--cl-bk); width: 22rem; justify-content: center; border: var(--cl-bk) 2px solid; transition: 0.5s; }
.gnav-item-link:hover { color: var(--cl-border); }
.gnav-item-link._contact:hover { color: var(--cl-bk); background-color: var(--cl-wh); }
.gnav-item-link._contact::before { content: ""; align-self: center; width: 1em; height: 1em; margin: 0 0.5em 0 0; mask: url(/assets/images/common/ico_mail.svg) no-repeat center center / contain; background-color: var(--cl-wh); }
.gnav-item-link._contact:hover::before { background-color: var(--cl-txt); }


}








/* footer
--------------------------------------------------------------*/

/* footer */
.footer {  }
.footer-map { filter: grayscale(100%); height: 20rem; padding-bottom: 0; }
.fnav { font-size: 1.4rem; margin-top: 4rem; }
.fnav-item { margin: 1.5rem 0; }
.fnav-item-link { }
.finfo { margin-top: 6rem; }
.finfo-logo { width: 16.8rem; }
.finfo-address { font-size: 1.2rem; margin-top: 1.5rem; }
.finfo-sns { margin-top: 2rem; }
.finfo-sns-item { display: inline-block; width: 3rem;}
.fcopy { font-size: 1.0rem; padding: 2rem 0 5rem; }

@media print, screen and (min-width: 640px) {
.footer { }
.footer-map { height: 40rem; }

.footer-row { display: flex; justify-content: space-between; flex-direction: row-reverse; margin-top: 9rem; }
.fnav { margin-top: -2rem; }
.fnav-item { margin: 2rem 0; font-size: 1.6rem; }
.fnav-item-link:hover { opacity: 0.3; }

.finfo { margin-top: 1.5rem; }
.finfo-logo { width: 35rem; }
.finfo-address { font-size: 1.4rem; line-height: 1.8; margin-top: 2rem; }
.finfo-sns { margin-top: 3rem; }
.fcopy { font-size: 1.2rem; text-align: right; margin-top: 4rem; }
}


.footer .c-cta-title::before { content: ""; display: block; width: 6rem; height: 6rem; margin: 0 auto 1rem; background: no-repeat center center / contain;}
@media print, screen and (min-width: 640px) {
.footer .c-cta-title::before { width: 8rem; height: 8rem; }
}



/* spitem
--------------------------------------------------------------*/

/* _spopen changes */
@media print, screen and  (max-width: 1023px) {
body._spopen { height: 100%; overflow: hidden; }
}


/* spnav-btn */
.spitem-btn { position: fixed; top: 0; right: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; background-color:var(--cl-bk); cursor: pointer; width: 6rem; height: 6rem; outline: none; transition:0.5s; z-index: 130; cursor: pointer;}
.spitem-btn::before,
.spitem-btn::after { content: ""; position: absolute; left: 50%; width: 2rem; height: 2px; background-color: var(--cl-wh); transform: translateX(-50%); transition:0.3s; }
.spitem-btn::before { top: 2rem; }
.spitem-btn::after  { bottom: 2rem; }
.spitem-btn-line { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 2rem; height: 2px; background-color: var(--cl-wh); transition: 0.3s; overflow: hidden; }

._close.spitem-btn { }
._close.spitem-btn::before,
._close.spitem-btn::after { content: ""; position: absolute; left: 50%; background-color:var(--cl-wh); transform: translateX(-50%); transition:0.3s; }
._close.spitem-btn::before { top: 50%; transform: translate(-50%,-50%) rotate(45deg) ; left: 50%; }
._close.spitem-btn::after  { bottom: auto; top: 50%; transform: translate(-50%,-50%) rotate(-45deg); left: 50%;}
._close.spitem-btn .spitem-btn-line { display: none; }

@media print, screen and (min-width: 640px) {
.spitem { display: none; }
.spitem-btn { display: none; }
}


/* spnav [wrap] */
.spmenu { opacity: 0; visibility: hidden; position: fixed; top: var(--header-height); right: 0; width: 100%; z-index: 100; transition: 0.3s; }
.spmenu._spopen { opacity: 1; visibility: visible; }
.spmenu-inner { width: 100%; height: calc(100vh - var(--header-height)); padding: 2rem 4rem 0; overflow-y: scroll; background-color: var(--cl-bk);}


/* spnavMenu */
.spnav { margin-top: 8rem;  }
.spnav-item { font-size: 1.6rem; }
.spnav-item-link { display: block; color: var(--cl-wh); padding: 1.75rem 0; line-height: 1; }
.spnav-item-link._contact { color: var(--cl-bk); background-color: var(--cl-wh); width: 100%; height: 6rem; display: flex; align-items: center; place-content: center; margin-top: 4rem; }
.spnav-item-link._contact::before { content: ""; align-self: center; width: 1em; height: 1em; margin: 0 0.5em 0 0; mask: url(/assets/images/common/ico_mail.svg) no-repeat center center / contain; background-color: var(--cl-txt); }





/* main contents
--------------------------------------------------------------*/
.main { min-height: 50vh; }
@media print, screen and (min-width: 640px) {
.main { }
}



/* pagetitle */
.pagetitle { position: relative; height: 21.6rem; }
.pagetitle-bg { position: absolute; width: 100%; }
.pagetitle-bg-pic { width: 100%; height: 21.6rem; object-fit: cover;}
.pagetitle-en { position: relative; font-size: 2.4rem; line-height: 1.1; letter-spacing: 0.1em; color: var(--cl-wh); font-weight: var(--ff-base-light); padding-top: 11.6rem; }
.pagetitle-jp { position: relative; font-size: 1.4rem; color: var(--cl-wh); font-weight: var(--ff-base-base); margin-top: 1rem; line-height: 1; }

@media print, screen and (min-width: 640px) {
.pagetitle { height: 30rem; }
.pagetitle-bg { }
.pagetitle-bg-pic { width: 100%; height: 30rem; object-fit: cover; }
.pagetitle-en { font-size: 5rem; padding-top: 12rem; }
.pagetitle-jp { font-size: 1.6rem; margin-top: 2rem; }
}






/*----------------------------------------------------------------------------------------------------------------------------

component

----------------------------------------------------------------------------------------------------------------------------*/




.c-cta { text-align: center;}
.c-cta-item { padding: 4rem; background: #ccc; color: var(--cl-wh);}
.c-cta-title { margin-bottom: 1rem; font-size: 1.6rem; font-weight: var(--ff-base-bold);}
.c-cta-item .u-linkbtn { margin: 2rem auto 0; background-color: var(--cl-wh); color: var(--cl-txt); font-weight: var(--ff-base-bold); }
.c-cta-item .u-linkbtn::after { background-color: var(--cl-txt);}
.c-cta-item._dl { background: url(/assets/images/common/cta_dl_bg.webp);}
.c-cta-item._dl .c-cta-title::before { background-image: url(/assets/images/common/cta_dl.svg);}
.c-cta-item._dl .u-linkbtn::after { mask-image: url(/assets/images/common/ico_dl.svg) ;}
.c-cta-item._contact { background: url(/assets/images/common/cta_contact_bg.webp);}
.c-cta-item._contact .c-cta-title::before { background-image: url(/assets/images/common/cta_mail.svg);}
@media print, screen and (min-width: 640px) {
.c-cta { display: grid; grid-template-columns: repeat(2,1fr);}
.c-cta-item { padding: 8rem 4rem; }
.c-cta-title { margin-bottom: 2rem; font-size: 2.4rem; }
.c-cta-item .u-linkbtn { margin-top: 3rem; font-size: 1.8rem; }
.c-cta-item .u-linkbtn:hover { opacity: 1; background-color: var(--cl-txt); color: var(--cl-wh); }
.c-cta-item .u-linkbtn:hover::after { background-color: var(--cl-wh); }

}



/* title
--------------------------------------------------------------*/

/* title - section */
.c-secttitle { margin-bottom: 4rem; text-align: center; }
.c-secttitle-sub { font-size: 3.2rem; line-height: 1.1; letter-spacing: 0.1em; color: var(--cl-key01); font-weight: var(--ff-base-light);  }
.c-secttitle-sub::after { content: ""; margin: 1rem auto 0; display: block; width: 4.4rem;  height: 0.8rem; background: url(/assets/images/common/secttitle_point.svg) no-repeat center center / contain;}
.c-secttitle._left { text-align: left; }
.c-secttitle._left .c-secttitle-sub::after { margin-inline: 0;}
.c-secttitle-main { font-size: 1.4rem; font-weight: var(--ff-base-base); margin-top: 1rem; line-height: 1.2; }
@media print, screen and (min-width: 640px) {
.c-secttitle { margin-bottom: 8rem; }
.c-secttitle-sub { font-size: 7rem; }
.c-secttitle-sub::after { margin-top: 2rem; }
.c-secttitle-main { font-size: 1.8rem; margin-top: 2rem; }
}

/* title - section lead title */
.c-sectleadtitle { display: grid; gap: 2rem; margin-bottom: 2rem; font-size: 2.4rem; }
.c-sectleadtitle::before { content: ""; display: block; width: 4.4rem; height: 1rem; background: url(/assets/images/common/secttitle_point.svg) no-repeat center center / contain; }

@media print, screen and (min-width: 640px) {
.c-sectleadtitle { display: flex; align-items: center; margin-bottom: 4rem; font-size: 3.2rem; line-height: 1.4; }
}

/* title - block title */
.c-blocktitle { margin: 2rem 0; font-size: 1.6rem; line-height: 1.3; letter-spacing: 0.1em; }
@media print, screen and (min-width: 640px) {
.c-blocktitle { margin: 6rem 0 3rem; font-size: 2.4rem; line-height: 1.1; }
}





/* title - utility */
.u-title-xl { font-size: 2.2em; line-height: 1.3; }
.u-title-lg { font-size: 1.8em; line-height: 1.3; }
.u-title-md { font-size: 1.5em; line-height: 1.3; }
.u-title-sm { font-size: 1.2em; line-height: 1.3; }
.u-title-pj { font-size: 2.0rem; font-weight: 700; }
.u-title-pj-sub { font-size: 1.3rem; font-family: var(--ff01f); font-weight: var(--ff01w); line-height: 1.2; color: var(--cl-key01); margin-top: 0 !important; }

@media print, screen and (min-width: 640px) {
.u-title-xl { font-size: 3.2em; }
.u-title-lg { font-size: 2.6em; }
.u-title-md { font-size: 2.0em; }
.u-title-sm { font-size: 1.4em; }

.u-title-pj { font-size: 3.0rem; font-weight: 700; }
.u-title-pj-sub { font-size: 1.6rem; }

}


/* breadcrumb
--------------------------------------------------------------*/
.c-breadcrumb { font-size: 1.2rem; margin-left: auto; text-align: right; }
.c-breadcrumb-item { position: relative; display: inline-block; }
.c-breadcrumb-item:not(:last-child) { padding-right: 1em; }
.c-breadcrumb-item:nth-child(3) { text-align: right; padding: 0; width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.c-breadcrumb-item:not(:last-child):before { content: ""; position: absolute; top: 0.5em; right: 0; display: block; width: 1rem; height: 1rem; mask: url(/assets/images/common/ico_ar.svg) no-repeat center right / contain; background-color: var(--cl-txt); }
.c-breadcrumb-link { }
.c-breadcrumb-item:not(:last-child) .c-breadcrumb-link { text-decoration: underline; }


@media print, screen and (min-width: 640px) {
.c-breadcrumb { font-size: 1.4rem; }

.c-breadcrumb-item:nth-child(3) { width: fit-content; overflow: inherit; }


}





/* table
--------------------------------------------------------------*/

/* c-grtb */
.c-grtb { }
.c-grtb-item { display: grid; padding: 1.5rem 0; border-top: var(--cl-border) 1px solid; }
.c-grtb-item:last-child { border-bottom: var(--cl-border) 1px solid; }
.c-grtb-item > * + * { margin-top: 0.5rem; }

@media print, screen and (min-width: 640px) {
.c-grtb-item { padding: 3rem 0; grid-template-columns: 18rem 1fr; }
.c-grtb-item > * + * { margin: 0; }

.c-grtb._grtb-s0-p1-2 > * { grid-template-columns: 1fr 2fr; }
.c-grtb._grtb-s0-p1-3 > * { grid-template-columns: 1fr 3fr; }
}

















/* layout
--------------------------------------------------------------*/

/* c-grid */
.c-grid { display: grid; gap: 1rem; }
.c-grid._grid-s1-1 { grid-template-columns: 1fr 1fr; }
.c-grid._grid-s1-2 { grid-template-columns: 1fr 2fr; }
.c-grid._grid-s1-3 { grid-template-columns: 1fr 3fr; }

@media print, screen and (min-width: 640px) {
.c-grid { gap: 4rem; }
.c-grid._grid-p1-1 { grid-template-columns: 1fr 1fr; }
.c-grid._grid-p1-2 { grid-template-columns: 1fr 2fr; }
.c-grid._grid-p1-3 { grid-template-columns: 1fr 3fr; }
.c-grid._grid-p2-1 { grid-template-columns: 2fr 1fr; }
.c-grid._grid-p2-3 { grid-template-columns: 2fr 3fr; }
.c-grid._grid-p3-1 { grid-template-columns: 3fr 1fr; }
.c-grid._grid-p3-2 { grid-template-columns: 3fr 2fr; }
.c-grid._grid-p1-1-1 { grid-template-columns: 1fr 1fr 1fr; }
.c-grid._grid-p1-1-1-1 { grid-template-columns: 1fr 1fr 1fr 1fr; }
.c-grid._rev > *:first-child { order: 2; }
.c-grid._rev > *:last-child { order: 1; }
.c-grid._rev._grid-p1-2 { grid-template-columns: 2fr 1fr; }
.c-grid._rev._grid-p1-3 { grid-template-columns: 3fr 1fr; }
.c-grid._rev._grid-p2-3 { grid-template-columns: 3fr 2fr; }
.c-grid._rev._grid-p2-1 { grid-template-columns: 1fr 2fr; }
.c-grid._rev._grid-p3-1 { grid-template-columns: 1fr 3fr; }
.c-grid._rev._grid-p3-2 { grid-template-columns: 2fr 3fr; }
}


/* mgbox */
.c-mgbox {}
.c-mgbox > *:not(:first-child) { margin-top: 1rem; }

@media print, screen and (min-width: 640px) {
.c-mgbox._mgp1 > *:not(:first-child) { margin-top: 1rem; }
.c-mgbox._mgp2 > *:not(:first-child) { margin-top: 2rem; }
.c-mgbox._mgp3 > *:not(:first-child) { margin-top: 3rem; }
.c-mgbox._mgp4 > *:not(:first-child) { margin-top: 4rem; }
}




/* news group
--------------------------------------------------------------*/

/* c-newscategory */
.newscategory { letter-spacing: 0.1em; }
.newscategory-title { font-size: 1.6rem; }
.newscategory-list { display: flex; flex-wrap: wrap; gap: 1.5rem 1.8rem; font-size: 1.2rem; margin: 1rem 0 3rem; }
.newscategory-item { border: var(--cl-wh) 2px solid; border-radius: 10rem; display: grid; place-content: center; width: 10rem; height: 4rem; transition: 0.5s; }
.newscategory-item._active { border: none; background-color: var(--cl-wh); color: var(--cl-bg); }
@media print, screen and (min-width: 640px) {
.newscategory-title { font-size: 1.8rem; }
.newscategory-list { font-size: 1.6rem; gap: 3rem; margin: 1rem 0 6rem; }
.newscategory-item { width: 13rem; height: 5rem; }
}




/* c-newslist */
.c-newslist { display: grid; grid-template-columns: 6.2em 8.4rem 1fr; grid-template-rows: auto auto; gap: 0.5rem 1em; padding: 2rem 0; border-bottom: var(--cl-border) 1px solid; transition: 0.5s; }
.c-newslist-date { letter-spacing: 0.11em; }
.c-newslist-category { display: grid; place-content: center; font-size: 1.2rem; color: var(--cl-bg); background-color: var(--cl-wh); height: 2.4rem; letter-spacing: 0.1em; }
.c-newslist-title { grid-area: 2 / 1 / 3 / 4; }
@media print, screen and (min-width: 640px) {
.c-newslist { grid-template-rows: auto; padding: 4rem 0; font-size: 1.8rem; }
.c-newslist:hover { background-color: var(--cl-bg-gr); }
.c-newslist-category { font-size: 1.4rem; height: 2.8rem; }
.c-newslist-title { grid-area: 1 / 3 / 2 / 4; }
}


/* c-newsdetail */
.c-newsdetail-titlebox { display: grid; grid-template-columns: 5.2em 8.4rem 1fr; grid-template-rows: auto auto; gap: 0.5rem 1em; padding: 2rem 0; border-bottom: var(--cl-border) 1px solid; }
.c-newsdetail-titlebox-date {}
.c-newsdetail-titlebox-category { display: grid; place-content: center; font-size: 1.2rem; color: var(--cl-bg); background-color: var(--cl-wh); height: 2.4rem; letter-spacing: 0.1em; }
.c-newsdetail-titlebox-title { grid-area: 2 / 1 / 3 / 4; font-size: 2.4rem; font-weight: var(--ff-base-base); line-height: 1.25; }
@media print, screen and (min-width: 640px) {
.c-newsdetail-titlebox { grid-template-rows: auto; padding: 4rem 0; }
.c-newsdetail-titlebox-date {}
.c-newsdetail-titlebox-category { font-size: 1.4rem; height: 2.8rem; }
.c-newsdetail-titlebox-title { font-size: 4rem; }
}


.c-newsdetail-article { padding: 2rem 0 3rem; }
.c-newsdetail-article > * + * { margin-top: 2rem; }
.c-newsdetail-article a { text-decoration: underline; color: var(--cl-key01); }
.c-newsdetail-article h2 { font-size: 1.6em; font-weight: var(--ff-base-base); margin-top: 6rem; }
.c-newsdetail-article h3 { font-size: 1.4em; font-weight: var(--ff-base-base); margin-top: 4rem; }
.c-newsdetail-article ul { padding-left: 1.5em; }
.c-newsdetail-article ul li { list-style-type: disc; }
@media print, screen and (min-width: 640px) {
.c-newsdetail-article { padding: 4rem 0 8rem; }
.c-newsdetail-article > * + * { margin-top: 4rem; }
.c-newsdetail-article a:hover { text-decoration: none; }
.c-newsdetail-article h2 { margin-top: 8rem; }
.c-newsdetail-article h3 { margin-top: 6rem; }
}


/* c-cardlist */
.c-cardlist { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem 0.7rem; }
.c-cardlist-link {}
.c-cardlist-img { position: relative; width: 100%; height: auto; aspect-ratio: 16 / 9; border-radius: 0.5rem; overflow: hidden; background-color: var(--cl-bg);}
.c-cardlist-img-pic { position: absolute; top: 0; left: 0; object-fit: contain; width: 100%; height: 100%; }
.c-cardlist-title { text-align: center; margin-top: 1rem; }
@media print, screen and (min-width: 640px) {
.c-cardlist { grid-template-columns: 1fr 1fr 1fr; gap: 6rem 2.5rem; }
.c-cardlist-img-pic {transition: 0.5s; }
.c-cardlist-link:hover .c-cardlist-img-pic { scale: 1.1; }
.c-cardlist-title { margin-top: 2rem; }
}



.c-pagenav {}
.c-pagenav-item { display: grid; grid-template-columns: 1fr max-content; align-items: center; padding: 1rem 0; border-top: var(--cl-border) 1px solid; font-weight: var(--ff-base-bold);}
.c-pagenav-item::after { content: ""; display: block; width: 0.8em; height: 0.8em; mask: url(/assets/images/common/ico_ar.svg) no-repeat center center / contain; background-color: var(--cl-txt); transform: rotate(90deg);}
.c-pagenav-item:last-of-type { border-bottom: var(--cl-border) 1px solid; }
@media print, screen and (min-width: 640px) {
.c-pagenav { border-bottom: var(--cl-border) 1px solid;}
.c-pagenav-wrap { display: flex; justify-content: center; }
.c-pagenav-item { width: 100%; margin-bottom: 4rem; padding: 0; grid-template-columns: 1fr; gap: 1rem; border-top: none; text-align: center; border-right: var(--cl-border) 1px solid;}
.c-pagenav-item::after { margin: 0 auto;}
.c-pagenav-item:last-of-type { border: none; }

}






/* policy group
--------------------------------------------------------------*/

/* c-policybox */
.c-policybox { padding: 2.5em 0; border-bottom: var(--cl-border) 1px solid; }
.c-policybox-title { font-weight: var(--ff-base-bold); }
.c-policybox-txt { margin-top: 0.8em; }
._noborder.c-policybox { border-bottom: none; }
@media print, screen and (min-width: 640px) {
}


/* form group
--------------------------------------------------------------*/

/* required - utility */
.u-req { color: var(--cl-error); margin-left: 0.5em; }




/* c-formthanks */
.c-formthanks { }
.c-formthanks-title { text-align: center; }
.c-formthanks-title::before { content: ""; display: block; margin: auto; width: 2em; height: 2em; mask: url(/assets/images/common/ico_mail.svg) no-repeat center center / contain; background-color: var(--cl-wh); opacity: 0.3; }
.c-formthanks-txt { font-style: 1.2em; margin-top: 2em; }
.c-formthanks-ex { font-size: 0.8em; margin-top: 1em; }
.c-formthanks-notice { border: var(--cl-border) 1px solid; padding: 1em; margin-top: 1em; }
.c-formthanks-btn { margin: 3em auto; display: flex; justify-content: center; }

@media print, screen and (min-width: 640px) {
.c-formthanks { }
.c-formthanks-txt { text-align: center; margin-top: 4em; }
.c-formthanks-ex { text-align: center; }
.c-formthanks-notice { padding: 3em; text-align: center; margin: 3em auto 0; width: fit-content; }
.c-formthanks-btn { margin: 4em auto; }
}


/* page-404
--------------------------------------------------------------*/
.notfound {}
.notfound-title { text-align: center; font-size: 2.4rem; }
.notfound-txt { font-style: 1.2em; margin-top: 2em; }
.notfound-btn { margin: 3em auto; display: flex; justify-content: center; }

@media print, screen and (min-width: 640px) {
.notfound-title { font-size: 4rem; }
.notfound-txt { text-align: center; margin-top: 4em; }
.notfound-btn { margin: 4em auto; }
}





/*----------------------------------------------------------------------------------------------------------------------------

page unique

----------------------------------------------------------------------------------------------------------------------------*/

.breadcrumb { padding-top: 3rem; }
@media print, screen and (min-width: 640px) {
.breadcrumb { padding-top: 5rem; }
}





/* page-about
--------------------------------------------------------------*/
/* message */
.message {}
.message-row {}
.message-txt {}
.message-pic { width: 23rem; margin: 4rem auto 0; }
.message-name { margin-top: 2.5rem; font-size: 1.4rem; text-align: center; }
.message-name span { font-size: 2.4rem; }

@media print, screen and (min-width: 640px) {
.message-row { display: grid; gap: 0 8rem; grid-template-columns: 1fr 1.2fr;  }
.message-pic { width: 100%; margin: 0; grid-area: 1 / 2 / 3 / 3; }
.message-name { display: grid; gap: 2rem; grid-template-columns: max-content 1fr; align-items: center; font-size: 1.6rem; text-align: left; }
.message-name span { font-size: 3.2rem; }
}






/* page-works
--------------------------------------------------------------*/
.page-works main { position: relative; background: linear-gradient(180deg, var(--cl-bg) 0%, var(--cl-bg) 60%, var(--cl-bg-dark) 60%, var(--cl-bg-dark) 100%); }
.page-works main::before { content: ""; position: absolute; top: 42%; width: 100%; height: calc(7rem + 20%); background: url(/assets/images/common/bg_wave.svg) no-repeat center 60% / 100%; }

@media print, screen and (min-width: 640px) {

.page-works main::before { height: calc(11rem + 20%); }
}





/* page-worksdetail
--------------------------------------------------------------*/
.page-worksdetail main { background-color: var(--cl-bg-dark); }









/* page-contact
--------------------------------------------------------------*/
.contact-leadbox { margin-bottom: 6em; }
.contact-lead {}
.contact-ex01 { color: var(--cl-error); font-size: 1.4rem; margin-top: 0.5em; }
.contact-ex02 { font-size: 1.2rem; margin-top: 2.5em; }
.contact-privacy { text-decoration: underline; }

.errTitle { margin-bottom: 1rem; }
.error { margin-bottom: 2rem; display: flex; gap: 1rem 2rem; flex-wrap: wrap;}
.error li { padding: 0 1rem; border-radius: 2rem; font-size: 1.4rem; color: var(--cl-error); border: var(--cl-error) 1px solid;}


@media print, screen and (min-width: 640px) {
.contact select,
.contact input[type="tel"],
.contact input[type="text"] { max-width: 37rem; }
.contact-ex01 { font-size: 1.6rem; }
.contact-ex02 { font-size: 1.4rem; }
.contact-privacy:hover { text-decoration: none; }

.error { margin-bottom: 4rem;}

}





.contact-agreetext { padding: 2rem 0; }
.contact-submit { margin: 3rem auto; display: flex; place-content: center; }
.contact-submit input { border: var(--cl-linkbtn-bg) 1px solid; }
.contact-backlink { margin: 3rem auto; display: flex; place-content: center; }
.contact-backlink input { background-color: inherit; }

@media print, screen and (min-width: 640px) {
.contact-agreetext { padding: 3rem 0; text-align: center; }
.contact-submit { margin: 6rem auto; }
.page-contact .c-dltb { grid-template-columns: 1fr 2fr; }

}




/*----------------------------------------------------------------------------------------------------------------------------

home

----------------------------------------------------------------------------------------------------------------------------*/

a:has(.u-link-image):hover { opacity: 1;}
a:has(.u-link-image) .u-link-image { overflow: hidden;}
a:has(.u-link-image) .u-link-image img { transition: 0.5s;}
a:has(.u-link-image):hover .u-link-image img { transform: scale(1.1);}
.floating { position: fixed; bottom: 4rem; right: 0; z-index: 10;}
.floating.u-only-sp { bottom: 0; width: 100%; padding: 1.5rem; background-color: #ffb703; font-weight: var(--ff-base-bold); text-align: center;}
.floating.u-only-sp::after { position: absolute; top: 50%; right: 2rem; transform: translate(0,-50%); content: ""; display: block; width: 0.8em; height: 0.8em; background: url(/assets/images/common/ico_ar.svg) no-repeat center center / contain;}

.home-kv { overflow: hidden;}
.home-kv-catch { padding: 6rem 4rem 2rem 1rem;}
.home-kv-slider { position: relative; margin-right: calc(((100vw - 100%) / 2)* -1);}
.home-kv-slider2 { margin-right: calc(((100vw - 100%) / 2)* -1)   }
.home-kv-slider-txt { position: relative; padding: 2rem 2rem 1rem; background-color: var(--cl-bg);}
.home-kv-slider-txt > p { display: flex; gap: 1rem; align-items: center; font-size: 1.1rem; font-weight: var(--ff-base-bold);}
.home-kv-slider-txt > p::before { content: ""; margin: 0.5rem 0; display: block; width: 2.4rem; height: 0.8rem; background: url(/assets/images/common/secttitle_point.svg) no-repeat center center / contain;}

#swiper1 {}
#swiper1 .swiper-slide { width: 100%; height: auto; aspect-ratio: 1/1; background-color: var(--cl-bg);}
#swiper1 .swiper-slide a:hover { opacity: 1; }
#swiper1 .swiper-slide img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
#swiper2 { padding-bottom: 3rem;}
#swiper2 .swiper-slide { display: flex; align-items: center; justify-content: space-between; font-size: 1.6rem; background-color: var(--cl-bg); font-weight: var(--ff-base-bold);}
#swiper2 .swiper-slide::after { content: ""; display: block; width: 0.8em; height: 0.8em; mask: url(/assets/images/common/ico_ar.svg) no-repeat center center / contain; background-color: var(--cl-txt);}
#swiper2 .swiper-pagination { position: absolute; bottom: 0; left: 0; text-align: left;}
#swiper2 .swiper-pagination-bullet-active { background-color: var(--cl-txt);}

@media print, screen and (min-width: 640px) {
.home-kv { position: relative; }
.home-kv-catch { position: absolute; top: 8rem; left: 50%; transform: translateX(-50%); width: 1160px; padding: 0; z-index: 10; }
.home-kv-catch img { max-width: 40.52%; }
.home-kv-slider { max-width: 97.41%; margin: 0 calc(((100vw - 100%) / 2)* -1) 0 auto; padding-bottom: 7.5rem; }
.home-kv-slider2 { width: 116rem; position: absolute; bottom: 0; margin: 0; left: 50%; transform: translateX(-50%); z-index: 10;   }
.home-kv-slider-txt { max-width: 40rem; padding: 3rem 3rem 2.5rem; z-index: 10;}
.home-kv-slider-txt > p { font-size: 1.4rem;}

#swiper1 .swiper-slide { aspect-ratio: 16/9;}
#swiper2 .swiper-slide { font-size: 2.4rem; }




}


.home-features .u-linkbtn { margin-top: 4rem; }
.home-features .lead-title span { background-color: var(--cl-bg); }
.home-features-pic { margin-left: calc(((100vw - 100%) / 2)* -1); }
@media print, screen and (min-width: 640px) {
.home-features-rows { display: flex; justify-content: space-between;  }
.home-features-rows > * { width: 48%; }
.home-features-pic { width: calc(48% + ((100vw - 100%) / 2)); margin-right: calc(((100vw - 100%) / 2)* -1); }
}


.home-products .u-linkbtn,
.home-youtube .u-linkbtn { margin: 4rem auto 0; }
.home-products { border-bottom: var(--cl-border) 1px solid;}
.home-products .c-grid {}
.home-products .c-grid a { display: block;}
.home-products .c-grid a > p { margin-top: 1rem; font-weight: var(--ff-base-bold);}
.home-youtube.u-wrapsect { padding: 7rem 0 !important; }

@media print, screen and (min-width: 640px) {

.home-products .u-linkbtn,
.home-youtube .u-linkbtn { margin: 6rem auto 0; }
.home-youtube.u-wrapsect { padding: 11rem 0 14rem !important; }
}


/*----------------------------------------------------------------------------------------------------------------------------

features

----------------------------------------------------------------------------------------------------------------------------*/

.lead-box { margin-top: 2rem;}
.lead-title { font-size: 2.4rem;}
.lead-title span { display: inline-block; margin-right: 1rem; font-size: 3rem; padding: 0 0.5rem; background-color: var(--cl-wh); line-height: 1.2;}
.lead-title + p { margin-top: 2rem;}
@media print, screen and (min-width: 640px) {
.lead-title { font-size: 3.2rem; }
.lead-title span { margin-right: 1rem; font-size: 4rem; padding: 0.5rem 1rem; }
.lead-title + p { margin-top: 3rem;}
}


.example { margin-top: 2rem; }
.example._bg { padding: 2rem; background-color: var(--cl-bg);}
.example .c-blocktitle { margin-top: 0; text-align: center;}
.example .c-grid > div > p { margin-top: 1rem; font-weight: var(--ff-base-bold);}
.example .c-grid div > div { position: relative; width: 100%; height: auto; aspect-ratio: 16 / 9; border-radius: 0.5rem; overflow: hidden; background-color: var(--cl-wh);}
.example .c-grid div > div img { position: absolute; top: 0; left: 0; object-fit: contain; width: 100%; height: 100%; }
.example .c-grid > div > p + p { margin-top: 0; font-weight: var(--ff-base); }
.features div + .c-grid._grid-p1-1 { margin-top: 2rem; }
@media print, screen and (min-width: 640px) {
.example { margin-top: 6rem; }
.example._bg { padding: 6rem; }
.example .c-grid p { margin-top: 1rem; font-size: 1.4rem;}
.example .c-grid > div > p + p { font-size: 1.4rem; line-height: 1.6; }
.features div + .c-grid._grid-p1-1 { margin-top: 4rem; }

}


/*----------------------------------------------------------------------------------------------------------------------------

company

----------------------------------------------------------------------------------------------------------------------------*/

.permission .c-grtb-item { grid-template-columns: 1fr;}
.permission .c-grtb-item dt { font-weight: var(--ff-base-bold);}



/*----------------------------------------------------------------------------------------------------------------------------

case

----------------------------------------------------------------------------------------------------------------------------*/

.btn-dl { display: block; margin-bottom: 3rem; padding: 1rem; font-size: 1.6rem; font-weight: var(--ff-base-bold); color: var(--cl-wh); background: url(/assets/images/common/cta_dl_bg.webp) no-repeat center center / cover; text-align: center; line-height: 1.4;}
.btn-dl span { display: flex; align-items: center; gap: 1rem; justify-content: center; padding: 3rem 2rem; border: var(--cl-wh) 1px solid;}
.btn-dl span::after { content: ""; display: block; width: 1em; height: 1em; mask: url(/assets/images/common/ico_ar.svg) no-repeat center center / contain; background-color: var(--cl-wh);}
@media print, screen and (min-width: 640px) {
.btn-dl { font-size: 2rem; }
.btn-dl span { padding: 5rem 2rem;}
}


.case-detail .c-grid p { margin-top: 0.5rem;}
.case-detail .c-grid div > div { position: relative; width: 100%; height: auto; aspect-ratio: 16 / 9; border-radius: 0.5rem; overflow: hidden; background-color: var(--cl-bg);}
.case-detail .c-grid div > div img { position: absolute; top: 0; left: 0; object-fit: contain; width: 100%; height: 100%; }
.case-detail .movie-item { }
.case-detail .movie-item h4 { background-color: var(--cl-bg); padding: 1em; }
.case-detail .movie-item + .movie-item { margin-top: 4rem; }
.case-detail .movie-wrap { margin-top: 1.5rem; position: relative; width: 100%; height: 0; padding-bottom: 50%; background-color: #000; }
.case-detail .movie-wrap video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; }
.case-detail .movie-wrap + p { margin-top: 1.5rem; }


@media print, screen and (min-width: 640px) {
.case-detail .c-grid p { margin-top: 1rem; font-size: 1.4rem;}
.case-detail .movie-item + .movie-item { margin-top: 6rem; }
.case-detail .movie-item h4 { font-size: 1.8rem; }

}


/*----------------------------------------------------------------------------------------------------------------------------

product

----------------------------------------------------------------------------------------------------------------------------*/

.product-info { display: grid; gap: 2rem; }
.product-info ul {  }
.product-info ul li { }
.product-info ul li + li { margin-top: 1rem; }
.product-info figcaption { margin-top: 0.5rem; font-size: 1.2rem; text-align: right; }
.product-spec { margin-top: 2rem;}
.product-spec dl { display: grid; grid-template-columns: 1fr 1fr; }
.product-spec dl > * { padding: 0.5rem 1rem; border: var(--cl-border) 1px solid; }
.product-spec dl + dl { margin-top: -1px; }
.product-spec dl dt { background-color: var(--cl-bg); }
.product-spec dl dd { margin-left: -1px; }
.products .u-linkbtn { margin: 3rem auto 0;}
@media print, screen and (min-width: 640px) {
.product-info { grid-template-columns: 1fr 1fr; gap: 4rem; }
.product-info figcaption { font-size: 1.4rem; }
.product-spec { display: grid; grid-template-columns: repeat(2,1fr); margin-top: 4rem;}
.product-spec dl { grid-template-columns: 1fr 2fr; }
.product-spec dl > * { padding: 1rem 1.5rem; }
.product-spec dl:nth-child(2) { margin-top: 0; }
.product-spec dl:nth-child(even) { margin-left: -1px; }
.products .u-linkbtn { margin-top: 4rem; }
.products .u-linkbtn::after { mask-image: url(/assets/images/common/ico_dl.svg);}

}


/*----------------------------------------------------------------------------------------------------------------------------

wordpress setting

----------------------------------------------------------------------------------------------------------------------------*/


.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; }


.mw_wp_form .error { color: var(--cl-error) !important; }


/* c-pagination */
.navigation { margin-top: 3rem; }
.navigation .nav-links { display: flex; justify-content: center; gap: 1em; font-size: 1.4rem; }
.navigation .page-numbers { width: 4rem; height: 4rem; display: gird; place-content: center; text-align: center; opacity: 0.4; }
.navigation .page-numbers.current { opacity: 1; }
.navigation .page-numbers .c-pagination-icon { padding: 1.2rem; }
.navigation .page-numbers.prev .c-pagination-icon { transform: rotate(180deg); }
@media screen and (min-width: 640px) {
.navigation { margin-top: 10rem; }
.navigation .nav-links { gap: 2em; font-size: 1.8rem; }
.navigation a.page-numbers:hover { opacity: 1; }
}