@charset "UTF-8";

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

共通

------------------------------------------------*/
#contents #contact #formWrap #submit input[type=submit],
#submit button {
  background: linear-gradient(to bottom, #e8e29d 0%, #885d1e 100%);
  color:#fff;
  font-size: 20px;
  padding: .5rem 1.5rem;
  border-radius: 5px;
}
#contents #contact #formWrap .error-txt {
	color: #E50615;
}

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

PC設定

------------------------------------------------*/
@media all and (min-width: 769px) {

	/* ----------------------------------------------
topImage
------------------------------------------------*/
	#under_page #topImage {
		background: url(images/topImage.jpg) center 30%/cover no-repeat;
		overflow: auto;
		height: auto;
		width: auto;
	}

	#under_page #topImage h1 {
		padding: 1rem 2rem;
	}

	#contents .midashi {
		margin-bottom: 3rem;
	}

	#contents .midashi h2 {
		text-align: center;
		display: flex;
		flex-direction: column;
		justify-content: center;
		position: relative;
		margin: 0 auto 4rem;
	}

	#contents .midashi h2::after {
		content: url(images/dot.svg);
		width: 100px;
		display: inline-block;
		position: absolute;
		bottom: -2rem;
		left: 50%;
		transform: translateX(-50%);
	}

	#contents .midashi h2 .small {
		font-size: 32px;
	}

	#contents .midashi h2 .big {
		font-size: 42px;
		position: relative;
	}

	#contents .midashi .text {
		font-size: 16px;
		text-align: center;
		display: block;
		width: 70%;
		margin: 0 auto;
	}

	#contents .w_banner {
		max-width: 700px;
		margin: 0 auto 1rem;
	}

	/* ----------------------------------------------
points
------------------------------------------------*/
	#contents .purchase {
		position: relative;
		z-index: 1;
		margin-bottom: 2rem;
	}

	#contents .purchase h2 {
		font-size: 24px;
		position: relative;
		z-index: 1;
		margin-bottom: 3rem;
		text-align: center;
		width: 100%;
	}

	#contents .purchase .h2_un h2::after {
		content: url(/images/title_under.svg);
		width: 100px;
		display: inline-block;
		position: absolute;
		bottom: -1.5rem;
		left: 50%;
		transform: translateX(-50%);
		z-index: -1;
	}

	#contents .purchase .inner {
		background: url(images/bg.svg);
		padding: 2rem 0;
	}

	#contents .purchase .inner .wrapper {
		padding: 1rem;
		display: flex;
		align-items: stretch;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	#contents .purchase .inner:not(.pick, .pick2) .wrapper,
	#contents .purchase .inner.pick3 .wrapper {
		background-color: #fff;
	}

	#contents .purchase .onayami {
		background: linear-gradient(to bottom, #fff 0%, #e6e6e6 25%, #f8f8f8 40%, #858585 75%, #ededed 100%);
	}

	#contents .purchase .onayami .wrapper {
		padding: 2rem;
	}

	#contents .purchase .onayami .flex {
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: flex-end;
		background-color: #fff;
		border: 1px solid #e8e29d;
		border-image: linear-gradient(to left, #e8e29d, #885d1e);
		border-image-slice: 1;
		padding: 1rem 1rem 0;
		margin: 0 auto;
	}

	@media all and (min-width: 1100px) {
		#contents .purchase .onayami .flex {
			flex-wrap: wrap;
			justify-content: center;
		}

		#contents .purchase .onayami .flex .textarea {
			margin-right: 1rem;
		}
	}

	#contents .purchase .onayami .flex .textarea {
		width: 62%;
	}

	#contents .purchase .onayami .flex .textarea li {
		font-size: 18px;
		margin-bottom: 1rem;
		padding-left: 1rem;
		position: relative;
	}

	#contents .purchase .onayami .flex .textarea li::before {
		content: "";
		display: inline-block;
		width: .5rem;
		height: .5rem;
		background: linear-gradient(to bottom, #e8e29d, #885d1e);
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
	}

	#contents .purchase .onayami .flex figure {
		width: 35%;
		max-width: 340px;
	}

	#contents .purchase .inner:not(.reverce) {
		background-color: #fff;
	}

	#contents .purchase .inner h2 {
		font-size: 24px;
		padding: .5rem 1rem .5rem 2rem;
		border-bottom: 2px solid #e8e29d;
		border-image: linear-gradient(to left, #e8e29d, #885d1e);
		border-image-slice: 1;
		margin-bottom: 1rem;
		text-align: left;
	}

	#contents .purchase .inner h2 .red {
		color: #ff0000;
	}

	#contents .purchase .inner h2 .big {
		font-size: 28px;
	}

	#contents .purchase .inner:not(.pick, .pick2) h2::before {
		content: "";
		display: inline-block;
		width: 1rem;
		height: 100%;
		background: linear-gradient(to bottom, #e8e29d, #885d1e);
		position: absolute;
		left: 0;
		top: 0;
	}

	#contents .purchase .onayami .textarea,
	#contents .purchase .inner .textarea {
		width: 53%;
		padding: .5rem;
	}

	#contents .purchase .onayami figure,
	#contents .purchase .inner figure {
		width: 45%;
	}

	#contents .purchase .inner.pick {
		background: url(images/bg2.svg) center/cover, linear-gradient(to right, #cdcdcd 0%, #e6e6e6 25%, #f8f8f8 42%, #e6e6e6 64%, #6b6b6b 100%);
		position: relative;
		z-index: 1;
	}

	#contents .purchase .inner.pick h2 {
		padding: 0 0 0.3rem;
	}

	#contents .purchase .inner.pick2 {
		background: #000;
		position: relative;
		z-index: 1;
	}

	#contents .purchase .inner.pick .bg,
	#contents .purchase .inner.pick .bg2 {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 35vw;
		max-width: 560px;
		height: 100%;
		clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%);
		-webkit-clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%);
		background: linear-gradient(to right, #cdcdcd 0%, #e6e6e6 25%, #f8f8f8 42%, #e6e6e6 64%, #6b6b6b 100%);
		z-index: -1;
		opacity: .6;
	}

	#contents .purchase .inner.pick .bg2 {
		width: 31.25vw;
		max-width: 500px;
		background: linear-gradient(to right, #cdcdcd 0%, #e6e6e6 25%, #f8f8f8 42%, #e6e6e6 64%, #6b6b6b 100%);
		z-index: -1;
		opacity: .8;
	}

	#contents .purchase .inner.pick2 .bg,
	#contents .purchase .inner.pick2 .bg2 {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 35vw;
		max-width: 560px;
		height: 100%;
		clip-path: polygon(100% 0, 0% 100%, 100% 100%);
		-webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
		background-color: rgba(51, 51, 51, 0.6);
		z-index: -1;
	}

	#contents .purchase .inner.pick2 .bg2 {
		width: 31.25vw;
		max-width: 500px;
		background-color: rgba(51, 51, 51, 0.8);
		z-index: -1;
	}

	#contents .purchase .inner.pick2 * {
		color: #fff;
	}

	#contents .purchase .inner.pick2 h2 {
		padding: 0.5rem 0 0.3rem;
		background: #fff;
		color: #000;
	}

	#contents .purchase .inner.pick h2 .pickup,
	#contents .purchase .inner.pick2 h2 .pickup {
		padding: .5rem 1rem;
		background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
		color: #fff;
		margin-right: 1rem;
	}


	#contents .purchase .merit {
		background: url(images/bg2.svg) center/cover, linear-gradient(to right, #333 0%, #000 100%);
		position: relative;
		z-index: 1;
		padding: 3rem 0;
	}

	#contents .purchase .merit .bg,
	#contents .purchase .merit .bg2 {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 40vw;
		/* max-width: 560px; */
		height: 80%;
		clip-path: polygon(100% 0, 0% 100%, 100% 100%);
		-webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
		background-color: rgba(51, 51, 51, 0.6);
		z-index: -1;
	}

	#contents .purchase .merit .bg2 {
		width: 35vw;
		/* max-width: 500px; */
		background-color: rgba(51, 51, 51, 0.8);
		z-index: -1;
	}

	#contents .purchase .merit h2 {
		color: #fff;
	}

	#contents .purchase .merit .flex {
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: stretch;
	}

	#contents .purchase .merit .flex .box {
		flex-direction: column;
		align-items: center;
		width: 48%;
		background: linear-gradient(to bottom, #fff 0%, #e6e6e6 25%, #f8f8f8 40%, #858585 75%, #ededed 100%);
		margin-bottom: 2rem;
	}

	#contents .purchase .merit .flex .box h3 {
		width: 100%;
		position: relative;
		margin-bottom: 2rem;
		order: 1;
	}

	#contents .purchase .merit .flex .box h3 .midashi {
		font-size: 22px;
		padding: .5rem;
		background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
		color: #fff;
		display: inline-block;
		margin: 0 0 1rem;
	}

	#contents .purchase .merit .flex .box h3 .title_box {
		text-align: center;
		padding: 0.5rem;
	}

	#contents .purchase .merit .flex .box h3 .title {
		font-size: 24px;
		display: inline-block;
		position: relative;
	}

	#contents .purchase .merit .flex .box h3 .title:not(.lastborder)::after {
		content: "";
		display: inline-block;
		width: 100%;
		height: 1px;
		background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
		position: absolute;
		bottom: 0;
		left: 0;
	}

	#contents .purchase .merit .flex .box h3 .title.lastborder::after {
		content: url(images/h2_under.svg);
		width: calc(100% + 1rem);
		position: absolute;
		bottom: -15px;
		left: -3px;
	}

	#contents .purchase .merit .flex .box .text {
		padding: 1rem 1.5rem 2rem;
		order: 3;
	}

	#contents .purchase .merit .flex .box figure {
		width: 100%;
		order: 2;
		max-width: 600px;
	}

	@media all and (min-width: 769px) and (max-width: 900px) {
		#contents .purchase .merit .flex .box {
			width: 100%;
		}
	}

	/* ----------------------------------------------
contact
------------------------------------------------*/
	#contents #contact {
		margin-top: 5rem;
	}

	#contents #contact h2 {
		font-size: 24px;
		position: relative;
		z-index: 1;
		margin-bottom: 3rem;
		text-align: center;
		width: 100%;
	}

	#contents #contact h2::after {
		content: url(/images/title_under.svg);
		width: 100px;
		display: inline-block;
		position: absolute;
		bottom: -1.5rem;
		left: 50%;
		transform: translateX(-50%);
		z-index: -1;
	}

	#contents #contact .obi {
		text-align: center;
	}

	#contents #contact #formWrap table {
		border-collapse: collapse;
		border-spacing: 0;
		width: 100%;
		max-width: 1000px;
		margin: 2rem auto;
	}

	#contents #contact #formWrap table tr th {
		width: auto;
		border: 1px solid #CCC;
		background: linear-gradient(to right, #6b6b6b 0%, #e6e6e6 35%, #f8f8f8 58%, #e6e6e6 75%, #cdcdcd 100%);
		font-size: 18px;
		font-weight: normal;
		text-align: center;
		vertical-align: middle;
		padding: 0.5rem 0;
		min-width: 150px;
	}

	#contents #contact #formWrap table tr th.black {
		background: #6b6b6b;
		color: #fff;
	}

	#contents #contact #formWrap .must {
		font-size: 14px;
		border-radius: 5px;
		border: 1px solid #000;
		background-color: #fff;
		color: #000;
		padding: 0 0.5rem;
	}

	#contents #contact #formWrap table tr td {
		padding: 1rem;
		border: 1px solid #000;
	}

	#contents #contact #formWrap table tr td .notes {
		display: block;
		margin-top: 1rem;
	}

	#contents #contact #formWrap table tr td .notes span {
		display: block;
	}

	#contents #contact #formWrap table tr td .notes span.pl {
		padding-left: 1rem;
	}

	#contents #contact #formWrap table tr td .add_sub_title {
		margin-top: 1rem;
	}

	#contents #contact #formWrap table tr td .box {
		border: 1px solid #000;
		padding: 0.5rem;
	}

	#contents #contact #formWrap table tr td .box p {
		font-size: 14px;
	}

	#contents #contact #formWrap table tr td input[type=text],
	#contents #contact #formWrap table tr td input[type=tel] {
		border: 1px solid #000;
		border-radius: 5px;
		margin: 0.5rem 0;
		padding: 0.1rem 0.5rem;
	}

	#contents #contact #formWrap table tr td select {
		border: 1px solid #000;
		border-radius: 5px;
		background: url(images/button.svg) right center/auto 100% no-repeat;
		width: 160px;
		padding: 0 0.2rem;
	}

	#contents #contact #formWrap table tr td select.sel_tan {
		width: 80px;
	}

	#contents #contact #formWrap table tr td select.sel_naga {
		width: 200px !important;
	}

	#contents #contact #formWrap table tr td textarea {
		border: 1px solid #000;
		border-radius: 5px;
		margin: 0.5rem 0;
		width: 600px;
	}

	#contents #contact #formWrap table tr td .madori_bikou .notes {
		font-size: 15px;
	}

	#contents #contact #formWrap table tr td.customer .namae .notes,
	#contents #contact #formWrap table tr td.customer .furigana .notes {
		display: inline-block;
		margin-right: 1rem;
	}

	#contents #contact #formWrap table tr td.customer .add_wrap {
		background-color: #ccc;
		padding: 1rem;
	}

	#contents #contact #formWrap table tr td.customer .add_wrap .notes {
		margin: 0;
	}

	#contents #contact #formWrap table tr td.customer .tel_wrap .notes.m0 {
		margin: 0;
		font-size: 14px;
	}

	#contents #contact #formWrap table tr td.customer .mail_wrap input,
	#contents #contact #formWrap table tr td.customer .tel_wrap input {
		width: 500px;
	}

	#contents #contact #formWrap table tr td .doui {
		font-size: 14px;
		margin-left: 1rem;
	}

	#contents #contact #formWrap #submit {
		text-align: center;
	}

	#contents #contact #formWrap #submit input[type=submit] {
		background: linear-gradient(to bottom, #e8e29d 0%, #885d1e 100%);
		color: #fff;
		font-size: 20px;
		padding: .5rem 1.5rem;
		border-radius: 5px;
	}

	#contents #contact #formWrap .error-messages {
		margin: 0 auto;
		padding: 20px 20px;
		max-width: 1000px;
		width: 100%;
		background: rgb(255, 238, 238);
	}

	#contents #contact #formWrap .error-messages ul {
		text-align: left;
	}

}

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

pad設定

------------------------------------------------*/
@media all and (min-width: 520px) and (max-width: 769px) {

	/* ----------------------------------------------
topImage
------------------------------------------------*/
	#under_page #topImage {
		background: url(images/topImage.jpg) center 30%/cover no-repeat;
		overflow: auto;
		height: auto;
		width: auto;
	}

	#under_page #topImage h1 {
		padding: 1rem 2rem;
	}

	#contents .midashi {
		margin-bottom: 3rem;
	}

	#contents .midashi h2 {
		text-align: center;
		display: flex;
		flex-direction: column;
		justify-content: center;
		position: relative;
		margin: 0 auto 4rem;
	}

	#contents .midashi h2::after {
		content: url(images/dot.svg);
		width: 100px;
		display: inline-block;
		position: absolute;
		bottom: -2rem;
		left: 50%;
		transform: translateX(-50%);
	}

	#contents .midashi h2 .small {
		font-size: 32px;
	}

	#contents .midashi h2 .big {
		font-size: 42px;
		position: relative;
	}

	#contents .midashi .text {
		font-size: 16px;
		text-align: center;
		display: block;
		width: 70%;
		margin: 0 auto;
	}

	#contents .w_banner {
		max-width: 700px;
		margin: 0 auto 1rem;
	}

	/* ----------------------------------------------
points
------------------------------------------------*/
	#contents .purchase {
		position: relative;
		z-index: 1;
		margin-bottom: 2rem;
	}

	#contents .purchase h2 {
		font-size: 24px;
		position: relative;
		z-index: 1;
		margin-bottom: 2rem;
		text-align: center;
		width: 100%;
		order: 1;
	}

	#contents .purchase .h2_un h2::after {
		content: url(/images/title_under.svg);
		width: 100px;
		display: inline-block;
		position: absolute;
		bottom: -1.5rem;
		left: 50%;
		transform: translateX(-50%);
		z-index: -1;
	}

	#contents .purchase .inner {
		background: url(images/bg.svg);
		padding: 2rem 0;
	}

	#contents .purchase .inner .wrapper {
		padding: 1rem;
		display: flex;
		align-items: stretch;
		justify-content: space-between;
		flex-wrap: wrap;
		flex-direction: column;
	}

	#contents .purchase .inner:not(.pick, .pick2) .wrapper,
	#contents .purchase .inner.pick3 .wrapper {
		background-color: #fff;
	}

	#contents .purchase .onayami .wrapper {
		/* padding: 2rem; */
		background: linear-gradient(to bottom, #fff 0%, #e6e6e6 25%, #f8f8f8 40%, #858585 75%, #ededed 100%);
	}

	#contents .purchase .onayami .flex {
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		background-color: #fff;
		border: 1px solid #e8e29d;
		border-image: linear-gradient(to left, #e8e29d, #885d1e);
		border-image-slice: 1;
		padding: 1rem 1rem 0;
	}

	#contents .purchase .onayami .flex .textarea {
		width: 100%;
		order: 2;
	}

	#contents .purchase .onayami .flex .textarea li {
		font-size: 18px;
		margin-bottom: 1rem;
		padding-left: 1rem;
		position: relative;
	}

	#contents .purchase .onayami .flex .textarea li::before {
		content: "";
		display: inline-block;
		width: .5rem;
		height: .5rem;
		background: linear-gradient(to bottom, #e8e29d, #885d1e);
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
	}

	#contents .purchase .onayami .flex figure {
		width: 60%;
		order: 3;
	}

	#contents .purchase .inner:not(.reverce) {
		background-color: #fff;
	}

	#contents .purchase .inner h2 {
		font-size: 20px;
		padding: .5rem 1rem .5rem 2rem;
		border-bottom: 2px solid #e8e29d;
		border-image: linear-gradient(to left, #e8e29d, #885d1e);
		border-image-slice: 1;
		margin-bottom: 1rem;
		text-align: left;
	}

	#contents .purchase .inner h2 .red {
		color: #ff0000;
	}

	#contents .purchase .inner h2 .big {
		font-size: 24px;
	}

	#contents .purchase .inner:not(.pick, .pick2) h2::before {
		content: "";
		display: inline-block;
		width: 1rem;
		height: 100%;
		background: linear-gradient(to bottom, #e8e29d, #885d1e);
		position: absolute;
		left: 0;
		top: 0;
	}

	#contents .purchase .inner.pick {
		background: url(images/bg2.svg) center/cover, linear-gradient(to right, #cdcdcd 0%, #e6e6e6 25%, #f8f8f8 42%, #e6e6e6 64%, #6b6b6b 100%);
		position: relative;
		z-index: 1;
	}

	#contents .purchase .inner.pick h2 {
		padding: 0 0 0.2rem;
	}

	#contents .purchase .inner.pick2 {
		background: #000;
		position: relative;
		z-index: 1;
	}

	#contents .purchase .inner.pick .bg,
	#contents .purchase .inner.pick .bg2 {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 50vw;
		height: 100%;
		clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%);
		-webkit-clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%);
		background: linear-gradient(to right, #cdcdcd 0%, #e6e6e6 25%, #f8f8f8 42%, #e6e6e6 64%, #6b6b6b 100%);
		z-index: -1;
		opacity: .6;
	}

	#contents .purchase .inner.pick .bg2 {
		width: 45vw;
		background: linear-gradient(to right, #cdcdcd 0%, #e6e6e6 25%, #f8f8f8 42%, #e6e6e6 64%, #6b6b6b 100%);
		z-index: -1;
		opacity: .8;
	}

	#contents .purchase .inner.pick2 .bg,
	#contents .purchase .inner.pick2 .bg2 {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 50vw;
		height: 100%;
		clip-path: polygon(100% 0, 0% 100%, 100% 100%);
		-webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
		background-color: rgba(51, 51, 51, 0.6);
		z-index: -1;
	}

	#contents .purchase .inner.pick2 .bg2 {
		width: 45vw;
		background-color: rgba(51, 51, 51, 0.8);
		z-index: -1;
	}

	#contents .purchase .inner.pick2 * {
		color: #fff;
	}

	#contents .purchase .inner.pick2 h2 {
		padding: 0.4rem 0 0.3rem;
		background: #fff;
		color: #000;
	}

	#contents .purchase .inner.pick h2 .pickup,
	#contents .purchase .inner.pick2 h2 .pickup {
		font-size: 16px;
		padding: .5rem 1rem;
		background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
		color: #fff;
		margin-right: 1rem;
	}

	#contents .purchase .onayami .textarea,
	#contents .purchase .inner .textarea {
		width: 100%;
		padding: .5rem;
		order: 3;
	}

	#contents .purchase .onayami figure,
	#contents .purchase .inner figure {
		width: 80%;
		margin: 0 auto 1rem;
		order: 2;
	}

	#contents .purchase .merit {
		background: url(images/bg2.svg) center/cover, linear-gradient(to right, #333 0%, #000 100%);
		padding: 3rem 0;
		position: relative;
		z-index: 1;
	}

	#contents .purchase .merit .bg,
	#contents .purchase .merit .bg2 {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 60vw;
		height: 80%;
		clip-path: polygon(100% 0, 0% 100%, 100% 100%);
		-webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
		background-color: rgba(51, 51, 51, 0.6);
		z-index: -1;
	}

	#contents .purchase .merit .bg2 {
		width: 55vw;
		background-color: rgba(51, 51, 51, 0.8);
		z-index: -1;
	}

	#contents .purchase .merit h2 {
		color: #fff;
	}

	#contents .purchase .merit .flex {
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: stretch;
	}

	#contents .purchase .merit .flex .box {
		flex-direction: column;
		align-items: center;
		width: 100%;
		background: linear-gradient(to bottom, #fff 0%, #e6e6e6 25%, #f8f8f8 40%, #858585 75%, #ededed 100%);
		margin-bottom: 2rem;
	}

	#contents .purchase .merit .flex .box h3 {
		width: 100%;
		position: relative;
		margin-bottom: 2rem;
		order: 1;
	}

	#contents .purchase .merit .flex .box h3 .fullnone {
		display: none;
	}

	#contents .purchase .merit .flex .box h3 .midashi {
		font-size: 18px;
		padding: 0.5rem;
		background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
		color: #fff;
		display: inline-block;
		margin: 0 0 1rem;
	}

	#contents .purchase .merit .flex .box h3 .title_box {
		text-align: center;
		padding: 0.5rem;
	}

	#contents .purchase .merit .flex .box h3 .title {
		font-size: 20px;
		display: inline-block;
		position: relative;
	}

	#contents .purchase .merit .flex .box h3 .title:not(.lastborder)::after {
		content: "";
		display: inline-block;
		width: 100%;
		height: 1px;
		background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
		position: absolute;
		bottom: 0;
		left: 0;
	}

	#contents .purchase .merit .flex .box h3 .title.lastborder::after {
		content: url(images/h2_under.svg);
		width: calc(100% + 1rem);
		position: absolute;
		bottom: -15px;
		left: -3px;
	}

	#contents .purchase .merit .flex .box .text {
		padding: 1rem 1.5rem 2rem;
		order: 3;
	}

	#contents .purchase .merit .flex .box figure {
		width: 100%;
		order: 2;
		max-width: 550px;
	}

	/* ----------------------------------------------
contact
------------------------------------------------*/
	#contents #contact {
		margin-top: 5rem;
	}

	#contents #contact h2 {
		font-size: 24px;
		position: relative;
		z-index: 1;
		margin-bottom: 3rem;
		text-align: center;
		width: 100%;
	}

	#contents #contact h2::after {
		content: url(/images/title_under.svg);
		width: 100px;
		display: inline-block;
		position: absolute;
		bottom: -1.5rem;
		left: 50%;
		transform: translateX(-50%);
		z-index: -1;
	}

	#contents #contact .obi {
		text-align: center;
	}

	#contents #contact #formWrap table {
		border-collapse: collapse;
		border-spacing: 0;
		width: 100%;
		/* max-width: 1000px; */
		margin: 2rem auto;
		/* display: block; */
		border: 1px solid #000;
	}

	#contents #contact #formWrap table tr th {
		width: auto;
		border: 1px solid #CCC;
		background: linear-gradient(to right, #6b6b6b 0%, #e6e6e6 35%, #f8f8f8 58%, #e6e6e6 75%, #cdcdcd 100%);
		font-size: 18px;
		font-weight: normal;
		text-align: center;
		vertical-align: middle;
		padding: 0.5rem 0;
		min-width: 150px;
		width: 100%;
		display: block;
		border-bottom: 1px solid #000;
	}

	#contents #contact #formWrap table tr th.black {
		background: #6b6b6b;
		color: #fff;
	}

	#contents #contact #formWrap .must {
		font-size: 14px;
		border-radius: 5px;
		border: 1px solid #000;
		background-color: #fff;
		color: #000;
		padding: 0 0.5rem;
		margin-left: 1rem;
	}

	#contents #contact #formWrap table tr td {
		padding: 1rem;
		border-bottom: 1px solid #000;
		width: 100%;
		display: block;
	}

	#contents #contact #formWrap table tr:last-of-type td {
		border-bottom: none;
	}

	#contents #contact #formWrap table tr td .notes {
		display: block;
		margin-top: 1rem;
	}

	#contents #contact #formWrap table tr td .notes span {
		display: block;
	}

	#contents #contact #formWrap table tr td .notes span.pl {
		padding-left: 1rem;
	}

	#contents #contact #formWrap table tr td .add_sub_title {
		margin-top: 1rem;
	}

	#contents #contact #formWrap table tr td .box {
		border: 1px solid #000;
		padding: 0.5rem;
	}

	#contents #contact #formWrap table tr td .box p {
		font-size: 14px;
	}

	#contents #contact #formWrap table tr td input[type=text],
	#contents #contact #formWrap table tr td input[type=tel] {
		border: 1px solid #000;
		border-radius: 5px;
		margin: 0.5rem 0;
		padding: 0.1rem 0.5rem;
	}

	#contents #contact #formWrap table tr td select {
		border: 1px solid #000;
		border-radius: 5px;
		background: url(images/button.svg) right center/auto 100% no-repeat;
		width: 160px;
		padding: 0 0.2rem;
	}

	#contents #contact #formWrap table tr td select.sel_tan {
		width: 80px;
	}

	#contents #contact #formWrap table tr td select.sel_naga {
		/* width: 200px!important; */
	}

	#contents #contact #formWrap table tr td textarea {
		border: 1px solid #000;
		border-radius: 5px;
		margin: 0.5rem 0;
		width: 100%;
	}

	#contents #contact #formWrap table tr td .madori_bikou .notes {
		font-size: 15px;
	}

	#contents #contact #formWrap table tr td.customer .namae .notes,
	#contents #contact #formWrap table tr td.customer .furigana .notes {
		display: inline-block;
		margin-right: 1rem;
	}

	#contents #contact #formWrap table tr td.customer .add_wrap {
		background-color: #ccc;
		padding: 1rem;
	}

	#contents #contact #formWrap table tr td.customer .add_wrap .notes {
		margin: 0;
	}

	#contents #contact #formWrap table tr td.customer .tel_wrap .notes.m0 {
		margin: 0;
		font-size: 14px;
	}

	#contents #contact #formWrap table tr td.customer .mail_wrap input,
	#contents #contact #formWrap table tr td.customer .tel_wrap input {
		width: 100%;
	}

	#contents #contact #formWrap table tr td .doui {
		font-size: 14px;
		margin-left: 1rem;
	}

	#contents #contact #formWrap #submit {
		text-align: center;
	}

	#contents #contact #formWrap #submit input[type=submit] {
		background: linear-gradient(to bottom, #e8e29d 0%, #885d1e 100%);
		color: #fff;
		font-size: 20px;
		padding: .5rem 1.5rem;
		border-radius: 5px;
	}

	#contents #contact #formWrap .error-messages {
		margin: 0 auto;
		padding: 20px 20px;
		max-width: 769px;
		width: 100%;
		background: rgb(255, 238, 238);
	}

	#contents #contact #formWrap .error-messages ul {
		text-align: left;
	}

}

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

sp設定

------------------------------------------------*/
@media all and (max-width: 520px) {

	/* ----------------------------------------------
topImage
------------------------------------------------*/
	#under_page #topImage {
		background: url(images/topImage.jpg) center 30%/cover no-repeat;
	}

	#under_page #topImage h1 {
		padding: 1rem 2rem;
	}

	#contents .midashi {
		margin-bottom: 3rem;
	}

	#contents .midashi h2 {
		text-align: center;
		display: flex;
		flex-direction: column;
		justify-content: center;
		position: relative;
		margin: 0 auto 4rem;
	}

	#contents .midashi h2::after {
		content: url(images/dot.svg);
		width: 100px;
		display: inline-block;
		position: absolute;
		bottom: -2rem;
		left: 50%;
		transform: translateX(-50%);
	}

	#contents .midashi h2 .small {
		font-size: 18px;
	}

	#contents .midashi h2 .big {
		font-size: 24px;
		position: relative;
	}

	#contents .midashi .text {
		font-size: 16px;
		text-align: center;
		display: block;
		width: 80%;
		margin: 0 auto;
	}

	#contents .w_banner {
		max-width: 300px;
		margin: 0 auto 1rem;
	}

	/* ----------------------------------------------
points
------------------------------------------------*/
	#contents .purchase {
		position: relative;
		z-index: 1;
		margin-bottom: 2rem;
	}

	#contents .purchase h2 {
		font-size: 20px;
		position: relative;
		z-index: 1;
		margin-bottom: 3rem;
		text-align: center;
		width: 100%;
		order: 1;
	}

	#contents .purchase .h2_un h2::after {
		content: url(/images/title_under.svg);
		width: 100px;
		display: inline-block;
		position: absolute;
		bottom: -1.5rem;
		left: 50%;
		transform: translateX(-50%);
		z-index: -1;
	}

	#contents .purchase .inner {
		background: url(images/bg.svg);
		padding: 2rem 0;
	}

	#contents .purchase .inner .wrapper {
		padding: 1rem;
		display: flex;
		align-items: stretch;
		justify-content: space-between;
		flex-wrap: wrap;
		flex-direction: column;
	}

	#contents .purchase .inner:not(.pick, .pick2) .wrapper,
	#contents .purchase .inner.pick3 .wrapper {
		background-color: #fff;
	}

	#contents .purchase .onayami .wrapper {
		/* padding: 2rem; */
		background: linear-gradient(to bottom, #fff 0%, #e6e6e6 25%, #f8f8f8 40%, #858585 75%, #ededed 100%);
	}

	#contents .purchase .onayami .flex {
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		background-color: #fff;
		border: 1px solid #e8e29d;
		border-image: linear-gradient(to left, #e8e29d, #885d1e);
		border-image-slice: 1;
		padding: 1rem 1rem 0;
	}

	#contents .purchase .onayami .flex .textarea {
		width: 100%;
		order: 2;
	}

	#contents .purchase .onayami .flex .textarea li {
		font-size: 16px;
		margin-bottom: 1rem;
		padding-left: 1rem;
		position: relative;
	}

	#contents .purchase .onayami .flex .textarea li::before {
		content: "";
		display: inline-block;
		width: .5rem;
		height: .5rem;
		background: linear-gradient(to bottom, #e8e29d, #885d1e);
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
	}

	#contents .purchase .onayami .flex figure {
		width: 60%;
		order: 3;
		margin: 0;
	}

	#contents .purchase .inner:not(.reverce) {
		background-color: #fff;
	}

	#contents .purchase .inner h2 {
		font-size: 20px;
		padding: .5rem 1rem .5rem 2rem;
		border-bottom: 2px solid #e8e29d;
		border-image: linear-gradient(to left, #e8e29d, #885d1e);
		border-image-slice: 1;
		margin-bottom: 1rem;
		text-align: left;
	}

	#contents .purchase .inner h2 .red {
		color: #ff0000;
	}

	#contents .purchase .inner h2 .big {
		font-size: 22px;
	}

	#contents .purchase .inner:not(.pick, .pick2) h2::before {
		content: "";
		display: inline-block;
		width: 1rem;
		height: 100%;
		background: linear-gradient(to bottom, #e8e29d, #885d1e);
		position: absolute;
		left: 0;
		top: 0;
	}

	#contents .purchase .inner.pick {
		background: url(images/bg2.svg) center/cover, linear-gradient(to right, #cdcdcd 0%, #e6e6e6 25%, #f8f8f8 42%, #e6e6e6 64%, #6b6b6b 100%);
		position: relative;
		z-index: 1;
	}

	#contents .purchase .inner.pick h2 {
		padding: 0 0 0.2rem;
	}

	#contents .purchase .inner.pick2 {
		background: #000;
		position: relative;
		z-index: 1;
	}

	#contents .purchase .inner.pick .bg,
	#contents .purchase .inner.pick .bg2 {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 50vw;
		height: 100%;
		clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%);
		-webkit-clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%);
		background: linear-gradient(to right, #cdcdcd 0%, #e6e6e6 25%, #f8f8f8 42%, #e6e6e6 64%, #6b6b6b 100%);
		z-index: -1;
		opacity: .6;
	}

	#contents .purchase .inner.pick .bg2 {
		width: 45vw;
		background: linear-gradient(to right, #cdcdcd 0%, #e6e6e6 25%, #f8f8f8 42%, #e6e6e6 64%, #6b6b6b 100%);
		z-index: -1;
		opacity: .8;
	}

	#contents .purchase .inner.pick2 .bg,
	#contents .purchase .inner.pick2 .bg2 {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 50vw;
		height: 100%;
		clip-path: polygon(100% 0, 0% 100%, 100% 100%);
		-webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
		background-color: rgba(51, 51, 51, 0.6);
		z-index: -1;
	}

	#contents .purchase .inner.pick2 .bg2 {
		width: 45vw;
		background-color: rgba(51, 51, 51, 0.8);
		z-index: -1;
	}

	#contents .purchase .inner.pick2 * {
		color: #fff;
	}

	#contents .purchase .inner.pick2 h2 {
		padding: 0.4rem 0 0.3rem;
		background: #fff;
		color: #000;
	}

	#contents .purchase .inner.pick h2 .pickup,
	#contents .purchase .inner.pick2 h2 .pickup {
		font-size: 16px;
		padding: .5rem .7rem;
		background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
		color: #fff;
		margin-right: .5rem;
	}

	#contents .purchase .inner.pick3 h2 {
		font-size: 18px;
	}

	#contents .purchase .inner.pick3 h2 .pickup {
		display: block;
		width: fit-content;
	}

	#contents .purchase .onayami .textarea,
	#contents .purchase .inner .textarea {
		width: 100%;
		padding: .5rem;
		order: 3;
	}

	#contents .purchase .onayami figure,
	#contents .purchase .inner figure {
		width: 80%;
		margin: 0 auto 1rem;
		order: 2;
	}

	#contents .purchase .merit {
		background: url(images/bg2.svg) center/cover, linear-gradient(to right, #333 0%, #000 100%);
		padding: 3rem 0;
		position: relative;
		z-index: 1;
	}

	#contents .purchase .merit .bg,
	#contents .purchase .merit .bg2 {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 60vw;
		height: 80%;
		clip-path: polygon(100% 0, 0% 100%, 100% 100%);
		-webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
		background-color: rgba(51, 51, 51, 0.6);
		z-index: -1;
	}

	#contents .purchase .merit .bg2 {
		width: 55vw;
		background-color: rgba(51, 51, 51, 0.8);
		z-index: -1;
	}

	#contents .purchase .merit h2 {
		color: #fff;
	}

	#contents .purchase .merit .flex {
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: stretch;
	}

	#contents .purchase .merit .flex .box {
		flex-direction: column;
		align-items: center;
		width: 100%;
		background: linear-gradient(to bottom, #fff 0%, #e6e6e6 25%, #f8f8f8 40%, #858585 75%, #ededed 100%);
		margin-bottom: 2rem;
	}

	#contents .purchase .merit .flex .box h3 {
		width: 100%;
		position: relative;
		margin-bottom: 2rem;
		order: 1;
	}

	#contents .purchase .merit .flex .box h3 .midashi {
		font-size: 18px;
		padding: 0.5rem;
		background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
		color: #fff;
		display: inline-block;
		margin: 0 0 1rem;
	}

	#contents .purchase .merit .flex .box h3 .title_box {
		text-align: center;
		padding: 0.5rem;
	}

	#contents .purchase .merit .flex .box h3 .title {
		font-size: 20px;
		display: inline-block;
		position: relative;
	}

	#contents .purchase .merit .flex .box h3 .title:not(.lastborder)::after {
		content: "";
		display: inline-block;
		width: 100%;
		height: 1px;
		background: linear-gradient(to right, #e8e29d 0%, #885d1e 100%);
		position: absolute;
		bottom: 0;
		left: 0;
	}

	#contents .purchase .merit .flex .box h3 .title.lastborder::after {
		content: url(images/h2_under.svg);
		width: calc(100% + 1rem);
		position: absolute;
		bottom: -15px;
		left: -3px;
	}

	#contents .purchase .merit .flex .box .text {
		padding: 1rem 1.5rem 2rem;
		order: 3;
	}

	#contents .purchase .merit .flex .box figure {
		width: 100%;
		order: 2;
	}

	/* ----------------------------------------------
contact
------------------------------------------------*/
	#contents #contact {
		margin-top: 5rem;
	}

	#contents #contact h2 {
		font-size: 24px;
		position: relative;
		z-index: 1;
		margin-bottom: 3rem;
		text-align: center;
		width: 100%;
	}

	#contents #contact h2::after {
		content: url(/images/title_under.svg);
		width: 100px;
		display: inline-block;
		position: absolute;
		bottom: -1.5rem;
		left: 50%;
		transform: translateX(-50%);
		z-index: -1;
	}

	#contents #contact .obi {
		text-align: center;
	}

	#contents #contact #formWrap table {
		border-collapse: collapse;
		border-spacing: 0;
		width: 100%;
		/* max-width: 1000px; */
		margin: 2rem auto;
		display: block;
		border: 1px solid #000;
	}

	#contents #contact #formWrap table tr th {
		width: auto;
		border: 1px solid #CCC;
		background: linear-gradient(to right, #6b6b6b 0%, #e6e6e6 35%, #f8f8f8 58%, #e6e6e6 75%, #cdcdcd 100%);
		font-size: 18px;
		font-weight: normal;
		text-align: center;
		vertical-align: middle;
		padding: 0.5rem 0;
		min-width: 150px;
		width: 100%;
		display: block;
		border-bottom: 1px solid #000;
	}

	#contents #contact #formWrap table tr th.black {
		background: #6b6b6b;
		color: #fff;
	}

	#contents #contact #formWrap .must {
		font-size: 14px;
		border-radius: 5px;
		border: 1px solid #000;
		background-color: #fff;
		color: #000;
		padding: 0 0.5rem;
		margin-left: 1rem;
	}

	#contents #contact #formWrap table tr td {
		padding: 1rem;
		border-bottom: 1px solid #000;
		width: 100%;
		display: block;
	}

	#contents #contact #formWrap table tr:last-of-type td {
		border-bottom: none;
	}

	#contents #contact #formWrap table tr td .notes {
		display: block;
		margin-top: 1rem;
	}

	#contents #contact #formWrap table tr td .notes span {
		display: block;
	}

	#contents #contact #formWrap table tr td .notes span.pl {
		padding-left: 1rem;
	}

	#contents #contact #formWrap table tr td .add_sub_title {
		margin-top: 1rem;
	}

	#contents #contact #formWrap table tr td .box {
		border: 1px solid #000;
		padding: 0.5rem;
	}

	#contents #contact #formWrap table tr td .box p {
		font-size: 14px;
	}

	#contents #contact #formWrap table tr td input[type=text],
	#contents #contact #formWrap table tr td input[type=tel] {
		border: 1px solid #000;
		border-radius: 5px;
		margin: 0.5rem 0;
		padding: 0.1rem 0.5rem;
		width: 100%;
	}

	#contents #contact #formWrap table tr td input[type=text].addr2 {
		width: 90%;
	}

	#contents #contact #formWrap table tr.land td input[type=text],
	#contents #contact #formWrap table tr.build td input[type=text] {
		width: 70%;
	}

	#contents #contact #formWrap table tr td select {
		border: 1px solid #000;
		border-radius: 5px;
		background: url(images/button.svg) right center/auto 100% no-repeat;
		width: 160px;
		padding: 0 0.2rem;
	}

	#contents #contact #formWrap table tr td select.sel_tan {
		width: 80px;
	}

	#contents #contact #formWrap table tr td select.sel_naga {
		width: 200px !important;
	}

	#contents #contact #formWrap table tr td textarea {
		border: 1px solid #000;
		border-radius: 5px;
		margin: 0.5rem 0;
		width: 100% !important;
	}

	#contents #contact #formWrap table tr td .madori_bikou .notes {
		font-size: 15px;
	}

	#contents #contact #formWrap table tr td.customer .namae .notes,
	#contents #contact #formWrap table tr td.customer .furigana .notes {
		display: inline-block;
		margin-right: 1rem;
	}

	#contents #contact #formWrap table tr td.customer .add_wrap {
		background-color: #ccc;
		padding: 1rem;
	}

	#contents #contact #formWrap table tr td.customer .add_wrap .notes {
		margin: 0;
	}

	#contents #contact #formWrap table tr td.customer .tel_wrap .notes.m0 {
		margin: 0;
		font-size: 14px;
	}

	#contents #contact #formWrap table tr td.customer .mail_wrap input,
	#contents #contact #formWrap table tr td.customer .tel_wrap input {
		width: 100%;
	}

	#contents #contact #formWrap table tr td .doui {
		font-size: 14px;
		margin-left: 1rem;
	}

	#contents #contact #formWrap #submit {
		text-align: center;
	}

	#contents #contact #formWrap #submit input[type=submit] {
		background: linear-gradient(to bottom, #e8e29d 0%, #885d1e 100%);
		color: #fff;
		font-size: 20px;
		padding: .5rem 1.5rem;
		border-radius: 5px;
	}

	#contents #contact #formWrap .error-messages {
		margin: 0 auto;
		padding: 20px 20px;
		max-width: 520px;
		width: 100%;
		background: rgb(255, 238, 238);
	}

	#contents #contact #formWrap .error-messages ul {
		text-align: left;
	}

}

#formWrap .open {
	color: blue;
	cursor: pointer;
	text-decoration: underline;
}

#formWrap #privacy_policy {
	padding: 0px;
	margin-top: 0px;
	margin-bottom: 40px;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}

#formWrap #privacy_policy .pv {
	text-align: left;
	margin: 0px;
	padding: 20px;
	border: 1px solid #CCC;
	background-color: #fff;
}

#formWrap #privacy_policy .pv dl {
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
	font-size: 15px;
}

#formWrap #privacy_policy .pv dl .title {
	font-size: 16px;
	text-align: center;
	margin-bottom: 10px;
	padding-bottom: 5px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-left: 0px;
}

#formWrap #privacy_policy .pv dl dt {
	font-weight: bold;
}

#formWrap #privacy_policy .pvbox {
	display: none;
}

#formWrap #privacy_policy .open {
	text-align: center;
	margin-bottom: 20px;
	cursor: pointer;
	/*font-size: 150%;*/
	font-size: 18px;
	font-weight: 600;
	letter-spacing: .05em;
}

#formWrap #privacy_policy .open span {
	color: #E50615;
	text-decoration: underline;
}

#formWrap #privacy_policy .pvbox .pv dl dd {
	line-height: 1.5em;
}

#formWrap #privacy_policy .open {
	font-size: 13px;
	padding-top: 40px;
}

#formWrap #privacy_policy .pv dl {
	font-size: 12px;
}

#formWrap #privacy_policy .pvbox .pv dl dd {
	line-height: 1.8;
}

/* ----------------------------------------------
jsのためのcss
------------------------------------------------*/
#contents #contact #formWrap table tr.disnone {
	display: none;
}