@charset "utf-8";
@import url("root.css");


/* CSS Document */

/* ==========================================================================
   テキスト装飾
   ========================================================================== */
/*-----*RESET CSS*-----*/
*:where(:not(iframe, canvas, img, svg, video):not(svg *)){all: unset;display: revert;}
*,*::before,*::after{box-sizing: border-box;}
ol,ul{list-style: none;}
img{vertical-align: bottom;}

a {cursor: pointer;}

@media screen and (max-width: 979px) {
img{max-width:100%;  vertical-align: bottom;}
}
/*-----*RESET CSS*-----*/

html, body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}


body {
font-size:18px;
background-color: #ffffff;
color:#333333;
font-weight: 200;
min-width:1200px;
line-height:1.8;
font-family: 'Noto Sans JP', sans-serif;
}

a {
color: #333333;
text-decoration: none;
text-decoration-skip-ink: none;
}
a:hover{
  color: #333333;
  text-decoration: none;
}

a:focus {
    outline: none; /* デフォルトのフォーカス枠を無効化 */
    text-decoration: none; /* 必要に応じて下線を無効化 */
}

p {font-size: 18px;text-align: justify;}

@media screen and (max-width: 979px) {
body {
	font-size: 16px;
	line-height: 1.8;
}
p {font-size: 16px;text-align: justify;}
}


img {
max-width: 100%;
vertical-align: bottom;
}


.pc {display: block;}
.sp {display: none;}


@media screen and (max-width: 979px) {
.pc {display: none;}
.sp {display: block;}

.wrapper {
	padding:0;
	margin: 0 auto 0;
	width: 100%;
	text-align: center;

}

.child_01{order: 1;}
.child_02{order: 2;}
.child_03{order: 3;}
.child_04{order: 4;}
.child_05{order: 5;}
.child_06{order: 6;}
.child_07{order: 7;}
.child_08{order: 8;}
.child_09{order: 9;}
.child_010{order: 10;}
.child_011{order: 11;}
.child_012{order: 12;}
}


/* ==========================================================================
   アニメーション
   ========================================================================== */

.fade-in {
  opacity: 0;
  transform: translateY(40px); /* 下からスライド */
  transition: opacity 1s ease-out, transform 1s ease-out;
}

/* スクロールで表示されたときのスタイル */
.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}

/* 初期状態：非表示 */
.bg-fade-in {
  opacity: 0;
  transform: translateY(30px); /* 下からふわっと */
  transition: opacity 1.2s ease-out, transform 1.2s ease-out;
  will-change: opacity, transform;
}

/* 表示状態：フェードイン */
.bg-fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}
/* ==========================================================================
   テキスト装飾
   ========================================================================== */
.txt_b{font-weight:400;}
.txt_big{font-size: 120%;}
.txt_big_02{font-size: 140%;}
.txt_red{color:var(--base-color_red);}
.txt_bl{color:#00479d;}
.txt_small{font-size: 80%;}
.txt_small_02{font-size: 60%;}

.txt_p p{font-size:16px;}

@media screen and (max-width: 959px) { 
.txt_p p{font-size:14px;}
}

/* ==========================================================================
   リンク　共通
   ========================================================================== */
.link_a a {
display: block;
width: 100%;
  padding: 5px 20px;
  border-radius: 50px;
  border:1px solid #ddcc99;
  color:#333333; /* 文字色 */
  font-size: 24px;
  text-decoration: none; /* 下線を消す */
  text-align:left;
  cursor: pointer;
  transition: opacity 0.3s ease-in-out;
  position: relative;
  padding: 25px 50px;
  margin: 50px auto 0;
  line-height: 1;
  box-shadow: 2px 2px 20px rgba(250, 185, 182, 0.1);
  background-color: #ffffff;
    transition: background-color 0.5s ease, color 0.5s ease; /* 色変化をゆっくり */
}

.link_a a:hover {
  border:1px solid #ddcc99;
  color:#ffffff; /* 文字色 */
  background-color: #ddcc99;
}
.link_a a::after {
content: "→";
padding:0;
position: absolute;
top:17px;
right:40px;
color:#ddcc99;
text-align: center;
font-size:36px;
transition: opacity 0.3s ease-in-out;
}

.link_a a:hover::after {
  color: #ffffff;
}


.link_b a {
display: block;
width:300px;
  border-bottom:1px solid #333333;
  color:#333333; /* 文字色 */
  font-size: 24px;
  text-decoration: none; /* 下線を消す */
  text-align:left;
  cursor: pointer;
  position: relative;
  padding: 10px 0;
  margin: 0 auto 0;
  line-height: 1;
 transition: background-color 0.5s ease, color 0.5s ease, border-color 0.5s ease;
}

.link_b a:hover {
  color: #ddcc99; /* ホバー時に矢印の色を白に */
  border-bottom:1px solid #ddcc99;
}

.link_b a::after {
content: "→";
padding:0;
position: absolute;
top:5px;
right:0;
color:#ddcc99;
text-align: center;
font-size:36px;
transition: opacity 0.3s ease-in-out;
}


@media screen and (max-width: 959px) { 
.link_a a {
display: block;
width: 100%;
  border-radius: 50px;
  border:1px solid #ddcc99;
  color:#333333; /* 文字色 */
  font-size:18px;
  text-decoration: none; /* 下線を消す */
  text-align:left;
  cursor: pointer;
  transition: opacity 0.3s ease-in-out;
  position: relative;
  padding: 15px 20px;
  margin: 20px auto 0;
  line-height: 1;
  box-shadow: 2px 2px 20px rgba(250, 185, 182, 0.1);
  background-color: #ffffff;
    transition: background-color 0.5s ease, color 0.5s ease; /* 色変化をゆっくり */
}

.link_a a:hover {
  border:1px solid #ddcc99;
  color:#ffffff; /* 文字色 */
  background-color: #ddcc99;
}
.link_a a::after {
content: "→";
padding:0;
position: absolute;
top: 15%;  
right:15px;
color:#ddcc99;
text-align: center;
font-size:30px;
transition: opacity 0.3s ease-in-out;
}


.link_b a {
display: block;
  border-bottom:1px solid #333333;
  color:#333333; /* 文字色 */
  font-size:18px;
  text-decoration: none; /* 下線を消す */
  text-align:left;
  cursor: pointer;
  position: relative;
  padding: 10px 0;
  margin: 0 auto 0;
  line-height: 1;
 transition: background-color 0.5s ease, color 0.5s ease, border-color 0.5s ease;
 width: auto;
}

.link_b a:hover {
  color: #ddcc99; /* ホバー時に矢印の色を白に */
  border-bottom:1px solid #ddcc99;
}

.link_b a::after {
content: "→";
padding:0;
position: absolute;
top:25%;
right:0;
color:#ddcc99;
text-align: center;
font-size:24px;
transition: opacity 0.3s ease-in-out;
}

}

/* ==========================================================================
   共通レイアウト
   ========================================================================== */
.box{
width: 1200px;
margin: 0 auto 0;
padding:100px 0;
}

.txt_box{
width: 100%;
margin: 0 auto 0;
padding:100px 0 0 0;
}

.txt_box_02{
width: 100%;
margin: 0 auto 0;
padding:0 0 40px 0;
}

.row{
width: 100%;
display: flex;
margin: 100px auto 0;
padding:0 0;
justify-content: space-around;
flex-wrap: wrap;
}

.row_box{
width: 100%;
display: flex;
margin: 0 auto 0;
padding:0 0;
justify-content: space-around;
flex-wrap: wrap;
}

.row_box_s{
width: 100%;
display: flex;
margin: 40px auto 0;
padding:0 0;
justify-content: space-around;
flex-wrap: wrap;
}

.row_box_s02{
width: 100%;
display: flex;
margin: 40px auto 40px;
padding:0 0;
justify-content: space-around;
flex-wrap: wrap;
}



.col{width:48%;margin: 0 4% 4% 0;}
.col:nth-child(2n){margin: 0 0 4% 0;}


.col_03{width: 30%;margin: 0 5% 5px 0;}
.col_03:nth-of-type(3n){margin: 0 0 5px 0;}
.col_04{width: 288px;margin: 0 16px 0 0;}
.col_04:nth-child(4n){margin: 0 0 0 0;}

.col_60{width: 55%;margin:0 5% 0 0;}
.col_60 p{font-size: 16px;}
.col_40{width: 40%;margin:0 auto;}

.col_70{width: 65%;margin:0 5% 0 0;}
.col_30{width: 30%;margin:0 auto;}

.box_bg03 {
width:100%;
margin:20px auto;
padding: 20px;
background-color: #fcfaf5;
border-radius: 20px;
}

.box_bg03 h4{
font-size:18px;
font-weight: 400;
color: #ddcc99;
margin: 0 auto 20px;
border-bottom: 2px solid #ddcc99;
padding: 0 0 10px 0;
}

.box_bg03 p{
font-size:16px;
}

@media screen and (max-width: 979px) {
.box{
width: 90%;
margin: 0 auto 0;
padding:50px 0;
}

.txt_box{
width: 100%;
margin: 0 auto 0;
padding:40px 0 0 0;
}

.txt_box_02{
width: 100%;
margin: 0 auto 0;
padding:20px 0 20px 0;
}


.row{
width: 100%;
display: flex;
margin: 0 auto 0;
padding:0 0;
justify-content: space-around;
flex-wrap: wrap;
}

.row_box{
width: 100%;
display: flex;
margin: 0 auto 0;
padding:0 0;
justify-content: space-around;
flex-wrap: wrap;
}

.row_box_s{
width: 100%;
display: flex;
margin: 20px auto;
padding:0 0;
justify-content: space-around;
flex-wrap: wrap;
}

.row_box_s02{
width: 100%;
display: flex;
margin: 20px auto 20px;
padding:0 0;
justify-content: space-around;
flex-wrap: wrap;
}

.col{width: 100%;margin: 0 auto;}
.col:nth-child(2n){margin: 0 auto;}

.col_03{width:48%;margin: 0 4% 2% 0;}
.col_03:nth-child(3n){margin: 0 4% 2% 0;}
.col_03:nth-child(2n){margin: 0 0 2% 0;}

.col_04{width: 100%;margin: 0 16px 0 0;}
.col_04:nth-child(4n){margin: 0 0 0 0;}

.col_60{width: 100%;margin:0 0 0 0;}
.col_60 p{font-size: 14px;}
.col_40{width: 100%;margin:0 auto;}

.col_70{width: 100%;margin:0 0 0 0;}
.col_30{width: 100%;margin:0 auto;}



}

.auto-size {
  width: 100%;
  height: auto;
  display: block;
}


/* #################################  追撃レイアウト*/
#sticky_box{
  margin: 0 auto;
  display: flex;
  align-items: flex-start; /* 上揃え */
  gap:0; /* 間隔 */
  position: relative;
  box-sizing: border-box;
  padding: 100px 0;
}


#sticky_box h3 {
  position: sticky;
  top: 100px;
  writing-mode: vertical-rl;
  font-size: 94px;
  margin: 0;
  height: fit-content;
  font-family: "futura-pt", sans-serif;
  line-height: 0.7;
  flex-shrink: 0; /* 縮まない */
}
#sticky_box .b_color {color: #aaaaaa;}
#sticky_box .w_color {color: #ffffff;}

#sticky_box h3:first-letter {color: #ddcc99;}

#sticky_box .box_in{
  width: 1000px; /* 例 */
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
}

#sticky_box .box_02{
  width: 100%; /* 例 */
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
}


/* 表示範囲 */
.marquee-wrapper {
  width: 100%; /* 表示したい横幅 */
  overflow: hidden; /* はみ出し部分を非表示 */
  position: relative;
  box-sizing: border-box;
  padding:80px 0;
}

/* 流れるテキスト */
.marquee {
  display: flex; /* 横並び */
  white-space: nowrap; /* 改行させない */
  animation: marquee 15s linear infinite; /* 速度調整可能 */
  font-size: 72px;
color: #e8c3c3;
font-family: "futura-pt", sans-serif;
font-weight: 300;
font-style: normal;
}

/* 個別のテキスト */
.marquee span {
  padding-right: 50px; /* 文字同士の間隔、必要に応じて調整 */
  display: inline-block;
}

/* アニメーション */
@keyframes marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%); /* コンテンツの半分を左へ移動 */
  }
}

@media screen and (max-width: 979px) {
/* 表示範囲 */
.marquee-wrapper {
  width: 100%; /* 表示したい横幅 */
  overflow: hidden; /* はみ出し部分を非表示 */
  position: relative;
  box-sizing: border-box;
  padding:40px 0;
}

/* 流れるテキスト */
.marquee {
  display: flex; /* 横並び */
  white-space: nowrap; /* 改行させない */
  animation: marquee 15s linear infinite; /* 速度調整可能 */
  font-size:60px;
color: #e8c3c3;
font-family: "futura-pt", sans-serif;
font-weight: 300;
font-style: normal;
}

/* 個別のテキスト */
.marquee span {
  padding-right: 50px; /* 文字同士の間隔、必要に応じて調整 */
  display: inline-block;
}

}
 
/* ==========================================================================
   共通タイトル
   ========================================================================== */
 h2{
 font-size: 32px;
 font-weight: 200;
 line-height: 2;
 }
 

.h2_title_a h2{
position: relative;
text-align: center;
margin-top: -13px;
font-size:42px;
font-weight: 200;
line-height:1.4;
}

.h2_title_a h2::before {
background:#ddcc99;
bottom: -20px;
content: "";
height: 3px;
left: 50%;
position: absolute;
transform: translateX(-50%); /* 線の中央寄せ */
width: 80px;
z-index:22;
}

.h2_title_a span{
font-size:42px;
	font-weight:200;
}
.h2_title_a p{
font-size:20px;
	font-weight:200;
	text-align:center;
}

.h2_title_a_c{
color: #ddcc99;
}

.h2_title_b{
font-size:34px;
font-weight: 200;
line-height:40px;
border-bottom: 2px solid #ddcc99;
padding: 0 0 20px 0;
margin: 0 auto 20px;
line-height:1.4;
}

.h2_title_d h2{
font-size:24px;
font-weight: 500;
background-color:#ddcc99;
color:#ffffff;
border-radius: 10px;
margin: 0 auto 20px;
text-align: center;
padding: 10px 0;
line-height:1.6;
}



h3 {
    font-size: 24px;
    font-weight: 400;
    color: #ddcc99;
    margin: 0 auto 20px;
    border-bottom: 2px solid #ddcc99;
    padding: 0 0 10px 0;
}


@media screen and (max-width: 979px) {
 h2{
 font-size:22px;
 font-weight: 200;
 }


.h2_title_a{
padding: 0 0 20px 0;
}


.h2_title_a h2{
position: relative;
text-align: center;
margin-top: -13px;
font-size:20px;
font-weight: 200;
line-height:32px;
}

.h2_title_a span{
font-size:20px;
}
.h2_title_a p{
font-size:14px;
	font-weight:200;
	text-align:center;
}


.h2_title_a h2::before {
background:#ddcc99;
bottom: -10px;
content: "";
height: 3px;
left: 50%;
position: absolute;
transform: translateX(-50%); /* 線の中央寄せ */
width: 80px;
z-index:22;
}




.h2_title_b{
font-size:20px;
font-weight: 200;
line-height:1.6;
border-bottom: 2px solid #ddcc99;
padding: 0 0 10px 0;
margin: 0 auto 20px;
}
h3 {
        font-size: 18px;
        font-weight: 400;
        color: #ddcc99;
        margin: 0 auto 20px;
        border-bottom: 2px solid #ddcc99;
        padding: 0 0 5px 0;
    }


.h2_title_d h2{
font-size:18px;
font-weight: 500;
background-color:#ddcc99;
color:#ffffff;
border-radius: 10px;
margin: 0 auto 20px;
text-align: center;
padding: 5px 0;
}



}

.img_radius{
border-radius: 40px;
box-shadow: -1.41px 1.41px 20px rgba(250, 185, 182, 0.3);
}

.img_radius_02{
border-radius: 20px;
box-shadow: -1.41px 1.41px 20px rgba(250, 185, 182, 0.3);
}
@media screen and (max-width: 979px) {
.img_radius{
border-radius: 20px;
box-shadow: -1.41px 1.41px 20px rgba(250, 185, 182, 0.3);
}

.img_radius_02{
border-radius: 10px;
box-shadow: -1.41px 1.41px 20px rgba(250, 185, 182, 0.3);
}
}


/***************************************
---------------- HEADER ----------------
***************************************/
header {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height:80px;
        background: #ffffff;
        z-index:999;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.1);
    }
	
header .header_logo {
width: 100%;
margin:0 auto;
text-align: center;
display:block;
}
header .header_logo::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px; /* ボーダーの高さ */
    background: linear-gradient(
      to right,
      #e1e5ff 0%,
      #ffe1ee 50%,
      #ffeddf 100%
    );
}
  
.nav-menu {
display: none;
}  
    .menu-btn {
        position: fixed;
        top: 14px;
        right:30px;
        display: flex;
        height: 40px;
        width: 40px;
        justify-content: center;
        align-items: center;
        z-index: 90;
        color:#333333;
        border-radius: 10px;
    }
    
    .menu-btn span.bar {
        content: "";
        display: block;
        height: 4px;
        width: 60px;
        background-color: #777777;
        position: absolute;
        transition: 0.4s;
    }
    .menu-btn span.txt {
        position: absolute;
        top: 0;
        
    }
    .menu-btn span.bar:nth-child(1) {top: 10px;}
    .menu-btn span.bar:nth-child(2) {top: 24px;}
    .menu-btn span.bar:nth-child(3) {top: 38px;}    
   
    
    #menu-btn-check:checked ~ .menu-btn span.bar:nth-child(2) {
    opacity: 0;

    }
    #menu-btn-check:checked ~ .menu-btn span.bar:nth-child(3){
        top: 22px;
        background-color: #777777;
        transform: rotate(45deg);
        transition: 0.4s;
    }
    #menu-btn-check:checked ~ .menu-btn span.bar:nth-child(1){
        top: 22px;
        background-color: #777777;
        transform: rotate(-45deg);
        transition: 0.4s;
    }

    #menu-btn-check:checked ~ .menu-btn span.menu:before {
    content: "CLOSE";
    color:#777777;
    font-size: 11px;
    font-weight: bold;
    position: absolute;
    bottom:-15px;
    left:3px;
    transition: 0.4s;

}
.menu-btn p {
    padding: 55px 0 0 0;
    font-weight: bold;
    font-size:12px;
    color: #333333;
}
    #menu-btn-check:checked ~ .menu-btn span.bar::after {
        top: 0;
        background-color: #333333;
        transform: rotate(-45deg);
}
    

.navigation {
        width: 100%;
height: 100vh;
overflow-y: auto;  /* 縦方向のスクロールを有効にする */
        position: fixed;
        top:0;
        left: 100%;/*leftの値を変更してメニューを画面外へ*/
        z-index: 80;
        background-color: rgba(255, 255, 255, .9);
        transition: all 0.8s;/*アニメーション設定*/
        display: flex;
        align-items: center;
        justify-content: flex-start;
        flex-wrap: wrap;
}
.navigation ul#page_link {
margin: 0 auto;
padding: 25px;
height:700px;
overflow-y:auto;
-webkit-transform: translateX(-10px);
transform: translateX(-10px);
transition: 1s;
width:500px;
text-align: left;
}
    .navigation ul#page_link > li {
        width: 100%;
        margin: 0;
        list-style: none;
		border-bottom:1px solid #e8e8e8;;
    }
    

    
    .navigation ul#page_link li:not(:last-of-type)::after {
        content: none;
    }
    .navigation ul#page_link > li a{
        display: block;
        width: 100%;
        height: auto;
        font-size:22px;
        box-sizing: border-box;
        color:#ddcc99;
        text-decoration: none;

        position: relative;
        text-align:left;
    font-family: "ten-mincho", serif;
		padding:5px 0;
font-weight: 700;

    }
    .navigation ul#page_link > li:before,
    .navigation ul#page_link > li:last-of-type:after {
        content: none;
    }


.navigation ul#page_link > li a span{
font-family: 'Noto Sans JP', sans-serif;
color:#333333;
font-weight:200;
font-size:16px;
padding:0 0 0 10px;
margin: -10px 0 -5px 0;

}

.hover-bg-part {
  position: relative;
  display: inline-block;
  z-index: 0;
  overflow: hidden;
  color: #000;
  transition: color 0.4s ease;
  padding: 5px; /* ← 上5px・左10pxの内側余白 */
  margin:0 0 0 10px;
}

.hover-bg-part::before {
  content: "";
  position: absolute;
  top: 0;
  left: 10px;     /* ← 左側の余白 */
  width: 0%;
  height: 100%;
  background-color: #ddcc99;
  z-index: -1;
  transition: width 0.4s ease;
}

.hover-bg-part:hover::before {
width: calc(100% + 5px); 
}

.hover-bg-part:hover {
  color: #fff !important;
}




.navigation .li_border {
border-bottom: 1px solid #ffffff;
padding: 10px 0 10px 0;
}

.navigation .li_sub01{
padding:10px 0 5px 0;
}   

.navigation .li_sub{
padding:5px 0 5px 20px;
}   
    
.navigation .li_sub_last{
padding:5px 0 15px 20px;
}       
    
    #menu-btn-check:checked ~ .navigation {
        left: 0;/*メニューを画面内へ*/
    }
    .navigation li.has-child ul{
        position: static;
        background: none;
        width: calc(100% - 2px);
        visibility: hidden;
        opacity: 1;
        transition: none;
        display: none;
    }
    .navigation li.has-child {
        flex-wrap: wrap; 
    }
    .phone_num {
        width: 100%;
        margin: auto;
        padding: 25px;
    }
    .phone_num a {
        color: var(--base-color_w);
        justify-content: center;
        margin:10px auto 10px;
    }
    .phone_num a::before {
        content: url(../img/tel_wh.svg);
    }
    .phone_num p {
        color: var(--base-color_w);
        text-align: center;
        font-size: 1.8rem;
    }
    .chirashi_btn {
        width: 70%;
        padding: 15px;
        margin: auto;
    }


.sub-info-menu {
  display: none;
  padding-left: 1em;
}
.info-toggle.active .sub-info-menu {
  display: block;

}

.info-toggle.active .sub-info-menu li {
border-top: 1px solid #e8e8e8;
}


@media screen and (max-width: 768px) {
header{
justify-content: flex-start;
margin: 0;
height: 60px;
}

header .header_logo {
width: 100%;
margin:0;
text-align: left;
padding: 0 0 0 10%;
}
    
header .header_logo img{width: 70%;}


.menu-btn {
        position: fixed;
        top: 10px;
        right:2%;
        display: flex;
        height: 40px;
        width: 40px;
        justify-content: center;
        align-items: center;
        z-index: 90;
        color:#333333;
        border-radius: 10px;
    }
    
.menu-btn span.bar {
        content: "";
        display: block;
        height: 2px;
        width: 30px;
        background-color: #777777;
        position: absolute;
        transition: 0.4s;
    }
    .menu-btn span.txt {
        position: absolute;
        top: 0;
        
    }
    .menu-btn span.bar:nth-child(1) {top: 10px;}
    .menu-btn span.bar:nth-child(2) {top: 20px;}
    .menu-btn span.bar:nth-child(3) {top: 30px;}    
   
    
    #menu-btn-check:checked ~ .menu-btn span.bar:nth-child(2) {
    opacity: 0;

    }
    #menu-btn-check:checked ~ .menu-btn span.bar:nth-child(3){
        top: 22px;
        background-color: #777777;
        transform: rotate(45deg);
        transition: 0.4s;
    }
    #menu-btn-check:checked ~ .menu-btn span.bar:nth-child(1){
        top: 22px;
        background-color: #777777;
        transform: rotate(-45deg);
        transition: 0.4s;
    }

    #menu-btn-check:checked ~ .menu-btn span.menu:before {
    content: "CLOSE";
    color:#ffffff;
    font-size: 11px;
    font-weight: bold;
    position: absolute;
    bottom:-15px;
    left:3px;
    transition: 0.4s;

}
.menu-btn p {
    padding: 55px 0 0 0;
    font-weight: bold;
    font-size:12px;
    color: #333333;
}
    #menu-btn-check:checked ~ .menu-btn span.bar::after {
        top: 0;
        background-color: #333333;
        transform: rotate(-45deg);
}



.navigation ul#page_link {
width: 100%;
margin: 70px auto 100px;
height: 100%;
overflow: auto;
padding-bottom:200px;
}

}



/* #################################  access*/
footer{
background: url(../img/footer_bg.png) top center repeat #ffffff;
background-size: cover;

}
footer .box{
margin: 0 auto;
width: 1200px;
padding: 50px 0 90px 0;
}

footer .sns_link{
margin:0 auto;
}

footer .sns_link a{
padding:5px 10px;
}


footer dl{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

footer dt{
width: 46%;
margin: 0 auto;
padding: 0 0 0 50px;
}

footer dd{width: 27%;}
footer dt img{padding: 0 0 40px 0;}
footer .footer_fix{font-size: 14px;text-align: center;padding: 0 0 80px 0;}

footer li{line-height: 2.8;}

footer i{
padding:20px 0 0 0;
font-size:120%;
}

@media screen and (max-width: 979px) {
footer{
background: url(../img/footer_bg.png) top center repeat #ffffff;
background-size: cover;

}
footer .box{
margin: 0 auto;
width: 100%;
padding: 40px 0 0 0;
font-size: 14px;
}

footer dl{
display: flex;
flex-wrap: wrap;
justify-content:center;
width: 90%;
margin: 0 auto;
}

footer dt{
width: 100%;
margin: 0 auto;
padding: 0;
text-align: center;
}

footer dt p{
text-align: center;
font-size: 14px;
}


footer dd{width:48%;margin: 40px 4% 40px 0;}
footer dd:nth-child(3n){width:48%;margin: 40px 0 40px 0;}
	
footer dt img{padding: 0 0 20px 0;width: 60%;}
footer .footer_fix{font-size: 10px;text-align: center;padding: 0 0 80px 0;}

footer li{line-height:1.4;padding:0 0 10px 0;}

}

/* ==========================================================================
   下部追撃
   ========================================================================== */
.footer_ct {
    background-color:#ddcc99;
    bottom: 0;
    left: 0;
    position: fixed;
    padding: 5px;
    width: 100%;
    z-index: 99;
    display: block;
    padding: 10px 0;
    bottom: 0;
    left: 0;
	z-index:999;
	height:8vh;
}

.footer_ct_box{
width: 1200px;
margin: 0 auto;
}


.footer_ct_box ul{
width: 100%;
display: flex;
justify-content: space-between;
border-left:2px solid #aa9d78;
}

.footer_ct_box li{
width:570px;
border-right:2px solid #aa9d78;
text-align: center;

}
.footer_ct_box li:nth-child(3n){
width:60px;
}


.footer_ct a{
color:#ffffff;
font-size: 20px;
font-weight: 400;
 transition: color 0.3s ease; /* 文字色もアニメーション */
}

.footer_ct a:hover{
color: #fefee6;
}


.page-top {
  display: inline-block;
  color: #fff;
  text-decoration: none;
  border-radius: 5px;
  font-size: 14px;
}
.page-top:hover {
}

@media screen and (max-width: 979px) {
.footer_ct {
    background-color: transparent;
    bottom: 0;
    left: 0;
    position: fixed;
    padding: 5px;
    width: 100%;
    z-index: 99;
    display: block;
    padding: 10px 0 0 0;
    bottom: 0;
    left: 0;
	z-index:999;
	height:auto;
}

.footer_ct_box{
width:100%;
margin: 0 auto;
}


.footer_ct_box ul{
width: 100%;
display: flex;
justify-content: space-between;
	align-items:center;
border-left:0 solid #aa9d78;
}

.footer_ct_box li{
width:50%;
border-right:1px solid #ffffff;
border-left:1px solid #ffffff;
text-align: center;
border-radius: 10px 10px 0 0;
background-color: #ddcc99;
display:flex;
justify-content:center;
align-items:center;
	padding:0;
}
.footer_ct_box li:nth-child(3n){
display: none;
}


.footer_ct a{
color:#ffffff;
font-size: 13px;
font-weight: 400;
 transition: color 0.3s ease; /* 文字色もアニメーション */
 padding:10px 0;
 width: 100%;
display:flex;
justify-content:center;
align-items:center;
}
	
.footer_ct i{
padding:0 10px 0 0;
}

.footer_ct a:hover{
color: #fefee6;
}


.page-top {
  display: inline-block;
  color: #fff;
  text-decoration: none;
  border-radius: 5px;
  font-size: 14px;
}
.page-top:hover {
}

}

/* ==========================================================================
   オーダー
   ========================================================================== */
#order{
margin: 0 auto;
padding: 100px 0;
}

#order .order_row{
width: 1000px;
margin: 0 auto;
padding:50px 40px;
background-color: #fcfaf5;
border:1px solid #ddcc99;
border-radius:40px;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
text-align: center;
}

#order .order_col{
width: 450px
}


#order .order_col p{font-size: 28px;padding: 0 0 20px 0;}
#order .order_col span{font-size: 18px;text-align:left;display:block;}


#order .heading-9 {
    position: relative;
    padding:15px 10px;
    border-radius: 50px;
    background-color: #ddcc99;
    color: #ffffff;
	font-size: 20px;
	font-weight: 400;
}

#order .heading-9::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    width: 0;
    height: 0;
    border: 11px solid transparent;
    border-top: 11px solid #ddcc99;
}





#order .btm {
width: 420px;
margin: 0 auto;
}

#order .link a {
margin: 20px auto 0;
}


/* Google Mapを囲う要素 */
.map {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 25%; /* 比率を4:3に固定 */
}
 
/* Google Mapのiframe */
.map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 979px) {
#order{
margin: 0 auto;
padding: 40px 0;
}

#order .order_row{
width: 90%;
margin: 0 auto;
padding:20px;
border-radius: 20px;
}

#order .order_col{width: 100%;}


#order .order_col p{font-size:20px;padding: 0 0 0 0;text-align: center;line-height: 1.4;}
#order .order_col span{font-size: 16px;line-height: 1.4;}


#order .heading-9 {
    position: relative;
    padding:10px 10px;
    border-radius: 50px;
    background-color: #ddcc99;
    color: #ffffff;
	font-size:18px;
	font-weight: 400;
	text-align: center;
	margin: 10px auto 0;
}

#order .heading-9::after {
    content: '';
    position: absolute;
    top: 99%;
    left: 50%;
    width: 0;
    height: 0;
    border: 11px solid transparent;
    border-top: 11px solid #ddcc99;
}

#order .btm {
width: 100%;
margin: 0 auto;
}

#order .link a {
margin: 20px auto 0;
}


/* Google Mapを囲う要素 */
.map {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 25%; /* 比率を4:3に固定 */
}
 
/* Google Mapのiframe */
.map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
}




/* #################################  トップに戻る*/
/* #################################  アコーディオン全体*/



.youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtube iframe {
  width: 100%;
  height: 100%;
}



@media screen and (max-width: 979px) {
body {min-width: 100%;}
.max_w {max-width: 100%;}
.max_w94 {max-width: 94%;}
.max_w90 {max-width: 90%;}
.max_w50 {max-width: 40%;}
.max_w80 {max-width: 80%;}

}

/* #################################  ページング*/


.pagination {
    display: flex;
    justify-content: center;
    list-style: none;
    padding: 0;
	width: 1100px;
	margin: 50px auto 50px;
}

.pagination a {
    margin: 0 5px;
    padding: 10px 10px;
    text-decoration: none;
    border: 1px solid #ccc;
	border-radius: 8px;
}

.pagination a:hover {
    background-color: #ffffff;
}

.pagination .current {
    background-color: var(--base-color_red);
    color: #fff;
    margin: 0 5px;
    padding: 10px 10px;
	border-radius: 8px;
}
@media screen and (max-width: 979px) {
.pagination {
	width: 90%;
	margin: 20px auto 20px;
}
.pagination a {
    margin: 0 5px;
    padding: 10px 20px;
    text-decoration: none;
    border: 1px solid #ccc;
	border-radius: 8px;
	font-size: 14px;
}

.pagination a:hover {
    background-color: #ffffff;
}

.pagination .current {
    background-color: var(--base-color_red);
    color: #fff;
    margin: 0 5px;
    padding: 10px 20px;
	border-radius: 8px;
}
}

/* #################################  二階層目　共通*/



/* ==========================================================================
   テキスト装飾
   ========================================================================== */


#pan{
margin: 40px auto;
width:1200px;
font-size: 14px;
}

#pan i{
padding: 0 10px;
}

#pan02{
margin: 40px auto 20px;
width:1200px;
font-size: 14px;
}

#pan02 i{
padding: 0 10px;
}

@media screen and (max-width: 979px) {

#pan{
margin: 10px auto;
width:90%;
font-size: 12px;
}

#pan i{
padding: 0 10px;
}
	
#pan02{
margin: 10px auto;
width:90%;
font-size: 12px;
}

#pan02 i{
padding: 0 10px;
}

}


/* ==========================================================================
フォーム
   ========================================================================== */

#form{
margin: 0 auto 100px;
}

#form dl{
display: flex;
flex-wrap: wrap;
width:100%;
justify-content: space-between;
align-items:flex-start;
margin: 100px auto 20px;
}

#form dt{
width:35%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
margin: 0 auto 40px;
}

#form dd{
width:65%;
padding: 0 0 0 20px;
margin: 0 auto 40px;
}

#form .dd_flex{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
}

#form .dd_flex label {
width: 48%;
margin: 0 4% 0 0;
}
#form .dd_flex label:nth-child(2n) {
margin:0;
}

@media screen and (max-width: 979px) {
#form{
margin: 0 auto 40px;
}

#form dl{
width: 100%;
margin: 40px auto 20px;
}

#form dt{
width: 100%;
margin: 0 auto 10px;
}

#form dd{
width: 100%;
padding: 0 0 0 0;
margin: 0 auto 20px;
}

#form .dd_flex{
}

#form .dd_flex label {
width: 100%;
margin: 0 0 10px 0;
}
#form .dd_flex label:nth-child(2n) {
margin: 0 0 10px 0;
}

}
#form span.must {
    display: block;
    width: 48px;
    font-size:16px;
    text-align: center;
    background:#e8c3c3;
    color:#ffffff;
    margin-right: 0;
	padding: 8px 0;
}
#form span.must02 {
    display: block;
    width: 48px;
    font-size:16px;
    text-align: center;
    background:#e2dede;
    color:#ffffff;
    margin-right: 0;
	padding: 8px 0;
}

@media screen and (max-width: 979px) {
#form span.must {
    display: block;
    width: 48px;
    font-size:14px;
    text-align: center;
    color:#ffffff;
    margin-right: 0;
	padding: 4px 0;
}
#form span.must02 {
    display: block;
    width: 48px;
    font-size:14px;
    text-align: center;
    margin-right: 0;
	padding: 4px 0;
}
}

#form .textbox-1-label,
#form .textbox-1 {
    color: #333;
	background-color:#ffffff;
}

#form .textbox-1-label {
    display: block;
    margin-bottom: 5px;
    font-size: .9em;
}

#form .textbox-1 {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #969da3;
    border-radius: 3px;
    font-size: 1em;
    line-height: 1.5;
}

#form .textbox-1::placeholder {
    color: #999;
}

.checkbox-2 {
    display: flex;
    flex-wrap: wrap;
    gap: .5em 2em;
    border: none;
}

.checkbox-2 label {
    display: flex;
align-items: flex-start;
    gap: 0 .5em;
    position: relative;
    cursor: pointer;
	margin:0 auto 10px;
}

.checkbox-2 label::before {
    width: 22px;
    height: 22px;
    border-radius: 3px;
    border: 2px solid #d6dde3;
    content: '';
	padding:0 10px 0 0;
}

.checkbox-2 label:has(:checked)::after {
    position: absolute;
    top: 0;
    left: 7px;
    transform: rotate(45deg);
    width: 12px;
    height: 16px;
    border: solid #ddcc99;
    border-width: 0 3px 3px 0;
    content: '';
}

.checkbox-2 input {
    display: none;
}
.wpcf7-list-item{margin:0;}

/* 全体の共通スタイル */
#pregnant-info,
#pregnant-info02,
#pregnant-info03,
#pregnant-info04,
#pregnant-info05 {
  margin: 0 auto 20px;
  padding:10px 20px 20px 20px;
  background-color: #fcfaf5;
  width: 95%;
  border-radius: 8px;
  box-sizing: border-box;
}

/* テキスト・ラベルの間隔とサイズ */
#pregnant-info p,
#pregnant-info02 p,
#pregnant-info03 p,
#pregnant-info04 p,
#pregnant-info05 p {
  margin: 10px 0;
  font-size: 15px;
  line-height: 1.6;
}

#pregnant-info span,
#pregnant-info02 span,
#pregnant-info03 span,
#pregnant-info04 span {
font-size:85%;
}

#pregnant-info05 span {
font-size:100%;
}

#form.textbox-1-label,
#form.textbox-1 {
    color: #333;
}

#form.textbox-1-label {
    display: block;
    margin-bottom: 5px;
    font-size: .9em;
}


#form.textbox-1-label {
    display: block;
    margin-bottom: 5px;
    font-size: .9em;
}

#form .selectbox-3 {
    display: flex;
    align-items: center;
    position: relative;
}

#form .selectbox-3::after {
    position: absolute;
    right: 15px;
    width: 10px;
    height: 7px;
    background-color: #535353;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: '';
    pointer-events: none;
}

#form .selectbox-3 select {
    appearance: none;
    width:100%;
	margin: 0;
    padding: 8px 10px;
    border: 1px solid #969da3;
    border-radius: 3px;
    background-color: #fff;
    color: #333333;
    font-size: 1em;
	    line-height: 1.5;
    cursor: pointer;
}

#form.textbox-1 {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #969da3;
    border-radius: 3px;
    font-size: 1em;
    line-height: 1.5;
	height: 500px;
}

#form.textbox-1::placeholder {
    color: #999;
}

#form .button-2 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80%;
    margin:0 auto;
    padding: .9em 2em;
    border: none;
    border-radius: 5px;
    background-color:#e8c3c3;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
	border:1px solid #e8c3c3;
	text-align:center;
}

#form .wpcf7-form-control-wrap{
  display: block;
  width: 100%;
}
#form .button-2:hover {
    background-color: #ffffff;
	color: #e8c3c3;
	border:1px solid #e8c3c3;
}

#form .radio-1 {
    display: flex;
    flex-wrap: wrap;
    gap: .3em 2em;
    border: none;
	width:100%;
}

#form .radio-1 label {
    display: flex;
    align-items: center;
    gap: 0 .5em;
    position: relative;
    cursor: pointer;
}

#form .radio-1 label::before,
#form .radio-1 label:has(:checked)::after {
    border-radius: 50%;
    content: '';
}

#form .radio-1 label::before {
    width: 18px;
    height: 18px;
    background-color: #e2dede;
}

#form .radio-1 label:has(:checked)::after {
    position: absolute;
    top: 50%;
    left: 9px;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    background-color: #e52d2d;
    animation: anim-radio-1 .3s linear;
}

@keyframes anim-radio-1 {
    0% {
        box-shadow: 0 0 0 1px transparent;
    }
    50% {
        box-shadow: 0 0 0 10px #ffffff33;
    }
    100% {
        box-shadow: 0 0 0 10px transparent;
    }
}

.wpcf7-list-item {
    display:block;
    margin: 0 0 0 1em;
width:100%;
}

.radio-1 input {
    display: none;
}


@media screen and (max-width: 979px) {
#form .button-2 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin:0 auto;
    padding: .9em 2em;
    border: none;
    border-radius: 5px;
    background-color:#e8c3c3;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
}

#form .button-2:hover {
    background-color: #ffffff;

}
	
.checkbox-2 label {
width:100%;
}
.checkbox-2 label::before {
    width: 16px;
    height: 16px;
    border-radius: 3px;
    border: 2px solid #d6dde3;
    content: '';
    padding: 0 0 0;
    display: block;
	margin:8px 0 0 0;
}

}

/* ==========================================================================
ページング
   ========================================================================== */
.custom-pagination {
  display: flex;
  list-style: none;
  gap: 8px;
  justify-content: center;
  padding: 0;
}

.custom-pagination li a,
.custom-pagination li span {
  display: inline-block;
  padding: 8px 12px;
  border: 1px solid #ddcc99;
  border-radius: 10px;
  text-decoration: none;
  color: #ddcc99;
  background: #fff;
  line-height: 1.6;
}

.custom-pagination li span.current {
  background: #ddcc99;
  color: #fff;
  border: 1px solid #ddcc99;
}
