@charset "UTF-8";

@media screen and (min-width: 641px) {
html {
    font-family: "yuGothic", sans-serif;
    box-sizing: border-box;
}
.header0 {
  position: relative;
  
  overflow: hidden;
  width: 1024px;
  height: 150px;
  
}

.header0  img{
  
  position: absolute;
  top: 45%;
  left: 30%;
  transform: translate(-20%, -40%);
  justify-content: center;
  width: 45vw;
  height: auto;
}

.header {
  
  
  
  height: 30px;
  /*background-color: #191970;*/
  background-color: white;
   text-align: center;
  padding-top: 10px;
  padding-left: 0px;
　/*font-family: "Seymour One", sans-serif;*/
  /*font-family: ’Alegreya Sans SC’, sans-serif;*/
　font-family: 'Kaushan Script', cursive;
  font-size: 40px;
  color: black;
  /*color: #eee;*/
  line-height: 100px;
  letter-spacing: 1px;
 
}




.menu {
     display: block;
    height: 60px;
    background-color: white;
    /*background-color: #87ceeb;*/
}
.menu ul {
  display: flex;
  
  justify-content: center;
}
.menu a {
  color: #1e366a;
  color: black;
 
  padding: 0.5em 0.5em 0.5em 0.5em;
}

.menu li {
    list-style: none;
    margin: 0 25px;
    line-height: 30px;
}

.iframe-wrap {
  position: relative;
  width: 80%;
  padding: calc(400 / 760 * 100%) 0 0;
}
 
.iframe-wrap iframe {
  position: absolute;
  top: 15%;
  left: 18%;
  width: 90%;
  height: 70%;
}



/*2021/8/22追加*/
h1, h2 {
  color:black;
  text-align: left;
  font-family:  serif;
  letter-spacing: 0.2rem;
}

.slideshow-container img {
  
  width: 700px;
  height: auto;
  margin-left:0px;
}

.slideshow-container {
  width: 900px;
  height: auto;
  margin: 10px auto 10px auto;
  font-size: 20px;
}

button {
  margin: auto;
  display: block;
  font-size: 20px;
  background-color: white;
  font-family:  serif;
}






.video {
    padding-top: 1px;
    margin-top:1%;
    margin-left:20%;
    margin-bottom:6%;
    width:60vw;
    height:auto;
    color: #191970;
    text-align: center;
    /*font-size: 0.8rem;*/
    background-color: #FFFFFF;
    /*background: url('images/p19.jpg') fixed;*/
    background-repeat:no-repeat;
    background-position: center;
    background-size: cover;
    background-color:rgba(255,255,255,0.3);
    background-blend-mode:lighten;
    /*background-size: 1150px;*/

}




.greeting1{
  /*display: flex;*/
  padding:0 30px;
  margin: 15px;
  justify-content: center;
  
  /*垂直方向で、要素を中央に配置します。*/
 /* align-items:center;*/
	/*flex-wrap:wrap;*/
}

.greeting1 li img {
	width:25%; /*画像のはみだしを防ぐ*/
	height: auto;
	/*width:50%; */
	
	/*height: auto; */
	border:solid 1px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場合*/
}


.greeting{
    /*height: calc(100vh - 140px);*/
   margin:0px 50px;
    line-height: 40px;
    color: #191970;
    text-align: left;
    font-size: 1.6vw;
    padding-left: 150px;
    padding-right: 200px;
    

}



.history{
    /*height: calc(100vh - 140px);*/
    margin-left:10%;
    margin-right:10%;
    color: black;
    /*color: #191970;*/
    

    text-align: left;
    font-size: 1.6rem;
    line-height: 50px;
    /*padding-left: 100px;*/
    background-size   :30% 10%;
    background: url('images/company1.jpg') fixed;
     background-repeat:no-repeat;
     background-position: center;
    background-size: cover;
     
     /*下２行は半透明のコード*/
     background-color:rgba(255,255,255,0.6);
     
      /*background-blend-mode:normal;*/
     background-blend-mode:lighten;
  
}

.history1{
  display: flex;
  justify-content: center;
  
  /*垂直方向で、要素を中央に配置します。*/
  align-items: center;
	flex-wrap:wrap;

}

.history1 li{
  
	padding:0 10px;/*←画像の左右に5pxの余白を入れる場合*/
	margin: 5px;
	box-sizing:border-box;
	list-style-type:none; background-image:none; padding-left:0; 
 /*text-align: center;*/
}

.history1 li img {
	max-width:100%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
	border:solid 0px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場合*/
}

.facility{
  display: flex;
  justify-content: center;
  
  /*垂直方向で、要素を中央に配置します。*/
  align-items: center;
	flex-wrap:wrap;

}

.facility li{
  /*←画像を横に4つ並べる場合*/
  /*width: calc(100%/5);*/
	padding:0 0px;/*←画像の左右に5pxの余白を入れる場合*/
	margin: 30px;
	box-sizing:border-box;
	list-style-type:none; background-image:none; padding-left:0; 
 text-align: center;
}

.facility li img {
	max-width:80%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
	border:solid 0px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場合*/
}



.picture{
  display: flex;
  justify-content: center;
  
  /*垂直方向で、要素を中央に配置します。*/
  align-items: center;
	flex-wrap:wrap;
 
}


.picture li{
  width: calc(100%/3);
	padding:0 10px;
	margin: 5px;
	box-sizing:border-box;
	list-style-type:none; background-image:none; padding-left:0; 
 /*text-align: center;*/
}

.picture li img {
	max-width:100%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
	border:solid 0px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場合*/
}

.work{
  display: flex;
  padding:0 30px;
  margin: 25px;
  justify-content: center;
  
  /*垂直方向で、要素を中央に配置します。*/
  align-items: center;
	flex-wrap:wrap;
}

.work li{
  
	padding:30px;/*←画像の左右に5pxの余白を入れる場合*/
	margin: 10px;
	box-sizing:border-box;
	list-style-type:none; background-image:none; padding-left:0; 
  text-align: center;
}

.work li img {
  
	max-width:80%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
	
	border:solid 0px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場合*/
}

.efforts{
  display: flex;
  justify-content: center;
  
  /*垂直方向で、要素を中央に配置します。*/
  align-items: center;
	flex-wrap:wrap;

    /*height: calc(100vh - 140px);*/
    /*color: #191970;*/
    /*text-align: left;*/
    /*font-size: 1.3rem;*/
    /*line-height: 50px;*/
    /*padding-left: 100px;*/
    /*background-size   :50% 10%;*/
    
  

}



p{
  font-size:2.5vw;
  color: #000;
  text-align: center;
  font-family:"ヒラギノ明朝 Pro W6",serif;
}

p1{
  font-size:25px;
   
  text-align: right;
  font-family:"ヒラギノ明朝 Pro W6",serif;
}

p2{
  
  font-family:"ヒラギノ明朝 Pro W6",serif;
}

h2 {
    text-align: center;
    color: #000;
     font-family:"ヒラギノ明朝 Pro W6",serif;
}

h4 {
    text-align: center;
    color: #000;
     font-family:"ヒラギノ明朝 Pro W6",serif;
}

table {
  border-collapse: collapse;
  margin: 0 auto;
  padding: 0;
  width: 850px;
  table-layout: auto;
  /*table-layout: fixed;*/
  color: #000;
  font-size:1.3vw;
}

table th {
  padding: 15px 0;
  border-right: 1px solid #bbb;
  text-align: center;
}

table tr {
  background-color: #fff;
  padding: 30px;
  border-bottom: 1px solid #bbb;
}

table tr:last-child{
   border-bottom: none
}

table td {
  padding: 1em 10px 1em 1em;
  border-right: 1px solid #bbb;
  text-align: center;
}

table th:last-child,
table td:last-child{
  border: none;
}

.access {

margin:1%;    
height: 0;
overflow: hidden;

padding-bottom: 56.25%;
position: relative;
}

.access iframe {
margin:1%;
position: absolute;
left: 25%;
top: 45%;
bottom:10%;
height: 50%;
width: 50%;
}

.access  img{
  max-width:100%;
  margin:1%;
position: absolute;
left: 25%;
top: 1%;


  
  width: 50%;
  height: auto;
}
  
   
     

}

.footer {
    width:auto;
   margin:1%;
    height: 50px;
    text-align: center;
    color: white;
    background-color:#191970;
}






body {
    text-align: center;
    color: rgb(255, 255, 255);
    font-size: 1.3vw;
    /*background-color: #194680;*/
    /*background-color: white;*/
    padding-top: 20px;
}

#contact-form {
    margin: auto;
     background-color:#191970;
    text-align: left;
    padding: 20px;
    max-width: 630px;
    border: black solid 2px;
    border-radius: 10px;
}

button {
    text-align: center;
    margin-top: 20px;
    font-size: 18px;
    color:black;
    border: white solid 2px;
    background-color: white;
    border-radius: 5px;
}

.button-wrapper {
    text-align: center;
}

input,
textarea {
    width: 615px;
}

textarea {
    height: 200px;
    padding: 5px;
}

input {
    height: 70px;
}


span {
display: inline-block;
width: 9em;
}

span1 {
display: inline-block;
width: 5em;
}  


/*@media screen and (max-width: 640px) {*/
 @media screen and (max-width: 480px) {
   
  body{
     font-size: 3vw;
   }
   .video {
    padding-top: 50px;
    margin:5%;
    width:95vw;
    height:auto;
    color: #191970;
    text-align: center;
    /*font-size: 0.8rem;*/
    background-color: #FFFFFF;
    background: url('images/p19.jpg') fixed;
    background-repeat:no-repeat;
    background-position: center;
    background-size: cover;
    background-color:rgba(255,255,255,0.7);
    background-blend-mode:lighten;
    /*background-size: 1150px;*/

}
  
  /*2/1〜編集する*/
html {
    font-family: "yuGothic", sans-serif;
    box-sizing: border-box;
}
.header0 {
  position: relative;
  
  overflow: hidden;
  max-width: 100%;
  height: 50px;
  
}

.header0  img{
  
  position: absolute;
  top: 40%;
  left: 22%;
  transform: translate(-20%, -40%);
  justify-content: center;
  width:60vw;
  /*width: 100%;*/
  height: auto;
}

/*.header {*/
  
  
  
/*  height: 30px;*/
  /*background-color: #191970;*/
/*  background-color: white;*/
/*   text-align: center;*/
/*  padding-top: 10px;*/
/*  padding-left: 0px;*/
　/*font-family: "Seymour One", sans-serif;*/
  /*font-family: ’Alegreya Sans SC’, sans-serif;*/
/*　font-family: 'Kaushan Script', cursive;*/
/*  font-size: 40px;*/
/*  color: black;*/
  /*color: #eee;*/
/*  line-height: 100px;*/
/*  letter-spacing: 1px;*/
 
/*}*/








.menu {
     
     /*display: block;*/
    /*height: 150px;*/
    background-color: white;
    /*background-color: #87ceeb;*/
}
.menu ul {
  background-color: #F7F6F4;
  /*display: flex;*/
  text-align: left;
  /*justify-content: center;*/
  
  
}
.menu a {
  /*color: #1e366a;*/
  color: black;
 /*color: white;*/
   font-size:12px; 
  padding: 0.5em 0.5em 0.5em 0.5em;
}

.menu li {
    
    /*display:inline;*/
    /*float:none;*/
    /*font-size:8px;*/
    font-family:"ヒラギノ明朝 Pro W6",serif;
    /*list-style: none;*/
    margin: 0 100px;
    line-height: 30px;
}

.iframe-wrap {
  position: relative;
  width: 100%;
  padding: calc(400 / 760 * 100%) 0 0;
}
 
.iframe-wrap iframe {
  position: absolute;
  top: 1%;
  left: 10%;
  width: 80%;
  height: 80%;
}


h1, h2 {
  
  font-size:13px;
  line-height:20px;
  color:black;
  text-align: center;
  font-family:  serif;
  letter-spacing: 0.2rem;
}

.slideshow-container img {
  
  width: 350px;
  height: auto;
  margin-left:0px;
}

.slideshow-container {
  width: 380px;
  height: auto;
  margin: 0px auto 0px auto;
}


.video {
    padding-top: 50px;
    margin:5%;
    width:90vw;
    height:auto;
    color: #191970;
    text-align: center;
    /*font-size: 0.8rem;*/
    background-color: #FFFFFF;
    background: url('images/p19.jpg') fixed;
    background-repeat:no-repeat;
    background-position: center;
    background-size: cover;
    background-color:rgba(255,255,255,0.7);
    background-blend-mode:lighten;
    /*background-size: 1150px;*/

}







.greeting1{
  
  /*position: absolute;*/
  /*top: 10%;*/
  /*left: 10%;*/
  /*width:80%;*/
  /*height: auto;*/

 
  /*display: flex;*/
  padding:0 10px;
  margin: 15px;
  justify-content: center;

  /*垂直方向で、要素を中央に配置します。*/
 /* align-items:center;*/
	/*flex-wrap:wrap;*/
}


.greeting1 li img {
 /* width:50%;*/
	/*画像のはみだしを防ぐ*/
	/*height:auto;*/
 margin-top:15vw;
 max-width: 50%;
 max-height: 50%;
 width: auto;
 height: auto;

	border:solid 1px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場合*/
}

.greeting{
    /*height: calc(100vh - 140px);*/
    margin:15px;
    line-height: 5vw;
    color: #191970;
    text-align: left;
    font-size: 3.5vw;
    padding-left: 8px;
    padding-right: 8px;
    

}


.history{
    /*height: calc(100vh - 140px);*/
    color: #191970;
    text-align: left;
    font-size:0.8vw;
    /*font-size: 0.8rem;*/
    line-height: 25px;
    padding-left: 10px;
    background-size   :30% 10%;
    
     background-repeat:no-repeat;
     background-position: center;
   
     
     /*下２行は半透明のコード*/
     background: url('images/company1.jpg') fixed;
     background-color:rgba(255,255,255,0.5);
     background-blend-mode:lighten;
  
}

.history1{
  display: flex;
  justify-content: center;
  
  /*垂直方向で、要素を中央に配置します。*/
  align-items: center;
	flex-wrap:wrap;

}

.history1 li{
  
	padding:0 10px;/*←画像の左右に5pxの余白を入れる場合*/
	margin: 5px;
	box-sizing:border-box;
	list-style-type:none; background-image:none; padding-left:0; 
 /*text-align: center;*/
}

.history1 li img {
	max-width:60%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
	border:solid 0px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場合*/
}

.facility{
  display: flex;
  justify-content: center;
  
  /*垂直方向で、要素を中央に配置します。*/
  align-items: center;
	flex-wrap:wrap;

}

.facility li{
  /*←画像を横に4つ並べる場合*/
  /*width: calc(100%/5);*/
	padding:0 10px;/*←画像の左右に5pxの余白を入れる場合*/
	margin: 5px;
	box-sizing:border-box;
	list-style-type:none; background-image:none; padding-left:0; 
 text-align: center;
}

.facility li img {
	max-width:100%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
	border:solid 0px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場���*/
}



.picture{
  display: flex;
  justify-content: center;
  
  /*垂直方向で、要素を中央に配置します。*/
  align-items: center;
	flex-wrap:wrap;
 
}


.picture li{
  width: calc(100%/2);
	padding:0 10px;
	margin: 5px;
	box-sizing:border-box;
	list-style-type:none; background-image:none; padding-left:0; 
 /*text-align: center;*/
}

.picture li img {
	max-width:100%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
	border:solid 0px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場合*/
}

.work{
  display: flex;
  padding:0 30px;
  margin: 25px;
  justify-content: center;
  
  /*垂直方向で、要素を中央に配置します。*/
  align-items: center;
	flex-wrap:wrap;
}

.work li{
  
	padding:0px;/*←画像の左右に5pxの余白を入れる場合*/
	margin: 12px;
	box-sizing:border-box;
	list-style-type:none; background-image:none; padding-left:0; 
  text-align: center;
}

.work li img {
  
	max-width:85%; /*画像のはみだしを防ぐ*/
	
	width: auto; 
	/*画像の縦横比を維持 */
	
	border:solid 0px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場合*/
}

.efforts{
  display: flex;
  justify-content: center;
  
  /*垂直方向で、要素を中央に配置します。*/
  align-items: center;
	flex-wrap:wrap;
  
}


.efforts img {
	max-width:90%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
	border:solid 0px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場合*/
}



p{
  font-size:5vw;
  color: #000;
  text-align: center;
  font-family:"ヒラギノ明朝 Pro W6",serif;
}

p1{
  font-size:11px;
   
  text-align: left;
  font-family:"ヒラギノ明朝 Pro W6",serif;
}

p2{
  font-size:11px;
   
  text-align: left;
  font-family:"ヒラギノ明朝 Pro W6",serif;
}

h2 {
    text-align: center;
    color: #000;
    font-family:"ヒラギノ明朝 Pro W6",serif;
}


h4{
    text-align: center;
    color: #000;
     font-family:"ヒラギノ明朝 Pro W6",serif;
}

table{
   

  line-height: 25px;
  border-collapse: collapse;
  margin: 0 auto;
  padding: 0;
  max-width: 100vw;
 table-layout: auto;
  color: #000;
  font-size:2.3vw;
}



table th {
 
  
  padding: 0px 0;
  border-right: 1px solid #bbb;
  text-align: center;
}

table tr {
 
  background-color: #fff;
  padding: 10px;
  border-bottom: 1px solid #bbb;
}



table tr:last-child{
  
   border-bottom: none
}

table td {
  
  padding: 1em 1em 1em 1em;
  border-right: 1px solid #bbb;
  text-align: center;
}

table th:last-child,
table td:last-child{
  
  border: none;
}

.access {
margin:7%;    
height: 0;
overflow: hidden;
padding-bottom: 75%;
/*padding-bottom: 56.25%;*/
position: relative;
}

.access iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}

.access  img{
  display:none;
}
/*.access {*/
    /*height: calc(100vh - 140px);*/
    
/*    text-align: center;*/
    /*margin-left:10px;*/
/*    margin-top:5px;*/
/*    margin-bottom:5px;*/
     

/*}*/

/*.access iframe {*/
/*  width: 90vw;*/
/*  height: 110vw;*/
/*  object-fit: cover;*/
  
  
/*}*/


.footer {
    width:auto;
   margin:1%;
    height: 50px;
    text-align: center;
    color: white;
    background-color:#191970;
}






body {
    text-align: center;
    color: rgb(255, 255, 255);
    /*font-size: 1.3vw;*/
    /*background-color: #194680;*/
    /*background-color: white;*/
    padding-top: 20px;
}

#contact-form {
    /*margin: 10px;*/
    /*font-size: 10px;*/
     background-color:#191970;
    text-align: center;
    padding: 3vw;
    padding-right:5vw;
    width: 90%;
    border: black solid 0px;
    border-radius: 10px;
}

button {
    text-align: center;
    margin-top: 20px;
    font-size: 15px;
    color:black;
    border: white solid 2px;
    background-color: white;
    border-radius: 5px;
}

.button-wrapper {
    text-align: center;
}

input,
textarea {
    width: 90%;
}

textarea {
    font-size: 3.7vw;
    height: 150px;
    padding: 3px;
}

input {
    font-size: 3.7vw;
    height: 60px;
}

span {
display: inline-block;
width: 9em;
}  

span1 {
display: inline-block;
width: 5em;
}  
  
   
}