*{
  margin:0;
  padding:0;
}

/*ヘッダー*/
header {
  height: 80px;
  width:100%;
  box-sizing:border-box;
}

.site_header_inner {
  width:100%;
  height:80px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.header_left {
  width:225px;
  height:65px;
}
.header_left img {
  width:225px;
  height:65px;
}

.header_right ul {
  display:flex;
  list-style:none;
  align-items:center;

}


.header_right li img {
  height:22px;
  object-fit:contain;
  
}
.header_right a {
  padding:29px 19px;
}

.header_menu_contact {
  background-color:#F69454;
  height:80px;
  line-height:80px;
  border-radius:9px;
}

/*メインビジュアル*/
.main-visual {
  height:688px;
  width:100%;
  margin:0 auto;
  position:relative;
}

.main-visual_img {
  height:668px;
  width:86%;
  padding-top:20px;
  
}
.main-visual_img img {
  width:100%;
  height:668px;
  object-fit: cover;
  object-position:right;
  border-radius:9px;
}

.main-visual_text img {
  height:511px;
  
}
.main-visual_text {
  position:absolute;
  top:137px;
  right:44px;
}

/*企業理念*/

.section1 {
  width:100%;
  max-width:1200px;
  margin:0 auto;
  position:relative;
}
.section1_left {
  position:absolute;
  bottom:0;
  left:-83px;
  z-index:-1;
}

.section1_left img {
  height:351px;
  width:351px;
  border-radius:100%;
}





.section1_center {
  width:57%;
  margin:0 auto;
  text-align:center;
}
.section1_title_img {
  width:227px;
  height:72px;
  margin-top:75px;
  margin-bottom:35px;
}
.section1_copy img {
  height:80px;
  width:426px;
}
.section1_center p {
  font-size:16px;
  margin-top:50px;
}


.section1_right{
  position:absolute;
  top:101px;
  right:0px;
  z-index:-1;
}

.section1_right img {
  height:248px;
  width:248px;
  border-radius:100%;
}
@media screen and (max-width:1200px){
  .section1_left img {
    height:200px;
    width:200px;
  }
  .section1_right img {
    height:180px;
    width:180px;
  }
  .section1_left {
    left:-50px;
  }
  .section1_right{
    position:absolute;
    top:50px;
    right:0px;
  }
  
}


/*事業内容*/
.section2_back {
  width:100%;
  margin:0 auto;
  text-align: center;
  box-sizing:border-box;
  background-image:url(./img/section2_back_img.png);
  background-size:contain;
  background-repeat: repeat-x;
}
.section2 {
  width:100%;
  margin:0 auto;
}



.section2_top {
  text-align:center;
}
.section2_title_img {
  width:177px;
  height:72px;
  margin-top:57px;
  margin-bottom:35px;
}


.section2_body_brock {
  width:97%;
  max-width:1200px;
  display:flex;
  justify-content:center;
  padding-bottom:28px;
  margin:0 auto;
  text-align: center;
}

@media screen and (max-width:768px){
  .section2_body_brock {
    flex-direction:column-reverse;
  }
  .section2_body_brock:nth-child(even){
    flex-direction:column;
  }
}


/*多彩色バナー・説明*/
.section2_tasaisyoku {
  width:100%;
  max-width:1200px;
  padding-top:55px;
  padding-bottom:90px;/*【修正用】多彩色の下部の余白*/
  margin:0 auto;
  display:flex;
  justify-content:center;
  position:relative;
}

.tasaisyoku_hukidashi {
  position:absolute;
  top:-20px;
  left:20px;
}

.tasaisyoku_banner {
  width:100%;
  
}
.tasaisyoku_left {
  background-color:#fff;
}
.tasaisyoku_right {
  width:50%;
  background-color:#fff;
}
.tasaisyoku_right img {
  width:100%;
  height:39px;
  object-fit:contain;
  padding:62px 0px 20px 20px;
}
.tasaisyoku_text {
  width:100%;
  box-sizing: border-box;
  padding:0px 20px 20px 20px;
}
@media screen and (max-width:768px){
  .section2_tasaisyoku {
    flex-direction:column;
  }
  .tasaisyoku_right {
    width:100%;
  }
}

/*1かたまり目(外壁塗装)と3かたまり目(光触媒コーティング)*/
.section2_body_left {
  width:47%;
  height:300px;
  background-color:#FFFFFF;
  text-align:center;
}
.section2_body_left img {
  width:100%;
  height:39px;
  object-fit:contain;
  padding-top:65px;
  padding-bottom:32px;
}
.section2_body_right {
  width: 47%;
  height:300px;
  background-color:#FFFFFF;
  border-radius:0px 16px 16px 0px;
  text-align:center;
}

.section2_body_right img {
  width:100%;
  height:300px;
  box-sizing: border-box;
  border-radius:16px;
  object-fit: cover;
}

@media screen and (max-width:768px){
  .section2_body_left {
    width:100%;
  }
  .section2_body_right {
    width:100%;
  }
}

/*2かたまり目(屋根塗装)*/
.section2_body_right_2 {
  width:47%;
  height:300px;
  box-sizing: border-box;
  background-color:#FFFFFF;
  text-align:center;
}
.section2_body_right_2 img {
  width:100%;
  height:39px;
  object-fit:contain;
  padding-top:65px;
  padding-bottom:32px;
}
.section2_body_left_2 {
  width:47%;
  height:300px;
  box-sizing: border-box;
  background-color:#FFFFFF;
  border-radius:16px 0px 0px 16px;
  text-align:center;
}

.section2_body_left_2 img {
  width:100%;
  height:300px;
  box-sizing: border-box;
  border-radius:16px;
}
@media screen and (max-width:768px){
  .section2_body_left_2 {
    width:100%;
  }
  .section2_body_right_2 {
    width:100%;
  }
}


/*代表挨拶*/
.section3 {
  width:100%;
  max-width:1200px;
  box-sizing: border-box;
  margin:0 auto;
  position:relative;
}

.section3_right {
  position:absolute;
  top:0px;
  right:0px;
  z-index:-1;
}
.section3_right img{
  width:337px;
  height:337px;
  border-radius:100%;
}

.section3_center {
  width:60%;
  margin:0 auto;
  padding:15%;/*【修正用】代表挨拶タイトルの上部余白*/
  text-align:center;
}
.section3_title_img {
  width:195px;
  height:66px;
  margin-bottom:35px;
}
.section3_profile {
  display:flex;
  justify-content:center;
  padding-bottom:35px;
}
.section3_profile img {/*【修正用】代表顔写真*/
  width:200px;
  height:200px;
  border-radius:100%;
  padding-right:44px;
}
.profile_right {
  width:200px;
  text-align:left;
}
.profile_right {
  width:200px;
}
.profile_yomigana {
  font-size:16px;
}
.profile_name {
  font-size:28px;
  padding:12px 0px 27px 0px;
}
.profile_text {
  font-size:20px;
  line-height:32px;/*【課題】行間の整え方*/
}
.section3_left {
  position:absolute;
  top:694px;
  left:0px;
  z-index:-1;
}
.section3_left img {
  width:248px;
  height:248px;
  border-radius:100%;
}
@media screen and (max-width:768px){
  .section3_profile {
    width:100%;
    flex-direction:column;
  }
  .section3_profile img {
    padding-right:0px;
  }
  .profile_right {
    width:100%;
    text-align:center;
  }
  .section3_right img{
    width:200px;
    height:200px;
  }
  .section3_left {
    top:auto;
    bottom:0px;
    left:-50px;
  }
  .section3_left img {
    width:200px;
    height:200px;
  }
}

/*施工事例*/
.section4 {
  width:100%;
  box-sizing: border-box;
}

.section4_title {
  margin:0 auto;
  text-align:center;
}
.section4_title_img {
  width:140px;
  height:66px;
  
}
/*【編集用】投稿一覧表示　予定地*/
.section4_works {
  width:100%;
  box-sizing:border-box;
  padding-top:103px;
  display:flex;
  justify-content: center;
}
.section4_post {
  width: 96%;
  max-width:1200px;
  box-sizing:border-box;
  display:flex;
  justify-content:space-between;
}

.post_box {
  width:281px;
  height:333px;
  background-color: #fff;
}
.section4_post a {
  color:#000;
  text-decoration:none;
  margin: 0 auto;
}
.post_box img {
  width:280px;
  height:200px;
}
.post_text {
  font-size: 12px;
  overflow: hidden; /* はみ出した分は表示しない */
  text-overflow: ellipsis; /* はみ出した部分に「...」を表示 */
  display: -webkit-box; /* 特殊な表示モード（box）にする */
  -webkit-line-clamp: 3; /* 3行目で切る */
  -webkit-box-orient: vertical; /* 縦方向に並べる */
}
.post_textarea {
  padding:14px;
}

@media (max-width: 1200px) {/*///////////ココの意味！！///////////*/
  .section4_works .post {
    max-width: 352px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    justify-content: center;
  }
}
@media (max-width: 768px) {
  .section4_works .post {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    justify-content: center;
  }
}

/*会社概要*/
.section5 {
  width:100%;
  box-sizing: border-box;
  margin:0 auto;
  text-align:center;
}

.section5_title_img {
  width:200px;
  height:66px;
  margin-top:138px;
  margin-bottom:72px;
}

.section5_body {
  width:63%;
  height:auto;
  margin:0 auto;
  align-items:center;
  text-align:left;

}
.section5_body_box {
  display:flex;
  justify-content:center;
  align-items:flex-start;
}

.section5_body_box p {
  font-size:16px;
  line-height:28.8px;
  padding-bottom:20px;
}
.section5_body_title {
  width: 50%; /* タイトル部分の幅を固定 */
  text-align: left;
  margin-left: 20%;
}

.section5_body_text {
  width:50%; 
  text-align:left;
}

.section5_google-map {
  text-align:center;
  padding-top:72px;
  padding-bottom:120px;
}

@media screen and (max-width:768px) {
  .section5_body {
    width:80%;
    height:auto;
    margin:0 auto;
    align-items:center;
    text-align:left;
  }
  .section5_body_text {
    width: calc(100% - 225px); 
  }
  .section5_body_box p {
    font-size:12px;
    line-height:28.8px;
    padding-bottom:20px;
  }
}

/*お問合せ*/
.section6 {
  width:100%;
  box-sizing: border-box;
  margin:0 auto;
  text-align: center;
}
.section6_title_img {
  width:183px;
  height:66px;
  margin-bottom:35px;
}

.section6_body {
  margin-top: 36px;
}
.section6_text p {
  font-size:16px;
  line-height:28.8px;
  padding-bottom:35px;
}

.section6_tell {
  display:inline-block;
  width:290px;
  height:46px;
}

form {
  width:59%;
  margin:0 auto;
  padding-top:75px;
  padding-bottom:214px;
}

.form_q {
  display:flex;
  padding-bottom:18px;
}
.form_pulus-padding {
  padding-top:18px;
}
.hissu_ninni {
  width:38px;
  height:20px;
  font-size:10px;
  color:#fff;
  line-height: 20px;
  margin-right: 5px;
}

.form_hissu {
  background-color: #FF9393;
}
.form_ninni {
  background-color: #93C9FF;
}
.form_q_title {
  width:141px;
  font-size: 16px;
  text-align: left;
}

form input {
  width:100%;
  height:39px;
  line-height:39px;
  font-size: 16px;
}
.wpcf7-form-control-wrap {
	width:100%;
	box-sizing: border-box;
	display:block;
}

form textarea {
  width:100%;
  height:287px;
  font-size: 16px;/*//////////フォントサイズをどうやって確認すれば良い?///////////*/
}
.check_box {
  text-align:left;
  padding-top:63px;
	
}
input[type="submit"] {
  width:100%;
  max-width:287px;
  height:69px;
  font-size:20px;
  color:#fff;
  background-color:#F0831E;
  border-radius:40px;
}
input[type="checkbox"]{
	width:30px;
	height:30px;
	
	font-size:30px;
}
.wpcf7-list-item label {
	display:flex;
	align-items:center;
}
@media screen and (max-width: 768px) {
  .form_q {
    flex-direction: column; /* ← ここで縦並びに */
    align-items: flex-start; /* 左寄せ */
  }

  .form_q_title,
  .hissu_ninni {
    margin-bottom: 6px; /* 下にスペースを作る */
  }

  form input,
  form textarea {
    width: 100%; /* 幅を最大に */
  }
}

/*フッター*/
footer {
  width:100%;
  height:497px;
  box-sizing:border-box;
  margin:0 auto;
  text-align:center;
  background-color:#005D9D;
  
}

.footer_logo img {
  display:inline-block;
  width:309px;
  height:309px;

  
}

.footer_text {
  text-align:center;
  font-size:20px;
  line-height:34px;
  padding-bottom:105px;
  color:#fff;
}


/*!!!!!!!ここからWORK投稿ページ!!!!!!!*/
/*!!!!!!!ここからWORK投稿ページ!!!!!!!*/

/*上の画像*/
.work_visual {
  width:100%;
  box-sizing:border-box;
  height:769px;
  position:relative;
  background-image:url(/wp-content/uploads/2025/06/work_visual.jpg);
  background-size:cover;
  background-position:top;
  background-repeat:no-repeat;
  
}
.work_visual_copy {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-color:rgba(255,255,255,0.5);
  text-align:center;
  line-height:769px;
  transform:translate(-50,-50);
  
  color:#005D9D;
  font-size:50px;
  text-shadow:1px 1px 3px rgba(0,0,0,0.3);
}


/*投稿内容*/
.works_main {
  width:100%;
  box-sizing:border-box;
  display: grid;/*/////////////gridとは？////////////*/
  place-items: center; 
}

.works_post {
  width:66.7%;
  padding-top:64px;
  padding-bottom:207px;
  display: grid;
  place-items: center; 
}
.works_post_title1{
  width:66.7%;
  font-size:24px;
  color:#F0831E;
  border-bottom:1px solid #F0831E;
  padding-bottom:25px;
}
.works_post_p1,.works_post_p2 {
  display: inline-block;
  width:66.7%;
  font-size:14px;
  padding-top:56px;
  padding-bottom:56px;
  
}
.works_post_img1,.works_post_img2 {
  width:66.7%;
  object-fit:cover;
  padding-bottom:24px;
}
.works_post_title2 {
  width:66.7%;
  font-size:24px;
  color:#F0831E;
  border-left:1px solid #F0831E;
  padding:13px 50px;
  
}



/*投稿にある投稿一覧*/

.other_works {
  width: 100%;
  box-sizing:border-box;
  background-color: #FFF7EA;
}
.other_works_box {
  width:88%;
  margin:0 auto;
}
.other_works_title{
  font-size:24px;
  padding-top:93px;
  padding-bottom:77px;
}
.other_works .section4_post {
  margin-bottom:169px;
}
.post_page-zone {
  display:block;
  width:23%;
  padding-top:157px;
  margin:0 auto;
  text-align: center;
  padding-bottom:83px;
}
.post_page-zone a {
  padding:14px;
  color:#F0831E;
  font-size:24px;
  font-weight:600;
  text-decoration:none;
}
.post_page-zone a:active {/*///////////選択された時の使用///////////*/
  border:1px solid #F0831E;
  background-color: #fff;
}
.works_post_back-btn {
  padding:24px;
  color:#F0831E;
  font-size:16px;
  font-weight:normal;
  text-decoration:none;
}
@media (max-width: 768px) {
  .works_post_title1,
  .works_post_title2 {
    font-size: 18px;
    padding: 10px;
  }

  .works_post_p1,
  .works_post_p2 {
    font-size: 13px;
    padding: 20px 0;
  }

  .post_page-zone {
    width: 80%;
  }

  .other_works_title {
    font-size: 20px;
    padding-top: 50px;
    padding-bottom: 40px;
  }
}

.page-work_hero {
  width:100%;
  box-sizing:border-box;
  height:769px;
}
.page-work_hero img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.page-work_title {
  width:100%;
  box-sizing:border-box;
  height:80px;
  background-color: #005D9D;
  text-align: center;
  padding:4px 0;
}
.page-work_title h2 {
  color:#fff;
}
.page-work_title p {
  color:#fff;
}
.page-work_main {
  background-color: #fff;
}
.page-work_main_menu {
  width:89%;
  text-align: right;
}
.page-work_main_menu ul {
  display:flex;
  list-style:none;
  justify-content: flex-end;
  margin:56px 0;
}
.page-work_main_menu a {
  padding:17px;
  border:1px solid #005D9D;
  text-decoration:none;
  color:#005D9D;
  margin-right:20px;
  
}
.page-work_main_menu a:hover{
  color:#fff;
  background-color: #005D9D;
  transition:all 0.5s;
}

.page-work_main_menu li:last-child a{
  margin-right:0;
}

.page-work_main_post {
  display:flex;
}
.page-work_post_item {
  width:240px;
  margin:0 30px 56px 0;
}
.page-work_post_item:nth-child(4n){
  margin:0 0 56px 0;
}
.page-work_post_item img {
  width:100%;
  height:240px;
  object-fit: cover;
}
.page-work_post_meta {
  padding:14px 0;
}
.page-work_post_category {
  font-size:12px;
  display:inline-block;
  padding:4px 8px;
  margin-right:14px;
  color:#fff;
  background-color:#005D9D;
}
.page-work_post_date {
  font-size:14px;
}
.page-work_post_title {
  font-size:14px;
  font-weight:600;
  overflow: hidden; /* はみ出した分は表示しない */
  text-overflow: ellipsis; /* はみ出した部分に「...」を表示 */
  display: -webkit-box; /* 特殊な表示モード（box）にする */
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}