@charset "UTF-8";
/*
data-sc-sp
data-sc-pc
data-sc-onlyPc
data-sc-tab
data-sc-pcMin
*/
/*
	@include hover() {
		opacity: 0.6;
	}
*/
/*
	$line:イラレの行の値
	$size:イラレの文字の値

	@include lh(38, 15);
*/
/*
	$size:object-fitの値

	@include objectfit();
	@include objectfit('contain');
*/
/*
	@include taJ();
*/
/*
	@extend %rightarr;
*/
/*
	$weight:フォントの太さ
	@include f_min();
	@include f_min(400);Reguler
	@include f_min(600);SemiBold
*/
/*
* "はんなり明朝" licensed under the IPA Font License Agreement v1.0
* https://typingart.net/?p=44（配布元のURL）
* http://ipafont.ipa.go.jp/（IPAフォントのURL）
* http://ipafont.ipa.go.jp/ipa_font_license_v1.html（IPAフォントライセンスv1.0のURL）
*/
@font-face {
  font-family: "hannari";
  src: url("/common/font/hannari.woff2") format("woff2"),
    url("/common/font/hannari.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
/*
	$weight:フォントの太さ

	@include f_min();
	@include f_min(500);
	@include f_min(600);
*/
/*
	$color:色指定
	$stripe:線サイズ
	$spacing:線の空きサイズ
	$height:太さ

	@include dotted(#e6e1d2, 4,4,2);
*/
/*
example
@include dotted-y(#COLOR, WidthPX,SpaceingPX,LengthPX,); 横破線
@include dotted-y(#e6e1d2, 4,4,2,10);
*/
/* -----------------------------------------------------------------------------

common local

----------------------------------------------------------------------------- */
@media print, screen and (min-width: 641px) {
  .mainVisual .contTit {
    padding-left: 0.7rem;
  }
}

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

content（rem値修正）

----------------------------------------------------------------------------- */
.sec_intro > .in {
  padding: 0.55rem 0 1rem;
  background-color: #f3efec;
}
@media screen and (max-width: 640px) {
  .sec_intro > .in {
    padding: 0.28rem 0 0.8rem;
  }
}
.sec_intro > .in .title {
  font-family: "hannari";
  font-weight: 400;
  text-align: center;
  font-size: 0.26rem;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 640px) {
  .sec_intro > .in .title {
    font-size: 0.18rem;
  }
}
.sec_intro > .in .title .big {
  display: block;
  margin-top: 0.05rem;
  font-size: 0.36rem;
  letter-spacing: 0.05em;
  color: #03888e;
}
@media screen and (max-width: 640px) {
  .sec_intro > .in .title .big {
    font-size: 0.25rem;
  }
}
.sec_intro > .in .catch {
  margin-top: 0.37rem;
  font-family: "游明朝", YuMincho, "Hiragino Mincho ProN", "HG明朝E",
    "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-weight: 500;
  text-align: center;
  font-size: 0.18rem;
  letter-spacing: 0.11em;
}
.os-android .sec_intro > .in .catch {
  font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 640px) {
  .sec_intro > .in .catch {
    margin-top: 0.25rem;
    font-size: 0.16rem;
    line-height: 1.75;
  }
}

.sec_detail > .in {
  position: relative;
  display: block;
  padding: 1rem 0 1.3rem;
}
@media screen and (max-width: 640px) {
  .sec_detail > .in {
    padding: 0.78rem 0 0.7rem;
  }
}
.sec_detail .planBox {
  position: relative;
  letter-spacing: 0;
  font-size: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 10.8rem;
  width: 100%;
  margin: auto;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox {
    display: block;
    max-width: 100%;
    width: calc(100% - 0.3rem);
    margin: auto;
  }
}
.sec_detail .planBox > .item {
  position: relative;
  z-index: 0;
  display: block;
  width: 3.4rem;
  margin-top: 0.5rem;
  margin-left: calc((100% - 10.2rem) / 2);
  transition: 0.5s;
  cursor: pointer;
  /*&:before {
  	content: '';
  	position: absolute;
  	top: 0.05rem;//5px;
  	bottom: -0.05rem;//-5px;
  	left: 0.05rem;//5px;
  	right: -0.05rem;//-5px;
  	z-index: -1;
  	display: block;
  	border-radius: 0.2rem;//20px;
  	background-color: #d9ccb9;//乗算値
  	transition: opacity 0.3s;
  	@include sc(sp){
  		top: 0.05rem;//5px;
  		bottom: -0.05rem;//-5px;
  		left: 0.05rem;//5px;
  		right: -0.05rem;//-5px;
  		border-radius: 0.2rem;//20px;
  	}
  }*/
}
.sec_detail .planBox > .item:nth-of-type(3n + 1) {
  margin-left: 0;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item {
    width: 100%;
    margin-left: 0;
    margin-top: 0.4rem;
  }
  .sec_detail .planBox > .item:nth-of-type(1) {
    margin-top: 0;
  }
}
@media print, screen and (min-width: 641px) {
  .sec_detail .planBox > .item.plan01 .detail > dd .txt,
  .sec_detail .planBox > .item.plan02 .detail > dd .txt,
  .sec_detail .planBox > .item.plan03 .detail > dd .txt {
    height: 1.5rem;
  }
}
@media print, screen and (min-width: 641px) {
  .sec_detail .planBox > .item.plan04 .detail > dd .txt,
  .sec_detail .planBox > .item.plan05 .detail > dd .txt,
  .sec_detail .planBox > .item.plan06 .detail > dd .txt,
  .sec_detail .planBox > .item.plan07 .detail > dd .txt {
    height: 1.5rem;
  }
}
.sec_detail .planBox > .item > .in {
  position: relative;
  width: 100%;
  border-radius: 0.2rem;
  background-color: #fff;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item > .in {
    border-radius: 0.2rem;
  }
}
.no-touchevents .sec_detail .planBox > .item:hover:before {
  opacity: 0;
}
.no-touchevents .sec_detail .planBox > .item:hover .in .detail {
  opacity: 0.5;
}
.sec_detail .planBox > .item .wrapLink {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.sec_detail .planBox > .item .petan {
  position: absolute;
  z-index: 1;
  top: -0.41rem;
  left: -0.16rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.9rem;
  height: 0.82rem;
  background-image: url("../img/plan_detail_petan_bg.svg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .petan {
    top: -0.24rem;
    left: -0.12rem;
    width: 88px;
    height: 82px;
  }
}
.sec_detail .planBox > .item .petan span {
  font-family: source-han-serif-japanese, serif;
  font-style: normal;
  font-weight: 600;
  font-size: 0.16rem;
  letter-spacing: 0.08em;
  line-height: 1.2;
  color: #fff;
  text-align: center;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .petan span {
    font-feature-settings: "palt";
  }
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .petan span {
    font-size: 0.15rem;
    letter-spacing: 0.1em;
  }
}
.sec_detail .planBox > .item .petan strong {
  font-size: 1.75em;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.07em;
}
.sec_detail .planBox > .item .detail {
  transition: opacity 0.3s;
  border-radius: 0.2rem;
  overflow: hidden;
  box-shadow: 3px 4px 4px #f3efec;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail {
    border-radius: 0.1rem;
  }
}
.sec_detail .planBox > .item .detail > dt {
  position: relative;
  display: flex;
  align-items: flex-end;
  width: 100%;
  height: 0.65rem;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dt {
    height: 0.45rem;
  }
}
.sec_detail .planBox > .item .detail > dt::before {
  position: absolute;
  content: "";
  display: block;
  top: 0.03rem;
  bottom: 0;
  right: 0.16rem;
  margin: auto 0;
  width: 0.28rem;
  height: 0.28rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dt::before {
    width: 5.83vw;
    height: 5.83vw;
  }
}
.sec_detail .planBox > .item .detail > dt span {
  display: inline-block;
  width: 100%;
  font-family: "hannari";
  font-weight: 400;
  font-size: 0.32rem;
  letter-spacing: 0.15em;
  line-height: 1;
  text-align: center;
  color: #fff;
  padding-bottom: 0.18rem;
  /*&:before {
  	content: attr(data-txt);
  	position: absolute;
  	left: 0;
  	right: 0;
  	bottom: 0;
  	display: inline-block;
  	padding: 0.08rem 0;//8px 0;
  	@include f_min(400);
  	font-size: 0.16rem;//16px;
  	letter-spacing: 0.11em;
  	line-height: 1;
  	text-align: center;
  	@include sc(sp){
  		padding:  0.06rem 0 0.08rem;//6px 0 8px;
  		font-size: 0.16rem;//16px;
  	}
  }*/
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dt span {
    font-size: 0.27rem;
    padding-bottom: 0.1rem;
  }
}
.sec_detail .planBox > .item .detail > dd {
  line-height: 0;
  /*&:before {
  	content: attr(data-txt);
  	@include f_min(600);
  	font-size: 0.13rem;//13px;
  	letter-spacing: 0.11em;
  	line-height: 1;
  	color: $bcg02;
  	text-align: center;
  	position: absolute;
  	right: 0.2rem;//20px;
  	bottom: 0.18rem;//18px;
  	white-space: nowrap;
  	display: block;
  	width: 0.3rem;//30px;
  	height: 0.46rem;//46px;
  	background-image: url('/common/img/btn_arrow_green.svg');
  	background-position: center bottom;
  	background-repeat: no-repeat;
  	background-size: contain;
  	@include sc(sp){
  		right: 0.18rem;//18px;
  		bottom: 0.14rem;//14px;
  		width: 0.3rem;//30px;
  		height: 0.46rem;//46px;
  	}
  }*/
}
.sec_detail .planBox > .item .detail > dd .txt {
  padding: 0.18rem 0.19rem 0.16rem;
  font-family: "游ゴシック", "游ゴシック体", "Yu Gothic", YuGothic,
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN",
    "Hiragino Kaku Gothic Pro", verdana, "メイリオ", "Meiryo", "Osaka",
    sans-serif;
  font-style: normal;
  font-weight: 500;
  font-feature-settings: "palt";
  font-size: 0.16rem;
  letter-spacing: 0.08em;
  line-height: 1.87;
}
.sec_detail .planBox > .item .detail > dd .thumb {
  width: 100%;
  height: auto;
}
.sec_detail .planBox > .item .detail > dd .price {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 0.8rem;
  width: 100%;
  box-sizing: border-box;
  background-color: #fff;
  font-family: source-han-serif-japanese, serif;
  font-style: normal;
  font-weight: 400;
  font-size: 0.22rem;
  letter-spacing: 0.1em;
  line-height: 1;
  color: #3e8b8c;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dd .price {
    font-feature-settings: "palt";
  }
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dd .price {
    height: 0.72rem;
    font-size: 0.19rem;
  }
}
.sec_detail .planBox > .item .detail > dd .price strong {
  position: relative;
  top: -3px;
  z-index: 0;
  font-size: 1.95em;
  font-weight: 400;
  letter-spacing: -0.025em;
  font-feature-settings: "palt";
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dd .price strong {
    font-size: 2em;
  }
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dd .price strong.digit1 {
    padding: 0 0.25em;
  }
}
.sec_detail .planBox > .item .detail > dd .price .prefix {
  display: inline-block;
  font-family: "游ゴシック", "游ゴシック体", "Yu Gothic", YuGothic,
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN",
    "Hiragino Kaku Gothic Pro", verdana, "メイリオ", "Meiryo", "Osaka",
    sans-serif;
  font-style: normal;
  font-weight: 500;
  font-feature-settings: "palt";
  font-size: 0.12rem;
  letter-spacing: 0;
  line-height: 1.5;
  text-align: center;
  margin-right: 0.1rem;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dd .price .prefix {
    font-size: 0.11rem;
    line-height: 1.68;
    margin-right: 0.06rem;
  }
}
.sec_detail .planBox > .item .detail > dd .price .suffix {
  display: inline-block;
  position: relative;
  padding-top: 0.13rem;
  margin-left: 0.1rem;
  text-align: center;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dd .price .suffix {
    padding-top: 0.11rem;
    margin-left: 0.05rem;
  }
}
.sec_detail .planBox > .item .detail > dd .price .suffix:before {
  content: attr(data-txt);
  position: absolute;
  top: 0;
  font-size: 0.11rem;
  letter-spacing: 0.05em;
  line-height: 1;
  white-space: nowrap;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dd .price .suffix:before {
    font-size: 0.1rem;
  }
}
.sec_detail .planBox > .item .detail > dd .price.p_small {
  height: 0rem;
  text-align: right;
  padding: 0.13rem 0 0.22rem;
  align-items: end;
  width: 100%;
  box-sizing: border-box;
  background-color: #fff;
  font-family: source-han-serif-japanese, serif;
  font-style: normal;
  font-weight: 400;
  font-size: 0.22rem;
  letter-spacing: 0.1em;
  line-height: 1;
  color: #03888e;
  font-weight: 600;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dd .price.p_small {
    font-size: 0.2rem;
  }
}
.sec_detail .planBox > .item .detail > dd .price.p_small .en {
  font-size: 0.16rem;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dd .price.p_small .en {
    font-weight: 400;
  }
}
.sec_detail .planBox > .item .detail > dd .price.p_small .tax {
  font-size: 0.12rem;
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item .detail > dd .price.p_small .tax {
    font-weight: 400;
  }
}
.sec_detail .planBox > .item.plan01 .detail {
  background-color: rgba(62, 139, 140, 0.1);
}
.sec_detail .planBox > .item.plan01 .detail > dt {
  background-color: #3e8b8c;
}
.sec_detail .planBox > .item.plan01 .detail > dt::before {
  background-image: url(../common/img/plan_arrow_gr.svg);
}
@media screen and (max-width: 640px) {
  .sec_detail .planBox > .item.plan01 .detail > dt span {
    padding-left: 0.1rem;
  }
}
.sec_detail .planBox > .item.plan01 .detail > dt span:before {
  background-color: #e0e5e1;
  color: #3e8b8c;
}
.sec_detail .planBox > .item.plan02 .detail {
  background-color: rgba(155, 159, 92, 0.1);
}
.sec_detail .planBox > .item.plan02 .detail > dt {
  background-color: #9b9f5c;
}
.sec_detail .planBox > .item.plan02 .detail > dt::before {
  background-image: url(../common/img/plan_arrow_gry.svg);
}
.sec_detail .planBox > .item.plan02 .detail > dt span:before {
  background-color: #f3efec;
  color: #9a9f5c;
}
.sec_detail .planBox > .item.plan03 .detail {
  background-color: rgba(205, 169, 74, 0.1);
}
.sec_detail .planBox > .item.plan03 .detail > dt {
  background-color: #cda94a;
}
.sec_detail .planBox > .item.plan03 .detail > dt::before {
  background-image: url(../common/img/plan_arrow_ye.svg);
}
.sec_detail .planBox > .item.plan03 .detail > dt span:before {
  background-color: #f0e8db;
  color: #cda94a;
}
.sec_detail .planBox > .item.plan04 .detail {
  background-color: rgba(188, 122, 143, 0.1);
}
.sec_detail .planBox > .item.plan04 .detail > dt {
  background-color: #bc7a8f;
}
.sec_detail .planBox > .item.plan04 .detail > dt::before {
  background-image: url(../common/img/plan_arrow_pi.svg);
}
.sec_detail .planBox > .item.plan04 .detail > dt span:before {
  background-color: #f2e4e9;
  color: #bc7a8f;
}
.sec_detail .planBox > .item.plan05 .detail {
  background-color: rgba(183, 132, 101, 0.1);
}
.sec_detail .planBox > .item.plan05 .detail > dt {
  background-color: #b78465;
}
.sec_detail .planBox > .item.plan05 .detail > dt::before {
  background-image: url(../common/img/plan_arrow_or.svg);
}
.sec_detail .planBox > .item.plan05 .detail > dt span:before {
  background-color: #f1e6e0;
  color: #b78465;
}

.sec_detail .planBox > .item.plan07 .detail {
  background-color: rgba(183, 132, 101, 0.1);
}
.sec_detail .planBox > .item.plan07 .detail > dt {
  background-color: #b76565;
}

.sec_detail .planBox > .item.plan07 .detail > dt::before {
  background-image: url(../common/img/plan_arrow_or.svg);
}
.sec_detail .planBox > .item.plan07 .detail > dt span:before {
  background-color: #f1e0e0;
  color: #b76565;
}

.sec_detail .planBox > .item.plan07 .detail > dt span {
  padding-right: 0.25rem;
  letter-spacing: 0;
}

.sec_detail .planBox > .item.plan06 .detail {
  background-color: rgba(156, 142, 175, 0.1);
}
.sec_detail .planBox > .item.plan06 .detail > dt {
  background-color: #9c8eaf;
}
.sec_detail .planBox > .item.plan06 .detail > dt span {
  padding-right: 0.25rem;
  letter-spacing: 0;
}
.sec_detail .planBox > .item.plan06 .detail > dt::before {
  background-image: url(../common/img/plan_arrow_vi.svg);
}
.sec_detail .planBox > .item.plan06 .detail > dt span:before {
  background-color: #ebe8ef;
  color: #9c8eaf;
}
.sec_detail .moreWrap {
  width: 100%;
  max-width: calc(100% - 0.6rem);
  margin: 0 auto;
  margin-top: 0.6rem;
}
@media print, screen and (min-width: 641px) {
  .sec_detail .moreWrap {
    display: flex;
    justify-content: center;
    max-width: 10rem;
    margin-top: 0.8rem;
  }
}
.sec_detail .moreWrap .moreBox {
  position: relative;
  background-color: #f3efec;
  border-radius: 0.2rem;
  overflow: hidden;
}
@media screen and (max-width: 640px) {
  .sec_detail .moreWrap .moreBox {
    padding: 0.25rem;
    padding-top: 0;
  }
  .sec_detail .moreWrap .moreBox + .moreBox {
    margin-top: 0.27rem;
  }
}
@media print, screen and (min-width: 641px) {
  .sec_detail .moreWrap .moreBox {
    padding-left: 0.25rem;
    padding-bottom: 0.4rem;
  }
  .sec_detail .moreWrap .moreBox + .moreBox {
    margin-left: 0.3rem;
  }
}
@media print, screen and (min-width: 641px) {
  .sec_detail .moreWrap .moreBox .topBox {
    display: flex;
    justify-content: space-between;
  }
}
@media print, screen and (min-width: 641px) {
  .sec_detail .moreWrap .moreBox .txtBox {
    width: 2.6rem;
  }
}
@media screen and (max-width: 640px) {
  .sec_detail .moreWrap .moreBox .title {
    display: flex;
    align-items: center;
    min-height: 1.18rem;
  }
}
@media print, screen and (min-width: 641px) {
  .sec_detail .moreWrap .moreBox .title {
    padding-top: 0.35rem;
  }
}
.sec_detail .moreWrap .moreBox .title span {
  font-size: 0.19rem;
  letter-spacing: 0.05em;
  line-height: 1.57;
}
@media print, screen and (min-width: 641px) {
  .sec_detail .moreWrap .moreBox .title span {
    font-size: 0.2rem;
  }
}
.sec_detail .moreWrap .moreBox .txt {
  font-family: "游ゴシック", "游ゴシック体", "Yu Gothic", YuGothic,
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN",
    "Hiragino Kaku Gothic Pro", verdana, "メイリオ", "Meiryo", "Osaka",
    sans-serif;
  font-style: normal;
  font-weight: 500;
  font-feature-settings: "palt";
  font-size: 0.14rem;
  letter-spacing: 0.08em;
  line-height: 1.78;
}
@media print, screen and (min-width: 641px) {
  .sec_detail .moreWrap .moreBox .txt {
    margin-top: 0.1rem;
    font-size: 0.15rem;
  }
}
@media screen and (max-width: 640px) {
  .sec_detail .moreWrap .moreBox .ph {
    position: absolute;
    top: 0;
    right: 0;
    width: 39.58vw;
    height: 30.55vw;
    z-index: 1;
  }
}
@media print, screen and (min-width: 641px) {
  .sec_detail .moreWrap .moreBox .ph {
    width: 2rem;
    height: 1.56rem;
  }
}
.sec_detail .moreWrap .moreBox .link {
  margin-top: 0.22rem;
}
.sec_detail .deco {
  position: absolute;
  z-index: 1;
  display: block;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}
.sec_detail .deco.deco01 {
  top: -0.45rem;
  left: 0;
  right: -0.06rem;
  margin: 0 auto;
  width: 1.83rem;
  height: 0.96rem;
  background-image: url("../img/plan/detail_deco01.png");
}
@media screen and (max-width: 640px) {
  .sec_detail .deco.deco01 {
    top: -0.47rem;
    left: 0;
    right: -0.02rem;
    width: 38.27vw;
    height: 20.21vw;
  }
}

@media print, screen and (min-width: 641px) {
  .mod_contact {
    padding: 0.8rem 0;
  }
}

/* 追加 */
.plus {
  width: 100%;
  padding: 0px 0 20px;
  background-color: #fff;
  margin: 0 auto;
  display: flex;
  align-items: center;
}

.plus img {
  width: 260px;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
  margin: 0 auto;
}

.anshin {
  font-size: 14px !important;
  text-align: center !important;
  padding: 6px 0 30px;
  width: 100%;
  height: auto;
  background-color: #fff;
}

.kara {
  width: 100%;
  height: 70px;
  background-color: #fff;
}

@media screen and (max-width: 640px) {
  .kara {
    width: 100%;
    height: auto;
  }
}

.sec_detail .planBox > .item.plan05 .detail > dd .txt,
.sec_detail .planBox > .item.plan06 .detail > dd .txt {
  height: 1rem;
}

/*# sourceMappingURL=plan.css.map */
