@charset "utf-8";
@import url('https://cdn.jsdelivr.net/npm/destyle.css@1.0.15/destyle.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
/*font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
*/
/*font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
*/
/*font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
*/



@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..20');

.gicon:before,
.gicon:after{
  font-family: "Material Symbols Outlined";
  line-height: 1;
}

/* ------- LINK ---------------------------------------------- */
a:link {
  color: inherit;
  text-decoration: inherit;
}
a:visited {
  color: inherit;
  text-decoration: inherit;
}
a:hover {
  color: inherit;
  text-decoration: inherit;
}
a:active {
  color: inherit;
  text-decoration: inherit;
}

a.text-link{
  color: #3681A0;
  text-decoration: underline;
}

@media (hover: hover) and (pointer: fine){
  a.text-link:hover{
    text-decoration: none;
  }
}



/* ------- BODY ---------------------------------------------- */
html{
  font-size: 62.5%;
}
body {
  color: #1A1B1B;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  line-height: 2;
  overflow-x: hidden;
}

*{
  backface-visibility: hidden;/* animation時のにじみ防止 */
  -webkit-backface-visibility: hidden;/* animation時のにじみ防止 */
  -webkit-font-smoothing: antialiased/* animation時の文字にじみ防止 */
  -moz-osx-font-smoothing: grayscale;/* animation時の文字にじみ防止 */
  -webkit-font-smoothing: antialiased;
}

img {
  height: auto;
  max-width: 100%;
}


/* ------- RESPONSIVE ---------------------------------------------- */
@media print, screen and (min-width:781px) {
  .pc-ver {
    display: block;
  }
  .sp-ver {
    display: none;
  }
}
@media screen and (max-width: 780px) {
  .pc-ver {
    display: none;
  }
  .sp-ver {
    display: block;
  }
}


/* ------- BODY ---------------------------------------------- */
body{
  background-color: #FFF;
}
@media print, screen and (min-width:781px) {
	body{
    font-size: min(1.17vw,1.6rem);
    overflow-y: auto !important;
	}
}
@media screen and (max-width: 780px) {
	body{
    font-size: min(3.84vw,1.5rem);
    padding-top: 78px;
	}
}
@media print {
  .page-bb{
    page-break-before: always;
  }
  .page-ba{
    page-break-after: always;
  }
}




/* ------- HEADER ---------------------------------------------- */
#header-area{
  position: fixed;
  left: 0;
  top: 0;
  z-index: 100;
}
@media print, screen and (min-width:781px) {
  #header-area{
    background-color: rgba(255,255,255,.85);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 30px;
    height: 90px;
    width: 100%;
  }
  #logo-main{
    width: 19.4729%;
    max-width: 266px;
  }
  #logo-main img{
    mix-blend-mode: multiply;
  }
}
@media screen and (max-width: 780px) {
  #header-area{
    background-color: rgba(255,255,255,1);
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 78px;
    width: 100%;
  }
  #logo-main{
    margin-left: 30px;
    width: 49.5348%;
  }
  #logo-main a{
    display: flex;
  }
}
@media print {
  #header-area{
    position: absolute;
  }
}



/* ------- HUMBERGER ---------------------------------------------- */
#humberger {
	background-color: #000000;
	text-align: center;
	cursor: pointer;
  position: relative;
  transition: .3s;
}
#humberger .trigger, #humberger .trigger > span, #humberger .trigger > span > span {
	transition: ease-out .2s;
	box-sizing: border-box;
}
#humberger .trigger{
	position: absolute;
}
#humberger .trigger > span {
	position: absolute;
	right: 0;
	width: 100%;
	height: 1px;
	background-color: #FFF;
}
#humberger .trigger > span:nth-of-type(1) {
	top: 0px;
}
#humberger .trigger > span:nth-of-type(3) {
	bottom: 0;
}
#humberger.active .trigger > span:nth-of-type(2) {
	-webkit-transform: rotate(0);
	transform: rotate(0);
	opacity: 0;
}
@media print, screen and (min-width: 781px) {
  #humberger{
    display: none
  }
}
@media screen and (max-width: 780px) {
  #humberger{
    margin-right: 15px;
    height: 45px;
    width: 45px;
  }
  #humberger .trigger{
    width: 20px;
    height: 17px;
    right: 12px;
    top: 14px;
  }
  #humberger .trigger > span:nth-of-type(2) {
    top: 8px;
  }
  #humberger.active .trigger > span:nth-of-type(1) {
    -webkit-transform: translateY(8px) rotate(45deg);
    transform: translateY(8px) rotate(45deg);
  }
  #humberger.active .trigger > span:nth-of-type(3) {
    -webkit-transform: translateY(-8px) rotate(-45deg);
    transform: translateY(-8px) rotate(-45deg);
  }
}


/* ------- NAVI GLOBAL ---------------------------------------------- */
#navi-global-area .lower{
  color: #FFF;
}
#navi-global-area .engineering .lower{
  background-color: #F39729 !important;
}
#navi-global-area .filling .lower{
  background-color: #0086CD !important;
}
#navi-global-area .lower .close{
  background-image: url("/common/img/ic_close.svg");
  cursor: pointer;
  height: 24px;
  width: 24px;
  position: absolute;
  right: 0;
  top: 25px;
}
@media print, screen and (min-width:781px) {
  #navi-global-area{
    display: flex !important;
    justify-content: flex-end;
    align-items: center;
    margin-right: 0;
    margin-left: auto;
  }
  .navi-global{
    display: flex;
  }
  .navi-global > li{
    font-size: min(1.38vw,1.5rem);
    position: relative;
  }
  .navi-global > li:nth-child(n + 2){
    margin-left: 30px;
  }
  .navi-global > li > a{
    display: block;
    padding: 35px 0;
    position: relative;
  }
  .navi-global > li > a:after{
    background-color: #C10000;
    content: "";
    display: block;
    height: 2px;
    width: 0;
    position: absolute;
    left: 50%;
    bottom: 20px;
    transform: translateX(-50%);
    transition: .3s;
  }
  .navi-global > li.is-current > a:after{
    width: 100%;
  }
  @media (hover: hover) and (pointer: fine){
    .navi-global > li:hover > a:after{
      width: 100%;
    }
  }
  .navi-global-func{
    margin-left: min(7vw,130px);
  }
  .navi-global-func .btn-inquiry{
    background-color: #000;
    border-radius: 15px;
    color: #FFF;
    display: flex;
    font-weight: 500;
    font-size: min(0.95vw,1.3rem);
    line-height: 1;
    padding: 10px 25px;
    transition: .3s;
  }
  .navi-global-func .btn-inquiry:before{
    background-image: url("../img/ic_mail.svg");
    background-repeat: no-repeat;
    content: "";
    display: block;
    margin-right: 5px;
    height: 12px;
    width: 18px;
  }
  @media (hover: hover) and (pointer: fine){
    .navi-global-func .btn-inquiry:hover{
      opacity: .7;
    }
    #navi-global-area .lower a:hover{
      opacity: .7;
    }
  }
  #navi-global-area .lower{
    display: none;
    width: 100%;
    position: fixed;
    left: 0;
    top: 90px;
    z-index: 1;
  }
  #navi-global-area .lower a{
    display: block;
    transition: .3s;
  }
  #navi-global-area .lower-inner{
    padding: 50px 0 30px;
    margin-left: auto;
    margin-right: auto;
    max-width: 1080px;
    width: 90%;
    position: relative;
  }
  #navi-global-area .lower .lower-index{
    border-bottom: 1px solid #FFF;
    font-size: min(1.6vw,2.2rem);
    font-weight: 700;
    padding-bottom: 10px;
  }
  #navi-global-area .engineering .lower .child{
    display: flex;
    justify-content: space-between;
  }
  #navi-global-area .engineering .lower .child > li{
    font-size: min(1.3vw,1.8rem);
    font-weight: 700;
    margin-top: 20px;
  }
  #navi-global-area .lower .grandchild{
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    margin-top: 20px;
  }
  #navi-global-area .lower .grandchild > li{
    border-left: 1px solid #FFF;
    font-size: min(1.17vw,1.6rem);
    font-weight: 700;
    padding-left: 10px;
  }
  #navi-global-area .lower .grandchild ul > li{
    font-size: min(1.09vw,1.5rem);
    font-weight: 500;
  }
  #navi-global-area .lower .grandchild ul > li > a{
    background-image: url("../img/ic_arrow_navi.svg");
    background-position: left top 10px;
    background-repeat: no-repeat;
    padding-left: 13px;
  }
  
  #navi-global-area .engineering .lower .child > li:nth-child(1){
    justify-content: space-between;
    width: 59.44%;
  }
  #navi-global-area .engineering .lower .child > li:nth-child(1) .grandchild > li{
    margin-bottom: 40px;
  }
  #navi-global-area .engineering .lower .child > li:nth-child(1) .grandchild > li:nth-child(3n + 1){
		margin-right: 3%;
    width: 32%;
  }
  #navi-global-area .engineering .lower .child > li:nth-child(1) .grandchild > li:nth-child(3n + 2){
		margin-right: 3%;
    width: 23%;
  }
  #navi-global-area .engineering .lower .child > li:nth-child(1) .grandchild > li:nth-child(3n + 3){
    width: 39%;
  }
  #navi-global-area .engineering .lower .child > li:nth-child(2){
    width: 37.6851%;
  }
  #navi-global-area .engineering .lower .child > li:nth-child(2) .grandchild{
    display: block;
  }
  #navi-global-area .engineering .lower .child > li:nth-child(2) .grandchild > li{
    margin-bottom: 25px;
  }
  
  #navi-global-area .filling .lower .grandchild > li{
    padding-right: 45px;
    margin-bottom: 50px;
  }
	#navi-global-area .filling .lower .grandchild > li:nth-child(7){
		padding-right: 0;
	}

  
  .lower-sp{
    display: none;
  }
  .navi-sp{
    display: none !important;
  }
}
@media screen and (min-width:781px) and (max-width:1160px) {
}
@media screen and (max-width: 780px) {
  #navi-global-area{
    background-color: #FFF;
    display: none;
    height: calc(100vh - 78px);
    height: calc(100dvh - 78px);
    width: 100%;
    overflow-y: auto;
    position: fixed;
    left: 0;
    top: 78px;
  }
  .active #navi-global-area{
    display: block !important;
  }
  #navi-global-area .navi-global > li{
    border-bottom: 1px solid #D5D5D5;
    position: relative;
  }
  #navi-global-area .navi-global > li a,
  #navi-global-area .navi-global > li span{
    display: block;
  }
  #navi-global-area .navi-global > li > a{
    padding: 14px 15px 14px 30px;
  }
  #navi-global-area .navi-global > li .ic{
    background-color: rgba(235,235,235,1.00);
    cursor: pointer;
    height: 45px;
    width: 45px;
    position: absolute;
    right: 15px;
    top: 7px;
  }
  #navi-global-area .navi-global > li .ic:before,
  #navi-global-area .navi-global > li .ic:after{
    background-color: #000;
    content: "";
    display: block;
    height: 1px;
    width: 12px;
    position: absolute;
    left: 50%;
    top: 50%;
    transition: .3s;
  }
  #navi-global-area .navi-global > li .ic:before{
    transform: translate(-50%,-50%);
  }
  #navi-global-area .navi-global > li .ic:after{
    transform: translate(-50%,-50%) rotate(90deg);
  }
  #navi-global-area .navi-global > li .ic.active:after{
    transform: translate(-50%,-50%) rotate(0deg);
    opacity: 0;
  }
  #navi-global-area .navi-global > li .lower-sp{
    background-color: rgba(227,227,227,.85);
    display: none;
  }
  #navi-global-area .lower .close{
    display: none;
  }
  
  .navi-global-func{
    display: none;
  }
  
  #navi-global-area .lower li a,
  #navi-global-area .lower li span{
    border-bottom: 1px solid #FFF;
  }
  #navi-global-area .lower-index > a{
    border-bottom: 1px solid #FFF;
    background-image: url("../img/ic_arrow_sp2.svg");
    background-position: left 20px center;
    background-repeat: no-repeat;
    padding: 10px 10px 10px 40px;
  }
  #navi-global-area .child > li > div{
    display: none;
  }
  #navi-global-area .child > li > a{
    border-bottom: 1px solid #D5D5D5;
    background-image: url("../img/ic_arrow_sp1.svg");
    background-position: left 20px center;
    background-repeat: no-repeat;
    padding: 10px 10px 10px 40px;
  }
  #navi-global-area .grandchild > li > span{
    background-image: url("../img/ic_arrow_gc.svg");
    background-position: left 20px center;
    background-repeat: no-repeat;
    padding: 10px 10px 10px 40px;
    
  }
  #navi-global-area .grandchild > li > ul{
    display: none;
  }
  #navi-global-area .grandchild > li > ul > li > a{
    background-image: url("../img/ic_arrow_sp2.svg");
    background-position: left 40px center;
    background-repeat: no-repeat;
    padding: 10px 10px 10px 55px;
  }
}
@media (hover: hover) and (pointer: fine){
}



/* ------- BREAD CRUMBS ---------------------------------------------- */
.breadcrumbs{
  display: flex;
  flex-wrap: wrap;
}
.breadcrumbs > li{
  line-height: 1.5;
  display: flex;
  align-items: center;
}
.breadcrumbs > li:not(:last-child):after{
  color: #A9A9A9;
  content: "\e5e1";
  font-family: "Material Symbols Outlined";
}
.breadcrumbs > li:last-child a {
    pointer-events: none;
    text-decoration: none;
}
@media print, screen and (min-width:781px) {
  .breadcrumbs{
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
    width: 90%;
  }
  .breadcrumbs > li{
    font-size: min(0.95vw,1.3rem);
  }
  .breadcrumbs > li:not(:last-child):after{
    font-size: min(1.02vw,1.4rem);
    margin: 0 5px;
  }
}
@media screen and (max-width: 780px) {
  .breadcrumbs{
    margin: 20px auto 100px;
    width: 90%;
  }
  .breadcrumbs > li{
    font-size: min(3.33vw,1.3rem);
  }
  .breadcrumbs > li:not(:last-child):after{
    font-size: min(3.58vw,1.4rem);
    margin: 0 5px;
  }
}




/* ------- CONTENTS ---------------------------------------------- */
#contents-area{
  position: relative;
  z-index: 1;
}
.head-visual{
  background-repeat: no-repeat;
  background-size: cover;
}
.directory-corporate .head-visual{
  background-image: url("../img/img_main_corporate.jpg");
}
.blog .head-visual,
.single-post .head-visual{
  background-image: url("../img/img_main_news.jpg");
  background-position: right center;
}
.directory-recruit .head-visual{
  background-image: url("../img/img_main_recruit.jpg");
  background-position: right center;
}
.directory-privacy .head-visual{
  background-image: url("../img/img_main_privacy.jpg");
  background-position: right center;
}
.directory-sitemap .head-visual{
  background-image: url("../img/img_main_sitemap.jpg");
  background-position: right center;
}
.directory-recruit_inq .head-visual,
.directory-recruit_inq-confirm .head-visual,
.directory-recruit_inq-thanks .head-visual{
  background-image: url("../img/img_main_recruit.jpg");
  background-position: right center;
}
.directory-newgrad .head-visual,
.directory-career .head-visual{
  background-image: url("../img/img_main_form.jpg");
}
.directory-inquiry .head-visual,
.directory-inquiry-confirm .head-visual,
.directory-inquiry-thanks .head-visual{
  background-image: url("../img/img_main_entry.jpg");
  background-position: right center;
}
@media print, screen and (min-width:781px) {
  .head-visual{
    padding-top: 110px;
    height: 240px;
  }
  .inner{
    padding: 1px 0;
    margin-left: auto;
    margin-right: auto;
    max-width: 1080px;
    width: 90%;
  }
  .inner-w{
    padding: 1px 0;
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
    width: 90%;
  }
}
@media screen and (max-width: 780px) {
  .head-visual{
    padding: 1px 0;
  }
  .inner,
  .inner-w{
    padding: 1px 0;
    margin-left: auto;
    margin-right: auto;
    width: 90%;
  }
}



/* ------- FOOTER ---------------------------------------------- */
#footer-area{
  position: relative;
  z-index: 1;
}
.navi-footer{
  background-color: #363636;
  color: #FFF;
}
.navi-footer .child > li > span,
.navi-footer .grandchild > li > span,
.navi-footer .grandchild > li > a{
  display: flex;
  align-items: center;
}
.navi-footer .child > li > span:before,
.navi-footer .grandchild > li > span:before,
.navi-footer .grandchild > li > a:before{
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  display: block;
}
.navi-footer .child > li > span:before{
  background-image: url("../img/ic_arrow_ft1.svg");
}

.navi-footer .grandchild > li{
  font-weight: 500;
  line-height: 1.84;
}
.navi-footer .grandchild > li > span:before,
.navi-footer .grandchild > li > a:before{
  background-image: url("../img/ic_arrow_ft2.svg");
}
.navi-footer .grandchild > li > ul > li{
  font-weight: 300;
  line-height: 1.84;
}

.footer-other{
  background-color: #FFF;
}
.footer-copyright .copyright{
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}
@media print, screen and (min-width:781px) {
  #footer-area{
    margin-top: 175px;
  }
  .navi-footer{
    padding: 50px 0;
  }
  .navi-footer a{
    transition: .3s;
  }
  @media (hover: hover) and (pointer: fine){
    .navi-footer a:hover{
      opacity: .7;
    }
  }
  .navi-footer > ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
    width: 90%;
  }
  .navi-footer .col2{
    display: flex;
    justify-content: space-between;
  }
  .navi-footer .col2 > ul{
    width: 48%;
  }
  .navi-footer .parent:nth-child(1){
    width: 73.62728%;
  }
  .navi-footer .parent:nth-child(n + 2){
    width: 21.29783%;
  }
  .navi-footer .parent:nth-child(n + 3){
    margin-top: 70px;
  }
  .navi-footer .parent > div{
    border-bottom: 1px solid #FFF;
    padding-bottom: 10px;
    margin-bottom: 15px;
  }
  .navi-footer .parent > div > a{
    display: block;
  }
  .navi-footer .child{
    display: flex;
  }
  .navi-footer .child > li:nth-child(1){
    width: 52.3163%
  }
  .navi-footer .child > li:nth-child(2){
    width: 28.2485%
  }
  .navi-footer .child > li > span{
    font-size: min(1.09vw,1.5rem);
  }
  .navi-footer .child > li > span:before{
    margin-right: 5px;
    height: 14px;
    width: 14px;
  }
  .navi-footer .grandchild{
    margin-top: 10px;
  }
  .navi-footer .grandchild > li{
    font-size: min(0.95vw,1.3rem);
  }
  .navi-footer .grandchild > li:nth-child(n + 2){
    margin-top: 5px;
  }
  .navi-footer .grandchild > li > span:before,
  .navi-footer .grandchild > li > a:before{
    margin-right: 5px;
    height: 6px;
    width: 5px;
  }
  .navi-footer .grandchild > li > ul{
    margin-left: 10px;
  }
  .navi-footer .grandchild > li > ul > li{
    margin-top: 5px;
  }
  
  .footer-other-inner{
    margin-left: auto;
    margin-right: auto;
    width: 90%;
  }
  .footer-copyright{
    border-bottom: 1px solid #CDCDCD;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px 0;
  }
  .footer-copyright .copyright{
    font-size: min(0.87vw,1.2rem);
  }
  .navi-other{
    font-size: min(0.95vw,1.3rem);
    display: flex;
    align-items: center;
  }
  .navi-other > li:nth-child(n + 2){
    margin-left: 25px;
  }
  @media (hover: hover) and (pointer: fine){
    .navi-other > li > a:hover{
      text-decoration: underline;
    }
  }
  
  
  .company-address{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px 0;
  }
  .company-address > dt{
    margin-right: 25px;
    width: 17.886855%;
    max-width: 215px;
  }
  .company-address > dd{
    font-size: min(1.02vw,1.4rem);
  }
}
@media screen and (max-width: 780px) {
  #footer-area{
    margin-top: 100px;
  }
  .navi-footer{
    display: none;
  }
  
  .footer-other-inner{
    margin-left: auto;
    margin-right: auto;
    width: 90%;
  }
  .footer-copyright{
    border-bottom: 1px solid #CDCDCD;
    padding: 30px 0;
    text-align: center;
  }
  .footer-copyright .copyright{
    font-size: min(3.07vw,1.2rem);
  }
  .navi-other{
    display: none;
  }
  
  .company-address{
    display: flex;
    flex-direction: column-reverse;
    padding: 20px 0 35px;
  }
  .company-address > dt{
    margin: 25px auto 0;
    width: 69.23%;
  }
  .company-address > dd{
    font-size: min(3.58vw,1.4rem);
    text-align: center;
  }
}




/* ------- BOTTOM NAVI ---------------------------------------------- */
.bottom-navi-wrap h3{
  font-weight: 700;
  letter-spacing: .06em;
}
.bottom-navi > li{
  line-height: 1.4;
}
.bottom-navi.product-navi > li > div{
  background-color: rgba(210,210,208,.50);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .06em;
  padding: 10px 25px;
}
.bottom-navi > li > a,
.bottom-navi.product-navi .nav-item > li > div{
  border-bottom: 1px solid #C1C1C1;
  display: flex;
  align-items: center;
  height: 100%;
  position: relative;
}
.bottom-navi.product-navi .nav-item > li > div{
  padding-bottom: 10px;
}
.bottom-navi > li > a:before,
.bottom-navi > li > a:after,
.bottom-navi.product-navi .nav-item > li > div:before,
.bottom-navi.product-navi .nav-item > li > div:after{
  content: "";
  display: block;
}
.bottom-navi > li > a:before,
.bottom-navi.product-navi .nav-item > li > div:before{
  background-image: url("../img/ic_arrow_bn.svg");
  background-repeat: no-repeat;
  background-size: cover;
  flex-shrink: 0;
  transition: .3s;
}
.bottom-navi > li > a:after,
.bottom-navi.product-navi .nav-item > li > div:after{
  background-color: #262626;
  height: 1px;
  width: 26px;
  position: absolute;
  left: 0;
  bottom: -1px;
  transition: .4s cubic-bezier(0.5, 1, 0.89, 1);
}



.bottom-navi.product-navi .nav-item > li{
  cursor: pointer;
}
.bottom-navi.product-navi .nav-item .sub-menu{
  display: none;
  padding-left: 25px;
}
.bottom-navi.product-navi .nav-item .sub-menu > li{
  display: flex;
  align-items: flex-start;
  margin-top: 10px;
}
.bottom-navi.product-navi .nav-item .sub-menu > li:before{
  background-color: #C1C1C1;
  content: "";
  display: block;
  margin-right: 5px;
  margin-top: 18px;
  height: 1px;
  width: 12px;
}
.bottom-navi.product-navi .nav-item .sub-menu > li > a,
.bottom-navi.product-navi .nav-item .sub-menu > li > span{
  display: block;
  padding: 5px 10px;
  width: 100%;
  transition: .3s;
}
.bottom-navi.product-navi .nav-item > li > div{
  display: flex;
  align-items: center;
}

@media print, screen and (min-width:781px) {
  .bottom-navi-wrap{
    padding-top: 75px;
  }
  .bottom-navi-wrap h3{
    font-size: min(1.61vw,2.2rem);
    margin-bottom: 55px;
  }
  .bottom-navi{
    display: flex;
  }
  .bottom-navi > li > a{
    padding-bottom: 17px;
  }
  .bottom-navi > li > a:before{
    margin-right: 13px;
    height: 14px;
    width: 14px;
  }
  .bottom-navi.product-navi .nav-item > li.active > div:before{
    transform: rotate(90deg);
  }
  .bottom-navi > li.current > a:after,
  .bottom-navi.product-navi .nav-item > li.active > div:after{
    width: 100%;
  }
  @media (hover: hover) and (pointer: fine){
    .bottom-navi > li > a:hover:after{
      width: 100%;
    }
  }
  
  
  .directory-corporate .bottom-navi{
    justify-content: space-between;
  }
  .directory-corporate .bottom-navi > li{
    width: 20%;
  }
  
  
  .bottom-navi.product-navi{
    display: block;
    padding-top: 0;
  }
  .bottom-navi.product-navi > li{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .bottom-navi.product-navi > li:nth-child(n + 2){
    margin-top: 50px;
  }
  .bottom-navi.product-navi > li > div{
    width: 100%;
  }
  .bottom-navi.product-navi .nav-item {
    width: 41.574%;
  }
  .bottom-navi.product-navi .nav-item > li {
    margin-top: 25px;
  }
  .bottom-navi.product-navi .nav-item > li > div:before{
    margin-right: 13px;
    height: 14px;
    width: 14px;
  }
}
@media screen and (max-width: 780px) {
  .bottom-navi-wrap{
    padding-top: 35px;
  }
  .bottom-navi-wrap h3{
    font-size: min(4.61vw,1.8rem);
  }
  .bottom-navi > li.current > a:after{
    width: 100%;
  }
  .bottom-navi > li > a{
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .bottom-navi > li > a:before{
    margin-right: 13px;
    height: 14px;
    width: 14px;
  }
  
  
  
  .bottom-navi.product-navi{
    display: block;
    padding-top: 0;
  }
  .bottom-navi.product-navi > li:nth-child(n + 2){
    margin-top: 50px;
  }
  .bottom-navi.product-navi > li > div{
    width: 100%;
  }
  .bottom-navi.product-navi .nav-item > li {
    margin-top: 15px;
  }
  .bottom-navi.product-navi .nav-item > li > div:before{
    margin-right: 13px;
    height: 14px;
    width: 14px;
  }
}








/* ------- COMMON PARTS ---------------------------------------------- */
.align-c{
  text-align: center;
}
.align-l{
  text-align: left;
}
.align-r{
  text-align: right;
}


/* MAIN HEAD */
.heading.normal{
  display: flex;
}
.heading.normal:before{
  background-color: #C10000;
  content: "";
  display: block;
}
.heading > h1{
  font-weight: 700;
  letter-spacing: .06em;
  line-height: 1.45;
}

.heading-product .ttl > h1{
  border-left-width: 7px;
  border-left-style: solid;
  font-weight: 700;
  letter-spacing: .06em;
  line-height: 1.4;
  padding-left: 10px;
}
.heading-product .ttl > p{
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
  line-height: 1.3;
  letter-spacing: .06em;
}

.heading-product-detail .category{
  display: flex;
}
.heading-product-detail .category .main{
  align-items: center;
  color: #FFF;
  display: flex;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: .06em;
  margin-right: 10px;
}
.heading-product-detail .category .sub{
  border-left-style: solid;
  border-left-width: 1px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .06em;
}
.heading-product-detail .ttl{
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .06em;
}




/* SECTION HEAD */
.section-heading{
  font-weight: 700;
  line-height: 1.5;
  display: flex;
  align-items: center;
}
.section-heading:before{
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  display: block;
}

.bar-heading{
  display: flex;
  justify-content: center;
  text-align: center;
}
.bar-heading .ttl{
  border-bottom: 6px solid #C10000;
  font-weight: 700;
  line-height: 1.4;
  padding-bottom: 5px;
}


.directory-corporate .section-heading:before{
  background-image: url("../img/ic_sec_corp.svg");
  margin-right: 15px;
  height: 27px;
  width: 18px;
}
.directory-corporate .section-heading.type2:before{
  background-image: url("../img/ic_sec_corp2.svg");
}
.directory-corporate .section-heading.type3:before{
  background-image: url("../img/ic_sec_corp3.svg");
}
.directory-corporate .section-heading.type4:before{
  background-image: url("../img/ic_sec_corp4.svg");
}
.directory-corporate .section-heading.type5:before{
  background-image: url("../img/ic_sec_corp4.svg");
}

/* SUB HEAD */
.sub-heading{
  display: flex;
  justify-content: flex-start;
}
.sub-heading .ttl{
  border-bottom: 1px solid #9F9D99;
  border-left: 1px solid #9F9D99;
  font-weight: 700;
}


/* MAIN HEAD TEXT */




.note-list > li,
.dot-list > li{
  font-size: min(1.3vw,1.3rem);
  text-indent: -1em;
  padding-left: 1em;
}
.note-list > li:before{
  content: "※";
}
.dot-list > li:before{
  content: "●";
}



.btn-area{
  display: flex;
  justify-content: center;
}
.btn{
  background-color: #1A1B1B;
  display: flex;
  color: #FFF !important;
  line-height: 1;
  transition: .3s;
}
.btn:after{
  content: "\f591";
  font-size: min(2vw,2.0rem);
  font-family: "Material Symbols Outlined";
  line-height: 1;
}



.sec{
  border-top: 1px solid rgba(112,112,112,.10);
}

.note-num-list{
  counter-reset: number 0;
}
.note-num-list > li{
  text-indent: -1.8em;
  padding-left: 1.8em;
}
.note-num-list > li:before{
  counter-increment: number 1;
  content: "※" counter(number);
}


.navi-section{
  background-color: #C8D9D9;
}
.navi-section > ul > li{
  font-weight: 500;
}
.navi-section > ul > li > a,
.navi-section > ul > li > span{
  background-color: #C8D9D9;
  border-right: 1px solid #FFFFFF;
  display: flex;
  align-items: center;
  width: 100%;
}
.navi-section > ul > li > a:after{
  background-image: url("../img/ic_arrow_page.svg");
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  display: block;
  margin-left: 10px;
  height: 14px;
  width: 14px;
}



.tbl-normal table{
  width: 100%;
}
.tbl-normal table th{
  background-color: #F0F5F5;
  font-weight: 700;
}
@media print, screen and (min-width:781px) {
  .align-c-pc{
    text-align: center !important;
  }
  .align-l-pc{
    text-align: left !important;
  }
  .align-r-pc{
    text-align: right !important;
  }
  
  /* MAIN HEAD */
  .heading{
    margin-top: 60px;
  }
  .heading.normal:before{
    margin-right: 10px;
    width: 7px;
  }
  .heading.normal > h1{
    font-size: min(2.7vw,3.7rem);
  }
  .heading > h1{
    font-size: min(2.7vw,3.7rem);
  }
  
  
  .heading-product{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-top: 30px;
    height: 390px;
    width: 37.037%;
  }
  .heading-product .ttl > h1{
    font-size: min(2.7vw,3.7rem);
  }
  .heading-product .ttl > p{
    font-size: min(1.75vw,2.4rem);
    margin-top: 5px;
  }
  .heading-product > p{
    font-size: min(1.17vw,1.6rem);
    margin-top: 50px;
  }
  
  
  .heading-product-detail .category .main{
    font-size: min(1.31vw,1.8rem);
    padding: 0 30px;
  }
  .heading-product-detail .category .sub{
    font-size: min(1.9vw,2.6rem);
    padding-bottom: 10px;
    padding-left: 20px;
  }
  .heading-product-detail .ttl{
    font-size: min(2.7vw,3.7rem);
    margin-top: 10px;
  }
  .heading-product-detail .ttl > span{
    font-size: min(2.04vw,2.8rem);
  }
  
  
  
  /* SECTION HEAD */
  .section-heading{
    font-size: min(2.19vw,3.0rem);
  }
  
  .bar-heading .ttl{
    font-size: min(2.34vw,3.2rem);

  }
  
  /* SUB HEAD */
  .sub-heading .ttl{
    font-size: min(1.83vw,2.5rem);
    padding-bottom: 10px;
    padding-left: 20px;
  }
  
  
  /* MAIN HEAD TEXT */
  .heading-text{
    text-align: center;
    padding: 40px 5% 40px;
  }
  .heading-text .en{
    font-size: 8.0rem;
  }
  
  
  .inner{
    margin-left: auto;
    margin-right: auto;
    max-width: 1080px;
    width: 90%;
  }
  
  
  .btn{
    border-radius: 8px;
    font-size: min(1.31vw,1.8rem);
    padding: 15px;
  }
  @media (hover: hover) and (pointer: fine){
    .btn:hover{
      opacity: .7;
    }
  }
  
  
  .navi-section{
    margin-top: 85px;
  }
  .navi-section > ul{
    display: flex;
    margin-left: auto;
    margin-right: auto;
    max-width: 1080px;
    width: 90%;
  }
  .navi-section > ul > li{
    font-size: min(1.46vw,2.0rem);
    text-align: center;
    width: 100%;
  }
  .navi-section > ul > li > a,
	.navi-section > ul > li > span{
    justify-content: center;
    text-align: center;
    padding: 20px 5px;
    transition: .3s;
  }
  .navi-section > ul > li:nth-child(3n + 1) > a{
    border-left: 1px solid #FFFFFF;
  }
  @media (hover: hover) and (pointer: fine){
    .navi-section > ul > li > a:hover{
      opacity: .7;
    }
  }
  .navi-section > .lines{
    flex-wrap: wrap;
  }
  .navi-section > .lines > li{
    width: 33.3333%;
  }
  .navi-section > .lines > li:nth-child(n + 4){
    border-top: 1px solid #FFFFFF;
  }
  .navi-section > ul > li > a > span{
    font-size: min(1.24vw,1.7rem);
  }
  
  
  .tbl-normal{
    margin-top: 45px;
  }
  .tbl-normal table{
    border-top: 1px solid #9F9D99;
  }
  .tbl-normal table tr{
    border-bottom: 1px solid #9F9D99;
  }
  .tbl-normal table th{
    padding: 35px 15px;
  }
  .tbl-normal table td{
    padding: 35px;
  }
}
@media screen and (max-width: 780px) {
  .align-c-sp{
    text-align: center !important;
  }
  .align-l-sp{
    text-align: left !important;
  }
  .align-r-sp{
    text-align: right !important;
  }
  
  
  /* MAIN HEAD */
  .heading{
    margin-top: 60px;
  }
  .heading.normal:before{
    margin-right: 10px;
    width: 4px;
  }
  .heading> h1{
    font-size: min(7.17vw,2.8rem);
  }
  .heading.normal > h1{
    font-size: min(7.17vw,2.8rem);
  }
  
  
  .heading-product{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-top: 30px;
  }
  .heading-product .ttl > h1{
    font-size: min(7.69vw,3.0rem);
  }
  .heading-product .ttl > p{
    font-size: min(5.64vw,2.2rem);
    margin-top: 5px;
  }
  .heading-product > p{
    font-size: min(3.58vw,1.4rem);
    margin-top: 30px;
  }
  
  
  
  .heading-product-detail .category .main{
    font-size: min(4.1vw,1.6rem);
    padding: 0 30px;
  }
  .heading-product-detail .category .sub{
    font-size: min(5.64vw,2.2rem);
    padding-bottom: 10px;
    padding-left: 20px;
  }
  .heading-product-detail .ttl{
    font-size: min(8.46vw,3.3rem);
    margin-top: 10px;
  }
  .heading-product-detail .ttl > span{
    font-size: min(7.17vw,2.8rem);
  }
  
  
  /* SECTION HEAD */
  .section-heading{
    font-size: min(6.15vw,2.4rem);
  }
  .bar-heading .ttl{
    font-size: min(6.66vw,2.6rem);
  }
  
  /* sub HEAD */
  .sub-heading .ttl{
    font-size: min(5.12vw,2.0rem);
    padding-bottom: 10px;
    padding-left: 20px;
  }
  
  
  /* MAIN HEAD TEXT */
  .heading-text{
    text-align: center;
    padding: 40px 5% 40px;
  }
  .heading-text .en{
    font-size: 5.0rem;
  }
  .heading-text .sub{
    font-size: 1.2rem;
  }
  
  
  
  .inner{
    margin-left: auto;
    margin-right: auto;
    width: 90%;
  }
  
  
  .btn{
    border-radius: 4px;
    font-size: min(4.1vw,1.6rem);
    padding: 15px;
  }
  
  
  
  
  .navi-section{
    margin-top: 45px;
  }
  .navi-section > ul{
  }
  .navi-section > ul > li{
    font-size: min(4.1vw,1.6rem);
    width: 100%;
  }
  .navi-section > ul > li > a,
	.navi-section > ul > li > span{
    padding: 15px;
  }
  .navi-section > ul > li > a,
	.navi-section > ul > li > span{
    border-bottom: 1px solid #FFFFFF;
  }
  .navi-section > ul > li > a > span,
	.navi-section > ul > li > span > span{
    font-size: min(3.33vw,1.3rem);
  }
  
  
  
  .tbl-normal{
    margin-top: 45px;
  }
  .tbl-normal table,
  .tbl-normal table tbody,
  .tbl-normal table tr,
  .tbl-normal table th,
  .tbl-normal table td{
    display: block;
    width: 100%;
  }
  .tbl-normal table{
    border-top: 1px solid #9F9D99;
  }
  .tbl-normal table tr{
    border-bottom: 1px solid #9F9D99;
  }
  .tbl-normal table th,
  .tbl-normal table td{
    padding: 15px 15px;
  }
}



/* ------- ANIMATION PARTS ---------------------------------------------- */
.fade-in {
  opacity: 0;
  transition-duration: 1s;
  transition-property: opacity, transform;
}
.fade-in-up {
  transform: translate(0, 30px);
}

.fade-in-down {
  transform: translate(0, -30px);
}

.fade-in-left {
  transform: translate(-30px, 0);
}

.fade-in-right {
  transform: translate(30px, 0);
}
.scroll-in {
  opacity: 1;
  transform: translate(0, 0);
}

@media print {
  .fade-in{
    opacity: 1;
  }
}



/* ------- FORM ---------------------------------------------- */
.form-wrap dl{
  border-top: 1px solid #707070; 
}
.form-wrap dl > div{
  border-bottom: 1px solid #707070;
}
.form-wrap dl dt{
  background-color: #F5F5F5;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 700;
}
.form-wrap dl dd{
  background-color: #FFF;
  font-weight: 500;
}
.form-wrap dl dt,
.form-wrap dl dd{
  border-bottom: 1px solid #FFF;
  border-top: 1px solid #FFF;
}
.form-wrap dl dt.req:after{
  background-color: #ED1C24;
  color: #FFF;
  content: "必須";
  line-height: 1;
  padding: 8px 15px;
}

.form-wrap dl dd input[type=text],
.form-wrap dl dd select,
.form-wrap dl dd textarea,
.form-wrap dl dd input[type=email],
.form-wrap dl dd input[type=tel]{
  border: 1px solid #CECBCB;
  padding: 10px 15px;
}
.form-wrap dl dd select{
  -moz-appearance: menulist;
  -webkit-appearance: menulist;
}

.privacy-box{
  background-color: #EDF2F5;
  font-weight: 500;
  padding: 25px;
  text-align: center;
}
.privacy-box a{
  font-weight: 700;
  text-decoration: underline;
}
.form-btn-area{
  display: flex;
  justify-content: center;
}
.form-btn-area input[type=button],
.form-btn-area input[type=submit]{
  background-color: #1A1B1B;
  color: #FFF;
  font-weight: 500;
  letter-spacing: .06em;
  text-align: center;
  transition: .3s;
}
@media (hover: hover) and (pointer: fine){
  .form-btn-area input[type=button]:hover,
  .form-btn-area input[type=submit]:hover{
      opacity: .7;
    }
  }
.form-row {
  display: flex;
  gap: 20px;
}
.wpcf7-radio{
  display: flex;
}
.form-row label {
  flex: 1;
}


.form-name,
.form-birth{
	display: flex;
	align-items: center;
}
.form-name input,
.form-birth input{
	width: 100%;
}
.wpcf7-not-valid-tip{
	width: 100% !important
}
@media print, screen and (min-width:781px) {
  .form-desc{
    margin-top: 55px;
  }
  .form-desc + .form-wrap{
    margin-top: 55px;
  }
  
  .form-wrap{
    margin-top: 70px;
  }
  .form-wrap dl{
    width: 100%;
  }
  .form-wrap dl > div{
    display: flex;
  }
  .form-wrap dl dt{
    width: 368px;
  }
  .form-wrap dl dd{
    width: calc(100% - 368px);
  }
  .form-wrap dl dt,
  .form-wrap dl dd{
    padding: 30px 25px;
  }
  
  .form-radio{
    display: flex;
    flex-wrap: wrap;
    padding-left: 40px;
  }
  .form-radio label{
    color: #707070;
    margin-right: 60px;
  }
  .form-contents textarea{
    width: 100%;
  }
  .form-name span[data-name="text-sei"],
	.form-name span[data-name="text-mei"],
	.form-name span[data-name="text-sei-kana"],
	.form-name span[data-name="text-mei-kana"]{
    width: 44%;
  }
  .form-add{
    margin-top: 10px;
  }
  .form-add input{
    width: 100%;
  }
  .form-tel input{
    width: 60%;
  }
  .form-mail input{
    width: 100%;
  }
  
  
  .form-birth span{
    width: 14%;
  }
  .form-birth span[data-name="text-birth1"]{
    width: 29% !important;
  }
  .form-text100 input{
    width: 100%;
  }
  
  
  .privacy-box{
    margin-top: 70px;
  }
  
  
  .form-btn-area{
    margin-top: 85px;
  }
  .form-btn-area input[type=button],
  .form-btn-area input[type=submit]{
    border-radius: 8px;
    padding: 15px;
    width: 32%;
    max-width: 350px;
  }
  .form-btn-area input[type=button]:nth-child(n + 2),
  .form-btn-area input[type=submit]:nth-child(n + 2){
    margin-left: 2%;
  }
	
	
}
@media screen and (max-width: 780px) {
  .form-desc{
    margin-top: 25px;
  }
  .form-desc + .form-wrap{
    margin-top: 25px;
  }
  
  
  .form-wrap{
    margin-top: 35px;
  }
  .form-wrap dl{
    width: 100%;
  }
  .form-wrap dl dt,
  .form-wrap dl dd{
    padding: 15px;
  }
  
  .form-radio{
    display: flex;
    flex-wrap: wrap;
  }
  .form-radio label{
    color: #707070;
    margin-right: 20px;
  }
  .form-contents textarea{
    width: 100%;
  }
  .form-name input{
    width: 100%;
  }
  .form-add{
    margin-top: 10px;
  }
  .form-add input{
    width: 100%;
  }
  .form-tel input{
    width: 100%;
  }
  .form-mail input{
    width: 100%;
  }
  
  
  .form-birth span{
    width: 14%;
  }
  .form-birth span[data-name="text-birth1"]{
    width: 29% !important;
  }
  .form-text100 input{
    width: 100%;
  }
  
  
  .privacy-box{
    margin-top: 35px;
  }
  
  
  .form-btn-area{
    margin-top: 45px;
  }
  .form-btn-area input[type=button],
  .form-btn-area input[type=submit]{
    border-radius: 8px;
    padding: 15px;
    width: 45%;
  }
  .form-btn-area input[type=button]:nth-child(n + 2),
  .form-btn-area input[type=submit]:nth-child(n + 2){
    margin-left: 2%;
  }
	
	
}