@charset "UTF-8";
/*
Theme Name: Type-B
Description: This is seisaku-homepage.com's service. Have Front & ServicePages.
Author: Forestbarwood,Inc. Team.H
Author URI: http://forestbarwood.com/
Version: 1.0.0
Tags: simple, two-pages, blog
*/

/*
 -- 注意 --

 全体的なスタイリングは先に呼び出される以下CSSに準じます
 /assets/css/base.css

 このCSSはコンテンツを中心にスタイリングしてください

*/
/* :::::::::: 768px以下 :::::::::: */
@media screen and (max-width: 768px) {

	.br-sp ,
	.sp {
		display: inline;
	}
	.br-pc ,
	.pc {
		display: none;
	}

	/* サイズリセット */
	* {
		font-size: 16px;
		margin: 0;
		padding: 0;
	}

	/* 非表示 */
	header .bar ul.menu ,
	#pan {
		display: none;
	}

	/* 表示 */
	header .bar a.sp-menu
	{
		display: inline-block;
	}

	/* ヘッダ画像の差し替え */
	.front-image-direct ,
	.back-image-direct {
		display: none;
	}
	.front-image-direct-sp ,
	.back-image-direct-sp {
		display: inline;
	}
	
	/* フロートの取り消し */
	.link-detail ,
	.link-detail-left ,
	.link-detail-right ,
	#info-main ,
	#info-side ,
	#info-main-title ,
	#info-main-btn ,
	#blog #main ,
	#blog #sidebar ,
	#front-service .front-service-twin .front-service-image ,
	#front-service .front-service-twin .front-service-note {
		float: none;
		display: block;
	}
	
	/* 横幅を最大にする */
	.service-link ,
	div[id^=front]:not(#front-image):not(#front-inq) table ,
	#information ,
	#info-main ,
	#info-side ,
	#blog ,
	#blog #main ,
	#blog #main .topic-title ,
	#blog #main .topic-date ,
	#blog #main .topic-category ,
	#blog #sidebar ,
	#front-service .front-service-twin ,
	#front-service .front-service-twin .front-service-image ,
	#front-inq-memo p ,
	.policy-memo ,
	.check-memo {
		width: 100%;
	}
	
	/* センタリング */
	.link-detail ,
	#info-main .list ,
	.facebook {
		margin: 2px auto;
	}

	/* 各タグの調整 */
	header div.logo {
		margin-left: 10px;
	}
	header .bar img:not(.sns) {
		left: 5px;
	}
	
	
	header .bar ul.menu.active {
		background-color: #dcdcdc;
		display: inline-block;
		position: absolute;
		top: 80px;
		left: 0px;
		width: 100%;
		z-index: 9999;
		padding: 0;
		margin: 0;
		height: auto;
		line-height: auto;
	}
	header .bar ul.menu.active li.hide {
		display: none;
	}

	header .bar ul.menu.active li {
		color: #fff;
		float: none;
		width: 100%;
		border-bottom: solid 1px #fff;
		border-bottom-color: #fff;
		padding: 0;
		margin: 0;
	}
	header .bar ul.menu.active li:first-child {
		border-top: solid 1px #fff;
		border-top-color: #fff;
	}
	header .bar ul.menu.active li a {
		margin-left: 20px;
	}
	header .bar ul.menu.active li a::before {
		content:"＞\00a0";
	}

	/*
	||||| TOPページ |||||
	*/
	
	#front-0 h2 {
		margin: 0;
	}

	#front-0 .front-0-back {
		max-width: 640px;
	}

	#front-0 p {
		font-size: 24px;
		text-align: left;
		margin: 0 10px;
		max-width: 640px;
		width: calc(100% - 20px);
	}

	#front-0 .front-0-back .memo {
		top: 300px;	
		padding: 20px;
		width: calc(100% - 40px);
	}
	#front-0 .front-0-back .memo p {
		font-size: 36px;
	}


	#front-0 .front-0-back .memo .service-link
	{
		margin: 20px auto 0;
	}
	
	/* TOP-サービス */
	
	#front-1 .service-twin ,
	#front-1 .service-twin .service {
		display: block;
		margin: 0 auto;
		padding: 0;
		max-width: 640px;
		width: 90%;
		height: auto;
	}
	#front-1 .service-twin .service {
		padding-bottom: 10px;
		height: auto;
	}
	#front-1 .service-twin .service .service-title
	{
		font-size: 30px;
		width: 100%;
	}
	#front-1 .service-twin .service .service-image
	{
		height: auto;
		margin: 0 auto;
		max-width: 480px;
		width: 100%;
	}
	#front-1 .service-twin .service .service-image img {
		height: auto;
		max-width: 480px;
		width: 100%;
	}
	#front-1 .service-twin .service .service-note {
		font-size: 18px;
		height: auto;
		max-width: 640px;
		width: 90%;
	}
	
	#front-1 .service-twin .service .service-note p {
		font-size: 24px;
	}
	#front-1 .service-twin .service .service-detail {
		max-width: 400px;
		width: 90%;
	}
	#front-1 .service-twin .service .service-detail a {
		font-size: 24px;
	}
		
	/* TOP-リンクボタン */

	.link-detail-left ,
	.link-detail-right {
		margin: 15px auto;
		height: auto;
		width: auto;
	}
	.link-detail-left img ,
	.link-detail-right img {
		max-width: 460px;
		width: 90%;
	}
	
	/* TOP-会社概要 */

	tr.sp {
		width: 100%;
		display: table;
	}
	div[id^=front]:not(#front-image):not(#front-inquiry-table) table th
	{
		font-size: 18px;
		height: 1em;
	}
	div[id^=front]:not(#front-image):not(#front-inquiry-table) table td
	{
		font-size: 18px;
		padding: 10px 30px;
	}

	/* TOP-お知らせ */
	
	#info-main-title {
		font-size: 24px;
		text-align: center;
		width : 100%;
	}
	#info-main-btn {
		padding: 2px 10px;
	}
	#info-main .list .list-title {
		width: calc(100% - 10px);
	}
	#info-side .facebook {
		margin: 0 auto;
		width: 300px;
	}

	
	
	/*
	||||| サービス紹介ページ |||||
	*/
	
	/* タイトル */
	
	.back-image h2 {
		font-size: 24px;
		top: 40px;
	}
	#front-service {
		max-width: 640px;
		width: 100%;
		padding: 0;
	}
	#front-service h2
	{
		font-size: 36px;
		margin: 20px 0;
	}
	#front-service #service-box-title
	{
		margin: 0 auto;
		padding: 0 0 20px;
		width: 90%;
	}
	#front-service .front-service-twin ,
	#front-service .front-service-twin .front-service-image {
		margin: 0;
		padding: 0;
	}
	#front-service .front-service-twin .front-service-note {
		padding: 0;
		width: calc(100% - 10px);
		margin: 2px 5px;
	}
	#front-inquiry-telfax p.front-inquiry-telfax
	{
		font-size: 18px;
		margin: 3px;
	}


	/* 問い合わせ */
	#front-inquiry-telfax h3 {
		font-size: 24px;
	}
	#front-inquiry-telfax p span
	{
		font-size: 30px;
	}
	#front-inquiry-telfax p.front-inquiry-telfax
	{
		font-size: 30px;
		width: 100%;
		text-align: center;
	}

	#front-inquiry-table table tbody tr td ,
	#check-inquiry table tbody tr td {
		width: 100%;
	}
	
	#menseki ,
	#policy {
		margin-bottom: 20px;
	}

	/* 確認 */
	#check-inquiry {
		margin: 0;
		padding: 0;
	}
	#check-inquiry table {
		margin: 15px 5px 0;
		width: calc(100% - 10px);
	}
	#check-inquiry table tbody tr th {
		font-size: 8px;
		width: auto;
	}
	#check-inquiry table tbody tr th span {
		display: none;
	}
	#check-inquiry table tbody tr td {
		font-size: 12px;
		width: auto;
	}
	input[id^=btn-inquiry]
	{
		font-size: 16px;
		width: 200px;
		margin: 10px auto;
	}
	#mail-complete
	{
		height: 100%;
		left: 0;
		top: 0;
		width: 100%;
	}
	#mail-complete p
	{
		font-size: 24px;
		margin: 100px 0 0;
	}
	
	#blog #main .topic {
		margin: 10px 5px;
		padding: 0;
		width: calc(100% - 10px);
	}
	#main .topic-title ,
	#main .topic-date ,
	#main .topic-category {
		font-size: 14px;
	}

	#main div.note img {
		height: auto;
		width: 100%;
	}
	#blog #sidebar div {
		padding: 0;
		width: calc(100% - 10px);
		margin: 2px 5px;
	}
	#blog #sidebar div.facebook {
		margin: 0 auto;
		width: 300px;
	}
	
	#to-top {
		width: 40px;
		height: 40px;
	}
	#to-top a{
		width: 40px;
		height: 40px;
	}
	#to-top a::before{
		font-size: 30px;
		width: 20px;
		height: 35px;
	}
	
	#to-top a::before {
		content: '';
		width: 10px;
		height: 10px;
		border: 0px;
		border-top: solid 2px #fff;
		border-right: solid 2px #fff;
		-ms-transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
		position: absolute;
		top: 18px;
		left: 15px;
	}
	
	footer {
		padding: 0;
	}
	footer .bar {
		height: auto;
		margin-bottom: 15px;
	}
	footer .bar ul.menu
	{
		height: auto;
		text-align: left;
	}
	footer .bar ul.menu li
	{
		display: block;
		font-size: 16px;
		height: auto;/*2em;*/
		line-height: 1em;
		margin: 0;
		padding: 10px 0;
		text-align: left;
		width: 100%;
	}
	footer .bar ul.menu li:not(:last-child)
	{
		border-bottom: solid #fff 1px;
	}
	footer .bar ul.menu li a {
		margin-left: 20px;
	}
	footer .bar ul.menu li a::before {
		content:"＞\00a0\00a0";
	}
	footer .bar ul.menu li:not(:first-child) a:before
	{
		content:"＞\00a0\00a0";
	}
	footer .owner ,
	footer .owner .owner-name ,
	footer .owner .owner-address ,
	footer .owner .owner-tel-fax ,
	footer .copy {
		line-height: 2em;
		height: auto;
		margin: 0;
	}
	footer .owner {
		padding: 30px 0;
	}
	footer .copy {
		line-height: 40px;
	}
}

/* :::::::::: 640px以下 :::::::::: */
@media screen and (max-width: 640px) {

	#front-0 .front-0-back .memo {
		top: 200px;	
	}
	#front-0 .front-0-back .memo p {
		font-size: 22px;
	}
	#front-1 .service-twin .service .service-note p {
		font-size: 18px;
	}
}
/* :::::::::: 375px以下 :::::::::: */
@media screen and (max-width: 375px) {
	
	#front-0 h2 {
		font-size: 24px;
	}

	#front-0 .front-0-back .memo {
		top: 150px;	
	}
	#front-0 .front-0-back .memo p {
		font-size: 18px;
	}
	#front-1 .service-twin .service .service-note p {
		font-size: 14px;
	}

}


/* FooterにSNSマークをつける */

footer .sp_sns {
	text-align: center;
	width: 100%;
}
footer .sp_sns p a {
	margin: 20px 10px 0;
}

/* reCAPTCHA非表示 */
.grecaptcha-badge { visibility: hidden; }
