@charset "utf-8";
/*--------------------------------------------------------------------------------ペーコンテナ*/
.wrap-con {
  width: 100%;
  display: block;
  justify-content: center;
  padding-top: 3em;
  overflow: hidden;
}
.sec_wrap {
  width: var(--w-basesize);
  margin: 0 auto;
}
.sec_wrap p {
  font-size: clamp(1rem, 1.5vw + 0.6rem, 1.8rem); 
  line-height: clamp(1.5rem, 2vw + 0.6rem, 2.4rem); 
}
.sec_wrap:first-child {
  margin: 0 auto;
}
.sec_wrap:not(:first-child) {
  margin-top: 3em;
}
.sec_wrap:last-child {
  margin-bottom: 0;
}
.wrap-container {
  margin: 0 1em;
}
.wrap-container:not(:first-child) {
  margin-top: 3em;
}
.wrap-container:last-child {
  margin-bottom: 0;
}
.wrap-container p {
margin-top:2em;
}
div.cat_title {
  display: block;
  padding: 0;
}

div.cat_title h2 {
    padding: 0 0 .2em 0;
    margin:2em 0 0 0;
    color: #575757;
    position: relative;
}

div.cat_title h2::after {
    content: "";
    display: block;
    width: 100%;
    height: 6px; /* アンダーラインの高さ */
    background: linear-gradient(90deg, #A58AFF, #8789E5); /* グラデーション色 */
    position: absolute;
    bottom: 0;
    left: 0;
    transform: translateY(100%); /* テキスト下に表示 */
    border-radius: 2px; /* アンダーラインの角を丸くする */
}

/*--------------------------------------------------------------------------------まわりこみあり 左右*/
.p_n, .p_l, .p_r {
  padding: 0 1em;
  overflow: hidden;
  margin: 2em auto;
  text-align: center;
}
.p_n p, .p_l p, .p_r p {
  font-weight: normal;
  text-align: left;
  display: block;
  padding: 0;
  margin: 0;
}
.p_n img {
  display: inline-block;
  width: 80%;
  height: auto;
  margin: 2em auto;
}
.p_l img.pr56w {
  display: inline-block;
  width: 80%;
  height: auto;
  margin: 2em auto;
}
.p_l img.pr35w {
  display: inline-block;
  width: 80%;
  height: auto;
  margin: 2em auto;
}
.p_l img.pr45w {
  display: inline-block;
  width: 80%;
  height: auto;
  margin: 2em auto;
}
.p_r img.pr35w { 
  display: inline-block;
  width: 80%;
  height: auto;
  margin: 2em auto;
}
.p_r img.pr45w {
  display: inline-block;
  width: 80%;
  height: auto;
  margin: 2em auto;
}
.p_r img.pr48w {
  display: inline-block;
  width: 80%;
  height: auto;
  margin: 2em auto;
}
.p_r img.pr56w {
  display: inline-block;
  width: 80%;
  height: auto;
  margin: 2em auto;
}



.container-lr_con {
  margin: 2em 0.5em;
  text-align: center;
}
.container-lr_con-item {
    flex-direction: column; /* 縦方向に並べる */
    align-items: flex-start; /* 左揃え */
    gap: 20px;
  border: 3px solid #C4C9D7;
  padding: 20px;
  background: #F1F1F1;
  box-sizing: border-box;
  margin: 0 0 2em 0;
}
.container-lr_con-item-text h3{
  color: #004C93;
  margin: 1em 0 0.5em;
text-align: left;
 border-bottom: 2px solid #4861C1; 
}
.container-lr_con-item img {
  width: 80%;
  height: auto;
  margin: 0 auto;
}
.container-lr_con-item-text {
  width: 100%;
}
.container-lr_con-item-text p {
width: 100%;
margin:1em 0 0 0;
padding: 0;
text-align: left;
}
/* 偶数番目の項目は逆方向に並べる */
.container-lr_con-item:nth-child(even) {

}

.con-w2 {
    flex-direction: column; /* 縦方向に並べる */
  justify-content: center; /* ボックスの配置を中央揃え */
  gap: 0; /* ボックス間のスペース */
  margin: 2em 0;
}
.con-w2-box {
  width: calc(100% - 0px); /* ボックスの幅を33.333%にし、間隔を差し引く */
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
}
.con-w2-box h2.name {
  position: relative;
  padding: .2em .3em .2em;
  border-bottom: 3px solid #228B79;
  margin: 0 0 0;
  color: #004C93;
  background: #C9FFD4;
}
.con-w2-box p {
margin:0;
  padding: 1em;
}


.con-w3 {
    flex-direction: column; /* 縦方向に並べる */
  justify-content: center; /* ボックスの配置を中央揃え */
  gap: 20px; /* ボックス間のスペース */
  margin: 2em 0;
}
.con-w3-box {
  width: calc(33.333% - 20px); /* ボックスの幅を33.333%にし、間隔を差し引く */
  background-color: #FFFFFF;
  border: 3px solid #228B79;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
}
.con-w3-box h2.name {
  position: relative;
  padding: .2em .3em .2em;
  border-bottom: 3px solid #228B79;
  margin: 0 0 0;
  color: #004C93;
  background: #C9FFD4;
  font-size: 1.6em;
}
.con-w3-box h2.name::before, .con-w3-box h2.name::after {
  position: absolute;
  left: 30px;
  bottom: -15px;
  width: 30px;
  height: 15px;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  content: '';
}
.con-w3-box p {
  padding: 1em 1em 1em;
}
.con-w3 .con-w3-box:nth-child(4), .con-w3 .con-w3-box:nth-child(5) {
  width: calc(33.333% - 20px); /* 同じ幅にする */
}
.con-w4 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; /* 均等に配置 */
  gap: 10px; /* ボックス間のスペース */
  margin: 2em 0.5em;
  width: calc(100% - 1em); /* 親要素の幅を全体に */
  background: #FFFFFF;
  box-sizing: border-box;
  align-items: flex-start; /* 子要素を上揃えに設定 */
}

.con-w4-box {
  flex: 1 1 calc(50% - 10px); /* 50%の幅を確保 */
  max-width: calc(50% - 10px); /* 幅の上限を設定 */
  background-color: #FFFFFF;
  box-sizing: border-box; /* 幅計算に border を含む */
  display: flex; /* 子要素を中央揃え */
  flex-direction: column; /* 縦方向に配置 */
  justify-content: center; /* 縦方向で中央揃え */
  align-items: center; /* 横方向で中央揃え */
  padding: 0;
  overflow: visible; /* 必要に応じて調整 */
}

form {
  width: 100%; /* 必要に応じて調整 */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

select {
  width: 100%; /* 選択ボックスの幅を調整 */
  margin-bottom: 10px; /* 下部にスペース */
}
.col {
	border-style: solid;
	border-color: #9B9B9B;
  background:  #E9E9E9;
  margin-bottom: 1em;
  padding: 0.3em;
}
iframe {
  width: 100%;
  height: auto;
  min-height: 860px; /* フォールバック用 */
  border: none;
 margin: 0 auto;
padding:0;
}
.con_if{
width: 100%;
margin: 0 auto;
padding:0;
text-align: center;
font-size: 0.94em;
}
.p_image img{
width: auto;
height: 200px;
}
.con_if_list_TIT{
padding: 0.3em;
margin: 0.6em 0;
background: #DFDFDF;
font-weight: bold;
}
.p_image {
    position: relative;
    display: inline-block;
}
.p_image img{
    display: block;
width: auto;
height: 180px;
}
.p_image .model {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white; /* テキストの色を変更 */
    background-color: rgba(0, 0, 0, 0.5); /* 背景色と透明度を追加（オプション） */
    padding: 5px; /* テキスト周りの余白を追加（オプション） */
    border-radius: 5px; /* 角を丸くする（オプション） */
}