/* Media Query ================================================================================*/
.sp{display: none;}
.pc{display: inline-block;}

@media only screen and (max-width : 599px) {
	.sp{display: inline-block;}
	.pc{display: none;}

	body{
		min-width: inherit!important;
		}
	
	p,
	ul li,
	table th,
	table td{
		font-size: 4.5vw;
		}

	
	section{
		padding: 15% 0;
		}
	
	table.tb01{
		width: 100%;
		}
	table.tb01 th,
	table.tb01 td{
		display: block;
		}
	table.tb01 th{
		width: 100%;
		font-weight: bold;
		text-align: left;
		border-bottom: none;
		padding: 2% 4% 0 4%;
		}
	table.tb01 td{
		padding: 2% 4% 2% 8%;
		}
	

	.wrap{
		width: 94%;
		}

	p{
		font-size: 4.2vw;
		}

	.title01{
		font-size: 6vw;
		margin-bottom: 10%;
		text-align: center;
		}
	.title01::after{
		font-size: 3.4vw;
		}
	.title02{
		font-size: 5.5vw;
		margin-bottom: 5%;
		}
	.title03{
		font-size: 5vw;
		padding: 2% 2% 2% 5%;
		}

	.tel{
		font-size: 8vw;
		}
	.mail{
		font-size: 5vw;
		padding: 2% 4%;
		}

	.more{
		width: 60%;
		font-size: 4.5vw;
		padding: 3% 10% 3% 4%;
		margin: 0 0 0 auto
		}


	/* header */
	header .wrap{
		align-items: flex-end;
		width: 100%;
		padding: 2% 4%;
		}

	header .name{
		width: 85%;
		}
	header .name p{
		font-size: 3.4vw;
		margin-bottom: 2%;
		}
	header .name p:nth-child(2){
		font-size: 8vw;
		line-height: 1.1;
		}
	header .name p:nth-child(2) span{
		display: block;
		font-size: 4vw;
		}

	header .contact{
		display: none;
		}

	.menu-btn{
		display: block;
		width: 12%;
		}

	nav{
		position: fixed;
		top: 0;
		right: 0;
		z-index: 999;
		width: 70%;
		height: 100vh;
		background-color: #FFF;
		transform: translateX(100vh);
		transition: all .5s linear;
		opacity: 0;
		}
	nav.is-active{
		transform: translateX(0);
		opacity: 1;
		}
	ul.menu{
		flex-direction: column;
		width: 86%;
		padding-top: 25%;
		margin: 0 auto;
		}
	ul.menu li{
		width: 100%;
		padding: 4% 0;
		}
	ul.menu li:not(:last-child){
		border-bottom: #d9e2e4 1px solid;
		margin: 0;
		}
	
	ul.menu li a{
		font-size: 5vw;
		}
	ul.menu li button{
		display: block;
		width: 60%;
		color: #FFF;
		font-size: 4.5vw;
		background-color: #144f61;
		border: none;
		padding: 4% 0;
		margin: 5% 0 0 auto;
		}
	.bk {
		display: none;
		position: fixed;
		z-index: 99;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #11253e;
		opacity: 0.6;
		transition-duration: .5s;
		}

	/* footer */
	.contactArea{
		padding: 10% 0;
		}
	.contactArea p:first-child{
		font-size: 5vw;
		}
	.contactArea p:nth-child(2){
		margin: 4% 0 4%;
		}
	.contactArea .tel{
		font-size: 11vw;
		margin: 0 auto 2%;
		}
	.contactArea .tel + p{
		font-size: 5vw;
		}
	
	footer .wrap{
		flex-direction: column;
		align-items: center;
		padding: 10% 0;
		}
	footer .info > p:first-child{
		font-size: 3vw;
		}
	footer .name{
		font-size: 5.5vw;
		margin: 2% 0 5%;
		}
	
	footer address{
		font-size: 4.2vw;
		}
	ul.footerMenu{
		display: none;
		}
	.copy{
		width: 100%;
		font-size: 3.5vw;
		text-align: center;
		margin: 5% auto 0;
		}


	/* index.html */
	.eyecatch{
		width: 100%;
		margin: -5% auto 0;
		}
	.eyecatch img{
		height: 68vh;
		min-height: 480px;
		object-position: 40% center;
		}
	.eyecatch .catch{
		position: inherit;
		right: auto;
		bottom: auto;
		width: 100%;
		background-color: rgba(255,255,255,0.8);
		padding: 4%;
		margin: -10% 0 0 0;
 		text-shadow: none;
		}
	
	.catch h1{
		font-size: 5vw;
		line-height: 1.4;
		text-align: center;
		margin-bottom: 3%;
		}
	.catch h2{
		font-size: 4vw;
		line-height: 1.6;
		}

	.eyecatch + section{
		padding-top: 5%;
		}
	
	.pointArea .wrap{
		padding: 12% 0 10%;
		}
	ul.point{
		flex-direction: column;
		margin-bottom: 10%;
		}
	ul.point li{
		position: relative;
		width: 100%;
		text-align: left;
		padding: 5% 5% 5% 22%;
		margin-bottom: 5%;
		}
	ul.point li img{
		position: absolute;
		left: 5%;
		top: 50%;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		 -ms-transform: translateY(-50%);
		width: 12%;
		margin: 0;
		}
	.double{
		flex-direction: column;
		}
	.double > div{
		width: 100%;
		margin-bottom: 5%;
		}
	.feature.double{
		margin-bottom: 0;
		}

	ul.image{
		display: flex;
		justify-content: space-between;
		margin-bottom: 5%;
		}
	ul.image li{
		width: 30%;
		}

	.worksLink{
		flex-direction: column;
		align-items: flex-start;
		}
	.feature.double h2,
	.worksLink p{
		font-size: 5vw;
		}
	.worksLink p{
		margin-bottom: 4%;
		}

	
	ul.linkList{
		flex-direction: column;
		}
	ul.linkList li{
		width: 100%;
		min-height: auto;
		padding: 5% 5% 5% 20%;
		margin:  0 0 5% 0;
		}
	ul.linkList li::before{
		left: 2%;
		width: 3em;
		height: 3.5em;
		margin: 0;
		}
	ul.linkList li.takaraLink{
		padding: 30px 25px;
		margin: 0;
		}
	ul.linkList li.takaraLink::before{
		content: none;
		}
	ul.linkList li .title02{
		margin-bottom: 5px;
		}

	ul.linkList li a{
		font-size: 4vw;
		margin: 4% 0 0 auto;
		padding-bottom: 2%;
		}
	ul.linkList li.takaraLink{
		padding: 5% 5%;
		}
	ul.linkList li .title02{
		margin-bottom: 2%;
		}

	.newsArea .wrap{
		padding: 5% 0 15%;
		}
	dl.newsList dt,
	dl.newsList dd{
		float: none;
		width: 100%;
		font-size: 3.8vw;
		}
	dl.newsList dt{
		padding: 4% 0 0;
		border-bottom: none;
		}
	dl.newsList dd{
		padding: 2% 0 4%;
		}
	
	/* service  */
	.servicebox{
		flex-direction: column;
		margin-top: 15%;
		}
	.servicebox > div{
		width: 100%;
		margin-bottom: 10%;
		}
	.servicebox > div img{
		margin: 5% 0;
		}

	.servicebox > div ul{
		width: 90%;
		margin: 0 0 0 auto;
		}

	.maker{
		margin-bottom: 10%;
	}
	.maker img{
		width: 50%;
		margin: 0 auto;
	}

	#maker ul.check{
		flex-direction: column;
		align-items: center;;
	}
	#maker ul.check li{
		width: 30%;
	}

	#maker ul.check + p{
		text-align: center;
	}


	/* work  */
	.worksArea .detail:not(:last-child){
		margin-bottom: 15%;
		}
	.worksArea h2{
		font-size: 6vw;
		padding: 2% 5%;
		}
	.worksArea .comment{
		margin: 5% 0;
		}
	.worksArea .images{
		flex-direction: column;
		}
	.worksArea .images img{
		width: 100%;
		margin: 0 0 0 0;
		}
	.worksArea .images img:nth-child(2){
		margin-top: 2%;
		}

	.worksArea dl.info{
		display: flex;
		flex-wrap: wrap;
		width: 100%;
		}
	.worksArea dl.info dt,
	.worksArea dl.info dd{
		font-size: 4.5vw;
		line-height: 1.6;
		padding: 2% 4%;
		}
	.worksArea dl.info dd:nth-child(4n + 2) {
		background-color: transparent;
		}
	.worksArea dl.info dt{
		width: 100%;
		background-color: #ebebeb;
		}
	.worksArea dl.info dd{
		width: 100%;
		border-top: none;
		}
	
	/* contact --------------------------------------------------- */
	.inner{
		padding: 5% 0 10% 5%
		}
	.hour{
		margin-top: 5%;
	}



	
}