@charset "utf-8";

/*■ PC : 641px < Window Size ■*/
@media print,screen and (min-width: 641px) {
	/* ------ Body ------ */
	article{
		background-color:#f5f2e9;
	}
	#abouts{
		border-bottom:3px solid #d6cdaf;
		padding-bottom:100px;
	}
	#abouts .abouts{
		position: relative;
	}
	#abouts .abouts > div:not(#fnav){
		width:70%;
	}
	#abouts .abouts > div > h3{
		font-size:24px;
		color:#6b3c30;
		margin-bottom:30px;
		line-height: 1.2em;
	}

	#greeting{
		margin-bottom:100px;
	}
	#greeting .toggle{
		display:flex;
		-js-display:flex;
		display:-webkit-flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		flex-flow: row nowrap;
		-webkit-flex-flow: row nowrap;
		align-items: flex-start;
		-webkit-align-items: flex-start;
	}
	#greeting .owner{
		width:22.9%;
		max-width:160px;
		margin-right:5.7%;
	}
	#greeting .msg{
		width:71.4%;
		line-height:1.7em;
	}

	#philosophy{
		margin-bottom:100px;
	}
	#philosophy .toggle > p{
		font-size:18px;
		margin-bottom:35px;
	}
	#philosophy ul li{
		margin-bottom:35px;
	}
	#philosophy ul li:last-child{
		margin-bottom:0;
	}
	#philosophy ul li h4{
		font-size:18px;
		margin-bottom:15px;
		line-height:1.2em;
	}
	#philosophy ul li p{
		line-height:1.6em;
	}
	#philosophy ul li p.tbr{
		margin-top:2em;
	}

	#company{
		margin-bottom:40px;
	}
	#company table{
		width:100%;
		border-top:1px solid #d6cdaf;
	}
	#company table th,
	#company table td{
		font-weight:normal;
		border-bottom:1px solid #d6cdaf;
		line-height:1.6em;
		box-sizing:border-box;
		-webkit-box-sizing:border-box;
	}
	#company table th{
		padding:15px 10px;
	}
	#company table td{
		padding:15px 0;
	}

	#sitemap #gmap{
		width:100%;
		height:500px;
	}
	#gmap .gmap-ico img{
		width:100%;
	}

	/* ------ Nav Menu ------ */
	#fnav{
		position:absolute;
		width:24%;
		box-sizing:border-box;
		-webkit-box-sizing:border-box;
		z-index:2;
		right:0;
		top:0;
	}
	#fnav ul{
		border-top:2px solid #d6cdaf;
		border-bottom:2px solid #d6cdaf;
		background-color:#fff;
		padding:10px;
	}
	#fnav ul li{
		border-bottom:1px dashed #d6cdaf;
		margin-bottom:10px;
	}
	#fnav ul li:last-child{
		border-bottom:none;
		margin-bottom:0;
	}
	#fnav ul li:last-child a{
		margin-bottom:0;
	}
	#fnav ul li a{
		padding: 10px 0;
		color: #6b3c30;
		font-size: 16px;
		margin-bottom: 10px;
		display: block;
		box-sizing: border-box;
		-webkit-box-sizing: border-box;
		text-indent: -1.5em;
		margin-left: 1.5em;
	}
	#fnav ul li a:before{
		content:"\f138";
		font-family: "FontAwesome";
		color:#ed6c00;
		margin-right:0.5em;
	}
}

/*■ Mobile (Low Res) : 640px > 0 ■*/
@media only screen and (max-width: 640px) {
	/* ------ Body ------ */
	article{
		background-color:#f5f2e9;
	}
	#abouts .abouts{
		position: relative;
	}
	#abouts .abouts > div > h3{
		font-size:1.42em;
		color:#6b3c30;
		padding-bottom:0.88em;
		line-height:1.2em;
	}

	#greeting{
		margin-bottom:9.4vw;
	}
	#greeting .toggle{
		display:flex;
		-js-display:flex;
		display:-webkit-flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		flex-flow: row nowrap;
		-webkit-flex-flow: row nowrap;
		align-items: flex-start;
		-webkit-align-items: flex-start;
	}
	#greeting .owner{
		width:33.3%;
		max-width:200px;
		margin-right:6.7%;
	}
	#greeting .msg{
		width:60%;
	}

	#philosophy{
		margin-bottom:9.4vw;
	}
	#philosophy .toggle > p{
		font-size:1.17em;
		padding-bottom:1.07em;
		line-height:1.2em;
	}
	#philosophy ul li{
		margin-bottom:1.25em;
	}
	#philosophy ul li:last-child{
		margin-bottom:0;
	}
	#philosophy ul li h4{
		font-size:1.17em;
		padding-bottom:0.54em;
		line-height:1.2em;
	}
	#philosophy ul li p.tbr{
		margin-top:1em;
	}

	#company{
		margin-bottom:6.3vw;
	}
	#company table{
		width:100%;
		border-top:1px solid #d6cdaf;
	}
	#company table th{
		font-weight:normal;
		border-bottom:1px solid #d6cdaf;
		padding:0.5em 0.5em 0.5em 0;
		box-sizing:border-box;
		-webkit-box-sizing:border-box;
		width:31.7%;
		vertical-align:middle;
	}
	#company table td{
		font-weight:normal;
		border-bottom:1px solid #d6cdaf;
		padding:0.5em 0;
		box-sizing:border-box;
		-webkit-box-sizing:border-box;
		width:68.3%;
	}

	#sitemap #gmap{
		width:100%;
		height:430px;
	}
	#gmap .gmap-ico img{
		width:100%;
	}
}