@media screen and (max-width: 767px){
	/*==============================
	  general
	================================*/
	body{ font-size: 1.4rem;}
	p{ font-size: 3.5vw;}

	.pc{display: none !important;}
	.mobile{}
	.main{ font-size: 16px; margin-bottom: 30px;}
	.main-content{ margin: 0 auto; width: 90%;}
	.main-area{ margin: 0 auto;}
	.main-area-m{ margin: 0 auto; width: 95%;}
	#navi ul{background: #0d2e6a;}
	/*==============================
	  responsive
	================================*/
	.menu_pc, .craft_pc, .item_pc{display: none !important;}
	.craft_mobile{display: inline; margin: 5% auto;}
	/*==============================
	  commoncss
	================================*/
	br.mbbr{display: inline !important;}
	.edit-template{
		width: 100%;
	}
	.edit-template section{
		font-size: 4.5vw;
	}
	.main-template h2,
	.edit-template h2{
		font-size: 6vw;
		font-weight: bold;
		margin: 5% 0;
	}
	.edit-template h2::after{
		width: 15vw;
		margin: 0 auto;
	}
	.edit-template h3{font-size: 5vw; padding: 2.5vw 0;}
	.edit-template h4{font-size: 4.5vw;}
	.edit-template h5{font-size: 100%; margin-top: 5%;}
	.page-edit h1{
		position: relative;
		text-align: center;
		font-size: 24px;
		font-weight: bold;
		padding: 5px;
		margin: 5% 0;
	}
	.main-area > div{
		width: 95%;
		margin: 5% auto;
	}
	/*==============================
	  header
	================================*/
	.mainmenu .contact{display: none;}

	.logo p{
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-ms-align-items: center;
		align-items: center;
		justify-content: center;
		font-size: 3vw;
	}
	.logo h1 img{ width: 70vw; max-width: 300px;}
	.header-content{box-sizing: border-box;}
	.header-main{height: 18vw;}
	.header-main h1{
		width: 40vw;
		margin: 0;
		padding: 0;
	}
	.header-main h1 img{
		padding: 0;
		margin: 2vw;
	}

	.drawer-overlay{ display: none !important;}
	.logo{
		position: relative;
		margin: 20px auto 0 !important;
	}
	.menu_mobile{}
	.tel_sp{
		position: fixed;
		color: #0d2e6a;
		font-size: 40px;
		top: 5px;
		right: 80px;
	}
	.drawer--right .drawer-nav{ right: -45vw;}
	.drawer--right.drawer-open .drawer-hamburger{ right: 40vw;}
  .drawer-toggle { display: block; cursor: pointer;}
  .drawer-nav {
		background-color: #0d2e6a;
		color: #fff;
		z-index: 20;
  }
  .drawer-nav .nav {
  }
  .drawer-nav li { display: block; margin: 10% 5%; text-align: left;}
  .drawer-nav li a { font-size: 16px; color: #fff;}
  .drawer-toggle,
  .drawer-toggle span {
    display: inline-block;
    box-sizing: border-box;
  }
  .drawer-toggle {
    z-index: 20;
    position: fixed;
    width: 40px;
    height: 36px;
		margin: 4vw;
		padding: 18px;
  }
  .drawer-toggle span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 5px;
    background-color: #0d2e6a;
    border-radius: 20px;
  }
  .drawer-toggle span:nth-of-type(1) { top: 0;}
  .drawer-toggle span:nth-of-type(2) { top: 16px;}
  .drawer-toggle span:nth-of-type(3) { bottom: 0;}
	.drawer-dropdown-menu{background-color: #0d2e6a;}
	.drawer-menu-item,.drawer-dropdown-menu-item{padding: 0;}
	.drawer-dropdown-menu li{
		margin: 5px;
		width: auto;
		text-align: left;
	}
	.drawer-dropdown-menu-item{
		padding: 0;
		font-size: 14px !important;
		line-height: 1.5;
		margin: 15px 0;
	}
	/*==============================
	  footer
	================================*/
	/* fotter-main */
	.footer{
		text-align: center;
	}
	#footer_in{
		font-size: 16px;
		padding: 5% 3%;
		box-sizing: border-box;
	}
	#foot_contact{
		-ms-align-items: center;
		align-items: center;
		flex-direction: column;
	}
	#foot_contact h2{
		text-align: center;
		margin: 3% auto;
	}
	.footer-main{
		flex-direction: column;
		-ms-align-items: center;
		align-items: center;
	}
	.footer_img{
		width: 80vw;
	}
	.f_address h2{
		padding: 1vw 2vw;
		margin: 0;
	}
	.f_address{
		font-size: 3vw;
		align-items: center;
		text-align: center;
		flex-direction: column;
	}
	.footer-link{display: none;}
	.map{
		width: 70vw;
		margin-top: 3vw;
	}

	.copylight{ padding: 1%; font-size: 12px; color: #fff; text-align: center;}
	/*==============================
	  toppage
	================================*/
	.top-area h2{
		font-size: 14vw;
		white-space: nowrap;
	}
	.btn{
		font-size: 4vw;
		padding: 3vw;
		line-height: 1;
	}
	.bannar_txt{
		top: 10vw;
		font-size: 3vw;
	}
	.bannar_txt span{
		font-size: 4vw;
	}
	.news{
		position: relative;
		width: 95vw;
		position: relative;
		margin: 3vw auto;
	}
	.news h2 {
		line-height: 1.2;
		margin: 3vw;
	}
	.news h2 span {
		font-size: 3vw;
	}
	.news h2::after {
		bottom: 6.5vw;
	}.news-list{
		padding-bottom: 5vw;
	}
	.news-child:nth-child(n+2) {
	  display: none;
	}
	.news-child{
		width: 90%;
		margin: 2vw auto;
		padding: 1vw 2vw;
	}
	.news-child a{
		font-size: 3.5vw;
		display: block;
	}
	.news-child a span{
		font-size: 3vw;
		display: block;
	}
	#about{
		padding: 5vw 0 15vw;
	}
	#about::after{
		bottom: -15vw; /* 矢印の高さ */
		height: 15vw;
	}
	#about h2{
		display: block;
		line-height: .75;
		margin: 7vw 0;
	}
	.about_txt,
	.about_img{
		width: 100%;
	}
	.about_img{
		position: relative;
	}
	.about_img_l,
	.about_img_r{
		width: 45vw;
	}
	.service_item,
	.company_item{
		margin: 1vw;
	}
	.service_item p{
		font-size: 6.5vw;
	}
	.service_flow{
		flex-direction: column;
	}
	.service_flow_cr{
		right: 0%;
	}
	.service_flow_cl{
		left: 0%;
	}
	h3.service_title span{
		font-size: 3.5vw;
	}
	.service-title{
		margin: 5vw 0;
	}
	.service-title .subtitle{
		bottom: 0vw;
	}
	h3.service_title.service_title_l{
		width: 100%;
		margin-bottom: 5vw;
	}
	.service_moive p{
		font-size: 4vw;
	}
	.parts_processing{
		right: 0;
		bottom: -5vw !important;
	}
	.service-right{
		top: -25vw;
		right: 35vw;
	}
	.service-left{
		left: 35vw;
	}
	.service_problem{
		flex-direction: column-reverse;
		margin: 5% auto;
	}
	.service_cmt{
		margin: 5vw auto;
		width: 90vw;
	}
	.service_cmt:before {
		top: auto;
		bottom: -24px;
	  left: 50%;
		margin-top: auto;
	  margin-left: -15px;
	  border: 12px solid transparent;
	  border-top: 12px solid #eee;
	  z-index: 2;
	}
	.service_cmt:after {
		top: auto;
		bottom: -30px;
	  left: 50%;
		margin-top: auto;
	  margin-left: -17px;
		border: 14px solid transparent;
	  border-top: 14px solid #c9c9c9;
	  z-index: 1;
	}
	.service_table td span{
		display: block;
	}
	.service_suggestion{
		width: 90vw;
	}
	h2#uae{
		margin: 5vw auto 15vw;
	}
	#uae .subtitle{
		top: 20vw;
	}
	.company_item{
		justify-content: space-around;
		gap: 1vw;
	}
	.company_txt span{
		font-size: 6vw;
	}
	.company_txt2{
		width: 85%;
	}
	.company_txt2 span{
		font-size: 6.5vw;
	}
	.company_txt2 img{
		flex-shrink: 1;
		min-width: 0;
	}
	#recruit{
		padding: 5vw 0;
	}
	.recruit_area,
	.recruit_area h3{
		color: #0d2e6a;
	}
	.recruit_area h3{
		line-height: 1.5;
		font-weight: bold;
	}
	.recruit_area h2{
		margin: 3vw auto 15vw;
	}
	.topform{
		border-radius: 50px 0 50px 0;
		padding: 5vw;
	}
	.swiper-button-next { right: -10vw;}
	.swiper-button-prev { left: -10vw;}
	.recruit_img{
		height: 30vh;
		object-fit: cover;
	}
	/*==============================
	  page
	================================*/
	.bannar img{
		height: 45vw;
		object-fit: cover;
		width: 100%;
		overflow: hidden;
	}
	.bannartxt{
		font-size: 8vw;
		line-height: 1;
	}
	.bannartxt span{
		font-size: 3.5vw;
	}
	.subtitle{
		font-size: 8.5vw;
		top: 7.5vw;
	}
	.subtitle_sp{
		font-size: 7vw;
	}

	.child-title,
	.child-title2{width: 50vw;}
	.edit-template .child-area{
		width: 90vw;
	}
	.child-area-l{
		width: 100%;
	}
	.edit-template section:nth-of-type(n+3){
		padding-top: 15vw;
	}
	.edit-template section:nth-child(n+3)::before{
		height: 10vw;
	}
	.service_box{
		width: 90vw;
	}
	/* about-page */
	.about .txt{
		width: 85%;
		margin: 5% auto;
	}
	.about .area{
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		flex-direction: column;
	}
	.about .area img{
		width: 85vw;
	}
	.about .area:nth-child(odd){
		align-items: flex-start;
	}
	.about .area:nth-child(even){
		align-items: flex-end;
	}
	.flowchat{
		flex-direction: column;
		margin-top: 10vw;
	}
	.flowtxt_l,
	.flowimg{
		width: 100%;
		align-items: center;
	}
	.flowtxt_img{ width: 20vw;}
	.flowtxt h5{ margin: 0 0 5%;}
	.line{display: none;}
	/* service-page */
	.machine-list li{
		width: 45%;
	}
	table tr,
	table th,
	table td {
		width: 100%;
    display: block; /* ブロック要素化 */
  }
	.machine-table,
	.machine-table th,
	.machine-table td{
		border: none;
	}
	.machine-table thead{
		display: none;
	}
	.machine-table tr {
		margin: 5% 0;
		border: 2px solid #000;
	}
	.machine-table tbody tr:nth-child(even){
		background: transparent;
	}

	.machine-table td+td{
		border-top: 2px solid #000;
	}
	.machine-table td {
		position: relative;
	}
	.machine-table td:nth-child(even){
		background: #ddd;
	}
	.machine-table td::before {
		content: attr(data-label); /* 項目名を表示 */
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		width: 45%;
		padding-left: 5px;
		font-weight: bold;
		text-align: left;
	}
	.company_table{
		margin-top: 10vw;
	}
	.company_table tr{padding: 10px 0;}
	.company_table th,
	.company_table td{ width: 100%; padding: 0;}
	.company_history td{
		display: block;
	}
	.company_history td span{
		width: 5vw;
		padding-right: 3vw;
	}
	.process_area{
		flex-direction: column;
		margin: 15% auto 0;
	}
	.process_area > img,
	.process_area > *{
		width: 90vw;
		margin: 0 auto;
	}
	.process_data img{
		width: 15vw;
	}
	.process_data div p{
		font-size: 4.5vw;
	}
	/* message */
	.message-area{
		flex-direction: column-reverse;
	}
	.message-txt{
		width: 100%;
		margin: 5% auto;
	}
	.privacy_policy{
		font-size: 3.5vw;
	}
	/*==============================
	  news
	================================*/
	.blog-template{
		flex-direction: column;
	}
	#sidebar{
		width: 100%;
		margin: 0 10vw 5vw;
	}
	.blog-contents{
		font-size: 4vw;
	}
	.blog-date{
		font-size: 3.5vw;
	}
	.blog-area{
		padding-bottom: 2vw;
	}
	.box-blog{
		flex-direction: column;
		align-items: flex-end;
	}
	.blog-detail{
		width: 100%;
		display: block;
	}
	.box-blog h3{
		font-size: 4.5vw;
		text-align: left;
	}
	.blog-box{
		border: 1px solid #ccc;
		box-shadow:2px 2px 2px rgba(0,0,0,.25);
		padding: 3%;
		margin: 5% 0;
	}
	.custom-prev-class, .custom-next-class{
		margin: 5%;
	}
	/*==============================
	  googlemap
	================================*/
	.ggmap {
		position: relative;
		padding-bottom: 56.25%;
		padding-top: 30px;
		height: 0;
		overflow: hidden;
		margin: 5% auto;
	}
	.ggmap iframe,
	.ggmap object,
	.ggmap embed {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	/*==============================
	  contact form7
	================================*/
	.contact-area{
		width: 90%;
		margin: 0 auto;
	}
	.contactform th{ line-height: 2;}
	.wpcf7{ margin: 1% 0;}
	input[type="submit"].wpcf7-submit,
	input[type="reset"].resetbtn{
		font-size: 20px;
		font-weight: bold;
		text-align: center;
		padding: 15px;
		width: 100%;
		margin: 0 auto;
		border: none;
	}
	.asterisk{ margin: 0 0 0 0.2em; color: #f5637a;}
	.wpcf7 span.wpcf7-not-valid-tip{ font-size: 80%;}
	.wpcf7 input[type="text"],
	.wpcf7 input[type="email"],
	.wpcf7 input[type="tel"],
	.wpcf7 select,
	.wpcf7 input[type="url"],
	.wpcf7 textarea{
		background-color: #fff;
		color: #000;
		width: 95%;
		border: 1px solid #ddd;
		font-size: 20px;
		padding: 1px;
	}
	.wpcf7-form p{ padding: 10px 0;}
	/* 送信ボタン */
	input.sub-btn{
		width: 300px;
		height: 60px;
		background: #F90;
		color: #FFF;
		font-size: 1.1em;
		font-weight: bold;
		letter-spacing: 0.2em;
		text-indent: 0.2em;
		border: 1px solid #ffae13;
		-webkit-transition: 0.3s;
		-moz-transition: 0.3s;
		-o-transition: 0.3s;
		-ms-transition: 0.3s;
		transition: 0.3s;
	}
	/* 送信ボタンホバー */
	input.sub-btn:hover{ background: #FFF;	color: #F90;}
	input[type="password"]{
		background-color: #fff;
		color: #333;
		border: 1px solid #ddd;
		font-size: 100%;
		padding: 0.5em;
		border-radius: 4px;
		box-shadow: 1px 1px 3px rgba(0,0,0,.1) inset;
	}
	input.subon{
		width: 150px;
		height: 40px;
		background: #F90;
		color: #FFF;
		font-size: 1.1em;
		font-weight: bold;
		letter-spacing: 0.2em;
		text-indent: 0.2em;
		border: 1px solid #ffae13;
		-webkit-transition: 0.3s;
		-moz-transition: 0.3s;
		-o-transition: 0.3s;
		-ms-transition: 0.3s;
		transition: 0.3s;
	}
	/* 送信ボタンホバー */
	input.subon:hover{ background: #FFF;	color: #F90;}
}
