@charset "UTF-8";

/*----------------------------------------------------------------
  HTML Elements
  ----------------------------------------------------------------*/

html {
	box-sizing: border-box;
	font: 62.5%/1.5 "ヒラギノ⾓ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Meiryo UI", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	-webkit-text-size-adjust: 100%;
}

*,
*::before,
*::after {
	box-sizing: inherit;
}

body {
	width: 100%;
	margin: 0;
	padding: 0;
	background-color: #fff;
	font-size: 1.4rem;
	overflow-x: hidden;
	color: #4d4d4d;
}

a {
	color: #007389;
}

header,
footer,
section,
article,
h1,
h2,
h3,
h4,
h5,
h6,
p,
dl,
dt,
dd,
ul,
ol,
li,
table,
tbody,
thead,
tfoot,
tr,
td,
figure,
figcaption {
	margin: 0;
	padding: 0;
	text-align: left;
	font-size: 100%;
	font-weight: 500;
}

table {
	border-collapse: collapse;
	table-layout: fixed;
}

img {
	max-width: 100%;
	vertical-align: bottom;
}

b,
strong {
	font-weight: bolder;
}

button,
input,
optgroup,
select,
textarea {
	margin: 0;
	font-family: inherit;
	font-size: 100%;
}

button,
select {
	text-transform: none;
}

button,
[type='button'],
[type='reset'],
[type='submit'] {
	-webkit-appearance: button;
}

button::-moz-focus-inner,
[type='button']::-moz-focus-inner,
[type='reset']::-moz-focus-inner,
[type='submit']::-moz-focus-inner {
	padding: 0;
	border-style: none;
}

button:-moz-focusring,
[type='button']:-moz-focusring,
[type='reset']:-moz-focusring,
[type='submit']:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/*----------------------------------------------------------------
  Common Styles
  ----------------------------------------------------------------*/

.hover-op {
	opacity: 1;
	transition: opacity 0.3s;
}

.hover-op:hover,
.hover-op:active {
	opacity: 0.7;
}

.hover-ul,
.hover-no-ul:hover,
.hover-no-ul:active{
	text-decoration: none;
}

.hover-ul:hover,
.hover-ul:active {
	text-decoration: underline;
}

.hover-point:hover {
	cursor: pointer;
}

.hover-largeimg {
	overflow: hidden;
}

.hover-largeimg img {
	transform: scale(1, 1);
	transition: transform 1s;
}

.hover-largeimg:hover img,
.hover-largeimg:active img {
	transform: scale(1.2, 1.2);
}

.w-50 {
	width: 50%;
}

.w-100 {
	width: 100%;
}

.mw-100 {
	max-width: 100%;
}

.va-b {
	vertical-align: bottom;
}

.d-b {
	display: block;
}

.c-i {
	color: inherit;
}

.ta-c {
	text-align: center;
}

.ta-r {
	text-align: right;
}

.list-n {
	list-style-type: none;
}

.list-kakko {
	list-style-type: none;
	counter-reset: lk;
}

.list-kakko li {
	display: flex;
	width: 100%;
	counter-increment: lk;
}

.list-kakko li::before {
	content: "("counter(lk)")";
}

.fw-b {
	font-weight: bold;
}

.content-header,
.content-header-noline {
	text-align: center;
	font-weight: bold;
}

.content-header {
	padding-bottom: 20px;
	background: transparent linear-gradient( to right, #007389 0% , #007389 100% ) center bottom / 160px 6px no-repeat;
}

.btn-contact {
	display: block;
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
	padding: 15px;
	background-color: #f29600;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	font-size: 2rem;
	color: #fff;
}

.btn-contact::before {
	content: '';
	display: inline-block;
	width: 36px;
	height: 28px;
	margin-right: 10px;
	background: transparent url( ../img/icon_mail_36x28.png ) 0 0 no-repeat;
	vertical-align: middle;
}

.fade-trigger figure {
	position: relative;
	transition: opacity 0.3s, top 0.3s;
}

.fade-trigger dl {
	position: relative;
	transition: opacity 0.3s 0.3s, top 0.3s 0.3s;
}

.btn-base {
	display: block;
	margin: 0 auto;
	padding: 15px;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	font-size: 2rem;
}

.btn-green {
	background-color: #007389;
	color: #fff;
}

.btn-orange {
	background-color: #f29600;
	color: #fff;
}

.btn-orange::before {
	content: '';
	display: inline-block;
	width: 36px;
	height: 28px;
	margin-right: 5px;
	background: transparent url( ../img/icon_mail_36x28.png ) 0 0 no-repeat;
	vertical-align: sub;
}

/*----------------------------------------------------------------
  Page Header
  ----------------------------------------------------------------*/

.page-header {
	display: flex;
	align-items: center;
	width: 100%;
	background-color: #fff;
}

.page-header-fix .page-header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 5;
}

.header-nav-contact,
.header-nav-toggle {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	line-height: 1;
	text-decoration: none;
	color: #fff;
}

.header-nav-contact {
	background-color: #f29600;
}

.header-nav-toggle {
	background-color: #e95513;
}

.header-nav-togglecheck:checked ~ .header-nav-toggle-main {
	right: 0;
}

.header-nav-overlay {
	position: fixed;
	right: 0;
	bottom: 0;
	z-index: 999;
	width: 0;
	height: 100vh;
}

.header-nav-togglecheck:checked ~ .header-nav-overlay {
	width: 100vw;
}

.header-nav-toggle-main {
	position: fixed;
	top: 0;
	z-index: 1000;
	height: 100vh;
	overflow-y: auto;
	background-color: #e95513;
	color: #fff;
}

.header-nav-toggle-main h2 {
	text-transform: uppercase;
	font-weight: bold;
}

.header-nav-toggle-main h2::after {
	content: attr( data-title );
	display: block;
}

.header-nav-toggle-link {
	list-style-type: none;
}

.header-nav-toggle-link ul {
	margin-left: 2rem;
	list-style-type: none;
}

.header-nav-toggle-link a {
	color: inherit;
}

.header-nav-toggle-link a span {
    display: block;
    margin-left: 7.0rem;
}

@media only screen and (min-width: 769px) {
    .header-nav-toggle-link a span {
        margin-left: 8.75rem;
    }
}
.toggle-menu {
	padding: 0;
	border: none;
	background-color: transparent;
	outline: none;
	color: #fff;
}

.page-title {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}

.breadcrumbs ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	list-style-type: none;
}

.breadcrumbs li {
	margin-right: 1.4rem;
}

.breadcrumbs li:nth-of-type( n+2 )::before {
	content: '>';
	margin-right: 1.4rem;
}

.breadcrumbs li:first-of-type a::before {
	content: '';
	display: inline-block;
	width: 26px;
	height: 24px;
	margin-right: 0.7rem;
	background: transparent url( ../img/icon_home.png ) 0 0 no-repeat;
	vertical-align: middle;
}

/*----------------------------------------------------------------
  top
  ----------------------------------------------------------------*/

.top-jumbotron {
	width: 100%;
}

.top-intro {
	background: #fff url( ../img/bg_top.jpg ) center / cover no-repeat fixed;
}

.top-intro ul {
	display: flex;
	flex-wrap: wrap;
	list-style-type: none;
	padding: 1px 0 0 1px;
}

.top-intro li {
	margin: 0 1px 1px 0;
}

.top-intro li a {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	width: 100%;
	height: 100%;
	background-color: #fff;
	text-decoration: none;
}

.top-intro dt {
	text-align: center;
	font-weight: bold;
	color: #007389;
}

.top-intro dd {
	color: #4d4d4d;
}

.top-lineup-wrapper {
	position: relative;
}

.top-lineup-item a {
	display: block;
	text-align: center;
}

.top-lineup-btn {
	position: absolute;
	top: 50%;
	transform: translateY( -50% );
	padding: 0;
	border: none;
	outline: none;
}

.top-lineup-btn:hover,
.top-lineup-btn:active {
	cursor: pointer;
}

.top-lineup-prev {
	background: transparent url( ../img/btn_caret_gray_r_20x40.png ) center / cover no-repeat;
}

.top-lineup-next {
	background: transparent url( ../img/btn_caret_gray_l_20x40.png ) center / cover no-repeat;
}

.top-map iframe {
	width: 100%;
	border: none;
}

.top-info-list a,
.top-info-item-all {
	color: inherit;
}

.top-info-list li {
	display: flex;
	flex-wrap: wrap;
	border-bottom: 1px solid #808080;
}

.top-info-list-last li:last-of-type {
	border: none;
}

.top-info-item-date {
	width: 130px;
}

.top-info-item-cat span {
	display: block;
	width: 100px;
	border-radius: 3px;
	text-align: center;
	color: #fff;
}

.top-info-item-products {
	background-color: #d60050;
}

.top-info-item-info {
	background-color: #8dc21f;
}

.top-info-item-recruit {
	background-color: #036eb7;
}

.top-info-item-all::before {
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 10px;
	background: transparent url( ../img/icon_info_all.png ) 0 0 no-repeat;
	vertical-align: middle;
}

/*----------------------------------------------------------------
  Info
  ----------------------------------------------------------------*/

.page-title-info {
	background: transparent url( ../img/bg_info.jpg ) right center / cover no-repeat;
}

.page-title-info-single {
	background: transparent url( ../img/bg_info_single.jpg ) center / cover no-repeat;
}

.top-info-nav ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	list-style-type: none;
}

.top-info-nav li {
	margin: 0 15px;
}

.top-info-single h2 {
	margin-bottom: 15px;
	padding-bottom: 10px;
	border-bottom: 1px solid #007389;
	font-weight: bold;
	font-size: 2.4rem;
	color: #007389;
}

.top-info-single h3 {
	margin: 60px 0 15px;
	font-weight: bold;
	font-size: 1.8rem;
	color: #007389;
}

.top-info-single-photo ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	list-style-type: none;
}

.top-info-single-photo li:last-of-type,
.top-info-single-photo li:nth-of-type( 3n ) {
	margin-right: 0;
}

/*----------------------------------------------------------------
  Products
  ----------------------------------------------------------------*/

.page-title-product-top {
	background: transparent url( ../img/bg_product_top.jpg ) center / cover no-repeat;
	color: #fff;
}

.page-title-product-toilet {
	background: transparent url( ../img/bg_product_toilet.jpg ) center / cover no-repeat;
}

.page-title-product-towel {
	background: transparent url( ../img/bg_product_towel.jpg ) center / cover no-repeat;
}

.page-title-product-tissue {
	background: transparent url( ../img/bg_product_tissue.jpg ) center / cover no-repeat;
}

.page-title-product-lodging {
	background: transparent url( ../img/bg_product_lodging.jpg ) center / cover no-repeat;
}

.page-title-product-foodplant {
	background: transparent url( ../img/bg_product_foodplant.jpg ) center / cover no-repeat;
}

.page-title-product-care {
	background: transparent url( ../img/bg_product_care.jpg ) center / cover no-repeat;
}

.page-title-product-public {
	background: transparent url( ../img/bg_product_public.jpg ) center / cover no-repeat;
	color: #fff;
}

.page-title-product-eco {
	background: transparent url( ../img/bg_product_eco.jpg ) center / cover no-repeat;
	color: #fff;
}

.top-product-list {
	margin-bottom: 80px;
}

.top-product-list ul {
	display: flex;
	flex-wrap: wrap;
	list-style-type: none;
}

.product-top-category {
	display: block;
	width: 100%;
	max-width: 160px;
	margin-bottom: 10px;
	padding: 1px 5px;
	border-radius: 3px;
	text-decoration: none;
	text-align: center;
}

.product-label-toilet {
	background-color: #8dc21f;
	color: #fff;
}

.product-label-towel {
	background-color: #d60050;
	color: #fff;
}

.product-label-tissue {
	background-color: #036eb7;
	color: #fff;
}

.product-label-other {
	background-color: #328cf0;
	color: #fff;
}

.product-top-title {
	display: inline-block;
	max-width: 100%;
	font-size: 1.8rem;
	color: inherit;
}

.nav-category-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	list-style-type: none;
}

.product-single-cat {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	list-style-type: none;
}

.product-single-cat-tag {
	display: block;
	padding: 1px;
	border-radius: 3px;
	background-color: #e5e5e5;
	text-align: center;
	text-decoration: none;
	color: #fff;
}

.product-single-cat-red {
	background-color: #d60050;
}

.product-single-cat-yellow {
	background-color: #f29600;
}

.product-single-cat-purple {
	background-color: #7850a0;
}

.product-info-data {
	display: flex;
	flex-wrap: wrap;
}

.product-info-gallery ul {
	display: flex;
	list-style-type: none;
}

.product-info-gallery li {
	width: 31.25%;
	margin-right: 3.125%;
}

.product-info-gallery li:nth-of-type(3n),
.product-info-gallery li:last-of-type {
	margin-right: 0;
}

.product-info-special li {
	margin-bottom: 20px;
}

/*----------------------------------------------------------------
  Recruit
  ----------------------------------------------------------------*/

.recruit-list li {
	margin: 80px 0;
	border-bottom: 1px solid #4d4d4d;
}

.page-title-recruit {
	background: transparent url( ../img/bg_recruit.jpg ) center / cover no-repeat;
	color: #fff;
}

.recruit-btn {
	max-width: 700px;
}

.recruit-list li:last-of-type {
	border-bottom: none;
}

.recruit-list-intro {
	margin-bottom: 40px;
	word-break: break-all;
}

.recruit-list dl {
	display: flex;
}

/* 2022.01.29 追記 */
.recruit-list dl:nth-of-type(n+2) {
    margin-top: 1.5rem;
}

.recruit-list dt {
    min-width: 14.0rem;
    font-weight: bold;
}

.page-title-entry {
	background: transparent url( ../img/bg_recruit.jpg ) center / cover no-repeat;
	color: #fff;
}

.mw_wp_form .input-show {
    display: block;
    margin-top: 0.25rem;
}

.mw_wp_form_confirm .input-show {
    display: none;
}

.mw_wp_form .contact-main-err {
    margin-top: 2.0rem;
}

.mw_wp_form .contact-main-err .error {
    color: #f00;
    font-size: 150%;
    font-weight: bold;
}

.mw_wp_form .contact-main-err .error::after {
    content: "送信できません。直接お問い合わせください。";
}
/**/

/*----------------------------------------------------------------
  Page (equipment)
  ----------------------------------------------------------------*/

.page-title-equipment {
	background: transparent url( ../img/bg_equipment.jpg ) center / cover no-repeat;
}

.equipment-step ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	list-style-type: none;
}

/*----------------------------------------------------------------
  Page (corporate)
  ----------------------------------------------------------------*/

.page-title-corporate {
	background: transparent url( ../img/bg_reason.jpg ) center / cover no-repeat;
}

.corporate-table {
	display: flex;
	flex-wrap: wrap;
}

.page-corporate figcaption a {
	font-size: 1.2rem;
	color: #036eb7;
}

.corporate-history-table dt:last-of-type,
.corporate-history-table dd:last-of-type {
	border-bottom: none;
}

/*----------------------------------------------------------------
  Page (reason)
  ----------------------------------------------------------------*/

.page-title-reason {
	background: transparent url( ../img/bg_reason.jpg ) center / cover no-repeat;
}

.page-reason .inner h3 {
	text-align: center;
	font-weight: bold;
}

.page-reason-list dt {
	padding-bottom: 5px;
	border-bottom: 6px solid #007389;
	font-size: 2.4rem;
	font-weight: bold;
}

/*----------------------------------------------------------------
  Page (privacy)
  ----------------------------------------------------------------*/

.page-title-privacy {
	background: transparent url( ../img/bg_privacy.jpg ) center / cover no-repeat;
}

.page-privacy p {
	margin-bottom: 50px;
}

.privacy-text {
	counter-reset: pt;
}

.privacy-text dt {
	counter-increment: pt;
	margin-bottom: 15px;
	font-weight: bold;
	font-size: 1.8rem;
	color: #007389;
}

.privacy-text dt::before {
	content: counter(pt)"."
}

.privacy-text dd {
	margin-bottom: 30px;
	padding-bottom: 30px;
	border-bottom: 1px solid #808080;
}

.privacy-text dd:last-of-type {
	padding-bottom: 0;
	border-bottom: none;
}

/*----------------------------------------------------------------
  Page (csr)
  ----------------------------------------------------------------*/

.page-title-csr {
	background: transparent url( ../img/bg_csr.jpg ) center / cover no-repeat;
	color: #fff;
}

.page-csr-item dt {
	background: transparent linear-gradient( to right, #007389 0%, #007389 100% ) bottom center / 160px 6px no-repeat;
	text-align: center;
	font-weight: bold;
}

.page-csr-item dl dl {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	margin: 0;
	padding-top: 0 !important;
}

.page-csr-item dl dl dt {
	width: 8.4rem;
	margin: 0;
	padding: 0;
	background-image: none;
	font-size: 100%;
	font-weight: inherit;
}

.page-csr-item dl dl dt:nth-of-type( 3 ) {
	width: 9.8rem;
}

.page-csr-item dl dl dd {
	width: calc( 100% - 8.4rem );
	margin: 0;
}

.page-csr-item dl dl dd:nth-of-type(3) {
	width: calc( 100% - 9.8rem );
}

.page-csr-item dl dt span {
	font-size: 1.4rem;
}

/*----------------------------------------------------------------
  Page (contact)
  ----------------------------------------------------------------*/

.page-title-contact {
	background: transparent url( ../img/bg_contact.jpg ) right center / cover no-repeat;
}

.contact-tel {
	background-color: #eeeeef;
	text-align: center;
}

.contact-tel p {
	margin-bottom: 20px;
	text-align: center;
}

.contact-tel p:last-of-type {
	margin-bottom: 0;
	color: #007389;
}

.contact-main-form-wrapper {
	display: flex;
	flex-wrap: wrap;
}

.label-required,
.label-optional {
	display: block;
	padding: 5px 0;
	border-radius: 6px;
	text-align: center;
	color: #fff;
}

.label-required {
	background-color: #e50012;
}

.label-optional {
	background-color: #c8c9ca;
}

.contact-main-form input[type=text],
.contact-main-form input[type=email] {
	width: 100%;
	padding: 5px;
	border: 1px solid #4d4d4d;
	vertical-align: bottom;
	font-size: 1.8rem;
	color: inherit;
}

.contact-main-form input[type=text]::placeholder,
.contact-main-form input[type=email]::placeholder {
	color: #9e9e9f;
}

.contact-main-form input[type=checkbox],
.contact-main-form input[type=radio] {
	vertical-align: middle;
	margin-right: 10px;
}

.contact-main-form label {
	font-size: 1.8rem;
}

.contact-main-form textarea {
	width: 100%;
	height: 200px;
	resize: vertical;
}

.contact-main-btn {
	display: flex;
	justify-content: center;
}

.contact-main-btn input {
	max-width: 300px;
	padding: 15px 0;
	border: none;
	background-color: #007389;
	text-align: center;
	font-size: 2rem;
	color: #fff;
}

/*----------------------------------------------------------------
  Page Footer
  ----------------------------------------------------------------*/

.footer-sub {
	background-color: #dbdcdc;
}

.footer-sub .inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}

.footer-sub-contact a {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #f29600;
	text-decoration: none;
	color: #fff;
}

.page-footer {
	background-color: #007389;
	color: #fff;
}

.page-footer .inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.page-footer a {
	color: inherit;
}

.footer-copyright {
    clear: both;
	width: 100%;
	text-align: center;
	font-style: normal;
}

.page-footer-nav ul ul {
	padding-left: 37px;
}

.page-footer-nav ul ul li {
	list-style-type: disc;
}

.page-footer-nav-border {
	margin-bottom: 20px;
}

.btn-page-top {
	position: fixed;
	padding: 0;
	border: none;
	background-color: #fff;
	color: #007389;
	outline: none;
	opacity: 1;
	transition: opacity 0.5s;
	cursor: pointer;
}

.btn-page-top-off,
.btn-page-top-off:hover,
.btn-page-top-off:active {
	opacity: 0;
}

/*----------------------------------------------------------------
  Special Contents Page (folte-ex)
  ----------------------------------------------------------------*/

.page-title-folte-ex-sp {
	background: transparent url( ../img/bg_folte-ex.jpg ) center / cover no-repeat;
	color: #fff;
}