@charset "utf-8";

/*** common ***/
html, body, main, aside, article, section, nav, header, footer, div, p, dl, dt, dd { margin:0; padding:0; }
body { width:100%; font-size: 0.9375rem; background-color: #fff; }
header, main, footer { display:block; }
main { overflow:hidden; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight:normal; margin:0; padding:0; }
/*h1, h2 { display:none; }*/
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img { max-width:100%; }
ul, ol { margin-top:0; margin-bottom:0; }
img { margin:0; padding:0; }
time { display:inline-block; }
address { font-style:normal; }
button, html [type="button"], [type="reset"], [type="submit"] { display:inherit; -webkit-appearance:button; cursor:pointer; border-style:none; color:inherit; margin:0 auto; }
textarea { resize:vertical; }
* { box-sizing:border-box; }

/*** base & conainter ***/

.container { margin:0 auto; padding:0; overflow:hidden; }
.container_visible { overflow:visible; }


body {
	/*background-color:#ff801c;*/
	/*transition: left 0.5s;*/
}

header {
	height: 120px;
	width:100%;
	padding:10px;
	color:#000;
	background-color:#fff;
	position:fixed;
	z-index:100;
}

main {
}

footer {
}


.container {
	max-width: 1100px;
	padding:0 20px;
}
.container.nospace { padding: 0; }
.container.wide { max-width: 1200px; }


@media screen and (min-width: 600px) {
	header {
		z-index:9999;
	}
}


/*** fontfamily ***/
body { font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif; }

#flow .flow_step .flow_step_no p span,
#flow .flow_step .flow_step_no h3,
.popup-inner .popup-right .popup-title
{ font-family:游明朝,"Yu Mincho Demibold","YuMincho Demibold","YuMincho","Hiragino Mincho ProN",HGS明朝B,"HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝",Georgia,serif; font-weight:500; }


/*** animation keyframe ***/
@keyframes fadeIn{
	0%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}


/*** common ***/
.popup {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
  transition: .6s;
}
.popup.is-show {
  opacity: 1;
  visibility: visible;
}
.popup-inner {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 80%;
  /* max-width: 1200px; */
  max-width: 700px;
  /*padding: 50px;*/
  background-color: #fff;
  z-index: 2;
}
.popup-inner img {
  display:block;
  width: 100%;
}
.popup-inner .popup-content {
	overflow: hidden;
}
.popup-inner .popup-left {
	float:left;
	width: 60%;
}
.popup-inner .popup-right {
	float:right;
	width: 40%;
	padding: 30px;
}

.popup-inner .popup-right .popup-title {
	margin-bottom: 1em;
	padding-left: 1em;
	font-size: 1.5rem;
	border-left: 4px solid #eb6100;
}
.close-btn {
  position: absolute;
  right: 5px;
  top: 5px;
  width: 26px;
  height: 26px;
  line-height: 26px;
  text-align: center;
  cursor: pointer;
}
.close-btn i {
  font-size: 20px;
  color: #333;
}
.black-background {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.8);
  z-index: 1;
  cursor: pointer;
}

@media screen and (max-width: 750px) {
	.popup-inner .popup-left,
	.popup-inner .popup-right {
		width: 100%;
	}
}

#page_top{
  width: 70px;
  height: 70px;
  position: fixed;
  right: 10px;
  bottom: 20px;
  background: #666;
  opacity: 0.6;
  border-radius: 50%;

  transition: opacity 1s;
  visibility: hidden;
}
#page_top.is-fadein {
  transition: opacity 1s;
  visibility: visible;
  opacity: 0.6;
}

#page_top a{
  position: relative;
  display: block;
  width: 70px;
  height: 70px;
  text-decoration: none;
  color: #fff;
  font-size: 0.8rem;
  padding-top: 0.4em;
  text-align: center;
}
#page_top a::before{
  content: '';
  width: 20px;
  height: 20px;
  border: 0px;
  border-top: solid 5px #fff;
  border-right: solid 5px #fff;
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  position: absolute;
  top: 70%;
  left: 43%;
  left: calc(50% - 10px);
}
#page_top a:hover{
	opacity: 0.5;
}



/*** header ***/
header {
	overflow:hidden;
}
header .container {
	position: relative;
	height: 100%;
}

header a {
	/*color: #fff;*/
	text-decoration: none;
}

header .logo {
	position: absolute;
	/*top: 25px;*/
	/*left: 10px;*/
	z-index: 100;
	margin: 18px 0 10px 10px;
	display: inline-block;
	/*height: 60px;*/
	/*margin: 12px 0;*/
	/*border: 2px solid #b69715;*/
}
header .logo a {
	/*display: block;*/
	width: 150px;
	height: 70px;
	background-color: #fff;
	/*height: 60px;*/
	/*padding-left: 84px;*/
	padding: 45px 2px 5px;
	/*background-image: url(../img/top_return.png), url(../img/logo-txt.png)*/;
	background-repeat: no-repeat, no-repeat;
	/*background-position: top 10px center, bottom 5px center;*/
	/*line-height: 30px;*/
	/*vertical-align: middle;*/
	text-align:center;
	white-space: nowrap;
	text-indent: 120%;
	overflow: hidden;
	margin-top: 6px;
}

@media screen and (min-width: 751px) {
	header .logo img {
	filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.2));
}
}

header .logo a:hover { opacity: 0.8; }


header .bnrarea {
	max-width: 1100px;
	height: 100px;
	margin: 0 auto;
}
header .bnrarea > div {
	float: right;
}
header .bnrarea > div > * {
	text-align:right;
	display: inline-block;
}

header .campaign a {
	display: block;
	width: 570px;
	height: 75px;
	margin: 14px 0;
	background: url(../img/bnr_campaign.png) no-repeat left top;
	white-space: nowrap;
	text-indent: 120%;
	overflow: hidden;
	filter: drop-shadow(6px 5px 8px rgba(79, 78, 79, 0.23));
}
header .campaign a:hover { opacity: 0.8; }


header .tel a {
	display: block;
	width: 315px;
	height: 82px;
	margin: 11px 0;
	background: url(../img/bnr_tel.png) no-repeat left top;
	background-size: cover;
	white-space: nowrap;
	text-indent: 120%;
	overflow: hidden;
	filter: drop-shadow(6px 5px 8px rgba(79, 78, 79, 0.23));
}
header .tel a:hover { opacity: 0.8; }

header .followme {
	display: none;
}


@media screen and (max-width: 910px) {
	header .campaign a {
		width: 230px;
		/*height: 86px;*/
		/*margin: 0;*/
		border:1px solid #f6be68;
		border-radius: 5px;
		background-color: #fef4a9;
		background:	url(../img/icon_finger.png) no-repeat left 30px center/15%,
					url(../img/icon_campaign-txt.png) no-repeat right 35px center/50%,
					linear-gradient(to bottom, #fef4a9, #ffcc00);
		filter: none;
	}
}

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

	header {
		height: 60px;
		padding: 5px;
	}

	header .logo {
		margin: 0px 0 5px 5px;
	}

	header .logo a {
		/*width: 75px;*/
		/*height: 35px;*/
		/*padding: 22px 1px 2px;*/
		/*background-image: url(../img/top_return.png), url(../img/logo-txt.png)*/;
		background-repeat: no-repeat, no-repeat;
		/*background-position: top 5px center, bottom 2px center;*/
		background-size: 60%, 60%;
		margin-top: -3px;
	}

	header .logo a img {
		width: 60%;
		height: 60%;
	}
	
	
	header .bnrarea {
		height: 50px;
	}

	header .campaign a {
		width: 115px;
		height: 43px;
		margin: 0;
		border:1px solid #f6be68;
		border-radius: 5px;
		background-color: #fef4a9;
		background:	url(../img/icon_finger.png) no-repeat left 5px center/25%,
					url(../img/icon_campaign-txt.png) no-repeat right 6px center/60%,
					linear-gradient(to bottom, #fef4a9, #ffcc00);
		filter: none;
	}

	header .tel a {
		width: 42px;
		height: 42px;
		margin: 0;
		border-radius: 5px;
		background-color: #e83828;
		background-image: url(../img/icon_tel.png);
		background-repeat: no-repeat;
		background-position: center center;
		background-size:60%;
		white-space: nowrap;
		text-indent: 100%;
		overflow: hidden;
		filter: none;
	}
}
@media (min-width: 1860px) {
	header .followme {
		display: inline-block;
		width: 366px;
		height: 50px;
		position: absolute;
		top: 40px;
		right: 10px;
		right: calc((100% - 1100px) / 2 - 366px - 10px);
		background: url(../img/followme.png) no-repeat left top;
		white-space: nowrap;
		/*text-indent: 120%;*/
		padding-left: 366px;
		overflow: hidden;
	}
}


/*** mainvisual ***/
#mainvisual {
	min-height: 100vh;
	padding-top: 170px;
	background-image: url(../img/mainvisual_02_202506.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: left 65% bottom;
}
#mainvisual > div {
	height: 100%;
	text-align: center;
}
#mainvisual > div p {
	display: inline-block;
}
#mainvisual > div img {
	display: inline-block;
	max-width: 100%;
}


#mainvisual > div .mv-title {
	padding: 0 40px;
}
#mainvisual > div .mv-title p {
	width: 48%;
	min-width: 480px;
}

#mainvisual > div .mv-setplan {
	margin: 50px 0;
}

#mainvisual > div .mv-price {
	margin: 50px 0;
}

#mainvisual > div .mv-arrow {
	max-width:112px;
	margin: 0 auto;
}

@media screen and (max-width: 750px) {
	#mainvisual {
		padding-top: 85px;
		/*margin-top: 60px;*/
		/*padding-top: 25px;*/
		/*height: calc(100vh - 60px);*/
		/*min-height: calc(100vh - 60px);*/
	}

	#mainvisual > div .mv-setplan {
		margin: 25px 0;
	}
	#mainvisual > div .mv-price {
		margin: 25px 0;
	}
}

@media screen and (max-width: 1099px) {
	#mainvisual > div .mv-title p {
		width: 100%;
		min-width: auto;
	}
}


/*** campaign ***/
#campaign {
}

#campaign #campaign_digest {
	padding: 30px 0;
	color: #fff;
	background-color: #eb6100;
}

#campaign h2 {
	/*max-width: 700px;*/
	max-width: 600px;
	margin:0 auto;
	padding:0 40px;
}
#campaign h2 span {
	display: block;
	width: 100%;
	height:0;
	padding-top: 8%;
	background: url(../img/campaign/title.png) no-repeat;
	background-size: cover;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}

#campaign dl {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: 40px 0 0;
}

#campaign dl > div {
	width: 40%;
	width: calc(50% - 15px);
	max-width: 352px;
	/*margin-bottom: 40px;*/
	margin: 0 5px 40px 10px;
}

#campaign dt {
}
#campaign dt a,
#campaign dt p {
	display: block;
	width: 100%;
	height: 0;
	padding-top: 32.4%;
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: cover;
	cursor: pointer;
}
#campaign dt a:hover,
#campaign dt p:hover {
	opacity: 0.8;
}
#campaign dt #campaign_tochi      { background-image: url(../img/campaign/tochi.png); }
#campaign dt #campaign_boseki     { background-image: url(../img/campaign/boseki.png); }
#campaign dt #campaign_eitaikuyou { background-image: url(../img/campaign/eitaikuyou.png); }
#campaign dt #campaign_eitaikanri { background-image: url(../img/campaign/eitaikanri.png); }

#campaign dd {
	text-align: center;
	font-size: 0.75rem;
}
#campaign dd span {
	/*word-break: keep-all;*/
	display: inline-block;
}


#campaign #campaign_detail h3 {
	max-width: 1045px;
	margin:50px auto 20px;
	padding:0 40px 10%;
	background: url(../img/campaign/txt-arrow2.png) no-repeat center bottom;
	background-size: 25%;
}
#campaign #campaign_detail h3 span {
	display: block;
	width: 100%;
	height:0;
	padding-top: 9.7%;
	background: url(../img/campaign/current.png) no-repeat;
	background-size: cover;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}

#campaign #campaign_detail section {
	width: 100%;
}

#campaign #campaign_detail section .campaign_detail_container {
	position: relative;
	margin-bottom: 50px;
	padding: 0 0 0;
}


#campaign #campaign_detail section .campaign_detail_container .campaign_detail_no {
	position: relative;
	display: block;
	width: 30%;
	min-width: 98px;
	margin-left: 25px;
	z-index: 2;
}
#campaign #campaign_detail section .campaign_detail_container .campaign_detail_no span {
	display: block;
	width: 100%;
	height: 0;
	padding-top: 54%;
	/*background-image: url(../img/campaign/no1.png);*/
	background-repeat: no-repeat;
	background-size: contain;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}
/*#campaign #campaign_detail section .campaign_detail_container#campaign_detail_no1 .campaign_detail_no span { background-image: url(../img/campaign/no1.png); }*/
#campaign #campaign_detail section .campaign_detail_container#campaign_detail_no2 .campaign_detail_no span { background-image: url(../img/campaign/no2.png); }


#campaign #campaign_detail section .campaign_detail_box {
	padding:13% 50px 15px;
	padding-top: calc(10% + 15px);
	margin: -10% 0 0;
	height: 100%;
	border:7px solid #eb6100;
	background-color: #fff;
	background: linear-gradient(to top, #ed731d, #ffdf42 15%, #ffffff 43%);
	border-radius: 15px;
	box-shadow: 3px 3px 10px 0px rgba(255,255,255,0.5) inset,
				-3px -3px 10px 0px rgba(0,0,0,0.5) inset,
				5px 5px 8px 0px rgba(0, 0, 0, 0.4);
	font-size: 1.35rem;
}
#campaign #campaign_detail section .campaign_detail_box + div.campaign_detail_box {
	margin-top: 50px;
}

#campaign #campaign_detail section .campaign_detail_box h4 {
	margin: 0 auto 25px;
	text-align: center;
	position: relative;
	z-index: 5;
}

#campaign #campaign_detail section .campaign_detail_box > div {
	position: relative;
}
#campaign #campaign_detail section .campaign_detail_box > div::after {
	content:'';
	display: block;
	clear:both;
	overflow: hidden;
}

#campaign #campaign_detail section .campaign_detail_box p {
	text-align: center;
	width: 600px;
	float: right;
	/*text-align: right;*/
}

#campaign #campaign_detail section .campaign_detail_box p > img {
	max-width: 100%;
}

#campaign #campaign_detail section .campaign_detail_box img {
	max-width: 100%;
}

#campaign #campaign_detail section .campaign_detail_box > div ul {
	padding-left: 1em;
	position: absolute;
	width: 100%;
	width: calc(100% - 600px);
}

#campaign #campaign_detail section #campaign_detail_no2 .campaign_detail_box {
	padding-bottom: 40px;
}
#campaign #campaign_detail section #campaign_detail_no2 .campaign_detail_box p {
	float: none;
	width: 100%;
}

#campaign #campaign_detail section .campaign_detail_container .campaign_giftcard {
	position: absolute;
	top: 5px;
	right: 30px;
	display: block;
	width: 62%;
	min-width: 200px;
	margin-left: 25px;
	z-index: 2;
}
#campaign #campaign_detail section .campaign_detail_container .campaign_giftcard span {
	display: block;
	width: 100%;
	height: 0;
	padding-top: 50.4%;
	background-image: url(../img/campaign/giftcard.png);
	background-repeat: no-repeat;
	background-size: contain;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}

@media screen and (max-width: 999px) {
	#campaign #campaign_detail section .campaign_detail_box p {
		float: none;
		width: 100%;
	}

	#campaign #campaign_detail section .campaign_detail_box > div ul {
		position: static;
		width: 100%;
	}
}

@media screen and (max-width: 749px) {
	#campaign dl > div {
		margin-bottom: 20px;
	}

	#campaign #campaign_detail section .campaign_detail_box {
		padding:13% 20px 10px;
		font-size: 0.955rem;
	}

}


/*** point ***/
#point {
}

#point #point_anxiety {
	position: relative;
}

#point #point_anxiety .container {
	position: relative;
}

#point #point_anxiety h2 {
	position: relative;
	display: block;
	width: 30%;
	min-width: 98px;
	margin-left: 25px;
	z-index: 2;
}
#point #point_anxiety h2 span {
	display: block;
	width: 100%;
	height: 0;
	padding-top: 30.6%;
	background-image: url(../img/point/anxiety_title.png);
	background-repeat: no-repeat;
	background-size: contain;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}

#point #point_anxiety #point_anxiety_title {
	position: absolute;
	top: 0;
	left: 0;
	width:100%;
}
#point #point_anxiety #point_anxiety_body {
	position: relative;
	padding-top: 4%;
}
#point #point_anxiety #point_anxiety_body > div {
	background-color: #f8faa9;
	/* padding-top: 9%; */
	padding-top: 3%;
}
#point #point_anxiety #point_anxiety_body > div > .container > div {
	position: relative;
	display: block;
	background: url(../img/point/anxiety_gb_pc_202501.png) no-repeat center bottom;
	background-size: contain;
	width: 100%;
	height: 0;
	padding-top: 61%;
	overflow: hidden;
}
#point #point_anxiety #point_anxiety_body > div > .container > div ul {
	display: none;
	position: absolute;
	top:0;
	left:0;
	list-style-type: none;
	padding-left: 0;
}
#point #point_anxiety #point_anxiety_body > div > .container > div ul li {
}

#point #point_anxiety h2 {
	position: relative;
	display: block;
	width: 40%;
	min-width: 98px;
	margin-left: 25px;
	z-index: 2;
}
#point #point_anxiety h2 span {
	display: block;
	width: 100%;
	height: 0;
	padding-top: 30.6%;
	background-image: url(../img/point/anxiety_title.png);
	background-repeat: no-repeat;
	background-size: contain;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}

#point #point_anxiety #point_anxiety_comment .container {
	margin-top: -5%;
}

#point #point_anxiety #point_anxiety_comment p {
	position: relative;
	display: block;
	width: 30%;
	left:70%;
	min-width: 98px;
	margin-left: 25px;
	z-index: 2;
}
#point #point_anxiety #point_anxiety_comment p span {
	display: block;
	width: 100%;
	height: 0;
	padding-top: 30.6%;
	background-image: url(../img/point/anxiety_comment.png);
	background-repeat: no-repeat;
	background-size: contain;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}
/*#point_anxiety_1 {
	background: url(../img/point/anxiety1.png) no-repeat left top;
}*/

#point .arrow {
	width: 35%;
	text-align: center;
	margin: 0 auto;
}
#point .arrow img {
	max-width: 100%;
}


#point #point_reason {
	margin:30px 0 0;
}

#point #point_reason h3 {
	margin:0 auto;
}
#point #point_reason h3 span {
	display: block;
	width: 100%;
	height:0;
	padding-top: 5%;
	background: url(../img/point/reason_title.png) no-repeat;
	background-size: cover;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}

#point #point_reason section {
	margin: 40px 0;
	overflow:hidden;
}

#point #point_reason section .point_reason_detail {
	width: 55%;
	float: left;
}
#point #point_reason section .point_reason_thumbs {
	width: 40%;
	float: right;
	text-align: center;
}
#point #point_reason section:nth-child(2n+1) .point_reason_detail {
	float: right;
}
#point #point_reason section:nth-child(2n+1) .point_reason_thumbs {
	float: left;
}


#point #point_reason section .sp {
	display: none;
}
#point #point_reason section h4 {
	margin-bottom: 1em;
}
#point #point_reason section img {
	max-width: 100%;
}

#point #point_reason1 {
}
#point #point_reason1 h4 {

}


@media screen and (max-width: 749px) {
	#point #point_anxiety #point_anxiety_body > div {
		padding-top: 9%;
	} 
	#point #point_anxiety #point_anxiety_body > div > .container {
		background: url(../img/point/anxiety_gb.png) no-repeat right 10px bottom;
		background-size: 50%;
	}
	#point #point_anxiety #point_anxiety_body > div > .container > div {
		background: none;
	}
	#point #point_anxiety #point_anxiety_body > div > .container > div ul {
		display: block;
	}
	#point #point_anxiety #point_anxiety_body > div > .container > div ul li {
		padding-left: 1.5em;
		padding-bottom: 0.3em;
		background-image: url(../img/point/checkbox.png);
		background-repeat: no-repeat;
		background-position: left top;
		background-size: 1.2em;
		font-size: 0.875rem;
	}

	#point #point_reason section .point_reason_detail,
	#point #point_reason section .point_reason_thumbs,
	#point #point_reason section .point_reason_detail:nth-child(2n+1),
	#point #point_reason section .point_reason_thumbs:nth-child(2n+1) {
		width: 100%;
		float: none;
	}
	#point #point_reason section .point_reason_thumbs {
		margin: 20px 0;
	}

	#point #point_reason section .pc {
		display: none;
	}
	#point #point_reason section .sp {
		display: inline;
	}
	#point #point_reason section .small {
		width: 80%;
	}

}


/*** compare ***/
#compare {
	background-color: #f8e56b;
}
#compare h2 {
	display: none;
}

#compare .container {
	padding: 10vw 0;
}
#compare .container > div {
	margin: 0 10px;
	padding: 30px 80px;
	background-color: #fff;
	border-radius: 10px;
}

#compare .compare_price {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#compare .compare_price p {
	display: block;
	width: 100%;
	max-width: 430px;
	margin:0 auto 20px;
}
#compare:has(p.notice) .compare_price p{
	margin: 0 auto;
}
#compare .compare_price img {
	max-width: 100%;
}
#compare .compare_price p span {
	word-break: keep-all;
}
#compare .notice{
	text-align: center;
	margin-bottom: 20px;
}
#compare .arrow {
	width: 35%;
	text-align: center;
	margin: 0 auto;
}
#compare .arrow img {
	max-width: 100%;
}

#compare .price {
}
#compare .price p {
	text-align:center;
	margin: 30px auto 0;
}
#compare .price p.price_via {
	width: 80%;
}
#compare .price img {
	max-width: 100%;
}

@media screen and (max-width: 1079px) {
	#compare .compare_price p {
		text-align: center;
	}
	#compare .compare_price p span {
		word-break: inherit;
	}
}

@media screen and (max-width: 749px) {
	#compare .container > div {
		padding: 30px;
	}
}


/*** voice ***/
#voice section#voice_title {
	width: 100%;
	background: url(../img/voice/human.png) no-repeat left 35px bottom,
				url(../img/voice/bg.jpg) no-repeat right bottom;
	background-size: 25%, cover;
}
#voice section#voice_title .container {
	width: 60vw;
	max-width: 945px;
	padding-top: 100px;
	padding-bottom: 15%;
}
#voice section#voice_title h2 {
	margin-bottom: 1em;
	font-size: 1.5rem;
}

#voice #voice_body {
	padding: 30px 0;
	background-color: #f8b551;
}
#voice #voice_body h3 {
	padding: 20px 30px;
}

#voice #voice_body .container > p {
	max-width: 860px;
	margin: 0 auto 1em;
	padding: 0 10px;
}

#voice #voice_body .container > div {
	padding: 30px 30px 0;
	background-color: #fff;
}
#voice #voice_body .container > div ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	list-style-type: none;
	padding: 0;
}
#voice #voice_body .container > div ul li {
	width: 48%;
	margin-bottom: 30px;
	color: #fff;
	font-size: 1.2rem;
	background-color:#eb6100;
}
#voice #voice_body .container > div ul li > div {
	overflow: hidden;
}
#voice #voice_body .container > div ul li img {
	max-width: 100%;
	vertical-align:top;
}
#voice #voice_body .container > div ul li p {
	padding: 5px 10px;
}



@media screen and (max-width: 749px) {
	#voice section#voice_title {
		width: 100%;
		background: url(../img/voice/bg.jpg) no-repeat right bottom;
		background-size: cover;
	}
	#voice section#voice_title .container {
		width: 100%;
		padding: 30px 10px;
		background-color: rgba(255, 255, 255, 0.5);
	}

	#voice section#voice_title h2 {
		margin:0 auto 20px;
	}
	#voice section#voice_title h2 span {
		display: block;
		width: 100%;
		height:0;
		padding-top: 27.8%;
		background: url(../img/voice/title@2x.jpg) no-repeat;
		background-size: cover;
		white-space: nowrap;
		text-indent: 100%;
		overflow: hidden;
	}

	#voice #voice_body h3 {
		padding: 20px 0px;
	}

	#voice #voice_body .container > div ul li {
		width: 100%;
	}
	#voice #voice_body .container > div ul li > div {
		position: relative;
		width: 100%;
		height: 0;
		/* padding-top: 30.9%; */
		padding-top: 50%;
	}
	#voice #voice_body .container > div ul li img {
		width: 100%;
	}
	#voice #voice_body .container > div ul li > div div {
		position: absolute;
		/* top: -50%; */
		top: 0;
		width: 100%;
	}
	#voice #voice_body .container > div ul li p {
		padding: 12px 10px;
	}
}


/*** service ***/
#service {
	padding-top: 40px;
}
#service h2 {
	position: relative;
	display: block;
	width: 100%;
	margin: 40px auto 0;
}
#service h2 span {
	display: block;
	width: 100%;
	height: 0;
	padding-top: 16.6%;
	background-image: url(../img/service/title.png);
	background-repeat: no-repeat;
	background-size: contain;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}

#service .service_point {
	margin-bottom: 40px;
}
#service .service_point img {
	max-width: 400px;
}

#service .service_point .service_inner {
	overflow: hidden;
	margin-bottom: 10px;
}
#service .service_point .service_inner .service_inner_box_l {
	float: left;
	width: 49%;
}
#service .service_point .service_inner .service_inner_box_r {
	float: right;
	width: 49%;
}
#service .service_point .service_inner .service_inner_box_center {
	text-align:center;
}


@media screen and (max-width: 749px) {
	#service {
		padding-top: 0;
	}
	#service .service_point .service_inner .service_inner_box_l,
	#service .service_point .service_inner .service_inner_box_r {
		float: none;
		width: 100%;
	}

	#service .service_point img {
		margin-top: 20px;
		max-width: 300px;
	}

	#service .service_point .service_inner h3 {
		width: 60%;
	}

}



/*** foundation ***/
#foundation {
	background: url(../img/foundation/bg.jpg);
}

#foundation h2 {
	position: relative;
	display: block;
	width: 55%;
	min-width: 150px;
	margin: 40px auto 10px;
}
#foundation h2 span {
	display: block;
	width: 100%;
	height: 0;
	padding-top: 13.7%;
	background-image: url(../img/foundation/title.png);
	background-repeat: no-repeat;
	background-size: contain;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}
#foundation .container > p {
	margin: 20px auto;
	text-align: center;
}
#foundation .container > p img {
	max-width: 100%;
}
#foundation .container > p.foundation_caution {
	color: #eb6100;
	font-size: 1.8rem;
}
#foundation .container > p.foundation_caution > span {
}
#foundation .container > p.foundation_caution > span > span {
	font-weight: 700;
	background: linear-gradient(transparent 60%, #ffff66 60%);
}


#foundation section {
	position: relative;
	min-height: 540px;
}
#foundation section > div {
	max-width: 920px;
	padding: 70px 20px 30px;
}

#foundation section > div h3 {
}
#foundation section > div div {
	padding: 1em 0 1em 66px;
}
#foundation section .foundation_phrase {
	font-size: 1.7rem;
	font-weight: 700;
}

#foundation section#foundation_jiban {
	background:url(../img/foundation/bg_jiban.jpg) no-repeat center center;
	background-size: cover;
}
#foundation section#foundation_kiso {
	background:url(../img/foundation/bg_kiso.jpg) no-repeat center center;
	background-size: cover;
}
#foundation section#foundation_kiso_detail {
	background-color: #fff;
	min-height: auto;
}
#foundation section#foundation_caloto {
	background:url(../img/foundation/bg_caloto.jpg) no-repeat center center;
	background-size: cover;
	min-height: 330px;
}

#foundation section > div div p {
	line-height: 2;
}

#foundation section#foundation_jiban > div,
#foundation section#foundation_caloto > div {
	position: absolute;
	left: 50%;
}
#foundation section#foundation_kiso > div {
	position: absolute;
	right: 50%;
}

#foundation section#foundation_kiso_detail > div {
	width: 100%;
	max-width: none;
	padding-left: 30px;
	padding-right: 30px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding-top: 30px;
}
#foundation section#foundation_kiso_detail > div > div {
	padding: 0;
}
#foundation section#foundation_kiso_detail > div div {
	padding-left: 0;
}

#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_item {
	width: 47%;
	max-width:842px;
	padding: 0 10px;
}
#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_arrow {
	width: 4%;
	background:url(../img/foundation/icon_arrowr.png) no-repeat center center;
	background-size: contain;
}
#foundation section#foundation_kiso_detail > div > div img {
	max-width: 100%;
}

#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_item > div.foundation_kiso_detail_item_hint_triangle,
#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_item > div.foundation_kiso_detail_item_hint_circle {
	padding-left: 100px;
	margin-bottom: 20px;
}
#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_item > div.foundation_kiso_detail_item_hint_triangle {
	background: url(../img/foundation/icon_triangle.png) no-repeat left center;
	background-size:contain;
}
#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_item > div.foundation_kiso_detail_item_hint_circle {
	background: url(../img/foundation/icon_circle.png) no-repeat left center;
	background-size:contain;
}
#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_item strong {
	display: block;
	font-size:1.3rem;
	margin-bottom: 0.2em;
}

@media screen and (max-width: 749px) {
	#foundation {
		padding-bottom: 40px;
	}

	#foundation .container > p.foundation_caution {
		font-size: 1rem;
	}

	#foundation section {
		width: 95%;
		width: calc(100% - 20px);
		min-height: auto;
		margin: 0 10px 20px;
		padding-top: 32.8%;
		filter: drop-shadow(6px 5px 8px rgba(79, 78, 79, 0.23));
	}

	#foundation section#foundation_jiban {
		background: #fff url(../img/foundation/bg_jiban_sp.jpg) no-repeat top center;
		background-size: contain;
	}
	#foundation section#foundation_kiso {
		background: #fff url(../img/foundation/bg_kiso_sp.jpg) no-repeat top center;
		background-size: contain;
	}
	#foundation section#foundation_kiso_detail {
		padding-top: 0;
	}
	#foundation section#foundation_caloto {
		background: #fff url(../img/foundation/bg_caloto_sp.jpg) no-repeat top center;
		background-size: contain;
	}

	#foundation section > div {
		padding: 10px;
	}

	#foundation section#foundation_jiban > div,
	#foundation section#foundation_kiso > div,
	#foundation section#foundation_caloto > div {
		position: static;
	}

	#foundation section > div h3 {
		width: 17%;
		min-width: 75px;
	}
	#foundation section > div div {
		padding: 0.3em 0;
	}
	#foundation section > div div.foundation_phrase {
		font-size: 1rem;
	}
	#foundation section > div div.foundation_phrase span {
		display: none;
	}


	#foundation section#foundation_kiso_detail > div {	
		display: block;
	}
	#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_item {
		width: 100%;
	}
	#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_arrow {
		width: 100%;
		height: 26px;
		background:url(../img/foundation/icon_arrowd.png) no-repeat center center;
		background-size: contain;
		margin: 10px 0;
	}


	#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_item > div.foundation_kiso_detail_item_hint_triangle,
	#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_item > div.foundation_kiso_detail_item_hint_circle {
		padding-left: 0;
		margin-bottom: 20px;
		background: none;
	}
	#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_item > div.foundation_kiso_detail_item_hint_triangle strong {
		padding-left: 2.2em;
		padding-top: 0.2em;
		margin-bottom: 0.5em;
		background: url(../img/foundation/icon_triangle.png) no-repeat left center;
		background-size:contain;
	}
	#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_item > div.foundation_kiso_detail_item_hint_circle strong {
		padding-left: 2.2em;
		padding-top: 0.2em;
		margin-bottom: 0.5em;
		background: url(../img/foundation/icon_circle.png) no-repeat left center;
		background-size:contain;
	}

	#foundation section#foundation_kiso_detail > div > div.foundation_kiso_detail_item strong {
		font-size:1rem;
	}
}


/*** case ***/
#case {
	padding: 30px 0 50px;
}
#case h2 {
	position: relative;
	display: block;
	width: 60%;
	margin: 40px auto;
}
#case h2 span {
	display: block;
	width: 100%;
	height: 0;
	padding-top: 11.2%;
	background-image: url(../img/case/title.png);
	background-repeat: no-repeat;
	background-size: contain;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}


#case section {
	max-width: 1000px;
	margin: 0 auto;
	padding-bottom: 1px;
	background-color: #eb6100;
}
#case section h3 {
	padding: 0.3em 1em;
	color: #fff;
	font-size: 1.8rem;
}
#case section h3 span {
	font-size: 150%;
	padding-right: 0.5em;
}

#case #case3 {
	padding-bottom: 10px;
}

#case section > div {
	margin: 0 20px 0px 10px;
	padding: 30px;
	font-size: 1rem;
	background-color: #fff;
	overflow: hidden;
}

#case section > div > div {
	width: 60%;
	height: 0;
	padding-bottom: 35%;
	float: left;
}
#case section#case2 > div > div {
	float: right;
}

#case section#case1 > div {
	background: #fff url(../img/case/bg_case1_02.jpg) no-repeat right center;
	background-size: contain;
}
#case section#case2 > div {
	background: #fff url(../img/case/bg_case2.jpg) no-repeat left center;
	background-size: contain;
}
#case section#case3 > div {
	background: #fff url(../img/case/bg_case3_202506.jpg) no-repeat right center;
	background-size: contain;
}

#case section > div > div > div {
	margin-top: 1em;
	padding-left: 10px;
}
#case section > div > div > div p {
	line-height: 2;
}


#case section .subtitle {
	/*margin-left: 10px;*/
	margin-top: 5px;
	padding-left: 10px;
	font-size: 1rem;
	color: #eb6100;
	border-left: 10px solid #eb6100;
}
#case section .subtitle span {
	background: linear-gradient(transparent 60%, #ffff66 60%);
}

#case section .signature {
	text-align: right;
}



@media screen and (max-width: 749px) {
	#case {
		padding-top: 0;
		padding-bottom: 0;
	}

	#case section h3 {
		font-size: 1rem;
	}

	#case section > div {
		margin: 0 10px;
		padding: 10px;
		padding-bottom: 8%;
	}
	#case section#case1 > div {
		background: #fff url(../img/case/bg_case1_sp_02.jpg) no-repeat bottom center;
		background-size: contain;
	}
	#case section#case2 > div {
		background: #fff url(../img/case/bg_case2_sp.jpg) no-repeat bottom center;
		background-size: contain;
	}
	#case section#case3 > div {
		background: #fff url(../img/case/bg_case3_sp_202506.jpg) no-repeat bottom center;
		background-size: contain;
	}


	#case section > div > div {
		width: 100%;
		height: auto;
		padding-bottom: 0;
		float: none;
	}	
}


/*** flow ***/
#flow {
	padding-bottom: 40px;
	background-color: #eb6100;
}

#flow h2 {
	position: relative;
	display: block;
	width: 90%;
	margin: 40px auto;
}
#flow h2 span {
	display: block;
	width: 100%;
	height: 0;
	padding-top: 6.65%;
	background-image: url(../img/flow/title.png);
	background-repeat: no-repeat;
	background-size: contain;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}

#flow .container > div {
	padding: 30px;
	background-color: #fff;
}


#flow .container > div > div {
	position: relative;
	margin: 45px 0 20px;
	/*padding-top: 60px;*/
	padding-top: 4%;
} 
#flow .container > div > div#flow_phase1 { background-color: #fff799; }
#flow .container > div > div#flow_phase2 { background-color: #f5dc49; }
#flow .container > div > div#flow_phase3 { background-color: #f5c339; }

#flow .flow_phase_title {
	position: absolute;
	top: -30px;
	width: 70%;
	max-width: 250px;
}
#flow #flow_phase2 .flow_phase_title {
	max-width: 450px;
}

#flow .flow_phase_title img {
	max-width: 100%;
}

#flow .flow_steps {
	padding: 20px 10px 20px 20px;
	display: flex;
	flex-wrap: wrap;
}


#flow .flow_step {
	margin: 0 20px 20px 0;
	padding-left: 40px;
	background: url(../img/flow/arrow.png) no-repeat left center;
	background-size: 30px;
}
#flow .flow_step:first-child {
	margin-left: 20px;
	padding-left: 0;
	background: inherit;
}
#flow .flow_step.flow_step_wide {
	width: 100%;
}

#flow .flow_step > div {
	max-width: 460px;
	height: 100%;
	background-color: #fff;
	border: 8px solid #eb6100;
	border-radius: 10px;
}
#flow .flow_step.flow_step_wide > div {
	width: 100%;
	height: 0;
	padding-bottom: 27.5%;
	max-width: none;
}


#flow .flow_step .flow_step_no {
}
#flow .flow_step .flow_step_no p {
	display:inline-block;
	margin-right: 1em;
	padding: 5px 10px;
	font-size: 1rem;
	color: #fff;
	background-color: #eb6100;
	border-radius: 0 0 10px 0;
}
#flow .flow_step .flow_step_no p span {
	font-size: 200%;
	padding: 0 0.2em;
}
#flow .flow_step .flow_step_no h3 {
	display: inline-block;
	font-size: 1.7rem;
}

#flow .flow_step .flow_step_body {
	padding: 20px;
}
#flow .flow_step .flow_step_body img {
	max-width: 100%;
}

#flow .flow_step.flow_step_wide .flow_step_body {
	width: 50%;
}
#flow .flow_step.flow_step_wide .flow_step_body img {
	display: none;
}

#flow .flow_step#step7 > div {
	background: #fff url(../img/flow/step7.jpg) no-repeat right center;
	background-size: contain;
}

@media screen and (max-width: 749px) {
	#flow {
		padding-bottom: 0;
		background-color: inherit;
	}
	#flow .container {
		padding: 0;
	}
	#flow .container > div {
		padding: 0;
	}

	#flow .flow_phase_title {
		max-width: 130px;
	}

	#flow #flow_phase2 .flow_phase_title {
		max-width: 250px;
	}

	#flow .flow_steps {
		/*padding: 10px;*/
		padding: 0 8px;
		justify-content: space-between;
	}

	#flow .flow_step {
		width: 49%;
		margin: 0 0 8px 0;
		padding-left: 0;
		background: inherit;
	}
	#flow .flow_step:first-child {
		margin-left: 0;
	}

	#flow .flow_step .flow_step_no p {
		font-size: 0.5rem;
		margin-right: 0.1em;
		padding: 0 2px;
	}
	#flow .flow_step .flow_step_no p span {
		font-size: 200%;
		padding: 0;
	}

	#flow .flow_step .flow_step_body {
		padding: 10px;
	}
	#flow .flow_step .flow_step_no h3 {
		display: inline;
		font-size: 0.88rem;
	}


	#flow .flow_step > div {
		border-width: 4px;
	}	
}



/*** access ***/
#access {
	margin-bottom: 40px;
}

#access h2 {
	position: relative;
	display: block;
	width: 30%;
	max-width: 202px;
	margin: 40px auto;
}
#access h2 span {
	display: block;
	width: 100%;
	height: 0;
	padding-top: 20.3%;
	background-image: url(../img/access/title.png);
	background-repeat: no-repeat;
	background-size: contain;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}

#access .container div {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 20px 0;
}
#access .container div p {
	margin: 0 25px;
}
#access .container div p a {
	display: block;
	width: 100%;
	height: 100%;
}
#access .container div p a:hover {
	opacity: 0.8;
}

#access .container div p a img {
	max-width: 100%;
}

@media screen and (max-width: 749px) {
	#access .container div {
		padding: 0;
	}
}



/*** contact ***/
.contact {
	background-color: #f8e56b;
}

.contact .container {
	padding: 40px 40px;
}

.contact .container > p {
	color: #e83828;
	font-size: 1.25rem;
	padding:0.3em 0;
}

.contact .container div {
	overflow: hidden;
}
.contact .container div a {
	float: left;
	max-width: 656px;
	margin-right: 20px;
}
.contact .container div a:hover {
	opacity: 0.8;
}
.contact .container div a img {
	max-width: 100%;
}

.contact .container div p {
	font-size: 1.8rem;
	padding: 1em 0;
}
.contact .container div p strong {
	display: inline-block;
	border: 1px solid #000;
	margin: 0.2em 50px 0.2em 0.2em;
	padding: 0.2em;
	font-weight: normal;
}
.contact .container div p span {
	display: inline-block;
}

@media screen and (max-width: 450px) {
	.contact .container div p {
		font-size: 1.2rem;
		padding: 1em 0;
	}
	.contact .container div a {
		margin-right: 0px;
	}
	.contact .container div p strong {
		margin-right: 5px;
	}
}

/*** tourism ***/
#tourism {
	padding: 40px 0;
}

#tourism img {
	max-width: 100%;
}



/*** faq ***/
#faq {
	margin-bottom: 40px;
	padding: 0 40px;
}

#faq .container {
	margin-bottom: 40px;
	background-color: #eb6100;
	border-radius: 10px;
}

#faq h2 {
	position: relative;
	display: block;
	width: 40%;
	max-width: 559px;
	margin: 40px auto;
}
#faq h2 span {
	display: block;
	width: 100%;
	height: 0;
	padding-top: 27.4%;
	background-image: url(../img/faq/title.png);
	background-repeat: no-repeat;
	background-size: contain;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}



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

#faq dl > div {
	width: 49%;
	/* padding: 10px; */
	padding: 15px;
	margin-bottom: 20px;
	background-color: #fff;
	filter: drop-shadow(6px 5px 8px rgba(79, 78, 79, 0.23));
}

#faq dl > div.illust {
	background:inherit;
	text-align: center;
	padding: 10px;
}
#faq dl > div.illust img {
	max-height: 100%;
}

#faq dl div dt {
	padding: 0 0 0 80px;
	font-size: 1.5rem;
	background: #eb6100 url(../img/faq/Q.png) no-repeat left 20px center;
}
#faq dl div dd {
	padding: 0 0 0 80px;
	font-size: 1.2rem;
	background: #fff url(../img/faq/A.png) no-repeat left 20px center;
}

#faq dl div dt div {
	background-color: #cce198;
	min-height: 120px;
	height: 120px;
}
#faq dl div dt div,
#faq dl div dd div {
	padding: 0 10px;
	width: 100%;
}

#faq dl div dt div div,
#faq dl div dd div div {
	display: table-cell;
	vertical-align: middle;
	padding: 10px 0;
}

#faq dl div dd div div p {
	line-height: 1.6;
}

#faq dl div dd div {
	padding: 0 10px;
	font-size: 1.15rem;
	min-height: 165px;
	height: 165px;
}

@media screen and (max-width: 920px) {
	#faq dl div dt {
		font-size: 1.2rem;
	}
	#faq dl div dd div {
		font-size: 1rem;
	}
	#faq dl div dd div div p {
		line-height: 1.3;
	}
	#faq dl > div.illust {
		padding: 0;
	}

}

@media screen and (max-width: 749px) {
	#faq {
		padding: 0px;
		margin-bottom: 0;
	}
	#faq .container {
		padding-bottom: 20px;
		margin-bottom: 0;
		border-radius: initial;
	}

	#faq h2 {
		width: 80%;
		margin: 40px auto 20px;
	}
	#faq dl {
		display: block;
	}
	#faq dl > div {
		width: 100%;
		margin-bottom: 0;
		filter: none;
	}
	#faq dl > div:not(:first-child) {
		padding-top: 0;
	}
	#faq dl div dt,
	#faq dl div dd {
		/* padding: 0 0 0 40px; */
		font-size: 1.2rem;
		background-size: 7%;
		/* background-position: left 10px top 20px; */
		padding: 0 0 0 10%;
		background-position: left 2% top 50%;
	}
	#faq dl div dt div {
		height: auto;
		min-height: auto;
	}
	#faq dl div dd div {
		height: auto;
		min-height: auto;
	}

	#faq dl > div.illust {
		display: none;
	}

}


/*** footer ***/
footer a {
	color: #000;
	text-decoration: none;
}
footer > .container {
	padding: 0 10px 0;
}

footer #copyright {
	margin: 40px auto;
	border-top: 1px solid #fff;
	text-align: center;
}
footer #copyright > * {
	display: block;
	font-size: 0.85rem;
}
footer #copyright > p {
	font-size: 0.75rem;
}


/*** popup for warranty ***/
#popup_warranty .popup-inner {
    position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
    max-width: 700px;
    padding: 50px;
    background-color: unset;
    z-index: 2;
}

#popup_warranty .close-btn {
	right: 15px;
}

#popup_warranty .popup-inner img{
	max-height: 90vh;
}