@charset "utf-8";
/*----- WordPressより --------------------------------------*/
/* 初期化 */
html,body,h1,h2,div,p,span,a,ul,ol,li,dl,dt,dd,small,header,nav,main,article,section,aside,footer,#containar,#contents{
	margin:0;
	padding:0;
	text-decoration:none;
	font-weight:normal;
	font-style:normal;
	text-align:left;
}
#container,header,nav,#contents,main,article,section,div,aside,footer{
	display: block;
	box-sizing: border-box;
}
#container{
	width: 100%;
	margin: auto;
}



/*---------- 基本共通事項-基本事項の調整　---------------*/
/* 基本フォントサイズ */
html{
	font-size: 16px;
}

body{
	font-family: 'Noto Serif JP', serif;
	line-height: 1.5;
	list-style: none;
	width: 100%;
	margin: 0;
	padding: 0;
	
/* 各ページをふわっと表示させる */
	  animation: fadeIn 0s ease 0s 1 normal; /* fadeInの後の時間のみ変更 */
    -webkit-animation: fadeIn 0s ease 0s 1 normal;　/* fadeInの後の時間のみ変更 */
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}[InternetShortcut]


/* サービスメニューと事務所案内はふわっと出る */
/* ふわっとでてくる */
	.fadein{
		opacity: 0;
	}
	.fadein1{
		opacity: 0;
	/* 50px　⇒　0px　まで動くよ */
		transform: translateY(50px);
	/* 要素が1.5秒かけて表示される */
		transition: all 1.5s;	
	}

a{outline:none;border:none;}
a:link{text-decoration:none;}
a:visited{text-decoration:none;}
a:hover{text-decoration:none;}
a:active{text-decoration:none;}


h1,h2,h3,h4,h5,h6{
	display: block;
	margin-top: 0.25em;
	margin-bottom: 0.5em;
	font-size: 100%;
	font-weight: bold;
	letter-spacing: 0.1em;
}
h1,h2,h3,h4,h5,h6,li,a,p,nav{
	color: #222;
}

p{
	font-size: 1.125em;
	line-height: 2em;
	margin-bottom: 0.875em;
	letter-spacing: 0.1em;
}

@media(min-width: 960px){
	p{
		font-size: 1.25em;
		line-height: 2.25em;
		margin-bottom: 0;
	}
}

li{
	list-style-type: none;
	line-height: 2em;
	letter-spacing: 0.1em;
}

/*---------- 基本共通事項-見出し ---------------*/
/* 大見出し */
@media(min-width: 1201px){
	h1{
		position: relative;
		display: block;
		margin: 1em;
		padding: 0.5em 0;
		width: auto;
		text-align: center;
		font-weight: bold;
		font-size: 2.5em;
		box-sizing: border-box;
	}

	h1::before {
		content: '';
		position: absolute;
		left: auto;
		transform: translateX(-65%);
		rotate: 45deg;
		width: 3.5em;
		height: 3.5em;
		clip-path: polygon(50% 0, 100% 100%, 0 100%);
		background: #f4e1be;
		z-index: -1;
	}
}

@media screen and (min-width:401px) and (max-width:1200px){
	h1{
		position: relative;
		display: block;
		margin: 1em;
		padding: 0.5em 0;
		width: auto;
		text-align: center;
		font-weight: bold;
		font-size: 2em;
		box-sizing: border-box;
	}

	h1::before {
		content: '';
		position: absolute;
		left: auto;
		transform: translateX(-65%);
		rotate: 45deg;
		width: 3.5em;
		height: 3.5em;
		clip-path: polygon(50% 0, 100% 100%, 0 100%);
		background: #f4e1be;
		z-index: -1;
	}
}

@media(max-width: 400px){
	h1{
		display: block;
		position: relative;
		margin: 1.5em auto;
		padding: 0.5em 0;
		width: auto;
		text-align: center;
		font-weight: bold;
		font-size: 1.4em;
		box-sizing: border-box;
	}

	h1::before {
		content: '';
		position: absolute;
		left: 17%;
		top: 27%;
		transform: translateX(-65%);
		rotate: 45deg;
		width: 3.5em;
		height: 3.5em;
		clip-path: polygon(50% 0, 100% 100%, 0 100%);
		background: #f4e1be;
		z-index: -1;
	}
}

/* 中見出し */
@media(min-width: 1201px){
	h2{
		position: relative;
		margin: 2em auto;
		padding: 1em;
		width: fit-content;
		text-align: center;
		font-weight: bold;
		font-size: 2em;
	}
	h2::before,h2::after {
		position: absolute;
		content: '';
		width: 30%;
		height: 0.15em;
		background-color: #e1bff5;
	}

	h2::before {
		top: 0;
		left: 0;
	}
	h2::after {
		bottom: 0;
		right: 0;
	}
}
@media screen and (min-width:401px) and (max-width:1200px){
	h2{
		position: relative;
		margin: 2em auto;
		padding: 1em;
		width: fit-content;
		text-align: center;
		font-weight: bold;
		font-size: 1.75em;
	}
	h2::before,h2::after {
		position: absolute;
		content: '';
		width: 30%;
		height: 0.15em;
		background-color: #e1bff5;
	}

	h2::before {
		top: 0;
		left: 0;
	}
	h2::after {
		bottom: 0;
		right: 0;
	}
}

@media(max-width: 400px){
	h2{
		position: relative;
		margin: 2em auto;
		padding: 1em;
		width: fit-content;
		text-align: center;
		font-weight: bold;
		font-size: 1.3em;
	}
	h2::before,h2::after {
		position: absolute;
		content: '';
		width: 30%;
		height: 0.15em;
		background-color: #e1bff5;
	}

	h2::before {
		top: 0;
		left: 0;
	}
	h2::after {
		bottom: 0;
		right: 0;
	}	
}

/* 小見出し */
@media(min-width: 1201px){
	h3{
		margin: 2em 0 2em 1em;
		font-weight: bold;
		font-size: 1.75em;
	}

	h3::after {
		display: block;
		content: '';
		margin-top: 1em;
		width: 3.5em;
		height: 0.2em;
		background: #bff5d8;
	}
}

@media screen and (min-width:401px) and (max-width:1201px){
	h3{
		margin: 2em 0 2em 1em;
		font-weight: bold;
		font-size: 1.55em;
	}

	h3::after {
		display: block;
		content: '';
		margin-top: 1em;
		width: 3.5em;
		height: 0.2em;
		background: #bff5d8;
	}
}

@media(max-width: 400px){
	h3{
		margin: 2em 0 2em 1em;
		font-weight: bold;
		font-size: 1.2em;
	}

	h3::after {
		display: block;
		content: '';
		margin-top: 0.75em;
		width: 3.25em;
		height: 0.2em;
		background: #bff5d8;
	}
}

/* 最小見出し */
@media(min-width: 1201px){
	h4 {
		overflow: hidden;
		position: relative;
		font-weight: bold;
		font-size: 1.4em;
		text-align: left;
		padding: 1em 0 1em 1em;
		margin: 1.5em 0 1.5em 1em;
	}

	h4::before {
		content: "";
		width: 0.15em;
		height: 3em;
		background: #9ba6b0;
		transform: rotate(20deg);
		position: absolute;
		top: 0;
		left: 0.5em;
		z-index: -1;
	}
}

@media screen and (min-width:401px) and (max-width:1200px){
	h4 {
		overflow: hidden;
		position: relative;
		font-weight: bold;
		font-size: 1.35em;
		text-align: left;
		padding: 1em 0 1em 1em;
		margin: 1.5em 0 1.5em 1em;
	}

	h4::before {
		content: "";
		width: 0.15em;
		height: 3em;
		background: #9ba6b0;
		transform: rotate(20deg);
		position: absolute;
		top: 0;
		left: 0.5em;
		z-index: -1;
	}
}

@media(max-width: 400px){
	h4 {
		overflow: hidden;
		position: relative;
		font-weight: bold;
		font-size: 1.1em;
		text-align: left;
		padding: 1em 0 1em 1em;
		margin: 1.5em 0 1.5em 1em;
	}

	h4::before {
		content: "";
		width: 0.15em;
		height: 2.5em;
		background: #9ba6b0;
		transform: rotate(20deg);
		position: absolute;
		top: 0.2em;
		left: 0.5em;
		z-index: -1;
	}
}


/*----- メールフォーム専用スタイル --------------------------------------*/
@media(min-width: 1201px){
	/* 冒頭の文 */
	#txt_explain p{
		padding: 2em;
		font-size: 1.125em;
		text-align: center;
	}
	
	/* 入力エリア全体の文字の大きさ */
	input,select,textarea{
		font-size: 1.25em;
	}
	
	/* テーブル全体の大きさ */
	.table{
		display: block;
		width: 80%;
		margin: auto;
		box-sizing: border-box;
	}

		/* margin利かないので、項目ごとの余白づくり */
		.table th,.table td{
			padding: 0.5em 0 0.5em 1em;
		}

		/* 項目 */
		.table th{
			font-weight: normal;
			width: 20%;
		}

		/* 入力欄 */
		.table td{
			width: 80%;
		}

		/* 氏名・ふりがな */
		input[name="item_name_1"],input[name="item_name_2"],input[name="item_kana_1"],input[name="item_kana_2"]{
			width: 10em !important;
			padding: 0.5em;
		}

		/* 郵便番号-左側 */
		input[name="item_poscode_1"]{
			width: 6em !important;
			padding: 0.5em;
		}

		/* 郵便番号-右側 */
		input[name="item_poscode_2"]{
			width: 8em !important;
			padding: 0.5em;
		}
		
		/* 都道府県 */
		select[name="item_selarea"]{
			width: 15% !important;
			padding: 0.5em;
			text-align: center;
		}


		/* 住所-上 */
		input[name="item_address_1"]{
			width: 60% !important;
			padding: 0.5em;
		}

		/* 住所-下 */
		input[name="item_address_2"]{
			width: 60% !important;
			padding: 0.5em;
		}

		/* 事業者名 */
		textarea[name="item_sarea03"]{
			width: 60% !important;
			padding: 0.5em;
			height: auto;
		}

		/* 肩書き */
		textarea[name="item_sarea02"]{
			width: 30% !important;
			padding: 0.5em;
			height: auto;
		}

		/* メールアドレス（確認用も同じ） */
		input[name="item_mail_1"],input[name="item_mail_2"]{
			width: 60% !important;
			padding: 0.5em;
		}

		/* 電話番号 */
		input[name="item_tel"]{
			width: 30% !important;
			padding: 0.5em;
		}

		/* 月、日 */
		select[name="item_sselect03"],select[name="item_sselect01"],select[name="item_sselect06"],select[name="item_sselect07"],select[name="item_sselect08"],select[name="item_sselect09"]{
			width: 10% !important;
			padding: 0.5em;
			text-align: center;
		}

		/* 時間帯 */
		select[name="item_sselect02"],select[name="item_sselect04"],select[name="item_sselect05"]{
			width: 15% !important;
			padding: 0.5em;
			text-align: center;
		}

		/* チェックボックス・ラジオボタンを左側へ */
		input[type="checkbox"],input[type="radio"]{
			float: left;
			margin: 0.5em 0.5em 0px 0.25em;
		}

		/* ラベルを右側へ */
		label{
			display: inherit;
			padding: 0em 0em 0.5em 0em;
			font-size: 1.25em;
			
		}

		/* 知ったきっかけ */
		textarea[name="item_sarea01"]{
			width: 50% !important;
			height: auto;
			padding: 0.5em;
		}
		
		/* お問い合わせ内容 */
		textarea[name="item_contents"]{
			width: 100%;
			height: 10em;
			padding: 0.5em;
		}

		/* 確認するボタンの装飾 */
		input[type="submit"]{
			display: block;
			width: 20%;
			font-size: 1.5em;
			margin: 2em auto;
			padding: 0.5em 1em;
			background-color: #9dd3b6;
			color: #fff;
			border: none;
		}

		/* 確認するボタンホバー */
		input[type="submit"]:hover{
			background: #bff5d8;
		}

		/* 入力フォーム内をクリックすると装飾が変化する */
		input:focus,select:focus,textarea:focus{
			background-color: #fff9ff;
		}

		/* サイトに戻るボタン */
		.button_box{
			margin: 1em;
			font-size: 1.25em;
	}
}
@media screen and (min-width:401px) and (max-width:1200px){
	/* 冒頭の文 */
	#txt_explain p{
		padding: 2em;
		font-size: 1.125em;
		text-align: center;
	}
	
	/* 入力エリア全体の文字の大きさ */
	input,select,textarea{
		font-size: 1.25em;
	}
	
	/* テーブル全体の大きさ */
	.table{
		display: block;
		width: 80%;
		margin: auto;
		box-sizing: border-box;
	}

	/* margin利かないので、項目ごとの余白づくり */
	.table th,.table td{
		padding: 0.5em 0 0.5em 0.5em;
	}

	/* 項目 */
	.table th{
		font-weight: normal;
		width: 23%;
	}

	/* 入力欄 */
	.table td{
		width: 80%;
	}

	/* 氏名・ふりがな */
	input[name="item_name_1"],input[name="item_name_2"],input[name="item_kana_1"],input[name="item_kana_2"]{
		width: 10em !important;
		padding: 0.5em;
	}

	/* 郵便番号-左側 */
	input[name="item_poscode_1"]{
		width: 6em !important;
		padding: 0.5em;
	}

	/* 郵便番号-右側 */
	input[name="item_poscode_2"]{
		width: 8em !important;
		padding: 0.5em;
	}
	
	/* 都道府県 */
	select[name="item_selarea"]{
		width: 27% !important;
		padding: 0.5em;
		text-align: center;
	}


	/* 住所-上 */
	input[name="item_address_1"]{
		width: 70% !important;
		padding: 0.5em;
	}

	/* 住所-下 */
	input[name="item_address_2"]{
		width: 70% !important;
		padding: 0.5em;
	}

	/* 事業者名 */
	textarea[name="item_sarea03"]{
		width: 70% !important;
		padding: 0.5em;
		height: auto;
	}

	/* 肩書き */
	textarea[name="item_sarea02"]{
		width: 30% !important;
		padding: 0.5em;
		height: auto;
	}

	/* メールアドレス（確認用も同じ） */
	input[name="item_mail_1"],input[name="item_mail_2"]{
		width: 70% !important;
		padding: 0.5em;
	}

	/* 電話番号 */
	input[name="item_tel"]{
		width: 35% !important;
		padding: 0.5em;
	}

	/* 月、日 */
		select[name="item_sselect03"],select[name="item_sselect01"],select[name="item_sselect06"],select[name="item_sselect07"],select[name="item_sselect08"],select[name="item_sselect09"]{
		width: 18% !important;
		padding: 0.5em;
		text-align: center;
	}

	/* 時間帯（曜日問わず） */
	select[name="item_sselect02"],select[name="item_sselect04"],select[name="item_sselect05"]{
		width: 25% !important;
		padding: 0.5em;
		text-align: center;
	}

	/* チェックボックス・ラジオボタンを左側へ */
	input[type="checkbox"],input[type="radio"]{
		float: left;
		margin: 0.5em 0.5em 0px 0.25em;
	}

	/* ラベルを右側へ */
	label{
		display: inherit;
		padding: 0em 0em 0.5em 0em;
		font-size: 1.25em;
		
	}

	/* 知ったきっかけ */
	textarea[name="item_sarea01"]{
		width: 70% !important;
		height: auto;
		padding: 0.5em;
	}
	
	/* お問い合わせ内容 */
	textarea[name="item_contents"]{
		width: 100%;
		height: 10em;
		padding: 0.5em;
	}

	/* 確認するボタンの装飾 */
	input[type="submit"]{
		display: block;
		width: 30%;
		font-size: 1.5em;
		margin: 2em auto;
		padding: 0.5em 1em;
		background-color: #9dd3b6;
		color: #fff;
		border: none;
	}

	/* 確認するボタンホバー */
	input[type="submit"]:hover{
		background: #bff5d8;
	}

	/* 入力フォーム内をクリックすると装飾が変化する */
	input:focus,select:focus,textarea:focus{
		background-color: #fff9ff;
	}

	/* サイトに戻るボタン */
	.button_box{
		margin: 1em;
		font-size: 1.25em;
	}
}
@media(max-width: 400px){
	/* 冒頭の文 */
	#txt_explain p{
		padding: 1.5em;
		font-size: 0.875em;
		text-align: center;
	}
	
	/* 入力エリア全体の文字の大きさ */
	input,select,textarea{
		font-size: 0.925em;
	}

	/* テーブル全体の大きさ */
	.table{
		display: block;
		width: 95%;
		margin: auto;
		box-sizing: border-box;
	}

	/* margin利かないので、項目ごとの余白づくり */
	.table th,.table td{
		padding: 0.5em 0 0.5em 0;
	}

	/* 項目 */
	.table th{
		font-weight: normal;
		width: 25%;
		font-size: 0.875em;
	}

	/* 入力欄 */
	.table td{
		width: 75%;
	}

	/* 氏名・ふりがな */
	input[name="item_name_1"],input[name="item_name_2"],input[name="item_kana_1"],input[name="item_kana_2"]{
		width: 90% !important;
		padding: 0.35em;
	}

	/* 郵便番号-左側 */
	input[name="item_poscode_1"]{
		width: 20% !important;
		padding: 0.35em;
	}

	/* 郵便番号-右側 */
	input[name="item_poscode_2"]{
		width: 30% !important;
		padding: 0.35em;
	}

	/* 都道府県 */
	select[name="item_selarea"]{
		width: 50% !important;
		padding: 0.35em;
		text-align: center;
	}

	/* 住所-上 */
	input[name="item_address_1"]{
		width: 90% !important;
		padding: 0.35em;
	}

	/* 住所-下 */
	input[name="item_address_2"]{
		width: 90% !important;
		padding: 0.35em;
	}

	/* 事業者名 */
	textarea[name="item_sarea03"]{
		width: 85% !important;
		padding: 0.6em;
		height: auto;
	}

	/* 肩書き */
	textarea[name="item_sarea02"]{
		width: 40% !important;
		padding: 0.6em;
		height: auto;
	}

	/* メールアドレス（確認用も同じ） */
	input[name="item_mail_1"],input[name="item_mail_2"]{
		width: 90% !important;
		padding: 0.35em;
	}

	/* 電話番号 */
	input[name="item_tel"]{
		width: 70% !important;
		padding: 0.35em;
	}

	/* 月、日 */
		select[name="item_sselect03"],select[name="item_sselect01"],select[name="item_sselect06"],select[name="item_sselect07"],select[name="item_sselect08"],select[name="item_sselect09"]{
		width: 35% !important;
		padding: 0.35em;
		text-align: center;
	}

	/* 時間帯（曜日問わず） */
	select[name="item_sselect02"],select[name="item_sselect04"],select[name="item_sselect05"]{
		width: 45% !important;
		padding: 0.35em;
		text-align: center;
	}

	/* チェックボックス・ラジオボタンを左側へ */
	input[type="checkbox"],input[type="radio"]{
		float: left;
		margin: 0.375em 0.25em 0px 0.25em;
	}

	/* ラベルを右側へ */
	label{
		display: inherit;
		padding: 0em 0em 1em 0em;
	}

	/* 知ったきっかけ */
	textarea[name="item_sarea01"]{
		width: 90% !important;
		height: auto;
		padding: 0.35em;
	}
	
	/* お問い合わせ内容 */
	textarea[name="item_contents"]{
		width: 90%;
		height: 10em;
		padding: 0.35em;
	}

	/* 確認するボタンの装飾 */
	input[type="submit"]{
		display: block;
		width: 90%;
		font-size: 1.5em;
		margin: 1.5em auto;
		padding: 0.35em 0.75em;
		background-color: #9dd3b6;
		color: #fff;
		border: none;
	}

	/* 確認するボタンホバー */
	input[type="submit"]:hover{
		background: #bff5d8;
	}

	/* 入力フォーム内をクリックすると装飾が変化する */
	input:focus,select:focus,textarea:focus{
		background-color: #fff9ff;
	}

	/* サイトに戻るボタン */
	.button_box{
		margin: 1em;
		font-size: 1.25em;
	}
}