@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/*ヘッダー用のCSS*/
.logo-header {
	display: none;
} 


.navi {
	background-color: rgba(255, 255, 255, 0);
	position: fixed;
	margin: 0px auto;
	width: 100%;
	z-index: 100; 
}

.mobile-menu-buttons {
	background-color: rgba(255, 255, 255, 0);
	left:auto;
	box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
	position: fixed;
}

/*ヘッダー用CSS終わり*/

/*フッター用のCSS*/
.footer-bottom {
    margin: 10px 0px;
}

/*フッター用CSS終わり*/

/*SNSフォローボタン、更新日時、著者情報など、いらないものを消す*/
.sns-share,.post-update,.author-info,.date-tags,.breadcrumb {
    display: none;
}
/*/////////////////////////////////////////////////////*/

/*ページタイトルを非表示*/
.entry-title {
	display: none;
}
/*/////////////////////////////////////////////////////*/

/*いらないマージン削除*/
.content {
	margin: 0;
}

.content-in {
	margin: 0;
	width: 100%;
}

.entry-content {
	margin: 0;
}

.main {
	padding: 0;
	width: 100%;
}

.footer {
	margin: 0;
}

.pc-kv {
	min-height: 50vh;
}

.article p {
	margin: 0;
}

.mblt-header-mobile-buttons {
	margin-top: 0px!important;
}

/*/////////////////////////////////////////////////////*/
/*****トップページ-画像 *****/
.pc_img {
	display: block;
}

.sp_img {
	display: none;
}

/*****トップページ-事業内容 *****/
.business-content {
	background-image: url('https://www.diversity-heart.com/wp-content/uploads/2022/06/sec2_bg@2x.jpg')!important;
	background-size: 100%;
	background-repeat: no-repeat;
	margin: 100px 0px 0px 0px!important;
}

.business-content-title {
	display: grid;
	background-image: url('https://www.diversity-heart.com/wp-content/uploads/2022/06/Business-Content@2x.png')!important;
	background: center;
	background-size: 30%;
	background-repeat: no-repeat;
	margin: 0px 0px 20px 0px;
	text-align: center;
}

.business-content-title-text {
	background-color: transparent!important;
	margin: 0px 0px 10px 0px!important;
	padding: 50px 25px 0px 25px!important;
}

.business-content-intro {
	display: flex;
	justify-content: center;
	margin: 0px auto;
	width: 90%;
}

.company-text {
	width: 50%;
	margin: 0px 50px;
}

.article h3 {
	margin: 0px!important;
	padding: 0px!important;
	line-height: 1.6!important;
	border: 0px none;
}

span.company-title:before {
    content: "";
    display: block;
    width: 65px;
    height: 65px;
    background-image: url(https://www.diversity-heart.com/wp-content/uploads/2022/06/circle.png);
    background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    z-index: -1;
    top: -10px;
    left: -30px;
}

span.company-title{
	font-size: 32px;
    position: relative;
    z-index: 1;
}

span.company-industry{
	font-size: 15px;
    position: relative;
	top: -7px;
    z-index: 1;
	color: #838383;
    font-weight:bold;
}

.company-title-Japanese {
	padding-left: 6px;
	font-size: 18px;
	font-weight: normal;
	margin-bottom: 0px!important;
}

.company-picture {
	width: 50%;
	margin: 0px 50px;
}

.company-belief {
	margin-bottom: 32px!important;
	color: #707F89;
}

.to_homepage_button {
	padding: 12px 0;
	text-align: center;
	font-size: 16px;
	border-radius: 24px;
	border: 0px solid beige;
	background: #4db766;
	width: 40%;
    min-width: 150px;
    max-width: 200px;
}

.to_homepage_button > a {
	color: white;
	text-decoration: none;
}

.to_homepage_button:hover {
	opacity: 0.7;
}

.wp-image-115 {
	border: 1.5px solid #e0e0e1;
	border-radius: 18px!important;
	box-shadow: 2px 2px 2px #e0e0e1;
	margin: 0px auto;
}

/*****トップページ-会社情報 *****/
.company_info {
	display: grid;
	background: center;
	background-size: 20%;
	background-repeat: no-repeat;
	margin: 100px 0px 20px 0px;
	text-align: center;
}

.company_info_text {
	background-color: transparent!important;
	margin: 0px 0px 10px 0px!important;
	padding: 50px 25px 0px 25px!important;
}

table th{
	background-color: #fff;
	border:none;
	border-bottom: solid 2px #eee;
	padding: 20px 10px;
}
        
table td{
	padding: 20px 10px;
}

.table_form_pc {
	display: table;
	border-top: 2px solid #98A6B5;
	border-right: 0px none;
	border-bottom: 0px none;
	border-left: 0px none;
	width: 80%;
	margin: auto;
}

.table_form_sp {
	display: none;
}

.table_form_sp_style {
}

.table_form_column1 {
	color: #707F89;
	font-size: 12pt;
	border-top: 0px none;
	border-right: 0px none;
	border-bottom: 1px solid #CDD6DD;
	border-left: 0px none;
	background-color: #ffffff;
	width: 30%;
	height: 40px;
}

.table_form_column2 {
	color:#3B4043;
	font-size: 12pt;
	border-top: 0px none;
	border-right: 0px none;
	border-bottom: 1px solid #CDD6DD;
	border-left: 0px none;
	background-color: #ffffff;
	width: 70%;
}

/*****トップページ-お問い合わせ *****/
.hentry {
	margin-bottom: 0px!important;
}

.contact_info {
	display: grid;
	background-size: cover;
	background-repeat: no-repeat;
	text-align: center;
	width: 100%;
	height: 600px;
	margin: 80px auto 0px auto!important;
}

.contact_text_pc {
	display: block;
	background-color: transparent;
	margin: auto auto 10px auto!important;
	font-size: 22px;
	font-weight: bold;
}

.contact_text_sp {
	display: none;
}

.to_contact_button {
	display: flex;
    flex-direction: column;
    justify-content: space-around;
	padding: 0px 40px;
	font-size: 16px;
	border-radius: 24px;
	width: 40%;
	max-width: 400px;
	border: 0px solid beige;
	background: #FF9D00;
	margin: 20px auto;
	height: 18%;
}

.to_contact_button > a {
	color: white;
	text-decoration: none;
}

.to_contact_button:hover{
	opacity: 0.7;
}

/***** 事業内容画面 *****/
.map{
	margin:0 15%;
}

.body .aligncenter {
    width: 35%;
	margin-top: 20px;
	margin-bottom: 70px;
}

/*****お問い合わせ画面 *****/
.contact-form {
	width: 70%;
	margin: 0px auto;
}

.contact-form-content {
	display: flex;
	justify-content: space-between;
	margin: 30px 0px;
}

.contact-form-content-title {
	width: 30%;
	padding-top: 10px;
	color: #707F89;
    font-weight:bold;
}

.contact-form-content-input {
	width: 65%;
}

.contact-form-message {
	resize: none;
}

.privacy-policy-text {
	height: 200px;
	resize: none;
}

.privacy-policy-check {
}

input[name="agree"] {
	margin: 0 10px 0 0;
}

.confirm-button {
	width: 100%;
	text-align: center;
}

.contact-form-confirm {
	border-radius: 20px;
	font-size: 14px;
	color: white!important;
	background-color: #FF9D00!important;
	width: 20%!important;
}

.contact-form-confirm:hover {
	opacity: 0.7;
}
.philosophy-text{
	font-size: 1rem;
    text-align: center; 
    margin: 0;
    padding: 0px 3%;
}
.philosophy-table{
	width:60%;
	margin:auto;
}
.philosophy-table-left-text{
	text-align: right; 
    margin: 0;
    padding: 0px 0%;
	border-bottom: none;
	font-weight: normal;
	font-size:1rem;
}
.philosophy-table-right-text{
    text-align: left; 
    margin: 0;
    padding: 0px 3%;
	border-bottom: none;
	font-weight: normal;
	font-size:1rem;
}
.ceomessage-text{
	font-size: 1rem;
    text-align: center; 
    margin: 0;
    padding: 0px 3%;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
	/*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
	/*必要ならばここにコードを書く*/
	.pc_img {
	display: none;
	}

	.sp_img {
		display: block;
	}
	
	.business-content-title {
		background-size: 90%;
	}

	.business-content-intro {
		display: block;
	}

	span.company-title:before {
		width: 80px;
		height: 80px;
		top: -20px;
		left: -24px;
	}
	
	.company-text {
		width: 90%;
		margin: 0px auto;
	}

	.company-picture {
		width: 90%;
		margin: 0px auto;
	}
	
	.company-belief {
		margin-bottom: 16px!important;
	}

	.to_homepage_button {
		font-size: 14px;
		font-weight: bold;
		margin-bottom: 30px;
		text-align: center;
		width: 100%;
	    min-width: none;
    	max-width: none;
	}

	.contact-form-content {
		display: block;
	}
	
	.contact-form-content-title {
		width: 100%;
	}

	.contact-form-content-input {
		width: 100%;
	}
	
	.to_contact_button {
		width: 50%;
	}

	.wpcf7-spinner {
		display: none!important
	}
  
	.contact-form-confirm {
		width: 80%!important;
		margin-bottom: 30px!important;
	}
}

/*520px以下*/
@media screen and (max-width: 520px){
	/*必要ならばここにコードを書く*/	
	.contact_text_pc {
		display: none;
	}

	.contact_text_sp {
		display: block;
		background-color: transparent;
		margin: auto auto 10px auto!important;
		font-size: 22px;
		font-weight: bold;
	}

	.to_contact_button {
		padding: 3px 0px 1px 0px;
		margin: 10px auto 0px auto;
		width: 80%;
	}
	
	.to_contact_button > a {
		font-size: 16px;
	}
}

/*480px以下*/
@media screen and (max-width: 480px){
	/*必要ならばここにコードを書く*/
	.company_info {
		background-size: 60%;
	}

	.table_form_pc {
		display: none;
	}

	.table_form_sp {
		display: table;
		border-top: 2px solid #98A6B5;
		border-right: 0px none;
		border-bottom: 0px none;
		border-left: 0px none;
		width: 80%;
		margin: auto;
	}
	
	.table_form_sp_style {
		margin: 0px 10px 25px 10px!important;
		width: 95%!important;
	}
	
	.company-title {
	}
	
	.company_info_text {
		font-size: 25px!important;
		margin: 0px 0px 30px 0px!important;
		padding: 60px 0px 0px 0px!important;
	}

	.table_form_column1 {
		padding: 5px 0px 10px 0px!important;
	}
  
	.table_form_row_title {
		font-size: 18px!important;
		padding: 10px 0px 0px 0px!important;
	}
  
	.table_form_row_info {
		font-size: 18px!important;
		color: #3B4043!important;
	}

	.pc-kv{
		min-height: 40vh;
	}
	
	.map {
		margin: 0;
	}
	
	.footer-bottom {
		margin: 0px 0px 10px 0px;
		font-size: 12px;
	}
	
	.body .aligncenter {
		width: 60%;
		margin-bottom: 30px;
	}
}

/*お問い合わせフォームのプレースホルダ―の文字色*/
.contact-form input::placeholder, .contact-form textarea::placeholder {
 color:#3B4043;
}

/*お問い合わせフォームの入力欄の枠線*/
.contact-form-content input, .contact-form-content textarea{
 border:1px solid  #98A6B5;
}