@charset "UTF-8";

.sp-slide.sp-selected {opacity:1 !important;}
.sp-slide {opacity:0.3 !important;}
.sp-button { background-color: #e8e8e8; border: none;}
.sp-selected-button {background-color: #003874; border: none;}

#slide{
	width: 100%;
	margin: 0;
	padding:0;
	position:relative;
}

/*#slide .theme{
	position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  margin:0;
  padding:0;
	z-index: 67712;
}
#slide .theme img {
  width: 50%;
	height: auto;
}
*/


#index{
}
#index h2 {
  font-size: 2em;
  line-height: 1;
  text-align: center;
	color: #6a533b;
	font-family: 'Gilda Display', cursive, "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin-bottom: 0.5em;
	font-weight: 600;
}

#index h2 span {
  font-size: 14px;
  margin-top: 1em;
  align-items: center;
  display: flex;
  justify-content: center;
	color: #b4751e;
	font-family: "Noto Sans", "YakuHanJP_Narrow", sans-serif;
	font-style: italic;
	font-weight: 400;
}
#index h2 span::before,
#index h2 span::after {
  background-color: #6a533b;
  content: "";
  height: 1px;
  width: 50px;
}
#index h2 span::before {margin-right: 1em;}
#index h2 span::after {margin-left: 1em;}

#index h3 {
  font-size: 1.5em;
  text-align: left;
	margin-bottom: 0.3em;
	font-weight: 600;
}




/*mission*/
#index #mission{
	background: url("../img/index/mission.png") no-repeat top center;
	background-size: 500px 500px;
	padding: 5% 0;
}
#index #mission p{
	font-size: 1em;
}


/*recruit*/
#index #recruit{
	background: url("../img/index/recruit.jpg") no-repeat top center;
	background-size:cover;
	min-height: 400px;
  align-items: center;
  display: flex;
  justify-content: center;
}
#index #recruit h3{
	color: #fff;
	font-family: "Noto Sans", "YakuHanJP_Narrow", sans-serif;
	font-weight: 900;
  font-size: 2em;
	/* 横に3px 縦に3px ぼかし5px 影の色#9a8a87 4つ重ねて濃く */
	text-shadow: 3px 3px 6px #666, -3px -3px 6px #666, -3px 3px 6px #666, 3px -3px 6px #666;
	margin-bottom: 0.5em;
  text-align: center;
}
#index #recruit .button{
	font-size: 1em;
}
#index #recruit .button a {
  background-color: #b4751e;
  border: #b4751e solid 1px;
}
#index #recruit .button a:hover {
  color: #b4751e;
  background-color: #fff;
}

/*service*/
#index #service{
	background: linear-gradient(110deg, #fff, #efe4d4);
	padding: 5% 0;
}
#index #service article{
  display: flex;
  justify-content: space-between;
  max-width: 1000px;
  margin: auto;
  align-items: center;
}
#index #service article p{
  font-size: 18px;
  line-height: 1.8;
}
#index #service article img{
  width: 100%;
  height: auto;
}
#index #service article.reverse{
  flex-direction: row-reverse;
}
#index #service .column{
  width: 50%;
}

.columnL{
	margin-right: 10%;
}
.columnR{
	margin-left: 10%;
}
/*右側へ要素を広げる（2カラム）*/
.column-outside-right{
    flex: 1;
    margin-right: calc(50% - 50vw);
    margin-left: 0;
}


/*左側へ要素を広げる（2カラム）*/
.column-outside-left{
    flex: 1;
    margin-left: calc(50% - 50vw);
    margin-right: 0;
}

#index #service .button{
	display: inline;
	margin: auto 1%;
}

#index #service .button a{padding: 0.4em 3em;}



/*access*/
#index #access{
	padding: 5% 0 10% 0;
}
#index #access p{
	line-height: 1.5;
	margin:2% 0;
}


/* ここからタブ
--------------------------------------------------------------------------------------*/
/* 
--------------------------------------------------------------------------------------*/

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

}


/* ここからスマホ
--------------------------------------------------------------------------------------*/
/* 
--------------------------------------------------------------------------------------*/

@media only screen and (max-width: 481px) {
#index{
}

#index h2 {
  font-size: 1.5em;
  /*line-height: 1;
  text-align: center;
	color: #6a533b;
	font-family: 'Gilda Display', cursive, "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin-bottom: 0.5em;
	font-weight: 600;*/
}
/*
#index h2 span {
  font-size: 14px;
  margin-top: 1em;
  align-items: center;
  display: flex;
  justify-content: center;
	color: #b4751e;
	font-family: "Noto Sans", "YakuHanJP_Narrow", sans-serif;
	font-style: italic;
	font-weight: 400;
}

#index h2 span::before,
#index h2 span::after {
  background-color: #6a533b;
  content: "";
  height: 1px;
  width: 50px;
}
#index h2 span::before {margin-right: 1em;}
#index h2 span::after {margin-left: 1em;}

*/

#index h3 {
  font-size: 1.2em;
  text-align: left;
	margin-bottom: 0.3em;
	font-weight: 600;
}

/*mission*/
#index #mission{
	background: url("../img/index/mission.png") no-repeat top center;
	background-size: 75% auto;
	margin: 5% 0 0 0;
	padding: 10% 5% 15% 5%;
}
/*
#index #mission p{
	font-size: 1em;
}
*/

	
/*recruit*/
#index #recruit{
	background: url("../img/index/recruitS.jpg") no-repeat top center;
	background-size:100% auto;
	min-height: 180px;
  align-items: center;
  display: flex;
  justify-content: center;
	margin: 5% 5% 15% 5%;
}	
#index #recruit h3{
	color: #fff;
  font-size: 1.5em;
	text-shadow: 2px 2px 4px #9a8a87, -2px -2px 4px #9a8a87, -2px 2px 4px #9a8a87, 2px -2px 4px #9a8a87;
	margin-bottom: 0.5em;
  text-align: center;
}

/*

#index #recruit .button a {
  background-color: #b4751e;
  border: #b4751e solid 1px;
}
#index #recruit .button a:hover {
  color: #b4751e;
  background-color: #fff;
}
*/



/*service*/
#index #service{
	background: linear-gradient(110deg, #fff, #efe4d4);
	padding: 10% 0 10% 0;
}
#index #service article{
  display: block;
/*  justify-content: space-between;
  margin: auto;
  align-items: center;
	*/
  max-width:inherit;
}

#index #service article p{
font-size: 16px;
  line-height: 1.8;
}
#index #service article img{
  width: 100%;
  height: auto;
}
#index #service article.reverse{
  flex-direction: row-reverse;
}
#index #service .column{
  width: 100%;
}
#index #service .column._column{
  width: 90%;
	padding: 10% 5% 10% 5%;
}
	
/*右側へ要素を広げる（2カラム）
.column-outside-right{
    flex: 1;
    margin-right: calc(50% - 50vw);
    margin-left: 0;
}
*/
/*左側へ要素を広げる（2カラム）
.column-outside-left{
    flex: 1;
    margin-left: calc(50% - 50vw);
    margin-right: 0;
}*/

/*右側へ要素を広げる（1カラム）
.outside-right{
  margin-right: calc(50% - 50vw);
}*/

/*左側へ要素を広げる（1カラム）
.outside-left{
  margin-left: calc(50% - 50vw);
}
#index #service .button{
	display: inline;
	margin: auto 0.5%;
}
*/


#index #service .button a{padding: 0.2em 1.5em;}
	
	
}