/* CSS Document */

.img_top_title_bigsize {
	display: inline;
}

.top_title{
	padding: 10px 0px 10px 0px;
	text-align: center;
	background-color:	#77BC3F;
}
.top_title img{
    width: 600px;
}

.link_panel {
	margin-top: 5px;
	text-align: center;
}

.link_panel ul {
	padding-left: 0px;
}
.link_panel li {
	height:	210px;
	width:	260px;
	text-align:	center;
	display: inline-block;
}
.link_panel li img {
	width:	100.0%;
}
.link_panel li a, .link_panel li a:visited {
	text-decoration:	none;
	color:	#000000;
}

.link_panel li p {
	margin-top: 0px;	
}
.panel a img {
	border-radius: 5px;
}
footer {
	height:	auto;
	width:	100.0%;
	background-color:	#77BC3F;
	color:	#FFFFFF;
	text-align:	center;
	display:	table;
	vertical-align:	bottom;
}

.footer_p {
	margin: 0px;
}

#footer_p2 {
	margin-top: -5px;
}

#footer_p1 {
	margin-top: 10px;
}

#footer_p3 {
	margin-top: 5px;
	margin-bottom: 10px;
	font-size: 80.0%;
}

body {
	font-family: a-otf-ud-shin-go-pr6n, sans-serif;
	font-style: normal;
	font-weight: 300;
	
	margin: 0;
	padding: 0;
	/* 以下、iPhoneのLandscape modeに対応するため */
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-o-text-size-adjust: 100%;
	text-size-adjust: 100%;
	/* 以上、iPhoneのLandscape modeに対応するため */
}

.img_top_title_smallsize {
	display: none;
}

.logo {
	display: table-cell;
	margin: 0 0 0 5px;
	width: 100px;
	height: 100px;
}
.logo img {
	width: 100.0%;
	border: solid 1px #FFFFFF;
}

header {
	width: 100.0%;
	display: table;
	background-color:	#77BC3F;
	padding: 10px 0 10px 10px;
	margin: 0;
}

.header_title {
	margin: 0;
	width: auto;
	padding: 0 0 0 20px;
	vertical-align: middle;
	display: table-cell;
	color: #FFFFFF;
	font-size: 300.0%;
}
.header_title a, .header_title a:visited {
	text-decoration: none;
	color: #FFFFFF;
}

.list_area {
	display: table;
	margin:	0 5px 0 5px;
	padding:	0;
	height:	60px;
	width:	100.0%;
	text-align:	center;
}

.list_item {
	display: table-cell;
	vertical-align: middle;
	border: solid 1px #77BC3F;
	width: 20.0%;
}
.list_item a {
	text-decoration:	none;
	color:	#000000;
}
.list_area a:visited{
	color:	#000000;
}
.top_panel {
	text-align: center;
	background: #77BC3F;
	width: 100.0%;
	height: 75px;
}
.toiawase_group_toppage {
	border-radius: 10px;
	padding: 0;
	height: 65px;
	background: #FFFFFF;
	display: inline-block;
	position: relative;
	width: 600px;
}
.toiawase_group_toppage a#a_email {
	position: absolute;
	left: 80px;
	top: 3px;
	text-decoration: none;
	color: black;
}
.toiawase_group_toppage img#img_email {
	position: absolute;
	left: 0px;
	top: 4px;
	padding: 0;
	width: 50px;
}
.toiawase_group_toppage a#a_facebook {
	position: absolute;
	left: 180px;
	top: 3px;
	text-decoration: none;
	color: black;
}
.toiawase_group_toppage a#a_instagram {
	position: absolute;
	left: 230px;
	top: 3px;
	text-decoration: none;
	color: black;
}
.toiawase_group_toppage img#img_facebook {
	position: absolute;
	left: 250px;
	top: 4px;
	padding: 0;
	width: 50px;
}
.toiawase_group_toppage img#img_instagram {
	position: absolute;
	left: 230px;
	top: 4px;
	padding: 0;
	width: 50px;
}
.toiawase_group_toppage p {
	margin: 0;
	padding: 0;
	position: absolute;
	left: 60px;
	top: 17px;
	width: 200px;
}
.toiawase_group {
	margin: 0;
	padding: 0;
	vertical-align: center;
	text-align: left;
	height: 100.0%;
	position: relative;
}
.toiawase_group a {
	position: absolute;
}
.toiawase_group img {
	position: absolute;
	left: 5px;
	top: 4px;
	padding: 0;
	width: 50px;
}
.toiawase_group p {
	margin: 0;
	padding: 0;
	position: absolute;
	left: 60px;
	top: 17px;
	width: 100px;
}


.page_title {
	padding: 10px 0 10px 0;
	text-align: center;
	vertical-align: middle;
	font-size: 250.0%;
}

.content_wrapper {
	/* 以下３行セットで、中央寄せ */
	max-width: 960px;
	margin-right: auto;
	margin-left : auto;
}

.portlait img {
	margin-left: 30px;
	width: 250px;
	border-radius: 5px;
}



.container1 {
	display: table;
}

.portlait {
	display: table-cell;
}
.portlait img {
	width: 240px;
}

.greeting {
	display: table-cell;
	text-align: left;
	vertical-align: top;
}
.paragraph {
	margin: 10px 30px 30px 30px;
}
.greeting p {
	margin: 0;
	padding: 0;
	font-size: 125.0%;
}

.container2 {
	margin-top: -50px;
	position: relative;
	height: 730px;
}

.career {
	position: absolute;
	top: 60px;
	left: 150px;
}
.career p {
	line-height: 10px;
	font-size: 125.0%;
}

.border_art {
	position: absolute;
	left: 10px;
	top: 30px;
	transform: rotate(-5deg);
}
.border_art img {
	width: 420px;
}

.profile1 {
	position: absolute;
	top: 390px;
	left: 200px;
	text-align: center;
}
.profile1 p, .career p {
	line-height: 10px;
	font-size: 125.0%;
}

.profile2 {
	position: absolute;
	top: 580px;
	left: 30px;
	text-align: center;
	display: table;
}
.profile2 p {
	line-height: 10px;
	font-size: 125.0%;
}
.profile2_col1, .profile2_col2 {
	width: 380px;
	display: table-cell;
}
#greeting_title {
	color: #0F9D58;
	font-weight: bold;
}

.simple_message {
	padding: 0 0 0 30.0%;
}
.simple_message p {
	font-size: 125.0%;
	line-height: 15px;
}

h1 {
	padding: 5px 0 0 20px;
	background-image: url("./img/obi01.jpg");
	background-repeat: no-repeat;
	background-size: 1000px;
}

h2 {
	margin: 0 50px 0 50px;
	border-left: 3px solid #333;
	border-bottom: 1px solid #ccc;
  	padding: .5em 1em;
}

.simplepage_explanation {
	margin: 0 100px;
	font-size: 125.0%;
}

.simplepage_explanation p {
	margin: 0;
}

.simplepage_explanation ul li {
	color: black;
	border-left: solid 8px #77BC3F;/*左側の線*/
	background: whitesmoke;/*背景色*/
	margin: 15px 0;
	line-height: 1.5;
	border-radius: 0 15px 15px 0;/*右側の角だけ丸く*/
	padding: 0.5em;
	list-style-type: none!important;
}

.explanation_table {
	display: table;
	margin: 0 0 0 20px;
}
.tablerow {
	display: table-row;
}
.tablecol_mark, .tablecol_mark, .tablecol_00, .tablecol_10, .tablecol_20 {
	display: table-cell;
	vertical-align: top;
}
.tablecol_mark {
	min-width: 2vw;
}
.tablecol_10 {
	min-width: 300px;
}
.tablecol_10 p {
	margin: 0;
}
.tablecol_20 {
	background: linear-gradient(transparent 90%, #a8eaff 30%);
}
.tab_div {
	margin-left: 2.5rem;
}
.tablerow_empty {
	min-height: 1rem;
}

 .listmark_rect {
	color: initial;
	border-left: initial;
	background: initial;
	margin: initial;
	line-height: initial;
	border-radius: initial;
	padding: initial;
	list-style-type: initial;
	
	background: yellow;
}

.news {
	width: 100.0%;
	text-align: center;
}
.news_container {
	margin: auto;
	margin-top: 10px;
	display: table;
	border: solid 2px #77BC3F;
	border-radius: 10px;
}
.news_title_pc {
	display: table-cell;
}
.news_title_pc img {
	height: 105px;
}
.news_title_mobile {
	display: none;
}
.news_contents {
	margin: 0;
	padding: 0;
	width: 539px;
	display: table-cell;
	vertical-align: top;
	overflow-y: auto;
}
.news_contents ul {
	margin: 10px;
	padding: 0;
	
	height: 80px;
	text-align: left;
	padding-left: 10px;
}
.news_contents li {
	display: inline;
	list-style: none;
}
.news_date {
	background: linear-gradient(transparent 70%, #a8eaff 30%);
}
.news_date_blog {
	background: linear-gradient(transparent 70%, #FACCC2 30%);
}

.align_right {
	text-align: right;
}

@media (max-width : 1024px ){
	#footer_p2 {
		margin-top: 0px;
	}
	.toiawase_group_toppage {
		width: 700px;
	}
	.toiawase_group_toppage a#a_email {
		left: 130px;
	}
	.toiawase_group_toppage a#a_facebook {
		left: 230px;
	}
	.toiawase_group_toppage a#a_instagram {
		left: 270px;
	}
	.top_title img{
		width: 700px;
	}
	.link_panel li {
		height:	180px;
		width:	220px;
	}
	.list_item a {
		font-size: 1.5vw;
	}
	.tablecol_10 {
		min-width: 230px;
	}
	/* 以下、【プロフィールとご挨拶】ページ */
	.content_wrapper {
		/* 以下３行セットで、中央寄せ */
		max-width: 790px;
	}
	.greeting p {
		margin: 0;
		padding: 0;
		font-size: 120.0%;
	}
	.portlait img {
		width: 200px;
	}
	.container2 {
		margin-top: -50px;
		height: 650px;
	}
	.career {
		left: 0px;
	}
	.profile1 {
		top: 350px;
		left: 22vw;
	}
	.profile1 p, .career p {
		line-height: 10px;
		font-size: 110.0%;
	}
	.career {
		left: 200px;
	}
	.border_art {
		left: 70px;
		top: 30px;
	}
	.border_art img {
		width: 400px;
	}
	.profile2 {
		left: 0px;
		top: 520px;
	}
	.profile2 p {
		line-height: 10px;
		font-size: 110.0%;
	}
	.profile2_col1 {
		width: 300px;
	}
	.profile2_col2 {
		width: 400px;
	}
	/* 以下、トップページ【お知らせ】欄 */
	.news_title_pc img {
		height: 90px;
	}
	.news_contents {
		margin: 0;
		padding: 0;
		width: 455px;
		display: table-cell;
		vertical-align: top;
		overflow-y: auto;
	}
	.news_contents ul {
		margin: 5px;
		padding: 0;

		height: 70px;
		text-align: left;
		padding-left: 5px;
	}
	.news_date {
		background: linear-gradient(transparent 70%, #a8eaff 30%);
		font-size: 90.0%;
	}
	.news_title {
		font-size: 90.0%;
	}
}

@media (max-width : 768px ){
	.top_title {
		width: 100.0%;
	}
	.top_title img{
		width: 100.0%;
	}
	.link_panel li {
		height:	24vw;
		width:	30.0%;
	}
	.link_panel li p {
		font-size: 75.0%;
	}
	footer {
		font-size: 75.0%;
	}
	#footer_p2 {
		margin-top: 0px;
	}
	.toiawase_group_toppage {
		width: 100.0%;
	}
	.toiawase_group_toppage a#a_email {
		left: 10vw;
	}
	.toiawase_group_toppage a#a_facebook {
		left: 25vw;
	}
	.toiawase_group_toppage a#a_instagram {
		left: 35vw;
	}
	/* 以下、【プロフィールとご挨拶】ページ */
	.header_title {
		padding: 0 0 0 20px;
		font-size: 250.0%;
	}
	.page_title {
		padding: 10px 0 10px 0;
		font-size: 200.0%;
	}
	.content_wrapper {
		/* 以下３行セットで、中央寄せ */
		max-width: initial;
	}
	.greeting p {
		margin: 0 10px 0px 10px;
		padding: 0;
		font-size: 110.0%;
		line-height: 20px;
	}
	.paragraph{
		margin-bottom: 15px;
	}
	.portlait {
		width: 25.0%;
	}
	.portlait img {
		width: 100.0%;
	}
	.career {
		left: 150px;
	}
	.container2 {
		margin-top: -50px;
		height: 530px;
	}
	.profile1 {
		top: 290px;
		left: 25vw;;
	}
	.profile1 p, .career p {
		line-height: 5px;
		font-size: 100.0%;
	}
	.border_art {
		left: 50px;
		top: 20px;
		transform: rotate(0deg);
	}
	.border_art img {
		width: 320px;
	}
	.profile2 {
		left: 1vw;
		top: 430px;
	}
	.profile2 p {
		line-height: 5px;
		font-size: 100.0%;
	}
	.profile2_col1 {
		width: 35vw;
	}
	.profile2_col2 {
		width: 55vw;
	}
	.simplepage_explanation {
		margin: 0 50px;
	}
	.simplepage_explanation ul li {
		margin: 15px 0 15px -30px;
	}
	.explanation_table {
		margin-left: -20px;
	}
	.tablecol_10 {
		min-width: 11rem;
	}
	.tab_div {
		margin-left: 0;
	}
	.explanation_table, .tab_div {
		font-size: 80.0%;
	}
}

@media (max-width : 480px ){
	body {
		font-size: 200.0%;
	}
	.top_panel {
		height: 140px;
	}
	.top_title {
		width: 100.0%;
		background-color:	#77BC3F;
	}
	.top_title img{
		width: 100.0%;
	}
	.link_panel {
		width: 100.0%;
	}
	.link_panel li {
		height:	85vw;
		width:	95.0%;
	}
	.panel a p {
		font-size: 80.0%;
	}
	.panel a img {
		border-radius: 30px;
	}
	.img_top_title_bigsize {
		display: none;
	}
	.img_top_title_smallsize {
		display: inline;
	}
	footer {
		font-size: 1.0rem;
	}
	#footer_p2 {
		margin-top: 0px;
	}
	.toiawase_group_toppage {
		width: 80vw;
		height: 30vw;
	}
	.toiawase_group_toppage a#a_email {
		top: 1vw;
		left: 8vw;
	}
	.toiawase_group_toppage a#a_facebook {
		top: 12vw;
		left: -27vw;
	}
	.toiawase_group_toppage a#a_instagram {
		top: 13vw;
		left: -10vw;
	}
	.toiawase_group_toppage p {
		padding-top: 0.6vw;
		width: 50vw;
		font-size: 4vw;
	}
	/* 以下、【プロフィールとご挨拶】ページ */
	header {
		margin: 0;
		padding: 5px 0 5px 0px;
	}
	.logo {
		margin: 0 0 0 0px;
		width: 50px;
		height: 50px;
	}
	.logo img {
		margin-left: 5px;
	}
	.header_title {
		padding: 0 0 0 20px;
		font-size: 80.0%;
	}
	.list_area {
		display: none;
		margin:	0;
		padding:	0;
		height:	50px;
		width:	100.0%;
	}
	.page_title {
		padding: 10px 0 10px 0;
		font-size: 80.0%;
	}
	.content_wrapper {
		/* 以下３行セットで、中央寄せ */
		max-width: initial;
	}
	.container1 {
		display: inline;
	}

	.portlait {
		display: block;
		text-align: center;
		width: 100.0%;
	}
	.portlait img {
		margin-left: 0px;
		width: 170px;
		border-radius: 3px;
	}

	.greeting {
		display: block;
	}
	.greeting p {
		margin: 0 5px 0px 5px;
		padding: 0;
		font-size: 65.0%;
		line-height: 25px;
	}
	.paragraph{
		margin-bottom: 15px;
	}
	.container2 {
		margin-top: -50px;
		height: 620px;
	}
	.career {
		left: 50;
	}
	.profile1 {
		top: 290px;
		left: 3px;
	}
	.profile1 p, .career p {
		margin: 0;
		padding: 0;
		word-wrap: break-word;
		line-height: 20px;
		font-size: 45.0%;
	}
	.border_art {
		left: -30px;
		top: 20px;
		transform: rotate(0deg);
	}
	.border_art img {
		width: 300px;
	}
	.profile2 {
		left: 0vw;
		top: 420px;
		width: 94vw;
		text-align: center;
	}
	.profile2 p {
		line-height: 6vw;
		font-size: 45.0%;
		margin: auto;
		padding: auto;
	}
	.profile2_col1, .profile2_col2 {
		width: 100.0%;
		text-align: center;
		display: block;
		height: 85px;
	}
	.simple_message {
		padding: 0 0 0 5vw;
	}
	.simple_message p {
		font-size: 1.0rem;
		line-height: 15px;
	}
	h1 {
		font-size: 1.3rem;
		min-height: 1.8rem;
	}
	h2 {
		font-size: 1.2rem;
		margin: 0 1.0rem 0 1.0rem;
		border-left: 3px solid #333;
		border-bottom: 1px solid #ccc;
		padding: 0.3em 0.5em;
	}
	.simplepage_explanation {
		margin: 0 1.5rem;
	}
	.simplepage_explanation ul li {
		border-left: solid 4px #77BC3F;/*左側の線*/
		background: whitesmoke;/*背景色*/
		margin: 0 0 1vw -13vw;
		line-height: 1.5;
		border-radius: 0 15px 15px 0;/*右側の角だけ丸く*/
		padding: 0.5em;
		list-style-type: none!important;
		font-size: 1.0rem;
	}
	.explanation_table {
		margin: 1vw 0 1vw -12vw;
		padding: 0;
	}
	.explanation_table_eg {
		margin: 0;
		padding: 0;
	}
	.tablecol_mark {
		margin: 0;
		padding: 0;
	}
	.simplepage_explanation p, .tablecol_mark, .tablecol_00, .tablecol_10, .tablecol_20, .tab_div, .tablecol_10_eg {
		font-size: 1.0rem;
		line-height: 1.5rem;
	}
	.tablecol_mark, .tablecol_00, .tablecol_10, .tablecol_20, .tab_div {
		font-size: 0.8rem;
	}
	.tablecol_10 {
		min-width: 145px;
	}
	.tablerow_empty {
		min-height: 0.5vw;
	}
	.tab_div {
		margin-left: -10vw;
	}
	.simplepage_explanation ul p {
		margin-left: -40px;
	}
	/* 以下、トップページ【お知らせ】欄 */
	.news {
		width: 100.0%;
		text-align: center;
	}
	.news_container {
		margin: auto;
		margin-top: 5px;
		width: 98.0%;
		display: block;
		border: solid 1px #77BC3F;
	}
	.news_title_pc {
		display: none;
	}
	.news_title_mobile {
		display: block;
	}
	.news_title_mobile img {
		height: auto;
		width: 100.0%;
	}
	.news_contents {
		margin: 0;
		padding: 0;
		width: 100.0%;
		display: block;
		vertical-align: top;
		overflow-y: auto;
		height: 50vw;
	}
	.news_contents ul {
		margin: 3px;
		padding: 0;

		height: 100px;
		text-align: left;
		padding-left: 3px;
	}
	.news_title , .article_link , .news_date , .news_date_blog {
		font-size: 1.0rem;
	}
}