
img { max-width:100% !important; height:auto; }
main {
	margin:0 auto;
	padding-bottom:5.0em;
	width: calc( var(--vw) * 100 );
}
section {
	display:block;
	margin:7.0em auto;
	text-align:center;
}
section h1 {
	font-weight:bold;
	font-size:110%;
	text-align:center;
}
section h1 > span {
	font-weight:bold;
	font-size:220%;
}
img { display:block !important; }


@media only screen and (max-width: 849px) {
}



/* index slider ------------------------------ */

section#slider_t {
/*	width:100vw !important; */
	width: calc( var(--vw) * 100 );
	max-width:100% !important;
	overflow-x:hidden !important;
	margin:0 auto;
	position:relative;
	z-index:1;
}
section#slider_t #m_ttl {
	text-align:center;
	position:absolute;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	z-index:10;
	box-sizing:border-box;
	padding:2% 4%;
/*	background:rgb(255, 255, 255, 0.3); */
}
section#slider_t #m_ttl > img {
	display:block;
	height:5.0em;
	width:auto;
	margin:0 auto;
}
section#slider_t #m_ttl > p {
	margin-top:1.0em;
	font-weight:bold;
	font-size:250% !important;
	letter-spacing:0;
	color:#fff;
}

@media only screen and (max-width: 849px) {
section#slider_t #m_ttl {
	width:80%;
	padding:2.5em 0em;
}
section#slider_t #m_ttl > img {
	display:block;
	height:4.0em;
	width:auto;
	margin:0 auto;
}
section#slider_t #m_ttl > p {
	margin-top:1.0em;
	font-weight:bold;
	font-size:200% !important;
}
}



/* ------------------------------
	slider
------------------------------- */

.slider {
	display:block;
	position:relative;
}
.slick-dots {
	position:absolute;
	bottom:2.0em;
	display:flex;
	justify-content:center;
	gap:20px;
}
.slick-dots > li {
	padding:0;
	margin:0;
}
.slick-dots > li:before {
	content:"";
/*	display:none; */
	display:block;
	width:20px;
	height:20px;
	background:#eaeaea;
	border-radius:50% 50%;
}
.slick-dots > li > button {
	display:block;
	width:20px;
	height:20px;
	background:#eaeaea;
	border-radius:50% 50%;
}

.slick-dots > li:hover:before,
.slick-dots > li.slick-active:hover:before {
	background:#fff !important;
}
.slick-dots > li.slick-active:before {
	background:#666 !important;
}
.slick-dots > li button {
	display:none !important;
}
.slick-track {
	display:flex;
	align-items:stretch !important;
}
#techno .thum .slick-track {
	transform: unset !important;
}
.slick-list {
	max-width:100vw !important;
}
.slick-slide {
	display:block;
	margin:0 !important;
	padding:0 !important;
}
#slider_t .slick-slide img {
	max-width:100vw !important;
}
.slick-num { display:none; }



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

#slider_t .slick-arrow {
	display:block;
	width:30px !important;
	height:30px !important;
	position:absolute;
	top:50%;
	transform: translate(0%, -50%);
	-webkit-transform: translate(0%, -50%);
	-ms-transform: translate(0%, -50%);
	z-index:5;
}
#slider_t .slick-prev {
	left:5%;
}
#slider_t .slick-next {
	right:5%;
}
#slider_t .slick-arrow:before {
	diplay:none;
	content:"";
	display:block;
	width:30px !important;
	height:30px !important;
}
#slider_t .slick-prev:before {
	background:url(../images/slide_left.png) no-repeat;
	background-size:contain;
}
#slider_t .slick-next:before {
	background:url(../images/slide_right.png) no-repeat;
	background-size:contain;
}
.slick-num { display:block; }
.slick-num {
	font-size: 2.5vw;
	text-align: center;
	box-sizing:border-box;
	border-radius:10%;
	padding:0.2em 1.5em;
	color: #fff;
	background-color: #000;
	position:absolute;
	bottom:1.0em;
	left:50%;
	transform: translate(-50%, 0%);
	-webkit-transform: translate(-50%, 0%);
	-ms-transform: translate(-50%, 0%);
}
}




/* service ------------------------------ */

#service {
	width:100%;
}
#service > h1 {
	margin-bottom:1.0em;
}
#service .flex {
	margin:2.0em auto 0 auto;
}
/* #service .flex > div:nth-of-type(1) {
	width:35%;
}
#service .flex > div:nth-of-type(2) {
	width:60%;
	display:block;
} */
#service .flex > div {
	width:100%;
	display:block;
}
#service > p {
	text-align:left;
	display:inline-block;
}
#service .flex > div ol {
	text-align:left;
	display:inline-block;
}
#service .flex > div ol > li {
	margin:1.5em auto;
	font-size:140%;
}
#service .flex > div ol > li > span {
	display:block;
	font-weight:bold;
	margin-bottom:0.3em;
	margin-left:-2.0em;
	position:relative;
}
#service .flex > div ol > li > span:before {
	content:"";
	display:inline-block;
	margin-right:0.3em;
	margin-bottom:0.1em;
	vertical-align:bottom;
}
#service .flex > div ol > li#tm_q > span:before {
	height:2.0em;
	width:calc(2.0em * 0.6923);
	background:url(../images/logo_q.svg) no-repeat;
	background-size:contain;
}
#service .flex > div ol > li#tm_n > span:before {
	height:2.0em;
	width:calc(2.0em * 0.6513);
	background:url(../images/logo_n.svg) no-repeat;
	background-size:contain;
}
#service .flex > div ol > li#tm_s > span:before {
	height:2.0em;
	width:calc(2.0em * 0.613);
	background:url(../images/logo_s.svg) no-repeat;
	background-size:contain;
	margin-bottom:0em;
}

@media only screen and (max-width: 849px) {
#service .flex {
	width:90%;
	flex-wrap:wrap;
}
#service .flex > div:nth-of-type(1),
#service .flex > div:nth-of-type(2) {
	width:100%;
	display:block;
}
#service > p {
	text-align:left;
	display:inline-block;
	width:90%;
}
#service .flex > div ol > li > span {
	display:block;
	font-weight:bold;
	margin-bottom:0.3em;
	margin-left:-1.5em;
	position:relative;
}
}



/* company ------------------------------ */

#company {
	padding:4.0em 0 5.0em 0;
	background:rgba(0, 0, 0, 0.02);
}

#company > dl {
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-start;
	align-items:stretch;
	width:90%;
	max-width:700px;
	margin:3.0em auto !important;
	box-sizing:border-box !important;
}
#company > dl > dt,
#company > dl > dd {
	box-sizing:border-box !important;
	padding:0.5em 0.5em;
	text-align:left;
	border-bottom:1px solid #ddd;
}
#company > dl > dt {
	width:9.0em !important;
}
#company > dl > dd {
	width:calc(100% - 10.0em) !important;
	position:relative;
}
#company > dl > dd:before {
	content:"\FF1A"; /* ： */
	display:block;
	position:absolute;
	top:50%;
	left:-2.5em;
	transform: translate(0%, -50%);
	-webkit-transform: translate(0%, -50%);
	-ms-transform: translate(0%, -50%);
}

@media only screen and (max-width: 849px) {
#company > dl > dt {
	width:7.0em !important;
}
#company > dl > dd {
	width:calc(100% - 8.0em) !important;
	position:relative;
}
#company > dl > dd:before {
	content:"\FF1A"; /* ： */
	display:block;
	position:absolute;
	top:50%;
	left:-1.5em;
	transform: translate(0%, -50%);
	-webkit-transform: translate(0%, -50%);
	-ms-transform: translate(0%, -50%);
}
#company > iframe {
	width:90%;
	margin:0 auto;
}
}



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

#contact dl,
#contact dt,
#contact dd {
	padding:0; margin:0 auto;
}
#contact .red {
	font-weight:bold;
	color:#ff0000;
}
#contact .check {
	font-size:85%;
}
#contact {
	width:90%;
	max-width:800px;
	margin:7.0em auto 7.0em auto !important;
	text-align:left;
}
#contact > h1 {
	margin:0em auto 3.0em auto !important;
}
#contact dl {
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-start;
}
#contact dt {
	width:12.0em;
	margin-top:1.5em;
}
#contact dl:nth-of-type(2) dt {
	margin-left:-0.5em;
}
#contact dd {
	width:calc(100% - 13.0em);
	margin-top:1.5em;
}
#contact dt {
	width:12.0em;
	margin-top:1.5em;
}
#contact dl:nth-of-type(2) dt { width:13.5em; }
#contact dl:nth-of-type(2) dd { width:calc(100% - 15.0em); }
#contact .need { position:relative; }
#contact .need:after {
	content:"*";
	display:block;
	color:#ff0000;
	font-weight:bold;
	font-size:0.7em;
	position:absolute;
	top:0;
	right:-0.8em;
}
/* #contact [type=text] { width:15.0em; }
#contact .cellphone { width:calc(70% / 3); } */
#contact [type=text] { width:80%; }
#contact .cellphone { width:6.0em; }
#contact [type=text],
#contact textarea {
	box-sizing:border-box;
	padding:0.5em !important;
	box-sizing:border-box;
	padding:0.2em 0.5em;
	font-size:100%;
}
#contact textarea {
	display:block;
	width:100% !important;
	height:10.0em;
}
#contact [type=submit] {
	display:block;
	text-align:center;
	margin:3.0em auto !important;
	box-sizing:border-box;
	border: 1px solid #000;
	padding:1.5em 4.5em;
	background:#fff;
	color:#000 !important;
	cursor:pointer;
}
#contact .flex {
	margin:2.0em auto;
	padding:0;
	width:100%;
}
#contact .flex ul {
	display: flex;
	align-items:flex-start;
	justify-content: flex-start;
	margin:0 auto;
	padding:0;
}
#contact .flex ul li {
	width: 50%;
	padding: 1%;
	list-style: none;
}
#contact .flex ul li p { font-size: 0.8em; }
#contact .flex ul li img { width: 100%; }
#contact form > p { line-height:1.7em; }
#contact .flex .input p {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
#contact img.mailImg {
	display: inline-block;
	max-height: 1.0em;
	width: auto;
	text-align: top;
	vertical-align: middle;
}

@media screen and (max-width:864px) {
#contact { font-size:2.7vw; }
#contact dt,
#contact dd { width:100%; }
#contact dt { margin-top:1.7em; }
#contact dd { margin-top:0.5em; }
}



/* _________________________________ */

.howa {
	opacity: 0;
}
.fuwa {
	opacity: 0;
}
.howa.fadein_on {
	animation: howa_motion 2.0s ease 0.2s forwards;
}
.fuwa.fadein_on {
	animation: fuwa_motion 2.0s ease 0.2s forwards;
}
@keyframes howa_motion {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	} 
}
@keyframes fuwa_motion {
	0% {
		opacity: 0;
		transform: translate(0, 10%);
	}
	100% {
		opacity: 1;
		transform: translate(0, 0%);
	} 
}