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



.menu {margin-top:80px !important; }
h1 { margin:120px auto 0 auto !important; padding:0 !important; font-size:50px; line-height:50px; font-weight:normal;}
h1::before { content:url(../img/common/wave.png); margin:10px;}
h2 { margin:0 0 0 100px !important; padding:0 !important; font-size:20px !important; line-height:30px !important }
p {margin:50px auto 150px auto; padding:0; font-size:1.6rem; line-height:3.0rem; width:90vw }

h3 { margin:30px auto !important; font-size:2.4rem; line-height:3.0rem; font-weight:normal; position: relative; display: inline-block;padding: 0 80px; font-size:2.0rem; width: -webkit-calc(90vw - 100px) ; width : calc(90vw - 100px) ; }
h3:before, h3:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 45px;
  height: 1px;
  background-color: black;
}

h3:before {
  left:20px;
}
h3:after {
  right: 20px;
}

h4 { margin:30px auto 0 auto; padding:0 5px 0 20px; font-size:2.0rem; line-height:3.0rem; font-weight:normal; width:90vw; text-align:left; border-left:#063 5px solid; border-bottom:#000 1px dotted  }
h5 { margin:50px auto !important; padding:0; font-size:3.0rem; line-height:3.6rem; font-weight:normal; width:90vw; text-align:center; color:#538135; font-family:"notomin" }

.copy { font-size:1.8rem; line-height:2.6rem; }
.photo { width:90vw; margin:50px auto}
figure { display: inline-block;  margin: 0; padding:10px; box-sizing:border-box; width:25vw }
figure img {display: block; padding:2px; border:#999 1px solid; background-color:#FFF; width:100%;box-shadow: 5px 5px 5px rgba(0,0,0,0.3);}
figcaption { font-size:1.8rem; line-height:2.6rem; font-family:"notomin";  text-align: center; margin:10px 0 }
/* flexbox */
.hyou { font-size:2.0rem; line-height:3.0rem; width:90vw; margin:20px auto; }
.hyou dt { width:30%; margin:0; padding:10px; box-sizing:border-box; border-bottom:1px dotted #999999; text-align:center }
.hyou dd { width:65%; margin:0; padding:10px; box-sizing:border-box; border-bottom:1px dotted #999999; border-left:1px dotted #999999; text-align:left; line-height:2.4rem !important  }
.hyou dd dl { width:100%}
.hyou dd dl dt { border:none !important; text-align:left !important; padding:10px 0 !important; width:60% !important}
.hyou dd dl dd { border:none !important; padding:10px !important;width:40% !important}
.history { font-size:20px; line-height:30px; width:670px; margin:0 auto; }
.history dt { width:90px; margin:0; padding:10px 0; box-sizing:border-box; text-align:center }
.history dd { width:490px; margin:0; padding:10px; box-sizing:border-box; text-align:left;  }

.posimid{ height:100%; align-self: center !important;align-items: center;
 justify-content: center; border:none !important;display: flex;}

section{ width:80vw; text-align:left; margin:50px auto; padding:0}
section iframe { margin-bottom:60px}

.result { font-size:20px; line-height:30px; width:90vw; margin:20px auto; text-align:left}
.result dt { width:30%; padding:10px 0; box-sizing:border-box; margin:0; border-bottom:#CCC dotted 1px  }
.result dd { width:65%; padding:10px 5px; box-sizing:border-box; margin:0;border-bottom:#CCC dotted 1px; }
.date { width:5% !important; padding:10px 0 !important }

.results{ width:90vw; margin:20px auto; box-sizing:border-box; display:flex; flex-flow: row wrap; padding:10px; border:#9CF 3px double }
.results div{ width: -webkit-calc(33% - 40px) ; width : calc(33% - 40px) ; max-width:300px; margin:20px; font-size:1.4rem; line-height:2.0rem; box-sizing:border-box ; }
.results div img{ padding:5px; border:#999 1px solid; box-shadow:2px 2px 4px -2px gray}
.results h4 {border-left:#9CF 5px solid !important; border-bottom:
#CCF 1px solid; margin:0 auto !important  }
.subttl_re{
	font-size: 2.0rem;
	line-height: 3.0rem;
	color: #069
}
@media only screen and (max-width: 1200px) {
}

/* ------------------------------
   MEDIAQUERIES LAYOUT
------------------------------ */

@media only screen and (max-width: 1000px) {
.logo{ display:none;}
h2 { font-size:3.0rem; line-height:4.0rem; }
.photo { width:100vw;}
p { text-align:left}
.w20 { width:40%;}
.w80 { width:60%;   }
figure { width:80vw }
h2 { margin:0 !important; text-align:center }
h1 { margin:150px auto 0 auto !important; font-size:30px; line-height:30px;}
h1::before { margin:0 10px 10px -50px;}
h2 { margin:0 0 0 100px !important; padding:0 !important; font-size:20px !important; line-height:30px !important }
.results { width:95vw}
.results div{ width: -webkit-calc(33% - 20px) ; width : calc(33% - 20px) ; margin:20px 10px; }
}


@media print, screen and (max-width: 768px) {
.hyou { width:98vw;  }
.history{ width:98vw}
section{ width:96vw; font-size:90%}
h3 { padding:0; margin:0; width:95vw; color:#9C6; font-size:1.8rem; line-height:2.6rem; }
h3:before, h3:after { content:none;}
h5 {font-size: 2.0rem;line-height: 2.6rem; margin:20px auto 0 auto!important;  }
.history { width:100%; }
.history dd { width: -webkit-calc(100% - 180px) ; width : calc(100% - 180px) ;}
.result dd {width: -webkit-calc(70% - 40px) ; width : calc(70% - 40px) ;}
.date { width:40px !important; background-color:#333; color:#FFF }

}

@media print, screen and (max-width: 500px) {

}

.recruit { margin:50px auto; width:90vw; text-align:left; color:#111111;}
.subttl { border-left:#006 45px solid; height:45px; line-height:45px; font-size:1.7rem; margin:0; padding:0 0 0 30px; box-sizing:border-box} 
.subttl2 { line-height:3.0rem; font-size:1.8rem; margin:30px 0; padding:0; border-bottom:#333 1px dotted } 
.recruit ul { width:100%; margin:0; padding:0; list-style:none; }
.recruit ul li { width:49%; margin:0 1% 0 0; padding:0; float:left; font-size:1.5rem; line-height:40px; }
.recruit ul li img { width:47px; margin:10px 0 0 10px; padding:0; vertical-align:top }
.submit { width:39vw; margin:50px auto; text-align:center; clear: }
.submit input{ background-color:#006; border:#999 outset 3px !important; color:#FFF; padding:5px; width:100%; margin:20px auto; text-align:center; line-height:40px; font-size:2.0rem; cursor:pointer}
.submit2 ul li{ width:100%}
.submit2 ul li{ width:49%; float:left}
.submit2 input{ background-color:#006; border:#999 outset 3px !important; color:#FFF; padding:5px; width:100%; margin:20px auto; text-align:center; line-height:40px; font-size:2.0rem; cursor:pointer}

input[type="text"],
textarea, select {
	outline: none;
	border: 1px solid ##DDDDDD; font-size:1.6rem; line-height:2.6rem; width:90%; height:auto; min-height:40px;
	-webkit-transition: all .3s;
	transition: all .3s;
}
.mini {
	 width:26% !important; }
.medium {
	 width:45% !important; }
.large { height:120px;}

input[type="text"]:focus,
textarea:focus {
	box-shadow: 0 0 7px #1abc9c;
	border: 1px solid #1abc9c; width:150%;
}