html {
font-size: 62.5%;
}
@media screen and (max-width: 1400px) {
	html {
	font-size: 58%;
	}
}
@media screen and (max-width: 550px) {
	html {
	font-size: 56%;
	}
}

* {
max-height: 100%;
margin: 0px;
padding: 0px;
word-break: normal !important;
word-wrap: break-word;
line-break:normal;
border: 0;
outline: 0;
box-sizing: border-box;
vertical-align:top;
}

body {
margin: 0;
overflow-x: hidden;
font-family: "Noto Serif JP", serif;
font-weight: 400;
font-size: 1.8rem;
letter-spacing: 0.1rem;
position: relative;
}

/* ieのみ */
@media all and (-ms-high-contrast:none)
{html{font-family: 'メイリオ', 'Meiryo', sans-serif;}}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video, button {
margin: 0;
padding: 0;
border: 0;
outline: 0;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main, small {
display: block;
}

h1, h2, h3, h4, h5, h6 {
font-size: 100%;
font-weight: unset;
line-height: 1.5;
letter-spacing: 0.2rem;
text-align: center;
}

table, input, textarea, select, option {
}

ol, ul {
list-style: none;
}

blockquote, q {
quotes: none;
}

:focus {
outline: 0;
}

ins {
text-decoration: none;
}

del {
text-decoration: line-through;
}

img {
display: block;
vertical-align: middle;
max-width: 100%;
}

a {
text-decoration: none;
display: block;
color: inherit;
}

a:hover {
	opacity:0.7;
	transition: all 0.3s;
}

p {
}

.clearfix:after {
content:" ";
display:block;
clear:both;
}

i {
padding-right: 5px;
}





header {
	width: 100%;
	height: 10rem;
	position: absolute;
	top: 4rem;
	text-align: center;
	color: #fff;
	z-index: 999;
}
h1 {
}
nav {
}


/*---------------------------------------------------------------------
 フォームリセット 
---------------------------------------------------------------------*/
button {
	cursor: pointer;
	font-family: inherit;
	font-size: inherit;
	background-color: transparent;
	border: 0;
	}
	input,
	select,
	textarea {
	display: block;
	font-family: inherit;
	font-size: inherit;
	border: 1px solid #aaa;
	}
	input[type="button"],
	input[type="text"],
	input[type="submit"],
	input[type="image"],
	textarea {
	-webkit-appearance: none;
	}
	input[type="text"],
	input[type="password"],
	input[type="date"],
	input[type="email"],
	textarea {
	-webkit-appearance: none;
	width: 100%;
	padding: 10px;
	background-color: #fff;
	}
	select {
	width: 100%;
	padding: 5px 10px;
	background-color: #fff;
	}
	input[type="file"] {
	-webkit-appearance: none;
	background-color: transparent;
	border: 0;
	}
	input[type="checkbox"],
	input[type="radio"] {
	display: inline-block;
	margin-left: 2px;
	margin-right: 0.5em;
	transform: scale(1.1, 1.1);
	}
	select {
	padding-right: 25px;
	}
	textarea {
	width: 100%;
	height: 250px;
	}
	input[type="reset"],
	input[type="submit"] {
	-webkit-appearance: none;
	cursor: pointer;
	cursor: hand;
	width: 100%;
	height: 100%;
	font-weight: bold;
	letter-spacing: 1px;
	color: #fff;
	background-color: transparent;
	border-color: transparent;
	}
	.contact_submit {
	display:flex;
	justify-content: center;
	align-items: center;
	width: fit-content;
	height: 65px;
	margin: 3em auto 0;
	width: 300px;
	font-size: 1.8rem;
	background-color: #516d85;
	border-radius: 100px;
	}
	input[readonly="readonly"] {
	}






/*---------------------------------------------------------------------
 ハンバーガーメニュー 
---------------------------------------------------------------------*/

.sparea {
position: relative;
width: 100%;
}
	
/* クリックされていないときのトグルスイッチ */
.toggle {
position: fixed;
width: 10.2rem;
height: 7.9rem;
top: 3.5rem;
right: 4.5rem;
cursor: pointer;
z-index: +999999;
}
.toggle .hum{
width: calc(8rem * 0.9);
height: calc(5.4rem * 0.9);
position: absolute;
top: 1.5rem;
right: 1.5rem;
}
.toggle div {
}
.toggle span {
}

/* クリックされたときのトグルスイッチ */

.toggle.active .hum {
	display: none;
	transition: all .3s linear;
}
.toggle.active span {
display: block;
width: 6.4rem;
position: absolute; /* .toggleに対して */
top: 5rem;
right: 6.5rem;
padding-top: 0.5rem;
border-bottom: solid 2px #fff;
/*transition: all .3s linear;*/
}
/* 最初のspanをマイナス45度に */
.toggle.active span:nth-child(1) {
top: 3.6rem;
right: 1.8rem;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
border-bottom: solid 2px #fff;
}
/* 2番目と3番目のspanを45度に */
.toggle.active span:nth-child(2) {
top: 3.6rem;
right: 1.5rem;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
border-bottom: solid 2px #fff;
}



.toggle.show {
	/*filter:
	drop-shadow(0px 0px 1px #4a3725)
	drop-shadow(0px 0px 2px #4a3725);*/
	background: rgba(74, 55, 37, 0.3);
	transition: all .3s linear;
} 

.spnav {
	z-index: 99999;
	display: block;
	width: 100%;
	height: 550px;
	position: fixed;
	top: 0;
	bottom: calc(100% + 220px);
	transform: translateY(-550px);
	transition: all .3s linear;
	}
/* クリックされたときのグローバルメニュー */
/* .sp-navに.activeが追加 */
.spnav.active {
	top: 0;
	overflow-y: auto;
	transform: translateY(0);
}
.spnav.active + .spnav-bg {
	width: 100%;
	height: 100vh;
	background: rgba(74, 55, 37, 0.3);
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	transition: all .3s linear;
	}

.spnav ul {
background-color: #4a3725;
padding-top: 120px;
padding-bottom: 40px;
z-index: 9999999;
}
.spnav li {
display: block;
color: #fff;
font-size: 1.8rem;
line-height: 2.2;
}
.spnav li a {
	text-align: center;
	padding: 10px;
}
.spnav li a:hover {
	color: #000;
	background: #fff;
	opacity:1;
	transition:none;
	}



main {
	line-height: 1.8;
}



.mainv {
	background-size: cover;
	background-position: top;
	max-width: 1920px;
	margin: 0 auto;
	width: 100%;
	height: 100%;
	position: relative;
}
.logo {
	position: absolute;
	content: "";
	width: 45.6rem;
	height: 12.6rem;
	top: 50rem;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
	z-index: 99;
	}
.logo img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	filter:
	drop-shadow(0px 0px 5px #2b2b2b)
	drop-shadow(0px 0px 40px #2b2b2b)
	drop-shadow(0px 0px 50px #2b2b2b);
	}

@media screen and (max-width: 1920px) {
	.logo {
		top: calc(100vw * 260 / 1000);
		}
}



.slider {
	position: relative;
	z-index: -9999;
}
.slider li img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -99;
}



h2 {
	font-size: 3.5rem;
}
.conpad {
	padding: 11rem 4rem;
}
#about
 {
	padding-top: 16.5rem;
	margin-bottom: 13rem;
}
#products {
}

#about h2 {
	padding-bottom: 7rem;
}
#products h2 {
	padding-bottom: 3rem;
}


.abt-wrap {
	position: relative;
	height: 1520px;
	max-width: 1920px;
	margin: 0 auto;
}
.abt-box01,
.abt-box02,
.abt-box03 {
	position: absolute;
	width: 100%;
	display: flex;
	padding-left: 4rem;
	padding-right: 4rem;
}
.abt-box01 {
	top: 0;
	flex-direction: row-reverse;
}
.abt-box02 {
	top: 440px;
	align-items: end;
}
.abt-box03 {
	bottom: 0;
	flex-direction: row-reverse;
}


.abt-box01::before {
	position: absolute;
	content: '';
	top: 0;
	left: 0;
	width: 477px;
	height: 28px;
	background: url(../img/bgimg04.png) no-repeat;
}
.abt-box01::after {
	position: absolute;
	content: '';
	bottom: 260px;
	left: 0;
	width: 184px;
	height: 163px;
	background: url(../img/bgimg02.png) no-repeat;
}
.abt-box02::after {
	position: absolute;
	content: '';
	right: 0;
	top: 230px;
	width: 212px;
	height: 318px;
	background: url(../img/bgimg03.png) no-repeat;
	z-index: 1;
}
.abt-box03::before {
	position: absolute;
	content: '';
	right: 45%;
	bottom: 70px;
	width: 508px;
	height: 28px;
	background: url(../img/bgimg05.png) no-repeat;
	z-index: 1;
}





.abt-bg {
	width: 48%;
	max-width: 880px;
	height: 640px;
	object-fit: cover;
}
.abt-box01 .abt-bg,
.abt-box02 .abt-bg{
	object-position: top;
}
.abt-txt{
	width: 735px;
	height: min-content;
	padding: 8rem 9rem;
	background: #fff;
	text-align: left;
}
.abt-txt h3 {
	font-size: 3rem;
	text-align: left;
	margin-bottom: 3rem;
}
.stc {
	padding-left: 35px;
	position: relative;
}
.stc::before {
	position: absolute;
	content: '';
	top: 0;
	left: 5px;
	width: 1px;
	height: 100%;
	background-color: #000;
}




.abt-box02 .abt-txt {
	margin-bottom: 100px;
	z-index: 1;
}
.abt-box03 .abt-txt {
	margin-top: 100px;
}



.con1260 {
	width: 100%;
	max-width: 1260px;
	margin: 0 auto;
}



#products {
	background: url(../img/bgimg01.jpg);
	position: relative;
}
#products::before {
	content: "";
	width: 490px;
	height: 28px;
	position: absolute;
	top: 50rem;
	right: 0;
	background: url(../img/bgimg06.png);
	z-index: 0;
}
#products::after {
	content: "";
	width: 402px;
	height: 28px;
	position: absolute;
	top: 78%;
	left: 0;
	background: url(../img/bgimg07.png);
	z-index: 0;
}
.substc {
	font-size: 2rem;
	width: fit-content;
	margin: 0 auto 4rem;
}
.pdt-wrap {
	margin-top: 2rem;
	display: flex;
	flex-wrap: wrap;
}
.pdt-box {
	width: 47%;
	margin-top: 7rem;
	z-index: 1;
}
.pdt-box:nth-of-type(2),
.pdt-box:nth-of-type(4) {
	margin-right: 6%;
}
.pdt-box_standard {
width: 100%;
}
.pdt-img {
	width: 100%;
	margin-bottom: 2rem;
}
.pdt-name01,
.pdt-name02 {
	text-align: center;
}
.pdt-name01 {
	font-size: 2.4rem;
	padding-bottom: 4px;
	margin-bottom: 4px;
	position: relative;
}
.pdt-name01::after {
	position: absolute;
	content: '';
	width: calc(100% - 8rem);
	height: 1px;
	left: 4rem;
	bottom: 0;
	background: #000;
}
.pdt-name02 {
	font-size: 1.6rem;
	margin-bottom: 1.5rem;
}




.banner01 {
}
.bnr01-frame01-wrap {
	margin-right: 10px;
}
.bnr01-frame01 {
	max-width: 1250px;
	margin: 0 auto;
	border: 1px solid #000;
	width: calc(100% - 10px);
	height: calc(100% - 10px);
	margin-bottom: 10px;
	position: relative;

}
.bnr01-frame01:hover,
.bnr01-frame01:hover::before,
.bnr01-frame01:hover::after
 {
	background: #e9ded0;
	transition: all .3s linear;
	opacity: 1;
}
.bnr01-frame01:hover .bnr01-frame02
 {
	background: #e9ded0;
	display: none;
	transition: all .3s linear;
}
.bnr01-frame01::before {
	content: '';
	position: absolute;
	top: 10px;
	right: -10px;
	width: 20px;
	height: 20px;
	background: #fff;
	display: flex;
}
.bnr01-frame01::after {
	content: '';
	position: absolute;
	top: 10px;
	left: 10px;
	width: 100%;
	height: 100%;
	border: 1px solid #000;
	display: flex;
	z-index: 1;
}
.bnr01-frame02 {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 20px;
	height: 20px;
	background: #fff;
	z-index: 3;
}
.bnr01-ctt {
	display: flex;
	z-index: 3;
	position: relative;
}
.bnr01-h2 {
	content: '';
	width: 60%;
	top: -3.5rem;
	left: 50%;
	max-width: 720px;
	min-width: max-content;
	position: absolute;
	color: #fff;
	background: #000;
	padding: 10px 30px;
	z-index: 1;
	transform: translateX(-50%);
	-webkit- transform: translateX(-50%);
}
.bnr01-frame01 .in01 {
	width: calc(100% - 34rem);
	padding: 8rem 9rem 4rem 7rem;
}
.bnr01-frame01 .in02 {
	width: 32rem;
	line-height: 2.8;
	padding: 13rem 1rem 0;
	margin-right: 4rem;
	margin-bottom: 4rem;
	border-bottom: 1px solid #000;
	position: relative;
	display: flex;
	align-items: center;
	min-height: 16rem;
}
.bnr01-frame01 .in02::before {
	content: '';
	position: absolute;
	bottom: -10px;
	left: -25px;
	width: 60px;
	height: 60px;
	background: #e9ded0;
	border-radius: 50%;
	z-index: -1;
}
.bnr01-frame01 .in02::after {
	content: '';
	position: absolute;
	bottom: 6rem;
	left: 50%;
	width: 104px;
	height: 79px;
	background: url(../img/ist02.png);
}
.bnr01-frame01 .in02 p {
	margin-right: 1rem;
}




.banner02 {
	padding-top: 11rem;
}
.bnr02-bg01 {
	height: 220px;
	background: url(../img/bnrimg03.png) no-repeat;
	background-size: cover;
	background-position: right;
	position: relative;
}
.bnr02-bg01::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 342px;
	height: 220px;
	background: url(../img/bnrimg02.png) no-repeat;
	background-position: -80px -20px;
	z-index: 0;
}
.bnr02-bg01::after {
	content: '';
	position: absolute;
	width: calc(100% - 40px);
	height: calc(100% - 30px);
	top: 15px;
	left: 20px;
	border: 1px solid #9c621d;
	z-index: 2;
}
.bnr02-bg02 {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 4rem 5rem 4rem 370px;
}
.bnr02-bg02::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 60px;
	width: 217px;
	height: 242px;
	z-index: 3;
	background: url(../img/bnrimg01.png);
	background-size: contain;
}
.bnr02-txt {
	color: #fff;
	font-size: 3rem;
	margin-right: 10px;
}
.bnr02-txt span {
	display: block;
	margin-left: 50px;
}




#company {
	padding: 0 4rem;
}
#company > .con1260 {
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	padding: 11rem 0;
}
.cpn-wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.cpn-box {
	width: 23.5%;
}
.cpn-in01 {
	text-align: left;
	padding-left: 4.5rem;
	position: relative;
	margin-bottom: 1.5rem;
	font-size: 1.8rem;
}
.cpn-in01::before {
	content: '';
	position: absolute;
	width: 3.5rem;
	height: 1px;
	top: 50%;
	left: 0;
	background: #000;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
}
.cpn-imgwrap {
	border: 1px solid #000;
	width: 100%;
	aspect-ratio: 297/230;
}
.cpn-imgwrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.cpn-in02 {
	padding: 1.5rem 0;
	margin-bottom: 1.5rem;
	border-bottom: 1px solid #000;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.cpn-in02 p {
	line-height: 36px;
}
.itcimg-wrap {
	position: relative;
}
.itcimg {
	position: absolute;
	font-size: 3rem;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
/*田畑追加*/
 .wrap { 
	position: relative; 
  } 
  .wrap.style { 
	display: flex; 
	align-items: center; 
	justify-content: center;
  } 
  
  .blur { 
	z-index: -1; 
	position: absolute; 
	width: 100%; 
	height: 100%; 
	object-fit: cover; 
  } 
  .blur.style { 
	filter:brightness(0.5);
  } 
  
  .text { 
	z-index: 1; 
  } 
  .text.style { 
	color: #ffffff; 
	font-size: 1.5rem; 
	font-weight: bold; 
	text-shadow: 0 0 16px #000000, 0 0 16px #000000; 
  }



#contact {
}
.wrap-form {
	width: 100%;
	max-width: 760px;
	margin: 0 auto;
}
#contact h2 {
	font-size: 2.4rem;
	background: #4a3725;
	color: #fff;
	text-align: left;
	padding: 3rem 0 3rem 7rem;
	margin-bottom: 3rem;
}
#contact dl {
	padding: 0 7rem;
}
label {
	font-size: 1.5rem;
}
.contact_box1 {
	display: flex;
	align-items: center;
	margin-bottom: 1rem;
}
.contact_box2 {
	display: flex;
	align-items: flex-start;
	margin-bottom: 1rem;
}
.contact_box2 dt {
	margin-bottom: 10px;
}
.contact_box1 dt, 
.contact_box2 dt {
	width: 22rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	line-height: 3.5rem;
	padding-right: 1.5rem;
}
.contact_box1 dd,
.contact_box2 dd {
	flex-grow: 1;
	width: calc(100% - 22rem);
}
.contact_box1 dd input,
.contact_box2 dd input {
	width: 100%;
	box-sizing: border-box;
}
.contact_box1 p,
.contact_box2 p {
	font-size: 1.3rem;
}
.must {
	border: 1px solid #000;
	margin-left: 0.5rem;
	padding: 2px;
}
#contact dd input,
#contact dd textarea {
	border: none;
	font-size: 1.6rem;
	line-height: 2;
	padding: 0.5rem 1rem;
	background-color: #f5f5f5;
	border-radius: unset;
}
#input_comment {
	display: block;
	width:100%;
	box-sizing: border-box;
}


.privacy > div {
overflow-x: hidden;
overflow-y: scroll;
height: 200px;
padding: 10px;
font-size: 1.4rem;
border: 1px solid #ccc;
}
.privacy > div p + p {
margin-top: 1em;
}
.privacy > label {
display: flex;
align-items: center;
line-height: 2.6;
padding-top: 10px;
text-align: center;
cursor: pointer;
width: -moz-fit-content;
width: fit-content;
}
.privacy > label input{
	border: none;
	width: auto;
}
.privacy > label span{
	width: 100%;
}


.contact_box_submit {
	border-top: 1px solid #000;
	margin-top: 3rem;
}
.input_submit {
	text-align: center;
	font-size: 1.8rem;
	font-family: "Noto Serif JP", serif;
	width: 32rem;
	margin: 3rem auto 0;
	border: 1px solid #4a3725;
	background: #4a3725;
	color: #fff;
}
.input_submit input {
	width: 100%;
	height: 100%;
	line-height: 3;
}
.input_submit:hover {
	background: #e9ded0;
	color: #000;
	border: 1px solid #000;
	transition: all .3s linear;
}
.input_submit:hover input {
	color: #000;
	transition: all .3s linear;
}
.no-spin::-webkit-inner-spin-button,
.no-spin::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
	-moz-appearance:textfield;
}






.postcode {
	display: flex;
	align-items: center;
}
.postcode span:nth-child(1),
.postcode span:nth-child(2) {
	font-size: 1.3rem;
	display: block;
}
.postcode span:nth-child(1) {
	margin-right: 1.2rem;
}
.contact_box2 dd input.code01 {
	width: 8rem;
	margin-right: 0.8rem;
}
.contact_box2 dd input.code02 {
	width: 10rem;
	margin-left: 0.8rem;
}
.codelink {
	color: #a9a9a9;
	margin: 0.8rem 0 1rem;
	width: fit-content;
	position: relative;
}
.codelink::after {
	content: '';
	position: absolute;
	width: 100%;
	height: 1px;
	bottom: 0.2rem;
	left: 0;
	background: #a9a9a9;
}




#pagetop {
	position: fixed;
	width: 3.2rem;
	height: 17.9rem;
	bottom: 2rem;
	right: 3rem;
	z-index: 9;
	filter: drop-shadow(0px 0px 1px #fff) 
	drop-shadow(0px 0px 1px #fff) 
	drop-shadow(0px 0px 1px #fff);
}
#pagetop a:hover  {
	opacity:1;
}
#pagetop a:hover img {
	cursor: pointer;
	transform: translate(0, -10px);
	transition-duration: 0.3s;
}
#pagetop a img {
	width: 100%;
	height: 100%;
}




footer {
	padding: 8rem 4rem 4rem;
	background-color: #000;
	color: #fff;
}
footer ul {
	display: flex;
	justify-content: center;
	margin-bottom: 7rem;
}
footer li:not(:last-child) {
	margin-right: 4rem;
}
.foot-logo {
	width: 30rem;
	margin: 0 auto 8rem;
} 
small {
	font-size: 1.2rem;
	text-align: center;
}



.show767 {
	display: none;
}





@media screen and (max-width: 1650px) {

	.none1650 {
		display: none;
	}


	.slider li img {
		height: 80rem;
	}
	.logo {
		top: 50%;
		transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
	}

	.abt-wrap {
		height: unset;
	}
	.abt-box01,
	.abt-box02,
	.abt-box03 {
		position: relative;
		top: unset;
		left: unset;
		right: unset;
		bottom: unset;
		align-items: center;
	}
	.abt-box01,
	.abt-box03 {
		padding-left: 0;
	}
	.abt-box02 {
		padding-right: 0;
	}
	.abt-box01::before {
		position: absolute;
		content: '';
		top: 3rem;
		left: 0;
		width: calc(477px * 0.8);
		height: calc(28px * 0.8);
		background: url(../img/bgimg04.png) no-repeat;
		background-size: contain;
	}
	.abt-box01::after {
		position: absolute;
		content: '';
		bottom: 3rem;
		left: 0;
		width: calc(184px * 0.6);
		height: calc(163px* 0.6);
		background: url(../img/bgimg02.png) no-repeat;
		background-size: contain;
	}
	.abt-box02::after {
		position: absolute;
		content: '';
		right: 0;
		top: 3rem;
		width: calc(212px * 0.6);
		height: calc(318px * 0.6);
		background: url(../img/bgimg03.png) no-repeat;
		background-size: contain;
		z-index: 1;
	}
	.abt-box03::before {
		position: absolute;
		content: '';
		right: unset;
		left: 30%;
		bottom: 7rem;
		width: calc(508px * 0.8);
		height: calc(28px * 0.8);
		background: url(../img/bgimg05.png) no-repeat;
		background-size: contain;
		z-index: 1;
	}
	.abt-bg {
		width: 46%;
		height: 50rem;
	}
	.abt-txt {
		width: 54%;
		padding: 8rem;
	}
	.abt-box02 .abt-txt {
		margin-bottom: unset;
		z-index: unset;
	}
	.abt-box03 .abt-txt {
		margin-top: unset;
		z-index: unset;
	}



	#products::before,
	#products::after {
		display: none;
	}


}





@media screen and (max-width: 1340px) {
	
	.con1260 {
		max-width: 900px;
	}

	#about {
		margin-bottom: 0;
	}
	.abt-wrap {
		margin: 0 auto;
	}
	.abt-box01,
	.abt-box02,
	.abt-box03 {
		flex-direction: column;
		padding: 0 4rem;
	}

	.abt-bg,
	.abt-txt {
		width: 100%;
		max-width: 900px;
	}
	.abt-bg {
		height: 45rem;
	}
	.abt-txt {
		padding-bottom: 11rem;
	}
	.abt-box01::before {
		position: absolute;
		content: '';
		top: 48rem;
		left: unset;
		right: 0;
		width: calc(477px* 0.6);
		height: calc(28px* 0.6);
		background: url(../img/bgimg04.png) no-repeat;
		background-size: contain;
	}
	.abt-box01::after {
		position: absolute;
		content: '';
		bottom: 1rem;
		left: 0;
		width: calc(184px* 0.6);
		height: calc(163px* 0.6);
		background: url(../img/bgimg02.png) no-repeat;
		background-size: contain;
	}
	.abt-box02::after {
		position: absolute;
		content: '';
		right: 0;
		top: 47rem;
		width: calc(212px* 0.6);
		height: calc(318px* 0.6);
		background: url(../img/bgimg03.png) no-repeat;
		background-size: contain;
		z-index: 1;
	}
	.abt-box03::before {
		position: absolute;
		content: '';
		left: 0;
		bottom: 4rem;
		width: calc(508px* 0.6);
		height: calc(28px* 0.6);
		background: url(../img/bgimg05.png) no-repeat;
		background-size: contain;
		z-index: 1;
	}


	.bnr01-ctt {
		display: flex;
		flex-direction: column;
	}
	.bnr01-frame01 {
		max-width: 890px;
	}
	.bnr01-frame01 .in01 {
		width: 100%;
		padding: 8rem 4rem 2rem 5rem;
	}
	.bnr01-frame01 .in02 {
		min-height: unset;
		margin-left: auto;
		padding-top: 6rem;
	}
	.bnr01-frame01 .in02::after {
		content: '';
		position: absolute;
		bottom: unset;
		top: 0;
		left: 50%;
		width: calc(104px * 0.7);
		height: calc(79px * 0.7);
		background: url(../img/ist02.png);
		background-size: contain;
	}


	
	.bnr02-bg01 {
		height: 30rem;
		background: url(../img/bnrimg03.png) no-repeat;
		background-size: cover;
		background-position: right;
		position: relative;
	}
	.bnr02-bg02 {
		flex-direction: column;
		align-items: flex-start;
		justify-content: center;
		padding-top: 4rem;
		padding-bottom: 4rem;
		padding: 6rem 2rem 3rem 30rem;
	}
	.bnr02-bg01::before {
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		width: calc(342px * 0.9);
		height: calc(280px * 0.9);
		background: url(../img/bnrimg02.png) no-repeat;
		background-position: -60px 60px;
		background-size: 100%;
		z-index: 0;
	}
	.bnr02-bg02::after {
		content: '';
		position: absolute;
		bottom: 0px;
		left: 30px;
		width: calc(217px * 0.8);
		height: calc(242px * 0.8);
		z-index: 3;
		background: url(../img/bnrimg01.png);
		background-size: contain;
	}
	.bnr02-txt {
		/*font-size: 2.4rem;*/
		margin-right: 0;
		margin-bottom: 3rem;
		text-align: left;
	}
	
	.bnr02-txt span {
		margin-left: 0;
	}
	.bnr02-bg02 img {
		margin-left: auto;
		margin-right: 3rem;
	}


	#company > .con1260 {
		padding-bottom: 3rem;
	}
	.cpn-wrap {
		margin: 0 auto;
		max-width: 800px;
	}
	.cpn-box {
		width: 48%;
		max-width: 400px;
		margin-bottom: 8rem;
	}



	#pagetop {
		right: 2rem;
	}


}






.none900 {
	display: block;
}

@media screen and (max-width: 900px) {

	.none900 {
		display: none;
	}
	.bnr02-bg02 {
		padding-left: 28rem;
	}
	.bnr02-txt {
		font-size: 2.4rem;
		line-height: 2.2;
	}
	footer ul {
		flex-direction: column;
		align-items: center;
	}
	footer li {
		margin-bottom: 2rem;
	}
	footer li:not(:last-child) {
		margin-right: 0;
	}
	.foot-logo {
		width: 22rem;
	}

}


@media screen and (max-width: 767px) {



	.toggle {
		position: fixed;
		width: calc(10.2rem* 0.8);
		height: calc(7.9rem* 0.8);
		top: 1rem;
		right: 1rem;
	}
	.toggle .hum {
		width: calc(8rem* 0.65);
		height: calc(5.4rem* 0.65);
		position: absolute;
		top: 1.4rem;
		right: 1.4rem;
	}

	.toggle.active span {
		display: block;
		width: calc(6.4rem* 0.8);
		position: absolute; /* .toggleに対して */
		top: calc(5rem* 0.8);
		right: calc(6.5rem* 0.8);
		padding-top: 0.5rem;
		border-bottom: solid 2px #fff;
		/*transition: all .3s linear;*/
		}
		/* 最初のspanをマイナス45度に */
		.toggle.active span:nth-child(1) {
		top: calc(3.6rem* 0.8);
		right: calc(1.8rem* 0.8);
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg);
		border-bottom: solid 2px #fff;
		}
		/* 2番目と3番目のspanを45度に */
		.toggle.active span:nth-child(2) {
		top: calc(3.6rem* 0.8);
		right: calc(1.5rem* 0.8);
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
		border-bottom: solid 2px #fff;
		}
		
		.spnav ul {
			padding-top: 70px;
			padding-bottom: 30px;
		}






	.slider li img {
		height: 100vh;
		min-height: 120vw;
	}
	.logo {
		width: calc(100vw * 456 / 767);
		height: calc(100vw * 126 / 767);
	}


	h2 {
		font-size: 2.6rem;
	}
	#about {
		padding-top: 12rem;
	}
	.abt-box01, 
	.abt-box02, 
	.abt-box03 {
		padding: 0 3%;
	}
	.abt-txt h3 {
		font-size: 2.2rem;
		margin-bottom: 2.2rem;
	}

	.conpad {
		padding: 8rem 3%;
	}
	.abt-txt {
		padding-left: 0;
		padding-right: 0;
	}
	.stc {
		padding-left: 2rem;
	}

	.abt-box01::before {
		position: absolute;
		content: '';
		top: 48rem;
		left: unset;
		right: 0;
		width: calc(477px* 0.4);
		height: calc(28px* 0.4);
		background: url(../img/bgimg04.png) no-repeat;
		background-size: contain;
	}
	.abt-box01::after {
		position: absolute;
		content: '';
		bottom: 2rem;
		left: 0;
		width: calc(184px* 0.4);
		height: calc(163px* 0.4);
		background: url(../img/bgimg02.png) no-repeat;
		background-size: contain;
	}
	.abt-box02::after {
		position: absolute;
		content: '';
		right: 0;
		top: 47rem;
		bottom: 18rem;
		width: calc(212px* 0.4);
		height: calc(318px* 0.4);
		background: url(../img/bgimg03.png) no-repeat;
		background-size: contain;
		z-index: 1;
	}
	.abt-box03::before {
		position: absolute;
		content: '';
		left: 0;
		bottom: 4rem;
		width: calc(508px* 0.4);
		height: calc(28px* 0.4);
		background: url(../img/bgimg05.png) no-repeat;
		background-size: contain;
		z-index: 1;
	}

	.pdt-name01::after {
		position: absolute;
		content: '';
		width: calc(100% - 4rem);
		height: 1px;
		left: 2rem;
		bottom: 0;
		background: #000;
	}



	.pdt-wrap {
		justify-content: center;
	}
	.pdt-box {
		width: 100%;
	}

	.pdt-box:not(:nth-of-type(2n)) {
		margin-right: 0;
	}



	.bnr01-h2 {
		content: '';
		width: 60%;
		top: -3.5rem;
		left: 50%;
		max-width: 720px;
		min-width: max-content;
		position: absolute;
		color: #fff;
		background: #000;
		padding: 10px 30px;
		z-index: 1;
		transform: translateX(-50%);
	}




	.bnr02-bg01 {
		height: unset;
	}
	.bnr02-bg02 {
		padding: 6rem 3rem 5rem;
		align-items: center;
	}
	.bnr02-bg01::before {
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		width: calc(342px* 0.9);
		height: calc(280px* 0.9);
		background: url(../img/bnrimg02.png) no-repeat;
		background-position: -30px 60px;
		background-size: 100%;
		z-index: 0;
	}
	.bnr02-bg02::after {
		content: '';
		position: absolute;
		bottom: 0px;
		left: 65px;
		width: calc(217px* 0.8);
		height: calc(242px* 0.8);
		z-index: 3;
		background: url(../img/bnrimg01.png);
		background-size: contain;
	}
	.bnr02-txt {
		margin-bottom: 12rem;
		text-align: center;
	}



	#company {
		padding: 0 3%;
	}
	.cpn-in02 {
		padding: 0.8rem 0;
		margin-bottom: 1rem;
	}




	#contact h2 {
		font-size: 2.4rem;
		background: #4a3725;
		color: #fff;
		text-align: left;
		padding: 1.5rem 0 1.5rem 4rem;
		margin-bottom: 3rem;
	}
	#contact dl {
		padding: 0px;
	}
	.contact_box1,
	.contact_box2 {
		margin-bottom: 2rem;
	}
	.contact_box1 {
		flex-direction: column;
		align-items: flex-start;
	}
	.contact_box2 {
		display: block;
	}
	.contact_box1 dt,
	.contact_box2 dt {
		width: 100%;
		border-bottom: 1px solid #000;
		margin-bottom: 1rem;
	}
	.contact_box1 dd,
	.contact_box2 dd {
		width: 100%;
	}


	.must {
		padding: 2px;
	}
	#input_address {
		width: 100%;
	}
	.input_submit {
		width: 28rem;
	}
	.input_submit input {
		line-height: 2.5;
	}

	#pagetop {
		position: fixed;
		width: calc(3.2rem * 0.8);
		height: calc(17.9rem * 0.8);
		bottom: 2rem;
		right: 1rem;
	}


	footer {
		padding: 6rem 4rem 2rem;
	}



}



@media screen and (max-width: 600px) {


	.cpn-wrap {
		justify-content: center;
		max-width: 500px;
		margin: 0 auto;
	}
	.cpn-box {
		width: 100%;
	}
}



.br550 {
	display: none;
}

@media screen and (max-width: 550px){


	.br550 {
		display: block;
	}

	.bnr01-ctt {
		padding-top: 4rem;
	}
	.bnr01-h2 {
		position: static;
		transform: unset;
		margin: 0 auto;
		padding: 1rem 2rem;
	}
	.bnr01-frame01 .in01 {
		padding: 3rem 2rem 3rem 3rem;
	}
	.bnr01-frame01 .in02 {
		width: unset;
		margin-right: 1.5rem;
		line-height: 1.8;
	}
	.bnr01-frame01 .in02::before {
		content: '';
		position: absolute;
		bottom: -10px;
		left: -15px;
		width: 50px;
		height: 50px;
		background: #e9ded0;
		border-radius: 50%;
		z-index: -1;
	}
	.bnr01-frame01 .in02::after {
		content: '';
		position: absolute;
		bottom: unset;
		top: 0;
		left: 50%;
		width: calc(104px* 0.6);
		height: calc(79px* 0.6);
		background: url(../img/ist02.png);
		background-size: contain;
		background-repeat: no-repeat;
	}


	.bnr02-bg01 {
		height: unset;
	}
	.bnr02-bg02 {
		align-items: center;
	}

	.bnr02-bg01::before {
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		width: calc(342px * 0.85);
		height: calc(260px * 0.85);
		background: url(../img/bnrimg02.png) no-repeat;
		background-position: -60px 60px;
		background-size: 100%;
		z-index: 0;
	}
	.bnr02-bg01::after {
		content: '';
		position: absolute;
		width: calc(100% - 24px);
		height: calc(100% - 24px);
		top: 12px;
		left: 12px;
		border: 1px solid #9c621d;
		z-index: 2;
	}
	.bnr02-bg02::after {
		content: '';
		position: absolute;
		bottom: 0px;
		left: 45px;
		width: calc(217px * 0.65);
		height: calc(242px * 0.65);
		z-index: 3;
		background: url(../img/bnrimg01.png);
		background-size: contain;
	}

	.bnr02-bg02 img {
		margin-right: 0;
		width: calc(106px * 0.8);
		height: calc(42px * 0.8);
		object-fit: contain;
	}
	.bnr02-txt {
		margin-bottom: 10rem;
	}




}


#about .substc-wrap {
	padding: 0 4rem;
	margin-bottom: 7rem;
}
#about .substc {
	margin-bottom: 0;
}
@media screen and (max-width: 767px) {
	#about .substc-wrap {
		padding: 0 3%;
	}
}

/* サンクスページ */
.thanks {
position: relative;
}
.thanks_ttl {
display: flex;
align-items: center;
justify-content: center;
height: 300px;
font-size: 2.7rem;
background-image: url(../img/thanks_bg.jpg);
background-size: cover;
}
.thanks_wrap {
max-width: 1260px;
margin: auto;
padding: 120px 15px;
}
.thanks_txt {
width: fit-content;
margin: auto;
}
.thanks_more {
margin: 3rem auto 0;
font-size: 1.8rem;
width: 32rem;
text-align: center;
color: #fff;
background-color: #4a3725;
border: 1px solid #4a3725;
}
.thanks_more a {
display: block;
padding: 10px;
}
.thanks_more:hover {
color: #000;
background: #e9ded0;
border: 1px solid #000;
transition: all .3s linear;
}
@media screen and (max-width: 1023px) {
	.thanks_ttl {
	height: 200px;
	}
}
@media screen and (max-width: 767px) {
	.thanks_ttl {
	height: 150px;
	}
	.thanks_more {
	width: 28rem;
	}
	.thanks_more a {
	padding: 8px;
	}
}

/* 20240726小倉追加 会社説明動画 */
.youtube {
max-width: 1200px;
margin: 80px auto;
}
.youtube iframe {
display: block;
width: 100%;
height: 675px;
}
@media screen and (max-width: 1260px) {
	.youtube {
	padding: 0 4rem;
	}
	.youtube iframe {
	height: 53vw;
	}
}
@media screen and (max-width: 767px) {
	.youtube {
	margin: 40px auto;
	padding: 0 3%;
	}
}

/* 20241107小倉追加 お知らせモーダル表示 */
.modal {
display: none;
position: fixed;
z-index: 1000;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
}
.modal-content {
position: relative;
background-color: #fff;
margin: 15% auto;
padding: 40px 30px;
width: calc(100% - 60px);
max-width: 600px;
border-radius: 5px;
}
.close {
z-index: 1;
cursor: pointer;
position: absolute;
width: 28px;
height: 28px;
top: 10px;
right: 10px;
font-size: 28px;
font-weight: bold;
line-height: 1;
color: #000;
}
.close:hover,
.close:focus {
color: #aaa;
text-decoration: none;
}
.modal_ttl {
margin-bottom: 20px;
font-size: 130%;
font-weight: bold;
text-align: center;
}
.modal_txt2 {
width: fit-content;
margin: 0 auto 20px;
padding-bottom: 5px;
font-size: 110%;
font-weight: bold;
text-align: center;
border-bottom: 1px solid #000;
}
.modal_txt2 br {
display: none;
}
.modal_txt3 {
}
.modal_txt3 + .modal_txt3 {
margin-top: 1em;
}
.modal_txt3 p + p {
}
@media screen and (max-width: 767px) {
	.modal-content {
	padding: 30px 20px;
	max-width: 400px;
	}
	.modal_ttl {
	font-size: 120%;
	}
	.modal_txt2 {
	padding-bottom: 10px;
	font-size: 100%;
	}
	.modal_txt2 br {
	display: block;
	}
}