@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url('https://fonts.googleapis.com/css2?family=Overpass:ital,wght@0,100..900;1,100..900&family=Zen+Kaku+Gothic+New&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Zen+Old+Mincho&display=swap');
*,
*:before,
*:after {
	box-sizing: inherit;
}
  
html {
	box-sizing: border-box;
	scroll-behavior: smooth;
}
body {
	margin: 0;
	padding: 0;
	border: none;
	background-color: #fff;
	color: #000;
	font-size: 18px;
	line-height: 1.5;
	letter-spacing: 0.05em;
	font-family:"Zen Kaku Gothic New", 'Noto Sans JP', sans-serif;
}
img,
div, p, blockquote,
h1, h2, h3, h4, h5, h6,
ul, ol, li, dl, dt, dd,
form, fieldset, textarea
{
	border: 0;
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	list-style: none;
}
a {
	cursor:pointer;
	background-color: transparent;
	background-image: none;
	background-repeat: no-repeat;
	color: #000;
	text-decoration: none;
}
a:visited {}
a:hover {
	text-decoration: none;
}
a:active {}
table {
	font-size:100%;
}
img {
	max-width: 100%;
}
em{ 
		font-style: normal;
      display: inline-block;
}

.fl { float: left; }        .fr { float: right; }       .clear { clear:both; }
.al { text-align: left; }   .ar { text-align: right; }  .ac { text-align: center; }
.hidden { visibility:hidden;}
	.clearfix { zoom:1; }
	.clearfix:after { content:"."; display: block; height:0px; clear:both; line-height:0; visibility:hidden; }
	.ml20{ margin-left: 20px;}
	.mb10{ margin-bottom: 10px;}
	.mb20{ margin-bottom: 20px;}
	.mb30{ margin-bottom: 30px;}
	.mb40{ margin-bottom: 40px;}
	.mb60{ margin-bottom: 60px;}

	h3{
		/* padding-top: 80px;
		margin-top: -80px; */
		scroll-margin-top: 80px;
	}

	.sp {display: none;}

@media only screen and (max-width:580px) {
	.pc {display: none;}
	.sp {display: block;}
}
	body .wrapper {
		max-width: 1200px;
		margin-left: auto;
		margin-right: auto;
	}
	body .wrapper { zoom:1; }

	@media only screen and (max-width:1210px) {
		body .wrapper {
			width: auto;
			padding-left: 20px;
			padding-right: 20px;
			overflow-x: hidden;
		}
	}

h1 img, h2 img, h3 img{
	width: 100%;
	}

	/** container **/
	body #container {
		padding-top: 75px;
	}
	body #container h2{
		width: 100%;
	}

	#header {
		background-color: #fff;
		width: 100%;
		z-index: 99;
		position: fixed;
		padding-left: 40px;
		display: flex;
		justify-content: space-between;
	}
	#header .siteTitle {
	display: flex;
	align-items: center;

	}
#header .siteTitle .logo{
	max-width: 300px;
	margin-right: 10px;
}
#header .region_icon{
	display: flex;
	align-items:flex-start;
}
#header .region_icon li{
	width: 72px;
	padding: 5px 0px 5px;
	border-radius: 40px;
	background-color: #2BB1C9;
	text-align: center;
	color: #fff;
	font-size: 16px;
	margin-right: 5px;
}

.header_contact{
	display: flex;
	text-align: center;
}
.header_contact a{
	display: block;
	color: #fff;
	padding-top: 12px;
	padding-bottom: 5px;
	width: 240px;
	text-align: center;

}
.header_contact a img{
	width: 22px;
	height: auto;
	margin-bottom: 2px;
}
.header_contact a p{
	font-size: 18px;
	font-weight: bold
}
.header_contact .tel{
	background-color: #0C3FB1;
}
.header_contact .tel:hover{
	background-color: #062C9B;
}
.header_contact .tel p{
	font-size: 15px;
}
.header_contact .tel p.number{
	font-family: "Overpass", sans-serif;
	font-size: 24px;
}

.header_contact .mail{
	background-color: #04A1EB;
}
.header_contact .mail:hover{
	background-color: #0084D3;
}
.header_contact .line{
	background-color: #009DAA;
}
.header_contact .line:hover{
	background-color: #007983;
}


	#nav {
		float: right;
		margin-top: 18px;
	}
	#nav ul {
		display: flex;
	}
	#nav li{
		margin-right: 30px;
		font-weight:700;
		font-size: 19px;
	}

	.drawer_hidden, .drawer_open {
		display: none;
	  }
	  #humberger{
		display: none;
	  }

#section1{
	background-color: #D8EAEB;
	padding: 130px 0px 0px;
}
#section1 .inner{
	max-width: 1205px;
	width: 90%;
	margin: 0 auto;
}
#section1 h2{
	max-width: 776px;
	width: 90%;
	margin: 0 auto;
}
#section1 .txt{
	font-size: 25px;
	font-weight: bold;
	text-align: center;
	margin: 40px auto;
	line-height: 37px;
}
#section1 .box_wrap{
	display: flex;
	justify-content: space-between;
	margin: 0 auto;
	max-width: 1200px;
}
#section1 .box{
	width: 32%;
	background-color: #fff;
	text-align: center;
	border-radius: 20px;
	position: relative;
}
#section1 .box .img_wrap{
  position: relative; /* アイコン配置の基準 */
}

#section1 .box .icon {
  position: absolute;
  left: 50%;           /* 横中央 */
  bottom: -31px;       /* 画像下に半分はみ出す */
  transform: translateX(-50%);
  width: 63px;
  height: 63px;
}

#section1 .box .icon img {
  width: 100%;
  height: auto;
  display: block;
}
#section1 .box .box_txt{
	font-size: 23px;
	color: #0B3FB1;
	font-weight: bold;
	padding: 30px 0px 30px;
}

#section1  .recommendation_wrap{
	 background: linear-gradient(to bottom, #D8EAEB 50%, #0495E6 50%);
	padding: 100px 0px 100px;
}

#section1  .recommendation{	
	text-align: center;
	background-color: #fff;
	max-width: 954px;
	width: 90%;
	margin: 0 auto;
	border: #BBD2E3  solid 2px;
	border-radius: 20px;
	position: relative;
}
#section1  .recommendation::after{
	 content: "";
	position: absolute;
	display: block;
	bottom: -28px;
    left: 50%;
	 transform: translateX(-50%); 
	width: 54px;
	height: 28px;
	background-image: url(../images/recommendation.png);
    background-size: contain;
    background-repeat: no-repeat;
}
#section1  .recommendation span{
	display: inline-block;
	background-color: #0B3FB1;
	font-size: 23px;
	border-radius: 100px;
	padding: 7px 40px;
	color: #fff;
	margin-top: -24px;
}
#section1  .recommendation .txt{
	font-size: 26px;
	line-height: 44px;
}
#section1  .recommendation .txt em{
	font-size: 30px;
	color: #0B3FB1;
}
#section2{
	background-color: #F2F2F2;
	padding-bottom: 130px;
}

#section2 h2.title{
	background-image: url("../images/con2_background.png");
	height: 304px;
	background-size : cover;
	background-position: center center;
	text-align: center;
	
}
#section2 h2.title img{
	max-width: 724px;
	width: 90%;
}
#section2 .box_wrap{
	max-width: 1140px;
	margin: 0 auto;
	width: 90%;
}

#section2 .box{
	border: #BBD2E3 2px solid;
	border-radius: 20px;
	padding: 30px;
}
#section2 .box1{
	display: flex;
	align-items: center;
	margin-bottom: 20px;
	position: relative;
}
#section2 .box1::before{
 content: "";
  position: absolute;
  top: -40px;   /* 吹き出しの縦位置調整 */
  right: -30px; /* 横位置調整 */
  width: 190px;  /* 吹き出し画像の幅 */
  height: 104px;  /* 吹き出し画像の高さ */
  background: url("../images/con2_icon.png") no-repeat center/contain;
}

#section2 .box1 img{
	max-width: 690px;
	width: 70%;
	height: auto;
}
#section2 .box1 .txt_box{
	text-align: center;
	margin-left: 40px;
	width: 30%;
}
#section2 .box .title{
	font-size: 34px;
	font-weight:bold;
	text-align: center;
	border-bottom: 1px dashed #0B3FB1;
}
#section2 .box .title em{
	color: #0B3FB1;
	font-size: 48px;
	font-family: "Overpass", sans-serif;
}
#section2 .box .price{
	text-align: center;
	font-weight: bold;
	font-size: 24px;	
}
#section2 .box .price em{
	font-family: "Overpass", sans-serif;
	font-size: 51px;
	color: #04A1EB;
}
#section2 .box2_box4{
	display: flex;
	margin-bottom: 20px;
	justify-content: space-between;
}
#section2 .box2_box4 .box{
	width: 32.5%;
}
#section2 .box5{
	display: flex;
	justify-content: center;
	padding-top: 40px;
}
#section2 .box5 p{
	line-height: 1em;
	font-size: 30px;
	font-weight: bold;
}
#section2 .box5 p:first-child{
	margin-right: 70px;
}
#section2 .box5 em{
	font-size: 48px;
	color: #0B3FB1;
	font-family: "Overpass", sans-serif;

}
#section2 .menu_list{
border: 2px dashed #0B3FB1;
	width: 90%;
border-radius: 4px;
	max-width: 1140px;
	margin: 60px auto 0;
	text-align: center;
}
#section2 .menu_list .titile{
	background: #0B3FB1;
border-radius: 60px;
	color: #fff;
	font-size: 23px;
	font-weight: bold;
	display: inline-block;
	padding: 7px 40px;
	margin-top: -25px;
}
#section2 .menu_list ul{
	display: flex;
	width: 80%;
	justify-content: space-between;
	margin:  0 auto;
	padding: 30px 0px;
	
}
#section2 .menu_list ul li{
	font-size: 20px;
	font-weight: bold;
	padding: 12px 20px;
	background-color: #fff;
	border-radius: 10px;
}
#section2 .btn{
	text-align: center;
	margin-top: 30px;
}

#section3{
	background-color: #D8EAEB;
	padding-top: 130px;
	text-align: center;
}
#section3 .inner{
	max-width: 1210px;
	width: 90%;
	margin: 0 auto;
	background-color: #F2F2F2;
	border-radius: 40px;
	padding: 80px 0px 100px;
}
#section3 h2.title{
	max-width: 826px;
	width: 90%;
	margin: 0 auto;
}
#section3 h2.title .pc{display: block;}
#section3 h2.title .sp{display: none;}
#section3 .box_wrap{
	max-width: 1020px;
	width: 90%;
	display: flex;
	justify-content: space-between;
	margin: 0 auto;
}
#section3 .box_wrap .box{
	width: 32%;
	position: relative;
}
#section3 .box_wrap .box::before{
	content: "01";
		font-size: 48px;
	color: #0B3FB1;
	font-family: "Overpass", sans-serif;
	font-style: italic;
	position: absolute;
	top: -30px;
	left: 10px;
}
#section3 .box_wrap .box:nth-of-type(2)::before{
	content: "02";
}
#section3 .box_wrap .box:nth-of-type(3)::before{
	content: "03";
}
#section3 .box_wrap .box img{
	border-radius: 10px;
}
#section3 .box_wrap .box .box_title{
	font-size: 24px;
	font-weight: bold;
	color: #0B3FB1;
	border-bottom: 1px dashed #0B3FB1;
	padding: 20px 0px;
}
#section3 .box_wrap .box .txt{
	font-weight:bold;
	font-size: 18px;
	padding-top: 20px;
}
#section4{
	background-color: #D8EAEB;
	padding-top: 130px;
	padding-bottom: 130px;
	text-align: center;
}
#section4 .inner{
		max-width: 1210px;
		width: 90%;
	margin: 0 auto;
}
#section4 h2.title{
	font-size: 34px;
	font-weight: bold;	
	margin-bottom: 50px;
}
#section4 h2.title span{
	display: block;
	color: #05ACBA;
	font-family: "Overpass", sans-serif;
	font-size: 18px;
}
#section4 .box{
	display: flex;
	justify-content: space-between;
	margin-bottom: 100px;
}
#section4 .box .box_txt{
	width: 45%;	
	text-align: left;
}
#section4 .box .box_txt h3{
	color: #0C3FB1;
	font-size: 46px;
	font-weight: bold;	
	border-bottom: #B7B7B7 1px solid;
	margin-bottom: 40px;
	padding-bottom: 10px;
}
#section4 .box .box_txt h3 span{
	font-family: "Overpass", sans-serif;
	font-size: 60px;
	padding-right: 20px;
	position:relative;
	top: 4px;
}
#section4 .box .box_txt p{
	font-size: 18px;
	font-weight: bold;
	line-height: 34px;
}
#section4 .box .box_txt em{
	background-image: linear-gradient(#FFED1B, #FFED1B);
	 background-repeat: no-repeat;
  background-size: 100% 1.7em; /* 高さを調整 */
  background-position: 0 100%; /* 下に配置 */
	display: inline;
}
#section4 .box .box_img{
	width: 50%;	
}
#section4 .box .box_img img{
	border-radius: 800px;
	box-shadow: 5px 10px 0px #05ACBA;
}	

#section5{
	background-color: #D8EAEB;
	text-align: center;
	padding-bottom: 150px;
}
#section5 .inner{
	max-width: 1210px;
		width: 90%;
	margin: 0 auto;
	background-color: #F2F2F2;
	border-radius: 40px;
	padding: 80px 5% 100px;
	box-sizing: border-box;
}
#section5 h2.title{
	max-width: 350px;
	margin: 0 auto 20px; 	
}
#section5 .pickup_menu{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 50px;
}
#section5 .pickup_menu .pickup_menu_txt{
	width: 55%;
}
#section5 .pickup_menu .pickup_menu_txt .title_box{
	display: flex;
	justify-content: space-between;
	border-bottom: 1px dashed #0B3FB1;
	margin-bottom: 20px;
}
#section5 .pickup_menu .pickup_menu_txt .title{
	font-size: 32px;
	font-weight: bold;
}
#section5 .pickup_menu .pickup_menu_txt .price{
	font-size: 22px;
	font-weight: bold;
}

#section5 .pickup_menu .pickup_menu_txt .price em{
	color: #04A1EB;
	font-family: "Overpass", sans-serif;
	font-size: 40px;
	font-weight: bold;
}
#section5 .pickup_menu .pickup_menu_txt .txt{
	font-weight: bold;
	font-size: 18px;
	line-height: 31px;
	text-align: left;
}

#section5 .pickup_menu .pickup_menu_img{
	width: 40%;
}
#section5 .pickup_menu .pickup_menu_img img{
	border-radius: 10px;
}

#section5 .sub_menu{
	display: flex;
	flex-wrap:wrap;
}
#section5 .sub_menu .box{
	width: 32%;
	margin-right: 2%;
	margin-bottom: 30px;
}
#section5 .sub_menu .box:nth-of-type(3n){
	margin-right: 0px;
}

#section5 .sub_menu .box img{
	border-radius: 10px;
	margin-bottom: 15px;
}
#section5 .sub_menu .box .txt_box{
	display: flex;
	justify-content: space-between;
}
#section5 .sub_menu .box .txt_box .title{
	font-size: 22px;
	font-weight: bold;
}
#section5 .sub_menu .box .txt_box .price{
	font-weight: bold;
	font-size: 17px;
}
#section5 .sub_menu .box .txt_box .price em{
	color: #04A1EB;
	font-size: 24px;
	font-family: "Overpass", sans-serif;
}
#section5 .menu_list{
border: 2px dashed #0B3FB1;
border-radius: 4px;
	max-width: 1140px;
		width: 100%;
	margin: 60px auto 40px;
	text-align: center;
}
#section5 .menu_list .titile{
	background: #0B3FB1;
border-radius: 60px;
	color: #fff;
	font-size: 23px;
	font-weight: bold;
	display: inline-block;
	padding: 7px 40px;
	margin-top: -25px;
}
#section5 .menu_list ul{
	display: flex;
	width: 90%;
	justify-content: space-between;
	margin:  0 auto;
	padding: 30px 0px;
	flex-wrap: wrap;
}
#section5 .menu_list ul li{
	width: 32%;
	text-align: left;
	font-size: 16px;
	margin-bottom: 15px;
}
#section5 .menu_list ul li::before{
	content: "⚫︎";
	color: #12A3FD;
}
.btn a{
	display: inline-flex; 
	align-items: center;
  gap: 80px; /* テキストと矢印の間 */
  padding: 17px 30px;
	background-color: #0FA4FD;
	color: #fff;
	border-radius: 9999px;
	font-size: 18px;
	margin: 0 auto;
	font-weight: bold;
}
.btn a:hover{
	text-decoration: none;
	background-color: #0084D3;
	transform: 3;
}
.btn a::after{
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
}


.gift-banner {
  background: url("../images/flower-bg.jpg") no-repeat left center / cover;
  position: relative;
  color: #333;
  padding: 50px 20px 80px;
}

/* 中身を右側に寄せる */
.banner-content {
  max-width: 800px;
  margin-left: auto; /* 左に花があるので右に寄せる */
  padding-right: 10%;
  position: relative;
text-align: center;
}

/* リボン */
.ribbon {
	width: 246px;
	display: inline-block;
    margin-bottom: -61px;
	z-index: 1;
	position: relative;
}

/* 見出し */
.banner-content h2 {
  margin: 40px 0;
  text-align: center;
  position: relative;
  padding: 10px 0;	
	 font-size: 35px;
	 font-family: "Zen Old Mincho", serif;
	font-weight: bold;
}
.banner-content h2 em{
	color: #0B3FB1;
	 font-size: 56px;
}
.banner-content h2 span{
	 font-size: 56px;
}

.banner-content h2::before,
.banner-content h2::after {
 content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;              /* 線の太さ */
  background: #0B3FB1;
}

.banner-content h2::before {
  top: 0;
  box-shadow: 0 4px 0 #0B3FB1;  /* 上線＋6px下にもう1本 */
}
.banner-content h2::after {
  bottom: 0;
  box-shadow: 0 -4px 0 #0B3FB1; /* 下線＋6px上にもう1本 */
}
.banner-content h2 span {
  font-weight: bold;
}


/* メッセージボックス */
.message-box {
  background: #fff;
  padding: 40px 35px;
  border-radius: 10px;
  margin-top: 20px;
}
.message-box .tag {
	display: inline-block;
	max-width: 334px;
	margin-top: -70px;
}

.banner-content .txt{
	font-size: 20px;
	font-weight: bold;
	line-height: 35px;
	margin-bottom: 15px;
}
.banner-content .txt em{
	color: #0B3FB1;
}
.banner-content small{
	color: #4E4F52;
	font-size: 16px;
}
/* 人物＋吹き出し */
.person {
	position: absolute;
    bottom: -4%;
    right: 0px;
	width: 231px;
}
.person img{
	width: 100%;
	height: auto;
}
#section6 {
	background: #D8EAEB;
	padding: 130px 0px;
}
#section6 .inner{
	max-width: 1140px;
		width: 90%;
	margin: 0 auto;
}
#section6 .box{
	text-align: center;
	background: #fff;
	border: #BBD2E3  solid 2px;
	border-radius: 20px;
	padding: 50px;
	box-sizing: border-box;
	margin-bottom: 50px;
}

#section6 .tag{
	font-family: "Overpass", sans-serif;
	background: #05ACBA;
	display: inline-block;
	width: 126px;
	text-align: center;
	border-radius: 9999px;
	padding: 5px 0px 0px;
	color: #fff;
	font-size: 18px;
}
#section6 .box .box_title{
	color: #0B3FB1;
	font-size: 30px;
	font-weight: bold;
	text-align: center;	
	margin: 10px 0px 20px;
}
#section6 .box .beforeafter_wrap {
    display: flex;
    align-items: center;       /* 上下中央揃え */
    justify-content: center;   /* 横方向中央揃え */
    gap: 20px;                 /* 子要素間の余白を統一 */
	margin-bottom: 30px;
}

/* 矢印画像だけに余白を付けたい場合 */
#section6 .box .beforeafter_wrap span img {
    display: block;
    width: auto;   /* 必要に応じてサイズ調整 */
    height: auto;
}

/* before/after画像もブロック化 */
#section6 .box .beforeafter_wrap div img {
    display: block;
    max-width: 100%;  /* レスポンシブ対応 */
    height: auto;
}
#section6 .box .txt{
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	line-height: 29px;
}
#section6 .box .txt em{
	color: #0B3FB1;
}

#section7 {
	background: #D8EAEB;
	padding-bottom: 130px;

}
#section7 .inner{
	max-width: 1140px;
		width: 90%;
	margin: 0 auto;
}
#section7 .inner .box_wrap{
	display: flex;
	flex-wrap: wrap;
}
#section7 .inner .box_wrap .box{
	width: 49%;
	margin-right: 2%;
	padding: 40px;
	box-sizing: border-box;
	border-radius: 20px;
	background-color: #fff;
	border: #BBD2E3 2px solid;
	margin-bottom: 30px;
}
#section7 .inner .box_wrap .box:nth-child(2n){
	margin-right: 0px;
}
#section7 .profile{
	display: flex;	
	align-items: center;
	border-bottom: #BBD2E3 solid 1px;
	padding-bottom: 12px;
}
#section7 .profile .icon{
	margin-right: 30px;
}
#section7 .profile .icon{
	width: 117px;
	height: auto;
}
#section7 .star{
	font-size: 25px;
	color: #0B3FB1;
	font-family: "Overpass", sans-serif;
}
#section7 .star img{
	width: 25px;
	height: auto;
	margin-right: 5px;
}
#section7  .area{
	font-size: 22px;
	font-weight: bold;
}
#section7  .area  span{
	color: #fff;
	background-color: #05ACBA;
	display: inline-block;
	padding: 2px 20px;
	font-size: 20px;
	border-radius: 9999px;
	margin-right: 10px;
}
#section7 h3.title{
	margin:25px 0px 20px;
	color: #0B3FB1;
	font-size: 24px;
	font-weight: bold;
}
#section7 p{
	font-size: 18px;
	line-height: 35px;
}
#section7 p em{
	background-image: linear-gradient(#D8EAEB, #D8EAEB);
	 background-repeat: no-repeat;
  background-size: 100% 1.7em; /* 高さを調整 */
  background-position: 0 100%; /* 下に配置 */
	display: inline;}
#section8{
  background: url("../images/con8_backimg.png") no-repeat left center / cover;
  position: relative;
  padding: 80px 20px 100px;
}
#section8 .inner{
	max-width: 1140px;
		width: 90%;
	margin: 0 auto;
	display: flex;
	align-items: flex-start
}
#section8 .inner .title_box{
	width: 40%;
	margin-right: 10%;
	text-align: center;
	margin-top: 30px;
}
#section8 .inner .title_box img{
	max-width: 180px;
	height: auto;
}
#section8 .inner .title_box h2{
	text-align: center;
	font-size: 34px;
	font-weight: bold;
}
#section8 .inner .title_box h2 span{
	color: #05ACBA;
	font-size: 18px;
	font-family: "Overpass", sans-serif;
	display: block;
}
#section8 .inner .area_list{
	width: 50%;
}
#section8 .inner .area_list .title{
	color: #fff;
	padding: 4px  15px;
	font-size: 18px;
	font-weight: bold;
	border-radius: 100px;
}
#section8 .inner .area_list .title:nth-of-type(1){
	background-color: #2BB1C9;
}
#section8 .inner .area_list .title:nth-of-type(2){
	background-color: #CF2B5E;
}
#section8 .inner .area_list .title:nth-of-type(3){
	background-color: #F3B711;
}
#section8 .inner .area_list .title:nth-of-type(4){
	background-color: #97BD23;
}
#section8 .inner .area_list p{
	font-size: 16px;
	padding: 4px 10px 30px;
}

#footer_contact{
background: linear-gradient(-30deg, #062C9B 50%, #0B3FB1 50%);
	padding: 80px 0px;
}
#footer_contact .inner{
	max-width: 900px;
		width: 90%;
	margin: 0 auto;
	text-align: center;
}
#footer_contact .inner .title {
  font-size: 38px;
  font-weight: bold;
  color: #fff;
  position: relative;
  text-align: center; /* 中央寄せにする場合 */
}

#footer_contact .inner .title::before,
#footer_contact .inner .title::after {
  content: "";
  display: inline-block;
  width: 35px; /* 線の長さ */
  height: 3px; /* 線の太さ */
  background: #fff; /* 線の色 */
  position: relative;
  top: -8px; /* テキストとの高さ調整 */
}

#footer_contact .inner .title::before {
  margin-right: 10px;
  transform: rotate(50deg); /* ／っぽく */
}

#footer_contact .inner .title::after {
  margin-left: 10px;
  transform: rotate(-50deg); /* ＼っぽく */

}
#footer_contact .inner .txt{
	margin: 30px 0px;
	font-size: 20px;
	font-weight: bold;
	line-height: 38px;
	color: #fff;
}
#footer_contact .inner .box_wrap{
	padding: 50px 10%;
	border-radius: 10px;
	background-color: #fff;
}
#footer_contact .inner .tel_box{
	display: flex;	
	justify-content: center;
	align-items: center;
	margin-bottom: 5px;
}
#footer_contact .inner .tel_box .time{
	background-color: #D7DEF0;
	font-size: 18px;
	color: #0B3FB1;
	padding: 5px 15px;
	display: inline-block;
	margin-right: 30px;
	font-weight: bold;
}
#footer_contact .inner .tel_box .tel_number{
	color: #0B3FB1;
	font-size: 44px;
	font-family: "Overpass", sans-serif;
	font-weight: bold;
	margin-top: 4px;
}
#footer_contact .inner .btn_wrap{
	display: flex;
	justify-content: center;
}
#footer_contact .inner .btn_wrap .mail_btn{
	margin-right: 20px;
}
.mail_btn a{
	display: inline-flex; 
	align-items: center;
  gap: 20px; /* テキストと矢印の間 */
  padding: 17px 30px;
	background-color: #0FA4FD;
	color: #fff;
	border-radius: 9999px;
	font-size: 18px;
	margin: 0 auto;
	font-weight: bold;
}
.mail_btn a:hover{
	text-decoration: none;
	background-color: #0084D3;
	transform: 3;
}
.mail_btn a::after{
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
}
.line_btn a{
	display: inline-flex; 
	align-items: center;
  gap: 38px; /* テキストと矢印の間 */
  padding: 17px 30px;
	background-color: #009DAA;
	color: #fff;
	border-radius: 9999px;
	font-size: 18px;
	margin: 0 auto;
	font-weight: bold;
}
.line_btn a:hover{
	text-decoration: none;
	background-color: #007983;
	transform: 3;
}
.line_btn a::after{
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
}
#footer {
		background-color: #343434;
		padding: 50px 0 30px;
		text-align: center;
	}
	#footer a{
		color: #fff;
	}
	#footer p{
		margin-bottom: 10px;
		color: #fff;
		font-size: 18px;
		font-weight: 900;
	}
	#footer p.copyright{
		font-size: 13px;
		font-weight: 500;
	}
#footer li a {
		color: #fff;
	}


	body #footnav {
		display: none;
		width: 100%;
		z-index: 99;
		position: fixed;
		bottom: 0;
	}
	
	body #footnav ul {
		display: flex;
	}
	body #footnav ul li{
		width: 33.3%;
	}
body #footnav ul li a{
	display: block;
	text-align: center;
	color: #fff;
	   height: 78px;
}
body #footnav ul li a img{
	margin-top: 12px;
	margin-bottom: 4px;
	width: 26px;
	height: auto;
}
body #footnav ul li a.tel{background-color: #0C3FB1;}
body #footnav ul li a.mail{background-color: #04A1EB;}
body #footnav ul li a.line{background-color: #009DAA;}
body #smpNav { display: none;}



@media only screen and (max-width:1210px) {	
	
}
@media only screen and (max-width:900px) {
	#header{
		justify-content: center;
		padding:5px 40px;
	}
	.header_contact{display: none;}
	body #container {
    padding-top: 56px;
}
	#section1{padding-top: 40px;}
	#section1 h2 {		max-width: 550px;}
	#section1 .txt {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin: 10px auto 25px;
    line-height: 32px;
}
#section1 .box .icon {
    position: absolute;
    left: 50%;
    bottom: -20px;
    transform: translateX(-50%);
    width: 40px;
    height: 40px;
}
	#section1 .box .box_txt{
	    font-size: 18px;
    padding: 24px 0px;
	}
#section1 .recommendation .txt{
	font-size: 22px;
	}
	#section1 .recommendation .txt em{
		font-size: 25px;
	}
	#section1 .recommendation span{font-size: 18px;	}
	
	#section2{    padding-bottom: 80px;	}
	#section2 .box{padding: 2%;}
	#section2 .box1 .pc{display: none;}
	#section2 .box1 .sp{display: block;}
	#section2 .box1 img{width: 50%;}
#section2 .box1 .txt_box{
	margin-left: 40px;
	width: 50%;
}
#section2 .box1::before {
    top: -53px;
    right: -30px;
    width: 138px;
    height: 84px;
}
#section2 .box2_box4 .box .title{font-size: 20px;	}
#section2 .box2_box4 .box .title em{font-size: 30px;	}
#section2 .box2_box4 .title .sp{ display: block;}

#section2 .box2_box4 .box .price{font-size: 17px;}
#section2 .box2_box4 .box .price em{font-size: 30px;}
	#section2 .box5{flex-wrap: wrap;}
	#section2 .box5 p{font-size: 24px;}
#section2 .box5 em{font-size: 30px;}
	#section2 .box .price{font-size: 17px;}
#section2 .box5 .price em {font-size: 30px; line-height: 1;}
#section2 .box5 p:first-child {  width: 100%;text-align: center;  margin-right: 0px;margin-bottom: 10px;}
	#section2 .menu_list .titile{        font-size: 18px;}
	#section2 .menu_list ul{width: 90%; flex-wrap: wrap;}
	#section2 .menu_list ul li{font-size: 16px;    padding: 8px 20px; width: 32%;margin-right: 2%;margin-bottom: 10px;}
	#section2 .menu_list ul li:nth-of-type(3n){margin-right: 0px;}
	.btn a{    gap: 30px;}
	#section3{padding-top: 80px;}
	#section3 h2.title{    max-width: 587px;}
	#section3 .box_wrap .box::before{    top: -24px;font-size: 35px;}
	#section3 .box_wrap .box .box_title{    font-size: 20px; padding: 10px 0px;}
#section3 .box_wrap .box .txt {    font-size: 15px;padding-top: 10px;}
#section4 h2.title {    font-size: 28px;}
#section4 h2.title span {    font-size: 14px;}
	#section3 .inner{    padding: 50px 0px}
	#section4{padding-top: 80px; padding-bottom: 80px;}
#section4 .box .box_txt h3 {
    font-size: 26px;
    margin-bottom: 15px;
    padding-bottom: 0px;
}
	#section4 .box .box_txt h3 span{font-size: 40px;padding-right: 10px;}
	#section4 .box .box_txt p{    font-size: 15px;    line-height: 28px;}
	#section5 .inner{padding: 50px 5% 50px;}
#section5 h2.title {    max-width: 280px;}
#section5 .pickup_menu .pickup_menu_txt .title {	font-size: 24px;}
	#section5 .pickup_menu .pickup_menu_txt .price em{font-size:26px; }
	#section5 .pickup_menu .pickup_menu_txt .price{font-size: 16px;}
	#section5 .pickup_menu .pickup_menu_txt .title_box{    margin-bottom: 15px;    padding-bottom: 5px;}
	#section5 .pickup_menu .pickup_menu_txt .txt{    font-size: 16px;    line-height: 29px;}
	#section5 .sub_menu .box .txt_box .title{font-size: 16px;}
	#section5 .sub_menu .box .txt_box .price em{font-size: 18px;}
	#section5 .sub_menu .box .txt_box .price{font-size: 12px;}
	#section5 .sub_menu .box img{margin-bottom: 8px;}
	#section5 .sub_menu .box{margin-bottom: 15px;}
	#section5 .menu_list .titile{font-size: 18px;}
	#section5 .menu_list{width: 100%;}
	#section5 .menu_list ul li{width: 49%;}
	#section5{padding-bottom: 80px;}
.gift-banner {	background: url("../images/flower-bg_sp.jpg") no-repeat left center / cover;}
	.banner-content .txt{    font-size: 18px;
    line-height: 29px;}
	.banner-content{  padding-right: 6%;}
	.person{    width: 190px;  }
	#section6{padding: 80px 0px;}
	#section6 .box{ padding: 30px 5%;}
	#section6 .tag{    font-size: 15px;    width: 100px;}
	#section6 .box .box_title {font-size: 20px; margin: 7px 0px 10px;}
	#section6 .box .txt{font-size: 16px;
    line-height: 24px;}
	#section7 .inner .box_wrap .box{padding: 3%;}
	#section7 .star img{width: 18px;}
	#section7 .star {    font-size: 20px;}
	#section7 .area span{font-size: 15px;}
	#section7 .area{font-size: 16px;}
	#section7 .profile .icon{width: 80px;margin-right: 15px;}
	#section7 h3.title {    margin: 15px 0px 10px;    font-size: 18px;}
	#section7 p {
    font-size: 16px;
    line-height: 30px;}
	#section7 .inner .box_wrap .box{margin-bottom: 15px;}
	#section7{padding-bottom: 80px;}
	#section8{		background: url("../images/con8_backimg_sp.png") no-repeat left center / cover;}
	#section8 .inner .title_box{margin-top: 40px;}
	#footer_contact .inner .title{font-size: 34px;}
	#footer_contact .inner .txt {
    margin: 20px 0px;
    font-size: 16px;
    line-height: 28px;
}
	#footer_contact .inner .tel_box .tel_number{font-size: 40px;}
	#footer_contact .inner .tel_box .time{margin-right: 10px;}
	#footer_contact .inner .box_wrap {padding: 5% 5%;}
	#footer{padding: 50px 0 100px;}
	body #footnav {
		display: block;
		width: 100%;
		z-index: 99;
		position: fixed;
		bottom: 0;
	}

	body #footnav ul {
		display: flex;
	}
body #footnav ul li {
    font-size: 16px;
}
#footnav p .sp{display: none;}
	

}


	@media only screen and (max-width:580px) {
		#header .region_icon li {
    width: 56px;
    padding: 3px 0px;
    font-size: 14px;
    margin-right: 2px;
}
	#header {
        padding: 5px 4%;
    }
		#section1 .txt {        font-size: 18px;}
		#section1 .box_wrap {flex-wrap: wrap;}
		#section1 .box_wrap .box{width: 100%;margin-bottom: 30px;}
		#section1 .recommendation .txt em {
        font-size: 22px;
    }
	    #section1 .recommendation .txt {
        font-size: 19px;
        padding: 0px 5%;
        line-height: 30px;
    }
	#section1 .txt{margin: 15px auto 15px;}
		#section1 .recommendation::after {width: 40px;}
	#section1 .recommendation_wrap {    padding: 50px 0px 50px;}
		#section2 { padding-bottom: 50px;}
	#section2 h2.title {height: 280px;}
	#section2 h2.title img {
    max-width: 360px;
    width: 80%;
    margin: 0 auto;
}
	    #section2 .box1::before {right: -10px;}
		#section2 .box2_box4{ flex-wrap: wrap;}
		#section2 .box2_box4 .box{width: 100%;}
	    #section2 .box2_box4 .title .sp { display: none; }
		#section2 .box1{flex-wrap: wrap;}
		#section2 .box1 img{width: 100%;}
	    #section2 .box1 .txt_box {
        margin-left: 0px;
        width: 100%;
    }
		#section2 .box2_box4 .box {margin-bottom: 10px;}
	#section2 .box .title {font-size: 26px;}
		#section2 .box .title em {    font-size: 40px;}
		#section2 .box .price em {			font-size: 40px;}
		#section2 .box{padding: 2%;}
		#section2 .box1 .pc{display: block;}
	#section2 .box1 .sp{display:  none;}
		#section2 .box .title {margin-top: 8px;}
		#section2 .box5 p:first-child{padding-top: 10px;margin-bottom: 0px;}
		    #section2 .box5 p {padding-top: 10px;    }
			#section3 { padding-top: 50px; }

		#section3 h2.title .pc{display: none;}
#section3 h2.title .sp{display: block;}
		#section3 .box_wrap{flex-wrap: wrap;}
		#section3 .box_wrap .box{width: 100%;margin-bottom: 40px;}
		#section3 .box_wrap .box::before{        left: 50%; margin-left: -20px;}
			#section3 .box_wrap .box:nth-of-type(3){margin-bottom: 0px;}
	    #section4 {
        padding-top: 50px;
        padding-bottom: 50px;
    }
		#section4 .box{ flex-wrap: wrap;  margin-bottom: 60px;}
		#section4 .box .box_txt{width: 100%;}
		#section4 .box .box_img{width: 100%;}
		#section4 .box:nth-of-type(1){flex-direction: column-reverse;}
		#section4 .box:nth-of-type(3){flex-direction: column-reverse;}
		#section4 .box .box_img{margin-bottom: 20px;}
		    #section5 {padding-bottom: 50px; }
		#section5 .pickup_menu{flex-wrap: wrap;}
		#section5 .pickup_menu .pickup_menu_txt{width: 100%;}
		#section5 .pickup_menu .pickup_menu_img{width: 100%;}
		#section5 .pickup_menu:nth-of-type(1){flex-direction: column-reverse;}
		#section5 .pickup_menu:nth-of-type(3){flex-direction: column-reverse;}
		#section5 .pickup_menu .pickup_menu_img{margin-bottom: 15px;}
		#section5 .sub_menu .box {    width: 49%;}
		#section5 .sub_menu .box:nth-of-type(3n) {margin-right: 2%;}
		#section5 .sub_menu .box:nth-of-type(2n) {margin-right: 0px;}
		.btn a {font-size: 16px;}
		.banner{display: none;}
		.gift-banner{display: none;}
	    #section6 {
        padding: 50px 0px;
    }
		#section6 h2.title {
    width: 90%;
    margin: 0 auto;
}
		#section6 .box{margin-bottom: 30px;}
		#section7{padding-bottom: 50px;}
		#section7 h2.title {
    width: 90%;
    margin: 0 auto;
}
	#section7 .inner .box_wrap .box{width: 100%;margin-right: 0px;}
		#section8{padding: 50px 0px;}
		#section8 .inner{flex-wrap: wrap;}
		#section8 .inner .title_box{width: 100%;margin-right: 0px;margin-top: 0px;margin-bottom: 15px;}
		#section8 .inner .area_list{width: 100%;}
		#section8 .inner .title_box h2{font-size: 25px;}
		#section8 .inner .title_box img{max-width: 140px;}
		#section8 .inner .title_box h2 span{font-size: 14px;}
		#footer_contact .inner .title{font-size: 26px;}
		#footer_contact .inner .tel_box{display: block;}
		#footer_contact .inner .tel_box .tel_number{display: block;}
		#footer_contact .inner .tel_box .time{font-size: 15px;}
		#footer_contact .inner .btn_wrap{display: block;}
		#footer_contact .inner .btn_wrap .mail_btn {
    margin-right: 0px;
    margin-bottom: 10px;
}
	#footnav p .sp{display: block;}
	body #footnav ul li a {
    height: 93px;
    line-height: 21px;
}
		
}
		

	@media only screen and (max-width:460px) {
	#header .siteTitle .logo {    margin-right: 5px;}
	    #header .region_icon li {
        width: 46px;
        padding: 2px 0px;
			font-size: 12px;}
	    body #container { padding-top: 35px; }
	 #section1 .recommendation .txt {	font-size: 16px;}
	#section1 .recommendation .txt em {	font-size: 18px;}	
	    #section2 h2.title {   height: 250px; }
	    #section2 .box5 p {   font-size: 20px;}
		    #section2 .box .price em {font-size: 30px; }
		#section2 .menu_list .titile{font-size: 15px;padding: 7px 20px;}
		#section2 .menu_list ul{padding: 20px 0px;}
		#section2 .menu_list ul li{width: 49%;}
	    #section2 .menu_list ul li:nth-of-type(3n) { margin-right: 2%;}
		#section2 .box2_box4{margin-bottom: 0px;}
	    #section2 .menu_list ul li:nth-of-type(2n) { margin-right: 0px;}
	    #section3 .inner {  padding: 30px 0px;}
	#section3 .box_wrap .box::before {
        left: 7px;
        margin-left: 0px;
		top: 0;
    }
	#section4 h2.title { font-size: 20px; margin-bottom: 20px;}
		    #section4 .box .box_txt h3 {font-size: 22px;}
	 #section4 .box .box_txt h3 span {
        font-size: 35px;
        padding-right: 5px;
    }
	    #section5 h2.title {
        max-width: 220px;
			margin-bottom: 0px;
    }
	    #section5 .inner {
        padding: 30px 5%;
    }
	    #section5 .pickup_menu .pickup_menu_txt .title {
        font-size: 18px;
        text-align: left;
    }
	    #section5 .pickup_menu .pickup_menu_txt .price {
        font-size: 14px;
    }
	    #section5 .pickup_menu .pickup_menu_txt .price em {
        font-size: 21px;
    }
	    #section5 .pickup_menu .pickup_menu_txt .txt {
        font-size: 14px;
        line-height: 25px;
    }
	#section5 .sub_menu .box .txt_box {
		display: block;}
	#section5 .menu_list ul {
		padding: 15px 0px 10px;}
	    #section5 .menu_list ul li {
        width: 100%;font-size: 14px;
    }
	    #section5 .menu_list .titile {
font-size: 15px;
        padding: 7px 20px;
		    margin-top: -19px;
    }
		#section5 .menu_list{margin: 30px auto;}
		#section6 .box .beforeafter_wrap{  display: block;}
		#section6 .box .beforeafter_wrap span img {transform: rotate(90deg);margin: 10px auto; width: 20px;}
	    #section7 .profile .icon {
        width: 70px;
        margin-right: 8px;
    }
	#section7 .area span {padding: 2px 10px;}
	#section7 .star img {
        width: 16px;
    }
	    #section7 .star {
        font-size: 18px;
    }
	    #section7 p {
        font-size: 15px;
        line-height: 24px;
    }
		#section8 .inner .area_list .title{font-size: 16px;}
	#section8 .inner .area_list p {
    font-size: 15px;
    padding: 4px 10px 20px;
}
#footer_contact .inner .title {
        font-size: 19px;
    }
	#footer_contact .inner .title::before {
    margin-right: 0px;
    transform: rotate(70deg);
}
	#footer_contact .inner .title::after {
    margin-left: 0px;
    transform: rotate(-70deg);
}
	#footer_contact .inner .title::before, #footer_contact .inner .title::after {    width: 20px;
    top: -6px;
}
		#footer_contact{padding: 50px 0px;}
	    #footer_contact .inner .tel_box .tel_number {
        font-size: 34px;
    }
		#footer p{font-size: 16px;}
	body #footnav ul li a img {		width: 22px;}
	    body #footnav ul li a {
        height: 83px;
        line-height: 18px;
    }
		.mail_btn a{font-size: 16px;}
		.line_btn a{font-size: 16px;}

	}