/* ページ遷移フェード用オーバーレイ（初期は表示＝opacity:1） */
body::after{
  content:'';
  position:fixed;
  inset:0;
  background:#fff;
  z-index:9999;
  pointer-events:none;
  opacity:1;                 /* ← 初期は白がかぶさっている */
  transition:opacity .5s ease;
}

/* 読み込み完了後に白を消す（フェードイン） */
body.is-page-ready::after{
  opacity:0;
}

/* 遷移開始時は白を出す（フェードアウト） */
body.is-leaving::after{
  opacity:1;
}



* {
margin: 0;
padding: 0;
}
html{
margin:0px;
padding:0px;
}
body{
background:#ffffff;
text-align:center;
color:#000;
font-size: 16px;
line-height:2;
letter-spacing:1px;
font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
}

img{
border-style:none;
display:block;
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
}

a {
cursor:pointer;
color:#333;
text-decoration:none;
}
a:hover, a:focus {
text-decoration: none;
}

li{list-style:none;}

.bg_3f2d21{background-color:#3f2d21;}
.bg_f1f1ec{background-color:#f1f1ec;}

.contents_top{
line-height: 0;        /* 文字の行の高さを0にする */
font-size: 0;          /* 文字サイズも0にしておくとより確実 */
width:100%;
margin: -2.9% 0 0 0;
}
.contents_top img{
display: block;
width:100%;
}

.contents_bottom{
line-height: 0;        /* 文字の行の高さを0にする */
font-size: 0;          /* 文字サイズも0にしておくとより確実 */
width:100%;
margin: 0px 0 0 0;
}
.contents_bottom img{
display: block;
width:100%;
padding: 0px 0 0 0;
}


.box_in{
width:90%;
max-width:1200px;
padding:5% 0;
margin: 0px auto;
text-align: left;
}
.box_in_x{
width:100%;
padding:5% 0;
margin: 0px auto;
text-align: left;
position: relative;
}

.bg_cv{
background-image:url("../images/cv_bg.jpg");
background-repeat:no-repeat;
background-size:cover;
background-position:bottom center;
background-attachment: fixed;
margin: -2.88% 0 0 0; /*ちらつき防止*/
padding:0 0 0 0;
z-index: -1;
}

.page_box{
width:100%;
padding:5% 0 2.5% 0;
}


/* ---Header----*/

#header {
background-color:#fff;
width:100%;
height: 105vh;
max-width:2560px;
margin:0 auto;
background-image:url("../images/mv_bg.jpg");
background-repeat:no-repeat;
background-size:cover;
background-position:center center;
background-attachment: fixed;
}
#header_low {
background-color:#fff;
width:100%;
max-width:2560px;
margin:0 auto;
}
.header_in{
width:100%;
max-width:2560px;
margin: 0px auto;
padding:0px 0px 0px 0px;

}

.header_top{
display:flex;
justify-content:space-between;
align-items:flex-start;
width:100%;
margin: 0px auto 0px auto;
padding:30px 50px 50px;
background-image:url("../images/header_top_bg.png");
background-repeat:no-repeat;
background-size:cover;
background-position:bottom center;
box-sizing: border-box;

}

#header_low {
width:100%;
max-width:2560px;
margin:0 auto;
overflow:hidden;
}
.header_in_low{
position:relative;
width:1200px;
height:200px;
margin: 0px auto;
padding:0px 0px 0px 0px;
}


.nav_list{
width: 33.3%;
display: flex;
gap: 10px;
align-items: flex-start;
}

.nav_list li{
writing-mode: vertical-lr;
text-orientation: upright;
display: inline-block;
letter-spacing: 5px;
font-size: 14px;
line-height: 14px;
font-weight: 500;
}

.slide-bg {
position: relative;
display: inline-block;
padding: 3px 10px;
color: #fff;
text-decoration: none;
overflow: hidden;
z-index: 0;
}

.slide-bg::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 0;              /* ← 高さゼロから */
background: #fff;       /* 好きな色に変更OK */
opacity: 0;             /* ← 最初は透明 */
transition:
height 0.7s ease,
opacity 0.7s ease;    /* ← フェードイン */
z-index: -1;
}

.slide-bg:hover::before {
height: 100%;   /* ← 上 → 下に広がる */
opacity: 1;    /* ← ふわっと現れる */

}
.slide-bg:hover{
color: #3f2d21;
}



/* サイトロゴ */
.h_logo{
display:flex;
align-items:center;
text-align:left;
width: 33.3%;
margin:0px auto;
padding:0px 0px;
}
.h_logo a{
margin:0px auto;
}
.h_logo img{
width:145px;
margin: 0px 0px 0px 0px;
}
.h_logo h1{
font-size:14px;
color:#fff;
font-weight:normal;
}

.h_links{
width: 33.3%;
margin: 0px 0px 0px 0px;
display:flex;
align-items:center;
justify-content: flex-end;
}

.h_tel{
margin: 0 auto;
text-align: center;
}

.h_tel p{
text-align: center;
margin: 0 auto;
}
.h_tel p span{
text-align: center;
font-size:12px;
line-height:12px;
font-weight:500;
color:#ffffff;
letter-spacing:1px;
}
.h_tel div{
line-height:36px;
display:flex;
align-items:center;
font-size:36px;
letter-spacing: 2px;
font-family: 'arial',sans-serif;
font-weight:600;
color:#ffffff;
}
.h_tel div img{
width: 30px;
margin: 0px 10px 0px 0px;
}

.h_sns{
display:flex;
align-items:center;
justify-content: flex-end;
margin: 0;
text-align: center;
}

.h_sns p{width: 30px;margin: 10px 0 0 10px;}
.h_sns p img{width: 100%;}
.h_sns a{
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}
.h_sns a:hover{opacity:0.6; }

.s-fade-wrap{
width:100%;
max-width:2560px;
position:relative;
}
.mv_view{
padding:0;
margin: 0 auto;
}

.mv_none{
height:5px;
}


/* ---title---*/

.title_text_c01{
text-align:center;
padding:0px 0 0 0;
}
.title_text_c01 h2 {
position: relative;
display: inline-block;
padding:0px 0px;
text-align:center;
font-size:36px;
line-height:36px;
letter-spacing: 5px;
font-weight:600;
color:#fff;
font-family:
"Hiragino Mincho ProN",   /* macOS */
"Hiragino Mincho Pro",
"MS PMincho",             /* Windows（明朝）*/
"MS Mincho",
"Yu Mincho",              /* Windows 10 以降 */
"YuMincho",
"Noto Serif JP",          /* Android / Web用 */
serif;                    /* 最終的に明朝系に寄せる */
}

.title_text_c01 span{
width: 8%;
display: block;
margin: 25px auto 0px auto;
}
.title_text_c01 span img{
width: 100%;
}


.title_text_c02{
text-align:center;
padding:0px 0 0 0;
}
.title_text_c02 h2 {
position: relative;
display: inline-block;
padding:0px 0px;
text-align:center;
font-size:36px;
line-height:36px;
letter-spacing: 5px;
font-weight:600;
color:#000;
font-family:
"Hiragino Mincho ProN",   /* macOS */
"Hiragino Mincho Pro",
"MS PMincho",             /* Windows（明朝）*/
"MS Mincho",
"Yu Mincho",              /* Windows 10 以降 */
"YuMincho",
"Noto Serif JP",          /* Android / Web用 */
serif;                    /* 最終的に明朝系に寄せる */
}

.title_text_c02 span{
width: 8%;
display: block;
margin: 25px auto 0px auto;
}
.title_text_c02 span img{
width: 100%;
}


.title_text_low01{
text-align:left;
padding:10px 0;
border-bottom: 3px dotted #000;
vertical-align:baseline;
margin: 5% 0 2.5% 0;
}
.title_text_low01 h3 {
text-align:left;
font-size:30px;
line-height:1.7;
letter-spacing: 5px;
font-weight:500;
color:#000;
}
.title_text_low01 img{
vertical-align: text-top;
display: inline-block;
height: 30px;
margin: 0 15px 0 0px;
}


.low_sub_title_text h2{
  position: relative;
  padding: 8px 16px;
  font-size: 24px!important;
  line-height: 1.7;
  letter-spacing: 0.1em;
  color: #333;
  font-weight: 600;
  display: block;
  box-sizing: border-box;
  text-align:center; 
  margin: 40px 24px 24px 24px;
  max-width: 550px;
  margin-inline: auto;
  font-family:
"Hiragino Mincho ProN",
"Hiragino Mincho Pro",
"Yu Mincho",
"YuMincho",
"Noto Serif JP",
serif;
}

.low_sub_title_text h2::before, .low_sub_title_text h2::after {
  content:'';
  position: absolute;
  width: 30px;
  height: 30px;
}

.low_sub_title_text h2::before {
  border-left: solid 1px #333;
  border-top: solid 1px #333;
  top:0;
  left: 0;
}

.low_sub_title_text h2::after {
  border-right: solid 1px #333;
  border-bottom: solid 1px #333;
  bottom:0;
  right: 0;
}

.low_sub_title_text h2 span:before, .low_sub_title_text h2 span:after {
  content:'';
  position: absolute;
  width: 46px;
  height: 46px;
  rotate: 45deg;
}

.low_sub_title_text h2 span:before {
  border-left: solid 1px #333;
  top:2px;
  left: 2px;
}

.low_sub_title_text h2 span:after {
  border-right: solid 1px #333;
  bottom:2px;
  right: 2px;
}


/* ---t_message---*/

.t_message{
width: 100%;
max-width:1100px;
display:flex;
justify-content:space-between;
margin:20px auto 70px auto;
}

.t_message_in01{
display:flex;
flex-flow: row-reverse;
margin:0px 0 70px 0;
}
.t_message_in01 h3{
margin: 0 0 0 50px;
padding:0px;
font-size:42px;
line-height:1.5;
letter-spacing: 7px;
font-weight:600;
color:#fff;
font-family:
"Hiragino Mincho ProN",   /* macOS */
"Hiragino Mincho Pro",
"MS PMincho",             /* Windows（明朝）*/
"MS Mincho",
"Yu Mincho",              /* Windows 10 以降 */
"YuMincho",
"Noto Serif JP",          /* Android / Web用 */
serif;                    /* 最終的に明朝系に寄せる */
writing-mode: vertical-rl;
text-orientation: upright;
}
.t_message_in01{width:30%;}
.t_message_in01 p{
font-weight:400;
font-size:18px;
line-height:2;
margin:0px 0 0 0;
letter-spacing: 3px;
writing-mode: vertical-rl;
text-orientation: upright;
color:#fff;
}
.t_message_in01 p span{font-size:16px;}

.t_message_in02{
width:65%;
margin:0px 0 70px 0;
position: relative;
}

.t_message_view01 {
width:45%;
top:0;
right:0;
position: absolute;
}
.t_message_view01 img{
width:100%;
}

.t_message_view02 {
width:52%;
top:25%;
left:0;
position: absolute;
}
.t_message_view02 img{
width:100%;
}

.t_message_view03 {
width:40%;
top:65%;
right:8%;
position: absolute;
}
.t_message_view03 img{
width:100%;
}


/* ---t_service---*/
.t_service{
max-width:1100px;
margin:50px auto 50px auto;
}

.t_service_in{
max-width:1100px;
display:flex;
justify-content:space-between;
flex-wrap: wrap;
margin:0px auto 0px auto;
}

/* ▼ 通常状態 */
.t_service_in div {
width: 19%;
border: 5px solid #fff;
border-radius: 25px;
padding: 20px;
box-sizing: border-box;
margin: 0 0 20px 0;
transition: background-color 0.3s ease; /* ← これが重要 */
}

/* ▼ ホバーしたときの背景 */
.t_service_in div:hover {
background-color:#322218; /* ← 少し明るくなる */
}

/* ▼ 通常の画像 */
.t_service_in div img {
width: 90%;
margin: 0 auto;
transition: transform 0.3s ease;
}

/* ▼ ホバー時に画像を拡大 */
.t_service_in div:hover img {
transform: scale(1.08);
}

/* 枠内に収めたい場合はこの1行も有効 */
.t_service_in div {
overflow: hidden;
}


.t_service_in div img{
width: 90%;
margin:0px auto 0px auto;
}
.t_service_in div p{
text-align: center;
font-size: 18px;
line-height: 1.7;
letter-spacing: 1px;
font-weight: 500;
color:#fff;
margin:0px auto 0px auto;
}



/* ---t_price---*/
.t_price{
width: 70%;
background-color: #3f2d21;
border-radius: 35px;
margin: 50px auto;
padding: 15px;
box-sizing: border-box;
position: relative;
}

.t_price_icon{
width: 25%;
position: absolute;
top:-30px;
right: -30px;
}
.t_price_icon img{width:100%;}

.t_price_in{
width: 100%;
background-color: #3f2d21;
border: 2px solid #fff;
border-radius: 25px;
margin: 0px auto;
padding: 70px 10% 100px 10%;
box-sizing: border-box;
text-align: center;
display: flex;
justify-content: center;
align-items:flex-end;
}
.t_price_in_in01{
width: 45%;
}
.t_price_in_in02{
width: 5%;
}

.t_price_in p{
color:#fff;
font-size: 22px;
line-height:1.5;
}
.t_price_in p span{font-size: 18px;}


.t_price_in h3{
letter-spacing: 3px;
font-size: 32px;
line-height: 32px;
font-weight: 400;
color:#fff;
padding:20px 0 0px 0;
margin: 0px auto 0 auto;

}
.t_price_in h3 span{
font-size: 48px;
font-weight: 400;
}


/* ---card---*/

/* 外枠：横スクロール防止 */
.swiper-area {
width: 100%;
overflow-x: hidden;
overflow-y: visible;
position: relative;
margin: 50px 0;
}

/* Swiper 本体（左右チラ見せ用） */
.mySwiper {
width: calc(100% + 25%);
position: relative;
left: 50%;
transform: translateX(-50%);
overflow: visible !important;
}

/* スライド自体に上下の余白を持たせる */
.swiper-slide {
padding: 15px 0;            /* ← これが「ズームの逃げ場」になる */
box-sizing: border-box;
overflow: visible;
}

.card {
width: calc(33.3% - 15px);
background-color: #ffffff;
border-radius: 30px;
padding: 25px;
box-sizing: border-box;
overflow: hidden;
transition: background-color 0.3s ease !important;   /* ← 強制的に有効にする */
}

.card:hover {
background-color: #f3e9dd !important;   /* ← テスト用に極端な色で */
}

/* 中身レイアウトは今までのまま */
.card-inner {
display: flex;
gap: 25px;
align-items: flex-start;
text-decoration: none;
color: inherit;
}

/* 正方形の箱 */
.card-thumb{
width: 45%;
aspect-ratio: 1 / 1;
border-radius: 20px;
overflow: hidden;
flex-shrink: 0;
}

/* 中のimgを箱いっぱいにしてトリミング */
.card-thumb img{
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block;
}

/* テキストブロック */
.card-body {
flex: 1;
min-width: 0;
}

.card-cat {
background-color: #593c28;
font-size: 12px;
line-height: 12px;
color: #fff;
font-weight: 400;
display:inline-block;
padding: 7px 10px;
margin-bottom: 8px;
border-radius:5px;
}

.card-title {
font-size: 18px;
font-weight: 600;
margin-bottom: 8px;
line-height: 1.5;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2; /* ← ★ ここで行数制限 */
}

.card-text {
font-size: 14px;
color: #555;
line-height: 1.6;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 5; /* ← ★ 行数指定 */
}


/* セクション内で中央寄せ */
.news-more {
text-align: center;
margin-top: 40px;
}

/* ボタン本体 */
.btn-more {
position: relative;
display: inline-block;
padding: 14px 90px;               /* 横幅はお好みで調整 */
border-radius: 999px;
border: 5px solid #5b3a28;        /* 太めの茶色枠 */
background-color: transparent;
color: #5b3a28;
font-size: 18px;
letter-spacing: 1px;
text-decoration: none;

transition:
background-color 0.3s ease,
color 0.3s ease,
border-color 0.3s ease,
transform 0.3s ease;
}

/* 右側に突き出す細い線（ボタン枠とつながる） */
.btn-more::after {
content: "";
position: absolute;
top: 50%;
left: calc(100% - 25px);           /* 枠線(3px)と少し重ねる */
transform: translateY(-50%);
width: 50px;                      /* 線の長さ */
height: 1px;
background-color: #5b3a28;
pointer-events: none;

transition:
width 0.3s ease,
background-color 0.3s ease;
}

/* ▼ ホバーアニメーション */
.btn-more:hover {
background-color: #5b3a28;        /* 中を塗る */
color: #ffffff;                   /* 文字を白に */
border-color: #5b3a28;
transform: translateY(-1px);      /* ほんの少しだけ浮かせる（お好みで） */
}

.btn-more:hover::after {
width: 80px;                      /* 線が少し伸びる演出 */
background-color: #fff;
}

/* セクション内で中央寄せ */
.faq-more {
text-align: center;
margin-top: 40px;
}

/* ボタン本体 */
.btn-more-w {
position: relative;
display: inline-block;
padding: 14px 90px;               /* 横幅はお好みで調整 */
border-radius: 999px;
border: 5px solid #fff;        /* 太めの茶色枠 */
background-color: transparent;
color: #fff;
font-size: 18px;
letter-spacing: 1px;
text-decoration: none;

transition:
background-color 0.3s ease,
color 0.3s ease,
border-color 0.3s ease,
transform 0.3s ease;
}

/* 右側に突き出す細い線（ボタン枠とつながる） */
.btn-more-w::after {
content: "";
position: absolute;
top: 50%;
left: calc(100% - 25px);           /* 枠線(3px)と少し重ねる */
transform: translateY(-50%);
width: 50px;                      /* 線の長さ */
height: 1px;
background-color: #fff;
pointer-events: none;

transition:
width 0.3s ease,
background-color 0.3s ease;
}

/* ▼ ホバーアニメーション */
.btn-more-w:hover {
background-color: #fff;        /* 中を塗る */
color: #5b3a28;                   /* 文字を白に */
border-color: #fff;
transform: translateY(-1px);      /* ほんの少しだけ浮かせる（お好みで） */
}

.btn-more-w:hover::after {
width: 80px;                      /* 線が少し伸びる演出 */
background-color: #5b3a28;
}


/* ---t_area---*/
.title_left_box{
display:flex;
justify-content:space-between;
width: 100%;
max-width:1100px;
margin: 40px auto 40px auto;
}

.title_text_c03{
text-align:center;
padding:0px 0 0 0;
margin: 0;
}
.title_text_c03 p{
display: inline-block;
vertical-align: top;
text-align:right;
font-size:18px;
line-height:18px;
letter-spacing: 5px;
font-weight:400;
color:#593c28;
writing-mode: vertical-rl;
margin: 0 0 0 10px;
}
.title_text_c03 h2{
display: inline-block;
vertical-align: top;
padding:0px 0px;
text-align:right;
font-size:36px;
line-height:36px;
letter-spacing: 5px;
font-weight:600;
color:#000;
font-family:
"Hiragino Mincho ProN",   /* macOS */
"Hiragino Mincho Pro",
"MS PMincho",             /* Windows（明朝）*/
"MS Mincho",
"Yu Mincho",              /* Windows 10 以降 */
"YuMincho",
"Noto Serif JP",          /* Android / Web用 */
serif;                    /* 最終的に明朝系に寄せる */
writing-mode: vertical-rl;
}
.t_area{width: 80%;}
.t_area img{width:100%;}


.t_area_bottom{
color:#cc0000;
width: 100%;
max-width:1100px;
margin: 0px auto 40px auto;
}


/* ---faq---*/
.faq{
max-width:1100px;
margin:50px auto 50px auto;
list-style:none;

}
.faq li{
padding:20px 0px 20px 0px;
}
.faq h3{
display:flex;
align-items:center;
padding:15px 0px;
margin:0 auto;
line-height:1.7;
text-align:left;
font-size:18px;
font-weight:500;
color:#fff;
border-bottom:2px dotted#fff;
}
.faq p{
display:flex;
align-items:center;
text-align:left;
margin:0 auto;
font-size:16px;
line-height:1.7;
padding:15px 0px;
color:#fff;
}
.faq h3 img{
width:50px;
margin:0 20px 0 0;
}
.faq p img{
width:50px;
margin:0 20px 0 0;
}

.faq a{
text-decoration: underline;
color:#fff;
}



/* ---f_cv---*/

.f_cv{
width: 100%;
margin: 50px auto;
text-align: center;
}

.f_cv h2{

text-align:center;
font-size:30px;
line-height:30px;
letter-spacing: 3px;
font-weight:500;
color:#ffff;
font-family:
"Hiragino Mincho ProN",   /* macOS */
"Hiragino Mincho Pro",
"MS PMincho",             /* Windows（明朝）*/
"MS Mincho",
"Yu Mincho",              /* Windows 10 以降 */
"YuMincho",
"Noto Serif JP",          /* Android / Web用 */
serif;                    /* 最終的に明朝系に寄せる */
padding:0 0 40px 0;
}


.f_tel{
margin: 0 auto;
text-align: center;
}

.f_tel p{
display: inline-block;
border-top: 2px dotted #fff;
text-align: center;
margin: 0 auto;
padding:40px 0 0 0;

}
.f_tel p span{
text-align: center;
font-size:14px;
line-height:14px;
font-weight:500;
color:#ffffff;
letter-spacing:1px;
}
.f_tel div{
line-height:46px;
display:flex;
align-items:center;
justify-content: center;
font-size:46px;
letter-spacing: 2px;
font-family: 'arial',sans-serif;
font-weight:600;
color:#ffffff;
margin: 0 auto;
}
.f_tel div img{
width: 40px;
margin: 0px 10px 0px 0px;
}


.f_btn{
display:flex;
align-items:center;
justify-content: center;
text-align:center;
width:100%;
margin:40px auto 20px auto;
}

.f_btn_mail{
width:30%;
margin: 0 2.5%;
}
.f_btn_line{
width:30%;
margin: 0 2.5%;
}
.f_btn a{
font-size:20px;
display:flex;
align-items:center;
justify-content: center;
width:100%;
border: 5px solid #fff;
border-radius: 100px;
padding: 22.5px 0;
color:#fff;
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
box-sizing: border-box;
}
.f_btn a img{
width: 35px;
margin: 0 0 0 10px;
}

.f_btn a:hover{
border: 5px solid #3f2d21;
background-color: #3f2d21;
color:#fff;
transform: scale(1.03);
}


/* ---f_link---*/
.f_link{
width: 100%;
margin: 0px auto;
text-align: center;
}
.f_link h2{
text-align:center;
font-size:26px;
line-height:26px;
letter-spacing: 3px;
font-weight:600;
color:#000;
font-family:
"Hiragino Mincho ProN",   /* macOS */
"Hiragino Mincho Pro",
"MS PMincho",             /* Windows（明朝）*/
"MS Mincho",
"Yu Mincho",              /* Windows 10 以降 */
"YuMincho",
"Noto Serif JP",          /* Android / Web用 */
serif;                    /* 最終的に明朝系に寄せる */
padding:0 0 40px 0;
}

/* 外枠：画面いっぱい＋はみ出し隠し */
.flow-carousel {
width: 100%;
padding: 20px 0 40px 0;
overflow: hidden;
}

/* 流れるレーン本体（中身2セットぶんを横に並べる） */
.flow-track {
display: flex;
width: max-content;                 /* 中身の幅にフィット */
animation: marquee 30s linear infinite;
will-change: transform;
transform: translateZ(0);
}

/* 各リンクアイテム */
.flow-item {
flex: 0 0 auto;
width: 260px;                       /* 画像幅（整数で） */
margin-right: 24px;                 /* 画像の間隔 */
text-decoration: none;
}

.flow-item img {
display: block;
width: 100%;
height: auto;
}

/* 無限ループアニメ：2セット分のうち1セットぶん左へ */
@keyframes marquee {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-50%);
}
}

.flow-item img {
display: block;
width: 100%;
transition: transform 0.4s ease, opacity 0.4s ease;
opacity: 0.9;
}

.flow-item:hover img {
transform: scale(1.03);
opacity: 1;
}



/* ---pp---*/
.pp_top_text{
text-align: center;
}
.pp_top_text p{
font-size: 16px;
text-align: center;
}
.pp{
width:100%;
padding:0px 0px 0px 0px;
margin:30px auto 0px auto;
list-style:none;
}
.pp p{
text-align:left;
margin:0 auto;
font-size:15px;
line-height:1.7;
padding:20px;
}
.pp p span{color:red;font-size:13px;}
.pp ul{padding:20px;}
.pp ul li{font-weight: 600;}


/* ---company---*/
.company{
width:100%;
margin: 0 auto;
}

.company table{
width: 100%;
border-collapse:collapse;
border-spacing:0;
}
.company table th{
text-align: center;
border: 1px solid #47352a;
background-color: #c9b880;
color:#fff;
padding: 25px;
}
.company table td{
text-align: left;
border: 1px solid #47352a;
padding: 25px;
color:#000000;
}

/* ---sitemap---*/
.sitemap{
width:100%;
display: flex;
justify-content: space-between;
margin: 0 auto;
}

.sitemap_navi{
width:30%;
}

.sitemap_navi li{
width: auto;
}

.sitemap_navi li p{
vertical-align:middle;
text-align: left;
font-size: 16px;
line-height:1.5;
font-weight: 500;
padding:0 0 15px 0;
margin: 0 0 15px 0;
border-bottom: 1px solid #593c28;
}

.sitemap_navi li a p{
display: block;
color:#000000;
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}
.sitemap_navi li a p:hover{
color:#c9b880;
}


.sitemap_navi li img{
vertical-align:middle;
display: inline-block;
width: 20px;
margin: 0 10px 0 0;
}


.sitemap_navi li span{
display: inline-block;
text-align: left;
font-size: 14px;
padding:10px 0;
margin: 0 0 0 20px;
border-bottom: 1px solid #593c28;
}

.sitemap_navi li a span{
display: inline-block;
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
color:#000000;
}
.sitemap_navi li a span:hover{
color:#c9b880;
}


/* ---category_list---*/
.category_list{
padding:40px 0px 30px 0px;
}
.category_list table {
width: 100%;
border-collapse:collapse;
border-spacing:0;
}
.category_list th {
font-weight:400;
padding:0px 10px 40px 0px; 
} 
.category_list th  { width: 20%;padding:40px 10px 40px 10px;text-align: left; vertical-align:middle;border-bottom: 1px solid #88c0ea;}
.category_list td  {padding:40px 10px 40px 30px;text-align: left; vertical-align:middle;border-bottom: 1px solid #88c0ea; }
.category_list th p{
background-color:#3f2d21;
padding:10px 10px;
text-align: center;
color:#fff;
line-height:1.5;
font-size:14px;
}

/* ---category_list2---*/
.category_list2{
width: 100%;
padding:0px 0px 30px 0px;
display:flex;
display: -webkit-flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
.category_list2_box{
width: 45%;
}
.category_list2 table {
width: 100%;
border-collapse:collapse;
border-spacing:0;

}

.category_list2 th  { width: 20%;padding:25px 10px 25px 10px;text-align: left; vertical-align:top;border-bottom: 1px solid #88c0ea;}
.category_list2 td  {padding:25px 10px 25px 20px;text-align: left; vertical-align:top;border-bottom: 1px solid #88c0ea; }
.category_list2 th p{
background-color:#3f2d21;
padding:3px;
text-align: center;
color:#fff;
font-size:13px;
}
.category_list2_title_text h3{
text-align:left;
color:#3f2d21;
font-weight:600;
 font-size: 24px;
letter-spacing: 2px;
line-height:1.5;
padding:0 0 30px 0;
}
.category_list2_title_text h3 span{
color:#555;
font-weight:300;
 font-size: 12px;
letter-spacing: 0px;
}
.category_list2_btn{
 font-size: 13px;
text-align:right;
margin:20px 0 0 0;
}



/* ---page_in---*/
.page_in{
text-align:left;
max-width: 1000px;
padding:0px 0px 0 0px;
margin: 0 auto;
}


/* ---service---*/
.service_top_text{
text-align: center;
}
.service_top_text p{
font-size: 16px;
text-align: center;
}

.service_list{
margin: 3.5% 0 0 0;
}

.service_list_in{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.service_list_in div{
width: 47.5%;
border: 5px solid #593c28;
border-radius: 40px;
margin: 0 0 2.5% 0;
transition: background-color 0.3s ease;
}
.service_list_in div a{
display: block;
width: 100%;
text-align: center;
color:#47352a;
padding:5% 5% 10% 5%;
box-sizing: border-box;
}
.service_list_in div img{
width: 35%;
margin: 0 auto;
transition: transform 0.3s ease;
}
.service_list_in div h3{
color:#47352a;
font-size: 28px;
line-height:1.5;
text-align:center;
font-weight:600;
letter-spacing: 2px;
font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
margin: 1.5% 0 0 0;
}
.service_list_in div h4{
background-color:#47352a;
font-size: 16px;
line-height:40px;
text-align:center;
font-weight:500;
color:#fff;
letter-spacing: 2px;
margin: 2.5% 0 0 0;
}
.service_list_in div p{
font-size: 14px;
line-height:1.7;
text-align: left;
margin: 5% 0 0 0;
}
/* ▼ ホバーしたときの背景 */
.service_list_in div:hover {
background-color:#f2ece9; /* ← 少し明るくなる */
}
/* ▼ ホバー時に画像を拡大 */
.service_list_in div a:hover img {
transform: scale(1.08);
}
/* 枠内に収めたい場合はこの1行も有効 */
.service_list_in div{
overflow: hidden;
}


/* ---price---*/

.price_list{
margin:0 0 0;
}

.price_list_box01{
width: 100%;
display: flex;
align-items: center;
background-color:#f1f1ec;
border-radius: 10px;
padding:25px;
box-sizing: border-box;
margin: 0 0 3% 0;
}
.price_list_box01 img{
width:130px;
}
.price_list_box01 div{
margin: 0 0 0 30px;
}
.price_list_box01 div h4{
font-size: 30px;
line-height: 30px;
font-weight: 600;
}
.price_list_box01 div h5{
font-size: 27px;
line-height: 27px;
font-weight: 600;
margin: -15px 0 0 0;
}
.price_list_box01 div h5 span{
display: inline-block;
font-size: 60px;
line-height: 60px;
font-weight: 600;
letter-spacing: 2px;
font-family: 'arial',sans-serif;
margin: 0 10px 0 20px;
}
.price_list_box01 div p{
font-size: 14px;
line-height:1.7;
font-weight: 400;
margin:10px 0 0 0;
}


.price_list_in02{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.price_list_box02{
width: 48.5%;
display: flex;
background-color:#f1f1ec;
border-radius: 10px;
padding:25px;
box-sizing: border-box;
margin: 0 0 3% 0;
}
.price_list_box02 img{
width:130px;
}
.price_list_box02 div{
margin: 10px 0 0 30px;
}
.price_list_box02 div h4{
font-size: 22px;
line-height: 22px;
font-weight: 600;
}
.price_list_box02 div h5{
font-size: 20px;
line-height: 20px;
font-weight: 600;
margin: 5px 0 0px 0;
}
.price_list_box02 div h5 span{
display: inline-block;
font-size: 36px;
line-height: 36px;
font-weight: 600;
letter-spacing: 2px;
font-family: 'arial',sans-serif;
margin: 0 10px 0 20px;
}
.price_list_box02 div p{
font-size: 14px;
line-height:1.5;
font-weight: 400;
margin:10px 0 0 0;
}

.text-color-b03e3e{color:#b03e3e;}
.text-color-f0b333{color:#f0b333;}
.text-color-878883{color:#878883;}
.text-color-c47084{color:#c47084;}
.text-color-8da358{color:#8da358;}
.text-color-4695b7{color:#4695b7;}
.text-color-dc8540{color:#dc8540;}

.price_list_in03{
margin: 0 0 5% 0;
}
.price_list_in03 p{
font-size: 18px;
font-weight: 400;
}

.price_list_in03 p span{
color:#cc0000;
font-weight:600;
}


.price_list_in04 h4{
font-size: 24px;
font-weight: 500;
color:#000;
margin: 3% 0 1% 0;
}
.price_list_in04 h4 span{
color:#cc0000;
}

.price_list_box04{
background-color:#f4f1f1;
border-radius: 10px;
padding:40px 15px;
box-sizing: border-box;
margin: 0 0 5% 0;
text-align: center;
}
.price_list_box04_in{
display: flex;
align-items: center;
justify-content:center;
margin: 0 auto;
}

.price_list_box04_in div{
margin: 0 10px;
}
.price_list_box04_in_icon img{
width:  130px;
margin: 0 0 15px 0;
}
.price_list_box04_in_icon p{
font-size: 14px;
font-weight: 500;
line-height: 1.5;
color:#000;
}
.price_list_box04_in_icon p span{
font-size: 22px;
font-weight: 600;
line-height: 1.5;
color:#cc0000;
font-family: 'arial',sans-serif;
}
.price_list_box04_in_plus_equal{
font-size: 50px;
font-weight: 500;
line-height: 50px;
color:#000;
}

.price_list_box04_in_price{
font-size: 20px;
font-weight: 500;
line-height: 1.5;
color:#000;
}
.price_list_box04_in_price span{
color:#cc0000;
font-size: 50px;
font-weight:600;
line-height: 50px;
font-family: 'arial',sans-serif;
}


/* ---faq---*/
.faq_top_text{
text-align: center;
}
.faq_top_text p{
font-size: 16px;
text-align: center;
}

.faq-accordion{
  margin-top: 5%;
}

/* 大項目 */
.faq-group{
  margin: 2.5% 0 0 0;
}

.faq-group:last-child{
}

.faq-group__head{
  width: 100%;
  background: #f3f1f0;
  border: 0;
  padding:2.5% 3.5%;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 2px;
  color: #593c28;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  border-radius: 0;
}

/* 右の「∨」 */
.faq-group__icon{
  width:8px;
  height:8px;
  border-right: 3px solid #593c28;
  border-bottom: 3px solid #593c28;
  transform: rotate(45deg);
  transition: transform .25s ease;
  margin:0 0 0 12px;
  flex: 0 0 auto;
}

/* 開いた時 */
.faq-group.is-open .faq-group__icon{
  transform: rotate(-135deg);
}

/* ボディ（開閉部分） */
.faq-group__body{
  overflow: hidden;
  height: 0;
transition: height .45s ease;
  background: #f3f1f0;
}

/* 中のボックス（画像の薄い枠っぽい感じ） */
.faq-box{
  background: #f3f1f0;
  border-top: 0;
  padding:0 2.5% 0 2.5%;
}

/* Q&A（2枚並び風の仕切り） */
.qa{
  background: #fff;
  padding:1.5% 4%;
  margin: 0 0 2.5% 0;
}

.qa__row{
display: flex;
align-items: center;
padding:1.5% 0;
}

.qa__divider{
border-bottom: 3px dotted #000;
}

/* Q/Aバッジ（丸フチ） */
.qa__badge{
}
.qa__badge img{
width: 50px;
margin: 0 15px 0 0 ;

}


.qa__text{
font-size: 18px;
line-height: 1.7;
color:#000;
font-weight: 500;
}
.qa__text span{
font-size: 16px;
line-height: 1.7;
color:#000;
font-weight: 400;
}


/* ---line---*/

.line_top_text{
text-align: center;
}
.line_top_text p{
font-size: 16px;
text-align: center;
}

.line_box_in{
padding: 5%;
border-bottom: 1px solid #ccc;
}

.line_title p{
color:#47352a;
font-size:16px;
font-family: 'arial',sans-serif;
padding:0 0 5px 0;
}
.line_title h4{
font-size:28px;
line-height: 28px;
font-weight: 600;
letter-spacing: 2px;
font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
}
.line_reed{
font-size:16px;
margin: 5% 0 0 0;
}
.line_view{
margin: 5% 0 0 0;
}
.line_view img{
width:  150px;
}
.line_view p span{
display: inline-block;
background-color: #f3f1f0;
font-size:34px;
line-height: 34px;
font-weight: 500;
letter-spacing: 2px;
}


/* ---single---*/
.single_in{
text-align:left;
width: 1000px;
padding:0px 0px 5% 0px;
margin: 0 auto;
}
.single_in_data{
background-color:#3f2d21;
padding:10px 15px;
text-align: center;
border-radius: 5px;
color:#fff;
font-size:14px;
display:inline;
}
.single_in h1{
position: relative;
padding: 20px 25px 15px 25px;

outline: 1px solid #593c28;
font-size: 30px;
line-height: 1.7;
letter-spacing: 0.1em;
color: #593c28;
font-weight: 600;
display: block;
box-sizing: border-box;
text-align:left; 
margin: 24px 24px 5px 24px;
margin-inline: auto;
font-family:
"Hiragino Mincho ProN",   /* macOS */
"Hiragino Mincho Pro",
"MS PMincho",             /* Windows（明朝）*/
"MS Mincho",
"Yu Mincho",              /* Windows 10 以降 */
"YuMincho",
"Noto Serif JP",          /* Android / Web用 */
serif;                    /* 最終的に明朝系に寄せる */
}
.single_in h1::before {
content: "";
position: absolute;
top: -6px;
left: -6px;
width: 40px;
height: 40px;
background: #a89ec4;
clip-path: polygon(0 0, 100% 0%, 0 100%);
z-index:-999;
}

.single_in h1::after {
content: "";
position: absolute;
top: 6px;
left: 6px;
width: 100%;
height: 100%;
outline: 1px solid #593c28;
}




.single_in_box{
padding:30px 0px 30px 0px;
}
.single_in_box p{
margin:10px auto 20px auto;
}
.single_in_box img{
max-width: 100%;
height: auto;
}
img.alignright { display: block; margin: 40px 0 40px auto!important;}
img.alignleft { display: block; margin: 40px auto 40px 0!important;}
img.aligncenter { display: block; margin: 40px auto!important;}

.single_in_box_blockquote blockquote{
background-color:#fff;
padding:60px 60px 60px 60px;
position:relative;
color:#3f2d21;
margin:60px 0px 60px 0px;
}
.single_in_box_blockquote blockquote p{padding:15px 0px;}
.single_in_box_blockquote blockquote:before{
content:"“";
font-size:800%;
line-height:1.2;
font-family:"ＭＳ Ｐゴシック",sans-serif;
color:#3f2d21;
position:absolute;
left:0;
top:0;
}
.single_in_box_blockquote blockquote:after{
content:"”";
font-size:800%;
line-height:0em;
font-family:"ＭＳ Ｐゴシック",sans-serif;
color:#3f2d21;
position:absolute;
right:0;
bottom:0;
}
.single_in_box_ul01{
margin:20px 0px 50px 0px;
}
.single_in_box_ul01 li{
background-image: url(../images/single_list01_icon.png);
background-position: left center;
background-repeat: no-repeat;
text-align:left;
padding:5px 0px 5px 30px;
}
.single_in_box_ul01 li span{
font-weight:bold;
font-size:18px;
}

.bottom_box{
padding:0px 0px 100px 0px;
}

.text_bold{
font-weight: bold;
}

/* ---記事一覧---*/
.relatedposts{
max-width:1100px;
padding:0px 0px 0px 0px;
margin: 40px auto 0 auto;
display:flex;
display: -webkit-flex;
-webkit-justify-content: space-between;
justify-content: space-between;
flex-wrap: wrap;
}

.card02 {
width: 48.5%;
border: 5px solid #f3e9dd;
background-color: #ffffff;
border-radius: 30px;
padding: 25px;
box-sizing: border-box;
overflow: hidden;
margin: 0 0 3% 0;
transition: background-color 0.3s ease !important;   /* ← 強制的に有効にする */
}

.card02:hover {
background-color: #f3e9dd !important;   /* ← テスト用に極端な色で */
}




/* ---layout_table01---*/
.layout_table01{width:100%;margin:0px auto;}
.layout_table01 p{margin:0px 0px 40px 0px ;}
.layout_table01 table{
border-collapse:collapse;
border-spacing:0;
width:100%;
margin:0px auto 0 atuo;
}
.layout_table01 table th{
text-align:left;
vertical-align:middle;
background-color:#1474c1;
border: 1px solid #ecf3f5;
padding:30px;
color:#fff;
}
.layout_table01 table td{
text-align:left;
vertical-align:middle;
background-color:#fff;
border: 1px solid #ecf3f5;
padding:30px;
}

/* ---layout_table02---*/
.layout_table02{width:100%;margin:0px auto;}
.layout_table02 p{margin:0px 0px 40px 0px ;}
.layout_table02 table{
border-collapse:collapse;
border-spacing:0;
width:100%;
margin:0px auto 0 atuo;
}
.layout_table02 table th{
text-align:left;
vertical-align:middle;
background-color:#1474c1;
border: 1px solid #ecf3f5;
padding:30px;
color:#fff;
}
.layout_table02 table td{
text-align:left;
vertical-align:middle;
background-color:#fff;
border: 1px solid #ecf3f5;
padding:30px;
}

.low_title02 h3{
position: relative;
font-size:20px;
line-height: 1.5;
color:#3f2d21;
border-bottom: double;
border-width: 6px;
padding-bottom: 0px;
border-color:#3f2d21;
text-align:left;
margin:50px auto 30px auto;
padding:5px 0 5px 30px;
background-image:url("../images/sp_navi_icon.png");
background-repeat:no-repeat;
background-size:22px;
background-position:left center;
}

.low_title02 h4{
position: relative;
font-size:20px;
color:#3f2d21;
border-bottom: double;
border-width: 6px;
padding-bottom: 0px;
border-color:#3f2d21;
text-align:left;
margin:50px auto 30px auto;
padding:0 0 2px 25px;
}
.low_title02 h4::after {
position: absolute;
top:0.5em;
left:0;
z-index: 2;
content: '';
width: 15px;
height: 15px;
border: 2px solid #3f2d21;
border-radius: 100%
}

.low_title01 h4{
border-bottom:dashed 1px #3f2d21;
font-size:20px;
margin:50px auto 0px auto;
}

.low_title01 h5{
font-size:20px;
margin:50px auto 0px auto;
}

/* ---check_list01---*/
ul.check_list01 {
position: relative;
padding: 10px 30px;
background-color:#fff;
border:#ecf3f5 solid 2px;
list-style-type: none;
margin:60px auto;
}
ul.check_list01 li {
padding: 20px 20px 20px 40px;
line-height: 1.5;
color:#3f2d21;
font-weight: bold;
font-size:18px;
border-bottom: 1px dashed #3f2d21;
}
ul.check_list01 li::before {
position: absolute;
content: "\002713";
color: #3f2d21;
font-weight: bold;
left : 35px;
}
ul.check_list01 li:last-of-type {
border-bottom: none;
}


/* ---t_img_area---*/

.t_img_area{
width: 100%;
margin: 60px auto 30px auto;
}
.t_img_area_text{
float:left;
width: 50%;
}
.t_img_area_view{
float:right;
width: 45%;
margin: 0px auto 0px auto;
}
.t_img_area_text02{
float:right;
width: 50%;
}
.t_img_area_view02{
float:left;
width: 45%;
}
.t_img_area_text h4{
text-align:left;
font-size: 22px;
font-weight:normal;
color:#333;
padding:0px 20px 20px 0px;
margin: 0 0 0px 0 !important;
}
.t_img_area_text p{
text-align:left;
color:#333;
padding:0px 20px 20px 0px;
margin: 0px 0 0px 0 !important;
}
.t_img_area_text02 h4{
text-align:left;
font-size: 22px;
font-weight:normal;
color:#333;
padding:0px 0px 0px 20px;
margin: 0 0 0px 0 !important;
}
.t_img_area_text02 p{
text-align:left;
color:#333;
padding:0px 0px 20px 20px;
margin: 0px 0 0px 0 !important;
}
.t_img_area_view img{
width: 100%;
margin: 0 0 40px 0 !important;
}
.t_img_area_view02 img{
width: 100%;
margin: 0 0 40px 0 !important;
}

.t_img_area_view03{
width: 100%;
display: flex;
display: inline-flex;
}
.t_img_area_view03 div{
-webkit-justify-content: space-between; /* Safari */
justify-content:space-between;
}
.t_img_area_view03 div img{width: 100%;}



.pageNav01 {
margin: 0 0 10px;
padding: 50px 0px 0px;
text-align: center;
}
.pageNav01 li {
display: inline;
margin: 0 2px;
padding: 0;
}
.pageNav01 li span,
.pageNav01 li a {
color:#fff;
display: inline-block;
margin-bottom: 5px;
padding: 10px 17px;
background: #00876b;
text-decoration: none;
vertical-align: middle;
}
.pageNav01 li a:hover {
color:#fff;
background: #00b390;
border-color: #00f;
}

.pageNav02{
width: 100%;
max-width: 1000px;
margin: 0 auto;
font-size: 16px;
text-align:center;
color:#3f2d21;
padding: 30px 0px 30px 0px;
border-top: 1px solid #f0f1ec;
border-bottom: 1px solid #f0f1ec;
}
.pageNav03{
width: 100%;
max-width: 1000px;
margin: 0 auto;
font-size: 14px;
text-align:right;
padding: 40px 10px 10px 0px;
border-top: 1px solid #f0f1ec;
border-bottom: 1px solid #f0f1ec;
}

/* ---form---*/

.form_box{
width:100%;
padding:0px 0px 0px 0px;
margin: 0 auto;
}
.form_box table {
width: 100%;
border-collapse:collapse;
border-spacing:0;
}
.form_box th {
font-weight:400;
padding:45px 10px; border-bottom: 1px solid #eeeeee;
}
.form_box td  {padding:45px  10px; border-bottom: 1px solid #eeeeee; }

.form_box th  { width: 35%; text-align: left; vertical-align:top;}
.form_box td  {text-align: left; vertical-align:top; }

.form_01{
border:0;
padding:7px;
font-size:16px;
border:solid 1px #c78f7e;
margin:0 0 0px;
width:350px;
}
.form_02{
border:0;
padding:7px;
font-size:16px;
border:solid 1px #c78f7e;
margin:0 0 0px;
width:100%;
height:200px;
resize: vertical;
}
.form_03{
border:0;
padding:7px;
font-size:16px;
margin:0 0 0px;
width:100%;
height:100px;
resize: vertical;
}
.form_01:focus {
box-shadow: 0 0 15px #c78f7e;

}
.form_02:focus {
box-shadow: 0 0 15px #c78f7e;
}
.form_submit_area{
margin:60px auto 40px auto;
justify-content:space-between;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
}

.form_submit_area02{
margin:60px auto 40px auto;
}
.single_form_area{
margin:60px 0 40px 0;
}


/* ---form02---*/

.form_box02{
width: 90%;
padding:30px 0px 0px 0px;
margin: 0 auto;
}
.form_box02 table {
width: 100%;
border-collapse:collapse;
border-spacing:0;
}
.form_box02 th {
font-weight:400;
padding:25px 10px; border-bottom: 1px solid #f5f5f5;
}
.form_box02 td  {padding:25px  10px; border-bottom: 1px solid #f5f5f5; }

.form_box02 th  { width: 35%; text-align: left; vertical-align:top;}
.form_box02 td  {text-align: left; vertical-align:top; }

/* エラー個所をわかりやすく表示 */
.wpcf7 .wpcf7-not-valid { background: #ffb6c1; }
.wpcf7 span.wpcf7-not-valid-tip {font-size: 80%;}
.wpcf7 .wpcf7-response-output {text-align:center;margin: 10px 0 0; padding: 8px 35px 8px 14px; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
.wpcf7 .wpcf7-validation-errors {color: #B94A48; background-color: #F2DEDE; border: 1px solid #EED3D7;}
.wpcf7 .wpcf7-mail-sent-ok {color: #3A87AD; background-color: #D9EDF7; border: 1px solid #BCE8F1;}
.screen-reader-response{ color: #f00;}
/* 必須赤色表示 */
.wpcf7 .required { color: #f00;}
/* 任意緑色表示 */
.wpcf7 .any{ color: #080;}

/* Contact Form 7のラジオボタンを縦並びに */
.wpcf7-radio .wpcf7-list-item {
margin-top:10px;
display: block;
}
/*メールフォームrecaptcha中央配置*/
.wpcf7-recaptcha > div {
margin: 30px auto;
}
.recaptcha_box span{text-align:center;}

/************************************
ページネーション
************************************/
.og_page_navi{margin:50px 0 0 0; }
.og_page_navi ul{
clear:both;
padding:0px;
align-items: center;
justify-content: center;
-webkit-box-pack: center;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
}
.og_page_navi ul li{
vertical-align: middle;
margin:0px 5px;
}
.og_page_navi ul li a{
display:block;
color:#593c28;
padding: 8px 13px;
text-decoration: none;
border-radius: 10px;
}
.og_page_navi ul li a:hover {
color:#fff;
background: #593c28;
}
.og_page_navi .first{display:none;}
.og_page_navi .previous{}
.og_page_navi .current{background: #593c28;color:#fff;border-radius: 10px;}
.og_page_navi .current a{color:#fff;}
.og_page_navi .inactive{}
.og_page_navi .next{}
.og_page_navi .last{display:none;}

.og_page_navi ul li span{
font-size: 28px;
line-height:28px;
}

.page-numbers {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
color:#593c28;
display: inline-block;
margin-bottom: 5px;
padding: 10px 17px;
background: #0c68b1;
text-decoration: none;
vertical-align: middle;
}
.nav-below{
width:100%;
max-width: 1000px;
margin: 0 auto;
}
.nav-previous{font-size:14px;float:left;text-align:left;padding: 10px 0px 10px 0px;}
.nav-next{font-size:14px;float:right;text-align:right;padding: 10px 0px 10px 0px;}
.nav-below a{color:#3f2d21;}
.nav-below a:hover {text-decoration:underline;}




.area_view_box{position: relative;width: 100%;margin:2% auto 5% auto;text-align:center;}
.area_view img{width: 100%;margin: 0px auto;}
.area_view_banner_box{
width:85%;margin:0 auto;position: absolute;left: 0;right:0;bottom:10%;justify-content:space-between;-webkit-box-pack: center;display: -webkit-flex;
display: -moz-flex;display: -ms-flex;display: -o-flex;display: flex;}
.area_view_banner{width:50%;}
.area_view_banner img{width:100%;margin: 0px auto;}

/* ---flow---*/
.flow_box{position: relative;width: 100%;margin:2% auto 5% auto;}
.flow_box_view{text-align:center;}
.flow_box_view img{width: 100%;margin: 0px auto;}
.flow_box_btn{
width:45%;
margin:0 auto;
position: absolute;
left: 0;
right: 0;
top:9%;
}
.flow_box_btn img{width:100%;margin: 0px auto;}


/* 要約 */
.in_summary_box{
width: 100%;
position: relative;
display: inline-block;
margin:0px auto 20px auto;
}

/* 要約の背景 */
.in_summary_box:before {
content: '';
position: absolute;
display: inline-block;
z-index: 0;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color:#fff;
border: 3px solid #3f2d21;
border-radius: 10px 0 10px 10px;
clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 30px, 100% 100%, 0 100%);
}

/* 右上角のめくれ */
.in_summary_box:after {
content: '';
position: absolute;
display: inline-block;
z-index: 0;
top: 0%;
right: 0%;
height: 30px;
width: 30px;
background-color:#3f2d21;
clip-path: polygon(0 0, 0% 100%, 100% 100%);
}
.in_summary_box_in{
padding: 30px;
position: relative;
z-index: 1;
}

.in_summary_title{
text-align: center;
margin: 0 auto;
}
.in_summary_title span{
font-size:24px;
letter-spacing: 2px;
font-weight: 600;
line-height: 1.5;
color:#3f2d21;
position: relative;
text-align: center;
padding: 0 38px;
margin: 0 auto;
font-family:
"Hiragino Mincho ProN",   /* macOS */
"Hiragino Mincho Pro",
"MS PMincho",             /* Windows（明朝）*/
"MS Mincho",
"Yu Mincho",              /* Windows 10 以降 */
"YuMincho",
"Noto Serif JP",          /* Android / Web用 */
serif;                    /* 最終的に明朝系に寄せる */
}
.in_summary_title span:before, .in_summary_title span:after {
content: '';
position: absolute;
top: 50%;
display: inline-block;
width: 32px;
height: 3px;
background-color:#3f2d21;
}
.in_summary_title span:before {
left:0;
transform: rotate(60deg);
}
.in_summary_title span:after {
right: 0;
transform: rotate(-60deg);
}


.in_summary_reed{
border-top:5px dotted #3f2d21;
text-align: left;
font-size:16px;
color:#555;
margin: 20px auto 0px auto;
padding: 20px 0 0 0;
}


.countdown{
text-align: center;
}
.countdown div{
padding:10px 15px;
font-weight: 600;
text-align: center;
display:block;
border: 2px dotted #3f2d21;
border-radius: 5px;
margin:0px auto 40px auto;
}


/* ---ブログカード---*/
.blogcard {
line-height: 1;
background-color: #ffffff;
border: 3px solid #8d7c71;
word-wrap: break-word;
margin: 30px 0;
border-radius: 10px;
padding: 20px;
}
.blogcard a {
text-decoration: none;
opacity: 1;
transition: all 0.2s ease;
display: flex;
align-items: center;
flex-wrap:nowrap;
justify-content:space-between;
}
.blogcard a:hover {
opacity: 0.6;
}
.blogcard_thumbnail {
width:100px;
padding: 0px;
margin:0 20px 0 0px;
}
.blogcard_thumbnail img{
min-width:100px;
padding: 0px;
flex-shrink: 0;
}
.blogcard_content{
}
.blogcard_title {
font-size: 20px;
font-weight: bold;
line-height: 1.4;
}
.blogcard_excerpt {
font-size: 16px;
line-height: 1.6;
margin:10px 0 0 0;
}


/* モーダルCSS */
.modalArea {
display: none;
position: fixed;
z-index: 999; /*サイトによってここの数値は調整 */
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.modalBg {
width: 100%;
height: 100%;
background-color: rgba(30,30,30,0.9);
}

.modalWrapper {
position: absolute;
top: 50%;
left: 50%;
transform:translate(-50%,-50%);
width: 70%;
max-width: 620px;
padding: 30px;
background-color: #fff;
}

.closeModal {
position: absolute;
top: 0.5rem;
right: 1rem;
cursor: pointer;
}


.t_tag_box{
padding:30px;
margin: 40px 0 0 0;
text-align:center;
background-color:#eee;
position:relative;
}
.t_tag_box h3{
padding:0px 0px 10px 0px;
font-weight:600;
letter-spacing:2px;
text-align:center;
margin: 0px auto;
}
.tag_list_btn{
position:absolute;
top:35px;
right:30px;
display:inline-block;
background-color:#3f2d21;
border-radius:100px;
padding:8px 16px;
font-size:14px;
line-height:14px;
}
.tag_list_btn a{color:#fff;}
.t_tag_box ul{
display: flex;
flex-wrap: wrap;
align-items:flex-start;
justify-content:center;
padding:10px 0px 0px 0px;
margin: 0px auto;
text-align:center;
}
.t_tag_box ul li{text-align:center;padding:5px 10px;}
.t_tag_box ul li a{color:#3f2d21;}

.single_in_data02{
padding: 5px 0;
}
.single_in_data02 a{
color:#3f2d21;
text-decoration:underline;
}


/* 目次ショートコード  */
.toc {
position: relative;
margin:20px 0 50px 0 ;
background: #fff;
padding: 20px 30px;
word-break: break-all;
word-wrap: break-word;
border: 1px solid #ececec;
}
.toc-title {
text-align:left;
font-size: 18px;
line-height:18px;
letter-spacing: 3px;
margin: 0 0 0 0;
font-weight: bold;
padding:0 0 10px 0;
border-bottom: 1px solid #ececec;
}
.toc-toggle {
letter-spacing: 1px;
font-size:12px;
}
.toc-list {
padding: 9px;
list-style: none;
line-height:2;
}
.toc-list ul {
list-style: square;
margin:0 0 0 10px;
}
.toc-list a{}
.toc-list a:hover {text-decoration:underline;}



/* 執筆者一覧*/
.list-of-authors{
max-width: 1100px;
margin: 0 auto;
}

.profile_x{
background-color: #fff;
padding: 20px;
display: flex;
align-items: center;
border: double 3px #3f2d21;
border-radius: 10px;
margin: 0px auto 30px auto;
}
.profile_image_x {
text-align: center;
padding-right: 14px;
}
.profile_image_x img {
max-width: 80px;
border-radius: 100%;
padding: 1px;
}
.profile_text_name_x {
font-weight: bold;
margin: 0 0 5px 0 !important;
}
.profile_text_description_x {
font-size: .8em;
margin: 0!important;
}
.profile_x a{
text-decoration:underline;
color:#3f2d21;
}
.profile_x a:hover {
text-decoration:none;
color:#3f2d21;
}



/* ---footer---*/


.footer{
width:100%;
margin:0px auto 0 auto;
text-align:center;
padding:60px 0 60px 0;
}
.footer_in{
display: flex;
justify-content: space-between;
width:90%;
max-width:1100px;
margin:0 auto;
padding:0;
}

.f_logo_box{width: 30%;}
.f_logo{
width:150px;
margin:0;
padding:0;
}
.f_logo img{width:100%;}

.f_copy{text-align:center;;padding:30px 0 0px 0;}
.f_copy_in{

}
.f_copy p{
text-align:left;
font-size:14px;
color:#fff;
margin:0px 0;
}

.f_copy p span{
display: block;
font-size:12px;
margin:30px 0 0 0 ;
}

.f_navi_box{
width: 65%;
display: flex;
justify-content: space-between;
}


.f_navi li{
width: auto;
}

.f_navi li a{
display: block;
color:#fff;
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}
.f_navi li a:hover{
color:#eae0ac;
}


.f_navi li img{
display: inline-block;
vertical-align:baseline;
width: 15px;
margin: 0 10px 0 0;
}

.f_navi li p{
text-align: left;
font-size: 16px;
line-height:1.5;
padding:8px 0;
}
.f_navi li span{
display: block;
text-align: left;
font-size: 14px;
padding:2px 0;
}



#pageTop {
position:fixed;
bottom:65px;
left:0;
right:0;
width:20px;	
margin:0px auto 0px auto;
}
#pageTop a img {
width:100%;
margin:0px auto 0px auto;
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}
#pageTop a img:hover {
opacity: 0.7;
}


.fuwatAnime {
-webkit-animation-fill-mode:both;
-ms-animation-fill-mode:both;
animation-fill-mode:both;
-webkit-animation-duration:1.5s;
-ms-animation-duration:1.5s;
animation-duration:1.5s;
-webkit-animation-name: fuwatAnime;
-ms-animation-name: fuwatAnime;
animation-name: fuwatAnime;
visibility: visible !important;
}
@-webkit-keyframes fuwatAnime {
0% { opacity: 0; -webkit-transform: translateY(-20px); }
100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fuwatAnime {
0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}



.pc-none{
display:none !important;
}
.sp-br{
display:none !important;
}
.link_sp{
display:none !important;
}
.contact_btn_sp{
display:none !important;
}
#navToggle{
display:none !important;
}

.mt80{margin-top:80px;}




/* ---contact---*/

.contact_box{
width: 100%;
max-width: 1100px;
margin:70px auto;
padding:35px 55px ;
background-color:#ededed;
box-sizing: border-box;
border-radius: 5px;
}


.contact_box table {
width: 100%;
border-collapse:collapse;
border-spacing:0;
}
.contact_box th {
font-weight:400;
padding:45px 0px;
border-bottom: 1px solid #cccccc;
}
.contact_box th span{color:red;font-size:12px;}
.contact_box td  { padding:45px 0px 45px 30px;border-bottom: 1px solid #cccccc;}

.contact_box th  { width: 30%; text-align: left; vertical-align:top;}
.contact_box td  {text-align: left; vertical-align:top; }

.form_01{
border:0;
padding:7px;
font-size:18px;
border:solid 1px #dedede;
margin:0 0 0px;
width:450px;
}
.form_02{
border:0;
padding:7px;
font-size:18px;
border:solid 1px #dedede;
margin:0 0 0px;
width:80%;
height:200px;
resize: vertical;
}
.form_01:focus {
box-shadow: 0 0 15px #dedede;

}
.form_02:focus {
box-shadow: 0 0 15px #dedede;
}
.form_03 label{
margin:0 20px 0 0;
}
.form_03 label input{
margin:0 5px 0 0;
}


.cp_ipselect {
overflow: hidden;
width: 40%;
margin: 0;
text-align: center;
}
.cp_ipselect select {
width: 100%;
padding-right: 1em;
cursor: pointer;
text-indent: 0.01px;
text-overflow: ellipsis;
border: none;
outline: none;
background: transparent;
background-image: none;
box-shadow: none;
-webkit-appearance: none;
appearance: none;
}
.cp_ipselect select::-ms-expand {
display: none;
}
.cp_ipselect.cp_sl01 {
position: relative;
border: 1px solid #bbbbbb;
border-radius: 2px;
background: #ffffff;
}
.cp_ipselect.cp_sl01::before {
position: absolute;
top: 0.8em;
right: 0.9em;
width: 0;
height: 0;
padding: 0;
content: '';
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid #666666;
pointer-events: none;
}
.cp_ipselect.cp_sl01 select {
padding: 8px 38px 8px 8px;
color: #666666;
}
.cp_radio_text{
display:inline-block;
margin:0 20px 0 10px;
}

.contact_btn_box{
width: 76%;
display:flex;
margin: 70px auto 40px auto;
}

.btn_r{
color:#fff;
width: 50%;
text-align: center;
display: block;
padding:25px 45px;
font-size: 18px;
letter-spacing: 2px;
margin: 0px auto 0px auto;
border-radius: 10px;
background-color:#cb0506;
border:none;
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
cursor:pointer ; 
}
.btn_r:hover {
cursor:pointer ; 
color:#fff;
background-color:#810404;
}

.btn_f{
font-size:16px;
color:#fff;
width: 45%;
text-align: center;
display: block;
padding:25px 0;
margin: 0px auto 0px auto;
border-radius:100px;
background-color:#3f2d21;
border: 2px solid #3f2d21;
-webkit-transition: 0.3s ease-in-out;
   -moz-transition: 0.3s ease-in-out;
     -o-transition: 0.3s ease-in-out;
        transition: 0.3s ease-in-out;
cursor:pointer ; 
}
.btn_f:hover {
cursor:pointer ; 
opacity: 0.7;
}


.pankuzu{
width:100%;
padding:10px 0;
}
.pankuzu_in{
color:#333;
font-size:12px;
width:1100px;
margin: 0px auto 0px auto;
text-align: left;
}
.pankuzu_in span {padding:0 5px ;}
.pankuzu_in span a{color:#7d719e;}
.pankuzu_in span a:hover{
color:#7d719e;
text-decoration: underline;
}



.fade-in {
opacity: 0;
transition-duration: 1000ms;
transition-property: opacity, transform;
}

.fade-in-up {
transform: translate(0, 30px);
}

.fade-in-down {
transform: translate(0, -30px);
}

.fade-in-left {
transform: translate(-30px, 0);
}

.fade-in-right {
transform: translate(30px, 0);
}

.scroll-in {
opacity: 1;
transform: translate(0, 0);
}


.animation{
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
animation-direction: alternate;
animation-duration: 1.5s;
}



.keyframe6 {
animation-name: poyopoyo;
}

@keyframes poyopoyo {
0%, 40%, 60%, 80% {
transform: scale(1.0);
}
50%, 70% {
transform: scale(0.95);
}
}


/* ふわふわアニメーションここから */
/* 縦のふわふわ指定 */
.fuwafuwa01 {
animation: fuwafuwa01 4s infinite ease-in-out;
}
.fuwafuwa02 {
animation: fuwafuwa02 5s infinite ease-in-out;
}
.fuwafuwa03 {
animation: fuwafuwa03 3s infinite ease-in-out;
}
/* 縦のふわふわの動き */
@keyframes fuwafuwa01 {
0%, 100% {
transform: translateY(0);
}
50% {
transform: translateY(20px);
}
}
/* 縦のふわふわの動き */
@keyframes fuwafuwa02 {
0%, 100% {
transform: translateY(0);
}
50% {
transform: translateY(30px);
}
}
/* 縦のふわふわの動き */
@keyframes fuwafuwa03 {
0%, 100% {
transform: translateY(0);
}
50% {
transform: translateY(10px);
}
}


.white-bg{
background:#fff;
padding:30px;
display:block;
}

.blue-bg{
background:#eeeefc;
padding:30px;
display:block;
}

/* ▼追加 */
.beige-bg{
background:#f3f2f0;
padding:30px;
display:block;
}
