@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: 100%; }
li { list-style-type:none;}
img { max-width: 100%; height: auto; display: block; }
header,footer,main,aside,picture { display: block; }

/* form parts reset */
textarea { font: inherit; appearance: none; }
/*input,button,select { font: inherit; appearance: none; }*/
select { border: none; outline: none; /*background: transparent;*/ }
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 */
@media print {
body { width:1400px; transform: scale(0.8); transform-origin: 0 0; }
}






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

/* color */
:root {
--cl-key: #004622;
--cl-txt: #333333;
--cl-bk: #000000;
--cl-wh: #ffffff;
--cl-bggr: #f2f2f2;
--cl-gr: #cccccc;
--cl-error: #be272d;
}




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

base set

--------------------------------------------------------------*/
html { font-size:calc(100vw / 37.5); scroll-behavior: smooth; scroll-padding-top: 10rem; }
body {  min-height: 100vh; text-rendering: optimizeSpeed; line-height: 1.6; -webkit-text-size-adjust:100%; text-size-adjust: 100%; color: var(--cl-txt); font-size: 1.4rem; font-family: YakuHanJPs, 'Noto Sans JP', sans-serif; font-weight: 400; overflow-wrap: anywhere; overflow-x: hidden; background-color: var(--cl-wh); letter-spacing: 0.06em; }
a { color: var(--cl-txt); outline:none; text-decoration:none; }
a[href$=".pdf"] { display: inline-flex; align-items: center; text-decoration: underline;}
a[href$=".pdf"]::before { content: ""; display: inline-block; align-items: center; width: 1.5em; height: 1.5em; background: url(/assets/images/common/ico_pdf_bl.svg) no-repeat center / contain; margin-right: 0.5rem;}

@media print, screen and (min-width: 640px) {
html { font-size: calc(100vw / 102.4);  }
body { font-size: 1.6rem; line-height: 1.75; }
a[href*="tel:"] { pointer-events: none; cursor: default; text-decoration: none; }
}
@media print, screen and (min-width: 1024px) {
html { font-size: 62.5%; scroll-padding-top: 12rem; }
a { transition: 0.5s; }
a:hover { opacity: 0.7; }
button:hover { opacity: 0.7; }
}


/* form set */
input:not([type=radio],[type=checkbox]),
select,
textarea { padding:0 0.75rem; color: var(--cl-txt); background-color:var(--cl-wh); border-radius: 1rem; border:var(--cl-gr) 1px solid; width:100%; font-size: 1.6rem; height: 4rem; font-family: inherit; appearance: none; }
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 { font-size: 0.8em; }
label { display: inline-block; width: fit-content; }
label:hover { cursor: pointer; }

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



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

utility

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

/* utility */
.u-inner { width: 100%; max-width: 118rem; margin: 0 auto; padding: 0 2rem; }
.u-inner._min { max-width: 80rem; }
.u-ff01 { font-family: 'Noto Sans', 'Noto Sans JP', sans-serif; font-weight: 700; }
.u-ff02 { font-family: 'Noto Serif JP', serif; font-weight: 600; }
.u-only-pc	{ display: none; }
.u-txt-indent { text-indent: -1em; margin-left: 1em; display: inline-block;}
.u-tac { text-align: center;}
.u-tar { text-align: right;}
.u-cl-key { color: var(--cl-key);}
.u-fw-b { font-weight: bold;}

@media print, screen and (min-width: 640px) {
.u-inner { padding: 0 4rem; }
.u-tac-pc { text-align: center;}
.u-only-sp	{ display: none; }
.u-only-tab { display: block !important;}
.u-only-pc	{ display: none;}
}
@media print, screen and (min-width: 1024px) {
.u-only-tab { display: none !important;}
.u-only-pc	{ display: block !important;}

}



/* utility - linkbtn */
.u-btn { text-align: center;}
.u-btn a { position: relative; width: 100%; position: relative; display: block; padding: 2rem 1.5rem; color: var(--cl-txt); border: var(--cl-txt) 1px solid; transition: 0.3s; }
.u-btn a::before { position: absolute; top: 50%; right: 1.5rem; transform: translate(0,-50%); content: ""; display: block; width: 1rem; height: 1rem; background-color: var(--cl-key); border-radius: 50%; transition: 0.3s; }

.u-btn._wh {}
.u-btn._wh a { color: var(--cl-wh); border-color: var(--cl-wh) ; }
.u-btn._wh a::before { background-color: var(--cl-wh); }


@media print, screen and (min-width: 640px) {
.u-btn { max-width: 34rem;}
.u-btn a { padding: 2.4rem 1.5rem;  }
.u-btn a::before { right: 3rem; z-index: 2; }
.u-btn a::after { position: absolute; top: 50%; right: 0.9rem; transform: translate(0,-50%); content: ""; display: block; width: 5rem; height: 5rem; background: url(/assets/images/common/ar_btn_wh.svg) no-repeat center / 1.4rem; z-index: 1; transition: 0.3s; opacity: 0; }
.u-btn a:hover { opacity: 1;  }
.u-btn a:hover::before { transform: translate(0,-50%) scale(5);}
.u-btn a:hover::after { z-index: 3; opacity: 1; }

.u-btn._wh a::after { background-image: url(/assets/images/common/ar_btn_key.svg); }

}


/* utility - title */
.u-title-en { color: var(--cl-key); }
.u-title-en._size_s {  }
.u-title-en._size_m { font-size: 2rem; }
.u-title-ja { font-size: 2rem;}
.u-title-en + p,
.u-title-en + .u-title-lead { margin-top: 3rem;}
.u-title-en + .u-title-ja { margin-top: 3rem; }
.u-title-en span { display: block; font-size: 1.4rem;}

.u-title-ja + p,
.u-title-ja + .u-title-lead  { margin-top: 2.5rem;}

@media print, screen and (min-width: 640px) {
.u-title-en._size_s { font-size: 1.6rem; }
.u-title-en._size_m { font-size: 2.6rem; }
.u-title-ja { font-size: 2.6rem;}
.u-title-en + p,
.u-title-en + .u-title-lead { margin-top: 5.5rem;}
.u-title-en + .u-title-ja { margin-top: 4.5rem; }
.u-title-en span { display: inline; }
.u-title-ja + p,
.u-title-ja + .u-title-lead  { margin-top: 4rem;}
}



.u-title-lead > p + p { margin-top: 1rem;}
@media print, screen and (min-width: 640px) {
.u-title-lead > p + p { margin-top: 2rem;}
}



/* utility - margin */
.u-mt10-10 { margin-top: 1rem; }
.u-mt10-20 { margin-top: 1rem; }
.u-mt20-20 { margin-top: 2rem; }
.u-mt20-40 { margin-top: 2rem; }
.u-mt30-30 { margin-top: 3rem; }
.u-mt30-60 { margin-top: 3rem; }

@media print, screen and (min-width: 1024px) {
.u-mt10-20 { margin-top: 2rem; }
.u-mt20-40 { margin-top: 4rem; }
.u-mt30-60 { margin-top: 6rem; }
}


.u-cl-key { color: var(--cl-key);}
.u-cl-wh { color: var(--cl-wh);}
.u-inner-over { margin: 0 calc(((100vw - 100%) / 2) * -1) ;}
.u-txt-link { display: inline-block; text-decoration: underline; text-underline-offset: 0.2em;}
.u-link-blank { display: inline-flex; gap: 0.5rem; align-items: center;}
.u-link-blank::after { content: ""; display: block; width: 0.8em; height: 0.8em; background: url(/assets/images/common/ico_bloank_bk.svg) no-repeat center / contain;}
.u-txt-ex { font-size: 1.2rem;}
.u-bottomLine {}
.u-bottomLine::after { content: ""; display: block; width: 1rem; height: 2px; background-color: var(--cl-key); margin: 2rem 0;}

.u-youtube { position: relative; height: 0; padding-bottom: 50%;}
.u-youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}

@media print, screen and (min-width: 1024px) {
.u-txt-ex { font-size: 1.4rem;}

}



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

component

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

/* page component
--------------------------------------------------------------*/

/* pageTitle */
.c-pageTitle { position: relative; padding-top: 5rem; }
.c-pageTitle-inner { margin: 0 auto; padding: 0 2rem; }
.c-pageTitle-box { }
.c-pageTitle-sub { margin-top: 1rem; color: var(--cl-key); text-transform: uppercase;}
.c-pageTitle-main { font-size: 2rem; font-weight: 600; }
.c-pageTitle-pic { position: relative; height: 0; margin: 3rem -2rem 0 0; padding-bottom: 50%;}
.c-pageTitle-pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.c-pageLead { margin-top: 3rem;}
.c-pageLead-title { font-size: 2rem;}
.c-pageLead-title + p { margin-top: 1.5rem;}
.c-pageLead-pic { margin: 2.5rem -2rem 0 0;}

.c-pageTitle-s { padding-bottom: 3rem; border-bottom: var(--cl-gr) 1px solid;}
@media print, screen and (min-width: 640px) {
.c-pageTitle { padding-top: 12rem; }
.c-pageTitle-main { font-size: 3.2rem; }
.c-pageTitle-sub { margin-top: 1.5rem;}
.c-pageTitle-pic { margin: 6rem calc(((100vw - 100%) / 2) * -1) 0 0; padding-bottom: 36.4%;}
.c-pageTitle-pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.c-pageLead { display: grid; gap: 4rem; grid-template-columns: 1fr 1.8fr; margin: 6rem calc(((100vw - 100%) / 2) * -1) 0 0;}
.c-pageLead-title { font-size: 2.4rem;}
.c-pageLead-title + p { margin-top: 3rem;}
.c-pageLead-pic { margin: 0 0 0 0;}
.c-pageTitle-s { padding-bottom: 8rem;}
.c-content .c-pageLead { margin-top: 0;}

}
@media print, screen and (min-width: 1024px) {
.c-pageLead-title + p { margin-top: 4rem;}

}



/* セクション */
.c-content { margin: 0 0 6rem; }
.c-content:has(.c-secbg:last-child) { margin-bottom: 0; }
.c-secwrap { padding: 6rem 0; }
.c-secwrap + .c-secwrap { padding: 6rem 0; }
.c-secwrap:not(.c-secbg) + .c-secwrap:not(.c-secbg) { margin-top: -6rem;  }
.c-secwrap:last-child:not(.index-lead) { padding-bottom: 0; }
.c-boxwrap { padding: 0 0 6rem; }
.c-boxwrap + .c-boxwrap { margin-top: -6rem; padding: 6rem 0; }
.c-boxwrap:last-child { padding-bottom: 0; }
.c-boxwrap + .c-boxwrap.c-wrapLine { margin-top: 0; border-top: var(--cl-gr) 1px solid;}

@media print, screen and (min-width: 640px) {
.c-content { margin: 0 0 14rem;  }
.c-secwrap { padding: 12rem 0; }
.c-secwrap:not(.c-secbg) + .c-secwrap:not(.c-secbg) { margin-top: -12rem;  }
.c-secwrap + .c-secwrap { padding: 12rem 0; }
.c-boxwrap { padding: 0 0 10rem; }
.c-boxwrap + .c-boxwrap { margin-top: -10rem; padding: 10rem 0; }
.c-boxwrap:last-child { padding-bottom: 0; }

}



/* bgWrap */
.c-bgWrap { padding: 6rem 0; background: #545454 no-repeat center / cover;}

@media print, screen and (min-width: 640px) {
.c-bgWrap { padding: 10rem 0;}
.c-bgWrap .u-inner > *:not(.u-btn) { max-width: 66rem;}
}


/* c-menuList */
.c-menuList { }
.c-menuList-item { }
.c-menuList-item a { display: grid; align-items: center; gap: 2rem; grid-template-columns: repeat(2,1fr); padding-inline: 0 2rem;}
.c-menuList-item + .c-menuList-item { }
.c-menuList-pic { position: relative; height: 0; padding: 0 0 100% 0; overflow: hidden;}
.c-menuList-pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: 0.3s;}
.c-menuList-title { }
.c-menuList-title + p { margin-top: 0.5rem; font-size: 1.3rem;}

@media print, screen and (min-width: 640px) {
.c-menuList { display: grid; grid-template-columns: repeat(3,1fr); }
.c-menuList.companyidx { display: grid; grid-template-columns: repeat(4,1fr); }
.c-menuList-item a { display: block; padding-inline: 0;}
.c-menuList-pic { padding: 0 0 37rem 0;}
.c-menuList-info { padding: 2rem 3rem 5rem; transition: 0.3s;}
.c-menuList-item a:hover { opacity: 1;}
.c-menuList-item a:hover .c-menuList-info { background-color: var(--cl-bggr);}
.c-menuList-item a:hover .c-menuList-pic img { transform: scale(1.2);}

.c-menuList._box4 { grid-template-columns: repeat(4,1fr); }
.c-menuList._box4 .c-menuList-pic { padding: 0 0 24rem 0;}

}



/* c-colwrap */
.c-colwrap { }
.c-colwrap-item { margin-top: 2rem;}

@media print, screen and (min-width: 640px) {
.c-colwrap { display: grid; gap: 4rem; grid-template-columns: 1fr 65.5%; }
.c-colwrap-item { margin-top: 0.5rem;}
}


/* c-list */
.c-list { }
.c-list dl { padding: 2rem 0; border-top: var(--cl-gr) 1px solid; }
.c-list dl:last-of-type { border-bottom: var(--cl-gr) 1px solid; }
.c-list dl dt { font-weight: 600; }
.c-list dl dd { }
.c-list dl dd p + p { margin-top: 1rem; }

@media print, screen and (min-width: 640px) {
.c-list dl { display: grid; grid-template-columns: 20rem 1fr; padding: 3rem 0; }
.c-list dl dt { font-weight: 400; }
.c-list dl dd p + p { margin-top: 1.5rem; }
}



/* カラムボックス */
.clbox { display: grid; gap: 2rem; }
.clbox-2 { }
.clbox-2.clbox-sp { grid-template-columns: repeat(2, 1fr); }
.clbox-3.clbox-sp { grid-template-columns: repeat(3, 1fr); }
.clbox-4.clbox-sp { grid-template-columns: repeat(4, 1fr); }

@media print, screen and (min-width: 640px) {
.clbox { display: grid; gap: 4rem;  }
.clbox-2 { grid-template-columns: repeat(2, 1fr); }
.clbox-2._rev {  }
.clbox-2._rev > *:nth-child(1) { order: 2;  }
.clbox-2._rev > *:nth-child(2) { order: 1;  }
.clbox-1-13 { grid-template-columns: 1.3fr 1fr;}
.clbox-1-13._rev > *:nth-child(1) { order: 2;  }
.clbox-1-13._rev > *:nth-child(2) { order: 1;  }
.clbox-1-2 { grid-template-columns: 2fr 1fr;}
.clbox-1-2._rev > *:nth-child(1) { order: 2;  }
.clbox-1-2._rev > *:nth-child(2) { order: 1;  }

.clbox-3 { grid-template-columns: repeat(3, 1fr);}
.clbox-4 { grid-template-columns: repeat(4, 1fr);}


}



/* アコーディオン */
.js-aco-child { display: none;}


/* カテゴリ・タグ
.cat-list { display: flex; }
.cat-item { margin-right: 1rem; }
.cat-item a { display: block; padding: 1rem 1.5rem; background-color: var(--cl-bggr); font-size: 1.3rem; border-radius: 5px; }
.cat-item span::before { display: inline-block; content: "-"; margin-right: 0.5rem;}
.cat-item.is-active a { background-color: var(--cl-key); color: var(--cl-wh);}
.tag-list { margin-top: 2rem; max-width: 54rem; display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.tag-item { line-height: 1; }
.tag-item a { position: relative; display: inline-flex; align-items: center; font-size: 1.3rem; }
.tag-item a::before { content: ""; display: block; width: 2rem; height: 2rem; background: url(/assets/images/common/ico_tag.svg) no-repeat center / contain; }
.select-year { position: relative; max-width: 20rem;}
.select-year::after { position: absolute; top: 50%; right: 1rem; content: ""; display: block; width: 2rem; height: 2rem; background: url(/assets/images/common/ico_ar_bl.svg) no-repeat center / contain; transform: translate(0,-50%) rotate(90deg); pointer-events: none;}
.select-year select { width: 100%; padding: 1rem 1.5rem 0.8rem; font-size: 1.3rem; cursor: pointer;  border: var(--cl-gr) 1px solid; border-radius: 5px; background-color: var(--cl-wh); }

@media print, screen and (min-width: 640px) {
.cat-item a { padding: 1.2rem 2rem; font-size: 1.5rem; }
.tag-list { margin-top: 3rem; gap: 1rem 1.5rem;}
.tag-item a { font-size: 1.5rem; }

}
*/

/* アンカーリンクリスト
.c-ankerlink {  }
.c-ankerlink ul { display: flex; gap: 1rem; flex-wrap: wrap; padding-bottom: 1rem;}
.c-ankerlink ul li a { display: inline-block; padding: 0.5rem 1rem; background-color: var(--cl-bggr); border-radius: 0.2rem;}
.c-ankerlink ul li span { display: inline-flex; align-items: center;  }
.c-ankerlink ul li span::after { content: ""; display: block; width: 1.5em; height: 1.5em; margin-left: 0.5rem; background: url(/assets/images/common/ico_ar_bl.svg) no-repeat center / contain; transform: rotate(90deg);}

@media print, screen and (min-width: 640px) {
.c-ankerlink {  padding-bottom: 2rem; border-bottom: var(--cl-gr) 1px solid; }
.c-ankerlink ul { gap: 0; }
.c-ankerlink ul + ul { margin-top: 1.5rem; }
.c-ankerlink ul li a { display: grid; align-items: center; grid-template-columns: auto auto; padding: 0; background-color: transparent; font-size: 1.4rem;  }
.c-ankerlink ul li a::after { content: ""; display: block; width: 1px; height: 2rem; background-color: var(--cl-gr); }
.c-ankerlink ul li:last-child a::after { display: none;}
.c-ankerlink ul li span { padding-inline: 3rem;}
.c-ankerlink ul li:nth-child(1) span { padding-left: 0;}
.c-ankerlink ul li:last-child { padding-right: 0;}
}
*/


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

base layout

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


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

.main { overflow: hidden; min-height: 10rem; margin-top: 7rem; }
input:not([type=radio],[type=checkbox]),
textarea { padding:1.0rem 1.25rem; color: var(--cl-txt); background-color: #efefef; border: none; width:100%; height: 5rem; font-size: 1.6rem; border-radius: 0;}
textarea { min-height:20rem; }
button { cursor: pointer; padding: 0; background: none; color: var(--cl-wh); width: 100%; }
input::placeholder,
textarea::placeholder { color:var(--cl-gr); font-size: 1.6rem; }
label { display: inline-block; }
label:hover { cursor: pointer; }
/*input:-webkit-autofill { box-shadow: 0 0 0 1000px var(--cl-bggr) inset;}*/
input:not([type=radio]:focus,[type=checkbox]):focus,
textarea:focus { outline: none; }

@media print, screen and (min-width: 640px) {
.main { margin-top: 10rem; }
input:not([type=radio],[type=checkbox]),
textarea { height: 6rem; padding: 1rem 1.5rem; }
body._fixed { padding-right: 1.5rem; }
._fixed .header { padding-right: 5.5rem; }
}




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

.header { position: fixed; top: 0; width: 100%; height: 7rem; display: flex; align-items: center; z-index: 100; background-color: var(--cl-wh); border-bottom: #707070 1px solid;}
.header-logo { max-width: 21.7rem; margin-left: 2rem; }
.header-logo img { transition: 0.5s; }
.header-logo-link { display: block;}
.header-nav { display: none;}


@media print, screen and (min-width: 640px) {
.header { height: 10rem; }
.header-logo {  margin-left: 3rem; }
}
@media print, screen and (min-width: 1180px) {
.header { justify-content: flex-end; transition: 0.3s; }
.header-logo { max-width: 34rem; position: absolute; top: 50%; left: 0; transform: translate(0,-50%); }
.header-nav { display: flex; align-items: center; justify-content: flex-end;}
.gnav-item { }
.gnav-item-link { position: relative; display: flex; align-items: center; height: 10rem; padding: 0 1rem; font-size: 1.4rem; font-weight: 600;  }
.gnav-item:last-child { width: 15rem; margin-left: 1rem; }
.gnav-item:last-child .gnav-item-link { justify-content: center; background-color: var(--cl-key); color: var(--cl-wh); letter-spacing: 0.15rem; transition: 0.3s;}
}
@media print, screen and (min-width: 1380px) {
.header-logo { max-width: 37.6rem; margin-left: 6rem; }
.gnav-item-link { padding: 0 1.5rem; }
.gnav-item:last-child { margin-left: 1.5rem; }

}

/* only home */
.header-logo img.only-home { opacity: 0; visibility: hidden; height: 0; }
.page-home .header-logo img.only-home { opacity: 1; visibility: visible; height: auto;}
.page-home .header-logo img.default { opacity: 0; visibility: hidden; height: 0; }
.page-home .header { background-color: transparent;}
.page-home header .gnav-item:last-child .gnav-item-link { background-color: var(--cl-wh); color: var(--cl-key); }
.page-home .header.small .gnav-item:last-child .gnav-item-link { background-color: var(--cl-key); color: var(--cl-wh); }
.page-home .header.small { background-color: var(--cl-wh);}
.page-home .header.small .header-logo img.only-home { opacity: 0; visibility: hidden; height: 0; }
.page-home .header.small .header-logo img.default { opacity: 1; visibility: visible; height: auto;}
.page-home .header { border-bottom: var(--cl-wh) 1px solid;}
.page-home .header.small { border-bottom: #707070 1px solid;}
.page-home .header .gnav-item-link { color: var(--cl-wh);}
.page-home .header.small .gnav-item-link { color: var(--cl-txt);}


.page-home .spitem .spnav-btn-line { background-color: var(--cl-wh); }
.page-home .spitem .spnav-btn::before,
.page-home .spitem .spnav-btn::after { background-color: var(--cl-wh); }
.page-home .spitem.small .spnav-btn-line { background-color: var(--cl-txt); }
.page-home .spitem.small .spnav-btn::before,
.page-home .spitem.small .spnav-btn::after { background-color: var(--cl-txt); }

/* scroll
@media print, screen and (min-width: 1024px) {
.header.small { height: 8rem; }
.header.small .subMenu { top: 8rem; }
.header.small .gnav-item-link { height: 8rem; }
}
*/


/* megamenu
@media print, screen and (min-width: 1024px) {
.subMenu { display: none; position: absolute; top: 10rem; left: 0; width: 100%; background-color: var(--cl-bggr);  }
.subMenu-inner { max-width: calc(116rem + 8vw); margin: 0 auto; padding: 6vh 4vw; }
.subMenu-list { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 3rem; margin-top: 4rem;}
.subMenu-item { }
.subMenu-item a { display: block; font-size: 1.4rem;}
.subMenu-item-pic { border-radius: 5px; overflow: hidden;}
.subMenu-item-title { margin-top: 0.5vh; font-size: 1.5rem;}
.subMenu-list-small { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 1.5vh 3vw; margin-top: 4vh; }
.subMenu-list-small .subMenu-item { background-color: var(--cl-wh); border-radius: 5px; }
.subMenu-list-small .subMenu-item a { padding: 1.6vh 1.6vw 1.2vh;}
.subMenu-list-small .subMenu-item span { display: inline-flex; align-items: center;}
.subMenu-list-small .subMenu-item span::before { content: ""; display: block; width: 2rem; height: 2rem; margin-right: 0.5rem; background: url(/assets/images/common/ico_ar_bl.svg) no-repeat center;}
}
*/





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

/* SPメニューの開閉時に背景スクロールを禁止する */
@media print, screen and  (max-width: 1023px) {
body.is-open { height: 100%; overflow: hidden; }
}

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

/* spnav-btn */
.spnav-btn { position: fixed; top: 0; right: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; background-color:var(--cl-base); cursor: pointer; width: 7rem; height: 7rem; border-radius: 0.3rem; outline: none; transition:0.5s; z-index: 130; cursor: pointer;}
.spnav-btn::before,
.spnav-btn::after { content: ""; position: absolute; left: 50%; width: 3rem; height: 1px; background-color: var(--cl-txt); transform: translateX(-50%); transition:0.3s; }
.spnav-btn::before { top: 2.8rem; }
.spnav-btn::after  { bottom: 2.8rem; }
.spnav-btn-line { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 3rem; height: 1px; background-color: var(--cl-txt); transition: 0.3s; overflow: hidden; }
.spnav-btn.close { }
.spnav-btn.close::before,
.spnav-btn.close::after { content: ""; position: absolute; left: 50%; background-color:var(--cl-txt); transform: translateX(-50%); transition:0.3s; }
.spnav-btn.close::before { top: 50%; transform: translate(-50%,-50%) rotate(45deg) ; left: 50%; }
.spnav-btn.close::after  { bottom: auto; top: 50%; transform: translate(-50%,-50%) rotate(-45deg); left: 50%;}
.spnav-btn.close .spnav-btn-line { display: none; }

@media print, screen and (min-width: 640px) {
.spnav-btn { width: 10rem; height: 10rem; }
.spnav-btn::before,
.spnav-btn::after { width: 5rem; }
.spnav-btn::before { top: 4em; }
.spnav-btn::after  { bottom: 4em; }
.spnav-btn-line { width: 5rem;  }
}


/* spnav */
.spnav { opacity: 0; visibility: hidden; transform: scale(0,0,0); position: fixed; top: 7rem; right: 0; width: 100%; z-index: 100; transition: 0.3s; }
.spnav.is-open { opacity: 1; visibility: visible; transform: scale(1,1,1); }
.spnav-inner { width: 100%; height: calc(100vh - 5rem); overflow-y: scroll; background-color: var(--cl-wh);}
.spnavMenu { padding: 2rem 2rem 8rem; }
.spnavMenu-list { border-top: var(--cl-gr) 1px solid; }
.spnavMenu-list:last-child { border-bottom: none; }
.spnavMenu-title { position: relative; }
.spnavMenu-title a,
.spnavMenu-title.js-aco-open { display: block; padding: 1.6rem 0;  font-weight: 600; cursor: pointer; font-size: 1.4rem;}
.spnavMenu-title.js-aco-open::before { position: absolute; top: 50%; right: 1rem; content: ""; display: block; width: 1.6rem; height: 1.6rem; background: url(/assets/images/common/ico_open_bk.svg) no-repeat center; transform: translate(0,-50%) ; transition: 0.3s;  }
.spnavMenu-title.is-open::before { transform: translate(0,-50%) rotate(180deg); background-image: url(/assets/images/common/ico_close_bk.svg);  }
.spnavMenu-child ul li + li { margin-top: 0.1rem;  }
.spnavMenu-child ul li a { position: relative; display: block; padding: 1.2rem 1.5rem; font-size: 1.3rem; color: #333333; background-color: var(--cl-bggr); }
.spnavMenu-child ul li a[target="_blank"] { display: flex; align-items: center; }
.spnavMenu-child ul li a[target="_blank"]:after { content: ""; display: block; width: 0.8em; height: 0.8em; background: url(/assets/images/common/ico_blank_bl.svg) no-repeat center; margin-left: 0.5rem;}

.spnavMenu-title._contact { margin-top: 2rem; padding: 0; background-color: var(--cl-key); text-align: center;}
.spnavMenu-title._contact a { display: block; padding: 2rem; color: var(--cl-wh); letter-spacing: 0.15rem; }

.spnavMenu-news .spnavMenu-child ul { display: flex; flex-wrap: wrap; }
.spnavMenu-news .spnavMenu-child ul li { width: calc(50% - 0.1rem); }
.spnavMenu-news .spnavMenu-child ul li:nth-child(odd) { margin: 0.1rem 0 0 0.1rem; }
.spnavMenu-news .spnavMenu-child ul li:first-child { width: calc(100% - 0.1rem); }

@media print, screen and (min-width: 640px) {
.spnav { width: 50%; top: 10rem; }
.spnav-inner { height: calc(100vh - 10rem); padding: 4rem 4rem 0; box-shadow: -7px 7px 10px rgba(0,0,0,0.1); }
.spnavMenu-title {  }
.spnavMenu-title._contact { max-width: 30rem;}

.spnavMenu-title a,
.spnavMenu-title.js-aco-open { font-size: 1.6rem;}
.spnavMenu-child ul li a { font-size: 1.5rem; }

}


/* c-languageList */
.spitem .c-languageList { display: flex; margin-top: 3rem;}
.spitem .c-languageList-item { width: 50%; text-align: center;}
.spitem .c-languageList-item a { display: block; padding: 1.2rem; font-size: 1.2rem; border: var(--cl-gr) 1px solid;}
.spitem .c-languageList-active a { background-color: var(--cl-gr); }



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

.foot-contact { padding: 4rem 0; background-color: var(--cl-key); color: var(--cl-wh);}
.foot-contact-title { }
.foot-contact-en { font-size: 3.4rem; letter-spacing: 0.5rem;}
.foot-contact-ja { font-size: 1.3rem; }
.foot-contact-lead { margin-top: 2rem;}
.foot-contact-btn {  margin-top: 3rem; text-align: center;}
.foot-contact-btn a { position: relative; display: block; background-color: var(--cl-wh);  position: relative; width: 100%; position: relative; padding: 2rem 1.5rem; color: var(--cl-txt); border: var(--cl-txt) 1px solid; transition: 0.3s;}
.foot-contact-btn a span { display: flex; gap: 0.5rem; align-items: center; justify-content: center;}
.foot-contact-btn a span::before { content: ""; display: block; width: 2rem; height: 1.5rem; background: url(/assets/images/common/ico_mail_bk.svg) no-repeat center / contain;}
.foot-contact-btn a::before { position: absolute; top: 50%; right: 1.5rem; transform: translate(0,-50%); content: ""; display: block; width: 1rem; height: 1rem; background-color: var(--cl-key); border-radius: 50%; transition: 0.3s; }

@media print, screen and (min-width: 640px) {
.foot-contact { padding: 12rem 0;}
.foot-contact .u-inner { display: grid; grid-template-columns: 1fr 43.5rem; align-items: center; }
.foot-contact-en { font-size: 6rem; line-height: 1;}
.foot-contact-ja { margin-top: 1rem; font-size: 1.4rem; }
.foot-contact-lead { margin-top: 6rem;}

.foot-contact-btn { }
.foot-contact-btn a { padding: 3.6rem 1.5rem; font-size: 1.8rem;  }
.foot-contact-btn a::before { right: 4rem; z-index: 2; }
.foot-contact-btn a::after { position: absolute; top: 50%; right: 1.9rem; transform: translate(0,-50%); content: ""; display: block; width: 5rem; height: 5rem; background: url(/assets/images/common/ar_btn_wh.svg) no-repeat center / 1.4rem; z-index: 1; transition: 0.3s; }
.foot-contact-btn a:hover { opacity: 1;  }
.foot-contact-btn a:hover::before { transform: translate(0,-50%) scale(5);}
.foot-contact-btn a:hover::after { z-index: 3; }
.foot-contact-btn a span { gap: 1.6rem;}
.foot-contact-btn a span::before { width: 2.8rem; height: 2rem; }

}



.footer { padding: 4rem 0; overflow: hidden; background: url(/assets/images/common/foot_bg.svg) no-repeat center bottom / 80%; }
.footInfo { display: grid; gap: 1rem; text-align: center;}
.footInfo-logo { max-width: 20rem; margin: 0 auto;}
.footInfo-name { margin-top: 2rem; font-weight: 600; }
.footInfo-access a { text-decoration: underline; text-underline-offset:0.2em;}

.footerManu { display: none;}
.footer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin-top: 3rem; }
.footer-bottom-list { display: flex; gap: 1rem;}
.footer-bottom-item { display: inline-block; }
.footer-bottom-item a { display: block; font-size: 1.2rem;}
.footer-bottom-item:first-child a { padding-left: 0;}
.footer-copy { width: 100%; text-align: center; margin-top: 1.5rem; font-size: 1rem; }

@media print, screen and (min-width: 1024px) {
.footer { padding: 8rem 0; background-size:57.4rem ;}
.footer-box { display: grid;  grid-template-columns: 26rem 1fr; gap: 4rem;}
.footInfo { gap: 1.5rem; text-align: left; font-size: 1.4rem;}
.footInfo-logo { max-width: 24rem; margin: 0;}
.footInfo-name { margin-top: 1.5rem; }

.footerManu { display: flex; gap: 6rem; justify-content: flex-end; margin-top: 3rem; }
.footerManu-item { }
.footerManu-list { }
.footerManu-title { font-size: 1.4rem; font-weight: 600; }
.footerManu-title + .footerManu-title,
.footerManu-title + .footerManu-list { margin-top: 2.5rem;}
.footerManu-title::before { display: none; }
.footerManu-child { display: block; margin-top: 1rem; }
.footerManu-child li a { display: inline-block; }
.footerManu-child li a span { display: flex; align-items: center; gap: 0.5rem; font-size: 1.3rem; }
.footerManu-child li a span::before { content: ""; display: block; width: 0.8rem; height: 1px; background-color: var(--cl-key); }
.footer-bottom { margin: 6rem 0 0 0; align-items: center; justify-content: space-between; }
.footer-bottom-list { gap: 2rem;}
.footer-copy { width: auto; margin: 0; font-size: 1.2rem;}
}







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

page layout

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

.page-infoBg .c-content { margin-top: 0;}
.page-infoBg .c-pageTitle { position: relative;}
.page-infoBg .c-pageTitle-m::before,
.page-infoBg .c-pageTitle-l::before { position: absolute; bottom: 0; left: 0; content: ""; display: block; width: 100%; height: 10%; background: url(/assets/images/common/bg.jpg) no-repeat center / cover; z-index: -1;}
.page-infoBg .index-lead { background: url(/assets/images/common/bg.jpg) no-repeat center / cover;}

@media print, screen and (min-width: 640px) {
.page-infoBg .index-lead { line-height: 1.875;}
.page-infoBg .c-pageTitle-m::before { height: 30%;}
.page-infoBg .c-pageTitle-l::before { height: 5%;}
}
@media print, screen and (min-width: 1024px) {
.page-infoBg .c-pageTitle-m::before { height: 30%;}
.page-infoBg .c-pageTitle-l::before { height: 10%;}
}



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

.page-news .u-inner { max-width: 138rem;}
.page-news .footer { margin-top: 0;}
@media print, screen and (min-width: 640px) {
.page-news .c-content { margin: 0; }
}


/* index */
.page-news-index {}
.newsWrap { display: grid; gap: 4rem; }
.newsWrap-left { display: grid; gap: 2rem;}
.newsCat-list { display: flex; gap: 2rem; flex-direction: column-reverse;}

/* .newsList { display: grid; gap: 3rem; margin-top: 4rem; }
.newsList-item a { display: grid; gap: 1.5rem; }
.newsPic { position: relative; overflow: hidden; height: auto; padding-bottom: 51.5%; border-radius: 0.3rem; border: var(--cl-gr) 1px solid;}
.newsPic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.newsDetail { display: grid; gap: 0.3rem;}
.newsBox { word-wrap: normal;  overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; line-height: 1.2;}
.newsDate { font-size: 1.2rem; line-height: 1.2; }
.newsTitle { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: 1.3rem; line-height: 1.6; }
.newsCat { font-size: 1.1rem; }
.newsCat + .newsTag::before { content: "/"; margin-right: 0.3rem;}
.newsCat::before { content: "-"; margin-right: 0.3rem; }
.newsTag { display: inline-block; font-size: 1.1rem; }
.newsTag + .newsTag::before { content: ","; }
@media print, screen and (min-width: 640px) {
.newsWrap { display: flex; gap: 4rem; justify-content: space-between; }
.newsWrap-left { width: calc(100% /3 * 2); margin: 10rem 0 20rem; gap: 4rem;}
.newsCat-list { display: grid; grid-template-columns: 1fr 20rem;  }
.newsList { display: grid; gap: 4rem; margin-top: 6rem; grid-template-columns: repeat(2, 1fr); }
.newsList-item a { gap: 1rem; grid-template-columns: repeat(2, 1fr); }
.newsPic { padding-bottom: 51.5%; border-radius: 0.5rem;}
.newsTitle { -webkit-line-clamp: 3; }
.newsPicup { width: calc(100% / 3); max-width: 37rem; padding: 10rem 2rem 0; background-color: var(--cl-bggr);}
} */


/* picup+関連 */
.newsPicup { margin: 0 -2rem; padding: 4rem 2rem 6rem; background-color: var(--cl-bggr);}
.newsPicup-title { margin-bottom: 2rem;}

@media print, screen and (min-width: 640px) {
.newsPicup {  margin: 0; padding: 10rem 3rem;}
.newsPicup .newsList { width: 100%; margin: 0; grid-template-columns: initial;}
.newsPicup .newsList-item a { gap: 1rem; grid-template-columns: initial; }
}


/* ページネーション */
.screen-reader-text { display: none;}
/* .nav-links { display: flex; justify-content: center; margin-top: 4rem;}
.nav-links > * { padding: 0 2rem; border-right: var(--cl-txt) 1px solid; line-height: 1; font-size: 1.4rem; }
.nav-links > *.current { vertical-align: var(--cl-key); }
.nav-links > *:first-child { border-left: var(--cl-txt) 1px solid; }
@media print, screen and (min-width: 640px) {
.nav-links { margin-top: 5rem;}
}
 */


/* detail */
.page-news-detail {}
.page-news-detail .newsWrap { gap: 6rem;}
.page-news-detail .newsTitle-detail { overflow: initial; display: block; -webkit-box-orient: initial; -webkit-line-clamp: initial; margin: 0.5rem 0 1rem; font-size: 1.8rem;}
.page-news-detail .articleBox { display: grid; gap: 2rem; margin-top: 3rem; padding-top: 3rem; border-top: var(--cl-gr) 1px solid;}
.page-news-detail .articleBox > * { }
.page-news-detail .articleBox figure { border-radius: 0.5rem; overflow: hidden; }
.page-news-detail .newsWrap-back { margin-top: 3rem; padding-top: 3rem; border-top: var(--cl-gr) 1px solid; text-align: center; }
.page-news-detail .newsWrap-back a { display: inline-block; }
@media print, screen and (min-width: 640px) {
.page-news-detail .newsDate { font-size: 1.4rem;}
.page-news-detail .newsTag { font-size: 1.3rem;}
.page-news-detail .newsCat { font-size: 1.3rem;}
.page-news-detail .newsTitle-detail { margin: 1rem 0 2rem; font-size: 3rem; line-height: 1.6;}
.page-news-detail .articleBox { gap: 3rem; margin-top: 5rem; padding-top: 5rem; }
.page-news-detail .newsWrap-back { margin-top: 5rem; padding-top: 5rem; }
}



/* privacy + compliance
--------------------------------------------------------------*/

.guide { }
.guide-item { padding-left: 2rem; border-left: var(--cl-key) 2px solid; }
.guide-item + .guide-item { margin-top: 4rem; }
.guide-itemTitle { font-size: 1.8rem; }
.guide-itemBox {  margin-top: 1rem;}
.guide-itemBox-title { font-size: 2rem;}
.guide-itemBox-lead { margin: 1rem 0 2rem;}
.guide-itemBox-lead + p { margin-top: 1rem;}

.guide-itemBox-list { counter-reset: listnum;}
.guide-itemBox-list li { }
.guide-itemBox-list li + li { margin-top: 2rem;}
.guide-itemBox-list li .guide-itemBox-main { }
.guide-itemBox-list li .guide-itemBox-main + p { margin-top: 0.5rem; }
.guide-itemBox-list li .guide-itemBox-main::before { counter-increment: listnum; content: counter(listnum) ".";  }
.guide-itemBox-list ol { counter-reset: listnum; margin: 1rem 0 0 1rem; }
.guide-itemBox-list ol li { text-indent: -1.7em; margin-left: 1.7em; }
.guide-itemBox-list ol li + li { margin-top: 0.5rem; }
.guide-itemBox-list ol li::before { counter-increment: listnum; content: "（" counter(listnum) "）";  }

@media print, screen and (min-width: 640px) {
.guide-item { display: grid; grid-template-columns: 1fr 3fr; padding-left: 4rem;}
.guide-item + .guide-item { margin-top: 8rem; }
.guide-itemTitle { font-weight: 600; }
.guide-itemBox {  margin-top: 0.5rem;}
.guide-itemBox-lead { margin: 1rem 0 3rem;}
.guide-itemBox-list li .guide-itemBox-main + p { }
.guide-itemBox-list li + li { margin-top: 3rem;}
.guide-itemBox-list ol { margin: 1.5rem 0 0 2rem; }
.guide-itemBox-list ol li { font-size: 1.5rem;  }

}


/* contact form
--------------------------------------------------------------*/

.form-lead { margin-bottom: 4rem;}
.form-lead span { display: block; margin: 0.5rem 0 0; font-size: 1.3rem;}

@media print, screen and (min-width: 640px) {
.form-lead { margin-bottom: 6rem;}
.form-lead span { margin: 1.5rem 0 0; font-size: 1.4rem;}

}



/* contact form
--------------------------------------------------------------*/
.p-country-name { display: none;}
.formWrap {}
.formBox {}
.formWrap-item { padding: 3rem 0; border-top: var(--cl-gr) 1px solid;}
.formWrap-item:last-of-type { border-bottom: var(--cl-gr) 1px solid;}
.formWrap-title { display: flex; align-items: center; gap: 0.5rem;}
.formWrap-title p { font-size: 1.4rem;}
.formWrap-title._required::after { content: "＊"; color: var(--cl-key);}
.formWrap-input { margin-top: 1rem; position: relative;}
.formWrap-input input,
.formWrap-input textarea { background-color: var(--cl-bggr);}
.formWrap-input label { display: block;}
.formWrap-input input::placeholder { color: #909093;}
.formWrap-input label + label { margin-top: 0.5rem;}
.formWrap-input span { display: block; margin-top: 0.5rem; font-size: 1.2rem;}
.formWrap-input-box._zip { display: grid; grid-template-columns: 2rem 1fr; align-items: center; }
.formWrap-input-box._zip input { max-width: 20rem; }
.formWrap-input-box._zip .error-message { grid-column-start: 1; grid-column-end: 3; }
.formWrap-input-box + .formWrap-input-box { margin-top: 1.5rem;}

.error-message { margin-bottom: 2rem; padding: 2rem; text-align: center; color: var(--cl-error); background-color: #F8E7E7;}
.formBox .error-message { margin: 1rem 0 0; padding: 0; text-align: left; background-color: transparent; font-size: 1.2rem; }
.contact-btn { margin: 3rem auto 0;}
.contact-btn a { min-width: inherit; width: 100%;}

.formWrap-privacy { padding: 3rem 0 0;}
.form-privacy { margin: 0.5rem 0 0 2em; font-size: 1.3rem;}
.mwform-checkbox-field { display: inline-block; margin-top: 1rem;}
.mwform-checkbox-field input { cursor: pointer;}

@media print, screen and (min-width: 640px) {
.formWrap-item { display: grid; grid-template-columns: 25rem 1fr; align-items: flex-start; }
.formWrap-column { display: block; }
.formWrap-title { gap: 1rem;}
.formWrap-input { margin-top: 0;}
.formWrap-input { margin-top: 0;}
.formWrap-input span { font-size: 1.4rem;}
.error-message { margin-bottom: 4rem; padding: 3rem; }
.formBox .error-message { font-size: 1.4rem; }
.contact-btn { margin: 6rem auto 0;}

}

/* confirm */
.page-contact-confirm .formWrap-input span { display: none; }
.page-contact-confirm .formWrap-privacy { display: flex;}
.page-contact-confirm .formWrap-privacy::before { content: "＊";  }
.page-contact-confirm .formWrap-column::before {  content: "＊";}
.page-contact-confirm .form-privacy { display: none; }
.page-contact-confirm .contact-btn + p { margin: 4rem auto 0; max-width: 20rem; }
/*.formWrap-input-box._zip { display: block; }*/




.contact-btn { position: relative; cursor: pointer; text-align: center; position: relative; width: 100%; position: relative; display: block; color: var(--cl-txt); border: var(--cl-txt) 1px solid; transition: 0.3s; padding: 0;}
.contact-btn::before { position: absolute; top: 50%; right: 1.5rem; transform: translate(0,-50%); content: ""; display: block; width: 1rem; height: 1rem; background-color: var(--cl-key); border-radius: 50%; transition: 0.3s; pointer-events: none;  }
.contact-btn input[type=submit] { height: auto; background-color: transparent; padding: 2rem 1.5rem;}

@media print, screen and (min-width: 640px) {
.contact-btn { max-width: 34rem;}
.contact-btn {  }
.contact-btn::before { right: 3rem; z-index: 2; }
.contact-btn::after { position: absolute; top: 50%; right: 0.9rem; transform: translate(0,-50%); content: ""; display: block; width: 5rem; height: 5rem; background: url(/assets/images/common/ar_btn_wh.svg) no-repeat center / 1.4rem; z-index: 1; transition: 0.3s; opacity: 0; pointer-events: none; }
.contact-btn:hover { opacity: 1;  }
.contact-btn:hover::before { transform: translate(0,-50%) scale(5);}
.contact-btn:hover::after { z-index: 3; opacity: 1; }

.contact-btn input[type=submit] { padding: 2.4rem 1.5rem; }




}







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

page unique

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

.page-about {}
.page-about .c-content { margin-bottom: 0; }
.page-about .sec02 { background: url(/assets/images/about/sec02_bg.png) no-repeat center / cover;}
.page-about .sec02 figure { max-width: 110rem; margin: 0 auto;}
.page-about .sec02 figure img { width: 100%;}



/* download
--------------------------------------------------------------*/

.page-download {}
.page-download .txt-lead { margin-bottom: 4rem;}
.catalogList { display: grid; gap: 4rem 2rem; grid-template-columns: repeat(2,1fr);}
.catalogList a { display: block;}
.catalogList-pic { position: relative; height: 0; padding-bottom: 100%; border: var(--cl-gr) 1px solid; }
.catalogList-pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; }
.catalogList-title { margin-top: 1rem; font-size: 1.6rem; }
.catalogList-btn { margin-top: 0.5rem; }
.catalogList-btn span { display: flex; gap: 0.5rem; align-items: center; text-decoration: underline; font-size: 1.2rem; }
.catalogList-btn span::after { content: ""; display: block; width: 1em; height: 1em; background: url(/assets/images/common/ico_download.svg) no-repeat center / contain;}

@media print, screen and (min-width: 640px) {
.page-download .txt-lead { margin-bottom: 6rem;}
.catalogList { display: grid; gap: 6rem 4rem; grid-template-columns: repeat(4,1fr);}
.catalogList-pic { padding-bottom: 136.6%; }
.catalogList-title { margin-top: 1.5rem; font-weight: 600; }
.catalogList-btn { margin-top: 1rem; }
.catalogList-btn span { font-size: 1.4rem; }

}

@media print, screen and (min-width: 640px) {
    input[type="file"]{
        height: auto;
        margin-bottom: 1rem;
    }
}

.mwform-file-delete{
    position: absolute;
    right: 1rem;
    top: 1rem;
}