@charset "UTF-8";
/* CSS Document */

h2{
	font-size:20px;
	margin-bottom:20px;
	color:#000;
  font-family: "fot-tsukuaoldmin-pr6n", sans-serif;
font-weight: 300;
font-style: normal;
}
h3{
font-size:16px;
margin-bottom:16px;
}


h4{
font-size:20px;
margin-bottom:10px;
font-weight:bold;
}
h5{
font-size:18px;
margin-bottom:10px;
font-weight:bold;
}
p{
line-height:2.0em;
}
strong{
font-weight:bold;
}
.right{
text-align:right;
}
.center{
text-align:center;
}
ul{
margin:0 0 16px 20px;
}
ul li{
	line-height:1.6em;
	margin-bottom:16px;
	list-style-type: disc;
}
ol{
margin:0 0 16px 40px;
}
ol li{
list-style-type: decimal;
line-height:2.0em;
margin-bottom:16px;
}
dt{
margin-bottom:8px;
}
dd{
margin-bottom:20px;
padding-left:8px;
}
table{
width:100%;
}
table th{
vertical-align:top;
}
@media only screen and (min-width: 768px) {
h2{
	font-size:28px;
	margin-bottom:0;
}
h3{
font-size:24px;
margin-bottom:32px;
}
h4{
font-size:24px;
}

}

.contents{
	display: flex;
	flex-wrap: wrap; /* flex-flow:column;はアイテムを縦に並べる */
}
.content{
	width:100%;
}
.contentsTitle{
	padding-bottom:30px;
	width:100%;
	text-align:center;
}
@media only screen and (max-width: 767px) {
.contentsTitle{
	/*height:100vh;*/
	padding-top:69px;
}
}
@media only screen and (min-width: 768px) {
.contents{
}
.contentsTitle{
	width:15%;
	height:100%;
	padding-bottom:0px;
writing-mode: vertical-rl;
/*text-orientation: upright;*/
display: flex;
  justify-content: center;
  align-items: center;
  position:fixed;
  z-index:-1;
}
.content{
	width:100%;
	padding-left:15%;
}
}
.mainimage{
display: flex;
  justify-content: center;
  align-items: center;
  padding-top:150px;
}
.mainimage_sp{
margin-bottom:65px;
position:relative;
}
.scroll{
	width:100%;
	-webkit-animation:blink 1.0s ease-in-out infinite alternate;
    -moz-animation:blink 1.0s ease-in-out infinite alternate;
    animation:blink 1.0s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0.3;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0.3;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0.3;}
    100% {opacity:1;}
}
@media only screen and (max-width: 767px) {
.mainimage{
	display:none;
}
}
@media only screen and (min-width: 768px) {
.mainimage_sp{
	display:none;
}
.scroll{
	display:none;
}
}

.contentBox{
	display: flex;
	flex-flow: column;/* flex-flow:column;はアイテムを縦に並べる */
  justify-content: center;
  align-items: center;
}
.contentBox .imgBox{
	padding-bottom:30px;
	width:100%;
	text-align:center;
}
.contentBox .textBox{
	padding-bottom:30px;
	width:100%;
}
@media only screen and (min-width: 768px) {
.contentBox{
	flex-flow: row;/* flex-flow:row;はアイテムを横に並べる */
}
.contentBox div.imgBox {
	flex: 0 0 500px;/* ウィンドウ幅に連動させず、幅340pxで固定 */
	order: 2;/* 回り込みを右へ */
}
.contentBox div.textBox {
	flex: 1 1 auto;/* ウィンドウ幅に連動して伸縮 */
	order: 1;/* 回り込みを右へ */
	padding-right:60px;
}
}

.contentBox2{
	display: flex;
	flex-flow: column;/* flex-flow:column;はアイテムを縦に並べる */
  justify-content: center;
  align-items: center;
}
.contentBox2 .imgBox{
	padding-bottom:30px;
	width:100%;
	text-align:center;
}
.contentBox2 .textBox{
	padding-bottom:30px;
	width:100%;
}
@media only screen and (min-width: 768px) {
.contentBox2{
	flex-flow: row;/* flex-flow:row;はアイテムを横に並べる */
}
.contentBox2 div.imgBox {
	flex: 0 0 500px;/* ウィンドウ幅に連動させず、幅340pxで固定 */
	order: 1;/* 回り込みを右へ */
}
.contentBox2 div.textBox {
	flex: 1 1 auto;/* ウィンドウ幅に連動して伸縮 */
	order: 2;/* 回り込みを右へ */
	padding-left:60px;
}
}

.about01{
display: flex;
  align-items: center;
	padding:70px 45px 40px;
}
.about01cont{
	text-align:center;
	width:100%;
}
.about02{
display: flex;
  align-items: center;
	padding:70px 45px 40px;
	font-size:16px;
}
.about03{
display: flex;
  align-items: center;
	padding:90px 45px 40px;
}
.about03cont{
	text-align:center;
	width:100%;
}
.about04{
	padding:70px 45px 40px;
}
.about04cont{
	display: flex;
	flex-wrap: wrap; /* flex-flow:column;はアイテムを縦に並べる */
}
.aboutBox{
	padding-bottom:30px;
	width:90%;
	margin:0 auto 20px;
}
.about05{
display: flex;
  align-items: center;
	padding:70px 45px 40px;
}
.about05cont{
	text-align:center;
	width:100%;
}
.about06{
display: flex;
  align-items: center;
	padding:70px 45px 40px;
	font-size:16px;
}

.about07,
.about09{
display: flex;
  align-items: center;
	padding:0px 0px 0px 20px;
}
.about07 .textBox,
.about09 .textBox{
	padding:0px 35px 0px;
}
.about08,
.about10{
display: flex;
  align-items: center;
	padding:0px 35px 0px 0px;
}
.about08 .textBox,
.about10 .textBox{
	padding:0px 20px 0px;
}

#about .textBox dt{
	color:#B6BC64;
	margin-bottom:10px;
	position:relative
}
#about .textBox dt:before{
	content:"●";
}

#about .textBox dd{
	margin:0 0 30px;
	padding:0;
}
.about11{
display: flex;
  align-items: center;
	padding:70px 45px 40px;
	font-size:16px;
}

@media only screen and (min-width: 768px) {
.about01{
	padding:400px 140px 0 40px;
}
.about02{
	padding:300px 140px 0 40px;
}
.about03{
	padding:500px 140px 0 40px;
}
.about04{
	padding:300px 140px 0 40px;
}
.aboutBox{
	padding:0 3% 0px;
	width:33.333%;
	margin:0 auto 20px;
}
.about05{
	padding:500px 140px 0 40px;
}
.about06{
	padding:300px 140px 0 40px;
}
.about07{
	padding:500px 140px 0 40px;
}
.about08{
	padding:200px 140px 0 40px;
}
.about09{
	padding:200px 140px 0 40px;
}
.about10{
	padding:200px 140px 200px 40px;
}
.about11{
	padding:300px 140px 0 40px;
}
.about01 p,
.about02,
.about03 p,
.about06{
	font-size:20px;
}

}
.charm01{
display: flex;
  align-items: center;
	padding:70px 45px 40px;
	font-size:16px;
}
.charm02{
display: flex;
  align-items: center;
	padding:70px 0px 0px 45px;
}
.charm04{
display: flex;
  align-items: center;
	padding:70px 0px 40px 45px;
}
.charm02 .textBox,
.charm04 .textBox{
	padding:20px 45px 0px 0;
}
.charm03{
display: flex;
  align-items: center;
	padding:70px 45px 0px 0px;
}
.charm03 .textBox{
	padding:20px 0px 0px 45px;
}

@media only screen and (min-width: 768px) {
.charm01{
	padding:400px 140px 0 40px;
	font-size:20px;
}

.charm02{
	padding:300px 140px 0 40px;
}
.charm03{
	padding:300px 140px 0 40px;
}
.charm04{
	padding:300px 140px 200px 40px;
}
}

#company{
}
.aboutus{
	padding:70px 45px 40px;
	width:100%;
}
#company dl{
	display: flex;
	flex-wrap: wrap; /* flex-flow:column;はアイテムを縦に並べる */
	width:100%;
}
#company dl dt{
	margin:0;
	padding:20px 12px 0px;
	border-top:1px solid #707070;
	width:100%;
}
#company dl dd{
	margin:0;
	padding:6px 12px 20px;
	width:100%;
}
#company dl dd:last-child{
	border-bottom:1px solid #707070;
}
.history{
	padding:70px 45px 40px;
	width:100%;
}
.history h3{
	text-align:center;
margin-bottom:40px;
}
@media only screen and (min-width: 768px) {
.aboutus{
	padding:100px 140px 0 40px;
}
#company dl dt{
	margin:0;
	padding:20px;
	width:40%;
}
#company dl dd{
	margin:0;
	padding:20px;
	width:60%;
	border-top:1px solid #707070;
}
#company dl dt:nth-last-child(2){
	border-bottom:1px solid #707070;
}
.history{
	padding:200px 140px 200px 40px;
}
.history h3{
margin-bottom:80px;
}
}

#info .contentsTitle{
	padding-top:120px;
}

.infoBlock{
	padding:70px 45px 40px;
}
@media only screen and (min-width: 768px) {
#info .contentsTitle{
	padding-top:120px;
}
.infoBlock{
	padding:100px 140px 200px 40px;
}
}

.newsList{
	padding:70px 45px 40px;
	width:100%;
}
.newsBox{
	padding:10px 0px;
}
.newsBox strong.date{
	font-weight:normal;
	display:block;
}
@media only screen and (min-width: 768px) {
.newsList{
	padding:100px 140px 200px 40px;
}
.newsBox{
	padding:15px 0px;
}
.newsBox strong.date{
	padding-right:40px;
	display:inline-block;
}
}

.newsCont{
	padding:10px 20px 40px;
}
.newsCont h3{
	padding:16px;
	border-bottom:1px solid #707070;
}
.newsCont p.date{
	text-align:right;
}
@media only screen and (min-width: 768px) {
.newsCont{
	padding:130px 40px 40px;
}
}
@media only screen and (max-width: 767px) {
#newsPage .contentsTitle{
	height:auto;
}
#newsPage .content{
	width:100%;
}
}

#contact{}
#contact .contentsTitle{
	padding-top:120px;
}

.contact_tel{
	padding:10px 45px 40px;
	width:100%;
}
.tel{
	color:#B6BC64;
	font-size:26px;
	text-align:center;
}
.tel a{
	color:#B6BC64;
	font-size:32px;
}
.status{
	text-align:center;
	padding:20px 0;
}
.gC iframe {
  width: 100%;
  height: 400px;
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
}

.contact_form{
	padding:10px 20px 40px;
	width:100%;
}
.flow{
	text-align:center;
	margin-bottom:40px;
}
table.tbl01 th{
	vertical-align:top;
	/*width:35%;*/
	padding:20px;
	display:flex;
  justify-content: space-between;
  align-items: center;
}
table.tbl01 td{
	padding:20px;
	width:65%;
}
input[type="text"] {
	width: 100%;
	background-color: #F2F2F2;
	color: #000;
	font-size: 1.0em;
	font-weight: bold;
	letter-spacing: 0.2em;
	border: 1px solid #707070;
	padding:10px 0;
}
input[type="email"] {
	width: 100%;
	background-color: #F2F2F2;
	color: #000;
	font-size: 1.0em;
	font-weight: bold;
	letter-spacing: 0.2em;
	border: 1px solid #707070;
	padding:10px 0;
}
textarea {
	width: 100%;
	background-color: #F2F2F2;
	color: #000;
	font-size: 1.0em;
	font-weight: bold;
	letter-spacing: 0.2em;
	border: 1px solid #707070;
	padding:10px 0;
}
#contact input.wpcf7-submit{
	width: 40%;
    height: 60px;
    background: #FFF;
    color: #000;
	border: 1px solid #707070;
    font-size: 20px;
    margin: 0 auto 16px;
    text-align: center;
  font-family: "fot-tsukuaoldmin-pr6n", sans-serif;
font-weight: 300;
font-style: normal;
}

#contact input.wpcf7-previous{
	width: 40%;
    height: 80px;
    background: #FFF;
    color: #000;
	border: 1px solid #707070;
    font-size: 20px;
    margin: 0 auto 16px;
    text-align: center;
  font-family: "fot-tsukuaoldmin-pr6n", sans-serif;
font-weight: 300;
font-style: normal;
}
div.wpcf7 .wpcf7-spinner {
    display: block;
}
.req{
	color:#FFF;
	padding:8px 12px;
	background-color:#409AD6;
}
.privacyform{
	text-align:center;
	padding:20px 0;
}
/*アコーディオン全体*/
.accordion-area{
    list-style: none;
    width: 96%;
    max-width: 900px;
    margin:0 auto;
	text-align:left;
}

.accordion-area li{
    margin: 10px 0;
}

.accordion-area section {
  border: 1px solid #ccc;
}

/*アコーディオンタイトル*/
h4.title {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-size:1rem;
    font-weight: normal;
    padding: 2% 3% 2% 50px;
    transition: all .5s ease;
	margin-bottom:0;
}

/*アイコンの＋と×*/
.title::before,
.title::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #333;
    
}
.title::before{
    top:48%;
    left: 15px;
    transform: rotate(0deg);
    
}
.title::after{    
    top:48%;
    left: 15px;
    transform: rotate(90deg);

}
/*　closeというクラスがついたら形状変化　*/
.title.close::before{
  transform: rotate(45deg);
}

.title.close::after{
  transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.box {
    display: none;/*はじめは非表示*/
  margin:0 3% 3% 3%;
    padding: 1%;
}
@media only screen and (max-width: 767px) {
#contact .contentsTitle{
	height:auto;
}
table.tbl01 tr{
display: block;
margin-bottom: 10px;}
table.tbl01 th{
	display:flex;
  justify-content: space-between;
  align-items: center;
width: 100%;
padding: 6px 4%;
border-bottom:none;}
table.tbl01  td{
display: block;
width: 100%;
padding: 2px 4% 16px;
	border-top: none;
}
}
@media only screen and (min-width: 768px) {
#contact .content{
	padding-top:150px;
}
.contact_tel{
	padding:0px 60px 120px;
}
.contactTxt{
	text-align:center;
	margin-bottom:40px;
}
.tel{
	color:#B6BC64;
	font-size:24px;
}
.tel a{
	font-size:44px;
}
.status{
	padding:60px 0;
}
  .gC iframe {
  width:80%;
	height: 600px;
  }

.contact_form{
	padding:0px 60px 120px;
}
.flow{
	margin-bottom:80px;
}
#contact input.wpcf7-submit{
	width: 40%;
	margin:0 10px 10px;
    height: 80px;
}
#contact input.wpcf7-previous{
	width: 40%;
	margin:0 10px 10px;
}
.privacyform{
	padding:60px 0;
}

}

#access{
	display: flex;
	flex-wrap: wrap; /* flex-flow:column;はアイテムを縦に並べる */
  align-items: center;
	background: linear-gradient(to bottom, transparent 0%, #FFF 10%, #FFF 100%);
	z-index:2;
}
.accessTitle{
	padding-bottom:30px;
	width:100%;
	text-align:center;
}
.map {
  width: 100%;
  position: relative;
  padding-top: 46.25%;
  margin-bottom:30px;
}

.map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
}
@media only screen and (max-width: 767px) {
.accessTitle{
	/*height:100vh;*/
	padding-top:90px;
}
.accessCont{
	width:100%;
}
.accessCont p{
	margin-left:20px;
}
}
@media only screen and (min-width: 768px) {
#access{
}
.accessTitle{
	width:15%;
	height:100%;
	padding-bottom:0px;
writing-mode: vertical-rl;
/*text-orientation: upright;*/
display: flex;
  justify-content: center;
  align-items: center;
}
.accessCont{
	width:85%;
	height:100%;
}
}

p.cc{
	margin:0;
	padding:10px;
	text-align:right;
	font-size:10px;
}

/* fadeUp */

.fadeUp{
animation-name:fadeUpAnime;
animation-duration:1.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}


/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
 
.fadeUpTrigger{
    opacity: 0;
}
.fadeUpTrigger2{
    opacity: 0;
}
.fadeUpTrigger3{
    opacity: 0;
}
.fadeUpTrigger4{
    opacity: 0;
}
.fadeUpTrigger5{
    opacity: 0;
}