/*
Theme Name:後藤運輸株式会社
*/

/*ベースの設定*/
html{font-size:62.5%; font-style: normal;}

:root {
  --content-brand-font: "Zen Old Mincho", serif;
  --content-brand-font-gos: "Zen Kaku Gothic New", sans-serif;
  --content-brand-font-en: "Oswald", sans-serif;
  --content-brand-blue:#3a81bc;
  --content-brand-blue2:#3b5f9b;
  --content-brand-blue-op:rgba(58, 129, 188, 0.8);
  --content-brand-deepblue:#05384d;
  --content-brand-red:#e60012;
  --content-brand-gray:#4c4948;
  --content-brand-shadow: 0.4rem 0.4rem 2.0rem rgba(0, 0, 0, .75);
  --content-brand-gradation:linear-gradient(to right,#3C83BD 0%,#3F8CBF 12.5%,#4490C0 25%,#489FC4 37.5%,#4EA4C6 50%,#52B0C8 62.5%,#56B7CB 75%,#5ABFCD 100%);
  --content-brand-gradation-v:linear-gradient(to top,#3C83BD 0%,#3F8CBF 12.5%,#4490C0 25%,#489FC4 37.5%,#4EA4C6 50%,#52B0C8 62.5%,#56B7CB 75%,#5ABFCD 100%);
  --content-brand-black-logitech:#3e3a39;
}

html,body{width: 100%;}
body{ line-height: 1.5; overflow: hidden; font-family: var(--content-brand-font); font-weight: 200; font-size:1.8rem; font-feature-settings: "palt";}
a{ text-decoration: none; transition: 0.5s; color: #000000;}
a:visited{}
a:hover img{ opacity: 0.8; transition: 0.5s ;}
a:hover,li:hover,input:hover,p:hover { transition: 0.5s ;}
img{ width:100%; display: block;}
a.btn-simple{ display: block; text-align: right; display: flex; align-items: center; justify-content: flex-end; position: relative;}
a.btn-simple::after{content: ''; width:0.75rem; height:0.75rem; display: block; border-right: 1px solid #000000; border-bottom: 1px solid #000000; transform: rotate(-45deg);}
a.btn-simple:hover{ color: #da3312;}
a.btn-simple:hover::after{ border-right: 1px solid #da3312; border-bottom: 1px solid #da3312;}
strong{font-weight: normal;}

.marker {background:linear-gradient(transparent 60%, #ff0 60%);}


/*装飾*/
.shutter{ opacity: 0;}
.is-visible{ opacity: 1;}
.is-visible.shutter{ position: relative;}
.is-visible.shutter:after{ content: ''; display: block; width:100%;height:100%; position: absolute; top:0; left:0; background-color: #ffffff; animation: shutter-open 1.5s ease-in-out forwards;transform-origin:100% 0}
@keyframes shutter-open{
    from {
    transform: scaleX(1);
  }
  to {
    transform: scaleX(0);
  }
}

.fade{ opacity: 0;}
.is-visible.fade{ position: relative; animation: fade-in 1.5s 0.5s ease-in-out forwards; opacity: 0;}
@keyframes fade-in{
    from {
    opacity:0;
    transform: translateY(-1rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

details::details-content {
  overflow: clip;                 /* はみ出しを隠す */
  transition: block-size .25s;    /* 高さ相当（縦書きでもOK） */
}

details:not([open])::details-content {
  block-size: 0;                  /* 閉時は 0 */
}

details[open]::details-content {
  block-size: auto;               /* 開時は 自動高さ */
}


.presentation{}
.slick-dots{ bottom:4vh}
.slick-dots li button{  display: flex; align-items:center}
.slick-dots li button:before{ top:0; left:0; right:0; bottom:0; margin:auto; font-size:1.8rem; color: #ffffff;}
.slick-dots li.slick-active button:before{ color: #ffffff;}

@keyframes zoom-in{
    from {
    transform: scale(100%);
  }
  to {
    opacity: 1;
    transform: scale(110%);
  }
}
@keyframes zoom-out{
    from {
      transform: scale(120%);
    }
    to {
    transform: scale(100%);
  }
}

.fade-up {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s ease, transform 0.8s ease;
  position: relative;
  z-index: 2;
}
.fade-up.show {
  opacity: 1;
  transform: translateY(0);
}
.slick-dotted.slick-slider{
  margin-bottom: 0;
}

.pagehead {
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.pagehead.scrolled {
  background-color: rgba(0,0,0,0.25);
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.pagehead.scrolled .branding a{color:#ffffff}

.std{ margin-bottom:2.4rem;}
.std i{ display: block; width: fit-content; border-bottom: 1px solid ; font-size:4.6rem; font-weight: 300; margin-bottom: 2rem;}
.std strong{ font-size:2.7rem; font-weight: 200;}

.std2{ margin-bottom:2.4rem;line-height: 1;}
.std2 i{ display: block; width: fit-content; font-size:5.6rem; font-weight: 500; color: #c9caca; margin-bottom: 0.8rem;}
.std2 strong{ font-size:2.4rem; font-weight: 400;}

.btn{ max-width:260px; padding:0.4rem 4.8rem; display: flex; align-items: center; justify-content: center; font-family: var(--content-brand-font-gos); color: #ffffff; position: relative; border-radius:4.8rem; font-size:2.0rem; font-weight: 500; border: 1px solid #ffffff;}
.btn:after{ content: '>'; display:block; margin-left: 1.6rem; transition: 0.5s all; line-height: 1; transform: translateY(-0.2rem); position: absolute; right:1.6rem; font-size:2.0rem}
.btn:hover{ background-color:#000000}
.bg-blue{ background-color: var(--content-brand-blue); border:none}
.bg-blue-op{ background-color: var(--content-brand-blue-op); border:none}
.btn.black{ border-color: #000000; color: #000000; white-space: nowrap;}
.btn.black:hover{ color: #ffffff;}

.btn2{ background-color:#898989; color: #ffffff; font-size:2.4rem; padding: 1.6rem 2.4rem; border-radius: 0.8rem;}
.btn2:hover{ background-color: #000000;}

/*BASE*/
.pagehead{ width:100%; position: fixed; z-index: 2; top:0; left:0}
.pagehead .inner{ width:calc(100% - 3.2rem); display: flex; justify-content: space-between; align-items: center; margin:0 auto; height:10rem;}
.pagehead .branding { width:fit-content; font-weight: 400;}
body:not(.home) .pagehead .branding a{ color: #ffffff;}
.pagehead .branding a{ font-size:2.4rem;display: flex; align-items: center;}
.pagehead .branding img{ width:4.2rem; aspect-ratio: 1 / 1; object-fit: contain; margin-right: 0.4rem;}
.pagehead .header-menu{ display: flex; align-items: center; justify-content: flex-end; height: 100%; width:fit-content; max-width:790px; gap:0.8rem}
.pagehead .header-menu:after{content: ''; width:1px; height: 100%; display: block; background-color: #ffffff; order:2}
.pagehead .header-menu ul{ height: 100%;}
.pagehead .header-menu .site-nav { display: flex; align-items: center; justify-content: flex-end; order:1; gap:0.8rem}
.pagehead .header-menu .site-nav li a{ font-size: 1.8rem; color: #ffffff; padding:1.6rem 1.6rem; display: block; }
.pagehead .header-menu .site-nav li a:hover{ background-color:rgba(58, 129, 188, 0.25);}
.pagehead .header-menu .other-nav { padding: 0 1.6rem; display: flex; justify-content: flex-end; align-items: center; gap:1.6rem; order:3 }
.pagehead .header-menu .other-nav img{ height:4.8rem; }
.footer_logitech_section{ display: flex;align-items: stretch;}
.footer_logitech_section .inner{ background-color: var(--content-brand-gray); padding:2.4rem; color: #ffffff; text-align: center; width:47rem; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.footer_logitech_section h2 { margin-bottom: 1.6rem;}
.footer_logitech_section h2 .department{ font-size:2.4rem; text-align: center; border:1px solid #ffffff; padding:0.8rem 0; font-weight: 400; display: block; font-family: var(--content-brand-font-gos); margin-bottom: 1.6rem;}
.footer_logitech_section h2 i{ font-size:large; font-size:7.2rem; line-height: 1; font-family:var(--content-brand-font-en); font-weight: 400; white-space: nowrap; display: block;}
.footer_logitech_section h2 strong{ font-size:3.6rem; font-weight: 400;}
.footer_logitech_section .btn{ margin:0 auto}
.footer_logitech_section img{ object-fit: cover; width:calc( (100% - 47rem) / 4)}
.site-footer{ padding:6.4rem 0 1.6rem 0;background: var(--content-brand-gradation); color: #ffffff;}
.site-footer a{ color: #ffffff;}
.site-footer dl{ text-align: center; color: #ffffff;}
.site-footer dt { margin-bottom: 3.2rem;}
.site-footer dt a{ display: flex; align-items: center; font-size: 2.8rem; line-height: 1; font-weight: 400; justify-content: center; gap:0.4rem; color: #ffffff;}
.site-footer dt a img{ width:4.4rem;}
.site-footer dd ul{ display: flex; font-size:1.8rem; gap: 3.2rem; justify-content: center;}
.site-footer dd .other-nav { padding:3.2rem 0}
.site-footer dd .other-nav li img{ height:5.2rem;}
.site-footer .data{ text-align: center; font-size:1.6rem; margin-bottom: 6.4rem;}
.copyright{ text-align: center; font-size:1.2rem}
.right-side-btn { display: block; width:6.0rem; position: relative; position: fixed; right:0;top:15rem; background-color: var(--content-brand-blue-op); z-index: 10;}
.right-side-btn .wrap{display: flex; align-items: center; justify-content: center; flex-direction: column; font-size: 2.4rem; padding:1.6rem 0; gap:1.6rem; z-index: 2; position: relative;}
.right-side-btn i{writing-mode: vertical-rl; color: #ffffff; display: block;}
.right-side-btn img{ width:3.2rem;}
.br520{ display: none;}
.br660{ display: none;}
.br1080 {display: none;}
@media (max-width: 520px){
.br520{ display: block;}
}
/*TOP*/
section{ position: relative; z-index: 1}

.top_about{ background-image: url(images/bg_top_about.jpg); background-size: cover;}
.top_about .flex-wrap{ width: 95%; max-width:1080px; margin:0 auto; display: flex; justify-content: space-between; align-items: center; padding:8.0rem 0 10rem;}
.top_about .flex-wrap .text{ width:50%;}
.top_about .flex-wrap .text p{ font-size:2.0rem; line-height: 4.3rem; margin-bottom: 2.4rem;}
.top_about .flex-wrap .text .btn:nth-of-type(1){ margin-bottom: 1.7rem;}
.top_about .flex-wrap .image{ width:50%}
.top_about .flex-wrap .image figure{ width:90%; max-width:470px; padding:1.6rem 0;}
.top_about .flex-wrap .image figure:nth-child(2){ display: flex; justify-self: end;}
.top_service{ background-image: url(images/bg_top_service.jpg); background-size: cover;}
.top_service .flex-wrap{ width: 95%; max-width:1080px; margin:0 auto; display: flex; justify-content: space-between; align-items: center; flex-direction: row-reverse; padding:8.0rem 0 3.7rem;}
.top_service .flex-wrap .text{ width:45%; color: #ffffff;}
.top_service .flex-wrap .text p{ font-size:2.0rem; line-height: 4.1rem; margin-bottom: 2.4rem;}
.top_service .flex-wrap .image{ width:50%}
.top_service .flex-wrap .image figure{ width:90%; max-width:470px; padding:1.6rem 0;}
.top_service .flex-wrap .image figure:nth-child(2){ display: flex; justify-self: end;}
.top_service .one-stop { position: relative; padding:4.8rem 0; background-color: rgba(0,0,0,0.75);}
.top_service .one-stop figure{ width:90%; max-width:970px; margin:0 auto; display: block; align-items: center; justify-content: center; position: relative; display: flex;}
.top_service .one-stop figcaption { position: absolute; top: 47%; left: 32%;}
.top_service .one-stop figcaption h2{ font-size:3.2rem; color: #ffffff; font-weight: 300; text-align: center;}
.top_service .one-stop .cpg-img{position: absolute; left: 6rem; bottom: 6rem; display: flex; align-items: flex-start; gap: 1rem; color: #fff; font-size: 13px; font-weight: 400; font-family: sans-serif;}
.top_service .one-stop .cpg-img img{width:150px;}
.service-list{width:90%; max-width:1080px; margin:0 auto; padding:7.2rem 0 0 0; display: flex; justify-content: space-between; flex-wrap: wrap;}
.service-list li{ max-width:300px; width:30%; aspect-ratio: 1 / 1; margin-bottom: 7.2rem;}
.service-list li a{ display: flex; align-items: center; justify-content: center;  position: relative; width:100%; height:100%; border:1px solid #ffffff; color: #ffffff;}
.service-list li a:hover{ background-color: rgba(0, 0, 0, .75);}
.service-list li a img{ width:60%; height:50%; object-fit: contain;}
.service-list li:nth-child(4) a img,
.service-list li:nth-child(5) a img,
.service-list li:nth-child(6) a img{ height: 33%;}
.service-list li a i{ display: block; text-align: center; font-size:1.8rem; font-weight: 400; position: absolute; bottom:1.6rem; width:100%; font-family: var(--content-brand-font-gos);}
.service-list li a:after{ content:'>'; font-size:2.4rem; color: #ffffff; position: absolute; bottom:1.2rem; right:1.6rem}
.top_movie{ padding:7.2rem 0 3.6rem 0;}
.top_movie h2{ text-align: center; font-size:2.8rem; margin-bottom: 2.4rem; font-weight: 300;}
.top_movie ul{ width:90%; max-width:1080px; margin:0 auto; display: flex; justify-content: space-between; flex-wrap: wrap;}
.top_movie li { width:40%}
/*.top_movie li video{ width:100%; border-radius: 0.8rem;}*/
.top_movie li iframe{ aspect-ratio: 16 / 9; width:100%; height:auto; border-radius: 0.8rem;}
.top_news{ padding:3.6rem 0 7.2rem 0;}
.top_news h2{ text-align: center; font-size:2.8rem; margin-bottom: 2.4rem; font-weight: 300;}
.top_news ul{ width:90%; max-width:1080px; margin:0 auto; font-family: var(--content-brand-font-gos); font-weight: 400;border-top: 1px solid #000000; margin-bottom: 3.2rem;}
.top_news li { display: flex; padding:1.6rem 0; border-bottom: 1px solid #000000; font-size:1.6rem; gap:2.4rem}
.top_news li .news-category{ padding:0.4rem 0; border:1px solid #000000; border-radius:0.8rem; line-height: 1; min-width:12rem; text-align: center;}
.top_news .btn{ margin:0 auto}
.top_recruit{ padding:3.2rem 0; background-image: url(images/bg_top_recruit_b-s.jpg); background-size: cover; background-position: center;}
.top_recruit .inner{ width:95%; max-width:1080px; margin: 0 auto; display: flex; justify-content: flex-end; align-items: center}
.top_recruit .text{ color: #ffffff; width:fit-content}
.top_recruit .text h2 { display: flex; align-items: center; gap: 0.8rem;}
.top_recruit .text h2 i{ font-size:8rem; font-family: var(--content-brand-font-en); font-weight: 400; line-height: 1;}
.top_recruit .text h2 strong{ display: block; font-size: 2.4rem; font-family: var(--content-brand-font-gos); padding:0.4rem 0.8rem; border: 1px solid #ffffff; margin-left: 1rem;}
.top_recruit .text p{ font-size:5.2rem; font-weight: 400; padding:2.4rem 0}
/*固定ページ*/
.page-header{ position: relative; height:45rem; display: flex; justify-self: center; align-items: flex-end; width:100%}
.page-header .image{ position: absolute; top: 0; left:0; width:100%; height:100%;}
.page-header .image img{ object-fit: cover; width:100%; height:100%}
.page-header .text{ max-width:1080px; width:95%; margin:0 auto; color:#ffffff; padding-bottom: 4.0rem; position: relative; z-index: 2; }
.page-header .text h1{ font-weight: 400;}
.page-header .text h1:has(+p){margin-bottom: 2.4rem; }
.page-header .text h1 i{ font-size: 1.9rem; display: block; font-family: var(--content-brand-font-gos); font-weight: 400;}
.page-header .text h1 strong{ font-size: 3.6rem; display: block; font-weight: 400; margin-bottom: 0.7rem;}
.page-header .text h1 strong:has(.en){ font-size:3.0rem}
.page-header .text h1 strong .en{ font-size:6.0rem; margin-right: 1.5rem}
.page-header .text p{ font-size: 1.9rem; width:70%;font-weight: 400; line-height: 2; letter-spacing: 0.25rem;}
.page-header .text a{ color: #ffffff;}
.page-header.page-child{ height:28.6rem}
.page-header.page-child .text{ padding-bottom: 0;}
.inpage-title{ height:14rem; background-image: url(images/mv_ocean_narrow.jpg); background-size: cover; background-position:left; display: flex; align-items: flex-end; justify-content: center;}
.inpage-title h2{ max-width:1080px; width:95%; margin:0 auto; color:#ffffff; }
.inpage-title h2  strong{ font-size: 3.6rem; display: block; font-weight: 400;}
.inpage-title h2 strong:has(.en){ font-size:3.0rem}
.inpage-title h2 strong .en{ font-size:6.0rem; margin-right: 0.8rem}

.slider-header { height:100%;}
.slider-header .slick-list{ height:100%;}
.slider-header .slick-track{ display: flex; height: 100%;}
.slider-header .slick-track .slick-slide{ width:100%;}
.slider-header img{ object-fit: cover; width:100%; height:100%;}
.slider-header .slick-dots{ bottom: 1.6rem;}

.sns .inner{ max-width:340px; width:90%; margin:0 auto; padding:8rem 0;}

.footer_service-list ul{ flex-wrap: nowrap; width:100%}
.footer_service-list li{ width:18%; background-color: var(--content-brand-blue);}
.footer_service-list li a i{ font-size: 1.2rem; font-weight: 500; line-height: 1.5; bottom:0.8rem; letter-spacing: 1px;}
.footer_service-list li a:after{ font-size: 1.4rem; right:0.8rem;bottom:0.5rem}
header .menu_gaiyou_footer {display: none;}

.lineup{ width:95%; max-width: 1080px; margin:0 auto; padding:2.4rem;}
.lineup .block{ padding:2.4rem 0; border-bottom: 1px solid #221815;}
.lineup .wrap{ display: flex; justify-content: space-between; align-items: center; gap: 2.4rem;}
.lineup .wrap figure{ width:40%;}
.lineup .wrap .text{ width:60%;}
.lineup .wrap .text .btn-wrap{ display: flex; align-items: center; gap: 1.6rem;}
.lineup .wrap h2{ margin-bottom: 1.6rem; display: flex; gap:0.8rem; align-items: baseline; font-weight: 400;}
.lineup .wrap h2 i{ font-size: 5.6rem;font-weight: 400;}
.lineup .wrap h2 strong{ font-size: 2.6rem;font-weight: 400;}
.lineup .wrap p{ font-size: 1.7rem; margin-bottom: 2.4rem; line-height: 1.8; letter-spacing: 0.25rem;}
.lineup .wrap .text a{ font-size: 1.7rem; font-weight: 400;}
.port-transport .list_port-transport{ display: none;}

.fleet-lineup{ width:95%; max-width: 1080px; margin:0 auto; padding:7.2rem 0;}
.fleet-lineup .inner{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.fleet-lineup .block{ width:47.5%; font-family: var(--content-brand-font-gos); margin-bottom: 10rem;}
.fleet-lineup h2{text-align: center; font-size: 2.4rem; padding:1.6rem 0; color: var(--content-brand-deepblue); font-weight: 500; }
.fleet-lineup dt{ background-color: var(--content-brand-deepblue); text-align: center; color: #ffffff; font-size: 2.0rem; padding: 0.8rem 0; font-weight: 400;}
.fleet-lineup .dd-flex,.fleet-lineup .dd-flex02 {display: flex; gap: 2rem;}
.fleet-lineup .dd-flex div:nth-child(1) {width: 62%;}
.fleet-lineup .dd-flex02 div:nth-child(1) {width: 50%;}
.fleet-lineup dd{ padding:0.8rem 0; border-bottom: 1px solid var(--content-brand-deepblue); font-size:1.7rem; font-weight: 500;}
.fleet-lineup dd label{ font-size:1.5rem; color: var(--content-brand-gray);display: block; font-weight: 400;}
.fleet-lineup .list_port-transport{ display: none;}

.barge-lineup{ width:95%; max-width: 870px; margin:0 auto; padding:7.2rem 0; font-family: var(--content-brand-font-gos);}
.barge-lineup h2{ font-size: 2.1rem; padding:1.6rem 0; color: var(--content-brand-deepblue); font-weight: 500; }
.barge-lineup table{ width:100%; font-size: 1.7rem;}
.barge-lineup th{ padding:0.8rem; vertical-align: middle; text-align: center; font-weight: 500; border-right: 1px solid #ffffff;}
.barge-lineup td{ padding:0.8rem; width:calc(100% / 6); text-align: center; border-right:1px solid var(--content-brand-deepblue); border-bottom:1px solid var(--content-brand-deepblue); font-weight: 500;}
.barge-lineup td:last-child{ border-right: none;}
.barge-lineup .ship-spec-table__head-row{ background-color: var(--content-brand-deepblue); color: #ffffff;}
.barge-lineup .ship-spec-table__subhead-row{ background-color: #aaaaaa; color: #000000;}
.barge-lineup .block{ margin-bottom: 6.4rem;}
.barge-lineup .list_port-transport{ display: none;}

.coastal-shipping .list_coastal-shipping{ display: none;}
.heavy-equipment-transport .list_heavy-equipment-transport{ display: none;}
.heavy-top-text {position: absolute!important; left: 50%; transform: translateX(-50%); padding-bottom: 5rem!important; width: 100%;}

.crane .fleet-lineup .description{ width:100%; font-family: var(--content-brand-font-gos); margin-bottom: 2.4rem; border-top: 1px solid #000;}
.crane .fleet-lineup .description h2 { text-align: left;}
.crane .fleet-lineup .description h2 .en{ font-size: 4.2rem; margin-right: 0.8rem; font-weight: 600; color: var(--content-brand-blue2); font-family: var(--content-brand-font);}
.crane .fleet-lineup .description h2 .ja{ font-size: 2.4rem; font-family: var(--content-brand-font);}
.crane .fleet-lineup .description p{ font-size: 1.6rem; line-height: 2; letter-spacing: 0.25rem; font-family: var(--content-brand-font);}
.crane .list_heavy-equipment-transport{ display: none;}

.other-services .lineup .wrap .text{ width:100%}
.other-services .lineup .wrap .text .btn{ max-width:32rem; }
.other-services .list_other-services{ display: none;}

.warehouse-packing .list_warehouse-packing{ display: none;}

.packaging-content {
	position: relative;
	width: min(100%, 1047px);
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 1.5rem;
	line-height: calc(26 / 15);
	color: #231815;
}

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

.packaging-lead {
	font-family: "Noto Serif JP", serif;
	font-size: 1.9rem;
	line-height: calc(38 / 19);
}

.flow {
	margin-top: 30px;
	border-top: 1px solid #05384d;
}
.flow > li {
	position: relative;
	padding: 40px 0 50px;
	border-bottom: 1px solid #05384d;
	
	font-family: "Noto Serif JP", serif;
	font-size: 1.7rem;
	line-height: calc(29 / 17);
}
.flow > li:not(:last-of-type) {
	
}
.flow > li::before {

}
.flow > li:not(:last-of-type)::after {
	content: "";
	position: absolute;
  bottom: -44px;
  left: 50%;
  width: 50px;
  height: 50px;
  border-right: 1px solid #05384d;
  border-bottom: 1px solid #05384d;
  transform: rotate(45deg) translateX(-50%);
  background-color: #fff;
}
.flow > li .flow-step {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.5rem;
	width: fit-content;
	margin: 0 auto 0.8rem;
	font-size: 4.3rem;
    font-weight: 400;
	color: #05384d;
	text-align: center;
}
.flow > li .flow-step .flow-step__num {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
	width: 6.1rem;
	height: 6.1rem;
	background-color: #05384d;
	border-radius: 50%;
	color: #fff;
}
.flow > li .flow-packaging {
	margin-bottom: 1.2rem;
	font-size: 2.4rem;
    font-weight: 500;
	line-height: calc(42 / 24);
	letter-spacing: 0.2em;
	color: #05384d;
	text-align: center;
}
.flow > li .flow-text {
	width: min(100%, 475px);
	margin: 0 auto;
    font-weight: 500;
    color: #000;
}

.packing {
	display: grid;
	gap: 50px min(calc(45 / 1047 * 100%), 45px);
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	margin: 50px auto 0;
}
.packing li {
	
}
.packing li .packing-img {
	position: relative;
	margin-bottom: 2rem;
}
.packing li .packing-caption {
	position: absolute;
	bottom: 0;
	width: 100%;
	font-size: 1.7rem;
	line-height: calc(35 / 20);
	color: transparent;
	text-align: center;
	
}
.packing li .packing-caption::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #05384d;
  mix-blend-mode: multiply;
	
}
.packing li .packing-caption p {
	position: relative;
	display:inline-block;
    padding:5px;
	color: #fff;
    font-weight: 500;
    letter-spacing: 1.5px;
}
.packing p {font-weight: 500;}

.packing-list .list_warehouse-packing {
  display: none;
}


.warehouse-content {
	position: relative;
	max-width: 1050px;
    width: 90%;
	margin: 0 auto;
	padding: 4.8rem 0;
	box-sizing: border-box;
/*	font-family: "Noto Sans JP", sans-serif;*/
	font-size: 1.5rem;
	line-height: calc(26 / 15);
	color: #231815;
}

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

.warehouse-headline01 {
	width: fit-content;
	margin-bottom: 3rem;
    padding: 0 1rem;
	border: 1px solid #05384d;
/*	font-family: "Noto Sans JP", sans-serif;*/
	font-size: 2.4rem;
	font-weight: bold;
	line-height: calc(42 / 24);
	letter-spacing: 0.2em;
	color: #05384d;
}
.warehouse-headline02 {
	font-size: 2.2rem;
	color: #05384d;
  font-weight: bold;
}

.warehouse-lead {
	font-size: 1.9rem;
    font-weight: 400;
	line-height: calc(38 / 19);
}

.warehouse-content .list_warehouse-packing {
	display: none;
}

.warehouse-content h4 {
	margin-top: 6rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid #05384d;
	color: #05384d;
	font-size: 2.2rem;
/*	font-family: "Noto Sans JP", sans-serif;*/
	font-weight: bold;
	letter-spacing: 0.1em;
}

.warehouse-lineup {
	list-style: none;
	padding: 0;
	margin-bottom: 6rem;
}

.warehouse-item {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	padding: 4rem 0;
	border-bottom: 1px solid #05384d;
	gap: 40px;
}

.warehouse-item:last-child {
	border-bottom: none;
}

.warehouse-item .text {
	width: 32%;
}

.warehouse-item h5 {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	margin-bottom: 2rem;
	color: #05384d;
/*	font-family: "Noto Sans JP", sans-serif;*/
	font-size: 2.4rem;
	font-weight: 500;
	line-height: 1;
}

.warehouse-item h5 i {
/*	font-family: 'Oswald', sans-serif;*/
	font-size: 6rem;
	color: #05384d;
    opacity: 0.3;
	font-style: normal;
	font-weight: bold;
}

.warehouse-item h5 span {
	font-weight: bold;
    letter-spacing: 2px;
}

.warehouse-item .address {
	font-size: 1.5rem;
	margin-bottom: 1.5rem;
	font-weight: bold;
}

.warehouse-item .data {
	list-style: none;
	padding: 0;
	color: var(--content-brand-blue2);
}

.warehouse-item .data li {
	font-size: 1.6rem;
	line-height: 1.8;
	position: relative;
	padding-left: 1.2em;
	font-weight: 500;
    color: #05384d;
    letter-spacing: 2px;
}

.warehouse-item .data li::before {
	content: "・";
	position: absolute;
	left: 0;
}

.warehouse-item figure {
	width: 65%;
	display: flex;
	gap: 15px;
}

.warehouse-item figure img {
	width: calc(50% - 7.5px);
	object-fit: cover;
	aspect-ratio: 4 / 3;
}

@media screen and (max-width: 768px) {
	.warehouse-item {
		flex-direction: column;
		gap: 20px;
	}
	.warehouse-item .text,
	.warehouse-item figure {
		width: 100%;
	}
	.warehouse-item figure img {
		aspect-ratio: 3 / 2;
	}
}


.customs-content {
	position: relative;
	width: min(100%, 1050px);
	margin: 0 auto;
	padding: 2.4rem;
	box-sizing: border-box;
/*	font-family: "Noto Sans JP", sans-serif;*/
	font-size: 1.7rem;
	line-height: calc(32 / 17);
	color: #231815;
	background-color: #efefef;
  margin-bottom: 2.4rem;

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

.customs-clearance-box {
	margin-bottom: 2.5rem;
	padding: 45px 25px;
}

.customs-content .headline01 {
	margin-bottom: 3.5rem;
	font-family: "Noto Serif JP", serif;
	font-size: 3rem;
	text-align: center;
  font-weight: 500;
}
.customs-content .headline02 {
	margin-bottom: 4rem;
	font-family: "Noto Serif JP", serif;
	font-size: 2.4rem;
    font-weight: 500;
}

.customs-clearance-box .figure {
	width: min(100%, 882px);
	margin: 2.8rem auto 5rem;
}

.customs-clearance__aeo {
	display: flex;
	justify-content: center;
	gap: 4rem;
	border-top: 1px solid #b5b5b6;
	padding: 6rem 0 0;
}
.customs-clearance__img {
	width: min(calc(212 / 882 * 100%), 212px);
}
.customs-clearance__content {
	width: min(calc(490 / 882 * 100%), 490px);
}

.custom {
	padding: 2.5rem 0;
	border-top: 1px solid #b5b5b6;
    border-bottom: 1px solid #b5b5b6;
    width: min(100%, 1050px);
	margin: 0 auto;
}
.custom-wrap {
	display: flex;
	gap: 3.5rem;
}
.custom-content {
	width: min(calc(575 / 1050 * 100%), 575px);
}

.custom-content .custom-content__item {
	display: flex;
  align-items: baseline;
	gap: 0 1rem;
	font-family: "Noto Serif JP", serif;
	font-size: 2.6rem;
  font-weight: 500;
}
.custom-content .custom-content__item .custom-content__num {
	font-size: 5.6rem;
}
.custom-img {
	width: min(calc(434 / 1050 * 100%), 434px);
}

@media screen and (max-width: 600px) {
	.customs-clearance__aeo {
		flex-wrap: wrap;
	}
	.customs-clearance__img {
		width: min(100%, 212px);
		margin: 0 auto;
	}
	.customs-clearance__content {
		width: 100%;
	}

	.custom-wrap {
		flex-wrap: wrap;
	}
	.custom-content {
		width: 100%;
	}
	.custom-img {
		width: min(100%, 434px);
		margin: 0 auto;
	}

}

.customs-clearance-box .list_customs-clearance{
  display: none;
}


.about .page-contents{background-image: url(images/bg_profile-s.jpg); background-size: contain; background-position:top center; background-repeat: no-repeat;}
.profile { padding:7.2rem 0; }
.profile p{ width:90%; max-width:1000px; margin: 0 auto; line-height: 2; margin-bottom: 7.2rem; font-size: 1.6rem;}
.profile .company-table{ width:90%; max-width:694px; margin:0 auto; font-size:1.7rem;}
.profile .company-table .company-label{ padding:1.6rem; border-top:2px solid var(--content-brand-blue2); padding-right: 4.8rem; white-space: nowrap; font-weight: 500; color: var(--content-brand-blue2);}
.profile .company-table .company-value{ padding:1.6rem; border-top:2px solid #aaaaaa; font-weight: 400;}
.profile .company-table .company-value ul{ display: flex; flex-wrap: wrap; gap: 1.6rem;}
.profile .company-table .company-value li{ white-space: nowrap;}
.profile .company-table .company-value .staffing-business-item{ display: flex; align-items: center; gap: 2rem; flex-wrap: wrap;}
.profile .company-table .company-value .staffing-business-item a{ max-width: 283px; width: 100%; justify-content: flex-start; padding: 0.4rem 2rem; color: #000; border: 1px solid #000;}
.profile .company-table .company-value .staffing-business-item a:hover{ color: #fff; }
.access .inner{ padding: 7.2rem 0;}
.access .office-table{ width:90%; max-width:1080px; margin:0 auto 11rem; font-size:1.6rem;}
.access .office-table th,
.access .office-table td{vertical-align: middle;}
.access .office-table .office-category{ padding:1.6rem; border-top:2px solid var(--content-brand-blue2); padding-right: 1.6rem; white-space: nowrap; font-weight: bold; color: var(--content-brand-blue2);}
.access .office-table .office-name{ padding:1.6rem; border-top:2px solid var(--content-brand-blue2); padding-right: 2.4rem; white-space: nowrap; font-weight: 400; color: var(--content-brand-blue2); font-family: var(--content-brand-font-gos); font-weight: 500;}
.access .office-table .office-detail{ padding:1.6rem; border-top:2px solid #aaaaaa;}
.access .office-table .office-detail .wrap{ display: flex; align-items:center; justify-content: space-between;}
.access .office-table .btn{ padding: 0.5rem 5.35rem; font-size: 1.6rem; letter-spacing: 3px; font-weight: 400;}
.access-banner { position: relative; width: 90%; max-width: 1050px; margin: 0 auto; font-size: 4.5rem;}
.access-banner:nth-of-type(2) { margin: 48px auto;}
.access-banner a { color: #fff;}
.access-banner a:after { content: '>'; display: block; margin-left: 1.6rem; transition: 0.5s all; line-height: 1; transform: translateY(-0.2rem); position: absolute; bottom: 1rem; right: 1.6rem; font-size: 2.4rem;}
.access-banner strong { position: absolute; bottom: 0; right: 6%;}
.access-banner strong span { font-size: 2.3rem;}

.introduction{ padding:7.2rem 0 0 0; }
.introduction p{ width:90%; max-width:1000px; margin: 0 auto; line-height: 2; margin-bottom: 0; font-size: 1.6rem;}
.introduction p strong{ font-size: 3.6rem; color: var(--content-brand-blue); font-weight: 300; display: block;}

.contribution .page-contents{background-image: url(images/bg_contribution.jpg); background-size: contain; background-position:top center; background-repeat: no-repeat;}
.contribution .lineup .wrap{ flex-direction: column;}
.contribution .lineup .text{ width:100%}
.contribution .lineup .image{ width:100%; display: flex; gap: 2.4rem; justify-content: space-between;}
.contribution .lineup .image figure{display: block;}
.contribution .lineup .image figure img{display: block;}
.contribution .lineup .image figure figcaption{font-size: 1.6rem; font-weight: 500; font-family: var(--content-brand-font-gos);}
.contribution .lineup figure{ width:100%; display: flex; gap:2.4rem; justify-content: space-between;}
.contribution .lineup figure img{ width: 100%;}
.contribution .lineup figure img.wide{ width: 100%;}
.contribution .lineup .text h2 i{ color: #c9caca;}
.contribution .lineup .block{ border-bottom: none; margin-bottom: 6.4rem;}
.m-bottom00 { margin-bottom: 0!important;}

.gx .page-contents{background-image: url(images/bg_gx-s.jpg); background-size: contain; background-position:top center; background-repeat: no-repeat;}
.gx .lineup .wrap{ flex-direction: column;}
.gx .lineup .text{ width:100%}
.gx .lineup .image{ width:100%; display: flex; gap:2.4rem; justify-content: space-between;}
.gx .lineup figure{ width:calc(50% - 1.2rem)}
.gx .lineup figcaption{ font-size:1.6rem; font-weight: 400; font-family: var(--content-brand-font-gos);}
.gx .lineup .text h2 i{ color: #c9caca;}
.gx .lineup .block{ border-bottom: none; margin-bottom: 6.4rem;}

.logitech .page-header h1 i{ font-size:2.4rem; letter-spacing: 0.24rem; padding:0.8rem; border:1px solid #ffffff; line-height: 1; width:fit-content}
.logitech .page-header .en{ font-weight: 600; }
.logitech .logitech_images{ display: flex; position: relative;; background-color: #000000;}
.logitech .logitech_images img{ width:25%; opacity: 0.8;}
.logitech .logitech_images .catchcopy{ text-shadow: 2px 2px 5px black; color: #ffffff; position: absolute; font-size:4.8rem; letter-spacing: 0.24rem; bottom:0.8rem; width:100%; text-align: center; z-index: 5;}
.logitech .about_logitech{ padding:7.2rem 0; background-image: url(images/bg_about_logitech.jpg); background-size: cover; background-position: 27%; background-repeat: no-repeat;}
.logitech .about_logitech .flex-wrap{ display: flex; justify-content: flex-end; align-items: center; max-width:1000px; width: 95%; margin: 0 auto;}
.logitech .about_logitech .flex-wrap .text{ width:50%; color: #ffffff;}
.logitech .about_logitech .flex-wrap p{ margin-bottom: 2.4rem; line-height: 2;}
.logitech .about_logitech .flex-wrap .btn{ border:1px solid #ffffff}
.logitech .service_logitech{ padding:7.2rem 0;}
.logitech .service_logitech .block{ border-bottom: none; margin-bottom: 6.4rem;}
.logitech .service_logitech .block .text{ max-width:1000px; margin: 0 auto; position: relative;}
.logitech .service_logitech .block .text p{ line-height: 2; font-size:1.8rem}
.logitech .service_logitech .std{ text-align: center;}
.logitech .service_logitech .std i{ margin: 0 auto 0.8rem auto;}
.logitech .lineup .wrap{ flex-direction: column;}
.logitech .lineup .text{ width:100%}
.logitech .lineup .block{ border-bottom: none; margin-bottom: 6.4rem;}
.logitech .lineup .image{ width:100%; display: flex; gap:2.4rem; justify-content: space-between; max-width: 1000px;}
.logitech .lineup figure{ width:calc(50% - 1.2rem)}
.logitech .lineup figcaption{ font-size:1.6rem; font-family: var(--content-brand-font-gos);}
.logitech .lineup .text h2 i{ color: #c9caca;}
.logitech .service_logitech .block .text .btn{ position: absolute; right:0; top:2.4rem;}

.page-header h1 i .bordered{ font-size:1.8rem; letter-spacing: 0.24rem; padding:0.8rem; border:1px solid #ffffff; line-height: 1; width:fit-content; display: inline-block;}

.vehicle .page-header h1{ margin-bottom: 0;}
.vehicle-lineup{ width:95%; max-width: 1080px; margin:0 auto; padding:7.2rem 0;}
.vehicle-lineup .inner hr{ width:100%; margin-bottom: 3.2rem;}
.vehicle-lineup .inner{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.vehicle-lineup .block{ width:47.5%; font-family: var(--content-brand-font-gos); margin-bottom: 3.2rem;}
.vehicle-lineup .block.wide{ width:100%;}
.vehicle-lineup h2{font-size: 2.1rem; padding:1.6rem 0; color: var(--content-brand-deepblue); font-weight: 500; }
.vehicle-lineup p{font-family: var(--content-brand-font); font-size: 1.6rem; line-height: 2;}
.vehicle-lineup dt{ background-color: var(--content-brand-deepblue); text-align: center; color: #ffffff; font-size: 2.0rem; padding: 0.8rem 0; font-weight: 400;}
.vehicle-lineup dd{ padding:0.8rem 0; border-bottom: 1px solid var(--content-brand-deepblue); font-size:2.0rem; font-weight: 500;}
.vehicle-lineup dd label{ font-size:1.6rem; color: var(--content-brand-gray);display: block; font-weight: 400;}

.about-logitech .page-header .text h1 strong .en{ font-weight: 500;}
.about-logitech .page-header h1{ margin-bottom: 0;}
.about-logitech .profile p{ margin-bottom: 2.4rem;}
.about-logitech .profile figure{ max-width:1000px; margin: 0 auto 4.8rem auto;display: flex; justify-content: space-between;}
.about-logitech .profile figure img:nth-child(1){ width:33%;}
.about-logitech .profile figure img:nth-child(2){ width:65%;}
.about-logitech .profile table{ max-width: 880px; margin: 0 auto;}
.about-logitech .company-address{ display: flex; justify-content: space-between; width:100%}
.about-logitech .profile .company-table { font-family: var(--content-brand-font-gos);}
.about-logitech .profile .company-table .company-label{ border-color: var(--content-brand-black-logitech); color: var(--content-brand-black-logitech);}  
.about-logitech .profile .company-table .company-value ul{ flex-direction: column; gap:1.2rem}

.about-logitech .inpage-title{ background-image: url(images/bg_logitech_narrow.jpg);}
.about-logitech .inpage-title .en{ font-weight: 500;}
.about-logitech .history-list{ max-width: 1200px; margin: 0 auto;}
.about-logitech .history-list .history-item{ display: flex; justify-content: center; }
.about-logitech .history-list .history-item .history-item-date{ background-color: var(--content-brand-black-logitech); order:2; width:15%; padding:2.4rem 0; color: #ffffff; font-size:6.4rem; text-align: center; line-height: 1.2;}
.about-logitech .history-list ul li:nth-last-child(1) .history-item .history-item-date{ padding-bottom: 6rem; }
.about-logitech .history-list .history-item .history-item-date i{ font-family: var(--content-brand-font-gos); font-size: 1.8rem; display: block;}
.about-logitech .history-list .history-item .history-item-content{ width:42.5%; padding:2.4rem 1.6rem;}
.about-logitech .history-list .history-item .left{ order:1}
.about-logitech .history-list .history-item .history-item-content.left h3{text-align: right;}
.about-logitech .history-list .history-item .right{ order:3}
.about-logitech .history-list .history-item .history-item-content h3{ font-size:2.8rem; font-weight: 400; padding:0.8rem 0;}
.about-logitech .history-list .history-item .history-item-content p{ font-size:1.6rem; font-weight: 400; line-height: 2; font-family: var(--content-brand-font-gos); margin-bottom: 2.4rem;}
.about-logitech .history-list .history-item .history-item-content figure:not(:last-child){ margin-bottom: 2.4rem;}
.about-logitech .history-list .history-item .history-item-content .wrap{ display: flex; justify-content: flex-start; flex-direction: row-reverse; max-width: 425px; justify-self: flex-end;}
.about-logitech .history-list .history-item .history-item-content .wrap .text{ width:60%}
.about-logitech .history-list .history-item .history-item-content .wrap figure{ width:40%}
.about-logitech .safety-initiative .inner{ max-width: 1000px; margin: 0 auto; padding:3.2rem}
.about-logitech .safety-initiative h2{ font-size: 3.2rem; font-weight: 500; margin-bottom: 1.6rem;}
.about-logitech .safety-initiative .introduction{ padding:0;margin:0 auto 2.4rem auto; font-size: 1.6rem; line-height: 2; border-bottom: 1px solid #000000; padding-bottom: 2.4rem;}
.about-logitech .safety-initiative h3{ font-size:3.2rem; font-weight: 400; padding:0.8rem 0; font-family: var(--content-brand-font-gos); margin-bottom: 2.4rem;}
.about-logitech .safety-initiative h3 .bordered{ border: 1px solid #000000; padding: 0.4rem 0.8rem; font-size: 2.0rem; display: block; width:fit-content; margin-bottom: 1.6rem;}
.about-logitech .safety-initiative li{ display: flex; justify-content: space-between; gap: 2.4rem; align-items: center; margin-bottom: 2.4rem;}
.about-logitech .safety-initiative li p{ font-size: 1.6rem; line-height: 2; font-family: sans-serif; font-weight: 400;}
.about-logitech .safety-initiative li figure{ width:12rem}
.about-logitech .safety-initiative li h4{font-size:3.2rem; font-weight: 400; padding:0.8rem 0;}
.about-logitech .safety-initiative li .text{ width:calc(100% - 12rem)}
.recruit .recruit_images{ display: flex; position: relative; justify-content: center; align-items: center; background-color: #000000;}
.recruit .recruit_images img{ width:25%; opacity: 0.8;}
.recruit .recruit_images p{ color: #ffffff; position: absolute; writing-mode: vertical-rl; font-size: 3.4rem;}
.recruit .introduction_recruit{ padding:7.2rem 0 12rem; background-image: url(images/bg_recruit_introduction.jpg); background-size: cover; background-position:bottom center; background-repeat: no-repeat;}
.recruit .introduction_recruit .flex-wrap{ display: flex; justify-content: flex-end; align-items: center; max-width:1000px; margin: 0 auto;}
.recruit .introduction_recruit .flex-wrap .text{ width:53%; color: #ffffff;}
.recruit .introduction_recruit .flex-wrap h2{ font-size:3.2rem; font-weight: 500;}
.recruit .introduction_recruit .flex-wrap p{ margin-bottom: 2.4rem; line-height: 2;}
.recruit .introduction_recruit .flex-wrap p:nth-last-child(1){ font-size: 2.4rem;}

/*---社長メッセージ---*/

.recruit .page-message { margin-top: 5px;}
.recruit .page-message .inner { padding: 10rem 0px; background-image: url(images/bg_recruit_message-ss.jpg); background-size: cover; background-position:top left; background-repeat: no-repeat;}
.recruit .page-message .flex-wrap { display: flex; justify-content: flex-end; align-items: center; max-width:675px; margin: 0 auto 0 43%; padding: 0 3rem;}
.recruit .page-message .recruit-sp-item {display:none;}
.recruit .page-message .flex-wrap .text{ font-size: 1.7rem; line-height: 2;}
.recruit .page-message .flex-wrap .text div { font-family: var(--content-brand-font-gos); font-weight: 500; display: flex; justify-content: end; align-items: center; margin-top: 2rem;}
.recruit .page-message .flex-wrap .text div img { max-width: 93px; width: 80%; margin-left: 1.5rem; }

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

.recruit .occupation{ padding: 5px 0 7.2rem;}
.recruit .occupation .page-contents{background-image: url(images/bg_profile.jpg); background-size: contain; background-position: top center; background-repeat: no-repeat;}
.recruit .occupation .inner{max-width:1000px; width: 90%; margin: 0 auto; }


/*------強み------*/
.recruit .occupation .strength-sec01 {display: flex; justify-content: space-between; padding: 6.7rem 0 11.5rem;}
.recruit .occupation .strength-sec01-box {width: 31.6%;}
.recruit .occupation .strength-sec01-imgbox {position: relative;}
.recruit .occupation .strength-sec01-imgbox .strength-sec01-title {position: absolute; bottom: 0; left: 0; width: 100%; padding: 3.15rem 0; background-color: #0000009c;font-size: 2.2rem; color: #fff; text-align: center;}
.recruit .occupation .strength-sec01-imgbox .strength-sec01-title p { position: absolute; top: -60%; left: 50%; transform: translateX(-50%);font-size: 8rem; line-height: 1; color: #fff; text-align: center;}
.recruit .occupation .strength-sec01-textbox {font-size:1.7rem; line-height: 1.6; margin-top: 1rem; /*font-family: sans-serif;*/ font-weight: 400;}

/*------------*/
.recruit .occupation .block{ font-family: var(--content-brand-font-gos);}
.recruit .occupation .block h3{ font-size:1.8rem; font-weight: 500; font-family: serif; padding:0.8rem; line-height: 1; color: #ffffff; margin-bottom: 2.4rem;}
.recruit .occupation .block.clerical h3{background-color: #00a29a;}
.recruit .occupation .block.operational h3{background-color: #3b5f9b;}
.recruit .occupation .block ul{ display: flex; flex-wrap: wrap; margin-bottom: 2.4rem;}
.recruit .occupation .block li{ width:25%; border-left: 1px solid #000000; margin-bottom: 2.4rem; padding:0 1.6rem}
.recruit .occupation .block li:nth-child(4n){ border-right: 1px solid #000000;}
.recruit .occupation .block li:last-child{ border-right: 1px solid #000000;}
.recruit .occupation .block li figure{ width:75%; margin:0 auto}
.recruit .occupation .block li h4{ font-size:1.8rem; font-weight: 500; padding:0.8rem 0; line-height: 1; text-align: center; font-family: serif;}
.recruit .occupation .block li p{ font-size:1.4rem; font-family: serif; font-weight: 500; letter-spacing: 1px;}
.recruit .interview{ background-color: #efefef; padding:7.2rem 0}
.recruit .interview h2{ max-width: 1000px; margin: 0 auto; padding: 7.2rem 0 2.4rem 0;}
.recruit .interview ul{ width:calc(100vw - (100vw - 100rem) / 2); margin:0 0 2.4rem auto}
.recruit .interview ul li{ position: relative; margin-bottom: 2.4rem;}
.recruit .interview ul li figure{ height: 24rem;}
.recruit .interview ul li figure img{ height: 100%; object-fit: cover; object-position: right;}
.recruit .interview ul li .text{ color: #ffffff; position: absolute; bottom: 0; left: 0; font-family: var(--content-brand-font-gos); padding-top: 1.6rem;}
.recruit .interview ul li h3{ font-weight: 400; margin-bottom: 2.4rem; padding-left: 1.6rem;}
.recruit .interview ul li h3 small { font-size: 1.4rem; display: block; margin-bottom: 1.6rem;}
.recruit .interview ul li h3 strong{ font-size:2.4rem;}
.recruit .interview ul li p{ font-size: 1.4rem; font-weight: 400; line-height: 1.6; display: flex; align-items: center; width:100%; min-width:400px; padding-left: 1.6rem}
.recruit .interview ul li p i{font-family: var(--content-brand-font-en); margin-right: 1.6rem; font-weight: 500; font-size:2.8rem; padding:1.6rem 0}
.recruit .interview ul li.operational p{ background-color: rgba(59,95,155,0.5 );}
.recruit .interview ul li.clerical p{ background-color: rgba(0,162,154,0.5 );}
.recruit .interview .btn-wrap{ max-width:1000px; margin:0 auto; padding:2.4rem 0 0 0; display: flex; justify-content: center; gap:1.6rem;}
.recruit .interview .btn-wrap .btn2{ width:50%; text-align: center; font-family: var(--content-brand-font-gos); font-weight: 400; letter-spacing: 2px;}
.recruit_entrance{ padding:3.2rem 0; margin: 2rem 0; background-image: url(images/bg_top_recruit_b-s.jpg); background-size: cover; background-position: center;}
.recruit_entrance .inner{ width:95%; max-width:1080px; margin: 0 auto; display: flex; justify-content: center; align-items: center}
.recruit_entrance .text{ color: #ffffff; width:fit-content}
.recruit_entrance .text h2 { text-align: center;}
.recruit_entrance .text h2 i{ font-size:5.4rem; font-family: var(--content-brand-font-en); font-weight: 400; line-height: 1; border:1px solid #ffffff; padding:0.8rem;display: block; width:fit-content; margin:0 auto}
.recruit_entrance .text h2 strong{ display: block; font-size: 5.0rem; padding:0.4rem 0.8rem; text-align: center;}
.recruit_entrance .text p{ font-size:2.4rem; font-weight: 400;font-family: var(--content-brand-font-gos); text-align: center;}
.recruit_entrance .text .btn{ margin: 1.6rem auto 0 auto;}
.recruit_entrance-a { background-image: url(images/bg_top_recruit-a-s.jpg);}

.message .greeting .inner{ position: relative; display: flex; justify-content: center; align-items: center; padding-bottom: 10.8rem;}
.message .greeting .inner figure{ position: relative; }
.message .greeting .inner figure img{min-height:40rem; object-fit: cover; object-position: center;}
.message .greeting .inner .text{ width:90%; max-width:1080px; margin: 0 auto; position: absolute; display: flex; justify-content: flex-end; align-items: center;}
.message .greeting .inner .text p{width:66%; font-size:1.8rem; line-height: 2;}
.message .greeting .inner .text p .name{display: flex; text-align: right; justify-content: flex-end; align-items: center; gap:1.6rem; margin-top: 1.6rem;}
.message .greeting .inner .text p .name img{ display: block; width:10rem;}
.message .strength .inner{ position: relative; padding:28rem 0 10.8rem 0;}
.message .strength .bg{ position: absolute; top:0; left:0; width:100%;}
.message .strength ul{ display: flex; justify-content: space-between; max-width:1000px; margin:0 auto; width:90%}
.message .strength li{ width:31%}
.message .strength li figure{ position: relative; margin-bottom: 1.6rem;}
.message .strength li figcaption{ position: absolute; bottom:0; left:0; width:100%; padding:3.2rem; background-color: rgba(0, 0, 0, .75); color: #ffffff; font-size: 2.0rem; text-align: center;}
.message .strength li figcaption i{ display: block; font-size: 8.0rem; line-height: 1; text-align: center;margin-top: -8rem; transform: translateY(-0.8rem);}
.message .strength li .text{ font-size:1.6rem;}

.job-list{ padding: 4.8rem 0; font-family: var(--content-brand-font-gos);}
.job-list .inner{ width:90%; max-width:1000px; margin:0 auto;}
.job-list h2{ font-size: 2.4rem; color: #ffffff; padding:0.8rem 1.6rem; width: fit-content; margin-bottom: 2.4rem;}
.job-list h2.newgrad{ background-color: #f09195;}
.job-list h2.ongoing{ background-color: #5fc1c7;}
.job-list ul { margin-bottom: 6.4rem;}
.job-list ul li{ margin-bottom: 1.6rem;}
.job-list ul li h3{ font-size: 1.8rem; color: #ffffff; background:var(--content-brand-gradation-v);line-height: 1; margin-bottom: 0.8rem;}
.job-list ul li h3 label{ cursor: pointer; display: flex; padding:1.6rem; justify-content: space-between;}
.job-list ul li h3 label::after{content: '+'; color: #ffffff; font-size: 2.4rem; font-weight: bold;}
.job-list ul li:has(input:checked) h3 label::after{content: '−';}
.job-list ul li h3 input{ display: none;}
.job-list ul li .post-content{ display: none;}
.job-list ul li:has(input:checked) .post-content{ display: block;}
.job-list ul li table{ border-top: 1px solid var(--content-brand-gray);}
.job-list ul li th{ border-bottom: 1px solid var(--content-brand-gray); vertical-align: middle; padding: 2rem 0.5em; text-align: center; width:16rem; background-color:#efefef; font-size:1.8rem}
.job-list ul li td{ border-bottom: 1px solid var(--content-brand-gray); vertical-align: middle; padding: 2rem 1.0em; font-size:1.6rem; font-weight: 500;}

.interview-list{ padding:4.8rem 0}
.interview-list .inner{ width:90%; max-width:1000px; margin:0 auto; font-family: var(--content-brand-font-gos);}
.interview-list h2{ font-size: 2.4rem; color: #ffffff; padding:0.8rem 1.6rem; width: fit-content; margin-bottom: 2.4rem;}
.interview-list ul { margin-bottom: 6.4rem;}
.interview-list li.interview_item{ margin-bottom: 1.6rem;}
.interview-list li.interview_item h3{ font-size: 1.8rem; color: #ffffff; background:var(--content-brand-gradation-v);line-height: 1; margin-bottom: 0.8rem;}
.interview-list li.interview_item h3 label{ cursor: pointer; display: flex; padding:1.6rem; justify-content: space-between;}
.interview-list li.interview_item h3 label::after{content: '+'; color: #ffffff; font-size: 2.4rem; font-weight: bold;}
.interview-list li.interview_item:has(input:checked) h3 label::after{content: '−';}
.interview-list li.interview_item h3 input{ display: none;}
.interview-list li.interview_item h3 .en{ font-family: var(--content-brand-font-en); font-size:2.8rem; margin-right: 1.6rem;}
.interview-list li.interview_item h3 .job{ font-size:1.6rem; font-weight: 500;}
.interview-list li.interview_item h3 .year{ font-size:1.4rem; font-weight: 500;}
.interview-list li.interview_item h3 .school{ font-size:1.4rem; font-weight: 500;}
.interview-list li.interview_item .post-content{ display: none;}
.interview-list li.interview_item:has(input:checked) .post-content{ display: block;}
.interview-list .interview_mv{ position: relative; margin-bottom: 2.4rem;}
.interview-list .interview_mv img {width:100%; height:auto; aspect-ratio: auto;}
.interview-list .interview_mv figcaption{ position: absolute; top:1.6rem; left:1.6rem;color: #ffffff;}
.interview-list .interview_mv figcaption .label.en{ font-size:2.8rem; font-family: var(--content-brand-font-en); font-weight: 500; text-shadow: 0 0 5px #000;}
.interview-list .interview_mv figcaption .ttl{ font-size:2.4rem; font-weight: 400; margin-bottom:2.4rem; text-shadow: 0 0 5px #000;}
.interview-list .interview_mv figcaption .name.en{font-size:1.8rem; font-family: var(--content-brand-font-en); font-weight: 500; text-shadow: 0 0 5px #000;}
.interview-list .interview_mv figcaption .data{ font-size:1.5rem; font-weight: 400; text-shadow: 0 0 5px #000;}
.introduction_column_list { margin-bottom: 7.2rem;}
.introduction_column_list .block{ display: flex; margin-bottom: 2.4rem;}
.introduction_column_list .block:nth-child(even){ flex-direction: row-reverse;}
.introduction_column_list .block .block__txt{ width:50%; padding:1.6rem}
.introduction_column_list .block .block__txt h4{ font-size:2.4rem; font-weight: 500; margin-bottom: 1.6rem;}
.introduction_column_list .block .block__txt p{ font-size:1.6rem; font-weight: 400; line-height: 1.5;}
.introduction_column_list .block .block__img{ width:50%}
.interview_qanda_list{ background-color:#efefef; padding:2.4rem 2.4rem 0 2.4rem;}
.interview_qanda_list h4{ text-align: center; line-height: 1; font-family: var(--content-brand-font-en); font-size:4.4rem; color: var(--content-brand-blue2); font-weight: 400; display: flex; justify-content: center; align-items: center; gap:0.8rem; margin-bottom: 2.4rem;}
.interview_qanda_list .question{ background-color: var(--content-brand-blue2); color: #ffffff; width:7.4rem; height:7.4rem; border-radius:50%; display: flex; justify-content: center; align-items: center; border:4px solid var(--content-brand-blue2); min-width: 7.4rem;}
.interview_qanda_list .answer{ background-color: #ffffff; color: var(--content-brand-blue2); width:7.4rem; height:7.4rem; border-radius:50%; display: flex; justify-content: center; align-items: center; border:4px solid var(--content-brand-blue2); min-width: 7.4rem;}
.interview_qanda_list dl i{text-align: center; line-height: 1; font-family: var(--content-brand-font-en); font-size:4.4rem; color: var(--content-brand-blue2); font-weight: 400; }
.interview_qanda_list dt{ display: flex; justify-content: flex-start; align-items: center; gap:0.8rem; margin-bottom: 1.6rem;}
.interview_qanda_list dt .question_text{ font-size: 2.4rem; font-weight: 500;}
.interview_qanda_list dd{  display: flex; justify-content: flex-start; align-items: flex-start; gap:0.8rem; padding-bottom: 3.2rem; margin-bottom: 1.6rem; border-bottom: 1px solid var(--content-brand-gray);}
.interview_qanda_list dd:last-child{ border-bottom: none;}
.interview_qanda_list dd .answer_text{ font-size: 1.8rem; font-weight: 400; transform: translateY(1.6rem);}
.schedule_list { padding:7.2rem 0 0 0}
.schedule_list h4{ font-size: 2.4rem; font-weight: 500; text-align: center; margin-bottom: 3.2rem;}
.schedule_list h4:before{ content:''; display: block; width:6.4rem; height:6.4rem; background-image: url(images/icon_schedule.webp); margin: 0 auto 0.8rem auto; background-size: contain; background-repeat: no-repeat;}
.schedule_list ul{ margin-bottom: 7.2rem;}
.schedule_list li{ margin-bottom: 1.6rem; display: flex; justify-content: space-between;}
.schedule_list li .clock{ width:8.8rem; min-width: 8.8rem; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.schedule_list li .wrap{ display: flex; justify-content: space-between; width:calc(95% - 8.8rem);}
.schedule_list li:not(:last-child) .clock:after{ content:''; display: block; width:0.4rem; height:100%; background-color: #000000; transform: translateY(0.8rem);}
.schedule_list li figure{ width:40%; padding-bottom: 2.4rem;}
.schedule_list li .text{ width:56%; padding-bottom: 2.4rem;}
.schedule_list li .text .timestamp{ font-size: 2.4rem; margin-bottom: 0.8rem; color: var(--content-brand-blue2); font-weight: 400; font-family: var(--content-brand-font-en);}
.schedule_list li .text h5{ font-size: 2.4rem; font-weight: 500; margin-bottom: 0.8rem;}
.schedule_list li .text p {font-weight: 400;}

.privacy .inner{padding: 5rem 0;}
.privacy-box {width: 90%; max-width: 1000px; margin: 0 auto; line-height: 2; margin-bottom: 7.2rem; font-size: 1.7rem;}
.privacy-box .privacy-box-title {font-size: 2rem; font-weight: bold; color: #ffffff; background: #00a29a; line-height: 1; margin: 5rem auto 0.8rem; padding: 1rem;}
.privacy-box p {margin-left: 4.5rem;}
.privacy-box table {max-width: 600px; width: 100%; margin: 4rem 0 0 auto; border-left: 1px solid #00a29a; border-right: 1px solid #00a29a;}
.privacy-box table tr {}
.privacy-box table th {color: #fff; background: #00a29a; font-weight: bold; padding: 0 2rem;}
.privacy-box table td {padding: 0.5rem 2rem; border-right: 1px solid #00a29a;  border-bottom: 1px solid #00a29a;}
.privacy-box table td:nth-child(1) {text-align: center;}
.site-policy .privacy-box-title {background-color: #3b5f9b;}
.site-policy-text {max-width: 1000px; width: 90%; margin: 0 auto;}
.site-policy-banner-box {display: flex; gap: 6rem; margin: 3rem auto 0 4.5rem;}
.site-policy-banner-box img {margin: 0 auto;}
.site-policy-banner-box div:nth-child(1) img {width: 160px;}
.site-policy-banner-box div:nth-child(2) img{width: 140px;}
.site-policy-banner-box div p{ font-size: 1.6rem; color:#3a81bc; margin: 0 auto;}

.page-404 .inner{text-align: center; width: 90%; max-width: 1000px; margin: 0 auto; padding: 6rem 0;}
.page-404 .inner h2{font-size: 3.2rem; font-weight: 500; margin-bottom: 2rem;}
.page-404 .inner .btn{max-width: 300px; margin: 5rem auto 0;}
.welfare .introduction{ padding:6.4rem 0}
.welfare-content {
	position: relative;
	margin: 0 auto;
	box-sizing: border-box;
	font-size: 1.5rem;
}

.welfare-lead {
	position: absolute;
	top: 0;
	left: 20px;
	font-size: 4rem;
}

.welfare-content .fs-small {
	font-size: 1.1rem;
}
.welfare-content img {
	max-width: 100%;
	height: auto;
}

.welfare-list {
	display: grid;
	gap: 40px min(calc(66 / 1050 * 100%), 66px);
  grid-template-columns: repeat(auto-fit, minmax(213px, 1fr));
	width: min(90%, 1050px);
	margin: 0 auto;
  font-family: var(--content-brand-font-gos);

}
.welfare-list li p{
	font-size: 1.6rem;
    font-weight: 400;
	text-align: center;
  line-height: 1.5;
}
.welfare-list li .welfare-list__icon {
	position: relative;
	margin-bottom: 1rem;
}
.welfare-list li .welfare-list__welfare {
	position: absolute;
	top: 1.6rem;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	font-size: 2rem;
	color: #fff;
  font-weight: 500;
}

.work-style .inner{
	width: min(90%, 1050px);
	margin: 0 auto;
  font-family: var(--content-brand-font-gos);
  padding:6.4rem 0
}
.work-style .work-style__wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

}
.work-style .work-style__wrap .work-style__workforce {
	width: min(calc(430 / 1050 * 100%), 430px);
}
.work-style .work-style__worker {
	margin-bottom: 7rem;
	font-size: 2.3rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	color: #3b5f9b;
}
.work-style__benefits {
	display: grid;
	gap: 45px min(calc(53 / 1050 * 100%), 53px);
  grid-template-columns: repeat(auto-fit, minmax(221px, 1fr));
	margin-top: 110px;
}
.work-style__benefits li {
	padding: 2rem 0 1rem;
	border: 3px solid #3b5f9b;
	border-radius: 20px;
	aspect-ratio: 1 / 1;
	color: #4c4948;
	text-align: center;
  position: relative;
}
.work-style__benefits li .work-style__benefit {
	margin-bottom: 1.6rem;
	font-size: 2.0rem;
	font-weight: 500;
	color: #3b5f9b;
}
.work-style__benefits li .work-style__package {
	display: flex;
	justify-content: center;
	align-items: baseline;
	line-height: 1;
}
.work-style__benefits li .work-style__num {
	font-size: 9rem;
  font-family: var(--content-brand-font-en);
	font-weight: 500;
}
.work-style__benefits li .work-style__unit {
	font-size: 4.8rem;
  font-weight: 600;
}
.work-style__benefits li .work-style__note {
	margin-top: 2rem;
	font-size: 1.8rem;
	line-height: calc(26 / 18);
  position: absolute;
  width:100%;
  text-align: center;
  bottom:0.8rem;
      font-weight: 400;
}

.faq .inner{
	width: min(90%, 974px);
	margin: 0 auto;
  font-family: var(--content-brand-font-gos);
  padding:6.4rem 0
}
.faq-headline {
	width: fit-content;
	margin-bottom: 2rem;
	padding: 0.4rem 1.5rem;
	border: 1px solid #3b5f9b;
	font-size: 2.4rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	color: #3b5f9b;
}
.faq-subheadline {
	font-size: 2.3rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	color: #3b5f9b;
}

.faq-qa {
	margin: 3rem 0 4rem;
	color: #231815;
}
.faq-qa .faq-qa__q,
.faq-qa .faq-qa__a {
	position: relative;
	display: flex;
	align-items: center;
	gap: 1.4rem;
}
.faq-qa .faq-qa__q {
	margin-bottom: 1.8rem;
	font-size: 2.2rem;
    font-weight: 500;
	line-height: calc(38.5 / 22);
    padding-bottom: 2.8rem;
    padding-right: 4rem;
    cursor: pointer;
    border-bottom: 0.5px dotted #231815;
}
.faq-qa .faq-qa__q.is-open {
    border-bottom: none;
}
.faq-qa .faq-qa__a {
	padding-bottom: 2.8rem;
	font-size: 1.7rem;
	line-height: calc(27 / 17);
    font-weight: 500;
}
.faq-qa .faq-qa__a.is-open {
    border-bottom: 0.5px dotted #231815;
}
.faq-qa .faq-qa__a:not(:last-of-type) {
	margin-bottom: 2.8rem;
}
.faq-qa .faq-qa__q::before,
.faq-qa .faq-qa__a::before {
	content: "";
	width: 6.1rem;
	height: auto;
	aspect-ratio: 1 / 1;
	border: 4px solid #3b5f9b;
	border-radius: 50%;
	flex-shrink: 0;
}
.faq-qa .faq-qa__q::after,
.faq-qa .faq-qa__a::after {
	position: absolute;
	left: 2.4rem;
	font-size: 4.1rem;
	font-weight: 700;
}
.faq-qa .faq-qa__q::before {
	background-color: #3b5f9b;
}
.faq-qa .faq-qa__q::after {
	content: "Q";
	color: #fff;
  font-family: var(--content-brand-font-en);
  font-weight: 400;
}
.faq-qa .faq-qa__a::before {
	background-color: #fff;
}
.faq-qa .faq-qa__a::after {
	content: "A";
	color: #3b5f9b;
  font-family: var(--content-brand-font-en);
  font-weight: 400;
}
.faq-qa__mark {
    position: absolute;
    right: 1rem;
    content: "";
    border-top: 2px solid #3b5f9b;
    border-left:2px solid #3b5f9b;
    width: 1.4rem;
    height: 1.4rem;
    top: 30%;
    
    transform: translateY(-30%) rotate(-135deg);
}
.faq-qa .faq-qa__q.is-open .faq-qa__mark {
    top: 40%;
    transform: translateY(-40%) rotate(45deg);
}

/*採用応募フォーム*/
#application_form {
	padding:4.8rem 0;
    font-family: var(--content-brand-font-gos);
    color: #333;
    line-height: 1.6;
}
#application_form .inner{
	max-width:1000px;
	width:90%;
	margin:0 auto;
}
#application_form .description{
  max-width: 850px;
  width: 90%;
  margin: 0 auto 4.8rem;
  font-size: 1.6rem;
  font-weight: 500;
}

/* 各項目のマージン */
#application_form .field {
    margin-bottom: 2.4rem;
}

/* ラベルのデザイン */
#application_form label {
    display: block;
    font-weight: bold;
    margin-bottom: 0.8rem;
    font-size: 1.6rem;
}

/* 必須マーク */
#application_form .required {
    color: #d9534f;
    margin-left: 4px;
}

/* 入力フィールド全般 */
#application_form input[type="text"],
#application_form input[type="email"],
#application_form input[type="tel"],
#application_form input[type="date"],
#application_form textarea {
    width: 100%;
    padding: 1.2rem;
    border: 2px solid #ccc;
    border-radius: 0.4rem;
    box-sizing: border-box;
    font-size: 1.6rem;
    background-color: #fff;
}

/* プレースホルダーの色 */
#application_form ::placeholder {
    color: #ccc;
}

/* 電話番号の横並び */
#application_form .tel-inputs {
    display: flex;
    align-items: center;
    gap: 1rem;
}
/*
#application_form .tel-inputs input {
    width: 8rem;
    text-align: center;
}
*/

/* 補足テキスト */
#application_form .note {
    font-size: 1.4rem;
    color: #231815;
    font-weight: 500;
    margin-top: 0.5rem;
}

/* ラジオボタンの縦並び */
#application_form .wpcf7-radio {
    display: block;
}

#application_form .wpcf7-list-item {
    display: block;
    font-weight: 500;
    margin: 0 0 8px 0;
}

/* ファイル選択ボタンの枠 */
#application_form input[type="file"] {
    border: 2px solid #ccc;
    padding: 1rem;
    width: 100%;
    background: #fff;
    border-radius: 0.4rem;
    color: #b3b3b3;
}

/* 個人情報保護方針のスクロールボックス */
#application_form .policy-box {
    height: 15.0rem;
    overflow-y: scroll;
    border: 2px solid #ccc;
    padding: 1rem;
    font-size: 1.6rem;
    color: #4a4a4a;
    background: #f9f9f9;
    margin-top: 1rem;
}

/* 同意チェックボックス */
#application_form .wpcf7-acceptance label {
    display: flex;
    align-items: center;
    font-weight: normal;
    cursor: pointer;
    font-weight: 500;
}

#application_form .wpcf7-acceptance input {
    margin-right: 1.0rem;
    transform: scale(1.2);
}
.privacy-policy {
    font-weight: 400;
    p {
        font-weight: 500;
    }
}
/* 送信ボタンエリア */
#application_form .submit-btn {
    text-align: center;
    margin-top: 4.0rem;
}

#application_form input[type="submit"],#application_form button[type="button"] {
    background-color: #3a80bb; /* 画像の青色 */
    color: #fff;
    padding: 1.5rem 8.0rem;
    font-size: 2rem;
    letter-spacing: 3px;
    border: none;
    border-radius: 3.0rem;
    cursor: pointer;
    transition: background 0.3s ease;
}

#application_form input[type="submit"]:hover,#application_form button[type="button"]:hover {
    background-color: #3d638d;
}

/* エラーメッセージの装飾 */
#application_form .wpcf7-not-valid-tip {
    color: #d9534f;
    font-size: 1.4rem;
    margin-top: 0.5rem;
}

/*　multi stepを使ってない確認画面ページ　*/
.confirm-list {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 3rem 1rem;
}
.confirm-list dt {font-weight: bold; border-bottom: 1px solid #000;}
.confirm-list dd {margin: 0; border-bottom: 1px solid #000;}
.pre-wrap {white-space: pre-wrap;}
.confirm-btns {
  margin-top: 32px;
  display: flex;
  justify-content: center;
  gap: 16px;
}
#application_thanks .wpcf7-response-output {
  display: none;
}
#application_thanks .editor {
  display: none;
}

/* 送信完了ページ */
#application_thanks {
	font-family: var(--content-brand-font-gos);
	text-align: center;
	padding: 10.8rem 0;
}
#application_thanks .thanks-message {
    font-size: 2.4rem;
    margin-bottom: 2.4rem;
}
#application_thanks .btn {
    display: inline-block;
    margin-top: 2.4rem;
}

@media screen and (max-width: 1180px) {
.work-style__benefits li{
  aspect-ratio: auto;
}
.work-style__benefits li .work-style__note{
  position: relative;
}
 
}

@media screen and (max-width: 600px) {
	.work-style .work-style__wrap {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.work-style .work-style__wrap .work-style__workforce {
		width: 100%;
	}
  .welfare-list{
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }
  .work-style__benefits{
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  }
}

/*サービス*/

/*フォーム*/

div.wpcf7{ width:calc(95% - 10rem); max-width:980px; margin:0 auto;}
.wpcf7-form{ width:100%; margin: auto;}
.wpcf7-form table{ max-width:700px; width:90%; margin:0 auto;}
.wpcf7-form th p,.wpcf7-form td p{margin-bottom:0!important; text-align: left!important;}
.wpcf7-form th i{ color: var(--content-brand-red);}
.wpcf7-form th{background-color: var(--content-brand-middlegreen); color: var(--content-brand-green); border:1px solid var(--content-brand-lightgreen); padding:1.6rem; vertical-align: top;}
.wpcf7-form td{ background-color: #ffffff; border:1px solid var(--content-brand-lightgreen); padding:1.6rem}
.wpcf7-form input[type="text"],.wpcf7-form input[type="email"],.wpcf7-form textarea{ border: none; border-radius: 0.4rem; padding:0.8rem; background-color: #efefef; width:100%}
.wpcf7-form table+p{ display: flex; justify-content: center; align-items: center; flex-direction: column; padding:2.4rem 0}
.wpcf7-form input[type="submit"]{ font-size:1.6rem; color: #ffffff; padding:0.8rem 1.6rem; border: none; background-color: var(--content-brand-red); border-radius: 2.4rem; cursor: pointer;}
.wpcf7-form input[type="submit"]:hover{ background-color: var(--content-brand-darkgreen);}


/*投稿ページ*/


/*投稿一覧ページ*/
.description .inner {
  width: 95%;
  max-width: 1080px;
  margin: 0 auto;
  padding: 7.2rem 0;
}

.archive-list {
  display: flex;
  flex-direction: column;
  gap: 4.8rem;
}

.archive-list li {
  list-style: none;
}

.archive-list li .wrap {
  display: flex;
  gap: 4.8rem;
  align-items: flex-start;
}

.archive-list li figure {
  width: 32rem;
  flex-shrink: 0;
}

.archive-list li figure img {
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border-radius: 0.8rem;
}

.archive-list li .text {
  flex: 1;
}

.archive-list li .text .data {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  margin-bottom: 1.6rem;
  font-family: var(--content-brand-font-gos);
  font-size: 1.4rem;
}

.archive-list li .text .category {
  padding: 0.2rem 1.2rem;
  border: 1px solid #000;
  border-radius: 0.4rem;
  line-height: 1.4;
}

.archive-list li .text h3 {
  font-size: 2.4rem;
  font-weight: 500;
  margin-bottom: 1.6rem;
}

.archive-list li .text h3 a:hover {
  color: var(--content-brand-blue);
}

.archive-list li .text p {
  font-size: 1.6rem;
  line-height: 1.8;
  margin-bottom: 1.6rem;
  color: var(--content-brand-gray);
}

@media screen and (max-width: 880px) {
  .archive-list li .wrap {
    gap: 2.4rem;
  }
  .archive-list li figure {
    width: 24rem;
  }
}

@media screen and (max-width: 660px) {
  .description .inner {
    padding: 4.8rem 0;
  }
  .archive-list {
    gap: 3.2rem;
  }
  .archive-list li .wrap {
    flex-direction: column;
    gap: 1.6rem;
  }
  .archive-list li figure {
    width: 100%;
  }
  .archive-list li .text h3 {
    font-size: 2rem;
  }
}

.link-more{
	display: none;
}

/*投稿詳細ページ*/
.post-content .inner {
  width: 95%;
  max-width: 900px;
  margin: 0 auto;
  padding: 8.0rem 0;
}

.post-content .entry-header {
  margin-bottom: 4.8rem;
  border-bottom: 1px solid #eee;
  padding-bottom: 3.2rem;
}

.post-content .entry-header .data {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  margin-bottom: 2.4rem;
  font-family: var(--content-brand-font-gos);
  font-size: 1.4rem;
}

.post-content .entry-header .category {
  padding: 0.2rem 1.2rem;
  border: 1px solid #000;
  border-radius: 0.4rem;
  line-height: 1.4;
}

.post-content .entry-header .new-post {
  color: #fff;
  background-color: var(--content-brand-red);
  padding: 0.2rem 0.8rem;
  border-radius: 0.4rem;
  font-size: 1.2rem;
  font-weight: bold;
}

.post-content .entry-header h1 {
  font-size: 3.2rem;
  line-height: 1.4;
  margin-bottom: 3.2rem;
  font-weight: 500;
}

.post-content .main-eyecatch {
  margin-top: 3.2rem;
}

.post-content .main-eyecatch img {
  width: 100%;
  height: auto;
  border-radius: 0.8rem;
}

.post-content section {
  font-size: 1.8rem;
  line-height: 2;
  color: var(--content-brand-gray);
}

.post-content section p {
  margin-bottom: 2.4rem;
}

.post-content section h2 {
  font-size: 2.6rem;
  margin: 5.6rem 0 2.4rem;
  padding-bottom: 0.8rem;
  border-bottom: 2px solid var(--content-brand-blue);
  color: #000;
}

.post-content section h3 {
  font-size: 2.2rem;
  margin: 4.0rem 0 1.6rem;
  padding-left: 1.2rem;
  border-left: 4px solid var(--content-brand-blue);
  color: #000;
}

.post-content section img {
  max-width: 100%;
  height: auto;
  margin: 3.2rem 0;
  border-radius: 0.4rem;
}

.post-content .navi-single {
  margin-top: 8.0rem;
  padding-top: 4.0rem;
  border-top: 1px solid #eee;
  display: flex;
  justify-content: center;
}

.post-content .navi-single .list a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24rem;
  height: 5.6rem;
  background-color: var(--content-brand-blue);
  color: #fff;
  border-radius: 2.8rem;
  font-family: var(--content-brand-font-gos);
  font-size: 1.6rem;
  transition: background-color 0.3s;
}

.post-content .navi-single .list a:hover {
  background-color: #000;
}

@media screen and (max-width: 660px) {
  .post-content .inner {
    padding: 5.6rem 0;
  }
  .post-content .entry-header h1 {
    font-size: 2.4rem;
  }
  .post-content section {
    font-size: 1.6rem;
  }
  .post-content section h2 {
    font-size: 2.2rem;
  }
  .post-content section h3 {
    font-size: 2rem;
  }
}


/*==============================================
●PC版非表示
===============================================*/
.sp{ display:none!important;}
.tablet{ display:none!important;}


/*===============================================
●レスポンシブ  画面の横幅が1920px以上
===============================================*/
@media (min-width: 1921px) {
body {zoom: 1.25;}
}
@media (min-width: 3000px) {
body {zoom: 1.75;}
}

/*===============================================
●レスポンシブ  画面の横幅が1300pxまで
===============================================*/
@media (max-width:1300px) {
.top_service .one-stop .cpg-img {flex-direction: column;}
.top_service .one-stop .cpg-img img{width: 100px;}
}

/*===============================================
●レスポンシブ  画面の横幅が1200pxまで
===============================================*/
@media (max-width:1200px) {
    .recruit .interview ul li .text {background: linear-gradient(to right, rgba(30, 110, 180, 0.85) 0%, rgba(30, 110, 180, 0.85) 30%, rgba(30, 110, 180, 0.4) 60%, rgba(30, 110, 180, 0) 100%); height: 100%;}
}
/*===============================================
●レスポンシブ  画面の横幅が1080pxまで
===============================================*/
@media screen and (max-width:1080px){
html{font-size:1vw}
.tablet{ display:block!important;}
.pagehead .header-menu ul{ font-size:1.4rem}
.pagehead .branding a {font-size: 2rem;}
.page-header .text h1 strong .en {font-size: 4.8rem;}
.pagehead .header-menu .site-nav li a {font-size: 1.6rem; padding: 1.6rem 1.1rem;}
.std strong { font-size: 2.5rem;}
.top_recruit .text h2 i {font-size: 6rem;}
.top_recruit .text h2 strong {font-size: 1.9rem;}
.top_recruit .text p {font-size: 3.6rem;}
.profile {padding: 11rem 0 7rem;}
.recruit .recruit_images { flex-wrap: wrap;}
.recruit .recruit_images img{ width:50%}
.recruit .page-message .flex-wrap .text { font-size: 1.5rem;}
.flow > li .flow-step .flow-step__num { width: 4.5rem; height: 4.5rem; font-size: 3rem;}
.footer_service-list li{ width:30%;}
.br1080 {display: block;}
}


/*===============================================
●レスポンシブ  画面の横幅が880pxまで
===============================================*/
@media screen and (max-width:880px){
.top_service .one-stop .cpg-img {position: relative; left: unset; bottom: unset; flex-direction: row; justify-content: center; margin-top: 6rem; font-size: 12px;}
.recruit .page-message .inner {padding: 5rem 0;}
.fleet-lineup .block {width: 100%;}
.profile .company-table .company-value .staffing-business-item a{ max-width: 220px; font-size: 1.6rem;}
.recruit .introduction_recruit .flex-wrap .text {margin-right: 2rem;}
}


/*===============================================
●レスポンシブ  画面の横幅が660pxまで
===============================================*/
@media screen and (max-width:660px){
html{font-size:2vw}
body{ min-width:320px; background-image:none; font-size:1.8rem}
img{
max-width: 100%;
height: auto;
width:auto;
}
.std strong { font-size: 2.5rem;}
.br660{ display: block;}
.pc{ display:none!important;}
.sp{ display:block!important;}
.bc{ display: none;}
.tel a{pointer-events: auto;}
.pagehead .inner{ height: 8.5rem;}
.page-header .text h1 strong { font-size: 3.2rem;}
.page-header .text p { font-size: 1.7rem; width: 90%; line-height: 1.5;}
.top_about{ background-position: center;}
.top_about .flex-wrap{ flex-direction:column}
.top_about .flex-wrap .text{ width:90%; margin-bottom: 3.2rem;}
.top_about .flex-wrap .image{width:100%;display:flex; flex-direction: row;}
.top_about .flex-wrap .image figure{width:50%; padding:1.6rem;}

.top_service{ background-position: center;}
.top_service .flex-wrap{ flex-direction:column}
.top_service .flex-wrap .text{ width:90%; margin-bottom: 3.2rem;}
.top_service .flex-wrap .image{width:100%;display:flex; flex-direction: row;}
.top_service .flex-wrap .image figure{width:50%; padding:1.6rem;}
.top_service .one-stop figcaption{top: 37%; left: 35%;}
.top_service .one-stop figcaption h2{writing-mode: vertical-rl; font-size:2.8rem; text-align: justify;}
.top_service .one-stop figure{ width:95%}
.service-list {padding-top: 2rem;}
.service-list li{ width:47.5%; line-height: 1.2; margin-bottom: 2.4rem;}
.service-list li:nth-child(5) a img{ transform: translateY(-2.4rem);}
#top_service-list .service-list li a:after {font-size: 2rem; right: 0.6rem;}
#top_service-list .service-list li a i{ font-size: 1.6rem;}

.top_movie ul{ flex-direction: column; width:66%;}
.top_movie li{ width:100%; margin-bottom: 2.4rem;}
.top_news li{ flex-wrap: wrap; gap:0.8rem}
.top_news li a{ width:100%}
.top_recruit { padding: 0 0 2.4rem 0; background-position: 52%;}
.top_recruit .inner{ flex-direction: column; width:100%}
.top_recruit .text{ padding:2.4rem; text-align: center;}
.top_recruit .text h2{ flex-direction: column;}
.top_recruit .text .btn{ margin:0 auto;}
.footer_logitech_section { flex-wrap: wrap;}
.footer_logitech_section .inner{ width:100%;}
.footer_logitech_section img{ width:50%}
.lineup { width:90%}
.lineup .wrap{ flex-direction: column;}
.lineup .wrap figure{ width:100%}
.lineup .wrap .text{ width:100%}
.lineup .wrap h2 i { font-size: 4rem;}
.lineup .wrap h2 strong { font-size: 2.4rem;}
.footer_service-list ul{ flex-wrap: wrap; justify-content: center; gap:3%}
.footer_service-list li{ width:48%;}
div.wpcf7{max-width: 100%; width: 90%;}
.access .office-table .office-category{ padding:1.6rem 0}
.access .office-table .office-name{ padding:1.6rem 0}
.access .office-table .office-detail{ padding: 1.6rem 0 1.6rem 1.6rem;}
.access .office-table .office-detail .wrap{ flex-direction: column; gap:1.6rem; align-items: flex-start;}
.access-banner { font-size: 2.5rem; height: 85px;}
.access-banner:nth-of-type(2) { margin: 20px auto;}
.access-banner strong { right: 9%;}
.access-banner strong span { font-size: 1.3rem;}
.access-banner a:after { font-size: 1.6rem; bottom: 0.5rem;}
.access-banner a figure { height: 100%;}
.access-banner a img { height: 100%; object-fit: cover; object-position: left;}

.page-header .text h1 strong .en{ display: block;}
.logitech .logitech_images{ flex-wrap: wrap;}
.logitech .logitech_images img{ width:50%}
.logitech .logitech_images .catchcopy{ font-size: 3.2rem;}
.logitech .about_logitech { background-position: top center;}
.logitech .about_logitech .flex-wrap { justify-content: center;}
.logitech .about_logitech .flex-wrap .text{ width:90%;}
.logitech .service_logitech .block .text .btn{ position: relative; margin:0 auto 2.4rem auto}
.profile .company-table .company-value .staffing-business-item a { max-width: 310px;}
.fleet-lineup {padding: 4rem 0;}
.about-logitech .company-address { flex-direction: column; gap:1.6rem;}
.about-logitech .history-list .history-item { position: relative; flex-direction: column; align-items: flex-end;}
.about-logitech .history-list .history-item .history-item-date{ order: 1; width:30%; position: absolute; top:0;left:0; height:100%; font-size: 5rem;}
.about-logitech .history-list .history-item .history-item-content h3 { font-size: 2.3rem;}
.about-logitech .history-list .history-item-content.left{ order:2;width:70%}
.about-logitech .history-list .history-item-content.right{ order: 3;width:70%}
.about-logitech .history-list .history-item .history-item-content.left h3{text-align: left;}
.about-logitech .history-list .history-item-content.empty{ display: none;}
.about-logitech .history-list .history-item .history-item-content .wrap{ flex-direction: column;}
.about-logitech .history-list .history-item .history-item-content .wrap .text{ width:100%;}
.about-logitech .safety-initiative h2 { font-size: 2.7rem;}
.about-logitech .safety-initiative h3 { font-size: 2.7rem;}
.about-logitech .safety-initiative li h4 { font-size: 2.6rem;}
.about-logitech .safety-initiative .inpage-title .en{ display: block; line-height: 1;}
.about-logitech .safety-initiative li{ align-items: flex-start;}

.contribution .lineup .image {flex-wrap: wrap;}

.recruit .interview h2 {padding: 0rem 0 2.4rem 0;}
.recruit .introduction_recruit{ background-position: 20%;}
.recruit .introduction_recruit .flex-wrap { justify-content: center;}
.recruit .introduction_recruit .flex-wrap .text{ width:90%; background-color: rgba(0, 0, 0, .50 ); padding:1.6rem;}
.recruit .page-message .inner {background-image: unset;}
.recruit .page-message .flex-wrap { max-width: 675px; margin: 0 auto;}
.recruit .page-message .recruit-sp-item {display:block; max-width: 400px; margin: 0 auto 2rem;}
.recruit .occupation {padding: 5px 0 3rem;}
.recruit .occupation .inner{ width:90%;}
.recruit .occupation .block li{ width:50%}
.recruit .occupation .block li:nth-child(2n){ border-right: 1px solid #000000;}
.recruit .occupation .strength-sec01 {flex-direction: column; gap: 4rem;}
.recruit .occupation .strength-sec01-box {max-width: 400px; width: 100%; margin: 0 auto;}
.recruit .occupation .strength-sec01-box img {width: 100%;}
.recruit .interview .inner{ width:90%;margin: 0 auto; }
.recruit .interview .btn-wrap{ flex-direction: column;}
.recruit .interview .btn-wrap .btn2{ width:100%}
.recruit .interview ul { width: calc(100vw - (100vw - 87rem) / 2);}
.recruit .interview ul li h3 {text-shadow: 0 0 8px #000;}
.faq-qa .faq-qa__q { font-size: 1.8rem;}
.faq-qa .faq-qa__q::before, .faq-qa .faq-qa__a::before { width: 5rem;}
.faq-qa .faq-qa__q::after, .faq-qa .faq-qa__a::after {left: 1.8rem; font-size: 3.5rem;}
.faq-headline { font-size: 2rem;}
.message .greeting .inner { display: block;}
.message .greeting .inner figure { margin-bottom: 2.4rem;}
.message .greeting .inner figure img{ min-height: auto;}
.message .greeting .inner .text{ position: unset;}
.message .greeting .inner .text p{ width:100%; display: block;}
.message .strength .inner{ padding-top: 7.2rem;}
.message .strength ul{flex-direction: column; z-index: 2; position: relative;}
.message .strength li{width:100%; margin-bottom: 2.4rem; display: flex; justify-content: space-between; align-items: center;}
.message .strength li figure{ width:50%}
.message .strength li .text{ width:45%}
.introduction_column_list .block{ display: block;}
.introduction_column_list .block .block__txt{ width:100%;}
.introduction_column_list .block .block__img{ width:100%;}
.introduction p strong { font-size: 2.6rem;}
.interview-list .interview_mv figcaption{position: relative; color: var(--content-brand-gray);}
.interview_qanda_list .question {width: 5rem; height: 5rem; min-width: 5rem;}
.interview_qanda_list .answer {width: 5rem; height: 5rem; min-width: 5rem;}
.interview_qanda_list dt .question_text { font-size: 2rem;}
.interview_qanda_list dl i { font-size: 3.2rem;}
.interview_qanda_list h4 { font-size: 3.2rem;}
.schedule_list li figure{ width:100%}
.schedule_list li .wrap{ display: block;}
.schedule_list li .wrap figure{ width:100%;}
.schedule_list li .wrap .text{ width:100%;}
.work-style .work-style__worker {margin-bottom: 2rem;}
.work-style .work-style__wrap .work-style__workforce {max-width: 400px; width: 100%; margin: 0 auto 4rem;}
.work-style__benefits {margin-top: 50px;}
.globalMenuSp { overflow: scroll; height: 100vh; padding:3.2rem 0}
.globalMenuSp .branding{ width:70%; margin:0 auto; padding:2.4rem}
.globalMenuSp .branding { width:fit-content; font-weight: 400;}
.globalMenuSp .branding a{ font-size:2.4rem;display: flex; align-items: center; color:#ffffff}
.globalMenuSp .branding img{ width:4.2rem; aspect-ratio: 1 / 1; object-fit: contain; margin-right: 0.4rem;}
.sp-menu ul{ padding:1.5rem 0; width:80%; margin:0 auto}
.sp-menu .site-nav li{ border-bottom: 1px solid #ffffff;}
.sp-menu li{ font-size:2.4rem; border-bottom: 0.16rem dotted var(--content-brand-darkgreen); text-align: left; padding:1.6rem}
.sp-menu li a{color: #ffffff;}
.sp-menu li .menu-box a{ display: block; font-size:2.0rem; padding-left: 1.6rem;}
.sp-menu li .menu-box a::before{ content: '・'; color: var(--content-brand-green); margin-right: 0.6rem;}
.sp-menu li a.parent{ display: block;}
.globalMenuSp .data{ font-size:1.8rem; font-weight: 500;}
.globalMenuSp .tel{ font-size:3.2rem; font-weight: 600; color: var(--content-brand-green);}

.globalMenuSp ul.other-nav{ display: flex; font-size:1.8rem; gap: 3.2rem; justify-content: center;}
.globalMenuSp .other-nav { padding:3.2rem 0}
.globalMenuSp .other-nav li img{ height:5.2rem;}
.globalMenuSp .data{ color:#ffffff;}
/*固定ページ*/
.page-header {height:50rem;}
.page-header .text h1 strong:has(.en){ font-size:1.8rem}
.page-header .text h1 strong .en{ font-size:3.5rem; line-height: 1.2; margin-right: 1.5rem; margin-bottom: 0.5rem;}
.inpage-title h2 strong:has(.en) {font-size: 2.0rem;}
.inpage-title h2 strong .en {font-size: 4rem;}

}