@charset "UTF-8";
#header {background-color: rgba(255,255,255,1);}
#page_header{background-image: url("../img/header_img_pc.webp");}


.section_01{background-image: url("../img/sec_01_back_pc.webp");background-repeat: no-repeat;background-size: cover;background-position: center;}
.sec_01_left{float: left;width: 70%;}
.sec_01_right{float:right;width: 30%;}
.sec_01_img02{width: 100%;}
.page_h3_right{font-weight: normal;font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";font-size: 1.8em;line-height: 1.8em;float: right;color:#3e3a39;margin-top: 0.6em;}

.page_h3_left{font-weight: normal;font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";font-size: 1.8em;line-height: 1.8em;float: left;color:#3e3a39;margin-top: 0.6em;}
.tategaki_center{display: flex;justify-content: center; }
.page_h3_center{font-weight: normal;font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";font-size: 1.8em;line-height: 1.8em;color:#3e3a39;margin-top: 0.6em;}

.page_h4{font-weight: normal;font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";font-size: 1.2em;line-height: 1.8em;color:#3e3a39;margin-top: 0.6em;text-align: center;}


.tategaki {
writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
/* IE対応 */
}
.text-block {
   writing-mode: vertical-rl;
    height: 300px;
  }


.hanbai_copy{text-align: center;color: #800012;margin: 0.4em 0;}

.section_02{background-image: url("../img/sec_02_back_pc.svg");background-repeat: no-repeat;background-size: cover;background-position: top center;}
.sec_02_left{float: left;width: 20%;}
.sec_02_right{float:right;width: 80%;}

.section_03{background-image: url("../img/sec_03_back_pc.webp");background-repeat: no-repeat;background-size: cover;background-position: center;}
.sec_03_left{float: left;width: 70%;}
.sec_03_right{float:right;width: 30%;}

.section_04{background-image: url("../img/sec_04_back_pc.webp");background-repeat: no-repeat;background-size:contain;background-position: top center;}
.sec_04_w90per{width: 90%;margin: 0 auto;}

.section_05{background-image: url("../img/sec_05_back_pc.webp");background-repeat: no-repeat;background-size: cover;background-position: top center;}

/* section_05のコンテンツCSS */


.okuno-wrapper {
  max-width: 1200px;
  margin: auto;
  padding: 60px 20px;
}

.okuno-section {
  display: flex;
  align-items:flex-start;
  justify-content: space-between;
  margin-bottom: 50px;
  gap: 40px;
}

.okuno-section.reverse {
  flex-direction: row-reverse;
}

/* 画像枠 */
.okuno-img {
	width: 50%;
	z-index: 10;
}

.okuno-img img {
  width: 100%;
  height: auto;
  display: block;
	margin-top: 50px;
	
}

/* 白いテキストカード */
.okuno-box {
  width: 50%;
	height: 230px;
  background: #fff;
  padding: 50px 70px 50px 100px;
  box-shadow: 0px 10px 20px rgba(0,0,0,0.15);
  position: relative;
	margin-left: -10%;
}
.okuno-box_right {
  width: 50%;
	height: 230px;
  background: #fff;
  padding: 50px 100px 50px 70px;
  box-shadow: 0px 10px 20px rgba(0,0,0,0.15);
  position: relative;
	margin-right: -10%;
}
/* 見出し */
.okuno-box h2 ,.okuno-box_right h2{
  font-size: 1.5em;
  margin-bottom: 20px;
  line-height: 1.6;
  border-bottom: 1px solid #b42e2e;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  font-weight: normal;
	
}

.okuno-box h2 span ,.okuno-box_right h2 span{
  font-size: 1.1em;
}

.okuno-box p ,.okuno-box_right p{
  font-size: 1.0em;
  line-height: 2;
  color: #333;
}

/* ---- SP ---- */
@media (max-width: 640px) {
	
.okuno-wrapper {
  padding: 0px 20px;
}
  .okuno-section,
  .okuno-section.reverse {
    flex-direction: column;
	 margin-bottom: 2em;
	  gap: 0px;
  }

  .okuno-img,
  .okuno-box,.okuno-box_right {
    width: 100%;
  }

  .okuno-box ,.okuno-box_right{
    padding: 30px 20px;
	  box-sizing: border-box;
	  height: auto;
  }
	.okuno-box{margin-left: 0%;}
	.okuno-box_right{margin-right: 0%;}
	.okuno-img img {margin-top: 0px;}
  .okuno-box h2 ,.okuno-box_right h2{
    font-size: 1.14em;line-height: 1.2;padding-bottom: 0.6em;
  }
	.okuno-box p ,.okuno-box_right p{
  font-size: 0.84em;
  line-height: 1.8;
}
}



/* 菱形アイコン付きタイトルのCSS */
.heading {
  text-align: center;
  padding: 40px 20px;
}

.heading-icon {
  width: 60px;
  height: 40px;
  margin: 0 auto 12px;
  
}

.heading-title {font-weight: normal;font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  font-size: 3.2em;
}

.heading-sub {
  font-size: 1em;
	font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  color: #999;
}



/* --- Responsive --- */
@media (max-width: 640px) {
  .heading-title {
    font-size: 1.5rem;
  }
  .heading-sub {
    font-size: 0.8rem;
  }
  .heading-icon {
    width: 30px;
    height: 24px;
  }
}

.pb70{padding-bottom: 70px;}

.kanban{position: relative; width: 70%;margin-left: 35%; margin-top: 8%;}
/* -----------------------------
   レスポンシブ対応
----------------------------- */
@media screen and (max-width: 768px) {
  .sub-title {
    font-size: 0.85rem;
    letter-spacing: 0.3em;
  }

  .main-title {
    font-size: 2.0rem;
    white-space: normal; /* スマホでは折り返す */
  }

  .divider {
    height: 40px;
  }
}

@media screen and (max-width: 480px) {
  .sub-title {
    font-size: 0.75rem;
  }

  .main-title {
    font-size: 1.3rem;
  }

  .divider {
    height: 30px;
  }
}

/*
===================================================
 tb タブレット解像度
===================================================
*/
@media screen and (max-width:1000px) {

	}
/*
===================================================
 sp スマホ解像度
===================================================
*/
@media screen and (max-width:640px) {
#page_header{background-image: url("../img/header_img_sp.webp");}
.page_h3_left{font-weight: normal;font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";font-size: 1.2em;line-height: 1.8em;float: left;color:#3e3a39;margin-top: 0em;}
.page_h3_right{font-weight: normal;font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";font-size: 1.2em;line-height: 1.8em;float: right;color:#3e3a39;margin-top: 1.6em;}	
.page_h3_center{font-weight: normal;font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";font-size: 1.2em;line-height: 1.8em;color:#3e3a39;margin-top: 0.6em;}
.page_h4{font-weight: normal;font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";font-size: 0.9em;line-height: 1.6em;color:#3e3a39;margin-top: 0.6em;text-align: center;}
.pb70{padding-bottom: 40px;}
p.copy_p{font-size: 0.94em;line-height: 1.4;}

.section_01{background-image: url("../img/sec_01_back_sp.webp");background-repeat: no-repeat;background-size: contain;background-position: center;}
.sec_01_left{position: relative; float: none;width: 100%;z-index: 5;}
.sec_01_img02{width:56%;float: left;margin-top: 1.6em;}
.section_02{background-image: url("../img/sec_02_back_sp.svg");background-repeat: no-repeat;background-size: contain;background-position: top center;}
.sec_02_right{float:right;width: 76%;}
.w48per img.sec_02_img02{width: 60%;margin-top: -70px;}
.section_03{background-image: url("../img/sec_03_back_sp.webp");background-repeat: repeat-y;background-size: contain;background-position: top center;}
.sec_03_left{float: none;width: 100%;}
.sec_03_right{float:none;width: 100%;display: flex;justify-content: center;margin-top: 1.6em;}
.w48per img.sec_03_img02{width: 80%;float: right;}
.section_04{background-image: url("../img/sec_04_back_sp.webp");background-repeat: no-repeat;background-size:contain;background-position: center;}
.section_05{background-image: url("../img/sec_05_back_sp.webp");background-repeat: repeat-y;background-size: contain;background-position: top center;}

}