@charset "utf-8";
/* CSS Document */

/*--------------------------------------------------------------------

h2first

--------------------------------------------------------------------*/
.h2first{text-align: center}
.h2first .tit{position: relative; margin-left:8%; margin-right: 8%}

.h2first .tit h2{ font-size:clamp(1.625rem, 1.375rem + 1.25vw, 1.875rem) }/*26-30*/


/*--------------------------------------------------------------------

.first

--------------------------------------------------------------------*/
.first{position: relative; padding-top: 20px ;  }

.mokuflex{display: flex; justify-content: space-between; padding: 0 8% 50px ;align-items: flex-start; /* 追加 */}
.mokuflex img{width: 30%;}
.mokuflex ul{width: 68%}
.mokuflex li{ margin-left: 20px ; border-bottom: 1px dashed #674330;}
.mokuflex a{color:#674330; display: block; padding: 8px 0;  }
.mokuflex a:hover{background: #fff}
.mokuflex a:first-child{padding-top: 0}


/*--------------------------------------------------------------------

.maku

--------------------------------------------------------------------*/
.sclo{position: relative}
.sclo .cl01{width:55px; height: 90%; position: absolute; top: -10px; left: 0; z-index: 2}
.sclo .cl02{width:55px; height: 90%; position: absolute; top: -10px; right: 0; z-index: 2}
.sclo .img01{width: 50px; position: absolute; bottom: -30px; left: 3%}

.peac{margin-right: 8%; text-align: right; font-size:clamp(1.25rem, 1.068rem + 0.91vw, 1.75rem) }/*20-28*/
.textleft{position: relative; z-index: 2; padding: 50px 0 20px; margin-left: 8%; text-align: left; font-size:clamp(1.25rem, 1.068rem + 0.91vw, 1.75rem) }/*20-28*/
/*--------------------------------------------------------------------

flow

--------------------------------------------------------------------*/
.flow {text-align: center ; position: relative; padding-top: 30px}
.flow .fukibo{margin-bottom: 10px}

.flow .text{margin: 20px 8%  ;text-align: left;}
.flow .pic0{position: relative; margin: 0 8%}
.flow .st{border-radius: 20px}
.flow .cat{position: absolute; bottom: -80px; right: 0; width: 120px}

.flow .come{text-align: left; padding: 0 8% 20px}
.flow .img02 {margin: 0 4% 10px 8%}
.flow .img02 img { max-width:411px; }

.flow dl{display: flex; justify-content: space-between; margin: 0 4% 20px 0}
.flow dt{width:52% }
.flow dt img{border-radius: 0 10px 10px 0}
.flow dd{width:44%; border: 1px solid #fbc2bc; border-radius: 10px; padding: 3%; text-align: left; position: relative}
.flow dd:before {  
  content: "";
  position: absolute;
  left: -24px;
  width: 13px;
  height: 12px;
  top: 20%;
  background: #fbc2bc;
  border-radius: 50%;
}

.flow dd:after {
  content: "";
  position: absolute;
  left: -10px;
  width: 20px;
  height: 18px;
  top: 5%;
  background: #fbc2bc;
  border-radius: 50%;
}

.flow .dance{padding-bottom: 40px}
.flow .dance dl{ flex-direction: row-reverse}
.flow .dance dt{position: absolute; right: 0}
.flow .dance dd{width: 50%; margin-left: 8%; margin-right: 44%}
.flow .dance dd:before{left: auto; right: -24px;} 
.flow .dance dd:after{left: auto; right: -10px;} 

.flow .karada{position: relative}
.flow .karada{padding-top: 20px}
.flow .karada .cat1{position: absolute; bottom: -50px; right: 8px; width: 100px}

.flow .karada .waki{margin: 0 8%  120px; }
.flow .karada .waki img{border-radius: 30px}


/*--------------------------------------------------------------------

.acc

--------------------------------------------------------------------*/
.acc{text-align: center}
.acc h2{width: 260px}
.acc .text01{padding-bottom: 70px}
.acc .bgfff{padding-bottom: 0 ; background: #fff}
.accbox{background:#f9f3ed ; margin: 0 5%; padding: 0 5% 20px; position: relative; z-index: 2}
.accbox:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: 5px;
  border: 25px solid transparent;
  border-top: 25px solid #f9f3ed;
}
.accbox .man{display: inline-block; position: relative; top: -50px; background:#f9f3ed ; border-radius: 180px; padding:10px 0 0 0;
width: 220px; height: 220px; font-size:clamp(1.5rem, 1.25rem + 1.25vw, 1.75rem) }/*24-28*/
.accbox h3{ border-radius: 10px ; background:#f3e8dc; padding: 10px; margin-top: -200px ; z-index: 1; position: relative; margin-bottom: 10px}
.accbox .sta , .accbox .eki , .accbox .add{ position: relative; z-index: 1 ;text-align: left}
.accbox .sta img{width: 18px}
.accbox .add{line-height: 1.6; font-size: 13px; margin: 10px 0 0}
.acc .coment{text-align: left; padding: 20px 0}
.acc .st01{margin-bottom: 80px ; margin-top: -20px;}
.acc .st02{margin-top: -20px}

.acc a{font-size: 10px; background:#674330; color: #fff; padding: 0 15px; display: inline-block; border-radius: 180px}
.acc a:hover{background:#fbc2bc }
.acc .bgfff{position: relative}
.acc .cat{position: absolute; width: 110px; right: 8%; bottom: -50px; z-index: 1}

/*--------------------------------------------------------------------

.about

--------------------------------------------------------------------*/
.about{background: #fff; padding:50px 8% ;text-align: center}
.about dl{text-align: left; margin-bottom: 10px}
.about dt{background:#674330; color: #fff; padding: 0 10px }