@charset "UTF-8";
/* CSS Document */
/* CSS Document */
.subpage .article {
  text-align: left;
}
.subpage .article strong {
  color: #ba9132;
}
.subpage .article .greet {
  margin: 0 10px;
}
.subpage .article .greet .ph {
  margin-right: 20px;
  float: right;
  width: 40%;
  margin: 0 0 10px 10px;
}
.subpage .article .greet .ph img {
  width: 100%;
}
.subpage .article .greet p {
  text-align: left;
  font-size: min(2rem, 3.8vw);
}
@media (min-width: 768px) {
  .subpage .article .greet {
    display: flex;
    flex-direction: row-reverse;
  }
  .subpage .article .greet .ph {
    margin-right: 20px;
    width: 100%;
    margin: 0 10px 10px  0;
  }
  .subpage .article .greet .ph img {
    width: 100%;
  }
  .subpage .article .greet p {
    text-align: left;
    font-size: 1.8rem;
  }
}
.subpage .article .company_overview {
  display: flex;
  flex-direction: column;
}
.subpage .article .company_overview .flex_dl {
  font-size: min(2rem, 3.8vw);
  margin: 10px;
}
.subpage .article .company_overview .flex_dl dl {
  display: flex;
  padding: 0;
  margin: 0 0 5px;
}
.subpage .article .company_overview .flex_dl dl dt {
  width: 6em;
}
.subpage .article .company_overview .flex_dl dl dd {
  width: calc(100% - 7em);
}
.subpage .article .company_overview .ph {
  margin: 0 10px;
}
.subpage .article .company_overview .ph img {
  width: 100%;
}
@media (min-width: 768px) {
  .subpage .article .company_overview {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }
  .subpage .article .company_overview .flex_dl {
    width: 90%;
    font-size: 1.8rem;
  }
  .subpage .article .company_overview .flex_dl dl {
    display: flex;
    padding: 0;
    margin: 0 0 5px;
  }
  .subpage .article .company_overview .flex_dl dl dt {
    width: 6em;
  }
  .subpage .article .company_overview .flex_dl dl dd {
    width: calc(100% - 7em);
  }
  .subpage .article .company_overview .ph {
    width: 50%;
  }
  .subpage .article .company_overview .ph img {
    width: 100%;
  }
}
.subpage .article .history .flex_dl {
  font-size: min(2rem, 3.8vw);
}
.subpage .article .history .flex_dl dl {
  display: flex;
  padding: 0 0 10px;
  margin: 0 0 5px;
  border-bottom: 1px dotted #646464;
}
.subpage .article .history .flex_dl dl dt {
  width: 10em;
}
.subpage .article .history .flex_dl dl dd {
  width: calc(100% - 11em);
}
@media (min-width: 768px) {
  .subpage .article .history .flex_dl {
    font-size: 1.8rem;
  }
  .subpage .article .history .flex_dl dl {
    display: flex;
    padding: 0 0 10px;
    margin: 0 0 5px;
  }
  .subpage .article .history .flex_dl dl dt {
    width: 9em;
  }
  .subpage .article .history .flex_dl dl dd {
    width: calc(100% - 10em);
  }
}
.subpage .article ul.maru {
  font-size: min(2rem, 3.8vw);
}
.subpage .article ul.maru > li {
  list-style-type: none;
}
.subpage .article ul.maru > li::before {
  content: "○";
}
.subpage .article ul.maru > li ol {
  counter-reset: my-counter;
  list-style: none;
  padding: 0 0 0 1em;
  margin: 0;
}
.subpage .article ul.maru > li ol > li {
  line-height: 1.5;
  padding-left: 30px;
  position: relative;
}
.subpage .article ul.maru > li ol > li::before {
  content: counter(my-counter);
  counter-increment: my-counter;
  background-color: #fff;
  border: 1px solid #333;
  border: 1px solid;
  border-radius: 50%;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 1.2em;
  width: 1.2em;
  color: #000;
  font-size: 85%;
  line-height: 1;
  position: absolute;
  top: 4px;
  left: 0;
  margin: auto;
}
.subpage .article li ul {
  padding: 0 0 0 2em;
}
.subpage .article .tokuteikasan h2 {
  background: #ba9132;
  color: #fff;
  font-size: 2rem;
  text-align: center;
  display: block;
  padding: 10px 60px;
  margin: auto;
  width: 20em;
  max-width: calc(100% - 20px);
}
.subpage .article .tokuteikasan p {
  text-align: center;
}
.subpage .article .box {
  background: #fffacd;
  padding: 20px;
  border-radius: 8px;
  margin: 0 auto 40px;
  max-width: calc(100% - 20px);
}
.subpage .article .box dl dt {
  font-size: 1.8rem;
}
.subpage .article .box dl dd {
  font-size: 1.6rem;
  margin-left: 40px;
}

.icon {
  grid-area: icon;
}

.name {
  grid-area: name;
}

.ph {
  grid-area: ph;
}

.text {
  grid-area: text;
}

.floor {
  width: 100%;
  max-width: 970px;
  margin: auto;
  margin-bottom: 80px;
}
.floor .article {
  border-top: 1px solid #ba9132;
  padding: 20px 0;
  margin: 20px auto;
  width: calc(100% - 20px);
}
.floor .article .grid_container {
  display: grid;
  grid-template-columns: 80px auto;
  grid-template-rows: auto auto;
  gap: 10px 10px;
  grid-auto-flow: row;
  align-items: center;
  grid-template-areas: "icon name " "text text";
}
.floor .article .icon {
  grid-area: icon;
}
.floor .article .icon img {
  width: 100%;
}
.floor .article .text {
  grid-area: text;
  font-size: 1.4rem;
}
.floor .article .text img {
  float: right;
  width: 50%;
  margin: 0 0 5px 5px;
}
.floor .article .name {
  grid-area: name;
}
.floor .article .name h1 {
  font-size: 2rem;
  color: #ba9132;
  line-height: 1.2;
}
.floor .article .ph {
  grid-area: ph;
}
.floor .article .ph img {
  width: 100%;
}
.floor .article .floor_ph {
  width: max-content;
  max-width: calc(100% - 20px);
  margin: auto;
}
.floor .article .floor_ph img {
  width: 100%;
}
.floor .article .floor_ph .btn {
  background: rgba(186, 145, 50, 0.5);
  display: block;
  color: #fff;
  text-align: center;
  padding: 8px;
  font-size: 2.0rem;
  border-radius: 4px;
  text-decoration: none;
}

@media (min-width: 768px) {
  .floor {
    width: 100%;
    max-width: 970px;
    margin: auto;
    margin-bottom: 80px;
  }
  .floor .article {
    border-top: 1px solid #ba9132;
    padding: 20px 0;
    margin: 20px auto;
  }
  .floor .article .grid_container {
    display: grid;
    margin-bottom: 40px;
    grid-template-columns: 120px auto minmax(100px, 50%);
    grid-template-rows: auto auto;
    gap: 0px 10px;
    grid-auto-flow: row;
    grid-template-areas: "icon name ph" "text text ph";
  }
  .floor .article .icon {
    grid-area: icon;
  }
  .floor .article .name {
    grid-area: name;
  }
  .floor .article .name h1 {
    font-size: min(2.6rem, 2.6vw);
    color: #ba9132;
    line-height: 1.5;
  }
  .floor .article .ph {
    grid-area: ph;
  }
  .floor .article .text {
    grid-area: text;
    font-size: 1.8rem;
  }
  .floor .article .floor_ph {
    width: max-content;
    max-width: calc(100% - 20px);
    margin: auto;
  }
  .floor .article .floor_ph img {
    width: 100%;
  }
  .floor .article .floor_ph .btn {
    background: rgba(186, 145, 50, 0.5);
    display: block;
    color: #fff;
    text-align: center;
    padding: 10px;
    font-size: 2.6rem;
    border-radius: 4px;
    text-decoration: none;
  }
}
/*
.flex_box{
	@include content-width();
	display: flex;
	flex-direction: column;
	.box{
		padding: 10px 0 0;
		width: calc(100% );
		background: $base_color;
		margin: 1px auto;
		color: #fff;
		font-size: 1.4rem;
		h2{
			font-size:2.4rem; 
			text-align: center;
		}
		p{
			padding:5px 20px;
		}
		img{
			display: block;
			margin:5px auto;
		}
		&:nth-child(2){
			background: lighten($base_color,10%);
		}
	}
}


.photo_box{
	margin-bottom: 60px;
	background-size: auto auto;
	background-color: rgba($base_color,70%);
	background-image: repeating-linear-gradient(0deg, transparent, transparent 6px, rgba(255, 255, 255, 0.5) 6px, rgba(255, 255, 255, 0.5) 7px );
	.inner{
		@include content-width();
		display: flex;
		flex-wrap: wrap;
		p{
			width: calc(100% / 3);
			display: block;
			img{
				display: block;
				width: 100%;
			}
		}
	}
}
.bana_box{
	ul{
		display: flex;
		justify-content: center;
		align-items: center;
		list-style-type: none;
		margin: 10px;
		img{
			width: 100%;
		}

	}
	p{
		text-align: center;
		line-height: 1.2;
		a{
			background: $base_color;
			color: #fff;
			display: inline-block;
			font-size: 2.4rem;
			text-decoration: none;
			padding: 5px 50px;
			border-radius: 2em;
			margin: 10px auto;
		}
	}
}

.news{
	border-top:30px solid rgba($base_color,45%);
	background: rgba($base_color,10%);
	padding: 30px 0;
	.inner{
		@include content-width(calc(100% - 20px));
		dl{
			display: flex;
			flex-direction: column;
			line-height: 2;
			padding: 5px 0;
			dt{
				padding: 0;
				margin-right: 10px;
			}
			dd{
				padding: 0;
				a{
					color: #000;
				}
			}
		}
		p.link{
			text-align: right;
			a{
				display: inline-block;
				text-decoration: none;
				background: rgba($base_color,50%);
				color: #000;
				padding: 3px 10px;
				border-radius: 4px;
			}
		}
		
	}
}

.article{
	text-align: center;
	margin-bottom: 50px;
	h2{
		font-size: min(4.8rem,5vw);
		text-align: center;
		color: $base_color;
	}
	p{
		font-size: 2rem;
		font-size: min(2rem,3.5vw);
		line-height: 2;
	}
	.btn_block{
		a{
			background: rgba($base_color,50%);
			text-decoration: none;
			color:#fff;
			width: calc(100% - 20px);
			font-size: 2rem;
			padding: 5px 0;
			margin: 10px auto;
			text-align: center;
			display: inline-block;
			border-radius: 4px;
			
		}
	}
}
.category_icon {
	font-size: 1.2rem;
	padding: 3px 10px;
	margin-right: 1em;
	border-radius: 20px;
  i {
    font-style: normal;
	}
}

@media (min-width: 768px) {
.flex_box{
	@include content-width(calc(100% - 20px));
	display: flex;
	flex-direction: row;
	margin-top: -50px;
	margin-bottom: 30px;
	.box{
		padding: 30px 0 0;
		width: 33%;
		background: $base_color;
		margin: 1px;
		color: #fff;
		font-size: 1.4rem;
		h2{
			font-size:2.4rem; 
			text-align: center;
		}
		p{
			padding: 20px;
		}
		img{
			display: block;
			margin:10px auto;
		}
		&:nth-child(2){
			background: lighten($base_color,10%);
		}
	}
}
	
.news{
	border-top: 60px solid rgba($base_color,45%);
	.inner{
		
		font-size: 1.8rem;
		dl{
			display: flex;
			flex-direction: row;
			line-height: 2;
			padding: 5px 0;
			dt{
				padding: 0;
				margin-right: 10px;
			}
			dd{
				padding: 0;
			}
		}
	}

}
	
.article{
	text-align: center;
	margin-bottom: 50px;
	h2{
		font-size: min(4rem,4vw);
		text-align: center;
		color: $base_color;
	}
	p{
		font-size: 2rem;
		font-size: min(2rem,2vw);
	}
	.btn_block{
		display: flex;
		justify-content: center;
		div{
				width: 380px;
				max-width: 49%;
			a{
				background: rgba($base_color,50%);
				text-decoration: none;
				font-size: 2.6rem;
				padding: 5px 0;
				margin:50px 10px;
				text-align: center;
				display: inline-block;
				border-radius: 4px;
			}
			img{
				display: block;
				width: 100%;
			}
		}
	}
}
	
	
	
}
*/