@media screen and (max-width: 640px) {
	.spClose{
		display: none !important;
	}
	.spOpen{
		display: unset !important;
	}

/***********************************
 h2, h3, h4
***********************************/
	h2, h3{
		line-height:1.5em;
		text-indent: 0;
		height:auto;

		padding-left:0;
		text-align:center;
		font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	
	}

	h2{
		position: relative;
		margin: 0.5em 0;
		height: 100%;
		text-align: left;
		background-position: right;
		background-size: calc(100% - 3em);
	}
	h2 span{
		display: none;
	}
	h2 span.line{
		position: absolute;
		top: 0;
		bottom: 0;
		display: block;
		margin: auto 1.5em;
		background: linear-gradient(90deg, rgba(255,255,255,1) 70%,rgba(255,255,255,0) 100%);
		width: 12em;
		height: 2em;
		line-height: 2em;
		font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	}
	h2#rent span.line{
		width: 16em;
		font-size: 0.8em;
	}
	h2#service{ background-image: url(/images/ttl_service_sp.png); }
	h2#about{ background-image: url(/images/ttl_about_sp.png); }
	h2#contact{ background-image: url(/images/ttl_contact_sp.png); }
	h2#privacy{ background-image: url(/images/ttl_privacy_sp.png); }
	h2#terms{ background-image: url(/images/ttl_terms_sp.png); }
	h2#rent { background-image: url(/images/ttl_service_sp.png);}
	h2#news_detail { background-image: url(/images/ttl_news_sp.png);	}
	h2#recruit { height: auto; }
	h2#recruit > img { position: relative; left: 0; width: 100%; height: auto; }
	#home h2,
	h3{font-size: 1.4em;

		text-align: center;
	}

	#home h2#kazukazuno{
		margin:0;
		padding:0;
		background: none;
		height: auto;
	}
	#home h2#anshinshite{
		background: none;
		background: url(/images/bg_headline.png) no-repeat bottom center;
		padding-bottom:15px;
		background-size: contain;
		height: auto;
	}
	#home h2#zenryokude {
		background: none;
		background: url(/images/bg_headline.png) no-repeat bottom center;
		padding-bottom: 15px;
		background-size: contain;
		height: auto;
	}
	h3#gosyokugyodeno{
		text-indent:0;
		background: none;
		height:auto;
	}
	h3#gosyokugyodeno,
	h3#goriyoryokin,
	h3#donoyona,
	h3#contact_tel,
	h3#contact_form,
	h3#kojinjoho,
	h3#riyokiyaku,
	h3#rent_h3,
	h3#bosyuyoko{
		background: none;
	}

	h3.txt{
		margin: 1em 0;
		font-size: 2em;
	}
	h3.txt span{
		margin: 0;
		font-size: 0.5em;
	}

/***********************************
 #news
***********************************/
	#news a#newslist {
		top: 65px;
		right: 10px;
		width: 104px;
		height: 24px;
		line-height: 24px;
		background-size: 80% auto;
	}

	#news ul li {
		padding: 15px;
		text-indent: 0;
		;
	}

	#news ul li span {
		display: block;
		margin: 0 0 3px;
	}

	#news ul li.important span {
		margin-left: 0px;
	}
	#news ul li.important{
		background-position: 8em 16px;	
	}
/***********************************
 #newspage
***********************************/
		#newspage p.date{
			width: 98%;
		}
		#newspage h3 {
			width: 98%;
		}
		#newspage #newsBox {
			width:98%;
		}
		#newspage #newsBox img#photo1.fltL {
			margin: 5px 15px 15px 0;
		}
	
		#newspage #newsBox img#photo1.fltR {
			margin: 5px 0 15px 15px;
		}
	
		#newspage #newsBox img#photo2 {
			float: left;
			max-width: calc(50% - 7px);
		}
	
		#newspage #newsBox img#photo3 {
			float: right;
			width: calc(50% - 7px);
		}
	
		#newspage #newsBox img.photo4 {
			margin: 0 9px 0 0;
			width: calc((100% / 3) - 6px);
		}
		#newspage #relatedBox li {
			display: block;
			margin: 0 0 10px;
		}
		#newspage p.date.important {
			background-position: right 6.5em center;
		}

		#newspage #newsBox h4 {
			padding-left: 15px;
		}
/***********************************
 #mainimage
***********************************/
	#mainimage{
		height: 30vw;
	}
	#mainimage:has(#recruit){
		height: auto;
	}

/***********************************
 about
***********************************/
	table.aboutTbl{
		width: 100%;
	}
	table.aboutTbl th,
	table.aboutTbl td{
		display: block;
	}
	table.aboutTbl th{
		border-bottom: none;
	}

/***********************************
 contact
***********************************/
	#contact_telBox,
	#contact_lineBox{
		height: auto;
	}
	form table th,
	form table td{
		display: block;
	}
	form table th{
		border-bottom: none;
	}

/***********************************
 
***********************************/
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	.row.pc {
		display: none;
	}

	.row.sp {
		display: block;
	}
	body{
		min-width: 100%;
		letter-spacing: 0;
	}
	div.container{
		width: 100%;
	}

	header{
		height: 90px;
	}
	header h1{
		margin: 10px;
		width: 280px;
		height: 65px;
	}
	header h1 a{
		background-size: contain;
	}
	header ul#header_info{
		display: none;
	}

	footer{
		min-height: 680px;
		background: url(/images/footer_bg_sp.jpg) repeat-x right -20px bottom / auto 100%;
		font-size: 0.9em;
	}
	
	footer div.container a.recruit{
		margin: 10px 0 100px 15px;
		width: 216px;
		height: 90px;
	}
	footer ul.footer_nav,
	footer div#footer_logo{
		display: none;
	}
	footer #copyright{
		font-size: 0.8em;
	}
	article{
		box-sizing: border-box;
		width:100vw;
		padding:20px;
	}

	nav#globalNav{
		display: none;
	}
	
	.dwBtn,
	.drawer-menu{
		display: block;
	}
	/* dwWrap */
	#dwWrap{
		display: table;
		width: 100%;
		height: 100vh;
		box-shadow: 0 0 50px 0 rgba(0,0,0,.8);
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-delay: .3s;
		transition-delay: .3s;
		-webkit-transition-duration: .5s;
		transition-duration: .5s;
	}
	#dwWrap__inner{
		display: table-cell;
	}
	/* drawer menu */
	.drawer-menu{
		box-sizing: border-box;
		position: fixed;
		top: 0;
		right: 0;
		width: 100vw;
		height: 100%;
		padding: 40px 0;
		background: #d18202;
		text-align: left;
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-duration: .5s;
		transition-duration: .5s;
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
		-webkit-transform-origin: right center;
		-ms-transform-origin: right center;
		transform-origin: right center;
		-webkit-transform: perspective(500px) rotateY(-90deg);
		transform: perspective(500px) rotateY(-90deg);
		opacity: 0;
	}
	.drawer-menu li{
		text-indent:10vw;
		text-align: left;
	}
	.drawer-menu li a{
		display: block;
		height: 50px;
		line-height: 50px;
		font-size: 14px;
		color: #fff;
		-webkit-transition: all .8s;
		transition: all .8s;
	}
	.drawer-menu li a:hover{
		color: #1a1e24;
		background: #fff;
	}
	
	/* checkbox */
	.dwCheck{
		display: none;
	}
	
	/* menu button - label tag */
	.menu-btn{
		position: fixed;
		display: block;
		top: 30px;
		right: 10px;
		display: block;
		width: auto;
		min-width:40px;
		height: 40px;
		font-size: 10px;
		text-align: center;
		cursor: pointer;
		z-index: 3;
		margin:0;
		padding:0;
	}
	.bar{
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		width: 40px;
		height: 3px;
		background: #999999;
		-webkit-transition: all .5s;
		transition: all .5s;
		-webkit-transform-origin: left top;
		-ms-transform-origin: left top;
		transform-origin: left top;
	}
	.bar.middle{
		top: 13px;
		opacity: 1;
	}
	.bar.bottom{
		top: 26px;
		-webkit-transform-origin: left bottom;
		-ms-transform-origin: left bottom;
		transform-origin: left bottom;
	}
	.menu-btn__text{
		position: absolute;
		bottom: -13px;
		left: 0;
		right: 0;
		margin: auto;
		color: #666666;
		-webkit-transition: all .5s;
		transition: all .5s;
		display: block;
		visibility: visible;
		opacity: 1;
	}
	.menu-btn:hover .bar{
		background: #cccccc;
	}
	.menu-btn:hover .menu-btn__text{
		color: #cccccc;
	}
	.close-menu{
		display: none;
		position: fixed;
		top: 0;
		right: 300px;
		width: 10vw;
		height: 100vh;
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-duration: .3s;
		transition-duration: .3s;
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
		visibility: hidden;
		opacity: 0;
	}
	
	/* checked */	
	.dwCheck:checked ~ .drawer-menu{
		-webkit-transition-delay: .3s;
		transition-delay: .3s;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
		opacity: 1;
		z-index: 2;
	}
	.dwCheck:checked ~ #dwWrap{
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
		-webkit-transform: translateX(-100%);
		-ms-transform: translateX(-100%);
		transform: translateX(-100%);
	}
	.dwCheck:checked ~ .menu-btn .menu-btn__text{
		visibility: hidden;
		opacity: 0;
	}
	.dwCheck:checked ~ .menu-btn .bar.top{
		width: 56px;
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.dwCheck:checked ~ .menu-btn .bar.middle{
		opacity: 0;
	}
	.dwCheck:checked ~ .menu-btn .bar.bottom{
		width: 56px;
		top: 40px;
		-webkit-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	.dwCheck:checked ~ .close-menu{
		-webkit-transition-duration: 1s;
		transition-duration: 1s;
		-webkit-transition-delay: .3s;
		transition-delay: .3s;
		background: #D18202;
		visibility: visible;
		opacity: 1;
		z-index: 3;
	}

/* spNav */
	#spNav li{
		text-align:left;
		line-height:3em;
		border-bottom:1px solid #ffffff;
	}
	#spNav li a{
		text-decoration: none;
	}
	.row{
		width: 100%;
		display: block;
	}
	.row.boxColor{
		padding: 15px;
		width:calc(100% - 32px);
	}
	.row .column1,
	.row .column2,
	.row .column2.short,
	.row .column2.long,
	.row .column2.narrow,
	.row .column2.wide,
	.row .column3-1,
	.row .column3-2{
		margin:20px auto;
		padding:0;
		clear: both;
		float: unset;
		width: 100%;
	}
	.row .column4-1,
	.row .column4-3,
	.row .column5-1{
		background: #ff0000;
		width: calc(50% - 40px);
	}
	.row img + img{
		margin-top: 20px;
	}
	section .noBr{
		display:block;
	}
	section .showBr{
		display: none;
	}

	footer{
		height:auto;
		background:#494949;
	}
	section{
		width:100%;
	}
	/** HOME **/
	#home #mainimage {
		background:url(/images/main.png) no-repeat left;
		background-size:cover;
		background-position:0px;
		width:100%;
		height:350px;
	}
	@keyframes zoomMain {
		0% {
			background-size: 200%;
		}

		100% {
			background-size: 180%;
		}
	}
	#home #mainimage #sp_catch{
		opacity: 0;
		text-align:center;
		line-height:1.5em;
		width:100%;
		height:100px;
		position: absolute;
		top: 300px;
		color:#ffffff;
		font-size:1.4em;
		text-shadow:0 0 10px #cccccc,
			0 0 5px #000000,
			0 0 5px #000000,
			0 0 2px #000000;
		animation: zoomCatch 2s;
		animation-delay: 2s;
		animation-fill-mode: forwards;
	}
	@keyframes zoomCatch {
		0% {
			opacity: 0;
		}
		100% {
			opacity: 1;
		}
	}
	#home #topics .sp div{
		margin-top:60px;
	} 
	#home #tw{
		margin:auto;
		padding:auto;
	}
	
	#qa #qaBox .column2{
		width:100%;
		padding:0;
		margin:0;
	}
	#home h3#qa01 , #home h3#qa02,
	#home h3#qa03{
		background: none;
		height: auto;
	}
	#qa #qaBox .column2 p{
		width:calc(100% - 20px);
	}
	#home h3,
	h4{
		padding-left: 0;
		font-size: 1.3em;
	}
	#home #qaBox h3{
		text-align:left;
		width:calc(100% - 15px);
		padding-left: 15px;
		padding-top:35px;
		background:url(/images/bg_qa.png) no-repeat left top;
	}

/************  SP service  ***************/

	#photoline{
		display:none;
	}

	h4{
		text-align:center;
	}

	#bar{
		display:none;
	}
	#header_login{
		display:none;
	}
	#topics div#topicsBox div{
		display:none;
	}
	
	#topics div#topicsBox div a.imgChenge{
		bottom:0;
	}

	#qa #linkBox .column2.long{
		width:auto;
	}

	
	
	#contact table th,
	#contact table td{
		display: block;
	}
	#contact table th{
		width: auto;
		border-top: 3px double #cecece;
		border-left: none;
	}
	#contact .row .column3-2{
		margin-bottom: 25px;
	}
	
	input[type="text"],
	textarea{
		width: 95%;
	}
	section p{
		text-align:left;
	}
	#priceList{
		width:100%;
		overflow:auto;
	}
	#priceList table{
		width:800px;
	}
	/*********************/
	.bottom-contact {
		display: block;
		position: fixed;
		width: 100%;
		z-index: 100;
		bottom: 0;
		text-align: center;
		background: url(/images/bg_bottom-contact.png);
		animation-name: fade;
		animation-duration: 3s;
		animation-iteration-count: 1;
	}
	@keyframes fade {
		0% {
			opacity: 0;
		}
		100% {
			opacity: 1;
		}
	}
	#bottom-contact-copy {
		max-width: fit-content;
		overflow: hidden;
		margin: auto;
		padding: 0;
	}

	#bottom-contact-copy p {
		width: 100%;
		background: #b38600;
		color: #FFFFFF;
		display: inline-block;
	}

	.bottom-contact h3#bottom-contact-h3 {
		text-indent: 0;
		text-align: center;
		color: #FFFFFF;
		font-size: 22px;
		margin: 20px 0 0 0;
		line-height: 22px;
		height: auto;
	}

	.bottom-contact-2column {
		margin: 0;
		box-sizing: border-box;
		padding: 10px;
		width: 50%;
		float: left;
	}

	#bottom-contact-line {
		text-indent: -9999px;
		width: 155px;
		height: 44px;
		display: inline-block;
		background: url(/images/bottom_line.png);
		float: right;
	}

	#bottom-contact-tel {
		text-indent: -9999px;
		width: 155px;
		height: 44px;
		display: inline-block;
		background: url(/images/bottom_tel.png);
		float: left;
	}


/***********************************
 recruit
***********************************/
	p.recruitMessage{
		display: inline-block;
		font-size: 1.1em;
	}

	#recruitPerson{
		position: relative;
		margin: 80px auto 60px;
		min-width: auto;
		width: 90%;
	}
	#recruitPerson::after{
		bottom: 0;
	}
	
	#recruitPerson img{
		position: relative;
		right: 0;
		margin: auto;
		width: 100%;
		max-width: 446px;
	}
	#recruitPerson > div{
		position: relative;
		left: 0;
		margin: auto;
	}
	#recruitPerson > div h3{
		margin: 1.5em 0 0.5em;
	}
	#recruitPerson > div p{
		padding: 0 0 50px;
		font-size: 1.1em;
	}

	table.recruitTbl{
		margin: 30px auto;
		width: 100%;
	}
	table.recruitTbl th,
	table.recruitTbl td{
		display: block;
	}
	table.recruitTbl th{
		border-bottom: none;
	}

	p.recruitMessage + .contactBox{
		margin-top: 40px;
	}
}