
.-x-richtext ul, .-x-richtext ol {
	list-style-position: inside;
}
[data-legal]{
	position:relative;
	--legal-offset-h:attr(data-legal-offset-h px);
	--legal-offset-v:attr(data-legal-offset-v px);
}
[data-legal][data-legal-safe="1"]::after{
	position: absolute;
	opacity: 0.5;
	color: black;
	content: "墨";
	font-size: 16px;
	display: block;
	height: 24px;
	padding-top: 0px;
	background-image: url(/_lib/lc.png);
	background-size: auto 20px;
	background-repeat: no-repeat;
	padding-left: 50px;
	background-position: left top;
}
[data-legal][data-legal-safe="1"]:hover::after {
    position: absolute;
    opacity: 0.5;
    color: black;
    content: attr(data-legal-check-at);
    white-space:nowrap;
    font-size: 11px;
    display: block;
    height: 24px;
    background-image: url(/_lib/lc.png);
    background-size: auto 20px;
    background-repeat: no-repeat;
    padding-top: 15px;
    padding-left: 0px;
    background-position: left top;
}

[data-legal-position="left-top"]::after{
	left:var(--legal-offset-h);
	top:var(--legal-offset-v);
}
[data-legal-position="left-bottom"]::after{
	left:var(--legal-offset-h);
	bottom:var(--legal-offset-v);
}
[data-legal-position="right-top"]::after{
	right:var(--legal-offset-h);
	top:var(--legal-offset-v);
}
[data-legal-position="right-bottom"]::after{
	right:var(--legal-offset-h);
	bottom:var(--legal-offset-v);
}
/*common_css*/

/*! destyle.css v2.0.2 | MIT License | https://github.com/nicolas-cusan/destyle.css */

*,
::before,
::after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
}
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -webkit-tap-highlight-color: transparent; /* 3*/
}
body {
  margin: 0;
  background: #ffffff;
}
main {
  display: block;
}
p,
table,
blockquote,
address,
pre,
iframe,
form,
figure,
dl {
  margin: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  margin: 0;
}
ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
dt {
  font-weight: inherit;
}
dd {
  margin-left: 0;
}
hr {
  -webkit-box-sizing: content-box;
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
  border-top-width: 1px;
  margin: 0;
  clear: both;
  color: inherit;
}
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: inherit; /* 2 */
}
address {
  font-style: inherit;
}
a {
  background-color: transparent;
  text-decoration: none;
  color: inherit;
}
abbr[title] {
  text-decoration: underline; /* 2 */
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted; /* 2 */
}
b,
strong {
  font-weight: bolder;
}
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: inherit; /* 2 */
}
small {
  font-size: 80%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
img,
embed,
object,
iframe {
  vertical-align: bottom;
}

/* Forms */
/* ============================================ */
button,
input,
optgroup,
select,
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  background: transparent;
  padding: 0;
  margin: 0;
  outline: 0;
  border-radius: 0;
  text-align: inherit;
}
[type="checkbox"] {
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox;
  appearance: checkbox;
}
[type="radio"] {
  -webkit-appearance: radio;
  -moz-appearance: radio;
  appearance: radio;
}
button,
input {
  /* 1 */
  overflow: visible;
}
button,
select {
  /* 1 */
  text-transform: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
button[disabled],
[type="button"][disabled],
[type="reset"][disabled],
[type="submit"][disabled] {
  cursor: default;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}
select::-ms-expand {
  display: none;
}
option {
  padding: 0;
}
fieldset {
  margin: 0;
  padding: 0;
  min-width: 0;
}
legend {
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}
progress {
  vertical-align: baseline;
}
textarea {
  overflow: auto;
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
[type="search"] {
  outline-offset: -2px; /* 1 */
}
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}
label[for] {
  cursor: pointer;
}

/* Interactive */
/* ============================================ */
details {
  display: block;
}
summary {
  display: list-item;
}
[contenteditable] {
  outline: none;
}

/* Table */
/* ============================================ */
table {
  border-collapse: collapse;
  border-spacing: 0;
}
caption {
  text-align: left;
}
td,
th {
  vertical-align: top;
  padding: 0;
}
th {
  text-align: left;
  font-weight: bold;
}

/* Misc */
/* ============================================ */
template {
  display: none;
}
[hidden] {
  display: none;
}


/* -------------------------------------
BASE
-------------------------------------*/

/** ================================================================================
		Default
================================================================================ **/
html {
	overflow: auto;
}

body {
	font-family: "Avenir", "Helvetica Neue", "Helvetica", "Arial",
		"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo",
		"游ゴシック", "Yu Gothic", "ＭＳ Ｐゴシック", sans-serif;
	line-height: 1.8;
	position: relative;
	overflow: hidden;
	margin: 0 auto;

	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
}

/*リンク*/

p a {
	text-decoration: underline;
}

p a:hover {
	text-decoration: none;
}

a {
	cursor: pointer;
	text-decoration: none;
	color: inherit;
}

a:hover {
	-webkit-transition: 0.3s;
	transition: 0.3s;
}

a.td-u,
.td-u a {
	text-decoration: underline;
}

a.td-u:hover,
.td-u a:hover {
	text-decoration: none;
}

/**PC電話ボタン無効**/
a[href^="tel"],
a[href=""] {
	pointer-events: none;
}

@media screen and (max-width: 520px) {
	a[href^="tel"] {
		pointer-events: auto;
	}
}

/*区切り線*/
hr {
	display: block;
	height: 1px;
	margin: 1em 0;
	padding: 0;
	border: 0;
}

.note {
	display: block;
	padding-left: 1em;
	text-indent: -1em;
}

figure img,
picture img {
	max-width: 100%;
}

@media screen and (max-width: 520px) {
	body {
		min-width: 100%;
	}

	/**post制御**/
	p {
		word-break: break-all;
	}

	table {
		width: 100%;
		word-break: break-all;
	}

	img {
		max-width: 100%;
		height: auto;
	}

	/**post制御**/
}

/* -------------------------------------
ベーススタイル設定

1.clearfix,clear
2.font
3.float
4.text-align
5.margin
6.padding
-------------------------------------*/
/*0.clock */
.block {
	display: block;
}

.in-block {
	display: inline-block;
}

.flx {
	display: flex;
}

.relative {
	position: relative;
}

.max100 {
	max-width: 100%;
}

/*1. clearfix,clear */

/* For modern browsers */
.cf:before,
.cf:after {
	display: block;
	overflow: hidden;
	content: "";
}

.cf:after {
	clear: both;
}

.clear {
	clear: both;
}

/*2. font 必要なら追加　優先順位：高*/
body .fw-b {
	font-weight: var(--fw-b);
}

body .fw-bb {
	font-weight: var(--fw-bb);
}

body .fz12 {
	font-size: 0.75rem;
}

body .fz14 {
	font-size: 0.87rem;
}

body .fz15 {
	font-size: 0.94rem;
}

body .fz16 {
	font-size: 16px;
}

body .fz17 {
	font-size: 17px;
}

body .fz18 {
	font-size: 18px;
}

body .fz20 {
	font-size: 20px;
}

body .fz22 {
	font-size: 22px;
}

body .fz24 {
	font-size: 24px;
}

body .fz26 {
	font-size: 26px;
}

body .fz28 {
	font-size: 28px;
}

body .fz30 {
	font-size: 30px;
}

body .fz32 {
	font-size: 32px;
}

body .fz35 {
	font-size: 35px;
}

body .fz40 {
	font-size: 40px;
}

body .fz44 {
	font-size: 44px;
}

body .fz46 {
	font-size: 46px;
}

body .fz54 {
	font-size: 54px;
}

body .fz50 {
	font-size: 50px;
}

body .fz60 {
	font-size: 60px;
}

body .fz70 {
	font-size: 70px;
}

@media screen and (max-width: 520px) {
	body .fz16 {
		font-size: 15px;
	}

	body .fz17 {
		font-size: 15px;
	}

	body .fz18 {
		font-size: 16px;
	}

	body .fz20 {
		font-size: 16px;
	}

	body .fz22 {
		font-size: 16px;
	}

	body .fz24 {
		font-size: 18px;
	}

	body .fz26 {
		font-size: min(5vw, 22px);
	}

	body .fz28 {
		font-size: min(5vw, 24px);
	}

	body .fz30 {
		font-size: min(5vw, 26px);
	}

	body .fz32 {
		font-size: min(5.6vw, 28px);
	}

	body .fz35 {
		font-size: min(6.4vw, 30px);
	}

	body .fz40 {
		font-size: min(6.4vw, 36px);
	}

	body .fz44 {
		font-size: min(6.4vw, 36px);
	}

	body .fz46 {
		font-size: min(6.4vw, 40px);
	}

	body .fz50 {
		font-size: min(6.4vw, 42px);
	}

	body .fz54 {
		font-size: min(6.4vw, 42px);
	}

	body .fz60 {
		font-size: min(8vw, 40px);
	}

	body .fz70 {
		font-size: min(8vw, 48px);
	}
}


.lh2 {
	line-height: 2;
}

.lh15 {
	line-height: 1.5;
}

.lh13 {
	line-height: 1.3;
}

.lh1 {
	line-height: 1;
}

/*3. float */
.f_L {
	display: inline;
	float: left;
}

.f_R {
	display: inline;
	float: right;
}

/*4. text-align 優先順位：高 */
/*4. align 優先順位：高 */
body .t_C,
body .t_CL,
body .t_CR {
	text-align: center;
}

body .t_R {
	text-align: right;
}

body .t_L {
	text-align: left;
}

body .ai_c {
	align-items: center;
}

body .ai_fe {
	align-items: flex-end;
}

body .ai_fs {
	align-items: flex-start;
}

body .ai_s {
	align-items: stretch;
}

body .jc_c {
	justify-content: center;
}

body .jc_fs {
	justify-content: flex-start;
}

body .jc_sb {
	justify-content: space-between;
}

body .jc_sa {
	justify-content: space-around;
}

@media screen and (max-width: 520px) {
	body .t_CL {
		text-align: left;
	}

	body .t_CR {
		text-align: right;
	}
}

body .m0 {
	margin: 0;
}

body .mb0 {
	margin-bottom: 0;
}

body .mb5 {
	margin-bottom: 5px;
}

body .mb10 {
	margin-bottom: 10px;
}

body .mb15 {
	margin-bottom: 15px;
}

body .mb20 {
	margin-bottom: 20px;
}

body .mb30 {
	margin-bottom: 30px;
}

body .mb40 {
	margin-bottom: 40px;
}

body .mb50 {
	margin-bottom: 50px;
}

body .mb70 {
	margin-bottom: 70px;
}

body .mb80 {
	margin-bottom: 80px;
}

body .mb100 {
	margin-bottom: 100px;
}

body .mb150 {
	margin-bottom: 150px;
}

body .mb200 {
	margin-bottom: 200px;
}

body .mb250 {
	margin-bottom: 250px;
}

body .mt0 {
	margin-top: 0;
}

body .mt5 {
	margin-top: 5px;
}

body .mt10 {
	margin-top: 10px;
}

body .mt15 {
	margin-top: 15px;
}

body .mt20 {
	margin-top: 20px;
}

body .mt30 {
	margin-top: 30px;
}

body .mt40 {
	margin-top: 40px;
}

body .mt50 {
	margin-top: 50px;
}

body .mt70 {
	margin-top: 70px;
}

body .mt80 {
	margin-top: 80px;
}

body .mt100 {
	margin-top: 100px;
}

body .mt150 {
	margin-top: 150px;
}

body .mt200 {
	margin-top: 200px;
}

body .mt250 {
	margin-top: 250px;
}

body .ml0 {
	margin-left: 0;
}

body .ml5 {
	margin-left: 5px;
}

body .ml10 {
	margin-left: 10px;
}

body .ml15 {
	margin-left: 15px;
}

body .ml20 {
	margin-left: 20px;
}

body .ml30 {
	margin-left: 30px;
}

body .mr0 {
	margin-right: 0;
}

body .mr5 {
	margin-right: 5px;
}

body .mr10 {
	margin-right: 10px;
}

body .mr15 {
	margin-right: 15px;
}

body .mr20 {
	margin-right: 20px;
}

body .mr30 {
	margin-right: 30px;
}

@media screen and (max-width: 520px) {

	/*5. margin 30以上は1/2 */
	body .mb20 {
		margin-bottom: 15px;
	}

	body .mb30 {
		margin-bottom: 20px;
	}

	body .mb40 {
		margin-bottom: 20px;
	}

	body .mb50 {
		margin-bottom: 30px;
	}

	body .mb70 {
		margin-bottom: 50px;
	}

	body .mb80 {
		margin-bottom: 60px;
	}

	body .mb100 {
		margin-bottom: 80px;
	}

	body .mb150 {
		margin-bottom: 100px;
	}

	body .mb200 {
		margin-bottom: 140px;
	}

	body .mb250 {
		margin-bottom: 170px;
	}

	body .mt20 {
		margin-top: 15px;
	}

	body .mt30 {
		margin-top: 20px;
	}

	body .mt40 {
		margin-top: 20px;
	}

	body .mt50 {
		margin-top: 30px;
	}

	body .mt70 {
		margin-top: 50px;
	}

	body .mt80 {
		margin-top: 60px;
	}

	body .mt100 {
		margin-top: 80px;
	}

	body .mt150 {
		margin-top: 100px;
	}

	body .mt200 {
		margin-top: 140px;
	}

	body .mt250 {
		margin-top: 170px;
	}
}

/*6. padding 優先順位:高*/
body .p0 {
	padding: 0;
}

body .pb0 {
	padding-bottom: 0;
}

body .pb5 {
	padding-bottom: 5px;
}

body .pb10 {
	padding-bottom: 10px;
}

body .pb15 {
	padding-bottom: 15px;
}

body .pb20 {
	padding-bottom: 20px;
}

body .pb30 {
	padding-bottom: 30px;
}

body .pb40 {
	padding-bottom: 40px;
}

body .pb50 {
	padding-bottom: 50px;
}

body .pb70 {
	padding-bottom: 70px;
}

body .pb80 {
	padding-bottom: 80px;
}

body .pb100 {
	padding-bottom: 100px;
}

body .pb150 {
	padding-bottom: 150px;
}

body .pb200 {
	padding-bottom: 200px;
}

body .pb250 {
	padding-bottom: 250px;
}

body .pt0 {
	padding-top: 0;
}

body .pt5 {
	padding-top: 5px;
}

body .pt10 {
	padding-top: 10px;
}

body .pt15 {
	padding-top: 15px;
}

body .pt20 {
	padding-top: 20px;
}

body .pt30 {
	padding-top: 30px;
}

body .pt40 {
	padding-top: 40px;
}

body .pt50 {
	padding-top: 50px;
}

body .pt70 {
	padding-top: 70px;
}

body .pt80 {
	padding-top: 80px;
}

body .pt100 {
	padding-top: 100px;
}

body .pt150 {
	padding-top: 150px;
}

body .pt200 {
	padding-top: 200px;
}

body .pt250 {
	padding-top: 250px;
}

body .pl0 {
	padding-left: 0;
}

body .pl5 {
	padding-left: 5px;
}

body .pl10 {
	padding-left: 10px;
}

body .pl15 {
	padding-left: 15px;
}

body .pl20 {
	padding-left: 20px;
}

body .pl30 {
	padding-left: 30px;
}

body .pr0 {
	padding-right: 0;
}

body .pr5 {
	padding-right: 5px;
}

body .pr10 {
	padding-right: 10px;
}

body .pr15 {
	padding-right: 15px;
}

body .pr20 {
	padding-right: 20px;
}

body .pr30 {
	padding-right: 30px;
}

@media screen and (max-width: 520px) {
	body .pb20 {
		padding-bottom: 15px;
	}

	body .pb30 {
		padding-bottom: 20px;
	}

	body .pb40 {
		padding-bottom: 20px;
	}

	body .pb50 {
		padding-bottom: 30px;
	}

	body .pb70 {
		padding-bottom: 40px;
	}

	body .pb80 {
		padding-bottom: 40px;
	}

	body .pb100 {
		padding-bottom: 50px;
	}

	body .pb150 {
		padding-bottom: 75px;
	}

	body .pb200 {
		padding-bottom: 140px;
	}

	body .pb250 {
		padding-bottom: 170px;
	}

	body .pt20 {
		padding-top: 15px;
	}

	body .pt30 {
		padding-top: 20px;
	}

	body .pt40 {
		padding-top: 20px;
	}

	body .pt50 {
		padding-top: 30px;
	}

	body .pt70 {
		padding-top: 40px;
	}

	body .pt80 {
		padding-top: 40px;
	}

	body .pt100 {
		padding-top: 50px;
	}

	body .pt150 {
		padding-top: 75px;
	}

	body .pt200 {
		padding-top: 140px;
	}

	body .pt250 {
		padding-top: 170px;
	}
}

/* -------------------------------------
幅
-------------------------------------*/
body .w100p,
body .w1100,
body .w1000,
body .w980,
body .w900,
body .w800,
body .w700,
body .w650,
body .w600 {
	margin-right: auto;
	margin-left: auto;
}

body .w100p {
	width: 100%;
}

body .w1100 {
	width: 1100px;
}

body .w1000 {
	width: 1000px;
}

body .w980 {
	width: var(--base-width);
}

body .w900 {
	width: 900px;
}

body .w800 {
	width: 800px;
}

body .w700 {
	width: 700px;
}

body .w650 {
	width: 650px;
}

body .w600 {
	width: 600px;
}

@media screen and (max-width: 520px) {

	body .w100p,
	body .w1100,
	body .w1000,
	body .w980,
	body .w900,
	body .w800,
	body .w700,
	body .w650,
	body .w600 {
		margin-right: auto;
		margin-left: auto;
	}

	body .w100p {
		width: 100%;
	}

	body .w1100 {
		width: 100%;
	}

	body .w1000 {
		width: 100%;
	}

	body .w980 {
		width: 100%;
	}

	body .w900 {
		width: 100%;
	}

	body .w800 {
		width: 100%;
	}

	body .w700 {
		width: 100%;
	}

	body .w650 {
		width: 100%;
	}

	body .w600 {
		width: 100%;
	}

	body .w100p>*,
	body .w1100>*,
	body .w1000>*,
	body .w980>*,
	body .w900>*,
	body .w800>*,
	body .w700>*,
	body .w650>*,
	body .w600>* {
		width: 90%;
		margin-right: auto;
		margin-left: auto;
	}

	body .w100p>.max,
	body .w100p.max,
	body .w1100>.max,
	body .w1100.max,
	body .w1000>.max,
	body .w1000.max,
	body .w980>.max,
	body .w980.max,
	body .w900>.max,
	body .w900.max,
	body .w800>.max,
	body .w800.max,
	body .w700>.max,
	body .w700.max,
	body .w650>.max,
	body .w650.max,
	body .w600>.max,
	body .w600.max {
		width: 100%;
	}
}

body .calc-bw {
	padding-right: max(calc((100% - var(--base-width)) / 2), 2%);
	padding-left: max(calc((100% - var(--base-width)) / 2), 2%);
}

@media screen and (max-width: 520px) {
	body .calc-bw>* {
		width: 90%;
		margin-right: auto;
		margin-left: auto;
	}

	body .calc-bw>.max {
		width: 100%;
	}
}

/* -------------------------------------
改行
-------------------------------------*/
.pc {}

.sp {
	display: none;
}

.ib {
	display: inline-block;
}

.flex {
	display: flex;
}

.sponly {
	display: none;
}

@media screen and (max-width: 520px) {
	.pc {
		display: none;
	}

	.sp {
		display: block;
	}

	.sp-ib {
		display: inline-block;
	}
}

@media screen and (max-width: 480px) {
	.sponly {
		display: block;
	}
}


/* -------------------------------------
横並びボックスの数
-------------------------------------*/
/**横並び**/
.boxLR {
	display: flex;
	justify-content: space-between;
}

/**２つ並び**/
.box2C {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	width: 100%;
}

.box2C>* {
	width: 48%;
}

.box2C:after {
	display: block;
	width: 48%;
	content: "";
}

/**3つ並び**/
.box3C {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	width: 100%;
}

.box3C>* {
	width: 32%;
}

.box3C:after {
	display: block;
	width: 32%;
	content: "";
}

/**4つ並び**/
.box4C {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	width: 100%;
}

.box4C>* {
	width: 24.5%;
}

.box4C:after,
.box4C:before {
	display: block;
	width: 24.5%;
	content: "";
}

.box4C:before {
	-webkit-box-ordinal-group: 2;
	-ms-flex-order: 1;
	order: 1;
}

@media screen and (max-width: 520px) {

	/* -------------------------------------
横並びボックスの数
-------------------------------------*/
	/**２つ並び**/
	.box2C {
		width: 100%;
	}

	.box2C.box1C_sp {
		-ms-flex-flow: column;
		flex-flow: column;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
	}

	.box2C.box2C_sp {
		-ms-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
	}

	.box2C.box1C_sp>* {
		width: 100%;
	}

	.box2C.box1C_sp:after {
		display: none;
	}

	.box2C.box2C_sp>*,
	.box2C.box2C_sp::after {
		width: 48%;
	}

	.box2C.box2C_sp.sp1c>*,
	.box2C.box2C_sp.sp1c::after {
		/*		min-width: 300px;*/
	}

	/**3つ並び**/
	.box3C {
		width: 100%;
	}

	.box3C.box1C_sp {
		-ms-flex-flow: column;
		flex-flow: column;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
	}

	.box3C.box2C_sp {
		-ms-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
	}

	.box3C.box3C_sp {
		-ms-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
	}

	.box3C.box1C_sp>* {
		width: 100%;
	}

	.box3C.box1C_sp:after {
		display: none;
	}

	.box3C.box2C_sp>*,
	.box3C.box2C_sp::after {
		width: 48%;
	}

	.box3C.box3C_sp>*,
	.box3C.box3C_sp::after {
		width: 31%;
	}

	/**4つ並び**/
	.box4C {
		width: 100%;
	}

	.box4C.box1C_sp {
		-ms-flex-flow: column;
		flex-flow: column;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
	}

	.box4C.box2C_sp {
		-ms-flex-flow: row wrap;
		flex-flow: row wrap;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
	}

	.box4C.box1C_sp>* {
		width: 100%;
	}

	.box4C.box2C_sp>* {
		width: 48%;
	}

	.box4C:after,
	.box4C:before {
		display: none;
	}
}

@media screen and (max-width: 520px) {

	/* -------------------------------------
横並びボックスの数
-------------------------------------*/
	.sp1c {
		-ms-flex-flow: column;
		flex-flow: column !important;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
	}

	.sp1c>*,
	.sp1c::after {
		width: 100% !important;
		margin-right: auto;
		margin-left: auto;
	}
}

/**------------------------------ 
写真なしリスト
ul.nop-list>li>a
em[data-name="カテゴリ"]カテゴリ
 ------------------------------**/
.nop-list {
	margin: 30px auto;
	border-top: 1px dotted var(--nop-b-c);
}

.nop-list li {
	border-bottom: 1px dotted var(--nop-b-c);
}

.nop-list a {
	display: flex;
}

.nop-list em {
	font-size: 13px;
	font-style: normal;
	min-width: 8em;
	margin: 0 20px;
	padding: 3px;
	text-align: center;
	color: var(--nop-cat-c);
	background: var(--nop-cat-bg);
}

@media screen and (max-width:520px) {
	.nop-list {
		margin: 15px auto;
	}

	.nop-list a {
		flex-wrap: wrap;
	}

	.nop-list a em {
		margin: 0 15px 5px;
	}
}


/* -------------------------------------
パンくず
-------------------------------------*/
#breadcrumb {
	margin: 0 auto;
	width: 100%;
	font-size: 14px;
	padding: 8px;
}

#breadcrumb ol {
	max-width: var(--base-width);
	margin: 0 auto;
}

#breadcrumb ol li {
	display: inline-block;
	padding: 0 5px;
}

#breadcrumb ol li+li:before {
	content: "> ";
	display: inline-block;
	margin: 0 10px 0 0;
}

#breadcrumb a {
	text-decoration: underline;
}

#breadcrumb a:hover {
	text-decoration: none;
}

@media screen and (max-width:768px) {
	#breadcrumb {
		margin: 0;
		padding: 5px;
	}

	#breadcrumb ol {
		padding: 0;
		margin: 0;
		font-size: 10px;
	}
}

/* -------------------------------------
ページャー OWLet
-------------------------------------*/
.pagenation {
	margin: 30px auto;
	text-align: center;
}

.pagenation span {
	line-height: 38px;
	display: inline-block;
	width: 40px;
	height: 40px;
	margin: 5px;
	text-align: center;
	color: var(--pgn-c);
	border: 1px solid var(--pgn-c);
	background: var(--pgn-bg);
}

.pagenation span.page {
	color: var(--pgn-bg);
	background: var(--pgn-c);
}

.pagenation span a {
	display: block;
	width: 100%;
	height: 100%;
	color: var(--pgn-c);
	background: var(--pgn-bg);
}

.pagenation span a:hover {
	color: var(--pgn-bg);
	background: var(--pgn-c);
}

@media screen and (max-width: 520px) {
	.pagenation span {
		line-height: 27px;
		width: 30px;
		height: 30px;
		margin: 3px;
	}

	.pagenation span a {
		min-width: 28px;
	}
}

/* -------------------------------------
ページャー WP
-------------------------------------*/
.pagenation_wp {
	margin: 30px auto;
	text-align: center;
}

.pagenation_wp a,
.pagenation_wp span {
	line-height: 38px;
	display: inline-block;
	min-width: 40px;
	height: 40px;
	margin: 5px;
	text-align: center;
	color: var(--pgn-c);
	border: 1px solid var(--pgn-c);
	background: var(--pgn-bg);
}

.pagenation_wp span.current {
	color: var(--pgn-c);
	background: var(--black);
}

.pagenation_wp a:hover {
	color: var(--pgn-c);
	background: var(--black);
}

.pagenation_wp .prev,
.pagenation_wp .next {
	padding: 0 8px;
	border: none;
}

@media screen and (max-width: 520px) {

	.pagenation a,
	.pagenation span {
		font-size: 13px;
		min-width: 30px;
	}
}

/* -------------------------------------
フォーム
-------------------------------------*/
/**エラー**/
.alert,
.error {
	margin: 5px 0;
	color: #ff0000;
}

form table th {
	position: relative;
}

/**必須**/
.require {
	font-size: 11px;
	font-weight: bold;
	line-height: 2em;
	position: absolute;
	display: inline-block;
	width: 3em;
	height: 2em;
	text-align: center;
	color: #ffffff;
	border-radius: 3px;
	background: #cc0000;
}

/**送信ボタン**/
.form_button {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 20px auto;
	text-align: center;
}

.form_button input[type="submit"],
.form_button button[type="submit"],
.form_button input.submit,
.form_button a {
	font-size: 16px;
	display: inline-block;
	width: 300px;
	margin: 30px auto;
	padding: 15px 30px;
	text-align: center;
}

.form_button input[type="submit"]:hover,
.form_button button[type="submit"]:hover,
.form_button input.submit:hover,
.form_button a:hover {}

/*入力タグ*/
form input[type="text"],
form input[type="email"],
form textarea,
form select {
	font-size: 16px;
	line-height: 1.2;
	margin: 5px 5px;
	padding: 5px;
	border: 1px solid #cccccc;
}

form input[type="text"],
form input[type="email"] {
	width: 80%;
}

form textarea {
	width: 80%;
	min-height: 150px;
}

form select {
	margin: 0 5px 5px;
}

form label {
	display: block;
}

/**------------------------------ 
OWLet
 ------------------------------**/
/*電話 郵便番号*/
form input.owlet-input-tel1,
form input.owlet-input-tel2,
form input.owlet-input-tel3,
form input.zip1,
form input.zip2 {
	width: 5em;
}

/*名前*/
form input.owlet-input-name-sei,
form input.owlet-input-name-mei {
	width: 8em;
}

/*記入例など*/
form .owlet-input-sample {
	font-size: 14px;
	margin-top: 5px;
	color: #999999;
}

/**フォーム規約**/
.owlet-rules {
	width: 90%;
	margin: 0 auto 30px;
}

.owlet-rules-title {
	font-weight: bold;
	margin-bottom: 10px;
	text-align: center;
}

.owlet-rules-body {
  text-align: center;
}

.owlet-rules-agree {
	position: relative;
	margin-bottom: 20px;
	text-align: center;
}

.owlet-rules-agree .require {
	position: static;
	margin: 0 15px;
}

/** ================================================================================
02: フォーム用
================================================================================ **/

/* -------------------------------------
フォーム
-------------------------------------*/
/**エラー**/
.alert {
	margin: 5px 0;
	color: #bb0033;
}

form table th {
	position: relative;
	padding-right: 54px !important;
}

/**必須**/
.require {
	font-size: 14px;
	font-weight: bold;
	line-height: 2em;
	position: absolute;
	top: 0;
	right: 0.5em;
	bottom: 0;
	display: inline-block;
	width: 3em;
	height: 2em;
	margin: auto 10px;
	text-align: center;
	color: #ffffff;
	border-radius: 3px;
	background: #bb0033;
}

/*入力タグ*/
form input[type="text"],
form textarea,
form select {
	/* border:1px solid #cccccc; */
	/* font-size: 14px; */
	line-height: 1.2;
	height: 50px;
	margin: 5px;
	padding: 5px 4px;
	border-radius: 5px;
	background: #eeeeee;
	-webkit-box-shadow: none;
	box-shadow: none;
}

form input[type="text"] {
	width: 100%;
}

form textarea {
	min-height: 150px;
	padding: 2px;
}

form select {
	font-size: 14px;
	display: grid;
	padding: 0 10px;

	place-items: center;
}

td input[type="button"] {
	font-size: 0.85em;
	height: 40px;
	padding: 0 10px;
	border: 1px solid #cccccc;
	/* 枠線 */
	border-radius: 0.3em;
	/* 角丸 */
	background: #dddddd;
	background-image: linear-gradient(to bottom, rgba(255, 255, 255, 1.0) 40%, rgba(200, 200, 200, 0.1) 100%);
	/* グラデーション */

	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

form input[type="file"] {
	display: block;
	margin: 8px 0;
}

/*電話*/
form input.owlet-input-tel1,
form input.owlet-input-tel2,
form input.owlet-input-tel3 {
	width: 7em;
	margin: 5px;
}

/*名前*/
form input.owlet-input-name-sei,
form input.owlet-input-name-mei {
	width: 8em;
}

/*郵便番号*/
form input.zip1,
form input.zip2 {
	width: 5em;
	margin: 5px;
}

/**住所**/
form input.address {
	display: block;
}

/*label 縦並び*/

form label {
	display: block;
	margin: 5px 0;
}

/*label 横並び*/
/* form label {
	margin: 5px 10px;
	font-size: 1.2em;
} */
/*ボタン*/
form button {
	margin: 0 10px;
	padding: 5px 10px;
	border-radius: 5px;
	background: #ffffff;
}

/*記入例*/
form .owlet-input-sample {
	font-size: 14px;
	margin-top: 5px;
	margin-left: 8px;
	color: #505050;
}

/**フォーム規約**/
.owlet-rules {
	width: 100%;
	margin: 0 auto 30px;
}

.owlet-rules-title {
	font-weight: bold;
	display: none;
	margin-bottom: 10px;
	text-align: center;
}


.owlet-rules-agree {
	position: relative;
	margin-bottom: 20px;
	text-align: center;
}

.owlet-rules-agree .require {
	position: static;
	margin: 0 15px;
}

/**送信ボタン**/
.form_button {
	position: relative;
	display: flex;
	align-items: center;
	flex-flow: column-reverse;
	justify-content: center;
	width: 100%;
	margin: 50px auto 20px;
	text-align: center;
}

.form_button button[type="submit"],
.form_button input[type="submit"],
.form_button input.submit,
.form_button a {
	font-size: 15px;
	display: inline-block;
	width: 80vw;
	max-width: 380px;
	margin: 0 30px 10px;
	padding: 15px 30px;
	transition: var(--transition);
	text-align: center;
	color: var(--gold);
	border: 1px solid var(--gold);
	border-radius: 50px;
	background: var(--white);
}

.form_button button[type="submit"]:hover,
.form_button input[type="submit"]:hover,
.form_button input.submit:hover,
.form_button a:hover {
	opacity: 0.8;
}

@media screen and (max-width: 520px) {

	/**テーブル**/
	.owlet-form {
		width: 100%;
	}

	form table th,
	form table td {
		display: block;
		width: 100% !important;
	}

	/**必須**/
	.require {
		font-size: 12px;
	}

	/*入力タグ*/
	form input[type="text"],
	form textarea,
	form select {
		font-size: 14px;
		padding: 10px;
	}

	/*電話*/
	form input.owlet-input-tel1,
	form input.owlet-input-tel2,
	form input.owlet-input-tel3 {
		width: 6em;
		margin: 5px;
	}

	/*iPhone独自スタイル解除*/
	form input[type="button"],
	form input[type="text"],
	form input[type="submit"] {
		-webkit-appearance: none;
	}
}

/**------------------------------ 
OWlet以外
 ------------------------------**/
form input[type="text"].min {
	width: 10em;
}

@media screen and (max-width: 520px) {
	.form_button {
		flex-flow: column-reverse;
	}

	/*iPhone独自スタイル解除*/
	form input[type="button"],
	form input[type="text"],
	form input[type="submit"] {
		border-radius: 0;

		-webkit-appearance: none;
	}

	/*入力タグ*/
	form input[type="text"],
	form input[type="email"],
	form textarea,
	form select {
		font-size: 13px;
	}
}
[data-lib="144"]{
	border: none;
    font-size: inherit;
    outline: none;
    padding: 0;
	cursor:pointer;
}/*widget:3814a386-94c4-46a6-b696-12ca3699d3bf*/
[data-lib="144"] svg{fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-miterlimit: 10;
	stroke: var(--btnAc);}/*widget:5e5cc7bb-7531-4684-a761-1a30443a057f*/
/*instance:598*//*instance mediea*/@media screen and (max-width: 520px){}/*widget:efdbbb54-be16-43d5-93c8-38f583d20e97*/
/*widget:b8d6f9a2-0a55-4102-8681-a52c94d2801e*/
/*widget:8dfa435c-655b-4686-aa79-4a60dbf34e82*/
/*widget:14308020-5aae-4298-a267-c0027db2b920*/
/*instance:10*/[data-instance="10"]{background-image:url(/_img/ja/cms/10/bgimg/___/session/) !important;}/*widget:f0152263-a3be-4dfe-a972-a16f4e9b3f96*/
/*instance:12*//*instance mediea*/@media screen and (max-width: 520px){}/*widget:3814a386-94c4-46a6-b696-12ca3699d3bf*/
[data-lib="144"] svg{fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-miterlimit: 10;
	stroke: var(--btnAc);}/*instance:13*//*instance mediea*/@media screen and (max-width: 520px){}/*widget:c9b0bf0a-871c-4b2b-8284-4f1a9ce1a16f*/
/*instance:16*//*instance mediea*/@media screen and (max-width: 520px){}/*widget:3b32a34b-93b4-465b-ba5e-8ce16cd9420c*/
/*instance:19*//*instance mediea*/@media screen and (max-width: 520px){}/*instance:21*//*instance mediea*/@media screen and (max-width: 520px){}/*instance:23*//*instance mediea*/@media screen and (max-width: 520px){}/*instance:25*//*instance mediea*/@media screen and (max-width: 520px){}/*widget:3bc5436b-4905-40b3-abf5-c8117b0c943a*/
/*widget:7bdf7be5-1698-41dc-a52e-c0cad48813b1*/
/*instance:148*//*instance mediea*/@media screen and (max-width: 520px){}/*widget:60395db4-77c1-4494-8674-9aab5066f5a7*/
/*widget:3bc729f2-d4e8-40b0-a0c3-3bd7dd10238c*/
/*instance:817*//*instance mediea*/@media screen and (max-width: 520px){}/*widget:3fb3992e-b3a6-42b9-a2f5-b859f375084d*/
/*instance:820*//*instance mediea*/@media screen and (max-width: 520px){}/*instance:28*//*instance mediea*/@media screen and (max-width: 520px){}/*widget:2dbdbde9-027f-429a-9d73-3a118e38c731*/
/*instance:31*//*instance mediea*/@media screen and (max-width: 520px){}/*instance:33*//*instance mediea*/@media screen and (max-width: 520px){}/*instance:34*/[data-instance="34"]{background-image:url(/_img/ja/cms/34/bgimg/___/session/) !important;}/*instance:35*//*instance mediea*/@media screen and (max-width: 520px){}/*instance:36*//*instance mediea*/@media screen and (max-width: 520px){}/*layout:1*//*layout:2*/:root {
	--base-width: 1225px;
	--over-width-half: calc((100vw - var(--base-width)) / 2);
	--webf: 'Josefin Sans', sans-serif;
	--header-height: 0;
	--black: #323232;
	--gray: #505050;
	--gray2: #8a8a8a;
	--gold: #7a6a56;
	--gold2: #c9bc9c;
	--gold3: #f6f5f2;
	--gold4: #ece7df;
	--white: #fff;
	--pink: #ac0b18;
	--green: #33961d;
	--yellow: #fff552;
	/**.fw-b.fw-bb*/
	--fw-b: 700;
	--fw-bb: 900;
	/**.pagenation**/
	--pgn-c: var(--gold);
	--pgn-bg: var(--white);
	/**#breadcrumb**/
	--bread-c: #555555;
	--bread-bg: #ffffff;
}

@media screen and (max-width:520px) {
	:root {
		--base-width: 90%;
		--over-width-half: 5%;
		--header-height: 0;
	}
}

html {
	font-size: 16px;
}

body {
	min-width: var(--base-width);
	padding-top: var(--header-height);
}

main p {
	line-height: 2;
}

@media screen and (max-width:520px) {
	html {
		font-size: 14px;
	}
}

/**================================================================================
レイアウト
================================================================================**/

/**------------------------------ 
セクション
 ------------------------------**/
.sec-bg01 {
	background: var(--gold3);
}

.sec-01 {
	width: var(--base-width);
	margin-left: auto;
	margin-right: auto;
}

.sec-w_base{
  padding-left: var(--over-width-half);
  padding-right: var(--over-width-half);
}
.sec-w_L{
  padding-left: var(--over-width-half);
}
.sec-w_R{
  padding-right: var(--over-width-half);
}


/**------------------------------ 
横並びリスト 均等
box nth column
.boxNC>li
 ------------------------------**/

:root {
	--boxNC_w: var(--base-width);
	--boxNC_m: 30px auto;
	--boxNC_gap: 20px 3%;
	--boxNC_child_w: calc(94% / 3);
}

.boxNC {
	display: flex;
	flex-wrap: wrap;
	width: var(--boxNC_w);
	margin: var(--boxNC_m);

	gap: var(--boxNC_gap);
}

.boxNC>* {
	width: var(--boxNC_child_w);
}

@media screen and (max-width:520px) {
	:root {
		--boxNC_w: 100%;
		--boxNC_m: 20px auto;
		--boxNC_gap: 0 20px;
		--boxNC_child_w: 100%;
	}
}

/**------------------------------ 
横並びリスト 2カラム不均等
box left right
.boxLR>.left+.right
 ------------------------------**/
:root {
	--boxLR_w: var(--base-width);
	--boxLR_m: 30px auto;
	--boxLR_gap: 10px;
	--boxLR_1_w: 30%;
	--boxLR_2_w: calc(100% - var(--boxLR_1_w) - var(--boxLR_gap));
	--boxLR_3_w: 0;
}

.boxLR {
	display: flex;
	flex-wrap: wrap;
	width: var(--boxLR_w);
	margin: var(--boxLR_m);

	gap: var(--boxLR_gap);
}

.boxLR>.LR1 {
	width: var(--boxLR_1_w);
}

.boxLR>.LR2 {
	width: var(--boxLR_2_w);
}

.boxLR>.LR3 {
	width: var(--boxLR_3_w);
}

@media screen and (max-width:520px) {
	:root {
		--boxLR_w: var(--base-width);
		--boxLR_m: 30px auto;
		--boxLR_gap: 10px;
		--boxLR_1_w: 100%;
		--boxLR_2_w: 100%;
		--boxLR_3_w: 100%;
		--boxLR_1_m: 0;
		--boxLR_2_m: 0;
		--boxLR_3_m: 0;
	}

	.boxLR>.LR1 {
		margin: var(--boxLR_1_m);
	}

	.boxLR>.LR2 {
		margin: var(--boxLR_2_m);
	}

	.boxLR>.LR3 {
		margin: var(--boxLR_3_m);
	}

}

/**------------------------------ 
横並びリスト 2カラム不均等 互い違い
box odd even
boxOE>li>.OE1+.OE2
 ------------------------------**/
:root {
	--boxOE_w: var(--base-width);
	--boxOE_m: 30px auto;
	--boxOE_gap: 10px;
	--boxOE_1_w: 30%;
	--boxOE_2_w: calc(70% - var(--boxOE_gap));
}

.boxOE>* {
	display: flex;
	flex-wrap: wrap;
	width: var(--boxOE_w);
	margin: var(--boxOE_m);

	gap: var(--boxOE_gap);
}

.boxOE>*:nth-child(odd) {
	flex-direction: row;
}

.boxOE>*:nth-child(even) {
	flex-direction: row-reverse;
}

.boxOE>*>.OE1 {
	width: var(--boxOE_1_w);
}

.boxOE>*>.OE2 {
	width: var(--boxOE_2_w);
}


@media screen and (max-width:520px) {
	:root {
		--boxOE_w: var(--base-width);
		--boxOE_m: 20px auto;
		--boxOE_gap: 10px;
		--boxOE_1_w: 100%;
		--boxOE_2_w: 100%;
	}

	.boxOE>*:nth-child(odd) {
		flex-direction: row;
	}

	.boxOE>*:nth-child(even) {
		flex-direction: row;
	}
}


/* [class*="flexfit_"] 可変 / 1個：1列 / 偶数：2列 奇数：3列 */
.flexfit {
  display: flex;
  flex-flow: wrap;
  gap: var(--gap);
  --gap: 30px;
  margin: 0 auto 30px;
}
/*1以外奇数 */
.flexfit > * {
  --num: 3;
  --width: calc((100% - var(--gap) * (var(--num) - 1)) / var(--num));
  width: var(--width);
}
/* 1個 */
.flexfit:has(> *:only-child) > * {
  --num: 1;
  /*width: fit-content;*/
}
/* 偶数 */
.flexfit:has(> *:nth-child(even):last-child) > * {
  --num: 2;
}

@media screen and (max-width: 520px) {
  .flexfit > *,
  .flexfit:has(> *:only-child) > *,
  .flexfit:has(> *:nth-child(even):last-child) > * {
    --num: 1;
  }
}


/**================================================================================
装飾
================================================================================**/

/* -------------------------------------
カテゴリボタン
-------------------------------------*/
:root {
	--catBtn_c: var(--gold);
	--catBtn_bd: 1px solid var(--gold);
	--catBtn_bg: var(--white);
}

.catBtn {
	display: flex;
	justify-content: center;
	margin: 25px auto;

	gap: 15px;
}

.catBtn a {
	font-weight: bold;
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	min-width: 10em;
	padding: 10px;
	text-align: left;
	color: var(--catBtn_c);
	border: var(--catBtn_bd);
	background: var(--catBtn_bg);
}

.catBtn a:after {
	font-size: 12px;
	line-height: 1;
	top: 1.5em;
	display: inline-block;
	width: 5px;
	height: 5px;
	content: "";
	transform: rotate(45deg);
	border-top: 1px solid var(--catBtn_c);
	border-right: 1px solid var(--catBtn_c);
}

.catBtn a:hover,
.catBtn a.current{
	color: var(--catBtn_bg);
	border: var(--catBtn_bd);
	background: var(--catBtn_c);
}

.catBtn a:hover:after {
	border-top: 1px solid var(--catBtn_bg);
	border-right: 1px solid var(--catBtn_bg);
}

.tagBtn{
  display: flex;
  justify-content: center;
  gap:10px;
  padding:10px;
  line-height: 1;
}

.tagBtn a{
  padding:10px 15px;
  font: 0.9rem;
  color: var(--gold);
  background: var(--gold3);
  border:1px solid var(--gold3);
}

.tagBtn a:hover,
.tagBtn a.current{
  border:1px dotted var(--gold);
}


@media screen and (max-width: 520px) {
	.catBtn {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		width: 100%;
		margin: 20px auto;

		gap: 5px;
	}

	.catBtn a {
		flex: 1;
		min-width: auto;
		padding: 10px 20px 10px 10px;
		white-space: nowrap;
	}
	
	
	.tagBtn{
    flex-flow: wrap;
    gap:5px;
    padding:0 0 15px;
  }
  
  .tagBtn a{
    padding:8px;
  }
}

/* -------------------------------------
文字装飾
-------------------------------------*/
:root {
	/**.edge**/
	--liner_c: #fff552;
	--edge_c: #555555;
	--edge2_c: #555555;
	--edge3_c: #555555;
}

/**黄色マーカー**/
b.liner {
	background: -webkit-linear-gradient(transparent 40%, var(--liner_c) 0%);
	background: linear-gradient(transparent 40%, var(--liner_c) 0%);
}

/*縁くくり*/
.edge {
	text-shadow: 1px 1px 0 var(--edge_c),
		-1px 1px 0 var(--edge_c),
		1px -1px 0 var(--edge_c),
		-1px -1px 0 var(--edge_c);
}

/*縁 2px以上*/
.edge2 {
	text-shadow: 2px 2px 1px var(--edge2_c),
		-2px 2px 1px var(--edge2_c),
		2px -2px 1px var(--edge2_c),
		-2px -2px 1px var(--edge2_c),
		2px 0 1px var(--edge2_c),
		0 2px 1px var(--edge2_c),
		-2px 0 1px var(--edge2_c),
		0 -2px 1px var(--edge2_c);
}

/*縁 枠*/
.edge3 {
	color: transparent;

	-webkit-text-stroke-width: 1px;
	-webkit-text-stroke-color: var(--edge3_c);
}

/* -------------------------------------
写真のエフェクト
-------------------------------------*/
/**4辺ぼかし：親要素にかける**/
.blur_w {
	position: relative;
	display: inline-block;
}

.blur_w:after {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	content: "";
	background: rgba(255, 255, 255, 0);
	box-shadow: inset 0 0 40px #ffffff, inset 0 0 40px #ffffff, inset 0 0 40px #ffffff,
		inset 0 0 40px #ffffff;
}

/**角丸：画像に直接かけれる**/
.radius {
	border-radius: 15px;
}

/**hover：透過**/
a:hover img.hv {
	opacity: var(--opacity);
}

/**hover時画像拡大**/
.scale {
	overflow: hidden;
}

.scale img {
	-webkit-transition: -webkit-transform 0.3s linear;
	-moz-transition: -moz-transform 0.3s linear;
	-ms-transition: -ms-transform 0.3s linear;
	-o-transition: -o-transform 0.3s linear;
	transition: transform 0.3s linear;
}

a:hover .scale img {
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
	transform: scale(1.2);
}

/**画像トリミング：親要素にwとhを指定する**/
.ojf img {
	width: 100%;
	height: 100%;

	-o-object-fit: cover;
	object-fit: cover;
}


/**-------------------------------------
youtube
-------------------------------------**/
iframe {
	width: 100%;
}

.youtube {
	position: relative;
	width: 100%;
	height: 0;
	margin: 30px auto 20px;
	padding-bottom: 56.25%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.youtube iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 520px) {
	.youtube {
		margin: 20px auto 10px;
	}
}

/* -------------------------------------
google gmap
-------------------------------------*/
/**地図**/
.gmap iframe {
	width: 100%;
	height: 480px;
}

@media screen and (max-width: 480px) {
	.gmap iframe {
		height: 45vh;
	}
}

/* -------------------------------------
PDF埋め込み src="URL末尾#view=Fit"を入れる
-------------------------------------*/
.pdf_wrap {
	width: 800px;
	height: 500px;
}

.pdf_wrap iframe {
	display: block;
	width: 100%;
	height: 100%;
	margin: 30px auto;
}

@media screen and (max-width: 520px) {
	.pdf_wrap {
		width: 90%;
		height: 60vw;
	}
}

/**================================================================================
サイト用 CSS
================================================================================**/

/**-------------------------------------
アイコン
-------------------------------------**/
.em {
	font-size: 0.9rem;
	line-height: 1;
	display: inline-block;
	margin-right: 1px;
	padding: 5px 10px;
	vertical-align: middle;
	font-style: normal;
}

.time {
	font-size: 0.9rem;
	display: inline-block;
	margin: 5px 0;
	vertical-align: middle;
}

/**-------------------------------------
見出し
-------------------------------------**/
.page_title {
	background:
		url(/common/images/page_title.jpg) repeat center / cover;
}

.titZ {
	font-size: 60px;
	line-height: 1.2;
	font-family: var(--webf);
	position: relative;
	height: 300px;
	color: var(--gold);
	display: flex;
	flex-flow: column;
	background: rgba(255, 255, 255, 0.5);
	backdrop-filter: blur(5px);
	padding: 150px var(--over-width-half) 0;
}

#breadcrumb {
	background: rgba(122, 106, 86, 0.5);
	color: var(--white);
	backdrop-filter: blur(5px);
}

.titZ:before {
	content: "";
	display: block;
	height: 1px;
	width: var(--over-width-half);
	background: var(--gold);
	position: absolute;
	top: calc(150px + 0.5em);
	left: 0;
}

.titZ small {
	font-size: 1.1rem;
	font-family: initial;
	display: block;
	margin: 0 0 0 10px;
	letter-spacing: 1px;
}

:root {
	--titAw: 100%;
	--titAm: 0 auto 60px;
}

.titA {
	width: var(--titAw);
	margin: var(--titAm);
}

.titA h2 {
	font-weight: bold;
	font-size: 1.75rem;
	margin: 0 0 10px;
}

.titA strong {
	font-family: var(--webf);
	color: var(--gold2);
	font-size: 5rem;
	display: block;
	position: relative;
	line-height: 1;
	letter-spacing: -2px;
	margin: 0 0 15px;
	font-weight: normal;
}

.titA strong:before {
	content: "";
	height: 1px;
	width: 100%;
	background: var(--gold2);
	position: absolute;
	top: 45%;
	left: -101%;
}

:root {
	--titBfz: 1.5rem;
	--titBc: var(--black);
	--titBm: 0 0 30px;
	--titBta: left;
	--titBbg: none;
	--titBp: 0;
}

.titB {
	font-size: var(--titBfz);
	color: var(--titBc);
	margin: var(--titBm);
	text-align: var(--titBta);
	background: var(--titBbg);
	padding: var(--titBp);
	font-weight: bold;
	position: relative;
	z-index: 1;
	line-height: 1.8;
}

:root {
	--titCfz: 1.5rem;
	--titCc: var(--black);
	--titCm: 0 0 30px;
	--titCta: center;
	--titCbg: none;
	--titCp: 0;
}

.titC {
	font-size: var(--titCfz);
	color: var(--titCc);
	margin: var(--titCm);
	text-align: var(--titCta);
	background: var(--titCbg);
	padding: var(--titCp);
	font-weight: bold;
	position: relative;
	z-index: 1;
	line-height: 1.8;
	display: flex;
	align-items: center;
	gap: 30px;
}

.titC:before,
.titC:after {
	flex: 1;
	content: "";
	display: block;
	height: 1px;
	background: var(--titCc);
}

@media screen and (max-width:520px) {

	.titZ {
		width: 100%;
		font-size: 35px;
		height: 210px;
		padding: 100px 5% 0;
		margin: 0 auto;
	}

	.titZ:before {
		top: calc(100px + 0.5em);
	}

	:root {
		--titAw: 100%;
		--titAm: 0 auto 30px;
	}

	.titA h2 {
		font-size: 1.3rem;
	}

	.titA strong {
		font-size: 2.4rem;
		margin: 0 0 10px;
	}

	:root {
		--titBfz: 1.3rem;
		--titBm: 0 0 15px;
	}
	
	:root {
		--titCfz: 1.3rem;
		--titCm: 0 0 15px;
	}

	.titC {
		gap: 15px;
	}
}

/**------------------------------ 
特殊ボタン
 ------------------------------**/
.tel {
	font-size: 30px;
	line-height: 1;
	position: relative;
}

.tel svg {
	line-height: 1;
	display: inline-block;
	width: 30px;
	height: 30px;
	margin: 0 5px;
	vertical-align: middle;

	fill: var(--black);
}


/**-------------------------------------
ボタン
-------------------------------------**/
:root {
	--btnAfz: 1em;
	--btnAw: 360px;
	--btnAc: var(--gold);
	--btnAbg: var(--white);
	--btnAm: auto;
	--btnAbg_h: var(--btnAbg);
	--btnAc_h: var(--btnAc);
}

.btnA {
	font-size: var(--btnAfz);
	font-weight: 700;
	position: relative;
	display: block;
	width: var(--btnAw);
	margin: var(--btnAm);
	padding: 20px 25px 20px 15px;
	cursor: pointer;
	text-align: center;
	border-radius: 50px;
}

.btnA {
	color: var(--btnAc);
	border: 1px solid var(--btnAc);
	background: var(--btnAbg);
}

.btnA:after {
	content: "→";
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 10px;
}

.btnA:hover,
a:hover .btnA {
	color: var(--btnAbg_h);
	border: 1px solid var(--btnAbg_h);
	background: var(--btnAc_h);
}

@media screen and (max-width: 520px) {
	:root {
		--btnAw: clamp(100%, 100%, 90vw);
	}

	.btnA {
		padding: 15px;
	}
}

/**================================================== 
 テーブル
================================================== **/

/* -------------------------------------
テーブル
-------------------------------------*/
.table table {
	margin: 30px 0;
	width: calc(var(--base-width) - 10%);
	width: 100%;
	border-collapse: collapse;
	background: #aaa;
}


.table th,
.table td {
	padding: 15px 20px;
	vertical-align: top;
	text-align: left;
	background: #fff;
	border-bottom: 1px solid #aaa;
}

.table th {
	width: 25%;
	position: relative;
	vertical-align: middle;
	font-weight: bold;
	border-bottom: 1px solid #1e1e1e;
}

@media screen and (max-width:520px) {

	.table table,
	.table tbody,
	.table tr,
	.table th,
	.table td {
		display: block;
		background: none;
	}

	.table table {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
	}

	.table th,
	.table td {
		padding: 10px;
	}

	.table th {
		width: 100%;
	}

}

/**------------------------------ 
フォームテーブル
 ------------------------------**/
:root {
	--form_bd: var(--black);
}

.owlet-form {
	padding: 0;
}

.owlet-form table {
	width: 100%;
	margin: 0 auto 20px;
	border-spacing: 1px;
	border-collapse: separate;
	border-top: 1px solid var(--form_bd);
}

.owlet-form table tr th,
.owlet-form table tr td {
	padding: 20px;
	text-align: left;
	border-bottom: 1px solid var(--form_bd);
	background: #ffffff;
}

.owlet-form table tr th {
	font-weight: bold;
	line-height: 1.8;
	position: relative;
	width: 30%;
	padding-right: 4.5em;
	color: var(--form_bd);
	background: #ffffff;
}

.owlet-form table tr:first-child th,
.owlet-form table tr:first-child td {
	border-top: none;
}

@media screen and (max-width:520px) {

	.owlet-form table,
	.owlet-form tbody,
	.owlet-form tr,
	.owlet-form th,
	.owlet-form td {
		display: block;
		border: none;
	}

	.owlet-form table tr th {
		border-top: none;
	}

	.owlet-form table tr th,
	.owlet-form table tr td {
		display: block;
		box-sizing: border-box;
		width: 100%;
		min-height: auto;
		padding: 10px 2%;
		text-align: left;
	}

	.owlet-form table tr td {
		padding-bottom: 1em;
	}

	.owlet-form table tr th {
		padding-top: 1em;
	}
}



/**================================================== 
header
header nav ul
header .hamburger > (span*3)
================================================== **/
.instagram{
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  background: var(--black);
  border-radius: 50px;
}
.instagram svg{
  width: 23px;
  height: 23px;
  fill:var(--white)
}

header {
	position: fixed;
	top: 0;
	left: 0;
	display: flex;
	justify-content: space-between;
	width: 100%;
	min-width: var(--base-width);
	padding: 0 0 0 5vw;
	z-index: 100;
	color: var(--black);

	--menu1: 240px;
}


header.onBg {
	background: var(--white);
}

header .logo a {
	position: relative;
	display: flex;
	align-items: center;
	margin: 3px 0 0;
}

header .logo img {
	display: block;
	width: 145px;
	margin: 0;
}

header .logo img+img {
	width: 125px;
	margin: 0 0 0 15px;
}

header .tel {
	position: absolute;
	top: 0;
	right: calc(var(--menu1) + 55px);
	text-align: right;
	margin: 10px 25px 0;
}

header .tel p {
	font-size: 0.8rem;
	margin: 5px 0;
}

header .instagram{
  position: absolute;
  right: calc(var(--menu1) + 15px);
  top: 15px;
}

header nav {
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
}

header nav .menu1 {
	width: var(--menu1);
	margin: 0 0 0 30px;
}

header nav .menu1 a {
	width: 100%;
	height: 60px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--white);
}

header nav .menu1 a svg {
	width: 22px;
	height: 22px;
	fill: var(--white);
	--svg: var(--white);
	margin: 0 8px 0 0;
}

header nav .menu1 .h-tel {
	display: none;
}

.h-tel,
.h-toi {
	background: var(--black);
}

.h-tel:hover,
.h-toi:hover {
	background: var(--white);
	color: var(--black);
	box-shadow: 0 0 0 1px var(--black) inset;
}

.h-tel:hover svg,
.h-toi:hover svg {
	--svg: var(--black);
}

.h-rec {
	background: var(--gold);
}

.h-rec:hover {
	background: var(--white);
	color: var(--gold);
	box-shadow: 0 0 0 1px var(--gold) inset;
}

.h-rec:hover svg {
	fill: var(--gold);
}

header .nav {
	display: flex;
	justify-content: flex-end;
	gap: 20px;
	font-size: clamp( 15px, 1.2vw, 18px);
	margin: 0 0 10px;
}

header .nav a:hover {
	opacity: 0.8;
}

header .hamburger {
	display: none;
}

@media screen and (max-width:1300px) {
  header{
    padding:0;
  }
  header .nav{
    gap:25px;
  }
}

@media screen and (max-width:520px) {
	header {
		position: absolute;
		top: 0;
		left: 0;
		padding: 0;
	}

	header.onBg {
		background: none;
	}

	header .logo a {
		align-items: flex-start;
		margin: 5px;
	}

	header .logo img {
		width: 90px;
	}

	header .logo img+img {
		width: 80px;
		margin: 5px;
	}


	header .tel {
		display: none;
	}
	
	header .instagram{
  right: 60px;
  top: 5px;
}

	header nav .menu1 {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		margin: 0;
		display: flex;
		background: var(--black);
	}

	header nav .menu1 a {
		font-size: 0.8rem;
		width: auto;
		height: auto;
		padding: 3px 0;
		flex-flow: row;
		line-height: 1;
	}

	header nav .menu1 a svg {
		display: block;
		width: 18px;
		height: 18px;
		margin: 0 5px;
	}

	header nav .menu1 .h-tel {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		font-size: 1.1rem;
	}

	header nav .menu1 .h-tel p {
		width: 100%;
		font-size: 0.75rem;
		text-align: center;
		margin: 3px 0 0;
	}

	header nav .menu1 .h-toi {
		background: var(--white);
		color: var(--black);
		margin: 3px 0;
		padding: 3px;
		white-space: nowrap;
	}

	header nav .menu1 .h-toi svg {
		fill: var(--black);
		--svg: var(--black);
	}

	header nav .menu1 .h-rec {
		background: var(--black);
		white-space: nowrap;
		border: 1px solid var(--white);
		margin: 3px;
		padding: 3px;
	}

	/**ハンバーガー**/
	header .nav {
		font-size: 16px;
		position: fixed;
		z-index: 1500;
		top: 0;
		right: -300px;
		align-items: flex-start;
		justify-content: flex-start;
		box-sizing: border-box;
		width: 300px;
		height: 100%;
		padding-top: 60px;
		background: var(--black);
		gap: 0;
	}

	header ul.nav {
		flex-flow: column;
	}

	header .nav li a {
		display: block;
		padding: 10px 28px;
		text-decoration: none;
		color: var(--white);
	}

	header .nav li a:hover {
		color: var(--bodybg2);
		background: var(--white);
	}

	header .hamburger {
		font-size: 11px;
		z-index: 1500;
		display: block;
		box-sizing: border-box;
		width: 50px;
		height: 50px;
		cursor: pointer;
		-webkit-transition: all 400ms;
		transition: all 400ms;
		color: var(--white);
		position: fixed;
		top: 0;
		right: 0;
		background: var(--black);
	}

	header .hamburger span {
		position: absolute;
		right: 0;
		left: 0;
		width: 20px;
		height: 2px;
		margin: 0 auto;
		-webkit-transition: all 400ms;
		transition: all 400ms;
		background: var(--white);
	}

	header .hamburger span:nth-child(1) {
		top: 15px;
	}

	header .hamburger span:nth-child(2) {
		top: 22px;
	}

	header .hamburger span:nth-child(3) {
		top: 29px;
	}

	header .hamburger.open {
		position: fixed;
		top: 0;
		right: 0;
	}

	header .hamburger.open span {
		background: var(--white);
	}

	header .hamburger.open span:after {
		display: none;
	}

	header .hamburger.open span:nth-child(1) {
		top: 20px;
		transform: rotate(45deg);
	}

	header .hamburger.open span:nth-child(2) {
		display: none;
	}

	header .hamburger.open span:nth-child(3) {
		top: 20px;
		transform: rotate(-45deg);
	}
}

/**================================================== 
 footer
================================================== **/

footer {
	padding: 80px var(--over-width-half);
}

footer .logo {
	width: 180px;
	margin: 0 auto 60px;
}

footer dl {
	display: flex;
	gap: 20px;
}

footer dl dt {}

footer .instagram{
margin-inline:auto;
}

footer dl h3{
 font-weight: bold;
 font-size: 1.1rem;
}

footer dl dt a {
	display: block;
	margin: 0 0 30px;
}

footer dl dt a img {
	width: 160px;
}

footer dl dt .tel {
	margin: 20px 0;
}

footer dl dt .tel p {
	font-size: 1rem;
	font-weight: normal;
	margin: 5px;
	line-height: 1.3;
}

footer .sitemap {
	display: flex;
	flex-flow: column;
	gap: 15px;
}

footer .sitemap a:before {
	content: "- ";
}

footer .map {
	flex: 1;
}

footer .map iframe {
	display: block;
	width: 100%;
	height: auto;
  aspect-ratio:1/1;
  margin-top: 10px;
}

footer .copyright {
	font-size: 0.8rem;
	text-align: center;
	margin: 80px auto 0;
}

@media screen and (max-width:520px) {
	footer {
		padding: 40px var(--over-width-half);
	}

	footer .logo {
		width: 90px;
		margin: 0 auto 15px;
	}

	footer dl {
		display: flex;
		flex-flow: column;
		gap: 30px;
	}

	footer dl dt {
		text-align: center;
	}

	footer dl dt a {
		display: block;
		margin: 0 0 15px;
	}

	footer dl dt a img {
		width: 120px;
	}

	footer .sitemap {
		display: flex;
		flex-flow: row;
		flex-wrap: wrap;
		gap: 20px 40px;
	}


	footer .map iframe {
		display: block;
		width: 100%;
		height: 60vw;
	}

	footer .copyright {
		margin: 20px auto;
	}
}

/**================================================== 
TOP 
================================================== **/
/**------------------------------ 
HERO
 ------------------------------**/
.hero {
	position: relative;
	height: 66.4vw;
	width: 100%;
	min-width:var(--base-width);
	overflow: hidden;
}

.hero img {
	width: 100%;
}

/* アニメーション */
@keyframes zoomUp {
	0% {
		transform: scale(1.2);
	}

	100% {
		transform: scale(1);
	}
}

.hero .swiper-slide-active img,
.hero .swiper-slide-duplicate-active img,
.hero .swiper-slide-prev img {
	animation: zoomUp 10s linear 0s 1 normal both;
}

.hero .h1 {
	display: flex;
	flex-flow: column;
	align-items: flex-start;
	position: absolute;
	width: 100%;
	bottom: 90px;
	left: 0;
	z-index: 10;
	font-size: 1.7rem;
	color: var(--gray);
}

.hero .h1 div {
	text-align: left;
	margin: 5px 0;
	background: rgba(255, 255, 255, 0.6);
	padding: 10px 5%;
}

.eachTextAnime span {
	opacity: 0;
}

@keyframes text_anime_on {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.eachTextAnime.appeartext span {
	animation: text_anime_on 1s ease-out forwards;
}

@media screen and (max-width:520px) {
	.hero {
		height: 480px;
		min-width:none;
	}

	.hero .h1 {
		bottom: 30px;
		font-size: 1.1rem;
	}

	.hero .h1 div {
		padding: 5px 5%;
	}
}

/**------------------------------ 
コンセプト
 ------------------------------**/
.sec-top-concept {
	background: no-repeat right bottom / 800px auto;
	padding: 100px var(--over-width-half);

	--btnAm: 40px 0 0;
}

.sec-top-concept p {
	width: 510px;
}

@media screen and (max-width:520px) {
	.sec-top-concept {
		background: no-repeat right bottom / 100% auto;
		padding: 30px var(--over-width-half) 70vw;

		--btnAm: 30px 0 0;
	}

	.sec-top-concept p {
		width: 100%;
	}

}

/**------------------------------ 
家づくり
 ------------------------------**/
.sec-top-build {
	padding: 100px 0;

	--titAw: var(--base-width);
}

.sec-top-build ul {
	--boxOE_w: 100%;
	--boxOE_m: 50px auto 80px;
	--boxOE_gap: 0;
	--boxOE_1_w: 830px;
	--boxOE_2_w: clamp(660px, 60%, 1000px);

	--btnAm: 30px 0 0;
}

.sec-top-build ul>* {
	flex-flow: nowrap;
	justify-content: space-between;
}

.sec-top-build ul .OE1 {}

.sec-top-build ul .OE2 {
	padding: 80px;
	margin: 80px 0 0;
	background: var(--gold3);
	z-index: 10;
}

.boxOE>*:nth-child(odd) .OE2 {
	margin-left: -80px;
}

.boxOE>*:nth-child(even) .OE2 {
	margin-right: -80px;
}

@media screen and (max-width:520px) {
	.sec-top-build {
		padding: 30px 0 0;
	}

	.sec-top-build ul {
		--boxOE_w: 100%;
		--boxOE_m: 0 auto 0;
		--boxOE_gap: 0;
		--boxOE_1_w: 100%;
		--boxOE_2_w: 100%;

		--btnAm: 30px 0;
	}

	.sec-top-build ul>* {
		flex-flow: wrap;
	}

	.sec-top-build ul .OE1 {}

	.sec-top-build ul .OE2 {
		padding: 30px 5%;
		margin: 0;
	}

	.boxOE>*:nth-child(odd) .OE2 {
		margin-left: 0;
	}

	.boxOE>*:nth-child(even) .OE2 {
		margin-right: 0;
	}
}

/**================================================== 
 施工事例
================================================= **/
/**------------------------------ 
swiper ボタン ここから
 ------------------------------**/
.sw1 {
	position: relative;
}

.sw1-nav {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	margin: 15px 5% 0;
}

.sw1-next:before,
.sw1-prev:before {
	content: "→";
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 1px solid var(--gold);
	border-radius: 50px;
	color: var(--gold);
	background: var(--white);
	cursor: pointer;
}

.sw1-prev:before {
	content: "←";
}

.sw1-pagination.swiper-pagination-fraction {
	width: auto;
	margin: 0 20px;
	color: var(--gold);
	font-weight: bold;
	font-size: 1.1em;
}


.sw2 {
	position:relative;
}

.sw2-nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	position:absolute;
	top: 40%;
	z-index: 10;
}

.sw2-next:before,
.sw2-prev:before {
	content: "→";
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 1px solid var(--gold);
	color: var(--white);
	background: var(--gold);
	cursor: pointer;
}
.sw2-next:before{
}
.sw2-prev:before {
	content: "←";
}

.sw2-pagination.swiper-pagination-fraction {
	width: auto;
	margin: 0 20px;
	color: var(--gold);
	font-weight: bold;
	font-size: 1.1em;
}

@media screen and (max-width:520px) {
.sw2-nav {
	display: none;
}
  
}

/**------------------------------ 
swiper ボタン ここまで
 ------------------------------**/
/**代表施工事例**/
.sec-top-works {
	padding: 50px 0 100px;

	--titAw: var(--base-width);

	--boxLR_w: auto;
	--boxLR_m: -200px 0 0 var(--over-width-half);
	--boxLR_gap: 50px;
	--boxLR_1_w: 33%;
	--boxLR_2_w: calc(100% - var(--boxLR_1_w) - var(--boxLR_gap));

	--btnAm: 0 auto;
}

.sec-top-works .LR1 {
	margin: 0 0 60px;
}

.slide-works {
	overflow: hidden;
}

.slide-works .swiper-slide {
	width: auto;
}

.slide-works .swiper-slide img {
	height: 700px;
	width: auto;
}

/**その他施工事例**/
.slide-works2 {
	overflow: hidden;
	margin: 80px 0 30px var(--over-width-half);
}

.list-works {}

.list-works li {
	position: relative;
	margin: 0 0 20px;
}

.list-works li a.voiceBtn {
	line-height: 1;
	width: 100%;
	background: var(--gold);
	color: var(--white);
	padding: 15px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: absolute;
	top: calc(340px - (1em + 30px));
	left: 0;
	z-index: 10;
}

.list-works li a.voiceBtn:hover {
	background: var(--black);
}

.list-works li a.voiceBtn:after {
	content: "→";
}



.list-works img {
	width: 100%;
	height: 340px;
	object-fit: cover;
}

.list-works h3 {
	font-weight: bold;
	font-size: 1.25rem;
	margin: 20px 10px;
}

.list-works h3 small {
	font-size: 1rem;
	display: block;
}

.list-works p {
	margin: 0 10px;
}

.sec-works-list {
	padding: 50px var(--over-width-half);
}

.sec-works-list .list-works {
	--boxNC_w: var(--base-width);
	--boxNC_m: 70px auto;
	--boxNC_gap: 20px 3%;
	--boxNC_child_w: calc(94% / 3);
}

@media screen and (max-width:520px) {

	/**代表施工事例**/
	.sec-top-works {
		padding: 40px 0 50px;

		--titAw: var(--base-width);

		--boxLR_w: auto;
		--boxLR_m: 0 var(--over-width-half);
		--boxLR_gap: 20px;
		--boxLR_1_w: 100%;
		--boxLR_2_w: 100%;

		--btnAm: 0 auto;
		--btnAw: 90%;
	}

	.sec-top-works .LR1 {
		margin: 0;
	}

	.slide-works .swiper-slide img {
		height: 60vw;
		width: auto;
	}

	/**その他施工事例**/
	.slide-works2 {
		margin: 40px var(--over-width-half);
	}

	.list-works {}

	.list-works li {
		position: relative;
		margin: 0 0 20px;
	}

	.list-works li a.voiceBtn {
		top: calc(60vw - (1em + 30px));
	}

	.list-works img {
		height: 60vw;
	}

	.list-works h3 {
		margin: 15px 10px;
	}

	.list-works p {
		margin: 0 10px;
	}

	.sec-works-list .list-works {
		--boxNC_w: 100%;
		--boxNC_m: 30px auto;
		--boxNC_gap: 20px 0;
		--boxNC_child_w: 100%;
	}
}


/**================================================== 
 ブログリスト
 ul.boxNC.list-blogs>li>a>
 (figure>img)+(.text>em.em+time.time+h3+p)
================================================== **/
.sec-top-blogs {
	padding: 100px var(--over-width-half);
}

.list-blogs {
	--boxNC_m: 70px auto;
	--boxNC_gap: 40px 5%;
	--boxNC_child_w: calc(95% / 2);
}

.list-blogs a {
	line-height: 1.5;
	display: flex;
}

.list-blogs figure,
.list-blogs picture {
	flex: none;
	width: 180px;
	height: 170px;
	margin: 0 15px 0 0;
}

.list-blogs figure img,
.list-blogs picture img {
	width: 100%;
	height: 100%;

	object-fit: cover;
}

.list-blogs .time {
	color: var(--gold);
	margin: 0 10px 0 0;
}

.list-blogs .em {
	width: auto;
	text-align: center;
	color: var(--white);
	background: var(--gold);
}

.list-blogs i {
	font-style: normal;
	font-size: 0.8rem;
	color: var(--gold);
	display: inline-block;
	margin: 0 5px 3px 0;
	border: 1px solid var(--gold);
	padding: 0 5px;
}

.list-blogs h3 {
	font-weight: bold;
	margin: 15px 0 10px;
}

.list-blogs p {
	font-size: 15px;
	line-height: 1.5;
	margin: 0 0 8px;
}

@media screen and (max-width:520px) {
	.sec-top-blogs {
		padding: 40px var(--over-width-half);
	}

	.list-blogs {
		--boxNC_m: 20px auto 40px;
		--boxNC_gap: 10px;
		--boxNC_child_w: 100%;
	}

	.list-blogs a {
		padding: 0;
	}

	.list-blogs figure,
	.list-blogs picture {
		flex: none;
		width: 96px;
		height: 96px;
		margin: 0 8px 0 0;
	}

	.list-blogs h3 {
		font-weight: bold;
		margin: 8px 0;
	}

	.list-blogs p {
		display: none;
	}
}


/**------------------------------ 
コンタクト
 ------------------------------**/
.sec-top-contact {
	padding: 80px 0 0;

	--titAw: var(--base-width);
}

.list-bnr {
	display: flex;
	flex-wrap: wrap;

	--btnAc: var(--white);
	--btnAbg: none;
	--btnAm: 40px auto 0;
	--btnAc_h: var(--gold);
	--btmAbg_h: var(--white);

	--titBc: var(--white);
	--titBta: center;
}

.list-bnr li {
	width: 50%;
	background: no-repeat center / cover;
	position: relative;
	color: var(--white);
	padding: 100px 100px 60px;
}

.list-bnr li>* {
	position: relative;
	z-index: 2;
}

.list-bnr li:before {
	content: "";
	background: var(--gray2);
	mix-blend-mode: multiply;
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}

@media screen and (max-width:520px) {
	.sec-top-contact {
		padding: 40px 0 0;
	}

	.list-bnr li {
		width: 100%;
		padding: 40px 30px;
		margin: 1px 0 0;
	}
}

/**------------------------------ 
お問い合わせ
 ------------------------------**/
.aside {
	background: no-repeat top left / auto 100%;
	padding: 80px var(--over-width-half) 80px 55%;

	--btnAm: 40px 0 0;
}

@media screen and (max-width:520px) {
	.aside {
		background: no-repeat bottom left / 100% auto;
		padding: 40px var(--over-width-half) 38vw;

	}

	.aside p {
		width: 100%;
	}
}


/**================================================== 
 下層ページ
================================================== **/

/**------------------------------ 
コンセプト
 ------------------------------**/
.sec-concept-con {
	padding: 80px 0 0 var(--over-width-half);

	display: flex;
	flex-flow: row-reverse;
	gap: 70px;
}

.sec-concept-con figure {
	width: 60%;
}

.sec-concept-con figure img {
	width: 100%;
}

.sec-concept-con .text {
	flex: 1;
	margin: 40px 0 0;
}

@media screen and (max-width:520px) {
	.sec-concept-con {
		padding: 30px var(--over-width-half) 0;

		flex-flow: column;
		gap: 0;
	}

	.sec-concept-con figure {
		width: 100%;
	}
}

/**------------------------------ 
フロー
 ------------------------------**/
.sec-concept-num {
	padding: 80px var(--over-width-half);

	--btnAm: 40px 0 0;
}

.list-num {
	margin: 50px auto;
}

.list-num li {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 50px;
	margin: 80px auto 0;
}

.list-num li:nth-child(even) {
	flex-flow: row-reverse;
}

.list-num li figure {
	width: 530px;
	position: relative;
	box-shadow: -130px 100px 0 var(--gold3);
}

.list-num li:nth-child(even) figure {
	box-shadow: 130px 100px 0 var(--gold3)
}

.list-num li .text {
	flex: 1;
	margin: 40px 15px 0;
}

.list-num li.mararikomi,
.list-num li:nth-child(even).mararikomi {
	display: block;
}

.list-num li.mararikomi:after {
	content: "";
	display: block;
	clear: both;
}

.list-num li.mararikomi figure {
	float: right;
	margin: 0 0 120px 50px;
}

.list-num i {
	position: absolute;
	top: -40px;
	right: -15px;
	font-family: var(--webf);
	color: var(--gold4);
	font-size: 120px;
	line-height: 1;
	z-index: -1;
}


@media screen and (max-width:520px) {
	.sec-concept-num {
		padding: 1px var(--over-width-half);

		--btnAm: 40px 0 0;
	}

	.list-num {
		margin: 40px auto;
	}

	.list-num li {
		display: flex;
		flex-flow: column;
		gap: 0;
		margin: 0 auto 50px;
	}

	.list-num li:nth-child(even) {
		flex-flow: column;
	}

	.list-num li figure {
		width: 100%;
	}
	
	.list-num li.mararikomi figure {
		float: none;
		margin: 0;
	}

	.list-num li .text {
		flex: 1;
		margin: 20px 0 0;
	}

	.list-num i {
		position: absolute;
		top: -50px;
		right: 0;
		font-family: 'EB Garamond',
			serif;
		color: #ece7df;
		font-size: 80px;
		line-height: 1;
		z-index: -1;
	}
}

/**================================================== 
 会社概要
================================================== **/
.sec-company-01 {
	padding: 80px var(--over-width-half);
	display: flex;
	gap: 40px;

	--titBm: 0 0 15px;

	--titAw: auto;
}

.sec-company-01 figure {
	width: 25%;
	flex: none;
}

.sec-company-01 .p {
	flex: 1;
}

.sec-company-02,
.sec-company-03 {
	padding: 50px var(--over-width-half);
}

.list-staff li {
	display: flex;
	justify-content: space-between;
	align-items: center;

	gap: 50px;

	--titBfz: 1.3rem;
	--titBc: var(--gold);
	--titBm: 0 0 15px;
}

.list-staff li+li {
	margin: 20px 0 0;
}

.list-staff li small {
	display: block;
	font-weight: normal;
}

.list-staff li figure {
	width: 400px;
	flex: none;
}

.list-staff li .text {
	flex: 1;
	background: var(--gold3);
	padding: 40px;
}

@media screen and (max-width:520px) {
	.sec-company-01 {
		padding: 40px var(--over-width-half);
		display: block;
		flex-flow: wrap;
		gap: 20px;

		--titBm: 0 0 5px;

		--titAw: 100%;
		--titAm: 0;
	}

	.sec-company-01 figure {
		float: left;
		width: 30%;
		margin: 15px 15px 5px 0;
	}

	.sec-company-01 .p {
		margin: 15px 0 0;
	}

	.sec-company-02,
	.sec-company-03 {
		padding: 20px var(--over-width-half) 40px;
	}

	.list-staff li {
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-flow: column;

		gap: 10px;

		--titBfz: 1.1rem;
	}

	.list-staff li+li {
		margin: 40px 0 0;
	}

	.list-staff li small {
		display: block;
		font-weight: normal;
	}

	.list-staff li figure {
		width: 80%;
		flex: none;
	}

	.list-staff li .text {
		width: 100%;
		padding: 15px;
	}

}


/**------------------------------ 
来場予約
 ------------------------------**/
.sec-reserv-cont {
  --base-width:980px;
  padding:70px calc((100vw - var(--base-width)) / 2);
  margin: 80px auto 0;

	--boxLR_w: var(--base-width);
	--boxLR_m: 0 auto;
	--boxLR_gap: 40px;
	--boxLR_1_w: 40%;
	--boxLR_2_w: calc(100% - var(--boxLR_1_w) - var(--boxLR_gap));
	
	--btnAm:15px 0;
	
	--titAm: 0 auto 20px;
}

@media screen and (max-width:520px) {
	.sec-reserv-cont {
	  --base-width:90%;
    margin: 30px auto 0;
     padding:30px 5%;

		--boxLR_w: 100%;
		--boxLR_m: 0 auto;
		--boxLR_gap: 10px;
		--boxLR_1_w: 100%;
		--boxLR_2_w: 100%;
		
		--btnAm:5px 0 ;
		--btnAw:100%;
		
	}

	.sec-reserv-cont .map iframe {
		height: 60vw;
	}
	
	.sec-reserv-cont .table table{
	  background: var(--white);
	  margin: 10px 0 30px;
	}
	
}

/**------------------------------ 
お問い合わせ
 ------------------------------**/
.phone {
	width: var(--base-width);
	background: var(--gold3);
	text-align: center;
	padding: 50px 15px 30px;
	font-size: 1.1em;
	line-height: 1.5;
	position: relative;
	margin: 10px auto;

	--titBta: center;
}

.phone .tel {
	display: block;
	font-size: 3em;
	margin: 20px auto;
	font-weight: normal;
}


@media screen and (max-width:520px) {
	.phone {
		padding: 20px 10px;
		margin: 40px auto;
	}

	.phone .tel {
		font-size: 2em;
		margin: 15px auto;
		background: none;
	}

}

.sec-contact-paper {
	padding: 80px var(--over-width-half) 30px;
	text-align: center;

	--titBta: center;
	--titBm: 0 0 10px;
}

.sec-contact-paper figure {
	margin: 40px auto;
}


.sec-contact-form{
  --base-width: 980px;
    width: var(--base-width);
    margin: 80px auto;
}

@media screen and (max-width:520px) {
	.sec-contact-paper {
		padding: 40px var(--over-width-half) 1px;
		text-align: left;
	}

	.sec-contact-paper figure {
		margin: 20px auto;
	}
	
	.sec-contact-form{
	--base-width: 90%;
  margin:40px auto 20px;
}
}

/**================================================== 
 施工事例詳細
================================================== **/
.sec-works-detail {
	padding: 80px 0 0;
}

.sec-works-detail .em {
	border: 1px solid var(--gold);
	background: var(--gold);
	color: var(--white);
}

.sec-works-detail h3,
.sec-works-detail02 h3 {
	font-weight: bold;
	font-size: 1.75rem;
	margin: 15px 0 40px;
	text-align: center;
}

.sec-works-detail h3+p {
	font-size: 1.1rem;
}

.sec-works-detail h3 small {
	display: block;
	font-size: 0.7em;
}

.slide-detail {
	margin: 50px auto;
	min-width: var(--base-width);
	max-width: 80%;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 3%;
}


.slider-main {
	width: 73%;
	overflow: hidden;
	position: relative;
}

/*.slider-main .sw2-nav {
	position: absolute;
	top: clamp(497px, 35.8vw, 35.8vw);
	right: 0;
	z-index: 100;
}*/

.slider-main img {
	width: 100%;
	height: 600px;
	object-fit: contain;
}

.slider-main p {
	width: 100%;
	line-height: 1.5;
	margin: 10px 0 0;
}

.slider-thumbnail {
	width: 27%;

	overflow: hidden;
	background: var(--gold3);
	box-shadow: 0 0 0 10px var(--gold3);
}

.slider-thumbnail img {
	height: 100%;
	width: 100%;
	object-fit: cover;
}

.slider-thumbnail .swiper-wrapper {
	flex-wrap: wrap;
	gap: 5px;
}

.slider-thumbnail .swiper-wrapper .swiper-slide {
	width: calc((100% - 10px)/ 3) !important;
	height: 4.2vw !important;
	min-height: 57px;
	cursor: pointer;
	opacity: 0.4;
	background: var(--white);
}

.slider-thumbnail .swiper-wrapper .swiper-slide.swiper-slide-thumb-active {
	opacity: 1;
}

.sec-works-detail02 {
	padding: 50px var(--over-width-half);
}

@media screen and (max-width:520px) {
	.sec-works-detail {
		padding: 30px 0 0;
	}

	.sec-works-detail h3,
	.sec-works-detail02 h3 {
		font-size: 1.3rem;
		margin: 15px 0;
	}

	.slide-detail {
		margin: 20px auto;
		min-width: 94%;
		max-width: 94%;
		gap: 15px;
		flex-flow: column;
	}

	.slider-main {
		width: 100%;
	}
	
	.slider-main img {
  	width:90%;
  	height: auto;
  	margin:0 5% 15px;
  	object-fit: fill;
  }

	/*.slider-main .sw2-nav {
		top: 60vw;
	}*/

	.slider-main p {
		font-size: 0.9rem;
	}

	.slider-thumbnail {
		width: 100%;
	}

	.slider-thumbnail .swiper-wrapper {
		gap: 10px;
	}

	.slider-thumbnail .swiper-wrapper .swiper-slide {
		width: calc((100% - 40px) / 5) !important;
		height: calc((94vw - 40px) / 8) !important;
	}

	.sec-works-detail02 {
		padding: 30px var(--over-width-half);
	}
}


/**------------------------------ 
お客様の声
 ------------------------------**/
.faq {
	margin: 0 auto 40px;
	border: 1px solid var(--gold);
	border-radius: 20px;
}

.faq dt {
	font-size: 20px;
	font-weight: bold;
	position: relative;
	min-height: 60px;
	margin: 0;
	margin-top: 0;
	padding: 25px 30px 25px 110px;
	color: var(--black4);
	border-bottom: 1px solid var(--gold4);
}

.faq dt:before {
	font-size: 22px;
	font-weight: bold;
	position: absolute;
	top: 15px;
	left: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 50px;
	height: 50px;
	content: "Q";
	color: var(--gold);
	border: 1px solid var(--gold);
	border-radius: 50%;
}

.faq dd {
	position: relative;
	min-height: 60px;
	padding: 25px 30px 25px 110px;
	color: #2e2828;
}

.faq dd:before {
	font-family: "Roboto", sans-serif;
	font-size: 18px;
	font-weight: bold;
	position: absolute;
	top: 15px;
	left: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 50px;
	height: 50px;
	content: "A";
	color: #ffffff;
	border: 1px solid var(--gold);
	border-radius: 25px;
	background: var(--gold);
}

@media screen and (max-width: 768px) {
	.faq {
		margin: 0 auto 20px;
		border-radius: 10px;
	}

	.faq dt {
		font-size: 15px;
		min-height: 60px;
		padding: 20px 15px 20px 50px;
	}

	.faq dt:before {
		font-size: 17px;
		top: 15px;
		left: 10px;
		width: 30px;
		height: 30px;
	}

	.faq dd {
		min-height: 60px;
		padding: 20px 15px 20px 50px;
	}

	.faq dd:before {
		font-size: 17px;
		top: 15px;
		left: 10px;
		width: 30px;
		height: 30px;
	}
}


/**================================================== 
 性能・工法へのこだわり
================================================== **/
.sec-obs-01 {
	padding: 80px var(--over-width-half);
}

.list-pagelink {
	display: flex;
	gap: 15px;
	text-align: center;
}

.list-pagelink a {
	flex: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--gold);
	color: var(--white);
	font-size: 1.3em;
	padding: 55px 5px;
	font-weight: bold;
	position: relative;
	border: 1px solid var(--gold);

	counter-increment: number;
	letter-spacing: -1px;
}

.list-pagelink a:before {
	content: counter(number, decimal-leading-zero);
	opacity: 0.3;
	font-family: var(--webf);
	font-size: 3rem;
	position: absolute;
	top: 3px;
	left: 3px;
	line-height: 1;
	font-style: italic;
}

.list-pagelink a:after {
	content: "↓";
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	position: absolute;
	left: 0;
	width: 100%;
	bottom: 5px;
}

.list-pagelink a:hover {
	background: var(--gold3);
	color: var(--gold);
}

.sec-obs-02 {
	padding: 80px var(--over-width-half);
}

.video {
	background: #000;
	text-align: center;
	padding: 5px;
	line-height: 0;
	color: var(--white);
	font-size: 14px;
}

.video iframe {
	max-width: 854px;
	height: auto;
	aspect-ratio: 16/9;
}

.sec-obs-02 .list-num i{
  display: none;
}

.wrap-cv {
	--titBm: 40px auto;
	--titBta: center;
}

.sec-obs-03 {
	padding: 80px var(--over-width-half) 50px;
}

.wrap-ill {
	--titBm: 0 0 10px;
	--titBbg: none;
	--titBc: var(--black);
	--titBp: 0;

	border: 1px solid var(--gold2);
	padding: 30px;
	margin: 0 auto 40px;
	position: relative;
}

.wrap-ill .ill-tit {
	position: absolute;
	top: 30px;
	left: 30px;
}

.wrap-ill i {
	color: var(--gold);
	font-family: var(--webf);
	font-size: 1.8rem;
	font-weight: bold;
	font-style: normal;
}
.wrap-ill small{
  display: block;
  line-height: 1.3;
  margin: 5px 0;
}

.wrap-ill img {
	display: block;
	margin: 0 auto;
}

.wrap-ill dl {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 5px 2%;
	margin: 20px 0;
	font-weight: bold;
}

.wrap-ill dl dt {
	font-size: 1.2rem;
	width: 20%;
	background: var(--gold4);
	padding: 15px;
}

.wrap-ill dl dd {
	width: 78%;
	line-height: 1.5;
}

.wrap-ill table {
	background: var(--gold3);
	width: 100%;
}

.wrap-ill table td,
.wrap-ill table th {
	border: 1px solid var(--white);
	vertical-align: middle;
	padding: 15px;
}

.wrap-ill table th {
	background: var(--gold);
	color: var(--white);
	text-align: center;
}

.wrap-ill table tr>td:nth-child(1) {
	background: var(--gold4);
	min-width: 250px;
}

.sec-obs-04 {
	padding: 50px var(--over-width-half);

	--titBc: var(--gold);
	--titBm: 0 auto 30px;
}

.list-merit {
	--titBm: 0 auto 15px;
	--titBbg: var(--gold);
	--titBc: var(--white);
	--titBp: 5px 20px;
}

.list-merit li {
	display: flex;
	background: var(--white);
	gap: 50px;
	padding: 30px;
	justify-content: space-between;
	border: 1px solid var(--gold2);
	margin: 0 0 40px;
	box-shadow: 20px 20px 0 var(--gold4);
}

.list-merit li figure {
	width: 30%;
	flex: none;
}

.list-merit li h4 {
	font-weight: bold;
	margin: 10px 0;
	font-size: 1.3rem;
	color: var(--gold);
}

.sec-obs-05 {
	padding: 80px var(--over-width-half) 1px;

	--boxLR_w: 100%;
	--boxLR_m: 30px auto 80px;
	--boxLR_gap: 50px;
	--boxLR_1_w: 37%;
	--boxLR_2_w: calc(100% - var(--boxLR_1_w) - var(--boxLR_gap));

	--boxNC_w: 100%;
	--boxNC_m: 30px auto;
	--boxNC_gap: 20px 3%;
	--boxNC_child_w: calc(94% / 3);

	--titBm: 50px auto 20px;
	--titBbg: var(--gold);
	--titBc: var(--white);
	--titBp: 5px 20px;
}

.sec-obs-05 .boxLR figure {
	box-shadow: 60px 50px 0 var(--gold3);
}

.sec-obs-05 .boxNC h3 {
	font-weight: bold;
	font-size: 1.1rem;
	margin: 10px 0 0;
}

.sec-obs-05 .wrap-ill {
	margin: 30px auto;
}

.list-icons {
	display: flex;
	justify-content: space-between;
	margin: 40px 5%;
}

.list-icons li {
	width: 23%;
	text-align: center;
	border: 2px solid var(--gold);
	padding: 20px 0;
	font-weight: bold;
	color: var(--gold);
	border-radius: 10px;
}

.list-icons li img {
	display: block;
	margin: 15px auto;
}

.wrap-graf {
	display: flex;
	justify-content: space-between;
	border: 1px solid var(--gold2);
	padding: 30px;
	margin: 30px auto;
	position: relative;
}

.wrap-graf figure {
	width: 60%;
}

.wrap-graf .em {
	background: var(--gold);
	color: var(--white);
}

.wrap-graf h3 {
	font-weight: bold;
	font-size: 1.3rem;
	margin: 10px auto;
}

.wrap-graf .text {
	width: 40%;
}

.wrap-graf dl {
	width: 90%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 5px 0;
	font-weight: bold;
}

.wrap-graf dl dt {
	width: 50%;
	background: var(--gold4);
	padding: 5px 20px;
}

.wrap-graf dl dd {
	width: 50%;
	padding: 5px 20px;
}

.wrap-graf .dt01 {
	background: #85c6ce;
}

.wrap-graf .dt02 {
	background: #cfb286;
}

.wrap-graf .dt03 {
	background: #e8d8c1;
}

.wrap-graf small {
	display: block;
	line-height: 1.4;
	margin: 5px 0 0;
}

.sec-obs-06 {
	padding: 80px var(--over-width-half) 1px;
}

@media screen and (max-width:520px) {
	.sec-obs-01 {
		padding: 20px var(--over-width-half);
	}

	.list-pagelink {
		gap: 5px;
		flex-flow: wrap;
	}

	.list-pagelink a {
		width: calc((100% - 5px) / 2);
		flex: none;
		font-size: 1em;
		padding: 20px 5px 30px;
		line-height: 1.5;
	}

	.list-pagelink a:before {
		top: -3px;
		left: -3px;
		line-height: 1;
	}

	.list-pagelink a:hover {
		background: var(--gold3);
		color: var(--gold);
	}

	.sec-obs-02 {
		padding: 30px var(--over-width-half);
	}

	.video video {
		width: 100%;
	}

	.video iframe {
		max-width: 100%;
	}

	.wrap-cv {
		--titBm: 30px auto;
	}

	.sec-obs-03 {
		padding: 30px var(--over-width-half) 10px;
	}

	.wrap-ill {
		--titBm: 0 0 5px;
		--titBbg: none;
		--titBc: var(--black);
		--titBp: 0;

		border: 1px solid var(--gold2);
		padding: 15px;
		margin: 0 auto 20px;
		position: relative;
	}

	.wrap-ill .ill-tit {
		position: static;
	}

	.wrap-ill i {
		font-size: 1.4rem;
	}

	.wrap-ill dl {
		flex-flow: column;
		align-items: flex-start;
		gap: 10px;
		margin: 20px 0;
		font-weight: bold;
	}

	.wrap-ill dl dt {
		font-size: 1.1rem;
		width: 100%;
		padding: 5px 20px;
	}

	.wrap-ill dl dd {
		width: 100%;
		padding: 0 3%;
	}

	.wrap-ill table,
	.wrap-ill tbody {
		display: block;
	}

	.wrap-ill table tr {
		display: flex;
		flex-wrap: wrap;
	}

	.wrap-ill table td,
	.wrap-ill table th {
		display: block;
		padding: 10px;
	}

	.wrap-ill table td {
		width: 100%;
	}

	.wrap-ill table.t_C td {
		padding: 0;
		line-height: 2;
	}

	.wrap-ill table.t_C td+td {
		width: calc(100% / 7);
		padding: 10px 0;
	}

	.wrap-ill table.t_C th {
		width: 100%;
	}


	.wrap-ill table th {
		width: 50%;
	}

	.wrap-ill table tr>td:nth-child(1) {
		min-width: auto;
	}

	.sec-obs-04 {
		padding: 30px var(--over-width-half);

		--titBm: 0 auto 20px;
	}

	.list-merit li {
		flex-wrap: wrap;
		gap: 10px;
		padding: 20px;
	}

	.list-merit li figure {
		width: 100%;
		flex: none;
	}

	.sec-obs-05 {
		padding: 30px var(--over-width-half) 1px;

		--boxLR_w: 100%;
		--boxLR_m: 30px auto;
		--boxLR_gap: 20px;
		--boxLR_1_w: 100%;
		--boxLR_2_w: 100%;

		--boxNC_w: 100%;
		--boxNC_m: 30px auto;
		--boxNC_gap: 15px;
		--boxNC_child_w: 100%;
	}

	.list-icons {
		display: flex;
		flex-flow: column;
		justify-content: space-between;
		margin: 20px auto;
		gap: 15px;
	}

	.list-icons li {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		text-align: center;
		padding: 15px;
		font-size: 1.2rem;
	}

	.list-icons li img {
		width: 50px;
		height: 36px;
		object-fit: contain;
		margin: 0 15px 0 0;
	}

	.wrap-graf {
		display: flex;
		flex-flow: column-reverse;
		justify-content: space-between;
		padding: 15px;
		gap: 15px;
		margin: 20px auto;
	}

	.wrap-graf figure {
		width: 100%;
	}

	.wrap-graf .text {
		width: 100%;
	}

	.wrap-graf dl {
		width: 100%;
		flex-wrap: wrap;
		align-items: stretch;
		gap: 5px 0;
		margin: 0 0 10px;
	}

	.wrap-graf dl dt {
		width: 60%;
		background: var(--gold4);
		padding: 5px 10px;
	}

	.wrap-graf dl dd {
		width: 40%;
		padding: 5px 15px;
	}

	.wrap-graf .dt01 {
		background: #85c6ce;
	}

	.wrap-graf .dt02 {
		background: #cfb286;
	}

	.wrap-graf .dt03 {
		background: #e8d8c1;
	}

	.wrap-graf small {
		display: block;
		line-height: 1.4;
		margin: 5px 0 0;
	}

	.sec-obs-06 {
		padding: 30px var(--over-width-half) 1px;
	}
}


/**================================================== 
 家づくりの流れ
================================================== **/
.sec-flow-01 {
	padding: 80px var(--over-width-half);

	--titBta: center;
}

.wrap-htext {
	width: 100%;
	background: var(--gold3);
	padding: 50px 50px 30px;
	font-size: 1.1em;
	line-height: 1.5;
	position: relative;
	margin: 10px auto;

	--titBta: center;
}

.wrap-htext h4 {
	font-weight: bold;
	font-size: 1.2rem;
	margin: 0 0 15px;
}

.list-flow {
	margin: 30px auto;

	padding: 30px;
}

.list-flow li {
	position: relative;

	--boxLR_w: 100%;
	--boxLR_m: 0 auto;
	--boxLR_gap: 80px;
	--boxLR_1_w: 20%;
	--boxLR_2_w: calc(100% - var(--boxLR_1_w) - var(--boxLR_gap));

	border-bottom: 1px solid var(--gold4);
	padding: 30px;
}

.list-flow li:nth-child(1) {
	border-top: 1px solid var(--gold4);
}

.list-flow li i {
	font-family: var(--webf);
	color: var(--gold4);
	font-size: 40px;
	line-height: 1;
	z-index: -1;
	display: inline-block;
	text-align: center;
	font-weight: bold;
	font-style: normal;
	margin: 0 15px 0 0;
}

.list-flow li h3 {
	font-size: 1.6rem;
	font-weight: bold;
	margin: 0 0 15px;
}

.list-flow li h4 {
	font-size: 1.2rem;
	font-weight: bold;
	margin: 0 0 10px;
}

.sankaku {
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 20px 50px 0 50px;
	border-color: var(--gold4) transparent transparent transparent;
	margin: 15px auto;
}

.sec-flow-02 {
	padding: 80px var(--over-width-half) 30px;
}

.sec-flow-03 {
	padding: 1px var(--over-width-half) 80px;

	--btnAm: 80px auto 0;
}

.sec-flow-03_inner {
	background: rgba(255, 255, 255, 0.6);
	box-shadow: 0 0 0 30px rgba(255, 255, 255, 0.6);
	margin: 80px auto 0;
}

.wrap-num {
	background: var(--gold);
	color: var(--white);
	padding: 15px 20px;
	width: fit-content;
	margin: 80px 0 30px;
	min-width: 300px;
}

.wrap-num dt {
	font-size: 25px;
	font-family: var(--webf);
	display: flex;
	align-items: center;
	gap: 20px;
	width: 100px;
	line-height: 1;
	margin: 0 0 5px;
}

.wrap-num dt:after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--white);
	opacity: 0.5;
}

.wrap-num dd {
	font-size: 1.2rem;
	font-weight: bold;
	margin: 0;
}

.wrap-num small {
	font-family: var(--webf);
	opacity: 0.5;
	font-size: 1.1rem;
	font-weight: normal;
	letter-spacing: 1px;
	display: inline-block;
	margin: 0 0 0 20px;
}


.wrap-smiley {
	padding: 15px 2% 0;
	border-bottom: 0px solid var(--green);
	align-items: center;
	justify-content: center;
	line-height: 1.4;

	--boxLR_w: 100%;
	--boxLR_m: 30px auto 1px;
	--boxLR_gap: 25px;
	--boxLR_1_w: 38%;
	--boxLR_2_w: 20%;
	--boxLR_3_w: calc(100% - (var(--boxLR_1_w) + var(--boxLR_2_w)) - (var(--boxLR_gap) * 2));

	--titBfz: 1.2rem;
	--titBm: 0 0 20px;
}

.wrap-smiley .tel {
	font-size: 45px;
	line-height: 1;
	margin: 10px 0 0;
	color: var(--pink);
	font-weight: 700;
}

.wrap-smiley .tel img {
	width: 60px;
	margin: 0 15px 0 0;
}

.wrap-smiley .tel p {
	text-align: center;
	font-size: 18px;
	margin: 10px auto;
	padding: 3px 0;
	color: var(--pink);
	border-bottom: 3px double var(--pink);
	border-top: 3px double var(--pink);
}

.wrap-smiley h4 {
	background: var(--white);
	color: var(--pink);
	border: 1px solid var(--pink);
	font-weight: bold;
	font-size: 1.5rem;
	padding: 5px 20px;
	margin: 0 0 5px;
	border-radius: 15px 15px 0 0;
}

.wrap-smiley h4 small {
	display: inline-block;
	margin: 0 15px 10px 0;
	font-size: 0.9rem;
}

.wrap-smiley dl {
	background: var(--pink);
	color: var(--white);
	padding: 10px 15px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0 0 5px;
}

.wrap-smiley dl dd {
	font-weight: bold;
	color: var(--white);
	font-size: 1.2rem;
}

.wrap-smiley dl dd small {
	width: 100%;
	display: block;
	color: var(--white);
	font-size: 0.8rem;
	font-weight: normal;
	line-height: 1.3;
}

.sec-flow-03 .list-pagelink a[href*="smiley01"] {
	background-color: var(--blue2);
	border: 1px solid var(--blue2);
}

.sec-flow-03 .list-pagelink a[href*="smiley01"]:hover {
	color: var(--blue2);
	background: var(--white);
}

.sec-flow-03 .list-pagelink a[href*="smiley02"] {
	background-color: var(--pink2);
	border: 1px solid var(--pink2);
}

.sec-flow-03 .list-pagelink a[href*="smiley02"]:hover {
	color: var(--pink2);
	background-color: var(--white);
}

.sec-flow-03 .list-pagelink a[href*="smiley03"] {
	background-color: var(--green2);
	border: 1px solid var(--green2);
}

.sec-flow-03 .list-pagelink a[href*="smiley03"]:hover {
	background: var(--white);
	color: var(--green2);
}

.sec-flow-03 .list-pagelink a {
	padding: 35px 5px;
}

:root {
	--blue2: #008bd5;
	--pink2: #ea6c8d;
	--green2: #6cba59;
}

.wrap-blue {
	--this_color: var(--blue2);
}

.wrap-pink {
	--this_color: var(--pink2);
}

.wrap-green {
	--this_color: var(--green2);
}

.sec-smiley {
	--titBm: 30px auto 15px;
	--titBc: var(--white);
	--titBp: 5px;
	--titBta: center;
	--titBbg: var(--this_color);

	padding: 0 30px 30px;
	margin: 40px auto;
	position: relative;
	background: var(--white);
	border: 2px solid var(--this_color);
}

.sec-smiley .titB small {
	display: inline-block;
	background: var(--pink);
	color: var(--white);
	padding: 5px 15px;
	border-radius: 5px;
	vertical-align: middle;
	margin: 0 5px;
	line-height: 1;
}

.sec-smiley dl {
	font-weight: bold;
	display: flex;
	border: 1px solid var(--pink);
	margin: 10px 0 10px;
}

.sec-smiley dl dt {
	background: var(--pink);
	color: var(--white);
	padding: 10px;
	text-align: center;
	width: 100px;
	font-size: 1.2rem;
}

.sec-smiley dl dd {
	font-weight: bold;
	font-size: 1.3rem;
	padding: 10px;
	color: var(--pink);
}

.sec-smiley dl dd small {
	color: var(--black);
}

.list-support {
	--boxNC_w: 100%;
	--boxNC_m: 30px auto 0;
	--boxNC_gap: 20px 3%;
	--boxNC_child_w: calc(94% / 3);
}

.list-support .h3em{
  height: 3em;
}.list-support .h4em{
  height: 4em;
}.list-support .h5em{
  height: 5em;
}.list-support .h6em{
  height: 6em;
}.list-support .h7em{
  height: 7em;
}

.list-support h4 {
	color: var(--white);
	background: var(--this_color);
	font-weight: bold;
	font-size: 1.2rem;
	padding: 5px 15px;
	margin: 0 0 15px;
}

.list-support h5 {
	color: var(--this_color);
	font-weight: bold;
	margin: 5px 0;
}

.list-support p {
	font-size: 0.9rem;
	line-height: 1.3;
}

.list-support figure img {
	max-width: none;
	width: 100%;
}

.list-support figure {
	margin: 0 0 15px;
}

@media screen and (max-width:520px) {
	.sec-flow-01 {
		padding: 30px var(--over-width-half) 0;

		--titBta: center;
	}
	
	.list-support .h3em{
  height: auto;
}.list-support .h4em{
  height: auto;
}.list-support .h5em{
  height: auto;
}.list-support .h6em{
  height: auto;
}.list-support .h7em{
  height: auto;
}

	.wrap-htext {
		padding: 20px;
		margin: 0 auto 20px;
	}

	.wrap-htext h4 {
		font-size: 1.1rem;
		margin: 0 0 10px;
	}

	.list-flow {
		margin: 10px auto;

		padding: 15px 0;
	}

	.list-flow li {

		--boxLR_w: 100%;
		--boxLR_m: 0 auto;
		--boxLR_gap: 20px;
		--boxLR_1_w: 100%;
		--boxLR_2_w: 100%;

		padding: 30px 0;
	}

	.list-flow li i {
		font-size: 30px;
	}

	.list-flow li h3 {
		font-size: 1.4rem;
	}

	.sankaku {
		margin: 0 auto 15px;
	}

	.sec-flow-02 {
		padding: 40px var(--over-width-half) 10px;
	}

	.sec-flow-03 {
		padding: 1px var(--over-width-half) 30px;

		--btnAm: 30px auto 0;
	}

	.sec-flow-03_inner {
		width: 100%;
		box-shadow: none;
		margin: 30px auto 0;
		padding: 1px 15px 15px;
	}

	.wrap-num {
		width: 100%;
		margin: 30px 0 15px;
		min-width: auto;
	}

	.wrap-num small {
		margin: 0;
	}


	.wrap-smiley {
		padding: 15px 0;
		--boxLR_w: 100%;
		--boxLR_m: 1px auto 30px;
		--boxLR_gap: 5px;
		--boxLR_1_w: 65%;
		--boxLR_2_w: 30%;
		--boxLR_3_w: 100%;

		--titBfz: 1rem;
		--titBm: 0 0 10px;
	}

	.wrap-smiley .tel {
		font-size: 25px;
		margin: 0 0 15px;
	}

	.wrap-smiley .tel img {
		width: 25px;
		margin: 0 5px 0 0;
	}

	.wrap-smiley .tel p {
		font-size: 14px;
		margin: 5px auto;
		padding: 1px 0;
	}

	.wrap-smiley h4 {
		line-height: 1.2;
	}

	.wrap-smiley h4 small {
		display: inline-block;
		margin: 0;
		font-size: 0.9rem;
	}

	.wrap-smiley dl {
		gap: 5px;
	}

	.wrap-smiley dl dd {
		font-size: 1.1rem;
	}

	.sec-flow-03 .list-pagelink a {
		padding: 25px 5px;
		white-space: nowrap;
		flex: 1;
	}

	/*.list-pagelink a:hover {
		background: var(--white);
		color: var(--green2);
	}*/

	.sec-smiley {
		--titBm: 10px auto 15px;
		--titBp: 5px;
		--titBta: left;

		padding: 0 10px 30px;
		margin: 40px auto 0;
	}

	.sec-smiley .titB small {
		padding: 5px;
		display: block;
		width: fit-content;
		margin: 0 0 5px;
	}

	.sec-smiley dl {
		margin: 10px 0;
	}

	.sec-smiley dl dt {
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 5px;
		width: 50px;
		flex: none;
	}

	.sec-smiley dl dd {
		padding: 5px;
		line-height: 1.4;
	}

	.sec-smiley p {
		line-height: 1.5;
	}

	.list-support {
		--boxNC_gap: 15px;
		--boxNC_child_w: 100%;
	}

}



/**================================================== 
建築プランのご案内 
================================================== **/
.sec-plan-01 {
	padding: 80px var(--over-width-half);

	--titBm: 30px auto 20px;
	--titBbg: var(--gold);
	--titBc: var(--white);
	--titBp: 15px 20px;
	--titBta: center;

	--titCm: 70px auto 0;
}

.list-narabi {
	--boxNC_w: 100%;
	--boxNC_m: 0 auto 30px;

	font-size: 1.3rem;
	font-weight: bold;
	text-align: center;
	color: var(--gold);
}

.list-narabi li {
	padding: 20px 0;
	background: var(--gold3);
}


.list-atai,
.list-atai2 {
	--boxNC_gap: 15px 3%;
	--boxNC_child_w: calc(97% / 2);
	--boxNC_w: 100%;
	--boxNC_m: 0 auto 30px;

	--titBm: 0 auto 5px;
	--titBbg: none;
	--titBc: var(--gold);
	--titBp: 0;
	--titBta: left;
	--titBfz: 1.1rem;

	margin: 40px auto;
	font-size: 0.9rem;
}

.list-atai3 {
	--boxNC_gap: 15px 5%;
	--boxNC_child_w: calc(95% / 2);
	--boxNC_w: 100%;
	--boxNC_m: 0 auto 30px;

	--titBm: 10px auto 20px;
	--titBbg: var(--gold);
	--titBc: var(--white);
	--titBp: 15px 20px;
	--titBta: left;
	--titBfz: 1.1rem;

	margin: 40px auto;
	font-size: 0.9rem;
}


.list-atai li {
	display: flex;
	background: var(--white);
	gap: 15px;
	padding: 15px;
	justify-content: space-between;
	border: 1px solid var(--gold2);
	margin: 0;
}

.list-atai2 li {
	padding: 15px;
	border: 1px solid var(--gold2);
	margin: 0;
}

.list-atai li figure {
	width: 30%;
	flex: none;
}

.list-atai li p {
	line-height: 1.6;
}

.list-atai3 li {
	display: flex;
	background: var(--white);
	gap: 15px;
	padding: 15px;
	justify-content: space-between;
	border: 1px solid var(--gold2);
	margin: 0;
}

.list-atai3 li figure {
	width: 50%;
	flex: none;
}



@media screen and (max-width:520px) {
	.sec-plan-01 {
		padding: 40px var(--over-width-half);

		--titBm: 15px auto 15px;
		--titBp: 15px;
		--titBta: left;

		--titCm: 30px auto 0;
	}

	.list-narabi {
		--boxNC_w: 100%;
		--boxNC_m: 0 auto 10px;
		--boxNC_gap: 10px;

		font-size: 1.2rem;
	}

	.list-narabi li {
		padding: 10px 0;
	}

	.list-atai,
	.list-atai2 {
		--boxNC_gap: 10px;
		--boxNC_child_w: 100%;
		--boxNC_w: 100%;
		--boxNC_m: 0 auto 30px;

		margin: 20px auto;
	}

	.list-atai3 {
		--boxNC_gap: 10px;
		--boxNC_child_w: 100%;

		--titBp: 10px;

		margin: 20px auto;
	}

	.list-atai li {
		gap: 10px;
		padding: 10px;
		display: block;
		overflow: none;
	}

	.list-atai li figure {
		width: 40%;
		float: left;
		margin: 0 8px 5px 0;
	}

	.list-atai3 li {
		display: flex;
		flex-flow: column;
		gap: 15px;
		padding: 15px;
		margin: 0;
	}

	.list-atai3 li figure {
		width: 100%;
		flex: none;
	}

}

.sec-plan-02 {
	padding: 80px var(--over-width-half);
}

.plan-name {
	--boxLR_w: 100%;
	--boxLR_m: 30px auto;
	--boxLR_gap: 40px;
	--boxLR_1_w: 45%;
	--boxLR_2_w: calc(100% - var(--boxLR_1_w) - var(--boxLR_gap));
}

.plan-name h3.titC {
	color: var(--gold);
	--titCm: 0 0 15px;
}

.plan-name h4 {
	--titBbg: var(--gold);
	--titBc: var(--white);
	--titBfz: 1.5rem;
	--titBp: 5px 30px;
	--titBta: center;
	--titBm: 0;
	border-radius: 50px;
}

.plan-name h5 {
	color: var(--gold);
	font-size: 1.3rem;
	text-align: center;
	font-weight: bold;
	line-height: 1;
	margin: 15px 0 25px;
}

.plan-name h5 b {
	display: inline-block;
	font-size: 2.5em;
	margin: 0 5px 0 0;
}

.plan-name em{
  display: inline-block;
  border: 1px solid var(--gold);
  color: var(--gold);
  padding:8px 10px;
  margin: 3px 3px;
  font-style: normal;
  line-height: 1;
}

.plan-name ul {
	display: flex;
	flex-flow: wrap;
	gap: 5px;
}

.plan-name ul li {
	border: 1px solid var(--gold2);
	padding: 8px;
	line-height: 1;
	font-size: 0.9em;
}


.plan-det {
	border: 1px solid var(--gold2);
	margin: 0 0 80px;
}

.plan-det dt {
	background: var(--gold3);
	color: var(--gold);
	font-weight: bold;
	padding: 5px 10px;
	border-bottom: 1px dotted var(--gold2);
	font-size: 1.1rem;
}

.plan-det dd {
	padding: 10px;
	border-bottom: 1px dotted var(--gold2);
	font-size: 0.9rem;
	line-height: 1.3;
	display: flex;
	align-items: center;
	gap: 20px;
}

.plan-det dd strong {
	min-width: 6em;
}

@media screen and (max-width:520px) {
	.sec-plan-02 {
		padding: 40px var(--over-width-half);
	}

	.plan-name {
		--boxLR_w: 100%;
		--boxLR_m: 30px auto;
		--boxLR_gap: 20px;
		--boxLR_1_w: 100%;
		--boxLR_2_w: 100%;

		flex-flow: column-reverse;
	}

	.plan-name h3.titC {
		--titCm: 0 0 15px;
	}

	.plan-name h4 {
		--titBfz: 1.3rem;
	}

	.plan-name h5 {
		margin: 15px 0;
	}

	.plan-name ul {
		display: flex;
		flex-flow: wrap;
		gap: 5px;
	}

	.plan-name ul li {
		border: 1px solid var(--gold2);
		padding: 8px;
		line-height: 1;
		font-size: 0.9em;
	}


	.plan-det {
		border: 1px solid var(--gold2);
		margin: 0 0 80px;
	}

	.plan-det dt {
		background: var(--gold3);
		color: var(--gold);
		font-weight: bold;
		padding: 5px 10px;
		border-bottom: 1px dotted var(--gold2);
		font-size: 1.1rem;
	}

	.plan-det dd {
		padding: 10px;
		border-bottom: 1px dotted var(--gold2);
		font-size: 0.9rem;
		line-height: 1.3;
		display: flex;
		align-items: center;
		gap: 20px;
	}

	.plan-det dd strong {
		min-width: 6em;
	}
}


/**================================================== 
不動産事業
================================================== **/
.sec-land01{
  padding: 80px 0 0;
}
.sec-land01_inner{
  position: relative;
    display: flex;
    gap:40px;
    padding: 0 5% 0 var(--over-width-half);
    margin-bottom: -90px;
    z-index: 5;
}
.sec-land01_inner figure{
  padding: 30px;
  width: 45%;
  flex: none;
}
.sec-land01_inner figure img{
  width: 100%;
}
.sec-land01 picture{
  display: block;
  width: 100%;
  height: 600px;
  position: relative;
}
.sec-land01 picture img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sec-land01 picture:before{
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: #8a8a8a;
  mix-blend-mode:multiply;
  position: absolute;
  top:0;
  left:0;
  z-index: 2;
}

@media screen and (max-width: 520px) {
.sec-land01_inner{
    flex-flow: column;
    gap:15px;
    padding: 0 5%;
    margin-bottom: -30px;
}
.sec-land01_inner figure{
  padding: 0;
  width: 100%;
  margin: 0 auto;
}
.sec-land01 picture{
  height: 60vw;
}
}

.sec-land02 .list-num i{
  display: none;
}

.sec-land03{
  padding: 80px 0 1px;
}

@media screen and (max-width: 520px) {
.sec-land03{
  padding: 1px 0;
}
}

.sec-land03_picture{
  position: relative;
  display: grid;
  margin: 0 var(--over-width-half) 40px 0;
  grid-template-columns: 1fr 340px;
  grid-template-rows: 1fr 225px 225px;
      grid-template-areas:"p01 ."
  "p01 p02"
  "p01 p03";
  grid-template-columns: 1fr 340px;
  grid-template-rows: 1fr 1fr;
  grid-template-areas:
  "p01 p02"
  "p01 p03";
  gap: 30px;
}

.sec-land03_picture .h{
  position: absolute;
  top:30px;
  right:0;
  background: var(--gold);
  color: var(--white);
  font-size: 1.4rem;
  font-weight: bold;
  text-align: center;
  width: fit-content;
  padding: 15px 25px;
}
.sec-land03_picture figure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sec-land03_picture .p01{
  grid-area: p01;
}
.sec-land03_picture .p02{
  grid-area: p02;
}
.sec-land03_picture .p03{
  grid-area: p03;
}

@media screen and (max-width: 520px) {
.sec-land03_picture{
  position: relative;
  display: grid;
  margin: 0 5% 20px;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: none;
  grid-auto-rows: auto; 
  grid-template-areas:
  "h h"
  "p01 p01"
  "p02 p03";
  gap: 15px;
}

.sec-land03_picture .h{
  grid-area: h;
  position: relative;
  top:0;
  right:auto;
  left: -5%;
  font-size: 1rem;
  padding: 15px;
}
}

.sec-land04{
  padding-top: 80px;
}
.sec-land04 picture{
  display: block;
}

.sec-land04_madori{
  border: 1px solid var(--gold2);
  padding: 40px;
  margin: 40px auto;
  display: flex;
  align-items: center;
  gap:50px;
}
.sec-land04_madori picture{
  flex: 1;
}
.sec-land04_madori figure{
  width: 306px;
  flex: none;
}
.sec-land04_madori :is(picture,figure) img{
  width: 100%;
  height: auto;
}

@media screen and (max-width: 520px) {
  .sec-land04{
  padding-top: 40px;
}
.sec-land04_madori{
  padding: 15px;
  margin: 20px auto;
  flex-flow: column;
  gap:20px;
}
.sec-land04_madori figure{
  width: 70%;
  margin: 0 auto;
  flex: none;
}
}

.sec-land05{
  padding-top: 80px;
}
.sec-land05_picture{
  position: relative;
  display: grid;
  grid-template-rows: 540px 394px;
  grid-template-areas:
  "p01 p01 p02"
  "p03 p04 p04";
  gap: 30px;
  margin: 0 0 40px;
}
.sec-land05_picture img{
  height: 100%;
  width: auto;
  min-height:160px;
}
.sec-land05_picture .p01{
  grid-area: p01;
}
.sec-land05_picture .p02{
  grid-area: p02;
}
.sec-land05_picture .p03{
  grid-area: p03;
}
.sec-land05_picture .p04{
  grid-area: p04;
}
.sec-land05 .list-ansin{
  font-size: 1.2rem;
  color:var(--gold);
  line-height: 1.3;
  font-weight: bold;
  text-align: center;
}
.sec-land05 .list-ansin li{
  background: var(--gold3);
}
.sec-land05 .list-ansin figcaption{
  display: block;
  margin: 15px auto;
}

@media screen and (max-width: 520px) {
.sec-land05{
  padding-top: 40px;
}
 
 .sec-land05_picture{
  grid-template-rows: auto auto auto;
  grid-template-columns: repeat(3,auto);
  grid-template-areas:
  "p01 p01 p01"
  "p03 p03 p03"
  "p04 p04 p02";
  gap: 10px;
  margin: 0 0 20px;
} 
  
  .sec-land05_picture img{
    width: 100%;
    height: auto;
  }
  
}

.sec-land06{
  padding-top: 80px;
}

.sec-land06 .list-spec li{
  margin: 0 0 40px;
  padding: 0 0 20px;
  font-size: 0.9rem;
  box-shadow: 0 0 0 1px var(--gold);
}

.sec-land06 .list-spec h3{
  background: var(--gold);
  padding: 10px;
  color:var(--white);
  text-align: center;
  font-size: 1.1rem;
  font-weight: bold;
  margin: 0 0 10px;
}
.sec-land06 .list-spec img{
  display: block;
  margin: 15px 0;
  width: 100%;
  height: auto;
}
.sec-land06 .list-spec  p{
  padding: 0 15px;
}

@media screen and (max-width: 520px) {
.sec-land06{
  padding-top: 40px;
}
.sec-land06 .list-spec h3{
  font-size: 1rem;
}
.sec-land06 .list-spec li{
  margin: 0 0 15px;
  padding: 0 0 15px;
}
}

.sec-land07{
  margin-top: 80px;
  padding-top: 80px;
  padding-bottom: 80px;
}
.sec-land07_inner{
  margin: 40px auto;
  display: grid;
  grid-template-columns: 1fr 250px 515px;
  grid-template-areas: "t p01 p03 "
  "t p02 p03";
  gap: 15px;
  
  --titBbg:var(--gold);
  --titBc:var(--white);
  --titBta:center;
  --titBp:10px;
}
.sec-land07_inner .p01{
  grid-area: p01;
}
.sec-land07_inner .p02{
  grid-area: p02;
}.sec-land07_inner .p03{
  grid-area: p03;
}.sec-land07_inner .text{
  grid-area: t;
  margin: 0 30px 0 0;
}

@media screen and (max-width: 520px) {
.sec-land07{
  margin-top: 40px;
  padding-top: 40px;
  padding-bottom: 40px;
}
.sec-land07_inner{
  margin: 20px auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "t t "
  "p03 p03"
  "p01 p02";
  gap: 15px;
}
.sec-land07_inner .text{
  margin: 0 0 15px;
}
  
}
